@trops/dash-core 0.1.330 → 0.1.332

package/dist/index.esm.js

@@ -595,10 +595,13 @@ var DashboardApi = {
  * Widgets can call these methods directly (not via events) to
  * control the dashboard they are rendered in.
  *
- * Internally dispatches CustomEvents on `window` so the API
- * stays decoupled from the React component tree.
+ * Write actions internally dispatch CustomEvents on `window` so the
+ * API stays decoupled from the React component tree. Read methods
+ * return values from `window.__dashState`, which DashboardStage
+ * keeps up-to-date as workspace/page state changes.
  */
 var DashboardActionsApi = {
+  // ─── Page Navigation ──────────────────────────────────────────────
   /**
    * Switch the active page by its internal ID.
    * @param {string} pageId - The ID of the page to switch to
@@ -620,6 +623,119 @@ var DashboardActionsApi = {
         pageName: pageName
       }
     }));
+  },
+  /**
+   * Navigate to the previous page in history (browser-style back).
+   */
+  goBack: function goBack() {
+    window.dispatchEvent(new CustomEvent("dash:go-back"));
+  },
+  // ─── Workspace Nav Sidebar (far-left DashSidebar) ─────────────────
+  /**
+   * Collapse the workspace nav sidebar.
+   */
+  closeSidebar: function closeSidebar() {
+    window.dispatchEvent(new CustomEvent("dash:set-nav-sidebar", {
+      detail: {
+        collapsed: true
+      }
+    }));
+  },
+  /**
+   * Expand the workspace nav sidebar.
+   */
+  openSidebar: function openSidebar() {
+    window.dispatchEvent(new CustomEvent("dash:set-nav-sidebar", {
+      detail: {
+        collapsed: false
+      }
+    }));
+  },
+  /**
+   * Toggle the workspace nav sidebar.
+   */
+  toggleSidebar: function toggleSidebar() {
+    window.dispatchEvent(new CustomEvent("dash:toggle-nav-sidebar"));
+  },
+  // ─── Workspace (Dashboard) Navigation ─────────────────────────────
+  /**
+   * Open another dashboard in a tab by name.
+   * @param {string} name - The display name of the dashboard
+   */
+  openDashboardByName: function openDashboardByName(name) {
+    window.dispatchEvent(new CustomEvent("dash:open-dashboard", {
+      detail: {
+        name: name
+      }
+    }));
+  },
+  /**
+   * Close a dashboard tab. Closes the active tab if no name is given.
+   * @param {string} [name] - Optional: name of the dashboard tab to close
+   */
+  closeDashboard: function closeDashboard(name) {
+    window.dispatchEvent(new CustomEvent("dash:close-dashboard", {
+      detail: {
+        name: name
+      }
+    }));
+  },
+  // ─── Notifications (in-app toasts) ────────────────────────────────
+  /**
+   * Show an in-app toast notification.
+   * @param {string} message - The toast message
+   * @param {object} [options]
+   * @param {"success"|"error"|"info"|"warning"} [options.type="info"]
+   * @param {string} [options.title]
+   * @param {number} [options.duration=4000] - Auto-dismiss after ms
+   */
+  notify: function notify(message) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    window.dispatchEvent(new CustomEvent("dash:notify", {
+      detail: {
+        message: message,
+        type: options.type || "info",
+        title: options.title,
+        duration: options.duration || 4000
+      }
+    }));
+  },
+  // ─── Read Methods (synchronous, from window.__dashState) ──────────
+  /**
+   * @returns {string|null} The ID of the active page
+   */
+  getCurrentPageId: function getCurrentPageId() {
+    var _window$__dashState;
+    return ((_window$__dashState = window.__dashState) === null || _window$__dashState === void 0 ? void 0 : _window$__dashState.currentPageId) || null;
+  },
+  /**
+   * @returns {string|null} The display name of the active page
+   */
+  getCurrentPageName: function getCurrentPageName() {
+    var _window$__dashState2;
+    return ((_window$__dashState2 = window.__dashState) === null || _window$__dashState2 === void 0 ? void 0 : _window$__dashState2.currentPageName) || null;
+  },
+  /**
+   * @returns {number|null} The ID of the active dashboard
+   */
+  getCurrentDashboardId: function getCurrentDashboardId() {
+    var _window$__dashState3;
+    return ((_window$__dashState3 = window.__dashState) === null || _window$__dashState3 === void 0 ? void 0 : _window$__dashState3.currentDashboardId) || null;
+  },
+  /**
+   * @returns {string|null} The display name of the active dashboard
+   */
+  getCurrentDashboardName: function getCurrentDashboardName() {
+    var _window$__dashState4;
+    return ((_window$__dashState4 = window.__dashState) === null || _window$__dashState4 === void 0 ? void 0 : _window$__dashState4.currentDashboardName) || null;
+  },
+  /**
+   * @returns {Array<{id: string, name: string, order: number}>}
+   *   Pages in the current dashboard
+   */
+  listPages: function listPages() {
+    var _window$__dashState5;
+    return ((_window$__dashState5 = window.__dashState) === null || _window$__dashState5 === void 0 ? void 0 : _window$__dashState5.pages) || [];
   }
 };
 
@@ -50995,22 +51111,28 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
     widgetSidebarCollapsed = _useState0[0],
     setWidgetSidebarCollapsed = _useState0[1];
 
-  // ─── Recents + Session ──────────────────────────────────────────
+  // ─── In-app toasts (driven by DashboardActionsApi.notify) ────────
   var _useState1 = useState([]),
     _useState10 = _slicedToArray(_useState1, 2),
-    recentDashboards = _useState10[0],
-    setRecentDashboards = _useState10[1];
+    toasts = _useState10[0],
+    setToasts = _useState10[1];
+
+  // ─── Recents + Session ──────────────────────────────────────────
+  var _useState11 = useState([]),
+    _useState12 = _slicedToArray(_useState11, 2),
+    recentDashboards = _useState12[0],
+    setRecentDashboards = _useState12[1];
   var sessionRestored = useRef(false);
 
   // ─── Registry Auth (for sidebar) ────────────────────────────────
-  var _useState11 = useState("loading"),
-    _useState12 = _slicedToArray(_useState11, 2),
-    authStatus = _useState12[0],
-    setAuthStatus = _useState12[1];
-  var _useState13 = useState(null),
+  var _useState13 = useState("loading"),
     _useState14 = _slicedToArray(_useState13, 2),
-    authProfile = _useState14[0],
-    setAuthProfile = _useState14[1];
+    authStatus = _useState14[0],
+    setAuthStatus = _useState14[1];
+  var _useState15 = useState(null),
+    _useState16 = _slicedToArray(_useState15, 2),
+    authProfile = _useState16[0],
+    setAuthProfile = _useState16[1];
 
   // Derive workspaceSelected from active tab
   var workspaceSelected = activeTabId ? (_openTabs$find$worksp = (_openTabs$find = openTabs.find(function (tab) {
@@ -51020,84 +51142,84 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
   /**
    * @param {Boolean} previewMode this is a toggle telling the dash we are editing
    */
-  var _useState15 = useState(preview),
-    _useState16 = _slicedToArray(_useState15, 2),
-    previewMode = _useState16[0],
-    setPreviewMode = _useState16[1];
+  var _useState17 = useState(preview),
+    _useState18 = _slicedToArray(_useState17, 2),
+    previewMode = _useState18[0],
+    setPreviewMode = _useState18[1];
 
   /**
    * @param {String["layout", "workspace", "widget"]} editMode this is the actual mode we are in
    */
-  var _useState17 = useState("all"),
-    _useState18 = _slicedToArray(_useState17, 1),
-    editMode = _useState18[0]; // for the time being use "all" as our "old" way
+  var _useState19 = useState("all"),
+    _useState20 = _slicedToArray(_useState19, 1),
+    editMode = _useState20[0]; // for the time being use "all" as our "old" way
 
   // Workspace Management (loading)
-  var _useState19 = useState(false),
-    _useState20 = _slicedToArray(_useState19, 2),
-    isLoadingWorkspaces = _useState20[0],
-    setIsLoadingWorkspaces = _useState20[1];
   var _useState21 = useState(false),
     _useState22 = _slicedToArray(_useState21, 2),
-    isLoadingMenuItems = _useState22[0],
-    setIsLoadingMenuItems = _useState22[1];
-  var _useState23 = useState([]),
+    isLoadingWorkspaces = _useState22[0],
+    setIsLoadingWorkspaces = _useState22[1];
+  var _useState23 = useState(false),
     _useState24 = _slicedToArray(_useState23, 2),
-    menuItems = _useState24[0],
-    setMenuItems = _useState24[1];
+    isLoadingMenuItems = _useState24[0],
+    setIsLoadingMenuItems = _useState24[1];
   var _useState25 = useState([]),
     _useState26 = _slicedToArray(_useState25, 2),
-    workspaceConfig = _useState26[0],
-    setWorkspaceConfig = _useState26[1];
+    menuItems = _useState26[0],
+    setMenuItems = _useState26[1];
+  var _useState27 = useState([]),
+    _useState28 = _slicedToArray(_useState27, 2),
+    workspaceConfig = _useState28[0],
+    setWorkspaceConfig = _useState28[1];
 
   // Modal state
-  var _useState27 = useState(false),
-    _useState28 = _slicedToArray(_useState27, 2),
-    isThemeManagerOpen = _useState28[0],
-    setIsThemeManagerOpen = _useState28[1];
   var _useState29 = useState(false),
     _useState30 = _slicedToArray(_useState29, 2),
-    isDashboardLoaderOpen = _useState30[0],
-    setIsDashboardLoaderOpen = _useState30[1];
+    isThemeManagerOpen = _useState30[0],
+    setIsThemeManagerOpen = _useState30[1];
   var _useState31 = useState(false),
     _useState32 = _slicedToArray(_useState31, 2),
-    isLayoutPickerOpen = _useState32[0],
-    setIsLayoutPickerOpen = _useState32[1];
+    isDashboardLoaderOpen = _useState32[0],
+    setIsDashboardLoaderOpen = _useState32[1];
   var _useState33 = useState(false),
     _useState34 = _slicedToArray(_useState33, 2),
-    isWizardOpen = _useState34[0],
-    setIsWizardOpen = _useState34[1];
+    isLayoutPickerOpen = _useState34[0],
+    setIsLayoutPickerOpen = _useState34[1];
+  var _useState35 = useState(false),
+    _useState36 = _slicedToArray(_useState35, 2),
+    isWizardOpen = _useState36[0],
+    setIsWizardOpen = _useState36[1];
 
   // Missing widgets detection
   var _useMissingWidgets = useMissingWidgets(workspaceSelected),
     missingComponents = _useMissingWidgets.missingComponents,
     hasMissing = _useMissingWidgets.hasMissing;
-  var _useState35 = useState(false),
-    _useState36 = _slicedToArray(_useState35, 2),
-    isMissingWidgetsModalOpen = _useState36[0],
-    setIsMissingWidgetsModalOpen = _useState36[1];
-  var _useState37 = useState(new Set()),
+  var _useState37 = useState(false),
     _useState38 = _slicedToArray(_useState37, 2),
-    dismissedMissingForWorkspace = _useState38[0],
-    setDismissedMissingForWorkspace = _useState38[1];
+    isMissingWidgetsModalOpen = _useState38[0],
+    setIsMissingWidgetsModalOpen = _useState38[1];
+  var _useState39 = useState(new Set()),
+    _useState40 = _slicedToArray(_useState39, 2),
+    dismissedMissingForWorkspace = _useState40[0],
+    setDismissedMissingForWorkspace = _useState40[1];
 
   // Unified App Settings Modal
-  var _useState39 = useState(false),
-    _useState40 = _slicedToArray(_useState39, 2),
-    isAppSettingsOpen = _useState40[0],
-    setIsAppSettingsOpen = _useState40[1];
-  var _useState41 = useState("dashboards"),
+  var _useState41 = useState(false),
     _useState42 = _slicedToArray(_useState41, 2),
-    appSettingsInitialSection = _useState42[0],
-    setAppSettingsInitialSection = _useState42[1];
-  var _useState43 = useState(null),
+    isAppSettingsOpen = _useState42[0],
+    setIsAppSettingsOpen = _useState42[1];
+  var _useState43 = useState("dashboards"),
     _useState44 = _slicedToArray(_useState43, 2),
-    appSettingsInitialProvider = _useState44[0],
-    setAppSettingsInitialProvider = _useState44[1];
-  var _useState45 = useState(false),
+    appSettingsInitialSection = _useState44[0],
+    setAppSettingsInitialSection = _useState44[1];
+  var _useState45 = useState(null),
     _useState46 = _slicedToArray(_useState45, 2),
-    appSettingsCreateProvider = _useState46[0],
-    setAppSettingsCreateProvider = _useState46[1];
+    appSettingsInitialProvider = _useState46[0],
+    setAppSettingsInitialProvider = _useState46[1];
+  var _useState47 = useState(false),
+    _useState48 = _slicedToArray(_useState47, 2),
+    appSettingsCreateProvider = _useState48[0],
+    setAppSettingsCreateProvider = _useState48[1];
   function openAppSettings() {
     var section = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "general";
     var providerName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
@@ -51503,10 +51625,29 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
   }
 
   // ─── Page State ──────────────────────────────────────────────────
-  var _useState47 = useState(null),
-    _useState48 = _slicedToArray(_useState47, 2),
-    activePageId = _useState48[0],
-    setActivePageId = _useState48[1];
+  var _useState49 = useState(null),
+    _useState50 = _slicedToArray(_useState49, 2),
+    activePageId = _useState50[0],
+    setActivePageId = _useState50[1];
+
+  // Page history stack for goBack() — pushes the previous page id
+  // whenever a navigation happens through navigateToPage().
+  var pageHistoryRef = useRef([]);
+
+  // Wrapper that records history before switching pages.
+  // Pass recordHistory=false to switch without recording (e.g. for goBack).
+  var navigateToPage = useCallback(function (pageId) {
+    var recordHistory = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+    if (!pageId) return;
+    if (recordHistory) {
+      var _workspaceSelected$pa, _workspaceSelected$pa2;
+      var prevId = activePageId || (workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.activePageId) || ((_workspaceSelected$pa = workspaceSelected === null || workspaceSelected === void 0 || (_workspaceSelected$pa2 = workspaceSelected.pages) === null || _workspaceSelected$pa2 === void 0 || (_workspaceSelected$pa2 = _workspaceSelected$pa2[0]) === null || _workspaceSelected$pa2 === void 0 ? void 0 : _workspaceSelected$pa2.id) !== null && _workspaceSelected$pa !== void 0 ? _workspaceSelected$pa : null);
+      if (prevId && prevId !== pageId) {
+        pageHistoryRef.current.push(prevId);
+      }
+    }
+    setActivePageId(pageId);
+  }, [activePageId, workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.activePageId, workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.pages]);
 
   // Listen for programmatic page switches via DashboardActionsApi
   useEffect(function () {
@@ -51515,20 +51656,63 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
         pageId = _ref4.pageId,
         pageName = _ref4.pageName;
       if (pageId) {
-        setActivePageId(pageId);
+        navigateToPage(pageId);
       } else if (pageName) {
         var pages = (workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.pages) || [];
         var match = pages.find(function (p) {
           return p.name.toLowerCase() === pageName.toLowerCase();
         });
-        if (match) setActivePageId(match.id);
+        if (match) navigateToPage(match.id);
       }
     }
     window.addEventListener("dash:switch-page", onSwitchPage);
     return function () {
       return window.removeEventListener("dash:switch-page", onSwitchPage);
     };
-  }, [workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.pages]);
+  }, [workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.pages, navigateToPage]);
+
+  // Listen for runtime UX actions: goBack, sidebar control, notify
+  useEffect(function () {
+    function onGoBack() {
+      var prev = pageHistoryRef.current.pop();
+      if (prev) setActivePageId(prev); // bypass history recording
+    }
+    function onSetNavSidebar(e) {
+      var _e$detail;
+      setSidebarCollapsed(!!((_e$detail = e.detail) !== null && _e$detail !== void 0 && _e$detail.collapsed));
+    }
+    function onToggleNavSidebar() {
+      setSidebarCollapsed(function (c) {
+        return !c;
+      });
+    }
+    function onNotify(e) {
+      var id = "".concat(Date.now(), "-").concat(Math.random());
+      var toast = _objectSpread$5({
+        id: id
+      }, e.detail || {});
+      setToasts(function (prev) {
+        return [].concat(_toConsumableArray(prev), [toast]);
+      });
+      setTimeout(function () {
+        setToasts(function (prev) {
+          return prev.filter(function (t) {
+            return t.id !== id;
+          });
+        });
+      }, toast.duration || 4000);
+    }
+    window.addEventListener("dash:go-back", onGoBack);
+    window.addEventListener("dash:set-nav-sidebar", onSetNavSidebar);
+    window.addEventListener("dash:toggle-nav-sidebar", onToggleNavSidebar);
+    window.addEventListener("dash:notify", onNotify);
+    return function () {
+      window.removeEventListener("dash:go-back", onGoBack);
+      window.removeEventListener("dash:set-nav-sidebar", onSetNavSidebar);
+      window.removeEventListener("dash:toggle-nav-sidebar", onToggleNavSidebar);
+      window.removeEventListener("dash:notify", onNotify);
+    };
+  }, []);
   var workspacePages = (workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.pages) || [];
 
   // Memoize sorted pages so page object references stay stable across re-renders
@@ -51544,6 +51728,71 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
     return "".concat(p.id, ":").concat(p.order, ":").concat(p.name);
   }).join(",")]);
   var currentActivePageId = activePageId || (workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.activePageId) || ((_workspacePages$0$id = (_workspacePages$ = workspacePages[0]) === null || _workspacePages$ === void 0 ? void 0 : _workspacePages$.id) !== null && _workspacePages$0$id !== void 0 ? _workspacePages$0$id : null);
+
+  // Stable refs for tab/dashboard handlers so the open/close-dashboard
+  // listener doesn't have to re-subscribe on every render.
+  var handleOpenTabRef = useRef(null);
+  var handleCloseTabRef = useRef(null);
+  var workspaceConfigRef = useRef([]);
+  var openTabsRef = useRef([]);
+  var activeTabIdRef = useRef(null);
+  handleOpenTabRef.current = handleOpenTab;
+  handleCloseTabRef.current = handleCloseTab;
+  workspaceConfigRef.current = workspaceConfig;
+  openTabsRef.current = openTabs;
+  activeTabIdRef.current = activeTabId;
+
+  // Listen for open/close dashboard actions via DashboardActionsApi
+  useEffect(function () {
+    function onOpen(e) {
+      var _e$detail2;
+      var name = (_e$detail2 = e.detail) === null || _e$detail2 === void 0 ? void 0 : _e$detail2.name;
+      if (!name) return;
+      var ws = (workspaceConfigRef.current || []).find(function (w) {
+        return (w.name || "").toLowerCase() === name.toLowerCase();
+      });
+      if (ws && handleOpenTabRef.current) handleOpenTabRef.current(ws);
+    }
+    function onClose(e) {
+      var _e$detail3;
+      var name = (_e$detail3 = e.detail) === null || _e$detail3 === void 0 ? void 0 : _e$detail3.name;
+      if (name) {
+        var tab = (openTabsRef.current || []).find(function (t) {
+          return (t.name || "").toLowerCase() === name.toLowerCase();
+        });
+        if (tab && handleCloseTabRef.current) handleCloseTabRef.current(tab.id);
+      } else if (activeTabIdRef.current && handleCloseTabRef.current) {
+        handleCloseTabRef.current(activeTabIdRef.current);
+      }
+    }
+    window.addEventListener("dash:open-dashboard", onOpen);
+    window.addEventListener("dash:close-dashboard", onClose);
+    return function () {
+      window.removeEventListener("dash:open-dashboard", onOpen);
+      window.removeEventListener("dash:close-dashboard", onClose);
+    };
+  }, []);
+
+  // Maintain window.__dashState so DashboardActionsApi read methods
+  // (getCurrentPageName, listPages, etc.) return up-to-date values.
+  useEffect(function () {
+    var activePage = workspacePages.find(function (p) {
+      return p.id === currentActivePageId;
+    });
+    window.__dashState = {
+      currentPageId: currentActivePageId,
+      currentPageName: (activePage === null || activePage === void 0 ? void 0 : activePage.name) || null,
+      currentDashboardId: (workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.id) || null,
+      currentDashboardName: (workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.name) || null,
+      pages: workspacePages.map(function (p) {
+        return {
+          id: p.id,
+          name: p.name,
+          order: p.order
+        };
+      })
+    };
+  }, [currentActivePageId, workspacePages, workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.id, workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.name]);
   function handleAddPage() {
     if (!workspaceSelected) return;
     var existingPages = _toConsumableArray(workspacePages);
@@ -51557,7 +51806,7 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
     handleWorkspaceChange(updatedWorkspace);
   }
   function handleSwitchPage(pageId) {
-    setActivePageId(pageId);
+    navigateToPage(pageId);
   }
   function handleRenamePage(pageId, newName) {
     if (!workspaceSelected) return;
@@ -52028,7 +52277,70 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
     direction: "col",
     scrollable: false,
     grow: true,
-    children: [/*#__PURE__*/jsxs(DndProvider, {
+    children: [toasts.length > 0 && /*#__PURE__*/jsx("div", {
+      className: "fixed bottom-4 right-4 z-[9999] flex flex-col gap-2 pointer-events-none w-80",
+      children: toasts.map(function (t) {
+        var typeStyles = {
+          success: {
+            bg: "bg-emerald-950/95",
+            border: "border-emerald-500",
+            accent: "text-emerald-400",
+            icon: "circle-check"
+          },
+          error: {
+            bg: "bg-rose-950/95",
+            border: "border-rose-500",
+            accent: "text-rose-400",
+            icon: "circle-xmark"
+          },
+          warning: {
+            bg: "bg-amber-950/95",
+            border: "border-amber-500",
+            accent: "text-amber-400",
+            icon: "triangle-exclamation"
+          },
+          info: {
+            bg: "bg-sky-950/95",
+            border: "border-sky-500",
+            accent: "text-sky-400",
+            icon: "circle-info"
+          }
+        };
+        var style = typeStyles[t.type] || typeStyles.info;
+        return /*#__PURE__*/jsx("div", {
+          className: "pointer-events-auto rounded-md border-l-4 ".concat(style.border, " ").concat(style.bg, " shadow-lg p-3 text-white animate-in slide-in-from-right"),
+          role: "status",
+          children: /*#__PURE__*/jsxs("div", {
+            className: "flex items-start gap-3",
+            children: [/*#__PURE__*/jsx(FontAwesomeIcon, {
+              icon: style.icon,
+              className: "h-4 w-4 mt-0.5 flex-shrink-0 ".concat(style.accent)
+            }), /*#__PURE__*/jsxs("div", {
+              className: "flex-1 min-w-0",
+              children: [t.title && /*#__PURE__*/jsx("div", {
+                className: "font-semibold text-sm ".concat(style.accent),
+                children: t.title
+              }), t.message && /*#__PURE__*/jsx("div", {
+                className: "text-sm text-white/90 break-words",
+                children: t.message
+              })]
+            }), /*#__PURE__*/jsx("button", {
+              type: "button",
+              onClick: function onClick() {
+                return setToasts(function (prev) {
+                  return prev.filter(function (x) {
+                    return x.id !== t.id;
+                  });
+                });
+              },
+              className: "text-white/60 hover:text-white text-lg leading-none flex-shrink-0",
+              "aria-label": "Close toast",
+              children: "\xD7"
+            })]
+          })
+        }, t.id);
+      })
+    }), /*#__PURE__*/jsxs(DndProvider, {
       backend: HTML5Backend,
       children: [/*#__PURE__*/jsxs("div", {
         className: "flex flex-row flex-1 overflow-hidden",