import { Component, HostBinding, Input, ChangeDetectionStrategy, ViewEncapsulation, forwardRef, ContentChildren, QueryList, Output, EventEmitter, ViewChild, ElementRef, ChangeDetectorRef } from '@angular/core';
import { coerceBooleanProperty } from '@angular/cdk/coercion';
import { BaseDirective } from '../../base.directive';
import { EuiIconComponent } from '../atoms';
import * as i0 from "@angular/core";
import * as i1 from "@angular/material/chips";
import * as i2 from "../../directives/eui-tooltip.directive";
import * as i3 from "@angular/common";
import * as i4 from "../atoms/eui-icon/eui-icon.component";
const _c0 = ["chipLabel"];
function EuiChipComponent_span_4_Template(rf, ctx) { if (rf & 1) {
    const _r3 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "span", 4);
    i0.ɵɵlistener("keydown.backspace", function EuiChipComponent_span_4_Template_span_keydown_backspace_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r2 = i0.ɵɵnextContext(); return ctx_r2.onRemove($event); });
    i0.ɵɵelementEnd();
} }
const _c1 = ["*"];
// tslint:disable max-line-length
export class EuiChipComponent extends BaseDirective {
    constructor(cd) {
        super();
        this.cd = cd;
        this.euiInternalId = null;
        this._isChipRemovable = false;
        this._hasTooltip = false;
        this.remove = new EventEmitter();
        this.iconAfter = false;
        this.iconBefore = false;
        this.attr_Role = 'listbox';
        this.attr_AriaLabel = 'Chip content';
    }
    get isChipRemovable() { return this._isChipRemovable; }
    set isChipRemovable(value) { this._isChipRemovable = coerceBooleanProperty(value); }
    get hasTooltip() { return this._hasTooltip; }
    set hasTooltip(value) { this._hasTooltip = coerceBooleanProperty(value); }
    get cssClasses() {
        return [
            super.getCssClasses('eui-chip'),
            this.isChipRemovable ? `eui-chip--removable` : ``,
            this.iconAfter && !this.iconBefore ? `eui-chip--icon-after` : ``,
            this.iconBefore && !this.iconAfter ? `eui-chip--icon-before` : ``,
            this.iconBefore && this.iconAfter ? `eui-chip--icon-both` : ``,
        ].join(' ').trim();
    }
    ngAfterContentInit() {
        this.e2eAttr = 'eui-chip';
        // Apply primary to default only if no other type class is used
        if (!this.euiPrimary && !this.euiSecondary && !this.euiInfo && !this.euiSuccess && !this.euiWarning && !this.euiDanger && !this.euiAccent) {
            this.euiPrimary = true;
        }
        if (this.euiIcons) {
            this.euiIcons.forEach((icon, idx) => {
                icon.styleClass = 'eui-button__icon';
            });
        }
    }
    ngAfterViewInit() {
        setTimeout(() => {
            const children = this.chipLabel.nativeElement.children;
            if (children.length > 0) {
                this.iconAfter = children[children.length - 1].classList.contains('eui-icon');
                this.iconBefore = children[0].classList.contains('eui-icon');
            }
        });
    }
    onRemove(event) {
        if (event instanceof KeyboardEvent &&
            event.code === 'Backspace') {
            this.remove.emit({ chip: this.data, event });
        }
        else {
            this.remove.emit(this.data);
        }
    }
}
/** @nocollapse */ EuiChipComponent.ɵfac = function EuiChipComponent_Factory(t) { return new (t || EuiChipComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
/** @nocollapse */ EuiChipComponent.ɵcmp = i0.ɵɵdefineComponent({ type: EuiChipComponent, selectors: [["eui-chip"], ["span", "euiChip", ""], ["li", "euiChip", ""]], contentQueries: function EuiChipComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
        i0.ɵɵcontentQuery(dirIndex, EuiIconComponent, false);
    } if (rf & 2) {
        var _t;
        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.euiIcons = _t);
    } }, viewQuery: function EuiChipComponent_Query(rf, ctx) { if (rf & 1) {
        i0.ɵɵviewQuery(_c0, true);
    } if (rf & 2) {
        var _t;
        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.chipLabel = _t.first);
    } }, hostVars: 4, hostBindings: function EuiChipComponent_HostBindings(rf, ctx) { if (rf & 2) {
        i0.ɵɵattribute("role", ctx.attr_Role)("aria-label", ctx.attr_AriaLabel);
        i0.ɵɵclassMap(ctx.cssClasses);
    } }, inputs: { euiInternalId: "euiInternalId", tooltipMessage: "tooltipMessage", data: "data", isChipRemovable: "isChipRemovable", hasTooltip: "hasTooltip" }, outputs: { remove: "remove" }, features: [i0.ɵɵInheritDefinitionFeature], ngContentSelectors: _c1, decls: 5, vars: 16, consts: [[3, "removable", "disableRipple", "euiTooltip", "euiTooltipPrimary", "euiTooltipSecondary", "euiTooltipInfo", "euiTooltipSuccess", "euiTooltipWarning", "euiTooltipDanger", "euiTooltipAccent", "position", "content", "euiTooltipRounded", "euiTooltipArrows", "removed"], [1, "eui-chip__content-container"], ["chipLabel", ""], ["matChipRemove", "", "euiIcon", "", "iconClass", "eui-chip__remove-icon eui-icon eui-icon-times-circle-thin", "tabindex", "0", 3, "keydown.backspace", 4, "ngIf"], ["matChipRemove", "", "euiIcon", "", "iconClass", "eui-chip__remove-icon eui-icon eui-icon-times-circle-thin", "tabindex", "0", 3, "keydown.backspace"]], template: function EuiChipComponent_Template(rf, ctx) { if (rf & 1) {
        i0.ɵɵprojectionDef();
        i0.ɵɵelementStart(0, "mat-basic-chip", 0);
        i0.ɵɵlistener("removed", function EuiChipComponent_Template_mat_basic_chip_removed_0_listener() { return ctx.onRemove(); });
        i0.ɵɵelementStart(1, "div", 1, 2);
        i0.ɵɵprojection(3);
        i0.ɵɵelementEnd();
        i0.ɵɵtemplate(4, EuiChipComponent_span_4_Template, 1, 0, "span", 3);
        i0.ɵɵelementEnd();
    } if (rf & 2) {
        i0.ɵɵproperty("removable", ctx.isChipRemovable)("disableRipple", true)("euiTooltip", ctx.tooltipMessage)("euiTooltipPrimary", ctx.data && ctx.data.tooltip && ctx.data.tooltip.color === "euiTooltipPrimary")("euiTooltipSecondary", ctx.data && ctx.data.tooltip && ctx.data.tooltip.color === "euiTooltipSecondary")("euiTooltipInfo", ctx.data && ctx.data.tooltip && ctx.data.tooltip.color === "euiTooltipInfo")("euiTooltipSuccess", ctx.data && ctx.data.tooltip && ctx.data.tooltip.color === "euiTooltipSuccess")("euiTooltipWarning", ctx.data && ctx.data.tooltip && ctx.data.tooltip.color === "euiTooltipWarning")("euiTooltipDanger", ctx.data && ctx.data.tooltip && ctx.data.tooltip.color === "euiTooltipDanger")("euiTooltipAccent", ctx.data && ctx.data.tooltip && ctx.data.tooltip.color === "euiTooltipAccent")("position", ctx.data && ctx.data.tooltip && ctx.data.tooltip.position ? ctx.data.tooltip.position : "above")("content", ctx.data && ctx.data.tooltip && ctx.data.tooltip.contentAlignment ? ctx.data.tooltip.contentAlignment : "center")("content", ctx.data && ctx.data.tooltip && ctx.data.tooltip.contentAlignment ? ctx.data.tooltip.contentAlignment : "center")("euiTooltipRounded", ctx.data && ctx.data.tooltip && ctx.data.tooltip.rounded ? true : false)("euiTooltipArrows", ctx.data && ctx.data.tooltip && ctx.data.tooltip.arrows ? true : false);
        i0.ɵɵadvance(4);
        i0.ɵɵproperty("ngIf", ctx.isChipRemovable);
    } }, directives: [i1.MatChip, i2.EuiTooltipDirective, i3.NgIf, i4.EuiIconComponent, i1.MatChipRemove], styles: [".mat-chip.mat-standard-chip{background-color:#e0e0e0;color:rgba(0,0,0,.87)}.mat-chip.mat-standard-chip .mat-chip-remove{color:rgba(0,0,0,.87);opacity:.4}.mat-chip.mat-standard-chip:not(.mat-chip-disabled):active{box-shadow:0 3px 3px -2px rgba(0,0,0,.2),0 3px 4px 0 rgba(0,0,0,.14),0 1px 8px 0 rgba(0,0,0,.12)}.mat-chip.mat-standard-chip:not(.mat-chip-disabled) .mat-chip-remove:hover{opacity:.54}.mat-chip.mat-standard-chip.mat-chip-disabled{opacity:.4}.mat-chip.mat-standard-chip:after{background:#000}.mat-chip.mat-standard-chip.mat-chip-selected.mat-primary{background-color:#004494;color:#fff}.mat-chip.mat-standard-chip.mat-chip-selected.mat-primary .mat-chip-remove{color:#fff;opacity:.4}.mat-chip.mat-standard-chip.mat-chip-selected.mat-primary .mat-ripple-element{background-color:hsla(0,0%,100%,.1)}.mat-chip.mat-standard-chip.mat-chip-selected.mat-warn{background-color:#da2131;color:#fff}.mat-chip.mat-standard-chip.mat-chip-selected.mat-warn .mat-chip-remove{color:#fff;opacity:.4}.mat-chip.mat-standard-chip.mat-chip-selected.mat-warn .mat-ripple-element{background-color:hsla(0,0%,100%,.1)}.mat-chip.mat-standard-chip.mat-chip-selected.mat-accent{background-color:#fffcf4;color:#333}.mat-chip.mat-standard-chip.mat-chip-selected.mat-accent .mat-chip-remove{color:#333;opacity:.4}.mat-chip.mat-standard-chip.mat-chip-selected.mat-accent .mat-ripple-element{background-color:rgba(51,51,51,.1)}.eui-chip{align-items:center;border-radius:var(--eui-border-radius-base);display:inline-flex}.eui-tab-item .eui-chip{margin-left:var(--eui-spacing-s)}.eui-chip .eui-icon{font-size:var(--eui-font-size-xl);margin-right:var(--eui-spacing-xs)}.eui-chip .flag-icon{height:var(--eui-spacing);width:var(--eui-spacing)}.eui-chip .eui-chip__content-container{align-items:center;display:flex;width:100%}.eui-chip .eui-chip__content-container>span{align-items:center;display:inline-flex}.eui-chip .eui-chip__remove-icon{cursor:pointer;font-size:var(--eui-font-size-xl);margin-left:var(--eui-spacing-xs);margin-right:0!important;opacity:var(--eui-disabled-opacity-base)}.eui-chip .eui-chip__remove-icon:hover{opacity:1}.eui-chip .eui-chip__remove-icon:focus:before{border-radius:50%;outline:3px solid var(--eui-color-white);outline-offset:-3px}.eui-chip .mat-chip{align-items:center;display:inline-flex;font-size:var(--eui-font-size);font-weight:inherit;min-height:var(--eui-spacing-xl);padding:0 var(--eui-spacing-s)}.eui-chip--removable .mat-chip{padding-right:var(--eui-spacing-xs)}.eui-chip--icon-after .eui-icon{margin-left:var(--eui-spacing-xs)}.eui-chip--icon-before .eui-icon,.eui-chip--icon-both .eui-icon:first-child{margin-right:var(--eui-spacing-xs)}.eui-chip--icon-both .eui-icon:last-child{margin-left:var(--eui-spacing-xs)}.eui-chip--rounded{border-radius:var(--eui-spacing-xl)}.eui-chip--primary:not(.eui-chip--outline){background-color:#004494;color:#fff}.eui-chip--primary:not(.eui-chip--outline) .eui-label{color:var(--eui-color-white)}.eui-chip--secondary:not(.eui-chip--outline){background-color:#d2d2d2;color:#333}.eui-chip--secondary:not(.eui-chip--outline) .eui-label{color:var(--eui-color-font)}.eui-chip--info:not(.eui-chip--outline){background-color:#006fb4;color:#fff}.eui-chip--info:not(.eui-chip--outline) .eui-label{color:var(--eui-color-white)}.eui-chip--success:not(.eui-chip--outline){background-color:#467a39;color:#fff}.eui-chip--success:not(.eui-chip--outline) .eui-label{color:var(--eui-color-white)}.eui-chip--warning:not(.eui-chip--outline){background-color:#f29527;color:#333}.eui-chip--warning:not(.eui-chip--outline) .eui-label{color:var(--eui-color-font)}.eui-chip--danger:not(.eui-chip--outline){background-color:var(--eui-color-danger);color:#fff}.eui-chip--danger:not(.eui-chip--outline) .eui-label{color:var(--eui-color-white)}.eui-chip--accent:not(.eui-chip--outline){background-color:var(--eui-color-accent);color:#333}.eui-chip--accent:not(.eui-chip--outline) .eui-label,.eui-chip--outline{color:var(--eui-color-font)}.eui-chip--outline{background-color:var(--eui-color-white);background-image:none;outline:1px solid;outline-color:var(--eui-color-font)}.eui-chip--outline.eui-chip--primary{outline-color:var(--eui-color-primary)}.eui-chip--outline.eui-chip--primary .eui-chip__content-container .eui-label,.eui-chip--outline.eui-chip--primary .eui-chip__remove-icon{color:var(--eui-color-primary)}.eui-chip--outline.eui-chip--secondary{outline-color:var(--eui-color-grey)}.eui-chip--outline.eui-chip--secondary .eui-chip__content-container .eui-label{color:var(--eui-color-font)}.eui-chip--outline.eui-chip--secondary .eui-chip__remove-icon{color:var(--eui-color-grey-dark)}.eui-chip--outline.eui-chip--info{outline-color:var(--eui-color-info)}.eui-chip--outline.eui-chip--info .eui-chip__content-container .eui-label,.eui-chip--outline.eui-chip--info .eui-chip__remove-icon{color:var(--eui-color-info)}.eui-chip--outline.eui-chip--success{outline-color:var(--eui-color-success)}.eui-chip--outline.eui-chip--success .eui-chip__content-container .eui-label,.eui-chip--outline.eui-chip--success .eui-chip__remove-icon{color:var(--eui-color-success)}.eui-chip--outline.eui-chip--warning{outline-color:var(--eui-color-warning)}.eui-chip--outline.eui-chip--warning .eui-chip__content-container .eui-label{color:var(--eui-color-font)}.eui-chip--outline.eui-chip--warning .eui-chip__remove-icon{color:var(--eui-color-warning-dark)}.eui-chip--outline.eui-chip--danger{outline-color:var(--eui-color-danger)}.eui-chip--outline.eui-chip--danger .eui-chip__content-container .eui-label,.eui-chip--outline.eui-chip--danger .eui-chip__remove-icon{color:var(--eui-color-danger)}.eui-chip--outline.eui-chip--accent{outline-color:var(--eui-color-accent-dark)}.eui-chip--outline.eui-chip--accent .eui-chip__content-container .eui-label{color:var(--eui-color-font)}.eui-chip--outline.eui-chip--accent .eui-chip__remove-icon{color:var(--eui-color-grey-dark)}.eui-chip--size-2xs .mat-chip{min-height:var(--eui-spacing-xs);padding:var(--eui-spacing-2xs) var(--eui-spacing-xs)}.eui-chip--size-2xs .eui-icon,.eui-chip--size-2xs .mat-chip{font-size:var(--eui-font-size-2xs)}.eui-chip--size-xs .mat-chip{min-height:var(--eui-spacing-xs);padding:var(--eui-spacing-2xs) var(--eui-spacing-xs)}.eui-chip--size-xs .eui-icon,.eui-chip--size-xs .mat-chip{font-size:var(--eui-font-size-xs)}.eui-chip--size-s .mat-chip{min-height:var(--eui-spacing-s);padding:var(--eui-spacing-2xs) var(--eui-spacing-xs)}.eui-chip--size-s .eui-icon,.eui-chip--size-s .mat-chip{font-size:var(--eui-font-size-s)}.eui-chip--size-l .mat-chip{font-size:var(--eui-font-size-m);min-height:var(--eui-spacing-l);padding:var(--eui-spacing-xs) var(--eui-spacing-s)}.eui-chip--size-l .eui-icon{font-size:var(--eui-font-size-xl)}.eui-chip--size-xl .mat-chip{font-size:var(--eui-font-size-l);min-height:var(--eui-spacing-xl);padding:var(--eui-spacing-s) var(--eui-spacing-s)}.eui-chip--size-2xl .mat-chip,.eui-chip--size-xl .eui-icon{font-size:var(--eui-font-size-xl)}.eui-chip--size-2xl .mat-chip{min-height:var(--eui-spacing-2xl);padding:var(--eui-spacing) var(--eui-spacing-s)}.eui-chip--size-2xl .eui-icon{font-size:var(--eui-font-size-2xl)}"], encapsulation: 2, changeDetection: 0 });
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(EuiChipComponent, [{
        type: Component,
        args: [{
                templateUrl: './eui-chip.component.html',
                selector: 'eui-chip, span[euiChip], li[euiChip]',
                styleUrls: ['./styles/_index.scss'],
                changeDetection: ChangeDetectionStrategy.OnPush,
                encapsulation: ViewEncapsulation.None,
            }]
    }], function () { return [{ type: i0.ChangeDetectorRef }]; }, { euiInternalId: [{
            type: Input
        }], tooltipMessage: [{
            type: Input
        }], data: [{
            type: Input
        }], isChipRemovable: [{
            type: Input
        }], hasTooltip: [{
            type: Input
        }], remove: [{
            type: Output
        }], cssClasses: [{
            type: HostBinding,
            args: ['class']
        }], attr_Role: [{
            type: HostBinding,
            args: ['attr.role']
        }], attr_AriaLabel: [{
            type: HostBinding,
            args: ['attr.aria-label']
        }], euiIcons: [{
            type: ContentChildren,
            args: [forwardRef(() => EuiIconComponent)]
        }], chipLabel: [{
            type: ViewChild,
            args: ['chipLabel']
        }] }); })();
//# sourceMappingURL=data:application/json;base64, 