@opentiny/tiny-engine-toolbar-theme-switch 2.6.0-rc.0 → 2.6.0-rc.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +83 -244
- package/dist/index.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +6 -6
package/dist/index.js
CHANGED
|
@@ -1,25 +1,18 @@
|
|
|
1
1
|
import "./style.css";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
const
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
}
|
|
13
|
-
}, X = (o, t) => {
|
|
14
|
-
const n = o.__vccOpts || o;
|
|
15
|
-
for (const [e, g] of t)
|
|
16
|
-
n[e] = g;
|
|
17
|
-
return n;
|
|
18
|
-
}, Y = {
|
|
2
|
+
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";
|
|
3
|
+
import { ToolbarBase as O, setGlobalMonacoEditorTheme as R } from "@opentiny/tiny-engine-common";
|
|
4
|
+
import { TinyPopover as U, TinyRadioGroup as F } from "@opentiny/vue";
|
|
5
|
+
import { getMetaApi as S, META_SERVICE as v, defineService as P, getMergeRegistry as j, getMergeMeta as z } from "@opentiny/tiny-engine-meta-register";
|
|
6
|
+
const q = (o, t) => {
|
|
7
|
+
const s = o.__vccOpts || o;
|
|
8
|
+
for (const [e, h] of t)
|
|
9
|
+
s[e] = h;
|
|
10
|
+
return s;
|
|
11
|
+
}, J = {
|
|
19
12
|
components: {
|
|
20
|
-
ToolbarBase:
|
|
21
|
-
TinyRadioGroup:
|
|
22
|
-
TinyPopover:
|
|
13
|
+
ToolbarBase: O,
|
|
14
|
+
TinyRadioGroup: F,
|
|
15
|
+
TinyPopover: U
|
|
23
16
|
},
|
|
24
17
|
props: {
|
|
25
18
|
options: {
|
|
@@ -32,131 +25,43 @@ const W = {
|
|
|
32
25
|
}
|
|
33
26
|
},
|
|
34
27
|
setup(o) {
|
|
35
|
-
const {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
}), a = C(() => l.value.map((s) => ({
|
|
46
|
-
...s,
|
|
47
|
-
label: s.type
|
|
48
|
-
}))), _ = C(() => o.position === h ? "" : r.themeLabel), A = C(() => o.position === h ? "" : r.themeIcon), u = U(!1), S = C(() => {
|
|
49
|
-
const s = l.value.filter((F) => ["light", "dark"].includes(F.type)) || [];
|
|
50
|
-
return l.value.length === s.length;
|
|
51
|
-
}), w = T(() => {
|
|
52
|
-
const s = g(r.theme).oppositeTheme;
|
|
53
|
-
e(s);
|
|
54
|
-
}, {
|
|
55
|
-
metaData: {
|
|
56
|
-
id: "engine.toolbars.themeSwitch.Main.toChangeTheme"
|
|
57
|
-
},
|
|
58
|
-
ctx: () => ({
|
|
59
|
-
props: o,
|
|
60
|
-
getThemeData: t,
|
|
61
|
-
getThemeState: n,
|
|
62
|
-
themeChange: e,
|
|
63
|
-
getTheme: g,
|
|
64
|
-
state: r,
|
|
65
|
-
THEME_DATA: l,
|
|
66
|
-
COLLAPSE: h,
|
|
67
|
-
optionsData: b,
|
|
68
|
-
radioThemeList: a,
|
|
69
|
-
baseContent: _,
|
|
70
|
-
baseIcon: A,
|
|
71
|
-
showpopover: u,
|
|
72
|
-
themeShowType: S,
|
|
73
|
-
toChangeTheme: w,
|
|
74
|
-
changeThemeType: M,
|
|
75
|
-
themeItemChange: k,
|
|
76
|
-
ToolbarBase: B,
|
|
77
|
-
getMetaApi: m,
|
|
78
|
-
META_SERVICE: c
|
|
79
|
-
})
|
|
80
|
-
}), M = T(() => {
|
|
81
|
-
o.position !== h && (S.value ? w() : u.value = !0);
|
|
82
|
-
}, {
|
|
83
|
-
metaData: {
|
|
84
|
-
id: "engine.toolbars.themeSwitch.Main.changeThemeType"
|
|
85
|
-
},
|
|
86
|
-
ctx: () => ({
|
|
87
|
-
props: o,
|
|
88
|
-
getThemeData: t,
|
|
89
|
-
getThemeState: n,
|
|
90
|
-
themeChange: e,
|
|
91
|
-
getTheme: g,
|
|
92
|
-
state: r,
|
|
93
|
-
THEME_DATA: l,
|
|
94
|
-
COLLAPSE: h,
|
|
95
|
-
optionsData: b,
|
|
96
|
-
radioThemeList: a,
|
|
97
|
-
baseContent: _,
|
|
98
|
-
baseIcon: A,
|
|
99
|
-
showpopover: u,
|
|
100
|
-
themeShowType: S,
|
|
101
|
-
toChangeTheme: w,
|
|
102
|
-
changeThemeType: M,
|
|
103
|
-
themeItemChange: k,
|
|
104
|
-
ToolbarBase: B,
|
|
105
|
-
getMetaApi: m,
|
|
106
|
-
META_SERVICE: c
|
|
107
|
-
})
|
|
108
|
-
}), k = T((s) => {
|
|
109
|
-
e(s), u.value = !1;
|
|
110
|
-
}, {
|
|
111
|
-
metaData: {
|
|
112
|
-
id: "engine.toolbars.themeSwitch.Main.themeItemChange"
|
|
113
|
-
},
|
|
114
|
-
ctx: () => ({
|
|
115
|
-
props: o,
|
|
116
|
-
getThemeData: t,
|
|
117
|
-
getThemeState: n,
|
|
118
|
-
themeChange: e,
|
|
119
|
-
getTheme: g,
|
|
120
|
-
state: r,
|
|
121
|
-
THEME_DATA: l,
|
|
122
|
-
COLLAPSE: h,
|
|
123
|
-
optionsData: b,
|
|
124
|
-
radioThemeList: a,
|
|
125
|
-
baseContent: _,
|
|
126
|
-
baseIcon: A,
|
|
127
|
-
showpopover: u,
|
|
128
|
-
themeShowType: S,
|
|
129
|
-
toChangeTheme: w,
|
|
130
|
-
changeThemeType: M,
|
|
131
|
-
themeItemChange: k,
|
|
132
|
-
ToolbarBase: B,
|
|
133
|
-
getMetaApi: m,
|
|
134
|
-
META_SERVICE: c
|
|
135
|
-
})
|
|
136
|
-
});
|
|
28
|
+
const { getThemeData: t, getThemeState: s, themeChange: e, getTheme: h } = S(v.ThemeSwitch), l = s(), r = t(), c = "collapse", u = m(() => {
|
|
29
|
+
const n = { ...o.options };
|
|
30
|
+
return o.position === c && (n.renderType = ""), n;
|
|
31
|
+
}), 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(() => {
|
|
32
|
+
const n = r.value.filter((L) => ["light", "dark"].includes(L.type)) || [];
|
|
33
|
+
return r.value.length === n.length;
|
|
34
|
+
}), I = () => {
|
|
35
|
+
const n = h(l.theme).oppositeTheme;
|
|
36
|
+
e(n);
|
|
37
|
+
};
|
|
137
38
|
return {
|
|
138
|
-
THEME_DATA:
|
|
139
|
-
state:
|
|
140
|
-
optionsData:
|
|
39
|
+
THEME_DATA: r,
|
|
40
|
+
state: l,
|
|
41
|
+
optionsData: u,
|
|
141
42
|
radioThemeList: a,
|
|
142
|
-
baseContent:
|
|
143
|
-
baseIcon:
|
|
144
|
-
toChangeTheme:
|
|
43
|
+
baseContent: E,
|
|
44
|
+
baseIcon: D,
|
|
45
|
+
toChangeTheme: I,
|
|
145
46
|
themeChange: e,
|
|
146
|
-
showpopover:
|
|
147
|
-
themeShowType:
|
|
148
|
-
themeItemChange:
|
|
149
|
-
|
|
47
|
+
showpopover: y,
|
|
48
|
+
themeShowType: w,
|
|
49
|
+
themeItemChange: (n) => {
|
|
50
|
+
e(n), y.value = !1;
|
|
51
|
+
},
|
|
52
|
+
changeThemeType: () => {
|
|
53
|
+
o.position !== c && (w.value ? I() : y.value = !0);
|
|
54
|
+
}
|
|
150
55
|
};
|
|
151
56
|
}
|
|
152
|
-
},
|
|
57
|
+
}, K = { class: "toolbar-theme-switch" }, Q = { class: "theme-list" }, W = ["onClick"], X = {
|
|
153
58
|
key: 0,
|
|
154
59
|
class: "toolbar-theme-switch-radio"
|
|
155
60
|
};
|
|
156
|
-
function
|
|
157
|
-
const
|
|
158
|
-
return
|
|
159
|
-
|
|
61
|
+
function Y(o, t, s, e, h, l) {
|
|
62
|
+
const r = _("tiny-radio-group"), c = _("toolbar-base"), u = _("tiny-popover");
|
|
63
|
+
return d(), p("div", K, [
|
|
64
|
+
f(u, {
|
|
160
65
|
width: "130",
|
|
161
66
|
trigger: "manual",
|
|
162
67
|
modelValue: e.showpopover,
|
|
@@ -164,17 +69,17 @@ function oe(o, t, n, e, g, r) {
|
|
|
164
69
|
"visible-arrow": !1,
|
|
165
70
|
"popper-class": "theme-popover"
|
|
166
71
|
}, {
|
|
167
|
-
reference:
|
|
168
|
-
|
|
72
|
+
reference: b(() => [
|
|
73
|
+
f(c, {
|
|
169
74
|
content: e.baseContent,
|
|
170
75
|
icon: e.baseIcon,
|
|
171
76
|
options: e.optionsData,
|
|
172
77
|
onClickApi: e.changeThemeType
|
|
173
78
|
}, {
|
|
174
|
-
default:
|
|
175
|
-
|
|
176
|
-
t[2] || (t[2] =
|
|
177
|
-
|
|
79
|
+
default: b(() => [
|
|
80
|
+
s.position === "collapse" ? (d(), p("div", X, [
|
|
81
|
+
t[2] || (t[2] = A("div", { class: "toolbar-theme-switch-radio-title" }, "主题", -1)),
|
|
82
|
+
f(r, {
|
|
178
83
|
modelValue: e.state.theme,
|
|
179
84
|
"onUpdate:modelValue": t[0] || (t[0] = (a) => e.state.theme = a),
|
|
180
85
|
options: e.radioThemeList,
|
|
@@ -182,129 +87,63 @@ function oe(o, t, n, e, g, r) {
|
|
|
182
87
|
class: "theme-radio-group",
|
|
183
88
|
onChange: e.themeChange
|
|
184
89
|
}, null, 8, ["modelValue", "options", "vertical", "onChange"])
|
|
185
|
-
])) :
|
|
90
|
+
])) : H("", !0)
|
|
186
91
|
]),
|
|
187
92
|
_: 1
|
|
188
93
|
}, 8, ["content", "icon", "options", "onClickApi"])
|
|
189
94
|
]),
|
|
190
|
-
default:
|
|
191
|
-
|
|
192
|
-
(
|
|
95
|
+
default: b(() => [
|
|
96
|
+
A("div", Q, [
|
|
97
|
+
(d(!0), p(V, null, x(e.THEME_DATA, (a) => (d(), p("div", {
|
|
193
98
|
key: a.type,
|
|
194
|
-
class:
|
|
195
|
-
onClick: (
|
|
196
|
-
},
|
|
99
|
+
class: B(["theme-item", { active: e.state.theme === a.type }]),
|
|
100
|
+
onClick: (E) => e.themeItemChange(a.type)
|
|
101
|
+
}, G(a.text), 11, W))), 128))
|
|
197
102
|
])
|
|
198
103
|
]),
|
|
199
104
|
_: 1
|
|
200
105
|
}, 8, ["modelValue"])
|
|
201
106
|
]);
|
|
202
107
|
}
|
|
203
|
-
const
|
|
204
|
-
|
|
205
|
-
|
|
108
|
+
const Z = /* @__PURE__ */ q(J, [["render", Y], ["__scopeId", "data-v-e0cba3bc"]]), $ = {
|
|
109
|
+
id: "engine.toolbars.themeSwitch",
|
|
110
|
+
type: "toolbars",
|
|
111
|
+
title: "themeSwitch",
|
|
112
|
+
options: {
|
|
113
|
+
renderType: "icon"
|
|
114
|
+
}
|
|
115
|
+
}, T = M([]);
|
|
116
|
+
let C = null;
|
|
117
|
+
const i = N({
|
|
206
118
|
theme: "",
|
|
207
119
|
themeLabel: "",
|
|
208
120
|
themeIcon: ""
|
|
209
|
-
}),
|
|
210
|
-
metaData: {
|
|
211
|
-
id: "engine.toolbars.themeSwitch.composable-index.getThemeData"
|
|
212
|
-
},
|
|
213
|
-
ctx: () => ({
|
|
214
|
-
defineService: D,
|
|
215
|
-
getMetaApi: m,
|
|
216
|
-
getMergeMeta: y,
|
|
217
|
-
META_SERVICE: c,
|
|
218
|
-
setGlobalMonacoEditorTheme: x,
|
|
219
|
-
THEME_DATA: p,
|
|
220
|
-
DEFAULT_THEME: v,
|
|
221
|
-
themeState: i,
|
|
222
|
-
getThemeData: E,
|
|
223
|
-
getThemeState: I,
|
|
224
|
-
getTheme: d,
|
|
225
|
-
themeChange: f
|
|
226
|
-
})
|
|
227
|
-
}), I = T(() => i, {
|
|
228
|
-
metaData: {
|
|
229
|
-
id: "engine.toolbars.themeSwitch.composable-index.getThemeState"
|
|
230
|
-
},
|
|
231
|
-
ctx: () => ({
|
|
232
|
-
defineService: D,
|
|
233
|
-
getMetaApi: m,
|
|
234
|
-
getMergeMeta: y,
|
|
235
|
-
META_SERVICE: c,
|
|
236
|
-
setGlobalMonacoEditorTheme: x,
|
|
237
|
-
THEME_DATA: p,
|
|
238
|
-
DEFAULT_THEME: v,
|
|
239
|
-
themeState: i,
|
|
240
|
-
getThemeData: E,
|
|
241
|
-
getThemeState: I,
|
|
242
|
-
getTheme: d,
|
|
243
|
-
themeChange: f
|
|
244
|
-
})
|
|
245
|
-
}), d = T((o) => p.value.find((t) => o === t.type) || v, {
|
|
246
|
-
metaData: {
|
|
247
|
-
id: "engine.toolbars.themeSwitch.composable-index.getTheme"
|
|
248
|
-
},
|
|
249
|
-
ctx: () => ({
|
|
250
|
-
defineService: D,
|
|
251
|
-
getMetaApi: m,
|
|
252
|
-
getMergeMeta: y,
|
|
253
|
-
META_SERVICE: c,
|
|
254
|
-
setGlobalMonacoEditorTheme: x,
|
|
255
|
-
THEME_DATA: p,
|
|
256
|
-
DEFAULT_THEME: v,
|
|
257
|
-
themeState: i,
|
|
258
|
-
getThemeData: E,
|
|
259
|
-
getThemeState: I,
|
|
260
|
-
getTheme: d,
|
|
261
|
-
themeChange: f
|
|
262
|
-
})
|
|
263
|
-
}), f = T((o) => {
|
|
121
|
+
}), ee = () => T, te = () => i, g = (o) => T.value.find((t) => o === t.type) || C, k = (o) => {
|
|
264
122
|
var e;
|
|
265
|
-
i.theme =
|
|
266
|
-
const t =
|
|
267
|
-
localStorage.setItem(`tiny-engine-theme-${t}`, i.theme),
|
|
268
|
-
}, {
|
|
269
|
-
|
|
270
|
-
id: "engine.toolbars.themeSwitch.composable-index.themeChange"
|
|
271
|
-
},
|
|
272
|
-
ctx: () => ({
|
|
273
|
-
defineService: D,
|
|
274
|
-
getMetaApi: m,
|
|
275
|
-
getMergeMeta: y,
|
|
276
|
-
META_SERVICE: c,
|
|
277
|
-
setGlobalMonacoEditorTheme: x,
|
|
278
|
-
THEME_DATA: p,
|
|
279
|
-
DEFAULT_THEME: v,
|
|
280
|
-
themeState: i,
|
|
281
|
-
getThemeData: E,
|
|
282
|
-
getThemeState: I,
|
|
283
|
-
getTheme: d,
|
|
284
|
-
themeChange: f
|
|
285
|
-
})
|
|
286
|
-
}), le = D({
|
|
287
|
-
id: c.ThemeSwitch,
|
|
123
|
+
i.theme = g(o).type, i.themeLabel = g(i.theme).text, i.themeIcon = g(i.theme).icon, document.documentElement.setAttribute("data-theme", i.theme);
|
|
124
|
+
const t = S(v.GlobalService).getBaseInfo().id, s = (e = i.theme) != null && e.includes("dark") ? "vs-dark" : "vs";
|
|
125
|
+
localStorage.setItem(`tiny-engine-theme-${t}`, i.theme), R(s);
|
|
126
|
+
}, le = P({
|
|
127
|
+
id: v.ThemeSwitch,
|
|
288
128
|
type: "MetaService",
|
|
289
129
|
init: () => {
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
f(t);
|
|
130
|
+
const o = S(v.GlobalService).getBaseInfo().id;
|
|
131
|
+
T.value = j("themes"), C = T.value[0];
|
|
132
|
+
const t = localStorage.getItem(`tiny-engine-theme-${o}`) || z("engine.config").theme || C.type;
|
|
133
|
+
k(t);
|
|
295
134
|
},
|
|
296
135
|
apis: () => ({
|
|
297
|
-
getThemeData:
|
|
298
|
-
getThemeState:
|
|
299
|
-
getTheme:
|
|
300
|
-
themeChange:
|
|
136
|
+
getThemeData: ee,
|
|
137
|
+
getThemeState: te,
|
|
138
|
+
getTheme: g,
|
|
139
|
+
themeChange: k
|
|
301
140
|
})
|
|
302
|
-
}),
|
|
303
|
-
|
|
304
|
-
entry:
|
|
141
|
+
}), me = {
|
|
142
|
+
...$,
|
|
143
|
+
entry: Z
|
|
305
144
|
};
|
|
306
145
|
export {
|
|
307
146
|
le as ThemeSwitchService,
|
|
308
|
-
|
|
147
|
+
me as default
|
|
309
148
|
};
|
|
310
149
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../meta.js","../index.ts"],"sourcesContent":["export default {\n id: 'engine.toolbars.themeSwitch',\n type: 'toolbars',\n title: 'themeSwitch',\n options: {\n renderType: 'icon'\n }\n}\n","/**\n * Copyright (c) 2023 - present TinyEngine Authors.\n * Copyright (c) 2023 - present Huawei Cloud Computing Technologies Co., Ltd.\n *\n * Use of this source code is governed by an MIT-style license.\n *\n * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,\n * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR\n * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.\n *\n */\n\nimport entry from './src/Main.vue'\nimport metaData from './meta'\nimport { default as ThemeSwitchService } from './src/composable'\nimport './src/styles/vars.less'\n\nexport default {\n ...metaData,\n entry\n}\n\nexport { ThemeSwitchService }\n"],"names":["metaData","index","entry"],"mappings":";;;;;AAAA,MAAeA,IAAA;AAAA,EACb,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,OAAO;AAAA,EACP,SAAS;AAAA,IACP,YAAY;AAAA,EAChB;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ICUeC,KAAA;AAAA,EACb,GAAGD;AAAA,EACH,OAAAE;AACF;"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/Main.vue","../meta.js","../src/composable/index.ts","../index.ts"],"sourcesContent":["<template>\n <div class=\"toolbar-theme-switch\">\n <tiny-popover\n width=\"130\"\n trigger=\"manual\"\n v-model=\"showpopover\"\n :visible-arrow=\"false\"\n popper-class=\"theme-popover\"\n >\n <div class=\"theme-list\">\n <div\n v-for=\"item in THEME_DATA\"\n :key=\"item.type\"\n :class=\"['theme-item', { active: state.theme === item.type }]\"\n @click=\"themeItemChange(item.type)\"\n >\n {{ item.text }}\n </div>\n </div>\n <template #reference>\n <toolbar-base :content=\"baseContent\" :icon=\"baseIcon\" :options=\"optionsData\" @click-api=\"changeThemeType\">\n <template v-if=\"position === 'collapse'\">\n <div class=\"toolbar-theme-switch-radio\">\n <div class=\"toolbar-theme-switch-radio-title\">主题</div>\n <tiny-radio-group\n v-model=\"state.theme\"\n :options=\"radioThemeList\"\n :vertical=\"themeShowType ? false : true\"\n class=\"theme-radio-group\"\n @change=\"themeChange\"\n >\n </tiny-radio-group>\n </div>\n </template>\n </toolbar-base>\n </template>\n </tiny-popover>\n </div>\n</template>\n\n<script>\nimport { computed, ref } from 'vue'\nimport { ToolbarBase } from '@opentiny/tiny-engine-common'\nimport { TinyRadioGroup, TinyPopover } from '@opentiny/vue'\nimport { getMetaApi, META_SERVICE } from '@opentiny/tiny-engine-meta-register'\n\nexport default {\n components: {\n ToolbarBase,\n TinyRadioGroup,\n TinyPopover\n },\n props: {\n options: {\n type: Object,\n default: () => ({})\n },\n position: {\n type: String,\n default: 'right'\n }\n },\n setup(props) {\n const { getThemeData, getThemeState, themeChange, getTheme } = getMetaApi(META_SERVICE.ThemeSwitch)\n const state = getThemeState()\n const THEME_DATA = getThemeData()\n const COLLAPSE = 'collapse'\n const optionsData = computed(() => {\n const options = { ...props.options }\n if (props.position === COLLAPSE) {\n options.renderType = ''\n }\n\n return options\n })\n const radioThemeList = computed(() => {\n return THEME_DATA.value.map((item) => ({ ...item, label: item.type }))\n })\n const baseContent = computed(() => (props.position === COLLAPSE ? '' : state.themeLabel))\n const baseIcon = computed(() => (props.position === COLLAPSE ? '' : state.themeIcon))\n const showpopover = ref(false)\n\n const themeShowType = computed(() => {\n const filterList = THEME_DATA.value.filter((item) => ['light', 'dark'].includes(item.type)) || []\n return THEME_DATA.value.length === filterList.length\n })\n\n const toChangeTheme = () => {\n const theme = getTheme(state.theme).oppositeTheme\n themeChange(theme)\n }\n\n const changeThemeType = () => {\n if (props.position === COLLAPSE) {\n return\n }\n if (themeShowType.value) {\n toChangeTheme()\n } else {\n showpopover.value = true\n }\n }\n\n const themeItemChange = (theme) => {\n themeChange(theme)\n showpopover.value = false\n }\n\n return {\n THEME_DATA,\n state,\n optionsData,\n radioThemeList,\n baseContent,\n baseIcon,\n toChangeTheme,\n themeChange,\n showpopover,\n themeShowType,\n themeItemChange,\n changeThemeType\n }\n }\n}\n</script>\n<style lang=\"less\" scoped>\n.theme-list {\n .theme-item {\n padding: 4px 16px;\n margin: 0 -16px;\n &:hover {\n background-color: var(--te-toolbar-theme-popover-list-item-bg-color-hover);\n }\n }\n .active {\n background-color: var(--te-toolbar-theme-popover-list-item-bg-color-active);\n }\n}\n</style>\n","export default {\n id: 'engine.toolbars.themeSwitch',\n type: 'toolbars',\n title: 'themeSwitch',\n options: {\n renderType: 'icon'\n }\n}\n","import { reactive, ref } from 'vue'\nimport {\n defineService,\n getMetaApi,\n getMergeMeta,\n META_SERVICE,\n getMergeRegistry\n} from '@opentiny/tiny-engine-meta-register'\nimport { setGlobalMonacoEditorTheme } from '@opentiny/tiny-engine-common'\n\nconst THEME_DATA = ref<any[]>([])\n\nlet DEFAULT_THEME: any = null\n\nconst themeState = reactive({\n theme: '',\n themeLabel: '',\n themeIcon: ''\n})\n\nconst getThemeData = () => THEME_DATA\nconst getThemeState = () => themeState\n\nconst getTheme = (theme: string) => {\n return THEME_DATA.value.find((item) => theme === item.type) || DEFAULT_THEME\n}\n\nconst themeChange = (theme: string) => {\n themeState.theme = getTheme(theme).type\n themeState.themeLabel = getTheme(themeState.theme).text\n themeState.themeIcon = getTheme(themeState.theme).icon\n document.documentElement.setAttribute('data-theme', themeState.theme)\n\n const appId = getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id\n const editorTheme = themeState.theme?.includes('dark') ? 'vs-dark' : 'vs'\n localStorage.setItem(`tiny-engine-theme-${appId}`, themeState.theme)\n setGlobalMonacoEditorTheme(editorTheme)\n}\n\nexport default defineService({\n id: META_SERVICE.ThemeSwitch,\n type: 'MetaService',\n init: () => {\n const appId = getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id\n THEME_DATA.value = getMergeRegistry('themes')\n DEFAULT_THEME = THEME_DATA.value[0]\n const theme =\n localStorage.getItem(`tiny-engine-theme-${appId}`) || getMergeMeta('engine.config').theme || DEFAULT_THEME.type\n themeChange(theme)\n },\n apis: () => ({\n getThemeData,\n getThemeState,\n getTheme,\n themeChange\n })\n})\n","/**\n * Copyright (c) 2023 - present TinyEngine Authors.\n * Copyright (c) 2023 - present Huawei Cloud Computing Technologies Co., Ltd.\n *\n * Use of this source code is governed by an MIT-style license.\n *\n * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,\n * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR\n * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.\n *\n */\n\nimport entry from './src/Main.vue'\nimport metaData from './meta'\nimport { default as ThemeSwitchService } from './src/composable'\nimport './src/styles/vars.less'\n\nexport default {\n ...metaData,\n entry\n}\n\nexport { ThemeSwitchService }\n"],"names":["_sfc_main","ToolbarBase","TinyRadioGroup","TinyPopover","props","getThemeData","getThemeState","themeChange","getTheme","getMetaApi","META_SERVICE","state","THEME_DATA","COLLAPSE","optionsData","computed","options","radioThemeList","item","baseContent","baseIcon","showpopover","ref","themeShowType","filterList","toChangeTheme","theme","_hoisted_1","_hoisted_2","_openBlock","_createElementBlock","_createVNode","_component_tiny_popover","$setup","$event","_component_toolbar_base","$props","_hoisted_4","_cache","_createElementVNode","_component_tiny_radio_group","_Fragment","_renderList","_toDisplayString","_hoisted_3","metaData","DEFAULT_THEME","themeState","reactive","appId","editorTheme","_a","setGlobalMonacoEditorTheme","index$1","defineService","getMergeRegistry","getMergeMeta","index","entry"],"mappings":"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"}
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.theme-list .theme-item[data-v-
|
|
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)}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@opentiny/tiny-engine-toolbar-theme-switch",
|
|
3
|
-
"version": "2.6.0-rc.
|
|
3
|
+
"version": "2.6.0-rc.2",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -25,12 +25,12 @@
|
|
|
25
25
|
"license": "MIT",
|
|
26
26
|
"homepage": "https://opentiny.design/tiny-engine",
|
|
27
27
|
"dependencies": {
|
|
28
|
-
"@opentiny/tiny-engine-common": "2.6.0-rc.
|
|
29
|
-
"@opentiny/tiny-engine-meta-register": "2.6.0-rc.
|
|
30
|
-
"@opentiny/tiny-engine-utils": "2.6.0-rc.
|
|
28
|
+
"@opentiny/tiny-engine-common": "2.6.0-rc.2",
|
|
29
|
+
"@opentiny/tiny-engine-meta-register": "2.6.0-rc.2",
|
|
30
|
+
"@opentiny/tiny-engine-utils": "2.6.0-rc.2"
|
|
31
31
|
},
|
|
32
32
|
"devDependencies": {
|
|
33
|
-
"@opentiny/tiny-engine-vite-plugin-meta-comments": "2.6.0-rc.
|
|
33
|
+
"@opentiny/tiny-engine-vite-plugin-meta-comments": "2.6.0-rc.2",
|
|
34
34
|
"@vitejs/plugin-vue": "^5.1.2",
|
|
35
35
|
"@vitejs/plugin-vue-jsx": "^4.0.1",
|
|
36
36
|
"vite": "^5.4.2"
|
|
@@ -39,5 +39,5 @@
|
|
|
39
39
|
"@opentiny/vue": "^3.20.0",
|
|
40
40
|
"vue": "^3.4.15"
|
|
41
41
|
},
|
|
42
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "c3207eb2df1823d8e03629696d857c9ac2064242"
|
|
43
43
|
}
|