axentix/dist/components/modal/modal.min.js

Axentix is a framework mixing fully customizable components & utility-first classes, leaving the design choice to the developer.

(function(i,o){typeof exports=="object"&&typeof module!="undefined"?module.exports=o():typeof define=="function"&&define.amd?define(o):(i=typeof globalThis!="undefined"?globalThis:i||self,i.Modal=o())})(this,function(){"use strict";var Q=Object.defineProperty;var S=i=>{throw TypeError(i)};var R=(i,o,r)=>o in i?Q(i,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):i[o]=r;var L=(i,o,r)=>R(i,typeof o!="symbol"?o+"":o,r),O=(i,o,r)=>o.has(i)||S("Cannot "+r);var c=(i,o,r)=>(O(i,o,"read from private field"),r?r.call(i):o.get(i)),x=(i,o,r)=>o.has(i)?S("Cannot add the same private member more than once"):o instanceof WeakSet?o.add(i):o.set(i,r),u=(i,o,r,D)=>(O(i,o,"write to private field"),D?D.call(i,r):o.set(i,r),r),A=(i,o,r)=>(O(i,o,"access private method"),r);var g,d,h,p,f,C,k,T;const i=[],o={components:[],plugins:[],prefix:"ax",mode:""},r=s=>o.components.find(e=>e.name===s).class,D=()=>{const s=o.components.filter(t=>t.dataDetection),e=o.plugins.filter(t=>t.dataDetection);return[...s,...e].map(t=>t.name)},M=(s,e)=>{if(!s.name||!s.class){console.error(`[Axentix] Error registering ${e} : Missing required parameters.`);return}if(o[e].some(t=>t.name===s.name)){console.error(`[Axentix] Error registering ${e} : Already exist.`);return}s.autoInit&&(s.autoInit.selector=s.autoInit.selector+=":not(.no-axentix-init)"),o[e].push(s)},q=s=>{M(s,"components")},$=s=>s.replace(/[\w]([A-Z])/g,e=>e[0]+"-"+e[1]).toLowerCase(),U=(s,e="")=>{const t=$(s);return e?e+"-"+t:t},N=(s,e,t,n,a="")=>{const l=e[0].toUpperCase()+e.slice(1).toLowerCase();D().includes(l)&&t!=="Collapsible"&&l!=="Sidenav"&&(s[e]=r(l).getDefaultOptions());const y=a?a+"-"+e:e,v=b(s[e],t,n,y);if(!(Object.keys(v).length===0&&s.constructor===Object))return v},b=(s,e,t,n="")=>Object.keys(s).reduce((a,l)=>{if(typeof s[l]=="object"&&s[l]!==null){const y=N(s,l,e,t,n);y&&(a[l]=y)}else if(s[l]!==null){const y="data-"+e.toLowerCase()+"-"+U(l,n);if(t.hasAttribute(y)){const v=t.getAttribute(y);a[l]=typeof s[l]=="number"?Number(v):v,typeof s[l]=="boolean"&&(a[l]=v==="true")}}return a},{}),z=(s,e)=>{const t=Object.assign({},r(s).getDefaultOptions());return b(t,s,e)},F=()=>{document.querySelectorAll("[data-ax]").forEach(e=>{let t=e.dataset.ax;if(t=t[0].toUpperCase()+t.slice(1).toLowerCase(),!D().includes(t)){console.error(`[Axentix] Error: ${t} component doesn't exist. 
 Did you forget to register him ?`,e);return}try{const n=r(t);new n(`#${e.id}`)}catch(n){console.error("[Axentix] Data: Unable to load "+t,n)}})},Z=()=>{try{new Axentix.Axentix("all")}catch(s){console.error("[Axentix] Unable to auto init.",s)}};document.addEventListener("DOMContentLoaded",()=>{document.documentElement.dataset.axentix&&Z(),F()});const I=(...s)=>s.reduce((e,t)=>{for(let n in t)e[n]=typeof t[n]=="object"&&t[n]!==null?I(e[n],t[n]):t[n];return e},{}),B=(s,e,t)=>I(r(s).getDefaultOptions(),z(s,t),e),m=(s,e,t)=>{const n=new CustomEvent("ax."+e,{detail:{},bubbles:!0});s.dispatchEvent(n)},P=s=>{const e=i.find(t=>t.type!=="Toast"&&"#"+t.instance.el.id===s);return e?e.instance:!1},G=(s,e,t,n)=>{const a=s&&e?document.querySelector(`.ax-overlay[data-target="${t}"]`):document.createElement("div");return a.classList.add("ax-overlay"),a.style.transitionDuration=n+"ms",a.dataset.target=t,a},w=(s,e,t,n,a)=>{s&&(n?(e.addEventListener("click",t),document.body.appendChild(e),setTimeout(()=>{e.classList.add("active")},50)):(e.classList.remove("active"),setTimeout(()=>{e.removeEventListener("click",t),document.body.removeChild(e)},a)))},H=(s,e='[data-target="{ID}"]')=>Array.from(document.querySelectorAll(e.replace("{ID}",s)));class J{constructor(){L(this,"el")}removeListeners(){}setupListeners(){}setup(){}preventDbInstance(e){if(e&&P(e))throw new Error(`Instance already exist on ${e}`)}sync(){m(this.el,"component.sync"),this.removeListeners(),this.setupListeners()}reset(){m(this.el,"component.reset"),this.removeListeners(),this.setup()}destroy(){m(this.el,"component.destroy"),this.removeListeners();const e=i.findIndex(t=>t.instance.el.id===this.el.id);i.splice(e,1)}}const K={overlay:!0,bodyScrolling:!1,animationDuration:400};class E extends J{constructor(t,n){super();x(this,f);L(this,"options");L(this,"overlayElement");x(this,g);x(this,d,!1);x(this,h,!1);x(this,p);try{this.preventDbInstance(t),i.push({type:"Modal",instance:this}),this.el=document.querySelector(t),this.options=B("Modal",n,this.el),this.setup()}catch(a){console.error("[Axentix] Modal init error",a)}}setup(){m(this.el,"modal.setup"),u(this,g,H(this.el.id)),u(this,d,!!this.el.classList.contains("active")),u(this,h,!1),this.setupListeners(),this.options.overlay&&(this.overlayElement=G(c(this,d),this.options.overlay,this.el.id,this.options.animationDuration)),this.el.style.transitionDuration=this.options.animationDuration+"ms",this.el.style.animationDuration=this.options.animationDuration+"ms"}setupListeners(){u(this,p,A(this,f,T).bind(this)),c(this,g).forEach(t=>t.addEventListener("click",c(this,p)))}removeListeners(){c(this,g).forEach(t=>t.removeEventListener("click",c(this,p))),u(this,p,void 0)}open(){c(this,d)||(m(this.el,"modal.open"),u(this,d,!0),u(this,h,!0),A(this,f,k).call(this),this.el.style.display="block",w(this.options.overlay,this.overlayElement,c(this,p),!0,this.options.animationDuration),A(this,f,C).call(this,!1),setTimeout(()=>{this.el.classList.add("active")},50),setTimeout(()=>{u(this,h,!1),m(this.el,"modal.opened")},this.options.animationDuration))}close(){c(this,d)&&(m(this.el,"modal.close"),u(this,h,!0),this.el.classList.remove("active"),w(this.options.overlay,this.overlayElement,c(this,p),!1,this.options.animationDuration),setTimeout(()=>{this.el.style.display="",u(this,h,!1),u(this,d,!1),A(this,f,C).call(this,!0),m(this.el,"modal.closed")},this.options.animationDuration))}}return g=new WeakMap,d=new WeakMap,h=new WeakMap,p=new WeakMap,f=new WeakSet,C=function(t){this.options.bodyScrolling||(document.body.style.overflow=t?"":"hidden")},k=function(){const t=document.querySelectorAll(".modal.active").length+1;this.options.overlay&&(this.overlayElement.style.zIndex=String(800+t*10-2)),this.el.style.zIndex=String(800+t*10)},T=function(t){t.preventDefault(),!c(this,h)&&(c(this,d)?this.close():this.open())},L(E,"getDefaultOptions",()=>K),q({class:E,name:"Modal",dataDetection:!0,autoInit:{enabled:!0,selector:".modal"}}),E});