import * as i0 from '@angular/core'; import { InjectionToken, OnDestroy, ElementRef, ChangeDetectorRef, EventEmitter, AfterContentInit, DoCheck, OnInit, QueryList, OnChanges } from '@angular/core'; import * as i1 from '@sbb-esta/angular/core'; import { SbbErrorStateMatcher } from '@sbb-esta/angular/core'; import * as i3 from '@sbb-esta/angular/icon'; import { FocusableOption, FocusKeyManager } from '@angular/cdk/a11y'; import { ControlValueAccessor, NgControl } from '@angular/forms'; import { SbbFormFieldControl } from '@sbb-esta/angular/form-field'; import { Subject, Observable } from 'rxjs'; import { SbbAutocompleteTrigger } from '@sbb-esta/angular/autocomplete'; /** Represents an event fired on an individual `sbb-chip`. */ interface SbbChipEvent { /** The chip the event was fired on. */ chip: SbbChip; } /** * Injection token that can be used to reference instances of `SbbChipRemove`. It serves as * alternative token to the actual `SbbChipRemove` class which could cause unnecessary * retention of the class and its directive metadata. */ declare const SBB_CHIP_REMOVE: InjectionToken; /** * Injection token that can be used to reference instances of `SbbChipTrailingIcon`. It serves as * alternative token to the actual `SbbChipTrailingIcon` class which could cause unnecessary * retention of the class and its directive metadata. */ declare const SBB_CHIP_TRAILING_ICON: InjectionToken; /** * Dummy directive to add CSS class to chip trailing icon. * @docs-private */ declare class SbbChipTrailingIcon { static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * Design styled Chip component. Used inside the SbbChipList component. */ declare class SbbChip implements FocusableOption, OnDestroy { _elementRef: ElementRef; _changeDetectorRef: ChangeDetectorRef; private _ngZone; private _chipList; /** Whether the chip has focus. */ _hasFocus: boolean; /** Whether animations for the chip are enabled. */ _animationsDisabled: boolean; /** Whether the chip list as a whole is disabled. */ _chipListDisabled: boolean; /** The chip's trailing icon. */ trailingIcon: SbbChipTrailingIcon; /** The chip's remove toggler. */ removeIcon: SbbChipRemove; /** ARIA role that should be applied to the chip. */ role: string; /** The value of the chip. Defaults to the content inside `` tags. */ get value(): any; set value(value: any); protected _value: any; /** Whether the chip is disabled. */ get disabled(): boolean; set disabled(value: boolean); protected _disabled: boolean; /** * Determines whether the chip displays the remove styling and emits (removed) events. */ removable: boolean; /** Tab index of the chip. */ tabIndex: number; /** Emits when the chip is focused. */ readonly _onFocus: Subject; /** Emits when the chip is blurred. */ readonly _onBlur: Subject; /** Emitted when the chip is destroyed. */ readonly destroyed: EventEmitter; /** * Emitted when a chip is to be removed. * * If a FormControl (Array or Set) on the sbb-chip-list is present and no subscriber * listens to (removed), the input value will automatically be removed from * the FormControl collection. */ readonly removed: EventEmitter; private _injector; constructor(...args: unknown[]); _addHostClassName(): void; ngOnDestroy(): void; /** Allows for programmatic focusing of the chip. */ focus(): void; /** * Allows for programmatic removal of the chip. Called by the SbbChipList when the DELETE or * BACKSPACE keys are pressed. * * Informs any listeners of the removal request. Does not remove the chip from the DOM. */ remove(): void; private _removeValueFromControl; /** Handles click events on the chip. */ _handleClick(event: Event): void; /** Handle custom key presses. */ _handleKeydown(event: KeyboardEvent): void; _blur(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; static ngAcceptInputType_disabled: unknown; static ngAcceptInputType_removable: unknown; static ngAcceptInputType_tabIndex: unknown; } /** * Applies proper (click) support and adds styling for use with the Sbb Design "cancel" * * You *may* use a custom icon, but you may need to override the `sbb-chip-remove` positioning * styles to properly center the icon within the chip. */ declare class SbbChipRemove { protected _parentChip: SbbChip; constructor(...args: unknown[]); /** Calls the parent chip's public `remove()` method if applicable. */ _handleClick(event: Event): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** Interface for a text control that is used to drive interaction with a sbb-chip-list. */ interface SbbChipTextControl { /** Unique identifier for the text control. */ id: string; /** The text control's placeholder text. */ placeholder: string; /** Whether the text control has browser focus. */ focused: boolean; /** Whether the text control is empty. */ empty: boolean; /** Focuses the text control. */ focus(options?: FocusOptions): void; /** Autocomplete trigger. */ autocompleteTrigger?: SbbAutocompleteTrigger; } /** * A design chips component (named ChipList for its similarity to the List component). */ declare class SbbChipList implements SbbFormFieldControl, ControlValueAccessor, AfterContentInit, DoCheck, OnInit, OnDestroy { protected _elementRef: ElementRef; private _changeDetectorRef; ngControl: NgControl; /** * Implemented as part of SbbFormFieldControl. * @docs-private */ readonly controlType: string; /** * When a chip is destroyed, we store the index of the destroyed chip until the chips * query list notifies about the update. This is necessary because we cannot determine an * appropriate chip that should receive focus until the array of chips updated completely. */ private _lastDestroyedChipIndex; /** Subject that emits when the component has been destroyed. */ private readonly _destroyed; /** Subscription to focus changes in the chips. */ private _chipFocusSubscription; /** Subscription to blur changes in the chips. */ private _chipBlurSubscription; /** Subscription to remove changes in chips. */ private _chipRemoveSubscription; private _errorStateTracker; /** The chip input to add more chips */ _chipInput: SbbChipTextControl; /** Uid of the chip list */ _uid: string; /** Tab index for the chip list. */ _tabIndex: number; /** * User defined tab index. * When it is not null, use user defined tab index. Otherwise use _tabIndex */ _userTabIndex: number | null; /** The FocusKeyManager which handles focus. */ _keyManager: FocusKeyManager; /** Function when touched */ _onTouched: () => void; /** Function when changed */ _onChange: (value: any) => void; /** The ARIA role applied to the chip list. */ get role(): string | null; set role(role: string | null); private _explicitRole?; /** * Implemented as part of SbbFormFieldControl. * @docs-private */ userAriaDescribedBy: string; /** An object used to control when error messages are shown. */ get errorStateMatcher(): SbbErrorStateMatcher; set errorStateMatcher(value: SbbErrorStateMatcher); /** * Implemented as part of SbbFormFieldControl. * @docs-private */ get value(): any; set value(value: any); protected _value: any; /** * Implemented as part of SbbFormFieldControl. * @docs-private */ get id(): string; /** * Implemented as part of SbbFormFieldControl. * @docs-private */ required: boolean; /** * Implemented as part of SbbFormFieldControl. * @docs-private */ get placeholder(): string; set placeholder(value: string); protected _placeholder: string; /** Whether any chips or the sbbChipInput inside of this chip-list has focus. */ get focused(): boolean; /** * Implemented as part of SbbFormFieldControl. * @docs-private */ get empty(): boolean; /** * Implemented as part of SbbFormFieldControl. * @docs-private */ get disabled(): boolean; set disabled(value: boolean); protected _disabled: boolean; /** Orientation of the chip list. */ ariaOrientation: 'horizontal' | 'vertical'; set tabIndex(value: number); /** Combined stream of all of the child chips' focus change events. */ get chipFocusChanges(): Observable; /** Combined stream of all of the child chips' blur change events. */ get chipBlurChanges(): Observable; /** Combined stream of all of the child chips' remove change events. */ get chipRemoveChanges(): Observable; /** * Event that emits whenever the raw value of the chip-list changes. This is here primarily * to facilitate the two-way binding for the `value` input. * @docs-private */ readonly valueChange: EventEmitter; /** The chip components contained within this chip list. */ chips: QueryList; /** * Emits whenever the component state changes and should cause the parent * form-field to update. Implemented as part of `SbbFormFieldControl`. * @docs-private */ readonly stateChanges: Subject; /** Whether the chip grid is in an error state. */ get errorState(): boolean; set errorState(value: boolean); constructor(...args: unknown[]); ngAfterContentInit(): void; ngOnInit(): void; ngDoCheck(): void; ngOnDestroy(): void; /** Associates an HTML input element with this chip list. */ registerInput(inputElement: SbbChipTextControl): void; /** * Implemented as part of SbbFormFieldControl. * @docs-private */ setDescribedByIds(ids: string[]): void; writeValue(value: any): void; registerOnChange(fn: (value: any) => void): void; registerOnTouched(fn: () => void): void; setDisabledState(isDisabled: boolean): void; /** * Implemented as part of SbbFormFieldControl. * @docs-private */ onContainerClick(event: MouseEvent): void; /** * Focuses the first non-disabled chip in this chip list, or the associated input when there * are no eligible chips. */ focus(options?: FocusOptions): void; /** Attempt to focus an input if we have one. */ _focusInput(options?: FocusOptions): void; /** * Pass events to the keyboard manager. Available here for tests. */ _keydown(event: KeyboardEvent): void; /** * Check the tab index as you should not be allowed to focus an empty list. */ protected _updateTabIndex(): void; /** * If the amount of chips changed, we need to update the * key manager state and focus the next closest chip. */ protected _updateFocusForDestroyedChips(): void; /** * Utility to ensure all indexes are valid. * * @param index The index to be checked. * @returns True if the index is valid for our list of chips. */ private _isValidIndex; /** Refreshes the error state of the chip grid. */ updateErrorState(): void; /** When blurred, mark the field as touched when focus moved outside the chip list. */ _blur(): void; /** Mark the field as touched */ _markAsTouched(): void; /** * Removes the `tabindex` from the chip list and resets it back afterwards, allowing the * user to tab out of it. This prevents the list from capturing focus and redirecting * it back to the first chip, creating a focus trap, if it user tries to tab away. */ _allowFocusEscape(): void; private _resetChips; private _dropSubscriptions; /** Listens to user-generated selection events on each chip. */ private _listenToChipsFocus; private _listenToChipsRemoved; /** Checks whether an event comes from inside a chip element. */ private _originatesFromChip; /** Checks whether any of the chips is focused. */ private _hasFocusedChip; /** Syncs the list's state with the individual chips. */ private _syncChipsState; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; static ngAcceptInputType_required: unknown; static ngAcceptInputType_disabled: unknown; } /** Represents an input event on a `sbbChipInput`. */ interface SbbChipInputEvent { /** The value of the input. */ value: string; /** * Reference to the chip input that emitted the event. */ chipInput: SbbChipInput; } /** * Directive that adds chip-specific behaviors to an input element inside ``. * May be placed inside or outside of an ``. */ declare class SbbChipInput implements SbbChipTextControl, OnChanges, OnDestroy, AfterContentInit { protected _elementRef: ElementRef; private _defaultOptions; autocompleteTrigger?: SbbAutocompleteTrigger; private _ngControl; /** Whether the control is focused. */ focused: boolean; _chipList: SbbChipList; private _destroyed; /** Register input for chip list */ set chipList(value: SbbChipList); /** * Whether the chipEnd event will be emitted when the input is blurred. */ addOnBlur: boolean; /** * The list of key codes that will trigger a chipEnd event. * * Defaults to `[ENTER]`. */ separatorKeyCodes: readonly number[] | ReadonlySet; /** * Emitted when a chip is to be added. * * If a FormControl (Array or Set) on the sbb-chip-list is present and no subscriber * listens to (sbbChipInputTokenEnd), the input value will automatically be added to * the FormControl collection. */ readonly chipEnd: EventEmitter; /** The input's placeholder text. */ placeholder: string; /** Unique id for the input. */ id: string; /** Whether the input is disabled. */ get disabled(): boolean; set disabled(value: boolean); private _disabled; /** Whether the input is empty. */ get empty(): boolean; /** The native input element to which this directive is attached. */ readonly inputElement: HTMLInputElement; constructor(...args: unknown[]); ngOnChanges(): void; ngOnDestroy(): void; ngAfterContentInit(): void; /** Utility method to make host definition/tests more clear. */ _keydown(event?: KeyboardEvent): void; /** Checks to see if the blur should emit the (chipEnd) event. */ _blur(): void; _focus(): void; /** Checks to see if the (chipEnd) event needs to be emitted. */ _emitChipEnd(event?: KeyboardEvent): void; private _addValueToControl; _onInput(): void; /** Focuses the input. */ focus(options?: FocusOptions): void; /** Clears the input */ clear(): void; /** Checks whether a keycode is one of the configured separators. */ private _isSeparatorKey; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; static ngAcceptInputType_addOnBlur: unknown; static ngAcceptInputType_disabled: unknown; } declare class SbbChipsModule { static ɵfac: i0.ɵɵFactoryDeclaration; static ɵmod: i0.ɵɵNgModuleDeclaration; static ɵinj: i0.ɵɵInjectorDeclaration; } /** Default options, for the chips module, that can be overridden. */ interface SbbChipsDefaultOptions { /** The list of key codes that will trigger a chipEnd event. */ separatorKeyCodes: readonly number[] | ReadonlySet; } /** Injection token to be used to override the default options for the chips module. */ declare const SBB_CHIPS_DEFAULT_OPTIONS: InjectionToken; /** * Token used to provide a `SbbChipList` to `SbbChip`. * Used primarily to avoid circular imports between `SbbChipList` and `SbbChip`. */ declare const SBB_CHIP_LIST: InjectionToken; /** * Token used to provide a `SbbChip` to `SbbChipList`. * Used primarily to avoid circular imports between `SbbChipList` and `SbbChip`. */ declare const SBB_CHIP: InjectionToken; export { SBB_CHIP, SBB_CHIPS_DEFAULT_OPTIONS, SBB_CHIP_LIST, SBB_CHIP_REMOVE, SBB_CHIP_TRAILING_ICON, SbbChip, SbbChipInput, SbbChipList, SbbChipRemove, SbbChipTrailingIcon, SbbChipsModule }; export type { SbbChipEvent, SbbChipInputEvent, SbbChipsDefaultOptions };