chore: Add Code Connect for ButtonHero - #1467
Closed
andrewjcohen wants to merge 3 commits into
Closed
andrewjcohen wants to merge 3 commits into
andrewjcohen wants to merge 3 commits into
Conversation
Contributor
📖 Storybook LinksCompare the preview for this pull request with the latest Storybooks from the 🔀 Pull Request Preview
🌳 Main Branch (Latest)
|
Omit default/optional props when off and drop spread so Figma shows Storybook-style JSX.
Contributor
📖 Storybook LinksCompare the preview for this pull request with the latest Storybooks from the 🔀 Pull Request Preview
🌳 Main Branch (Latest)
|
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.
Description
Adds Figma Code Connect mappings for ButtonHero so Dev Mode shows Storybook-style JSX on both platforms. Size, label, and icons live on the nested ButtonBase instance (not on the ButtonHero set), so mappings follow the same
figma.nestedProps('ButtonBase')pattern as Button.ButtonHero.figma.tsx
New
ButtonHero.figma.tsxfor React Native.Updated
ButtonHero.figma.tsxfor React (retargeted from the previous Figma node to9309-7848).Matched props
ButtonBase.size→size(ButtonHeroSize, viafigma.nestedProps('ButtonBase'))ButtonBase.label→ children (viafigma.nestedProps('ButtonBase'))startIcon (Figma Only)→startIconName(IconName.Addwhen true)endIcon (Figma Only)→endIconName(IconName.Addwhen true)_Loading Labelshow loadingText/loadingText→loadingText(viafigma.nestedProps('_Loading Label'))isLoading→isLoadingisDisabled→isDisabledIntentionally omits Figma-only properties:
state (Figma Only),hasAvatar (Figma Only),hasBadge (Figma Only)Related issues
Fixes:
Manual testing steps
size(Sm / Md / Lg) and verifysize={ButtonHeroSize.*}updatesstartIcon (Figma Only)/endIcon (Figma Only)and confirmstartIconName/endIconNameappear or dropisLoadingandshow loadingTextand confirmloadingTextmaps correctlyisDisabledand confirm the snippet updatesErrorbadges on nested props)Screenshots/Recordings
Before
After
Pre-merge author checklist
Pre-merge reviewer checklist