docs: add Figma link support to examples #22379
Open
+49
−8
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add support for displaying Figma design links in example components. Examples can now include an example-meta block with a figma URL that will be displayed as an action button in the example toolbar. The exampleMeta computed property was designed with extensibility in mind, allowing for future integrations with other tools such as Storybook. - Add exampleMeta computed property to parse meta data - Add figma icon alias to vuetify plugin - Add view-in-figma i18n translation - Add example-meta block support in vite config - Add example-meta to v-btn readonly example
juanjcardona13
force-pushed
the
docs/example-figma-links
branch
from
08f85b6 to
7820654
Compare
Updated the aliases in the Vuetify plugin to directly reference the existing aliases object, streamlining the code and enhancing maintainability.
johnleider
requested changes
Dec 2, 2025
- Add proper TypeScript types for component with extended properties - Remove unnecessary 'as any' type assertion - Add undefined check for component.value in playgroundLink - Simplify figmaLink computed property
johnleider
reviewed
Dec 2, 2025
johnleider
approved these changes
Dec 2, 2025
juanjcardona13
changed the title
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
This PR adds support for displaying Figma design links in example components. Examples can now include an
example-metablock with a Figma URL that will be displayed as an action button in the example toolbar.The
exampleMetacomputed property was designed with extensibility in mind, allowing for future integrations with other tools such as Storybook.Changes
exampleMetacomputed property to parse meta data from examples andfigmaLinkcomputed property to extract Figma URLsview-in-figmai18n translation keyexample-metablock processing in the Vite build configurationBenefits
Testing
example-metablock with afigmaproperty