@opentiny/tiny-engine-toolbar-theme-switch 2.4.0 → 2.5.0-alpha.1

package/dist/index.js

@@ -1,18 +1,25 @@
 import "./style.css";
-import { resolveComponent as _, createElementBlock as p, openBlock as d, createVNode as f, withCtx as b, createElementVNode as A, Fragment as V, renderList as x, normalizeClass as B, toDisplayString as G, createCommentVNode as H, computed as m, ref as M, reactive as N } from "vue";
-import { ToolbarBase as O, setGlobalMonacoEditorTheme as R } from "@opentiny/tiny-engine-common";
-import { TinyPopover as U, TinyRadioGroup as F } from "@opentiny/vue";
-import { getMetaApi as S, META_SERVICE as v, defineService as P, getMergeRegistry as j, getMergeMeta as z } from "@opentiny/tiny-engine-meta-register";
-const q = (o, t) => {
-  const s = o.__vccOpts || o;
-  for (const [e, h] of t)
-    s[e] = h;
-  return s;
-}, J = {
+import { getMetaApi as m, META_SERVICE as c, callEntry as T, getMergeMeta as f, defineService as E } from "@opentiny/tiny-engine-meta-register";
+import { resolveComponent as H, createElementBlock as M, openBlock as V, createVNode as N, withCtx as O, createElementVNode as U, Fragment as R, renderList as j, normalizeClass as z, toDisplayString as q, createCommentVNode as J, computed as w, ref as F, reactive as K } from "vue";
+import { ToolbarBase as B, setGlobalMonacoEditorTheme as D } from "@opentiny/tiny-engine-common";
+import { TinyPopover as Q, TinyRadioGroup as W } from "@opentiny/vue";
+const G = {
+  id: "engine.toolbars.themeSwitch",
+  type: "toolbars",
+  title: "themeSwitch",
+  options: {
+    renderType: "icon"
+  }
+}, X = (o, t) => {
+  const n = o.__vccOpts || o;
+  for (const [e, g] of t)
+    n[e] = g;
+  return n;
+}, Y = {
   components: {
-    ToolbarBase: O,
-    TinyRadioGroup: F,
-    TinyPopover: U
+    ToolbarBase: B,
+    TinyRadioGroup: W,
+    TinyPopover: Q
   },
   props: {
     options: {
@@ -25,43 +32,131 @@ const q = (o, t) => {
     }
   },
   setup(o) {
-    const { getThemeData: t, getThemeState: s, themeChange: e, getTheme: h } = S(v.ThemeSwitch), l = s(), r = t(), c = "collapse", u = m(() => {
-      const n = { ...o.options };
-      return o.position === c && (n.renderType = ""), n;
-    }), a = m(() => r.value.map((n) => ({ ...n, label: n.type }))), E = m(() => o.position === c ? "" : l.themeLabel), D = m(() => o.position === c ? "" : l.themeIcon), y = M(!1), w = m(() => {
-      const n = r.value.filter((L) => ["light", "dark"].includes(L.type)) || [];
-      return r.value.length === n.length;
-    }), I = () => {
-      const n = h(l.theme).oppositeTheme;
-      e(n);
-    };
+    const {
+      getThemeData: t,
+      getThemeState: n,
+      themeChange: e,
+      getTheme: g
+    } = m(c.ThemeSwitch), h = n(), r = t(), l = "collapse", u = w(() => {
+      const s = {
+        ...o.options
+      };
+      return o.position === l && (s.renderType = ""), s;
+    }), a = w(() => r.value.map((s) => ({
+      ...s,
+      label: s.type
+    }))), b = w(() => o.position === l ? "" : h.themeLabel), A = w(() => o.position === l ? "" : h.themeIcon), y = F(!1), S = w(() => {
+      const s = r.value.filter((P) => ["light", "dark"].includes(P.type)) || [];
+      return r.value.length === s.length;
+    }), C = T(() => {
+      const s = g(h.theme).oppositeTheme;
+      e(s);
+    }, {
+      metaData: {
+        id: `${G.id}.toChangeTheme`
+      },
+      ctx: () => ({
+        props: o,
+        getThemeData: t,
+        getThemeState: n,
+        themeChange: e,
+        getTheme: g,
+        state: h,
+        THEME_DATA: r,
+        COLLAPSE: l,
+        optionsData: u,
+        radioThemeList: a,
+        baseContent: b,
+        baseIcon: A,
+        showpopover: y,
+        themeShowType: S,
+        toChangeTheme: C,
+        changeThemeType: k,
+        themeItemChange: L,
+        ToolbarBase: B,
+        getMetaApi: m,
+        META_SERVICE: c
+      })
+    }), k = T(() => {
+      o.position !== l && (S.value ? C() : y.value = !0);
+    }, {
+      metaData: {
+        id: `${G.id}.changeThemeType`
+      },
+      ctx: () => ({
+        props: o,
+        getThemeData: t,
+        getThemeState: n,
+        themeChange: e,
+        getTheme: g,
+        state: h,
+        THEME_DATA: r,
+        COLLAPSE: l,
+        optionsData: u,
+        radioThemeList: a,
+        baseContent: b,
+        baseIcon: A,
+        showpopover: y,
+        themeShowType: S,
+        toChangeTheme: C,
+        changeThemeType: k,
+        themeItemChange: L,
+        ToolbarBase: B,
+        getMetaApi: m,
+        META_SERVICE: c
+      })
+    }), L = T((s) => {
+      e(s), y.value = !1;
+    }, {
+      metaData: {
+        id: `${G.id}.themeItemChange`
+      },
+      ctx: () => ({
+        props: o,
+        getThemeData: t,
+        getThemeState: n,
+        themeChange: e,
+        getTheme: g,
+        state: h,
+        THEME_DATA: r,
+        COLLAPSE: l,
+        optionsData: u,
+        radioThemeList: a,
+        baseContent: b,
+        baseIcon: A,
+        showpopover: y,
+        themeShowType: S,
+        toChangeTheme: C,
+        changeThemeType: k,
+        themeItemChange: L,
+        ToolbarBase: B,
+        getMetaApi: m,
+        META_SERVICE: c
+      })
+    });
     return {
       THEME_DATA: r,
-      state: l,
+      state: h,
       optionsData: u,
       radioThemeList: a,
-      baseContent: E,
-      baseIcon: D,
-      toChangeTheme: I,
+      baseContent: b,
+      baseIcon: A,
+      toChangeTheme: C,
       themeChange: e,
       showpopover: y,
-      themeShowType: w,
-      themeItemChange: (n) => {
-        e(n), y.value = !1;
-      },
-      changeThemeType: () => {
-        o.position !== c && (w.value ? I() : y.value = !0);
-      }
+      themeShowType: S,
+      themeItemChange: L,
+      changeThemeType: k
     };
   }
-}, K = { class: "toolbar-theme-switch" }, Q = { class: "theme-list" }, W = ["onClick"], X = {
+}, Z = { class: "toolbar-theme-switch" }, $ = { class: "theme-list" }, ee = ["onClick"], te = {
   key: 0,
   class: "toolbar-theme-switch-radio"
 };
-function Y(o, t, s, e, h, l) {
-  const r = _("tiny-radio-group"), c = _("toolbar-base"), u = _("tiny-popover");
-  return d(), p("div", K, [
-    f(u, {
+function oe(o, t, n, e, g, h) {
+  const r = H("tiny-radio-group"), l = H("toolbar-base"), u = H("tiny-popover");
+  return V(), M("div", Z, [
+    N(u, {
       width: "130",
       trigger: "manual",
       modelValue: e.showpopover,
@@ -69,17 +164,17 @@ function Y(o, t, s, e, h, l) {
       "visible-arrow": !1,
       "popper-class": "theme-popover"
     }, {
-      reference: b(() => [
-        f(c, {
+      reference: O(() => [
+        N(l, {
           content: e.baseContent,
           icon: e.baseIcon,
           options: e.optionsData,
           onClickApi: e.changeThemeType
         }, {
-          default: b(() => [
-            s.position === "collapse" ? (d(), p("div", X, [
-              t[2] || (t[2] = A("div", { class: "toolbar-theme-switch-radio-title" }, "主题", -1)),
-              f(r, {
+          default: O(() => [
+            n.position === "collapse" ? (V(), M("div", te, [
+              t[2] || (t[2] = U("div", { class: "toolbar-theme-switch-radio-title" }, "主题", -1)),
+              N(r, {
                 modelValue: e.state.theme,
                 "onUpdate:modelValue": t[0] || (t[0] = (a) => e.state.theme = a),
                 options: e.radioThemeList,
@@ -87,62 +182,128 @@ function Y(o, t, s, e, h, l) {
                 class: "theme-radio-group",
                 onChange: e.themeChange
               }, null, 8, ["modelValue", "options", "vertical", "onChange"])
-            ])) : H("", !0)
+            ])) : J("", !0)
           ]),
           _: 1
         }, 8, ["content", "icon", "options", "onClickApi"])
       ]),
-      default: b(() => [
-        A("div", Q, [
-          (d(!0), p(V, null, x(e.THEME_DATA, (a) => (d(), p("div", {
+      default: O(() => [
+        U("div", $, [
+          (V(!0), M(R, null, j(e.THEME_DATA, (a) => (V(), M("div", {
             key: a.type,
-            class: B(["theme-item", { active: e.state.theme === a.type }]),
-            onClick: (E) => e.themeItemChange(a.type)
-          }, G(a.text), 11, W))), 128))
+            class: z(["theme-item", { active: e.state.theme === a.type }]),
+            onClick: (b) => e.themeItemChange(a.type)
+          }, q(a.text), 11, ee))), 128))
         ])
       ]),
       _: 1
     }, 8, ["modelValue"])
   ]);
 }
-const Z = /* @__PURE__ */ q(J, [["render", Y], ["__scopeId", "data-v-e0cba3bc"]]), $ = {
-  id: "engine.toolbars.themeSwitch",
-  type: "toolbars",
-  title: "themeSwitch",
-  options: {
-    renderType: "icon"
-  }
-}, T = M([]);
-let C = null;
-const i = N({
+const ne = /* @__PURE__ */ X(Y, [["render", oe], ["__scopeId", "data-v-3b11b072"]]), p = F([]);
+let v = null;
+const i = K({
   theme: "",
   themeLabel: "",
   themeIcon: ""
-}), ee = () => T, te = () => i, g = (o) => T.value.find((t) => o === t.type) || C, k = (o) => {
+}), I = T(() => p, {
+  metaData: {
+    id: "engine.toolbars.themeSwitch.getThemeData"
+  },
+  ctx: () => ({
+    defineService: E,
+    getMetaApi: m,
+    getMergeMeta: f,
+    META_SERVICE: c,
+    setGlobalMonacoEditorTheme: D,
+    THEME_DATA: p,
+    DEFAULT_THEME: v,
+    themeState: i,
+    getThemeData: I,
+    getThemeState: x,
+    getTheme: d,
+    themeChange: _
+  })
+}), x = T(() => i, {
+  metaData: {
+    id: "engine.toolbars.themeSwitch.getThemeState"
+  },
+  ctx: () => ({
+    defineService: E,
+    getMetaApi: m,
+    getMergeMeta: f,
+    META_SERVICE: c,
+    setGlobalMonacoEditorTheme: D,
+    THEME_DATA: p,
+    DEFAULT_THEME: v,
+    themeState: i,
+    getThemeData: I,
+    getThemeState: x,
+    getTheme: d,
+    themeChange: _
+  })
+}), d = T((o) => p.value.find((t) => o === t.type) || v, {
+  metaData: {
+    id: "engine.toolbars.themeSwitch.getTheme"
+  },
+  ctx: () => ({
+    defineService: E,
+    getMetaApi: m,
+    getMergeMeta: f,
+    META_SERVICE: c,
+    setGlobalMonacoEditorTheme: D,
+    THEME_DATA: p,
+    DEFAULT_THEME: v,
+    themeState: i,
+    getThemeData: I,
+    getThemeState: x,
+    getTheme: d,
+    themeChange: _
+  })
+}), _ = T((o) => {
   var e;
-  i.theme = g(o).type, i.themeLabel = g(i.theme).text, i.themeIcon = g(i.theme).icon, document.documentElement.setAttribute("data-theme", i.theme);
-  const t = S(v.GlobalService).getBaseInfo().id, s = (e = i.theme) != null && e.includes("dark") ? "vs-dark" : "vs";
-  localStorage.setItem(`tiny-engine-theme-${t}`, i.theme), R(s);
-}, le = P({
-  id: v.ThemeSwitch,
+  i.theme = d(o).type, i.themeLabel = d(i.theme).text, i.themeIcon = d(i.theme).icon, document.documentElement.setAttribute("data-theme", i.theme);
+  const t = m(c.GlobalService).getBaseInfo().id, n = (e = i.theme) != null && e.includes("dark") ? "vs-dark" : "vs";
+  localStorage.setItem(`tiny-engine-theme-${t}`, i.theme), D(n);
+}, {
+  metaData: {
+    id: "engine.toolbars.themeSwitch.themeChange"
+  },
+  ctx: () => ({
+    defineService: E,
+    getMetaApi: m,
+    getMergeMeta: f,
+    META_SERVICE: c,
+    setGlobalMonacoEditorTheme: D,
+    THEME_DATA: p,
+    DEFAULT_THEME: v,
+    themeState: i,
+    getThemeData: I,
+    getThemeState: x,
+    getTheme: d,
+    themeChange: _
+  })
+}), re = E({
+  id: c.ThemeSwitch,
   type: "MetaService",
   init: () => {
-    const o = S(v.GlobalService).getBaseInfo().id;
-    T.value = j("themes"), C = T.value[0];
-    const t = localStorage.getItem(`tiny-engine-theme-${o}`) || z("engine.config").theme || C.type;
-    k(t);
+    var n;
+    const o = m(c.GlobalService).getBaseInfo().id;
+    p.value = ((n = f("engine.config")) == null ? void 0 : n.themesList) || [], v = p.value[0];
+    const t = localStorage.getItem(`tiny-engine-theme-${o}`) || f("engine.config").theme || v.type;
+    _(t);
   },
   apis: () => ({
-    getThemeData: ee,
-    getThemeState: te,
-    getTheme: g,
-    themeChange: k
+    getThemeData: I,
+    getThemeState: x,
+    getTheme: d,
+    themeChange: _
   })
-}), me = {
-  ...$,
-  entry: Z
+}), le = {
+  ...G,
+  entry: ne
 };
 export {
-  le as ThemeSwitchService,
-  me as default
+  re as ThemeSwitchService,
+  le as default
 };

package/dist/style.css

@@ -1 +1 @@
-.theme-list .theme-item[data-v-e0cba3bc]{padding:4px 16px;margin:0 -16px}.theme-list .theme-item[data-v-e0cba3bc]:hover{background-color:var(--te-toolbar-theme-popover-list-item-bg-color-hover)}.theme-list .active[data-v-e0cba3bc]{background-color:var(--te-toolbar-theme-popover-list-item-bg-color-active)}.toolbar-theme-switch{--te-toolbar-theme-switch-radio-title: var(--te-common-text-secondary)}.theme-list{--te-toolbar-theme-popover-list-item-bg-color-hover: var(--te-common-bg-container);--te-toolbar-theme-popover-list-item-bg-color-active: var(--te-common-bg-container)}
+.theme-list .theme-item[data-v-3b11b072]{padding:4px 16px;margin:0 -16px}.theme-list .theme-item[data-v-3b11b072]:hover{background-color:var(--te-toolbar-theme-popover-list-item-bg-color-hover)}.theme-list .active[data-v-3b11b072]{background-color:var(--te-toolbar-theme-popover-list-item-bg-color-active)}.toolbar-theme-switch{--te-toolbar-theme-switch-radio-title: var(--te-common-text-secondary)}.theme-list{--te-toolbar-theme-popover-list-item-bg-color-hover: var(--te-common-bg-container);--te-toolbar-theme-popover-list-item-bg-color-active: var(--te-common-bg-container)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opentiny/tiny-engine-toolbar-theme-switch",
-  "version": "2.4.0",
+  "version": "2.5.0-alpha.1",
   "publishConfig": {
     "access": "public"
   },
@@ -25,12 +25,12 @@
   "license": "MIT",
   "homepage": "https://opentiny.design/tiny-engine",
   "dependencies": {
-    "@opentiny/tiny-engine-common": "2.4.0",
-    "@opentiny/tiny-engine-meta-register": "2.4.0",
-    "@opentiny/tiny-engine-utils": "2.4.0"
+    "@opentiny/tiny-engine-common": "2.5.0-alpha.1",
+    "@opentiny/tiny-engine-meta-register": "2.5.0-alpha.1",
+    "@opentiny/tiny-engine-utils": "2.5.0-alpha.1"
   },
   "devDependencies": {
-    "@opentiny/tiny-engine-vite-plugin-meta-comments": "2.4.0",
+    "@opentiny/tiny-engine-vite-plugin-meta-comments": "2.5.0-alpha.1",
     "@vitejs/plugin-vue": "^5.1.2",
     "@vitejs/plugin-vue-jsx": "^4.0.1",
     "vite": "^5.4.2"
@@ -39,5 +39,5 @@
     "@opentiny/vue": "^3.20.0",
     "vue": "^3.4.15"
   },
-  "gitHead": "477aa411da11a4f95712e3e5c251d97cae23f4ad"
+  "gitHead": "018ca6054f72ee559f0d3ca4dfcbeef4fb411e01"
 }