npm - @santi020k/lumen-elements - Versions diffs - 0.1.0 → 0.3.0 - Mend

@santi020k/lumen-elements 0.1.0 → 0.3.0

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

Files changed (6) hide show

package/README.md CHANGED Viewed

@@ -74,10 +74,12 @@ Elements emit the same `ui-*` classes and `data-ui-*` attributes as the Astro pr
 remains the reference package, and the Web Components adapter now carries matching light-DOM
 behavior for DataTable, Dialog, Popover, DropdownMenu, ContextMenu, Tabs, Select, ThemeBuilder,
 Toast, Tooltip, forms, Calendar, InputOTP, DateRangePicker, RichTextEditor, Schedule, Resizable,
-and VirtualList: selection, validation, calendar grids, OTP segmentation, date range syncing, rich
-text command, context menu, schedule drag/drop, resizable pane sizing, theme, and range events,
-ARIA state, keyboard navigation, Escape/outside dismissal, focus return/trapping, native select
-form participation, and the document-level toast controller events.
+VirtualList, FileUpload, Tour, Anchor, Transfer, Mentions, Cascader, and TreeSelect: selection,
+validation, calendar grids, OTP segmentation, date range syncing, rich text command, context menu,
+schedule and file drag/drop, anchored tours, scroll spy, collection transfer, mention insertion,
+hierarchical selection, resizable pane sizing, theme, and range events, ARIA state, keyboard
+navigation, Escape/outside dismissal, focus return/trapping, native form participation, and the
+document-level toast controller events.
 ## Interactive behavior
@@ -88,6 +90,8 @@ Astro runtime's data event, validation, calendar grids, OTP segmentation, date r
 text command, context menu, schedule drag/drop, resizable pane sizing, theme export, ARIA,
 keyboard, Escape, dismissal, and toast controller semantics while keeping markup declarative and
 Declarative-Shadow-DOM friendly.
+FileUpload, Tour, Anchor, Transfer, Mentions, Cascader, and TreeSelect also run directly through
+their registered custom elements; no Astro runtime or host controller is required.
 Rich text controls may provide `data-ui-editor-value` for commands such as `formatBlock` and
 `createLink`; editable surfaces emit `ui:editor-change` with both HTML and plain text, support common
 formatting shortcuts, and keep toggle controls synchronized through `aria-pressed`.

package/dist/define.d.ts CHANGED Viewed

@@ -52,7 +52,7 @@ export declare class LumenElement extends HTMLElement {
 export declare const enhanceLumenElements: (scope?: ParentNode) => void;
 export declare const defineLumenElements: (customElementsRegistry?: CustomElementRegistry | undefined) => void;
 export declare const installLumenControllers: () => void;
-export declare const lumenElementDefinitions: (readonly ["lumen-accordion" | "lumen-alert" | "lumen-alert-dialog" | "lumen-agenda" | "lumen-aspect-ratio" | "lumen-attachment" | "lumen-autocomplete" | "lumen-avatar" | "lumen-back-to-top" | "lumen-badge" | "lumen-breadcrumb" | "lumen-bubble" | "lumen-button" | "lumen-button-group" | "lumen-calendar" | "lumen-callout" | "lumen-card" | "lumen-carousel" | "lumen-chart" | "lumen-checkbox" | "lumen-collapsible" | "lumen-code" | "lumen-combobox" | "lumen-command" | "lumen-color-picker" | "lumen-context-menu" | "lumen-data-table" | "lumen-date-picker" | "lumen-date-range-picker" | "lumen-dialog" | "lumen-direction" | "lumen-drawer" | "lumen-dropdown-menu" | "lumen-empty" | "lumen-eyebrow" | "lumen-field" | "lumen-floating-badge" | "lumen-formatted-date" | "lumen-hover-card" | "lumen-icon" | "lumen-image" | "lumen-input" | "lumen-input-group" | "lumen-input-otp" | "lumen-number-field" | "lumen-item" | "lumen-kbd" | "lumen-label" | "lumen-link" | "lumen-marker" | "lumen-menubar" | "lumen-message" | "lumen-message-scroller" | "lumen-native-select" | "lumen-navigation-menu" | "lumen-pagination" | "lumen-phone-input" | "lumen-pill" | "lumen-popover" | "lumen-progress" | "lumen-prose" | "lumen-radio-group" | "lumen-resizable" | "lumen-rich-text-editor" | "lumen-scroll-area" | "lumen-schedule" | "lumen-search-field" | "lumen-select" | "lumen-separator" | "lumen-sheet" | "lumen-sidebar" | "lumen-skeleton" | "lumen-skip-link" | "lumen-slider" | "lumen-sonner" | "lumen-spinner" | "lumen-switch" | "lumen-table" | "lumen-tabs" | "lumen-tag-group" | "lumen-textarea" | "lumen-theme-builder" | "lumen-theme-toggle" | "lumen-time-field" | "lumen-toast" | "lumen-toggle" | "lumen-toggle-group" | "lumen-tooltip" | "lumen-tree" | "lumen-tree-grid" | "lumen-typography" | "lumen-virtual-list" | "lumen-language-toggle" | "lumen-particles" | "lumen-animated-number" | "lumen-reveal-group" | "lumen-scroll-reveal" | "lumen-stat" | "lumen-meter" | "lumen-note" | "lumen-rating" | "lumen-timeline" | "lumen-animated-logo" | "lumen-animated-portrait" | "lumen-button-link" | "lumen-cover-image" | "lumen-gradient-divider" | "lumen-stepper" | "lumen-file-upload" | "lumen-tour" | "lumen-anchor" | "lumen-segmented" | "lumen-toolbar" | "lumen-descriptions" | "lumen-popconfirm" | "lumen-transfer" | "lumen-cascader" | "lumen-tree-select" | "lumen-mentions" | "lumen-qr-code" | "lumen-watermark" | "lumen-affix" | "lumen-speed-dial", typeof LumenElement])[];
+export declare const lumenElementDefinitions: (readonly ["lumen-accordion" | "lumen-alert" | "lumen-alert-dialog" | "lumen-agenda" | "lumen-aspect-ratio" | "lumen-attachment" | "lumen-autocomplete" | "lumen-avatar" | "lumen-back-to-top" | "lumen-badge" | "lumen-breadcrumb" | "lumen-bubble" | "lumen-button" | "lumen-button-group" | "lumen-calendar" | "lumen-callout" | "lumen-card" | "lumen-carousel" | "lumen-chart" | "lumen-checkbox" | "lumen-collapsible" | "lumen-code" | "lumen-code-tabs" | "lumen-combobox" | "lumen-command" | "lumen-color-picker" | "lumen-context-menu" | "lumen-data-table" | "lumen-date-picker" | "lumen-date-range-picker" | "lumen-dialog" | "lumen-direction" | "lumen-drawer" | "lumen-dropdown-menu" | "lumen-empty" | "lumen-eyebrow" | "lumen-field" | "lumen-floating-badge" | "lumen-formatted-date" | "lumen-hover-card" | "lumen-icon" | "lumen-image" | "lumen-input" | "lumen-input-group" | "lumen-input-otp" | "lumen-number-field" | "lumen-item" | "lumen-kbd" | "lumen-label" | "lumen-link" | "lumen-marker" | "lumen-menubar" | "lumen-message" | "lumen-message-scroller" | "lumen-native-select" | "lumen-navigation-menu" | "lumen-pagination" | "lumen-phone-input" | "lumen-pill" | "lumen-popover" | "lumen-progress" | "lumen-prose" | "lumen-radio-group" | "lumen-resizable" | "lumen-rich-text-editor" | "lumen-scroll-area" | "lumen-schedule" | "lumen-search-field" | "lumen-select" | "lumen-separator" | "lumen-sheet" | "lumen-sidebar" | "lumen-skeleton" | "lumen-skip-link" | "lumen-slider" | "lumen-sonner" | "lumen-spinner" | "lumen-switch" | "lumen-table" | "lumen-tabs" | "lumen-tag-group" | "lumen-textarea" | "lumen-theme-builder" | "lumen-theme-toggle" | "lumen-time-field" | "lumen-toast" | "lumen-toggle" | "lumen-toggle-group" | "lumen-tooltip" | "lumen-tree" | "lumen-tree-grid" | "lumen-typography" | "lumen-virtual-list" | "lumen-language-toggle" | "lumen-particles" | "lumen-animated-number" | "lumen-reveal-group" | "lumen-scroll-reveal" | "lumen-stat" | "lumen-meter" | "lumen-note" | "lumen-rating" | "lumen-timeline" | "lumen-animated-logo" | "lumen-animated-portrait" | "lumen-button-link" | "lumen-cover-image" | "lumen-gradient-divider" | "lumen-stepper" | "lumen-file-upload" | "lumen-tour" | "lumen-anchor" | "lumen-segmented" | "lumen-toolbar" | "lumen-descriptions" | "lumen-popconfirm" | "lumen-transfer" | "lumen-cascader" | "lumen-tree-select" | "lumen-mentions" | "lumen-qr-code" | "lumen-watermark" | "lumen-affix" | "lumen-speed-dial", typeof LumenElement])[];
 export declare const LumenAccordionElement: typeof LumenElement;
 export declare const LumenAlertElement: typeof LumenElement;
 export declare const LumenAlertDialogElement: typeof LumenElement;
@@ -73,6 +73,7 @@ export declare const LumenChartElement: typeof LumenElement;
 export declare const LumenCheckboxElement: typeof LumenElement;
 export declare const LumenCollapsibleElement: typeof LumenElement;
 export declare const LumenCodeElement: typeof LumenElement;
+export declare const LumenCodeTabsElement: typeof LumenElement;
 export declare const LumenComboboxElement: typeof LumenElement;
 export declare const LumenCommandElement: typeof LumenElement;
 export declare const LumenColorPickerElement: typeof LumenElement;

package/dist/define.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"define.d.ts","sourceRoot":"","sources":["../src/define.ts"],"names":[],"mappings":"AAyBA,KAAK,iBAAiB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA;AAE/D,KAAK,cAAc,GACf,eAAe,GACf,aAAa,GACb,cAAc,GACd,YAAY,GACZ,UAAU,GACV,WAAW,CAAA;AAEf,KAAK,YAAY,GAAG,MAAM,CAAA;AAY1B,MAAM,WAAW,WAAW;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,WAAW,KAAK,IAAI,CAAA;IACzD,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,MAAM,WAAW,WAAW;IAC1B,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,YAAY,CAAA;CACvB;AAED,MAAM,WAAW,QAAQ;IACvB,MAAM,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,MAAM,CAAA;IACvC,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9B,MAAM,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,KAAK,IAAI,CAAA;CAClD;AAED,UAAU,kBAAkB;IAC1B,gBAAgB,CAAC,EAAE,iBAAiB,CAAA;IACpC,aAAa,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACjC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;CAChB;~~AA0zBD~~,eAAO,MAAM,iBAAiB,GAC5B,QAAO,UAAqB,KAC3B,IAIF,CAAA;AAyKD,eAAO,MAAM,2BAA2B,GACtC,QAAO,UAAqB,KAC3B,IAEF,CAAA;AA+FD,eAAO,MAAM,qBAAqB,GAChC,QAAO,UAAqB,KAC3B,IAEF,CAAA;AAiQD,eAAO,MAAM,qBAAqB,GAChC,QAAO,UAAqB,KAC3B,IAEF,CAAA;AAwMD,eAAO,MAAM,4BAA4B,GACvC,QAAO,UAAqB,KAC3B,IAEF,CAAA;AAwBD,eAAO,MAAM,uBAAuB,GAClC,QAAO,UAAqB,KAC3B,IAEF,CAAA;AA0TD,eAAO,MAAM,qBAAqB,GAChC,QAAO,UAAqB,KAC3B,IAEF,CAAA;AA8bD,eAAO,MAAM,qBAAqB,GAChC,QAAO,UAAqB,KAC3B,IAEF,CAAA;AAuID,eAAO,MAAM,wBAAwB,GACnC,QAAO,UAAqB,KAC3B,IAEF,CAAA;AAkVD,eAAO,MAAM,UAAU,EAAE,QA+ExB,CAAA;AAgCD,qBAAa,YAAa,SAAQ,WAAW;IAC3C,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAA;IAEjC,MAAM,KAAK,kBAAkB,aAE5B;IAED,iBAAiB;IAMjB,oBAAoB;IAIpB,wBAAwB;IAIxB,SAAS,KAAK,MAAM,uBAEnB;IAED,OAAO,CAAC,aAAa;IAYrB,OAAO,CAAC,eAAe;CAyBxB;~~AAmgED~~,eAAO,MAAM,oBAAoB,GAAI,QAAO,UAAqB,KAAG,IAUnE,CAAA;AAED,eAAO,MAAM,mBAAmB,GAC9B,yBAAwB,qBAAqB,GAAG,SAE9B,SA+BnB,CAAA;AAED,eAAO,MAAM,uBAAuB,QAAO,IAM1C,CAAA;AAED,eAAO,MAAM,uBAAuB,~~u5EAAqB~~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"}
1	+ {"version":3,"file":"define.d.ts","sourceRoot":"","sources":["../src/define.ts"],"names":[],"mappings":"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"}

package/dist/define.js CHANGED Viewed

@@ -83,7 +83,14 @@ const glassAttributeClasses = (className) => ({
     surface: { glass: className }
 });
 const elementConfigs = {
-    Accordion: { baseClassName: 'ui-accordion', tagName: 'lumen-accordion' },
+    Accordion: {
+        attributeClasses: {
+            variant: { flush: 'ui-accordion--flush' }
+        },
+        baseClassName: 'ui-accordion',
+        defaults: { variant: 'default' },
+        tagName: 'lumen-accordion'
+    },
     Alert: {
         attributeClasses: {
             glass: { strong: 'ui-alert--glass ui-glass-strong', subtle: 'ui-alert--glass ui-glass-subtle', true: 'ui-alert--glass' },
@@ -171,7 +178,8 @@ const elementConfigs = {
             variant: {
                 glass: 'ui-card--glass',
                 interactive: 'ui-card--interactive',
-                muted: 'ui-card--muted'
+                muted: 'ui-card--muted',
+                unstyled: 'ui-card--unstyled'
             }
         },
         baseClassName: 'ui-card',
@@ -187,12 +195,20 @@ const elementConfigs = {
             variant: {
                 block: 'ui-code--block',
                 inline: 'ui-code--inline'
+            },
+            wrap: {
+                true: 'ui-code--wrap'
             }
         },
         baseClassName: 'ui-code',
         defaults: { 'data-code-theme': 'auto', variant: 'inline' },
         tagName: 'lumen-code'
     },
+    CodeTabs: {
+        baseClassName: 'ui-code-tabs',
+        defaults: { 'data-ui-tabs': '' },
+        tagName: 'lumen-code-tabs'
+    },
     Combobox: { baseClassName: 'ui-combobox', defaults: { 'data-ui-combobox': '' }, tagName: 'lumen-combobox' },
     Command: { attributeClasses: glassAttributeClasses('ui-command--glass'), baseClassName: 'ui-command', defaults: { 'data-ui-command': '' }, tagName: 'lumen-command' },
     ColorPicker: { baseClassName: 'ui-color-picker', defaults: { type: 'color' }, tagName: 'lumen-color-picker' },
@@ -216,10 +232,11 @@ const elementConfigs = {
     Dialog: {
         attributeClasses: {
             glass: { strong: 'ui-dialog--glass ui-glass-strong', subtle: 'ui-dialog--glass ui-glass-subtle', true: 'ui-dialog--glass' },
+            layout: { fullscreen: 'ui-dialog--fullscreen' },
             surface: { glass: 'ui-dialog--glass' }
         },
         baseClassName: 'ui-dialog',
-        defaults: { 'data-ui-dialog': '', surface: 'default' },
+        defaults: { 'data-ui-dialog': '', layout: 'centered', surface: 'default' },
         tagName: 'lumen-dialog'
     },
     Direction: { baseClassName: 'ui-direction', defaults: { dir: 'ltr' }, tagName: 'lumen-direction' },
@@ -281,7 +298,7 @@ const elementConfigs = {
     Item: { attributeClasses: glassAttributeClasses('ui-item--glass'), baseClassName: 'ui-item', tagName: 'lumen-item' },
     Kbd: { baseClassName: 'ui-kbd', tagName: 'lumen-kbd' },
     Label: { baseClassName: 'ui-label', tagName: 'lumen-label' },
-    Link: { baseClassName: 'ui-link', tagName: 'lumen-link' },
+    Link: { attributeClasses: { variant: { inherit: 'ui-link--inherit' } }, baseClassName: 'ui-link', tagName: 'lumen-link' },
     Marker: {
         attributeClasses: {
             variant: {
@@ -319,7 +336,8 @@ const elementConfigs = {
     NavigationMenu: {
         attributeClasses: {
             glass: { strong: 'ui-navigation-menu--glass ui-glass-strong', subtle: 'ui-navigation-menu--glass ui-glass-subtle', true: 'ui-navigation-menu--glass' },
-            surface: { glass: 'ui-navigation-menu--glass' }
+            surface: { glass: 'ui-navigation-menu--glass' },
+            variant: { unstyled: 'ui-navigation-menu--unstyled' }
         },
         baseClassName: 'ui-navigation-menu',
         defaults: { 'data-ui-navigation-menu': '', surface: 'default' },
@@ -381,7 +399,8 @@ const elementConfigs = {
     Sidebar: {
         attributeClasses: {
             glass: { strong: 'ui-sidebar--glass ui-glass-strong', subtle: 'ui-sidebar--glass ui-glass-subtle', true: 'ui-sidebar--glass' },
-            surface: { glass: 'ui-sidebar--glass' }
+            surface: { glass: 'ui-sidebar--glass' },
+            variant: { unstyled: 'ui-sidebar--unstyled' }
         },
         baseClassName: 'ui-sidebar',
         defaults: { surface: 'default' },
@@ -419,7 +438,6 @@ const elementConfigs = {
         tagName: 'lumen-toast'
     },
     Toggle: {
-        attributeClasses: { pressed: { true: 'ui-toggle--pressed' } },
         baseClassName: 'ui-toggle',
         defaults: { 'aria-pressed': 'false', 'data-ui-toggle': '', role: 'button', tabindex: '0' },
         role: 'button',
@@ -498,7 +516,10 @@ const elementConfigs = {
     AnimatedLogo: { baseClassName: 'ui-animated-logo', tagName: 'lumen-animated-logo' },
     AnimatedPortrait: { baseClassName: 'ui-animated-portrait', tagName: 'lumen-animated-portrait' },
     ButtonLink: {
-        attributeClasses: { shape: { icon: 'ui-button-link--icon' } },
+        attributeClasses: {
+            shape: { icon: 'ui-button-link--icon' },
+            variant: { unstyled: 'ui-button-link--unstyled' }
+        },
         baseClassName: 'ui-button-link',
         tagName: 'lumen-button-link'
     },
@@ -3070,10 +3091,10 @@ class LumenDataTableBehaviorElement extends LumenElement {
         selectAll.indeterminate = selectedValues.length > 0 && selectedValues.length < rows.length;
         this.syncSelectionInputs(selectedValues);
         if (dispatch) {
-            this.dispatchEvent(new CustomEvent('ui:datatable-selection-change', {
-                bubbles: true,
-                detail: { values: selectedValues }
-            }));
+            const detail = { values: selectedValues };
+            this.dispatchEvent(new CustomEvent('ui:data-table-selection-change', { bubbles: true, detail }));
+            // Deprecated compatibility event. Remove in Lumen 1.0.
+            this.dispatchEvent(new CustomEvent('ui:datatable-selection-change', { bubbles: true, detail }));
         }
     }
     syncSelectionInputs(selectedValues) {
@@ -3461,6 +3482,444 @@ class LumenToastBehaviorElement extends LumenElement {
         clearToastTimer(this);
     }
 }
+class LumenFileUploadBehaviorElement extends LumenElement {
+    abortController;
+    connectedCallback() {
+        super.connectedCallback();
+        this.abortController?.abort();
+        this.abortController = new AbortController();
+        const input = this.querySelector('[data-ui-file-upload-input]');
+        if (!input)
+            return;
+        const files = this.querySelector('[data-ui-file-upload-files]');
+        const renderFiles = () => {
+            const selectedFiles = input.files ? [...input.files] : [];
+            this.dataset.state = selectedFiles.length > 0 ? 'selected' : 'idle';
+            if (!files)
+                return;
+            if (selectedFiles.length === 1) {
+                files.textContent = selectedFiles[0]?.name ?? '';
+            }
+            else {
+                files.textContent = selectedFiles.length > 1
+                    ? `${selectedFiles.length} files selected`
+                    : '';
+            }
+        };
+        input.addEventListener('change', renderFiles, { signal: this.abortController.signal });
+        this.addEventListener('dragover', event => {
+            if (input.disabled)
+                return;
+            event.preventDefault();
+            this.dataset.state = 'drag-over';
+        }, { signal: this.abortController.signal });
+        this.addEventListener('dragleave', event => {
+            if (event.relatedTarget instanceof Node && this.contains(event.relatedTarget))
+                return;
+            this.dataset.state = input.files?.length ? 'selected' : 'idle';
+        }, { signal: this.abortController.signal });
+        this.addEventListener('drop', event => {
+            if (input.disabled)
+                return;
+            event.preventDefault();
+            if (event.dataTransfer) {
+                input.files = event.dataTransfer.files;
+                input.dispatchEvent(new Event('change', { bubbles: true }));
+            }
+        }, { signal: this.abortController.signal });
+        renderFiles();
+    }
+    disconnectedCallback() {
+        this.abortController?.abort();
+        this.abortController = undefined;
+    }
+}
+class LumenAnchorBehaviorElement extends LumenElement {
+    observer;
+    connectedCallback() {
+        super.connectedCallback();
+        this.observer?.disconnect();
+        if (typeof IntersectionObserver === 'undefined')
+            return;
+        const links = [...this.querySelectorAll('a[href^="#"]')];
+        const byId = new Map();
+        const targets = [];
+        for (const link of links) {
+            const id = decodeURIComponent(link.getAttribute('href')?.slice(1) ?? '');
+            const target = id ? document.getElementById(id) : null;
+            if (target) {
+                byId.set(id, link);
+                targets.push(target);
+            }
+        }
+        if (!targets.length)
+            return;
+        this.observer = new IntersectionObserver(entries => {
+            const visibleEntry = entries.find(entry => entry.isIntersecting);
+            if (!visibleEntry)
+                return;
+            for (const link of links) {
+                link.dataset.active = 'false';
+            }
+            const active = byId.get(visibleEntry.target.id);
+            if (active)
+                active.dataset.active = 'true';
+        }, { rootMargin: '0px 0px -70% 0px', threshold: 0 });
+        for (const target of targets) {
+            this.observer.observe(target);
+        }
+    }
+    disconnectedCallback() {
+        this.observer?.disconnect();
+        this.observer = undefined;
+    }
+}
+class LumenTourBehaviorElement extends LumenElement {
+    abortController;
+    opener = null;
+    connectedCallback() {
+        super.connectedCallback();
+        this.abortController?.abort();
+        this.abortController = new AbortController();
+        const popover = this.querySelector('[data-ui-tour-popover]');
+        const steps = [...this.querySelectorAll('[data-ui-tour-step]')];
+        if (!popover || !steps.length)
+            return;
+        let index = 0;
+        const positionStep = () => {
+            const step = steps[index];
+            if (!step)
+                return;
+            for (const [stepIndex, node] of steps.entries()) {
+                node.hidden = stepIndex !== index;
+            }
+            const target = step.dataset.target
+                ? document.querySelector(step.dataset.target)
+                : null;
+            if (target) {
+                const rect = target.getBoundingClientRect();
+                popover.style.top = `${rect.bottom + 8}px`;
+                popover.style.left = `${rect.left}px`;
+            }
+        };
+        const open = () => {
+            this.hidden = false;
+            index = 0;
+            positionStep();
+        };
+        const close = () => {
+            this.hidden = true;
+        };
+        this.addEventListener('click', event => {
+            const target = event.target;
+            if (!(target instanceof HTMLElement))
+                return;
+            if (target.closest('[data-ui-tour-next]')) {
+                if (index < steps.length - 1) {
+                    index += 1;
+                    positionStep();
+                }
+                else {
+                    close();
+                }
+            }
+            else if (target.closest('[data-ui-tour-prev]')) {
+                if (index > 0) {
+                    index -= 1;
+                    positionStep();
+                }
+            }
+            else if (target.closest('[data-ui-tour-close]') || target.hasAttribute('data-ui-tour-backdrop')) {
+                close();
+            }
+        }, { signal: this.abortController.signal });
+        this.opener = this.id
+            ? document.querySelector(`[data-ui-tour-open="#${this.id}"]`)
+            : null;
+        this.opener?.addEventListener('click', open, { signal: this.abortController.signal });
+        const lumenWindow = window;
+        lumenWindow.LumenTours ??= {};
+        if (this.id)
+            lumenWindow.LumenTours[this.id] = open;
+    }
+    disconnectedCallback() {
+        this.abortController?.abort();
+        this.abortController = undefined;
+        this.opener = null;
+        const lumenWindow = window;
+        if (this.id && lumenWindow.LumenTours)
+            Reflect.deleteProperty(lumenWindow.LumenTours, this.id);
+    }
+}
+class LumenTransferBehaviorElement extends LumenElement {
+    abortController;
+    connectedCallback() {
+        super.connectedCallback();
+        this.abortController?.abort();
+        this.abortController = new AbortController();
+        const lists = new Map();
+        for (const list of this.querySelectorAll('[data-ui-transfer-list]')) {
+            if (list.dataset.side)
+                lists.set(list.dataset.side, list);
+        }
+        const move = (fromSide, toSide) => {
+            const from = lists.get(fromSide);
+            const to = lists.get(toSide);
+            if (!from || !to)
+                return;
+            const moved = [];
+            for (const checkbox of from.querySelectorAll('[data-ui-transfer-item]')) {
+                if (!checkbox.checked)
+                    continue;
+                const item = checkbox.closest('.ui-transfer__item');
+                if (item) {
+                    checkbox.checked = false;
+                    to.append(item);
+                    moved.push(checkbox.value);
+                }
+            }
+            if (moved.length) {
+                this.dispatchEvent(new CustomEvent('ui:transfer-change', {
+                    bubbles: true,
+                    detail: { from: fromSide, to: toSide, values: moved }
+                }));
+            }
+        };
+        for (const button of this.querySelectorAll('[data-ui-transfer-move]')) {
+            button.addEventListener('click', () => {
+                if (button.dataset.uiTransferMove === 'target') {
+                    move('source', 'target');
+                }
+                else if (button.dataset.uiTransferMove === 'source') {
+                    move('target', 'source');
+                }
+            }, { signal: this.abortController.signal });
+        }
+    }
+    disconnectedCallback() {
+        this.abortController?.abort();
+        this.abortController = undefined;
+    }
+}
+class LumenMentionsBehaviorElement extends LumenElement {
+    abortController;
+    closeTimer;
+    connectedCallback() {
+        super.connectedCallback();
+        this.abortController?.abort();
+        this.abortController = new AbortController();
+        const input = this.querySelector('[data-ui-mentions-input]');
+        const list = this.querySelector('[data-ui-mentions-list]');
+        if (!input || !list)
+            return;
+        const trigger = this.dataset.uiMentionsTrigger ?? '@';
+        const escapedTrigger = trigger.replaceAll(/[.*+?^${}()|[\]\\]/g, '\\$&');
+        const options = [...list.querySelectorAll('[data-ui-mentions-option]')];
+        const close = () => {
+            list.hidden = true;
+        };
+        const filter = () => {
+            const caret = input.selectionStart;
+            const match = new RegExp(`${escapedTrigger}(\\w*)$`).exec(input.value.slice(0, caret));
+            if (!match) {
+                close();
+                return;
+            }
+            const query = (match[1] ?? '').toLowerCase();
+            let visibleCount = 0;
+            for (const option of options) {
+                const visible = (option.dataset.value ?? '').toLowerCase().startsWith(query);
+                option.hidden = !visible;
+                if (visible)
+                    visibleCount += 1;
+            }
+            list.hidden = visibleCount === 0;
+        };
+        const insert = (value) => {
+            const caret = input.selectionStart;
+            const before = input.value.slice(0, caret)
+                .replace(new RegExp(`${escapedTrigger}\\w*$`), `${trigger}${value} `);
+            input.value = before + input.value.slice(caret);
+            input.focus();
+            input.setSelectionRange(before.length, before.length);
+            close();
+            input.dispatchEvent(new Event('input', { bubbles: true }));
+        };
+        input.addEventListener('input', filter, { signal: this.abortController.signal });
+        input.addEventListener('keyup', filter, { signal: this.abortController.signal });
+        input.addEventListener('blur', () => {
+            this.closeTimer = globalThis.setTimeout(close, 120);
+        }, { signal: this.abortController.signal });
+        for (const option of options) {
+            option.addEventListener('mousedown', event => {
+                event.preventDefault();
+                insert(option.dataset.value ?? '');
+            }, { signal: this.abortController.signal });
+        }
+    }
+    disconnectedCallback() {
+        this.abortController?.abort();
+        this.abortController = undefined;
+        if (this.closeTimer)
+            globalThis.clearTimeout(this.closeTimer);
+        this.closeTimer = undefined;
+    }
+}
+const setupSelectionDisclosure = (root, signal, rovingPanel = true) => {
+    const trigger = root.querySelector('[data-ui-trigger]');
+    const panel = root.querySelector('[data-ui-panel]');
+    if (!trigger || !panel)
+        return undefined;
+    const close = () => { setDisclosureOpen(trigger, panel, false); };
+    setDisclosureOpen(trigger, panel, trigger.getAttribute('aria-expanded') === 'true');
+    trigger.addEventListener('click', () => {
+        setDisclosureOpen(trigger, panel, trigger.getAttribute('aria-expanded') !== 'true');
+    }, { signal });
+    trigger.addEventListener('keydown', event => {
+        if (!['ArrowDown', 'Enter', ' '].includes(event.key))
+            return;
+        event.preventDefault();
+        setDisclosureOpen(trigger, panel, true);
+        getFocusable(panel)[0]?.focus();
+    }, { signal });
+    panel.addEventListener('keydown', event => {
+        if (event.key === 'Escape') {
+            event.preventDefault();
+            close();
+            trigger.focus({ preventScroll: true });
+            return;
+        }
+        if (!rovingPanel || !['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key))
+            return;
+        const items = getFocusable(panel);
+        if (!items.length)
+            return;
+        event.preventDefault();
+        const currentIndex = Math.max(0, items.indexOf(document.activeElement));
+        items[getLoopedIndex(event.key, currentIndex, items.length, ['ArrowDown'])]?.focus();
+    }, { signal });
+    document.addEventListener('pointerdown', event => {
+        const target = getOwnedTarget(event);
+        if (!target || root.contains(target))
+            return;
+        close();
+    }, { signal });
+    return { close, panel, trigger };
+};
+class LumenCascaderBehaviorElement extends LumenElement {
+    abortController;
+    connectedCallback() {
+        super.connectedCallback();
+        this.abortController?.abort();
+        this.abortController = new AbortController();
+        const disclosure = setupSelectionDisclosure(this, this.abortController.signal, false);
+        if (!disclosure)
+            return;
+        const valueLabel = this.querySelector('[data-ui-cascader-value]');
+        const input = this.querySelector('[data-ui-cascader-input]');
+        const columns = [...this.querySelectorAll('.ui-cascader__column')];
+        for (const option of this.querySelectorAll('[data-ui-cascader-option]')) {
+            option.addEventListener('click', () => {
+                const column = option.closest('.ui-cascader__column');
+                if (column) {
+                    const columnIndex = columns.indexOf(column);
+                    for (const descendant of columns.slice(columnIndex + 1)) {
+                        descendant.hidden = true;
+                        for (const descendantOption of descendant.querySelectorAll('[data-ui-cascader-option]')) {
+                            descendantOption.dataset.active = 'false';
+                            descendantOption.setAttribute('aria-selected', 'false');
+                        }
+                    }
+                    for (const sibling of column.querySelectorAll('[data-ui-cascader-option]')) {
+                        sibling.dataset.active = 'false';
+                        sibling.setAttribute('aria-selected', 'false');
+                    }
+                }
+                option.dataset.active = 'true';
+                option.setAttribute('aria-selected', 'true');
+                const next = option.dataset.uiCascaderNext
+                    ? this.querySelector(option.dataset.uiCascaderNext)
+                    : null;
+                if (next) {
+                    next.hidden = false;
+                    return;
+                }
+                const value = option.dataset.value ?? option.textContent.trim();
+                if (valueLabel)
+                    valueLabel.textContent = option.dataset.label ?? option.textContent.trim();
+                if (input)
+                    input.value = value;
+                disclosure.close();
+                this.dispatchEvent(new CustomEvent('ui:cascader-change', { bubbles: true, detail: { value } }));
+            }, { signal: this.abortController.signal });
+        }
+        disclosure.panel.addEventListener('keydown', event => {
+            const target = event.target;
+            if (!(target instanceof HTMLElement))
+                return;
+            const option = target.closest('[data-ui-cascader-option]');
+            const column = option?.closest('.ui-cascader__column');
+            if (!option || !column)
+                return;
+            const columnIndex = columns.indexOf(column);
+            const options = [...column.querySelectorAll('[data-ui-cascader-option]')];
+            if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {
+                event.preventDefault();
+                options[getLoopedIndex(event.key, options.indexOf(option), options.length, ['ArrowDown'])]?.focus();
+            }
+            else if (event.key === 'ArrowRight') {
+                const next = option.dataset.uiCascaderNext
+                    ? this.querySelector(option.dataset.uiCascaderNext)
+                    : null;
+                if (next) {
+                    event.preventDefault();
+                    option.click();
+                    next.querySelector('[data-ui-cascader-option]')?.focus();
+                }
+            }
+            else if (event.key === 'ArrowLeft' && columnIndex > 0) {
+                event.preventDefault();
+                for (const descendant of columns.slice(columnIndex))
+                    descendant.hidden = true;
+                columns.slice(0, columnIndex).reverse().find(candidate => !candidate.hidden)
+                    ?.querySelector('[data-ui-cascader-option][data-active="true"]')
+                    ?.focus();
+            }
+        }, { signal: this.abortController.signal });
+    }
+    disconnectedCallback() {
+        this.abortController?.abort();
+        this.abortController = undefined;
+    }
+}
+class LumenTreeSelectBehaviorElement extends LumenElement {
+    abortController;
+    connectedCallback() {
+        super.connectedCallback();
+        this.abortController?.abort();
+        this.abortController = new AbortController();
+        const disclosure = setupSelectionDisclosure(this, this.abortController.signal);
+        if (!disclosure)
+            return;
+        const valueLabel = this.querySelector('[data-ui-tree-select-value]');
+        const input = this.querySelector('[data-ui-tree-select-input]');
+        for (const item of this.querySelectorAll('[data-ui-panel] [data-value]')) {
+            item.addEventListener('click', () => {
+                const value = item.dataset.value ?? '';
+                if (valueLabel)
+                    valueLabel.textContent = item.textContent.trim();
+                if (input)
+                    input.value = value;
+                disclosure.close();
+                this.dispatchEvent(new CustomEvent('ui:tree-select-change', { bubbles: true, detail: { value } }));
+            }, { signal: this.abortController.signal });
+        }
+    }
+    disconnectedCallback() {
+        this.abortController?.abort();
+        this.abortController = undefined;
+    }
+}
 class LumenBackToTopBehaviorElement extends LumenElement {
     connectedCallback() {
         super.connectedCallback();
@@ -3725,13 +4184,18 @@ const createLumenBehaviorElementClass = (BaseElement, config) => class extends B
 };
 const behaviorElementClasses = {
     AlertDialog: LumenDialogBehaviorElement,
+    Anchor: LumenAnchorBehaviorElement,
     AnimatedNumber: LumenAnimatedNumberBehaviorElement,
     BackToTop: LumenBackToTopBehaviorElement,
+    Cascader: LumenCascaderBehaviorElement,
+    CodeTabs: LumenTabsBehaviorElement,
     DataTable: LumenDataTableBehaviorElement,
     Dialog: LumenDialogBehaviorElement,
     DropdownMenu: LumenDisclosureBehaviorElement,
+    FileUpload: LumenFileUploadBehaviorElement,
     Icon: LumenIconBehaviorElement,
     LanguageToggle: LumenLanguageToggleBehaviorElement,
+    Mentions: LumenMentionsBehaviorElement,
     Particles: LumenParticlesBehaviorElement,
     Popover: LumenDisclosureBehaviorElement,
     Rating: LumenRatingBehaviorElement,
@@ -3743,6 +4207,9 @@ const behaviorElementClasses = {
     ThemeBuilder: LumenThemeBuilderBehaviorElement,
     ThemeToggle: LumenThemeToggleBehaviorElement,
     Toast: LumenToastBehaviorElement,
+    Tour: LumenTourBehaviorElement,
+    Transfer: LumenTransferBehaviorElement,
+    TreeSelect: LumenTreeSelectBehaviorElement,
     Tooltip: LumenTooltipBehaviorElement,
     VirtualList: LumenVirtualListBehaviorElement
 };
@@ -3812,6 +4279,7 @@ export const LumenChartElement = elementClasses.Chart;
 export const LumenCheckboxElement = elementClasses.Checkbox;
 export const LumenCollapsibleElement = elementClasses.Collapsible;
 export const LumenCodeElement = elementClasses.Code;
+export const LumenCodeTabsElement = elementClasses.CodeTabs;
 export const LumenComboboxElement = elementClasses.Combobox;
 export const LumenCommandElement = elementClasses.Command;
 export const LumenColorPickerElement = elementClasses.ColorPicker;

package/layers.css ADDED Viewed

	@@ -0,0 +1 @@
1	+ @import "@santi020k/lumen/layers.css";

package/package.json CHANGED Viewed

@@ -1,12 +1,13 @@
 {
   "name": "@santi020k/lumen-elements",
-  "version": "0.1.0",
+  "version": "0.3.0",
   "publishConfig": {
     "access": "public"
   },
   "description": "Web Components for Lumen UI.",
   "type": "module",
   "sideEffects": [
+    "./layers.css",
     "./styles.css",
     "./dist/define.js"
   ],
@@ -23,17 +24,19 @@
       "import": "./dist/define.js"
     },
     "./styles.css": "./styles.css",
+    "./layers.css": "./layers.css",
     "./package.json": "./package.json"
   },
   "files": [
     "dist",
+    "layers.css",
     "styles.css",
     "README.md",
     "LICENSE"
   ],
   "dependencies": {
-    "@santi020k/lumen": "^0.1.0",
-    "@santi020k/lumen-core": "^0.1.0"
+    "@santi020k/lumen": "^0.3.0",
+    "@santi020k/lumen-core": "^0.3.0"
   },
   "devDependencies": {
     "@vitest/coverage-v8": "^4.1.10",
@@ -43,7 +46,7 @@
     "axe-core": "^4.12.1"
   },
   "engines": {
-    "node": ">=22.18.0"
+    "node": ">=22.12.0"
   },
   "repository": {
     "type": "git",