preline/dist/overlay.mjs

Preline UI is an open-source set of prebuilt UI components based on the utility-first Tailwind CSS framework.

var e={189:(e,t,o)=>{o.d(t,{LO:()=>i});const i={xs:0,sm:640,md:768,lg:1024,xl:1280,"2xl":1536}},615:(e,t,o)=>{o.d(t,{A:()=>i});class i{constructor(e,t,o){this.el=e,this.options=t,this.events=o,this.el=e,this.options=t,this.events={}}createCollection(e,t){var o;e.push({id:(null===(o=null==t?void 0:t.el)||void 0===o?void 0:o.id)||e.length+1,element:t})}fireEvent(e,t=null){if(this.events.hasOwnProperty(e))return this.events[e](t)}on(e,t){this.events[e]=t}}},926:(e,t,o)=>{o.d(t,{JD:()=>r,Lc:()=>n,PK:()=>i,gj:()=>l,sH:()=>a,wC:()=>s,yd:()=>d});
/*
 * @version: 3.0.1
 * @author: Preline Labs Ltd.
 * @license: Licensed under MIT and Preline UI Fair Use License (https://preline.co/docs/license.html)
 * Copyright 2024 Preline Labs Ltd.
 */
const i=e=>"true"===e,l=(e,t,o="")=>(window.getComputedStyle(e).getPropertyValue(t)||o).replace(" ",""),n=e=>{let t=Number.NEGATIVE_INFINITY;return e.forEach((e=>{let o=(e=>window.getComputedStyle(e).getPropertyValue("z-index"))(e);"auto"!==o&&(o=parseInt(o,10),o>t&&(t=o))})),t},s=(e,t)=>{const o=e.children;for(let e=0;e<o.length;e++)if(o[e]===t)return!0;return!1},a=e=>{if(!e)return!1;return"none"===window.getComputedStyle(e).display||a(e.parentElement)},r=(e,t,o=null)=>{const i=new CustomEvent(e,{detail:{payload:o},bubbles:!0,cancelable:!0,composed:!1});t.dispatchEvent(i)},d=(e,t)=>{const o=()=>{t(),e.removeEventListener("transitionend",o,!0)},i=window.getComputedStyle(e),l=i.getPropertyValue("transition-duration");"none"!==i.getPropertyValue("transition-property")&&parseFloat(l)>0?e.addEventListener("transitionend",o,!0):t()}}},t={};function o(i){var l=t[i];if(void 0!==l)return l.exports;var n=t[i]={exports:{}};return e[i](n,n.exports,o),n.exports}o.d=(e,t)=>{for(var i in t)o.o(t,i)&&!o.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var i={};o.d(i,{A:()=>d});var l=o(926),n=o(189),s=o(615);
/*
 * HSOverlay
 * @version: 3.0.1
 * @author: Preline Labs Ltd.
 * @license: Licensed under MIT and Preline UI Fair Use License (https://preline.co/docs/license.html)
 * Copyright 2024 Preline Labs Ltd.
 */
class a extends s.A{constructor(e,t,o){var i,s,a,r,d,c;super(e,t,o),this.initialZIndex=0,this.toggleButtons=Array.from(document.querySelectorAll(`[data-hs-overlay="#${this.el.id}"]`));const h=this.collectToggleParameters(this.toggleButtons),u=e.getAttribute("data-hs-overlay-options"),y=u?JSON.parse(u):{},p=Object.assign(Object.assign(Object.assign({},y),h),t);this.hiddenClass=(null==p?void 0:p.hiddenClass)||"hidden",this.emulateScrollbarSpace=(null==p?void 0:p.emulateScrollbarSpace)||!1,this.isClosePrev=null===(i=null==p?void 0:p.isClosePrev)||void 0===i||i,this.backdropClasses=null!==(s=null==p?void 0:p.backdropClasses)&&void 0!==s?s:"hs-overlay-backdrop transition duration fixed inset-0 bg-gray-900/50 dark:bg-neutral-900/80",this.backdropParent="string"==typeof p.backdropParent?document.querySelector(p.backdropParent):document.body,this.backdropExtraClasses=null!==(a=null==p?void 0:p.backdropExtraClasses)&&void 0!==a?a:"",this.moveOverlayToBody=(null==p?void 0:p.moveOverlayToBody)||null,this.openNextOverlay=!1,this.autoHide=null,this.initContainer=(null===(r=this.el)||void 0===r?void 0:r.parentElement)||null,this.isCloseWhenClickInside=(0,l.PK)((0,l.gj)(this.el,"--close-when-click-inside","false")||"false"),this.isTabAccessibilityLimited=(0,l.PK)((0,l.gj)(this.el,"--tab-accessibility-limited","true")||"true"),this.isLayoutAffect=(0,l.PK)((0,l.gj)(this.el,"--is-layout-affect","false")||"false"),this.hasAutofocus=(0,l.PK)((0,l.gj)(this.el,"--has-autofocus","true")||"true"),this.hasDynamicZIndex=(0,l.PK)((0,l.gj)(this.el,"--has-dynamic-z-index","false")||"false"),this.hasAbilityToCloseOnBackdropClick=(0,l.PK)(this.el.getAttribute("data-hs-overlay-keyboard")||"true");const m=(0,l.gj)(this.el,"--auto-close"),v=(0,l.gj)(this.el,"--auto-close-equality-type"),f=(0,l.gj)(this.el,"--opened");this.autoClose=!isNaN(+m)&&isFinite(+m)?+m:n.LO[m]||null,this.autoCloseEqualityType=null!==(d=v)&&void 0!==d?d:null,this.openedBreakpoint=(!isNaN(+f)&&isFinite(+f)?+f:n.LO[f])||null,this.animationTarget=(null===(c=null==this?void 0:this.el)||void 0===c?void 0:c.querySelector(".hs-overlay-animation-target"))||this.el,this.initialZIndex=parseInt(getComputedStyle(this.el).zIndex,10),this.onElementClickListener=[],this.init()}elementClick(){const e=()=>{const e={el:this.el,isOpened:!!this.el.classList.contains("open")};this.fireEvent("toggleClicked",e),(0,l.JD)("toggleClicked.hs.overlay",this.el,e)};this.el.classList.contains("opened")?this.close(!1,e):this.open(e)}overlayClick(e){e.target.id&&`#${e.target.id}`===this.el.id&&this.isCloseWhenClickInside&&this.hasAbilityToCloseOnBackdropClick&&this.close()}backdropClick(){this.close()}init(){if(this.createCollection(window.$hsOverlayCollection,this),this.isLayoutAffect&&this.openedBreakpoint){const e=a.getInstance(this.el,!0);a.setOpened(this.openedBreakpoint,e)}this.onOverlayClickListener=e=>this.overlayClick(e),this.el.addEventListener("click",this.onOverlayClickListener),this.toggleButtons.length&&this.buildToggleButtons()}getElementsByZIndex(){return window.$hsOverlayCollection.filter((e=>e.element.initialZIndex===this.initialZIndex))}buildToggleButtons(){this.toggleButtons.forEach((e=>{this.el.classList.contains("opened")?e.ariaExpanded="true":e.ariaExpanded="false",this.onElementClickListener.push({el:e,fn:()=>this.elementClick()}),e.addEventListener("click",this.onElementClickListener.find((t=>t.el===e)).fn)}))}hideAuto(){const e=parseInt((0,l.gj)(this.el,"--auto-hide","0"));e&&(this.autoHide=setTimeout((()=>{this.close()}),e))}checkTimer(){this.autoHide&&(clearTimeout(this.autoHide),this.autoHide=null)}buildBackdrop(){const e=this.el.classList.value.split(" "),t=parseInt(window.getComputedStyle(this.el).getPropertyValue("z-index")),o=this.el.getAttribute("data-hs-overlay-backdrop-container")||!1;this.backdrop=document.createElement("div");let i=`${this.backdropClasses} ${this.backdropExtraClasses}`;const n="static"!==(0,l.gj)(this.el,"--overlay-backdrop","true"),s="false"===(0,l.gj)(this.el,"--overlay-backdrop","true");this.backdrop.id=`${this.el.id}-backdrop`,"style"in this.backdrop&&(this.backdrop.style.zIndex=""+(t-1));for(const t of e)(t.startsWith("hs-overlay-backdrop-open:")||t.includes(":hs-overlay-backdrop-open:"))&&(i+=` ${t}`);s||(o&&(this.backdrop=document.querySelector(o).cloneNode(!0),this.backdrop.classList.remove("hidden"),i=`${this.backdrop.classList.toString()}`,this.backdrop.classList.value=""),n&&(this.onBackdropClickListener=()=>this.backdropClick(),this.backdrop.addEventListener("click",this.onBackdropClickListener,!0)),this.backdrop.setAttribute("data-hs-overlay-backdrop-template",""),this.backdropParent.appendChild(this.backdrop),setTimeout((()=>{this.backdrop.classList.value=i})))}destroyBackdrop(){const e=document.querySelector(`#${this.el.id}-backdrop`);e&&(this.openNextOverlay&&(e.style.transitionDuration=1.8*parseFloat(window.getComputedStyle(e).transitionDuration.replace(/[^\d.-]/g,""))+"s"),e.classList.add("opacity-0"),(0,l.yd)(e,(()=>{e.remove()})))}focusElement(){const e=this.el.querySelector("[autofocus]");if(!e)return!1;e.focus()}getScrollbarSize(){let e=document.createElement("div");e.style.overflow="scroll",e.style.width="100px",e.style.height="100px",document.body.appendChild(e);let t=e.offsetWidth-e.clientWidth;return document.body.removeChild(e),t}collectToggleParameters(e){let t={};return e.forEach((e=>{const o=e.getAttribute("data-hs-overlay-options"),i=o?JSON.parse(o):{};t=Object.assign(Object.assign({},t),i)})),t}open(e=null){this.hasDynamicZIndex&&(a.currentZIndex<this.initialZIndex&&(a.currentZIndex=this.initialZIndex),a.currentZIndex++,this.el.style.zIndex=`${a.currentZIndex}`);const t=document.querySelectorAll(".hs-overlay.open"),o=window.$hsOverlayCollection.find((e=>Array.from(t).includes(e.element.el)&&!e.element.isLayoutAffect)),i=document.querySelectorAll(`[data-hs-overlay="#${this.el.id}"]`),n="true"!==(0,l.gj)(this.el,"--body-scroll","false");if(this.isClosePrev&&o)return this.openNextOverlay=!0,o.element.close().then((()=>{this.open(),this.openNextOverlay=!1}));n&&(document.body.style.overflow="hidden",this.emulateScrollbarSpace&&(document.body.style.paddingRight=`${this.getScrollbarSize()}px`)),this.buildBackdrop(),this.checkTimer(),this.hideAuto(),i.forEach((e=>{e.ariaExpanded&&(e.ariaExpanded="true")})),this.el.classList.remove(this.hiddenClass),this.el.setAttribute("aria-overlay","true"),this.el.setAttribute("tabindex","-1"),setTimeout((()=>{if(this.el.classList.contains("opened"))return!1;this.el.classList.add("open","opened"),this.isLayoutAffect&&document.body.classList.add("hs-overlay-body-open"),this.fireEvent("open",this.el),(0,l.JD)("open.hs.overlay",this.el,this.el),this.hasAutofocus&&this.focusElement(),"function"==typeof e&&e(),a.openedItemsQty++}),50)}close(e=!1,t=null){a.openedItemsQty=a.openedItemsQty<=0?0:a.openedItemsQty-1,0===a.openedItemsQty&&this.isLayoutAffect&&document.body.classList.remove("hs-overlay-body-open");const o=e=>{if(this.el.classList.contains("open"))return!1;document.querySelectorAll(`[data-hs-overlay="#${this.el.id}"]`).forEach((e=>{e.ariaExpanded&&(e.ariaExpanded="false")})),this.el.classList.add(this.hiddenClass),this.hasDynamicZIndex&&(this.el.style.zIndex=""),this.destroyBackdrop(),this.fireEvent("close",this.el),(0,l.JD)("close.hs.overlay",this.el,this.el),document.querySelector(".hs-overlay.opened")||(document.body.style.overflow="",this.emulateScrollbarSpace&&(document.body.style.paddingRight="")),e(this.el),"function"==typeof t&&t(),0===a.openedItemsQty&&(document.body.classList.remove("hs-overlay-body-open"),this.hasDynamicZIndex&&(a.currentZIndex=0))};return new Promise((t=>{this.el.classList.remove("open","opened"),this.el.removeAttribute("aria-overlay"),this.el.removeAttribute("tabindex"),e?o(t):(0,l.yd)(this.animationTarget,(()=>o(t)))}))}destroy(){this.el.classList.remove("open","opened",this.hiddenClass),this.isLayoutAffect&&document.body.classList.remove("hs-overlay-body-open"),this.el.removeEventListener("click",this.onOverlayClickListener),this.onElementClickListener.length&&(this.onElementClickListener.forEach((({el:e,fn:t})=>{e.removeEventListener("click",t)})),this.onElementClickListener=null),this.backdrop&&this.backdrop.removeEventListener("click",this.onBackdropClickListener),this.backdrop&&(this.backdrop.remove(),this.backdrop=null),window.$hsOverlayCollection=window.$hsOverlayCollection.filter((({element:e})=>e.el!==this.el))}static findInCollection(e){return window.$hsOverlayCollection.find((t=>e instanceof a?t.element.el===e.el:"string"==typeof e?t.element.el===document.querySelector(e):t.element.el===e))||null}static getInstance(e,t){const o="string"==typeof e?document.querySelector(e):e,i=(null==o?void 0:o.getAttribute("data-hs-overlay"))?o.getAttribute("data-hs-overlay"):e,l=window.$hsOverlayCollection.find((e=>e.element.el===("string"==typeof i?document.querySelector(i):i)||e.element.el===("string"==typeof i?document.querySelector(i):i)));return l?t?l:l.element.el:null}static autoInit(){window.$hsOverlayCollection||(window.$hsOverlayCollection=[],document.addEventListener("keydown",(e=>a.accessibility(e)))),window.$hsOverlayCollection&&(window.$hsOverlayCollection=window.$hsOverlayCollection.filter((({element:e})=>document.contains(e.el)))),document.querySelectorAll(".hs-overlay:not(.--prevent-on-load-init)").forEach((e=>{window.$hsOverlayCollection.find((t=>{var o;return(null===(o=null==t?void 0:t.element)||void 0===o?void 0:o.el)===e}))||new a(e)}))}static open(e){const t=a.findInCollection(e);t&&t.element.el.classList.contains(t.element.hiddenClass)&&t.element.open()}static close(e){const t=a.findInCollection(e);t&&!t.element.el.classList.contains(t.element.hiddenClass)&&t.element.close()}static setOpened(e,t){document.body.clientWidth>=e?(document.body.classList.add("hs-overlay-body-open"),t.element.open()):t.element.close(!0)}static accessibility(e){var t,o;const i=document.querySelectorAll(".hs-overlay.open"),n=(0,l.Lc)(Array.from(i)),s=window.$hsOverlayCollection.filter((e=>e.element.el.classList.contains("open"))).find((e=>window.getComputedStyle(e.element.el).getPropertyValue("z-index")===`${n}`)),a=null===(o=null===(t=null==s?void 0:s.element)||void 0===t?void 0:t.el)||void 0===o?void 0:o.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'),r=[];(null==a?void 0:a.length)&&a.forEach((e=>{(0,l.sH)(e)||r.push(e)}));const d=s&&!e.metaKey;if(d&&!s.element.isTabAccessibilityLimited&&"Tab"===e.code)return!1;d&&r.length&&"Tab"===e.code&&(e.preventDefault(),this.onTab(s)),d&&"Escape"===e.code&&(e.preventDefault(),this.onEscape(s))}static onEscape(e){e&&e.element.hasAbilityToCloseOnBackdropClick&&e.element.close()}static onTab(e){const t=e.element.el,o=Array.from(t.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'));if(0===o.length)return!1;const i=t.querySelector(":focus");if(i){let e=!1;for(const t of o){if(e)return void t.focus();t===i&&(e=!0)}o[0].focus()}else o[0].focus()}static on(e,t,o){const i=a.findInCollection(t);i&&(i.element.events[e]=o)}}a.openedItemsQty=0,a.currentZIndex=0;const r=()=>{if(!window.$hsOverlayCollection.length||!window.$hsOverlayCollection.find((e=>e.element.moveOverlayToBody)))return!1;window.$hsOverlayCollection.filter((e=>e.element.moveOverlayToBody)).forEach((e=>{const t=e.element.moveOverlayToBody,o=e.element.initContainer,i=document.querySelector("body"),n=e.element.el;if(!o&&n)return!1;document.body.clientWidth<=t&&!(0,l.wC)(i,n)?i.appendChild(n):document.body.clientWidth>t&&!o.contains(n)&&o.appendChild(n)}))};window.addEventListener("load",(()=>{a.autoInit(),r()})),window.addEventListener("resize",(()=>{(()=>{if(!window.$hsOverlayCollection.length||!window.$hsOverlayCollection.find((e=>e.element.autoClose)))return!1;window.$hsOverlayCollection.filter((e=>e.element.autoClose)).forEach((e=>{const{autoCloseEqualityType:t,autoClose:o}=e.element;("less-than"===t?document.body.clientWidth<=o:document.body.clientWidth>=o)?e.element.close(!0):e.element.isLayoutAffect&&document.body.classList.add("hs-overlay-body-open")}))})(),r(),(()=>{if(!window.$hsOverlayCollection.length||!window.$hsOverlayCollection.find((e=>e.element.autoClose)))return!1;window.$hsOverlayCollection.filter((e=>e.element.autoClose)).forEach((e=>{const{autoCloseEqualityType:t,autoClose:o}=e.element;("less-than"===t?document.body.clientWidth<=o:document.body.clientWidth>=o)&&e.element.close(!0)}))})(),(()=>{if(!window.$hsOverlayCollection.length||!window.$hsOverlayCollection.find((e=>e.element.el.classList.contains("opened"))))return!1;window.$hsOverlayCollection.filter((e=>e.element.el.classList.contains("opened"))).forEach((e=>{const t=parseInt(window.getComputedStyle(e.element.el).getPropertyValue("z-index")),o=document.querySelector(`#${e.element.el.id}-backdrop`);return!!o&&(t!==parseInt(window.getComputedStyle(o).getPropertyValue("z-index"))+1&&("style"in o&&(o.style.zIndex=""+(t-1)),void document.body.classList.add("hs-overlay-body-open")))}))})()})),"undefined"!=typeof window&&(window.HSOverlay=a);const d=a;var c=i.A;export{c as default};