@seed-design/figma 0.0.19 → 0.0.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/index.cjs CHANGED
@@ -143,6 +143,10 @@ function createRestNormalizer(ctx) {
143
143
  if (mainComponent) {
144
144
  componentProperties[key].componentKey = mainComponent.key;
145
145
  }
146
+ const mainComponentSet = mainComponent.componentSetId ? ctx.componentSets[mainComponent.componentSetId] : undefined;
147
+ if (mainComponentSet) {
148
+ componentProperties[key].componentSetKey = mainComponentSet.key;
149
+ }
146
150
  }
147
151
  }
148
152
  return {
@@ -331,6 +335,9 @@ function createPluginNormalizer() {
331
335
  const mainComponent = await figma.getNodeByIdAsync(value.value);
332
336
  if (mainComponent) {
333
337
  componentProperties[key].componentKey = mainComponent.key;
338
+ if (mainComponent.parent?.type === "COMPONENT_SET") {
339
+ componentProperties[key].componentSetKey = mainComponent.parent.key;
340
+ }
334
341
  }
335
342
  }
336
343
  }
@@ -613,7 +620,7 @@ function inferLayout(parentNode) {
613
620
  };
614
621
  if (children.length === 0) {
615
622
  return {
616
- properties: {},
623
+ properties: result,
617
624
  childProperties: {}
618
625
  }; // Cannot infer layout for no children
619
626
  }
@@ -10797,7 +10804,7 @@ function createIconService({ iconRepository }) {
10797
10804
  }
10798
10805
  const iconData = iconRepository.getIconData(key);
10799
10806
  if (!iconData) {
10800
- throw new Error(`Icon not found: ${key}`);
10807
+ return "UnknownIcon";
10801
10808
  }
10802
10809
  const { name, weight } = iconData;
10803
10810
  return changeCase.pascalCase(`${name}${weight ? weight : ""}`);
@@ -10813,16 +10820,22 @@ function createStyleService({ styleRepository, styleNameTransformer }) {
10813
10820
  function getFigmaStyleName(id) {
10814
10821
  const style = styleRepository.findOneByKey(id);
10815
10822
  if (!style) {
10816
- throw new Error(`Style not found: ${id}`);
10823
+ return undefined;
10817
10824
  }
10818
10825
  return style.name;
10819
10826
  }
10820
10827
  function getFigmaStyleSlug(id) {
10821
10828
  const name = getFigmaStyleName(id);
10829
+ if (!name) {
10830
+ return undefined;
10831
+ }
10822
10832
  return name.split("/");
10823
10833
  }
10824
10834
  function getStyleName(id) {
10825
10835
  const slug = getFigmaStyleSlug(id);
10836
+ if (!slug) {
10837
+ return undefined;
10838
+ }
10826
10839
  return styleNameTransformer({
10827
10840
  slug
10828
10841
  });
@@ -12668,7 +12681,7 @@ const createTextButtonTransformer = (ctx)=>defineComponentTransformer(metadata$2
12668
12681
  });
12669
12682
 
12670
12683
  const createTextFieldTransformer = (ctx)=>defineComponentTransformer(metadata$1.key, ({ componentProperties: props })=>{
12671
- 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;
12684
+ 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;
12672
12685
  const states = state.split("-");
12673
12686
  const commonProps = {
12674
12687
  size: handleSizeProp(size),
package/lib/index.d.ts CHANGED
@@ -50,6 +50,7 @@ interface NormalizedInstanceNode extends NormalizedFrameTrait {
50
50
  componentProperties: {
51
51
  [key: string]: FigmaRestSpec.ComponentProperty & {
52
52
  componentKey?: string;
53
+ componentSetKey?: string;
53
54
  };
54
55
  };
55
56
  componentKey: string;
@@ -78,17 +79,6 @@ declare function createRestNormalizer(ctx: RestNormalizerContext): (node: FigmaR
78
79
 
79
80
  declare function createPluginNormalizer(): (node: SceneNode) => Promise<NormalizedSceneNode>;
80
81
 
81
- interface CodegenTransformerDeps {
82
- frameTransformer: ElementTransformer<NormalizedFrameNode | NormalizedComponentNode | NormalizedInstanceNode>;
83
- textTransformer: ElementTransformer<NormalizedTextNode>;
84
- rectangleTransformer: ElementTransformer<NormalizedRectangleNode>;
85
- instanceTransformer: ElementTransformer<NormalizedInstanceNode>;
86
- vectorTransformer: ElementTransformer<NormalizedVectorNode>;
87
- booleanOperationTransformer: ElementTransformer<NormalizedBooleanOperationNode>;
88
- shouldInferAutoLayout: boolean;
89
- }
90
- declare function createCodegenTransformer({ frameTransformer, textTransformer, rectangleTransformer, instanceTransformer, vectorTransformer, booleanOperationTransformer, shouldInferAutoLayout, }: CodegenTransformerDeps): (node: NormalizedSceneNode) => ElementNode | undefined;
91
-
92
82
  interface ElementNode {
93
83
  __IS_JSX_ELEMENT_NODE: true;
94
84
  tag: string;
@@ -109,6 +99,20 @@ declare function cloneElement(element: ElementNode, props?: Record<string, strin
109
99
  source?: string;
110
100
  };
111
101
 
102
+ type ElementTransformer<T extends NormalizedSceneNode> = (node: T, traverse: (node: NormalizedSceneNode) => ElementNode | undefined) => ElementNode | undefined;
103
+ declare function defineElementTransformer<T extends NormalizedSceneNode>(transformer: ElementTransformer<T>): ElementTransformer<T>;
104
+
105
+ interface CodegenTransformerDeps {
106
+ frameTransformer: ElementTransformer<NormalizedFrameNode | NormalizedComponentNode | NormalizedInstanceNode>;
107
+ textTransformer: ElementTransformer<NormalizedTextNode>;
108
+ rectangleTransformer: ElementTransformer<NormalizedRectangleNode>;
109
+ instanceTransformer: ElementTransformer<NormalizedInstanceNode>;
110
+ vectorTransformer: ElementTransformer<NormalizedVectorNode>;
111
+ booleanOperationTransformer: ElementTransformer<NormalizedBooleanOperationNode>;
112
+ shouldInferAutoLayout: boolean;
113
+ }
114
+ declare function createCodegenTransformer({ frameTransformer, textTransformer, rectangleTransformer, instanceTransformer, vectorTransformer, booleanOperationTransformer, shouldInferAutoLayout, }: CodegenTransformerDeps): (node: NormalizedSceneNode) => ElementNode | undefined;
115
+
112
116
  interface ComponentTransformer<T extends NormalizedInstanceNode["componentProperties"] = NormalizedInstanceNode["componentProperties"]> {
113
117
  key: string;
114
118
  transform: (node: NormalizedInstanceNode & {
@@ -137,9 +141,6 @@ type InferFromDefinition<T extends Record<string, ComponentPropertyDefinition>>
137
141
  };
138
142
  };
139
143
 
140
- type ElementTransformer<T extends NormalizedSceneNode> = (node: T, traverse: (node: NormalizedSceneNode) => ElementNode | undefined) => ElementNode | undefined;
141
- declare function defineElementTransformer<T extends NormalizedSceneNode>(transformer: ElementTransformer<T>): ElementTransformer<T>;
142
-
143
144
  interface IconData {
144
145
  name: string;
145
146
  type: "monochrome" | "multicolor";
@@ -194,7 +195,7 @@ declare function createIconService({ iconRepository, }: {
194
195
  }): IconService;
195
196
 
196
197
  interface StyleService {
197
- getStyleName: (id: string) => string;
198
+ getStyleName: (id: string) => string | undefined;
198
199
  }
199
200
  declare function createStyleService({ styleRepository, styleNameTransformer, }: {
200
201
  styleRepository: StyleRepository;
@@ -417,7 +418,8 @@ type index$1_BooleanOperationTransformerDeps = BooleanOperationTransformerDeps;
417
418
  type index$1_FillProps = FillProps;
418
419
  type index$1_VectorTransformerDeps = VectorTransformerDeps;
419
420
  declare namespace index$1 {
420
- 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 };
421
+ 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 };
422
+ 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 };
421
423
  }
422
424
 
423
425
  interface PropsTransformers {
@@ -1972,6 +1974,7 @@ declare const createSeedComponentTransformers: (ctx: SeedComponentTransformerDep
1972
1974
  [k: string]: ComponentTransformer<{
1973
1975
  [key: string]: FigmaRestSpec.ComponentProperty & {
1974
1976
  componentKey?: string;
1977
+ componentSetKey?: string;
1975
1978
  };
1976
1979
  }>;
1977
1980
  };
@@ -2065,7 +2068,8 @@ declare const index_createTextTransformer: typeof createTextTransformer;
2065
2068
  declare const index_createTypeStylePropsTransformer: typeof createTypeStylePropsTransformer;
2066
2069
  declare const index_createVectorTransformer: typeof createVectorTransformer;
2067
2070
  declare namespace index {
2068
- 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 };
2071
+ 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 };
2072
+ 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 };
2069
2073
  }
2070
2074
 
2071
2075
  declare function generateJsxTree(node: NormalizedSceneNode, options?: Partial<CreateContextOptions>): ElementNode | undefined;
@@ -2076,4 +2080,5 @@ declare function generateFigmaSummary(node: NormalizedSceneNode, options?: Parti
2076
2080
  shouldPrintSource?: boolean;
2077
2081
  }): string | undefined;
2078
2082
 
2079
- 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 };
2083
+ 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 };
2084
+ 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 CHANGED
@@ -143,6 +143,10 @@ function createRestNormalizer(ctx) {
143
143
  if (mainComponent) {
144
144
  componentProperties[key].componentKey = mainComponent.key;
145
145
  }
146
+ const mainComponentSet = mainComponent.componentSetId ? ctx.componentSets[mainComponent.componentSetId] : undefined;
147
+ if (mainComponentSet) {
148
+ componentProperties[key].componentSetKey = mainComponentSet.key;
149
+ }
146
150
  }
147
151
  }
148
152
  return {
@@ -331,6 +335,9 @@ function createPluginNormalizer() {
331
335
  const mainComponent = await figma.getNodeByIdAsync(value.value);
332
336
  if (mainComponent) {
333
337
  componentProperties[key].componentKey = mainComponent.key;
338
+ if (mainComponent.parent?.type === "COMPONENT_SET") {
339
+ componentProperties[key].componentSetKey = mainComponent.parent.key;
340
+ }
334
341
  }
335
342
  }
336
343
  }
@@ -613,7 +620,7 @@ function inferLayout(parentNode) {
613
620
  };
614
621
  if (children.length === 0) {
615
622
  return {
616
- properties: {},
623
+ properties: result,
617
624
  childProperties: {}
618
625
  }; // Cannot infer layout for no children
619
626
  }
@@ -10797,7 +10804,7 @@ function createIconService({ iconRepository }) {
10797
10804
  }
10798
10805
  const iconData = iconRepository.getIconData(key);
10799
10806
  if (!iconData) {
10800
- throw new Error(`Icon not found: ${key}`);
10807
+ return "UnknownIcon";
10801
10808
  }
10802
10809
  const { name, weight } = iconData;
10803
10810
  return pascalCase(`${name}${weight ? weight : ""}`);
@@ -10813,16 +10820,22 @@ function createStyleService({ styleRepository, styleNameTransformer }) {
10813
10820
  function getFigmaStyleName(id) {
10814
10821
  const style = styleRepository.findOneByKey(id);
10815
10822
  if (!style) {
10816
- throw new Error(`Style not found: ${id}`);
10823
+ return undefined;
10817
10824
  }
10818
10825
  return style.name;
10819
10826
  }
10820
10827
  function getFigmaStyleSlug(id) {
10821
10828
  const name = getFigmaStyleName(id);
10829
+ if (!name) {
10830
+ return undefined;
10831
+ }
10822
10832
  return name.split("/");
10823
10833
  }
10824
10834
  function getStyleName(id) {
10825
10835
  const slug = getFigmaStyleSlug(id);
10836
+ if (!slug) {
10837
+ return undefined;
10838
+ }
10826
10839
  return styleNameTransformer({
10827
10840
  slug
10828
10841
  });
@@ -12668,7 +12681,7 @@ const createTextButtonTransformer = (ctx)=>defineComponentTransformer(metadata$2
12668
12681
  });
12669
12682
 
12670
12683
  const createTextFieldTransformer = (ctx)=>defineComponentTransformer(metadata$1.key, ({ componentProperties: props })=>{
12671
- 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;
12684
+ 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;
12672
12685
  const states = state.split("-");
12673
12686
  const commonProps = {
12674
12687
  size: handleSizeProp(size),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seed-design/figma",
3
- "version": "0.0.19",
3
+ "version": "0.0.21",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/daangn/seed-design.git",
@@ -28,16 +28,15 @@
28
28
  "lint:publish": "bun publint"
29
29
  },
30
30
  "dependencies": {
31
- "@create-figma-plugin/utilities": "^3.0.2",
32
- "@seed-design/css": "0.0.19",
33
- "change-case": "^5.2.0",
34
- "ts-pattern": "^5.2.0"
31
+ "@seed-design/css": "0.0.21",
32
+ "change-case": "^5.4.4",
33
+ "ts-pattern": "^5.7.0"
35
34
  },
36
35
  "devDependencies": {
37
- "@figma/plugin-typings": "^1.108.0",
38
- "@figma/rest-api-spec": "^0.23.0",
39
- "@seed-design/figma-extractor": "^0.0.3",
40
- "typescript": "^5.4.5"
36
+ "@figma/plugin-typings": "^1.110.0",
37
+ "@figma/rest-api-spec": "^0.29.0",
38
+ "@seed-design/figma-extractor": "^0.0.4",
39
+ "typescript": "^5.8.3"
41
40
  },
42
41
  "publishConfig": {
43
42
  "access": "public"
@@ -9,9 +9,9 @@ import type {
9
9
  NormalizedVectorNode,
10
10
  } from "@/normalizer";
11
11
  import { match } from "ts-pattern";
12
- import { inferLayout, type ElementNode, type ElementTransformer } from "../core";
13
- import { appendSource, createElement } from "../core/jsx";
14
- import { applyInferredLayout } from "./infer-layout";
12
+ import { appendSource, createElement, type ElementNode } from "../core/jsx";
13
+ import type { ElementTransformer } from "./element";
14
+ import { applyInferredLayout, inferLayout } from "./infer-layout";
15
15
 
16
16
  export interface CodegenTransformerDeps {
17
17
  frameTransformer: ElementTransformer<
@@ -10,6 +10,7 @@ function createTestNode(
10
10
  ): NormalizedFrameTrait {
11
11
  return {
12
12
  id,
13
+ layoutMode: "NONE",
13
14
  absoluteBoundingBox: boundingBox,
14
15
  children,
15
16
  } as NormalizedFrameTrait;
@@ -20,7 +21,7 @@ describe("inferLayout", () => {
20
21
  it("should return NONE layout mode for a parent with no children", () => {
21
22
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 100, height: 100 });
22
23
 
23
- const result = inferLayout(parentNode);
24
+ const result = inferLayout(parentNode).properties;
24
25
 
25
26
  expect(result.layoutMode).toBe("NONE");
26
27
  });
@@ -32,7 +33,7 @@ describe("inferLayout", () => {
32
33
  childNode,
33
34
  ]);
34
35
 
35
- const result = inferLayout(parentNode);
36
+ const result = inferLayout(parentNode).properties;
36
37
 
37
38
  expect(result.layoutMode).toBe("HORIZONTAL");
38
39
  expect(result.primaryAxisSizingMode).toBe("AUTO");
@@ -55,7 +56,7 @@ describe("inferLayout", () => {
55
56
  ];
56
57
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
57
58
 
58
- const result = inferLayout(parentNode);
59
+ const result = inferLayout(parentNode).properties;
59
60
 
60
61
  expect(result.layoutMode).toBe("HORIZONTAL");
61
62
  expect(result.primaryAxisSizingMode).toBe("AUTO");
@@ -76,7 +77,7 @@ describe("inferLayout", () => {
76
77
  ];
77
78
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 100, height: 200 }, children);
78
79
 
79
- const result = inferLayout(parentNode);
80
+ const result = inferLayout(parentNode).properties;
80
81
 
81
82
  expect(result.layoutMode).toBe("VERTICAL");
82
83
  expect(result.primaryAxisSizingMode).toBe("AUTO");
@@ -97,7 +98,7 @@ describe("inferLayout", () => {
97
98
  ];
98
99
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
99
100
 
100
- const result = inferLayout(parentNode);
101
+ const result = inferLayout(parentNode).properties;
101
102
 
102
103
  expect(result.layoutMode).toBe("HORIZONTAL");
103
104
  expect(result.primaryAxisAlignItems).toBe("SPACE_BETWEEN");
@@ -114,7 +115,7 @@ describe("inferLayout", () => {
114
115
  ];
115
116
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
116
117
 
117
- const result = inferLayout(parentNode);
118
+ const result = inferLayout(parentNode).properties;
118
119
 
119
120
  expect(result.layoutMode).toBe("HORIZONTAL");
120
121
  expect(result.counterAxisAlignItems).toBe("CENTER");
@@ -129,7 +130,7 @@ describe("inferLayout", () => {
129
130
  ];
130
131
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 60 }, children);
131
132
 
132
- const result = inferLayout(parentNode);
133
+ const result = inferLayout(parentNode).properties;
133
134
 
134
135
  expect(result.layoutMode).toBe("HORIZONTAL");
135
136
  expect(result.counterAxisAlignItems).toBe("MAX");
@@ -143,7 +144,7 @@ describe("inferLayout", () => {
143
144
  ];
144
145
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
145
146
 
146
- const result = inferLayout(parentNode);
147
+ const result = inferLayout(parentNode).properties;
147
148
 
148
149
  // Based on the implementation, this actually returns "FIXED" not "AUTO"
149
150
  expect(result.counterAxisSizingMode).toBe("FIXED");
@@ -160,7 +161,7 @@ describe("inferLayout", () => {
160
161
  ];
161
162
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 100, height: 200 }, children);
162
163
 
163
- const result = inferLayout(parentNode);
164
+ const result = inferLayout(parentNode).properties;
164
165
 
165
166
  // Based on the implementation, this actually returns "HORIZONTAL" not "VERTICAL"
166
167
  // This could be due to the specific layout of the test nodes or other factors
@@ -175,7 +176,7 @@ describe("inferLayout", () => {
175
176
  ];
176
177
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 200, height: 100 }, children);
177
178
 
178
- const result = inferLayout(parentNode);
179
+ const result = inferLayout(parentNode).properties;
179
180
 
180
181
  expect(result.layoutMode).toBe("HORIZONTAL");
181
182
  // Should handle negative spacing by clamping to 0 if it's small
@@ -187,7 +188,7 @@ describe("inferLayout", () => {
187
188
  const childNode = createTestNode("child", { x: 0, y: 0, width: 50, height: 40 });
188
189
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 0, height: 0 }, [childNode]);
189
190
 
190
- const result = inferLayout(parentNode);
191
+ const result = inferLayout(parentNode).properties;
191
192
 
192
193
  // Should still give reasonable results
193
194
  expect(result.layoutMode).toBe("HORIZONTAL");
@@ -204,7 +205,7 @@ describe("inferLayout", () => {
204
205
  ];
205
206
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
206
207
 
207
- const result = inferLayout(parentNode);
208
+ const result = inferLayout(parentNode).properties;
208
209
 
209
210
  expect(result.layoutMode).toBe("HORIZONTAL");
210
211
  // Should use median of [10, 20] which is 15
@@ -220,7 +221,7 @@ describe("inferLayout", () => {
220
221
  ];
221
222
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 500, height: 100 }, children);
222
223
 
223
- const result = inferLayout(parentNode);
224
+ const result = inferLayout(parentNode).properties;
224
225
 
225
226
  expect(result.layoutMode).toBe("HORIZONTAL");
226
227
  // Check that we got some reasonable values despite the variety
@@ -237,7 +238,7 @@ describe("inferLayout", () => {
237
238
  // Container with height 200, content height 60 (2 * 20 + 20 spacing), centered at middle
238
239
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 100, height: 200 }, children);
239
240
 
240
- const result = inferLayout(parentNode);
241
+ const result = inferLayout(parentNode).properties;
241
242
 
242
243
  expect(result.layoutMode).toBe("VERTICAL");
243
244
  // While the example is set up with items that appear centered, the algorithm
@@ -261,7 +262,7 @@ describe("inferLayout", () => {
261
262
  }
262
263
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 700, height: 100 }, children);
263
264
 
264
- const result = inferLayout(parentNode);
265
+ const result = inferLayout(parentNode).properties;
265
266
 
266
267
  expect(result.layoutMode).toBe("HORIZONTAL");
267
268
  expect(result.itemSpacing).toBe(10);
@@ -276,7 +277,7 @@ describe("inferLayout", () => {
276
277
  ];
277
278
  const parentNode = createTestNode("parent", { x: 0, y: 0, width: 200, height: 200 }, children);
278
279
 
279
- const result = inferLayout(parentNode);
280
+ const result = inferLayout(parentNode).properties;
280
281
 
281
282
  // The algorithm should still pick a layout direction, likely based on bounding box
282
283
  expect(result.layoutMode).not.toBe("NONE");
@@ -107,7 +107,7 @@ export function inferLayout(parentNode: LayoutNode): InferResult {
107
107
 
108
108
  if (children.length === 0) {
109
109
  return {
110
- properties: {},
110
+ properties: result,
111
111
  childProperties: {},
112
112
  }; // Cannot infer layout for no children
113
113
  }
@@ -18,14 +18,14 @@ export const createTextFieldTransformer = (ctx: SeedComponentTransformerDeps) =>
18
18
  "Indicator#15327:249": { value: indicator },
19
19
  "Show Prefix#958:125": { value: showPrefix },
20
20
  "Show Prefix Icon#1267:50": { value: showPrefixIcon },
21
- "Prefix Icon#1267:25": { value: prefixIcon },
21
+ "Prefix Icon#1267:25": { componentKey: prefixIcon },
22
22
  "Show Prefix Text#1267:0": { value: showPrefixText },
23
23
  "Prefix Text#15327:101": { value: prefix },
24
24
  "Placeholder#958:0": { value: placeholder },
25
25
  "Filled Text#1304:0": { value: defaultValue },
26
26
  "Show Suffix#958:100": { value: showSuffix },
27
27
  "Show Suffix Icon#1267:75": { value: showSuffixIcon },
28
- "Suffix Icon #1267:100": { value: suffixIcon },
28
+ "Suffix Icon #1267:100": { componentKey: suffixIcon },
29
29
  "Show Suffix Text#1267:125": { value: showSuffixText },
30
30
  "Suffix Text#15327:138": { value: suffix },
31
31
  "Show Footer#958:25": { value: showFooter },
@@ -20,7 +20,7 @@ export function createIconService({
20
20
 
21
21
  const iconData = iconRepository.getIconData(key);
22
22
  if (!iconData) {
23
- throw new Error(`Icon not found: ${key}`);
23
+ return "UnknownIcon";
24
24
  }
25
25
 
26
26
  const { name, weight } = iconData;
@@ -1,7 +1,7 @@
1
1
  import type { StyleRepository } from "./style.repository";
2
2
 
3
3
  export interface StyleService {
4
- getStyleName: (id: string) => string;
4
+ getStyleName: (id: string) => string | undefined;
5
5
  }
6
6
 
7
7
  // TODO: inferStyleName 추가해야 함, rest api에서 style value가 제공되지 않고 있어 보류
@@ -16,19 +16,29 @@ export function createStyleService({
16
16
  const style = styleRepository.findOneByKey(id);
17
17
 
18
18
  if (!style) {
19
- throw new Error(`Style not found: ${id}`);
19
+ return undefined;
20
20
  }
21
21
 
22
22
  return style.name;
23
23
  }
24
24
 
25
- function getFigmaStyleSlug(id: string): string[] {
25
+ function getFigmaStyleSlug(id: string): string[] | undefined {
26
26
  const name = getFigmaStyleName(id);
27
+
28
+ if (!name) {
29
+ return undefined;
30
+ }
31
+
27
32
  return name.split("/");
28
33
  }
29
34
 
30
35
  function getStyleName(id: string) {
31
36
  const slug = getFigmaStyleSlug(id);
37
+
38
+ if (!slug) {
39
+ return undefined;
40
+ }
41
+
32
42
  return styleNameTransformer({ slug });
33
43
  }
34
44
 
@@ -206,6 +206,9 @@ export function createPluginNormalizer() {
206
206
  )) as ComponentNode;
207
207
  if (mainComponent) {
208
208
  componentProperties[key].componentKey = mainComponent.key;
209
+ if (mainComponent.parent?.type === "COMPONENT_SET") {
210
+ componentProperties[key].componentSetKey = mainComponent.parent.key;
211
+ }
209
212
  }
210
213
  }
211
214
  }
@@ -184,6 +184,12 @@ export function createRestNormalizer(ctx: RestNormalizerContext) {
184
184
  if (mainComponent) {
185
185
  componentProperties[key].componentKey = mainComponent.key;
186
186
  }
187
+ const mainComponentSet = mainComponent.componentSetId
188
+ ? ctx.componentSets[mainComponent.componentSetId]
189
+ : undefined;
190
+ if (mainComponentSet) {
191
+ componentProperties[key].componentSetKey = mainComponentSet.key;
192
+ }
187
193
  }
188
194
  }
189
195
 
@@ -109,7 +109,10 @@ export interface NormalizedInstanceNode extends NormalizedFrameTrait {
109
109
  type: FigmaRestSpec.InstanceNode["type"];
110
110
 
111
111
  componentProperties: {
112
- [key: string]: FigmaRestSpec.ComponentProperty & { componentKey?: string };
112
+ [key: string]: FigmaRestSpec.ComponentProperty & {
113
+ componentKey?: string;
114
+ componentSetKey?: string;
115
+ };
113
116
  };
114
117
 
115
118
  componentKey: string;