/** * @license * Copyright Akveo. All Rights Reserved. * Licensed under the MIT License. See License.txt in the project root for license information. */ import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, NgZone, OnDestroy, Renderer2 } from '@angular/core'; import { Observable } from 'rxjs'; import { NbStatusService } from '../../services/status.service'; import { NbHighlightableOption } from '../cdk/a11y/descendant-key-manager'; import { NbBooleanInput } from '../helpers'; import { NbComponentOrCustomStatus } from '../component-status'; import { NbComponentSize } from '../component-size'; import * as i0 from "@angular/core"; export type NbTagAppearance = 'filled' | 'outline'; export interface NbTagSelectionChange { tag: NbTagComponent; selected: boolean; } /** * * To show a cross on a tag and enable `remove` event add the `removable` attribute. * @stacked-example(Removable tags, tag/tag-removable.component) * * You can change appearance via `appearance` input: * @stacked-example(Tag Appearance, tag/tag-appearance.component) * * You can change status via `status` input: * @stacked-example(Tag Status, tag/tag-status.component) * * @styles * * tag-text-font-family: * tag-text-transform: * tag-border-width: * tag-border-style: * tag-border-radius: * tag-tiny-text-font-size: * tag-tiny-text-font-weight: * tag-tiny-text-line-height: * tag-tiny-padding: * tag-tiny-close-offset: * tag-small-text-font-size: * tag-small-text-font-weight: * tag-small-text-line-height: * tag-small-padding: * tag-small-close-offset: * tag-medium-text-font-size: * tag-medium-text-font-weight: * tag-medium-text-line-height: * tag-medium-padding: * tag-medium-close-offset: * tag-large-text-font-size: * tag-large-text-font-weight: * tag-large-text-line-height: * tag-large-padding: * tag-large-close-offset: * tag-giant-text-font-size: * tag-giant-text-font-weight: * tag-giant-text-line-height: * tag-giant-padding: * tag-giant-close-offset: * tag-filled-basic-background-color: * tag-filled-basic-border-color: * tag-filled-basic-text-color: * tag-filled-basic-active-background-color: * tag-filled-basic-active-border-color: * tag-filled-basic-hover-background-color: * tag-filled-basic-hover-border-color: * tag-filled-basic-selected-background-color: * tag-filled-basic-selected-border-color: * tag-filled-primary-background-color: * tag-filled-primary-border-color: * tag-filled-primary-text-color: * tag-filled-primary-active-background-color: * tag-filled-primary-active-border-color: * tag-filled-primary-hover-background-color: * tag-filled-primary-hover-border-color: * tag-filled-primary-selected-background-color: * tag-filled-primary-selected-border-color: * tag-filled-success-background-color: * tag-filled-success-border-color: * tag-filled-success-text-color: * tag-filled-success-active-background-color: * tag-filled-success-active-border-color: * tag-filled-success-hover-background-color: * tag-filled-success-hover-border-color: * tag-filled-success-selected-background-color: * tag-filled-success-selected-border-color: * tag-filled-info-background-color: * tag-filled-info-border-color: * tag-filled-info-text-color: * tag-filled-info-active-background-color: * tag-filled-info-active-border-color: * tag-filled-info-hover-background-color: * tag-filled-info-hover-border-color: * tag-filled-info-selected-background-color: * tag-filled-info-selected-border-color: * tag-filled-warning-background-color: * tag-filled-warning-border-color: * tag-filled-warning-text-color: * tag-filled-warning-active-background-color: * tag-filled-warning-active-border-color: * tag-filled-warning-hover-background-color: * tag-filled-warning-hover-border-color: * tag-filled-warning-selected-background-color: * tag-filled-warning-selected-border-color: * tag-filled-danger-background-color: * tag-filled-danger-border-color: * tag-filled-danger-text-color: * tag-filled-danger-active-background-color: * tag-filled-danger-active-border-color: * tag-filled-danger-hover-background-color: * tag-filled-danger-hover-border-color: * tag-filled-danger-selected-background-color: * tag-filled-danger-selected-border-color: * tag-filled-control-background-color: * tag-filled-control-border-color: * tag-filled-control-text-color: * tag-filled-control-active-background-color: * tag-filled-control-active-border-color: * tag-filled-control-hover-background-color: * tag-filled-control-hover-border-color: * tag-filled-control-selected-background-color: * tag-filled-control-selected-border-color: * tag-outline-basic-background-color: * tag-outline-basic-border-color: * tag-outline-basic-text-color: * tag-outline-basic-active-background-color: * tag-outline-basic-active-border-color: * tag-outline-basic-active-text-color: * tag-outline-basic-hover-background-color: * tag-outline-basic-hover-border-color: * tag-outline-basic-hover-text-color: * tag-outline-basic-selected-background-color: * tag-outline-basic-selected-border-color: * tag-outline-basic-selected-text-color: * tag-outline-primary-background-color: * tag-outline-primary-border-color: * tag-outline-primary-text-color: * tag-outline-primary-active-background-color: * tag-outline-primary-active-border-color: * tag-outline-primary-active-text-color: * tag-outline-primary-hover-background-color: * tag-outline-primary-hover-border-color: * tag-outline-primary-hover-text-color: * tag-outline-primary-selected-background-color: * tag-outline-primary-selected-border-color: * tag-outline-primary-selected-text-color: * tag-outline-success-background-color: * tag-outline-success-border-color: * tag-outline-success-text-color: * tag-outline-success-active-background-color: * tag-outline-success-active-border-color: * tag-outline-success-active-text-color: * tag-outline-success-hover-background-color: * tag-outline-success-hover-border-color: * tag-outline-success-hover-text-color: * tag-outline-success-selected-background-color: * tag-outline-success-selected-border-color: * tag-outline-success-selected-text-color: * tag-outline-info-background-color: * tag-outline-info-border-color: * tag-outline-info-text-color: * tag-outline-info-active-background-color: * tag-outline-info-active-border-color: * tag-outline-info-active-text-color: * tag-outline-info-hover-background-color: * tag-outline-info-hover-border-color: * tag-outline-info-hover-text-color: * tag-outline-info-selected-background-color: * tag-outline-info-selected-border-color: * tag-outline-info-selected-text-color: * tag-outline-warning-background-color: * tag-outline-warning-border-color: * tag-outline-warning-text-color: * tag-outline-warning-active-background-color: * tag-outline-warning-active-border-color: * tag-outline-warning-active-text-color: * tag-outline-warning-hover-background-color: * tag-outline-warning-hover-border-color: * tag-outline-warning-hover-text-color: * tag-outline-warning-selected-background-color: * tag-outline-warning-selected-border-color: * tag-outline-warning-selected-text-color: * tag-outline-danger-background-color: * tag-outline-danger-border-color: * tag-outline-danger-text-color: * tag-outline-danger-active-background-color: * tag-outline-danger-active-border-color: * tag-outline-danger-active-text-color: * tag-outline-danger-hover-background-color: * tag-outline-danger-hover-border-color: * tag-outline-danger-hover-text-color: * tag-outline-danger-selected-background-color: * tag-outline-danger-selected-border-color: * tag-outline-danger-selected-text-color: * tag-outline-control-background-color: * tag-outline-control-border-color: * tag-outline-control-text-color: * tag-outline-control-active-background-color: * tag-outline-control-active-border-color: * tag-outline-control-active-text-color: * tag-outline-control-hover-background-color: * tag-outline-control-hover-border-color: * tag-outline-control-hover-text-color: * tag-outline-control-selected-background-color: * tag-outline-control-selected-border-color: * tag-outline-control-selected-text-color: */ export declare class NbTagComponent implements AfterViewInit, OnDestroy, NbHighlightableOption { _hostElement: ElementRef; protected cd: ChangeDetectorRef; protected renderer: Renderer2; protected zone: NgZone; protected statusService: NbStatusService; private _destroy$; get destroy$(): Observable; /** * Tag text. */ text: string; get selected(): boolean; set selected(value: boolean); protected _selected: boolean; static ngAcceptInputType_selected: NbBooleanInput; /** * Controls whether the user can remove a tag or not. */ get removable(): boolean; set removable(value: boolean); protected _removable: boolean; static ngAcceptInputType_removable: NbBooleanInput; /** * Tag appearance: `filled`, `outline`. */ appearance: NbTagAppearance; /** * Tag status: `basic`, `primary`, `info`, `success`, `warning`, `danger`, `control`. */ status: NbComponentOrCustomStatus; /** * Tag size: `tiny`, `small`, `medium`, `large`, `giant`. */ size: NbComponentSize; role: string; /** * Emits when the user removes the tag * (whether by clicking on the remove button or by pressing `delete` or `backspace` key). */ readonly remove: EventEmitter; readonly selectedChange: EventEmitter; _isActive: boolean; _id: string; get filled(): boolean; set filled(value: boolean); get outline(): boolean; set outline(value: boolean); get basic(): boolean; get primary(): boolean; get success(): boolean; get info(): boolean; get warning(): boolean; get danger(): boolean; get control(): boolean; get tiny(): boolean; get small(): boolean; get medium(): boolean; get large(): boolean; get giant(): boolean; get additionalClasses(): string[]; _remove(): void; constructor(_hostElement: ElementRef, cd: ChangeDetectorRef, renderer: Renderer2, zone: NgZone, statusService: NbStatusService); ngAfterViewInit(): void; ngOnDestroy(): void; _toggleSelection(): void; setActiveStyles(): void; setInactiveStyles(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; }