@flexilla/alpine-popover 0.2.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cdn.js +152 -136
- package/dist/cdn.min.js +1 -1
- package/dist/module.cjs.js +152 -136
- package/dist/module.esm.js +152 -136
- package/package.json +3 -3
package/dist/cdn.js
CHANGED
|
@@ -1,99 +1,99 @@
|
|
|
1
1
|
(() => {
|
|
2
2
|
// ../../node_modules/@flexilla/popover/dist/popover.js
|
|
3
3
|
var B = Object.defineProperty;
|
|
4
|
-
var j = (
|
|
5
|
-
var a = (
|
|
6
|
-
var
|
|
7
|
-
var
|
|
8
|
-
var p = (
|
|
9
|
-
var
|
|
10
|
-
var
|
|
11
|
-
if (!
|
|
4
|
+
var j = (n, e, t) => e in n ? B(n, e, { enumerable: true, configurable: true, writable: true, value: t }) : n[e] = t;
|
|
5
|
+
var a = (n, e, t) => j(n, typeof e != "symbol" ? e + "" : e, t);
|
|
6
|
+
var q = Object.defineProperty;
|
|
7
|
+
var G = (n, e, t) => e in n ? q(n, e, { enumerable: true, configurable: true, writable: true, value: t }) : n[e] = t;
|
|
8
|
+
var p = (n, e, t) => G(n, typeof e != "symbol" ? e + "" : e, t);
|
|
9
|
+
var U = "bottom";
|
|
10
|
+
var K = ({ reference: n, popper: e }) => {
|
|
11
|
+
if (!n || !e)
|
|
12
12
|
throw new Error("Reference or popper element is null or undefined");
|
|
13
|
-
const t = /* @__PURE__ */ new WeakMap(),
|
|
13
|
+
const t = /* @__PURE__ */ new WeakMap(), i = (r) => (t.has(r) || t.set(r, r.getBoundingClientRect()), t.get(r)), o = i(e), s = i(n);
|
|
14
14
|
return {
|
|
15
15
|
popperHeight: o.height,
|
|
16
16
|
popperWidth: o.width,
|
|
17
|
-
refHeight:
|
|
18
|
-
refWidth:
|
|
19
|
-
refLeft:
|
|
20
|
-
refTop:
|
|
21
|
-
refRight:
|
|
17
|
+
refHeight: s.height,
|
|
18
|
+
refWidth: s.width,
|
|
19
|
+
refLeft: s.left,
|
|
20
|
+
refTop: s.top,
|
|
21
|
+
refRight: s.right
|
|
22
22
|
};
|
|
23
23
|
};
|
|
24
|
-
var V = (
|
|
25
|
-
const o = t,
|
|
26
|
-
return o >= (
|
|
24
|
+
var V = (n, e, t, i) => {
|
|
25
|
+
const o = t, s = i - (t + e);
|
|
26
|
+
return o >= (n - e) / 2 && s >= (n - e) / 2;
|
|
27
27
|
};
|
|
28
|
-
var X = (
|
|
29
|
-
var Y = (
|
|
30
|
-
var J = (
|
|
31
|
-
var Q = (
|
|
32
|
-
var Z = (
|
|
33
|
-
const r = o - t -
|
|
34
|
-
return
|
|
28
|
+
var X = (n, e, t, i) => (n - e) / 2 <= t && t + n / 2 + e / 2 <= i;
|
|
29
|
+
var Y = (n, e, t, i, o) => t > o - i ? e() ? window.innerHeight - o : t - o : n() ? 0 : t + i;
|
|
30
|
+
var J = (n, e, t, i) => n <= i && t - n <= e;
|
|
31
|
+
var Q = (n, e, t, i) => t <= i && -n <= e;
|
|
32
|
+
var Z = (n, e, t, i, o, s) => {
|
|
33
|
+
const r = o - t - s, h = t - i, d = t + s - i + (o - t - s), c = r >= 0 ? o - i : h >= 0 ? t - i : t;
|
|
34
|
+
return n() ? 0 : e() ? d : c;
|
|
35
35
|
};
|
|
36
|
-
var _ = (
|
|
37
|
-
var ee = (
|
|
36
|
+
var _ = (n, e, t, i) => n <= t && e - n - i >= n;
|
|
37
|
+
var ee = (n, e) => n >= e;
|
|
38
38
|
var te = ({
|
|
39
|
-
placement:
|
|
39
|
+
placement: n,
|
|
40
40
|
refWidth: e,
|
|
41
41
|
refTop: t,
|
|
42
|
-
refLeft:
|
|
42
|
+
refLeft: i,
|
|
43
43
|
refHeight: o,
|
|
44
|
-
popperWidth:
|
|
44
|
+
popperWidth: s,
|
|
45
45
|
popperHeight: r,
|
|
46
46
|
windowHeight: h,
|
|
47
47
|
windowWidth: d,
|
|
48
48
|
offsetDistance: c
|
|
49
49
|
}) => {
|
|
50
|
-
const m = d -
|
|
50
|
+
const m = d - i - e, v = i, x = h - t - o, C = t, u = () => Y(
|
|
51
51
|
() => Q(t, o, r, h),
|
|
52
52
|
() => J(t, o, r, h),
|
|
53
53
|
t,
|
|
54
54
|
o,
|
|
55
55
|
r
|
|
56
|
-
),
|
|
57
|
-
() => _(
|
|
58
|
-
() => ee(
|
|
59
|
-
n,
|
|
56
|
+
), E = () => Z(
|
|
57
|
+
() => _(i, d, s, e),
|
|
58
|
+
() => ee(i, s),
|
|
60
59
|
i,
|
|
60
|
+
s,
|
|
61
61
|
d,
|
|
62
62
|
e
|
|
63
|
-
), D = () => V(
|
|
64
|
-
let
|
|
65
|
-
const
|
|
66
|
-
switch (
|
|
63
|
+
), D = () => V(s, e, i, d) ? i + e / 2 - s / 2 : E(), M = () => X(r, o, t, h) ? t + o / 2 - r / 2 : u(), T = () => i + s <= d ? i : E(), y = () => i + e - s >= 0 ? i + e - s : E(), O = () => t + r <= h ? t : u(), z = () => t + o - r >= 0 ? t + o - r : u();
|
|
64
|
+
let f = 0, g = 0;
|
|
65
|
+
const k = t - r - c, S = t + o + c, L = i - s - c, I = i + e + c, W = C >= r + c, F = x >= r + c, R = v >= s + c, $ = m >= s + c;
|
|
66
|
+
switch (n.startsWith("top") ? g = W ? k : F ? S : Math.max(k, S) : n.startsWith("bottom") ? g = F ? S : W ? k : Math.max(S) : n.startsWith("left") ? f = R ? L : $ ? I : Math.max(L, I) : n.startsWith("right") && (f = $ ? I : R ? L : Math.max(I, L)), n) {
|
|
67
67
|
case "bottom":
|
|
68
68
|
case "bottom-middle":
|
|
69
69
|
case "top":
|
|
70
70
|
case "top-middle":
|
|
71
|
-
|
|
71
|
+
f = D();
|
|
72
72
|
break;
|
|
73
73
|
case "left":
|
|
74
74
|
case "left-middle":
|
|
75
75
|
case "right":
|
|
76
76
|
case "right-middle":
|
|
77
|
-
|
|
77
|
+
g = M();
|
|
78
78
|
break;
|
|
79
79
|
case "bottom-start":
|
|
80
80
|
case "top-start":
|
|
81
|
-
|
|
81
|
+
f = T();
|
|
82
82
|
break;
|
|
83
83
|
case "bottom-end":
|
|
84
84
|
case "top-end":
|
|
85
|
-
|
|
85
|
+
f = y();
|
|
86
86
|
break;
|
|
87
87
|
case "left-start":
|
|
88
88
|
case "right-start":
|
|
89
|
-
|
|
89
|
+
g = O();
|
|
90
90
|
break;
|
|
91
91
|
case "left-end":
|
|
92
92
|
case "right-end":
|
|
93
|
-
|
|
93
|
+
g = z();
|
|
94
94
|
break;
|
|
95
95
|
}
|
|
96
|
-
return { x:
|
|
96
|
+
return { x: f, y: g };
|
|
97
97
|
};
|
|
98
98
|
var ne = class {
|
|
99
99
|
/**
|
|
@@ -114,7 +114,7 @@
|
|
|
114
114
|
* @param {boolean} [options.eventEffect.disableOnScroll] - Disable position updates on scroll
|
|
115
115
|
* @param {Function} [options.onUpdate] - Callback function when position updates
|
|
116
116
|
*/
|
|
117
|
-
constructor(e, t,
|
|
117
|
+
constructor(e, t, i = {}) {
|
|
118
118
|
p(this, "reference"), p(this, "popper"), p(this, "offsetDistance"), p(this, "placement"), p(this, "disableOnResize"), p(this, "disableOnScroll"), p(this, "onUpdate"), p(this, "isWindowEventsRegistered"), p(this, "validateElements", () => {
|
|
119
119
|
if (!(this.reference instanceof HTMLElement))
|
|
120
120
|
throw new Error("Invalid HTMLElement for Reference Element");
|
|
@@ -129,21 +129,21 @@
|
|
|
129
129
|
}), p(this, "initPlacement", () => {
|
|
130
130
|
var m;
|
|
131
131
|
this.validateElements(), this.setInitialStyles();
|
|
132
|
-
const v = window.innerWidth,
|
|
132
|
+
const v = window.innerWidth, x = window.innerHeight, { popperHeight: C, popperWidth: u, refHeight: E, refWidth: D, refLeft: M, refTop: T } = K({ reference: this.reference, popper: this.popper }), { x: y, y: O } = te(
|
|
133
133
|
{
|
|
134
134
|
placement: this.placement,
|
|
135
135
|
refWidth: D,
|
|
136
|
-
refTop:
|
|
136
|
+
refTop: T,
|
|
137
137
|
refLeft: M,
|
|
138
|
-
popperWidth:
|
|
139
|
-
refHeight:
|
|
138
|
+
popperWidth: u,
|
|
139
|
+
refHeight: E,
|
|
140
140
|
popperHeight: C,
|
|
141
|
-
windowHeight:
|
|
141
|
+
windowHeight: x,
|
|
142
142
|
windowWidth: v,
|
|
143
143
|
offsetDistance: this.offsetDistance
|
|
144
144
|
}
|
|
145
145
|
);
|
|
146
|
-
this.setPopperStyleProperty(
|
|
146
|
+
this.setPopperStyleProperty(y, O), (m = this.onUpdate) == null || m.call(this, { x: y, y: O, placement: this.placement });
|
|
147
147
|
}), p(this, "removeWindowEvents", () => {
|
|
148
148
|
this.isWindowEventsRegistered && (!this.disableOnResize && window.removeEventListener("resize", this.updatePosition), !this.disableOnScroll && window.removeEventListener("scroll", this.updatePosition), this.isWindowEventsRegistered = false);
|
|
149
149
|
}), p(this, "attachWindowEvent", () => {
|
|
@@ -157,18 +157,18 @@
|
|
|
157
157
|
});
|
|
158
158
|
const {
|
|
159
159
|
offsetDistance: o = 10,
|
|
160
|
-
placement:
|
|
160
|
+
placement: s = U,
|
|
161
161
|
eventEffect: r = {},
|
|
162
162
|
onUpdate: h
|
|
163
|
-
} =
|
|
163
|
+
} = i;
|
|
164
164
|
if (!(e instanceof HTMLElement))
|
|
165
165
|
throw new Error("Invalid HTMLElement for Reference Element");
|
|
166
166
|
if (!(t instanceof HTMLElement))
|
|
167
167
|
throw new Error("Invalid HTMLElement for Popper");
|
|
168
|
-
if (
|
|
168
|
+
if (i.offsetDistance && typeof i.offsetDistance != "number")
|
|
169
169
|
throw new Error("OffsetDistance must be a number");
|
|
170
170
|
const { disableOnResize: d, disableOnScroll: c } = r;
|
|
171
|
-
this.isWindowEventsRegistered = false, this.reference = e, this.popper = t, this.offsetDistance = o, this.placement =
|
|
171
|
+
this.isWindowEventsRegistered = false, this.reference = e, this.popper = t, this.offsetDistance = o, this.placement = s, this.disableOnResize = d || false, this.disableOnScroll = c || false, this.onUpdate = h;
|
|
172
172
|
}
|
|
173
173
|
/**
|
|
174
174
|
* Updates popper configuration and recalculates position
|
|
@@ -181,50 +181,50 @@
|
|
|
181
181
|
this.placement = e, this.offsetDistance = t || this.offsetDistance, this.initPlacement(), this.attachWindowEvent();
|
|
182
182
|
}
|
|
183
183
|
};
|
|
184
|
-
var
|
|
185
|
-
var
|
|
186
|
-
var l = (
|
|
187
|
-
var oe = (
|
|
188
|
-
var N = (
|
|
189
|
-
for (const [t,
|
|
190
|
-
|
|
184
|
+
var ie = Object.defineProperty;
|
|
185
|
+
var se = (n, e, t) => e in n ? ie(n, e, { enumerable: true, configurable: true, writable: true, value: t }) : n[e] = t;
|
|
186
|
+
var l = (n, e, t) => se(n, typeof e != "symbol" ? e + "" : e, t);
|
|
187
|
+
var oe = (n, e = document.body) => e.querySelector(n);
|
|
188
|
+
var N = (n, e) => {
|
|
189
|
+
for (const [t, i] of Object.entries(e))
|
|
190
|
+
n.setAttribute(t, i);
|
|
191
191
|
};
|
|
192
192
|
var re = ({
|
|
193
|
-
element:
|
|
193
|
+
element: n,
|
|
194
194
|
callback: e,
|
|
195
195
|
type: t,
|
|
196
|
-
keysCheck:
|
|
196
|
+
keysCheck: i
|
|
197
197
|
}) => {
|
|
198
|
-
const o = getComputedStyle(
|
|
199
|
-
if (
|
|
198
|
+
const o = getComputedStyle(n), s = o.transition;
|
|
199
|
+
if (s !== "none" && s !== "" && !i.includes(s)) {
|
|
200
200
|
const r = "transitionend", h = () => {
|
|
201
|
-
|
|
201
|
+
n.removeEventListener(r, h), e();
|
|
202
202
|
};
|
|
203
|
-
|
|
203
|
+
n.addEventListener(r, h, { once: true });
|
|
204
204
|
} else
|
|
205
205
|
e();
|
|
206
206
|
};
|
|
207
207
|
var ae = ({
|
|
208
|
-
element:
|
|
208
|
+
element: n,
|
|
209
209
|
callback: e
|
|
210
210
|
}) => {
|
|
211
211
|
re({
|
|
212
|
-
element:
|
|
212
|
+
element: n,
|
|
213
213
|
callback: e,
|
|
214
214
|
type: "transition",
|
|
215
215
|
keysCheck: ["all 0s ease 0s", "all"]
|
|
216
216
|
});
|
|
217
217
|
};
|
|
218
|
-
var le = (
|
|
219
|
-
const
|
|
220
|
-
|
|
218
|
+
var le = (n, e, t) => {
|
|
219
|
+
const i = new CustomEvent(e, { detail: t });
|
|
220
|
+
n.dispatchEvent(i);
|
|
221
221
|
};
|
|
222
|
-
var w = ({ state:
|
|
223
|
-
const
|
|
222
|
+
var w = ({ state: n, trigger: e, popper: t }) => {
|
|
223
|
+
const i = n === "open";
|
|
224
224
|
N(t, {
|
|
225
|
-
"data-state":
|
|
225
|
+
"data-state": n
|
|
226
226
|
}), N(e, {
|
|
227
|
-
"aria-expanded": `${
|
|
227
|
+
"aria-expanded": `${i}`
|
|
228
228
|
});
|
|
229
229
|
};
|
|
230
230
|
var he = class {
|
|
@@ -235,11 +235,11 @@
|
|
|
235
235
|
* @param {string | HTMLElement} params.content - The content element selector or HTMLElement
|
|
236
236
|
* @param {OverlayOptions} [params.options] - Configuration options for the overlay
|
|
237
237
|
*/
|
|
238
|
-
constructor({ trigger: e, content: t, options:
|
|
239
|
-
l(this, "triggerElement"), l(this, "contentElement"), l(this, "triggerStrategy"), l(this, "placement"), l(this, "offsetDistance"), l(this, "preventFromCloseOutside"), l(this, "preventFromCloseInside"), l(this, "options"), l(this, "defaultState"), l(this, "popper"), l(this, "eventEffect"), l(this, "getElement", (
|
|
240
|
-
this.contentElement.getAttribute("data-state") === "open" && (!this.triggerElement.contains(
|
|
241
|
-
}), l(this, "handleKeyDown", (
|
|
242
|
-
|
|
238
|
+
constructor({ trigger: e, content: t, options: i = {} }) {
|
|
239
|
+
l(this, "triggerElement"), l(this, "contentElement"), l(this, "triggerStrategy"), l(this, "placement"), l(this, "offsetDistance"), l(this, "preventFromCloseOutside"), l(this, "preventFromCloseInside"), l(this, "options"), l(this, "defaultState"), l(this, "popper"), l(this, "eventEffect"), l(this, "getElement", (s) => typeof s == "string" ? oe(s) : s instanceof HTMLElement ? s : void 0), l(this, "handleDocumentClick", (s) => {
|
|
240
|
+
this.contentElement.getAttribute("data-state") === "open" && (!this.triggerElement.contains(s.target) && !this.preventFromCloseInside && !this.preventFromCloseOutside ? this.hide() : !this.triggerElement.contains(s.target) && !this.contentElement.contains(s.target) && !this.preventFromCloseOutside ? this.hide() : !this.triggerElement.contains(s.target) && !this.contentElement.contains(s.target) && !this.preventFromCloseOutside ? this.hide() : !this.triggerElement.contains(s.target) && this.contentElement.contains(s.target) && !this.preventFromCloseInside && this.hide());
|
|
241
|
+
}), l(this, "handleKeyDown", (s) => {
|
|
242
|
+
s.preventDefault(), this.triggerStrategy !== "hover" && s.key === "Escape" && this.contentElement.getAttribute("data-state") === "open" && (this.preventFromCloseOutside || this.hide());
|
|
243
243
|
}), l(this, "toggleStateOnClick", () => {
|
|
244
244
|
(this.contentElement.dataset.state || "close") === "close" ? (this.show(), this.triggerStrategy === "hover" && this.addEventOnMouseEnter()) : this.hide();
|
|
245
245
|
}), l(this, "hideOnMouseLeaseTrigger", () => {
|
|
@@ -254,26 +254,26 @@
|
|
|
254
254
|
this.triggerElement.addEventListener("mouseleave", this.hideOnMouseLeaseTrigger), this.contentElement.addEventListener("mouseleave", this.hideOnMouseLeave);
|
|
255
255
|
}), l(this, "showOnMouseEnter", () => {
|
|
256
256
|
this.show(), this.addEventOnMouseEnter();
|
|
257
|
-
}), l(this, "setShowOptions", ({ placement:
|
|
257
|
+
}), l(this, "setShowOptions", ({ placement: s, offsetDistance: r }) => {
|
|
258
258
|
var h, d, c, m;
|
|
259
259
|
this.popper.setOptions({
|
|
260
|
-
placement:
|
|
260
|
+
placement: s,
|
|
261
261
|
offsetDistance: r
|
|
262
262
|
}), document.addEventListener("keydown", this.handleKeyDown), document.addEventListener("click", this.handleDocumentClick), (d = (h = this.options).beforeShow) == null || d.call(h), w({
|
|
263
263
|
state: "open",
|
|
264
264
|
popper: this.contentElement,
|
|
265
265
|
trigger: this.triggerElement
|
|
266
266
|
}), this.onToggleState(false), (m = (c = this.options).onShow) == null || m.call(c);
|
|
267
|
-
}), l(this, "setPopperOptions", ({ placement:
|
|
267
|
+
}), l(this, "setPopperOptions", ({ placement: s, offsetDistance: r }) => {
|
|
268
268
|
this.popper.setOptions({
|
|
269
|
-
placement:
|
|
269
|
+
placement: s,
|
|
270
270
|
offsetDistance: r || this.offsetDistance
|
|
271
271
|
});
|
|
272
|
-
}), l(this, "setPopperTrigger", (
|
|
272
|
+
}), l(this, "setPopperTrigger", (s, r) => {
|
|
273
273
|
this.cleanup(), this.popper.setOptions({
|
|
274
274
|
placement: r.placement || this.placement,
|
|
275
275
|
offsetDistance: r.offsetDistance || this.offsetDistance
|
|
276
|
-
}), this.triggerElement =
|
|
276
|
+
}), this.triggerElement = s, this.triggerElement.addEventListener("click", this.toggleStateOnClick), this.triggerStrategy === "hover" && this.triggerElement.addEventListener("mouseenter", this.showOnMouseEnter);
|
|
277
277
|
}), l(this, "cleanup", () => {
|
|
278
278
|
this.triggerElement.removeEventListener("click", this.toggleStateOnClick), this.triggerStrategy === "hover" && this.triggerElement.removeEventListener("mouseenter", this.showOnMouseEnter);
|
|
279
279
|
});
|
|
@@ -282,7 +282,7 @@
|
|
|
282
282
|
throw new Error("Trigger element must be a valid HTML element");
|
|
283
283
|
if (!(this.contentElement instanceof HTMLElement))
|
|
284
284
|
throw new Error("Content element must be a valid HTML element");
|
|
285
|
-
this.options =
|
|
285
|
+
this.options = i, this.triggerStrategy = this.options.triggerStrategy || "click", this.placement = this.options.placement || "bottom", this.offsetDistance = this.options.offsetDistance || 6, this.preventFromCloseOutside = this.options.preventFromCloseOutside || false, this.preventFromCloseInside = this.options.preventCloseFromInside || false, this.defaultState = this.options.defaultState || "close", this.eventEffect = (o = this.options.popper) == null ? void 0 : o.eventEffect, this.popper = new ne(
|
|
286
286
|
this.triggerElement,
|
|
287
287
|
this.contentElement,
|
|
288
288
|
{
|
|
@@ -293,35 +293,35 @@
|
|
|
293
293
|
), this.initInstance();
|
|
294
294
|
}
|
|
295
295
|
onToggleState(e) {
|
|
296
|
-
var t,
|
|
297
|
-
(
|
|
296
|
+
var t, i;
|
|
297
|
+
(i = (t = this.options).onToggle) == null || i.call(t, { isHidden: e });
|
|
298
298
|
}
|
|
299
299
|
/**
|
|
300
300
|
* Shows the overlay
|
|
301
301
|
* Positions the overlay, adds event listeners, and triggers related callbacks
|
|
302
302
|
*/
|
|
303
303
|
show() {
|
|
304
|
-
var e, t,
|
|
304
|
+
var e, t, i, o;
|
|
305
305
|
this.popper.updatePosition(), document.addEventListener("keydown", this.handleKeyDown), document.addEventListener("click", this.handleDocumentClick), (t = (e = this.options).beforeShow) == null || t.call(e), w({
|
|
306
306
|
state: "open",
|
|
307
307
|
popper: this.contentElement,
|
|
308
308
|
trigger: this.triggerElement
|
|
309
|
-
}), this.onToggleState(false), (o = (
|
|
309
|
+
}), this.onToggleState(false), (o = (i = this.options).onShow) == null || o.call(i);
|
|
310
310
|
}
|
|
311
311
|
/**
|
|
312
312
|
* Hides the overlay
|
|
313
313
|
* Removes event listeners and triggers related callbacks
|
|
314
314
|
*/
|
|
315
315
|
hide() {
|
|
316
|
-
var e, t,
|
|
316
|
+
var e, t, i;
|
|
317
317
|
let o = false;
|
|
318
318
|
le(this.contentElement, "before-hide", {
|
|
319
319
|
setExitAction: (r) => {
|
|
320
320
|
o = r;
|
|
321
321
|
}
|
|
322
322
|
});
|
|
323
|
-
const
|
|
324
|
-
o ||
|
|
323
|
+
const s = (i = (t = (e = this.options).beforeHide) == null ? void 0 : t.call(e)) == null ? void 0 : i.cancelAction;
|
|
324
|
+
o || s || (w({
|
|
325
325
|
state: "close",
|
|
326
326
|
popper: this.contentElement,
|
|
327
327
|
trigger: this.triggerElement
|
|
@@ -345,63 +345,77 @@
|
|
|
345
345
|
}), this.triggerElement.addEventListener("click", this.toggleStateOnClick), this.triggerStrategy === "hover" && this.triggerElement.addEventListener("mouseenter", this.showOnMouseEnter);
|
|
346
346
|
}
|
|
347
347
|
};
|
|
348
|
-
var A = (
|
|
349
|
-
var pe = (
|
|
350
|
-
var
|
|
351
|
-
const
|
|
352
|
-
|
|
348
|
+
var A = (n, e = document.body) => e.querySelector(n);
|
|
349
|
+
var pe = (n, e = document.body) => Array.from(e.querySelectorAll(n));
|
|
350
|
+
var H = (n, e, t) => {
|
|
351
|
+
const i = new CustomEvent(e, { detail: t });
|
|
352
|
+
n.dispatchEvent(i);
|
|
353
353
|
};
|
|
354
|
-
function ce(
|
|
355
|
-
|
|
354
|
+
function ce(n) {
|
|
355
|
+
const e = () => {
|
|
356
|
+
document.querySelector(
|
|
357
|
+
"[data-fx-component]:not([data-component-initialized])"
|
|
358
|
+
) ? requestAnimationFrame(e) : n();
|
|
359
|
+
};
|
|
360
|
+
e();
|
|
361
|
+
}
|
|
362
|
+
function de(n, e, t = "move") {
|
|
363
|
+
if (!(n instanceof HTMLElement))
|
|
356
364
|
throw new Error("Source element must be an HTMLElement");
|
|
357
365
|
if (!(e instanceof HTMLElement))
|
|
358
366
|
throw new Error("Target element must be an HTMLElement");
|
|
359
367
|
if (!["move", "detachable"].includes(t))
|
|
360
368
|
throw new Error(`Invalid teleport mode: ${t}. Must be "move" or "detachable".`);
|
|
361
|
-
let
|
|
362
|
-
const o =
|
|
363
|
-
return o ? o.insertBefore(
|
|
369
|
+
let i = document.createComment("teleporter-placeholder");
|
|
370
|
+
const o = n.parentNode;
|
|
371
|
+
return o ? o.insertBefore(i, n) : console.warn("Element has no parent; placeholder not inserted."), t === "move" ? (n.parentNode && e.appendChild(n), {
|
|
364
372
|
append() {
|
|
365
|
-
|
|
373
|
+
n.parentNode !== e && e.appendChild(n);
|
|
366
374
|
},
|
|
367
375
|
remove() {
|
|
368
|
-
|
|
376
|
+
i != null && i.parentNode && n.parentNode && i.parentNode.insertBefore(n, i);
|
|
369
377
|
},
|
|
370
378
|
restore() {
|
|
371
|
-
|
|
379
|
+
i != null && i.parentNode && n.parentNode !== o && i.parentNode.insertBefore(n, i);
|
|
372
380
|
}
|
|
373
|
-
}) : (
|
|
381
|
+
}) : (n.parentNode && e.appendChild(n), {
|
|
374
382
|
append() {
|
|
375
|
-
e.contains(
|
|
383
|
+
e.contains(n) || e.appendChild(n);
|
|
376
384
|
},
|
|
377
385
|
remove() {
|
|
378
|
-
|
|
386
|
+
n.parentNode && n.remove();
|
|
379
387
|
},
|
|
380
388
|
restore() {
|
|
381
|
-
|
|
389
|
+
i != null && i.parentNode && !n.parentNode && i.parentNode.insertBefore(n, i);
|
|
382
390
|
}
|
|
383
391
|
});
|
|
384
392
|
}
|
|
385
|
-
var
|
|
393
|
+
var b = class {
|
|
386
394
|
static initGlobalRegistry() {
|
|
387
395
|
window.$flexillaInstances || (window.$flexillaInstances = {});
|
|
388
396
|
}
|
|
389
|
-
static register(e, t,
|
|
390
|
-
return this.initGlobalRegistry(), window.$flexillaInstances[e] || (window.$flexillaInstances[e] = []), this.getInstance(e, t) || (window.$flexillaInstances[e].push({ element: t, instance:
|
|
397
|
+
static register(e, t, i) {
|
|
398
|
+
return this.initGlobalRegistry(), window.$flexillaInstances[e] || (window.$flexillaInstances[e] = []), this.getInstance(e, t) || (window.$flexillaInstances[e].push({ element: t, instance: i }), i);
|
|
391
399
|
}
|
|
392
400
|
static getInstance(e, t) {
|
|
393
|
-
var
|
|
394
|
-
return this.initGlobalRegistry(), (o = (
|
|
395
|
-
(
|
|
401
|
+
var i, o;
|
|
402
|
+
return this.initGlobalRegistry(), (o = (i = window.$flexillaInstances[e]) == null ? void 0 : i.find(
|
|
403
|
+
(s) => s.element === t
|
|
396
404
|
)) == null ? void 0 : o.instance;
|
|
397
405
|
}
|
|
398
406
|
static removeInstance(e, t) {
|
|
399
407
|
this.initGlobalRegistry(), window.$flexillaInstances[e] && (window.$flexillaInstances[e] = window.$flexillaInstances[e].filter(
|
|
400
|
-
(
|
|
408
|
+
(i) => i.element !== t
|
|
401
409
|
));
|
|
402
410
|
}
|
|
411
|
+
static setup(e) {
|
|
412
|
+
e.setAttribute("data-fx-component", "fx");
|
|
413
|
+
}
|
|
414
|
+
static initialized(e) {
|
|
415
|
+
e.setAttribute("data-component-initialized", "initialized");
|
|
416
|
+
}
|
|
403
417
|
};
|
|
404
|
-
var
|
|
418
|
+
var me = {
|
|
405
419
|
teleport: true,
|
|
406
420
|
teleportMode: "move"
|
|
407
421
|
};
|
|
@@ -435,7 +449,9 @@
|
|
|
435
449
|
a(this, "experimentalOptions");
|
|
436
450
|
a(this, "teleporter");
|
|
437
451
|
a(this, "moveElOnInit", () => {
|
|
438
|
-
this.experimentalOptions.teleport && (
|
|
452
|
+
this.experimentalOptions.teleport && ce(() => {
|
|
453
|
+
this.experimentalOptions.teleportMode === "detachable" ? this.teleporter.remove() : this.teleporter.append();
|
|
454
|
+
});
|
|
439
455
|
});
|
|
440
456
|
a(this, "moveEl", () => {
|
|
441
457
|
this.experimentalOptions.teleport && this.experimentalOptions.teleportMode === "detachable" && this.teleporter.remove();
|
|
@@ -448,13 +464,13 @@
|
|
|
448
464
|
});
|
|
449
465
|
a(this, "onHide", () => {
|
|
450
466
|
var e2, t2;
|
|
451
|
-
(t2 = (e2 = this.options).onHide) == null || t2.call(e2), this.moveEl(),
|
|
467
|
+
(t2 = (e2 = this.options).onHide) == null || t2.call(e2), this.moveEl(), H(this.contentElement, "popover-hide", {
|
|
452
468
|
isHidden: true
|
|
453
469
|
});
|
|
454
470
|
});
|
|
455
471
|
a(this, "onShow", () => {
|
|
456
472
|
var e2, t2;
|
|
457
|
-
(t2 = (e2 = this.options).onShow) == null || t2.call(e2),
|
|
473
|
+
(t2 = (e2 = this.options).onShow) == null || t2.call(e2), H(this.contentElement, "popover-show", {
|
|
458
474
|
isHidden: false
|
|
459
475
|
});
|
|
460
476
|
});
|
|
@@ -474,14 +490,14 @@
|
|
|
474
490
|
this.PopoverInstance.hide();
|
|
475
491
|
});
|
|
476
492
|
a(this, "cleanup", () => {
|
|
477
|
-
this.PopoverInstance.cleanup(),
|
|
493
|
+
this.PopoverInstance.cleanup(), b.removeInstance("popover", this.contentElement);
|
|
478
494
|
});
|
|
479
|
-
const
|
|
480
|
-
this.contentElement =
|
|
481
|
-
const o =
|
|
495
|
+
const i = typeof e == "string" ? A(e) : e;
|
|
496
|
+
this.contentElement = i;
|
|
497
|
+
const o = b.getInstance("popover", this.contentElement);
|
|
482
498
|
if (o)
|
|
483
499
|
return o;
|
|
484
|
-
this.triggerElement = A(`[data-popover-trigger][data-popover-id=${
|
|
500
|
+
b.setup(this.contentElement), this.triggerElement = A(`[data-popover-trigger][data-popover-id=${i.getAttribute("id")}]`), this.options = t, this.triggerStrategy = i.dataset.triggerStrategy ?? this.options.triggerStrategy ?? "click", this.placement = i.dataset.placement ?? this.options.placement ?? "bottom-middle", this.offsetDistance = parseInt(`${i.dataset.offsetDistance}`) ?? this.options.offsetDistance ?? 6, this.preventFromCloseOutside = i.hasAttribute("data-prevent-close-outside") ?? this.options.preventFromCloseOutside ?? false, this.preventFromCloseInside = i.hasAttribute("data-close-inside") ? false : this.options.preventCloseFromInside ?? true, this.defaultState = i.dataset.defaultState ?? this.options.defaultState ?? "close", this.experimentalOptions = Object.assign({}, me, t.experimental), this.teleporter = de(this.contentElement, document.body, this.experimentalOptions.teleportMode), this.PopoverInstance = new he({
|
|
485
501
|
trigger: this.triggerElement,
|
|
486
502
|
content: this.contentElement,
|
|
487
503
|
options: {
|
|
@@ -494,15 +510,15 @@
|
|
|
494
510
|
beforeShow: this.beforeShow,
|
|
495
511
|
onShow: this.onShow,
|
|
496
512
|
onHide: this.onHide,
|
|
497
|
-
onToggle: ({ isHidden:
|
|
513
|
+
onToggle: ({ isHidden: s }) => {
|
|
498
514
|
var r, h;
|
|
499
|
-
(h = (r = this.options).onToggle) == null || h.call(r, { isHidden:
|
|
500
|
-
isHidden:
|
|
515
|
+
(h = (r = this.options).onToggle) == null || h.call(r, { isHidden: s }), H(this.contentElement, "popover-toggle", {
|
|
516
|
+
isHidden: s
|
|
501
517
|
});
|
|
502
518
|
},
|
|
503
519
|
popper: this.options.popper
|
|
504
520
|
}
|
|
505
|
-
}), this.moveElOnInit(),
|
|
521
|
+
}), this.moveElOnInit(), b.register("popover", this.contentElement, this), b.initialized(this.contentElement);
|
|
506
522
|
}
|
|
507
523
|
/**
|
|
508
524
|
* Creates a new Popover instance with the specified options.
|
|
@@ -530,8 +546,8 @@
|
|
|
530
546
|
*/
|
|
531
547
|
static autoInit(e = "[data-fx-popover]") {
|
|
532
548
|
const t = pe(e);
|
|
533
|
-
for (const
|
|
534
|
-
new _P(
|
|
549
|
+
for (const i of t)
|
|
550
|
+
new _P(i);
|
|
535
551
|
}
|
|
536
552
|
};
|
|
537
553
|
|