@webiny/admin-ui 6.4.0-beta.3 → 6.4.0-beta.4

package/Switch/Switch.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch/Switch.stories.js","sources":["../../src/Switch/Switch.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Switch } from \"~/Switch/index.js\";\nimport { Tooltip } from \"~/Tooltip/index.js\";\n\nconst meta: Meta<typeof Switch> = {\n    title: \"Components/Form/Switch\",\n    component: Switch,\n    parameters: {\n        layout: \"padded\"\n    },\n    argTypes: {\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    decorators: [\n        Story => (\n            <Tooltip.Provider>\n                <Story />\n            </Tooltip.Provider>\n        )\n    ],\n    render: args => {\n        const [checked, setChecked] = useState(args.checked);\n        return <Switch {...args} checked={checked} onChange={value => setChecked(value)} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Switch>;\n\nexport const Default: Story = {\n    args: {\n        label: \"Any field label\"\n    }\n};\n\nexport const WithLabelRequired: Story = {\n    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        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 [checked, setChecked] = useState(args.checked || false);\n        const [validation, setValidation] = useState({ isValid: true, message: \"\" });\n\n        // Update checked state when args.checked changes\n        useEffect(() => {\n            setChecked(args.checked || false);\n        }, [args.checked]);\n\n        const handleChange = (isChecked: boolean) => {\n            setChecked(isChecked);\n\n            // Simple required validation\n            if (args.required && !isChecked) {\n                setValidation({ isValid: false, message: \"This field is required\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        };\n\n        // Validate on required change\n        useEffect(() => {\n            if (args.required && !checked) {\n                setValidation({ isValid: false, message: \"This field is required\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        }, [args.required, checked]);\n\n        return (\n            <Switch\n                {...args}\n                checked={checked}\n                onChange={handleChange}\n                validation={validation}\n                required={args.required}\n            />\n        );\n    },\n    args: {\n        label: \"Enable feature\",\n        checked: false,\n        disabled: false,\n        required: true,\n        description: \"Enabling this feature will activate additional functionality.\",\n        note: \"Note: This setting can be changed at any time.\",\n        validation: undefined\n    },\n    argTypes: {\n        label: {\n            description: \"Label text for the switch\",\n            control: \"text\"\n        },\n        checked: {\n            description: \"Determines if the switch is checked\",\n            control: \"boolean\"\n        },\n        disabled: {\n            description: \"Disables the switch when set to true\",\n            control: \"boolean\"\n        },\n        required: {\n            description: \"Makes the switch required when set to true\",\n            control: \"boolean\"\n        },\n        description: {\n            description: \"Additional description text below the switch\",\n            control: \"text\"\n        },\n        note: {\n            description: \"Additional note text below the switch\",\n            control: \"text\"\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 the switch state changes\"\n        }\n    }\n};\n"],"names":["meta","Switch","Story","Tooltip","args","checked","setChecked","useState","value","Default","WithLabelRequired","WithDescription","WithNotes","WithErrors","Disabled","FullExample","Documentation","validation","setValidation","useEffect","handleChange","isChecked","undefined"],"mappings":";;;AAKA,MAAMA,OAA4B;IAC9B,OAAO;IACP,WAAWC;IACX,YAAY;QACR,QAAQ;IACZ;IACA,UAAU;QACN,UAAU;YACN,SAAS;YACT,cAAc;QAClB;IACJ;IACA,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAACC,QAAQ,QAAQ,sBACb,oBAACD,OAAAA;KAGZ;IACD,QAAQE,CAAAA;QACJ,MAAM,CAACC,SAASC,WAAW,GAAGC,SAASH,KAAK,OAAO;QACnD,OAAO,WAAP,GAAO,oBAACH,QAAMA;YAAE,GAAGG,IAAI;YAAE,SAASC;YAAS,UAAUG,CAAAA,QAASF,WAAWE;;IAC7E;AACJ;AAEA,uBAAeR;AAGR,MAAMS,UAAiB;IAC1B,MAAM;QACF,OAAO;IACX;AACJ;AAEO,MAAMC,oBAA2B;IACpC,MAAM;QACF,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMC,kBAAyB;IAClC,MAAM;QACF,GAAGF,QAAQ,IAAI;QACf,aAAa;IACjB;AACJ;AAEO,MAAMG,YAAmB;IAC5B,MAAM;QACF,GAAGH,QAAQ,IAAI;QACf,MAAM;IACV;AACJ;AAEO,MAAMI,aAAoB;IAC7B,MAAM;QACF,GAAGJ,QAAQ,IAAI;QACf,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMK,WAAkB;IAC3B,MAAM;QACF,GAAGL,QAAQ,IAAI;QACf,UAAU;IACd;AACJ;AAEO,MAAMM,cAAqB;IAC9B,MAAM;QACF,GAAGN,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;QACV,aAAa;QACb,MAAM;QACN,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMO,gBAAuB;IAChC,QAAQZ,CAAAA;QACJ,MAAM,CAACC,SAASC,WAAW,GAAGC,SAASH,KAAK,OAAO,IAAI;QACvD,MAAM,CAACa,YAAYC,cAAc,GAAGX,SAAS;YAAE,SAAS;YAAM,SAAS;QAAG;QAG1EY,UAAU;YACNb,WAAWF,KAAK,OAAO,IAAI;QAC/B,GAAG;YAACA,KAAK,OAAO;SAAC;QAEjB,MAAMgB,eAAe,CAACC;YAClBf,WAAWe;YAGPjB,KAAK,QAAQ,IAAI,CAACiB,YAClBH,cAAc;gBAAE,SAAS;gBAAO,SAAS;YAAyB,KAElEA,cAAc;gBAAE,SAAS;gBAAM,SAAS;YAAG;QAEnD;QAGAC,UAAU;YACFf,KAAK,QAAQ,IAAI,CAACC,UAClBa,cAAc;gBAAE,SAAS;gBAAO,SAAS;YAAyB,KAElEA,cAAc;gBAAE,SAAS;gBAAM,SAAS;YAAG;QAEnD,GAAG;YAACd,KAAK,QAAQ;YAAEC;SAAQ;QAE3B,OAAO,WAAP,GACI,oBAACJ,QAAMA;YACF,GAAGG,IAAI;YACR,SAASC;YACT,UAAUe;YACV,YAAYH;YACZ,UAAUb,KAAK,QAAQ;;IAGnC;IACA,MAAM;QACF,OAAO;QACP,SAAS;QACT,UAAU;QACV,UAAU;QACV,aAAa;QACb,MAAM;QACN,YAAYkB;IAChB;IACA,UAAU;QACN,OAAO;YACH,aAAa;YACb,SAAS;QACb;QACA,SAAS;YACL,aAAa;YACb,SAAS;QACb;QACA,UAAU;YACN,aAAa;YACb,SAAS;QACb;QACA,UAAU;YACN,aAAa;YACb,SAAS;QACb;QACA,aAAa;YACT,aAAa;YACb,SAAS;QACb;QACA,MAAM;YACF,aAAa;YACb,SAAS;QACb;QACA,YAAY;YACR,aACI;QACR;QACA,UAAU;YACN,aAAa;QACjB;IACJ;AACJ"}
+{"version":3,"file":"Switch/Switch.stories.js","sources":["../../src/Switch/Switch.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Switch } from \"~/Switch/index.js\";\nimport { Tooltip } from \"~/Tooltip/index.js\";\n\nconst meta: Meta<typeof Switch> = {\n    title: \"Components/Form/Switch\",\n    component: Switch,\n    parameters: {\n        layout: \"padded\"\n    },\n    argTypes: {\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    decorators: [\n        Story => (\n            <Tooltip.Provider>\n                <Story />\n            </Tooltip.Provider>\n        )\n    ],\n    render: args => {\n        const [checked, setChecked] = useState(args.checked);\n        return <Switch {...args} checked={checked} onChange={value => setChecked(value)} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Switch>;\n\nexport const Default: Story = {\n    args: {\n        label: \"Any field label\"\n    }\n};\n\nexport const WithLabelRequired: Story = {\n    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        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 [checked, setChecked] = useState(args.checked || false);\n        const [validation, setValidation] = useState({ isValid: true, message: \"\" });\n\n        // Update checked state when args.checked changes\n        useEffect(() => {\n            setChecked(args.checked || false);\n        }, [args.checked]);\n\n        const handleChange = (isChecked: boolean) => {\n            setChecked(isChecked);\n\n            // Simple required validation\n            if (args.required && !isChecked) {\n                setValidation({ isValid: false, message: \"This field is required\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        };\n\n        // Validate on required change\n        useEffect(() => {\n            if (args.required && !checked) {\n                setValidation({ isValid: false, message: \"This field is required\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        }, [args.required, checked]);\n\n        return (\n            <Switch\n                {...args}\n                checked={checked}\n                onChange={handleChange}\n                validation={validation}\n                required={args.required}\n            />\n        );\n    },\n    args: {\n        label: \"Enable feature\",\n        checked: false,\n        disabled: false,\n        required: true,\n        description: \"Enabling this feature will activate additional functionality.\",\n        note: \"Note: This setting can be changed at any time.\",\n        validation: undefined\n    },\n    argTypes: {\n        label: {\n            description: \"Label text for the switch\",\n            control: \"text\"\n        },\n        checked: {\n            description: \"Determines if the switch is checked\",\n            control: \"boolean\"\n        },\n        disabled: {\n            description: \"Disables the switch when set to true\",\n            control: \"boolean\"\n        },\n        required: {\n            description: \"Makes the switch required when set to true\",\n            control: \"boolean\"\n        },\n        description: {\n            description: \"Additional description text below the switch\",\n            control: \"text\"\n        },\n        note: {\n            description: \"Additional note text below the switch\",\n            control: \"text\"\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 the switch state changes\"\n        }\n    }\n};\n"],"names":["meta","Switch","Story","Tooltip","args","checked","setChecked","useState","value","Default","WithLabelRequired","WithDescription","WithNotes","WithErrors","Disabled","FullExample","Documentation","validation","setValidation","useEffect","handleChange","isChecked","undefined"],"mappings":";;;AAKA,MAAMA,OAA4B;IAC9B,OAAO;IACP,WAAWC;IACX,YAAY;QACR,QAAQ;IACZ;IACA,UAAU;QACN,UAAU;YACN,SAAS;YACT,cAAc;QAClB;IACJ;IACA,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAACC,QAAQ,QAAQ,sBACb,oBAACD,OAAAA;KAGZ;IACD,QAAQE,CAAAA;QACJ,MAAM,CAACC,SAASC,WAAW,GAAGC,SAASH,KAAK,OAAO;QACnD,OAAO,WAAP,GAAO,oBAACH,QAAMA;YAAE,GAAGG,IAAI;YAAE,SAASC;YAAS,UAAUG,CAAAA,QAASF,WAAWE;;IAC7E;AACJ;AAEA,uBAAeR;AAGR,MAAMS,UAAiB;IAC1B,MAAM;QACF,OAAO;IACX;AACJ;AAEO,MAAMC,oBAA2B;IACpC,MAAM;QACF,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMC,kBAAyB;IAClC,MAAM;QACF,GAAGF,QAAQ,IAAI;QACf,aAAa;IACjB;AACJ;AAEO,MAAMG,YAAmB;IAC5B,MAAM;QACF,GAAGH,QAAQ,IAAI;QACf,MAAM;IACV;AACJ;AAEO,MAAMI,aAAoB;IAC7B,MAAM;QACF,GAAGJ,QAAQ,IAAI;QACf,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMK,WAAkB;IAC3B,MAAM;QACF,GAAGL,QAAQ,IAAI;QACf,UAAU;IACd;AACJ;AAEO,MAAMM,cAAqB;IAC9B,MAAM;QACF,GAAGN,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;QACV,aAAa;QACb,MAAM;QACN,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMO,gBAAuB;IAChC,QAAQZ,CAAAA;QACJ,MAAM,CAACC,SAASC,WAAW,GAAGC,SAASH,KAAK,OAAO,IAAI;QACvD,MAAM,CAACa,YAAYC,cAAc,GAAGX,SAAS;YAAE,SAAS;YAAM,SAAS;QAAG;QAG1EY,UAAU;YACNb,WAAWF,KAAK,OAAO,IAAI;QAC/B,GAAG;YAACA,KAAK,OAAO;SAAC;QAEjB,MAAMgB,eAAe,CAACC;YAClBf,WAAWe;YAGPjB,KAAK,QAAQ,IAAI,CAACiB,YAClBH,cAAc;gBAAE,SAAS;gBAAO,SAAS;YAAyB,KAElEA,cAAc;gBAAE,SAAS;gBAAM,SAAS;YAAG;QAEnD;QAGAC,UAAU;YACFf,KAAK,QAAQ,IAAI,CAACC,UAClBa,cAAc;gBAAE,SAAS;gBAAO,SAAS;YAAyB,KAElEA,cAAc;gBAAE,SAAS;gBAAM,SAAS;YAAG;QAEnD,GAAG;YAACd,KAAK,QAAQ;YAAEC;SAAQ;QAE3B,OAAO,WAAP,GACI,oBAACJ,QAAMA;YACF,GAAGG,IAAI;YACR,SAASC;YACT,UAAUe;YACV,YAAYH;YACZ,UAAUb,KAAK,QAAQ;;IAGnC;IACA,MAAM;QACF,OAAO;QACP,SAAS;QACT,UAAU;QACV,UAAU;QACV,aAAa;QACb,MAAM;QACN,YAAYkB;IAChB;IACA,UAAU;QACN,OAAO;YACH,aAAa;YACb,SAAS;QACb;QACA,SAAS;YACL,aAAa;YACb,SAAS;QACb;QACA,UAAU;YACN,aAAa;YACb,SAAS;QACb;QACA,UAAU;YACN,aAAa;YACb,SAAS;QACb;QACA,aAAa;YACT,aAAa;YACb,SAAS;QACb;QACA,MAAM;YACF,aAAa;YACb,SAAS;QACb;QACA,YAAY;YACR,aACI;QACR;QACA,UAAU;YACN,aAAa;QACjB;IACJ;AACJ"}

package/Switch/primitives/SwitchPrimitive.stories.d.ts

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

package/Switch/primitives/SwitchPrimitive.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch/primitives/SwitchPrimitive.stories.js","sources":["../../../src/Switch/primitives/SwitchPrimitive.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { SwitchPrimitive } from \"./SwitchPrimitive.js\";\n\nconst meta: Meta<typeof SwitchPrimitive> = {\n    title: \"Components/Form Primitives/Switch\",\n    component: SwitchPrimitive,\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [checked, setChecked] = useState(args.checked);\n        return (\n            <SwitchPrimitive {...args} checked={checked} onChange={value => setChecked(value)} />\n        );\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof SwitchPrimitive>;\n\nexport const Default: Story = {\n    args: {\n        label: \"Label\"\n    }\n};\n\nexport const WithLeadingLabel: Story = {\n    args: {\n        label: \"Leading label\",\n        labelPosition: \"start\"\n    }\n};\n\nexport const WithLongLeadingLabel: Story = {\n    args: {\n        label: \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu aliquam lacus. Morbi eleifend, eros et vestibulum lobortis, mi elit scelerisque neque, sit amet dictum orci sem ac ante. In hac habitasse platea dictumst. Pellentesque molestie nisl tortor, eu dictum velit mollis vitae. Maecenas nec risus sit amet ante efficitur venenatis id eget eros. Aenean mollis vel dolor vitae vestibulum. Integer consectetur id diam eget iaculis. Praesent egestas ullamcorper libero vel eleifend.\",\n        labelPosition: \"start\"\n    }\n};\n\nexport const WithTrailingLabel: Story = {\n    args: {\n        label: \"Trailing label\",\n        labelPosition: \"end\"\n    }\n};\n\nexport const WithLongTrailingLabel: Story = {\n    args: {\n        label: \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu aliquam lacus. Morbi eleifend, eros et vestibulum lobortis, mi elit scelerisque neque, sit amet dictum orci sem ac ante. In hac habitasse platea dictumst. Pellentesque molestie nisl tortor, eu dictum velit mollis vitae. Maecenas nec risus sit amet ante efficitur venenatis id eget eros. Aenean mollis vel dolor vitae vestibulum. Integer consectetur id diam eget iaculis. Praesent egestas ullamcorper libero vel eleifend.\",\n        labelPosition: \"end\"\n    }\n};\n\nexport const Checked: Story = {\n    args: {\n        checked: true\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        label: \"Label\",\n        disabled: true\n    }\n};\n"],"names":["meta","SwitchPrimitive","args","checked","setChecked","useState","value","Default","WithLeadingLabel","WithLongLeadingLabel","WithTrailingLabel","WithLongTrailingLabel","Checked","Disabled"],"mappings":";;AAIA,MAAMA,OAAqC;IACvC,OAAO;IACP,WAAWC;IACX,YAAY;QACR,QAAQ;IACZ;IACA,QAAQC,CAAAA;QACJ,MAAM,CAACC,SAASC,WAAW,GAAGC,SAASH,KAAK,OAAO;QACnD,OAAO,WAAP,GACI,oBAACD,iBAAeA;YAAE,GAAGC,IAAI;YAAE,SAASC;YAAS,UAAUG,CAAAA,QAASF,WAAWE;;IAEnF;AACJ;AAEA,gCAAeN;AAGR,MAAMO,UAAiB;IAC1B,MAAM;QACF,OAAO;IACX;AACJ;AAEO,MAAMC,mBAA0B;IACnC,MAAM;QACF,OAAO;QACP,eAAe;IACnB;AACJ;AAEO,MAAMC,uBAA8B;IACvC,MAAM;QACF,OAAO;QACP,eAAe;IACnB;AACJ;AAEO,MAAMC,oBAA2B;IACpC,MAAM;QACF,OAAO;QACP,eAAe;IACnB;AACJ;AAEO,MAAMC,wBAA+B;IACxC,MAAM;QACF,OAAO;QACP,eAAe;IACnB;AACJ;AAEO,MAAMC,UAAiB;IAC1B,MAAM;QACF,SAAS;IACb;AACJ;AAEO,MAAMC,WAAkB;IAC3B,MAAM;QACF,OAAO;QACP,UAAU;IACd;AACJ"}
+{"version":3,"file":"Switch/primitives/SwitchPrimitive.stories.js","sources":["../../../src/Switch/primitives/SwitchPrimitive.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { SwitchPrimitive } from \"./SwitchPrimitive.js\";\n\nconst meta: Meta<typeof SwitchPrimitive> = {\n    title: \"Components/Form Primitives/Switch\",\n    component: SwitchPrimitive,\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [checked, setChecked] = useState(args.checked);\n        return (\n            <SwitchPrimitive {...args} checked={checked} onChange={value => setChecked(value)} />\n        );\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof SwitchPrimitive>;\n\nexport const Default: Story = {\n    args: {\n        label: \"Label\"\n    }\n};\n\nexport const WithLeadingLabel: Story = {\n    args: {\n        label: \"Leading label\",\n        labelPosition: \"start\"\n    }\n};\n\nexport const WithLongLeadingLabel: Story = {\n    args: {\n        label: \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu aliquam lacus. Morbi eleifend, eros et vestibulum lobortis, mi elit scelerisque neque, sit amet dictum orci sem ac ante. In hac habitasse platea dictumst. Pellentesque molestie nisl tortor, eu dictum velit mollis vitae. Maecenas nec risus sit amet ante efficitur venenatis id eget eros. Aenean mollis vel dolor vitae vestibulum. Integer consectetur id diam eget iaculis. Praesent egestas ullamcorper libero vel eleifend.\",\n        labelPosition: \"start\"\n    }\n};\n\nexport const WithTrailingLabel: Story = {\n    args: {\n        label: \"Trailing label\",\n        labelPosition: \"end\"\n    }\n};\n\nexport const WithLongTrailingLabel: Story = {\n    args: {\n        label: \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu aliquam lacus. Morbi eleifend, eros et vestibulum lobortis, mi elit scelerisque neque, sit amet dictum orci sem ac ante. In hac habitasse platea dictumst. Pellentesque molestie nisl tortor, eu dictum velit mollis vitae. Maecenas nec risus sit amet ante efficitur venenatis id eget eros. Aenean mollis vel dolor vitae vestibulum. Integer consectetur id diam eget iaculis. Praesent egestas ullamcorper libero vel eleifend.\",\n        labelPosition: \"end\"\n    }\n};\n\nexport const Checked: Story = {\n    args: {\n        checked: true\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        label: \"Label\",\n        disabled: true\n    }\n};\n"],"names":["meta","SwitchPrimitive","args","checked","setChecked","useState","value","Default","WithLeadingLabel","WithLongLeadingLabel","WithTrailingLabel","WithLongTrailingLabel","Checked","Disabled"],"mappings":";;AAIA,MAAMA,OAAqC;IACvC,OAAO;IACP,WAAWC;IACX,YAAY;QACR,QAAQ;IACZ;IACA,QAAQC,CAAAA;QACJ,MAAM,CAACC,SAASC,WAAW,GAAGC,SAASH,KAAK,OAAO;QACnD,OAAO,WAAP,GACI,oBAACD,iBAAeA;YAAE,GAAGC,IAAI;YAAE,SAASC;YAAS,UAAUG,CAAAA,QAASF,WAAWE;;IAEnF;AACJ;AAEA,gCAAeN;AAGR,MAAMO,UAAiB;IAC1B,MAAM;QACF,OAAO;IACX;AACJ;AAEO,MAAMC,mBAA0B;IACnC,MAAM;QACF,OAAO;QACP,eAAe;IACnB;AACJ;AAEO,MAAMC,uBAA8B;IACvC,MAAM;QACF,OAAO;QACP,eAAe;IACnB;AACJ;AAEO,MAAMC,oBAA2B;IACpC,MAAM;QACF,OAAO;QACP,eAAe;IACnB;AACJ;AAEO,MAAMC,wBAA+B;IACxC,MAAM;QACF,OAAO;QACP,eAAe;IACnB;AACJ;AAEO,MAAMC,UAAiB;IAC1B,MAAM;QACF,SAAS;IACb;AACJ;AAEO,MAAMC,WAAkB;IAC3B,MAAM;QACF,OAAO;QACP,UAAU;IACd;AACJ"}

package/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs/Tabs.js","sources":["../../src/Tabs/Tabs.tsx"],"sourcesContent":["import React, { useMemo, useState } from \"react\";\nimport { Tabs as TabsPrimitive } from \"radix-ui\";\nimport { makeDecoratable, type VariantProps, withStaticProps } from \"~/utils.js\";\nimport type { ITabsContext, TabItem, TabProps, tabListVariants } from \"./components/index.js\";\nimport { Content, List, Tab, TabsContext, Trigger } from \"./components/index.js\";\n\nconst Root = TabsPrimitive.Root;\n\ninterface TabsProps extends Omit<TabsPrimitive.TabsProps, \"children\"> {\n    tabs: React.ReactElement<TabProps>[];\n    size?: VariantProps<typeof tabListVariants>[\"size\"];\n    spacing?: VariantProps<typeof tabListVariants>[\"spacing\"];\n    separator?: VariantProps<typeof tabListVariants>[\"separator\"];\n}\n\nconst DecoratableTabs = ({\n    defaultValue: initialValue,\n    size,\n    spacing,\n    separator,\n    tabs: tabComponents,\n    ...props\n}: TabsProps) => {\n    const [tabs, setTabs] = useState<TabItem[]>([]);\n\n    const defaultValue = useMemo(() => {\n        // `defaultValue` prop works only at first render so we need to use the `tabComponents` instead of the `TabItems`\n        return (\n            initialValue ||\n            tabComponents.find(tab => !tab.props.disabled && tab.props.visible !== false)?.props\n                .value\n        );\n    }, [initialValue, tabComponents]);\n\n    const triggers = useMemo(\n        () => (\n            // We need to generate a key like this to trigger a proper component re-render when child tabs change.\n            <List\n                key={tabs.map(tab => tab.id).join(\";\")}\n                size={size}\n                spacing={spacing}\n                separator={separator}\n            >\n                {tabs.map(tab => (\n                    <Trigger\n                        data-testid={tab[\"data-testid\"]}\n                        disabled={tab.disabled}\n                        icon={tab.icon}\n                        key={tab.id}\n                        size={size}\n                        text={tab.trigger}\n                        value={tab.value}\n                        visible={tab.visible}\n                    />\n                ))}\n            </List>\n        ),\n        [tabs, size, spacing]\n    );\n\n    const contents = useMemo(\n        () =>\n            tabs.map(tab => (\n                <Content\n                    key={tab.id}\n                    value={tab.value}\n                    content={tab.content}\n                    spacing={tab.spacing ?? spacing}\n                    className={tab.className}\n                />\n            )),\n        [tabs, spacing]\n    );\n\n    const context: ITabsContext = useMemo(\n        () => ({\n            addTab(props) {\n                setTabs(tabs => {\n                    const existingIndex = tabs.findIndex(tab => tab.value === props.value);\n                    if (existingIndex > -1) {\n                        return [\n                            ...tabs.slice(0, existingIndex),\n                            props,\n                            ...tabs.slice(existingIndex + 1)\n                        ];\n                    }\n                    return [...tabs, props];\n                });\n            },\n            removeTab(id) {\n                setTabs(tabs => tabs.filter(tab => tab.id !== id));\n            }\n        }),\n        [setTabs]\n    );\n\n    return (\n        <Root {...props} defaultValue={defaultValue}>\n            {triggers}\n            {contents}\n            <TabsContext.Provider value={context}>{tabComponents}</TabsContext.Provider>\n        </Root>\n    );\n};\n\nconst BaseTabs = makeDecoratable(\"Tabs\", DecoratableTabs);\n\nconst Tabs = withStaticProps(BaseTabs, {\n    Tab\n});\n\nexport { Tabs, type TabsProps };\n"],"names":["Root","TabsPrimitive","DecoratableTabs","initialValue","size","spacing","separator","tabComponents","props","tabs","setTabs","useState","defaultValue","useMemo","tab","triggers","List","Trigger","contents","Content","context","existingIndex","id","TabsContext","BaseTabs","makeDecoratable","Tabs","withStaticProps","Tab"],"mappings":";;;;AAMA,MAAMA,OAAOC,KAAAA,IAAkB;AAS/B,MAAMC,kBAAkB,CAAC,EACrB,cAAcC,YAAY,EAC1BC,IAAI,EACJC,OAAO,EACPC,SAAS,EACT,MAAMC,aAAa,EACnB,GAAGC,OACK;IACR,MAAM,CAACC,MAAMC,QAAQ,GAAGC,SAAoB,EAAE;IAE9C,MAAMC,eAAeC,QAAQ,IAGrBV,gBACAI,cAAc,IAAI,CAACO,CAAAA,MAAO,CAACA,IAAI,KAAK,CAAC,QAAQ,IAAIA,AAAsB,UAAtBA,IAAI,KAAK,CAAC,OAAO,GAAa,MAC1E,OAEV;QAACX;QAAcI;KAAc;IAEhC,MAAMQ,WAAWF,QACb,I,cAEI,oBAACG,MAAIA;YACD,KAAKP,KAAK,GAAG,CAACK,CAAAA,MAAOA,IAAI,EAAE,EAAE,IAAI,CAAC;YAClC,MAAMV;YACN,SAASC;YACT,WAAWC;WAEVG,KAAK,GAAG,CAACK,CAAAA,MAAAA,WAAAA,GACN,oBAACG,SAAOA;gBACJ,eAAaH,GAAG,CAAC,cAAc;gBAC/B,UAAUA,IAAI,QAAQ;gBACtB,MAAMA,IAAI,IAAI;gBACd,KAAKA,IAAI,EAAE;gBACX,MAAMV;gBACN,MAAMU,IAAI,OAAO;gBACjB,OAAOA,IAAI,KAAK;gBAChB,SAASA,IAAI,OAAO;kBAKpC;QAACL;QAAML;QAAMC;KAAQ;IAGzB,MAAMa,WAAWL,QACb,IACIJ,KAAK,GAAG,CAACK,CAAAA,MAAAA,WAAAA,GACL,oBAACK,SAAOA;gBACJ,KAAKL,IAAI,EAAE;gBACX,OAAOA,IAAI,KAAK;gBAChB,SAASA,IAAI,OAAO;gBACpB,SAASA,IAAI,OAAO,IAAIT;gBACxB,WAAWS,IAAI,SAAS;iBAGpC;QAACL;QAAMJ;KAAQ;IAGnB,MAAMe,UAAwBP,QAC1B,IAAO;YACH,QAAOL,KAAK;gBACRE,QAAQD,CAAAA;oBACJ,MAAMY,gBAAgBZ,KAAK,SAAS,CAACK,CAAAA,MAAOA,IAAI,KAAK,KAAKN,MAAM,KAAK;oBACrE,IAAIa,gBAAgB,IAChB,OAAO;2BACAZ,KAAK,KAAK,CAAC,GAAGY;wBACjBb;2BACGC,KAAK,KAAK,CAACY,gBAAgB;qBACjC;oBAEL,OAAO;2BAAIZ;wBAAMD;qBAAM;gBAC3B;YACJ;YACA,WAAUc,EAAE;gBACRZ,QAAQD,CAAAA,OAAQA,KAAK,MAAM,CAACK,CAAAA,MAAOA,IAAI,EAAE,KAAKQ;YAClD;QACJ,IACA;QAACZ;KAAQ;IAGb,OAAO,WAAP,GACI,oBAACV,MAAIA;QAAE,GAAGQ,KAAK;QAAE,cAAcI;OAC1BG,UACAG,UAAAA,WAAAA,GACD,oBAACK,YAAY,QAAQ;QAAC,OAAOH;OAAUb;AAGnD;AAEA,MAAMiB,WAAWC,gBAAgB,QAAQvB;AAEzC,MAAMwB,YAAOC,gBAAgBH,UAAU;IACnCI,KAAGA;AACP"}
+{"version":3,"file":"Tabs/Tabs.js","sources":["../../src/Tabs/Tabs.tsx"],"sourcesContent":["import React, { useMemo, useState } from \"react\";\nimport { Tabs as TabsPrimitive } from \"radix-ui\";\nimport { makeDecoratable, type VariantProps, withStaticProps } from \"~/utils.js\";\nimport type { ITabsContext, TabItem, TabProps, tabListVariants } from \"./components/index.js\";\nimport { Content, List, Tab, TabsContext, Trigger } from \"./components/index.js\";\n\nconst Root = TabsPrimitive.Root;\n\ninterface TabsProps extends Omit<TabsPrimitive.TabsProps, \"children\"> {\n    tabs: React.ReactElement<TabProps>[];\n    size?: VariantProps<typeof tabListVariants>[\"size\"];\n    spacing?: VariantProps<typeof tabListVariants>[\"spacing\"];\n    separator?: VariantProps<typeof tabListVariants>[\"separator\"];\n}\n\nconst DecoratableTabs = ({\n    defaultValue: initialValue,\n    size,\n    spacing,\n    separator,\n    tabs: tabComponents,\n    ...props\n}: TabsProps) => {\n    const [tabs, setTabs] = useState<TabItem[]>([]);\n\n    const defaultValue = useMemo(() => {\n        return (\n            initialValue ||\n            tabComponents.find(tab => !tab.props.disabled && tab.props.visible !== false)?.props\n                .value\n        );\n    }, [initialValue, tabComponents]);\n\n    const triggers = useMemo(\n        () => (\n            <List\n                key={tabs.map(tab => tab.id).join(\";\")}\n                size={size}\n                spacing={spacing}\n                separator={separator}\n            >\n                {tabs.map(tab => (\n                    <Trigger\n                        data-testid={tab[\"data-testid\"]}\n                        disabled={tab.disabled}\n                        icon={tab.icon}\n                        key={tab.id}\n                        size={size}\n                        text={tab.trigger}\n                        value={tab.value}\n                        visible={tab.visible}\n                    />\n                ))}\n            </List>\n        ),\n        [tabs, size, spacing]\n    );\n\n    const contents = useMemo(\n        () =>\n            tabs.map(tab => (\n                <Content\n                    key={tab.id}\n                    value={tab.value}\n                    content={tab.content}\n                    spacing={tab.spacing ?? spacing}\n                    className={tab.className}\n                />\n            )),\n        [tabs, spacing]\n    );\n\n    const context: ITabsContext = useMemo(\n        () => ({\n            addTab(props) {\n                setTabs(tabs => {\n                    const existingIndex = tabs.findIndex(tab => tab.value === props.value);\n                    if (existingIndex > -1) {\n                        return [\n                            ...tabs.slice(0, existingIndex),\n                            props,\n                            ...tabs.slice(existingIndex + 1)\n                        ];\n                    }\n                    return [...tabs, props];\n                });\n            },\n            removeTab(id) {\n                setTabs(tabs => tabs.filter(tab => tab.id !== id));\n            }\n        }),\n        [setTabs]\n    );\n\n    return (\n        <Root {...props} defaultValue={defaultValue}>\n            {triggers}\n            {contents}\n            <TabsContext.Provider value={context}>{tabComponents}</TabsContext.Provider>\n        </Root>\n    );\n};\n\nconst BaseTabs = makeDecoratable(\"Tabs\", DecoratableTabs);\n\nconst Tabs = withStaticProps(BaseTabs, {\n    Tab\n});\n\nexport { Tabs, type TabsProps };\n"],"names":["Root","TabsPrimitive","DecoratableTabs","initialValue","size","spacing","separator","tabComponents","props","tabs","setTabs","useState","defaultValue","useMemo","tab","triggers","List","Trigger","contents","Content","context","existingIndex","id","TabsContext","BaseTabs","makeDecoratable","Tabs","withStaticProps","Tab"],"mappings":";;;;AAMA,MAAMA,OAAOC,KAAAA,IAAkB;AAS/B,MAAMC,kBAAkB,CAAC,EACrB,cAAcC,YAAY,EAC1BC,IAAI,EACJC,OAAO,EACPC,SAAS,EACT,MAAMC,aAAa,EACnB,GAAGC,OACK;IACR,MAAM,CAACC,MAAMC,QAAQ,GAAGC,SAAoB,EAAE;IAE9C,MAAMC,eAAeC,QAAQ,IAErBV,gBACAI,cAAc,IAAI,CAACO,CAAAA,MAAO,CAACA,IAAI,KAAK,CAAC,QAAQ,IAAIA,AAAsB,UAAtBA,IAAI,KAAK,CAAC,OAAO,GAAa,MAC1E,OAEV;QAACX;QAAcI;KAAc;IAEhC,MAAMQ,WAAWF,QACb,kBACI,oBAACG,MAAIA;YACD,KAAKP,KAAK,GAAG,CAACK,CAAAA,MAAOA,IAAI,EAAE,EAAE,IAAI,CAAC;YAClC,MAAMV;YACN,SAASC;YACT,WAAWC;WAEVG,KAAK,GAAG,CAACK,CAAAA,MAAAA,WAAAA,GACN,oBAACG,SAAOA;gBACJ,eAAaH,GAAG,CAAC,cAAc;gBAC/B,UAAUA,IAAI,QAAQ;gBACtB,MAAMA,IAAI,IAAI;gBACd,KAAKA,IAAI,EAAE;gBACX,MAAMV;gBACN,MAAMU,IAAI,OAAO;gBACjB,OAAOA,IAAI,KAAK;gBAChB,SAASA,IAAI,OAAO;kBAKpC;QAACL;QAAML;QAAMC;KAAQ;IAGzB,MAAMa,WAAWL,QACb,IACIJ,KAAK,GAAG,CAACK,CAAAA,MAAAA,WAAAA,GACL,oBAACK,SAAOA;gBACJ,KAAKL,IAAI,EAAE;gBACX,OAAOA,IAAI,KAAK;gBAChB,SAASA,IAAI,OAAO;gBACpB,SAASA,IAAI,OAAO,IAAIT;gBACxB,WAAWS,IAAI,SAAS;iBAGpC;QAACL;QAAMJ;KAAQ;IAGnB,MAAMe,UAAwBP,QAC1B,IAAO;YACH,QAAOL,KAAK;gBACRE,QAAQD,CAAAA;oBACJ,MAAMY,gBAAgBZ,KAAK,SAAS,CAACK,CAAAA,MAAOA,IAAI,KAAK,KAAKN,MAAM,KAAK;oBACrE,IAAIa,gBAAgB,IAChB,OAAO;2BACAZ,KAAK,KAAK,CAAC,GAAGY;wBACjBb;2BACGC,KAAK,KAAK,CAACY,gBAAgB;qBACjC;oBAEL,OAAO;2BAAIZ;wBAAMD;qBAAM;gBAC3B;YACJ;YACA,WAAUc,EAAE;gBACRZ,QAAQD,CAAAA,OAAQA,KAAK,MAAM,CAACK,CAAAA,MAAOA,IAAI,EAAE,KAAKQ;YAClD;QACJ,IACA;QAACZ;KAAQ;IAGb,OAAO,WAAP,GACI,oBAACV,MAAIA;QAAE,GAAGQ,KAAK;QAAE,cAAcI;OAC1BG,UACAG,UAAAA,WAAAA,GACD,oBAACK,YAAY,QAAQ;QAAC,OAAOH;OAAUb;AAGnD;AAEA,MAAMiB,WAAWC,gBAAgB,QAAQvB;AAEzC,MAAMwB,YAAOC,gBAAgBH,UAAU;IACnCI,KAAGA;AACP"}

package/Tabs/Tabs.stories.d.ts

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

package/Tabs/Tabs.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs/Tabs.stories.js","sources":["../../src/Tabs/Tabs.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { ReactComponent as PersonIcon } from \"@webiny/icons/person.svg\";\nimport { ReactComponent as LockIcon } from \"@webiny/icons/lock.svg\";\nimport { Tabs } from \"./Tabs.js\";\n\nconst meta: Meta<typeof Tabs> = {\n    title: \"Components/Tabs\",\n    component: Tabs,\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Tabs>;\n\nexport const Default: Story = {\n    args: {\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Account content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum.\"\n                }\n            />,\n            <Tabs.Tab\n                key={\"password\"}\n                value={\"password\"}\n                trigger={\"Password\"}\n                content={\n                    \"Password content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. \"\n                }\n            />\n        ]\n    }\n};\n\nexport const SizeSmall: Story = {\n    args: {\n        ...Default.args,\n        size: \"sm\"\n    }\n};\n\nexport const SizeMedium: Story = {\n    args: {\n        ...Default.args,\n        size: \"md\"\n    }\n};\n\nexport const SizeLarge: Story = {\n    args: {\n        ...Default.args,\n        size: \"lg\"\n    }\n};\n\nexport const SizeExtraLarge: Story = {\n    args: {\n        ...Default.args,\n        size: \"xl\"\n    }\n};\n\nexport const SpacingExtraSmall: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"xs\"\n    }\n};\n\nexport const SpacingSmall: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"sm\"\n    }\n};\n\nexport const SpacingMedium: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"md\"\n    }\n};\n\nexport const SpacingLarge: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"lg\"\n    }\n};\n\nexport const SpacingExtraLarge: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"xl\"\n    }\n};\n\nexport const SpacingDoubleExtraLarge: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"xxl\"\n    }\n};\n\nexport const WithSeparator: Story = {\n    args: {\n        ...Default.args,\n        separator: true\n    }\n};\n\nexport const WithDefaultValue: Story = {\n    args: {\n        ...Default.args,\n        defaultValue: \"password\"\n    }\n};\n\nexport const WithControlledValue: Story = {\n    args: {\n        ...Default.args,\n        value: \"password\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <Tabs {...args} value={value} onValueChange={setValue} />;\n    }\n};\n\nexport const WithIcons: Story = {\n    args: {\n        ...Default.args,\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Account content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum.\"\n                }\n                icon={<PersonIcon />}\n            />,\n            <Tabs.Tab\n                key={\"password\"}\n                value={\"password\"}\n                trigger={\"Password\"}\n                content={\n                    \"Password content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. \"\n                }\n                icon={<LockIcon />}\n            />\n        ]\n    }\n};\n\nexport const WithDisabledTab: Story = {\n    args: {\n        ...Default.args,\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Account content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum.\"\n                }\n                disabled={true}\n            />,\n            <Tabs.Tab\n                key={\"password\"}\n                value={\"password\"}\n                trigger={\"Password\"}\n                content={\n                    \"Password content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. \"\n                }\n            />\n        ]\n    }\n};\n\nexport const WithHiddenTab: Story = {\n    args: {\n        ...Default.args,\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Account content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum.\"\n                }\n                visible={false}\n            />,\n            <Tabs.Tab\n                key={\"password\"}\n                value={\"password\"}\n                trigger={\"Password\"}\n                content={\n                    \"Password content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. \"\n                }\n            />\n        ]\n    }\n};\n\nexport const WithCustomTabSpacing: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"sm\",\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Tab with custom spacing XXL - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum.\"\n                }\n                spacing={\"xxl\"}\n            />,\n            <Tabs.Tab\n                key={\"password\"}\n                value={\"password\"}\n                trigger={\"Password\"}\n                content={\n                    \"Tab with inherited spacing - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. \"\n                }\n            />\n        ]\n    }\n};\n\n// Update the Documentation story to properly handle control changes\nexport const Documentation: Story = {\n    render: args => {\n        // Force re-render when args change by using a key\n        return <Tabs key={JSON.stringify(args)} {...args} />;\n    },\n    args: {\n        size: \"md\",\n        spacing: \"lg\",\n        separator: true,\n        defaultValue: \"account\",\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Account content - This tab contains account settings and personal information. Users can update their profile details, change email address, and manage notification preferences.\"\n                }\n            />,\n            <Tabs.Tab\n                key={\"security\"}\n                value={\"security\"}\n                trigger={\"Security\"}\n                content={\n                    \"Security content - This tab contains security settings. Users can change their password, enable two-factor authentication, and review recent account activity.\"\n                }\n            />,\n            <Tabs.Tab\n                key={\"preferences\"}\n                value={\"preferences\"}\n                trigger={\"Preferences\"}\n                content={\n                    \"Preferences content - This tab contains user preferences. Users can customize the interface, set language preferences, and configure other application settings.\"\n                }\n            />\n        ],\n        value: undefined\n    },\n    argTypes: {\n        size: {\n            description: \"Size of the tabs\",\n            control: \"select\",\n            options: [\"sm\", \"md\", \"lg\", \"xl\"],\n            defaultValue: \"md\"\n        },\n        spacing: {\n            description: \"Spacing around the tabs and content\",\n            control: \"select\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\", \"xl\", \"xxl\"],\n            defaultValue: \"lg\"\n        },\n        separator: {\n            description:\n                \"Whether to show a separator line below the tabs, by default it's `false`.\",\n            control: \"boolean\",\n            defaultValue: false\n        },\n        defaultValue: {\n            description: \"The value of the tab that should be active by default\",\n            control: \"text\"\n        },\n        value: {\n            description:\n                \"The controlled value of the active tab, please refer to the example code for details.\"\n        },\n        tabs: {\n            description: \"The tabs to render, please refer to the example code for details.\"\n        }\n    }\n};\n"],"names":["meta","Tabs","Default","SizeSmall","SizeMedium","SizeLarge","SizeExtraLarge","SpacingExtraSmall","SpacingSmall","SpacingMedium","SpacingLarge","SpacingExtraLarge","SpacingDoubleExtraLarge","WithSeparator","WithDefaultValue","WithControlledValue","args","value","setValue","useState","WithIcons","PersonIcon","LockIcon","WithDisabledTab","WithHiddenTab","WithCustomTabSpacing","Documentation","JSON","undefined"],"mappings":"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"}
+{"version":3,"file":"Tabs/Tabs.stories.js","sources":["../../src/Tabs/Tabs.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { ReactComponent as PersonIcon } from \"@webiny/icons/person.svg\";\nimport { ReactComponent as LockIcon } from \"@webiny/icons/lock.svg\";\nimport { Tabs } from \"./Tabs.js\";\n\nconst meta: Meta<typeof Tabs> = {\n    title: \"Components/Tabs\",\n    component: Tabs,\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Tabs>;\n\nexport const Default: Story = {\n    args: {\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Account content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum.\"\n                }\n            />,\n            <Tabs.Tab\n                key={\"password\"}\n                value={\"password\"}\n                trigger={\"Password\"}\n                content={\n                    \"Password content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. \"\n                }\n            />\n        ]\n    }\n};\n\nexport const SizeSmall: Story = {\n    args: {\n        ...Default.args,\n        size: \"sm\"\n    }\n};\n\nexport const SizeMedium: Story = {\n    args: {\n        ...Default.args,\n        size: \"md\"\n    }\n};\n\nexport const SizeLarge: Story = {\n    args: {\n        ...Default.args,\n        size: \"lg\"\n    }\n};\n\nexport const SizeExtraLarge: Story = {\n    args: {\n        ...Default.args,\n        size: \"xl\"\n    }\n};\n\nexport const SpacingExtraSmall: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"xs\"\n    }\n};\n\nexport const SpacingSmall: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"sm\"\n    }\n};\n\nexport const SpacingMedium: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"md\"\n    }\n};\n\nexport const SpacingLarge: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"lg\"\n    }\n};\n\nexport const SpacingExtraLarge: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"xl\"\n    }\n};\n\nexport const SpacingDoubleExtraLarge: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"xxl\"\n    }\n};\n\nexport const WithSeparator: Story = {\n    args: {\n        ...Default.args,\n        separator: true\n    }\n};\n\nexport const WithDefaultValue: Story = {\n    args: {\n        ...Default.args,\n        defaultValue: \"password\"\n    }\n};\n\nexport const WithControlledValue: Story = {\n    args: {\n        ...Default.args,\n        value: \"password\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <Tabs {...args} value={value} onValueChange={setValue} />;\n    }\n};\n\nexport const WithIcons: Story = {\n    args: {\n        ...Default.args,\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Account content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum.\"\n                }\n                icon={<PersonIcon />}\n            />,\n            <Tabs.Tab\n                key={\"password\"}\n                value={\"password\"}\n                trigger={\"Password\"}\n                content={\n                    \"Password content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. \"\n                }\n                icon={<LockIcon />}\n            />\n        ]\n    }\n};\n\nexport const WithDisabledTab: Story = {\n    args: {\n        ...Default.args,\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Account content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum.\"\n                }\n                disabled={true}\n            />,\n            <Tabs.Tab\n                key={\"password\"}\n                value={\"password\"}\n                trigger={\"Password\"}\n                content={\n                    \"Password content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. \"\n                }\n            />\n        ]\n    }\n};\n\nexport const WithHiddenTab: Story = {\n    args: {\n        ...Default.args,\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Account content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum.\"\n                }\n                visible={false}\n            />,\n            <Tabs.Tab\n                key={\"password\"}\n                value={\"password\"}\n                trigger={\"Password\"}\n                content={\n                    \"Password content - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. \"\n                }\n            />\n        ]\n    }\n};\n\nexport const WithCustomTabSpacing: Story = {\n    args: {\n        ...Default.args,\n        spacing: \"sm\",\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Tab with custom spacing XXL - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum.\"\n                }\n                spacing={\"xxl\"}\n            />,\n            <Tabs.Tab\n                key={\"password\"}\n                value={\"password\"}\n                trigger={\"Password\"}\n                content={\n                    \"Tab with inherited spacing - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel libero nec libero lacinia fermentum. Nullam nec nunc nec libero lacinia fermentum. \"\n                }\n            />\n        ]\n    }\n};\n\n// Update the Documentation story to properly handle control changes\nexport const Documentation: Story = {\n    render: args => {\n        // Force re-render when args change by using a key\n        return <Tabs key={JSON.stringify(args)} {...args} />;\n    },\n    args: {\n        size: \"md\",\n        spacing: \"lg\",\n        separator: true,\n        defaultValue: \"account\",\n        tabs: [\n            <Tabs.Tab\n                key={\"account\"}\n                value={\"account\"}\n                trigger={\"Account\"}\n                content={\n                    \"Account content - This tab contains account settings and personal information. Users can update their profile details, change email address, and manage notification preferences.\"\n                }\n            />,\n            <Tabs.Tab\n                key={\"security\"}\n                value={\"security\"}\n                trigger={\"Security\"}\n                content={\n                    \"Security content - This tab contains security settings. Users can change their password, enable two-factor authentication, and review recent account activity.\"\n                }\n            />,\n            <Tabs.Tab\n                key={\"preferences\"}\n                value={\"preferences\"}\n                trigger={\"Preferences\"}\n                content={\n                    \"Preferences content - This tab contains user preferences. Users can customize the interface, set language preferences, and configure other application settings.\"\n                }\n            />\n        ],\n        value: undefined\n    },\n    argTypes: {\n        size: {\n            description: \"Size of the tabs\",\n            control: \"select\",\n            options: [\"sm\", \"md\", \"lg\", \"xl\"],\n            defaultValue: \"md\"\n        },\n        spacing: {\n            description: \"Spacing around the tabs and content\",\n            control: \"select\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\", \"xl\", \"xxl\"],\n            defaultValue: \"lg\"\n        },\n        separator: {\n            description:\n                \"Whether to show a separator line below the tabs, by default it's `false`.\",\n            control: \"boolean\",\n            defaultValue: false\n        },\n        defaultValue: {\n            description: \"The value of the tab that should be active by default\",\n            control: \"text\"\n        },\n        value: {\n            description:\n                \"The controlled value of the active tab, please refer to the example code for details.\"\n        },\n        tabs: {\n            description: \"The tabs to render, please refer to the example code for details.\"\n        }\n    }\n};\n"],"names":["meta","Tabs","Default","SizeSmall","SizeMedium","SizeLarge","SizeExtraLarge","SpacingExtraSmall","SpacingSmall","SpacingMedium","SpacingLarge","SpacingExtraLarge","SpacingDoubleExtraLarge","WithSeparator","WithDefaultValue","WithControlledValue","args","value","setValue","useState","WithIcons","PersonIcon","LockIcon","WithDisabledTab","WithHiddenTab","WithCustomTabSpacing","Documentation","JSON","undefined"],"mappings":"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"}

package/Tag/Tag.stories.d.ts

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

package/Tag/Tag.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag/Tag.stories.js","sources":["../../src/Tag/Tag.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Tag } from \"./Tag.js\";\nimport { ReactComponent as InfoIcon } from \"@webiny/icons/info.svg\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\n\nconst meta: Meta<typeof Tag> = {\n    title: \"Components/Tag\",\n    component: Tag,\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Tag>;\n\nexport const Default: Story = {\n    args: {\n        content: \"Label\",\n        icon: <InfoIcon />\n    }\n};\n\nexport const WithOnClickCallback: Story = {\n    args: {\n        ...Default.args,\n        onClick: evt => {\n            console.log(\"onClick\", evt);\n        }\n    }\n};\n\nexport const WithOnDismissCallback: Story = {\n    args: {\n        ...Default.args,\n        onDismiss: evt => {\n            console.log(\"onDismiss\", evt);\n        }\n    }\n};\n\nexport const WithCustomDismissIconElement: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        dismissIconElement: <AddIcon />,\n        dismissIconLabel: \"Custom dismiss label\"\n    }\n};\n\nexport const NeutralBase: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base\"\n    }\n};\n\nexport const NeutralBaseDisabled: Story = {\n    args: {\n        ...NeutralBase.args,\n        disabled: true\n    }\n};\n\nexport const NeutralBaseOutline: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base-outline\"\n    }\n};\n\nexport const NeutralBaseOutlineDisabled: Story = {\n    args: {\n        ...NeutralBaseOutline.args,\n        disabled: true\n    }\n};\n\nexport const NeutralLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-light\"\n    }\n};\n\nexport const NeutralLightDisabled: Story = {\n    args: {\n        ...NeutralLight.args,\n        disabled: true\n    }\n};\n\nexport const NeutralMuted: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-muted\"\n    }\n};\n\nexport const NeutralMutedDisabled: Story = {\n    args: {\n        ...NeutralMuted.args,\n        disabled: true\n    }\n};\n\nexport const NeutralStrong: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-strong\"\n    }\n};\n\nexport const NeutralStrongDisabled: Story = {\n    args: {\n        ...NeutralStrong.args,\n        disabled: true\n    }\n};\n\nexport const NeutralXStrong: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-xstrong\"\n    }\n};\n\nexport const NeutralXStrongDisabled: Story = {\n    args: {\n        ...NeutralXStrong.args,\n        disabled: true\n    }\n};\n\nexport const NeutralDark: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-dark\"\n    }\n};\n\nexport const NeutralDarkDisabled: Story = {\n    args: {\n        ...NeutralDark.args,\n        disabled: true\n    }\n};\n\nexport const Accent: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"accent\"\n    }\n};\n\nexport const AccentDisabled: Story = {\n    args: {\n        ...Accent.args,\n        disabled: true\n    }\n};\n\nexport const AccentLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"accent-light\"\n    }\n};\n\nexport const AccentLightDisabled: Story = {\n    args: {\n        ...AccentLight.args,\n        disabled: true\n    }\n};\n\nexport const Success: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"success\"\n    }\n};\n\nexport const SuccessDisabled: Story = {\n    args: {\n        ...Success.args,\n        disabled: true\n    }\n};\n\nexport const SuccessLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"success-light\"\n    }\n};\n\nexport const SuccessLightDisabled: Story = {\n    args: {\n        ...SuccessLight.args,\n        disabled: true\n    }\n};\n\nexport const Warning: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"warning\"\n    }\n};\n\nexport const WarningDisabled: Story = {\n    args: {\n        ...Warning.args,\n        disabled: true\n    }\n};\n\nexport const Destructive: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"destructive\"\n    }\n};\n\nexport const DestructiveDisabled: Story = {\n    args: {\n        ...Destructive.args,\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: WithOnDismissCallback.args,\n    render: args => {\n        return (\n            <div className={\"flex gap-sm\"}>\n                <Tag {...args} content={\"Neutral base\"} variant={\"neutral-base\"} />\n                <Tag {...args} content={\"Neutral base outline\"} variant={\"neutral-base-outline\"} />\n                <Tag {...args} content={\"Neutral light\"} variant={\"neutral-light\"} />\n                <Tag {...args} content={\"Neutral muted\"} variant={\"neutral-muted\"} />\n                <Tag {...args} content={\"Neutral strong\"} variant={\"neutral-strong\"} />\n                <Tag {...args} content={\"Neutral xstrong\"} variant={\"neutral-xstrong\"} />\n                <Tag {...args} content={\"Neutral dark\"} variant={\"neutral-dark\"} />\n                <Tag {...args} content={\"Success\"} variant={\"success\"} />\n                <Tag {...args} content={\"Success light\"} variant={\"success-light\"} />\n                <Tag {...args} content={\"Warning\"} variant={\"warning\"} />\n                <Tag {...args} content={\"Destructive\"} variant={\"destructive\"} />\n                <Tag {...args} content={\"Accent\"} variant={\"accent\"} />\n                <Tag {...args} content={\"Accent light\"} variant={\"accent-light\"} />\n            </div>\n        );\n    }\n};\n\nexport const WithSwatchColor: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base-outline\",\n        content: <>An alert that can be closed and also has action button.</>,\n        swatchColor: \"#FF708F\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        content: \"Label\",\n        variant: \"neutral-base\",\n        disabled: false,\n        onDismiss: undefined,\n        dismissIconElement: undefined,\n        dismissIconLabel: undefined\n    },\n    argTypes: {\n        content: {\n            description: \"The content of the tag. Please refer to the example code for details.\",\n            control: \"text\"\n        },\n        variant: {\n            description: \"The color variant of the tag.\",\n            control: \"select\",\n            options: [\n                \"neutral-base\",\n                \"neutral-base-outline\",\n                \"neutral-light\",\n                \"neutral-muted\",\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"success\",\n                \"success-light\",\n                \"warning\",\n                \"destructive\",\n                \"accent\",\n                \"accent-light\"\n            ]\n        },\n        disabled: {\n            description: \"Whether the tag is disabled.\",\n            control: \"boolean\"\n        },\n        onDismiss: {\n            description:\n                \"Callback function when the tag is dismissed. Please refer to the 'Dismissible Tag' example code for details.\"\n        },\n        dismissIconElement: {\n            description:\n                \"Custom dismiss icon element. Please refer to the 'Custom Dismiss Icon' example code for details.\"\n        },\n        dismissIconLabel: {\n            description:\n                \"Custom dismiss icon label. Please refer to the 'Custom Dismiss Icon' example code for details.\"\n        }\n    }\n};\n"],"names":["meta","Tag","Default","InfoIcon","WithOnClickCallback","evt","console","WithOnDismissCallback","WithCustomDismissIconElement","AddIcon","NeutralBase","NeutralBaseDisabled","NeutralBaseOutline","NeutralBaseOutlineDisabled","NeutralLight","NeutralLightDisabled","NeutralMuted","NeutralMutedDisabled","NeutralStrong","NeutralStrongDisabled","NeutralXStrong","NeutralXStrongDisabled","NeutralDark","NeutralDarkDisabled","Accent","AccentDisabled","AccentLight","AccentLightDisabled","Success","SuccessDisabled","SuccessLight","SuccessLightDisabled","Warning","WarningDisabled","Destructive","DestructiveDisabled","FullExample","args","WithSwatchColor","Documentation","undefined"],"mappings":"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"}
+{"version":3,"file":"Tag/Tag.stories.js","sources":["../../src/Tag/Tag.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Tag } from \"./Tag.js\";\nimport { ReactComponent as InfoIcon } from \"@webiny/icons/info.svg\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\n\nconst meta: Meta<typeof Tag> = {\n    title: \"Components/Tag\",\n    component: Tag,\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Tag>;\n\nexport const Default: Story = {\n    args: {\n        content: \"Label\",\n        icon: <InfoIcon />\n    }\n};\n\nexport const WithOnClickCallback: Story = {\n    args: {\n        ...Default.args,\n        onClick: evt => {\n            console.log(\"onClick\", evt);\n        }\n    }\n};\n\nexport const WithOnDismissCallback: Story = {\n    args: {\n        ...Default.args,\n        onDismiss: evt => {\n            console.log(\"onDismiss\", evt);\n        }\n    }\n};\n\nexport const WithCustomDismissIconElement: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        dismissIconElement: <AddIcon />,\n        dismissIconLabel: \"Custom dismiss label\"\n    }\n};\n\nexport const NeutralBase: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base\"\n    }\n};\n\nexport const NeutralBaseDisabled: Story = {\n    args: {\n        ...NeutralBase.args,\n        disabled: true\n    }\n};\n\nexport const NeutralBaseOutline: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base-outline\"\n    }\n};\n\nexport const NeutralBaseOutlineDisabled: Story = {\n    args: {\n        ...NeutralBaseOutline.args,\n        disabled: true\n    }\n};\n\nexport const NeutralLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-light\"\n    }\n};\n\nexport const NeutralLightDisabled: Story = {\n    args: {\n        ...NeutralLight.args,\n        disabled: true\n    }\n};\n\nexport const NeutralMuted: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-muted\"\n    }\n};\n\nexport const NeutralMutedDisabled: Story = {\n    args: {\n        ...NeutralMuted.args,\n        disabled: true\n    }\n};\n\nexport const NeutralStrong: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-strong\"\n    }\n};\n\nexport const NeutralStrongDisabled: Story = {\n    args: {\n        ...NeutralStrong.args,\n        disabled: true\n    }\n};\n\nexport const NeutralXStrong: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-xstrong\"\n    }\n};\n\nexport const NeutralXStrongDisabled: Story = {\n    args: {\n        ...NeutralXStrong.args,\n        disabled: true\n    }\n};\n\nexport const NeutralDark: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-dark\"\n    }\n};\n\nexport const NeutralDarkDisabled: Story = {\n    args: {\n        ...NeutralDark.args,\n        disabled: true\n    }\n};\n\nexport const Accent: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"accent\"\n    }\n};\n\nexport const AccentDisabled: Story = {\n    args: {\n        ...Accent.args,\n        disabled: true\n    }\n};\n\nexport const AccentLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"accent-light\"\n    }\n};\n\nexport const AccentLightDisabled: Story = {\n    args: {\n        ...AccentLight.args,\n        disabled: true\n    }\n};\n\nexport const Success: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"success\"\n    }\n};\n\nexport const SuccessDisabled: Story = {\n    args: {\n        ...Success.args,\n        disabled: true\n    }\n};\n\nexport const SuccessLight: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"success-light\"\n    }\n};\n\nexport const SuccessLightDisabled: Story = {\n    args: {\n        ...SuccessLight.args,\n        disabled: true\n    }\n};\n\nexport const Warning: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"warning\"\n    }\n};\n\nexport const WarningDisabled: Story = {\n    args: {\n        ...Warning.args,\n        disabled: true\n    }\n};\n\nexport const Destructive: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"destructive\"\n    }\n};\n\nexport const DestructiveDisabled: Story = {\n    args: {\n        ...Destructive.args,\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: WithOnDismissCallback.args,\n    render: args => {\n        return (\n            <div className={\"flex gap-sm\"}>\n                <Tag {...args} content={\"Neutral base\"} variant={\"neutral-base\"} />\n                <Tag {...args} content={\"Neutral base outline\"} variant={\"neutral-base-outline\"} />\n                <Tag {...args} content={\"Neutral light\"} variant={\"neutral-light\"} />\n                <Tag {...args} content={\"Neutral muted\"} variant={\"neutral-muted\"} />\n                <Tag {...args} content={\"Neutral strong\"} variant={\"neutral-strong\"} />\n                <Tag {...args} content={\"Neutral xstrong\"} variant={\"neutral-xstrong\"} />\n                <Tag {...args} content={\"Neutral dark\"} variant={\"neutral-dark\"} />\n                <Tag {...args} content={\"Success\"} variant={\"success\"} />\n                <Tag {...args} content={\"Success light\"} variant={\"success-light\"} />\n                <Tag {...args} content={\"Warning\"} variant={\"warning\"} />\n                <Tag {...args} content={\"Destructive\"} variant={\"destructive\"} />\n                <Tag {...args} content={\"Accent\"} variant={\"accent\"} />\n                <Tag {...args} content={\"Accent light\"} variant={\"accent-light\"} />\n            </div>\n        );\n    }\n};\n\nexport const WithSwatchColor: Story = {\n    args: {\n        ...WithOnDismissCallback.args,\n        variant: \"neutral-base-outline\",\n        content: <>An alert that can be closed and also has action button.</>,\n        swatchColor: \"#FF708F\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        content: \"Label\",\n        variant: \"neutral-base\",\n        disabled: false,\n        onDismiss: undefined,\n        dismissIconElement: undefined,\n        dismissIconLabel: undefined\n    },\n    argTypes: {\n        content: {\n            description: \"The content of the tag. Please refer to the example code for details.\",\n            control: \"text\"\n        },\n        variant: {\n            description: \"The color variant of the tag.\",\n            control: \"select\",\n            options: [\n                \"neutral-base\",\n                \"neutral-base-outline\",\n                \"neutral-light\",\n                \"neutral-muted\",\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"success\",\n                \"success-light\",\n                \"warning\",\n                \"destructive\",\n                \"accent\",\n                \"accent-light\"\n            ]\n        },\n        disabled: {\n            description: \"Whether the tag is disabled.\",\n            control: \"boolean\"\n        },\n        onDismiss: {\n            description:\n                \"Callback function when the tag is dismissed. Please refer to the 'Dismissible Tag' example code for details.\"\n        },\n        dismissIconElement: {\n            description:\n                \"Custom dismiss icon element. Please refer to the 'Custom Dismiss Icon' example code for details.\"\n        },\n        dismissIconLabel: {\n            description:\n                \"Custom dismiss icon label. Please refer to the 'Custom Dismiss Icon' example code for details.\"\n        }\n    }\n};\n"],"names":["meta","Tag","Default","InfoIcon","WithOnClickCallback","evt","console","WithOnDismissCallback","WithCustomDismissIconElement","AddIcon","NeutralBase","NeutralBaseDisabled","NeutralBaseOutline","NeutralBaseOutlineDisabled","NeutralLight","NeutralLightDisabled","NeutralMuted","NeutralMutedDisabled","NeutralStrong","NeutralStrongDisabled","NeutralXStrong","NeutralXStrongDisabled","NeutralDark","NeutralDarkDisabled","Accent","AccentDisabled","AccentLight","AccentLightDisabled","Success","SuccessDisabled","SuccessLight","SuccessLightDisabled","Warning","WarningDisabled","Destructive","DestructiveDisabled","FullExample","args","WithSwatchColor","Documentation","undefined"],"mappings":"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"}

package/Tags/Tags.stories.d.ts

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

package/Tags/Tags.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tags/Tags.stories.js","sources":["../../src/Tags/Tags.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Tags } from \"./Tags.js\";\n\nconst meta: Meta<typeof Tags> = {\n    title: \"Components/Form/Tags\",\n    component: Tags,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        onValueInput: { action: \"onValueInput\" },\n        onValueAdd: { action: \"onValueAdd\" },\n        onValueRemove: { action: \"onValueRemove\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [values, setValues] = useState(args.value);\n        return <Tags {...args} value={values} onChange={setValues} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Tags>;\n\nexport const Default: Story = {};\n\nexport const WithLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\"\n    }\n};\n\nexport const WithRequiredLabel: 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"],"names":["meta","Tags","args","values","setValues","useState","Default","WithLabel","WithRequiredLabel","WithDescription","WithNotes","WithErrors","Disabled","FullExample"],"mappings":";;AAIA,MAAMA,OAA0B;IAC5B,OAAO;IACP,WAAWC;IACX,UAAU;QACN,UAAU;YAAE,QAAQ;QAAW;QAC/B,cAAc;YAAE,QAAQ;QAAe;QACvC,YAAY;YAAE,QAAQ;QAAa;QACnC,eAAe;YAAE,QAAQ;QAAgB;QACzC,UAAU;YACN,SAAS;YACT,cAAc;QAClB;IACJ;IACA,YAAY;QACR,QAAQ;IACZ;IACA,QAAQC,CAAAA;QACJ,MAAM,CAACC,QAAQC,UAAU,GAAGC,SAASH,KAAK,KAAK;QAC/C,OAAO,WAAP,GAAO,oBAACD,MAAIA;YAAE,GAAGC,IAAI;YAAE,OAAOC;YAAQ,UAAUC;;IACpD;AACJ;AAEA,qBAAeJ;AAGR,MAAMM,UAAiB,CAAC;AAExB,MAAMC,YAAmB;IAC5B,MAAM;QACF,GAAGD,QAAQ,IAAI;QACf,OAAO;IACX;AACJ;AAEO,MAAME,oBAA2B;IACpC,MAAM;QACF,GAAGF,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMG,kBAAyB;IAClC,MAAM;QACF,GAAGH,QAAQ,IAAI;QACf,aAAa;IACjB;AACJ;AAEO,MAAMI,YAAmB;IAC5B,MAAM;QACF,GAAGJ,QAAQ,IAAI;QACf,MAAM;IACV;AACJ;AAEO,MAAMK,aAAoB;IAC7B,MAAM;QACF,GAAGL,QAAQ,IAAI;QACf,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMM,WAAkB;IAC3B,MAAM;QACF,GAAGN,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMO,cAAqB;IAC9B,MAAM;QACF,GAAGP,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;QACV,aAAa;QACb,MAAM;QACN,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ"}
+{"version":3,"file":"Tags/Tags.stories.js","sources":["../../src/Tags/Tags.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Tags } from \"./Tags.js\";\n\nconst meta: Meta<typeof Tags> = {\n    title: \"Components/Form/Tags\",\n    component: Tags,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        onValueInput: { action: \"onValueInput\" },\n        onValueAdd: { action: \"onValueAdd\" },\n        onValueRemove: { action: \"onValueRemove\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [values, setValues] = useState(args.value);\n        return <Tags {...args} value={values} onChange={setValues} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Tags>;\n\nexport const Default: Story = {};\n\nexport const WithLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\"\n    }\n};\n\nexport const WithRequiredLabel: 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"],"names":["meta","Tags","args","values","setValues","useState","Default","WithLabel","WithRequiredLabel","WithDescription","WithNotes","WithErrors","Disabled","FullExample"],"mappings":";;AAIA,MAAMA,OAA0B;IAC5B,OAAO;IACP,WAAWC;IACX,UAAU;QACN,UAAU;YAAE,QAAQ;QAAW;QAC/B,cAAc;YAAE,QAAQ;QAAe;QACvC,YAAY;YAAE,QAAQ;QAAa;QACnC,eAAe;YAAE,QAAQ;QAAgB;QACzC,UAAU;YACN,SAAS;YACT,cAAc;QAClB;IACJ;IACA,YAAY;QACR,QAAQ;IACZ;IACA,QAAQC,CAAAA;QACJ,MAAM,CAACC,QAAQC,UAAU,GAAGC,SAASH,KAAK,KAAK;QAC/C,OAAO,WAAP,GAAO,oBAACD,MAAIA;YAAE,GAAGC,IAAI;YAAE,OAAOC;YAAQ,UAAUC;;IACpD;AACJ;AAEA,qBAAeJ;AAGR,MAAMM,UAAiB,CAAC;AAExB,MAAMC,YAAmB;IAC5B,MAAM;QACF,GAAGD,QAAQ,IAAI;QACf,OAAO;IACX;AACJ;AAEO,MAAME,oBAA2B;IACpC,MAAM;QACF,GAAGF,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMG,kBAAyB;IAClC,MAAM;QACF,GAAGH,QAAQ,IAAI;QACf,aAAa;IACjB;AACJ;AAEO,MAAMI,YAAmB;IAC5B,MAAM;QACF,GAAGJ,QAAQ,IAAI;QACf,MAAM;IACV;AACJ;AAEO,MAAMK,aAAoB;IAC7B,MAAM;QACF,GAAGL,QAAQ,IAAI;QACf,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMM,WAAkB;IAC3B,MAAM;QACF,GAAGN,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMO,cAAqB;IAC9B,MAAM;QACF,GAAGP,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;QACV,aAAa;QACb,MAAM;QACN,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ"}

package/Tags/primitives/TagsPrimitive.stories.d.ts

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

package/Tags/primitives/TagsPrimitive.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tags/primitives/TagsPrimitive.stories.js","sources":["../../../src/Tags/primitives/TagsPrimitive.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { ReactComponent as TagIcon } from \"@webiny/icons/tag.svg\";\nimport { TagsPrimitive } from \"./TagsPrimitive.js\";\nimport { Button } from \"~/Button/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\n\nconst meta: Meta<typeof TagsPrimitive> = {\n    title: \"Components/Form Primitives/Tags\",\n    component: TagsPrimitive,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        onValueInput: { action: \"onValueInput\" },\n        onValueAdd: { action: \"onValueAdd\" },\n        onValueRemove: { action: \"onValueRemove\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => <TagsPrimitive {...args} />\n};\n\nexport default meta;\ntype Story = StoryObj<typeof TagsPrimitive>;\n\nexport const Default: Story = {};\n\nexport const MediumSize: Story = {\n    args: {\n        ...Default.args,\n        size: \"md\"\n    }\n};\n\nexport const LargeSize: Story = {\n    args: {\n        ...Default.args,\n        size: \"lg\"\n    }\n};\n\nexport const ExtraLargeSize: Story = {\n    args: {\n        ...Default.args,\n        size: \"xl\"\n    }\n};\n\nexport const PrimaryVariant: Story = {\n    args: {\n        ...Default.args,\n        variant: \"primary\"\n    }\n};\n\nexport const PrimaryVariantDisabled: Story = {\n    args: {\n        ...PrimaryVariant.args,\n        disabled: true\n    }\n};\n\nexport const PrimaryVariantInvalid: Story = {\n    args: {\n        ...PrimaryVariant.args,\n        invalid: true\n    }\n};\n\nexport const SecondaryVariant: Story = {\n    args: {\n        variant: \"secondary\",\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const SecondaryVariantDisabled: Story = {\n    args: {\n        ...SecondaryVariant.args,\n        disabled: true\n    }\n};\n\nexport const SecondaryVariantInvalid: Story = {\n    args: {\n        ...SecondaryVariant.args,\n        invalid: true\n    }\n};\n\nexport const GhostVariant: Story = {\n    args: {\n        variant: \"ghost\",\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const GhostVariantDisabled: Story = {\n    args: {\n        ...GhostVariant.args,\n        disabled: true\n    }\n};\n\nexport const GhostVariantInvalid: Story = {\n    args: {\n        ...GhostVariant.args,\n        invalid: true\n    }\n};\n\nexport const GhostNegativeVariant: Story = {\n    args: {\n        ...Default.args,\n        variant: \"ghost-negative\",\n        placeholder: \"Custom placeholder\"\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark text-neutral-light p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const GhostNegativeVariantDisabled: Story = {\n    args: {\n        ...GhostNegativeVariant.args,\n        disabled: true\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark text-neutral-light p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const GhostNegativeVariantInvalid: Story = {\n    args: {\n        ...GhostNegativeVariant.args,\n        invalid: true\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark text-neutral-light p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const WithCustomPlaceholder: Story = {\n    args: {\n        ...Default.args,\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const WithStartIcon: Story = {\n    args: {\n        ...Default.args,\n        startIcon: <Icon label={\"Tag\"} icon={<TagIcon />} />\n    }\n};\n\nexport const WithInitialValues: Story = {\n    args: {\n        ...Default.args,\n        value: [\"tag1\", \"tag2\", \"tag3\"]\n    }\n};\n\nexport const WithProtectedValues: Story = {\n    args: {\n        ...Default.args,\n        value: [\"tag1\", \"tag2\", \"tag3\", \"another-tag1\", \"another-tag2\"],\n        protectedValues: [\"tag1\", \"another-tag*\"]\n    }\n};\n\nexport const WithExternalValueControl: Story = {\n    args: {\n        ...Default.args,\n        value: [\"tag1\", \"tag2\", \"tag3\"]\n    },\n    render: args => {\n        const [value, setValue] = React.useState<string[]>(args.value || []);\n\n        return (\n            <div className={\"w-full\"}>\n                <TagsPrimitive {...args} value={value} onChange={setValue} />\n                <div className={\"mt-4 text-center\"}>\n                    <Button text={\"Reset\"} onClick={() => setValue(args.value || [])} />\n                </div>\n                <div className={\"mt-4 text-center\"}>\n                    Current selected values: {value?.join(\",\")}\n                </div>\n            </div>\n        );\n    }\n};\n"],"names":["meta","TagsPrimitive","args","Default","MediumSize","LargeSize","ExtraLargeSize","PrimaryVariant","PrimaryVariantDisabled","PrimaryVariantInvalid","SecondaryVariant","SecondaryVariantDisabled","SecondaryVariantInvalid","GhostVariant","GhostVariantDisabled","GhostVariantInvalid","GhostNegativeVariant","Story","GhostNegativeVariantDisabled","GhostNegativeVariantInvalid","WithCustomPlaceholder","WithStartIcon","Icon","TagIcon","WithInitialValues","WithProtectedValues","WithExternalValueControl","value","setValue","React","Button"],"mappings":"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"}
+{"version":3,"file":"Tags/primitives/TagsPrimitive.stories.js","sources":["../../../src/Tags/primitives/TagsPrimitive.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { ReactComponent as TagIcon } from \"@webiny/icons/tag.svg\";\nimport { TagsPrimitive } from \"./TagsPrimitive.js\";\nimport { Button } from \"~/Button/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\n\nconst meta: Meta<typeof TagsPrimitive> = {\n    title: \"Components/Form Primitives/Tags\",\n    component: TagsPrimitive,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        onValueInput: { action: \"onValueInput\" },\n        onValueAdd: { action: \"onValueAdd\" },\n        onValueRemove: { action: \"onValueRemove\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => <TagsPrimitive {...args} />\n};\n\nexport default meta;\ntype Story = StoryObj<typeof TagsPrimitive>;\n\nexport const Default: Story = {};\n\nexport const MediumSize: Story = {\n    args: {\n        ...Default.args,\n        size: \"md\"\n    }\n};\n\nexport const LargeSize: Story = {\n    args: {\n        ...Default.args,\n        size: \"lg\"\n    }\n};\n\nexport const ExtraLargeSize: Story = {\n    args: {\n        ...Default.args,\n        size: \"xl\"\n    }\n};\n\nexport const PrimaryVariant: Story = {\n    args: {\n        ...Default.args,\n        variant: \"primary\"\n    }\n};\n\nexport const PrimaryVariantDisabled: Story = {\n    args: {\n        ...PrimaryVariant.args,\n        disabled: true\n    }\n};\n\nexport const PrimaryVariantInvalid: Story = {\n    args: {\n        ...PrimaryVariant.args,\n        invalid: true\n    }\n};\n\nexport const SecondaryVariant: Story = {\n    args: {\n        variant: \"secondary\",\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const SecondaryVariantDisabled: Story = {\n    args: {\n        ...SecondaryVariant.args,\n        disabled: true\n    }\n};\n\nexport const SecondaryVariantInvalid: Story = {\n    args: {\n        ...SecondaryVariant.args,\n        invalid: true\n    }\n};\n\nexport const GhostVariant: Story = {\n    args: {\n        variant: \"ghost\",\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const GhostVariantDisabled: Story = {\n    args: {\n        ...GhostVariant.args,\n        disabled: true\n    }\n};\n\nexport const GhostVariantInvalid: Story = {\n    args: {\n        ...GhostVariant.args,\n        invalid: true\n    }\n};\n\nexport const GhostNegativeVariant: Story = {\n    args: {\n        ...Default.args,\n        variant: \"ghost-negative\",\n        placeholder: \"Custom placeholder\"\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark text-neutral-light p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const GhostNegativeVariantDisabled: Story = {\n    args: {\n        ...GhostNegativeVariant.args,\n        disabled: true\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark text-neutral-light p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const GhostNegativeVariantInvalid: Story = {\n    args: {\n        ...GhostNegativeVariant.args,\n        invalid: true\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark text-neutral-light p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const WithCustomPlaceholder: Story = {\n    args: {\n        ...Default.args,\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const WithStartIcon: Story = {\n    args: {\n        ...Default.args,\n        startIcon: <Icon label={\"Tag\"} icon={<TagIcon />} />\n    }\n};\n\nexport const WithInitialValues: Story = {\n    args: {\n        ...Default.args,\n        value: [\"tag1\", \"tag2\", \"tag3\"]\n    }\n};\n\nexport const WithProtectedValues: Story = {\n    args: {\n        ...Default.args,\n        value: [\"tag1\", \"tag2\", \"tag3\", \"another-tag1\", \"another-tag2\"],\n        protectedValues: [\"tag1\", \"another-tag*\"]\n    }\n};\n\nexport const WithExternalValueControl: Story = {\n    args: {\n        ...Default.args,\n        value: [\"tag1\", \"tag2\", \"tag3\"]\n    },\n    render: args => {\n        const [value, setValue] = React.useState<string[]>(args.value || []);\n\n        return (\n            <div className={\"w-full\"}>\n                <TagsPrimitive {...args} value={value} onChange={setValue} />\n                <div className={\"mt-4 text-center\"}>\n                    <Button text={\"Reset\"} onClick={() => setValue(args.value || [])} />\n                </div>\n                <div className={\"mt-4 text-center\"}>\n                    Current selected values: {value?.join(\",\")}\n                </div>\n            </div>\n        );\n    }\n};\n"],"names":["meta","TagsPrimitive","args","Default","MediumSize","LargeSize","ExtraLargeSize","PrimaryVariant","PrimaryVariantDisabled","PrimaryVariantInvalid","SecondaryVariant","SecondaryVariantDisabled","SecondaryVariantInvalid","GhostVariant","GhostVariantDisabled","GhostVariantInvalid","GhostNegativeVariant","Story","GhostNegativeVariantDisabled","GhostNegativeVariantInvalid","WithCustomPlaceholder","WithStartIcon","Icon","TagIcon","WithInitialValues","WithProtectedValues","WithExternalValueControl","value","setValue","React","Button"],"mappings":"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"}

package/Text/Text.stories.d.ts

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

package/Text/Text.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text/Text.stories.js","sources":["../../src/Text/Text.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react-webpack5\";\n\nimport { Text } from \"./Text.js\";\n\nconst meta: Meta<typeof Text> = {\n    title: \"Components/Text\",\n    component: Text,\n    argTypes: {\n        size: { control: \"select\", options: [\"sm\", \"md\", \"lg\", \"xl\"] }\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Text>;\n\nexport const TextXl: Story = {\n    args: {\n        size: \"xl\",\n        children:\n            \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempus tortor eu sapien interdum rhoncus.\"\n    }\n};\n\nexport const TextLg: Story = {\n    args: {\n        size: \"lg\",\n        children:\n            \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempus tortor eu sapien interdum rhoncus.\"\n    }\n};\n\nexport const TextMd: Story = {\n    args: {\n        size: \"md\",\n        children:\n            \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempus tortor eu sapien interdum rhoncus.\"\n    }\n};\n\nexport const TextSm: Story = {\n    args: {\n        size: \"sm\",\n        children:\n            \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempus tortor eu sapien interdum rhoncus.\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        size: \"md\",\n        children: \"Text component example\"\n    },\n    argTypes: {\n        size: {\n            description: \"The size of the text\",\n            control: \"select\",\n            options: [\"sm\", \"md\", \"lg\", \"xl\"]\n        },\n        children: {\n            description: \"The content of the text\",\n            control: \"text\"\n        }\n    }\n};\n"],"names":["meta","Text","TextXl","TextLg","TextMd","TextSm","Documentation"],"mappings":";AAIA,MAAMA,OAA0B;IAC5B,OAAO;IACP,WAAWC;IACX,UAAU;QACN,MAAM;YAAE,SAAS;YAAU,SAAS;gBAAC;gBAAM;gBAAM;gBAAM;aAAK;QAAC;IACjE;AACJ;AAEA,qBAAeD;AAGR,MAAME,SAAgB;IACzB,MAAM;QACF,MAAM;QACN,UACI;IACR;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,MAAM;QACN,UACI;IACR;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,MAAM;QACN,UACI;IACR;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,MAAM;QACN,UACI;IACR;AACJ;AAEO,MAAMC,gBAAuB;IAChC,MAAM;QACF,MAAM;QACN,UAAU;IACd;IACA,UAAU;QACN,MAAM;YACF,aAAa;YACb,SAAS;YACT,SAAS;gBAAC;gBAAM;gBAAM;gBAAM;aAAK;QACrC;QACA,UAAU;YACN,aAAa;YACb,SAAS;QACb;IACJ;AACJ"}
+{"version":3,"file":"Text/Text.stories.js","sources":["../../src/Text/Text.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\n\nimport { Text } from \"./Text.js\";\n\nconst meta: Meta<typeof Text> = {\n    title: \"Components/Text\",\n    component: Text,\n    argTypes: {\n        size: { control: \"select\", options: [\"sm\", \"md\", \"lg\", \"xl\"] }\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Text>;\n\nexport const TextXl: Story = {\n    args: {\n        size: \"xl\",\n        children:\n            \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempus tortor eu sapien interdum rhoncus.\"\n    }\n};\n\nexport const TextLg: Story = {\n    args: {\n        size: \"lg\",\n        children:\n            \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempus tortor eu sapien interdum rhoncus.\"\n    }\n};\n\nexport const TextMd: Story = {\n    args: {\n        size: \"md\",\n        children:\n            \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempus tortor eu sapien interdum rhoncus.\"\n    }\n};\n\nexport const TextSm: Story = {\n    args: {\n        size: \"sm\",\n        children:\n            \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tempus tortor eu sapien interdum rhoncus.\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        size: \"md\",\n        children: \"Text component example\"\n    },\n    argTypes: {\n        size: {\n            description: \"The size of the text\",\n            control: \"select\",\n            options: [\"sm\", \"md\", \"lg\", \"xl\"]\n        },\n        children: {\n            description: \"The content of the text\",\n            control: \"text\"\n        }\n    }\n};\n"],"names":["meta","Text","TextXl","TextLg","TextMd","TextSm","Documentation"],"mappings":";AAIA,MAAMA,OAA0B;IAC5B,OAAO;IACP,WAAWC;IACX,UAAU;QACN,MAAM;YAAE,SAAS;YAAU,SAAS;gBAAC;gBAAM;gBAAM;gBAAM;aAAK;QAAC;IACjE;AACJ;AAEA,qBAAeD;AAGR,MAAME,SAAgB;IACzB,MAAM;QACF,MAAM;QACN,UACI;IACR;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,MAAM;QACN,UACI;IACR;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,MAAM;QACN,UACI;IACR;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,MAAM;QACN,UACI;IACR;AACJ;AAEO,MAAMC,gBAAuB;IAChC,MAAM;QACF,MAAM;QACN,UAAU;IACd;IACA,UAAU;QACN,MAAM;YACF,aAAa;YACb,SAAS;YACT,SAAS;gBAAC;gBAAM;gBAAM;gBAAM;aAAK;QACrC;QACA,UAAU;YACN,aAAa;YACb,SAAS;QACb;IACJ;AACJ"}

package/Textarea/Textarea.stories.d.ts

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

package/Textarea/Textarea.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea/Textarea.stories.js","sources":["../../src/Textarea/Textarea.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Textarea } from \"~/Textarea/index.js\";\n\nconst meta: Meta<typeof Textarea> = {\n    title: \"Components/Form/Textarea\",\n    component: Textarea,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Textarea>;\n\nexport const Documentation: Story = {\n    render: args => {\n        const [value, setValue] = useState(\"\");\n\n        return <Textarea {...args} value={value} onChange={newValue => setValue(newValue)} />;\n    },\n    args: {\n        label: \"Message\",\n        description: \"Enter your feedback or message\",\n        note: \"Please be specific and provide relevant details\",\n        placeholder: \"Type your message here...\",\n        required: true,\n        disabled: false,\n        onChange: undefined,\n        validation: {\n            isValid: true,\n            message: \"\"\n        },\n        value: \"\",\n        validate: undefined\n    },\n    argTypes: {\n        size: {\n            description: \"Textarea field size\",\n            control: \"select\",\n            options: [\"md\", \"lg\", \"xl\"],\n            defaultValue: \"lg\"\n        },\n        variant: {\n            description: \"Textarea field style variant\",\n            control: \"select\",\n            options: [\"primary\", \"secondary\", \"ghost\", \"ghost-negative\"],\n            defaultValue: \"primary\"\n        },\n        label: {\n            description: \"Label text for the textarea\",\n            control: \"text\"\n        },\n        description: {\n            description: \"Additional description text below the textarea\",\n            control: \"text\"\n        },\n        note: {\n            description: \"Additional note text below the textarea\",\n            control: \"text\"\n        },\n        placeholder: {\n            description: \"Placeholder text shown when the textarea is empty\",\n            control: \"text\"\n        },\n        required: {\n            description: \"Makes the textarea required when set to true\",\n            control: \"boolean\"\n        },\n        disabled: {\n            description: \"Disables the textarea when set to true\",\n            control: \"boolean\"\n        },\n        validation: {\n            description: \"Object containing validation state and message\",\n            control: \"object\"\n        },\n        value: {\n            description: \"The current value of the textarea\",\n            control: \"text\"\n        },\n        onChange: {\n            description: \"Function called when the textarea value changes\"\n        },\n        validate: {\n            description:\n                \"Custom validation function, please refer to **With Validate Function** section below.\"\n        }\n    }\n};\n\nexport const Default: Story = {};\n\nexport const WithLabel: Story = {\n    args: {\n        label: \"Message\"\n    }\n};\n\nexport const WithLabelRequired: Story = {\n    args: {\n        ...Default.args,\n        label: \"Message\",\n        required: true\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: \"Enter your feedback or message in detail\"\n    }\n};\n\nexport const WithNotes: Story = {\n    args: {\n        ...Default.args,\n        note: \"All messages are reviewed within 24 hours\"\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: \"Message\",\n        disabled: true\n    }\n};\n\nexport const WithValidateFunction: Story = {\n    render: args => {\n        const [value, setValue] = useState(\"\");\n        const [validation, setValidation] = useState({ isValid: true, message: \"\" });\n\n        const validate = async () => {\n            if (!value.trim()) {\n                setValidation({ isValid: false, message: \"This field is required\" });\n            } else if (value.length < 10) {\n                setValidation({\n                    isValid: false,\n                    message: \"Message must be at least 10 characters long\"\n                });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        };\n\n        return (\n            <Textarea\n                {...args}\n                value={value}\n                onChange={newValue => setValue(newValue)}\n                validate={validate}\n                validation={validation}\n            />\n        );\n    },\n    args: {\n        ...Default.args,\n        label: \"Message\",\n        required: true,\n        description: \"Enter a message (minimum 10 characters)\"\n    }\n};\n\nexport const FullExample: Story = {\n    args: {\n        ...Default.args,\n        label: \"Message\",\n        required: true,\n        description: \"Provide the required information for processing your request.\",\n        note: \"Note: Ensure your message is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n"],"names":["meta","Textarea","Documentation","args","value","setValue","useState","newValue","undefined","Default","WithLabel","WithLabelRequired","WithDescription","WithNotes","WithErrors","Disabled","WithValidateFunction","validation","setValidation","validate","FullExample"],"mappings":"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"}
+{"version":3,"file":"Textarea/Textarea.stories.js","sources":["../../src/Textarea/Textarea.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Textarea } from \"~/Textarea/index.js\";\n\nconst meta: Meta<typeof Textarea> = {\n    title: \"Components/Form/Textarea\",\n    component: Textarea,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Textarea>;\n\nexport const Documentation: Story = {\n    render: args => {\n        const [value, setValue] = useState(\"\");\n\n        return <Textarea {...args} value={value} onChange={newValue => setValue(newValue)} />;\n    },\n    args: {\n        label: \"Message\",\n        description: \"Enter your feedback or message\",\n        note: \"Please be specific and provide relevant details\",\n        placeholder: \"Type your message here...\",\n        required: true,\n        disabled: false,\n        onChange: undefined,\n        validation: {\n            isValid: true,\n            message: \"\"\n        },\n        value: \"\",\n        validate: undefined\n    },\n    argTypes: {\n        size: {\n            description: \"Textarea field size\",\n            control: \"select\",\n            options: [\"md\", \"lg\", \"xl\"],\n            defaultValue: \"lg\"\n        },\n        variant: {\n            description: \"Textarea field style variant\",\n            control: \"select\",\n            options: [\"primary\", \"secondary\", \"ghost\", \"ghost-negative\"],\n            defaultValue: \"primary\"\n        },\n        label: {\n            description: \"Label text for the textarea\",\n            control: \"text\"\n        },\n        description: {\n            description: \"Additional description text below the textarea\",\n            control: \"text\"\n        },\n        note: {\n            description: \"Additional note text below the textarea\",\n            control: \"text\"\n        },\n        placeholder: {\n            description: \"Placeholder text shown when the textarea is empty\",\n            control: \"text\"\n        },\n        required: {\n            description: \"Makes the textarea required when set to true\",\n            control: \"boolean\"\n        },\n        disabled: {\n            description: \"Disables the textarea when set to true\",\n            control: \"boolean\"\n        },\n        validation: {\n            description: \"Object containing validation state and message\",\n            control: \"object\"\n        },\n        value: {\n            description: \"The current value of the textarea\",\n            control: \"text\"\n        },\n        onChange: {\n            description: \"Function called when the textarea value changes\"\n        },\n        validate: {\n            description:\n                \"Custom validation function, please refer to **With Validate Function** section below.\"\n        }\n    }\n};\n\nexport const Default: Story = {};\n\nexport const WithLabel: Story = {\n    args: {\n        label: \"Message\"\n    }\n};\n\nexport const WithLabelRequired: Story = {\n    args: {\n        ...Default.args,\n        label: \"Message\",\n        required: true\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: \"Enter your feedback or message in detail\"\n    }\n};\n\nexport const WithNotes: Story = {\n    args: {\n        ...Default.args,\n        note: \"All messages are reviewed within 24 hours\"\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: \"Message\",\n        disabled: true\n    }\n};\n\nexport const WithValidateFunction: Story = {\n    render: args => {\n        const [value, setValue] = useState(\"\");\n        const [validation, setValidation] = useState({ isValid: true, message: \"\" });\n\n        const validate = async () => {\n            if (!value.trim()) {\n                setValidation({ isValid: false, message: \"This field is required\" });\n            } else if (value.length < 10) {\n                setValidation({\n                    isValid: false,\n                    message: \"Message must be at least 10 characters long\"\n                });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        };\n\n        return (\n            <Textarea\n                {...args}\n                value={value}\n                onChange={newValue => setValue(newValue)}\n                validate={validate}\n                validation={validation}\n            />\n        );\n    },\n    args: {\n        ...Default.args,\n        label: \"Message\",\n        required: true,\n        description: \"Enter a message (minimum 10 characters)\"\n    }\n};\n\nexport const FullExample: Story = {\n    args: {\n        ...Default.args,\n        label: \"Message\",\n        required: true,\n        description: \"Provide the required information for processing your request.\",\n        note: \"Note: Ensure your message is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n"],"names":["meta","Textarea","Documentation","args","value","setValue","useState","newValue","undefined","Default","WithLabel","WithLabelRequired","WithDescription","WithNotes","WithErrors","Disabled","WithValidateFunction","validation","setValidation","validate","FullExample"],"mappings":"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"}

package/Textarea/TextareaPrimitive.stories.d.ts

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

package/Textarea/TextareaPrimitive.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea/TextareaPrimitive.stories.js","sources":["../../src/Textarea/TextareaPrimitive.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { TextareaPrimitive } from \"./TextareaPrimitive.js\";\n\nconst meta: Meta<typeof TextareaPrimitive> = {\n    title: \"Components/Form Primitives/Textarea\",\n    component: TextareaPrimitive,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        onEnter: { action: \"onEnter\" },\n        onKeyDown: { action: \"onKeyDown\" },\n        rows: {\n            control: {\n                type: \"number\"\n            }\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof TextareaPrimitive>;\n\nexport const Default: Story = {};\n\nexport const MediumSize: Story = {\n    args: {\n        placeholder: \"Custom placeholder\",\n        size: \"md\"\n    }\n};\n\nexport const LargeSize: Story = {\n    args: {\n        placeholder: \"Custom placeholder\",\n        size: \"lg\"\n    }\n};\n\nexport const ExtraLargeSize: Story = {\n    args: {\n        placeholder: \"Custom placeholder\",\n        size: \"xl\"\n    }\n};\n\nexport const PrimaryVariant: Story = {\n    args: {\n        variant: \"primary\",\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const PrimaryVariantDisabled: Story = {\n    args: {\n        ...PrimaryVariant.args,\n        disabled: true\n    }\n};\n\nexport const PrimaryVariantInvalid: Story = {\n    args: {\n        ...PrimaryVariant.args,\n        invalid: true\n    }\n};\n\nexport const SecondaryVariant: Story = {\n    args: {\n        variant: \"secondary\",\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const SecondaryVariantDisabled: Story = {\n    args: {\n        ...SecondaryVariant.args,\n        disabled: true\n    }\n};\n\nexport const SecondaryVariantInvalid: Story = {\n    args: {\n        ...SecondaryVariant.args,\n        invalid: true\n    }\n};\n\nexport const GhostVariant: Story = {\n    args: {\n        variant: \"ghost\",\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const GhostVariantDisabled: Story = {\n    args: {\n        ...GhostVariant.args,\n        disabled: true\n    }\n};\n\nexport const GhostVariantInvalid: Story = {\n    args: {\n        ...GhostVariant.args,\n        invalid: true\n    }\n};\n\nexport const GhostNegativeVariant: Story = {\n    args: {\n        variant: \"ghost-negative\",\n        placeholder: \"Custom placeholder\"\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const GhostNegativeVariantDisabled: Story = {\n    args: {\n        ...GhostNegativeVariant.args,\n        disabled: true\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const GhostNegativeVariantInvalid: Story = {\n    args: {\n        ...GhostNegativeVariant.args,\n        invalid: true\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const WithForwardEventOnChange: Story = {\n    args: {\n        ...Default.args,\n        forwardEventOnChange: true\n    }\n};\n"],"names":["meta","TextareaPrimitive","Default","MediumSize","LargeSize","ExtraLargeSize","PrimaryVariant","PrimaryVariantDisabled","PrimaryVariantInvalid","SecondaryVariant","SecondaryVariantDisabled","SecondaryVariantInvalid","GhostVariant","GhostVariantDisabled","GhostVariantInvalid","GhostNegativeVariant","Story","GhostNegativeVariantDisabled","GhostNegativeVariantInvalid","WithForwardEventOnChange"],"mappings":";;AAIA,MAAMA,OAAuC;IACzC,OAAO;IACP,WAAWC;IACX,UAAU;QACN,UAAU;YAAE,QAAQ;QAAW;QAC/B,SAAS;YAAE,QAAQ;QAAU;QAC7B,WAAW;YAAE,QAAQ;QAAY;QACjC,MAAM;YACF,SAAS;gBACL,MAAM;YACV;QACJ;IACJ;IACA,YAAY;QACR,QAAQ;IACZ;AACJ;AAEA,kCAAeD;AAGR,MAAME,UAAiB,CAAC;AAExB,MAAMC,aAAoB;IAC7B,MAAM;QACF,aAAa;QACb,MAAM;IACV;AACJ;AAEO,MAAMC,YAAmB;IAC5B,MAAM;QACF,aAAa;QACb,MAAM;IACV;AACJ;AAEO,MAAMC,iBAAwB;IACjC,MAAM;QACF,aAAa;QACb,MAAM;IACV;AACJ;AAEO,MAAMC,iBAAwB;IACjC,MAAM;QACF,SAAS;QACT,aAAa;IACjB;AACJ;AAEO,MAAMC,yBAAgC;IACzC,MAAM;QACF,GAAGD,eAAe,IAAI;QACtB,UAAU;IACd;AACJ;AAEO,MAAME,wBAA+B;IACxC,MAAM;QACF,GAAGF,eAAe,IAAI;QACtB,SAAS;IACb;AACJ;AAEO,MAAMG,mBAA0B;IACnC,MAAM;QACF,SAAS;QACT,aAAa;IACjB;AACJ;AAEO,MAAMC,2BAAkC;IAC3C,MAAM;QACF,GAAGD,iBAAiB,IAAI;QACxB,UAAU;IACd;AACJ;AAEO,MAAME,0BAAiC;IAC1C,MAAM;QACF,GAAGF,iBAAiB,IAAI;QACxB,SAAS;IACb;AACJ;AAEO,MAAMG,eAAsB;IAC/B,MAAM;QACF,SAAS;QACT,aAAa;IACjB;AACJ;AAEO,MAAMC,uBAA8B;IACvC,MAAM;QACF,GAAGD,aAAa,IAAI;QACpB,UAAU;IACd;AACJ;AAEO,MAAME,sBAA6B;IACtC,MAAM;QACF,GAAGF,aAAa,IAAI;QACpB,SAAS;IACb;AACJ;AAEO,MAAMG,uBAA8B;IACvC,MAAM;QACF,SAAS;QACT,aAAa;IACjB;IACA,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAAC;gBAAI,WAAU;6BACX,oBAACA,OAAAA;KAGZ;AACL;AAEO,MAAMC,+BAAsC;IAC/C,MAAM;QACF,GAAGF,qBAAqB,IAAI;QAC5B,UAAU;IACd;IACA,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAAC;gBAAI,WAAU;6BACX,oBAACA,OAAAA;KAGZ;AACL;AAEO,MAAME,8BAAqC;IAC9C,MAAM;QACF,GAAGH,qBAAqB,IAAI;QAC5B,SAAS;IACb;IACA,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAAC;gBAAI,WAAU;6BACX,oBAACA,OAAAA;KAGZ;AACL;AAEO,MAAMG,2BAAkC;IAC3C,MAAM;QACF,GAAGjB,QAAQ,IAAI;QACf,sBAAsB;IAC1B;AACJ"}
+{"version":3,"file":"Textarea/TextareaPrimitive.stories.js","sources":["../../src/Textarea/TextareaPrimitive.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { TextareaPrimitive } from \"./TextareaPrimitive.js\";\n\nconst meta: Meta<typeof TextareaPrimitive> = {\n    title: \"Components/Form Primitives/Textarea\",\n    component: TextareaPrimitive,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        onEnter: { action: \"onEnter\" },\n        onKeyDown: { action: \"onKeyDown\" },\n        rows: {\n            control: {\n                type: \"number\"\n            }\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof TextareaPrimitive>;\n\nexport const Default: Story = {};\n\nexport const MediumSize: Story = {\n    args: {\n        placeholder: \"Custom placeholder\",\n        size: \"md\"\n    }\n};\n\nexport const LargeSize: Story = {\n    args: {\n        placeholder: \"Custom placeholder\",\n        size: \"lg\"\n    }\n};\n\nexport const ExtraLargeSize: Story = {\n    args: {\n        placeholder: \"Custom placeholder\",\n        size: \"xl\"\n    }\n};\n\nexport const PrimaryVariant: Story = {\n    args: {\n        variant: \"primary\",\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const PrimaryVariantDisabled: Story = {\n    args: {\n        ...PrimaryVariant.args,\n        disabled: true\n    }\n};\n\nexport const PrimaryVariantInvalid: Story = {\n    args: {\n        ...PrimaryVariant.args,\n        invalid: true\n    }\n};\n\nexport const SecondaryVariant: Story = {\n    args: {\n        variant: \"secondary\",\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const SecondaryVariantDisabled: Story = {\n    args: {\n        ...SecondaryVariant.args,\n        disabled: true\n    }\n};\n\nexport const SecondaryVariantInvalid: Story = {\n    args: {\n        ...SecondaryVariant.args,\n        invalid: true\n    }\n};\n\nexport const GhostVariant: Story = {\n    args: {\n        variant: \"ghost\",\n        placeholder: \"Custom placeholder\"\n    }\n};\n\nexport const GhostVariantDisabled: Story = {\n    args: {\n        ...GhostVariant.args,\n        disabled: true\n    }\n};\n\nexport const GhostVariantInvalid: Story = {\n    args: {\n        ...GhostVariant.args,\n        invalid: true\n    }\n};\n\nexport const GhostNegativeVariant: Story = {\n    args: {\n        variant: \"ghost-negative\",\n        placeholder: \"Custom placeholder\"\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const GhostNegativeVariantDisabled: Story = {\n    args: {\n        ...GhostNegativeVariant.args,\n        disabled: true\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const GhostNegativeVariantInvalid: Story = {\n    args: {\n        ...GhostNegativeVariant.args,\n        invalid: true\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-neutral-dark p-xl\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const WithForwardEventOnChange: Story = {\n    args: {\n        ...Default.args,\n        forwardEventOnChange: true\n    }\n};\n"],"names":["meta","TextareaPrimitive","Default","MediumSize","LargeSize","ExtraLargeSize","PrimaryVariant","PrimaryVariantDisabled","PrimaryVariantInvalid","SecondaryVariant","SecondaryVariantDisabled","SecondaryVariantInvalid","GhostVariant","GhostVariantDisabled","GhostVariantInvalid","GhostNegativeVariant","Story","GhostNegativeVariantDisabled","GhostNegativeVariantInvalid","WithForwardEventOnChange"],"mappings":";;AAIA,MAAMA,OAAuC;IACzC,OAAO;IACP,WAAWC;IACX,UAAU;QACN,UAAU;YAAE,QAAQ;QAAW;QAC/B,SAAS;YAAE,QAAQ;QAAU;QAC7B,WAAW;YAAE,QAAQ;QAAY;QACjC,MAAM;YACF,SAAS;gBACL,MAAM;YACV;QACJ;IACJ;IACA,YAAY;QACR,QAAQ;IACZ;AACJ;AAEA,kCAAeD;AAGR,MAAME,UAAiB,CAAC;AAExB,MAAMC,aAAoB;IAC7B,MAAM;QACF,aAAa;QACb,MAAM;IACV;AACJ;AAEO,MAAMC,YAAmB;IAC5B,MAAM;QACF,aAAa;QACb,MAAM;IACV;AACJ;AAEO,MAAMC,iBAAwB;IACjC,MAAM;QACF,aAAa;QACb,MAAM;IACV;AACJ;AAEO,MAAMC,iBAAwB;IACjC,MAAM;QACF,SAAS;QACT,aAAa;IACjB;AACJ;AAEO,MAAMC,yBAAgC;IACzC,MAAM;QACF,GAAGD,eAAe,IAAI;QACtB,UAAU;IACd;AACJ;AAEO,MAAME,wBAA+B;IACxC,MAAM;QACF,GAAGF,eAAe,IAAI;QACtB,SAAS;IACb;AACJ;AAEO,MAAMG,mBAA0B;IACnC,MAAM;QACF,SAAS;QACT,aAAa;IACjB;AACJ;AAEO,MAAMC,2BAAkC;IAC3C,MAAM;QACF,GAAGD,iBAAiB,IAAI;QACxB,UAAU;IACd;AACJ;AAEO,MAAME,0BAAiC;IAC1C,MAAM;QACF,GAAGF,iBAAiB,IAAI;QACxB,SAAS;IACb;AACJ;AAEO,MAAMG,eAAsB;IAC/B,MAAM;QACF,SAAS;QACT,aAAa;IACjB;AACJ;AAEO,MAAMC,uBAA8B;IACvC,MAAM;QACF,GAAGD,aAAa,IAAI;QACpB,UAAU;IACd;AACJ;AAEO,MAAME,sBAA6B;IACtC,MAAM;QACF,GAAGF,aAAa,IAAI;QACpB,SAAS;IACb;AACJ;AAEO,MAAMG,uBAA8B;IACvC,MAAM;QACF,SAAS;QACT,aAAa;IACjB;IACA,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAAC;gBAAI,WAAU;6BACX,oBAACA,OAAAA;KAGZ;AACL;AAEO,MAAMC,+BAAsC;IAC/C,MAAM;QACF,GAAGF,qBAAqB,IAAI;QAC5B,UAAU;IACd;IACA,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAAC;gBAAI,WAAU;6BACX,oBAACA,OAAAA;KAGZ;AACL;AAEO,MAAME,8BAAqC;IAC9C,MAAM;QACF,GAAGH,qBAAqB,IAAI;QAC5B,SAAS;IACb;IACA,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAAC;gBAAI,WAAU;6BACX,oBAACA,OAAAA;KAGZ;AACL;AAEO,MAAMG,2BAAkC;IAC3C,MAAM;QACF,GAAGjB,QAAQ,IAAI;QACf,sBAAsB;IAC1B;AACJ"}

package/TimeAgo/TimeAgo.stories.d.ts

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

package/TimeAgo/TimeAgo.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeAgo/TimeAgo.stories.js","sources":["../../src/TimeAgo/TimeAgo.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { TimeAgo } from \"./TimeAgo.js\";\n\nconst meta: Meta<typeof TimeAgo> = {\n    title: \"Components/TimeAgo\",\n    component: TimeAgo\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof TimeAgo>;\n\nexport const JustNow: Story = {\n    args: {\n        datetime: new Date()\n    }\n};\n\nexport const SecondsAgo: Story = {\n    name: \"Seconds ago\",\n    args: {\n        datetime: new Date(Date.now() - 45 * 1000)\n    }\n};\n\nexport const MinutesAgo: Story = {\n    name: \"Minutes ago\",\n    args: {\n        datetime: new Date(Date.now() - 15 * 60 * 1000)\n    }\n};\n\nexport const HoursAgo: Story = {\n    name: \"Hours ago\",\n    args: {\n        datetime: new Date(Date.now() - 3 * 60 * 60 * 1000)\n    }\n};\n\nexport const DaysAgo: Story = {\n    name: \"Days ago\",\n    args: {\n        datetime: new Date(Date.now() - 5 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const WeeksAgo: Story = {\n    name: \"Weeks ago\",\n    args: {\n        datetime: new Date(Date.now() - 3 * 7 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const MonthsAgo: Story = {\n    name: \"Months ago\",\n    args: {\n        datetime: new Date(Date.now() - 4 * 30 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const YearsAgo: Story = {\n    name: \"Years ago\",\n    args: {\n        datetime: new Date(Date.now() - 2 * 365 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const ISOString: Story = {\n    name: \"From ISO string\",\n    args: {\n        datetime: \"2024-01-15T12:00:00Z\"\n    }\n};\n\nexport const NotLive: Story = {\n    name: \"Live updates disabled\",\n    args: {\n        datetime: new Date(),\n        live: false\n    }\n};\n"],"names":["meta","TimeAgo","JustNow","Date","SecondsAgo","MinutesAgo","HoursAgo","DaysAgo","WeeksAgo","MonthsAgo","YearsAgo","ISOString","NotLive"],"mappings":";;AAIA,MAAMA,OAA6B;IAC/B,OAAO;IACP,WAAWC;AACf;AAEA,wBAAeD;AAIR,MAAME,UAAiB;IAC1B,MAAM;QACF,UAAU,IAAIC;IAClB;AACJ;AAEO,MAAMC,aAAoB;IAC7B,MAAM;IACN,MAAM;QACF,UAAU,IAAID,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAME,aAAoB;IAC7B,MAAM;IACN,MAAM;QACF,UAAU,IAAIF,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMG,WAAkB;IAC3B,MAAM;IACN,MAAM;QACF,UAAU,IAAIH,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMI,UAAiB;IAC1B,MAAM;IACN,MAAM;QACF,UAAU,IAAIJ,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMK,WAAkB;IAC3B,MAAM;IACN,MAAM;QACF,UAAU,IAAIL,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMM,YAAmB;IAC5B,MAAM;IACN,MAAM;QACF,UAAU,IAAIN,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMO,WAAkB;IAC3B,MAAM;IACN,MAAM;QACF,UAAU,IAAIP,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMQ,YAAmB;IAC5B,MAAM;IACN,MAAM;QACF,UAAU;IACd;AACJ;AAEO,MAAMC,UAAiB;IAC1B,MAAM;IACN,MAAM;QACF,UAAU,IAAIT;QACd,MAAM;IACV;AACJ"}
+{"version":3,"file":"TimeAgo/TimeAgo.stories.js","sources":["../../src/TimeAgo/TimeAgo.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { TimeAgo } from \"./TimeAgo.js\";\n\nconst meta: Meta<typeof TimeAgo> = {\n    title: \"Components/TimeAgo\",\n    component: TimeAgo\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof TimeAgo>;\n\nexport const JustNow: Story = {\n    args: {\n        datetime: new Date()\n    }\n};\n\nexport const SecondsAgo: Story = {\n    name: \"Seconds ago\",\n    args: {\n        datetime: new Date(Date.now() - 45 * 1000)\n    }\n};\n\nexport const MinutesAgo: Story = {\n    name: \"Minutes ago\",\n    args: {\n        datetime: new Date(Date.now() - 15 * 60 * 1000)\n    }\n};\n\nexport const HoursAgo: Story = {\n    name: \"Hours ago\",\n    args: {\n        datetime: new Date(Date.now() - 3 * 60 * 60 * 1000)\n    }\n};\n\nexport const DaysAgo: Story = {\n    name: \"Days ago\",\n    args: {\n        datetime: new Date(Date.now() - 5 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const WeeksAgo: Story = {\n    name: \"Weeks ago\",\n    args: {\n        datetime: new Date(Date.now() - 3 * 7 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const MonthsAgo: Story = {\n    name: \"Months ago\",\n    args: {\n        datetime: new Date(Date.now() - 4 * 30 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const YearsAgo: Story = {\n    name: \"Years ago\",\n    args: {\n        datetime: new Date(Date.now() - 2 * 365 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const ISOString: Story = {\n    name: \"From ISO string\",\n    args: {\n        datetime: \"2024-01-15T12:00:00Z\"\n    }\n};\n\nexport const NotLive: Story = {\n    name: \"Live updates disabled\",\n    args: {\n        datetime: new Date(),\n        live: false\n    }\n};\n"],"names":["meta","TimeAgo","JustNow","Date","SecondsAgo","MinutesAgo","HoursAgo","DaysAgo","WeeksAgo","MonthsAgo","YearsAgo","ISOString","NotLive"],"mappings":";;AAIA,MAAMA,OAA6B;IAC/B,OAAO;IACP,WAAWC;AACf;AAEA,wBAAeD;AAIR,MAAME,UAAiB;IAC1B,MAAM;QACF,UAAU,IAAIC;IAClB;AACJ;AAEO,MAAMC,aAAoB;IAC7B,MAAM;IACN,MAAM;QACF,UAAU,IAAID,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAME,aAAoB;IAC7B,MAAM;IACN,MAAM;QACF,UAAU,IAAIF,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMG,WAAkB;IAC3B,MAAM;IACN,MAAM;QACF,UAAU,IAAIH,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMI,UAAiB;IAC1B,MAAM;IACN,MAAM;QACF,UAAU,IAAIJ,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMK,WAAkB;IAC3B,MAAM;IACN,MAAM;QACF,UAAU,IAAIL,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMM,YAAmB;IAC5B,MAAM;IACN,MAAM;QACF,UAAU,IAAIN,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMO,WAAkB;IAC3B,MAAM;IACN,MAAM;QACF,UAAU,IAAIP,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMQ,YAAmB;IAC5B,MAAM;IACN,MAAM;QACF,UAAU;IACd;AACJ;AAEO,MAAMC,UAAiB;IAC1B,MAAM;IACN,MAAM;QACF,UAAU,IAAIT;QACd,MAAM;IACV;AACJ"}

package/Toast/useToast.stories.d.ts

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

package/Toast/useToast.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast/useToast.stories.js","sources":["../../src/Toast/useToast.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Toast } from \"./Toast.js\";\nimport { useToast, type ShowToastParams } from \"./useToast.js\";\nimport { Button } from \"~/Button/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\n\nconst ToastComponent = (props: ShowToastParams) => {\n    const [lastToast, setLastToast] = useState<string | number>(\"\");\n    const { showToast, hideToast, hideAllToasts } = useToast();\n    return (\n        <>\n            <Button\n                text={\"Show Toast\"}\n                onClick={() => {\n                    const toast = showToast(props);\n                    setLastToast(toast);\n                }}\n            />\n            <Button text={\"Hide latest toast\"} onClick={() => hideToast(lastToast)} />\n            <Button text={\"Hide all toasts\"} onClick={() => hideAllToasts()} />\n        </>\n    );\n};\n\nconst meta: Meta<ShowToastParams> = {\n    title: \"Components/Toast\",\n    component: ToastComponent,\n    parameters: {\n        layout: \"fullscreen\"\n    },\n    argTypes: {\n        variant: { control: \"select\", options: [\"default\", \"subtle\"] }\n    },\n    decorators: [\n        Story => (\n            <div className=\"w-full h-64 flex justify-center items-center gap-sm\">\n                <Story />\n                <Toast.Provider />\n            </div>\n        )\n    ]\n};\n\nexport default meta;\n\ntype Story = StoryObj<ShowToastParams>;\n\nexport const Default: Story = {\n    args: {\n        title: \"New entry created\"\n    }\n};\n\nexport const SubtleVariant: Story = {\n    args: {\n        ...Default.args,\n        variant: \"subtle\"\n    }\n};\n\nexport const WithTitleComponent: Story = {\n    args: {\n        title: <Toast.Title text={\"New entry created\"} />\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: 'Entry \"Article One\" has been successfully created'\n    }\n};\n\nexport const WithDescriptionComponent: Story = {\n    args: {\n        ...Default.args,\n        description: (\n            <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n        )\n    }\n};\n\nexport const WithActions: Story = {\n    args: {\n        ...Default.args,\n        actions: (\n            <Toast.Actions>\n                <Button\n                    key={\"action-1\"}\n                    text={\"Do the action\"}\n                    onClick={() => console.log(\"doTheAction\")}\n                />\n                <Button\n                    key={\"action-2\"}\n                    text={\"Dismiss\"}\n                    onClick={() => console.log(\"dismiss\")}\n                    variant={\"secondary\"}\n                />\n            </Toast.Actions>\n        )\n    }\n};\n\nexport const WithDescriptionAndActions: Story = {\n    args: {\n        ...Default.args,\n        description: (\n            <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n        ),\n        actions: (\n            <Toast.Actions>\n                <Button\n                    key={\"action-1\"}\n                    text={\"Do the action\"}\n                    onClick={() => console.log(\"doTheAction\")}\n                />\n                <Button\n                    key={\"action-2\"}\n                    text={\"Dismiss\"}\n                    onClick={() => console.log(\"dismiss\")}\n                    variant={\"secondary\"}\n                />\n            </Toast.Actions>\n        )\n    }\n};\n\nexport const WithCustomIcon: Story = {\n    args: {\n        ...Default.args,\n        icon: <Icon icon={<SettingsIcon />} label={\"Settings\"} />\n    }\n};\n\nexport const WithInfiniteDuration: Story = {\n    args: {\n        ...Default.args,\n        duration: Infinity\n    }\n};\n\nexport const NotDismissible: Story = {\n    args: {\n        ...Default.args,\n        dismissible: false\n    }\n};\n\nexport const withCustomPosition: Story = {\n    args: {\n        ...Default.args,\n        position: \"bottom-right\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        title: \"New entry created\",\n        description: \"Entry has been successfully created\",\n        variant: \"default\",\n        position: \"top-right\",\n        duration: 6000,\n        dismissible: true,\n        actions: undefined,\n        icon: undefined\n    },\n    argTypes: {\n        title: {\n            description: \"Please refer to the 'With Title Component' example below for details.\"\n        },\n        description: {\n            description:\n                \"Please refer to the 'With Description' and 'With Description Component' examples below for details.\"\n        },\n        variant: {\n            description: \"Variant of the toast.\"\n        },\n        actions: {\n            description: \"Please refer to the 'With Actions' example below for details.\"\n        },\n        icon: {\n            description: \"Please refer to the 'With Custom Icon' example below for details.\"\n        },\n        duration: {\n            description:\n                \"Duration in milliseconds before the toast auto-dismisses. Please refer to the 'With Infinite Duration' example below for details.\",\n            control: \"number\"\n        },\n        dismissible: {\n            description: \"Please refer to the 'Not Dismissible' example below for details.\"\n        },\n        position: {\n            description: \"Please refer to the 'With Custom Position' example below for details.\",\n            control: \"select\",\n            options: [\n                \"top-left\",\n                \"top-right\",\n                \"bottom-left\",\n                \"bottom-right\",\n                \"top-center\",\n                \"bottom-center\"\n            ]\n        }\n    }\n};\n"],"names":["ToastComponent","props","lastToast","setLastToast","useState","showToast","hideToast","hideAllToasts","useToast","Button","toast","meta","Story","Toast","Default","SubtleVariant","WithTitleComponent","WithDescription","WithDescriptionComponent","WithActions","console","WithDescriptionAndActions","WithCustomIcon","Icon","SettingsIcon","WithInfiniteDuration","Infinity","NotDismissible","withCustomPosition","Documentation","undefined"],"mappings":"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"}
+{"version":3,"file":"Toast/useToast.stories.js","sources":["../../src/Toast/useToast.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Toast } from \"./Toast.js\";\nimport { useToast, type ShowToastParams } from \"./useToast.js\";\nimport { Button } from \"~/Button/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\n\nconst ToastComponent = (props: ShowToastParams) => {\n    const [lastToast, setLastToast] = useState<string | number>(\"\");\n    const { showToast, hideToast, hideAllToasts } = useToast();\n    return (\n        <>\n            <Button\n                text={\"Show Toast\"}\n                onClick={() => {\n                    const toast = showToast(props);\n                    setLastToast(toast);\n                }}\n            />\n            <Button text={\"Hide latest toast\"} onClick={() => hideToast(lastToast)} />\n            <Button text={\"Hide all toasts\"} onClick={() => hideAllToasts()} />\n        </>\n    );\n};\n\nconst meta: Meta<ShowToastParams> = {\n    title: \"Components/Toast\",\n    component: ToastComponent,\n    parameters: {\n        layout: \"fullscreen\"\n    },\n    argTypes: {\n        variant: { control: \"select\", options: [\"default\", \"subtle\"] }\n    },\n    decorators: [\n        Story => (\n            <div className=\"w-full h-64 flex justify-center items-center gap-sm\">\n                <Story />\n                <Toast.Provider />\n            </div>\n        )\n    ]\n};\n\nexport default meta;\n\ntype Story = StoryObj<ShowToastParams>;\n\nexport const Default: Story = {\n    args: {\n        title: \"New entry created\"\n    }\n};\n\nexport const SubtleVariant: Story = {\n    args: {\n        ...Default.args,\n        variant: \"subtle\"\n    }\n};\n\nexport const WithTitleComponent: Story = {\n    args: {\n        title: <Toast.Title text={\"New entry created\"} />\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: 'Entry \"Article One\" has been successfully created'\n    }\n};\n\nexport const WithDescriptionComponent: Story = {\n    args: {\n        ...Default.args,\n        description: (\n            <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n        )\n    }\n};\n\nexport const WithActions: Story = {\n    args: {\n        ...Default.args,\n        actions: (\n            <Toast.Actions>\n                <Button\n                    key={\"action-1\"}\n                    text={\"Do the action\"}\n                    onClick={() => console.log(\"doTheAction\")}\n                />\n                <Button\n                    key={\"action-2\"}\n                    text={\"Dismiss\"}\n                    onClick={() => console.log(\"dismiss\")}\n                    variant={\"secondary\"}\n                />\n            </Toast.Actions>\n        )\n    }\n};\n\nexport const WithDescriptionAndActions: Story = {\n    args: {\n        ...Default.args,\n        description: (\n            <Toast.Description text={'Entry \"Article One\" has been successfully created'} />\n        ),\n        actions: (\n            <Toast.Actions>\n                <Button\n                    key={\"action-1\"}\n                    text={\"Do the action\"}\n                    onClick={() => console.log(\"doTheAction\")}\n                />\n                <Button\n                    key={\"action-2\"}\n                    text={\"Dismiss\"}\n                    onClick={() => console.log(\"dismiss\")}\n                    variant={\"secondary\"}\n                />\n            </Toast.Actions>\n        )\n    }\n};\n\nexport const WithCustomIcon: Story = {\n    args: {\n        ...Default.args,\n        icon: <Icon icon={<SettingsIcon />} label={\"Settings\"} />\n    }\n};\n\nexport const WithInfiniteDuration: Story = {\n    args: {\n        ...Default.args,\n        duration: Infinity\n    }\n};\n\nexport const NotDismissible: Story = {\n    args: {\n        ...Default.args,\n        dismissible: false\n    }\n};\n\nexport const withCustomPosition: Story = {\n    args: {\n        ...Default.args,\n        position: \"bottom-right\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        title: \"New entry created\",\n        description: \"Entry has been successfully created\",\n        variant: \"default\",\n        position: \"top-right\",\n        duration: 6000,\n        dismissible: true,\n        actions: undefined,\n        icon: undefined\n    },\n    argTypes: {\n        title: {\n            description: \"Please refer to the 'With Title Component' example below for details.\"\n        },\n        description: {\n            description:\n                \"Please refer to the 'With Description' and 'With Description Component' examples below for details.\"\n        },\n        variant: {\n            description: \"Variant of the toast.\"\n        },\n        actions: {\n            description: \"Please refer to the 'With Actions' example below for details.\"\n        },\n        icon: {\n            description: \"Please refer to the 'With Custom Icon' example below for details.\"\n        },\n        duration: {\n            description:\n                \"Duration in milliseconds before the toast auto-dismisses. Please refer to the 'With Infinite Duration' example below for details.\",\n            control: \"number\"\n        },\n        dismissible: {\n            description: \"Please refer to the 'Not Dismissible' example below for details.\"\n        },\n        position: {\n            description: \"Please refer to the 'With Custom Position' example below for details.\",\n            control: \"select\",\n            options: [\n                \"top-left\",\n                \"top-right\",\n                \"bottom-left\",\n                \"bottom-right\",\n                \"top-center\",\n                \"bottom-center\"\n            ]\n        }\n    }\n};\n"],"names":["ToastComponent","props","lastToast","setLastToast","useState","showToast","hideToast","hideAllToasts","useToast","Button","toast","meta","Story","Toast","Default","SubtleVariant","WithTitleComponent","WithDescription","WithDescriptionComponent","WithActions","console","WithDescriptionAndActions","WithCustomIcon","Icon","SettingsIcon","WithInfiniteDuration","Infinity","NotDismissible","withCustomPosition","Documentation","undefined"],"mappings":"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"}

package/Toggle/Toggle.stories.d.ts

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