@testgorilla/tgo-ui 1.0.14 → 1.1.0

package/components/avatar/avatar.component.d.ts

@@ -0,0 +1,48 @@
+import { EventEmitter } from '@angular/core';
+import { AvatarSize } from './avatar.model';
+import * as i0 from "@angular/core";
+export declare class AvatarComponent {
+    /**
+     * Input property for specifying the size of the avatar.
+     * @type {AvatarSize}
+     * @default AvatarSize.SMALL
+     * @memberof AvatarComponent
+     */
+    size: AvatarSize;
+    /**
+     * Input property for specifying the URL of the image to display in the avatar.
+     * @type {string}
+     * @memberof AvatarComponent
+     */
+    imageUrl: string;
+    /**
+     * Input property for specifying the initials to display in the avatar.
+     * @type {string}
+     * @memberof AvatarComponent
+     */
+    name: string;
+    /**
+     * Input property for specifying the tooltip text for edit.
+     * @type {string}
+     * @memberof AvatarComponent
+     */
+    tooltipText: string;
+    /**
+     * Input property that makes avatar clickable.
+     * @type {boolean}
+     * @memberof AvatarComponent
+     */
+    allowClick: boolean;
+    /**
+     * Event emitted when the avatar is clicked.
+     * @type {void}
+     * @memberof AvatarComponent
+     */
+    avatarClick: EventEmitter<void>;
+    protected iconSize: Record<string, import("@testgorilla/tgo-ui").IconSize>;
+    protected avatarSize: typeof AvatarSize;
+    protected onAvatarClick(): void;
+    get clickAllowance(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AvatarComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AvatarComponent, "ui-avatar", never, { "size": "size"; "imageUrl": "imageUrl"; "name": "name"; "tooltipText": "tooltipText"; "allowClick": "allowClick"; }, { "avatarClick": "avatarClick"; }, never, never, false, never>;
+}

package/components/avatar/avatar.component.module.d.ts

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./avatar.component";
+import * as i2 from "../../pipes/name-initials.pipe";
+import * as i3 from "@angular/common";
+import * as i4 from "../icon/icon.component.module";
+import * as i5 from "@angular/material/tooltip";
+export declare class AvatarComponentModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<AvatarComponentModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AvatarComponentModule, [typeof i1.AvatarComponent, typeof i2.NameInitialsPipe], [typeof i3.CommonModule, typeof i4.IconComponentModule, typeof i5.MatTooltipModule], [typeof i1.AvatarComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<AvatarComponentModule>;
+}

package/components/avatar/avatar.model.d.ts

@@ -0,0 +1,7 @@
+import { IconSize } from '../icon/icon.model';
+export declare enum AvatarSize {
+    SMALL = "small",
+    MEDIUM = "medium",
+    LARGE = "large"
+}
+export declare const iconSize: Record<string, IconSize>;

package/components/icon/icon.model.d.ts

@@ -1,4 +1,4 @@
-import { tgoIcons } from '../../components/icon/icon.config';
-export type IconSize = '16' | '24';
+import { tgoIcons } from './icon.config';
+export type IconSize = '16' | '24' | '80';
 export type IconName = typeof tgoIcons[number] | '';
 export type IconColor = 'teal' | 'petrol' | 'dark' | 'white' | 'black' | 'inherit';

package/components/tag/tag.component.d.ts

@@ -1,20 +1,97 @@
-import { TagColor } from '../../components/tag/tag.model';
+import { AfterViewInit, ElementRef, EventEmitter } from '@angular/core';
+import { IconName } from '../icon/icon.model';
 import * as i0 from "@angular/core";
-export declare class TagComponent {
+export declare class TagComponent implements AfterViewInit {
     /**
-     * Tag's text
+     * Tag's label
      *
      * @memberof TagComponent
      */
-    text: string;
+    set label(value: string);
     /**
-     * Color
+     * Icon
      *
-     * @type {TagColor}
+     * @type {string}
      * @memberof TagComponent
      */
-    color: TagColor;
-    constructor();
+    icon: IconName;
+    /**
+     * Whether to allow the tag to be closed.
+     *
+     * @type {boolean}
+     * @default false
+     * @memberof TagComponent
+     */
+    allowClose: boolean;
+    /**
+     * Whether the tag is in read-only mode.
+     *
+     * @type {boolean}
+     * @default false
+     * @memberof TagComponent
+     */
+    readOnly: boolean;
+    /**
+     * Whether the tag is selected.
+     *
+     * @type {boolean}
+     * @default false
+     * @memberof TagComponent
+     */
+    isSelected: boolean;
+    /**
+     * Display icon when is selected
+     *
+     * @type {boolean}
+     * @default false
+     * @memberof TagComponent
+     */
+    showIconWhenSelected: boolean;
+    /**
+     * Specifies whether the element is disabled.
+     *
+     * @type {boolean}
+     * @default false
+     * @memberof TagComponent
+     */
+    isDisabled: boolean;
+    /**
+     * Event triggered when the tag should be closed.
+     *
+     * @event
+     * @memberof TagComponent
+     */
+    close: EventEmitter<void>;
+    /**
+     * Event triggered when a press action occurs.
+     *
+     * @event
+     * @memberof TagComponent
+     */
+    press: EventEmitter<boolean>;
+    /**
+     * Subject that needs to be triggered when Label input changes, to check if it's truncated
+     * @private
+     * @type {void}
+     * @memberof TagComponent
+     */
+    private checkLabelEllipsis$;
+    /**
+     * Observable that indicates if the Label is truncated
+     * debounceTime is used to wait for view to be initialized after receiving a new Label input
+     * @protected
+     * @type {boolean}
+     * @memberof TagComponent
+     */
+    protected isEllipseActiveObs$: import("rxjs").Observable<boolean>;
+    protected labelText: string;
+    labelElement: ElementRef<HTMLElement>;
+    ngAfterViewInit(): void;
+    onPress(): void;
+    onClose(): void;
+    private isLabelEllipseActive;
+    get tabIndex(): number;
+    get filled(): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<TagComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TagComponent, "ui-tag", never, { "text": "text"; "color": "color"; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TagComponent, "ui-tag", never, { "label": "label"; "icon": "icon"; "allowClose": "allowClose"; "readOnly": "readOnly"; "isSelected": "isSelected"; "showIconWhenSelected": "showIconWhenSelected"; "isDisabled": "isDisabled"; }, { "close": "close"; "press": "press"; }, never, never, false, never>;
 }

package/components/tag/tag.component.module.d.ts

@@ -1,8 +1,11 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./tag.component";
 import * as i2 from "@angular/common";
+import * as i3 from "../icon/icon.component.module";
+import * as i4 from "../tooltip/tooltip.component.module";
+import * as i5 from "@angular/material/tooltip";
 export declare class TagComponentModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<TagComponentModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<TagComponentModule, [typeof i1.TagComponent], [typeof i2.CommonModule], [typeof i1.TagComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<TagComponentModule, [typeof i1.TagComponent], [typeof i2.CommonModule, typeof i3.IconComponentModule, typeof i4.TooltipComponentModule, typeof i5.MatTooltipModule], [typeof i1.TagComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<TagComponentModule>;
 }

package/components/toggle/toggle.component.d.ts

@@ -0,0 +1,38 @@
+import { EventEmitter } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import { RegisterFn } from './toggle.model';
+import * as i0 from "@angular/core";
+export declare class ToggleComponent implements ControlValueAccessor {
+    /**
+     * The `selected` property determines the current state of the toggle switch.
+     *
+     * @type {boolean}
+     * @default false
+     * @memberof ToggleComponent
+     */
+    selected: boolean;
+    /**
+     * The `disabled` property determines whether the toggle switch is disabled.
+     *
+     * @type {boolean}
+     * @default false
+     * @memberof ToggleComponent
+     */
+    disabled: boolean;
+    /**
+     * The `toggle` event is triggered when the state of the toggle switch changes. It returns the new state.
+     *
+     * @type {event}
+     * @memberof ToggleComponent
+     */
+    toggle: EventEmitter<boolean>;
+    onToggle(): void;
+    writeValue(state: boolean): void;
+    registerOnChange(fn: RegisterFn): void;
+    registerOnTouched(fn: RegisterFn): void;
+    setDisabledState(isDisabled: boolean): void;
+    private onChange;
+    private onTouched;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToggleComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToggleComponent, "ui-toggle", never, { "selected": "selected"; "disabled": "disabled"; }, { "toggle": "toggle"; }, never, never, false, never>;
+}

package/components/toggle/toggle.component.module.d.ts

@@ -0,0 +1,8 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./toggle.component";
+import * as i2 from "@angular/common";
+export declare class ToggleComponentModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToggleComponentModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ToggleComponentModule, [typeof i1.ToggleComponent], [typeof i2.CommonModule], never>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ToggleComponentModule>;
+}

package/components/toggle/toggle.model.d.ts

@@ -0,0 +1 @@
+export type RegisterFn = () => void;

package/esm2020/components/avatar/avatar.component.mjs

@@ -0,0 +1,74 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { AvatarSize, iconSize } from './avatar.model';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "../icon/icon.component";
+import * as i3 from "../../pipes/name-initials.pipe";
+export class AvatarComponent {
+    constructor() {
+        /**
+         * Input property for specifying the size of the avatar.
+         * @type {AvatarSize}
+         * @default AvatarSize.SMALL
+         * @memberof AvatarComponent
+         */
+        this.size = AvatarSize.SMALL;
+        /**
+         * Input property for specifying the URL of the image to display in the avatar.
+         * @type {string}
+         * @memberof AvatarComponent
+         */
+        this.imageUrl = '';
+        /**
+         * Input property for specifying the initials to display in the avatar.
+         * @type {string}
+         * @memberof AvatarComponent
+         */
+        this.name = '';
+        /**
+         * Input property for specifying the tooltip text for edit.
+         * @type {string}
+         * @memberof AvatarComponent
+         */
+        this.tooltipText = '';
+        /**
+         * Input property that makes avatar clickable.
+         * @type {boolean}
+         * @memberof AvatarComponent
+         */
+        this.allowClick = false;
+        /**
+         * Event emitted when the avatar is clicked.
+         * @type {void}
+         * @memberof AvatarComponent
+         */
+        this.avatarClick = new EventEmitter();
+        this.iconSize = iconSize;
+        this.avatarSize = AvatarSize;
+    }
+    onAvatarClick() {
+        this.avatarClick.emit();
+    }
+    get clickAllowance() {
+        return this.allowClick ? 'clickable' : 'non-clickable';
+    }
+}
+AvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+AvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: AvatarComponent, selector: "ui-avatar", inputs: { size: "size", imageUrl: "imageUrl", name: "name", tooltipText: "tooltipText", allowClick: "allowClick" }, outputs: { avatarClick: "avatarClick" }, ngImport: i0, template: "<div\n  class=\"avatar-container\"\n  [attr.type]=\"!imageUrl && !name ? 'icon' : 'initials'\"\n  [ngClass]=\"[size, clickAllowance]\"\n  (click)=\"onAvatarClick()\"\n>\n  <span *ngIf=\"name && !imageUrl\">\n    {{ name | nameInitials }}\n  </span>\n  <img *ngIf=\"imageUrl\" [attr.src]=\"imageUrl\" [alt]=\"'profile-image'\">\n  <ui-icon color=\"dark\" [size]=\"iconSize[size]\" *ngIf=\"!imageUrl && !name\" [name]=\"'User-profile'\"></ui-icon>\n</div>\n\n", styles: [":host .clickable{cursor:pointer}:host .non-clickable{pointer-events:none}:host .avatar-container{font-family:Open Sans,sans-serif;font-weight:400;display:flex;justify-content:center;align-items:center;border-radius:100%;background:#CBD6CB;position:relative;-webkit-user-select:none;user-select:none}:host .avatar-container[type=icon]{background:#E0E0E0}:host .avatar-container img{width:100%;height:100%;object-fit:cover;border-radius:100%}:host .avatar-container.small{width:24px;height:24px;font-size:10px}:host .avatar-container.medium{width:48px;height:48px;font-size:20px}:host .avatar-container.large{width:120px;height:120px;font-size:50px;letter-spacing:-2}:host .avatar-container .edit-avatar{display:flex;justify-content:center;align-items:center;position:absolute;right:0;bottom:0;background:#F6F6F6;width:32px;height:32px;border-radius:100%;cursor:pointer;-webkit-backdrop-filter:drop-shadow(0px 8px 24px 4px #000000,8%);backdrop-filter:drop-shadow(0px 8px 24px 4px #000000,8%)}:host .avatar-container .edit-avatar:hover{background:#EDEDED}:host .avatar-container .edit-avatar:active{background:#E0E0E0}:host .avatar-container .edit-avatar:focus{outline:1px dashed #888888;outline-offset:4px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }, { kind: "pipe", type: i3.NameInitialsPipe, name: "nameInitials" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ui-avatar', template: "<div\n  class=\"avatar-container\"\n  [attr.type]=\"!imageUrl && !name ? 'icon' : 'initials'\"\n  [ngClass]=\"[size, clickAllowance]\"\n  (click)=\"onAvatarClick()\"\n>\n  <span *ngIf=\"name && !imageUrl\">\n    {{ name | nameInitials }}\n  </span>\n  <img *ngIf=\"imageUrl\" [attr.src]=\"imageUrl\" [alt]=\"'profile-image'\">\n  <ui-icon color=\"dark\" [size]=\"iconSize[size]\" *ngIf=\"!imageUrl && !name\" [name]=\"'User-profile'\"></ui-icon>\n</div>\n\n", styles: [":host .clickable{cursor:pointer}:host .non-clickable{pointer-events:none}:host .avatar-container{font-family:Open Sans,sans-serif;font-weight:400;display:flex;justify-content:center;align-items:center;border-radius:100%;background:#CBD6CB;position:relative;-webkit-user-select:none;user-select:none}:host .avatar-container[type=icon]{background:#E0E0E0}:host .avatar-container img{width:100%;height:100%;object-fit:cover;border-radius:100%}:host .avatar-container.small{width:24px;height:24px;font-size:10px}:host .avatar-container.medium{width:48px;height:48px;font-size:20px}:host .avatar-container.large{width:120px;height:120px;font-size:50px;letter-spacing:-2}:host .avatar-container .edit-avatar{display:flex;justify-content:center;align-items:center;position:absolute;right:0;bottom:0;background:#F6F6F6;width:32px;height:32px;border-radius:100%;cursor:pointer;-webkit-backdrop-filter:drop-shadow(0px 8px 24px 4px #000000,8%);backdrop-filter:drop-shadow(0px 8px 24px 4px #000000,8%)}:host .avatar-container .edit-avatar:hover{background:#EDEDED}:host .avatar-container .edit-avatar:active{background:#E0E0E0}:host .avatar-container .edit-avatar:focus{outline:1px dashed #888888;outline-offset:4px}\n"] }]
+        }], propDecorators: { size: [{
+                type: Input
+            }], imageUrl: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], tooltipText: [{
+                type: Input
+            }], allowClick: [{
+                type: Input
+            }], avatarClick: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXZhdGFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL2F2YXRhci9hdmF0YXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvYXZhdGFyL2F2YXRhci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3ZFLE9BQU8sRUFBRSxVQUFVLEVBQUUsUUFBUSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7O0FBT3RELE1BQU0sT0FBTyxlQUFlO0lBTDVCO1FBTUU7Ozs7O1dBS0c7UUFDTSxTQUFJLEdBQUcsVUFBVSxDQUFDLEtBQUssQ0FBQztRQUNqQzs7OztXQUlHO1FBQ00sYUFBUSxHQUFHLEVBQUUsQ0FBQztRQUV2Qjs7OztXQUlHO1FBQ00sU0FBSSxHQUFHLEVBQUUsQ0FBQztRQUVuQjs7OztXQUlHO1FBQ00sZ0JBQVcsR0FBRyxFQUFFLENBQUM7UUFFMUI7Ozs7V0FJRztRQUNNLGVBQVUsR0FBRyxLQUFLLENBQUM7UUFFNUI7Ozs7V0FJRztRQUNPLGdCQUFXLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUV2QyxhQUFRLEdBQUcsUUFBUSxDQUFDO1FBQ3BCLGVBQVUsR0FBRyxVQUFVLENBQUM7S0FTbkM7SUFQVyxhQUFhO1FBQ3JCLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDMUIsQ0FBQztJQUVELElBQUksY0FBYztRQUNoQixPQUFPLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLFdBQVcsQ0FBQyxDQUFDLENBQUMsZUFBZSxDQUFDO0lBQ3pELENBQUM7OzRHQXBEVSxlQUFlO2dHQUFmLGVBQWUsOE1DUjVCLDJjQWFBOzJGRExhLGVBQWU7a0JBTDNCLFNBQVM7K0JBQ0UsV0FBVzs4QkFXWixJQUFJO3NCQUFaLEtBQUs7Z0JBTUcsUUFBUTtzQkFBaEIsS0FBSztnQkFPRyxJQUFJO3NCQUFaLEtBQUs7Z0JBT0csV0FBVztzQkFBbkIsS0FBSztnQkFPRyxVQUFVO3NCQUFsQixLQUFLO2dCQU9JLFdBQVc7c0JBQXBCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQXZhdGFyU2l6ZSwgaWNvblNpemUgfSBmcm9tICcuL2F2YXRhci5tb2RlbCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3VpLWF2YXRhcicsXG4gIHRlbXBsYXRlVXJsOiAnLi9hdmF0YXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9hdmF0YXIuY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgQXZhdGFyQ29tcG9uZW50IHtcbiAgLyoqXG4gICAqIElucHV0IHByb3BlcnR5IGZvciBzcGVjaWZ5aW5nIHRoZSBzaXplIG9mIHRoZSBhdmF0YXIuXG4gICAqIEB0eXBlIHtBdmF0YXJTaXplfVxuICAgKiBAZGVmYXVsdCBBdmF0YXJTaXplLlNNQUxMXG4gICAqIEBtZW1iZXJvZiBBdmF0YXJDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIHNpemUgPSBBdmF0YXJTaXplLlNNQUxMO1xuICAvKipcbiAgICogSW5wdXQgcHJvcGVydHkgZm9yIHNwZWNpZnlpbmcgdGhlIFVSTCBvZiB0aGUgaW1hZ2UgdG8gZGlzcGxheSBpbiB0aGUgYXZhdGFyLlxuICAgKiBAdHlwZSB7c3RyaW5nfVxuICAgKiBAbWVtYmVyb2YgQXZhdGFyQ29tcG9uZW50XG4gICAqL1xuICBASW5wdXQoKSBpbWFnZVVybCA9ICcnO1xuXG4gIC8qKlxuICAgKiBJbnB1dCBwcm9wZXJ0eSBmb3Igc3BlY2lmeWluZyB0aGUgaW5pdGlhbHMgdG8gZGlzcGxheSBpbiB0aGUgYXZhdGFyLlxuICAgKiBAdHlwZSB7c3RyaW5nfVxuICAgKiBAbWVtYmVyb2YgQXZhdGFyQ29tcG9uZW50XG4gICAqL1xuICBASW5wdXQoKSBuYW1lID0gJyc7XG5cbiAgLyoqXG4gICAqIElucHV0IHByb3BlcnR5IGZvciBzcGVjaWZ5aW5nIHRoZSB0b29sdGlwIHRleHQgZm9yIGVkaXQuXG4gICAqIEB0eXBlIHtzdHJpbmd9XG4gICAqIEBtZW1iZXJvZiBBdmF0YXJDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIHRvb2x0aXBUZXh0ID0gJyc7XG5cbiAgLyoqXG4gICAqIElucHV0IHByb3BlcnR5IHRoYXQgbWFrZXMgYXZhdGFyIGNsaWNrYWJsZS5cbiAgICogQHR5cGUge2Jvb2xlYW59XG4gICAqIEBtZW1iZXJvZiBBdmF0YXJDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIGFsbG93Q2xpY2sgPSBmYWxzZTtcblxuICAvKipcbiAgICogRXZlbnQgZW1pdHRlZCB3aGVuIHRoZSBhdmF0YXIgaXMgY2xpY2tlZC5cbiAgICogQHR5cGUge3ZvaWR9XG4gICAqIEBtZW1iZXJvZiBBdmF0YXJDb21wb25lbnRcbiAgICovXG4gIEBPdXRwdXQoKSBhdmF0YXJDbGljayA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcblxuICBwcm90ZWN0ZWQgaWNvblNpemUgPSBpY29uU2l6ZTtcbiAgcHJvdGVjdGVkIGF2YXRhclNpemUgPSBBdmF0YXJTaXplO1xuXG4gIHByb3RlY3RlZCBvbkF2YXRhckNsaWNrKCk6IHZvaWQge1xuICAgIHRoaXMuYXZhdGFyQ2xpY2suZW1pdCgpO1xuICB9XG5cbiAgZ2V0IGNsaWNrQWxsb3dhbmNlKCk6IHN0cmluZyB7XG4gICAgcmV0dXJuIHRoaXMuYWxsb3dDbGljayA/ICdjbGlja2FibGUnIDogJ25vbi1jbGlja2FibGUnO1xuICB9XG59XG4iLCI8ZGl2XG4gIGNsYXNzPVwiYXZhdGFyLWNvbnRhaW5lclwiXG4gIFthdHRyLnR5cGVdPVwiIWltYWdlVXJsICYmICFuYW1lID8gJ2ljb24nIDogJ2luaXRpYWxzJ1wiXG4gIFtuZ0NsYXNzXT1cIltzaXplLCBjbGlja0FsbG93YW5jZV1cIlxuICAoY2xpY2spPVwib25BdmF0YXJDbGljaygpXCJcbj5cbiAgPHNwYW4gKm5nSWY9XCJuYW1lICYmICFpbWFnZVVybFwiPlxuICAgIHt7IG5hbWUgfCBuYW1lSW5pdGlhbHMgfX1cbiAgPC9zcGFuPlxuICA8aW1nICpuZ0lmPVwiaW1hZ2VVcmxcIiBbYXR0ci5zcmNdPVwiaW1hZ2VVcmxcIiBbYWx0XT1cIidwcm9maWxlLWltYWdlJ1wiPlxuICA8dWktaWNvbiBjb2xvcj1cImRhcmtcIiBbc2l6ZV09XCJpY29uU2l6ZVtzaXplXVwiICpuZ0lmPVwiIWltYWdlVXJsICYmICFuYW1lXCIgW25hbWVdPVwiJ1VzZXItcHJvZmlsZSdcIj48L3VpLWljb24+XG48L2Rpdj5cblxuIl19

package/esm2020/components/avatar/avatar.component.module.mjs

@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { AvatarComponent } from './avatar.component';
+import { NameInitialsPipe } from '../../pipes/name-initials.pipe';
+import { IconComponentModule } from '../icon/icon.component.module';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import * as i0 from "@angular/core";
+export class AvatarComponentModule {
+}
+AvatarComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AvatarComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponentModule, declarations: [AvatarComponent, NameInitialsPipe], imports: [CommonModule, IconComponentModule, MatTooltipModule], exports: [AvatarComponent] });
+AvatarComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponentModule, imports: [CommonModule, IconComponentModule, MatTooltipModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponentModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AvatarComponent, NameInitialsPipe],
+                    imports: [CommonModule, IconComponentModule, MatTooltipModule],
+                    exports: [AvatarComponent],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXZhdGFyLmNvbXBvbmVudC5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9hdmF0YXIvYXZhdGFyLmNvbXBvbmVudC5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLG9CQUFvQixDQUFDO0FBQ3JELE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLGdDQUFnQyxDQUFDO0FBQ2xFLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLCtCQUErQixDQUFDO0FBQ3BFLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLDJCQUEyQixDQUFDOztBQU83RCxNQUFNLE9BQU8scUJBQXFCOztrSEFBckIscUJBQXFCO21IQUFyQixxQkFBcUIsaUJBSmpCLGVBQWUsRUFBRSxnQkFBZ0IsYUFDdEMsWUFBWSxFQUFFLG1CQUFtQixFQUFFLGdCQUFnQixhQUNuRCxlQUFlO21IQUVkLHFCQUFxQixZQUh0QixZQUFZLEVBQUUsbUJBQW1CLEVBQUUsZ0JBQWdCOzJGQUdsRCxxQkFBcUI7a0JBTGpDLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFLENBQUMsZUFBZSxFQUFFLGdCQUFnQixDQUFDO29CQUNqRCxPQUFPLEVBQUUsQ0FBQyxZQUFZLEVBQUUsbUJBQW1CLEVBQUUsZ0JBQWdCLENBQUM7b0JBQzlELE9BQU8sRUFBRSxDQUFDLGVBQWUsQ0FBQztpQkFDM0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IEF2YXRhckNvbXBvbmVudCB9IGZyb20gJy4vYXZhdGFyLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBOYW1lSW5pdGlhbHNQaXBlIH0gZnJvbSAnLi4vLi4vcGlwZXMvbmFtZS1pbml0aWFscy5waXBlJztcbmltcG9ydCB7IEljb25Db21wb25lbnRNb2R1bGUgfSBmcm9tICcuLi9pY29uL2ljb24uY29tcG9uZW50Lm1vZHVsZSc7XG5pbXBvcnQgeyBNYXRUb29sdGlwTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvdG9vbHRpcCc7XG5cbkBOZ01vZHVsZSh7XG4gIGRlY2xhcmF0aW9uczogW0F2YXRhckNvbXBvbmVudCwgTmFtZUluaXRpYWxzUGlwZV0sXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEljb25Db21wb25lbnRNb2R1bGUsIE1hdFRvb2x0aXBNb2R1bGVdLFxuICBleHBvcnRzOiBbQXZhdGFyQ29tcG9uZW50XSxcbn0pXG5leHBvcnQgY2xhc3MgQXZhdGFyQ29tcG9uZW50TW9kdWxlIHt9XG4iXX0=

package/esm2020/components/avatar/avatar.model.mjs

@@ -0,0 +1,12 @@
+export var AvatarSize;
+(function (AvatarSize) {
+    AvatarSize["SMALL"] = "small";
+    AvatarSize["MEDIUM"] = "medium";
+    AvatarSize["LARGE"] = "large";
+})(AvatarSize || (AvatarSize = {}));
+export const iconSize = {
+    small: '16',
+    medium: '24',
+    large: '80',
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXZhdGFyLm1vZGVsLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvYXZhdGFyL2F2YXRhci5tb2RlbC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFQSxNQUFNLENBQU4sSUFBWSxVQUlYO0FBSkQsV0FBWSxVQUFVO0lBQ3BCLDZCQUFlLENBQUE7SUFDZiwrQkFBaUIsQ0FBQTtJQUNqQiw2QkFBZSxDQUFBO0FBQ2pCLENBQUMsRUFKVyxVQUFVLEtBQVYsVUFBVSxRQUlyQjtBQUVELE1BQU0sQ0FBQyxNQUFNLFFBQVEsR0FBNkI7SUFDaEQsS0FBSyxFQUFFLElBQUk7SUFDWCxNQUFNLEVBQUUsSUFBSTtJQUNaLEtBQUssRUFBRSxJQUFJO0NBQ1osQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEljb25TaXplIH0gZnJvbSAnLi4vaWNvbi9pY29uLm1vZGVsJztcblxuZXhwb3J0IGVudW0gQXZhdGFyU2l6ZSB7XG4gIFNNQUxMID0gJ3NtYWxsJyxcbiAgTUVESVVNID0gJ21lZGl1bScsXG4gIExBUkdFID0gJ2xhcmdlJyxcbn1cblxuZXhwb3J0IGNvbnN0IGljb25TaXplOiBSZWNvcmQ8c3RyaW5nLCBJY29uU2l6ZT4gPSB7XG4gIHNtYWxsOiAnMTYnLFxuICBtZWRpdW06ICcyNCcsXG4gIGxhcmdlOiAnODAnLFxufTtcbiJdfQ==

package/esm2020/components/icon/icon.component.mjs

@@ -53,10 +53,10 @@ export class IconComponent {
     }
 }
 IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconComponent, deps: [{ token: i1.MatIconRegistry }, { token: i2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
-IconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: IconComponent, selector: "ui-icon", inputs: { size: "size", cssClass: "cssClass", name: "name", color: "color" }, usesOnChanges: true, ngImport: i0, template: "<mat-icon [svgIcon]=\"name\" [attr.class]=\"customCssClass\"></mat-icon>\n", styles: ["mat-icon{display:flex}mat-icon.size-16 svg{width:16px;height:16px}mat-icon.size-24 svg{width:24px;height:24px}mat-icon.dark svg{color:#888}mat-icon.white svg{color:#fff}mat-icon.teal svg{color:#46a997}mat-icon.petrol svg{color:#276678}mat-icon.black svg{color:#000}\n"], dependencies: [{ kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
+IconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: IconComponent, selector: "ui-icon", inputs: { size: "size", cssClass: "cssClass", name: "name", color: "color" }, usesOnChanges: true, ngImport: i0, template: "<mat-icon [svgIcon]=\"name\" [attr.class]=\"customCssClass\"></mat-icon>\n", styles: ["mat-icon{display:flex}mat-icon.size-16 svg{width:16px;height:16px}mat-icon.size-24 svg{width:24px;height:24px}mat-icon.size-80 svg{width:80px;height:80px}mat-icon.dark svg{color:#888}mat-icon.white svg{color:#fff}mat-icon.teal svg{color:#46a997}mat-icon.petrol svg{color:#276678}mat-icon.black svg{color:#000}\n"], dependencies: [{ kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ui-icon', encapsulation: ViewEncapsulation.None, template: "<mat-icon [svgIcon]=\"name\" [attr.class]=\"customCssClass\"></mat-icon>\n", styles: ["mat-icon{display:flex}mat-icon.size-16 svg{width:16px;height:16px}mat-icon.size-24 svg{width:24px;height:24px}mat-icon.dark svg{color:#888}mat-icon.white svg{color:#fff}mat-icon.teal svg{color:#46a997}mat-icon.petrol svg{color:#276678}mat-icon.black svg{color:#000}\n"] }]
+            args: [{ selector: 'ui-icon', encapsulation: ViewEncapsulation.None, template: "<mat-icon [svgIcon]=\"name\" [attr.class]=\"customCssClass\"></mat-icon>\n", styles: ["mat-icon{display:flex}mat-icon.size-16 svg{width:16px;height:16px}mat-icon.size-24 svg{width:24px;height:24px}mat-icon.size-80 svg{width:80px;height:80px}mat-icon.dark svg{color:#888}mat-icon.white svg{color:#fff}mat-icon.teal svg{color:#46a997}mat-icon.petrol svg{color:#276678}mat-icon.black svg{color:#000}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.MatIconRegistry }, { type: i2.DomSanitizer }]; }, propDecorators: { size: [{
                 type: Input
             }], cssClass: [{

package/esm2020/components/icon/icon.model.mjs

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5tb2RlbC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL2ljb24vaWNvbi5tb2RlbC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdGdvSWNvbnMgfSBmcm9tICcuLi8uLi9jb21wb25lbnRzL2ljb24vaWNvbi5jb25maWcnO1xuXG5leHBvcnQgdHlwZSBJY29uU2l6ZSA9ICcxNicgfCAnMjQnO1xuZXhwb3J0IHR5cGUgSWNvbk5hbWUgPSB0eXBlb2YgdGdvSWNvbnNbbnVtYmVyXSB8ICcnO1xuZXhwb3J0IHR5cGUgSWNvbkNvbG9yID0gJ3RlYWwnIHwgJ3BldHJvbCcgfCAnZGFyaycgfCAnd2hpdGUnIHwgJ2JsYWNrJyB8ICdpbmhlcml0JztcbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5tb2RlbC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL2ljb24vaWNvbi5tb2RlbC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdGdvSWNvbnMgfSBmcm9tICcuL2ljb24uY29uZmlnJztcblxuZXhwb3J0IHR5cGUgSWNvblNpemUgPSAnMTYnIHwgJzI0JyB8ICc4MCc7XG5leHBvcnQgdHlwZSBJY29uTmFtZSA9IHR5cGVvZiB0Z29JY29uc1tudW1iZXJdIHwgJyc7XG5leHBvcnQgdHlwZSBJY29uQ29sb3IgPSAndGVhbCcgfCAncGV0cm9sJyB8ICdkYXJrJyB8ICd3aGl0ZScgfCAnYmxhY2snIHwgJ2luaGVyaXQnO1xuIl19

package/esm2020/components/tag/tag.component.mjs

@@ -1,24 +1,150 @@
-import { Component, Input } from '@angular/core';
+import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
+import { debounceTime, map, ReplaySubject } from 'rxjs';
 import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "../icon/icon.component";
+import * as i3 from "@angular/material/tooltip";
 export class TagComponent {
     constructor() {
         /**
-         * Color
+         * Icon
          *
-         * @type {TagColor}
+         * @type {string}
          * @memberof TagComponent
          */
-        this.color = 'teal';
+        this.icon = '';
+        /**
+         * Whether to allow the tag to be closed.
+         *
+         * @type {boolean}
+         * @default false
+         * @memberof TagComponent
+         */
+        this.allowClose = false;
+        /**
+         * Whether the tag is in read-only mode.
+         *
+         * @type {boolean}
+         * @default false
+         * @memberof TagComponent
+         */
+        this.readOnly = false;
+        /**
+         * Whether the tag is selected.
+         *
+         * @type {boolean}
+         * @default false
+         * @memberof TagComponent
+         */
+        this.isSelected = false;
+        /**
+         * Display icon when is selected
+         *
+         * @type {boolean}
+         * @default false
+         * @memberof TagComponent
+         */
+        this.showIconWhenSelected = false;
+        /**
+         * Specifies whether the element is disabled.
+         *
+         * @type {boolean}
+         * @default false
+         * @memberof TagComponent
+         */
+        this.isDisabled = false;
+        /**
+         * Event triggered when the tag should be closed.
+         *
+         * @event
+         * @memberof TagComponent
+         */
+        this.close = new EventEmitter();
+        /**
+         * Event triggered when a press action occurs.
+         *
+         * @event
+         * @memberof TagComponent
+         */
+        this.press = new EventEmitter();
+        /**
+         * Subject that needs to be triggered when Label input changes, to check if it's truncated
+         * @private
+         * @type {void}
+         * @memberof TagComponent
+         */
+        this.checkLabelEllipsis$ = new ReplaySubject(1);
+        /**
+         * Observable that indicates if the Label is truncated
+         * debounceTime is used to wait for view to be initialized after receiving a new Label input
+         * @protected
+         * @type {boolean}
+         * @memberof TagComponent
+         */
+        this.isEllipseActiveObs$ = this.checkLabelEllipsis$.pipe(debounceTime(100), map(() => {
+            const el = this.labelElement.nativeElement;
+            return el.offsetWidth < el.scrollWidth;
+        }));
+        this.labelText = '';
+    }
+    /**
+     * Tag's label
+     *
+     * @memberof TagComponent
+     */
+    set label(value) {
+        this.labelText = value;
+        if (this.labelElement) {
+            this.isLabelEllipseActive();
+        }
+    }
+    ngAfterViewInit() {
+        this.isLabelEllipseActive();
+    }
+    onPress() {
+        if (!this.readOnly && !this.allowClose) {
+            this.isSelected = this.showIconWhenSelected ? !this.isSelected : false;
+            this.press.emit(this.isSelected);
+        }
+    }
+    onClose() {
+        this.close.emit();
+    }
+    isLabelEllipseActive() {
+        this.checkLabelEllipsis$.next();
+    }
+    get tabIndex() {
+        return this.isDisabled || this.readOnly ? -1 : 0;
+    }
+    get filled() {
+        return this.readOnly || this.allowClose || this.isSelected;
     }
 }
 TagComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TagComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TagComponent, selector: "ui-tag", inputs: { text: "text", color: "color" }, ngImport: i0, template: "<span [class]=\"color\">{{ text }}</span>\n", styles: [":host span{display:inline-flex;color:#fff;font-size:12px;line-height:16px;padding:3px 8px;border-radius:4px;text-transform:uppercase;margin-right:8px}:host span.teal{background-color:#46a997}:host span.petrol{background-color:#276678}:host span.grey{background-color:#e0e0e0;color:#000}:host span.red{background-color:#cb7b7a}:host span.gold{background-color:#cca45f}\n"] });
+TagComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TagComponent, selector: "ui-tag", inputs: { label: "label", icon: "icon", allowClose: "allowClose", readOnly: "readOnly", isSelected: "isSelected", showIconWhenSelected: "showIconWhenSelected", isDisabled: "isDisabled" }, outputs: { close: "close", press: "press" }, viewQueries: [{ propertyName: "labelElement", first: true, predicate: ["labelElement"], descendants: true }], ngImport: i0, template: "<div class=\"tag-wrapper\" [matTooltip]=\"(isEllipseActiveObs$ | async) ? labelText : ''\">\n  <div\n    [tabindex]=\"tabIndex\"\n    class=\"tag-container\"\n    [attr.data-testid]=\"'tag--container'\"\n    [ngClass]=\"{\n      filled: filled,\n      readonly: readOnly,\n      disabled: isDisabled,\n      outlined: !isSelected,\n    }\"\n    (click)=\"onPress()\"\n  >\n    <ui-icon *ngIf=\"icon\" class=\"icon\" [name]=\"icon\"></ui-icon>\n    <ui-icon *ngIf=\"isSelected && showIconWhenSelected\" class=\"icon\" [name]=\"'Check'\"></ui-icon>\n    <span class=\"tag-label\" #labelElement>{{ labelText }}</span>\n    <ui-icon [tabindex]=\"tabIndex\" *ngIf=\"allowClose\" class=\"delete-icon\" (click)=\"onClose()\" [name]=\"'Close'\"></ui-icon>\n  </div>\n</div>\n", styles: [":host .tag-wrapper{max-width:264px}:host .tag-container{height:32px;max-width:264px;border-radius:4px;display:flex;align-items:center;justify-content:center;padding:0 8px;width:-moz-fit-content;width:fit-content;cursor:pointer;margin:4px}:host .tag-container.outlined{border:1px solid #6894A0}:host .tag-container:focus{outline:1px dashed #888888;outline-offset:4px;background:#F6F6F6;border:1px solid #6894A0}:host .tag-container:focus.filled{background-color:#e9f0f1;border:1px solid #276678}:host .tag-container.filled{background:#E9F0F1;border:1px solid #E9F0F1}:host .tag-container.filled:hover{background-color:#e9f0f1;border:1px solid #276678}:host .tag-container.filled:active{background:#A9C2C9;border:1px solid #1B4754}:host .tag-container:hover{background:#F6F6F6;border:1px solid #6894A0}:host .tag-container:active{background:#E9F0F1}:host .tag-container.readonly{pointer-events:none}:host .tag-container.disabled{opacity:.5;border:1px solid #276678;background:#E9F0F1;pointer-events:none}:host .tag-container .tag-label{-webkit-user-select:none;user-select:none;font-size:14px;line-height:20px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .tag-container .icon{height:16px;width:16px;min-width:16px;margin-right:8px}:host .tag-container .delete-icon{display:flex;align-items:center;justify-content:center;margin-left:8px;text-align:center;border:1px solid transparent}:host .tag-container .delete-icon:focus{border:1px dashed #1B4754;border-radius:4px}:host .tag-container .delete-icon:focus-visible{outline:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ui-tag', template: "<span [class]=\"color\">{{ text }}</span>\n", styles: [":host span{display:inline-flex;color:#fff;font-size:12px;line-height:16px;padding:3px 8px;border-radius:4px;text-transform:uppercase;margin-right:8px}:host span.teal{background-color:#46a997}:host span.petrol{background-color:#276678}:host span.grey{background-color:#e0e0e0;color:#000}:host span.red{background-color:#cb7b7a}:host span.gold{background-color:#cca45f}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { text: [{
+            args: [{ selector: 'ui-tag', template: "<div class=\"tag-wrapper\" [matTooltip]=\"(isEllipseActiveObs$ | async) ? labelText : ''\">\n  <div\n    [tabindex]=\"tabIndex\"\n    class=\"tag-container\"\n    [attr.data-testid]=\"'tag--container'\"\n    [ngClass]=\"{\n      filled: filled,\n      readonly: readOnly,\n      disabled: isDisabled,\n      outlined: !isSelected,\n    }\"\n    (click)=\"onPress()\"\n  >\n    <ui-icon *ngIf=\"icon\" class=\"icon\" [name]=\"icon\"></ui-icon>\n    <ui-icon *ngIf=\"isSelected && showIconWhenSelected\" class=\"icon\" [name]=\"'Check'\"></ui-icon>\n    <span class=\"tag-label\" #labelElement>{{ labelText }}</span>\n    <ui-icon [tabindex]=\"tabIndex\" *ngIf=\"allowClose\" class=\"delete-icon\" (click)=\"onClose()\" [name]=\"'Close'\"></ui-icon>\n  </div>\n</div>\n", styles: [":host .tag-wrapper{max-width:264px}:host .tag-container{height:32px;max-width:264px;border-radius:4px;display:flex;align-items:center;justify-content:center;padding:0 8px;width:-moz-fit-content;width:fit-content;cursor:pointer;margin:4px}:host .tag-container.outlined{border:1px solid #6894A0}:host .tag-container:focus{outline:1px dashed #888888;outline-offset:4px;background:#F6F6F6;border:1px solid #6894A0}:host .tag-container:focus.filled{background-color:#e9f0f1;border:1px solid #276678}:host .tag-container.filled{background:#E9F0F1;border:1px solid #E9F0F1}:host .tag-container.filled:hover{background-color:#e9f0f1;border:1px solid #276678}:host .tag-container.filled:active{background:#A9C2C9;border:1px solid #1B4754}:host .tag-container:hover{background:#F6F6F6;border:1px solid #6894A0}:host .tag-container:active{background:#E9F0F1}:host .tag-container.readonly{pointer-events:none}:host .tag-container.disabled{opacity:.5;border:1px solid #276678;background:#E9F0F1;pointer-events:none}:host .tag-container .tag-label{-webkit-user-select:none;user-select:none;font-size:14px;line-height:20px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .tag-container .icon{height:16px;width:16px;min-width:16px;margin-right:8px}:host .tag-container .delete-icon{display:flex;align-items:center;justify-content:center;margin-left:8px;text-align:center;border:1px solid transparent}:host .tag-container .delete-icon:focus{border:1px dashed #1B4754;border-radius:4px}:host .tag-container .delete-icon:focus-visible{outline:none}\n"] }]
+        }], propDecorators: { label: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }], allowClose: [{
+                type: Input
+            }], readOnly: [{
+                type: Input
+            }], isSelected: [{
+                type: Input
+            }], showIconWhenSelected: [{
                 type: Input
-            }], color: [{
+            }], isDisabled: [{
                 type: Input
+            }], close: [{
+                type: Output
+            }], press: [{
+                type: Output
+            }], labelElement: [{
+                type: ViewChild,
+                args: ['labelElement']
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFnLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3RhZy90YWcuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdGFnL3RhZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFTakQsTUFBTSxPQUFPLFlBQVk7SUFpQnZCO1FBUkE7Ozs7O1dBS0c7UUFDTSxVQUFLLEdBQWEsTUFBTSxDQUFDO0lBRWxCLENBQUM7O3lHQWpCTixZQUFZOzZGQUFaLFlBQVksd0ZDVHpCLDZDQUNBOzJGRFFhLFlBQVk7a0JBTnhCLFNBQVM7K0JBQ0UsUUFBUTswRUFZVCxJQUFJO3NCQUFaLEtBQUs7Z0JBUUcsS0FBSztzQkFBYixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgVGFnQ29sb3IgfSBmcm9tICcuLi8uLi9jb21wb25lbnRzL3RhZy90YWcubW9kZWwnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd1aS10YWcnLFxuICB0ZW1wbGF0ZVVybDogJy4vdGFnLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vdGFnLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5cbmV4cG9ydCBjbGFzcyBUYWdDb21wb25lbnQge1xuXG4gIC8qKlxuICAgKiBUYWcncyB0ZXh0XG4gICAqXG4gICAqIEBtZW1iZXJvZiBUYWdDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIHRleHQ6IHN0cmluZztcblxuICAvKipcbiAgICogQ29sb3JcbiAgICpcbiAgICogQHR5cGUge1RhZ0NvbG9yfVxuICAgKiBAbWVtYmVyb2YgVGFnQ29tcG9uZW50XG4gICAqL1xuICBASW5wdXQoKSBjb2xvcjogVGFnQ29sb3IgPSAndGVhbCc7XG5cbiAgY29uc3RydWN0b3IoKSB7IH1cblxufVxuIiwiPHNwYW4gW2NsYXNzXT1cImNvbG9yXCI+e3sgdGV4dCB9fTwvc3Bhbj5cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFnLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3RhZy90YWcuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdGFnL3RhZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQWlCLFNBQVMsRUFBYyxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDN0csT0FBTyxFQUFFLFlBQVksRUFBRSxHQUFHLEVBQUUsYUFBYSxFQUFFLE1BQU0sTUFBTSxDQUFDOzs7OztBQVF4RCxNQUFNLE9BQU8sWUFBWTtJQUx6QjtRQWtCRTs7Ozs7V0FLRztRQUNNLFNBQUksR0FBYSxFQUFFLENBQUM7UUFFN0I7Ozs7OztXQU1HO1FBQ00sZUFBVSxHQUFHLEtBQUssQ0FBQztRQUU1Qjs7Ozs7O1dBTUc7UUFDTSxhQUFRLEdBQUcsS0FBSyxDQUFDO1FBRTFCOzs7Ozs7V0FNRztRQUNNLGVBQVUsR0FBRyxLQUFLLENBQUM7UUFFNUI7Ozs7OztXQU1HO1FBQ00seUJBQW9CLEdBQUcsS0FBSyxDQUFDO1FBRXRDOzs7Ozs7V0FNRztRQUNNLGVBQVUsR0FBRyxLQUFLLENBQUM7UUFFNUI7Ozs7O1dBS0c7UUFDTyxVQUFLLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUUzQzs7Ozs7V0FLRztRQUNPLFVBQUssR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO1FBRTlDOzs7OztXQUtHO1FBQ0ssd0JBQW1CLEdBQUcsSUFBSSxhQUFhLENBQU8sQ0FBQyxDQUFDLENBQUM7UUFFekQ7Ozs7OztXQU1HO1FBQ08sd0JBQW1CLEdBQUcsSUFBSSxDQUFDLG1CQUFtQixDQUFDLElBQUksQ0FDM0QsWUFBWSxDQUFDLEdBQUcsQ0FBQyxFQUNqQixHQUFHLENBQUMsR0FBRyxFQUFFO1lBQ1AsTUFBTSxFQUFFLEdBQUcsSUFBSSxDQUFDLFlBQVksQ0FBQyxhQUFhLENBQUM7WUFDM0MsT0FBTyxFQUFFLENBQUMsV0FBVyxHQUFHLEVBQUUsQ0FBQyxXQUFXLENBQUM7UUFDekMsQ0FBQyxDQUFDLENBQ0gsQ0FBQztRQUNRLGNBQVMsR0FBRyxFQUFFLENBQUM7S0E4QjFCO0lBcklDOzs7O09BSUc7SUFDSCxJQUFhLEtBQUssQ0FBQyxLQUFhO1FBQzlCLElBQUksQ0FBQyxTQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ3ZCLElBQUksSUFBSSxDQUFDLFlBQVksRUFBRTtZQUNyQixJQUFJLENBQUMsb0JBQW9CLEVBQUUsQ0FBQztTQUM3QjtJQUNILENBQUM7SUFpR0QsZUFBZTtRQUNiLElBQUksQ0FBQyxvQkFBb0IsRUFBRSxDQUFDO0lBQzlCLENBQUM7SUFFRCxPQUFPO1FBQ0wsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLElBQUksQ0FBQyxJQUFJLENBQUMsVUFBVSxFQUFFO1lBQ3RDLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLG9CQUFvQixDQUFDLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQztZQUN2RSxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7U0FDbEM7SUFDSCxDQUFDO0lBRUQsT0FBTztRQUNMLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDcEIsQ0FBQztJQUVPLG9CQUFvQjtRQUMxQixJQUFJLENBQUMsbUJBQW1CLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDbEMsQ0FBQztJQUVELElBQUksUUFBUTtRQUNWLE9BQU8sSUFBSSxDQUFDLFVBQVUsSUFBSSxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBQ25ELENBQUM7SUFFRCxJQUFJLE1BQU07UUFDUixPQUFPLElBQUksQ0FBQyxRQUFRLElBQUksSUFBSSxDQUFDLFVBQVUsSUFBSSxJQUFJLENBQUMsVUFBVSxDQUFDO0lBQzdELENBQUM7O3lHQXJJVSxZQUFZOzZGQUFaLFlBQVkscVlDVHpCLGl3QkFtQkE7MkZEVmEsWUFBWTtrQkFMeEIsU0FBUzsrQkFDRSxRQUFROzhCQVVMLEtBQUs7c0JBQWpCLEtBQUs7Z0JBYUcsSUFBSTtzQkFBWixLQUFLO2dCQVNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBU0csUUFBUTtzQkFBaEIsS0FBSztnQkFTRyxVQUFVO3NCQUFsQixLQUFLO2dCQVNHLG9CQUFvQjtzQkFBNUIsS0FBSztnQkFTRyxVQUFVO3NCQUFsQixLQUFLO2dCQVFJLEtBQUs7c0JBQWQsTUFBTTtnQkFRRyxLQUFLO3NCQUFkLE1BQU07Z0JBMEJvQixZQUFZO3NCQUF0QyxTQUFTO3VCQUFDLGNBQWMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBZnRlclZpZXdJbml0LCBDb21wb25lbnQsIEVsZW1lbnRSZWYsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBkZWJvdW5jZVRpbWUsIG1hcCwgUmVwbGF5U3ViamVjdCB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgSWNvbk5hbWUgfSBmcm9tICcuLi9pY29uL2ljb24ubW9kZWwnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd1aS10YWcnLFxuICB0ZW1wbGF0ZVVybDogJy4vdGFnLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vdGFnLmNvbXBvbmVudC5zY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIFRhZ0NvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuICAvKipcbiAgICogVGFnJ3MgbGFiZWxcbiAgICpcbiAgICogQG1lbWJlcm9mIFRhZ0NvbXBvbmVudFxuICAgKi9cbiAgQElucHV0KCkgc2V0IGxhYmVsKHZhbHVlOiBzdHJpbmcpIHtcbiAgICB0aGlzLmxhYmVsVGV4dCA9IHZhbHVlO1xuICAgIGlmICh0aGlzLmxhYmVsRWxlbWVudCkge1xuICAgICAgdGhpcy5pc0xhYmVsRWxsaXBzZUFjdGl2ZSgpO1xuICAgIH1cbiAgfVxuXG4gIC8qKlxuICAgKiBJY29uXG4gICAqXG4gICAqIEB0eXBlIHtzdHJpbmd9XG4gICAqIEBtZW1iZXJvZiBUYWdDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIGljb246IEljb25OYW1lID0gJyc7XG5cbiAgLyoqXG4gICAqIFdoZXRoZXIgdG8gYWxsb3cgdGhlIHRhZyB0byBiZSBjbG9zZWQuXG4gICAqXG4gICAqIEB0eXBlIHtib29sZWFufVxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKiBAbWVtYmVyb2YgVGFnQ29tcG9uZW50XG4gICAqL1xuICBASW5wdXQoKSBhbGxvd0Nsb3NlID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIFdoZXRoZXIgdGhlIHRhZyBpcyBpbiByZWFkLW9ubHkgbW9kZS5cbiAgICpcbiAgICogQHR5cGUge2Jvb2xlYW59XG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqIEBtZW1iZXJvZiBUYWdDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIHJlYWRPbmx5ID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIFdoZXRoZXIgdGhlIHRhZyBpcyBzZWxlY3RlZC5cbiAgICpcbiAgICogQHR5cGUge2Jvb2xlYW59XG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqIEBtZW1iZXJvZiBUYWdDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIGlzU2VsZWN0ZWQgPSBmYWxzZTtcblxuICAvKipcbiAgICogRGlzcGxheSBpY29uIHdoZW4gaXMgc2VsZWN0ZWRcbiAgICpcbiAgICogQHR5cGUge2Jvb2xlYW59XG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqIEBtZW1iZXJvZiBUYWdDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIHNob3dJY29uV2hlblNlbGVjdGVkID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIFNwZWNpZmllcyB3aGV0aGVyIHRoZSBlbGVtZW50IGlzIGRpc2FibGVkLlxuICAgKlxuICAgKiBAdHlwZSB7Ym9vbGVhbn1cbiAgICogQGRlZmF1bHQgZmFsc2VcbiAgICogQG1lbWJlcm9mIFRhZ0NvbXBvbmVudFxuICAgKi9cbiAgQElucHV0KCkgaXNEaXNhYmxlZCA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBFdmVudCB0cmlnZ2VyZWQgd2hlbiB0aGUgdGFnIHNob3VsZCBiZSBjbG9zZWQuXG4gICAqXG4gICAqIEBldmVudFxuICAgKiBAbWVtYmVyb2YgVGFnQ29tcG9uZW50XG4gICAqL1xuICBAT3V0cHV0KCkgY2xvc2UgPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG5cbiAgLyoqXG4gICAqIEV2ZW50IHRyaWdnZXJlZCB3aGVuIGEgcHJlc3MgYWN0aW9uIG9jY3Vycy5cbiAgICpcbiAgICogQGV2ZW50XG4gICAqIEBtZW1iZXJvZiBUYWdDb21wb25lbnRcbiAgICovXG4gIEBPdXRwdXQoKSBwcmVzcyA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcblxuICAvKipcbiAgICogU3ViamVjdCB0aGF0IG5lZWRzIHRvIGJlIHRyaWdnZXJlZCB3aGVuIExhYmVsIGlucHV0IGNoYW5nZXMsIHRvIGNoZWNrIGlmIGl0J3MgdHJ1bmNhdGVkXG4gICAqIEBwcml2YXRlXG4gICAqIEB0eXBlIHt2b2lkfVxuICAgKiBAbWVtYmVyb2YgVGFnQ29tcG9uZW50XG4gICAqL1xuICBwcml2YXRlIGNoZWNrTGFiZWxFbGxpcHNpcyQgPSBuZXcgUmVwbGF5U3ViamVjdDx2b2lkPigxKTtcblxuICAvKipcbiAgICogT2JzZXJ2YWJsZSB0aGF0IGluZGljYXRlcyBpZiB0aGUgTGFiZWwgaXMgdHJ1bmNhdGVkXG4gICAqIGRlYm91bmNlVGltZSBpcyB1c2VkIHRvIHdhaXQgZm9yIHZpZXcgdG8gYmUgaW5pdGlhbGl6ZWQgYWZ0ZXIgcmVjZWl2aW5nIGEgbmV3IExhYmVsIGlucHV0XG4gICAqIEBwcm90ZWN0ZWRcbiAgICogQHR5cGUge2Jvb2xlYW59XG4gICAqIEBtZW1iZXJvZiBUYWdDb21wb25lbnRcbiAgICovXG4gIHByb3RlY3RlZCBpc0VsbGlwc2VBY3RpdmVPYnMkID0gdGhpcy5jaGVja0xhYmVsRWxsaXBzaXMkLnBpcGUoXG4gICAgZGVib3VuY2VUaW1lKDEwMCksXG4gICAgbWFwKCgpID0+IHtcbiAgICAgIGNvbnN0IGVsID0gdGhpcy5sYWJlbEVsZW1lbnQubmF0aXZlRWxlbWVudDtcbiAgICAgIHJldHVybiBlbC5vZmZzZXRXaWR0aCA8IGVsLnNjcm9sbFdpZHRoO1xuICAgIH0pXG4gICk7XG4gIHByb3RlY3RlZCBsYWJlbFRleHQgPSAnJztcblxuICBAVmlld0NoaWxkKCdsYWJlbEVsZW1lbnQnKSBsYWJlbEVsZW1lbnQ6IEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+O1xuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLmlzTGFiZWxFbGxpcHNlQWN0aXZlKCk7XG4gIH1cblxuICBvblByZXNzKCk6IHZvaWQge1xuICAgIGlmICghdGhpcy5yZWFkT25seSAmJiAhdGhpcy5hbGxvd0Nsb3NlKSB7XG4gICAgICB0aGlzLmlzU2VsZWN0ZWQgPSB0aGlzLnNob3dJY29uV2hlblNlbGVjdGVkID8gIXRoaXMuaXNTZWxlY3RlZCA6IGZhbHNlO1xuICAgICAgdGhpcy5wcmVzcy5lbWl0KHRoaXMuaXNTZWxlY3RlZCk7XG4gICAgfVxuICB9XG5cbiAgb25DbG9zZSgpOiB2b2lkIHtcbiAgICB0aGlzLmNsb3NlLmVtaXQoKTtcbiAgfVxuXG4gIHByaXZhdGUgaXNMYWJlbEVsbGlwc2VBY3RpdmUoKTogdm9pZCB7XG4gICAgdGhpcy5jaGVja0xhYmVsRWxsaXBzaXMkLm5leHQoKTtcbiAgfVxuXG4gIGdldCB0YWJJbmRleCgpOiBudW1iZXIge1xuICAgIHJldHVybiB0aGlzLmlzRGlzYWJsZWQgfHwgdGhpcy5yZWFkT25seSA/IC0xIDogMDtcbiAgfVxuXG4gIGdldCBmaWxsZWQoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMucmVhZE9ubHkgfHwgdGhpcy5hbGxvd0Nsb3NlIHx8IHRoaXMuaXNTZWxlY3RlZDtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cInRhZy13cmFwcGVyXCIgW21hdFRvb2x0aXBdPVwiKGlzRWxsaXBzZUFjdGl2ZU9icyQgfCBhc3luYykgPyBsYWJlbFRleHQgOiAnJ1wiPlxuICA8ZGl2XG4gICAgW3RhYmluZGV4XT1cInRhYkluZGV4XCJcbiAgICBjbGFzcz1cInRhZy1jb250YWluZXJcIlxuICAgIFthdHRyLmRhdGEtdGVzdGlkXT1cIid0YWctLWNvbnRhaW5lcidcIlxuICAgIFtuZ0NsYXNzXT1cIntcbiAgICAgIGZpbGxlZDogZmlsbGVkLFxuICAgICAgcmVhZG9ubHk6IHJlYWRPbmx5LFxuICAgICAgZGlzYWJsZWQ6IGlzRGlzYWJsZWQsXG4gICAgICBvdXRsaW5lZDogIWlzU2VsZWN0ZWQsXG4gICAgfVwiXG4gICAgKGNsaWNrKT1cIm9uUHJlc3MoKVwiXG4gID5cbiAgICA8dWktaWNvbiAqbmdJZj1cImljb25cIiBjbGFzcz1cImljb25cIiBbbmFtZV09XCJpY29uXCI+PC91aS1pY29uPlxuICAgIDx1aS1pY29uICpuZ0lmPVwiaXNTZWxlY3RlZCAmJiBzaG93SWNvbldoZW5TZWxlY3RlZFwiIGNsYXNzPVwiaWNvblwiIFtuYW1lXT1cIidDaGVjaydcIj48L3VpLWljb24+XG4gICAgPHNwYW4gY2xhc3M9XCJ0YWctbGFiZWxcIiAjbGFiZWxFbGVtZW50Pnt7IGxhYmVsVGV4dCB9fTwvc3Bhbj5cbiAgICA8dWktaWNvbiBbdGFiaW5kZXhdPVwidGFiSW5kZXhcIiAqbmdJZj1cImFsbG93Q2xvc2VcIiBjbGFzcz1cImRlbGV0ZS1pY29uXCIgKGNsaWNrKT1cIm9uQ2xvc2UoKVwiIFtuYW1lXT1cIidDbG9zZSdcIj48L3VpLWljb24+XG4gIDwvZGl2PlxuPC9kaXY+XG4iXX0=

package/esm2020/components/tag/tag.component.module.mjs

@@ -1,19 +1,22 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { TagComponent } from './tag.component';
+import { IconComponentModule } from '../icon/icon.component.module';
+import { TooltipComponentModule } from '../tooltip/tooltip.component.module';
+import { MatTooltipModule } from '@angular/material/tooltip';
 import * as i0 from "@angular/core";
 export class TagComponentModule {
 }
 TagComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-TagComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: TagComponentModule, declarations: [TagComponent], imports: [CommonModule], exports: [TagComponent] });
-TagComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponentModule, imports: [CommonModule] });
+TagComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: TagComponentModule, declarations: [TagComponent], imports: [CommonModule, IconComponentModule, TooltipComponentModule, MatTooltipModule], exports: [TagComponent] });
+TagComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponentModule, imports: [CommonModule, IconComponentModule, TooltipComponentModule, MatTooltipModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponentModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [TagComponent],
-                    imports: [CommonModule],
+                    imports: [CommonModule, IconComponentModule, TooltipComponentModule, MatTooltipModule],
                     exports: [TagComponent],
                     providers: [],
                 }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFnLmNvbXBvbmVudC5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy90YWcvdGFnLmNvbXBvbmVudC5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDOztBQVEvQyxNQUFNLE9BQU8sa0JBQWtCOzsrR0FBbEIsa0JBQWtCO2dIQUFsQixrQkFBa0IsaUJBTGQsWUFBWSxhQUNqQixZQUFZLGFBQ1osWUFBWTtnSEFHWCxrQkFBa0IsWUFKbkIsWUFBWTsyRkFJWCxrQkFBa0I7a0JBTjlCLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFLENBQUMsWUFBWSxDQUFDO29CQUM1QixPQUFPLEVBQUUsQ0FBQyxZQUFZLENBQUM7b0JBQ3ZCLE9BQU8sRUFBRSxDQUFDLFlBQVksQ0FBQztvQkFDdkIsU0FBUyxFQUFFLEVBQUU7aUJBQ2QiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFRhZ0NvbXBvbmVudCB9IGZyb20gJy4vdGFnLmNvbXBvbmVudCc7XG5cbkBOZ01vZHVsZSh7XG4gIGRlY2xhcmF0aW9uczogW1RhZ0NvbXBvbmVudF0sXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGVdLFxuICBleHBvcnRzOiBbVGFnQ29tcG9uZW50XSxcbiAgcHJvdmlkZXJzOiBbXSxcbn0pXG5leHBvcnQgY2xhc3MgVGFnQ29tcG9uZW50TW9kdWxlIHt9XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFnLmNvbXBvbmVudC5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy90YWcvdGFnLmNvbXBvbmVudC5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLCtCQUErQixDQUFDO0FBQ3BFLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLHFDQUFxQyxDQUFDO0FBQzdFLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLDJCQUEyQixDQUFDOztBQVE3RCxNQUFNLE9BQU8sa0JBQWtCOzsrR0FBbEIsa0JBQWtCO2dIQUFsQixrQkFBa0IsaUJBTGQsWUFBWSxhQUNqQixZQUFZLEVBQUUsbUJBQW1CLEVBQUUsc0JBQXNCLEVBQUUsZ0JBQWdCLGFBQzNFLFlBQVk7Z0hBR1gsa0JBQWtCLFlBSm5CLFlBQVksRUFBRSxtQkFBbUIsRUFBRSxzQkFBc0IsRUFBRSxnQkFBZ0I7MkZBSTFFLGtCQUFrQjtrQkFOOUIsUUFBUTttQkFBQztvQkFDUixZQUFZLEVBQUUsQ0FBQyxZQUFZLENBQUM7b0JBQzVCLE9BQU8sRUFBRSxDQUFDLFlBQVksRUFBRSxtQkFBbUIsRUFBRSxzQkFBc0IsRUFBRSxnQkFBZ0IsQ0FBQztvQkFDdEYsT0FBTyxFQUFFLENBQUMsWUFBWSxDQUFDO29CQUN2QixTQUFTLEVBQUUsRUFBRTtpQkFDZCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgVGFnQ29tcG9uZW50IH0gZnJvbSAnLi90YWcuY29tcG9uZW50JztcbmltcG9ydCB7IEljb25Db21wb25lbnRNb2R1bGUgfSBmcm9tICcuLi9pY29uL2ljb24uY29tcG9uZW50Lm1vZHVsZSc7XG5pbXBvcnQgeyBUb29sdGlwQ29tcG9uZW50TW9kdWxlIH0gZnJvbSAnLi4vdG9vbHRpcC90b29sdGlwLmNvbXBvbmVudC5tb2R1bGUnO1xuaW1wb3J0IHsgTWF0VG9vbHRpcE1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL3Rvb2x0aXAnO1xuXG5ATmdNb2R1bGUoe1xuICBkZWNsYXJhdGlvbnM6IFtUYWdDb21wb25lbnRdLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBJY29uQ29tcG9uZW50TW9kdWxlLCBUb29sdGlwQ29tcG9uZW50TW9kdWxlLCBNYXRUb29sdGlwTW9kdWxlXSxcbiAgZXhwb3J0czogW1RhZ0NvbXBvbmVudF0sXG4gIHByb3ZpZGVyczogW10sXG59KVxuZXhwb3J0IGNsYXNzIFRhZ0NvbXBvbmVudE1vZHVsZSB7fVxuIl19