@flexilla/alpine-offcanvas 0.0.2 → 0.0.3
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 +1 -3
- package/dist/cdn.min.js +1 -1
- package/dist/module.cjs.js +1 -3
- package/dist/module.esm.js +1 -3
- package/package.json +3 -3
package/dist/cdn.js
CHANGED
|
@@ -155,7 +155,7 @@
|
|
|
155
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 });
|
|
156
156
|
});
|
|
157
157
|
o(this, "closeWithEsc", (t2) => {
|
|
158
|
-
t2.
|
|
158
|
+
t2.key === "Escape" && (t2.preventDefault(), this.closeOffCanvas());
|
|
159
159
|
});
|
|
160
160
|
o(this, "changeState", () => {
|
|
161
161
|
this.offCanvasElement.getAttribute("data-state") === "open" ? this.closeOffCanvas() : this.openOffCanvas();
|
|
@@ -254,9 +254,7 @@
|
|
|
254
254
|
for (const n of e)
|
|
255
255
|
new c(n);
|
|
256
256
|
}), /**
|
|
257
|
-
* Creates a new instance of Offcanvas with the given element and options.
|
|
258
257
|
* This is an alternative to using the constructor directly.
|
|
259
|
-
*
|
|
260
258
|
* @param offcanvas - The offcanvas element selector or HTMLElement
|
|
261
259
|
* @param options - Configuration options for the offcanvas
|
|
262
260
|
* @returns A new Offcanvas instance
|
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:B=>{g=B}}),((h=(v=(f=this.options).beforeHide)==null?void 0:v.call(f))==null?void 0:h.cancelAction)||g)return;let x=this.offCanvasElement.getAttribute("id"),u=C(`[data-fx-offcanvas-overlay][data-offcanvas-el=${x}]`);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.
|
|
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:B=>{g=B}}),((h=(v=(f=this.options).beforeHide)==null?void 0:v.call(f))==null?void 0:h.cancelAction)||g)return;let x=this.offCanvasElement.getAttribute("id"),u=C(`[data-fx-offcanvas-overlay][data-offcanvas-el=${x}]`);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()});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)});})();
|
package/dist/module.cjs.js
CHANGED
|
@@ -179,7 +179,7 @@ var c = class c2 {
|
|
|
179
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 });
|
|
180
180
|
});
|
|
181
181
|
o(this, "closeWithEsc", (t2) => {
|
|
182
|
-
t2.
|
|
182
|
+
t2.key === "Escape" && (t2.preventDefault(), this.closeOffCanvas());
|
|
183
183
|
});
|
|
184
184
|
o(this, "changeState", () => {
|
|
185
185
|
this.offCanvasElement.getAttribute("data-state") === "open" ? this.closeOffCanvas() : this.openOffCanvas();
|
|
@@ -278,9 +278,7 @@ o(c, "autoInit", (t = "[data-fx-offcanvas]") => {
|
|
|
278
278
|
for (const n of e)
|
|
279
279
|
new c(n);
|
|
280
280
|
}), /**
|
|
281
|
-
* Creates a new instance of Offcanvas with the given element and options.
|
|
282
281
|
* This is an alternative to using the constructor directly.
|
|
283
|
-
*
|
|
284
282
|
* @param offcanvas - The offcanvas element selector or HTMLElement
|
|
285
283
|
* @param options - Configuration options for the offcanvas
|
|
286
284
|
* @returns A new Offcanvas instance
|
package/dist/module.esm.js
CHANGED
|
@@ -154,7 +154,7 @@ var c = class c2 {
|
|
|
154
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 });
|
|
155
155
|
});
|
|
156
156
|
o(this, "closeWithEsc", (t2) => {
|
|
157
|
-
t2.
|
|
157
|
+
t2.key === "Escape" && (t2.preventDefault(), this.closeOffCanvas());
|
|
158
158
|
});
|
|
159
159
|
o(this, "changeState", () => {
|
|
160
160
|
this.offCanvasElement.getAttribute("data-state") === "open" ? this.closeOffCanvas() : this.openOffCanvas();
|
|
@@ -253,9 +253,7 @@ o(c, "autoInit", (t = "[data-fx-offcanvas]") => {
|
|
|
253
253
|
for (const n of e)
|
|
254
254
|
new c(n);
|
|
255
255
|
}), /**
|
|
256
|
-
* Creates a new instance of Offcanvas with the given element and options.
|
|
257
256
|
* This is an alternative to using the constructor directly.
|
|
258
|
-
*
|
|
259
257
|
* @param offcanvas - The offcanvas element selector or HTMLElement
|
|
260
258
|
* @param options - Configuration options for the offcanvas
|
|
261
259
|
* @returns A new Offcanvas instance
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@flexilla/alpine-offcanvas",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.3",
|
|
4
4
|
"description": "AlpineJS plugin for adding offcanvas functionality to your AlpineJS components",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"private": false,
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
"Flexilla"
|
|
59
59
|
],
|
|
60
60
|
"dependencies": {
|
|
61
|
-
"@flexilla/offcanvas": "^2.0.
|
|
61
|
+
"@flexilla/offcanvas": "^2.0.12"
|
|
62
62
|
},
|
|
63
|
-
"gitHead": "
|
|
63
|
+
"gitHead": "914deac1d6de6fddf509270e52d8aa1925def7af"
|
|
64
64
|
}
|