@webiny/admin-ui 6.0.0-alpha.0

package/Dialog/Dialog.stories.js

@@ -0,0 +1,375 @@
+import React, { useState } from "react";
+import { library } from "@fortawesome/fontawesome-svg-core";
+import { fas } from "@fortawesome/free-solid-svg-icons";
+import { Dialog } from "./Dialog";
+import { Button } from "../Button";
+import { DropdownMenu } from "../DropdownMenu";
+import { ReactComponent as NotificationIcon } from "@webiny/icons/notifications_active.svg";
+import { Tabs } from "../Tabs";
+import { IconPicker } from "../IconPicker";
+
+// @ts-expect-error
+library.add(fas);
+const meta = {
+  title: "Components/Dialog",
+  component: Dialog,
+  argTypes: {}
+};
+export default meta;
+export const Default = {
+  args: {
+    size: "md",
+    trigger: /*#__PURE__*/React.createElement(Button, {
+      variant: "primary",
+      text: "Open"
+    }),
+    title: "Dialog Title",
+    description: "A short dialog description.",
+    info: /*#__PURE__*/React.createElement(React.Fragment, null, "Learn more about this ", /*#__PURE__*/React.createElement("a", {
+      href: "#"
+    }, "here"), "."),
+    children: /*#__PURE__*/React.createElement(React.Fragment, null, "The amazing, splendid, and most useful umbrella, resistant to rain and friendly to winds, is something that deserves all admiration. Crafted with perfect textures, it bravely withstands storms and gently shades the rays of the sun. A remarkable innovation, with an ergonomically designed grip most suited to the hand, it remains stable even in the fiercest weather."),
+    onOpenChange: opened => {
+      console.log(`Dialog is ${opened ? "opened" : "closed"}.`);
+    },
+    actions: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Dialog.CancelButton, null), /*#__PURE__*/React.createElement(Dialog.ConfirmButton, null))
+  },
+  argTypes: {}
+};
+export const SizeSmall = {
+  args: {
+    ...Default.args,
+    size: "sm"
+  }
+};
+export const SizeMedium = {
+  args: {
+    ...Default.args,
+    size: "md"
+  }
+};
+export const SizeLarge = {
+  args: {
+    ...Default.args,
+    size: "lg"
+  }
+};
+export const SizeExtraLarge = {
+  args: {
+    ...Default.args,
+    size: "xl"
+  }
+};
+export const SizeFullScreen = {
+  args: {
+    ...Default.args,
+    size: "full"
+  }
+};
+export const ControlledVisibility = {
+  render: props => {
+    const [open, setOpen] = React.useState(false);
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
+      variant: "primary",
+      text: "Open",
+      onClick: () => setOpen(true)
+    }), /*#__PURE__*/React.createElement(Dialog, Object.assign({}, props, {
+      open: open,
+      onOpenChange: open => {
+        if (!open) {
+          setOpen(false);
+        }
+      }
+    })));
+  },
+  args: {
+    ...Default.args,
+    trigger: null
+  }
+};
+export const WithOpenCloseEventHandler = {
+  args: {
+    ...Default.args,
+    onClose: () => {
+      console.log("onClose triggered");
+    },
+    onOpen: () => {
+      console.log("onOpen triggered");
+    }
+  }
+};
+export const WithDropdownMenu = {
+  render: props => {
+    const [open, setOpen] = React.useState(false);
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DropdownMenu, {
+      trigger: /*#__PURE__*/React.createElement(Button, {
+        variant: "primary",
+        text: "Open"
+      })
+    }, /*#__PURE__*/React.createElement(DropdownMenu.Item, {
+      text: "Open Dialog",
+      content: "Open Dialog",
+      onClick: () => setOpen(true)
+    })), /*#__PURE__*/React.createElement(Dialog, Object.assign({}, props, {
+      open: open,
+      onOpenChange: () => setOpen(false)
+    })));
+  },
+  args: {
+    ...Default.args,
+    trigger: null
+  }
+};
+export const WithoutCloseButton = {
+  args: {
+    ...Default.args,
+    showCloseButton: false
+  }
+};
+export const AlertDialog = {
+  args: {
+    ...Default.args,
+    info: null,
+    showCloseButton: false,
+    title: "Confirm Action",
+    description: "Are you sure you want to delete this item?",
+    children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("p", null, "This action cannot be undone."), /*#__PURE__*/React.createElement("p", null, "Deleted items cannot be recovered."))
+  }
+};
+export const DropdownMenuInDialog = {
+  args: {
+    ...Default.args,
+    children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DropdownMenu, {
+      trigger: /*#__PURE__*/React.createElement(Button, {
+        variant: "primary",
+        text: "Open"
+      })
+    }, /*#__PURE__*/React.createElement(DropdownMenu.Item, {
+      content: "Billing"
+    }), /*#__PURE__*/React.createElement(DropdownMenu.Item, {
+      content: "Settings"
+    }), /*#__PURE__*/React.createElement(DropdownMenu.Item, {
+      content: "Keyboard shortcuts"
+    })))
+  }
+};
+export const DropdownIconPickerInDialog = {
+  args: {
+    ...Default.args
+  },
+  render: args => {
+    const [value, setValue] = useState("");
+    return /*#__PURE__*/React.createElement(Dialog, args, /*#__PURE__*/React.createElement(IconPicker, {
+      icons: [{
+        prefix: "fas",
+        name: "trash-restore-alt"
+      }, {
+        prefix: "fas",
+        name: "trash-can-arrow-up"
+      }, {
+        prefix: "fas",
+        name: "naira-sign"
+      }, {
+        prefix: "fas",
+        name: "cart-arrow-down"
+      }, {
+        prefix: "fas",
+        name: "walkie-talkie"
+      }, {
+        prefix: "fas",
+        name: "file-edit"
+      }, {
+        prefix: "fas",
+        name: "file-pen"
+      }, {
+        prefix: "fas",
+        name: "receipt"
+      }, {
+        prefix: "fas",
+        name: "pen-square"
+      }, {
+        prefix: "fas",
+        name: "pencil-square"
+      }, {
+        prefix: "fas",
+        name: "square-pen"
+      }, {
+        prefix: "fas",
+        name: "suitcase-rolling"
+      }, {
+        prefix: "fas",
+        name: "person-circle-exclamation"
+      }, {
+        prefix: "fas",
+        name: "chevron-down"
+      }, {
+        prefix: "fas",
+        name: "battery"
+      }, {
+        prefix: "fas",
+        name: "battery-5"
+      }, {
+        prefix: "fas",
+        name: "battery-full"
+      }, {
+        prefix: "fas",
+        name: "skull-crossbones"
+      }, {
+        prefix: "fas",
+        name: "code-compare"
+      }, {
+        prefix: "fas",
+        name: "list-dots"
+      }, {
+        prefix: "fas",
+        name: "list-ul"
+      }, {
+        prefix: "fas",
+        name: "school-lock"
+      }, {
+        prefix: "fas",
+        name: "tower-cell"
+      }, {
+        prefix: "fas",
+        name: "long-arrow-alt-down"
+      }, {
+        prefix: "fas",
+        name: "down-long"
+      }, {
+        prefix: "fas",
+        name: "ranking-star"
+      }, {
+        prefix: "fas",
+        name: "chess-king"
+      }, {
+        prefix: "fas",
+        name: "person-harassing"
+      }, {
+        prefix: "fas",
+        name: "brazilian-real-sign"
+      }, {
+        prefix: "fas",
+        name: "landmark-alt"
+      }],
+      value: value,
+      onChange: value => {
+        console.log("Selected icon:", value);
+        setValue(value);
+      }
+    }));
+  }
+};
+export const WithIcon = {
+  args: {
+    ...Default.args,
+    icon: /*#__PURE__*/React.createElement(Dialog.Icon, {
+      icon: /*#__PURE__*/React.createElement(NotificationIcon, null),
+      label: "Title icon"
+    })
+  }
+};
+export const PreventOutsideDismiss = {
+  args: {
+    ...Default.args,
+    dismissible: false
+  }
+};
+export const WithTabs = {
+  args: {
+    ...Default.args,
+    bodyPadding: false,
+    children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Tabs, {
+      spacing: "lg",
+      tabs: [/*#__PURE__*/React.createElement(Tabs.Tab, {
+        key: "account",
+        value: "account",
+        trigger: "Account",
+        content: "Make changes to your account here."
+      }), /*#__PURE__*/React.createElement(Tabs.Tab, {
+        key: "company",
+        value: "company",
+        trigger: "Company",
+        content: "Make changes to your company info here."
+      }), /*#__PURE__*/React.createElement(Tabs.Tab, {
+        key: "security",
+        value: "security",
+        trigger: "Security",
+        content: "Make changes to your security settings here."
+      }), /*#__PURE__*/React.createElement(Tabs.Tab, {
+        key: "development",
+        value: "development",
+        trigger: "Development",
+        content: "Make changes to your development settings here."
+      })]
+    }))
+  }
+};
+export const Documentation = {
+  render: args => {
+    const [open, setOpen] = useState(false);
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
+      variant: "primary",
+      text: "Open Dialog",
+      onClick: () => setOpen(true)
+    }), /*#__PURE__*/React.createElement(Dialog, Object.assign({}, args, {
+      open: open,
+      onOpenChange: open => setOpen(open)
+    })));
+  },
+  args: {
+    title: "Dialog Title",
+    description: "A short dialog description.",
+    showCloseButton: true,
+    dismissible: true,
+    bodyPadding: true,
+    info: /*#__PURE__*/React.createElement(React.Fragment, null, "Learn more about this ", /*#__PURE__*/React.createElement("a", {
+      href: "#"
+    }, "here"), "."),
+    children: /*#__PURE__*/React.createElement(React.Fragment, null, "This is the dialog content area. You can place any content here including forms, text, images, or other components."),
+    actions: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Dialog.CancelButton, null), /*#__PURE__*/React.createElement(Dialog.ConfirmButton, null))
+  },
+  argTypes: {
+    title: {
+      description: "Title displayed in the header",
+      control: "text"
+    },
+    description: {
+      description: "Description displayed below the title",
+      control: "text"
+    },
+    size: {
+      description: "Controls the size of the dialog",
+      control: "select",
+      options: ["sm", "md", "lg", "xl", "full"]
+    },
+    showCloseButton: {
+      description: "Show close button, please refer to the 'Without Close Button' example below for details.",
+      control: "boolean",
+      defaultValue: true
+    },
+    dismissible: {
+      description: "Allow dialog to be dismissed by clicking outside or pressing Escape, please refer to the 'Prevent Outside Dismiss' example below for details.",
+      control: "boolean",
+      defaultValue: true
+    },
+    bodyPadding: {
+      description: "Add padding to the Dialog body.",
+      control: "boolean",
+      defaultValue: true
+    },
+    info: {
+      description: "Additional info displayed below the description, please refer to the example below for details.",
+      control: "none"
+    },
+    children: {
+      description: "Content of the dialog, please refer to the 'With Dropdown Menu' and ''With Tabs' example below for details.",
+      control: "none"
+    },
+    actions: {
+      description: "Actions displayed in the footer, please refer to the code example for details.",
+      control: "none"
+    }
+  }
+};
+
+//# sourceMappingURL=Dialog.stories.js.map

package/Dialog/Dialog.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","library","fas","Dialog","Button","DropdownMenu","ReactComponent","NotificationIcon","Tabs","IconPicker","add","meta","title","component","argTypes","Default","args","size","trigger","createElement","variant","text","description","info","Fragment","href","children","onOpenChange","opened","console","log","actions","CancelButton","ConfirmButton","SizeSmall","SizeMedium","SizeLarge","SizeExtraLarge","SizeFullScreen","ControlledVisibility","render","props","open","setOpen","onClick","Object","assign","WithOpenCloseEventHandler","onClose","onOpen","WithDropdownMenu","Item","content","WithoutCloseButton","showCloseButton","AlertDialog","DropdownMenuInDialog","DropdownIconPickerInDialog","value","setValue","icons","prefix","name","onChange","WithIcon","icon","Icon","label","PreventOutsideDismiss","dismissible","WithTabs","bodyPadding","spacing","tabs","Tab","key","Documentation","control","options","defaultValue"],"sources":["Dialog.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { library } from \"@fortawesome/fontawesome-svg-core\";\nimport { fas } from \"@fortawesome/free-solid-svg-icons\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Dialog } from \"./Dialog\";\nimport { Button } from \"~/Button\";\nimport { DropdownMenu } from \"~/DropdownMenu\";\nimport { ReactComponent as NotificationIcon } from \"@webiny/icons/notifications_active.svg\";\nimport { Tabs } from \"~/Tabs\";\nimport { IconPicker } from \"~/IconPicker\";\n\n// @ts-expect-error\nlibrary.add(fas);\n\nconst meta: Meta<typeof Dialog> = {\n    title: \"Components/Dialog\",\n    component: Dialog,\n    argTypes: {}\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Dialog>;\n\nexport const Default: Story = {\n    args: {\n        size: \"md\",\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        title: \"Dialog Title\",\n        description: \"A short dialog description.\",\n        info: (\n            <>\n                Learn more about this <a href={\"#\"}>here</a>.\n            </>\n        ),\n        children: (\n            <>\n                The amazing, splendid, and most useful umbrella, resistant to rain and friendly to\n                winds, is something that deserves all admiration. Crafted with perfect textures, it\n                bravely withstands storms and gently shades the rays of the sun. A remarkable\n                innovation, with an ergonomically designed grip most suited to the hand, it remains\n                stable even in the fiercest weather.\n            </>\n        ),\n        onOpenChange: opened => {\n            console.log(`Dialog is ${opened ? \"opened\" : \"closed\"}.`);\n        },\n        actions: (\n            <>\n                <Dialog.CancelButton />\n                <Dialog.ConfirmButton />\n            </>\n        )\n    },\n    argTypes: {}\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 SizeFullScreen: Story = {\n    args: {\n        ...Default.args,\n        size: \"full\"\n    }\n};\n\nexport const ControlledVisibility: Story = {\n    render: props => {\n        const [open, setOpen] = React.useState(false);\n\n        return (\n            <>\n                <Button variant=\"primary\" text={\"Open\"} onClick={() => setOpen(true)} />\n                <Dialog\n                    {...props}\n                    open={open}\n                    onOpenChange={open => {\n                        if (!open) {\n                            setOpen(false);\n                        }\n                    }}\n                />\n            </>\n        );\n    },\n    args: { ...Default.args, trigger: null }\n};\n\nexport const WithOpenCloseEventHandler: Story = {\n    args: {\n        ...Default.args,\n        onClose: () => {\n            console.log(\"onClose triggered\");\n        },\n        onOpen: () => {\n            console.log(\"onOpen triggered\");\n        }\n    }\n};\n\nexport const WithDropdownMenu: Story = {\n    render: props => {\n        const [open, setOpen] = React.useState(false);\n\n        return (\n            <>\n                <DropdownMenu trigger={<Button variant=\"primary\" text={\"Open\"} />}>\n                    <DropdownMenu.Item\n                        text={\"Open Dialog\"}\n                        content={\"Open Dialog\"}\n                        onClick={() => setOpen(true)}\n                    />\n                </DropdownMenu>\n\n                <Dialog {...props} open={open} onOpenChange={() => setOpen(false)} />\n            </>\n        );\n    },\n    args: { ...Default.args, trigger: null }\n};\n\nexport const WithoutCloseButton: Story = {\n    args: { ...Default.args, showCloseButton: false }\n};\n\nexport const AlertDialog: Story = {\n    args: {\n        ...Default.args,\n        info: null,\n        showCloseButton: false,\n        title: \"Confirm Action\",\n        description: \"Are you sure you want to delete this item?\",\n        children: (\n            <>\n                <p>This action cannot be undone.</p>\n                <p>Deleted items cannot be recovered.</p>\n            </>\n        )\n    }\n};\n\nexport const DropdownMenuInDialog: Story = {\n    args: {\n        ...Default.args,\n        children: (\n            <>\n                <DropdownMenu trigger={<Button variant=\"primary\" text={\"Open\"} />}>\n                    <DropdownMenu.Item content={\"Billing\"} />\n                    <DropdownMenu.Item content={\"Settings\"} />\n                    <DropdownMenu.Item content={\"Keyboard shortcuts\"} />\n                </DropdownMenu>\n            </>\n        )\n    }\n};\n\nexport const DropdownIconPickerInDialog: Story = {\n    args: {\n        ...Default.args\n    },\n    render: args => {\n        const [value, setValue] = useState(\"\");\n        return (\n            <Dialog {...args}>\n                <IconPicker\n                    icons={[\n                        { prefix: \"fas\", name: \"trash-restore-alt\" },\n                        { prefix: \"fas\", name: \"trash-can-arrow-up\" },\n                        { prefix: \"fas\", name: \"naira-sign\" },\n                        { prefix: \"fas\", name: \"cart-arrow-down\" },\n                        { prefix: \"fas\", name: \"walkie-talkie\" },\n                        { prefix: \"fas\", name: \"file-edit\" },\n                        { prefix: \"fas\", name: \"file-pen\" },\n                        { prefix: \"fas\", name: \"receipt\" },\n                        { prefix: \"fas\", name: \"pen-square\" },\n                        { prefix: \"fas\", name: \"pencil-square\" },\n                        { prefix: \"fas\", name: \"square-pen\" },\n                        { prefix: \"fas\", name: \"suitcase-rolling\" },\n                        { prefix: \"fas\", name: \"person-circle-exclamation\" },\n                        { prefix: \"fas\", name: \"chevron-down\" },\n                        { prefix: \"fas\", name: \"battery\" },\n                        { prefix: \"fas\", name: \"battery-5\" },\n                        { prefix: \"fas\", name: \"battery-full\" },\n                        { prefix: \"fas\", name: \"skull-crossbones\" },\n                        { prefix: \"fas\", name: \"code-compare\" },\n                        { prefix: \"fas\", name: \"list-dots\" },\n                        { prefix: \"fas\", name: \"list-ul\" },\n                        { prefix: \"fas\", name: \"school-lock\" },\n                        { prefix: \"fas\", name: \"tower-cell\" },\n                        { prefix: \"fas\", name: \"long-arrow-alt-down\" },\n                        { prefix: \"fas\", name: \"down-long\" },\n                        { prefix: \"fas\", name: \"ranking-star\" },\n                        { prefix: \"fas\", name: \"chess-king\" },\n                        { prefix: \"fas\", name: \"person-harassing\" },\n                        { prefix: \"fas\", name: \"brazilian-real-sign\" },\n                        { prefix: \"fas\", name: \"landmark-alt\" }\n                    ]}\n                    value={value}\n                    onChange={value => {\n                        console.log(\"Selected icon:\", value);\n                        setValue(value);\n                    }}\n                />\n            </Dialog>\n        );\n    }\n};\n\nexport const WithIcon: Story = {\n    args: {\n        ...Default.args,\n        icon: <Dialog.Icon icon={<NotificationIcon />} label={\"Title icon\"} />\n    }\n};\n\nexport const PreventOutsideDismiss: Story = {\n    args: {\n        ...Default.args,\n        dismissible: false\n    }\n};\n\nexport const WithTabs: Story = {\n    args: {\n        ...Default.args,\n        bodyPadding: false,\n        children: (\n            <>\n                <Tabs\n                    spacing={\"lg\"}\n                    tabs={[\n                        <Tabs.Tab\n                            key={\"account\"}\n                            value={\"account\"}\n                            trigger={\"Account\"}\n                            content={\"Make changes to your account here.\"}\n                        />,\n                        <Tabs.Tab\n                            key={\"company\"}\n                            value={\"company\"}\n                            trigger={\"Company\"}\n                            content={\"Make changes to your company info here.\"}\n                        />,\n                        <Tabs.Tab\n                            key={\"security\"}\n                            value={\"security\"}\n                            trigger={\"Security\"}\n                            content={\"Make changes to your security settings here.\"}\n                        />,\n                        <Tabs.Tab\n                            key={\"development\"}\n                            value={\"development\"}\n                            trigger={\"Development\"}\n                            content={\"Make changes to your development settings here.\"}\n                        />\n                    ]}\n                />\n            </>\n        )\n    }\n};\n\nexport const Documentation: Story = {\n    render: args => {\n        const [open, setOpen] = useState(false);\n\n        return (\n            <>\n                <Button variant=\"primary\" text=\"Open Dialog\" onClick={() => setOpen(true)} />\n\n                <Dialog {...args} open={open} onOpenChange={open => setOpen(open)} />\n            </>\n        );\n    },\n    args: {\n        title: \"Dialog Title\",\n        description: \"A short dialog description.\",\n        showCloseButton: true,\n        dismissible: true,\n        bodyPadding: true,\n        info: (\n            <>\n                Learn more about this <a href={\"#\"}>here</a>.\n            </>\n        ),\n        children: (\n            <>\n                This is the dialog content area. You can place any content here including forms,\n                text, images, or other components.\n            </>\n        ),\n        actions: (\n            <>\n                <Dialog.CancelButton />\n                <Dialog.ConfirmButton />\n            </>\n        )\n    },\n    argTypes: {\n        title: {\n            description: \"Title displayed in the header\",\n            control: \"text\"\n        },\n        description: {\n            description: \"Description displayed below the title\",\n            control: \"text\"\n        },\n        size: {\n            description: \"Controls the size of the dialog\",\n            control: \"select\",\n            options: [\"sm\", \"md\", \"lg\", \"xl\", \"full\"]\n        },\n        showCloseButton: {\n            description:\n                \"Show close button, please refer to the 'Without Close Button' example below for details.\",\n            control: \"boolean\",\n            defaultValue: true\n        },\n        dismissible: {\n            description:\n                \"Allow dialog to be dismissed by clicking outside or pressing Escape, please refer to the 'Prevent Outside Dismiss' example below for details.\",\n            control: \"boolean\",\n            defaultValue: true\n        },\n        bodyPadding: {\n            description: \"Add padding to the Dialog body.\",\n            control: \"boolean\",\n            defaultValue: true\n        },\n        info: {\n            description:\n                \"Additional info displayed below the description, please refer to the example below for details.\",\n            control: \"none\"\n        },\n        children: {\n            description:\n                \"Content of the dialog, please refer to the 'With Dropdown Menu' and ''With Tabs' example below for details.\",\n            control: \"none\"\n        },\n        actions: {\n            description:\n                \"Actions displayed in the footer, please refer to the code example for details.\",\n            control: \"none\"\n        }\n    }\n};\n"],"mappings":"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","ignoreList":[]}

package/Dialog/components/CancelButton.d.ts

@@ -0,0 +1,21 @@
+import * as React from "react";
+import { ButtonProps } from "../../Button";
+export declare const CancelButton: ((props: ButtonProps) => React.JSX.Element) & {
+    original: (props: ButtonProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: ButtonProps) => React.JSX.Element) & {
+        original: (props: ButtonProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: ButtonProps) => React.JSX.Element) & {
+        original: (props: ButtonProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};

package/Dialog/components/CancelButton.js

@@ -0,0 +1,14 @@
+import * as React from "react";
+import { makeDecoratable } from "../../utils";
+import { DialogClosePrimitive } from "./DialogClose";
+import { Button } from "../../Button";
+const CancelButtonBase = props => /*#__PURE__*/React.createElement(DialogClosePrimitive, {
+  asChild: true
+}, /*#__PURE__*/React.createElement(Button, Object.assign({
+  text: "Cancel"
+}, props, {
+  variant: "secondary"
+})));
+export const CancelButton = makeDecoratable("CancelButton", CancelButtonBase);
+
+//# sourceMappingURL=CancelButton.js.map

package/Dialog/components/CancelButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","makeDecoratable","DialogClosePrimitive","Button","CancelButtonBase","props","createElement","asChild","Object","assign","text","variant","CancelButton"],"sources":["CancelButton.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable } from \"~/utils\";\nimport { DialogClosePrimitive } from \"./DialogClose\";\nimport { Button, ButtonProps } from \"~/Button\";\n\nconst CancelButtonBase = (props: ButtonProps) => (\n    <DialogClosePrimitive asChild>\n        <Button text={\"Cancel\"} {...props} variant=\"secondary\" />\n    </DialogClosePrimitive>\n);\n\nexport const CancelButton = makeDecoratable(\"CancelButton\", CancelButtonBase);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe;AACxB,SAASC,oBAAoB;AAC7B,SAASC,MAAM;AAEf,MAAMC,gBAAgB,GAAIC,KAAkB,iBACxCL,KAAA,CAAAM,aAAA,CAACJ,oBAAoB;EAACK,OAAO;AAAA,gBACzBP,KAAA,CAAAM,aAAA,CAACH,MAAM,EAAAK,MAAA,CAAAC,MAAA;EAACC,IAAI,EAAE;AAAS,GAAKL,KAAK;EAAEM,OAAO,EAAC;AAAW,EAAE,CACtC,CACzB;AAED,OAAO,MAAMC,YAAY,GAAGX,eAAe,CAAC,cAAc,EAAEG,gBAAgB,CAAC","ignoreList":[]}

package/Dialog/components/ConfirmButton.d.ts

@@ -0,0 +1,21 @@
+import * as React from "react";
+import { ButtonProps } from "../../Button";
+export declare const ConfirmButton: ((props: ButtonProps) => React.JSX.Element) & {
+    original: (props: ButtonProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: ButtonProps) => React.JSX.Element) & {
+        original: (props: ButtonProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: ButtonProps) => React.JSX.Element) & {
+        original: (props: ButtonProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};

package/Dialog/components/ConfirmButton.js

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { makeDecoratable } from "../../utils";
+import { Button } from "../../Button";
+const ConfirmButtonBase = props => /*#__PURE__*/React.createElement(Button, Object.assign({
+  text: "Confirm"
+}, props, {
+  variant: "primary"
+}));
+export const ConfirmButton = makeDecoratable("ConfirmButton", ConfirmButtonBase);
+
+//# sourceMappingURL=ConfirmButton.js.map

package/Dialog/components/ConfirmButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","makeDecoratable","Button","ConfirmButtonBase","props","createElement","Object","assign","text","variant","ConfirmButton"],"sources":["ConfirmButton.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable } from \"~/utils\";\nimport { Button, ButtonProps } from \"~/Button\";\n\nconst ConfirmButtonBase = (props: ButtonProps) => (\n    <Button text={\"Confirm\"} {...props} variant=\"primary\" />\n);\n\nexport const ConfirmButton = makeDecoratable(\"ConfirmButton\", ConfirmButtonBase);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe;AACxB,SAASC,MAAM;AAEf,MAAMC,iBAAiB,GAAIC,KAAkB,iBACzCJ,KAAA,CAAAK,aAAA,CAACH,MAAM,EAAAI,MAAA,CAAAC,MAAA;EAACC,IAAI,EAAE;AAAU,GAAKJ,KAAK;EAAEK,OAAO,EAAC;AAAS,EAAE,CAC1D;AAED,OAAO,MAAMC,aAAa,GAAGT,eAAe,CAAC,eAAe,EAAEE,iBAAiB,CAAC","ignoreList":[]}

package/Dialog/components/DialogBody.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import type { DialogProps } from "..";
+export type DialogBodyProps = Pick<DialogProps, "children" | "bodyPadding" | "size">;
+export declare const DialogBody: ({ bodyPadding, size, children }: DialogBodyProps) => React.JSX.Element;

package/Dialog/components/DialogBody.js

@@ -0,0 +1,36 @@
+import * as React from "react";
+import { cn, cva } from "../../utils";
+const dialogBodyVariants = cva("wby-flex-1", {
+  // Flex grows to fill available space - we need this for the body to expand in case of a "fullscreen" dialog
+  variants: {
+    size: {
+      sm: "wby-px-md-extra",
+      md: "wby-px-md-extra",
+      lg: "wby-px-lg",
+      xl: "wby-px-lg",
+      full: "wby-px-lg"
+    },
+    bodyPadding: {
+      true: "",
+      false: "!wby-px-none"
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    bodyPadding: true
+  }
+});
+export const DialogBody = ({
+  bodyPadding,
+  size,
+  children
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn(dialogBodyVariants({
+      size,
+      bodyPadding
+    }))
+  }, children);
+};
+
+//# sourceMappingURL=DialogBody.js.map

package/Dialog/components/DialogBody.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","cn","cva","dialogBodyVariants","variants","size","sm","md","lg","xl","full","bodyPadding","true","false","defaultVariants","DialogBody","children","createElement","className"],"sources":["DialogBody.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn, cva } from \"~/utils\";\nimport type { DialogProps } from \"~/Dialog\";\n\nconst dialogBodyVariants = cva(\"wby-flex-1\", {\n    // Flex grows to fill available space - we need this for the body to expand in case of a \"fullscreen\" dialog\n    variants: {\n        size: {\n            sm: \"wby-px-md-extra\",\n            md: \"wby-px-md-extra\",\n            lg: \"wby-px-lg\",\n            xl: \"wby-px-lg\",\n            full: \"wby-px-lg\"\n        },\n        bodyPadding: {\n            true: \"\",\n            false: \"!wby-px-none\"\n        }\n    },\n    defaultVariants: {\n        size: \"md\",\n        bodyPadding: true\n    }\n});\n\nexport type DialogBodyProps = Pick<DialogProps, \"children\" | \"bodyPadding\" | \"size\">;\n\nexport const DialogBody = ({ bodyPadding, size, children }: DialogBodyProps) => {\n    return <div className={cn(dialogBodyVariants({ size, bodyPadding }))}>{children}</div>;\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE,EAAEC,GAAG;AAGhB,MAAMC,kBAAkB,GAAGD,GAAG,CAAC,YAAY,EAAE;EACzC;EACAE,QAAQ,EAAE;IACNC,IAAI,EAAE;MACFC,EAAE,EAAE,iBAAiB;MACrBC,EAAE,EAAE,iBAAiB;MACrBC,EAAE,EAAE,WAAW;MACfC,EAAE,EAAE,WAAW;MACfC,IAAI,EAAE;IACV,CAAC;IACDC,WAAW,EAAE;MACTC,IAAI,EAAE,EAAE;MACRC,KAAK,EAAE;IACX;EACJ,CAAC;EACDC,eAAe,EAAE;IACbT,IAAI,EAAE,IAAI;IACVM,WAAW,EAAE;EACjB;AACJ,CAAC,CAAC;AAIF,OAAO,MAAMI,UAAU,GAAGA,CAAC;EAAEJ,WAAW;EAAEN,IAAI;EAAEW;AAA0B,CAAC,KAAK;EAC5E,oBAAOhB,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAEjB,EAAE,CAACE,kBAAkB,CAAC;MAAEE,IAAI;MAAEM;IAAY,CAAC,CAAC;EAAE,GAAEK,QAAc,CAAC;AAC1F,CAAC","ignoreList":[]}

package/Dialog/components/DialogClose.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import { Dialog as DialogPrimitive } from "radix-ui";
+export declare const DialogClosePrimitive: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+type DialogCloseProps = {
+    size: "sm" | "md" | "lg" | "xl" | "full" | null | undefined;
+};
+export declare const DialogClose: ({ size }: DialogCloseProps) => React.JSX.Element;
+export {};

package/Dialog/components/DialogClose.js

@@ -0,0 +1,24 @@
+import React from "react";
+import { Dialog as DialogPrimitive } from "radix-ui";
+import { ReactComponent as XIcon } from "@webiny/icons/close.svg";
+import { IconButton } from "../../Button";
+export const DialogClosePrimitive = DialogPrimitive.Close;
+export const DialogClose = ({
+  size
+}) => {
+  const buttonSize = React.useMemo(() => {
+    return size && ["lg", "xl", "full"].includes(size) ? "md" : "sm";
+  }, [size]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "wby-absolute wby-top-md wby-right-md"
+  }, /*#__PURE__*/React.createElement(DialogPrimitive.Close, {
+    asChild: true
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    size: buttonSize,
+    iconSize: "lg",
+    variant: "ghost",
+    icon: /*#__PURE__*/React.createElement(XIcon, null)
+  })));
+};
+
+//# sourceMappingURL=DialogClose.js.map

package/Dialog/components/DialogClose.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Dialog","DialogPrimitive","ReactComponent","XIcon","IconButton","DialogClosePrimitive","Close","DialogClose","size","buttonSize","useMemo","includes","createElement","className","asChild","iconSize","variant","icon"],"sources":["DialogClose.tsx"],"sourcesContent":["import React from \"react\";\nimport { Dialog as DialogPrimitive } from \"radix-ui\";\nimport { ReactComponent as XIcon } from \"@webiny/icons/close.svg\";\nimport { IconButton } from \"~/Button\";\n\nexport const DialogClosePrimitive = DialogPrimitive.Close;\n\ntype DialogCloseProps = {\n    size: \"sm\" | \"md\" | \"lg\" | \"xl\" | \"full\" | null | undefined;\n};\n\nexport const DialogClose = ({ size }: DialogCloseProps) => {\n    const buttonSize = React.useMemo(() => {\n        return size && [\"lg\", \"xl\", \"full\"].includes(size) ? \"md\" : \"sm\";\n    }, [size]);\n\n    return (\n        <div className={\"wby-absolute wby-top-md wby-right-md\"}>\n            <DialogPrimitive.Close asChild>\n                <IconButton size={buttonSize} iconSize=\"lg\" variant={\"ghost\"} icon={<XIcon />} />\n            </DialogPrimitive.Close>\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,MAAM,IAAIC,eAAe,QAAQ,UAAU;AACpD,SAASC,cAAc,IAAIC,KAAK,QAAQ,yBAAyB;AACjE,SAASC,UAAU;AAEnB,OAAO,MAAMC,oBAAoB,GAAGJ,eAAe,CAACK,KAAK;AAMzD,OAAO,MAAMC,WAAW,GAAGA,CAAC;EAAEC;AAAuB,CAAC,KAAK;EACvD,MAAMC,UAAU,GAAGV,KAAK,CAACW,OAAO,CAAC,MAAM;IACnC,OAAOF,IAAI,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,CAAC,CAACG,QAAQ,CAACH,IAAI,CAAC,GAAG,IAAI,GAAG,IAAI;EACpE,CAAC,EAAE,CAACA,IAAI,CAAC,CAAC;EAEV,oBACIT,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAE;EAAuC,gBACnDd,KAAA,CAAAa,aAAA,CAACX,eAAe,CAACK,KAAK;IAACQ,OAAO;EAAA,gBAC1Bf,KAAA,CAAAa,aAAA,CAACR,UAAU;IAACI,IAAI,EAAEC,UAAW;IAACM,QAAQ,EAAC,IAAI;IAACC,OAAO,EAAE,OAAQ;IAACC,IAAI,eAAElB,KAAA,CAAAa,aAAA,CAACT,KAAK,MAAE;EAAE,CAAE,CAC7D,CACtB,CAAC;AAEd,CAAC","ignoreList":[]}

package/Dialog/components/DialogContent.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { Dialog as DialogPrimitive } from "radix-ui";
+import { type VariantProps } from "../../utils";
+declare const dialogContentVariants: (props?: ({
+    size?: "full" | "sm" | "md" | "lg" | "xl" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export interface DialogContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof dialogContentVariants> {
+    dismissible?: boolean;
+}
+declare const DialogContent: React.ForwardRefExoticComponent<DialogContentProps & React.RefAttributes<HTMLDivElement>>;
+export { DialogContent };