@weeehaoooz/talos-ui 0.1.0 → 0.1.2

package/fesm2022/weeehaoooz-talos-ui-dropdown.mjs

@@ -0,0 +1,1039 @@
+import { Overlay } from '@angular/cdk/overlay';
+import { TemplatePortal } from '@angular/cdk/portal';
+import * as i0 from '@angular/core';
+import { inject, ElementRef, ViewContainerRef, DestroyRef, input, output, signal, effect, Directive, computed, Component, contentChildren, ViewChild, NgModule } from '@angular/core';
+import { filter } from 'rxjs/operators';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { LucideChevronRight, LucideCheck } from '@lucide/angular';
+
+class TalosDropdownTriggerDirective {
+    elementRef = inject(ElementRef);
+    overlay = inject(Overlay);
+    vcr = inject(ViewContainerRef);
+    destroyRef = inject(DestroyRef);
+    /** Menu component instance to trigger */
+    menu = input(null, { ...(ngDevMode ? { debugName: "menu" } : /* istanbul ignore next */ {}), alias: 'talosDropdownTrigger' });
+    /** Secondary alias for menu */
+    menuAlt = input(null, { ...(ngDevMode ? { debugName: "menuAlt" } : /* istanbul ignore next */ {}), alias: 'talosDropdown' });
+    /** Trigger activation mechanism: 'click', 'hover', or 'both' */
+    triggerOn = input('click', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "triggerOn" }] : /* istanbul ignore next */ []));
+    /** Desired placement around the trigger */
+    placement = input('bottom-start', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "placement" }] : /* istanbul ignore next */ []));
+    /** Element, ElementRef, or Component instance to which the dropdown overlay is anchored/attached */
+    connectedTo = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "connectedTo" }] : /* istanbul ignore next */ []));
+    /** Secondary alias for connectedTo */
+    origin = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "origin" }] : /* istanbul ignore next */ []));
+    /** Whether the dropdown overlay should match the width of the connected element */
+    matchWidth = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "matchWidth" }] : /* istanbul ignore next */ []));
+    /** Whether the dropdown trigger is disabled */
+    disabled = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Delay in milliseconds before closing on hover leave */
+    hoverDelay = input(150, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hoverDelay" }] : /* istanbul ignore next */ []));
+    /** Vertical offset in pixels from the trigger */
+    offsetY = input(4, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "offsetY" }] : /* istanbul ignore next */ []));
+    /** Horizontal offset in pixels from the trigger */
+    offsetX = input(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "offsetX" }] : /* istanbul ignore next */ []));
+    /** Whether clicking any menu item automatically closes the menu */
+    closeOnItemClick = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "closeOnItemClick" }] : /* istanbul ignore next */ []));
+    /** Emitted when the dropdown opens */
+    opened = output();
+    /** Emitted when the dropdown closes */
+    closed = output();
+    /** Current open state signal */
+    isOpen = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+    overlayRef = null;
+    portal = null;
+    hoverTimer = null;
+    constructor() {
+        // Listen to menu panel mouse events for hover bridging
+        effect(() => {
+            const activeMenu = this.activeMenu;
+            if (!activeMenu)
+                return;
+            activeMenu.panelMouseEnter.subscribe(() => {
+                if (this.triggerOn() === 'hover' || this.triggerOn() === 'both') {
+                    this.cancelHoverClose();
+                }
+            });
+            activeMenu.panelMouseLeave.subscribe(() => {
+                if (this.triggerOn() === 'hover' || this.triggerOn() === 'both') {
+                    this.scheduleHoverClose();
+                }
+            });
+            activeMenu.itemActivated.subscribe(() => {
+                if (this.closeOnItemClick()) {
+                    this.close();
+                }
+            });
+        });
+        // Listen to origin element mouse events for hover bridging when anchor differs from trigger
+        effect((onCleanup) => {
+            const originEl = this.targetOriginElement;
+            if (originEl && originEl !== this.elementRef.nativeElement) {
+                const onOriginEnter = () => {
+                    if (this.isOpen() && (this.triggerOn() === 'hover' || this.triggerOn() === 'both')) {
+                        this.cancelHoverClose();
+                    }
+                };
+                const onOriginLeave = () => {
+                    if (this.isOpen() && (this.triggerOn() === 'hover' || this.triggerOn() === 'both')) {
+                        this.scheduleHoverClose();
+                    }
+                };
+                originEl.addEventListener('mouseenter', onOriginEnter);
+                originEl.addEventListener('mouseleave', onOriginLeave);
+                onCleanup(() => {
+                    originEl.removeEventListener('mouseenter', onOriginEnter);
+                    originEl.removeEventListener('mouseleave', onOriginLeave);
+                });
+            }
+        });
+        this.destroyRef.onDestroy(() => {
+            this.clearHoverTimer();
+            this.disposeOverlay();
+        });
+    }
+    get activeMenu() {
+        return this.menu() || this.menuAlt();
+    }
+    get targetOrigin() {
+        const custom = this.connectedTo() || this.origin();
+        if (!custom) {
+            return this.elementRef;
+        }
+        if (custom instanceof ElementRef) {
+            return custom;
+        }
+        if (typeof HTMLElement !== 'undefined' && custom instanceof HTMLElement) {
+            return custom;
+        }
+        if (typeof custom === 'object' && custom !== null) {
+            if ('elementRef' in custom && custom.elementRef instanceof ElementRef) {
+                return custom.elementRef;
+            }
+            if ('nativeElement' in custom && custom.nativeElement instanceof HTMLElement) {
+                return custom.nativeElement;
+            }
+        }
+        return this.elementRef;
+    }
+    get targetOriginElement() {
+        const origin = this.targetOrigin;
+        if (origin instanceof ElementRef) {
+            return origin.nativeElement;
+        }
+        return origin;
+    }
+    handleClick(event) {
+        if (this.disabled())
+            return;
+        if (this.triggerOn() === 'click' || this.triggerOn() === 'both') {
+            event.preventDefault();
+            this.toggle();
+        }
+    }
+    handleMouseEnter() {
+        if (this.disabled())
+            return;
+        if (this.triggerOn() === 'hover' || this.triggerOn() === 'both') {
+            this.cancelHoverClose();
+            this.open();
+        }
+    }
+    handleMouseLeave() {
+        if (this.disabled())
+            return;
+        if (this.triggerOn() === 'hover' || this.triggerOn() === 'both') {
+            this.scheduleHoverClose();
+        }
+    }
+    handleKeyDownArrowDown(event) {
+        if (this.disabled())
+            return;
+        event.preventDefault();
+        if (!this.isOpen()) {
+            this.open();
+        }
+        setTimeout(() => {
+            this.activeMenu?.focusFirstItem();
+        }, 10);
+    }
+    handleKeyDownEscape(event) {
+        if (this.isOpen()) {
+            event.preventDefault();
+            this.close();
+            this.elementRef.nativeElement.focus();
+        }
+    }
+    open() {
+        if (this.disabled() || this.isOpen() || !this.activeMenu) {
+            return;
+        }
+        const overlayRef = this.getOrCreateOverlay();
+        if (!this.portal) {
+            this.portal = new TemplatePortal(this.activeMenu.templateRef, this.vcr);
+        }
+        if (this.matchWidth()) {
+            const width = this.targetOriginElement.offsetWidth;
+            if (width > 0) {
+                overlayRef.updateSize({ minWidth: width });
+            }
+        }
+        if (!overlayRef.hasAttached()) {
+            overlayRef.attach(this.portal);
+        }
+        this.isOpen.set(true);
+        this.opened.emit();
+    }
+    close() {
+        if (!this.isOpen())
+            return;
+        this.clearHoverTimer();
+        if (this.overlayRef?.hasAttached()) {
+            this.overlayRef.detach();
+        }
+        this.activeMenu?.resetFocus();
+        this.isOpen.set(false);
+        this.closed.emit();
+    }
+    toggle() {
+        if (this.isOpen()) {
+            this.close();
+        }
+        else {
+            this.open();
+        }
+    }
+    scheduleHoverClose() {
+        this.clearHoverTimer();
+        this.hoverTimer = setTimeout(() => {
+            this.close();
+        }, this.hoverDelay());
+    }
+    cancelHoverClose() {
+        this.clearHoverTimer();
+    }
+    clearHoverTimer() {
+        if (this.hoverTimer) {
+            clearTimeout(this.hoverTimer);
+            this.hoverTimer = null;
+        }
+    }
+    getOrCreateOverlay() {
+        if (this.overlayRef) {
+            return this.overlayRef;
+        }
+        const positionStrategy = this.createPositionStrategy();
+        this.overlayRef = this.overlay.create({
+            positionStrategy,
+            scrollStrategy: this.overlay.scrollStrategies.reposition(),
+            hasBackdrop: false,
+            minWidth: this.matchWidth() ? this.targetOriginElement.offsetWidth : undefined
+        });
+        // Close when clicking outside of both the trigger element and the overlay
+        this.overlayRef
+            .outsidePointerEvents()
+            .pipe(filter(event => !this.elementRef.nativeElement.contains(event.target)))
+            .subscribe(() => {
+            this.close();
+        });
+        return this.overlayRef;
+    }
+    createPositionStrategy() {
+        const chosenPlacement = this.placement() || this.activeMenu?.placement() || 'bottom-start';
+        const offsetY = this.offsetY();
+        const offsetX = this.offsetX();
+        const positions = this.getPositionsForPlacement(chosenPlacement, offsetX, offsetY);
+        return this.overlay
+            .position()
+            .flexibleConnectedTo(this.targetOrigin)
+            .withPositions(positions)
+            .withPush(true)
+            .withFlexibleDimensions(false);
+    }
+    getPositionsForPlacement(placement, offsetX, offsetY) {
+        const bottomStart = {
+            originX: 'start',
+            originY: 'bottom',
+            overlayX: 'start',
+            overlayY: 'top',
+            offsetX,
+            offsetY
+        };
+        const bottomEnd = {
+            originX: 'end',
+            originY: 'bottom',
+            overlayX: 'end',
+            overlayY: 'top',
+            offsetX,
+            offsetY
+        };
+        const bottomCenter = {
+            originX: 'center',
+            originY: 'bottom',
+            overlayX: 'center',
+            overlayY: 'top',
+            offsetX,
+            offsetY
+        };
+        const topStart = {
+            originX: 'start',
+            originY: 'top',
+            overlayX: 'start',
+            overlayY: 'bottom',
+            offsetX,
+            offsetY: -offsetY
+        };
+        const topEnd = {
+            originX: 'end',
+            originY: 'top',
+            overlayX: 'end',
+            overlayY: 'bottom',
+            offsetX,
+            offsetY: -offsetY
+        };
+        const topCenter = {
+            originX: 'center',
+            originY: 'top',
+            overlayX: 'center',
+            overlayY: 'bottom',
+            offsetX,
+            offsetY: -offsetY
+        };
+        const rightStart = {
+            originX: 'end',
+            originY: 'top',
+            overlayX: 'start',
+            overlayY: 'top',
+            offsetX: offsetY,
+            offsetY: offsetX
+        };
+        const leftStart = {
+            originX: 'start',
+            originY: 'top',
+            overlayX: 'end',
+            overlayY: 'top',
+            offsetX: -offsetY,
+            offsetY: offsetX
+        };
+        switch (placement) {
+            case 'bottom-end':
+                return [bottomEnd, topEnd, bottomStart, topStart];
+            case 'bottom':
+                return [bottomCenter, topCenter, bottomStart, bottomEnd];
+            case 'top-start':
+                return [topStart, bottomStart, topEnd, bottomEnd];
+            case 'top-end':
+                return [topEnd, bottomEnd, topStart, bottomStart];
+            case 'top':
+                return [topCenter, bottomCenter, topStart, topEnd];
+            case 'right-start':
+            case 'right':
+                return [rightStart, leftStart, bottomStart, topStart];
+            case 'left-start':
+            case 'left':
+                return [leftStart, rightStart, bottomStart, topStart];
+            case 'bottom-start':
+            default:
+                return [bottomStart, topStart, bottomEnd, topEnd];
+        }
+    }
+    disposeOverlay() {
+        if (this.overlayRef) {
+            this.overlayRef.dispose();
+            this.overlayRef = null;
+            this.portal = null;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: TalosDropdownTriggerDirective, isStandalone: true, selector: "[talosDropdownTrigger], [talosDropdown]", inputs: { menu: { classPropertyName: "menu", publicName: "talosDropdownTrigger", isSignal: true, isRequired: false, transformFunction: null }, menuAlt: { classPropertyName: "menuAlt", publicName: "talosDropdown", isSignal: true, isRequired: false, transformFunction: null }, triggerOn: { classPropertyName: "triggerOn", publicName: "triggerOn", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, connectedTo: { classPropertyName: "connectedTo", publicName: "connectedTo", isSignal: true, isRequired: false, transformFunction: null }, origin: { classPropertyName: "origin", publicName: "origin", isSignal: true, isRequired: false, transformFunction: null }, matchWidth: { classPropertyName: "matchWidth", publicName: "matchWidth", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hoverDelay: { classPropertyName: "hoverDelay", publicName: "hoverDelay", isSignal: true, isRequired: false, transformFunction: null }, offsetY: { classPropertyName: "offsetY", publicName: "offsetY", isSignal: true, isRequired: false, transformFunction: null }, offsetX: { classPropertyName: "offsetX", publicName: "offsetX", isSignal: true, isRequired: false, transformFunction: null }, closeOnItemClick: { classPropertyName: "closeOnItemClick", publicName: "closeOnItemClick", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "opened", closed: "closed" }, host: { listeners: { "click": "handleClick($event)", "mouseenter": "handleMouseEnter()", "mouseleave": "handleMouseLeave()", "keydown.arrowdown": "handleKeyDownArrowDown($event)", "keydown.escape": "handleKeyDownEscape($event)" }, properties: { "attr.aria-haspopup": "\"menu\"", "attr.aria-expanded": "isOpen()", "class.talos-dropdown-open": "isOpen()" } }, exportAs: ["talosDropdownTrigger"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownTriggerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[talosDropdownTrigger], [talosDropdown]',
+                    exportAs: 'talosDropdownTrigger',
+                    host: {
+                        '[attr.aria-haspopup]': '"menu"',
+                        '[attr.aria-expanded]': 'isOpen()',
+                        '[class.talos-dropdown-open]': 'isOpen()',
+                        '(click)': 'handleClick($event)',
+                        '(mouseenter)': 'handleMouseEnter()',
+                        '(mouseleave)': 'handleMouseLeave()',
+                        '(keydown.arrowdown)': 'handleKeyDownArrowDown($event)',
+                        '(keydown.escape)': 'handleKeyDownEscape($event)'
+                    }
+                }]
+        }], ctorParameters: () => [], propDecorators: { menu: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosDropdownTrigger", required: false }] }], menuAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "talosDropdown", required: false }] }], triggerOn: [{ type: i0.Input, args: [{ isSignal: true, alias: "triggerOn", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], connectedTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "connectedTo", required: false }] }], origin: [{ type: i0.Input, args: [{ isSignal: true, alias: "origin", required: false }] }], matchWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "matchWidth", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hoverDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverDelay", required: false }] }], offsetY: [{ type: i0.Input, args: [{ isSignal: true, alias: "offsetY", required: false }] }], offsetX: [{ type: i0.Input, args: [{ isSignal: true, alias: "offsetX", required: false }] }], closeOnItemClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnItemClick", required: false }] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
+
+class TalosDropdownItemComponent {
+    elementRef = inject(ElementRef);
+    overlay = inject(Overlay);
+    vcr = inject(ViewContainerRef);
+    destroyRef = inject(DestroyRef);
+    /** Optional plain text label (if not using content projection) */
+    label = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Optional icon component type */
+    icon = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
+    /** Optional external link URL */
+    href = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "href" }] : /* istanbul ignore next */ []));
+    /** Target for external link (default '_blank' when href is present) */
+    target = input('_blank', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "target" }] : /* istanbul ignore next */ []));
+    /** Visual variant: default, danger, primary, success, warning */
+    variant = input('default', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Quick flag for destructive danger styling */
+    danger = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "danger" }] : /* istanbul ignore next */ []));
+    /** Disabled state */
+    disabled = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Keyboard shortcut hint text (e.g. '⌘K', 'Ctrl+S') */
+    shortcut = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "shortcut" }] : /* istanbul ignore next */ []));
+    /** Checkable / selectable state */
+    checked = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
+    /** Optional badge text or number */
+    badge = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "badge" }] : /* istanbul ignore next */ []));
+    /** Badge visual variant */
+    badgeVariant = input('primary', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "badgeVariant" }] : /* istanbul ignore next */ []));
+    /** Child Sub-menu to fly out when hovering/clicking */
+    subMenu = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "subMenu" }] : /* istanbul ignore next */ []));
+    /** Emitted when the item is activated */
+    itemClick = output();
+    /** Whether this item has an attached sub-menu */
+    hasSubMenu = computed(() => !!this.subMenu(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasSubMenu" }] : /* istanbul ignore next */ []));
+    /** Whether the sub-menu is currently opened */
+    isSubMenuOpen = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isSubMenuOpen" }] : /* istanbul ignore next */ []));
+    /** Internal callback set by parent menu container to notify on click */
+    _onActivate;
+    /** Internal callback set by parent menu container to notify on item hover */
+    _onHover;
+    overlayRef = null;
+    portal = null;
+    hoverTimer = null;
+    constructor() {
+        // Listen to sub-menu mouse & item activation events
+        effect(() => {
+            const childMenu = this.subMenu();
+            if (!childMenu)
+                return;
+            childMenu.panelMouseEnter.subscribe(() => {
+                this.cancelHoverClose();
+            });
+            childMenu.panelMouseLeave.subscribe(() => {
+                this.scheduleHoverClose();
+            });
+            childMenu.itemActivated.subscribe((e) => {
+                if (this._onActivate) {
+                    this._onActivate(e);
+                }
+            });
+        });
+        this.destroyRef.onDestroy(() => {
+            this.clearHoverTimer();
+            this.disposeOverlay();
+        });
+    }
+    handleClick(event) {
+        if (this.disabled()) {
+            event.preventDefault();
+            event.stopPropagation();
+            return;
+        }
+        if (this.hasSubMenu()) {
+            event.preventDefault();
+            event.stopPropagation();
+            this.toggleSubMenu();
+            return;
+        }
+        this.itemClick.emit(event);
+        if (this._onActivate) {
+            this._onActivate(event);
+        }
+    }
+    handleMouseEnter() {
+        if (this.disabled())
+            return;
+        if (this._onHover) {
+            this._onHover(this);
+        }
+        if (this.hasSubMenu()) {
+            this.cancelHoverClose();
+            this.hoverTimer = setTimeout(() => {
+                this.openSubMenu();
+            }, 60);
+        }
+    }
+    handleMouseLeave() {
+        if (this.disabled())
+            return;
+        if (this.hasSubMenu()) {
+            this.scheduleHoverClose();
+        }
+    }
+    openSubMenu() {
+        if (this.disabled() || this.isSubMenuOpen() || !this.subMenu()) {
+            return;
+        }
+        const overlayRef = this.getOrCreateOverlay();
+        if (!this.portal && this.subMenu()) {
+            this.portal = new TemplatePortal(this.subMenu().templateRef, this.vcr);
+        }
+        if (!overlayRef.hasAttached() && this.portal) {
+            overlayRef.attach(this.portal);
+        }
+        this.isSubMenuOpen.set(true);
+    }
+    closeSubMenu() {
+        if (!this.isSubMenuOpen())
+            return;
+        this.clearHoverTimer();
+        if (this.overlayRef?.hasAttached()) {
+            this.overlayRef.detach();
+        }
+        this.subMenu()?.resetFocus();
+        this.isSubMenuOpen.set(false);
+    }
+    toggleSubMenu() {
+        if (this.isSubMenuOpen()) {
+            this.closeSubMenu();
+        }
+        else {
+            this.openSubMenu();
+        }
+    }
+    scheduleHoverClose() {
+        this.clearHoverTimer();
+        this.hoverTimer = setTimeout(() => {
+            this.closeSubMenu();
+        }, 180);
+    }
+    cancelHoverClose() {
+        this.clearHoverTimer();
+    }
+    clearHoverTimer() {
+        if (this.hoverTimer) {
+            clearTimeout(this.hoverTimer);
+            this.hoverTimer = null;
+        }
+    }
+    getOrCreateOverlay() {
+        if (this.overlayRef) {
+            return this.overlayRef;
+        }
+        const positionStrategy = this.createSubMenuPositionStrategy();
+        this.overlayRef = this.overlay.create({
+            positionStrategy,
+            scrollStrategy: this.overlay.scrollStrategies.reposition(),
+            hasBackdrop: false
+        });
+        return this.overlayRef;
+    }
+    createSubMenuPositionStrategy() {
+        const positions = [
+            // Standard right-start flyout (offset by 4px)
+            {
+                originX: 'end',
+                originY: 'top',
+                overlayX: 'start',
+                overlayY: 'top',
+                offsetX: 4,
+                offsetY: -4
+            },
+            // Flip left-start if right edge of viewport is reached
+            {
+                originX: 'start',
+                originY: 'top',
+                overlayX: 'end',
+                overlayY: 'top',
+                offsetX: -4,
+                offsetY: -4
+            },
+            // Flip bottom aligned if bottom edge is reached
+            {
+                originX: 'end',
+                originY: 'bottom',
+                overlayX: 'start',
+                overlayY: 'bottom',
+                offsetX: 4,
+                offsetY: 4
+            },
+            {
+                originX: 'start',
+                originY: 'bottom',
+                overlayX: 'end',
+                overlayY: 'bottom',
+                offsetX: -4,
+                offsetY: 4
+            }
+        ];
+        return this.overlay
+            .position()
+            .flexibleConnectedTo(this.elementRef)
+            .withPositions(positions)
+            .withPush(true)
+            .withFlexibleDimensions(false);
+    }
+    disposeOverlay() {
+        if (this.overlayRef) {
+            this.overlayRef.dispose();
+            this.overlayRef = null;
+            this.portal = null;
+        }
+    }
+    focus() {
+        const focusable = this.elementRef.nativeElement.querySelector('button, a');
+        focusable?.focus();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosDropdownItemComponent, isStandalone: true, selector: "talos-dropdown-item, button[talosDropdownItem], a[talosDropdownItem]", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, danger: { classPropertyName: "danger", publicName: "danger", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, shortcut: { classPropertyName: "shortcut", publicName: "shortcut", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null }, badgeVariant: { classPropertyName: "badgeVariant", publicName: "badgeVariant", isSignal: true, isRequired: false, transformFunction: null }, subMenu: { classPropertyName: "subMenu", publicName: "subMenu", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, host: { attributes: { "role": "none" }, listeners: { "mouseenter": "handleMouseEnter()", "mouseleave": "handleMouseLeave()" }, properties: { "class.is-disabled": "disabled()", "class.is-danger": "danger() || variant() === \"danger\"", "class.is-primary": "variant() === \"primary\"", "class.is-success": "variant() === \"success\"", "class.has-submenu": "hasSubMenu()", "class.is-submenu-open": "isSubMenuOpen()", "class.is-checked": "checked() === true" }, classAttribute: "talos-dropdown-item-host" }, ngImport: i0, template: `
+    @if (href()) {
+      <a
+        class="talos-dropdown-item-link"
+        [href]="href()"
+        [target]="target()"
+        [rel]="target() === '_blank' ? 'noopener noreferrer' : null"
+        [attr.tabindex]="disabled() ? -1 : 0"
+        (click)="handleClick($event)"
+      >
+        <ng-container *ngTemplateOutlet="itemBody"></ng-container>
+      </a>
+    } @else {
+      <button
+        type="button"
+        class="talos-dropdown-item-btn"
+        [disabled]="disabled()"
+        [attr.tabindex]="disabled() ? -1 : 0"
+        [attr.aria-haspopup]="hasSubMenu() ? 'menu' : null"
+        [attr.aria-expanded]="hasSubMenu() ? isSubMenuOpen() : null"
+        (click)="handleClick($event)"
+      >
+        <ng-container *ngTemplateOutlet="itemBody"></ng-container>
+      </button>
+    }
+
+    <ng-template #itemBody>
+      <!-- Checkmark for checkable items -->
+      @if (checked() !== null && checked() !== undefined) {
+        <span class="talos-dropdown-item-check" [class.is-checked]="checked()">
+          @if (checked()) {
+            <svg lucideCheck [size]="13"></svg>
+          }
+        </span>
+      }
+
+      <!-- Custom Prefix Icon -->
+      @if (icon(); as itemIcon) {
+        <span class="talos-dropdown-item-icon">
+          <ng-container *ngComponentOutlet="itemIcon" />
+        </span>
+      }
+
+      <!-- Item Label / Content -->
+      <span class="talos-dropdown-item-label">
+        @if (label()) {
+          {{ label() }}
+        } @else {
+          <ng-content />
+        }
+      </span>
+
+      <!-- Optional Status Badge -->
+      @if (badge() !== null && badge() !== undefined && badge() !== '') {
+        <span class="talos-dropdown-item-badge" [class]="'badge-' + (badgeVariant() || 'primary')">
+          {{ badge() }}
+        </span>
+      }
+
+      <!-- Keyboard Shortcut Key Hint -->
+      @if (shortcut()) {
+        <kbd class="talos-dropdown-item-shortcut">{{ shortcut() }}</kbd>
+      }
+
+      <!-- Right Chevron for Sub-menus -->
+      @if (hasSubMenu()) {
+        <span class="talos-dropdown-item-submenu-arrow">
+          <svg lucideChevronRight [size]="13"></svg>
+        </span>
+      }
+    </ng-template>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LucideChevronRight, selector: "svg[lucideChevronRight]" }, { kind: "component", type: LucideCheck, selector: "svg[lucideCheck]" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownItemComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'talos-dropdown-item, button[talosDropdownItem], a[talosDropdownItem]',
+                    imports: [CommonModule, LucideChevronRight, LucideCheck],
+                    template: `
+    @if (href()) {
+      <a
+        class="talos-dropdown-item-link"
+        [href]="href()"
+        [target]="target()"
+        [rel]="target() === '_blank' ? 'noopener noreferrer' : null"
+        [attr.tabindex]="disabled() ? -1 : 0"
+        (click)="handleClick($event)"
+      >
+        <ng-container *ngTemplateOutlet="itemBody"></ng-container>
+      </a>
+    } @else {
+      <button
+        type="button"
+        class="talos-dropdown-item-btn"
+        [disabled]="disabled()"
+        [attr.tabindex]="disabled() ? -1 : 0"
+        [attr.aria-haspopup]="hasSubMenu() ? 'menu' : null"
+        [attr.aria-expanded]="hasSubMenu() ? isSubMenuOpen() : null"
+        (click)="handleClick($event)"
+      >
+        <ng-container *ngTemplateOutlet="itemBody"></ng-container>
+      </button>
+    }
+
+    <ng-template #itemBody>
+      <!-- Checkmark for checkable items -->
+      @if (checked() !== null && checked() !== undefined) {
+        <span class="talos-dropdown-item-check" [class.is-checked]="checked()">
+          @if (checked()) {
+            <svg lucideCheck [size]="13"></svg>
+          }
+        </span>
+      }
+
+      <!-- Custom Prefix Icon -->
+      @if (icon(); as itemIcon) {
+        <span class="talos-dropdown-item-icon">
+          <ng-container *ngComponentOutlet="itemIcon" />
+        </span>
+      }
+
+      <!-- Item Label / Content -->
+      <span class="talos-dropdown-item-label">
+        @if (label()) {
+          {{ label() }}
+        } @else {
+          <ng-content />
+        }
+      </span>
+
+      <!-- Optional Status Badge -->
+      @if (badge() !== null && badge() !== undefined && badge() !== '') {
+        <span class="talos-dropdown-item-badge" [class]="'badge-' + (badgeVariant() || 'primary')">
+          {{ badge() }}
+        </span>
+      }
+
+      <!-- Keyboard Shortcut Key Hint -->
+      @if (shortcut()) {
+        <kbd class="talos-dropdown-item-shortcut">{{ shortcut() }}</kbd>
+      }
+
+      <!-- Right Chevron for Sub-menus -->
+      @if (hasSubMenu()) {
+        <span class="talos-dropdown-item-submenu-arrow">
+          <svg lucideChevronRight [size]="13"></svg>
+        </span>
+      }
+    </ng-template>
+  `,
+                    host: {
+                        'class': 'talos-dropdown-item-host',
+                        'role': 'none',
+                        '[class.is-disabled]': 'disabled()',
+                        '[class.is-danger]': 'danger() || variant() === "danger"',
+                        '[class.is-primary]': 'variant() === "primary"',
+                        '[class.is-success]': 'variant() === "success"',
+                        '[class.has-submenu]': 'hasSubMenu()',
+                        '[class.is-submenu-open]': 'isSubMenuOpen()',
+                        '[class.is-checked]': 'checked() === true',
+                        '(mouseenter)': 'handleMouseEnter()',
+                        '(mouseleave)': 'handleMouseLeave()'
+                    }
+                }]
+        }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], danger: [{ type: i0.Input, args: [{ isSignal: true, alias: "danger", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], shortcut: [{ type: i0.Input, args: [{ isSignal: true, alias: "shortcut", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], badge: [{ type: i0.Input, args: [{ isSignal: true, alias: "badge", required: false }] }], badgeVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "badgeVariant", required: false }] }], subMenu: [{ type: i0.Input, args: [{ isSignal: true, alias: "subMenu", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }] } });
+
+class TalosDropdownMenuComponent {
+    templateRef;
+    panelEl;
+    /** Optional custom CSS class applied to the dropdown panel */
+    customClass = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "customClass" }] : /* istanbul ignore next */ []));
+    /** Minimum width of the dropdown menu */
+    minWidth = input('180px', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "minWidth" }] : /* istanbul ignore next */ []));
+    /** Maximum width of the dropdown menu */
+    maxWidth = input('360px', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "maxWidth" }] : /* istanbul ignore next */ []));
+    /** Preferred placement of the dropdown menu */
+    placement = input('bottom-start', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "placement" }] : /* istanbul ignore next */ []));
+    /** Whether clicking an item should automatically close the dropdown */
+    autoClose = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "autoClose" }] : /* istanbul ignore next */ []));
+    /** Emitted when mouse enters the floating menu panel */
+    panelMouseEnter = output();
+    /** Emitted when mouse leaves the floating menu panel */
+    panelMouseLeave = output();
+    /** Emitted when an item inside this menu is activated */
+    itemActivated = output();
+    /** Query all menu items inside */
+    items = contentChildren(TalosDropdownItemComponent, { ...(ngDevMode ? { debugName: "items" } : /* istanbul ignore next */ {}), descendants: true });
+    focusedItemIndex = signal(-1, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "focusedItemIndex" }] : /* istanbul ignore next */ []));
+    constructor() {
+        // Coordinate items: activation & closing sibling submenus on hover
+        effect(() => {
+            const itemList = this.items();
+            for (const item of itemList) {
+                item._onActivate = (e) => {
+                    this.closeAllSubMenus();
+                    this.itemActivated.emit(e);
+                };
+                item._onHover = (hoveredItem) => {
+                    // Close submenus on all other sibling items
+                    for (const other of this.items()) {
+                        if (other !== hoveredItem && other.hasSubMenu()) {
+                            other.closeSubMenu();
+                        }
+                    }
+                };
+            }
+        });
+    }
+    handlePanelMouseEnter() {
+        this.panelMouseEnter.emit();
+    }
+    handlePanelMouseLeave() {
+        this.panelMouseLeave.emit();
+    }
+    closeAllSubMenus() {
+        for (const item of this.items()) {
+            if (item.hasSubMenu()) {
+                item.closeSubMenu();
+            }
+        }
+    }
+    handleKeyDown(event) {
+        const itemList = this.items().filter(item => !item.disabled());
+        if (itemList.length === 0)
+            return;
+        switch (event.key) {
+            case 'ArrowDown': {
+                event.preventDefault();
+                const nextIndex = (this.focusedItemIndex() + 1) % itemList.length;
+                this.focusedItemIndex.set(nextIndex);
+                itemList[nextIndex]?.focus();
+                break;
+            }
+            case 'ArrowUp': {
+                event.preventDefault();
+                const prevIndex = (this.focusedItemIndex() - 1 + itemList.length) % itemList.length;
+                this.focusedItemIndex.set(prevIndex);
+                itemList[prevIndex]?.focus();
+                break;
+            }
+            case 'ArrowRight': {
+                const currentItem = itemList[this.focusedItemIndex()];
+                if (currentItem && currentItem.hasSubMenu()) {
+                    event.preventDefault();
+                    currentItem.openSubMenu();
+                    setTimeout(() => {
+                        currentItem.subMenu()?.focusFirstItem();
+                    }, 20);
+                }
+                break;
+            }
+            case 'Home': {
+                event.preventDefault();
+                this.focusedItemIndex.set(0);
+                itemList[0]?.focus();
+                break;
+            }
+            case 'End': {
+                event.preventDefault();
+                const lastIndex = itemList.length - 1;
+                this.focusedItemIndex.set(lastIndex);
+                itemList[lastIndex]?.focus();
+                break;
+            }
+            default:
+                break;
+        }
+    }
+    focusFirstItem() {
+        const availableItems = this.items().filter(item => !item.disabled());
+        if (availableItems.length > 0) {
+            this.focusedItemIndex.set(0);
+            availableItems[0]?.focus();
+        }
+    }
+    resetFocus() {
+        this.focusedItemIndex.set(-1);
+        this.closeAllSubMenus();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.1", type: TalosDropdownMenuComponent, isStandalone: true, selector: "talos-dropdown-menu", inputs: { customClass: { classPropertyName: "customClass", publicName: "customClass", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, autoClose: { classPropertyName: "autoClose", publicName: "autoClose", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { panelMouseEnter: "panelMouseEnter", panelMouseLeave: "panelMouseLeave", itemActivated: "itemActivated" }, host: { styleAttribute: "display: none;" }, queries: [{ propertyName: "items", predicate: TalosDropdownItemComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["templateRef"], descendants: true, static: true }, { propertyName: "panelEl", first: true, predicate: ["panelEl"], descendants: true }], exportAs: ["talosDropdownMenu"], ngImport: i0, template: `
+    <ng-template #templateRef>
+      <div
+        #panelEl
+        class="talos-dropdown-panel"
+        [class]="customClass()"
+        [style.min-width]="minWidth()"
+        [style.max-width]="maxWidth()"
+        role="menu"
+        tabindex="-1"
+        (mouseenter)="handlePanelMouseEnter()"
+        (mouseleave)="handlePanelMouseLeave()"
+        (keydown)="handleKeyDown($event)"
+      >
+        <ng-content />
+      </div>
+    </ng-template>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownMenuComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'talos-dropdown-menu',
+                    exportAs: 'talosDropdownMenu',
+                    imports: [CommonModule],
+                    template: `
+    <ng-template #templateRef>
+      <div
+        #panelEl
+        class="talos-dropdown-panel"
+        [class]="customClass()"
+        [style.min-width]="minWidth()"
+        [style.max-width]="maxWidth()"
+        role="menu"
+        tabindex="-1"
+        (mouseenter)="handlePanelMouseEnter()"
+        (mouseleave)="handlePanelMouseLeave()"
+        (keydown)="handleKeyDown($event)"
+      >
+        <ng-content />
+      </div>
+    </ng-template>
+  `,
+                    host: {
+                        'style': 'display: none;'
+                    }
+                }]
+        }], ctorParameters: () => [], propDecorators: { templateRef: [{
+                type: ViewChild,
+                args: ['templateRef', { static: true }]
+            }], panelEl: [{
+                type: ViewChild,
+                args: ['panelEl']
+            }], customClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "customClass", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], autoClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoClose", required: false }] }], panelMouseEnter: [{ type: i0.Output, args: ["panelMouseEnter"] }], panelMouseLeave: [{ type: i0.Output, args: ["panelMouseLeave"] }], itemActivated: [{ type: i0.Output, args: ["itemActivated"] }], items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => TalosDropdownItemComponent), { ...{ descendants: true }, isSignal: true }] }] } });
+
+class TalosDropdownDividerComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: TalosDropdownDividerComponent, isStandalone: true, selector: "talos-dropdown-divider, [talosDropdownDivider]", host: { attributes: { "role": "separator", "aria-orientation": "horizontal" }, classAttribute: "talos-dropdown-divider" }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownDividerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'talos-dropdown-divider, [talosDropdownDivider]',
+                    template: '',
+                    host: {
+                        'class': 'talos-dropdown-divider',
+                        'role': 'separator',
+                        'aria-orientation': 'horizontal'
+                    }
+                }]
+        }] });
+
+class TalosDropdownHeaderComponent {
+    /** Optional header title string */
+    title = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: TalosDropdownHeaderComponent, isStandalone: true, selector: "talos-dropdown-header, [talosDropdownHeader]", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "presentation" }, classAttribute: "talos-dropdown-header" }, ngImport: i0, template: `
+    <span class="talos-dropdown-header-text">
+      @if (title()) {
+        {{ title() }}
+      } @else {
+        <ng-content />
+      }
+    </span>
+  `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownHeaderComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'talos-dropdown-header, [talosDropdownHeader]',
+                    template: `
+    <span class="talos-dropdown-header-text">
+      @if (title()) {
+        {{ title() }}
+      } @else {
+        <ng-content />
+      }
+    </span>
+  `,
+                    host: {
+                        'class': 'talos-dropdown-header',
+                        'role': 'presentation'
+                    }
+                }]
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }] } });
+
+const DROPDOWN_DECLARATIONS = [
+    TalosDropdownTriggerDirective,
+    TalosDropdownMenuComponent,
+    TalosDropdownItemComponent,
+    TalosDropdownDividerComponent,
+    TalosDropdownHeaderComponent
+];
+class TalosDropdownModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownModule, imports: [TalosDropdownTriggerDirective,
+            TalosDropdownMenuComponent,
+            TalosDropdownItemComponent,
+            TalosDropdownDividerComponent,
+            TalosDropdownHeaderComponent], exports: [TalosDropdownTriggerDirective,
+            TalosDropdownMenuComponent,
+            TalosDropdownItemComponent,
+            TalosDropdownDividerComponent,
+            TalosDropdownHeaderComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownModule, imports: [TalosDropdownMenuComponent,
+            TalosDropdownItemComponent] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: TalosDropdownModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [...DROPDOWN_DECLARATIONS],
+                    exports: [...DROPDOWN_DECLARATIONS]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TalosDropdownDividerComponent, TalosDropdownHeaderComponent, TalosDropdownItemComponent, TalosDropdownMenuComponent, TalosDropdownModule, TalosDropdownTriggerDirective };
+//# sourceMappingURL=weeehaoooz-talos-ui-dropdown.mjs.map