@xto/navigation 0.1.0 → 1.0.0
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/es/index.mjs +226 -195
- package/es/style.css +1 -1
- package/lib/index.cjs +1 -1
- package/lib/style.css +1 -1
- package/package.json +7 -7
package/es/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { useNamespace as
|
|
3
|
-
const q = ["onClick"], Y = /* @__PURE__ */
|
|
1
|
+
import { defineComponent as B, useSlots as L, ref as g, watch as N, provide as X, computed as v, openBlock as r, createElementBlock as d, normalizeClass as a, createElementVNode as f, unref as u, Fragment as V, renderList as G, toDisplayString as y, renderSlot as b, inject as I, withDirectives as O, createCommentVNode as _, vShow as E, normalizeStyle as A, createTextVNode as M, createVNode as H, Transition as D, withCtx as F, onMounted as j } from "vue";
|
|
2
|
+
import { useNamespace as x } from "@xto/core";
|
|
3
|
+
const q = ["onClick"], Y = /* @__PURE__ */ B({
|
|
4
4
|
name: "XTabs",
|
|
5
5
|
__name: "index",
|
|
6
6
|
props: {
|
|
@@ -12,55 +12,55 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
12
12
|
},
|
|
13
13
|
emits: ["update:modelValue", "tabClick", "edit"],
|
|
14
14
|
setup(o, { emit: i }) {
|
|
15
|
-
const e = o,
|
|
16
|
-
|
|
15
|
+
const e = o, s = i, t = x("tabs"), l = L(), p = g(e.modelValue);
|
|
16
|
+
N(() => e.modelValue, (n) => {
|
|
17
17
|
p.value = n;
|
|
18
18
|
});
|
|
19
|
-
const
|
|
20
|
-
p.value = n,
|
|
19
|
+
const $ = (n, m) => {
|
|
20
|
+
p.value = n, s("update:modelValue", n);
|
|
21
21
|
};
|
|
22
|
-
|
|
22
|
+
X("tabs", {
|
|
23
23
|
props: e,
|
|
24
24
|
activeName: p,
|
|
25
|
-
handleTabClick:
|
|
25
|
+
handleTabClick: $
|
|
26
26
|
});
|
|
27
27
|
const C = v(() => [
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
]),
|
|
32
|
-
var
|
|
33
|
-
return (((
|
|
34
|
-
var h,
|
|
28
|
+
t.b(),
|
|
29
|
+
t.m(e.type),
|
|
30
|
+
t.is(`position-${e.tabPosition}`)
|
|
31
|
+
]), k = v(() => {
|
|
32
|
+
var m;
|
|
33
|
+
return (((m = l.default) == null ? void 0 : m.call(l)) || []).filter((c) => c.type && c.type.name === "XTabPane").map((c) => {
|
|
34
|
+
var h, z, w, P;
|
|
35
35
|
return {
|
|
36
|
-
name: ((h = c.props) == null ? void 0 : h.name) || ((
|
|
37
|
-
label: (
|
|
36
|
+
name: ((h = c.props) == null ? void 0 : h.name) || ((z = c.props) == null ? void 0 : z.label),
|
|
37
|
+
label: (w = c.props) == null ? void 0 : w.label,
|
|
38
38
|
disabled: ((P = c.props) == null ? void 0 : P.disabled) === !0
|
|
39
39
|
};
|
|
40
40
|
});
|
|
41
41
|
});
|
|
42
|
-
return (n,
|
|
42
|
+
return (n, m) => (r(), d("div", {
|
|
43
43
|
class: a(C.value)
|
|
44
44
|
}, [
|
|
45
|
-
|
|
46
|
-
class: a(u(
|
|
45
|
+
f("div", {
|
|
46
|
+
class: a(u(t).e("header"))
|
|
47
47
|
}, [
|
|
48
|
-
|
|
49
|
-
class: a(u(
|
|
48
|
+
f("div", {
|
|
49
|
+
class: a(u(t).e("nav"))
|
|
50
50
|
}, [
|
|
51
|
-
(r(!0), d(V, null,
|
|
51
|
+
(r(!0), d(V, null, G(k.value, (c) => (r(), d("div", {
|
|
52
52
|
key: c.name,
|
|
53
53
|
class: a([
|
|
54
|
-
u(
|
|
55
|
-
u(
|
|
56
|
-
u(
|
|
54
|
+
u(t).e("item"),
|
|
55
|
+
u(t).em("item", p.value === c.name ? "active" : ""),
|
|
56
|
+
u(t).is("disabled", c.disabled)
|
|
57
57
|
]),
|
|
58
|
-
onClick: (h) => c.disabled ? null :
|
|
59
|
-
},
|
|
58
|
+
onClick: (h) => c.disabled ? null : $(c.name)
|
|
59
|
+
}, y(c.label), 11, q))), 128))
|
|
60
60
|
], 2)
|
|
61
61
|
], 2),
|
|
62
|
-
|
|
63
|
-
class: a(u(
|
|
62
|
+
f("div", {
|
|
63
|
+
class: a(u(t).e("content"))
|
|
64
64
|
}, [
|
|
65
65
|
b(n.$slots, "default")
|
|
66
66
|
], 2)
|
|
@@ -69,7 +69,7 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
69
69
|
}), J = {
|
|
70
70
|
class: "x-tab-pane",
|
|
71
71
|
role: "tabpanel"
|
|
72
|
-
}, Z = /* @__PURE__ */
|
|
72
|
+
}, Z = /* @__PURE__ */ B({
|
|
73
73
|
name: "XTabPane",
|
|
74
74
|
__name: "TabPane",
|
|
75
75
|
props: {
|
|
@@ -80,16 +80,16 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
80
80
|
lazy: { type: Boolean, default: !1 }
|
|
81
81
|
},
|
|
82
82
|
setup(o) {
|
|
83
|
-
const i = o, e = I("tabs"),
|
|
84
|
-
return
|
|
85
|
-
l.value && i.lazy && !
|
|
86
|
-
}, { immediate: !0 }), l.value && i.lazy && (
|
|
87
|
-
|
|
83
|
+
const i = o, e = I("tabs"), s = g(!1), t = v(() => i.name || i.label), l = v(() => (e == null ? void 0 : e.activeName.value) === t.value);
|
|
84
|
+
return N(() => e == null ? void 0 : e.activeName.value, () => {
|
|
85
|
+
l.value && i.lazy && !s.value && (s.value = !0);
|
|
86
|
+
}, { immediate: !0 }), l.value && i.lazy && (s.value = !0), (p, $) => O((r(), d("div", J, [
|
|
87
|
+
s.value || !o.lazy ? b(p.$slots, "default", { key: 0 }) : _("", !0)
|
|
88
88
|
], 512)), [
|
|
89
89
|
[E, l.value]
|
|
90
90
|
]);
|
|
91
91
|
}
|
|
92
|
-
}), ee = /* @__PURE__ */
|
|
92
|
+
}), ee = /* @__PURE__ */ B({
|
|
93
93
|
name: "XMenu",
|
|
94
94
|
__name: "index",
|
|
95
95
|
props: {
|
|
@@ -104,40 +104,40 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
104
104
|
},
|
|
105
105
|
emits: ["update:modelValue", "select", "open", "close"],
|
|
106
106
|
setup(o, { emit: i }) {
|
|
107
|
-
const e = o,
|
|
108
|
-
|
|
107
|
+
const e = o, s = i, t = x("menu"), l = g(e.modelValue), p = g([...e.defaultOpeneds]);
|
|
108
|
+
N(() => e.modelValue, (c) => {
|
|
109
109
|
l.value = c;
|
|
110
|
-
}),
|
|
110
|
+
}), X("menu", {
|
|
111
111
|
props: e,
|
|
112
112
|
activeIndex: l,
|
|
113
113
|
openedMenus: p,
|
|
114
114
|
handleSelect: (c, h = []) => {
|
|
115
|
-
l.value = c,
|
|
115
|
+
l.value = c, s("update:modelValue", c), s("select", c, h);
|
|
116
116
|
},
|
|
117
117
|
handleOpen: (c, h = []) => {
|
|
118
|
-
p.value.includes(c) || p.value.push(c),
|
|
118
|
+
p.value.includes(c) || p.value.push(c), s("open", c, h);
|
|
119
119
|
},
|
|
120
120
|
handleClose: (c, h = []) => {
|
|
121
|
-
const
|
|
122
|
-
|
|
121
|
+
const z = p.value.indexOf(c);
|
|
122
|
+
z > -1 && p.value.splice(z, 1), s("close", c, h);
|
|
123
123
|
}
|
|
124
124
|
});
|
|
125
125
|
const n = v(() => [
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
]),
|
|
126
|
+
t.b(),
|
|
127
|
+
t.is("collapse", e.collapse),
|
|
128
|
+
t.is(`mode-${e.mode}`)
|
|
129
|
+
]), m = v(() => ({
|
|
130
130
|
backgroundColor: e.backgroundColor,
|
|
131
131
|
color: e.textColor
|
|
132
132
|
}));
|
|
133
133
|
return (c, h) => (r(), d("ul", {
|
|
134
134
|
class: a(n.value),
|
|
135
|
-
style: A(
|
|
135
|
+
style: A(m.value)
|
|
136
136
|
}, [
|
|
137
137
|
b(c.$slots, "default")
|
|
138
138
|
], 6));
|
|
139
139
|
}
|
|
140
|
-
}),
|
|
140
|
+
}), T = "x-menu-item", se = /* @__PURE__ */ B({
|
|
141
141
|
name: "XMenuItem",
|
|
142
142
|
__name: "MenuItem",
|
|
143
143
|
props: {
|
|
@@ -146,34 +146,45 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
146
146
|
icon: {}
|
|
147
147
|
},
|
|
148
148
|
setup(o) {
|
|
149
|
-
const i = o, e = I("menu")
|
|
150
|
-
|
|
149
|
+
const i = o, e = I("menu");
|
|
150
|
+
L();
|
|
151
|
+
const s = v(() => (e == null ? void 0 : e.activeIndex.value) === i.index), t = v(() => e == null ? void 0 : e.props.collapse), l = v(() => (e == null ? void 0 : e.props.mode) === "horizontal"), p = v(() => [
|
|
152
|
+
T,
|
|
151
153
|
{
|
|
152
|
-
"is-active":
|
|
154
|
+
"is-active": s.value,
|
|
153
155
|
"is-disabled": i.disabled,
|
|
154
156
|
"is-horizontal": l.value,
|
|
155
|
-
"is-collapse":
|
|
157
|
+
"is-collapse": t.value
|
|
156
158
|
}
|
|
157
|
-
]),
|
|
159
|
+
]), $ = v(() => s.value && (e != null && e.props.activeTextColor) ? { color: e.props.activeTextColor } : {}), C = () => {
|
|
158
160
|
i.disabled || i.index && (e == null || e.handleSelect(i.index, [i.index]));
|
|
159
161
|
};
|
|
160
|
-
return (
|
|
162
|
+
return (k, n) => (r(), d("li", {
|
|
161
163
|
class: a(p.value),
|
|
162
|
-
style: A(
|
|
164
|
+
style: A($.value),
|
|
163
165
|
onClick: C
|
|
164
166
|
}, [
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
class: a(N + "__icon")
|
|
168
|
-
}, k(o.icon), 3)) : _("", !0),
|
|
169
|
-
m("span", {
|
|
170
|
-
class: a(N + "__text")
|
|
167
|
+
f("div", {
|
|
168
|
+
class: a(T + "__content")
|
|
171
169
|
}, [
|
|
172
|
-
|
|
170
|
+
o.icon ? (r(), d("span", {
|
|
171
|
+
key: 0,
|
|
172
|
+
class: a(T + "__icon")
|
|
173
|
+
}, y(o.icon), 3)) : k.$slots.icon ? (r(), d("span", {
|
|
174
|
+
key: 1,
|
|
175
|
+
class: a(T + "__icon")
|
|
176
|
+
}, [
|
|
177
|
+
b(k.$slots, "icon")
|
|
178
|
+
], 2)) : _("", !0),
|
|
179
|
+
f("span", {
|
|
180
|
+
class: a(T + "__text")
|
|
181
|
+
}, [
|
|
182
|
+
b(k.$slots, "default")
|
|
183
|
+
], 2)
|
|
173
184
|
], 2)
|
|
174
185
|
], 6));
|
|
175
186
|
}
|
|
176
|
-
}), K = { class: "x-menu-item-group" }, Q = { class: "x-menu-item-group__title" },
|
|
187
|
+
}), K = { class: "x-menu-item-group" }, Q = { class: "x-menu-item-group__title" }, te = /* @__PURE__ */ B({
|
|
177
188
|
name: "XMenuItemGroup",
|
|
178
189
|
__name: "MenuItemGroup",
|
|
179
190
|
props: {
|
|
@@ -181,13 +192,13 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
181
192
|
},
|
|
182
193
|
setup(o) {
|
|
183
194
|
return (i, e) => (r(), d("li", K, [
|
|
184
|
-
|
|
185
|
-
|
|
195
|
+
f("div", Q, y(o.title), 1),
|
|
196
|
+
f("ul", null, [
|
|
186
197
|
b(i.$slots, "default")
|
|
187
198
|
])
|
|
188
199
|
]));
|
|
189
200
|
}
|
|
190
|
-
}),
|
|
201
|
+
}), S = "x-sub-menu", ae = /* @__PURE__ */ B({
|
|
191
202
|
name: "XSubMenu",
|
|
192
203
|
__name: "SubMenu",
|
|
193
204
|
props: {
|
|
@@ -197,64 +208,84 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
197
208
|
icon: {}
|
|
198
209
|
},
|
|
199
210
|
setup(o) {
|
|
200
|
-
const i = o, e = I("menu"),
|
|
201
|
-
|
|
202
|
-
|
|
211
|
+
const i = o, e = I("menu"), s = I("subMenu", null), t = g(!1), l = v(() => !!s), p = v(() => e == null ? void 0 : e.props.collapse), $ = v(() => (e == null ? void 0 : e.activeIndex.value) === i.index), C = v(() => [
|
|
212
|
+
S,
|
|
213
|
+
S + ((e == null ? void 0 : e.props.mode) === "horizontal" ? "--horizontal" : "--vertical"),
|
|
203
214
|
{
|
|
204
|
-
"is-active":
|
|
205
|
-
"is-opened":
|
|
215
|
+
"is-active": $.value,
|
|
216
|
+
"is-opened": t.value,
|
|
206
217
|
"is-disabled": i.disabled,
|
|
207
218
|
"is-nested": l.value,
|
|
208
219
|
"is-collapse": p.value
|
|
209
220
|
}
|
|
210
|
-
]),
|
|
211
|
-
i.disabled || p.value || (
|
|
221
|
+
]), k = () => {
|
|
222
|
+
i.disabled || p.value || (t.value = !t.value);
|
|
212
223
|
}, n = () => {
|
|
213
|
-
i.disabled || ((e == null ? void 0 : e.props.mode) === "horizontal" || p.value) && (
|
|
214
|
-
},
|
|
215
|
-
((e == null ? void 0 : e.props.mode) === "horizontal" || p.value) && (
|
|
224
|
+
i.disabled || ((e == null ? void 0 : e.props.mode) === "horizontal" || p.value) && (t.value = !0);
|
|
225
|
+
}, m = () => {
|
|
226
|
+
((e == null ? void 0 : e.props.mode) === "horizontal" || p.value) && (t.value = !1);
|
|
216
227
|
};
|
|
217
|
-
return
|
|
218
|
-
isOpen:
|
|
228
|
+
return X("subMenu", {
|
|
229
|
+
isOpen: t,
|
|
219
230
|
isNested: l
|
|
220
231
|
}), (c, h) => {
|
|
221
|
-
var
|
|
232
|
+
var z;
|
|
222
233
|
return r(), d("li", {
|
|
223
234
|
class: a(C.value),
|
|
224
235
|
onMouseenter: n,
|
|
225
|
-
onMouseleave:
|
|
236
|
+
onMouseleave: m
|
|
226
237
|
}, [
|
|
227
|
-
|
|
228
|
-
class: a(
|
|
229
|
-
onClick:
|
|
238
|
+
f("div", {
|
|
239
|
+
class: a(S + "__title"),
|
|
240
|
+
onClick: k
|
|
230
241
|
}, [
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
class: a(z + "__icon")
|
|
234
|
-
}, k(o.icon), 3)) : _("", !0),
|
|
235
|
-
m("span", {
|
|
236
|
-
class: a(z + "__text")
|
|
242
|
+
f("div", {
|
|
243
|
+
class: a(S + "__content")
|
|
237
244
|
}, [
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
+
o.icon ? (r(), d("span", {
|
|
246
|
+
key: 0,
|
|
247
|
+
class: a(S + "__icon")
|
|
248
|
+
}, y(o.icon), 3)) : c.$slots.icon ? (r(), d("span", {
|
|
249
|
+
key: 1,
|
|
250
|
+
class: a(S + "__icon")
|
|
251
|
+
}, [
|
|
252
|
+
b(c.$slots, "icon")
|
|
253
|
+
], 2)) : _("", !0),
|
|
254
|
+
f("span", {
|
|
255
|
+
class: a(S + "__text")
|
|
256
|
+
}, [
|
|
257
|
+
b(c.$slots, "title", {}, () => [
|
|
258
|
+
M(y(o.title), 1)
|
|
259
|
+
])
|
|
260
|
+
], 2),
|
|
261
|
+
f("span", {
|
|
262
|
+
class: a([S + "__arrow", { "is-open": t.value }])
|
|
263
|
+
}, [...h[0] || (h[0] = [
|
|
264
|
+
f("svg", {
|
|
265
|
+
viewBox: "0 0 1024 1024",
|
|
266
|
+
width: "12",
|
|
267
|
+
height: "12"
|
|
268
|
+
}, [
|
|
269
|
+
f("path", {
|
|
270
|
+
fill: "currentColor",
|
|
271
|
+
d: "M512 714.667c-17.067 0-32-6.4-44.8-19.2L147.2 375.467c-25.6-25.6-25.6-64 0-89.6s64-25.6 89.6 0L512 561.067l275.2-275.2c25.6-25.6 64-25.6 89.6 0s25.6 64 0 89.6L556.8 695.467c-12.8 12.8-27.733 19.2-44.8 19.2z"
|
|
272
|
+
})
|
|
273
|
+
], -1)
|
|
274
|
+
])], 2)
|
|
275
|
+
], 2)
|
|
245
276
|
], 2),
|
|
246
|
-
|
|
247
|
-
name: ((
|
|
277
|
+
H(D, {
|
|
278
|
+
name: ((z = u(e)) == null ? void 0 : z.props.mode) === "horizontal" ? "zoom-in-top" : "zoom-in-left"
|
|
248
279
|
}, {
|
|
249
280
|
default: F(() => {
|
|
250
|
-
var
|
|
281
|
+
var w;
|
|
251
282
|
return [
|
|
252
|
-
O(
|
|
253
|
-
class: a([
|
|
283
|
+
O(f("ul", {
|
|
284
|
+
class: a([S + "__menu", { "is-horizontal": ((w = u(e)) == null ? void 0 : w.props.mode) === "horizontal", "is-collapse": p.value }])
|
|
254
285
|
}, [
|
|
255
286
|
b(c.$slots, "default")
|
|
256
287
|
], 2), [
|
|
257
|
-
[E,
|
|
288
|
+
[E, t.value]
|
|
258
289
|
])
|
|
259
290
|
];
|
|
260
291
|
}),
|
|
@@ -263,7 +294,7 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
263
294
|
], 34);
|
|
264
295
|
};
|
|
265
296
|
}
|
|
266
|
-
}), le = /* @__PURE__ */
|
|
297
|
+
}), le = /* @__PURE__ */ B({
|
|
267
298
|
name: "XBreadcrumb",
|
|
268
299
|
__name: "index",
|
|
269
300
|
props: {
|
|
@@ -271,24 +302,24 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
271
302
|
separatorIcon: {}
|
|
272
303
|
},
|
|
273
304
|
setup(o) {
|
|
274
|
-
const i = o, e =
|
|
275
|
-
|
|
305
|
+
const i = o, e = x("breadcrumb");
|
|
306
|
+
X("breadcrumb", {
|
|
276
307
|
separator: v(() => i.separator),
|
|
277
308
|
separatorIcon: v(() => i.separatorIcon)
|
|
278
309
|
});
|
|
279
|
-
const
|
|
280
|
-
return (
|
|
281
|
-
class: a(
|
|
310
|
+
const s = v(() => [e.b()]);
|
|
311
|
+
return (t, l) => (r(), d("nav", {
|
|
312
|
+
class: a(s.value),
|
|
282
313
|
"aria-label": "Breadcrumb"
|
|
283
314
|
}, [
|
|
284
|
-
|
|
315
|
+
f("ol", {
|
|
285
316
|
class: a(u(e).e("list"))
|
|
286
317
|
}, [
|
|
287
|
-
b(
|
|
318
|
+
b(t.$slots, "default")
|
|
288
319
|
], 2)
|
|
289
320
|
], 2));
|
|
290
321
|
}
|
|
291
|
-
}), R = ["aria-current"], ne = /* @__PURE__ */
|
|
322
|
+
}), R = ["aria-current"], ne = /* @__PURE__ */ B({
|
|
292
323
|
name: "XBreadcrumbItem",
|
|
293
324
|
__name: "BreadcrumbItem",
|
|
294
325
|
props: {
|
|
@@ -298,49 +329,49 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
298
329
|
},
|
|
299
330
|
emits: ["click"],
|
|
300
331
|
setup(o, { emit: i }) {
|
|
301
|
-
const e = o,
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
]),
|
|
332
|
+
const e = o, s = i, t = x("breadcrumb"), l = I("breadcrumb"), p = v(() => [
|
|
333
|
+
t.e("item"),
|
|
334
|
+
t.is("link", !!e.to && !e.disabled),
|
|
335
|
+
t.is("disabled", e.disabled)
|
|
336
|
+
]), $ = v(() => {
|
|
306
337
|
var n;
|
|
307
338
|
return ((n = l == null ? void 0 : l.separator) == null ? void 0 : n.value) || "/";
|
|
308
339
|
}), C = v(() => {
|
|
309
340
|
var n;
|
|
310
341
|
return (n = l == null ? void 0 : l.separatorIcon) == null ? void 0 : n.value;
|
|
311
|
-
}),
|
|
312
|
-
e.disabled || (
|
|
342
|
+
}), k = (n) => {
|
|
343
|
+
e.disabled || (s("click", n), e.to && typeof e.to == "string" && (e.replace ? window.location.replace(e.to) : window.location.href = e.to));
|
|
313
344
|
};
|
|
314
|
-
return (n,
|
|
345
|
+
return (n, m) => (r(), d("li", {
|
|
315
346
|
class: a(p.value)
|
|
316
347
|
}, [
|
|
317
348
|
o.to && !o.disabled ? (r(), d("span", {
|
|
318
349
|
key: 0,
|
|
319
|
-
class: a(u(
|
|
320
|
-
onClick:
|
|
350
|
+
class: a(u(t).e("link")),
|
|
351
|
+
onClick: k
|
|
321
352
|
}, [
|
|
322
353
|
b(n.$slots, "default")
|
|
323
354
|
], 2)) : (r(), d("span", {
|
|
324
355
|
key: 1,
|
|
325
|
-
class: a(u(
|
|
356
|
+
class: a(u(t).e("text")),
|
|
326
357
|
"aria-current": o.disabled ? "page" : void 0
|
|
327
358
|
}, [
|
|
328
359
|
b(n.$slots, "default")
|
|
329
360
|
], 10, R)),
|
|
330
|
-
|
|
331
|
-
class: a(u(
|
|
361
|
+
f("span", {
|
|
362
|
+
class: a(u(t).e("separator")),
|
|
332
363
|
"aria-hidden": "true"
|
|
333
364
|
}, [
|
|
334
365
|
C.value ? (r(), d("span", {
|
|
335
366
|
key: 0,
|
|
336
|
-
class: a(u(
|
|
337
|
-
},
|
|
338
|
-
|
|
367
|
+
class: a(u(t).e("separator-icon"))
|
|
368
|
+
}, y(C.value), 3)) : (r(), d(V, { key: 1 }, [
|
|
369
|
+
M(y($.value), 1)
|
|
339
370
|
], 64))
|
|
340
371
|
], 2)
|
|
341
372
|
], 2));
|
|
342
373
|
}
|
|
343
|
-
}), oe = /* @__PURE__ */
|
|
374
|
+
}), oe = /* @__PURE__ */ B({
|
|
344
375
|
name: "XSteps",
|
|
345
376
|
__name: "index",
|
|
346
377
|
props: {
|
|
@@ -354,36 +385,36 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
354
385
|
},
|
|
355
386
|
emits: ["change", "update:active"],
|
|
356
387
|
setup(o, { emit: i }) {
|
|
357
|
-
const e = o,
|
|
358
|
-
|
|
359
|
-
l.value =
|
|
360
|
-
}),
|
|
388
|
+
const e = o, s = i, t = x("steps"), l = g(e.active), p = g(0);
|
|
389
|
+
N(() => e.active, (m) => {
|
|
390
|
+
l.value = m;
|
|
391
|
+
}), X("steps", {
|
|
361
392
|
props: e,
|
|
362
393
|
currentActive: l,
|
|
363
394
|
stepCount: p,
|
|
364
|
-
setCurrentActive: (
|
|
365
|
-
l.value =
|
|
395
|
+
setCurrentActive: (m) => {
|
|
396
|
+
l.value = m, s("change", m), s("update:active", m);
|
|
366
397
|
},
|
|
367
|
-
setStepCount: (
|
|
368
|
-
p.value =
|
|
398
|
+
setStepCount: (m) => {
|
|
399
|
+
p.value = m;
|
|
369
400
|
}
|
|
370
401
|
});
|
|
371
|
-
const
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
402
|
+
const k = v(() => [
|
|
403
|
+
t.b(),
|
|
404
|
+
t.m(e.direction),
|
|
405
|
+
t.is("simple", e.simple),
|
|
406
|
+
t.is("center", e.alignCenter)
|
|
376
407
|
]), n = v(() => e.space ? {
|
|
377
408
|
"--steps-space": typeof e.space == "number" ? `${e.space}px` : e.space
|
|
378
409
|
} : {});
|
|
379
|
-
return (
|
|
380
|
-
class: a(
|
|
410
|
+
return (m, c) => (r(), d("div", {
|
|
411
|
+
class: a(k.value),
|
|
381
412
|
style: A(n.value)
|
|
382
413
|
}, [
|
|
383
|
-
b(
|
|
414
|
+
b(m.$slots, "default")
|
|
384
415
|
], 6));
|
|
385
416
|
}
|
|
386
|
-
}), ce = /* @__PURE__ */
|
|
417
|
+
}), ce = /* @__PURE__ */ B({
|
|
387
418
|
name: "XStep",
|
|
388
419
|
__name: "Step",
|
|
389
420
|
props: {
|
|
@@ -393,19 +424,19 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
393
424
|
status: {}
|
|
394
425
|
},
|
|
395
426
|
setup(o) {
|
|
396
|
-
const i = o, e =
|
|
427
|
+
const i = o, e = x("step"), s = I("steps"), t = g(-1);
|
|
397
428
|
j(() => {
|
|
398
|
-
|
|
429
|
+
s && (t.value = s.stepCount.value, s.setStepCount(s.stepCount.value + 1));
|
|
399
430
|
});
|
|
400
431
|
const l = v(() => {
|
|
401
|
-
var
|
|
432
|
+
var m, c, h;
|
|
402
433
|
if (i.status) return i.status;
|
|
403
|
-
const n = ((
|
|
404
|
-
return
|
|
434
|
+
const n = ((m = s == null ? void 0 : s.currentActive) == null ? void 0 : m.value) ?? 0;
|
|
435
|
+
return t.value < n ? ((c = s == null ? void 0 : s.props) == null ? void 0 : c.finishStatus) || "finish" : t.value === n ? ((h = s == null ? void 0 : s.props) == null ? void 0 : h.processStatus) || "process" : "wait";
|
|
405
436
|
}), p = v(() => {
|
|
406
437
|
var n;
|
|
407
|
-
return
|
|
408
|
-
}),
|
|
438
|
+
return t.value === (((n = s == null ? void 0 : s.stepCount) == null ? void 0 : n.value) || 0) - 1;
|
|
439
|
+
}), $ = v(() => t.value === 0);
|
|
409
440
|
v(() => ({
|
|
410
441
|
wait: "#c0c4cc",
|
|
411
442
|
process: "#409eff",
|
|
@@ -419,39 +450,39 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
419
450
|
e.b(),
|
|
420
451
|
e.is(l.value),
|
|
421
452
|
e.is("last", p.value),
|
|
422
|
-
e.m(((n =
|
|
453
|
+
e.m(((n = s == null ? void 0 : s.props) == null ? void 0 : n.direction) || "horizontal")
|
|
423
454
|
];
|
|
424
|
-
}),
|
|
455
|
+
}), k = () => {
|
|
425
456
|
var n;
|
|
426
|
-
|
|
457
|
+
t.value > -1 && ((n = s == null ? void 0 : s.setCurrentActive) == null || n.call(s, t.value));
|
|
427
458
|
};
|
|
428
|
-
return (n,
|
|
459
|
+
return (n, m) => (r(), d("div", {
|
|
429
460
|
class: a(C.value),
|
|
430
|
-
onClick:
|
|
461
|
+
onClick: k
|
|
431
462
|
}, [
|
|
432
|
-
|
|
463
|
+
f("div", {
|
|
433
464
|
class: a(u(e).e("head"))
|
|
434
465
|
}, [
|
|
435
|
-
|
|
466
|
+
$.value ? _("", !0) : (r(), d("div", {
|
|
436
467
|
key: 0,
|
|
437
468
|
class: a([u(e).e("line"), u(e).em("line", "prev")])
|
|
438
469
|
}, null, 2)),
|
|
439
|
-
|
|
470
|
+
f("div", {
|
|
440
471
|
class: a(u(e).e("icon"))
|
|
441
472
|
}, [
|
|
442
473
|
o.icon ? (r(), d("span", {
|
|
443
474
|
key: 0,
|
|
444
475
|
class: a(u(e).e("icon-inner"))
|
|
445
|
-
},
|
|
476
|
+
}, y(o.icon), 3)) : (r(), d("span", {
|
|
446
477
|
key: 1,
|
|
447
478
|
class: a(u(e).e("icon-inner"))
|
|
448
479
|
}, [
|
|
449
480
|
l.value === "finish" || l.value === "success" ? (r(), d(V, { key: 0 }, [
|
|
450
|
-
|
|
481
|
+
M("✓")
|
|
451
482
|
], 64)) : l.value === "error" ? (r(), d(V, { key: 1 }, [
|
|
452
|
-
|
|
483
|
+
M("✕")
|
|
453
484
|
], 64)) : (r(), d(V, { key: 2 }, [
|
|
454
|
-
|
|
485
|
+
M(y(t.value + 1), 1)
|
|
455
486
|
], 64))
|
|
456
487
|
], 2))
|
|
457
488
|
], 2),
|
|
@@ -460,14 +491,14 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
460
491
|
class: a(u(e).e("line"))
|
|
461
492
|
}, null, 2))
|
|
462
493
|
], 2),
|
|
463
|
-
|
|
494
|
+
f("div", {
|
|
464
495
|
class: a(u(e).e("content"))
|
|
465
496
|
}, [
|
|
466
|
-
|
|
497
|
+
f("div", {
|
|
467
498
|
class: a(u(e).e("title"))
|
|
468
499
|
}, [
|
|
469
500
|
b(n.$slots, "title", {}, () => [
|
|
470
|
-
|
|
501
|
+
M(y(o.title), 1)
|
|
471
502
|
])
|
|
472
503
|
], 2),
|
|
473
504
|
o.description || n.$slots.description ? (r(), d("div", {
|
|
@@ -475,13 +506,13 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
475
506
|
class: a(u(e).e("description"))
|
|
476
507
|
}, [
|
|
477
508
|
b(n.$slots, "description", {}, () => [
|
|
478
|
-
|
|
509
|
+
M(y(o.description), 1)
|
|
479
510
|
])
|
|
480
511
|
], 2)) : _("", !0)
|
|
481
512
|
], 2)
|
|
482
513
|
], 2));
|
|
483
514
|
}
|
|
484
|
-
}), ie = /* @__PURE__ */
|
|
515
|
+
}), ie = /* @__PURE__ */ B({
|
|
485
516
|
name: "XPageHeader",
|
|
486
517
|
__name: "index",
|
|
487
518
|
props: {
|
|
@@ -492,62 +523,62 @@ const q = ["onClick"], Y = /* @__PURE__ */ S({
|
|
|
492
523
|
},
|
|
493
524
|
emits: ["back"],
|
|
494
525
|
setup(o, { emit: i }) {
|
|
495
|
-
const e = i,
|
|
526
|
+
const e = i, s = x("page-header"), t = () => {
|
|
496
527
|
e("back");
|
|
497
528
|
};
|
|
498
529
|
return (l, p) => (r(), d("div", {
|
|
499
|
-
class: a(u(
|
|
530
|
+
class: a(u(s).b())
|
|
500
531
|
}, [
|
|
501
|
-
|
|
502
|
-
class: a(u(
|
|
532
|
+
f("div", {
|
|
533
|
+
class: a(u(s).e("main"))
|
|
503
534
|
}, [
|
|
504
|
-
|
|
505
|
-
class: a(u(
|
|
535
|
+
f("div", {
|
|
536
|
+
class: a(u(s).e("left"))
|
|
506
537
|
}, [
|
|
507
538
|
o.showBack ? (r(), d("span", {
|
|
508
539
|
key: 0,
|
|
509
|
-
class: a(u(
|
|
510
|
-
onClick:
|
|
540
|
+
class: a(u(s).e("back")),
|
|
541
|
+
onClick: t
|
|
511
542
|
}, [
|
|
512
|
-
|
|
513
|
-
class: a(u(
|
|
543
|
+
f("span", {
|
|
544
|
+
class: a(u(s).e("back-icon"))
|
|
514
545
|
}, "←", 2),
|
|
515
546
|
o.backText ? (r(), d("span", {
|
|
516
547
|
key: 0,
|
|
517
|
-
class: a(u(
|
|
518
|
-
},
|
|
548
|
+
class: a(u(s).e("back-text"))
|
|
549
|
+
}, y(o.backText), 3)) : _("", !0)
|
|
519
550
|
], 2)) : _("", !0),
|
|
520
|
-
|
|
521
|
-
class: a(u(
|
|
551
|
+
f("span", {
|
|
552
|
+
class: a(u(s).e("title"))
|
|
522
553
|
}, [
|
|
523
554
|
b(l.$slots, "title", {}, () => [
|
|
524
|
-
|
|
555
|
+
M(y(o.title), 1)
|
|
525
556
|
])
|
|
526
557
|
], 2),
|
|
527
558
|
o.subtitle || l.$slots.subtitle ? (r(), d("span", {
|
|
528
559
|
key: 1,
|
|
529
|
-
class: a(u(
|
|
560
|
+
class: a(u(s).e("subtitle"))
|
|
530
561
|
}, [
|
|
531
562
|
b(l.$slots, "subtitle", {}, () => [
|
|
532
|
-
|
|
563
|
+
M(y(o.subtitle), 1)
|
|
533
564
|
])
|
|
534
565
|
], 2)) : _("", !0)
|
|
535
566
|
], 2),
|
|
536
|
-
|
|
537
|
-
class: a(u(
|
|
567
|
+
f("div", {
|
|
568
|
+
class: a(u(s).e("extra"))
|
|
538
569
|
}, [
|
|
539
570
|
b(l.$slots, "extra")
|
|
540
571
|
], 2)
|
|
541
572
|
], 2),
|
|
542
573
|
l.$slots.default ? (r(), d("div", {
|
|
543
574
|
key: 0,
|
|
544
|
-
class: a(u(
|
|
575
|
+
class: a(u(s).e("content"))
|
|
545
576
|
}, [
|
|
546
577
|
b(l.$slots, "default")
|
|
547
578
|
], 2)) : _("", !0),
|
|
548
579
|
l.$slots.footer ? (r(), d("div", {
|
|
549
580
|
key: 1,
|
|
550
|
-
class: a(u(
|
|
581
|
+
class: a(u(s).e("footer"))
|
|
551
582
|
}, [
|
|
552
583
|
b(l.$slots, "footer")
|
|
553
584
|
], 2)) : _("", !0)
|
|
@@ -558,8 +589,8 @@ export {
|
|
|
558
589
|
le as Breadcrumb,
|
|
559
590
|
ne as BreadcrumbItem,
|
|
560
591
|
ee as Menu,
|
|
561
|
-
|
|
562
|
-
|
|
592
|
+
se as MenuItem,
|
|
593
|
+
te as MenuItemGroup,
|
|
563
594
|
ie as PageHeader,
|
|
564
595
|
ce as Step,
|
|
565
596
|
oe as Steps,
|
package/es/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.x-tabs__header{position:relative}.x-tabs__nav{display:flex;border-bottom:2px solid #e4e7ed}.x-tabs__item{padding:0 20px;height:40px;line-height:40px;font-size:14px;color:#606266;cursor:pointer;transition:color .2s;position:relative}.x-tabs__item:hover{color:#409eff}.x-tabs__item--active{color:#409eff;font-weight:500}.x-tabs__item--active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:2px;background-color:#409eff}.x-tabs__item.is-disabled{color:#c0c4cc;cursor:not-allowed}.x-tabs__item.is-disabled:hover{color:#c0c4cc}.x-tabs__content{padding:20px 0}.x-tabs--card .x-tabs__nav{border-bottom:none}.x-tabs--card .x-tabs__item{border:1px solid #e4e7ed;border-bottom:none;margin-right:-1px;padding:0 16px}.x-tabs--card .x-tabs__item--active{background-color:#fff;border-bottom:1px solid #fff}.x-tab-pane{padding:20px;outline:none}.x-menu{list-style:none;margin:0;padding:0;position:relative;font-size:14px;box-sizing:border-box}.x-menu--vertical{display:block;width:220px;min-height:100%;border-right:1px solid #e6e6e6;transition:width .3s ease}.x-menu--vertical>.x-menu-item,.x-menu--vertical>.x-sub-menu{display:block;width:100%}.x-menu--horizontal{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;width:100%;border-bottom:1px solid #e6e6e6}.x-menu--horizontal>.x-menu-item,.x-menu--horizontal>.x-sub-menu{flex:0 0 auto}.x-menu.is-collapse{width:64px}.x-menu.is-collapse>.x-menu-item{height:48px;line-height:48px;padding:0;text-align:center}.x-menu.is-collapse>.x-menu-item .x-menu-item__text{display:none}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title{height:48px;line-height:48px;padding:0;text-align:center;justify-content:center}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__text,.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__arrow{display:none}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__icon{margin-right:0}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu{position:absolute;left:64px;top:0;width:180px;box-shadow:0 2px 12px #0000001a;border-radius:4px;z-index:100}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-menu-item{height:56px;line-height:56px;padding:0 20px;text-align:left}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-menu-item .x-menu-item__text{display:inline}.x-menu.is-dark{background-color:#1f2d3d;border-color:#1f2d3d;color:#bfcbd9}.x-menu.is-dark .x-menu-item,.x-menu.is-dark .x-sub-menu__title{color:#bfcbd9}.x-menu.is-dark .x-menu-item:hover,.x-menu.is-dark .x-sub-menu__title:hover{background-color:#263445}.x-menu.is-dark .x-menu-item.is-active{color:#409eff;background-color:#263445}.x-menu.is-dark .x-sub-menu__menu{background-color:#1f2d3d}.x-menu-item{list-style:none;margin:0;padding:0 20px;cursor:pointer;transition:all .3s ease;height:50px;line-height:50px;color:#303133;position:relative;white-space:nowrap;box-sizing:border-box}.x-menu-item__icon{margin-right:8px;font-size:18px}.x-menu-item__text{vertical-align:middle}.x-menu-item:hover{background-color:#f0f7ff}.x-menu-item.is-active{color:#409eff;background-color:#ecf5ff}.x-menu-item.is-active:not(.is-horizontal):before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:#409eff}.x-menu-item.is-collapse{padding:0;height:48px;line-height:48px;text-align:center}.x-menu-item.is-collapse .x-menu-item__icon{margin-right:0;font-size:20px}.x-menu-item.is-collapse .x-menu-item__text{display:none}.x-menu-item.is-horizontal{display:inline-block;height:56px;line-height:56px}.x-menu-item.is-horizontal:hover{background-color:transparent}.x-menu-item.is-horizontal.is-active{background-color:transparent;border-bottom:2px solid #409eff}.x-menu-item.is-disabled{color:#c0c4cc;cursor:not-allowed}.x-menu-item.is-disabled:hover{background-color:transparent}.x-menu-item-group{list-style:none}.x-menu-item-group__title{padding:20px 20px 10px;font-size:13px;color:#909399;line-height:1}.x-menu-item-group>ul{padding:0}.x-sub-menu{list-style:none;margin:0;padding:0;position:relative}.x-sub-menu__title{display:flex;align-items:center;cursor:pointer;transition:all .3s ease;color:#303133}.x-sub-menu__icon{margin-right:8px;font-size:18px}.x-sub-menu__text{flex:1}.x-sub-menu__arrow{font-size:12px;transition:transform .3s;color:#909399;margin-left:4px}.x-sub-menu__arrow.is-open{transform:rotate(180deg)}.x-sub-menu__menu{list-style:none;margin:0;padding:0;background-color:#fff}.x-sub-menu--vertical{display:block;width:100%}.x-sub-menu--vertical .x-sub-menu__title{height:50px;line-height:50px;padding:0 20px}.x-sub-menu--vertical .x-sub-menu__title:hover{background-color:#f0f7ff}.x-sub-menu--vertical .x-sub-menu__menu{min-width:200px;border-right:none}.x-sub-menu--vertical .x-sub-menu__menu .x-menu-item{padding-left:40px}.x-sub-menu--vertical.is-nested .x-sub-menu__menu{position:absolute;left:100%;top:0;box-shadow:0 2px 12px #0000001a;border-radius:4px}.x-sub-menu--horizontal{display:inline-block;height:56px}.x-sub-menu--horizontal .x-sub-menu__title{height:56px;line-height:56px;padding:0 20px}.x-sub-menu--horizontal .x-sub-menu__title:hover{background-color:transparent}.x-sub-menu--horizontal .x-sub-menu__menu{position:absolute;top:100%;left:0;min-width:180px;box-shadow:0 2px 12px #0000001a;border-radius:4px;z-index:100}.x-sub-menu--horizontal .x-sub-menu__menu .x-menu-item{display:block;height:50px;line-height:50px;padding-left:20px}.x-sub-menu--horizontal .x-sub-menu__menu .x-menu-item.is-active:before{display:none}.x-sub-menu.is-collapse>.x-sub-menu__title{height:48px;line-height:48px;padding:0;text-align:center;justify-content:center}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__text,.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__arrow{display:none}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__icon{margin-right:0;font-size:20px}.x-sub-menu.is-collapse>.x-sub-menu__menu{position:absolute;left:64px;top:0;width:180px;box-shadow:0 2px 12px #0000001a;border-radius:4px;z-index:100}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-menu-item{height:50px;line-height:50px;padding:0 20px;text-align:left}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-menu-item .x-menu-item__text{display:inline}.x-sub-menu.is-active>.x-sub-menu__title{color:#409eff}.x-sub-menu.is-disabled .x-sub-menu__title{color:#c0c4cc;cursor:not-allowed}.x-sub-menu.is-opened>.x-sub-menu__title{background-color:#f0f7ff}.zoom-in-top-enter-active,.zoom-in-top-leave-active{opacity:1;transform:scaleY(1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transform-origin:center top}.zoom-in-top-enter-from,.zoom-in-top-leave-to{opacity:0;transform:scaleY(0)}.zoom-in-left-enter-active,.zoom-in-left-leave-active{opacity:1;transition:opacity .2s}.zoom-in-left-enter-from,.zoom-in-left-leave-to{opacity:0}.x-breadcrumb{font-size:14px;line-height:1}.x-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:0;list-style:none}.x-breadcrumb__item{display:inline-flex;align-items:center;color:#606266}.x-breadcrumb__item:last-child .x-breadcrumb__separator{display:none}.x-breadcrumb__item:last-child .x-breadcrumb__text{font-weight:500;color:#303133}.x-breadcrumb__link,.x-breadcrumb__text{display:inline-flex;align-items:center}.x-breadcrumb__link{cursor:pointer;transition:color .2s}.x-breadcrumb__link:hover{color:#409eff}.x-breadcrumb__text{color:inherit}.x-breadcrumb__separator{margin:0 8px;color:#c0c4cc;font-size:12px;-webkit-user-select:none;user-select:none}.x-breadcrumb__separator-icon{font-size:14px}.x-breadcrumb__item.is-disabled .x-breadcrumb__link,.x-breadcrumb__item.is-disabled .x-breadcrumb__text{color:#c0c4cc;cursor:not-allowed}.x-steps{display:flex;width:100%;font-size:14px}.x-steps--horizontal{flex-direction:row;align-items:flex-start}.x-steps--horizontal.is-center{align-items:center}.x-steps--vertical{flex-direction:column;min-height:300px}.x-steps.is-simple{display:flex;align-items:center;padding:12px 16px;background:#fafafa;border-radius:4px}.x-step{position:relative;flex:1;cursor:pointer}.x-step--horizontal{display:flex;flex-direction:column;align-items:center}.x-step--horizontal .x-step__head{display:flex;align-items:center;justify-content:center;width:100%;position:relative}.x-step--horizontal .x-step__icon{position:relative;z-index:1}.x-step--horizontal .x-step__line{flex:1;height:2px;background-color:#e4e7ed;transition:background-color .3s;min-width:20px}.x-step--horizontal .x-step__content{margin-top:10px;text-align:center;padding:0 4px}.x-step--vertical{display:flex;flex-direction:row}.x-step--vertical .x-step__head{display:flex;flex-direction:column;align-items:center;position:relative}.x-step--vertical .x-step__line{width:2px;height:32px;background-color:#e4e7ed;transition:background-color .3s}.x-step--vertical .x-step__content{margin-left:12px;flex:1;padding-bottom:24px}.x-step__head{display:flex;align-items:center}.x-step__icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#fff;border:2px solid #c0c4cc;color:#c0c4cc;flex-shrink:0;transition:all .3s;box-sizing:border-box}.x-step__icon-inner{font-size:13px;font-weight:600;color:inherit}.x-step__content{width:100%}.x-step__title{font-size:14px;font-weight:500;color:#303133;line-height:1.5}.x-step__description{font-size:12px;color:#909399;margin-top:4px;line-height:1.5}.x-step.is-wait .x-step__icon{border-color:#c0c4cc;color:#c0c4cc}.x-step.is-wait .x-step__title{color:#c0c4cc}.x-step.is-process .x-step__icon{border-color:#409eff;background-color:#409eff;color:#fff}.x-step.is-process .x-step__title{color:#303133;font-weight:600}.x-step.is-finish .x-step__icon{border-color:#67c23a;background-color:#67c23a;color:#fff}.x-step.is-finish .x-step__title{color:#303133}.x-step.is-finish .x-step__line{background-color:#67c23a}.x-step.is-success .x-step__icon{border-color:#67c23a;background-color:#67c23a;color:#fff}.x-step.is-success .x-step__title{color:#67c23a}.x-step.is-success .x-step__line{background-color:#67c23a}.x-step.is-error .x-step__icon{border-color:#f56c6c;background-color:#f56c6c;color:#fff}.x-step.is-error .x-step__title{color:#f56c6c}.x-page-header{padding:16px 0}.x-page-header__main{display:flex;align-items:center;justify-content:space-between;line-height:28px}.x-page-header__left{display:flex;align-items:center;flex:1;min-width:0}.x-page-header__back{display:inline-flex;align-items:center;margin-right:16px;font-size:14px;color:#606266;cursor:pointer;transition:color .2s}.x-page-header__back:hover{color:#409eff}.x-page-header__back-icon{font-size:16px}.x-page-header__back-text{margin-left:4px}.x-page-header__title{font-size:20px;font-weight:600;color:#303133}.x-page-header__subtitle{margin-left:12px;font-size:14px;font-weight:400;color:#909399}.x-page-header__extra{flex-shrink:0;display:flex;align-items:center;gap:8px}.x-page-header__content{margin-top:16px}.x-page-header__footer{margin-top:16px;padding-top:16px;border-top:1px solid #ebeef5}
|
|
1
|
+
.x-tabs__header{position:relative}.x-tabs__nav{display:flex;border-bottom:2px solid #e4e7ed}.x-tabs__item{padding:0 20px;height:40px;line-height:40px;font-size:14px;color:#606266;cursor:pointer;transition:color .2s;position:relative}.x-tabs__item:hover{color:#409eff}.x-tabs__item--active{color:#409eff;font-weight:500}.x-tabs__item--active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:2px;background-color:#409eff}.x-tabs__item.is-disabled{color:#c0c4cc;cursor:not-allowed}.x-tabs__item.is-disabled:hover{color:#c0c4cc}.x-tabs__content{padding:20px 0}.x-tabs--card .x-tabs__nav{border-bottom:none}.x-tabs--card .x-tabs__item{border:1px solid #e4e7ed;border-bottom:none;margin-right:-1px;padding:0 16px}.x-tabs--card .x-tabs__item--active{background-color:#fff;border-bottom:1px solid #fff}.x-tab-pane{padding:20px;outline:none}.x-menu{list-style:none;margin:0;padding:0;position:relative;font-size:14px;box-sizing:border-box}.x-menu--vertical{display:block;width:220px;min-height:100%;border-right:1px solid #e6e6e6;transition:width .3s ease,background-color .3s ease}.x-menu--vertical>.x-menu-item,.x-menu--vertical>.x-sub-menu{display:block;width:100%}.x-menu--horizontal{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;width:100%;border-bottom:1px solid #e6e6e6}.x-menu--horizontal>.x-menu-item,.x-menu--horizontal>.x-sub-menu{flex:0 0 auto}.x-menu.is-collapse{width:64px!important;min-width:64px}.x-menu.is-collapse>.x-menu-item{height:56px;line-height:56px;padding:0 20px;text-align:center}.x-menu.is-collapse>.x-menu-item .x-menu-item__content{justify-content:center}.x-menu.is-collapse>.x-menu-item .x-menu-item__text{display:none}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title{height:56px;line-height:56px;padding:0 20px;text-align:center;justify-content:center}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__content{justify-content:center}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__text,.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__arrow{display:none}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu{position:absolute;left:64px;top:0;min-width:180px;background-color:#fff;box-shadow:0 2px 12px #0000001f;border-radius:4px;z-index:100;border:1px solid #e4e7ed}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-menu-item{height:50px;line-height:50px;padding:0 20px;text-align:left}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-menu-item .x-menu-item__content{justify-content:flex-start}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-menu-item .x-menu-item__text{display:inline}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-sub-menu__title .x-sub-menu__text{display:inline}.x-menu.is-dark{background-color:#1f2d3d;border-color:#1f2d3d;color:#bfcbd9}.x-menu.is-dark .x-menu-item,.x-menu.is-dark .x-sub-menu__title{color:#bfcbd9}.x-menu.is-dark .x-menu-item:hover,.x-menu.is-dark .x-sub-menu__title:hover{background-color:#263445}.x-menu.is-dark .x-menu-item.is-active{color:#409eff;background-color:#263445}.x-menu.is-dark .x-sub-menu__menu{background-color:#1f2d3d;border-color:#1f2d3d}.x-menu-item{list-style:none;margin:0;padding:0 20px;cursor:pointer;transition:all .3s ease;height:56px;line-height:56px;color:#303133;position:relative;white-space:nowrap;box-sizing:border-box}.x-menu-item__content{display:flex;align-items:center;height:100%}.x-menu-item__icon{margin-right:8px;font-size:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.x-menu-item__icon svg,.x-menu-item__icon i{font-size:18px}.x-menu-item__text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:opacity .3s ease}.x-menu-item:hover{background-color:#f0f7ff}.x-menu-item.is-active{color:#409eff;background-color:#ecf5ff}.x-menu-item.is-active:not(.is-horizontal):before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background-color:#409eff;border-radius:0 2px 2px 0}.x-menu-item.is-collapse{padding:0;text-align:center}.x-menu-item.is-collapse .x-menu-item__content{justify-content:center;padding:0}.x-menu-item.is-collapse .x-menu-item__icon{margin-right:0;font-size:20px}.x-menu-item.is-collapse .x-menu-item__icon svg,.x-menu-item.is-collapse .x-menu-item__icon i{font-size:20px}.x-menu-item.is-collapse .x-menu-item__text{opacity:0;width:0;overflow:hidden}.x-menu-item.is-horizontal{display:inline-block;height:56px;line-height:56px}.x-menu-item.is-horizontal:hover{background-color:transparent}.x-menu-item.is-horizontal.is-active{background-color:transparent;border-bottom:2px solid #409eff}.x-menu-item.is-horizontal.is-active:before{display:none}.x-menu-item.is-disabled{color:#c0c4cc;cursor:not-allowed}.x-menu-item.is-disabled:hover{background-color:transparent}.x-menu-item-group{list-style:none}.x-menu-item-group__title{padding:20px 20px 10px;font-size:13px;color:#909399;line-height:1}.x-menu-item-group>ul{padding:0}.x-sub-menu{list-style:none;margin:0;padding:0;position:relative}.x-sub-menu__title{display:flex;align-items:center;cursor:pointer;transition:all .3s ease;color:#303133;height:100%}.x-sub-menu__content{display:flex;align-items:center;width:100%;height:100%}.x-sub-menu__icon{margin-right:8px;font-size:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.x-sub-menu__icon svg,.x-sub-menu__icon i{font-size:18px}.x-sub-menu__text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:opacity .3s ease}.x-sub-menu__arrow{font-size:12px;transition:transform .3s ease;color:#909399;margin-left:4px;display:flex;align-items:center}.x-sub-menu__arrow svg{transition:transform .3s ease}.x-sub-menu__arrow.is-open svg{transform:rotate(180deg)}.x-sub-menu__menu{list-style:none;margin:0;padding:0;background-color:#fff}.x-sub-menu__menu.is-collapse{border:1px solid #e4e7ed;border-radius:4px}.x-sub-menu--vertical{display:block;width:100%}.x-sub-menu--vertical .x-sub-menu__title{height:56px;line-height:56px;padding:0 20px}.x-sub-menu--vertical .x-sub-menu__title:hover{background-color:#f0f7ff}.x-sub-menu--vertical .x-sub-menu__menu{min-width:200px;border-right:none}.x-sub-menu--vertical .x-sub-menu__menu .x-menu-item,.x-sub-menu--vertical .x-sub-menu__menu .x-sub-menu__title{padding-left:40px}.x-sub-menu--vertical.is-nested .x-sub-menu__menu{position:absolute;left:100%;top:0;box-shadow:0 2px 12px #0000001f;border-radius:4px;border:1px solid #e4e7ed}.x-sub-menu--horizontal{display:inline-block;height:56px}.x-sub-menu--horizontal .x-sub-menu__title{height:56px;line-height:56px;padding:0 20px}.x-sub-menu--horizontal .x-sub-menu__title:hover{background-color:transparent}.x-sub-menu--horizontal .x-sub-menu__menu{position:absolute;top:100%;left:0;min-width:180px;box-shadow:0 2px 12px #0000001f;border-radius:4px;z-index:100;border:1px solid #e4e7ed}.x-sub-menu--horizontal .x-sub-menu__menu .x-menu-item{display:block;height:50px;line-height:50px;padding-left:20px}.x-sub-menu--horizontal .x-sub-menu__menu .x-menu-item.is-active:before{display:none}.x-sub-menu.is-collapse>.x-sub-menu__title{height:56px;line-height:56px;padding:0 20px;text-align:center}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__content{justify-content:center}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__text,.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__arrow{display:none}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__icon{margin-right:0;font-size:20px}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__icon svg,.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__icon i{font-size:20px}.x-sub-menu.is-collapse>.x-sub-menu__menu{position:absolute;left:64px;top:0;min-width:180px;box-shadow:0 2px 12px #0000001f;border-radius:4px;z-index:100;border:1px solid #e4e7ed;background-color:#fff}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-menu-item{height:50px;line-height:50px;padding:0 20px;text-align:left}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-menu-item .x-menu-item__content{justify-content:flex-start}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-menu-item .x-menu-item__text{display:inline;opacity:1;width:auto}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-sub-menu__title{padding:0 20px}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-sub-menu__title .x-sub-menu__text{display:inline;opacity:1}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-sub-menu__title .x-sub-menu__arrow{display:flex}.x-sub-menu.is-active>.x-sub-menu__title{color:#409eff}.x-sub-menu.is-disabled .x-sub-menu__title{color:#c0c4cc;cursor:not-allowed}.x-sub-menu.is-opened>.x-sub-menu__title{background-color:#f0f7ff}.zoom-in-top-enter-active,.zoom-in-top-leave-active{opacity:1;transform:scaleY(1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transform-origin:center top}.zoom-in-top-enter-from,.zoom-in-top-leave-to{opacity:0;transform:scaleY(0)}.zoom-in-left-enter-active,.zoom-in-left-leave-active{opacity:1;transition:opacity .2s ease,transform .2s ease;transform:translate(0)}.zoom-in-left-enter-from,.zoom-in-left-leave-to{opacity:0;transform:translate(-10px)}.x-breadcrumb{font-size:14px;line-height:1}.x-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:0;list-style:none}.x-breadcrumb__item{display:inline-flex;align-items:center;color:#606266}.x-breadcrumb__item:last-child .x-breadcrumb__separator{display:none}.x-breadcrumb__item:last-child .x-breadcrumb__text{font-weight:500;color:#303133}.x-breadcrumb__link,.x-breadcrumb__text{display:inline-flex;align-items:center}.x-breadcrumb__link{cursor:pointer;transition:color .2s}.x-breadcrumb__link:hover{color:#409eff}.x-breadcrumb__text{color:inherit}.x-breadcrumb__separator{margin:0 8px;color:#c0c4cc;font-size:12px;-webkit-user-select:none;user-select:none}.x-breadcrumb__separator-icon{font-size:14px}.x-breadcrumb__item.is-disabled .x-breadcrumb__link,.x-breadcrumb__item.is-disabled .x-breadcrumb__text{color:#c0c4cc;cursor:not-allowed}.x-steps{display:flex;width:100%;font-size:14px}.x-steps--horizontal{flex-direction:row;align-items:flex-start}.x-steps--horizontal.is-center{align-items:center}.x-steps--vertical{flex-direction:column;min-height:300px}.x-steps.is-simple{display:flex;align-items:center;padding:12px 16px;background:#fafafa;border-radius:4px}.x-step{position:relative;flex:1;cursor:pointer}.x-step--horizontal{display:flex;flex-direction:column;align-items:center}.x-step--horizontal .x-step__head{display:flex;align-items:center;justify-content:center;width:100%;position:relative}.x-step--horizontal .x-step__icon{position:relative;z-index:1}.x-step--horizontal .x-step__line{flex:1;height:2px;background-color:#e4e7ed;transition:background-color .3s;min-width:20px}.x-step--horizontal .x-step__content{margin-top:10px;text-align:center;padding:0 4px}.x-step--vertical{display:flex;flex-direction:row}.x-step--vertical .x-step__head{display:flex;flex-direction:column;align-items:center;position:relative}.x-step--vertical .x-step__line{width:2px;height:32px;background-color:#e4e7ed;transition:background-color .3s}.x-step--vertical .x-step__content{margin-left:12px;flex:1;padding-bottom:24px}.x-step__head{display:flex;align-items:center}.x-step__icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#fff;border:2px solid #c0c4cc;color:#c0c4cc;flex-shrink:0;transition:all .3s;box-sizing:border-box}.x-step__icon-inner{font-size:13px;font-weight:600;color:inherit}.x-step__content{width:100%}.x-step__title{font-size:14px;font-weight:500;color:#303133;line-height:1.5}.x-step__description{font-size:12px;color:#909399;margin-top:4px;line-height:1.5}.x-step.is-wait .x-step__icon{border-color:#c0c4cc;color:#c0c4cc}.x-step.is-wait .x-step__title{color:#c0c4cc}.x-step.is-process .x-step__icon{border-color:#409eff;background-color:#409eff;color:#fff}.x-step.is-process .x-step__title{color:#303133;font-weight:600}.x-step.is-finish .x-step__icon{border-color:#67c23a;background-color:#67c23a;color:#fff}.x-step.is-finish .x-step__title{color:#303133}.x-step.is-finish .x-step__line{background-color:#67c23a}.x-step.is-success .x-step__icon{border-color:#67c23a;background-color:#67c23a;color:#fff}.x-step.is-success .x-step__title{color:#67c23a}.x-step.is-success .x-step__line{background-color:#67c23a}.x-step.is-error .x-step__icon{border-color:#f56c6c;background-color:#f56c6c;color:#fff}.x-step.is-error .x-step__title{color:#f56c6c}.x-page-header{padding:16px 0}.x-page-header__main{display:flex;align-items:center;justify-content:space-between;line-height:28px}.x-page-header__left{display:flex;align-items:center;flex:1;min-width:0}.x-page-header__back{display:inline-flex;align-items:center;margin-right:16px;font-size:14px;color:#606266;cursor:pointer;transition:color .2s}.x-page-header__back:hover{color:#409eff}.x-page-header__back-icon{font-size:16px}.x-page-header__back-text{margin-left:4px}.x-page-header__title{font-size:20px;font-weight:600;color:#303133}.x-page-header__subtitle{margin-left:12px;font-size:14px;font-weight:400;color:#909399}.x-page-header__extra{flex-shrink:0;display:flex;align-items:center;gap:8px}.x-page-header__content{margin-top:16px}.x-page-header__footer{margin-top:16px;padding-top:16px;border-top:1px solid #ebeef5}
|
package/lib/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),C=require("@xto/core"),z=["onClick"],h=e.defineComponent({name:"XTabs",__name:"index",props:{modelValue:{default:""},type:{default:"line"},tabPosition:{default:"top"},addable:{type:Boolean,default:!1},closable:{type:Boolean,default:!1}},emits:["update:modelValue","tabClick","edit"],setup(s,{emit:r}){const t=s,a=r,l=C.useNamespace("tabs"),o=e.useSlots(),i=e.ref(t.modelValue);e.watch(()=>t.modelValue,n=>{i.value=n});const d=(n,u)=>{i.value=n,a("update:modelValue",n)};e.provide("tabs",{props:t,activeName:i,handleTabClick:d});const m=e.computed(()=>[l.b(),l.m(t.type),l.is(`position-${t.tabPosition}`)]),f=e.computed(()=>{var u;return(((u=o.default)==null?void 0:u.call(o))||[]).filter(c=>c.type&&c.type.name==="XTabPane").map(c=>{var p,v,B,y;return{name:((p=c.props)==null?void 0:p.name)||((v=c.props)==null?void 0:v.label),label:(B=c.props)==null?void 0:B.label,disabled:((y=c.props)==null?void 0:y.disabled)===!0}})});return(n,u)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(m.value)},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(l).e("header"))},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(l).e("nav"))},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,c=>(e.openBlock(),e.createElementBlock("div",{key:c.name,class:e.normalizeClass([e.unref(l).e("item"),e.unref(l).em("item",i.value===c.name?"active":""),e.unref(l).is("disabled",c.disabled)]),onClick:p=>c.disabled?null:d(c.name)},e.toDisplayString(c.label),11,z))),128))],2)],2),e.createElementVNode("div",{class:e.normalizeClass(e.unref(l).e("content"))},[e.renderSlot(n.$slots,"default")],2)],2))}}),S={class:"x-tab-pane",role:"tabpanel"},E=e.defineComponent({name:"XTabPane",__name:"TabPane",props:{label:{},name:{},disabled:{type:Boolean,default:!1},closable:{type:Boolean,default:!1},lazy:{type:Boolean,default:!1}},setup(s){const r=s,t=e.inject("tabs"),a=e.ref(!1),l=e.computed(()=>r.name||r.label),o=e.computed(()=>(t==null?void 0:t.activeName.value)===l.value);return e.watch(()=>t==null?void 0:t.activeName.value,()=>{o.value&&r.lazy&&!a.value&&(a.value=!0)},{immediate:!0}),o.value&&r.lazy&&(a.value=!0),(i,d)=>e.withDirectives((e.openBlock(),e.createElementBlock("div",S,[a.value||!s.lazy?e.renderSlot(i.$slots,"default",{key:0}):e.createCommentVNode("",!0)],512)),[[e.vShow,o.value]])}}),N=e.defineComponent({name:"XMenu",__name:"index",props:{modelValue:{default:""},mode:{default:"vertical"},collapse:{type:Boolean,default:!1},backgroundColor:{default:"#fff"},textColor:{default:"#303133"},activeTextColor:{default:"#409eff"},defaultOpeneds:{default:()=>[]},router:{type:Boolean}},emits:["update:modelValue","select","open","close"],setup(s,{emit:r}){const t=s,a=r,l=C.useNamespace("menu"),o=e.ref(t.modelValue),i=e.ref([...t.defaultOpeneds]);e.watch(()=>t.modelValue,c=>{o.value=c});const d=(c,p=[])=>{o.value=c,a("update:modelValue",c),a("select",c,p)},m=(c,p=[])=>{i.value.includes(c)||i.value.push(c),a("open",c,p)},f=(c,p=[])=>{const v=i.value.indexOf(c);v>-1&&i.value.splice(v,1),a("close",c,p)};e.provide("menu",{props:t,activeIndex:o,openedMenus:i,handleSelect:d,handleOpen:m,handleClose:f});const n=e.computed(()=>[l.b(),l.is("collapse",t.collapse),l.is(`mode-${t.mode}`)]),u=e.computed(()=>({backgroundColor:t.backgroundColor,color:t.textColor}));return(c,p)=>(e.openBlock(),e.createElementBlock("ul",{class:e.normalizeClass(n.value),style:e.normalizeStyle(u.value)},[e.renderSlot(c.$slots,"default")],6))}}),b="x-menu-item",V=e.defineComponent({name:"XMenuItem",__name:"MenuItem",props:{index:{default:""},disabled:{type:Boolean,default:!1},icon:{}},setup(s){const r=s,t=e.inject("menu"),a=e.computed(()=>(t==null?void 0:t.activeIndex.value)===r.index),l=e.computed(()=>t==null?void 0:t.props.collapse),o=e.computed(()=>(t==null?void 0:t.props.mode)==="horizontal"),i=e.computed(()=>[b,{"is-active":a.value,"is-disabled":r.disabled,"is-horizontal":o.value,"is-collapse":l.value}]),d=e.computed(()=>a.value&&(t!=null&&t.props.activeTextColor)?{color:t.props.activeTextColor}:{}),m=()=>{r.disabled||r.index&&(t==null||t.handleSelect(r.index,[r.index]))};return(f,n)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(i.value),style:e.normalizeStyle(d.value),onClick:m},[s.icon?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(b+"__icon")},e.toDisplayString(s.icon),3)):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass(b+"__text")},[e.renderSlot(f.$slots,"default")],2)],6))}}),$={class:"x-menu-item-group"},g={class:"x-menu-item-group__title"},_=e.defineComponent({name:"XMenuItemGroup",__name:"MenuItemGroup",props:{title:{}},setup(s){return(r,t)=>(e.openBlock(),e.createElementBlock("li",$,[e.createElementVNode("div",g,e.toDisplayString(s.title),1),e.createElementVNode("ul",null,[e.renderSlot(r.$slots,"default")])]))}}),k="x-sub-menu",x=e.defineComponent({name:"XSubMenu",__name:"SubMenu",props:{index:{default:""},title:{default:""},disabled:{type:Boolean,default:!1},icon:{}},setup(s){const r=s,t=e.inject("menu"),a=e.inject("subMenu",null),l=e.ref(!1),o=e.computed(()=>!!a),i=e.computed(()=>t==null?void 0:t.props.collapse),d=e.computed(()=>(t==null?void 0:t.activeIndex.value)===r.index),m=e.computed(()=>[k,k+((t==null?void 0:t.props.mode)==="horizontal"?"--horizontal":"--vertical"),{"is-active":d.value,"is-opened":l.value,"is-disabled":r.disabled,"is-nested":o.value,"is-collapse":i.value}]),f=()=>{r.disabled||i.value||(l.value=!l.value)},n=()=>{r.disabled||((t==null?void 0:t.props.mode)==="horizontal"||i.value)&&(l.value=!0)},u=()=>{((t==null?void 0:t.props.mode)==="horizontal"||i.value)&&(l.value=!1)};return e.provide("subMenu",{isOpen:l,isNested:o}),(c,p)=>{var v;return e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(m.value),onMouseenter:n,onMouseleave:u},[e.createElementVNode("div",{class:e.normalizeClass(k+"__title"),onClick:f},[s.icon?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(k+"__icon")},e.toDisplayString(s.icon),3)):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass(k+"__text")},[e.renderSlot(c.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(s.title),1)])],2),e.createElementVNode("span",{class:e.normalizeClass([k+"__arrow",{"is-open":l.value}])}," ▼ ",2)],2),e.createVNode(e.Transition,{name:((v=e.unref(t))==null?void 0:v.props.mode)==="horizontal"?"zoom-in-top":"zoom-in-left"},{default:e.withCtx(()=>{var B;return[e.withDirectives(e.createElementVNode("ul",{class:e.normalizeClass([k+"__menu",{"is-horizontal":((B=e.unref(t))==null?void 0:B.props.mode)==="horizontal"}])},[e.renderSlot(c.$slots,"default")],2),[[e.vShow,l.value]])]}),_:3},8,["name"])],34)}}}),T=e.defineComponent({name:"XBreadcrumb",__name:"index",props:{separator:{default:"/"},separatorIcon:{}},setup(s){const r=s,t=C.useNamespace("breadcrumb");e.provide("breadcrumb",{separator:e.computed(()=>r.separator),separatorIcon:e.computed(()=>r.separatorIcon)});const a=e.computed(()=>[t.b()]);return(l,o)=>(e.openBlock(),e.createElementBlock("nav",{class:e.normalizeClass(a.value),"aria-label":"Breadcrumb"},[e.createElementVNode("ol",{class:e.normalizeClass(e.unref(t).e("list"))},[e.renderSlot(l.$slots,"default")],2)],2))}}),M=["aria-current"],w=e.defineComponent({name:"XBreadcrumbItem",__name:"BreadcrumbItem",props:{to:{},replace:{type:Boolean},disabled:{type:Boolean}},emits:["click"],setup(s,{emit:r}){const t=s,a=r,l=C.useNamespace("breadcrumb"),o=e.inject("breadcrumb"),i=e.computed(()=>[l.e("item"),l.is("link",!!t.to&&!t.disabled),l.is("disabled",t.disabled)]),d=e.computed(()=>{var n;return((n=o==null?void 0:o.separator)==null?void 0:n.value)||"/"}),m=e.computed(()=>{var n;return(n=o==null?void 0:o.separatorIcon)==null?void 0:n.value}),f=n=>{t.disabled||(a("click",n),t.to&&typeof t.to=="string"&&(t.replace?window.location.replace(t.to):window.location.href=t.to))};return(n,u)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(i.value)},[s.to&&!s.disabled?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(l).e("link")),onClick:f},[e.renderSlot(n.$slots,"default")],2)):(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(e.unref(l).e("text")),"aria-current":s.disabled?"page":void 0},[e.renderSlot(n.$slots,"default")],10,M)),e.createElementVNode("span",{class:e.normalizeClass(e.unref(l).e("separator")),"aria-hidden":"true"},[m.value?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(l).e("separator-icon"))},e.toDisplayString(m.value),3)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(d.value),1)],64))],2)],2))}}),I=e.defineComponent({name:"XSteps",__name:"index",props:{active:{default:0},direction:{default:"horizontal"},simple:{type:Boolean,default:!1},finishStatus:{default:"finish"},processStatus:{default:"process"},alignCenter:{type:Boolean,default:!1},space:{}},emits:["change","update:active"],setup(s,{emit:r}){const t=s,a=r,l=C.useNamespace("steps"),o=e.ref(t.active),i=e.ref(0);e.watch(()=>t.active,u=>{o.value=u});const d=u=>{o.value=u,a("change",u),a("update:active",u)},m=u=>{i.value=u};e.provide("steps",{props:t,currentActive:o,stepCount:i,setCurrentActive:d,setStepCount:m});const f=e.computed(()=>[l.b(),l.m(t.direction),l.is("simple",t.simple),l.is("center",t.alignCenter)]),n=e.computed(()=>t.space?{"--steps-space":typeof t.space=="number"?`${t.space}px`:t.space}:{});return(u,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(f.value),style:e.normalizeStyle(n.value)},[e.renderSlot(u.$slots,"default")],6))}}),D=e.defineComponent({name:"XStep",__name:"Step",props:{title:{default:""},description:{default:""},icon:{},status:{}},setup(s){const r=s,t=C.useNamespace("step"),a=e.inject("steps"),l=e.ref(-1);e.onMounted(()=>{a&&(l.value=a.stepCount.value,a.setStepCount(a.stepCount.value+1))});const o=e.computed(()=>{var u,c,p;if(r.status)return r.status;const n=((u=a==null?void 0:a.currentActive)==null?void 0:u.value)??0;return l.value<n?((c=a==null?void 0:a.props)==null?void 0:c.finishStatus)||"finish":l.value===n?((p=a==null?void 0:a.props)==null?void 0:p.processStatus)||"process":"wait"}),i=e.computed(()=>{var n;return l.value===(((n=a==null?void 0:a.stepCount)==null?void 0:n.value)||0)-1}),d=e.computed(()=>l.value===0);e.computed(()=>({wait:"#c0c4cc",process:"#409eff",finish:"#67c23a",error:"#f56c6c",success:"#67c23a"})[o.value]||"#c0c4cc");const m=e.computed(()=>{var n;return[t.b(),t.is(o.value),t.is("last",i.value),t.m(((n=a==null?void 0:a.props)==null?void 0:n.direction)||"horizontal")]}),f=()=>{var n;l.value>-1&&((n=a==null?void 0:a.setCurrentActive)==null||n.call(a,l.value))};return(n,u)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(m.value),onClick:f},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(t).e("head"))},[d.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([e.unref(t).e("line"),e.unref(t).em("line","prev")])},null,2)),e.createElementVNode("div",{class:e.normalizeClass(e.unref(t).e("icon"))},[s.icon?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(t).e("icon-inner"))},e.toDisplayString(s.icon),3)):(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(e.unref(t).e("icon-inner"))},[o.value==="finish"||o.value==="success"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode("✓")],64)):o.value==="error"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode("✕")],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:2},[e.createTextVNode(e.toDisplayString(l.value+1),1)],64))],2))],2),i.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(e.unref(t).e("line"))},null,2))],2),e.createElementVNode("div",{class:e.normalizeClass(e.unref(t).e("content"))},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(t).e("title"))},[e.renderSlot(n.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(s.title),1)])],2),s.description||n.$slots.description?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(t).e("description"))},[e.renderSlot(n.$slots,"description",{},()=>[e.createTextVNode(e.toDisplayString(s.description),1)])],2)):e.createCommentVNode("",!0)],2)],2))}}),X=e.defineComponent({name:"XPageHeader",__name:"index",props:{title:{default:""},subtitle:{default:""},backText:{default:"返回"},showBack:{type:Boolean,default:!1}},emits:["back"],setup(s,{emit:r}){const t=r,a=C.useNamespace("page-header"),l=()=>{t("back")};return(o,i)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(a).b())},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(a).e("main"))},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(a).e("left"))},[s.showBack?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(a).e("back")),onClick:l},[e.createElementVNode("span",{class:e.normalizeClass(e.unref(a).e("back-icon"))},"←",2),s.backText?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(a).e("back-text"))},e.toDisplayString(s.backText),3)):e.createCommentVNode("",!0)],2)):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass(e.unref(a).e("title"))},[e.renderSlot(o.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(s.title),1)])],2),s.subtitle||o.$slots.subtitle?(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(e.unref(a).e("subtitle"))},[e.renderSlot(o.$slots,"subtitle",{},()=>[e.createTextVNode(e.toDisplayString(s.subtitle),1)])],2)):e.createCommentVNode("",!0)],2),e.createElementVNode("div",{class:e.normalizeClass(e.unref(a).e("extra"))},[e.renderSlot(o.$slots,"extra")],2)],2),o.$slots.default?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(a).e("content"))},[e.renderSlot(o.$slots,"default")],2)):e.createCommentVNode("",!0),o.$slots.footer?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(e.unref(a).e("footer"))},[e.renderSlot(o.$slots,"footer")],2)):e.createCommentVNode("",!0)],2))}});exports.Breadcrumb=T;exports.BreadcrumbItem=w;exports.Menu=N;exports.MenuItem=V;exports.MenuItemGroup=_;exports.PageHeader=X;exports.Step=D;exports.Steps=I;exports.SubMenu=x;exports.TabPane=E;exports.Tabs=h;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),C=require("@xto/core"),z=["onClick"],h=e.defineComponent({name:"XTabs",__name:"index",props:{modelValue:{default:""},type:{default:"line"},tabPosition:{default:"top"},addable:{type:Boolean,default:!1},closable:{type:Boolean,default:!1}},emits:["update:modelValue","tabClick","edit"],setup(s,{emit:r}){const t=s,a=r,l=C.useNamespace("tabs"),o=e.useSlots(),i=e.ref(t.modelValue);e.watch(()=>t.modelValue,n=>{i.value=n});const m=(n,u)=>{i.value=n,a("update:modelValue",n)};e.provide("tabs",{props:t,activeName:i,handleTabClick:m});const f=e.computed(()=>[l.b(),l.m(t.type),l.is(`position-${t.tabPosition}`)]),p=e.computed(()=>{var u;return(((u=o.default)==null?void 0:u.call(o))||[]).filter(c=>c.type&&c.type.name==="XTabPane").map(c=>{var d,k,B,y;return{name:((d=c.props)==null?void 0:d.name)||((k=c.props)==null?void 0:k.label),label:(B=c.props)==null?void 0:B.label,disabled:((y=c.props)==null?void 0:y.disabled)===!0}})});return(n,u)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(f.value)},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(l).e("header"))},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(l).e("nav"))},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,c=>(e.openBlock(),e.createElementBlock("div",{key:c.name,class:e.normalizeClass([e.unref(l).e("item"),e.unref(l).em("item",i.value===c.name?"active":""),e.unref(l).is("disabled",c.disabled)]),onClick:d=>c.disabled?null:m(c.name)},e.toDisplayString(c.label),11,z))),128))],2)],2),e.createElementVNode("div",{class:e.normalizeClass(e.unref(l).e("content"))},[e.renderSlot(n.$slots,"default")],2)],2))}}),S={class:"x-tab-pane",role:"tabpanel"},E=e.defineComponent({name:"XTabPane",__name:"TabPane",props:{label:{},name:{},disabled:{type:Boolean,default:!1},closable:{type:Boolean,default:!1},lazy:{type:Boolean,default:!1}},setup(s){const r=s,t=e.inject("tabs"),a=e.ref(!1),l=e.computed(()=>r.name||r.label),o=e.computed(()=>(t==null?void 0:t.activeName.value)===l.value);return e.watch(()=>t==null?void 0:t.activeName.value,()=>{o.value&&r.lazy&&!a.value&&(a.value=!0)},{immediate:!0}),o.value&&r.lazy&&(a.value=!0),(i,m)=>e.withDirectives((e.openBlock(),e.createElementBlock("div",S,[a.value||!s.lazy?e.renderSlot(i.$slots,"default",{key:0}):e.createCommentVNode("",!0)],512)),[[e.vShow,o.value]])}}),N=e.defineComponent({name:"XMenu",__name:"index",props:{modelValue:{default:""},mode:{default:"vertical"},collapse:{type:Boolean,default:!1},backgroundColor:{default:"#fff"},textColor:{default:"#303133"},activeTextColor:{default:"#409eff"},defaultOpeneds:{default:()=>[]},router:{type:Boolean}},emits:["update:modelValue","select","open","close"],setup(s,{emit:r}){const t=s,a=r,l=C.useNamespace("menu"),o=e.ref(t.modelValue),i=e.ref([...t.defaultOpeneds]);e.watch(()=>t.modelValue,c=>{o.value=c});const m=(c,d=[])=>{o.value=c,a("update:modelValue",c),a("select",c,d)},f=(c,d=[])=>{i.value.includes(c)||i.value.push(c),a("open",c,d)},p=(c,d=[])=>{const k=i.value.indexOf(c);k>-1&&i.value.splice(k,1),a("close",c,d)};e.provide("menu",{props:t,activeIndex:o,openedMenus:i,handleSelect:m,handleOpen:f,handleClose:p});const n=e.computed(()=>[l.b(),l.is("collapse",t.collapse),l.is(`mode-${t.mode}`)]),u=e.computed(()=>({backgroundColor:t.backgroundColor,color:t.textColor}));return(c,d)=>(e.openBlock(),e.createElementBlock("ul",{class:e.normalizeClass(n.value),style:e.normalizeStyle(u.value)},[e.renderSlot(c.$slots,"default")],6))}}),b="x-menu-item",V=e.defineComponent({name:"XMenuItem",__name:"MenuItem",props:{index:{default:""},disabled:{type:Boolean,default:!1},icon:{}},setup(s){const r=s,t=e.inject("menu");e.useSlots();const a=e.computed(()=>(t==null?void 0:t.activeIndex.value)===r.index),l=e.computed(()=>t==null?void 0:t.props.collapse),o=e.computed(()=>(t==null?void 0:t.props.mode)==="horizontal"),i=e.computed(()=>[b,{"is-active":a.value,"is-disabled":r.disabled,"is-horizontal":o.value,"is-collapse":l.value}]),m=e.computed(()=>a.value&&(t!=null&&t.props.activeTextColor)?{color:t.props.activeTextColor}:{}),f=()=>{r.disabled||r.index&&(t==null||t.handleSelect(r.index,[r.index]))};return(p,n)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(i.value),style:e.normalizeStyle(m.value),onClick:f},[e.createElementVNode("div",{class:e.normalizeClass(b+"__content")},[s.icon?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(b+"__icon")},e.toDisplayString(s.icon),3)):p.$slots.icon?(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(b+"__icon")},[e.renderSlot(p.$slots,"icon")],2)):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass(b+"__text")},[e.renderSlot(p.$slots,"default")],2)],2)],6))}}),$={class:"x-menu-item-group"},g={class:"x-menu-item-group__title"},_=e.defineComponent({name:"XMenuItemGroup",__name:"MenuItemGroup",props:{title:{}},setup(s){return(r,t)=>(e.openBlock(),e.createElementBlock("li",$,[e.createElementVNode("div",g,e.toDisplayString(s.title),1),e.createElementVNode("ul",null,[e.renderSlot(r.$slots,"default")])]))}}),v="x-sub-menu",x=e.defineComponent({name:"XSubMenu",__name:"SubMenu",props:{index:{default:""},title:{default:""},disabled:{type:Boolean,default:!1},icon:{}},setup(s){const r=s,t=e.inject("menu"),a=e.inject("subMenu",null),l=e.ref(!1),o=e.computed(()=>!!a),i=e.computed(()=>t==null?void 0:t.props.collapse),m=e.computed(()=>(t==null?void 0:t.activeIndex.value)===r.index),f=e.computed(()=>[v,v+((t==null?void 0:t.props.mode)==="horizontal"?"--horizontal":"--vertical"),{"is-active":m.value,"is-opened":l.value,"is-disabled":r.disabled,"is-nested":o.value,"is-collapse":i.value}]),p=()=>{r.disabled||i.value||(l.value=!l.value)},n=()=>{r.disabled||((t==null?void 0:t.props.mode)==="horizontal"||i.value)&&(l.value=!0)},u=()=>{((t==null?void 0:t.props.mode)==="horizontal"||i.value)&&(l.value=!1)};return e.provide("subMenu",{isOpen:l,isNested:o}),(c,d)=>{var k;return e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(f.value),onMouseenter:n,onMouseleave:u},[e.createElementVNode("div",{class:e.normalizeClass(v+"__title"),onClick:p},[e.createElementVNode("div",{class:e.normalizeClass(v+"__content")},[s.icon?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(v+"__icon")},e.toDisplayString(s.icon),3)):c.$slots.icon?(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(v+"__icon")},[e.renderSlot(c.$slots,"icon")],2)):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass(v+"__text")},[e.renderSlot(c.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(s.title),1)])],2),e.createElementVNode("span",{class:e.normalizeClass([v+"__arrow",{"is-open":l.value}])},[...d[0]||(d[0]=[e.createElementVNode("svg",{viewBox:"0 0 1024 1024",width:"12",height:"12"},[e.createElementVNode("path",{fill:"currentColor",d:"M512 714.667c-17.067 0-32-6.4-44.8-19.2L147.2 375.467c-25.6-25.6-25.6-64 0-89.6s64-25.6 89.6 0L512 561.067l275.2-275.2c25.6-25.6 64-25.6 89.6 0s25.6 64 0 89.6L556.8 695.467c-12.8 12.8-27.733 19.2-44.8 19.2z"})],-1)])],2)],2)],2),e.createVNode(e.Transition,{name:((k=e.unref(t))==null?void 0:k.props.mode)==="horizontal"?"zoom-in-top":"zoom-in-left"},{default:e.withCtx(()=>{var B;return[e.withDirectives(e.createElementVNode("ul",{class:e.normalizeClass([v+"__menu",{"is-horizontal":((B=e.unref(t))==null?void 0:B.props.mode)==="horizontal","is-collapse":i.value}])},[e.renderSlot(c.$slots,"default")],2),[[e.vShow,l.value]])]}),_:3},8,["name"])],34)}}}),T=e.defineComponent({name:"XBreadcrumb",__name:"index",props:{separator:{default:"/"},separatorIcon:{}},setup(s){const r=s,t=C.useNamespace("breadcrumb");e.provide("breadcrumb",{separator:e.computed(()=>r.separator),separatorIcon:e.computed(()=>r.separatorIcon)});const a=e.computed(()=>[t.b()]);return(l,o)=>(e.openBlock(),e.createElementBlock("nav",{class:e.normalizeClass(a.value),"aria-label":"Breadcrumb"},[e.createElementVNode("ol",{class:e.normalizeClass(e.unref(t).e("list"))},[e.renderSlot(l.$slots,"default")],2)],2))}}),M=["aria-current"],w=e.defineComponent({name:"XBreadcrumbItem",__name:"BreadcrumbItem",props:{to:{},replace:{type:Boolean},disabled:{type:Boolean}},emits:["click"],setup(s,{emit:r}){const t=s,a=r,l=C.useNamespace("breadcrumb"),o=e.inject("breadcrumb"),i=e.computed(()=>[l.e("item"),l.is("link",!!t.to&&!t.disabled),l.is("disabled",t.disabled)]),m=e.computed(()=>{var n;return((n=o==null?void 0:o.separator)==null?void 0:n.value)||"/"}),f=e.computed(()=>{var n;return(n=o==null?void 0:o.separatorIcon)==null?void 0:n.value}),p=n=>{t.disabled||(a("click",n),t.to&&typeof t.to=="string"&&(t.replace?window.location.replace(t.to):window.location.href=t.to))};return(n,u)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(i.value)},[s.to&&!s.disabled?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(l).e("link")),onClick:p},[e.renderSlot(n.$slots,"default")],2)):(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(e.unref(l).e("text")),"aria-current":s.disabled?"page":void 0},[e.renderSlot(n.$slots,"default")],10,M)),e.createElementVNode("span",{class:e.normalizeClass(e.unref(l).e("separator")),"aria-hidden":"true"},[f.value?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(l).e("separator-icon"))},e.toDisplayString(f.value),3)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(m.value),1)],64))],2)],2))}}),I=e.defineComponent({name:"XSteps",__name:"index",props:{active:{default:0},direction:{default:"horizontal"},simple:{type:Boolean,default:!1},finishStatus:{default:"finish"},processStatus:{default:"process"},alignCenter:{type:Boolean,default:!1},space:{}},emits:["change","update:active"],setup(s,{emit:r}){const t=s,a=r,l=C.useNamespace("steps"),o=e.ref(t.active),i=e.ref(0);e.watch(()=>t.active,u=>{o.value=u});const m=u=>{o.value=u,a("change",u),a("update:active",u)},f=u=>{i.value=u};e.provide("steps",{props:t,currentActive:o,stepCount:i,setCurrentActive:m,setStepCount:f});const p=e.computed(()=>[l.b(),l.m(t.direction),l.is("simple",t.simple),l.is("center",t.alignCenter)]),n=e.computed(()=>t.space?{"--steps-space":typeof t.space=="number"?`${t.space}px`:t.space}:{});return(u,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(p.value),style:e.normalizeStyle(n.value)},[e.renderSlot(u.$slots,"default")],6))}}),D=e.defineComponent({name:"XStep",__name:"Step",props:{title:{default:""},description:{default:""},icon:{},status:{}},setup(s){const r=s,t=C.useNamespace("step"),a=e.inject("steps"),l=e.ref(-1);e.onMounted(()=>{a&&(l.value=a.stepCount.value,a.setStepCount(a.stepCount.value+1))});const o=e.computed(()=>{var u,c,d;if(r.status)return r.status;const n=((u=a==null?void 0:a.currentActive)==null?void 0:u.value)??0;return l.value<n?((c=a==null?void 0:a.props)==null?void 0:c.finishStatus)||"finish":l.value===n?((d=a==null?void 0:a.props)==null?void 0:d.processStatus)||"process":"wait"}),i=e.computed(()=>{var n;return l.value===(((n=a==null?void 0:a.stepCount)==null?void 0:n.value)||0)-1}),m=e.computed(()=>l.value===0);e.computed(()=>({wait:"#c0c4cc",process:"#409eff",finish:"#67c23a",error:"#f56c6c",success:"#67c23a"})[o.value]||"#c0c4cc");const f=e.computed(()=>{var n;return[t.b(),t.is(o.value),t.is("last",i.value),t.m(((n=a==null?void 0:a.props)==null?void 0:n.direction)||"horizontal")]}),p=()=>{var n;l.value>-1&&((n=a==null?void 0:a.setCurrentActive)==null||n.call(a,l.value))};return(n,u)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(f.value),onClick:p},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(t).e("head"))},[m.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([e.unref(t).e("line"),e.unref(t).em("line","prev")])},null,2)),e.createElementVNode("div",{class:e.normalizeClass(e.unref(t).e("icon"))},[s.icon?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(t).e("icon-inner"))},e.toDisplayString(s.icon),3)):(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(e.unref(t).e("icon-inner"))},[o.value==="finish"||o.value==="success"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode("✓")],64)):o.value==="error"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode("✕")],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:2},[e.createTextVNode(e.toDisplayString(l.value+1),1)],64))],2))],2),i.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(e.unref(t).e("line"))},null,2))],2),e.createElementVNode("div",{class:e.normalizeClass(e.unref(t).e("content"))},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(t).e("title"))},[e.renderSlot(n.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(s.title),1)])],2),s.description||n.$slots.description?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(t).e("description"))},[e.renderSlot(n.$slots,"description",{},()=>[e.createTextVNode(e.toDisplayString(s.description),1)])],2)):e.createCommentVNode("",!0)],2)],2))}}),X=e.defineComponent({name:"XPageHeader",__name:"index",props:{title:{default:""},subtitle:{default:""},backText:{default:"返回"},showBack:{type:Boolean,default:!1}},emits:["back"],setup(s,{emit:r}){const t=r,a=C.useNamespace("page-header"),l=()=>{t("back")};return(o,i)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(a).b())},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(a).e("main"))},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(a).e("left"))},[s.showBack?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(a).e("back")),onClick:l},[e.createElementVNode("span",{class:e.normalizeClass(e.unref(a).e("back-icon"))},"←",2),s.backText?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(a).e("back-text"))},e.toDisplayString(s.backText),3)):e.createCommentVNode("",!0)],2)):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass(e.unref(a).e("title"))},[e.renderSlot(o.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(s.title),1)])],2),s.subtitle||o.$slots.subtitle?(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(e.unref(a).e("subtitle"))},[e.renderSlot(o.$slots,"subtitle",{},()=>[e.createTextVNode(e.toDisplayString(s.subtitle),1)])],2)):e.createCommentVNode("",!0)],2),e.createElementVNode("div",{class:e.normalizeClass(e.unref(a).e("extra"))},[e.renderSlot(o.$slots,"extra")],2)],2),o.$slots.default?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(a).e("content"))},[e.renderSlot(o.$slots,"default")],2)):e.createCommentVNode("",!0),o.$slots.footer?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(e.unref(a).e("footer"))},[e.renderSlot(o.$slots,"footer")],2)):e.createCommentVNode("",!0)],2))}});exports.Breadcrumb=T;exports.BreadcrumbItem=w;exports.Menu=N;exports.MenuItem=V;exports.MenuItemGroup=_;exports.PageHeader=X;exports.Step=D;exports.Steps=I;exports.SubMenu=x;exports.TabPane=E;exports.Tabs=h;
|
package/lib/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.x-tabs__header{position:relative}.x-tabs__nav{display:flex;border-bottom:2px solid #e4e7ed}.x-tabs__item{padding:0 20px;height:40px;line-height:40px;font-size:14px;color:#606266;cursor:pointer;transition:color .2s;position:relative}.x-tabs__item:hover{color:#409eff}.x-tabs__item--active{color:#409eff;font-weight:500}.x-tabs__item--active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:2px;background-color:#409eff}.x-tabs__item.is-disabled{color:#c0c4cc;cursor:not-allowed}.x-tabs__item.is-disabled:hover{color:#c0c4cc}.x-tabs__content{padding:20px 0}.x-tabs--card .x-tabs__nav{border-bottom:none}.x-tabs--card .x-tabs__item{border:1px solid #e4e7ed;border-bottom:none;margin-right:-1px;padding:0 16px}.x-tabs--card .x-tabs__item--active{background-color:#fff;border-bottom:1px solid #fff}.x-tab-pane{padding:20px;outline:none}.x-menu{list-style:none;margin:0;padding:0;position:relative;font-size:14px;box-sizing:border-box}.x-menu--vertical{display:block;width:220px;min-height:100%;border-right:1px solid #e6e6e6;transition:width .3s ease}.x-menu--vertical>.x-menu-item,.x-menu--vertical>.x-sub-menu{display:block;width:100%}.x-menu--horizontal{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;width:100%;border-bottom:1px solid #e6e6e6}.x-menu--horizontal>.x-menu-item,.x-menu--horizontal>.x-sub-menu{flex:0 0 auto}.x-menu.is-collapse{width:64px}.x-menu.is-collapse>.x-menu-item{height:48px;line-height:48px;padding:0;text-align:center}.x-menu.is-collapse>.x-menu-item .x-menu-item__text{display:none}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title{height:48px;line-height:48px;padding:0;text-align:center;justify-content:center}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__text,.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__arrow{display:none}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__icon{margin-right:0}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu{position:absolute;left:64px;top:0;width:180px;box-shadow:0 2px 12px #0000001a;border-radius:4px;z-index:100}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-menu-item{height:56px;line-height:56px;padding:0 20px;text-align:left}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-menu-item .x-menu-item__text{display:inline}.x-menu.is-dark{background-color:#1f2d3d;border-color:#1f2d3d;color:#bfcbd9}.x-menu.is-dark .x-menu-item,.x-menu.is-dark .x-sub-menu__title{color:#bfcbd9}.x-menu.is-dark .x-menu-item:hover,.x-menu.is-dark .x-sub-menu__title:hover{background-color:#263445}.x-menu.is-dark .x-menu-item.is-active{color:#409eff;background-color:#263445}.x-menu.is-dark .x-sub-menu__menu{background-color:#1f2d3d}.x-menu-item{list-style:none;margin:0;padding:0 20px;cursor:pointer;transition:all .3s ease;height:50px;line-height:50px;color:#303133;position:relative;white-space:nowrap;box-sizing:border-box}.x-menu-item__icon{margin-right:8px;font-size:18px}.x-menu-item__text{vertical-align:middle}.x-menu-item:hover{background-color:#f0f7ff}.x-menu-item.is-active{color:#409eff;background-color:#ecf5ff}.x-menu-item.is-active:not(.is-horizontal):before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:#409eff}.x-menu-item.is-collapse{padding:0;height:48px;line-height:48px;text-align:center}.x-menu-item.is-collapse .x-menu-item__icon{margin-right:0;font-size:20px}.x-menu-item.is-collapse .x-menu-item__text{display:none}.x-menu-item.is-horizontal{display:inline-block;height:56px;line-height:56px}.x-menu-item.is-horizontal:hover{background-color:transparent}.x-menu-item.is-horizontal.is-active{background-color:transparent;border-bottom:2px solid #409eff}.x-menu-item.is-disabled{color:#c0c4cc;cursor:not-allowed}.x-menu-item.is-disabled:hover{background-color:transparent}.x-menu-item-group{list-style:none}.x-menu-item-group__title{padding:20px 20px 10px;font-size:13px;color:#909399;line-height:1}.x-menu-item-group>ul{padding:0}.x-sub-menu{list-style:none;margin:0;padding:0;position:relative}.x-sub-menu__title{display:flex;align-items:center;cursor:pointer;transition:all .3s ease;color:#303133}.x-sub-menu__icon{margin-right:8px;font-size:18px}.x-sub-menu__text{flex:1}.x-sub-menu__arrow{font-size:12px;transition:transform .3s;color:#909399;margin-left:4px}.x-sub-menu__arrow.is-open{transform:rotate(180deg)}.x-sub-menu__menu{list-style:none;margin:0;padding:0;background-color:#fff}.x-sub-menu--vertical{display:block;width:100%}.x-sub-menu--vertical .x-sub-menu__title{height:50px;line-height:50px;padding:0 20px}.x-sub-menu--vertical .x-sub-menu__title:hover{background-color:#f0f7ff}.x-sub-menu--vertical .x-sub-menu__menu{min-width:200px;border-right:none}.x-sub-menu--vertical .x-sub-menu__menu .x-menu-item{padding-left:40px}.x-sub-menu--vertical.is-nested .x-sub-menu__menu{position:absolute;left:100%;top:0;box-shadow:0 2px 12px #0000001a;border-radius:4px}.x-sub-menu--horizontal{display:inline-block;height:56px}.x-sub-menu--horizontal .x-sub-menu__title{height:56px;line-height:56px;padding:0 20px}.x-sub-menu--horizontal .x-sub-menu__title:hover{background-color:transparent}.x-sub-menu--horizontal .x-sub-menu__menu{position:absolute;top:100%;left:0;min-width:180px;box-shadow:0 2px 12px #0000001a;border-radius:4px;z-index:100}.x-sub-menu--horizontal .x-sub-menu__menu .x-menu-item{display:block;height:50px;line-height:50px;padding-left:20px}.x-sub-menu--horizontal .x-sub-menu__menu .x-menu-item.is-active:before{display:none}.x-sub-menu.is-collapse>.x-sub-menu__title{height:48px;line-height:48px;padding:0;text-align:center;justify-content:center}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__text,.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__arrow{display:none}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__icon{margin-right:0;font-size:20px}.x-sub-menu.is-collapse>.x-sub-menu__menu{position:absolute;left:64px;top:0;width:180px;box-shadow:0 2px 12px #0000001a;border-radius:4px;z-index:100}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-menu-item{height:50px;line-height:50px;padding:0 20px;text-align:left}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-menu-item .x-menu-item__text{display:inline}.x-sub-menu.is-active>.x-sub-menu__title{color:#409eff}.x-sub-menu.is-disabled .x-sub-menu__title{color:#c0c4cc;cursor:not-allowed}.x-sub-menu.is-opened>.x-sub-menu__title{background-color:#f0f7ff}.zoom-in-top-enter-active,.zoom-in-top-leave-active{opacity:1;transform:scaleY(1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transform-origin:center top}.zoom-in-top-enter-from,.zoom-in-top-leave-to{opacity:0;transform:scaleY(0)}.zoom-in-left-enter-active,.zoom-in-left-leave-active{opacity:1;transition:opacity .2s}.zoom-in-left-enter-from,.zoom-in-left-leave-to{opacity:0}.x-breadcrumb{font-size:14px;line-height:1}.x-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:0;list-style:none}.x-breadcrumb__item{display:inline-flex;align-items:center;color:#606266}.x-breadcrumb__item:last-child .x-breadcrumb__separator{display:none}.x-breadcrumb__item:last-child .x-breadcrumb__text{font-weight:500;color:#303133}.x-breadcrumb__link,.x-breadcrumb__text{display:inline-flex;align-items:center}.x-breadcrumb__link{cursor:pointer;transition:color .2s}.x-breadcrumb__link:hover{color:#409eff}.x-breadcrumb__text{color:inherit}.x-breadcrumb__separator{margin:0 8px;color:#c0c4cc;font-size:12px;-webkit-user-select:none;user-select:none}.x-breadcrumb__separator-icon{font-size:14px}.x-breadcrumb__item.is-disabled .x-breadcrumb__link,.x-breadcrumb__item.is-disabled .x-breadcrumb__text{color:#c0c4cc;cursor:not-allowed}.x-steps{display:flex;width:100%;font-size:14px}.x-steps--horizontal{flex-direction:row;align-items:flex-start}.x-steps--horizontal.is-center{align-items:center}.x-steps--vertical{flex-direction:column;min-height:300px}.x-steps.is-simple{display:flex;align-items:center;padding:12px 16px;background:#fafafa;border-radius:4px}.x-step{position:relative;flex:1;cursor:pointer}.x-step--horizontal{display:flex;flex-direction:column;align-items:center}.x-step--horizontal .x-step__head{display:flex;align-items:center;justify-content:center;width:100%;position:relative}.x-step--horizontal .x-step__icon{position:relative;z-index:1}.x-step--horizontal .x-step__line{flex:1;height:2px;background-color:#e4e7ed;transition:background-color .3s;min-width:20px}.x-step--horizontal .x-step__content{margin-top:10px;text-align:center;padding:0 4px}.x-step--vertical{display:flex;flex-direction:row}.x-step--vertical .x-step__head{display:flex;flex-direction:column;align-items:center;position:relative}.x-step--vertical .x-step__line{width:2px;height:32px;background-color:#e4e7ed;transition:background-color .3s}.x-step--vertical .x-step__content{margin-left:12px;flex:1;padding-bottom:24px}.x-step__head{display:flex;align-items:center}.x-step__icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#fff;border:2px solid #c0c4cc;color:#c0c4cc;flex-shrink:0;transition:all .3s;box-sizing:border-box}.x-step__icon-inner{font-size:13px;font-weight:600;color:inherit}.x-step__content{width:100%}.x-step__title{font-size:14px;font-weight:500;color:#303133;line-height:1.5}.x-step__description{font-size:12px;color:#909399;margin-top:4px;line-height:1.5}.x-step.is-wait .x-step__icon{border-color:#c0c4cc;color:#c0c4cc}.x-step.is-wait .x-step__title{color:#c0c4cc}.x-step.is-process .x-step__icon{border-color:#409eff;background-color:#409eff;color:#fff}.x-step.is-process .x-step__title{color:#303133;font-weight:600}.x-step.is-finish .x-step__icon{border-color:#67c23a;background-color:#67c23a;color:#fff}.x-step.is-finish .x-step__title{color:#303133}.x-step.is-finish .x-step__line{background-color:#67c23a}.x-step.is-success .x-step__icon{border-color:#67c23a;background-color:#67c23a;color:#fff}.x-step.is-success .x-step__title{color:#67c23a}.x-step.is-success .x-step__line{background-color:#67c23a}.x-step.is-error .x-step__icon{border-color:#f56c6c;background-color:#f56c6c;color:#fff}.x-step.is-error .x-step__title{color:#f56c6c}.x-page-header{padding:16px 0}.x-page-header__main{display:flex;align-items:center;justify-content:space-between;line-height:28px}.x-page-header__left{display:flex;align-items:center;flex:1;min-width:0}.x-page-header__back{display:inline-flex;align-items:center;margin-right:16px;font-size:14px;color:#606266;cursor:pointer;transition:color .2s}.x-page-header__back:hover{color:#409eff}.x-page-header__back-icon{font-size:16px}.x-page-header__back-text{margin-left:4px}.x-page-header__title{font-size:20px;font-weight:600;color:#303133}.x-page-header__subtitle{margin-left:12px;font-size:14px;font-weight:400;color:#909399}.x-page-header__extra{flex-shrink:0;display:flex;align-items:center;gap:8px}.x-page-header__content{margin-top:16px}.x-page-header__footer{margin-top:16px;padding-top:16px;border-top:1px solid #ebeef5}
|
|
1
|
+
.x-tabs__header{position:relative}.x-tabs__nav{display:flex;border-bottom:2px solid #e4e7ed}.x-tabs__item{padding:0 20px;height:40px;line-height:40px;font-size:14px;color:#606266;cursor:pointer;transition:color .2s;position:relative}.x-tabs__item:hover{color:#409eff}.x-tabs__item--active{color:#409eff;font-weight:500}.x-tabs__item--active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:2px;background-color:#409eff}.x-tabs__item.is-disabled{color:#c0c4cc;cursor:not-allowed}.x-tabs__item.is-disabled:hover{color:#c0c4cc}.x-tabs__content{padding:20px 0}.x-tabs--card .x-tabs__nav{border-bottom:none}.x-tabs--card .x-tabs__item{border:1px solid #e4e7ed;border-bottom:none;margin-right:-1px;padding:0 16px}.x-tabs--card .x-tabs__item--active{background-color:#fff;border-bottom:1px solid #fff}.x-tab-pane{padding:20px;outline:none}.x-menu{list-style:none;margin:0;padding:0;position:relative;font-size:14px;box-sizing:border-box}.x-menu--vertical{display:block;width:220px;min-height:100%;border-right:1px solid #e6e6e6;transition:width .3s ease,background-color .3s ease}.x-menu--vertical>.x-menu-item,.x-menu--vertical>.x-sub-menu{display:block;width:100%}.x-menu--horizontal{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;width:100%;border-bottom:1px solid #e6e6e6}.x-menu--horizontal>.x-menu-item,.x-menu--horizontal>.x-sub-menu{flex:0 0 auto}.x-menu.is-collapse{width:64px!important;min-width:64px}.x-menu.is-collapse>.x-menu-item{height:56px;line-height:56px;padding:0 20px;text-align:center}.x-menu.is-collapse>.x-menu-item .x-menu-item__content{justify-content:center}.x-menu.is-collapse>.x-menu-item .x-menu-item__text{display:none}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title{height:56px;line-height:56px;padding:0 20px;text-align:center;justify-content:center}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__content{justify-content:center}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__text,.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__title .x-sub-menu__arrow{display:none}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu{position:absolute;left:64px;top:0;min-width:180px;background-color:#fff;box-shadow:0 2px 12px #0000001f;border-radius:4px;z-index:100;border:1px solid #e4e7ed}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-menu-item{height:50px;line-height:50px;padding:0 20px;text-align:left}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-menu-item .x-menu-item__content{justify-content:flex-start}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-menu-item .x-menu-item__text{display:inline}.x-menu.is-collapse>.x-sub-menu>.x-sub-menu__menu .x-sub-menu__title .x-sub-menu__text{display:inline}.x-menu.is-dark{background-color:#1f2d3d;border-color:#1f2d3d;color:#bfcbd9}.x-menu.is-dark .x-menu-item,.x-menu.is-dark .x-sub-menu__title{color:#bfcbd9}.x-menu.is-dark .x-menu-item:hover,.x-menu.is-dark .x-sub-menu__title:hover{background-color:#263445}.x-menu.is-dark .x-menu-item.is-active{color:#409eff;background-color:#263445}.x-menu.is-dark .x-sub-menu__menu{background-color:#1f2d3d;border-color:#1f2d3d}.x-menu-item{list-style:none;margin:0;padding:0 20px;cursor:pointer;transition:all .3s ease;height:56px;line-height:56px;color:#303133;position:relative;white-space:nowrap;box-sizing:border-box}.x-menu-item__content{display:flex;align-items:center;height:100%}.x-menu-item__icon{margin-right:8px;font-size:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.x-menu-item__icon svg,.x-menu-item__icon i{font-size:18px}.x-menu-item__text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:opacity .3s ease}.x-menu-item:hover{background-color:#f0f7ff}.x-menu-item.is-active{color:#409eff;background-color:#ecf5ff}.x-menu-item.is-active:not(.is-horizontal):before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background-color:#409eff;border-radius:0 2px 2px 0}.x-menu-item.is-collapse{padding:0;text-align:center}.x-menu-item.is-collapse .x-menu-item__content{justify-content:center;padding:0}.x-menu-item.is-collapse .x-menu-item__icon{margin-right:0;font-size:20px}.x-menu-item.is-collapse .x-menu-item__icon svg,.x-menu-item.is-collapse .x-menu-item__icon i{font-size:20px}.x-menu-item.is-collapse .x-menu-item__text{opacity:0;width:0;overflow:hidden}.x-menu-item.is-horizontal{display:inline-block;height:56px;line-height:56px}.x-menu-item.is-horizontal:hover{background-color:transparent}.x-menu-item.is-horizontal.is-active{background-color:transparent;border-bottom:2px solid #409eff}.x-menu-item.is-horizontal.is-active:before{display:none}.x-menu-item.is-disabled{color:#c0c4cc;cursor:not-allowed}.x-menu-item.is-disabled:hover{background-color:transparent}.x-menu-item-group{list-style:none}.x-menu-item-group__title{padding:20px 20px 10px;font-size:13px;color:#909399;line-height:1}.x-menu-item-group>ul{padding:0}.x-sub-menu{list-style:none;margin:0;padding:0;position:relative}.x-sub-menu__title{display:flex;align-items:center;cursor:pointer;transition:all .3s ease;color:#303133;height:100%}.x-sub-menu__content{display:flex;align-items:center;width:100%;height:100%}.x-sub-menu__icon{margin-right:8px;font-size:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.x-sub-menu__icon svg,.x-sub-menu__icon i{font-size:18px}.x-sub-menu__text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:opacity .3s ease}.x-sub-menu__arrow{font-size:12px;transition:transform .3s ease;color:#909399;margin-left:4px;display:flex;align-items:center}.x-sub-menu__arrow svg{transition:transform .3s ease}.x-sub-menu__arrow.is-open svg{transform:rotate(180deg)}.x-sub-menu__menu{list-style:none;margin:0;padding:0;background-color:#fff}.x-sub-menu__menu.is-collapse{border:1px solid #e4e7ed;border-radius:4px}.x-sub-menu--vertical{display:block;width:100%}.x-sub-menu--vertical .x-sub-menu__title{height:56px;line-height:56px;padding:0 20px}.x-sub-menu--vertical .x-sub-menu__title:hover{background-color:#f0f7ff}.x-sub-menu--vertical .x-sub-menu__menu{min-width:200px;border-right:none}.x-sub-menu--vertical .x-sub-menu__menu .x-menu-item,.x-sub-menu--vertical .x-sub-menu__menu .x-sub-menu__title{padding-left:40px}.x-sub-menu--vertical.is-nested .x-sub-menu__menu{position:absolute;left:100%;top:0;box-shadow:0 2px 12px #0000001f;border-radius:4px;border:1px solid #e4e7ed}.x-sub-menu--horizontal{display:inline-block;height:56px}.x-sub-menu--horizontal .x-sub-menu__title{height:56px;line-height:56px;padding:0 20px}.x-sub-menu--horizontal .x-sub-menu__title:hover{background-color:transparent}.x-sub-menu--horizontal .x-sub-menu__menu{position:absolute;top:100%;left:0;min-width:180px;box-shadow:0 2px 12px #0000001f;border-radius:4px;z-index:100;border:1px solid #e4e7ed}.x-sub-menu--horizontal .x-sub-menu__menu .x-menu-item{display:block;height:50px;line-height:50px;padding-left:20px}.x-sub-menu--horizontal .x-sub-menu__menu .x-menu-item.is-active:before{display:none}.x-sub-menu.is-collapse>.x-sub-menu__title{height:56px;line-height:56px;padding:0 20px;text-align:center}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__content{justify-content:center}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__text,.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__arrow{display:none}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__icon{margin-right:0;font-size:20px}.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__icon svg,.x-sub-menu.is-collapse>.x-sub-menu__title .x-sub-menu__icon i{font-size:20px}.x-sub-menu.is-collapse>.x-sub-menu__menu{position:absolute;left:64px;top:0;min-width:180px;box-shadow:0 2px 12px #0000001f;border-radius:4px;z-index:100;border:1px solid #e4e7ed;background-color:#fff}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-menu-item{height:50px;line-height:50px;padding:0 20px;text-align:left}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-menu-item .x-menu-item__content{justify-content:flex-start}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-menu-item .x-menu-item__text{display:inline;opacity:1;width:auto}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-sub-menu__title{padding:0 20px}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-sub-menu__title .x-sub-menu__text{display:inline;opacity:1}.x-sub-menu.is-collapse>.x-sub-menu__menu .x-sub-menu__title .x-sub-menu__arrow{display:flex}.x-sub-menu.is-active>.x-sub-menu__title{color:#409eff}.x-sub-menu.is-disabled .x-sub-menu__title{color:#c0c4cc;cursor:not-allowed}.x-sub-menu.is-opened>.x-sub-menu__title{background-color:#f0f7ff}.zoom-in-top-enter-active,.zoom-in-top-leave-active{opacity:1;transform:scaleY(1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transform-origin:center top}.zoom-in-top-enter-from,.zoom-in-top-leave-to{opacity:0;transform:scaleY(0)}.zoom-in-left-enter-active,.zoom-in-left-leave-active{opacity:1;transition:opacity .2s ease,transform .2s ease;transform:translate(0)}.zoom-in-left-enter-from,.zoom-in-left-leave-to{opacity:0;transform:translate(-10px)}.x-breadcrumb{font-size:14px;line-height:1}.x-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:0;list-style:none}.x-breadcrumb__item{display:inline-flex;align-items:center;color:#606266}.x-breadcrumb__item:last-child .x-breadcrumb__separator{display:none}.x-breadcrumb__item:last-child .x-breadcrumb__text{font-weight:500;color:#303133}.x-breadcrumb__link,.x-breadcrumb__text{display:inline-flex;align-items:center}.x-breadcrumb__link{cursor:pointer;transition:color .2s}.x-breadcrumb__link:hover{color:#409eff}.x-breadcrumb__text{color:inherit}.x-breadcrumb__separator{margin:0 8px;color:#c0c4cc;font-size:12px;-webkit-user-select:none;user-select:none}.x-breadcrumb__separator-icon{font-size:14px}.x-breadcrumb__item.is-disabled .x-breadcrumb__link,.x-breadcrumb__item.is-disabled .x-breadcrumb__text{color:#c0c4cc;cursor:not-allowed}.x-steps{display:flex;width:100%;font-size:14px}.x-steps--horizontal{flex-direction:row;align-items:flex-start}.x-steps--horizontal.is-center{align-items:center}.x-steps--vertical{flex-direction:column;min-height:300px}.x-steps.is-simple{display:flex;align-items:center;padding:12px 16px;background:#fafafa;border-radius:4px}.x-step{position:relative;flex:1;cursor:pointer}.x-step--horizontal{display:flex;flex-direction:column;align-items:center}.x-step--horizontal .x-step__head{display:flex;align-items:center;justify-content:center;width:100%;position:relative}.x-step--horizontal .x-step__icon{position:relative;z-index:1}.x-step--horizontal .x-step__line{flex:1;height:2px;background-color:#e4e7ed;transition:background-color .3s;min-width:20px}.x-step--horizontal .x-step__content{margin-top:10px;text-align:center;padding:0 4px}.x-step--vertical{display:flex;flex-direction:row}.x-step--vertical .x-step__head{display:flex;flex-direction:column;align-items:center;position:relative}.x-step--vertical .x-step__line{width:2px;height:32px;background-color:#e4e7ed;transition:background-color .3s}.x-step--vertical .x-step__content{margin-left:12px;flex:1;padding-bottom:24px}.x-step__head{display:flex;align-items:center}.x-step__icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#fff;border:2px solid #c0c4cc;color:#c0c4cc;flex-shrink:0;transition:all .3s;box-sizing:border-box}.x-step__icon-inner{font-size:13px;font-weight:600;color:inherit}.x-step__content{width:100%}.x-step__title{font-size:14px;font-weight:500;color:#303133;line-height:1.5}.x-step__description{font-size:12px;color:#909399;margin-top:4px;line-height:1.5}.x-step.is-wait .x-step__icon{border-color:#c0c4cc;color:#c0c4cc}.x-step.is-wait .x-step__title{color:#c0c4cc}.x-step.is-process .x-step__icon{border-color:#409eff;background-color:#409eff;color:#fff}.x-step.is-process .x-step__title{color:#303133;font-weight:600}.x-step.is-finish .x-step__icon{border-color:#67c23a;background-color:#67c23a;color:#fff}.x-step.is-finish .x-step__title{color:#303133}.x-step.is-finish .x-step__line{background-color:#67c23a}.x-step.is-success .x-step__icon{border-color:#67c23a;background-color:#67c23a;color:#fff}.x-step.is-success .x-step__title{color:#67c23a}.x-step.is-success .x-step__line{background-color:#67c23a}.x-step.is-error .x-step__icon{border-color:#f56c6c;background-color:#f56c6c;color:#fff}.x-step.is-error .x-step__title{color:#f56c6c}.x-page-header{padding:16px 0}.x-page-header__main{display:flex;align-items:center;justify-content:space-between;line-height:28px}.x-page-header__left{display:flex;align-items:center;flex:1;min-width:0}.x-page-header__back{display:inline-flex;align-items:center;margin-right:16px;font-size:14px;color:#606266;cursor:pointer;transition:color .2s}.x-page-header__back:hover{color:#409eff}.x-page-header__back-icon{font-size:16px}.x-page-header__back-text{margin-left:4px}.x-page-header__title{font-size:20px;font-weight:600;color:#303133}.x-page-header__subtitle{margin-left:12px;font-size:14px;font-weight:400;color:#909399}.x-page-header__extra{flex-shrink:0;display:flex;align-items:center;gap:8px}.x-page-header__content{margin-top:16px}.x-page-header__footer{margin-top:16px;padding-top:16px;border-top:1px solid #ebeef5}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xto/navigation",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "1.0.0",
|
|
4
4
|
"description": "Xto Navigation - Navigation components",
|
|
5
5
|
"main": "./lib/index.cjs",
|
|
6
6
|
"module": "./es/index.mjs",
|
|
@@ -19,20 +19,20 @@
|
|
|
19
19
|
"publishConfig": {
|
|
20
20
|
"access": "public"
|
|
21
21
|
},
|
|
22
|
+
"scripts": {
|
|
23
|
+
"build": "vite build"
|
|
24
|
+
},
|
|
22
25
|
"dependencies": {
|
|
23
|
-
"@xto/core": "
|
|
26
|
+
"@xto/core": "workspace:*"
|
|
24
27
|
},
|
|
25
28
|
"peerDependencies": {
|
|
26
29
|
"vue": "^3.4.0"
|
|
27
30
|
},
|
|
28
31
|
"devDependencies": {
|
|
32
|
+
"@xto/build": "workspace:*",
|
|
29
33
|
"typescript": "^5.4.2",
|
|
30
34
|
"vite": "^5.2.0",
|
|
31
35
|
"vitest": "^1.4.0",
|
|
32
|
-
"vue": "^3.4.21"
|
|
33
|
-
"@xto/build": "0.1.0"
|
|
34
|
-
},
|
|
35
|
-
"scripts": {
|
|
36
|
-
"build": "vite build"
|
|
36
|
+
"vue": "^3.4.21"
|
|
37
37
|
}
|
|
38
38
|
}
|