atomicuilibrary 0.0.1 → 0.1.0

package/dist/components/ui-speed-dial.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as e,createEvent as i,h as a,Host as o,transformTag as s}from"@stencil/core/internal/client";import{d as r,a as n}from"./badge.js";import{d}from"./icon.js";const l=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.actionClick=i(this,"actionClick",7),this.speedDialToggle=i(this,"speedDialToggle",7)}get el(){return this}position="bottom-right";actions=[];strategy="fixed";icon="plus";iconLibrary="se";toggleIcon;actionLibrary="default";color="primary";size="md";variant="solid";direction="auto";shape="rounded";tooltipPosition="auto";showTooltips=!0;labelPosition="auto";labelHide=!1;trigger="click";layout="linear";closeOnScroll=!1;glassy=!1;magnetic=!1;magneticStrength=.3;magneticRadius=150;persistenceId;isDraggable=!1;isOpen=!1;magneticTransform={x:0,y:0};itemAngles=[];dragOffset={x:0,y:0};isDragging=!1;isElastic=!1;actionClick;speedDialToggle;mainButton;closeTimer;dragStartPos={x:0,y:0};initialOffset={x:0,y:0};componentWillLoad(){this.loadPersistedPosition()}loadPersistedPosition(){if(this.persistenceId&&this.isDraggable){const t=localStorage.getItem("ui-speed-dial-pos-"+this.persistenceId);if(t)try{this.dragOffset=JSON.parse(t)}catch(t){console.error("Failed to load SpeedDial position",t)}}}savePersistedPosition(){this.persistenceId&&this.isDraggable&&localStorage.setItem("ui-speed-dial-pos-"+this.persistenceId,JSON.stringify(this.dragOffset))}getActions(){if("string"==typeof this.actions)try{return JSON.parse(this.actions)}catch{return[]}return this.actions}getDialDirection(){return"auto"!==this.direction?this.direction:"center"===this.position||this.position.startsWith("bottom")?"up":this.position.startsWith("top")?"down":this.position.endsWith("right")?"left":"right"}getTooltipPosition(){if(this.labelPosition&&"auto"!==this.labelPosition)return this.labelPosition;if(this.tooltipPosition&&"auto"!==this.tooltipPosition)return this.tooltipPosition;const t=this.el.getBoundingClientRect();return this.position.endsWith("right")?t.left<120?"right":"left":this.position.endsWith("left")?t.right>window.innerWidth-120?"left":"right":this.position.startsWith("top")?t.bottom>window.innerHeight-120?"top":"bottom":"top"}toggleDial=()=>{this.isDragging||(this.triggerElastic(),this.setOpen(!this.isOpen))};triggerElastic(){this.isElastic=!0,setTimeout((()=>this.isElastic=!1),400)}handleOpenChange(t){t&&this.calculateSafeAngles()}calculateSafeAngles(){if("linear"===this.layout)return;const t=this.getActions().length;if(0===t)return;const e=[],i=this.el.getBoundingClientRect(),a=100;let o=0,s=360;if("arc"===this.layout){const t=this.getDialDirection();"up"===t?(o=180,s=360):"down"===t?(o=0,s=180):"left"===t?(o=90,s=270):"right"===t&&(o=270,s=450),!(i.right>window.innerWidth-a||this.position.includes("right"))||"up"!==t&&"auto"!==t||(o-=45,s-=45),!(i.left<a||this.position.includes("left"))||"up"!==t&&"auto"!==t||(o+=45,s+=45),!(i.top<a||this.position.includes("top"))||"right"!==t&&"auto"!==t||(o+=45,s+=45),!(i.bottom>window.innerHeight-a||this.position.includes("bottom"))||"right"!==t&&"auto"!==t||(o-=45,s-=45),"center-left"===this.position&&(o=270,s=450),"center-right"===this.position&&(o=90,s=270)}const r=t>1?(s-o)/("radial"===this.layout?t:t-1):0;for(let i=0;i<t;i++)e.push(o+i*r);this.itemAngles=e}setOpen(t){this.isOpen!==t&&(this.isOpen=t,this.speedDialToggle.emit(this.isOpen))}handleActionClick=t=>{t.disabled||(this.actionClick.emit(t.id+""),this.setOpen(!1))};handleBackdropClick=()=>{this.isOpen&&"hover"!==this.trigger&&this.setOpen(!1)};handleWindowScroll(){this.isOpen&&this.closeOnScroll&&this.setOpen(!1)}handleGlobalKeyDown(t){const e=this.getActions();if(!e||0===e.length)return;const i=e.find((e=>e.shortcut===t.key&&!e.disabled));return i?(t.preventDefault(),void this.handleActionClick(i)):void 0}handleMouseMove(t){if(!this.magnetic)return;const e=this.el.getBoundingClientRect(),i=t.clientX-(e.left+e.width/2),a=t.clientY-(e.top+e.height/2),o=Math.sqrt(i*i+a*a);if(o<this.magneticRadius){const t=1-o/this.magneticRadius;this.magneticTransform={x:i*this.magneticStrength*t,y:a*this.magneticStrength*t}}else 0===this.magneticTransform.x&&0===this.magneticTransform.y||(this.magneticTransform={x:0,y:0})}onMouseDown(t){this.isDraggable&&(this.isDragging=!0,this.dragStartPos={x:t.clientX,y:t.clientY},this.initialOffset={...this.dragOffset},this.setOpen(!1),document.addEventListener("mousemove",this.onMouseMove),document.addEventListener("mouseup",this.onMouseUp))}onMouseMove=t=>{this.isDragging&&(this.dragOffset={x:this.initialOffset.x+(t.clientX-this.dragStartPos.x),y:this.initialOffset.y+(t.clientY-this.dragStartPos.y)})};onMouseUp=()=>{this.isDragging=!1,document.removeEventListener("mousemove",this.onMouseMove),document.removeEventListener("mouseup",this.onMouseUp),this.savePersistedPosition()};onMouseEnter=()=>{"hover"===this.trigger&&(clearTimeout(this.closeTimer),this.setOpen(!0))};onMouseLeave=()=>{"hover"===this.trigger&&(this.closeTimer=setTimeout((()=>{this.setOpen(!1)}),300))};handleLocalKeyDown(t){if(!this.isOpen)return;const e=Array.from(this.el.shadowRoot?.querySelectorAll(".speed-dial-action")??[]);if((document.activeElement===this.mainButton||this.el.shadowRoot?.activeElement===this.mainButton)&&["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(t.key))return t.preventDefault(),void(e.length>0&&e[e.length-1].focus());const i=e.indexOf(this.el.shadowRoot?.activeElement);"Escape"===t.key?(this.setOpen(!1),this.mainButton.focus()):-1!==i&&(["ArrowDown","ArrowRight"].includes(t.key)?(t.preventDefault(),e[(i+1)%e.length].focus()):["ArrowUp","ArrowLeft"].includes(t.key)&&(t.preventDefault(),e[(i-1+e.length)%e.length].focus()))}render(){const t=this.getActions(),e=this.getDialDirection(),i=this.getTooltipPosition(),s={"speed-dial-container":!0,["speed-dial-"+this.size]:!0,"speed-dial-open":this.isOpen,"speed-dial-glassy":this.glassy,"speed-dial-dragging":this.isDragging,"speed-dial-elastic":this.isElastic},r={"speed-dial-button":!0,"speed-dial-main":!0,["speed-dial-"+this.color]:!0,["speed-dial-variant-"+this.variant]:!0,["speed-dial-shape-"+this.shape]:!0,"speed-dial-button-open":this.isOpen,"speed-dial-button-has-toggle-icon":!!this.toggleIcon},n={"speed-dial-actions":!0,["speed-dial-actions-"+e]:!0,["speed-dial-layout-"+this.layout]:!0};return a(o,{key:"044e35eacc272591b4f60488eb366c40c1b1f236",class:{["speed-dial-strategy-"+this.strategy]:!0,["speed-dial-"+this.position]:!0},onMouseEnter:this.onMouseEnter,onMouseLeave:this.onMouseLeave},a("div",{key:"37b6426b0b26e5fbb55a7d52a1b1a515a3d56954",class:s,style:{"--magnetic-x":this.magneticTransform.x+"px","--magnetic-y":this.magneticTransform.y+"px","--drag-x":this.dragOffset.x+"px","--drag-y":this.dragOffset.y+"px",transform:"translate(calc(var(--magnetic-x, 0px) + var(--drag-x, 0px)), calc(var(--magnetic-y, 0px) + var(--drag-y, 0px)))",transition:0!==this.magneticTransform.x||this.isDragging?"none":"transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1)",cursor:this.isDraggable?this.isDragging?"grabbing":"grab":"default"}},this.isOpen&&"click"===this.trigger&&a("div",{key:"4abeed7f2425ec14494dd7bb8e772eee322ff6a6",class:"speed-dial-backdrop",onClick:this.handleBackdropClick}),a("div",{key:"0bfdc8b5ce0ca3949742414078299c3fda31d755",class:n,role:"menu","aria-orientation":["top","bottom"].includes(e)?"vertical":"horizontal"},this.isOpen&&t.map(((t,e)=>a("div",{key:t.id,class:"speed-dial-action-wrapper",style:{"--item-angle":(this.itemAngles[e]||0)+"deg","--index":""+e,"--stagger-delay":.05*e+"s","animation-delay":.05*e+"s"}},a("ui-button",{variant:"ghost",class:{"speed-dial-action":!0,["speed-dial-"+(t.variant||this.variant)]:!0,["speed-dial-variant-"+(t.variant||this.variant)]:!0,["speed-dial-shape-"+(t.shape||this.shape)]:!0,["speed-dial-"+(t.color||this.color)]:!0,"speed-dial-action-disabled":t.disabled},onClick:()=>this.handleActionClick(t),disabled:t.disabled,ariaLabel:t.label,style:{backgroundColor:t.color||void 0}},a("span",{class:"speed-dial-action-icon"},a("ui-icon",{name:t.icon,library:t.iconLibrary||this.actionLibrary,size:"1.25em"})),t.badge&&a("span",{class:"speed-dial-action-badge",style:{backgroundColor:t.badgeColor}},t.badge),t.shortcut&&a("span",{class:"speed-dial-action-shortcut"},t.shortcut)),this.showTooltips&&t.label&&a("div",{class:{"speed-dial-tooltip":!0,["speed-dial-tooltip-"+i]:!0,"speed-dial-tooltip-hidden":this.labelHide}},t.label))))),a("ui-button",{key:"3a6825fce27f39d7a4a689b4e860b7363b34e67f",variant:"ghost",class:r,onClick:this.toggleDial,ariaLabel:"Speed dial menu","aria-expanded":this.isOpen?"true":"false","aria-haspopup":"true",ref:t=>this.mainButton=t},a("slot",{key:"b59d109049ce98eae735d4e598a929669171d247",name:"trigger-icon"},a("span",{key:"3d3c55dbbd3b67ade9dbd28a66b60feb2483e12a",class:"speed-dial-icon"},a("ui-icon",{key:"b0c231ad4fe207ca18e2b8efcf8ad891072d7c65",name:this.isOpen&&this.toggleIcon?this.toggleIcon:this.icon,library:this.iconLibrary,size:"1.5rem"}))))))}static get watchers(){return{isOpen:[{handleOpenChange:0}]}}static get style(){return'.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;z-index:1000;position:fixed;left:auto;right:auto;top:auto;bottom:auto}:host(.speed-dial-strategy-absolute){position:absolute}:host(.speed-dial-strategy-fixed){position:fixed}.speed-dial-container{position:relative}:host(.speed-dial-top-left){top:var(--speed-dial-top, 24px);left:var(--speed-dial-left, 24px)}:host(.speed-dial-top-right){top:var(--speed-dial-top, 24px);right:var(--speed-dial-right, 24px)}:host(.speed-dial-bottom-left){bottom:var(--speed-dial-bottom, 24px);left:var(--speed-dial-left, 24px)}:host(.speed-dial-bottom-right){bottom:var(--speed-dial-bottom, 24px);right:var(--speed-dial-right, 24px)}:host(.speed-dial-center),:host(.speed-dial-bottom-center){left:50%;bottom:var(--speed-dial-bottom, 24px);transform:translateX(-50%)}:host(.speed-dial-top-center){left:50%;top:var(--speed-dial-top, 24px);transform:translateX(-50%)}:host(.speed-dial-center-left){left:var(--speed-dial-left, 24px);top:50%;transform:translateY(-50%)}:host(.speed-dial-center-right){right:var(--speed-dial-right, 24px);top:50%;transform:translateY(-50%)}.speed-dial-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;opacity:0;animation:fadeIn 0.2s forwards;z-index:-1}.speed-dial-glassy .speed-dial-backdrop{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}@keyframes fadeIn{to{opacity:1}}.speed-dial-button{position:relative;z-index:2;display:flex !important;align-items:center;justify-content:center;cursor:pointer;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);outline:none;-webkit-tap-highlight-color:transparent;background:transparent !important;border:none;padding:0;margin:0}.speed-dial-elastic .speed-dial-button{animation:speed-dial-elastic-anim 0.4s cubic-bezier(0.34, 1.56, 0.64, 1)}@keyframes speed-dial-elastic-anim{0%{transform:scale(1)}30%{transform:scale(1.15, 0.85)}60%{transform:scale(0.9, 1.1)}100%{transform:scale(1)}}.speed-dial-button:hover{box-shadow:0 6px 12px rgba(0, 0, 0, 0.3);transform:scale(1.05)}.speed-dial-button:active{transform:scale(0.95)}.speed-dial-button-open:not(.speed-dial-button-has-toggle-icon){transform:rotate(45deg)}.speed-dial-button-open:not(.speed-dial-button-has-toggle-icon):hover{transform:rotate(45deg) scale(1.05)}.speed-dial-sm .speed-dial-button{width:40px;height:40px;font-size:18px}.speed-dial-sm .speed-dial-button{width:40px;height:40px;font-size:20px}.speed-dial-md .speed-dial-button{width:56px;height:56px;font-size:24px}.speed-dial-lg .speed-dial-button{width:72px;height:72px;font-size:32px}.speed-dial-icon{transition:transform 0.3s cubic-bezier(0.4, 0, 0.2, 1)}.speed-dial-actions{position:absolute;display:flex;gap:12px;z-index:1}.speed-dial-actions-up{flex-direction:column-reverse;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:12px}.speed-dial-actions-down{flex-direction:column;top:100%;left:50%;transform:translateX(-50%);margin-top:12px}.speed-dial-actions-left{flex-direction:row-reverse;right:100%;top:50%;transform:translateY(-50%);margin-right:12px}.speed-dial-actions-right{flex-direction:row;left:100%;top:50%;transform:translateY(-50%);margin-left:12px}.speed-dial-layout-radial,.speed-dial-layout-arc{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0;height:0;overflow:visible}.speed-dial-layout-radial .speed-dial-action-wrapper,.speed-dial-layout-arc .speed-dial-action-wrapper{position:absolute;top:50%;left:50%;margin:-24px;transform-origin:center center;transition:all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);--angle:var(--item-angle, 0deg);--radius:100px;transform:rotate(var(--angle)) translate(var(--radius)) rotate(calc(-1 * var(--angle))) scale(0);opacity:0}.speed-dial-open .speed-dial-layout-radial .speed-dial-action-wrapper,.speed-dial-open .speed-dial-layout-arc .speed-dial-action-wrapper{transform:rotate(var(--angle)) translate(var(--radius)) rotate(calc(-1 * var(--angle))) scale(1);opacity:1}.speed-dial-action-wrapper{position:relative;opacity:0;transform:scale(0);animation:actionAppear 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards}@keyframes actionAppear{from{opacity:0;transform:translate(0, 0) scale(0)}to{opacity:1;transform:var(--translation, translate(0, 0)) scale(1)}}.speed-dial-layout-linear .speed-dial-action-wrapper{--translation:translate(0, 0)}.speed-dial-layout-radial .speed-dial-action-wrapper,.speed-dial-layout-arc .speed-dial-action-wrapper{--translation:translate(calc(cos(var(--angle)) * var(--radius)), calc(sin(var(--angle)) * -1 * var(--radius)))}.speed-dial-action{display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.2s ease;background:transparent !important;border:none}.speed-dial-sm .speed-dial-action{width:36px;height:36px;font-size:16px}.speed-dial-md .speed-dial-action{width:48px;height:48px;font-size:20px}.speed-dial-lg .speed-dial-action{width:60px;height:60px;font-size:24px}.speed-dial-action:hover:not(.speed-dial-action-disabled){box-shadow:0 4px 10px rgba(0, 0, 0, 0.3);transform:scale(1.1)}.speed-dial-action:active:not(.speed-dial-action-disabled){transform:scale(0.95)}.speed-dial-action-disabled{opacity:0.5;cursor:not-allowed}.speed-dial-action-icon{display:flex;align-items:center;justify-content:center}.speed-dial-action-badge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background-color:var(--color-danger, #ef4444);color:var(--text-standard, #ffffff);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);border:2px solid var(--bg-primary, #ffffff)}.speed-dial-action-shortcut{position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);background:var(--color-primary, #374151);color:var(--text-standard, #ffffff);font-size:8px;padding:1px 4px;border-radius:4px;font-weight:700;text-transform:uppercase;z-index:1000;pointer-events:none}.speed-dial-action-shortcut.speed-dial-dragging{pointer-events:auto;z-index:2000}.speed-dial-action-shortcut{opacity:0.8}.speed-dial-tooltip{position:absolute;background-color:rgba(0, 0, 0, 0.85);color:var(--text-standard, #ffffff);padding:6px 12px;border-radius:4px;font-size:12px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity 0.2s ease;z-index:1001}.speed-dial-action-wrapper:hover .speed-dial-tooltip{opacity:1}.speed-dial-tooltip-left{right:100%;top:50%;transform:translateY(-50%);margin-right:8px}.speed-dial-tooltip-right{left:100%;top:50%;transform:translateY(-50%);margin-left:8px}.speed-dial-tooltip-top{bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:8px}.speed-dial-tooltip-bottom{top:100%;left:50%;transform:translateX(-50%);margin-top:8px}.speed-dial-tooltip::after{content:"";position:absolute;width:0;height:0;border:4px solid transparent}.speed-dial-tooltip-left::after{right:-8px;top:50%;transform:translateY(-50%);border-left-color:rgba(0, 0, 0, 0.85)}.speed-dial-tooltip-right::after{left:-8px;top:50%;transform:translateY(-50%);border-right-color:rgba(0, 0, 0, 0.85)}.speed-dial-tooltip-top::after{bottom:-8px;left:50%;transform:translateX(-50%);border-top-color:rgba(0, 0, 0, 0.85)}.speed-dial-tooltip-bottom::after{top:-8px;left:50%;transform:translateX(-50%);border-bottom-color:rgba(0, 0, 0, 0.85)}.speed-dial-button:focus-visible,.speed-dial-action:focus-visible{outline:2px solid var(--color-primary-hover, #2563eb);outline-offset:2px}'}},[769,"ui-speed-dial",{position:[1],actions:[1],strategy:[1],icon:[1],iconLibrary:[1,"icon-library"],toggleIcon:[1,"toggle-icon"],actionLibrary:[1,"action-library"],color:[1],size:[1],variant:[1],direction:[1],shape:[1],tooltipPosition:[1,"tooltip-position"],showTooltips:[4,"show-tooltips"],labelPosition:[1,"label-position"],labelHide:[4,"label-hide"],trigger:[1],layout:[1],closeOnScroll:[4,"close-on-scroll"],glassy:[4],magnetic:[4],magneticStrength:[2,"magnetic-strength"],magneticRadius:[2,"magnetic-radius"],persistenceId:[1,"persistence-id"],isDraggable:[4,"is-draggable"],isOpen:[32],magneticTransform:[32],itemAngles:[32],dragOffset:[32],isDragging:[32],isElastic:[32]},[[9,"scroll","handleWindowScroll"],[8,"keydown","handleGlobalKeyDown"],[9,"mousemove","handleMouseMove"],[1,"mousedown","onMouseDown"],[0,"keydown","handleLocalKeyDown"]],{isOpen:[{handleOpenChange:0}]}]),p=l,c=function(){"undefined"!=typeof customElements&&["ui-speed-dial","ui-badge","ui-button","ui-icon"].forEach((t=>{switch(t){case"ui-speed-dial":customElements.get(s(t))||customElements.define(s(t),l);break;case"ui-badge":customElements.get(s(t))||n();break;case"ui-button":customElements.get(s(t))||r();break;case"ui-icon":customElements.get(s(t))||d()}}))};export{p as UiSpeedDial,c as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as e,createEvent as i,h as a,Host as o,transformTag as s}from"@stencil/core/internal/client";import{d as r,a as n}from"./badge.js";import{d}from"./icon.js";import{d as l}from"./loader.js";const p=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.actionClick=i(this,"actionClick",7),this.speedDialToggle=i(this,"speedDialToggle",7)}get el(){return this}position="bottom-right";actions=[];strategy="fixed";icon="plus";iconLibrary="se";toggleIcon;actionLibrary="default";color="primary";size="md";variant="solid";direction="auto";shape="rounded";tooltipPosition="auto";showTooltips=!0;labelPosition="auto";labelHide=!1;trigger="click";layout="linear";closeOnScroll=!1;glassy=!1;magnetic=!1;magneticStrength=.3;magneticRadius=150;persistenceId;isDraggable=!1;isOpen=!1;magneticTransform={x:0,y:0};itemAngles=[];dragOffset={x:0,y:0};isDragging=!1;isElastic=!1;actionClick;speedDialToggle;mainButton;closeTimer;dragStartPos={x:0,y:0};initialOffset={x:0,y:0};componentWillLoad(){this.loadPersistedPosition()}loadPersistedPosition(){if(this.persistenceId&&this.isDraggable){const t=localStorage.getItem("ui-speed-dial-pos-"+this.persistenceId);if(t)try{this.dragOffset=JSON.parse(t)}catch(t){console.error("Failed to load SpeedDial position",t)}}}savePersistedPosition(){this.persistenceId&&this.isDraggable&&localStorage.setItem("ui-speed-dial-pos-"+this.persistenceId,JSON.stringify(this.dragOffset))}getActions(){if("string"==typeof this.actions)try{return JSON.parse(this.actions)}catch{return[]}return this.actions}getDialDirection(){return"auto"!==this.direction?this.direction:"center"===this.position||this.position.startsWith("bottom")?"up":this.position.startsWith("top")?"down":this.position.endsWith("right")?"left":"right"}getTooltipPosition(){if(this.labelPosition&&"auto"!==this.labelPosition)return this.labelPosition;if(this.tooltipPosition&&"auto"!==this.tooltipPosition)return this.tooltipPosition;const t=this.el.getBoundingClientRect();return this.position.endsWith("right")?t.left<120?"right":"left":this.position.endsWith("left")?t.right>window.innerWidth-120?"left":"right":this.position.startsWith("top")?t.bottom>window.innerHeight-120?"top":"bottom":"top"}toggleDial=()=>{this.isDragging||(this.triggerElastic(),this.setOpen(!this.isOpen))};triggerElastic(){this.isElastic=!0,setTimeout((()=>this.isElastic=!1),400)}handleOpenChange(t){t&&this.calculateSafeAngles()}calculateSafeAngles(){if("linear"===this.layout)return;const t=this.getActions().length;if(0===t)return;const e=[],i=this.el.getBoundingClientRect(),a=100;let o=0,s=360;if("arc"===this.layout){const t=this.getDialDirection();"up"===t?(o=180,s=360):"down"===t?(o=0,s=180):"left"===t?(o=90,s=270):"right"===t&&(o=270,s=450),!(i.right>window.innerWidth-a||this.position.includes("right"))||"up"!==t&&"auto"!==t||(o-=45,s-=45),!(i.left<a||this.position.includes("left"))||"up"!==t&&"auto"!==t||(o+=45,s+=45),!(i.top<a||this.position.includes("top"))||"right"!==t&&"auto"!==t||(o+=45,s+=45),!(i.bottom>window.innerHeight-a||this.position.includes("bottom"))||"right"!==t&&"auto"!==t||(o-=45,s-=45),"center-left"===this.position&&(o=270,s=450),"center-right"===this.position&&(o=90,s=270)}const r=t>1?(s-o)/("radial"===this.layout?t:t-1):0;for(let i=0;i<t;i++)e.push(o+i*r);this.itemAngles=e}setOpen(t){this.isOpen!==t&&(this.isOpen=t,this.speedDialToggle.emit(this.isOpen))}handleActionClick=t=>{t.disabled||(this.actionClick.emit(t.id+""),this.setOpen(!1))};handleBackdropClick=()=>{this.isOpen&&"hover"!==this.trigger&&this.setOpen(!1)};handleWindowScroll(){this.isOpen&&this.closeOnScroll&&this.setOpen(!1)}handleGlobalKeyDown(t){const e=this.getActions();if(!e||0===e.length)return;const i=e.find((e=>e.shortcut===t.key&&!e.disabled));return i?(t.preventDefault(),void this.handleActionClick(i)):void 0}handleMouseMove(t){if(!this.magnetic)return;const e=this.el.getBoundingClientRect(),i=t.clientX-(e.left+e.width/2),a=t.clientY-(e.top+e.height/2),o=Math.sqrt(i*i+a*a);if(o<this.magneticRadius){const t=1-o/this.magneticRadius;this.magneticTransform={x:i*this.magneticStrength*t,y:a*this.magneticStrength*t}}else 0===this.magneticTransform.x&&0===this.magneticTransform.y||(this.magneticTransform={x:0,y:0})}onMouseDown(t){this.isDraggable&&(this.isDragging=!0,this.dragStartPos={x:t.clientX,y:t.clientY},this.initialOffset={...this.dragOffset},this.setOpen(!1),document.addEventListener("mousemove",this.onMouseMove),document.addEventListener("mouseup",this.onMouseUp))}onMouseMove=t=>{this.isDragging&&(this.dragOffset={x:this.initialOffset.x+(t.clientX-this.dragStartPos.x),y:this.initialOffset.y+(t.clientY-this.dragStartPos.y)})};onMouseUp=()=>{this.isDragging=!1,document.removeEventListener("mousemove",this.onMouseMove),document.removeEventListener("mouseup",this.onMouseUp),this.savePersistedPosition()};onMouseEnter=()=>{"hover"===this.trigger&&(clearTimeout(this.closeTimer),this.setOpen(!0))};onMouseLeave=()=>{"hover"===this.trigger&&(this.closeTimer=setTimeout((()=>{this.setOpen(!1)}),300))};handleLocalKeyDown(t){if(!this.isOpen)return;const e=Array.from(this.el.shadowRoot?.querySelectorAll(".speed-dial-action")??[]);if((document.activeElement===this.mainButton||this.el.shadowRoot?.activeElement===this.mainButton)&&["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(t.key))return t.preventDefault(),void(e.length>0&&e[e.length-1].focus());const i=e.indexOf(this.el.shadowRoot?.activeElement);"Escape"===t.key?(this.setOpen(!1),this.mainButton.focus()):-1!==i&&(["ArrowDown","ArrowRight"].includes(t.key)?(t.preventDefault(),e[(i+1)%e.length].focus()):["ArrowUp","ArrowLeft"].includes(t.key)&&(t.preventDefault(),e[(i-1+e.length)%e.length].focus()))}render(){const t=this.getActions(),e=this.getDialDirection(),i=this.getTooltipPosition(),s={"speed-dial-container":!0,["speed-dial-"+this.size]:!0,"speed-dial-open":this.isOpen,"speed-dial-glassy":this.glassy,"speed-dial-dragging":this.isDragging,"speed-dial-elastic":this.isElastic},r={"speed-dial-button":!0,"speed-dial-main":!0,["speed-dial-"+this.color]:!0,["speed-dial-variant-"+this.variant]:!0,["speed-dial-shape-"+this.shape]:!0,"speed-dial-button-open":this.isOpen,"speed-dial-button-has-toggle-icon":!!this.toggleIcon},n={"speed-dial-actions":!0,["speed-dial-actions-"+e]:!0,["speed-dial-layout-"+this.layout]:!0};return a(o,{key:"044e35eacc272591b4f60488eb366c40c1b1f236",class:{["speed-dial-strategy-"+this.strategy]:!0,["speed-dial-"+this.position]:!0},onMouseEnter:this.onMouseEnter,onMouseLeave:this.onMouseLeave},a("div",{key:"37b6426b0b26e5fbb55a7d52a1b1a515a3d56954",class:s,style:{"--magnetic-x":this.magneticTransform.x+"px","--magnetic-y":this.magneticTransform.y+"px","--drag-x":this.dragOffset.x+"px","--drag-y":this.dragOffset.y+"px",transform:"translate(calc(var(--magnetic-x, 0px) + var(--drag-x, 0px)), calc(var(--magnetic-y, 0px) + var(--drag-y, 0px)))",transition:0!==this.magneticTransform.x||this.isDragging?"none":"transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1)",cursor:this.isDraggable?this.isDragging?"grabbing":"grab":"default"}},this.isOpen&&"click"===this.trigger&&a("div",{key:"4abeed7f2425ec14494dd7bb8e772eee322ff6a6",class:"speed-dial-backdrop",onClick:this.handleBackdropClick}),a("div",{key:"0bfdc8b5ce0ca3949742414078299c3fda31d755",class:n,role:"menu","aria-orientation":["top","bottom"].includes(e)?"vertical":"horizontal"},this.isOpen&&t.map(((t,e)=>a("div",{key:t.id,class:"speed-dial-action-wrapper",style:{"--item-angle":(this.itemAngles[e]||0)+"deg","--index":""+e,"--stagger-delay":.05*e+"s","animation-delay":.05*e+"s"}},a("ui-button",{variant:"ghost",class:{"speed-dial-action":!0,["speed-dial-"+(t.variant||this.variant)]:!0,["speed-dial-variant-"+(t.variant||this.variant)]:!0,["speed-dial-shape-"+(t.shape||this.shape)]:!0,["speed-dial-"+(t.color||this.color)]:!0,"speed-dial-action-disabled":t.disabled},onClick:()=>this.handleActionClick(t),disabled:t.disabled,ariaLabel:t.label,style:{backgroundColor:t.color||void 0}},a("span",{class:"speed-dial-action-icon"},a("ui-icon",{name:t.icon,library:t.iconLibrary||this.actionLibrary,size:"1.25em"})),t.badge&&a("span",{class:"speed-dial-action-badge",style:{backgroundColor:t.badgeColor}},t.badge),t.shortcut&&a("span",{class:"speed-dial-action-shortcut"},t.shortcut)),this.showTooltips&&t.label&&a("div",{class:{"speed-dial-tooltip":!0,["speed-dial-tooltip-"+i]:!0,"speed-dial-tooltip-hidden":this.labelHide}},t.label))))),a("ui-button",{key:"3a6825fce27f39d7a4a689b4e860b7363b34e67f",variant:"ghost",class:r,onClick:this.toggleDial,ariaLabel:"Speed dial menu","aria-expanded":this.isOpen?"true":"false","aria-haspopup":"true",ref:t=>this.mainButton=t},a("slot",{key:"b59d109049ce98eae735d4e598a929669171d247",name:"trigger-icon"},a("span",{key:"3d3c55dbbd3b67ade9dbd28a66b60feb2483e12a",class:"speed-dial-icon"},a("ui-icon",{key:"b0c231ad4fe207ca18e2b8efcf8ad891072d7c65",name:this.isOpen&&this.toggleIcon?this.toggleIcon:this.icon,library:this.iconLibrary,size:"1.5rem"}))))))}static get watchers(){return{isOpen:[{handleOpenChange:0}]}}static get style(){return'.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;z-index:1000;position:fixed;left:auto;right:auto;top:auto;bottom:auto}:host(.speed-dial-strategy-absolute){position:absolute}:host(.speed-dial-strategy-fixed){position:fixed}.speed-dial-container{position:relative}:host(.speed-dial-top-left){top:var(--speed-dial-top, 24px);left:var(--speed-dial-left, 24px)}:host(.speed-dial-top-right){top:var(--speed-dial-top, 24px);right:var(--speed-dial-right, 24px)}:host(.speed-dial-bottom-left){bottom:var(--speed-dial-bottom, 24px);left:var(--speed-dial-left, 24px)}:host(.speed-dial-bottom-right){bottom:var(--speed-dial-bottom, 24px);right:var(--speed-dial-right, 24px)}:host(.speed-dial-center),:host(.speed-dial-bottom-center){left:50%;bottom:var(--speed-dial-bottom, 24px);transform:translateX(-50%)}:host(.speed-dial-top-center){left:50%;top:var(--speed-dial-top, 24px);transform:translateX(-50%)}:host(.speed-dial-center-left){left:var(--speed-dial-left, 24px);top:50%;transform:translateY(-50%)}:host(.speed-dial-center-right){right:var(--speed-dial-right, 24px);top:50%;transform:translateY(-50%)}.speed-dial-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;opacity:0;animation:fadeIn 0.2s forwards;z-index:-1}.speed-dial-glassy .speed-dial-backdrop{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}@keyframes fadeIn{to{opacity:1}}.speed-dial-button{position:relative;z-index:2;display:flex !important;align-items:center;justify-content:center;cursor:pointer;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);outline:none;-webkit-tap-highlight-color:transparent;background:transparent !important;border:none;padding:0;margin:0}.speed-dial-elastic .speed-dial-button{animation:speed-dial-elastic-anim 0.4s cubic-bezier(0.34, 1.56, 0.64, 1)}@keyframes speed-dial-elastic-anim{0%{transform:scale(1)}30%{transform:scale(1.15, 0.85)}60%{transform:scale(0.9, 1.1)}100%{transform:scale(1)}}.speed-dial-button:hover{box-shadow:0 6px 12px rgba(0, 0, 0, 0.3);transform:scale(1.05)}.speed-dial-button:active{transform:scale(0.95)}.speed-dial-button-open:not(.speed-dial-button-has-toggle-icon){transform:rotate(45deg)}.speed-dial-button-open:not(.speed-dial-button-has-toggle-icon):hover{transform:rotate(45deg) scale(1.05)}.speed-dial-sm .speed-dial-button{width:40px;height:40px;font-size:18px}.speed-dial-sm .speed-dial-button{width:40px;height:40px;font-size:20px}.speed-dial-md .speed-dial-button{width:56px;height:56px;font-size:24px}.speed-dial-lg .speed-dial-button{width:72px;height:72px;font-size:32px}.speed-dial-icon{transition:transform 0.3s cubic-bezier(0.4, 0, 0.2, 1)}.speed-dial-actions{position:absolute;display:flex;gap:12px;z-index:1}.speed-dial-actions-up{flex-direction:column-reverse;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:12px}.speed-dial-actions-down{flex-direction:column;top:100%;left:50%;transform:translateX(-50%);margin-top:12px}.speed-dial-actions-left{flex-direction:row-reverse;right:100%;top:50%;transform:translateY(-50%);margin-right:12px}.speed-dial-actions-right{flex-direction:row;left:100%;top:50%;transform:translateY(-50%);margin-left:12px}.speed-dial-layout-radial,.speed-dial-layout-arc{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0;height:0;overflow:visible}.speed-dial-layout-radial .speed-dial-action-wrapper,.speed-dial-layout-arc .speed-dial-action-wrapper{position:absolute;top:50%;left:50%;margin:-24px;transform-origin:center center;transition:all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);--angle:var(--item-angle, 0deg);--radius:100px;transform:rotate(var(--angle)) translate(var(--radius)) rotate(calc(-1 * var(--angle))) scale(0);opacity:0}.speed-dial-open .speed-dial-layout-radial .speed-dial-action-wrapper,.speed-dial-open .speed-dial-layout-arc .speed-dial-action-wrapper{transform:rotate(var(--angle)) translate(var(--radius)) rotate(calc(-1 * var(--angle))) scale(1);opacity:1}.speed-dial-action-wrapper{position:relative;opacity:0;transform:scale(0);animation:actionAppear 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards}@keyframes actionAppear{from{opacity:0;transform:translate(0, 0) scale(0)}to{opacity:1;transform:var(--translation, translate(0, 0)) scale(1)}}.speed-dial-layout-linear .speed-dial-action-wrapper{--translation:translate(0, 0)}.speed-dial-layout-radial .speed-dial-action-wrapper,.speed-dial-layout-arc .speed-dial-action-wrapper{--translation:translate(calc(cos(var(--angle)) * var(--radius)), calc(sin(var(--angle)) * -1 * var(--radius)))}.speed-dial-action{display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.2s ease;background:transparent !important;border:none}.speed-dial-sm .speed-dial-action{width:36px;height:36px;font-size:16px}.speed-dial-md .speed-dial-action{width:48px;height:48px;font-size:20px}.speed-dial-lg .speed-dial-action{width:60px;height:60px;font-size:24px}.speed-dial-action:hover:not(.speed-dial-action-disabled){box-shadow:0 4px 10px rgba(0, 0, 0, 0.3);transform:scale(1.1)}.speed-dial-action:active:not(.speed-dial-action-disabled){transform:scale(0.95)}.speed-dial-action-disabled{opacity:0.5;cursor:not-allowed}.speed-dial-action-icon{display:flex;align-items:center;justify-content:center}.speed-dial-action-badge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background-color:var(--color-danger, #ef4444);color:var(--text-standard, #ffffff);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);border:2px solid var(--bg-primary, #ffffff)}.speed-dial-action-shortcut{position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);background:var(--color-primary, #374151);color:var(--text-standard, #ffffff);font-size:8px;padding:1px 4px;border-radius:4px;font-weight:700;text-transform:uppercase;z-index:1000;pointer-events:none}.speed-dial-action-shortcut.speed-dial-dragging{pointer-events:auto;z-index:2000}.speed-dial-action-shortcut{opacity:0.8}.speed-dial-tooltip{position:absolute;background-color:rgba(0, 0, 0, 0.85);color:var(--text-standard, #ffffff);padding:6px 12px;border-radius:4px;font-size:12px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity 0.2s ease;z-index:1001}.speed-dial-action-wrapper:hover .speed-dial-tooltip{opacity:1}.speed-dial-tooltip-left{right:100%;top:50%;transform:translateY(-50%);margin-right:8px}.speed-dial-tooltip-right{left:100%;top:50%;transform:translateY(-50%);margin-left:8px}.speed-dial-tooltip-top{bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:8px}.speed-dial-tooltip-bottom{top:100%;left:50%;transform:translateX(-50%);margin-top:8px}.speed-dial-tooltip::after{content:"";position:absolute;width:0;height:0;border:4px solid transparent}.speed-dial-tooltip-left::after{right:-8px;top:50%;transform:translateY(-50%);border-left-color:rgba(0, 0, 0, 0.85)}.speed-dial-tooltip-right::after{left:-8px;top:50%;transform:translateY(-50%);border-right-color:rgba(0, 0, 0, 0.85)}.speed-dial-tooltip-top::after{bottom:-8px;left:50%;transform:translateX(-50%);border-top-color:rgba(0, 0, 0, 0.85)}.speed-dial-tooltip-bottom::after{top:-8px;left:50%;transform:translateX(-50%);border-bottom-color:rgba(0, 0, 0, 0.85)}.speed-dial-button:focus-visible,.speed-dial-action:focus-visible{outline:2px solid var(--color-primary-hover, #2563eb);outline-offset:2px}'}},[769,"ui-speed-dial",{position:[1],actions:[1],strategy:[1],icon:[1],iconLibrary:[1,"icon-library"],toggleIcon:[1,"toggle-icon"],actionLibrary:[1,"action-library"],color:[1],size:[1],variant:[1],direction:[1],shape:[1],tooltipPosition:[1,"tooltip-position"],showTooltips:[4,"show-tooltips"],labelPosition:[1,"label-position"],labelHide:[4,"label-hide"],trigger:[1],layout:[1],closeOnScroll:[4,"close-on-scroll"],glassy:[4],magnetic:[4],magneticStrength:[2,"magnetic-strength"],magneticRadius:[2,"magnetic-radius"],persistenceId:[1,"persistence-id"],isDraggable:[4,"is-draggable"],isOpen:[32],magneticTransform:[32],itemAngles:[32],dragOffset:[32],isDragging:[32],isElastic:[32]},[[9,"scroll","handleWindowScroll"],[8,"keydown","handleGlobalKeyDown"],[9,"mousemove","handleMouseMove"],[1,"mousedown","onMouseDown"],[0,"keydown","handleLocalKeyDown"]],{isOpen:[{handleOpenChange:0}]}]),c=p,h=function(){"undefined"!=typeof customElements&&["ui-speed-dial","ui-badge","ui-button","ui-icon","ui-loader"].forEach((t=>{switch(t){case"ui-speed-dial":customElements.get(s(t))||customElements.define(s(t),p);break;case"ui-badge":customElements.get(s(t))||n();break;case"ui-button":customElements.get(s(t))||r();break;case"ui-icon":customElements.get(s(t))||d();break;case"ui-loader":customElements.get(s(t))||l()}}))};export{c as UiSpeedDial,h as defineCustomElement}

package/dist/components/ui-splitter.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as e,createEvent as r,h as i,transformTag as s}from"@stencil/core/internal/client";import{d as o,a}from"./badge.js";import{d as l}from"./icon.js";const n=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.sizeChange=r(this,"sizeChange",7),this.panelCollapse=r(this,"panelCollapse",7),this.splitterDragStart=r(this,"splitterDragStart",7),this.splitterDragEnd=r(this,"splitterDragEnd",7)}get el(){return this}direction="horizontal";gutterSize=8;gutterColor="#e5e7eb";gutterHoverColor="#0de44dff";panels=[];sizes=[];snapThreshold=20;animated=!0;persistState=!1;storageKey="splitter-state";showGutterIcon=!0;doubleClickCollapse=!0;keyboardNavigation=!0;rtl=!1;theme="auto";rounded=!1;elevated=!1;isDragging=!1;activeGutterIndex=-1;hoveredGutterIndex=-1;collapsedPanels=new Set;sizeChange;panelCollapse;splitterDragStart;splitterDragEnd;startPos=0;startSizes=[];panelRefs=[];componentWillLoad(){this.initializeSizes(),this.persistState&&this.loadState()}componentDidLoad(){0===this.sizes.length&&this.initializeSizes(),this.keyboardNavigation&&document.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){this.keyboardNavigation&&document.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("mousemove",this.handleMouseMove),document.removeEventListener("mouseup",this.handleMouseUp)}handlePanelsChange(){this.initializeSizes()}initializeSizes(){const t=this.getPanelCount();0!==t&&this.sizes.length!==t&&(this.sizes=Array(t).fill(0).map(((e,r)=>this.panels[r]?.size||100/t)))}getPanelCount(){const t=this.el.querySelectorAll('[slot^="panel-"]');return Math.max(t.length,this.panels.length)}loadState(){try{const t=localStorage.getItem(this.storageKey);if(t){const e=JSON.parse(t);this.sizes=e.sizes||this.sizes,this.collapsedPanels=new Set(e.collapsed||[])}}catch(t){console.error("Failed to load splitter state:",t)}}saveState(){if(this.persistState)try{const t={sizes:this.sizes,collapsed:Array.from(this.collapsedPanels)};localStorage.setItem(this.storageKey,JSON.stringify(t))}catch(t){console.error("Failed to save splitter state:",t)}}handleMouseDown=(t,e)=>{t.preventDefault(),this.isDragging=!0,this.activeGutterIndex=e,this.startPos="horizontal"===this.direction?t.clientX:t.clientY,this.startSizes=[...this.sizes],document.addEventListener("mousemove",this.handleMouseMove),document.addEventListener("mouseup",this.handleMouseUp),this.splitterDragStart.emit({index:e})};handleMouseMove=t=>{if(!this.isDragging||-1===this.activeGutterIndex)return;const e=("horizontal"===this.direction?t.clientX:t.clientY)-this.startPos,r=[...this.startSizes],i=this.activeGutterIndex,s=this.activeGutterIndex+1,o=this.panels[i],a=this.panels[s];let l=this.startSizes[i]+(this.rtl&&"horizontal"===this.direction?-e:e)/("horizontal"===this.direction?this.el.offsetWidth:this.el.offsetHeight)*100;const n=void 0!==o?.minSize?o.minSize:0,h=void 0!==o?.maxSize?o.maxSize:100,p=void 0!==a?.minSize?a.minSize:0;let c=Math.max(Math.max(n,this.startSizes[i]+this.startSizes[s]-(void 0!==a?.maxSize?a.maxSize:100)),Math.min(Math.min(h,this.startSizes[i]+this.startSizes[s]-p),l));this.snapThreshold>0&&(Math.abs(c-n)<this.snapThreshold&&(c=n),Math.abs(this.startSizes[i]+this.startSizes[s]-c-p)<this.snapThreshold&&(c=this.startSizes[i]+this.startSizes[s]-p)),r[i]=c,r[s]=this.startSizes[i]+this.startSizes[s]-c,this.sizes=r,this.sizeChange.emit({sizes:this.sizes,index:this.activeGutterIndex})};handleMouseUp=()=>{this.isDragging&&(this.isDragging=!1,this.splitterDragEnd.emit({index:this.activeGutterIndex,sizes:this.sizes}),this.activeGutterIndex=-1,this.saveState()),document.removeEventListener("mousemove",this.handleMouseMove),document.removeEventListener("mouseup",this.handleMouseUp)};handleGutterDoubleClick=t=>{if(!this.doubleClickCollapse)return;const e=this.panels[t];e?.collapsible&&this.toggleCollapse(t)};toggleCollapse(t){const e=this.collapsedPanels.has(t);e?this.collapsedPanels.delete(t):(this.collapsedPanels.add(t),this.sizes[t]=this.panels[t]?.minSize||0),this.collapsedPanels=new Set(this.collapsedPanels),this.panelCollapse.emit({index:t,collapsed:!e}),this.saveState()}handleKeyDown=t=>{this.keyboardNavigation&&-1!==this.activeGutterIndex&&("ArrowLeft"===t.key||"ArrowUp"===t.key?(t.preventDefault(),this.adjustSize(this.activeGutterIndex,-5)):"ArrowRight"!==t.key&&"ArrowDown"!==t.key||(t.preventDefault(),this.adjustSize(this.activeGutterIndex,5)))};adjustSize(t,e){const r=[...this.sizes];r[t]+=e,r[t+1]-=e,this.sizes=r,this.sizeChange.emit({sizes:this.sizes,index:t})}renderGutter(t){const e=this.activeGutterIndex===t,r=this.hoveredGutterIndex===t;return i("div",{class:{"splitter-gutter":!0,"splitter-gutter-active":e,"splitter-gutter-hovered":r,"splitter-gutter-horizontal":"horizontal"===this.direction,"splitter-gutter-vertical":"vertical"===this.direction},style:{width:"horizontal"===this.direction?this.gutterSize+"px":"100%",height:"vertical"===this.direction?this.gutterSize+"px":"100%",background:r||e?this.gutterHoverColor:this.gutterColor},onMouseDown:e=>this.handleMouseDown(e,t),onDblClick:()=>this.handleGutterDoubleClick(t),onMouseEnter:()=>this.hoveredGutterIndex=t,onMouseLeave:()=>this.hoveredGutterIndex=-1},this.showGutterIcon&&i("ui-icon",{name:"grip-"+("horizontal"===this.direction?"vertical":"lines"),library:"fontawesome"}))}renderPanel(t){const e=this.sizes[t]||0,r=this.collapsedPanels.has(t),s=this.panels[t];return i("div",{ref:e=>this.panelRefs[t]=e,class:{"splitter-panel":!0,"splitter-panel-collapsed":r,"splitter-panel-animated":this.animated&&!this.isDragging},style:{["horizontal"===this.direction?"width":"height"]:e+"%",["horizontal"===this.direction?"height":"width"]:"100%"}},i("slot",{name:"panel-"+t}),s?.collapsible&&i("ui-button",{variant:"ghost",onClick:()=>this.toggleCollapse(t),ariaLabel:r?"Expand":"Collapse",icon:"chevron-"+(r?"right":"left"),iconLibrary:"fontawesome",iconOnly:!0,size:"sm"}))}render(){const t=this.getPanelCount(),e=[];for(let r=0;r<t;r++)e.push(this.renderPanel(r)),r<t-1&&e.push(this.renderGutter(r));return i("div",{key:"e4576c74bbbb36dd9e15f0e7860efd48e878656c",class:{"splitter-container":!0,["splitter-"+this.direction]:!0,["splitter-theme-"+this.theme]:!0,"splitter-rounded":this.rounded,"splitter-elevated":this.elevated,"splitter-dragging":this.isDragging,"splitter-rtl":this.rtl}},e)}static get watchers(){return{panels:[{handlePanelsChange:0}]}}static get style(){return".sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;width:100%;height:100%;--gutter-size:8px;--gutter-color:var(--text-standard, #e5e7eb);--gutter-hover-color:var(--color-primary, #10b981);--panel-bg:var(--bg-primary, #ffffff);--panel-border:var(--border-default, #e5e7eb)}.splitter-container{display:flex;width:100%;height:100%;position:relative;overflow:hidden}.splitter-horizontal{flex-direction:row}.splitter-vertical{flex-direction:column}.splitter-rounded{border-radius:8px;overflow:hidden}.splitter-elevated{box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)}.splitter-panel{position:relative;overflow:auto;background:var(--panel-bg);flex-shrink:0}.splitter-panel::-webkit-scrollbar{width:8px;height:8px}.splitter-panel::-webkit-scrollbar-track{background:var(--bg-primary, #f1f1f1)}.splitter-panel::-webkit-scrollbar-thumb{background:var(--bg-tertiary, #888);border-radius:4px}.splitter-panel::-webkit-scrollbar-thumb:hover{background:var(--bg-secondary, #555)}.splitter-panel-animated{transition:width 0.3s ease, height 0.3s ease}.splitter-panel-collapsed{overflow:hidden}.splitter-gutter{position:relative;flex-shrink:0;display:flex;align-items:center;justify-content:center;cursor:col-resize;transition:background-color 0.2s ease;user-select:none}.splitter-gutter i{color:var(--text-muted, #9ca3af);font-size:12px;pointer-events:none;transition:color 0.2s ease}.splitter-gutter:hover i,.splitter-gutter.splitter-gutter-active i{color:var(--text-standard, #ffffff)}.splitter-gutter-vertical{cursor:row-resize}.splitter-gutter-horizontal{cursor:col-resize}.splitter-gutter-active{background:var(--gutter-hover-color) !important;z-index:10}.splitter-gutter-hovered{background:var(--gutter-hover-color)}.splitter-collapse-btn{position:absolute;top:8px;right:8px;width:24px;height:24px;border:none;background:var(--bg-secondary, #f3f4f6);border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s ease;z-index:5}.splitter-collapse-btn i{font-size:12px;color:var(--text-muted, #6b7280)}.splitter-collapse-btn:hover{background:var(--bg-primary, #e5e7eb);transform:scale(1.1)}.splitter-collapse-btn:hover i{color:var(--text-secondary, #374151)}.splitter-collapse-btn:active{transform:scale(0.95)}.splitter-dragging{cursor:col-resize;user-select:none}.splitter-dragging .splitter-panel{pointer-events:none}.splitter-dragging.splitter-vertical{cursor:row-resize}.splitter-rtl{direction:rtl}.splitter-rtl .splitter-collapse-btn{right:auto;left:8px}.splitter-theme-dark{--panel-bg:var(--bg-primary, #1f2937);--panel-border:var(--border-default, #374151);--gutter-color:var(--text-secondary, #374151);--gutter-hover-color:var(--color-primary, #10b981)}.splitter-theme-dark .splitter-panel{color:var(--text-standard, #f9fafb)}.splitter-theme-dark .splitter-panel::-webkit-scrollbar-track{background:var(--bg-secondary, #111827)}.splitter-theme-dark .splitter-panel::-webkit-scrollbar-thumb{background:var(--color-primary, #4b5563)}.splitter-theme-dark .splitter-panel::-webkit-scrollbar-thumb:hover{background:var(--color-primary, #6b7280)}.splitter-theme-dark .splitter-collapse-btn{background:var(--color-primary, #374151)}.splitter-theme-dark .splitter-collapse-btn i{color:var(--text-muted, #9ca3af)}.splitter-theme-dark .splitter-collapse-btn:hover{background:var(--color-primary, #4b5563)}.splitter-theme-dark .splitter-collapse-btn:hover i{color:var(--bg-secondary, #d1d5db)}.splitter-theme-dark .splitter-gutter i{color:var(--text-muted, #6b7280)}@media (prefers-color-scheme: dark){.splitter-theme-auto{--panel-bg:var(--bg-primary, #1f2937);--panel-border:var(--border-default, #374151);--gutter-color:var(--text-secondary, #374151);--gutter-hover-color:var(--color-primary, #10b981)}.splitter-theme-auto .splitter-panel{color:var(--text-standard, #f9fafb)}.splitter-theme-auto .splitter-panel::-webkit-scrollbar-track{background:var(--bg-secondary, #111827)}.splitter-theme-auto .splitter-panel::-webkit-scrollbar-thumb{background:var(--color-primary, #4b5563)}.splitter-theme-auto .splitter-panel::-webkit-scrollbar-thumb:hover{background:var(--color-primary, #6b7280)}.splitter-theme-auto .splitter-collapse-btn{background:var(--color-primary, #374151)}.splitter-theme-auto .splitter-collapse-btn i{color:var(--text-muted, #9ca3af)}.splitter-theme-auto .splitter-collapse-btn:hover{background:var(--color-primary, #4b5563)}.splitter-theme-auto .splitter-collapse-btn:hover i{color:var(--bg-secondary, #d1d5db)}.splitter-theme-auto .splitter-gutter i{color:var(--text-muted, #6b7280)}}@media (max-width: 768px){.splitter-gutter{width:12px !important;height:12px !important}.splitter-collapse-btn{width:32px;height:32px}.splitter-collapse-btn i{font-size:14px}}.splitter-gutter:focus{outline:2px solid var(--gutter-hover-color);outline-offset:2px}.splitter-collapse-btn:focus{outline:2px solid var(--color-primary, #10b981);outline-offset:2px}"}},[769,"ui-splitter",{direction:[1],gutterSize:[2,"gutter-size"],gutterColor:[1,"gutter-color"],gutterHoverColor:[1,"gutter-hover-color"],panels:[16],sizes:[1040],snapThreshold:[2,"snap-threshold"],animated:[4],persistState:[4,"persist-state"],storageKey:[1,"storage-key"],showGutterIcon:[4,"show-gutter-icon"],doubleClickCollapse:[4,"double-click-collapse"],keyboardNavigation:[4,"keyboard-navigation"],rtl:[4],theme:[1],rounded:[4],elevated:[4],isDragging:[32],activeGutterIndex:[32],hoveredGutterIndex:[32],collapsedPanels:[32]},void 0,{panels:[{handlePanelsChange:0}]}]),h=n,p=function(){"undefined"!=typeof customElements&&["ui-splitter","ui-badge","ui-button","ui-icon"].forEach((t=>{switch(t){case"ui-splitter":customElements.get(s(t))||customElements.define(s(t),n);break;case"ui-badge":customElements.get(s(t))||a();break;case"ui-button":customElements.get(s(t))||o();break;case"ui-icon":customElements.get(s(t))||l()}}))};export{h as UiSplitter,p as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as e,createEvent as r,h as i,transformTag as s}from"@stencil/core/internal/client";import{d as o,a}from"./badge.js";import{d as l}from"./icon.js";import{d as n}from"./loader.js";const h=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.sizeChange=r(this,"sizeChange",7),this.panelCollapse=r(this,"panelCollapse",7),this.splitterDragStart=r(this,"splitterDragStart",7),this.splitterDragEnd=r(this,"splitterDragEnd",7)}get el(){return this}direction="horizontal";gutterSize=8;gutterColor="#e5e7eb";gutterHoverColor="#0de44dff";panels=[];sizes=[];snapThreshold=20;animated=!0;persistState=!1;storageKey="splitter-state";showGutterIcon=!0;doubleClickCollapse=!0;keyboardNavigation=!0;rtl=!1;theme="auto";rounded=!1;elevated=!1;isDragging=!1;activeGutterIndex=-1;hoveredGutterIndex=-1;collapsedPanels=new Set;sizeChange;panelCollapse;splitterDragStart;splitterDragEnd;startPos=0;startSizes=[];panelRefs=[];componentWillLoad(){this.initializeSizes(),this.persistState&&this.loadState()}componentDidLoad(){0===this.sizes.length&&this.initializeSizes(),this.keyboardNavigation&&document.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){this.keyboardNavigation&&document.removeEventListener("keydown",this.handleKeyDown),document.removeEventListener("mousemove",this.handleMouseMove),document.removeEventListener("mouseup",this.handleMouseUp)}handlePanelsChange(){this.initializeSizes()}initializeSizes(){const t=this.getPanelCount();0!==t&&this.sizes.length!==t&&(this.sizes=Array(t).fill(0).map(((e,r)=>this.panels[r]?.size||100/t)))}getPanelCount(){const t=this.el.querySelectorAll('[slot^="panel-"]');return Math.max(t.length,this.panels.length)}loadState(){try{const t=localStorage.getItem(this.storageKey);if(t){const e=JSON.parse(t);this.sizes=e.sizes||this.sizes,this.collapsedPanels=new Set(e.collapsed||[])}}catch(t){console.error("Failed to load splitter state:",t)}}saveState(){if(this.persistState)try{const t={sizes:this.sizes,collapsed:Array.from(this.collapsedPanels)};localStorage.setItem(this.storageKey,JSON.stringify(t))}catch(t){console.error("Failed to save splitter state:",t)}}handleMouseDown=(t,e)=>{t.preventDefault(),this.isDragging=!0,this.activeGutterIndex=e,this.startPos="horizontal"===this.direction?t.clientX:t.clientY,this.startSizes=[...this.sizes],document.addEventListener("mousemove",this.handleMouseMove),document.addEventListener("mouseup",this.handleMouseUp),this.splitterDragStart.emit({index:e})};handleMouseMove=t=>{if(!this.isDragging||-1===this.activeGutterIndex)return;const e=("horizontal"===this.direction?t.clientX:t.clientY)-this.startPos,r=[...this.startSizes],i=this.activeGutterIndex,s=this.activeGutterIndex+1,o=this.panels[i],a=this.panels[s];let l=this.startSizes[i]+(this.rtl&&"horizontal"===this.direction?-e:e)/("horizontal"===this.direction?this.el.offsetWidth:this.el.offsetHeight)*100;const n=void 0!==o?.minSize?o.minSize:0,h=void 0!==o?.maxSize?o.maxSize:100,p=void 0!==a?.minSize?a.minSize:0;let c=Math.max(Math.max(n,this.startSizes[i]+this.startSizes[s]-(void 0!==a?.maxSize?a.maxSize:100)),Math.min(Math.min(h,this.startSizes[i]+this.startSizes[s]-p),l));this.snapThreshold>0&&(Math.abs(c-n)<this.snapThreshold&&(c=n),Math.abs(this.startSizes[i]+this.startSizes[s]-c-p)<this.snapThreshold&&(c=this.startSizes[i]+this.startSizes[s]-p)),r[i]=c,r[s]=this.startSizes[i]+this.startSizes[s]-c,this.sizes=r,this.sizeChange.emit({sizes:this.sizes,index:this.activeGutterIndex})};handleMouseUp=()=>{this.isDragging&&(this.isDragging=!1,this.splitterDragEnd.emit({index:this.activeGutterIndex,sizes:this.sizes}),this.activeGutterIndex=-1,this.saveState()),document.removeEventListener("mousemove",this.handleMouseMove),document.removeEventListener("mouseup",this.handleMouseUp)};handleGutterDoubleClick=t=>{if(!this.doubleClickCollapse)return;const e=this.panels[t];e?.collapsible&&this.toggleCollapse(t)};toggleCollapse(t){const e=this.collapsedPanels.has(t);e?this.collapsedPanels.delete(t):(this.collapsedPanels.add(t),this.sizes[t]=this.panels[t]?.minSize||0),this.collapsedPanels=new Set(this.collapsedPanels),this.panelCollapse.emit({index:t,collapsed:!e}),this.saveState()}handleKeyDown=t=>{this.keyboardNavigation&&-1!==this.activeGutterIndex&&("ArrowLeft"===t.key||"ArrowUp"===t.key?(t.preventDefault(),this.adjustSize(this.activeGutterIndex,-5)):"ArrowRight"!==t.key&&"ArrowDown"!==t.key||(t.preventDefault(),this.adjustSize(this.activeGutterIndex,5)))};adjustSize(t,e){const r=[...this.sizes];r[t]+=e,r[t+1]-=e,this.sizes=r,this.sizeChange.emit({sizes:this.sizes,index:t})}renderGutter(t){const e=this.activeGutterIndex===t,r=this.hoveredGutterIndex===t;return i("div",{class:{"splitter-gutter":!0,"splitter-gutter-active":e,"splitter-gutter-hovered":r,"splitter-gutter-horizontal":"horizontal"===this.direction,"splitter-gutter-vertical":"vertical"===this.direction},style:{width:"horizontal"===this.direction?this.gutterSize+"px":"100%",height:"vertical"===this.direction?this.gutterSize+"px":"100%",background:r||e?this.gutterHoverColor:this.gutterColor},onMouseDown:e=>this.handleMouseDown(e,t),onDblClick:()=>this.handleGutterDoubleClick(t),onMouseEnter:()=>this.hoveredGutterIndex=t,onMouseLeave:()=>this.hoveredGutterIndex=-1},this.showGutterIcon&&i("ui-icon",{name:"grip-"+("horizontal"===this.direction?"vertical":"lines"),library:"fontawesome"}))}renderPanel(t){const e=this.sizes[t]||0,r=this.collapsedPanels.has(t),s=this.panels[t];return i("div",{ref:e=>this.panelRefs[t]=e,class:{"splitter-panel":!0,"splitter-panel-collapsed":r,"splitter-panel-animated":this.animated&&!this.isDragging},style:{["horizontal"===this.direction?"width":"height"]:e+"%",["horizontal"===this.direction?"height":"width"]:"100%"}},i("slot",{name:"panel-"+t}),s?.collapsible&&i("ui-button",{variant:"ghost",onClick:()=>this.toggleCollapse(t),ariaLabel:r?"Expand":"Collapse",icon:"chevron-"+(r?"right":"left"),iconLibrary:"fontawesome",iconOnly:!0,size:"sm"}))}render(){const t=this.getPanelCount(),e=[];for(let r=0;r<t;r++)e.push(this.renderPanel(r)),r<t-1&&e.push(this.renderGutter(r));return i("div",{key:"e4576c74bbbb36dd9e15f0e7860efd48e878656c",class:{"splitter-container":!0,["splitter-"+this.direction]:!0,["splitter-theme-"+this.theme]:!0,"splitter-rounded":this.rounded,"splitter-elevated":this.elevated,"splitter-dragging":this.isDragging,"splitter-rtl":this.rtl}},e)}static get watchers(){return{panels:[{handlePanelsChange:0}]}}static get style(){return".sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;width:100%;height:100%;--gutter-size:8px;--gutter-color:var(--text-standard, #e5e7eb);--gutter-hover-color:var(--color-primary, #10b981);--panel-bg:var(--bg-primary, #ffffff);--panel-border:var(--border-default, #e5e7eb)}.splitter-container{display:flex;width:100%;height:100%;position:relative;overflow:hidden}.splitter-horizontal{flex-direction:row}.splitter-vertical{flex-direction:column}.splitter-rounded{border-radius:8px;overflow:hidden}.splitter-elevated{box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)}.splitter-panel{position:relative;overflow:auto;background:var(--panel-bg);flex-shrink:0}.splitter-panel::-webkit-scrollbar{width:8px;height:8px}.splitter-panel::-webkit-scrollbar-track{background:var(--bg-primary, #f1f1f1)}.splitter-panel::-webkit-scrollbar-thumb{background:var(--bg-tertiary, #888);border-radius:4px}.splitter-panel::-webkit-scrollbar-thumb:hover{background:var(--bg-secondary, #555)}.splitter-panel-animated{transition:width 0.3s ease, height 0.3s ease}.splitter-panel-collapsed{overflow:hidden}.splitter-gutter{position:relative;flex-shrink:0;display:flex;align-items:center;justify-content:center;cursor:col-resize;transition:background-color 0.2s ease;user-select:none}.splitter-gutter i{color:var(--text-muted, #9ca3af);font-size:12px;pointer-events:none;transition:color 0.2s ease}.splitter-gutter:hover i,.splitter-gutter.splitter-gutter-active i{color:var(--text-standard, #ffffff)}.splitter-gutter-vertical{cursor:row-resize}.splitter-gutter-horizontal{cursor:col-resize}.splitter-gutter-active{background:var(--gutter-hover-color) !important;z-index:10}.splitter-gutter-hovered{background:var(--gutter-hover-color)}.splitter-collapse-btn{position:absolute;top:8px;right:8px;width:24px;height:24px;border:none;background:var(--bg-secondary, #f3f4f6);border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s ease;z-index:5}.splitter-collapse-btn i{font-size:12px;color:var(--text-muted, #6b7280)}.splitter-collapse-btn:hover{background:var(--bg-primary, #e5e7eb);transform:scale(1.1)}.splitter-collapse-btn:hover i{color:var(--text-secondary, #374151)}.splitter-collapse-btn:active{transform:scale(0.95)}.splitter-dragging{cursor:col-resize;user-select:none}.splitter-dragging .splitter-panel{pointer-events:none}.splitter-dragging.splitter-vertical{cursor:row-resize}.splitter-rtl{direction:rtl}.splitter-rtl .splitter-collapse-btn{right:auto;left:8px}.splitter-theme-dark{--panel-bg:var(--bg-primary, #1f2937);--panel-border:var(--border-default, #374151);--gutter-color:var(--text-secondary, #374151);--gutter-hover-color:var(--color-primary, #10b981)}.splitter-theme-dark .splitter-panel{color:var(--text-standard, #f9fafb)}.splitter-theme-dark .splitter-panel::-webkit-scrollbar-track{background:var(--bg-secondary, #111827)}.splitter-theme-dark .splitter-panel::-webkit-scrollbar-thumb{background:var(--color-primary, #4b5563)}.splitter-theme-dark .splitter-panel::-webkit-scrollbar-thumb:hover{background:var(--color-primary, #6b7280)}.splitter-theme-dark .splitter-collapse-btn{background:var(--color-primary, #374151)}.splitter-theme-dark .splitter-collapse-btn i{color:var(--text-muted, #9ca3af)}.splitter-theme-dark .splitter-collapse-btn:hover{background:var(--color-primary, #4b5563)}.splitter-theme-dark .splitter-collapse-btn:hover i{color:var(--bg-secondary, #d1d5db)}.splitter-theme-dark .splitter-gutter i{color:var(--text-muted, #6b7280)}@media (prefers-color-scheme: dark){.splitter-theme-auto{--panel-bg:var(--bg-primary, #1f2937);--panel-border:var(--border-default, #374151);--gutter-color:var(--text-secondary, #374151);--gutter-hover-color:var(--color-primary, #10b981)}.splitter-theme-auto .splitter-panel{color:var(--text-standard, #f9fafb)}.splitter-theme-auto .splitter-panel::-webkit-scrollbar-track{background:var(--bg-secondary, #111827)}.splitter-theme-auto .splitter-panel::-webkit-scrollbar-thumb{background:var(--color-primary, #4b5563)}.splitter-theme-auto .splitter-panel::-webkit-scrollbar-thumb:hover{background:var(--color-primary, #6b7280)}.splitter-theme-auto .splitter-collapse-btn{background:var(--color-primary, #374151)}.splitter-theme-auto .splitter-collapse-btn i{color:var(--text-muted, #9ca3af)}.splitter-theme-auto .splitter-collapse-btn:hover{background:var(--color-primary, #4b5563)}.splitter-theme-auto .splitter-collapse-btn:hover i{color:var(--bg-secondary, #d1d5db)}.splitter-theme-auto .splitter-gutter i{color:var(--text-muted, #6b7280)}}@media (max-width: 768px){.splitter-gutter{width:12px !important;height:12px !important}.splitter-collapse-btn{width:32px;height:32px}.splitter-collapse-btn i{font-size:14px}}.splitter-gutter:focus{outline:2px solid var(--gutter-hover-color);outline-offset:2px}.splitter-collapse-btn:focus{outline:2px solid var(--color-primary, #10b981);outline-offset:2px}"}},[769,"ui-splitter",{direction:[1],gutterSize:[2,"gutter-size"],gutterColor:[1,"gutter-color"],gutterHoverColor:[1,"gutter-hover-color"],panels:[16],sizes:[1040],snapThreshold:[2,"snap-threshold"],animated:[4],persistState:[4,"persist-state"],storageKey:[1,"storage-key"],showGutterIcon:[4,"show-gutter-icon"],doubleClickCollapse:[4,"double-click-collapse"],keyboardNavigation:[4,"keyboard-navigation"],rtl:[4],theme:[1],rounded:[4],elevated:[4],isDragging:[32],activeGutterIndex:[32],hoveredGutterIndex:[32],collapsedPanels:[32]},void 0,{panels:[{handlePanelsChange:0}]}]),p=h,c=function(){"undefined"!=typeof customElements&&["ui-splitter","ui-badge","ui-button","ui-icon","ui-loader"].forEach((t=>{switch(t){case"ui-splitter":customElements.get(s(t))||customElements.define(s(t),h);break;case"ui-badge":customElements.get(s(t))||a();break;case"ui-button":customElements.get(s(t))||o();break;case"ui-icon":customElements.get(s(t))||l();break;case"ui-loader":customElements.get(s(t))||n()}}))};export{p as UiSplitter,c as defineCustomElement}

package/dist/components/ui-step.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as e,h as o,transformTag as n}from"@stencil/core/internal/client";const r=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}index=0;stepTitle="";subtitle=null;icon=null;badge=null;tooltip=null;status="upcoming";disabled=!1;validate;renderContent;render(){return o("div",{key:"439655eeb3c34f1fb7a09232397787d8bb2edf9e",class:"ui-step-container",role:"presentation"},o("div",{key:"b9237abc63d6676e3e388c60bc189542eebc768e",class:"ui-step-slots-hidden",style:{display:"none"}},o("slot",{key:"84f2032dbf5c05170c1219e0ef81c40701460967",name:"icon"}),o("slot",{key:"a7c22833c64c592f755bd31e8690d7d96e6da3d8",name:"title"}),o("slot",{key:"fdb8aae3e821578d0cfc199247577c5c435445f5",name:"description"})),o("slot",{key:"09ffd6d687bf76e5692b20c9fa8238e460c09c9c"}))}static get style(){return'.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.stepper{display:flex;position:relative;--connector-color:var(--step-color, #4b6bfb)}.stepper[data-style=solid]::before{content:"";position:absolute;top:50%;left:0;right:0;height:2px;background:var(--connector-color)}.stepper[data-style=dotted]::before{content:"";position:absolute;top:50%;left:0;right:0;height:2px;background:repeating-linear-gradient(to right, var(--connector-color) 0 4px, transparent 4px 8px)}.stepper[data-style=dashed]::before{content:"";position:absolute;top:50%;left:0;right:0;height:2px;background:repeating-linear-gradient(to right, var(--connector-color) 0 10px, transparent 10px 20px)}.stepper[data-style=segmented]::before{content:"";position:absolute;top:50%;left:0;right:0;height:4px;background:linear-gradient(to right, var(--connector-color) 0 20%, transparent 20% 25%, var(--connector-color) 25% 45%, transparent 45% 50%, var(--connector-color) 50% 70%, transparent 70% 75%, var(--connector-color) 75% 100%)}.stepper[data-reduced=true] *{animation:none !important;transition:none !important}'}},[769,"ui-step",{stepTitle:[1,"step-title"],subtitle:[1],icon:[1],badge:[1],tooltip:[1],status:[1],disabled:[4],validate:[16],renderContent:[16]}]),i=r,a=function(){"undefined"!=typeof customElements&&["ui-step"].forEach((t=>{"ui-step"===t&&(customElements.get(n(t))||customElements.define(n(t),r))}))};export{i as UiStep,a as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as e,h as o,transformTag as n}from"@stencil/core/internal/client";const r=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}index=0;stepTitle="";subtitle=null;icon=null;badge=null;tooltip=null;status="upcoming";disabled=!1;validate;renderContent;render(){return o("div",{key:"34d10339a1b9505e53b2adb8059cfeee2bbb0841",class:"ui-step-container",role:"presentation"},o("div",{key:"adfe6db495ad914bb066963d5d01f89ec4c8b500",class:"ui-step-slots-hidden",style:{display:"none"}},o("slot",{key:"f00c0378d9cb2233b917e714ff9c3b73687fb43c",name:"icon"}),o("slot",{key:"c8fe113292f4181096a2254012cef1c5f2ce9239",name:"title"}),o("slot",{key:"933b9f3adda9b05fa55fad607db3838329c540ed",name:"description"})),o("slot",{key:"16fa7b618483d991cfab40c55bb6e3f42cf431c0"}))}static get style(){return'.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.stepper{display:flex;position:relative;--connector-color:var(--step-color, #4b6bfb)}.stepper[data-style=solid]::before{content:"";position:absolute;top:50%;left:0;right:0;height:2px;background:var(--connector-color)}.stepper[data-style=dotted]::before{content:"";position:absolute;top:50%;left:0;right:0;height:2px;background:repeating-linear-gradient(to right, var(--connector-color) 0 4px, transparent 4px 8px)}.stepper[data-style=dashed]::before{content:"";position:absolute;top:50%;left:0;right:0;height:2px;background:repeating-linear-gradient(to right, var(--connector-color) 0 10px, transparent 10px 20px)}.stepper[data-style=segmented]::before{content:"";position:absolute;top:50%;left:0;right:0;height:4px;background:linear-gradient(to right, var(--connector-color) 0 20%, transparent 20% 25%, var(--connector-color) 25% 45%, transparent 45% 50%, var(--connector-color) 50% 70%, transparent 70% 75%, var(--connector-color) 75% 100%)}.stepper[data-reduced=true] *{animation:none !important;transition:none !important}'}},[769,"ui-step",{stepTitle:[1,"step-title"],subtitle:[1],icon:[1],badge:[1],tooltip:[1],status:[1],disabled:[4],validate:[16],renderContent:[16]}]),i=r,a=function(){"undefined"!=typeof customElements&&["ui-step"].forEach((t=>{"ui-step"===t&&(customElements.get(n(t))||customElements.define(n(t),r))}))};export{i as UiStep,a as defineCustomElement}

package/dist/components/ui-stepper.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as t,createEvent as r,h as s,transformTag as p}from"@stencil/core/internal/client";import{s as i,d as a}from"./icon.js";import{d as o,a as n}from"./badge.js";const l=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.stepperPrevious=r(this,"stepperPrevious",7),this.stepperNext=r(this,"stepperNext",7),this.stepperFinish=r(this,"stepperFinish",7),this.stepperFail=r(this,"stepperFail",7),this.stepperChange=r(this,"stepperChange",7),this.stepperValidationError=r(this,"stepperValidationError",7),this.progressUpdate=r(this,"progressUpdate",7),this.stepValidation=r(this,"stepValidation",7),this.stepLoading=r(this,"stepLoading",7)}steps=[];normalizedSteps=[];orientation="horizontal";size="md";activeStep=0;showNumbers=!0;showDescriptions=!1;showControls=!1;labelPrev="Previous";labelNext="Next";labelFinish="Finish";labelFail="Mark Failed";stepperPrevious;stepperNext;stepperFinish;stepperFail;customIcons;flow="linear";shadow=!0;theme;keyboardNavigation=!0;responsive=!0;maxVisibleSteps=5;progressDot=!1;iconLibrary="default";labelPlacement="horizontal";labelPosition="right";variant="default";colorScheme="primary";animated=!0;showProgress=!1;validateBeforeNext;mobileBreakpoint=768;allowStepClick=!0;showTooltips=!0;compact=!1;stepsPerPage=0;scrollable=!0;clickable=!1;iconLineWidth;iconLineHeight;iconLineFlex;stepShape="circle";validationErrors=new Map;isMobile=!1;isLoading=!1;get host(){return this}stepperChange;stepperValidationError;progressUpdate;stepValidation;stepLoading;async next(e={}){return this.navigateToStep(this.activeStep+1,e)}async prev(e={}){return this.navigateToStep(this.activeStep-1,e)}async goTo(e,t={}){return this.navigateToStep(e,t)}async complete(e){const t=e??this.activeStep;t>=0&&t<this.normalizedSteps.length&&this.updateStepStatus(t,"completed")}async fail(e,t){const r=e??this.activeStep;r>=0&&r<this.normalizedSteps.length&&(this.updateStepStatus(r,"failed"),t&&this.validationErrors.set(this.normalizedSteps[r].id+"",t))}async getCurrentStep(){return this.activeStep>=0&&this.activeStep<this.normalizedSteps.length?this.normalizedSteps[this.activeStep]:null}async getSteps(){return[...this.normalizedSteps]}async validateCurrentStep(){return this.validateStep(this.activeStep)}async navigateToStep(e,t={}){if(e<0||e>=this.normalizedSteps.length)return!1;const r=this.normalizedSteps[e];if(!t.force&&!this.canNavigateTo(e))return!1;if(!t.skipValidation&&"linear"===this.flow&&e>this.activeStep&&!await this.validateStep(this.activeStep))return!1;const s=this.activeStep;return this.activeStep=e,this.updateStepStatuses(),this.stepperChange.emit({index:e,step:r,previousIndex:s}),!0}handleActiveStepChange(){this.updateStepStatuses()}canNavigateTo(e){return"non-linear"===this.flow||e<=this.activeStep+1}async validateStep(e){const t=this.normalizedSteps[e];if(this.validateBeforeNext){this.isLoading=!0,this.stepLoading.emit(!0);try{const r=await this.validateBeforeNext(e);if(this.stepValidation.emit({step:e,valid:r}),!r){const r="Validation failed for the current step";return this.validationErrors.set((t?.id||e)+"",r),t&&this.stepperValidationError.emit({index:e,step:t,error:r}),!1}}finally{this.isLoading=!1,this.stepLoading.emit(!1)}}if(!t)return!0;if(t.node&&"function"==typeof t.node.validate){this.isLoading=!0,this.stepLoading.emit(!0);try{if(!await t.node.validate()){const r="Step validation failed";return this.validationErrors.set(t.id+"",r),this.stepperValidationError.emit({index:e,step:t,error:r}),!1}}catch(r){const s="Validation error: "+r.message;return this.validationErrors.set(t.id+"",s),this.stepperValidationError.emit({index:e,step:t,error:s}),!1}finally{this.isLoading=!1,this.stepLoading.emit(!1)}}if(!t.validator)return!0;try{if(!await t.validator.validate(t,t.data)){const r=t.validator.errorMessage||"Validation failed";return this.validationErrors.set(t.id+"",r),this.stepperValidationError.emit({index:e,step:t,error:r}),!1}return this.validationErrors.delete(t.id+""),!0}catch(r){const s="Validation error: "+r.message;return this.validationErrors.set(t.id+"",s),this.stepperValidationError.emit({index:e,step:t,error:s}),!1}}updateStepStatuses(){const e=["failed","error","waiting","warning","info","disabled"];this.normalizedSteps=this.normalizedSteps.map(((t,r)=>{if(t.status&&e.includes(t.status))return t;let s="pending";return r<this.activeStep?s="completed":r===this.activeStep&&(s="active"),{...t,status:s}}))}updateStepStatus(e,t){e>=0&&e<this.normalizedSteps.length&&(this.normalizedSteps=this.normalizedSteps.map(((r,s)=>s===e?{...r,status:t}:r)))}getStepIcon(e){if(this.customIcons&&this.customIcons[e])return this.customIcons[e];switch(e){case"completed":case"success":return"check";case"failed":case"error":return"x";case"waiting":case"pending":return"clock";case"info":return"info";case"active":return"circle-dot";case"disabled":return"ban";default:return"circle"}}renderProgressCircle(e){const t=2*Math.PI*14,r=t-e/100*t;return s("svg",{class:"stepper-progress-circle",viewBox:"0 0 32 32"},s("circle",{class:"stepper-progress-bg",cx:"16",cy:"16",r:14}),s("circle",{class:"stepper-progress-value",cx:"16",cy:"16",r:14,"stroke-dasharray":t,"stroke-dashoffset":r}))}renderStepIcon(e,t){if(e.svgIcon)return e.svgIcon.includes("<svg")?s("span",{class:"stepper-step-custom-icon",innerHTML:i(e.svgIcon)}):s("span",{class:"stepper-step-custom-icon"},s("ui-icon",{name:e.svgIcon,library:e.iconLibrary||this.iconLibrary,size:"1.25rem"}));if(e.iconUrl)return s("img",{src:e.iconUrl,alt:e.label,class:"stepper-step-image-icon"});if(e.icon)return"lucide"===this.iconLibrary?s("span",{class:"stepper-step-icon"},s("ui-icon",{name:e.icon,library:"lucide",size:"1.2em"})):s("span",{class:"stepper-step-icon","aria-hidden":"true"},e.icon);if(this.showNumbers&&"active"!==e.status&&"completed"!==e.status&&"success"!==e.status&&"failed"!==e.status)return s("span",{class:"stepper-step-number","aria-hidden":"true"},t+1);const r=this.getStepIcon(e.status);return s("span",{class:"stepper-step-icon","aria-hidden":"true"},s("ui-icon",{name:r,library:"default"===this.iconLibrary?"lucide":this.iconLibrary,size:"1.2em"}))}getStepClasses(e,t){const r=["stepper-step","stepper-step-"+this.size,"stepper-step-"+e.status];return t===this.activeStep&&r.push("stepper-step-active"),t<this.activeStep&&r.push("stepper-step-completed"),r.join(" ")}parseSteps(e){if(Array.isArray(e))return e;if("string"==typeof e&&e.trim().length)try{const t=JSON.parse(e);if(Array.isArray(t))return t}catch(e){console.warn("ui-stepper: failed to parse steps JSON, using defaults",e)}return[{id:"1",label:"Step 1",status:"completed"},{id:"2",label:"Step 2",status:"active"},{id:"3",label:"Step 3",status:"waiting"},{id:"4",label:"Step 4",status:"waiting"}]}stepsChanged(e){this.normalizedSteps=this.parseSteps(e)}componentWillLoad(){if(this.normalizedSteps=this.parseSteps(this.steps),0===this.normalizedSteps.length||4===this.normalizedSteps.length&&"Step 1"===this.normalizedSteps[0].label){const e=this.scanStepsFromChildren();e.length>0&&(this.normalizedSteps=e)}this.updateStepStatuses()}scanStepsFromChildren(){return Array.from(this.host.querySelectorAll("ui-step")).map(((e,t)=>({id:e.id||"step-"+t,label:e.stepTitle||e.getAttribute("step-title")||"Step "+(t+1),description:e.subtitle||e.getAttribute("subtitle")||"",status:e.status||e.getAttribute("status")||"pending",icon:e.icon||e.getAttribute("icon")||"",disabled:e.disabled||e.hasAttribute("disabled"),node:e})))}onPrevClick=()=>{const e=Math.max(0,this.activeStep-1);this.stepperPrevious.emit({index:e,step:this.normalizedSteps[e]})};onNextClick=()=>{const e=Math.min(this.normalizedSteps.length-1,this.activeStep+1);this.stepperNext.emit({index:e,step:this.normalizedSteps[e]})};onFinishClick=()=>{const e=this.activeStep;this.stepperFinish.emit({index:e,step:this.normalizedSteps[e]})};onFailClick=()=>{const e=this.activeStep;this.stepperFail.emit({index:e,step:this.normalizedSteps[e]})};handleKeyDown=e=>{if(this.keyboardNavigation)switch(e.key){case"ArrowLeft":case"ArrowUp":e.preventDefault(),this.prev();break;case"ArrowRight":case"ArrowDown":e.preventDefault(),this.next();break;case"Home":e.preventDefault(),this.goTo(0);break;case"End":e.preventDefault(),this.goTo(this.normalizedSteps.length-1)}};handleStepClick=e=>{("non-linear"===this.flow||e<=this.activeStep+1)&&this.goTo(e)};getProgress(){return 0===this.normalizedSteps.length?0:Math.round((this.activeStep+1)/this.normalizedSteps.length*100)}renderSnakeLayout(e,t){const r=this.stepsPerPage||10,p=[];for(let e=0;e<this.normalizedSteps.length;e+=r)p.push(this.normalizedSteps.slice(e,e+r));const i=this.getProgress();return s("div",{class:e+" stepper--snake-layout",style:t,role:"navigation","aria-label":"Step progress"},this.showProgress&&s("div",{class:"stepper-progress-bar",role:"progressbar","aria-valuenow":i,"aria-valuemin":0,"aria-valuemax":100},s("div",{class:"progress-fill",style:{width:i+"%"}}),s("span",{class:"progress-text","aria-live":"polite"},i,"% Complete (",this.activeStep+1,"/",this.normalizedSteps.length,")")),s("div",{class:"snake-container"},p.map(((e,t)=>{const p=t%2==0;return s("div",{class:{"snake-row":!0,"snake-row--even":p,"snake-row--odd":!p}},e.map(((p,i)=>{const a=t*r+i,o=i===e.length-1,n=a===this.normalizedSteps.length-1;return s("div",{class:{"stepper-item":!0,"stepper-item--active":a===this.activeStep,"stepper-item--completed":a<this.activeStep,"stepper-item--pending":a>this.activeStep,"stepper-item--clickable":"non-linear"===this.flow||a<=this.activeStep,"has-connector":!o,"has-row-connector":o&&!n},onClick:()=>this.handleStepClick(a),role:"button",title:p.label},s("div",{class:"step-icon-wrapper"},this.isLoading&&a===this.activeStep?s("ui-icon",{name:"refresh-cw",class:"fa-spin",library:"lucide",size:"1.2em"}):s("span",{class:"step-icon"},this.renderStepIcon(p,a))),!o&&s("div",{class:"snake-connector-horizontal"}),o&&!n&&s("div",{class:"snake-connector-turn"}))})))}))))}render(){let e=this.labelPosition;"vertical"===this.labelPlacement&&(e="bottom");const t=["stepper-container","stepper-"+this.orientation,"stepper-"+this.size,"stepper--"+this.colorScheme,this.responsive?"stepper-responsive":"",this.progressDot?"stepper-dot":"","stepper-label-"+e,"stepper-variant-"+this.variant,this.animated?"stepper--animated":"",this.clickable?"stepper--clickable":"",this.compact?"stepper--compact":"",this.scrollable?"stepper--scrollable":"","stepper-shape-"+this.stepShape].join(" "),r=this.theme?{"--stepper-primary-color":this.theme.primaryColor,"--stepper-secondary-color":this.theme.secondaryColor,"--stepper-success-color":this.theme.successColor,"--stepper-error-color":this.theme.errorColor,"--stepper-warning-color":this.theme.warningColor,"--stepper-info-color":this.theme.infoColor,"--stepper-text-color":this.theme.textColor,"--stepper-background-color":this.theme.backgroundColor,"--stepper-border-color":this.theme.borderColor,"--stepper-font-size":this.theme.fontSize,"--stepper-font-family":this.theme.fontFamily}:{};if(this.iconLineWidth&&(r["--icon-line-width"]=this.iconLineWidth),this.iconLineHeight&&(r["--icon-line-height"]=this.iconLineHeight),void 0!==this.iconLineFlex&&(r["--icon-line-flex"]=""+this.iconLineFlex),"snack"===this.variant&&"horizontal"===this.orientation)return this.renderSnakeLayout(t,r);const p=this.getProgress();return s("div",{class:t,style:r,role:"tablist","aria-orientation":this.orientation,"aria-label":"Step navigation",tabindex:this.keyboardNavigation?0:-1,onKeyDown:this.handleKeyDown},this.showProgress&&s("div",{class:"stepper-progress-bar",role:"progressbar","aria-valuenow":p,"aria-valuemin":0,"aria-valuemax":100},s("div",{class:"progress-fill",style:{width:p+"%"}}),s("span",{class:"progress-text","aria-live":"polite"},p,"% Complete (",this.activeStep+1,"/",this.normalizedSteps.length,")")),this.scrollable&&"horizontal"===this.orientation&&s("div",{class:"scroll-indicator scroll-indicator--left"}),s("div",{class:"steps-wrapper",role:"list",style:{display:"flex",flexDirection:"horizontal"===this.orientation?"row":"column",width:"100%"}},this.normalizedSteps.map(((t,r)=>{const p=r===this.normalizedSteps.length-1,i="non-linear"===this.flow||r<=this.activeStep,a="completed"===t.status||"success"===t.status?"completed":"failed"===t.status?"failed":"active"===t.status?"active":"pending",o=[...this.getStepClasses(t,r).split(" "),i?"stepper-step-clickable":"",this.validationErrors.has(t.id+"")?"stepper-step-error":""].filter(Boolean).join(" ");return s("div",{key:t.id,class:o,style:{position:"relative"},role:"tab","aria-selected":r===this.activeStep,"aria-controls":"step-panel-"+t.id,"aria-disabled":!i,tabindex:i?0:-1,onClick:()=>this.handleStepClick(r),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.handleStepClick(r))}},s("div",{class:"stepper-step-wrapper"},s("div",{class:"stepper-step-indicator",style:{position:"relative"},"aria-label":`Step ${r+1}: ${t.label} - ${t.status}`},void 0===t.percent||"active"!==t.status||this.progressDot?this.progressDot?s("span",{class:"stepper-dot-inner","aria-hidden":"true"}):this.renderStepIcon(t,r):this.renderProgressCircle(t.percent)),"vertical"===this.orientation&&!p&&s("span",{class:`stepper-connector stepper-connector-${this.orientation} stepper-connector-${a}`,"aria-hidden":"true"}),"horizontal"===this.orientation?s("div",{class:"stepper-step-content stepper-step-content-horizontal"},s("div",{class:"stepper-step-title"},s("div",{class:"stepper-step-label"},t.node&&t.node.renderContent?t.node.renderContent():t.label),!p&&"top"!==e&&"bottom"!==e&&s("span",{class:"stepper-connector stepper-connector-horizontal stepper-connector-"+a,"aria-hidden":"true"})),this.showDescriptions&&t.description&&s("div",{class:"stepper-step-description"},t.description),s("div",{class:"stepper-content-slot"},s("slot",{name:"content-"+t.id})),this.validationErrors.has(t.id+"")&&s("div",{class:"stepper-step-error-message",role:"alert"},this.validationErrors.get(t.id+""))):s("div",{class:"stepper-step-content"},s("div",{class:{"stepper-step-label":!0,"stepper-label-active":r===this.activeStep}},t.label),this.showDescriptions&&t.description&&s("div",{class:"stepper-step-description"},t.description),s("div",{class:{"stepper-content-slot":!0,"stepper-content-active":r===this.activeStep,"stepper-content-panel":"panel"===this.variant}},s("slot",{name:"content-"+t.id})),this.validationErrors.has(t.id+"")&&s("div",{class:"stepper-step-error-message",role:"alert"},this.validationErrors.get(t.id+"")),t.children&&t.children.length>0&&s("div",{class:"stepper-sub-steps"},t.children.map(((e,t)=>s("div",{class:"stepper-sub-step stepper-sub-step-"+(e.status||"pending"),key:e.id||t},s("span",{class:"sub-step-dot"}),s("span",{class:"sub-step-label"},e.label)))))),"horizontal"===this.orientation&&!p&&("top"===e||"bottom"===e)&&s("span",{class:"stepper-connector stepper-connector-horizontal stepper-connector-"+a,"aria-hidden":"true"})))}))),this.scrollable&&"horizontal"===this.orientation&&s("div",{class:"scroll-indicator scroll-indicator--right"}),this.showControls?s("div",{class:"stepper-controls",role:"group","aria-label":"Step controls"},s("ui-button",{variant:"secondary",size:"sm"===this.size?"sm":"md",onClick:this.onPrevClick,disabled:this.activeStep<=0,ariaLabel:this.labelPrev,label:this.labelPrev}),s("ui-button",{variant:"primary",size:"sm"===this.size?"sm":"md",onClick:this.onNextClick,disabled:this.activeStep>=this.normalizedSteps.length-1,ariaLabel:this.labelNext,label:this.labelNext}),s("ui-button",{variant:"success",size:"sm"===this.size?"sm":"md",onClick:this.onFinishClick,ariaLabel:this.labelFinish,label:this.labelFinish}),s("ui-button",{variant:"danger",size:"sm"===this.size?"sm":"md",onClick:this.onFailClick,ariaLabel:this.labelFail,label:this.labelFail})):null)}static get watchers(){return{activeStep:[{handleActiveStepChange:0}],steps:[{stepsChanged:0}]}}static get style(){return'.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;width:100%}.stepper-container{display:flex;width:100%;font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;box-sizing:border-box}.stepper-horizontal{flex-direction:row}.stepper-vertical{flex-direction:column}.stepper-step{position:relative;display:flex;flex:1;vertical-align:top}.stepper-horizontal .stepper-step{margin-right:16px}.stepper-horizontal .stepper-step:last-child{margin-right:0}.stepper-vertical .stepper-step{flex-direction:column;flex:none;min-height:64px}.stepper-step-wrapper{display:flex;align-items:flex-start;width:100%}.stepper-label-right .stepper-step-wrapper{flex-direction:row}.stepper-label-left .stepper-step-wrapper{flex-direction:row-reverse}.stepper-label-left .stepper-step-indicator{margin-right:0;margin-left:8px}.stepper-horizontal.stepper-label-top .stepper-step-wrapper{flex-direction:column-reverse;align-items:center;text-align:center}.stepper-horizontal.stepper-label-top .stepper-step-indicator{margin-right:0;margin-top:8px}.stepper-horizontal.stepper-label-bottom .stepper-step-wrapper,.stepper-horizontal.stepper-label-vertical .stepper-step-wrapper{flex-direction:column;align-items:center;text-align:center}.stepper-horizontal.stepper-label-bottom .stepper-step-indicator,.stepper-horizontal.stepper-label-vertical .stepper-step-indicator{margin-right:0;margin-bottom:8px}.stepper-horizontal.stepper-label-top .stepper-step-title,.stepper-horizontal.stepper-label-bottom .stepper-step-title{display:block;width:100%}.stepper-horizontal.stepper-label-top .stepper-step-title .stepper-connector,.stepper-horizontal.stepper-label-bottom .stepper-step-title .stepper-connector{display:none}.stepper-horizontal.stepper-label-top .stepper-step-content,.stepper-horizontal.stepper-label-bottom .stepper-step-content{display:flex;flex-direction:column;align-items:center;width:100%}.stepper-label-top .stepper-step-label,.stepper-label-bottom .stepper-step-label{text-align:center;padding-right:0}.stepper-vertical.stepper-label-top .stepper-step-wrapper,.stepper-vertical.stepper-label-bottom .stepper-step-wrapper{flex-direction:row;align-items:flex-start;text-align:left}.stepper-vertical.stepper-label-top .stepper-step-indicator,.stepper-vertical.stepper-label-bottom .stepper-step-indicator{margin-right:8px;margin-top:0;margin-bottom:0}.stepper-vertical.stepper-label-top .stepper-step-content,.stepper-vertical.stepper-label-bottom .stepper-step-content{align-items:flex-start;text-align:left}.stepper-vertical.stepper-label-top .stepper-step-wrapper{align-items:flex-end;align-items:flex-start}.stepper-vertical.stepper-label-bottom .stepper-step-wrapper{align-items:flex-start}.stepper-step-indicator{display:flex;align-items:center;justify-content:center;width:32px;height:32px;margin-right:8px;background-color:var(--bg-primary, var(--text-standard, #ffffff));border:1px solid rgba(0, 0, 0, 0.25);border-radius:50%;transition:all 0.3s;flex-shrink:0;color:rgba(0, 0, 0, 0.25);font-size:14px;z-index:2}.stepper-shape-square .stepper-step-indicator{border-radius:4px !important}.stepper-shape-square-active .stepper-step-active .stepper-step-indicator{border-radius:4px !important;background-color:var(--bg-primary, #f6ffed) !important;border:1px solid var(--color-success, #b7eb8f) !important;padding:4px;width:38px !important;height:38px !important;position:relative;display:flex !important;align-items:center;justify-content:center;z-index:10}.stepper-shape-square-active .stepper-step-active .stepper-step-indicator::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:24px;height:24px;background-color:var(--color-primary, #1677ff);border-radius:50%;z-index:-1}.stepper-shape-square-active .stepper-step-active .stepper-step-indicator .stepper-step-icon,.stepper-shape-square-active .stepper-step-active .stepper-step-indicator .stepper-step-number,.stepper-shape-square-active .stepper-step-active .stepper-step-indicator ui-icon{color:var(--text-standard, #ffffff) !important;font-size:14px;--icon-color:var(--text-standard, #ffffff)}.stepper--primary{--stepper-color:var(--color-primary, #1677ff);--stepper-color-hover:var(--color-primary, #4096ff);--stepper-success:var(--color-success, #52c41a);--stepper-error:var(--color-danger, #ff4d4f);--stepper-warning:var(--color-danger, #faad14)}.stepper--success{--stepper-color:var(--color-success, #52c41a);--stepper-color-hover:var(--color-success, #73d13d)}.stepper--warning{--stepper-color:var(--color-danger, #faad14);--stepper-color-hover:var(--color-danger, #ffc53d)}.stepper--danger{--stepper-color:var(--color-danger, #ff4d4f);--stepper-color-hover:var(--color-danger, #ff7875)}.stepper-label-vertical .stepper-step-indicator{margin-right:0;margin-bottom:8px}.stepper-step-active .stepper-step-indicator{background-color:var(--stepper-color, #1677ff);border-color:var(--stepper-color, #1677ff);color:var(--text-standard, #ffffff)}.stepper-step-active .stepper-step-label{color:var(--stepper-color, #1677ff);font-weight:600}.stepper-shape-square-active .stepper-step-active .stepper-step-label{color:var(--color-success, #52c41a) !important;font-weight:700}.stepper-step-completed .stepper-step-indicator,.stepper-step-success .stepper-step-indicator{background-color:var(--bg-primary, var(--text-standard, #ffffff));border-color:var(--color-success, #52c41a);color:var(--color-success, #52c41a)}.stepper-step-completed .stepper-step-label,.stepper-step-success .stepper-step-label{color:rgba(0, 0, 0, 0.45)}.stepper-step-failed .stepper-step-indicator,.stepper-step-error .stepper-step-indicator{background-color:var(--bg-primary, var(--text-standard, #ffffff));border-color:var(--color-danger, #ff4d4f);color:var(--color-danger, #ff4d4f)}.stepper-step-failed .stepper-step-label,.stepper-step-error .stepper-step-label{color:var(--color-danger, #ff4d4f)}.stepper-step-pending .stepper-step-indicator,.stepper-step-waiting .stepper-step-indicator{background-color:var(--bg-primary, var(--text-standard, #ffffff));border-color:rgba(0, 0, 0, 0.25);color:rgba(0, 0, 0, 0.25)}.stepper-step-info .stepper-step-indicator{background-color:var(--bg-primary, var(--text-standard, #ffffff));border-color:var(--color-primary, #1677ff);color:var(--color-primary, #1677ff)}.stepper-step-info .stepper-step-label{color:rgba(0, 0, 0, 0.45)}.stepper-step-warning .stepper-step-indicator{background-color:var(--bg-primary, var(--text-standard, #ffffff));border-color:var(--color-danger, #faad14);color:var(--color-danger, #faad14)}.stepper-step-warning .stepper-step-label{color:rgba(0, 0, 0, 0.45)}.stepper-step-disabled .stepper-step-indicator{background-color:var(--bg-primary, #f5f5f5);border-color:var(--border-default, #d9d9d9);color:rgba(0, 0, 0, 0.25);cursor:not-allowed}.stepper-step-disabled .stepper-step-label{color:rgba(0, 0, 0, 0.25);cursor:not-allowed}.stepper-step-icon{font-style:normal;line-height:0;text-align:center;text-transform:none;vertical-align:-0.125em;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}.stepper-progress-circle{position:absolute;top:-1px;left:-1px;width:34px;height:34px;transform:rotate(-90deg)}.stepper-progress-bg{fill:none;stroke:rgba(0, 0, 0, 0.06);stroke-width:2px}.stepper-progress-value{fill:none;stroke:var(--color-primary, #1677ff);stroke-width:2.5px;stroke-linecap:round;transition:stroke-dashoffset 0.3s ease}.stepper-sm .stepper-progress-circle{width:26px;height:26px}.stepper-step-image-icon{width:20px;height:20px;border-radius:50%;object-fit:cover}.stepper-step-custom-icon{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.stepper-step-custom-icon svg{width:16px;height:16px}.stepper-step-content{display:flex;flex-direction:column;flex:1;min-height:32px;justify-content:center}.stepper-step-label{position:relative;display:inline-block;padding-right:16px;color:rgba(0, 0, 0, 0.45);font-size:14px;line-height:32px;white-space:nowrap}.stepper-vertical .stepper-step-label{line-height:32px}.stepper-step-description{color:rgba(0, 0, 0, 0.45);font-size:14px;line-height:1.5;white-space:normal}.stepper-step-title{display:flex;align-items:center;position:relative}.stepper-connector{position:absolute;background-color:rgba(0, 0, 0, 0.06);transition:background-color 0.3s}.stepper-horizontal .stepper-connector{position:relative;flex:1;height:1px;margin:0 8px;background-color:rgba(0, 0, 0, 0.06);opacity:1;visibility:visible}.stepper-horizontal.stepper-label-bottom .stepper-connector{position:absolute;top:16px;left:50%;width:calc(100% + 16px);margin:0}.stepper-horizontal.stepper-label-top .stepper-connector{position:absolute;top:auto;bottom:16px;left:50%;width:calc(100% + 16px);margin:0}.stepper-horizontal.stepper-label-top .stepper-step,.stepper-horizontal.stepper-label-bottom .stepper-step{position:relative}.stepper-vertical .stepper-connector{top:36px;left:16px;width:1px;height:calc(100% - 40px);flex:var(--icon-line-flex, none)}.stepper-step-completed .stepper-connector,.stepper-step-success .stepper-connector,.stepper-shape-square-active .stepper-step-active .stepper-connector,.stepper-shape-square-active .stepper-connector-active{background-color:var(--color-success, #52c41a) !important;height:2px}.stepper-dot .stepper-step-indicator{width:8px;height:8px;margin-right:8px;margin-left:0;border:none;background-color:rgba(0, 0, 0, 0.25)}.stepper-dot .stepper-dot-inner{display:none}.stepper-dot .stepper-step-active .stepper-step-indicator{width:10px;height:10px;background-color:var(--color-primary, #1677ff)}.stepper-dot.stepper-horizontal .stepper-connector{position:absolute;top:4px;left:16px;width:calc(100% - 24px);margin:0}.stepper-dot.stepper-horizontal.stepper-label-bottom .stepper-connector{top:4px;left:50%;width:calc(100% + 16px);margin:0}.stepper-dot.stepper-horizontal.stepper-label-top .stepper-connector{top:auto;bottom:4px;left:50%;width:calc(100% + 16px);margin:0}.stepper-dot.stepper-vertical .stepper-connector{left:4px;top:10px}.stepper-dot .stepper-step-wrapper{align-items:center}.stepper-dot .stepper-step-content{min-height:auto}.stepper-sm .stepper-step-indicator{width:24px;height:24px;font-size:12px}.stepper-sm .stepper-step-label{font-size:14px;line-height:24px}.stepper-sm.stepper-horizontal .stepper-connector{top:12px}.stepper-lg .stepper-step-indicator{width:40px;height:40px;font-size:18px}.stepper-lg .stepper-step-label{font-size:16px;line-height:40px}.stepper-variant-inline{display:inline-flex;gap:0;border:1px solid var(--border-default, #d9d9d9);border-radius:6px;padding:0;background:var(--bg-primary, #ffffff);overflow:hidden}.stepper-variant-inline .stepper-step{padding:10px 20px;margin:0;border-right:1px solid var(--border-default, #d9d9d9);background:var(--bg-primary, #fafafa);transition:all 0.3s;position:relative}.stepper-variant-inline .stepper-step:last-child{border-right:none}.stepper-variant-inline .stepper-step:hover{background:var(--bg-primary, #f0f0f0)}.stepper-variant-inline .stepper-step-active{background:var(--color-primary, #1677ff);color:var(--text-standard, #ffffff)}.stepper-variant-inline .stepper-step-active .stepper-step-label{color:var(--text-standard, #ffffff);font-weight:600}.stepper-variant-inline .stepper-step-completed{background:var(--bg-primary, #f6ffed)}.stepper-variant-inline .stepper-connector{display:none}.stepper-variant-inline .stepper-step-indicator{width:18px;height:18px;font-size:11px}.stepper-variant-inline .stepper-step-wrapper{align-items:center}.stepper-variant-inline .stepper-step-content{min-height:auto}.stepper-variant-inline .stepper-step-label{line-height:18px;font-size:13px}.stepper-sub-steps{margin-top:8px;padding-left:12px;display:flex;flex-direction:column;gap:4px}.stepper-sub-step{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(0, 0, 0, 0.45)}.sub-step-dot{width:6px;height:6px;border-radius:50%;background-color:rgba(0, 0, 0, 0.25)}.stepper-sub-step-active .sub-step-label{color:var(--color-primary, #1677ff);font-weight:500}.stepper-sub-step-active .sub-step-dot{background-color:var(--color-primary, #1677ff)}.stepper-sub-step-completed .sub-step-dot{background-color:var(--color-success, #52c41a)}.stepper-controls{display:flex;gap:8px;margin-top:24px;justify-content:flex-end}.stepper-btn{padding:4px 15px;border-radius:6px;border:1px solid var(--border-default, #d9d9d9);background:var(--bg-primary, #ffffff);cursor:pointer;transition:all 0.2s}.stepper-btn:hover{color:var(--color-primary, #4096ff);border-color:var(--color-primary, #4096ff)}.stepper-btn.prev:hover{color:var(--color-primary, #4096ff);border-color:var(--color-primary, #4096ff)}.stepper-btn:disabled{color:rgba(0, 0, 0, 0.25);background-color:var(--bg-primary, #f5f5f5);border-color:var(--border-default, #d9d9d9);cursor:not-allowed}.stepper-step-clickable{cursor:pointer}.stepper-step-clickable:hover .stepper-step-indicator{border-color:var(--color-primary, #1677ff);color:var(--color-primary, #1677ff)}.stepper-step-clickable:hover .stepper-step-label{color:var(--color-primary, #1677ff)}.stepper-step-error-message{color:var(--color-danger, #ff4d4f);font-size:12px;margin-top:4px}.stepper-variant-navigation{border-bottom:1px solid rgba(0, 0, 0, 0.06);padding-bottom:8px}.stepper-variant-navigation .stepper-step{padding:8px 16px;margin:0;transition:background-color 0.3s}.stepper-variant-navigation .stepper-step::after{content:"";position:absolute;bottom:-8px;left:0;width:100%;height:2px;background-color:transparent;transition:all 0.3s}.stepper-variant-navigation .stepper-step-active::after{background-color:var(--color-primary, #1677ff)}.stepper-variant-navigation .stepper-step:hover{background-color:rgba(0, 0, 0, 0.02)}.stepper-variant-navigation .stepper-connector{display:none}.stepper-variant-panel{gap:0;background:transparent;padding:0;position:relative}.stepper-variant-panel .stepper-step{background:var(--bg-primary, #ffffff);border-radius:8px;padding:20px 24px;border:2px solid var(--border-subtle, #e8e8e8);transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);margin:0;margin-right:24px;flex:1;box-shadow:0 1px 2px rgba(0, 0, 0, 0.04);position:relative}.stepper-variant-panel .stepper-step:last-child{margin-right:0}.stepper-variant-panel .stepper-step::after{content:"";position:absolute;right:-14px;top:50%;transform:translateY(-50%);width:0;height:0;border-top:14px solid transparent;border-bottom:14px solid transparent;border-left:14px solid var(--border-subtle, #ffffff);z-index:2}.stepper-variant-panel .stepper-step::before{content:"";position:absolute;right:-16px;top:50%;transform:translateY(-50%);width:0;height:0;border-top:16px solid transparent;border-bottom:16px solid transparent;border-left:16px solid var(--border-subtle, #e8e8e8);z-index:1}.stepper-variant-panel .stepper-step:last-child::after,.stepper-variant-panel .stepper-step:last-child::before{display:none}.stepper-variant-panel .stepper-step:hover{border-color:var(--border-default, #d9d9d9);box-shadow:0 2px 4px rgba(0, 0, 0, 0.08)}.stepper-variant-panel .stepper-step-active{background:linear-gradient(135deg, var(--bg-primary, #e6f4ff) 0%, var(--bg-primary, #f0f8ff) 100%);border-color:var(--color-primary, #1677ff);box-shadow:0 4px 12px rgba(22, 119, 255, 0.15);transform:scale(1.02)}.stepper-variant-panel .stepper-step-active::after{border-left-color:var(--border-subtle, #f0f8ff)}.stepper-variant-panel .stepper-step-active::before{border-left-color:var(--color-primary, #1677ff)}.stepper-variant-panel .stepper-step-active .stepper-step-indicator{background:linear-gradient(135deg, var(--color-primary, #1677ff) 0%, var(--color-primary, #4096ff) 100%);box-shadow:0 2px 8px rgba(22, 119, 255, 0.3)}.stepper-variant-panel .stepper-step-completed{background:var(--bg-primary, #f6ffed);border-color:var(--color-success, #b7eb8f)}.stepper-variant-panel .stepper-step-completed::after{border-left-color:var(--border-subtle, #f6ffed)}.stepper-variant-panel .stepper-step-completed::before{border-left-color:var(--color-success, #b7eb8f)}.stepper-variant-panel .stepper-step-completed .stepper-step-indicator{background:linear-gradient(135deg, var(--color-success, #52c41a) 0%, var(--color-success, #73d13d) 100%)}.stepper-variant-panel .stepper-step-label{font-weight:600;color:rgba(0, 0, 0, 0.85)}.stepper-variant-panel .stepper-step-active .stepper-step-label{color:var(--color-primary, #1677ff)}.stepper-variant-panel .stepper-connector{display:none}@media (max-width: 768px){.stepper-responsive.stepper-horizontal{flex-direction:column}.stepper-responsive.stepper-horizontal .stepper-step{margin-right:0;margin-bottom:16px}}.stepper-content-slot{display:none;margin-top:12px;width:100%}.stepper-step-active .stepper-content-slot{display:block}.stepper-vertical .stepper-content-slot{padding-left:0}.stepper-progress-bar{position:relative;width:100%;height:8px;background:var(--bg-primary, #e5e7eb);border-radius:4px;margin-bottom:24px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg, var(--color-success, #3dcd58), var(--color-success, #22c55e));border-radius:4px;transition:width 0.4s ease;position:relative}.progress-text{position:absolute;top:12px;right:0;font-size:0.75rem;font-weight:600;color:var(--text-muted, #6b7280)}.step-optional-badge{font-size:10px;background-color:var(--bg-primary, #f5f5f5);color:var(--text-secondary, #595959);padding:2px 6px;border-radius:10px;margin-left:8px;margin-top:4px;display:inline-block;vertical-align:middle}.scroll-indicator{position:absolute;top:0;bottom:0;width:24px;pointer-events:none;z-index:10}.scroll-indicator--left{left:0;background:linear-gradient(to right, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%)}.scroll-indicator--right{right:0;background:linear-gradient(to left, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%)}.stepper--snake-layout .snake-container{display:flex;flex-direction:column;gap:0;width:100%}.stepper--snake-layout .snake-row{display:flex;align-items:center;justify-content:space-between;padding:16px 0;position:relative;width:100%}.stepper--snake-layout .snake-row--odd{flex-direction:row-reverse}.stepper--snake-layout .stepper-item{position:relative;padding:0;flex:0 0 10%;max-width:10%;display:flex;justify-content:center;z-index:2;box-sizing:border-box}.stepper--snake-layout .step-icon-wrapper{width:32px;height:32px;background:var(--bg-primary, #e5e7eb);border-radius:50%;transition:all 0.2s;font-size:0.75rem;font-weight:700;color:var(--text-muted, #6b7280);display:flex;align-items:center;justify-content:center;z-index:2;position:relative;background-color:var(--bg-primary, var(--text-standard, #ffffff))}.stepper--snake-layout .stepper-item--active .step-icon-wrapper{width:36px;height:36px;background:var(--color-primary, #1677ff);color:var(--text-standard, #ffffff);transform:scale(1.1);box-shadow:0 4px 10px rgba(0, 0, 0, 0.15)}.stepper--snake-layout .stepper-item--completed .step-icon-wrapper{background:var(--color-success, #52c41a);color:var(--text-standard, #ffffff)}.stepper--snake-layout .stepper-item.has-connector::after{content:"";position:absolute;top:50%;height:2px;background:var(--bg-primary, #e5e7eb);z-index:-1;width:100%;left:50%;transform:translateY(-50%)}.stepper--snake-layout .snake-row--odd .stepper-item.has-connector::after{left:auto;right:50%}.stepper--snake-layout .stepper-item--completed.has-connector::after{background:var(--color-success, #52c41a)}.stepper--snake-layout .snake-connector-turn{position:absolute;top:50%;left:50%;transform:translateX(-50%);width:2px;height:64px;background:var(--bg-primary, #e5e7eb);z-index:-2}.stepper--snake-layout .stepper-item--completed.has-row-connector .snake-connector-turn{background:var(--color-success, #52c41a)}'}},[769,"ui-stepper",{steps:[1],orientation:[1],size:[1],activeStep:[2,"active-step"],showNumbers:[4,"show-numbers"],showDescriptions:[4,"show-descriptions"],showControls:[4,"show-controls"],labelPrev:[1,"label-prev"],labelNext:[1,"label-next"],labelFinish:[1,"label-finish"],labelFail:[1,"label-fail"],customIcons:[16],flow:[1],shadow:[4],theme:[16],keyboardNavigation:[4,"keyboard-navigation"],responsive:[4],maxVisibleSteps:[2,"max-visible-steps"],progressDot:[4,"progress-dot"],iconLibrary:[1,"icon-library"],labelPlacement:[1,"label-placement"],labelPosition:[1,"label-position"],variant:[1],colorScheme:[1,"color-scheme"],animated:[4],showProgress:[4,"show-progress"],validateBeforeNext:[16],mobileBreakpoint:[2,"mobile-breakpoint"],allowStepClick:[4,"allow-step-click"],showTooltips:[4,"show-tooltips"],compact:[4],stepsPerPage:[2,"steps-per-page"],scrollable:[4],clickable:[4],iconLineWidth:[1,"icon-line-width"],iconLineHeight:[1,"icon-line-height"],iconLineFlex:[2,"icon-line-flex"],stepShape:[1,"step-shape"],normalizedSteps:[32],validationErrors:[32],isMobile:[32],isLoading:[32],next:[64],prev:[64],goTo:[64],complete:[64],fail:[64],getCurrentStep:[64],getSteps:[64],validateCurrentStep:[64]},void 0,{activeStep:[{handleActiveStepChange:0}],steps:[{stepsChanged:0}]}]),c=l,d=function(){"undefined"!=typeof customElements&&["ui-stepper","ui-badge","ui-button","ui-icon"].forEach((e=>{switch(e){case"ui-stepper":customElements.get(p(e))||customElements.define(p(e),l);break;case"ui-badge":customElements.get(p(e))||n();break;case"ui-button":customElements.get(p(e))||o();break;case"ui-icon":customElements.get(p(e))||a()}}))};export{c as UiStepper,d as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as t,createEvent as r,h as s,transformTag as p}from"@stencil/core/internal/client";import{s as i,d as a}from"./icon.js";import{d as o,a as n}from"./badge.js";import{d as l}from"./loader.js";const c=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.stepperPrevious=r(this,"stepperPrevious",7),this.stepperNext=r(this,"stepperNext",7),this.stepperFinish=r(this,"stepperFinish",7),this.stepperFail=r(this,"stepperFail",7),this.stepperChange=r(this,"stepperChange",7),this.stepperValidationError=r(this,"stepperValidationError",7),this.progressUpdate=r(this,"progressUpdate",7),this.stepValidation=r(this,"stepValidation",7),this.stepLoading=r(this,"stepLoading",7)}steps=[];normalizedSteps=[];orientation="horizontal";size="md";activeStep=0;showNumbers=!0;showDescriptions=!1;showControls=!1;labelPrev="Previous";labelNext="Next";labelFinish="Finish";labelFail="Mark Failed";stepperPrevious;stepperNext;stepperFinish;stepperFail;customIcons;flow="linear";shadow=!0;theme;keyboardNavigation=!0;responsive=!0;maxVisibleSteps=5;progressDot=!1;iconLibrary="default";labelPlacement="horizontal";labelPosition="right";variant="default";colorScheme="primary";animated=!0;showProgress=!1;validateBeforeNext;mobileBreakpoint=768;allowStepClick=!0;showTooltips=!0;compact=!1;stepsPerPage=0;scrollable=!0;clickable=!1;iconLineWidth;iconLineHeight;iconLineFlex;stepShape="circle";validationErrors=new Map;isMobile=!1;isLoading=!1;get host(){return this}stepperChange;stepperValidationError;progressUpdate;stepValidation;stepLoading;async next(e={}){return this.navigateToStep(this.activeStep+1,e)}async prev(e={}){return this.navigateToStep(this.activeStep-1,e)}async goTo(e,t={}){return this.navigateToStep(e,t)}async complete(e){const t=e??this.activeStep;t>=0&&t<this.normalizedSteps.length&&this.updateStepStatus(t,"completed")}async fail(e,t){const r=e??this.activeStep;r>=0&&r<this.normalizedSteps.length&&(this.updateStepStatus(r,"failed"),t&&this.validationErrors.set(this.normalizedSteps[r].id+"",t))}async getCurrentStep(){return this.activeStep>=0&&this.activeStep<this.normalizedSteps.length?this.normalizedSteps[this.activeStep]:null}async getSteps(){return[...this.normalizedSteps]}async validateCurrentStep(){return this.validateStep(this.activeStep)}async navigateToStep(e,t={}){if(e<0||e>=this.normalizedSteps.length)return!1;const r=this.normalizedSteps[e];if(!t.force&&!this.canNavigateTo(e))return!1;if(!t.skipValidation&&"linear"===this.flow&&e>this.activeStep&&!await this.validateStep(this.activeStep))return!1;const s=this.activeStep;return this.activeStep=e,this.updateStepStatuses(),this.stepperChange.emit({index:e,step:r,previousIndex:s}),!0}handleActiveStepChange(){this.updateStepStatuses()}canNavigateTo(e){return"non-linear"===this.flow||e<=this.activeStep+1}async validateStep(e){const t=this.normalizedSteps[e];if(this.validateBeforeNext){this.isLoading=!0,this.stepLoading.emit(!0);try{const r=await this.validateBeforeNext(e);if(this.stepValidation.emit({step:e,valid:r}),!r){const r="Validation failed for the current step";return this.validationErrors.set((t?.id||e)+"",r),t&&this.stepperValidationError.emit({index:e,step:t,error:r}),!1}}finally{this.isLoading=!1,this.stepLoading.emit(!1)}}if(!t)return!0;if(t.node&&"function"==typeof t.node.validate){this.isLoading=!0,this.stepLoading.emit(!0);try{if(!await t.node.validate()){const r="Step validation failed";return this.validationErrors.set(t.id+"",r),this.stepperValidationError.emit({index:e,step:t,error:r}),!1}}catch(r){const s="Validation error: "+r.message;return this.validationErrors.set(t.id+"",s),this.stepperValidationError.emit({index:e,step:t,error:s}),!1}finally{this.isLoading=!1,this.stepLoading.emit(!1)}}if(!t.validator)return!0;try{if(!await t.validator.validate(t,t.data)){const r=t.validator.errorMessage||"Validation failed";return this.validationErrors.set(t.id+"",r),this.stepperValidationError.emit({index:e,step:t,error:r}),!1}return this.validationErrors.delete(t.id+""),!0}catch(r){const s="Validation error: "+r.message;return this.validationErrors.set(t.id+"",s),this.stepperValidationError.emit({index:e,step:t,error:s}),!1}}updateStepStatuses(){const e=["failed","error","waiting","warning","info","disabled"];this.normalizedSteps=this.normalizedSteps.map(((t,r)=>{if(t.status&&e.includes(t.status))return t;let s="pending";return r<this.activeStep?s="completed":r===this.activeStep&&(s="active"),{...t,status:s}}))}updateStepStatus(e,t){e>=0&&e<this.normalizedSteps.length&&(this.normalizedSteps=this.normalizedSteps.map(((r,s)=>s===e?{...r,status:t}:r)))}getStepIcon(e){if(this.customIcons&&this.customIcons[e])return this.customIcons[e];switch(e){case"completed":case"success":return"check";case"failed":case"error":return"x";case"waiting":case"pending":return"clock";case"info":return"info";case"active":return"circle-dot";case"disabled":return"ban";default:return"circle"}}renderProgressCircle(e){const t=2*Math.PI*14,r=t-e/100*t;return s("svg",{class:"stepper-progress-circle",viewBox:"0 0 32 32"},s("circle",{class:"stepper-progress-bg",cx:"16",cy:"16",r:14}),s("circle",{class:"stepper-progress-value",cx:"16",cy:"16",r:14,"stroke-dasharray":t,"stroke-dashoffset":r}))}renderStepIcon(e,t){if(e.svgIcon)return e.svgIcon.includes("<svg")?s("span",{class:"stepper-step-custom-icon",innerHTML:i(e.svgIcon)}):s("span",{class:"stepper-step-custom-icon"},s("ui-icon",{name:e.svgIcon,library:e.iconLibrary||this.iconLibrary,size:"1.25rem"}));if(e.iconUrl)return s("img",{src:e.iconUrl,alt:e.label,class:"stepper-step-image-icon"});if(e.icon)return"lucide"===this.iconLibrary?s("span",{class:"stepper-step-icon"},s("ui-icon",{name:e.icon,library:"lucide",size:"1.2em"})):s("span",{class:"stepper-step-icon","aria-hidden":"true"},e.icon);if(this.showNumbers&&"active"!==e.status&&"completed"!==e.status&&"success"!==e.status&&"failed"!==e.status)return s("span",{class:"stepper-step-number","aria-hidden":"true"},t+1);const r=this.getStepIcon(e.status);return s("span",{class:"stepper-step-icon","aria-hidden":"true"},s("ui-icon",{name:r,library:"default"===this.iconLibrary?"lucide":this.iconLibrary,size:"1.2em"}))}getStepClasses(e,t){const r=["stepper-step","stepper-step-"+this.size,"stepper-step-"+e.status];return t===this.activeStep&&r.push("stepper-step-active"),t<this.activeStep&&r.push("stepper-step-completed"),r.join(" ")}parseSteps(e){if(Array.isArray(e))return e;if("string"==typeof e&&e.trim().length)try{const t=JSON.parse(e);if(Array.isArray(t))return t}catch(e){console.warn("ui-stepper: failed to parse steps JSON, using defaults",e)}return[{id:"1",label:"Step 1",status:"completed"},{id:"2",label:"Step 2",status:"active"},{id:"3",label:"Step 3",status:"waiting"},{id:"4",label:"Step 4",status:"waiting"}]}stepsChanged(e){this.normalizedSteps=this.parseSteps(e)}componentWillLoad(){if(this.normalizedSteps=this.parseSteps(this.steps),0===this.normalizedSteps.length||4===this.normalizedSteps.length&&"Step 1"===this.normalizedSteps[0].label){const e=this.scanStepsFromChildren();e.length>0&&(this.normalizedSteps=e)}this.updateStepStatuses()}scanStepsFromChildren(){return Array.from(this.host.querySelectorAll("ui-step")).map(((e,t)=>({id:e.id||"step-"+t,label:e.stepTitle||e.getAttribute("step-title")||"Step "+(t+1),description:e.subtitle||e.getAttribute("subtitle")||"",status:e.status||e.getAttribute("status")||"pending",icon:e.icon||e.getAttribute("icon")||"",disabled:e.disabled||e.hasAttribute("disabled"),node:e})))}onPrevClick=()=>{const e=Math.max(0,this.activeStep-1);this.stepperPrevious.emit({index:e,step:this.normalizedSteps[e]})};onNextClick=()=>{const e=Math.min(this.normalizedSteps.length-1,this.activeStep+1);this.stepperNext.emit({index:e,step:this.normalizedSteps[e]})};onFinishClick=()=>{const e=this.activeStep;this.stepperFinish.emit({index:e,step:this.normalizedSteps[e]})};onFailClick=()=>{const e=this.activeStep;this.stepperFail.emit({index:e,step:this.normalizedSteps[e]})};handleKeyDown=e=>{if(this.keyboardNavigation)switch(e.key){case"ArrowLeft":case"ArrowUp":e.preventDefault(),this.prev();break;case"ArrowRight":case"ArrowDown":e.preventDefault(),this.next();break;case"Home":e.preventDefault(),this.goTo(0);break;case"End":e.preventDefault(),this.goTo(this.normalizedSteps.length-1)}};handleStepClick=e=>{("non-linear"===this.flow||e<=this.activeStep+1)&&this.goTo(e)};getProgress(){return 0===this.normalizedSteps.length?0:Math.round((this.activeStep+1)/this.normalizedSteps.length*100)}renderSnakeLayout(e,t){const r=this.stepsPerPage||10,p=[];for(let e=0;e<this.normalizedSteps.length;e+=r)p.push(this.normalizedSteps.slice(e,e+r));const i=this.getProgress();return s("div",{class:e+" stepper--snake-layout",style:t,role:"navigation","aria-label":"Step progress"},this.showProgress&&s("div",{class:"stepper-progress-bar",role:"progressbar","aria-valuenow":i,"aria-valuemin":0,"aria-valuemax":100},s("div",{class:"progress-fill",style:{width:i+"%"}}),s("span",{class:"progress-text","aria-live":"polite"},i,"% Complete (",this.activeStep+1,"/",this.normalizedSteps.length,")")),s("div",{class:"snake-container"},p.map(((e,t)=>{const p=t%2==0;return s("div",{class:{"snake-row":!0,"snake-row--even":p,"snake-row--odd":!p}},e.map(((p,i)=>{const a=t*r+i,o=i===e.length-1,n=a===this.normalizedSteps.length-1;return s("div",{class:{"stepper-item":!0,"stepper-item--active":a===this.activeStep,"stepper-item--completed":a<this.activeStep,"stepper-item--pending":a>this.activeStep,"stepper-item--clickable":"non-linear"===this.flow||a<=this.activeStep,"has-connector":!o,"has-row-connector":o&&!n},onClick:()=>this.handleStepClick(a),role:"button",title:p.label},s("div",{class:"step-icon-wrapper"},this.isLoading&&a===this.activeStep?s("ui-icon",{name:"refresh-cw",class:"fa-spin",library:"lucide",size:"1.2em"}):s("span",{class:"step-icon"},this.renderStepIcon(p,a))),!o&&s("div",{class:"snake-connector-horizontal"}),o&&!n&&s("div",{class:"snake-connector-turn"}))})))}))))}render(){let e=this.labelPosition;"vertical"===this.labelPlacement&&(e="bottom");const t=["stepper-container","stepper-"+this.orientation,"stepper-"+this.size,"stepper--"+this.colorScheme,this.responsive?"stepper-responsive":"",this.progressDot?"stepper-dot":"","stepper-label-"+e,"stepper-variant-"+this.variant,this.animated?"stepper--animated":"",this.clickable?"stepper--clickable":"",this.compact?"stepper--compact":"",this.scrollable?"stepper--scrollable":"","stepper-shape-"+this.stepShape].join(" "),r=this.theme?{"--stepper-primary-color":this.theme.primaryColor,"--stepper-secondary-color":this.theme.secondaryColor,"--stepper-success-color":this.theme.successColor,"--stepper-error-color":this.theme.errorColor,"--stepper-warning-color":this.theme.warningColor,"--stepper-info-color":this.theme.infoColor,"--stepper-text-color":this.theme.textColor,"--stepper-background-color":this.theme.backgroundColor,"--stepper-border-color":this.theme.borderColor,"--stepper-font-size":this.theme.fontSize,"--stepper-font-family":this.theme.fontFamily}:{};if(this.iconLineWidth&&(r["--icon-line-width"]=this.iconLineWidth),this.iconLineHeight&&(r["--icon-line-height"]=this.iconLineHeight),void 0!==this.iconLineFlex&&(r["--icon-line-flex"]=""+this.iconLineFlex),"snack"===this.variant&&"horizontal"===this.orientation)return this.renderSnakeLayout(t,r);const p=this.getProgress();return s("div",{class:t,style:r,role:"tablist","aria-orientation":this.orientation,"aria-label":"Step navigation",tabindex:this.keyboardNavigation?0:-1,onKeyDown:this.handleKeyDown},this.showProgress&&s("div",{class:"stepper-progress-bar",role:"progressbar","aria-valuenow":p,"aria-valuemin":0,"aria-valuemax":100},s("div",{class:"progress-fill",style:{width:p+"%"}}),s("span",{class:"progress-text","aria-live":"polite"},p,"% Complete (",this.activeStep+1,"/",this.normalizedSteps.length,")")),this.scrollable&&"horizontal"===this.orientation&&s("div",{class:"scroll-indicator scroll-indicator--left"}),s("div",{class:"steps-wrapper",role:"list",style:{display:"flex",flexDirection:"horizontal"===this.orientation?"row":"column",width:"100%"}},this.normalizedSteps.map(((t,r)=>{const p=r===this.normalizedSteps.length-1,i="non-linear"===this.flow||r<=this.activeStep,a="completed"===t.status||"success"===t.status?"completed":"failed"===t.status?"failed":"active"===t.status?"active":"pending",o=[...this.getStepClasses(t,r).split(" "),i?"stepper-step-clickable":"",this.validationErrors.has(t.id+"")?"stepper-step-error":""].filter(Boolean).join(" ");return s("div",{key:t.id,class:o,style:{position:"relative"},role:"tab","aria-selected":r===this.activeStep,"aria-controls":"step-panel-"+t.id,"aria-disabled":!i,tabindex:i?0:-1,onClick:()=>this.handleStepClick(r),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.handleStepClick(r))}},s("div",{class:"stepper-step-wrapper"},s("div",{class:"stepper-step-indicator",style:{position:"relative"},"aria-label":`Step ${r+1}: ${t.label} - ${t.status}`},void 0===t.percent||"active"!==t.status||this.progressDot?this.progressDot?s("span",{class:"stepper-dot-inner","aria-hidden":"true"}):this.renderStepIcon(t,r):this.renderProgressCircle(t.percent)),"vertical"===this.orientation&&!p&&s("span",{class:`stepper-connector stepper-connector-${this.orientation} stepper-connector-${a}`,"aria-hidden":"true"}),"horizontal"===this.orientation?s("div",{class:"stepper-step-content stepper-step-content-horizontal"},s("div",{class:"stepper-step-title"},s("div",{class:"stepper-step-label"},t.node&&t.node.renderContent?t.node.renderContent():t.label),!p&&"top"!==e&&"bottom"!==e&&s("span",{class:"stepper-connector stepper-connector-horizontal stepper-connector-"+a,"aria-hidden":"true"})),this.showDescriptions&&t.description&&s("div",{class:"stepper-step-description"},t.description),s("div",{class:"stepper-content-slot"},s("slot",{name:"content-"+t.id})),this.validationErrors.has(t.id+"")&&s("div",{class:"stepper-step-error-message",role:"alert"},this.validationErrors.get(t.id+""))):s("div",{class:"stepper-step-content"},s("div",{class:{"stepper-step-label":!0,"stepper-label-active":r===this.activeStep}},t.label),this.showDescriptions&&t.description&&s("div",{class:"stepper-step-description"},t.description),s("div",{class:{"stepper-content-slot":!0,"stepper-content-active":r===this.activeStep,"stepper-content-panel":"panel"===this.variant}},s("slot",{name:"content-"+t.id})),this.validationErrors.has(t.id+"")&&s("div",{class:"stepper-step-error-message",role:"alert"},this.validationErrors.get(t.id+"")),t.children&&t.children.length>0&&s("div",{class:"stepper-sub-steps"},t.children.map(((e,t)=>s("div",{class:"stepper-sub-step stepper-sub-step-"+(e.status||"pending"),key:e.id||t},s("span",{class:"sub-step-dot"}),s("span",{class:"sub-step-label"},e.label)))))),"horizontal"===this.orientation&&!p&&("top"===e||"bottom"===e)&&s("span",{class:"stepper-connector stepper-connector-horizontal stepper-connector-"+a,"aria-hidden":"true"})))}))),this.scrollable&&"horizontal"===this.orientation&&s("div",{class:"scroll-indicator scroll-indicator--right"}),this.showControls?s("div",{class:"stepper-controls",role:"group","aria-label":"Step controls"},s("ui-button",{variant:"secondary",size:"sm"===this.size?"sm":"md",onClick:this.onPrevClick,disabled:this.activeStep<=0,ariaLabel:this.labelPrev,label:this.labelPrev}),s("ui-button",{variant:"primary",size:"sm"===this.size?"sm":"md",onClick:this.onNextClick,disabled:this.activeStep>=this.normalizedSteps.length-1,ariaLabel:this.labelNext,label:this.labelNext}),s("ui-button",{variant:"success",size:"sm"===this.size?"sm":"md",onClick:this.onFinishClick,ariaLabel:this.labelFinish,label:this.labelFinish}),s("ui-button",{variant:"danger",size:"sm"===this.size?"sm":"md",onClick:this.onFailClick,ariaLabel:this.labelFail,label:this.labelFail})):null)}static get watchers(){return{activeStep:[{handleActiveStepChange:0}],steps:[{stepsChanged:0}]}}static get style(){return'.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}.a11y-sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}:host{display:block;width:100%}.stepper-container{display:flex;width:100%;font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;box-sizing:border-box}.stepper-horizontal{flex-direction:row}.stepper-vertical{flex-direction:column}.stepper-step{position:relative;display:flex;flex:1;vertical-align:top}.stepper-horizontal .stepper-step{margin-right:16px}.stepper-horizontal .stepper-step:last-child{margin-right:0}.stepper-vertical .stepper-step{flex-direction:column;flex:none;min-height:64px}.stepper-step-wrapper{display:flex;align-items:flex-start;width:100%}.stepper-label-right .stepper-step-wrapper{flex-direction:row}.stepper-label-left .stepper-step-wrapper{flex-direction:row-reverse}.stepper-label-left .stepper-step-indicator{margin-right:0;margin-left:8px}.stepper-horizontal.stepper-label-top .stepper-step-wrapper{flex-direction:column-reverse;align-items:center;text-align:center}.stepper-horizontal.stepper-label-top .stepper-step-indicator{margin-right:0;margin-top:8px}.stepper-horizontal.stepper-label-bottom .stepper-step-wrapper,.stepper-horizontal.stepper-label-vertical .stepper-step-wrapper{flex-direction:column;align-items:center;text-align:center}.stepper-horizontal.stepper-label-bottom .stepper-step-indicator,.stepper-horizontal.stepper-label-vertical .stepper-step-indicator{margin-right:0;margin-bottom:8px}.stepper-horizontal.stepper-label-top .stepper-step-title,.stepper-horizontal.stepper-label-bottom .stepper-step-title{display:block;width:100%}.stepper-horizontal.stepper-label-top .stepper-step-title .stepper-connector,.stepper-horizontal.stepper-label-bottom .stepper-step-title .stepper-connector{display:none}.stepper-horizontal.stepper-label-top .stepper-step-content,.stepper-horizontal.stepper-label-bottom .stepper-step-content{display:flex;flex-direction:column;align-items:center;width:100%}.stepper-label-top .stepper-step-label,.stepper-label-bottom .stepper-step-label{text-align:center;padding-right:0}.stepper-vertical.stepper-label-top .stepper-step-wrapper,.stepper-vertical.stepper-label-bottom .stepper-step-wrapper{flex-direction:row;align-items:flex-start;text-align:left}.stepper-vertical.stepper-label-top .stepper-step-indicator,.stepper-vertical.stepper-label-bottom .stepper-step-indicator{margin-right:8px;margin-top:0;margin-bottom:0}.stepper-vertical.stepper-label-top .stepper-step-content,.stepper-vertical.stepper-label-bottom .stepper-step-content{align-items:flex-start;text-align:left}.stepper-vertical.stepper-label-top .stepper-step-wrapper{align-items:flex-end;align-items:flex-start}.stepper-vertical.stepper-label-bottom .stepper-step-wrapper{align-items:flex-start}.stepper-step-indicator{display:flex;align-items:center;justify-content:center;width:32px;height:32px;margin-right:8px;background-color:var(--bg-primary, var(--text-standard, #ffffff));border:1px solid rgba(0, 0, 0, 0.25);border-radius:50%;transition:all 0.3s;flex-shrink:0;color:rgba(0, 0, 0, 0.25);font-size:14px;z-index:2}.stepper-shape-square .stepper-step-indicator{border-radius:4px !important}.stepper-shape-square-active .stepper-step-active .stepper-step-indicator{border-radius:4px !important;background-color:var(--bg-primary, #f6ffed) !important;border:1px solid var(--color-success, #b7eb8f) !important;padding:4px;width:38px !important;height:38px !important;position:relative;display:flex !important;align-items:center;justify-content:center;z-index:10}.stepper-shape-square-active .stepper-step-active .stepper-step-indicator::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:24px;height:24px;background-color:var(--color-primary, #1677ff);border-radius:50%;z-index:-1}.stepper-shape-square-active .stepper-step-active .stepper-step-indicator .stepper-step-icon,.stepper-shape-square-active .stepper-step-active .stepper-step-indicator .stepper-step-number,.stepper-shape-square-active .stepper-step-active .stepper-step-indicator ui-icon{color:var(--text-standard, #ffffff) !important;font-size:14px;--icon-color:var(--text-standard, #ffffff)}.stepper--primary{--stepper-color:var(--color-primary, #1677ff);--stepper-color-hover:var(--color-primary, #4096ff);--stepper-success:var(--color-success, #52c41a);--stepper-error:var(--color-danger, #ff4d4f);--stepper-warning:var(--color-danger, #faad14)}.stepper--success{--stepper-color:var(--color-success, #52c41a);--stepper-color-hover:var(--color-success, #73d13d)}.stepper--warning{--stepper-color:var(--color-danger, #faad14);--stepper-color-hover:var(--color-danger, #ffc53d)}.stepper--danger{--stepper-color:var(--color-danger, #ff4d4f);--stepper-color-hover:var(--color-danger, #ff7875)}.stepper-label-vertical .stepper-step-indicator{margin-right:0;margin-bottom:8px}.stepper-step-active .stepper-step-indicator{background-color:var(--stepper-color, #1677ff);border-color:var(--stepper-color, #1677ff);color:var(--text-standard, #ffffff)}.stepper-step-active .stepper-step-label{color:var(--stepper-color, #1677ff);font-weight:600}.stepper-shape-square-active .stepper-step-active .stepper-step-label{color:var(--color-success, #52c41a) !important;font-weight:700}.stepper-step-completed .stepper-step-indicator,.stepper-step-success .stepper-step-indicator{background-color:var(--bg-primary, var(--text-standard, #ffffff));border-color:var(--color-success, #52c41a);color:var(--color-success, #52c41a)}.stepper-step-completed .stepper-step-label,.stepper-step-success .stepper-step-label{color:rgba(0, 0, 0, 0.45)}.stepper-step-failed .stepper-step-indicator,.stepper-step-error .stepper-step-indicator{background-color:var(--bg-primary, var(--text-standard, #ffffff));border-color:var(--color-danger, #ff4d4f);color:var(--color-danger, #ff4d4f)}.stepper-step-failed .stepper-step-label,.stepper-step-error .stepper-step-label{color:var(--color-danger, #ff4d4f)}.stepper-step-pending .stepper-step-indicator,.stepper-step-waiting .stepper-step-indicator{background-color:var(--bg-primary, var(--text-standard, #ffffff));border-color:rgba(0, 0, 0, 0.25);color:rgba(0, 0, 0, 0.25)}.stepper-step-info .stepper-step-indicator{background-color:var(--bg-primary, var(--text-standard, #ffffff));border-color:var(--color-primary, #1677ff);color:var(--color-primary, #1677ff)}.stepper-step-info .stepper-step-label{color:rgba(0, 0, 0, 0.45)}.stepper-step-warning .stepper-step-indicator{background-color:var(--bg-primary, var(--text-standard, #ffffff));border-color:var(--color-danger, #faad14);color:var(--color-danger, #faad14)}.stepper-step-warning .stepper-step-label{color:rgba(0, 0, 0, 0.45)}.stepper-step-disabled .stepper-step-indicator{background-color:var(--bg-primary, #f5f5f5);border-color:var(--border-default, #d9d9d9);color:rgba(0, 0, 0, 0.25);cursor:not-allowed}.stepper-step-disabled .stepper-step-label{color:rgba(0, 0, 0, 0.25);cursor:not-allowed}.stepper-step-icon{font-style:normal;line-height:0;text-align:center;text-transform:none;vertical-align:-0.125em;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}.stepper-progress-circle{position:absolute;top:-1px;left:-1px;width:34px;height:34px;transform:rotate(-90deg)}.stepper-progress-bg{fill:none;stroke:rgba(0, 0, 0, 0.06);stroke-width:2px}.stepper-progress-value{fill:none;stroke:var(--color-primary, #1677ff);stroke-width:2.5px;stroke-linecap:round;transition:stroke-dashoffset 0.3s ease}.stepper-sm .stepper-progress-circle{width:26px;height:26px}.stepper-step-image-icon{width:20px;height:20px;border-radius:50%;object-fit:cover}.stepper-step-custom-icon{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.stepper-step-custom-icon svg{width:16px;height:16px}.stepper-step-content{display:flex;flex-direction:column;flex:1;min-height:32px;justify-content:center}.stepper-step-label{position:relative;display:inline-block;padding-right:16px;color:rgba(0, 0, 0, 0.45);font-size:14px;line-height:32px;white-space:nowrap}.stepper-vertical .stepper-step-label{line-height:32px}.stepper-step-description{color:rgba(0, 0, 0, 0.45);font-size:14px;line-height:1.5;white-space:normal}.stepper-step-title{display:flex;align-items:center;position:relative}.stepper-connector{position:absolute;background-color:rgba(0, 0, 0, 0.06);transition:background-color 0.3s}.stepper-horizontal .stepper-connector{position:relative;flex:1;height:1px;margin:0 8px;background-color:rgba(0, 0, 0, 0.06);opacity:1;visibility:visible}.stepper-horizontal.stepper-label-bottom .stepper-connector{position:absolute;top:16px;left:50%;width:calc(100% + 16px);margin:0}.stepper-horizontal.stepper-label-top .stepper-connector{position:absolute;top:auto;bottom:16px;left:50%;width:calc(100% + 16px);margin:0}.stepper-horizontal.stepper-label-top .stepper-step,.stepper-horizontal.stepper-label-bottom .stepper-step{position:relative}.stepper-vertical .stepper-connector{top:36px;left:16px;width:1px;height:calc(100% - 40px);flex:var(--icon-line-flex, none)}.stepper-step-completed .stepper-connector,.stepper-step-success .stepper-connector,.stepper-shape-square-active .stepper-step-active .stepper-connector,.stepper-shape-square-active .stepper-connector-active{background-color:var(--color-success, #52c41a) !important;height:2px}.stepper-dot .stepper-step-indicator{width:8px;height:8px;margin-right:8px;margin-left:0;border:none;background-color:rgba(0, 0, 0, 0.25)}.stepper-dot .stepper-dot-inner{display:none}.stepper-dot .stepper-step-active .stepper-step-indicator{width:10px;height:10px;background-color:var(--color-primary, #1677ff)}.stepper-dot.stepper-horizontal .stepper-connector{position:absolute;top:4px;left:16px;width:calc(100% - 24px);margin:0}.stepper-dot.stepper-horizontal.stepper-label-bottom .stepper-connector{top:4px;left:50%;width:calc(100% + 16px);margin:0}.stepper-dot.stepper-horizontal.stepper-label-top .stepper-connector{top:auto;bottom:4px;left:50%;width:calc(100% + 16px);margin:0}.stepper-dot.stepper-vertical .stepper-connector{left:4px;top:10px}.stepper-dot .stepper-step-wrapper{align-items:center}.stepper-dot .stepper-step-content{min-height:auto}.stepper-sm .stepper-step-indicator{width:24px;height:24px;font-size:12px}.stepper-sm .stepper-step-label{font-size:14px;line-height:24px}.stepper-sm.stepper-horizontal .stepper-connector{top:12px}.stepper-lg .stepper-step-indicator{width:40px;height:40px;font-size:18px}.stepper-lg .stepper-step-label{font-size:16px;line-height:40px}.stepper-variant-inline{display:inline-flex;gap:0;border:1px solid var(--border-default, #d9d9d9);border-radius:6px;padding:0;background:var(--bg-primary, #ffffff);overflow:hidden}.stepper-variant-inline .stepper-step{padding:10px 20px;margin:0;border-right:1px solid var(--border-default, #d9d9d9);background:var(--bg-primary, #fafafa);transition:all 0.3s;position:relative}.stepper-variant-inline .stepper-step:last-child{border-right:none}.stepper-variant-inline .stepper-step:hover{background:var(--bg-primary, #f0f0f0)}.stepper-variant-inline .stepper-step-active{background:var(--color-primary, #1677ff);color:var(--text-standard, #ffffff)}.stepper-variant-inline .stepper-step-active .stepper-step-label{color:var(--text-standard, #ffffff);font-weight:600}.stepper-variant-inline .stepper-step-completed{background:var(--bg-primary, #f6ffed)}.stepper-variant-inline .stepper-connector{display:none}.stepper-variant-inline .stepper-step-indicator{width:18px;height:18px;font-size:11px}.stepper-variant-inline .stepper-step-wrapper{align-items:center}.stepper-variant-inline .stepper-step-content{min-height:auto}.stepper-variant-inline .stepper-step-label{line-height:18px;font-size:13px}.stepper-sub-steps{margin-top:8px;padding-left:12px;display:flex;flex-direction:column;gap:4px}.stepper-sub-step{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(0, 0, 0, 0.45)}.sub-step-dot{width:6px;height:6px;border-radius:50%;background-color:rgba(0, 0, 0, 0.25)}.stepper-sub-step-active .sub-step-label{color:var(--color-primary, #1677ff);font-weight:500}.stepper-sub-step-active .sub-step-dot{background-color:var(--color-primary, #1677ff)}.stepper-sub-step-completed .sub-step-dot{background-color:var(--color-success, #52c41a)}.stepper-controls{display:flex;gap:8px;margin-top:24px;justify-content:flex-end}.stepper-btn{padding:4px 15px;border-radius:6px;border:1px solid var(--border-default, #d9d9d9);background:var(--bg-primary, #ffffff);cursor:pointer;transition:all 0.2s}.stepper-btn:hover{color:var(--color-primary, #4096ff);border-color:var(--color-primary, #4096ff)}.stepper-btn.prev:hover{color:var(--color-primary, #4096ff);border-color:var(--color-primary, #4096ff)}.stepper-btn:disabled{color:rgba(0, 0, 0, 0.25);background-color:var(--bg-primary, #f5f5f5);border-color:var(--border-default, #d9d9d9);cursor:not-allowed}.stepper-step-clickable{cursor:pointer}.stepper-step-clickable:hover .stepper-step-indicator{border-color:var(--color-primary, #1677ff);color:var(--color-primary, #1677ff)}.stepper-step-clickable:hover .stepper-step-label{color:var(--color-primary, #1677ff)}.stepper-step-error-message{color:var(--color-danger, #ff4d4f);font-size:12px;margin-top:4px}.stepper-variant-navigation{border-bottom:1px solid rgba(0, 0, 0, 0.06);padding-bottom:8px}.stepper-variant-navigation .stepper-step{padding:8px 16px;margin:0;transition:background-color 0.3s}.stepper-variant-navigation .stepper-step::after{content:"";position:absolute;bottom:-8px;left:0;width:100%;height:2px;background-color:transparent;transition:all 0.3s}.stepper-variant-navigation .stepper-step-active::after{background-color:var(--color-primary, #1677ff)}.stepper-variant-navigation .stepper-step:hover{background-color:rgba(0, 0, 0, 0.02)}.stepper-variant-navigation .stepper-connector{display:none}.stepper-variant-panel{gap:0;background:transparent;padding:0;position:relative}.stepper-variant-panel .stepper-step{background:var(--bg-primary, #ffffff);border-radius:8px;padding:20px 24px;border:2px solid var(--border-subtle, #e8e8e8);transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);margin:0;margin-right:24px;flex:1;box-shadow:0 1px 2px rgba(0, 0, 0, 0.04);position:relative}.stepper-variant-panel .stepper-step:last-child{margin-right:0}.stepper-variant-panel .stepper-step::after{content:"";position:absolute;right:-14px;top:50%;transform:translateY(-50%);width:0;height:0;border-top:14px solid transparent;border-bottom:14px solid transparent;border-left:14px solid var(--border-subtle, #ffffff);z-index:2}.stepper-variant-panel .stepper-step::before{content:"";position:absolute;right:-16px;top:50%;transform:translateY(-50%);width:0;height:0;border-top:16px solid transparent;border-bottom:16px solid transparent;border-left:16px solid var(--border-subtle, #e8e8e8);z-index:1}.stepper-variant-panel .stepper-step:last-child::after,.stepper-variant-panel .stepper-step:last-child::before{display:none}.stepper-variant-panel .stepper-step:hover{border-color:var(--border-default, #d9d9d9);box-shadow:0 2px 4px rgba(0, 0, 0, 0.08)}.stepper-variant-panel .stepper-step-active{background:linear-gradient(135deg, var(--bg-primary, #e6f4ff) 0%, var(--bg-primary, #f0f8ff) 100%);border-color:var(--color-primary, #1677ff);box-shadow:0 4px 12px rgba(22, 119, 255, 0.15);transform:scale(1.02)}.stepper-variant-panel .stepper-step-active::after{border-left-color:var(--border-subtle, #f0f8ff)}.stepper-variant-panel .stepper-step-active::before{border-left-color:var(--color-primary, #1677ff)}.stepper-variant-panel .stepper-step-active .stepper-step-indicator{background:linear-gradient(135deg, var(--color-primary, #1677ff) 0%, var(--color-primary, #4096ff) 100%);box-shadow:0 2px 8px rgba(22, 119, 255, 0.3)}.stepper-variant-panel .stepper-step-completed{background:var(--bg-primary, #f6ffed);border-color:var(--color-success, #b7eb8f)}.stepper-variant-panel .stepper-step-completed::after{border-left-color:var(--border-subtle, #f6ffed)}.stepper-variant-panel .stepper-step-completed::before{border-left-color:var(--color-success, #b7eb8f)}.stepper-variant-panel .stepper-step-completed .stepper-step-indicator{background:linear-gradient(135deg, var(--color-success, #52c41a) 0%, var(--color-success, #73d13d) 100%)}.stepper-variant-panel .stepper-step-label{font-weight:600;color:rgba(0, 0, 0, 0.85)}.stepper-variant-panel .stepper-step-active .stepper-step-label{color:var(--color-primary, #1677ff)}.stepper-variant-panel .stepper-connector{display:none}@media (max-width: 768px){.stepper-responsive.stepper-horizontal{flex-direction:column}.stepper-responsive.stepper-horizontal .stepper-step{margin-right:0;margin-bottom:16px}}.stepper-content-slot{display:none;margin-top:12px;width:100%}.stepper-step-active .stepper-content-slot{display:block}.stepper-vertical .stepper-content-slot{padding-left:0}.stepper-progress-bar{position:relative;width:100%;height:8px;background:var(--bg-primary, #e5e7eb);border-radius:4px;margin-bottom:24px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg, var(--color-success, #3dcd58), var(--color-success, #22c55e));border-radius:4px;transition:width 0.4s ease;position:relative}.progress-text{position:absolute;top:12px;right:0;font-size:0.75rem;font-weight:600;color:var(--text-muted, #6b7280)}.step-optional-badge{font-size:10px;background-color:var(--bg-primary, #f5f5f5);color:var(--text-secondary, #595959);padding:2px 6px;border-radius:10px;margin-left:8px;margin-top:4px;display:inline-block;vertical-align:middle}.scroll-indicator{position:absolute;top:0;bottom:0;width:24px;pointer-events:none;z-index:10}.scroll-indicator--left{left:0;background:linear-gradient(to right, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%)}.scroll-indicator--right{right:0;background:linear-gradient(to left, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%)}.stepper--snake-layout .snake-container{display:flex;flex-direction:column;gap:0;width:100%}.stepper--snake-layout .snake-row{display:flex;align-items:center;justify-content:space-between;padding:16px 0;position:relative;width:100%}.stepper--snake-layout .snake-row--odd{flex-direction:row-reverse}.stepper--snake-layout .stepper-item{position:relative;padding:0;flex:0 0 10%;max-width:10%;display:flex;justify-content:center;z-index:2;box-sizing:border-box}.stepper--snake-layout .step-icon-wrapper{width:32px;height:32px;background:var(--bg-primary, #e5e7eb);border-radius:50%;transition:all 0.2s;font-size:0.75rem;font-weight:700;color:var(--text-muted, #6b7280);display:flex;align-items:center;justify-content:center;z-index:2;position:relative;background-color:var(--bg-primary, var(--text-standard, #ffffff))}.stepper--snake-layout .stepper-item--active .step-icon-wrapper{width:36px;height:36px;background:var(--color-primary, #1677ff);color:var(--text-standard, #ffffff);transform:scale(1.1);box-shadow:0 4px 10px rgba(0, 0, 0, 0.15)}.stepper--snake-layout .stepper-item--completed .step-icon-wrapper{background:var(--color-success, #52c41a);color:var(--text-standard, #ffffff)}.stepper--snake-layout .stepper-item.has-connector::after{content:"";position:absolute;top:50%;height:2px;background:var(--bg-primary, #e5e7eb);z-index:-1;width:100%;left:50%;transform:translateY(-50%)}.stepper--snake-layout .snake-row--odd .stepper-item.has-connector::after{left:auto;right:50%}.stepper--snake-layout .stepper-item--completed.has-connector::after{background:var(--color-success, #52c41a)}.stepper--snake-layout .snake-connector-turn{position:absolute;top:50%;left:50%;transform:translateX(-50%);width:2px;height:64px;background:var(--bg-primary, #e5e7eb);z-index:-2}.stepper--snake-layout .stepper-item--completed.has-row-connector .snake-connector-turn{background:var(--color-success, #52c41a)}'}},[769,"ui-stepper",{steps:[1],orientation:[1],size:[1],activeStep:[2,"active-step"],showNumbers:[4,"show-numbers"],showDescriptions:[4,"show-descriptions"],showControls:[4,"show-controls"],labelPrev:[1,"label-prev"],labelNext:[1,"label-next"],labelFinish:[1,"label-finish"],labelFail:[1,"label-fail"],customIcons:[16],flow:[1],shadow:[4],theme:[16],keyboardNavigation:[4,"keyboard-navigation"],responsive:[4],maxVisibleSteps:[2,"max-visible-steps"],progressDot:[4,"progress-dot"],iconLibrary:[1,"icon-library"],labelPlacement:[1,"label-placement"],labelPosition:[1,"label-position"],variant:[1],colorScheme:[1,"color-scheme"],animated:[4],showProgress:[4,"show-progress"],validateBeforeNext:[16],mobileBreakpoint:[2,"mobile-breakpoint"],allowStepClick:[4,"allow-step-click"],showTooltips:[4,"show-tooltips"],compact:[4],stepsPerPage:[2,"steps-per-page"],scrollable:[4],clickable:[4],iconLineWidth:[1,"icon-line-width"],iconLineHeight:[1,"icon-line-height"],iconLineFlex:[2,"icon-line-flex"],stepShape:[1,"step-shape"],normalizedSteps:[32],validationErrors:[32],isMobile:[32],isLoading:[32],next:[64],prev:[64],goTo:[64],complete:[64],fail:[64],getCurrentStep:[64],getSteps:[64],validateCurrentStep:[64]},void 0,{activeStep:[{handleActiveStepChange:0}],steps:[{stepsChanged:0}]}]),d=c,h=function(){"undefined"!=typeof customElements&&["ui-stepper","ui-badge","ui-button","ui-icon","ui-loader"].forEach((e=>{switch(e){case"ui-stepper":customElements.get(p(e))||customElements.define(p(e),c);break;case"ui-badge":customElements.get(p(e))||n();break;case"ui-button":customElements.get(p(e))||o();break;case"ui-icon":customElements.get(p(e))||a();break;case"ui-loader":customElements.get(p(e))||l()}}))};export{d as UiStepper,h as defineCustomElement}