atomicuilibrary 0.0.1

package/dist/components/ui-timer.js

@@ -0,0 +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";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?1e3*t: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?1e3*this.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?1e3*i: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?1e3*this.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.totalDuration*100<=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-283*i}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}]}]),c=l,p=function(){"undefined"!=typeof customElements&&["ui-timer","ui-badge","ui-button","ui-icon"].forEach((t=>{switch(t){case"ui-timer":customElements.get(o(t))||customElements.define(o(t),l);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()}}))};export{c as UiTimer,p as defineCustomElement}

package/dist/components/ui-toggle-group.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface UiToggleGroup extends Components.UiToggleGroup, HTMLElement {}
+export const UiToggleGroup: {
+    prototype: UiToggleGroup;
+    new (): UiToggleGroup;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ui-toggle-group.js

@@ -0,0 +1 @@
+import{U as o,d as r}from"./toggle-group.js";const s=o,t=r;export{s as UiToggleGroup,t as defineCustomElement}

package/dist/components/ui-toolbar.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface UiToolbar extends Components.UiToolbar, HTMLElement {}
+export const UiToolbar: {
+    prototype: UiToolbar;
+    new (): UiToolbar;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ui-toolbar.js

@@ -0,0 +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"./switch.js";import{d as p}from"./tag.js";import{d as m}from"./toggle-group.js";const g=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:"6b33477b806940fbb98394621c375a70853128a9",class:r,style:i,role:"toolbar","aria-label":this.toolbarAriaLabel,"aria-disabled":this.disabled?"true":null},this.isMobile&&e("ui-button",{key:"12131b32e8813702f466625f77a38c3978bb4147",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:"3e203ab7c3349576bae4f42b906ec702b97b18af",class:"toolbar-body",style:t,ref:o=>this.toolbarBodyRef=o},e("slot",{key:"5c2f402b9d318651a0007b3ed80064f711f6e3a5",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:"d8e7b2fec2cad8fe068792c0a4cb0e7b7d0b002e",name:"left"}),e("slot",{key:"4445e8c225d7249ddd65fe1164dc78a924d63530",name:"center"}),e("slot",{key:"d590115edf7ff9d04cb0e36b5cac629b85901b09",name:"right"}),e("slot",{key:"cf6631fd34e189258bea03f5b653ee4d766f3d78"}),"dropdown"===this.overflowStrategy&&this.renderOverflowMenu(),e("slot",{key:"f97fe02b2756a3cbb7b82965d57e767597834ee7",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}]}]),u=g,v=function(){"undefined"!=typeof customElements&&["ui-toolbar","ui-avatar","ui-badge","ui-button","ui-dropdown","ui-icon","ui-input","ui-switch","ui-tag","ui-toggle-group"].forEach((o=>{switch(o){case"ui-toolbar":customElements.get(i(o))||customElements.define(i(o),g);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-switch":customElements.get(i(o))||c();break;case"ui-tag":customElements.get(i(o))||p();break;case"ui-toggle-group":customElements.get(i(o))||m()}}))};export{u as UiToolbar,v as defineCustomElement}

package/dist/components/ui-tooltip.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface UiTooltip extends Components.UiTooltip, HTMLElement {}
+export const UiTooltip: {
+    prototype: UiTooltip;
+    new (): UiTooltip;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ui-tooltip.js

@@ -0,0 +1 @@
+import{T as o,d as t}from"./tooltip.js";const s=o,p=t;export{s as UiTooltip,p as defineCustomElement}

package/dist/components/ui-top-bar.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface UiTopBar extends Components.UiTopBar, HTMLElement {}
+export const UiTopBar: {
+    prototype: UiTopBar;
+    new (): UiTopBar;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ui-top-bar.js

@@ -0,0 +1 @@
+import{proxyCustomElement as e,HTMLElement as t,h as i,transformTag as o}from"@stencil/core/internal/client";import{d as n,a}from"./badge.js";import{d as r}from"./icon.js";const s=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}companyName="Company Name";companyLogo="🏢";userName="John Doe";userAvatar="user";companyLogoLibrary="se";userAvatarLibrary="se";iconLibrary="default";actions="[]";userMenuItems="[]";backgroundColor="var(--background-color)";textColor="var(--text-color)";showShadow=!0;isUserMenuOpen=!1;userMenuRef;parseActions(){if("string"==typeof this.actions)try{return JSON.parse(this.actions)}catch(e){return[]}return this.actions}parseUserMenuItems(){if("string"==typeof this.userMenuItems)try{return JSON.parse(this.userMenuItems)}catch(e){return[]}return this.userMenuItems}handleUserProfileClick=()=>{this.isUserMenuOpen=!this.isUserMenuOpen};handleUserMenuItemClick=e=>{e.onClick&&e.onClick(),this.isUserMenuOpen=!1};handleClickOutside=e=>{this.userMenuRef&&!this.userMenuRef.contains(e.target)&&(this.isUserMenuOpen=!1)};componentDidLoad(){document.addEventListener("click",this.handleClickOutside)}disconnectedCallback(){document.removeEventListener("click",this.handleClickOutside)}render(){const e=this.parseActions(),t=this.parseUserMenuItems();return i("div",{key:"b642019eb5d91c4254e7d790487e225b7bee7269",class:{"top-bar-container":!0,"with-shadow":this.showShadow},style:{backgroundColor:this.backgroundColor,color:this.textColor}},i("div",{key:"961ed766a5c2dbcbc83533c2d5cd5d258ea128b4",class:"company-section"},i("div",{key:"4cee9e5ca502633748006c0ae304a248e5dd31a8",class:"company-logo"},i("ui-icon",{key:"83f2d81d0272faf2d1b55e2bbad3003b5c4c4ca8",name:this.companyLogo,library:this.companyLogoLibrary,size:"1.5rem"})),i("div",{key:"5e701053945e19bbb59246f36915612a70e3770b",class:"company-name"},this.companyName)),i("div",{key:"ba8da231725cd5c7b3add333af87f410228dff04",class:"center-section"},i("slot",{key:"daa1a117a240d6d227ac6dc9d6d61a0d5b64c698"})),i("div",{key:"2ae8a945da778abb480e6290ae79d2354f6b7c16",class:"actions-section"},e.map((e=>i("ui-button",{key:e.id,class:"action-button",onButtonClick:()=>e.onClick?.(),title:e.label,icon:e.icon,iconLibrary:e.iconLibrary||this.iconLibrary,badge:e.badge,variant:"ghost",iconOnly:!0}))),i("div",{key:"ed34f03b16af74bd21423efd4321fbcc15450935",class:"user-profile-container",ref:e=>this.userMenuRef=e},i("ui-button",{key:"e24b97a236e514de2a66dfa10b3d4801aec39844",class:{"user-profile-button":!0,active:this.isUserMenuOpen},onButtonClick:this.handleUserProfileClick,variant:"ghost"},i("span",{key:"ea979123dc365794c59b1e809a2324c8435c6488",slot:"prefix",class:"user-avatar"},i("ui-icon",{key:"cb6bac6593f55dab233da27c419af9e95ffbde8b",name:this.userAvatar,library:this.userAvatarLibrary,size:"1.5rem"})),i("span",{key:"bc252a92615113a7cf75e1627d27f6bb025b9e8a",class:"user-name"},this.userName),i("ui-icon",{key:"992e9f3e21678f742447b98558b2d8590fdb498d",slot:"suffix",name:"chevron-down",library:"lucide",size:"12px",class:{open:this.isUserMenuOpen}})),this.isUserMenuOpen&&i("div",{key:"dc7d0ad0190701385f2541f89ba609fcd3522057",class:"user-menu"},t.map((e=>i("div",{key:e.id},e.divider?i("div",{class:"menu-divider"}):i("ui-button",{class:"menu-item",onButtonClick:()=>this.handleUserMenuItemClick(e),variant:"ghost",align:"start",fullWidth:!0},e.icon&&i("span",{slot:"prefix",class:"menu-item-icon"},i("ui-icon",{name:e.icon,library:e.iconLibrary||this.iconLibrary,size:"1.1rem"})),i("span",{class:"menu-item-label"},e.label)))))))))}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;position:sticky;top:0;z-index:1000;width:100%}.top-bar-container{display:flex;align-items:center;justify-content:space-between;padding:12px 24px;background-color:#ffffff;border-bottom:1px solid #e5e7eb;transition:all 0.3s ease}.top-bar-container.with-shadow{box-shadow:0 2px 8px rgba(0, 0, 0, 0.1)}.company-section{display:flex;align-items:center;gap:12px;flex-shrink:0}.company-logo{font-size:28px;line-height:1;display:flex;align-items:center;justify-content:center}.company-name{font-size:18px;font-weight:700;color:inherit;white-space:nowrap}.center-section{flex:1;display:flex;align-items:center;justify-content:center;padding:0 24px}.actions-section{display:flex;align-items:center;gap:12px;flex-shrink:0}.action-button{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:none;border-radius:8px;background-color:transparent;color:inherit;cursor:pointer;transition:all 0.2s ease}.action-button:hover{background-color:rgba(0, 0, 0, 0.05)}.action-icon{font-size:20px;line-height:1}.action-badge{position:absolute;top:4px;right:4px;min-width:18px;height:18px;padding:0 5px;background-color:#ef4444;color:white;font-size:11px;font-weight:600;border-radius:9px;display:flex;align-items:center;justify-content:center;line-height:1}.user-profile-container{position:relative}.user-profile-button{display:flex;align-items:center;gap:8px;padding:6px 12px;border:none;border-radius:8px;background-color:transparent;color:inherit;cursor:pointer;transition:all 0.2s ease;font-family:inherit}.user-profile-button:hover{background-color:rgba(0, 0, 0, 0.05)}.user-profile-button.active{background-color:rgba(0, 0, 0, 0.08)}.user-avatar{font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center}.user-name{font-size:14px;font-weight:500;color:inherit;white-space:nowrap}.dropdown-arrow{font-size:10px;color:inherit;transition:transform 0.2s ease;display:flex;align-items:center}.dropdown-arrow.open{transform:rotate(180deg)}.user-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:220px;background-color:white;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 10px 25px rgba(0, 0, 0, 0.1);padding:8px 0;animation:slideDown 0.2s ease;z-index:1001}@keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.menu-item{display:flex;align-items:center;gap:12px;width:100%;padding:10px 16px;border:none;background:none;color:#374151;font-size:14px;text-align:left;cursor:pointer;transition:background-color 0.15s ease;font-family:inherit}.menu-item:hover{background-color:#f3f4f6}.menu-item-icon{font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;width:20px}.menu-item-label{flex:1;white-space:nowrap}.menu-divider{height:1px;background-color:#e5e7eb;margin:8px 0}@media (max-width: 768px){.top-bar-container{padding:10px 16px}.company-name{font-size:16px}.user-name{display:none}.center-section{padding:0 12px}.action-button{width:36px;height:36px}}@media (max-width: 480px){.company-logo{font-size:24px}.actions-section{gap:8px}}"}},[769,"ui-top-bar",{companyName:[1,"company-name"],companyLogo:[1,"company-logo"],userName:[1,"user-name"],userAvatar:[1,"user-avatar"],companyLogoLibrary:[1,"company-logo-library"],userAvatarLibrary:[1,"user-avatar-library"],iconLibrary:[1,"icon-library"],actions:[1],userMenuItems:[1,"user-menu-items"],backgroundColor:[1,"background-color"],textColor:[1,"text-color"],showShadow:[4,"show-shadow"],isUserMenuOpen:[32]}]),c=s,p=function(){"undefined"!=typeof customElements&&["ui-top-bar","ui-badge","ui-button","ui-icon"].forEach((e=>{switch(e){case"ui-top-bar":customElements.get(o(e))||customElements.define(o(e),s);break;case"ui-badge":customElements.get(o(e))||a();break;case"ui-button":customElements.get(o(e))||n();break;case"ui-icon":customElements.get(o(e))||r()}}))};export{c as UiTopBar,p as defineCustomElement}

package/dist/components/ui-transfer-list.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface UiTransferList extends Components.UiTransferList, HTMLElement {}
+export const UiTransferList: {
+    prototype: UiTransferList;
+    new (): UiTransferList;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ui-transfer-list.js

@@ -0,0 +1 @@
+import{proxyCustomElement as e,HTMLElement as t,createEvent as r,h as i,Host as a,transformTag as s}from"@stencil/core/internal/client";import{s as o,d as n}from"./icon.js";import{d as l,a as c}from"./badge.js";import{d}from"./checkbox.js";import{d as h}from"./input.js";const f=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.transferChange=r(this,"transferChange",7),this.selectionChanged=r(this,"selectionChanged",7)}sourceItems=[];targetItems=[];titles=["Available","Selected"];searchable=!0;sortable=!1;allowReorder=!1;max=1/0;searchPlaceholder="Search items...";showSelectAll=!0;disabled=!1;height="300px";mode="list";enableDrag=!1;oneWay=!1;pagination=!1;pageSize=10;columns=[];loading=!1;iconLibrary="default";itemRenderer=null;groupBy="";variant="default";layout="horizontal";resizable=!1;filterOption=null;locale={itemUnit:"item",itemsUnit:"items",notFoundContent:"No items",searchPlaceholder:"Search items...",titles:["Available","Selected"]};sourceSearch="";targetSearch="";sourceSelected=new Set;targetSelected=new Set;lastSelected=null;draggingItem=null;newlyMovedKeys=new Set;sourcePage=1;targetPage=1;badgeAnimating={source:!1,target:!1};sourceSort="none";targetSort="none";dividerPosition=50;contextMenu={visible:!1,x:0,y:0,item:null,side:null};transferChange;selectionChanged;getSourceItems(){const e="string"==typeof this.sourceItems?JSON.parse(this.sourceItems):this.sourceItems;return this.sortable?[...e].sort(((e,t)=>e.label.localeCompare(t.label))):e}getTargetItems(){const e="string"==typeof this.targetItems?JSON.parse(this.targetItems):this.targetItems;return this.sortable&&!this.allowReorder?[...e].sort(((e,t)=>e.label.localeCompare(t.label))):e}getTitles(){return"string"==typeof this.titles?JSON.parse(this.titles):this.titles}filterItems(e,t){if(!t)return e;const r=t.toLowerCase();return e.filter(this.filterOption?e=>this.filterOption(r,e):e=>(e.label??"").toLowerCase().includes(r)||e.description&&e.description.toLowerCase().includes(r))}handleItemClick=(e,t,r)=>{const i="source"===e?this.sourceSelected:this.targetSelected,a="source"===e?this.getSourceItems():this.getTargetItems(),s=this.filterItems(a,"source"===e?this.sourceSearch:this.targetSearch);let o=new Set(i);if(r&&r.shiftKey&&this.lastSelected&&this.lastSelected.side===e){const e=s.findIndex((e=>e.key===this.lastSelected.key)),r=s.findIndex((e=>e.key===t));if(-1!==e&&-1!==r){const t=Math.min(e,r),i=Math.max(e,r);for(let e=t;e<=i;e++)s[e].disabled||o.add(s[e].key)}}else o.has(t)?o.delete(t):o.add(t);if(this.lastSelected={key:t,side:e},"tree"===this.mode){const e=o.has(t),r=e=>{for(const i of e){if(i.key===t)return i;if(i.children){const e=r(i.children);if(e)return e}}return null},i=r(a);if(i&&i.children){const t=(e,r)=>{e.forEach((e=>{e.disabled||(r?o.add(e.key):o.delete(e.key)),e.children&&t(e.children,r)}))};t(i.children,e)}}"source"===e?this.sourceSelected=new Set(o):this.targetSelected=new Set(o),this.emitSelectionChange()};handleKeyDown=(e,t,r)=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.disabled||this.handleItemClick(t,r))};moveToTarget=()=>{if(this.disabled)return;const e=this.getSourceItems(),t=this.getTargetItems(),r=e.filter((e=>this.sourceSelected.has(e.key)));if(t.length+r.length>this.max)alert(`Cannot move more than ${this.max} items.`);else{if(this.oneWay){const e=r.filter((e=>!t.some((t=>t.key===e.key))));this.targetItems=[...t,...e]}else this.sourceItems=e.filter((e=>!this.sourceSelected.has(e.key))),this.targetItems=[...t,...r];this.sourceSelected=new Set,this.newlyMovedKeys=new Set(r.map((e=>e.key))),this.badgeAnimating={...this.badgeAnimating,target:!0},setTimeout((()=>{this.newlyMovedKeys=new Set,this.badgeAnimating={...this.badgeAnimating,target:!1}}),500),this.emitChange()}};moveToSource=()=>{if(this.disabled)return;const e=this.getTargetItems().filter((e=>this.targetSelected.has(e.key)));this.targetItems=this.getTargetItems().filter((e=>!this.targetSelected.has(e.key))),this.oneWay||(this.sourceItems=[...this.getSourceItems(),...e]),this.targetSelected=new Set,this.newlyMovedKeys=new Set(e.map((e=>e.key))),this.badgeAnimating={...this.badgeAnimating,source:!0},setTimeout((()=>{this.newlyMovedKeys=new Set,this.badgeAnimating={...this.badgeAnimating,source:!1}}),500),this.emitChange()};moveAllToTarget=()=>{if(this.disabled)return;const e=this.getSourceItems(),t=this.getTargetItems();if(t.length+e.length>this.max)alert(`Cannot move all items. Limit is ${this.max}.`);else{if(this.oneWay){const r=e.filter((e=>!t.some((t=>t.key===e.key))));this.targetItems=[...t,...r]}else this.targetItems=[...t,...e],this.sourceItems=[];this.sourceSelected=new Set,this.emitChange()}};moveAllToSource=()=>{if(!this.disabled){if(!this.oneWay){const e=this.getTargetItems();this.sourceItems=[...this.getSourceItems(),...e]}this.targetItems=[],this.targetSelected=new Set,this.emitChange()}};reorder=e=>{const t=this.getTargetItems();if(0===this.targetSelected.size)return;const r=Array.from(this.targetSelected),i=[...t];r.map((e=>i.findIndex((t=>t.key===e)))).sort(((t,r)=>"up"===e?t-r:r-t)).forEach((t=>{const r="up"===e?t-1:t+1;if(r>=0&&r<i.length){const[e]=i.splice(t,1);i.splice(r,0,e)}})),this.targetItems=i,this.badgeAnimating={...this.badgeAnimating,target:!0},setTimeout((()=>{this.badgeAnimating={...this.badgeAnimating,target:!1}}),300),this.emitChange()};bulkAction=(e,t)=>{const r="source"===e?this.getSourceItems():this.getTargetItems(),i=this.filterItems(r,"source"===e?this.sourceSearch:this.targetSearch);let a=new Set("source"===e?this.sourceSelected:this.targetSelected);"all"===t?i.forEach((e=>{e.disabled||a.add(e.key)})):"none"===t?i.forEach((e=>a.delete(e.key))):"invert"===t&&i.forEach((e=>{e.disabled||(a.has(e.key)?a.delete(e.key):a.add(e.key))})),"source"===e?this.sourceSelected=new Set(a):this.targetSelected=new Set(a),this.emitSelectionChange()};highlightSearchText(e,t){if(!t||!e)return e;const r=t.toLowerCase();return e.split(RegExp(`(${r})`,"gi")).map((e=>e.toLowerCase()===r?i("mark",{class:"search-highlight"},e):e))}emitChange(){this.transferChange.emit({source:this.getSourceItems(),target:this.getTargetItems()}),this.emitSelectionChange()}emitSelectionChange(){this.selectionChanged.emit({sourceSelected:Array.from(this.sourceSelected),targetSelected:Array.from(this.targetSelected)})}toggleSelectAll=(e,t)=>{const r="source"===e?this.getSourceItems():this.getTargetItems(),i=this.filterItems(r,"source"===e?this.sourceSearch:this.targetSearch),a=new Set("source"===e?this.sourceSelected:this.targetSelected);i.forEach(t?e=>a.add(e.key):e=>a.delete(e.key)),"source"===e?this.sourceSelected=a:this.targetSelected=a,this.emitSelectionChange()};handleDragStart=(e,t,r)=>{!this.enableDrag||this.disabled||t.disabled?e.preventDefault():(this.draggingItem={key:t.key,side:r},e.dataTransfer.effectAllowed="move",e.dataTransfer.setData("text/plain",JSON.stringify(t)),e.target.classList.add("dragging"))};handleDragOver=e=>{this.enableDrag&&!this.disabled&&(e.preventDefault(),e.dataTransfer.dropEffect="move")};handleDrop=(e,t)=>{if(!this.enableDrag||this.disabled||!this.draggingItem)return;e.preventDefault();const{key:r,side:i}=this.draggingItem;this.draggingItem=null;const a=this.el.shadowRoot?.querySelector(".dragging");if(a&&a.classList.remove("dragging"),i!==t){if("source"===i){const e=this.getSourceItems(),t=e.find((e=>e.key===r));if(t)if(this.oneWay){const e=this.getTargetItems();e.some((e=>e.key===r))||(this.targetItems=[...e,t])}else{this.sourceSelected.add(r);const i=this.getTargetItems();if(i.length+1>this.max)return;this.sourceItems=e.filter((e=>e.key!==r)),this.targetItems=[...i,t],this.sourceSelected.delete(r)}}else if(this.oneWay){const e=this.getTargetItems();this.targetItems=e.filter((e=>e.key!==r))}else{const e=this.getTargetItems(),t=e.find((e=>e.key===r));t&&(this.targetItems=e.filter((e=>e.key!==r)),this.sourceItems=[...this.getSourceItems(),t],this.targetSelected.delete(r))}this.emitChange()}};toggleSort=e=>{"source"===e?this.sourceSort="asc"===this.sourceSort?"desc":"asc":this.targetSort="asc"===this.targetSort?"desc":"asc"};sortItems(e,t){return"none"===t?e:[...e].sort(((e,r)=>{const i=(e.label??"").localeCompare(r.label??"");return"asc"===t?i:-i}))}handleDividerMouseDown=e=>{if(!this.resizable||"vertical"===this.layout)return;e.preventDefault();const t=e.clientX,r=this.dividerPosition,i=this.el.querySelector(".transfer-container")?.clientWidth??0,a=e=>{this.dividerPosition=Math.min(Math.max(r+(e.clientX-t)/i*100,20),80)},s=()=>{document.removeEventListener("mousemove",a),document.removeEventListener("mouseup",s)};document.addEventListener("mousemove",a),document.addEventListener("mouseup",s)};handleContextMenu=(e,t,r)=>{e.preventDefault(),this.contextMenu={visible:!0,x:e.clientX,y:e.clientY,item:t,side:r}};closeContextMenu=()=>{this.contextMenu={...this.contextMenu,visible:!1}};el;getSelectionSummary(e){const t="source"===e?this.sourceSelected:this.targetSelected;if(0===t.size)return null;const r=("source"===e?this.sourceItems:this.targetItems).filter((e=>t.has(e.key)));if(this.groupBy){const e={};return r.forEach((t=>{const r=t[this.groupBy]||"Other";e[r]=(e[r]||0)+1})),Object.entries(e).map((([e,t])=>`${t} ${e}`)).join(", ")}return""}render(){const e="vertical"===this.layout;return i(a,{key:"ef965ec2d77dfa9f377091f06a61ac8456bfc084",ref:e=>this.el=e,onClick:this.closeContextMenu},i("div",{key:"4e1aa392d7d667d228f860f664592e9a39cbaded",class:{"transfer-container":!0,"is-vertical":e,"variant-glass":"glass"===this.variant}},i("div",{key:"1de4ee40158e28ed1d71c20a0a2a28d73bf405ad",class:"transfer-section source",style:!e&&this.resizable?{flex:`0 0 ${this.dividerPosition}%`}:void 0},this.renderList("source")),i("div",{key:"b36335fd3bb837fc5432e4a2cac969524c24c60b",class:{"transfer-controls":!0,"resizable-divider":this.resizable&&!e},onMouseDown:this.handleDividerMouseDown},i("div",{key:"e5e630b8898a19837a232ec24522237fa9b1ca29",class:"control-buttons"},i("ui-button",{key:"723baf7ebada286062844d9b1bc429f5d8d66312",variant:"ghost",size:"md",iconOnly:!0,icon:e?"play-skip-back":"play-skip-forward",iconLibrary:"lucide",iconStyle:{transform:e?"rotate(90deg)":""},disabled:this.disabled||0===this.getSourceItems().length,onClick:this.moveAllToTarget,ariaLabel:"Move All Right",class:"transfer-button"}),i("ui-button",{key:"f389d40c0e38846515a302d15523b896a3df6c3e",variant:"ghost",size:"md",iconOnly:!0,icon:e?"chevron-down":"chevron-right",iconLibrary:"lucide",disabled:this.disabled||0===this.sourceSelected.size,onClick:this.moveToTarget,ariaLabel:"Move Selected Right",class:"transfer-button"}),i("ui-button",{key:"0c7e67f6871a9327a4c95798650dee907448b496",variant:"ghost",size:"md",iconOnly:!0,icon:e?"chevron-up":"chevron-left",iconLibrary:"lucide",disabled:this.disabled||0===this.targetSelected.size,onClick:this.moveToSource,ariaLabel:"Move Selected Left",class:"transfer-button"}),i("ui-button",{key:"e6afc1e4a60648e63e4c02a413e359f75a743583",variant:"ghost",size:"md",iconOnly:!0,icon:e?"play-skip-forward":"play-skip-back",iconLibrary:"lucide",iconStyle:{transform:e?"rotate(90deg)":""},disabled:this.disabled||0===this.getTargetItems().length,onClick:this.moveAllToSource,ariaLabel:"Move All Left",class:"transfer-button"}))),i("div",{key:"4626e6393402ecbf3e5f4c919081ac690105a7f8",class:"transfer-section target",style:!e&&this.resizable?{flex:"1"}:void 0},this.renderList("target"),this.allowReorder&&i("div",{key:"53778a0ef11e8af735955e4fdcaa9a7771890fa3",class:"transfer-reorder-floated"},i("ui-button",{key:"b332b36745eda62b47f3b380f21f00fc42d1d53f",variant:"ghost",size:"sm",iconOnly:!0,icon:"arrow-up",iconLibrary:"lucide",disabled:0===this.targetSelected.size,onClick:()=>this.reorder("up"),ariaLabel:"Move Up",class:"transfer-button circle"}),i("ui-button",{key:"0b94cc9d83861ddba02fc59efeb1dfd27aab632e",variant:"ghost",size:"sm",iconOnly:!0,icon:"arrow-down",iconLibrary:"lucide",disabled:0===this.targetSelected.size,onClick:()=>this.reorder("down"),ariaLabel:"Move Down",class:"transfer-button circle"}))),this.contextMenu.visible&&i("div",{key:"cf41b01cbeb2bec8cfc768077026ddf4f1cd92ea",class:"transfer-context-menu",style:{top:this.contextMenu.y+"px",left:this.contextMenu.x+"px"}},i("div",{key:"2f8bce002d77529bee84f28e4ce152d4b58fe972",class:"menu-item",onClick:()=>{"source"===this.contextMenu.side?this.moveToTarget():this.moveToSource()}},i("ui-icon",{key:"71bf8c920d4e5ebc27a12d658d9d0b3bbf7244bc",name:"send",library:"lucide",size:"14"})," Move to ","source"===this.contextMenu.side?"Selected":"Available"),i("div",{key:"6cc356d98029ef9274e4e0d63f4879d8e03a06a0",class:"menu-item danger",onClick:()=>{"source"===this.contextMenu.side?this.sourceSelected.delete(this.contextMenu.item.key):this.targetSelected.delete(this.contextMenu.item.key)}},i("ui-icon",{key:"cbfe5dec61fe84404a968868f505c840464b5ae8",name:"x",library:"lucide",size:"14"})," Deselect"))))}renderList(e){const t="source"===e?this.getSourceItems():this.getTargetItems(),r="source"===e?this.sourceSort:this.targetSort,a=this.sortItems(t,r),s="source"===e?this.sourceSearch:this.targetSearch,o="source"===e?this.sourceSelected:this.targetSelected,n=this.getTitles()["source"===e?0:1],l=this.filterItems(a,s),c=l.length>0&&l.every((e=>o.has(e.key))),d=l.some((e=>o.has(e.key)))&&!c,h="source"===e?this.sourcePage:this.targetPage,f=Math.ceil(l.length/this.pageSize);let u,b=l;if(this.pagination){const e=(h-1)*this.pageSize;b=l.slice(e,e+this.pageSize)}return u=this.loading?this.renderSkeleton():"tree"===this.mode?this.renderTreeView(b,o,e):"table"===this.mode?this.renderTableView(b,o,e):this.renderListView(b,o,e),i("div",{class:"transfer-list-box"},i("div",{class:"transfer-list-header"},this.showSelectAll&&"tree"!==this.mode&&i("ui-checkbox",{checked:c,indeterminate:d,onCheckboxChange:t=>this.toggleSelectAll(e,t.detail.checked),disabled:this.disabled||0===l.length,size:"sm"}),i("span",{class:"header-title"},n),this.sortable&&i("ui-button",{variant:"ghost",size:"sm",iconOnly:!0,icon:"asc"===r?"arrow-up-z-a":"arrow-down-a-z",iconLibrary:"lucide",iconSize:"14px",onClick:()=>this.toggleSort(e),ariaLabel:"Toggle Sort"}),i("div",{class:"header-actions"},i("ui-button",{variant:"ghost",size:"sm",iconOnly:!0,icon:"check-check",iconLibrary:"lucide",iconSize:"14px",onClick:()=>this.bulkAction(e,"all"),ariaLabel:"Select All Search Results"}),i("ui-button",{variant:"ghost",size:"sm",iconOnly:!0,icon:"x",iconLibrary:"lucide",iconSize:"14px",onClick:()=>this.bulkAction(e,"none"),ariaLabel:"Clear Selection"}),i("ui-button",{variant:"ghost",size:"sm",iconOnly:!0,icon:"list-restart",iconLibrary:"lucide",iconSize:"14px",onClick:()=>this.bulkAction(e,"invert"),ariaLabel:"Invert Selection"})),i("span",{class:{"header-count":!0,"pop-anim":"source"===e?this.badgeAnimating.source:this.badgeAnimating.target}},l.filter((e=>o.has(e.key))).length,"/",l.length)),this.searchable&&i("div",{class:"transfer-search"},i("ui-input",{type:"text",placeholder:this.searchPlaceholder,value:s,onInputChange:t=>{const r=t.detail;"source"===e?(this.sourceSearch=r,this.sourcePage=1):(this.targetSearch=r,this.targetPage=1)},prefixIcon:"search",size:"sm",fullWidth:!0})),i("div",{class:"transfer-list-body",style:{height:this.height},onDragOver:this.handleDragOver,onDrop:t=>this.handleDrop(t,e)},0!==l.length||this.loading?u:i("div",{class:"transfer-empty"},i("ui-icon",{name:"inbox",library:"lucide",size:"2.5em"}),i("span",null,this.locale.notFoundContent||"No items available"))),i("div",{class:"transfer-list-footer"},this.pagination&&f>1?i("div",{class:"pagination-controls"},i("ui-button",{variant:"ghost",size:"sm",iconOnly:!0,icon:"chevron-left",iconLibrary:"lucide",iconSize:"1.2em",disabled:1===h||this.disabled,onClick:()=>"source"===e?this.sourcePage--:this.targetPage--,ariaLabel:"Previous page"}),i("span",{class:"pagination-info"},h," / ",f),i("ui-button",{variant:"ghost",size:"sm",iconOnly:!0,icon:"chevron-right",iconLibrary:"lucide",iconSize:"1.2em",disabled:h===f||this.disabled,onClick:()=>"source"===e?this.sourcePage++:this.targetPage++,ariaLabel:"Next page"})):i("div",{class:"footer-summary"},this.getSelectionSummary(e)),i("slot",{name:e+"-footer"})))}renderListView(e,t,r){const a="source"===r?this.sourceSearch:this.targetSearch;if(this.groupBy){const s={};return e.forEach((e=>{const t=e[this.groupBy]||"Other";s[t]||(s[t]=[]),s[t].push(e)})),Object.entries(s).map((([e,s])=>[i("div",{class:"transfer-group-header"},e),...s.map((e=>this.renderItem(e,t,r,a)))]))}return e.map((e=>this.renderItem(e,t,r,a)))}renderItem(e,t,r,a){return i("div",{class:{"transfer-item":!0,selected:t.has(e.key),disabled:!!e.disabled,"draggable-item":this.enableDrag,"transfer-item-new":this.newlyMovedKeys.has(e.key)},draggable:this.enableDrag&&!e.disabled&&!this.disabled,onDragStart:t=>this.handleDragStart(t,e,r),onClick:t=>!e.disabled&&!this.disabled&&this.handleItemClick(r,e.key,t),onContextMenu:t=>this.handleContextMenu(t,e,r),onKeyDown:t=>this.handleKeyDown(t,r,e.key),tabindex:e.disabled?-1:0,role:"option","aria-selected":t.has(e.key)?"true":"false","aria-disabled":e.disabled?"true":"false"},this.itemRenderer?i("div",{class:"transfer-item-custom",innerHTML:o(this.itemRenderer(e))}):i("div",{class:"transfer-item-content"},i("div",{class:"transfer-item-main"},e.icon&&i("span",{class:"transfer-item-icon"},i("ui-icon",{name:e.icon,library:e.iconLibrary||this.iconLibrary,size:"1.2em"})),i("div",{class:"transfer-item-text"},i("span",{class:"transfer-item-label"},this.highlightSearchText(e.label??"",a)),e.description&&i("span",{class:"transfer-item-desc"},this.highlightSearchText(e.description,a)))),t.has(e.key)&&i("ui-icon",{name:"check",library:"lucide",size:"0.9em",class:"selected-check"})))}renderSkeleton(){return Array.from({length:5}).map((()=>i("div",{class:"transfer-item skeleton-item"},i("div",{class:"skeleton-line",style:{width:"60%"}}),i("div",{class:"skeleton-line",style:{width:"40%",marginTop:"6px"}}))))}renderTableView(e,t,r){return i("table",{class:"transfer-table"},i("thead",null,i("tr",null,this.columns.map((e=>i("th",null,e.title))))),i("tbody",null,e.map((e=>i("tr",{class:{selected:t.has(e.key),disabled:!!e.disabled},onClick:()=>!e.disabled&&!this.disabled&&this.handleItemClick(r,e.key),onKeyDown:t=>this.handleKeyDown(t,r,e.key),tabindex:e.disabled?-1:0,role:"row","aria-selected":t.has(e.key)?"true":"false"},this.columns.map((t=>i("td",null,e[t.dataIndex]||e[t.dataIndex.toLowerCase()]||""))))))))}renderTreeView(e,t,r,a=0){const s="source"===r?this.sourceSearch:this.targetSearch;return e.map((e=>i("div",null,i("div",{class:{"transfer-item":!0,"tree-node":!0,selected:t.has(e.key),disabled:!!e.disabled},style:{paddingLeft:12+20*a+"px"},onClick:t=>!e.disabled&&!this.disabled&&this.handleItemClick(r,e.key,t),onKeyDown:t=>this.handleKeyDown(t,r,e.key),tabindex:e.disabled?-1:0,role:"treeitem","aria-selected":t.has(e.key)?"true":"false","aria-disabled":e.disabled?"true":"false","aria-level":a+1},e.icon&&i("span",{class:"transfer-item-icon"},i("ui-icon",{name:e.icon,library:e.iconLibrary||this.iconLibrary,size:"1.1em"})),i("span",{class:"transfer-item-label"},this.highlightSearchText(e.label??"",s)),e.description&&i("span",{class:"transfer-item-desc"},this.highlightSearchText(e.description,s))),e.children&&e.children.length>0&&i("div",{class:"tree-children"},this.renderTreeView(e.children,t,r,a+1)))))}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%;--tl-radius:12px;--tl-shadow:0 4px 12px rgba(0, 0, 0, 0.05);--tl-active-gradient:linear-gradient(135deg, var(--ui-color-primary) 0%, #6366f1 100%);--tl-transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1)}.transfer-container{display:flex;background:var(--ui-bg-default, var(--bg-primary, #ffffff));border:1px solid var(--ui-border-default, var(--border-default, #e5e7eb));border-radius:var(--ui-radius-lg, 12px);overflow:hidden;box-shadow:var(--ui-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.1));height:auto;min-height:200px;position:relative;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);font-family:var(--ui-font-family, inherit)}.transfer-container.is-vertical{flex-direction:column}.transfer-container.is-vertical .transfer-section{flex:1;border:none}.transfer-container.is-vertical .transfer-controls{flex-direction:row;padding:10px;border-top:1px solid var(--ui-border-default);border-bottom:1px solid var(--ui-border-default)}.transfer-container.is-vertical .control-buttons{flex-direction:row}.transfer-section{flex:1;display:flex;flex-direction:column;position:relative;min-width:0}.transfer-list-box{flex:1;border:1px solid var(--ui-border-default, var(--border-default, #e5e7eb));border-radius:var(--tl-radius);overflow:hidden;background:var(--ui-bg-var(--bg-primary, #ffffff), var(--bg-primary, #ffffff));display:flex;flex-direction:column;box-shadow:var(--tl-shadow);transition:var(--tl-transition)}.transfer-list-box:focus-within{border-color:var(--ui-color-primary);box-shadow:0 0 0 4px rgba(var(--color-primary-rgb, 59, 130, 246), 0.1), 0 8px 24px rgba(0, 0, 0, 0.08)}.transfer-list-header{padding:14px 16px;background:var(--ui-bg-muted, var(--bg-primary, #f9fafb));border-bottom:1px solid var(--ui-border-default, var(--border-default, #e5e7eb));display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ui-text-primary, var(--text-primary, #111827))}.header-actions{display:flex;gap:8px;margin-right:4px}.action-btn{background:transparent;border:none;padding:4px;cursor:pointer;color:var(--ui-text-secondary);border-radius:4px;display:flex;align-items:center;transition:all 0.2s}.action-btn:hover{background:rgba(0, 0, 0, 0.05);color:var(--ui-color-primary)}.header-title{flex:1;font-weight:700;letter-spacing:-0.01em}.header-count{font-size:11px;font-weight:600;color:var(--ui-text-secondary, var(--text-muted, #6b7280));background:rgba(0, 0, 0, 0.05);padding:2px 8px;border-radius:10px;transition:transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275)}.header-count.pop-anim{transform:scale(1.4);background:var(--ui-color-primary);color:var(--text-standard, #ffffff)}.transfer-search{padding:12px;border-bottom:1px solid var(--ui-border-default, var(--border-default, #e5e7eb));position:relative}.transfer-search input{width:100%;padding:8px 12px;border:1.5px solid var(--ui-border-default, var(--border-strong, #d1d5db));border-radius:8px;font-size:13px;outline:none;background:var(--ui-bg-var(--bg-primary, #ffffff), var(--bg-primary, #ffffff));color:var(--ui-text-primary);transition:var(--tl-transition)}.transfer-search input:focus{border-color:var(--ui-color-primary);background:var(--bg-primary, #ffffff)}.transfer-list-body{overflow-y:auto;padding:8px 0;flex:1;min-height:200px;scrollbar-width:thin;scrollbar-color:rgba(0, 0, 0, 0.1) transparent}.transfer-list-body::-webkit-scrollbar{width:6px}.transfer-list-body::-webkit-scrollbar-thumb{background:rgba(0, 0, 0, 0.1);border-radius:10px}.transfer-item{padding:10px 16px;font-size:14px;cursor:pointer;transition:var(--tl-transition);user-select:none;display:flex;align-items:center;position:relative;gap:12px}.transfer-item:hover:not(.disabled){background:rgba(0, 0, 0, 0.02);transform:translateX(4px)}.transfer-item.selected{background:rgba(var(--color-primary-rgb, 59, 130, 246), 0.06);color:var(--ui-color-primary);font-weight:500}.transfer-item.selected::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--tl-active-gradient)}.transfer-item.disabled{opacity:0.4;cursor:not-allowed;background:var(--ui-bg-muted)}.transfer-item-main{display:flex;align-items:center;gap:12px;flex:1}.selected-check{color:var(--ui-color-primary);opacity:0.8}.transfer-group-header{padding:8px 16px;font-size:11px;font-weight:700;text-transform:uppercase;color:var(--ui-text-secondary);background:var(--ui-bg-muted);letter-spacing:0.05em;margin-top:8px;border-bottom:1px solid var(--ui-border-default)}.transfer-group-header:first-of-type{margin-top:0}.transfer-item-content{display:flex;align-items:center;justify-content:space-between;width:100%}.transfer-item-label{font-weight:500;color:var(--ui-text-primary)}.transfer-item-desc{font-size:12px;color:var(--ui-text-secondary);margin-top:1px}.transfer-empty{padding:40px 20px;text-align:center;color:var(--ui-text-muted, var(--text-muted, #9ca3af));font-size:13px;display:flex;flex-direction:column;align-items:center;gap:12px}.transfer-empty svg{opacity:0.3}.transfer-controls{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 16px;gap:12px;background:var(--ui-bg-muted, var(--bg-primary, #f9fafb));border-left:1px solid var(--ui-border-default, var(--border-default, #e5e7eb));border-right:1px solid var(--ui-border-default, var(--border-default, #e5e7eb));position:relative}.transfer-controls.resizable-divider{width:32px;padding:0;cursor:col-resize}.transfer-controls.resizable-divider::after{content:"";position:absolute;width:4px;height:24px;background:var(--ui-border-default);border-radius:2px;left:50%;top:50%;transform:translate(-50%, -50%)}.transfer-controls.resizable-divider:hover::after{background:var(--ui-color-primary)}.transfer-controls.resizable-divider .control-buttons{pointer-events:auto}.control-buttons{display:flex;flex-direction:column;gap:8px}.transfer-button{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--ui-border-default, var(--border-strong, #d1d5db));background:var(--ui-bg-var(--bg-primary, #ffffff), var(--bg-primary, #ffffff));border-radius:12px;cursor:pointer;transition:var(--tl-transition);color:var(--ui-text-secondary, var(--text-secondary, #4b5563));box-shadow:0 2px 6px rgba(0, 0, 0, 0.04)}.transfer-button:hover:not(:disabled){border-color:var(--ui-color-primary);color:var(--ui-color-primary);transform:scale(1.1);box-shadow:0 4px 12px rgba(var(--color-primary-rgb, 59, 130, 246), 0.15)}.transfer-button:active:not(:disabled){transform:scale(0.95)}.transfer-button:disabled{opacity:0.4;cursor:not-allowed;background:var(--ui-bg-muted)}.transfer-reorder{display:flex;flex-direction:column;gap:10px;margin-top:20px;padding-top:20px;border-top:2px dashed var(--ui-border-default, var(--border-default, #e5e7eb))}.transfer-list-footer{border-top:1px solid var(--ui-border-default, var(--border-default, #e5e7eb));padding:10px 16px;background:var(--ui-bg-muted, var(--bg-primary, #f9fafb));display:flex;justify-content:center}.transfer-item.draggable-item{cursor:grab}.transfer-item.draggable-item:active{cursor:grabbing}.transfer-item.dragging{opacity:0.4;border:1px dashed var(--ui-color-primary);transform:scale(0.98)}.transfer-table{width:100%;border-collapse:collapse;font-size:13px}.transfer-table th{text-align:left;padding:10px 16px;background:var(--ui-bg-muted);color:var(--ui-text-secondary);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:0.05em}.transfer-table td{padding:10px 16px;border-bottom:1px solid var(--ui-border-default);color:var(--ui-text-primary)}.transfer-table tr{cursor:pointer;transition:all 0.2s}.transfer-table tr:hover:not(.disabled){background:rgba(0, 0, 0, 0.02)}.transfer-table tr.selected{background:rgba(var(--color-primary-rgb, 59, 130, 246), 0.06);color:var(--ui-color-primary)}.transfer-table tr.selected td{font-weight:500;color:var(--ui-color-primary)}.tree-children{margin-left:20px;border-left:1.5px dashed var(--ui-border-default)}.tree-node:hover{background:rgba(0, 0, 0, 0.015)}mark.search-highlight{background:rgba(254, 240, 138, 0.8);color:var(--color-danger, #854d0e);padding:0 2px;border-radius:2px}@keyframes itemFly{from{opacity:0;transform:scale(0.9)}to{opacity:1;transform:scale(1)}}.transfer-item-new{animation:itemPop 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards}@keyframes itemPop{0%{transform:scale(0.9);opacity:0;background:rgba(var(--color-primary-rgb, 59, 130, 246), 0.05)}100%{transform:scale(1);opacity:1;background:transparent}}:host([variant=glass]) .transfer-list-box{background:rgba(255, 255, 255, 0.7);backdrop-filter:blur(12px);border-color:rgba(255, 255, 255, 0.3)}[data-theme=dark] .transfer-list-box,:host-context(.dark-theme) .transfer-list-box{background:var(--bg-secondary, #111827);border-color:var(--border-default, #374151)}[data-theme=dark] .transfer-list-header,[data-theme=dark] .transfer-list-footer,:host-context(.dark-theme) .transfer-list-header,:host-context(.dark-theme) .transfer-list-footer{background:var(--bg-primary, #1f2937);color:var(--text-standard, #ffffff)}[data-theme=dark] .header-count,:host-context(.dark-theme) .header-count{background:rgba(255, 255, 255, 0.1);color:var(--text-muted, #9ca3af)}[data-theme=dark] .transfer-search input,:host-context(.dark-theme) .transfer-search input{background:var(--bg-primary, #1f2937);border-color:var(--border-default, #374151);color:var(--text-standard, #ffffff)}[data-theme=dark] .transfer-item,:host-context(.dark-theme) .transfer-item{color:var(--bg-secondary, #d1d5db)}[data-theme=dark] .transfer-item:hover:not(.disabled),:host-context(.dark-theme) .transfer-item:hover:not(.disabled){background:rgba(255, 255, 255, 0.03)}[data-theme=dark] .transfer-item.selected,:host-context(.dark-theme) .transfer-item.selected{background:rgba(var(--color-primary-rgb, 59, 130, 246), 0.15);color:var(--color-primary, #60a5fa)}[data-theme=dark] .transfer-button,:host-context(.dark-theme) .transfer-button{background:var(--bg-primary, #1f2937);border-color:var(--border-default, #374151);color:var(--text-standard, #ffffff)}[data-theme=dark] .transfer-button:disabled,:host-context(.dark-theme) .transfer-button:disabled{background:var(--bg-secondary, #111827)}[data-theme=dark] .tree-children,:host-context(.dark-theme) .tree-children{border-left-color:var(--border-default, #374151)}'}},[769,"ui-transfer-list",{sourceItems:[1025,"source-items"],targetItems:[1025,"target-items"],titles:[1],searchable:[4],sortable:[4],allowReorder:[4,"allow-reorder"],max:[2],searchPlaceholder:[1,"search-placeholder"],showSelectAll:[4,"show-select-all"],disabled:[4],height:[1],mode:[1],enableDrag:[4,"enable-drag"],oneWay:[4,"one-way"],pagination:[4],pageSize:[2,"page-size"],columns:[16],loading:[4],iconLibrary:[1,"icon-library"],itemRenderer:[16],groupBy:[1,"group-by"],variant:[1],layout:[1],resizable:[4],filterOption:[16],locale:[16],sourceSearch:[32],targetSearch:[32],sourceSelected:[32],targetSelected:[32],lastSelected:[32],draggingItem:[32],newlyMovedKeys:[32],sourcePage:[32],targetPage:[32],badgeAnimating:[32],sourceSort:[32],targetSort:[32],dividerPosition:[32],contextMenu:[32]}]),u=f,b=function(){"undefined"!=typeof customElements&&["ui-transfer-list","ui-badge","ui-button","ui-checkbox","ui-icon","ui-input"].forEach((e=>{switch(e){case"ui-transfer-list":customElements.get(s(e))||customElements.define(s(e),f);break;case"ui-badge":customElements.get(s(e))||c();break;case"ui-button":customElements.get(s(e))||l();break;case"ui-checkbox":customElements.get(s(e))||d();break;case"ui-icon":customElements.get(s(e))||n();break;case"ui-input":customElements.get(s(e))||h()}}))};export{u as UiTransferList,b as defineCustomElement}

package/dist/components/ui-tree.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface UiTree extends Components.UiTree, HTMLElement {}
+export const UiTree: {
+    prototype: UiTree;
+    new (): UiTree;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ui-tree.js

@@ -0,0 +1 @@
+import{proxyCustomElement as e,HTMLElement as t,createEvent as r,h as o,Host as a,transformTag as i}from"@stencil/core/internal/client";import{d as n,a as s}from"./badge.js";import{d}from"./checkbox.js";import{d as c}from"./icon.js";import{d as l}from"./input.js";const h=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.nodeClick=r(this,"nodeClick",7),this.nodeExpand=r(this,"nodeExpand",7),this.nodeSelect=r(this,"nodeSelect",7),this.nodeCheck=r(this,"nodeCheck",7),this.nodeDragStart=r(this,"nodeDragStart",7),this.nodeDrop=r(this,"nodeDrop",7),this.treeChange=r(this,"treeChange",7),this.nodeAction=r(this,"nodeAction",7),this.nodeEdit=r(this,"nodeEdit",7),this.nodeContextMenu=r(this,"nodeContextMenu",7),this.nodeLazyLoad=r(this,"nodeLazyLoad",7),this.nodeAdd=r(this,"nodeAdd",7),this.nodeRemove=r(this,"nodeRemove",7),this.nodeMove=r(this,"nodeMove",7)}get el(){return this}nodes=[];orientation="vertical";showLines=!0;showIcons=!0;expandable=!0;selectable=!1;multiSelect=!1;checkboxes=!1;checkboxSync=!0;enableDrag=!1;searchable=!1;animated=!0;indent=24;nodeHeight=40;expandAll=!1;collapseAll=!1;layout="tree";variant="default";size="md";theme="light";showGlow=!1;connectorWidth=1;connectorColor="";connectorOpacity=1;connectorShape="rounded";iconLibrary="lucide";inlineEdit=!1;contextMenuEnabled=!1;undoRedoEnabled=!1;lazyLoad=!1;virtualScroll=!1;virtualScrollHeight=400;showNodeActions=!0;showAvatars=!0;expandIconType="chevron";expandedIcon="";collapsedIcon="";expandIconSize="14px";expandIconColor="";internalNodes=[];selectedNodes=[];searchTerm="";draggedNode=null;focusedNodeId=null;editingNodeId=null;editingValue="";contextMenuVisible=!1;contextMenuNode=null;contextMenuX=0;contextMenuY=0;undoStack=[];redoStack=[];dragOverNodeId=null;dragPosition="inside";_selectionPathIds=new Set;nodeClick;nodeExpand;nodeSelect;nodeCheck;nodeDragStart;nodeDrop;treeChange;nodeAction;nodeEdit;nodeContextMenu;nodeLazyLoad;nodeAdd;nodeRemove;nodeMove;componentWillLoad(){this.parseNodes(),document.addEventListener("click",this.handleDocumentClick)}disconnectedCallback(){document.removeEventListener("click",this.handleDocumentClick)}parseNodes(){let e="string"==typeof this.nodes?JSON.parse(this.nodes):this.nodes;this.expandAll?e=this._expandAllRecursive(e):this.collapseAll&&(e=this._collapseAllRecursive(e)),this.internalNodes=e}async expandAllNodes(){this._saveUndo(),this.internalNodes=this._expandAllRecursive(this.internalNodes)}async collapseAllNodes(){this._saveUndo(),this.internalNodes=this._collapseAllRecursive(this.internalNodes)}async selectNode(e){this.internalNodes=this._selectById(e,this.internalNodes)}async getNodePath(e){return this._findPath(e,this.internalNodes)??[]}async getBreadcrumb(e){return(await this.getNodePath(e)).map((e=>{const t=this._findNode(e,this.internalNodes);return{id:e,label:t?.label??e+""}}))}async updateNode(e,t){this._saveUndo(),this.internalNodes=this._updateData(e,t,this.internalNodes)}async scrollToNode(e){const t=await this.getNodePath(e);t.length>1&&(this.internalNodes=this._expandPath(t.slice(0,-1),this.internalNodes)),setTimeout((()=>{const t=this.el.querySelector(`[data-node-id="${e}"]`);t?.scrollIntoView({behavior:"smooth",block:"nearest"})}),60)}async expandByPath(e){this.internalNodes=this._expandPath(e,this.internalNodes)}async selectByPath(e){e.length&&(this.internalNodes=this._expandPath(e.slice(0,-1),this.internalNodes),this.internalNodes=this._selectById(e[e.length-1],this.internalNodes))}async getSelectedNodes(){return this._dfs(this.internalNodes).filter((e=>this.selectedNodes.includes(e.id)))}async dfsTraversal(e,t="pre"){const r=e?[this._findNode(e,this.internalNodes)].filter((e=>null!==e)):this.internalNodes;return"post"===t?this._dfsPost(r):this._dfs(r)}async bfsTraversal(e){const t=e?[this._findNode(e,this.internalNodes)].filter((e=>null!==e)):this.internalNodes;return this._bfs(t)}async flattenTree(e=this.internalNodes){const t=[],r=(e,o,a,i)=>{e.forEach(((e,n)=>{const{children:s,...d}=e,c=[...i,e.id];t.push({...d,parentId:o,depth:a,index:n,path:c,hasChildren:!!s?.length}),e.expanded&&s&&r(s,e.id,a+1,c)}))};return r(e,null,0,[]),t}async addNode(e,t){this._saveUndo(),this.internalNodes=null===e?[...this.internalNodes,t]:this._addToParent(e,t,this.internalNodes),this.nodeAdd.emit({parentId:e,node:t})}async removeNode(e){this._saveUndo();const t=this._findNode(e,this.internalNodes);this.internalNodes=this._removeNode(e,this.internalNodes),t&&this.nodeRemove.emit({node:t})}async moveNode(e,t,r){this._saveUndo(),this.internalNodes=this._moveNode(e,t,r,this.internalNodes),this.nodeMove.emit({nodeId:e,targetId:t,position:r})}async undo(){if(!this.undoStack.length)return;const e=this.undoStack[this.undoStack.length-1];this.redoStack=[...this.redoStack,JSON.stringify(this.internalNodes)],this.undoStack=this.undoStack.slice(0,-1),this.internalNodes=JSON.parse(e)}async redo(){if(!this.redoStack.length)return;const e=this.redoStack[this.redoStack.length-1];this.undoStack=[...this.undoStack,JSON.stringify(this.internalNodes)],this.redoStack=this.redoStack.slice(0,-1),this.internalNodes=JSON.parse(e)}async diffTrees(e,t){const r=new Map(this._dfs(e).map((e=>[e.id,e]))),o=new Map(this._dfs(t).map((e=>[e.id,e]))),a=[],i=[],n=[];return o.forEach(((e,t)=>{r.has(t)?JSON.stringify(r.get(t))!==JSON.stringify(e)&&n.push({id:t,oldNode:r.get(t),newNode:e}):a.push(e)})),r.forEach(((e,t)=>{o.has(t)||i.push(e)})),{added:a,removed:i,modified:n}}async getState(){const e=[];return this._dfs(this.internalNodes).forEach((t=>{t.expanded&&e.push(t.id)})),{nodes:this.internalNodes,selectedNodes:this.selectedNodes,expandedNodes:e}}async restoreState(e){this._saveUndo(),this.internalNodes=e.nodes,this.selectedNodes=e.selectedNodes}_saveUndo(){this.undoRedoEnabled&&(this.undoStack=[...this.undoStack.slice(-49),JSON.stringify(this.internalNodes)],this.redoStack=[])}_expandAllRecursive(e){return e.map((e=>({...e,expanded:!0,children:e.children?this._expandAllRecursive(e.children):void 0})))}_collapseAllRecursive(e){return e.map((e=>({...e,expanded:!1,children:e.children?this._collapseAllRecursive(e.children):void 0})))}_findNode(e,t){for(const r of t){if(r.id===e)return r;if(r.children){const t=this._findNode(e,r.children);if(t)return t}}return null}_findPath(e,t,r=[]){for(const o of t){const t=[...r,o.id];if(o.id===e)return t;if(o.children){const r=this._findPath(e,o.children,t);if(r)return r}}return null}_expandPath(e,t){return t.map((t=>e.includes(t.id)?{...t,expanded:!0,children:t.children?this._expandPath(e,t.children):void 0}:t.children?{...t,children:this._expandPath(e,t.children)}:t))}_selectById(e,t){return t.map((t=>{if(t.id===e){const r=!t.selected;return this.selectedNodes=this.multiSelect?r?[...this.selectedNodes,e]:this.selectedNodes.filter((t=>t!==e)):r?[e]:[],this.nodeSelect.emit({node:t,selected:r}),this.treeChange.emit({nodes:this.internalNodes,selectedNodes:this.selectedNodes}),{...t,selected:r}}return!this.multiSelect&&t.selected&&t.id!==e?{...t,selected:!1,children:t.children?this._selectById(e,t.children):void 0}:t.children?{...t,children:this._selectById(e,t.children)}:t}))}_updateData(e,t,r){return r.map((r=>r.id===e?{...r,...t}:r.children?{...r,children:this._updateData(e,t,r.children)}:r))}_addToParent(e,t,r){return r.map((r=>r.id===e?{...r,expanded:!0,isLeaf:!1,children:[...r.children||[],t]}:r.children?{...r,children:this._addToParent(e,t,r.children)}:r))}_removeNode(e,t){return t.filter((t=>t.id!==e)).map((t=>({...t,children:t.children?this._removeNode(e,t.children):void 0})))}_moveNode(e,t,r,o){const a=this._findNode(e,o);if(!a||e===t)return o;const i=this._removeNode(e,o);return"inside"===r?this._addToParent(t,a,i):this._insertRelative(a,t,r,i)}_insertRelative(e,t,r,o){const a=[];for(const i of o)i.id===t?"before"===r?(a.push(e),a.push(i)):(a.push(i),a.push(e)):a.push(i.children?{...i,children:this._insertRelative(e,t,r,i.children)}:i);return a}_dfs(e,t=[]){for(const r of e)t.push(r),r.children&&this._dfs(r.children,t);return t}_dfsPost(e,t=[]){for(const r of e)r.children&&this._dfsPost(r.children,t),t.push(r);return t}_bfs(e){const t=[],r=[...e];for(;r.length;){const e=r.shift();if(!e)break;t.push(e),e.children&&r.push(...e.children)}return t}_syncChildren(e,t){return{...e,checked:t,indeterminate:!1,children:e.children?.map((e=>this._syncChildren(e,t)))}}_syncParent(e){if(!e.children?.length)return e;const t=e.children.map((e=>this._syncParent(e))),r=t.filter((e=>e.checked&&!e.indeterminate)).length,o=t.filter((e=>e.indeterminate)).length,a=t.length;return{...e,children:t,checked:r===a,indeterminate:r>0&&r<a||o>0}}_applyCheckbox(e,t,r){return r.map((r=>{if(r.id===e)return{...this._syncChildren(r,t),checked:t,indeterminate:!1};if(r.children){const o=this._applyCheckbox(e,t,r.children),a={...r,children:o};return this.checkboxSync?this._syncParent(a):a}return r}))}_getSelectionPathIds(){const e=new Set,t=(r,o)=>{for(const a of r){const r=[...o,a.id];this.selectedNodes.includes(a.id)&&r.forEach((t=>e.add(t))),a.children&&t(a.children,r)}};return t(this.internalNodes,[]),e}_getVisibleNodes(e=this.internalNodes,t=[]){for(const r of e)t.push(r),r.expanded&&r.children&&this._getVisibleNodes(r.children,t);return t}_findParent(e,t=this.internalNodes,r=null){for(const o of t){if(o.id===e)return r;if(o.children){const t=this._findParent(e,o.children,o);if(t)return t}}return null}_selectRange(e,t){const r=this._getVisibleNodes(),o=r.findIndex((t=>t.id===e)),a=r.findIndex((e=>e.id===t));if(-1===o||-1===a)return this.internalNodes;const i=r.slice(Math.min(o,a),Math.max(o,a)+1).map((e=>e.id));return this.selectedNodes=Array.from(new Set([...this.selectedNodes,...i])),this._applySelection(this.internalNodes)}_applySelection(e){return e.map((e=>({...e,selected:this.selectedNodes.includes(e.id),children:e.children?this._applySelection(e.children):void 0})))}_toggleNode(e,t=this.internalNodes){return t.map((t=>{if(t.id===e){const e=!t.expanded;return this.nodeExpand.emit({node:t,expanded:e}),e&&this.lazyLoad&&!1===t.isLeaf&&!t.children?.length?(this.nodeLazyLoad.emit({node:t}),{...t,expanded:e,loading:!0}):{...t,expanded:e}}return t.children?{...t,children:this._toggleNode(e,t.children)}:t}))}handleNodeClick(e,t,r){e.disabled||(this.expandable&&(!!e.children?.length||this.lazyLoad&&!1===e.isLeaf)&&(this.internalNodes=this._toggleNode(e.id)),this.selectable&&(this.multiSelect&&r?r.shiftKey&&this.focusedNodeId?this.internalNodes=this._selectRange(this.focusedNodeId,e.id):r.ctrlKey||r.metaKey?this.internalNodes=this._selectById(e.id,this.internalNodes):(this.selectedNodes=[e.id],this.internalNodes=this._applySelection(this.internalNodes)):this.internalNodes=this._selectById(e.id,this.internalNodes)),this.focusedNodeId=e.id,this.nodeClick.emit({node:e,path:t}))}handleCheckboxChange(e,t){const r=t.detail.checked;this.internalNodes=this.checkboxSync?this._applyCheckbox(e.id,r,this.internalNodes):this._updateData(e.id,{checked:r},this.internalNodes);const o=this._findNode(e.id,this.internalNodes);this.nodeCheck.emit({node:o??e,checked:r,indeterminate:o?.indeterminate??!1}),this.treeChange.emit({nodes:this.internalNodes,selectedNodes:this.selectedNodes})}handleDragStart(e,t){this.enableDrag&&!e.disabled&&(this.draggedNode=e,t.dataTransfer.effectAllowed="move",t.dataTransfer.setData("text/plain",e.id+""),this.nodeDragStart.emit(e))}handleDragOver(e,t){if(!this.enableDrag)return;t.preventDefault(),t.dataTransfer.dropEffect="move",this.dragOverNodeId=e.id;const r=t.currentTarget.getBoundingClientRect(),o=(t.clientY-r.top)/r.height;this.dragPosition=o<.25?"before":o>.75?"after":"inside"}handleDragLeave(e){this.el.contains(e.relatedTarget)||(this.dragOverNodeId=null)}handleDrop(e,t){if(!this.enableDrag||!this.draggedNode)return;t.preventDefault();const r=this.dragPosition,o=this.draggedNode;this.nodeDrop.emit({draggedNode:o,targetNode:e,position:r}),o.id!==e.id&&(this._saveUndo(),this.internalNodes=this._moveNode(o.id,e.id,r,this.internalNodes)),this.draggedNode=null,this.dragOverNodeId=null}handleSearchInput(e){this.searchTerm=e.detail.toLowerCase()}handleDocumentClick=()=>{this.contextMenuVisible&&(this.contextMenuVisible=!1)};handleContextMenu(e,t){this.contextMenuEnabled&&(t.preventDefault(),t.stopPropagation(),this.contextMenuNode=e,this.contextMenuX=t.clientX,this.contextMenuY=t.clientY,this.contextMenuVisible=!0,this.nodeContextMenu.emit({node:e,x:t.clientX,y:t.clientY}))}startEditing(e){this.editingNodeId=e.id,this.editingValue=e.label??"",setTimeout((()=>{const e=this.el.querySelector(".tree-edit-input");e&&(e.focus(),e.select())}),40)}cancelEditing(){this.editingNodeId=null,this.editingValue=""}commitEditing(e){const t=this.editingValue.trim();if(!t)return void this.cancelEditing();const r=e.label;this._saveUndo(),this.internalNodes=this._updateData(e.id,{label:t},this.internalNodes),this.nodeEdit.emit({node:e,newLabel:t,oldLabel:r??""}),this.cancelEditing()}handleKeyDown=e=>{const t=this._getVisibleNodes(),r=t.findIndex((e=>e.id===this.focusedNodeId));switch(e.key){case"ArrowDown":e.preventDefault(),-1===r&&t.length?this.focusedNodeId=t[0].id:r<t.length-1&&(this.focusedNodeId=t[r+1].id);break;case"ArrowUp":e.preventDefault(),r>0&&(this.focusedNodeId=t[r-1].id);break;case"ArrowRight":{e.preventDefault();const o=t[r];o?.children?.length&&!o.expanded?this.internalNodes=this._toggleNode(o.id):o?.expanded&&r<t.length-1&&(this.focusedNodeId=t[r+1].id);break}case"ArrowLeft":{e.preventDefault();const o=t[r];if(o?.expanded&&o.children?.length)this.internalNodes=this._toggleNode(o.id);else{const e=this._findParent(o?.id);e&&(this.focusedNodeId=e.id)}break}case"Enter":case" ":e.preventDefault(),t[r]&&this.handleNodeClick(t[r],[]);break;case"F2":if(this.inlineEdit&&null!==this.focusedNodeId){const e=this._findNode(this.focusedNodeId,this.internalNodes);e&&!e.disabled&&this.startEditing(e)}break;case"Escape":this.cancelEditing(),this.contextMenuVisible=!1;break;case"Home":e.preventDefault(),t.length&&(this.focusedNodeId=t[0].id);break;case"End":e.preventDefault(),t.length&&(this.focusedNodeId=t[t.length-1].id);break;case"z":case"Z":(e.ctrlKey||e.metaKey)&&this.undoRedoEnabled&&(e.preventDefault(),e.shiftKey?this.redo():this.undo())}};filterNodes(e){return this.searchTerm?e.filter((e=>{const t=(e.label??"").toLowerCase().includes(this.searchTerm),r=e.children&&this.filterNodes(e.children).length>0;return t||r})).map((e=>({...e,expanded:!0,children:e.children?this.filterNodes(e.children):void 0}))):e}renderLabel(e){if(!this.searchTerm||!e.toLowerCase().includes(this.searchTerm))return e;const t=e.toLowerCase().indexOf(this.searchTerm);return[e.substring(0,t),o("mark",{class:"tree-highlight"},e.substring(t,t+this.searchTerm.length)),e.substring(t+this.searchTerm.length)]}_renderExpandIcon(e,t){let r="",a={};const i=t.iconLibrary??this.iconLibrary;if("custom"===this.expandIconType)r=e?this.expandedIcon||"chevron-down":this.collapsedIcon||"chevron-right";else switch(this.expandIconType){case"plus-minus":r=e?"minus":"plus";break;case"arrow":r=e?"arrow-down":"arrow-right";break;case"caret":r=e?"caret-down":"caret-right";break;default:r="chevron-right",a={transform:`rotate(${e?"90deg":"0deg"})`,transition:"transform 0.2s ease"}}return this.expandIconColor&&(a.color=this.expandIconColor),o("div",{class:"tree-expand-icon",onClick:e=>{e.stopPropagation(),this.internalNodes=this._toggleNode(t.id)}},o("ui-icon",{name:r,library:i,size:this.expandIconSize,style:a}))}renderNode(e,t=0,r=[],a=!1,i=[],n=0,s=!1){const d=!!e.children?.length,c=d||this.lazyLoad&&!1===e.isLeaf,l=!!e.expanded,h=e.selected||this.selectedNodes.includes(e.id),p=this.editingNodeId===e.id,b=this.dragOverNodeId===e.id,g=[...r,e.id],u=t,x=this.connectorWidth||1.8,v=this._selectionPathIds||new Set,m=[];if(this.showLines&&"tree"===this.layout&&u>0){const t=[],r=[];for(let n=0;n<u;n++){const s=Math.max(.6,x-.3*n),d=n*this.indent+12,c=v.has(g[n+1]??""),l=e.connectorColor||this.connectorColor||"var(--tree-line-color-default)",h=this.connectorOpacity;if((n<u-1?!i[n+1]:!a)&&t.push(o("line",{x1:d,y1:"0",x2:d,y2:"100%",stroke:l,"stroke-width":s,"stroke-opacity":c?1:h,class:c?"path-highlight":"","vector-effect":"non-scaling-stroke"})),n===u-1){const e="square"===this.connectorShape?0:8,t=this.nodeHeight/2,a=(n+1)*this.indent;r.push(o("path",{d:e>0?`M ${d} 0 L ${d} ${t-e} Q ${d} ${t} ${d+e} ${t} L ${a} ${t}`:`M ${d} 0 L ${d} ${t} L ${a} ${t}`,fill:"none",stroke:l,"stroke-width":s,"stroke-opacity":c?1:h,"stroke-linecap":"round",class:c?"path-highlight":"","vector-effect":"non-scaling-stroke"}),o("circle",{cx:a,cy:t,r:"2.5",fill:l,opacity:c?1:.8}))}}m.push(o("div",{class:"tree-connector-harness-group",style:{"--tree-indent-full":u*this.indent+"px"}},o("div",{class:"tree-v-line-container"},o("svg",{class:"tree-connectors-svg",width:"100%",height:"100%",preserveAspectRatio:"none"},t)),o("div",{class:"tree-hook-container",style:{height:this.nodeHeight+"px"}},o("svg",{class:"tree-connectors-svg",width:"100%",height:"100%",viewBox:`0 0 ${u*this.indent} ${this.nodeHeight}`,preserveAspectRatio:"xMinYMin meet"},r))))}const f=e.icon??(this.showIcons?c?l?"folder-open":"folder":"file-text":null),y={role:"treeitem","aria-expanded":c?l+"":void 0,"aria-selected":h+"","aria-level":t+1+"","aria-disabled":e.disabled?"true":void 0,tabindex:this.focusedNodeId===e.id||null===this.focusedNodeId&&0===t&&0===n?"0":"-1"},k=o("div",{class:{"tree-node":!0,"tree-node-expanded":l,"tree-node-collapsed":!l,"tree-node-selected":h,"tree-node-disabled":!!e.disabled,"tree-node-leaf":!c,"tree-node-branch":c,"tree-node-focused":this.focusedNodeId===e.id,"tree-node-editing":p,"tree-node-loading":!!e.loading,"tree-node-drag-over":b,["tree-drop-"+this.dragPosition]:b,["tree-node-"+(e.color??"default")]:!0,["tree-node-"+this.size]:!0,"has-checkbox":this.checkboxes,"group-has-icons":s},key:e.id,"data-node-id":e.id,"data-depth":u,style:{"--depth":u+""}},"tree"===this.layout&&m,b&&"before"===this.dragPosition&&o("div",{class:"tree-drop-indicator tree-drop-before-line"}),o("div",{class:"tree-node-content",style:"tree"===this.layout?{paddingLeft:(u+1)*this.indent+"px",minHeight:this.nodeHeight+"px"}:{minHeight:this.nodeHeight+"px"},onClick:t=>!p&&this.handleNodeClick(e,g,t),onDblClick:()=>this.inlineEdit&&!e.disabled&&this.startEditing(e),onContextMenu:t=>this.handleContextMenu(e,t),draggable:this.enableDrag&&!e.disabled,onDragStart:t=>this.handleDragStart(e,t),onDragOver:t=>this.handleDragOver(e,t),onDragLeave:e=>this.handleDragLeave(e),onDrop:t=>this.handleDrop(e,t),...y},this.expandable&&c?this._renderExpandIcon(l,e):o("div",{class:"tree-expand-spacer"}),this.checkboxes&&o("div",{class:"tree-checkbox"},o("ui-checkbox",{checked:!!e.checked,disabled:!!e.disabled,indeterminate:!!e.indeterminate,onCheckboxChange:t=>this.handleCheckboxChange(e,t),size:"sm"})),this.showAvatars&&(e.avatar||e.avatarInitials)&&o("div",{class:"tree-node-avatar"},e.avatar?o("img",{src:e.avatar,alt:e.label}):o("span",{class:"tree-node-avatar-initials tree-node-avatar-"+(e.color??"primary")},e.avatarInitials)),(f||s)&&o("div",{class:"tree-node-icon"+(f?"":" tree-node-icon-spacer")},f&&!e.loading&&o("ui-icon",{name:f,library:e.iconLibrary??this.iconLibrary,size:"16px",style:{color:e.color?`var(--tree-${e.color})`:void 0}}),e.loading&&o("ui-icon",{name:"loader-2",library:"lucide",spin:!0,size:"16px"})),o("div",{class:"tree-node-text-group"},p?o("ui-input",{class:"tree-edit-input",type:"text",value:this.editingValue,onInputChange:e=>{this.editingValue=e.detail},onInputKeydown:t=>{"Enter"===t.detail.key?this.commitEditing(e):"Escape"===t.detail.key&&this.cancelEditing(),t.detail.stopPropagation()},onInputBlur:()=>this.commitEditing(e),autoFocus:!0,size:"sm",fullWidth:!0}):o("div",{class:"tree-node-label"},this.renderLabel(e.label??"")),e.description&&!p&&o("div",{class:"tree-node-description"},e.description)),e.tag&&o("div",{class:"tree-node-tag"},e.tag),e.badge&&o("div",{class:"tree-node-badge tree-node-badge-"+(e.color??"primary")},e.badge),void 0!==e.counter&&o("div",{class:"tree-node-counter"},e.counter),e.locked&&o("div",{class:"tree-node-lock",title:e.lockTooltip??"Locked"},o("ui-icon",{name:"lock",library:"fontawesome",size:"12px"})),this.showNodeActions&&(e.actions?.length??0)>0&&o("div",{class:"tree-node-actions"},e.actions.map((t=>o("ui-button",{variant:"ghost",size:"sm",class:"tree-action-btn"+(t.color?" tree-action-"+t.color:""),icon:t.icon,iconLibrary:t.library??this.iconLibrary,iconSize:"13px",ariaLabel:t.tooltip,disabled:!!t.disabled,onClick:r=>{r.stopPropagation(),this.nodeAction.emit({node:e,action:(t.id??"")+""})}}))))),b&&"after"===this.dragPosition&&o("div",{class:"tree-drop-indicator tree-drop-after-line"}),c&&l&&"tree"===this.layout&&o("div",{class:"tree-children"+(b&&"inside"===this.dragPosition?" tree-children-drop-target":"")},d&&e.children.map(((r,o)=>{const n=e.children.some((e=>e.icon||this.showIcons));return this.renderNode(r,t+1,g,o===e.children.length-1,[...i,a],o,n)}))));return"org-chart"===this.layout?o("div",{class:"tree-node-wrapper"},k,c&&l&&o("div",{class:"tree-children"},d&&e.children.map(((r,o)=>{const n=e.children.some((e=>e.icon||this.showIcons));return this.renderNode(r,t+1,g,o===e.children.length-1,[...i,a],o,n)})))):k}renderContextMenu(){if(!this.contextMenuEnabled||!this.contextMenuVisible||!this.contextMenuNode)return null;const e=this.contextMenuNode;return o("div",{class:"tree-context-menu",style:{position:"fixed",left:this.contextMenuX+"px",top:this.contextMenuY+"px"},onClick:e=>e.stopPropagation()},this.selectable&&o("div",{class:"tree-context-item",onClick:()=>{this.handleNodeClick(e,[]),this.contextMenuVisible=!1}},o("ui-icon",{name:"check",library:"fontawesome",size:"13px"})," Select"),this.expandable&&(e.children?.length??0)>0&&o("div",{class:"tree-context-item",onClick:()=>{this.internalNodes=this._toggleNode(e.id),this.contextMenuVisible=!1}},o("ui-icon",{name:e.expanded?"chevron-up":"chevron-down",library:"lucide",size:"13px"}),e.expanded?"Collapse":"Expand"),this.inlineEdit&&!e.disabled&&o("div",{class:"tree-context-item",onClick:()=>{this.startEditing(e),this.contextMenuVisible=!1}},o("ui-icon",{name:"pen",library:"lucide",size:"13px"})," Rename"),o("div",{class:"tree-context-separator"}),o("div",{class:"tree-context-item",onClick:()=>{this.expandAllNodes(),this.contextMenuVisible=!1}},"Expand All"),o("div",{class:"tree-context-item",onClick:()=>{this.collapseAllNodes(),this.contextMenuVisible=!1}},"Collapse All"),this.undoRedoEnabled&&[o("div",{class:"tree-context-separator"}),o("div",{class:"tree-context-item"+(this.undoStack.length?"":" disabled"),onClick:()=>{this.undo(),this.contextMenuVisible=!1}},"Undo"),o("div",{class:"tree-context-item tree-context-item-danger",onClick:()=>{this._saveUndo();const t=this._findNode(e.id,this.internalNodes);this.internalNodes=this._removeNode(e.id,this.internalNodes),t&&this.nodeRemove.emit({node:t}),this.contextMenuVisible=!1}},"Delete")])}render(){this._selectionPathIds=this._getSelectionPathIds();const e=this.searchable?this.filterNodes(this.internalNodes):this.internalNodes,t=e.some((e=>e.icon||this.showIcons));return o(a,{key:"dae18b9d9751a023555e848bb0b5aaebdd235770",class:{"tree-container":!0,["tree-orientation-"+this.orientation]:!0,["tree-layout-"+this.layout]:!0,["tree-variant-"+this.variant]:!0,["tree-theme-"+this.theme]:!0,"tree-animated":this.animated,"tree-show-lines":this.showLines,"tree-hide-lines":!this.showLines,"tree-selectable":this.selectable,"tree-glow":this.showGlow},style:{"--tree-indent":this.indent+"px","--tree-node-height":this.nodeHeight+"px"},onKeyDown:this.handleKeyDown,tabIndex:0},o("div",{key:"9b15d92f21722bcd345733cfa44206e3c83a2fa9",class:"tree-inner",role:"tree","aria-multiselectable":this.multiSelect?"true":"false"},this.searchable&&o("div",{key:"be71bda4e65cfcf704616ef2ae563630bffde2fa",class:"tree-search"},o("ui-icon",{key:"53d76e4229942408bf50ab0c72d3ce6d1811fbd2",name:"search",library:"fontawesome",size:"13px",class:"tree-search-icon"}),o("ui-input",{key:"b8edf92c3dda73600fd0a653739aa1206be64698",type:"text",placeholder:"Search tree...",value:this.searchTerm,onInputChange:e=>this.handleSearchInput(e),ariaLabel:"Search tree",size:"sm",fullWidth:!0}),this.searchTerm&&o("ui-button",{key:"66800256ed8fc8139dab93bd920d25a2a6219cdf",variant:"ghost",size:"sm",class:"tree-search-clear",icon:"times",iconLibrary:"fontawesome",iconSize:"11px",ariaLabel:"Clear search",onClick:()=>{this.searchTerm=""}})),this.undoRedoEnabled&&o("div",{key:"a391e1e016e422fbdd2781a09daf176bf8fe58df",class:"tree-toolbar"},o("ui-button",{key:"73de8c1affc18220f94912f546c7e992d81850ed",variant:"ghost",size:"sm",icon:"undo",iconLibrary:"fontawesome",iconSize:"13px",label:"Undo",ariaLabel:"Undo (Ctrl+Z)",disabled:!this.undoStack.length,onClick:()=>this.undo()}),o("ui-button",{key:"0aebc8cafd66fb273eb7e39b682a29a24f73bfcc",variant:"ghost",size:"sm",icon:"redo",iconLibrary:"fontawesome",iconSize:"13px",label:"Redo",ariaLabel:"Redo (Ctrl+Shift+Z)",disabled:!this.redoStack.length,onClick:()=>this.redo()}),o("div",{key:"5bf0083e6ccd220d480a29f0fce27e220dba4231",class:"tree-toolbar-sep"}),o("ui-button",{key:"4aee1b4dfa0e8a99770e2ea55670cf17a3491bfb",variant:"ghost",size:"sm",icon:"expand",iconLibrary:"fontawesome",iconSize:"13px",ariaLabel:"Expand all",onClick:()=>this.expandAllNodes()}),o("ui-button",{key:"31c8f23735e0aabb53bee60f63f823f0facbf4c2",variant:"ghost",size:"sm",icon:"compress",iconLibrary:"fontawesome",iconSize:"13px",ariaLabel:"Collapse all",onClick:()=>this.collapseAllNodes()})),o("div",{key:"c635c7a4205a04d0fbb29bbbf666d82e3799e76e",class:"tree-content",style:this.virtualScroll?{height:this.virtualScrollHeight+"px",overflowY:"auto"}:{},onScroll:()=>this.virtualScroll&&this.el.forceUpdate()},this.virtualScroll&&"tree"===this.layout?(()=>{const t=this._getVisibleNodes(e),r=this.el.shadowRoot?.querySelector(".tree-content")?.scrollTop||0,a=Math.max(0,Math.floor(r/this.nodeHeight)-2);return o("div",{class:"tree-virtual-scroller",style:{height:t.length*this.nodeHeight+"px",position:"relative"}},o("div",{class:"tree-virtual-offset",style:{transform:`translateY(${a*this.nodeHeight}px)`}},t.slice(a,Math.min(t.length,a+Math.ceil(this.virtualScrollHeight/this.nodeHeight)+4)).map((e=>{const t=this._findPath(e.id,this.internalNodes)||[];return this.renderNode(e,t.length-1,t.slice(0,-1),!1,[],0,!1)}))))})():e.length>0?e.map(((r,o)=>this.renderNode(r,0,[],o===e.length-1,[],o,t))):o("div",{class:"tree-empty"},o("ui-icon",{name:"folder-open",library:"fontawesome",size:"40px"}),o("p",null,this.searchTerm?"No results found":"No items")))),this.renderContextMenu())}static get watchers(){return{nodes:[{parseNodes:0}],expandAll:[{parseNodes:0}],collapseAll:[{parseNodes: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{display:block;font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;width:100%;--tree-bg:var(--bg-primary, #ffffff);--tree-text:var(--text-primary, #1f2937);--tree-text-muted:var(--color-primary, #6b7280);--tree-border-color:var(--border-default, #e5e7eb);--tree-primary:var(--color-success, #3dcd58);--tree-primary-50:rgba(var(--color-success-rgb, 61, 205, 88), 0.08);--tree-primary-100:rgba(var(--color-success-rgb, 61, 205, 88), 0.15);--tree-primary-200:rgba(var(--color-success-rgb, 61, 205, 88), 0.25);--tree-muted:var(--color-primary, #9ca3af);--tree-node-hover-bg:rgba(0, 0, 0, 0.02);--tree-line-color-default:rgba(0, 0, 0, 0.15);--tree-error:var(--color-danger, #ef4444);--tree-info:var(--color-primary, #10b981);--tree-success:var(--color-success, #10b981);--tree-warning:var(--color-warning, #f59e0b)}.tree-container{width:100%;background:var(--tree-bg);border-radius:8px;overflow:visible;}.tree-container.tree-theme-dark{--tree-bg:var(--bg-primary, #1f2937);--tree-text:var(--bg-primary, #f3f4f6);--tree-text-muted:var(--color-primary, #9ca3af);--tree-border-color:var(--border-default, #374151);--tree-node-hover-bg:rgba(255, 255, 255, 0.05);--tree-line-color-default:rgba(255, 255, 255, 0.1);background:var(--tree-bg);color:var(--tree-text)}.tree-container.tree-variant-bordered{border:1px solid var(--tree-border-color)}.tree-container.tree-variant-rounded{border-radius:12px}.tree-container.tree-variant-rounded .tree-node{border-radius:8px}.tree-container.tree-variant-minimal{background:transparent}.tree-container.tree-variant-minimal .tree-node{background:transparent}.tree-container.tree-variant-minimal .tree-node:hover{background:rgba(0, 0, 0, 0.02)}.tree-container.tree-variant-glass{--tree-glass-bg:rgba(255, 255, 255, 0.1);--tree-glass-border:rgba(255, 255, 255, 0.2);--tree-glass-text:var(--text-primary, #111827);background:var(--tree-glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--tree-glass-border);box-shadow:0 8px 32px 0 rgba(31, 38, 135, 0.1)}.tree-container.tree-variant-glass .tree-node{color:var(--tree-glass-text)}.tree-container.tree-variant-glass .tree-node:hover{background:rgba(255, 255, 255, 0.2)}.tree-container.tree-variant-glass .tree-node.tree-node-selected{background:var(--tree-primary-200)}.tree-container.tree-variant-glass .tree-search input{background:rgba(255, 255, 255, 0.2);border-color:rgba(255, 255, 255, 0.3);color:var(--tree-text)}.tree-container.tree-variant-glass .tree-search input::placeholder{color:var(--tree-text-muted)}.tree-container.tree-variant-glass .tree-line{background:var(--tree-line-color-default)}.tree-container.tree-glow{box-shadow:0 0 20px var(--tree-primary-200);border-color:var(--tree-primary-100)}.tree-theme-dark.tree-variant-glass{--tree-glass-bg:rgba(17, 24, 39, 0.4);--tree-glass-border:rgba(255, 255, 255, 0.1);--tree-glass-text:var(--tree-text);background:var(--tree-glass-bg);border:1px solid var(--tree-glass-border)}.tree-theme-dark.tree-variant-glass .tree-node{color:var(--tree-glass-text)}.tree-theme-dark.tree-variant-glass .tree-node:hover{background:rgba(255, 255, 255, 0.1)}.tree-theme-dark.tree-variant-glass .tree-search input{background:rgba(0, 0, 0, 0.2);border-color:var(--tree-glass-border)}.tree-theme-dark.tree-variant-glass .tree-line{background:var(--tree-glass-border)}.tree-search{position:relative;padding:16px;border-bottom:1px solid var(--tree-border-color)}.tree-search ui-icon{position:absolute;left:28px;top:50%;transform:translateY(-50%);color:var(--tree-muted);font-size:14px}.tree-search input{width:100%;padding:10px 12px 10px 36px;border:1px solid var(--tree-border-color);background:transparent;color:inherit;border-radius:6px;font-size:14px;outline:none;transition:all 0.2s}.tree-search input:focus{border-color:var(--tree-primary);box-shadow:0 0 0 3px var(--tree-primary-50)}.tree-search input::placeholder{color:var(--tree-muted)}.tree-theme-dark .tree-search input:focus{border-color:var(--tree-primary)}.tree-inner{position:relative}.tree-node{position:relative;display:block;width:100%}.tree-connector-harness-group{position:absolute;left:24px;top:0;width:var(--tree-indent-full, 100%);height:100%;pointer-events:none;z-index:1}.tree-v-line-container{position:absolute;left:0;top:0;width:100%;height:100%}.tree-hook-container{position:absolute;left:0;top:0;width:100%}.tree-connectors-svg{display:block;width:100%;height:100%;overflow:visible}.tree-connectors-svg path,.tree-connectors-svg line{transition:stroke 0.3s ease, stroke-width 0.3s ease, stroke-opacity 0.4s ease}.tree-connectors-svg .path-highlight{--line-color-final:var(--tree-primary) !important;stroke:var(--line-color-final) !important;stroke-opacity:1 !important;filter:drop-shadow(0 0 5px var(--tree-primary-400))}.tree-theme-dark .tree-line{--default-line-color:rgba(255, 255, 255, 0.1)}.tree-expand-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0;color:var(--tree-text-muted);font-size:11px;cursor:pointer;z-index:2}.tree-expand-icon:hover{color:var(--tree-primary)}.tree-expand-icon{margin-right:8px}.tree-animated .tree-node-expanded .tree-expand-icon ui-icon{transform:rotate(0deg)}.tree-animated .tree-node-collapsed .tree-expand-icon ui-icon{transform:rotate(-90deg)}.tree-expand-spacer{width:24px;height:24px;flex-shrink:0;margin-right:8px}.tree-checkbox{display:flex;align-items:center;justify-content:center}.tree-checkbox input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:var(--tree-primary)}.tree-node-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;font-size:16px;color:var(--tree-primary)}.tree-node-icon.tree-node-icon-spacer{visibility:hidden}.tree-node-icon.tree-node-icon-default{color:var(--tree-text-muted)}.tree-theme-dark .tree-node-icon.tree-node-icon-default{color:var(--tree-text-muted)}.tree-node-content{display:flex;align-items:center;gap:8px;flex:1;min-width:0;position:relative;z-index:2;cursor:pointer;transition:background-color 0.2s ease}.tree-node-content:hover{background-color:var(--tree-node-hover-bg)}.tree-node-content .tree-node-text-group{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.tree-node-content .tree-node-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;color:var(--tree-text)}.tree-theme-dark .tree-node-label{color:var(--tree-text)}.tree-node-spinner{display:flex;align-items:center;color:var(--tree-primary)}.tree-node-actions{display:flex;align-items:center;gap:4px;opacity:0;transition:opacity 0.2s;pointer-events:none;margin-left:8px}.tree-node:hover .tree-node-actions{opacity:1;pointer-events:auto}.tree-action-btn{background:transparent;border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--tree-text-muted);transition:all 0.2s cubic-bezier(0.4, 0, 0.2, 1);padding:0;margin-left:2px}.tree-action-btn:hover{background:var(--tree-primary-100);color:var(--tree-primary);transform:scale(1.1);box-shadow:0 0 10px var(--tree-primary-50)}.tree-action-btn:active{transform:scale(0.95)}.tree-theme-dark .tree-action-btn{color:var(--tree-text-muted)}.tree-theme-dark .tree-action-btn:hover{background:var(--tree-node-hover-bg)}.tree-node-badge{padding:2px 8px;border-radius:12px;font-size:11px;font-weight:600;flex-shrink:0}.tree-node-badge.tree-node-badge-default{background:var(--tree-border-color);color:var(--tree-text-muted)}.tree-node-badge.tree-node-badge-primary{background:var(--tree-primary-100);color:var(--tree-primary)}.tree-node-badge.tree-node-badge-secondary{background:var(--tree-border-color);color:var(--tree-text-muted)}.tree-node-badge.tree-node-badge-success{background:var(--tree-primary-100);color:var(--tree-success)}.tree-node-badge.tree-node-badge-danger{background:rgba(var(--color-danger-rgb, 239, 68, 68), 0.1);color:var(--tree-error)}.tree-node-badge.tree-node-badge-warning{background:rgba(var(--color-warning-rgb, 245, 158, 11), 0.1);color:var(--color-warning, #f59e0b)}.tree-node-badge.tree-node-badge-info{background:rgba(var(--color-primary-rgb, 59, 130, 246), 0.1);color:var(--tree-info)}.tree-node-counter{display:flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;background:var(--tree-primary);color:var(--tree-bg);border-radius:11px;font-size:11px;font-weight:600;flex-shrink:0}.tree-children{overflow:hidden}.tree-animated .tree-children{animation:slideDown 0.2s ease-out}@keyframes slideDown{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.tree-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:var(--tree-text-muted)}.tree-empty i{font-size:48px;margin-bottom:12px;opacity:0.5}.tree-empty p{margin:0;font-size:14px}.tree-orientation-horizontal .tree-content{overflow-x:auto}.tree-orientation-horizontal .tree-node-wrapper{display:flex}.tree-orientation-horizontal .tree-children{display:flex;flex-direction:column;margin-left:24px;padding-left:24px;border-left:1px solid var(--tree-border-color)}.tree-orientation-horizontal .tree-node{padding-left:0}.tree-layout-org-chart .tree-content{display:flex;justify-content:center;padding:60px 40px;overflow:auto;min-height:400px}.tree-layout-org-chart .tree-node-wrapper{display:flex;flex-direction:column;align-items:center;position:relative;padding:20px 0 0 0;transition:all 0.3s ease}.tree-layout-org-chart .tree-node-wrapper::before,.tree-layout-org-chart .tree-node-wrapper::after{content:"";position:absolute;top:0;right:50%;width:50%;height:20px;border-top:var(--tree-line-width, 1px) solid var(--tree-line-color, rgba(0, 0, 0, 0.1))}.tree-layout-org-chart .tree-node-wrapper::after{right:auto;left:50%;border-left:var(--tree-line-width, 1px) solid var(--tree-line-color, rgba(0, 0, 0, 0.1))}.tree-layout-org-chart{}.tree-layout-org-chart .tree-content>.tree-node-wrapper::before,.tree-layout-org-chart .tree-content>.tree-node-wrapper::after{display:none !important}.tree-layout-org-chart .tree-content>.tree-node-wrapper{padding-top:0}.tree-layout-org-chart{}.tree-layout-org-chart .tree-node-wrapper:first-child::before{border:0 none}.tree-layout-org-chart .tree-node-wrapper:last-child::after{border:0 none}.tree-layout-org-chart .tree-node-wrapper:first-child:not(:only-child)::after{border-radius:12px 0 0 0}.tree-layout-org-chart .tree-node-wrapper:last-child:not(:only-child)::before{border-right:var(--tree-line-width, 1px) solid var(--tree-line-color, rgba(0, 0, 0, 0.1));border-radius:0 12px 0 0}.tree-layout-org-chart{}.tree-layout-org-chart .tree-node-wrapper:only-child::after{border-radius:0;border-left:var(--tree-line-width, 1px) solid var(--tree-line-color, rgba(0, 0, 0, 0.1))}.tree-layout-org-chart .tree-node-wrapper:only-child::before{display:none}.tree-layout-org-chart{}.tree-layout-org-chart .tree-node-branch>.tree-node::after{content:"";position:absolute;bottom:-20px;left:50%;width:1px;height:20px;background:var(--tree-line-color-default)}.tree-layout-org-chart .tree-node{border:1px solid var(--tree-border-color);background:var(--tree-bg);box-shadow:0 4px 12px var(--tree-primary-50);padding:12px 24px;min-width:160px;max-width:300px;justify-content:center;margin:0 15px;z-index:2;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);border-radius:10px}.tree-layout-org-chart .tree-node:hover{border-color:var(--tree-primary);box-shadow:0 12px 24px var(--tree-primary-100);transform:translateY(-4px)}.tree-layout-org-chart .tree-node.tree-node-selected{border-color:var(--tree-primary);background:var(--tree-primary-50)}.tree-layout-org-chart .tree-children{display:flex;flex-direction:row;justify-content:center;position:relative;padding-top:20px}.tree-layout-org-chart{}.tree-layout-org-chart.tree-theme-dark .tree-node{background:var(--tree-bg);border-color:var(--tree-border-color);box-shadow:0 4px 12px rgba(0, 0, 0, 0.2)}.tree-layout-org-chart.tree-theme-dark .tree-node-wrapper::before,.tree-layout-org-chart.tree-theme-dark .tree-node-wrapper::after{border-color:var(--tree-line-color-default)}.tree-layout-org-chart.tree-theme-dark .tree-node-branch>.tree-node::after{background:var(--tree-line-color-default)}.tree-hide-lines .tree-lines,.tree-hide-lines .tree-node-wrapper::before,.tree-hide-lines .tree-node-wrapper::after,.tree-hide-lines .tree-line-vertical::after,.tree-hide-lines .tree-node::after{display:none !important}.tree-variant-modern-green{--tree-bg:var(--bg-secondary, #0f172a);--tree-text:var(--bg-primary, #f8fafc);--tree-text-muted:var(--color-primary, #94a3b8);--tree-primary:var(--color-success, #10b981);--tree-line-color-default:var(--color-success, #10b981);background:var(--tree-bg);color:var(--tree-text);border:1px solid rgba(var(--color-success-rgb, 16, 185, 129), 0.2);box-shadow:0 4px 20px rgba(0, 0, 0, 0.4)}.tree-variant-modern-green .tree-node{color:var(--tree-text-muted);font-weight:500;letter-spacing:0.02em}.tree-variant-modern-green .tree-node:hover{background:var(--tree-primary-50);color:var(--tree-primary)}.tree-variant-modern-green .tree-node.tree-node-selected{background:var(--tree-primary-100);color:var(--tree-primary);border-left:2px solid var(--tree-primary)}.tree-variant-modern-green .tree-line{--default-line-color:var(--tree-primary);--line-width:2px;opacity:0.6}.tree-variant-modern-green .tree-line-curved{border-bottom-left-radius:14px}.tree-variant-modern-green .tree-search input{background:rgba(0, 0, 0, 0.3);border-color:var(--tree-primary-100);color:var(--tree-text)}.tree-variant-modern-green .tree-search input:focus{border-color:var(--tree-primary);box-shadow:0 0 0 3px var(--tree-primary-100)}.tree-variant-modern-green .tree-node-icon{color:var(--tree-primary)}.tree-variant-modern-green .tree-expand-icon{color:var(--tree-primary)}.tree-variant-modern-green .tree-expand-icon:hover{color:var(--tree-primary)}.tree-node-selected{border-top:0 none !important}.tree-node-selected::before,.tree-node-selected::after{border-top:0 none !important}.tree-node[draggable=true]{cursor:move}.tree-node:active{opacity:0.6}.tree-drop-indicator{height:2px;background:var(--tree-primary);border-radius:2px;margin:0 8px;box-shadow:0 0 6px var(--tree-primary-200);animation:pulseIndicator 0.5s ease infinite alternate}@keyframes pulseIndicator{from{opacity:0.7}to{opacity:1}}.tree-node.tree-drop-inside>.tree-node-content{outline:2px dashed var(--tree-primary);outline-offset:-2px;border-radius:6px;background:var(--tree-primary-50)}.tree-children-drop-target{background:var(--tree-primary-50);border-radius:6px}.tree-edit-input{flex:1;min-width:80px;padding:2px 8px;border:1.5px solid var(--tree-primary);border-radius:4px;font-size:13px;font-family:inherit;color:var(--tree-text);background:var(--tree-bg);outline:none;box-shadow:0 0 0 3px var(--tree-primary-50)}.tree-edit-input:focus{box-shadow:0 0 0 3px var(--tree-primary-100)}.tree-theme-dark .tree-edit-input{background:rgba(255, 255, 255, 0.05);color:var(--tree-text)}.tree-search-icon{position:absolute;left:28px;top:50%;transform:translateY(-50%);color:var(--tree-muted);pointer-events:none}.tree-search-clear{position:absolute;right:26px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:var(--tree-text-muted);padding:4px;display:flex;align-items:center;border-radius:4px;transition:color 0.2s, background 0.2s}.tree-search-clear:hover{color:var(--tree-error);background:rgba(var(--color-danger-rgb, 239, 68, 68), 0.08)}.tree-toolbar{display:flex;align-items:center;gap:4px;padding:6px 12px;border-bottom:1px solid var(--tree-border-color);background:rgba(0, 0, 0, 0.01)}.tree-theme-dark .tree-toolbar{background:rgba(255, 255, 255, 0.02)}.tree-toolbar-sep{width:1px;height:18px;background:var(--tree-border-color);margin:0 4px}.tree-toolbar-btn{display:flex;align-items:center;gap:5px;padding:5px 10px;border:1px solid var(--tree-border-color);border-radius:6px;background:var(--tree-bg);color:var(--tree-text-muted);font-size:12px;cursor:pointer;transition:all 0.15s;white-space:nowrap}.tree-toolbar-btn:hover:not(:disabled){background:var(--tree-primary-50);color:var(--tree-primary);border-color:var(--tree-primary)}.tree-toolbar-btn:disabled{opacity:0.4;cursor:not-allowed}.tree-context-menu{min-width:170px;background:var(--tree-bg);border:1px solid var(--tree-border-color);border-radius:10px;box-shadow:0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);padding:6px;z-index:9999;animation:contextMenuIn 0.12s cubic-bezier(0.4, 0, 0.2, 1);overflow:hidden}@keyframes contextMenuIn{from{opacity:0;transform:scale(0.95) translateY(-4px)}to{opacity:1;transform:scale(1) translateY(0)}}.tree-context-item{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:6px;font-size:13px;color:var(--tree-text);cursor:pointer;transition:background 0.12s}.tree-context-item:hover{background:var(--tree-primary-50);color:var(--tree-primary)}.tree-context-item.disabled{opacity:0.4;pointer-events:none}.tree-context-item.tree-context-item-danger{color:var(--tree-error)}.tree-context-item.tree-context-item-danger:hover{background:rgba(var(--color-danger-rgb, 239, 68, 68), 0.08);color:var(--tree-error)}.tree-context-separator{height:1px;background:var(--tree-border-color);margin:4px 6px}.tree-theme-dark .tree-context-menu{background:var(--bg-primary, #1f2937);border-color:var(--border-default, #374151);box-shadow:0 8px 32px rgba(0, 0, 0, 0.4)}.tree-node-avatar{width:24px;height:24px;flex-shrink:0;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center}.tree-node-avatar img{width:100%;height:100%;object-fit:cover}.tree-node-avatar-initials{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;flex-shrink:0}.tree-node-avatar-initials.tree-node-avatar-primary{background:var(--tree-primary-100);color:var(--tree-primary)}.tree-node-avatar-initials.tree-node-avatar-success{background:rgba(var(--color-success-rgb, 16, 185, 129), 0.1);color:var(--tree-success)}.tree-node-avatar-initials.tree-node-avatar-danger{background:rgba(var(--color-danger-rgb, 239, 68, 68), 0.1);color:var(--tree-error)}.tree-node-avatar-initials.tree-node-avatar-warning{background:rgba(var(--color-warning-rgb, 245, 158, 11), 0.1);color:var(--tree-warning)}.tree-node-avatar-initials.tree-node-avatar-info{background:rgba(var(--color-primary-rgb, 59, 130, 246), 0.1);color:var(--tree-info)}.tree-node-avatar-initials.tree-node-avatar-default{background:var(--tree-border-color);color:var(--tree-text-muted)}.tree-node-description{font-size:11px;color:var(--tree-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tree-node-tag{padding:1px 7px;border-radius:12px;font-size:10px;font-weight:600;background:var(--tree-border-color);color:var(--tree-text-muted);white-space:nowrap;flex-shrink:0}.tree-node-lock{display:flex;align-items:center;color:var(--tree-text-muted);flex-shrink:0;margin-left:4px}.tree-action-danger:hover{color:var(--tree-error) !important;background:rgba(var(--color-danger-rgb, 239, 68, 68), 0.1) !important}.tree-action-warning:hover{color:var(--tree-warning) !important;background:rgba(var(--color-warning-rgb, 245, 158, 11), 0.1) !important}.tree-action-success:hover{color:var(--tree-success) !important;background:rgba(var(--color-success-rgb, 16, 185, 129), 0.1) !important}.tree-highlight{background:rgba(245, 200, 10, 0.35);color:inherit;border-radius:2px;padding:0 1px}.tree-variant-compact .tree-node-content{min-height:28px !important;font-size:12px}.tree-variant-compact .tree-expand-icon,.tree-variant-compact .tree-expand-spacer{width:18px;height:18px}.tree-variant-compact .tree-node-icon{width:16px;height:16px;font-size:13px}.tree-variant-directory{--tree-primary:var(--color-warning, #f59e0b)}.tree-variant-directory .tree-node-branch>.tree-node-content .tree-node-icon ui-icon{color:var(--color-warning, #f59e0b)}.tree-variant-directory .tree-node-leaf>.tree-node-content .tree-node-icon ui-icon{color:var(--color-primary, #60a5fa)}.tree-variant-directory .tree-node-selected>.tree-node-content{background:rgba(var(--color-warning-rgb, 245, 158, 11), 0.08)}.tree-variant-cards .tree-node-content{border:1px solid var(--tree-border-color);border-radius:10px;margin:3px 8px 3px 0;padding-right:12px !important;background:var(--tree-bg);box-shadow:0 1px 3px rgba(0, 0, 0, 0.04);transition:box-shadow 0.2s, border-color 0.2s}.tree-variant-cards .tree-node-content:hover{border-color:var(--tree-primary);box-shadow:0 4px 12px var(--tree-primary-50)}.tree-variant-cards .tree-node-selected>.tree-node-content{border-color:var(--tree-primary);background:var(--tree-primary-50);box-shadow:0 4px 12px var(--tree-primary-100)}.tree-variant-cards.tree-theme-dark .tree-node-content{background:rgba(255, 255, 255, 0.04);border-color:var(--tree-border-color);box-shadow:0 1px 3px rgba(0, 0, 0, 0.2)}.tree-variant-git-graph{--tree-git-lane-color:rgba(100, 116, 139, 0.45);--tree-git-commit-color:var(--tree-primary);--tree-git-commit-leaf-color:rgba(148, 163, 184, 0.85)}.tree-variant-git-graph .tree-connector-harness-group{display:none}.tree-variant-git-graph .tree-node-content{position:relative}.tree-variant-git-graph .tree-node-content::before,.tree-variant-git-graph .tree-node-content::after{content:"";position:absolute;pointer-events:none;z-index:1}.tree-variant-git-graph{}.tree-variant-git-graph .tree-node-content::before{left:calc(var(--depth, 0) * var(--tree-indent, 24px) + 12px);top:0;bottom:0;width:1.5px;background:var(--tree-git-lane-color)}.tree-variant-git-graph{}.tree-variant-git-graph .tree-node-content::after{left:calc(var(--depth, 0) * var(--tree-indent, 24px) + 8px);top:50%;width:9px;height:9px;transform:translateY(-50%);border-radius:50%;background:var(--tree-git-commit-color);box-shadow:0 0 0 2px var(--tree-bg)}.tree-variant-git-graph .tree-node-leaf>.tree-node-content::after{background:var(--tree-git-commit-leaf-color)}.tree-variant-git-graph .tree-node-selected>.tree-node-content::after{width:10px;height:10px;background:var(--tree-primary);box-shadow:0 0 0 2px var(--tree-bg), 0 0 0 6px var(--tree-primary-50)}.tree-variant-git-graph .tree-node:hover>.tree-node-content::before{background:color-mix(in srgb, var(--tree-primary) 35%, var(--tree-git-lane-color))}.tree-theme-dark.tree-variant-git-graph{--tree-git-lane-color:rgba(148, 163, 184, 0.35);--tree-git-commit-leaf-color:rgba(203, 213, 225, 0.85)}.tree-node-focused>.tree-node-content{outline:2px solid var(--tree-primary);outline-offset:-1px;border-radius:4px}.tree-content::-webkit-scrollbar{width:4px}.tree-content::-webkit-scrollbar-track{background:transparent}.tree-content::-webkit-scrollbar-thumb{background:var(--tree-border-color);border-radius:4px}.tree-theme-dark.tree-layout-org-chart .tree-node{background:var(--bg-primary, #1f2937);border-color:var(--border-default, #374151);color:var(--tree-text)}.tree-theme-dark.tree-layout-org-chart .tree-node:hover{border-color:var(--tree-primary)}.tree-node-sm>.tree-node-content{min-height:32px !important;font-size:12px}.tree-node-md>.tree-node-content{min-height:40px !important;font-size:14px}.tree-node-lg>.tree-node-content{min-height:48px !important;font-size:16px}.tree-node-primary>.tree-node-content .tree-node-label{color:var(--tree-primary)}.tree-node-success>.tree-node-content .tree-node-label{color:var(--tree-success)}.tree-node-danger>.tree-node-content .tree-node-label{color:var(--tree-error)}.tree-node-warning>.tree-node-content .tree-node-label{color:var(--tree-warning)}.tree-node-info>.tree-node-content .tree-node-label{color:var(--tree-info)}.tree-animated .tree-children{animation:treeSlideIn 0.18s cubic-bezier(0.4, 0, 0.2, 1)}@keyframes treeSlideIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}'}},[513,"ui-tree",{nodes:[1],orientation:[1],showLines:[4,"show-lines"],showIcons:[4,"show-icons"],expandable:[4],selectable:[4],multiSelect:[4,"multi-select"],checkboxes:[4],checkboxSync:[4,"checkbox-sync"],enableDrag:[4,"enable-drag"],searchable:[4],animated:[4],indent:[2],nodeHeight:[2,"node-height"],expandAll:[4,"expand-all"],collapseAll:[4,"collapse-all"],layout:[1],variant:[1],size:[1],theme:[1],showGlow:[4,"show-glow"],connectorWidth:[2,"connector-width"],connectorColor:[1,"connector-color"],connectorOpacity:[2,"connector-opacity"],connectorShape:[1,"connector-shape"],iconLibrary:[1,"icon-library"],inlineEdit:[4,"inline-edit"],contextMenuEnabled:[4,"context-menu-enabled"],undoRedoEnabled:[4,"undo-redo-enabled"],lazyLoad:[4,"lazy-load"],virtualScroll:[4,"virtual-scroll"],virtualScrollHeight:[2,"virtual-scroll-height"],showNodeActions:[4,"show-node-actions"],showAvatars:[4,"show-avatars"],expandIconType:[1,"expand-icon-type"],expandedIcon:[1,"expanded-icon"],collapsedIcon:[1,"collapsed-icon"],expandIconSize:[1,"expand-icon-size"],expandIconColor:[1,"expand-icon-color"],internalNodes:[32],selectedNodes:[32],searchTerm:[32],draggedNode:[32],focusedNodeId:[32],editingNodeId:[32],editingValue:[32],contextMenuVisible:[32],contextMenuNode:[32],contextMenuX:[32],contextMenuY:[32],undoStack:[32],redoStack:[32],dragOverNodeId:[32],dragPosition:[32],expandAllNodes:[64],collapseAllNodes:[64],selectNode:[64],getNodePath:[64],getBreadcrumb:[64],updateNode:[64],scrollToNode:[64],expandByPath:[64],selectByPath:[64],getSelectedNodes:[64],dfsTraversal:[64],bfsTraversal:[64],flattenTree:[64],addNode:[64],removeNode:[64],moveNode:[64],undo:[64],redo:[64],diffTrees:[64],getState:[64],restoreState:[64]},void 0,{nodes:[{parseNodes:0}],expandAll:[{parseNodes:0}],collapseAll:[{parseNodes:0}]}]),p=h,b=function(){"undefined"!=typeof customElements&&["ui-tree","ui-badge","ui-button","ui-checkbox","ui-icon","ui-input"].forEach((e=>{switch(e){case"ui-tree":customElements.get(i(e))||customElements.define(i(e),h);break;case"ui-badge":customElements.get(i(e))||s();break;case"ui-button":customElements.get(i(e))||n();break;case"ui-checkbox":customElements.get(i(e))||d();break;case"ui-icon":customElements.get(i(e))||c();break;case"ui-input":customElements.get(i(e))||l()}}))};export{p as UiTree,b as defineCustomElement}

package/dist/components/ui-workspace-manager.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface UiWorkspaceManager extends Components.UiWorkspaceManager, HTMLElement {}
+export const UiWorkspaceManager: {
+    prototype: UiWorkspaceManager;
+    new (): UiWorkspaceManager;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;