npm - atomicuilibrary - Versions diffs - 0.1.0 → 0.1.3 - Mend

atomicuilibrary 0.1.0 → 0.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (618) hide show

package/dist/components/ui-timeline.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{proxyCustomElement as e,HTMLElement as i,createEvent as t,h as n,Host as l,transformTag as m}from"@stencil/core/internal/client";import{s as a,d as r}from"./icon.js";import{d as o,a as d}from"./badge.js";import{d as s}from"./input.js";import{d as c}from"./loader.js";const p=e(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.itemVisible=t(this,"itemVisible",7),this.itemClick=t(this,"itemClick",7)}events=[];normalizedEvents=[];flow="linear";mode="vertical";align="left";theme;multiline=!1;columns=4;variant="default";marker="dot";clickable=!1;reverse=!1;pending=!1;searchable=!1;lineColor="#3bf673";lineWidth=2;dotSize=12;dotColor="#3bf673";showLine=!0;showDots=!0;animateOnScroll=!1;compact=!1;wrap=!1;showDates=!0;dateFormat="short";iconPosition="center";activeItemId;visibleItems=new Set;searchQuery="";itemVisible;itemClick;get el(){return this}normalizeEvents(e){if("string"==typeof e)try{this.normalizedEvents=JSON.parse(e)}catch{this.normalizedEvents=[]}else this.normalizedEvents=e\|\|[]}isRtl=!1;isMobile=!1;observer;componentWillLoad(){this.normalizeEvents(this.events)}componentDidLoad(){this.animateOnScroll&&this.setupIntersectionObserver(),this.checkMobile(),this.checkRtl(),window.addEventListener("resize",this.handleResize)}disconnectedCallback(){this.observer&&this.observer.disconnect(),window.removeEventListener("resize",this.handleResize)}handleResize=()=>{this.checkMobile()};checkMobile(){this.isMobile=window.innerWidth<=768}checkRtl(){this.isRtl="rtl"===getComputedStyle(this.el).direction\|\|null!==this.el.closest('[dir="rtl"]')\|\|"rtl"===document.documentElement.dir}setupIntersectionObserver(){void 0!==globalThis.IntersectionObserver&&(this.observer=new IntersectionObserver((e=>{e.forEach((e=>{if(e.isIntersecting){const i=e.target.getAttribute("data-item-id"),t=e.target.getAttribute("data-item-index");if(i\|\|t){this.visibleItems=new Set([...this.visibleItems,i\|\|t]);const e=parseInt(t\|\|"0",10),n=this.normalizedEvents[e];n&&this.itemVisible.emit({item:n,index:e})}}}))}),{threshold:.2}))}getProcessedEvents(){let e=[...this.normalizedEvents];if(this.searchable&&this.searchQuery){const i=this.searchQuery.toLowerCase();e=e.filter((e=>e.label.toLowerCase().includes(i)\|\|e.description&&e.description.toLowerCase().includes(i)\|\|e.opposite&&"string"==typeof e.opposite&&e.opposite.toLowerCase().includes(i)\|\|e.customContent&&e.customContent.toLowerCase().includes(i)))}return this.reverse&&e.reverse(),e}handleSearch=e=>{this.searchQuery=e.detail};handleItemClick=e=>{this.clickable&&this.itemClick.emit(e)};render(){const e=this.getProcessedEvents(),i=this.isMobile&&this.compact?"vertical":this.mode,t=["timeline-container","timeline-"+i,"timeline-align-"+this.align,(this.multiline\|\|this.wrap)&&"timeline-multiline","timeline-variant-"+this.variant,"timeline-marker-"+this.marker,this.clickable&&"timeline-clickable",this.animateOnScroll&&"timeline-animated",this.compact&&"timeline-compact","timeline-icon-"+this.iconPosition].filter(Boolean).join(" "),m={...this.theme,"--timeline-line-color":this.lineColor,"--timeline-line-width":this.lineWidth+"px","--timeline-dot-size":this.dotSize+"px","--timeline-dot-color":this.dotColor},a="horizontal"===i&&(this.multiline\|\|this.wrap)?this.renderMultiline(t,e,m):n("div",{class:t,style:m},e.map(((e,i)=>this.renderEventItem(e,i))),this.pending&&this.renderPendingItem(e.length));return n(l,{key:"895dad278ac5ef9373c0053fe80f39d4c0850ba0"},n("div",{key:"83841752c240e330781abd770ba5079305d18ced",class:"timeline-wrapper"},this.searchable&&n("div",{key:"068ab74adbeb338f0ae91bb6f2d69ae91c426d2d",class:"timeline-search-header"},n("ui-input",{key:"8c1e6d69c5f10e25e6abdab5eedd84a93727729b",type:"text",class:"timeline-search-input",placeholder:"Search events...",onInputChange:this.handleSearch,value:this.searchQuery,size:"sm",fullWidth:!0})),a))}renderMultiline(e,i,t){const l=this.columns>0?this.columns:4,m=[];for(let e=0;e<i.length;e+=l)m.push(i.slice(e,e+l));return n("div",{class:`${e} ${this.wrap?"timeline-snake-container":""}`,style:t},m.map(((e,i)=>n("div",{class:{"timeline-row":!0,"timeline-row-even":i%2==0,"timeline-row-odd":i%2!=0}},e.map(((t,n)=>this.renderEventItem(t,ithis.columns+n,!0,n===e.length-1)))))),this.pending&&this.renderPendingItem(i.length,!0))}renderPendingItem(e,i=!1){const t=this.isRtl?e%2!=0:e%2==0,l="alternate"===this.align?t?"left":"right":this.align,m="alternate"===this.align?t?"top":"bottom":"top"===this.align?"top":"bottom";return n("div",{class:{"timeline-item":!0,"timeline-item-pending":!0,["side-"+l]:"vertical"===this.mode,["side-"+m]:"horizontal"===this.mode,"is-multiline":i}},n("div",{class:"timeline-item-line"}),n("div",{class:"timeline-item-dot"},n("span",{class:"dot-inner"})),n("div",{class:"timeline-item-details"},n("div",{class:"timeline-item-content"},n("div",{class:"timeline-item-title"},"Pending..."))))}renderEventItem(e,i,t=!1,l=!1){const m="alternate"===this.align,r=this.isRtl?i%2!=0:i%2==0,o=m?r?"left":"right":this.align,d=m?r?"top":"bottom":"top"===this.align?"top":"bottom";let s;const c={};e.dotColor&&(c.borderColor=e.dotColor),e.iconBackground&&(c.backgroundColor=e.iconBackground);const p={};e.iconColor&&(p.color=e.iconColor),s=e.image?n("img",{src:e.image,alt:e.label,class:"timeline-item-image",width:"24",height:"24"}):e.icon\|\|"icon"===this.marker?n("span",{class:"timeline-item-icon",style:p},e.icon&&e.icon.includes("<svg")?n("span",{innerHTML:a(e.icon)}):n("ui-icon",{name:e.icon\|\|"default-icon",library:"fontawesome"})):"number"===this.marker?n("span",{class:"timeline-item-number"},i+1):n("span",{class:"dot-inner"});const g=this.visibleItems.has(e.id\|\|""+i);return n("div",{"data-item-id":e.id\|\|""+i,"data-item-index":i,ref:e=>{e&&this.animateOnScroll&&this.observer&&this.observer.observe(e)},class:["timeline-item","timeline-item-"+(e.status\|\|"default"),i%2==0?"timeline-item-even":"timeline-item-odd","side-"+o,"side-"+d,t&&l&&"is-last-in-row",!!e.image&&"has-image",!!e.icon&&"has-icon","number"===this.marker&&!e.image&&!e.icon&&"has-number",this.clickable&&"timeline-item-clickable",("active"===e.status\|\|"pending"===e.status)&&"is-active",this.animateOnScroll&&"timeline-item-animated",(g\|\|!this.animateOnScroll)&&"timeline-item-visible","center"===this.align&&"timeline-balanced-item",!!e.position&&"timeline-item-position-"+e.position].filter(Boolean).join(" "),onClick:()=>this.handleItemClick(e)},n("div",{class:"timeline-side timeline-side-left"},"left"===o&&e.opposite&&n("span",{class:"timeline-opposite-content"},e.opposite)),n("div",{class:"timeline-item-divider"},this.showLine&&n("div",{class:"timeline-item-line",style:{backgroundColor:e.lineColor\|\|this.lineColor}}),n("div",{class:"timeline-item-dot",style:c},s,e.badge&&n("span",{class:"timeline-badge"},e.badge))),n("div",{class:"timeline-item-details timeline-side timeline-side-right"},this.showDates&&(e.date\|\|e.time\|\|e.timestamp)&&n("div",{class:"timeline-item-time"},e.date&&n("span",{class:"timeline-date-text"},e.date," "),e.time&&n("span",{class:"timeline-time-text"},e.time),!e.date&&!e.time&&e.timestamp&&n("span",{class:"timeline-date-text"},e.timestamp)),n("div",{class:"timeline-item-content"},n("div",{class:"timeline-item-title"},e.label),e.description&&n("div",{class:"timeline-item-desc"},e.description),e.customContent&&n("div",{class:"timeline-custom-content",innerHTML:a(e.customContent)}))))}static get watchers(){return{events:[{normalizeEvents: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%}.timeline-container{display:flex;position:relative;font-family:inherit}.timeline-vertical{flex-direction:column;padding:20px 0}.timeline-vertical .timeline-item{display:flex;position:relative;padding-bottom:24px;align-items:center}.timeline-vertical .timeline-item-line{position:absolute;top:0;bottom:0;width:2px;background-color:var(--bg-primary, #e5e7eb)}.timeline-vertical .timeline-item:last-child .timeline-item-line{display:none}.timeline-vertical .timeline-item-dot{position:relative;z-index:10;width:12px;height:12px;background:var(--bg-primary, #ffffff);border:2px solid var(--color-primary, #10b981);border-radius:50%;flex-shrink:0;margin-top:0;}.timeline-vertical .timeline-item-content{flex:1}.timeline-align-left.timeline-vertical .timeline-item-line{left:5px}.timeline-icon-top .timeline-item{align-items:flex-start}.timeline-icon-center .timeline-item{align-items:center}.timeline-icon-bottom .timeline-item{align-items:flex-end}.timeline-align-left.timeline-vertical .timeline-item-dot{left:0;}.timeline-align-left.timeline-vertical .timeline-item-details{padding-left:48px;text-align:left;display:flex;flex-direction:column;align-items:flex-start}.timeline-align-right.timeline-vertical .timeline-item{flex-direction:row-reverse;}.timeline-align-right.timeline-vertical .timeline-item-line{left:auto;right:5px;}.timeline-align-right.timeline-vertical .timeline-item-dot{left:auto;right:0;top:4px}.timeline-align-right.timeline-vertical .timeline-item-details{padding-left:0;padding-right:48px;text-align:right;display:flex;flex-direction:column;align-items:flex-end;width:100%;}.timeline-align-alternate.timeline-vertical .timeline-item{width:100%}.timeline-align-alternate.timeline-vertical .timeline-item-line{left:50%;transform:translateX(-50%)}.timeline-align-alternate.timeline-vertical .timeline-item-dot{left:50%;transform:translateX(-50%);top:4px}.timeline-align-alternate.timeline-vertical .side-left .timeline-item-details{width:50%;padding-right:48px;padding-left:0;text-align:right;box-sizing:border-box;margin-left:0;}.timeline-align-alternate.timeline-vertical .side-right .timeline-item-details{width:50%;margin-left:50%;padding-left:48px;text-align:left;box-sizing:border-box}.timeline-horizontal{flex-direction:row;padding:80px 0;overflow-x:auto;min-height:250px;align-items:center}.timeline-horizontal .timeline-item{flex:1;min-width:200px;display:flex;flex-direction:column;position:relative;align-items:center;justify-content:center;height:100%;margin:auto}.timeline-horizontal .timeline-item-details{position:absolute;width:240px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;text-align:center;padding:12px;}.timeline-horizontal.timeline-multiline{flex-direction:column;flex-wrap:nowrap;gap:0;padding:40px 80px;display:flex;align-items:stretch;overflow:visible;}.timeline-row{display:flex;width:100%;justify-content:center;justify-content:flex-start;position:relative;padding:40px 0;}.timeline-row.timeline-row-odd{flex-direction:row-reverse}.timeline-horizontal.timeline-multiline .timeline-item{flex:1;margin:0;min-width:0}.timeline-horizontal.timeline-multiline .timeline-item-line{display:block;left:50%;right:-50%;top:50%;border-radius:0}.timeline-row.timeline-row-odd .timeline-item-line{left:-50%;right:50%;}.timeline-item.is-last-in-row .timeline-item-line{display:block;left:50%;right:0;width:auto;}.timeline-row-odd .timeline-item.is-last-in-row .timeline-item-line{left:0;right:50%}.timeline-row-even .timeline-item.is-last-in-row::after{content:"";position:absolute;right:-60px;width:60px;top:50%;height:250px;border-right:2px solid var(--border-default, #e5e7eb);border-top:2px solid var(--border-default, #e5e7eb);border-bottom:2px solid var(--border-default, #e5e7eb);border-top-right-radius:60px;border-bottom-right-radius:60px;border-top-left-radius:0;border-bottom-left-radius:0;z-index:0;left:auto;pointer-events:none;top:calc(50% - 1px)}.timeline-row-odd .timeline-item.is-last-in-row::after{content:"";position:absolute;left:-60px;right:auto;width:60px;top:calc(50% - 1px);height:250px;border-left:2px solid var(--border-default, #e5e7eb);border-top:2px solid var(--border-default, #e5e7eb);border-bottom:2px solid var(--border-default, #e5e7eb);border-top-left-radius:60px;border-bottom-left-radius:60px;border-top-right-radius:0;border-bottom-right-radius:0;z-index:0;transform:none;pointer-events:none}.timeline-row:last-child .timeline-item.is-last-in-row::after{display:none}.timeline-row .timeline-item{justify-content:flex-start;}.timeline-row .timeline-item-dot{margin-top:119px;}.timeline-row .timeline-item-line{top:125px;transform:translateY(-50%)}.timeline-row .timeline-item-details{top:125px;}.timeline-horizontal .timeline-item-content,.timeline-horizontal .timeline-item-time{position:static;width:auto;max-width:100%;transform:none;left:auto;text-align:center;padding:2px 0}.timeline-horizontal .timeline-item-line{position:absolute;left:50%;right:-50%;top:50%;transform:translateY(-50%);height:2px;background-color:var(--bg-primary, #e5e7eb)}.timeline-horizontal .timeline-item:last-child .timeline-item-line{display:none}.timeline-horizontal .timeline-item-dot{width:12px;height:12px;background:var(--bg-primary, #ffffff);border:2px solid var(--color-primary, #10b981);border-radius:50%;z-index:10;position:relative}.timeline-horizontal.timeline-align-top .timeline-item-details,.timeline-horizontal .side-top .timeline-item-details{bottom:50%;top:auto;margin-bottom:32px;flex-direction:column-reverse;}.timeline-horizontal.timeline-align-top .timeline-item-details .timeline-item-content,.timeline-horizontal .side-top .timeline-item-details .timeline-item-content{order:1;}.timeline-horizontal.timeline-align-top .timeline-item-details .timeline-item-time,.timeline-horizontal .side-top .timeline-item-details .timeline-item-time{order:2;}.timeline-horizontal.timeline-align-bottom .timeline-item-details,.timeline-horizontal.timeline-align-left .timeline-item-details,.timeline-horizontal .side-bottom .timeline-item-details{top:50%;bottom:auto;margin-top:32px;flex-direction:column;}.timeline-horizontal .timeline-item-details::before{content:"";position:absolute;left:50%;width:2px;background:var(--bg-primary, #e5e7eb);height:32px;transform:translateX(-50%)}.timeline-horizontal.timeline-align-top .timeline-item-details::before,.timeline-horizontal .side-top .timeline-item-details::before{bottom:-32px;}.timeline-horizontal.timeline-align-bottom .timeline-item-details::before,.timeline-horizontal.timeline-align-left .timeline-item-details::before,.timeline-horizontal .side-bottom .timeline-item-details::before{top:-32px;}.timeline-horizontal.timeline-align-alternate .timeline-item{height:100%}.timeline-horizontal.timeline-align-alternate .timeline-item-dot{margin:0}.timeline-item-success .timeline-item-dot{border-color:var(--color-success, #10b981)}.timeline-item-danger .timeline-item-dot{border-color:var(--color-danger, #ef4444)}.timeline-item-warning .timeline-item-dot{border-color:var(--color-warning, #f59e0b)}.timeline-item-active .timeline-item-dot{border-color:var(--color-primary, #10b981);background-color:var(--bg-primary, #eff6ff);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1)}.timeline-item-active .timeline-item-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--color-primary, #10b981);animation:timeline-pulse 2s infinite}.timeline-item-active .timeline-item-title{color:var(--color-primary, #10b981)}@keyframes timeline-pulse{0%{transform:scale(1);opacity:0.5}100%{transform:scale(2);opacity:0}}.timeline-item-dot{display:flex;align-items:center;justify-content:center;transition:all 0.2s ease}.timeline-item-icon{font-size:14px;display:inline-flex;align-items:center;justify-content:center;line-height:1;width:100%;height:100%}.timeline-item:has(.timeline-item-icon) .timeline-item-dot{width:24px;height:24px;background:var(--bg-primary, #f8fafc);display:flex !important;align-items:center;justify-content:center}.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{left:-6px;top:0}.timeline-align-alternate.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{left:50%;transform:translateX(-50%)}.timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{right:-6px;left:auto}.dot-inner{width:4px;height:4px;background:var(--color-primary, #10b981);border-radius:50%}.timeline-item-success .dot-inner{background:var(--color-success, #10b981)}.timeline-item-danger .dot-inner{background:var(--color-danger, #ef4444)}.timeline-item-warning .dot-inner{background:var(--color-warning, #f59e0b)}.timeline-item{transition:opacity 0.2s ease}.timeline-item:hover .timeline-item-dot{transform:scale(1.2)}.timeline-variant-panel .timeline-item-content{background:var(--bg-primary, #ffffff);border:1px solid var(--border-default, #e5e7eb);padding:16px;border-radius:8px;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);position:relative;transition:transform 0.2s, box-shadow 0.2s}.timeline-variant-panel .timeline-item-content::before{content:"";position:absolute;width:10px;height:10px;background:var(--bg-primary, #ffffff);border-left:1px solid var(--border-default, #e5e7eb);border-bottom:1px solid var(--border-default, #e5e7eb);transform:rotate(45deg);display:none;}.timeline-variant-panel .timeline-item:hover .timeline-item-content{box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);transform:translateY(-2px)}.timeline-item-number{color:var(--color-primary, #10b981);font-size:14px;font-weight:700;line-height:1}.timeline-marker-number .timeline-item-dot,.timeline-item:has(.timeline-item-number) .timeline-item-dot{width:32px;height:32px;background:var(--bg-primary, #ffffff);border:2px solid var(--color-primary, #10b981)}.timeline-item-active .timeline-item-number{color:var(--text-standard, #ffffff)}.timeline-item-active.timeline-marker-number .timeline-item-dot{background:var(--color-primary, #10b981)}.timeline-item-image{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}.timeline-item:has(.timeline-item-image) .timeline-item-dot{width:24px;height:24px;padding:0;overflow:hidden;border-radius:50%;position:relative;border:2px solid var(--color-primary, #10b981);border-color:var(--color-primary, #cbd5e1);box-shadow:none;background:var(--bg-primary, #ffffff)}.timeline-item-active:has(.timeline-item-image) .timeline-item-dot{border-color:var(--color-primary, #10b981);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1);}.timeline-vertical .timeline-item:has(.timeline-item-image) .timeline-item-dot{left:-6px}.timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-image) .timeline-item-dot{right:-6px;left:auto}.timeline-row .timeline-item:has(.timeline-item-image) .timeline-item-dot,.timeline-row .timeline-item:has(.timeline-item-icon) .timeline-item-dot{margin-top:113px}.timeline-item:has(.timeline-item-icon) .timeline-item-dot{width:24px;height:24px;background:var(--bg-primary, #f8fafc)}.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{left:-6px;top:0}.timeline-align-alternate.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{left:50%;transform:translateX(-50%)}.timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{right:-6px;left:auto}.dot-inner{width:4px;height:4px;background:var(--color-primary, #10b981);border-radius:50%}.timeline-item-success .dot-inner{background:var(--color-success, #10b981)}.timeline-item-danger .dot-inner{background:var(--color-danger, #ef4444)}.timeline-item-warning .dot-inner{background:var(--color-warning, #f59e0b)}.timeline-item{transition:opacity 0.2s ease}.timeline-item:hover .timeline-item-dot{transform:scale(1.2)}.timeline-variant-panel .timeline-item-content{background:var(--bg-primary, #ffffff);border:1px solid var(--border-default, #e5e7eb);padding:16px;border-radius:8px;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);position:relative;transition:transform 0.2s, box-shadow 0.2s}.timeline-variant-panel .timeline-item-content::before{content:"";position:absolute;width:10px;height:10px;background:var(--bg-primary, #ffffff);border-left:1px solid var(--border-default, #e5e7eb);border-bottom:1px solid var(--border-default, #e5e7eb);transform:rotate(45deg);display:none;}.timeline-variant-panel .timeline-item:hover .timeline-item-content{box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);transform:translateY(-2px)}.timeline-item-number{color:var(--color-primary, #10b981);font-size:14px;font-weight:700;line-height:1}.timeline-marker-number .timeline-item-dot,.timeline-item:has(.timeline-item-number) .timeline-item-dot{width:32px;height:32px;background:var(--bg-primary, #ffffff);border:2px solid var(--color-primary, #10b981)}.timeline-item-active .timeline-item-number{color:var(--text-standard, #ffffff)}.timeline-item-active.timeline-marker-number .timeline-item-dot{background:var(--color-primary, #10b981)}.timeline-item-image{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}.timeline-item:has(.timeline-item-image) .timeline-item-dot{width:24px;height:24px;padding:0;overflow:hidden;border-radius:50%;position:relative;border:2px solid var(--color-primary, #10b981);border-color:var(--color-primary, #cbd5e1);box-shadow:none;background:var(--bg-primary, #ffffff)}.timeline-item-active:has(.timeline-item-image) .timeline-item-dot{border-color:var(--color-primary, #10b981);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1);}.timeline-vertical .timeline-item:has(.timeline-item-image) .timeline-item-dot{left:0}.timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-image) .timeline-item-dot{right:-6px;left:auto}.timeline-row .timeline-item:has(.timeline-item-image) .timeline-item-dot,.timeline-row .timeline-item:has(.timeline-item-icon) .timeline-item-dot{margin-top:113px}.timeline-row .timeline-item:has(.timeline-item-number) .timeline-item-dot{margin-top:117px;}.timeline-item-title{font-weight:600;font-size:14px;color:var(--text-primary, #1f2937);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.timeline-item-time{font-size:12px;color:var(--text-muted, #6b7280);margin-bottom:2px;font-family:monospace;font-weight:500}.timeline-item-content{min-width:0;}.timeline-item-desc{font-size:13px;color:var(--text-secondary, #4b5563);margin-top:4px;line-height:1.5;display:-webkit-box !important;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;cursor:help;transition:all 0.2s;}.timeline-item-title:hover{white-space:normal;overflow:visible;z-index:50;position:relative;background:rgba(255, 255, 255, 0.9);}.timeline-item-desc:hover{-webkit-line-clamp:unset !important;line-clamp:unset !important;overflow:visible;z-index:50;position:relative;background:rgba(255, 255, 255, 0.9)}@media (prefers-color-scheme: dark){.timeline-item-title{color:var(--text-standard, #f3f4f6)}.timeline-item-desc{color:var(--text-muted, #9ca3af)}.timeline-item-line{background-color:var(--text-secondary, #374151)}.timeline-item-dot{background:var(--bg-primary, #1f2937);border-color:var(--color-primary, #10b981);}.timeline-vertical .timeline-item-dot{background:var(--bg-primary, #1f2937)}.timeline-variant-panel .timeline-item-content{background:var(--bg-primary, #1f2937);border-color:var(--border-default, #374151)}.timeline-variant-panel .timeline-item-content::before{background:var(--bg-primary, #1f2937);border-color:var(--border-default, #374151)}.timeline-marker-number .timeline-item-dot,.timeline-item:has(.timeline-item-number) .timeline-item-dot{background:var(--bg-primary, #1f2937);border-color:var(--color-primary, #10b981)}}.timeline-wrapper{display:flex;flex-direction:column;gap:20px}.timeline-search-header{margin-bottom:24px;padding:0 4px}.timeline-search-input{width:100%;padding:10px 16px;border:1px solid var(--border-default, #e5e7eb);border-radius:8px;font-size:14px;outline:none;transition:all 0.2s ease;background:var(--bg-primary, #f9fafb)}.timeline-search-input:focus{border-color:var(--color-primary, #10b981);background:var(--bg-primary, #ffffff);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1)}.timeline-item-clickable{cursor:pointer}.timeline-item-clickable:hover{opacity:0.8}.timeline-item-clickable:hover .timeline-item-dot{transform:scale(1.3);box-shadow:0 0 0 6px rgba(var(--color-primary-rgb, 59, 130, 246), 0.15)}.timeline-item-pending .timeline-item-line{border-left:2px dashed var(--color-primary, #cbd5e1);background-color:transparent}.timeline-item-pending .dot-inner{background:var(--color-primary, #cbd5e1);animation:timeline-pulse-inner 1.5s infinite ease-in-out}@keyframes timeline-pulse-inner{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:0.5}}.timeline-item.is-active .timeline-item-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid currentColor;animation:timeline-pulse 2s infinite}.timeline-horizontal .timeline-item-pending .timeline-item-line{border-top:2px dashed var(--color-primary, #cbd5e1);background-color:transparent;height:0}.timeline-horizontal.timeline-align-alternate .timeline-item-pending .timeline-item-line{top:50%}:host{display:block;width:100%;--timeline-line-color:var(--color-primary, #10b981);--timeline-line-width:2px;--timeline-dot-size:12px;--timeline-dot-color:var(--color-primary, #10b981)}.timeline-container{position:relative;padding:20px 0;width:100%}.timeline-vertical{display:flex;flex-direction:column;gap:0}.timeline-vertical .timeline-item{position:relative;display:flex;align-items:center;min-height:80px;padding:0}.timeline-vertical .timeline-item .timeline-dot{position:relative;flex-shrink:0;z-index:2;display:flex;align-items:center;justify-content:center;border-radius:50%;border:3px solid var(--timeline-dot-color);background:var(--bg-primary, #ffffff);transition:all 0.3s ease}.timeline-vertical .timeline-item .timeline-dot i{font-size:calc(var(--timeline-dot-size) 0.8)}.timeline-vertical .timeline-item .timeline-line{position:absolute;left:calc(var(--timeline-dot-size));top:calc(var(--timeline-dot-size) + 3px);bottom:calc(-1 * var(--timeline-dot-size) - 3px);width:var(--timeline-line-width);background:var(--timeline-line-color);z-index:1}.timeline-vertical .timeline-item .timeline-content{flex:1;padding:0 24px;margin-top:4px}.timeline-vertical.timeline-align-left .timeline-item{flex-direction:row}.timeline-vertical.timeline-align-left .timeline-item .timeline-dot{margin-right:0}.timeline-vertical.timeline-align-left .timeline-item .timeline-line{left:calc(var(--timeline-dot-size));right:auto}.timeline-vertical.timeline-align-left .timeline-item .timeline-content{text-align:left;padding-left:24px;padding-right:0}.timeline-vertical.timeline-align-right .timeline-item{flex-direction:row-reverse}.timeline-vertical.timeline-align-right .timeline-item .timeline-dot{margin-left:0;margin-right:0}.timeline-vertical.timeline-align-right .timeline-item .timeline-line{left:auto;right:calc(var(--timeline-dot-size))}.timeline-vertical.timeline-align-right .timeline-item .timeline-content{text-align:right;padding-right:24px;padding-left:0}.timeline-vertical.timeline-align-center{display:flex;flex-direction:column;align-items:center}.timeline-vertical.timeline-align-center .timeline-item{width:50%;flex-direction:row;justify-content:flex-start}.timeline-vertical.timeline-align-center .timeline-item .timeline-dot{position:absolute;left:-12px;margin-right:0}.timeline-vertical.timeline-align-center .timeline-item .timeline-line{position:absolute;left:-2px;right:auto}.timeline-vertical.timeline-align-center .timeline-item .timeline-content{text-align:left;padding-left:24px;padding-right:0;margin-left:12px}.timeline-vertical.timeline-align-alternate{display:flex;flex-direction:column;align-items:center}.timeline-vertical.timeline-align-alternate .timeline-item{width:50%}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-dot{position:absolute}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-line{position:absolute}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-left{flex-direction:row-reverse;align-self:flex-start}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-left .timeline-dot{right:-12px;left:auto}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-left .timeline-content{text-align:right;padding-right:24px;padding-left:0;margin-right:12px}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-left .timeline-line{right:-2px;left:auto}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-right{flex-direction:row;align-self:flex-end}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-right .timeline-dot{left:-12px;right:auto}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-right .timeline-content{text-align:left;padding-left:24px;padding-right:0;margin-left:12px}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-right .timeline-line{left:-2px;right:auto}.timeline-horizontal{display:flex;gap:0;overflow-x:auto;padding:40px 0;scrollbar-width:thin;scrollbar-color:var(--timeline-line-color) transparent}.timeline-horizontal::-webkit-scrollbar{height:6px}.timeline-horizontal::-webkit-scrollbar-track{background:transparent}.timeline-horizontal::-webkit-scrollbar-thumb{background-color:var(--timeline-line-color);border-radius:20px}.timeline-horizontal{scroll-snap-type:x mandatory}.timeline-horizontal .timeline-item{position:relative;display:flex;flex-direction:column;align-items:center;min-width:150px;padding:0;flex-shrink:0;scroll-snap-align:center}.timeline-horizontal .timeline-item .timeline-dot{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;border-radius:50%;border:3px solid var(--timeline-dot-color);background:var(--bg-primary, #ffffff);transition:all 0.3s ease}.timeline-horizontal .timeline-item .timeline-dot i{font-size:calc(var(--timeline-dot-size) * 0.8)}.timeline-horizontal .timeline-item .timeline-line{position:absolute;left:calc(var(--timeline-dot-size) * 2);right:calc(-100% + var(--timeline-dot-size) * 2);top:calc(var(--timeline-dot-size));height:var(--timeline-line-width);width:auto;background:var(--timeline-line-color);z-index:1}.timeline-horizontal .timeline-item .timeline-content{padding:16px 12px;max-width:200px}.timeline-horizontal.timeline-align-left .timeline-item,.timeline-horizontal.timeline-align-top .timeline-item{flex-direction:column-reverse}.timeline-horizontal.timeline-align-left .timeline-item .timeline-content,.timeline-horizontal.timeline-align-top .timeline-item .timeline-content{text-align:center}.timeline-horizontal.timeline-align-right .timeline-item .timeline-content,.timeline-horizontal.timeline-align-bottom .timeline-item .timeline-content{text-align:center}.timeline-horizontal.timeline-align-alternate .timeline-item.timeline-item-top{flex-direction:column-reverse}.timeline-horizontal.timeline-align-alternate .timeline-item .timeline-content{text-align:center}.timeline-content{background:var(--bg-primary, #ffffff);border-radius:8px;border:1px solid var(--border-default, #e5e7eb);box-shadow:0 1px 3px rgba(0, 0, 0, 0.1);transition:all 0.3s ease}.timeline-date{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12px;color:var(--text-secondary);font-weight:500}.timeline-date .timeline-date-text{color:var(--primary-color)}.timeline-date .timeline-time-text{color:var(--text-secondary)}.timeline-image{margin:-1px -1px 12px -1px;border-radius:8px 8px 0 0;overflow:hidden}.timeline-image img{width:100%;height:auto;display:block}.timeline-header{margin-bottom:8px}.timeline-title{margin:0;font-size:16px;font-weight:600;color:var(--text-primary, #111827);line-height:1.4}.timeline-description{margin:0;font-size:14px;color:var(--text-secondary);line-height:1.6}.timeline-custom{margin-top:12px}.timeline-badge{position:absolute;top:-6px;right:-6px;background:var(--color-danger, #ef4444);color:var(--text-standard, #ffffff);font-size:10px;font-weight:600;padding:2px 6px;border-radius:10px;min-width:18px;text-align:center}.timeline-variant-outlined .timeline-content{background:transparent;border:2px solid var(--border-default, #e5e7eb);box-shadow:none}.timeline-variant-filled .timeline-content{background:var(--bg-secondary, #f3f4f6);border:none;box-shadow:none}.timeline-variant-minimal .timeline-content{background:transparent;border:none;box-shadow:none;padding:8px 12px}.timeline-variant-minimal .timeline-dot{border-width:2px !important}.timeline-variant-dots-only .timeline-content{display:none}.timeline-variant-dots-only .timeline-dot{cursor:pointer}.timeline-variant-dots-only .timeline-dot:hover{transform:scale(1.2)}.timeline-compact.timeline-vertical .timeline-item{min-height:50px}.timeline-compact.timeline-vertical .timeline-item .timeline-content{padding:0 16px}.timeline-compact.timeline-horizontal .timeline-item{min-width:100px}.timeline-compact.timeline-horizontal .timeline-item .timeline-content{padding:8px;max-width:150px}.timeline-compact .timeline-content{padding:8px 12px}.timeline-compact .timeline-title{font-size:14px}.timeline-compact .timeline-description{font-size:12px}.timeline-item-clickable{cursor:pointer}.timeline-item-clickable .timeline-content:hover{box-shadow:0 4px 6px rgba(0, 0, 0, 0.15);transform:translateY(-2px);border-color:var(--timeline-dot-color)}.timeline-item-clickable.timeline-item-active .timeline-content{border-color:var(--timeline-dot-color);box-shadow:0 0 0 3px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1)}.timeline-item-clickable.timeline-item-active .timeline-dot{transform:scale(1.2);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.2)}.timeline-animated .timeline-item{opacity:0;transition:opacity 0.6s ease, transform 0.6s ease}.timeline-animated .timeline-item.timeline-item-visible{opacity:1}.timeline-animated.timeline-vertical .timeline-item{transform:translateX(-30px)}.timeline-animated.timeline-vertical .timeline-item.timeline-item-right{transform:translateX(30px)}.timeline-animated.timeline-vertical .timeline-item.timeline-item-visible{transform:translateX(0)}.timeline-animated.timeline-horizontal .timeline-item{transform:translateY(30px)}.timeline-animated.timeline-horizontal .timeline-item.timeline-item-top{transform:translateY(-30px)}.timeline-animated.timeline-horizontal .timeline-item.timeline-item-visible{transform:translateY(0)}.timeline-icon-top.timeline-vertical .timeline-item{align-items:flex-start}.timeline-icon-top.timeline-vertical .timeline-item .timeline-dot{margin-top:0}.timeline-icon-top.timeline-vertical .timeline-item .timeline-line{top:calc(var(--timeline-dot-size) + 3px)}.timeline-icon-top.timeline-horizontal.timeline-align-top .timeline-item .timeline-dot{align-self:flex-start}.timeline-icon-top.timeline-horizontal.timeline-align-bottom .timeline-item .timeline-dot{align-self:flex-start}.timeline-icon-center.timeline-vertical .timeline-item{align-items:center}.timeline-icon-center.timeline-vertical .timeline-item .timeline-dot{margin-top:0}.timeline-icon-center.timeline-vertical .timeline-item .timeline-line{top:50%;transform:translateY(calc(var(--timeline-dot-size) / 2 + 3px));bottom:calc(-50% - var(--timeline-dot-size) / 2 - 3px)}.timeline-icon-center.timeline-horizontal .timeline-item .timeline-dot{align-self:center}.timeline-icon-bottom.timeline-vertical .timeline-item{align-items:flex-start}.timeline-icon-bottom.timeline-vertical .timeline-item .timeline-dot{margin-top:auto;align-self:flex-end}.timeline-icon-bottom.timeline-vertical .timeline-item .timeline-line{top:auto;bottom:calc(-1 * var(--timeline-dot-size) - 3px);height:calc(100% - var(--timeline-dot-size) - 3px);transform:none}.timeline-icon-bottom.timeline-vertical.timeline-align-center .timeline-item .timeline-line{left:-2px;right:auto}.timeline-icon-bottom.timeline-vertical.timeline-align-alternate .timeline-item-left .timeline-line{right:-2px;left:auto}.timeline-icon-bottom.timeline-vertical.timeline-align-alternate .timeline-item-right .timeline-line{left:-2px;right:auto}.timeline-icon-bottom.timeline-horizontal.timeline-align-top .timeline-item .timeline-dot{align-self:flex-end}.timeline-icon-bottom.timeline-horizontal.timeline-align-bottom .timeline-item .timeline-dot{align-self:flex-end}@media (max-width: 768px){.timeline-horizontal{flex-direction:column;overflow-x:visible}.timeline-horizontal .timeline-item{min-width:100%;flex-direction:row;align-items:flex-start}.timeline-horizontal .timeline-item .timeline-line{left:calc(var(--timeline-dot-size));top:calc(var(--timeline-dot-size) * 2);bottom:calc(-100% + var(--timeline-dot-size) * 2);right:auto;width:var(--timeline-line-width);height:auto}.timeline-horizontal .timeline-item .timeline-content{padding:0 24px;max-width:none;text-align:left !important}.timeline-vertical.timeline-align-alternate,.timeline-vertical.timeline-align-center{padding-left:0}.timeline-vertical.timeline-align-alternate .timeline-item,.timeline-vertical.timeline-align-center .timeline-item{flex-direction:row !important;transform:none !important;padding-right:0 !important}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-content,.timeline-vertical.timeline-align-center .timeline-item .timeline-content{text-align:left !important}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-line,.timeline-vertical.timeline-align-center .timeline-item .timeline-line{left:calc(var(--timeline-dot-size)) !important;right:auto !important}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:flex-start;min-height:80px;width:100%;position:relative}}@media (max-width: 768px) and (max-width: 768px){.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item{display:flex;flex-direction:column;padding-left:30px}}@media (max-width: 768px){.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-side,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-side{min-width:0;display:flex;flex-direction:column;justify-content:center}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-side.timeline-side-left,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-side.timeline-side-left{align-items:flex-end;text-align:right}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-side.timeline-side-right,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-side.timeline-side-right{align-items:flex-start;text-align:left}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-separator,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-separator{display:flex;flex-direction:column;align-items:center;position:relative;height:100%;min-width:24px}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-separator .timeline-line-vertical,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-separator .timeline-line-vertical{position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:var(--timeline-line-width);background-color:var(--timeline-line-color);z-index:0}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-separator .timeline-marker,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-separator .timeline-marker{position:relative;z-index:1;margin-top:4px}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-opposite-date,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-opposite-date{font-size:0.9rem;color:var(--text-secondary);font-weight:500;padding:6px 16px;border-radius:20px;background:rgba(0, 0, 0, 0.03);margin:10px 0;display:inline-block;transition:all 0.3s ease}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-opposite-date:hover,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-opposite-date:hover{background:rgba(0, 0, 0, 0.06);transform:translateY(-2px)}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-icon-center .timeline-balanced-item,.timeline-vertical.timeline-align-center .timeline-item .timeline-icon-center .timeline-balanced-item{align-items:center}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-icon-center .timeline-balanced-item .timeline-separator .timeline-marker,.timeline-vertical.timeline-align-center .timeline-item .timeline-icon-center .timeline-balanced-item .timeline-separator .timeline-marker{margin-top:0}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-icon-bottom .timeline-balanced-item,.timeline-vertical.timeline-align-center .timeline-item .timeline-icon-bottom .timeline-balanced-item{align-items:flex-end}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-icon-bottom .timeline-balanced-item .timeline-separator .timeline-marker,.timeline-vertical.timeline-align-center .timeline-item .timeline-icon-bottom .timeline-balanced-item .timeline-separator .timeline-marker{margin-top:auto;margin-bottom:4px}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-left,.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-right,.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-separator,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-left,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-right,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-separator{opacity:0;transition:all 0.6s ease}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-left,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-left{transform:translateX(-20px)}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-right,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-right{transform:translateX(20px)}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-separator,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-separator{transform:scale(0.5)}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-side-left,.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-side-right,.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-separator,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-side-left,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-side-right,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-separator{opacity:1;transform:none}}.timeline-snake-container{display:flex;flex-direction:column;gap:40px;width:100%}.timeline-snake-row{display:flex;width:100%;position:relative}.timeline-snake-row.timeline-snake-row-odd{flex-direction:row-reverse}.timeline-snake-row.timeline-snake-row-odd .timeline-item .timeline-snake-turn{right:auto;left:0;border-right:none;border-left:2px solid var(--timeline-line-color);border-radius:0 0 0 16px}.timeline-snake-item{flex:0 0 10%;display:flex;flex-direction:column;align-items:center;position:relative;min-width:0;padding:0 10px}.timeline-snake-item .timeline-content{margin-top:12px;text-align:center;font-size:0.85rem;padding:8px;width:100%}.timeline-snake-item .timeline-dot{z-index:2}.timeline-snake-item .timeline-line-horizontal{position:absolute;top:calc(var(--timeline-dot-size) + 1px);top:calc(var(--timeline-dot-size));left:50%;width:100%;height:var(--timeline-line-width);background-color:var(--timeline-line-color);z-index:1}.timeline-snake-item .timeline-snake-turn{position:absolute;top:calc(var(--timeline-dot-size));right:0;width:50%;height:calc(100% + 40px);border-top:var(--timeline-line-width) solid var(--timeline-line-color);border-right:var(--timeline-line-width) solid var(--timeline-line-color);border-radius:0 50px 50px 0;z-index:1;pointer-events:none;opacity:0.8}.timeline-snake-row.timeline-snake-row-odd .timeline-item .timeline-snake-turn{border-radius:0 0 0 50px}:host-context([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-line,:host([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-line{left:auto;right:5px}:host-context([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-dot,:host([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-dot{left:auto;right:0}:host-context([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-details,:host([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-details{padding-left:0;padding-right:48px;text-align:right;align-items:flex-end}:host-context([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item,:host([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item{flex-direction:row}:host-context([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-line,:host([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-line{right:auto;left:5px}:host-context([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-dot,:host([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-dot{right:auto;left:0}:host-context([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-details,:host([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-details{padding-right:0;padding-left:48px;text-align:left;align-items:flex-start}:host-context([dir=rtl]) .timeline-align-alternate.timeline-vertical .side-left .timeline-item-details,:host([dir=rtl]) .timeline-align-alternate.timeline-vertical .side-left .timeline-item-details{padding-right:0;padding-left:48px;text-align:left;align-items:flex-start;margin-left:50%;margin-right:0}:host-context([dir=rtl]) .timeline-align-alternate.timeline-vertical .side-right .timeline-item-details,:host([dir=rtl]) .timeline-align-alternate.timeline-vertical .side-right .timeline-item-details{padding-left:0;padding-right:48px;text-align:right;align-items:flex-end;margin-left:0;margin-right:0;width:50%}:host-context([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot,:host([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{right:auto;left:-6px}'}},[513,"ui-timeline",{events:[1],flow:[1],mode:[1],align:[1],theme:[16],multiline:[4],columns:[2],variant:[1],marker:[1],clickable:[4],reverse:[4],pending:[4],searchable:[4],lineColor:[1,"line-color"],lineWidth:[2,"line-width"],dotSize:[2,"dot-size"],dotColor:[1,"dot-color"],showLine:[4,"show-line"],showDots:[4,"show-dots"],animateOnScroll:[4,"animate-on-scroll"],compact:[4],wrap:[4],showDates:[4,"show-dates"],dateFormat:[1,"date-format"],iconPosition:[1,"icon-position"],normalizedEvents:[32],activeItemId:[32],visibleItems:[32],searchQuery:[32],isRtl:[32],isMobile:[32]},void 0,{events:[{normalizeEvents:0}]}]),g=p,h=function(){"undefined"!=typeof customElements&&["ui-timeline","ui-badge","ui-button","ui-icon","ui-input","ui-loader"].forEach((e=>{switch(e){case"ui-timeline":customElements.get(m(e))\|\|customElements.define(m(e),p);break;case"ui-badge":customElements.get(m(e))\|\|d();break;case"ui-button":customElements.get(m(e))\|\|o();break;case"ui-icon":customElements.get(m(e))\|\|r();break;case"ui-input":customElements.get(m(e))\|\|s();break;case"ui-loader":customElements.get(m(e))\|\|c()}}))};export{g as UiTimeline,h as defineCustomElement}
1	+ import{proxyCustomElement as e,HTMLElement as i,createEvent as t,h as n,Host as l,transformTag as m}from"@stencil/core/internal/client";import{s as a,d as r}from"./icon.js";import{d as o}from"./badge.js";import{d}from"./button.js";import{d as s}from"./input.js";import{d as c}from"./loader.js";const p=e(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.itemVisible=t(this,"itemVisible",7),this.itemClick=t(this,"itemClick",7)}events=[];normalizedEvents=[];flow="linear";mode="vertical";align="left";theme;multiline=!1;columns=4;variant="default";marker="dot";clickable=!1;reverse=!1;pending=!1;searchable=!1;lineColor="#3bf673";lineWidth=2;dotSize=12;dotColor="#3bf673";showLine=!0;showDots=!0;animateOnScroll=!1;compact=!1;wrap=!1;showDates=!0;dateFormat="short";iconPosition="center";activeItemId;visibleItems=new Set;searchQuery="";itemVisible;itemClick;get el(){return this}normalizeEvents(e){if("string"==typeof e)try{this.normalizedEvents=JSON.parse(e)}catch{this.normalizedEvents=[]}else this.normalizedEvents=e\|\|[]}isRtl=!1;isMobile=!1;observer;componentWillLoad(){this.normalizeEvents(this.events)}componentDidLoad(){this.animateOnScroll&&this.setupIntersectionObserver(),this.checkMobile(),this.checkRtl(),window.addEventListener("resize",this.handleResize)}disconnectedCallback(){this.observer&&this.observer.disconnect(),window.removeEventListener("resize",this.handleResize)}handleResize=()=>{this.checkMobile()};checkMobile(){this.isMobile=window.innerWidth<=768}checkRtl(){this.isRtl="rtl"===getComputedStyle(this.el).direction\|\|null!==this.el.closest('[dir="rtl"]')\|\|"rtl"===document.documentElement.dir}setupIntersectionObserver(){void 0!==globalThis.IntersectionObserver&&(this.observer=new IntersectionObserver((e=>{e.forEach((e=>{if(e.isIntersecting){const i=e.target.getAttribute("data-item-id"),t=e.target.getAttribute("data-item-index");if(i\|\|t){this.visibleItems=new Set([...this.visibleItems,i\|\|t]);const e=parseInt(t\|\|"0",10),n=this.normalizedEvents[e];n&&this.itemVisible.emit({item:n,index:e})}}}))}),{threshold:.2}))}getProcessedEvents(){let e=[...this.normalizedEvents];if(this.searchable&&this.searchQuery){const i=this.searchQuery.toLowerCase();e=e.filter((e=>e.label.toLowerCase().includes(i)\|\|e.description&&e.description.toLowerCase().includes(i)\|\|e.opposite&&"string"==typeof e.opposite&&e.opposite.toLowerCase().includes(i)\|\|e.customContent&&e.customContent.toLowerCase().includes(i)))}return this.reverse&&e.reverse(),e}handleSearch=e=>{this.searchQuery=e.detail};handleItemClick=e=>{this.clickable&&this.itemClick.emit(e)};render(){const e=this.getProcessedEvents(),i=this.isMobile&&this.compact?"vertical":this.mode,t=["timeline-container","timeline-"+i,"timeline-align-"+this.align,(this.multiline\|\|this.wrap)&&"timeline-multiline","timeline-variant-"+this.variant,"timeline-marker-"+this.marker,this.clickable&&"timeline-clickable",this.animateOnScroll&&"timeline-animated",this.compact&&"timeline-compact","timeline-icon-"+this.iconPosition].filter(Boolean).join(" "),m={...this.theme,"--timeline-line-color":this.lineColor,"--timeline-line-width":this.lineWidth+"px","--timeline-dot-size":this.dotSize+"px","--timeline-dot-color":this.dotColor},a="horizontal"===i&&(this.multiline\|\|this.wrap)?this.renderMultiline(t,e,m):n("div",{class:t,style:m},e.map(((e,i)=>this.renderEventItem(e,i))),this.pending&&this.renderPendingItem(e.length));return n(l,{key:"895dad278ac5ef9373c0053fe80f39d4c0850ba0"},n("div",{key:"83841752c240e330781abd770ba5079305d18ced",class:"timeline-wrapper"},this.searchable&&n("div",{key:"068ab74adbeb338f0ae91bb6f2d69ae91c426d2d",class:"timeline-search-header"},n("ui-input",{key:"8c1e6d69c5f10e25e6abdab5eedd84a93727729b",type:"text",class:"timeline-search-input",placeholder:"Search events...",onInputChange:this.handleSearch,value:this.searchQuery,size:"sm",fullWidth:!0})),a))}renderMultiline(e,i,t){const l=this.columns>0?this.columns:4,m=[];for(let e=0;e<i.length;e+=l)m.push(i.slice(e,e+l));return n("div",{class:`${e} ${this.wrap?"timeline-snake-container":""}`,style:t},m.map(((e,i)=>n("div",{class:{"timeline-row":!0,"timeline-row-even":i%2==0,"timeline-row-odd":i%2!=0}},e.map(((t,n)=>this.renderEventItem(t,ithis.columns+n,!0,n===e.length-1)))))),this.pending&&this.renderPendingItem(i.length,!0))}renderPendingItem(e,i=!1){const t=this.isRtl?e%2!=0:e%2==0,l="alternate"===this.align?t?"left":"right":this.align,m="alternate"===this.align?t?"top":"bottom":"top"===this.align?"top":"bottom",a="left"===l\|\|"right"===l?"timeline-item-"+l:void 0,r="top"===m\|\|"bottom"===m?"timeline-item-"+m:void 0;return n("div",{class:{"timeline-item":!0,"timeline-item-pending":!0,["side-"+l]:"vertical"===this.mode,["side-"+m]:"horizontal"===this.mode,[a]:!!a,[r]:!!r,"is-multiline":i}},n("div",{class:"timeline-item-line"}),n("div",{class:"timeline-item-dot"},n("span",{class:"dot-inner"})),n("div",{class:"timeline-item-details"},n("div",{class:"timeline-item-content"},n("div",{class:"timeline-item-title"},"Pending..."))))}renderEventItem(e,i,t=!1,l=!1){const m="alternate"===this.align,r=this.isRtl?i%2!=0:i%2==0,o=m?r?"left":"right":this.align,d=m?r?"top":"bottom":"top"===this.align?"top":"bottom",s="left"===o\|\|"right"===o?"timeline-item-"+o:void 0,c="top"===d\|\|"bottom"===d?"timeline-item-"+d:void 0;let p;const g={};e.dotColor&&(g.borderColor=e.dotColor),e.iconBackground&&(g.backgroundColor=e.iconBackground);const h={};e.iconColor&&(h.color=e.iconColor),p=e.image?n("img",{src:e.image,alt:e.label,class:"timeline-item-image",width:"24",height:"24"}):e.icon\|\|"icon"===this.marker?n("span",{class:"timeline-item-icon",style:h},e.icon&&e.icon.includes("<svg")?n("span",{innerHTML:a(e.icon)}):n("ui-icon",{name:e.icon\|\|"default-icon",library:"fontawesome"})):"number"===this.marker?n("span",{class:"timeline-item-number"},i+1):n("span",{class:"dot-inner"});const f=this.visibleItems.has(e.id\|\|""+i);return n("div",{"data-item-id":e.id\|\|""+i,"data-item-index":i,ref:e=>{e&&this.animateOnScroll&&this.observer&&this.observer.observe(e)},class:["timeline-item","timeline-item-"+(e.status\|\|"default"),i%2==0?"timeline-item-even":"timeline-item-odd","side-"+o,"side-"+d,s,c,t&&l&&"is-last-in-row",!!e.image&&"has-image",!!e.icon&&"has-icon","number"===this.marker&&!e.image&&!e.icon&&"has-number",this.clickable&&"timeline-item-clickable",("active"===e.status\|\|"pending"===e.status)&&"is-active",this.animateOnScroll&&"timeline-item-animated",(f\|\|!this.animateOnScroll)&&"timeline-item-visible","center"===this.align&&"timeline-balanced-item",!!e.position&&"timeline-item-position-"+e.position].filter(Boolean).join(" "),onClick:()=>this.handleItemClick(e)},n("div",{class:"timeline-side timeline-side-left"},"left"===o&&e.opposite&&n("span",{class:"timeline-opposite-content"},e.opposite)),n("div",{class:"timeline-item-divider"},this.showLine&&n("div",{class:"timeline-item-line",style:{backgroundColor:e.lineColor\|\|this.lineColor}}),n("div",{class:"timeline-item-dot",style:g},p,e.badge&&n("span",{class:"timeline-badge"},e.badge))),n("div",{class:"timeline-item-details timeline-side timeline-side-right"},this.showDates&&(e.date\|\|e.time\|\|e.timestamp)&&n("div",{class:"timeline-item-time"},e.date&&n("span",{class:"timeline-date-text"},e.date," "),e.time&&n("span",{class:"timeline-time-text"},e.time),!e.date&&!e.time&&e.timestamp&&n("span",{class:"timeline-date-text"},e.timestamp)),n("div",{class:"timeline-item-content"},n("div",{class:"timeline-item-title"},e.label),e.description&&n("div",{class:"timeline-item-desc"},e.description),e.customContent&&n("div",{class:"timeline-custom-content",innerHTML:a(e.customContent)}))))}static get watchers(){return{events:[{normalizeEvents: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%}.timeline-container{display:flex;position:relative;font-family:inherit}.timeline-vertical{flex-direction:column;padding:20px 0}.timeline-vertical .timeline-item{display:flex;position:relative;padding-bottom:24px;align-items:center}.timeline-vertical .timeline-item{display:flex;position:relative;align-items:center}.timeline-vertical .timeline-side{flex:1 1 0%;width:calc(50% - 24px);max-width:calc(50% - 24px);min-width:0;display:flex;flex-direction:column}.timeline-vertical .timeline-item-divider{position:relative;display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:48px;align-self:stretch}.timeline-vertical .timeline-item-line{position:absolute;top:0;bottom:-24px;left:50%;transform:translateX(-50%);width:2px;background-color:var(--bg-primary, #e5e7eb)}.timeline-vertical .timeline-item:first-child .timeline-item-line{top:50%}.timeline-vertical .timeline-item:last-child .timeline-item-line{display:none}.timeline-vertical .timeline-item-dot{position:relative;z-index:10;width:12px;height:12px;background:var(--bg-primary, #ffffff);border:2px solid var(--color-primary, #10b981);border-radius:50%;flex-shrink:0;margin-top:auto;margin-bottom:auto}.timeline-icon-top .timeline-item .timeline-item-divider{justify-content:flex-start}.timeline-icon-top .timeline-item-dot{margin-top:4px;margin-bottom:0}.timeline-icon-center .timeline-item .timeline-item-divider{justify-content:center}.timeline-icon-bottom .timeline-item .timeline-item-divider{justify-content:flex-end}.timeline-icon-bottom .timeline-item-dot{margin-top:0;margin-bottom:4px}.timeline-align-left.timeline-vertical .timeline-side-left{display:none}.timeline-align-left.timeline-vertical .timeline-item-details{padding-left:16px;align-items:flex-start;text-align:left}.timeline-align-left.timeline-vertical .timeline-item-divider{width:24px}.timeline-align-right.timeline-vertical .timeline-item{flex-direction:row-reverse}.timeline-align-right.timeline-vertical .timeline-side-left{display:none}.timeline-align-right.timeline-vertical .timeline-item-details{padding-right:16px;align-items:flex-end;text-align:right}.timeline-align-right.timeline-vertical .timeline-item-divider{width:24px}.timeline-align-center.timeline-vertical .timeline-item,.timeline-align-alternate.timeline-vertical .timeline-item{flex-direction:row}.timeline-align-alternate.timeline-vertical .timeline-item.side-left{flex-direction:row-reverse}.timeline-align-center.timeline-vertical .timeline-side-left,.timeline-align-alternate.timeline-vertical .timeline-side-left{padding-right:24px;align-items:flex-end;text-align:right}.timeline-align-center.timeline-vertical .timeline-item-details,.timeline-align-alternate.timeline-vertical .timeline-item-details{padding-left:24px;align-items:flex-start;text-align:left}.timeline-align-alternate.timeline-vertical .timeline-item.side-left .timeline-side-left{padding-right:0;padding-left:24px;align-items:flex-start;text-align:left}.timeline-align-alternate.timeline-vertical .timeline-item.side-left .timeline-item-details{padding-left:0;padding-right:24px;align-items:flex-end;text-align:right}.timeline-horizontal{display:flex;flex-direction:row;padding:40px 0;overflow-x:auto;min-height:250px;align-items:stretch}.timeline-horizontal .timeline-item{flex:1;min-width:200px;display:flex;flex-direction:column;position:relative;align-items:center;justify-content:center;height:100%}.timeline-horizontal .timeline-side{flex:1;display:flex;flex-direction:column;justify-content:center;width:100%}.timeline-horizontal .timeline-item-divider{position:relative;display:flex;flex-direction:row;align-items:center;justify-content:center;height:48px;width:100%;flex-shrink:0;z-index:10}.timeline-horizontal .timeline-item-line{position:absolute;top:50%;left:50%;right:-50%;transform:translateY(-50%);height:2px;background-color:var(--bg-primary, #e5e7eb);z-index:0}.timeline-horizontal .timeline-item:last-child .timeline-item-line{display:none}.timeline-horizontal .timeline-item-dot{position:relative;z-index:10;width:12px;height:12px;background:var(--bg-primary, #ffffff);border:2px solid var(--color-primary, #10b981);border-radius:50%;margin:auto}.timeline-horizontal .timeline-item-details{width:100%;padding:16px;display:flex;flex-direction:column;align-items:center;text-align:center;box-sizing:border-box}.timeline-horizontal .timeline-item-content,.timeline-horizontal .timeline-item-time{width:100%;text-align:center}.timeline-horizontal.timeline-align-bottom .timeline-side-left,.timeline-horizontal.timeline-align-left .timeline-side-left{display:none}.timeline-horizontal.timeline-align-bottom .timeline-side-right,.timeline-horizontal.timeline-align-left .timeline-side-right{justify-content:flex-start}.timeline-horizontal.timeline-align-bottom .timeline-item-details,.timeline-horizontal.timeline-align-left .timeline-item-details{padding-top:24px}.timeline-horizontal.timeline-align-top .timeline-item{flex-direction:column-reverse}.timeline-horizontal.timeline-align-top .timeline-side-left{display:none}.timeline-horizontal.timeline-align-top .timeline-side-right{justify-content:flex-end}.timeline-horizontal.timeline-align-top .timeline-item-details{padding-bottom:24px;flex-direction:column-reverse;}.timeline-horizontal.timeline-align-alternate .timeline-item{flex-direction:column}.timeline-horizontal.timeline-align-alternate .timeline-item.side-top{flex-direction:column-reverse}.timeline-horizontal.timeline-align-alternate .timeline-item.side-top .timeline-item-details{padding-bottom:24px;flex-direction:column-reverse}.timeline-horizontal.timeline-align-alternate .timeline-item.side-bottom .timeline-item-details{padding-top:24px}.timeline-horizontal.timeline-multiline{flex-direction:column;flex-wrap:nowrap;gap:0;padding:40px 80px;align-items:stretch;overflow:visible}.timeline-row{display:flex;width:100%;justify-content:flex-start;position:relative;height:250px;}.timeline-row.timeline-row-odd{flex-direction:row-reverse}.timeline-horizontal.timeline-multiline .timeline-item{flex:1;min-width:0;height:100%}.timeline-row.timeline-row-odd .timeline-item-line{left:-50%;right:50%}.timeline-item.is-last-in-row .timeline-item-line{display:block;left:50%;right:0;width:auto}.timeline-row-odd .timeline-item.is-last-in-row .timeline-item-line{left:0;right:50%}.timeline-row-even .timeline-item.is-last-in-row::after{content:"";position:absolute;right:-60px;width:60px;top:50%;height:250px;border-right:2px solid var(--border-default, #e5e7eb);border-top:2px solid var(--border-default, #e5e7eb);border-bottom:2px solid var(--border-default, #e5e7eb);border-top-right-radius:60px;border-bottom-right-radius:60px;z-index:0;pointer-events:none;transform:translateY(-1px);}.timeline-row-odd .timeline-item.is-last-in-row::after{content:"";position:absolute;left:-60px;width:60px;top:50%;height:250px;border-left:2px solid var(--border-default, #e5e7eb);border-top:2px solid var(--border-default, #e5e7eb);border-bottom:2px solid var(--border-default, #e5e7eb);border-top-left-radius:60px;border-bottom-left-radius:60px;z-index:0;pointer-events:none;transform:translateY(-1px)}.timeline-row:last-child .timeline-item.is-last-in-row::after{display:none}.timeline-item-success .timeline-item-dot{border-color:var(--color-success, #10b981)}.timeline-item-danger .timeline-item-dot{border-color:var(--color-danger, #ef4444)}.timeline-item-warning .timeline-item-dot{border-color:var(--color-warning, #f59e0b)}.timeline-item-active .timeline-item-dot{border-color:var(--color-primary, #10b981);background-color:var(--bg-primary, #eff6ff);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1)}.timeline-item-active .timeline-item-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--color-primary, #10b981);animation:timeline-pulse 2s infinite}.timeline-item-active .timeline-item-title{color:var(--color-primary, #10b981)}@keyframes timeline-pulse{0%{transform:scale(1);opacity:0.5}100%{transform:scale(2);opacity:0}}.timeline-item-dot{display:flex;align-items:center;justify-content:center;transition:all 0.2s ease}.timeline-item-icon{font-size:14px;display:inline-flex;align-items:center;justify-content:center;line-height:1;width:100%;height:100%}.timeline-item:has(.timeline-item-icon) .timeline-item-dot{width:24px;height:24px;background:var(--bg-primary, #f8fafc);display:flex !important;align-items:center;justify-content:center}.dot-inner{width:4px;height:4px;background:var(--color-primary, #10b981);border-radius:50%}.timeline-item-success .dot-inner{background:var(--color-success, #10b981)}.timeline-item-danger .dot-inner{background:var(--color-danger, #ef4444)}.timeline-item-warning .dot-inner{background:var(--color-warning, #f59e0b)}.timeline-item{transition:opacity 0.2s ease}.timeline-item:hover .timeline-item-dot{transform:scale(1.2)}.timeline-variant-panel .timeline-item-content{background:var(--bg-primary, #ffffff);border:1px solid var(--border-default, #e5e7eb);padding:16px;border-radius:8px;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);position:relative;transition:transform 0.2s, box-shadow 0.2s}.timeline-variant-panel .timeline-item-content::before{content:"";position:absolute;width:10px;height:10px;background:var(--bg-primary, #ffffff);border-left:1px solid var(--border-default, #e5e7eb);border-bottom:1px solid var(--border-default, #e5e7eb);transform:rotate(45deg);display:none;}.timeline-variant-panel .timeline-item:hover .timeline-item-content{box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);transform:translateY(-2px)}.timeline-item-number{color:var(--color-primary, #10b981);font-size:14px;font-weight:700;line-height:1}.timeline-marker-number .timeline-item-dot,.timeline-item:has(.timeline-item-number) .timeline-item-dot{width:32px;height:32px;background:var(--bg-primary, #ffffff);border:2px solid var(--color-primary, #10b981)}.timeline-item-active .timeline-item-number{color:var(--text-standard, #ffffff)}.timeline-item-active.timeline-marker-number .timeline-item-dot{background:var(--color-primary, #10b981)}.timeline-item-image{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}.timeline-item:has(.timeline-item-image) .timeline-item-dot{width:24px;height:24px;padding:0;overflow:hidden;border-radius:50%;position:relative;border:2px solid var(--color-primary, #10b981);border-color:var(--color-primary, #cbd5e1);box-shadow:none;background:var(--bg-primary, #ffffff)}.timeline-item-active:has(.timeline-item-image) .timeline-item-dot{border-color:var(--color-primary, #10b981);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1);}.timeline-vertical .timeline-item:has(.timeline-item-image) .timeline-item-dot{left:-6px}.timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-image) .timeline-item-dot{right:-6px;left:auto}.timeline-row .timeline-item:has(.timeline-item-image) .timeline-item-dot,.timeline-row .timeline-item:has(.timeline-item-icon) .timeline-item-dot{margin-top:113px}.timeline-item:has(.timeline-item-icon) .timeline-item-dot{width:24px;height:24px;background:var(--bg-primary, #f8fafc)}.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{left:-6px;top:0}.timeline-align-alternate.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{left:50%;transform:translateX(-50%)}.timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{right:-6px;left:auto}.dot-inner{width:4px;height:4px;background:var(--color-primary, #10b981);border-radius:50%}.timeline-item-success .dot-inner{background:var(--color-success, #10b981)}.timeline-item-danger .dot-inner{background:var(--color-danger, #ef4444)}.timeline-item-warning .dot-inner{background:var(--color-warning, #f59e0b)}.timeline-item{transition:opacity 0.2s ease}.timeline-item:hover .timeline-item-dot{transform:scale(1.2)}.timeline-variant-panel .timeline-item-content{background:var(--bg-primary, #ffffff);border:1px solid var(--border-default, #e5e7eb);padding:16px;border-radius:8px;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);position:relative;transition:transform 0.2s, box-shadow 0.2s}.timeline-variant-panel .timeline-item-content::before{content:"";position:absolute;width:10px;height:10px;background:var(--bg-primary, #ffffff);border-left:1px solid var(--border-default, #e5e7eb);border-bottom:1px solid var(--border-default, #e5e7eb);transform:rotate(45deg);display:none;}.timeline-variant-panel .timeline-item:hover .timeline-item-content{box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);transform:translateY(-2px)}.timeline-item-number{color:var(--color-primary, #10b981);font-size:14px;font-weight:700;line-height:1}.timeline-marker-number .timeline-item-dot,.timeline-item:has(.timeline-item-number) .timeline-item-dot{width:32px;height:32px;background:var(--bg-primary, #ffffff);border:2px solid var(--color-primary, #10b981)}.timeline-item-active .timeline-item-number{color:var(--text-standard, #ffffff)}.timeline-item-active.timeline-marker-number .timeline-item-dot{background:var(--color-primary, #10b981)}.timeline-item-image{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}.timeline-item:has(.timeline-item-image) .timeline-item-dot{width:24px;height:24px;padding:0;overflow:hidden;border-radius:50%;position:relative;border:2px solid var(--color-primary, #10b981);border-color:var(--color-primary, #cbd5e1);box-shadow:none;background:var(--bg-primary, #ffffff)}.timeline-item-active:has(.timeline-item-image) .timeline-item-dot{border-color:var(--color-primary, #10b981);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1);}.timeline-vertical .timeline-item:has(.timeline-item-image) .timeline-item-dot{left:0}.timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-image) .timeline-item-dot{right:-6px;left:auto}.timeline-row .timeline-item:has(.timeline-item-image) .timeline-item-dot,.timeline-row .timeline-item:has(.timeline-item-icon) .timeline-item-dot{margin-top:113px}.timeline-row .timeline-item:has(.timeline-item-number) .timeline-item-dot{margin-top:117px;}.timeline-item-title{font-weight:600;font-size:14px;color:var(--text-primary, #1f2937);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.timeline-item-time{font-size:12px;color:var(--text-muted, #6b7280);margin-bottom:2px;font-family:monospace;font-weight:500}.timeline-item-content{min-width:0;}.timeline-item-desc{font-size:13px;color:var(--text-secondary, #4b5563);margin-top:4px;line-height:1.5;display:-webkit-box !important;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;cursor:help;transition:all 0.2s;}.timeline-item-title:hover{white-space:normal;overflow:visible;z-index:50;position:relative;background:rgba(255, 255, 255, 0.9);}.timeline-item-desc:hover{-webkit-line-clamp:unset !important;line-clamp:unset !important;overflow:visible;z-index:50;position:relative;background:rgba(255, 255, 255, 0.9)}@media (prefers-color-scheme: dark){.timeline-item-title{color:var(--text-standard, #f3f4f6)}.timeline-item-desc{color:var(--text-muted, #9ca3af)}.timeline-item-line{background-color:var(--text-secondary, #374151)}.timeline-item-dot{background:var(--bg-primary, #1f2937);border-color:var(--color-primary, #10b981);}.timeline-vertical .timeline-item-dot{background:var(--bg-primary, #1f2937)}.timeline-variant-panel .timeline-item-content{background:var(--bg-primary, #1f2937);border-color:var(--border-default, #374151)}.timeline-variant-panel .timeline-item-content::before{background:var(--bg-primary, #1f2937);border-color:var(--border-default, #374151)}.timeline-marker-number .timeline-item-dot,.timeline-item:has(.timeline-item-number) .timeline-item-dot{background:var(--bg-primary, #1f2937);border-color:var(--color-primary, #10b981)}}.timeline-wrapper{display:flex;flex-direction:column;gap:20px}.timeline-search-header{margin-bottom:24px;padding:0 4px}.timeline-search-input{width:100%;padding:10px 16px;border:1px solid var(--border-default, #e5e7eb);border-radius:8px;font-size:14px;outline:none;transition:all 0.2s ease;background:var(--bg-primary, #f9fafb)}.timeline-search-input:focus{border-color:var(--color-primary, #10b981);background:var(--bg-primary, #ffffff);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1)}.timeline-item-clickable{cursor:pointer}.timeline-item-clickable:hover{opacity:0.8}.timeline-item-clickable:hover .timeline-item-dot{transform:scale(1.3);box-shadow:0 0 0 6px rgba(var(--color-primary-rgb, 59, 130, 246), 0.15)}.timeline-item-pending .timeline-item-line{border-left:2px dashed var(--color-primary, #cbd5e1);background-color:transparent}.timeline-item-pending .dot-inner{background:var(--color-primary, #cbd5e1);animation:timeline-pulse-inner 1.5s infinite ease-in-out}@keyframes timeline-pulse-inner{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:0.5}}.timeline-item.is-active .timeline-item-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid currentColor;animation:timeline-pulse 2s infinite}.timeline-horizontal .timeline-item-pending .timeline-item-line{border-top:2px dashed var(--color-primary, #cbd5e1);background-color:transparent;height:0}.timeline-horizontal.timeline-align-alternate .timeline-item-pending .timeline-item-line{top:50%}:host{display:block;width:100%;--timeline-line-color:var(--color-primary, #10b981);--timeline-line-width:2px;--timeline-dot-size:12px;--timeline-dot-color:var(--color-primary, #10b981)}.timeline-container{position:relative;padding:20px 0;width:100%}.timeline-vertical{display:flex;flex-direction:column;gap:0}.timeline-vertical .timeline-item{position:relative;display:flex;align-items:center;min-height:80px;padding:0}.timeline-vertical .timeline-item .timeline-dot{position:relative;flex-shrink:0;z-index:2;display:flex;align-items:center;justify-content:center;border-radius:50%;border:3px solid var(--timeline-dot-color);background:var(--bg-primary, #ffffff);transition:all 0.3s ease}.timeline-vertical .timeline-item .timeline-dot i{font-size:calc(var(--timeline-dot-size) 0.8)}.timeline-vertical .timeline-item .timeline-line{position:absolute;left:calc(var(--timeline-dot-size));top:calc(var(--timeline-dot-size) + 3px);bottom:calc(-1 * var(--timeline-dot-size) - 3px);width:var(--timeline-line-width);background:var(--timeline-line-color);z-index:1}.timeline-vertical .timeline-item .timeline-content{flex:1;padding:0 24px;margin-top:4px}.timeline-vertical.timeline-align-left .timeline-item{flex-direction:row}.timeline-vertical.timeline-align-left .timeline-item .timeline-dot{margin-right:0}.timeline-vertical.timeline-align-left .timeline-item .timeline-line{left:calc(var(--timeline-dot-size));right:auto}.timeline-vertical.timeline-align-left .timeline-item .timeline-content{text-align:left;padding-left:24px;padding-right:0}.timeline-vertical.timeline-align-right .timeline-item{flex-direction:row-reverse}.timeline-vertical.timeline-align-right .timeline-item .timeline-dot{margin-left:0;margin-right:0}.timeline-vertical.timeline-align-right .timeline-item .timeline-line{left:auto;right:calc(var(--timeline-dot-size))}.timeline-vertical.timeline-align-right .timeline-item .timeline-content{text-align:right;padding-right:24px;padding-left:0}.timeline-vertical.timeline-align-center{display:flex;flex-direction:column;align-items:center}.timeline-vertical.timeline-align-center .timeline-item{width:50%;flex-direction:row;justify-content:flex-start}.timeline-vertical.timeline-align-center .timeline-item .timeline-dot{position:absolute;left:-12px;margin-right:0}.timeline-vertical.timeline-align-center .timeline-item .timeline-line{position:absolute;left:-2px;right:auto}.timeline-vertical.timeline-align-center .timeline-item .timeline-content{text-align:left;padding-left:24px;padding-right:0;margin-left:12px}.timeline-vertical.timeline-align-alternate{display:flex;flex-direction:column;align-items:center}.timeline-vertical.timeline-align-alternate .timeline-item{width:50%}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-dot{position:absolute}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-line{position:absolute}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-left{flex-direction:row-reverse;align-self:flex-start}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-left .timeline-dot{right:-12px;left:auto}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-left .timeline-content{text-align:right;padding-right:24px;padding-left:0;margin-right:12px}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-left .timeline-line{right:-2px;left:auto}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-right{flex-direction:row;align-self:flex-end}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-right .timeline-dot{left:-12px;right:auto}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-right .timeline-content{text-align:left;padding-left:24px;padding-right:0;margin-left:12px}.timeline-vertical.timeline-align-alternate .timeline-item.timeline-item-right .timeline-line{left:-2px;right:auto}.timeline-horizontal{display:flex;gap:0;overflow-x:auto;padding:40px 0;scrollbar-width:thin;scrollbar-color:var(--timeline-line-color) transparent}.timeline-horizontal::-webkit-scrollbar{height:6px}.timeline-horizontal::-webkit-scrollbar-track{background:transparent}.timeline-horizontal::-webkit-scrollbar-thumb{background-color:var(--timeline-line-color);border-radius:20px}.timeline-horizontal{scroll-snap-type:x mandatory}.timeline-horizontal .timeline-item{position:relative;display:flex;flex-direction:column;align-items:center;min-width:150px;padding:0;flex-shrink:0;scroll-snap-align:center}.timeline-horizontal .timeline-item .timeline-dot{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;border-radius:50%;border:3px solid var(--timeline-dot-color);background:var(--bg-primary, #ffffff);transition:all 0.3s ease}.timeline-horizontal .timeline-item .timeline-dot i{font-size:calc(var(--timeline-dot-size) * 0.8)}.timeline-horizontal .timeline-item .timeline-line{position:absolute;left:calc(var(--timeline-dot-size) * 2);right:calc(-100% + var(--timeline-dot-size) * 2);top:calc(var(--timeline-dot-size));height:var(--timeline-line-width);width:auto;background:var(--timeline-line-color);z-index:1}.timeline-horizontal .timeline-item .timeline-content{padding:16px 12px;max-width:200px}.timeline-horizontal.timeline-align-left .timeline-item,.timeline-horizontal.timeline-align-top .timeline-item{flex-direction:column-reverse}.timeline-horizontal.timeline-align-left .timeline-item .timeline-content,.timeline-horizontal.timeline-align-top .timeline-item .timeline-content{text-align:center}.timeline-horizontal.timeline-align-right .timeline-item .timeline-content,.timeline-horizontal.timeline-align-bottom .timeline-item .timeline-content{text-align:center}.timeline-horizontal.timeline-align-alternate .timeline-item.timeline-item-top{flex-direction:column-reverse}.timeline-horizontal.timeline-align-alternate .timeline-item .timeline-content{text-align:center}.timeline-content{background:var(--bg-primary, #ffffff);border-radius:8px;border:1px solid var(--border-default, #e5e7eb);box-shadow:0 1px 3px rgba(0, 0, 0, 0.1);transition:all 0.3s ease}.timeline-date{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12px;color:var(--text-secondary);font-weight:500}.timeline-date .timeline-date-text{color:var(--primary-color)}.timeline-date .timeline-time-text{color:var(--text-secondary)}.timeline-image{margin:-1px -1px 12px -1px;border-radius:8px 8px 0 0;overflow:hidden}.timeline-image img{width:100%;height:auto;display:block}.timeline-header{margin-bottom:8px}.timeline-title{margin:0;font-size:16px;font-weight:600;color:var(--text-primary, #111827);line-height:1.4}.timeline-description{margin:0;font-size:14px;color:var(--text-secondary);line-height:1.6}.timeline-custom{margin-top:12px}.timeline-badge{position:absolute;top:-6px;right:-6px;background:var(--color-danger, #ef4444);color:var(--text-standard, #ffffff);font-size:10px;font-weight:600;padding:2px 6px;border-radius:10px;min-width:18px;text-align:center}.timeline-variant-outlined .timeline-content{background:transparent;border:2px solid var(--border-default, #e5e7eb);box-shadow:none}.timeline-variant-filled .timeline-content{background:var(--bg-secondary, #f3f4f6);border:none;box-shadow:none}.timeline-variant-minimal .timeline-content{background:transparent;border:none;box-shadow:none;padding:8px 12px}.timeline-variant-minimal .timeline-dot{border-width:2px !important}.timeline-variant-dots-only .timeline-content{display:none}.timeline-variant-dots-only .timeline-dot{cursor:pointer}.timeline-variant-dots-only .timeline-dot:hover{transform:scale(1.2)}.timeline-compact.timeline-vertical .timeline-item{min-height:50px}.timeline-compact.timeline-vertical .timeline-item .timeline-content{padding:0 16px}.timeline-compact.timeline-horizontal .timeline-item{min-width:100px}.timeline-compact.timeline-horizontal .timeline-item .timeline-content{padding:8px;max-width:150px}.timeline-compact .timeline-content{padding:8px 12px}.timeline-compact .timeline-title{font-size:14px}.timeline-compact .timeline-description{font-size:12px}.timeline-item-clickable{cursor:pointer}.timeline-item-clickable .timeline-content:hover{box-shadow:0 4px 6px rgba(0, 0, 0, 0.15);transform:translateY(-2px);border-color:var(--timeline-dot-color)}.timeline-item-clickable.timeline-item-active .timeline-content{border-color:var(--timeline-dot-color);box-shadow:0 0 0 3px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1)}.timeline-item-clickable.timeline-item-active .timeline-dot{transform:scale(1.2);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.2)}.timeline-animated .timeline-item{opacity:0;transition:opacity 0.6s ease, transform 0.6s ease}.timeline-animated .timeline-item.timeline-item-visible{opacity:1}.timeline-animated.timeline-vertical .timeline-item{transform:translateX(-30px)}.timeline-animated.timeline-vertical .timeline-item.timeline-item-right{transform:translateX(30px)}.timeline-animated.timeline-vertical .timeline-item.timeline-item-visible{transform:translateX(0)}.timeline-animated.timeline-horizontal .timeline-item{transform:translateY(30px)}.timeline-animated.timeline-horizontal .timeline-item.timeline-item-top{transform:translateY(-30px)}.timeline-animated.timeline-horizontal .timeline-item.timeline-item-visible{transform:translateY(0)}.timeline-icon-top.timeline-vertical .timeline-item{align-items:flex-start}.timeline-icon-top.timeline-vertical .timeline-item .timeline-dot{margin-top:0}.timeline-icon-top.timeline-vertical .timeline-item .timeline-line{top:calc(var(--timeline-dot-size) + 3px)}.timeline-icon-top.timeline-horizontal.timeline-align-top .timeline-item .timeline-dot{align-self:flex-start}.timeline-icon-top.timeline-horizontal.timeline-align-bottom .timeline-item .timeline-dot{align-self:flex-start}.timeline-icon-center.timeline-vertical .timeline-item{align-items:center}.timeline-icon-center.timeline-vertical .timeline-item .timeline-dot{margin-top:0}.timeline-icon-center.timeline-vertical .timeline-item .timeline-line{top:50%;transform:translateY(calc(var(--timeline-dot-size) / 2 + 3px));bottom:calc(-50% - var(--timeline-dot-size) / 2 - 3px)}.timeline-icon-center.timeline-horizontal .timeline-item .timeline-dot{align-self:center}.timeline-icon-bottom.timeline-vertical .timeline-item{align-items:flex-start}.timeline-icon-bottom.timeline-vertical .timeline-item .timeline-dot{margin-top:auto;align-self:flex-end}.timeline-icon-bottom.timeline-vertical .timeline-item .timeline-line{top:auto;bottom:calc(-1 * var(--timeline-dot-size) - 3px);height:calc(100% - var(--timeline-dot-size) - 3px);transform:none}.timeline-icon-bottom.timeline-vertical.timeline-align-center .timeline-item .timeline-line{left:-2px;right:auto}.timeline-icon-bottom.timeline-vertical.timeline-align-alternate .timeline-item-left .timeline-line{right:-2px;left:auto}.timeline-icon-bottom.timeline-vertical.timeline-align-alternate .timeline-item-right .timeline-line{left:-2px;right:auto}.timeline-icon-bottom.timeline-horizontal.timeline-align-top .timeline-item .timeline-dot{align-self:flex-end}.timeline-icon-bottom.timeline-horizontal.timeline-align-bottom .timeline-item .timeline-dot{align-self:flex-end}@media (max-width: 768px){.timeline-horizontal{flex-direction:column;overflow-x:visible}.timeline-horizontal .timeline-item{min-width:100%;flex-direction:row;align-items:flex-start}.timeline-horizontal .timeline-item .timeline-line{left:calc(var(--timeline-dot-size));top:calc(var(--timeline-dot-size) * 2);bottom:calc(-100% + var(--timeline-dot-size) * 2);right:auto;width:var(--timeline-line-width);height:auto}.timeline-horizontal .timeline-item .timeline-content{padding:0 24px;max-width:none;text-align:left !important}.timeline-vertical.timeline-align-alternate,.timeline-vertical.timeline-align-center{padding-left:0}.timeline-vertical.timeline-align-alternate .timeline-item,.timeline-vertical.timeline-align-center .timeline-item{flex-direction:row !important;transform:none !important;padding-right:0 !important}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-content,.timeline-vertical.timeline-align-center .timeline-item .timeline-content{text-align:left !important}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-line,.timeline-vertical.timeline-align-center .timeline-item .timeline-line{left:calc(var(--timeline-dot-size)) !important;right:auto !important}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:flex-start;min-height:80px;width:100%;position:relative}}@media (max-width: 768px) and (max-width: 768px){.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item{display:flex;flex-direction:column;padding-left:30px}}@media (max-width: 768px){.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-side,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-side{min-width:0;display:flex;flex-direction:column;justify-content:center}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-side.timeline-side-left,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-side.timeline-side-left{align-items:flex-end;text-align:right}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-side.timeline-side-right,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-side.timeline-side-right{align-items:flex-start;text-align:left}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-separator,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-separator{display:flex;flex-direction:column;align-items:center;position:relative;height:100%;min-width:24px}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-separator .timeline-line-vertical,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-separator .timeline-line-vertical{position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:var(--timeline-line-width);background-color:var(--timeline-line-color);z-index:0}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-separator .timeline-marker,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-separator .timeline-marker{position:relative;z-index:1;margin-top:4px}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-opposite-date,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-opposite-date{font-size:0.9rem;color:var(--text-secondary);font-weight:500;padding:6px 16px;border-radius:20px;background:rgba(0, 0, 0, 0.03);margin:10px 0;display:inline-block;transition:all 0.3s ease}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-balanced-item .timeline-opposite-date:hover,.timeline-vertical.timeline-align-center .timeline-item .timeline-balanced-item .timeline-opposite-date:hover{background:rgba(0, 0, 0, 0.06);transform:translateY(-2px)}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-icon-center .timeline-balanced-item,.timeline-vertical.timeline-align-center .timeline-item .timeline-icon-center .timeline-balanced-item{align-items:center}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-icon-center .timeline-balanced-item .timeline-separator .timeline-marker,.timeline-vertical.timeline-align-center .timeline-item .timeline-icon-center .timeline-balanced-item .timeline-separator .timeline-marker{margin-top:0}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-icon-bottom .timeline-balanced-item,.timeline-vertical.timeline-align-center .timeline-item .timeline-icon-bottom .timeline-balanced-item{align-items:flex-end}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-icon-bottom .timeline-balanced-item .timeline-separator .timeline-marker,.timeline-vertical.timeline-align-center .timeline-item .timeline-icon-bottom .timeline-balanced-item .timeline-separator .timeline-marker{margin-top:auto;margin-bottom:4px}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-left,.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-right,.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-separator,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-left,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-right,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-separator{opacity:0;transition:all 0.6s ease}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-left,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-left{transform:translateX(-20px)}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-right,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-side-right{transform:translateX(20px)}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item .timeline-separator,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item .timeline-separator{transform:scale(0.5)}.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-side-left,.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-side-right,.timeline-vertical.timeline-align-alternate .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-separator,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-side-left,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-side-right,.timeline-vertical.timeline-align-center .timeline-item .timeline-animated .timeline-balanced-item.timeline-item-visible .timeline-separator{opacity:1;transform:none}}.timeline-snake-container{display:flex;flex-direction:column;gap:40px;width:100%}.timeline-snake-row{display:flex;width:100%;position:relative}.timeline-snake-row.timeline-snake-row-odd{flex-direction:row-reverse}.timeline-snake-row.timeline-snake-row-odd .timeline-item .timeline-snake-turn{right:auto;left:0;border-right:none;border-left:2px solid var(--timeline-line-color);border-radius:0 0 0 16px}.timeline-snake-item{flex:0 0 10%;display:flex;flex-direction:column;align-items:center;position:relative;min-width:0;padding:0 10px}.timeline-snake-item .timeline-content{margin-top:12px;text-align:center;font-size:0.85rem;padding:8px;width:100%}.timeline-snake-item .timeline-dot{z-index:2}.timeline-snake-item .timeline-line-horizontal{position:absolute;top:calc(var(--timeline-dot-size) + 1px);top:calc(var(--timeline-dot-size));left:50%;width:100%;height:var(--timeline-line-width);background-color:var(--timeline-line-color);z-index:1}.timeline-snake-item .timeline-snake-turn{position:absolute;top:calc(var(--timeline-dot-size));right:0;width:50%;height:calc(100% + 40px);border-top:var(--timeline-line-width) solid var(--timeline-line-color);border-right:var(--timeline-line-width) solid var(--timeline-line-color);border-radius:0 50px 50px 0;z-index:1;pointer-events:none;opacity:0.8}.timeline-snake-row.timeline-snake-row-odd .timeline-item .timeline-snake-turn{border-radius:0 0 0 50px}:host-context([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-line,:host([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-line{left:auto;right:5px}:host-context([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-dot,:host([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-dot{left:auto;right:0}:host-context([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-details,:host([dir=rtl]) .timeline-align-left.timeline-vertical .timeline-item-details{padding-left:0;padding-right:48px;text-align:right;align-items:flex-end}:host-context([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item,:host([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item{flex-direction:row}:host-context([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-line,:host([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-line{right:auto;left:5px}:host-context([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-dot,:host([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-dot{right:auto;left:0}:host-context([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-details,:host([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item-details{padding-right:0;padding-left:48px;text-align:left;align-items:flex-start}:host-context([dir=rtl]) .timeline-align-alternate.timeline-vertical .side-left .timeline-item-details,:host([dir=rtl]) .timeline-align-alternate.timeline-vertical .side-left .timeline-item-details{padding-right:0;padding-left:48px;text-align:left;align-items:flex-start;margin-left:50%;margin-right:0}:host-context([dir=rtl]) .timeline-align-alternate.timeline-vertical .side-right .timeline-item-details,:host([dir=rtl]) .timeline-align-alternate.timeline-vertical .side-right .timeline-item-details{padding-left:0;padding-right:48px;text-align:right;align-items:flex-end;margin-left:0;margin-right:0;width:50%}:host-context([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot,:host([dir=rtl]) .timeline-align-right.timeline-vertical .timeline-item:has(.timeline-item-icon) .timeline-item-dot{right:auto;left:-6px}.timeline-container.timeline-vertical{--timeline-marker-visual-size:var(--timeline-dot-size);--timeline-connector-mask-bg:var(--bg-primary, #ffffff)}.timeline-container.timeline-vertical .timeline-item:has(.timeline-item-icon),.timeline-container.timeline-vertical .timeline-item:has(.timeline-item-image){--timeline-marker-visual-size:max(var(--timeline-dot-size), 24px)}.timeline-container.timeline-vertical.timeline-marker-number .timeline-item,.timeline-container.timeline-vertical .timeline-item:has(.timeline-item-number){--timeline-marker-visual-size:max(var(--timeline-dot-size), 32px)}.timeline-container.timeline-vertical .timeline-item-divider{position:relative;display:flex;align-items:center;justify-content:center;align-self:stretch;flex-shrink:0;width:max(var(--timeline-marker-visual-size), 32px);min-width:max(var(--timeline-marker-visual-size), 32px)}.timeline-container.timeline-vertical .timeline-item-divider .timeline-item-line{left:50% !important;right:auto !important;top:0;bottom:0;transform:translateX(-50%) !important}.timeline-container.timeline-vertical .timeline-item-divider .timeline-item-dot{position:relative;left:auto !important;right:auto !important;top:auto !important;transform:none !important;margin:0}.timeline-container.timeline-vertical .timeline-item:first-child .timeline-item-divider::before,.timeline-container.timeline-vertical .timeline-item:last-child .timeline-item-divider::after{content:"";position:absolute;left:50%;transform:translateX(-50%);width:calc(var(--timeline-line-width) + 4px);background:var(--timeline-connector-mask-bg);z-index:1;pointer-events:none}.timeline-container.timeline-vertical .timeline-item:first-child .timeline-item-divider::before{top:0;height:calc(50% - var(--timeline-marker-visual-size) / 2)}.timeline-container.timeline-vertical .timeline-item:last-child .timeline-item-divider::after{bottom:0;height:calc(50% - var(--timeline-marker-visual-size) / 2)}@media (prefers-color-scheme: dark){.timeline-item-content,.timeline-content{background:var(--bg-primary, #111827);border-color:rgba(148, 163, 184, 0.3);box-shadow:0 0 0 1px rgba(148, 163, 184, 0.12), 0 10px 28px rgba(2, 6, 23, 0.45)}.timeline-variant-panel .timeline-item-content,.timeline-variant-panel .timeline-content{background:linear-gradient(180deg, rgba(30, 41, 59, 0.96) 0%, rgba(15, 23, 42, 0.98) 100%);border-color:rgba(148, 163, 184, 0.36);box-shadow:0 0 0 1px rgba(148, 163, 184, 0.14), 0 14px 36px rgba(2, 6, 23, 0.5)}.timeline-variant-panel .timeline-item-content::before{background:rgba(30, 41, 59, 0.96);border-color:rgba(148, 163, 184, 0.32)}.timeline-variant-outlined .timeline-content,.timeline-variant-outlined .timeline-item-content{background:rgba(15, 23, 42, 0.42);border-color:rgba(148, 163, 184, 0.42);box-shadow:0 0 0 1px rgba(148, 163, 184, 0.1), 0 8px 24px rgba(2, 6, 23, 0.34)}.timeline-variant-filled .timeline-content,.timeline-variant-filled .timeline-item-content{background:rgba(30, 41, 59, 0.92);box-shadow:0 0 0 1px rgba(148, 163, 184, 0.08), 0 10px 24px rgba(2, 6, 23, 0.35)}.timeline-item:hover .timeline-item-content,.timeline-item:hover .timeline-content,.timeline-item-clickable:hover .timeline-item-content,.timeline-item-clickable:hover .timeline-content,.timeline-variant-panel .timeline-item:hover .timeline-item-content,.timeline-variant-panel .timeline-item:hover .timeline-content{border-color:rgba(96, 165, 250, 0.45);box-shadow:0 0 0 1px rgba(96, 165, 250, 0.2), 0 18px 42px rgba(2, 6, 23, 0.56)}.timeline-item-title:hover,.timeline-item-desc:hover{background:rgba(15, 23, 42, 0.92)}}.timeline-container.timeline-vertical .timeline-item:last-child .timeline-item-divider .timeline-item-line{display:block}.timeline-container.timeline-vertical.timeline-align-alternate .timeline-item{display:grid;grid-template-columns:minmax(0, 1fr) max(var(--timeline-marker-visual-size), 32px) minmax(0, 1fr);align-items:center;width:100%}.timeline-container.timeline-vertical.timeline-align-alternate .timeline-item .timeline-side-left,.timeline-container.timeline-vertical.timeline-align-alternate .timeline-item .timeline-item-details{min-width:0}.timeline-container.timeline-vertical.timeline-align-alternate .timeline-item .timeline-item-divider{grid-column:2;justify-self:center}.timeline-container.timeline-vertical.timeline-align-alternate .timeline-item.side-right .timeline-side-left{grid-column:1;padding-right:24px;padding-left:0;align-items:flex-end;text-align:right}.timeline-container.timeline-vertical.timeline-align-alternate .timeline-item.side-right .timeline-item-details{grid-column:3;padding-left:24px;padding-right:0;align-items:flex-start;text-align:left}.timeline-container.timeline-vertical.timeline-align-alternate .timeline-item.side-left .timeline-item-details{grid-column:1;padding-right:24px;padding-left:0;align-items:flex-end;text-align:right}.timeline-container.timeline-vertical.timeline-align-alternate .timeline-item.side-left .timeline-side-left{grid-column:3;padding-left:24px;padding-right:0;align-items:flex-start;text-align:left}'}},[513,"ui-timeline",{events:[1],flow:[1],mode:[1],align:[1],theme:[16],multiline:[4],columns:[2],variant:[1],marker:[1],clickable:[4],reverse:[4],pending:[4],searchable:[4],lineColor:[1,"line-color"],lineWidth:[2,"line-width"],dotSize:[2,"dot-size"],dotColor:[1,"dot-color"],showLine:[4,"show-line"],showDots:[4,"show-dots"],animateOnScroll:[4,"animate-on-scroll"],compact:[4],wrap:[4],showDates:[4,"show-dates"],dateFormat:[1,"date-format"],iconPosition:[1,"icon-position"],normalizedEvents:[32],activeItemId:[32],visibleItems:[32],searchQuery:[32],isRtl:[32],isMobile:[32]},void 0,{events:[{normalizeEvents:0}]}]),g=p,h=function(){"undefined"!=typeof customElements&&["ui-timeline","ui-badge","ui-button","ui-icon","ui-input","ui-loader"].forEach((e=>{switch(e){case"ui-timeline":customElements.get(m(e))\|\|customElements.define(m(e),p);break;case"ui-badge":customElements.get(m(e))\|\|o();break;case"ui-button":customElements.get(m(e))\|\|d();break;case"ui-icon":customElements.get(m(e))\|\|r();break;case"ui-input":customElements.get(m(e))\|\|s();break;case"ui-loader":customElements.get(m(e))\|\|c()}}))};export{g as UiTimeline,h as defineCustomElement}

package/dist/components/ui-timer.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{proxyCustomElement as t,HTMLElement as i,createEvent as e,h as s,Host as r,transformTag as o}from"@stencil/core/internal/client";import{d as a,a as n}from"./badge.js";import{d as h}from"./icon.js";import{d as l}from"./loader.js";const c=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.timerTick=e(this,"timerTick",7),this.timerStart=e(this,"timerStart",7),this.timerPause=e(this,"timerPause",7),this.timerComplete=e(this,"timerComplete",7),this.timerAllComplete=e(this,"timerAllComplete",7),this.timerLap=e(this,"timerLap",7),this.timerNext=e(this,"timerNext",7),this.timerPrev=e(this,"timerPrev",7),this.timerGoTo=e(this,"timerGoTo",7)}get el(){return this}steps=[];normalizedSteps=[];isNarrow=!1;flow="linear";mode="countdown";activeStep=0;theme;autoStart=!1;loop=!1;precision="seconds";variant="full";alertThreshold=10;targetDate;persist;progressType="circular";format="default";useShadow=!0;collapse=!1;enableNotifications=!1;enableSound=!1;notificationTitle="Timer Complete";notificationBody="{{label}} phase finished.";duration=0;currentTime=0;isRunning=!1;totalDuration=0;laps=[];isAlerting=!1;activeStepColor;normalizedTheme={};timerInterval;collapseBreakpoint=640;timerTick;timerStart;timerPause;timerComplete;timerAllComplete;timerLap;timerNext;timerPrev;timerGoTo;normalizeSteps(t){if("string"==typeof t)try{this.normalizedSteps=JSON.parse(t)}catch{this.normalizedSteps=[]}else this.normalizedSteps=t\|\|[];this.initStep()}watchDuration(t){0===this.normalizedSteps.length&&(this.totalDuration=t,this.currentTime="milliseconds"===this.precision?1e3t:t)}normalizeTheme(t){if("string"==typeof t)try{this.normalizedTheme=JSON.parse(t)}catch{this.normalizedTheme={}}else this.normalizedTheme=t\|\|{}}componentWillLoad(){this.normalizeSteps(this.steps),this.normalizeTheme(this.theme),this.loadPersistedState(),this.initTargetDate(),this.initNotifications(),this.updateResponsiveState(),this.duration>0&&0===this.normalizedSteps.length&&(this.totalDuration=this.duration,this.currentTime="milliseconds"===this.precision?1e3this.duration:this.duration)}handleWindowResize(){this.updateResponsiveState()}updateResponsiveState(){"undefined"!=typeof window&&(this.isNarrow=window.innerWidth<=this.collapseBreakpoint)}initNotifications(){this.enableNotifications&&"Notification"in window&&Notification.requestPermission()}initTargetDate(){if(this.targetDate){const t=new Date(this.targetDate).getTime(),i=Date.now(),e=Math.max(0,Math.floor((t-i)/1e3));this.mode="countdown",this.normalizedSteps=[{label:"Countdown",duration:e}],this.initStep(),this.start()}}loadPersistedState(){if(!this.persist)return;const t=localStorage.getItem("ui-timer-"+this.persist);if(t)try{const i=JSON.parse(t);this.activeStep=i.activeStep,this.currentTime=i.currentTime,i.wasRunning&&this.start()}catch(t){console.warn("Failed to load persisted timer state")}}savePersistedState(){this.persist&&localStorage.setItem("ui-timer-"+this.persist,JSON.stringify({activeStep:this.activeStep,currentTime:this.currentTime,wasRunning:this.isRunning,timestamp:Date.now()}))}componentDidLoad(){this.autoStart&&this.start()}disconnectedCallback(){this.isRunning=!1,this.stopInterval()}initStep(){const t=this.normalizedSteps[this.activeStep],i=t?.duration\|\|0;this.totalDuration=i,this.laps=[],this.isAlerting=!1,this.activeStepColor=t?.color,this.currentTime="stopwatch"===this.mode?0:"milliseconds"===this.precision?1e3i:i}playSound(t){if(this.enableSound)try{const i=new(window.AudioContext\|\|window.webkitAudioContext),e=i.createOscillator(),s=i.createGain();e.connect(s),s.connect(i.destination),"tick"===t?(e.frequency.setValueAtTime(800,i.currentTime),s.gain.setValueAtTime(.1,i.currentTime),s.gain.exponentialRampToValueAtTime(.01,i.currentTime+.1),e.start(),e.stop(i.currentTime+.1)):(e.type="sine",e.frequency.setValueAtTime(440,i.currentTime),e.frequency.exponentialRampToValueAtTime(880,i.currentTime+.2),s.gain.setValueAtTime(.2,i.currentTime),s.gain.exponentialRampToValueAtTime(.01,i.currentTime+.5),e.start(),e.stop(i.currentTime+.5))}catch(t){console.warn("Audio feedback failed")}}notify(t,i,e){if(this.enableNotifications&&"Notification"in window&&"granted"===Notification.permission){const s=t.replace("{{label}}",e),r=i.replace("{{label}}",e);new Notification(s,{body:r})}}stopInterval(){this.timerInterval&&(clearTimeout(this.timerInterval),this.timerInterval=null)}emitStepEvent(t,i){const e=this.normalizedSteps[i];if(!e)return;const s={index:i,step:e};"next"===t?this.timerNext.emit(s):"prev"===t?this.timerPrev.emit(s):this.timerGoTo.emit(s)}async start(){if(this.isRunning)return;this.isRunning=!0,this.timerStart.emit({stepIndex:this.activeStep});const t="milliseconds"===this.precision?10:1e3,i="milliseconds"===this.precision?10:1;let e=performance.now()+t;const s=()=>{if(!this.isRunning)return;const r=performance.now()-e;if("countdown"===this.mode){if(!(this.currentTime>0))return this.playSound("complete"),void this.handleStepComplete();this.currentTime-=i,this.checkAlert(),this.timerTick.emit({remaining:this.currentTime,stepIndex:this.activeStep,mode:this.mode}),this.savePersistedState(),this.currentTime>0&&this.currentTime<=3&&"seconds"===this.precision&&this.playSound("tick")}else{this.currentTime+=i,this.timerTick.emit({remaining:this.currentTime,stepIndex:this.activeStep,mode:this.mode}),this.savePersistedState();const t="milliseconds"===this.precision?1e3this.totalDuration:this.totalDuration;if(t>0&&this.currentTime>=t)return void this.handleStepComplete()}e+=t,this.timerInterval=setTimeout(s,Math.max(0,t-r))};this.timerInterval=setTimeout(s,t)}async pause(){this.isRunning=!1,this.timerInterval&&clearTimeout(this.timerInterval),this.timerInterval=null,this.timerPause.emit({stepIndex:this.activeStep})}async reset(){this.pause(),this.initStep()}async next(){this.activeStep>=this.normalizedSteps.length-1\|\|(this.pause(),this.activeStep++,this.initStep(),this.autoStart&&await this.start(),this.emitStepEvent("next",this.activeStep))}async prev(){this.activeStep<=0\|\|(this.pause(),this.activeStep--,this.initStep(),this.autoStart&&await this.start(),this.emitStepEvent("prev",this.activeStep))}async goTo(t){t<0\|\|t>=this.normalizedSteps.length\|\|t===this.activeStep\|\|(this.pause(),this.activeStep=t,this.initStep(),this.autoStart&&await this.start(),this.emitStepEvent("goto",this.activeStep))}async lap(){"stopwatch"===this.mode&&(this.laps=[...this.laps,this.currentTime],this.timerLap.emit({time:this.currentTime,lapIndex:this.laps.length-1}))}handleKeyDown(t){document.activeElement===this.el&&("Space"===t.code?(t.preventDefault(),this.isRunning?this.pause():this.start()):"KeyR"===t.code?this.reset():"KeyL"===t.code?this.lap():"KeyN"===t.code?this.next():"KeyP"===t.code&&this.prev())}checkAlert(){this.isAlerting="countdown"===this.mode&&0!==this.totalDuration&&("milliseconds"===this.precision?this.currentTime/1e3:this.currentTime)/this.totalDuration100<=this.alertThreshold}handleStepComplete(){this.stopInterval(),this.isRunning=!1,this.timerComplete.emit({stepIndex:this.activeStep}),this.notify(this.notificationTitle,this.notificationBody,this.normalizedSteps[this.activeStep]?.label\|\|"Timer"),this.activeStep<this.normalizedSteps.length-1?(this.activeStep++,this.initStep(),this.start(),this.emitStepEvent("next",this.activeStep)):(this.timerAllComplete.emit(),this.loop&&(this.activeStep=0,this.initStep(),this.start(),this.emitStepEvent("next",this.activeStep)))}calculateOffset(){if(0===this.totalDuration)return"stopwatch"===this.mode?0:283;const t="milliseconds"===this.precision?this.currentTime/1e3:this.currentTime;let i=0;return i="countdown"===this.mode?(this.totalDuration-t)/this.totalDuration:t/this.totalDuration,i=Math.max(0,Math.min(1,i)),283-283i}formatTime(t){const i="milliseconds"===this.precision;let e=i?Math.floor(t/1e3):t,s=i?Math.floor(t%1e3/10):0;if("human"===this.format){const t=Math.floor(e/60),i=e%60;return t>0?`${t}m ${i}s`:i+"s"}if("simple"===this.format)return""+e;const r=Math.floor(e/86400),o=Math.floor(e%86400/3600),a=Math.floor(e%3600/60),n=e%60;let h="";return h=r>0?`${r}d ${o}:${a<10?"0":""}${a}:${n<10?"0":""}${n}`:o>0?`${o}:${a<10?"0":""}${a}:${n<10?"0":""}${n}`:`${a}:${n<10?"0":""}${n}`,i&&(h+=`.${s<10?"0":""}${s}`),h}render(){return s(r,{key:"1d8f1a154864e347f0458302b6684857981d54d0",class:{"timer-has-shadow":this.useShadow,"timer-no-shadow":!this.useShadow,"timer-collapsed":this.collapse&&this.isNarrow}},"compact"===this.variant\|\|this.collapse&&this.isNarrow?this.renderCompact():this.renderFull())}renderFull(){const t={...this.normalizedTheme,...this.activeStepColor?{"--timer-primary-color":this.activeStepColor}:{}};return s("div",{class:{"timer-container":!0,"timer-alert":this.isAlerting},style:t},s("div",{class:"timer-steps"},this.normalizedSteps.map(((t,i)=>s("div",{class:{"timer-step":!0,"timer-step-active":i===this.activeStep,"timer-step-completed":i<this.activeStep}},s("div",{class:"timer-step-header"},s("span",{class:"timer-step-index"},i+1),s("span",{class:"timer-step-label"},t.label)))))),s("div",{class:"timer-display"},"circular"===this.progressType?s("svg",{class:"timer-progress-svg",viewBox:"0 0 100 100"},s("circle",{class:"timer-progress-bg",cx:"50",cy:"50",r:"45"}),s("circle",{class:"timer-progress-bar",cx:"50",cy:"50",r:"45",style:{"stroke-dashoffset":""+this.calculateOffset()}})):s("div",{class:"timer-progress-linear"},s("div",{class:"timer-progress-linear-bg"}),s("div",{class:"timer-progress-linear-bar",style:{width:100*(1-this.calculateOffset()/283)+"%"}})),s("div",{class:"timer-time-text"},s("slot",{name:"content"},this.formatTime(this.currentTime)))),s("div",{class:"timer-controls"},s("ui-button",{variant:"primary",onClick:()=>this.isRunning?this.pause():this.start(),label:this.isRunning?"Pause":"Start"}),"stopwatch"===this.mode&&s("ui-button",{variant:"secondary",onClick:()=>this.lap(),label:"Lap"}),s("ui-button",{variant:"secondary",onClick:()=>this.reset(),label:"Reset"}),s("ui-button",{variant:"outline",onClick:()=>this.next(),label:"Skip"})),this.laps.length>0&&s("div",{class:"timer-laps"},s("div",{class:"timer-laps-title"},"Laps"),s("div",{class:"timer-laps-list"},this.laps.map(((t,i)=>s("div",{class:"timer-lap-item"},s("span",null,"Lap ",i+1),s("span",{class:"timer-lap-time"},this.formatTime(t))))))))}renderCompact(){return s("div",{class:{"timer-container-compact":!0,"timer-alert":this.isAlerting},style:this.normalizedTheme},s("div",{class:"timer-time-text-compact"},this.formatTime(this.currentTime)),s("div",{class:"timer-controls-compact"},s("ui-button",{variant:"ghost",iconOnly:!0,size:"sm",onClick:()=>this.isRunning?this.pause():this.start(),icon:this.isRunning?"pause":"play",iconLibrary:"lucide",iconSize:"1.2em",ariaLabel:this.isRunning?"Pause":"Start"}),s("ui-button",{variant:"ghost",iconOnly:!0,size:"sm",onClick:()=>this.reset(),icon:"rotate-cw",iconLibrary:"lucide",iconSize:"1.2em",ariaLabel:"Reset"}),"stopwatch"===this.mode&&s("ui-button",{variant:"ghost",iconOnly:!0,size:"sm",onClick:()=>this.lap(),icon:"flag",iconLibrary:"lucide",iconSize:"1.2em",ariaLabel:"Lap"})))}static get watchers(){return{steps:[{normalizeSteps:0}],duration:[{watchDuration:0}],theme:[{normalizeTheme: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}.timer-container{display:flex;flex-direction:column;gap:24px;padding:24px;background:var(--bg-primary, #ffffff);border-radius:12px;box-shadow:0 4px 12px rgba(0, 0, 0, 0.05);font-family:inherit;align-items:center;outline:none}.timer-container:focus{box-shadow:0 0 0 3px rgba(var(--color-success-rgb, 16, 185, 129), 0.5)}:host(.timer-no-shadow) .timer-container,:host(.timer-no-shadow) .timer-container-compact{box-shadow:none}:host(.timer-collapsed) .timer-steps,:host(.timer-collapsed) .timer-laps{display:none}:host(.timer-collapsed) .timer-container{padding:16px;gap:16px;align-items:stretch}:host(.timer-collapsed) .timer-controls{justify-content:center;flex-wrap:wrap}:host(.timer-collapsed) .timer-display{width:160px;height:160px}.timer-steps{display:flex;gap:12px;width:100%;justify-content:center}.timer-step{flex:1;max-width:120px;display:flex;flex-direction:column;gap:8px;opacity:0.5;transition:opacity 0.3s}.timer-step-active{opacity:1}.timer-step-completed{opacity:0.8}.timer-step-header{display:flex;align-items:center;gap:8px}.timer-step-index{width:24px;height:24px;border-radius:50%;background:var(--bg-primary, #e5e7eb);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}.timer-step-active .timer-step-index{background:var(--color-success, #10b981);color:var(--text-standard, #ffffff)}.timer-step-completed .timer-step-index{background:var(--color-success-hover, #059669);color:var(--text-standard, #ffffff)}.timer-step-label{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.timer-display{position:relative;width:200px;height:200px;display:flex;align-items:center;justify-content:center}.timer-progress-svg{width:100%;height:100%;transform:rotate(-90deg)}.timer-progress-bg{fill:none;stroke:var(--text-standard, #f3f4f6);stroke-width:8}.timer-progress-bar{fill:none;stroke:var(--color-success, #10b981);stroke-width:8;stroke-linecap:round;stroke-dasharray:283;transition:stroke-dashoffset 0.3s linear}.timer-time-text{position:absolute;font-size:var(--timer-time-font-size, 42px);font-weight:700;color:var(--color-primary, #064e3b);font-family:monospace;max-width:140px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.2}.timer-controls{display:flex;gap:12px}.timer-btn{padding:10px 24px;border:none;border-radius:8px;background:var(--color-success, #10b981);color:var(--text-standard, #ffffff);font-weight:600;cursor:pointer;transition:background 0.2s}.timer-btn:hover{background:var(--color-success-hover, #059669)}.timer-btn-secondary{background:var(--bg-secondary, #f3f4f6);color:var(--text-secondary, #374151)}.timer-btn-secondary:hover{background:var(--bg-primary, #e5e7eb)}.timer-progress-linear{position:absolute;bottom:0;left:0;width:100%;height:4px;background:var(--bg-secondary, #f3f4f6);overflow:hidden}.timer-progress-linear-bar{height:100%;background:var(--timer-primary-color, var(--color-success, #10b981));transition:width 0.3s linear}.timer-display:has(.timer-progress-linear){height:60px;}@keyframes timer-pulse{0%{transform:scale(1);box-shadow:0 4px 12px rgba(var(--color-danger-rgb, 239, 68, 68), 0.1)}50%{transform:scale(1.02);box-shadow:0 4px 24px rgba(var(--color-danger-rgb, 239, 68, 68), 0.3)}100%{transform:scale(1);box-shadow:0 4px 12px rgba(var(--color-danger-rgb, 239, 68, 68), 0.1)}}.timer-alert{border:2px solid var(--color-danger, #ef4444);animation:timer-pulse 1.5s infinite ease-in-out}.timer-alert .timer-time-text{color:var(--color-danger, #ef4444)}.timer-alert .timer-progress-bar{stroke:var(--color-danger, #ef4444)}.timer-container-compact{display:inline-flex;align-items:center;gap:16px;padding:12px 20px;background:var(--bg-primary, #ffffff);border-radius:9999px;box-shadow:0 2px 8px rgba(0, 0, 0, 0.05);border:1px solid var(--border-default, #e5e7eb)}.timer-time-text-compact{font-size:20px;font-weight:700;font-family:monospace;min-width:80px}.timer-controls-compact{display:flex;gap:8px}.timer-btn-icon{background:transparent;border:none;cursor:pointer;font-size:16px;padding:4px;border-radius:50%;transition:background 0.2s;display:flex;align-items:center;justify-content:center}.timer-btn-icon:hover{background:var(--bg-secondary, #f3f4f6)}.timer-laps{width:100%;margin-top:24px;border-top:1px solid var(--border-subtle, #f3f4f6);padding-top:16px}.timer-laps-title{font-size:14px;font-weight:600;color:var(--text-muted, #6b7280);margin-bottom:12px}.timer-laps-list{max-height:150px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.timer-lap-item{display:flex;justify-content:space-between;font-size:13px;color:var(--text-secondary, #374151);padding:8px 12px;background:var(--bg-primary, #f9fafb);border-radius:6px}.timer-lap-time{font-family:monospace;font-weight:600}@media (prefers-color-scheme: dark){.timer-container{background:var(--bg-primary, #1f2937);box-shadow:0 4px 12px rgba(0, 0, 0, 0.2)}.timer-container-compact{background:var(--bg-primary, #1f2937);border-color:var(--border-default, #374151)}.timer-time-text{color:var(--text-standard, #ffffff)}.timer-step-index{background:var(--color-primary, #374151);color:var(--text-muted, #9ca3af)}.timer-progress-bg{stroke:var(--text-secondary, var(--border-default, #374151))}.timer-btn-secondary{background:var(--color-primary, #374151);color:var(--text-standard, #ffffff)}.timer-lap-item{background:var(--bg-secondary, #111827);color:var(--text-standard, #ffffff)}.timer-btn-icon:hover{background:var(--color-primary, #374151)}}"}},[769,"ui-timer",{steps:[1],flow:[1],mode:[1],activeStep:[1026,"active-step"],theme:[16],autoStart:[4,"auto-start"],loop:[4],precision:[1],variant:[1],alertThreshold:[2,"alert-threshold"],targetDate:[1,"target-date"],persist:[1],progressType:[1,"progress-type"],format:[1],useShadow:[516,"use-shadow"],collapse:[516],enableNotifications:[4,"enable-notifications"],enableSound:[4,"enable-sound"],notificationTitle:[1,"notification-title"],notificationBody:[1,"notification-body"],duration:[2],normalizedSteps:[32],isNarrow:[32],currentTime:[32],isRunning:[32],totalDuration:[32],laps:[32],isAlerting:[32],activeStepColor:[32],normalizedTheme:[32],start:[64],pause:[64],reset:[64],next:[64],prev:[64],goTo:[64],lap:[64]},[[9,"resize","handleWindowResize"],[8,"keydown","handleKeyDown"]],{steps:[{normalizeSteps:0}],duration:[{watchDuration:0}],theme:[{normalizeTheme:0}]}]),p=c,d=function(){"undefined"!=typeof customElements&&["ui-timer","ui-badge","ui-button","ui-icon","ui-loader"].forEach((t=>{switch(t){case"ui-timer":customElements.get(o(t))\|\|customElements.define(o(t),c);break;case"ui-badge":customElements.get(o(t))\|\|n();break;case"ui-button":customElements.get(o(t))\|\|a();break;case"ui-icon":customElements.get(o(t))\|\|h();break;case"ui-loader":customElements.get(o(t))\|\|l()}}))};export{p as UiTimer,d as defineCustomElement}
1	+ import{proxyCustomElement as t,HTMLElement as i,createEvent as e,h as s,Host as r,transformTag as o}from"@stencil/core/internal/client";import{d as a}from"./badge.js";import{d as n}from"./button.js";import{d as h}from"./icon.js";import{d as c}from"./loader.js";const l=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.timerTick=e(this,"timerTick",7),this.timerStart=e(this,"timerStart",7),this.timerPause=e(this,"timerPause",7),this.timerComplete=e(this,"timerComplete",7),this.timerAllComplete=e(this,"timerAllComplete",7),this.timerLap=e(this,"timerLap",7),this.timerNext=e(this,"timerNext",7),this.timerPrev=e(this,"timerPrev",7),this.timerGoTo=e(this,"timerGoTo",7)}get el(){return this}steps=[];normalizedSteps=[];isNarrow=!1;flow="linear";mode="countdown";activeStep=0;theme;autoStart=!1;loop=!1;precision="seconds";variant="full";alertThreshold=10;targetDate;persist;progressType="circular";format="default";useShadow=!0;collapse=!1;enableNotifications=!1;enableSound=!1;notificationTitle="Timer Complete";notificationBody="{{label}} phase finished.";duration=0;currentTime=0;isRunning=!1;totalDuration=0;laps=[];isAlerting=!1;activeStepColor;normalizedTheme={};timerInterval;collapseBreakpoint=640;timerTick;timerStart;timerPause;timerComplete;timerAllComplete;timerLap;timerNext;timerPrev;timerGoTo;normalizeSteps(t){if("string"==typeof t)try{this.normalizedSteps=JSON.parse(t)}catch{this.normalizedSteps=[]}else this.normalizedSteps=t\|\|[];this.initStep()}watchDuration(t){0===this.normalizedSteps.length&&(this.totalDuration=t,this.currentTime="milliseconds"===this.precision?1e3t:t)}normalizeTheme(t){if("string"==typeof t)try{this.normalizedTheme=JSON.parse(t)}catch{this.normalizedTheme={}}else this.normalizedTheme=t\|\|{}}componentWillLoad(){this.normalizeSteps(this.steps),this.normalizeTheme(this.theme),this.loadPersistedState(),this.initTargetDate(),this.initNotifications(),this.updateResponsiveState(),this.duration>0&&0===this.normalizedSteps.length&&(this.totalDuration=this.duration,this.currentTime="milliseconds"===this.precision?1e3this.duration:this.duration)}handleWindowResize(){this.updateResponsiveState()}updateResponsiveState(){"undefined"!=typeof window&&(this.isNarrow=window.innerWidth<=this.collapseBreakpoint)}initNotifications(){this.enableNotifications&&"Notification"in window&&Notification.requestPermission()}initTargetDate(){if(this.targetDate){const t=new Date(this.targetDate).getTime(),i=Date.now(),e=Math.max(0,Math.floor((t-i)/1e3));this.mode="countdown",this.normalizedSteps=[{label:"Countdown",duration:e}],this.initStep(),this.start()}}loadPersistedState(){if(!this.persist)return;const t=localStorage.getItem("ui-timer-"+this.persist);if(t)try{const i=JSON.parse(t);this.activeStep=i.activeStep,this.currentTime=i.currentTime,i.wasRunning&&this.start()}catch(t){console.warn("Failed to load persisted timer state")}}savePersistedState(){this.persist&&localStorage.setItem("ui-timer-"+this.persist,JSON.stringify({activeStep:this.activeStep,currentTime:this.currentTime,wasRunning:this.isRunning,timestamp:Date.now()}))}componentDidLoad(){this.autoStart&&this.start()}disconnectedCallback(){this.isRunning=!1,this.stopInterval()}initStep(){const t=this.normalizedSteps[this.activeStep],i=t?.duration\|\|0;this.totalDuration=i,this.laps=[],this.isAlerting=!1,this.activeStepColor=t?.color,this.currentTime="stopwatch"===this.mode?0:"milliseconds"===this.precision?1e3i:i}playSound(t){if(this.enableSound)try{const i=new(window.AudioContext\|\|window.webkitAudioContext),e=i.createOscillator(),s=i.createGain();e.connect(s),s.connect(i.destination),"tick"===t?(e.frequency.setValueAtTime(800,i.currentTime),s.gain.setValueAtTime(.1,i.currentTime),s.gain.exponentialRampToValueAtTime(.01,i.currentTime+.1),e.start(),e.stop(i.currentTime+.1)):(e.type="sine",e.frequency.setValueAtTime(440,i.currentTime),e.frequency.exponentialRampToValueAtTime(880,i.currentTime+.2),s.gain.setValueAtTime(.2,i.currentTime),s.gain.exponentialRampToValueAtTime(.01,i.currentTime+.5),e.start(),e.stop(i.currentTime+.5))}catch(t){console.warn("Audio feedback failed")}}notify(t,i,e){if(this.enableNotifications&&"Notification"in window&&"granted"===Notification.permission){const s=t.replace("{{label}}",e),r=i.replace("{{label}}",e);new Notification(s,{body:r})}}stopInterval(){this.timerInterval&&(clearTimeout(this.timerInterval),this.timerInterval=null)}emitStepEvent(t,i){const e=this.normalizedSteps[i];if(!e)return;const s={index:i,step:e};"next"===t?this.timerNext.emit(s):"prev"===t?this.timerPrev.emit(s):this.timerGoTo.emit(s)}async start(){if(this.isRunning)return;this.isRunning=!0,this.timerStart.emit({stepIndex:this.activeStep});const t="milliseconds"===this.precision?10:1e3,i="milliseconds"===this.precision?10:1;let e=performance.now()+t;const s=()=>{if(!this.isRunning)return;const r=performance.now()-e;if("countdown"===this.mode){if(!(this.currentTime>0))return this.playSound("complete"),void this.handleStepComplete();this.currentTime-=i,this.checkAlert(),this.timerTick.emit({remaining:this.currentTime,stepIndex:this.activeStep,mode:this.mode}),this.savePersistedState(),this.currentTime>0&&this.currentTime<=3&&"seconds"===this.precision&&this.playSound("tick")}else{this.currentTime+=i,this.timerTick.emit({remaining:this.currentTime,stepIndex:this.activeStep,mode:this.mode}),this.savePersistedState();const t="milliseconds"===this.precision?1e3this.totalDuration:this.totalDuration;if(t>0&&this.currentTime>=t)return void this.handleStepComplete()}e+=t,this.timerInterval=setTimeout(s,Math.max(0,t-r))};this.timerInterval=setTimeout(s,t)}async pause(){this.isRunning=!1,this.timerInterval&&clearTimeout(this.timerInterval),this.timerInterval=null,this.timerPause.emit({stepIndex:this.activeStep})}async reset(){this.pause(),this.initStep()}async next(){this.activeStep>=this.normalizedSteps.length-1\|\|(this.pause(),this.activeStep++,this.initStep(),this.autoStart&&await this.start(),this.emitStepEvent("next",this.activeStep))}async prev(){this.activeStep<=0\|\|(this.pause(),this.activeStep--,this.initStep(),this.autoStart&&await this.start(),this.emitStepEvent("prev",this.activeStep))}async goTo(t){t<0\|\|t>=this.normalizedSteps.length\|\|t===this.activeStep\|\|(this.pause(),this.activeStep=t,this.initStep(),this.autoStart&&await this.start(),this.emitStepEvent("goto",this.activeStep))}async lap(){"stopwatch"===this.mode&&(this.laps=[...this.laps,this.currentTime],this.timerLap.emit({time:this.currentTime,lapIndex:this.laps.length-1}))}handleKeyDown(t){document.activeElement===this.el&&("Space"===t.code?(t.preventDefault(),this.isRunning?this.pause():this.start()):"KeyR"===t.code?this.reset():"KeyL"===t.code?this.lap():"KeyN"===t.code?this.next():"KeyP"===t.code&&this.prev())}checkAlert(){this.isAlerting="countdown"===this.mode&&0!==this.totalDuration&&("milliseconds"===this.precision?this.currentTime/1e3:this.currentTime)/this.totalDuration100<=this.alertThreshold}handleStepComplete(){this.stopInterval(),this.isRunning=!1,this.timerComplete.emit({stepIndex:this.activeStep}),this.notify(this.notificationTitle,this.notificationBody,this.normalizedSteps[this.activeStep]?.label\|\|"Timer"),this.activeStep<this.normalizedSteps.length-1?(this.activeStep++,this.initStep(),this.start(),this.emitStepEvent("next",this.activeStep)):(this.timerAllComplete.emit(),this.loop&&(this.activeStep=0,this.initStep(),this.start(),this.emitStepEvent("next",this.activeStep)))}calculateOffset(){if(0===this.totalDuration)return"stopwatch"===this.mode?0:283;const t="milliseconds"===this.precision?this.currentTime/1e3:this.currentTime;let i=0;return i="countdown"===this.mode?(this.totalDuration-t)/this.totalDuration:t/this.totalDuration,i=Math.max(0,Math.min(1,i)),283-283i}formatTime(t){const i="milliseconds"===this.precision;let e=i?Math.floor(t/1e3):t,s=i?Math.floor(t%1e3/10):0;if("human"===this.format){const t=Math.floor(e/60),i=e%60;return t>0?`${t}m ${i}s`:i+"s"}if("simple"===this.format)return""+e;const r=Math.floor(e/86400),o=Math.floor(e%86400/3600),a=Math.floor(e%3600/60),n=e%60;let h="";return h=r>0?`${r}d ${o}:${a<10?"0":""}${a}:${n<10?"0":""}${n}`:o>0?`${o}:${a<10?"0":""}${a}:${n<10?"0":""}${n}`:`${a}:${n<10?"0":""}${n}`,i&&(h+=`.${s<10?"0":""}${s}`),h}render(){return s(r,{key:"33774816a46769a5d4de514a1f91a73c5eb5ccc1",class:{"timer-has-shadow":this.useShadow,"timer-no-shadow":!this.useShadow,"timer-collapsed":this.collapse&&this.isNarrow}},"compact"===this.variant\|\|this.collapse&&this.isNarrow?this.renderCompact():this.renderFull())}renderFull(){const t={...this.normalizedTheme,...this.activeStepColor?{"--timer-primary-color":this.activeStepColor}:{}};return s("div",{class:{"timer-container":!0,"timer-alert":this.isAlerting},style:t},s("div",{class:"timer-steps"},this.normalizedSteps.map(((t,i)=>s("div",{class:{"timer-step":!0,"timer-step-active":i===this.activeStep,"timer-step-completed":i<this.activeStep}},s("div",{class:"timer-step-header"},s("span",{class:"timer-step-index"},i+1),s("span",{class:"timer-step-label"},t.label)))))),s("div",{class:"timer-display"},"circular"===this.progressType?s("svg",{class:"timer-progress-svg",viewBox:"0 0 100 100"},s("circle",{class:"timer-progress-bg",cx:"50",cy:"50",r:"45"}),s("circle",{class:"timer-progress-bar",cx:"50",cy:"50",r:"45",style:{"stroke-dashoffset":""+this.calculateOffset()}})):s("div",{class:"timer-progress-linear"},s("div",{class:"timer-progress-linear-bg"}),s("div",{class:"timer-progress-linear-bar",style:{width:100*(1-this.calculateOffset()/283)+"%"}})),s("div",{class:"timer-time-text"},s("slot",{name:"content"},this.formatTime(this.currentTime)))),s("div",{class:"timer-controls"},s("ui-button",{variant:"primary",onClick:()=>this.isRunning?this.pause():this.start(),label:this.isRunning?"Pause":"Start"}),"stopwatch"===this.mode&&s("ui-button",{variant:"secondary",onClick:()=>this.lap(),label:"Lap"}),s("ui-button",{variant:"secondary",onClick:()=>this.reset(),label:"Reset"}),s("ui-button",{variant:"outline",onClick:()=>this.next(),label:"Skip"})),this.laps.length>0&&s("div",{class:"timer-laps"},s("div",{class:"timer-laps-title"},"Laps"),s("div",{class:"timer-laps-list"},this.laps.map(((t,i)=>s("div",{class:"timer-lap-item"},s("span",null,"Lap ",i+1),s("span",{class:"timer-lap-time"},this.formatTime(t))))))))}renderCompact(){return s("div",{class:{"timer-container-compact":!0,"timer-alert":this.isAlerting},style:this.normalizedTheme},s("div",{class:"timer-time-text-compact"},this.formatTime(this.currentTime)),s("div",{class:"timer-controls-compact"},s("ui-button",{variant:"ghost",iconOnly:!0,size:"sm",onClick:()=>this.isRunning?this.pause():this.start(),icon:this.isRunning?"pause":"play",iconLibrary:"lucide",iconSize:"1.2em",ariaLabel:this.isRunning?"Pause":"Start"}),s("ui-button",{variant:"ghost",iconOnly:!0,size:"sm",onClick:()=>this.reset(),icon:"rotate-cw",iconLibrary:"lucide",iconSize:"1.2em",ariaLabel:"Reset"}),"stopwatch"===this.mode&&s("ui-button",{variant:"ghost",iconOnly:!0,size:"sm",onClick:()=>this.lap(),icon:"flag",iconLibrary:"lucide",iconSize:"1.2em",ariaLabel:"Lap"})))}static get watchers(){return{steps:[{normalizeSteps:0}],duration:[{watchDuration:0}],theme:[{normalizeTheme: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}.timer-container{display:flex;flex-direction:column;gap:24px;padding:24px;background:var(--bg-primary, #ffffff);border-radius:12px;box-shadow:0 4px 12px rgba(0, 0, 0, 0.05);font-family:inherit;align-items:center;outline:none}.timer-container:focus{box-shadow:0 0 0 3px rgba(var(--color-success-rgb, 16, 185, 129), 0.5)}:host(.timer-no-shadow) .timer-container,:host(.timer-no-shadow) .timer-container-compact{box-shadow:none}:host(.timer-collapsed) .timer-steps,:host(.timer-collapsed) .timer-laps{display:none}:host(.timer-collapsed) .timer-container{padding:16px;gap:16px;align-items:stretch}:host(.timer-collapsed) .timer-controls{justify-content:center;flex-wrap:wrap}:host(.timer-collapsed) .timer-display{width:160px;height:160px}.timer-steps{display:flex;gap:12px;width:100%;justify-content:center}.timer-step{flex:1;max-width:120px;display:flex;flex-direction:column;gap:8px;opacity:0.5;transition:opacity 0.3s}.timer-step-active{opacity:1}.timer-step-completed{opacity:0.8}.timer-step-header{display:flex;align-items:center;gap:8px}.timer-step-index{width:24px;height:24px;border-radius:50%;background:var(--bg-primary, #e5e7eb);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}.timer-step-active .timer-step-index{background:var(--color-success, #10b981);color:var(--text-standard, #ffffff)}.timer-step-completed .timer-step-index{background:var(--color-success-hover, #059669);color:var(--text-standard, #ffffff)}.timer-step-label{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.timer-display{position:relative;width:200px;height:200px;display:flex;align-items:center;justify-content:center}.timer-progress-svg{width:100%;height:100%;transform:rotate(-90deg)}.timer-progress-bg{fill:none;stroke:var(--text-standard, #f3f4f6);stroke-width:8}.timer-progress-bar{fill:none;stroke:var(--color-success, #10b981);stroke-width:8;stroke-linecap:round;stroke-dasharray:283;transition:stroke-dashoffset 0.3s linear}.timer-time-text{position:absolute;font-size:var(--timer-time-font-size, 42px);font-weight:700;color:var(--color-primary, #064e3b);font-family:monospace;max-width:140px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.2}.timer-controls{display:flex;gap:12px}.timer-btn{padding:10px 24px;border:none;border-radius:8px;background:var(--color-success, #10b981);color:var(--text-standard, #ffffff);font-weight:600;cursor:pointer;transition:background 0.2s}.timer-btn:hover{background:var(--color-success-hover, #059669)}.timer-btn-secondary{background:var(--bg-secondary, #f3f4f6);color:var(--text-secondary, #374151)}.timer-btn-secondary:hover{background:var(--bg-primary, #e5e7eb)}.timer-progress-linear{position:absolute;bottom:0;left:0;width:100%;height:4px;background:var(--bg-secondary, #f3f4f6);overflow:hidden}.timer-progress-linear-bar{height:100%;background:var(--timer-primary-color, var(--color-success, #10b981));transition:width 0.3s linear}.timer-display:has(.timer-progress-linear){height:60px;}@keyframes timer-pulse{0%{transform:scale(1);box-shadow:0 4px 12px rgba(var(--color-danger-rgb, 239, 68, 68), 0.1)}50%{transform:scale(1.02);box-shadow:0 4px 24px rgba(var(--color-danger-rgb, 239, 68, 68), 0.3)}100%{transform:scale(1);box-shadow:0 4px 12px rgba(var(--color-danger-rgb, 239, 68, 68), 0.1)}}.timer-alert{border:2px solid var(--color-danger, #ef4444);animation:timer-pulse 1.5s infinite ease-in-out}.timer-alert .timer-time-text{color:var(--color-danger, #ef4444)}.timer-alert .timer-progress-bar{stroke:var(--color-danger, #ef4444)}.timer-container-compact{display:inline-flex;align-items:center;gap:16px;padding:12px 20px;background:var(--bg-primary, #ffffff);border-radius:9999px;box-shadow:0 2px 8px rgba(0, 0, 0, 0.05);border:1px solid var(--border-default, #e5e7eb)}.timer-time-text-compact{font-size:20px;font-weight:700;font-family:monospace;min-width:80px}.timer-controls-compact{display:flex;gap:8px}.timer-btn-icon{background:transparent;border:none;cursor:pointer;font-size:16px;padding:4px;border-radius:50%;transition:background 0.2s;display:flex;align-items:center;justify-content:center}.timer-btn-icon:hover{background:var(--bg-secondary, #f3f4f6)}.timer-laps{width:100%;margin-top:24px;border-top:1px solid var(--border-subtle, #f3f4f6);padding-top:16px}.timer-laps-title{font-size:14px;font-weight:600;color:var(--text-muted, #6b7280);margin-bottom:12px}.timer-laps-list{max-height:150px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.timer-lap-item{display:flex;justify-content:space-between;font-size:13px;color:var(--text-secondary, #374151);padding:8px 12px;background:var(--bg-primary, #f9fafb);border-radius:6px}.timer-lap-time{font-family:monospace;font-weight:600}@media (prefers-color-scheme: dark){.timer-container{background:var(--bg-primary, #1f2937);box-shadow:0 4px 12px rgba(0, 0, 0, 0.2)}.timer-container-compact{background:var(--bg-primary, #1f2937);border-color:var(--border-default, #374151)}.timer-time-text{color:var(--text-standard, #ffffff)}.timer-step-index{background:var(--color-primary, #374151);color:var(--text-muted, #9ca3af)}.timer-progress-bg{stroke:var(--text-secondary, var(--border-default, #374151))}.timer-btn-secondary{background:var(--color-primary, #374151);color:var(--text-standard, #ffffff)}.timer-lap-item{background:var(--bg-secondary, #111827);color:var(--text-standard, #ffffff)}.timer-btn-icon:hover{background:var(--color-primary, #374151)}}"}},[769,"ui-timer",{steps:[1],flow:[1],mode:[1],activeStep:[1026,"active-step"],theme:[16],autoStart:[4,"auto-start"],loop:[4],precision:[1],variant:[1],alertThreshold:[2,"alert-threshold"],targetDate:[1,"target-date"],persist:[1],progressType:[1,"progress-type"],format:[1],useShadow:[516,"use-shadow"],collapse:[516],enableNotifications:[4,"enable-notifications"],enableSound:[4,"enable-sound"],notificationTitle:[1,"notification-title"],notificationBody:[1,"notification-body"],duration:[2],normalizedSteps:[32],isNarrow:[32],currentTime:[32],isRunning:[32],totalDuration:[32],laps:[32],isAlerting:[32],activeStepColor:[32],normalizedTheme:[32],start:[64],pause:[64],reset:[64],next:[64],prev:[64],goTo:[64],lap:[64]},[[9,"resize","handleWindowResize"],[8,"keydown","handleKeyDown"]],{steps:[{normalizeSteps:0}],duration:[{watchDuration:0}],theme:[{normalizeTheme:0}]}]),p=l,m=function(){"undefined"!=typeof customElements&&["ui-timer","ui-badge","ui-button","ui-icon","ui-loader"].forEach((t=>{switch(t){case"ui-timer":customElements.get(o(t))\|\|customElements.define(o(t),l);break;case"ui-badge":customElements.get(o(t))\|\|a();break;case"ui-button":customElements.get(o(t))\|\|n();break;case"ui-icon":customElements.get(o(t))\|\|h();break;case"ui-loader":customElements.get(o(t))\|\|c()}}))};export{p as UiTimer,m as defineCustomElement}

package/dist/components/ui-toolbar.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{proxyCustomElement as o,HTMLElement as t,createEvent as r,h as e,Host as a,transformTag as i}from"@stencil/core/internal/client";import{d as s}from"./avatar.js";import{d as n,a as l}from"./badge.js";import{d as b}from"./dropdown.js";import{d}from"./icon.js";import{d as h}from"./input.js";import{d as c}from"./loader.js";import{d as p}from"./switch.js";import{d as m}from"./tag.js";import{d as g}from"./toggle-group.js";const u=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.toolbarItemClick=r(this,"toolbarItemClick",7),this.toolbarItemChange=r(this,"toolbarItemChange",7),this.toolbarOverflowChange=r(this,"toolbarOverflowChange",7),this.toolbarReorder=r(this,"toolbarReorder",7)}get el(){return this}schema=null;items=[];variant="default";size="md";orientation="horizontal";position="static";stickyEdge="top";alignment="start";gap="4px";padding="8px 12px";maxSize;overflowStrategy="dropdown";overflowLabel="More";overflowIcon="more-horizontal";iconLibrary="lucide";disabled=!1;loading=!1;zoneDividers=!1;rounded=!1;elevation=1;reorderable=!1;keyboardNav=!0;toolbarAriaLabel="Toolbar";bordered=!1;iconOnly=!1;inputDebounce=300;overflowedIds=new Set;isOverflowOpen=!1;itemStates=new Map;dragSourceId=null;parsedSchema=null;parsedItems=[];isMobile=!1;isCollapsed=!1;openChildDropdowns=0;toolbarItemClick;toolbarItemChange;toolbarOverflowChange;toolbarReorder;resizeObserver;toolbarBodyRef;inputDebounceTimers=new Map;undoStack=[];redoStack=[];focusableRefs=new Map;mobileBreakpoint=640;componentWillLoad(){this.parseItems(),this.parseSchema(),this.initItemStates(),this.isMobile=window.innerWidth<=this.mobileBreakpoint}componentDidLoad(){"dropdown"===this.overflowStrategy&&"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver((()=>this.recalcOverflow())),this.resizeObserver.observe(this.el)),requestAnimationFrame((()=>this.recalcOverflow()))}disconnectedCallback(){this.resizeObserver?.disconnect(),this.inputDebounceTimers.forEach((o=>clearTimeout(o)))}onItemsChange(){this.parseItems(),this.initItemStates(),requestAnimationFrame((()=>this.recalcOverflow()))}onSchemaChange(){this.parseSchema(),this.initItemStates(),requestAnimationFrame((()=>this.recalcOverflow()))}onDocumentClick(o){this.isOverflowOpen&&o.target instanceof Node&&!this.el.contains(o.target)&&(this.isOverflowOpen=!1)}onKeyDown(o){if(!this.keyboardNav)return;const t=Array.from(this.focusableRefs.values()).filter((o=>o&&!o.hasAttribute("disabled"))),r=t.indexOf(document.activeElement);"horizontal"===this.orientation?"ArrowRight"===o.key?(o.preventDefault(),t[(r+1)%t.length]?.focus()):"ArrowLeft"===o.key&&(o.preventDefault(),t[(r-1+t.length)%t.length]?.focus()):"ArrowDown"===o.key?(o.preventDefault(),t[(r+1)%t.length]?.focus()):"ArrowUp"===o.key&&(o.preventDefault(),t[(r-1+t.length)%t.length]?.focus()),"Escape"===o.key&&(this.isOverflowOpen=!1)}onChildDropdownOpen(o){const t=o.target;t&&"ui-dropdown"===t.tagName?.toLowerCase()&&this.el.contains(t)&&(this.openChildDropdowns+=1)}onChildDropdownClose(o){const t=o.target;t&&"ui-dropdown"===t.tagName?.toLowerCase()&&this.el.contains(t)&&(this.openChildDropdowns=Math.max(0,this.openChildDropdowns-1))}async setItemValue(o,t){const r=this.itemStates.get(o)?.value;this.itemStates=new Map(this.itemStates.set(o,{...this.itemStates.get(o),id:o,value:t}));const e=this.findItem(o);e&&this.toolbarItemChange.emit({item:e,value:t,previousValue:r})}async getItemValue(o){return this.itemStates.get(o)?.value}async setItemDisabled(o,t){this.itemStates=new Map(this.itemStates.set(o,{...this.itemStates.get(o),id:o,disabled:t}))}async setItemHidden(o,t){this.itemStates=new Map(this.itemStates.set(o,{...this.itemStates.get(o),id:o,hidden:t})),requestAnimationFrame((()=>this.recalcOverflow()))}async setItemLoading(o,t){this.itemStates=new Map(this.itemStates.set(o,{...this.itemStates.get(o),id:o,loading:t}))}async toggleItem(o){const t=this.itemStates.get(o)??{id:o};this.itemStates=new Map(this.itemStates.set(o,{...t,active:!t.active}))}async setCollapsed(o){this.isCollapsed=o}async setOverflowOpen(o){this.isOverflowOpen=o}async getStateSnapshot(){return{activeItems:Array.from(this.itemStates.entries()).filter((([,o])=>o.active)).map((([o])=>o)),itemStates:Object.fromEntries(this.itemStates),timestamp:Date.now()}}async restoreStateSnapshot(o){this.itemStates=new Map(Object.entries(o.itemStates)),requestAnimationFrame((()=>this.recalcOverflow()))}async undo(){const o=this.undoStack.pop();if(!o)return;const t=await this.getStateSnapshot();this.redoStack.push(t),await this.restoreStateSnapshot(o)}async redo(){const o=this.redoStack.pop();if(!o)return;const t=await this.getStateSnapshot();this.undoStack.push(t),await this.restoreStateSnapshot(o)}async focusItem(o){this.focusableRefs.get(o)?.focus()}parseItems(){if(this.items)if("string"==typeof this.items)try{this.parsedItems=JSON.parse(this.items)}catch{this.parsedItems=[]}else this.parsedItems=this.items;else this.parsedItems=[]}parseSchema(){if(this.schema)if("string"==typeof this.schema)try{this.parsedSchema=JSON.parse(this.schema)}catch{this.parsedSchema=null}else this.parsedSchema=this.schema;else this.parsedSchema=null}initItemStates(){this.getAllItems().forEach((o=>{if(!this.itemStates.has(o.id)){const t={id:o.id,disabled:o.disabled};"value"in o&&(t.value=o.value),"checked"in o&&(t.value=o.checked),"active"in o&&(t.active=o.active),this.itemStates.set(o.id,t)}}))}getAllItems(){const o=[],t=r=>{r?.forEach((r=>{o.push(r),"group"===r.type&&t(r.items)}))};return this.parsedSchema?(t(this.parsedSchema.left??[]),t(this.parsedSchema.center??[]),t(this.parsedSchema.right??[]),t(this.parsedSchema.overflow??[])):t(this.parsedItems),o}findItem(o){return this.getAllItems().find((t=>t.id===o))??null}recalcOverflow(){if("dropdown"!==this.overflowStrategy)return;const o=this.toolbarBodyRef;if(!o)return;const t=new Set;if(this.isMobile=window.innerWidth<=this.mobileBreakpoint,this.isMobile&&this.isCollapsed)this.getAllItems().forEach((o=>{"separator"!==o.type&&"spacer"!==o.type&&t.add(o.id)}));else{const r="horizontal"===this.orientation,e=r?o.clientWidth:o.clientHeight,a=48;let i=0;[...this.getAllItems()].filter((o=>"separator"!==o.type&&"spacer"!==o.type)).sort(((o,t)=>(t.priority??0)-(o.priority??0))).forEach((o=>{if(this.itemStates.get(o.id)?.hidden)return;const s=this.el.shadowRoot?.querySelector(`[data-item-id="${o.id}"]`);s&&(i+=(r?s.offsetWidth:s.offsetHeight)+4,i>e-a&&!o.pinToOverflow&&t.add(o.id))}))}const r=this.overflowedIds;JSON.stringify([...t].sort())!==JSON.stringify([...r].sort())&&(this.overflowedIds=t,this.toolbarOverflowChange.emit({overflowIds:[...t],visibleIds:this.getAllItems().filter((o=>!t.has(o.id))).map((o=>o.id))}))}pushUndoSnapshot(){this.getStateSnapshot().then((o=>{this.undoStack.push(o),this.undoStack.length>50&&this.undoStack.shift(),this.redoStack=[]}))}handleItemClick(o,t){if(!(this.disabled\|\|this.itemStates.get(o.id)?.disabled\|\|o.disabled)){if(this.pushUndoSnapshot(),("button"===o.type\|\|"icon-button"===o.type)&&o.toggleable){const t=this.itemStates.get(o.id)??{id:o.id};this.itemStates=new Map(this.itemStates.set(o.id,{...t,active:!t.active}))}this.toolbarItemClick.emit({item:o,originalEvent:t})}}handleValueChange(o,t){if(this.disabled\|\|this.itemStates.get(o.id)?.disabled)return;this.pushUndoSnapshot();const r=this.itemStates.get(o.id)?.value;this.itemStates=new Map(this.itemStates.set(o.id,{...this.itemStates.get(o.id),id:o.id,value:t})),this.toolbarItemChange.emit({item:o,value:t,previousValue:r})}isItemDisabled(o){return this.disabled\|\|!!o.disabled\|\|!!this.itemStates.get(o.id)?.disabled}isItemHidden(o){return!!this.itemStates.get(o.id)?.hidden}isItemLoading(o){return!!this.itemStates.get(o.id)?.loading}isItemActive(o){const t=this.itemStates.get(o.id);return void 0!==t?.active?t.active:o.active??!1}computeItemValue(o){const t=this.itemStates.get(o.id);return void 0!==t?.value?t.value:"value"in o?o.value:"checked"in o?o.checked:void 0}handleDragStart(o){this.dragSourceId=o}handleDrop(o){if(!this.dragSourceId\|\|this.dragSourceId===o)return;const t=[...this.parsedItems],r=t.findIndex((o=>o.id===this.dragSourceId)),e=t.findIndex((t=>t.id===o));if(r<0\|\|e<0)return;const[a]=t.splice(r,1);t.splice(e,0,a),this.parsedItems=[...t],this.dragSourceId=null,this.toolbarReorder.emit(t)}renderItem(o,t=!1){if(this.isItemHidden(o))return null;if(!t&&this.overflowedIds.has(o.id)&&"dropdown"===this.overflowStrategy)return null;const r=this.isItemDisabled(o),a=this.isItemLoading(o);switch(o.type){case"button":case"icon-button":return this.renderButton(o,r,a,t);case"dropdown":return this.renderDropdown(o,r);case"input":case"search":return this.renderInput(o,r,t);case"toggle":case"switch":return this.renderToggle(o,r,t);case"toggle-group":return this.renderToggleGroup(o,r,t);case"avatar":return this.renderAvatar(o,t);case"separator":return this.renderSeparator();case"spacer":return e("span",{class:"toolbar-spacer",style:{flex:(o.flex??1)+""}});case"text":return this.renderText(o);case"badge":return this.renderBadge(o);case"custom":return this.renderCustom(o);case"group":return this.renderGroup(o,t);default:return null}}renderButton(o,t,r,a){const i=this.isItemActive(o),s=o.iconLibrary??this.iconLibrary,n=o.iconOnly??(!o.label\|\|this.iconOnly);if(a)return e("li",{class:{"overflow-item":!0,"is-active":i,"is-disabled":t},role:"menuitem","aria-disabled":t?"true":null,onClick:t?null:t=>{this.handleItemClick(o,t),this.isOverflowOpen=!1},onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key\|\|(this.handleItemClick(o,t),this.isOverflowOpen=!1)},tabIndex:t?-1:0,"data-item-id":o.id},o.icon&&e("ui-icon",{name:o.icon,library:s,size:"16px"}),e("span",{class:"overflow-item-label"},o.label??o.id),i&&e("span",{class:"overflow-item-check"},"✓"));const l="ghost"!==o.variant&&"outline"!==o.variant&&o.variant?o.variant:o.variant??"ghost";return e("div",{class:{"toolbar-item":!0,"toolbar-item--button":!0,[o.className??""]:!!o.className},"data-item-id":o.id,draggable:this.reorderable,onDragStart:()=>this.handleDragStart(o.id),onDrop:()=>this.handleDrop(o.id),onDragOver:o=>o.preventDefault()},e("ui-button",{label:n?void 0:o.label,icon:o.icon,"icon-library":s,"icon-only":n,variant:l,size:this.size,disabled:t,loading:r,selected:i,active:i,noRipple:!0,href:o.href,target:o.target,tooltip:o.tooltip,"aria-label":o.ariaLabel??(n?o.label:void 0),badge:null!=o.badge?o.badge+"":void 0,ref:t=>t&&this.focusableRefs.set(o.id,t),onButtonClick:t?null:t=>this.handleItemClick(o,t.detail)}))}renderDropdown(o,t){const r=this.computeItemValue(o)??"",a=o.iconLibrary??this.iconLibrary;return e("div",{class:{"toolbar-item":!0,"toolbar-item--dropdown":!0,"is-disabled":t,[o.className??""]:!!o.className},"data-item-id":o.id,title:o.tooltip},e("ui-dropdown",{options:o.options,value:r,placeholder:o.placeholder??o.label??"Select",disabled:t,multiSelect:o.multiSelect,searchable:o.searchable,clearable:o.clearable,size:this.size,onDropdownChange:t=>this.handleValueChange(o,t.detail?.value)},o.icon&&e("ui-icon",{slot:"prefix",name:o.icon,library:a,size:"16px"})))}renderInput(o,t,r){if(r)return null;const a=this.computeItemValue(o)??"",i=t=>{const r=o.debounce??this.inputDebounce;this.inputDebounceTimers.has(o.id)&&clearTimeout(this.inputDebounceTimers.get(o.id));const e=setTimeout((()=>this.handleValueChange(o,t)),r);this.inputDebounceTimers.set(o.id,e)};return e("div",{class:{"toolbar-item":!0,"toolbar-item--input":!0,"is-disabled":t,[o.className??""]:!!o.className},"data-item-id":o.id,style:{minWidth:o.minWidth,maxWidth:o.maxWidth}},e("ui-input",{value:a,placeholder:o.placeholder??("search"===o.type?"Search…":""),disabled:t,size:this.size,clearable:o.clearable,"prefix-icon":"search"===o.type?"search":o.icon,"icon-library":this.iconLibrary,ref:t=>t&&this.focusableRefs.set(o.id,t),onInputChange:o=>i(o.detail)}))}renderToggle(o,t,r){const a=this.computeItemValue(o)??!1;return r?e("li",{class:{"overflow-item":!0,"overflow-item--toggle":!0,"is-disabled":t},role:"menuitemcheckbox","aria-checked":a+"","aria-disabled":t?"true":null,tabIndex:t?-1:0,"data-item-id":o.id,onClick:t?null:()=>this.handleValueChange(o,!a),onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key\|\|this.handleValueChange(o,!a)}},e("span",{class:"overflow-item-label"},o.label??o.id),e("span",{class:"overflow-toggle"+(a?" is-on":"")},a?"ON":"OFF")):e("div",{class:{"toolbar-item":!0,"toolbar-item--toggle":!0,"is-disabled":t,[o.className??""]:!!o.className},"data-item-id":o.id,title:o.tooltip},"right"!==o.labelPosition&&o.label&&e("span",{class:"toolbar-toggle-label"},o.label),e("ui-switch",{checked:a,disabled:t,size:this.size,label:"right"===o.labelPosition?o.label:void 0,"label-position":o.labelPosition??"right",ref:t=>t&&this.focusableRefs.set(o.id,t),onSwitchChange:t=>this.handleValueChange(o,t.detail.checked)}))}renderToggleGroup(o,t,r){if(r)return null;const a=this.computeItemValue(o)??"";return e("div",{class:{"toolbar-item":!0,"toolbar-item--toggle-group":!0,"is-disabled":t,[o.className??""]:!!o.className},"data-item-id":o.id,title:o.tooltip},e("ui-toggle-group",{options:o.options,value:Array.isArray(a)?a.join(","):a,disabled:t,size:o.size??this.size,color:o.color,variant:o.variant,shape:o.shape,"selection-mode":o.selectionMode??"single",onToggleGroupChange:t=>this.handleValueChange(o,t.detail.value)}))}renderAvatar(o,t){return t?e("li",{class:{"overflow-item":!0,"overflow-item--avatar":!0},role:"menuitem",tabIndex:0,"data-item-id":o.id},e("ui-avatar",{src:o.src,name:o.name,size:o.size??"24px",status:o.status,shape:"circle"}),o.name&&e("span",{class:"overflow-item-label"},o.name)):e("div",{class:{"toolbar-item":!0,"toolbar-item--avatar":!0,"is-clickable":o.clickable,[o.className??""]:!!o.className},"data-item-id":o.id,title:o.tooltip??o.name,role:o.clickable?"button":null,tabIndex:o.clickable?0:null,ref:t=>o.clickable&&t&&this.focusableRefs.set(o.id,t),onClick:o.clickable?t=>this.handleItemClick(o,t):null,onKeyDown:t=>{!o.clickable\|\|"Enter"!==t.key&&" "!==t.key\|\|this.handleItemClick(o,t)}},e("ui-avatar",{src:o.src,name:o.name,size:o.size??"28px",status:o.status,shape:"circle"}),null!=o.badge&&e("span",{class:"toolbar-badge toolbar-badge--primary"},o.badge))}renderSeparator(){return e("div",{class:"toolbar-separator"+("vertical"===this.orientation?" toolbar-separator--horizontal":""),role:"separator","aria-orientation":"vertical"===this.orientation?"horizontal":"vertical"})}renderText(o){return e("span",{class:{"toolbar-item":!0,"toolbar-text":!0,"toolbar-text--bold":o.bold,"toolbar-text--muted":o.muted,[o.className??""]:!!o.className},"data-item-id":o.id},o.content)}renderBadge(o){return e("span",{class:`toolbar-item toolbar-status-badge toolbar-status-badge--${o.color??"primary"}${o.dot?" is-dot":""}`,"data-item-id":o.id},!o.dot&&o.label)}renderCustom(o){return o.component?e(o.component,{"data-item-id":o.id,...o.componentProps??{}}):o.html?e("div",{class:"toolbar-item toolbar-item--custom","data-item-id":o.id,innerHTML:o.html}):null}renderGroup(o,t){const r=!1===this.itemStates.get(o.id)?.active;return e("div",{class:{"toolbar-group":!0,"toolbar-group--divider":o.divider,"is-collapsed":r,[o.className??""]:!!o.className},"data-item-id":o.id,role:"group","aria-label":o.label},o.label&&e("span",{class:"toolbar-group__label",onClick:o.collapsible?()=>{const t=this.itemStates.get(o.id)??{id:o.id};this.itemStates=new Map(this.itemStates.set(o.id,{...t,active:!t.active}))}:null},o.label),!r&&o.items.map((o=>this.renderItem(o,t))))}renderOverflowMenu(){const o=this.getAllItems().filter((o=>this.overflowedIds.has(o.id)\|\|o.pinToOverflow));return 0===o.length?null:e("div",{class:"toolbar-overflow"+(this.isOverflowOpen?" is-open":"")},e("ui-button",{class:"toolbar-overflow__btn toolbar-item toolbar-item--button toolbar-item--ghost","aria-haspopup":"menu","aria-expanded":this.isOverflowOpen+"","aria-label":this.overflowLabel,title:this.overflowLabel,variant:"ghost",onButtonClick:o=>{o.detail.stopPropagation(),this.isOverflowOpen=!this.isOverflowOpen},icon:this.overflowIcon,"icon-library":this.iconLibrary,badge:o.length+"",iconOnly:!0}),this.isOverflowOpen&&e("ul",{class:"toolbar-overflow__menu",style:{overflow:"visible"},role:"menu","aria-label":this.overflowLabel},o.map((o=>this.renderItem(o,!0)))))}renderZone(o,t){return o?.length?e("div",{class:"toolbar-zone toolbar-zone--"+t,role:"group","aria-label":t},o.map((o=>this.renderItem(o)))):null}render(){const o=!!this.parsedSchema,t={gap:this.gap,padding:"inline"===this.variant?"0":this.padding},r={["variant-"+this.variant]:!0,["orientation-"+this.orientation]:!0,["position-"+this.position]:!0,["size-"+this.size]:!0,["elevation-"+this.elevation]:!0,["align-"+this.alignment]:!0,"is-rounded":this.rounded,"is-bordered":this.bordered,"is-disabled":this.disabled,"is-loading":this.loading,"is-collapsed":this.isCollapsed,"is-mobile":this.isMobile,"is-overflow-open":this.isOverflowOpen,"has-open-overlay":this.isOverflowOpen\|\|this.openChildDropdowns>0,"has-zone-dividers":this.zoneDividers,"has-overflow":this.overflowedIds.size>0,["overflow-"+this.overflowStrategy]:!0},i={};return"sticky"!==this.position&&"fixed"!==this.position\|\|(i[this.stickyEdge]="0"),this.maxSize&&(i["horizontal"===this.orientation?"maxWidth":"maxHeight"]=this.maxSize),e(a,{key:"d436d5f609b139d2811c68c158301a15c5ff3523",class:r,style:i,role:"toolbar","aria-label":this.toolbarAriaLabel,"aria-disabled":this.disabled?"true":null},this.isMobile&&e("ui-button",{key:"ef9bf93650048b4c83d82cc90a59932abdb65a75",class:"toolbar-mobile-toggle","aria-expanded":!this.isCollapsed+"","aria-label":this.isCollapsed?"Expand toolbar":"Collapse toolbar",onButtonClick:()=>{this.isCollapsed=!this.isCollapsed},variant:"ghost",icon:this.isCollapsed?"menu":"x","icon-library":this.iconLibrary,iconOnly:!0}),(!this.isMobile\|\|!this.isCollapsed)&&e("div",{key:"14f8f470194941da1eb3ebf5a612cbed4fd9870b",class:"toolbar-body",style:t,ref:o=>this.toolbarBodyRef=o},e("slot",{key:"e717108882c11dfd3878a12a89d5b57146b3c527",name:"before"}),o?e("div",{class:"toolbar-zones"},this.renderZone(this.parsedSchema.left??[],"left"),this.zoneDividers&&this.parsedSchema.left?.length>0&&this.parsedSchema.center?.length>0&&this.renderSeparator(),this.renderZone(this.parsedSchema.center??[],"center"),this.zoneDividers&&this.parsedSchema.center?.length>0&&this.parsedSchema.right?.length>0&&this.renderSeparator(),this.renderZone(this.parsedSchema.right??[],"right")):this.parsedItems.map((o=>this.renderItem(o))),e("slot",{key:"2306eefd8213f540eb4b6034d1e975bcbcbd244e",name:"left"}),e("slot",{key:"21fc5a66550c40f54e14ff69027bf66dde88eb75",name:"center"}),e("slot",{key:"54c87776c5cacc375c2be3a2f15cfac0733c5d2f",name:"right"}),e("slot",{key:"2503cce255fae015cbbe170392f7eda94c881e12"}),"dropdown"===this.overflowStrategy&&this.renderOverflowMenu(),e("slot",{key:"6fab60c7236967cc9cd0619fa917f8812375e1d6",name:"after"})))}static get watchers(){return{items:[{onItemsChange:0}],schema:[{onSchemaChange:0}]}}static get style(){return'@charset "UTF-8";.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{--toolbar-height:48px;--toolbar-padding:8px 12px;--toolbar-gap:4px;--toolbar-bg:var(--bg-primary, #ffffff);--toolbar-border-color:var(--border-default, #e5e7eb);--toolbar-text:var(--text-primary, #111827);--toolbar-muted:var(--text-secondary, #6b7280);--toolbar-separator-color:var(--border-default, #e5e7eb);--toolbar-item-bg:transparent;--toolbar-item-bg-hover:var(--bg-secondary, #f3f4f6);--toolbar-item-bg-active:var(--color-primary-light, #eff6ff);--toolbar-item-color:var(--text-primary, #374151);--toolbar-item-color-active:var(--color-primary, #2563eb);--toolbar-item-radius:6px;--toolbar-item-height-sm:28px;--toolbar-item-height-md:34px;--toolbar-item-height-lg:40px;--toolbar-item-height-xl:48px;--toolbar-item-padding-sm:0 8px;--toolbar-item-padding-md:0 12px;--toolbar-item-padding-lg:0 16px;--toolbar-switch-width:34px;--toolbar-switch-height:18px;--toolbar-switch-on:var(--color-primary, #2563eb);--toolbar-switch-off:var(--border-strong, #d1d5db);--toolbar-switch-thumb:#ffffff;--toolbar-badge-bg:var(--color-danger, #ef4444);--toolbar-badge-color:#ffffff;--toolbar-badge-size:16px;--toolbar-overflow-menu-bg:#ffffff;--toolbar-overflow-menu-border:rgba(0, 0, 0, 0.08);--toolbar-overflow-menu-shadow:0 20px 50px rgba(0, 0, 0, 0.2), 0 10px 20px rgba(0, 0, 0, 0.1);--toolbar-overflow-menu-radius:16px;--toolbar-overflow-item-height:40px;--toolbar-transition:0.15s ease;--toolbar-shadow-1:0 1px 3px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .04);--toolbar-shadow-2:0 4px 12px rgba(0, 0, 0, .08), 0 2px 4px rgba(0, 0, 0, .05);--toolbar-shadow-3:0 8px 24px rgba(0, 0, 0, .10), 0 4px 8px rgba(0, 0, 0, .06);--toolbar-shadow-4:0 16px 40px rgba(0, 0, 0, .12), 0 6px 12px rgba(0, 0, 0, .07);display:block;box-sizing:border-box;position:relative;max-width:100%}:host{--_item-h:var(--toolbar-item-height-md);--_item-p:var(--toolbar-item-padding-md)}:host(.size-sm){--_item-h:var(--toolbar-item-height-sm);--_item-p:var(--toolbar-item-padding-sm)}:host(.size-md){--_item-h:var(--toolbar-item-height-md);--_item-p:var(--toolbar-item-padding-md)}:host(.size-lg){--_item-h:var(--toolbar-item-height-lg);--_item-p:var(--toolbar-item-padding-lg)}:host(.size-xl){--_item-h:var(--toolbar-item-height-xl);--_item-p:var(--toolbar-item-padding-lg)}.toolbar-body{display:flex;align-items:center;flex-wrap:nowrap;box-sizing:border-box;width:100%;max-width:100%;min-width:0;min-height:var(--toolbar-height);background:var(--toolbar-bg);color:var(--toolbar-text);font-family:var(--font-family);font-size:13px;transition:background var(--toolbar-transition), color var(--toolbar-transition);position:relative}:host(.orientation-vertical) .toolbar-body{flex-direction:column;align-items:stretch;width:var(--toolbar-height);min-height:unset;height:100%}:host(.align-start) .toolbar-body{justify-content:flex-start}:host(.align-center) .toolbar-body{justify-content:center}:host(.align-end) .toolbar-body{justify-content:flex-end}:host(.align-space-between) .toolbar-body{justify-content:space-between}:host(.align-space-around) .toolbar-body{justify-content:space-around}:host(.align-space-evenly) .toolbar-body{justify-content:space-evenly}:host .toolbar-body{overflow:hidden}:host(.overflow-scroll) .toolbar-body{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;}:host(.orientation-vertical) :host(.overflow-scroll) .toolbar-body{overflow-x:hidden;overflow-y:auto}:host(.overflow-scroll) .toolbar-body{scrollbar-width:thin;scrollbar-color:var(--toolbar-muted) transparent}:host(.overflow-scroll) .toolbar-body::-webkit-scrollbar{width:4px;height:4px;background:transparent}:host(.overflow-scroll) .toolbar-body::-webkit-scrollbar-thumb{background:var(--toolbar-muted);border-radius:4px;border:1px solid transparent;background-clip:content-box;opacity:0.5}:host(.overflow-scroll) .toolbar-body{}:host(.overflow-scroll) .toolbar-body:not(:hover){scrollbar-color:transparent transparent}:host(.overflow-scroll) .toolbar-body:not(:hover)::-webkit-scrollbar-thumb{background:transparent}:host(.overflow-visible) .toolbar-body{overflow:visible}:host(.overflow-wrap) .toolbar-body{flex-wrap:wrap;height:auto;min-height:var(--toolbar-height)}:host(.overflow-dropdown) .toolbar-body{overflow:hidden}:host(.overflow-dropdown.has-open-overlay) .toolbar-body,:host(.overflow-dropdown.is-overflow-open) .toolbar-body,:host(.overflow-dropdown.has-open-dropdown) .toolbar-body,:host(.has-open-overlay) .toolbar-body{overflow:visible}:host(.elevation-0) .toolbar-body{box-shadow:none}:host(.elevation-1) .toolbar-body{box-shadow:var(--toolbar-shadow-1)}:host(.elevation-2) .toolbar-body{box-shadow:var(--toolbar-shadow-2)}:host(.elevation-3) .toolbar-body{box-shadow:var(--toolbar-shadow-3)}:host(.elevation-4) .toolbar-body{box-shadow:var(--toolbar-shadow-4)}:host(.is-bordered) .toolbar-body{border:1px solid var(--toolbar-border-color)}:host(.is-rounded) .toolbar-body{border-radius:12px}:host(.position-sticky){position:sticky;z-index:var(--z-sticky, 10)}:host(.position-fixed){position:fixed;z-index:var(--z-toolbar, 20);width:100%}:host(.variant-primary) .toolbar-body{background:var(--color-primary, #2563eb);color:#ffffff;--toolbar-item-color:rgba(255, 255, 255, 0.92);--toolbar-item-bg-hover:rgba(255, 255, 255, 0.12);--toolbar-item-bg-active:rgba(255, 255, 255, 0.2);--toolbar-item-color-active:#ffffff;--toolbar-separator-color:rgba(255, 255, 255, 0.2)}:host(.variant-secondary) .toolbar-body{background:var(--bg-secondary, #f8fafc);--toolbar-item-bg-hover:var(--bg-primary, #ffffff)}:host(.variant-minimal) .toolbar-body{background:transparent;box-shadow:none;border-bottom:1px solid var(--toolbar-border-color)}:host(.variant-glass) .toolbar-body{background:rgba(255, 255, 255, 0.12);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid rgba(255, 255, 255, 0.15);box-shadow:0 8px 32px rgba(31, 38, 135, 0.1);--toolbar-item-color:var(--text-primary, #1e293b);--toolbar-item-bg-hover:rgba(255, 255, 255, 0.2);--toolbar-separator-color:rgba(255, 255, 255, 0.2)}:host(.variant-elevated) .toolbar-body{box-shadow:var(--toolbar-shadow-3);border-bottom:none}:host(.variant-outlined) .toolbar-body{background:transparent;border:1px solid var(--toolbar-border-color);box-shadow:none}:host(.variant-dark) .toolbar-body{background:var(--bg-dark, #1e293b);color:#f1f5f9;--toolbar-item-color:rgba(241, 245, 249, 0.9);--toolbar-item-bg-hover:rgba(255, 255, 255, 0.08);--toolbar-item-bg-active:rgba(99, 102, 241, 0.25);--toolbar-item-color-active:#818cf8;--toolbar-separator-color:rgba(255, 255, 255, 0.1);--toolbar-overflow-menu-bg:#1e293b;--toolbar-overflow-menu-border:rgba(255, 255, 255, 0.1)}:host(.variant-inline){display:inline-block;width:auto}:host(.variant-inline) .toolbar-body{width:auto;min-height:auto;background:transparent;box-shadow:none;border:none;border-radius:0;padding:0 !important;overflow:visible}.toolbar-zones{display:flex;align-items:center;width:100%;max-width:100%;min-width:0;gap:inherit}.toolbar-zone{display:flex;align-items:center;gap:inherit;flex-shrink:0;max-width:100%;min-width:0}.toolbar-zone--left{margin-right:auto}.toolbar-zone--right{margin-left:auto}.toolbar-zone--center{flex:1;justify-content:center}:host(.has-zone-dividers) .toolbar-zones .toolbar-zone+.toolbar-zone{border-left:1px solid var(--toolbar-separator-color);padding-left:12px;margin-left:12px}.toolbar-item{display:inline-flex;align-items:center;justify-content:center;gap:5px;height:var(--_item-h);padding:var(--_item-p);border-radius:var(--toolbar-item-radius);color:var(--toolbar-item-color);background:var(--toolbar-item-bg);border:none;cursor:pointer;user-select:none;white-space:nowrap;font-size:inherit;font-weight:500;transition:background var(--toolbar-transition), color var(--toolbar-transition), box-shadow var(--toolbar-transition), opacity var(--toolbar-transition), transform 0.1s ease;outline:none;text-decoration:none;flex-shrink:0;position:relative;max-width:100%;min-width:0}.toolbar-item--button,.toolbar-item--input,.toolbar-item--search,.toolbar-item--toggle,.toolbar-item--toggle-group{padding:0 !important;background:transparent !important;border:none !important;box-shadow:none !important;height:auto !important;cursor:default !important}.toolbar-item--dropdown{overflow:visible;padding:0 !important;background:transparent !important;border:none !important;box-shadow:none !important;height:auto !important;cursor:default !important;}.toolbar-item--dropdown .dropdown-trigger,.toolbar-item--dropdown .dropdown-container .dropdown-trigger{height:var(--_item-h) !important;min-height:var(--_item-h) !important;max-height:var(--_item-h) !important;padding:0 10px !important;font-size:inherit !important;box-sizing:border-box}.toolbar-item--dropdown{}.toolbar-item--dropdown .dropdown-has-chips .dropdown-trigger{height:auto !important;min-height:var(--_item-h) !important;max-height:none !important}.toolbar-item:focus-visible{box-shadow:0 0 0 2px var(--color-primary, #2563eb);outline:none}.toolbar-item--button:hover:not(.is-disabled),.toolbar-item--avatar.is-clickable:hover{background:var(--toolbar-item-bg-hover)}.toolbar-item--button.is-active{background:var(--toolbar-item-bg-active);color:var(--toolbar-item-color-active)}.toolbar-item--button:active:not(.is-disabled){transform:scale(0.96)}.toolbar-item.is-icon-only{padding:0;width:var(--_item-h)}.toolbar-item.is-disabled,.toolbar-item[aria-disabled=true]{opacity:0.45;cursor:not-allowed;pointer-events:none}.toolbar-item.is-loading{cursor:wait;pointer-events:none}.toolbar-item--primary{background:var(--color-primary, #2563eb);color:#fff}.toolbar-item--primary:hover{background:var(--color-primary-hover, #1d4ed8)}.toolbar-item--secondary{background:var(--bg-secondary, #f1f5f9);color:var(--text-primary, #374151)}.toolbar-item--secondary:hover{background:var(--bg-tertiary, #e2e8f0)}.toolbar-item--danger{background:var(--color-danger, #ef4444);color:#fff}.toolbar-item--danger:hover{background:#dc2626}.toolbar-item--success{background:var(--color-success, #10b981);color:#fff}.toolbar-item--warning{background:var(--color-warning, #f59e0b);color:#fff}.toolbar-item--ghost,.toolbar-item--outline{background:transparent;color:var(--toolbar-item-color)}.toolbar-item--outline{border:1px solid var(--toolbar-border-color)}.toolbar-item__label{line-height:1}.toolbar-separator{width:1px;align-self:stretch;margin:4px 2px;background:var(--toolbar-separator-color);flex-shrink:0}.toolbar-separator--horizontal{width:100%;height:1px;margin:2px 4px}.toolbar-spacer{display:block;flex-shrink:0}.toolbar-text{cursor:default;font-size:13px;color:var(--toolbar-text);padding:0 6px;height:auto}.toolbar-text--bold{font-weight:700}.toolbar-text--muted{color:var(--toolbar-muted)}.toolbar-status-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:0.03em;height:auto}.toolbar-status-badge--primary{background:#dbeafe;color:#1d4ed8}.toolbar-status-badge--success{background:#d1fae5;color:#065f46}.toolbar-status-badge--danger{background:#fee2e2;color:#991b1b}.toolbar-status-badge--warning{background:#fef3c7;color:#92400e}.toolbar-status-badge--info{background:#e0f2fe;color:#0369a1}.toolbar-status-badge.is-dot{width:8px;height:8px;border-radius:50%;padding:0}.toolbar-badge{position:absolute;top:2px;right:2px;min-width:var(--toolbar-badge-size);height:var(--toolbar-badge-size);border-radius:999px;padding:0 3px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;line-height:1;background:var(--toolbar-badge-bg);color:var(--toolbar-badge-color);box-shadow:0 0 0 2px var(--toolbar-bg);pointer-events:none}.toolbar-badge--success{background:var(--color-success, #10b981)}.toolbar-badge--warning{background:var(--color-warning, #f59e0b)}.toolbar-badge--info{background:var(--color-info, #2563eb)}.toolbar-item--input,.toolbar-item--search{padding:0;background:transparent;cursor:default}.toolbar-input-wrap{display:flex;align-items:center;gap:6px;height:var(--_item-h);padding:0 10px;border:1px solid var(--toolbar-border-color);border-radius:var(--toolbar-item-radius);background:var(--bg-primary, #fff);transition:border-color var(--toolbar-transition), box-shadow var(--toolbar-transition);min-width:160px;max-width:260px}.toolbar-input-wrap--search{min-width:180px}.toolbar-input-wrap:focus-within{border-color:var(--color-primary, #2563eb);box-shadow:0 0 0 2px rgba(37, 99, 235, 0.12)}.toolbar-input{flex:1;border:none;outline:none;background:transparent;color:var(--toolbar-text);font-size:13px;font-family:inherit;min-width:0}.toolbar-input::placeholder{color:var(--toolbar-muted)}.toolbar-input-icon{color:var(--toolbar-muted);flex-shrink:0}.toolbar-input-clear{display:flex;align-items:center;padding:2px;background:none;border:none;cursor:pointer;color:var(--toolbar-muted);border-radius:4px;transition:color var(--toolbar-transition), background var(--toolbar-transition);flex-shrink:0}.toolbar-input-clear:hover{color:var(--toolbar-text);background:var(--toolbar-item-bg-hover)}.toolbar-item--toggle{gap:8px;cursor:default;padding:0 8px;background:transparent}.toolbar-toggle-label{font-size:13px;color:var(--toolbar-item-color);white-space:nowrap}.toolbar-switch{position:relative;width:var(--toolbar-switch-width);height:var(--toolbar-switch-height);border-radius:999px;background:var(--toolbar-switch-off);border:none;cursor:pointer;transition:background var(--toolbar-transition);outline:none;flex-shrink:0;padding:0}.toolbar-switch:focus-visible{box-shadow:0 0 0 2px var(--color-primary, #2563eb)}.toolbar-switch.is-on{background:var(--toolbar-switch-on)}.toolbar-switch__thumb{position:absolute;top:2px;left:2px;width:calc(var(--toolbar-switch-height) - 4px);height:calc(var(--toolbar-switch-height) - 4px);border-radius:50%;background:var(--toolbar-switch-thumb);box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);transition:transform var(--toolbar-transition)}.toolbar-switch.is-on .toolbar-switch__thumb{transform:translateX(calc(var(--toolbar-switch-width) - var(--toolbar-switch-height)))}.toolbar-item--avatar{padding:0 4px;position:relative;background:transparent}.toolbar-item--avatar.is-clickable{cursor:pointer;padding:4px}.toolbar-item--avatar.is-clickable:hover{background:var(--toolbar-item-bg-hover)}.toolbar-group{display:inline-flex;align-items:center;gap:inherit;flex-shrink:0;max-width:100%;min-width:0}.toolbar-group--divider{border-left:1px solid var(--toolbar-separator-color);padding-left:8px;margin-left:4px}.toolbar-group__label{font-size:11px;font-weight:600;color:var(--toolbar-muted);text-transform:uppercase;letter-spacing:0.06em;padding:0 4px}.toolbar-group.is-collapsed>:not(.toolbar-group__label){display:none}.toolbar-spinner{width:14px;height:14px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:toolbar-spin 0.7s linear infinite}@keyframes toolbar-spin{to{transform:rotate(360deg)}}.toolbar-overflow{position:absolute;right:var(--toolbar-overflow-right, 0px);top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;flex-shrink:0;z-index:var(--z-dropdown, 100);background:var(--toolbar-bg);}.toolbar-overflow::before{content:"";position:absolute;right:100%;top:0;bottom:0;width:24px;background:linear-gradient(to right, transparent, var(--toolbar-bg));pointer-events:none}.toolbar-overflow.is-open .toolbar-overflow__menu{display:block !important;opacity:1 !important;transform:scale(1) translateY(0) !important;visibility:visible !important}.toolbar-overflow__btn{position:relative}.toolbar-overflow__badge{position:absolute;top:1px;right:1px;min-width:14px;height:14px;background:var(--color-primary, #2563eb);color:#fff;border-radius:999px;font-size:9px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 2px;pointer-events:none;box-shadow:0 0 0 2px var(--toolbar-bg)}.toolbar-overflow__menu{position:absolute;top:calc(100% + 6px);right:0;z-index:var(--z-dropdown, 100);list-style:none;margin:0;padding:6px;min-width:180px;background:var(--toolbar-overflow-menu-bg);border:1px solid var(--toolbar-overflow-menu-border);border-radius:var(--toolbar-overflow-menu-radius);box-shadow:var(--toolbar-overflow-menu-shadow);animation:toolbar-overflow-in 0.15s cubic-bezier(0.34, 1.56, 0.64, 1);max-height:320px;overflow-y:auto}:host(.orientation-vertical) .toolbar-overflow__menu{top:0;left:calc(100% + 6px);right:auto}@keyframes toolbar-overflow-in{from{opacity:0;transform:scale(0.95) translateY(-6px)}to{opacity:1;transform:scale(1) translateY(0)}}.overflow-item{display:flex;align-items:center;gap:8px;height:var(--toolbar-overflow-item-height);padding:0 10px;border-radius:6px;cursor:pointer;color:var(--toolbar-item-color);font-size:13px;font-weight:500;transition:background var(--toolbar-transition), color var(--toolbar-transition);outline:none;user-select:none;list-style:none}.overflow-item:hover,.overflow-item:focus-visible{background:var(--toolbar-item-bg-hover);color:var(--toolbar-item-color-active)}.overflow-item.is-active{color:var(--toolbar-item-color-active)}.overflow-item.is-disabled{opacity:0.45;cursor:not-allowed;pointer-events:none}.overflow-item-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.overflow-item-check{color:var(--toolbar-item-color-active);font-size:12px;font-weight:700}.overflow-item--toggle{justify-content:space-between}.overflow-toggle{font-size:11px;font-weight:600;padding:2px 6px;border-radius:4px;background:var(--toolbar-item-bg-hover);color:var(--toolbar-muted)}.overflow-toggle.is-on{background:var(--toolbar-item-bg-active);color:var(--toolbar-item-color-active)}.overflow-item--avatar{gap:10px}.toolbar-mobile-toggle{display:none;align-items:center;justify-content:center;width:36px;height:36px;background:none;border:none;cursor:pointer;color:var(--toolbar-text);border-radius:6px;transition:background var(--toolbar-transition);padding:0}.toolbar-mobile-toggle:hover{background:var(--toolbar-item-bg-hover)}:host(.is-mobile) .toolbar-mobile-toggle{display:flex}:host(.is-mobile) .toolbar-body,:host(.variant-inline) .toolbar-body{flex-wrap:wrap;align-items:flex-start}:host(.is-mobile.is-collapsed) .toolbar-body{display:none}:host(.is-mobile) .toolbar-zones,:host(.variant-inline) .toolbar-zones,:host(.overflow-wrap) .toolbar-zones{flex-wrap:wrap;align-items:flex-start}:host(.is-mobile) .toolbar-zone,:host(.variant-inline) .toolbar-zone,:host(.overflow-wrap) .toolbar-zone{flex-wrap:wrap;align-items:flex-start}:host(.is-mobile) .toolbar-zone--left,:host(.is-mobile) .toolbar-zone--center,:host(.is-mobile) .toolbar-zone--right{width:100%;margin-left:0;margin-right:0;justify-content:flex-start}:host(.is-mobile) .toolbar-item--input,:host(.variant-inline) .toolbar-item--input,:host(.is-mobile) .toolbar-item--search,:host(.variant-inline) .toolbar-item--search{flex:1 1 180px}:host(.orientation-vertical) .toolbar-item{width:100%;justify-content:flex-start;padding:0 14px;height:var(--_item-h)}:host(.orientation-vertical) .toolbar-item.is-icon-only{justify-content:center;padding:0}:host(.orientation-vertical) .toolbar-separator{width:80%;height:1px;margin:4px auto;align-self:center}:host(.orientation-vertical) .toolbar-overflow{position:absolute;bottom:0;right:auto;left:0;top:auto;transform:none;width:100%;justify-content:center}.toolbar-item[draggable=true]{cursor:grab}.toolbar-item[draggable=true]:active{cursor:grabbing;opacity:0.6}:host(.is-disabled) .toolbar-body{opacity:0.6;pointer-events:none;cursor:not-allowed}:host(.is-loading) .toolbar-body::after{content:"";position:absolute;bottom:0;left:0;height:2px;width:100%;background:linear-gradient(90deg, transparent 0%, var(--color-primary, #2563eb) 40%, transparent 100%);animation:toolbar-loading 1.4s ease infinite}@keyframes toolbar-loading{0%{transform:translateX(-100%)}100%{transform:translateX(200%)}}::slotted(){flex-shrink:0;max-width:100%;min-width:0}:host(.is-mobile) ::slotted(),:host(.variant-inline) ::slotted(){flex-shrink:1}.toolbar-item--custom{padding:0;background:transparent;height:auto;cursor:default;max-width:100%}'}},[769,"ui-toolbar",{schema:[1],items:[1],variant:[1],size:[1],orientation:[513],position:[513],stickyEdge:[1,"sticky-edge"],alignment:[1],gap:[1],padding:[1],maxSize:[1,"max-size"],overflowStrategy:[1,"overflow-strategy"],overflowLabel:[1,"overflow-label"],overflowIcon:[1,"overflow-icon"],iconLibrary:[1,"icon-library"],disabled:[4],loading:[4],zoneDividers:[4,"zone-dividers"],rounded:[4],elevation:[2],reorderable:[4],keyboardNav:[4,"keyboard-nav"],toolbarAriaLabel:[1,"toolbar-aria-label"],bordered:[4],iconOnly:[4,"icon-only"],inputDebounce:[2,"input-debounce"],overflowedIds:[32],isOverflowOpen:[32],itemStates:[32],dragSourceId:[32],parsedSchema:[32],parsedItems:[32],isMobile:[32],isCollapsed:[32],openChildDropdowns:[32],setItemValue:[64],getItemValue:[64],setItemDisabled:[64],setItemHidden:[64],setItemLoading:[64],toggleItem:[64],setCollapsed:[64],setOverflowOpen:[64],getStateSnapshot:[64],restoreStateSnapshot:[64],undo:[64],redo:[64],focusItem:[64]},[[4,"click","onDocumentClick"],[0,"keydown","onKeyDown"],[0,"dropdownOpen","onChildDropdownOpen"],[0,"dropdownClose","onChildDropdownClose"]],{items:[{onItemsChange:0}],schema:[{onSchemaChange:0}]}]),v=u,f=function(){"undefined"!=typeof customElements&&["ui-toolbar","ui-avatar","ui-badge","ui-button","ui-dropdown","ui-icon","ui-input","ui-loader","ui-switch","ui-tag","ui-toggle-group"].forEach((o=>{switch(o){case"ui-toolbar":customElements.get(i(o))\|\|customElements.define(i(o),u);break;case"ui-avatar":customElements.get(i(o))\|\|s();break;case"ui-badge":customElements.get(i(o))\|\|l();break;case"ui-button":customElements.get(i(o))\|\|n();break;case"ui-dropdown":customElements.get(i(o))\|\|b();break;case"ui-icon":customElements.get(i(o))\|\|d();break;case"ui-input":customElements.get(i(o))\|\|h();break;case"ui-loader":customElements.get(i(o))\|\|c();break;case"ui-switch":customElements.get(i(o))\|\|p();break;case"ui-tag":customElements.get(i(o))\|\|m();break;case"ui-toggle-group":customElements.get(i(o))\|\|g()}}))};export{v as UiToolbar,f as defineCustomElement}
1	+ import{proxyCustomElement as o,HTMLElement as t,createEvent as r,h as e,Host as a,transformTag as i}from"@stencil/core/internal/client";import{d as s}from"./avatar.js";import{d as n}from"./badge.js";import{d as l}from"./button.js";import{d as b}from"./dropdown.js";import{d}from"./icon.js";import{d as h}from"./input.js";import{d as c}from"./loader.js";import{d as p}from"./switch.js";import{d as m}from"./tag.js";import{d as g}from"./toggle-group.js";const u=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.toolbarItemClick=r(this,"toolbarItemClick",7),this.toolbarItemChange=r(this,"toolbarItemChange",7),this.toolbarOverflowChange=r(this,"toolbarOverflowChange",7),this.toolbarReorder=r(this,"toolbarReorder",7)}get el(){return this}schema=null;items=[];variant="default";size="md";orientation="horizontal";position="static";stickyEdge="top";alignment="start";gap="4px";padding="8px 12px";maxSize;overflowStrategy="dropdown";overflowLabel="More";overflowIcon="more-horizontal";iconLibrary="lucide";disabled=!1;loading=!1;zoneDividers=!1;rounded=!1;elevation=1;reorderable=!1;keyboardNav=!0;toolbarAriaLabel="Toolbar";bordered=!1;iconOnly=!1;inputDebounce=300;overflowedIds=new Set;isOverflowOpen=!1;itemStates=new Map;dragSourceId=null;parsedSchema=null;parsedItems=[];isMobile=!1;isCollapsed=!1;openChildDropdowns=0;toolbarItemClick;toolbarItemChange;toolbarOverflowChange;toolbarReorder;resizeObserver;toolbarBodyRef;inputDebounceTimers=new Map;undoStack=[];redoStack=[];focusableRefs=new Map;mobileBreakpoint=640;componentWillLoad(){this.parseItems(),this.parseSchema(),this.initItemStates(),this.isMobile=window.innerWidth<=this.mobileBreakpoint}componentDidLoad(){"dropdown"===this.overflowStrategy&&"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver((()=>this.recalcOverflow())),this.resizeObserver.observe(this.el)),requestAnimationFrame((()=>this.recalcOverflow()))}disconnectedCallback(){this.resizeObserver?.disconnect(),this.inputDebounceTimers.forEach((o=>clearTimeout(o)))}onItemsChange(){this.parseItems(),this.initItemStates(),requestAnimationFrame((()=>this.recalcOverflow()))}onSchemaChange(){this.parseSchema(),this.initItemStates(),requestAnimationFrame((()=>this.recalcOverflow()))}onDocumentClick(o){this.isOverflowOpen&&o.target instanceof Node&&!this.el.contains(o.target)&&(this.isOverflowOpen=!1)}onKeyDown(o){if(!this.keyboardNav)return;const t=Array.from(this.focusableRefs.values()).filter((o=>o&&!o.hasAttribute("disabled"))),r=t.indexOf(document.activeElement);"horizontal"===this.orientation?"ArrowRight"===o.key?(o.preventDefault(),t[(r+1)%t.length]?.focus()):"ArrowLeft"===o.key&&(o.preventDefault(),t[(r-1+t.length)%t.length]?.focus()):"ArrowDown"===o.key?(o.preventDefault(),t[(r+1)%t.length]?.focus()):"ArrowUp"===o.key&&(o.preventDefault(),t[(r-1+t.length)%t.length]?.focus()),"Escape"===o.key&&(this.isOverflowOpen=!1)}onChildDropdownOpen(o){const t=o.target;t&&"ui-dropdown"===t.tagName?.toLowerCase()&&this.el.contains(t)&&(this.openChildDropdowns+=1)}onChildDropdownClose(o){const t=o.target;t&&"ui-dropdown"===t.tagName?.toLowerCase()&&this.el.contains(t)&&(this.openChildDropdowns=Math.max(0,this.openChildDropdowns-1))}async setItemValue(o,t){const r=this.itemStates.get(o)?.value;this.itemStates=new Map(this.itemStates.set(o,{...this.itemStates.get(o),id:o,value:t}));const e=this.findItem(o);e&&this.toolbarItemChange.emit({item:e,value:t,previousValue:r})}async getItemValue(o){return this.itemStates.get(o)?.value}async setItemDisabled(o,t){this.itemStates=new Map(this.itemStates.set(o,{...this.itemStates.get(o),id:o,disabled:t}))}async setItemHidden(o,t){this.itemStates=new Map(this.itemStates.set(o,{...this.itemStates.get(o),id:o,hidden:t})),requestAnimationFrame((()=>this.recalcOverflow()))}async setItemLoading(o,t){this.itemStates=new Map(this.itemStates.set(o,{...this.itemStates.get(o),id:o,loading:t}))}async toggleItem(o){const t=this.itemStates.get(o)??{id:o};this.itemStates=new Map(this.itemStates.set(o,{...t,active:!t.active}))}async setCollapsed(o){this.isCollapsed=o}async setOverflowOpen(o){this.isOverflowOpen=o}async getStateSnapshot(){return{activeItems:Array.from(this.itemStates.entries()).filter((([,o])=>o.active)).map((([o])=>o)),itemStates:Object.fromEntries(this.itemStates),timestamp:Date.now()}}async restoreStateSnapshot(o){this.itemStates=new Map(Object.entries(o.itemStates)),requestAnimationFrame((()=>this.recalcOverflow()))}async undo(){const o=this.undoStack.pop();if(!o)return;const t=await this.getStateSnapshot();this.redoStack.push(t),await this.restoreStateSnapshot(o)}async redo(){const o=this.redoStack.pop();if(!o)return;const t=await this.getStateSnapshot();this.undoStack.push(t),await this.restoreStateSnapshot(o)}async focusItem(o){this.focusableRefs.get(o)?.focus()}parseItems(){if(this.items)if("string"==typeof this.items)try{this.parsedItems=JSON.parse(this.items)}catch{this.parsedItems=[]}else this.parsedItems=this.items;else this.parsedItems=[]}parseSchema(){if(this.schema)if("string"==typeof this.schema)try{this.parsedSchema=JSON.parse(this.schema)}catch{this.parsedSchema=null}else this.parsedSchema=this.schema;else this.parsedSchema=null}initItemStates(){this.getAllItems().forEach((o=>{if(!this.itemStates.has(o.id)){const t={id:o.id,disabled:o.disabled};"value"in o&&(t.value=o.value),"checked"in o&&(t.value=o.checked),"active"in o&&(t.active=o.active),this.itemStates.set(o.id,t)}}))}getAllItems(){const o=[],t=r=>{r?.forEach((r=>{o.push(r),"group"===r.type&&t(r.items)}))};return this.parsedSchema?(t(this.parsedSchema.left??[]),t(this.parsedSchema.center??[]),t(this.parsedSchema.right??[]),t(this.parsedSchema.overflow??[])):t(this.parsedItems),o}findItem(o){return this.getAllItems().find((t=>t.id===o))??null}recalcOverflow(){if("dropdown"!==this.overflowStrategy)return;const o=this.toolbarBodyRef;if(!o)return;const t=new Set;if(this.isMobile=window.innerWidth<=this.mobileBreakpoint,this.isMobile&&this.isCollapsed)this.getAllItems().forEach((o=>{"separator"!==o.type&&"spacer"!==o.type&&t.add(o.id)}));else{const r="horizontal"===this.orientation,e=r?o.clientWidth:o.clientHeight,a=48;let i=0;[...this.getAllItems()].filter((o=>"separator"!==o.type&&"spacer"!==o.type)).sort(((o,t)=>(t.priority??0)-(o.priority??0))).forEach((o=>{if(this.itemStates.get(o.id)?.hidden)return;const s=this.el.shadowRoot?.querySelector(`[data-item-id="${o.id}"]`);s&&(i+=(r?s.offsetWidth:s.offsetHeight)+4,i>e-a&&!o.pinToOverflow&&t.add(o.id))}))}const r=this.overflowedIds;JSON.stringify([...t].sort())!==JSON.stringify([...r].sort())&&(this.overflowedIds=t,this.toolbarOverflowChange.emit({overflowIds:[...t],visibleIds:this.getAllItems().filter((o=>!t.has(o.id))).map((o=>o.id))}))}pushUndoSnapshot(){this.getStateSnapshot().then((o=>{this.undoStack.push(o),this.undoStack.length>50&&this.undoStack.shift(),this.redoStack=[]}))}handleItemClick(o,t){if(!(this.disabled\|\|this.itemStates.get(o.id)?.disabled\|\|o.disabled)){if(this.pushUndoSnapshot(),("button"===o.type\|\|"icon-button"===o.type)&&o.toggleable){const t=this.itemStates.get(o.id)??{id:o.id};this.itemStates=new Map(this.itemStates.set(o.id,{...t,active:!t.active}))}this.toolbarItemClick.emit({item:o,originalEvent:t})}}handleValueChange(o,t){if(this.disabled\|\|this.itemStates.get(o.id)?.disabled)return;this.pushUndoSnapshot();const r=this.itemStates.get(o.id)?.value;this.itemStates=new Map(this.itemStates.set(o.id,{...this.itemStates.get(o.id),id:o.id,value:t})),this.toolbarItemChange.emit({item:o,value:t,previousValue:r})}isItemDisabled(o){return this.disabled\|\|!!o.disabled\|\|!!this.itemStates.get(o.id)?.disabled}isItemHidden(o){return!!this.itemStates.get(o.id)?.hidden}isItemLoading(o){return!!this.itemStates.get(o.id)?.loading}isItemActive(o){const t=this.itemStates.get(o.id);return void 0!==t?.active?t.active:o.active??!1}computeItemValue(o){const t=this.itemStates.get(o.id);return void 0!==t?.value?t.value:"value"in o?o.value:"checked"in o?o.checked:void 0}handleDragStart(o){this.dragSourceId=o}handleDrop(o){if(!this.dragSourceId\|\|this.dragSourceId===o)return;const t=[...this.parsedItems],r=t.findIndex((o=>o.id===this.dragSourceId)),e=t.findIndex((t=>t.id===o));if(r<0\|\|e<0)return;const[a]=t.splice(r,1);t.splice(e,0,a),this.parsedItems=[...t],this.dragSourceId=null,this.toolbarReorder.emit(t)}renderItem(o,t=!1){if(this.isItemHidden(o))return null;if(!t&&this.overflowedIds.has(o.id)&&"dropdown"===this.overflowStrategy)return null;const r=this.isItemDisabled(o),a=this.isItemLoading(o);switch(o.type){case"button":case"icon-button":return this.renderButton(o,r,a,t);case"dropdown":return this.renderDropdown(o,r);case"input":case"search":return this.renderInput(o,r,t);case"toggle":case"switch":return this.renderToggle(o,r,t);case"toggle-group":return this.renderToggleGroup(o,r,t);case"avatar":return this.renderAvatar(o,t);case"separator":return this.renderSeparator();case"spacer":return e("span",{class:"toolbar-spacer",style:{flex:(o.flex??1)+""}});case"text":return this.renderText(o);case"badge":return this.renderBadge(o);case"custom":return this.renderCustom(o);case"group":return this.renderGroup(o,t);default:return null}}renderButton(o,t,r,a){const i=this.isItemActive(o),s=o.iconLibrary??this.iconLibrary,n=o.iconOnly??(!o.label\|\|this.iconOnly);if(a)return e("li",{class:{"overflow-item":!0,"is-active":i,"is-disabled":t},role:"menuitem","aria-disabled":t?"true":null,onClick:t?null:t=>{this.handleItemClick(o,t),this.isOverflowOpen=!1},onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key\|\|(this.handleItemClick(o,t),this.isOverflowOpen=!1)},tabIndex:t?-1:0,"data-item-id":o.id},o.icon&&e("ui-icon",{name:o.icon,library:s,size:"16px"}),e("span",{class:"overflow-item-label"},o.label??o.id),i&&e("span",{class:"overflow-item-check"},"✓"));const l="ghost"!==o.variant&&"outline"!==o.variant&&o.variant?o.variant:o.variant??"ghost";return e("div",{class:{"toolbar-item":!0,"toolbar-item--button":!0,[o.className??""]:!!o.className},"data-item-id":o.id,draggable:this.reorderable,onDragStart:()=>this.handleDragStart(o.id),onDrop:()=>this.handleDrop(o.id),onDragOver:o=>o.preventDefault()},e("ui-button",{label:n?void 0:o.label,icon:o.icon,"icon-library":s,"icon-only":n,variant:l,size:this.size,disabled:t,loading:r,selected:i,active:i,noRipple:!0,href:o.href,target:o.target,tooltip:o.tooltip,"aria-label":o.ariaLabel??(n?o.label:void 0),badge:null!=o.badge?o.badge+"":void 0,ref:t=>t&&this.focusableRefs.set(o.id,t),onButtonClick:t?null:t=>this.handleItemClick(o,t.detail)}))}renderDropdown(o,t){const r=this.computeItemValue(o)??"",a=o.iconLibrary??this.iconLibrary;return e("div",{class:{"toolbar-item":!0,"toolbar-item--dropdown":!0,"is-disabled":t,[o.className??""]:!!o.className},"data-item-id":o.id,title:o.tooltip},e("ui-dropdown",{options:o.options,value:r,placeholder:o.placeholder??o.label??"Select",disabled:t,multiSelect:o.multiSelect,searchable:o.searchable,clearable:o.clearable,size:this.size,onDropdownChange:t=>this.handleValueChange(o,t.detail?.value)},o.icon&&e("ui-icon",{slot:"prefix",name:o.icon,library:a,size:"16px"})))}renderInput(o,t,r){if(r)return null;const a=this.computeItemValue(o)??"",i=t=>{const r=o.debounce??this.inputDebounce;this.inputDebounceTimers.has(o.id)&&clearTimeout(this.inputDebounceTimers.get(o.id));const e=setTimeout((()=>this.handleValueChange(o,t)),r);this.inputDebounceTimers.set(o.id,e)};return e("div",{class:{"toolbar-item":!0,"toolbar-item--input":!0,"is-disabled":t,[o.className??""]:!!o.className},"data-item-id":o.id,style:{minWidth:o.minWidth,maxWidth:o.maxWidth}},e("ui-input",{value:a,placeholder:o.placeholder??("search"===o.type?"Search…":""),disabled:t,size:this.size,clearable:o.clearable,"prefix-icon":"search"===o.type?"search":o.icon,"icon-library":this.iconLibrary,ref:t=>t&&this.focusableRefs.set(o.id,t),onInputChange:o=>i(o.detail)}))}renderToggle(o,t,r){const a=this.computeItemValue(o)??!1;return r?e("li",{class:{"overflow-item":!0,"overflow-item--toggle":!0,"is-disabled":t},role:"menuitemcheckbox","aria-checked":a+"","aria-disabled":t?"true":null,tabIndex:t?-1:0,"data-item-id":o.id,onClick:t?null:()=>this.handleValueChange(o,!a),onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key\|\|this.handleValueChange(o,!a)}},e("span",{class:"overflow-item-label"},o.label??o.id),e("span",{class:"overflow-toggle"+(a?" is-on":"")},a?"ON":"OFF")):e("div",{class:{"toolbar-item":!0,"toolbar-item--toggle":!0,"is-disabled":t,[o.className??""]:!!o.className},"data-item-id":o.id,title:o.tooltip},"right"!==o.labelPosition&&o.label&&e("span",{class:"toolbar-toggle-label"},o.label),e("ui-switch",{checked:a,disabled:t,size:this.size,label:"right"===o.labelPosition?o.label:void 0,"label-position":o.labelPosition??"right",ref:t=>t&&this.focusableRefs.set(o.id,t),onSwitchChange:t=>this.handleValueChange(o,t.detail.checked)}))}renderToggleGroup(o,t,r){if(r)return null;const a=this.computeItemValue(o)??"";return e("div",{class:{"toolbar-item":!0,"toolbar-item--toggle-group":!0,"is-disabled":t,[o.className??""]:!!o.className},"data-item-id":o.id,title:o.tooltip},e("ui-toggle-group",{options:o.options,value:Array.isArray(a)?a.join(","):a,disabled:t,size:o.size??this.size,color:o.color,variant:o.variant,shape:o.shape,"selection-mode":o.selectionMode??"single",onToggleGroupChange:t=>this.handleValueChange(o,t.detail.value)}))}renderAvatar(o,t){return t?e("li",{class:{"overflow-item":!0,"overflow-item--avatar":!0},role:"menuitem",tabIndex:0,"data-item-id":o.id},e("ui-avatar",{src:o.src,name:o.name,size:o.size??"24px",status:o.status,shape:"circle"}),o.name&&e("span",{class:"overflow-item-label"},o.name)):e("div",{class:{"toolbar-item":!0,"toolbar-item--avatar":!0,"is-clickable":o.clickable,[o.className??""]:!!o.className},"data-item-id":o.id,title:o.tooltip??o.name,role:o.clickable?"button":null,tabIndex:o.clickable?0:null,ref:t=>o.clickable&&t&&this.focusableRefs.set(o.id,t),onClick:o.clickable?t=>this.handleItemClick(o,t):null,onKeyDown:t=>{!o.clickable\|\|"Enter"!==t.key&&" "!==t.key\|\|this.handleItemClick(o,t)}},e("ui-avatar",{src:o.src,name:o.name,size:o.size??"28px",status:o.status,shape:"circle"}),null!=o.badge&&e("span",{class:"toolbar-badge toolbar-badge--primary"},o.badge))}renderSeparator(){return e("div",{class:"toolbar-separator"+("vertical"===this.orientation?" toolbar-separator--horizontal":""),role:"separator","aria-orientation":"vertical"===this.orientation?"horizontal":"vertical"})}renderText(o){return e("span",{class:{"toolbar-item":!0,"toolbar-text":!0,"toolbar-text--bold":o.bold,"toolbar-text--muted":o.muted,[o.className??""]:!!o.className},"data-item-id":o.id},o.content)}renderBadge(o){return e("span",{class:`toolbar-item toolbar-status-badge toolbar-status-badge--${o.color??"primary"}${o.dot?" is-dot":""}`,"data-item-id":o.id},!o.dot&&o.label)}renderCustom(o){return o.component?e(o.component,{"data-item-id":o.id,...o.componentProps??{}}):o.html?e("div",{class:"toolbar-item toolbar-item--custom","data-item-id":o.id,innerHTML:o.html}):null}renderGroup(o,t){const r=!1===this.itemStates.get(o.id)?.active;return e("div",{class:{"toolbar-group":!0,"toolbar-group--divider":o.divider,"is-collapsed":r,[o.className??""]:!!o.className},"data-item-id":o.id,role:"group","aria-label":o.label},o.label&&e("span",{class:"toolbar-group__label",onClick:o.collapsible?()=>{const t=this.itemStates.get(o.id)??{id:o.id};this.itemStates=new Map(this.itemStates.set(o.id,{...t,active:!t.active}))}:null},o.label),!r&&o.items.map((o=>this.renderItem(o,t))))}renderOverflowMenu(){const o=this.getAllItems().filter((o=>this.overflowedIds.has(o.id)\|\|o.pinToOverflow));return 0===o.length?null:e("div",{class:"toolbar-overflow"+(this.isOverflowOpen?" is-open":"")},e("ui-button",{class:"toolbar-overflow__btn toolbar-item toolbar-item--button toolbar-item--ghost","aria-haspopup":"menu","aria-expanded":this.isOverflowOpen+"","aria-label":this.overflowLabel,title:this.overflowLabel,variant:"ghost",onButtonClick:o=>{o.detail.stopPropagation(),this.isOverflowOpen=!this.isOverflowOpen},icon:this.overflowIcon,"icon-library":this.iconLibrary,badge:o.length+"",iconOnly:!0}),this.isOverflowOpen&&e("ul",{class:"toolbar-overflow__menu",style:{overflow:"visible"},role:"menu","aria-label":this.overflowLabel},o.map((o=>this.renderItem(o,!0)))))}renderZone(o,t){return o?.length?e("div",{class:"toolbar-zone toolbar-zone--"+t,role:"group","aria-label":t},o.map((o=>this.renderItem(o)))):null}render(){const o=!!this.parsedSchema,t={gap:this.gap,padding:"inline"===this.variant?"0":this.padding},r={["variant-"+this.variant]:!0,["orientation-"+this.orientation]:!0,["position-"+this.position]:!0,["size-"+this.size]:!0,["elevation-"+this.elevation]:!0,["align-"+this.alignment]:!0,"is-rounded":this.rounded,"is-bordered":this.bordered,"is-disabled":this.disabled,"is-loading":this.loading,"is-collapsed":this.isCollapsed,"is-mobile":this.isMobile,"is-overflow-open":this.isOverflowOpen,"has-open-overlay":this.isOverflowOpen\|\|this.openChildDropdowns>0,"has-zone-dividers":this.zoneDividers,"has-overflow":this.overflowedIds.size>0,["overflow-"+this.overflowStrategy]:!0},i={};return"sticky"!==this.position&&"fixed"!==this.position\|\|(i[this.stickyEdge]="0"),this.maxSize&&(i["horizontal"===this.orientation?"maxWidth":"maxHeight"]=this.maxSize),e(a,{key:"036f6c8d9b98ab609f212929d6f55f0fde7cc074",class:r,style:i,role:"toolbar","aria-label":this.toolbarAriaLabel,"aria-disabled":this.disabled?"true":null},this.isMobile&&e("ui-button",{key:"4332c51f7597bd1be7da3841236b5807c79f56e3",class:"toolbar-mobile-toggle","aria-expanded":!this.isCollapsed+"","aria-label":this.isCollapsed?"Expand toolbar":"Collapse toolbar",onButtonClick:()=>{this.isCollapsed=!this.isCollapsed},variant:"ghost",icon:this.isCollapsed?"menu":"x","icon-library":this.iconLibrary,iconOnly:!0}),(!this.isMobile\|\|!this.isCollapsed)&&e("div",{key:"721bc0717cac042661c3e0752fd9908b0c1052e5",class:"toolbar-body",style:t,ref:o=>this.toolbarBodyRef=o},e("slot",{key:"021a9b2a763cba4dd80066d31f858dc6517630a7",name:"before"}),o?e("div",{class:"toolbar-zones"},this.renderZone(this.parsedSchema.left??[],"left"),this.zoneDividers&&this.parsedSchema.left?.length>0&&this.parsedSchema.center?.length>0&&this.renderSeparator(),this.renderZone(this.parsedSchema.center??[],"center"),this.zoneDividers&&this.parsedSchema.center?.length>0&&this.parsedSchema.right?.length>0&&this.renderSeparator(),this.renderZone(this.parsedSchema.right??[],"right")):this.parsedItems.map((o=>this.renderItem(o))),e("slot",{key:"4cbff6aede8517e2bee4c8bdf388831d9268796f",name:"left"}),e("slot",{key:"00836db35af163fe591451ec2dde1bbce0e74d9b",name:"center"}),e("slot",{key:"7a6a2a43511cf7798a1b99d8a2f1f95fb47f66fb",name:"right"}),e("slot",{key:"9f789b3b3a6f5ee83470b625452024deecba3fd8"}),"dropdown"===this.overflowStrategy&&this.renderOverflowMenu(),e("slot",{key:"bc777e8b94344da25d05000eee4090a5959f57c6",name:"after"})))}static get watchers(){return{items:[{onItemsChange:0}],schema:[{onSchemaChange:0}]}}static get style(){return'@charset "UTF-8";.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{--toolbar-height:48px;--toolbar-padding:8px 12px;--toolbar-gap:4px;--toolbar-bg:var(--bg-primary, #ffffff);--toolbar-border-color:var(--border-default, #e5e7eb);--toolbar-text:var(--text-primary, #111827);--toolbar-muted:var(--text-secondary, #6b7280);--toolbar-separator-color:var(--border-default, #e5e7eb);--toolbar-item-bg:transparent;--toolbar-item-bg-hover:var(--bg-secondary, #f3f4f6);--toolbar-item-bg-active:var(--color-primary-light, #eff6ff);--toolbar-item-color:var(--text-primary, #374151);--toolbar-item-color-active:var(--color-primary, #2563eb);--toolbar-item-radius:6px;--toolbar-item-height-sm:28px;--toolbar-item-height-md:34px;--toolbar-item-height-lg:40px;--toolbar-item-height-xl:48px;--toolbar-item-padding-sm:0 8px;--toolbar-item-padding-md:0 12px;--toolbar-item-padding-lg:0 16px;--toolbar-switch-width:34px;--toolbar-switch-height:18px;--toolbar-switch-on:var(--color-primary, #2563eb);--toolbar-switch-off:var(--border-strong, #d1d5db);--toolbar-switch-thumb:#ffffff;--toolbar-badge-bg:var(--color-danger, #ef4444);--toolbar-badge-color:#ffffff;--toolbar-badge-size:16px;--toolbar-overflow-menu-bg:#ffffff;--toolbar-overflow-menu-border:rgba(0, 0, 0, 0.08);--toolbar-overflow-menu-shadow:0 20px 50px rgba(0, 0, 0, 0.2), 0 10px 20px rgba(0, 0, 0, 0.1);--toolbar-overflow-menu-radius:16px;--toolbar-overflow-item-height:40px;--toolbar-transition:0.15s ease;--toolbar-shadow-1:0 1px 3px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .04);--toolbar-shadow-2:0 4px 12px rgba(0, 0, 0, .08), 0 2px 4px rgba(0, 0, 0, .05);--toolbar-shadow-3:0 8px 24px rgba(0, 0, 0, .10), 0 4px 8px rgba(0, 0, 0, .06);--toolbar-shadow-4:0 16px 40px rgba(0, 0, 0, .12), 0 6px 12px rgba(0, 0, 0, .07);display:block;box-sizing:border-box;position:relative;max-width:100%}:host{--_item-h:var(--toolbar-item-height-md);--_item-p:var(--toolbar-item-padding-md)}:host(.size-sm){--_item-h:var(--toolbar-item-height-sm);--_item-p:var(--toolbar-item-padding-sm)}:host(.size-md){--_item-h:var(--toolbar-item-height-md);--_item-p:var(--toolbar-item-padding-md)}:host(.size-lg){--_item-h:var(--toolbar-item-height-lg);--_item-p:var(--toolbar-item-padding-lg)}:host(.size-xl){--_item-h:var(--toolbar-item-height-xl);--_item-p:var(--toolbar-item-padding-lg)}.toolbar-body{display:flex;align-items:center;flex-wrap:nowrap;box-sizing:border-box;width:100%;max-width:100%;min-width:0;min-height:var(--toolbar-height);background:var(--toolbar-bg);color:var(--toolbar-text);font-family:var(--font-family);font-size:13px;transition:background var(--toolbar-transition), color var(--toolbar-transition);position:relative}:host(.orientation-vertical) .toolbar-body{flex-direction:column;align-items:stretch;width:var(--toolbar-height);min-height:unset;height:100%}:host(.align-start) .toolbar-body{justify-content:flex-start}:host(.align-center) .toolbar-body{justify-content:center}:host(.align-end) .toolbar-body{justify-content:flex-end}:host(.align-space-between) .toolbar-body{justify-content:space-between}:host(.align-space-around) .toolbar-body{justify-content:space-around}:host(.align-space-evenly) .toolbar-body{justify-content:space-evenly}:host .toolbar-body{overflow:hidden}:host(.overflow-scroll) .toolbar-body{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;}:host(.orientation-vertical) :host(.overflow-scroll) .toolbar-body{overflow-x:hidden;overflow-y:auto}:host(.overflow-scroll) .toolbar-body{scrollbar-width:thin;scrollbar-color:var(--toolbar-muted) transparent}:host(.overflow-scroll) .toolbar-body::-webkit-scrollbar{width:4px;height:4px;background:transparent}:host(.overflow-scroll) .toolbar-body::-webkit-scrollbar-thumb{background:var(--toolbar-muted);border-radius:4px;border:1px solid transparent;background-clip:content-box;opacity:0.5}:host(.overflow-scroll) .toolbar-body{}:host(.overflow-scroll) .toolbar-body:not(:hover){scrollbar-color:transparent transparent}:host(.overflow-scroll) .toolbar-body:not(:hover)::-webkit-scrollbar-thumb{background:transparent}:host(.overflow-visible) .toolbar-body{overflow:visible}:host(.overflow-wrap) .toolbar-body{flex-wrap:wrap;height:auto;min-height:var(--toolbar-height)}:host(.overflow-dropdown) .toolbar-body{overflow:hidden}:host(.overflow-dropdown.has-open-overlay) .toolbar-body,:host(.overflow-dropdown.is-overflow-open) .toolbar-body,:host(.overflow-dropdown.has-open-dropdown) .toolbar-body,:host(.has-open-overlay) .toolbar-body{overflow:visible}:host(.elevation-0) .toolbar-body{box-shadow:none}:host(.elevation-1) .toolbar-body{box-shadow:var(--toolbar-shadow-1)}:host(.elevation-2) .toolbar-body{box-shadow:var(--toolbar-shadow-2)}:host(.elevation-3) .toolbar-body{box-shadow:var(--toolbar-shadow-3)}:host(.elevation-4) .toolbar-body{box-shadow:var(--toolbar-shadow-4)}:host(.is-bordered) .toolbar-body{border:1px solid var(--toolbar-border-color)}:host(.is-rounded) .toolbar-body{border-radius:12px}:host(.position-sticky){position:sticky;z-index:var(--z-sticky, 10)}:host(.position-fixed){position:fixed;z-index:var(--z-toolbar, 20);width:100%}:host(.variant-primary) .toolbar-body{background:var(--color-primary, #2563eb);color:#ffffff;--toolbar-item-color:rgba(255, 255, 255, 0.92);--toolbar-item-bg-hover:rgba(255, 255, 255, 0.12);--toolbar-item-bg-active:rgba(255, 255, 255, 0.2);--toolbar-item-color-active:#ffffff;--toolbar-separator-color:rgba(255, 255, 255, 0.2)}:host(.variant-secondary) .toolbar-body{background:var(--bg-secondary, #f8fafc);--toolbar-item-bg-hover:var(--bg-primary, #ffffff)}:host(.variant-minimal) .toolbar-body{background:transparent;box-shadow:none;border-bottom:1px solid var(--toolbar-border-color)}:host(.variant-glass) .toolbar-body{background:rgba(255, 255, 255, 0.12);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid rgba(255, 255, 255, 0.15);box-shadow:0 8px 32px rgba(31, 38, 135, 0.1);--toolbar-item-color:var(--text-primary, #1e293b);--toolbar-item-bg-hover:rgba(255, 255, 255, 0.2);--toolbar-separator-color:rgba(255, 255, 255, 0.2)}:host(.variant-elevated) .toolbar-body{box-shadow:var(--toolbar-shadow-3);border-bottom:none}:host(.variant-outlined) .toolbar-body{background:transparent;border:1px solid var(--toolbar-border-color);box-shadow:none}:host(.variant-dark) .toolbar-body{background:var(--bg-dark, #1e293b);color:#f1f5f9;--toolbar-item-color:rgba(241, 245, 249, 0.9);--toolbar-item-bg-hover:rgba(255, 255, 255, 0.08);--toolbar-item-bg-active:rgba(99, 102, 241, 0.25);--toolbar-item-color-active:#818cf8;--toolbar-separator-color:rgba(255, 255, 255, 0.1);--toolbar-overflow-menu-bg:#1e293b;--toolbar-overflow-menu-border:rgba(255, 255, 255, 0.1)}:host(.variant-inline){display:inline-block;width:auto}:host(.variant-inline) .toolbar-body{width:auto;min-height:auto;background:transparent;box-shadow:none;border:none;border-radius:0;padding:0 !important;overflow:visible}.toolbar-zones{display:flex;align-items:center;width:100%;max-width:100%;min-width:0;gap:inherit}.toolbar-zone{display:flex;align-items:center;gap:inherit;flex-shrink:0;max-width:100%;min-width:0}.toolbar-zone--left{margin-right:auto}.toolbar-zone--right{margin-left:auto}.toolbar-zone--center{flex:1;justify-content:center}:host(.has-zone-dividers) .toolbar-zones .toolbar-zone+.toolbar-zone{border-left:1px solid var(--toolbar-separator-color);padding-left:12px;margin-left:12px}.toolbar-item{display:inline-flex;align-items:center;justify-content:center;gap:5px;height:var(--_item-h);padding:var(--_item-p);border-radius:var(--toolbar-item-radius);color:var(--toolbar-item-color);background:var(--toolbar-item-bg);border:none;cursor:pointer;user-select:none;white-space:nowrap;font-size:inherit;font-weight:500;transition:background var(--toolbar-transition), color var(--toolbar-transition), box-shadow var(--toolbar-transition), opacity var(--toolbar-transition), transform 0.1s ease;outline:none;text-decoration:none;flex-shrink:0;position:relative;max-width:100%;min-width:0}.toolbar-item--button,.toolbar-item--input,.toolbar-item--search,.toolbar-item--toggle,.toolbar-item--toggle-group{padding:0 !important;background:transparent !important;border:none !important;box-shadow:none !important;height:auto !important;cursor:default !important}.toolbar-item--dropdown{overflow:visible;padding:0 !important;background:transparent !important;border:none !important;box-shadow:none !important;height:auto !important;cursor:default !important;}.toolbar-item--dropdown .dropdown-trigger,.toolbar-item--dropdown .dropdown-container .dropdown-trigger{height:var(--_item-h) !important;min-height:var(--_item-h) !important;max-height:var(--_item-h) !important;padding:0 10px !important;font-size:inherit !important;box-sizing:border-box}.toolbar-item--dropdown{}.toolbar-item--dropdown .dropdown-has-chips .dropdown-trigger{height:auto !important;min-height:var(--_item-h) !important;max-height:none !important}.toolbar-item:focus-visible{box-shadow:0 0 0 2px var(--color-primary, #2563eb);outline:none}.toolbar-item--button:hover:not(.is-disabled),.toolbar-item--avatar.is-clickable:hover{background:var(--toolbar-item-bg-hover)}.toolbar-item--button.is-active{background:var(--toolbar-item-bg-active);color:var(--toolbar-item-color-active)}.toolbar-item--button:active:not(.is-disabled){transform:scale(0.96)}.toolbar-item.is-icon-only{padding:0;width:var(--_item-h)}.toolbar-item.is-disabled,.toolbar-item[aria-disabled=true]{opacity:0.45;cursor:not-allowed;pointer-events:none}.toolbar-item.is-loading{cursor:wait;pointer-events:none}.toolbar-item--primary{background:var(--color-primary, #2563eb);color:#fff}.toolbar-item--primary:hover{background:var(--color-primary-hover, #1d4ed8)}.toolbar-item--secondary{background:var(--bg-secondary, #f1f5f9);color:var(--text-primary, #374151)}.toolbar-item--secondary:hover{background:var(--bg-tertiary, #e2e8f0)}.toolbar-item--danger{background:var(--color-danger, #ef4444);color:#fff}.toolbar-item--danger:hover{background:#dc2626}.toolbar-item--success{background:var(--color-success, #10b981);color:#fff}.toolbar-item--warning{background:var(--color-warning, #f59e0b);color:#fff}.toolbar-item--ghost,.toolbar-item--outline{background:transparent;color:var(--toolbar-item-color)}.toolbar-item--outline{border:1px solid var(--toolbar-border-color)}.toolbar-item__label{line-height:1}.toolbar-separator{width:1px;align-self:stretch;margin:4px 2px;background:var(--toolbar-separator-color);flex-shrink:0}.toolbar-separator--horizontal{width:100%;height:1px;margin:2px 4px}.toolbar-spacer{display:block;flex-shrink:0}.toolbar-text{cursor:default;font-size:13px;color:var(--toolbar-text);padding:0 6px;height:auto}.toolbar-text--bold{font-weight:700}.toolbar-text--muted{color:var(--toolbar-muted)}.toolbar-status-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:0.03em;height:auto}.toolbar-status-badge--primary{background:#dbeafe;color:#1d4ed8}.toolbar-status-badge--success{background:#d1fae5;color:#065f46}.toolbar-status-badge--danger{background:#fee2e2;color:#991b1b}.toolbar-status-badge--warning{background:#fef3c7;color:#92400e}.toolbar-status-badge--info{background:#e0f2fe;color:#0369a1}.toolbar-status-badge.is-dot{width:8px;height:8px;border-radius:50%;padding:0}.toolbar-badge{position:absolute;top:2px;right:2px;min-width:var(--toolbar-badge-size);height:var(--toolbar-badge-size);border-radius:999px;padding:0 3px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;line-height:1;background:var(--toolbar-badge-bg);color:var(--toolbar-badge-color);box-shadow:0 0 0 2px var(--toolbar-bg);pointer-events:none}.toolbar-badge--success{background:var(--color-success, #10b981)}.toolbar-badge--warning{background:var(--color-warning, #f59e0b)}.toolbar-badge--info{background:var(--color-info, #2563eb)}.toolbar-item--input,.toolbar-item--search{padding:0;background:transparent;cursor:default}.toolbar-input-wrap{display:flex;align-items:center;gap:6px;height:var(--_item-h);padding:0 10px;border:1px solid var(--toolbar-border-color);border-radius:var(--toolbar-item-radius);background:var(--bg-primary, #fff);transition:border-color var(--toolbar-transition), box-shadow var(--toolbar-transition);min-width:160px;max-width:260px}.toolbar-input-wrap--search{min-width:180px}.toolbar-input-wrap:focus-within{border-color:var(--color-primary, #2563eb);box-shadow:0 0 0 2px rgba(37, 99, 235, 0.12)}.toolbar-input{flex:1;border:none;outline:none;background:transparent;color:var(--toolbar-text);font-size:13px;font-family:inherit;min-width:0}.toolbar-input::placeholder{color:var(--toolbar-muted)}.toolbar-input-icon{color:var(--toolbar-muted);flex-shrink:0}.toolbar-input-clear{display:flex;align-items:center;padding:2px;background:none;border:none;cursor:pointer;color:var(--toolbar-muted);border-radius:4px;transition:color var(--toolbar-transition), background var(--toolbar-transition);flex-shrink:0}.toolbar-input-clear:hover{color:var(--toolbar-text);background:var(--toolbar-item-bg-hover)}.toolbar-item--toggle{gap:8px;cursor:default;padding:0 8px;background:transparent}.toolbar-toggle-label{font-size:13px;color:var(--toolbar-item-color);white-space:nowrap}.toolbar-switch{position:relative;width:var(--toolbar-switch-width);height:var(--toolbar-switch-height);border-radius:999px;background:var(--toolbar-switch-off);border:none;cursor:pointer;transition:background var(--toolbar-transition);outline:none;flex-shrink:0;padding:0}.toolbar-switch:focus-visible{box-shadow:0 0 0 2px var(--color-primary, #2563eb)}.toolbar-switch.is-on{background:var(--toolbar-switch-on)}.toolbar-switch__thumb{position:absolute;top:2px;left:2px;width:calc(var(--toolbar-switch-height) - 4px);height:calc(var(--toolbar-switch-height) - 4px);border-radius:50%;background:var(--toolbar-switch-thumb);box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);transition:transform var(--toolbar-transition)}.toolbar-switch.is-on .toolbar-switch__thumb{transform:translateX(calc(var(--toolbar-switch-width) - var(--toolbar-switch-height)))}.toolbar-item--avatar{padding:0 4px;position:relative;background:transparent}.toolbar-item--avatar.is-clickable{cursor:pointer;padding:4px}.toolbar-item--avatar.is-clickable:hover{background:var(--toolbar-item-bg-hover)}.toolbar-group{display:inline-flex;align-items:center;gap:inherit;flex-shrink:0;max-width:100%;min-width:0}.toolbar-group--divider{border-left:1px solid var(--toolbar-separator-color);padding-left:8px;margin-left:4px}.toolbar-group__label{font-size:11px;font-weight:600;color:var(--toolbar-muted);text-transform:uppercase;letter-spacing:0.06em;padding:0 4px}.toolbar-group.is-collapsed>:not(.toolbar-group__label){display:none}.toolbar-spinner{width:14px;height:14px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:toolbar-spin 0.7s linear infinite}@keyframes toolbar-spin{to{transform:rotate(360deg)}}.toolbar-overflow{position:absolute;right:var(--toolbar-overflow-right, 0px);top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;flex-shrink:0;z-index:var(--z-dropdown, 100);background:var(--toolbar-bg);}.toolbar-overflow::before{content:"";position:absolute;right:100%;top:0;bottom:0;width:24px;background:linear-gradient(to right, transparent, var(--toolbar-bg));pointer-events:none}.toolbar-overflow.is-open .toolbar-overflow__menu{display:block !important;opacity:1 !important;transform:scale(1) translateY(0) !important;visibility:visible !important}.toolbar-overflow__btn{position:relative}.toolbar-overflow__badge{position:absolute;top:1px;right:1px;min-width:14px;height:14px;background:var(--color-primary, #2563eb);color:#fff;border-radius:999px;font-size:9px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 2px;pointer-events:none;box-shadow:0 0 0 2px var(--toolbar-bg)}.toolbar-overflow__menu{position:absolute;top:calc(100% + 6px);right:0;z-index:var(--z-dropdown, 100);list-style:none;margin:0;padding:6px;min-width:180px;background:var(--toolbar-overflow-menu-bg);border:1px solid var(--toolbar-overflow-menu-border);border-radius:var(--toolbar-overflow-menu-radius);box-shadow:var(--toolbar-overflow-menu-shadow);animation:toolbar-overflow-in 0.15s cubic-bezier(0.34, 1.56, 0.64, 1);max-height:320px;overflow-y:auto}:host(.orientation-vertical) .toolbar-overflow__menu{top:0;left:calc(100% + 6px);right:auto}@keyframes toolbar-overflow-in{from{opacity:0;transform:scale(0.95) translateY(-6px)}to{opacity:1;transform:scale(1) translateY(0)}}.overflow-item{display:flex;align-items:center;gap:8px;height:var(--toolbar-overflow-item-height);padding:0 10px;border-radius:6px;cursor:pointer;color:var(--toolbar-item-color);font-size:13px;font-weight:500;transition:background var(--toolbar-transition), color var(--toolbar-transition);outline:none;user-select:none;list-style:none}.overflow-item:hover,.overflow-item:focus-visible{background:var(--toolbar-item-bg-hover);color:var(--toolbar-item-color-active)}.overflow-item.is-active{color:var(--toolbar-item-color-active)}.overflow-item.is-disabled{opacity:0.45;cursor:not-allowed;pointer-events:none}.overflow-item-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.overflow-item-check{color:var(--toolbar-item-color-active);font-size:12px;font-weight:700}.overflow-item--toggle{justify-content:space-between}.overflow-toggle{font-size:11px;font-weight:600;padding:2px 6px;border-radius:4px;background:var(--toolbar-item-bg-hover);color:var(--toolbar-muted)}.overflow-toggle.is-on{background:var(--toolbar-item-bg-active);color:var(--toolbar-item-color-active)}.overflow-item--avatar{gap:10px}.toolbar-mobile-toggle{display:none;align-items:center;justify-content:center;width:36px;height:36px;background:none;border:none;cursor:pointer;color:var(--toolbar-text);border-radius:6px;transition:background var(--toolbar-transition);padding:0}.toolbar-mobile-toggle:hover{background:var(--toolbar-item-bg-hover)}:host(.is-mobile) .toolbar-mobile-toggle{display:flex}:host(.is-mobile) .toolbar-body,:host(.variant-inline) .toolbar-body{flex-wrap:wrap;align-items:flex-start}:host(.is-mobile.is-collapsed) .toolbar-body{display:none}:host(.is-mobile) .toolbar-zones,:host(.variant-inline) .toolbar-zones,:host(.overflow-wrap) .toolbar-zones{flex-wrap:wrap;align-items:flex-start}:host(.is-mobile) .toolbar-zone,:host(.variant-inline) .toolbar-zone,:host(.overflow-wrap) .toolbar-zone{flex-wrap:wrap;align-items:flex-start}:host(.is-mobile) .toolbar-zone--left,:host(.is-mobile) .toolbar-zone--center,:host(.is-mobile) .toolbar-zone--right{width:100%;margin-left:0;margin-right:0;justify-content:flex-start}:host(.is-mobile) .toolbar-item--input,:host(.variant-inline) .toolbar-item--input,:host(.is-mobile) .toolbar-item--search,:host(.variant-inline) .toolbar-item--search{flex:1 1 180px}:host(.orientation-vertical) .toolbar-item{width:100%;justify-content:flex-start;padding:0 14px;height:var(--_item-h)}:host(.orientation-vertical) .toolbar-item.is-icon-only{justify-content:center;padding:0}:host(.orientation-vertical) .toolbar-separator{width:80%;height:1px;margin:4px auto;align-self:center}:host(.orientation-vertical) .toolbar-overflow{position:absolute;bottom:0;right:auto;left:0;top:auto;transform:none;width:100%;justify-content:center}.toolbar-item[draggable=true]{cursor:grab}.toolbar-item[draggable=true]:active{cursor:grabbing;opacity:0.6}:host(.is-disabled) .toolbar-body{opacity:0.6;pointer-events:none;cursor:not-allowed}:host(.is-loading) .toolbar-body::after{content:"";position:absolute;bottom:0;left:0;height:2px;width:100%;background:linear-gradient(90deg, transparent 0%, var(--color-primary, #2563eb) 40%, transparent 100%);animation:toolbar-loading 1.4s ease infinite}@keyframes toolbar-loading{0%{transform:translateX(-100%)}100%{transform:translateX(200%)}}::slotted(){flex-shrink:0;max-width:100%;min-width:0}:host(.is-mobile) ::slotted(),:host(.variant-inline) ::slotted(){flex-shrink:1}.toolbar-item--custom{padding:0;background:transparent;height:auto;cursor:default;max-width:100%}'}},[769,"ui-toolbar",{schema:[1],items:[1],variant:[1],size:[1],orientation:[513],position:[513],stickyEdge:[1,"sticky-edge"],alignment:[1],gap:[1],padding:[1],maxSize:[1,"max-size"],overflowStrategy:[1,"overflow-strategy"],overflowLabel:[1,"overflow-label"],overflowIcon:[1,"overflow-icon"],iconLibrary:[1,"icon-library"],disabled:[4],loading:[4],zoneDividers:[4,"zone-dividers"],rounded:[4],elevation:[2],reorderable:[4],keyboardNav:[4,"keyboard-nav"],toolbarAriaLabel:[1,"toolbar-aria-label"],bordered:[4],iconOnly:[4,"icon-only"],inputDebounce:[2,"input-debounce"],overflowedIds:[32],isOverflowOpen:[32],itemStates:[32],dragSourceId:[32],parsedSchema:[32],parsedItems:[32],isMobile:[32],isCollapsed:[32],openChildDropdowns:[32],setItemValue:[64],getItemValue:[64],setItemDisabled:[64],setItemHidden:[64],setItemLoading:[64],toggleItem:[64],setCollapsed:[64],setOverflowOpen:[64],getStateSnapshot:[64],restoreStateSnapshot:[64],undo:[64],redo:[64],focusItem:[64]},[[4,"click","onDocumentClick"],[0,"keydown","onKeyDown"],[0,"dropdownOpen","onChildDropdownOpen"],[0,"dropdownClose","onChildDropdownClose"]],{items:[{onItemsChange:0}],schema:[{onSchemaChange:0}]}]),v=u,f=function(){"undefined"!=typeof customElements&&["ui-toolbar","ui-avatar","ui-badge","ui-button","ui-dropdown","ui-icon","ui-input","ui-loader","ui-switch","ui-tag","ui-toggle-group"].forEach((o=>{switch(o){case"ui-toolbar":customElements.get(i(o))\|\|customElements.define(i(o),u);break;case"ui-avatar":customElements.get(i(o))\|\|s();break;case"ui-badge":customElements.get(i(o))\|\|n();break;case"ui-button":customElements.get(i(o))\|\|l();break;case"ui-dropdown":customElements.get(i(o))\|\|b();break;case"ui-icon":customElements.get(i(o))\|\|d();break;case"ui-input":customElements.get(i(o))\|\|h();break;case"ui-loader":customElements.get(i(o))\|\|c();break;case"ui-switch":customElements.get(i(o))\|\|p();break;case"ui-tag":customElements.get(i(o))\|\|m();break;case"ui-toggle-group":customElements.get(i(o))\|\|g()}}))};export{v as UiToolbar,f as defineCustomElement}