@webiny/admin-ui 6.0.0-alpha.5 → 6.0.0-rc.0

package/DataTable/DataTable.mdx

@@ -1,4 +1,4 @@
-import { Canvas, Meta, Controls } from '@storybook/blocks';
+import { Canvas, Meta, Controls } from '@storybook/addon-docs/blocks';
 
 import * as DataTableStories from './DataTable.stories';
 
@@ -633,7 +633,7 @@ const WithCustomCellRendererDataTableExample = () => {
                     ...columns.name,
                     cell: (entry) => {
                         return (
-                            <div className={"wby-flex wby-items-center wby-gap-sm-extra"}>
+                            <div className={"flex items-center gap-sm-extra"}>
                                 <Avatar
                                     image={
                                         <Avatar.Image
@@ -646,14 +646,14 @@ const WithCustomCellRendererDataTableExample = () => {
                                 />
                                 <div>
                                     <Text
-                                        className={"wby-text-neutral-primary wby-font-semibold"}
+                                        className={"text-neutral-primary font-semibold"}
                                         as={"div"}
                                     >
                                         {entry.name}
                                     </Text>
                                     <Text
                                         size={"sm"}
-                                        className={"wby-text-neutral-strong"}
+                                        className={"text-neutral-strong"}
                                         as={"div"}
                                     >Last updated: {entry.lastModified}</Text>
                                 </div>
@@ -816,11 +816,11 @@ const WithCustomColumnClassNameDataTableExample = () => {
                 ...columns,
                 lastModified: {
                     ...columns.lastModified,
-                    className: "wby-bg-primary-subtle"
+                    className: "bg-primary-subtle"
                 },
                 status: {
                     ...columns.status,
-                    className: "wby-text-right"
+                    className: "text-right"
                 }
             }}
             data={data}
@@ -913,4 +913,4 @@ const WithSortingDataTableExample = () => {
 };
 
 export default WithSortingDataTableExample;
-` } } />
+` } } />

package/DataTable/DataTable.stories.d.ts

@@ -1,6 +1,6 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import type { DataTableDefaultData } from "./DataTable";
-import { DataTable } from "./DataTable";
+import type { Meta, StoryObj } from "@storybook/react-webpack5";
+import type { DataTableDefaultData } from "./DataTable.js";
+import { DataTable } from "./DataTable.js";
 declare const meta: Meta<typeof DataTable>;
 export default meta;
 type Story<T extends Record<string, any> & DataTableDefaultData> = StoryObj<typeof DataTable<T>>;

package/DataTable/DataTable.stories.js

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from "react";
-import { DataTable } from "./DataTable";
-import { Avatar } from "../Avatar";
-import { Text } from "../Text";
+import { DataTable } from "./DataTable.js";
+import { Avatar } from "../Avatar/index.js";
+import { Text } from "../Text/index.js";
 const meta = {
   title: "Components/DataTable",
   component: DataTable,
@@ -125,7 +125,7 @@ export const WithCustomCellRenderer = {
         ...columns.name,
         cell: entry => {
           return /*#__PURE__*/React.createElement("div", {
-            className: "wby-flex wby-items-center wby-gap-sm-extra"
+            className: "flex items-center gap-sm-extra"
           }, /*#__PURE__*/React.createElement(Avatar, {
             image: /*#__PURE__*/React.createElement(Avatar.Image, {
               src: "https://github.com/webiny-bot.png",
@@ -134,11 +134,11 @@ export const WithCustomCellRenderer = {
             fallback: /*#__PURE__*/React.createElement(Avatar.Fallback, null, entry.name.charAt(0)),
             size: "xl"
           }), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Text, {
-            className: "wby-text-neutral-primary wby-font-semibold",
+            className: "text-neutral-primary font-semibold",
             as: "div"
           }, entry.name), /*#__PURE__*/React.createElement(Text, {
             size: "sm",
-            className: "wby-text-neutral-strong",
+            className: "text-neutral-strong",
             as: "div"
           }, `Last updated: ${entry.lastModified}`)));
         }
@@ -165,11 +165,11 @@ export const WithCustomColumnClassName = {
       ...columns,
       lastModified: {
         ...columns.lastModified,
-        className: "wby-bg-primary-subtle"
+        className: "bg-primary-subtle"
       },
       status: {
         ...columns.status,
-        className: "wby-text-right"
+        className: "text-right"
       }
     }
   }

package/DataTable/DataTable.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useState","useEffect","DataTable","Avatar","Text","meta","title","component","parameters","layout","columns","name","header","createdBy","lastModified","status","data","id","Default","args","Bordered","bordered","WithStickyHeader","stickyHeader","WithSelectableRows","render","selectedRows","setSelectedRows","createElement","Object","assign","onSelectRow","rows","WithLoading","loading","setLoading","tableData","setTableData","timer","setTimeout","clearTimeout","WithLongColumnContent","map","entry","WithCustomCellRenderer","cell","className","image","Image","src","alt","fallback","Fallback","charAt","size","as","WithCustomColumnSize","WithCustomColumnClassName","WithSorting","enableSorting","sorting","desc","argsSorting","setSorting","onSortingChange","Documentation","docs","description","story","argTypes","control","defaultValue"],"sources":["DataTable.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport type { DataTableColumns, DataTableDefaultData, DataTableSorting } from \"./DataTable\";\nimport { DataTable } from \"./DataTable\";\nimport { Avatar } from \"~/Avatar\";\nimport { Text } from \"~/Text\";\n\nconst meta: Meta<typeof DataTable> = {\n    title: \"Components/DataTable\",\n    component: DataTable,\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story<T extends Record<string, any> & DataTableDefaultData> = StoryObj<typeof DataTable<T>>;\n\n// Declare the data structure.\ninterface Entry {\n    id: string;\n    name: string;\n    createdBy: string;\n    lastModified: string;\n    status: string;\n}\n\n// Define the columns structure for the table.\nconst columns: DataTableColumns<Entry> = {\n    name: {\n        header: \"Title\"\n    },\n    createdBy: {\n        header: \"Author\"\n    },\n    lastModified: {\n        header: \"Last Modified\"\n    },\n    status: {\n        header: \"Status\"\n    }\n};\n\n// Define the data to display.\nconst data = [\n    {\n        id: \"entry-1\",\n        name: \"Getting Started Guide\",\n        createdBy: \"John Doe\",\n        lastModified: \"1 hour ago\",\n        status: \"Published\"\n    },\n    {\n        id: \"entry-2\",\n        name: \"User Documentation\",\n        createdBy: \"Jane Smith\",\n        lastModified: \"3 days ago\",\n        status: \"Draft\"\n    },\n    {\n        id: \"entry-3\",\n        name: \"API Reference\",\n        createdBy: \"John Doe\",\n        lastModified: \"1 week ago\",\n        status: \"Published\"\n    }\n];\n\nexport const Default: Story<Entry> = {\n    args: {\n        data,\n        columns\n    }\n};\n\nexport const Bordered: Story<Entry> = {\n    args: {\n        ...Default.args,\n        bordered: true\n    }\n};\n\nexport const WithStickyHeader: Story<Entry> = {\n    args: {\n        ...Default.args,\n        stickyHeader: true\n    }\n};\n\nexport const WithSelectableRows: Story<Entry> = {\n    args: Default.args,\n    render: args => {\n        const [selectedRows, setSelectedRows] = useState<Entry[]>([]);\n\n        return (\n            <DataTable\n                {...args}\n                selectedRows={selectedRows}\n                onSelectRow={rows => setSelectedRows(rows)}\n            />\n        );\n    }\n};\n\nexport const WithLoading: Story<Entry> = {\n    args: {\n        columns\n    },\n    render: ({ columns }) => {\n        const [loading, setLoading] = useState(true);\n        const [tableData, setTableData] = useState<Entry[]>([]);\n\n        useEffect(() => {\n            const timer = setTimeout(() => {\n                setTableData(data); // your predefined data\n                setLoading(false);\n            }, 5000);\n\n            return () => clearTimeout(timer);\n        }, []);\n\n        return <DataTable columns={columns} data={tableData} loading={loading} />;\n    }\n};\n\nexport const WithLongColumnContent: Story<Entry> = {\n    args: {\n        ...Default.args,\n        columns: {\n            ...columns,\n            name: {\n                ...columns.name,\n                header: \"Name - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.\"\n            }\n        },\n        data: data.map(entry => ({\n            ...entry,\n            name: `${entry.name} - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla facilisi. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.`\n        }))\n    }\n};\n\nexport const WithCustomCellRenderer: Story<Entry> = {\n    args: {\n        ...Default.args,\n        columns: {\n            ...columns,\n            name: {\n                ...columns.name,\n                cell: (entry: Entry) => {\n                    return (\n                        <div className={\"wby-flex wby-items-center wby-gap-sm-extra\"}>\n                            <Avatar\n                                image={\n                                    <Avatar.Image\n                                        src=\"https://github.com/webiny-bot.png\"\n                                        alt=\"@webiny\"\n                                    />\n                                }\n                                fallback={<Avatar.Fallback>{entry.name.charAt(0)}</Avatar.Fallback>}\n                                size={\"xl\"}\n                            />\n                            <div>\n                                <Text\n                                    className={\"wby-text-neutral-primary wby-font-semibold\"}\n                                    as={\"div\"}\n                                >\n                                    {entry.name}\n                                </Text>\n                                <Text\n                                    size={\"sm\"}\n                                    className={\"wby-text-neutral-strong\"}\n                                    as={\"div\"}\n                                >{`Last updated: ${entry.lastModified}`}</Text>\n                            </div>\n                        </div>\n                    );\n                }\n            }\n        }\n    }\n};\n\nexport const WithCustomColumnSize: Story<Entry> = {\n    args: {\n        ...Default.args,\n        columns: {\n            ...columns,\n            name: {\n                ...columns.name,\n                size: 200\n            }\n        }\n    }\n};\n\nexport const WithCustomColumnClassName: Story<Entry> = {\n    args: {\n        ...Default.args,\n        columns: {\n            ...columns,\n            lastModified: {\n                ...columns.lastModified,\n                className: \"wby-bg-primary-subtle\"\n            },\n            status: {\n                ...columns.status,\n                className: \"wby-text-right\"\n            }\n        }\n    }\n};\n\nexport const WithSorting: Story<Entry> = {\n    args: {\n        ...Default.args,\n        columns: {\n            ...columns,\n            name: {\n                ...columns.name,\n                enableSorting: true\n            },\n            lastModified: {\n                ...columns.lastModified,\n                enableSorting: true\n            }\n        },\n        sorting: [\n            {\n                id: \"lastModified\",\n                desc: true\n            }\n        ]\n    },\n    render: ({ sorting: argsSorting = [], ...args }) => {\n        const [sorting, setSorting] = useState<DataTableSorting>(argsSorting);\n        return <DataTable {...args} sorting={sorting} onSortingChange={setSorting} />;\n    }\n};\n\n// Add a Documentation story\nexport const Documentation: Story<Entry> = {\n    args: {\n        bordered: true,\n        stickyHeader: true,\n        columns: {\n            name: {\n                header: \"Title\",\n                enableSorting: true\n            },\n            createdBy: {\n                header: \"Author\"\n            },\n            lastModified: {\n                header: \"Last Modified\",\n                enableSorting: true\n            },\n            status: {\n                header: \"Status\"\n            }\n        },\n        data: [\n            {\n                id: \"entry-1\",\n                name: \"Getting Started Guide\",\n                createdBy: \"John Doe\",\n                lastModified: \"1 hour ago\",\n                status: \"Published\"\n            },\n            {\n                id: \"entry-2\",\n                name: \"User Documentation\",\n                createdBy: \"Jane Smith\",\n                lastModified: \"3 days ago\",\n                status: \"Draft\"\n            },\n            {\n                id: \"entry-3\",\n                name: \"API Reference\",\n                createdBy: \"John Doe\",\n                lastModified: \"1 week ago\",\n                status: \"Published\"\n            }\n        ]\n    },\n    render: args => {\n        const [selectedRows, setSelectedRows] = useState<Entry[]>([]);\n        const [sorting, setSorting] = useState<DataTableSorting>([]);\n\n        return (\n            <DataTable\n                {...args}\n                selectedRows={selectedRows}\n                onSelectRow={rows => setSelectedRows(rows)}\n                sorting={sorting}\n                onSortingChange={setSorting}\n            />\n        );\n    },\n    parameters: {\n        docs: {\n            description: {\n                story: \"This example shows a DataTable with selectable rows, sorting, and a sticky header.\"\n            }\n        }\n    },\n    argTypes: {\n        bordered: {\n            description: \"Show or hide borders.\",\n            control: \"boolean\",\n            defaultValue: true\n        },\n        stickyHeader: {\n            description: \"Enable sticky header.\",\n            control: \"boolean\",\n            defaultValue: true\n        },\n        columns: {\n            description: \"Columns definition. Please refer to the code example for details.\",\n            control: false\n        },\n        data: {\n            description:\n                \"Data to display into DataTable body. Please refer to the code example for details.\",\n            control: false\n        }\n    }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useState","useEffect","DataTable","Avatar","Text","meta","title","component","parameters","layout","columns","name","header","createdBy","lastModified","status","data","id","Default","args","Bordered","bordered","WithStickyHeader","stickyHeader","WithSelectableRows","render","selectedRows","setSelectedRows","createElement","Object","assign","onSelectRow","rows","WithLoading","loading","setLoading","tableData","setTableData","timer","setTimeout","clearTimeout","WithLongColumnContent","map","entry","WithCustomCellRenderer","cell","className","image","Image","src","alt","fallback","Fallback","charAt","size","as","WithCustomColumnSize","WithCustomColumnClassName","WithSorting","enableSorting","sorting","desc","argsSorting","setSorting","onSortingChange","Documentation","docs","description","story","argTypes","control","defaultValue"],"sources":["DataTable.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport type { DataTableColumns, DataTableDefaultData, DataTableSorting } from \"./DataTable.js\";\nimport { DataTable } from \"./DataTable.js\";\nimport { Avatar } from \"~/Avatar/index.js\";\nimport { Text } from \"~/Text/index.js\";\n\nconst meta: Meta<typeof DataTable> = {\n    title: \"Components/DataTable\",\n    component: DataTable,\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story<T extends Record<string, any> & DataTableDefaultData> = StoryObj<typeof DataTable<T>>;\n\n// Declare the data structure.\ninterface Entry {\n    id: string;\n    name: string;\n    createdBy: string;\n    lastModified: string;\n    status: string;\n}\n\n// Define the columns structure for the table.\nconst columns: DataTableColumns<Entry> = {\n    name: {\n        header: \"Title\"\n    },\n    createdBy: {\n        header: \"Author\"\n    },\n    lastModified: {\n        header: \"Last Modified\"\n    },\n    status: {\n        header: \"Status\"\n    }\n};\n\n// Define the data to display.\nconst data = [\n    {\n        id: \"entry-1\",\n        name: \"Getting Started Guide\",\n        createdBy: \"John Doe\",\n        lastModified: \"1 hour ago\",\n        status: \"Published\"\n    },\n    {\n        id: \"entry-2\",\n        name: \"User Documentation\",\n        createdBy: \"Jane Smith\",\n        lastModified: \"3 days ago\",\n        status: \"Draft\"\n    },\n    {\n        id: \"entry-3\",\n        name: \"API Reference\",\n        createdBy: \"John Doe\",\n        lastModified: \"1 week ago\",\n        status: \"Published\"\n    }\n];\n\nexport const Default: Story<Entry> = {\n    args: {\n        data,\n        columns\n    }\n};\n\nexport const Bordered: Story<Entry> = {\n    args: {\n        ...Default.args,\n        bordered: true\n    }\n};\n\nexport const WithStickyHeader: Story<Entry> = {\n    args: {\n        ...Default.args,\n        stickyHeader: true\n    }\n};\n\nexport const WithSelectableRows: Story<Entry> = {\n    args: Default.args,\n    render: args => {\n        const [selectedRows, setSelectedRows] = useState<Entry[]>([]);\n\n        return (\n            <DataTable\n                {...args}\n                selectedRows={selectedRows}\n                onSelectRow={rows => setSelectedRows(rows)}\n            />\n        );\n    }\n};\n\nexport const WithLoading: Story<Entry> = {\n    args: {\n        columns\n    },\n    render: ({ columns }) => {\n        const [loading, setLoading] = useState(true);\n        const [tableData, setTableData] = useState<Entry[]>([]);\n\n        useEffect(() => {\n            const timer = setTimeout(() => {\n                setTableData(data); // your predefined data\n                setLoading(false);\n            }, 5000);\n\n            return () => clearTimeout(timer);\n        }, []);\n\n        return <DataTable columns={columns} data={tableData} loading={loading} />;\n    }\n};\n\nexport const WithLongColumnContent: Story<Entry> = {\n    args: {\n        ...Default.args,\n        columns: {\n            ...columns,\n            name: {\n                ...columns.name,\n                header: \"Name - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.\"\n            }\n        },\n        data: data.map(entry => ({\n            ...entry,\n            name: `${entry.name} - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla facilisi. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.`\n        }))\n    }\n};\n\nexport const WithCustomCellRenderer: Story<Entry> = {\n    args: {\n        ...Default.args,\n        columns: {\n            ...columns,\n            name: {\n                ...columns.name,\n                cell: (entry: Entry) => {\n                    return (\n                        <div className={\"flex items-center gap-sm-extra\"}>\n                            <Avatar\n                                image={\n                                    <Avatar.Image\n                                        src=\"https://github.com/webiny-bot.png\"\n                                        alt=\"@webiny\"\n                                    />\n                                }\n                                fallback={<Avatar.Fallback>{entry.name.charAt(0)}</Avatar.Fallback>}\n                                size={\"xl\"}\n                            />\n                            <div>\n                                <Text className={\"text-neutral-primary font-semibold\"} as={\"div\"}>\n                                    {entry.name}\n                                </Text>\n                                <Text\n                                    size={\"sm\"}\n                                    className={\"text-neutral-strong\"}\n                                    as={\"div\"}\n                                >{`Last updated: ${entry.lastModified}`}</Text>\n                            </div>\n                        </div>\n                    );\n                }\n            }\n        }\n    }\n};\n\nexport const WithCustomColumnSize: Story<Entry> = {\n    args: {\n        ...Default.args,\n        columns: {\n            ...columns,\n            name: {\n                ...columns.name,\n                size: 200\n            }\n        }\n    }\n};\n\nexport const WithCustomColumnClassName: Story<Entry> = {\n    args: {\n        ...Default.args,\n        columns: {\n            ...columns,\n            lastModified: {\n                ...columns.lastModified,\n                className: \"bg-primary-subtle\"\n            },\n            status: {\n                ...columns.status,\n                className: \"text-right\"\n            }\n        }\n    }\n};\n\nexport const WithSorting: Story<Entry> = {\n    args: {\n        ...Default.args,\n        columns: {\n            ...columns,\n            name: {\n                ...columns.name,\n                enableSorting: true\n            },\n            lastModified: {\n                ...columns.lastModified,\n                enableSorting: true\n            }\n        },\n        sorting: [\n            {\n                id: \"lastModified\",\n                desc: true\n            }\n        ]\n    },\n    render: ({ sorting: argsSorting = [], ...args }) => {\n        const [sorting, setSorting] = useState<DataTableSorting>(argsSorting);\n        return <DataTable {...args} sorting={sorting} onSortingChange={setSorting} />;\n    }\n};\n\n// Add a Documentation story\nexport const Documentation: Story<Entry> = {\n    args: {\n        bordered: true,\n        stickyHeader: true,\n        columns: {\n            name: {\n                header: \"Title\",\n                enableSorting: true\n            },\n            createdBy: {\n                header: \"Author\"\n            },\n            lastModified: {\n                header: \"Last Modified\",\n                enableSorting: true\n            },\n            status: {\n                header: \"Status\"\n            }\n        },\n        data: [\n            {\n                id: \"entry-1\",\n                name: \"Getting Started Guide\",\n                createdBy: \"John Doe\",\n                lastModified: \"1 hour ago\",\n                status: \"Published\"\n            },\n            {\n                id: \"entry-2\",\n                name: \"User Documentation\",\n                createdBy: \"Jane Smith\",\n                lastModified: \"3 days ago\",\n                status: \"Draft\"\n            },\n            {\n                id: \"entry-3\",\n                name: \"API Reference\",\n                createdBy: \"John Doe\",\n                lastModified: \"1 week ago\",\n                status: \"Published\"\n            }\n        ]\n    },\n    render: args => {\n        const [selectedRows, setSelectedRows] = useState<Entry[]>([]);\n        const [sorting, setSorting] = useState<DataTableSorting>([]);\n\n        return (\n            <DataTable\n                {...args}\n                selectedRows={selectedRows}\n                onSelectRow={rows => setSelectedRows(rows)}\n                sorting={sorting}\n                onSortingChange={setSorting}\n            />\n        );\n    },\n    parameters: {\n        docs: {\n            description: {\n                story: \"This example shows a DataTable with selectable rows, sorting, and a sticky header.\"\n            }\n        }\n    },\n    argTypes: {\n        bordered: {\n            description: \"Show or hide borders.\",\n            control: \"boolean\",\n            defaultValue: true\n        },\n        stickyHeader: {\n            description: \"Enable sticky header.\",\n            control: \"boolean\",\n            defaultValue: true\n        },\n        columns: {\n            description: \"Columns definition. Please refer to the code example for details.\",\n            control: false\n        },\n        data: {\n            description:\n                \"Data to display into DataTable body. Please refer to the code example for details.\",\n            control: false\n        }\n    }\n};\n"],"mappings":"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","ignoreList":[]}

package/DataTable/components/ColumnSorter.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { type VariantProps } from "../../utils";
+import { type VariantProps } from "../../utils.js";
 declare const columnSorterVariants: (props?: ({
     sortable?: boolean | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;

package/DataTable/components/ColumnSorter.js

@@ -1,9 +1,9 @@
 import React from "react";
-import { cn, cva } from "../../utils";
-const columnSorterVariants = cva("wby-flex wby-items-center wby-gap-xxs wby-cursor-auto", {
+import { cn, cva } from "../../utils.js";
+const columnSorterVariants = cva("flex items-center gap-xxs cursor-auto", {
   variants: {
     sortable: {
-      true: "wby-cursor-pointer"
+      true: "cursor-pointer"
     }
   }
 });

package/DataTable/components/ColumnSorter.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","cn","cva","columnSorterVariants","variants","sortable","true","ColumnSorter","className","children","props","createElement","Object","assign"],"sources":["ColumnSorter.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, cva, type VariantProps } from \"~/utils\";\n\nconst columnSorterVariants = cva(\"wby-flex wby-items-center wby-gap-xxs wby-cursor-auto\", {\n    variants: {\n        sortable: {\n            true: \"wby-cursor-pointer\"\n        }\n    }\n});\n\ninterface ColumnSorterProps\n    extends React.HTMLAttributes<HTMLDivElement>,\n        VariantProps<typeof columnSorterVariants> {}\n\nconst ColumnSorter = ({ className, children, sortable, ...props }: ColumnSorterProps) => {\n    return (\n        <div {...props} className={cn(columnSorterVariants({ sortable }), className)}>\n            {children}\n        </div>\n    );\n};\n\nexport { ColumnSorter };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,EAAE,EAAEC,GAAG;AAEhB,MAAMC,oBAAoB,GAAGD,GAAG,CAAC,uDAAuD,EAAE;EACtFE,QAAQ,EAAE;IACNC,QAAQ,EAAE;MACNC,IAAI,EAAE;IACV;EACJ;AACJ,CAAC,CAAC;AAMF,MAAMC,YAAY,GAAGA,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEJ,QAAQ;EAAE,GAAGK;AAAyB,CAAC,KAAK;EACrF,oBACIV,KAAA,CAAAW,aAAA,QAAAC,MAAA,CAAAC,MAAA,KAASH,KAAK;IAAEF,SAAS,EAAEP,EAAE,CAACE,oBAAoB,CAAC;MAAEE;IAAS,CAAC,CAAC,EAAEG,SAAS;EAAE,IACxEC,QACA,CAAC;AAEd,CAAC;AAED,SAASF,YAAY","ignoreList":[]}
+{"version":3,"names":["React","cn","cva","columnSorterVariants","variants","sortable","true","ColumnSorter","className","children","props","createElement","Object","assign"],"sources":["ColumnSorter.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, cva, type VariantProps } from \"~/utils.js\";\n\nconst columnSorterVariants = cva(\"flex items-center gap-xxs cursor-auto\", {\n    variants: {\n        sortable: {\n            true: \"cursor-pointer\"\n        }\n    }\n});\n\ninterface ColumnSorterProps\n    extends React.HTMLAttributes<HTMLDivElement>,\n        VariantProps<typeof columnSorterVariants> {}\n\nconst ColumnSorter = ({ className, children, sortable, ...props }: ColumnSorterProps) => {\n    return (\n        <div {...props} className={cn(columnSorterVariants({ sortable }), className)}>\n            {children}\n        </div>\n    );\n};\n\nexport { ColumnSorter };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,EAAE,EAAEC,GAAG;AAEhB,MAAMC,oBAAoB,GAAGD,GAAG,CAAC,uCAAuC,EAAE;EACtEE,QAAQ,EAAE;IACNC,QAAQ,EAAE;MACNC,IAAI,EAAE;IACV;EACJ;AACJ,CAAC,CAAC;AAMF,MAAMC,YAAY,GAAGA,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEJ,QAAQ;EAAE,GAAGK;AAAyB,CAAC,KAAK;EACrF,oBACIV,KAAA,CAAAW,aAAA,QAAAC,MAAA,CAAAC,MAAA,KAASH,KAAK;IAAEF,SAAS,EAAEP,EAAE,CAACE,oBAAoB,CAAC;MAAEE;IAAS,CAAC,CAAC,EAAEG,SAAS;EAAE,IACxEC,QACA,CAAC;AAEd,CAAC;AAED,SAASF,YAAY","ignoreList":[]}

package/DataTable/components/ColumnsVisibility.js

@@ -1,8 +1,8 @@
 import React, { useCallback, useMemo } from "react";
 import { ReactComponent as SettingsIcon } from "@webiny/icons/settings.svg";
-import { IconButton } from "../../Button";
-import { Checkbox } from "../../Checkbox";
-import { DropdownMenu } from "../../DropdownMenu";
+import { IconButton } from "../../Button/index.js";
+import { Checkbox } from "../../Checkbox/index.js";
+import { DropdownMenu } from "../../DropdownMenu/index.js";
 export const ColumnsVisibility = props => {
   /**
    * `@tanstack/react-table` does not have a simple method to return the header component.

package/DataTable/components/ColumnsVisibility.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useMemo","ReactComponent","SettingsIcon","IconButton","Checkbox","DropdownMenu","ColumnsVisibility","props","getHeaderName","column","header","columnDef","id","options","columns","filter","getCanHide","map","onChange","toggleVisibility","getValue","getIsVisible","length","createElement","trigger","icon","variant","size","Label","text","option","Item","key","label","checked"],"sources":["ColumnsVisibility.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { Column } from \"@tanstack/react-table\";\nimport { IconButton } from \"~/Button\";\nimport { Checkbox } from \"~/Checkbox\";\nimport { DropdownMenu } from \"~/DropdownMenu\";\n\ninterface ColumnsVisibilityProps<T> {\n    columns: Column<T>[];\n}\n\ninterface Option {\n    id: string;\n    header: string;\n    onChange: (value?: boolean | undefined) => void;\n    getValue: () => boolean;\n}\n\nexport const ColumnsVisibility = <T,>(props: ColumnsVisibilityProps<T>) => {\n    /**\n     * `@tanstack/react-table` does not have a simple method to return the header component.\n     * The only possible way is to use `flexRenderer`, but this is not working with the current implementation\n     * since we don't have access to the header context.\n     */\n    const getHeaderName = useCallback((column: Column<T>) => {\n        const { header } = column.columnDef;\n\n        if (typeof header === \"string\") {\n            return header;\n        }\n\n        if (typeof header === \"function\") {\n            // @ts-expect-error\n            return header();\n        }\n\n        return column.id;\n    }, []);\n\n    const options: Option[] = useMemo(() => {\n        return props.columns\n            .filter(column => column.getCanHide())\n            .map(column => {\n                return {\n                    id: column.id,\n                    header: getHeaderName(column),\n                    onChange: column.toggleVisibility,\n                    getValue: column.getIsVisible\n                };\n            });\n    }, [props.columns]);\n\n    if (options.length === 0) {\n        return null;\n    }\n\n    return (\n        <DropdownMenu\n            trigger={<IconButton icon={<SettingsIcon />} variant={\"ghost\"} size={\"xs\"} />}\n        >\n            <DropdownMenu.Label text={\"Display columns\"} />\n            {options.map(option => {\n                return (\n                    <DropdownMenu.Item\n                        key={option.id}\n                        text={\n                            <Checkbox\n                                label={option.header}\n                                onChange={option.onChange}\n                                checked={option.getValue()}\n                            />\n                        }\n                    />\n                );\n            })}\n        </DropdownMenu>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AACnD,SAASC,cAAc,IAAIC,YAAY,QAAQ,4BAA4B;AAE3E,SAASC,UAAU;AACnB,SAASC,QAAQ;AACjB,SAASC,YAAY;AAarB,OAAO,MAAMC,iBAAiB,GAAQC,KAAgC,IAAK;EACvE;AACJ;AACA;AACA;AACA;EACI,MAAMC,aAAa,GAAGT,WAAW,CAAEU,MAAiB,IAAK;IACrD,MAAM;MAAEC;IAAO,CAAC,GAAGD,MAAM,CAACE,SAAS;IAEnC,IAAI,OAAOD,MAAM,KAAK,QAAQ,EAAE;MAC5B,OAAOA,MAAM;IACjB;IAEA,IAAI,OAAOA,MAAM,KAAK,UAAU,EAAE;MAC9B;MACA,OAAOA,MAAM,CAAC,CAAC;IACnB;IAEA,OAAOD,MAAM,CAACG,EAAE;EACpB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,OAAiB,GAAGb,OAAO,CAAC,MAAM;IACpC,OAAOO,KAAK,CAACO,OAAO,CACfC,MAAM,CAACN,MAAM,IAAIA,MAAM,CAACO,UAAU,CAAC,CAAC,CAAC,CACrCC,GAAG,CAACR,MAAM,IAAI;MACX,OAAO;QACHG,EAAE,EAAEH,MAAM,CAACG,EAAE;QACbF,MAAM,EAAEF,aAAa,CAACC,MAAM,CAAC;QAC7BS,QAAQ,EAAET,MAAM,CAACU,gBAAgB;QACjCC,QAAQ,EAAEX,MAAM,CAACY;MACrB,CAAC;IACL,CAAC,CAAC;EACV,CAAC,EAAE,CAACd,KAAK,CAACO,OAAO,CAAC,CAAC;EAEnB,IAAID,OAAO,CAACS,MAAM,KAAK,CAAC,EAAE;IACtB,OAAO,IAAI;EACf;EAEA,oBACIxB,KAAA,CAAAyB,aAAA,CAAClB,YAAY;IACTmB,OAAO,eAAE1B,KAAA,CAAAyB,aAAA,CAACpB,UAAU;MAACsB,IAAI,eAAE3B,KAAA,CAAAyB,aAAA,CAACrB,YAAY,MAAE,CAAE;MAACwB,OAAO,EAAE,OAAQ;MAACC,IAAI,EAAE;IAAK,CAAE;EAAE,gBAE9E7B,KAAA,CAAAyB,aAAA,CAAClB,YAAY,CAACuB,KAAK;IAACC,IAAI,EAAE;EAAkB,CAAE,CAAC,EAC9ChB,OAAO,CAACI,GAAG,CAACa,MAAM,IAAI;IACnB,oBACIhC,KAAA,CAAAyB,aAAA,CAAClB,YAAY,CAAC0B,IAAI;MACdC,GAAG,EAAEF,MAAM,CAAClB,EAAG;MACfiB,IAAI,eACA/B,KAAA,CAAAyB,aAAA,CAACnB,QAAQ;QACL6B,KAAK,EAAEH,MAAM,CAACpB,MAAO;QACrBQ,QAAQ,EAAEY,MAAM,CAACZ,QAAS;QAC1BgB,OAAO,EAAEJ,MAAM,CAACV,QAAQ,CAAC;MAAE,CAC9B;IACJ,CACJ,CAAC;EAEV,CAAC,CACS,CAAC;AAEvB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useMemo","ReactComponent","SettingsIcon","IconButton","Checkbox","DropdownMenu","ColumnsVisibility","props","getHeaderName","column","header","columnDef","id","options","columns","filter","getCanHide","map","onChange","toggleVisibility","getValue","getIsVisible","length","createElement","trigger","icon","variant","size","Label","text","option","Item","key","label","checked"],"sources":["ColumnsVisibility.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { Column } from \"@tanstack/react-table\";\nimport { IconButton } from \"~/Button/index.js\";\nimport { Checkbox } from \"~/Checkbox/index.js\";\nimport { DropdownMenu } from \"~/DropdownMenu/index.js\";\n\ninterface ColumnsVisibilityProps<T> {\n    columns: Column<T>[];\n}\n\ninterface Option {\n    id: string;\n    header: string;\n    onChange: (value?: boolean | undefined) => void;\n    getValue: () => boolean;\n}\n\nexport const ColumnsVisibility = <T,>(props: ColumnsVisibilityProps<T>) => {\n    /**\n     * `@tanstack/react-table` does not have a simple method to return the header component.\n     * The only possible way is to use `flexRenderer`, but this is not working with the current implementation\n     * since we don't have access to the header context.\n     */\n    const getHeaderName = useCallback((column: Column<T>) => {\n        const { header } = column.columnDef;\n\n        if (typeof header === \"string\") {\n            return header;\n        }\n\n        if (typeof header === \"function\") {\n            // @ts-expect-error\n            return header();\n        }\n\n        return column.id;\n    }, []);\n\n    const options: Option[] = useMemo(() => {\n        return props.columns\n            .filter(column => column.getCanHide())\n            .map(column => {\n                return {\n                    id: column.id,\n                    header: getHeaderName(column),\n                    onChange: column.toggleVisibility,\n                    getValue: column.getIsVisible\n                };\n            });\n    }, [props.columns]);\n\n    if (options.length === 0) {\n        return null;\n    }\n\n    return (\n        <DropdownMenu\n            trigger={<IconButton icon={<SettingsIcon />} variant={\"ghost\"} size={\"xs\"} />}\n        >\n            <DropdownMenu.Label text={\"Display columns\"} />\n            {options.map(option => {\n                return (\n                    <DropdownMenu.Item\n                        key={option.id}\n                        text={\n                            <Checkbox\n                                label={option.header}\n                                onChange={option.onChange}\n                                checked={option.getValue()}\n                            />\n                        }\n                    />\n                );\n            })}\n        </DropdownMenu>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AACnD,SAASC,cAAc,IAAIC,YAAY,QAAQ,4BAA4B;AAE3E,SAASC,UAAU;AACnB,SAASC,QAAQ;AACjB,SAASC,YAAY;AAarB,OAAO,MAAMC,iBAAiB,GAAQC,KAAgC,IAAK;EACvE;AACJ;AACA;AACA;AACA;EACI,MAAMC,aAAa,GAAGT,WAAW,CAAEU,MAAiB,IAAK;IACrD,MAAM;MAAEC;IAAO,CAAC,GAAGD,MAAM,CAACE,SAAS;IAEnC,IAAI,OAAOD,MAAM,KAAK,QAAQ,EAAE;MAC5B,OAAOA,MAAM;IACjB;IAEA,IAAI,OAAOA,MAAM,KAAK,UAAU,EAAE;MAC9B;MACA,OAAOA,MAAM,CAAC,CAAC;IACnB;IAEA,OAAOD,MAAM,CAACG,EAAE;EACpB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,OAAiB,GAAGb,OAAO,CAAC,MAAM;IACpC,OAAOO,KAAK,CAACO,OAAO,CACfC,MAAM,CAACN,MAAM,IAAIA,MAAM,CAACO,UAAU,CAAC,CAAC,CAAC,CACrCC,GAAG,CAACR,MAAM,IAAI;MACX,OAAO;QACHG,EAAE,EAAEH,MAAM,CAACG,EAAE;QACbF,MAAM,EAAEF,aAAa,CAACC,MAAM,CAAC;QAC7BS,QAAQ,EAAET,MAAM,CAACU,gBAAgB;QACjCC,QAAQ,EAAEX,MAAM,CAACY;MACrB,CAAC;IACL,CAAC,CAAC;EACV,CAAC,EAAE,CAACd,KAAK,CAACO,OAAO,CAAC,CAAC;EAEnB,IAAID,OAAO,CAACS,MAAM,KAAK,CAAC,EAAE;IACtB,OAAO,IAAI;EACf;EAEA,oBACIxB,KAAA,CAAAyB,aAAA,CAAClB,YAAY;IACTmB,OAAO,eAAE1B,KAAA,CAAAyB,aAAA,CAACpB,UAAU;MAACsB,IAAI,eAAE3B,KAAA,CAAAyB,aAAA,CAACrB,YAAY,MAAE,CAAE;MAACwB,OAAO,EAAE,OAAQ;MAACC,IAAI,EAAE;IAAK,CAAE;EAAE,gBAE9E7B,KAAA,CAAAyB,aAAA,CAAClB,YAAY,CAACuB,KAAK;IAACC,IAAI,EAAE;EAAkB,CAAE,CAAC,EAC9ChB,OAAO,CAACI,GAAG,CAACa,MAAM,IAAI;IACnB,oBACIhC,KAAA,CAAAyB,aAAA,CAAClB,YAAY,CAAC0B,IAAI;MACdC,GAAG,EAAEF,MAAM,CAAClB,EAAG;MACfiB,IAAI,eACA/B,KAAA,CAAAyB,aAAA,CAACnB,QAAQ;QACL6B,KAAK,EAAEH,MAAM,CAACpB,MAAO;QACrBQ,QAAQ,EAAEY,MAAM,CAACZ,QAAS;QAC1BgB,OAAO,EAAEJ,MAAM,CAACV,QAAQ,CAAC;MAAE,CAC9B;IACJ,CACJ,CAAC;EAEV,CAAC,CACS,CAAC;AAEvB,CAAC","ignoreList":[]}

package/DataTable/components/index.d.ts

@@ -1,2 +1,2 @@
-export * from "./ColumnSorter";
-export * from "./ColumnsVisibility";
+export * from "./ColumnSorter.js";
+export * from "./ColumnsVisibility.js";

package/DataTable/components/index.js

@@ -1,4 +1,4 @@
-export * from "./ColumnSorter";
-export * from "./ColumnsVisibility";
+export * from "./ColumnSorter.js";
+export * from "./ColumnsVisibility.js";
 
 //# sourceMappingURL=index.js.map

package/DataTable/components/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./ColumnSorter\";\nexport * from \"./ColumnsVisibility\";\n"],"mappings":"AAAA;AACA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./ColumnSorter.js\";\nexport * from \"./ColumnsVisibility.js\";\n"],"mappings":"AAAA;AACA","ignoreList":[]}

package/DataTable/index.d.ts

@@ -1 +1 @@
-export * from "./DataTable";
+export * from "./DataTable.js";

package/DataTable/index.js

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

package/DataTable/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./DataTable\";\n"],"mappings":"AAAA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./DataTable.js\";\n"],"mappings":"AAAA","ignoreList":[]}

package/DelayedOnChange/DelayedOnChange.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useRef, useState } from "react";
-import isEqual from "lodash/isEqual";
+import isEqual from "lodash/isEqual.js";
 const emptyFunction = () => {
   return undefined;
 };

package/DelayedOnChange/DelayedOnChange.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useRef","useState","isEqual","emptyFunction","undefined","DelayedOnChange","children","other","firstMount","onChange","delay","value","initialValue","setValue","localTimeout","applyValue","current","clearTimeout","onChangeLocal","useCallback","onValueStateChanged","nextValue","setTimeout","newProps","renderProp","child","cloneElement","props","realOnKeyDown","onKeyDown","realOnBlur","onBlur","ev","persist","target","key"],"sources":["DelayedOnChange.ts"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport isEqual from \"lodash/isEqual\";\n\nconst emptyFunction = (): undefined => {\n    return undefined;\n};\n\nexport interface ApplyValueCb<TValue> {\n    (value: TValue): void;\n}\n\n/**\n * This component is used to wrap Input and Textarea components to optimize form re-render.\n * These 2 are the only components that trigger form model change on each character input.\n * This means, whenever you type a letter an entire form re-renders.\n * On complex forms you will feel and see a significant delay if this component is not used.\n *\n * The logic behind this component is to serve as a middleware between Form and Input/Textarea, and only notify form of a change when\n * a user stops typing for given period of time (400ms by default).\n */\n\nexport interface OnChangeCallable<TValue = any> {\n    (value: TValue, cb?: ApplyValueCb<TValue>): void;\n}\n\ninterface OnBlurCallable {\n    (ev: React.SyntheticEvent): void;\n}\n\ninterface OnKeyDownCallable {\n    (ev: React.KeyboardEvent<HTMLInputElement>): void;\n}\n\ninterface ChildrenCallableParams<TValue> {\n    value: TValue;\n    onChange: OnChangeCallable<TValue>;\n}\n\ninterface ChildrenCallable<TValue> {\n    (params: ChildrenCallableParams<TValue>): React.ReactElement;\n}\n\nexport interface DelayedOnChangeProps<TValue> {\n    value?: TValue;\n    delay?: number;\n    onChange?: OnChangeCallable<TValue>;\n    onBlur?: OnBlurCallable;\n    onKeyDown?: OnKeyDownCallable;\n    children: React.ReactNode | ChildrenCallable<TValue | undefined>;\n}\n\nexport const DelayedOnChange = <TValue = any>({\n    children,\n    ...other\n}: DelayedOnChangeProps<TValue>) => {\n    const firstMount = useRef(true);\n    const { onChange, delay = 400, value: initialValue } = other;\n    const [value, setValue] = useState<TValue | undefined>(initialValue);\n    // Sync state and props\n    useEffect(() => {\n        // Do not update local state, if the incoming value is the same as the local state.\n        // This is primarily an optimization for non-scalar values (objects).\n        if (isEqual(initialValue, value)) {\n            return;\n        }\n\n        setValue(initialValue);\n    }, [initialValue]);\n\n    const localTimeout = React.useRef<number | null>(null);\n\n    const applyValue = (value: TValue | undefined) => {\n        localTimeout.current && clearTimeout(localTimeout.current);\n        localTimeout.current = null;\n        if (!onChange) {\n            return;\n        }\n        onChange(value as NonNullable<TValue>);\n    };\n\n    const onChangeLocal = React.useCallback((value: TValue | undefined) => {\n        setValue(value);\n    }, []);\n\n    // this is fired upon change value state\n    const onValueStateChanged = (nextValue: TValue | undefined) => {\n        // We don't want to execute callbacks, if the value hasn't changed.\n        if (isEqual(nextValue, initialValue)) {\n            return;\n        }\n\n        localTimeout.current && clearTimeout(localTimeout.current);\n        localTimeout.current = null;\n        localTimeout.current = setTimeout(() => applyValue(nextValue), delay) as unknown as number;\n    };\n\n    // need to clear the timeout when unmounting the component\n    useEffect(() => {\n        return () => {\n            if (!localTimeout.current) {\n                return;\n            }\n            clearTimeout(localTimeout.current);\n            localTimeout.current = null;\n        };\n    }, []);\n\n    useEffect(() => {\n        if (firstMount.current) {\n            firstMount.current = false;\n            return;\n        }\n\n        onValueStateChanged(value);\n    }, [value]);\n\n    const newProps = {\n        ...other,\n        value: value,\n        onChange: onChangeLocal\n    };\n\n    const renderProp =\n        typeof children === \"function\" ? (children as ChildrenCallable<TValue | undefined>) : null;\n    const child = renderProp\n        ? renderProp(newProps)\n        : React.cloneElement(children as unknown as React.ReactElement, newProps);\n\n    const props = { ...child.props };\n    const realOnKeyDown = props.onKeyDown || emptyFunction;\n    const realOnBlur = props.onBlur || emptyFunction;\n\n    // Need to apply value if input lost focus\n    const onBlur: OnBlurCallable = ev => {\n        if (!ev[\"persist\"]) {\n            return;\n        }\n        ev.persist();\n        applyValue((ev.target as HTMLInputElement).value as any as TValue);\n        realOnBlur(ev);\n    };\n\n    // Need to listen for TAB key to apply new value immediately, without delay. Otherwise validation will be triggered with old value.\n    const onKeyDown: OnKeyDownCallable = ev => {\n        ev.persist();\n        if (ev.key === \"Tab\") {\n            applyValue((ev.target as HTMLInputElement).value as any as TValue);\n            realOnKeyDown(ev);\n        } else if (ev.key === \"Enter\") {\n            applyValue((ev.target as HTMLInputElement).value as any as TValue);\n            realOnKeyDown(ev);\n        } else {\n            realOnKeyDown(ev);\n        }\n    };\n\n    return React.cloneElement(child, { ...props, onBlur, onKeyDown });\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useEffect","useRef","useState","isEqual","emptyFunction","undefined","DelayedOnChange","children","other","firstMount","onChange","delay","value","initialValue","setValue","localTimeout","applyValue","current","clearTimeout","onChangeLocal","useCallback","onValueStateChanged","nextValue","setTimeout","newProps","renderProp","child","cloneElement","props","realOnKeyDown","onKeyDown","realOnBlur","onBlur","ev","persist","target","key"],"sources":["DelayedOnChange.ts"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport isEqual from \"lodash/isEqual.js\";\n\nconst emptyFunction = (): undefined => {\n    return undefined;\n};\n\nexport interface ApplyValueCb<TValue> {\n    (value: TValue): void;\n}\n\n/**\n * This component is used to wrap Input and Textarea components to optimize form re-render.\n * These 2 are the only components that trigger form model change on each character input.\n * This means, whenever you type a letter an entire form re-renders.\n * On complex forms you will feel and see a significant delay if this component is not used.\n *\n * The logic behind this component is to serve as a middleware between Form and Input/Textarea, and only notify form of a change when\n * a user stops typing for given period of time (400ms by default).\n */\n\nexport interface OnChangeCallable<TValue = any> {\n    (value: TValue, cb?: ApplyValueCb<TValue>): void;\n}\n\ninterface OnBlurCallable {\n    (ev: React.SyntheticEvent): void;\n}\n\ninterface OnKeyDownCallable {\n    (ev: React.KeyboardEvent<HTMLInputElement>): void;\n}\n\ninterface ChildrenCallableParams<TValue> {\n    value: TValue;\n    onChange: OnChangeCallable<TValue>;\n}\n\ninterface ChildrenCallable<TValue> {\n    (params: ChildrenCallableParams<TValue>): React.ReactElement;\n}\n\nexport interface DelayedOnChangeProps<TValue> {\n    value?: TValue;\n    delay?: number;\n    onChange?: OnChangeCallable<TValue>;\n    onBlur?: OnBlurCallable;\n    onKeyDown?: OnKeyDownCallable;\n    children: React.ReactNode | ChildrenCallable<TValue | undefined>;\n}\n\nexport const DelayedOnChange = <TValue = any>({\n    children,\n    ...other\n}: DelayedOnChangeProps<TValue>) => {\n    const firstMount = useRef(true);\n    const { onChange, delay = 400, value: initialValue } = other;\n    const [value, setValue] = useState<TValue | undefined>(initialValue);\n    // Sync state and props\n    useEffect(() => {\n        // Do not update local state, if the incoming value is the same as the local state.\n        // This is primarily an optimization for non-scalar values (objects).\n        if (isEqual(initialValue, value)) {\n            return;\n        }\n\n        setValue(initialValue);\n    }, [initialValue]);\n\n    const localTimeout = React.useRef<number | null>(null);\n\n    const applyValue = (value: TValue | undefined) => {\n        localTimeout.current && clearTimeout(localTimeout.current);\n        localTimeout.current = null;\n        if (!onChange) {\n            return;\n        }\n        onChange(value as NonNullable<TValue>);\n    };\n\n    const onChangeLocal = React.useCallback((value: TValue | undefined) => {\n        setValue(value);\n    }, []);\n\n    // this is fired upon change value state\n    const onValueStateChanged = (nextValue: TValue | undefined) => {\n        // We don't want to execute callbacks, if the value hasn't changed.\n        if (isEqual(nextValue, initialValue)) {\n            return;\n        }\n\n        localTimeout.current && clearTimeout(localTimeout.current);\n        localTimeout.current = null;\n        localTimeout.current = setTimeout(() => applyValue(nextValue), delay) as unknown as number;\n    };\n\n    // need to clear the timeout when unmounting the component\n    useEffect(() => {\n        return () => {\n            if (!localTimeout.current) {\n                return;\n            }\n            clearTimeout(localTimeout.current);\n            localTimeout.current = null;\n        };\n    }, []);\n\n    useEffect(() => {\n        if (firstMount.current) {\n            firstMount.current = false;\n            return;\n        }\n\n        onValueStateChanged(value);\n    }, [value]);\n\n    const newProps = {\n        ...other,\n        value: value,\n        onChange: onChangeLocal\n    };\n\n    const renderProp =\n        typeof children === \"function\" ? (children as ChildrenCallable<TValue | undefined>) : null;\n    const child = renderProp\n        ? renderProp(newProps)\n        : React.cloneElement(children as unknown as React.ReactElement, newProps);\n\n    const props = { ...child.props };\n    const realOnKeyDown = props.onKeyDown || emptyFunction;\n    const realOnBlur = props.onBlur || emptyFunction;\n\n    // Need to apply value if input lost focus\n    const onBlur: OnBlurCallable = ev => {\n        if (!ev[\"persist\"]) {\n            return;\n        }\n        ev.persist();\n        applyValue((ev.target as HTMLInputElement).value as any as TValue);\n        realOnBlur(ev);\n    };\n\n    // Need to listen for TAB key to apply new value immediately, without delay. Otherwise validation will be triggered with old value.\n    const onKeyDown: OnKeyDownCallable = ev => {\n        ev.persist();\n        if (ev.key === \"Tab\") {\n            applyValue((ev.target as HTMLInputElement).value as any as TValue);\n            realOnKeyDown(ev);\n        } else if (ev.key === \"Enter\") {\n            applyValue((ev.target as HTMLInputElement).value as any as TValue);\n            realOnKeyDown(ev);\n        } else {\n            realOnKeyDown(ev);\n        }\n    };\n\n    return React.cloneElement(child, { ...props, onBlur, onKeyDown });\n};\n"],"mappings":"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","ignoreList":[]}

package/DelayedOnChange/index.d.ts

@@ -1 +1 @@
-export * from "./DelayedOnChange";
+export * from "./DelayedOnChange.js";

package/DelayedOnChange/index.js

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

package/DelayedOnChange/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./DelayedOnChange\";\n"],"mappings":"AAAA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./DelayedOnChange.js\";\n"],"mappings":"AAAA","ignoreList":[]}

package/Dialog/Dialog.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
-import { DialogContent } from "./components/DialogContent";
-import { DialogRoot } from "./components/DialogRoot";
+import { DialogContent } from "./components/DialogContent.js";
+import { DialogRoot } from "./components/DialogRoot.js";
 interface DialogProps extends React.ComponentPropsWithoutRef<typeof DialogRoot>, Omit<React.ComponentPropsWithoutRef<typeof DialogContent>, "title"> {
     trigger?: React.ReactNode;
     title?: React.ReactNode;
@@ -40,7 +40,7 @@ declare const Dialog: {
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<{
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<{
         (props: DialogProps): React.JSX.Element;
         displayName: string;
     } & {
@@ -52,62 +52,63 @@ declare const Dialog: {
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;
 } & {
-    ConfirmButton: ((props: import("../Button/Button").ButtonProps) => React.JSX.Element) & {
-        original: (props: import("../Button/Button").ButtonProps) => React.JSX.Element;
+    ConfirmAction: ((props: import("../index.js").ButtonProps) => React.JSX.Element) & {
+        original: (props: import("../index.js").ButtonProps) => React.JSX.Element;
         originalName: string;
         displayName: string;
     } & {
-        original: ((props: import("../Button/Button").ButtonProps) => React.JSX.Element) & {
-            original: (props: import("../Button/Button").ButtonProps) => React.JSX.Element;
+        original: ((props: import("../index.js").ButtonProps) => React.JSX.Element) & {
+            original: (props: import("../index.js").ButtonProps) => React.JSX.Element;
             originalName: string;
             displayName: string;
         };
         originalName: string;
         displayName: string;
     } & {
-        createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: import("../Button/Button").ButtonProps) => React.JSX.Element) & {
-            original: (props: import("../Button/Button").ButtonProps) => React.JSX.Element;
+        createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: import("../index.js").ButtonProps) => React.JSX.Element) & {
+            original: (props: import("../index.js").ButtonProps) => React.JSX.Element;
             originalName: string;
             displayName: string;
         }>) => (props: unknown) => React.JSX.Element;
     };
-    CancelButton: ((props: import("../Button/Button").ButtonProps) => React.JSX.Element) & {
-        original: (props: import("../Button/Button").ButtonProps) => React.JSX.Element;
+    CancelAction: ((props: import("../index.js").ButtonProps) => React.JSX.Element) & {
+        original: (props: import("../index.js").ButtonProps) => React.JSX.Element;
         originalName: string;
         displayName: string;
     } & {
-        original: ((props: import("../Button/Button").ButtonProps) => React.JSX.Element) & {
-            original: (props: import("../Button/Button").ButtonProps) => React.JSX.Element;
+        original: ((props: import("../index.js").ButtonProps) => React.JSX.Element) & {
+            original: (props: import("../index.js").ButtonProps) => React.JSX.Element;
             originalName: string;
             displayName: string;
         };
         originalName: string;
         displayName: string;
     } & {
-        createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: import("../Button/Button").ButtonProps) => React.JSX.Element) & {
-            original: (props: import("../Button/Button").ButtonProps) => React.JSX.Element;
+        createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: import("../index.js").ButtonProps) => React.JSX.Element) & {
+            original: (props: import("../index.js").ButtonProps) => React.JSX.Element;
             originalName: string;
             displayName: string;
         }>) => (props: unknown) => React.JSX.Element;
     };
-    Icon: ((props: import("../Icon/Icon").IconProps) => React.JSX.Element) & {
-        original: (props: import("../Icon/Icon").IconProps) => React.JSX.Element;
+    Icon: ((props: import("../index.js").IconProps) => React.JSX.Element) & {
+        original: (props: import("../index.js").IconProps) => React.JSX.Element;
         originalName: string;
         displayName: string;
     } & {
-        original: ((props: import("../Icon/Icon").IconProps) => React.JSX.Element) & {
-            original: (props: import("../Icon/Icon").IconProps) => React.JSX.Element;
+        original: ((props: import("../index.js").IconProps) => React.JSX.Element) & {
+            original: (props: import("../index.js").IconProps) => React.JSX.Element;
             originalName: string;
             displayName: string;
         };
         originalName: string;
         displayName: string;
     } & {
-        createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: import("../Icon/Icon").IconProps) => React.JSX.Element) & {
-            original: (props: import("../Icon/Icon").IconProps) => React.JSX.Element;
+        createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: import("../index.js").IconProps) => React.JSX.Element) & {
+            original: (props: import("../index.js").IconProps) => React.JSX.Element;
             originalName: string;
             displayName: string;
         }>) => (props: unknown) => React.JSX.Element;
     };
+    Close: React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
 };
 export { Dialog, type DialogProps };

package/Dialog/Dialog.js

@@ -1,17 +1,18 @@
 import * as React from "react";
-import { makeDecoratable, withStaticProps } from "../utils";
-import { DialogContent } from "./components/DialogContent";
-import { DialogHeader } from "./components/DialogHeader";
-import { DialogBody } from "./components/DialogBody";
-import { DialogFooter } from "./components/DialogFooter";
-import { DialogOverlay } from "./components/DialogOverlay";
-import { DialogPortal } from "./components/DialogPortal";
-import { DialogRoot } from "./components/DialogRoot";
-import { DialogTrigger } from "./components/DialogTrigger";
-import { Icon } from "./components/Icon";
-import { ConfirmButton } from "./components/ConfirmButton";
-import { CancelButton } from "./components/CancelButton";
-import { DialogClose } from "./components/DialogClose";
+import { makeDecoratable, withStaticProps } from "../utils.js";
+import { DialogContent } from "./components/DialogContent.js";
+import { DialogHeader } from "./components/DialogHeader.js";
+import { DialogBody } from "./components/DialogBody.js";
+import { DialogFooter } from "./components/DialogFooter.js";
+import { DialogOverlay } from "./components/DialogOverlay.js";
+import { DialogPortal } from "./components/DialogPortal.js";
+import { DialogRoot } from "./components/DialogRoot.js";
+import { DialogTrigger } from "./components/DialogTrigger.js";
+import { Icon } from "./components/Icon.js";
+import { ConfirmAction } from "./components/ConfirmAction.js";
+import { CancelAction } from "./components/CancelAction.js";
+import { CloseDialogIconButton } from "./components/CloseDialogIconButton.js";
+import { DialogClose } from "./components/DialogClose.js";
 const DialogBase = props => {
   const {
     rootProps,
@@ -67,7 +68,8 @@ const DialogBase = props => {
         open,
         onOpenChange,
         modal,
-        dir
+        dir,
+        size
       },
       triggerProps: {
         // Temporary fix. We need this because `ref` doesn't get passed to components
@@ -102,16 +104,20 @@ const DialogBase = props => {
   }, [props]);
   return /*#__PURE__*/React.createElement(DialogRoot, rootProps, triggerProps.children && /*#__PURE__*/React.createElement(DialogTrigger, Object.assign({}, triggerProps, {
     asChild: true
-  })), /*#__PURE__*/React.createElement(DialogPortal, null, /*#__PURE__*/React.createElement(DialogOverlay, null), /*#__PURE__*/React.createElement(DialogContent, contentProps, /*#__PURE__*/React.createElement(DialogHeader, headerProps), /*#__PURE__*/React.createElement(DialogBody, bodyProps), /*#__PURE__*/React.createElement(DialogFooter, footerProps), closeButtonProps.show && /*#__PURE__*/React.createElement(DialogClose, {
+  })), /*#__PURE__*/React.createElement(DialogPortal, null, /*#__PURE__*/React.createElement("div", {
+    "data-role": "dialog",
+    className: "z-overlay absolute"
+  }, /*#__PURE__*/React.createElement(DialogOverlay, null), /*#__PURE__*/React.createElement(DialogContent, contentProps, /*#__PURE__*/React.createElement(DialogHeader, headerProps), /*#__PURE__*/React.createElement(DialogBody, bodyProps), /*#__PURE__*/React.createElement(DialogFooter, footerProps), closeButtonProps.show && /*#__PURE__*/React.createElement(CloseDialogIconButton, {
     size: closeButtonProps.size
-  }))));
+  })))));
 };
 DialogBase.displayName = "Dialog";
 const DecoratableDialog = makeDecoratable("Dialog", DialogBase);
 const Dialog = withStaticProps(DecoratableDialog, {
-  ConfirmButton,
-  CancelButton,
-  Icon
+  ConfirmAction,
+  CancelAction,
+  Icon,
+  Close: DialogClose
 });
 export { Dialog };
 

package/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","makeDecoratable","withStaticProps","DialogContent","DialogHeader","DialogBody","DialogFooter","DialogOverlay","DialogPortal","DialogRoot","DialogTrigger","Icon","ConfirmButton","CancelButton","DialogClose","DialogBase","props","rootProps","triggerProps","contentProps","headerProps","bodyProps","footerProps","closeButtonProps","useMemo","defaultOpen","open","onOpenChange","originalOnOpenChange","onClose","onOpen","modal","dir","size","trigger","title","icon","description","children","bodyPadding","actions","info","showCloseButton","rest","createElement","show","Object","assign","asChild","displayName","DecoratableDialog","Dialog"],"sources":["Dialog.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable, withStaticProps } from \"~/utils\";\nimport { DialogContent } from \"./components/DialogContent\";\nimport { DialogHeader } from \"~/Dialog/components/DialogHeader\";\nimport { DialogBody } from \"~/Dialog/components/DialogBody\";\nimport { DialogFooter } from \"~/Dialog/components/DialogFooter\";\nimport { DialogOverlay } from \"~/Dialog/components/DialogOverlay\";\nimport { DialogPortal } from \"./components/DialogPortal\";\nimport { DialogRoot } from \"./components/DialogRoot\";\nimport { DialogTrigger } from \"./components/DialogTrigger\";\nimport { Icon } from \"./components/Icon\";\nimport { ConfirmButton } from \"./components/ConfirmButton\";\nimport { CancelButton } from \"./components/CancelButton\";\nimport { DialogClose } from \"~/Dialog/components/DialogClose\";\n\ninterface DialogProps\n    extends React.ComponentPropsWithoutRef<typeof DialogRoot>,\n        Omit<React.ComponentPropsWithoutRef<typeof DialogContent>, \"title\"> {\n    trigger?: React.ReactNode;\n    title?: React.ReactNode;\n    icon?: React.ReactElement;\n    showCloseButton?: boolean;\n    dismissible?: boolean;\n    bodyPadding?: boolean;\n    description?: React.ReactNode;\n    children: React.ReactNode;\n    actions?: React.ReactNode;\n    info?: React.ReactNode;\n    onClose?: () => void;\n    onOpen?: () => void;\n}\n\nconst DialogBase = (props: DialogProps) => {\n    const {\n        rootProps,\n        triggerProps,\n        contentProps,\n        headerProps,\n        bodyProps,\n        footerProps,\n        closeButtonProps\n    } = React.useMemo(() => {\n        const {\n            // Root props.\n            defaultOpen,\n            open,\n            onOpenChange: originalOnOpenChange,\n            onClose,\n            onOpen,\n            modal,\n            dir,\n\n            // Shared props.\n            size,\n\n            // Trigger props.\n            trigger,\n\n            // Header props.\n            title,\n            icon,\n            description,\n\n            // Body props.\n            children,\n            bodyPadding,\n\n            // Footer props.\n            actions,\n            info,\n\n            // Close button props.\n            showCloseButton = true,\n\n            // Content props.\n            ...rest\n        } = props;\n\n        // Handles dialog open state changes, calling original and onClose / onOpen callbacks as needed\n        const onOpenChange = (open: boolean) => {\n            originalOnOpenChange && originalOnOpenChange(open);\n\n            if (onClose && !open) {\n                onClose();\n            }\n\n            if (onOpen && open) {\n                onOpen();\n            }\n        };\n\n        return {\n            rootProps: {\n                defaultOpen,\n                open,\n                onOpenChange,\n                modal,\n                dir\n            },\n            triggerProps: {\n                // Temporary fix. We need this because `ref` doesn't get passed to components\n                // that are decorated with `makeDecoratable`. This will be fixed in the future.\n                children: <div>{trigger}</div>\n            },\n            headerProps: { title, icon, description, size },\n            bodyProps: { children, bodyPadding, size },\n            footerProps: { info, actions, size },\n            closeButtonProps: { show: showCloseButton, size },\n            contentProps: { ...rest, size }\n        };\n    }, [props]);\n\n    return (\n        <DialogRoot {...rootProps}>\n            {triggerProps.children && <DialogTrigger {...triggerProps} asChild />}\n            <DialogPortal>\n                <DialogOverlay />\n                <DialogContent {...contentProps}>\n                    <DialogHeader {...headerProps} />\n                    <DialogBody {...bodyProps} />\n                    <DialogFooter {...footerProps} />\n                    {closeButtonProps.show && <DialogClose size={closeButtonProps.size} />}\n                </DialogContent>\n            </DialogPortal>\n        </DialogRoot>\n    );\n};\n\nDialogBase.displayName = \"Dialog\";\n\nconst DecoratableDialog = makeDecoratable(\"Dialog\", DialogBase);\n\nconst Dialog = withStaticProps(DecoratableDialog, {\n    ConfirmButton,\n    CancelButton,\n    Icon\n});\n\nexport { Dialog, type DialogProps };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","makeDecoratable","withStaticProps","DialogContent","DialogHeader","DialogBody","DialogFooter","DialogOverlay","DialogPortal","DialogRoot","DialogTrigger","Icon","ConfirmAction","CancelAction","CloseDialogIconButton","DialogClose","DialogBase","props","rootProps","triggerProps","contentProps","headerProps","bodyProps","footerProps","closeButtonProps","useMemo","defaultOpen","open","onOpenChange","originalOnOpenChange","onClose","onOpen","modal","dir","size","trigger","title","icon","description","children","bodyPadding","actions","info","showCloseButton","rest","createElement","show","Object","assign","asChild","className","displayName","DecoratableDialog","Dialog","Close"],"sources":["Dialog.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport { DialogContent } from \"./components/DialogContent.js\";\nimport { DialogHeader } from \"~/Dialog/components/DialogHeader.js\";\nimport { DialogBody } from \"~/Dialog/components/DialogBody.js\";\nimport { DialogFooter } from \"~/Dialog/components/DialogFooter.js\";\nimport { DialogOverlay } from \"~/Dialog/components/DialogOverlay.js\";\nimport { DialogPortal } from \"./components/DialogPortal.js\";\nimport { DialogRoot } from \"./components/DialogRoot.js\";\nimport { DialogTrigger } from \"./components/DialogTrigger.js\";\nimport { Icon } from \"./components/Icon.js\";\nimport { ConfirmAction } from \"./components/ConfirmAction.js\";\nimport { CancelAction } from \"./components/CancelAction.js\";\nimport { CloseDialogIconButton } from \"~/Dialog/components/CloseDialogIconButton.js\";\nimport { DialogClose } from \"~/Dialog/components/DialogClose.js\";\n\ninterface DialogProps\n    extends React.ComponentPropsWithoutRef<typeof DialogRoot>,\n        Omit<React.ComponentPropsWithoutRef<typeof DialogContent>, \"title\"> {\n    trigger?: React.ReactNode;\n    title?: React.ReactNode;\n    icon?: React.ReactElement;\n    showCloseButton?: boolean;\n    dismissible?: boolean;\n    bodyPadding?: boolean;\n    description?: React.ReactNode;\n    children: React.ReactNode;\n    actions?: React.ReactNode;\n    info?: React.ReactNode;\n    onClose?: () => void;\n    onOpen?: () => void;\n}\n\nconst DialogBase = (props: DialogProps) => {\n    const {\n        rootProps,\n        triggerProps,\n        contentProps,\n        headerProps,\n        bodyProps,\n        footerProps,\n        closeButtonProps\n    } = React.useMemo(() => {\n        const {\n            // Root props.\n            defaultOpen,\n            open,\n            onOpenChange: originalOnOpenChange,\n            onClose,\n            onOpen,\n            modal,\n            dir,\n\n            // Shared props.\n            size,\n\n            // Trigger props.\n            trigger,\n\n            // Header props.\n            title,\n            icon,\n            description,\n\n            // Body props.\n            children,\n            bodyPadding,\n\n            // Footer props.\n            actions,\n            info,\n\n            // Close button props.\n            showCloseButton = true,\n\n            // Content props.\n            ...rest\n        } = props;\n\n        // Handles dialog open state changes, calling original and onClose / onOpen callbacks as needed\n        const onOpenChange = (open: boolean) => {\n            originalOnOpenChange && originalOnOpenChange(open);\n\n            if (onClose && !open) {\n                onClose();\n            }\n\n            if (onOpen && open) {\n                onOpen();\n            }\n        };\n\n        return {\n            rootProps: {\n                defaultOpen,\n                open,\n                onOpenChange,\n                modal,\n                dir,\n                size\n            },\n            triggerProps: {\n                // Temporary fix. We need this because `ref` doesn't get passed to components\n                // that are decorated with `makeDecoratable`. This will be fixed in the future.\n                children: <div>{trigger}</div>\n            },\n            headerProps: { title, icon, description, size },\n            bodyProps: { children, bodyPadding, size },\n            footerProps: { info, actions, size },\n            closeButtonProps: { show: showCloseButton, size },\n            contentProps: { ...rest, size }\n        };\n    }, [props]);\n\n    return (\n        <DialogRoot {...rootProps}>\n            {triggerProps.children && <DialogTrigger {...triggerProps} asChild />}\n            <DialogPortal>\n                <div data-role=\"dialog\" className={\"z-overlay absolute\"}>\n                    <DialogOverlay />\n                    <DialogContent {...contentProps}>\n                        <DialogHeader {...headerProps} />\n                        <DialogBody {...bodyProps} />\n                        <DialogFooter {...footerProps} />\n                        {closeButtonProps.show && (\n                            <CloseDialogIconButton size={closeButtonProps.size} />\n                        )}\n                    </DialogContent>\n                </div>\n            </DialogPortal>\n        </DialogRoot>\n    );\n};\n\nDialogBase.displayName = \"Dialog\";\n\nconst DecoratableDialog = makeDecoratable(\"Dialog\", DialogBase);\n\nconst Dialog = withStaticProps(DecoratableDialog, {\n    ConfirmAction,\n    CancelAction,\n    Icon,\n    Close: DialogClose\n});\n\nexport { Dialog, type DialogProps };\n"],"mappings":"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","ignoreList":[]}