@trops/dash-core 0.1.183 → 0.1.184

package/dist/index.esm.js

@@ -40503,17 +40503,44 @@ var ThemeDetail = function ThemeDetail(_ref6) {
 
 function ownKeys$5(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$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var ThemesSection = function ThemesSection(_ref) {
-  var _ref$onOpenThemeEdito = _ref.onOpenThemeEditor,
-    onOpenThemeEditor = _ref$onOpenThemeEdito === void 0 ? null : _ref$onOpenThemeEdito,
-    _ref$dashApi = _ref.dashApi,
-    dashApi = _ref$dashApi === void 0 ? null : _ref$dashApi,
-    _ref$credentials = _ref.credentials,
-    credentials = _ref$credentials === void 0 ? null : _ref$credentials,
-    _ref$createRequested = _ref.createRequested,
-    createRequested = _ref$createRequested === void 0 ? false : _ref$createRequested,
-    _ref$onCreateAcknowle = _ref.onCreateAcknowledged,
-    onCreateAcknowledged = _ref$onCreateAcknowle === void 0 ? null : _ref$onCreateAcknowle;
+var BackToChooser = function BackToChooser(_ref) {
+  var onClick = _ref.onClick,
+    children = _ref.children;
+  return /*#__PURE__*/jsxs("div", {
+    className: "flex flex-col h-full overflow-hidden",
+    children: [/*#__PURE__*/jsx("div", {
+      className: "flex-shrink-0 px-4 pt-4",
+      children: /*#__PURE__*/jsxs("button", {
+        type: "button",
+        onClick: onClick,
+        className: "flex items-center gap-1.5 text-sm opacity-60 hover:opacity-100 transition-opacity",
+        children: [/*#__PURE__*/jsx(FontAwesomeIcon, {
+          icon: "arrow-left",
+          className: "h-3 w-3"
+        }), /*#__PURE__*/jsx("span", {
+          children: "Back"
+        })]
+      })
+    }), /*#__PURE__*/jsx("div", {
+      className: "flex-1 min-h-0 overflow-y-auto",
+      children: children
+    })]
+  });
+};
+
+// ─── Main Component ──────────────────────────────────────────────────────
+
+var ThemesSection = function ThemesSection(_ref2) {
+  var _ref2$onOpenThemeEdit = _ref2.onOpenThemeEditor,
+    onOpenThemeEditor = _ref2$onOpenThemeEdit === void 0 ? null : _ref2$onOpenThemeEdit,
+    _ref2$dashApi = _ref2.dashApi,
+    dashApi = _ref2$dashApi === void 0 ? null : _ref2$dashApi,
+    _ref2$credentials = _ref2.credentials,
+    credentials = _ref2$credentials === void 0 ? null : _ref2$credentials,
+    _ref2$createRequested = _ref2.createRequested,
+    createRequested = _ref2$createRequested === void 0 ? false : _ref2$createRequested,
+    _ref2$onCreateAcknowl = _ref2.onCreateAcknowledged,
+    onCreateAcknowledged = _ref2$onCreateAcknowl === void 0 ? null : _ref2$onCreateAcknowl;
   var _useContext = useContext(ThemeContext),
     themes = _useContext.themes,
     currentThemeKey = _useContext.themeKey,
@@ -40551,6 +40578,10 @@ var ThemesSection = function ThemesSection(_ref) {
     _useState12 = _slicedToArray(_useState11, 2),
     enteredViaChooser = _useState12[0],
     setEnteredViaChooser = _useState12[1];
+  var _useState13 = useState(null),
+    _useState14 = _slicedToArray(_useState13, 2),
+    initialMethod = _useState14[0],
+    setInitialMethod = _useState14[1];
   var themeEntries = themes ? Object.entries(themes) : [];
   var appId = credentials === null || credentials === void 0 ? void 0 : credentials.appId;
   var rowStyles = getStylesForItem(themeObjects.PANEL_HEADER, currentTheme, {
@@ -40611,9 +40642,9 @@ var ThemesSection = function ThemesSection(_ref) {
     if (!dashApi || !appId) return;
     if (key === currentThemeKey) {
       var _themeEntries$find;
-      var otherKey = (_themeEntries$find = themeEntries.find(function (_ref2) {
-        var _ref3 = _slicedToArray(_ref2, 1),
-          k = _ref3[0];
+      var otherKey = (_themeEntries$find = themeEntries.find(function (_ref3) {
+        var _ref4 = _slicedToArray(_ref3, 1),
+          k = _ref4[0];
         return k !== key;
       })) === null || _themeEntries$find === void 0 ? void 0 : _themeEntries$find[0];
       if (otherKey) {
@@ -40729,10 +40760,10 @@ var ThemesSection = function ThemesSection(_ref) {
     }), /*#__PURE__*/jsx("div", {
       className: "flex-1 overflow-y-auto min-h-0",
       children: /*#__PURE__*/jsxs(Sidebar.Content, {
-        children: [themeEntries.map(function (_ref4) {
-          var _ref5 = _slicedToArray(_ref4, 2),
-            key = _ref5[0],
-            theme = _ref5[1];
+        children: [themeEntries.map(function (_ref5) {
+          var _ref6 = _slicedToArray(_ref5, 2),
+            key = _ref6[0],
+            theme = _ref6[1];
           var isActive = key === currentThemeKey;
           var isSelected = selectedThemeKey === key && generateMode === GENERATE_MODES.NONE && installMode !== "marketplace";
           return /*#__PURE__*/jsx(Sidebar.Item, {
@@ -40793,38 +40824,57 @@ var ThemesSection = function ThemesSection(_ref) {
         setInstallMode("marketplace");
         setEnteredViaChooser(true);
       },
-      onCreateNew: function onCreateNew() {
-        setGenerateMode(GENERATE_MODES.WIZARD);
-      },
-      onCreateFromUrl: function onCreateFromUrl() {
-        setGenerateMode(GENERATE_MODES.FROM_URL);
+      onSelectMethod: function onSelectMethod(method) {
+        setInitialMethod(method);
+        if (method === "presets") setGenerateMode(GENERATE_MODES.PRESETS);else if (method === "color") setGenerateMode(GENERATE_MODES.COLOR);else if (method === "from-url") setGenerateMode(GENERATE_MODES.FROM_URL);else setGenerateMode(GENERATE_MODES.WIZARD);
       }
     });
   } else if (generateMode === GENERATE_MODES.WIZARD) {
-    detailContent = /*#__PURE__*/jsx(ThemeQuickCreate, {
-      wizardName: wizardName,
-      setWizardName: setWizardName,
-      wizardMethod: wizardMethod,
-      setWizardMethod: setWizardMethod,
-      wizardTheme: wizardTheme,
-      setWizardTheme: setWizardTheme,
-      onComplete: handleWizardComplete,
-      onExtract: handleUrlExtract,
-      onMapToTheme: handleUrlMapToTheme
+    detailContent = /*#__PURE__*/jsx(BackToChooser, {
+      onClick: function onClick() {
+        return setGenerateMode(GENERATE_MODES.CHOOSER);
+      },
+      children: /*#__PURE__*/jsx(ThemeQuickCreate, {
+        wizardName: wizardName,
+        setWizardName: setWizardName,
+        wizardMethod: wizardMethod,
+        setWizardMethod: setWizardMethod,
+        wizardTheme: wizardTheme,
+        setWizardTheme: setWizardTheme,
+        onComplete: handleWizardComplete,
+        onExtract: handleUrlExtract,
+        onMapToTheme: handleUrlMapToTheme,
+        initialMethod: initialMethod
+      })
     });
   } else if (generateMode === GENERATE_MODES.PRESETS) {
-    detailContent = /*#__PURE__*/jsx(PresetGallery, {
-      onSelect: handleCreateFromPreset
+    detailContent = /*#__PURE__*/jsx(BackToChooser, {
+      onClick: function onClick() {
+        return setGenerateMode(GENERATE_MODES.CHOOSER);
+      },
+      children: /*#__PURE__*/jsx(PresetGallery, {
+        onSelect: handleCreateFromPreset
+      })
     });
   } else if (generateMode === GENERATE_MODES.FROM_URL) {
-    detailContent = /*#__PURE__*/jsx(ThemeFromUrlPane, {
-      onExtract: handleUrlExtract,
-      onMapToTheme: handleUrlMapToTheme,
-      onGenerate: handleUrlThemeGenerated
+    detailContent = /*#__PURE__*/jsx(BackToChooser, {
+      onClick: function onClick() {
+        return setGenerateMode(GENERATE_MODES.CHOOSER);
+      },
+      children: /*#__PURE__*/jsx(ThemeFromUrlPane, {
+        onExtract: handleUrlExtract,
+        onMapToTheme: handleUrlMapToTheme,
+        onGenerate: handleUrlThemeGenerated
+      })
     });
   } else if (generateMode === GENERATE_MODES.COLOR) {
-    detailContent = /*#__PURE__*/jsx(ColorHarmonyPicker, {
-      onGenerate: handleCreateFromHarmony
+    detailContent = /*#__PURE__*/jsx(BackToChooser, {
+      onClick: function onClick() {
+        return setGenerateMode(GENERATE_MODES.CHOOSER);
+      },
+      children: /*#__PURE__*/jsx(ColorHarmonyPicker, {
+        onGenerate: handleCreateFromHarmony
+      })
     });
   } else if (selectedThemeKey && themes && themes[selectedThemeKey]) {
     detailContent = /*#__PURE__*/jsx(ThemeDetail, {