@trops/dash-core 0.1.190 → 0.1.191

package/dist/index.js

@@ -49,8 +49,8 @@ var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 var jsxRuntime__namespace = /*#__PURE__*/_interopNamespaceDefault(jsxRuntime);
 var ReactDOM__namespace = /*#__PURE__*/_interopNamespaceDefault(ReactDOM);
 
-function ownKeys$F(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$F(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$F(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$F(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$G(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$G(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$G(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$G(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var event = {
   list: new Map(),
   //  Map(1) { '<widget-UUID>' => { 'CustomSearchbar[10].searchQueryChanged': [] } }
@@ -112,7 +112,7 @@ var event = {
           uuid: subscriber["uuid"]
         };
         if ("action" in subscriber && subscriber.action !== undefined) {
-          subscriber["action"](_objectSpread$F({}, objectToSend));
+          subscriber["action"](_objectSpread$G({}, objectToSend));
         }
       });
     }
@@ -2619,8 +2619,8 @@ var DashboardWrapper = function DashboardWrapper(_ref) {
   });
 };
 
-function ownKeys$E(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$E(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$E(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$E(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$F(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$F(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$F(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$F(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DashboardThemeProvider = function DashboardThemeProvider(_ref) {
   var themeKey = _ref.themeKey,
     children = _ref.children;
@@ -2632,7 +2632,7 @@ var DashboardThemeProvider = function DashboardThemeProvider(_ref) {
     var dashboardTheme = themes[themeKey];
     var themeValue = dashboardTheme ? dashboardTheme[themeVariant] || null : null;
     if (!themeValue) return null;
-    return _objectSpread$E(_objectSpread$E({}, parentContext), {}, {
+    return _objectSpread$F(_objectSpread$F({}, parentContext), {}, {
       currentTheme: themeValue,
       currentThemeKey: themeKey,
       theme: themeValue,
@@ -2650,8 +2650,8 @@ var DashboardThemeProvider = function DashboardThemeProvider(_ref) {
   });
 };
 
-function ownKeys$D(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$D(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$D(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$D(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$E(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$E(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$E(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$E(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var AppThemeScope = function AppThemeScope(_ref) {
   var children = _ref.children;
   var ctx = React.useContext(DashReact.ThemeContext);
@@ -2659,7 +2659,7 @@ var AppThemeScope = function AppThemeScope(_ref) {
     children: children
   });
   return /*#__PURE__*/jsxRuntime.jsx(DashReact.ThemeContext.Provider, {
-    value: _objectSpread$D(_objectSpread$D({}, ctx), {}, {
+    value: _objectSpread$E(_objectSpread$E({}, ctx), {}, {
       currentTheme: ctx.appTheme,
       currentThemeKey: ctx.appThemeKey,
       theme: ctx.appTheme,
@@ -2771,8 +2771,8 @@ var LayoutContainer = function LayoutContainer(_ref) {
   });
 };
 
-function ownKeys$C(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$C(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$C(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$C(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$D(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$D(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$D(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$D(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _createForOfIteratorHelper$f(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray$f(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray$f(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$f(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$f(r, a) : void 0; } }
 function _arrayLikeToArray$f(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
@@ -3054,7 +3054,7 @@ function createLayoutFromTemplate(template) {
   try {
     for (_iterator.s(); !(_step = _iterator.n()).done;) {
       var cell = _step.value;
-      grid[cell.key] = _objectSpread$C({
+      grid[cell.key] = _objectSpread$D({
         component: null,
         hide: cell.hide || false
       }, cell.span ? {
@@ -4068,8 +4068,8 @@ var DiscoverDashboardsDetail = function DiscoverDashboardsDetail(_ref) {
   });
 };
 
-function ownKeys$B(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$B(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$B(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$B(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$C(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$C(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$C(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$C(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var LayoutManagerModal = function LayoutManagerModal(_ref) {
   var open = _ref.open,
     setIsOpen = _ref.setIsOpen,
@@ -4305,7 +4305,7 @@ var LayoutManagerModal = function LayoutManagerModal(_ref) {
             }
             return _context2.abrupt("return");
           case 6:
-            updatedWorkspace = _objectSpread$B(_objectSpread$B({}, importedWorkspace), {}, {
+            updatedWorkspace = _objectSpread$C(_objectSpread$C({}, importedWorkspace), {}, {
               name: dashboardName.trim(),
               menuId: menuId,
               themeKey: selectedThemeKey
@@ -6091,8 +6091,8 @@ var WidgetList = function WidgetList(_ref4) {
   });
 };
 
-function ownKeys$A(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$A(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$A(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$A(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$B(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$B(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$B(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$B(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var TOTAL_STEPS = 6; // Steps 0-5
 
 var initialState = {
@@ -6115,11 +6115,11 @@ var initialState = {
 function wizardReducer(state, action) {
   switch (action.type) {
     case "SET_STEP":
-      return _objectSpread$A(_objectSpread$A({}, state), {}, {
+      return _objectSpread$B(_objectSpread$B({}, state), {}, {
         step: action.payload
       });
     case "SET_INTENT":
-      return _objectSpread$A(_objectSpread$A({}, state), {}, {
+      return _objectSpread$B(_objectSpread$B({}, state), {}, {
         intent: action.payload
       });
     case "TOGGLE_INTENT":
@@ -6127,12 +6127,12 @@ function wizardReducer(state, action) {
         var intent = state.intent.includes(action.payload) ? state.intent.filter(function (i) {
           return i !== action.payload;
         }) : [].concat(_toConsumableArray(state.intent), [action.payload]);
-        return _objectSpread$A(_objectSpread$A({}, state), {}, {
+        return _objectSpread$B(_objectSpread$B({}, state), {}, {
           intent: intent
         });
       }
     case "SET_PROVIDERS":
-      return _objectSpread$A(_objectSpread$A({}, state), {}, {
+      return _objectSpread$B(_objectSpread$B({}, state), {}, {
         providers: action.payload
       });
     case "TOGGLE_PROVIDER":
@@ -6140,12 +6140,12 @@ function wizardReducer(state, action) {
         var providers = state.providers.includes(action.payload) ? state.providers.filter(function (p) {
           return p !== action.payload;
         }) : [].concat(_toConsumableArray(state.providers), [action.payload]);
-        return _objectSpread$A(_objectSpread$A({}, state), {}, {
+        return _objectSpread$B(_objectSpread$B({}, state), {}, {
           providers: providers
         });
       }
     case "SET_SELECTED_WIDGETS":
-      return _objectSpread$A(_objectSpread$A({}, state), {}, {
+      return _objectSpread$B(_objectSpread$B({}, state), {}, {
         selectedWidgets: action.payload
       });
     case "TOGGLE_WIDGET":
@@ -6156,34 +6156,34 @@ function wizardReducer(state, action) {
         var selectedWidgets = exists ? state.selectedWidgets.filter(function (w) {
           return w.name !== action.payload.name;
         }) : [].concat(_toConsumableArray(state.selectedWidgets), [action.payload]);
-        return _objectSpread$A(_objectSpread$A({}, state), {}, {
+        return _objectSpread$B(_objectSpread$B({}, state), {}, {
           selectedWidgets: selectedWidgets
         });
       }
     case "SET_SELECTED_DASHBOARD":
-      return _objectSpread$A(_objectSpread$A({}, state), {}, {
+      return _objectSpread$B(_objectSpread$B({}, state), {}, {
         selectedDashboard: action.payload
       });
     case "SET_PATH":
-      return _objectSpread$A(_objectSpread$A({}, state), {}, {
+      return _objectSpread$B(_objectSpread$B({}, state), {}, {
         path: action.payload
       });
     case "SET_LAYOUT":
-      return _objectSpread$A(_objectSpread$A({}, state), {}, {
+      return _objectSpread$B(_objectSpread$B({}, state), {}, {
         layout: action.payload
       });
     case "REORDER_WIDGETS":
-      return _objectSpread$A(_objectSpread$A({}, state), {}, {
-        layout: _objectSpread$A(_objectSpread$A({}, state.layout), {}, {
+      return _objectSpread$B(_objectSpread$B({}, state), {}, {
+        layout: _objectSpread$B(_objectSpread$B({}, state.layout), {}, {
           widgetOrder: action.payload
         })
       });
     case "SET_CUSTOMIZATION":
-      return _objectSpread$A(_objectSpread$A({}, state), {}, {
-        customization: _objectSpread$A(_objectSpread$A({}, state.customization), action.payload)
+      return _objectSpread$B(_objectSpread$B({}, state), {}, {
+        customization: _objectSpread$B(_objectSpread$B({}, state.customization), action.payload)
       });
     case "RESET":
-      return _objectSpread$A({}, initialState);
+      return _objectSpread$B({}, initialState);
     default:
       return state;
   }
@@ -6525,6 +6525,620 @@ var LayoutGrid = function LayoutGrid(_ref3) {
   });
 };
 
+function ownKeys$A(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$A(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$A(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$A(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var WizardCustomizeStep = function WizardCustomizeStep(_ref) {
+  var _state$selectedDashbo, _state$selectedDashbo2;
+  var state = _ref.state,
+    dispatch = _ref.dispatch,
+    _ref$menuItems = _ref.menuItems,
+    menuItems = _ref$menuItems === void 0 ? [] : _ref$menuItems,
+    _ref$onSaveMenuItem = _ref.onSaveMenuItem,
+    onSaveMenuItem = _ref$onSaveMenuItem === void 0 ? null : _ref$onSaveMenuItem,
+    _ref$onCreateWorkspac = _ref.onCreateWorkspace,
+    onCreateWorkspace = _ref$onCreateWorkspac === void 0 ? null : _ref$onCreateWorkspac,
+    _ref$onInstallDashboa = _ref.onInstallDashboard,
+    onInstallDashboard = _ref$onInstallDashboa === void 0 ? null : _ref$onInstallDashboa,
+    _ref$onOpenDashboard = _ref.onOpenDashboard,
+    onOpenDashboard = _ref$onOpenDashboard === void 0 ? null : _ref$onOpenDashboard,
+    appId = _ref.appId;
+  var _useContext = React.useContext(DashReact.ThemeContext),
+    themes = _useContext.themes,
+    appThemeKey = _useContext.themeKey;
+  var _useContext2 = React.useContext(AppContext),
+    providersMap = _useContext2.providers;
+  var _useState = React.useState(menuItems),
+    _useState2 = _slicedToArray(_useState, 2),
+    localMenuItems = _useState2[0],
+    setLocalMenuItems = _useState2[1];
+  var _useState3 = React.useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isCreatingFolder = _useState4[0],
+    setIsCreatingFolder = _useState4[1];
+  var _useState5 = React.useState(""),
+    _useState6 = _slicedToArray(_useState5, 2),
+    newFolderName = _useState6[0],
+    setNewFolderName = _useState6[1];
+  var _useState7 = React.useState(null),
+    _useState8 = _slicedToArray(_useState7, 2),
+    newFolderIcon = _useState8[0],
+    setNewFolderIcon = _useState8[1];
+
+  // Creation state
+  var _useState9 = React.useState(false),
+    _useState0 = _slicedToArray(_useState9, 2);
+    _useState0[0];
+    var setCreating = _useState0[1];
+  var _useState1 = React.useState(null),
+    _useState10 = _slicedToArray(_useState1, 2),
+    error = _useState10[0],
+    setError = _useState10[1];
+  var _useState11 = React.useState(null),
+    _useState12 = _slicedToArray(_useState11, 2),
+    createdDashboard = _useState12[0],
+    setCreatedDashboard = _useState12[1];
+  var isPrebuilt = state.path === "prebuilt";
+
+  // Initialize customization defaults on mount
+  React.useEffect(function () {
+    setLocalMenuItems(menuItems);
+    var updates = {};
+    if (!state.customization.menuId && menuItems.length > 0) {
+      updates.menuId = menuItems[0].id;
+    }
+    if (!state.customization.theme && themes) {
+      var _Object$entries$sort$;
+      var fallback = (_Object$entries$sort$ = Object.entries(themes).sort(function (_ref2, _ref3) {
+        var _ref4 = _slicedToArray(_ref2, 2),
+          a = _ref4[1];
+        var _ref5 = _slicedToArray(_ref3, 2),
+          b = _ref5[1];
+        return (a.name || "").localeCompare(b.name || "");
+      })[0]) === null || _Object$entries$sort$ === void 0 ? void 0 : _Object$entries$sort$[0];
+      updates.theme = appThemeKey || fallback || null;
+    }
+    if (Object.keys(updates).length > 0) {
+      dispatch({
+        type: "SET_CUSTOMIZATION",
+        payload: updates
+      });
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var handleNameChange = React.useCallback(function (val) {
+    dispatch({
+      type: "SET_CUSTOMIZATION",
+      payload: {
+        name: val
+      }
+    });
+  }, [dispatch]);
+  var handleMenuSelect = React.useCallback(function (id) {
+    dispatch({
+      type: "SET_CUSTOMIZATION",
+      payload: {
+        menuId: id
+      }
+    });
+    setIsCreatingFolder(false);
+    setNewFolderName("");
+    setNewFolderIcon(null);
+  }, [dispatch]);
+  var handleThemeSelect = React.useCallback(function (key) {
+    dispatch({
+      type: "SET_CUSTOMIZATION",
+      payload: {
+        theme: key
+      }
+    });
+  }, [dispatch]);
+  function handleCancelNewFolder() {
+    setIsCreatingFolder(false);
+    setNewFolderName("");
+    setNewFolderIcon(null);
+  }
+  function handleSaveNewFolder() {
+    if (!newFolderName.trim() || !newFolderIcon) return;
+    var newItem = {
+      id: Date.now(),
+      name: newFolderName.trim(),
+      icon: newFolderIcon
+    };
+    setLocalMenuItems(function (prev) {
+      return [].concat(_toConsumableArray(prev), [newItem]);
+    });
+    dispatch({
+      type: "SET_CUSTOMIZATION",
+      payload: {
+        menuId: newItem.id
+      }
+    });
+    if (onSaveMenuItem) {
+      onSaveMenuItem(newItem);
+    }
+    setIsCreatingFolder(false);
+    setNewFolderName("");
+    setNewFolderIcon(null);
+  }
+
+  // --- Create logic ---
+  React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    var _state$customization, name, menuId, theme, result, _window$mainApi, installResult, updatedWorkspace, _window$mainApi2, template, layoutObj, widgetOrder, cells, _loop, i, workspace, _t;
+    return _regeneratorRuntime.wrap(function (_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          setCreating(true);
+          setError(null);
+          _context2.prev = 1;
+          _state$customization = state.customization, name = _state$customization.name, menuId = _state$customization.menuId, theme = _state$customization.theme;
+          if (!(isPrebuilt && state.selectedDashboard)) {
+            _context2.next = 7;
+            break;
+          }
+          if (!onInstallDashboard) {
+            _context2.next = 3;
+            break;
+          }
+          _context2.next = 2;
+          return onInstallDashboard({
+            dashboard: state.selectedDashboard,
+            name: name.trim(),
+            menuId: menuId || 1,
+            themeKey: theme,
+            appId: appId
+          });
+        case 2:
+          result = _context2.sent;
+          _context2.next = 6;
+          break;
+        case 3:
+          if (!((_window$mainApi = window.mainApi) !== null && _window$mainApi !== void 0 && (_window$mainApi = _window$mainApi.registry) !== null && _window$mainApi !== void 0 && _window$mainApi.installDashboard)) {
+            _context2.next = 6;
+            break;
+          }
+          _context2.next = 4;
+          return window.mainApi.registry.installDashboard(appId, state.selectedDashboard.name || state.selectedDashboard.key);
+        case 4:
+          installResult = _context2.sent;
+          if (!(installResult !== null && installResult !== void 0 && installResult.workspace)) {
+            _context2.next = 6;
+            break;
+          }
+          updatedWorkspace = _objectSpread$A(_objectSpread$A({}, installResult.workspace), {}, {
+            name: name.trim(),
+            menuId: menuId || 1,
+            themeKey: theme
+          });
+          _context2.next = 5;
+          return window.mainApi.workspace.saveWorkspaceForApplication(appId, updatedWorkspace);
+        case 5:
+          result = {
+            success: true,
+            workspace: updatedWorkspace
+          };
+        case 6:
+          _context2.next = 15;
+          break;
+        case 7:
+          // Build-your-own path: create layout from template + place widgets
+          template = layoutTemplates.find(function (t) {
+            return t.id === state.layout.templateKey;
+          });
+          if (template) {
+            _context2.next = 8;
+            break;
+          }
+          throw new Error("No layout template selected.");
+        case 8:
+          layoutObj = createLayoutFromTemplate(template, menuId || 1); // Place widgets into grid cells
+          widgetOrder = state.layout.widgetOrder || [];
+          cells = template.cells.filter(function (c) {
+            return !c.hide;
+          });
+          _loop = /*#__PURE__*/_regeneratorRuntime.mark(function _loop(i) {
+            var widget;
+            return _regeneratorRuntime.wrap(function (_context) {
+              while (1) switch (_context.prev = _context.next) {
+                case 0:
+                  widget = state.selectedWidgets.find(function (w) {
+                    return (w.name || w.key) === widgetOrder[i];
+                  });
+                  if (widget && layoutObj.grid[cells[i].key]) {
+                    layoutObj.grid[cells[i].key].component = widget.component || widget.name || widget.key;
+                  }
+                case 1:
+                case "end":
+                  return _context.stop();
+              }
+            }, _loop);
+          });
+          i = 0;
+        case 9:
+          if (!(i < widgetOrder.length && i < cells.length)) {
+            _context2.next = 11;
+            break;
+          }
+          return _context2.delegateYield(_loop(i), "t0", 10);
+        case 10:
+          i++;
+          _context2.next = 9;
+          break;
+        case 11:
+          if (!onCreateWorkspace) {
+            _context2.next = 13;
+            break;
+          }
+          _context2.next = 12;
+          return onCreateWorkspace(layoutObj, theme, name.trim());
+        case 12:
+          result = _context2.sent;
+          _context2.next = 15;
+          break;
+        case 13:
+          if (!((_window$mainApi2 = window.mainApi) !== null && _window$mainApi2 !== void 0 && (_window$mainApi2 = _window$mainApi2.workspace) !== null && _window$mainApi2 !== void 0 && _window$mainApi2.saveWorkspaceForApplication)) {
+            _context2.next = 15;
+            break;
+          }
+          workspace = {
+            name: name.trim(),
+            menuId: menuId || 1,
+            themeKey: theme,
+            layout: [layoutObj]
+          };
+          _context2.next = 14;
+          return window.mainApi.workspace.saveWorkspaceForApplication(appId, workspace);
+        case 14:
+          result = {
+            success: true,
+            workspace: workspace
+          };
+        case 15:
+          if (result) {
+            setCreatedDashboard(result.workspace || result);
+          }
+          _context2.next = 17;
+          break;
+        case 16:
+          _context2.prev = 16;
+          _t = _context2["catch"](1);
+          setError(_t.message || "Failed to create dashboard.");
+        case 17:
+          _context2.prev = 17;
+          setCreating(false);
+          return _context2.finish(17);
+        case 18:
+        case "end":
+          return _context2.stop();
+      }
+    }, _callee, null, [[1, 16, 17, 18]]);
+  })), [state, isPrebuilt, onInstallDashboard, onCreateWorkspace, appId]);
+
+  // --- Success state ---
+  if (createdDashboard) {
+    return /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "wizard-customize-step",
+      children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "wizard-success",
+        children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+          icon: "circle-check",
+          className: "wizard-success-icon"
+        }), /*#__PURE__*/jsxRuntime.jsx("h3", {
+          className: "wizard-step-header",
+          children: "Dashboard created!"
+        }), /*#__PURE__*/jsxRuntime.jsxs("p", {
+          className: "wizard-step-description",
+          children: ["Your dashboard", " ", /*#__PURE__*/jsxRuntime.jsx("strong", {
+            children: createdDashboard.name || state.customization.name.trim()
+          }), " ", "is ready."]
+        }), onOpenDashboard && /*#__PURE__*/jsxRuntime.jsx(DashReact.Button, {
+          onClick: function onClick() {
+            return onOpenDashboard(createdDashboard);
+          },
+          title: "Open Dashboard",
+          textSize: "text-base",
+          padding: "py-2 px-6",
+          backgroundColor: "bg-blue-600",
+          textColor: "text-white",
+          hoverTextColor: "hover:text-white",
+          hoverBackgroundColor: "hover:bg-blue-500",
+          icon: "arrow-right"
+        })]
+      })
+    });
+  }
+
+  // --- Provider setup summary ---
+  var selectedProviders = (state.providers || []).map(function (provKey) {
+    var prov = (providersMap === null || providersMap === void 0 ? void 0 : providersMap[provKey]) || {};
+    return {
+      key: provKey,
+      name: prov.name || provKey,
+      icon: prov.icon || "plug",
+      configured: !!prov.configured
+    };
+  });
+  var configuredProviders = selectedProviders.filter(function (p) {
+    return p.configured;
+  });
+  var needsSetupProviders = selectedProviders.filter(function (p) {
+    return !p.configured;
+  });
+  var selectedFolder = localMenuItems.find(function (item) {
+    return item.id === state.customization.menuId;
+  });
+  var selectedTheme = themes && state.customization.theme ? themes[state.customization.theme] : null;
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "wizard-customize-step",
+    children: [/*#__PURE__*/jsxRuntime.jsx("h3", {
+      className: "wizard-step-header",
+      children: "Customize your dashboard"
+    }), /*#__PURE__*/jsxRuntime.jsx("p", {
+      className: "wizard-step-description",
+      children: "Name your dashboard, choose a folder, and pick a theme."
+    }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+      className: "wizard-customize-sections",
+      children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "wizard-customize-section",
+        children: [/*#__PURE__*/jsxRuntime.jsxs("label", {
+          className: "wizard-customize-label",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+            icon: "input-text",
+            fixedWidth: true,
+            className: "wizard-customize-label-icon"
+          }), "Dashboard Name"]
+        }), /*#__PURE__*/jsxRuntime.jsx(DashReact.InputText, {
+          value: state.customization.name,
+          onChange: handleNameChange,
+          placeholder: "My Dashboard",
+          autoFocus: true
+        })]
+      }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "wizard-customize-section",
+        children: [/*#__PURE__*/jsxRuntime.jsxs("label", {
+          className: "wizard-customize-label",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+            icon: "folder",
+            fixedWidth: true,
+            className: "wizard-customize-label-icon"
+          }), "Folder"]
+        }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+          className: "wizard-customize-folder-list",
+          children: [!isCreatingFolder ? /*#__PURE__*/jsxRuntime.jsxs("button", {
+            type: "button",
+            className: "wizard-customize-folder-create",
+            onClick: function onClick() {
+              return setIsCreatingFolder(true);
+            },
+            children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+              icon: "plus",
+              fixedWidth: true
+            }), /*#__PURE__*/jsxRuntime.jsx("span", {
+              children: "New Folder"
+            })]
+          }) : /*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "wizard-customize-folder-form",
+            children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+              className: "wizard-customize-folder-form-header",
+              children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+                className: "text-sm font-medium text-gray-300",
+                children: "New Folder"
+              }), /*#__PURE__*/jsxRuntime.jsx("button", {
+                type: "button",
+                className: "text-gray-500 hover:text-gray-300 transition-colors",
+                onClick: handleCancelNewFolder,
+                children: /*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                  icon: "xmark"
+                })
+              })]
+            }), /*#__PURE__*/jsxRuntime.jsx(DashReact.InputText, {
+              value: newFolderName,
+              onChange: function onChange(val) {
+                return setNewFolderName(val);
+              },
+              placeholder: "Folder name"
+            }), /*#__PURE__*/jsxRuntime.jsx("div", {
+              className: "grid grid-cols-10 gap-2",
+              children: FOLDER_ICONS.map(function (icon) {
+                var isIconSelected = icon === newFolderIcon;
+                return /*#__PURE__*/jsxRuntime.jsx("div", {
+                  className: "flex items-center justify-center p-2 rounded cursor-pointer transition-all ".concat(isIconSelected ? "bg-blue-600 ring-2 ring-blue-400 text-white" : "bg-gray-700 text-gray-400 hover:bg-gray-600 hover:text-gray-200"),
+                  onClick: function onClick() {
+                    return setNewFolderIcon(icon);
+                  },
+                  children: /*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                    icon: icon
+                  })
+                }, icon);
+              })
+            }), /*#__PURE__*/jsxRuntime.jsx(DashReact.Button, {
+              onClick: handleSaveNewFolder,
+              title: "Add Folder",
+              textSize: "text-sm",
+              padding: "py-1 px-3",
+              backgroundColor: "bg-blue-600",
+              textColor: "text-white",
+              hoverTextColor: "hover:text-white",
+              hoverBackgroundColor: "hover:bg-blue-500",
+              disabled: !newFolderName.trim() || !newFolderIcon
+            })]
+          }), localMenuItems.map(function (item) {
+            var isSelected = !isCreatingFolder && item.id === state.customization.menuId;
+            return /*#__PURE__*/jsxRuntime.jsxs("div", {
+              className: "wizard-customize-folder-item ".concat(isSelected ? "wizard-customize-folder-item--selected" : ""),
+              onClick: function onClick() {
+                return handleMenuSelect(item.id);
+              },
+              children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                icon: item.icon || item.folder || "folder",
+                fixedWidth: true,
+                className: "w-5 h-5 ".concat(isSelected ? "text-blue-400" : "text-gray-400")
+              }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                className: "text-sm font-medium ".concat(isSelected ? "text-blue-300" : "text-gray-300"),
+                children: item.name
+              }), isSelected && /*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                icon: "check",
+                className: "ml-auto text-blue-400 text-sm"
+              })]
+            }, item.id);
+          })]
+        })]
+      }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "wizard-customize-section",
+        children: [/*#__PURE__*/jsxRuntime.jsxs("label", {
+          className: "wizard-customize-label",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+            icon: "palette",
+            fixedWidth: true,
+            className: "wizard-customize-label-icon"
+          }), "Theme"]
+        }), /*#__PURE__*/jsxRuntime.jsx("div", {
+          className: "wizard-customize-theme-list",
+          children: themes && Object.entries(themes).sort(function (_ref7, _ref8) {
+            var _ref9 = _slicedToArray(_ref7, 2),
+              a = _ref9[1];
+            var _ref0 = _slicedToArray(_ref8, 2),
+              b = _ref0[1];
+            return (a.name || "").localeCompare(b.name || "");
+          }).map(function (_ref1) {
+            var _ref10 = _slicedToArray(_ref1, 2),
+              key = _ref10[0],
+              t = _ref10[1];
+            var isThemeSelected = state.customization.theme === key;
+            return /*#__PURE__*/jsxRuntime.jsxs("div", {
+              className: "wizard-customize-theme-item ".concat(isThemeSelected ? "wizard-customize-theme-item--selected" : ""),
+              onClick: function onClick() {
+                return handleThemeSelect(key);
+              },
+              children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                icon: "palette",
+                className: "w-5 h-5 mr-3 ".concat(isThemeSelected ? "text-blue-400" : "text-gray-400")
+              }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                className: "text-sm font-medium ".concat(isThemeSelected ? "text-blue-300" : "text-gray-300"),
+                children: t.name || key
+              }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+                className: "flex flex-row space-x-1 ml-auto",
+                children: [t.primary && /*#__PURE__*/jsxRuntime.jsx("div", {
+                  className: "w-4 h-4 rounded bg-".concat(t.primary, "-500")
+                }), t.secondary && /*#__PURE__*/jsxRuntime.jsx("div", {
+                  className: "w-4 h-4 rounded bg-".concat(t.secondary, "-500")
+                }), t.tertiary && /*#__PURE__*/jsxRuntime.jsx("div", {
+                  className: "w-4 h-4 rounded bg-".concat(t.tertiary, "-500")
+                })]
+              })]
+            }, key);
+          })
+        })]
+      }), selectedProviders.length > 0 && /*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "wizard-customize-section",
+        children: [/*#__PURE__*/jsxRuntime.jsxs("label", {
+          className: "wizard-customize-label",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+            icon: "plug",
+            fixedWidth: true,
+            className: "wizard-customize-label-icon"
+          }), "Provider Status"]
+        }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+          className: "wizard-customize-provider-summary",
+          children: [configuredProviders.length > 0 && /*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "wizard-provider-group",
+            children: [/*#__PURE__*/jsxRuntime.jsxs("span", {
+              className: "wizard-provider-group-label wizard-provider-group-label--ready",
+              children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                icon: "circle-check",
+                className: "text-green-400"
+              }), " ", "Ready (", configuredProviders.length, ")"]
+            }), /*#__PURE__*/jsxRuntime.jsx("div", {
+              className: "wizard-provider-list",
+              children: configuredProviders.map(function (p) {
+                return /*#__PURE__*/jsxRuntime.jsxs("span", {
+                  className: "wizard-provider-badge wizard-provider-badge--ready",
+                  children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                    icon: resolveIcon(p.icon),
+                    fixedWidth: true
+                  }), p.name]
+                }, p.key);
+              })
+            })]
+          }), needsSetupProviders.length > 0 && /*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "wizard-provider-group",
+            children: [/*#__PURE__*/jsxRuntime.jsxs("span", {
+              className: "wizard-provider-group-label wizard-provider-group-label--setup",
+              children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                icon: "circle-exclamation",
+                className: "text-amber-400"
+              }), " ", "Needs setup (", needsSetupProviders.length, ")"]
+            }), /*#__PURE__*/jsxRuntime.jsx("div", {
+              className: "wizard-provider-list",
+              children: needsSetupProviders.map(function (p) {
+                return /*#__PURE__*/jsxRuntime.jsxs("span", {
+                  className: "wizard-provider-badge wizard-provider-badge--setup",
+                  children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                    icon: resolveIcon(p.icon),
+                    fixedWidth: true
+                  }), p.name]
+                }, p.key);
+              })
+            })]
+          })]
+        })]
+      }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "wizard-customize-summary",
+        children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+          className: "wizard-customize-summary-title",
+          children: "Summary"
+        }), state.customization.name.trim() && /*#__PURE__*/jsxRuntime.jsxs("div", {
+          className: "wizard-customize-summary-row",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+            icon: "clone",
+            className: "text-blue-400"
+          }), /*#__PURE__*/jsxRuntime.jsx("span", {
+            children: state.customization.name.trim()
+          })]
+        }), selectedFolder && /*#__PURE__*/jsxRuntime.jsxs("div", {
+          className: "wizard-customize-summary-row",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+            icon: selectedFolder.icon || selectedFolder.folder || "folder",
+            className: "text-blue-400"
+          }), /*#__PURE__*/jsxRuntime.jsx("span", {
+            children: selectedFolder.name
+          })]
+        }), selectedTheme && /*#__PURE__*/jsxRuntime.jsxs("div", {
+          className: "wizard-customize-summary-row",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+            icon: "palette",
+            className: "text-blue-400"
+          }), /*#__PURE__*/jsxRuntime.jsx("span", {
+            children: selectedTheme.name || state.customization.theme
+          }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "flex flex-row space-x-1 ml-2",
+            children: [selectedTheme.primary && /*#__PURE__*/jsxRuntime.jsx("div", {
+              className: "w-3 h-3 rounded bg-".concat(selectedTheme.primary, "-500")
+            }), selectedTheme.secondary && /*#__PURE__*/jsxRuntime.jsx("div", {
+              className: "w-3 h-3 rounded bg-".concat(selectedTheme.secondary, "-500")
+            })]
+          })]
+        }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+          className: "wizard-customize-summary-row",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+            icon: isPrebuilt ? "box" : "grid-2",
+            className: "text-blue-400"
+          }), /*#__PURE__*/jsxRuntime.jsx("span", {
+            children: isPrebuilt ? ((_state$selectedDashbo = state.selectedDashboard) === null || _state$selectedDashbo === void 0 ? void 0 : _state$selectedDashbo.displayName) || ((_state$selectedDashbo2 = state.selectedDashboard) === null || _state$selectedDashbo2 === void 0 ? void 0 : _state$selectedDashbo2.name) || "Pre-built dashboard" : "".concat(state.selectedWidgets.length, " widget").concat(state.selectedWidgets.length !== 1 ? "s" : "")
+          })]
+        })]
+      }), error && /*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "wizard-customize-error",
+        children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+          icon: "triangle-exclamation",
+          className: "text-red-400"
+        }), /*#__PURE__*/jsxRuntime.jsx("span", {
+          children: error
+        })]
+      })]
+    })]
+  });
+};
+
 var LayoutBuilderAddItemModal = function LayoutBuilderAddItemModal(_ref) {
   var workspace = _ref.workspace,
     open = _ref.open,
@@ -49335,6 +49949,7 @@ exports.WidgetFactory = WidgetFactory;
 exports.WidgetPopoutStage = WidgetPopoutStage;
 exports.WidgetProviderWrapper = WidgetProviderWrapper;
 exports.WidgetSidebar = WidgetSidebar;
+exports.WizardCustomizeStep = WizardCustomizeStep;
 exports.WizardIntentStep = WizardIntentStep;
 exports.WizardLayoutPreviewStep = WizardLayoutPreviewStep;
 exports.WizardProvidersStep = WizardProvidersStep;