@simplybusiness/mobius 4.11.3 → 4.11.4

package/dist/esm/components/Drawer/Drawer.stories.js

@@ -1,166 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from "react";
-import { Drawer } from ".";
-import { excludeControls } from "../../utils";
-import { Button } from "../Button";
-import { Text } from "../Text";
-import { Accordion } from "../Accordion";
-const meta = {
-    title: "Components/Drawer",
-    component: Drawer,
-    argTypes: {
-        direction: {
-            options: [
-                "top",
-                "bottom",
-                "left",
-                "right"
-            ],
-            control: {
-                type: "radio"
-            }
-        },
-        ...excludeControls("isOpen", "closeLabel", "announce")
-    }
-};
-const Demo = (props)=>{
-    const [open, setOpen] = useState(false);
-    return /*#__PURE__*/ _jsxs(_Fragment, {
-        children: [
-            /*#__PURE__*/ _jsx(Button, {
-                onClick: ()=>setOpen(true),
-                children: "Show Drawer"
-            }),
-            /*#__PURE__*/ _jsxs(Drawer, {
-                ...props,
-                onClose: ()=>setOpen(false),
-                isOpen: open,
-                children: [
-                    /*#__PURE__*/ _jsx(Drawer.Header, {
-                        children: "The Latin Drawer"
-                    }),
-                    /*#__PURE__*/ _jsxs(Drawer.Content, {
-                        children: [
-                            /*#__PURE__*/ _jsx("p", {
-                                children: "Aliquam fringilla quam vel purus rhoncus interdum in quis sapien. Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis vel consectetur sed, vulputate et lorem. Integer venenatis nibh molestie commodo lobortis. Phasellus sit amet dignissim nisi. Vivamus nisi augue, scelerisque commodo libero vitae, vulputate interdum ex. Integer non risus sollicitudin, cursus ipsum vitae, rhoncus nulla."
-                            }),
-                            /*#__PURE__*/ _jsxs(Accordion, {
-                                showText: "See more",
-                                hideText: "See less",
-                                headerPosition: "top",
-                                startOpen: false,
-                                children: [
-                                    /*#__PURE__*/ _jsx("p", {
-                                        children: "Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sequi repellendus deleniti architecto"
-                                    }),
-                                    /*#__PURE__*/ _jsx("p", {
-                                        children: "Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sequi repellendus deleniti architecto"
-                                    })
-                                ]
-                            })
-                        ]
-                    })
-                ]
-            })
-        ]
-    });
-};
-const LogoHeader = ({ direction, closeLabel })=>{
-    const [open, setOpen] = useState(false);
-    return /*#__PURE__*/ _jsxs(_Fragment, {
-        children: [
-            /*#__PURE__*/ _jsx(Button, {
-                onClick: ()=>setOpen(true),
-                children: "Show Drawer"
-            }),
-            /*#__PURE__*/ _jsxs(Drawer, {
-                isOpen: open,
-                onClose: ()=>setOpen(false),
-                direction: direction,
-                closeLabel: closeLabel,
-                children: [
-                    /*#__PURE__*/ _jsx(Drawer.Header, {
-                        children: /*#__PURE__*/ _jsx("img", {
-                            src: "https://quote.simplybusiness.com/assets/logos/insurers/harborway_insurance-1a46ba508f3dfcc89aa2498e7680ed15bd1704ccb01c614eb5335bd7b25e0537.png",
-                            alt: "Provider logo"
-                        })
-                    }),
-                    /*#__PURE__*/ _jsx(Drawer.Content, {
-                        children: "Content."
-                    })
-                ]
-            })
-        ]
-    });
-};
-const WithLongContentDemo = ()=>{
-    const [open, setOpen] = useState(false);
-    return /*#__PURE__*/ _jsxs(_Fragment, {
-        children: [
-            /*#__PURE__*/ _jsx(Button, {
-                onClick: ()=>setOpen(true),
-                children: "Show Drawer"
-            }),
-            /*#__PURE__*/ _jsxs(Drawer, {
-                direction: "right",
-                isOpen: open,
-                onClose: ()=>setOpen(false),
-                children: [
-                    /*#__PURE__*/ _jsx(Drawer.Header, {
-                        children: "Aliquam fringilla quam vel purus rhoncus isuere. Morbi augue augue, venenatis vel consectetur sed, vulputate et lorem. Int"
-                    }),
-                    /*#__PURE__*/ _jsxs(Drawer.Content, {
-                        children: [
-                            /*#__PURE__*/ _jsx(Text, {
-                                children: "Aliquam fringilla quam vel purus rhoncus interdum in quis sapien. Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis vel consectetur sed, vulputate et lorem. Integer venenatis nibh molestie commodo lobortis. Phasellus sit amet dignissim nisi. Vivamus nisi augue, scelerisque commodo libero vitae, vulputate interdum ex. Integer non risus sollicitudin, cursus ipsum vitae, rhoncus nulla."
-                            }),
-                            /*#__PURE__*/ _jsx(Text, {
-                                children: "Aliquam fringilla quam vel purus rhoncus interdum in quis sapien. Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis vel consectetur sed, vulputate et lorem. Integer venenatis nibh molestie commodo lobortis. Phasellus sit amet dignissim nisi. Vivamus nisi augue, scelerisque commodo libero vitae, vulputate interdum ex. Integer non risus sollicitudin, cursus ipsum vitae, rhoncus nulla."
-                            }),
-                            /*#__PURE__*/ _jsx(Text, {
-                                children: "Aliquam fringilla quam vel purus rhoncus interdum in quis sapien. Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis vel consectetur sed, vulputate et lorem. Integer venenatis nibh molestie commodo lobortis. Phasellus sit amet dignissim nisi. Vivamus nisi augue, scelerisque commodo libero vitae, vulputate interdum ex. Integer non risus sollicitudin, cursus ipsum vitae, rhoncus nulla."
-                            }),
-                            /*#__PURE__*/ _jsx(Text, {
-                                children: "Aliquam fringilla quam vel purus rhoncus interdum in quis sapien. Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis vel consectetur sed, vulputate et lorem. Integer venenatis nibh molestie commodo lobortis. Phasellus sit amet dignissim nisi. Vivamus nisi augue, scelerisque commodo libero vitae, vulputate interdum ex. Integer non risus sollicitudin, cursus ipsum vitae, rhoncus nulla."
-                            }),
-                            /*#__PURE__*/ _jsx(Text, {
-                                children: "Aliquam fringilla quam vel purus rhoncus interdum in quis sapien. Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis vel consectetur sed, vulputate et lorem. Integer venenatis nibh molestie commodo lobortis. Phasellus sit amet dignissim nisi. Vivamus nisi augue, scelerisque commodo libero vitae, vulputate interdum ex. Integer non risus sollicitudin, cursus ipsum vitae, rhoncus nulla."
-                            }),
-                            /*#__PURE__*/ _jsx(Text, {
-                                children: "Aliquam fringilla quam vel purus rhoncus interdum in quis sapien. Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis vel consectetur sed, vulputate et lorem. Integer venenatis nibh molestie commodo lobortis. Phasellus sit amet dignissim nisi. Vivamus nisi augue, scelerisque commodo libero vitae, vulputate interdum ex. Integer non risus sollicitudin, cursus ipsum vitae, rhoncus nulla."
-                            }),
-                            /*#__PURE__*/ _jsx(Text, {
-                                children: "Aliquam fringilla quam vel purus rhoncus interdum in quis sapien. Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis vel consectetur sed, vulputate et lorem. Integer venenatis nibh molestie commodo lobortis. Phasellus sit amet dignissim nisi. Vivamus nisi augue, scelerisque commodo libero vitae, vulputate interdum ex. Integer non risus sollicitudin, cursus ipsum vitae, rhoncus nulla."
-                            })
-                        ]
-                    })
-                ]
-            })
-        ]
-    });
-};
-export const Normal = {
-    render: (args)=>/*#__PURE__*/ _jsx(Demo, {
-            ...args
-        }),
-    args: {
-        direction: "right",
-        closeLabel: "Close"
-    }
-};
-export const WithLogoHeader = {
-    render: (args)=>/*#__PURE__*/ _jsx(LogoHeader, {
-            ...args
-        }),
-    args: {
-        direction: "right",
-        closeLabel: "Close"
-    }
-};
-export const WithLongContent = {
-    render: ()=>/*#__PURE__*/ _jsx(WithLongContentDemo, {}),
-    args: {}
-};
-export default meta;
-
-//# sourceMappingURL=Drawer.stories.js.map

package/dist/esm/components/Drawer/Drawer.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/components/Drawer/Drawer.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { useState } from \"react\";\nimport { Drawer, DrawerProps } from \".\";\nimport { excludeControls } from \"../../utils\";\nimport { Button } from \"../Button\";\nimport { Text } from \"../Text\";\nimport { Accordion } from \"../Accordion\";\n\ntype StoryType = StoryObj<typeof Drawer>;\n\nconst meta: Meta<typeof Drawer> = {\n  title: \"Components/Drawer\",\n  component: Drawer,\n  argTypes: {\n    direction: {\n      options: [\"top\", \"bottom\", \"left\", \"right\"],\n      control: { type: \"radio\" },\n    },\n    ...excludeControls(\"isOpen\", \"closeLabel\", \"announce\"),\n  },\n};\n\nconst Demo = (props: DrawerProps) => {\n  const [open, setOpen] = useState(false);\n  return (\n    <>\n      <Button onClick={() => setOpen(true)}>Show Drawer</Button>\n      <Drawer {...props} onClose={() => setOpen(false)} isOpen={open}>\n        <Drawer.Header>The Latin Drawer</Drawer.Header>\n        <Drawer.Content>\n          <p>\n            Aliquam fringilla quam vel purus rhoncus interdum in quis sapien.\n            Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis\n            vel consectetur sed, vulputate et lorem. Integer venenatis nibh\n            molestie commodo lobortis. Phasellus sit amet dignissim nisi.\n            Vivamus nisi augue, scelerisque commodo libero vitae, vulputate\n            interdum ex. Integer non risus sollicitudin, cursus ipsum vitae,\n            rhoncus nulla.\n          </p>\n          <Accordion\n            showText=\"See more\"\n            hideText=\"See less\"\n            headerPosition=\"top\"\n            startOpen={false}\n          >\n            <p>\n              Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sequi\n              repellendus deleniti architecto\n            </p>\n            <p>\n              Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sequi\n              repellendus deleniti architecto\n            </p>\n          </Accordion>\n        </Drawer.Content>\n      </Drawer>\n    </>\n  );\n};\n\nconst LogoHeader = ({ direction, closeLabel }: DrawerProps) => {\n  const [open, setOpen] = useState(false);\n  return (\n    <>\n      <Button onClick={() => setOpen(true)}>Show Drawer</Button>\n      <Drawer\n        isOpen={open}\n        onClose={() => setOpen(false)}\n        direction={direction}\n        closeLabel={closeLabel}\n      >\n        <Drawer.Header>\n          <img\n            src=\"https://quote.simplybusiness.com/assets/logos/insurers/harborway_insurance-1a46ba508f3dfcc89aa2498e7680ed15bd1704ccb01c614eb5335bd7b25e0537.png\"\n            alt=\"Provider logo\"\n          />\n        </Drawer.Header>\n        <Drawer.Content>Content.</Drawer.Content>\n      </Drawer>\n    </>\n  );\n};\n\nconst WithLongContentDemo = () => {\n  const [open, setOpen] = useState(false);\n  return (\n    <>\n      <Button onClick={() => setOpen(true)}>Show Drawer</Button>\n      <Drawer direction=\"right\" isOpen={open} onClose={() => setOpen(false)}>\n        <Drawer.Header>\n          Aliquam fringilla quam vel purus rhoncus isuere. Morbi augue augue,\n          venenatis vel consectetur sed, vulputate et lorem. Int\n        </Drawer.Header>\n        <Drawer.Content>\n          <Text>\n            Aliquam fringilla quam vel purus rhoncus interdum in quis sapien.\n            Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis\n            vel consectetur sed, vulputate et lorem. Integer venenatis nibh\n            molestie commodo lobortis. Phasellus sit amet dignissim nisi.\n            Vivamus nisi augue, scelerisque commodo libero vitae, vulputate\n            interdum ex. Integer non risus sollicitudin, cursus ipsum vitae,\n            rhoncus nulla.\n          </Text>\n          <Text>\n            Aliquam fringilla quam vel purus rhoncus interdum in quis sapien.\n            Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis\n            vel consectetur sed, vulputate et lorem. Integer venenatis nibh\n            molestie commodo lobortis. Phasellus sit amet dignissim nisi.\n            Vivamus nisi augue, scelerisque commodo libero vitae, vulputate\n            interdum ex. Integer non risus sollicitudin, cursus ipsum vitae,\n            rhoncus nulla.\n          </Text>\n          <Text>\n            Aliquam fringilla quam vel purus rhoncus interdum in quis sapien.\n            Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis\n            vel consectetur sed, vulputate et lorem. Integer venenatis nibh\n            molestie commodo lobortis. Phasellus sit amet dignissim nisi.\n            Vivamus nisi augue, scelerisque commodo libero vitae, vulputate\n            interdum ex. Integer non risus sollicitudin, cursus ipsum vitae,\n            rhoncus nulla.\n          </Text>\n          <Text>\n            Aliquam fringilla quam vel purus rhoncus interdum in quis sapien.\n            Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis\n            vel consectetur sed, vulputate et lorem. Integer venenatis nibh\n            molestie commodo lobortis. Phasellus sit amet dignissim nisi.\n            Vivamus nisi augue, scelerisque commodo libero vitae, vulputate\n            interdum ex. Integer non risus sollicitudin, cursus ipsum vitae,\n            rhoncus nulla.\n          </Text>\n          <Text>\n            Aliquam fringilla quam vel purus rhoncus interdum in quis sapien.\n            Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis\n            vel consectetur sed, vulputate et lorem. Integer venenatis nibh\n            molestie commodo lobortis. Phasellus sit amet dignissim nisi.\n            Vivamus nisi augue, scelerisque commodo libero vitae, vulputate\n            interdum ex. Integer non risus sollicitudin, cursus ipsum vitae,\n            rhoncus nulla.\n          </Text>\n          <Text>\n            Aliquam fringilla quam vel purus rhoncus interdum in quis sapien.\n            Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis\n            vel consectetur sed, vulputate et lorem. Integer venenatis nibh\n            molestie commodo lobortis. Phasellus sit amet dignissim nisi.\n            Vivamus nisi augue, scelerisque commodo libero vitae, vulputate\n            interdum ex. Integer non risus sollicitudin, cursus ipsum vitae,\n            rhoncus nulla.\n          </Text>\n          <Text>\n            Aliquam fringilla quam vel purus rhoncus interdum in quis sapien.\n            Sed at eros et lectus mollis posuere. Morbi augue augue, venenatis\n            vel consectetur sed, vulputate et lorem. Integer venenatis nibh\n            molestie commodo lobortis. Phasellus sit amet dignissim nisi.\n            Vivamus nisi augue, scelerisque commodo libero vitae, vulputate\n            interdum ex. Integer non risus sollicitudin, cursus ipsum vitae,\n            rhoncus nulla.\n          </Text>\n        </Drawer.Content>\n      </Drawer>\n    </>\n  );\n};\n\nexport const Normal: StoryType = {\n  render: (args: DrawerProps) => <Demo {...args} />,\n  args: {\n    direction: \"right\",\n    closeLabel: \"Close\",\n  },\n};\n\nexport const WithLogoHeader: StoryType = {\n  render: (args: DrawerProps) => <LogoHeader {...args} />,\n  args: {\n    direction: \"right\",\n    closeLabel: \"Close\",\n  },\n};\n\nexport const WithLongContent: StoryType = {\n  render: () => <WithLongContentDemo />,\n  args: {},\n};\n\nexport default meta;\n"],"names":["useState","Drawer","excludeControls","Button","Text","Accordion","meta","title","component","argTypes","direction","options","control","type","Demo","props","open","setOpen","onClick","onClose","isOpen","Header","Content","p","showText","hideText","headerPosition","startOpen","LogoHeader","closeLabel","img","src","alt","WithLongContentDemo","Normal","render","args","WithLogoHeader","WithLongContent"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AACA,SAASA,QAAQ,QAAQ,QAAQ;AACjC,SAASC,MAAM,QAAqB,IAAI;AACxC,SAASC,eAAe,QAAQ,cAAc;AAC9C,SAASC,MAAM,QAAQ,YAAY;AACnC,SAASC,IAAI,QAAQ,UAAU;AAC/B,SAASC,SAAS,QAAQ,eAAe;AAIzC,MAAMC,OAA4B;IAChCC,OAAO;IACPC,WAAWP;IACXQ,UAAU;QACRC,WAAW;YACTC,SAAS;gBAAC;gBAAO;gBAAU;gBAAQ;aAAQ;YAC3CC,SAAS;gBAAEC,MAAM;YAAQ;QAC3B;QACA,GAAGX,gBAAgB,UAAU,cAAc,WAAW;IACxD;AACF;AAEA,MAAMY,OAAO,CAACC;IACZ,MAAM,CAACC,MAAMC,QAAQ,GAAGjB,SAAS;IACjC,qBACE;;0BACE,KAACG;gBAAOe,SAAS,IAAMD,QAAQ;0BAAO;;0BACtC,MAAChB;gBAAQ,GAAGc,KAAK;gBAAEI,SAAS,IAAMF,QAAQ;gBAAQG,QAAQJ;;kCACxD,KAACf,OAAOoB,MAAM;kCAAC;;kCACf,MAACpB,OAAOqB,OAAO;;0CACb,KAACC;0CAAE;;0CASH,MAAClB;gCACCmB,UAAS;gCACTC,UAAS;gCACTC,gBAAe;gCACfC,WAAW;;kDAEX,KAACJ;kDAAE;;kDAIH,KAACA;kDAAE;;;;;;;;;;AASf;AAEA,MAAMK,aAAa,CAAC,EAAElB,SAAS,EAAEmB,UAAU,EAAe;IACxD,MAAM,CAACb,MAAMC,QAAQ,GAAGjB,SAAS;IACjC,qBACE;;0BACE,KAACG;gBAAOe,SAAS,IAAMD,QAAQ;0BAAO;;0BACtC,MAAChB;gBACCmB,QAAQJ;gBACRG,SAAS,IAAMF,QAAQ;gBACvBP,WAAWA;gBACXmB,YAAYA;;kCAEZ,KAAC5B,OAAOoB,MAAM;kCACZ,cAAA,KAACS;4BACCC,KAAI;4BACJC,KAAI;;;kCAGR,KAAC/B,OAAOqB,OAAO;kCAAC;;;;;;AAIxB;AAEA,MAAMW,sBAAsB;IAC1B,MAAM,CAACjB,MAAMC,QAAQ,GAAGjB,SAAS;IACjC,qBACE;;0BACE,KAACG;gBAAOe,SAAS,IAAMD,QAAQ;0BAAO;;0BACtC,MAAChB;gBAAOS,WAAU;gBAAQU,QAAQJ;gBAAMG,SAAS,IAAMF,QAAQ;;kCAC7D,KAAChB,OAAOoB,MAAM;kCAAC;;kCAIf,MAACpB,OAAOqB,OAAO;;0CACb,KAAClB;0CAAK;;0CASN,KAACA;0CAAK;;0CASN,KAACA;0CAAK;;0CASN,KAACA;0CAAK;;0CASN,KAACA;0CAAK;;0CASN,KAACA;0CAAK;;0CASN,KAACA;0CAAK;;;;;;;;AAahB;AAEA,OAAO,MAAM8B,SAAoB;IAC/BC,QAAQ,CAACC,qBAAsB,KAACtB;YAAM,GAAGsB,IAAI;;IAC7CA,MAAM;QACJ1B,WAAW;QACXmB,YAAY;IACd;AACF,EAAE;AAEF,OAAO,MAAMQ,iBAA4B;IACvCF,QAAQ,CAACC,qBAAsB,KAACR;YAAY,GAAGQ,IAAI;;IACnDA,MAAM;QACJ1B,WAAW;QACXmB,YAAY;IACd;AACF,EAAE;AAEF,OAAO,MAAMS,kBAA6B;IACxCH,QAAQ,kBAAM,KAACF;IACfG,MAAM,CAAC;AACT,EAAE;AAEF,eAAe9B,KAAK"}

package/dist/esm/components/DropdownMenu/DropdownMenu.stories.js

@@ -1,105 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { chevronDown } from "@simplybusiness/icons";
-import classNames from "classnames/dedupe";
-import { forwardRef } from "react";
-import { DropdownMenu } from ".";
-import { excludeControls } from "../../utils";
-import { StoryContainer } from "../../utils/StoryContainer";
-import { Icon } from "../Icon";
-const meta = {
-    title: "Components/DropdownMenu",
-    component: DropdownMenu,
-    argTypes: excludeControls("trigger", "style"),
-    decorators: [
-        (Story)=>{
-            // eslint-disable-next-line global-require
-            require("./DropdownMenu.story.styles.css");
-            return /*#__PURE__*/ _jsx(StoryContainer, {
-                children: /*#__PURE__*/ _jsx(Story, {})
-            });
-        }
-    ]
-};
-const CustomTrigger = /*#__PURE__*/ forwardRef((props, ref)=>{
-    const { className, open, ...otherProps } = props;
-    const classes = classNames({
-        "--is-open": open
-    });
-    return /*#__PURE__*/ _jsxs("button", {
-        ref: ref,
-        type: "button",
-        className: className,
-        ...otherProps,
-        children: [
-            open ? "Close" : "Open",
-            " ",
-            /*#__PURE__*/ _jsx(Icon, {
-                icon: chevronDown,
-                className: classes
-            })
-        ]
-    });
-});
-export const Normal = {
-    render: (args)=>/*#__PURE__*/ _jsx("div", {
-            style: {
-                height: 300
-            },
-            children: /*#__PURE__*/ _jsxs(DropdownMenu, {
-                ...args,
-                children: [
-                    /*#__PURE__*/ _jsx(DropdownMenu.Item, {
-                        children: "Home"
-                    }),
-                    /*#__PURE__*/ _jsx(DropdownMenu.Item, {
-                        children: "My details"
-                    }),
-                    /*#__PURE__*/ _jsx(DropdownMenu.Item, {
-                        children: /*#__PURE__*/ _jsx("a", {
-                            href: "./?path=/docs/components-dropdownmenu--docs",
-                            children: "Sign out"
-                        })
-                    })
-                ]
-            })
-        }),
-    args: {
-        label: "Menu"
-    }
-};
-export const WithCustomTrigger = {
-    render: (args)=>/*#__PURE__*/ _jsx("div", {
-            style: {
-                height: 300
-            },
-            className: "dropdownmenu-example-custom-trigger",
-            children: /*#__PURE__*/ _jsxs(DropdownMenu, {
-                ...args,
-                children: [
-                    /*#__PURE__*/ _jsx(DropdownMenu.Item, {
-                        onClick: ()=>alert("Clicked Home"),
-                        children: "Home"
-                    }),
-                    /*#__PURE__*/ _jsx(DropdownMenu.Item, {
-                        children: "My details"
-                    }),
-                    /*#__PURE__*/ _jsx(DropdownMenu.Item, {
-                        children: "Sign out"
-                    })
-                ]
-            })
-        }),
-    args: {
-        trigger: /*#__PURE__*/ _jsx(CustomTrigger, {})
-    },
-    parameters: {
-        controls: {
-            exclude: [
-                "label"
-            ]
-        }
-    }
-};
-export default meta;
-
-//# sourceMappingURL=DropdownMenu.stories.js.map

package/dist/esm/components/DropdownMenu/DropdownMenu.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/components/DropdownMenu/DropdownMenu.stories.tsx"],"sourcesContent":["import { chevronDown } from \"@simplybusiness/icons\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport classNames from \"classnames/dedupe\";\nimport { Ref, forwardRef } from \"react\";\nimport { DropdownMenu, DropdownMenuProps } from \".\";\nimport { excludeControls } from \"../../utils\";\nimport { StoryContainer } from \"../../utils/StoryContainer\";\nimport { Icon } from \"../Icon\";\n\ntype StoryType = StoryObj<typeof DropdownMenu>;\n\nconst meta: Meta<typeof DropdownMenu> = {\n  title: \"Components/DropdownMenu\",\n  component: DropdownMenu,\n  argTypes: excludeControls(\"trigger\", \"style\"),\n  decorators: [\n    Story => {\n      // eslint-disable-next-line global-require\n      require(\"./DropdownMenu.story.styles.css\");\n\n      return (\n        <StoryContainer>\n          <Story />\n        </StoryContainer>\n      );\n    },\n  ],\n};\n\ntype CustomTriggerProps = {\n  className?: string;\n  open?: boolean;\n};\n\nconst CustomTrigger = forwardRef(\n  (props: CustomTriggerProps, ref: Ref<HTMLButtonElement>) => {\n    const { className, open, ...otherProps } = props;\n    const classes = classNames({\n      \"--is-open\": open,\n    });\n    return (\n      <button ref={ref} type=\"button\" className={className} {...otherProps}>\n        {open ? \"Close\" : \"Open\"}{\" \"}\n        <Icon icon={chevronDown} className={classes} />\n      </button>\n    );\n  },\n);\n\nexport const Normal: StoryType = {\n  render: (args: DropdownMenuProps) => (\n    <div\n      style={{\n        height: 300,\n      }}\n    >\n      <DropdownMenu {...args}>\n        <DropdownMenu.Item>Home</DropdownMenu.Item>\n        <DropdownMenu.Item>My details</DropdownMenu.Item>\n        <DropdownMenu.Item>\n          <a href=\"./?path=/docs/components-dropdownmenu--docs\">Sign out</a>\n        </DropdownMenu.Item>\n      </DropdownMenu>\n    </div>\n  ),\n  args: {\n    label: \"Menu\",\n  },\n};\n\nexport const WithCustomTrigger: StoryType = {\n  render: (args: DropdownMenuProps) => (\n    <div\n      style={{\n        height: 300,\n      }}\n      className=\"dropdownmenu-example-custom-trigger\"\n    >\n      <DropdownMenu {...args}>\n        {/* eslint-disable-next-line no-alert */}\n        <DropdownMenu.Item onClick={() => alert(\"Clicked Home\")}>\n          Home\n        </DropdownMenu.Item>\n        <DropdownMenu.Item>My details</DropdownMenu.Item>\n        <DropdownMenu.Item>Sign out</DropdownMenu.Item>\n      </DropdownMenu>\n    </div>\n  ),\n  args: {\n    trigger: <CustomTrigger />,\n  },\n  parameters: {\n    controls: {\n      exclude: [\"label\"],\n    },\n  },\n};\n\nexport default meta;\n"],"names":["chevronDown","classNames","forwardRef","DropdownMenu","excludeControls","StoryContainer","Icon","meta","title","component","argTypes","decorators","Story","require","CustomTrigger","props","ref","className","open","otherProps","classes","button","type","icon","Normal","render","args","div","style","height","Item","a","href","label","WithCustomTrigger","onClick","alert","trigger","parameters","controls","exclude"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,WAAW,QAAQ,wBAAwB;AAEpD,OAAOC,gBAAgB,oBAAoB;AAC3C,SAAcC,UAAU,QAAQ,QAAQ;AACxC,SAASC,YAAY,QAA2B,IAAI;AACpD,SAASC,eAAe,QAAQ,cAAc;AAC9C,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,IAAI,QAAQ,UAAU;AAI/B,MAAMC,OAAkC;IACtCC,OAAO;IACPC,WAAWN;IACXO,UAAUN,gBAAgB,WAAW;IACrCO,YAAY;QACVC,CAAAA;YACE,0CAA0C;YAC1CC,QAAQ;YAER,qBACE,KAACR;0BACC,cAAA,KAACO;;QAGP;KACD;AACH;AAOA,MAAME,8BAAgBZ,WACpB,CAACa,OAA2BC;IAC1B,MAAM,EAAEC,SAAS,EAAEC,IAAI,EAAE,GAAGC,YAAY,GAAGJ;IAC3C,MAAMK,UAAUnB,WAAW;QACzB,aAAaiB;IACf;IACA,qBACE,MAACG;QAAOL,KAAKA;QAAKM,MAAK;QAASL,WAAWA;QAAY,GAAGE,UAAU;;YACjED,OAAO,UAAU;YAAQ;0BAC1B,KAACZ;gBAAKiB,MAAMvB;gBAAaiB,WAAWG;;;;AAG1C;AAGF,OAAO,MAAMI,SAAoB;IAC/BC,QAAQ,CAACC,qBACP,KAACC;YACCC,OAAO;gBACLC,QAAQ;YACV;sBAEA,cAAA,MAAC1B;gBAAc,GAAGuB,IAAI;;kCACpB,KAACvB,aAAa2B,IAAI;kCAAC;;kCACnB,KAAC3B,aAAa2B,IAAI;kCAAC;;kCACnB,KAAC3B,aAAa2B,IAAI;kCAChB,cAAA,KAACC;4BAAEC,MAAK;sCAA8C;;;;;;IAK9DN,MAAM;QACJO,OAAO;IACT;AACF,EAAE;AAEF,OAAO,MAAMC,oBAA+B;IAC1CT,QAAQ,CAACC,qBACP,KAACC;YACCC,OAAO;gBACLC,QAAQ;YACV;YACAZ,WAAU;sBAEV,cAAA,MAACd;gBAAc,GAAGuB,IAAI;;kCAEpB,KAACvB,aAAa2B,IAAI;wBAACK,SAAS,IAAMC,MAAM;kCAAiB;;kCAGzD,KAACjC,aAAa2B,IAAI;kCAAC;;kCACnB,KAAC3B,aAAa2B,IAAI;kCAAC;;;;;IAIzBJ,MAAM;QACJW,uBAAS,KAACvB;IACZ;IACAwB,YAAY;QACVC,UAAU;YACRC,SAAS;gBAAC;aAAQ;QACpB;IACF;AACF,EAAE;AAEF,eAAejC,KAAK"}

package/dist/esm/components/ErrorMessage/ErrorMessage.stories.js

@@ -1,25 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { ErrorMessage } from ".";
-const meta = {
-    title: "Forms/ErrorMessage",
-    component: ErrorMessage
-};
-export const Normal = {
-    render: (args)=>/*#__PURE__*/ _jsx(ErrorMessage, {
-            ...args
-        }),
-    args: {
-        errorMessage: "This is an error message"
-    }
-};
-export const LongMessage = {
-    render: (args)=>/*#__PURE__*/ _jsx(ErrorMessage, {
-            ...args
-        }),
-    args: {
-        errorMessage: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vestibulum, mauris ac egestas rutrum, dui urna imperdiet velit, ac malesuada velit augue eget orci. Duis id purus et elit tempus egestas ut eget tellus. Praesent tempus sit amet metus iaculis auctor. Morbi aliquet nibh sit amet neque congue dictum. Proin auctor pellentesque facilisis. Donec rutrum at ante a pulvinar. In hac habitasse platea dictumst. Mauris non blandit nulla. Duis facilisis fringilla cursus. Interdum et malesuada fames ac ante ipsum primis in faucibus."
-    }
-};
-export default meta;
-
-//# sourceMappingURL=ErrorMessage.stories.js.map

package/dist/esm/components/ErrorMessage/ErrorMessage.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/components/ErrorMessage/ErrorMessage.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { ErrorMessage, ErrorMessageProps } from \".\";\n\ntype StoryType = StoryObj<typeof ErrorMessage>;\n\nconst meta: Meta<typeof ErrorMessage> = {\n  title: \"Forms/ErrorMessage\",\n  component: ErrorMessage,\n};\n\nexport const Normal: StoryType = {\n  render: (args: ErrorMessageProps) => <ErrorMessage {...args} />,\n  args: {\n    errorMessage: \"This is an error message\",\n  },\n};\n\nexport const LongMessage: StoryType = {\n  render: (args: ErrorMessageProps) => <ErrorMessage {...args} />,\n  args: {\n    errorMessage:\n      \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vestibulum, mauris ac egestas rutrum, dui urna imperdiet velit, ac malesuada velit augue eget orci. Duis id purus et elit tempus egestas ut eget tellus. Praesent tempus sit amet metus iaculis auctor. Morbi aliquet nibh sit amet neque congue dictum. Proin auctor pellentesque facilisis. Donec rutrum at ante a pulvinar. In hac habitasse platea dictumst. Mauris non blandit nulla. Duis facilisis fringilla cursus. Interdum et malesuada fames ac ante ipsum primis in faucibus.\",\n  },\n};\n\nexport default meta;\n"],"names":["ErrorMessage","meta","title","component","Normal","render","args","errorMessage","LongMessage"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";AACA,SAASA,YAAY,QAA2B,IAAI;AAIpD,MAAMC,OAAkC;IACtCC,OAAO;IACPC,WAAWH;AACb;AAEA,OAAO,MAAMI,SAAoB;IAC/BC,QAAQ,CAACC,qBAA4B,KAACN;YAAc,GAAGM,IAAI;;IAC3DA,MAAM;QACJC,cAAc;IAChB;AACF,EAAE;AAEF,OAAO,MAAMC,cAAyB;IACpCH,QAAQ,CAACC,qBAA4B,KAACN;YAAc,GAAGM,IAAI;;IAC3DA,MAAM;QACJC,cACE;IACJ;AACF,EAAE;AAEF,eAAeN,KAAK"}

package/dist/esm/components/Fieldset/Fieldset.stories.js

@@ -1,68 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { excludeControls } from "../../utils";
-import { StoryContainer } from "../../utils/StoryContainer";
-import { TextField } from "../TextField";
-import { Fieldset } from "./Fieldset";
-const meta = {
-    title: "Forms/Fieldset",
-    component: Fieldset,
-    argTypes: excludeControls("legendComponent")
-};
-export const Normal = {
-    render: (args)=>/*#__PURE__*/ _jsxs(Fieldset, {
-            ...args,
-            children: [
-                /*#__PURE__*/ _jsx(TextField, {
-                    label: "Full name"
-                }),
-                /*#__PURE__*/ _jsx(TextField, {
-                    label: "Street"
-                }),
-                /*#__PURE__*/ _jsx(TextField, {
-                    label: "Number"
-                }),
-                /*#__PURE__*/ _jsx(TextField, {
-                    label: "City"
-                }),
-                /*#__PURE__*/ _jsx(TextField, {
-                    label: "Postcode"
-                })
-            ]
-        }),
-    args: {
-        legend: ""
-    },
-    decorators: [
-        (Story)=>/*#__PURE__*/ _jsx(StoryContainer, {
-                children: /*#__PURE__*/ _jsx(Story, {})
-            })
-    ]
-};
-export const WithLegend = {
-    render: (args)=>/*#__PURE__*/ _jsxs(Fieldset, {
-            ...args,
-            children: [
-                /*#__PURE__*/ _jsx(TextField, {
-                    label: "Full name"
-                }),
-                /*#__PURE__*/ _jsx(TextField, {
-                    label: "Street"
-                }),
-                /*#__PURE__*/ _jsx(TextField, {
-                    label: "Number"
-                }),
-                /*#__PURE__*/ _jsx(TextField, {
-                    label: "City"
-                }),
-                /*#__PURE__*/ _jsx(TextField, {
-                    label: "Postcode"
-                })
-            ]
-        }),
-    args: {
-        legend: "Contact Details"
-    }
-};
-export default meta;
-
-//# sourceMappingURL=Fieldset.stories.js.map

package/dist/esm/components/Fieldset/Fieldset.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/components/Fieldset/Fieldset.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { excludeControls } from \"../../utils\";\nimport { StoryContainer } from \"../../utils/StoryContainer\";\nimport { TextField } from \"../TextField\";\nimport { Fieldset, FieldsetProps } from \"./Fieldset\";\n\ntype StoryType = StoryObj<typeof Fieldset>;\n\nconst meta: Meta<typeof Fieldset> = {\n  title: \"Forms/Fieldset\",\n  component: Fieldset,\n  argTypes: excludeControls(\"legendComponent\"),\n};\n\nexport const Normal: StoryType = {\n  render: (args: FieldsetProps) => (\n    <Fieldset {...args}>\n      <TextField label=\"Full name\" />\n      <TextField label=\"Street\" />\n      <TextField label=\"Number\" />\n      <TextField label=\"City\" />\n      <TextField label=\"Postcode\" />\n    </Fieldset>\n  ),\n  args: {\n    legend: \"\",\n  },\n  decorators: [\n    Story => (\n      <StoryContainer>\n        <Story />\n      </StoryContainer>\n    ),\n  ],\n};\n\nexport const WithLegend: StoryType = {\n  render: (args: FieldsetProps) => (\n    <Fieldset {...args}>\n      <TextField label=\"Full name\" />\n      <TextField label=\"Street\" />\n      <TextField label=\"Number\" />\n      <TextField label=\"City\" />\n      <TextField label=\"Postcode\" />\n    </Fieldset>\n  ),\n  args: {\n    legend: \"Contact Details\",\n  },\n};\n\nexport default meta;\n"],"names":["excludeControls","StoryContainer","TextField","Fieldset","meta","title","component","argTypes","Normal","render","args","label","legend","decorators","Story","WithLegend"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AACA,SAASA,eAAe,QAAQ,cAAc;AAC9C,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,SAAS,QAAQ,eAAe;AACzC,SAASC,QAAQ,QAAuB,aAAa;AAIrD,MAAMC,OAA8B;IAClCC,OAAO;IACPC,WAAWH;IACXI,UAAUP,gBAAgB;AAC5B;AAEA,OAAO,MAAMQ,SAAoB;IAC/BC,QAAQ,CAACC,qBACP,MAACP;YAAU,GAAGO,IAAI;;8BAChB,KAACR;oBAAUS,OAAM;;8BACjB,KAACT;oBAAUS,OAAM;;8BACjB,KAACT;oBAAUS,OAAM;;8BACjB,KAACT;oBAAUS,OAAM;;8BACjB,KAACT;oBAAUS,OAAM;;;;IAGrBD,MAAM;QACJE,QAAQ;IACV;IACAC,YAAY;QACVC,CAAAA,sBACE,KAACb;0BACC,cAAA,KAACa;;KAGN;AACH,EAAE;AAEF,OAAO,MAAMC,aAAwB;IACnCN,QAAQ,CAACC,qBACP,MAACP;YAAU,GAAGO,IAAI;;8BAChB,KAACR;oBAAUS,OAAM;;8BACjB,KAACT;oBAAUS,OAAM;;8BACjB,KAACT;oBAAUS,OAAM;;8BACjB,KAACT;oBAAUS,OAAM;;8BACjB,KAACT;oBAAUS,OAAM;;;;IAGrBD,MAAM;QACJE,QAAQ;IACV;AACF,EAAE;AAEF,eAAeR,KAAK"}

package/dist/esm/components/Flex/Flex.stories.js

@@ -1,203 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Flex } from "./Flex";
-import { Box } from "../Box";
-import { excludeControls, sizeOptions } from "../../utils";
-const meta = {
-    title: "Layout/Flex",
-    component: Flex,
-    argTypes: {
-        flexDirection: {
-            control: {
-                type: "select"
-            },
-            options: [
-                "",
-                "row",
-                "row-reverse",
-                "column",
-                "column-reverse"
-            ]
-        },
-        flexWrap: {
-            control: {
-                type: "select"
-            },
-            options: [
-                "",
-                "nowrap",
-                "wrap",
-                "wrap-reverse"
-            ]
-        },
-        flexGrow: {
-            control: {
-                type: "text"
-            },
-            if: {
-                arg: "flex",
-                truthy: false
-            }
-        },
-        flex: {
-            control: {
-                type: "text"
-            }
-        },
-        justifyContent: {
-            control: {
-                type: "select"
-            },
-            options: [
-                "",
-                "space-around",
-                "space-between",
-                "space-evenly",
-                "stretch",
-                "center",
-                "end",
-                "flex-end",
-                "flex-start",
-                "start",
-                "left",
-                "normal",
-                "right"
-            ]
-        },
-        alignItems: {
-            control: {
-                type: "select"
-            },
-            options: [
-                "",
-                "center",
-                "end",
-                "flex-end",
-                "flex-start",
-                "self-end",
-                "self-start",
-                "start",
-                "baseline",
-                "normal",
-                "stretch"
-            ]
-        },
-        alignContent: {
-            control: {
-                type: "select"
-            },
-            options: [
-                "",
-                "space-around",
-                "space-between",
-                "space-evenly",
-                "stretch",
-                "center",
-                "end",
-                "flex-end",
-                "flex-start",
-                "start",
-                "baseline",
-                "normal"
-            ]
-        },
-        gap: {
-            control: {
-                type: "select"
-            },
-            options: [
-                ...sizeOptions
-            ]
-        },
-        rowGap: {
-            control: {
-                type: "select"
-            },
-            options: [
-                ...sizeOptions
-            ],
-            if: {
-                arg: "gap",
-                truthy: false
-            }
-        },
-        columnGap: {
-            control: {
-                type: "select"
-            },
-            options: [
-                ...sizeOptions
-            ],
-            if: {
-                arg: "gap",
-                truthy: false
-            }
-        },
-        ...excludeControls("style", "role")
-    }
-};
-const Card = ({ children, style, ...props })=>/*#__PURE__*/ _jsx(Box, {
-        style: {
-            borderRadius: "4px",
-            padding: "8px",
-            backgroundColor: "#dddddd",
-            width: "100%",
-            ...style
-        },
-        ...props,
-        children: children
-    });
-export const RowLayout = {
-    render: (args)=>/*#__PURE__*/ _jsxs(Flex, {
-            ...args,
-            children: [
-                /*#__PURE__*/ _jsx(Card, {
-                    children: "Item"
-                }),
-                /*#__PURE__*/ _jsx(Card, {
-                    children: "Item"
-                }),
-                /*#__PURE__*/ _jsx(Card, {
-                    children: "Item"
-                })
-            ]
-        }),
-    args: {
-        flexDirection: "row",
-        flexWrap: "nowrap",
-        flexGrow: "0",
-        flex: "1 1 0px",
-        justifyContent: "normal",
-        alignItems: "stretch",
-        alignContent: "flex-start",
-        gap: "xs"
-    }
-};
-export const ColumnLayout = {
-    render: (args)=>/*#__PURE__*/ _jsxs(Flex, {
-            ...args,
-            children: [
-                /*#__PURE__*/ _jsx(Card, {
-                    children: "Item"
-                }),
-                /*#__PURE__*/ _jsx(Card, {
-                    children: "Item"
-                }),
-                /*#__PURE__*/ _jsx(Card, {
-                    children: "Item"
-                })
-            ]
-        }),
-    args: {
-        flexDirection: "column",
-        flexWrap: "nowrap",
-        flexGrow: "0",
-        flex: "1 1 0px",
-        justifyContent: "normal",
-        alignItems: "stretch",
-        alignContent: "normal",
-        gap: "xs"
-    }
-};
-export default meta;
-
-//# sourceMappingURL=Flex.stories.js.map

package/dist/esm/components/Flex/Flex.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/components/Flex/Flex.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { CSSProperties, ReactNode } from \"react\";\nimport { Flex } from \"./Flex\";\nimport { Box } from \"../Box\";\nimport { excludeControls, sizeOptions } from \"../../utils\";\nimport { FlexProps } from \"./types\";\n\ntype StoryType = StoryObj<typeof Flex>;\n\nconst meta: Meta<typeof Flex> = {\n  title: \"Layout/Flex\",\n  component: Flex,\n  argTypes: {\n    flexDirection: {\n      control: { type: \"select\" },\n      options: [\"\", \"row\", \"row-reverse\", \"column\", \"column-reverse\"],\n    },\n    flexWrap: {\n      control: { type: \"select\" },\n      options: [\"\", \"nowrap\", \"wrap\", \"wrap-reverse\"],\n    },\n    flexGrow: {\n      control: { type: \"text\" },\n      if: {\n        arg: \"flex\",\n        truthy: false,\n      },\n    },\n    flex: {\n      control: { type: \"text\" },\n    },\n    justifyContent: {\n      control: { type: \"select\" },\n      options: [\n        \"\",\n        \"space-around\",\n        \"space-between\",\n        \"space-evenly\",\n        \"stretch\",\n        \"center\",\n        \"end\",\n        \"flex-end\",\n        \"flex-start\",\n        \"start\",\n        \"left\",\n        \"normal\",\n        \"right\",\n      ],\n    },\n    alignItems: {\n      control: { type: \"select\" },\n      options: [\n        \"\",\n        \"center\",\n        \"end\",\n        \"flex-end\",\n        \"flex-start\",\n        \"self-end\",\n        \"self-start\",\n        \"start\",\n        \"baseline\",\n        \"normal\",\n        \"stretch\",\n      ],\n    },\n    alignContent: {\n      control: { type: \"select\" },\n      options: [\n        \"\",\n        \"space-around\",\n        \"space-between\",\n        \"space-evenly\",\n        \"stretch\",\n        \"center\",\n        \"end\",\n        \"flex-end\",\n        \"flex-start\",\n        \"start\",\n        \"baseline\",\n        \"normal\",\n      ],\n    },\n    gap: {\n      control: { type: \"select\" },\n      options: [...sizeOptions],\n    },\n    rowGap: {\n      control: { type: \"select\" },\n      options: [...sizeOptions],\n      if: {\n        arg: \"gap\",\n        truthy: false,\n      },\n    },\n    columnGap: {\n      control: { type: \"select\" },\n      options: [...sizeOptions],\n      if: {\n        arg: \"gap\",\n        truthy: false,\n      },\n    },\n    ...excludeControls(\"style\", \"role\"),\n  },\n};\n\ntype CardProps = {\n  children: ReactNode;\n  style?: CSSProperties;\n};\n\nconst Card = ({ children, style, ...props }: CardProps) => (\n  <Box\n    style={{\n      borderRadius: \"4px\",\n      padding: \"8px\",\n      backgroundColor: \"#dddddd\",\n      width: \"100%\",\n      ...style,\n    }}\n    {...props}\n  >\n    {children}\n  </Box>\n);\n\nexport const RowLayout: StoryType = {\n  render: (args: FlexProps) => (\n    <Flex {...args}>\n      <Card>Item</Card>\n      <Card>Item</Card>\n      <Card>Item</Card>\n    </Flex>\n  ),\n  args: {\n    flexDirection: \"row\",\n    flexWrap: \"nowrap\",\n    flexGrow: \"0\",\n    flex: \"1 1 0px\",\n    justifyContent: \"normal\",\n    alignItems: \"stretch\",\n    alignContent: \"flex-start\",\n    gap: \"xs\",\n  },\n};\n\nexport const ColumnLayout: StoryType = {\n  render: (args: FlexProps) => (\n    <Flex {...args}>\n      <Card>Item</Card>\n      <Card>Item</Card>\n      <Card>Item</Card>\n    </Flex>\n  ),\n  args: {\n    flexDirection: \"column\",\n    flexWrap: \"nowrap\",\n    flexGrow: \"0\",\n    flex: \"1 1 0px\",\n    justifyContent: \"normal\",\n    alignItems: \"stretch\",\n    alignContent: \"normal\",\n    gap: \"xs\",\n  },\n};\n\nexport default meta;\n"],"names":["Flex","Box","excludeControls","sizeOptions","meta","title","component","argTypes","flexDirection","control","type","options","flexWrap","flexGrow","if","arg","truthy","flex","justifyContent","alignItems","alignContent","gap","rowGap","columnGap","Card","children","style","props","borderRadius","padding","backgroundColor","width","RowLayout","render","args","ColumnLayout"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAEA,SAASA,IAAI,QAAQ,SAAS;AAC9B,SAASC,GAAG,QAAQ,SAAS;AAC7B,SAASC,eAAe,EAAEC,WAAW,QAAQ,cAAc;AAK3D,MAAMC,OAA0B;IAC9BC,OAAO;IACPC,WAAWN;IACXO,UAAU;QACRC,eAAe;YACbC,SAAS;gBAAEC,MAAM;YAAS;YAC1BC,SAAS;gBAAC;gBAAI;gBAAO;gBAAe;gBAAU;aAAiB;QACjE;QACAC,UAAU;YACRH,SAAS;gBAAEC,MAAM;YAAS;YAC1BC,SAAS;gBAAC;gBAAI;gBAAU;gBAAQ;aAAe;QACjD;QACAE,UAAU;YACRJ,SAAS;gBAAEC,MAAM;YAAO;YACxBI,IAAI;gBACFC,KAAK;gBACLC,QAAQ;YACV;QACF;QACAC,MAAM;YACJR,SAAS;gBAAEC,MAAM;YAAO;QAC1B;QACAQ,gBAAgB;YACdT,SAAS;gBAAEC,MAAM;YAAS;YAC1BC,SAAS;gBACP;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;aACD;QACH;QACAQ,YAAY;YACVV,SAAS;gBAAEC,MAAM;YAAS;YAC1BC,SAAS;gBACP;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;aACD;QACH;QACAS,cAAc;YACZX,SAAS;gBAAEC,MAAM;YAAS;YAC1BC,SAAS;gBACP;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;aACD;QACH;QACAU,KAAK;YACHZ,SAAS;gBAAEC,MAAM;YAAS;YAC1BC,SAAS;mBAAIR;aAAY;QAC3B;QACAmB,QAAQ;YACNb,SAAS;gBAAEC,MAAM;YAAS;YAC1BC,SAAS;mBAAIR;aAAY;YACzBW,IAAI;gBACFC,KAAK;gBACLC,QAAQ;YACV;QACF;QACAO,WAAW;YACTd,SAAS;gBAAEC,MAAM;YAAS;YAC1BC,SAAS;mBAAIR;aAAY;YACzBW,IAAI;gBACFC,KAAK;gBACLC,QAAQ;YACV;QACF;QACA,GAAGd,gBAAgB,SAAS,OAAO;IACrC;AACF;AAOA,MAAMsB,OAAO,CAAC,EAAEC,QAAQ,EAAEC,KAAK,EAAE,GAAGC,OAAkB,iBACpD,KAAC1B;QACCyB,OAAO;YACLE,cAAc;YACdC,SAAS;YACTC,iBAAiB;YACjBC,OAAO;YACP,GAAGL,KAAK;QACV;QACC,GAAGC,KAAK;kBAERF;;AAIL,OAAO,MAAMO,YAAuB;IAClCC,QAAQ,CAACC,qBACP,MAAClC;YAAM,GAAGkC,IAAI;;8BACZ,KAACV;8BAAK;;8BACN,KAACA;8BAAK;;8BACN,KAACA;8BAAK;;;;IAGVU,MAAM;QACJ1B,eAAe;QACfI,UAAU;QACVC,UAAU;QACVI,MAAM;QACNC,gBAAgB;QAChBC,YAAY;QACZC,cAAc;QACdC,KAAK;IACP;AACF,EAAE;AAEF,OAAO,MAAMc,eAA0B;IACrCF,QAAQ,CAACC,qBACP,MAAClC;YAAM,GAAGkC,IAAI;;8BACZ,KAACV;8BAAK;;8BACN,KAACA;8BAAK;;8BACN,KAACA;8BAAK;;;;IAGVU,MAAM;QACJ1B,eAAe;QACfI,UAAU;QACVC,UAAU;QACVI,MAAM;QACNC,gBAAgB;QAChBC,YAAY;QACZC,cAAc;QACdC,KAAK;IACP;AACF,EAAE;AAEF,eAAejB,KAAK"}