@flexilla/alpine-offcanvas 0.1.1 → 0.1.2

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 (5) hide show
  1. package/dist/cdn.js +145 -110
  2. package/dist/cdn.min.js +1 -1
  3. package/dist/module.cjs.js +145 -110
  4. package/dist/module.esm.js +145 -110
  5. package/package.json +3 -3
package/dist/cdn.js CHANGED
@@ -1,113 +1,144 @@
1
1
  (() => {
2
2
  // ../../node_modules/@flexilla/offcanvas/dist/offcanvas.js
3
- var b = Object.defineProperty;
4
- var w = (s, t, e) => t in s ? b(s, t, { enumerable: true, configurable: true, writable: true, value: e }) : s[t] = e;
5
- var o = (s, t, e) => w(s, typeof t != "symbol" ? t + "" : t, e);
6
- var m = (s, t = document.body) => t.querySelector(s);
7
- var d = (s, t = document.body) => Array.from(t.querySelectorAll(s));
3
+ var w = Object.defineProperty;
4
+ var b = (t, e, n) => e in t ? w(t, e, { enumerable: true, configurable: true, writable: true, value: n }) : t[e] = n;
5
+ var o = (t, e, n) => b(t, typeof e != "symbol" ? e + "" : e, n);
6
+ var m = (t, e = document.body) => e.querySelector(t);
7
+ var d = (t, e = document.body) => Array.from(e.querySelectorAll(t));
8
8
  var y = ({
9
- newElement: s,
10
- existingElement: t
9
+ newElement: t,
10
+ existingElement: e
11
11
  }) => {
12
- if (!(s instanceof HTMLElement) || !(t instanceof HTMLElement))
12
+ if (!(t instanceof HTMLElement) || !(e instanceof HTMLElement))
13
13
  throw new Error("Both parameters must be valid HTML elements.");
14
- const e = t.parentElement;
15
- if (e)
16
- e.insertBefore(s, t);
14
+ const n = e.parentElement;
15
+ if (n)
16
+ n.insertBefore(t, e);
17
17
  else
18
18
  throw new Error("Existing element must have a parent element.");
19
19
  };
20
20
  var k = ({
21
- element: s,
22
- callback: t,
23
- type: e,
24
- keysCheck: n
21
+ element: t,
22
+ callback: e,
23
+ type: n,
24
+ keysCheck: s
25
25
  }) => {
26
- const a = getComputedStyle(s), i = a.transition;
27
- if (i !== "none" && i !== "" && !n.includes(i)) {
28
- const l = "transitionend", f = () => {
29
- s.removeEventListener(l, f), t();
26
+ const a = getComputedStyle(t), i = a.transition;
27
+ if (i !== "none" && i !== "" && !s.includes(i)) {
28
+ const l = "transitionend", r = () => {
29
+ t.removeEventListener(l, r), e();
30
30
  };
31
- s.addEventListener(l, f, { once: true });
31
+ t.addEventListener(l, r, { once: true });
32
32
  } else
33
- t();
33
+ e();
34
34
  };
35
35
  var O = ({
36
- element: s,
37
- callback: t
36
+ element: t,
37
+ callback: e
38
38
  }) => {
39
39
  k({
40
- element: s,
41
- callback: t,
40
+ element: t,
41
+ callback: e,
42
42
  type: "transition",
43
43
  keysCheck: ["all 0s ease 0s", "all"]
44
44
  });
45
45
  };
46
- var v = (s, t, e) => {
47
- const n = new CustomEvent(t, { detail: e });
48
- s.dispatchEvent(n);
46
+ var v = (t, e, n) => {
47
+ const s = new CustomEvent(e, { detail: n });
48
+ t.dispatchEvent(s);
49
49
  };
50
- var A = (s) => {
51
- var t;
52
- return (t = s.parentElement) == null ? void 0 : t.removeChild(s);
50
+ function B(t, e, n = "move") {
51
+ if (!(t instanceof HTMLElement))
52
+ throw new Error("Source element must be an HTMLElement");
53
+ if (!(e instanceof HTMLElement))
54
+ throw new Error("Target element must be an HTMLElement");
55
+ if (!["move", "detachable"].includes(n))
56
+ throw new Error(`Invalid teleport mode: ${n}. Must be "move" or "detachable".`);
57
+ let s = document.createComment("teleporter-placeholder");
58
+ const a = t.parentNode;
59
+ return a ? a.insertBefore(s, t) : console.warn("Element has no parent; placeholder not inserted."), n === "move" ? (t.parentNode && e.appendChild(t), {
60
+ append() {
61
+ t.parentNode !== e && e.appendChild(t);
62
+ },
63
+ remove() {
64
+ s != null && s.parentNode && t.parentNode && s.parentNode.insertBefore(t, s);
65
+ },
66
+ restore() {
67
+ s != null && s.parentNode && t.parentNode !== a && s.parentNode.insertBefore(t, s);
68
+ }
69
+ }) : (t.parentNode && e.appendChild(t), {
70
+ append() {
71
+ e.contains(t) || e.appendChild(t);
72
+ },
73
+ remove() {
74
+ t.parentNode && t.remove();
75
+ },
76
+ restore() {
77
+ s != null && s.parentNode && !t.parentNode && s.parentNode.insertBefore(t, s);
78
+ }
79
+ });
80
+ }
81
+ var A = (t) => {
82
+ var e;
83
+ return (e = t.parentElement) == null ? void 0 : e.removeChild(t);
53
84
  };
54
- var p = (s) => {
55
- s.setAttribute("data-state", "invisible"), O({
56
- element: s,
85
+ var C = (t) => {
86
+ t.setAttribute("data-state", "invisible"), O({
87
+ element: t,
57
88
  callback() {
58
- A(s);
89
+ A(t);
59
90
  }
60
91
  });
61
92
  };
62
- var B = (s, t) => {
63
- const e = s;
64
- if (e === "" || !e)
93
+ var L = (t, e) => {
94
+ const n = t;
95
+ if (n === "" || !n)
65
96
  return;
66
- const n = document.createElement("div");
67
- if (n.setAttribute("aria-hidden", "true"), n.setAttribute("data-state", "visible"), n.setAttribute("data-fx-offcanvas-overlay", ""), n.setAttribute("data-offcanvas-el", t), e === "")
97
+ const s = document.createElement("div");
98
+ if (s.setAttribute("aria-hidden", "true"), s.setAttribute("data-state", "visible"), s.setAttribute("data-fx-offcanvas-overlay", ""), s.setAttribute("data-offcanvas-el", e), n === "")
68
99
  return;
69
- const a = e.split(" ");
70
- return e !== "" && n.classList.add(...a), n;
100
+ const a = n.split(" ");
101
+ return n !== "" && s.classList.add(...a), s;
71
102
  };
72
- var C = (s, t, e) => {
73
- s.setAttribute("aria-hidden", e === "open" ? "false" : "true"), s.setAttribute("data-state", e), t || S(e);
103
+ var u = (t, e, n) => {
104
+ t.setAttribute("aria-hidden", n === "open" ? "false" : "true"), t.setAttribute("data-state", n), e || S(n);
74
105
  };
75
- var S = (s) => {
76
- document.body.style.overflow = s === "open" ? "hidden" : "", document.body.style.overflowY = s === "open" ? "hidden" : "auto";
106
+ var S = (t) => {
107
+ document.body.style.overflow = t === "open" ? "hidden" : "", document.body.style.overflowY = t === "open" ? "hidden" : "auto";
77
108
  };
78
- var x = (s, t) => {
79
- if (s === t)
109
+ var I = (t, e) => {
110
+ if (t === e)
80
111
  return;
81
- s.setAttribute("aria-hidden", "true"), s.setAttribute("data-state", "close");
82
- const e = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${s.getAttribute("id")}]`, s.parentElement);
83
- e instanceof HTMLElement && p(e);
112
+ t.setAttribute("aria-hidden", "true"), t.setAttribute("data-state", "close");
113
+ const n = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${t.getAttribute("id")}]`, t.parentElement);
114
+ n instanceof HTMLElement && C(n);
84
115
  };
85
- var I = (s) => {
86
- const t = d("[data-fx-offcanvas][data-state=open]");
87
- if (!(t.length <= 0))
88
- for (const e of t)
89
- x(e, s);
116
+ var x = (t) => {
117
+ const e = d("[data-fx-offcanvas][data-state=open]");
118
+ if (!(e.length <= 0))
119
+ for (const n of e)
120
+ I(n, t);
90
121
  };
91
122
  var h = class {
92
123
  static initGlobalRegistry() {
93
124
  window.$flexillaInstances || (window.$flexillaInstances = {});
94
125
  }
95
- static register(t, e, n) {
96
- return this.initGlobalRegistry(), window.$flexillaInstances[t] || (window.$flexillaInstances[t] = []), this.getInstance(t, e) || (window.$flexillaInstances[t].push({ element: e, instance: n }), n);
126
+ static register(e, n, s) {
127
+ return this.initGlobalRegistry(), window.$flexillaInstances[e] || (window.$flexillaInstances[e] = []), this.getInstance(e, n) || (window.$flexillaInstances[e].push({ element: n, instance: s }), s);
97
128
  }
98
- static getInstance(t, e) {
99
- var n, a;
100
- return this.initGlobalRegistry(), (a = (n = window.$flexillaInstances[t]) == null ? void 0 : n.find(
101
- (i) => i.element === e
129
+ static getInstance(e, n) {
130
+ var s, a;
131
+ return this.initGlobalRegistry(), (a = (s = window.$flexillaInstances[e]) == null ? void 0 : s.find(
132
+ (i) => i.element === n
102
133
  )) == null ? void 0 : a.instance;
103
134
  }
104
- static removeInstance(t, e) {
105
- this.initGlobalRegistry(), window.$flexillaInstances[t] && (window.$flexillaInstances[t] = window.$flexillaInstances[t].filter(
106
- (n) => n.element !== e
135
+ static removeInstance(e, n) {
136
+ this.initGlobalRegistry(), window.$flexillaInstances[e] && (window.$flexillaInstances[e] = window.$flexillaInstances[e].filter(
137
+ (s) => s.element !== n
107
138
  ));
108
139
  }
109
140
  };
110
- var c = class c2 {
141
+ var f = class f2 {
111
142
  /**
112
143
  * Creates an instance of Offcanvas.
113
144
  * @param offcanvas - The offcanvas element selector or HTMLElement
@@ -125,7 +156,7 @@
125
156
  * });
126
157
  * ```
127
158
  */
128
- constructor(t, e = {}) {
159
+ constructor(e, n = {}) {
129
160
  o(this, "offCanvasElement");
130
161
  o(this, "offCanvasTriggers");
131
162
  o(this, "offCanvasCloseBtns");
@@ -133,74 +164,78 @@
133
164
  o(this, "staticBackdrop");
134
165
  o(this, "backdrop");
135
166
  o(this, "options");
136
- o(this, "closeWhenClickOutSide", (t2) => {
137
- const e2 = this.offCanvasElement.getAttribute("data-state") === "open", n2 = !this.offCanvasElement.contains(t2.target) && ![...this.offCanvasTriggers].includes(t2.target);
138
- e2 && n2 && this.closeOffCanvas();
167
+ o(this, "teleporter");
168
+ o(this, "moveElOnInit", () => {
169
+ this.teleporter.append();
170
+ });
171
+ o(this, "closeWhenClickOutSide", (e2) => {
172
+ const n2 = this.offCanvasElement.getAttribute("data-state") === "open", s2 = !this.offCanvasElement.contains(e2.target) && ![...this.offCanvasTriggers].includes(e2.target);
173
+ n2 && s2 && this.closeOffCanvas();
139
174
  });
140
175
  o(this, "closeOffCanvas", () => {
141
- var i2, l2, f2, r2, u;
142
- let t2 = false;
176
+ var i2, l2, r2, c2, p;
177
+ let e2 = false;
143
178
  if (v(this.offCanvasElement, "offcanvas-before-hide", {
144
179
  offcanvasId: this.offCanvasElement.id,
145
180
  setExitAction: (g) => {
146
- t2 = g;
181
+ e2 = g;
147
182
  }
148
- }), ((f2 = (l2 = (i2 = this.options).beforeHide) == null ? void 0 : l2.call(i2)) == null ? void 0 : f2.cancelAction) || t2)
183
+ }), ((r2 = (l2 = (i2 = this.options).beforeHide) == null ? void 0 : l2.call(i2)) == null ? void 0 : r2.cancelAction) || e2)
149
184
  return;
150
- const n2 = this.offCanvasElement.getAttribute("id"), a2 = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${n2}]`);
151
- a2 instanceof HTMLElement && p(a2), C(
185
+ const s2 = this.offCanvasElement.getAttribute("id"), a2 = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${s2}]`);
186
+ a2 instanceof HTMLElement && C(a2), u(
152
187
  this.offCanvasElement,
153
188
  this.allowBodyScroll,
154
189
  "close"
155
- ), document.removeEventListener("keydown", this.closeWithEsc), !this.allowBodyScroll && !a2 && document.removeEventListener("click", this.closeWhenClickOutSide), (u = (r2 = this.options).onHide) == null || u.call(r2), v(this.offCanvasElement, "offcanvas-close", { offcanvasId: this.offCanvasElement.id });
190
+ ), document.removeEventListener("keydown", this.closeWithEsc), !this.allowBodyScroll && !a2 && document.removeEventListener("click", this.closeWhenClickOutSide), (p = (c2 = this.options).onHide) == null || p.call(c2), v(this.offCanvasElement, "offcanvas-close", { offcanvasId: this.offCanvasElement.id });
156
191
  });
157
- o(this, "closeWithEsc", (t2) => {
158
- t2.key === "Escape" && (t2.preventDefault(), this.closeOffCanvas());
192
+ o(this, "closeWithEsc", (e2) => {
193
+ e2.key === "Escape" && (e2.preventDefault(), this.closeOffCanvas());
159
194
  });
160
195
  o(this, "changeState", () => {
161
196
  this.offCanvasElement.getAttribute("data-state") === "open" ? this.closeOffCanvas() : this.openOffCanvas();
162
197
  });
163
- o(this, "setOptions", ({ allowBodyscroll: t2 }) => {
164
- t2 !== void 0 && (this.allowBodyScroll = t2);
198
+ o(this, "setOptions", ({ allowBodyscroll: e2 }) => {
199
+ e2 !== void 0 && (this.allowBodyScroll = e2);
165
200
  });
166
- const n = typeof t == "string" ? m(t) : t;
167
- if (!(n instanceof HTMLElement))
201
+ const s = typeof e == "string" ? m(e) : e;
202
+ if (!(s instanceof HTMLElement))
168
203
  throw new Error("Invalid Offcanvas, the provided Element is not a valid HTMLElement");
169
- const a = h.getInstance("offcanvas", n);
204
+ const a = h.getInstance("offcanvas", s);
170
205
  if (a)
171
206
  return a;
172
- this.options = e;
173
- const { staticBackdrop: i, allowBodyScroll: l, backdrop: f } = this.options;
174
- this.offCanvasElement = n, this.setupAttributes(), this.staticBackdrop = i || n.hasAttribute("data-static-backdrop") && n.dataset.staticBackdrop !== "false" || false, this.allowBodyScroll = l || n.hasAttribute("data-allow-body-scroll") && n.dataset.allowBodyScroll !== "false" || false;
175
- const r = this.offCanvasElement.getAttribute("id");
176
- this.offCanvasTriggers = this.findOffCanvasElements("[data-offcanvas-trigger]", false, r), this.offCanvasCloseBtns = this.findOffCanvasElements("[data-offcanvas-close]", true, r, this.offCanvasElement), this.backdrop = f || this.offCanvasElement.dataset.offcanvasBackdrop || "", this.setupOffcanvas(), h.register("offcanvas", this.offCanvasElement, this);
207
+ this.options = n;
208
+ const { staticBackdrop: i, allowBodyScroll: l, backdrop: r } = this.options;
209
+ this.offCanvasElement = s, this.setupAttributes(), this.staticBackdrop = i || s.hasAttribute("data-static-backdrop") && s.dataset.staticBackdrop !== "false" || false, this.allowBodyScroll = l || s.hasAttribute("data-allow-body-scroll") && s.dataset.allowBodyScroll !== "false" || false;
210
+ const c = this.offCanvasElement.getAttribute("id");
211
+ this.offCanvasTriggers = this.findOffCanvasElements("[data-offcanvas-trigger]", false, c), this.offCanvasCloseBtns = this.findOffCanvasElements("[data-offcanvas-close]", true, c, this.offCanvasElement), this.backdrop = r || this.offCanvasElement.dataset.offcanvasBackdrop || "", this.teleporter = B(this.offCanvasElement, document.body, "move"), this.setupOffcanvas(), this.moveElOnInit(), h.register("offcanvas", this.offCanvasElement, this);
177
212
  }
178
- findOffCanvasElements(t, e, n, a) {
179
- return e ? d(`${t}`, a) : d(`${t}[data-target=${n}]`);
213
+ findOffCanvasElements(e, n, s, a) {
214
+ return n ? d(`${e}`, a) : d(`${e}[data-target=${s}]`);
180
215
  }
181
216
  setupAttributes() {
182
217
  this.offCanvasElement.hasAttribute("data-fx-offcanvas") || this.offCanvasElement.setAttribute("data-fx-offcanvas", "");
183
218
  }
184
219
  openOffCanvas() {
185
- var n, a, i, l;
186
- (a = (n = this.options).beforeShow) == null || a.call(n), I(this.offCanvasElement), C(
220
+ var s, a, i, l;
221
+ (a = (s = this.options).beforeShow) == null || a.call(s), x(this.offCanvasElement), u(
187
222
  this.offCanvasElement,
188
223
  this.allowBodyScroll,
189
224
  "open"
190
225
  );
191
- const t = this.offCanvasElement.getAttribute("id"), e = B(
226
+ const e = this.offCanvasElement.getAttribute("id"), n = L(
192
227
  this.backdrop,
193
- t
228
+ e
194
229
  );
195
- e instanceof HTMLElement && (y({ newElement: e, existingElement: this.offCanvasElement }), this.staticBackdrop || e.addEventListener("click", this.closeOffCanvas)), document.addEventListener("keydown", this.closeWithEsc), (l = (i = this.options).onShow) == null || l.call(i), v(this.offCanvasElement, "offcanvas-open", { offcanvasId: this.offCanvasElement.id });
230
+ n instanceof HTMLElement && (y({ newElement: n, existingElement: this.offCanvasElement }), this.staticBackdrop || n.addEventListener("click", this.closeOffCanvas)), document.addEventListener("keydown", this.closeWithEsc), (l = (i = this.options).onShow) == null || l.call(i), v(this.offCanvasElement, "offcanvas-open", { offcanvasId: this.offCanvasElement.id });
196
231
  }
197
232
  initCloseBtns() {
198
- for (const t of this.offCanvasCloseBtns)
199
- t.addEventListener("click", this.closeOffCanvas);
233
+ for (const e of this.offCanvasCloseBtns)
234
+ e.addEventListener("click", this.closeOffCanvas);
200
235
  }
201
236
  initTriggers() {
202
- for (const t of this.offCanvasTriggers)
203
- t.addEventListener("click", this.changeState);
237
+ for (const e of this.offCanvasTriggers)
238
+ e.addEventListener("click", this.changeState);
204
239
  }
205
240
  setupOffcanvas() {
206
241
  this.initTriggers(), this.initCloseBtns();
@@ -242,17 +277,17 @@
242
277
  * ```
243
278
  */
244
279
  cleanup() {
245
- for (const t of this.offCanvasTriggers)
246
- t.removeEventListener("click", this.changeState);
247
- for (const t of this.offCanvasCloseBtns)
248
- t.removeEventListener("click", this.closeOffCanvas);
280
+ for (const e of this.offCanvasTriggers)
281
+ e.removeEventListener("click", this.changeState);
282
+ for (const e of this.offCanvasCloseBtns)
283
+ e.removeEventListener("click", this.closeOffCanvas);
249
284
  document.removeEventListener("keydown", this.closeWithEsc), this.allowBodyScroll || document.removeEventListener("click", this.closeWhenClickOutSide), h.removeInstance("offcanvas", this.offCanvasElement);
250
285
  }
251
286
  };
252
- o(c, "autoInit", (t = "[data-fx-offcanvas]") => {
253
- const e = d(t);
254
- for (const n of e)
255
- new c(n);
287
+ o(f, "autoInit", (e = "[data-fx-offcanvas]") => {
288
+ const n = d(e);
289
+ for (const s of n)
290
+ new f(s);
256
291
  }), /**
257
292
  * This is an alternative to using the constructor directly.
258
293
  * @param offcanvas - The offcanvas element selector or HTMLElement
@@ -267,8 +302,8 @@
267
302
  * });
268
303
  * ```
269
304
  */
270
- o(c, "init", (t, e = {}) => new c(t, e));
271
- var E = c;
305
+ o(f, "init", (e, n = {}) => new f(e, n));
306
+ var E = f;
272
307
 
273
308
  // src/index.js
274
309
  function Offcanvas(Alpine) {
package/dist/cdn.min.js CHANGED
@@ -1 +1 @@
1
- (()=>{var I=Object.defineProperty,A=(t,e,n)=>e in t?I(t,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[e]=n,o=(t,e,n)=>A(t,typeof e!="symbol"?e+"":e,n),C=(t,e=document.body)=>e.querySelector(t),m=(t,e=document.body)=>Array.from(e.querySelectorAll(t)),S=({newElement:t,existingElement:e})=>{if(!(t instanceof HTMLElement)||!(e instanceof HTMLElement))throw new Error("Both parameters must be valid HTML elements.");let n=e.parentElement;if(n)n.insertBefore(t,e);else throw new Error("Existing element must have a parent element.")},$=({element:t,callback:e,type:n,keysCheck:s})=>{let a=getComputedStyle(t),i=a.transition;if(i!=="none"&&i!==""&&!s.includes(i)){let l="transitionend",d=()=>{t.removeEventListener(l,d),e()};t.addEventListener(l,d,{once:!0})}else e()},T=({element:t,callback:e})=>{$({element:t,callback:e,type:"transition",keysCheck:["all 0s ease 0s","all"]})},E=(t,e,n)=>{let s=new CustomEvent(e,{detail:n});t.dispatchEvent(s)},H=t=>{var e;return(e=t.parentElement)==null?void 0:e.removeChild(t)},k=t=>{t.setAttribute("data-state","invisible"),T({element:t,callback(){H(t)}})},M=(t,e)=>{let n=t;if(n===""||!n)return;let s=document.createElement("div");if(s.setAttribute("aria-hidden","true"),s.setAttribute("data-state","visible"),s.setAttribute("data-fx-offcanvas-overlay",""),s.setAttribute("data-offcanvas-el",e),n==="")return;let a=n.split(" ");return n!==""&&s.classList.add(...a),s},y=(t,e,n)=>{t.setAttribute("aria-hidden",n==="open"?"false":"true"),t.setAttribute("data-state",n),e||W(n)},W=t=>{document.body.style.overflow=t==="open"?"hidden":"",document.body.style.overflowY=t==="open"?"hidden":"auto"},G=(t,e)=>{if(t===e)return;t.setAttribute("aria-hidden","true"),t.setAttribute("data-state","close");let n=C(`[data-fx-offcanvas-overlay][data-offcanvas-el=${t.getAttribute("id")}]`,t.parentElement);n instanceof HTMLElement&&k(n)},R=t=>{let e=m("[data-fx-offcanvas][data-state=open]");if(!(e.length<=0))for(let n of e)G(n,t)},c=class{static initGlobalRegistry(){window.$flexillaInstances||(window.$flexillaInstances={})}static register(e,n,s){return this.initGlobalRegistry(),window.$flexillaInstances[e]||(window.$flexillaInstances[e]=[]),this.getInstance(e,n)||(window.$flexillaInstances[e].push({element:n,instance:s}),s)}static getInstance(e,n){var s,a;return this.initGlobalRegistry(),(a=(s=window.$flexillaInstances[e])==null?void 0:s.find(i=>i.element===n))==null?void 0:a.instance}static removeInstance(e,n){this.initGlobalRegistry(),window.$flexillaInstances[e]&&(window.$flexillaInstances[e]=window.$flexillaInstances[e].filter(s=>s.element!==n))}},r=class{constructor(e,n={}){o(this,"offCanvasElement"),o(this,"offCanvasTriggers"),o(this,"offCanvasCloseBtns"),o(this,"allowBodyScroll"),o(this,"staticBackdrop"),o(this,"backdrop"),o(this,"options"),o(this,"closeWhenClickOutSide",f=>{let v=this.offCanvasElement.getAttribute("data-state")==="open",h=!this.offCanvasElement.contains(f.target)&&![...this.offCanvasTriggers].includes(f.target);v&&h&&this.closeOffCanvas()}),o(this,"closeOffCanvas",()=>{var f,v,h,b,w;let g=!1;if(E(this.offCanvasElement,"offcanvas-before-hide",{offcanvasId:this.offCanvasElement.id,setExitAction:x=>{g=x}}),((h=(v=(f=this.options).beforeHide)==null?void 0:v.call(f))==null?void 0:h.cancelAction)||g)return;let B=this.offCanvasElement.getAttribute("id"),u=C(`[data-fx-offcanvas-overlay][data-offcanvas-el=${B}]`);u instanceof HTMLElement&&k(u),y(this.offCanvasElement,this.allowBodyScroll,"close"),document.removeEventListener("keydown",this.closeWithEsc),!this.allowBodyScroll&&!u&&document.removeEventListener("click",this.closeWhenClickOutSide),(w=(b=this.options).onHide)==null||w.call(b),E(this.offCanvasElement,"offcanvas-close",{offcanvasId:this.offCanvasElement.id})}),o(this,"closeWithEsc",f=>{f.key==="Escape"&&(f.preventDefault(),this.closeOffCanvas())}),o(this,"changeState",()=>{this.offCanvasElement.getAttribute("data-state")==="open"?this.closeOffCanvas():this.openOffCanvas()}),o(this,"setOptions",({allowBodyscroll:f})=>{f!==void 0&&(this.allowBodyScroll=f)});let s=typeof e=="string"?C(e):e;if(!(s instanceof HTMLElement))throw new Error("Invalid Offcanvas, the provided Element is not a valid HTMLElement");let a=c.getInstance("offcanvas",s);if(a)return a;this.options=n;let{staticBackdrop:i,allowBodyScroll:l,backdrop:d}=this.options;this.offCanvasElement=s,this.setupAttributes(),this.staticBackdrop=i||s.hasAttribute("data-static-backdrop")&&s.dataset.staticBackdrop!=="false"||!1,this.allowBodyScroll=l||s.hasAttribute("data-allow-body-scroll")&&s.dataset.allowBodyScroll!=="false"||!1;let p=this.offCanvasElement.getAttribute("id");this.offCanvasTriggers=this.findOffCanvasElements("[data-offcanvas-trigger]",!1,p),this.offCanvasCloseBtns=this.findOffCanvasElements("[data-offcanvas-close]",!0,p,this.offCanvasElement),this.backdrop=d||this.offCanvasElement.dataset.offcanvasBackdrop||"",this.setupOffcanvas(),c.register("offcanvas",this.offCanvasElement,this)}findOffCanvasElements(e,n,s,a){return n?m(`${e}`,a):m(`${e}[data-target=${s}]`)}setupAttributes(){this.offCanvasElement.hasAttribute("data-fx-offcanvas")||this.offCanvasElement.setAttribute("data-fx-offcanvas","")}openOffCanvas(){var e,n,s,a;(n=(e=this.options).beforeShow)==null||n.call(e),R(this.offCanvasElement),y(this.offCanvasElement,this.allowBodyScroll,"open");let i=this.offCanvasElement.getAttribute("id"),l=M(this.backdrop,i);l instanceof HTMLElement&&(S({newElement:l,existingElement:this.offCanvasElement}),this.staticBackdrop||l.addEventListener("click",this.closeOffCanvas)),document.addEventListener("keydown",this.closeWithEsc),(a=(s=this.options).onShow)==null||a.call(s),E(this.offCanvasElement,"offcanvas-open",{offcanvasId:this.offCanvasElement.id})}initCloseBtns(){for(let e of this.offCanvasCloseBtns)e.addEventListener("click",this.closeOffCanvas)}initTriggers(){for(let e of this.offCanvasTriggers)e.addEventListener("click",this.changeState)}setupOffcanvas(){this.initTriggers(),this.initCloseBtns()}open(){this.openOffCanvas()}close(){this.closeOffCanvas()}cleanup(){for(let e of this.offCanvasTriggers)e.removeEventListener("click",this.changeState);for(let e of this.offCanvasCloseBtns)e.removeEventListener("click",this.closeOffCanvas);document.removeEventListener("keydown",this.closeWithEsc),this.allowBodyScroll||document.removeEventListener("click",this.closeWhenClickOutSide),c.removeInstance("offcanvas",this.offCanvasElement)}};o(r,"autoInit",(t="[data-fx-offcanvas]")=>{let e=m(t);for(let n of e)new r(n)}),o(r,"init",(t,e={})=>new r(t,e));var O=r;function q(t){t.directive("offcanvas",(e,{},{cleanup:n})=>{let s=e.getAttribute("id");if(!s){console.error("\u274C id is required but missing on element:",e);return}let a=new O(e);t.store("sheets")||t.store("sheets",{}),t.store("sheets")[s]=a;let i=()=>a.open(),l=()=>a.close();document.addEventListener(`sheet:${s}:open`,i),document.addEventListener(`sheet:${s}:close`,l),n(()=>{document.removeEventListener(`sheet:${s}:open`,i),document.removeEventListener(`sheet:${s}:close`,l),a.cleanup(),delete t.store("sheets")[s]})}),t.magic("offcanvas",e=>n=>t.store("sheets")?t.store("sheets")[n]?t.store("sheets")[n]:(console.warn(`\u26A0\uFE0F No offcanvas instance found for ID: ${n}`),null):(console.warn("\u26A0\uFE0F Alpine store for Offcanvas is not initialized."),null))}var L=q;document.addEventListener("alpine:init",()=>{L(window.Alpine)});})();
1
+ (()=>{var x=Object.defineProperty,S=(t,e,s)=>e in t?x(t,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[e]=s,o=(t,e,s)=>S(t,typeof e!="symbol"?e+"":e,s),E=(t,e=document.body)=>e.querySelector(t),m=(t,e=document.body)=>Array.from(e.querySelectorAll(t)),A=({newElement:t,existingElement:e})=>{if(!(t instanceof HTMLElement)||!(e instanceof HTMLElement))throw new Error("Both parameters must be valid HTML elements.");let s=e.parentElement;if(s)s.insertBefore(t,e);else throw new Error("Existing element must have a parent element.")},T=({element:t,callback:e,type:s,keysCheck:n})=>{let a=getComputedStyle(t),i=a.transition;if(i!=="none"&&i!==""&&!n.includes(i)){let l="transitionend",d=()=>{t.removeEventListener(l,d),e()};t.addEventListener(l,d,{once:!0})}else e()},$=({element:t,callback:e})=>{T({element:t,callback:e,type:"transition",keysCheck:["all 0s ease 0s","all"]})},p=(t,e,s)=>{let n=new CustomEvent(e,{detail:s});t.dispatchEvent(n)};function H(t,e,s="move"){if(!(t instanceof HTMLElement))throw new Error("Source element must be an HTMLElement");if(!(e instanceof HTMLElement))throw new Error("Target element must be an HTMLElement");if(!["move","detachable"].includes(s))throw new Error(`Invalid teleport mode: ${s}. Must be "move" or "detachable".`);let n=document.createComment("teleporter-placeholder"),a=t.parentNode;return a?a.insertBefore(n,t):console.warn("Element has no parent; placeholder not inserted."),s==="move"?(t.parentNode&&e.appendChild(t),{append(){t.parentNode!==e&&e.appendChild(t)},remove(){n!=null&&n.parentNode&&t.parentNode&&n.parentNode.insertBefore(t,n)},restore(){n!=null&&n.parentNode&&t.parentNode!==a&&n.parentNode.insertBefore(t,n)}}):(t.parentNode&&e.appendChild(t),{append(){e.contains(t)||e.appendChild(t)},remove(){t.parentNode&&t.remove()},restore(){n!=null&&n.parentNode&&!t.parentNode&&n.parentNode.insertBefore(t,n)}})}var N=t=>{var e;return(e=t.parentElement)==null?void 0:e.removeChild(t)},k=t=>{t.setAttribute("data-state","invisible"),$({element:t,callback(){N(t)}})},M=(t,e)=>{let s=t;if(s===""||!s)return;let n=document.createElement("div");if(n.setAttribute("aria-hidden","true"),n.setAttribute("data-state","visible"),n.setAttribute("data-fx-offcanvas-overlay",""),n.setAttribute("data-offcanvas-el",e),s==="")return;let a=s.split(" ");return s!==""&&n.classList.add(...a),n},y=(t,e,s)=>{t.setAttribute("aria-hidden",s==="open"?"false":"true"),t.setAttribute("data-state",s),e||W(s)},W=t=>{document.body.style.overflow=t==="open"?"hidden":"",document.body.style.overflowY=t==="open"?"hidden":"auto"},G=(t,e)=>{if(t===e)return;t.setAttribute("aria-hidden","true"),t.setAttribute("data-state","close");let s=E(`[data-fx-offcanvas-overlay][data-offcanvas-el=${t.getAttribute("id")}]`,t.parentElement);s instanceof HTMLElement&&k(s)},R=t=>{let e=m("[data-fx-offcanvas][data-state=open]");if(!(e.length<=0))for(let s of e)G(s,t)},c=class{static initGlobalRegistry(){window.$flexillaInstances||(window.$flexillaInstances={})}static register(e,s,n){return this.initGlobalRegistry(),window.$flexillaInstances[e]||(window.$flexillaInstances[e]=[]),this.getInstance(e,s)||(window.$flexillaInstances[e].push({element:s,instance:n}),n)}static getInstance(e,s){var n,a;return this.initGlobalRegistry(),(a=(n=window.$flexillaInstances[e])==null?void 0:n.find(i=>i.element===s))==null?void 0:a.instance}static removeInstance(e,s){this.initGlobalRegistry(),window.$flexillaInstances[e]&&(window.$flexillaInstances[e]=window.$flexillaInstances[e].filter(n=>n.element!==s))}},f=class{constructor(e,s={}){o(this,"offCanvasElement"),o(this,"offCanvasTriggers"),o(this,"offCanvasCloseBtns"),o(this,"allowBodyScroll"),o(this,"staticBackdrop"),o(this,"backdrop"),o(this,"options"),o(this,"teleporter"),o(this,"moveElOnInit",()=>{this.teleporter.append()}),o(this,"closeWhenClickOutSide",r=>{let v=this.offCanvasElement.getAttribute("data-state")==="open",h=!this.offCanvasElement.contains(r.target)&&![...this.offCanvasTriggers].includes(r.target);v&&h&&this.closeOffCanvas()}),o(this,"closeOffCanvas",()=>{var r,v,h,w,b;let g=!1;if(p(this.offCanvasElement,"offcanvas-before-hide",{offcanvasId:this.offCanvasElement.id,setExitAction:I=>{g=I}}),((h=(v=(r=this.options).beforeHide)==null?void 0:v.call(r))==null?void 0:h.cancelAction)||g)return;let B=this.offCanvasElement.getAttribute("id"),u=E(`[data-fx-offcanvas-overlay][data-offcanvas-el=${B}]`);u instanceof HTMLElement&&k(u),y(this.offCanvasElement,this.allowBodyScroll,"close"),document.removeEventListener("keydown",this.closeWithEsc),!this.allowBodyScroll&&!u&&document.removeEventListener("click",this.closeWhenClickOutSide),(b=(w=this.options).onHide)==null||b.call(w),p(this.offCanvasElement,"offcanvas-close",{offcanvasId:this.offCanvasElement.id})}),o(this,"closeWithEsc",r=>{r.key==="Escape"&&(r.preventDefault(),this.closeOffCanvas())}),o(this,"changeState",()=>{this.offCanvasElement.getAttribute("data-state")==="open"?this.closeOffCanvas():this.openOffCanvas()}),o(this,"setOptions",({allowBodyscroll:r})=>{r!==void 0&&(this.allowBodyScroll=r)});let n=typeof e=="string"?E(e):e;if(!(n instanceof HTMLElement))throw new Error("Invalid Offcanvas, the provided Element is not a valid HTMLElement");let a=c.getInstance("offcanvas",n);if(a)return a;this.options=s;let{staticBackdrop:i,allowBodyScroll:l,backdrop:d}=this.options;this.offCanvasElement=n,this.setupAttributes(),this.staticBackdrop=i||n.hasAttribute("data-static-backdrop")&&n.dataset.staticBackdrop!=="false"||!1,this.allowBodyScroll=l||n.hasAttribute("data-allow-body-scroll")&&n.dataset.allowBodyScroll!=="false"||!1;let C=this.offCanvasElement.getAttribute("id");this.offCanvasTriggers=this.findOffCanvasElements("[data-offcanvas-trigger]",!1,C),this.offCanvasCloseBtns=this.findOffCanvasElements("[data-offcanvas-close]",!0,C,this.offCanvasElement),this.backdrop=d||this.offCanvasElement.dataset.offcanvasBackdrop||"",this.teleporter=H(this.offCanvasElement,document.body,"move"),this.setupOffcanvas(),this.moveElOnInit(),c.register("offcanvas",this.offCanvasElement,this)}findOffCanvasElements(e,s,n,a){return s?m(`${e}`,a):m(`${e}[data-target=${n}]`)}setupAttributes(){this.offCanvasElement.hasAttribute("data-fx-offcanvas")||this.offCanvasElement.setAttribute("data-fx-offcanvas","")}openOffCanvas(){var e,s,n,a;(s=(e=this.options).beforeShow)==null||s.call(e),R(this.offCanvasElement),y(this.offCanvasElement,this.allowBodyScroll,"open");let i=this.offCanvasElement.getAttribute("id"),l=M(this.backdrop,i);l instanceof HTMLElement&&(A({newElement:l,existingElement:this.offCanvasElement}),this.staticBackdrop||l.addEventListener("click",this.closeOffCanvas)),document.addEventListener("keydown",this.closeWithEsc),(a=(n=this.options).onShow)==null||a.call(n),p(this.offCanvasElement,"offcanvas-open",{offcanvasId:this.offCanvasElement.id})}initCloseBtns(){for(let e of this.offCanvasCloseBtns)e.addEventListener("click",this.closeOffCanvas)}initTriggers(){for(let e of this.offCanvasTriggers)e.addEventListener("click",this.changeState)}setupOffcanvas(){this.initTriggers(),this.initCloseBtns()}open(){this.openOffCanvas()}close(){this.closeOffCanvas()}cleanup(){for(let e of this.offCanvasTriggers)e.removeEventListener("click",this.changeState);for(let e of this.offCanvasCloseBtns)e.removeEventListener("click",this.closeOffCanvas);document.removeEventListener("keydown",this.closeWithEsc),this.allowBodyScroll||document.removeEventListener("click",this.closeWhenClickOutSide),c.removeInstance("offcanvas",this.offCanvasElement)}};o(f,"autoInit",(t="[data-fx-offcanvas]")=>{let e=m(t);for(let s of e)new f(s)}),o(f,"init",(t,e={})=>new f(t,e));var L=f;function q(t){t.directive("offcanvas",(e,{},{cleanup:s})=>{let n=e.getAttribute("id");if(!n){console.error("\u274C id is required but missing on element:",e);return}let a=new L(e);t.store("sheets")||t.store("sheets",{}),t.store("sheets")[n]=a;let i=()=>a.open(),l=()=>a.close();document.addEventListener(`sheet:${n}:open`,i),document.addEventListener(`sheet:${n}:close`,l),s(()=>{document.removeEventListener(`sheet:${n}:open`,i),document.removeEventListener(`sheet:${n}:close`,l),a.cleanup(),delete t.store("sheets")[n]})}),t.magic("offcanvas",e=>s=>t.store("sheets")?t.store("sheets")[s]?t.store("sheets")[s]:(console.warn(`\u26A0\uFE0F No offcanvas instance found for ID: ${s}`),null):(console.warn("\u26A0\uFE0F Alpine store for Offcanvas is not initialized."),null))}var O=q;document.addEventListener("alpine:init",()=>{O(window.Alpine)});})();
package/dist/module.cjs.js CHANGED
@@ -24,114 +24,145 @@ __export(module_exports, {
24
24
  module.exports = __toCommonJS(module_exports);
25
25
 
26
26
  // ../../node_modules/@flexilla/offcanvas/dist/offcanvas.js
27
- var b = Object.defineProperty;
28
- var w = (s, t, e) => t in s ? b(s, t, { enumerable: true, configurable: true, writable: true, value: e }) : s[t] = e;
29
- var o = (s, t, e) => w(s, typeof t != "symbol" ? t + "" : t, e);
30
- var m = (s, t = document.body) => t.querySelector(s);
31
- var d = (s, t = document.body) => Array.from(t.querySelectorAll(s));
27
+ var w = Object.defineProperty;
28
+ var b = (t, e, n) => e in t ? w(t, e, { enumerable: true, configurable: true, writable: true, value: n }) : t[e] = n;
29
+ var o = (t, e, n) => b(t, typeof e != "symbol" ? e + "" : e, n);
30
+ var m = (t, e = document.body) => e.querySelector(t);
31
+ var d = (t, e = document.body) => Array.from(e.querySelectorAll(t));
32
32
  var y = ({
33
- newElement: s,
34
- existingElement: t
33
+ newElement: t,
34
+ existingElement: e
35
35
  }) => {
36
- if (!(s instanceof HTMLElement) || !(t instanceof HTMLElement))
36
+ if (!(t instanceof HTMLElement) || !(e instanceof HTMLElement))
37
37
  throw new Error("Both parameters must be valid HTML elements.");
38
- const e = t.parentElement;
39
- if (e)
40
- e.insertBefore(s, t);
38
+ const n = e.parentElement;
39
+ if (n)
40
+ n.insertBefore(t, e);
41
41
  else
42
42
  throw new Error("Existing element must have a parent element.");
43
43
  };
44
44
  var k = ({
45
- element: s,
46
- callback: t,
47
- type: e,
48
- keysCheck: n
45
+ element: t,
46
+ callback: e,
47
+ type: n,
48
+ keysCheck: s
49
49
  }) => {
50
- const a = getComputedStyle(s), i = a.transition;
51
- if (i !== "none" && i !== "" && !n.includes(i)) {
52
- const l = "transitionend", f = () => {
53
- s.removeEventListener(l, f), t();
50
+ const a = getComputedStyle(t), i = a.transition;
51
+ if (i !== "none" && i !== "" && !s.includes(i)) {
52
+ const l = "transitionend", r = () => {
53
+ t.removeEventListener(l, r), e();
54
54
  };
55
- s.addEventListener(l, f, { once: true });
55
+ t.addEventListener(l, r, { once: true });
56
56
  } else
57
- t();
57
+ e();
58
58
  };
59
59
  var O = ({
60
- element: s,
61
- callback: t
60
+ element: t,
61
+ callback: e
62
62
  }) => {
63
63
  k({
64
- element: s,
65
- callback: t,
64
+ element: t,
65
+ callback: e,
66
66
  type: "transition",
67
67
  keysCheck: ["all 0s ease 0s", "all"]
68
68
  });
69
69
  };
70
- var v = (s, t, e) => {
71
- const n = new CustomEvent(t, { detail: e });
72
- s.dispatchEvent(n);
70
+ var v = (t, e, n) => {
71
+ const s = new CustomEvent(e, { detail: n });
72
+ t.dispatchEvent(s);
73
73
  };
74
- var A = (s) => {
75
- var t;
76
- return (t = s.parentElement) == null ? void 0 : t.removeChild(s);
74
+ function B(t, e, n = "move") {
75
+ if (!(t instanceof HTMLElement))
76
+ throw new Error("Source element must be an HTMLElement");
77
+ if (!(e instanceof HTMLElement))
78
+ throw new Error("Target element must be an HTMLElement");
79
+ if (!["move", "detachable"].includes(n))
80
+ throw new Error(`Invalid teleport mode: ${n}. Must be "move" or "detachable".`);
81
+ let s = document.createComment("teleporter-placeholder");
82
+ const a = t.parentNode;
83
+ return a ? a.insertBefore(s, t) : console.warn("Element has no parent; placeholder not inserted."), n === "move" ? (t.parentNode && e.appendChild(t), {
84
+ append() {
85
+ t.parentNode !== e && e.appendChild(t);
86
+ },
87
+ remove() {
88
+ s != null && s.parentNode && t.parentNode && s.parentNode.insertBefore(t, s);
89
+ },
90
+ restore() {
91
+ s != null && s.parentNode && t.parentNode !== a && s.parentNode.insertBefore(t, s);
92
+ }
93
+ }) : (t.parentNode && e.appendChild(t), {
94
+ append() {
95
+ e.contains(t) || e.appendChild(t);
96
+ },
97
+ remove() {
98
+ t.parentNode && t.remove();
99
+ },
100
+ restore() {
101
+ s != null && s.parentNode && !t.parentNode && s.parentNode.insertBefore(t, s);
102
+ }
103
+ });
104
+ }
105
+ var A = (t) => {
106
+ var e;
107
+ return (e = t.parentElement) == null ? void 0 : e.removeChild(t);
77
108
  };
78
- var p = (s) => {
79
- s.setAttribute("data-state", "invisible"), O({
80
- element: s,
109
+ var C = (t) => {
110
+ t.setAttribute("data-state", "invisible"), O({
111
+ element: t,
81
112
  callback() {
82
- A(s);
113
+ A(t);
83
114
  }
84
115
  });
85
116
  };
86
- var B = (s, t) => {
87
- const e = s;
88
- if (e === "" || !e)
117
+ var L = (t, e) => {
118
+ const n = t;
119
+ if (n === "" || !n)
89
120
  return;
90
- const n = document.createElement("div");
91
- if (n.setAttribute("aria-hidden", "true"), n.setAttribute("data-state", "visible"), n.setAttribute("data-fx-offcanvas-overlay", ""), n.setAttribute("data-offcanvas-el", t), e === "")
121
+ const s = document.createElement("div");
122
+ if (s.setAttribute("aria-hidden", "true"), s.setAttribute("data-state", "visible"), s.setAttribute("data-fx-offcanvas-overlay", ""), s.setAttribute("data-offcanvas-el", e), n === "")
92
123
  return;
93
- const a = e.split(" ");
94
- return e !== "" && n.classList.add(...a), n;
124
+ const a = n.split(" ");
125
+ return n !== "" && s.classList.add(...a), s;
95
126
  };
96
- var C = (s, t, e) => {
97
- s.setAttribute("aria-hidden", e === "open" ? "false" : "true"), s.setAttribute("data-state", e), t || S(e);
127
+ var u = (t, e, n) => {
128
+ t.setAttribute("aria-hidden", n === "open" ? "false" : "true"), t.setAttribute("data-state", n), e || S(n);
98
129
  };
99
- var S = (s) => {
100
- document.body.style.overflow = s === "open" ? "hidden" : "", document.body.style.overflowY = s === "open" ? "hidden" : "auto";
130
+ var S = (t) => {
131
+ document.body.style.overflow = t === "open" ? "hidden" : "", document.body.style.overflowY = t === "open" ? "hidden" : "auto";
101
132
  };
102
- var x = (s, t) => {
103
- if (s === t)
133
+ var I = (t, e) => {
134
+ if (t === e)
104
135
  return;
105
- s.setAttribute("aria-hidden", "true"), s.setAttribute("data-state", "close");
106
- const e = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${s.getAttribute("id")}]`, s.parentElement);
107
- e instanceof HTMLElement && p(e);
136
+ t.setAttribute("aria-hidden", "true"), t.setAttribute("data-state", "close");
137
+ const n = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${t.getAttribute("id")}]`, t.parentElement);
138
+ n instanceof HTMLElement && C(n);
108
139
  };
109
- var I = (s) => {
110
- const t = d("[data-fx-offcanvas][data-state=open]");
111
- if (!(t.length <= 0))
112
- for (const e of t)
113
- x(e, s);
140
+ var x = (t) => {
141
+ const e = d("[data-fx-offcanvas][data-state=open]");
142
+ if (!(e.length <= 0))
143
+ for (const n of e)
144
+ I(n, t);
114
145
  };
115
146
  var h = class {
116
147
  static initGlobalRegistry() {
117
148
  window.$flexillaInstances || (window.$flexillaInstances = {});
118
149
  }
119
- static register(t, e, n) {
120
- return this.initGlobalRegistry(), window.$flexillaInstances[t] || (window.$flexillaInstances[t] = []), this.getInstance(t, e) || (window.$flexillaInstances[t].push({ element: e, instance: n }), n);
150
+ static register(e, n, s) {
151
+ return this.initGlobalRegistry(), window.$flexillaInstances[e] || (window.$flexillaInstances[e] = []), this.getInstance(e, n) || (window.$flexillaInstances[e].push({ element: n, instance: s }), s);
121
152
  }
122
- static getInstance(t, e) {
123
- var n, a;
124
- return this.initGlobalRegistry(), (a = (n = window.$flexillaInstances[t]) == null ? void 0 : n.find(
125
- (i) => i.element === e
153
+ static getInstance(e, n) {
154
+ var s, a;
155
+ return this.initGlobalRegistry(), (a = (s = window.$flexillaInstances[e]) == null ? void 0 : s.find(
156
+ (i) => i.element === n
126
157
  )) == null ? void 0 : a.instance;
127
158
  }
128
- static removeInstance(t, e) {
129
- this.initGlobalRegistry(), window.$flexillaInstances[t] && (window.$flexillaInstances[t] = window.$flexillaInstances[t].filter(
130
- (n) => n.element !== e
159
+ static removeInstance(e, n) {
160
+ this.initGlobalRegistry(), window.$flexillaInstances[e] && (window.$flexillaInstances[e] = window.$flexillaInstances[e].filter(
161
+ (s) => s.element !== n
131
162
  ));
132
163
  }
133
164
  };
134
- var c = class c2 {
165
+ var f = class f2 {
135
166
  /**
136
167
  * Creates an instance of Offcanvas.
137
168
  * @param offcanvas - The offcanvas element selector or HTMLElement
@@ -149,7 +180,7 @@ var c = class c2 {
149
180
  * });
150
181
  * ```
151
182
  */
152
- constructor(t, e = {}) {
183
+ constructor(e, n = {}) {
153
184
  o(this, "offCanvasElement");
154
185
  o(this, "offCanvasTriggers");
155
186
  o(this, "offCanvasCloseBtns");
@@ -157,74 +188,78 @@ var c = class c2 {
157
188
  o(this, "staticBackdrop");
158
189
  o(this, "backdrop");
159
190
  o(this, "options");
160
- o(this, "closeWhenClickOutSide", (t2) => {
161
- const e2 = this.offCanvasElement.getAttribute("data-state") === "open", n2 = !this.offCanvasElement.contains(t2.target) && ![...this.offCanvasTriggers].includes(t2.target);
162
- e2 && n2 && this.closeOffCanvas();
191
+ o(this, "teleporter");
192
+ o(this, "moveElOnInit", () => {
193
+ this.teleporter.append();
194
+ });
195
+ o(this, "closeWhenClickOutSide", (e2) => {
196
+ const n2 = this.offCanvasElement.getAttribute("data-state") === "open", s2 = !this.offCanvasElement.contains(e2.target) && ![...this.offCanvasTriggers].includes(e2.target);
197
+ n2 && s2 && this.closeOffCanvas();
163
198
  });
164
199
  o(this, "closeOffCanvas", () => {
165
- var i2, l2, f2, r2, u;
166
- let t2 = false;
200
+ var i2, l2, r2, c2, p;
201
+ let e2 = false;
167
202
  if (v(this.offCanvasElement, "offcanvas-before-hide", {
168
203
  offcanvasId: this.offCanvasElement.id,
169
204
  setExitAction: (g) => {
170
- t2 = g;
205
+ e2 = g;
171
206
  }
172
- }), ((f2 = (l2 = (i2 = this.options).beforeHide) == null ? void 0 : l2.call(i2)) == null ? void 0 : f2.cancelAction) || t2)
207
+ }), ((r2 = (l2 = (i2 = this.options).beforeHide) == null ? void 0 : l2.call(i2)) == null ? void 0 : r2.cancelAction) || e2)
173
208
  return;
174
- const n2 = this.offCanvasElement.getAttribute("id"), a2 = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${n2}]`);
175
- a2 instanceof HTMLElement && p(a2), C(
209
+ const s2 = this.offCanvasElement.getAttribute("id"), a2 = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${s2}]`);
210
+ a2 instanceof HTMLElement && C(a2), u(
176
211
  this.offCanvasElement,
177
212
  this.allowBodyScroll,
178
213
  "close"
179
- ), document.removeEventListener("keydown", this.closeWithEsc), !this.allowBodyScroll && !a2 && document.removeEventListener("click", this.closeWhenClickOutSide), (u = (r2 = this.options).onHide) == null || u.call(r2), v(this.offCanvasElement, "offcanvas-close", { offcanvasId: this.offCanvasElement.id });
214
+ ), document.removeEventListener("keydown", this.closeWithEsc), !this.allowBodyScroll && !a2 && document.removeEventListener("click", this.closeWhenClickOutSide), (p = (c2 = this.options).onHide) == null || p.call(c2), v(this.offCanvasElement, "offcanvas-close", { offcanvasId: this.offCanvasElement.id });
180
215
  });
181
- o(this, "closeWithEsc", (t2) => {
182
- t2.key === "Escape" && (t2.preventDefault(), this.closeOffCanvas());
216
+ o(this, "closeWithEsc", (e2) => {
217
+ e2.key === "Escape" && (e2.preventDefault(), this.closeOffCanvas());
183
218
  });
184
219
  o(this, "changeState", () => {
185
220
  this.offCanvasElement.getAttribute("data-state") === "open" ? this.closeOffCanvas() : this.openOffCanvas();
186
221
  });
187
- o(this, "setOptions", ({ allowBodyscroll: t2 }) => {
188
- t2 !== void 0 && (this.allowBodyScroll = t2);
222
+ o(this, "setOptions", ({ allowBodyscroll: e2 }) => {
223
+ e2 !== void 0 && (this.allowBodyScroll = e2);
189
224
  });
190
- const n = typeof t == "string" ? m(t) : t;
191
- if (!(n instanceof HTMLElement))
225
+ const s = typeof e == "string" ? m(e) : e;
226
+ if (!(s instanceof HTMLElement))
192
227
  throw new Error("Invalid Offcanvas, the provided Element is not a valid HTMLElement");
193
- const a = h.getInstance("offcanvas", n);
228
+ const a = h.getInstance("offcanvas", s);
194
229
  if (a)
195
230
  return a;
196
- this.options = e;
197
- const { staticBackdrop: i, allowBodyScroll: l, backdrop: f } = this.options;
198
- this.offCanvasElement = n, this.setupAttributes(), this.staticBackdrop = i || n.hasAttribute("data-static-backdrop") && n.dataset.staticBackdrop !== "false" || false, this.allowBodyScroll = l || n.hasAttribute("data-allow-body-scroll") && n.dataset.allowBodyScroll !== "false" || false;
199
- const r = this.offCanvasElement.getAttribute("id");
200
- this.offCanvasTriggers = this.findOffCanvasElements("[data-offcanvas-trigger]", false, r), this.offCanvasCloseBtns = this.findOffCanvasElements("[data-offcanvas-close]", true, r, this.offCanvasElement), this.backdrop = f || this.offCanvasElement.dataset.offcanvasBackdrop || "", this.setupOffcanvas(), h.register("offcanvas", this.offCanvasElement, this);
231
+ this.options = n;
232
+ const { staticBackdrop: i, allowBodyScroll: l, backdrop: r } = this.options;
233
+ this.offCanvasElement = s, this.setupAttributes(), this.staticBackdrop = i || s.hasAttribute("data-static-backdrop") && s.dataset.staticBackdrop !== "false" || false, this.allowBodyScroll = l || s.hasAttribute("data-allow-body-scroll") && s.dataset.allowBodyScroll !== "false" || false;
234
+ const c = this.offCanvasElement.getAttribute("id");
235
+ this.offCanvasTriggers = this.findOffCanvasElements("[data-offcanvas-trigger]", false, c), this.offCanvasCloseBtns = this.findOffCanvasElements("[data-offcanvas-close]", true, c, this.offCanvasElement), this.backdrop = r || this.offCanvasElement.dataset.offcanvasBackdrop || "", this.teleporter = B(this.offCanvasElement, document.body, "move"), this.setupOffcanvas(), this.moveElOnInit(), h.register("offcanvas", this.offCanvasElement, this);
201
236
  }
202
- findOffCanvasElements(t, e, n, a) {
203
- return e ? d(`${t}`, a) : d(`${t}[data-target=${n}]`);
237
+ findOffCanvasElements(e, n, s, a) {
238
+ return n ? d(`${e}`, a) : d(`${e}[data-target=${s}]`);
204
239
  }
205
240
  setupAttributes() {
206
241
  this.offCanvasElement.hasAttribute("data-fx-offcanvas") || this.offCanvasElement.setAttribute("data-fx-offcanvas", "");
207
242
  }
208
243
  openOffCanvas() {
209
- var n, a, i, l;
210
- (a = (n = this.options).beforeShow) == null || a.call(n), I(this.offCanvasElement), C(
244
+ var s, a, i, l;
245
+ (a = (s = this.options).beforeShow) == null || a.call(s), x(this.offCanvasElement), u(
211
246
  this.offCanvasElement,
212
247
  this.allowBodyScroll,
213
248
  "open"
214
249
  );
215
- const t = this.offCanvasElement.getAttribute("id"), e = B(
250
+ const e = this.offCanvasElement.getAttribute("id"), n = L(
216
251
  this.backdrop,
217
- t
252
+ e
218
253
  );
219
- e instanceof HTMLElement && (y({ newElement: e, existingElement: this.offCanvasElement }), this.staticBackdrop || e.addEventListener("click", this.closeOffCanvas)), document.addEventListener("keydown", this.closeWithEsc), (l = (i = this.options).onShow) == null || l.call(i), v(this.offCanvasElement, "offcanvas-open", { offcanvasId: this.offCanvasElement.id });
254
+ n instanceof HTMLElement && (y({ newElement: n, existingElement: this.offCanvasElement }), this.staticBackdrop || n.addEventListener("click", this.closeOffCanvas)), document.addEventListener("keydown", this.closeWithEsc), (l = (i = this.options).onShow) == null || l.call(i), v(this.offCanvasElement, "offcanvas-open", { offcanvasId: this.offCanvasElement.id });
220
255
  }
221
256
  initCloseBtns() {
222
- for (const t of this.offCanvasCloseBtns)
223
- t.addEventListener("click", this.closeOffCanvas);
257
+ for (const e of this.offCanvasCloseBtns)
258
+ e.addEventListener("click", this.closeOffCanvas);
224
259
  }
225
260
  initTriggers() {
226
- for (const t of this.offCanvasTriggers)
227
- t.addEventListener("click", this.changeState);
261
+ for (const e of this.offCanvasTriggers)
262
+ e.addEventListener("click", this.changeState);
228
263
  }
229
264
  setupOffcanvas() {
230
265
  this.initTriggers(), this.initCloseBtns();
@@ -266,17 +301,17 @@ var c = class c2 {
266
301
  * ```
267
302
  */
268
303
  cleanup() {
269
- for (const t of this.offCanvasTriggers)
270
- t.removeEventListener("click", this.changeState);
271
- for (const t of this.offCanvasCloseBtns)
272
- t.removeEventListener("click", this.closeOffCanvas);
304
+ for (const e of this.offCanvasTriggers)
305
+ e.removeEventListener("click", this.changeState);
306
+ for (const e of this.offCanvasCloseBtns)
307
+ e.removeEventListener("click", this.closeOffCanvas);
273
308
  document.removeEventListener("keydown", this.closeWithEsc), this.allowBodyScroll || document.removeEventListener("click", this.closeWhenClickOutSide), h.removeInstance("offcanvas", this.offCanvasElement);
274
309
  }
275
310
  };
276
- o(c, "autoInit", (t = "[data-fx-offcanvas]") => {
277
- const e = d(t);
278
- for (const n of e)
279
- new c(n);
311
+ o(f, "autoInit", (e = "[data-fx-offcanvas]") => {
312
+ const n = d(e);
313
+ for (const s of n)
314
+ new f(s);
280
315
  }), /**
281
316
  * This is an alternative to using the constructor directly.
282
317
  * @param offcanvas - The offcanvas element selector or HTMLElement
@@ -291,8 +326,8 @@ o(c, "autoInit", (t = "[data-fx-offcanvas]") => {
291
326
  * });
292
327
  * ```
293
328
  */
294
- o(c, "init", (t, e = {}) => new c(t, e));
295
- var E = c;
329
+ o(f, "init", (e, n = {}) => new f(e, n));
330
+ var E = f;
296
331
 
297
332
  // src/index.js
298
333
  function Offcanvas(Alpine) {
package/dist/module.esm.js CHANGED
@@ -1,112 +1,143 @@
1
1
  // ../../node_modules/@flexilla/offcanvas/dist/offcanvas.js
2
- var b = Object.defineProperty;
3
- var w = (s, t, e) => t in s ? b(s, t, { enumerable: true, configurable: true, writable: true, value: e }) : s[t] = e;
4
- var o = (s, t, e) => w(s, typeof t != "symbol" ? t + "" : t, e);
5
- var m = (s, t = document.body) => t.querySelector(s);
6
- var d = (s, t = document.body) => Array.from(t.querySelectorAll(s));
2
+ var w = Object.defineProperty;
3
+ var b = (t, e, n) => e in t ? w(t, e, { enumerable: true, configurable: true, writable: true, value: n }) : t[e] = n;
4
+ var o = (t, e, n) => b(t, typeof e != "symbol" ? e + "" : e, n);
5
+ var m = (t, e = document.body) => e.querySelector(t);
6
+ var d = (t, e = document.body) => Array.from(e.querySelectorAll(t));
7
7
  var y = ({
8
- newElement: s,
9
- existingElement: t
8
+ newElement: t,
9
+ existingElement: e
10
10
  }) => {
11
- if (!(s instanceof HTMLElement) || !(t instanceof HTMLElement))
11
+ if (!(t instanceof HTMLElement) || !(e instanceof HTMLElement))
12
12
  throw new Error("Both parameters must be valid HTML elements.");
13
- const e = t.parentElement;
14
- if (e)
15
- e.insertBefore(s, t);
13
+ const n = e.parentElement;
14
+ if (n)
15
+ n.insertBefore(t, e);
16
16
  else
17
17
  throw new Error("Existing element must have a parent element.");
18
18
  };
19
19
  var k = ({
20
- element: s,
21
- callback: t,
22
- type: e,
23
- keysCheck: n
20
+ element: t,
21
+ callback: e,
22
+ type: n,
23
+ keysCheck: s
24
24
  }) => {
25
- const a = getComputedStyle(s), i = a.transition;
26
- if (i !== "none" && i !== "" && !n.includes(i)) {
27
- const l = "transitionend", f = () => {
28
- s.removeEventListener(l, f), t();
25
+ const a = getComputedStyle(t), i = a.transition;
26
+ if (i !== "none" && i !== "" && !s.includes(i)) {
27
+ const l = "transitionend", r = () => {
28
+ t.removeEventListener(l, r), e();
29
29
  };
30
- s.addEventListener(l, f, { once: true });
30
+ t.addEventListener(l, r, { once: true });
31
31
  } else
32
- t();
32
+ e();
33
33
  };
34
34
  var O = ({
35
- element: s,
36
- callback: t
35
+ element: t,
36
+ callback: e
37
37
  }) => {
38
38
  k({
39
- element: s,
40
- callback: t,
39
+ element: t,
40
+ callback: e,
41
41
  type: "transition",
42
42
  keysCheck: ["all 0s ease 0s", "all"]
43
43
  });
44
44
  };
45
- var v = (s, t, e) => {
46
- const n = new CustomEvent(t, { detail: e });
47
- s.dispatchEvent(n);
45
+ var v = (t, e, n) => {
46
+ const s = new CustomEvent(e, { detail: n });
47
+ t.dispatchEvent(s);
48
48
  };
49
- var A = (s) => {
50
- var t;
51
- return (t = s.parentElement) == null ? void 0 : t.removeChild(s);
49
+ function B(t, e, n = "move") {
50
+ if (!(t instanceof HTMLElement))
51
+ throw new Error("Source element must be an HTMLElement");
52
+ if (!(e instanceof HTMLElement))
53
+ throw new Error("Target element must be an HTMLElement");
54
+ if (!["move", "detachable"].includes(n))
55
+ throw new Error(`Invalid teleport mode: ${n}. Must be "move" or "detachable".`);
56
+ let s = document.createComment("teleporter-placeholder");
57
+ const a = t.parentNode;
58
+ return a ? a.insertBefore(s, t) : console.warn("Element has no parent; placeholder not inserted."), n === "move" ? (t.parentNode && e.appendChild(t), {
59
+ append() {
60
+ t.parentNode !== e && e.appendChild(t);
61
+ },
62
+ remove() {
63
+ s != null && s.parentNode && t.parentNode && s.parentNode.insertBefore(t, s);
64
+ },
65
+ restore() {
66
+ s != null && s.parentNode && t.parentNode !== a && s.parentNode.insertBefore(t, s);
67
+ }
68
+ }) : (t.parentNode && e.appendChild(t), {
69
+ append() {
70
+ e.contains(t) || e.appendChild(t);
71
+ },
72
+ remove() {
73
+ t.parentNode && t.remove();
74
+ },
75
+ restore() {
76
+ s != null && s.parentNode && !t.parentNode && s.parentNode.insertBefore(t, s);
77
+ }
78
+ });
79
+ }
80
+ var A = (t) => {
81
+ var e;
82
+ return (e = t.parentElement) == null ? void 0 : e.removeChild(t);
52
83
  };
53
- var p = (s) => {
54
- s.setAttribute("data-state", "invisible"), O({
55
- element: s,
84
+ var C = (t) => {
85
+ t.setAttribute("data-state", "invisible"), O({
86
+ element: t,
56
87
  callback() {
57
- A(s);
88
+ A(t);
58
89
  }
59
90
  });
60
91
  };
61
- var B = (s, t) => {
62
- const e = s;
63
- if (e === "" || !e)
92
+ var L = (t, e) => {
93
+ const n = t;
94
+ if (n === "" || !n)
64
95
  return;
65
- const n = document.createElement("div");
66
- if (n.setAttribute("aria-hidden", "true"), n.setAttribute("data-state", "visible"), n.setAttribute("data-fx-offcanvas-overlay", ""), n.setAttribute("data-offcanvas-el", t), e === "")
96
+ const s = document.createElement("div");
97
+ if (s.setAttribute("aria-hidden", "true"), s.setAttribute("data-state", "visible"), s.setAttribute("data-fx-offcanvas-overlay", ""), s.setAttribute("data-offcanvas-el", e), n === "")
67
98
  return;
68
- const a = e.split(" ");
69
- return e !== "" && n.classList.add(...a), n;
99
+ const a = n.split(" ");
100
+ return n !== "" && s.classList.add(...a), s;
70
101
  };
71
- var C = (s, t, e) => {
72
- s.setAttribute("aria-hidden", e === "open" ? "false" : "true"), s.setAttribute("data-state", e), t || S(e);
102
+ var u = (t, e, n) => {
103
+ t.setAttribute("aria-hidden", n === "open" ? "false" : "true"), t.setAttribute("data-state", n), e || S(n);
73
104
  };
74
- var S = (s) => {
75
- document.body.style.overflow = s === "open" ? "hidden" : "", document.body.style.overflowY = s === "open" ? "hidden" : "auto";
105
+ var S = (t) => {
106
+ document.body.style.overflow = t === "open" ? "hidden" : "", document.body.style.overflowY = t === "open" ? "hidden" : "auto";
76
107
  };
77
- var x = (s, t) => {
78
- if (s === t)
108
+ var I = (t, e) => {
109
+ if (t === e)
79
110
  return;
80
- s.setAttribute("aria-hidden", "true"), s.setAttribute("data-state", "close");
81
- const e = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${s.getAttribute("id")}]`, s.parentElement);
82
- e instanceof HTMLElement && p(e);
111
+ t.setAttribute("aria-hidden", "true"), t.setAttribute("data-state", "close");
112
+ const n = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${t.getAttribute("id")}]`, t.parentElement);
113
+ n instanceof HTMLElement && C(n);
83
114
  };
84
- var I = (s) => {
85
- const t = d("[data-fx-offcanvas][data-state=open]");
86
- if (!(t.length <= 0))
87
- for (const e of t)
88
- x(e, s);
115
+ var x = (t) => {
116
+ const e = d("[data-fx-offcanvas][data-state=open]");
117
+ if (!(e.length <= 0))
118
+ for (const n of e)
119
+ I(n, t);
89
120
  };
90
121
  var h = class {
91
122
  static initGlobalRegistry() {
92
123
  window.$flexillaInstances || (window.$flexillaInstances = {});
93
124
  }
94
- static register(t, e, n) {
95
- return this.initGlobalRegistry(), window.$flexillaInstances[t] || (window.$flexillaInstances[t] = []), this.getInstance(t, e) || (window.$flexillaInstances[t].push({ element: e, instance: n }), n);
125
+ static register(e, n, s) {
126
+ return this.initGlobalRegistry(), window.$flexillaInstances[e] || (window.$flexillaInstances[e] = []), this.getInstance(e, n) || (window.$flexillaInstances[e].push({ element: n, instance: s }), s);
96
127
  }
97
- static getInstance(t, e) {
98
- var n, a;
99
- return this.initGlobalRegistry(), (a = (n = window.$flexillaInstances[t]) == null ? void 0 : n.find(
100
- (i) => i.element === e
128
+ static getInstance(e, n) {
129
+ var s, a;
130
+ return this.initGlobalRegistry(), (a = (s = window.$flexillaInstances[e]) == null ? void 0 : s.find(
131
+ (i) => i.element === n
101
132
  )) == null ? void 0 : a.instance;
102
133
  }
103
- static removeInstance(t, e) {
104
- this.initGlobalRegistry(), window.$flexillaInstances[t] && (window.$flexillaInstances[t] = window.$flexillaInstances[t].filter(
105
- (n) => n.element !== e
134
+ static removeInstance(e, n) {
135
+ this.initGlobalRegistry(), window.$flexillaInstances[e] && (window.$flexillaInstances[e] = window.$flexillaInstances[e].filter(
136
+ (s) => s.element !== n
106
137
  ));
107
138
  }
108
139
  };
109
- var c = class c2 {
140
+ var f = class f2 {
110
141
  /**
111
142
  * Creates an instance of Offcanvas.
112
143
  * @param offcanvas - The offcanvas element selector or HTMLElement
@@ -124,7 +155,7 @@ var c = class c2 {
124
155
  * });
125
156
  * ```
126
157
  */
127
- constructor(t, e = {}) {
158
+ constructor(e, n = {}) {
128
159
  o(this, "offCanvasElement");
129
160
  o(this, "offCanvasTriggers");
130
161
  o(this, "offCanvasCloseBtns");
@@ -132,74 +163,78 @@ var c = class c2 {
132
163
  o(this, "staticBackdrop");
133
164
  o(this, "backdrop");
134
165
  o(this, "options");
135
- o(this, "closeWhenClickOutSide", (t2) => {
136
- const e2 = this.offCanvasElement.getAttribute("data-state") === "open", n2 = !this.offCanvasElement.contains(t2.target) && ![...this.offCanvasTriggers].includes(t2.target);
137
- e2 && n2 && this.closeOffCanvas();
166
+ o(this, "teleporter");
167
+ o(this, "moveElOnInit", () => {
168
+ this.teleporter.append();
169
+ });
170
+ o(this, "closeWhenClickOutSide", (e2) => {
171
+ const n2 = this.offCanvasElement.getAttribute("data-state") === "open", s2 = !this.offCanvasElement.contains(e2.target) && ![...this.offCanvasTriggers].includes(e2.target);
172
+ n2 && s2 && this.closeOffCanvas();
138
173
  });
139
174
  o(this, "closeOffCanvas", () => {
140
- var i2, l2, f2, r2, u;
141
- let t2 = false;
175
+ var i2, l2, r2, c2, p;
176
+ let e2 = false;
142
177
  if (v(this.offCanvasElement, "offcanvas-before-hide", {
143
178
  offcanvasId: this.offCanvasElement.id,
144
179
  setExitAction: (g) => {
145
- t2 = g;
180
+ e2 = g;
146
181
  }
147
- }), ((f2 = (l2 = (i2 = this.options).beforeHide) == null ? void 0 : l2.call(i2)) == null ? void 0 : f2.cancelAction) || t2)
182
+ }), ((r2 = (l2 = (i2 = this.options).beforeHide) == null ? void 0 : l2.call(i2)) == null ? void 0 : r2.cancelAction) || e2)
148
183
  return;
149
- const n2 = this.offCanvasElement.getAttribute("id"), a2 = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${n2}]`);
150
- a2 instanceof HTMLElement && p(a2), C(
184
+ const s2 = this.offCanvasElement.getAttribute("id"), a2 = m(`[data-fx-offcanvas-overlay][data-offcanvas-el=${s2}]`);
185
+ a2 instanceof HTMLElement && C(a2), u(
151
186
  this.offCanvasElement,
152
187
  this.allowBodyScroll,
153
188
  "close"
154
- ), document.removeEventListener("keydown", this.closeWithEsc), !this.allowBodyScroll && !a2 && document.removeEventListener("click", this.closeWhenClickOutSide), (u = (r2 = this.options).onHide) == null || u.call(r2), v(this.offCanvasElement, "offcanvas-close", { offcanvasId: this.offCanvasElement.id });
189
+ ), document.removeEventListener("keydown", this.closeWithEsc), !this.allowBodyScroll && !a2 && document.removeEventListener("click", this.closeWhenClickOutSide), (p = (c2 = this.options).onHide) == null || p.call(c2), v(this.offCanvasElement, "offcanvas-close", { offcanvasId: this.offCanvasElement.id });
155
190
  });
156
- o(this, "closeWithEsc", (t2) => {
157
- t2.key === "Escape" && (t2.preventDefault(), this.closeOffCanvas());
191
+ o(this, "closeWithEsc", (e2) => {
192
+ e2.key === "Escape" && (e2.preventDefault(), this.closeOffCanvas());
158
193
  });
159
194
  o(this, "changeState", () => {
160
195
  this.offCanvasElement.getAttribute("data-state") === "open" ? this.closeOffCanvas() : this.openOffCanvas();
161
196
  });
162
- o(this, "setOptions", ({ allowBodyscroll: t2 }) => {
163
- t2 !== void 0 && (this.allowBodyScroll = t2);
197
+ o(this, "setOptions", ({ allowBodyscroll: e2 }) => {
198
+ e2 !== void 0 && (this.allowBodyScroll = e2);
164
199
  });
165
- const n = typeof t == "string" ? m(t) : t;
166
- if (!(n instanceof HTMLElement))
200
+ const s = typeof e == "string" ? m(e) : e;
201
+ if (!(s instanceof HTMLElement))
167
202
  throw new Error("Invalid Offcanvas, the provided Element is not a valid HTMLElement");
168
- const a = h.getInstance("offcanvas", n);
203
+ const a = h.getInstance("offcanvas", s);
169
204
  if (a)
170
205
  return a;
171
- this.options = e;
172
- const { staticBackdrop: i, allowBodyScroll: l, backdrop: f } = this.options;
173
- this.offCanvasElement = n, this.setupAttributes(), this.staticBackdrop = i || n.hasAttribute("data-static-backdrop") && n.dataset.staticBackdrop !== "false" || false, this.allowBodyScroll = l || n.hasAttribute("data-allow-body-scroll") && n.dataset.allowBodyScroll !== "false" || false;
174
- const r = this.offCanvasElement.getAttribute("id");
175
- this.offCanvasTriggers = this.findOffCanvasElements("[data-offcanvas-trigger]", false, r), this.offCanvasCloseBtns = this.findOffCanvasElements("[data-offcanvas-close]", true, r, this.offCanvasElement), this.backdrop = f || this.offCanvasElement.dataset.offcanvasBackdrop || "", this.setupOffcanvas(), h.register("offcanvas", this.offCanvasElement, this);
206
+ this.options = n;
207
+ const { staticBackdrop: i, allowBodyScroll: l, backdrop: r } = this.options;
208
+ this.offCanvasElement = s, this.setupAttributes(), this.staticBackdrop = i || s.hasAttribute("data-static-backdrop") && s.dataset.staticBackdrop !== "false" || false, this.allowBodyScroll = l || s.hasAttribute("data-allow-body-scroll") && s.dataset.allowBodyScroll !== "false" || false;
209
+ const c = this.offCanvasElement.getAttribute("id");
210
+ this.offCanvasTriggers = this.findOffCanvasElements("[data-offcanvas-trigger]", false, c), this.offCanvasCloseBtns = this.findOffCanvasElements("[data-offcanvas-close]", true, c, this.offCanvasElement), this.backdrop = r || this.offCanvasElement.dataset.offcanvasBackdrop || "", this.teleporter = B(this.offCanvasElement, document.body, "move"), this.setupOffcanvas(), this.moveElOnInit(), h.register("offcanvas", this.offCanvasElement, this);
176
211
  }
177
- findOffCanvasElements(t, e, n, a) {
178
- return e ? d(`${t}`, a) : d(`${t}[data-target=${n}]`);
212
+ findOffCanvasElements(e, n, s, a) {
213
+ return n ? d(`${e}`, a) : d(`${e}[data-target=${s}]`);
179
214
  }
180
215
  setupAttributes() {
181
216
  this.offCanvasElement.hasAttribute("data-fx-offcanvas") || this.offCanvasElement.setAttribute("data-fx-offcanvas", "");
182
217
  }
183
218
  openOffCanvas() {
184
- var n, a, i, l;
185
- (a = (n = this.options).beforeShow) == null || a.call(n), I(this.offCanvasElement), C(
219
+ var s, a, i, l;
220
+ (a = (s = this.options).beforeShow) == null || a.call(s), x(this.offCanvasElement), u(
186
221
  this.offCanvasElement,
187
222
  this.allowBodyScroll,
188
223
  "open"
189
224
  );
190
- const t = this.offCanvasElement.getAttribute("id"), e = B(
225
+ const e = this.offCanvasElement.getAttribute("id"), n = L(
191
226
  this.backdrop,
192
- t
227
+ e
193
228
  );
194
- e instanceof HTMLElement && (y({ newElement: e, existingElement: this.offCanvasElement }), this.staticBackdrop || e.addEventListener("click", this.closeOffCanvas)), document.addEventListener("keydown", this.closeWithEsc), (l = (i = this.options).onShow) == null || l.call(i), v(this.offCanvasElement, "offcanvas-open", { offcanvasId: this.offCanvasElement.id });
229
+ n instanceof HTMLElement && (y({ newElement: n, existingElement: this.offCanvasElement }), this.staticBackdrop || n.addEventListener("click", this.closeOffCanvas)), document.addEventListener("keydown", this.closeWithEsc), (l = (i = this.options).onShow) == null || l.call(i), v(this.offCanvasElement, "offcanvas-open", { offcanvasId: this.offCanvasElement.id });
195
230
  }
196
231
  initCloseBtns() {
197
- for (const t of this.offCanvasCloseBtns)
198
- t.addEventListener("click", this.closeOffCanvas);
232
+ for (const e of this.offCanvasCloseBtns)
233
+ e.addEventListener("click", this.closeOffCanvas);
199
234
  }
200
235
  initTriggers() {
201
- for (const t of this.offCanvasTriggers)
202
- t.addEventListener("click", this.changeState);
236
+ for (const e of this.offCanvasTriggers)
237
+ e.addEventListener("click", this.changeState);
203
238
  }
204
239
  setupOffcanvas() {
205
240
  this.initTriggers(), this.initCloseBtns();
@@ -241,17 +276,17 @@ var c = class c2 {
241
276
  * ```
242
277
  */
243
278
  cleanup() {
244
- for (const t of this.offCanvasTriggers)
245
- t.removeEventListener("click", this.changeState);
246
- for (const t of this.offCanvasCloseBtns)
247
- t.removeEventListener("click", this.closeOffCanvas);
279
+ for (const e of this.offCanvasTriggers)
280
+ e.removeEventListener("click", this.changeState);
281
+ for (const e of this.offCanvasCloseBtns)
282
+ e.removeEventListener("click", this.closeOffCanvas);
248
283
  document.removeEventListener("keydown", this.closeWithEsc), this.allowBodyScroll || document.removeEventListener("click", this.closeWhenClickOutSide), h.removeInstance("offcanvas", this.offCanvasElement);
249
284
  }
250
285
  };
251
- o(c, "autoInit", (t = "[data-fx-offcanvas]") => {
252
- const e = d(t);
253
- for (const n of e)
254
- new c(n);
286
+ o(f, "autoInit", (e = "[data-fx-offcanvas]") => {
287
+ const n = d(e);
288
+ for (const s of n)
289
+ new f(s);
255
290
  }), /**
256
291
  * This is an alternative to using the constructor directly.
257
292
  * @param offcanvas - The offcanvas element selector or HTMLElement
@@ -266,8 +301,8 @@ o(c, "autoInit", (t = "[data-fx-offcanvas]") => {
266
301
  * });
267
302
  * ```
268
303
  */
269
- o(c, "init", (t, e = {}) => new c(t, e));
270
- var E = c;
304
+ o(f, "init", (e, n = {}) => new f(e, n));
305
+ var E = f;
271
306
 
272
307
  // src/index.js
273
308
  function Offcanvas(Alpine) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flexilla/alpine-offcanvas",
3
- "version": "0.1.1",
3
+ "version": "0.1.2",
4
4
  "description": "AlpineJS plugin for adding offcanvas functionality to your AlpineJS components",
5
5
  "type": "module",
6
6
  "private": false,
@@ -61,7 +61,7 @@
61
61
  ],
62
62
  "dependencies": {
63
63
  "@flexilla/alpine-offcanvas": "^0.0.3",
64
- "@flexilla/offcanvas": "^2.0.14"
64
+ "@flexilla/offcanvas": "^2.1.1"
65
65
  },
66
- "gitHead": "3284d6fd2a712b633d39a42d85792f730e2d7d55"
66
+ "gitHead": "869394b528d21d4842486a7396449aa9fbe3cbcb"
67
67
  }