@taiga-ui/kit/bundles/taiga-ui-kit-components-multi-select.umd.min.js

Taiga UI Angular main components kit

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@taiga-ui/cdk"),require("@angular/forms"),require("@taiga-ui/core"),require("@taiga-ui/kit/classes"),require("@taiga-ui/kit/components/input-tag"),require("@taiga-ui/kit/constants"),require("@taiga-ui/kit/providers"),require("@angular/common"),require("@taiga-ui/kit/components/multi-select-option"),require("@tinkoff/ng-polymorpheus"),require("rxjs"),require("rxjs/operators")):"function"==typeof define&&define.amd?define("@taiga-ui/kit/components/multi-select",["exports","@angular/core","@taiga-ui/cdk","@angular/forms","@taiga-ui/core","@taiga-ui/kit/classes","@taiga-ui/kit/components/input-tag","@taiga-ui/kit/constants","@taiga-ui/kit/providers","@angular/common","@taiga-ui/kit/components/multi-select-option","@tinkoff/ng-polymorpheus","rxjs","rxjs/operators"],t):t(((e=e||self)["taiga-ui"]=e["taiga-ui"]||{},e["taiga-ui"].kit=e["taiga-ui"].kit||{},e["taiga-ui"].kit.components=e["taiga-ui"].kit.components||{},e["taiga-ui"].kit.components["multi-select"]={}),e.ng.core,e.cdk,e.ng.forms,e.core$1,e["taiga-ui"].kit.classes,e["taiga-ui"].kit.components["input-tag"],e["taiga-ui"].kit.constants,e["taiga-ui"].kit.providers,e.ng.common,e["taiga-ui"].kit.components["multi-select-option"],e.ngPolymorpheus,e.rxjs,e.rxjs.operators)}(this,(function(e,t,n,o,i,r,u,a,p,l,s,c,d,f){"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 g=function(e,t){return(g=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])})(e,t)};function h(e,t,n,o){var i,r=arguments.length,u=r<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,n):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)u=Reflect.decorate(e,t,n,o);else for(var a=e.length-1;a>=0;a--)(i=e[a])&&(u=(r<3?i(u):r>3?i(t,n,u):i(t,n))||u);return r>3&&u&&Object.defineProperty(t,n,u),u}function y(e,t){return function(n,o){t(n,o,e)}}function v(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var o,i,r=n.call(e),u=[];try{for(;(void 0===t||t-- >0)&&!(o=r.next()).done;)u.push(o.value)}catch(e){i={error:e}}finally{try{o&&!o.done&&(n=r.return)&&n.call(r)}finally{if(i)throw i.error}}return u}function m(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(v(arguments[t]));return e}var b=function(e){function l(o,i,u,p){var l=e.call(this,o,i)||this;return l.textfieldLabelOutside=p,l.stringify=n.TUI_DEFAULT_STRINGIFY,l.identityMatcher=n.TUI_DEFAULT_IDENTITY_MATCHER,l.expandable=!0,l.search="",l.editable=!0,l.disabledItemHandler=n.ALWAYS_FALSE_HANDLER,l.valueContent="",l.searchChange=new t.EventEmitter,l.open=!1,l.valueMapper=function(e,t,o){return o?n.EMPTY_ARRAY:e.map((function(e){return new r.TuiStringifiableItem(e,t)}))},l.disabledItemHandlerWrapper=function(e){return function(t){return"string"==typeof t||e(t.item)}},l.datalist="",u.define({iconBlank:a.iconBlank}),l}var s;return function(e,t){function n(){this.constructor=e}g(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}(l,e),s=l,Object.defineProperty(l.prototype,"nativeFocusableElement",{get:function(){return this.input?this.input.nativeFocusableElement:null},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"focused",{get:function(){return!!this.input&&this.input.focused||!!this.hostedDropdown&&this.hostedDropdown.focused},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"computedValue",{get:function(){return this.computedGroup?n.EMPTY_ARRAY:this.value},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"searchOrSpace",{get:function(){return this.computedGroup?" ":this.searchString},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"searchString",{get:function(){return null===this.search?"":this.search},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"tagIcon",{get:function(){return this.interactive?"iconBlank":"tuiIconChevronDownLarge"},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"interactive",{get:function(){return!this.disabled&&!this.readOnly},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"inputHidden",{get:function(){return!this.editable&&!this.computedGroup},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"computedGroup",{get:function(){return!!this.valueContent&&this.value.length>0&&(!this.focused||!this.editable)},enumerable:!0,configurable:!0}),Object.defineProperty(l.prototype,"context",{get:function(){return this.getContext(this.value)},enumerable:!0,configurable:!0}),l.prototype.getStringifier=function(e){return function(t){var n=t.$implicit;return e(n)}},l.prototype.onHoveredChange=function(e){this.updateHovered(e)},l.prototype.onSpace=function(e){this.editable||e.preventDefault(),this.readOnly||(this.open=!0)},l.prototype.handleOption=function(e){var t=this.value,n=this.identityMatcher,o=t.findIndex((function(t){return n(t,e)}));this.updateValue(-1===o?m(t,[e]):m(t.slice(0,o),t.slice(o+1))),this.updateSearch(null)},l.prototype.onEnter=function(e){var t=this.value,n=this.accessor?this.accessor.getOptions():[];if(1===n.length){var o=t.indexOf(n[0]);e.preventDefault(),this.updateValue(-1===o?m(t,[n[0]]):m(t.slice(0,o),t.slice(o+1))),this.updateSearch(null)}},l.prototype.onClick=function(e){var t=e.nativeFocusableElement;this.interactive&&t&&n.isNativeFocused(t)&&(this.open=!this.open)},l.prototype.onArrowClick=function(){this.open=!this.open,this.focusInput()},l.prototype.onInput=function(e){this.updateValue(e.map((function(e){return e.item})))},l.prototype.onSearch=function(e){this.open=!0,this.updateSearch(e)},l.prototype.onActiveZone=function(e){this.updateFocused(e)},l.prototype.setDisabledState=function(){e.prototype.setDisabledState.call(this),this.open=!1},l.prototype.updateSearch=function(e){this.search!==e&&(this.search=e,this.searchChange.emit(e))},l.prototype.focusInput=function(e){void 0===e&&(e=!1),this.nativeFocusableElement&&n.setNativeFocused(this.nativeFocusableElement,!0,e)},l.prototype.getContext=function(e){return{$implicit:e}},l.ctorParameters=function(){return[{type:o.NgControl,decorators:[{type:t.Optional},{type:t.Self},{type:t.Inject,args:[o.NgControl]}]},{type:t.ChangeDetectorRef,decorators:[{type:t.Inject,args:[t.ChangeDetectorRef]}]},{type:i.TuiSvgService,decorators:[{type:t.Inject,args:[i.TuiSvgService]}]},{type:i.TuiTextfieldLabelOutsideDirective,decorators:[{type:t.Inject,args:[i.TUI_TEXTFIELD_LABEL_OUTSIDE]}]}]},h([t.Input(),n.tuiDefaultProp()],l.prototype,"stringify",void 0),h([t.Input(),n.tuiDefaultProp()],l.prototype,"identityMatcher",void 0),h([t.Input(),n.tuiDefaultProp()],l.prototype,"expandable",void 0),h([t.Input(),n.tuiDefaultProp()],l.prototype,"search",void 0),h([t.Input(),t.HostBinding("class._editable"),n.tuiDefaultProp()],l.prototype,"editable",void 0),h([t.Input(),n.tuiDefaultProp()],l.prototype,"disabledItemHandler",void 0),h([t.Input(),n.tuiDefaultProp()],l.prototype,"valueContent",void 0),h([t.Output()],l.prototype,"searchChange",void 0),h([t.ContentChild(i.TuiDataListDirective,{read:t.TemplateRef})],l.prototype,"datalist",void 0),h([t.ContentChild(i.TUI_DATA_LIST_ACCESSOR)],l.prototype,"accessor",void 0),h([t.ViewChild(i.TuiHostedDropdownComponent)],l.prototype,"hostedDropdown",void 0),h([t.ViewChild(u.TuiInputTagComponent)],l.prototype,"input",void 0),h([n.tuiPure],l.prototype,"getStringifier",null),h([n.tuiPure],l.prototype,"getContext",null),l=s=h([t.Component({selector:"tui-multi-select",template:'<tui-hosted-dropdown\n    class="wrapper"\n    [canOpen]="interactive"\n    [content]="datalist || \'\'"\n    [(open)]="open"\n    (tuiHoveredChange)="onHoveredChange($event)"\n    (tuiActiveZoneChange)="onActiveZone($event)"\n>\n    <tui-input-tag\n        tuiHostedDropdownHost\n        #inputTag\n        automation-id="tui-multi-select__input"\n        class="input"\n        [nativeId]="nativeId"\n        [icon]="tagIcon"\n        [disabled]="disabled"\n        [disabledItemHandler]="disabledItemHandler | tuiMapper : disabledItemHandlerWrapper"\n        [readOnly]="readOnly"\n        [inputHidden]="!editable"\n        [pseudoHovered]="hovered"\n        [pseudoFocused]="focused"\n        [pseudoInvalid]="computedInvalid"\n        [editable]="false"\n        [expandable]="expandable"\n        [search]="searchOrSpace"\n        [ngModel]="computedValue | tuiMapper: valueMapper: stringify"\n        (ngModelChange)="onInput($event)"\n        (searchChange)="onSearch($event)"\n        (keydown.space)="onSpace($event)"\n        (keydown.enter)="onEnter($event)"\n        (click.stop)="onClick(inputTag)"\n    >\n        <ng-content></ng-content>\n    </tui-input-tag>\n    <div\n        *ngIf="computedGroup"\n        polymorpheus-outlet\n        class="group"\n        [class.group_fullsize]="textfieldLabelOutside.labelOutside"\n        [context]="context"\n        [content]="valueContent"\n    ></div>\n    <tui-svg\n        *ngIf="interactive"\n        automation-id="tui-multi-select__arrow"\n        class="arrow"\n        src="tuiIconChevronDownLarge"\n        tuiPreventDefault="mousedown"\n        [class.arrow_open]="open"\n        (click.prevent)="onArrowClick()"\n    ></tui-svg>\n</tui-hosted-dropdown>\n',changeDetection:t.ChangeDetectionStrategy.OnPush,providers:[{provide:n.TUI_FOCUSABLE_ITEM_ACCESSOR,useExisting:t.forwardRef((function(){return s}))},{provide:i.TUI_DATA_LIST_HOST,useExisting:t.forwardRef((function(){return s}))},p.FIXED_DROPDOWN_CONTROLLER_PROVIDER],styles:[":host{position:relative;display:block}:host._disabled{pointer-events:none}.wrapper{display:block}:host:not(._editable):not(._readonly) .input{cursor:pointer}.arrow{transition-duration:.3s;transition-timing-function:ease-in-out;display:flex;width:24px;align-items:center;justify-content:center;color:var(--tui-text-03);box-sizing:border-box;transition-property:color,transform;position:absolute;top:50%;transform:translate(0,-50%);right:12px;height:24px;box-sizing:content-box;cursor:pointer}.arrow:hover{color:var(--tui-text-02)}:host._disabled .arrow,:host._readonly .arrow{pointer-events:none}:host[data-mode=onDark] .arrow{color:var(--tui-text-03-night)}:host[data-mode=onDark] .arrow:hover{color:var(--tui-text-01-night)}.arrow_open{transform:rotate(-180deg) translate(0,50%)}.group{position:absolute;top:0;left:0;bottom:0;display:flex;align-items:center;padding:27px 16px 9px;pointer-events:none}.group_fullsize{padding-top:1px;padding-bottom:0}:host[data-tui-host-size='m'] .group_fullsize.group_fullsize{padding-top:0}:host[data-tui-host-size='m'] .group{padding:19px 12px 0;font-size:13px}"]}),y(0,t.Optional()),y(0,t.Self()),y(0,t.Inject(o.NgControl)),y(1,t.Inject(t.ChangeDetectorRef)),y(2,t.Inject(i.TuiSvgService)),y(3,t.Inject(i.TUI_TEXTFIELD_LABEL_OUTSIDE))],l)}(n.AbstractTuiMultipleControl),T=function(){function e(e){this.component=e}return e.prototype.transform=function(e,t){var n=void 0===t?this.component:t,o=n.value,i=n.identityMatcher;return e&&this.filter(e,o,i)},e.prototype.filter=function(e,t,n){return e.filter((function(e){return t.every((function(t){return!n(t,e)}))}))},e.ctorParameters=function(){return[{type:b,decorators:[{type:t.Inject,args:[b]}]}]},h([n.tuiPure],e.prototype,"filter",null),e=h([t.Pipe({name:"tuiHideSelected",pure:!1}),y(0,t.Inject(b))],e)}(),I=function(){function e(){}return e=h([t.Directive({selector:"[tuiMultiSelectGroupReset]",providers:[{provide:i.TUI_OPTION_CONTENT,useValue:null}]})],e)}(),O=function(){function e(e,t){this.host=e,this.control=t,this.label="",this.options=n.EMPTY_QUERY}return Object.defineProperty(e.prototype,"size",{get:function(){return this.options.first&&this.options.first.size||"m"},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"checkboxSize",{get:function(){return this.options.first&&i.sizeBigger(this.options.first.size)?"l":"m"},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"empty$",{get:function(){return n.itemsQueryListObservable(this.options).pipe(f.map((function(e){return!e.length})))},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"disabled$",{get:function(){return n.itemsQueryListObservable(this.options).pipe(f.map((function(e){return e.every((function(e){return e.disabled}))})))},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"value$",{get:function(){var e=this;return d.combineLatest(this.items$,this.valueChanges$).pipe(f.map((function(t){for(var n=v(t,2),o=n[0],i=n[1],r=!1,u=function(t){var n=i.some((function(n){return e.matcher(n,o[t])}));if(!n&&r||n&&!r&&t)return{value:null};r=n},a=0;a<o.length;a++){var p=u(a);if("object"==typeof p)return p.value}return r})))},enumerable:!0,configurable:!0}),e.prototype.onClick=function(e){var t=this;if(this.control.control){var n=this.control.value||[],o=this.values,i=n.filter((function(e){return o.every((function(n){return!t.matcher(e,n)}))}));this.control.control.setValue(e?i:m(i,o))}},Object.defineProperty(e.prototype,"values",{get:function(){return this.filter(n.getOriginalArrayFromQueryList(this.options))},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"matcher",{get:function(){return this.host.identityMatcher||n.TUI_DEFAULT_IDENTITY_MATCHER},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"items$",{get:function(){return n.itemsQueryListObservable(this.options).pipe(f.map((function(e){return e.map((function(e){return e.value})).filter(n.isPresent)})))},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"valueChanges$",{get:function(){return n.tuiReplayedValueChangesFrom(this.control).pipe(f.map((function(e){return e||[]})))},enumerable:!0,configurable:!0}),e.prototype.filter=function(e){return e.map((function(e){return e.value})).filter(n.isPresent)},e.ctorParameters=function(){return[{type:void 0,decorators:[{type:t.Inject,args:[i.TUI_DATA_LIST_HOST]}]},{type:o.NgControl,decorators:[{type:t.Inject,args:[o.NgControl]}]}]},h([t.Input(),n.tuiDefaultProp()],e.prototype,"label",void 0),h([t.ContentChildren(i.TuiOptionComponent)],e.prototype,"options",void 0),h([n.tuiPure],e.prototype,"empty$",null),h([n.tuiPure],e.prototype,"disabled$",null),h([n.tuiPure],e.prototype,"value$",null),h([n.tuiPure],e.prototype,"items$",null),h([n.tuiPure],e.prototype,"valueChanges$",null),h([n.tuiPure],e.prototype,"filter",null),e=h([t.Component({selector:"tui-opt-group[tuiMultiSelectGroup]",template:'<ng-container *tuiLet="value$ | async as value">\n    <button\n        *ngIf="label && !(empty$ | async)"\n        tuiMultiSelectGroupReset\n        tuiOption\n        [size]="size"\n        [disabled]="disabled$ | async"\n        (click)="onClick(value)"\n    >\n        <tui-primitive-checkbox\n            class="tui-space_right-3"\n            [size]="checkboxSize"\n            [value]="value"\n        ></tui-primitive-checkbox>\n        <span class="label">{{label}}</span>\n    </button>\n</ng-container>\n<ng-content></ng-content>\n',changeDetection:t.ChangeDetectionStrategy.OnPush,styles:[":host{display:flex;flex-direction:column}:host:before{content:''}.label{font:var(--tui-font-text-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;color:var(--tui-text-02)}"]}),y(0,t.Inject(i.TUI_DATA_LIST_HOST)),y(1,t.Inject(o.NgControl))],e)}();function _(e,t){return t||{handleOption:function(t){if(e.control){var n=e.value||[],o=n.indexOf(t);e.control.setValue(-1===o?m(n,[t]):m(n.slice(0,o),n.slice(o+1)))}}}}var C=s.TUI_MULTI_SELECT_OPTION,P={writeValue:n.EMPTY_FUNCTION,registerOnChange:n.EMPTY_FUNCTION,registerOnTouched:n.EMPTY_FUNCTION},S=function(){function e(){}return e=h([t.Directive({selector:"[tuiMultiSelectGroup]",providers:[{provide:i.TUI_OPTION_CONTENT,useValue:C},{provide:i.TUI_DATA_LIST_HOST,deps:[o.NgControl,[new t.Optional,t.forwardRef((function(){return b}))]],useFactory:_},{provide:o.NG_VALUE_ACCESSOR,multi:!0,useValue:P}]})],e)}(),x=function(){function e(){}return e=h([t.NgModule({imports:[l.CommonModule,o.FormsModule,c.PolymorpheusModule,n.TuiPreventDefaultModule,n.TuiActiveZoneModule,n.TuiLetModule,n.TuiMapperPipeModule,n.TuiHoveredModule,i.TuiSvgModule,i.TuiHostedDropdownModule,u.TuiInputTagModule,s.TuiMultiSelectOptionModule,i.TuiPrimitiveCheckboxModule,i.TuiDataListModule],declarations:[b,O,S,I,T],exports:[b,O,S,T]})],e)}();e.TuiHideSelectedPipe=T,e.TuiMultiSelectComponent=b,e.TuiMultiSelectGroupComponent=O,e.TuiMultiSelectGroupDirective=S,e.TuiMultiSelectGroupResetDirective=I,e.TuiMultiSelectModule=x,e.hostFallbackFactory=_,e.ɵ0=C,e.ɵ1=P,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=taiga-ui-kit-components-multi-select.umd.min.js.map