@webiny/admin-ui 0.0.0-unstable.6844005670 → 0.0.0-unstable.7be00a75a9

package/TimeAgo/TimeAgo.stories.js

@@ -0,0 +1,71 @@
+import "react";
+import { TimeAgo } from "./TimeAgo.js";
+const meta = {
+    title: "Components/TimeAgo",
+    component: TimeAgo
+};
+const TimeAgo_stories = meta;
+const JustNow = {
+    args: {
+        datetime: new Date()
+    }
+};
+const SecondsAgo = {
+    name: "Seconds ago",
+    args: {
+        datetime: new Date(Date.now() - 45000)
+    }
+};
+const MinutesAgo = {
+    name: "Minutes ago",
+    args: {
+        datetime: new Date(Date.now() - 900000)
+    }
+};
+const HoursAgo = {
+    name: "Hours ago",
+    args: {
+        datetime: new Date(Date.now() - 10800000)
+    }
+};
+const DaysAgo = {
+    name: "Days ago",
+    args: {
+        datetime: new Date(Date.now() - 432000000)
+    }
+};
+const WeeksAgo = {
+    name: "Weeks ago",
+    args: {
+        datetime: new Date(Date.now() - 1814400000)
+    }
+};
+const MonthsAgo = {
+    name: "Months ago",
+    args: {
+        datetime: new Date(Date.now() - 10368000000)
+    }
+};
+const YearsAgo = {
+    name: "Years ago",
+    args: {
+        datetime: new Date(Date.now() - 63072000000)
+    }
+};
+const ISOString = {
+    name: "From ISO string",
+    args: {
+        datetime: "2024-01-15T12:00:00Z"
+    }
+};
+const NotLive = {
+    name: "Live updates disabled",
+    args: {
+        datetime: new Date(),
+        live: false
+    }
+};
+export default TimeAgo_stories;
+export { DaysAgo, HoursAgo, ISOString, JustNow, MinutesAgo, MonthsAgo, NotLive, SecondsAgo, WeeksAgo, YearsAgo };
+
+//# sourceMappingURL=TimeAgo.stories.js.map

package/TimeAgo/TimeAgo.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeAgo/TimeAgo.stories.js","sources":["../../src/TimeAgo/TimeAgo.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { TimeAgo } from \"./TimeAgo.js\";\n\nconst meta: Meta<typeof TimeAgo> = {\n    title: \"Components/TimeAgo\",\n    component: TimeAgo\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof TimeAgo>;\n\nexport const JustNow: Story = {\n    args: {\n        datetime: new Date()\n    }\n};\n\nexport const SecondsAgo: Story = {\n    name: \"Seconds ago\",\n    args: {\n        datetime: new Date(Date.now() - 45 * 1000)\n    }\n};\n\nexport const MinutesAgo: Story = {\n    name: \"Minutes ago\",\n    args: {\n        datetime: new Date(Date.now() - 15 * 60 * 1000)\n    }\n};\n\nexport const HoursAgo: Story = {\n    name: \"Hours ago\",\n    args: {\n        datetime: new Date(Date.now() - 3 * 60 * 60 * 1000)\n    }\n};\n\nexport const DaysAgo: Story = {\n    name: \"Days ago\",\n    args: {\n        datetime: new Date(Date.now() - 5 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const WeeksAgo: Story = {\n    name: \"Weeks ago\",\n    args: {\n        datetime: new Date(Date.now() - 3 * 7 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const MonthsAgo: Story = {\n    name: \"Months ago\",\n    args: {\n        datetime: new Date(Date.now() - 4 * 30 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const YearsAgo: Story = {\n    name: \"Years ago\",\n    args: {\n        datetime: new Date(Date.now() - 2 * 365 * 24 * 60 * 60 * 1000)\n    }\n};\n\nexport const ISOString: Story = {\n    name: \"From ISO string\",\n    args: {\n        datetime: \"2024-01-15T12:00:00Z\"\n    }\n};\n\nexport const NotLive: Story = {\n    name: \"Live updates disabled\",\n    args: {\n        datetime: new Date(),\n        live: false\n    }\n};\n"],"names":["meta","TimeAgo","JustNow","Date","SecondsAgo","MinutesAgo","HoursAgo","DaysAgo","WeeksAgo","MonthsAgo","YearsAgo","ISOString","NotLive"],"mappings":";;AAIA,MAAMA,OAA6B;IAC/B,OAAO;IACP,WAAWC;AACf;AAEA,wBAAeD;AAIR,MAAME,UAAiB;IAC1B,MAAM;QACF,UAAU,IAAIC;IAClB;AACJ;AAEO,MAAMC,aAAoB;IAC7B,MAAM;IACN,MAAM;QACF,UAAU,IAAID,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAME,aAAoB;IAC7B,MAAM;IACN,MAAM;QACF,UAAU,IAAIF,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMG,WAAkB;IAC3B,MAAM;IACN,MAAM;QACF,UAAU,IAAIH,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMI,UAAiB;IAC1B,MAAM;IACN,MAAM;QACF,UAAU,IAAIJ,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMK,WAAkB;IAC3B,MAAM;IACN,MAAM;QACF,UAAU,IAAIL,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMM,YAAmB;IAC5B,MAAM;IACN,MAAM;QACF,UAAU,IAAIN,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMO,WAAkB;IAC3B,MAAM;IACN,MAAM;QACF,UAAU,IAAIP,KAAKA,KAAK,GAAG,KAAK;IACpC;AACJ;AAEO,MAAMQ,YAAmB;IAC5B,MAAM;IACN,MAAM;QACF,UAAU;IACd;AACJ;AAEO,MAAMC,UAAiB;IAC1B,MAAM;IACN,MAAM;QACF,UAAU,IAAIT;QACd,MAAM;IACV;AACJ"}

package/TimeAgo/formatElapsed.d.ts

@@ -0,0 +1 @@
+export declare function formatElapsed(seconds: number): string;

package/TimeAgo/formatElapsed.js

@@ -0,0 +1,27 @@
+const MINUTE = 60;
+const HOUR = 3600;
+const DAY = 86400;
+const WEEK = 604800;
+const MONTH = 2592000;
+const YEAR = 31536000;
+function formatElapsed(seconds) {
+    const abs = Math.abs(seconds);
+    const suffix = seconds < 0 ? "from now" : "ago";
+    if (abs < 30) return "just now";
+    if (abs < MINUTE) return `${abs} seconds ${suffix}`;
+    if (abs < 2 * MINUTE) return `1 minute ${suffix}`;
+    if (abs < HOUR) return `${Math.floor(abs / MINUTE)} minutes ${suffix}`;
+    if (abs < 2 * HOUR) return `1 hour ${suffix}`;
+    if (abs < DAY) return `${Math.floor(abs / HOUR)} hours ${suffix}`;
+    if (abs < 2 * DAY) return `1 day ${suffix}`;
+    if (abs < WEEK) return `${Math.floor(abs / DAY)} days ${suffix}`;
+    if (abs < 2 * WEEK) return `1 week ${suffix}`;
+    if (abs < MONTH) return `${Math.floor(abs / WEEK)} weeks ${suffix}`;
+    if (abs < 2 * MONTH) return `1 month ${suffix}`;
+    if (abs < YEAR) return `${Math.floor(abs / MONTH)} months ${suffix}`;
+    if (abs < 2 * YEAR) return `1 year ${suffix}`;
+    return `${Math.floor(abs / YEAR)} years ${suffix}`;
+}
+export { formatElapsed };
+
+//# sourceMappingURL=formatElapsed.js.map

package/TimeAgo/formatElapsed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeAgo/formatElapsed.js","sources":["../../src/TimeAgo/formatElapsed.ts"],"sourcesContent":["const MINUTE = 60;\nconst HOUR = 3600;\nconst DAY = 86400;\nconst WEEK = 604800;\nconst MONTH = 2_592_000;\nconst YEAR = 31_536_000;\n\nexport function formatElapsed(seconds: number): string {\n    const abs = Math.abs(seconds);\n    const suffix = seconds < 0 ? \"from now\" : \"ago\";\n\n    if (abs < 30) {\n        return \"just now\";\n    }\n    if (abs < MINUTE) {\n        return `${abs} seconds ${suffix}`;\n    }\n    if (abs < 2 * MINUTE) {\n        return `1 minute ${suffix}`;\n    }\n    if (abs < HOUR) {\n        return `${Math.floor(abs / MINUTE)} minutes ${suffix}`;\n    }\n    if (abs < 2 * HOUR) {\n        return `1 hour ${suffix}`;\n    }\n    if (abs < DAY) {\n        return `${Math.floor(abs / HOUR)} hours ${suffix}`;\n    }\n    if (abs < 2 * DAY) {\n        return `1 day ${suffix}`;\n    }\n    if (abs < WEEK) {\n        return `${Math.floor(abs / DAY)} days ${suffix}`;\n    }\n    if (abs < 2 * WEEK) {\n        return `1 week ${suffix}`;\n    }\n    if (abs < MONTH) {\n        return `${Math.floor(abs / WEEK)} weeks ${suffix}`;\n    }\n    if (abs < 2 * MONTH) {\n        return `1 month ${suffix}`;\n    }\n    if (abs < YEAR) {\n        return `${Math.floor(abs / MONTH)} months ${suffix}`;\n    }\n    if (abs < 2 * YEAR) {\n        return `1 year ${suffix}`;\n    }\n    return `${Math.floor(abs / YEAR)} years ${suffix}`;\n}\n"],"names":["MINUTE","HOUR","DAY","WEEK","MONTH","YEAR","formatElapsed","seconds","abs","Math","suffix"],"mappings":"AAAA,MAAMA,SAAS;AACf,MAAMC,OAAO;AACb,MAAMC,MAAM;AACZ,MAAMC,OAAO;AACb,MAAMC,QAAQ;AACd,MAAMC,OAAO;AAEN,SAASC,cAAcC,OAAe;IACzC,MAAMC,MAAMC,KAAK,GAAG,CAACF;IACrB,MAAMG,SAASH,UAAU,IAAI,aAAa;IAE1C,IAAIC,MAAM,IACN,OAAO;IAEX,IAAIA,MAAMR,QACN,OAAO,GAAGQ,IAAI,SAAS,EAAEE,QAAQ;IAErC,IAAIF,MAAM,IAAIR,QACV,OAAO,CAAC,SAAS,EAAEU,QAAQ;IAE/B,IAAIF,MAAMP,MACN,OAAO,GAAGQ,KAAK,KAAK,CAACD,MAAMR,QAAQ,SAAS,EAAEU,QAAQ;IAE1D,IAAIF,MAAM,IAAIP,MACV,OAAO,CAAC,OAAO,EAAES,QAAQ;IAE7B,IAAIF,MAAMN,KACN,OAAO,GAAGO,KAAK,KAAK,CAACD,MAAMP,MAAM,OAAO,EAAES,QAAQ;IAEtD,IAAIF,MAAM,IAAIN,KACV,OAAO,CAAC,MAAM,EAAEQ,QAAQ;IAE5B,IAAIF,MAAML,MACN,OAAO,GAAGM,KAAK,KAAK,CAACD,MAAMN,KAAK,MAAM,EAAEQ,QAAQ;IAEpD,IAAIF,MAAM,IAAIL,MACV,OAAO,CAAC,OAAO,EAAEO,QAAQ;IAE7B,IAAIF,MAAMJ,OACN,OAAO,GAAGK,KAAK,KAAK,CAACD,MAAML,MAAM,OAAO,EAAEO,QAAQ;IAEtD,IAAIF,MAAM,IAAIJ,OACV,OAAO,CAAC,QAAQ,EAAEM,QAAQ;IAE9B,IAAIF,MAAMH,MACN,OAAO,GAAGI,KAAK,KAAK,CAACD,MAAMJ,OAAO,QAAQ,EAAEM,QAAQ;IAExD,IAAIF,MAAM,IAAIH,MACV,OAAO,CAAC,OAAO,EAAEK,QAAQ;IAE7B,OAAO,GAAGD,KAAK,KAAK,CAACD,MAAMH,MAAM,OAAO,EAAEK,QAAQ;AACtD"}

package/TimeAgo/getElapsedSeconds.d.ts

@@ -0,0 +1,2 @@
+import type { TDate } from "./types.js";
+export declare function getElapsedSeconds(datetime: TDate, relativeDate?: TDate): number;

package/TimeAgo/getElapsedSeconds.js

@@ -0,0 +1,9 @@
+import { toEpochMs } from "./toEpochMs.js";
+function getElapsedSeconds(datetime, relativeDate) {
+    const now = relativeDate ? Temporal.Instant.fromEpochMilliseconds(toEpochMs(relativeDate)) : Temporal.Now.instant();
+    const past = Temporal.Instant.fromEpochMilliseconds(toEpochMs(datetime));
+    return Math.round(now.since(past).total("second"));
+}
+export { getElapsedSeconds };
+
+//# sourceMappingURL=getElapsedSeconds.js.map

package/TimeAgo/getElapsedSeconds.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeAgo/getElapsedSeconds.js","sources":["../../src/TimeAgo/getElapsedSeconds.ts"],"sourcesContent":["import type { TDate } from \"./types.js\";\nimport { toEpochMs } from \"./toEpochMs.js\";\n\nexport function getElapsedSeconds(datetime: TDate, relativeDate?: TDate): number {\n    const now = relativeDate\n        ? Temporal.Instant.fromEpochMilliseconds(toEpochMs(relativeDate))\n        : Temporal.Now.instant();\n    const past = Temporal.Instant.fromEpochMilliseconds(toEpochMs(datetime));\n    return Math.round(now.since(past).total(\"second\"));\n}\n"],"names":["getElapsedSeconds","datetime","relativeDate","now","Temporal","toEpochMs","past","Math"],"mappings":";AAGO,SAASA,kBAAkBC,QAAe,EAAEC,YAAoB;IACnE,MAAMC,MAAMD,eACNE,SAAS,OAAO,CAAC,qBAAqB,CAACC,UAAUH,iBACjDE,SAAS,GAAG,CAAC,OAAO;IAC1B,MAAME,OAAOF,SAAS,OAAO,CAAC,qBAAqB,CAACC,UAAUJ;IAC9D,OAAOM,KAAK,KAAK,CAACJ,IAAI,KAAK,CAACG,MAAM,KAAK,CAAC;AAC5C"}

package/TimeAgo/getUpdateDelay.d.ts

@@ -0,0 +1,3 @@
+import type { UpdateIntervals } from "./types.js";
+export declare const DEFAULT_INTERVALS: Required<UpdateIntervals>;
+export declare function getUpdateDelay(seconds: number, minInterval?: number, intervals?: Required<UpdateIntervals>): number | null;

package/TimeAgo/getUpdateDelay.js

@@ -0,0 +1,24 @@
+const MINUTE = 60;
+const HOUR = 3600;
+const FIVE_MINUTES = 5 * MINUTE;
+const FIFTEEN_MINUTES = 15 * MINUTE;
+const DEFAULT_INTERVALS = {
+    underFiveMinutes: 1000,
+    underFifteenMinutes: 10000,
+    underOneHour: 30000
+};
+function getUpdateDelay(seconds, minInterval, intervals = DEFAULT_INTERVALS) {
+    const abs = Math.abs(seconds);
+    let delay;
+    if (abs < FIVE_MINUTES) delay = intervals.underFiveMinutes;
+    else if (abs < FIFTEEN_MINUTES) delay = intervals.underFifteenMinutes;
+    else {
+        if (!(abs < HOUR)) return null;
+        delay = intervals.underOneHour;
+    }
+    if (minInterval) delay = Math.max(delay, 1000 * minInterval);
+    return delay;
+}
+export { DEFAULT_INTERVALS, getUpdateDelay };
+
+//# sourceMappingURL=getUpdateDelay.js.map

package/TimeAgo/getUpdateDelay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeAgo/getUpdateDelay.js","sources":["../../src/TimeAgo/getUpdateDelay.ts"],"sourcesContent":["import type { UpdateIntervals } from \"./types.js\";\n\nconst MINUTE = 60;\nconst HOUR = 3600;\nconst FIVE_MINUTES = 5 * MINUTE;\nconst FIFTEEN_MINUTES = 15 * MINUTE;\n\nexport const DEFAULT_INTERVALS: Required<UpdateIntervals> = {\n    underFiveMinutes: 1_000,\n    underFifteenMinutes: 10_000,\n    underOneHour: 30_000\n};\n\nexport function getUpdateDelay(\n    seconds: number,\n    minInterval?: number,\n    intervals: Required<UpdateIntervals> = DEFAULT_INTERVALS\n): number | null {\n    const abs = Math.abs(seconds);\n    let delay: number;\n\n    if (abs < FIVE_MINUTES) {\n        delay = intervals.underFiveMinutes;\n    } else if (abs < FIFTEEN_MINUTES) {\n        delay = intervals.underFifteenMinutes;\n    } else if (abs < HOUR) {\n        delay = intervals.underOneHour;\n    } else {\n        return null;\n    }\n\n    if (minInterval) {\n        delay = Math.max(delay, minInterval * 1000);\n    }\n\n    return delay;\n}\n"],"names":["MINUTE","HOUR","FIVE_MINUTES","FIFTEEN_MINUTES","DEFAULT_INTERVALS","getUpdateDelay","seconds","minInterval","intervals","abs","Math","delay"],"mappings":"AAEA,MAAMA,SAAS;AACf,MAAMC,OAAO;AACb,MAAMC,eAAe,IAAIF;AACzB,MAAMG,kBAAkB,KAAKH;AAEtB,MAAMI,oBAA+C;IACxD,kBAAkB;IAClB,qBAAqB;IACrB,cAAc;AAClB;AAEO,SAASC,eACZC,OAAe,EACfC,WAAoB,EACpBC,YAAuCJ,iBAAiB;IAExD,MAAMK,MAAMC,KAAK,GAAG,CAACJ;IACrB,IAAIK;IAEJ,IAAIF,MAAMP,cACNS,QAAQH,UAAU,gBAAgB;SAC/B,IAAIC,MAAMN,iBACbQ,QAAQH,UAAU,mBAAmB;;QAClC,KAAIC,CAAAA,MAAMR,IAAG,GAGhB,OAAO;QAFPU,QAAQH,UAAU,YAAY;;IAKlC,IAAID,aACAI,QAAQD,KAAK,GAAG,CAACC,OAAOJ,AAAc,OAAdA;IAG5B,OAAOI;AACX"}

package/TimeAgo/index.d.ts

@@ -1,3 +1,2 @@
-import TimeAgo from "timeago-react";
-export type { TimeAgoProps, Opts, TDate } from "timeago-react";
-export { TimeAgo };
+export type { TimeAgoProps, Opts, TDate, UpdateIntervals } from "./types.js";
+export { TimeAgo } from "./TimeAgo.js";

package/TimeAgo/index.js

@@ -1,4 +1 @@
-import TimeAgo from "timeago-react";
-export { TimeAgo };
-
-//# sourceMappingURL=index.js.map
+export { TimeAgo } from "./TimeAgo.js";

package/TimeAgo/toEpochMs.d.ts

@@ -0,0 +1,2 @@
+import type { TDate } from "./types.js";
+export declare function toEpochMs(date: TDate): number;

package/TimeAgo/toEpochMs.js

@@ -0,0 +1,8 @@
+function toEpochMs(date) {
+    if (date instanceof Date) return date.getTime();
+    if ("number" == typeof date) return date;
+    return new Date(date).getTime();
+}
+export { toEpochMs };
+
+//# sourceMappingURL=toEpochMs.js.map

package/TimeAgo/toEpochMs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeAgo/toEpochMs.js","sources":["../../src/TimeAgo/toEpochMs.ts"],"sourcesContent":["import type { TDate } from \"./types.js\";\n\nexport function toEpochMs(date: TDate): number {\n    if (date instanceof Date) {\n        return date.getTime();\n    }\n    if (typeof date === \"number\") {\n        return date;\n    }\n    return new Date(date).getTime();\n}\n"],"names":["toEpochMs","date","Date"],"mappings":"AAEO,SAASA,UAAUC,IAAW;IACjC,IAAIA,gBAAgBC,MAChB,OAAOD,KAAK,OAAO;IAEvB,IAAI,AAAgB,YAAhB,OAAOA,MACP,OAAOA;IAEX,OAAO,IAAIC,KAAKD,MAAM,OAAO;AACjC"}

package/TimeAgo/toISOString.d.ts

@@ -0,0 +1,2 @@
+import type { TDate } from "./types.js";
+export declare function toISOString(date: TDate): string;

package/TimeAgo/toISOString.js

@@ -0,0 +1,8 @@
+function toISOString(date) {
+    if (date instanceof Date) return date.toISOString();
+    if ("number" == typeof date) return new Date(date).toISOString();
+    return date;
+}
+export { toISOString };
+
+//# sourceMappingURL=toISOString.js.map

package/TimeAgo/toISOString.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeAgo/toISOString.js","sources":["../../src/TimeAgo/toISOString.ts"],"sourcesContent":["import type { TDate } from \"./types.js\";\n\nexport function toISOString(date: TDate): string {\n    if (date instanceof Date) {\n        return date.toISOString();\n    }\n    if (typeof date === \"number\") {\n        return new Date(date).toISOString();\n    }\n    return date;\n}\n"],"names":["toISOString","date","Date"],"mappings":"AAEO,SAASA,YAAYC,IAAW;IACnC,IAAIA,gBAAgBC,MAChB,OAAOD,KAAK,WAAW;IAE3B,IAAI,AAAgB,YAAhB,OAAOA,MACP,OAAO,IAAIC,KAAKD,MAAM,WAAW;IAErC,OAAOA;AACX"}

package/TimeAgo/types.d.ts

@@ -0,0 +1,18 @@
+import type { ComponentProps } from "react";
+export type TDate = Date | string | number;
+export interface UpdateIntervals {
+    readonly underFiveMinutes?: number;
+    readonly underFifteenMinutes?: number;
+    readonly underOneHour?: number;
+}
+export interface Opts {
+    readonly relativeDate?: TDate;
+    readonly minInterval?: number;
+    readonly updateIntervals?: UpdateIntervals;
+}
+export interface TimeAgoProps extends ComponentProps<"time"> {
+    readonly datetime: TDate;
+    readonly live?: boolean;
+    readonly opts?: Opts;
+    readonly locale?: string;
+}

package/Toast/Toast.js

@@ -1,37 +1,29 @@
-import * as React from "react";
 import { Toaster } from "sonner";
 import { makeDecoratable, withStaticProps } from "../utils.js";
 import { Portal } from "../Portal/index.js";
 import { ToastActions, ToastClose, ToastDescription, ToastIcon, ToastRoot, ToastTitle } from "./components/index.js";
-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: "w-64"
-  }, title, description && description, actions && actions), dismissible && /*#__PURE__*/React.createElement(ToastClose, {
-    onClick: onCloseClick,
-    variant: props.variant === "subtle" ? "subtle" : "ghost-negative"
-  }));
-};
+import * as __rspack_external_react from "react";
+const DecoratableToast = ({ title, description, icon, actions, onCloseClick, dismissible = true, ...props })=>/*#__PURE__*/ __rspack_external_react.createElement(ToastRoot, {
+        hasDescription: !!description || !!actions,
+        ...props
+    }, /*#__PURE__*/ __rspack_external_react.createElement(ToastIcon, {
+        icon: icon
+    }), /*#__PURE__*/ __rspack_external_react.createElement("div", {
+        className: "w-64"
+    }, title, description && description, actions && actions), dismissible && /*#__PURE__*/ __rspack_external_react.createElement(ToastClose, {
+        onClick: onCloseClick,
+        variant: "subtle" === props.variant ? "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: "bottom-left"
-  }, props)))
+    Title: ToastTitle,
+    Description: ToastDescription,
+    Actions: ToastActions,
+    Provider: (props)=>/*#__PURE__*/ __rspack_external_react.createElement(Portal, null, /*#__PURE__*/ __rspack_external_react.createElement(Toaster, {
+            expand: true,
+            duration: 6000,
+            position: "bottom-left",
+            ...props
+        }))
 });
 export { Toast };
 

package/Toast/Toast.js.map

@@ -1 +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.js\";\nimport { type IconButtonProps } from \"~/Button/index.js\";\nimport type { Icon as BaseIcon } from \"~/Icon/index.js\";\nimport { Portal } from \"~/Portal/index.js\";\nimport {\n    ToastActions,\n    ToastClose,\n    ToastDescription,\n    ToastIcon,\n    ToastRoot,\n    ToastTitle,\n    type ToastRootProps\n} from \"./components/index.js\";\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=\"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={\"bottom-left\"} {...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;EAAM,GAChBX,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;EAAc,GAAKf,KAAK,CAAG,CACxE;AAEhB,CAAC,CAAC;AAEF,SAASQ,KAAK","ignoreList":[]}
+{"version":3,"file":"Toast/Toast.js","sources":["../../src/Toast/Toast.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Toaster, type ToasterProps } from \"sonner\";\nimport { makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport { type IconButtonProps } from \"~/Button/index.js\";\nimport type { Icon as BaseIcon } from \"~/Icon/index.js\";\nimport { Portal } from \"~/Portal/index.js\";\nimport {\n    ToastActions,\n    ToastClose,\n    ToastDescription,\n    ToastIcon,\n    ToastRoot,\n    ToastTitle,\n    type ToastRootProps\n} from \"./components/index.js\";\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=\"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={\"bottom-left\"} {...props} />\n        </Portal>\n    )\n});\n\nexport { Toast, type ToastProps };\n"],"names":["DecoratableToast","title","description","icon","actions","onCloseClick","dismissible","props","ToastRoot","ToastIcon","ToastClose","Toast","withStaticProps","makeDecoratable","ToastTitle","ToastDescription","ToastActions","Portal","Toaster"],"mappings":";;;;;AAyBA,MAAMA,mBAAmB,CAAC,EACtBC,KAAK,EACLC,WAAW,EACXC,IAAI,EACJC,OAAO,EACPC,YAAY,EACZC,cAAc,IAAI,EAClB,GAAGC,OACM,GACF,WAAP,GACI,sCAACC,WAASA;QAAC,gBAAgB,CAAC,CAACN,eAAe,CAAC,CAACE;QAAU,GAAGG,KAAK;qBAC5D,sCAACE,WAASA;QAAC,MAAMN;sBACjB,sCAAC;QAAI,WAAU;OACVF,OACAC,eAAeA,aACfE,WAAWA,UAEfE,eAAe,WAAfA,GACG,sCAACI,YAAUA;QACP,SAASL;QACT,SACIE,AAAkB,aAAlBA,MAAM,OAAO,GACN,WACA;;AAQ/B,MAAMI,QAAQC,gBAAgBC,gBAAgB,SAASb,mBAAmB;IACtE,OAAOc;IACP,aAAaC;IACb,SAASC;IACT,UAAU,CAACT,QAAAA,WAAAA,GACP,sCAACU,QAAMA,MAAAA,WAAAA,GACH,sCAACC,SAAOA;YAAC,QAAQ;YAAM,UAAU;YAAM,UAAU;YAAgB,GAAGX,KAAK;;AAGrF"}

package/Toast/Toast.mdx

@@ -1,6 +1,6 @@
-import { Canvas, Meta, Controls } from '@storybook/addon-docs/blocks';
+import { Canvas, Meta, Controls } from "@storybook/addon-docs/blocks";
 
-import * as ToastStories from './useToast.stories';
+import * as ToastStories from "./useToast.stories";
 
 <Meta of={ToastStories} />
 
@@ -15,8 +15,8 @@ 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 [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
         const handleShowToast = () => {
             const toast = showToast({
@@ -38,17 +38,17 @@ const ToastExample = () => {
     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'
-                    );
-                },
-            }
-        ]}
+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} />
@@ -58,24 +58,24 @@ 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 />
-        </>
-    );
+  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;
@@ -92,8 +92,8 @@ 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();
+const [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
     return (
         <>
@@ -111,6 +111,7 @@ const BasicToastExample = () => {
             <Toast.Provider />
         </>
     );
+
 };
 
 export default BasicToastExample;
@@ -125,8 +126,8 @@ 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();
+const [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
     return (
         <>
@@ -145,6 +146,7 @@ const SubtleToastExample = () => {
             <Toast.Provider />
         </>
     );
+
 };
 
 export default SubtleToastExample;
@@ -159,8 +161,8 @@ 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();
+const [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
     return (
         <>
@@ -179,6 +181,7 @@ const ToastWithDescriptionExample = () => {
             <Toast.Provider />
         </>
     );
+
 };
 
 export default ToastWithDescriptionExample;
@@ -193,8 +196,8 @@ 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();
+const [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
     return (
         <>
@@ -215,6 +218,7 @@ const ToastWithComponentsExample = () => {
             <Toast.Provider />
         </>
     );
+
 };
 
 export default ToastWithComponentsExample;
@@ -229,8 +233,8 @@ 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();
+const [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
     return (
         <>
@@ -263,6 +267,7 @@ const ToastWithActionsExample = () => {
             <Toast.Provider />
         </>
     );
+
 };
 
 export default ToastWithActionsExample;
@@ -277,8 +282,8 @@ 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();
+const [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
     return (
         <>
@@ -314,6 +319,7 @@ const ToastWithDescriptionAndActionsExample = () => {
             <Toast.Provider />
         </>
     );
+
 };
 
 export default ToastWithDescriptionAndActionsExample;
@@ -329,8 +335,8 @@ 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();
+const [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
     return (
         <>
@@ -349,6 +355,7 @@ const ToastWithCustomIconExample = () => {
             <Toast.Provider />
         </>
     );
+
 };
 
 export default ToastWithCustomIconExample;
@@ -363,8 +370,8 @@ 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();
+const [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
     return (
         <>
@@ -383,6 +390,7 @@ const ToastWithInfiniteDurationExample = () => {
             <Toast.Provider />
         </>
     );
+
 };
 
 export default ToastWithInfiniteDurationExample;
@@ -397,8 +405,8 @@ 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();
+const [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
     return (
         <>
@@ -417,6 +425,7 @@ const ToastNotDismissibleExample = () => {
             <Toast.Provider />
         </>
     );
+
 };
 
 export default ToastNotDismissibleExample;
@@ -431,8 +440,8 @@ 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();
+const [lastToast, setLastToast] = useState<string | number>("");
+const { showToast, hideToast, hideAllToasts } = useToast();
 
     return (
         <>
@@ -451,6 +460,7 @@ const ToastWithCustomPositionExample = () => {
             <Toast.Provider />
         </>
     );
+
 };
 
 export default ToastWithCustomPositionExample;

package/Toast/components/ToastActions.js

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

package/Toast/components/ToastActions.js.map

@@ -1 +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.js\";\n\nconst DecoratableToastActions = ({\n    children,\n    className,\n    ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n    <div\n        {...props}\n        className={cn(\"flex w-full items-center justify-start gap-sm mt-md\", className)}\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,CAAC,qDAAqD,EAAEI,SAAS;AAAE,IAE/ED,QACA,CACR;AAED,MAAMM,YAAY,GAAGR,eAAe,CAAC,cAAc,EAAEC,uBAAuB,CAAC;AAE7E,SAASO,YAAY","ignoreList":[]}
+{"version":3,"file":"Toast/components/ToastActions.js","sources":["../../../src/Toast/components/ToastActions.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, makeDecoratable } from \"~/utils.js\";\n\nconst DecoratableToastActions = ({\n    children,\n    className,\n    ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n    <div\n        {...props}\n        className={cn(\"flex w-full items-center justify-start gap-sm mt-md\", className)}\n    >\n        {children}\n    </div>\n);\n\nconst ToastActions = makeDecoratable(\"ToastActions\", DecoratableToastActions);\n\nexport { ToastActions };\n"],"names":["DecoratableToastActions","children","className","props","cn","ToastActions","makeDecoratable"],"mappings":";;AAGA,MAAMA,0BAA0B,CAAC,EAC7BC,QAAQ,EACRC,SAAS,EACT,GAAGC,OACgC,iBACnC,oBAAC;QACI,GAAGA,KAAK;QACT,WAAWC,GAAG,uDAAuDF;OAEpED;AAIT,MAAMI,eAAeC,gBAAgB,gBAAgBN"}