@mintplayer/ng-bootstrap 21.30.0 → 21.31.0

package/fesm2022/mintplayer-ng-bootstrap-dropdown-menu.mjs

@@ -1,13 +1,106 @@
 import * as i0 from '@angular/core';
-import { inject, input, signal, ChangeDetectionStrategy, Component } from '@angular/core';
+import { inject, ElementRef, input, computed, afterNextRender, ChangeDetectionStrategy, Component, signal, contentChildren } from '@angular/core';
 import { BsDropdownDirective } from '@mintplayer/ng-bootstrap/dropdown';
+import { BsIdService } from '@mintplayer/ng-bootstrap/a11y';
+
+class BsDropdownItemComponent {
+    /**
+     * Resolved after first render so static `id="…"` attributes set by the consumer
+     * and any sibling host bindings have applied first. Read-only access for any
+     * other directive on the same element (e.g. BsRovingFocusItem) that needs a
+     * stable target id for aria-activedescendant.
+     */
+    get itemId() {
+        return this.elementRef.nativeElement.id;
+    }
+    constructor() {
+        this.parent = inject(BsDropdownDirective, { optional: true });
+        this.menu = inject(BsDropdownMenuComponent, { optional: true });
+        /** Public so BsDropdownMenuComponent can imperatively focus this item during keyboard nav. */
+        this.elementRef = inject(ElementRef);
+        this.ids = inject(BsIdService);
+        this.isSelected = input(false, ...(ngDevMode ? [{ debugName: "isSelected" }] : /* istanbul ignore next */ []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.itemRole = computed(() => this.parent?.popupRole() === 'listbox' ? 'option' : 'menuitem', ...(ngDevMode ? [{ debugName: "itemRole" }] : /* istanbul ignore next */ []));
+        this.ariaSelected = computed(() => {
+            if (this.parent?.popupRole() !== 'listbox')
+                return null;
+            return this.isSelected() ? 'true' : 'false';
+        }, ...(ngDevMode ? [{ debugName: "ariaSelected" }] : /* istanbul ignore next */ []));
+        /**
+         * Roving tabindex in menu mode: the focused item is 0, others -1.
+         * In listbox mode (typeahead/select2/etc.), the consumer applies bsRovingFocusItem
+         * externally for activedescendant management; this binding stays null so it
+         * doesn't fight that directive.
+         */
+        this.tabindex = computed(() => {
+            if (!this.menu?.isMenuMode())
+                return null;
+            if (this.disabled())
+                return -1;
+            return this.menu.isItemFocused(this) ? 0 : -1;
+        }, ...(ngDevMode ? [{ debugName: "tabindex" }] : /* istanbul ignore next */ []));
+        afterNextRender(() => {
+            if (!this.elementRef.nativeElement.id) {
+                this.elementRef.nativeElement.id = this.ids.next('bs-dropdown-item');
+            }
+        });
+    }
+    onFocus() {
+        this.menu?.setFocusedItem(this);
+    }
+    onActivate(event) {
+        if (this.disabled())
+            return;
+        event.preventDefault();
+        this.elementRef.nativeElement.click();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsDropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.11", type: BsDropdownItemComponent, isStandalone: true, selector: "bs-dropdown-item", inputs: { isSelected: { classPropertyName: "isSelected", publicName: "isSelected", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "focus": "onFocus()", "keydown.enter": "onActivate($event)", "keydown.space": "onActivate($event)" }, properties: { "attr.role": "itemRole()", "attr.aria-selected": "ariaSelected()", "attr.aria-disabled": "disabled() ? \"true\" : null", "attr.tabindex": "tabindex()" } }, ngImport: i0, template: "<li role=\"presentation\" class=\"dropdown-item cursor-pointer\" [class.active]=\"isSelected()\" [class.disabled]=\"disabled()\">\n    <ng-content></ng-content>\n</li>\n", styles: [":host(.bs-rovingfocus-active)>.dropdown-item:not(.disabled):not(.active){color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsDropdownItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bs-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[attr.role]': 'itemRole()',
+                        '[attr.aria-selected]': 'ariaSelected()',
+                        '[attr.aria-disabled]': 'disabled() ? "true" : null',
+                        '[attr.tabindex]': 'tabindex()',
+                        '(focus)': 'onFocus()',
+                        '(keydown.enter)': 'onActivate($event)',
+                        '(keydown.space)': 'onActivate($event)',
+                    }, template: "<li role=\"presentation\" class=\"dropdown-item cursor-pointer\" [class.active]=\"isSelected()\" [class.disabled]=\"disabled()\">\n    <ng-content></ng-content>\n</li>\n", styles: [":host(.bs-rovingfocus-active)>.dropdown-item:not(.disabled):not(.active){color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { isSelected: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSelected", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
 
-// import { BsDropdownComponent } from '@mintplayer/ng-bootstrap/dropdown';
 class BsDropdownMenuComponent {
     constructor() {
         this.bsDropdown = inject(BsDropdownDirective, { optional: true });
         this.maxHeight = input(null, ...(ngDevMode ? [{ debugName: "maxHeight" }] : /* istanbul ignore next */ []));
         this.dropdownWith = signal(null, ...(ngDevMode ? [{ debugName: "dropdownWith" }] : /* istanbul ignore next */ []));
+        this.menuRole = computed(() => this.bsDropdown?.popupRole() ?? null, ...(ngDevMode ? [{ debugName: "menuRole" }] : /* istanbul ignore next */ []));
+        this.menuId = computed(() => this.bsDropdown?.menuId() || null, ...(ngDevMode ? [{ debugName: "menuId" }] : /* istanbul ignore next */ []));
+        /**
+         * Items projected into this menu. Used in menu mode (popupRole='menu') to
+         * implement roving-tabindex keyboard navigation. In listbox mode, callers
+         * (typeahead/select2/etc.) typically apply their own bsRovingFocus directly,
+         * so this menu's keyboard handler is a no-op.
+         */
+        this.dropdownItems = contentChildren(BsDropdownItemComponent, { ...(ngDevMode ? { debugName: "dropdownItems" } : /* istanbul ignore next */ {}), descendants: true });
+        /** True when this is a plain menu (default), false when used as a combobox listbox. */
+        this.isMenuMode = computed(() => this.bsDropdown?.popupRole() !== 'listbox', ...(ngDevMode ? [{ debugName: "isMenuMode" }] : /* istanbul ignore next */ []));
+        /** Index into dropdownItems() of the item that currently holds the roving tabindex (menu mode). */
+        this.focusedIndex = signal(0, ...(ngDevMode ? [{ debugName: "focusedIndex" }] : /* istanbul ignore next */ []));
+    }
+    isItemFocused(item) {
+        if (!this.isMenuMode())
+            return false;
+        return this.dropdownItems()[this.focusedIndex()] === item;
+    }
+    setFocusedItem(item) {
+        if (!this.isMenuMode())
+            return;
+        const idx = this.dropdownItems().indexOf(item);
+        if (idx >= 0)
+            this.focusedIndex.set(idx);
     }
     onResize() {
         if ((typeof window !== 'undefined') && this.bsDropdown && this.bsDropdown.sameDropdownWidth()) {
@@ -18,29 +111,81 @@ class BsDropdownMenuComponent {
     ngAfterViewInit() {
         this.onResize();
     }
+    onKeydown(event) {
+        if (!this.isMenuMode())
+            return;
+        const items = this.dropdownItems();
+        if (items.length === 0)
+            return;
+        let handled = false;
+        switch (event.key) {
+            case 'ArrowDown':
+                this.moveFocus(+1);
+                handled = true;
+                break;
+            case 'ArrowUp':
+                this.moveFocus(-1);
+                handled = true;
+                break;
+            case 'Home':
+                this.moveTo(this.firstEnabledIndex());
+                handled = true;
+                break;
+            case 'End':
+                this.moveTo(this.lastEnabledIndex());
+                handled = true;
+                break;
+        }
+        if (handled)
+            event.preventDefault();
+    }
+    moveFocus(delta) {
+        const items = this.dropdownItems();
+        const total = items.length;
+        if (total === 0)
+            return;
+        let cursor = this.focusedIndex();
+        for (let i = 0; i < total; i++) {
+            cursor = (cursor + delta + total) % total;
+            if (!items[cursor].disabled()) {
+                this.moveTo(cursor);
+                return;
+            }
+        }
+    }
+    firstEnabledIndex() {
+        return this.dropdownItems().findIndex(it => !it.disabled());
+    }
+    lastEnabledIndex() {
+        const items = this.dropdownItems();
+        for (let i = items.length - 1; i >= 0; i--) {
+            if (!items[i].disabled())
+                return i;
+        }
+        return -1;
+    }
+    moveTo(index) {
+        if (index < 0)
+            return;
+        this.focusedIndex.set(index);
+        const target = this.dropdownItems()[index];
+        if (target) {
+            target.elementRef.nativeElement.focus();
+        }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsDropdownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.11", type: BsDropdownMenuComponent, isStandalone: true, selector: "bs-dropdown-menu", inputs: { maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onResize()" }, properties: { "style.width": "dropdownWith()" } }, ngImport: i0, template: "<ul class=\"dropdown-menu position-static w-100 overflow-auto show\" [style.max-height.px]=\"maxHeight()\">\n    <ng-content></ng-content>\n    <!-- <ng-content select=\"bs-dropdown-item\"></ng-content> -->\n</ul>", styles: [":host ::ng-deep .dropup,:host ::ng-deep .dropend,:host ::ng-deep .dropdown,:host ::ng-deep .dropstart,:host ::ng-deep .dropup-center,:host ::ng-deep .dropdown-center{position:relative}:host ::ng-deep .dropdown-toggle{white-space:nowrap}:host ::ng-deep .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid;border-right:.3em solid transparent;border-bottom:0;border-left:.3em solid transparent}:host ::ng-deep .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropdown-menu{--bs-dropdown-zindex: 1000;--bs-dropdown-min-width: 10rem;--bs-dropdown-padding-x: 0;--bs-dropdown-padding-y: .5rem;--bs-dropdown-spacer: .125rem;--bs-dropdown-font-size: 1rem;--bs-dropdown-color: var(--bs-body-color);--bs-dropdown-bg: var(--bs-body-bg);--bs-dropdown-border-color: var(--bs-border-color-translucent);--bs-dropdown-border-radius: var(--bs-border-radius);--bs-dropdown-border-width: var(--bs-border-width);--bs-dropdown-inner-border-radius: calc(var(--bs-border-radius) - var(--bs-border-width));--bs-dropdown-divider-bg: var(--bs-border-color-translucent);--bs-dropdown-divider-margin-y: .5rem;--bs-dropdown-box-shadow: var(--bs-box-shadow);--bs-dropdown-link-color: var(--bs-body-color);--bs-dropdown-link-hover-color: var(--bs-body-color);--bs-dropdown-link-hover-bg: var(--bs-tertiary-bg);--bs-dropdown-link-active-color: #fff;--bs-dropdown-link-active-bg: #0d6efd;--bs-dropdown-link-disabled-color: var(--bs-tertiary-color);--bs-dropdown-item-padding-x: 1rem;--bs-dropdown-item-padding-y: .25rem;--bs-dropdown-header-color: #6c757d;--bs-dropdown-header-padding-x: 1rem;--bs-dropdown-header-padding-y: .5rem;position:absolute;z-index:var(--bs-dropdown-zindex);display:none;min-width:var(--bs-dropdown-min-width);padding:var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);margin:0;font-size:var(--bs-dropdown-font-size);color:var(--bs-dropdown-color);text-align:left;list-style:none;background-color:var(--bs-dropdown-bg);background-clip:padding-box;border:var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);border-radius:var(--bs-dropdown-border-radius)}:host ::ng-deep .dropdown-menu[data-bs-popper]{top:100%;left:0;margin-top:var(--bs-dropdown-spacer)}:host ::ng-deep .dropdown-menu-start{--bs-position: start}:host ::ng-deep .dropdown-menu-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-end{--bs-position: end}:host ::ng-deep .dropdown-menu-end[data-bs-popper]{right:0;left:auto}@media(min-width:576px){:host ::ng-deep .dropdown-menu-sm-start{--bs-position: start}:host ::ng-deep .dropdown-menu-sm-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-sm-end{--bs-position: end}:host ::ng-deep .dropdown-menu-sm-end[data-bs-popper]{right:0;left:auto}}@media(min-width:768px){:host ::ng-deep .dropdown-menu-md-start{--bs-position: start}:host ::ng-deep .dropdown-menu-md-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-md-end{--bs-position: end}:host ::ng-deep .dropdown-menu-md-end[data-bs-popper]{right:0;left:auto}}@media(min-width:992px){:host ::ng-deep .dropdown-menu-lg-start{--bs-position: start}:host ::ng-deep .dropdown-menu-lg-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-lg-end{--bs-position: end}:host ::ng-deep .dropdown-menu-lg-end[data-bs-popper]{right:0;left:auto}}@media(min-width:1200px){:host ::ng-deep .dropdown-menu-xl-start{--bs-position: start}:host ::ng-deep .dropdown-menu-xl-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-xl-end{--bs-position: end}:host ::ng-deep .dropdown-menu-xl-end[data-bs-popper]{right:0;left:auto}}@media(min-width:1400px){:host ::ng-deep .dropdown-menu-xxl-start{--bs-position: start}:host ::ng-deep .dropdown-menu-xxl-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-xxl-end{--bs-position: end}:host ::ng-deep .dropdown-menu-xxl-end[data-bs-popper]{right:0;left:auto}}:host ::ng-deep .dropup .dropdown-menu[data-bs-popper]{top:auto;bottom:100%;margin-top:0;margin-bottom:var(--bs-dropdown-spacer)}:host ::ng-deep .dropup .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:0;border-right:.3em solid transparent;border-bottom:.3em solid;border-left:.3em solid transparent}:host ::ng-deep .dropup .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropend .dropdown-menu[data-bs-popper]{top:0;right:auto;left:100%;margin-top:0;margin-left:var(--bs-dropdown-spacer)}:host ::ng-deep .dropend .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid transparent;border-right:0;border-bottom:.3em solid transparent;border-left:.3em solid}:host ::ng-deep .dropend .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropend .dropdown-toggle:after{vertical-align:0}:host ::ng-deep .dropstart .dropdown-menu[data-bs-popper]{top:0;right:100%;left:auto;margin-top:0;margin-right:var(--bs-dropdown-spacer)}:host ::ng-deep .dropstart .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\"}:host ::ng-deep .dropstart .dropdown-toggle:after{display:none}:host ::ng-deep .dropstart .dropdown-toggle:before{display:inline-block;margin-right:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid transparent;border-right:.3em solid;border-bottom:.3em solid transparent}:host ::ng-deep .dropstart .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropstart .dropdown-toggle:before{vertical-align:0}:host ::ng-deep .dropdown-divider{height:0;margin:var(--bs-dropdown-divider-margin-y) 0;overflow:hidden;border-top:1px solid var(--bs-dropdown-divider-bg);opacity:1}:host ::ng-deep .dropdown-item{display:block;width:100%;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);clear:both;font-weight:400;color:var(--bs-dropdown-link-color);text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0;border-radius:var(--bs-dropdown-item-border-radius, 0)}:host ::ng-deep .dropdown-item:hover,:host ::ng-deep .dropdown-item:focus{color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}:host ::ng-deep .dropdown-item.active,:host ::ng-deep .dropdown-item:active{color:var(--bs-dropdown-link-active-color);text-decoration:none;background-color:var(--bs-dropdown-link-active-bg)}:host ::ng-deep .dropdown-item.disabled,:host ::ng-deep .dropdown-item:disabled{color:var(--bs-dropdown-link-disabled-color);pointer-events:none;background-color:transparent}:host ::ng-deep .dropdown-menu.show{display:block}:host ::ng-deep .dropdown-header{display:block;padding:var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);margin-bottom:0;font-size:.875rem;color:var(--bs-dropdown-header-color);white-space:nowrap}:host ::ng-deep .dropdown-item-text{display:block;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);color:var(--bs-dropdown-link-color)}:host ::ng-deep .dropdown-menu-dark{--bs-dropdown-color: #dee2e6;--bs-dropdown-bg: #343a40;--bs-dropdown-border-color: var(--bs-border-color-translucent);--bs-dropdown-box-shadow: ;--bs-dropdown-link-color: #dee2e6;--bs-dropdown-link-hover-color: #fff;--bs-dropdown-divider-bg: var(--bs-border-color-translucent);--bs-dropdown-link-hover-bg: rgba(255, 255, 255, .15);--bs-dropdown-link-active-color: #fff;--bs-dropdown-link-active-bg: #0d6efd;--bs-dropdown-link-disabled-color: #adb5bd;--bs-dropdown-header-color: #adb5bd}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.11", type: BsDropdownMenuComponent, isStandalone: true, selector: "bs-dropdown-menu", inputs: { maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onResize()", "keydown": "onKeydown($event)" }, properties: { "style.width": "dropdownWith()", "attr.role": "menuRole()", "attr.id": "menuId()" } }, queries: [{ propertyName: "dropdownItems", predicate: BsDropdownItemComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ul role=\"presentation\" class=\"dropdown-menu position-static w-100 overflow-auto show\" [style.max-height.px]=\"maxHeight()\">\n    <ng-content></ng-content>\n</ul>\n", styles: [":host ::ng-deep .dropup,:host ::ng-deep .dropend,:host ::ng-deep .dropdown,:host ::ng-deep .dropstart,:host ::ng-deep .dropup-center,:host ::ng-deep .dropdown-center{position:relative}:host ::ng-deep .dropdown-toggle{white-space:nowrap}:host ::ng-deep .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid;border-right:.3em solid transparent;border-bottom:0;border-left:.3em solid transparent}:host ::ng-deep .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropdown-menu{--bs-dropdown-zindex: 1000;--bs-dropdown-min-width: 10rem;--bs-dropdown-padding-x: 0;--bs-dropdown-padding-y: .5rem;--bs-dropdown-spacer: .125rem;--bs-dropdown-font-size: 1rem;--bs-dropdown-color: var(--bs-body-color);--bs-dropdown-bg: var(--bs-body-bg);--bs-dropdown-border-color: var(--bs-border-color-translucent);--bs-dropdown-border-radius: var(--bs-border-radius);--bs-dropdown-border-width: var(--bs-border-width);--bs-dropdown-inner-border-radius: calc(var(--bs-border-radius) - var(--bs-border-width));--bs-dropdown-divider-bg: var(--bs-border-color-translucent);--bs-dropdown-divider-margin-y: .5rem;--bs-dropdown-box-shadow: var(--bs-box-shadow);--bs-dropdown-link-color: var(--bs-body-color);--bs-dropdown-link-hover-color: var(--bs-body-color);--bs-dropdown-link-hover-bg: var(--bs-tertiary-bg);--bs-dropdown-link-active-color: #fff;--bs-dropdown-link-active-bg: #0d6efd;--bs-dropdown-link-disabled-color: var(--bs-tertiary-color);--bs-dropdown-item-padding-x: 1rem;--bs-dropdown-item-padding-y: .25rem;--bs-dropdown-header-color: #6c757d;--bs-dropdown-header-padding-x: 1rem;--bs-dropdown-header-padding-y: .5rem;position:absolute;z-index:var(--bs-dropdown-zindex);display:none;min-width:var(--bs-dropdown-min-width);padding:var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);margin:0;font-size:var(--bs-dropdown-font-size);color:var(--bs-dropdown-color);text-align:left;list-style:none;background-color:var(--bs-dropdown-bg);background-clip:padding-box;border:var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);border-radius:var(--bs-dropdown-border-radius)}:host ::ng-deep .dropdown-menu[data-bs-popper]{top:100%;left:0;margin-top:var(--bs-dropdown-spacer)}:host ::ng-deep .dropdown-menu-start{--bs-position: start}:host ::ng-deep .dropdown-menu-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-end{--bs-position: end}:host ::ng-deep .dropdown-menu-end[data-bs-popper]{right:0;left:auto}@media(min-width:576px){:host ::ng-deep .dropdown-menu-sm-start{--bs-position: start}:host ::ng-deep .dropdown-menu-sm-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-sm-end{--bs-position: end}:host ::ng-deep .dropdown-menu-sm-end[data-bs-popper]{right:0;left:auto}}@media(min-width:768px){:host ::ng-deep .dropdown-menu-md-start{--bs-position: start}:host ::ng-deep .dropdown-menu-md-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-md-end{--bs-position: end}:host ::ng-deep .dropdown-menu-md-end[data-bs-popper]{right:0;left:auto}}@media(min-width:992px){:host ::ng-deep .dropdown-menu-lg-start{--bs-position: start}:host ::ng-deep .dropdown-menu-lg-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-lg-end{--bs-position: end}:host ::ng-deep .dropdown-menu-lg-end[data-bs-popper]{right:0;left:auto}}@media(min-width:1200px){:host ::ng-deep .dropdown-menu-xl-start{--bs-position: start}:host ::ng-deep .dropdown-menu-xl-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-xl-end{--bs-position: end}:host ::ng-deep .dropdown-menu-xl-end[data-bs-popper]{right:0;left:auto}}@media(min-width:1400px){:host ::ng-deep .dropdown-menu-xxl-start{--bs-position: start}:host ::ng-deep .dropdown-menu-xxl-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-xxl-end{--bs-position: end}:host ::ng-deep .dropdown-menu-xxl-end[data-bs-popper]{right:0;left:auto}}:host ::ng-deep .dropup .dropdown-menu[data-bs-popper]{top:auto;bottom:100%;margin-top:0;margin-bottom:var(--bs-dropdown-spacer)}:host ::ng-deep .dropup .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:0;border-right:.3em solid transparent;border-bottom:.3em solid;border-left:.3em solid transparent}:host ::ng-deep .dropup .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropend .dropdown-menu[data-bs-popper]{top:0;right:auto;left:100%;margin-top:0;margin-left:var(--bs-dropdown-spacer)}:host ::ng-deep .dropend .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid transparent;border-right:0;border-bottom:.3em solid transparent;border-left:.3em solid}:host ::ng-deep .dropend .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropend .dropdown-toggle:after{vertical-align:0}:host ::ng-deep .dropstart .dropdown-menu[data-bs-popper]{top:0;right:100%;left:auto;margin-top:0;margin-right:var(--bs-dropdown-spacer)}:host ::ng-deep .dropstart .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\"}:host ::ng-deep .dropstart .dropdown-toggle:after{display:none}:host ::ng-deep .dropstart .dropdown-toggle:before{display:inline-block;margin-right:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid transparent;border-right:.3em solid;border-bottom:.3em solid transparent}:host ::ng-deep .dropstart .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropstart .dropdown-toggle:before{vertical-align:0}:host ::ng-deep .dropdown-divider{height:0;margin:var(--bs-dropdown-divider-margin-y) 0;overflow:hidden;border-top:1px solid var(--bs-dropdown-divider-bg);opacity:1}:host ::ng-deep .dropdown-item{display:block;width:100%;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);clear:both;font-weight:400;color:var(--bs-dropdown-link-color);text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0;border-radius:var(--bs-dropdown-item-border-radius, 0)}:host ::ng-deep .dropdown-item:hover,:host ::ng-deep .dropdown-item:focus{color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}:host ::ng-deep .dropdown-item.active,:host ::ng-deep .dropdown-item:active{color:var(--bs-dropdown-link-active-color);text-decoration:none;background-color:var(--bs-dropdown-link-active-bg)}:host ::ng-deep .dropdown-item.disabled,:host ::ng-deep .dropdown-item:disabled{color:var(--bs-dropdown-link-disabled-color);pointer-events:none;background-color:transparent}:host ::ng-deep .dropdown-menu.show{display:block}:host ::ng-deep .dropdown-header{display:block;padding:var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);margin-bottom:0;font-size:.875rem;color:var(--bs-dropdown-header-color);white-space:nowrap}:host ::ng-deep .dropdown-item-text{display:block;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);color:var(--bs-dropdown-link-color)}:host ::ng-deep .dropdown-menu-dark{--bs-dropdown-color: #dee2e6;--bs-dropdown-bg: #343a40;--bs-dropdown-border-color: var(--bs-border-color-translucent);--bs-dropdown-box-shadow: ;--bs-dropdown-link-color: #dee2e6;--bs-dropdown-link-hover-color: #fff;--bs-dropdown-divider-bg: var(--bs-border-color-translucent);--bs-dropdown-link-hover-bg: rgba(255, 255, 255, .15);--bs-dropdown-link-active-color: #fff;--bs-dropdown-link-active-bg: #0d6efd;--bs-dropdown-link-disabled-color: #adb5bd;--bs-dropdown-header-color: #adb5bd}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsDropdownMenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bs-dropdown-menu', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[style.width]': 'dropdownWith()',
                         '(window:resize)': 'onResize()',
-                    }, template: "<ul class=\"dropdown-menu position-static w-100 overflow-auto show\" [style.max-height.px]=\"maxHeight()\">\n    <ng-content></ng-content>\n    <!-- <ng-content select=\"bs-dropdown-item\"></ng-content> -->\n</ul>", styles: [":host ::ng-deep .dropup,:host ::ng-deep .dropend,:host ::ng-deep .dropdown,:host ::ng-deep .dropstart,:host ::ng-deep .dropup-center,:host ::ng-deep .dropdown-center{position:relative}:host ::ng-deep .dropdown-toggle{white-space:nowrap}:host ::ng-deep .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid;border-right:.3em solid transparent;border-bottom:0;border-left:.3em solid transparent}:host ::ng-deep .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropdown-menu{--bs-dropdown-zindex: 1000;--bs-dropdown-min-width: 10rem;--bs-dropdown-padding-x: 0;--bs-dropdown-padding-y: .5rem;--bs-dropdown-spacer: .125rem;--bs-dropdown-font-size: 1rem;--bs-dropdown-color: var(--bs-body-color);--bs-dropdown-bg: var(--bs-body-bg);--bs-dropdown-border-color: var(--bs-border-color-translucent);--bs-dropdown-border-radius: var(--bs-border-radius);--bs-dropdown-border-width: var(--bs-border-width);--bs-dropdown-inner-border-radius: calc(var(--bs-border-radius) - var(--bs-border-width));--bs-dropdown-divider-bg: var(--bs-border-color-translucent);--bs-dropdown-divider-margin-y: .5rem;--bs-dropdown-box-shadow: var(--bs-box-shadow);--bs-dropdown-link-color: var(--bs-body-color);--bs-dropdown-link-hover-color: var(--bs-body-color);--bs-dropdown-link-hover-bg: var(--bs-tertiary-bg);--bs-dropdown-link-active-color: #fff;--bs-dropdown-link-active-bg: #0d6efd;--bs-dropdown-link-disabled-color: var(--bs-tertiary-color);--bs-dropdown-item-padding-x: 1rem;--bs-dropdown-item-padding-y: .25rem;--bs-dropdown-header-color: #6c757d;--bs-dropdown-header-padding-x: 1rem;--bs-dropdown-header-padding-y: .5rem;position:absolute;z-index:var(--bs-dropdown-zindex);display:none;min-width:var(--bs-dropdown-min-width);padding:var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);margin:0;font-size:var(--bs-dropdown-font-size);color:var(--bs-dropdown-color);text-align:left;list-style:none;background-color:var(--bs-dropdown-bg);background-clip:padding-box;border:var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);border-radius:var(--bs-dropdown-border-radius)}:host ::ng-deep .dropdown-menu[data-bs-popper]{top:100%;left:0;margin-top:var(--bs-dropdown-spacer)}:host ::ng-deep .dropdown-menu-start{--bs-position: start}:host ::ng-deep .dropdown-menu-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-end{--bs-position: end}:host ::ng-deep .dropdown-menu-end[data-bs-popper]{right:0;left:auto}@media(min-width:576px){:host ::ng-deep .dropdown-menu-sm-start{--bs-position: start}:host ::ng-deep .dropdown-menu-sm-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-sm-end{--bs-position: end}:host ::ng-deep .dropdown-menu-sm-end[data-bs-popper]{right:0;left:auto}}@media(min-width:768px){:host ::ng-deep .dropdown-menu-md-start{--bs-position: start}:host ::ng-deep .dropdown-menu-md-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-md-end{--bs-position: end}:host ::ng-deep .dropdown-menu-md-end[data-bs-popper]{right:0;left:auto}}@media(min-width:992px){:host ::ng-deep .dropdown-menu-lg-start{--bs-position: start}:host ::ng-deep .dropdown-menu-lg-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-lg-end{--bs-position: end}:host ::ng-deep .dropdown-menu-lg-end[data-bs-popper]{right:0;left:auto}}@media(min-width:1200px){:host ::ng-deep .dropdown-menu-xl-start{--bs-position: start}:host ::ng-deep .dropdown-menu-xl-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-xl-end{--bs-position: end}:host ::ng-deep .dropdown-menu-xl-end[data-bs-popper]{right:0;left:auto}}@media(min-width:1400px){:host ::ng-deep .dropdown-menu-xxl-start{--bs-position: start}:host ::ng-deep .dropdown-menu-xxl-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-xxl-end{--bs-position: end}:host ::ng-deep .dropdown-menu-xxl-end[data-bs-popper]{right:0;left:auto}}:host ::ng-deep .dropup .dropdown-menu[data-bs-popper]{top:auto;bottom:100%;margin-top:0;margin-bottom:var(--bs-dropdown-spacer)}:host ::ng-deep .dropup .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:0;border-right:.3em solid transparent;border-bottom:.3em solid;border-left:.3em solid transparent}:host ::ng-deep .dropup .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropend .dropdown-menu[data-bs-popper]{top:0;right:auto;left:100%;margin-top:0;margin-left:var(--bs-dropdown-spacer)}:host ::ng-deep .dropend .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid transparent;border-right:0;border-bottom:.3em solid transparent;border-left:.3em solid}:host ::ng-deep .dropend .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropend .dropdown-toggle:after{vertical-align:0}:host ::ng-deep .dropstart .dropdown-menu[data-bs-popper]{top:0;right:100%;left:auto;margin-top:0;margin-right:var(--bs-dropdown-spacer)}:host ::ng-deep .dropstart .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\"}:host ::ng-deep .dropstart .dropdown-toggle:after{display:none}:host ::ng-deep .dropstart .dropdown-toggle:before{display:inline-block;margin-right:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid transparent;border-right:.3em solid;border-bottom:.3em solid transparent}:host ::ng-deep .dropstart .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropstart .dropdown-toggle:before{vertical-align:0}:host ::ng-deep .dropdown-divider{height:0;margin:var(--bs-dropdown-divider-margin-y) 0;overflow:hidden;border-top:1px solid var(--bs-dropdown-divider-bg);opacity:1}:host ::ng-deep .dropdown-item{display:block;width:100%;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);clear:both;font-weight:400;color:var(--bs-dropdown-link-color);text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0;border-radius:var(--bs-dropdown-item-border-radius, 0)}:host ::ng-deep .dropdown-item:hover,:host ::ng-deep .dropdown-item:focus{color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}:host ::ng-deep .dropdown-item.active,:host ::ng-deep .dropdown-item:active{color:var(--bs-dropdown-link-active-color);text-decoration:none;background-color:var(--bs-dropdown-link-active-bg)}:host ::ng-deep .dropdown-item.disabled,:host ::ng-deep .dropdown-item:disabled{color:var(--bs-dropdown-link-disabled-color);pointer-events:none;background-color:transparent}:host ::ng-deep .dropdown-menu.show{display:block}:host ::ng-deep .dropdown-header{display:block;padding:var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);margin-bottom:0;font-size:.875rem;color:var(--bs-dropdown-header-color);white-space:nowrap}:host ::ng-deep .dropdown-item-text{display:block;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);color:var(--bs-dropdown-link-color)}:host ::ng-deep .dropdown-menu-dark{--bs-dropdown-color: #dee2e6;--bs-dropdown-bg: #343a40;--bs-dropdown-border-color: var(--bs-border-color-translucent);--bs-dropdown-box-shadow: ;--bs-dropdown-link-color: #dee2e6;--bs-dropdown-link-hover-color: #fff;--bs-dropdown-divider-bg: var(--bs-border-color-translucent);--bs-dropdown-link-hover-bg: rgba(255, 255, 255, .15);--bs-dropdown-link-active-color: #fff;--bs-dropdown-link-active-bg: #0d6efd;--bs-dropdown-link-disabled-color: #adb5bd;--bs-dropdown-header-color: #adb5bd}\n"] }]
-        }], propDecorators: { maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }] } });
-
-class BsDropdownItemComponent {
-    constructor() {
-        this.isSelected = input(false, ...(ngDevMode ? [{ debugName: "isSelected" }] : /* istanbul ignore next */ []));
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsDropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.11", type: BsDropdownItemComponent, isStandalone: true, selector: "bs-dropdown-item", inputs: { isSelected: { classPropertyName: "isSelected", publicName: "isSelected", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<li class=\"dropdown-item cursor-pointer\" [class.active]=\"isSelected()\" [class.disabled]=\"disabled()\">\n    <ng-content></ng-content>\n</li>", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsDropdownItemComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bs-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li class=\"dropdown-item cursor-pointer\" [class.active]=\"isSelected()\" [class.disabled]=\"disabled()\">\n    <ng-content></ng-content>\n</li>" }]
-        }], propDecorators: { isSelected: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSelected", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
+                        '[attr.role]': 'menuRole()',
+                        '[attr.id]': 'menuId()',
+                        '(keydown)': 'onKeydown($event)',
+                    }, template: "<ul role=\"presentation\" class=\"dropdown-menu position-static w-100 overflow-auto show\" [style.max-height.px]=\"maxHeight()\">\n    <ng-content></ng-content>\n</ul>\n", styles: [":host ::ng-deep .dropup,:host ::ng-deep .dropend,:host ::ng-deep .dropdown,:host ::ng-deep .dropstart,:host ::ng-deep .dropup-center,:host ::ng-deep .dropdown-center{position:relative}:host ::ng-deep .dropdown-toggle{white-space:nowrap}:host ::ng-deep .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid;border-right:.3em solid transparent;border-bottom:0;border-left:.3em solid transparent}:host ::ng-deep .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropdown-menu{--bs-dropdown-zindex: 1000;--bs-dropdown-min-width: 10rem;--bs-dropdown-padding-x: 0;--bs-dropdown-padding-y: .5rem;--bs-dropdown-spacer: .125rem;--bs-dropdown-font-size: 1rem;--bs-dropdown-color: var(--bs-body-color);--bs-dropdown-bg: var(--bs-body-bg);--bs-dropdown-border-color: var(--bs-border-color-translucent);--bs-dropdown-border-radius: var(--bs-border-radius);--bs-dropdown-border-width: var(--bs-border-width);--bs-dropdown-inner-border-radius: calc(var(--bs-border-radius) - var(--bs-border-width));--bs-dropdown-divider-bg: var(--bs-border-color-translucent);--bs-dropdown-divider-margin-y: .5rem;--bs-dropdown-box-shadow: var(--bs-box-shadow);--bs-dropdown-link-color: var(--bs-body-color);--bs-dropdown-link-hover-color: var(--bs-body-color);--bs-dropdown-link-hover-bg: var(--bs-tertiary-bg);--bs-dropdown-link-active-color: #fff;--bs-dropdown-link-active-bg: #0d6efd;--bs-dropdown-link-disabled-color: var(--bs-tertiary-color);--bs-dropdown-item-padding-x: 1rem;--bs-dropdown-item-padding-y: .25rem;--bs-dropdown-header-color: #6c757d;--bs-dropdown-header-padding-x: 1rem;--bs-dropdown-header-padding-y: .5rem;position:absolute;z-index:var(--bs-dropdown-zindex);display:none;min-width:var(--bs-dropdown-min-width);padding:var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);margin:0;font-size:var(--bs-dropdown-font-size);color:var(--bs-dropdown-color);text-align:left;list-style:none;background-color:var(--bs-dropdown-bg);background-clip:padding-box;border:var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);border-radius:var(--bs-dropdown-border-radius)}:host ::ng-deep .dropdown-menu[data-bs-popper]{top:100%;left:0;margin-top:var(--bs-dropdown-spacer)}:host ::ng-deep .dropdown-menu-start{--bs-position: start}:host ::ng-deep .dropdown-menu-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-end{--bs-position: end}:host ::ng-deep .dropdown-menu-end[data-bs-popper]{right:0;left:auto}@media(min-width:576px){:host ::ng-deep .dropdown-menu-sm-start{--bs-position: start}:host ::ng-deep .dropdown-menu-sm-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-sm-end{--bs-position: end}:host ::ng-deep .dropdown-menu-sm-end[data-bs-popper]{right:0;left:auto}}@media(min-width:768px){:host ::ng-deep .dropdown-menu-md-start{--bs-position: start}:host ::ng-deep .dropdown-menu-md-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-md-end{--bs-position: end}:host ::ng-deep .dropdown-menu-md-end[data-bs-popper]{right:0;left:auto}}@media(min-width:992px){:host ::ng-deep .dropdown-menu-lg-start{--bs-position: start}:host ::ng-deep .dropdown-menu-lg-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-lg-end{--bs-position: end}:host ::ng-deep .dropdown-menu-lg-end[data-bs-popper]{right:0;left:auto}}@media(min-width:1200px){:host ::ng-deep .dropdown-menu-xl-start{--bs-position: start}:host ::ng-deep .dropdown-menu-xl-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-xl-end{--bs-position: end}:host ::ng-deep .dropdown-menu-xl-end[data-bs-popper]{right:0;left:auto}}@media(min-width:1400px){:host ::ng-deep .dropdown-menu-xxl-start{--bs-position: start}:host ::ng-deep .dropdown-menu-xxl-start[data-bs-popper]{right:auto;left:0}:host ::ng-deep .dropdown-menu-xxl-end{--bs-position: end}:host ::ng-deep .dropdown-menu-xxl-end[data-bs-popper]{right:0;left:auto}}:host ::ng-deep .dropup .dropdown-menu[data-bs-popper]{top:auto;bottom:100%;margin-top:0;margin-bottom:var(--bs-dropdown-spacer)}:host ::ng-deep .dropup .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:0;border-right:.3em solid transparent;border-bottom:.3em solid;border-left:.3em solid transparent}:host ::ng-deep .dropup .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropend .dropdown-menu[data-bs-popper]{top:0;right:auto;left:100%;margin-top:0;margin-left:var(--bs-dropdown-spacer)}:host ::ng-deep .dropend .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid transparent;border-right:0;border-bottom:.3em solid transparent;border-left:.3em solid}:host ::ng-deep .dropend .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropend .dropdown-toggle:after{vertical-align:0}:host ::ng-deep .dropstart .dropdown-menu[data-bs-popper]{top:0;right:100%;left:auto;margin-top:0;margin-right:var(--bs-dropdown-spacer)}:host ::ng-deep .dropstart .dropdown-toggle:after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:\"\"}:host ::ng-deep .dropstart .dropdown-toggle:after{display:none}:host ::ng-deep .dropstart .dropdown-toggle:before{display:inline-block;margin-right:.255em;vertical-align:.255em;content:\"\";border-top:.3em solid transparent;border-right:.3em solid;border-bottom:.3em solid transparent}:host ::ng-deep .dropstart .dropdown-toggle:empty:after{margin-left:0}:host ::ng-deep .dropstart .dropdown-toggle:before{vertical-align:0}:host ::ng-deep .dropdown-divider{height:0;margin:var(--bs-dropdown-divider-margin-y) 0;overflow:hidden;border-top:1px solid var(--bs-dropdown-divider-bg);opacity:1}:host ::ng-deep .dropdown-item{display:block;width:100%;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);clear:both;font-weight:400;color:var(--bs-dropdown-link-color);text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0;border-radius:var(--bs-dropdown-item-border-radius, 0)}:host ::ng-deep .dropdown-item:hover,:host ::ng-deep .dropdown-item:focus{color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}:host ::ng-deep .dropdown-item.active,:host ::ng-deep .dropdown-item:active{color:var(--bs-dropdown-link-active-color);text-decoration:none;background-color:var(--bs-dropdown-link-active-bg)}:host ::ng-deep .dropdown-item.disabled,:host ::ng-deep .dropdown-item:disabled{color:var(--bs-dropdown-link-disabled-color);pointer-events:none;background-color:transparent}:host ::ng-deep .dropdown-menu.show{display:block}:host ::ng-deep .dropdown-header{display:block;padding:var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);margin-bottom:0;font-size:.875rem;color:var(--bs-dropdown-header-color);white-space:nowrap}:host ::ng-deep .dropdown-item-text{display:block;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);color:var(--bs-dropdown-link-color)}:host ::ng-deep .dropdown-menu-dark{--bs-dropdown-color: #dee2e6;--bs-dropdown-bg: #343a40;--bs-dropdown-border-color: var(--bs-border-color-translucent);--bs-dropdown-box-shadow: ;--bs-dropdown-link-color: #dee2e6;--bs-dropdown-link-hover-color: #fff;--bs-dropdown-divider-bg: var(--bs-border-color-translucent);--bs-dropdown-link-hover-bg: rgba(255, 255, 255, .15);--bs-dropdown-link-active-color: #fff;--bs-dropdown-link-active-bg: #0d6efd;--bs-dropdown-link-disabled-color: #adb5bd;--bs-dropdown-header-color: #adb5bd}\n"] }]
+        }], propDecorators: { maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], dropdownItems: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => BsDropdownItemComponent), { ...{ descendants: true }, isSignal: true }] }] } });
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/mintplayer-ng-bootstrap-dropdown-menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"mintplayer-ng-bootstrap-dropdown-menu.mjs","sources":["../../../../libs/mintplayer-ng-bootstrap/dropdown-menu/src/dropdown-menu/dropdown-menu.component.ts","../../../../libs/mintplayer-ng-bootstrap/dropdown-menu/src/dropdown-menu/dropdown-menu.component.html","../../../../libs/mintplayer-ng-bootstrap/dropdown-menu/src/dropdown-item/dropdown-item.component.ts","../../../../libs/mintplayer-ng-bootstrap/dropdown-menu/src/dropdown-item/dropdown-item.component.html","../../../../libs/mintplayer-ng-bootstrap/dropdown-menu/mintplayer-ng-bootstrap-dropdown-menu.ts"],"sourcesContent":["import { AfterViewInit, Component, inject, input, signal, ChangeDetectionStrategy} from '@angular/core';\nimport { BsDropdownDirective } from '@mintplayer/ng-bootstrap/dropdown';\n// import { BsDropdownComponent } from '@mintplayer/ng-bootstrap/dropdown';\n\n@Component({\n  selector: 'bs-dropdown-menu',\n  templateUrl: './dropdown-menu.component.html',\n  styleUrls: ['./dropdown-menu.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[style.width]': 'dropdownWith()',\n    '(window:resize)': 'onResize()',\n  },\n})\nexport class BsDropdownMenuComponent implements AfterViewInit {\n  private bsDropdown = inject(BsDropdownDirective, { optional: true });\n\n  readonly maxHeight = input<number | null>(null);\n  dropdownWith = signal<string | null>(null);\n\n  onResize() {\n    if ((typeof window !== 'undefined') && this.bsDropdown && this.bsDropdown.sameDropdownWidth()) {\n      const element = this.bsDropdown.elementRef.nativeElement;\n      this.dropdownWith.set(window.getComputedStyle(element).width);\n    }\n  }\n\n  ngAfterViewInit() {\n    this.onResize();\n  }\n}\n","<ul class=\"dropdown-menu position-static w-100 overflow-auto show\" [style.max-height.px]=\"maxHeight()\">\n    <ng-content></ng-content>\n    <!-- <ng-content select=\"bs-dropdown-item\"></ng-content> -->\n</ul>","import { Component, input, ChangeDetectionStrategy} from '@angular/core';\n\n@Component({\n  selector: 'bs-dropdown-item',\n  templateUrl: './dropdown-item.component.html',\n  styleUrls: ['./dropdown-item.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class BsDropdownItemComponent {\n  readonly isSelected = input(false);\n  readonly disabled = input(false);\n}\n","<li class=\"dropdown-item cursor-pointer\" [class.active]=\"isSelected()\" [class.disabled]=\"disabled()\">\n    <ng-content></ng-content>\n</li>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAEA;MAYa,uBAAuB,CAAA;AAVpC,IAAA,WAAA,GAAA;QAWU,IAAA,CAAA,UAAU,GAAG,MAAM,CAAC,mBAAmB,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;AAE3D,QAAA,IAAA,CAAA,SAAS,GAAG,KAAK,CAAgB,IAAI,gFAAC;AAC/C,QAAA,IAAA,CAAA,YAAY,GAAG,MAAM,CAAgB,IAAI,mFAAC;AAY3C,IAAA;IAVC,QAAQ,GAAA;AACN,QAAA,IAAI,CAAC,OAAO,MAAM,KAAK,WAAW,KAAK,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,iBAAiB,EAAE,EAAE;YAC7F,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,aAAa;AACxD,YAAA,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,MAAM,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC;QAC/D;IACF;IAEA,eAAe,GAAA;QACb,IAAI,CAAC,QAAQ,EAAE;IACjB;+GAfW,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAvB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,uBAAuB,qUCdpC,uNAGK,EAAA,MAAA,EAAA,CAAA,y4OAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FDWQ,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAVnC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,kBAAkB,EAAA,eAAA,EAGX,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,eAAe,EAAE,gBAAgB;AACjC,wBAAA,iBAAiB,EAAE,YAAY;AAChC,qBAAA,EAAA,QAAA,EAAA,uNAAA,EAAA,MAAA,EAAA,CAAA,y4OAAA,CAAA,EAAA;;;MEJU,uBAAuB,CAAA;AANpC,IAAA,WAAA,GAAA;AAOW,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK,CAAC,KAAK,iFAAC;AACzB,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAC,KAAK,+EAAC;AACjC,IAAA;+GAHY,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAvB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,uBAAuB,gWCRpC,mJAEK,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FDMQ,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBANnC,SAAS;+BACE,kBAAkB,EAAA,eAAA,EAGX,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,mJAAA,EAAA;;;AENjD;;AAEG;;;;"}
+{"version":3,"file":"mintplayer-ng-bootstrap-dropdown-menu.mjs","sources":["../../../../libs/mintplayer-ng-bootstrap/dropdown-menu/src/dropdown-item/dropdown-item.component.ts","../../../../libs/mintplayer-ng-bootstrap/dropdown-menu/src/dropdown-item/dropdown-item.component.html","../../../../libs/mintplayer-ng-bootstrap/dropdown-menu/src/dropdown-menu/dropdown-menu.component.ts","../../../../libs/mintplayer-ng-bootstrap/dropdown-menu/src/dropdown-menu/dropdown-menu.component.html","../../../../libs/mintplayer-ng-bootstrap/dropdown-menu/mintplayer-ng-bootstrap-dropdown-menu.ts"],"sourcesContent":["import { afterNextRender, Component, computed, ElementRef, inject, input, ChangeDetectionStrategy } from '@angular/core';\nimport { BsDropdownDirective } from '@mintplayer/ng-bootstrap/dropdown';\nimport { BsIdService } from '@mintplayer/ng-bootstrap/a11y';\nimport { BsDropdownMenuComponent } from '../dropdown-menu/dropdown-menu.component';\n\n@Component({\n  selector: 'bs-dropdown-item',\n  templateUrl: './dropdown-item.component.html',\n  styleUrls: ['./dropdown-item.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[attr.role]': 'itemRole()',\n    '[attr.aria-selected]': 'ariaSelected()',\n    '[attr.aria-disabled]': 'disabled() ? \"true\" : null',\n    '[attr.tabindex]': 'tabindex()',\n    '(focus)': 'onFocus()',\n    '(keydown.enter)': 'onActivate($event)',\n    '(keydown.space)': 'onActivate($event)',\n  },\n})\nexport class BsDropdownItemComponent {\n  private parent = inject(BsDropdownDirective, { optional: true });\n  private menu = inject(BsDropdownMenuComponent, { optional: true });\n  /** Public so BsDropdownMenuComponent can imperatively focus this item during keyboard nav. */\n  readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n  private ids = inject(BsIdService);\n\n  readonly isSelected = input(false);\n  readonly disabled = input(false);\n\n  readonly itemRole = computed(() =>\n    this.parent?.popupRole() === 'listbox' ? 'option' : 'menuitem');\n\n  readonly ariaSelected = computed(() => {\n    if (this.parent?.popupRole() !== 'listbox') return null;\n    return this.isSelected() ? 'true' : 'false';\n  });\n\n  /**\n   * Roving tabindex in menu mode: the focused item is 0, others -1.\n   * In listbox mode (typeahead/select2/etc.), the consumer applies bsRovingFocusItem\n   * externally for activedescendant management; this binding stays null so it\n   * doesn't fight that directive.\n   */\n  readonly tabindex = computed<number | null>(() => {\n    if (!this.menu?.isMenuMode()) return null;\n    if (this.disabled()) return -1;\n    return this.menu.isItemFocused(this) ? 0 : -1;\n  });\n\n  /**\n   * Resolved after first render so static `id=\"…\"` attributes set by the consumer\n   * and any sibling host bindings have applied first. Read-only access for any\n   * other directive on the same element (e.g. BsRovingFocusItem) that needs a\n   * stable target id for aria-activedescendant.\n   */\n  get itemId(): string {\n    return this.elementRef.nativeElement.id;\n  }\n\n  constructor() {\n    afterNextRender(() => {\n      if (!this.elementRef.nativeElement.id) {\n        this.elementRef.nativeElement.id = this.ids.next('bs-dropdown-item');\n      }\n    });\n  }\n\n  onFocus() {\n    this.menu?.setFocusedItem(this);\n  }\n\n  onActivate(event: Event) {\n    if (this.disabled()) return;\n    event.preventDefault();\n    this.elementRef.nativeElement.click();\n  }\n}\n","<li role=\"presentation\" class=\"dropdown-item cursor-pointer\" [class.active]=\"isSelected()\" [class.disabled]=\"disabled()\">\n    <ng-content></ng-content>\n</li>\n","import { AfterViewInit, Component, computed, contentChildren, ElementRef, inject, input, signal, ChangeDetectionStrategy } from '@angular/core';\nimport { BsDropdownDirective } from '@mintplayer/ng-bootstrap/dropdown';\nimport { BsDropdownItemComponent } from '../dropdown-item/dropdown-item.component';\n\n@Component({\n  selector: 'bs-dropdown-menu',\n  templateUrl: './dropdown-menu.component.html',\n  styleUrls: ['./dropdown-menu.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[style.width]': 'dropdownWith()',\n    '(window:resize)': 'onResize()',\n    '[attr.role]': 'menuRole()',\n    '[attr.id]': 'menuId()',\n    '(keydown)': 'onKeydown($event)',\n  },\n})\nexport class BsDropdownMenuComponent implements AfterViewInit {\n  private bsDropdown = inject(BsDropdownDirective, { optional: true });\n\n  readonly maxHeight = input<number | null>(null);\n  dropdownWith = signal<string | null>(null);\n\n  readonly menuRole = computed(() => this.bsDropdown?.popupRole() ?? null);\n  readonly menuId = computed(() => this.bsDropdown?.menuId() || null);\n\n  /**\n   * Items projected into this menu. Used in menu mode (popupRole='menu') to\n   * implement roving-tabindex keyboard navigation. In listbox mode, callers\n   * (typeahead/select2/etc.) typically apply their own bsRovingFocus directly,\n   * so this menu's keyboard handler is a no-op.\n   */\n  readonly dropdownItems = contentChildren(BsDropdownItemComponent, { descendants: true });\n\n  /** True when this is a plain menu (default), false when used as a combobox listbox. */\n  readonly isMenuMode = computed(() => this.bsDropdown?.popupRole() !== 'listbox');\n\n  /** Index into dropdownItems() of the item that currently holds the roving tabindex (menu mode). */\n  readonly focusedIndex = signal<number>(0);\n\n  isItemFocused(item: BsDropdownItemComponent): boolean {\n    if (!this.isMenuMode()) return false;\n    return this.dropdownItems()[this.focusedIndex()] === item;\n  }\n\n  setFocusedItem(item: BsDropdownItemComponent) {\n    if (!this.isMenuMode()) return;\n    const idx = this.dropdownItems().indexOf(item);\n    if (idx >= 0) this.focusedIndex.set(idx);\n  }\n\n  onResize() {\n    if ((typeof window !== 'undefined') && this.bsDropdown && this.bsDropdown.sameDropdownWidth()) {\n      const element = this.bsDropdown.elementRef.nativeElement;\n      this.dropdownWith.set(window.getComputedStyle(element).width);\n    }\n  }\n\n  ngAfterViewInit() {\n    this.onResize();\n  }\n\n  onKeydown(event: KeyboardEvent) {\n    if (!this.isMenuMode()) return;\n    const items = this.dropdownItems();\n    if (items.length === 0) return;\n\n    let handled = false;\n    switch (event.key) {\n      case 'ArrowDown':\n        this.moveFocus(+1);\n        handled = true;\n        break;\n      case 'ArrowUp':\n        this.moveFocus(-1);\n        handled = true;\n        break;\n      case 'Home':\n        this.moveTo(this.firstEnabledIndex());\n        handled = true;\n        break;\n      case 'End':\n        this.moveTo(this.lastEnabledIndex());\n        handled = true;\n        break;\n    }\n    if (handled) event.preventDefault();\n  }\n\n  private moveFocus(delta: 1 | -1): void {\n    const items = this.dropdownItems();\n    const total = items.length;\n    if (total === 0) return;\n    let cursor = this.focusedIndex();\n    for (let i = 0; i < total; i++) {\n      cursor = (cursor + delta + total) % total;\n      if (!items[cursor].disabled()) {\n        this.moveTo(cursor);\n        return;\n      }\n    }\n  }\n\n  private firstEnabledIndex(): number {\n    return this.dropdownItems().findIndex(it => !it.disabled());\n  }\n\n  private lastEnabledIndex(): number {\n    const items = this.dropdownItems();\n    for (let i = items.length - 1; i >= 0; i--) {\n      if (!items[i].disabled()) return i;\n    }\n    return -1;\n  }\n\n  private moveTo(index: number): void {\n    if (index < 0) return;\n    this.focusedIndex.set(index);\n    const target = this.dropdownItems()[index];\n    if (target) {\n      target.elementRef.nativeElement.focus();\n    }\n  }\n}\n","<ul role=\"presentation\" class=\"dropdown-menu position-static w-100 overflow-auto show\" [style.max-height.px]=\"maxHeight()\">\n    <ng-content></ng-content>\n</ul>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/mintplayer-ng-bootstrap-dropdown.mjs

@@ -1,6 +1,7 @@
 import * as i0 from '@angular/core';
-import { inject, forwardRef, ViewContainerRef, TemplateRef, DestroyRef, effect, Directive, ElementRef, contentChild, input, model } from '@angular/core';
+import { inject, forwardRef, ViewContainerRef, TemplateRef, DestroyRef, effect, Directive, ElementRef, contentChild, input, model, signal, afterNextRender, computed, output } from '@angular/core';
 import { BS_DEVELOPMENT } from '@mintplayer/ng-bootstrap';
+import { BsOverlayStackService, BsIdService, BsRovingFocusDirective } from '@mintplayer/ng-bootstrap/a11y';
 import { TemplatePortal } from '@angular/cdk/portal';
 import { Overlay } from '@angular/cdk/overlay';
 import { ClickOutsideDirective } from '@mintplayer/ng-click-outside';
@@ -14,11 +15,20 @@ class BsDropdownMenuDirective extends ClickOutsideDirective {
         this.overlay = inject(Overlay);
         this.destroy = inject(DestroyRef);
         this.bsDevelopment = inject(BS_DEVELOPMENT, { optional: true });
+        this.overlayStack = inject(BsOverlayStackService);
         this.wait = false;
         this.overlayRef = null;
         this.templatePortal = null;
+        this.stackToken = null;
         effect(() => {
             const isOpen = this.dropdown.isOpen();
+            if (isOpen && this.stackToken === null) {
+                this.stackToken = this.overlayStack.push();
+            }
+            else if (!isOpen && this.stackToken !== null) {
+                this.overlayStack.release(this.stackToken);
+                this.stackToken = null;
+            }
             if (isOpen) {
                 // Prevent creating duplicate overlays if effect re-runs while still open
                 if (this.overlayRef) {
@@ -71,7 +81,9 @@ class BsDropdownMenuDirective extends ClickOutsideDirective {
         }
     }
     onEscape(event) {
-        this.doClose();
+        if (this.stackToken !== null && this.overlayStack.isTop(this.stackToken)) {
+            this.doClose();
+        }
     }
     doClose() {
         const isOpen = this.dropdown.isOpen();
@@ -102,15 +114,16 @@ class BsDropdownToggleDirective {
         this.dropdown.isOpen.set(!this.dropdown.isOpen());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsDropdownToggleDirective, deps: [{ token: BsDropdownDirective }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.11", type: BsDropdownToggleDirective, isStandalone: true, selector: "[bsDropdownToggle]", host: { listeners: { "click": "onClick()" }, properties: { "attr.aria-haspopup": "\"true\"", "attr.aria-expanded": "dropdown.isOpen()" } }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.11", type: BsDropdownToggleDirective, isStandalone: true, selector: "[bsDropdownToggle]", host: { listeners: { "click": "onClick()" }, properties: { "attr.aria-haspopup": "dropdown.popupRole()", "attr.aria-expanded": "dropdown.isOpen()", "attr.aria-controls": "dropdown.menuId() || null" } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsDropdownToggleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[bsDropdownToggle]',
                     host: {
-                        '[attr.aria-haspopup]': '"true"',
+                        '[attr.aria-haspopup]': 'dropdown.popupRole()',
                         '[attr.aria-expanded]': 'dropdown.isOpen()',
+                        '[attr.aria-controls]': 'dropdown.menuId() || null',
                         '(click)': 'onClick()',
                     },
                 }]
@@ -120,13 +133,23 @@ class BsDropdownDirective {
     constructor() {
         this.elementRef = inject(ElementRef);
         this.bsDevelopment = inject(BS_DEVELOPMENT, { optional: true });
+        this.ids = inject(BsIdService);
         this.menu = contentChild.required(BsDropdownMenuDirective);
         this.toggle = contentChild(BsDropdownToggleDirective, ...(ngDevMode ? [{ debugName: "toggle" }] : /* istanbul ignore next */ []));
+        this.rovingFocus = contentChild(BsRovingFocusDirective, { ...(ngDevMode ? { debugName: "rovingFocus" } : /* istanbul ignore next */ {}), descendants: true });
         this.hasBackdrop = input(false, ...(ngDevMode ? [{ debugName: "hasBackdrop" }] : /* istanbul ignore next */ []));
         this.sameWidth = input(false, ...(ngDevMode ? [{ debugName: "sameWidth" }] : /* istanbul ignore next */ []));
         this.closeOnClickOutside = input(true, ...(ngDevMode ? [{ debugName: "closeOnClickOutside" }] : /* istanbul ignore next */ []));
         this.sameDropdownWidth = input(false, ...(ngDevMode ? [{ debugName: "sameDropdownWidth" }] : /* istanbul ignore next */ []));
         this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+        this.popupRole = input('menu', ...(ngDevMode ? [{ debugName: "popupRole" }] : /* istanbul ignore next */ []));
+        /** Reactive id used for the menu's host id and for the toggle's aria-controls. Empty until afterNextRender resolves the host's static id (or generates one), so sibling host bindings on the wrapper element get a chance to land first. */
+        this._menuId = signal('', ...(ngDevMode ? [{ debugName: "_menuId" }] : /* istanbul ignore next */ []));
+        this.menuId = this._menuId.asReadonly();
+        afterNextRender(() => {
+            const hostId = this.elementRef.nativeElement.id;
+            this._menuId.set(hostId ? `${hostId}-menu` : this.ids.next('bs-dropdown-menu'));
+        });
     }
     onBlur() {
         if (this.closeOnClickOutside() && !this.bsDevelopment) {
@@ -134,21 +157,170 @@ class BsDropdownDirective {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsDropdownDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.2.11", type: BsDropdownDirective, isStandalone: true, selector: "[bsDropdown]", inputs: { hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, sameWidth: { classPropertyName: "sameWidth", publicName: "sameWidth", isSignal: true, isRequired: false, transformFunction: null }, closeOnClickOutside: { classPropertyName: "closeOnClickOutside", publicName: "closeOnClickOutside", isSignal: true, isRequired: false, transformFunction: null }, sameDropdownWidth: { classPropertyName: "sameDropdownWidth", publicName: "sameDropdownWidth", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange" }, host: { listeners: { "window:blur": "onBlur()" } }, queries: [{ propertyName: "menu", first: true, predicate: BsDropdownMenuDirective, descendants: true, isSignal: true }, { propertyName: "toggle", first: true, predicate: BsDropdownToggleDirective, descendants: true, isSignal: true }], ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.2.11", type: BsDropdownDirective, isStandalone: true, selector: "[bsDropdown]", inputs: { hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, sameWidth: { classPropertyName: "sameWidth", publicName: "sameWidth", isSignal: true, isRequired: false, transformFunction: null }, closeOnClickOutside: { classPropertyName: "closeOnClickOutside", publicName: "closeOnClickOutside", isSignal: true, isRequired: false, transformFunction: null }, sameDropdownWidth: { classPropertyName: "sameDropdownWidth", publicName: "sameDropdownWidth", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, popupRole: { classPropertyName: "popupRole", publicName: "popupRole", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange" }, host: { listeners: { "window:blur": "onBlur()" } }, queries: [{ propertyName: "menu", first: true, predicate: BsDropdownMenuDirective, descendants: true, isSignal: true }, { propertyName: "toggle", first: true, predicate: BsDropdownToggleDirective, descendants: true, isSignal: true }, { propertyName: "rovingFocus", first: true, predicate: BsRovingFocusDirective, descendants: true, isSignal: true }], exportAs: ["bsDropdown"], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsDropdownDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[bsDropdown]',
+                    exportAs: 'bsDropdown',
                     host: {
                         '(window:blur)': 'onBlur()',
                     },
                 }]
-        }], propDecorators: { menu: [{ type: i0.ContentChild, args: [i0.forwardRef(() => BsDropdownMenuDirective), { isSignal: true }] }], toggle: [{ type: i0.ContentChild, args: [i0.forwardRef(() => BsDropdownToggleDirective), { isSignal: true }] }], hasBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasBackdrop", required: false }] }], sameWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "sameWidth", required: false }] }], closeOnClickOutside: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnClickOutside", required: false }] }], sameDropdownWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "sameDropdownWidth", required: false }] }], isOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOpen", required: false }] }, { type: i0.Output, args: ["isOpenChange"] }] } });
+        }], ctorParameters: () => [], propDecorators: { menu: [{ type: i0.ContentChild, args: [i0.forwardRef(() => BsDropdownMenuDirective), { isSignal: true }] }], toggle: [{ type: i0.ContentChild, args: [i0.forwardRef(() => BsDropdownToggleDirective), { isSignal: true }] }], rovingFocus: [{ type: i0.ContentChild, args: [i0.forwardRef(() => BsRovingFocusDirective), { ...{ descendants: true }, isSignal: true }] }], hasBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasBackdrop", required: false }] }], sameWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "sameWidth", required: false }] }], closeOnClickOutside: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnClickOutside", required: false }] }], sameDropdownWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "sameDropdownWidth", required: false }] }], isOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOpen", required: false }] }, { type: i0.Output, args: ["isOpenChange"] }], popupRole: [{ type: i0.Input, args: [{ isSignal: true, alias: "popupRole", required: false }] }] } });
+
+/**
+ * APG Combobox pattern — turns a plain `<input>` into a combobox that drives
+ * an adjacent `bsDropdown` popup (typeahead, select2, multiselect, searchbox).
+ *
+ * The directive owns the input-side ARIA wiring:
+ * - `role="combobox"` on the host
+ * - `aria-expanded` / `aria-controls` derived from the parent dropdown
+ * - `aria-activedescendant` mirroring the dropdown's `bsRovingFocus` active id
+ * - `aria-autocomplete` (defaults to `"list"`)
+ *
+ * Keyboard model:
+ * - **ArrowUp/Down/Home/End** — opens the popup if closed; once open,
+ *   forwards to the dropdown's `bsRovingFocus` (or emits a `navigate` event
+ *   if no roving-focus is found, so consumers can manage navigation manually).
+ * - **Enter** — fires `activate` so the consumer can commit the highlighted
+ *   option. `stopImmediatePropagation` is called to keep sibling
+ *   `(keydown.enter)` listeners on the same input (e.g. "submit free-text
+ *   search") from also firing on the same Enter.
+ * - **Escape** — closes the popup and fires `cancel`.
+ * - **Tab** — hybrid behaviour: while the popup is open and a roving-focus
+ *   is present, Tab advances the active descendant; at the boundary, Tab
+ *   closes the popup and falls through to the browser's default tab order.
+ */
+class BsComboboxDirective {
+    constructor() {
+        this.dropdown = inject(BsDropdownDirective, { optional: true });
+        /** Aliased to bsComboboxAutocomplete to avoid colliding with the host input's native HTML autocomplete attribute. */
+        this.autocomplete = input('list', { ...(ngDevMode ? { debugName: "autocomplete" } : /* istanbul ignore next */ {}), alias: 'bsComboboxAutocomplete' });
+        /** Override the auto-derived activeDescendant. Defaults to dropdown.rovingFocus()'s id when present. */
+        this.activeDescendant = input(null, ...(ngDevMode ? [{ debugName: "activeDescendant" }] : /* istanbul ignore next */ []));
+        this.expanded = computed(() => this.dropdown?.isOpen() ?? false, ...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
+        this.controls = computed(() => this.dropdown?.menuId() || null, ...(ngDevMode ? [{ debugName: "controls" }] : /* istanbul ignore next */ []));
+        this.resolvedActiveDescendant = computed(() => this.activeDescendant() ?? this.dropdown?.rovingFocus()?.activeDescendantId() ?? null, ...(ngDevMode ? [{ debugName: "resolvedActiveDescendant" }] : /* istanbul ignore next */ []));
+        /** Fires only when no BsRovingFocus is found inside the parent dropdown — otherwise arrow keys are forwarded automatically. */
+        this.navigate = output();
+        this.activate = output();
+        this.cancel = output();
+    }
+    onKeydown(event) {
+        // Skip browser/OS chords on the navigation keys; Tab is exempt because Shift+Tab is a legit chord
+        // and Ctrl/Alt/Meta+Tab don't reach JS in any browser.
+        if (event.key !== 'Tab' && (event.altKey || event.ctrlKey || event.metaKey))
+            return;
+        const isOpen = this.expanded();
+        const rf = this.dropdown?.rovingFocus();
+        switch (event.key) {
+            case 'ArrowDown':
+                if (!isOpen)
+                    this.dropdown?.isOpen.set(true);
+                else if (rf)
+                    rf.next();
+                else
+                    this.navigate.emit('next');
+                event.preventDefault();
+                break;
+            case 'ArrowUp':
+                if (!isOpen)
+                    this.dropdown?.isOpen.set(true);
+                else if (rf)
+                    rf.prev();
+                else
+                    this.navigate.emit('prev');
+                event.preventDefault();
+                break;
+            case 'Home':
+                if (isOpen) {
+                    if (rf)
+                        rf.focusFirst();
+                    else
+                        this.navigate.emit('first');
+                    event.preventDefault();
+                }
+                break;
+            case 'End':
+                if (isOpen) {
+                    if (rf)
+                        rf.focusLast();
+                    else
+                        this.navigate.emit('last');
+                    event.preventDefault();
+                }
+                break;
+            case 'Escape':
+                if (isOpen) {
+                    this.dropdown?.isOpen.set(false);
+                    this.cancel.emit(event);
+                    event.preventDefault();
+                }
+                break;
+            case 'Enter':
+                if (isOpen) {
+                    this.activate.emit(event);
+                    event.preventDefault();
+                    // Sibling listeners on the same input (e.g. a host-template
+                    // (keydown.enter) for "submit free-text search") must not also
+                    // fire when this Enter activated a suggestion — otherwise the
+                    // queued keyup of the alert-dismiss Enter would re-trigger them.
+                    event.stopImmediatePropagation();
+                }
+                break;
+            case 'Tab':
+                // Hybrid combobox TAB: when the popup is open and a roving-focus is
+                // present, TAB advances the active descendant (focus stays in the
+                // input). At the boundary, close the popup and fall through to the
+                // browser's default tab traversal so focus exits the combobox.
+                if (!isOpen || !rf)
+                    break;
+                if (event.shiftKey) {
+                    if (rf.activeIndex() <= rf.firstEnabledIndex()) {
+                        this.dropdown?.isOpen.set(false);
+                    }
+                    else {
+                        rf.prev();
+                        event.preventDefault();
+                    }
+                }
+                else {
+                    if (rf.activeIndex() >= rf.lastEnabledIndex()) {
+                        this.dropdown?.isOpen.set(false);
+                    }
+                    else {
+                        rf.next();
+                        event.preventDefault();
+                    }
+                }
+                break;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsComboboxDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.11", type: BsComboboxDirective, isStandalone: true, selector: "input[bsCombobox]", inputs: { autocomplete: { classPropertyName: "autocomplete", publicName: "bsComboboxAutocomplete", isSignal: true, isRequired: false, transformFunction: null }, activeDescendant: { classPropertyName: "activeDescendant", publicName: "activeDescendant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { navigate: "navigate", activate: "activate", cancel: "cancel" }, host: { attributes: { "role": "combobox" }, listeners: { "keydown": "onKeydown($event)" }, properties: { "attr.aria-autocomplete": "autocomplete()", "attr.aria-haspopup": "\"listbox\"", "attr.aria-expanded": "expanded()", "attr.aria-controls": "controls()", "attr.aria-activedescendant": "resolvedActiveDescendant()" } }, exportAs: ["bsCombobox"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BsComboboxDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'input[bsCombobox]',
+                    exportAs: 'bsCombobox',
+                    host: {
+                        'role': 'combobox',
+                        '[attr.aria-autocomplete]': 'autocomplete()',
+                        '[attr.aria-haspopup]': '"listbox"',
+                        '[attr.aria-expanded]': 'expanded()',
+                        '[attr.aria-controls]': 'controls()',
+                        '[attr.aria-activedescendant]': 'resolvedActiveDescendant()',
+                        '(keydown)': 'onKeydown($event)',
+                    },
+                }]
+        }], propDecorators: { autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "bsComboboxAutocomplete", required: false }] }], activeDescendant: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeDescendant", required: false }] }], navigate: [{ type: i0.Output, args: ["navigate"] }], activate: [{ type: i0.Output, args: ["activate"] }], cancel: [{ type: i0.Output, args: ["cancel"] }] } });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { BsDropdownDirective, BsDropdownMenuDirective, BsDropdownToggleDirective };
+export { BsComboboxDirective, BsDropdownDirective, BsDropdownMenuDirective, BsDropdownToggleDirective };
 //# sourceMappingURL=mintplayer-ng-bootstrap-dropdown.mjs.map