@ngbase/adk 0.1.0

package/fesm2022/ngbase-adk-a11y.mjs

@@ -0,0 +1,617 @@
+import { DOCUMENT } from '@angular/common';
+import * as i0 from '@angular/core';
+import { signal, Injectable, inject, ElementRef, model, input, booleanAttribute, linkedSignal, computed, output, effect, untracked, Directive, ApplicationRef, afterRender } from '@angular/core';
+import { Directionality } from '@ngbase/adk/bidi';
+import { documentListener, isClient } from '@ngbase/adk/utils';
+import { Subject } from 'rxjs';
+
+class AccessibilityService {
+    constructor() {
+        this.groups = signal(new Map());
+        this.activeGroupOrder = [];
+        this.usingMouse = false;
+        documentListener('keydown', () => (this.usingMouse = false), { capture: true });
+        documentListener('mousedown', () => (this.usingMouse = true), { capture: true });
+        documentListener('mousemove', () => (this.usingMouse = true), { capture: true });
+    }
+    setActiveGroup(id) {
+        // remove id from activeGroupOrder
+        const index = this.activeGroupOrder.indexOf(id);
+        if (index !== -1) {
+            this.activeGroupOrder.splice(index, 1);
+        }
+        this.activeGroupOrder.push(id);
+        // console.log('setActiveGroup', this.activeGroupOrder);
+    }
+    removeActiveGroup(id) {
+        this.activeGroupOrder = this.activeGroupOrder.filter(g => g !== id);
+        // console.log('removeActiveGroup', this.activeGroupOrder);
+    }
+    isActive(key) {
+        return this.activeGroupOrder[this.activeGroupOrder.length - 1] === key;
+    }
+    getPreviousGroup() {
+        const id = this.activeGroupOrder[this.activeGroupOrder.length - 2];
+        return this.groups().get(id);
+    }
+    getGroup(key) {
+        return this.groups().get(key);
+    }
+    addGroup(key, group) {
+        this.groups.update(x => new Map([...x, [key, group]]));
+        this.setActiveGroup(key);
+    }
+    removeGroup(key) {
+        this.groups.update(x => {
+            x.delete(key);
+            return new Map(x);
+        });
+        this.removeActiveGroup(key);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: AccessibilityService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: AccessibilityService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: AccessibilityService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [] });
+
+class AccessibleGroup {
+    constructor() {
+        this.allyService = inject(AccessibilityService);
+        this.el = inject(ElementRef);
+        this.document = inject(DOCUMENT);
+        this.dir = inject(Directionality);
+        this.ayId = model('');
+        this.columns = input();
+        this.ariaLabel = input('');
+        this.ariaLabelledby = input('');
+        this.isPopup = input(false);
+        this.loop = input(true);
+        this.disabled = input(false, { transform: booleanAttribute });
+        this.clickable = model(false);
+        this.initialFocus = input(true);
+        // Hacky way to make sure the signals are updated
+        this._ayId = linkedSignal(this.ayId);
+        this._disabled = linkedSignal(this.disabled);
+        this._ariaLabel = linkedSignal(this.ariaLabel);
+        this._ariaLabelledby = linkedSignal(this.ariaLabelledby);
+        this._isPopup = linkedSignal(this.isPopup);
+        this._loop = linkedSignal(this.loop);
+        this._columns = linkedSignal(this.columns);
+        this._initialFocus = linkedSignal(this.initialFocus);
+        this.isOn = signal(false);
+        this.elements = signal([]);
+        this.items = computed(() => {
+            const _ = this._ayId() || '';
+            const items = this.elements();
+            // console.count(`items changed ${this.ayId()}`);
+            // Sort items based on their position in the DOM
+            items.sort((a, b) => {
+                return a.host.nativeElement.compareDocumentPosition(b.host.nativeElement) ===
+                    Node.DOCUMENT_POSITION_FOLLOWING
+                    ? -1
+                    : 1;
+            });
+            return items;
+        });
+        this.focusChanged = output();
+        this.handleFocusIn = (_) => {
+            if (!this.isOn()) {
+                // console.log(`focus in ${this._ayId()}`);
+                this.on();
+            }
+        };
+        this.handleFocusOut = (event) => {
+            if (!this.el.nativeElement.contains(event.relatedTarget)) {
+                // console.log(`focus out ${this._ayId()}`);
+                this.off();
+            }
+        };
+        this.on = () => {
+            this.allyService.setActiveGroup(this._ayId());
+            if (this._isPopup()) {
+                this.document.querySelectorAll('body > *').forEach(el => {
+                    if (el.tagName !== 'MEE-PORTAL') {
+                        el.setAttribute('tabindex', '-1');
+                        el.setAttribute('aria-hidden', 'true');
+                    }
+                });
+            }
+            this.document.addEventListener('keydown', this.onKeyDown);
+            this.isOn.set(true);
+            this.el.nativeElement.tabIndex = -1;
+        };
+        this.off = () => {
+            if (this._isPopup()) {
+                this.document.querySelectorAll('body > *').forEach(el => {
+                    el.removeAttribute('tabindex');
+                    el.removeAttribute('aria-hidden');
+                });
+            }
+            this.document.removeEventListener('keydown', this.onKeyDown);
+            this.isOn.set(false);
+            this.el.nativeElement.tabIndex = 0;
+        };
+        this.onKeyDown = (event) => {
+            const items = this.items();
+            // this.log('key down', this.ayId(), event.key, items.length);
+            if (!items.length || !this.allyService.isActive(this._ayId()))
+                return;
+            // console.log(`key down ${this.ayId()}`);
+            let item = this.focusedItem?.deref();
+            // If there is no focused item, then wait for the first key press to focus the item
+            if (!item)
+                return;
+            const currentIndex = item ? items.indexOf(item) : -1;
+            let nextIndex = null;
+            // Calculate the number of columns in the grid
+            // const gridRect = this.el.nativeElement.getBoundingClientRect();
+            // const itemWidth = items[0].host.nativeElement.offsetWidth;
+            const columns = this._columns() || 1;
+            let direction = 'next';
+            const isInput = event.target.tagName === 'INPUT';
+            // if the direction is rtl, then we need to reverse the direction of the arrow keys
+            let key = event.key;
+            if (this.dir.isRtl()) {
+                if (key === 'ArrowRight')
+                    key = 'ArrowLeft';
+                else if (key === 'ArrowLeft')
+                    key = 'ArrowRight';
+            }
+            switch (key) {
+                case 'ArrowRight': {
+                    if (isInput)
+                        return;
+                    const expand = item._expandable() && !item._expanded();
+                    if (item.hasPopup() || expand) {
+                        if (item.events.observed) {
+                            item.events.next({ event, type: 'keyRight', item });
+                        }
+                        else {
+                            item.click();
+                        }
+                        return;
+                    }
+                    nextIndex = (currentIndex + 1) % items.length;
+                    direction = 'next';
+                    break;
+                }
+                case 'ArrowLeft':
+                    if (isInput)
+                        return;
+                    const prevGroup = this.allyService.getPreviousGroup();
+                    let prevItem = prevGroup?.focusedItem?.deref();
+                    const isSameGroup = prevGroup?._ayId() === this._ayId();
+                    const collapse = item._expandable() && item._expanded();
+                    if ((!isSameGroup && prevItem) || collapse) {
+                        if (prevItem?.events.observed) {
+                            prevItem?.events.next({ event, type: 'keyLeft', item });
+                        }
+                        else {
+                            // this click is common between the tree and the menu
+                            // we need to check if the item is a tree node and if it has children
+                            item.click();
+                        }
+                        return;
+                    }
+                    else if (item._expandable()) {
+                        nextIndex = this.findNextOrPreviousLevelItem(currentIndex, 'previous', items);
+                    }
+                    else {
+                        nextIndex = (currentIndex - 1 + items.length) % items.length;
+                    }
+                    direction = 'previous';
+                    break;
+                case 'ArrowDown':
+                    nextIndex = currentIndex + columns;
+                    if (nextIndex >= items.length) {
+                        if (this._loop()) {
+                            nextIndex = nextIndex % columns; // Wrap to top
+                        }
+                        else {
+                            nextIndex = items.length - 1;
+                        }
+                    }
+                    direction = 'down';
+                    break;
+                case 'ArrowUp':
+                    nextIndex = currentIndex - columns;
+                    if (nextIndex < 0) {
+                        if (this._loop()) {
+                            nextIndex = items.length - (columns - (currentIndex % columns)); // Wrap to bottom
+                        }
+                        else {
+                            nextIndex = 0;
+                        }
+                    }
+                    direction = 'up';
+                    break;
+                case 'Home':
+                    nextIndex = this.findNextEnabledItem(Math.floor(currentIndex / columns) * columns, 'next', items);
+                    direction = 'first';
+                    break;
+                case 'End':
+                    nextIndex = this.findNextEnabledItem(Math.min(Math.floor(currentIndex / columns) * columns + columns - 1, items.length - 1), 'previous', items);
+                    direction = 'last';
+                    break;
+                case 'Tab':
+                    if (this._isPopup()) {
+                        // this.log('tab', event, this.isPopup());
+                        event.preventDefault();
+                    }
+                    return;
+                case 'Enter':
+                case ' ':
+                    if (item && !(event.key === ' ' && isInput)) {
+                        event.preventDefault();
+                        event.stopPropagation();
+                        item.click();
+                    }
+                    return;
+                default:
+                    return;
+            }
+            event.preventDefault();
+            event.stopPropagation();
+            event.stopImmediatePropagation();
+            item?.blur();
+            this.focusIndex(nextIndex, direction);
+        };
+        this.el.nativeElement.style.outline = 'none';
+        effect(cleanup => {
+            const id = this._ayId();
+            if (id) {
+                this.allyService.addGroup(id, this);
+                cleanup(() => {
+                    this.off();
+                    this.allyService.removeGroup(id);
+                });
+            }
+        });
+        effect(() => {
+            const items = this.items();
+            const isOn = this.isOn();
+            untracked(() => {
+                items.forEach(item => item.blur());
+                // console.log('group', this._ayId(), items.length, isOn);
+                this.log('focus', items.length, isOn, this._initialFocus());
+                let item = this.focusedItem?.deref();
+                if (items.length && isOn && this._initialFocus()) {
+                    if (!item || !items.includes(item)) {
+                        item = items[0];
+                    }
+                    this.focusItem(item);
+                }
+            });
+        });
+        effect(() => {
+            const isPopup = this._isPopup();
+            untracked(() => {
+                if (isPopup) {
+                    this.on();
+                }
+                else {
+                    this.el.nativeElement.addEventListener('focusin', this.handleFocusIn);
+                    this.el.nativeElement.addEventListener('focusout', this.handleFocusOut);
+                }
+            });
+        });
+    }
+    findNextOrPreviousLevelItem(currentIndex, direction, items) {
+        const currentItem = items[currentIndex];
+        const currentLevel = currentItem.level();
+        const level = Math.max(0, currentLevel + (direction === 'next' ? 1 : -1));
+        let index = currentIndex - 1;
+        for (let i = index; i >= 0; i--) {
+            const nextItem = items[i];
+            if (!nextItem._disabled() && !nextItem._skip() && nextItem.level() === level) {
+                return i;
+            }
+        }
+        return currentIndex;
+    }
+    focusItem(item) {
+        const previousItem = this.focusedItem?.deref();
+        previousItem?.blur();
+        const items = this.items();
+        this.log('focusItem', item?.host.nativeElement.textContent);
+        item = item ?? items.find(item => !item._disabled() && !item._skip());
+        this.log('next focusItem', item?.host.nativeElement.textContent);
+        if (!item)
+            return;
+        this.focusIndex(items.indexOf(item));
+    }
+    focusIndex(nextIndex = 0, direction = 'next') {
+        const items = this.items();
+        this.log('focusIndex', nextIndex, direction);
+        if (nextIndex !== null && nextIndex >= 0 && nextIndex < items.length) {
+            let nextItem = items[nextIndex];
+            if (nextItem._disabled() || nextItem._skip()) {
+                nextIndex = this.getNextItem(nextIndex, items, direction);
+                nextItem = items[nextIndex];
+            }
+            const previousItem = this.focusedItem?.deref();
+            this.focusedItem = new WeakRef(nextItem);
+            nextItem.focus(!this.allyService.usingMouse && !this._isPopup(), !this.allyService.usingMouse);
+            // this.focusCount++;
+            if (this.clickable())
+                nextItem.click();
+            this.focusChanged.emit({ current: nextItem, previous: previousItem });
+        }
+    }
+    // it should start from the current index and move to the next item based on the direction
+    // if the current index is the last item, it should move to the first item
+    // we should also consider the disabled items
+    getNextItem(currentIndex, items, direction) {
+        // const filteredItems = items.filter(item => !item.disabled() && !item.skip());
+        const len = items.length;
+        const step = direction === 'next'
+            ? 1
+            : direction === 'previous'
+                ? -1
+                : direction === 'up'
+                    ? -(this._columns() || 1)
+                    : this._columns() || 1;
+        for (let i = 0; i < len; i++) {
+            const nextIndex = (currentIndex + i * step + len) % len;
+            // this.log(totalItems, currentIndex, step, nextIndex);
+            const item = items[nextIndex];
+            if (!item._disabled() && !item._skip()) {
+                // this.log({ currentIndex, items, direction });
+                return nextIndex;
+            }
+        }
+        return currentIndex;
+    }
+    findNextEnabledItem(startIndex, direction, items) {
+        const step = direction === 'next' ? 1 : -1;
+        const endIndex = direction === 'next' ? items.length : -1;
+        for (let i = startIndex; i !== endIndex; i += step) {
+            if (!items[i]._disabled() && !items[i]._skip()) {
+                return i;
+            }
+        }
+        return startIndex; // If no enabled item found, return the starting index
+    }
+    log(...args) {
+        // console.log(...args);
+    }
+    register(item) {
+        this.elements.update(x => [...x, item]);
+    }
+    unregister(item) {
+        this.elements.update(x => x.filter(y => y !== item));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: AccessibleGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.0", type: AccessibleGroup, isStandalone: true, selector: "[ngbAccessibleGroup]", inputs: { ayId: { classPropertyName: "ayId", publicName: "ayId", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, isPopup: { classPropertyName: "isPopup", publicName: "isPopup", isSignal: true, isRequired: false, transformFunction: null }, loop: { classPropertyName: "loop", publicName: "loop", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, initialFocus: { classPropertyName: "initialFocus", publicName: "initialFocus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ayId: "ayIdChange", clickable: "clickableChange", focusChanged: "focusChanged" }, host: { attributes: { "role": "group", "tabindex": "0" }, properties: { "attr.aria-label": "_ariaLabel()", "attr.aria-labelledby": "_ariaLabelledby()", "attr.aria-disabled": "_disabled()" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: AccessibleGroup, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ngbAccessibleGroup]',
+                    host: {
+                        role: 'group',
+                        '[attr.aria-label]': '_ariaLabel()',
+                        '[attr.aria-labelledby]': '_ariaLabelledby()',
+                        '[attr.aria-disabled]': '_disabled()',
+                        tabindex: '0',
+                    },
+                }]
+        }], ctorParameters: () => [] });
+
+class AccessibleItem {
+    constructor() {
+        this.allyService = inject(AccessibilityService);
+        this.host = inject(ElementRef);
+        this.id = input('');
+        this.ayId = input('');
+        this.role = input('button');
+        this.disabled = input(false, { transform: booleanAttribute });
+        this.selected = input(false, { transform: booleanAttribute });
+        this.data = input();
+        this.skip = input(false, { transform: booleanAttribute });
+        this.level = model(0);
+        this.expandable = model(false);
+        this.expanded = model(false);
+        this.selectedChange = output();
+        // inputs writable for hacky reasons
+        this._disabled = linkedSignal(this.disabled);
+        this._selected = linkedSignal(this.selected);
+        this._ayId = linkedSignal(this.ayId);
+        this._data = linkedSignal(this.data);
+        this._id = linkedSignal(this.id);
+        this._skip = linkedSignal(this.skip);
+        this._expandable = linkedSignal(this.expandable);
+        this._expanded = linkedSignal(this.expanded);
+        this.group = computed(() => this.allyService.getGroup(this._ayId() || ''));
+        this.pressed = signal(false);
+        this.hasPopup = computed(() => this.el.getAttribute('aria-haspopup') === 'true');
+        this.events = new Subject();
+        this.count = 1;
+        /**
+         * @internal when component is destroyed, we don't want to emit events
+         */
+        this.isDestroyed = false;
+        this.onFocus = () => {
+            if (this.allyService.usingMouse) {
+                // console.log('using mouse');
+                this.group()?.focusItem(this);
+            }
+        };
+        this.blur = () => {
+            this.el.tabIndex = -1;
+            this.el.removeAttribute('data-focus');
+        };
+        effect(cleanUp => {
+            const group = this.group();
+            if (group) {
+                group.register(this);
+                cleanUp(() => group.unregister(this));
+            }
+        });
+        effect(cleanUp => {
+            const el = this.host.nativeElement;
+            if (this.group()?._isPopup()) {
+                el.addEventListener('mouseenter', this.onFocus);
+                cleanUp(() => el.removeEventListener('mouseenter', this.onFocus));
+            }
+        });
+    }
+    get el() {
+        return this.host.nativeElement;
+    }
+    focus(focus, isKeyboard) {
+        // console.log('focus', focus);
+        // console.log('scrollIntoView', isKeyboard);
+        if (focus)
+            this.el.focus();
+        // this.el.classList.add('bg-muted-background');
+        this.el.setAttribute('data-focus', 'true');
+        if (isKeyboard)
+            this.el.scrollIntoView({ block: 'nearest' });
+        this.el.tabIndex = 0;
+    }
+    click() {
+        this.el.tabIndex = 0;
+        this.el.click();
+        this.el.focus();
+        // sometimes the click event detroyes the component
+        if (!this.isDestroyed) {
+            this.selectedChange.emit(this.count++);
+            this.events.next({ event: new KeyboardEvent('click'), type: 'click', item: this });
+        }
+    }
+    ngOnDestroy() {
+        this.isDestroyed = true;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: AccessibleItem, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.0", type: AccessibleItem, isStandalone: true, selector: "[ngbAccessibleItem]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, ayId: { classPropertyName: "ayId", publicName: "ayId", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, skip: { classPropertyName: "skip", publicName: "skip", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, expandable: { classPropertyName: "expandable", publicName: "expandable", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { level: "levelChange", expandable: "expandableChange", expanded: "expandedChange", selectedChange: "selectedChange" }, host: { listeners: { "click": "onFocus()" }, properties: { "attr.aria-pressed": "pressed()", "attr.aria-disabled": "_disabled() || null", "attr.aria-selected": "_selected()", "tabindex": "_disabled() ? -1 : 0" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: AccessibleItem, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ngbAccessibleItem]',
+                    host: {
+                        '[attr.aria-pressed]': 'pressed()',
+                        '[attr.aria-disabled]': '_disabled() || null',
+                        '[attr.aria-selected]': '_selected()',
+                        '[tabindex]': '_disabled() ? -1 : 0',
+                        '(click)': 'onFocus()',
+                    },
+                }]
+        }], ctorParameters: () => [] });
+
+class FocusTrap {
+    constructor() {
+        this.el = inject(ElementRef);
+        this.ngbFocusTrap = input(true, { transform: booleanAttribute });
+        this.focusInitial = input(true, { transform: booleanAttribute });
+        // hacky way
+        this._focusTrap = linkedSignal(this.ngbFocusTrap);
+        this._focusInitial = linkedSignal(this.focusInitial);
+        this.firstFocusableElement = null;
+        this.lastFocusableElement = null;
+        this.onKeydown = (event) => {
+            if (event.key === 'Tab') {
+                if (event.shiftKey) {
+                    // Shift + Tab
+                    if (document.activeElement === this.firstFocusableElement) {
+                        event.preventDefault();
+                        this.lastFocusableElement?.focus();
+                    }
+                }
+                else {
+                    // Tab
+                    if (document.activeElement === this.lastFocusableElement) {
+                        event.preventDefault();
+                        this.firstFocusableElement?.focus();
+                    }
+                }
+            }
+        };
+        let initialFocus = false;
+        effect(cleanup => {
+            if (this._focusTrap()) {
+                const observer = new MutationObserver(() => this.setFocusableElements());
+                observer.observe(this.el.nativeElement, { childList: true, subtree: true });
+                // we have call this manually because mutation observer not trigger on initial render
+                this.setFocusableElements();
+                if (!initialFocus && this._focusInitial()) {
+                    initialFocus = true;
+                    // console.log('focusInitial', this.el.nativeElement);
+                    this.firstFocusableElement?.focus();
+                }
+                // listen to the keydown event
+                this.el.nativeElement.addEventListener('keydown', this.onKeydown);
+                cleanup(() => {
+                    this.el.nativeElement.removeEventListener('keydown', this.onKeydown);
+                    observer.disconnect();
+                });
+            }
+        });
+    }
+    setFocusableElements() {
+        const focusableElements = this.el.nativeElement.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
+        this.firstFocusableElement = focusableElements[0];
+        this.lastFocusableElement = focusableElements[focusableElements.length - 1];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: FocusTrap, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.0", type: FocusTrap, isStandalone: true, selector: "[ngbFocusTrap]", inputs: { ngbFocusTrap: { classPropertyName: "ngbFocusTrap", publicName: "ngbFocusTrap", isSignal: true, isRequired: false, transformFunction: null }, focusInitial: { classPropertyName: "focusInitial", publicName: "focusInitial", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: FocusTrap, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ngbFocusTrap]',
+                }]
+        }], ctorParameters: () => [] });
+
+class Autofocus {
+    constructor() {
+        this.el = inject(ElementRef);
+        this.applicationRef = inject(ApplicationRef);
+        this.document = inject(DOCUMENT);
+        this.focusDelay = input(300);
+        this.isFocused = false;
+        if (isClient()) {
+            afterRender({
+                write: () => {
+                    // check if element is present in dom
+                    const isPresent = this.document.contains(this.el.nativeElement);
+                    if (isPresent && !this.isFocused) {
+                        this.isFocused = true;
+                        this.focusElement();
+                    }
+                    else if (!isPresent) {
+                        this.isFocused = false;
+                    }
+                },
+            });
+        }
+    }
+    focusElement() {
+        const sub = this.applicationRef.isStable.subscribe(res => {
+            if (res) {
+                sub.unsubscribe();
+                setTimeout(() => {
+                    this.el.nativeElement.focus();
+                }, this.focusDelay());
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Autofocus, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.0", type: Autofocus, isStandalone: true, selector: "[ngbAutofocus]", inputs: { focusDelay: { classPropertyName: "focusDelay", publicName: "focusDelay", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: Autofocus, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ngbAutofocus]',
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AccessibleGroup, AccessibleItem, Autofocus, FocusTrap };
+//# sourceMappingURL=ngbase-adk-a11y.mjs.map