chore: extract iconControl out into a shared import

Author: aaronbassett

packages/component-library/src/Button/index.stories.tsx

@@ -1,18 +1,7 @@
-import * as icons from "@phosphor-icons/react/dist/ssr";
 import type { Meta, StoryObj } from "@storybook/react";
 
 import { Button as ButtonComponent, VARIANTS, SIZES } from "./index.jsx";
-
-const iconControl = {
-  control: "select",
-  options: Object.keys(icons),
-  mapping: Object.fromEntries(
-    Object.entries(icons).map(([iconName, Icon]) => [
-      iconName,
-      <Icon key={iconName} weights={new Map()} />,
-    ]),
-  ),
-} as const;
+import { iconControl } from "../icon-control.jsx";
 
 const meta = {
   component: ButtonComponent,

packages/component-library/src/Card/index.stories.tsx

@@ -1,7 +1,7 @@
-import * as Icon from "@phosphor-icons/react/dist/ssr";
 import type { Meta, StoryObj } from "@storybook/react";
 
 import { Card as CardComponent, VARIANTS } from "./index.jsx";
+import { iconControl } from "../icon-control.jsx";
 
 const meta = {
   component: CardComponent,
@@ -44,14 +44,7 @@ const meta = {
       },
     },
     icon: {
-      control: "select",
-      options: Object.keys(Icon),
-      mapping: Object.fromEntries(
-        Object.entries(Icon).map(([key, Icon]) => [
-          key,
-          <Icon weights={new Map()} key={key} />,
-        ]),
-      ),
+      ...iconControl,
       table: {
         category: "Contents",
       },

packages/component-library/src/icon-control.tsx

@@ -0,0 +1,12 @@
+import * as icons from "@phosphor-icons/react/dist/ssr";
+
+export const iconControl = {
+  control: "select",
+  options: Object.keys(icons),
+  mapping: Object.fromEntries(
+    Object.entries(icons).map(([iconName, Icon]) => [
+      iconName,
+      <Icon key={iconName} weights={new Map()} />,
+    ]),
+  ),
+} as const;