@webiny/admin-ui 6.3.0-beta.4 → 6.4.0-beta.0

package/Scrollbar/Scrollbar.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Scrollbars","Scrollbar","props","createElement"],"sources":["Scrollbar.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    type ScrollbarProps as ReactCustomScrollbarProps,\n    Scrollbars\n} from \"react-custom-scrollbars\";\n\ninterface ScrollbarProps extends ReactCustomScrollbarProps {\n    style?: React.CSSProperties;\n    [key: string]: any;\n}\n\nconst Scrollbar = (props: ScrollbarProps) => {\n    return <Scrollbars {...props} />;\n};\n\nexport { Scrollbar, type ScrollbarProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAEIC,UAAU,QACP,yBAAyB;AAOhC,MAAMC,SAAS,GAAIC,KAAqB,IAAK;EACzC,oBAAOH,KAAA,CAAAI,aAAA,CAACH,UAAU,EAAKE,KAAQ,CAAC;AACpC,CAAC;AAED,SAASD,SAAS","ignoreList":[]}
+{"version":3,"file":"Scrollbar/Scrollbar.js","sources":["../../src/Scrollbar/Scrollbar.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    type ScrollbarProps as ReactCustomScrollbarProps,\n    Scrollbars\n} from \"react-custom-scrollbars\";\n\ninterface ScrollbarProps extends ReactCustomScrollbarProps {\n    style?: React.CSSProperties;\n    [key: string]: any;\n}\n\nconst Scrollbar = (props: ScrollbarProps) => {\n    return <Scrollbars {...props} />;\n};\n\nexport { Scrollbar, type ScrollbarProps };\n"],"names":["Scrollbar","props","Scrollbars"],"mappings":";;AAWA,MAAMA,YAAY,CAACC,QACR,WAAP,GAAO,oBAACC,YAAeD"}

package/Scrollbar/index.js

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

package/SegmentedControl/SegmentedControl.js

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

package/SegmentedControl/SegmentedControl.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","makeDecoratable","SegmentedControlPrimitive","FormComponentDescription","FormComponentErrorMessage","FormComponentLabel","FormComponentNote","DecoratableSegmentedControl","label","description","note","hint","required","disabled","validation","props","isValid","validationIsValid","message","validationMessage","invalid","createElement","className","text","Object","assign","SegmentedControl"],"sources":["SegmentedControl.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { makeDecoratable } from \"~/utils.js\";\nimport type { SegmentedControlPrimitiveProps } from \"./primitives/index.js\";\nimport { SegmentedControlPrimitive } from \"./primitives/index.js\";\nimport type { FormComponentProps } from \"~/FormComponent/index.js\";\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentLabel,\n    FormComponentNote\n} from \"~/FormComponent/index.js\";\n\ntype SegmentedControlProps = SegmentedControlPrimitiveProps & FormComponentProps;\n\nconst DecoratableSegmentedControl = ({\n    label,\n    description,\n    note,\n    hint,\n    required,\n    disabled,\n    validation,\n    ...props\n}: SegmentedControlProps) => {\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    return (\n        <div className=\"w-full\">\n            <FormComponentLabel\n                text={label}\n                hint={hint}\n                required={required}\n                disabled={disabled}\n                invalid={invalid}\n            />\n            <FormComponentDescription\n                text={description}\n                disabled={disabled}\n                className=\"mb-xs-plus\"\n            />\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={disabled}\n                className=\"mt-none mb-xs-plus\"\n            />\n            <SegmentedControlPrimitive {...props} disabled={disabled} />\n            <FormComponentNote text={note} disabled={disabled} />\n        </div>\n    );\n};\n\nconst SegmentedControl = makeDecoratable(\"SegmentedControl\", DecoratableSegmentedControl);\n\nexport { SegmentedControl, type SegmentedControlProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,eAAe;AAExB,SAASC,yBAAyB;AAElC,SACIC,wBAAwB,EACxBC,yBAAyB,EACzBC,kBAAkB,EAClBC,iBAAiB;AAKrB,MAAMC,2BAA2B,GAAGA,CAAC;EACjCC,KAAK;EACLC,WAAW;EACXC,IAAI;EACJC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,UAAU;EACV,GAAGC;AACgB,CAAC,KAAK;EACzB,MAAM;IAAEC,OAAO,EAAEC,iBAAiB;IAAEC,OAAO,EAAEC;EAAkB,CAAC,GAAGL,UAAU,IAAI,CAAC,CAAC;EACnF,MAAMM,OAAO,GAAGpB,OAAO,CAAC,MAAMiB,iBAAiB,KAAK,KAAK,EAAE,CAACA,iBAAiB,CAAC,CAAC;EAE/E,oBACIlB,KAAA,CAAAsB,aAAA;IAAKC,SAAS,EAAC;EAAQ,gBACnBvB,KAAA,CAAAsB,aAAA,CAAChB,kBAAkB;IACfkB,IAAI,EAAEf,KAAM;IACZG,IAAI,EAAEA,IAAK;IACXC,QAAQ,EAAEA,QAAS;IACnBC,QAAQ,EAAEA,QAAS;IACnBO,OAAO,EAAEA;EAAQ,CACpB,CAAC,eACFrB,KAAA,CAAAsB,aAAA,CAAClB,wBAAwB;IACrBoB,IAAI,EAAEd,WAAY;IAClBI,QAAQ,EAAEA,QAAS;IACnBS,SAAS,EAAC;EAAY,CACzB,CAAC,eACFvB,KAAA,CAAAsB,aAAA,CAACjB,yBAAyB;IACtBmB,IAAI,EAAEJ,iBAAkB;IACxBC,OAAO,EAAEA,OAAQ;IACjBP,QAAQ,EAAEA,QAAS;IACnBS,SAAS,EAAC;EAAoB,CACjC,CAAC,eACFvB,KAAA,CAAAsB,aAAA,CAACnB,yBAAyB,EAAAsB,MAAA,CAAAC,MAAA,KAAKV,KAAK;IAAEF,QAAQ,EAAEA;EAAS,EAAE,CAAC,eAC5Dd,KAAA,CAAAsB,aAAA,CAACf,iBAAiB;IAACiB,IAAI,EAAEb,IAAK;IAACG,QAAQ,EAAEA;EAAS,CAAE,CACnD,CAAC;AAEd,CAAC;AAED,MAAMa,gBAAgB,GAAGzB,eAAe,CAAC,kBAAkB,EAAEM,2BAA2B,CAAC;AAEzF,SAASmB,gBAAgB","ignoreList":[]}
+{"version":3,"file":"SegmentedControl/SegmentedControl.js","sources":["../../src/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { makeDecoratable } from \"~/utils.js\";\nimport type { SegmentedControlPrimitiveProps } from \"./primitives/index.js\";\nimport { SegmentedControlPrimitive } from \"./primitives/index.js\";\nimport type { FormComponentProps } from \"~/FormComponent/index.js\";\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentLabel,\n    FormComponentNote\n} from \"~/FormComponent/index.js\";\n\ntype SegmentedControlProps = SegmentedControlPrimitiveProps & FormComponentProps;\n\nconst DecoratableSegmentedControl = ({\n    label,\n    description,\n    note,\n    hint,\n    required,\n    disabled,\n    validation,\n    ...props\n}: SegmentedControlProps) => {\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    return (\n        <div className=\"w-full\">\n            <FormComponentLabel\n                text={label}\n                hint={hint}\n                required={required}\n                disabled={disabled}\n                invalid={invalid}\n            />\n            <FormComponentDescription\n                text={description}\n                disabled={disabled}\n                className=\"mb-xs-plus\"\n            />\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={disabled}\n                className=\"mt-none mb-xs-plus\"\n            />\n            <SegmentedControlPrimitive {...props} disabled={disabled} />\n            <FormComponentNote text={note} disabled={disabled} />\n        </div>\n    );\n};\n\nconst SegmentedControl = makeDecoratable(\"SegmentedControl\", DecoratableSegmentedControl);\n\nexport { SegmentedControl, type SegmentedControlProps };\n"],"names":["DecoratableSegmentedControl","label","description","note","hint","required","disabled","validation","props","validationIsValid","validationMessage","invalid","useMemo","FormComponentLabel","FormComponentDescription","FormComponentErrorMessage","SegmentedControlPrimitive","FormComponentNote","SegmentedControl","makeDecoratable"],"mappings":";;;;AAcA,MAAMA,8BAA8B,CAAC,EACjCC,KAAK,EACLC,WAAW,EACXC,IAAI,EACJC,IAAI,EACJC,QAAQ,EACRC,QAAQ,EACRC,UAAU,EACV,GAAGC,OACiB;IACpB,MAAM,EAAE,SAASC,iBAAiB,EAAE,SAASC,iBAAiB,EAAE,GAAGH,cAAc,CAAC;IAClF,MAAMI,UAAUC,QAAQ,IAAMH,AAAsB,UAAtBA,mBAA6B;QAACA;KAAkB;IAE9E,OAAO,WAAP,GACI,oBAAC;QAAI,WAAU;qBACX,oBAACI,oBAAkBA;QACf,MAAMZ;QACN,MAAMG;QACN,UAAUC;QACV,UAAUC;QACV,SAASK;sBAEb,oBAACG,0BAAwBA;QACrB,MAAMZ;QACN,UAAUI;QACV,WAAU;sBAEd,oBAACS,2BAAyBA;QACtB,MAAML;QACN,SAASC;QACT,UAAUL;QACV,WAAU;sBAEd,oBAACU,2BAAyBA;QAAE,GAAGR,KAAK;QAAE,UAAUF;sBAChD,oBAACW,mBAAiBA;QAAC,MAAMd;QAAM,UAAUG;;AAGrD;AAEA,MAAMY,mBAAmBC,gBAAgB,oBAAoBnB"}

package/SegmentedControl/SegmentedControl.stories.js

@@ -1,164 +1,182 @@
-import React, { useState } from "react";
+import react, { useState } from "react";
 import { SegmentedControl } from "./SegmentedControl.js";
 import { Icon } from "../Icon/index.js";
-import { ReactComponent as LockIcon } from "@webiny/icons/notifications.svg";
+import { ReactComponent } from "@webiny/icons/notifications.svg";
 const meta = {
-  title: "Components/Form/SegmentedControl",
-  component: SegmentedControl
+    title: "Components/Form/SegmentedControl",
+    component: SegmentedControl
 };
-export default meta;
-const items = [{
-  label: "Item",
-  value: "item1"
-}, {
-  label: "Item",
-  value: "item2"
-}, {
-  label: "Item",
-  value: "item3"
-}, {
-  label: "Item",
-  value: "item4"
-}];
-const itemsWithIcons = [{
-  label: "Item 1",
-  value: "item1",
-  icon: /*#__PURE__*/React.createElement(Icon, {
-    icon: /*#__PURE__*/React.createElement(LockIcon, null),
-    label: "Lock"
-  })
-}, {
-  label: "Item 1",
-  value: "item2",
-  icon: /*#__PURE__*/React.createElement(Icon, {
-    icon: /*#__PURE__*/React.createElement(LockIcon, null),
-    label: "Lock"
-  })
-}, {
-  label: "Item 1",
-  value: "item3",
-  icon: /*#__PURE__*/React.createElement(Icon, {
-    icon: /*#__PURE__*/React.createElement(LockIcon, null),
-    label: "Lock"
-  })
-}, {
-  label: "Item 1",
-  value: "item4",
-  icon: /*#__PURE__*/React.createElement(Icon, {
-    icon: /*#__PURE__*/React.createElement(LockIcon, null),
-    label: "Lock"
-  })
-}];
-export const Default = {
-  render: args => {
-    const [value, setValue] = useState(args.value);
-    return /*#__PURE__*/React.createElement(SegmentedControl, Object.assign({}, args, {
-      value: value,
-      onChange: value => setValue(value)
-    }));
-  },
-  args: {
-    items: itemsWithIcons
-  }
-};
-export const VariantLight = {
-  render: () => {
-    const [value, setValue] = useState("item1");
-    return /*#__PURE__*/React.createElement(SegmentedControl, {
-      items: items,
-      value: value,
-      onChange: setValue,
-      variant: "light"
-    });
-  }
-};
-export const VariantDimmed = {
-  render: () => {
-    const [value, setValue] = useState("item1");
-    return /*#__PURE__*/React.createElement(SegmentedControl, {
-      items: items,
-      value: value,
-      onChange: setValue,
-      variant: "dimmed"
-    });
-  }
-};
-export const VariantGhost = {
-  render: () => {
-    const [value, setValue] = useState("item1");
-    return /*#__PURE__*/React.createElement("div", {
-      className: "p-md rounded-md"
-    }, /*#__PURE__*/React.createElement(SegmentedControl, {
-      items: items,
-      value: value,
-      onChange: setValue,
-      variant: "ghost"
-    }));
-  }
-};
-export const WithFormComponent = {
-  render: () => {
-    const [value, setValue] = useState("item1");
-    return /*#__PURE__*/React.createElement("div", {
-      className: "space-y-lg"
-    }, /*#__PURE__*/React.createElement(SegmentedControl, {
-      label: "Select an option",
-      description: "Choose one of the available options",
-      items: items,
-      value: value,
-      onChange: setValue
-    }), /*#__PURE__*/React.createElement(SegmentedControl, {
-      label: "With error",
-      items: items,
-      value: value,
-      onChange: setValue,
-      validation: {
-        isValid: false,
-        message: "This field is required"
-      }
-    }), /*#__PURE__*/React.createElement(SegmentedControl, {
-      label: "Disabled",
-      items: items,
-      value: value,
-      onChange: setValue,
-      disabled: true
-    }));
-  }
-};
-export const Disabled = {
-  render: () => {
-    const [value, setValue] = useState("item1");
-    return /*#__PURE__*/React.createElement("div", {
-      className: "space-y-md"
-    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
-      className: "text-lg font-semibold mb-sm"
-    }, "Fully Disabled"), /*#__PURE__*/React.createElement(SegmentedControl, {
-      items: items,
-      value: value,
-      onChange: setValue,
-      disabled: true
-    })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
-      className: "text-lg font-semibold mb-sm"
-    }, "Partially Disabled"), /*#__PURE__*/React.createElement(SegmentedControl, {
-      items: [{
+const SegmentedControl_stories = meta;
+const items = [
+    {
         label: "Item",
         value: "item1"
-      }, {
-        label: "Item (disabled)",
-        value: "item2",
-        disabled: true
-      }, {
+    },
+    {
+        label: "Item",
+        value: "item2"
+    },
+    {
         label: "Item",
         value: "item3"
-      }, {
-        label: "Item (disabled)",
+    },
+    {
+        label: "Item",
+        value: "item4"
+    }
+];
+const itemsWithIcons = [
+    {
+        label: "Item 1",
+        value: "item1",
+        icon: /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            label: "Lock"
+        })
+    },
+    {
+        label: "Item 1",
+        value: "item2",
+        icon: /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            label: "Lock"
+        })
+    },
+    {
+        label: "Item 1",
+        value: "item3",
+        icon: /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            label: "Lock"
+        })
+    },
+    {
+        label: "Item 1",
         value: "item4",
-        disabled: true
-      }],
-      value: value,
-      onChange: setValue
-    })));
-  }
+        icon: /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            label: "Lock"
+        })
+    }
+];
+const Default = {
+    render: (args)=>{
+        const [value, setValue] = useState(args.value);
+        return /*#__PURE__*/ react.createElement(SegmentedControl, {
+            ...args,
+            value: value,
+            onChange: (value)=>setValue(value)
+        });
+    },
+    args: {
+        items: itemsWithIcons
+    }
+};
+const VariantLight = {
+    render: ()=>{
+        const [value, setValue] = useState("item1");
+        return /*#__PURE__*/ react.createElement(SegmentedControl, {
+            items: items,
+            value: value,
+            onChange: setValue,
+            variant: "light"
+        });
+    }
+};
+const VariantDimmed = {
+    render: ()=>{
+        const [value, setValue] = useState("item1");
+        return /*#__PURE__*/ react.createElement(SegmentedControl, {
+            items: items,
+            value: value,
+            onChange: setValue,
+            variant: "dimmed"
+        });
+    }
+};
+const VariantGhost = {
+    render: ()=>{
+        const [value, setValue] = useState("item1");
+        return /*#__PURE__*/ react.createElement("div", {
+            className: "p-md rounded-md"
+        }, /*#__PURE__*/ react.createElement(SegmentedControl, {
+            items: items,
+            value: value,
+            onChange: setValue,
+            variant: "ghost"
+        }));
+    }
+};
+const WithFormComponent = {
+    render: ()=>{
+        const [value, setValue] = useState("item1");
+        return /*#__PURE__*/ react.createElement("div", {
+            className: "space-y-lg"
+        }, /*#__PURE__*/ react.createElement(SegmentedControl, {
+            label: "Select an option",
+            description: "Choose one of the available options",
+            items: items,
+            value: value,
+            onChange: setValue
+        }), /*#__PURE__*/ react.createElement(SegmentedControl, {
+            label: "With error",
+            items: items,
+            value: value,
+            onChange: setValue,
+            validation: {
+                isValid: false,
+                message: "This field is required"
+            }
+        }), /*#__PURE__*/ react.createElement(SegmentedControl, {
+            label: "Disabled",
+            items: items,
+            value: value,
+            onChange: setValue,
+            disabled: true
+        }));
+    }
+};
+const Disabled = {
+    render: ()=>{
+        const [value, setValue] = useState("item1");
+        return /*#__PURE__*/ react.createElement("div", {
+            className: "space-y-md"
+        }, /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement("h3", {
+            className: "text-lg font-semibold mb-sm"
+        }, "Fully Disabled"), /*#__PURE__*/ react.createElement(SegmentedControl, {
+            items: items,
+            value: value,
+            onChange: setValue,
+            disabled: true
+        })), /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement("h3", {
+            className: "text-lg font-semibold mb-sm"
+        }, "Partially Disabled"), /*#__PURE__*/ react.createElement(SegmentedControl, {
+            items: [
+                {
+                    label: "Item",
+                    value: "item1"
+                },
+                {
+                    label: "Item (disabled)",
+                    value: "item2",
+                    disabled: true
+                },
+                {
+                    label: "Item",
+                    value: "item3"
+                },
+                {
+                    label: "Item (disabled)",
+                    value: "item4",
+                    disabled: true
+                }
+            ],
+            value: value,
+            onChange: setValue
+        })));
+    }
 };
+export default SegmentedControl_stories;
+export { Default, Disabled, VariantDimmed, VariantGhost, VariantLight, WithFormComponent };
 
 //# sourceMappingURL=SegmentedControl.stories.js.map

package/SegmentedControl/SegmentedControl.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useState","SegmentedControl","Icon","ReactComponent","LockIcon","meta","title","component","items","label","value","itemsWithIcons","icon","createElement","Default","render","args","setValue","Object","assign","onChange","VariantLight","variant","VariantDimmed","VariantGhost","className","WithFormComponent","description","validation","isValid","message","disabled","Disabled"],"sources":["SegmentedControl.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { SegmentedControl } from \"./SegmentedControl.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { ReactComponent as LockIcon } from \"@webiny/icons/notifications.svg\";\n\nconst meta: Meta<typeof SegmentedControl> = {\n    title: \"Components/Form/SegmentedControl\",\n    component: SegmentedControl\n};\n\nexport default meta;\ntype Story = StoryObj<typeof SegmentedControl>;\n\nconst items = [\n    { label: \"Item\", value: \"item1\" },\n    { label: \"Item\", value: \"item2\" },\n    { label: \"Item\", value: \"item3\" },\n    { label: \"Item\", value: \"item4\" }\n];\n\nconst itemsWithIcons = [\n    { label: \"Item 1\", value: \"item1\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 1\", value: \"item2\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 1\", value: \"item3\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 1\", value: \"item4\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> }\n];\n\nexport const Default: Story = {\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <SegmentedControl {...args} value={value} onChange={value => setValue(value)} />;\n    },\n    args: {\n        items: itemsWithIcons\n    }\n};\n\nexport const VariantLight: Story = {\n    render: () => {\n        const [value, setValue] = useState(\"item1\");\n\n        return <SegmentedControl items={items} value={value} onChange={setValue} variant=\"light\" />;\n    }\n};\n\nexport const VariantDimmed: Story = {\n    render: () => {\n        const [value, setValue] = useState(\"item1\");\n\n        return (\n            <SegmentedControl items={items} value={value} onChange={setValue} variant=\"dimmed\" />\n        );\n    }\n};\n\nexport const VariantGhost: Story = {\n    render: () => {\n        const [value, setValue] = useState(\"item1\");\n\n        return (\n            <div className=\"p-md rounded-md\">\n                <SegmentedControl items={items} value={value} onChange={setValue} variant=\"ghost\" />\n            </div>\n        );\n    }\n};\n\nexport const WithFormComponent: Story = {\n    render: () => {\n        const [value, setValue] = useState(\"item1\");\n\n        return (\n            <div className=\"space-y-lg\">\n                <SegmentedControl\n                    label=\"Select an option\"\n                    description=\"Choose one of the available options\"\n                    items={items}\n                    value={value}\n                    onChange={setValue}\n                />\n                <SegmentedControl\n                    label=\"With error\"\n                    items={items}\n                    value={value}\n                    onChange={setValue}\n                    validation={{\n                        isValid: false,\n                        message: \"This field is required\"\n                    }}\n                />\n                <SegmentedControl\n                    label=\"Disabled\"\n                    items={items}\n                    value={value}\n                    onChange={setValue}\n                    disabled\n                />\n            </div>\n        );\n    }\n};\n\nexport const Disabled: Story = {\n    render: () => {\n        const [value, setValue] = useState(\"item1\");\n\n        return (\n            <div className=\"space-y-md\">\n                <div>\n                    <h3 className=\"text-lg font-semibold mb-sm\">Fully Disabled</h3>\n                    <SegmentedControl items={items} value={value} onChange={setValue} disabled />\n                </div>\n                <div>\n                    <h3 className=\"text-lg font-semibold mb-sm\">Partially Disabled</h3>\n                    <SegmentedControl\n                        items={[\n                            { label: \"Item\", value: \"item1\" },\n                            { label: \"Item (disabled)\", value: \"item2\", disabled: true },\n                            { label: \"Item\", value: \"item3\" },\n                            { label: \"Item (disabled)\", value: \"item4\", disabled: true }\n                        ]}\n                        value={value}\n                        onChange={setValue}\n                    />\n                </div>\n            </div>\n        );\n    }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SegmentedControl/SegmentedControl.stories.js","sources":["../../src/SegmentedControl/SegmentedControl.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { SegmentedControl } from \"./SegmentedControl.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { ReactComponent as LockIcon } from \"@webiny/icons/notifications.svg\";\n\nconst meta: Meta<typeof SegmentedControl> = {\n    title: \"Components/Form/SegmentedControl\",\n    component: SegmentedControl\n};\n\nexport default meta;\ntype Story = StoryObj<typeof SegmentedControl>;\n\nconst items = [\n    { label: \"Item\", value: \"item1\" },\n    { label: \"Item\", value: \"item2\" },\n    { label: \"Item\", value: \"item3\" },\n    { label: \"Item\", value: \"item4\" }\n];\n\nconst itemsWithIcons = [\n    { label: \"Item 1\", value: \"item1\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 1\", value: \"item2\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 1\", value: \"item3\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> },\n    { label: \"Item 1\", value: \"item4\", icon: <Icon icon={<LockIcon />} label=\"Lock\" /> }\n];\n\nexport const Default: Story = {\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <SegmentedControl {...args} value={value} onChange={value => setValue(value)} />;\n    },\n    args: {\n        items: itemsWithIcons\n    }\n};\n\nexport const VariantLight: Story = {\n    render: () => {\n        const [value, setValue] = useState(\"item1\");\n\n        return <SegmentedControl items={items} value={value} onChange={setValue} variant=\"light\" />;\n    }\n};\n\nexport const VariantDimmed: Story = {\n    render: () => {\n        const [value, setValue] = useState(\"item1\");\n\n        return (\n            <SegmentedControl items={items} value={value} onChange={setValue} variant=\"dimmed\" />\n        );\n    }\n};\n\nexport const VariantGhost: Story = {\n    render: () => {\n        const [value, setValue] = useState(\"item1\");\n\n        return (\n            <div className=\"p-md rounded-md\">\n                <SegmentedControl items={items} value={value} onChange={setValue} variant=\"ghost\" />\n            </div>\n        );\n    }\n};\n\nexport const WithFormComponent: Story = {\n    render: () => {\n        const [value, setValue] = useState(\"item1\");\n\n        return (\n            <div className=\"space-y-lg\">\n                <SegmentedControl\n                    label=\"Select an option\"\n                    description=\"Choose one of the available options\"\n                    items={items}\n                    value={value}\n                    onChange={setValue}\n                />\n                <SegmentedControl\n                    label=\"With error\"\n                    items={items}\n                    value={value}\n                    onChange={setValue}\n                    validation={{\n                        isValid: false,\n                        message: \"This field is required\"\n                    }}\n                />\n                <SegmentedControl\n                    label=\"Disabled\"\n                    items={items}\n                    value={value}\n                    onChange={setValue}\n                    disabled\n                />\n            </div>\n        );\n    }\n};\n\nexport const Disabled: Story = {\n    render: () => {\n        const [value, setValue] = useState(\"item1\");\n\n        return (\n            <div className=\"space-y-md\">\n                <div>\n                    <h3 className=\"text-lg font-semibold mb-sm\">Fully Disabled</h3>\n                    <SegmentedControl items={items} value={value} onChange={setValue} disabled />\n                </div>\n                <div>\n                    <h3 className=\"text-lg font-semibold mb-sm\">Partially Disabled</h3>\n                    <SegmentedControl\n                        items={[\n                            { label: \"Item\", value: \"item1\" },\n                            { label: \"Item (disabled)\", value: \"item2\", disabled: true },\n                            { label: \"Item\", value: \"item3\" },\n                            { label: \"Item (disabled)\", value: \"item4\", disabled: true }\n                        ]}\n                        value={value}\n                        onChange={setValue}\n                    />\n                </div>\n            </div>\n        );\n    }\n};\n"],"names":["meta","SegmentedControl","items","itemsWithIcons","Icon","LockIcon","Default","args","value","setValue","useState","VariantLight","VariantDimmed","VariantGhost","WithFormComponent","Disabled"],"mappings":"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"}

package/SegmentedControl/SegmentedControl.test.js

@@ -1,34 +1,13 @@
-/**
- * This is a simple smoke test to verify the SegmentedControl component can be imported
- * and used without errors.
- */
-
-import { describe, it, expect } from "vitest";
-import React from "react";
+import { describe, expect, it } from "vitest";
+import "react";
 import { SegmentedControl } from "./SegmentedControl.js";
-describe("SegmentedControl", () => {
-  it("should export the component", () => {
-    expect(SegmentedControl).toBeDefined();
-  });
-  it("should accept required props", () => {
-    const items = [{
-      label: "Item 1",
-      value: "item1"
-    }, {
-      label: "Item 2",
-      value: "item2"
-    }];
-    const props = {
-      items,
-      value: "item1",
-      onChange: () => {}
-    };
-
-    // This should not throw
-    expect(() => {
-      /*#__PURE__*/React.createElement(SegmentedControl, props);
-    }).not.toThrow();
-  });
+describe("SegmentedControl", ()=>{
+    it("should export the component", ()=>{
+        expect(SegmentedControl).toBeDefined();
+    });
+    it("should accept required props", ()=>{
+        expect(()=>{}).not.toThrow();
+    });
 });
 
 //# sourceMappingURL=SegmentedControl.test.js.map

package/SegmentedControl/SegmentedControl.test.js.map

@@ -1 +1 @@
-{"version":3,"names":["describe","it","expect","React","SegmentedControl","toBeDefined","items","label","value","props","onChange","createElement","not","toThrow"],"sources":["SegmentedControl.test.tsx"],"sourcesContent":["/**\n * This is a simple smoke test to verify the SegmentedControl component can be imported\n * and used without errors.\n */\n\nimport { describe, it, expect } from \"vitest\";\nimport React from \"react\";\nimport { SegmentedControl } from \"./SegmentedControl.js\";\n\ndescribe(\"SegmentedControl\", () => {\n    it(\"should export the component\", () => {\n        expect(SegmentedControl).toBeDefined();\n    });\n\n    it(\"should accept required props\", () => {\n        const items = [\n            { label: \"Item 1\", value: \"item1\" },\n            { label: \"Item 2\", value: \"item2\" }\n        ];\n\n        const props = {\n            items,\n            value: \"item1\",\n            onChange: () => {}\n        };\n\n        // This should not throw\n        expect(() => {\n            React.createElement(SegmentedControl, props);\n        }).not.toThrow();\n    });\n});\n"],"mappings":"AAAA;AACA;AACA;AACA;;AAEA,SAASA,QAAQ,EAAEC,EAAE,EAAEC,MAAM,QAAQ,QAAQ;AAC7C,OAAOC,KAAK,MAAM,OAAO;AACzB,SAASC,gBAAgB;AAEzBJ,QAAQ,CAAC,kBAAkB,EAAE,MAAM;EAC/BC,EAAE,CAAC,6BAA6B,EAAE,MAAM;IACpCC,MAAM,CAACE,gBAAgB,CAAC,CAACC,WAAW,CAAC,CAAC;EAC1C,CAAC,CAAC;EAEFJ,EAAE,CAAC,8BAA8B,EAAE,MAAM;IACrC,MAAMK,KAAK,GAAG,CACV;MAAEC,KAAK,EAAE,QAAQ;MAAEC,KAAK,EAAE;IAAQ,CAAC,EACnC;MAAED,KAAK,EAAE,QAAQ;MAAEC,KAAK,EAAE;IAAQ,CAAC,CACtC;IAED,MAAMC,KAAK,GAAG;MACVH,KAAK;MACLE,KAAK,EAAE,OAAO;MACdE,QAAQ,EAAEA,CAAA,KAAM,CAAC;IACrB,CAAC;;IAED;IACAR,MAAM,CAAC,MAAM;MACT,aAAAC,KAAK,CAACQ,aAAa,CAACP,gBAAgB,EAAEK,KAAK,CAAC;IAChD,CAAC,CAAC,CAACG,GAAG,CAACC,OAAO,CAAC,CAAC;EACpB,CAAC,CAAC;AACN,CAAC,CAAC","ignoreList":[]}
+{"version":3,"file":"SegmentedControl/SegmentedControl.test.js","sources":["../../src/SegmentedControl/SegmentedControl.test.tsx"],"sourcesContent":["/**\n * This is a simple smoke test to verify the SegmentedControl component can be imported\n * and used without errors.\n */\n\nimport { describe, it, expect } from \"vitest\";\nimport React from \"react\";\nimport { SegmentedControl } from \"./SegmentedControl.js\";\n\ndescribe(\"SegmentedControl\", () => {\n    it(\"should export the component\", () => {\n        expect(SegmentedControl).toBeDefined();\n    });\n\n    it(\"should accept required props\", () => {\n        const items = [\n            { label: \"Item 1\", value: \"item1\" },\n            { label: \"Item 2\", value: \"item2\" }\n        ];\n\n        const props = {\n            items,\n            value: \"item1\",\n            onChange: () => {}\n        };\n\n        // This should not throw\n        expect(() => {\n            React.createElement(SegmentedControl, props);\n        }).not.toThrow();\n    });\n});\n"],"names":["describe","it","expect","SegmentedControl"],"mappings":";;;AASAA,SAAS,oBAAoB;IACzBC,GAAG,+BAA+B;QAC9BC,OAAOC,kBAAkB,WAAW;IACxC;IAEAF,GAAG,gCAAgC;QAa/BC,OAAO,KAEP,GAAG,GAAG,CAAC,OAAO;IAClB;AACJ"}

package/SegmentedControl/domains/SegmentedControlItem.js

@@ -1,36 +1,37 @@
 import { generateId } from "../../utils.js";
-export class SegmentedControlItem {
-  constructor(data) {
-    this._id = data.id;
-    this._label = data.label;
-    this._value = data.value;
-    this._disabled = data.disabled;
-    this._icon = data.icon;
-  }
-  static create(data) {
-    return new SegmentedControlItem({
-      id: generateId(data.id),
-      label: data.label,
-      value: data.value,
-      disabled: data.disabled ?? false,
-      icon: data.icon
-    });
-  }
-  get id() {
-    return this._id;
-  }
-  get label() {
-    return this._label;
-  }
-  get value() {
-    return this._value;
-  }
-  get disabled() {
-    return this._disabled;
-  }
-  get icon() {
-    return this._icon;
-  }
+class SegmentedControlItem {
+    constructor(data){
+        this._id = data.id;
+        this._label = data.label;
+        this._value = data.value;
+        this._disabled = data.disabled;
+        this._icon = data.icon;
+    }
+    static create(data) {
+        return new SegmentedControlItem({
+            id: generateId(data.id),
+            label: data.label,
+            value: data.value,
+            disabled: data.disabled ?? false,
+            icon: data.icon
+        });
+    }
+    get id() {
+        return this._id;
+    }
+    get label() {
+        return this._label;
+    }
+    get value() {
+        return this._value;
+    }
+    get disabled() {
+        return this._disabled;
+    }
+    get icon() {
+        return this._icon;
+    }
 }
+export { SegmentedControlItem };
 
 //# sourceMappingURL=SegmentedControlItem.js.map

package/SegmentedControl/domains/SegmentedControlItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["generateId","SegmentedControlItem","constructor","data","_id","id","_label","label","_value","value","_disabled","disabled","_icon","icon","create"],"sources":["SegmentedControlItem.ts"],"sourcesContent":["import type { SegmentedControlItemParams } from \"./SegmentedControlItemParams.js\";\nimport { generateId } from \"~/utils.js\";\nimport type React from \"react\";\n\nexport class SegmentedControlItem {\n    private readonly _id: string;\n    private readonly _label: any;\n    private readonly _value: string | number;\n    private readonly _disabled: boolean;\n    private readonly _icon?: React.ReactNode;\n\n    protected constructor(data: {\n        id: string;\n        label: any;\n        value: string | number;\n        disabled: boolean;\n        icon?: React.ReactNode;\n    }) {\n        this._id = data.id;\n        this._label = data.label;\n        this._value = data.value;\n        this._disabled = data.disabled;\n        this._icon = data.icon;\n    }\n\n    static create(data: SegmentedControlItemParams) {\n        return new SegmentedControlItem({\n            id: generateId(data.id),\n            label: data.label,\n            value: data.value,\n            disabled: data.disabled ?? false,\n            icon: data.icon\n        });\n    }\n\n    get id() {\n        return this._id;\n    }\n\n    get label() {\n        return this._label;\n    }\n\n    get value() {\n        return this._value;\n    }\n\n    get disabled() {\n        return this._disabled;\n    }\n\n    get icon() {\n        return this._icon;\n    }\n}\n"],"mappings":"AACA,SAASA,UAAU;AAGnB,OAAO,MAAMC,oBAAoB,CAAC;EAOpBC,WAAWA,CAACC,IAMrB,EAAE;IACC,IAAI,CAACC,GAAG,GAAGD,IAAI,CAACE,EAAE;IAClB,IAAI,CAACC,MAAM,GAAGH,IAAI,CAACI,KAAK;IACxB,IAAI,CAACC,MAAM,GAAGL,IAAI,CAACM,KAAK;IACxB,IAAI,CAACC,SAAS,GAAGP,IAAI,CAACQ,QAAQ;IAC9B,IAAI,CAACC,KAAK,GAAGT,IAAI,CAACU,IAAI;EAC1B;EAEA,OAAOC,MAAMA,CAACX,IAAgC,EAAE;IAC5C,OAAO,IAAIF,oBAAoB,CAAC;MAC5BI,EAAE,EAAEL,UAAU,CAACG,IAAI,CAACE,EAAE,CAAC;MACvBE,KAAK,EAAEJ,IAAI,CAACI,KAAK;MACjBE,KAAK,EAAEN,IAAI,CAACM,KAAK;MACjBE,QAAQ,EAAER,IAAI,CAACQ,QAAQ,IAAI,KAAK;MAChCE,IAAI,EAAEV,IAAI,CAACU;IACf,CAAC,CAAC;EACN;EAEA,IAAIR,EAAEA,CAAA,EAAG;IACL,OAAO,IAAI,CAACD,GAAG;EACnB;EAEA,IAAIG,KAAKA,CAAA,EAAG;IACR,OAAO,IAAI,CAACD,MAAM;EACtB;EAEA,IAAIG,KAAKA,CAAA,EAAG;IACR,OAAO,IAAI,CAACD,MAAM;EACtB;EAEA,IAAIG,QAAQA,CAAA,EAAG;IACX,OAAO,IAAI,CAACD,SAAS;EACzB;EAEA,IAAIG,IAAIA,CAAA,EAAG;IACP,OAAO,IAAI,CAACD,KAAK;EACrB;AACJ","ignoreList":[]}
+{"version":3,"file":"SegmentedControl/domains/SegmentedControlItem.js","sources":["../../../src/SegmentedControl/domains/SegmentedControlItem.ts"],"sourcesContent":["import type { SegmentedControlItemParams } from \"./SegmentedControlItemParams.js\";\nimport { generateId } from \"~/utils.js\";\nimport type React from \"react\";\n\nexport class SegmentedControlItem {\n    private readonly _id: string;\n    private readonly _label: any;\n    private readonly _value: string | number;\n    private readonly _disabled: boolean;\n    private readonly _icon?: React.ReactNode;\n\n    protected constructor(data: {\n        id: string;\n        label: any;\n        value: string | number;\n        disabled: boolean;\n        icon?: React.ReactNode;\n    }) {\n        this._id = data.id;\n        this._label = data.label;\n        this._value = data.value;\n        this._disabled = data.disabled;\n        this._icon = data.icon;\n    }\n\n    static create(data: SegmentedControlItemParams) {\n        return new SegmentedControlItem({\n            id: generateId(data.id),\n            label: data.label,\n            value: data.value,\n            disabled: data.disabled ?? false,\n            icon: data.icon\n        });\n    }\n\n    get id() {\n        return this._id;\n    }\n\n    get label() {\n        return this._label;\n    }\n\n    get value() {\n        return this._value;\n    }\n\n    get disabled() {\n        return this._disabled;\n    }\n\n    get icon() {\n        return this._icon;\n    }\n}\n"],"names":["SegmentedControlItem","data","generateId"],"mappings":";AAIO,MAAMA;IAOT,YAAsBC,IAMrB,CAAE;QACC,IAAI,CAAC,GAAG,GAAGA,KAAK,EAAE;QAClB,IAAI,CAAC,MAAM,GAAGA,KAAK,KAAK;QACxB,IAAI,CAAC,MAAM,GAAGA,KAAK,KAAK;QACxB,IAAI,CAAC,SAAS,GAAGA,KAAK,QAAQ;QAC9B,IAAI,CAAC,KAAK,GAAGA,KAAK,IAAI;IAC1B;IAEA,OAAO,OAAOA,IAAgC,EAAE;QAC5C,OAAO,IAAID,qBAAqB;YAC5B,IAAIE,WAAWD,KAAK,EAAE;YACtB,OAAOA,KAAK,KAAK;YACjB,OAAOA,KAAK,KAAK;YACjB,UAAUA,KAAK,QAAQ,IAAI;YAC3B,MAAMA,KAAK,IAAI;QACnB;IACJ;IAEA,IAAI,KAAK;QACL,OAAO,IAAI,CAAC,GAAG;IACnB;IAEA,IAAI,QAAQ;QACR,OAAO,IAAI,CAAC,MAAM;IACtB;IAEA,IAAI,QAAQ;QACR,OAAO,IAAI,CAAC,MAAM;IACtB;IAEA,IAAI,WAAW;QACX,OAAO,IAAI,CAAC,SAAS;IACzB;IAEA,IAAI,OAAO;QACP,OAAO,IAAI,CAAC,KAAK;IACrB;AACJ"}