ep-craft 0.1.40 → 0.1.41

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.
@@ -1,4 +1,12 @@
1
1
  import type { ExtractPropTypes } from 'vue';
2
+ /**
3
+ * EpAffix —— 从 element-plus 的 affix 源码 vendored 而来(el -> ep 命名),
4
+ * 样式复用仓库内置的 theme-chalk/src/affix.scss(命名空间为 el)。
5
+ *
6
+ * 边界测量与监听统一使用 @vueuse/core:其在 SSR 下不会访问 window,
7
+ * 且组件作用域销毁时会自动断开 ResizeObserver / MutationObserver 与
8
+ * 事件监听(此前内联的精简版本会在 SSR 下崩溃并泄漏 observer)。
9
+ */
2
10
  export declare const affixProps: {
3
11
  readonly zIndex: import("../../utils/index.js").EpPropFinalized<(new (...args: any[]) => string | number) | (() => string | number) | (((new (...args: any[]) => string | number) | (() => string | number)) | null)[], unknown, unknown, 100, boolean>;
4
12
  readonly target: import("../../utils/index.js").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
@@ -1,77 +1,16 @@
1
- import { defineComponent as D, shallowRef as s, ref as S, computed as T, watch as E, onMounted as C, onActivated as F, nextTick as R, onDeactivated as V, watchEffect as Y, h as z, Teleport as k, renderSlot as q } from "vue";
2
- import { CHANGE_EVENT as H } from "../../constants/event.js";
3
- import { throwError as G } from "../../utils/error.js";
4
- import { isBoolean as W, isNumber as U } from "../../utils/types.js";
5
- import { getScrollContainer as J } from "../../utils/dom/scroll.js";
6
- import { addUnit as K } from "../../utils/dom/style.js";
7
- import { buildProps as Q, definePropType as A } from "../../utils/vue/props/runtime.js";
8
- import { useNamespace as X } from "../../hooks/use-namespace/index.js";
9
- const Z = (e) => {
10
- const t = (e == null ? void 0 : e.value) ?? e;
11
- return t && typeof t == "object" && "$el" in t ? t.$el : t;
12
- }, ee = (e, t) => {
13
- let n;
14
- const o = E(
15
- e,
16
- (i) => {
17
- n == null || n.disconnect(), n = void 0, i && typeof ResizeObserver < "u" && (n = new ResizeObserver(t), n.observe(i));
18
- },
19
- { immediate: !0, flush: "post" }
20
- );
21
- return {
22
- stop: () => {
23
- n == null || n.disconnect(), o();
24
- }
25
- };
26
- }, te = (e, t, n) => {
27
- let o;
28
- const i = E(
29
- e,
30
- (u) => {
31
- o == null || o.disconnect(), o = void 0, u && typeof MutationObserver < "u" && (o = new MutationObserver(t), o.observe(u, n));
32
- },
33
- { immediate: !0, flush: "post" }
34
- );
35
- return {
36
- stop: () => {
37
- o == null || o.disconnect(), i();
38
- }
39
- };
40
- };
41
- function y(...e) {
42
- const t = typeof e[0] == "string", n = t ? void 0 : e[0], o = t ? e[0] : e[1], i = t ? e[1] : e[2], u = t ? e[2] : e[3], r = E(
43
- () => {
44
- if (t) return window;
45
- const l = n.value;
46
- return l instanceof Window, l;
47
- },
48
- (l, c, f) => {
49
- l && (l.addEventListener(o, i, u), f(() => l.removeEventListener(o, i, u)));
50
- },
51
- { immediate: !0 }
52
- );
53
- return () => r();
54
- }
55
- const oe = () => {
56
- const e = s(Number.POSITIVE_INFINITY), t = () => {
57
- e.value = window.innerHeight;
58
- };
59
- return t(), y("resize", t, { passive: !0 }), { height: e };
60
- }, B = (e, t = {}) => {
61
- const { windowScroll: n = !0, windowResize: o = !0 } = t, i = s(0), u = s(0), r = s(0), l = s(0), c = s(0), f = s(0), d = () => {
62
- const m = Z(e);
63
- if (!m) {
64
- i.value = 0, u.value = 0, r.value = 0, l.value = 0, c.value = 0, f.value = 0;
65
- return;
66
- }
67
- const v = m.getBoundingClientRect();
68
- i.value = v.height, u.value = v.bottom, r.value = v.left, l.value = v.right, c.value = v.top, f.value = v.width;
69
- };
70
- return ee(e, d), te(e, d, { attributeFilter: ["style", "class"] }), n && y("scroll", d, { capture: !0, passive: !0 }), o && y("resize", d, { passive: !0 }), C(d), { height: i, bottom: u, left: r, right: l, top: c, width: f, update: d };
71
- }, ne = Q({
1
+ import { defineComponent as O, shallowRef as m, ref as p, computed as g, watch as _, onMounted as j, onActivated as k, nextTick as x, onDeactivated as q, watchEffect as G, h, Teleport as M, renderSlot as U } from "vue";
2
+ import { useWindowSize as V, useElementBounding as R, useEventListener as Y } from "@vueuse/core";
3
+ import { CHANGE_EVENT as B } from "../../constants/event.js";
4
+ import { throwError as F } from "../../utils/error.js";
5
+ import { isBoolean as A, isNumber as J } from "../../utils/types.js";
6
+ import { getScrollContainer as K } from "../../utils/dom/scroll.js";
7
+ import { addUnit as Q } from "../../utils/dom/style.js";
8
+ import { buildProps as X, definePropType as z } from "../../utils/vue/props/runtime.js";
9
+ import { useNamespace as Z } from "../../hooks/use-namespace/index.js";
10
+ const ee = X({
72
11
  /** affix element zIndex value */
73
12
  zIndex: {
74
- type: A([Number, String]),
13
+ type: z([Number, String]),
75
14
  default: 100
76
15
  },
77
16
  /** target container. (CSS selector) */
@@ -94,97 +33,97 @@ const oe = () => {
94
33
  teleported: Boolean,
95
34
  /** which element the affix element appends to */
96
35
  appendTo: {
97
- type: A([String, Object]),
36
+ type: z([String, Object]),
98
37
  default: "body"
99
38
  }
100
- }), le = {
101
- scroll: ({ scrollTop: e, fixed: t }) => U(e) && W(t),
102
- [H]: (e) => W(e)
103
- }, ve = D({
39
+ }), te = {
40
+ scroll: ({ scrollTop: e, fixed: u }) => J(e) && A(u),
41
+ [B]: (e) => A(e)
42
+ }, ce = O({
104
43
  name: "EpAffix",
105
- props: ne,
106
- emits: le,
107
- setup(e, { emit: t, slots: n, expose: o }) {
108
- const i = X("affix"), u = s(), r = s(), l = s(), { height: c } = oe(), {
109
- height: f,
110
- width: d,
111
- top: m,
112
- bottom: v,
113
- left: L,
114
- update: g
115
- } = B(r, { windowScroll: !1 }), b = B(u), a = S(!1), N = S(0), x = S(0), M = T(() => !e.teleported || !a.value), P = T(() => ({
44
+ props: ee,
45
+ emits: te,
46
+ setup(e, { emit: u, slots: C, expose: H }) {
47
+ const w = Z("affix"), r = m(), d = m(), l = m(), { height: i } = V(), {
48
+ height: v,
49
+ width: b,
50
+ top: y,
51
+ bottom: E,
52
+ left: I,
53
+ update: f
54
+ } = R(d, { windowScroll: !1 }), s = R(r), t = p(!1), S = p(0), c = p(0), P = g(() => !e.teleported || !t.value), W = g(() => ({
116
55
  display: "flow-root",
117
- height: a.value ? `${f.value}px` : "",
118
- width: a.value ? `${d.value}px` : ""
119
- })), _ = T(() => {
120
- if (!a.value) return {};
121
- const p = K(e.offset);
56
+ height: t.value ? `${v.value}px` : "",
57
+ width: t.value ? `${b.value}px` : ""
58
+ })), D = g(() => {
59
+ if (!t.value) return {};
60
+ const o = Q(e.offset);
122
61
  return {
123
- height: `${f.value}px`,
124
- width: `${d.value}px`,
125
- top: e.position === "top" ? p : "",
126
- bottom: e.position === "bottom" ? p : "",
127
- left: e.teleported ? `${L.value}px` : "",
128
- transform: x.value ? `translateY(${x.value}px)` : "",
62
+ height: `${v.value}px`,
63
+ width: `${b.value}px`,
64
+ top: e.position === "top" ? o : "",
65
+ bottom: e.position === "bottom" ? o : "",
66
+ left: e.teleported ? `${I.value}px` : "",
67
+ transform: c.value ? `translateY(${c.value}px)` : "",
129
68
  zIndex: e.zIndex
130
69
  };
131
- }), O = () => {
70
+ }), T = () => {
132
71
  if (!l.value) return;
133
- N.value = l.value instanceof Window ? document.documentElement.scrollTop : l.value.scrollTop || 0;
134
- const { position: p, offset: h } = e, I = h + f.value;
135
- if (p === "top")
72
+ S.value = l.value instanceof Window ? document.documentElement.scrollTop : l.value.scrollTop || 0;
73
+ const { position: o, offset: a } = e, N = a + v.value;
74
+ if (o === "top")
136
75
  if (e.target) {
137
- const w = b.bottom.value - I;
138
- a.value = h > m.value && b.bottom.value > 0, x.value = w < 0 ? w : 0;
76
+ const n = s.bottom.value - N;
77
+ t.value = a > y.value && s.bottom.value > 0, c.value = n < 0 ? n : 0;
139
78
  } else
140
- a.value = h > m.value;
79
+ t.value = a > y.value;
141
80
  else if (e.target) {
142
- const w = c.value - b.top.value - I;
143
- a.value = c.value - h < v.value && c.value > b.top.value, x.value = w < 0 ? -w : 0;
81
+ const n = i.value - s.top.value - N;
82
+ t.value = i.value - a < E.value && i.value > s.top.value, c.value = n < 0 ? -n : 0;
144
83
  } else
145
- a.value = c.value - h < v.value;
84
+ t.value = i.value - a < E.value;
146
85
  }, $ = async () => {
147
- if (!a.value) {
148
- g();
86
+ if (!t.value) {
87
+ f();
149
88
  return;
150
89
  }
151
- a.value = !1, await R(), g(), a.value = !0;
152
- }, j = async () => {
153
- g(), await R(), t("scroll", {
154
- scrollTop: N.value,
155
- fixed: a.value
90
+ t.value = !1, await x(), f(), t.value = !0;
91
+ }, L = async () => {
92
+ f(), await x(), u("scroll", {
93
+ scrollTop: S.value,
94
+ fixed: t.value
156
95
  });
157
96
  };
158
- return E(a, (p) => t(H, p)), C(() => {
159
- e.target ? (u.value = document.querySelector(e.target) ?? void 0, u.value || G("EpAffix", `Target does not exist: ${e.target}`)) : u.value = document.documentElement, l.value = J(r.value, !0), g();
160
- }), F(() => {
161
- R($);
162
- }), V(() => {
163
- a.value = !1;
164
- }), y(l, "scroll", j), Y(O), o({
97
+ return _(t, (o) => u(B, o)), j(() => {
98
+ e.target ? (r.value = document.querySelector(e.target) ?? void 0, r.value || F("EpAffix", `Target does not exist: ${e.target}`)) : r.value = document.documentElement, l.value = K(d.value, !0), f();
99
+ }), k(() => {
100
+ x($);
101
+ }), q(() => {
102
+ t.value = !1;
103
+ }), Y(l, "scroll", L), G(T), H({
165
104
  /** update affix status */
166
- update: O,
105
+ update: T,
167
106
  /** update rootRect info */
168
107
  updateRoot: $
169
- }), () => z(
108
+ }), () => h(
170
109
  "div",
171
110
  {
172
- ref: r,
173
- class: i.b(),
174
- style: P.value
111
+ ref: d,
112
+ class: w.b(),
113
+ style: W.value
175
114
  },
176
115
  [
177
- z(
178
- k,
179
- { disabled: M.value, to: e.appendTo },
116
+ h(
117
+ M,
118
+ { disabled: P.value, to: e.appendTo },
180
119
  [
181
- z(
120
+ h(
182
121
  "div",
183
122
  {
184
- class: { [i.m("fixed")]: a.value },
185
- style: _.value
123
+ class: { [w.m("fixed")]: t.value },
124
+ style: D.value
186
125
  },
187
- [q(n, "default")]
126
+ [U(C, "default")]
188
127
  )
189
128
  ]
190
129
  )
@@ -193,7 +132,7 @@ const oe = () => {
193
132
  }
194
133
  });
195
134
  export {
196
- le as affixEmits,
197
- ne as affixProps,
198
- ve as default
135
+ te as affixEmits,
136
+ ee as affixProps,
137
+ ce as default
199
138
  };
@@ -23,16 +23,16 @@ declare const __VLS_component: import("vue").DefineComponent<DialogProps, {
23
23
  "update:modelValue": (value: boolean) => void;
24
24
  open: () => void;
25
25
  close: () => void;
26
- opened: () => void;
27
26
  closed: () => void;
27
+ opened: () => void;
28
28
  openAutoFocus: () => void;
29
29
  closeAutoFocus: () => void;
30
30
  }, string, import("vue").PublicProps, Readonly<DialogProps> & Readonly<{
31
31
  "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
32
32
  onOpen?: (() => any) | undefined;
33
33
  onClose?: (() => any) | undefined;
34
- onOpened?: (() => any) | undefined;
35
34
  onClosed?: (() => any) | undefined;
35
+ onOpened?: (() => any) | undefined;
36
36
  onOpenAutoFocus?: (() => any) | undefined;
37
37
  onCloseAutoFocus?: (() => any) | undefined;
38
38
  }>, {
@@ -1,16 +1,16 @@
1
1
  import { defineComponent as q, useSlots as L, computed as j, ref as m, provide as x, openBlock as C, createBlock as b, Teleport as K, createVNode as f, Transition as U, normalizeProps as G, guardReactiveProps as H, unref as e, withCtx as n, withDirectives as J, createElementVNode as Q, normalizeStyle as W, normalizeClass as X, mergeProps as Y, createSlots as Z, renderSlot as i, createCommentVNode as _, vShow as ee, mergeDefaults as oe } from "vue";
2
- import { EpOverlay as le } from "../overlay/overlay.js";
3
- import { useNamespace as te } from "../../hooks/use-namespace/index.js";
2
+ import { useNamespace as le } from "../../hooks/use-namespace/index.js";
4
3
  import "@vueuse/core";
5
4
  import "../../hooks/use-size/index.js";
6
- import { useDeprecated as ae } from "../../hooks/use-deprecated/index.js";
5
+ import { useDeprecated as te } from "../../hooks/use-deprecated/index.js";
7
6
  import "../../hooks/use-aria/index.js";
8
- import { useSameTarget as se } from "../../hooks/use-same-target/index.js";
9
- import { EpFocusTrap as ne } from "../focus-trap/index.js";
10
- import re from "./EpDialogContent.vue.js";
11
- import { dialogInjectionKey as ie } from "./constants.js";
12
- import { dialogEmits as de, dialogPropsDefaults as ce } from "./dialog.js";
13
- import { useDialog as ue } from "./use-dialog.js";
7
+ import { useSameTarget as ae } from "../../hooks/use-same-target/index.js";
8
+ import { EpFocusTrap as se } from "../focus-trap/index.js";
9
+ import ne from "./EpDialogContent.vue.js";
10
+ import { dialogInjectionKey as re } from "./constants.js";
11
+ import { dialogEmits as ie, dialogPropsDefaults as de } from "./dialog.js";
12
+ import { useDialog as ce } from "./use-dialog.js";
13
+ import { EpOverlay as ue } from "../overlay/overlay.js";
14
14
  const me = ["aria-label", "aria-labelledby", "aria-describedby"], Te = /* @__PURE__ */ q({
15
15
  name: "EpDialog",
16
16
  inheritAttrs: !1,
@@ -47,11 +47,11 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], Te = /* @__PUR
47
47
  showClose: { type: Boolean },
48
48
  title: {},
49
49
  ariaLevel: {}
50
- }, ce),
51
- emits: de,
50
+ }, de),
51
+ emits: ie,
52
52
  setup(o, { expose: h }) {
53
53
  const B = o, w = L();
54
- ae(
54
+ te(
55
55
  {
56
56
  scope: "el-dialog",
57
57
  from: "the title slot",
@@ -61,7 +61,7 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], Te = /* @__PUR
61
61
  },
62
62
  j(() => !!w.title)
63
63
  );
64
- const t = te("dialog"), p = m(), k = m(), d = m(), {
64
+ const t = le("dialog"), p = m(), k = m(), d = m(), {
65
65
  visible: c,
66
66
  titleId: y,
67
67
  bodyId: g,
@@ -82,8 +82,8 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], Te = /* @__PUR
82
82
  onFocusoutPrevented: O,
83
83
  bringToFront: N,
84
84
  closing: V
85
- } = ue(B, p);
86
- x(ie, {
85
+ } = ce(B, p);
86
+ x(re, {
87
87
  dialogRef: p,
88
88
  headerRef: k,
89
89
  bodyId: g,
@@ -91,7 +91,7 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], Te = /* @__PUR
91
91
  rendered: v,
92
92
  style: F
93
93
  });
94
- const a = se(S);
94
+ const a = ae(S);
95
95
  return h({
96
96
  /** @description whether the dialog is visible */
97
97
  visible: c,
@@ -107,7 +107,7 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], Te = /* @__PUR
107
107
  }, [
108
108
  f(U, G(H(e(R))), {
109
109
  default: n(() => [
110
- J(f(e(le), {
110
+ J(f(e(ue), {
111
111
  "custom-mask-event": "",
112
112
  mask: o.modal,
113
113
  "overlay-class": [
@@ -136,7 +136,7 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], Te = /* @__PUR
136
136
  onMouseup: s[2] || (s[2] = //@ts-ignore
137
137
  (...r) => e(a).onMouseup && e(a).onMouseup(...r))
138
138
  }, [
139
- f(e(ne), {
139
+ f(e(se), {
140
140
  loop: "",
141
141
  trapped: e(c),
142
142
  "focus-start-el": "container",
@@ -146,7 +146,7 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], Te = /* @__PUR
146
146
  onReleaseRequested: e(z)
147
147
  }, {
148
148
  default: n(() => [
149
- e(v) ? (C(), b(re, Y({
149
+ e(v) ? (C(), b(ne, Y({
150
150
  key: 0,
151
151
  ref_key: "dialogContentRef",
152
152
  ref: d
@@ -20,8 +20,8 @@ declare const __VLS_component: import("vue").DefineComponent<DrawerProps, {
20
20
  resize: (evt: MouseEvent, size: number) => void;
21
21
  open: () => void;
22
22
  close: () => void;
23
- opened: () => void;
24
23
  closed: () => void;
24
+ opened: () => void;
25
25
  openAutoFocus: () => void;
26
26
  closeAutoFocus: () => void;
27
27
  "resize-start": (evt: MouseEvent, size: number) => void;
@@ -31,8 +31,8 @@ declare const __VLS_component: import("vue").DefineComponent<DrawerProps, {
31
31
  onResize?: ((evt: MouseEvent, size: number) => any) | undefined;
32
32
  onOpen?: (() => any) | undefined;
33
33
  onClose?: (() => any) | undefined;
34
- onOpened?: (() => any) | undefined;
35
34
  onClosed?: (() => any) | undefined;
35
+ onOpened?: (() => any) | undefined;
36
36
  onOpenAutoFocus?: (() => any) | undefined;
37
37
  onCloseAutoFocus?: (() => any) | undefined;
38
38
  "onResize-start"?: ((evt: MouseEvent, size: number) => any) | undefined;
@@ -1,17 +1,17 @@
1
1
  import { defineComponent as U, useSlots as j, computed as k, ref as v, openBlock as r, createBlock as G, Teleport as J, createVNode as s, Transition as K, unref as e, withCtx as m, withDirectives as Q, createElementVNode as h, mergeProps as W, withModifiers as X, normalizeClass as a, createElementBlock as n, renderSlot as u, toDisplayString as Y, createCommentVNode as i, normalizeStyle as Z, vShow as _, mergeDefaults as ee } from "vue";
2
2
  import { Close as oe } from "@element-plus/icons-vue";
3
- import { EpOverlay as te } from "../overlay/overlay.js";
4
- import { EpFocusTrap as ae } from "../focus-trap/index.js";
5
- import { EpIcon as le } from "../icon/index.js";
6
- import { useNamespace as re } from "../../hooks/use-namespace/index.js";
7
- import { useLocale as se } from "../../hooks/use-locale/index.js";
3
+ import { EpFocusTrap as te } from "../focus-trap/index.js";
4
+ import { EpIcon as ae } from "../icon/index.js";
5
+ import { useNamespace as le } from "../../hooks/use-namespace/index.js";
6
+ import { useLocale as re } from "../../hooks/use-locale/index.js";
8
7
  import "@vueuse/core";
9
8
  import "../../hooks/use-size/index.js";
10
- import { useDeprecated as ne } from "../../hooks/use-deprecated/index.js";
9
+ import { useDeprecated as se } from "../../hooks/use-deprecated/index.js";
11
10
  import "../../hooks/use-aria/index.js";
12
- import { drawerEmits as ie } from "./drawer.js";
13
- import { useResizable as de } from "./useResizable.js";
14
- import { useDialog as ce } from "../dialog/use-dialog.js";
11
+ import { drawerEmits as ne } from "./drawer.js";
12
+ import { useResizable as ie } from "./useResizable.js";
13
+ import { useDialog as de } from "../dialog/use-dialog.js";
14
+ import { EpOverlay as ce } from "../overlay/overlay.js";
15
15
  import { dialogPropsDefaults as fe } from "../dialog/dialog.js";
16
16
  const me = ["aria-label", "aria-labelledby", "aria-describedby"], ue = ["id", "aria-level"], pe = ["aria-label"], ye = ["id"], Te = /* @__PURE__ */ U({
17
17
  name: "EpDrawer",
@@ -62,10 +62,10 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], ue = ["id", "a
62
62
  modalFade: !0,
63
63
  headerAriaLevel: "2"
64
64
  }),
65
- emits: ie,
65
+ emits: ne,
66
66
  setup(o, { expose: z, emit: R }) {
67
67
  const d = o, A = R, F = j();
68
- ne(
68
+ se(
69
69
  {
70
70
  scope: "el-drawer",
71
71
  from: "the title slot",
@@ -75,7 +75,7 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], ue = ["id", "a
75
75
  },
76
76
  k(() => !!F.title)
77
77
  );
78
- const p = v(), C = v(), B = v(), t = re("drawer"), { t: E } = se(), {
78
+ const p = v(), C = v(), B = v(), t = le("drawer"), { t: E } = re(), {
79
79
  afterEnter: L,
80
80
  afterLeave: D,
81
81
  beforeLeave: T,
@@ -90,7 +90,7 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], ue = ["id", "a
90
90
  onFocusoutPrevented: O,
91
91
  onCloseRequested: H,
92
92
  handleClose: c
93
- } = ce(d, p), { isHorizontal: N, size: V, isResizing: q } = de(d, B, A), x = k(() => d.modalPenetrable && !d.modal);
93
+ } = de(d, p), { isHorizontal: N, size: V, isResizing: q } = ie(d, B, A), x = k(() => d.modalPenetrable && !d.modal);
94
94
  return z({
95
95
  handleClose: c
96
96
  }), (l, f) => (r(), G(J, {
@@ -104,7 +104,7 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], ue = ["id", "a
104
104
  onBeforeLeave: e(T)
105
105
  }, {
106
106
  default: m(() => [
107
- Q(s(e(te), {
107
+ Q(s(e(ce), {
108
108
  mask: o.modal,
109
109
  "overlay-class": [
110
110
  e(t).is("drawer"),
@@ -116,7 +116,7 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], ue = ["id", "a
116
116
  onClick: e(I)
117
117
  }, {
118
118
  default: m(() => [
119
- s(e(ae), {
119
+ s(e(te), {
120
120
  loop: "",
121
121
  trapped: e(y),
122
122
  "focus-trap-el": p.value,
@@ -176,7 +176,7 @@ const me = ["aria-label", "aria-labelledby", "aria-describedby"], ue = ["id", "a
176
176
  onClick: f[0] || (f[0] = //@ts-ignore
177
177
  (...M) => e(c) && e(c)(...M))
178
178
  }, [
179
- s(e(le), {
179
+ s(e(ae), {
180
180
  class: a(e(t).e("close"))
181
181
  }, {
182
182
  default: m(() => [
@@ -1,36 +1,23 @@
1
- import { defineComponent as Q, getCurrentInstance as X, ref as f, computed as Z, watch as x, watchEffect as ee, provide as U, reactive as te, onMounted as ne, h as I, withDirectives as le, nextTick as oe } from "vue";
2
- import { ElIcon as ue } from "../icon/index.js";
3
- import { More as ie } from "@element-plus/icons-vue";
4
- import { mutable as ae } from "../../utils/typescript.js";
5
- import { iconPropType as ce } from "../../utils/vue/icon.js";
6
- import { flattedChildren as se } from "../../utils/vue/vnode.js";
7
- import { buildProps as re, definePropType as N } from "../../utils/vue/props/runtime.js";
8
- import { useNamespace as j } from "../../hooks/use-namespace/index.js";
9
- import de from "../../directives/click-outside/index.js";
10
- import fe from "./utils/menu-bar.js";
11
- import { useMenuCssVar as me } from "./use-menu-css-var.js";
12
- import ve from "./menu-collapse-transition.vue.js";
13
- import { MENU_INJECTION_KEY as pe, SUB_MENU_INJECTION_KEY as he } from "./tokens.js";
14
- import ge from "../sub-menu/sub-menu.js";
15
- import { isString as C, isObject as Me, isArray as be } from "@vue/shared";
16
- const ye = (e) => {
17
- const o = (e == null ? void 0 : e.value) ?? e;
18
- return o && typeof o == "object" && "$el" in o ? o.$el : o;
19
- }, Ie = (e, o) => {
20
- let i;
21
- const h = x(
22
- e,
23
- (g) => {
24
- i == null || i.disconnect(), i = void 0, g && typeof ResizeObserver < "u" && (i = new ResizeObserver(o), i.observe(g));
25
- },
26
- { immediate: !0 }
27
- );
28
- return {
29
- stop: () => {
30
- i == null || i.disconnect(), h();
31
- }
32
- };
33
- }, Se = re({
1
+ import { defineComponent as X, getCurrentInstance as Z, ref as d, computed as ee, watch as C, watchEffect as te, onBeforeUnmount as ne, provide as j, reactive as oe, onMounted as le, h as I, withDirectives as ue, nextTick as ae } from "vue";
2
+ import { useResizeObserver as ie } from "@vueuse/core";
3
+ import { ElIcon as ce } from "../icon/index.js";
4
+ import { More as re } from "@element-plus/icons-vue";
5
+ import { mutable as se } from "../../utils/typescript.js";
6
+ import { iconPropType as de } from "../../utils/vue/icon.js";
7
+ import { flattedChildren as fe } from "../../utils/vue/vnode.js";
8
+ import { buildProps as me, definePropType as N } from "../../utils/vue/props/runtime.js";
9
+ import { useNamespace as F } from "../../hooks/use-namespace/index.js";
10
+ import ve from "../../directives/click-outside/index.js";
11
+ import pe from "./utils/menu-bar.js";
12
+ import { useMenuCssVar as he } from "./use-menu-css-var.js";
13
+ import ge from "./menu-collapse-transition.vue.js";
14
+ import { MENU_INJECTION_KEY as Me, SUB_MENU_INJECTION_KEY as be } from "./tokens.js";
15
+ import Ie from "../sub-menu/sub-menu.js";
16
+ import { isString as E, isObject as ye, isArray as Se } from "@vue/shared";
17
+ const Oe = (t) => {
18
+ const l = (t == null ? void 0 : t.value) ?? t;
19
+ return l && typeof l == "object" && "$el" in l ? l.$el : l;
20
+ }, Ee = me({
34
21
  /** menu display mode */
35
22
  mode: {
36
23
  type: String,
@@ -45,7 +32,7 @@ const ye = (e) => {
45
32
  /** array that contains indexes of currently active sub-menus */
46
33
  defaultOpeneds: {
47
34
  type: N(Array),
48
- default: () => ae([])
35
+ default: () => se([])
49
36
  },
50
37
  /** whether only one sub-menu can be active */
51
38
  uniqueOpened: Boolean,
@@ -84,8 +71,8 @@ const ye = (e) => {
84
71
  },
85
72
  /** custom ellipsis icon (available only in horizontal mode and ellipsis is true) */
86
73
  ellipsisIcon: {
87
- type: ce,
88
- default: () => ie
74
+ type: de,
75
+ default: () => re
89
76
  },
90
77
  /** Tooltip theme, built-in theme: `dark` / `light` when menu is collapsed */
91
78
  popperEffect: {
@@ -113,171 +100,174 @@ const ye = (e) => {
113
100
  type: Boolean,
114
101
  default: !0
115
102
  }
116
- }), T = (e) => be(e) && e.every((o) => C(o)), Oe = {
117
- close: (e, o) => C(e) && T(o),
118
- open: (e, o) => C(e) && T(o),
119
- select: (e, o, i, h) => C(e) && T(o) && Me(i) && (h === void 0 || h instanceof Promise)
120
- }, F = 64, Le = Q({
103
+ }), T = (t) => Se(t) && t.every((l) => E(l)), xe = {
104
+ close: (t, l) => E(t) && T(l),
105
+ open: (t, l) => E(t) && T(l),
106
+ select: (t, l, h, y) => E(t) && T(l) && ye(h) && (y === void 0 || y instanceof Promise)
107
+ }, q = 64, je = X({
121
108
  name: "EpMenu",
122
- props: Se,
123
- emits: Oe,
124
- setup(e, { emit: o, slots: i, expose: h }) {
125
- const g = X(), P = g.appContext.config.globalProperties.$router, m = f(), k = f(), S = j("menu"), _ = j("sub-menu");
126
- let z = F;
127
- const v = f(-1), c = f(
128
- e.defaultOpeneds && !e.collapse ? e.defaultOpeneds.slice(0) : []
129
- ), d = f(e.defaultActive), p = f({}), M = f({}), q = Z(
130
- () => e.mode === "horizontal" || e.mode === "vertical" && e.collapse
131
- ), J = () => {
132
- const t = d.value && p.value[d.value];
133
- if (!t || e.mode === "horizontal" || e.collapse) return;
134
- t.indexPath.forEach((l) => {
135
- const a = M.value[l];
136
- a && O(l, a.indexPath);
109
+ props: Ee,
110
+ emits: xe,
111
+ setup(t, { emit: l, slots: h, expose: y }) {
112
+ const x = Z(), P = x.appContext.config.globalProperties.$router, f = d(), k = d(), S = F("menu"), _ = F("sub-menu");
113
+ let z = q;
114
+ const m = d(-1), i = d(
115
+ t.defaultOpeneds && !t.collapse ? t.defaultOpeneds.slice(0) : []
116
+ ), s = d(t.defaultActive), v = d({}), p = d({}), J = ee(
117
+ () => t.mode === "horizontal" || t.mode === "vertical" && t.collapse
118
+ ), K = () => {
119
+ const e = s.value && v.value[s.value];
120
+ if (!e || t.mode === "horizontal" || t.collapse) return;
121
+ e.indexPath.forEach((o) => {
122
+ const a = p.value[o];
123
+ a && O(o, a.indexPath);
137
124
  });
138
- }, O = (t, n) => {
139
- c.value.includes(t) || (e.uniqueOpened && (c.value = c.value.filter(
140
- (l) => n.includes(l)
141
- )), c.value.push(t), o("open", t, n));
142
- }, R = (t) => {
143
- const n = c.value.indexOf(t);
144
- n !== -1 && c.value.splice(n, 1);
145
- }, w = (t, n) => {
146
- R(t), o("close", t, n);
147
- }, K = ({
148
- index: t,
125
+ }, O = (e, n) => {
126
+ i.value.includes(e) || (t.uniqueOpened && (i.value = i.value.filter(
127
+ (o) => n.includes(o)
128
+ )), i.value.push(e), l("open", e, n));
129
+ }, B = (e) => {
130
+ const n = i.value.indexOf(e);
131
+ n !== -1 && i.value.splice(n, 1);
132
+ }, R = (e, n) => {
133
+ B(e), l("close", e, n);
134
+ }, V = ({
135
+ index: e,
149
136
  indexPath: n
150
137
  }) => {
151
- c.value.includes(t) ? w(t, n) : O(t, n);
152
- }, V = (t) => {
153
- (e.mode === "horizontal" || e.collapse) && (c.value = []);
154
- const { index: n, indexPath: l } = t;
155
- if (!(n == null || l == null))
156
- if (e.router && P) {
157
- const a = t.route || n, u = P.push(a).then((s) => (s || (d.value = n), s));
158
- o("select", n, l, { index: n, indexPath: l, route: a }, u);
138
+ i.value.includes(e) ? R(e, n) : O(e, n);
139
+ }, Y = (e) => {
140
+ (t.mode === "horizontal" || t.collapse) && (i.value = []);
141
+ const { index: n, indexPath: o } = e;
142
+ if (!(n == null || o == null))
143
+ if (t.router && P) {
144
+ const a = e.route || n, u = P.push(a).then((c) => (c || (s.value = n), c));
145
+ l("select", n, o, { index: n, indexPath: o, route: a }, u);
159
146
  } else
160
- d.value = n, o("select", n, l, { index: n, indexPath: l });
161
- }, A = (t) => {
162
- const n = p.value, l = n[t] || d.value && n[d.value] || n[e.defaultActive];
163
- d.value = (l == null ? void 0 : l.index) ?? t;
164
- }, B = (t) => {
165
- const n = getComputedStyle(t), l = Number.parseInt(n.marginLeft, 10), a = Number.parseInt(n.marginRight, 10);
166
- return t.offsetWidth + l + a || 0;
147
+ s.value = n, l("select", n, o, { index: n, indexPath: o });
148
+ }, A = (e) => {
149
+ const n = v.value, o = n[e] || s.value && n[s.value] || n[t.defaultActive];
150
+ s.value = (o == null ? void 0 : o.index) ?? e;
151
+ }, w = (e) => {
152
+ const n = getComputedStyle(e), o = Number.parseInt(n.marginLeft, 10), a = Number.parseInt(n.marginRight, 10);
153
+ return e.offsetWidth + o + a || 0;
167
154
  }, W = () => {
168
- if (!m.value) return -1;
169
- const t = Array.from(m.value.childNodes).filter(
155
+ if (!f.value) return -1;
156
+ const e = Array.from(f.value.childNodes).filter(
170
157
  (r) => r.nodeName !== "#comment" && (r.nodeName !== "#text" || r.nodeValue)
171
- ), n = getComputedStyle(m.value), l = Number.parseInt(n.paddingLeft, 10), a = Number.parseInt(n.paddingRight, 10), u = m.value.clientWidth - l - a;
172
- let s = 0, b = 0;
173
- return t.forEach((r, y) => {
174
- s += B(r), s <= u - z && (b = y + 1);
175
- }), b === t.length ? -1 : b;
176
- }, Y = (t) => M.value[t].indexPath, H = (t, n = 33.34) => {
177
- let l;
158
+ ), n = getComputedStyle(f.value), o = Number.parseInt(n.paddingLeft, 10), a = Number.parseInt(n.paddingRight, 10), u = f.value.clientWidth - o - a;
159
+ let c = 0, M = 0;
160
+ return e.forEach((r, b) => {
161
+ c += w(r), c <= u - z && (M = b + 1);
162
+ }), M === e.length ? -1 : M;
163
+ }, H = (e) => p.value[e].indexPath, G = (e, n = 33.34) => {
164
+ let o;
178
165
  return () => {
179
- l && clearTimeout(l), l = setTimeout(() => {
180
- t();
166
+ o && clearTimeout(o), o = setTimeout(() => {
167
+ e();
181
168
  }, n);
182
169
  };
183
170
  };
184
171
  let D = !0;
185
172
  const L = () => {
186
- const t = ye(k);
187
- if (t && (z = B(t) || F), v.value === W()) return;
173
+ const e = Oe(k);
174
+ if (e && (z = w(e) || q), m.value === W()) return;
188
175
  const n = () => {
189
- v.value = -1, oe(() => {
190
- v.value = W();
176
+ m.value = -1, ae(() => {
177
+ m.value = W();
191
178
  });
192
179
  };
193
- D ? n() : H(n)(), D = !1;
180
+ D ? n() : G(n)(), D = !1;
194
181
  };
195
- x(
196
- () => e.defaultActive,
197
- (t) => {
198
- p.value[t] || (d.value = ""), A(t);
182
+ C(
183
+ () => t.defaultActive,
184
+ (e) => {
185
+ v.value[e] || (s.value = ""), A(e);
199
186
  }
200
- ), x(
201
- () => e.collapse,
202
- (t) => {
203
- t && (c.value = []);
187
+ ), C(
188
+ () => t.collapse,
189
+ (e) => {
190
+ e && (i.value = []);
204
191
  }
205
- ), x(p.value, J);
206
- let E;
207
- ee(() => {
208
- e.mode === "horizontal" && e.ellipsis ? E = Ie(m, L).stop : E == null || E();
209
- });
210
- const $ = f(!1);
192
+ ), C(v.value, K);
193
+ let g;
194
+ const U = () => {
195
+ g == null || g(), g = void 0;
196
+ };
197
+ te(() => {
198
+ U(), t.mode === "horizontal" && t.ellipsis && (g = ie(f, L).stop);
199
+ }), ne(U);
200
+ const $ = d(!1);
211
201
  {
212
- const t = (u) => {
213
- M.value[u.index] = u;
202
+ const e = (u) => {
203
+ p.value[u.index] = u;
214
204
  }, n = (u) => {
215
- delete M.value[u.index];
205
+ delete p.value[u.index];
216
206
  };
217
- U(
218
- pe,
219
- te({
220
- props: e,
221
- openedMenus: c,
222
- items: p,
223
- subMenus: M,
224
- activeIndex: d,
225
- isMenuPopup: q,
207
+ j(
208
+ Me,
209
+ oe({
210
+ props: t,
211
+ openedMenus: i,
212
+ items: v,
213
+ subMenus: p,
214
+ activeIndex: s,
215
+ isMenuPopup: J,
226
216
  addMenuItem: (u) => {
227
- p.value[u.index] = u;
217
+ v.value[u.index] = u;
228
218
  },
229
219
  removeMenuItem: (u) => {
230
- delete p.value[u.index];
220
+ delete v.value[u.index];
231
221
  },
232
- addSubMenu: t,
222
+ addSubMenu: e,
233
223
  removeSubMenu: n,
234
224
  openMenu: O,
235
- closeMenu: w,
236
- handleMenuItemClick: V,
237
- handleSubMenuClick: K
225
+ closeMenu: R,
226
+ handleMenuItemClick: Y,
227
+ handleSubMenuClick: V
238
228
  })
239
- ), U(`${he}${g.uid}`, {
240
- addSubMenu: t,
229
+ ), j(`${be}${x.uid}`, {
230
+ addSubMenu: e,
241
231
  removeSubMenu: n,
242
232
  mouseInChild: $,
243
233
  level: 0
244
234
  });
245
235
  }
246
- ne(() => {
247
- e.mode === "horizontal" && new fe(g.vnode.el, S.namespace.value);
248
- }), h({
236
+ le(() => {
237
+ t.mode === "horizontal" && new pe(x.vnode.el, S.namespace.value);
238
+ }), y({
249
239
  open: (n) => {
250
- const { indexPath: l } = M.value[n];
251
- l.forEach((a) => O(a, l));
240
+ const { indexPath: o } = p.value[n];
241
+ o.forEach((a) => O(a, o));
252
242
  },
253
- close: R,
243
+ close: B,
254
244
  updateActiveIndex: A,
255
245
  handleResize: L
256
246
  });
257
- const G = me(e, 0);
247
+ const Q = he(t, 0);
258
248
  return () => {
259
249
  var u;
260
- let t = ((u = i.default) == null ? void 0 : u.call(i)) ?? [];
250
+ let e = ((u = h.default) == null ? void 0 : u.call(h)) ?? [];
261
251
  const n = [];
262
- if (e.mode === "horizontal" && m.value) {
263
- const s = se(t).filter((y) => (y == null ? void 0 : y.shapeFlag) !== 8), b = v.value === -1 ? s : s.slice(0, v.value), r = v.value === -1 ? [] : s.slice(v.value);
264
- r != null && r.length && e.ellipsis && (t = b, n.push(
252
+ if (t.mode === "horizontal" && f.value) {
253
+ const c = fe(e).filter((b) => (b == null ? void 0 : b.shapeFlag) !== 8), M = m.value === -1 ? c : c.slice(0, m.value), r = m.value === -1 ? [] : c.slice(m.value);
254
+ r != null && r.length && t.ellipsis && (e = M, n.push(
265
255
  I(
266
- ge,
256
+ Ie,
267
257
  {
268
258
  ref: k,
269
259
  index: "sub-menu-more",
270
260
  class: _.e("hide-arrow"),
271
- popperOffset: e.popperOffset
261
+ popperOffset: t.popperOffset
272
262
  },
273
263
  {
274
264
  title: () => I(
275
- ue,
265
+ ce,
276
266
  {
277
267
  class: _.e("icon-more")
278
268
  },
279
269
  {
280
- default: () => I(e.ellipsisIcon)
270
+ default: () => I(t.ellipsisIcon)
281
271
  }
282
272
  ),
283
273
  default: () => r
@@ -285,39 +275,39 @@ const ye = (e) => {
285
275
  )
286
276
  ));
287
277
  }
288
- const l = e.closeOnClickOutside ? [
278
+ const o = t.closeOnClickOutside ? [
289
279
  [
290
- de,
280
+ ve,
291
281
  () => {
292
- c.value.length && ($.value || (c.value.forEach(
293
- (s) => o("close", s, Y(s))
294
- ), c.value = []));
282
+ i.value.length && ($.value || (i.value.forEach(
283
+ (c) => l("close", c, H(c))
284
+ ), i.value = []));
295
285
  }
296
286
  ]
297
- ] : [], a = le(
287
+ ] : [], a = ue(
298
288
  I(
299
289
  "ul",
300
290
  {
301
- key: String(e.collapse),
291
+ key: String(t.collapse),
302
292
  role: "menubar",
303
- ref: m,
304
- style: G.value,
293
+ ref: f,
294
+ style: Q.value,
305
295
  class: {
306
296
  [S.b()]: !0,
307
- [S.m(e.mode)]: !0,
308
- [S.m("collapse")]: e.collapse
297
+ [S.m(t.mode)]: !0,
298
+ [S.m("collapse")]: t.collapse
309
299
  }
310
300
  },
311
- [...t, ...n]
301
+ [...e, ...n]
312
302
  ),
313
- l
303
+ o
314
304
  );
315
- return e.collapseTransition && e.mode === "vertical" ? I(ve, () => a) : a;
305
+ return t.collapseTransition && t.mode === "vertical" ? I(ge, () => a) : a;
316
306
  };
317
307
  }
318
308
  });
319
309
  export {
320
- Le as default,
321
- Oe as menuEmits,
322
- Se as menuProps
310
+ je as default,
311
+ xe as menuEmits,
312
+ Ee as menuProps
323
313
  };
@@ -8,13 +8,13 @@ import { useLockscreen as Q } from "../../../hooks/use-lockscreen/index.js";
8
8
  import { useSameTarget as X } from "../../../hooks/use-same-target/index.js";
9
9
  import { useDraggable as Y } from "../../../hooks/use-draggable/index.js";
10
10
  import { EpInput as ee } from "../../input/index.js";
11
- import { EpOverlay as te } from "../../overlay/overlay.js";
12
- import { TypeComponents as oe, TypeComponentsMap as I } from "../../../utils/vue/icon.js";
13
- import { isValidComponentSize as ne } from "../../../utils/vue/validator.js";
14
- import { ElIcon as ae } from "../../icon/index.js";
11
+ import { TypeComponents as te, TypeComponentsMap as I } from "../../../utils/vue/icon.js";
12
+ import { isValidComponentSize as oe } from "../../../utils/vue/validator.js";
13
+ import { ElIcon as ne } from "../../icon/index.js";
15
14
  import { Loading as M } from "@element-plus/icons-vue";
16
- import { EpFocusTrap as re } from "../../focus-trap/index.js";
15
+ import { EpFocusTrap as ae } from "../../focus-trap/index.js";
17
16
  import "../../config-provider/index.js";
17
+ import { EpOverlay as re } from "../../overlay/overlay.js";
18
18
  import { useGlobalComponentSettings as se } from "../../config-provider/src/hooks/use-global-config.js";
19
19
  import { isFunction as le, isString as ie } from "@vue/shared";
20
20
  const Se = G({
@@ -24,17 +24,17 @@ const Se = G({
24
24
  },
25
25
  components: {
26
26
  ElButton: K,
27
- ElFocusTrap: re,
27
+ ElFocusTrap: ae,
28
28
  ElInput: ee,
29
- ElOverlay: te,
30
- ElIcon: ae,
31
- ...oe
29
+ ElOverlay: re,
30
+ ElIcon: ne,
31
+ ...te
32
32
  },
33
33
  inheritAttrs: !1,
34
34
  props: {
35
35
  buttonSize: {
36
36
  type: String,
37
- validator: ne
37
+ validator: oe
38
38
  },
39
39
  modal: {
40
40
  type: Boolean,
@@ -15,9 +15,9 @@ declare const __VLS_component: import("vue").DefineComponent<ProgressProps, {},
15
15
  strokeWidth: number;
16
16
  width: number;
17
17
  type: "line" | "circle" | "dashboard";
18
+ status: "" | "success" | "exception" | "warning";
18
19
  format: import("./progress.js").ProgressFn;
19
20
  duration: number;
20
- status: "" | "success" | "exception" | "warning";
21
21
  percentage: number;
22
22
  showText: boolean;
23
23
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ep-craft",
3
- "version": "0.1.40",
3
+ "version": "0.1.41",
4
4
  "description": "A self-contained Vue 3 component library with ep- prefix",
5
5
  "type": "module",
6
6
  "packageManager": "pnpm@10.34.4",