@seed-design/figma 0.0.20 → 0.0.21

package/lib/index.cjs

@@ -143,6 +143,10 @@ function createRestNormalizer(ctx) {
                 if (mainComponent) {
                     componentProperties[key].componentKey = mainComponent.key;
                 }
+                const mainComponentSet = mainComponent.componentSetId ? ctx.componentSets[mainComponent.componentSetId] : undefined;
+                if (mainComponentSet) {
+                    componentProperties[key].componentSetKey = mainComponentSet.key;
+                }
             }
         }
         return {
@@ -331,6 +335,9 @@ function createPluginNormalizer() {
                 const mainComponent = await figma.getNodeByIdAsync(value.value);
                 if (mainComponent) {
                     componentProperties[key].componentKey = mainComponent.key;
+                    if (mainComponent.parent?.type === "COMPONENT_SET") {
+                        componentProperties[key].componentSetKey = mainComponent.parent.key;
+                    }
                 }
             }
         }
@@ -613,7 +620,7 @@ function inferLayout(parentNode) {
     };
     if (children.length === 0) {
         return {
-            properties: {},
+            properties: result,
             childProperties: {}
         }; // Cannot infer layout for no children
     }
@@ -12674,7 +12681,7 @@ const createTextButtonTransformer = (ctx)=>defineComponentTransformer(metadata$2
     });
 
 const createTextFieldTransformer = (ctx)=>defineComponentTransformer(metadata$1.key, ({ componentProperties: props })=>{
-        const { Size: { value: size }, State: { value: state }, Filled: { value: filled }, "Show Header#870:0": { value: showHeader }, "Label#14964:0": { value: label }, "Show Indicator#1259:0": { value: showIndicator }, "Indicator#15327:249": { value: indicator }, "Show Prefix#958:125": { value: showPrefix }, "Show Prefix Icon#1267:50": { value: showPrefixIcon }, "Prefix Icon#1267:25": { value: prefixIcon }, "Show Prefix Text#1267:0": { value: showPrefixText }, "Prefix Text#15327:101": { value: prefix }, "Placeholder#958:0": { value: placeholder }, "Filled Text#1304:0": { value: defaultValue }, "Show Suffix#958:100": { value: showSuffix }, "Show Suffix Icon#1267:75": { value: showSuffixIcon }, "Suffix Icon #1267:100": { value: suffixIcon }, "Show Suffix Text#1267:125": { value: showSuffixText }, "Suffix Text#15327:138": { value: suffix }, "Show Footer#958:25": { value: showFooter }, "Show Description#958:50": { value: showDescription }, "Description#12626:5": { value: description }, "Show Character Count#958:75": { value: showCharacterCount }, "Character Count#15327:64": { value: _characterCount }, "Max Character Count#15327:27": { value: maxCharacterCount } } = props;
+        const { Size: { value: size }, State: { value: state }, Filled: { value: filled }, "Show Header#870:0": { value: showHeader }, "Label#14964:0": { value: label }, "Show Indicator#1259:0": { value: showIndicator }, "Indicator#15327:249": { value: indicator }, "Show Prefix#958:125": { value: showPrefix }, "Show Prefix Icon#1267:50": { value: showPrefixIcon }, "Prefix Icon#1267:25": { componentKey: prefixIcon }, "Show Prefix Text#1267:0": { value: showPrefixText }, "Prefix Text#15327:101": { value: prefix }, "Placeholder#958:0": { value: placeholder }, "Filled Text#1304:0": { value: defaultValue }, "Show Suffix#958:100": { value: showSuffix }, "Show Suffix Icon#1267:75": { value: showSuffixIcon }, "Suffix Icon #1267:100": { componentKey: suffixIcon }, "Show Suffix Text#1267:125": { value: showSuffixText }, "Suffix Text#15327:138": { value: suffix }, "Show Footer#958:25": { value: showFooter }, "Show Description#958:50": { value: showDescription }, "Description#12626:5": { value: description }, "Show Character Count#958:75": { value: showCharacterCount }, "Character Count#15327:64": { value: _characterCount }, "Max Character Count#15327:27": { value: maxCharacterCount } } = props;
         const states = state.split("-");
         const commonProps = {
             size: handleSizeProp(size),

package/lib/index.d.ts

@@ -50,6 +50,7 @@ interface NormalizedInstanceNode extends NormalizedFrameTrait {
     componentProperties: {
         [key: string]: FigmaRestSpec.ComponentProperty & {
             componentKey?: string;
+            componentSetKey?: string;
         };
     };
     componentKey: string;
@@ -78,17 +79,6 @@ declare function createRestNormalizer(ctx: RestNormalizerContext): (node: FigmaR
 
 declare function createPluginNormalizer(): (node: SceneNode) => Promise<NormalizedSceneNode>;
 
-interface CodegenTransformerDeps {
-    frameTransformer: ElementTransformer<NormalizedFrameNode | NormalizedComponentNode | NormalizedInstanceNode>;
-    textTransformer: ElementTransformer<NormalizedTextNode>;
-    rectangleTransformer: ElementTransformer<NormalizedRectangleNode>;
-    instanceTransformer: ElementTransformer<NormalizedInstanceNode>;
-    vectorTransformer: ElementTransformer<NormalizedVectorNode>;
-    booleanOperationTransformer: ElementTransformer<NormalizedBooleanOperationNode>;
-    shouldInferAutoLayout: boolean;
-}
-declare function createCodegenTransformer({ frameTransformer, textTransformer, rectangleTransformer, instanceTransformer, vectorTransformer, booleanOperationTransformer, shouldInferAutoLayout, }: CodegenTransformerDeps): (node: NormalizedSceneNode) => ElementNode | undefined;
-
 interface ElementNode {
     __IS_JSX_ELEMENT_NODE: true;
     tag: string;
@@ -109,6 +99,20 @@ declare function cloneElement(element: ElementNode, props?: Record<string, strin
     source?: string;
 };
 
+type ElementTransformer<T extends NormalizedSceneNode> = (node: T, traverse: (node: NormalizedSceneNode) => ElementNode | undefined) => ElementNode | undefined;
+declare function defineElementTransformer<T extends NormalizedSceneNode>(transformer: ElementTransformer<T>): ElementTransformer<T>;
+
+interface CodegenTransformerDeps {
+    frameTransformer: ElementTransformer<NormalizedFrameNode | NormalizedComponentNode | NormalizedInstanceNode>;
+    textTransformer: ElementTransformer<NormalizedTextNode>;
+    rectangleTransformer: ElementTransformer<NormalizedRectangleNode>;
+    instanceTransformer: ElementTransformer<NormalizedInstanceNode>;
+    vectorTransformer: ElementTransformer<NormalizedVectorNode>;
+    booleanOperationTransformer: ElementTransformer<NormalizedBooleanOperationNode>;
+    shouldInferAutoLayout: boolean;
+}
+declare function createCodegenTransformer({ frameTransformer, textTransformer, rectangleTransformer, instanceTransformer, vectorTransformer, booleanOperationTransformer, shouldInferAutoLayout, }: CodegenTransformerDeps): (node: NormalizedSceneNode) => ElementNode | undefined;
+
 interface ComponentTransformer<T extends NormalizedInstanceNode["componentProperties"] = NormalizedInstanceNode["componentProperties"]> {
     key: string;
     transform: (node: NormalizedInstanceNode & {
@@ -137,9 +141,6 @@ type InferFromDefinition<T extends Record<string, ComponentPropertyDefinition>>
     };
 };
 
-type ElementTransformer<T extends NormalizedSceneNode> = (node: T, traverse: (node: NormalizedSceneNode) => ElementNode | undefined) => ElementNode | undefined;
-declare function defineElementTransformer<T extends NormalizedSceneNode>(transformer: ElementTransformer<T>): ElementTransformer<T>;
-
 interface IconData {
     name: string;
     type: "monochrome" | "multicolor";
@@ -417,7 +418,8 @@ type index$1_BooleanOperationTransformerDeps = BooleanOperationTransformerDeps;
 type index$1_FillProps = FillProps;
 type index$1_VectorTransformerDeps = VectorTransformerDeps;
 declare namespace index$1 {
-  export { type index$1_BooleanOperationTransformerDeps as BooleanOperationTransformerDeps, type ContainerLayoutProps$1 as ContainerLayoutProps, type ContainerLayoutTrait$1 as ContainerLayoutTrait, type CreateContextOptions$1 as CreateContextOptions, type index$1_FillProps as FillProps, type FillTrait$1 as FillTrait, type FrameTransformerDeps$1 as FrameTransformerDeps, type InstanceTransformerDeps$1 as InstanceTransformerDeps, type PropsTransformers$1 as PropsTransformers, type RadiusProps$1 as RadiusProps, type RadiusTrait$1 as RadiusTrait, type RectangleTransformerDeps$1 as RectangleTransformerDeps, type SelfLayoutProps$1 as SelfLayoutProps, type SelfLayoutTrait$1 as SelfLayoutTrait, type StrokeProps$1 as StrokeProps, type StrokeTrait$1 as StrokeTrait, type TextTransformerDeps$1 as TextTransformerDeps, type TypeStyleProps$1 as TypeStyleProps, type TypeStyleTrait$1 as TypeStyleTrait, type index$1_VectorTransformerDeps as VectorTransformerDeps, createBooleanOperationTransformer$1 as createBooleanOperationTransformer, createContainerLayoutPropsTransformer$1 as createContainerLayoutPropsTransformer, createContext$1 as createContext, createFrameFillPropsTransformer$1 as createFrameFillPropsTransformer, createFrameTransformer$1 as createFrameTransformer, createInstanceTransformer$1 as createInstanceTransformer, createRadiusPropsTransformer$1 as createRadiusPropsTransformer, createRectangleTransformer$1 as createRectangleTransformer, createSelfLayoutPropsTransformer$1 as createSelfLayoutPropsTransformer, createShapeFillPropsTransformer$1 as createShapeFillPropsTransformer, createStrokePropsTransformer$1 as createStrokePropsTransformer, createTextFillPropsTransformer$1 as createTextFillPropsTransformer, createTextTransformer$1 as createTextTransformer, createTypeStylePropsTransformer$1 as createTypeStylePropsTransformer, createVectorTransformer$1 as createVectorTransformer };
+  export { createBooleanOperationTransformer$1 as createBooleanOperationTransformer, createContainerLayoutPropsTransformer$1 as createContainerLayoutPropsTransformer, createContext$1 as createContext, createFrameFillPropsTransformer$1 as createFrameFillPropsTransformer, createFrameTransformer$1 as createFrameTransformer, createInstanceTransformer$1 as createInstanceTransformer, createRadiusPropsTransformer$1 as createRadiusPropsTransformer, createRectangleTransformer$1 as createRectangleTransformer, createSelfLayoutPropsTransformer$1 as createSelfLayoutPropsTransformer, createShapeFillPropsTransformer$1 as createShapeFillPropsTransformer, createStrokePropsTransformer$1 as createStrokePropsTransformer, createTextFillPropsTransformer$1 as createTextFillPropsTransformer, createTextTransformer$1 as createTextTransformer, createTypeStylePropsTransformer$1 as createTypeStylePropsTransformer, createVectorTransformer$1 as createVectorTransformer };
+  export type { index$1_BooleanOperationTransformerDeps as BooleanOperationTransformerDeps, ContainerLayoutProps$1 as ContainerLayoutProps, ContainerLayoutTrait$1 as ContainerLayoutTrait, CreateContextOptions$1 as CreateContextOptions, index$1_FillProps as FillProps, FillTrait$1 as FillTrait, FrameTransformerDeps$1 as FrameTransformerDeps, InstanceTransformerDeps$1 as InstanceTransformerDeps, PropsTransformers$1 as PropsTransformers, RadiusProps$1 as RadiusProps, RadiusTrait$1 as RadiusTrait, RectangleTransformerDeps$1 as RectangleTransformerDeps, SelfLayoutProps$1 as SelfLayoutProps, SelfLayoutTrait$1 as SelfLayoutTrait, StrokeProps$1 as StrokeProps, StrokeTrait$1 as StrokeTrait, TextTransformerDeps$1 as TextTransformerDeps, TypeStyleProps$1 as TypeStyleProps, TypeStyleTrait$1 as TypeStyleTrait, index$1_VectorTransformerDeps as VectorTransformerDeps };
 }
 
 interface PropsTransformers {
@@ -1972,6 +1974,7 @@ declare const createSeedComponentTransformers: (ctx: SeedComponentTransformerDep
     [k: string]: ComponentTransformer<{
         [key: string]: FigmaRestSpec.ComponentProperty & {
             componentKey?: string;
+            componentSetKey?: string;
         };
     }>;
 };
@@ -2065,7 +2068,8 @@ declare const index_createTextTransformer: typeof createTextTransformer;
 declare const index_createTypeStylePropsTransformer: typeof createTypeStylePropsTransformer;
 declare const index_createVectorTransformer: typeof createVectorTransformer;
 declare namespace index {
-  export { type index_ActionButtonProperties as ActionButtonProperties, type index_ActionChipProperties as ActionChipProperties, type index_ActionSheetItemProperties as ActionSheetItemProperties, type index_ActionSheetProperties as ActionSheetProperties, type index_AppBarLeftProperties as AppBarLeftProperties, type index_AppBarMainProperties as AppBarMainProperties, type index_AppBarProperties as AppBarProperties, type index_AppBarRightProperties as AppBarRightProperties, type index_AvatarProperties as AvatarProperties, type index_AvatarStackProperties as AvatarStackProperties, type index_BadgeProperties as BadgeProperties, type index_CalloutProperties as CalloutProperties, type index_CheckboxProperties as CheckboxProperties, type index_ChipTabsItemProperties as ChipTabsItemProperties, type index_ChipTabsProperties as ChipTabsProperties, type index_ContainerLayoutProps as ContainerLayoutProps, type index_ContainerLayoutTrait as ContainerLayoutTrait, type index_ControlChipProperties as ControlChipProperties, type index_CreateContextOptions as CreateContextOptions, type index_ErrorStateProperties as ErrorStateProperties, type index_ExtendedActionSheetGroupProperties as ExtendedActionSheetGroupProperties, type index_ExtendedActionSheetItemProperties as ExtendedActionSheetItemProperties, type index_ExtendedActionSheetProperties as ExtendedActionSheetProperties, type index_ExtendedFabProperties as ExtendedFabProperties, type index_FabProperties as FabProperties, type index_FillTrait as FillTrait, type index_FrameFillProps as FrameFillProps, type index_FrameTransformerDeps as FrameTransformerDeps, type index_HelpBubbleProperties as HelpBubbleProperties, type index_IconSelfLayoutProps as IconSelfLayoutProps, type index_IdentityPlaceholderProperties as IdentityPlaceholderProperties, type index_InlineBannerProperties as InlineBannerProperties, type index_InstanceTransformerDeps as InstanceTransformerDeps, type index_MannerTempBadgeProperties as MannerTempBadgeProperties, type index_MultilineTextFieldProperties as MultilineTextFieldProperties, type index_ProgressCircleProperties as ProgressCircleProperties, type index_PropsTransformers as PropsTransformers, type index_RadiusProps as RadiusProps, type index_RadiusTrait as RadiusTrait, type index_ReactionButtonProperties as ReactionButtonProperties, type index_RectangleTransformerDeps as RectangleTransformerDeps, type index_SeedComponentTransformerDeps as SeedComponentTransformerDeps, type index_SegmentedControlItemProperties as SegmentedControlItemProperties, type index_SegmentedControlProperties as SegmentedControlProperties, type index_SelectBoxGroupProperties as SelectBoxGroupProperties, type index_SelectBoxProperties as SelectBoxProperties, type index_SelfLayoutProps as SelfLayoutProps, type index_SelfLayoutTrait as SelfLayoutTrait, type index_ShapeFillProps as ShapeFillProps, type index_SkeletonProperties as SkeletonProperties, type index_SnackbarProperties as SnackbarProperties, type index_StrokeProps as StrokeProps, type index_StrokeTrait as StrokeTrait, type index_SwitchProperties as SwitchProperties, type index_TabsFillItemProperties as TabsFillItemProperties, type index_TabsHugItemProperties as TabsHugItemProperties, type index_TabsProperties as TabsProperties, type index_TextButtonProperties as TextButtonProperties, type index_TextFieldProperties as TextFieldProperties, type index_TextFillProps as TextFillProps, type index_TextTransformerDeps as TextTransformerDeps, type index_ToggleButtonProperties as ToggleButtonProperties, type index_TypeStyleProps as TypeStyleProps, type index_TypeStyleTrait as TypeStyleTrait, index_createBooleanOperationTransformer as createBooleanOperationTransformer, index_createContainerLayoutPropsTransformer as createContainerLayoutPropsTransformer, index_createContext as createContext, index_createFrameFillPropsTransformer as createFrameFillPropsTransformer, index_createFrameTransformer as createFrameTransformer, index_createIconSelfLayoutPropsTransformer as createIconSelfLayoutPropsTransformer, index_createInstanceTransformer as createInstanceTransformer, index_createRadiusPropsTransformer as createRadiusPropsTransformer, index_createRectangleTransformer as createRectangleTransformer, index_createSeedComponentTransformers as createSeedComponentTransformers, index_createSelfLayoutPropsTransformer as createSelfLayoutPropsTransformer, index_createShapeFillPropsTransformer as createShapeFillPropsTransformer, index_createStrokePropsTransformer as createStrokePropsTransformer, index_createTextFillPropsTransformer as createTextFillPropsTransformer, index_createTextTransformer as createTextTransformer, index_createTypeStylePropsTransformer as createTypeStylePropsTransformer, index_createVectorTransformer as createVectorTransformer };
+  export { index_createBooleanOperationTransformer as createBooleanOperationTransformer, index_createContainerLayoutPropsTransformer as createContainerLayoutPropsTransformer, index_createContext as createContext, index_createFrameFillPropsTransformer as createFrameFillPropsTransformer, index_createFrameTransformer as createFrameTransformer, index_createIconSelfLayoutPropsTransformer as createIconSelfLayoutPropsTransformer, index_createInstanceTransformer as createInstanceTransformer, index_createRadiusPropsTransformer as createRadiusPropsTransformer, index_createRectangleTransformer as createRectangleTransformer, index_createSeedComponentTransformers as createSeedComponentTransformers, index_createSelfLayoutPropsTransformer as createSelfLayoutPropsTransformer, index_createShapeFillPropsTransformer as createShapeFillPropsTransformer, index_createStrokePropsTransformer as createStrokePropsTransformer, index_createTextFillPropsTransformer as createTextFillPropsTransformer, index_createTextTransformer as createTextTransformer, index_createTypeStylePropsTransformer as createTypeStylePropsTransformer, index_createVectorTransformer as createVectorTransformer };
+  export type { index_ActionButtonProperties as ActionButtonProperties, index_ActionChipProperties as ActionChipProperties, index_ActionSheetItemProperties as ActionSheetItemProperties, index_ActionSheetProperties as ActionSheetProperties, index_AppBarLeftProperties as AppBarLeftProperties, index_AppBarMainProperties as AppBarMainProperties, index_AppBarProperties as AppBarProperties, index_AppBarRightProperties as AppBarRightProperties, index_AvatarProperties as AvatarProperties, index_AvatarStackProperties as AvatarStackProperties, index_BadgeProperties as BadgeProperties, index_CalloutProperties as CalloutProperties, index_CheckboxProperties as CheckboxProperties, index_ChipTabsItemProperties as ChipTabsItemProperties, index_ChipTabsProperties as ChipTabsProperties, index_ContainerLayoutProps as ContainerLayoutProps, index_ContainerLayoutTrait as ContainerLayoutTrait, index_ControlChipProperties as ControlChipProperties, index_CreateContextOptions as CreateContextOptions, index_ErrorStateProperties as ErrorStateProperties, index_ExtendedActionSheetGroupProperties as ExtendedActionSheetGroupProperties, index_ExtendedActionSheetItemProperties as ExtendedActionSheetItemProperties, index_ExtendedActionSheetProperties as ExtendedActionSheetProperties, index_ExtendedFabProperties as ExtendedFabProperties, index_FabProperties as FabProperties, index_FillTrait as FillTrait, index_FrameFillProps as FrameFillProps, index_FrameTransformerDeps as FrameTransformerDeps, index_HelpBubbleProperties as HelpBubbleProperties, index_IconSelfLayoutProps as IconSelfLayoutProps, index_IdentityPlaceholderProperties as IdentityPlaceholderProperties, index_InlineBannerProperties as InlineBannerProperties, index_InstanceTransformerDeps as InstanceTransformerDeps, index_MannerTempBadgeProperties as MannerTempBadgeProperties, index_MultilineTextFieldProperties as MultilineTextFieldProperties, index_ProgressCircleProperties as ProgressCircleProperties, index_PropsTransformers as PropsTransformers, index_RadiusProps as RadiusProps, index_RadiusTrait as RadiusTrait, index_ReactionButtonProperties as ReactionButtonProperties, index_RectangleTransformerDeps as RectangleTransformerDeps, index_SeedComponentTransformerDeps as SeedComponentTransformerDeps, index_SegmentedControlItemProperties as SegmentedControlItemProperties, index_SegmentedControlProperties as SegmentedControlProperties, index_SelectBoxGroupProperties as SelectBoxGroupProperties, index_SelectBoxProperties as SelectBoxProperties, index_SelfLayoutProps as SelfLayoutProps, index_SelfLayoutTrait as SelfLayoutTrait, index_ShapeFillProps as ShapeFillProps, index_SkeletonProperties as SkeletonProperties, index_SnackbarProperties as SnackbarProperties, index_StrokeProps as StrokeProps, index_StrokeTrait as StrokeTrait, index_SwitchProperties as SwitchProperties, index_TabsFillItemProperties as TabsFillItemProperties, index_TabsHugItemProperties as TabsHugItemProperties, index_TabsProperties as TabsProperties, index_TextButtonProperties as TextButtonProperties, index_TextFieldProperties as TextFieldProperties, index_TextFillProps as TextFillProps, index_TextTransformerDeps as TextTransformerDeps, index_ToggleButtonProperties as ToggleButtonProperties, index_TypeStyleProps as TypeStyleProps, index_TypeStyleTrait as TypeStyleTrait };
 }
 
 declare function generateJsxTree(node: NormalizedSceneNode, options?: Partial<CreateContextOptions>): ElementNode | undefined;
@@ -2076,4 +2080,5 @@ declare function generateFigmaSummary(node: NormalizedSceneNode, options?: Parti
     shouldPrintSource?: boolean;
 }): string | undefined;
 
-export { type CodegenTransformerDeps, type ComponentPropertyDefinition, type ComponentTransformer, type ElementNode, type ElementTransformer, type IconData, type IconRepository, type IconService, type InferFromDefinition, type InferPropertyType, type NormalizedBooleanOperationNode, type NormalizedComponentNode, type NormalizedCornerTrait, type NormalizedDefaultShapeTrait, type NormalizedFrameNode, type NormalizedFrameTrait, type NormalizedHasChildrenTrait, type NormalizedHasFramePropertiesTrait, type NormalizedHasGeometryTrait, type NormalizedHasLayoutTrait, type NormalizedInstanceNode, type NormalizedIsLayerTrait, type NormalizedRectangleNode, type NormalizedSceneNode, type NormalizedTextNode, type NormalizedTextSegment, type NormalizedTypePropertiesTrait, type NormalizedUnhandledNode, type NormalizedVectorNode, type PropsTransformer, type Style, type StyleRepository, type StyleService, type StyleType, type ValueTransformer, type Variable, type VariableCollection, type VariableRepository, type VariableService, type VariableServiceDeps, type VariableType, type VariableValue, type VariableValueResolved, cloneElement, createCodegenTransformer, createElement, createIconService, createPluginNormalizer, createPropsTransformer, createRestNormalizer, createStaticIconRepository, createStaticStyleRepository, createStaticVariableRepository, createStyleService, createValueTransformer, createVariableService, defineComponentTransformer, defineElementTransformer, definePropsTransformer, index$1 as figma, generateCode, generateFigmaSummary, generateJsxTree, getFigmaColorVariableNames, getFigmaStyleKey, getFigmaVariableKey, iconRepository, inferLayout, index as react, styleRepository, variableRepository };
+export { cloneElement, createCodegenTransformer, createElement, createIconService, createPluginNormalizer, createPropsTransformer, createRestNormalizer, createStaticIconRepository, createStaticStyleRepository, createStaticVariableRepository, createStyleService, createValueTransformer, createVariableService, defineComponentTransformer, defineElementTransformer, definePropsTransformer, index$1 as figma, generateCode, generateFigmaSummary, generateJsxTree, getFigmaColorVariableNames, getFigmaStyleKey, getFigmaVariableKey, iconRepository, inferLayout, index as react, styleRepository, variableRepository };
+export type { CodegenTransformerDeps, ComponentPropertyDefinition, ComponentTransformer, ElementNode, ElementTransformer, IconData, IconRepository, IconService, InferFromDefinition, InferPropertyType, NormalizedBooleanOperationNode, NormalizedComponentNode, NormalizedCornerTrait, NormalizedDefaultShapeTrait, NormalizedFrameNode, NormalizedFrameTrait, NormalizedHasChildrenTrait, NormalizedHasFramePropertiesTrait, NormalizedHasGeometryTrait, NormalizedHasLayoutTrait, NormalizedInstanceNode, NormalizedIsLayerTrait, NormalizedRectangleNode, NormalizedSceneNode, NormalizedTextNode, NormalizedTextSegment, NormalizedTypePropertiesTrait, NormalizedUnhandledNode, NormalizedVectorNode, PropsTransformer, Style, StyleRepository, StyleService, StyleType, ValueTransformer, Variable, VariableCollection, VariableRepository, VariableService, VariableServiceDeps, VariableType, VariableValue, VariableValueResolved };

package/lib/index.js

@@ -143,6 +143,10 @@ function createRestNormalizer(ctx) {
                 if (mainComponent) {
                     componentProperties[key].componentKey = mainComponent.key;
                 }
+                const mainComponentSet = mainComponent.componentSetId ? ctx.componentSets[mainComponent.componentSetId] : undefined;
+                if (mainComponentSet) {
+                    componentProperties[key].componentSetKey = mainComponentSet.key;
+                }
             }
         }
         return {
@@ -331,6 +335,9 @@ function createPluginNormalizer() {
                 const mainComponent = await figma.getNodeByIdAsync(value.value);
                 if (mainComponent) {
                     componentProperties[key].componentKey = mainComponent.key;
+                    if (mainComponent.parent?.type === "COMPONENT_SET") {
+                        componentProperties[key].componentSetKey = mainComponent.parent.key;
+                    }
                 }
             }
         }
@@ -613,7 +620,7 @@ function inferLayout(parentNode) {
     };
     if (children.length === 0) {
         return {
-            properties: {},
+            properties: result,
             childProperties: {}
         }; // Cannot infer layout for no children
     }
@@ -12674,7 +12681,7 @@ const createTextButtonTransformer = (ctx)=>defineComponentTransformer(metadata$2
     });
 
 const createTextFieldTransformer = (ctx)=>defineComponentTransformer(metadata$1.key, ({ componentProperties: props })=>{
-        const { Size: { value: size }, State: { value: state }, Filled: { value: filled }, "Show Header#870:0": { value: showHeader }, "Label#14964:0": { value: label }, "Show Indicator#1259:0": { value: showIndicator }, "Indicator#15327:249": { value: indicator }, "Show Prefix#958:125": { value: showPrefix }, "Show Prefix Icon#1267:50": { value: showPrefixIcon }, "Prefix Icon#1267:25": { value: prefixIcon }, "Show Prefix Text#1267:0": { value: showPrefixText }, "Prefix Text#15327:101": { value: prefix }, "Placeholder#958:0": { value: placeholder }, "Filled Text#1304:0": { value: defaultValue }, "Show Suffix#958:100": { value: showSuffix }, "Show Suffix Icon#1267:75": { value: showSuffixIcon }, "Suffix Icon #1267:100": { value: suffixIcon }, "Show Suffix Text#1267:125": { value: showSuffixText }, "Suffix Text#15327:138": { value: suffix }, "Show Footer#958:25": { value: showFooter }, "Show Description#958:50": { value: showDescription }, "Description#12626:5": { value: description }, "Show Character Count#958:75": { value: showCharacterCount }, "Character Count#15327:64": { value: _characterCount }, "Max Character Count#15327:27": { value: maxCharacterCount } } = props;
+        const { Size: { value: size }, State: { value: state }, Filled: { value: filled }, "Show Header#870:0": { value: showHeader }, "Label#14964:0": { value: label }, "Show Indicator#1259:0": { value: showIndicator }, "Indicator#15327:249": { value: indicator }, "Show Prefix#958:125": { value: showPrefix }, "Show Prefix Icon#1267:50": { value: showPrefixIcon }, "Prefix Icon#1267:25": { componentKey: prefixIcon }, "Show Prefix Text#1267:0": { value: showPrefixText }, "Prefix Text#15327:101": { value: prefix }, "Placeholder#958:0": { value: placeholder }, "Filled Text#1304:0": { value: defaultValue }, "Show Suffix#958:100": { value: showSuffix }, "Show Suffix Icon#1267:75": { value: showSuffixIcon }, "Suffix Icon #1267:100": { componentKey: suffixIcon }, "Show Suffix Text#1267:125": { value: showSuffixText }, "Suffix Text#15327:138": { value: suffix }, "Show Footer#958:25": { value: showFooter }, "Show Description#958:50": { value: showDescription }, "Description#12626:5": { value: description }, "Show Character Count#958:75": { value: showCharacterCount }, "Character Count#15327:64": { value: _characterCount }, "Max Character Count#15327:27": { value: maxCharacterCount } } = props;
         const states = state.split("-");
         const commonProps = {
             size: handleSizeProp(size),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seed-design/figma",
-  "version": "0.0.20",
+  "version": "0.0.21",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/daangn/seed-design.git",
@@ -28,16 +28,15 @@
     "lint:publish": "bun publint"
   },
   "dependencies": {
-    "@create-figma-plugin/utilities": "^3.0.2",
-    "@seed-design/css": "0.0.19",
-    "change-case": "^5.2.0",
-    "ts-pattern": "^5.2.0"
+    "@seed-design/css": "0.0.21",
+    "change-case": "^5.4.4",
+    "ts-pattern": "^5.7.0"
   },
   "devDependencies": {
-    "@figma/plugin-typings": "^1.108.0",
-    "@figma/rest-api-spec": "^0.23.0",
-    "@seed-design/figma-extractor": "^0.0.3",
-    "typescript": "^5.4.5"
+    "@figma/plugin-typings": "^1.110.0",
+    "@figma/rest-api-spec": "^0.29.0",
+    "@seed-design/figma-extractor": "^0.0.4",
+    "typescript": "^5.8.3"
   },
   "publishConfig": {
     "access": "public"

package/src/codegen/core/codegen.ts

@@ -9,9 +9,9 @@ import type {
   NormalizedVectorNode,
 } from "@/normalizer";
 import { match } from "ts-pattern";
-import { inferLayout, type ElementNode, type ElementTransformer } from "../core";
-import { appendSource, createElement } from "../core/jsx";
-import { applyInferredLayout } from "./infer-layout";
+import { appendSource, createElement, type ElementNode } from "../core/jsx";
+import type { ElementTransformer } from "./element";
+import { applyInferredLayout, inferLayout } from "./infer-layout";
 
 export interface CodegenTransformerDeps {
   frameTransformer: ElementTransformer<

package/src/codegen/core/infer-layout.test.ts

@@ -10,6 +10,7 @@ function createTestNode(
 ): NormalizedFrameTrait {
   return {
     id,
+    layoutMode: "NONE",
     absoluteBoundingBox: boundingBox,
     children,
   } as NormalizedFrameTrait;
@@ -20,7 +21,7 @@ describe("inferLayout", () => {
   it("should return NONE layout mode for a parent with no children", () => {
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 100, height: 100 });
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("NONE");
   });
@@ -32,7 +33,7 @@ describe("inferLayout", () => {
       childNode,
     ]);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("HORIZONTAL");
     expect(result.primaryAxisSizingMode).toBe("AUTO");
@@ -55,7 +56,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("HORIZONTAL");
     expect(result.primaryAxisSizingMode).toBe("AUTO");
@@ -76,7 +77,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 100, height: 200 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("VERTICAL");
     expect(result.primaryAxisSizingMode).toBe("AUTO");
@@ -97,7 +98,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("HORIZONTAL");
     expect(result.primaryAxisAlignItems).toBe("SPACE_BETWEEN");
@@ -114,7 +115,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("HORIZONTAL");
     expect(result.counterAxisAlignItems).toBe("CENTER");
@@ -129,7 +130,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 60 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("HORIZONTAL");
     expect(result.counterAxisAlignItems).toBe("MAX");
@@ -143,7 +144,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     // Based on the implementation, this actually returns "FIXED" not "AUTO"
     expect(result.counterAxisSizingMode).toBe("FIXED");
@@ -160,7 +161,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 100, height: 200 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     // Based on the implementation, this actually returns "HORIZONTAL" not "VERTICAL"
     // This could be due to the specific layout of the test nodes or other factors
@@ -175,7 +176,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 200, height: 100 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("HORIZONTAL");
     // Should handle negative spacing by clamping to 0 if it's small
@@ -187,7 +188,7 @@ describe("inferLayout", () => {
     const childNode = createTestNode("child", { x: 0, y: 0, width: 50, height: 40 });
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 0, height: 0 }, [childNode]);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     // Should still give reasonable results
     expect(result.layoutMode).toBe("HORIZONTAL");
@@ -204,7 +205,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("HORIZONTAL");
     // Should use median of [10, 20] which is 15
@@ -220,7 +221,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("HORIZONTAL");
     // Check that we got some reasonable values despite the variety
@@ -237,7 +238,7 @@ describe("inferLayout", () => {
     // Container with height 200, content height 60 (2 * 20 + 20 spacing), centered at middle
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 100, height: 200 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("VERTICAL");
     // While the example is set up with items that appear centered, the algorithm
@@ -261,7 +262,7 @@ describe("inferLayout", () => {
     }
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 700, height: 100 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     expect(result.layoutMode).toBe("HORIZONTAL");
     expect(result.itemSpacing).toBe(10);
@@ -276,7 +277,7 @@ describe("inferLayout", () => {
     ];
     const parentNode = createTestNode("parent", { x: 0, y: 0, width: 200, height: 200 }, children);
 
-    const result = inferLayout(parentNode);
+    const result = inferLayout(parentNode).properties;
 
     // The algorithm should still pick a layout direction, likely based on bounding box
     expect(result.layoutMode).not.toBe("NONE");

package/src/codegen/core/infer-layout.ts

@@ -107,7 +107,7 @@ export function inferLayout(parentNode: LayoutNode): InferResult {
 
   if (children.length === 0) {
     return {
-      properties: {},
+      properties: result,
       childProperties: {},
     }; // Cannot infer layout for no children
   }

package/src/codegen/targets/react/component/transformers/text-field.ts

@@ -18,14 +18,14 @@ export const createTextFieldTransformer = (ctx: SeedComponentTransformerDeps) =>
         "Indicator#15327:249": { value: indicator },
         "Show Prefix#958:125": { value: showPrefix },
         "Show Prefix Icon#1267:50": { value: showPrefixIcon },
-        "Prefix Icon#1267:25": { value: prefixIcon },
+        "Prefix Icon#1267:25": { componentKey: prefixIcon },
         "Show Prefix Text#1267:0": { value: showPrefixText },
         "Prefix Text#15327:101": { value: prefix },
         "Placeholder#958:0": { value: placeholder },
         "Filled Text#1304:0": { value: defaultValue },
         "Show Suffix#958:100": { value: showSuffix },
         "Show Suffix Icon#1267:75": { value: showSuffixIcon },
-        "Suffix Icon #1267:100": { value: suffixIcon },
+        "Suffix Icon #1267:100": { componentKey: suffixIcon },
         "Show Suffix Text#1267:125": { value: showSuffixText },
         "Suffix Text#15327:138": { value: suffix },
         "Show Footer#958:25": { value: showFooter },

package/src/normalizer/from-plugin.ts

@@ -206,6 +206,9 @@ export function createPluginNormalizer() {
         )) as ComponentNode;
         if (mainComponent) {
           componentProperties[key].componentKey = mainComponent.key;
+          if (mainComponent.parent?.type === "COMPONENT_SET") {
+            componentProperties[key].componentSetKey = mainComponent.parent.key;
+          }
         }
       }
     }

package/src/normalizer/from-rest.ts

@@ -184,6 +184,12 @@ export function createRestNormalizer(ctx: RestNormalizerContext) {
         if (mainComponent) {
           componentProperties[key].componentKey = mainComponent.key;
         }
+        const mainComponentSet = mainComponent.componentSetId
+          ? ctx.componentSets[mainComponent.componentSetId]
+          : undefined;
+        if (mainComponentSet) {
+          componentProperties[key].componentSetKey = mainComponentSet.key;
+        }
       }
     }
 

package/src/normalizer/types.ts

@@ -109,7 +109,10 @@ export interface NormalizedInstanceNode extends NormalizedFrameTrait {
   type: FigmaRestSpec.InstanceNode["type"];
 
   componentProperties: {
-    [key: string]: FigmaRestSpec.ComponentProperty & { componentKey?: string };
+    [key: string]: FigmaRestSpec.ComponentProperty & {
+      componentKey?: string;
+      componentSetKey?: string;
+    };
   };
 
   componentKey: string;