UNPKG

axentix

Version:

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

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