@trops/dash-core 0.1.402 → 0.1.404

package/dist/index.js

@@ -12782,15 +12782,12 @@ var deepEqual = function deepEqual(a, b, opts) {
 
 var deepEqual$1 = /*@__PURE__*/getDefaultExportFromCjs(deepEqual);
 
-function ownKeys$O(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$O(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$O(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$O(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var PanelEditItem = function PanelEditItem(_ref) {
   var _ComponentManager$get;
   var workspace = _ref.workspace,
     onUpdate = _ref.onUpdate,
     _ref$item = _ref.item,
     item = _ref$item === void 0 ? null : _ref$item;
-  var appContext = React.useContext(AppContext);
   var _useState = React.useState(item),
     _useState2 = _slicedToArray(_useState, 2),
     itemSelected = _useState2[0],
@@ -12805,10 +12802,6 @@ var PanelEditItem = function PanelEditItem(_ref) {
   var forceUpdate = React.useCallback(function () {
     return updateState({});
   }, []);
-  var allProviders = (appContext === null || appContext === void 0 ? void 0 : appContext.providers) || {};
-  var widgetConfig = itemSelected ? ComponentManager.config(itemSelected.component, itemSelected) : null;
-  var providerRequirements = (widgetConfig === null || widgetConfig === void 0 ? void 0 : widgetConfig.providers) || [];
-  var selectedProviders = (itemSelected === null || itemSelected === void 0 ? void 0 : itemSelected.selectedProviders) || {};
   React.useEffect(function () {
     if (deepEqual$1(item, itemSelected) === false) {
       setItemSelected(function () {
@@ -12831,23 +12824,6 @@ var PanelEditItem = function PanelEditItem(_ref) {
     onUpdate(data, workspaceTemp);
     forceUpdate();
   }
-  function handleProviderChange(providerType, providerId) {
-    var newItem = JSON.parse(JSON.stringify(itemSelected));
-    newItem.selectedProviders = newItem.selectedProviders || {};
-    newItem.selectedProviders[providerType] = providerId;
-    var workspaceTemp = WorkspaceModel(workspaceSelected);
-    var newLayout = replaceItemInLayout(workspaceTemp.layout, newItem["id"], newItem);
-    workspaceTemp.layout = newLayout;
-
-    // Also update workspace-level selectedProviders
-    var uuid = newItem.uuid || newItem.uuidString;
-    if (uuid) {
-      workspaceTemp.selectedProviders = workspaceTemp.selectedProviders || {};
-      workspaceTemp.selectedProviders[uuid] = _objectSpread$O(_objectSpread$O({}, workspaceTemp.selectedProviders[uuid] || {}), {}, _defineProperty({}, providerType, providerId));
-    }
-    onUpdate(newItem, workspaceTemp);
-    forceUpdate();
-  }
   function renderCustomSettings() {
     if (itemSelected) {
       var componentConfig = ComponentManager.getComponent(itemSelected.component);
@@ -12948,68 +12924,15 @@ var PanelEditItem = function PanelEditItem(_ref) {
     }, "config-item-".concat(key));
   }
   var hasCustomSettings = itemSelected && ((_ComponentManager$get = ComponentManager.getComponent(itemSelected.component)) === null || _ComponentManager$get === void 0 ? void 0 : _ComponentManager$get.userConfig);
-  return itemSelected && workspaceSelected && /*#__PURE__*/jsxRuntime.jsxs("div", {
+  return itemSelected && workspaceSelected && /*#__PURE__*/jsxRuntime.jsx("div", {
     className: "flex flex-col flex-1 min-h-0 overflow-y-auto p-6 space-y-6",
-    children: [hasCustomSettings && /*#__PURE__*/jsxRuntime.jsxs("div", {
+    children: hasCustomSettings && /*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "flex flex-col space-y-3",
       children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.SubHeading3, {
         title: "Configuration",
         padding: false
       }), renderCustomSettings()]
-    }), providerRequirements.length > 0 && /*#__PURE__*/jsxRuntime.jsxs("div", {
-      className: "flex flex-col space-y-3",
-      children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.SubHeading3, {
-        title: "Providers",
-        padding: false
-      }), providerRequirements.map(function (req) {
-        var providerType = req.type;
-        var currentSelection = selectedProviders[providerType] || "";
-        var availableProviders = Object.entries(allProviders).filter(function (_ref2) {
-          var _ref3 = _slicedToArray(_ref2, 2),
-            p = _ref3[1];
-          return p.type === providerType;
-        }).map(function (_ref4) {
-          var _ref5 = _slicedToArray(_ref4, 2),
-            name = _ref5[0],
-            p = _ref5[1];
-          return _objectSpread$O({
-            name: name
-          }, p);
-        });
-        return /*#__PURE__*/jsxRuntime.jsxs("div", {
-          className: "flex flex-col space-y-1",
-          children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
-            className: "flex items-center gap-1",
-            children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FormLabel, {
-              title: providerType,
-              textSize: "text-sm"
-            }), req.required && /*#__PURE__*/jsxRuntime.jsx("span", {
-              className: "text-red-500 text-sm",
-              children: "*"
-            })]
-          }), /*#__PURE__*/jsxRuntime.jsxs(DashReact.SelectMenu, {
-            name: "provider-".concat(providerType),
-            textSize: "text-sm",
-            selectedValue: currentSelection,
-            onChange: function onChange(e) {
-              return handleProviderChange(providerType, e.target.value);
-            },
-            children: [/*#__PURE__*/jsxRuntime.jsx("option", {
-              value: "",
-              children: "-- Select Provider --"
-            }), availableProviders.map(function (provider) {
-              return /*#__PURE__*/jsxRuntime.jsx("option", {
-                value: provider.name,
-                children: provider.name
-              }, provider.name);
-            })]
-          }), availableProviders.length === 0 && /*#__PURE__*/jsxRuntime.jsxs("span", {
-            className: "text-xs opacity-40",
-            children: ["No ", providerType, " providers configured"]
-          })]
-        }, providerType);
-      })]
-    })]
+    })
   });
 };
 
@@ -13017,8 +12940,8 @@ var _excluded$6 = ["rows", "cols"];
 function _createForOfIteratorHelper$o(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray$o(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$o(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$o(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$o(r, a) : void 0; } }
 function _arrayLikeToArray$o(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; }
-function ownKeys$N(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$N(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$N(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$N(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$O(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$O(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$O(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$O(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var defaultGrid = {
   rows: 1,
   cols: 1,
@@ -13039,7 +12962,7 @@ function GridEditor(_ref) {
     setGrid = _useState2[1];
   var addRow = function addRow() {
     var newRow = grid.rows;
-    var newGrid = _objectSpread$N(_objectSpread$N({}, grid), {}, {
+    var newGrid = _objectSpread$O(_objectSpread$O({}, grid), {}, {
       rows: grid.rows + 1
     });
     for (var col = 0; col < grid.cols; col++) {
@@ -13054,7 +12977,7 @@ function GridEditor(_ref) {
   };
   var addColumn = function addColumn() {
     var newCol = grid.cols;
-    var newGrid = _objectSpread$N(_objectSpread$N({}, grid), {}, {
+    var newGrid = _objectSpread$O(_objectSpread$O({}, grid), {}, {
       cols: grid.cols + 1
     });
     for (var row = 0; row < grid.rows; row++) {
@@ -13087,8 +13010,8 @@ function GridEditor(_ref) {
       });
     }
     if (grid[nextKey]) {
-      var newGrid = _objectSpread$N({}, grid);
-      newGrid[currentKey] = _objectSpread$N(_objectSpread$N({}, newGrid[currentKey]), {}, {
+      var newGrid = _objectSpread$O({}, grid);
+      newGrid[currentKey] = _objectSpread$O(_objectSpread$O({}, newGrid[currentKey]), {}, {
         colSpan: newGrid[currentKey].colSpan + 1
       });
       delete newGrid[nextKey];
@@ -13101,8 +13024,8 @@ function GridEditor(_ref) {
     var currentKey = "".concat(row, ".").concat(col);
     var belowKey = "".concat(row + 1, ".").concat(col);
     if (grid[belowKey]) {
-      var newGrid = _objectSpread$N({}, grid);
-      newGrid[currentKey] = _objectSpread$N(_objectSpread$N({}, newGrid[currentKey]), {}, {
+      var newGrid = _objectSpread$O({}, grid);
+      newGrid[currentKey] = _objectSpread$O(_objectSpread$O({}, newGrid[currentKey]), {}, {
         rowSpan: newGrid[currentKey].rowSpan + 1
       });
       delete newGrid[belowKey];
@@ -13119,7 +13042,7 @@ function GridEditor(_ref) {
   var splitCell = function splitCell(row, col) {
     var key = "".concat(row, ".").concat(col);
     var cell = grid[key];
-    var newGrid = _objectSpread$N({}, grid);
+    var newGrid = _objectSpread$O({}, grid);
 
     // we have to check the colspan, and since the colspan is greater than 1
     // Only handle horizontal split if colSpan > 1
@@ -13135,13 +13058,13 @@ function GridEditor(_ref) {
         var oldKey = "".concat(row, ".").concat(c);
         var newKey = "".concat(row, ".").concat(c + 1);
         if (newGrid[oldKey]) {
-          newGrid[newKey] = _objectSpread$N({}, newGrid[oldKey]);
+          newGrid[newKey] = _objectSpread$O({}, newGrid[oldKey]);
           delete newGrid[oldKey];
         }
       }
 
       // Update the original cell's colSpan
-      newGrid[key] = _objectSpread$N(_objectSpread$N({}, cell), {}, {
+      newGrid[key] = _objectSpread$O(_objectSpread$O({}, cell), {}, {
         colSpan: cell.colSpan - 1
       });
 
@@ -13153,7 +13076,7 @@ function GridEditor(_ref) {
       };
     }
     if (cell.rowSpan > 1) {
-      newGrid[key] = _objectSpread$N(_objectSpread$N({}, newGrid[key]), {}, {
+      newGrid[key] = _objectSpread$O(_objectSpread$O({}, newGrid[key]), {}, {
         rowSpan: cell.rowSpan - 1
       });
       newGrid["".concat(row + 1, ".").concat(col)] = {
@@ -13272,7 +13195,7 @@ function GridEditor(_ref) {
     var fromKey = "".concat(from.row, ".").concat(from.col);
     var toKey = "".concat(to.row, ".").concat(to.col);
     if (fromKey === toKey) return;
-    var newGrid = _objectSpread$N({}, grid);
+    var newGrid = _objectSpread$O({}, grid);
 
     // Swap the cells
     var temp = newGrid[fromKey];
@@ -13298,7 +13221,7 @@ function GridEditor(_ref) {
     // console.log("Grid updated:", sequencedGrid);
   }
   function resetGridLayout() {
-    var newGrid = _objectSpread$N({}, defaultGrid);
+    var newGrid = _objectSpread$O({}, defaultGrid);
     setGrid(newGrid);
     onUpdate(newGrid);
   }
@@ -13576,8 +13499,8 @@ var PanelEditItemGrid = function PanelEditItemGrid(_ref) {
   });
 };
 
-function ownKeys$M(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$M(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$M(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$M(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$N(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$N(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$N(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$N(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var PanelEditItemNotifications = function PanelEditItemNotifications(_ref) {
   var item = _ref.item;
     _ref.workspace;
@@ -13600,7 +13523,7 @@ var PanelEditItemNotifications = function PanelEditItemNotifications(_ref) {
   }, [widgetUuid, notificationDefs.length]);
   function handleNotifToggle(typeKey, value) {
     var _window$mainApi2;
-    var updated = _objectSpread$M(_objectSpread$M({}, notifPrefs), {}, _defineProperty({}, typeKey, value));
+    var updated = _objectSpread$N(_objectSpread$N({}, notifPrefs), {}, _defineProperty({}, typeKey, value));
     setNotifPrefs(updated);
     if ((_window$mainApi2 = window.mainApi) !== null && _window$mainApi2 !== void 0 && (_window$mainApi2 = _window$mainApi2.notifications) !== null && _window$mainApi2 !== void 0 && _window$mainApi2.setPreferences && widgetUuid) {
       window.mainApi.notifications.setPreferences(widgetUuid, _defineProperty({}, typeKey, value));
@@ -13645,8 +13568,8 @@ var PanelEditItemNotifications = function PanelEditItemNotifications(_ref) {
 function _createForOfIteratorHelper$n(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray$n(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$n(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$n(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$n(r, a) : void 0; } }
 function _arrayLikeToArray$n(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; }
-function ownKeys$L(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$L(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$L(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$L(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$M(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$M(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$M(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$M(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DAYS = [{
   key: "mon",
   label: "Mon"
@@ -13747,7 +13670,7 @@ function TaskScheduleEditor(_ref) {
     var _window$mainApi;
     var overrides = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     if (!((_window$mainApi = window.mainApi) !== null && _window$mainApi !== void 0 && (_window$mainApi = _window$mainApi.scheduler) !== null && _window$mainApi !== void 0 && _window$mainApi.registerTask)) return;
-    var payload = _objectSpread$L({
+    var payload = _objectSpread$M({
       widgetId: widgetId,
       widgetName: widgetName,
       workspaceId: workspaceId || "",
@@ -14368,11 +14291,147 @@ var PanelEditItemHandlers = function PanelEditItemHandlers(_ref) {
   });
 };
 
+var getUserConfigurableProviders = function getUserConfigurableProviders(providers) {
+  if (!providers) return [];
+  return providers.filter(function (p) {
+    return p.providerClass !== "api";
+  });
+};
+
+function ownKeys$L(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$L(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$L(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$L(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var PanelEditItemProviders = function PanelEditItemProviders(_ref) {
+  var workspace = _ref.workspace,
+    onUpdate = _ref.onUpdate,
+    _ref$item = _ref.item,
+    item = _ref$item === void 0 ? null : _ref$item;
+  var appCtx = React.useContext(AppContext);
+  var appProviders = (appCtx === null || appCtx === void 0 ? void 0 : appCtx.providers) || {};
+  var _useState = React.useState(item),
+    _useState2 = _slicedToArray(_useState, 2),
+    itemSelected = _useState2[0],
+    setItemSelected = _useState2[1];
+  var _useState3 = React.useState(workspace),
+    _useState4 = _slicedToArray(_useState3, 2),
+    workspaceSelected = _useState4[0],
+    setWorkspaceSelected = _useState4[1];
+  React.useEffect(function () {
+    if (!deepEqual$1(item, itemSelected)) setItemSelected(function () {
+      return item;
+    });
+    if (!deepEqual$1(workspace, workspaceSelected)) setWorkspaceSelected(function () {
+      return workspace;
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [workspace, item]);
+  if (!itemSelected || !workspaceSelected) return null;
+  var widgetConfig = ComponentManager.config(itemSelected.component, itemSelected);
+  var declaredProviders = Array.isArray(widgetConfig === null || widgetConfig === void 0 ? void 0 : widgetConfig.providers) ? widgetConfig.providers : Array.isArray(itemSelected === null || itemSelected === void 0 ? void 0 : itemSelected.providers) ? itemSelected.providers : [];
+  var providerRequirements = getUserConfigurableProviders(declaredProviders);
+  var selectedProviders = itemSelected.selectedProviders || {};
+  function handleProviderChange(providerType, providerName) {
+    var updatedItem = DashReact.deepCopy(itemSelected);
+    var nextProviders = _objectSpread$L({}, updatedItem.selectedProviders || {});
+    if (providerName) {
+      nextProviders[providerType] = providerName;
+    } else {
+      delete nextProviders[providerType];
+    }
+    updatedItem.selectedProviders = nextProviders;
+    var updatedWorkspace = DashReact.deepCopy(workspaceSelected);
+    updatedWorkspace.layout = replaceItemInLayout(updatedWorkspace.layout, updatedItem.id, updatedItem);
+    setItemSelected(function () {
+      return updatedItem;
+    });
+    setWorkspaceSelected(function () {
+      return updatedWorkspace;
+    });
+    onUpdate(updatedItem, updatedWorkspace);
+  }
+  if (providerRequirements.length === 0) {
+    return /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "flex items-center justify-center h-full text-sm opacity-60 text-center px-6",
+      children: "This widget doesn't declare any providers."
+    });
+  }
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "flex flex-col flex-1 min-h-0 overflow-y-auto p-6 space-y-4",
+    children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "text-sm opacity-70",
+      children: "Bind each required provider so the widget can connect to its data source. Changes save immediately."
+    }), /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "space-y-3",
+      children: providerRequirements.map(function (req) {
+        var type = req.type;
+        var current = selectedProviders[type] || "";
+        var options = Object.entries(appProviders).filter(function (_ref2) {
+          var _ref3 = _slicedToArray(_ref2, 2),
+            p = _ref3[1];
+          return p && p.type === type;
+        }).map(function (_ref4) {
+          var _ref5 = _slicedToArray(_ref4, 2),
+            name = _ref5[0],
+            p = _ref5[1];
+          return _objectSpread$L({
+            name: name
+          }, p);
+        });
+        var isConfigured = !!current;
+        var isMissing = req.required && !isConfigured;
+        return /*#__PURE__*/jsxRuntime.jsxs("div", {
+          className: "rounded border px-3 py-2 ".concat(isMissing ? "bg-red-900 border-red-500" : "bg-gray-800 border-gray-700"),
+          children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "flex items-center gap-2",
+            children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+              className: "text-sm font-medium ".concat(isMissing ? "text-red-100" : "text-gray-100"),
+              children: type
+            }), /*#__PURE__*/jsxRuntime.jsx("span", {
+              className: "text-[10px] uppercase tracking-wide px-1.5 py-0.5 rounded font-semibold ".concat(isMissing ? "bg-red-600 text-white" : req.required ? "bg-indigo-800 text-indigo-100" : "bg-gray-700 text-gray-300"),
+              children: req.required ? "required" : "optional"
+            })]
+          }), req.description && /*#__PURE__*/jsxRuntime.jsx("div", {
+            className: "text-xs opacity-60 mt-1",
+            children: req.description
+          }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "mt-2",
+            children: [/*#__PURE__*/jsxRuntime.jsxs("select", {
+              value: current,
+              onChange: function onChange(e) {
+                return handleProviderChange(type, e.target.value);
+              },
+              className: "w-full bg-gray-900 border rounded px-2 py-1.5 text-sm ".concat(isMissing ? "border-red-500" : "border-gray-700"),
+              children: [/*#__PURE__*/jsxRuntime.jsx("option", {
+                value: "",
+                children: req.required ? "— select a provider —" : "— none —"
+              }), options.map(function (opt) {
+                return /*#__PURE__*/jsxRuntime.jsx("option", {
+                  value: opt.name,
+                  children: opt.name
+                }, opt.name);
+              })]
+            }), options.length === 0 && /*#__PURE__*/jsxRuntime.jsxs("div", {
+              className: "mt-1 text-[11px] text-amber-300",
+              children: ["No ", type, " providers configured. Add one in Settings > Providers."]
+            })]
+          })]
+        }, type);
+      })
+    })]
+  });
+};
+
 var getSections = function getSections(item) {
   var _widgetConfig$notific, _widgetConfig$schedul;
   var widgetConfig = item ? ComponentManager.config(item.component, item) : null;
   var hasNotifications = (widgetConfig === null || widgetConfig === void 0 || (_widgetConfig$notific = widgetConfig.notifications) === null || _widgetConfig$notific === void 0 ? void 0 : _widgetConfig$notific.length) > 0;
   var hasScheduledTasks = (widgetConfig === null || widgetConfig === void 0 || (_widgetConfig$schedul = widgetConfig.scheduledTasks) === null || _widgetConfig$schedul === void 0 ? void 0 : _widgetConfig$schedul.length) > 0;
+  // Show the Providers section whenever the widget declares any
+  // user-configurable providers. Previously provider selection lived
+  // inline in the card header dropdown; this moves it into the
+  // widget config modal so the header stays uncluttered and there's
+  // room for richer per-provider UX.
+  var declaredProviders = Array.isArray(widgetConfig === null || widgetConfig === void 0 ? void 0 : widgetConfig.providers) ? widgetConfig.providers : Array.isArray(item === null || item === void 0 ? void 0 : item.providers) ? item.providers : [];
+  var userConfigurableProviders = getUserConfigurableProviders(declaredProviders);
   return [{
     key: "edit",
     label: "Settings",
@@ -14393,6 +14452,10 @@ var getSections = function getSections(item) {
     key: "handlers",
     label: "Listeners",
     icon: "phone"
+  }] : []), _toConsumableArray(userConfigurableProviders.length > 0 ? [{
+    key: "providers",
+    label: "Providers",
+    icon: "plug"
   }] : []), [{
     key: "code",
     label: "Code",
@@ -14515,6 +14578,10 @@ var LayoutBuilderConfigModal = function LayoutBuilderConfigModal(_ref) {
         item: itemSelected,
         onUpdate: handleEditChange,
         workspace: workspaceSelected
+      }), activeSection === "providers" && /*#__PURE__*/jsxRuntime.jsx(PanelEditItemProviders, {
+        item: itemSelected,
+        onUpdate: handleEditChange,
+        workspace: workspaceSelected
       }), activeSection === "code" && /*#__PURE__*/jsxRuntime.jsx(PanelCode, {
         item: itemSelected,
         onUpdate: handleEditChange,
@@ -16830,13 +16897,6 @@ function mcpJsonToFormState(jsonString, nextRowId) {
   return result;
 }
 
-var getUserConfigurableProviders = function getUserConfigurableProviders(providers) {
-  if (!providers) return [];
-  return providers.filter(function (p) {
-    return p.providerClass !== "api";
-  });
-};
-
 function _createForOfIteratorHelper$m(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray$m(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$m(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$m(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$m(r, a) : void 0; } }
 function _arrayLikeToArray$m(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; }
@@ -18710,13 +18770,12 @@ var WidgetCardHeader = function WidgetCardHeader(_ref) {
   var item = _ref.item,
     widget = _ref.widget,
     _ref$cellNumber = _ref.cellNumber,
-    cellNumber = _ref$cellNumber === void 0 ? null : _ref$cellNumber,
-    _ref$providers = _ref.providers,
-    providers = _ref$providers === void 0 ? [] : _ref$providers,
-    _ref$selectedProvider = _ref.selectedProviders,
-    selectedProviders = _ref$selectedProvider === void 0 ? {} : _ref$selectedProvider,
-    onProviderChange = _ref.onProviderChange,
-    onConfigure = _ref.onConfigure,
+    cellNumber = _ref$cellNumber === void 0 ? null : _ref$cellNumber;
+    _ref.providers;
+    var _ref$selectedProvider = _ref.selectedProviders,
+    selectedProviders = _ref$selectedProvider === void 0 ? {} : _ref$selectedProvider;
+    _ref.onProviderChange;
+    var onConfigure = _ref.onConfigure,
     onDelete = _ref.onDelete,
     onRemove = _ref.onRemove,
     _ref$onSplitHorizonta = _ref.onSplitHorizontal,
@@ -18770,29 +18829,13 @@ var WidgetCardHeader = function WidgetCardHeader(_ref) {
   };
   var providerRequirements = getProviderRequirements();
 
-  // Get providers filtered by type
-  var getProvidersForType = function getProvidersForType(type) {
-    return providers.filter(function (p) {
-      return p.type === type;
-    });
-  };
-
-  // Check if provider is configured
+  // Check if provider is configured — used only for the amber-dot
+  // indicator now. Actual provider editing lives in the config
+  // modal's Providers section (opened via the "Providers" menu item).
   var isProviderConfigured = function isProviderConfigured(providerType) {
     return selectedProviders[providerType] != null;
   };
 
-  // Handle provider selection
-  var handleProviderSelect = function handleProviderSelect(providerType, providerId) {
-    if (providerId === "_new") {
-      onProviderChange(providerType, null, true); // true = create new
-    } else if (providerId === "_unset") {
-      onProviderChange(providerType, null, false); // unset — no provider
-    } else {
-      onProviderChange(providerType, providerId);
-    }
-  };
-
   // True when any required provider lacks a selection — drives the
   // amber dot on the overflow button so the user can see unresolved
   // state at a glance without opening the menu.
@@ -18800,8 +18843,12 @@ var WidgetCardHeader = function WidgetCardHeader(_ref) {
     return req.required && !isProviderConfigured(req.type);
   });
 
-  // Build overflow actions list — single source of truth for both
-  // the dropdown items and any future quick-access surface.
+  // Build overflow actions list — single source of truth for the
+  // dropdown items. Provider editing used to live inline in this
+  // menu as dropdowns per provider; that's moved to the widget
+  // config modal under a "Providers" section, so here we just show
+  // a "Providers" entry (when the widget declares any) that opens
+  // the modal pre-selected on that section.
   var overflowActions = [];
   if (onConfigure) {
     overflowActions.push({
@@ -18813,6 +18860,27 @@ var WidgetCardHeader = function WidgetCardHeader(_ref) {
       }
     });
   }
+  if (onConfigure && providerRequirements.length > 0) {
+    overflowActions.push({
+      icon: "plug",
+      label: "Providers",
+      badge: hasUnresolvedRequiredProvider ? "!" : null,
+      onClick: function onClick() {
+        onConfigure(widgetItem, "providers");
+        setShowOverflowMenu(false);
+      }
+    });
+  }
+  if (onConfigure) {
+    overflowActions.push({
+      icon: "phone",
+      label: "Listeners",
+      onClick: function onClick() {
+        onConfigure(widgetItem, "handlers");
+        setShowOverflowMenu(false);
+      }
+    });
+  }
   if (onEditWithAI && widgetItem) {
     overflowActions.push({
       icon: "wand-magic-sparkles",
@@ -18907,7 +18975,7 @@ var WidgetCardHeader = function WidgetCardHeader(_ref) {
           className: "absolute top-1 right-1 h-2 w-2 rounded-full bg-amber-400 border border-black pointer-events-none",
           title: "Required provider not set"
         })]
-      }), /*#__PURE__*/jsxRuntime.jsxs(DashReact.DropdownPanel, {
+      }), /*#__PURE__*/jsxRuntime.jsx(DashReact.DropdownPanel, {
         isOpen: showOverflowMenu,
         onClose: function onClose() {
           return setShowOverflowMenu(false);
@@ -18915,71 +18983,21 @@ var WidgetCardHeader = function WidgetCardHeader(_ref) {
         position: "absolute top-full right-0 mt-1",
         portal: true,
         align: "right",
-        children: [providerRequirements.length > 0 && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.DropdownPanel.Header, {
-            children: "Providers"
-          }), providerRequirements.map(function (providerReq) {
-            var providerType = providerReq.type;
-            var availableProviders = getProvidersForType(providerType);
-            var selectedProviderId = selectedProviders[providerType] || "";
-            var isConfigured = isProviderConfigured(providerType);
-            return /*#__PURE__*/jsxRuntime.jsxs("div", {
-              className: "px-3 py-2 text-xs",
-              onClick: function onClick(e) {
-                return e.stopPropagation();
-              },
-              children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
-                className: "flex items-center gap-2 mb-1",
-                children: [/*#__PURE__*/jsxRuntime.jsx("span", {
-                  className: "font-medium text-gray-200",
-                  children: providerType
-                }), providerReq.required && !isConfigured && /*#__PURE__*/jsxRuntime.jsx("span", {
-                  className: "text-[10px] text-amber-300 uppercase tracking-wide",
-                  children: "required"
-                })]
-              }), /*#__PURE__*/jsxRuntime.jsxs("select", {
-                value: selectedProviderId,
-                onChange: function onChange(e) {
-                  var v = e.target.value;
-                  if (v === "_new") {
-                    handleProviderSelect(providerType, "_new");
-                  } else if (v === "") {
-                    handleProviderSelect(providerType, "_unset");
-                  } else {
-                    handleProviderSelect(providerType, v);
-                  }
-                },
-                className: "w-full bg-gray-800 border border-gray-700 text-gray-100 text-xs rounded px-2 py-1",
-                children: [/*#__PURE__*/jsxRuntime.jsx("option", {
-                  value: "",
-                  children: providerReq.required ? "— select provider —" : "— none —"
-                }), availableProviders.map(function (provider) {
-                  return /*#__PURE__*/jsxRuntime.jsx("option", {
-                    value: provider.id,
-                    children: provider.name
-                  }, provider.id);
-                }), /*#__PURE__*/jsxRuntime.jsx("option", {
-                  value: "_new",
-                  children: "+ Create new\u2026"
-                })]
-              })]
-            }, providerType);
-          }), overflowActions.length > 0 && /*#__PURE__*/jsxRuntime.jsx(DashReact.DropdownPanel.Divider, {})]
-        }), overflowActions.length > 0 && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.DropdownPanel.Header, {
-            children: "Actions"
-          }), overflowActions.map(function (action) {
-            return /*#__PURE__*/jsxRuntime.jsxs(DashReact.MenuItem2, {
-              onClick: action.onClick,
-              children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
-                icon: action.icon,
-                className: "w-4 text-center opacity-60"
-              }), /*#__PURE__*/jsxRuntime.jsx("span", {
-                children: action.label
-              })]
-            }, action.label);
-          })]
-        })]
+        children: overflowActions.map(function (action) {
+          return /*#__PURE__*/jsxRuntime.jsxs(DashReact.MenuItem2, {
+            onClick: action.onClick,
+            children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+              icon: action.icon,
+              className: "w-4 text-center opacity-60"
+            }), /*#__PURE__*/jsxRuntime.jsx("span", {
+              className: "flex-1",
+              children: action.label
+            }), action.badge && /*#__PURE__*/jsxRuntime.jsx("span", {
+              className: "ml-auto text-[10px] font-bold text-amber-300",
+              children: action.badge
+            })]
+          }, action.label);
+        })
       })]
     })]
   });
@@ -22309,8 +22327,8 @@ var WidgetContainerGridItem = function WidgetContainerGridItem(_ref) {
   function handleChangeOrder(direction) {
     onChangeOrder(item, direction);
   }
-  function handleOpenConfig() {
-    onOpenConfig(item);
+  function handleOpenConfig(widgetItem, section) {
+    onOpenConfig(item, section);
   }
   function handleProviderChange(providerType, providerId) {
     var createNew = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
@@ -22617,8 +22635,8 @@ var LayoutBuilderGridItem = function LayoutBuilderGridItem(_ref) {
   function handleChangeOrder(direction) {
     onChangeOrder(item, direction);
   }
-  function handleOpenConfig() {
-    onOpenConfig(item);
+  function handleOpenConfig(widgetItem, section) {
+    onOpenConfig(item, section);
   }
   function renderArrows() {
     return preview === false && /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -25555,8 +25573,8 @@ var LayoutGridContainer = /*#__PURE__*/React.memo(function (_ref3) {
             }
           }
         } : undefined,
-        onConfigure: cellComponent ? function () {
-          if (onOpenConfig) onOpenConfig(cellComponent);
+        onConfigure: cellComponent ? function (widgetItem, section) {
+          if (onOpenConfig) onOpenConfig(cellComponent, section);
         } : undefined,
         onDelete: cellComponent ? function () {
           if (onClickRemove) onClickRemove(cellComponent.id);
@@ -60288,6 +60306,7 @@ exports.PanelCode = PanelCode;
 exports.PanelEditItem = PanelEditItem;
 exports.PanelEditItemHandlers = PanelEditItemHandlers;
 exports.PanelEditItemNotifications = PanelEditItemNotifications;
+exports.PanelEditItemProviders = PanelEditItemProviders;
 exports.PinnedSidebar = PinnedSidebar;
 exports.ProviderContext = ProviderContext;
 exports.ProviderErrorBoundary = ProviderErrorBoundary;