UNPKG

29.6 kBTypeScriptView Raw
1import { AfterContentInit, AfterViewInit, ChangeDetectorRef, ComponentRef, ElementRef, EventEmitter, OnDestroy, QueryList, SimpleChanges, OnChanges, Renderer2, NgZone } from '@angular/core';
2import { NgClass } from '@angular/common';
3import { ControlValueAccessor } from '@angular/forms';
4import { Subject, BehaviorSubject } from 'rxjs';
5import { NbStatusService } from '../../services/status.service';
6import { NbAdjustableConnectedPositionStrategy, NbPosition, NbPositionBuilderService } from '../cdk/overlay/overlay-position';
7import { NbOverlayRef, NbPortalDirective, NbScrollStrategy } from '../cdk/overlay/mapping';
8import { NbOverlayService } from '../cdk/overlay/overlay-service';
9import { NbTriggerStrategy, NbTriggerStrategyBuilderService } from '../cdk/overlay/overlay-trigger';
10import { NbFocusKeyManager, NbFocusKeyManagerFactoryService } from '../cdk/a11y/focus-key-manager';
11import { NbComponentSize } from '../component-size';
12import { NbComponentShape } from '../component-shape';
13import { NbComponentOrCustomStatus } from '../component-status';
14import { NbOptionComponent } from '../option/option.component';
15import { NbBooleanInput } from '../helpers';
16import { NbFormFieldControl, NbFormFieldControlConfig } from '../form-field/form-field-control';
17import { NbFocusMonitor } from '../cdk/a11y/a11y.module';
18import { NbScrollStrategies } from '../cdk/adapter/block-scroll-strategy-adapter';
19import * as i0 from "@angular/core";
20export type NbSelectCompareFunction<T = any> = (v1: any, v2: any) => boolean;
21export type NbSelectAppearance = 'outline' | 'filled' | 'hero';
22export declare class NbSelectLabelComponent {
23 static ɵfac: i0.ɵɵFactoryDeclaration<NbSelectLabelComponent, never>;
24 static ɵcmp: i0.ɵɵComponentDeclaration<NbSelectLabelComponent, "nb-select-label", never, {}, {}, never, ["*"], false, never>;
25}
26export declare function nbSelectFormFieldControlConfigFactory(): NbFormFieldControlConfig;
27/**
28 * The `NbSelectComponent` provides a capability to select one of the passed items.
29 *
30 * @stacked-example(Showcase, select/select-showcase.component)
31 *
32 * ### Installation
33 *
34 * Import `NbSelectModule` to your feature module.
35 * ```ts
36 * @NgModule({
37 * imports: [
38 * // ...
39 * NbSelectModule,
40 * ],
41 * })
42 * export class PageModule { }
43 * ```
44 * ### Usage
45 *
46 * If you want to use it as the multi-select control you have to mark it as `multiple`.
47 * In this case, `nb-select` will work only with arrays - accept arrays and propagate arrays.
48 *
49 * @stacked-example(Multiple, select/select-multiple.component)
50 *
51 * Items without values will clean the selection. Both `null` and `undefined` values will also clean the selection.
52 *
53 * @stacked-example(Clean selection, select/select-clean.component)
54 *
55 * Select may be bounded using `selected` input:
56 *
57 * ```html
58 * <nb-select [(selected)]="selected"></nb-selected>
59 * ```
60 *
61 * Or you can bind control with form controls or ngModel:
62 *
63 * @stacked-example(Select form binding, select/select-form.component)
64 *
65 * Options in the select may be grouped using `nb-option-group` component.
66 *
67 * @stacked-example(Grouping, select/select-groups.component)
68 *
69 * Select may have a placeholder that will be shown when nothing selected:
70 *
71 * @stacked-example(Placeholder, select/select-placeholder.component)
72 *
73 * You can disable select, options and whole groups.
74 *
75 * @stacked-example(Disabled select, select/select-disabled.component)
76 *
77 * Also, the custom label may be provided in select.
78 * This custom label will be used for instead placeholder when something selected.
79 *
80 * @stacked-example(Custom label, select/select-label.component)
81 *
82 * Default `nb-select` size is `medium` and status is `basic`.
83 * Select is available in multiple colors using `status` property:
84 *
85 * @stacked-example(Select statuses, select/select-status.component)
86 *
87 * There are five select sizes:
88 *
89 * @stacked-example(Select sizes, select/select-sizes.component)
90 *
91 * And two additional style types - `filled`:
92 *
93 * @stacked-example(Filled select, select/select-filled.component)
94 *
95 * and `hero`:
96 *
97 * @stacked-example(Select colors, select/select-hero.component)
98 *
99 * Select is available in different shapes, that could be combined with the other properties:
100 *
101 * @stacked-example(Select shapes, select/select-shapes.component)
102 *
103 * By default, the component selects options whose values are strictly equal (`===`) with the select value.
104 * To change such behavior, pass a custom comparator function to the `compareWith` attribute.
105 *
106 * @stacked-example(Select custom comparator, select/select-compare-with.component)
107 *
108 * You can add an additional icon to the select via the `nb-form-field` component:
109 * @stacked-example(Select with icon, select/select-icon.component)
110 *
111 * @additional-example(Interactive, select/select-interactive.component)
112 *
113 * @styles
114 *
115 * select-cursor:
116 * select-disabled-cursor:
117 * select-min-width:
118 * select-outline-width:
119 * select-outline-color:
120 * select-icon-offset:
121 * select-text-font-family:
122 * select-placeholder-text-font-family:
123 * select-tiny-text-font-size:
124 * select-tiny-text-font-weight:
125 * select-tiny-text-line-height:
126 * select-tiny-placeholder-text-font-size:
127 * select-tiny-placeholder-text-font-weight:
128 * select-tiny-max-width:
129 * select-small-text-font-size:
130 * select-small-text-font-weight:
131 * select-small-text-line-height:
132 * select-small-placeholder-text-font-size:
133 * select-small-placeholder-text-font-weight:
134 * select-small-max-width:
135 * select-medium-text-font-size:
136 * select-medium-text-font-weight:
137 * select-medium-text-line-height:
138 * select-medium-placeholder-text-font-size:
139 * select-medium-placeholder-text-font-weight:
140 * select-medium-max-width:
141 * select-large-text-font-size:
142 * select-large-text-font-weight:
143 * select-large-text-line-height:
144 * select-large-placeholder-text-font-size:
145 * select-large-placeholder-text-font-weight:
146 * select-large-max-width:
147 * select-giant-text-font-size:
148 * select-giant-text-font-weight:
149 * select-giant-text-line-height:
150 * select-giant-placeholder-text-font-size:
151 * select-giant-placeholder-text-font-weight:
152 * select-giant-max-width:
153 * select-rectangle-border-radius:
154 * select-semi-round-border-radius:
155 * select-round-border-radius:
156 * select-outline-border-style:
157 * select-outline-border-width:
158 * select-outline-tiny-padding:
159 * select-outline-small-padding:
160 * select-outline-medium-padding:
161 * select-outline-large-padding:
162 * select-outline-giant-padding:
163 * select-outline-basic-icon-color:
164 * select-outline-basic-text-color:
165 * select-outline-basic-placeholder-text-color:
166 * select-outline-basic-background-color:
167 * select-outline-basic-border-color:
168 * select-outline-basic-focus-background-color:
169 * select-outline-basic-focus-border-color:
170 * select-outline-basic-hover-background-color:
171 * select-outline-basic-hover-border-color:
172 * select-outline-basic-disabled-background-color:
173 * select-outline-basic-disabled-border-color:
174 * select-outline-basic-disabled-icon-color:
175 * select-outline-basic-disabled-text-color:
176 * select-outline-primary-icon-color:
177 * select-outline-primary-text-color:
178 * select-outline-primary-placeholder-text-color:
179 * select-outline-primary-background-color:
180 * select-outline-primary-border-color:
181 * select-outline-primary-focus-background-color:
182 * select-outline-primary-focus-border-color:
183 * select-outline-primary-hover-background-color:
184 * select-outline-primary-hover-border-color:
185 * select-outline-primary-disabled-background-color:
186 * select-outline-primary-disabled-border-color:
187 * select-outline-primary-disabled-icon-color:
188 * select-outline-primary-disabled-text-color:
189 * select-outline-success-icon-color:
190 * select-outline-success-text-color:
191 * select-outline-success-placeholder-text-color:
192 * select-outline-success-background-color:
193 * select-outline-success-border-color:
194 * select-outline-success-focus-background-color:
195 * select-outline-success-focus-border-color:
196 * select-outline-success-hover-background-color:
197 * select-outline-success-hover-border-color:
198 * select-outline-success-disabled-background-color:
199 * select-outline-success-disabled-border-color:
200 * select-outline-success-disabled-icon-color:
201 * select-outline-success-disabled-text-color:
202 * select-outline-info-icon-color:
203 * select-outline-info-text-color:
204 * select-outline-info-placeholder-text-color:
205 * select-outline-info-background-color:
206 * select-outline-info-border-color:
207 * select-outline-info-focus-background-color:
208 * select-outline-info-focus-border-color:
209 * select-outline-info-hover-background-color:
210 * select-outline-info-hover-border-color:
211 * select-outline-info-disabled-background-color:
212 * select-outline-info-disabled-border-color:
213 * select-outline-info-disabled-icon-color:
214 * select-outline-info-disabled-text-color:
215 * select-outline-warning-icon-color:
216 * select-outline-warning-text-color:
217 * select-outline-warning-placeholder-text-color:
218 * select-outline-warning-background-color:
219 * select-outline-warning-border-color:
220 * select-outline-warning-focus-background-color:
221 * select-outline-warning-focus-border-color:
222 * select-outline-warning-hover-background-color:
223 * select-outline-warning-hover-border-color:
224 * select-outline-warning-disabled-background-color:
225 * select-outline-warning-disabled-border-color:
226 * select-outline-warning-disabled-icon-color:
227 * select-outline-warning-disabled-text-color:
228 * select-outline-danger-icon-color:
229 * select-outline-danger-text-color:
230 * select-outline-danger-placeholder-text-color:
231 * select-outline-danger-background-color:
232 * select-outline-danger-border-color:
233 * select-outline-danger-focus-background-color:
234 * select-outline-danger-focus-border-color:
235 * select-outline-danger-hover-background-color:
236 * select-outline-danger-hover-border-color:
237 * select-outline-danger-disabled-background-color:
238 * select-outline-danger-disabled-border-color:
239 * select-outline-danger-disabled-icon-color:
240 * select-outline-danger-disabled-text-color:
241 * select-outline-control-icon-color:
242 * select-outline-control-text-color:
243 * select-outline-control-placeholder-text-color:
244 * select-outline-control-background-color:
245 * select-outline-control-border-color:
246 * select-outline-control-focus-background-color:
247 * select-outline-control-focus-border-color:
248 * select-outline-control-hover-background-color:
249 * select-outline-control-hover-border-color:
250 * select-outline-control-disabled-background-color:
251 * select-outline-control-disabled-border-color:
252 * select-outline-control-disabled-icon-color:
253 * select-outline-control-disabled-text-color:
254 * select-outline-adjacent-border-style:
255 * select-outline-adjacent-border-width:
256 * select-outline-basic-open-border-color:
257 * select-outline-basic-adjacent-border-color:
258 * select-outline-primary-open-border-color:
259 * select-outline-primary-adjacent-border-color:
260 * select-outline-success-open-border-color:
261 * select-outline-success-adjacent-border-color:
262 * select-outline-info-open-border-color:
263 * select-outline-info-adjacent-border-color:
264 * select-outline-warning-open-border-color:
265 * select-outline-warning-adjacent-border-color:
266 * select-outline-danger-open-border-color:
267 * select-outline-danger-adjacent-border-color:
268 * select-outline-control-open-border-color:
269 * select-outline-control-adjacent-border-color:
270 * select-filled-border-style:
271 * select-filled-border-width:
272 * select-filled-tiny-padding:
273 * select-filled-small-padding:
274 * select-filled-medium-padding:
275 * select-filled-large-padding:
276 * select-filled-giant-padding:
277 * select-filled-basic-background-color:
278 * select-filled-basic-border-color:
279 * select-filled-basic-icon-color:
280 * select-filled-basic-text-color:
281 * select-filled-basic-placeholder-text-color:
282 * select-filled-basic-focus-background-color:
283 * select-filled-basic-focus-border-color:
284 * select-filled-basic-hover-background-color:
285 * select-filled-basic-hover-border-color:
286 * select-filled-basic-disabled-background-color:
287 * select-filled-basic-disabled-border-color:
288 * select-filled-basic-disabled-icon-color:
289 * select-filled-basic-disabled-text-color:
290 * select-filled-primary-background-color:
291 * select-filled-primary-border-color:
292 * select-filled-primary-icon-color:
293 * select-filled-primary-text-color:
294 * select-filled-primary-placeholder-text-color:
295 * select-filled-primary-focus-background-color:
296 * select-filled-primary-focus-border-color:
297 * select-filled-primary-hover-background-color:
298 * select-filled-primary-hover-border-color:
299 * select-filled-primary-disabled-background-color:
300 * select-filled-primary-disabled-border-color:
301 * select-filled-primary-disabled-icon-color:
302 * select-filled-primary-disabled-text-color:
303 * select-filled-success-background-color:
304 * select-filled-success-border-color:
305 * select-filled-success-icon-color:
306 * select-filled-success-text-color:
307 * select-filled-success-placeholder-text-color:
308 * select-filled-success-focus-background-color:
309 * select-filled-success-focus-border-color:
310 * select-filled-success-hover-background-color:
311 * select-filled-success-hover-border-color:
312 * select-filled-success-disabled-background-color:
313 * select-filled-success-disabled-border-color:
314 * select-filled-success-disabled-icon-color:
315 * select-filled-success-disabled-text-color:
316 * select-filled-info-background-color:
317 * select-filled-info-border-color:
318 * select-filled-info-icon-color:
319 * select-filled-info-text-color:
320 * select-filled-info-placeholder-text-color:
321 * select-filled-info-focus-background-color:
322 * select-filled-info-focus-border-color:
323 * select-filled-info-hover-background-color:
324 * select-filled-info-hover-border-color:
325 * select-filled-info-disabled-background-color:
326 * select-filled-info-disabled-border-color:
327 * select-filled-info-disabled-icon-color:
328 * select-filled-info-disabled-text-color:
329 * select-filled-warning-background-color:
330 * select-filled-warning-border-color:
331 * select-filled-warning-icon-color:
332 * select-filled-warning-text-color:
333 * select-filled-warning-placeholder-text-color:
334 * select-filled-warning-focus-background-color:
335 * select-filled-warning-focus-border-color:
336 * select-filled-warning-hover-background-color:
337 * select-filled-warning-hover-border-color:
338 * select-filled-warning-disabled-background-color:
339 * select-filled-warning-disabled-border-color:
340 * select-filled-warning-disabled-icon-color:
341 * select-filled-warning-disabled-text-color:
342 * select-filled-danger-background-color:
343 * select-filled-danger-border-color:
344 * select-filled-danger-icon-color:
345 * select-filled-danger-text-color:
346 * select-filled-danger-placeholder-text-color:
347 * select-filled-danger-focus-background-color:
348 * select-filled-danger-focus-border-color:
349 * select-filled-danger-hover-background-color:
350 * select-filled-danger-hover-border-color:
351 * select-filled-danger-disabled-background-color:
352 * select-filled-danger-disabled-border-color:
353 * select-filled-danger-disabled-icon-color:
354 * select-filled-danger-disabled-text-color:
355 * select-filled-control-background-color:
356 * select-filled-control-border-color:
357 * select-filled-control-icon-color:
358 * select-filled-control-text-color:
359 * select-filled-control-placeholder-text-color:
360 * select-filled-control-focus-background-color:
361 * select-filled-control-focus-border-color:
362 * select-filled-control-hover-background-color:
363 * select-filled-control-hover-border-color:
364 * select-filled-control-disabled-background-color:
365 * select-filled-control-disabled-border-color:
366 * select-filled-control-disabled-icon-color:
367 * select-filled-control-disabled-text-color:
368 * select-hero-tiny-padding:
369 * select-hero-small-padding:
370 * select-hero-medium-padding:
371 * select-hero-large-padding:
372 * select-hero-giant-padding:
373 * select-hero-basic-left-background-color:
374 * select-hero-basic-right-background-color:
375 * select-hero-basic-icon-color:
376 * select-hero-basic-text-color:
377 * select-hero-basic-placeholder-text-color:
378 * select-hero-basic-focus-left-background-color:
379 * select-hero-basic-focus-right-background-color:
380 * select-hero-basic-hover-left-background-color:
381 * select-hero-basic-hover-right-background-color:
382 * select-hero-basic-disabled-background-color:
383 * select-hero-basic-disabled-icon-color:
384 * select-hero-basic-disabled-text-color:
385 * select-hero-primary-left-background-color:
386 * select-hero-primary-right-background-color:
387 * select-hero-primary-icon-color:
388 * select-hero-primary-text-color:
389 * select-hero-primary-placeholder-text-color:
390 * select-hero-primary-focus-left-background-color:
391 * select-hero-primary-focus-right-background-color:
392 * select-hero-primary-hover-left-background-color:
393 * select-hero-primary-hover-right-background-color:
394 * select-hero-primary-disabled-background-color:
395 * select-hero-primary-disabled-icon-color:
396 * select-hero-primary-disabled-text-color:
397 * select-hero-success-left-background-color:
398 * select-hero-success-right-background-color:
399 * select-hero-success-icon-color:
400 * select-hero-success-text-color:
401 * select-hero-success-placeholder-text-color:
402 * select-hero-success-focus-left-background-color:
403 * select-hero-success-focus-right-background-color:
404 * select-hero-success-hover-left-background-color:
405 * select-hero-success-hover-right-background-color:
406 * select-hero-success-disabled-background-color:
407 * select-hero-success-disabled-icon-color:
408 * select-hero-success-disabled-text-color:
409 * select-hero-info-left-background-color:
410 * select-hero-info-right-background-color:
411 * select-hero-info-icon-color:
412 * select-hero-info-text-color:
413 * select-hero-info-placeholder-text-color:
414 * select-hero-info-focus-left-background-color:
415 * select-hero-info-focus-right-background-color:
416 * select-hero-info-hover-left-background-color:
417 * select-hero-info-hover-right-background-color:
418 * select-hero-info-disabled-background-color:
419 * select-hero-info-disabled-icon-color:
420 * select-hero-info-disabled-text-color:
421 * select-hero-warning-left-background-color:
422 * select-hero-warning-right-background-color:
423 * select-hero-warning-icon-color:
424 * select-hero-warning-text-color:
425 * select-hero-warning-placeholder-text-color:
426 * select-hero-warning-focus-left-background-color:
427 * select-hero-warning-focus-right-background-color:
428 * select-hero-warning-hover-left-background-color:
429 * select-hero-warning-hover-right-background-color:
430 * select-hero-warning-disabled-background-color:
431 * select-hero-warning-disabled-icon-color:
432 * select-hero-warning-disabled-text-color:
433 * select-hero-danger-left-background-color:
434 * select-hero-danger-right-background-color:
435 * select-hero-danger-icon-color:
436 * select-hero-danger-text-color:
437 * select-hero-danger-placeholder-text-color:
438 * select-hero-danger-focus-left-background-color:
439 * select-hero-danger-focus-right-background-color:
440 * select-hero-danger-hover-left-background-color:
441 * select-hero-danger-hover-right-background-color:
442 * select-hero-danger-disabled-background-color:
443 * select-hero-danger-disabled-icon-color:
444 * select-hero-danger-disabled-text-color:
445 * select-hero-control-left-background-color:
446 * select-hero-control-right-background-color:
447 * select-hero-control-icon-color:
448 * select-hero-control-text-color:
449 * select-hero-control-placeholder-text-color:
450 * select-hero-control-focus-left-background-color:
451 * select-hero-control-focus-right-background-color:
452 * select-hero-control-hover-left-background-color:
453 * select-hero-control-hover-right-background-color:
454 * select-hero-control-disabled-background-color:
455 * select-hero-control-disabled-icon-color:
456 * select-hero-control-disabled-text-color:
457 * */
458export declare class NbSelectComponent implements OnChanges, AfterViewInit, AfterContentInit, OnDestroy, ControlValueAccessor, NbFormFieldControl {
459 protected document: any;
460 protected overlay: NbOverlayService;
461 protected hostRef: ElementRef<HTMLElement>;
462 protected positionBuilder: NbPositionBuilderService;
463 protected triggerStrategyBuilder: NbTriggerStrategyBuilderService;
464 protected cd: ChangeDetectorRef;
465 protected focusKeyManagerFactoryService: NbFocusKeyManagerFactoryService<NbOptionComponent>;
466 protected focusMonitor: NbFocusMonitor;
467 protected renderer: Renderer2;
468 protected zone: NgZone;
469 protected statusService: NbStatusService;
470 /**
471 * Select size, available sizes:
472 * `tiny`, `small`, `medium` (default), `large`, `giant`
473 */
474 size: NbComponentSize;
475 /**
476 * Select status (adds specific styles):
477 * `basic`, `primary`, `info`, `success`, `warning`, `danger`, `control`
478 */
479 status: NbComponentOrCustomStatus;
480 /**
481 * Select shapes: `rectangle` (default), `round`, `semi-round`
482 */
483 shape: NbComponentShape;
484 /**
485 * Select appearances: `outline` (default), `filled`, `hero`
486 */
487 appearance: NbSelectAppearance;
488 /**
489 * Specifies class to be set on `nb-option`s container (`nb-option-list`)
490 * */
491 optionsListClass: NgClass['ngClass'];
492 /**
493 * Specifies class for the overlay panel with options
494 * */
495 optionsPanelClass: string | string[];
496 /**
497 * Specifies width (in pixels) to be set on `nb-option`s container (`nb-option-list`)
498 * */
499 get optionsWidth(): number;
500 set optionsWidth(value: number);
501 protected _optionsWidth: number | undefined;
502 /**
503 * Adds `outline` styles
504 */
505 get outline(): boolean;
506 set outline(value: boolean);
507 static ngAcceptInputType_outline: NbBooleanInput;
508 /**
509 * Adds `filled` styles
510 */
511 get filled(): boolean;
512 set filled(value: boolean);
513 static ngAcceptInputType_filled: NbBooleanInput;
514 /**
515 * Adds `hero` styles
516 */
517 get hero(): boolean;
518 set hero(value: boolean);
519 static ngAcceptInputType_hero: NbBooleanInput;
520 /**
521 * Disables the select
522 */
523 get disabled(): boolean;
524 set disabled(value: boolean);
525 protected _disabled: boolean;
526 static ngAcceptInputType_disabled: NbBooleanInput;
527 /**
528 * If set element will fill its container
529 */
530 get fullWidth(): boolean;
531 set fullWidth(value: boolean);
532 protected _fullWidth: boolean;
533 static ngAcceptInputType_fullWidth: NbBooleanInput;
534 /**
535 * Renders select placeholder if nothing selected.
536 * */
537 placeholder: string;
538 /**
539 * A function to compare option value with selected value.
540 * By default, values are compared with strict equality (`===`).
541 */
542 get compareWith(): NbSelectCompareFunction;
543 set compareWith(fn: NbSelectCompareFunction);
544 protected _compareWith: NbSelectCompareFunction;
545 /**
546 * Accepts selected item or array of selected items.
547 * */
548 set selected(value: any);
549 get selected(): any;
550 /**
551 * Gives capability just write `multiple` over the element.
552 * */
553 get multiple(): boolean;
554 set multiple(value: boolean);
555 protected _multiple: boolean;
556 static ngAcceptInputType_multiple: NbBooleanInput;
557 /**
558 * Determines options overlay offset (in pixels).
559 **/
560 optionsOverlayOffset: number;
561 /**
562 * Determines options overlay scroll strategy.
563 **/
564 scrollStrategy: NbScrollStrategies;
565 get additionalClasses(): string[];
566 /**
567 * Will be emitted when selected value changes.
568 * */
569 selectedChange: EventEmitter<any>;
570 /**
571 * List of `NbOptionComponent`'s components passed as content.
572 * TODO maybe it would be better provide wrapper
573 * */
574 options: QueryList<NbOptionComponent>;
575 /**
576 * Custom select label, will be rendered instead of default enumeration with coma.
577 * */
578 customLabel: any;
579 /**
580 * NbCard with options content.
581 * */
582 portal: NbPortalDirective;
583 button: ElementRef<HTMLButtonElement>;
584 /**
585 * Determines is select opened.
586 * */
587 get isOpen(): boolean;
588 /**
589 * List of selected options.
590 * */
591 selectionModel: NbOptionComponent[];
592 positionStrategy: NbAdjustableConnectedPositionStrategy;
593 /**
594 * Current overlay position because of we have to toggle overlayPosition
595 * in [ngClass] direction and this directive can use only string.
596 */
597 overlayPosition: NbPosition;
598 protected ref: NbOverlayRef;
599 protected triggerStrategy: NbTriggerStrategy;
600 protected alive: boolean;
601 protected destroy$: Subject<void>;
602 protected keyManager: NbFocusKeyManager<NbOptionComponent>;
603 /**
604 * If a user assigns value before content nb-options's rendered the value will be putted in this variable.
605 * And then applied after content rendered.
606 * Only the last value will be applied.
607 * */
608 protected queue: any;
609 /**
610 * Function passed through control value accessor to propagate changes.
611 * */
612 protected onChange: Function;
613 protected onTouched: Function;
614 status$: BehaviorSubject<string>;
615 size$: BehaviorSubject<NbComponentSize>;
616 focused$: BehaviorSubject<boolean>;
617 disabled$: BehaviorSubject<boolean>;
618 fullWidth$: BehaviorSubject<boolean>;
619 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);
620 /**
621 * Determines is select hidden.
622 * */
623 get isHidden(): boolean;
624 /**
625 * Returns width of the select button.
626 * */
627 get hostWidth(): number;
628 get selectButtonClasses(): string[];
629 /**
630 * Content rendered in the label.
631 * */
632 get selectionView(): any;
633 ngOnChanges({ disabled, status, size, fullWidth }: SimpleChanges): void;
634 ngAfterContentInit(): void;
635 ngAfterViewInit(): void;
636 ngOnDestroy(): void;
637 show(): void;
638 hide(): void;
639 registerOnChange(fn: any): void;
640 registerOnTouched(fn: any): void;
641 setDisabledState(isDisabled: boolean): void;
642 writeValue(value: any): void;
643 /**
644 * Selects option or clear all selected options if value is null.
645 * */
646 protected handleOptionClick(option: NbOptionComponent): void;
647 /**
648 * Deselect all selected options.
649 * */
650 protected reset(): void;
651 /**
652 * Determines how to select option as multiple or single.
653 * */
654 protected selectOption(option: NbOptionComponent): void;
655 /**
656 * Select single option.
657 * */
658 protected handleSingleSelect(option: NbOptionComponent): void;
659 /**
660 * Select for multiple options.
661 * */
662 protected handleMultipleSelect(option: NbOptionComponent): void;
663 protected attachToOverlay(): void;
664 protected setActiveOption(): void;
665 protected createOverlay(): void;
666 protected createKeyManager(): void;
667 protected createPositionStrategy(): NbAdjustableConnectedPositionStrategy;
668 protected createScrollStrategy(): NbScrollStrategy;
669 protected createTriggerStrategy(): NbTriggerStrategy;
670 protected subscribeOnTriggers(): void;
671 protected subscribeOnPositionChange(): void;
672 protected subscribeOnOptionClick(): void;
673 protected subscribeOnOverlayKeys(): void;
674 protected subscribeOnButtonFocus(): void;
675 protected getContainer(): ComponentRef<any>;
676 /**
677 * Propagate selected value.
678 * */
679 protected emitSelected(selected: any): void;
680 /**
681 * Set selected value in model.
682 * */
683 protected setSelection(value: any): void;
684 /**
685 * Selects value.
686 * */
687 protected selectValue(value: any): void;
688 protected shouldShow(): boolean;
689 /**
690 * Sets touched if focus moved outside of button and overlay,
691 * ignoring the case when focus moved to options overlay.
692 */
693 trySetTouched(): void;
694 protected isClickedWithinComponent($event: Event): boolean;
695 protected canSelectValue(): boolean;
696 get tiny(): boolean;
697 get small(): boolean;
698 get medium(): boolean;
699 get large(): boolean;
700 get giant(): boolean;
701 get primary(): boolean;
702 get info(): boolean;
703 get success(): boolean;
704 get warning(): boolean;
705 get danger(): boolean;
706 get basic(): boolean;
707 get control(): boolean;
708 get rectangle(): boolean;
709 get round(): boolean;
710 get semiRound(): boolean;
711 static ɵfac: i0.ɵɵFactoryDeclaration<NbSelectComponent, never>;
712 static ɵcmp: i0.ɵɵComponentDeclaration<NbSelectComponent, "nb-select", 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; }; }, { "selectedChange": "selectedChange"; }, ["customLabel", "options"], ["nb-select-label", "nb-option, nb-option-group"], false, never>;
713}