/** * Copyright 2026 Adobe. All rights reserved. * This file is licensed to you under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. You may obtain a copy * of the License at http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software distributed under * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS * OF ANY KIND, either express or implied. See the License for the specific language * governing permissions and limitations under the License. */ import type { ReactiveController, ReactiveElement } from 'lit'; type DirectionTypes = 'horizontal' | 'vertical' | 'both' | 'grid'; export type FocusGroupConfig = { hostDelegatesFocus?: boolean; focusInIndex?: (_elements: T[]) => number; direction?: DirectionTypes | (() => DirectionTypes); elementEnterAction?: (el: T) => void; elements: () => T[]; isFocusableElement?: (el: T) => boolean; listenerScope?: HTMLElement | (() => HTMLElement); /** * When true, arrow key events will stop propagation after being handled. * This prevents parent elements from also reacting to arrow keys. * * @default false */ stopKeyEventPropagation?: boolean; }; export declare class FocusGroupController implements ReactiveController { protected cachedElements?: T[]; private mutationObserver; get currentIndex(): number; set currentIndex(currentIndex: number); private _currentIndex; private prevIndex; get direction(): DirectionTypes; _direction: () => DirectionTypes; directionLength: number; hostDelegatesFocus: boolean; elementEnterAction: (_el: T) => void; get elements(): T[]; private _elements; protected set focused(focused: boolean); protected get focused(): boolean; private _focused; get focusInElement(): T; get focusInIndex(): number; _focusInIndex: (_elements: T[]) => number; host: ReactiveElement; isFocusableElement: (_el: T) => boolean; isEventWithinListenerScope(event: Event): boolean; _listenerScope: () => HTMLElement; offset: number; recentlyConnected: boolean; /** * When true, arrow key events will stop propagation after being handled. * This prevents parent elements from also reacting to arrow keys. */ stopKeyEventPropagation: boolean; constructor(host: ReactiveElement, { hostDelegatesFocus, direction, elementEnterAction, elements, focusInIndex, isFocusableElement, listenerScope, stopKeyEventPropagation, }?: FocusGroupConfig); handleItemMutation(): void; update({ elements }?: FocusGroupConfig): void; /** * resets the focusedItem to initial item */ reset(): void; focusOnItem(item?: T, options?: FocusOptions): void; focus(options?: FocusOptions): void; clearElementCache(offset?: number): void; setCurrentIndexCircularly(diff: number): void; hostContainsFocus(): void; hostNoLongerContainsFocus(): void; isRelatedTargetOrContainAnElement(event: FocusEvent): boolean; handleFocusin: (event: FocusEvent) => void; /** * handleClick - Finds the element that was clicked and sets the tabindex to 0 * * @returns void */ handleClick: () => void; handleFocusout: (event: FocusEvent) => void; acceptsEventKey(key: string): boolean; handleKeydown: (event: KeyboardEvent) => void; manage(): void; unmanage(): void; addEventListeners(): void; removeEventListeners(): void; hostConnected(): void; hostDisconnected(): void; hostUpdated(): void; } export {};