@opentiny/tiny-engine-toolbar-theme-switch 2.5.0-alpha.0 → 2.5.0-alpha.2

package/dist/index.js

@@ -1,25 +1,18 @@
 import "./style.css";
-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 = {
+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 = {
   components: {
-    ToolbarBase: B,
-    TinyRadioGroup: W,
-    TinyPopover: Q
+    ToolbarBase: O,
+    TinyRadioGroup: F,
+    TinyPopover: U
   },
   props: {
     options: {
@@ -32,131 +25,43 @@ const G = {
     }
   },
   setup(o) {
-    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
-      })
-    });
+    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);
+    };
     return {
       THEME_DATA: r,
-      state: h,
+      state: l,
       optionsData: u,
       radioThemeList: a,
-      baseContent: b,
-      baseIcon: A,
-      toChangeTheme: C,
+      baseContent: E,
+      baseIcon: D,
+      toChangeTheme: I,
       themeChange: e,
       showpopover: y,
-      themeShowType: S,
-      themeItemChange: L,
-      changeThemeType: k
+      themeShowType: w,
+      themeItemChange: (n) => {
+        e(n), y.value = !1;
+      },
+      changeThemeType: () => {
+        o.position !== c && (w.value ? I() : y.value = !0);
+      }
     };
   }
-}, Z = { class: "toolbar-theme-switch" }, $ = { class: "theme-list" }, ee = ["onClick"], te = {
+}, K = { class: "toolbar-theme-switch" }, Q = { class: "theme-list" }, W = ["onClick"], X = {
   key: 0,
   class: "toolbar-theme-switch-radio"
 };
-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, {
+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, {
       width: "130",
       trigger: "manual",
       modelValue: e.showpopover,
@@ -164,17 +69,17 @@ function oe(o, t, n, e, g, h) {
       "visible-arrow": !1,
       "popper-class": "theme-popover"
     }, {
-      reference: O(() => [
-        N(l, {
+      reference: b(() => [
+        f(c, {
           content: e.baseContent,
           icon: e.baseIcon,
           options: e.optionsData,
           onClickApi: e.changeThemeType
         }, {
-          default: O(() => [
-            n.position === "collapse" ? (V(), M("div", te, [
-              t[2] || (t[2] = U("div", { class: "toolbar-theme-switch-radio-title" }, "主题", -1)),
-              N(r, {
+          default: b(() => [
+            s.position === "collapse" ? (d(), p("div", X, [
+              t[2] || (t[2] = A("div", { class: "toolbar-theme-switch-radio-title" }, "主题", -1)),
+              f(r, {
                 modelValue: e.state.theme,
                 "onUpdate:modelValue": t[0] || (t[0] = (a) => e.state.theme = a),
                 options: e.radioThemeList,
@@ -182,128 +87,62 @@ function oe(o, t, n, e, g, h) {
                 class: "theme-radio-group",
                 onChange: e.themeChange
               }, null, 8, ["modelValue", "options", "vertical", "onChange"])
-            ])) : J("", !0)
+            ])) : H("", !0)
           ]),
           _: 1
         }, 8, ["content", "icon", "options", "onClickApi"])
       ]),
-      default: O(() => [
-        U("div", $, [
-          (V(!0), M(R, null, j(e.THEME_DATA, (a) => (V(), M("div", {
+      default: b(() => [
+        A("div", Q, [
+          (d(!0), p(V, null, x(e.THEME_DATA, (a) => (d(), p("div", {
             key: a.type,
-            class: z(["theme-item", { active: e.state.theme === a.type }]),
-            onClick: (b) => e.themeItemChange(a.type)
-          }, q(a.text), 11, ee))), 128))
+            class: B(["theme-item", { active: e.state.theme === a.type }]),
+            onClick: (E) => e.themeItemChange(a.type)
+          }, G(a.text), 11, W))), 128))
         ])
       ]),
       _: 1
     }, 8, ["modelValue"])
   ]);
 }
-const ne = /* @__PURE__ */ X(Y, [["render", oe], ["__scopeId", "data-v-3b11b072"]]), p = F([]);
-let v = null;
-const i = K({
+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({
   theme: "",
   themeLabel: "",
   themeIcon: ""
-}), 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) => {
+}), ee = () => T, te = () => i, g = (o) => T.value.find((t) => o === t.type) || C, k = (o) => {
   var e;
-  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,
+  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,
   type: "MetaService",
   init: () => {
-    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);
+    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);
   },
   apis: () => ({
-    getThemeData: I,
-    getThemeState: x,
-    getTheme: d,
-    themeChange: _
+    getThemeData: ee,
+    getThemeState: te,
+    getTheme: g,
+    themeChange: k
   })
-}), le = {
-  ...G,
-  entry: ne
+}), me = {
+  ...$,
+  entry: Z
 };
 export {
-  re as ThemeSwitchService,
-  le as default
+  le as ThemeSwitchService,
+  me as default
 };

package/dist/style.css

@@ -1 +1 @@
-.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)}
+.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)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opentiny/tiny-engine-toolbar-theme-switch",
-  "version": "2.5.0-alpha.0",
+  "version": "2.5.0-alpha.2",
   "publishConfig": {
     "access": "public"
   },
@@ -25,12 +25,12 @@
   "license": "MIT",
   "homepage": "https://opentiny.design/tiny-engine",
   "dependencies": {
-    "@opentiny/tiny-engine-common": "2.5.0-alpha.0",
-    "@opentiny/tiny-engine-meta-register": "2.5.0-alpha.0",
-    "@opentiny/tiny-engine-utils": "2.5.0-alpha.0"
+    "@opentiny/tiny-engine-common": "2.5.0-alpha.2",
+    "@opentiny/tiny-engine-meta-register": "2.5.0-alpha.2",
+    "@opentiny/tiny-engine-utils": "2.5.0-alpha.2"
   },
   "devDependencies": {
-    "@opentiny/tiny-engine-vite-plugin-meta-comments": "2.5.0-alpha.0",
+    "@opentiny/tiny-engine-vite-plugin-meta-comments": "2.5.0-alpha.2",
     "@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": "ae59c82734d79f650c9221cb9702714814b099c8"
+  "gitHead": "f5707c379397bffc9a63c50c695f3ee3340ad0c6"
 }