@nebular/theme
Version:
@nebular/theme
317 lines (316 loc) • 14 kB
TypeScript
import { AfterContentInit, AfterViewInit, ChangeDetectorRef, ComponentRef, ElementRef, EventEmitter, OnDestroy, QueryList, SimpleChanges, OnChanges, Renderer2, NgZone } from '@angular/core';
import { NgClass } from '@angular/common';
import { ControlValueAccessor } from '@angular/forms';
import { ListKeyManager } from '@angular/cdk/a11y';
import { Subject, BehaviorSubject } from 'rxjs';
import { NbStatusService } from '../../services/status.service';
import { NbAdjustableConnectedPositionStrategy, NbPosition, NbPositionBuilderService } from '../cdk/overlay/overlay-position';
import { NbOverlayRef, NbPortalDirective, NbScrollStrategy } from '../cdk/overlay/mapping';
import { NbOverlayService } from '../cdk/overlay/overlay-service';
import { NbTriggerStrategy, NbTriggerStrategyBuilderService } from '../cdk/overlay/overlay-trigger';
import { NbFocusKeyManager, NbFocusKeyManagerFactoryService } from '../cdk/a11y/focus-key-manager';
import { NbComponentSize } from '../component-size';
import { NbComponentShape } from '../component-shape';
import { NbComponentOrCustomStatus } from '../component-status';
import { NbOptionComponent } from '../option/option.component';
import { NbBooleanInput } from '../helpers';
import { NbFormFieldControl } from '../form-field/form-field-control';
import { NbFocusMonitor } from '../cdk/a11y/a11y.module';
import { NbScrollStrategies } from '../cdk/adapter/block-scroll-strategy-adapter';
import { NbActiveDescendantKeyManager, NbActiveDescendantKeyManagerFactoryService } from '../cdk/a11y/descendant-key-manager';
import { NbSelectAppearance, NbSelectCompareFunction } from '../select/select.component';
import * as i0 from "@angular/core";
/**
* Experimental component with autocomplete possibility.
* Could be changed without any prior notice.
* Use at your own risk.
*
* Style variables is fully inherited.
* Component's public API (`@Input()` and `@Output()`) works in a same way as NbSelectComponent.
*/
export declare class NbSelectWithAutocompleteComponent implements OnChanges, AfterViewInit, AfterContentInit, OnDestroy, ControlValueAccessor, NbFormFieldControl {
protected document: any;
protected overlay: NbOverlayService;
protected hostRef: ElementRef<HTMLElement>;
protected positionBuilder: NbPositionBuilderService;
protected triggerStrategyBuilder: NbTriggerStrategyBuilderService;
protected cd: ChangeDetectorRef;
protected focusKeyManagerFactoryService: NbFocusKeyManagerFactoryService<NbOptionComponent>;
protected focusMonitor: NbFocusMonitor;
protected renderer: Renderer2;
protected zone: NgZone;
protected statusService: NbStatusService;
protected activeDescendantKeyManagerFactoryService: NbActiveDescendantKeyManagerFactoryService<NbOptionComponent>;
/**
* Select size, available sizes:
* `tiny`, `small`, `medium` (default), `large`, `giant`
*/
size: NbComponentSize;
/**
* Select status (adds specific styles):
* `basic`, `primary`, `info`, `success`, `warning`, `danger`, `control`
*/
status: NbComponentOrCustomStatus;
/**
* Select shapes: `rectangle` (default), `round`, `semi-round`
*/
shape: NbComponentShape;
/**
* Select appearances: `outline` (default), `filled`, `hero`
*/
appearance: NbSelectAppearance;
/**
* Specifies class to be set on `nb-option`s container (`nb-option-list`)
* */
optionsListClass: NgClass['ngClass'];
/**
* Specifies class for the overlay panel with options
* */
optionsPanelClass: string | string[];
/**
* Specifies width (in pixels) to be set on `nb-option`s container (`nb-option-list`)
* */
get optionsWidth(): number;
set optionsWidth(value: number);
protected _optionsWidth: number | undefined;
/**
* Adds `outline` styles
*/
get outline(): boolean;
set outline(value: boolean);
static ngAcceptInputType_outline: NbBooleanInput;
/**
* Adds `filled` styles
*/
get filled(): boolean;
set filled(value: boolean);
static ngAcceptInputType_filled: NbBooleanInput;
/**
* Adds `hero` styles
*/
get hero(): boolean;
set hero(value: boolean);
static ngAcceptInputType_hero: NbBooleanInput;
/**
* Disables the select
*/
get disabled(): boolean;
set disabled(value: boolean);
protected _disabled: boolean;
static ngAcceptInputType_disabled: NbBooleanInput;
/**
* If set element will fill its container
*/
get fullWidth(): boolean;
set fullWidth(value: boolean);
protected _fullWidth: boolean;
static ngAcceptInputType_fullWidth: NbBooleanInput;
/**
* Renders select placeholder if nothing selected.
* */
placeholder: string;
/**
* A function to compare option value with selected value.
* By default, values are compared with strict equality (`===`).
*/
get compareWith(): NbSelectCompareFunction;
set compareWith(fn: NbSelectCompareFunction);
protected _compareWith: NbSelectCompareFunction;
/**
* Accepts selected item or array of selected items.
* */
set selected(value: any);
get selected(): any;
/**
* Gives capability just write `multiple` over the element.
* */
get multiple(): boolean;
set multiple(value: boolean);
protected _multiple: boolean;
static ngAcceptInputType_multiple: NbBooleanInput;
/**
* Determines options overlay offset (in pixels).
**/
optionsOverlayOffset: number;
/**
* Determines options overlay scroll strategy.
**/
scrollStrategy: NbScrollStrategies;
/**
* Experimental input.
* Could be changed without any prior notice.
* Use at your own risk.
*
* It replaces the button with input when the select is opened.
* That replacement provides a very basic API to implement options filtering functionality.
* Filtering itself isn't implemented inside select.
* So it should be implemented by the user.
*/
set withOptionsAutocomplete(value: boolean);
get withOptionsAutocomplete(): boolean;
protected _withOptionsAutocomplete: boolean;
get additionalClasses(): string[];
/**
* Will be emitted when selected value changes.
* */
selectedChange: EventEmitter<any>;
selectOpen: EventEmitter<void>;
selectClose: EventEmitter<void>;
optionsAutocompleteInputChange: EventEmitter<string>;
/**
* List of `NbOptionComponent`'s components passed as content.
* TODO maybe it would be better provide wrapper
* */
options: QueryList<NbOptionComponent>;
/**
* Custom select label, will be rendered instead of default enumeration with coma.
* */
customLabel: any;
/**
* NbCard with options content.
* */
portal: NbPortalDirective;
button: ElementRef<HTMLButtonElement> | undefined;
optionsAutocompleteInput: ElementRef<HTMLInputElement> | undefined;
/**
* Determines is select opened.
* */
get isOpen(): boolean;
get isOptionsAutocompleteAllowed(): boolean;
get isOptionsAutocompleteInputShown(): boolean;
/**
* List of selected options.
* */
selectionModel: NbOptionComponent[];
positionStrategy$: BehaviorSubject<NbAdjustableConnectedPositionStrategy | undefined>;
/**
* Current overlay position because of we have to toggle overlayPosition
* in [ngClass] direction and this directive can use only string.
*/
overlayPosition: NbPosition;
protected ref: NbOverlayRef;
protected triggerStrategy: NbTriggerStrategy;
protected alive: boolean;
protected destroy$: Subject<void>;
protected currentKeyManager: ListKeyManager<NbOptionComponent>;
protected focusKeyManager: NbFocusKeyManager<NbOptionComponent>;
protected activeDescendantKeyManager: NbActiveDescendantKeyManager<NbOptionComponent>;
/**
* If a user assigns value before content nb-options's rendered the value will be putted in this variable.
* And then applied after content rendered.
* Only the last value will be applied.
* */
protected queue: any;
/**
* Function passed through control value accessor to propagate changes.
* */
protected onChange: Function;
protected onTouched: Function;
status$: BehaviorSubject<string>;
size$: BehaviorSubject<NbComponentSize>;
focused$: BehaviorSubject<boolean>;
disabled$: BehaviorSubject<boolean>;
fullWidth$: BehaviorSubject<boolean>;
constructor(document: any, overlay: NbOverlayService, hostRef: ElementRef<HTMLElement>, positionBuilder: NbPositionBuilderService, triggerStrategyBuilder: NbTriggerStrategyBuilderService, cd: ChangeDetectorRef, focusKeyManagerFactoryService: NbFocusKeyManagerFactoryService<NbOptionComponent>, focusMonitor: NbFocusMonitor, renderer: Renderer2, zone: NgZone, statusService: NbStatusService, activeDescendantKeyManagerFactoryService: NbActiveDescendantKeyManagerFactoryService<NbOptionComponent>);
/**
* Determines is select hidden.
* */
get isHidden(): boolean;
/**
* Returns width of the select button.
* */
get hostWidth(): number;
lastShownButtonWidth: number | undefined;
get selectButtonClasses(): string[];
/**
* Content rendered in the label.
* */
get selectionView(): any;
ngOnChanges({ disabled, status, size, fullWidth }: SimpleChanges): void;
ngAfterContentInit(): void;
ngAfterViewInit(): void;
ngOnDestroy(): void;
onAutocompleteInputChange(event: Event): void;
show(): void;
hide(): void;
registerOnChange(fn: any): void;
registerOnTouched(fn: any): void;
setDisabledState(isDisabled: boolean): void;
writeValue(value: any): void;
/**
* Selects option or clear all selected options if value is null.
* */
protected handleOptionClick(option: NbOptionComponent): void;
/**
* Deselect all selected options.
* */
protected reset(): void;
/**
* Determines how to select option as multiple or single.
* */
protected selectOption(option: NbOptionComponent): void;
/**
* Select single option.
* */
protected handleSingleSelect(option: NbOptionComponent): void;
/**
* Select for multiple options.
* */
protected handleMultipleSelect(option: NbOptionComponent): void;
protected attachToOverlay(): void;
protected setActiveOption(): void;
protected createOverlay(): void;
protected createKeyManager(): void;
protected updateCurrentKeyManager(): void;
protected resetAutocompleteInput(): void;
protected createPositionStrategy(): NbAdjustableConnectedPositionStrategy;
protected updatePositionStrategy(): void;
protected createScrollStrategy(): NbScrollStrategy;
protected createTriggerStrategy(): NbTriggerStrategy;
protected subscribeOnTriggers(): void;
protected subscribeOnPositionChange(): void;
protected subscribeOnOptionClick(): void;
protected subscribeOnOverlayKeys(): void;
protected subscribeOnOptionsAutocompleteChange(): void;
protected subscribeOnButtonFocus(): void;
protected getContainer(): ComponentRef<any>;
protected focusButton(): void;
/**
* Propagate selected value.
* */
protected emitSelected(selected: any): void;
/**
* Set selected value in model.
* */
protected setSelection(value: any): void;
/**
* Selects value.
* */
protected selectValue(value: any): void;
protected shouldShow(): boolean;
/**
* Sets touched if focus moved outside of button and overlay,
* ignoring the case when focus moved to options overlay.
*/
trySetTouched(): void;
protected isClickedWithinComponent($event: Event): boolean;
protected canSelectValue(): boolean;
protected isOptionHidden(option: NbOptionComponent): boolean;
get tiny(): boolean;
get small(): boolean;
get medium(): boolean;
get large(): boolean;
get giant(): boolean;
get primary(): boolean;
get info(): boolean;
get success(): boolean;
get warning(): boolean;
get danger(): boolean;
get basic(): boolean;
get control(): boolean;
get rectangle(): boolean;
get round(): boolean;
get semiRound(): boolean;
static ɵfac: i0.ɵɵFactoryDeclaration<NbSelectWithAutocompleteComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<NbSelectWithAutocompleteComponent, "nb-select-with-autocomplete", never, { "size": { "alias": "size"; "required": false; }; "status": { "alias": "status"; "required": false; }; "shape": { "alias": "shape"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "optionsListClass": { "alias": "optionsListClass"; "required": false; }; "optionsPanelClass": { "alias": "optionsPanelClass"; "required": false; }; "optionsWidth": { "alias": "optionsWidth"; "required": false; }; "outline": { "alias": "outline"; "required": false; }; "filled": { "alias": "filled"; "required": false; }; "hero": { "alias": "hero"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "optionsOverlayOffset": { "alias": "optionsOverlayOffset"; "required": false; }; "scrollStrategy": { "alias": "scrollStrategy"; "required": false; }; "withOptionsAutocomplete": { "alias": "withOptionsAutocomplete"; "required": false; }; }, { "selectedChange": "selectedChange"; "selectOpen": "selectOpen"; "selectClose": "selectClose"; "optionsAutocompleteInputChange": "optionsAutocompleteInputChange"; }, ["customLabel", "options"], ["nb-select-label", "nb-option, nb-option-group"], false, never>;
}