@taiga-ui/kit/bundles/taiga-ui-kit-components-input-tag.umd.min.js

Taiga UI Angular main components kit

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/forms"),require("@taiga-ui/cdk"),require("@taiga-ui/core"),require("@taiga-ui/kit/components/tag"),require("@taiga-ui/kit/providers"),require("@taiga-ui/kit/tokens"),require("rxjs"),require("rxjs/operators"),require("@angular/common"),require("@tinkoff/ng-polymorpheus")):"function"==typeof define&&define.amd?define("@taiga-ui/kit/components/input-tag",["exports","@angular/core","@angular/forms","@taiga-ui/cdk","@taiga-ui/core","@taiga-ui/kit/components/tag","@taiga-ui/kit/providers","@taiga-ui/kit/tokens","rxjs","rxjs/operators","@angular/common","@tinkoff/ng-polymorpheus"],e):e(((t=t||self)["taiga-ui"]=t["taiga-ui"]||{},t["taiga-ui"].kit=t["taiga-ui"].kit||{},t["taiga-ui"].kit.components=t["taiga-ui"].kit.components||{},t["taiga-ui"].kit.components["input-tag"]={}),t.ng.core,t.ng.forms,t.cdk,t.core$1,t["taiga-ui"].kit.components.tag,t["taiga-ui"].kit.providers,t["taiga-ui"].kit.tokens,t.rxjs,t.rxjs.operators,t.ng.common,t.ngPolymorpheus)}(this,(function(t,e,o,i,n,r,a,l,s,u,d,p){"use strict";
/*! *****************************************************************************
    Copyright (c) Microsoft Corporation.

    Permission to use, copy, modify, and/or distribute this software for any
    purpose with or without fee is hereby granted.

    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
    PERFORMANCE OF THIS SOFTWARE.
    ***************************************************************************** */var c=function(t,e){return(c=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var o in e)e.hasOwnProperty(o)&&(t[o]=e[o])})(t,e)};function h(t,e,o,i){var n,r=arguments.length,a=r<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,o,i);else for(var l=t.length-1;l>=0;l--)(n=t[l])&&(a=(r<3?n(a):r>3?n(e,o,a):n(e,o))||a);return r>3&&a&&Object.defineProperty(e,o,a),a}function g(t,e){return function(o,i){e(o,i,t)}}function f(t,e){var o="function"==typeof Symbol&&t[Symbol.iterator];if(!o)return t;var i,n,r=o.call(t),a=[];try{for(;(void 0===e||e-- >0)&&!(i=r.next()).done;)a.push(i.value)}catch(t){n={error:t}}finally{try{i&&!i.done&&(o=r.return)&&o.call(r)}finally{if(n)throw n.error}}return a}function m(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(f(arguments[e]));return t}var v=function(t){function d(o,n,r,a,l,u,d,p,c){var h=t.call(this,o,n)||this;return h.tuiScrollService=r,h.elementRef=a,h.appearance=l,h.modeDirective=u,h.tagStatus=d,h.hintController=p,h.controller=c,h.allowSpaces=!0,h.icon="",h.iconAlign="right",h.search="",h.editable=!0,h.tagValidator=i.ALWAYS_TRUE_HANDLER,h.expandable=!0,h.inputHidden=!1,h.disabledItemHandler=i.ALWAYS_FALSE_HANDLER,h.searchChange=new e.EventEmitter,h.open=!1,h.tags=i.EMPTY_QUERY,h.scrollToStart$=new s.Subject,h.scrollToEnd$=new s.Subject,h}var p;return function(t,e){function o(){this.constructor=t}c(t,e),t.prototype=null===e?Object.create(e):(o.prototype=e.prototype,new o)}(d,t),p=d,Object.defineProperty(d.prototype,"pseudoFocusedSetter",{set:function(t){t||this.focused||this.scrollToStart$.next(),this.pseudoFocused=t},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"scrollerSetter",{set:function(t){this.initScrollerSubscrition(t)},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"nativeFocusableElement",{get:function(){return!this.focusableElement||this.computedDisabled?null:this.focusableElement.nativeElement},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"focused",{get:function(){return i.isNativeFocusedIn(this.elementRef.nativeElement)||!!this.dropdown&&this.dropdown.focused},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"size",{get:function(){return this.controller.size},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"labelOutside",{get:function(){return this.controller.labelOutside},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"hasCleaner",{get:function(){return this.controller.cleaner&&this.hasValue&&!this.disabled&&!this.readOnly},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"hasNativeValue",{get:function(){return!!this.search},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"hasValue",{get:function(){return!!this.value.length||this.hasNativeValue},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"hasPlaceholder",{get:function(){return!this.labelOutside||!this.hasValue&&!this.hasExampleText},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"placeholderRaised",{get:function(){return!this.labelOutside&&(this.computedFocused&&!this.readOnly||this.hasValue)},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"hasExampleText",{get:function(){return!!this.controller.exampleText&&this.computedFocused&&!this.hasValue&&!this.readOnly},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"hasTooltip",{get:function(){return!!this.hintController.content&&!this.disabled},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"iconAlignLeft",{get:function(){return!!this.icon&&"left"===this.iconAlign},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"iconAlignRight",{get:function(){return!!this.icon&&"right"===this.iconAlign},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"hasRightIcons",{get:function(){return this.hasCleaner||this.hasTooltip||this.iconAlignRight},enumerable:!0,configurable:!0}),Object.defineProperty(d.prototype,"status",{get:function(){return this.modeDirective&&this.modeDirective.mode?"default":this.tagStatus},enumerable:!0,configurable:!0}),d.prototype.getLeftContent=function(t){return!this.tagValidator(t)&&this.errorIconTemplate?this.errorIconTemplate:null},d.prototype.onCleanerClick=function(){this.updateSearch(""),this.clear(),this.focusInput()},d.prototype.onActiveZone=function(t){this.updateFocused(t),t||(this.open=!1,this.addTag(),this.pseudoFocused||this.scrollToStart$.next())},d.prototype.onMouseDown=function(t){var e=i.getActualTarget(t);!this.focusableElement||e===this.focusableElement.nativeElement||!(t.target instanceof Element)||this.cleanerSvg&&this.cleanerSvg.nativeElement.contains(t.target)||this.tagsContainer&&e!==this.tagsContainer.nativeElement&&this.tagsContainer.nativeElement.contains(e)||(t.preventDefault(),this.focusInput())},d.prototype.onFieldKeyDownBackspace=function(t){this.labelOutside||this.hasNativeValue||!this.value.length?this.onFieldKeyDownArrowLeft(t):this.deleteLastEnabledItem()},d.prototype.onFieldKeyDownArrowLeft=function(t){this.labelOutside&&!this.hasNativeValue&&this.value.length&&(t.preventDefault(),i.setNativeFocused(this.tags.last.nativeElement))},d.prototype.onFieldKeyDownEnter=function(){this.addTag(),this.scrollToEnd$.next()},d.prototype.onTagKeyDownArrowLeft=function(t){t<=0||this.onScrollKeyDown(t,-1)},d.prototype.onTagKeyDownArrowRight=function(t){t!==this.value.length-1?this.onScrollKeyDown(t,1):this.focusInput()},d.prototype.onTagEdited=function(t,e){this.focusInput(),this.updateValue(this.value.map((function(o){return o!==e?o:t.split(",").map((function(t){return t.trim()})).filter(Boolean)})).reduce((function(t,e){return t.concat(e)}),[]))},d.prototype.handleOption=function(t){this.focusInput(),this.updateSearch(""),this.updateValue(this.value.concat(t)),this.open=!1,this.scrollToEnd$.next()},d.prototype.onInput=function(t){var e=this,o=this.allowSpaces?t.split(","):t.split(r.ALLOWED_SPACE_REGEXP),i=o.map((function(t){return t.trim()})).filter((function(t,e,o){var i=o.length;return t.length>0&&e!==i-1})).filter((function(t){return!e.disabledItemHandler(t)}));o.length>1?(this.updateSearch(o[o.length-1].trim()),this.updateValue(m(this.value,i))):this.updateSearch(t),this.open=this.hasNativeValue},d.prototype.onHoveredChange=function(t){this.updateHovered(t)},d.prototype.setDisabledState=function(){t.prototype.setDisabledState.call(this),this.open=!1},d.prototype.onScrollKeyDown=function(t,e){var o=this.tags.find((function(o,i){return i===t+e}));o&&this.scrollBar&&(i.setNativeFocused(o.nativeElement),e*this.scrollBar.nativeElement.clientWidth-e*o.nativeElement.offsetLeft-o.nativeElement.clientWidth<0&&(this.scrollBar.nativeElement.scrollLeft+=e*o.nativeElement.clientWidth))},d.prototype.initScrollerSubscrition=function(t){var e=this;if(t&&t.browserScrollRef){var o=t.browserScrollRef.nativeElement,n=i.typedFromEvent(o,"wheel",{passive:!1}).pipe(u.filter((function(t){return 0===t.deltaX&&e.shouldScroll(o)})),i.preventDefault(),u.map((function(t){var e=t.deltaY;return Math.max(o.scrollLeft+3*e,0)}))),r=this.scrollToStart$.pipe(u.mapTo(0)),a=this.scrollToEnd$.pipe(u.map((function(){return o.scrollWidth})));s.merge(n,r,a).pipe(u.switchMap((function(t){return e.tuiScrollService.scroll$(o,0,t)})),u.takeUntil(this.destroy$)).subscribe()}},d.prototype.updateValue=function(e){var o=new Set;t.prototype.updateValue.call(this,e.reverse().filter((function(t){return!!t&&!o.has(t)&&o.add(t)})).reverse())},d.prototype.updateSearch=function(t){this.focusableElement&&(this.focusableElement.nativeElement.value=t),this.search=t,this.searchChange.emit(t)},d.prototype.shouldScroll=function(t){return t.scrollWidth>t.offsetWidth},d.prototype.addTag=function(){var t=this.search.trim();t&&!this.disabledItemHandler(t)&&(this.updateSearch(""),this.updateValue(this.value.concat(t)))},d.prototype.deleteLastEnabledItem=function(){for(var t=this.value.length-1;t>=0;t--)if(!this.disabledItemHandler(this.value[t])){this.updateValue(m(this.value.slice(0,t),this.value.slice(t+1,this.value.length)));break}},d.prototype.focusInput=function(t){void 0===t&&(t=!1),this.nativeFocusableElement&&i.setNativeFocused(this.nativeFocusableElement,!0,t)},d.ctorParameters=function(){return[{type:o.NgControl,decorators:[{type:e.Optional},{type:e.Self},{type:e.Inject,args:[o.NgControl]}]},{type:e.ChangeDetectorRef,decorators:[{type:e.Inject,args:[e.ChangeDetectorRef]}]},{type:i.TuiScrollService,decorators:[{type:e.Inject,args:[i.TuiScrollService]}]},{type:e.ElementRef,decorators:[{type:e.Inject,args:[e.ElementRef]}]},{type:String,decorators:[{type:e.Inject,args:[n.TUI_TEXTFIELD_APPEARANCE]}]},{type:n.TuiModeDirective,decorators:[{type:e.Optional},{type:e.Inject,args:[n.TuiModeDirective]}]},{type:void 0,decorators:[{type:e.Inject,args:[l.TUI_TAG_STATUS]}]},{type:n.TuiHintControllerDirective,decorators:[{type:e.Inject,args:[n.TUI_HINT_WATCHED_CONTROLLER]}]},{type:n.TuiTextfieldController,decorators:[{type:e.Inject,args:[n.TUI_TEXTIFELD_WATCHED_CONTROLLER]}]}]},h([e.Input(),i.tuiDefaultProp()],d.prototype,"allowSpaces",void 0),h([e.Input(),i.tuiDefaultProp()],d.prototype,"icon",void 0),h([e.Input(),i.tuiDefaultProp()],d.prototype,"iconAlign",void 0),h([e.Input(),i.tuiDefaultProp()],d.prototype,"search",void 0),h([e.Input(),i.tuiDefaultProp()],d.prototype,"editable",void 0),h([e.Input(),i.tuiDefaultProp()],d.prototype,"tagValidator",void 0),h([e.Input(),e.HostBinding("class._expandable"),i.tuiDefaultProp()],d.prototype,"expandable",void 0),h([e.Input(),i.tuiDefaultProp()],d.prototype,"inputHidden",void 0),h([e.Input(),i.tuiDefaultProp()],d.prototype,"disabledItemHandler",void 0),h([e.Input("pseudoFocused")],d.prototype,"pseudoFocusedSetter",null),h([e.Output()],d.prototype,"searchChange",void 0),h([e.ViewChild(n.TuiScrollbarComponent)],d.prototype,"scrollerSetter",null),h([e.ContentChild(n.TuiDataListDirective,{read:e.TemplateRef})],d.prototype,"datalist",void 0),h([e.ViewChild("errorIcon")],d.prototype,"errorIconTemplate",void 0),h([e.ViewChild(n.TuiHostedDropdownComponent)],d.prototype,"dropdown",void 0),h([e.ViewChild("focusableElement")],d.prototype,"focusableElement",void 0),h([e.ViewChild("tagsContainer")],d.prototype,"tagsContainer",void 0),h([e.ViewChildren("tag",{read:e.ElementRef})],d.prototype,"tags",void 0),h([e.ViewChild("cleaner",{read:e.ElementRef})],d.prototype,"cleanerSvg",void 0),h([e.ViewChild(n.TuiScrollbarComponent,{read:e.ElementRef})],d.prototype,"scrollBar",void 0),h([e.HostBinding("attr.data-tui-host-size")],d.prototype,"size",null),h([e.HostBinding("class._label-outside")],d.prototype,"labelOutside",null),d=p=h([e.Component({selector:"tui-input-tag",changeDetection:e.ChangeDetectionStrategy.OnPush,template:'\x3c!-- TODO: repair --\x3e\n<tui-hosted-dropdown\n    class="hosted"\n    [content]="datalist || \'\'"\n    [(open)]="open"\n    (tuiActiveZoneChange)="onActiveZone($event)"\n>\n    <tui-wrapper\n        [appearance]="appearance"\n        [readOnly]="readOnly"\n        [focused]="computedFocused"\n        [hovered]="computedHovered"\n        [disabled]="computedDisabled"\n        [invalid]="computedInvalid"\n        (tuiHoveredChange)="onHoveredChange($event)"\n        (mousedown)="onMouseDown($event)"\n    >\n        <div class="content">\n            <div *ngIf="iconAlignLeft" class="icons icons_left">\n                <tui-svg class="icon" [src]="icon"></tui-svg>\n            </div>\n            <div class="wrapper">\n                <div class="absolute-wrapper">\n                    <div\n                        *ngIf="hasPlaceholder"\n                        automation-id="tui-input-tag__placeholder"\n                        class="placeholder"\n                        [class.placeholder_raised]="placeholderRaised"\n                    >\n                        <ng-content></ng-content>\n                    </div>\n                    <div\n                        *ngIf="hasExampleText"\n                        automation-id="tui-input-tag__example-text"\n                        class="value-decoration"\n                    >\n                        <span class="example-text-inner">\n                            {{controller.exampleText}}\n                        </span>\n                    </div>\n                </div>\n                <tui-scrollbar\n                    *ngIf="!expandable; else items"\n                    class="scrollbar"\n                    [hidden]="true"\n                >\n                    <ng-container *ngTemplateOutlet="items"></ng-container>\n                </tui-scrollbar>\n                <ng-template #items>\n                    <div #tagsContainer class="tags">\n                        <ng-container\n                            *ngIf="controller.labelOutside; else text"\n                        >\n                            <tui-tag\n                                *ngFor="let item of value; index as index"\n                                #tag\n                                class="tag"\n                                automation-id="tui-input-tag__tag"\n                                [status]="status"\n                                [leftContent]="getLeftContent(item)"\n                                [allowSpaces]="allowSpaces"\n                                [tuiFocusable]="false"\n                                [disabled]="computedDisabled || disabledItemHandler(item)"\n                                [editable]="editable && !readOnly"\n                                [hoverable]="!readOnly"\n                                [removable]="!readOnly"\n                                [maxLength]="controller.maxLength"\n                                [size]="controller.size"\n                                [value]="item.toString()"\n                                (edited)="onTagEdited($event, item)"\n                                (keydown.arrowLeft.prevent)="onTagKeyDownArrowLeft(index)"\n                                (keydown.arrowRight.prevent)="onTagKeyDownArrowRight(index)"\n                            ></tui-tag>\n                        </ng-container>\n                        <ng-template #text>\n                            <span\n                                *ngFor="let item of value"\n                                class="text"\n                                [class.text_disabled]="disabledItemHandler(item)"\n                                [class.text_error]="!tagValidator(item)"\n                                >{{item}}</span\n                            >\n                        </ng-template>\n                        <div\n                            class="input-wrapper"\n                            [class.input-wrapper_collapsed]="computedDisabled || readOnly || inputHidden"\n                        >\n                            <div class="ghost">{{search}}</div>\n                            <input\n                                #focusableElement\n                                type="text"\n                                automation-id="tui-input-tag__native"\n                                class="native"\n                                [class.native_hidden]="inputHidden"\n                                [attr.maxLength]="controller.maxLength"\n                                [id]="id"\n                                [disabled]="computedDisabled"\n                                [readOnly]="readOnly || inputHidden"\n                                [tuiFocusable]="computedFocusable"\n                                [ngModel]="search"\n                                (ngModelChange)="onInput($event)"\n                                (keydown.arrowLeft)="onFieldKeyDownArrowLeft($event)"\n                                (keydown.backspace)="onFieldKeyDownBackspace($event)"\n                                (keydown.enter.prevent)="onFieldKeyDownEnter()"\n                            />\n                        </div>\n                    </div>\n                </ng-template>\n            </div>\n            <div *ngIf="hasRightIcons" class="icons icons_right">\n                <tui-svg\n                    *ngIf="hasCleaner"\n                    #cleaner\n                    class="cleaner"\n                    automation-id="tui-input-tag__cleaner"\n                    src="tuiIconCloseLarge"\n                    (click.stop)="onCleanerClick()"\n                ></tui-svg>\n                <tui-tooltip\n                    *ngIf="hasTooltip"\n                    automation-id="tui-input-tag__tooltip"\n                    class="tooltip"\n                    describeId="placeholer_until_accesibility_is_added"\n                    [direction]="hintController.direction"\n                    [mode]="hintController.mode"\n                    [content]="hintController.content"\n                ></tui-tooltip>\n                <tui-svg\n                    *ngIf="iconAlignRight"\n                    class="icon"\n                    [src]="icon"\n                ></tui-svg>\n            </div>\n        </div>\n        <ng-template #errorIcon>\n            <tui-svg class="error-icon" src="tuiIconAttention"></tui-svg>\n        </ng-template>\n    </tui-wrapper>\n</tui-hosted-dropdown>\n',providers:[{provide:i.TUI_FOCUSABLE_ITEM_ACCESSOR,useExisting:e.forwardRef((function(){return p}))},{provide:n.TUI_DATA_LIST_HOST,useExisting:e.forwardRef((function(){return p}))},a.FIXED_DROPDOWN_CONTROLLER_PROVIDER,n.TEXTFIELD_CONTROLLER_PROVIDER,n.HINT_CONTROLLER_PROVIDER],styles:[":host{font:var(--tui-font-text-s);color:var(--tui-text-01);position:relative;display:block;border-radius:var(--tui-radius-m)}:host[data-tui-host-size='s']{height:var(--tui-height-s);min-height:var(--tui-height-s);max-height:var(--tui-height-s)}:host[data-tui-host-size='m']{height:var(--tui-height-m);min-height:var(--tui-height-m);max-height:var(--tui-height-m)}:host[data-tui-host-size='l']{height:var(--tui-height-l);min-height:var(--tui-height-l);max-height:var(--tui-height-l);font-size:15px}.input{font:var(--tui-font-text-s);color:var(--tui-text-01);padding:0 12px;border:0;border-radius:inherit;background:0 0;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;caret-color:currentColor;outline:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;word-break:keep-all;-webkit-text-fill-color:currentColor;position:absolute;top:0;left:0;width:100%;height:100%;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-transform:inherit}.input:-webkit-autofill,.input:-webkit-autofill:focus,.input:-webkit-autofill:hover{border-radius:inherit;-webkit-text-fill-color:inherit!important;color:inherit!important;background-color:transparent!important;-webkit-box-shadow:0 0 0 1000px var(--tui-autofill) inset!important}:host[data-tui-host-size='s'] .input{padding:0 8px 0 12px}:host[data-tui-host-size='l'] .input{padding:0 16px}:host._disabled .input{pointer-events:none}:host._right-aligned .input{text-align:right}:host[data-tui-host-size='l']:not(._label-outside) .input{padding-top:20px}:host[data-tui-host-size='l']:not(._label-outside) .input:-webkit-autofill+.content .placeholder{width:114%;transform:translateY(-10px) scale(.87)}:host[data-tui-host-size='m']:not(._label-outside) .input{padding-top:18px}:host[data-tui-host-size='m']:not(._label-outside) .input:-webkit-autofill+.content .placeholder{width:118%;transform:translateY(-8px) scale(.85)}.ghost{visibility:hidden;white-space:pre;text-overflow:clip}.filler{vertical-align:middle}.content{display:flex;height:100%;width:100%;box-sizing:border-box;align-items:center;overflow:hidden}:host[data-tui-host-size='s'] .content{padding-right:8px}:host[data-tui-host-size='l'] .content{padding-left:16px}.wrapper{flex:1;min-width:0}.value-decoration{display:flex;align-items:center;height:20px;margin:-20px 0;padding:10px 0;box-sizing:content-box;color:var(--tui-text-03);letter-spacing:normal;text-transform:none}:host._right-aligned .value-decoration{flex-direction:row-reverse;margin-right:-4px}:host[data-tui-host-size='m']._label-outside .value-decoration{margin-top:-19px}:host[data-mode=onDark] .value-decoration{color:var(--tui-text-03-night)}.value-decoration-inner{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.postfix{transition-property:color;transition-duration:.3s;transition-timing-function:ease-in-out;color:var(--tui-text-01)}.postfix_shifted{margin-left:.5ch}:host[data-mode=onDark] .postfix{color:var(--tui-text-01-night)}.placeholder{transition-property:transform,min-width,color,letter-spacing;transition-duration:.3s;transition-timing-function:ease-in-out;font:var(--tui-font-text-s);color:var(--tui-text-01);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;width:100%;height:20px;font-size:13px;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;color:var(--tui-text-02);transform-origin:left;letter-spacing:normal;text-transform:none}.placeholder_raised{width:114%;transform:translateY(-10px) scale(.87)}:host[data-tui-host-size='m'] .placeholder_raised{width:118%;transform:translateY(-8px) scale(.85);letter-spacing:.4px}:host._invalid:not(._focused) .placeholder_raised,:host._invalid:not(._focused)._hovered .placeholder_raised{color:var(--tui-error-fill)}:host[data-mode=onDark]._invalid:not(._focused) .placeholder_raised,:host[data-mode=onDark]._invalid:not(._focused)._hovered .placeholder_raised{color:var(--tui-error-fill-night)}:host._focused .placeholder,:host[data-tui-host-size='l']._focused._label-outside .placeholder,:host[data-tui-host-size='m']._focused._label-outside .placeholder{color:var(--tui-text-03)}:host[data-tui-host-size='l'] .placeholder{font-size:15px}:host[data-tui-host-size='l']._focused:not(._label-outside) .placeholder,:host[data-tui-host-size='m']._focused:not(._label-outside) .placeholder{color:var(--tui-text-01)}:host[data-mode=onDark] .placeholder{color:var(--tui-text-02-night)}:host[data-tui-host-size='l'][data-mode=onDark]._focused:not(._label-outside) .placeholder,:host[data-tui-host-size='m'][data-mode=onDark]._focused:not(._label-outside) .placeholder{color:var(--tui-text-01-night)}:host[data-mode=onDark]._focused .placeholder,:host[data-tui-host-size='l'][data-mode=onDark]._focused._label-outside .placeholder,:host[data-tui-host-size='m'][data-mode=onDark]._focused._label-outside .placeholder{color:var(--tui-text-02-night)}.cleaner{transition-duration:.3s;transition-timing-function:ease-in-out;display:flex;width:24px;height:24px;align-items:center;justify-content:center;color:var(--tui-text-03);position:relative;box-sizing:border-box;cursor:pointer;transition-property:color,transform}.cleaner:hover{color:var(--tui-text-02)}:host._disabled .cleaner,:host._readonly .cleaner{pointer-events:none}:host[data-mode=onDark] .cleaner{color:var(--tui-text-03-night)}:host[data-mode=onDark] .cleaner:hover{color:var(--tui-text-01-night)}.icon{display:flex;width:24px;height:24px;align-items:center;justify-content:center;color:var(--tui-text-03)}:host[data-mode=onDark] .icon{color:var(--tui-text-03-night)}.icon_left{margin:0 8px 0 -4px}:host[data-tui-host-size='s'] .icon_left{margin-right:4px}:host{cursor:text}:host._expandable{height:auto;max-height:none}:host._disabled{pointer-events:none}:host._readonly{cursor:default}.hosted{display:block;border-radius:inherit}.scrollbar{margin:0 -4px;padding:0 4px}.tags{display:flex;align-items:center;box-sizing:border-box}:host._expandable .tags{flex-wrap:wrap;white-space:normal}:host._readonly .tags{pointer-events:none}:host[data-tui-host-size='m'] .tags{min-height:var(--tui-height-m);padding:8px 4px 8px 0}:host[data-tui-host-size='l'] .tags{min-height:var(--tui-height-l);padding:10px 4px 10px 0}:host[data-tui-host-size='m']:not(._label-outside) .tags{padding:19px 16px 0 0}:host[data-tui-host-size='l']:not(._label-outside) .tags{padding:27px 16px 9px 0}.content{padding:0;align-items:flex-start}:host[data-tui-host-size='m'] .content{padding-left:12px}.icons{display:flex;align-items:center;padding:0 12px}.icons_left{padding:0;margin-right:8px;margin-left:-4px}:host._expandable .icons_right{margin-left:-10px}:host[data-tui-host-size='m'] .icons{height:var(--tui-height-m)}:host[data-tui-host-size='l'] .icons{height:var(--tui-height-l)}.absolute-wrapper{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center}:host[data-tui-host-size='m'] .absolute-wrapper{height:var(--tui-height-m)}:host[data-tui-host-size='l'] .absolute-wrapper{height:var(--tui-height-l)}.wrapper{position:relative;padding:0}.tag{margin:2px 8px 2px -4px;max-width:100%;flex-shrink:0}.text:after{content:',\\00a0'}.text_disabled{color:var(--tui-text-03)}.text_error{color:var(--tui-negative)}:host:not(._expandable) .text{white-space:nowrap}:host:not(:focus-within) .text:last-of-type:after{content:''}.input-wrapper{position:relative;flex:1;max-width:100%;min-height:28px}.input-wrapper_collapsed{flex:0;margin-left:-8px}:host[data-tui-host-size='l'] .input-wrapper{min-height:36px}:host:not(._label-outside) .input-wrapper{min-height:20px}.ghost{min-width:2px}:host:not(._expandable) .ghost{min-width:32px}.native{border:0;border-radius:inherit;background:0 0;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;caret-color:currentColor;outline:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;word-break:keep-all;-webkit-text-fill-color:currentColor;position:absolute;top:0;left:0;width:100%;height:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;padding:0;cursor:inherit}.native:-webkit-autofill,.native:-webkit-autofill:focus,.native:-webkit-autofill:hover{border-radius:inherit;-webkit-text-fill-color:inherit!important;color:inherit!important;background-color:transparent!important;-webkit-box-shadow:0 0 0 1000px var(--tui-autofill) inset!important}.native_hidden{opacity:0;text-indent:-10em}.error-icon{display:block;color:var(--tui-error-fill);width:16px;height:16px}"]}),g(0,e.Optional()),g(0,e.Self()),g(0,e.Inject(o.NgControl)),g(1,e.Inject(e.ChangeDetectorRef)),g(2,e.Inject(i.TuiScrollService)),g(3,e.Inject(e.ElementRef)),g(4,e.Inject(n.TUI_TEXTFIELD_APPEARANCE)),g(5,e.Optional()),g(5,e.Inject(n.TuiModeDirective)),g(6,e.Inject(l.TUI_TAG_STATUS)),g(7,e.Inject(n.TUI_HINT_WATCHED_CONTROLLER)),g(8,e.Inject(n.TUI_TEXTIFELD_WATCHED_CONTROLLER))],d)}(i.AbstractTuiMultipleControl),b=function(){function t(){}return t=h([e.NgModule({imports:[d.CommonModule,o.FormsModule,p.PolymorpheusModule,i.TuiFocusableModule,i.TuiHoveredModule,i.TuiActiveZoneModule,n.TuiSvgModule,n.TuiScrollbarModule,n.TuiTooltipModule,n.TuiHostedDropdownModule,r.TuiTagModule,n.TuiWrapperModule],providers:[i.TuiScrollService],declarations:[v],exports:[v]})],t)}();t.TuiInputTagComponent=v,t.TuiInputTagModule=b,Object.defineProperty(t,"__esModule",{value:!0})}));
//# sourceMappingURL=taiga-ui-kit-components-input-tag.umd.min.js.map