@webiny/admin-ui 0.0.0-unstable.e6f0dc8ca7 → 0.0.0-unstable.eb81deee7e

package/SegmentedControl/primitives/SegmentedControlPrimitive.stories.js

@@ -1,138 +1,164 @@
-import React, { useState } from "react";
+import react, { useState } from "react";
 import { SegmentedControlPrimitive } from "./SegmentedControlPrimitive.js";
 import { Icon } from "../../Icon/index.js";
-import { ReactComponent as LockIcon } from "@webiny/icons/notifications.svg";
+import { ReactComponent } from "@webiny/icons/notifications.svg";
 const meta = {
-  title: "Components/Form Primitives/SegmentedControl",
-  component: SegmentedControlPrimitive,
-  parameters: {
-    layout: "padded"
-  },
-  render: args => {
-    const [value, setValue] = useState(args.value);
-    return /*#__PURE__*/React.createElement("div", {
-      className: "w-full"
-    }, /*#__PURE__*/React.createElement(SegmentedControlPrimitive, Object.assign({}, args, {
-      value: value,
-      onChange: value => setValue(value)
-    })), /*#__PURE__*/React.createElement("div", {
-      className: "mt-4 text-center"
-    }, "Current selected value: ", /*#__PURE__*/React.createElement("pre", null, value)));
-  }
+    title: "Components/Form Primitives/SegmentedControl",
+    component: SegmentedControlPrimitive,
+    parameters: {
+        layout: "padded"
+    },
+    render: (args)=>{
+        const [value, setValue] = useState(args.value);
+        return /*#__PURE__*/ react.createElement("div", {
+            className: "w-full"
+        }, /*#__PURE__*/ react.createElement(SegmentedControlPrimitive, {
+            ...args,
+            value: value,
+            onChange: (value)=>setValue(value)
+        }), /*#__PURE__*/ react.createElement("div", {
+            className: "mt-4 text-center"
+        }, "Current selected value: ", /*#__PURE__*/ react.createElement("pre", null, value)));
+    }
 };
-export default meta;
-const items = [{
-  label: "Item 1",
-  value: "item1"
-}, {
-  label: "Item 2",
-  value: "item2"
-}, {
-  label: "Item 3",
-  value: "item3"
-}, {
-  label: "Item 4",
-  value: "item4"
-}];
-const itemsWithIcons = [{
-  label: "Item 1",
-  value: "item1",
-  icon: /*#__PURE__*/React.createElement(Icon, {
-    icon: /*#__PURE__*/React.createElement(LockIcon, null),
-    label: "Lock"
-  })
-}, {
-  label: "Item 2",
-  value: "item2",
-  icon: /*#__PURE__*/React.createElement(Icon, {
-    icon: /*#__PURE__*/React.createElement(LockIcon, null),
-    label: "Lock"
-  })
-}, {
-  label: "Item 3",
-  value: "item3",
-  icon: /*#__PURE__*/React.createElement(Icon, {
-    icon: /*#__PURE__*/React.createElement(LockIcon, null),
-    label: "Lock"
-  })
-}, {
-  label: "Item 4",
-  value: "item4",
-  icon: /*#__PURE__*/React.createElement(Icon, {
-    icon: /*#__PURE__*/React.createElement(LockIcon, null),
-    label: "Lock"
-  })
-}];
-export const Default = {
-  args: {
-    items
-  }
+const SegmentedControlPrimitive_stories = meta;
+const items = [
+    {
+        label: "Item 1",
+        value: "item1"
+    },
+    {
+        label: "Item 2",
+        value: "item2"
+    },
+    {
+        label: "Item 3",
+        value: "item3"
+    },
+    {
+        label: "Item 4",
+        value: "item4"
+    }
+];
+const itemsWithIcons = [
+    {
+        label: "Item 1",
+        value: "item1",
+        icon: /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            label: "Lock"
+        })
+    },
+    {
+        label: "Item 2",
+        value: "item2",
+        icon: /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            label: "Lock"
+        })
+    },
+    {
+        label: "Item 3",
+        value: "item3",
+        icon: /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            label: "Lock"
+        })
+    },
+    {
+        label: "Item 4",
+        value: "item4",
+        icon: /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            label: "Lock"
+        })
+    }
+];
+const Default = {
+    args: {
+        items: items
+    }
 };
-export const WithDefaultOption = {
-  args: {
-    items,
-    value: "item2"
-  }
+const WithDefaultOption = {
+    args: {
+        items: items,
+        value: "item2"
+    }
 };
-export const WithIcons = {
-  args: {
-    items: itemsWithIcons,
-    value: "item1"
-  }
+const WithIcons = {
+    args: {
+        items: itemsWithIcons,
+        value: "item1"
+    }
 };
-export const VariantLight = {
-  args: {
-    items,
-    value: "item1",
-    variant: "light"
-  }
+const VariantLight = {
+    args: {
+        items: items,
+        value: "item1",
+        variant: "light"
+    }
 };
-export const VariantDimmed = {
-  args: {
-    items,
-    value: "item1",
-    variant: "dimmed"
-  }
+const VariantDimmed = {
+    args: {
+        items: items,
+        value: "item1",
+        variant: "dimmed"
+    }
 };
-export const VariantGhost = {
-  render: args => {
-    const [value, setValue] = useState(args.value || "item1");
-    return /*#__PURE__*/React.createElement("div", {
-      className: "p-md rounded-md bg-neutral-light"
-    }, /*#__PURE__*/React.createElement(SegmentedControlPrimitive, Object.assign({}, args, {
-      items: items,
-      value: value,
-      onChange: value => setValue(value),
-      variant: "ghost"
-    })));
-  }
+const VariantGhost = {
+    render: (args)=>{
+        const [value, setValue] = useState(args.value || "item1");
+        return /*#__PURE__*/ react.createElement("div", {
+            className: "p-md rounded-md bg-neutral-light"
+        }, /*#__PURE__*/ react.createElement(SegmentedControlPrimitive, {
+            ...args,
+            items: items,
+            value: value,
+            onChange: (value)=>setValue(value),
+            variant: "ghost"
+        }));
+    }
 };
-export const Disabled = {
-  args: {
-    items,
-    value: "item2",
-    disabled: true
-  }
+const Disabled = {
+    args: {
+        items: items,
+        value: "item2",
+        disabled: true
+    }
 };
-export const PartiallyDisabled = {
-  args: {
-    items: [{
-      label: "Item 1",
-      value: "item1"
-    }, {
-      label: "Item 2 (disabled)",
-      value: "item2",
-      disabled: true
-    }, {
-      label: "Item 3",
-      value: "item3"
-    }, {
-      label: "Item 4 (disabled)",
-      value: "item4",
-      disabled: true
-    }],
-    value: "item1"
-  }
+const PartiallyDisabled = {
+    args: {
+        items: [
+            {
+                label: "Item 1",
+                value: "item1"
+            },
+            {
+                label: "Item 2 (disabled)",
+                value: "item2",
+                disabled: true
+            },
+            {
+                label: "Item 3",
+                value: "item3"
+            },
+            {
+                label: "Item 4 (disabled)",
+                value: "item4",
+                disabled: true
+            }
+        ],
+        value: "item1"
+    }
 };
+const FullWidth = {
+    args: {
+        items: items,
+        value: "item1",
+        fullWidth: true
+    }
+};
+export default SegmentedControlPrimitive_stories;
+export { Default, Disabled, FullWidth, PartiallyDisabled, VariantDimmed, VariantGhost, VariantLight, WithDefaultOption, WithIcons };
 
 //# sourceMappingURL=SegmentedControlPrimitive.stories.js.map

package/SegmentedControl/primitives/SegmentedControlPrimitive.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useState","SegmentedControlPrimitive","Icon","ReactComponent","LockIcon","meta","title","component","parameters","layout","render","args","value","setValue","createElement","className","Object","assign","onChange","items","label","itemsWithIcons","icon","Default","WithDefaultOption","WithIcons","VariantLight","variant","VariantDimmed","VariantGhost","Disabled","disabled","PartiallyDisabled"],"sources":["SegmentedControlPrimitive.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { SegmentedControlPrimitive } from \"./SegmentedControlPrimitive.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { ReactComponent as LockIcon } from \"@webiny/icons/notifications.svg\";\n\nconst meta: Meta<typeof SegmentedControlPrimitive> = {\n    title: \"Components/Form Primitives/SegmentedControl\",\n    component: SegmentedControlPrimitive,\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return (\n            <div className={\"w-full\"}>\n                <SegmentedControlPrimitive\n                    {...args}\n                    value={value}\n                    onChange={value => setValue(value)}\n                />\n                <div className={\"mt-4 text-center\"}>\n                    Current selected value: <pre>{value}</pre>\n                </div>\n            </div>\n        );\n    }\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof SegmentedControlPrimitive>;\n\nconst items = [\n    { label: \"Item 1\", value: \"item1\" },\n    { label: \"Item 2\", value: \"item2\" },\n    { label: \"Item 3\", value: \"item3\" },\n    { label: \"Item 4\", value: \"item4\" }\n];\n\nconst itemsWithIcons = [\n    { label: \"Item 1\", value: \"item1\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 2\", value: \"item2\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 3\", value: \"item3\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 4\", value: \"item4\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> }\n];\n\nexport const Default: Story = {\n    args: {\n        items\n    }\n};\n\nexport const WithDefaultOption: Story = {\n    args: {\n        items,\n        value: \"item2\"\n    }\n};\n\nexport const WithIcons: Story = {\n    args: {\n        items: itemsWithIcons,\n        value: \"item1\"\n    }\n};\n\nexport const VariantLight: Story = {\n    args: {\n        items,\n        value: \"item1\",\n        variant: \"light\"\n    }\n};\n\nexport const VariantDimmed: Story = {\n    args: {\n        items,\n        value: \"item1\",\n        variant: \"dimmed\"\n    }\n};\n\nexport const VariantGhost: Story = {\n    render: args => {\n        const [value, setValue] = useState(args.value || \"item1\");\n        return (\n            <div className=\"p-md rounded-md bg-neutral-light\">\n                <SegmentedControlPrimitive\n                    {...args}\n                    items={items}\n                    value={value}\n                    onChange={value => setValue(value)}\n                    variant=\"ghost\"\n                />\n            </div>\n        );\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        items,\n        value: \"item2\",\n        disabled: true\n    }\n};\n\nexport const PartiallyDisabled: Story = {\n    args: {\n        items: [\n            { label: \"Item 1\", value: \"item1\" },\n            { label: \"Item 2 (disabled)\", value: \"item2\", disabled: true },\n            { label: \"Item 3\", value: \"item3\" },\n            { label: \"Item 4 (disabled)\", value: \"item4\", disabled: true }\n        ],\n        value: \"item1\"\n    }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SegmentedControl/primitives/SegmentedControlPrimitive.stories.js","sources":["../../../src/SegmentedControl/primitives/SegmentedControlPrimitive.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { SegmentedControlPrimitive } from \"./SegmentedControlPrimitive.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { ReactComponent as LockIcon } from \"@webiny/icons/notifications.svg\";\n\nconst meta: Meta<typeof SegmentedControlPrimitive> = {\n    title: \"Components/Form Primitives/SegmentedControl\",\n    component: SegmentedControlPrimitive,\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return (\n            <div className={\"w-full\"}>\n                <SegmentedControlPrimitive\n                    {...args}\n                    value={value}\n                    onChange={value => setValue(value)}\n                />\n                <div className={\"mt-4 text-center\"}>\n                    Current selected value: <pre>{value}</pre>\n                </div>\n            </div>\n        );\n    }\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof SegmentedControlPrimitive>;\n\nconst items = [\n    { label: \"Item 1\", value: \"item1\" },\n    { label: \"Item 2\", value: \"item2\" },\n    { label: \"Item 3\", value: \"item3\" },\n    { label: \"Item 4\", value: \"item4\" }\n];\n\nconst itemsWithIcons = [\n    { label: \"Item 1\", value: \"item1\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 2\", value: \"item2\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 3\", value: \"item3\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 4\", value: \"item4\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> }\n];\n\nexport const Default: Story = {\n    args: {\n        items\n    }\n};\n\nexport const WithDefaultOption: Story = {\n    args: {\n        items,\n        value: \"item2\"\n    }\n};\n\nexport const WithIcons: Story = {\n    args: {\n        items: itemsWithIcons,\n        value: \"item1\"\n    }\n};\n\nexport const VariantLight: Story = {\n    args: {\n        items,\n        value: \"item1\",\n        variant: \"light\"\n    }\n};\n\nexport const VariantDimmed: Story = {\n    args: {\n        items,\n        value: \"item1\",\n        variant: \"dimmed\"\n    }\n};\n\nexport const VariantGhost: Story = {\n    render: args => {\n        const [value, setValue] = useState(args.value || \"item1\");\n        return (\n            <div className=\"p-md rounded-md bg-neutral-light\">\n                <SegmentedControlPrimitive\n                    {...args}\n                    items={items}\n                    value={value}\n                    onChange={value => setValue(value)}\n                    variant=\"ghost\"\n                />\n            </div>\n        );\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        items,\n        value: \"item2\",\n        disabled: true\n    }\n};\n\nexport const PartiallyDisabled: Story = {\n    args: {\n        items: [\n            { label: \"Item 1\", value: \"item1\" },\n            { label: \"Item 2 (disabled)\", value: \"item2\", disabled: true },\n            { label: \"Item 3\", value: \"item3\" },\n            { label: \"Item 4 (disabled)\", value: \"item4\", disabled: true }\n        ],\n        value: \"item1\"\n    }\n};\n\nexport const FullWidth: Story = {\n    args: {\n        items,\n        value: \"item1\",\n        fullWidth: true\n    }\n};\n"],"names":["meta","SegmentedControlPrimitive","args","value","setValue","useState","items","itemsWithIcons","Icon","LockIcon","Default","WithDefaultOption","WithIcons","VariantLight","VariantDimmed","VariantGhost","Disabled","PartiallyDisabled","FullWidth"],"mappings":";;;;AAMA,MAAMA,OAA+C;IACjD,OAAO;IACP,WAAWC;IACX,YAAY;QACR,QAAQ;IACZ;IACA,QAAQC,CAAAA;QACJ,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAASH,KAAK,KAAK;QAC7C,OAAO,WAAP,GACI,oBAAC;YAAI,WAAW;yBACZ,oBAACD,2BAAyBA;YACrB,GAAGC,IAAI;YACR,OAAOC;YACP,UAAUA,CAAAA,QAASC,SAASD;0BAEhC,oBAAC;YAAI,WAAW;WAAoB,0CACR,oBAAC,aAAKA;IAI9C;AACJ;AAEA,0CAAeH;AAIf,MAAMM,QAAQ;IACV;QAAE,OAAO;QAAU,OAAO;IAAQ;IAClC;QAAE,OAAO;QAAU,OAAO;IAAQ;IAClC;QAAE,OAAO;QAAU,OAAO;IAAQ;IAClC;QAAE,OAAO;QAAU,OAAO;IAAQ;CACrC;AAED,MAAMC,iBAAiB;IACnB;QAAE,OAAO;QAAU,OAAO;QAAS,MAAM,WAAN,GAAM,oBAACC,MAAIA;YAAC,oBAAM,oBAACC,gBAAQA;YAAK,OAAM;;IAAU;IACnF;QAAE,OAAO;QAAU,OAAO;QAAS,MAAM,WAAN,GAAM,oBAACD,MAAIA;YAAC,oBAAM,oBAACC,gBAAQA;YAAK,OAAM;;IAAU;IACnF;QAAE,OAAO;QAAU,OAAO;QAAS,MAAM,WAAN,GAAM,oBAACD,MAAIA;YAAC,oBAAM,oBAACC,gBAAQA;YAAK,OAAM;;IAAU;IACnF;QAAE,OAAO;QAAU,OAAO;QAAS,MAAM,WAAN,GAAM,oBAACD,MAAIA;YAAC,oBAAM,oBAACC,gBAAQA;YAAK,OAAM;;IAAU;CACtF;AAEM,MAAMC,UAAiB;IAC1B,MAAM;QACFJ,OAAAA;IACJ;AACJ;AAEO,MAAMK,oBAA2B;IACpC,MAAM;QACFL,OAAAA;QACA,OAAO;IACX;AACJ;AAEO,MAAMM,YAAmB;IAC5B,MAAM;QACF,OAAOL;QACP,OAAO;IACX;AACJ;AAEO,MAAMM,eAAsB;IAC/B,MAAM;QACFP,OAAAA;QACA,OAAO;QACP,SAAS;IACb;AACJ;AAEO,MAAMQ,gBAAuB;IAChC,MAAM;QACFR,OAAAA;QACA,OAAO;QACP,SAAS;IACb;AACJ;AAEO,MAAMS,eAAsB;IAC/B,QAAQb,CAAAA;QACJ,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAASH,KAAK,KAAK,IAAI;QACjD,OAAO,WAAP,GACI,oBAAC;YAAI,WAAU;yBACX,oBAACD,2BAAyBA;YACrB,GAAGC,IAAI;YACR,OAAOI;YACP,OAAOH;YACP,UAAUA,CAAAA,QAASC,SAASD;YAC5B,SAAQ;;IAIxB;AACJ;AAEO,MAAMa,WAAkB;IAC3B,MAAM;QACFV,OAAAA;QACA,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMW,oBAA2B;IACpC,MAAM;QACF,OAAO;YACH;gBAAE,OAAO;gBAAU,OAAO;YAAQ;YAClC;gBAAE,OAAO;gBAAqB,OAAO;gBAAS,UAAU;YAAK;YAC7D;gBAAE,OAAO;gBAAU,OAAO;YAAQ;YAClC;gBAAE,OAAO;gBAAqB,OAAO;gBAAS,UAAU;YAAK;SAChE;QACD,OAAO;IACX;AACJ;AAEO,MAAMC,YAAmB;IAC5B,MAAM;QACFZ,OAAAA;QACA,OAAO;QACP,WAAW;IACf;AACJ"}

package/SegmentedControl/primitives/index.js

@@ -1,5 +1,3 @@
 export * from "./SegmentedControlPrimitive.js";
 export * from "./useSegmentedControl.js";
 export * from "./presenters/SegmentedControlPresenter.js";
-
-//# sourceMappingURL=index.js.map

package/SegmentedControl/primitives/presenters/SegmentedControlPresenter.js

@@ -2,27 +2,25 @@ import { makeAutoObservable } from "mobx";
 import { SegmentedControlItem } from "../../domains/SegmentedControlItem.js";
 import { SegmentedControlItemFormatter } from "../../domains/SegmentedControlItemFormatter.js";
 class SegmentedControlPresenter {
-  params = undefined;
-  constructor() {
-    makeAutoObservable(this);
-  }
-  init = params => {
-    this.params = params;
-  };
-  get vm() {
-    return {
-      items: this.getSegmentedControlItems().map(item => SegmentedControlItemFormatter.format(item))
-    };
-  }
-  changeValue = value => {
-    this.params?.onValueChange?.(value);
-  };
-  getSegmentedControlItems() {
-    if (!this.params?.items) {
-      return [];
+    constructor(){
+        this.params = void 0;
+        this.init = (params)=>{
+            this.params = params;
+        };
+        this.changeValue = (value)=>{
+            this.params?.onValueChange?.(value);
+        };
+        makeAutoObservable(this);
+    }
+    get vm() {
+        return {
+            items: this.getSegmentedControlItems().map((item)=>SegmentedControlItemFormatter.format(item))
+        };
+    }
+    getSegmentedControlItems() {
+        if (!this.params?.items) return [];
+        return this.params.items.map((item)=>SegmentedControlItem.create(item));
     }
-    return this.params.items.map(item => SegmentedControlItem.create(item));
-  }
 }
 export { SegmentedControlPresenter };
 

package/SegmentedControl/primitives/presenters/SegmentedControlPresenter.js.map

@@ -1 +1 @@
-{"version":3,"names":["makeAutoObservable","SegmentedControlItem","SegmentedControlItemFormatter","SegmentedControlPresenter","params","undefined","constructor","init","vm","items","getSegmentedControlItems","map","item","format","changeValue","value","onValueChange","create"],"sources":["SegmentedControlPresenter.ts"],"sourcesContent":["import { makeAutoObservable } from \"mobx\";\nimport type { SegmentedControlVm } from \"../SegmentedControlPrimitive.js\";\nimport { SegmentedControlItem } from \"~/SegmentedControl/domains/SegmentedControlItem.js\";\nimport { SegmentedControlItemFormatter } from \"~/SegmentedControl/domains/SegmentedControlItemFormatter.js\";\nimport type { SegmentedControlItemParams } from \"~/SegmentedControl/domains/SegmentedControlItemParams.js\";\n\ninterface SegmentedControlPresenterParams<TValue = string> {\n    items: SegmentedControlItemParams[];\n    onValueChange?: (value: TValue) => void;\n}\n\ninterface ISegmentedControlPresenter<TValue = string> {\n    vm: SegmentedControlVm;\n    init: (props: SegmentedControlPresenterParams<TValue>) => void;\n    changeValue: (value: TValue) => void;\n}\n\nclass SegmentedControlPresenter<TValue = string> implements ISegmentedControlPresenter<TValue> {\n    private params?: SegmentedControlPresenterParams<TValue> = undefined;\n\n    constructor() {\n        makeAutoObservable(this);\n    }\n\n    public init = (params: SegmentedControlPresenterParams<TValue>) => {\n        this.params = params;\n    };\n\n    get vm() {\n        return {\n            items: this.getSegmentedControlItems().map(item =>\n                SegmentedControlItemFormatter.format(item)\n            )\n        };\n    }\n\n    public changeValue = (value: TValue) => {\n        this.params?.onValueChange?.(value);\n    };\n\n    private getSegmentedControlItems() {\n        if (!this.params?.items) {\n            return [];\n        }\n\n        return this.params.items.map(item => SegmentedControlItem.create(item));\n    }\n}\n\nexport {\n    SegmentedControlPresenter,\n    type SegmentedControlPresenterParams,\n    type ISegmentedControlPresenter\n};\n"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,MAAM;AAEzC,SAASC,oBAAoB;AAC7B,SAASC,6BAA6B;AActC,MAAMC,yBAAyB,CAAgE;EACnFC,MAAM,GAA6CC,SAAS;EAEpEC,WAAWA,CAAA,EAAG;IACVN,kBAAkB,CAAC,IAAI,CAAC;EAC5B;EAEOO,IAAI,GAAIH,MAA+C,IAAK;IAC/D,IAAI,CAACA,MAAM,GAAGA,MAAM;EACxB,CAAC;EAED,IAAII,EAAEA,CAAA,EAAG;IACL,OAAO;MACHC,KAAK,EAAE,IAAI,CAACC,wBAAwB,CAAC,CAAC,CAACC,GAAG,CAACC,IAAI,IAC3CV,6BAA6B,CAACW,MAAM,CAACD,IAAI,CAC7C;IACJ,CAAC;EACL;EAEOE,WAAW,GAAIC,KAAa,IAAK;IACpC,IAAI,CAACX,MAAM,EAAEY,aAAa,GAAGD,KAAK,CAAC;EACvC,CAAC;EAEOL,wBAAwBA,CAAA,EAAG;IAC/B,IAAI,CAAC,IAAI,CAACN,MAAM,EAAEK,KAAK,EAAE;MACrB,OAAO,EAAE;IACb;IAEA,OAAO,IAAI,CAACL,MAAM,CAACK,KAAK,CAACE,GAAG,CAACC,IAAI,IAAIX,oBAAoB,CAACgB,MAAM,CAACL,IAAI,CAAC,CAAC;EAC3E;AACJ;AAEA,SACIT,yBAAyB","ignoreList":[]}
+{"version":3,"file":"SegmentedControl/primitives/presenters/SegmentedControlPresenter.js","sources":["../../../../src/SegmentedControl/primitives/presenters/SegmentedControlPresenter.ts"],"sourcesContent":["import { makeAutoObservable } from \"mobx\";\nimport type { SegmentedControlVm } from \"../SegmentedControlPrimitive.js\";\nimport { SegmentedControlItem } from \"~/SegmentedControl/domains/SegmentedControlItem.js\";\nimport { SegmentedControlItemFormatter } from \"~/SegmentedControl/domains/SegmentedControlItemFormatter.js\";\nimport type { SegmentedControlItemParams } from \"~/SegmentedControl/domains/SegmentedControlItemParams.js\";\n\ninterface SegmentedControlPresenterParams<TValue = string> {\n    items: SegmentedControlItemParams[];\n    onValueChange?: (value: TValue) => void;\n}\n\ninterface ISegmentedControlPresenter<TValue = string> {\n    vm: SegmentedControlVm;\n    init: (props: SegmentedControlPresenterParams<TValue>) => void;\n    changeValue: (value: TValue) => void;\n}\n\nclass SegmentedControlPresenter<TValue = string> implements ISegmentedControlPresenter<TValue> {\n    private params?: SegmentedControlPresenterParams<TValue> = undefined;\n\n    constructor() {\n        makeAutoObservable(this);\n    }\n\n    public init = (params: SegmentedControlPresenterParams<TValue>) => {\n        this.params = params;\n    };\n\n    get vm() {\n        return {\n            items: this.getSegmentedControlItems().map(item =>\n                SegmentedControlItemFormatter.format(item)\n            )\n        };\n    }\n\n    public changeValue = (value: TValue) => {\n        this.params?.onValueChange?.(value);\n    };\n\n    private getSegmentedControlItems() {\n        if (!this.params?.items) {\n            return [];\n        }\n\n        return this.params.items.map(item => SegmentedControlItem.create(item));\n    }\n}\n\nexport {\n    SegmentedControlPresenter,\n    type SegmentedControlPresenterParams,\n    type ISegmentedControlPresenter\n};\n"],"names":["SegmentedControlPresenter","undefined","params","value","makeAutoObservable","item","SegmentedControlItemFormatter","SegmentedControlItem"],"mappings":";;;AAiBA,MAAMA;IAGF,aAAc;aAFN,MAAM,GAA6CC;aAMpD,IAAI,GAAG,CAACC;YACX,IAAI,CAAC,MAAM,GAAGA;QAClB;aAUO,WAAW,GAAG,CAACC;YAClB,IAAI,CAAC,MAAM,EAAE,gBAAgBA;QACjC;QAjBIC,mBAAmB,IAAI;IAC3B;IAMA,IAAI,KAAK;QACL,OAAO;YACH,OAAO,IAAI,CAAC,wBAAwB,GAAG,GAAG,CAACC,CAAAA,OACvCC,8BAA8B,MAAM,CAACD;QAE7C;IACJ;IAMQ,2BAA2B;QAC/B,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,OACd,OAAO,EAAE;QAGb,OAAO,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,CAACA,CAAAA,OAAQE,qBAAqB,MAAM,CAACF;IACrE;AACJ"}

package/SegmentedControl/primitives/useSegmentedControl.js

@@ -1,27 +1,31 @@
 import { useEffect, useMemo, useState } from "react";
 import { autorun } from "mobx";
 import { SegmentedControlPresenter } from "./presenters/SegmentedControlPresenter.js";
-export const useSegmentedControl = props => {
-  const params = useMemo(() => ({
-    items: props.items,
-    onValueChange: props.onChange
-  }), [props.items, props.onChange]);
-  const presenter = useMemo(() => {
-    return new SegmentedControlPresenter();
-  }, []);
-  useEffect(() => {
-    presenter.init(params);
-  }, [params]);
-  const [vm, setVm] = useState(presenter.vm);
-  useEffect(() => {
-    return autorun(() => {
-      setVm(presenter.vm);
-    });
-  }, [presenter]);
-  return {
-    vm,
-    changeValue: presenter.changeValue
-  };
+const useSegmentedControl = (props)=>{
+    const params = useMemo(()=>({
+            items: props.items,
+            onValueChange: props.onChange
+        }), [
+        props.items,
+        props.onChange
+    ]);
+    const presenter = useMemo(()=>new SegmentedControlPresenter(), []);
+    useEffect(()=>{
+        presenter.init(params);
+    }, [
+        params
+    ]);
+    const [vm, setVm] = useState(presenter.vm);
+    useEffect(()=>autorun(()=>{
+            setVm(presenter.vm);
+        }), [
+        presenter
+    ]);
+    return {
+        vm,
+        changeValue: presenter.changeValue
+    };
 };
+export { useSegmentedControl };
 
 //# sourceMappingURL=useSegmentedControl.js.map

package/SegmentedControl/primitives/useSegmentedControl.js.map

@@ -1 +1 @@
-{"version":3,"names":["useEffect","useMemo","useState","autorun","SegmentedControlPresenter","useSegmentedControl","props","params","items","onValueChange","onChange","presenter","init","vm","setVm","changeValue"],"sources":["useSegmentedControl.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { autorun } from \"mobx\";\nimport type { SegmentedControlPrimitiveProps } from \"./SegmentedControlPrimitive.js\";\nimport type { SegmentedControlPresenterParams } from \"./presenters/SegmentedControlPresenter.js\";\nimport { SegmentedControlPresenter } from \"./presenters/SegmentedControlPresenter.js\";\n\nexport const useSegmentedControl = (props: SegmentedControlPrimitiveProps) => {\n    const params: SegmentedControlPresenterParams = useMemo(\n        () => ({\n            items: props.items,\n            onValueChange: props.onChange\n        }),\n        [props.items, props.onChange]\n    );\n\n    const presenter = useMemo(() => {\n        return new SegmentedControlPresenter();\n    }, []);\n\n    useEffect(() => {\n        presenter.init(params);\n    }, [params]);\n\n    const [vm, setVm] = useState(presenter.vm);\n\n    useEffect(() => {\n        return autorun(() => {\n            setVm(presenter.vm);\n        });\n    }, [presenter]);\n\n    return { vm, changeValue: presenter.changeValue };\n};\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AACpD,SAASC,OAAO,QAAQ,MAAM;AAG9B,SAASC,yBAAyB;AAElC,OAAO,MAAMC,mBAAmB,GAAIC,KAAqC,IAAK;EAC1E,MAAMC,MAAuC,GAAGN,OAAO,CACnD,OAAO;IACHO,KAAK,EAAEF,KAAK,CAACE,KAAK;IAClBC,aAAa,EAAEH,KAAK,CAACI;EACzB,CAAC,CAAC,EACF,CAACJ,KAAK,CAACE,KAAK,EAAEF,KAAK,CAACI,QAAQ,CAChC,CAAC;EAED,MAAMC,SAAS,GAAGV,OAAO,CAAC,MAAM;IAC5B,OAAO,IAAIG,yBAAyB,CAAC,CAAC;EAC1C,CAAC,EAAE,EAAE,CAAC;EAENJ,SAAS,CAAC,MAAM;IACZW,SAAS,CAACC,IAAI,CAACL,MAAM,CAAC;EAC1B,CAAC,EAAE,CAACA,MAAM,CAAC,CAAC;EAEZ,MAAM,CAACM,EAAE,EAAEC,KAAK,CAAC,GAAGZ,QAAQ,CAACS,SAAS,CAACE,EAAE,CAAC;EAE1Cb,SAAS,CAAC,MAAM;IACZ,OAAOG,OAAO,CAAC,MAAM;MACjBW,KAAK,CAACH,SAAS,CAACE,EAAE,CAAC;IACvB,CAAC,CAAC;EACN,CAAC,EAAE,CAACF,SAAS,CAAC,CAAC;EAEf,OAAO;IAAEE,EAAE;IAAEE,WAAW,EAAEJ,SAAS,CAACI;EAAY,CAAC;AACrD,CAAC","ignoreList":[]}
+{"version":3,"file":"SegmentedControl/primitives/useSegmentedControl.js","sources":["../../../src/SegmentedControl/primitives/useSegmentedControl.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { autorun } from \"mobx\";\nimport type { SegmentedControlPrimitiveProps } from \"./SegmentedControlPrimitive.js\";\nimport type { SegmentedControlPresenterParams } from \"./presenters/SegmentedControlPresenter.js\";\nimport { SegmentedControlPresenter } from \"./presenters/SegmentedControlPresenter.js\";\n\nexport const useSegmentedControl = (props: SegmentedControlPrimitiveProps) => {\n    const params: SegmentedControlPresenterParams = useMemo(\n        () => ({\n            items: props.items,\n            onValueChange: props.onChange\n        }),\n        [props.items, props.onChange]\n    );\n\n    const presenter = useMemo(() => {\n        return new SegmentedControlPresenter();\n    }, []);\n\n    useEffect(() => {\n        presenter.init(params);\n    }, [params]);\n\n    const [vm, setVm] = useState(presenter.vm);\n\n    useEffect(() => {\n        return autorun(() => {\n            setVm(presenter.vm);\n        });\n    }, [presenter]);\n\n    return { vm, changeValue: presenter.changeValue };\n};\n"],"names":["useSegmentedControl","props","params","useMemo","presenter","SegmentedControlPresenter","useEffect","vm","setVm","useState","autorun"],"mappings":";;;AAMO,MAAMA,sBAAsB,CAACC;IAChC,MAAMC,SAA0CC,QAC5C,IAAO;YACH,OAAOF,MAAM,KAAK;YAClB,eAAeA,MAAM,QAAQ;QACjC,IACA;QAACA,MAAM,KAAK;QAAEA,MAAM,QAAQ;KAAC;IAGjC,MAAMG,YAAYD,QAAQ,IACf,IAAIE,6BACZ,EAAE;IAELC,UAAU;QACNF,UAAU,IAAI,CAACF;IACnB,GAAG;QAACA;KAAO;IAEX,MAAM,CAACK,IAAIC,MAAM,GAAGC,SAASL,UAAU,EAAE;IAEzCE,UAAU,IACCI,QAAQ;YACXF,MAAMJ,UAAU,EAAE;QACtB,IACD;QAACA;KAAU;IAEd,OAAO;QAAEG;QAAI,aAAaH,UAAU,WAAW;IAAC;AACpD"}

package/Select/Select.d.ts

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

package/Select/Select.js

@@ -1,44 +1,35 @@
-import React, { useMemo } from "react";
+import react, { useMemo } from "react";
 import { makeDecoratable } from "../utils.js";
 import { SelectPrimitive } from "./primitives/index.js";
 import { FormComponentDescription, FormComponentErrorMessage, FormComponentLabel, FormComponentNote } from "../FormComponent/index.js";
-const DecoratableSelect = ({
-  label,
-  description,
-  note,
-  hint,
-  required,
-  disabled,
-  validation,
-  ...props
-}) => {
-  const {
-    isValid: validationIsValid,
-    message: validationMessage
-  } = validation || {};
-  const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: "w-full"
-  }, /*#__PURE__*/React.createElement(FormComponentLabel, {
-    text: label,
-    hint: hint,
-    required: required,
-    disabled: disabled,
-    invalid: invalid
-  }), /*#__PURE__*/React.createElement(FormComponentDescription, {
-    text: description,
-    disabled: disabled
-  }), /*#__PURE__*/React.createElement(SelectPrimitive, Object.assign({}, props, {
-    disabled: disabled,
-    invalid: invalid
-  })), /*#__PURE__*/React.createElement(FormComponentErrorMessage, {
-    text: validationMessage,
-    invalid: invalid,
-    disabled: disabled
-  }), /*#__PURE__*/React.createElement(FormComponentNote, {
-    text: note,
-    disabled: disabled
-  }));
+const DecoratableSelect = ({ label, description, note, hint, required, disabled, validation, ...props })=>{
+    const { isValid: validationIsValid, message: validationMessage } = validation || {};
+    const invalid = useMemo(()=>false === validationIsValid, [
+        validationIsValid
+    ]);
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "w-full"
+    }, /*#__PURE__*/ react.createElement(FormComponentLabel, {
+        text: label,
+        hint: hint,
+        required: required,
+        disabled: disabled,
+        invalid: invalid
+    }), /*#__PURE__*/ react.createElement(FormComponentDescription, {
+        text: description,
+        disabled: disabled
+    }), /*#__PURE__*/ react.createElement(SelectPrimitive, {
+        ...props,
+        disabled: disabled,
+        invalid: invalid
+    }), /*#__PURE__*/ react.createElement(FormComponentErrorMessage, {
+        text: validationMessage,
+        invalid: invalid,
+        disabled: disabled
+    }), /*#__PURE__*/ react.createElement(FormComponentNote, {
+        text: note,
+        disabled: disabled
+    }));
 };
 const Select = makeDecoratable("Select", DecoratableSelect);
 export { Select };

package/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","makeDecoratable","SelectPrimitive","FormComponentDescription","FormComponentErrorMessage","FormComponentLabel","FormComponentNote","DecoratableSelect","label","description","note","hint","required","disabled","validation","props","isValid","validationIsValid","message","validationMessage","invalid","createElement","className","text","Object","assign","Select"],"sources":["Select.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { makeDecoratable } from \"~/utils.js\";\nimport type { SelectPrimitiveProps } from \"./primitives/index.js\";\nimport { SelectPrimitive } 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 SelectProps = SelectPrimitiveProps & FormComponentProps;\n\nconst DecoratableSelect = ({\n    label,\n    description,\n    note,\n    hint,\n    required,\n    disabled,\n    validation,\n    ...props\n}: SelectProps) => {\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            <SelectPrimitive {...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 Select = makeDecoratable(\"Select\", DecoratableSelect);\n\nexport { Select, type SelectProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,eAAe;AAExB,SAASC,eAAe;AAExB,SACIC,wBAAwB,EACxBC,yBAAyB,EACzBC,kBAAkB,EAClBC,iBAAiB;AAKrB,MAAMC,iBAAiB,GAAGA,CAAC;EACvBC,KAAK;EACLC,WAAW;EACXC,IAAI;EACJC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,UAAU;EACV,GAAGC;AACM,CAAC,KAAK;EACf,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,eAAe,EAAAsB,MAAA,CAAAC,MAAA,KAAKV,KAAK;IAAEF,QAAQ,EAAEA,QAAS;IAACO,OAAO,EAAEA;EAAQ,EAAE,CAAC,eACpErB,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,MAAM,GAAGzB,eAAe,CAAC,QAAQ,EAAEM,iBAAiB,CAAC;AAE3D,SAASmB,MAAM","ignoreList":[]}
+{"version":3,"file":"Select/Select.js","sources":["../../src/Select/Select.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { makeDecoratable } from \"~/utils.js\";\nimport type { SelectPrimitiveProps } from \"./primitives/index.js\";\nimport { SelectPrimitive } 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 SelectProps = SelectPrimitiveProps & FormComponentProps;\n\nconst DecoratableSelect = ({\n    label,\n    description,\n    note,\n    hint,\n    required,\n    disabled,\n    validation,\n    ...props\n}: SelectProps) => {\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            <SelectPrimitive {...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 Select = makeDecoratable(\"Select\", DecoratableSelect);\n\nexport { Select, type SelectProps };\n"],"names":["DecoratableSelect","label","description","note","hint","required","disabled","validation","props","validationIsValid","validationMessage","invalid","useMemo","FormComponentLabel","FormComponentDescription","SelectPrimitive","FormComponentErrorMessage","FormComponentNote","Select","makeDecoratable"],"mappings":";;;;AAcA,MAAMA,oBAAoB,CAAC,EACvBC,KAAK,EACLC,WAAW,EACXC,IAAI,EACJC,IAAI,EACJC,QAAQ,EACRC,QAAQ,EACRC,UAAU,EACV,GAAGC,OACO;IACV,MAAM,EAAE,SAASC,iBAAiB,EAAE,SAASC,iBAAiB,EAAE,GAAGH,cAAc,CAAC;IAClF,MAAMI,UAAUC,QAAQ,IAAMH,AAAsB,UAAtBA,mBAA6B;QAACA;KAAkB;IAE9E,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAACI,oBAAkBA;QACf,MAAMZ;QACN,MAAMG;QACN,UAAUC;QACV,UAAUC;QACV,SAASK;sBAEb,oBAACG,0BAAwBA;QAAC,MAAMZ;QAAa,UAAUI;sBACvD,oBAACS,iBAAeA;QAAE,GAAGP,KAAK;QAAE,UAAUF;QAAU,SAASK;sBACzD,oBAACK,2BAAyBA;QACtB,MAAMN;QACN,SAASC;QACT,UAAUL;sBAEd,oBAACW,mBAAiBA;QAAC,MAAMd;QAAM,UAAUG;;AAGrD;AACA,MAAMY,SAASC,gBAAgB,UAAUnB"}

package/Select/Select.stories.d.ts

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