@trops/dash-core 0.1.334 → 0.1.336

package/dist/index.esm.js

@@ -27298,6 +27298,34 @@ var SettingsModel = function SettingsModel() {
   return obj;
 };
 
+/**
+ * Default layout for a brand-new workspace: a single 1x1 grid container
+ * with one empty cell. Mirrors DashboardModel._initializeLayout().
+ */
+function defaultGridLayout() {
+  return [LayoutModel({
+    id: 1,
+    order: 1,
+    type: "grid",
+    component: "LayoutGridContainer",
+    hasChildren: 1,
+    scrollable: false,
+    parent: 0,
+    menuId: 1,
+    width: "w-full",
+    height: "h-full",
+    grid: {
+      rows: 1,
+      cols: 1,
+      gap: "gap-2",
+      1.1: {
+        component: null,
+        hide: false
+      }
+    }
+  }, [])];
+}
+
 /**
  * A Model for a Workspace (Dashboard)
  * The Workspace in this instance is the entire Dashboard Layout inclusive of the workspaces and widgets
@@ -27330,20 +27358,36 @@ var WorkspaceModel = function WorkspaceModel(workspaceItem) {
   workspace.type = "type" in obj ? sanitizeType(obj["type"]) : "workspace";
   workspace.label = "label" in obj ? obj["label"] : "New Dashboard";
   workspace.version = "version" in obj ? obj["version"] : 1;
-  workspace.layout = "layout" in obj ? obj["layout"] : [];
+  // Use the provided layout if it exists and is non-empty; otherwise
+  // create a default 1x1 grid so the workspace always has a renderable
+  // grid container.
+  var rawLayout = "layout" in obj && Array.isArray(obj["layout"]) && obj["layout"].length > 0 ? obj["layout"] : defaultGridLayout();
+
+  // Normalize each layout item through LayoutModel so renderers get a
+  // fully-shaped object (contexts, listeners, eventHandlers, etc.).
+  // Without this, layouts coming from createLayoutFromTemplate (the
+  // wizard) are missing fields and the grid container fails to render.
+  // Skip items already produced by LayoutModel (idempotent: LayoutModel
+  // is safe to call on its own output).
+  var wsId = "id" in obj ? obj["id"] : workspace.id;
+  workspace.layout = rawLayout.map(function (item) {
+    return LayoutModel(item, rawLayout, wsId);
+  });
   workspace.pages = "pages" in obj ? obj["pages"] : [];
   workspace.activePageId = "activePageId" in obj ? obj["activePageId"] : null;
 
   // Always-pages model: every workspace must have at least one page.
-  // If the source data is single-page (empty pages array but populated
-  // layout), wrap the layout into pages[0] now so renderers always have
-  // a page to display. Idempotent: a no-op if pages is already populated.
+  // If the source data is single-page (empty pages array), wrap the
+  // layout into pages[0] so renderers always have a page to display.
+  // The page is named "Page 1" — when only one page exists, the
+  // PageTabBar hides it; when the user adds a second page, both
+  // "Page 1" and the new page become visible. Idempotent.
   if (!Array.isArray(workspace.pages) || workspace.pages.length === 0) {
     var page = {
       id: "page-".concat(workspace.id || Date.now()),
-      name: workspace.name || "Page 1",
+      name: "Page 1",
       order: 0,
-      layout: workspace.layout || []
+      layout: workspace.layout
     };
     workspace.pages = [page];
     workspace.activePageId = page.id;
@@ -49046,7 +49090,7 @@ var PageTabBar = function PageTabBar(_ref) {
   };
   return /*#__PURE__*/jsxs("div", {
     className: "flex flex-row items-center shrink-0 overflow-x-auto gap-1 px-2 py-1.5 border-b ".concat(currentTheme["border-primary-dark"] || "border-gray-700", " ").concat(currentTheme["bg-primary-medium"] || "bg-gray-800/50", " scrollbar-none"),
-    children: [sortedPages.map(function (page) {
+    children: [pages.length > 1 && sortedPages.map(function (page) {
       var isActive = page.id === activePageId;
       var isDragOver = page.id === dragOverId;
       return /*#__PURE__*/jsxs("button", {
@@ -49118,7 +49162,7 @@ var PageTabBar = function PageTabBar(_ref) {
       }), /*#__PURE__*/jsx("span", {
         children: "Add Page"
       })]
-    }), editMode && onScrollableChange && /*#__PURE__*/jsx("div", {
+    }), editMode && pages.length > 1 && onScrollableChange && /*#__PURE__*/jsx("div", {
       className: "ml-auto flex items-center shrink-0",
       children: /*#__PURE__*/jsx(Toggle, {
         text: "Scrollable",
@@ -51649,6 +51693,16 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
   // whenever a navigation happens through navigateToPage().
   var pageHistoryRef = useRef([]);
 
+  // Reset local activePageId when the active tab changes so the next
+  // render falls back to the new workspace's saved activePageId
+  // (or its first page). Without this, a stale activePageId from a
+  // previously-active dashboard would prevent the new dashboard's
+  // pages from rendering (no page matches → all hidden).
+  useEffect(function () {
+    setActivePageId(null);
+    pageHistoryRef.current = [];
+  }, [activeTabId]);
+
   // Wrapper that records history before switching pages.
   // Pass recordHistory=false to switch without recording (e.g. for goBack).
   var navigateToPage = useCallback(function (pageId) {
@@ -51810,7 +51864,18 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
   }, [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);
+    // Sync existing pages with their live layouts from refs so any
+    // unsaved user edits to the current page are preserved when
+    // adding a new page (especially relevant when going from 1 → 2
+    // pages where the lone page's tab is hidden but its grid is live).
+    var existingPages = workspacePages.map(function (p) {
+      var _pageRef$current;
+      var pageRef = pageRefsMap.current[p.id];
+      var liveLayout = pageRef === null || pageRef === void 0 || (_pageRef$current = pageRef.current) === null || _pageRef$current === void 0 ? void 0 : _pageRef$current.layout;
+      return liveLayout ? _objectSpread$5(_objectSpread$5({}, p), {}, {
+        layout: liveLayout
+      }) : p;
+    });
     var newPage = DashboardModel.createPage("Page ".concat(existingPages.length + 1));
     newPage.order = existingPages.length;
     var updatedWorkspace = _objectSpread$5(_objectSpread$5({}, workspaceSelected), {}, {
@@ -52043,11 +52108,11 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
 
   // Derive scrollable state from the active page's root layout item
   function getRootScrollable() {
-    var _pageRef$current, _ws$pages;
+    var _pageRef$current2, _ws$pages;
     var ws = currentWorkspaceRef.current || workspaceSelected;
     if (!ws) return false;
     var pageRef = pageRefsMap.current[currentActivePageId];
-    var layout = (pageRef === null || pageRef === void 0 || (_pageRef$current = pageRef.current) === null || _pageRef$current === void 0 ? void 0 : _pageRef$current.layout) || ((_ws$pages = ws.pages) === null || _ws$pages === void 0 || (_ws$pages = _ws$pages.find(function (p) {
+    var layout = (pageRef === null || pageRef === void 0 || (_pageRef$current2 = pageRef.current) === null || _pageRef$current2 === void 0 ? void 0 : _pageRef$current2.layout) || ((_ws$pages = ws.pages) === null || _ws$pages === void 0 || (_ws$pages = _ws$pages.find(function (p) {
       return p.id === currentActivePageId;
     })) === null || _ws$pages === void 0 ? void 0 : _ws$pages.layout);
     if (!layout) return false;
@@ -52064,9 +52129,9 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
       // Gather latest layout from each page's LayoutBuilder ref
       var workspaceToSave = deepCopy(workspaceSelected);
       workspaceToSave.pages = (workspaceToSave.pages || []).map(function (page) {
-        var _pageRef$current2;
+        var _pageRef$current3;
         var pageRef = pageRefsMap.current[page.id];
-        var latestLayout = (pageRef === null || pageRef === void 0 || (_pageRef$current2 = pageRef.current) === null || _pageRef$current2 === void 0 ? void 0 : _pageRef$current2.layout) || page.layout || [];
+        var latestLayout = (pageRef === null || pageRef === void 0 || (_pageRef$current3 = pageRef.current) === null || _pageRef$current3 === void 0 ? void 0 : _pageRef$current3.layout) || page.layout || [];
         return _objectSpread$5(_objectSpread$5({}, page), {}, {
           layout: latestLayout.map(function (item) {
             var copy = _objectSpread$5({}, item);
@@ -52351,7 +52416,9 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
               onFolderChange: popout ? null : handleWorkspaceFolderChange,
               onThemeChange: popout ? null : handleWorkspaceThemeChange,
               sidebarEnabled: sidebarEnabled,
-              onSidebarChange: popout ? null : handleSidebarToggle
+              onSidebarChange: popout ? null : handleSidebarToggle,
+              scrollableEnabled: workspacePages.length <= 1 ? getRootScrollable() : undefined,
+              onScrollableChange: workspacePages.length <= 1 && !popout ? handleScrollableChange : null
             }), /*#__PURE__*/jsxs(DashboardThemeProvider, {
               themeKey: workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.themeKey,
               children: [hasMissing && missingComponents.length >= 2 && !dismissedMissingForWorkspace.has(workspaceSelected === null || workspaceSelected === void 0 ? void 0 : workspaceSelected.id) && /*#__PURE__*/jsxs("div", {