import { FocusOrigin } from '@angular/cdk/a11y'; import { AfterContentInit, AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, QueryList } from '@angular/core'; import { IFocusableOption } from '@koobiq/cdk/a11y'; import { KbqColorDirective, KbqTitleTextRef } from '@koobiq/components/core'; import { KbqIcon } from '@koobiq/components/icon'; import { Subject } from 'rxjs'; import * as i0 from "@angular/core"; import * as i1 from "@koobiq/components/core"; import * as i2 from "@angular/cdk/drag-drop"; /** * Event object emitted by KbqTag. */ export type KbqTagEvent = { tag: KbqTag; }; /** * Event object emitted by KbqTag when the tag is edited. */ export declare class KbqTagEditChange { readonly tag: KbqTag; readonly type: 'start' | 'submit' | 'cancel'; readonly reason: string; constructor(tag: KbqTag, type: 'start' | 'submit' | 'cancel', reason: string); } /** Event object emitted by KbqTag when selected or deselected. */ export declare class KbqTagSelectionChange { source: KbqTag; selected: boolean; isUserInput: boolean; constructor(source: KbqTag, selected: boolean, isUserInput?: boolean); } /** * Event object emitted when the KbqTag is focused. */ export type KbqTagFocusEvent = KbqTagEvent & { origin: FocusOrigin; }; /** * Object passed to the drag data event when a tag is being dragged. * * @docs-private */ export type KbqTagDragData = KbqTagEvent; /** * Dummy directive to add CSS class to tag avatar. * @docs-private */ export declare class KbqTagAvatar { static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * Dummy directive to add CSS class to tag trailing icon. * @docs-private */ export declare class KbqTagTrailingIcon { static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * Directive to add submit behavior for the editable tag. */ export declare class KbqTagEditSubmit { /** @docs-private */ protected readonly tag: KbqTag; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * Directive to add input behavior for the editable tag. */ export declare class KbqTagEditInput { private readonly tag; /** @docs-private */ protected handleClick(event: MouseEvent): void; /** @docs-private */ protected handleKeydown(event: KeyboardEvent): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } export declare class KbqTag extends KbqColorDirective implements IFocusableOption, OnDestroy, KbqTitleTextRef, AfterContentInit, AfterViewInit { changeDetectorRef: ChangeDetectorRef; private readonly focusMonitor; private readonly tagList; private readonly drag; private readonly destroyRef; /** @docs-private */ readonly elementRef: ElementRef; /** * Emits when the tag is focused. * * @docs-private */ readonly onFocus: Subject; /** * Emits when the tag is blurred. * * @docs-private */ readonly onBlur: Subject; /** @docs-private */ readonly nativeElement: HTMLElement; /** * Whether the tag has focus. * * @docs-private */ hasFocus: boolean; /** Whether the tag is editable. */ get editable(): boolean; set editable(value: boolean); private _editable; /** Whether the tag edits can't be submitted. */ preventEditSubmit: boolean; private readonly editInputElementRef; /** * Emits event when the tag is edited. */ readonly editChange: EventEmitter; /** * @docs-private */ protected readonly editing: import("@angular/core").WritableSignal; /** * @docs-private */ readonly textElement: ElementRef; contentChildren: QueryList; /** The tag avatar */ avatar: KbqTagAvatar; /** The tag's trailing icon. */ trailingIcon: KbqTagTrailingIcon; /** The tag's remove toggler. */ removeIcon: KbqTagRemove; /** Emitted when the tag is selected or deselected. */ readonly selectionChange: EventEmitter; /** Emitted when the tag is destroyed and leaving the DOM. */ readonly destroyed: EventEmitter; /** * Emitted when a tag is to be removed. * Fires on programmatic and UI removal (click or keyboard). */ readonly removed: EventEmitter; /** Whether the tag is selected. */ get selected(): boolean; set selected(value: boolean); private _selected; /** The value of the tag. Defaults to the content inside `` tags. */ get value(): any; set value(value: any); private _value; /** * Whether the tag is selectable. */ get selectable(): boolean; set selectable(value: boolean); private _selectable; /** * Determines whether the tag is removable. */ get removable(): boolean; set removable(value: boolean); private _removable; get tabindex(): any; set tabindex(value: any); private _tabindex; /** * Whether the tag is disabled. */ get disabled(): boolean; set disabled(value: boolean); private _disabled; /** * Whether the tag is draggable. * * @docs-private */ protected get draggable(): boolean; constructor(changeDetectorRef: ChangeDetectorRef); ngAfterContentInit(): void; ngAfterViewInit(): void; ngOnDestroy(): void; /** @docs-private */ addClassModificatorForIcons(): void; /** @docs-private */ addHostClassName(): void; /** * Selects the tag. */ select(): void; /** * Deselects the tag. */ deselect(): void; /** * Selects the tag and emits event with isUserInput flag. * * @docs-private */ selectViaInteraction(): void; /** * Toggles the current selected state of the tag. */ toggleSelected(isUserInput?: boolean): boolean; /** Focuses the tag. */ focus(): void; /** * Allows for programmatic removal of the tag. Called by the KbqTagList when the DELETE or * BACKSPACE keys are pressed. * * Informs any listeners of the removal request. Does not remove the tag from the DOM. */ remove(): void; /** @docs-private */ handleClick(event: MouseEvent): void; /** @docs-private */ handleKeydown(event: KeyboardEvent): void; /** @docs-private */ blur(): void; /** @docs-private */ protected handleDblClick(event: MouseEvent): void; private startEditing; /** @docs-private */ cancelEditing(reason: string): void; /** @docs-private */ submitEditing(reason: string): void; /** * Sets the selected state of the tag. * * @docs-private */ setSelectedState(selected: boolean, options?: Partial<{ isUserInput: boolean; emitEvent: boolean; }>): void; private setupDragInitialProperties; private syncDragDisabledState; private setupFocusMonitor; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; static ngAcceptInputType_editable: unknown; static ngAcceptInputType_preventEditSubmit: unknown; static ngAcceptInputType_selected: unknown; static ngAcceptInputType_selectable: unknown; static ngAcceptInputType_removable: unknown; static ngAcceptInputType_disabled: unknown; } /** * * Example: * * ` * cancel * ` * * You *may* use a custom icon, but you may need to override the `kbq-tag-remove` positioning * styles to properly center the icon within the tag. */ export declare class KbqTagRemove { protected parentTag: KbqTag; constructor(parentTag: KbqTag); /** @docs-private */ focus(event: FocusEvent): void; /** * Calls the parent tag's public `remove()` method if applicable. * * @docs-private */ handleClick(event: Event): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; }