@done-coding/admin-core 0.8.3-alpha.0 → 0.9.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.
Files changed (89) hide show
  1. package/es/bridge/config-hook.mjs +37 -0
  2. package/es/bridge/index.mjs +157 -62
  3. package/es/bridge/plugin.mjs +29 -0
  4. package/es/bridge/theme.mjs +62 -0
  5. package/es/components/app-layout/AppBody.vue.mjs +1 -1
  6. package/es/components/app-layout/AppBody.vue2.mjs +47 -49
  7. package/es/components/app-layout/AppBreadcrumb.vue.mjs +1 -1
  8. package/es/components/app-layout/AppBreadcrumb.vue2.mjs +35 -41
  9. package/es/components/app-layout/AppFooter.vue.mjs +2 -2
  10. package/es/components/app-layout/AppFooter.vue2.mjs +8 -8
  11. package/es/components/app-layout/AppHeader.vue.mjs +1 -1
  12. package/es/components/app-layout/AppHeader.vue2.mjs +60 -69
  13. package/es/components/app-layout/AppLayout.vue.mjs +2 -2
  14. package/es/components/app-layout/AppLayout.vue2.mjs +95 -93
  15. package/es/components/app-layout/AppSidebar.vue.mjs +2 -2
  16. package/es/components/app-layout/AppSidebar.vue2.mjs +79 -82
  17. package/es/components/app-layout/AppTheme.vue.mjs +7 -0
  18. package/es/components/app-layout/AppTheme.vue2.mjs +38 -0
  19. package/es/components/data-view/DataListView.vue.mjs +2 -2
  20. package/es/components/data-view/DataListView.vue2.mjs +36 -36
  21. package/es/components/display/ActionConfirm.vue2.mjs +16 -16
  22. package/es/components/display/HeightProvider.vue.mjs +10 -10
  23. package/es/components/display/TabsHeader.vue.mjs +4 -4
  24. package/es/components/display/TabsHeader.vue2.mjs +34 -34
  25. package/es/components/display/TabsMain.vue.mjs +40 -39
  26. package/es/components/display/TabsRefineFlow.vue.mjs +30 -28
  27. package/es/components/form/FormItem.vue.mjs +1 -1
  28. package/es/components/form/FormItem.vue2.mjs +75 -81
  29. package/es/components/form/FormMain.vue.mjs +81 -88
  30. package/es/components/form/FormRadioGroup.vue.mjs +42 -49
  31. package/es/components/form/FormSearch.vue.mjs +1 -1
  32. package/es/components/form/FormSearch.vue2.mjs +116 -123
  33. package/es/components/form/FormSelect.vue.mjs +34 -40
  34. package/es/components/form/FormSubmitBtn.vue.mjs +23 -28
  35. package/es/components/form/FormSubmitPanel.vue.mjs +2 -2
  36. package/es/components/form/FormSubmitPanel.vue2.mjs +16 -16
  37. package/es/components/form/FormTree.vue.mjs +16 -21
  38. package/es/components/form/FormVerifyCode.vue.mjs +37 -43
  39. package/es/components/form/FormVerifyImage.vue.mjs +2 -2
  40. package/es/components/form/FormVerifyImage.vue2.mjs +36 -41
  41. package/es/components/list-page/ListPage.vue.mjs +2 -2
  42. package/es/components/list-page/ListPage.vue2.mjs +134 -139
  43. package/es/components/menu/MenuItemSub.vue.mjs +41 -48
  44. package/es/components/menu/MenuTree.vue.mjs +58 -65
  45. package/es/components/misc/AutoRefresh.vue.mjs +2 -2
  46. package/es/components/misc/AutoRefresh.vue2.mjs +44 -51
  47. package/es/components/misc/AutoRefreshGroup.vue.mjs +2 -2
  48. package/es/components/misc/AutoRefreshGroup.vue2.mjs +37 -43
  49. package/es/components/modal/ConfirmModal.vue.mjs +3 -3
  50. package/es/components/modal/ConfirmModal.vue2.mjs +93 -100
  51. package/es/components/modal/DetailModal.vue.mjs +38 -41
  52. package/es/components/panel/PanelEditSwitch.vue.mjs +1 -1
  53. package/es/components/panel/PanelEditSwitch.vue2.mjs +50 -55
  54. package/es/components/panel/PanelMain.vue.mjs +2 -2
  55. package/es/components/panel/PanelMain.vue2.mjs +67 -74
  56. package/es/components/table/TableMain.vue.mjs +2 -2
  57. package/es/components/table/TableMain.vue2.mjs +221 -229
  58. package/es/components/table/TableToolbar.vue.mjs +2 -2
  59. package/es/components/table/TableToolbar.vue2.mjs +115 -126
  60. package/es/hooks/use-admin-theme-apply.mjs +84 -0
  61. package/es/hooks/use-admin-viewport-apply.mjs +27 -0
  62. package/es/index.mjs +125 -117
  63. package/es/inject/key.mjs +7 -4
  64. package/es/store/app.mjs +75 -84
  65. package/es/style.css +1 -1
  66. package/es/utils/theme-scale.mjs +37 -0
  67. package/package.json +2 -4
  68. package/types/bridge/config-hook.d.ts +91 -0
  69. package/types/bridge/index.d.ts +108 -8
  70. package/types/bridge/plugin.d.ts +39 -0
  71. package/types/bridge/theme.d.ts +66 -0
  72. package/types/components/app-layout/AppTheme.vue.d.ts +2 -0
  73. package/types/components/app-layout/types.d.ts +1 -1
  74. package/types/components/form/FormItem.vue.d.ts +12 -12
  75. package/types/components/form/FormTree.vue.d.ts +50 -50
  76. package/types/components/menu/MenuTree.vue.d.ts +10 -10
  77. package/types/components/modal/ModalShelf.vue.d.ts +1 -1
  78. package/types/components/table/TableMain.vue.d.ts +1 -1
  79. package/types/hooks/activated.d.ts +2 -2
  80. package/types/hooks/feel-size.d.ts +1 -1
  81. package/types/hooks/index.d.ts +2 -0
  82. package/types/hooks/menus-dispatch.d.ts +5 -5
  83. package/types/hooks/use-admin-theme-apply.d.ts +17 -0
  84. package/types/hooks/use-admin-viewport-apply.d.ts +15 -0
  85. package/types/hooks/use-breakpoint.d.ts +1 -1
  86. package/types/inject/key.d.ts +18 -0
  87. package/types/store/app.d.ts +138 -59
  88. package/types/utils/index.d.ts +1 -0
  89. package/types/utils/theme-scale.d.ts +35 -0
@@ -0,0 +1,38 @@
1
+ import { defineComponent as u, inject as p, computed as n, openBlock as a, createElementBlock as r, createBlock as c, unref as t, withCtx as v, Fragment as d, renderList as _, createCommentVNode as h, createVNode as f } from "vue";
2
+ import { ElSelect as k, ElOption as y, ElSwitch as E } from "element-plus";
3
+ import { Sunny as S, Moon as B } from "@element-plus/icons-vue";
4
+ import { APP_LAYOUT_BRIDGE_KEY as g } from "../../inject/key.mjs";
5
+ const C = { class: "app-theme" }, V = /* @__PURE__ */ u({
6
+ __name: "AppTheme",
7
+ setup(D) {
8
+ const l = p(g), m = n(() => l.themeIsDark.value), s = n(() => l.themeStyle.value), i = n(() => l.theme.list.value);
9
+ return (b, o) => (a(), r("div", C, [
10
+ i.value.length > 1 ? (a(), c(t(k), {
11
+ key: 0,
12
+ "model-value": s.value,
13
+ class: "app-theme__style-select",
14
+ size: "small",
15
+ onChange: o[0] || (o[0] = (e) => t(l).theme.setStyle(e))
16
+ }, {
17
+ default: v(() => [
18
+ (a(!0), r(d, null, _(i.value, (e) => (a(), c(t(y), {
19
+ key: e,
20
+ label: e,
21
+ value: e
22
+ }, null, 8, ["label", "value"]))), 128))
23
+ ]),
24
+ _: 1
25
+ }, 8, ["model-value"])) : h("", !0),
26
+ f(t(E), {
27
+ "model-value": m.value,
28
+ class: "app-theme__dark-switch",
29
+ "active-action-icon": t(B),
30
+ "inactive-action-icon": t(S),
31
+ "onUpdate:modelValue": o[1] || (o[1] = (e) => t(l).theme.setDark(!!e))
32
+ }, null, 8, ["model-value", "active-action-icon", "inactive-action-icon"])
33
+ ]));
34
+ }
35
+ });
36
+ export {
37
+ V as default
38
+ };
@@ -1,7 +1,7 @@
1
1
  import t from "./DataListView.vue2.mjs";
2
2
  /* empty css */
3
- import a from "../../_virtual/_plugin-vue_export-helper.mjs";
4
- const i = /* @__PURE__ */ a(t, [["__scopeId", "data-v-da38bea6"]]);
3
+ import o from "../../_virtual/_plugin-vue_export-helper.mjs";
4
+ const i = /* @__PURE__ */ o(t, [["__scopeId", "data-v-708af83f"]]);
5
5
  export {
6
6
  i as default
7
7
  };
@@ -1,11 +1,11 @@
1
- import { defineComponent as v, computed as m, ref as A, watch as F, openBlock as i, createElementBlock as p, normalizeStyle as H, unref as f, Fragment as z, renderList as E, createBlock as K, withCtx as q, renderSlot as k, createVNode as I, markRaw as M, h as c } from "vue";
1
+ import { defineComponent as S, computed as m, ref as R, watch as A, openBlock as i, createElementBlock as p, normalizeStyle as F, Fragment as H, renderList as z, createBlock as E, withCtx as K, renderSlot as h, createVNode as q, unref as I, markRaw as M, h as c } from "vue";
2
2
  import { ElEmpty as N } from "element-plus";
3
3
  import O from "./DataListViewItem.vue.mjs";
4
4
  import { createDataListViewInstance as P } from "./utils.mjs";
5
5
  const j = {
6
6
  key: 1,
7
7
  class: "data-list-view-empty"
8
- }, T = /* @__PURE__ */ v({
8
+ }, T = /* @__PURE__ */ S({
9
9
  __name: "DataListView",
10
10
  props: {
11
11
  data: {},
@@ -16,26 +16,26 @@ const j = {
16
16
  getRenderCtxParams: {}
17
17
  },
18
18
  emits: ["selectionChange"],
19
- setup(r, { expose: C, emit: b }) {
20
- const o = r, V = b, s = (t) => {
19
+ setup(r, { expose: k, emit: C }) {
20
+ const o = r, b = C, s = (t) => {
21
21
  const e = o.rowKey;
22
22
  return typeof e == "function" ? e(t) : String(t[e]);
23
- }, D = m(
23
+ }, V = m(
24
24
  () => o.maxHeight ? { maxHeight: `${o.maxHeight}px`, overflowY: "auto" } : void 0
25
- ), l = A(/* @__PURE__ */ new Set()), L = m(() => l.value.size === o.data.length), g = (t) => o.selectable && l.value.has(s(t)), d = () => {
26
- V("selectionChange", y());
27
- }, y = () => o.selectable ? o.data.filter((t) => l.value.has(s(t))) : [], w = () => {
25
+ ), l = R(/* @__PURE__ */ new Set()), D = m(() => l.value.size === o.data.length), f = (t) => o.selectable && l.value.has(s(t)), d = () => {
26
+ b("selectionChange", g());
27
+ }, g = () => o.selectable ? o.data.filter((t) => l.value.has(s(t))) : [], y = () => {
28
28
  l.value = /* @__PURE__ */ new Set(), d();
29
- }, _ = () => {
29
+ }, L = () => {
30
30
  if (!o.selectable) return;
31
- const t = !L.value;
31
+ const t = !D.value;
32
32
  l.value = t ? new Set(o.data.map((e) => s(e))) : /* @__PURE__ */ new Set(), d();
33
- }, x = (t) => {
33
+ }, v = (t) => {
34
34
  if (!o.selectable) return;
35
35
  const e = s(t), n = new Set(l.value);
36
36
  n.has(e) ? n.delete(e) : n.add(e), l.value = n, d();
37
- }, $ = (t) => M(
38
- v({
37
+ }, _ = (t) => M(
38
+ S({
39
39
  name: "DataViewField",
40
40
  props: {
41
41
  row: { type: Object, required: !0 },
@@ -45,7 +45,7 @@ const j = {
45
45
  },
46
46
  setup(e) {
47
47
  return () => {
48
- const { type: n, render: a, prop: S } = t;
48
+ const { type: n, render: a, prop: w } = t;
49
49
  if (n === "index")
50
50
  return c("span", String(e.index + 1));
51
51
  if (n === "selection")
@@ -53,8 +53,8 @@ const j = {
53
53
  type: "checkbox",
54
54
  checked: e.selected,
55
55
  onChange: () => {
56
- var h;
57
- return (h = e.toggleSelect) == null ? void 0 : h.call(e);
56
+ var x;
57
+ return (x = e.toggleSelect) == null ? void 0 : x.call(e);
58
58
  }
59
59
  });
60
60
  if (typeof a == "function")
@@ -66,12 +66,12 @@ const j = {
66
66
  });
67
67
  if (a)
68
68
  return c(a);
69
- const u = S ? e.row[S] : void 0;
69
+ const u = w ? e.row[w] : void 0;
70
70
  return c("span", u == null ? "" : String(u));
71
71
  };
72
72
  }
73
73
  })
74
- ), B = m(() => {
74
+ ), $ = m(() => {
75
75
  const t = {};
76
76
  for (const e of o.columns) {
77
77
  if (e.type === "expand") continue;
@@ -83,42 +83,42 @@ const j = {
83
83
  );
84
84
  continue;
85
85
  }
86
- t[n] && console.warn(`[DataListView] 列 key 重复 "${n}",后者覆盖前者`), t[n] = $(e);
86
+ t[n] && console.warn(`[DataListView] 列 key 重复 "${n}",后者覆盖前者`), t[n] = _(e);
87
87
  }
88
88
  return t;
89
- }), R = P({
90
- clearSelection: w,
91
- getSelectionRows: y,
92
- toggleRowSelection: x,
93
- toggleAllSelection: _,
89
+ }), B = P({
90
+ clearSelection: y,
91
+ getSelectionRows: g,
92
+ toggleRowSelection: v,
93
+ toggleAllSelection: L,
94
94
  columns: o.columns
95
95
  });
96
- return C(R), F(
96
+ return k(B), A(
97
97
  () => o.data,
98
98
  () => {
99
- l.value.size && w();
99
+ l.value.size && y();
100
100
  }
101
101
  ), (t, e) => (i(), p("div", {
102
102
  class: "data-list-view",
103
- style: H(f(D))
103
+ style: F(V.value)
104
104
  }, [
105
- r.data.length ? (i(!0), p(z, { key: 0 }, E(r.data, (n, a) => (i(), K(O, {
105
+ r.data.length ? (i(!0), p(H, { key: 0 }, z(r.data, (n, a) => (i(), E(O, {
106
106
  key: s(n),
107
- selected: g(n)
107
+ selected: f(n)
108
108
  }, {
109
- default: q(() => [
110
- k(t.$slots, "item", {
111
- fieldComponentMap: f(B),
109
+ default: K(() => [
110
+ h(t.$slots, "item", {
111
+ fieldComponentMap: $.value,
112
112
  row: n,
113
113
  index: a,
114
- selected: g(n),
115
- toggleSelect: () => x(n)
114
+ selected: f(n),
115
+ toggleSelect: () => v(n)
116
116
  }, void 0, !0)
117
117
  ]),
118
118
  _: 2
119
119
  }, 1032, ["selected"]))), 128)) : (i(), p("div", j, [
120
- k(t.$slots, "empty", {}, () => [
121
- I(f(N))
120
+ h(t.$slots, "empty", {}, () => [
121
+ q(I(N))
122
122
  ], !0)
123
123
  ]))
124
124
  ], 4));
@@ -1,5 +1,5 @@
1
- import { defineComponent as V, useModel as P, ref as $, computed as s, h as r, openBlock as o, createBlock as u, unref as d, withCtx as c, createElementVNode as x, createElementBlock as f, resolveDynamicComponent as C, createCommentVNode as k, createVNode as m, createTextVNode as T, toDisplayString as _, renderSlot as v, Fragment as z, mergeModels as D } from "vue";
2
- import { ElPopover as S, ElButton as b } from "element-plus";
1
+ import { defineComponent as _, useModel as P, ref as $, computed as s, h as r, openBlock as o, createBlock as u, unref as d, withCtx as c, createElementVNode as C, createElementBlock as f, resolveDynamicComponent as x, createCommentVNode as k, createVNode as m, createTextVNode as T, toDisplayString as b, renderSlot as v, Fragment as z, mergeModels as D } from "vue";
2
+ import { ElPopover as S, ElButton as N } from "element-plus";
3
3
  import A from "../modal/ConfirmModal.vue.mjs";
4
4
  const U = { class: "action-confirm" }, j = {
5
5
  key: 0,
@@ -7,7 +7,7 @@ const U = { class: "action-confirm" }, j = {
7
7
  }, q = {
8
8
  key: 1,
9
9
  class: "action-confirm__content"
10
- }, G = { class: "action-confirm__actions" }, K = /* @__PURE__ */ V({
10
+ }, G = { class: "action-confirm__actions" }, K = /* @__PURE__ */ _({
11
11
  __name: "ActionConfirm",
12
12
  props: /* @__PURE__ */ D({
13
13
  mode: {},
@@ -29,7 +29,7 @@ const U = { class: "action-confirm" }, j = {
29
29
  }, y = (e) => {
30
30
  if (!(e == null || e === ""))
31
31
  return typeof e == "string" ? () => r("span", e) : () => e;
32
- }, p = s(() => y(l(n.title))), h = s(() => y(l(n.content))), N = async () => {
32
+ }, p = s(() => y(l(n.title))), h = s(() => y(l(n.content))), B = async () => {
33
33
  a.value = !0;
34
34
  try {
35
35
  await Promise.resolve(n.submitFn()), i.value = !1;
@@ -39,7 +39,7 @@ const U = { class: "action-confirm" }, j = {
39
39
  }
40
40
  }, g = () => {
41
41
  i.value = !1;
42
- }, B = s(() => {
42
+ }, M = s(() => {
43
43
  const e = l(n.title);
44
44
  if (!(e === void 0 || e === ""))
45
45
  return typeof e == "string" ? e : () => r("span", e);
@@ -64,32 +64,32 @@ const U = { class: "action-confirm" }, j = {
64
64
  v(e.$slots, "default", {}, void 0, !0)
65
65
  ]),
66
66
  default: c(() => [
67
- x("div", U, [
67
+ C("div", U, [
68
68
  p.value ? (o(), f("div", j, [
69
- (o(), u(C(p.value)))
69
+ (o(), u(x(p.value)))
70
70
  ])) : k("", !0),
71
71
  h.value ? (o(), f("div", q, [
72
- (o(), u(C(h.value)))
72
+ (o(), u(x(h.value)))
73
73
  ])) : k("", !0),
74
- x("div", G, [
75
- m(d(b), {
74
+ C("div", G, [
75
+ m(d(N), {
76
76
  size: "small",
77
77
  disabled: a.value,
78
78
  onClick: g
79
79
  }, {
80
80
  default: c(() => [
81
- T(_(t.cancelText), 1)
81
+ T(b(t.cancelText), 1)
82
82
  ]),
83
83
  _: 1
84
84
  }, 8, ["disabled"]),
85
- m(d(b), {
85
+ m(d(N), {
86
86
  size: "small",
87
87
  type: t.type,
88
88
  loading: a.value,
89
- onClick: N
89
+ onClick: B
90
90
  }, {
91
91
  default: c(() => [
92
- T(_(t.confirmText), 1)
92
+ T(b(t.confirmText), 1)
93
93
  ]),
94
94
  _: 1
95
95
  }, 8, ["type", "loading"])
@@ -101,8 +101,8 @@ const U = { class: "action-confirm" }, j = {
101
101
  v(e.$slots, "default", {}, void 0, !0),
102
102
  m(A, {
103
103
  show: i.value,
104
- "onUpdate:show": w[0] || (w[0] = (M) => i.value = M),
105
- title: B.value,
104
+ "onUpdate:show": w[0] || (w[0] = (V) => i.value = V),
105
+ title: M.value,
106
106
  content: E.value,
107
107
  "confirm-text": t.confirmText,
108
108
  "cancel-text": t.cancelText,
@@ -1,14 +1,14 @@
1
- import { defineComponent as p, ref as u, computed as a, watch as d, openBlock as i, createElementBlock as g, Fragment as f, createBlock as H, withCtx as v, renderSlot as n, createCommentVNode as w, normalizeProps as C, guardReactiveProps as _, unref as k } from "vue";
2
- import P from "./WatchSize.vue.mjs";
3
- const S = /* @__PURE__ */ p({
1
+ import { defineComponent as p, ref as u, computed as a, watch as d, openBlock as i, createElementBlock as g, Fragment as f, createBlock as v, withCtx as H, renderSlot as n, createCommentVNode as w, normalizeProps as C, guardReactiveProps as _ } from "vue";
2
+ import k from "./WatchSize.vue.mjs";
3
+ const V = /* @__PURE__ */ p({
4
4
  __name: "HeightProvider",
5
5
  props: {
6
6
  viewportHeight: {},
7
7
  minHeight: { default: 0 }
8
8
  },
9
9
  emits: ["childViewportHeightChange"],
10
- setup(s, { emit: l }) {
11
- const t = s, h = l, o = u(0), r = a(
10
+ setup(l, { emit: s }) {
11
+ const t = l, h = s, o = u(0), r = a(
12
12
  () => Math.max(t.viewportHeight - o.value, t.minHeight)
13
13
  ), m = (e) => {
14
14
  o.value = e;
@@ -19,20 +19,20 @@ const S = /* @__PURE__ */ p({
19
19
  );
20
20
  return d(r, (e) => h("childViewportHeightChange", e), {
21
21
  immediate: !0
22
- }), (e, $) => (i(), g(f, null, [
23
- e.$slots.header ? (i(), H(P, {
22
+ }), (e, P) => (i(), g(f, null, [
23
+ e.$slots.header ? (i(), v(k, {
24
24
  key: 0,
25
25
  onHeightChange: m
26
26
  }, {
27
- default: v(() => [
27
+ default: H(() => [
28
28
  n(e.$slots, "header")
29
29
  ]),
30
30
  _: 3
31
31
  })) : w("", !0),
32
- n(e.$slots, "default", C(_(k(c))))
32
+ n(e.$slots, "default", C(_(c.value)))
33
33
  ], 64));
34
34
  }
35
35
  });
36
36
  export {
37
- S as default
37
+ V as default
38
38
  };
@@ -1,7 +1,7 @@
1
- import o from "./TabsHeader.vue2.mjs";
1
+ import a from "./TabsHeader.vue2.mjs";
2
2
  /* empty css */
3
- import r from "../../_virtual/_plugin-vue_export-helper.mjs";
4
- const m = /* @__PURE__ */ r(o, [["__scopeId", "data-v-d6937179"]]);
3
+ import o from "../../_virtual/_plugin-vue_export-helper.mjs";
4
+ const e = /* @__PURE__ */ o(a, [["__scopeId", "data-v-3faa57f5"]]);
5
5
  export {
6
- m as default
6
+ e as default
7
7
  };
@@ -1,5 +1,5 @@
1
- import { defineComponent as $, toRefs as z, useModel as K, ref as T, computed as n, onMounted as g, onBeforeUnmount as B, watch as R, openBlock as i, createElementBlock as r, normalizeClass as b, unref as o, Fragment as S, renderList as D, renderSlot as H, createTextVNode as I, toDisplayString as N, normalizeStyle as V, createCommentVNode as F, mergeModels as U, nextTick as W } from "vue";
2
- const X = ["onClick"], q = /* @__PURE__ */ $({
1
+ import { defineComponent as L, toRefs as $, useModel as z, ref as K, computed as n, onMounted as T, onBeforeUnmount as g, watch as B, openBlock as s, createElementBlock as l, normalizeClass as y, Fragment as R, renderList as S, unref as D, renderSlot as H, createTextVNode as I, toDisplayString as N, normalizeStyle as V, createCommentVNode as F, mergeModels as U, nextTick as W } from "vue";
2
+ const X = ["onClick"], q = /* @__PURE__ */ L({
3
3
  __name: "TabsHeader",
4
4
  props: /* @__PURE__ */ U({
5
5
  tabs: {},
@@ -10,63 +10,63 @@ const X = ["onClick"], q = /* @__PURE__ */ $({
10
10
  activeKeyModifiers: {}
11
11
  }),
12
12
  emits: ["update:activeKey"],
13
- setup(v) {
14
- const d = v, { tabs: k, level: h, variant: M } = z(d), s = K(v, "activeKey"), l = /* @__PURE__ */ new Map(), m = T(0), f = n(
15
- () => Math.min(Math.max(Math.floor(h.value), 1), 4)
16
- ), w = n(() => `tabs-main-bar--l${f.value}`), C = {
13
+ setup(u) {
14
+ const v = u, { tabs: b, level: k, variant: h } = $(v), o = z(u, "activeKey"), i = /* @__PURE__ */ new Map(), d = K(0), m = n(
15
+ () => Math.min(Math.max(Math.floor(k.value), 1), 4)
16
+ ), M = n(() => `tabs-main-bar--l${m.value}`), w = {
17
17
  1: "card",
18
18
  2: "indicator",
19
19
  3: "indicator-compact",
20
20
  4: "plain"
21
- }, c = n(
22
- () => M.value ?? C[f.value]
21
+ }, r = n(
22
+ () => h.value ?? w[m.value]
23
+ ), C = n(
24
+ () => `tabs-main-bar--variant-${r.value}`
23
25
  ), x = n(
24
- () => `tabs-main-bar--variant-${c.value}`
25
- ), _ = n(
26
- () => c.value === "indicator" || c.value === "indicator-compact"
27
- ), E = n(() => {
28
- const [, t] = [m.value, s.value], a = t ? l.get(t) : void 0;
26
+ () => r.value === "indicator" || r.value === "indicator-compact"
27
+ ), _ = n(() => {
28
+ const [, t] = [d.value, o.value], a = t ? i.get(t) : void 0;
29
29
  return a ? {
30
30
  width: `${a.offsetWidth}px`,
31
31
  transform: `translateX(${a.offsetLeft}px)`
32
32
  } : { width: "0px" };
33
- }), L = (t, a) => {
34
- a instanceof HTMLElement ? l.set(t, a) : l.delete(t);
35
- }, u = () => {
33
+ }), E = (t, a) => {
34
+ a instanceof HTMLElement ? i.set(t, a) : i.delete(t);
35
+ }, c = () => {
36
36
  W(() => {
37
- m.value++;
37
+ d.value++;
38
38
  });
39
- }, p = () => u();
40
- return g(() => {
41
- u(), window.addEventListener("resize", p);
42
- }), B(() => {
43
- window.removeEventListener("resize", p);
44
- }), R(
45
- () => d.tabs,
46
- () => u(),
39
+ }, f = () => c();
40
+ return T(() => {
41
+ c(), window.addEventListener("resize", f);
42
+ }), g(() => {
43
+ window.removeEventListener("resize", f);
44
+ }), B(
45
+ () => v.tabs,
46
+ () => c(),
47
47
  { flush: "post" }
48
- ), (t, a) => (i(), r("div", {
49
- class: b(["tabs-main-bar", [o(w), o(x)]])
48
+ ), (t, a) => (s(), l("div", {
49
+ class: y(["tabs-main-bar", [M.value, C.value]])
50
50
  }, [
51
- (i(!0), r(S, null, D(o(k), (e) => (i(), r("button", {
51
+ (s(!0), l(R, null, S(D(b), (e) => (s(), l("button", {
52
52
  key: e.key,
53
53
  ref_for: !0,
54
- ref: (y) => L(e.key, y),
54
+ ref: (p) => E(e.key, p),
55
55
  type: "button",
56
- class: b(["tabs-main-bar-item", { "tabs-main-bar-item_active": e.key === s.value }]),
57
- onClick: (y) => s.value = e.key
56
+ class: y(["tabs-main-bar-item", { "tabs-main-bar-item_active": e.key === o.value }]),
57
+ onClick: (p) => o.value = e.key
58
58
  }, [
59
59
  H(t.$slots, e.key, {
60
60
  tab: e,
61
- active: e.key === s.value
61
+ active: e.key === o.value
62
62
  }, () => [
63
63
  I(N(e.title), 1)
64
64
  ], !0)
65
65
  ], 10, X))), 128)),
66
- o(_) ? (i(), r("div", {
66
+ x.value ? (s(), l("div", {
67
67
  key: 0,
68
68
  class: "tabs-main-bar-indicator",
69
- style: V(o(E))
69
+ style: V(_.value)
70
70
  }, null, 4)) : F("", !0)
71
71
  ], 2));
72
72
  }
@@ -1,11 +1,11 @@
1
- import { defineComponent as m, inject as R, toRefs as T, useModel as A, useSlots as N, ref as P, computed as f, h as $, provide as q, watch as x, openBlock as i, createBlock as l, resolveDynamicComponent as E, unref as r, mergeProps as I, withCtx as s, KeepAlive as U, createCommentVNode as j, createVNode as z, createSlots as D, renderList as F, renderSlot as G, normalizeProps as J, guardReactiveProps as O, mergeModels as Q } from "vue";
2
- import W from "./TabsRefineFlow.vue.mjs";
3
- import X from "./TabsNaturalFlow.vue.mjs";
4
- import Y from "./TabsHeader.vue.mjs";
1
+ import { defineComponent as c, inject as N, toRefs as R, useModel as T, useSlots as A, ref as P, computed as f, h as $, provide as x, watch as E, openBlock as o, createBlock as l, resolveDynamicComponent as q, mergeProps as I, withCtx as s, KeepAlive as U, unref as i, createCommentVNode as j, createVNode as z, createSlots as D, renderList as F, renderSlot as G, normalizeProps as J, guardReactiveProps as O, createElementVNode as Q, mergeModels as W } from "vue";
2
+ import X from "./TabsRefineFlow.vue.mjs";
3
+ import Y from "./TabsNaturalFlow.vue.mjs";
4
+ import Z from "./TabsHeader.vue.mjs";
5
5
  import { TABS_MAIN_VISUAL_LEVEL as h } from "../../inject/key.mjs";
6
- const oe = /* @__PURE__ */ m({
6
+ const oe = /* @__PURE__ */ c({
7
7
  __name: "TabsMain",
8
- props: /* @__PURE__ */ Q({
8
+ props: /* @__PURE__ */ W({
9
9
  tabs: {},
10
10
  viewportHeight: {},
11
11
  minHeight: { default: 100 },
@@ -21,18 +21,18 @@ const oe = /* @__PURE__ */ m({
21
21
  }),
22
22
  emits: ["update:modelValue"],
23
23
  setup(u) {
24
- const o = u, p = R(h, 0) + 1, {
24
+ const r = u, p = N(h, 0) + 1, {
25
25
  viewportHeight: g,
26
26
  minHeight: y,
27
27
  channel: H,
28
28
  parentChannel: w,
29
29
  padding: b,
30
30
  refine: v,
31
- refineReduceHeight: k,
32
- variant: V,
31
+ refineReduceHeight: V,
32
+ variant: k,
33
33
  tabs: d
34
- } = T(o), a = A(u, "modelValue"), _ = N(), c = P(void 0), C = f(
35
- () => v.value ? W : X
34
+ } = R(r), n = T(u, "modelValue"), C = A(), m = P(void 0), _ = f(
35
+ () => v.value ? X : Y
36
36
  ), L = f(
37
37
  () => v.value ? {
38
38
  viewportHeight: g.value,
@@ -40,56 +40,57 @@ const oe = /* @__PURE__ */ m({
40
40
  channel: H.value,
41
41
  parentChannel: w.value,
42
42
  padding: b.value,
43
- refineReduceHeight: k.value
43
+ refineReduceHeight: V.value
44
44
  } : {}
45
- ), K = (e) => o.tabs.find((n) => n.key === e), M = (e) => {
46
- c.value = e;
47
- }, S = m({
45
+ ), K = (t) => r.tabs.find((e) => e.key === t), M = (t) => {
46
+ m.value = t;
47
+ }, S = c({
48
48
  name: "TabsMainPane",
49
49
  props: {
50
50
  paneKey: { type: String, required: !0 },
51
51
  viewportHeight: { type: Number, required: !1 }
52
52
  },
53
- setup(e) {
53
+ setup(t) {
54
54
  return () => {
55
- const n = _[e.paneKey], t = K(e.paneKey);
56
- return n ? n({
57
- tab: t,
55
+ const e = C[t.paneKey], a = K(t.paneKey);
56
+ return e ? e({
57
+ tab: a,
58
58
  active: !0,
59
- viewportHeight: e.viewportHeight
60
- }) : t != null && t.component ? $(t.component) : null;
59
+ viewportHeight: t.viewportHeight
60
+ }) : a != null && a.component ? $(a.component) : null;
61
61
  };
62
62
  }
63
63
  });
64
- return q(h, p), x(
65
- [a, () => o.tabs],
64
+ return x(h, p), E(
65
+ [n, () => r.tabs],
66
66
  () => {
67
- !(!!a.value && o.tabs.some((n) => n.key === a.value)) && o.tabs.length && (a.value = o.tabs[0].key);
67
+ !(!!n.value && r.tabs.some((e) => e.key === n.value)) && r.tabs.length && (n.value = r.tabs[0].key);
68
68
  },
69
69
  { immediate: !0 }
70
- ), (e, n) => (i(), l(E(r(C)), I(r(L), { onViewportHeightChange: M }), {
70
+ ), (t, e) => (o(), l(q(_.value), I(L.value, { onViewportHeightChange: M }), {
71
71
  header: s(() => [
72
- z(Y, {
73
- "active-key": a.value,
74
- "onUpdate:activeKey": n[0] || (n[0] = (t) => a.value = t),
75
- tabs: r(d),
72
+ z(Z, {
73
+ "active-key": n.value,
74
+ "onUpdate:activeKey": e[0] || (e[0] = (a) => n.value = a),
75
+ tabs: i(d),
76
76
  level: p,
77
- variant: r(V)
77
+ variant: i(k)
78
78
  }, D({ _: 2 }, [
79
- F(r(d), (t) => ({
80
- name: t.key,
79
+ F(i(d), (a) => ({
80
+ name: a.key,
81
81
  fn: s((B) => [
82
- G(e.$slots, `header-${t.key}`, J(O(B)))
82
+ G(t.$slots, `header-${a.key}`, J(O(B)))
83
83
  ])
84
84
  }))
85
- ]), 1032, ["active-key", "tabs", "variant"])
85
+ ]), 1032, ["active-key", "tabs", "variant"]),
86
+ e[1] || (e[1] = Q("div", { style: { height: "8px" } }, null, -1))
86
87
  ]),
87
88
  default: s(() => [
88
- (i(), l(U, null, [
89
- a.value ? (i(), l(r(S), {
90
- key: a.value,
91
- "pane-key": a.value,
92
- "viewport-height": r(c)
89
+ (o(), l(U, null, [
90
+ n.value ? (o(), l(i(S), {
91
+ key: n.value,
92
+ "pane-key": n.value,
93
+ "viewport-height": m.value
93
94
  }, null, 8, ["pane-key", "viewport-height"])) : j("", !0)
94
95
  ], 1024))
95
96
  ]),