feat: add Figma Code Connect POC for DsButtonV3 and DsSplitButton#534
Draft
Haiylo-Batel wants to merge 1 commit into
Draft
feat: add Figma Code Connect POC for DsButtonV3 and DsSplitButton#534Haiylo-Batel wants to merge 1 commit into
Haiylo-Batel wants to merge 1 commit into
Conversation
- Add figma.config.json with Code Connect CLI configuration - Add ds-button-v3.figma.ts mapping DAP_Button_v03 variants to code props - Add ds-split-button.figma.ts mapping DAP_SplitButton_v01 to code props - Add @figma/code-connect devDependency (v1.4.7) - Add @figma/code-connect/figma-types to design-system tsconfig
❌ Deploy Preview for drivenets-design-system failed.
|
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
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.
Summary
POC for Figma Code Connect — links DS components to their Figma counterparts so developers see correct, dynamic code snippets in Dev Mode instead of Figma's auto-generated (often incorrect) output.
What's included
figma.config.json(repo root) — Code Connect CLI config@figma/code-connectadded as root devDependency (v1.4.7)tsconfig.json(design-system) — added@figma/code-connect/figma-typestotypes.figma.tstemplate files:ds-button-v3/ds-button-v3.figma.ts— maps DAP_Button_v03 (Variant, Color, light, Size, disabled, selected)ds-split-button/ds-split-button.figma.ts— maps DAP_SplitButton_v01 (disabled state)Current state
Both mappings are published and working in Dev Mode on the DAP Design System 1.2 library file (published manually for this POC).
Notes for future adoption
figma connect publishshould run on merge to main with a Figma service account token (scopes: Code Connect → Write, File content → Read).figma.tsfiles per component as they're touched — no big-bang migration needed