epic-modals 1.0.3 → 1.0.5

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/vanilla.js CHANGED
@@ -1 +1 @@
1
- var e=Object.defineProperty,t=(t,o,i)=>((t,o,i)=>o in t?e(t,o,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[o]=i)(t,"symbol"!=typeof o?o+"":o,i);import{CSS_CLASSES as o,DATA_ATTRIBUTES as i,RESIZE_DIRECTIONS as s}from"./core.js";import{ModalController as n}from"./core.js";import{registerModal as a,createModalRegistration as r,bringToFront as l,unregisterModal as d,subscribe as c,getModalsStore as h,isModalAnimating as m,shakeElement as p,restoreModal as u,closeAllModals as b}from"./core.js";import{bringToFront as g,closeAllModals as E,closeModal as C,getDockOrder as f,getModalState as y,getModalsStore as k,isModalOpen as A,isModalRegistered as M,minimizeModal as v,openChildModal as H,openModal as I,reorderDock as z,restoreAllMinimizedModals as N,restoreModal as w,toggleModalTransparency as L}from"./core.js";import{createConfigHelper as D,getConfig as S,setConfig as $}from"./core.js";import{getConfig as T,setConfig as O}from"./core.js";import{getMinimizedModals as j,getDockContainerClasses as B,getDockClasses as R}from"./core.js";import{getLayerZIndex as x,initializeStacking as F}from"./core.js";import{toDataId as P}from"./core.js";import{getBackdropConfig as W,hasOpenModals as G}from"./core.js";import{initializeResizeListener as _,cleanupResizeListener as K}from"./core.js";class U{constructor(e){t(this,"controller"),t(this,"dialogEl"),t(this,"headerEl"),t(this,"bodyEl"),t(this,"footerEl",null),t(this,"resizeHandlesContainer",null),t(this,"container"),t(this,"options"),t(this,"configHelper"),t(this,"unsubscribe",null),t(this,"abortController",new AbortController),this.options=e,this.container=e.container,this.configHelper=D(e.config),a(r({id:e.id,title:e.title,icon:e.icon,autoOpen:e.autoOpen??!0,glow:e.glow})),(e.autoOpen??!0)&&l(e.id),this.dialogEl=this.createDialogElement(),this.headerEl=this.createHeaderElement(),this.bodyEl=this.createBodyElement(),e.footer&&(this.footerEl=this.createFooterElement(),this.footerEl.appendChild(e.footer)),this.configHelper.isFeatureEnabled("resize")&&(this.resizeHandlesContainer=this.createResizeHandles()),this.dialogEl.appendChild(this.headerEl),this.dialogEl.appendChild(this.bodyEl),this.footerEl&&this.dialogEl.appendChild(this.footerEl),this.resizeHandlesContainer&&this.dialogEl.appendChild(this.resizeHandlesContainer),e.content&&this.bodyEl.appendChild(e.content);const o={id:e.id,title:e.title,icon:e.icon,config:e.config,maxWidth:e.maxWidth,preferredHeight:e.preferredHeight,glow:e.glow,closeOnEscape:e.closeOnEscape??!0,autoOpen:e.autoOpen??!0,openSourcePosition:e.openSourcePosition,onClose:e.onClose,skipRegistration:!0,configHelper:this.configHelper};this.controller=new n(o),this.container.appendChild(this.dialogEl),this.controller.mount(this.dialogEl),this.unsubscribe=this.controller.subscribe(e=>{this.updateFromState(e)}),this.updateFromState(this.controller.getState()),this.setupEventHandlers()}destroy(){var e;this.abortController.abort(),null==(e=this.unsubscribe)||e.call(this),this.controller.destroy(),d(this.options.id),this.dialogEl.remove()}createDialogElement(){const e=document.createElement("div");return e.className=o.dialog,e.setAttribute(i.modalId,String(this.options.id)),e.setAttribute("role","dialog"),e.setAttribute("aria-modal","true"),e.setAttribute("aria-labelledby",`${this.options.id}-title`),e.setAttribute("tabindex","-1"),e}createHeaderElement(){const e=document.createElement("header"),t=this.configHelper.isFeatureEnabled("drag"),i=this.configHelper.getAppearance("headerLayout"),s=this.configHelper.isFeatureEnabled("minimize"),n=!this.configHelper.isFeatureEnabled("dock"),a=this.configHelper.isFeatureEnabled("transparency");e.className=t?`${o.header} ${o.headerDraggable}`:o.header;const r=this.getIconElement();return"macos"===i?this.createMacOSHeader(e,r,s,n,a):this.createWindowsHeader(e,r,s,n,a),e}getIconElement(){return this.options.iconElement?this.options.iconElement:this.options.icon&&this.options.renderIcon?this.options.renderIcon(this.options.icon):null}createMacOSHeader(e,t,i,s,n){const a=document.createElement("div");a.className=o.headerTrafficLights;const r=document.createElement("button");if(r.type="button",r.className=`${o.headerLight} ${o.headerLightClose}`,r.setAttribute("aria-label","Close"),r.setAttribute("data-control","close"),a.appendChild(r),i){const e=document.createElement("button");e.type="button",e.className=`${o.headerLight} ${o.headerLightMinimize}${s?` ${o.headerLightDisabled}`:""}`,e.setAttribute("aria-label","Minimize"),e.setAttribute("data-control","minimize"),s&&(e.disabled=!0,e.title="Enable dock to minimize"),a.appendChild(e)}if(n){const e=document.createElement("button");e.type="button",e.className=`${o.headerLight} ${o.headerLightStyle}`,e.setAttribute("aria-label","Toggle style"),e.setAttribute("data-control","style"),a.appendChild(e)}e.appendChild(a);const l=document.createElement("div");if(l.className=o.headerMacCenter,t){const e=document.createElement("div");e.className=o.headerIcon,e.appendChild(t),l.appendChild(e)}const d=document.createElement("div");d.className=o.headerTitleGroup;const c=document.createElement("h2");c.className=o.headerTitle,c.id=`${this.options.id}-title`,c.textContent=this.options.title,d.appendChild(c),l.appendChild(d),e.appendChild(l);const h=document.createElement("div");h.className=o.headerMacSpacer,e.appendChild(h)}createWindowsHeader(e,t,i,s,n){const a=document.createElement("div");if(a.className=o.headerTitleGroup,t){const e=document.createElement("div");e.className=o.headerIcon,e.appendChild(t),a.appendChild(e)}const r=document.createElement("h2");r.className=o.headerTitle,r.id=`${this.options.id}-title`,r.textContent=this.options.title,a.appendChild(r),e.appendChild(a);const l=document.createElement("div");if(l.className=o.headerActions,n){const e=document.createElement("button");e.type="button",e.className=`${o.headerBtnWindows} ${o.headerBtnWindowsStyle}`,e.setAttribute("aria-label","Toggle style"),e.setAttribute("data-control","style"),e.innerHTML="◇",l.appendChild(e)}if(i){const e=document.createElement("button");e.type="button",e.className=`${o.headerBtnWindows}${s?` ${o.headerBtnWindowsDisabled}`:""}`,e.setAttribute("aria-label","Minimize"),e.setAttribute("data-control","minimize"),e.innerHTML="–",s&&(e.disabled=!0,e.title="Enable dock to minimize"),l.appendChild(e)}const d=document.createElement("button");d.type="button",d.className=`${o.headerBtnWindows} ${o.headerBtnWindowsClose}`,d.setAttribute("aria-label","Close"),d.setAttribute("data-control","close"),d.innerHTML="×",l.appendChild(d),e.appendChild(l)}createBodyElement(){const e=document.createElement("div");return e.className=o.body,e}createFooterElement(){const e=document.createElement("div");return e.className=o.footer,e}createResizeHandles(){const e=document.createElement("div");e.className=o.resizeHandles,e.setAttribute("role","group"),e.setAttribute("aria-label","Resize handles");for(const t of s){const s=document.createElement("div");s.className=`${o.resizeHandle} ${o.resizePrefix}${t}`,s.setAttribute("role","separator"),s.setAttribute("tabindex","0"),s.setAttribute("aria-label",`Resize ${t}`),s.setAttribute("aria-orientation","n"===t||"s"===t?"horizontal":"vertical"),s.setAttribute(i.resizeDirection,t),e.appendChild(s)}return e}updateFromState(e){this.dialogEl.className=e.cssClasses.join(" "),this.updateStyles(e.style),this.dialogEl.setAttribute("data-state",e.dataState),this.dialogEl.setAttribute("data-animation-phase",e.dataAnimationPhase)}updateStyles(e){for(const[t,o]of Object.entries(e))t.startsWith("--")?this.dialogEl.style.setProperty(t,String(o)):this.dialogEl.style.setProperty(t,"number"==typeof o?String(o):o)}setupEventHandlers(){const e=this.abortController.signal,t="macos"===this.configHelper.getAppearance("headerLayout")?`.${o.headerLight}`:`.${o.headerBtnWindows}`;this.headerEl.addEventListener("pointerdown",e=>{e.target.closest(t)||this.controller.startDrag(e)},{signal:e}),this.dialogEl.addEventListener("pointermove",e=>{this.controller.handlePointerMove(e)},{signal:e}),this.dialogEl.addEventListener("pointerup",e=>{this.controller.handlePointerUp(e)},{signal:e}),this.headerEl.addEventListener("click",e=>{const t=e.target.closest("button");if(!t)return;const o=t.getAttribute("data-control");"close"===o?this.controller.close():"minimize"===o?this.controller.minimize():"style"===o&&this.controller.toggleTransparency()},{signal:e}),this.resizeHandlesContainer&&this.resizeHandlesContainer.addEventListener("pointerdown",e=>{const t=e.target.closest(`.${o.resizeHandle}`);if(!t)return;const s=t.getAttribute(i.resizeDirection);s&&this.controller.startResize(e,s)},{signal:e}),this.dialogEl.addEventListener("keydown",e=>{this.controller.handleKeyDown(e)},{signal:e}),this.dialogEl.addEventListener("pointerdown",()=>{this.controller.bringToFront()},{signal:e})}}class V{constructor(e){t(this,"containerEl"),t(this,"dockEl"),t(this,"parentContainer"),t(this,"unsubscribe"),t(this,"abortController",new AbortController),t(this,"isAttached",!1),t(this,"options"),this.options=e,this.parentContainer=e.container,this.containerEl=this.createContainerDOM(),this.dockEl=this.createDockDOM(),this.containerEl.appendChild(this.dockEl),this.unsubscribe=c(()=>{this.render()}),this.render()}createContainerDOM(){const e=document.createElement("div");return e.setAttribute("data-dock-container","true"),e}createDockDOM(){const e=document.createElement("div");return e.className=o.dock,e}render(){const e=S();if(!e.features.dock)return void(this.isAttached&&(this.containerEl.remove(),this.isAttached=!1));const t=j();if(0===t.length)return void(this.isAttached&&(this.containerEl.remove(),this.isAttached=!1));this.isAttached||(this.parentContainer.appendChild(this.containerEl),this.isAttached=!0);const o=e.dock.position;if(this.containerEl.className=B(o,0===t.length),this.containerEl.style.zIndex=String(x("DOCK")),this.dockEl.className=R(o,"horizontal"),this.dockEl.innerHTML="","free"===o){const e=this.createDockHandle();this.dockEl.appendChild(e)}const i=h(),s=e.dock.labelMode;for(const e of t){const t=e.lastChildId?i.get(e.lastChildId):null,o=this.createDockItem(e,t??null,s);this.dockEl.appendChild(o)}}createDockHandle(){const e=document.createElement("button");return e.type="button",e.className=o.dockHandle,e.setAttribute("aria-label","Drag dock"),e}createDockItem(e,t,s){const n=document.createElement("button"),a=[o.dockItem,e.glow&&o.dockItemHasGlow,e.lastChildId&&o.dockItemHasChild,"beside"===s&&o.dockItemLabelBeside,"below"===s&&o.dockItemLabelBelow].filter(Boolean).join(" ");n.className=a,n.setAttribute(i.modalId,P(e.id)),n.setAttribute("aria-label",`Restore ${e.title}`),e.glow&&n.style.setProperty("--modal-dock-glow-color",e.glow.color);const r=document.createElement("span");if(r.className=o.dockItemIcon,e.icon&&this.options.renderIcon){const t=this.options.renderIcon(e.icon);t?r.appendChild(t):r.appendChild(this.createIconPlaceholder(e.title))}else r.appendChild(this.createIconPlaceholder(e.title));if(n.appendChild(r),"hidden"!==s){const t=document.createElement("span");t.className=o.dockItemLabel,t.textContent=e.title,n.appendChild(t)}const l=document.createElement("span");if(l.className=o.dockItemGlow,n.appendChild(l),e.lastChildId&&t){const e=document.createElement("span");if(e.className=o.dockChildIndicator,t.icon&&this.options.renderIcon){const o=this.options.renderIcon(t.icon);o?e.appendChild(o):e.textContent="+"}else e.textContent="+";n.appendChild(e)}return n.addEventListener("click",t=>{m(e.id)?p(t.currentTarget):u(e.id)},{signal:this.abortController.signal}),n}createIconPlaceholder(e){const t=document.createElement("span");return t.className=o.dockItemIconPlaceholder,t.textContent=e.charAt(0),t}destroy(){this.abortController.abort(),this.unsubscribe(),this.isAttached&&(this.containerEl.remove(),this.isAttached=!1)}}class Z{constructor(e){t(this,"element"),t(this,"unsubscribe"),t(this,"abortController",new AbortController),this.element=this.createDOM(),e.container.appendChild(this.element),this.unsubscribe=c(()=>{this.render()}),this.render()}createDOM(){const e=document.createElement("div");return e.className=o.backdrop,e.addEventListener("click",()=>{W().blockClicks&&b()},{signal:this.abortController.signal}),e}render(){W().visible?G()?(this.element.classList.add(o.backdropVisible),this.element.style.display=""):(this.element.classList.remove(o.backdropVisible),this.element.style.display="none"):this.element.style.display="none"}destroy(){this.abortController.abort(),this.unsubscribe(),this.element.remove()}}function q(e){if("string"==typeof e){const t=document.createElement("div");return t.innerHTML=e,t}return e}function J(e){const{content:t,footer:o,customIcon:i,...s}=e,n=t?q(t):void 0,a=o?q(o):void 0,r=new U({...s,container:document.body,content:n,footer:a});return{destroy:()=>r.destroy(),update:e=>{}}}function Q(){const e=new V({container:document.body});return{destroy:()=>e.destroy()}}function X(){const e=new Z({container:document.body});return{destroy:()=>e.destroy()}}function Y(e={}){const{config:t}=e;t&&$(t),F(),_();const o=S(),i=e.backdrop??o.features.backdrop?X():null,s=e.dock??o.features.dock?Q():null;return{backdrop:i,dock:s,destroy:()=>{null==i||i.destroy(),null==s||s.destroy(),K()}}}export{g as bringToFront,E as closeAllModals,C as closeModal,X as createBackdrop,Q as createDock,J as createModal,T as getConfig,f as getDockOrder,y as getModalState,k as getModalsStore,Y as init,A as isModalOpen,M as isModalRegistered,v as minimizeModal,H as openChildModal,I as openModal,z as reorderDock,N as restoreAllMinimizedModals,w as restoreModal,O as setConfig,L as toggleModalTransparency};
1
+ var e=Object.defineProperty,t=(t,i,o)=>((t,i,o)=>i in t?e(t,i,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[i]=o)(t,"symbol"!=typeof i?i+"":i,o);import{Y as i,p as o,q as n,j as s,M as a,C as r,u as l,D as d,R as c,s as h,J as p,U as m,B as u,V as b,n as E,L as g,N as f,r as C,k as y,O as v,y as k,Z as A,A as H,E as w,F as I,G as N,I as z}from"./backdrop.js";import{d as L,f as M,h as $,m as O,e as D,_ as S,t as T}from"./backdrop.js";class x{constructor(e){t(this,"controller"),t(this,"dialogEl"),t(this,"headerEl"),t(this,"bodyEl"),t(this,"footerEl",null),t(this,"resizeHandlesContainer",null),t(this,"container"),t(this,"options"),t(this,"configHelper"),t(this,"unsubscribe",null),t(this,"abortController",new AbortController),this.options=e,this.container=e.container,this.configHelper=i(e.config),o(n({id:e.id,title:e.title,icon:e.icon,autoOpen:e.autoOpen??!0,glow:e.glow})),(e.autoOpen??!0)&&s(e.id),this.dialogEl=this.createDialogElement(),this.headerEl=this.createHeaderElement(),this.bodyEl=this.createBodyElement(),e.footer&&(this.footerEl=this.createFooterElement(),this.footerEl.appendChild(e.footer)),this.configHelper.isFeatureEnabled("resize")&&(this.resizeHandlesContainer=this.createResizeHandles()),this.dialogEl.appendChild(this.headerEl),this.dialogEl.appendChild(this.bodyEl),this.footerEl&&this.dialogEl.appendChild(this.footerEl),this.resizeHandlesContainer&&this.dialogEl.appendChild(this.resizeHandlesContainer),e.content&&this.bodyEl.appendChild(e.content);const r={id:e.id,title:e.title,icon:e.icon,config:e.config,maxWidth:e.maxWidth,preferredHeight:e.preferredHeight,glow:e.glow,closeOnEscape:e.closeOnEscape??!0,autoOpen:e.autoOpen??!0,openSourcePosition:e.openSourcePosition,onClose:e.onClose,skipRegistration:!0,configHelper:this.configHelper};this.controller=new a(r),this.container.appendChild(this.dialogEl),this.controller.mount(this.dialogEl),this.unsubscribe=this.controller.subscribe(e=>{this.updateFromState(e)}),this.updateFromState(this.controller.getState()),this.setupEventHandlers()}update(e){if(void 0!==e.title&&e.title!==this.options.title){this.options.title=e.title;const t=this.headerEl.querySelector(`.${r.headerTitle}`);t&&(t.textContent=e.title)}void 0!==e.content&&(this.options.content=e.content,this.bodyEl.innerHTML="",this.bodyEl.appendChild(e.content)),void 0!==e.footer&&(this.options.footer=e.footer,this.footerEl?(this.footerEl.innerHTML="",this.footerEl.appendChild(e.footer)):e.footer&&(this.footerEl=this.createFooterElement(),this.footerEl.appendChild(e.footer),this.resizeHandlesContainer?this.dialogEl.insertBefore(this.footerEl,this.resizeHandlesContainer):this.dialogEl.appendChild(this.footerEl))),this.controller.updateOptions({maxWidth:e.maxWidth,preferredHeight:e.preferredHeight,glow:e.glow,closeOnEscape:e.closeOnEscape}),void 0!==e.maxWidth&&(this.options.maxWidth=e.maxWidth),void 0!==e.preferredHeight&&(this.options.preferredHeight=e.preferredHeight),void 0!==e.glow&&(this.options.glow=e.glow),void 0!==e.closeOnEscape&&(this.options.closeOnEscape=e.closeOnEscape)}destroy(){var e;this.abortController.abort(),null==(e=this.unsubscribe)||e.call(this),this.controller.destroy(),l(this.options.id),this.dialogEl.remove()}createDialogElement(){const e=document.createElement("div");return e.className=r.dialog,e.setAttribute(d.modalId,String(this.options.id)),e.setAttribute("role","dialog"),e.setAttribute("aria-modal","true"),e.setAttribute("aria-labelledby",`${this.options.id}-title`),e.setAttribute("tabindex","-1"),e}createHeaderElement(){const e=document.createElement("header"),t=this.configHelper.isFeatureEnabled("drag"),i=this.configHelper.getAppearance("headerLayout"),o=this.configHelper.isFeatureEnabled("minimize"),n=!this.configHelper.isFeatureEnabled("dock"),s=this.configHelper.isFeatureEnabled("transparency");e.className=t?`${r.header} ${r.headerDraggable}`:r.header;const a=this.getIconElement();return"macos"===i?this.createMacOSHeader(e,a,o,n,s):this.createWindowsHeader(e,a,o,n,s),e}getIconElement(){return this.options.iconElement?this.options.iconElement:this.options.icon&&this.options.renderIcon?this.options.renderIcon(this.options.icon):null}createMacOSHeader(e,t,i,o,n){const s=document.createElement("div");s.className=r.headerTrafficLights;const a=document.createElement("button");if(a.type="button",a.className=`${r.headerLight} ${r.headerLightClose}`,a.setAttribute("aria-label","Close"),a.setAttribute("data-control","close"),s.appendChild(a),i){const e=document.createElement("button");e.type="button",e.className=`${r.headerLight} ${r.headerLightMinimize}${o?` ${r.headerLightDisabled}`:""}`,e.setAttribute("aria-label","Minimize"),e.setAttribute("data-control","minimize"),o&&(e.disabled=!0,e.title="Enable dock to minimize"),s.appendChild(e)}if(n){const e=document.createElement("button");e.type="button",e.className=`${r.headerLight} ${r.headerLightStyle}`,e.setAttribute("aria-label","Toggle style"),e.setAttribute("data-control","style"),s.appendChild(e)}e.appendChild(s);const l=document.createElement("div");if(l.className=r.headerMacCenter,t){const e=document.createElement("div");e.className=r.headerIcon,e.appendChild(t),l.appendChild(e)}const d=document.createElement("div");d.className=r.headerTitleGroup;const c=document.createElement("h2");c.className=r.headerTitle,c.id=`${this.options.id}-title`,c.textContent=this.options.title,d.appendChild(c),l.appendChild(d),e.appendChild(l);const h=document.createElement("div");h.className=r.headerMacSpacer,e.appendChild(h)}createWindowsHeader(e,t,i,o,n){const s=document.createElement("div");if(s.className=r.headerTitleGroup,t){const e=document.createElement("div");e.className=r.headerIcon,e.appendChild(t),s.appendChild(e)}const a=document.createElement("h2");a.className=r.headerTitle,a.id=`${this.options.id}-title`,a.textContent=this.options.title,s.appendChild(a),e.appendChild(s);const l=document.createElement("div");if(l.className=r.headerActions,n){const e=document.createElement("button");e.type="button",e.className=`${r.headerBtnWindows} ${r.headerBtnWindowsStyle}`,e.setAttribute("aria-label","Toggle style"),e.setAttribute("data-control","style"),e.innerHTML="◇",l.appendChild(e)}if(i){const e=document.createElement("button");e.type="button",e.className=`${r.headerBtnWindows}${o?` ${r.headerBtnWindowsDisabled}`:""}`,e.setAttribute("aria-label","Minimize"),e.setAttribute("data-control","minimize"),e.innerHTML="–",o&&(e.disabled=!0,e.title="Enable dock to minimize"),l.appendChild(e)}const d=document.createElement("button");d.type="button",d.className=`${r.headerBtnWindows} ${r.headerBtnWindowsClose}`,d.setAttribute("aria-label","Close"),d.setAttribute("data-control","close"),d.innerHTML="×",l.appendChild(d),e.appendChild(l)}createBodyElement(){const e=document.createElement("div");return e.className=r.body,e}createFooterElement(){const e=document.createElement("div");return e.className=r.footer,e}createResizeHandles(){const e=document.createElement("div");e.className=r.resizeHandles,e.setAttribute("role","group"),e.setAttribute("aria-label","Resize handles");for(const t of c){const i=document.createElement("div");i.className=`${r.resizeHandle} ${r.resizePrefix}${t}`,i.setAttribute("role","separator"),i.setAttribute("tabindex","0"),i.setAttribute("aria-label",`Resize ${t}`),i.setAttribute("aria-orientation","n"===t||"s"===t?"horizontal":"vertical"),i.setAttribute(d.resizeDirection,t),e.appendChild(i)}return e}updateFromState(e){this.dialogEl.className=e.cssClasses.join(" "),this.updateStyles(e.style),this.dialogEl.setAttribute("data-state",e.dataState),this.dialogEl.setAttribute("data-animation-phase",e.dataAnimationPhase)}updateStyles(e){for(const[t,i]of Object.entries(e))t.startsWith("--")?this.dialogEl.style.setProperty(t,String(i)):this.dialogEl.style.setProperty(t,"number"==typeof i?String(i):i)}setupEventHandlers(){const e=this.abortController.signal,t="macos"===this.configHelper.getAppearance("headerLayout")?`.${r.headerLight}`:`.${r.headerBtnWindows}`;this.headerEl.addEventListener("pointerdown",e=>{e.target.closest(t)||this.controller.startDrag(e)},{signal:e}),this.dialogEl.addEventListener("pointermove",e=>{this.controller.handlePointerMove(e)},{signal:e}),this.dialogEl.addEventListener("pointerup",e=>{this.controller.handlePointerUp(e)},{signal:e}),this.headerEl.addEventListener("click",e=>{const t=e.target.closest("button");if(!t)return;const i=t.getAttribute("data-control");"close"===i?this.controller.close():"minimize"===i?this.controller.minimize():"style"===i&&this.controller.toggleTransparency()},{signal:e}),this.resizeHandlesContainer&&this.resizeHandlesContainer.addEventListener("pointerdown",e=>{const t=e.target.closest(`.${r.resizeHandle}`);if(!t)return;const i=t.getAttribute(d.resizeDirection);i&&this.controller.startResize(e,i)},{signal:e}),this.dialogEl.addEventListener("keydown",e=>{this.controller.handleKeyDown(e)},{signal:e}),this.dialogEl.addEventListener("pointerdown",()=>{this.controller.bringToFront()},{signal:e})}}class W{constructor(e){t(this,"containerEl"),t(this,"dockEl"),t(this,"parentContainer"),t(this,"unsubscribe"),t(this,"abortController",new AbortController),t(this,"isAttached",!1),t(this,"options"),this.options=e,this.parentContainer=e.container,this.containerEl=this.createContainerDOM(),this.dockEl=this.createDockDOM(),this.containerEl.appendChild(this.dockEl),this.unsubscribe=h(()=>{this.render()}),this.render()}createContainerDOM(){const e=document.createElement("div");return e.setAttribute("data-dock-container","true"),e}createDockDOM(){const e=document.createElement("div");return e.className=r.dock,e}render(){const e=y();if(!e.features.dock)return void(this.isAttached&&(this.containerEl.remove(),this.isAttached=!1));const t=p();if(0===t.length)return void(this.isAttached&&(this.containerEl.remove(),this.isAttached=!1));this.isAttached||(this.parentContainer.appendChild(this.containerEl),this.isAttached=!0);const i=e.dock.position;if(this.containerEl.className=m(i,0===t.length),this.containerEl.style.zIndex=String(u("DOCK")),this.dockEl.className=b(i,"horizontal"),this.dockEl.innerHTML="","free"===i){const e=this.createDockHandle();this.dockEl.appendChild(e)}const o=v(),n=e.dock.labelMode;for(const e of t){const t=e.lastChildId?o.get(e.lastChildId):null,i=this.createDockItem(e,t??null,n);this.dockEl.appendChild(i)}}createDockHandle(){const e=document.createElement("button");return e.type="button",e.className=r.dockHandle,e.setAttribute("aria-label","Drag dock"),e}createDockItem(e,t,i){const o=document.createElement("button"),n=[r.dockItem,e.glow&&r.dockItemHasGlow,e.lastChildId&&r.dockItemHasChild,"beside"===i&&r.dockItemLabelBeside,"below"===i&&r.dockItemLabelBelow].filter(Boolean).join(" ");o.className=n,o.setAttribute(d.modalId,E(e.id)),o.setAttribute("aria-label",`Restore ${e.title}`),e.glow&&o.style.setProperty("--modal-dock-glow-color",e.glow.color);const s=document.createElement("span");if(s.className=r.dockItemIcon,e.icon&&this.options.renderIcon){const t=this.options.renderIcon(e.icon);t?s.appendChild(t):s.appendChild(this.createIconPlaceholder(e.title))}else s.appendChild(this.createIconPlaceholder(e.title));if(o.appendChild(s),"hidden"!==i){const t=document.createElement("span");t.className=r.dockItemLabel,t.textContent=e.title,o.appendChild(t)}const a=document.createElement("span");if(a.className=r.dockItemGlow,o.appendChild(a),e.lastChildId&&t){const e=document.createElement("span");if(e.className=r.dockChildIndicator,t.icon&&this.options.renderIcon){const i=this.options.renderIcon(t.icon);i?e.appendChild(i):e.textContent="+"}else e.textContent="+";o.appendChild(e)}return o.addEventListener("click",t=>{g(e.id)?f(t.currentTarget):C(e.id)},{signal:this.abortController.signal}),o}createIconPlaceholder(e){const t=document.createElement("span");return t.className=r.dockItemIconPlaceholder,t.textContent=e.charAt(0),t}destroy(){this.abortController.abort(),this.unsubscribe(),this.isAttached&&(this.containerEl.remove(),this.isAttached=!1)}}class B{constructor(e){t(this,"element"),t(this,"unsubscribe"),t(this,"abortController",new AbortController),this.element=this.createDOM(),e.container.appendChild(this.element),this.unsubscribe=h(()=>{this.render()}),this.render()}createDOM(){const e=document.createElement("div");return e.className=r.backdrop,e.addEventListener("click",()=>{k().blockClicks&&A()},{signal:this.abortController.signal}),e}render(){k().visible?H()?(this.element.classList.add(r.backdropVisible),this.element.style.display=""):(this.element.classList.remove(r.backdropVisible),this.element.style.display="none"):this.element.style.display="none"}destroy(){this.abortController.abort(),this.unsubscribe(),this.element.remove()}}function F(e){if("string"==typeof e){const t=document.createElement("div");return t.innerHTML=e,t}return e}function P(e){const{content:t,footer:i,customIcon:o,...n}=e,s=t?F(t):void 0,a=i?F(i):void 0,r=o?F(o):n.iconElement,l=new x({...n,container:document.body,content:s,footer:a,iconElement:r});return{destroy:()=>l.destroy(),update:e=>{const{content:t,footer:i,...o}=e;l.update({...o,content:void 0!==t?F(t):void 0,footer:void 0!==i?F(i):void 0})}}}function R(){const e=new W({container:document.body});return{destroy:()=>e.destroy()}}function j(){const e=new B({container:document.body});return{destroy:()=>e.destroy()}}function G(e={}){const{config:t}=e;t&&w(t),I(),N();const i=y(),o=e.backdrop??i.features.backdrop?j():null,n=e.dock??i.features.dock?R():null;return{backdrop:o,dock:n,destroy:()=>{null==o||o.destroy(),null==n||n.destroy(),z()}}}export{s as bringToFront,A as closeAllModals,L as closeModal,j as createBackdrop,R as createDock,P as createModal,y as getConfig,M as getModalState,v as getModalsStore,G as init,$ as isModalOpen,O as minimizeModal,D as openModal,C as restoreModal,w as setConfig,S as toggleModalTransparency,T as triggerAttention};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "epic-modals",
3
- "version": "1.0.3",
3
+ "version": "1.0.5",
4
4
  "description": "A stunning modal library with macOS-style animations, drag, resize, and dock. Supports Svelte 5, React, and vanilla JS.",
5
5
  "keywords": [
6
6
  "modal",