import * as _angular_core from '@angular/core';

/**
 * @license
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
 */
/** A mentionable item — extend with whatever metadata your app needs. */
interface WrMentionItem {
    readonly label: string;
    readonly [key: string]: unknown;
}
/** Payload emitted by `(wrMentionSelected)` on commit. */
interface WrMentionCommit<T extends WrMentionItem = WrMentionItem> {
    /** The selected item. */
    readonly item: T;
    /** The trigger character that opened the panel (e.g. `'@'`). */
    readonly trigger: string;
    /** The query text the user typed after the trigger. */
    readonly query: string;
}

/**
 * `@`-style mention picker for `<textarea>` and `<input>`. Listens for
 * trigger characters (default `'@'`); when typed at a word boundary, an
 * overlay panel opens at the caret and shows filtered options. Pick with
 * Enter / Tab / click — the trigger + query is replaced with the inserted
 * value plus a trailing space.
 *
 * @example
 * ```html
 * <textarea
 *   wrMention
 *   [wrMentionItems]="users"
 *   [displayWith]="userLabel"
 *   (wrMentionSelected)="onMention($event)"
 * ></textarea>
 * ```
 *
 * @see https://ngwr.dev/components/mention
 */
declare class WrMention<T extends WrMentionItem = WrMentionItem> {
    /** Items to filter against the typed query. */
    readonly wrMentionItems: _angular_core.InputSignal<readonly T[]>;
    /** Trigger characters that open the panel. @default ['@'] */
    readonly triggers: _angular_core.InputSignal<readonly string[]>;
    /** Maps an item to its display label. @default `item.label` */
    readonly displayWith: _angular_core.InputSignal<(item: T) => string>;
    /**
     * Returns the text to insert into the textarea on commit. Receives the
     * picked item and the trigger char. @default `${trigger}${displayWith(item)}`
     */
    readonly valueWith: _angular_core.InputSignal<((item: T, trigger: string) => string) | null>;
    /** Custom filter. @default case-insensitive `includes` over `displayWith(item)`. */
    readonly filterWith: _angular_core.InputSignal<((query: string, item: T) => boolean) | null>;
    /** Maximum number of items shown in the panel. @default 8 */
    readonly maxResults: _angular_core.InputSignalWithTransform<number, unknown>;
    /** Emits the selected item, trigger, and query whenever the user commits. */
    readonly wrMentionSelected: _angular_core.OutputEmitterRef<WrMentionCommit<T>>;
    private readonly host;
    private readonly overlay;
    private readonly scrollStrategies;
    private readonly destroyRef;
    private overlayRef;
    private panelRef;
    private state;
    private readonly activeIndex;
    private readonly filteredItems;
    constructor();
    /** @internal */
    protected onInput(): void;
    /** @internal */
    protected onClick(): void;
    /** @internal */
    protected onCaretMove(event: KeyboardEvent): void;
    /** @internal */
    protected onKeydown(event: KeyboardEvent): void;
    /** @internal */
    protected onBlur(): void;
    private detect;
    private activate;
    private filter;
    private setActive;
    private open;
    private close;
    private commit;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrMention<any>, never>;
    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<WrMention<any>, "[wrMention]", never, { "wrMentionItems": { "alias": "wrMentionItems"; "required": false; "isSignal": true; }; "triggers": { "alias": "triggers"; "required": false; "isSignal": true; }; "displayWith": { "alias": "displayWith"; "required": false; "isSignal": true; }; "valueWith": { "alias": "valueWith"; "required": false; "isSignal": true; }; "filterWith": { "alias": "filterWith"; "required": false; "isSignal": true; }; "maxResults": { "alias": "maxResults"; "required": false; "isSignal": true; }; }, { "wrMentionSelected": "wrMentionSelected"; }, never, never, true, never>;
}

/**
 * Overlay panel rendered by {@link WrMention}. Not intended for
 * direct use — the directive instantiates it via a ComponentPortal.
 */
declare class WrMentionPanel {
    readonly items: _angular_core.InputSignal<readonly WrMentionItem[]>;
    readonly activeIndex: _angular_core.InputSignal<number>;
    readonly displayWith: _angular_core.InputSignal<(item: WrMentionItem) => string>;
    /** Emitted when the user picks an item (click). */
    readonly picked: _angular_core.OutputEmitterRef<WrMentionItem>;
    /** Emitted on mouseenter — used by the directive to track hover. */
    readonly hovered: _angular_core.OutputEmitterRef<number>;
    protected onPick(item: WrMentionItem, event: MouseEvent): void;
    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrMentionPanel, never>;
    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrMentionPanel, "wr-mention-panel", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "activeIndex": { "alias": "activeIndex"; "required": false; "isSignal": true; }; "displayWith": { "alias": "displayWith"; "required": false; "isSignal": true; }; }, { "picked": "picked"; "hovered": "hovered"; }, never, never, true, never>;
}

export { WrMention, WrMentionPanel };
export type { WrMentionCommit, WrMentionItem };