easy-component-ui 3.0.14 → 3.0.15

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 (167) hide show
  1. package/dist/assets/icon.css +1 -0
  2. package/dist/components/Base.js +941 -0
  3. package/dist/components/ea-alert.js +213 -0
  4. package/dist/components/ea-avatar.js +164 -0
  5. package/dist/components/ea-backtop.js +136 -0
  6. package/dist/components/ea-badge.js +144 -0
  7. package/dist/components/ea-breadcrumb.js +148 -0
  8. package/dist/components/ea-button.js +266 -0
  9. package/dist/components/ea-calendar.js +10 -0
  10. package/dist/components/ea-calendar2.js +673 -0
  11. package/dist/components/ea-card.js +121 -0
  12. package/dist/components/ea-carousel.js +415 -0
  13. package/dist/components/ea-checkbox.js +446 -0
  14. package/dist/components/ea-collapse.js +313 -0
  15. package/dist/components/ea-color-picker.js +888 -0
  16. package/dist/components/ea-container.js +206 -0
  17. package/dist/components/ea-countdown.js +142 -0
  18. package/dist/components/ea-date-picker.js +649 -0
  19. package/dist/components/ea-descriptions.js +474 -0
  20. package/dist/components/ea-dialog.js +249 -0
  21. package/dist/components/ea-drawer.js +216 -0
  22. package/dist/components/ea-dropdown.js +228 -0
  23. package/dist/components/ea-empty.js +93 -0
  24. package/dist/components/ea-icon.js +159 -0
  25. package/dist/components/ea-image-preview.js +532 -0
  26. package/dist/components/ea-image.js +327 -0
  27. package/dist/components/ea-infinite-scroll.js +109 -0
  28. package/dist/components/ea-input-number.js +367 -0
  29. package/dist/components/ea-input.js +588 -0
  30. package/dist/components/ea-layout.js +132 -0
  31. package/dist/components/ea-link.js +101 -0
  32. package/dist/components/ea-menu.js +433 -0
  33. package/dist/components/ea-message-box.js +624 -0
  34. package/dist/components/ea-message.js +313 -0
  35. package/dist/components/ea-notification.js +331 -0
  36. package/dist/components/ea-overlay.js +168 -0
  37. package/dist/components/ea-page-header.js +108 -0
  38. package/dist/components/ea-pagination.js +481 -0
  39. package/dist/components/ea-popconfirm.js +275 -0
  40. package/dist/components/ea-popover.js +147 -0
  41. package/dist/components/ea-popper.js +203 -0
  42. package/dist/components/ea-progress.js +286 -0
  43. package/dist/components/ea-radio.js +364 -0
  44. package/dist/components/ea-rate.js +241 -0
  45. package/dist/components/ea-result.js +100 -0
  46. package/dist/components/ea-scrollbar.js +235 -0
  47. package/dist/components/ea-segmented.js +215 -0
  48. package/dist/components/ea-select.js +609 -0
  49. package/dist/components/ea-skeleton.js +263 -0
  50. package/dist/components/ea-slider.js +430 -0
  51. package/dist/components/ea-space.js +123 -0
  52. package/dist/components/ea-splitter.js +233 -0
  53. package/dist/components/ea-statistic.js +74 -0
  54. package/dist/components/ea-steps.js +346 -0
  55. package/dist/components/ea-switch.js +271 -0
  56. package/dist/components/ea-table.js +1137 -0
  57. package/dist/components/ea-tabs.js +503 -0
  58. package/dist/components/ea-tag.js +228 -0
  59. package/dist/components/ea-text.js +113 -0
  60. package/dist/components/ea-time-picker.js +510 -0
  61. package/dist/components/ea-timeline.js +185 -0
  62. package/dist/components/ea-tooltip.js +161 -0
  63. package/dist/components/ea-tour.js +544 -0
  64. package/dist/components/ea-transfer.js +949 -0
  65. package/dist/components/ea-tree.js +1125 -0
  66. package/dist/components/index.js +60 -0
  67. package/dist/core/FormBase.js +238 -0
  68. package/dist/css/ea-alert.style.js +4 -0
  69. package/dist/css/ea-aside.style.js +4 -0
  70. package/dist/css/ea-avatar.style.js +4 -0
  71. package/dist/css/ea-backtop.style.js +4 -0
  72. package/dist/css/ea-badge.style.js +4 -0
  73. package/dist/css/ea-breadcrumb-item.style.js +4 -0
  74. package/dist/css/ea-breadcrumb.style.js +4 -0
  75. package/dist/css/ea-button-group.style.js +4 -0
  76. package/dist/css/ea-button.style.js +4 -0
  77. package/dist/css/ea-calendar.style.js +4 -0
  78. package/dist/css/ea-card.style.js +4 -0
  79. package/dist/css/ea-carousel-item.style.js +4 -0
  80. package/dist/css/ea-carousel.style.js +4 -0
  81. package/dist/css/ea-check-tag.style.js +4 -0
  82. package/dist/css/ea-checkbox-group.style.js +4 -0
  83. package/dist/css/ea-checkbox.style.js +4 -0
  84. package/dist/css/ea-col.style.js +4 -0
  85. package/dist/css/ea-collapse-item.style.js +4 -0
  86. package/dist/css/ea-collapse.style.js +4 -0
  87. package/dist/css/ea-color-picker-panel.style.js +4 -0
  88. package/dist/css/ea-color-picker.style.js +4 -0
  89. package/dist/css/ea-container.style.js +4 -0
  90. package/dist/css/ea-date-picker.style.js +4 -0
  91. package/dist/css/ea-descriptions-item.style.js +4 -0
  92. package/dist/css/ea-descriptions.style.js +4 -0
  93. package/dist/css/ea-dialog.style.js +4 -0
  94. package/dist/css/ea-drawer.style.js +4 -0
  95. package/dist/css/ea-dropdown-item.style.js +4 -0
  96. package/dist/css/ea-dropdown-menu.style.js +4 -0
  97. package/dist/css/ea-dropdown.style.js +4 -0
  98. package/dist/css/ea-empty.style.js +4 -0
  99. package/dist/css/ea-footer.style.js +4 -0
  100. package/dist/css/ea-header.style.js +4 -0
  101. package/dist/css/ea-icon.style.js +4 -0
  102. package/dist/css/ea-image-preview.style.js +4 -0
  103. package/dist/css/ea-image.style.js +4 -0
  104. package/dist/css/ea-infinite-scroll.style.js +4 -0
  105. package/dist/css/ea-input-number.style.js +4 -0
  106. package/dist/css/ea-input.style.js +4 -0
  107. package/dist/css/ea-link.style.js +4 -0
  108. package/dist/css/ea-main.style.js +4 -0
  109. package/dist/css/ea-menu-item-group.style.js +4 -0
  110. package/dist/css/ea-menu-item.style.js +4 -0
  111. package/dist/css/ea-menu.style.js +4 -0
  112. package/dist/css/ea-message-box.style.js +4 -0
  113. package/dist/css/ea-message.style.js +4 -0
  114. package/dist/css/ea-notification.style.js +4 -0
  115. package/dist/css/ea-option-gropu.style.js +4 -0
  116. package/dist/css/ea-option.style.js +4 -0
  117. package/dist/css/ea-overlay.style.js +4 -0
  118. package/dist/css/ea-page-header.style.js +4 -0
  119. package/dist/css/ea-pagination.style.js +4 -0
  120. package/dist/css/ea-popconfirm.style.js +4 -0
  121. package/dist/css/ea-popover.style.js +4 -0
  122. package/dist/css/ea-popper.style.js +4 -0
  123. package/dist/css/ea-progress.style.js +4 -0
  124. package/dist/css/ea-radio-group.style.js +4 -0
  125. package/dist/css/ea-radio.style.js +4 -0
  126. package/dist/css/ea-rate.style.js +4 -0
  127. package/dist/css/ea-result.style.js +4 -0
  128. package/dist/css/ea-row.style.js +4 -0
  129. package/dist/css/ea-scrollbar.style.js +4 -0
  130. package/dist/css/ea-segmented.style.js +4 -0
  131. package/dist/css/ea-select.style.js +4 -0
  132. package/dist/css/ea-skeleton-item.style.js +4 -0
  133. package/dist/css/ea-skeleton.style.js +4 -0
  134. package/dist/css/ea-slider.style.js +4 -0
  135. package/dist/css/ea-space.style.js +4 -0
  136. package/dist/css/ea-splitter-bar.style.js +4 -0
  137. package/dist/css/ea-splitter-panel.style.js +4 -0
  138. package/dist/css/ea-splitter.style.js +4 -0
  139. package/dist/css/ea-statistic.style.js +4 -0
  140. package/dist/css/ea-step.style.js +4 -0
  141. package/dist/css/ea-steps.style.js +4 -0
  142. package/dist/css/ea-sub-menu.style.js +4 -0
  143. package/dist/css/ea-switch.style.js +4 -0
  144. package/dist/css/ea-tab-panel.style.js +4 -0
  145. package/dist/css/ea-tab.style.js +4 -0
  146. package/dist/css/ea-table-column.style.js +4 -0
  147. package/dist/css/ea-table.style.js +4 -0
  148. package/dist/css/ea-tabs.style.js +4 -0
  149. package/dist/css/ea-tag.style.js +4 -0
  150. package/dist/css/ea-text.style.js +4 -0
  151. package/dist/css/ea-time-picker.style.js +4 -0
  152. package/dist/css/ea-timeline-item.style.js +4 -0
  153. package/dist/css/ea-timeline.style.js +4 -0
  154. package/dist/css/ea-tooltip.style.js +4 -0
  155. package/dist/css/ea-tour-step.style.js +4 -0
  156. package/dist/css/ea-tour.style.js +4 -0
  157. package/dist/css/ea-transfer.style.js +5 -0
  158. package/dist/css/ea-tree.style.js +6 -0
  159. package/dist/css/ea-ui-component.style.js +4 -0
  160. package/dist/favicon.ico +0 -0
  161. package/dist/utils/Color.js +439 -0
  162. package/dist/utils/I18nManager.js +218 -0
  163. package/dist/utils/Utils.js +65 -0
  164. package/dist/utils/Variables.js +12 -0
  165. package/dist/utils/parseTime.js +73 -0
  166. package/dist/utils/timeout.js +9 -0
  167. package/package.json +1 -1
@@ -0,0 +1,161 @@
1
+ var w = Object.defineProperty;
2
+ var b = (e) => {
3
+ throw TypeError(e);
4
+ };
5
+ var y = (e, s, t) => s in e ? w(e, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[s] = t;
6
+ var E = (e, s, t) => y(e, typeof s != "symbol" ? s + "" : s, t), C = (e, s, t) => s.has(e) || b("Cannot " + t);
7
+ var o = (e, s, t) => (C(e, s, "read from private field"), t ? t.call(e) : s.get(e)), r = (e, s, t) => s.has(e) ? b("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(e) : s.set(e, t), l = (e, s, t, i) => (C(e, s, "write to private field"), i ? i.call(e, t) : s.set(e, t), t);
8
+ import { EaPopper as k } from "./ea-popper.js";
9
+ import { s as x } from "../css/ea-tooltip.style.js";
10
+ var d, c, p, h, n, m, u, g, f;
11
+ class L extends k {
12
+ constructor() {
13
+ super();
14
+ /** @type {HTMLElement} */
15
+ r(this, d);
16
+ /** @type {HTMLElement} */
17
+ r(this, c);
18
+ /** @type {HTMLElement} */
19
+ r(this, p);
20
+ /** @type {HTMLElement} */
21
+ r(this, h);
22
+ /** @type {AbortController} */
23
+ r(this, n);
24
+ r(this, m);
25
+ E(this, "state", this.properties({
26
+ trigger: {
27
+ type: ["click", "focus", "hover", "contextmenu", "customized"],
28
+ default: "hover",
29
+ observer: (t) => {
30
+ }
31
+ },
32
+ visible: {
33
+ type: Boolean,
34
+ default: !1,
35
+ observer: (t) => {
36
+ this.status = t;
37
+ }
38
+ },
39
+ effect: {
40
+ type: ["dark", "light", "customized"],
41
+ default: "dark",
42
+ observer: (t) => {
43
+ t !== "customized" && (o(this, d).className = this.updateContainerClasslist());
44
+ }
45
+ },
46
+ content: {
47
+ type: String,
48
+ default: "",
49
+ observer: (t) => {
50
+ if (o(this, h))
51
+ o(this, h).innerText = t;
52
+ else {
53
+ const i = document.createElement("div"), a = o(this, c).querySelector("slot");
54
+ i.classList.add("ea-tooltip__content"), i.part = "content", i.innerText = t, o(this, c).appendChild(i), l(this, h, i), a.remove();
55
+ }
56
+ }
57
+ }
58
+ }));
59
+ r(this, u, {
60
+ hover: () => {
61
+ this.addEventListener(
62
+ "mouseover",
63
+ (t) => {
64
+ this.show(), this.addEventListener(
65
+ "mouseout",
66
+ (i) => {
67
+ this.hide();
68
+ },
69
+ { once: !0 }
70
+ );
71
+ },
72
+ { signal: o(this, n).signal }
73
+ );
74
+ },
75
+ click: () => {
76
+ this.addEventListener(
77
+ "click",
78
+ () => {
79
+ this.toggle();
80
+ },
81
+ { signal: o(this, n).signal }
82
+ );
83
+ },
84
+ focus: () => {
85
+ this.addEventListener(
86
+ "focus",
87
+ () => {
88
+ this.show(), this.addEventListener(
89
+ "blur",
90
+ (t) => {
91
+ this.hide();
92
+ },
93
+ { once: !0 }
94
+ );
95
+ },
96
+ { signal: o(this, n).signal }
97
+ );
98
+ },
99
+ contextmenu: () => {
100
+ this.addEventListener(
101
+ "contextmenu",
102
+ (t) => {
103
+ t.preventDefault();
104
+ const i = new AbortController();
105
+ this.show(), window.addEventListener(
106
+ "click",
107
+ (a) => {
108
+ this.contains(a.target) || (i.abort(), this.hide());
109
+ },
110
+ { signal: i.signal }
111
+ );
112
+ },
113
+ { signal: o(this, n).signal }
114
+ );
115
+ }
116
+ });
117
+ r(this, g, () => {
118
+ const t = new AbortController();
119
+ l(this, n, t), this.assignedStyle(x);
120
+ });
121
+ r(this, f, () => {
122
+ var i, a;
123
+ if (this.trigger === "customized") return;
124
+ const t = Object.keys(o(this, u)).find(
125
+ (v) => this.trigger === v
126
+ );
127
+ (a = (i = o(this, u))[t || "hover"]) == null || a.call(i), t || console.warn(`[EaPopper] trigger event ${this.trigger} is not exist`);
128
+ });
129
+ l(this, d, this.shadowRoot.querySelector(".ea-popper")), l(this, c, this.shadowRoot.querySelector(
130
+ ".ea-popper__original"
131
+ )), l(this, p, this.shadowRoot.querySelector(
132
+ ".ea-popper__reference"
133
+ ));
134
+ }
135
+ static get observedAttributes() {
136
+ return [
137
+ ...super.observedAttributes,
138
+ "trigger",
139
+ "content",
140
+ "visible",
141
+ "effect"
142
+ ];
143
+ }
144
+ updateContainerClasslist() {
145
+ return `${super.updateContainerClasslist()} ${this.computedClasslist("ea-tooltip", {
146
+ ["--" + this.effect]: this.effect && this.effect !== "customized"
147
+ })}`;
148
+ }
149
+ connectedCallback() {
150
+ super.connectedCallback(), o(this, g).call(this), o(this, f).call(this);
151
+ }
152
+ $beforeUnmounted() {
153
+ var t;
154
+ super.$beforeUnmounted(), (t = o(this, n)) == null || t.abort();
155
+ }
156
+ }
157
+ d = new WeakMap(), c = new WeakMap(), p = new WeakMap(), h = new WeakMap(), n = new WeakMap(), m = new WeakMap(), u = new WeakMap(), g = new WeakMap(), f = new WeakMap();
158
+ window.customElements.get("ea-tooltip") || window.customElements.define("ea-tooltip", L);
159
+ export {
160
+ L as EaTooltip
161
+ };
@@ -0,0 +1,544 @@
1
+ var et = Object.defineProperty;
2
+ var O = (a) => {
3
+ throw TypeError(a);
4
+ };
5
+ var st = (a, r, t) => r in a ? et(a, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : a[r] = t;
6
+ var z = (a, r, t) => st(a, typeof r != "symbol" ? r + "" : r, t), F = (a, r, t) => r.has(a) || O("Cannot " + t);
7
+ var e = (a, r, t) => (F(a, r, "read from private field"), t ? t.call(a) : r.get(a)), n = (a, r, t) => r.has(a) ? O("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(a) : r.set(a, t), l = (a, r, t, s) => (F(a, r, "write to private field"), s ? s.call(a, t) : r.set(a, t), t), Q = (a, r, t) => (F(a, r, "access private method"), t);
8
+ import { B as X } from "./Base.js";
9
+ import { s as ot } from "../css/ea-tour.style.js";
10
+ import "./ea-button.js";
11
+ import { s as it } from "../css/ea-tour-step.style.js";
12
+ import { E as rt } from "../utils/Utils.js";
13
+ const at = (a, r = 0) => {
14
+ const t = a.getBoundingClientRect();
15
+ return t.top > 0 && t.left > 0 && t.bottom <= window.innerHeight - r && t.right <= window.innerWidth - r;
16
+ };
17
+ var T, u, E, k, S, A, p, y, m, D, I, W, q;
18
+ class nt extends X {
19
+ constructor() {
20
+ super();
21
+ /** @type {HTMLElement} */
22
+ n(this, T);
23
+ /** @type {HTMLElement} */
24
+ n(this, u);
25
+ /** @type {HTMLElement} */
26
+ n(this, E);
27
+ /** @type {HTMLElement} */
28
+ n(this, k);
29
+ /** @type {HTMLElement} */
30
+ n(this, S);
31
+ /** @type {HTMLElement} */
32
+ n(this, A);
33
+ /** @type {AbortController} */
34
+ n(this, p);
35
+ n(this, y, {
36
+ /** @type {AbortController} */
37
+ currentChangeAbortController: null
38
+ });
39
+ n(this, m, {
40
+ isChildrenLoaded: !1,
41
+ isCenter: !1,
42
+ queueTask: [],
43
+ originalPlacement: []
44
+ });
45
+ z(this, "state", this.properties({
46
+ "append-to": {
47
+ type: String,
48
+ default: "body",
49
+ observer: () => {
50
+ }
51
+ },
52
+ visible: {
53
+ type: Boolean,
54
+ default: "",
55
+ observer: async (t) => {
56
+ var s;
57
+ if (e(this, m).isChildrenLoaded || (await customElements.whenDefined("ea-tour-step"), e(this, m).isChildrenLoaded = !0), (s = e(this, y).currentChangeAbortController) == null || s.abort(), this.current = 0, t) {
58
+ e(this, y).currentChangeAbortController = new AbortController();
59
+ const o = () => {
60
+ e(this, q).call(this, this.current);
61
+ };
62
+ this.mask && (document.body.style.overflow = "hidden"), e(this, q).call(this, this.current), window.addEventListener("resize", o, {
63
+ signal: e(this, y).currentChangeAbortController.signal
64
+ }), window.addEventListener("scroll", o, {
65
+ signal: e(this, y).currentChangeAbortController.signal
66
+ });
67
+ } else
68
+ this.mask && (document.body.style.overflow = "auto");
69
+ this.updateContainerClasslist();
70
+ }
71
+ },
72
+ gap: {
73
+ type: Number,
74
+ default: 6,
75
+ observer: () => {
76
+ }
77
+ },
78
+ current: {
79
+ type: Number,
80
+ default: 0,
81
+ observer: async (t) => {
82
+ e(this, m).isChildrenLoaded || (await customElements.whenDefined("ea-tour-step"), e(this, m).isChildrenLoaded = !0);
83
+ const s = [...this.querySelectorAll("ea-tour-step")];
84
+ if (s.length !== 0) {
85
+ if (t < 0) {
86
+ this.current = 0;
87
+ return;
88
+ } else if (t >= s.length) {
89
+ this.visible = !1;
90
+ return;
91
+ }
92
+ s.forEach((o, g) => {
93
+ o.style.setProperty(
94
+ "--ea-tour-step-visible",
95
+ g === t ? "block" : "none"
96
+ );
97
+ }), e(this, q).call(this, t);
98
+ }
99
+ }
100
+ },
101
+ mask: {
102
+ type: Boolean,
103
+ default: !0,
104
+ observer: () => {
105
+ this.updateContainerClasslist();
106
+ }
107
+ },
108
+ type: {
109
+ type: ["default", "primary"],
110
+ default: "default",
111
+ /** @param {"default" | "primary"} newVal */
112
+ observer: (t) => {
113
+ this.querySelectorAll("ea-tour-step").forEach((s) => {
114
+ t === "primary" ? s.setAttribute("type", t) : s.removeAttribute("type");
115
+ });
116
+ }
117
+ },
118
+ placement: {
119
+ type: [
120
+ "top",
121
+ "top-start",
122
+ "top-end",
123
+ "bottom",
124
+ "bottom-start",
125
+ "bottom-end",
126
+ "left",
127
+ "left-start",
128
+ "left-end",
129
+ "right",
130
+ "right-start",
131
+ "right-end"
132
+ ],
133
+ default: "bottom",
134
+ observer: (t) => {
135
+ this.querySelectorAll("ea-tour-step").forEach((s) => {
136
+ s.getAttribute("placement") || s.setAttribute("placement", t);
137
+ });
138
+ }
139
+ }
140
+ }));
141
+ /**
142
+ * 处理 append-to 属性
143
+ * @param {string} selector
144
+ */
145
+ n(this, D, async (t) => {
146
+ await customElements.whenDefined("ea-tour");
147
+ const s = document.querySelector(t);
148
+ s || console.warn(`[EaTour] append-to ${t} not found.`, this), s ? s.appendChild(this) : document.body.appendChild(this);
149
+ });
150
+ /**
151
+ * 当未传入目标元素时,居中处理
152
+ */
153
+ n(this, I, () => {
154
+ const t = [...this.querySelectorAll("ea-tour-step")];
155
+ e(this, m).isCenter = !0, t[this.current].setAttribute("center", !0), e(this, u).style.width = "0px", e(this, u).style.height = "0px", e(this, u).style.x = "0px", e(this, u).style.y = "0px", e(this, E).style.height = "100%", e(this, k).style.x = "0", e(this, S).style.y = "0", e(this, A).style.width = "100%", this.updateContainerClasslist();
156
+ });
157
+ /**
158
+ * 更新 提示元素 的位置
159
+ * @param {HTMLElement} target 目标元素,即被聚焦的元素
160
+ * @param {import("../ea-tour-step").EaTourStep} step 提示元素,即 step 元素
161
+ * @returns {void}
162
+ */
163
+ n(this, W, (t, s) => {
164
+ var K;
165
+ const { width: o, height: g, x: v, y: N, top: d, bottom: x, left: h } = t.getBoundingClientRect(), i = this.gap * 2, c = s.clientWidth || s.offsetWidth || 520, b = s.clientHeight || s.offsetHeight || 0, Z = window.innerWidth, V = window.innerHeight, tt = {
166
+ top: {
167
+ top: d - b - i,
168
+ left: h - c / 2 + i
169
+ },
170
+ "top-start": {
171
+ top: d - b - i,
172
+ left: h - i
173
+ },
174
+ "top-end": {
175
+ top: d - b - i,
176
+ left: h - c + o + i
177
+ },
178
+ right: {
179
+ top: d - i - b / 2 + g / 2,
180
+ left: h + o + i
181
+ },
182
+ "right-start": {
183
+ top: d - i,
184
+ left: h + o + i
185
+ },
186
+ "right-end": {
187
+ top: d - b / 2 - i,
188
+ left: h + o + i
189
+ },
190
+ bottom: {
191
+ top: x + i,
192
+ left: h - c / 2 + i
193
+ },
194
+ "bottom-start": {
195
+ top: x + i,
196
+ left: h - i
197
+ },
198
+ "bottom-end": {
199
+ top: x + i,
200
+ left: h - c + o + i
201
+ },
202
+ left: {
203
+ top: d - i - b / 2 + g / 2,
204
+ left: h - c - i * 2
205
+ },
206
+ "left-start": {
207
+ top: d - i,
208
+ left: h - c - i * 2
209
+ },
210
+ "left-end": {
211
+ top: d - b / 2 - i,
212
+ left: h - c - i * 2
213
+ }
214
+ }, J = s.placement || ((K = s.getAttribute) == null ? void 0 : K.call(s, "placement")) || this.placement, j = tt[J];
215
+ if (!j) {
216
+ console.warn(`[EaTourStep] placement ${J} is not supported.`);
217
+ return;
218
+ }
219
+ let w = Number(j.top), _ = Number(j.left);
220
+ w < 0 ? w = Math.max(w, N + i + g) : w + b > V && (w = Math.min(w, N - b - i)), _ < 0 ? _ = Math.max(_, v + o + i) : _ + c > Z && (_ = Math.min(_, v - c - i)), s.style.left = `${_}px`, s.style.top = `${w}px`;
221
+ });
222
+ /**
223
+ * 更新 提示容器 的位置
224
+ * @param {number} [current] 当前步骤
225
+ */
226
+ n(this, q, (t = this.current) => {
227
+ const s = [...this.querySelectorAll("ea-tour-step")], o = this.gap / 2, g = s[t].getAttribute("target"), v = document.querySelector(g);
228
+ if (s[t].removeAttribute("center"), e(this, m).isCenter = !1, g) {
229
+ if (!v)
230
+ return console.warn(
231
+ `[EaTour] target ${g} not found`,
232
+ s[t]
233
+ );
234
+ } else return e(this, I).call(this);
235
+ at(v) || window.scrollTo({
236
+ top: v.getBoundingClientRect().top
237
+ });
238
+ const { width: N, height: d, x, y: h, right: i, bottom: c } = v.getBoundingClientRect();
239
+ e(this, u).style.width = `${N + this.gap}px`, e(this, u).style.height = `${d + this.gap}px`, e(this, u).style.x = `${x - o}px`, e(this, u).style.y = `${h - o}px`, e(this, E).style.height = `${h - o}px`, e(this, k).style.x = `${i + o}px`, e(this, S).style.y = `${c + o}px`, e(this, A).style.width = `${x - o}px`, e(this, W).call(this, v, s[t]);
240
+ });
241
+ this.stylesheet = ot, this.$render(), e(this, D).call(this, this["append-to"]);
242
+ }
243
+ static get observedAttributes() {
244
+ return [
245
+ ...super.observedAttributes,
246
+ "append-to",
247
+ "visible",
248
+ "current",
249
+ "gap",
250
+ "mask",
251
+ "type",
252
+ "placement"
253
+ ];
254
+ }
255
+ /**
256
+ * 获取 classlist 列表
257
+ * @return {string} 属性值
258
+ */
259
+ updateContainerClasslist() {
260
+ const t = this.computedClasslist(
261
+ "ea-tour",
262
+ {},
263
+ {
264
+ visible: this.visible,
265
+ mask: this.mask,
266
+ center: e(this, m).isCenter
267
+ }
268
+ );
269
+ return e(this, T).className = t, t;
270
+ }
271
+ $render() {
272
+ this.shadowRoot.innerHTML = `
273
+ <div class="ea-tour">
274
+ <svg class="ea-tour__svg">
275
+ <defs>
276
+ <mask id="reverseMask">
277
+ <rect x="0" y="0" width="100%" height="100%" fill="white" />
278
+ <rect class="ea-tour__hollow" part="hollow" x="50" y="50" width="100px" height="100px" fill="black" />
279
+ </mask>
280
+ </defs>
281
+ <rect class='ea-tour__mask' x="0" y="0" width="100%" height="100%" mask="url(#reverseMask)"></rect>
282
+ <rect class="ea-tour__divider top-mask" x="0" y="0" width="100%" height="50px"></rect>
283
+ <rect class="ea-tour__divider right-mask" x="150px" y="0" width="100%" height="100%"></rect>
284
+ <rect class="ea-tour__divider bottom-mask" x="0" y="150px" width="100%" height="100%"></rect>
285
+ <rect class="ea-tour__divider left-mask" x="0" y="0" width="50px" height="100%"></rect>
286
+ </svg>
287
+ </div>
288
+ <div class="ea-tour__content">
289
+ <slot></slot>
290
+ </div>
291
+ `, l(this, T, this.shadowRoot.querySelector(".ea-tour")), l(this, u, this.shadowRoot.querySelector(".ea-tour__hollow")), l(this, E, this.shadowRoot.querySelector(".ea-tour__divider.top-mask")), l(this, k, this.shadowRoot.querySelector(
292
+ ".ea-tour__divider.right-mask"
293
+ )), l(this, S, this.shadowRoot.querySelector(
294
+ ".ea-tour__divider.bottom-mask"
295
+ )), l(this, A, this.shadowRoot.querySelector(
296
+ ".ea-tour__divider.left-mask"
297
+ ));
298
+ }
299
+ connectedCallback() {
300
+ var s;
301
+ super.connectedCallback();
302
+ const t = () => {
303
+ this.emit("change", {
304
+ detail: { current: this.current },
305
+ bubbles: !0,
306
+ composed: !0
307
+ });
308
+ };
309
+ (s = e(this, p)) == null || s.abort(), l(this, p, new AbortController()), this.addEventListener(
310
+ "ea-close",
311
+ () => {
312
+ this.visible = !1;
313
+ },
314
+ { signal: e(this, p).signal }
315
+ ), this.addEventListener(
316
+ "next",
317
+ (o) => {
318
+ o.preventDefault(), o.stopImmediatePropagation(), o.stopPropagation(), this.current++, t();
319
+ },
320
+ { signal: e(this, p).signal }
321
+ ), this.addEventListener(
322
+ "previous",
323
+ (o) => {
324
+ o.preventDefault(), o.stopImmediatePropagation(), o.stopPropagation(), this.current--, t();
325
+ },
326
+ { signal: e(this, p).signal }
327
+ ), this.addEventListener(
328
+ "finish",
329
+ () => {
330
+ this.visible = !1;
331
+ },
332
+ { signal: e(this, p).signal }
333
+ );
334
+ }
335
+ $beforeUnmounted() {
336
+ var t;
337
+ (t = e(this, p)) == null || t.abort();
338
+ for (const s in e(this, y))
339
+ e(this, y)[s] = null;
340
+ }
341
+ }
342
+ T = new WeakMap(), u = new WeakMap(), E = new WeakMap(), k = new WeakMap(), S = new WeakMap(), A = new WeakMap(), p = new WeakMap(), y = new WeakMap(), m = new WeakMap(), D = new WeakMap(), I = new WeakMap(), W = new WeakMap(), q = new WeakMap();
343
+ window.customElements.get("ea-tour") || window.customElements.define("ea-tour", nt);
344
+ class lt extends Event {
345
+ constructor(r) {
346
+ super("ea-close", {
347
+ bubbles: !0,
348
+ composed: !0
349
+ }), this.detail = r;
350
+ }
351
+ }
352
+ var M, B, H, $, L, R, P, f, C, G, Y, U;
353
+ class ht extends X {
354
+ constructor() {
355
+ super();
356
+ n(this, C);
357
+ /** @type {HTMLElement} */
358
+ n(this, M);
359
+ /** @type {HTMLElement} */
360
+ n(this, B);
361
+ /** @type {HTMLSlotElement} */
362
+ n(this, H);
363
+ /** @type {EaButton} */
364
+ n(this, $);
365
+ /** @type {EaButton} */
366
+ n(this, L);
367
+ /** @type {EaButton} */
368
+ n(this, R);
369
+ /** @type {EaButton} */
370
+ n(this, P);
371
+ /** @type {AbortController} */
372
+ n(this, f);
373
+ z(this, "state", this.properties({
374
+ title: {
375
+ type: String,
376
+ default: "",
377
+ observer: (t) => {
378
+ e(this, B).textContent = t;
379
+ }
380
+ },
381
+ target: {
382
+ type: String,
383
+ default: "",
384
+ observer: async (t) => {
385
+ if (t !== "" && (await customElements.whenDefined("ea-tour-step"), !document.querySelector(t)))
386
+ return console.warn(
387
+ `[EaTour] target ${t} not a valid element selector.`,
388
+ this
389
+ );
390
+ }
391
+ },
392
+ type: {
393
+ type: ["default", "primary"],
394
+ default: "default",
395
+ observer: (t) => {
396
+ e(this, U).call(this, t), this.updateContainerClasslist();
397
+ }
398
+ },
399
+ placement: {
400
+ type: [
401
+ "top",
402
+ "top-start",
403
+ "top-end",
404
+ "bottom",
405
+ "bottom-start",
406
+ "bottom-end",
407
+ "left",
408
+ "left-start",
409
+ "left-end",
410
+ "right",
411
+ "right-start",
412
+ "right-end"
413
+ ],
414
+ default: "bottom",
415
+ observer: (t) => {
416
+ }
417
+ }
418
+ }));
419
+ /**
420
+ * 按钮类型切换
421
+ * @param {'default' | 'primary'} type
422
+ */
423
+ n(this, U, (t) => {
424
+ [e(this, $), e(this, L), e(this, R)].forEach((o) => {
425
+ t === "primary" ? o.setAttribute("type", "primary") : o.removeAttribute("type");
426
+ });
427
+ });
428
+ this.stylesheet = it, this.$render();
429
+ }
430
+ static get observedAttributes() {
431
+ return [
432
+ ...super.observedAttributes,
433
+ "title",
434
+ "target",
435
+ "type",
436
+ "placement"
437
+ ];
438
+ }
439
+ /**
440
+ * 获取 classlist 列表
441
+ * @return {string} 属性值
442
+ */
443
+ updateContainerClasslist() {
444
+ const t = this.computedClasslist("ea-tour-step", {
445
+ ["--" + this.type]: this.type
446
+ });
447
+ return e(this, M).className = t, t;
448
+ }
449
+ $render() {
450
+ this.shadowRoot.innerHTML = `
451
+ <div class='ea-tour-step' part='container'>
452
+ <header class='ea-tour-step__header' part='header'>
453
+ <slot name='header'></slot>
454
+ <ea-icon class='ea-tour-step__close-icon' part='close-icon' name="xmark"></ea-icon>
455
+ </header>
456
+ <main class='ea-tour-step__content' part='content'>
457
+ <slot></slot>
458
+ </main>
459
+ <footer class='ea-tour-step__footer' part='footer'>
460
+ <div class='ea-tour-step__indicator-group' part='indicator-group'>
461
+ <slot name='indicator'></slot>
462
+ </div>
463
+ <div class='ea-tour-step__switch-group' part='switch-group'>
464
+ <slot name='footer'>
465
+ <ea-button class="ea-tour-step__btn ea-tour-step__previous" part="previous">Previous</ea-button>
466
+ <ea-button class="ea-tour-step__btn ea-tour-step__next" part="next">Next</ea-button>
467
+ <ea-button class="ea-tour-step__btn ea-tour-step__finish" part="finish">Finish</ea-button>
468
+ </slot>
469
+ </div>
470
+ </footer>
471
+ </div>
472
+ `, l(this, M, this.shadowRoot.querySelector(".ea-tour-step")), l(this, B, this.shadowRoot.querySelector(".ea-tour-step__header slot")), l(this, H, this.shadowRoot.querySelector(
473
+ "slot[name='indicator']"
474
+ )), l(this, L, this.shadowRoot.querySelector(".ea-tour-step__next")), l(this, $, this.shadowRoot.querySelector(
475
+ ".ea-tour-step__previous"
476
+ )), l(this, R, this.shadowRoot.querySelector(".ea-tour-step__finish")), l(this, P, this.shadowRoot.querySelector(
477
+ ".ea-tour-step__close-icon"
478
+ ));
479
+ }
480
+ async connectedCallback() {
481
+ var t;
482
+ super.connectedCallback(), await customElements.whenDefined("ea-tour"), (t = e(this, f)) == null || t.abort(), l(this, f, new AbortController()), e(this, H).innerHTML = Q(this, C, Y).call(this, e(this, C, G).querySelectorAll("ea-tour-step")), e(this, P).addEventListener(
483
+ "click",
484
+ () => {
485
+ const s = [...e(this, C, G).children].findIndex(
486
+ (o) => o === this
487
+ );
488
+ this.dispatchEvent(
489
+ new lt({
490
+ current: s
491
+ })
492
+ );
493
+ },
494
+ { signal: e(this, f).signal }
495
+ ), e(this, L).addEventListener(
496
+ "click",
497
+ () => {
498
+ this.emit("next", { bubbles: !0 });
499
+ },
500
+ { signal: e(this, f).signal }
501
+ ), e(this, $).addEventListener(
502
+ "click",
503
+ () => {
504
+ this.emit("previous", { bubbles: !0 });
505
+ },
506
+ { signal: e(this, f).signal }
507
+ ), e(this, R).addEventListener(
508
+ "click",
509
+ () => {
510
+ this.emit("finish", { bubbles: !0 });
511
+ },
512
+ { signal: e(this, f).signal }
513
+ );
514
+ }
515
+ $beforeUnmounted() {
516
+ var t;
517
+ (t = e(this, f)) == null || t.abort();
518
+ }
519
+ }
520
+ M = new WeakMap(), B = new WeakMap(), H = new WeakMap(), $ = new WeakMap(), L = new WeakMap(), R = new WeakMap(), P = new WeakMap(), f = new WeakMap(), C = new WeakSet(), G = function() {
521
+ try {
522
+ return this.closest("ea-tour");
523
+ } catch {
524
+ return null;
525
+ }
526
+ }, /**
527
+ * 渲染指示器节点的字符串
528
+ * @param {HTMLElement[]} tourItems
529
+ * @returns {string}
530
+ */
531
+ Y = function(t) {
532
+ return Array.from(
533
+ t,
534
+ (s) => rt.EaElement.h("span", null, {
535
+ class: ["ea-tour-step__indicator", s === this ? "is-active" : ""],
536
+ part: "indicator"
537
+ })
538
+ ).join("");
539
+ }, U = new WeakMap();
540
+ window.customElements.get("ea-tour-step") || window.customElements.define("ea-tour-step", ht);
541
+ export {
542
+ nt as EaTour,
543
+ ht as EaTourStep
544
+ };