@trops/dash-core 0.1.451 → 0.1.453

package/dist/index.js

@@ -25461,6 +25461,7 @@ var WidgetErrorBoundary = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
+      var _this2 = this;
       if (this.state.hasError) {
         var _this$state$error;
         var widgetName = this.props.widgetName;
@@ -25468,33 +25469,64 @@ var WidgetErrorBoundary = /*#__PURE__*/function (_Component) {
 
         // Check if it's a WidgetContext error
         var isContextError = errorMessage.includes("Widget ID not found in Context") || errorMessage.includes("WidgetContext");
+
+        // AI-built widgets live under @ai-built/* — they get an "Open
+        // in AI Builder" recovery button that dispatches the existing
+        // dash:edit-widget-with-ai event (dash-electron's Dash.js
+        // listens for it and reopens the failing widget in remix mode).
+        var isAiBuilt = typeof widgetName === "string" && /(^|[./])ai-built\b/i.test(widgetName);
+        var openInBuilder = function openInBuilder() {
+          try {
+            window.dispatchEvent(new CustomEvent("dash:edit-widget-with-ai", {
+              detail: {
+                widgetComponentName: widgetName
+              }
+            }));
+          } catch (err) {
+          }
+        };
         return /*#__PURE__*/jsxRuntime.jsxs("div", {
-          className: "flex flex-col h-full w-full bg-red-900 border-2 border-red-600 rounded p-4 text-red-100",
+          className: "flex flex-col h-full w-full bg-amber-950 border border-amber-700 rounded p-4 text-amber-100",
           children: [/*#__PURE__*/jsxRuntime.jsx("div", {
-            className: "text-xl font-bold mb-2",
-            children: "\u26A0\uFE0F Widget Error"
-          }), /*#__PURE__*/jsxRuntime.jsxs("div", {
-            className: "text-sm mb-3",
-            children: [/*#__PURE__*/jsxRuntime.jsx("strong", {
-              children: "Widget:"
-            }), " ", widgetName]
+            className: "text-base font-semibold mb-2 text-amber-200",
+            children: "Widget couldn't render"
           }), /*#__PURE__*/jsxRuntime.jsxs("div", {
-            className: "text-sm mb-3",
-            children: [/*#__PURE__*/jsxRuntime.jsx("strong", {
-              children: "Error:"
-            }), " ", errorMessage]
+            className: "text-xs mb-2 break-words",
+            children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+              className: "text-amber-300",
+              children: widgetName
+            }), " threw", " ", /*#__PURE__*/jsxRuntime.jsx("span", {
+              className: "font-mono",
+              children: errorMessage
+            })]
           }), isContextError && /*#__PURE__*/jsxRuntime.jsxs("div", {
-            className: "text-sm bg-red-800 border border-red-700 rounded p-3 mt-2",
+            className: "text-xs bg-amber-900 border border-amber-700 rounded p-2 mt-2 mb-2",
             children: [/*#__PURE__*/jsxRuntime.jsx("strong", {
               children: "Fix:"
             }), " This widget uses ", /*#__PURE__*/jsxRuntime.jsx("code", {
               children: "WidgetContext"
             }), " ", "but is missing the ", /*#__PURE__*/jsxRuntime.jsx("code", {
               children: "<Widget>"
-            }), " wrapper.", /*#__PURE__*/jsxRuntime.jsx("br", {}), /*#__PURE__*/jsxRuntime.jsx("br", {}), "Add the wrapper in your widget component:", /*#__PURE__*/jsxRuntime.jsx("pre", {
+            }), " wrapper.", /*#__PURE__*/jsxRuntime.jsx("br", {}), "Add the wrapper in your widget component:", /*#__PURE__*/jsxRuntime.jsx("pre", {
               className: "bg-gray-900 p-2 rounded mt-2 text-xs overflow-auto",
               children: "import { Widget } from \"@trops/dash-react\";\n\nexport const ".concat(widgetName, " = (props) => {\n  return (\n    <Widget {...props}>\n      {/* Your widget content */}\n    </Widget>\n  );\n};")
             })]
+          }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "flex items-center gap-2 mt-2",
+            children: [/*#__PURE__*/jsxRuntime.jsx("button", {
+              onClick: function onClick() {
+                return _this2.setState({
+                  hasError: false,
+                  error: null
+                });
+              },
+              className: "px-3 py-1 rounded text-xs bg-amber-700 hover:bg-amber-600 text-amber-100 transition-colors",
+              children: "Retry"
+            }), isAiBuilt && /*#__PURE__*/jsxRuntime.jsx("button", {
+              onClick: openInBuilder,
+              className: "px-3 py-1 rounded text-xs bg-indigo-600 hover:bg-indigo-500 text-white transition-colors",
+              children: "Open in AI Builder"
+            })]
           })]
         });
       }
@@ -45820,7 +45852,9 @@ var getIconForServer = function getIconForServer(server) {
  */
 var McpCatalogDetail = function McpCatalogDetail(_ref) {
   var onSave = _ref.onSave,
-    onCancel = _ref.onCancel;
+    onCancel = _ref.onCancel,
+    _ref$initialSelectedI = _ref.initialSelectedId,
+    initialSelectedId = _ref$initialSelectedI === void 0 ? null : _ref$initialSelectedI;
   var appContext = React.useContext(AppContext);
   var dashApi = appContext === null || appContext === void 0 ? void 0 : appContext.dashApi;
   var _useState = React.useState([]),
@@ -45957,6 +45991,22 @@ var McpCatalogDetail = function McpCatalogDetail(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [dashApi]);
 
+  // Pre-select a catalog entry when initialSelectedId is provided
+  // (used by the cross-modal "Add new <type>" CTA from the Widget
+  // Builder). Fires once the catalog finishes loading; if no entry
+  // matches the id (e.g. type isn't in the catalog), silently no-ops
+  // and the user lands on the catalog grid to pick manually.
+  React.useEffect(function () {
+    if (!initialSelectedId || selectedServer || catalog.length === 0) return;
+    var match = catalog.find(function (s) {
+      return s && s.id === initialSelectedId;
+    });
+    if (match) {
+      setSelectedServer(match);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [catalog, initialSelectedId]);
+
   // Filter catalog by search, then sort alphabetically by display name.
   // Built-in and known-external entries are interleaved alphabetically —
   // the per-card "external" badge keeps the source obvious without
@@ -47030,7 +47080,11 @@ var ProvidersSection = function ProvidersSection(_ref) {
     _ref$createRequested = _ref.createRequested,
     createRequested = _ref$createRequested === void 0 ? false : _ref$createRequested,
     _ref$onCreateAcknowle = _ref.onCreateAcknowledged,
-    onCreateAcknowledged = _ref$onCreateAcknowle === void 0 ? null : _ref$onCreateAcknowle;
+    onCreateAcknowledged = _ref$onCreateAcknowle === void 0 ? null : _ref$onCreateAcknowle,
+    _ref$initialProviderT = _ref.initialProviderType,
+    initialProviderType = _ref$initialProviderT === void 0 ? null : _ref$initialProviderT,
+    _ref$initialProviderC = _ref.initialProviderClass,
+    initialProviderClass = _ref$initialProviderC === void 0 ? null : _ref$initialProviderC;
   var appContext = React.useContext(AppContext);
   var providers = (appContext === null || appContext === void 0 ? void 0 : appContext.providers) || {};
   var refreshProviders = appContext === null || appContext === void 0 ? void 0 : appContext.refreshProviders;
@@ -47366,14 +47420,29 @@ var ProvidersSection = function ProvidersSection(_ref) {
     });
   }
 
-  // Respond to external create trigger from header
+  // Respond to external create trigger from header (or from the
+  // cross-modal "Add new <type>" event dispatched by the Widget
+  // Builder, with optional initialProviderType/initialProviderClass
+  // for type pre-fill / catalog pre-select).
   var prevCreateRequested = React.useRef(false);
   React.useEffect(function () {
     if (createRequested && !prevCreateRequested.current) {
       resetForm();
       setSelectedName(null);
-      setIsAddingMcp(false);
-      setIsCreating(true);
+      if (initialProviderClass === "mcp") {
+        // MCP class: open the catalog detail. Pre-select happens in
+        // McpCatalogDetail via the initialSelectedId prop passed below.
+        setIsCreating(false);
+        setIsAddingMcp(true);
+      } else {
+        // Credential class (default): open the credential create form
+        // and pre-fill the type field if provided.
+        setIsAddingMcp(false);
+        setIsCreating(true);
+        if (initialProviderType) {
+          setFormType(initialProviderType);
+        }
+      }
     }
     prevCreateRequested.current = createRequested;
     if (createRequested && onCreateAcknowledged) {
@@ -47509,7 +47578,8 @@ var ProvidersSection = function ProvidersSection(_ref) {
       onSave: handleMcpSave,
       onCancel: function onCancel() {
         return setIsAddingMcp(false);
-      }
+      },
+      initialSelectedId: initialProviderType
     });
   } else if (isCreating) {
     detailContent = /*#__PURE__*/jsxRuntime.jsx(ProviderDetail, {
@@ -53291,6 +53361,10 @@ var AppSettingsModal = function AppSettingsModal(_ref) {
     initialProviderName = _ref$initialProviderN === void 0 ? null : _ref$initialProviderN,
     _ref$initialCreatePro = _ref.initialCreateProvider,
     initialCreateProvider = _ref$initialCreatePro === void 0 ? false : _ref$initialCreatePro,
+    _ref$initialProviderT = _ref.initialProviderType,
+    initialProviderType = _ref$initialProviderT === void 0 ? null : _ref$initialProviderT,
+    _ref$initialProviderC = _ref.initialProviderClass,
+    initialProviderClass = _ref$initialProviderC === void 0 ? null : _ref$initialProviderC,
     _ref$workspaces = _ref.workspaces,
     workspaces = _ref$workspaces === void 0 ? [] : _ref$workspaces,
     _ref$menuItems = _ref.menuItems,
@@ -53426,7 +53500,9 @@ var AppSettingsModal = function AppSettingsModal(_ref) {
           return setCreateRequested(false);
         },
         initialProviderName: initialProviderName,
-        initialCreateRequested: initialCreateProvider
+        initialCreateRequested: initialCreateProvider,
+        initialProviderType: initialProviderType,
+        initialProviderClass: initialProviderClass
       }), activeSection === "themes" && /*#__PURE__*/jsxRuntime.jsx(ThemesSection, {
         onOpenThemeEditor: onOpenThemeEditor,
         dashApi: dashApi,
@@ -58278,13 +58354,31 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
     _useState52 = _slicedToArray(_useState51, 2),
     appSettingsCreateProvider = _useState52[0],
     setAppSettingsCreateProvider = _useState52[1];
+  // Optional pre-fills used by the cross-modal "Add new <type>"
+  // flow dispatched from dash-electron's WidgetBuilderModal.
+  // initialProviderType is the type id (e.g. "filesystem", "slack").
+  // initialProviderClass routes the create flow: "mcp" opens the
+  // catalog detail with that type pre-selected; otherwise opens
+  // the credential create form with formType pre-filled.
+  var _useState53 = React.useState(null),
+    _useState54 = _slicedToArray(_useState53, 2),
+    appSettingsInitialProviderType = _useState54[0],
+    setAppSettingsInitialProviderType = _useState54[1];
+  var _useState55 = React.useState(null),
+    _useState56 = _slicedToArray(_useState55, 2),
+    appSettingsInitialProviderClass = _useState56[0],
+    setAppSettingsInitialProviderClass = _useState56[1];
   function openAppSettings() {
     var section = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "general";
     var providerName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
     var createProvider = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+    var providerType = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+    var providerClass = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
     setAppSettingsInitialSection(section);
     setAppSettingsInitialProvider(providerName);
     setAppSettingsCreateProvider(createProvider);
+    setAppSettingsInitialProviderType(providerType);
+    setAppSettingsInitialProviderClass(providerClass);
     setIsAppSettingsOpen(true);
   }
   function handleProfileUpdated() {
@@ -58376,6 +58470,27 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
     };
   }, [changeCurrentTheme]);
 
+  // ─── Listen for "open Settings to create a provider of type X" ──
+  // Dispatched by dash-electron's Widget Builder PreviewProviderPicker
+  // when the user clicks "Add new <type>" because no instances of the
+  // chosen type exist yet. Detail: { type, providerClass }. The
+  // Widget Builder's own listener (in dash-electron/Dash.js) handles
+  // closing the builder modal — this listener only opens Settings.
+  React.useEffect(function () {
+    var handler = function handler(e) {
+      var _ref4 = (e === null || e === void 0 ? void 0 : e.detail) || {},
+        type = _ref4.type,
+        providerClass = _ref4.providerClass;
+      if (!type) return;
+      openAppSettings("providers", null, true, type, providerClass || null);
+    };
+    window.addEventListener("dash:open-settings-create-provider", handler);
+    return function () {
+      return window.removeEventListener("dash:open-settings-create-provider", handler);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
   // ─── Listen for external "open workspace" requests ──────────────
   // Fired by: Dash.js notification click, MCP state-changed for
   // create_dashboard, etc. Any code that wants to switch the active
@@ -58385,10 +58500,10 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
   // We record the requested ID and open it once it appears in
   // workspaceConfig — handles the case where the workspace was just
   // created and the config reload is still in flight.
-  var _useState53 = React.useState(null),
-    _useState54 = _slicedToArray(_useState53, 2),
-    pendingOpenWorkspaceId = _useState54[0],
-    setPendingOpenWorkspaceId = _useState54[1];
+  var _useState57 = React.useState(null),
+    _useState58 = _slicedToArray(_useState57, 2),
+    pendingOpenWorkspaceId = _useState58[0],
+    setPendingOpenWorkspaceId = _useState58[1];
   React.useEffect(function () {
     var handler = function handler(e) {
       var _e$detail2;
@@ -59010,10 +59125,10 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
   }
 
   // ─── Page State ──────────────────────────────────────────────────
-  var _useState55 = React.useState(null),
-    _useState56 = _slicedToArray(_useState55, 2),
-    activePageId = _useState56[0],
-    setActivePageId = _useState56[1];
+  var _useState59 = React.useState(null),
+    _useState60 = _slicedToArray(_useState59, 2),
+    activePageId = _useState60[0],
+    setActivePageId = _useState60[1];
 
   // Page history stack for goBack() — pushes the previous page id
   // whenever a navigation happens through navigateToPage().
@@ -59047,9 +59162,9 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
   // Listen for programmatic page switches via DashboardActionsApi
   React.useEffect(function () {
     function onSwitchPage(e) {
-      var _ref4 = e.detail || {},
-        pageId = _ref4.pageId,
-        pageName = _ref4.pageName;
+      var _ref5 = e.detail || {},
+        pageId = _ref5.pageId,
+        pageName = _ref5.pageName;
       if (pageId) {
         navigateToPage(pageId);
       } else if (pageName) {
@@ -59904,11 +60019,15 @@ var DashboardStageInner = function DashboardStageInner(_ref3) {
             if (!open) {
               setAppSettingsInitialProvider(null);
               setAppSettingsCreateProvider(false);
+              setAppSettingsInitialProviderType(null);
+              setAppSettingsInitialProviderClass(null);
             }
           },
           initialSection: appSettingsInitialSection,
           initialProviderName: appSettingsInitialProvider,
           initialCreateProvider: appSettingsCreateProvider,
+          initialProviderType: appSettingsInitialProviderType,
+          initialProviderClass: appSettingsInitialProviderClass,
           workspaces: workspaceConfig,
           menuItems: menuItems,
           dashApi: dashApi,