@webiny/admin-ui 0.0.0-unstable.e53eceafb5

package/Toast/Toast.js

@@ -0,0 +1,38 @@
+import * as React from "react";
+import { Toaster } from "sonner";
+import { makeDecoratable, withStaticProps } from "../utils";
+import { Portal } from "../Portal";
+import { ToastActions, ToastClose, ToastDescription, ToastIcon, ToastRoot, ToastTitle } from "./components";
+const DecoratableToast = ({
+  title,
+  description,
+  icon,
+  actions,
+  onCloseClick,
+  dismissible = true,
+  ...props
+}) => {
+  return /*#__PURE__*/React.createElement(ToastRoot, Object.assign({
+    hasDescription: !!description || !!actions
+  }, props), /*#__PURE__*/React.createElement(ToastIcon, {
+    icon: icon
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "wby-w-64"
+  }, title, description && description, actions && actions), dismissible && /*#__PURE__*/React.createElement(ToastClose, {
+    onClick: onCloseClick,
+    variant: props.variant === "subtle" ? "subtle" : "ghost-negative"
+  }));
+};
+const Toast = withStaticProps(makeDecoratable("Toast", DecoratableToast), {
+  Title: ToastTitle,
+  Description: ToastDescription,
+  Actions: ToastActions,
+  Provider: props => /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(Toaster, Object.assign({
+    expand: true,
+    duration: 6000,
+    position: "top-right"
+  }, props)))
+});
+export { Toast };
+
+//# sourceMappingURL=Toast.js.map

package/Toast/Toast.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Toaster","makeDecoratable","withStaticProps","Portal","ToastActions","ToastClose","ToastDescription","ToastIcon","ToastRoot","ToastTitle","DecoratableToast","title","description","icon","actions","onCloseClick","dismissible","props","createElement","Object","assign","hasDescription","className","onClick","variant","Toast","Title","Description","Actions","Provider","expand","duration","position"],"sources":["Toast.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Toaster, type ToasterProps } from \"sonner\";\nimport { makeDecoratable, withStaticProps } from \"~/utils\";\nimport { type IconButtonProps } from \"~/Button\";\nimport type { Icon as BaseIcon } from \"~/Icon\";\nimport { Portal } from \"~/Portal\";\nimport {\n    ToastActions,\n    ToastClose,\n    ToastDescription,\n    ToastIcon,\n    ToastRoot,\n    ToastTitle,\n    type ToastRootProps\n} from \"./components\";\n\ninterface ToastProps extends Omit<ToastRootProps, \"title\" | \"content\" | \"children\"> {\n    title: React.ReactElement<typeof ToastTitle>;\n    description?: React.ReactElement<typeof ToastDescription>;\n    icon?: React.ReactElement<typeof BaseIcon>;\n    actions?: React.ReactElement<typeof ToastActions>;\n    onCloseClick: () => void;\n    dismissible?: boolean;\n}\n\nconst DecoratableToast = ({\n    title,\n    description,\n    icon,\n    actions,\n    onCloseClick,\n    dismissible = true,\n    ...props\n}: ToastProps) => {\n    return (\n        <ToastRoot hasDescription={!!description || !!actions} {...props}>\n            <ToastIcon icon={icon} />\n            <div className=\"wby-w-64\">\n                {title}\n                {description && description}\n                {actions && actions}\n            </div>\n            {dismissible && (\n                <ToastClose\n                    onClick={onCloseClick}\n                    variant={\n                        props.variant === \"subtle\"\n                            ? (\"subtle\" as IconButtonProps[\"variant\"])\n                            : (\"ghost-negative\" as IconButtonProps[\"variant\"])\n                    }\n                />\n            )}\n        </ToastRoot>\n    );\n};\n\nconst Toast = withStaticProps(makeDecoratable(\"Toast\", DecoratableToast), {\n    Title: ToastTitle,\n    Description: ToastDescription,\n    Actions: ToastActions,\n    Provider: (props: ToasterProps) => (\n        <Portal>\n            <Toaster expand={true} duration={6000} position={\"top-right\"} {...props} />\n        </Portal>\n    )\n});\n\nexport { Toast, type ToastProps };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,OAAO,QAA2B,QAAQ;AACnD,SAASC,eAAe,EAAEC,eAAe;AAGzC,SAASC,MAAM;AACf,SACIC,YAAY,EACZC,UAAU,EACVC,gBAAgB,EAChBC,SAAS,EACTC,SAAS,EACTC,UAAU;AAad,MAAMC,gBAAgB,GAAGA,CAAC;EACtBC,KAAK;EACLC,WAAW;EACXC,IAAI;EACJC,OAAO;EACPC,YAAY;EACZC,WAAW,GAAG,IAAI;EAClB,GAAGC;AACK,CAAC,KAAK;EACd,oBACIlB,KAAA,CAAAmB,aAAA,CAACV,SAAS,EAAAW,MAAA,CAAAC,MAAA;IAACC,cAAc,EAAE,CAAC,CAACT,WAAW,IAAI,CAAC,CAACE;EAAQ,GAAKG,KAAK,gBAC5DlB,KAAA,CAAAmB,aAAA,CAACX,SAAS;IAACM,IAAI,EAAEA;EAAK,CAAE,CAAC,eACzBd,KAAA,CAAAmB,aAAA;IAAKI,SAAS,EAAC;EAAU,GACpBX,KAAK,EACLC,WAAW,IAAIA,WAAW,EAC1BE,OAAO,IAAIA,OACX,CAAC,EACLE,WAAW,iBACRjB,KAAA,CAAAmB,aAAA,CAACb,UAAU;IACPkB,OAAO,EAAER,YAAa;IACtBS,OAAO,EACHP,KAAK,CAACO,OAAO,KAAK,QAAQ,GACnB,QAAQ,GACR;EACV,CACJ,CAEE,CAAC;AAEpB,CAAC;AAED,MAAMC,KAAK,GAAGvB,eAAe,CAACD,eAAe,CAAC,OAAO,EAAES,gBAAgB,CAAC,EAAE;EACtEgB,KAAK,EAAEjB,UAAU;EACjBkB,WAAW,EAAErB,gBAAgB;EAC7BsB,OAAO,EAAExB,YAAY;EACrByB,QAAQ,EAAGZ,KAAmB,iBAC1BlB,KAAA,CAAAmB,aAAA,CAACf,MAAM,qBACHJ,KAAA,CAAAmB,aAAA,CAAClB,OAAO,EAAAmB,MAAA,CAAAC,MAAA;IAACU,MAAM,EAAE,IAAK;IAACC,QAAQ,EAAE,IAAK;IAACC,QAAQ,EAAE;EAAY,GAAKf,KAAK,CAAG,CACtE;AAEhB,CAAC,CAAC;AAEF,SAASQ,KAAK","ignoreList":[]}

package/Toast/Toast.mdx

@@ -0,0 +1,467 @@
+import { Canvas, Meta, Controls } from '@storybook/blocks';
+
+import * as ToastStories from './useToast.stories';
+
+<Meta of={ToastStories} />
+
+# Toast
+
+The Toast component is a non-intrusive notification element that appears temporarily to provide feedback, confirmation, or important information to users. Toasts are displayed in a consistent location (typically top-right) and automatically disappear after a set duration, making them ideal for transient messages that don't require user action.
+
+## Usage
+
+<Canvas of={ToastStories.Documentation} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const ToastExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+        const handleShowToast = () => {
+            const toast = showToast({
+                title: "New entry created"
+            });
+            setLastToast(toast);
+        };
+
+        return (
+            <>
+                <Button text="Show Toast" onClick={handleShowToast} />
+                <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+                <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+                <Toast.Provider />
+            </>
+        );
+    };
+
+    export default ToastExample;
+
+` } }
+        additionalActions={[
+            {
+                title: 'Open in GitHub',
+                onClick: () => {
+                    window.open(
+                        'https://github.com/webiny/webiny-js/blob/feat/new-admin-ui/packages/admin-ui/src/Toast/Toast.tsx',
+                        '_blank'
+                    );
+                },
+            }
+        ]}
+/>
+
+<Controls of={ToastStories.Documentation} />
+
+```tsx
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const ToastExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    const handleShowToast = () => {
+        const toast = showToast({
+            title: "New entry created"
+        });
+        setLastToast(toast);
+    };
+
+    return (
+        <>
+            <Button text="Show Toast" onClick={handleShowToast} />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default ToastExample;
+```
+
+## Examples
+
+### Basic Toast
+
+The simplest form of toast with just a title.
+
+<Canvas of={ToastStories.Default} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const BasicToastExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    return (
+        <>
+            <Button
+                text="Show Toast"
+                onClick={() => {
+                    const toast = showToast({
+                        title: "New entry created"
+                    });
+                    setLastToast(toast);
+                }}
+            />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default BasicToastExample;
+` } } />
+
+### Subtle Variant
+
+A more subtle toast style with a light background.
+
+<Canvas of={ToastStories.SubtleVariant} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const SubtleToastExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    return (
+        <>
+            <Button
+                text="Show Subtle Toast"
+                onClick={() => {
+                    const toast = showToast({
+                        title: "New entry created",
+                        variant: "subtle"
+                    });
+                    setLastToast(toast);
+                }}
+            />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default SubtleToastExample;
+` } } />
+
+### With Description
+
+Add more context with a description.
+
+<Canvas of={ToastStories.WithDescription} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const ToastWithDescriptionExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    return (
+        <>
+            <Button
+                text="Show Toast with Description"
+                onClick={() => {
+                    const toast = showToast({
+                        title: "New entry created",
+                        description: 'Entry "Article One" has been successfully created'
+                    });
+                    setLastToast(toast);
+                }}
+            />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default ToastWithDescriptionExample;
+` } } />
+
+### With Component Elements
+
+Use the component versions of title and description for more control.
+
+<Canvas of={ToastStories.WithDescriptionComponent} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const ToastWithComponentsExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    return (
+        <>
+            <Button
+                text="Show Toast with Components"
+                onClick={() => {
+                    const toast = showToast({
+                        title: <Toast.Title text={"New entry created"} />,
+                        description: (
+                            <Toast.Description text={'Entry "Article One" has been successfully created'} />
+                        )
+                    });
+                    setLastToast(toast);
+                }}
+            />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default ToastWithComponentsExample;
+` } } />
+
+### With Actions
+
+Add action buttons to the toast for user interaction.
+
+<Canvas of={ToastStories.WithActions} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const ToastWithActionsExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    return (
+        <>
+            <Button
+                text="Show Toast with Actions"
+                onClick={() => {
+                    const toast = showToast({
+                        title: "New entry created",
+                        actions: (
+                            <Toast.Actions>
+                                <Button
+                                    key={"action-1"}
+                                    text={"Do the action"}
+                                    onClick={() => console.log("doTheAction")}
+                                />
+                                <Button
+                                    key={"action-2"}
+                                    text={"Dismiss"}
+                                    onClick={() => console.log("dismiss")}
+                                    variant={"secondary"}
+                                />
+                            </Toast.Actions>
+                        )
+                    });
+                    setLastToast(toast);
+                }}
+            />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default ToastWithActionsExample;
+` } } />
+
+### With Description and Actions
+
+Combine description and actions for a comprehensive toast.
+
+<Canvas of={ToastStories.WithDescriptionAndActions} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const ToastWithDescriptionAndActionsExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    return (
+        <>
+            <Button
+                text="Show Complete Toast"
+                onClick={() => {
+                    const toast = showToast({
+                        title: "New entry created",
+                        description: (
+                            <Toast.Description text={'Entry "Article One" has been successfully created'} />
+                        ),
+                        actions: (
+                            <Toast.Actions>
+                                <Button
+                                    key={"action-1"}
+                                    text={"Do the action"}
+                                    onClick={() => console.log("doTheAction")}
+                                />
+                                <Button
+                                    key={"action-2"}
+                                    text={"Dismiss"}
+                                    onClick={() => console.log("dismiss")}
+                                    variant={"secondary"}
+                                />
+                            </Toast.Actions>
+                        )
+                    });
+                    setLastToast(toast);
+                }}
+            />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default ToastWithDescriptionAndActionsExample;
+` } } />
+
+### With Custom Icon
+
+Customize the icon to match the context of your notification.
+
+<Canvas of={ToastStories.WithCustomIcon} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button, Icon } from "@webiny/admin-ui";
+import { ReactComponent as SettingsIcon } from "@webiny/icons/settings.svg";
+
+const ToastWithCustomIconExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    return (
+        <>
+            <Button
+                text="Show Toast with Custom Icon"
+                onClick={() => {
+                    const toast = showToast({
+                        title: "New entry created",
+                        icon: <Icon icon={<SettingsIcon />} label={"Settings"} />
+                    });
+                    setLastToast(toast);
+                }}
+            />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default ToastWithCustomIconExample;
+` } } />
+
+### With Infinite Duration
+
+Create a toast that doesn't automatically dismiss.
+
+<Canvas of={ToastStories.WithInfiniteDuration} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const ToastWithInfiniteDurationExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    return (
+        <>
+            <Button
+                text="Show Persistent Toast"
+                onClick={() => {
+                    const toast = showToast({
+                        title: "New entry created",
+                        duration: Infinity
+                    });
+                    setLastToast(toast);
+                }}
+            />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default ToastWithInfiniteDurationExample;
+` } } />
+
+### Not Dismissible
+
+Create a toast that can't be manually dismissed.
+
+<Canvas of={ToastStories.NotDismissible} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const ToastNotDismissibleExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    return (
+        <>
+            <Button
+                text="Show Non-Dismissible Toast"
+                onClick={() => {
+                    const toast = showToast({
+                        title: "New entry created",
+                        dismissible: false
+                    });
+                    setLastToast(toast);
+                }}
+            />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default ToastNotDismissibleExample;
+` } } />
+
+### Custom Position
+
+Change the position where toasts appear on the screen.
+
+<Canvas of={ToastStories.withCustomPosition} source={ { code: `
+import React, { useState } from "react";
+import { useToast, Toast, Button } from "@webiny/admin-ui";
+
+const ToastWithCustomPositionExample = () => {
+    const [lastToast, setLastToast] = useState<string | number>("");
+    const { showToast, hideToast, hideAllToasts } = useToast();
+
+    return (
+        <>
+            <Button
+                text="Show Bottom-Right Toast"
+                onClick={() => {
+                    const toast = showToast({
+                        title: "New entry created",
+                        position: "bottom-right"
+                    });
+                    setLastToast(toast);
+                }}
+            />
+            <Button text="Hide latest toast" onClick={() => hideToast(lastToast)} />
+            <Button text="Hide all toasts" onClick={() => hideAllToasts()} />
+            <Toast.Provider />
+        </>
+    );
+};
+
+export default ToastWithCustomPositionExample;
+` } } />
+
+## API
+
+### useToast Hook
+
+The `useToast` hook provides the following methods:
+
+- `showToast(params)`: Displays a toast with the specified parameters and returns a toast ID
+- `hideToast(id)`: Hides a specific toast by its ID
+- `hideAllToasts()`: Hides all currently displayed toasts

package/Toast/components/ToastActions.d.ts

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

package/Toast/components/ToastActions.js

@@ -0,0 +1,13 @@
+import React from "react";
+import { cn, makeDecoratable } from "../../utils";
+const DecoratableToastActions = ({
+  children,
+  className,
+  ...props
+}) => /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
+  className: cn("wby-flex wby-w-full wby-items-center wby-justify-start wby-gap-sm wby-mt-md", className)
+}), children);
+const ToastActions = makeDecoratable("ToastActions", DecoratableToastActions);
+export { ToastActions };
+
+//# sourceMappingURL=ToastActions.js.map

package/Toast/components/ToastActions.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","cn","makeDecoratable","DecoratableToastActions","children","className","props","createElement","Object","assign","ToastActions"],"sources":["ToastActions.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, makeDecoratable } from \"~/utils\";\n\nconst DecoratableToastActions = ({\n    children,\n    className,\n    ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n    <div\n        {...props}\n        className={cn(\n            \"wby-flex wby-w-full wby-items-center wby-justify-start wby-gap-sm wby-mt-md\",\n            className\n        )}\n    >\n        {children}\n    </div>\n);\n\nconst ToastActions = makeDecoratable(\"ToastActions\", DecoratableToastActions);\n\nexport { ToastActions };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,EAAE,EAAEC,eAAe;AAE5B,MAAMC,uBAAuB,GAAGA,CAAC;EAC7BC,QAAQ;EACRC,SAAS;EACT,GAAGC;AAC+B,CAAC,kBACnCN,KAAA,CAAAO,aAAA,QAAAC,MAAA,CAAAC,MAAA,KACQH,KAAK;EACTD,SAAS,EAAEJ,EAAE,CACT,6EAA6E,EAC7EI,SACJ;AAAE,IAEDD,QACA,CACR;AAED,MAAMM,YAAY,GAAGR,eAAe,CAAC,cAAc,EAAEC,uBAAuB,CAAC;AAE7E,SAASO,YAAY","ignoreList":[]}

package/Toast/components/ToastClose.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { type IconButtonProps } from "../../Button";
+type ToastCloseProps = IconButtonProps;
+declare const ToastClose: (props: ToastCloseProps) => React.JSX.Element;
+export { ToastClose, type ToastCloseProps };

package/Toast/components/ToastClose.js

@@ -0,0 +1,15 @@
+import React from "react";
+import { ReactComponent as CloseIcon } from "@webiny/icons/close.svg";
+import { IconButton } from "../../Button";
+import { Icon } from "../../Icon";
+const ToastClose = props => /*#__PURE__*/React.createElement(IconButton, Object.assign({
+  icon: /*#__PURE__*/React.createElement(Icon, {
+    label: "Close",
+    icon: /*#__PURE__*/React.createElement(CloseIcon, null)
+  }),
+  size: "sm",
+  iconSize: "lg"
+}, props));
+export { ToastClose };
+
+//# sourceMappingURL=ToastClose.js.map

package/Toast/components/ToastClose.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ReactComponent","CloseIcon","IconButton","Icon","ToastClose","props","createElement","Object","assign","icon","label","size","iconSize"],"sources":["ToastClose.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as CloseIcon } from \"@webiny/icons/close.svg\";\nimport { IconButton, type IconButtonProps } from \"~/Button\";\nimport { Icon } from \"~/Icon\";\n\ntype ToastCloseProps = IconButtonProps;\n\nconst ToastClose = (props: ToastCloseProps) => (\n    <IconButton\n        icon={<Icon label={\"Close\"} icon={<CloseIcon />} />}\n        size={\"sm\"}\n        iconSize={\"lg\"}\n        {...props}\n    />\n);\n\nexport { ToastClose, type ToastCloseProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,IAAIC,SAAS,QAAQ,yBAAyB;AACrE,SAASC,UAAU;AACnB,SAASC,IAAI;AAIb,MAAMC,UAAU,GAAIC,KAAsB,iBACtCN,KAAA,CAAAO,aAAA,CAACJ,UAAU,EAAAK,MAAA,CAAAC,MAAA;EACPC,IAAI,eAAEV,KAAA,CAAAO,aAAA,CAACH,IAAI;IAACO,KAAK,EAAE,OAAQ;IAACD,IAAI,eAAEV,KAAA,CAAAO,aAAA,CAACL,SAAS,MAAE;EAAE,CAAE,CAAE;EACpDU,IAAI,EAAE,IAAK;EACXC,QAAQ,EAAE;AAAK,GACXP,KAAK,CACZ,CACJ;AAED,SAASD,UAAU","ignoreList":[]}

package/Toast/components/ToastDescription.d.ts

@@ -0,0 +1,24 @@
+import React from "react";
+type DescriptionProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & {
+    text: React.ReactNode;
+};
+declare const ToastDescription: (({ text, className, ...props }: DescriptionProps) => React.JSX.Element) & {
+    original: ({ text, className, ...props }: DescriptionProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: (({ text, className, ...props }: DescriptionProps) => React.JSX.Element) & {
+        original: ({ text, className, ...props }: DescriptionProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(({ text, className, ...props }: DescriptionProps) => React.JSX.Element) & {
+        original: ({ text, className, ...props }: DescriptionProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export { ToastDescription, type DescriptionProps };

package/Toast/components/ToastDescription.js

@@ -0,0 +1,18 @@
+import React from "react";
+import { cn, makeDecoratable } from "../../utils";
+import { Text } from "../../Text";
+const DecoratableToastDescription = ({
+  text,
+  className,
+  ...props
+}) => /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
+  className: cn("wby-mt-xs-plus group-[.wby-default-variant]:wby-text-neutral-dimmed group-[.wby-subtle-variant]:wby-text-neutral-strong", className)
+}), /*#__PURE__*/React.createElement(Text, {
+  as: "div",
+  size: "md",
+  className: "wby-text-neutral-dimmed"
+}, text));
+const ToastDescription = makeDecoratable("ToastDescription", DecoratableToastDescription);
+export { ToastDescription };
+
+//# sourceMappingURL=ToastDescription.js.map

package/Toast/components/ToastDescription.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","cn","makeDecoratable","Text","DecoratableToastDescription","text","className","props","createElement","Object","assign","as","size","ToastDescription"],"sources":["ToastDescription.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, makeDecoratable } from \"~/utils\";\nimport { Text } from \"~/Text\";\n\ntype DescriptionProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"children\"> & {\n    text: React.ReactNode;\n};\n\nconst DecoratableToastDescription = ({ text, className, ...props }: DescriptionProps) => (\n    <div\n        {...props}\n        className={cn(\n            \"wby-mt-xs-plus group-[.wby-default-variant]:wby-text-neutral-dimmed group-[.wby-subtle-variant]:wby-text-neutral-strong\",\n            className\n        )}\n    >\n        <Text as={\"div\"} size={\"md\"} className={\"wby-text-neutral-dimmed\"}>\n            {text}\n        </Text>\n    </div>\n);\n\nconst ToastDescription = makeDecoratable(\"ToastDescription\", DecoratableToastDescription);\n\nexport { ToastDescription, type DescriptionProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,EAAE,EAAEC,eAAe;AAC5B,SAASC,IAAI;AAMb,MAAMC,2BAA2B,GAAGA,CAAC;EAAEC,IAAI;EAAEC,SAAS;EAAE,GAAGC;AAAwB,CAAC,kBAChFP,KAAA,CAAAQ,aAAA,QAAAC,MAAA,CAAAC,MAAA,KACQH,KAAK;EACTD,SAAS,EAAEL,EAAE,CACT,yHAAyH,EACzHK,SACJ;AAAE,iBAEFN,KAAA,CAAAQ,aAAA,CAACL,IAAI;EAACQ,EAAE,EAAE,KAAM;EAACC,IAAI,EAAE,IAAK;EAACN,SAAS,EAAE;AAA0B,GAC7DD,IACC,CACL,CACR;AAED,MAAMQ,gBAAgB,GAAGX,eAAe,CAAC,kBAAkB,EAAEE,2BAA2B,CAAC;AAEzF,SAASS,gBAAgB","ignoreList":[]}

package/Toast/components/ToastIcon.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { Icon as BaseIcon } from "../../Icon";
+type ToastIconProps = {
+    icon?: React.ReactElement<typeof BaseIcon>;
+};
+declare const ToastIcon: ({ icon }: ToastIconProps) => React.JSX.Element;
+export { ToastIcon, type ToastIconProps };

package/Toast/components/ToastIcon.js

@@ -0,0 +1,20 @@
+import React from "react";
+import { ReactComponent as NotificationsIconActive } from "@webiny/icons/notifications_active.svg";
+import { Icon as BaseIcon } from "../../Icon";
+const ToastNotificationIcon = /*#__PURE__*/React.createElement(BaseIcon, {
+  icon: /*#__PURE__*/React.createElement(NotificationsIconActive, null),
+  label: "Notification",
+  size: "md",
+  color: "accent"
+});
+const ToastIcon = ({
+  icon
+}) => {
+  return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.isValidElement(icon) ? /*#__PURE__*/React.cloneElement(icon, {
+    ...ToastNotificationIcon.props,
+    ...icon.props
+  }) : /*#__PURE__*/React.cloneElement(ToastNotificationIcon));
+};
+export { ToastIcon };
+
+//# sourceMappingURL=ToastIcon.js.map

package/Toast/components/ToastIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ReactComponent","NotificationsIconActive","Icon","BaseIcon","ToastNotificationIcon","createElement","icon","label","size","color","ToastIcon","isValidElement","cloneElement","props"],"sources":["ToastIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as NotificationsIconActive } from \"@webiny/icons/notifications_active.svg\";\nimport { Icon as BaseIcon } from \"~/Icon\";\n\nconst ToastNotificationIcon = (\n    <BaseIcon\n        icon={<NotificationsIconActive />}\n        label={\"Notification\"}\n        size={\"md\"}\n        color={\"accent\"}\n    />\n);\n\ntype ToastIconProps = {\n    icon?: React.ReactElement<typeof BaseIcon>;\n};\n\nconst ToastIcon = ({ icon }: ToastIconProps) => {\n    return (\n        <span>\n            {React.isValidElement(icon)\n                ? React.cloneElement(icon, { ...ToastNotificationIcon.props, ...icon.props })\n                : React.cloneElement(ToastNotificationIcon)}\n        </span>\n    );\n};\n\nexport { ToastIcon, type ToastIconProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,IAAIC,uBAAuB,QAAQ,wCAAwC;AAClG,SAASC,IAAI,IAAIC,QAAQ;AAEzB,MAAMC,qBAAqB,gBACvBL,KAAA,CAAAM,aAAA,CAACF,QAAQ;EACLG,IAAI,eAAEP,KAAA,CAAAM,aAAA,CAACJ,uBAAuB,MAAE,CAAE;EAClCM,KAAK,EAAE,cAAe;EACtBC,IAAI,EAAE,IAAK;EACXC,KAAK,EAAE;AAAS,CACnB,CACJ;AAMD,MAAMC,SAAS,GAAGA,CAAC;EAAEJ;AAAqB,CAAC,KAAK;EAC5C,oBACIP,KAAA,CAAAM,aAAA,eACK,aAAAN,KAAK,CAACY,cAAc,CAACL,IAAI,CAAC,gBACrBP,KAAK,CAACa,YAAY,CAACN,IAAI,EAAE;IAAE,GAAGF,qBAAqB,CAACS,KAAK;IAAE,GAAGP,IAAI,CAACO;EAAM,CAAC,CAAC,gBAC3Ed,KAAK,CAACa,YAAY,CAACR,qBAAqB,CAC5C,CAAC;AAEf,CAAC;AAED,SAASM,SAAS","ignoreList":[]}