@seed-design/figma 1.1.17 → 1.1.18

package/lib/index.js

@@ -90,7 +90,8 @@ export * from './codegen/index.js';
         const effects = (node.effects ?? []).filter((effect)=>effect.visible !== false && (effect.type === "DROP_SHADOW" || effect.type === "INNER_SHADOW")).map((effect)=>{
             const { type, color, offset, radius, spread, boundVariables } = effect;
             return {
-                type,
+                // remove fallback when resolved: https://github.com/figma/rest-api-spec/issues/84
+                type: type ?? "INNER_SHADOW",
                 color,
                 offset,
                 radius,
@@ -1509,6 +1510,16 @@ const FIGMA_ICONS = {
         "type": "monochrome",
         "weight": "Fill"
     },
+    "48d35e692e4cbeb1bfd0b0be28a800061173cf96": {
+        "name": "icon_cart_items",
+        "type": "monochrome",
+        "weight": "Fill"
+    },
+    "15e92fded5d5306b62b634790f724a72ba8f7033": {
+        "name": "icon_cart_items",
+        "type": "monochrome",
+        "weight": "Line"
+    },
     "f6be7d2997e4b139ae4850ee21869bc7e59ccc0b": {
         "name": "icon_cart",
         "type": "monochrome",
@@ -2074,6 +2085,16 @@ const FIGMA_ICONS = {
         "type": "monochrome",
         "weight": "Line"
     },
+    "8a20bac7b3ef03003f4395e5a5455a62fa363efc": {
+        "name": "icon_exclamationmark_chatbubble_rectangular_center",
+        "type": "monochrome",
+        "weight": "Fill"
+    },
+    "2fe5521cf8ac4b67db3a1cd0a03847f54493583a": {
+        "name": "icon_exclamationmark_chatbubble_rectangular_center",
+        "type": "monochrome",
+        "weight": "Line"
+    },
     "3e578773a3da74c255c4c9008914b247e0fc3d2b": {
         "name": "icon_exclamationmark_circle",
         "type": "monochrome",
@@ -4138,6 +4159,10 @@ const FIGMA_ICONS = {
         "name": "icon_cart",
         "type": "multicolor"
     },
+    "81a9d09867dbce6bbeca059a24c54ad23130a518": {
+        "name": "icon_cart_items",
+        "type": "multicolor"
+    },
     "51692e1d38d71ff24bbf5c7295da347d7700acbe": {
         "name": "icon_cart_load",
         "type": "multicolor"
@@ -4853,9 +4878,11 @@ const FIGMA_VARIABLE_COLLECTIONS = {
             "VariableID:654:20851",
             "VariableID:1:171",
             "VariableID:41186:6437",
-            "VariableID:1:158",
             "VariableID:1:172",
+            "VariableID:1:158",
             "VariableID:1:161",
+            "VariableID:59176:2",
+            "VariableID:59176:3",
             "VariableID:1:159",
             "VariableID:576:22878",
             "VariableID:10181:32557",
@@ -4900,8 +4927,8 @@ const FIGMA_VARIABLE_COLLECTIONS = {
             "VariableID:12479:23364",
             "VariableID:12479:23365",
             "VariableID:12479:23366",
-            "VariableID:12548:1437",
             "VariableID:1:7",
+            "VariableID:12548:1437",
             "VariableID:12479:23367",
             "VariableID:12479:23368",
             "VariableID:12479:23371",
@@ -5252,9 +5279,9 @@ const FIGMA_VARIABLE_COLLECTIONS = {
             "VariableID:289:13772",
             "VariableID:1886:93038",
             "VariableID:289:13773",
-            "VariableID:796:4448",
             "VariableID:15518:15916",
             "VariableID:19225:68732",
+            "VariableID:796:4448",
             "VariableID:17955:50606",
             "VariableID:514:13178",
             "VariableID:535:1747",
@@ -5262,7 +5289,10 @@ const FIGMA_VARIABLE_COLLECTIONS = {
             "VariableID:1700:4280",
             "VariableID:1700:4281",
             "VariableID:1700:4282",
-            "VariableID:40279:20413"
+            "VariableID:40279:20413",
+            "VariableID:58766:15457",
+            "VariableID:58766:15458",
+            "VariableID:58766:15459"
         ]
     },
     "VariableCollectionId:6075:34487": {
@@ -6379,6 +6409,54 @@ const FIGMA_VARIABLES = {
         ],
         "codeSyntax": {}
     },
+    "VariableID:59176:2": {
+        "name": "bg/neutral-weak-alpha",
+        "id": "VariableID:59176:2",
+        "remote": false,
+        "key": "082218bada1fc4e2688ad59f30a980c191caf7b7",
+        "variableCollectionId": "VariableCollectionId:1:3",
+        "resolvedType": "COLOR",
+        "description": "",
+        "hiddenFromPublishing": false,
+        "valuesByMode": {
+            "1928:7": {
+                "type": "VARIABLE_ALIAS",
+                "id": "VariableID:30894:36296"
+            },
+            "1928:8": {
+                "type": "VARIABLE_ALIAS",
+                "id": "VariableID:30894:36307"
+            }
+        },
+        "scopes": [
+            "ALL_SCOPES"
+        ],
+        "codeSyntax": {}
+    },
+    "VariableID:59176:3": {
+        "name": "bg/neutral-weak-alpha-pressed",
+        "id": "VariableID:59176:3",
+        "remote": false,
+        "key": "b67dd2511e5e4f41e0e392925fcccc752c67631f",
+        "variableCollectionId": "VariableCollectionId:1:3",
+        "resolvedType": "COLOR",
+        "description": "",
+        "hiddenFromPublishing": false,
+        "valuesByMode": {
+            "1928:7": {
+                "type": "VARIABLE_ALIAS",
+                "id": "VariableID:30894:36297"
+            },
+            "1928:8": {
+                "type": "VARIABLE_ALIAS",
+                "id": "VariableID:30894:36308"
+            }
+        },
+        "scopes": [
+            "ALL_SCOPES"
+        ],
+        "codeSyntax": {}
+    },
     "VariableID:1:161": {
         "name": "bg/neutral-weak-pressed",
         "id": "VariableID:1:161",
@@ -6703,6 +6781,69 @@ const FIGMA_VARIABLES = {
         ],
         "codeSyntax": {}
     },
+    "VariableID:58766:15459": {
+        "name": "Component utility (Figma Only)/Select Box/1-column",
+        "id": "VariableID:58766:15459",
+        "remote": false,
+        "key": "676178acd6e038ee5fe034a25818c16a4670a5b1",
+        "variableCollectionId": "VariableCollectionId:1:197",
+        "resolvedType": "FLOAT",
+        "description": "(preview-width - x3 ) / 1 값입니다.",
+        "hiddenFromPublishing": false,
+        "valuesByMode": {
+            "1:5": 358,
+            "1:6": 358,
+            "1:7": 358,
+            "1:8": 358,
+            "51907:0": 358
+        },
+        "scopes": [
+            "ALL_SCOPES"
+        ],
+        "codeSyntax": {}
+    },
+    "VariableID:58766:15458": {
+        "name": "Component utility (Figma Only)/Select Box/2-column",
+        "id": "VariableID:58766:15458",
+        "remote": false,
+        "key": "932afae9533322f9192fc8274b77a547d42a8804",
+        "variableCollectionId": "VariableCollectionId:1:197",
+        "resolvedType": "FLOAT",
+        "description": "(preview-width - x3 ) / 2 값입니다.",
+        "hiddenFromPublishing": false,
+        "valuesByMode": {
+            "1:5": 173,
+            "1:6": 173,
+            "1:7": 173,
+            "1:8": 173,
+            "51907:0": 173
+        },
+        "scopes": [
+            "ALL_SCOPES"
+        ],
+        "codeSyntax": {}
+    },
+    "VariableID:58766:15457": {
+        "name": "Component utility (Figma Only)/Select Box/3-column",
+        "id": "VariableID:58766:15457",
+        "remote": false,
+        "key": "f2cf2dfa2088f54ceafd7206b47bc2d3dbb057b0",
+        "variableCollectionId": "VariableCollectionId:1:197",
+        "resolvedType": "FLOAT",
+        "description": "(preview-width - x3 ) / 3 값입니다.",
+        "hiddenFromPublishing": false,
+        "valuesByMode": {
+            "1:5": 111.33000183105469,
+            "1:6": 111.33000183105469,
+            "1:7": 111.33000183105469,
+            "1:8": 111.33000183105469,
+            "51907:0": 111.33000183105469
+        },
+        "scopes": [
+            "ALL_SCOPES"
+        ],
+        "codeSyntax": {}
+    },
     "VariableID:6421:24605": {
         "name": "dimension/spacing-x/between-chips",
         "id": "VariableID:6421:24605",
@@ -12304,26 +12445,21 @@ const templateDisclaimer = {
         }
     }
 };
-const templateSelectBoxGroup = {
-    "name": "templateSelectBoxGroup",
-    "key": "a3d58bb8540600878742cdcf2608a4b3851667ec",
+const templateResultPage = {
+    "name": "templateResultPage",
+    "key": "4cc94782abbe7e58f0401c29ad8880a62e512ae7",
     "componentPropertyDefinitions": {
-        "Control": {
-            "type": "VARIANT",
-            "variantOptions": [
-                "Checkbox",
-                "Radio"
-            ]
+        "Show Top Navigation#58717:0": {
+            "type": "BOOLEAN"
         },
-        "Item Count": {
+        "Show Bottom Action Bar#59845:0": {
+            "type": "BOOLEAN"
+        },
+        "Show Bottom Action Bar": {
             "type": "VARIANT",
             "variantOptions": [
-                "1",
-                "2",
-                "3",
-                "4",
-                "5",
-                "6"
+                "True",
+                "False"
             ]
         }
     }
@@ -13069,6 +13205,164 @@ const helpBubble = {
         }
     }
 };
+const imageFrame = {
+    "name": "imageFrame",
+    "key": "b12f0bdeb6c6a61e0d50fe7e0dfae8ecd323f0aa",
+    "componentPropertyDefinitions": {
+        "Has Image Contents#29729:0": {
+            "type": "BOOLEAN"
+        },
+        "Left Top#58686:0": {
+            "type": "INSTANCE_SWAP",
+            "preferredValues": [
+                {
+                    "type": "COMPONENT",
+                    "key": "00da9dcf0cc4e408d2e36da56d0701dce6cee6b0"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "0135e13dd2ded277e5d024f2d9ccc37f9aa7cf38"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "146925b01e772269f042df51f8d2cd5b4e492111"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "a711c13770db66a6a9d8dfec9205b301fb4abf4d"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "4907a3a324539a374a81c8255ac8ae2fc6769622"
+                }
+            ]
+        },
+        "Show Overlay#58686:33": {
+            "type": "BOOLEAN"
+        },
+        "Right Top#58686:66": {
+            "type": "INSTANCE_SWAP",
+            "preferredValues": [
+                {
+                    "type": "COMPONENT",
+                    "key": "a711c13770db66a6a9d8dfec9205b301fb4abf4d"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "00da9dcf0cc4e408d2e36da56d0701dce6cee6b0"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "0135e13dd2ded277e5d024f2d9ccc37f9aa7cf38"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "146925b01e772269f042df51f8d2cd5b4e492111"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "4907a3a324539a374a81c8255ac8ae2fc6769622"
+                }
+            ]
+        },
+        "Left Bottom#58686:99": {
+            "type": "INSTANCE_SWAP",
+            "preferredValues": [
+                {
+                    "type": "COMPONENT",
+                    "key": "00da9dcf0cc4e408d2e36da56d0701dce6cee6b0"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "0135e13dd2ded277e5d024f2d9ccc37f9aa7cf38"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "146925b01e772269f042df51f8d2cd5b4e492111"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "a711c13770db66a6a9d8dfec9205b301fb4abf4d"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "4907a3a324539a374a81c8255ac8ae2fc6769622"
+                }
+            ]
+        },
+        "Right Bottom#58686:132": {
+            "type": "INSTANCE_SWAP",
+            "preferredValues": [
+                {
+                    "type": "COMPONENT",
+                    "key": "a711c13770db66a6a9d8dfec9205b301fb4abf4d"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "00da9dcf0cc4e408d2e36da56d0701dce6cee6b0"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "0135e13dd2ded277e5d024f2d9ccc37f9aa7cf38"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "146925b01e772269f042df51f8d2cd5b4e492111"
+                },
+                {
+                    "type": "COMPONENT",
+                    "key": "4907a3a324539a374a81c8255ac8ae2fc6769622"
+                }
+            ]
+        },
+        "ㄴ Left Top#58686:165": {
+            "type": "BOOLEAN"
+        },
+        "ㄴ Right Top#58686:198": {
+            "type": "BOOLEAN"
+        },
+        "ㄴ Left Bottom#58686:231": {
+            "type": "BOOLEAN"
+        },
+        "ㄴ Right Bottom#58686:264": {
+            "type": "BOOLEAN"
+        },
+        "Ratio": {
+            "type": "VARIANT",
+            "variantOptions": [
+                "1:1",
+                "2:1",
+                "16:9",
+                "4:3",
+                "6:7",
+                "4:5",
+                "2:3"
+            ]
+        },
+        "Size": {
+            "type": "VARIANT",
+            "variantOptions": [
+                "20",
+                "24",
+                "36",
+                "42",
+                "48",
+                "64",
+                "80",
+                "96",
+                "120",
+                "\bFree"
+            ]
+        },
+        "Rounded": {
+            "type": "VARIANT",
+            "variantOptions": [
+                "True",
+                "False"
+            ]
+        }
+    }
+};
 const listHeader = {
     "name": "listHeader",
     "key": "609f93ed0608ef0a6d9a351e47595ad631bae0fa",
@@ -13695,42 +13989,6 @@ const segmentedControl = {
         }
     }
 };
-const selectBox = {
-    "name": "selectBox",
-    "key": "38722ffeb4c966256a709155e8ddac50c93d7c60",
-    "componentPropertyDefinitions": {
-        "Show Description#3033:0": {
-            "type": "BOOLEAN"
-        },
-        "Description #3033:5": {
-            "type": "TEXT"
-        },
-        "Label#3635:0": {
-            "type": "TEXT"
-        },
-        "Control": {
-            "type": "VARIANT",
-            "variantOptions": [
-                "Checkbox",
-                "Radio"
-            ]
-        },
-        "Selected": {
-            "type": "VARIANT",
-            "variantOptions": [
-                "True",
-                "False"
-            ]
-        },
-        "State": {
-            "type": "VARIANT",
-            "variantOptions": [
-                "Enabled",
-                "Pressed"
-            ]
-        }
-    }
-};
 const skeleton = {
     "name": "skeleton",
     "key": "ef22c3288722fbfa64a5ab73df397ade88f8e05a",
@@ -14130,6 +14388,7 @@ var FIGMA_COMPONENTS = {
   divider: divider,
   floatingActionButton: floatingActionButton,
   helpBubble: helpBubble,
+  imageFrame: imageFrame,
   listHeader: listHeader,
   listItem: listItem,
   mannerTemp: mannerTemp,
@@ -14146,7 +14405,6 @@ var FIGMA_COMPONENTS = {
   rootTopNavigationGlobal: rootTopNavigationGlobal,
   rootTopNavigationKr: rootTopNavigationKr,
   segmentedControl: segmentedControl,
-  selectBox: selectBox,
   skeleton: skeleton,
   slider: slider,
   snackbar: snackbar,
@@ -14158,7 +14416,7 @@ var FIGMA_COMPONENTS = {
   templateChipGroup: templateChipGroup,
   templateCustomPickerField: templateCustomPickerField,
   templateDisclaimer: templateDisclaimer,
-  templateSelectBoxGroup: templateSelectBoxGroup,
+  templateResultPage: templateResultPage,
   templateSliderField: templateSliderField,
   templateTextField: templateTextField,
   templateTextareaField: templateTextareaField,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seed-design/figma",
-  "version": "1.1.17",
+  "version": "1.1.18",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/daangn/seed-design.git",
@@ -46,7 +46,7 @@
   "devDependencies": {
     "@figma/plugin-typings": "^1.110.0",
     "@figma/rest-api-spec": "^0.35.0",
-    "@karrotmarket/icon-data": "^1.13.0",
+    "@karrotmarket/icon-data": "^1.17.0",
     "@seed-design/figma-extractor": "^1.0.0",
     "typescript": "^5.9.2"
   },

package/src/codegen/component-properties.ts

@@ -378,14 +378,6 @@ export type ToggleButtonProperties = InferComponentDefinition<
   typeof sets.toggleButton.componentPropertyDefinitions
 >;
 
-export type SelectBoxGroupProperties = InferComponentDefinition<
-  typeof sets.templateSelectBoxGroup.componentPropertyDefinitions
->;
-
-export type SelectBoxProperties = InferComponentDefinition<
-  typeof sets.selectBox.componentPropertyDefinitions
->;
-
 export type AppBarProperties = InferComponentDefinition<
   typeof sets.topNavigation.componentPropertyDefinitions
 >;
@@ -982,3 +974,38 @@ export type LegacyMultilineTextFieldProperties = InferComponentDefinition<{
     variantOptions: ["True", "False"];
   };
 }>;
+
+export type LegacySelectBoxProperties = InferComponentDefinition<{
+  "Show Description#3033:0": {
+    type: "BOOLEAN";
+  };
+  "Description #3033:5": {
+    type: "TEXT";
+  };
+  "Label#3635:0": {
+    type: "TEXT";
+  };
+  Control: {
+    type: "VARIANT";
+    variantOptions: ["Checkbox", "Radio"];
+  };
+  Selected: {
+    type: "VARIANT";
+    variantOptions: ["True", "False"];
+  };
+  State: {
+    type: "VARIANT";
+    variantOptions: ["Enabled", "Pressed"];
+  };
+}>;
+
+export type LegacySelectBoxGroupProperties = InferComponentDefinition<{
+  Control: {
+    type: "VARIANT";
+    variantOptions: ["Checkbox", "Radio"];
+  };
+  "Item Count": {
+    type: "VARIANT";
+    variantOptions: ["1", "2", "3", "4", "5", "6"];
+  };
+}>;

package/src/codegen/targets/react/component/handlers/{select-box.ts → legacy-select-box.ts}

@@ -1,6 +1,8 @@
-import type { SelectBoxGroupProperties, SelectBoxProperties } from "@/codegen/component-properties";
+import type {
+  LegacySelectBoxGroupProperties,
+  LegacySelectBoxProperties,
+} from "@/codegen/component-properties";
 import { defineComponentHandler } from "@/codegen/core";
-import * as metadata from "@/entities/data/__generated__/component-sets";
 import { findAllInstances } from "@/utils/figma-node";
 import { match } from "ts-pattern";
 import { createLocalSnippetHelper, createSeedReactElement } from "../../element-factories";
@@ -8,9 +10,12 @@ import type { ComponentHandlerDeps } from "../deps.interface";
 
 const { createLocalSnippetElement } = createLocalSnippetHelper("select-box");
 
-export const createSelectBoxHandler = (_ctx: ComponentHandlerDeps) =>
-  defineComponentHandler<SelectBoxProperties>(
-    metadata.selectBox.key,
+const LEGACY_SELECT_BOX_KEY = "38722ffeb4c966256a709155e8ddac50c93d7c60";
+const LEGACY_SELECT_BOX_GROUP_KEY = "a3d58bb8540600878742cdcf2608a4b3851667ec";
+
+export const createLegacySelectBoxHandler = (_ctx: ComponentHandlerDeps) =>
+  defineComponentHandler<LegacySelectBoxProperties>(
+    LEGACY_SELECT_BOX_KEY,
     ({ componentProperties: props }) => {
       const tag = match(props.Control.value)
         .with("Checkbox", () => "CheckSelectBox")
@@ -31,15 +36,18 @@ export const createSelectBoxHandler = (_ctx: ComponentHandlerDeps) =>
           }),
       };
 
-      return createLocalSnippetElement(tag, commonProps);
+      return createLocalSnippetElement(tag, commonProps, undefined, {
+        comment:
+          "이 Figma 컴포넌트는 @seed-design/react@1.2보다 낮은 버전의 SelectBox입니다. 신규 컴포넌트로 교체할 수 있습니다.",
+      });
     },
   );
 
-export const createSelectBoxGroupHandler = (ctx: ComponentHandlerDeps) => {
-  const selectBoxHandler = createSelectBoxHandler(ctx);
+export const createLegacySelectBoxGroupHandler = (ctx: ComponentHandlerDeps) => {
+  const selectBoxHandler = createLegacySelectBoxHandler(ctx);
 
-  return defineComponentHandler<SelectBoxGroupProperties>(
-    metadata.templateSelectBoxGroup.key,
+  return defineComponentHandler<LegacySelectBoxGroupProperties>(
+    LEGACY_SELECT_BOX_GROUP_KEY,
     (node, traverse) => {
       const props = node.componentProperties;
 
@@ -48,7 +56,7 @@ export const createSelectBoxGroupHandler = (ctx: ComponentHandlerDeps) => {
         .with("Radio", () => "RadioSelectBoxRoot")
         .exhaustive();
 
-      const selectBoxes = findAllInstances<SelectBoxProperties>({
+      const selectBoxes = findAllInstances<LegacySelectBoxProperties>({
         node,
         key: selectBoxHandler.key,
       });
@@ -72,7 +80,10 @@ export const createSelectBoxGroupHandler = (ctx: ComponentHandlerDeps) => {
         }),
       };
 
-      return createLocalSnippetElement(tag, commonProps, stack);
+      return createLocalSnippetElement(tag, commonProps, stack, {
+        comment:
+          "이 Figma 컴포넌트는 @seed-design/react@1.2보다 낮은 버전의 SelectBox입니다. 신규 컴포넌트로 교체할 수 있습니다.",
+      });
     },
   );
 };

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

@@ -112,7 +112,8 @@ export const createLegacyTextFieldHandler = (ctx: ComponentHandlerDeps) =>
       const TextFieldChildren = createLocalSnippetElement("TextFieldInput", inputProps);
 
       return createLocalSnippetElement("TextField", commonProps, TextFieldChildren, {
-        comment: "이 Figma 컴포넌트는 @seed-design/react@1.1보다 낮은 버전의 TextField입니다.",
+        comment:
+          "이 Figma 컴포넌트는 @seed-design/react@1.1보다 낮은 버전의 TextField입니다. 신규 컴포넌트로 교체할 수 있습니다.",
       });
     },
   );
@@ -190,7 +191,8 @@ export const createLegacyMultilineTextFieldHandler = (_ctx: ComponentHandlerDeps
       const TextFieldChildren = createLocalSnippetElement("TextFieldTextarea", inputProps);
 
       return createLocalSnippetElement("TextField", commonProps, TextFieldChildren, {
-        comment: "이 Figma 컴포넌트는 @seed-design/react@1.1보다 낮은 버전의 TextField입니다.",
+        comment:
+          "이 Figma 컴포넌트는 @seed-design/react@1.1보다 낮은 버전의 TextField입니다. 신규 컴포넌트로 교체할 수 있습니다.",
       });
     },
   );

package/src/codegen/targets/react/component/index.ts

@@ -40,7 +40,6 @@ import { createRadiomarkHandler } from "@/codegen/targets/react/component/handle
 import { createReactionButtonHandler } from "./handlers/reaction-button";
 import { createResultSectionHandler } from "./handlers/result-section";
 import { createSegmentedControlHandler } from "./handlers/segmented-control";
-import { createSelectBoxGroupHandler, createSelectBoxHandler } from "./handlers/select-box";
 import { createSkeletonHandler } from "./handlers/skeleton";
 import {
   createSliderHandler,
@@ -60,6 +59,10 @@ import {
   createLegacyTextFieldHandler,
   createLegacyMultilineTextFieldHandler,
 } from "./handlers/legacy-text-field";
+import {
+  createLegacySelectBoxHandler,
+  createLegacySelectBoxGroupHandler,
+} from "./handlers/legacy-select-box";
 
 export type { ComponentHandlerDeps };
 export type UnboundComponentHandler<T extends NormalizedInstanceNode["componentProperties"]> = (
@@ -97,8 +100,10 @@ export const unboundSeedComponentHandlers: Array<UnboundComponentHandler<any>> =
   createAvatarHandler,
   createAvatarStackHandler,
   createSegmentedControlHandler,
-  createSelectBoxGroupHandler,
-  createSelectBoxHandler,
+
+  createLegacySelectBoxHandler,
+  createLegacySelectBoxGroupHandler,
+
   createSliderHandler,
   createSliderFieldHandler,
   createTabsHandler,