@trops/dash-core 0.1.180 → 0.1.182

package/dist/index.esm.js

@@ -33223,8 +33223,21 @@ var ThemeQuickCreate = function ThemeQuickCreate(_ref8) {
     _ref8$onExtract = _ref8.onExtract,
     onExtract = _ref8$onExtract === void 0 ? null : _ref8$onExtract,
     _ref8$onMapToTheme = _ref8.onMapToTheme,
-    onMapToTheme = _ref8$onMapToTheme === void 0 ? null : _ref8$onMapToTheme;
+    onMapToTheme = _ref8$onMapToTheme === void 0 ? null : _ref8$onMapToTheme,
+    _ref8$initialMethod = _ref8.initialMethod,
+    initialMethod = _ref8$initialMethod === void 0 ? null : _ref8$initialMethod;
   var canCreate = wizardName.trim().length > 0 && wizardTheme !== null;
+  var showMethodPicker = initialMethod === null;
+  useEffect(function () {
+    if (initialMethod && wizardMethod !== initialMethod) {
+      setWizardMethod(initialMethod);
+      setWizardTheme(null);
+      if (initialMethod === "random") {
+        setWizardTheme(generateRandomTheme());
+      }
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [initialMethod]);
   function handleMethodSelect(method) {
     setWizardMethod(method);
     setWizardTheme(null);
@@ -33246,7 +33259,7 @@ var ThemeQuickCreate = function ThemeQuickCreate(_ref8) {
         },
         placeholder: "Theme name..."
       })]
-    }), /*#__PURE__*/jsxs("div", {
+    }), showMethodPicker && /*#__PURE__*/jsxs("div", {
       className: "flex flex-col gap-2",
       children: [/*#__PURE__*/jsx("span", {
         className: "text-sm font-semibold opacity-50",
@@ -33344,9 +33357,7 @@ var ChooserCard = function ChooserCard(_ref) {
 };
 var ThemeNewChooser = function ThemeNewChooser(_ref2) {
   var onSearchThemes = _ref2.onSearchThemes,
-    onCreateNew = _ref2.onCreateNew,
-    _ref2$onCreateFromUrl = _ref2.onCreateFromUrl,
-    onCreateFromUrl = _ref2$onCreateFromUrl === void 0 ? null : _ref2$onCreateFromUrl;
+    onSelectMethod = _ref2.onSelectMethod;
   return /*#__PURE__*/jsxs("div", {
     className: "flex flex-col gap-6 p-6 overflow-y-auto flex-1 min-h-0",
     children: [/*#__PURE__*/jsx("span", {
@@ -33356,19 +33367,37 @@ var ThemeNewChooser = function ThemeNewChooser(_ref2) {
       className: "grid grid-cols-2 gap-3",
       children: [/*#__PURE__*/jsx(ChooserCard, {
         icon: "magnifying-glass",
-        title: "Search for Themes",
-        subtitle: "Browse the theme marketplace",
+        title: "Search Marketplace",
+        subtitle: "Browse community themes",
         onClick: onSearchThemes
       }), /*#__PURE__*/jsx(ChooserCard, {
-        icon: "wand-magic-sparkles",
-        title: "Create New",
-        subtitle: "Build from presets, random palettes, or color harmony rules",
-        onClick: onCreateNew
-      }), onCreateFromUrl && /*#__PURE__*/jsx(ChooserCard, {
+        icon: "swatchbook",
+        title: "From Presets",
+        subtitle: "Start from a curated preset",
+        onClick: function onClick() {
+          return onSelectMethod("presets");
+        }
+      }), /*#__PURE__*/jsx(ChooserCard, {
+        icon: "droplet",
+        title: "From Colors",
+        subtitle: "Build from a color palette",
+        onClick: function onClick() {
+          return onSelectMethod("color");
+        }
+      }), /*#__PURE__*/jsx(ChooserCard, {
+        icon: "shuffle",
+        title: "From Random",
+        subtitle: "Generate a random theme",
+        onClick: function onClick() {
+          return onSelectMethod("random");
+        }
+      }), /*#__PURE__*/jsx(ChooserCard, {
         icon: "globe",
         title: "From Website",
-        subtitle: "Extract colors from any URL to create a theme",
-        onClick: onCreateFromUrl
+        subtitle: "Extract colors from any URL",
+        onClick: function onClick() {
+          return onSelectMethod("from-url");
+        }
       })]
     })]
   });
@@ -34056,10 +34085,10 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
     _useState12 = _slicedToArray(_useState11, 2),
     isSearching = _useState12[0],
     setIsSearching = _useState12[1];
-  var _useState13 = useState(false),
+  var _useState13 = useState(null),
     _useState14 = _slicedToArray(_useState13, 2),
-    isFromUrl = _useState14[0],
-    setIsFromUrl = _useState14[1];
+    selectedMethod = _useState14[0],
+    setSelectedMethod = _useState14[1];
   var _useState15 = useState(""),
     _useState16 = _slicedToArray(_useState15, 2),
     wizardName = _useState16[0],
@@ -34087,7 +34116,7 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
       setIsCreating(false);
       setIsChoosingMode(false);
       setIsSearching(false);
-      setIsFromUrl(false);
+      setSelectedMethod(null);
     } else {
       if (themeKeySelected === null && themes) {
         var themeKeyTemp = settings && "theme" in settings ? settings["theme"] in themes ? settings["theme"] : Object.keys(themes)[0] : Object.keys(themes)[0];
@@ -34130,10 +34159,12 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
     setIsCreating(false);
     setIsSearching(false);
     setIsEditing(false);
+    setSelectedMethod(null);
   }
-  function handleChooseCreate() {
+  function handleSelectMethod(method) {
     setIsChoosingMode(false);
     setIsCreating(true);
+    setSelectedMethod(method);
     setWizardName("");
     setWizardMethod(null);
     setWizardTheme(null);
@@ -34142,10 +34173,6 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
     setIsChoosingMode(false);
     setIsSearching(true);
   }
-  function handleChooseFromUrl() {
-    setIsChoosingMode(false);
-    setIsFromUrl(true);
-  }
   function handleBackFromSearch() {
     setIsSearching(false);
     setIsChoosingMode(true);
@@ -34204,24 +34231,6 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
     }));
     return _handleUrlMapToTheme.apply(this, arguments);
   }
-  function handleUrlThemeGenerated(theme) {
-    var key = theme.id || "theme-".concat(Date.now());
-    var finalTheme = _objectSpread$c(_objectSpread$c({}, theme), {}, {
-      id: key
-    });
-    if (dashApi) {
-      dashApi.saveTheme(credentials.appId, key, finalTheme, function (e, message) {
-        changeThemesForApplication(message["themes"]);
-        setIsFromUrl(false);
-        var newThemes = message["themes"];
-        if (newThemes && newThemes[key]) {
-          setThemeKeySelected(key);
-          setThemeSelected(newThemes[key]);
-          setRawThemeSelected(finalTheme);
-        }
-      }, handleSaveThemeError);
-    }
-  }
   function handleWizardComplete() {
     if (!wizardTheme || !wizardName.trim()) return;
     var key = wizardTheme.id || "theme-".concat(Date.now());
@@ -34234,6 +34243,7 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
         changeThemesForApplication(message["themes"]);
         setIsCreating(false);
         setIsEditing(false);
+        setSelectedMethod(null);
         var newThemes = message["themes"];
         if (newThemes && newThemes[key]) {
           setThemeKeySelected(key);
@@ -34247,7 +34257,7 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
     setIsCreating(false);
     setIsChoosingMode(false);
     setIsSearching(false);
-    setIsFromUrl(false);
+    setSelectedMethod(null);
   }
   function handleSaveTheme() {
     if (themeKeySelected !== null && rawThemeSelected !== null) {
@@ -34302,6 +34312,7 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
     setThemeSelected(null);
     setIsEditing(false);
   }
+  var isInWizardFlow = isCreating || isChoosingMode || isSearching;
   return /*#__PURE__*/jsx(Modal, {
     isOpen: open,
     setIsOpen: setIsOpen,
@@ -34326,8 +34337,7 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
               rawTheme: rawThemeSelected,
               wizardContent: isChoosingMode ? /*#__PURE__*/jsx(ThemeNewChooser, {
                 onSearchThemes: handleChooseSearch,
-                onCreateNew: handleChooseCreate,
-                onCreateFromUrl: handleChooseFromUrl
+                onSelectMethod: handleSelectMethod
               }) : isSearching ? /*#__PURE__*/jsx(DiscoverThemesDetail, {
                 onBack: handleBackFromSearch,
                 appId: credentials === null || credentials === void 0 ? void 0 : credentials.appId,
@@ -34348,12 +34358,9 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
                 wizardTheme: wizardTheme,
                 setWizardTheme: setWizardTheme,
                 onComplete: handleWizardComplete,
-                onExtract: handleUrlExtract,
-                onMapToTheme: handleUrlMapToTheme
-              }) : isFromUrl ? /*#__PURE__*/jsx(ThemeFromUrlPane, {
                 onExtract: handleUrlExtract,
                 onMapToTheme: handleUrlMapToTheme,
-                onGenerate: handleUrlThemeGenerated
+                initialMethod: selectedMethod
               }) : null
             }), !isCreating && themeSelected && isEditing === true && /*#__PURE__*/jsx(PanelTheme, {
               theme: themeSelected,
@@ -34374,13 +34381,13 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
                 children: themeKeySelected
               })]
             })
-          }), (isCreating || isChoosingMode || isSearching || isFromUrl) && /*#__PURE__*/jsx("div", {
+          }), isInWizardFlow && /*#__PURE__*/jsx("div", {
             className: "flex flex-row space-x-2",
             children: /*#__PURE__*/jsx(Button, {
               onClick: handleCancelCreate,
               title: "Cancel"
             })
-          }), !isCreating && !isChoosingMode && !isSearching && !isFromUrl && isEditing === false && /*#__PURE__*/jsxs("div", {
+          }), !isInWizardFlow && isEditing === false && /*#__PURE__*/jsxs("div", {
             className: "flex flex-row space-x-2",
             children: [/*#__PURE__*/jsx(Button, {
               onClick: function onClick() {
@@ -34399,7 +34406,7 @@ var ThemeManagerModal = function ThemeManagerModal(_ref) {
               onClick: handleActivateTheme,
               title: "Activate"
             })]
-          }), !isCreating && !isChoosingMode && !isSearching && !isFromUrl && isEditing === true && /*#__PURE__*/jsxs("div", {
+          }), !isInWizardFlow && isEditing === true && /*#__PURE__*/jsxs("div", {
             className: "flex flex-row space-x-2",
             children: [/*#__PURE__*/jsx(Button, {
               onClick: function onClick() {
@@ -38587,6 +38594,16 @@ var WebSocketProviderForm = function WebSocketProviderForm(_ref) {
     _useState10 = _slicedToArray(_useState1, 2),
     errors = _useState10[0],
     setErrors = _useState10[1];
+  var _useState11 = useState(false),
+    _useState12 = _slicedToArray(_useState11, 2),
+    isWsTesting = _useState12[0],
+    setIsWsTesting = _useState12[1];
+  var _useState13 = useState(null),
+    _useState14 = _slicedToArray(_useState13, 2),
+    wsTestResult = _useState14[0],
+    setWsTestResult = _useState14[1];
+  var appContext = useContext(AppContext);
+  var dashApi = appContext === null || appContext === void 0 ? void 0 : appContext.dashApi;
   var nextRowIdRef = useRef(0);
   var nextRowId = function nextRowId() {
     return "ws_hdr_".concat(++nextRowIdRef.current);
@@ -38676,6 +38693,92 @@ var WebSocketProviderForm = function WebSocketProviderForm(_ref) {
       });
     });
   }
+  function handleTestConnection() {
+    return _handleTestConnection.apply(this, arguments);
+  }
+  function _handleTestConnection() {
+    _handleTestConnection = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var headers, _iterator4, _step4, row, subprotoArray, testName, startTime, result, latency, _t;
+      return _regeneratorRuntime.wrap(function (_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (!(!(dashApi !== null && dashApi !== void 0 && dashApi.webSocket) || !url.trim() || !isValidWsUrl(url))) {
+              _context.next = 1;
+              break;
+            }
+            return _context.abrupt("return");
+          case 1:
+            setIsWsTesting(true);
+            setWsTestResult(null);
+
+            // Build config from current form state (same as handleSave)
+            headers = {};
+            _iterator4 = _createForOfIteratorHelper$4(headerRows);
+            try {
+              for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
+                row = _step4.value;
+                if (row.key.trim()) {
+                  headers[row.key.trim()] = row.value;
+                }
+              }
+            } catch (err) {
+              _iterator4.e(err);
+            } finally {
+              _iterator4.f();
+            }
+            subprotoArray = subprotocols.split(",").map(function (s) {
+              return s.trim();
+            }).filter(Boolean);
+            testName = name.trim() || "__ws_test__";
+            startTime = Date.now();
+            _context.prev = 2;
+            _context.next = 3;
+            return dashApi.webSocket.connect(testName, {
+              url: url.trim(),
+              headers: Object.keys(headers).length > 0 ? headers : null,
+              subprotocols: subprotoArray.length > 0 ? subprotoArray : null,
+              credentials: Object.keys(credentials).length > 0 ? credentials : null
+            });
+          case 3:
+            result = _context.sent;
+            latency = Date.now() - startTime;
+            if (!result.error) {
+              _context.next = 4;
+              break;
+            }
+            setWsTestResult({
+              success: false,
+              message: result.message || "Connection failed"
+            });
+            _context.next = 5;
+            break;
+          case 4:
+            setWsTestResult({
+              success: true,
+              message: "Connected in ".concat(latency, "ms")
+            });
+            _context.next = 5;
+            return dashApi.webSocket.disconnect(testName)["catch"](function () {});
+          case 5:
+            _context.next = 7;
+            break;
+          case 6:
+            _context.prev = 6;
+            _t = _context["catch"](2);
+            setWsTestResult({
+              success: false,
+              message: (_t === null || _t === void 0 ? void 0 : _t.message) || "Connection failed"
+            });
+          case 7:
+            setIsWsTesting(false);
+          case 8:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee, null, [[2, 6]]);
+    }));
+    return _handleTestConnection.apply(this, arguments);
+  }
   return /*#__PURE__*/jsxs("div", {
     className: "flex flex-col flex-1 min-h-0",
     children: [/*#__PURE__*/jsxs("div", {
@@ -38694,7 +38797,7 @@ var WebSocketProviderForm = function WebSocketProviderForm(_ref) {
             return setName(value);
           },
           placeholder: "e.g., crypto-ws, stock-feed",
-          error: !!errors.name
+          inputClassName: errors.name ? "border-red-500" : ""
         }), errors.name && /*#__PURE__*/jsx("span", {
           className: "text-xs text-red-400",
           children: errors.name
@@ -38710,7 +38813,7 @@ var WebSocketProviderForm = function WebSocketProviderForm(_ref) {
             return setUrl(value);
           },
           placeholder: "wss://api.example.com/ws or ws://localhost:8080",
-          error: !!errors.url
+          inputClassName: errors.url ? "border-red-500" : ""
         }), errors.url && /*#__PURE__*/jsx("span", {
           className: "text-xs text-red-400",
           children: errors.url
@@ -38818,17 +38921,32 @@ var WebSocketProviderForm = function WebSocketProviderForm(_ref) {
                 });
               },
               placeholder: "Enter ".concat(field),
-              error: !!errors["cred_".concat(field)]
+              inputClassName: errors["cred_".concat(field)] ? "border-red-500" : ""
             }), errors["cred_".concat(field)] && /*#__PURE__*/jsx("span", {
               className: "text-xs text-red-400",
               children: errors["cred_".concat(field)]
             })]
           }, field);
         })]
+      }), wsTestResult && /*#__PURE__*/jsx("div", {
+        className: "p-3 rounded-lg text-sm ".concat(wsTestResult.success ? "bg-green-900/30 border border-green-700 text-green-300" : "bg-red-900/30 border border-red-700 text-red-300"),
+        children: /*#__PURE__*/jsxs("div", {
+          className: "flex items-center gap-2",
+          children: [/*#__PURE__*/jsx(FontAwesomeIcon, {
+            icon: wsTestResult.success ? "circle-check" : "circle-exclamation"
+          }), /*#__PURE__*/jsx("span", {
+            children: wsTestResult.message
+          })]
+        })
       })]
     }), /*#__PURE__*/jsxs("div", {
       className: "flex-shrink-0 flex flex-row justify-end gap-2 px-6 py-4 border-t border-white/10",
-      children: [/*#__PURE__*/jsx(Button, {
+      children: [(dashApi === null || dashApi === void 0 ? void 0 : dashApi.webSocket) && /*#__PURE__*/jsx(Button, {
+        title: isWsTesting ? "Testing..." : "Test Connection",
+        onClick: handleTestConnection,
+        size: "sm",
+        disabled: !url.trim() || !isValidWsUrl(url)
+      }), /*#__PURE__*/jsx(Button, {
         title: "Cancel",
         onClick: onCancel,
         size: "sm"