Component Status

Components in the system are labelled with status labels that reflect their state of completion. This is achieved using status option:

<script>
  /**
   * My Heading component
   */
  export default {
    name: "Heading",
    status: "prototype",
    release: "1.0.0"
  }
</script>

For a concrete example, see ExampleComponent.vue. You can see all available statuses listed below:

Label	Color	Description
deprecated	Red	Component is deprecated
prototype	Blue	Prototype, do not implement!
under-review	Yellow	Component is currently being reviewed
ready	Green	Ready to be used.

For an example of how this looks like in the living system documentation, see Vue Design System Example Docs