@trops/dash-core 0.1.94 → 0.1.97

package/dist/index.js

@@ -3182,26 +3182,27 @@ var IconPicker = function IconPicker(_ref) {
     })]
   });
 };
-var FolderDetail = function FolderDetail(_ref2) {
-  var _ref2$menuItem = _ref2.menuItem,
-    menuItem = _ref2$menuItem === void 0 ? null : _ref2$menuItem,
-    _ref2$workspaces = _ref2.workspaces,
-    workspaces = _ref2$workspaces === void 0 ? [] : _ref2$workspaces,
-    _ref2$isEditing = _ref2.isEditing,
-    isEditing = _ref2$isEditing === void 0 ? false : _ref2$isEditing,
-    _ref2$isCreating = _ref2.isCreating,
-    isCreating = _ref2$isCreating === void 0 ? false : _ref2$isCreating,
-    _ref2$formName = _ref2.formName,
-    formName = _ref2$formName === void 0 ? "" : _ref2$formName,
-    setFormName = _ref2.setFormName,
-    _ref2$formIcon = _ref2.formIcon,
-    formIcon = _ref2$formIcon === void 0 ? "folder" : _ref2$formIcon,
-    setFormIcon = _ref2.setFormIcon,
-    onSaveEdit = _ref2.onSaveEdit,
-    onCancelEdit = _ref2.onCancelEdit,
-    onStartEdit = _ref2.onStartEdit,
-    onCreate = _ref2.onCreate,
-    onDelete = _ref2.onDelete;
+
+var FolderDetail = function FolderDetail(_ref) {
+  var _ref$menuItem = _ref.menuItem,
+    menuItem = _ref$menuItem === void 0 ? null : _ref$menuItem,
+    _ref$workspaces = _ref.workspaces,
+    workspaces = _ref$workspaces === void 0 ? [] : _ref$workspaces,
+    _ref$isEditing = _ref.isEditing,
+    isEditing = _ref$isEditing === void 0 ? false : _ref$isEditing,
+    _ref$isCreating = _ref.isCreating,
+    isCreating = _ref$isCreating === void 0 ? false : _ref$isCreating,
+    _ref$formName = _ref.formName,
+    formName = _ref$formName === void 0 ? "" : _ref$formName,
+    setFormName = _ref.setFormName,
+    _ref$formIcon = _ref.formIcon,
+    formIcon = _ref$formIcon === void 0 ? "folder" : _ref$formIcon,
+    setFormIcon = _ref.setFormIcon,
+    onSaveEdit = _ref.onSaveEdit,
+    onCancelEdit = _ref.onCancelEdit,
+    onStartEdit = _ref.onStartEdit,
+    onCreate = _ref.onCreate,
+    onDelete = _ref.onDelete;
   var isFormMode = isEditing || isCreating;
 
   // Get dashboards in this folder
@@ -26480,7 +26481,21 @@ var StarRating = function StarRating(_ref) {
   });
 };
 
+var DASHBOARD_TAGS = ["productivity", "monitoring", "analytics", "communication", "developer", "sales", "marketing", "finance", "project-management", "social", "news", "utilities"];
+
+/**
+ * PublishDashboardModal — multi-step stepper for preparing a dashboard
+ * for registry publishing.
+ *
+ * Steps:
+ *   0. Account — Auth check, sign-in prompt, profile display
+ *   1. Details — Author name (pre-filled from profile) + description (textarea)
+ *   2. Tags — Predefined tag selection with toggle-pill styling
+ *   3. Icon — Full icon picker with search
+ *   4. Publish — Review summary, publish action, result display
+ */
 var PublishDashboardModal = function PublishDashboardModal(_ref) {
+  var _result$registrySubmi, _result$registrySubmi2;
   var isOpen = _ref.isOpen,
     setIsOpen = _ref.setIsOpen,
     appId = _ref.appId,
@@ -26491,146 +26506,657 @@ var PublishDashboardModal = function PublishDashboardModal(_ref) {
   var panelStyles = DashReact.getStylesForItem(DashReact.themeObjects.PANEL, currentTheme, {
     grow: false
   });
-  var _useState = React.useState(""),
+  // Stepper state
+  var _useState = React.useState(0),
     _useState2 = _slicedToArray(_useState, 2),
-    description = _useState2[0],
-    setDescription = _useState2[1];
-  var _useState3 = React.useState(""),
+    step = _useState2[0],
+    setStep = _useState2[1];
+
+  // Step 0: Account / Auth
+  var _useState3 = React.useState("loading"),
     _useState4 = _slicedToArray(_useState3, 2),
-    tags = _useState4[0],
-    setTags = _useState4[1];
-  var _useState5 = React.useState(""),
+    authStatus = _useState4[0],
+    setAuthStatus = _useState4[1]; // "loading" | "authenticated" | "unauthenticated"
+  var _useState5 = React.useState(null),
     _useState6 = _slicedToArray(_useState5, 2),
-    icon = _useState6[0],
-    setIcon = _useState6[1];
-  var _useState7 = React.useState(false),
+    profile = _useState6[0],
+    setProfile = _useState6[1];
+  var _useState7 = React.useState(null),
     _useState8 = _slicedToArray(_useState7, 2),
-    isPublishing = _useState8[0],
-    setIsPublishing = _useState8[1];
-  var _useState9 = React.useState(null),
+    authFlow = _useState8[0],
+    setAuthFlow = _useState8[1];
+  var _useState9 = React.useState(false),
     _useState0 = _slicedToArray(_useState9, 2),
-    result = _useState0[0],
-    setResult = _useState0[1];
+    isPolling = _useState0[0],
+    setIsPolling = _useState0[1];
+
+  // Step 1: Details
+  var _useState1 = React.useState(""),
+    _useState10 = _slicedToArray(_useState1, 2),
+    authorName = _useState10[0],
+    setAuthorName = _useState10[1];
+  var _useState11 = React.useState(""),
+    _useState12 = _slicedToArray(_useState11, 2),
+    description = _useState12[0],
+    setDescription = _useState12[1];
+
+  // Step 2: Tags
+  var _useState13 = React.useState([]),
+    _useState14 = _slicedToArray(_useState13, 2),
+    selectedTags = _useState14[0],
+    setSelectedTags = _useState14[1];
+
+  // Step 3: Icon
+  var _useState15 = React.useState("grip"),
+    _useState16 = _slicedToArray(_useState15, 2),
+    icon = _useState16[0],
+    setIcon = _useState16[1];
+
+  // Step 4: Publish
+  var _useState17 = React.useState(false),
+    _useState18 = _slicedToArray(_useState17, 2),
+    isPublishing = _useState18[0],
+    setIsPublishing = _useState18[1];
+  var _useState19 = React.useState(null),
+    _useState20 = _slicedToArray(_useState19, 2),
+    result = _useState20[0],
+    setResult = _useState20[1];
+
+  // Check auth status on mount
+  React.useEffect(function () {
+    if (!isOpen) return;
+    var cancelled = false;
+    function checkAuth() {
+      return _checkAuth.apply(this, arguments);
+    }
+    function _checkAuth() {
+      _checkAuth = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+        var status, userProfile;
+        return _regeneratorRuntime.wrap(function (_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _context.prev = 0;
+              _context.next = 1;
+              return window.mainApi.registryAuth.getStatus();
+            case 1:
+              status = _context.sent;
+              if (!cancelled) {
+                _context.next = 2;
+                break;
+              }
+              return _context.abrupt("return");
+            case 2:
+              if (!status.authenticated) {
+                _context.next = 5;
+                break;
+              }
+              _context.next = 3;
+              return window.mainApi.registryAuth.getProfile();
+            case 3:
+              userProfile = _context.sent;
+              if (!cancelled) {
+                _context.next = 4;
+                break;
+              }
+              return _context.abrupt("return");
+            case 4:
+              setProfile(userProfile);
+              setAuthStatus("authenticated");
+              if (userProfile !== null && userProfile !== void 0 && userProfile.displayName && !authorName) {
+                setAuthorName(userProfile.displayName);
+              }
+              _context.next = 6;
+              break;
+            case 5:
+              setAuthStatus("unauthenticated");
+            case 6:
+              _context.next = 8;
+              break;
+            case 7:
+              _context.prev = 7;
+              _context["catch"](0);
+              if (!cancelled) setAuthStatus("unauthenticated");
+            case 8:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, null, [[0, 7]]);
+      }));
+      return _checkAuth.apply(this, arguments);
+    }
+    checkAuth();
+    return function () {
+      cancelled = true;
+    };
+  }, [isOpen]);
+  function resetState() {
+    setStep(0);
+    setAuthStatus("loading");
+    setProfile(null);
+    setAuthFlow(null);
+    setIsPolling(false);
+    setAuthorName("");
+    setDescription("");
+    setSelectedTags([]);
+    setIcon("grip");
+    setIsPublishing(false);
+    setResult(null);
+  }
   function handleClose() {
     setIsOpen(false);
-    // Reset state after a brief delay to avoid flash
-    setTimeout(function () {
-      setDescription("");
-      setTags("");
-      setIcon("");
-      setIsPublishing(false);
-      setResult(null);
-    }, 200);
+    setTimeout(resetState, 200);
+  }
+  function handleStepChange(nextStep) {
+    if (step === 0 && nextStep > 0 && authStatus !== "authenticated") return;
+    if (step === 1 && nextStep > 1 && !authorName.trim()) return;
+    if (step === 2 && nextStep > 2 && selectedTags.length === 0) return;
+    setStep(nextStep);
+  }
+  function toggleTag(tag) {
+    setSelectedTags(function (prev) {
+      return prev.includes(tag) ? prev.filter(function (t) {
+        return t !== tag;
+      }) : [].concat(_toConsumableArray(prev), [tag]);
+    });
   }
   function handlePublish() {
     return _handlePublish.apply(this, arguments);
   }
   function _handlePublish() {
-    _handlePublish = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      var options, res, _t;
-      return _regeneratorRuntime.wrap(function (_context) {
-        while (1) switch (_context.prev = _context.next) {
+    _handlePublish = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+      var options, res, _t2;
+      return _regeneratorRuntime.wrap(function (_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
           case 0:
             if (!(!appId || !workspaceId)) {
-              _context.next = 1;
+              _context2.next = 1;
               break;
             }
-            return _context.abrupt("return");
+            return _context2.abrupt("return");
           case 1:
             setIsPublishing(true);
             setResult(null);
-            _context.prev = 2;
+            _context2.prev = 2;
             options = {
+              authorName: authorName.trim(),
               description: description.trim() || undefined,
-              tags: tags.split(",").map(function (t) {
-                return t.trim();
-              }).filter(Boolean),
-              icon: icon.trim() || undefined
+              tags: selectedTags,
+              icon: icon || undefined
             };
-            _context.next = 3;
+            _context2.next = 3;
             return window.mainApi.dashboardConfig.prepareDashboardForPublish(appId, workspaceId, options);
           case 3:
-            res = _context.sent;
+            res = _context2.sent;
             setResult(res);
-            _context.next = 5;
+            _context2.next = 5;
             break;
           case 4:
-            _context.prev = 4;
-            _t = _context["catch"](2);
+            _context2.prev = 4;
+            _t2 = _context2["catch"](2);
             setResult({
               success: false,
-              error: _t.message || "Failed to prepare dashboard for publish."
+              error: _t2.message || "Failed to prepare dashboard for publish."
             });
           case 5:
-            _context.prev = 5;
+            _context2.prev = 5;
             setIsPublishing(false);
-            return _context.finish(5);
+            return _context2.finish(5);
           case 6:
           case "end":
-            return _context.stop();
+            return _context2.stop();
         }
-      }, _callee, null, [[2, 4, 5, 6]]);
+      }, _callee2, null, [[2, 4, 5, 6]]);
     }));
     return _handlePublish.apply(this, arguments);
   }
-  return /*#__PURE__*/jsxRuntime.jsx(DashReact.ConfirmationModal, {
+  function handleSignIn() {
+    return _handleSignIn.apply(this, arguments);
+  }
+  function _handleSignIn() {
+    _handleSignIn = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
+      var flow, interval, poll;
+      return _regeneratorRuntime.wrap(function (_context4) {
+        while (1) switch (_context4.prev = _context4.next) {
+          case 0:
+            _context4.prev = 0;
+            _context4.next = 1;
+            return window.mainApi.registryAuth.initiateLogin();
+          case 1:
+            flow = _context4.sent;
+            setAuthFlow(flow);
+
+            // Open verification URL in browser
+            if (flow.verificationUrlComplete) {
+              window.mainApi.shell.openExternal(flow.verificationUrlComplete);
+            }
+
+            // Start polling
+            setIsPolling(true);
+            interval = (flow.interval || 5) * 1000;
+            poll = setInterval(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
+              var pollResult, userProfile;
+              return _regeneratorRuntime.wrap(function (_context3) {
+                while (1) switch (_context3.prev = _context3.next) {
+                  case 0:
+                    _context3.prev = 0;
+                    _context3.next = 1;
+                    return window.mainApi.registryAuth.pollToken(flow.deviceCode);
+                  case 1:
+                    pollResult = _context3.sent;
+                    if (!(pollResult.status === "authorized")) {
+                      _context3.next = 3;
+                      break;
+                    }
+                    clearInterval(poll);
+                    setIsPolling(false);
+                    setAuthFlow(null);
+                    // Fetch profile and update auth state
+                    _context3.next = 2;
+                    return window.mainApi.registryAuth.getProfile();
+                  case 2:
+                    userProfile = _context3.sent;
+                    setProfile(userProfile);
+                    setAuthStatus("authenticated");
+                    if (userProfile !== null && userProfile !== void 0 && userProfile.displayName && !authorName) {
+                      setAuthorName(userProfile.displayName);
+                    }
+                    _context3.next = 4;
+                    break;
+                  case 3:
+                    if (pollResult.status === "expired") {
+                      clearInterval(poll);
+                      setIsPolling(false);
+                      setAuthFlow(null);
+                    }
+                  case 4:
+                    _context3.next = 6;
+                    break;
+                  case 5:
+                    _context3.prev = 5;
+                    _context3["catch"](0);
+                    clearInterval(poll);
+                    setIsPolling(false);
+                  case 6:
+                  case "end":
+                    return _context3.stop();
+                }
+              }, _callee3, null, [[0, 5]]);
+            })), interval);
+            _context4.next = 3;
+            break;
+          case 2:
+            _context4.prev = 2;
+            _context4["catch"](0);
+          case 3:
+          case "end":
+            return _context4.stop();
+        }
+      }, _callee4, null, [[0, 2]]);
+    }));
+    return _handleSignIn.apply(this, arguments);
+  }
+  function handleSignOut() {
+    return _handleSignOut.apply(this, arguments);
+  }
+  function _handleSignOut() {
+    _handleSignOut = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
+      return _regeneratorRuntime.wrap(function (_context5) {
+        while (1) switch (_context5.prev = _context5.next) {
+          case 0:
+            _context5.prev = 0;
+            _context5.next = 1;
+            return window.mainApi.registryAuth.logout();
+          case 1:
+            setAuthStatus("unauthenticated");
+            setProfile(null);
+            _context5.next = 3;
+            break;
+          case 2:
+            _context5.prev = 2;
+            _context5["catch"](0);
+          case 3:
+          case "end":
+            return _context5.stop();
+        }
+      }, _callee5, null, [[0, 2]]);
+    }));
+    return _handleSignOut.apply(this, arguments);
+  }
+  var isLastStep = step === 4;
+  var canAdvance = step === 0 ? authStatus === "authenticated" : step === 1 ? !!authorName.trim() : step === 2 ? selectedTags.length > 0 : true;
+  return /*#__PURE__*/jsxRuntime.jsx(DashReact.Modal, {
     isOpen: isOpen,
     setIsOpen: handleClose,
-    title: "Publish \"".concat(workspaceName || "Dashboard", "\""),
-    confirmLabel: isPublishing ? "Preparing..." : "Prepare for Publish",
-    onConfirm: result ? handleClose : handlePublish,
-    onCancel: handleClose,
-    disabled: isPublishing,
-    children: /*#__PURE__*/jsxRuntime.jsx("div", {
-      className: "space-y-4 ".concat(panelStyles.textColor || "text-gray-200"),
-      children: !result ? /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-        children: [/*#__PURE__*/jsxRuntime.jsx("p", {
-          className: "text-sm opacity-70",
-          children: "This will create a publish-ready ZIP file that can be submitted to the dashboard registry."
-        }), /*#__PURE__*/jsxRuntime.jsxs("div", {
-          className: "space-y-3",
-          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.InputText, {
-            label: "Description",
-            value: description,
-            onChange: setDescription,
-            placeholder: "A brief description of this dashboard..."
-          }), /*#__PURE__*/jsxRuntime.jsx(DashReact.InputText, {
-            label: "Tags (comma-separated)",
-            value: tags,
-            onChange: setTags,
-            placeholder: "productivity, slack, monitoring"
-          }), /*#__PURE__*/jsxRuntime.jsx(DashReact.InputText, {
-            label: "Icon (FontAwesome name)",
-            value: icon,
-            onChange: setIcon,
-            placeholder: "chart-line"
-          })]
+    width: "w-full max-w-2xl",
+    height: "h-[70vh]",
+    children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+      className: "flex flex-col h-full rounded-lg overflow-clip border ".concat(panelStyles.backgroundColor || "", " ").concat(panelStyles.borderColor || "", " ").concat(panelStyles.textColor || ""),
+      children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "flex-shrink-0 flex flex-row items-center justify-between p-4 border-b border-white/10",
+        children: [/*#__PURE__*/jsxRuntime.jsxs("span", {
+          className: "text-lg font-semibold",
+          children: ["Publish \"", workspaceName || "Dashboard", "\""]
+        }), /*#__PURE__*/jsxRuntime.jsx("button", {
+          type: "button",
+          onClick: handleClose,
+          className: "opacity-50 hover:opacity-100 transition-opacity cursor-pointer",
+          children: /*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+            icon: "xmark",
+            className: "h-5 w-5"
+          })
         })]
-      }) : result.success ? /*#__PURE__*/jsxRuntime.jsxs("div", {
-        className: "space-y-3",
-        children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
-          className: "flex items-center gap-2",
-          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
-            icon: "circle-check",
-            className: "h-4 w-4 text-green-400"
-          }), /*#__PURE__*/jsxRuntime.jsx("span", {
-            className: "text-sm",
-            children: "Dashboard prepared for publishing."
-          })]
-        }), result.filePath && /*#__PURE__*/jsxRuntime.jsxs("div", {
-          className: "text-xs opacity-50 break-all",
-          children: ["Saved to: ", result.filePath]
+      }), /*#__PURE__*/jsxRuntime.jsxs(DashReact.Stepper, {
+        activeStep: step,
+        onStepChange: handleStepChange,
+        showNavigation: false,
+        className: "flex-1 min-h-0 flex flex-col px-6 pt-2",
+        children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.Stepper.Step, {
+          label: "Account",
+          children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "flex-1 min-h-0 overflow-y-auto pb-4 space-y-5",
+            children: [authStatus === "loading" && /*#__PURE__*/jsxRuntime.jsx("div", {
+              className: "flex items-center justify-center py-12",
+              children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+                className: "flex items-center gap-3 text-sm opacity-60",
+                children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                  icon: "spinner",
+                  className: "h-4 w-4 animate-spin"
+                }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                  children: "Checking account status..."
+                })]
+              })
+            }), authStatus === "authenticated" && profile && /*#__PURE__*/jsxRuntime.jsxs("div", {
+              className: "space-y-4",
+              children: [/*#__PURE__*/jsxRuntime.jsx("p", {
+                className: "text-sm opacity-70",
+                children: "You're signed in and ready to publish."
+              }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+                className: "bg-white/5 border border-white/10 rounded-lg p-4 flex items-center gap-4",
+                children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+                  className: "flex items-center justify-center h-10 w-10 rounded-full bg-green-500/20 border border-green-500/30",
+                  children: /*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                    icon: "circle-check",
+                    className: "h-5 w-5 text-green-400"
+                  })
+                }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "flex-1 min-w-0",
+                  children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+                    className: "text-sm font-medium truncate",
+                    children: profile.displayName || profile.username
+                  }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+                    className: "text-xs opacity-50 truncate",
+                    children: ["@", profile.username]
+                  })]
+                })]
+              }), /*#__PURE__*/jsxRuntime.jsx("button", {
+                type: "button",
+                onClick: handleSignOut,
+                className: "text-xs opacity-40 hover:opacity-70 transition-opacity cursor-pointer",
+                children: "Sign out"
+              })]
+            }), authStatus === "unauthenticated" && /*#__PURE__*/jsxRuntime.jsxs("div", {
+              className: "space-y-4",
+              children: [/*#__PURE__*/jsxRuntime.jsx("p", {
+                className: "text-sm opacity-70",
+                children: "Sign in to the Dash Registry to publish your dashboard."
+              }), !authFlow && !isPolling && /*#__PURE__*/jsxRuntime.jsx("button", {
+                type: "button",
+                onClick: handleSignIn,
+                className: "px-4 py-2 rounded-lg text-sm bg-blue-500/20 border border-blue-500/30 text-blue-300 hover:bg-blue-500/30 transition-colors cursor-pointer",
+                children: "Sign in to Registry"
+              }), authFlow && isPolling && /*#__PURE__*/jsxRuntime.jsxs("div", {
+                className: "bg-blue-500/10 border border-blue-500/20 rounded-lg p-4 space-y-3",
+                children: [/*#__PURE__*/jsxRuntime.jsx("p", {
+                  className: "text-xs text-blue-300/90",
+                  children: "Enter this code in your browser:"
+                }), /*#__PURE__*/jsxRuntime.jsx("div", {
+                  className: "text-center",
+                  children: /*#__PURE__*/jsxRuntime.jsx("span", {
+                    className: "text-2xl font-mono font-bold tracking-widest text-white",
+                    children: authFlow.userCode
+                  })
+                }), /*#__PURE__*/jsxRuntime.jsx("p", {
+                  className: "text-xs text-blue-300/70 text-center",
+                  children: "Waiting for authorization..."
+                })]
+              })]
+            })]
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx(DashReact.Stepper.Step, {
+          label: "Details",
+          children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "flex-1 min-h-0 overflow-y-auto pb-4 space-y-5",
+            children: [/*#__PURE__*/jsxRuntime.jsx("p", {
+              className: "text-sm opacity-70",
+              children: "Provide details about your dashboard for the registry listing."
+            }), /*#__PURE__*/jsxRuntime.jsx(DashReact.InputText, {
+              label: "Author Name *",
+              value: authorName,
+              onChange: setAuthorName,
+              placeholder: "Your name"
+            }), /*#__PURE__*/jsxRuntime.jsx(DashReact.TextArea, {
+              label: "Description",
+              value: description,
+              onChange: setDescription,
+              placeholder: "A brief description of this dashboard...",
+              rows: 3
+            })]
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx(DashReact.Stepper.Step, {
+          label: "Tags",
+          children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "flex-1 min-h-0 overflow-y-auto pb-4 space-y-5",
+            children: [/*#__PURE__*/jsxRuntime.jsx("p", {
+              className: "text-sm opacity-70",
+              children: "Select at least one tag to categorize your dashboard."
+            }), /*#__PURE__*/jsxRuntime.jsx("div", {
+              className: "grid grid-cols-3 gap-2",
+              children: DASHBOARD_TAGS.map(function (tag) {
+                var isSelected = selectedTags.includes(tag);
+                return /*#__PURE__*/jsxRuntime.jsx("button", {
+                  type: "button",
+                  onClick: function onClick() {
+                    return toggleTag(tag);
+                  },
+                  className: "px-3 py-1.5 rounded-full text-sm border transition-colors cursor-pointer ".concat(isSelected ? "bg-white/15 border-white/30 text-white" : "bg-transparent border-white/10 text-white/60 hover:border-white/20 hover:text-white/80"),
+                  children: tag
+                }, tag);
+              })
+            })]
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx(DashReact.Stepper.Step, {
+          label: "Icon",
+          children: /*#__PURE__*/jsxRuntime.jsx("div", {
+            className: "flex-1 min-h-0 flex flex-col pb-4",
+            children: /*#__PURE__*/jsxRuntime.jsx(IconPicker, {
+              selectedIcon: icon,
+              onSelectIcon: setIcon
+            })
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx(DashReact.Stepper.Step, {
+          label: "Publish",
+          children: /*#__PURE__*/jsxRuntime.jsx("div", {
+            className: "flex-1 min-h-0 overflow-y-auto pb-4 space-y-4",
+            children: !result ? /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+              children: [/*#__PURE__*/jsxRuntime.jsx("p", {
+                className: "text-sm opacity-70",
+                children: "Review your dashboard details before publishing."
+              }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+                className: "bg-white/5 border border-white/10 rounded-lg p-4 space-y-2 text-sm",
+                children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "flex gap-2",
+                  children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+                    className: "opacity-50 w-20 flex-shrink-0",
+                    children: "Author"
+                  }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                    children: authorName
+                  })]
+                }), description.trim() && /*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "flex gap-2",
+                  children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+                    className: "opacity-50 w-20 flex-shrink-0",
+                    children: "Description"
+                  }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                    children: description
+                  })]
+                }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "flex gap-2",
+                  children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+                    className: "opacity-50 w-20 flex-shrink-0",
+                    children: "Tags"
+                  }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                    children: selectedTags.length > 0 ? selectedTags.join(", ") : "None"
+                  })]
+                }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "flex gap-2 items-center",
+                  children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+                    className: "opacity-50 w-20 flex-shrink-0",
+                    children: "Icon"
+                  }), /*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                    icon: icon || "grip",
+                    className: "h-4 w-4"
+                  }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                    className: "opacity-70",
+                    children: icon || "grip"
+                  })]
+                })]
+              })]
+            }) : result.success ? /*#__PURE__*/jsxRuntime.jsxs("div", {
+              className: "space-y-3",
+              children: [(_result$registrySubmi = result.registrySubmission) !== null && _result$registrySubmi !== void 0 && _result$registrySubmi.success ? /*#__PURE__*/jsxRuntime.jsxs("div", {
+                className: "space-y-3",
+                children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "flex items-center gap-2",
+                  children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                    icon: "circle-check",
+                    className: "h-4 w-4 text-green-400"
+                  }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                    className: "text-sm",
+                    children: "Published to Dash Registry"
+                  })]
+                }), result.registrySubmission.registryUrl && /*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "bg-white/5 border border-white/10 rounded-lg p-3",
+                  children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+                    className: "text-xs opacity-50 mb-1",
+                    children: "Shareable Link"
+                  }), /*#__PURE__*/jsxRuntime.jsx("button", {
+                    type: "button",
+                    onClick: function onClick() {
+                      return window.mainApi.shell.openExternal(result.registrySubmission.registryUrl);
+                    },
+                    className: "text-sm text-blue-400 hover:underline cursor-pointer break-all text-left",
+                    children: result.registrySubmission.registryUrl
+                  })]
+                }), result.registrySubmission.version && /*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "text-xs opacity-50",
+                  children: ["Version: v", result.registrySubmission.version]
+                })]
+              }) : /*#__PURE__*/jsxRuntime.jsxs("div", {
+                className: "space-y-3",
+                children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "flex items-center gap-2",
+                  children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                    icon: "circle-check",
+                    className: "h-4 w-4 text-green-400"
+                  }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                    className: "text-sm",
+                    children: "Dashboard prepared for publishing."
+                  })]
+                }), ((_result$registrySubmi2 = result.registrySubmission) === null || _result$registrySubmi2 === void 0 ? void 0 : _result$registrySubmi2.error) && /*#__PURE__*/jsxRuntime.jsx("div", {
+                  className: "bg-amber-500/10 border border-amber-500/20 rounded-lg p-3",
+                  children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+                    className: "flex items-start gap-2",
+                    children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                      icon: "triangle-exclamation",
+                      className: "h-3.5 w-3.5 text-amber-400 mt-0.5 flex-shrink-0"
+                    }), /*#__PURE__*/jsxRuntime.jsxs("span", {
+                      className: "text-xs text-amber-300/90",
+                      children: ["Registry upload failed:", " ", result.registrySubmission.error, ". Your dashboard was saved locally."]
+                    })]
+                  })
+                })]
+              }), result.filePath && /*#__PURE__*/jsxRuntime.jsxs("div", {
+                className: "text-xs opacity-50 break-all",
+                children: ["Saved to: ", result.filePath]
+              }), result.warnings && result.warnings.length > 0 && /*#__PURE__*/jsxRuntime.jsxs("div", {
+                className: "bg-amber-500/10 border border-amber-500/20 rounded-lg p-3 space-y-2",
+                children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "flex items-start gap-2",
+                  children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                    icon: "triangle-exclamation",
+                    className: "h-3.5 w-3.5 text-amber-400 mt-0.5 flex-shrink-0"
+                  }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                    className: "text-xs text-amber-300/90",
+                    children: "The following widgets are not currently on the registry. This may be intentional if they are private. Dashboards referencing these widgets can only be installed by users who already have them."
+                  })]
+                }), /*#__PURE__*/jsxRuntime.jsx("ul", {
+                  className: "text-xs opacity-60 pl-5 list-disc space-y-0.5",
+                  children: result.warnings.map(function (w) {
+                    return /*#__PURE__*/jsxRuntime.jsx("li", {
+                      children: w
+                    }, w);
+                  })
+                })]
+              }), result.registryCheckFailed && /*#__PURE__*/jsxRuntime.jsx("div", {
+                className: "bg-amber-500/10 border border-amber-500/20 rounded-lg p-3",
+                children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+                  className: "flex items-start gap-2",
+                  children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                    icon: "triangle-exclamation",
+                    className: "h-3.5 w-3.5 text-amber-400 mt-0.5 flex-shrink-0"
+                  }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                    className: "text-xs text-amber-300/90",
+                    children: "Unable to reach the registry to verify widget availability. Your dashboard was still prepared successfully."
+                  })]
+                })
+              })]
+            }) : /*#__PURE__*/jsxRuntime.jsxs("div", {
+              className: "flex items-center gap-2",
+              children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+                icon: "circle-xmark",
+                className: "h-4 w-4 text-red-400"
+              }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                className: "text-sm text-red-400",
+                children: result.error || "Publish preparation failed."
+              })]
+            })
+          })
         })]
-      }) : /*#__PURE__*/jsxRuntime.jsxs("div", {
-        className: "flex items-center gap-2",
-        children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
-          icon: "circle-xmark",
-          className: "h-4 w-4 text-red-400"
-        }), /*#__PURE__*/jsxRuntime.jsx("span", {
-          className: "text-sm text-red-400",
-          children: result.error || "Publish preparation failed."
+      }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "flex-shrink-0 flex flex-row items-center px-6 py-4 border-t border-white/10",
+        children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+          className: "flex flex-row gap-2",
+          children: /*#__PURE__*/jsxRuntime.jsx(DashReact.Button3, {
+            title: step === 0 ? "Cancel" : "Back",
+            onClick: step === 0 ? handleClose : function () {
+              return setStep(step - 1);
+            },
+            disabled: isPublishing
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx("div", {
+          className: "flex-1 text-center",
+          children: /*#__PURE__*/jsxRuntime.jsxs("span", {
+            className: "text-xs opacity-40",
+            children: ["Step ", step + 1, " of 5"]
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx("div", {
+          className: "flex flex-row gap-2",
+          children: result !== null && result !== void 0 && result.success ? /*#__PURE__*/jsxRuntime.jsx(DashReact.Button2, {
+            title: "Done",
+            onClick: handleClose
+          }) : isLastStep ? /*#__PURE__*/jsxRuntime.jsx(DashReact.Button2, {
+            title: isPublishing ? "Publishing..." : "Publish",
+            onClick: handlePublish,
+            disabled: isPublishing
+          }) : /*#__PURE__*/jsxRuntime.jsx(DashReact.Button2, {
+            title: "Next",
+            onClick: function onClick() {
+              return handleStepChange(step + 1);
+            },
+            disabled: !canAdvance
+          })
         })]
-      })
+      })]
     })
   });
 };
@@ -27601,7 +28127,7 @@ var DashboardsSection = function DashboardsSection(_ref) {
             return window.mainApi.dashboardConfig.importDashboardConfig(appId);
           case 3:
             result = _context.sent;
-            if (result) {
+            if (!(!result || result.canceled)) {
               _context.next = 4;
               break;
             }
@@ -27652,7 +28178,9 @@ var DashboardsSection = function DashboardsSection(_ref) {
       }),
       active: isSelected,
       onClick: function onClick() {
-        return setSelectedId(ws.id);
+        setSelectedId(ws.id);
+        setInstallMode(null);
+        setImportResult(null);
       },
       badge: String(widgetCount),
       className: isSelected ? "bg-white/10 opacity-100" : "",