@webiny/admin-ui 6.0.0-alpha.4 → 6.0.0-rc.0

package/Icon/Icon.stories.js

@@ -1,6 +1,6 @@
 import React from "react";
 import { ReactComponent as XIcon } from "@webiny/icons/close.svg";
-import { Icon } from "./Icon";
+import { Icon } from "./Icon.js";
 const meta = {
   title: "Components/Icon",
   component: Icon
@@ -26,7 +26,7 @@ export const Default = {
 };
 export const ColorInherit = {
   decorators: [Story => /*#__PURE__*/React.createElement("div", {
-    className: "wby-fill-success"
+    className: "fill-success"
   }, /*#__PURE__*/React.createElement(Story, null))],
   args: {
     ...Default.args,
@@ -53,7 +53,7 @@ export const ColorNeutralStrong = {
 };
 export const ColorNeutralStrongTransparent = {
   decorators: [Story => /*#__PURE__*/React.createElement("div", {
-    className: "wby-bg-neutral-disabled wby-p-3xl wby-rounded-md"
+    className: "bg-neutral-disabled p-3xl rounded-md"
   }, /*#__PURE__*/React.createElement(Story, null))],
   args: {
     ...Default.args,
@@ -62,7 +62,7 @@ export const ColorNeutralStrongTransparent = {
 };
 export const ColorNeutralBase = {
   decorators: [Story => /*#__PURE__*/React.createElement("div", {
-    className: "wby-bg-neutral-dark wby-p-3xl wby-rounded-md"
+    className: "bg-neutral-dark p-3xl rounded-md"
   }, /*#__PURE__*/React.createElement(Story, null))],
   args: {
     ...Default.args,
@@ -71,7 +71,7 @@ export const ColorNeutralBase = {
 };
 export const ColorNeutralNegative = {
   decorators: [Story => /*#__PURE__*/React.createElement("div", {
-    className: "wby-bg-neutral-dark wby-p-3xl wby-rounded-md"
+    className: "bg-neutral-dark p-3xl rounded-md"
   }, /*#__PURE__*/React.createElement(Story, null))],
   args: {
     ...Default.args,
@@ -112,8 +112,7 @@ export const Documentation = {
   },
   argTypes: {
     icon: {
-      description: "The SVG icon component to be rendered. Please refer to the example code for details.",
-      control: "none"
+      description: "The SVG icon component to be rendered. Please refer to the example code for details."
     },
     label: {
       description: "Accessible label for the icon (for screen readers)",

package/Icon/Icon.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","ReactComponent","XIcon","Icon","meta","title","component","Default","args","icon","createElement","label","size","color","argTypes","control","options","ColorInherit","decorators","Story","className","ColorAccent","ColorNeutralLight","ColorNeutralStrong","ColorNeutralStrongTransparent","ColorNeutralBase","ColorNeutralNegative","SizeXs","SizeSm","SizeMd","SizeLg","Documentation","description"],"sources":["Icon.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { ReactComponent as XIcon } from \"@webiny/icons/close.svg\";\nimport { Icon } from \"./Icon\";\n\nconst meta: Meta<typeof Icon> = {\n    title: \"Components/Icon\",\n    component: Icon\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Icon>;\n\nexport const Default: Story = {\n    args: {\n        icon: <XIcon />,\n        label: \"This is an icon\",\n        size: \"md\",\n        color: \"accent\"\n    },\n    argTypes: {\n        size: {\n            control: \"select\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\"]\n        },\n        color: {\n            control: \"select\",\n            options: [\n                \"accent\",\n                \"neutral-light\",\n                \"neutral-strong\",\n                \"neutral-strong-transparent\",\n                \"neutral-base\",\n                \"neutral-negative\",\n                \"inherit\"\n            ]\n        }\n    }\n};\n\nexport const ColorInherit: Story = {\n    decorators: [\n        Story => (\n            <div className=\"wby-fill-success\">\n                <Story />\n            </div>\n        )\n    ],\n    args: {\n        ...Default.args,\n        color: \"inherit\"\n    }\n};\n\nexport const ColorAccent: Story = {\n    args: {\n        ...Default.args,\n        color: \"accent\"\n    }\n};\n\nexport const ColorNeutralLight: Story = {\n    args: {\n        ...Default.args,\n        color: \"neutral-light\"\n    }\n};\n\nexport const ColorNeutralStrong: Story = {\n    args: {\n        ...Default.args,\n        color: \"neutral-strong\"\n    }\n};\n\nexport const ColorNeutralStrongTransparent: Story = {\n    decorators: [\n        Story => (\n            <div className=\"wby-bg-neutral-disabled wby-p-3xl wby-rounded-md\">\n                <Story />\n            </div>\n        )\n    ],\n    args: {\n        ...Default.args,\n        color: \"neutral-strong-transparent\"\n    }\n};\n\nexport const ColorNeutralBase: Story = {\n    decorators: [\n        Story => (\n            <div className=\"wby-bg-neutral-dark wby-p-3xl wby-rounded-md\">\n                <Story />\n            </div>\n        )\n    ],\n    args: {\n        ...Default.args,\n        color: \"neutral-base\"\n    }\n};\n\nexport const ColorNeutralNegative: Story = {\n    decorators: [\n        Story => (\n            <div className=\"wby-bg-neutral-dark wby-p-3xl wby-rounded-md\">\n                <Story />\n            </div>\n        )\n    ],\n    args: {\n        ...Default.args,\n        color: \"neutral-negative\"\n    }\n};\n\nexport const SizeXs: Story = {\n    args: {\n        ...Default.args,\n        size: \"xs\"\n    }\n};\n\nexport const SizeSm: Story = {\n    args: {\n        ...Default.args,\n        size: \"sm\"\n    }\n};\n\nexport const SizeMd: Story = {\n    args: {\n        ...Default.args,\n        size: \"md\"\n    }\n};\n\nexport const SizeLg: Story = {\n    args: {\n        ...Default.args,\n        size: \"lg\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        icon: <XIcon />,\n        label: \"Close icon\",\n        size: \"md\",\n        color: \"accent\",\n        className: \"\"\n    },\n    argTypes: {\n        icon: {\n            description:\n                \"The SVG icon component to be rendered. Please refer to the example code for details.\",\n            control: \"none\"\n        },\n        label: {\n            description: \"Accessible label for the icon (for screen readers)\",\n            control: \"text\"\n        },\n        size: {\n            description: \"The size of the icon\",\n            control: \"select\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\"]\n        },\n        color: {\n            description: \"The color of the icon\",\n            control: \"select\",\n            options: [\n                \"inherit\",\n                \"accent\",\n                \"neutral-base\",\n                \"neutral-light\",\n                \"neutral-strong\",\n                \"neutral-strong-transparent\",\n                \"neutral-negative\"\n            ]\n        },\n        className: {\n            description:\n                \"Additional CSS classes to apply to the icon. You can pass multiple classes, separated by commas or spaces.\",\n            control: \"text\"\n        }\n    }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","ReactComponent","XIcon","Icon","meta","title","component","Default","args","icon","createElement","label","size","color","argTypes","control","options","ColorInherit","decorators","Story","className","ColorAccent","ColorNeutralLight","ColorNeutralStrong","ColorNeutralStrongTransparent","ColorNeutralBase","ColorNeutralNegative","SizeXs","SizeSm","SizeMd","SizeLg","Documentation","description"],"sources":["Icon.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { ReactComponent as XIcon } from \"@webiny/icons/close.svg\";\nimport { Icon } from \"./Icon.js\";\n\nconst meta: Meta<typeof Icon> = {\n    title: \"Components/Icon\",\n    component: Icon\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Icon>;\n\nexport const Default: Story = {\n    args: {\n        icon: <XIcon />,\n        label: \"This is an icon\",\n        size: \"md\",\n        color: \"accent\"\n    },\n    argTypes: {\n        size: {\n            control: \"select\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\"]\n        },\n        color: {\n            control: \"select\",\n            options: [\n                \"accent\",\n                \"neutral-light\",\n                \"neutral-strong\",\n                \"neutral-strong-transparent\",\n                \"neutral-base\",\n                \"neutral-negative\",\n                \"inherit\"\n            ]\n        }\n    }\n};\n\nexport const ColorInherit: Story = {\n    decorators: [\n        Story => (\n            <div className=\"fill-success\">\n                <Story />\n            </div>\n        )\n    ],\n    args: {\n        ...Default.args,\n        color: \"inherit\"\n    }\n};\n\nexport const ColorAccent: Story = {\n    args: {\n        ...Default.args,\n        color: \"accent\"\n    }\n};\n\nexport const ColorNeutralLight: Story = {\n    args: {\n        ...Default.args,\n        color: \"neutral-light\"\n    }\n};\n\nexport const ColorNeutralStrong: Story = {\n    args: {\n        ...Default.args,\n        color: \"neutral-strong\"\n    }\n};\n\nexport const ColorNeutralStrongTransparent: Story = {\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-disabled p-3xl rounded-md\">\n                <Story />\n            </div>\n        )\n    ],\n    args: {\n        ...Default.args,\n        color: \"neutral-strong-transparent\"\n    }\n};\n\nexport const ColorNeutralBase: Story = {\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark p-3xl rounded-md\">\n                <Story />\n            </div>\n        )\n    ],\n    args: {\n        ...Default.args,\n        color: \"neutral-base\"\n    }\n};\n\nexport const ColorNeutralNegative: Story = {\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark p-3xl rounded-md\">\n                <Story />\n            </div>\n        )\n    ],\n    args: {\n        ...Default.args,\n        color: \"neutral-negative\"\n    }\n};\n\nexport const SizeXs: Story = {\n    args: {\n        ...Default.args,\n        size: \"xs\"\n    }\n};\n\nexport const SizeSm: Story = {\n    args: {\n        ...Default.args,\n        size: \"sm\"\n    }\n};\n\nexport const SizeMd: Story = {\n    args: {\n        ...Default.args,\n        size: \"md\"\n    }\n};\n\nexport const SizeLg: Story = {\n    args: {\n        ...Default.args,\n        size: \"lg\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        icon: <XIcon />,\n        label: \"Close icon\",\n        size: \"md\",\n        color: \"accent\",\n        className: \"\"\n    },\n    argTypes: {\n        icon: {\n            description:\n                \"The SVG icon component to be rendered. Please refer to the example code for details.\"\n        },\n        label: {\n            description: \"Accessible label for the icon (for screen readers)\",\n            control: \"text\"\n        },\n        size: {\n            description: \"The size of the icon\",\n            control: \"select\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\"]\n        },\n        color: {\n            description: \"The color of the icon\",\n            control: \"select\",\n            options: [\n                \"inherit\",\n                \"accent\",\n                \"neutral-base\",\n                \"neutral-light\",\n                \"neutral-strong\",\n                \"neutral-strong-transparent\",\n                \"neutral-negative\"\n            ]\n        },\n        className: {\n            description:\n                \"Additional CSS classes to apply to the icon. You can pass multiple classes, separated by commas or spaces.\",\n            control: \"text\"\n        }\n    }\n};\n"],"mappings":"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","ignoreList":[]}

package/Icon/index.d.ts

@@ -1 +1 @@
-export * from "./Icon";
+export * from "./Icon.js";

package/Icon/index.js

@@ -1,3 +1,3 @@
-export * from "./Icon";
+export * from "./Icon.js";
 
 //# sourceMappingURL=index.js.map

package/Icon/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Icon\";\n"],"mappings":"AAAA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Icon.js\";\n"],"mappings":"AAAA","ignoreList":[]}

package/IconPicker/IconPicker.d.ts

@@ -1,22 +1,22 @@
 import React from "react";
-import type { IconPickerPrimitiveProps } from "./primitives";
-import type { FormComponentProps } from "../FormComponent";
+import type { IconPickerPrimitiveProps } from "./primitives/index.js";
+import type { FormComponentProps } from "../FormComponent/index.js";
 type IconPickerProps = IconPickerPrimitiveProps & FormComponentProps;
-declare const IconPicker: (({ label, description, note, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element) & {
-    original: ({ label, description, note, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element;
+declare const IconPicker: (({ label, description, note, hint, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element) & {
+    original: ({ label, description, note, hint, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ label, description, note, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element) & {
-        original: ({ label, description, note, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element;
+    original: (({ label, description, note, hint, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element) & {
+        original: ({ label, description, note, hint, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(({ label, description, note, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element) & {
-        original: ({ label, description, note, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ label, description, note, hint, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element) & {
+        original: ({ label, description, note, hint, required, disabled, validation, ...props }: IconPickerProps) => React.JSX.Element;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/IconPicker/IconPicker.js

@@ -1,11 +1,12 @@
 import React, { useMemo } from "react";
-import { makeDecoratable } from "../utils";
-import { IconPickerPrimitive } from "./primitives";
-import { FormComponentDescription, FormComponentErrorMessage, FormComponentLabel, FormComponentNote } from "../FormComponent";
+import { makeDecoratable } from "../utils.js";
+import { IconPickerPrimitive } from "./primitives/index.js";
+import { FormComponentDescription, FormComponentErrorMessage, FormComponentLabel, FormComponentNote } from "../FormComponent/index.js";
 const DecoratableIconPicker = ({
   label,
   description,
   note,
+  hint,
   required,
   disabled,
   validation,
@@ -17,9 +18,10 @@ const DecoratableIconPicker = ({
   } = validation || {};
   const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);
   return /*#__PURE__*/React.createElement("div", {
-    className: "wby-w-full"
+    className: "w-full"
   }, /*#__PURE__*/React.createElement(FormComponentLabel, {
     text: label,
+    hint: hint,
     required: required,
     disabled: disabled,
     invalid: invalid

package/IconPicker/IconPicker.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","makeDecoratable","IconPickerPrimitive","FormComponentDescription","FormComponentErrorMessage","FormComponentLabel","FormComponentNote","DecoratableIconPicker","label","description","note","required","disabled","validation","props","isValid","validationIsValid","message","validationMessage","invalid","createElement","className","text","Object","assign","IconPicker"],"sources":["IconPicker.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { makeDecoratable } from \"~/utils\";\nimport type { IconPickerPrimitiveProps } from \"./primitives\";\nimport { IconPickerPrimitive } from \"./primitives\";\nimport type { FormComponentProps } from \"~/FormComponent\";\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentLabel,\n    FormComponentNote\n} from \"~/FormComponent\";\n\ntype IconPickerProps = IconPickerPrimitiveProps & FormComponentProps;\n\nconst DecoratableIconPicker = ({\n    label,\n    description,\n    note,\n    required,\n    disabled,\n    validation,\n    ...props\n}: IconPickerProps) => {\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    return (\n        <div className={\"wby-w-full\"}>\n            <FormComponentLabel\n                text={label}\n                required={required}\n                disabled={disabled}\n                invalid={invalid}\n            />\n            <FormComponentDescription text={description} disabled={disabled} />\n            <IconPickerPrimitive {...props} disabled={disabled} invalid={invalid} />\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={disabled}\n            />\n            <FormComponentNote text={note} disabled={disabled} />\n        </div>\n    );\n};\nconst IconPicker = makeDecoratable(\"IconPicker\", DecoratableIconPicker);\n\nexport { IconPicker, type IconPickerProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,eAAe;AAExB,SAASC,mBAAmB;AAE5B,SACIC,wBAAwB,EACxBC,yBAAyB,EACzBC,kBAAkB,EAClBC,iBAAiB;AAKrB,MAAMC,qBAAqB,GAAGA,CAAC;EAC3BC,KAAK;EACLC,WAAW;EACXC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,UAAU;EACV,GAAGC;AACU,CAAC,KAAK;EACnB,MAAM;IAAEC,OAAO,EAAEC,iBAAiB;IAAEC,OAAO,EAAEC;EAAkB,CAAC,GAAGL,UAAU,IAAI,CAAC,CAAC;EACnF,MAAMM,OAAO,GAAGnB,OAAO,CAAC,MAAMgB,iBAAiB,KAAK,KAAK,EAAE,CAACA,iBAAiB,CAAC,CAAC;EAE/E,oBACIjB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAa,gBACzBtB,KAAA,CAAAqB,aAAA,CAACf,kBAAkB;IACfiB,IAAI,EAAEd,KAAM;IACZG,QAAQ,EAAEA,QAAS;IACnBC,QAAQ,EAAEA,QAAS;IACnBO,OAAO,EAAEA;EAAQ,CACpB,CAAC,eACFpB,KAAA,CAAAqB,aAAA,CAACjB,wBAAwB;IAACmB,IAAI,EAAEb,WAAY;IAACG,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACnEb,KAAA,CAAAqB,aAAA,CAAClB,mBAAmB,EAAAqB,MAAA,CAAAC,MAAA,KAAKV,KAAK;IAAEF,QAAQ,EAAEA,QAAS;IAACO,OAAO,EAAEA;EAAQ,EAAE,CAAC,eACxEpB,KAAA,CAAAqB,aAAA,CAAChB,yBAAyB;IACtBkB,IAAI,EAAEJ,iBAAkB;IACxBC,OAAO,EAAEA,OAAQ;IACjBP,QAAQ,EAAEA;EAAS,CACtB,CAAC,eACFb,KAAA,CAAAqB,aAAA,CAACd,iBAAiB;IAACgB,IAAI,EAAEZ,IAAK;IAACE,QAAQ,EAAEA;EAAS,CAAE,CACnD,CAAC;AAEd,CAAC;AACD,MAAMa,UAAU,GAAGxB,eAAe,CAAC,YAAY,EAAEM,qBAAqB,CAAC;AAEvE,SAASkB,UAAU","ignoreList":[]}
+{"version":3,"names":["React","useMemo","makeDecoratable","IconPickerPrimitive","FormComponentDescription","FormComponentErrorMessage","FormComponentLabel","FormComponentNote","DecoratableIconPicker","label","description","note","hint","required","disabled","validation","props","isValid","validationIsValid","message","validationMessage","invalid","createElement","className","text","Object","assign","IconPicker"],"sources":["IconPicker.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { makeDecoratable } from \"~/utils.js\";\nimport type { IconPickerPrimitiveProps } from \"./primitives/index.js\";\nimport { IconPickerPrimitive } from \"./primitives/index.js\";\nimport type { FormComponentProps } from \"~/FormComponent/index.js\";\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentLabel,\n    FormComponentNote\n} from \"~/FormComponent/index.js\";\n\ntype IconPickerProps = IconPickerPrimitiveProps & FormComponentProps;\n\nconst DecoratableIconPicker = ({\n    label,\n    description,\n    note,\n    hint,\n    required,\n    disabled,\n    validation,\n    ...props\n}: IconPickerProps) => {\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    return (\n        <div className={\"w-full\"}>\n            <FormComponentLabel\n                text={label}\n                hint={hint}\n                required={required}\n                disabled={disabled}\n                invalid={invalid}\n            />\n            <FormComponentDescription text={description} disabled={disabled} />\n            <IconPickerPrimitive {...props} disabled={disabled} invalid={invalid} />\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={disabled}\n            />\n            <FormComponentNote text={note} disabled={disabled} />\n        </div>\n    );\n};\nconst IconPicker = makeDecoratable(\"IconPicker\", DecoratableIconPicker);\n\nexport { IconPicker, type IconPickerProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,eAAe;AAExB,SAASC,mBAAmB;AAE5B,SACIC,wBAAwB,EACxBC,yBAAyB,EACzBC,kBAAkB,EAClBC,iBAAiB;AAKrB,MAAMC,qBAAqB,GAAGA,CAAC;EAC3BC,KAAK;EACLC,WAAW;EACXC,IAAI;EACJC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,UAAU;EACV,GAAGC;AACU,CAAC,KAAK;EACnB,MAAM;IAAEC,OAAO,EAAEC,iBAAiB;IAAEC,OAAO,EAAEC;EAAkB,CAAC,GAAGL,UAAU,IAAI,CAAC,CAAC;EACnF,MAAMM,OAAO,GAAGpB,OAAO,CAAC,MAAMiB,iBAAiB,KAAK,KAAK,EAAE,CAACA,iBAAiB,CAAC,CAAC;EAE/E,oBACIlB,KAAA,CAAAsB,aAAA;IAAKC,SAAS,EAAE;EAAS,gBACrBvB,KAAA,CAAAsB,aAAA,CAAChB,kBAAkB;IACfkB,IAAI,EAAEf,KAAM;IACZG,IAAI,EAAEA,IAAK;IACXC,QAAQ,EAAEA,QAAS;IACnBC,QAAQ,EAAEA,QAAS;IACnBO,OAAO,EAAEA;EAAQ,CACpB,CAAC,eACFrB,KAAA,CAAAsB,aAAA,CAAClB,wBAAwB;IAACoB,IAAI,EAAEd,WAAY;IAACI,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACnEd,KAAA,CAAAsB,aAAA,CAACnB,mBAAmB,EAAAsB,MAAA,CAAAC,MAAA,KAAKV,KAAK;IAAEF,QAAQ,EAAEA,QAAS;IAACO,OAAO,EAAEA;EAAQ,EAAE,CAAC,eACxErB,KAAA,CAAAsB,aAAA,CAACjB,yBAAyB;IACtBmB,IAAI,EAAEJ,iBAAkB;IACxBC,OAAO,EAAEA,OAAQ;IACjBP,QAAQ,EAAEA;EAAS,CACtB,CAAC,eACFd,KAAA,CAAAsB,aAAA,CAACf,iBAAiB;IAACiB,IAAI,EAAEb,IAAK;IAACG,QAAQ,EAAEA;EAAS,CAAE,CACnD,CAAC;AAEd,CAAC;AACD,MAAMa,UAAU,GAAGzB,eAAe,CAAC,YAAY,EAAEM,qBAAqB,CAAC;AAEvE,SAASmB,UAAU","ignoreList":[]}

package/IconPicker/IconPicker.mdx

@@ -1,4 +1,4 @@
-import { Canvas, Meta, Controls } from '@storybook/blocks';
+import { Canvas, Meta, Controls } from '@storybook/addon-docs/blocks';
 
 import * as IconPickerStories from './IconPicker.stories';
 

package/IconPicker/IconPicker.stories.d.ts

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { IconPicker } from "./";
+import type { Meta, StoryObj } from "@storybook/react-webpack5";
+import { IconPicker } from "../IconPicker/index.js";
 declare const meta: Meta<typeof IconPicker>;
 export default meta;
 type Story = StoryObj<typeof IconPicker>;

package/IconPicker/IconPicker.stories.js

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from "react";
 import { library } from "@fortawesome/fontawesome-svg-core";
 import { fas } from "@fortawesome/free-solid-svg-icons";
-import { IconPicker } from "./";
+import { IconPicker } from "./index.js";
 const meta = {
   title: "Components/Form/IconPicker",
   component: IconPicker,
@@ -339,16 +339,13 @@ export const Documentation = {
       control: "object"
     },
     value: {
-      description: "The selected icon value (in format 'prefix/name')",
-      control: "none"
+      description: "The selected icon value (in format 'prefix/name')"
     },
     validation: {
-      description: "Object containing validation state and message. Please refer to the example code for details on usage.",
-      control: "none"
+      description: "Object containing validation state and message. Please refer to the example code for details on usage."
     },
     onChange: {
-      description: "Function called when an icon is selected",
-      control: "none"
+      description: "Function called when an icon is selected"
     }
   }
 };

package/IconPicker/IconPicker.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useState","useEffect","library","fas","IconPicker","meta","title","component","argTypes","onChange","action","disabled","control","defaultValue","parameters","layout","render","args","value","setValue","createElement","Object","assign","add","Default","icons","prefix","name","WithLabel","label","WithLabelRequired","required","WithDescription","description","WithNotes","note","WithErrors","validation","isValid","message","Disabled","FullExample","Documentation","setValidation","handleChange","newValue","undefined"],"sources":["IconPicker.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { library } from \"@fortawesome/fontawesome-svg-core\";\nimport { fas } from \"@fortawesome/free-solid-svg-icons\";\nimport { IconPicker } from \"~/IconPicker\";\n\nconst meta: Meta<typeof IconPicker> = {\n    title: \"Components/Form/IconPicker\",\n    component: IconPicker,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <IconPicker {...args} value={value} onChange={setValue} />;\n    }\n};\n\n// @ts-expect-error\nlibrary.add(fas);\n\nexport default meta;\ntype Story = StoryObj<typeof IconPicker>;\n\nexport const Default: Story = {\n    args: {\n        icons: [\n            { prefix: \"fas\", name: \"trash-restore-alt\" },\n            { prefix: \"fas\", name: \"trash-can-arrow-up\" },\n            { prefix: \"fas\", name: \"naira-sign\" },\n            { prefix: \"fas\", name: \"cart-arrow-down\" },\n            { prefix: \"fas\", name: \"walkie-talkie\" },\n            { prefix: \"fas\", name: \"file-edit\" },\n            { prefix: \"fas\", name: \"file-pen\" },\n            { prefix: \"fas\", name: \"receipt\" },\n            { prefix: \"fas\", name: \"pen-square\" },\n            { prefix: \"fas\", name: \"pencil-square\" },\n            { prefix: \"fas\", name: \"square-pen\" },\n            { prefix: \"fas\", name: \"suitcase-rolling\" },\n            { prefix: \"fas\", name: \"person-circle-exclamation\" },\n            { prefix: \"fas\", name: \"chevron-down\" },\n            { prefix: \"fas\", name: \"battery\" },\n            { prefix: \"fas\", name: \"battery-5\" },\n            { prefix: \"fas\", name: \"battery-full\" },\n            { prefix: \"fas\", name: \"skull-crossbones\" },\n            { prefix: \"fas\", name: \"code-compare\" },\n            { prefix: \"fas\", name: \"list-dots\" },\n            { prefix: \"fas\", name: \"list-ul\" },\n            { prefix: \"fas\", name: \"school-lock\" },\n            { prefix: \"fas\", name: \"tower-cell\" },\n            { prefix: \"fas\", name: \"long-arrow-alt-down\" },\n            { prefix: \"fas\", name: \"down-long\" },\n            { prefix: \"fas\", name: \"ranking-star\" },\n            { prefix: \"fas\", name: \"chess-king\" },\n            { prefix: \"fas\", name: \"person-harassing\" },\n            { prefix: \"fas\", name: \"brazilian-real-sign\" },\n            { prefix: \"fas\", name: \"landmark-alt\" },\n            { prefix: \"fas\", name: \"landmark-dome\" },\n            { prefix: \"fas\", name: \"arrow-up\" },\n            { prefix: \"fas\", name: \"television\" },\n            { prefix: \"fas\", name: \"tv-alt\" },\n            { prefix: \"fas\", name: \"tv\" },\n            { prefix: \"fas\", name: \"shrimp\" },\n            { prefix: \"fas\", name: \"tasks\" },\n            { prefix: \"fas\", name: \"list-check\" },\n            { prefix: \"fas\", name: \"jug-detergent\" },\n            { prefix: \"fas\", name: \"user-circle\" },\n            { prefix: \"fas\", name: \"circle-user\" },\n            { prefix: \"fas\", name: \"user-shield\" },\n            { prefix: \"fas\", name: \"wind\" },\n            { prefix: \"fas\", name: \"car-crash\" },\n            { prefix: \"fas\", name: \"car-burst\" },\n            { prefix: \"fas\", name: \"y\" },\n            { prefix: \"fas\", name: \"snowboarding\" },\n            { prefix: \"fas\", name: \"person-snowboarding\" },\n            { prefix: \"fas\", name: \"shipping-fast\" },\n            { prefix: \"fas\", name: \"truck-fast\" }\n        ]\n    }\n};\n\nexport const WithLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\"\n    }\n};\n\nexport const WithLabelRequired: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: \"Provide the required information for processing your request.\"\n    }\n};\n\nexport const WithNotes: Story = {\n    args: {\n        ...Default.args,\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\"\n    }\n};\n\nexport const WithErrors: Story = {\n    args: {\n        ...Default.args,\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true,\n        description: \"Provide the required information for processing your request.\",\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Documentation: Story = {\n    render: args => {\n        const [value, setValue] = useState(args.value || null);\n        const [validation, setValidation] = useState({ isValid: true, message: \"\" });\n\n        // Update value when args.value changes\n        useEffect(() => {\n            setValue(args.value || null);\n        }, [args.value]);\n\n        const handleChange = (newValue: any) => {\n            setValue(newValue);\n\n            // Simple required validation\n            if (args.required && !newValue) {\n                setValidation({ isValid: false, message: \"Please select an icon\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        };\n\n        // Validate on required change or value change\n        useEffect(() => {\n            if (args.required && !value) {\n                setValidation({ isValid: false, message: \"Please select an icon\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        }, [args.required, value]);\n\n        return (\n            <IconPicker\n                {...args}\n                value={value}\n                onChange={handleChange}\n                validation={validation}\n                required={args.required}\n            />\n        );\n    },\n    args: {\n        label: \"Select an Icon\",\n        required: true,\n        disabled: false,\n        description: \"Choose an icon for your button\",\n        note: \"Note: The selected icon will be displayed on your button\",\n        icons: [\n            { prefix: \"fas\", name: \"trash-restore-alt\" },\n            { prefix: \"fas\", name: \"file-pen\" },\n            { prefix: \"fas\", name: \"receipt\" },\n            { prefix: \"fas\", name: \"user-circle\" },\n            { prefix: \"fas\", name: \"circle-user\" }\n        ],\n        value: null,\n        validation: undefined\n    },\n    argTypes: {\n        label: {\n            description: \"Label text for the icon picker\",\n            control: \"text\"\n        },\n        required: {\n            description: \"Makes the field required when set to true\",\n            control: \"boolean\"\n        },\n        disabled: {\n            description: \"Disables the icon picker when set to true\",\n            control: \"boolean\"\n        },\n        description: {\n            description: \"Additional description text below the field\",\n            control: \"text\"\n        },\n        note: {\n            description: \"Additional note text below the field\",\n            control: \"text\"\n        },\n        icons: {\n            description: \"Array of available icons with prefix and name properties\",\n            control: \"object\"\n        },\n        value: {\n            description: \"The selected icon value (in format 'prefix/name')\",\n            control: \"none\"\n        },\n        validation: {\n            description:\n                \"Object containing validation state and message. Please refer to the example code for details on usage.\",\n            control: \"none\"\n        },\n        onChange: {\n            description: \"Function called when an icon is selected\",\n            control: \"none\"\n        }\n    }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useState","useEffect","library","fas","IconPicker","meta","title","component","argTypes","onChange","action","disabled","control","defaultValue","parameters","layout","render","args","value","setValue","createElement","Object","assign","add","Default","icons","prefix","name","WithLabel","label","WithLabelRequired","required","WithDescription","description","WithNotes","note","WithErrors","validation","isValid","message","Disabled","FullExample","Documentation","setValidation","handleChange","newValue","undefined"],"sources":["IconPicker.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { library } from \"@fortawesome/fontawesome-svg-core\";\nimport { fas } from \"@fortawesome/free-solid-svg-icons\";\nimport { IconPicker } from \"~/IconPicker/index.js\";\n\nconst meta: Meta<typeof IconPicker> = {\n    title: \"Components/Form/IconPicker\",\n    component: IconPicker,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <IconPicker {...args} value={value} onChange={setValue} />;\n    }\n};\n\n// @ts-expect-error\nlibrary.add(fas);\n\nexport default meta;\ntype Story = StoryObj<typeof IconPicker>;\n\nexport const Default: Story = {\n    args: {\n        icons: [\n            { prefix: \"fas\", name: \"trash-restore-alt\" },\n            { prefix: \"fas\", name: \"trash-can-arrow-up\" },\n            { prefix: \"fas\", name: \"naira-sign\" },\n            { prefix: \"fas\", name: \"cart-arrow-down\" },\n            { prefix: \"fas\", name: \"walkie-talkie\" },\n            { prefix: \"fas\", name: \"file-edit\" },\n            { prefix: \"fas\", name: \"file-pen\" },\n            { prefix: \"fas\", name: \"receipt\" },\n            { prefix: \"fas\", name: \"pen-square\" },\n            { prefix: \"fas\", name: \"pencil-square\" },\n            { prefix: \"fas\", name: \"square-pen\" },\n            { prefix: \"fas\", name: \"suitcase-rolling\" },\n            { prefix: \"fas\", name: \"person-circle-exclamation\" },\n            { prefix: \"fas\", name: \"chevron-down\" },\n            { prefix: \"fas\", name: \"battery\" },\n            { prefix: \"fas\", name: \"battery-5\" },\n            { prefix: \"fas\", name: \"battery-full\" },\n            { prefix: \"fas\", name: \"skull-crossbones\" },\n            { prefix: \"fas\", name: \"code-compare\" },\n            { prefix: \"fas\", name: \"list-dots\" },\n            { prefix: \"fas\", name: \"list-ul\" },\n            { prefix: \"fas\", name: \"school-lock\" },\n            { prefix: \"fas\", name: \"tower-cell\" },\n            { prefix: \"fas\", name: \"long-arrow-alt-down\" },\n            { prefix: \"fas\", name: \"down-long\" },\n            { prefix: \"fas\", name: \"ranking-star\" },\n            { prefix: \"fas\", name: \"chess-king\" },\n            { prefix: \"fas\", name: \"person-harassing\" },\n            { prefix: \"fas\", name: \"brazilian-real-sign\" },\n            { prefix: \"fas\", name: \"landmark-alt\" },\n            { prefix: \"fas\", name: \"landmark-dome\" },\n            { prefix: \"fas\", name: \"arrow-up\" },\n            { prefix: \"fas\", name: \"television\" },\n            { prefix: \"fas\", name: \"tv-alt\" },\n            { prefix: \"fas\", name: \"tv\" },\n            { prefix: \"fas\", name: \"shrimp\" },\n            { prefix: \"fas\", name: \"tasks\" },\n            { prefix: \"fas\", name: \"list-check\" },\n            { prefix: \"fas\", name: \"jug-detergent\" },\n            { prefix: \"fas\", name: \"user-circle\" },\n            { prefix: \"fas\", name: \"circle-user\" },\n            { prefix: \"fas\", name: \"user-shield\" },\n            { prefix: \"fas\", name: \"wind\" },\n            { prefix: \"fas\", name: \"car-crash\" },\n            { prefix: \"fas\", name: \"car-burst\" },\n            { prefix: \"fas\", name: \"y\" },\n            { prefix: \"fas\", name: \"snowboarding\" },\n            { prefix: \"fas\", name: \"person-snowboarding\" },\n            { prefix: \"fas\", name: \"shipping-fast\" },\n            { prefix: \"fas\", name: \"truck-fast\" }\n        ]\n    }\n};\n\nexport const WithLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\"\n    }\n};\n\nexport const WithLabelRequired: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: \"Provide the required information for processing your request.\"\n    }\n};\n\nexport const WithNotes: Story = {\n    args: {\n        ...Default.args,\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\"\n    }\n};\n\nexport const WithErrors: Story = {\n    args: {\n        ...Default.args,\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true,\n        description: \"Provide the required information for processing your request.\",\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Documentation: Story = {\n    render: args => {\n        const [value, setValue] = useState(args.value || null);\n        const [validation, setValidation] = useState({ isValid: true, message: \"\" });\n\n        // Update value when args.value changes\n        useEffect(() => {\n            setValue(args.value || null);\n        }, [args.value]);\n\n        const handleChange = (newValue: any) => {\n            setValue(newValue);\n\n            // Simple required validation\n            if (args.required && !newValue) {\n                setValidation({ isValid: false, message: \"Please select an icon\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        };\n\n        // Validate on required change or value change\n        useEffect(() => {\n            if (args.required && !value) {\n                setValidation({ isValid: false, message: \"Please select an icon\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        }, [args.required, value]);\n\n        return (\n            <IconPicker\n                {...args}\n                value={value}\n                onChange={handleChange}\n                validation={validation}\n                required={args.required}\n            />\n        );\n    },\n    args: {\n        label: \"Select an Icon\",\n        required: true,\n        disabled: false,\n        description: \"Choose an icon for your button\",\n        note: \"Note: The selected icon will be displayed on your button\",\n        icons: [\n            { prefix: \"fas\", name: \"trash-restore-alt\" },\n            { prefix: \"fas\", name: \"file-pen\" },\n            { prefix: \"fas\", name: \"receipt\" },\n            { prefix: \"fas\", name: \"user-circle\" },\n            { prefix: \"fas\", name: \"circle-user\" }\n        ],\n        value: null,\n        validation: undefined\n    },\n    argTypes: {\n        label: {\n            description: \"Label text for the icon picker\",\n            control: \"text\"\n        },\n        required: {\n            description: \"Makes the field required when set to true\",\n            control: \"boolean\"\n        },\n        disabled: {\n            description: \"Disables the icon picker when set to true\",\n            control: \"boolean\"\n        },\n        description: {\n            description: \"Additional description text below the field\",\n            control: \"text\"\n        },\n        note: {\n            description: \"Additional note text below the field\",\n            control: \"text\"\n        },\n        icons: {\n            description: \"Array of available icons with prefix and name properties\",\n            control: \"object\"\n        },\n        value: {\n            description: \"The selected icon value (in format 'prefix/name')\"\n        },\n        validation: {\n            description:\n                \"Object containing validation state and message. Please refer to the example code for details on usage.\"\n        },\n        onChange: {\n            description: \"Function called when an icon is selected\"\n        }\n    }\n};\n"],"mappings":"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","ignoreList":[]}

package/IconPicker/domains/IconPickerIcon.d.ts

@@ -1,4 +1,4 @@
-import type { IconPickerIconDto } from "./IconPickerIconDto";
+import type { IconPickerIconDto } from "./IconPickerIconDto.js";
 export declare class IconPickerIcon {
     private readonly _prefix;
     private readonly _name;

package/IconPicker/domains/IconPickerIcon.js.map

@@ -1 +1 @@
-{"version":3,"names":["IconPickerIcon","constructor","data","_prefix","prefix","_name","name","create","createFromString","value","includes","values","split"],"sources":["IconPickerIcon.tsx"],"sourcesContent":["import type { IconPickerIconDto } from \"./IconPickerIconDto\";\n\nexport class IconPickerIcon {\n    private readonly _prefix: string;\n    private readonly _name: string;\n\n    protected constructor(data: { prefix: string; name: string }) {\n        this._prefix = data.prefix;\n        this._name = data.name;\n    }\n\n    static create(data: IconPickerIconDto) {\n        return new IconPickerIcon({\n            prefix: data.prefix,\n            name: data.name\n        });\n    }\n\n    static createFromString(value?: string) {\n        if (typeof value === \"string\" && value.includes(\"/\")) {\n            const values = value.split(\"/\");\n            return new IconPickerIcon({\n                prefix: values[0],\n                name: values[1]\n            });\n        } else {\n            return new IconPickerIcon({\n                prefix: \"fas\",\n                name: \"star\"\n            });\n        }\n    }\n\n    get prefix() {\n        return this._prefix;\n    }\n\n    get name() {\n        return this._name;\n    }\n}\n"],"mappings":"AAEA,OAAO,MAAMA,cAAc,CAAC;EAIdC,WAAWA,CAACC,IAAsC,EAAE;IAC1D,IAAI,CAACC,OAAO,GAAGD,IAAI,CAACE,MAAM;IAC1B,IAAI,CAACC,KAAK,GAAGH,IAAI,CAACI,IAAI;EAC1B;EAEA,OAAOC,MAAMA,CAACL,IAAuB,EAAE;IACnC,OAAO,IAAIF,cAAc,CAAC;MACtBI,MAAM,EAAEF,IAAI,CAACE,MAAM;MACnBE,IAAI,EAAEJ,IAAI,CAACI;IACf,CAAC,CAAC;EACN;EAEA,OAAOE,gBAAgBA,CAACC,KAAc,EAAE;IACpC,IAAI,OAAOA,KAAK,KAAK,QAAQ,IAAIA,KAAK,CAACC,QAAQ,CAAC,GAAG,CAAC,EAAE;MAClD,MAAMC,MAAM,GAAGF,KAAK,CAACG,KAAK,CAAC,GAAG,CAAC;MAC/B,OAAO,IAAIZ,cAAc,CAAC;QACtBI,MAAM,EAAEO,MAAM,CAAC,CAAC,CAAC;QACjBL,IAAI,EAAEK,MAAM,CAAC,CAAC;MAClB,CAAC,CAAC;IACN,CAAC,MAAM;MACH,OAAO,IAAIX,cAAc,CAAC;QACtBI,MAAM,EAAE,KAAK;QACbE,IAAI,EAAE;MACV,CAAC,CAAC;IACN;EACJ;EAEA,IAAIF,MAAMA,CAAA,EAAG;IACT,OAAO,IAAI,CAACD,OAAO;EACvB;EAEA,IAAIG,IAAIA,CAAA,EAAG;IACP,OAAO,IAAI,CAACD,KAAK;EACrB;AACJ","ignoreList":[]}
+{"version":3,"names":["IconPickerIcon","constructor","data","_prefix","prefix","_name","name","create","createFromString","value","includes","values","split"],"sources":["IconPickerIcon.tsx"],"sourcesContent":["import type { IconPickerIconDto } from \"./IconPickerIconDto.js\";\n\nexport class IconPickerIcon {\n    private readonly _prefix: string;\n    private readonly _name: string;\n\n    protected constructor(data: { prefix: string; name: string }) {\n        this._prefix = data.prefix;\n        this._name = data.name;\n    }\n\n    static create(data: IconPickerIconDto) {\n        return new IconPickerIcon({\n            prefix: data.prefix,\n            name: data.name\n        });\n    }\n\n    static createFromString(value?: string) {\n        if (typeof value === \"string\" && value.includes(\"/\")) {\n            const values = value.split(\"/\");\n            return new IconPickerIcon({\n                prefix: values[0],\n                name: values[1]\n            });\n        } else {\n            return new IconPickerIcon({\n                prefix: \"fas\",\n                name: \"star\"\n            });\n        }\n    }\n\n    get prefix() {\n        return this._prefix;\n    }\n\n    get name() {\n        return this._name;\n    }\n}\n"],"mappings":"AAEA,OAAO,MAAMA,cAAc,CAAC;EAIdC,WAAWA,CAACC,IAAsC,EAAE;IAC1D,IAAI,CAACC,OAAO,GAAGD,IAAI,CAACE,MAAM;IAC1B,IAAI,CAACC,KAAK,GAAGH,IAAI,CAACI,IAAI;EAC1B;EAEA,OAAOC,MAAMA,CAACL,IAAuB,EAAE;IACnC,OAAO,IAAIF,cAAc,CAAC;MACtBI,MAAM,EAAEF,IAAI,CAACE,MAAM;MACnBE,IAAI,EAAEJ,IAAI,CAACI;IACf,CAAC,CAAC;EACN;EAEA,OAAOE,gBAAgBA,CAACC,KAAc,EAAE;IACpC,IAAI,OAAOA,KAAK,KAAK,QAAQ,IAAIA,KAAK,CAACC,QAAQ,CAAC,GAAG,CAAC,EAAE;MAClD,MAAMC,MAAM,GAAGF,KAAK,CAACG,KAAK,CAAC,GAAG,CAAC;MAC/B,OAAO,IAAIZ,cAAc,CAAC;QACtBI,MAAM,EAAEO,MAAM,CAAC,CAAC,CAAC;QACjBL,IAAI,EAAEK,MAAM,CAAC,CAAC;MAClB,CAAC,CAAC;IACN,CAAC,MAAM;MACH,OAAO,IAAIX,cAAc,CAAC;QACtBI,MAAM,EAAE,KAAK;QACbE,IAAI,EAAE;MACV,CAAC,CAAC;IACN;EACJ;EAEA,IAAIF,MAAMA,CAAA,EAAG;IACT,OAAO,IAAI,CAACD,OAAO;EACvB;EAEA,IAAIG,IAAIA,CAAA,EAAG;IACP,OAAO,IAAI,CAACD,KAAK;EACrB;AACJ","ignoreList":[]}

package/IconPicker/domains/IconPickerIconFormatter.d.ts

@@ -1,5 +1,5 @@
-import type { IconPickerIcon } from "./IconPickerIcon";
-import type { IconPickerFontAwesome } from "./IconPickerFontAwesome";
+import type { IconPickerIcon } from "./IconPickerIcon.js";
+import type { IconPickerFontAwesome } from "./IconPickerFontAwesome.js";
 export declare class IconPickerIconFormatter {
     static formatFontAwesome(icon: IconPickerIcon): IconPickerFontAwesome;
     static formatStringValue(icon: IconPickerIcon | IconPickerFontAwesome): string;

package/IconPicker/domains/IconPickerIconFormatter.js.map

@@ -1 +1 @@
-{"version":3,"names":["IconPickerIconFormatter","formatFontAwesome","icon","prefix","name","formatStringValue"],"sources":["IconPickerIconFormatter.tsx"],"sourcesContent":["import type { IconPickerIcon } from \"./IconPickerIcon\";\nimport type { IconName, IconPrefix } from \"@fortawesome/fontawesome-svg-core\";\nimport type { IconPickerFontAwesome } from \"./IconPickerFontAwesome\";\n\nexport class IconPickerIconFormatter {\n    static formatFontAwesome(icon: IconPickerIcon): IconPickerFontAwesome {\n        return {\n            prefix: icon.prefix as IconPrefix,\n            name: icon.name as IconName\n        };\n    }\n\n    static formatStringValue(icon: IconPickerIcon | IconPickerFontAwesome) {\n        return `${icon.prefix}/${icon.name}`;\n    }\n}\n"],"mappings":"AAIA,OAAO,MAAMA,uBAAuB,CAAC;EACjC,OAAOC,iBAAiBA,CAACC,IAAoB,EAAyB;IAClE,OAAO;MACHC,MAAM,EAAED,IAAI,CAACC,MAAoB;MACjCC,IAAI,EAAEF,IAAI,CAACE;IACf,CAAC;EACL;EAEA,OAAOC,iBAAiBA,CAACH,IAA4C,EAAE;IACnE,OAAO,GAAGA,IAAI,CAACC,MAAM,IAAID,IAAI,CAACE,IAAI,EAAE;EACxC;AACJ","ignoreList":[]}
+{"version":3,"names":["IconPickerIconFormatter","formatFontAwesome","icon","prefix","name","formatStringValue"],"sources":["IconPickerIconFormatter.tsx"],"sourcesContent":["import type { IconPickerIcon } from \"./IconPickerIcon.js\";\nimport type { IconName, IconPrefix } from \"@fortawesome/fontawesome-svg-core\";\nimport type { IconPickerFontAwesome } from \"./IconPickerFontAwesome.js\";\n\nexport class IconPickerIconFormatter {\n    static formatFontAwesome(icon: IconPickerIcon): IconPickerFontAwesome {\n        return {\n            prefix: icon.prefix as IconPrefix,\n            name: icon.name as IconName\n        };\n    }\n\n    static formatStringValue(icon: IconPickerIcon | IconPickerFontAwesome) {\n        return `${icon.prefix}/${icon.name}`;\n    }\n}\n"],"mappings":"AAIA,OAAO,MAAMA,uBAAuB,CAAC;EACjC,OAAOC,iBAAiBA,CAACC,IAAoB,EAAyB;IAClE,OAAO;MACHC,MAAM,EAAED,IAAI,CAACC,MAAoB;MACjCC,IAAI,EAAEF,IAAI,CAACE;IACf,CAAC;EACL;EAEA,OAAOC,iBAAiBA,CAACH,IAA4C,EAAE;IACnE,OAAO,GAAGA,IAAI,CAACC,MAAM,IAAID,IAAI,CAACE,IAAI,EAAE;EACxC;AACJ","ignoreList":[]}

package/IconPicker/domains/index.d.ts

@@ -1,5 +1,5 @@
-export * from "./IconPickerIcon";
-export * from "./IconPickerIconDto";
-export * from "./IconPickerFontAwesome";
-export * from "./IconPickerIconFormatter";
-export * from "./ListCache";
+export * from "./IconPickerIcon.js";
+export type * from "./IconPickerIconDto.js";
+export type * from "./IconPickerFontAwesome.js";
+export * from "./IconPickerIconFormatter.js";
+export * from "./ListCache.js";

package/IconPicker/domains/index.js

@@ -1,7 +1,5 @@
-export * from "./IconPickerIcon";
-export * from "./IconPickerIconDto";
-export * from "./IconPickerFontAwesome";
-export * from "./IconPickerIconFormatter";
-export * from "./ListCache";
+export * from "./IconPickerIcon.js";
+export * from "./IconPickerIconFormatter.js";
+export * from "./ListCache.js";
 
 //# sourceMappingURL=index.js.map

package/IconPicker/domains/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./IconPickerIcon\";\nexport * from \"./IconPickerIconDto\";\nexport * from \"./IconPickerFontAwesome\";\nexport * from \"./IconPickerIconFormatter\";\nexport * from \"./ListCache\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./IconPickerIcon.js\";\nexport type * from \"./IconPickerIconDto.js\";\nexport type * from \"./IconPickerFontAwesome.js\";\nexport * from \"./IconPickerIconFormatter.js\";\nexport * from \"./ListCache.js\";\n"],"mappings":"AAAA;AAGA;AACA","ignoreList":[]}

package/IconPicker/index.d.ts

@@ -1,2 +1,2 @@
-export * from "./IconPicker";
-export type { IconPickerIconDto } from "./domains";
+export * from "./IconPicker.js";
+export type { IconPickerIconDto } from "./domains/index.js";

package/IconPicker/index.js

@@ -1,4 +1,4 @@
-export * from "./IconPicker";
+export * from "./IconPicker.js";
 export {};
 
 //# sourceMappingURL=index.js.map

package/IconPicker/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./IconPicker\";\nexport type { IconPickerIconDto } from \"./domains\";\n"],"mappings":"AAAA;AAA6B","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./IconPicker.js\";\nexport type { IconPickerIconDto } from \"./domains/index.js\";\n"],"mappings":"AAAA;AAAgC","ignoreList":[]}

package/IconPicker/primitives/IconPickerPrimitive.d.ts

@@ -1,11 +1,11 @@
 import React from "react";
-import type { InputPrimitiveProps } from "../../Input";
-import { type VariantProps } from "../../utils";
-import type { IconPickerIconDto } from "../domains";
+import type { InputPrimitiveProps } from "../../Input/index.js";
+import { type VariantProps } from "../../utils.js";
+import type { IconPickerIconDto } from "../domains/index.js";
 declare const iconPickerVariants: (props?: ({
     size?: "md" | "lg" | "xl" | null | undefined;
     disabled?: boolean | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+} & import("class-variance-authority/dist/types.js").ClassProp) | undefined) => string;
 interface IconPickerPrimitiveProps extends VariantProps<typeof iconPickerVariants> {
     /**
      * Indicates if the field is disabled.

package/IconPicker/primitives/IconPickerPrimitive.js

@@ -1,18 +1,18 @@
 import React, { useEffect, useRef } from "react";
-import { inputVariants } from "../../Input";
-import { PopoverPrimitive } from "../../Popover";
-import { cn, cva } from "../../utils";
-import { IconPickerGrid, IconPickerInput, IconPickerTrigger } from "./components";
-import { useIconPicker } from "./useIconPicker";
-const iconPickerVariants = cva("wby-cursor-pointer wby-text-neutral-strong", {
+import { inputVariants } from "../../Input/index.js";
+import { PopoverPrimitive } from "../../Popover/index.js";
+import { cn, cva } from "../../utils.js";
+import { IconPickerGrid, IconPickerInput, IconPickerTrigger } from "./components/index.js";
+import { useIconPicker } from "./useIconPicker.js";
+const iconPickerVariants = cva("cursor-pointer text-neutral-strong", {
   variants: {
     size: {
-      md: "wby-w-16",
-      lg: "wby-w-16",
-      xl: "wby-w-20"
+      md: "w-16",
+      lg: "w-16",
+      xl: "w-20"
     },
     disabled: {
-      true: "wby-pointer-events-none"
+      true: "pointer-events-none"
     }
   },
   defaultVariants: {
@@ -54,7 +54,7 @@ const IconPickerPrimitive = props => {
     size: props.size
   }))), /*#__PURE__*/React.createElement(PopoverPrimitive.Content, {
     align: "start",
-    className: "wby-min-w-96",
+    className: "min-w-96",
     onWheel: e => e.stopPropagation() // Wheel event should not propagate to the parent: this fixes scrolling issues when the IconPicker is placed inside a Dialog.
   }, /*#__PURE__*/React.createElement(IconPickerInput, {
     value: vm.searchQuery,

package/IconPicker/primitives/IconPickerPrimitive.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useRef","inputVariants","PopoverPrimitive","cn","cva","IconPickerGrid","IconPickerInput","IconPickerTrigger","useIconPicker","iconPickerVariants","variants","size","md","lg","xl","disabled","true","defaultVariants","IconPickerPrimitive","props","vm","setListOpenState","searchIcon","setSelectedIcon","inputRef","setTimeout","open","current","focus","createElement","onOpenChange","Trigger","asChild","className","variant","invalid","value","Content","align","onWheel","e","stopPropagation","searchQuery","onChange","icons","iconsLength","onIconSelect"],"sources":["IconPickerPrimitive.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\nimport type { InputPrimitiveProps } from \"~/Input\";\nimport { inputVariants } from \"~/Input\";\nimport { PopoverPrimitive } from \"~/Popover\";\nimport { cn, cva, type VariantProps } from \"~/utils\";\nimport { IconPickerGrid, IconPickerInput, IconPickerTrigger } from \"./components\";\nimport type { IconPickerIconDto } from \"../domains\";\nimport { useIconPicker } from \"./useIconPicker\";\n\nconst iconPickerVariants = cva(\"wby-cursor-pointer wby-text-neutral-strong\", {\n    variants: {\n        size: {\n            md: \"wby-w-16\",\n            lg: \"wby-w-16\",\n            xl: \"wby-w-20\"\n        },\n        disabled: {\n            true: \"wby-pointer-events-none\"\n        }\n    },\n    defaultVariants: {\n        size: \"lg\"\n    }\n});\n\ninterface IconPickerPrimitiveProps extends VariantProps<typeof iconPickerVariants> {\n    /**\n     * Indicates if the field is disabled.\n     */\n    disabled?: boolean;\n    /**\n     * Callback triggered when the value changes.\n     */\n    onChange?: (value: string) => void;\n    /**\n     * List of icons to be displayed in the icon picker.\n     */\n    icons: IconPickerIconDto[];\n    /**\n     * Indicates if the input field is invalid.\n     * Refer to `InputPrimitiveProps[\"invalid\"]` for possible values.\n     */\n    invalid?: InputPrimitiveProps[\"invalid\"];\n    /**\n     * Optional selected icon.\n     */\n    value?: string;\n    /**\n     * Variant of the input field.\n     * Refer to `InputPrimitiveProps[\"variant\"]` for possible values.\n     */\n    variant?: InputPrimitiveProps[\"variant\"];\n}\n\nconst IconPickerPrimitive = (props: IconPickerPrimitiveProps) => {\n    const { vm, setListOpenState, searchIcon, setSelectedIcon } = useIconPicker(props);\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    useEffect(() => {\n        setTimeout(() => {\n            if (vm.open && inputRef.current) {\n                inputRef.current.focus();\n            }\n        }, 50);\n    }, [vm.open]);\n\n    return (\n        <PopoverPrimitive open={vm.open} onOpenChange={setListOpenState}>\n            <PopoverPrimitive.Trigger asChild>\n                <button\n                    data-disabled={props.disabled}\n                    className={cn(\n                        inputVariants({\n                            size: props.size,\n                            variant: props.variant,\n                            invalid: props.invalid\n                        }),\n                        iconPickerVariants({ size: props.size, disabled: props.disabled })\n                    )}\n                >\n                    <IconPickerTrigger value={props.value} size={props.size} />\n                </button>\n            </PopoverPrimitive.Trigger>\n            <PopoverPrimitive.Content\n                align={\"start\"}\n                className={\"wby-min-w-96\"}\n                onWheel={e => e.stopPropagation()} // Wheel event should not propagate to the parent: this fixes scrolling issues when the IconPicker is placed inside a Dialog.\n            >\n                <IconPickerInput value={vm.searchQuery} onChange={searchIcon} inputRef={inputRef} />\n                <IconPickerGrid\n                    icons={vm.icons}\n                    iconsLength={vm.iconsLength}\n                    onIconSelect={setSelectedIcon}\n                />\n            </PopoverPrimitive.Content>\n        </PopoverPrimitive>\n    );\n};\n\nexport { IconPickerPrimitive, type IconPickerPrimitiveProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAEhD,SAASC,aAAa;AACtB,SAASC,gBAAgB;AACzB,SAASC,EAAE,EAAEC,GAAG;AAChB,SAASC,cAAc,EAAEC,eAAe,EAAEC,iBAAiB;AAE3D,SAASC,aAAa;AAEtB,MAAMC,kBAAkB,GAAGL,GAAG,CAAC,4CAA4C,EAAE;EACzEM,QAAQ,EAAE;IACNC,IAAI,EAAE;MACFC,EAAE,EAAE,UAAU;MACdC,EAAE,EAAE,UAAU;MACdC,EAAE,EAAE;IACR,CAAC;IACDC,QAAQ,EAAE;MACNC,IAAI,EAAE;IACV;EACJ,CAAC;EACDC,eAAe,EAAE;IACbN,IAAI,EAAE;EACV;AACJ,CAAC,CAAC;AA+BF,MAAMO,mBAAmB,GAAIC,KAA+B,IAAK;EAC7D,MAAM;IAAEC,EAAE;IAAEC,gBAAgB;IAAEC,UAAU;IAAEC;EAAgB,CAAC,GAAGf,aAAa,CAACW,KAAK,CAAC;EAClF,MAAMK,QAAQ,GAAGxB,MAAM,CAAmB,IAAI,CAAC;EAE/CD,SAAS,CAAC,MAAM;IACZ0B,UAAU,CAAC,MAAM;MACb,IAAIL,EAAE,CAACM,IAAI,IAAIF,QAAQ,CAACG,OAAO,EAAE;QAC7BH,QAAQ,CAACG,OAAO,CAACC,KAAK,CAAC,CAAC;MAC5B;IACJ,CAAC,EAAE,EAAE,CAAC;EACV,CAAC,EAAE,CAACR,EAAE,CAACM,IAAI,CAAC,CAAC;EAEb,oBACI5B,KAAA,CAAA+B,aAAA,CAAC3B,gBAAgB;IAACwB,IAAI,EAAEN,EAAE,CAACM,IAAK;IAACI,YAAY,EAAET;EAAiB,gBAC5DvB,KAAA,CAAA+B,aAAA,CAAC3B,gBAAgB,CAAC6B,OAAO;IAACC,OAAO;EAAA,gBAC7BlC,KAAA,CAAA+B,aAAA;IACI,iBAAeV,KAAK,CAACJ,QAAS;IAC9BkB,SAAS,EAAE9B,EAAE,CACTF,aAAa,CAAC;MACVU,IAAI,EAAEQ,KAAK,CAACR,IAAI;MAChBuB,OAAO,EAAEf,KAAK,CAACe,OAAO;MACtBC,OAAO,EAAEhB,KAAK,CAACgB;IACnB,CAAC,CAAC,EACF1B,kBAAkB,CAAC;MAAEE,IAAI,EAAEQ,KAAK,CAACR,IAAI;MAAEI,QAAQ,EAAEI,KAAK,CAACJ;IAAS,CAAC,CACrE;EAAE,gBAEFjB,KAAA,CAAA+B,aAAA,CAACtB,iBAAiB;IAAC6B,KAAK,EAAEjB,KAAK,CAACiB,KAAM;IAACzB,IAAI,EAAEQ,KAAK,CAACR;EAAK,CAAE,CACtD,CACc,CAAC,eAC3Bb,KAAA,CAAA+B,aAAA,CAAC3B,gBAAgB,CAACmC,OAAO;IACrBC,KAAK,EAAE,OAAQ;IACfL,SAAS,EAAE,cAAe;IAC1BM,OAAO,EAAEC,CAAC,IAAIA,CAAC,CAACC,eAAe,CAAC,CAAE,CAAC;EAAA,gBAEnC3C,KAAA,CAAA+B,aAAA,CAACvB,eAAe;IAAC8B,KAAK,EAAEhB,EAAE,CAACsB,WAAY;IAACC,QAAQ,EAAErB,UAAW;IAACE,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACpF1B,KAAA,CAAA+B,aAAA,CAACxB,cAAc;IACXuC,KAAK,EAAExB,EAAE,CAACwB,KAAM;IAChBC,WAAW,EAAEzB,EAAE,CAACyB,WAAY;IAC5BC,YAAY,EAAEvB;EAAgB,CACjC,CACqB,CACZ,CAAC;AAE3B,CAAC;AAED,SAASL,mBAAmB","ignoreList":[]}
+{"version":3,"names":["React","useEffect","useRef","inputVariants","PopoverPrimitive","cn","cva","IconPickerGrid","IconPickerInput","IconPickerTrigger","useIconPicker","iconPickerVariants","variants","size","md","lg","xl","disabled","true","defaultVariants","IconPickerPrimitive","props","vm","setListOpenState","searchIcon","setSelectedIcon","inputRef","setTimeout","open","current","focus","createElement","onOpenChange","Trigger","asChild","className","variant","invalid","value","Content","align","onWheel","e","stopPropagation","searchQuery","onChange","icons","iconsLength","onIconSelect"],"sources":["IconPickerPrimitive.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\nimport type { InputPrimitiveProps } from \"~/Input/index.js\";\nimport { inputVariants } from \"~/Input/index.js\";\nimport { PopoverPrimitive } from \"~/Popover/index.js\";\nimport { cn, cva, type VariantProps } from \"~/utils.js\";\nimport { IconPickerGrid, IconPickerInput, IconPickerTrigger } from \"./components/index.js\";\nimport type { IconPickerIconDto } from \"../domains/index.js\";\nimport { useIconPicker } from \"./useIconPicker.js\";\n\nconst iconPickerVariants = cva(\"cursor-pointer text-neutral-strong\", {\n    variants: {\n        size: {\n            md: \"w-16\",\n            lg: \"w-16\",\n            xl: \"w-20\"\n        },\n        disabled: {\n            true: \"pointer-events-none\"\n        }\n    },\n    defaultVariants: {\n        size: \"lg\"\n    }\n});\n\ninterface IconPickerPrimitiveProps extends VariantProps<typeof iconPickerVariants> {\n    /**\n     * Indicates if the field is disabled.\n     */\n    disabled?: boolean;\n    /**\n     * Callback triggered when the value changes.\n     */\n    onChange?: (value: string) => void;\n    /**\n     * List of icons to be displayed in the icon picker.\n     */\n    icons: IconPickerIconDto[];\n    /**\n     * Indicates if the input field is invalid.\n     * Refer to `InputPrimitiveProps[\"invalid\"]` for possible values.\n     */\n    invalid?: InputPrimitiveProps[\"invalid\"];\n    /**\n     * Optional selected icon.\n     */\n    value?: string;\n    /**\n     * Variant of the input field.\n     * Refer to `InputPrimitiveProps[\"variant\"]` for possible values.\n     */\n    variant?: InputPrimitiveProps[\"variant\"];\n}\n\nconst IconPickerPrimitive = (props: IconPickerPrimitiveProps) => {\n    const { vm, setListOpenState, searchIcon, setSelectedIcon } = useIconPicker(props);\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    useEffect(() => {\n        setTimeout(() => {\n            if (vm.open && inputRef.current) {\n                inputRef.current.focus();\n            }\n        }, 50);\n    }, [vm.open]);\n\n    return (\n        <PopoverPrimitive open={vm.open} onOpenChange={setListOpenState}>\n            <PopoverPrimitive.Trigger asChild>\n                <button\n                    data-disabled={props.disabled}\n                    className={cn(\n                        inputVariants({\n                            size: props.size,\n                            variant: props.variant,\n                            invalid: props.invalid\n                        }),\n                        iconPickerVariants({ size: props.size, disabled: props.disabled })\n                    )}\n                >\n                    <IconPickerTrigger value={props.value} size={props.size} />\n                </button>\n            </PopoverPrimitive.Trigger>\n            <PopoverPrimitive.Content\n                align={\"start\"}\n                className={\"min-w-96\"}\n                onWheel={e => e.stopPropagation()} // Wheel event should not propagate to the parent: this fixes scrolling issues when the IconPicker is placed inside a Dialog.\n            >\n                <IconPickerInput value={vm.searchQuery} onChange={searchIcon} inputRef={inputRef} />\n                <IconPickerGrid\n                    icons={vm.icons}\n                    iconsLength={vm.iconsLength}\n                    onIconSelect={setSelectedIcon}\n                />\n            </PopoverPrimitive.Content>\n        </PopoverPrimitive>\n    );\n};\n\nexport { IconPickerPrimitive, type IconPickerPrimitiveProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAEhD,SAASC,aAAa;AACtB,SAASC,gBAAgB;AACzB,SAASC,EAAE,EAAEC,GAAG;AAChB,SAASC,cAAc,EAAEC,eAAe,EAAEC,iBAAiB;AAE3D,SAASC,aAAa;AAEtB,MAAMC,kBAAkB,GAAGL,GAAG,CAAC,oCAAoC,EAAE;EACjEM,QAAQ,EAAE;IACNC,IAAI,EAAE;MACFC,EAAE,EAAE,MAAM;MACVC,EAAE,EAAE,MAAM;MACVC,EAAE,EAAE;IACR,CAAC;IACDC,QAAQ,EAAE;MACNC,IAAI,EAAE;IACV;EACJ,CAAC;EACDC,eAAe,EAAE;IACbN,IAAI,EAAE;EACV;AACJ,CAAC,CAAC;AA+BF,MAAMO,mBAAmB,GAAIC,KAA+B,IAAK;EAC7D,MAAM;IAAEC,EAAE;IAAEC,gBAAgB;IAAEC,UAAU;IAAEC;EAAgB,CAAC,GAAGf,aAAa,CAACW,KAAK,CAAC;EAClF,MAAMK,QAAQ,GAAGxB,MAAM,CAAmB,IAAI,CAAC;EAE/CD,SAAS,CAAC,MAAM;IACZ0B,UAAU,CAAC,MAAM;MACb,IAAIL,EAAE,CAACM,IAAI,IAAIF,QAAQ,CAACG,OAAO,EAAE;QAC7BH,QAAQ,CAACG,OAAO,CAACC,KAAK,CAAC,CAAC;MAC5B;IACJ,CAAC,EAAE,EAAE,CAAC;EACV,CAAC,EAAE,CAACR,EAAE,CAACM,IAAI,CAAC,CAAC;EAEb,oBACI5B,KAAA,CAAA+B,aAAA,CAAC3B,gBAAgB;IAACwB,IAAI,EAAEN,EAAE,CAACM,IAAK;IAACI,YAAY,EAAET;EAAiB,gBAC5DvB,KAAA,CAAA+B,aAAA,CAAC3B,gBAAgB,CAAC6B,OAAO;IAACC,OAAO;EAAA,gBAC7BlC,KAAA,CAAA+B,aAAA;IACI,iBAAeV,KAAK,CAACJ,QAAS;IAC9BkB,SAAS,EAAE9B,EAAE,CACTF,aAAa,CAAC;MACVU,IAAI,EAAEQ,KAAK,CAACR,IAAI;MAChBuB,OAAO,EAAEf,KAAK,CAACe,OAAO;MACtBC,OAAO,EAAEhB,KAAK,CAACgB;IACnB,CAAC,CAAC,EACF1B,kBAAkB,CAAC;MAAEE,IAAI,EAAEQ,KAAK,CAACR,IAAI;MAAEI,QAAQ,EAAEI,KAAK,CAACJ;IAAS,CAAC,CACrE;EAAE,gBAEFjB,KAAA,CAAA+B,aAAA,CAACtB,iBAAiB;IAAC6B,KAAK,EAAEjB,KAAK,CAACiB,KAAM;IAACzB,IAAI,EAAEQ,KAAK,CAACR;EAAK,CAAE,CACtD,CACc,CAAC,eAC3Bb,KAAA,CAAA+B,aAAA,CAAC3B,gBAAgB,CAACmC,OAAO;IACrBC,KAAK,EAAE,OAAQ;IACfL,SAAS,EAAE,UAAW;IACtBM,OAAO,EAAEC,CAAC,IAAIA,CAAC,CAACC,eAAe,CAAC,CAAE,CAAC;EAAA,gBAEnC3C,KAAA,CAAA+B,aAAA,CAACvB,eAAe;IAAC8B,KAAK,EAAEhB,EAAE,CAACsB,WAAY;IAACC,QAAQ,EAAErB,UAAW;IAACE,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACpF1B,KAAA,CAAA+B,aAAA,CAACxB,cAAc;IACXuC,KAAK,EAAExB,EAAE,CAACwB,KAAM;IAChBC,WAAW,EAAEzB,EAAE,CAACyB,WAAY;IAC5BC,YAAY,EAAEvB;EAAgB,CACjC,CACqB,CACZ,CAAC;AAE3B,CAAC;AAED,SAASL,mBAAmB","ignoreList":[]}

package/IconPicker/primitives/IconPickerPrimitive.stories.d.ts

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { IconPickerPrimitive } from "./IconPickerPrimitive";
+import type { Meta, StoryObj } from "@storybook/react-webpack5";
+import { IconPickerPrimitive } from "./IconPickerPrimitive.js";
 declare const meta: Meta<typeof IconPickerPrimitive>;
 export default meta;
 type Story = StoryObj<typeof IconPickerPrimitive>;

package/IconPicker/primitives/IconPickerPrimitive.stories.js

@@ -1,7 +1,7 @@
 import React, { useState } from "react";
 import { library } from "@fortawesome/fontawesome-svg-core";
 import { fas } from "@fortawesome/free-solid-svg-icons";
-import { IconPickerPrimitive } from "./IconPickerPrimitive";
+import { IconPickerPrimitive } from "./IconPickerPrimitive.js";
 const meta = {
   title: "Components/Form Primitives/IconPicker",
   component: IconPickerPrimitive,
@@ -13,12 +13,12 @@ const meta = {
   render: args => {
     const [value, setValue] = useState(args.value);
     return /*#__PURE__*/React.createElement("div", {
-      className: "wby-w-full"
+      className: "w-full"
     }, /*#__PURE__*/React.createElement(IconPickerPrimitive, Object.assign({}, args, {
       value: value,
       onChange: setValue
     })), /*#__PURE__*/React.createElement("div", {
-      className: "wby-mt-4 wby-text-center"
+      className: "mt-4 text-center"
     }, "Current selected value: ", /*#__PURE__*/React.createElement("pre", null, value)));
   },
   parameters: {