CARVIEW |
Select Language
HTTP/2 200
date: Wed, 30 Jul 2025 21:16:10 GMT
content-type: text/html; charset=utf-8
vary: X-PJAX, X-PJAX-Container, Turbo-Visit, Turbo-Frame, X-Requested-With,Accept-Encoding, Accept, X-Requested-With
etag: W/"6ba1652a5fd9aa24928e14c47ec6b80d"
cache-control: max-age=0, private, must-revalidate
strict-transport-security: max-age=31536000; includeSubdomains; preload
x-frame-options: deny
x-content-type-options: nosniff
x-xss-protection: 0
referrer-policy: no-referrer-when-downgrade
content-security-policy: default-src 'none'; base-uri 'self'; child-src github.githubassets.com github.com/assets-cdn/worker/ github.com/assets/ gist.github.com/assets-cdn/worker/; connect-src 'self' uploads.github.com www.githubstatus.com collector.github.com raw.githubusercontent.com api.github.com github-cloud.s3.amazonaws.com github-production-repository-file-5c1aeb.s3.amazonaws.com github-production-upload-manifest-file-7fdce7.s3.amazonaws.com github-production-user-asset-6210df.s3.amazonaws.com *.rel.tunnels.api.visualstudio.com wss://*.rel.tunnels.api.visualstudio.com objects-origin.githubusercontent.com copilot-proxy.githubusercontent.com proxy.individual.githubcopilot.com proxy.business.githubcopilot.com proxy.enterprise.githubcopilot.com *.actions.githubusercontent.com wss://*.actions.githubusercontent.com productionresultssa0.blob.core.windows.net/ productionresultssa1.blob.core.windows.net/ productionresultssa2.blob.core.windows.net/ productionresultssa3.blob.core.windows.net/ productionresultssa4.blob.core.windows.net/ productionresultssa5.blob.core.windows.net/ productionresultssa6.blob.core.windows.net/ productionresultssa7.blob.core.windows.net/ productionresultssa8.blob.core.windows.net/ productionresultssa9.blob.core.windows.net/ productionresultssa10.blob.core.windows.net/ productionresultssa11.blob.core.windows.net/ productionresultssa12.blob.core.windows.net/ productionresultssa13.blob.core.windows.net/ productionresultssa14.blob.core.windows.net/ productionresultssa15.blob.core.windows.net/ productionresultssa16.blob.core.windows.net/ productionresultssa17.blob.core.windows.net/ productionresultssa18.blob.core.windows.net/ productionresultssa19.blob.core.windows.net/ github-production-repository-image-32fea6.s3.amazonaws.com github-production-release-asset-2e65be.s3.amazonaws.com insights.github.com wss://alive.github.com wss://alive-staging.github.com api.githubcopilot.com api.individual.githubcopilot.com api.business.githubcopilot.com api.enterprise.githubcopilot.com; font-src github.githubassets.com; form-action 'self' github.com gist.github.com copilot-workspace.githubnext.com objects-origin.githubusercontent.com; frame-ancestors 'none'; frame-src viewscreen.githubusercontent.com notebooks.githubusercontent.com; img-src 'self' data: blob: github.githubassets.com media.githubusercontent.com camo.githubusercontent.com identicons.github.com avatars.githubusercontent.com private-avatars.githubusercontent.com github-cloud.s3.amazonaws.com objects.githubusercontent.com release-assets.githubusercontent.com secured-user-images.githubusercontent.com/ user-images.githubusercontent.com/ private-user-images.githubusercontent.com opengraph.githubassets.com copilotprodattachments.blob.core.windows.net/github-production-copilot-attachments/ github-production-user-asset-6210df.s3.amazonaws.com customer-stories-feed.github.com spotlights-feed.github.com objects-origin.githubusercontent.com *.githubusercontent.com; manifest-src 'self'; media-src github.com user-images.githubusercontent.com/ secured-user-images.githubusercontent.com/ private-user-images.githubusercontent.com github-production-user-asset-6210df.s3.amazonaws.com gist.github.com; script-src github.githubassets.com; style-src 'unsafe-inline' github.githubassets.com; upgrade-insecure-requests; worker-src github.githubassets.com github.com/assets-cdn/worker/ github.com/assets/ gist.github.com/assets-cdn/worker/
server: github.com
content-encoding: gzip
accept-ranges: bytes
set-cookie: _gh_sess=m0XwW2%2Bo1Lr%2Fv4nya0RPosv8L%2Btj6hm6F2bzeod3PZpO7x0O4La%2B3RwAf6q8hGaGx3VlJG2ek%2BOnASvJ8ruI6xFm8WJkOKrtovCXZHFEuSrtZpvgADLUs9epTPbjj6FTskgoeXCMdlayEwyxbPo1FcqUGHZ1ybsbAhl%2FP7yY%2Fl%2B5zS2J%2FEWjzXc1EK94JgwzM19C%2FRCLs3xerUmvspbDvGg3W51AU%2BQ1Fy4%2BmztEmTvab1QdVKLJlGU89%2F5acxRhlZqcFFjlyh4O4u%2BKZ7kPyA%3D%3D--yhftKDRRu0VpVbI5--HX45EPBq7KzlP5ZWaB9GIg%3D%3D; Path=/; HttpOnly; Secure; SameSite=Lax
set-cookie: _octo=GH1.1.1191756890.1753910170; Path=/; Domain=github.com; Expires=Thu, 30 Jul 2026 21:16:10 GMT; Secure; SameSite=Lax
set-cookie: logged_in=no; Path=/; Domain=github.com; Expires=Thu, 30 Jul 2026 21:16:10 GMT; HttpOnly; Secure; SameSite=Lax
x-github-request-id: 8B8A:1E1938:3E3D3:58E47:688A8B9A
Component Status · arielsalminen/vue-design-system Wiki · GitHub
Skip to content
Navigation Menu
{{ message }}
-
Notifications
You must be signed in to change notification settings - Fork 223
Component Status
Ariel Salminen edited this page Jan 17, 2025
·
18 revisions
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
- Getting Started: How to install and run Vue Design System.
- Terminology: Introduction to the system concepts and its hierarchy.
- Naming of Things: Naming is hard, so it’s good to have clear guidelines.
- Directory Structure: What goes where and why.
-
Working with the System: Concrete examples on how to work with
Tokens
,Elements
,Patterns
andTemplates
. - Editing Living Documentation: How to customize the living system documentation.
- Spacing: A framework for creating a predictable and harmonious spacing.
- Component Status: Clear labels that reflect the state of completion.
- Component QA: How to review new components and keep the quality high.
- Contributing: A set of guidelines for contributing to the system.
- Code of Conduct: By participating you agree to abide by its terms.
- Frequently Asked Questions: How to use icons, how to use font-face, etc.
- Changelog: See releases pafge for the full changelog.
You can’t perform that action at this time.