@duoduo-oba/ng-devui/bundles/ng-devui-select.umd.min.js

DevUI components based on Angular

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("rxjs"),require("rxjs/operators"),require("ng-devui/window-ref"),require("ng-devui/i18n"),require("@angular/cdk/overlay"),require("ng-devui/utils"),require("@angular/cdk/scrolling"),require("@angular/common"),require("ng-devui/checkbox"),require("ng-devui/loading")):"function"==typeof define&&define.amd?define("ng-devui/select",["exports","@angular/core","@angular/forms","rxjs","rxjs/operators","ng-devui/window-ref","ng-devui/i18n","@angular/cdk/overlay","ng-devui/utils","@angular/cdk/scrolling","@angular/common","ng-devui/checkbox","ng-devui/loading"],t):t(((e=e||self)["ng-devui"]=e["ng-devui"]||{},e["ng-devui"].select={}),e.ng.core,e.ng.forms,e.rxjs,e.rxjs.operators,e["ng-devui"]["window-ref"],e["ng-devui"].i18n,e.ng.cdk.overlay,e["ng-devui"].utils,e.ng.cdk.scrolling,e.ng.common,e["ng-devui"].checkbox,e["ng-devui"].loading)}(this,(function(e,t,i,n,o,l,r,s,d,a,u,p,c){"use strict";
/*! *****************************************************************************
    Copyright (c) Microsoft Corporation. All rights reserved.
    Licensed under the Apache License, Version 2.0 (the "License"); you may not use
    this file except in compliance with the License. You may obtain a copy of the
    License at http://www.apache.org/licenses/LICENSE-2.0

    THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
    KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
    WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
    MERCHANTABLITY OR NON-INFRINGEMENT.

    See the Apache Version 2.0 License for specific language governing permissions
    and limitations under the License.
    ***************************************************************************** */function h(e,t){var i="function"==typeof Symbol&&e[Symbol.iterator];if(!i)return e;var n,o,l=i.call(e),r=[];try{for(;(void 0===t||t-- >0)&&!(n=l.next()).done;)r.push(n.value)}catch(e){o={error:e}}finally{try{n&&!n.done&&(i=l.return)&&i.call(l)}finally{if(o)throw o.error}}return r}var v=function(){function e(e,i,n,o,l){var r=this;this.renderer=e,this.windowRef=i,this.changeDetectorRef=n,this.i18n=o,this.ngZone=l,this.options=[],this.isSearch=!1,this.toggleOnFocus=!1,this.scrollHight="300px",this.hightLightItemClass="active",this.isSelectAll=!1,this.readonly=!0,this.appendToBody=!1,this.disabled=!1,this.placeholder="",this.direction="down",this.overview="border",this.allowClear=!1,this.enableLazyLoad=!1,this.valueChange=new t.EventEmitter,this.toggleChange=new t.EventEmitter,this.loadMore=new t.EventEmitter,this.optionDisabledKey="",this.optionImmutableKey="",this.keepMultipleOrder="user-select",this.customViewDirection="bottom",this.autoFocus=!1,this.notAutoScroll=!1,this.showLoading=!1,this._isOpen=!1,this.menuPosition="bottom",this.halfChecked=!1,this.allChecked=!1,this.isMouseEvent=!1,this.filter="",this.activeIndex=-1,this.availableOptions=[],this.multiItems=[],this.selectIndex=-1,this.virtualScrollItemSize={sm:30,normal:36,lg:44},this.resetting=!1,this.onChange=function(e){return null},this.onTouch=function(){return null},this.choose=function(e,t,i){if(i&&(i.preventDefault(),i.stopPropagation()),"object"==typeof e){if(0===Object.keys(e).length||r.disabled)return void(r.isOpen=!1)}else if(r.disabled)return void(r.isOpen=!1);if(!(r.optionDisabledKey&&e[r.optionDisabledKey]||r.optionImmutableKey&&e[r.optionImmutableKey])){if(r.multiple){var n=r.multiItems.findIndex((function(t){return JSON.stringify(t.option)===JSON.stringify(e)}));-1===n?r.multiItems.push({id:t,option:e}):r.multiItems.splice(n,1),"origin"===r.keepMultipleOrder&&r.multiItems.sort((function(e,t){return e.id-t.id})),r.value=r.multiItems.map((function(e){return e.option}))}else r.value=e,r.activeIndex=t,r.selectIndex=t,r.toggle();r.writeIntoInput(r.value),r.onChange(r.value),r.valueChange.emit(e),r.setChecked(r.value)}},this.onDocumentClick=function(e){r.isOpen&&!r.selectBoxElement.nativeElement.contains(e.target)&&(r.isOpen=!1,r.selectIndex=r.activeIndex?r.activeIndex:-1,r.changeDetectorRef.detectChanges())},this.valueParser=function(e){return"object"==typeof e?e[r.filterKey]||"":e+""?e.toString():""},this.formatter=function(e){return"object"==typeof e?e[r.filterKey]||"":e+""?e.toString():""}}return Object.defineProperty(e.prototype,"isOpen",{get:function(){return this._isOpen},set:function(e){this._isOpen=e,this.toggleChange.emit(e),this.setDocumentClickListener()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isClearIconShow",{get:function(){return this.allowClear&&!this.multiple&&!this.disabled&&this.value},enumerable:!0,configurable:!0}),e.prototype.ngOnInit=function(){var e=this;this.searchFn||(this.searchFn=function(t){return n.of((e.options?e.options:[]).map((function(e,t){return{option:e,id:t}})).filter((function(i){return-1!==e.formatter(i.option).toLowerCase().indexOf(t.toLowerCase())})))}),this.multiple||(this.isSelectAll=!1),this.setI18nText(),this.registerFilterChange()},e.prototype.ngAfterViewInit=function(){this.autoFocus&&this.selectBoxElement&&this.selectBoxElement.nativeElement.focus({preventScroll:this.notAutoScroll}),this.selectBoxElement&&(this.width=this.width?this.width:this.selectBoxElement.nativeElement.offsetWidth)},e.prototype.ngOnDestroy=function(){this.sourceSubscription&&this.sourceSubscription.unsubscribe(),this.filterSubscription&&this.filterSubscription.unsubscribe(),this.i18nSubscription&&this.i18nSubscription.unsubscribe(),document.removeEventListener("click",this.onDocumentClick)},e.prototype.ngOnChanges=function(e){e&&(e.searchFn||e.options)&&this.resetSource()},e.prototype.setI18nText=function(){var e=this;this.i18nCommonText=this.i18n.getI18nText().common,this.i18nSubscription=this.i18n.langChange().subscribe((function(t){e.i18nCommonText=t.common}))},e.prototype.getVirtualScrollHeight=function(e,t){if(e>0){var i=this.templateItemSize?this.templateItemSize*e:this.virtualScrollItemSize[t||"normal"]*e;return this.isSelectAll&&this.multiple&&(i+=this.virtualScrollItemSize[t||"normal"]),i>parseInt(this.scrollHight,10)?this.scrollHight:i+"px"}},e.prototype.getVirtualScrollItemSize=function(e){return this.templateItemSize?this.templateItemSize:this.virtualScrollItemSize[e||"normal"]},e.prototype.resetSource=function(){this.sourceSubscription&&this.searchFn&&(this.resetting=!0,this.sourceSubscription.next(""))},e.prototype.registerOnChange=function(e){this.onChange=e},e.prototype.registerOnTouched=function(e){this.onTouch=e},e.prototype.registerFilterChange=function(){var e=this;this.sourceSubscription=new n.BehaviorSubject(""),this.sourceSubscription.pipe(o.switchMap((function(t){return e.searchFn(t)}))).subscribe((function(t){if(e.availableOptions=t,e.setAvailableOptions(),e.changeDetectorRef.markForCheck(),e.appendToBody&&setTimeout((function(){e.connectedOverlay&&e.connectedOverlay.overlayRef&&e.connectedOverlay.overlayRef.updatePosition()})),e.isSelectAll){var i=[];e.multiItems.forEach((function(t){e.availableOptions.forEach((function(e){t.id===e.id&&i.push(t)}))})),e.setChecked(i)}e.multiple||e.value&&(!e.availableOptions||e.availableOptions.find((function(t){return t.option===e.value})))||(e.selectIndex=e.availableOptions&&e.availableOptions.length>0?0:-1)})),this.sourceSubscription.subscribe((function(t){e.resetting&&""===t&&(e.writeValue(e.value),e.resetting=!1)})),this.searchInputValueChangeEvent()},e.prototype.searchInputValueChangeEvent=function(){var e=this;this.isSearch&&this.isOpen&&this.filterInputElement&&(this.filterInputElement.nativeElement.focus(),this.filterSubscription&&!this.appendToBody||(this.filterSubscription=n.fromEvent(this.filterInputElement.nativeElement,"input").pipe(o.map((function(e){return e.target.value})),o.tap((function(t){return e.onTouch()})),o.filter((function(t){return!e.disabled&&e.searchFn&&t.length>=0})),o.debounceTime(300)).subscribe((function(t){return e.filter=t,e.selectIndex=-1,e.sourceSubscription.next(t)}))))},e.prototype.writeValue=function(e){var t=this;if(null!=e){if(this.value=e,this.multiple)this.value=this.value?this.value:[],this.value=Array.isArray(this.value)?this.value:[this.value],this.multiItems=this.value.map((function(e,i){return{option:e,id:t.options.indexOf(e)}}));else{var i=this.availableOptions.find((function(e){return t.formatter(e.option)===t.formatter(t.value)}));this.activeIndex=i?i.id:-1,this.selectIndex=this.activeIndex?this.activeIndex:-1}this.writeIntoInput(this.value),this.changeDetectorRef.markForCheck(),this.setChecked(this.value)}},e.prototype.writeIntoInput=function(e){var t=this;this._inputValue=this.multiple?(e||[]).map((function(e){return t.valueParser(e)})).join(", "):this.valueParser(e),this.setAvailableOptions()},e.prototype.setAvailableOptions=function(){if(this.value&&Array.isArray(this.availableOptions)){var e=this.value;this.multiple||(e=[e]),this.availableOptions=this.availableOptions.map((function(t){return{isChecked:e.findIndex((function(e){return JSON.stringify(e)===JSON.stringify(t.option)}))>-1,id:t.id,option:t.option}}))}},e.prototype.updateCdkConnectedOverlayOrigin=function(){this.selectBoxElement.nativeElement&&(this.cdkConnectedOverlayOrigin=new s.CdkOverlayOrigin(this.selectBoxElement.nativeElement))},e.prototype.autoToggle=function(e){e.preventDefault(),e.stopPropagation(),!this.toggleOnFocus||this.disabled||this.isOpen||this.isMouseEvent||this.toggle()},e.prototype.setMouseEventTrue=function(e){this.isMouseEvent=!0},e.prototype.setMouseEventFalse=function(e){this.isMouseEvent=!1},e.prototype.toggle=function(){if(this.disabled)this.isOpen=!1;else{if(!this.isOpen)if(this.filter="",this.resetSource(),this.appendToBody)this.updateCdkConnectedOverlayOrigin();else{var e="";switch(this.direction){case"auto":e=this.isBottomRectEnough()?"bottom":"top";break;case"down":e="bottom";break;case"up":e="top";break;default:e="bottom"}this.popDirection=e}this.isOpen=!this.isOpen;var t=this;setTimeout((function(){t.searchInputValueChangeEvent()}),100)}},e.prototype.isBottomRectEnough=function(){var e,t=this.selectMenuElement.nativeElement,i=this.selectInputElement||this.selectInputWithLabelElement||this.selectInputWithTemplateElement,n=t.style.display||window.getComputedStyle(t).display;"none"===n&&(e={visibility:t.style.visibility,display:t.style.display,transform:t.style.transform},this.renderer.setStyle(t,"visibility","hidden"),this.renderer.setStyle(t,"display","block"),this.renderer.setStyle(t,"transform","translate(0, -9999)"));var o=t.offsetHeight,l=this.windowRef.innerHeight-i.nativeElement.getBoundingClientRect().bottom>=o;return"none"===n&&(this.renderer.setStyle(t,"visibility",e.visibility),this.renderer.setStyle(t,"display",e.display),this.renderer.setStyle(t,"transform",e.transform)),l},e.prototype.setDocumentClickListener=function(){var e=this;this.ngZone.runOutsideAngular((function(){e.isOpen?document.addEventListener("click",e.onDocumentClick):document.removeEventListener("click",e.onDocumentClick)}))},e.prototype.onEscKeyup=function(e){this.isOpen&&e.stopPropagation(),this.isOpen=!1},e.prototype.handleKeyUpEvent=function(e){this.isOpen&&(e.preventDefault(),e.stopPropagation(),this.selectIndex=0===this.selectIndex||-1===this.selectIndex?this.availableOptions.length-1:this.selectIndex-1,this.scrollToActive())},e.prototype.handleKeyDownEvent=function(e){this.isOpen&&(e.preventDefault(),e.stopPropagation(),this.selectIndex=this.selectIndex===this.availableOptions.length-1?0:this.selectIndex+1,this.scrollToActive())},e.prototype.scrollToActive=function(){var e=this;setTimeout((function(t){try{var i=e.selectIndex+(e.isSelectAll?1:0),n=e.dropdownUl.nativeElement.children[i];if(n.scrollIntoViewIfNeeded)n.scrollIntoViewIfNeeded(!1);else{var o=e.dropdownUl.nativeElement.getBoundingClientRect(),l=n.getBoundingClientRect();(l.bottom>o.bottom||l.top<o.top)&&n.scrollIntoView(!1)}}catch(e){}}))},e.prototype.handleKeyEnterEvent=function(e){if(this.isOpen){e.preventDefault(),e.stopPropagation();var t=this.availableOptions[this.selectIndex];t?this.choose(t.option,t.id,e):this.toggle()}else this.toggle()},e.prototype.removeItem=function(e,t){this.choose(e.option,e.id,t)},e.prototype.selectAll=function(){var e=this,t=this.optionImmutableKey?this.availableOptions.filter((function(t){return!t.option[e.optionImmutableKey]})):this.availableOptions,i=this.optionImmutableKey?this.multiItems.filter((function(t){return t.option[e.optionImmutableKey]})):[];t&&t.length>this.multiItems.length-i.length?t.map((function(t){-1===e.multiItems.findIndex((function(e){return JSON.stringify(e.option)===JSON.stringify(t.option)}))&&e.multiItems.push({id:t.id,option:t.option})})):this.multiItems=function(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(h(arguments[t]));return e}(i),this.value=this.multiItems.map((function(e){return e.option})),this.writeIntoInput(this.value),this.onChange(this.value),this.valueChange.emit(this.multiItems),this.setChecked(this.value)},e.prototype.trackByFn=function(e,t){return e},e.prototype.trackByOptionPointer=function(e,t){return t.option},e.prototype.loadMoreEvent=function(e){this.showLoading=!0,this.loadMore.emit({instance:this,event:e})},e.prototype.loadFinish=function(){this.showLoading=!1,this.changeDetectorRef.markForCheck()},e.prototype.loadStart=function(){this.showLoading=!0},e.prototype.onPositionChange=function(e){this.menuPosition=e.connectionPair.originY},e.prototype.animationEnd=function(e){var t=this;if(!this.isOpen&&this.selectMenuElement){var i=this.selectMenuElement.nativeElement;setTimeout((function(){t.renderer.setStyle(i,"display","none")}))}},e.prototype.setChecked=function(e){e&&this.isSelectAll&&(this.halfChecked=!1,e.length===this.availableOptions.length?this.allChecked=!0:0===e.length?this.allChecked=!1:this.halfChecked=!0)},e.prototype.showSelectAll=function(){return this.isSelectAll&&this.multiple&&this.availableOptions.length>0},e.prototype.forceSearchNext=function(){this.sourceSubscription.next(this.filter)},e.prototype.valueClear=function(e){e.stopPropagation(),this.value=null,this.resetStatus(),this.onChange(this.value),this.valueChange.emit(this.value)},e.prototype.resetStatus=function(){this.writeIntoInput(""),this.activeIndex=-1,this.selectIndex=-1,this.changeDetectorRef.markForCheck()},e.decorators=[{type:t.Component,args:[{selector:"d-select",template:'<div\r\n  class="devui-drop{{ popDirection === \'bottom\' ? \'down\' : \'up\' }} {{ size ? \'devui-select-\' + size : \'\' }}"\r\n  [ngClass]="{ open: isOpen }"\r\n>\r\n  <div\r\n    #selectBox\r\n    class="devui-form-group devui-has-feedback"\r\n    (click)="toggle()"\r\n    (focus)="autoToggle($event)"\r\n    [tabindex]="0"\r\n    (keydown.esc)="onEscKeyup($event)"\r\n    (keydown.ArrowUp)="handleKeyUpEvent($event)"\r\n    (keydown.ArrowDown)="handleKeyDownEvent($event)"\r\n    (keydown.enter)="handleKeyEnterEvent($event)"\r\n  >\r\n    <input\r\n      #selectInput\r\n      [placeholder]="placeholder"\r\n      [disabled]="disabled"\r\n      [ngClass]="[\r\n        size ? \'devui-select-input-\' + size : \'\',\r\n        overview === \'underlined\' ? \'devui-select-underlined-border\' : \'\',\r\n        isOpen ? \'no-radius\' : \'\'\r\n      ]"\r\n      type="text"\r\n      class="devui-form-control devui-select-input"\r\n      [minLength]="0"\r\n      autocomplete="off"\r\n      [tabindex]="-1"\r\n      [readonly]="readonly"\r\n      [attr.value]="_inputValue"\r\n      *ngIf="\r\n        !(extraConfig?.labelization?.enable && multiple) &&\r\n        !(!extraConfig?.labelization?.enable && extraConfig?.selectedItemWithTemplate?.enable && (inputItemTemplate || itemTemplate))\r\n      "\r\n    />\r\n    <div\r\n      #selectInputWithTemplate\r\n      class="devui-select-list-wrapper devui-form-control {{ size ? \'input-\' + size : \'\' }}"\r\n      [ngClass]="[overview === \'underlined\' ? \'devui-select-underlined-border\' : \'\', isOpen ? \'no-radius\' : \'\', disabled ? \'disabled\' : \'\']"\r\n      *ngIf="extraConfig?.selectedItemWithTemplate?.enable && (inputItemTemplate || itemTemplate) && !extraConfig?.labelization?.enable"\r\n    >\r\n      <div class="devui-select-placeholder" *ngIf="!_inputValue">\r\n        {{ placeholder }}\r\n      </div>\r\n      <div class="devui-select-selected-item-with-template" *ngIf="_inputValue">\r\n        <ng-template\r\n          [ngTemplateOutlet]="inputItemTemplate || itemTemplate"\r\n          [ngTemplateOutletContext]="{\r\n            option: value,\r\n            filterKey: filterKey,\r\n            position: \'result\',\r\n            inputValue: _inputValue\r\n          }"\r\n        >\r\n        </ng-template>\r\n      </div>\r\n    </div>\r\n\r\n    <div\r\n      #selectInputWithLabel\r\n      class="devui-select-list-wrapper devui-form-control {{ size ? \'input-\' + size : \'\' }}"\r\n      [ngClass]="[overview === \'underlined\' ? \'devui-select-underlined-border\' : \'\', isOpen ? \'no-radius\' : \'\', disabled ? \'disabled\' : \'\']"\r\n      *ngIf="extraConfig?.labelization?.enable && multiple"\r\n    >\r\n      <div class="devui-select-placeholder" *ngIf="multiItems.length === 0">\r\n        {{ placeholder }}\r\n      </div>\r\n      <ul\r\n        class="devui-select-tag-list {{ extraConfig?.labelization?.overflow }}"\r\n        [style.maxHeight]="extraConfig?.labelization?.containnerMaxHeight"\r\n        *ngIf="multiItems.length > 0"\r\n      >\r\n        <li\r\n          class="devui-select-tag-item"\r\n          *ngFor="let item of multiItems; let index = index; trackBy: trackByOptionPointer"\r\n          [style.maxWidth]="extraConfig?.labelization?.labelMaxWidth"\r\n          [ngClass]="{\r\n            disabled: optionDisabledKey && item.option[optionDisabledKey]\r\n          }"\r\n        >\r\n          <span class="over-flow-ellipsis" title="{{ valueParser(item.option) }}">{{ valueParser(item.option) }}</span>\r\n          <a\r\n            class="devui-select-tag-remove-button"\r\n            (click)="removeItem(item, $event)"\r\n            *ngIf="!(optionDisabledKey && item.option[optionDisabledKey])"\r\n          ></a>\r\n        </li>\r\n      </ul>\r\n    </div>\r\n\r\n    <span class="devui-form-control-feedback" [ngClass]="{ \'devui-clear-icon-show\': isClearIconShow }">\r\n      <span class="devui-select-clear-icon" (mousedown)="$event.preventDefault()" (click)="valueClear($event)"> </span>\r\n      <span class="devui-select-chevron-icon">\r\n        <svg\r\n          width="16px"\r\n          height="16px"\r\n          viewBox="0 0 16 16"\r\n          version="1.1"\r\n          xmlns="http://www.w3.org/2000/svg"\r\n          xmlns:xlink="http://www.w3.org/1999/xlink"\r\n        >\r\n          <g id="chevron_down" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">\r\n            <polygon id="chevron_down" points="4.5 5 8 8.76923077 11.5 5 13 6.61538462 8 12 3 6.61538462"></polygon>\r\n          </g>\r\n        </svg>\r\n      </span>\r\n    </span>\r\n  </div>\r\n  <ng-container *ngIf="appendToBody">\r\n    <ng-template\r\n      cdk-connected-overlay\r\n      [cdkConnectedOverlayOrigin]="cdkConnectedOverlayOrigin"\r\n      [cdkConnectedOverlayWidth]="width"\r\n      [cdkConnectedOverlayOpen]="isOpen"\r\n      (positionChange)="onPositionChange($event)"\r\n      (backdropClick)="isOpen = false"\r\n    >\r\n      <ng-template [ngTemplateOutlet]="selectDropdownTpl"></ng-template>\r\n    </ng-template>\r\n  </ng-container>\r\n  <ng-container *ngIf="!appendToBody">\r\n    <ng-template [ngTemplateOutlet]="selectDropdownTpl"></ng-template>\r\n  </ng-container>\r\n</div>\r\n\r\n\x3c!--下拉模板--\x3e\r\n<ng-template #selectDropdownTpl>\r\n  <div\r\n    #selectMenu\r\n    class="devui-dropdown-menu"\r\n    [ngClass]="{\r\n      \'devui-dropdown-menu-cdk\': appendToBody,\r\n      \'devui-custom-right\': customViewTemplate && customViewDirection === \'right\'\r\n    }"\r\n    [@fadeInOut]="isOpen ? (appendToBody ? menuPosition : popDirection) : \'void\'"\r\n    (@fadeInOut.done)="animationEnd($event)"\r\n  >\r\n    <ul\r\n      dLoading\r\n      [showLoading]="showLoading"\r\n      positionType="relative"\r\n      [message]="i18nCommonText?.loading"\r\n      [backdrop]="true"\r\n      class="devui-dropdown-menu-wrap {{ size ? \'devui-dropdown-menu-\' + size : \'\' }}"\r\n      (click)="$event.stopPropagation(); $event.preventDefault()"\r\n    >\r\n      <li [style.display]="isSearch ? \'block\' : \'none\'" style="padding: 0 5px 5px;">\r\n        <div class="devui-form-group devui-has-feedback" [style.margin]="\'0\'">\r\n          <input\r\n            #filterInput\r\n            [ngClass]="size ? \'devui-select-input-\' + size : \'\'"\r\n            name="select"\r\n            type="text"\r\n            [ngModel]="filter"\r\n            autocomplete="off"\r\n            class="devui-form-control filter"\r\n            (keydown.ArrowUp)="handleKeyUpEvent($event)"\r\n            (keydown.ArrowDown)="handleKeyDownEvent($event)"\r\n            (keydown.enter)="handleKeyEnterEvent($event)"\r\n            (keydown.esc)="onEscKeyup($event)"\r\n          />\r\n          <span class="devui-form-control-feedback">\r\n            <svg\r\n              class="svg-icon-search"\r\n              width="1em"\r\n              height="1em"\r\n              style="vertical-align: middle"\r\n              viewBox="0 0 1024 1024"\r\n              version="1.1"\r\n              xmlns="http://www.w3.org/2000/svg"\r\n              xmlns:xlink="http://www.w3.org/1999/xlink"\r\n            >\r\n              <path\r\n                d="M1024 900.584l-121.376 123.2L618.672 735.464c-63.44 43.768-140 69.392-222.44 69.392C177.376 804.848 0 624.712 0 402.536 0 180.336 177.376 0.208 396.232 0.208s396.232 180.144 396.232 402.328c0 75.328-20.752 145.576-56.248 205.872L1024 900.584zM396.232 128.944c-148.8 0-269.456 122.504-269.456 273.592 0 151.08 120.656 273.576 269.456 273.576 148.832 0 269.456-122.504 269.456-273.576C665.688 251.448 545.08 128.944 396.232 128.944z"\r\n              ></path>\r\n            </svg>\r\n          </span>\r\n        </div>\r\n      </li>\r\n      <ul\r\n        *ngIf="!virtualScroll || enableLazyLoad; else scrollViewTpl"\r\n        class="devui-select-list-unstyled devui-scrollbar"\r\n        dLazyLoad\r\n        [enableLazyLoad]="enableLazyLoad"\r\n        (loadMore)="loadMoreEvent($event)"\r\n        [ngStyle]="{ \'max-height\': scrollHight, width: \'100%\' }"\r\n        #dropdownUl\r\n      >\r\n        <ng-template [ngTemplateOutlet]="selectAllTpl"></ng-template>\r\n        <ng-container *ngFor="let item of availableOptions; let index = index; trackBy: trackByFn">\r\n          <ng-template [ngTemplateOutlet]="dropdownItemTpl" [ngTemplateOutletContext]="{ item: item, index: index }"></ng-template>\r\n        </ng-container>\r\n      </ul>\r\n      <li *ngIf="availableOptions.length === 0 && !noResultItemTemplate" class="devui-no-data-tip">\r\n        <ng-container *ngIf="!filter">{{ i18nCommonText?.noData }}</ng-container>\r\n        <ng-container *ngIf="filter">{{ i18nCommonText?.noRecordsFound }}</ng-container>\r\n      </li>\r\n      <li *ngIf="availableOptions.length === 0 && noResultItemTemplate">\r\n        <ng-template [ngTemplateOutlet]="noResultItemTemplate" [ngTemplateOutletContext]="{ options: options }"></ng-template>\r\n      </li>\r\n    </ul>\r\n    <ng-container *ngIf="customViewTemplate">\r\n      <div class="devui-select-custom-area">\r\n        <ng-template [ngTemplateOutlet]="customViewTemplate" [ngTemplateOutletContext]="{ $implicit: this, choose: choose}"></ng-template>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n\r\n\x3c!--虚拟滚动模板--\x3e\r\n<ng-template #scrollViewTpl>\r\n  <cdk-virtual-scroll-viewport\r\n    [ngStyle]="{\r\n      height: getVirtualScrollHeight(availableOptions.length, size)\r\n    }"\r\n    [itemSize]="getVirtualScrollItemSize(size)"\r\n    class="viewport-wrapper devui-select-list-unstyled devui-scrollbar"\r\n    [ngStyle]="{ \'max-height\': scrollHight, width: \'100%\' }"\r\n    #dropdownUl\r\n  >\r\n    <ng-template [ngTemplateOutlet]="selectAllTpl"></ng-template>\r\n    <ng-container *cdkVirtualFor="let item of availableOptions; let index = index; trackBy: trackByFn">\r\n      <ng-template [ngTemplateOutlet]="dropdownItemTpl" [ngTemplateOutletContext]="{ item: item, index: index }"></ng-template>\r\n    </ng-container>\r\n  </cdk-virtual-scroll-viewport>\r\n</ng-template>\r\n\r\n\x3c!--全选模板--\x3e\r\n<ng-template #selectAllTpl>\r\n  <li class="devui-dropdown-item" *ngIf="showSelectAll()" (click)="selectAll()">\r\n    <span>\r\n      <d-checkbox [label]="i18nCommonText.checkAll" [isShowTitle]="false" [halfchecked]="halfChecked" [(ngModel)]="allChecked"></d-checkbox>\r\n    </span>\r\n  </li>\r\n</ng-template>\r\n\r\n\x3c!--下拉Item模板--\x3e\r\n<ng-template #dropdownItemTpl let-item="item" let-index="index">\r\n  <li\r\n    title="{{ formatter(item.option) }}"\r\n    [ngClass]="[\r\n      \'devui-dropdown-item\',\r\n      item.isChecked ? hightLightItemClass : \'\',\r\n      selectIndex === index && item.id !== activeIndex ? \'selected\' : \'\',\r\n      optionDisabledKey && item.option[optionDisabledKey] ? \'disabled\' : \'\'\r\n    ]"\r\n    (click)="choose(item.option, item.id, $event)"\r\n  >\r\n    <ng-template\r\n      [ngTemplateOutlet]="inputItemTemplate || itemTemplate || (multiple ? checkBoxItem : defaultItem)"\r\n      [ngTemplateOutletContext]="\r\n        multiple\r\n          ? {\r\n              option: item.option,\r\n              checked: item.isChecked,\r\n              filterKey: filterKey,\r\n              position: \'list\',\r\n              template: checkBoxItem\r\n            }\r\n          : {\r\n              option: item.option,\r\n              filterKey: filterKey,\r\n              position: \'list\',\r\n              template: defaultItem\r\n            }\r\n      "\r\n    >\r\n    </ng-template>\r\n  </li>\r\n</ng-template>\r\n\r\n<ng-template #defaultItem let-option="option">\r\n  {{ formatter(option) }}\r\n</ng-template>\r\n\r\n<ng-template #checkBoxItem let-option="option" let-checked="checked">\r\n  <d-checkbox\r\n    [color]="color"\r\n    [label]="formatter(option)"\r\n    [cssClass]="\'devui-select-checkbox\'"\r\n    [ngModel]="checked"\r\n    [disabled]="option[optionDisabledKey]"\r\n  >\r\n  </d-checkbox>\r\n</ng-template>\r\n',exportAs:"select",changeDetection:t.ChangeDetectionStrategy.OnPush,providers:[{provide:i.NG_VALUE_ACCESSOR,useExisting:t.forwardRef((function(){return e})),multi:!0}],animations:[d.fadeInOut],styles:["@charset \"UTF-8\";.devui-dropdown-menu{width:100%}.devui-dropdown-menu.devui-custom-right{min-width:400px;display:-webkit-box!important;display:flex!important}.devui-dropdown-menu.devui-custom-right>.devui-dropdown-menu-wrap{display:inline-block;width:calc(50% - 1px)}.devui-dropdown-menu.devui-custom-right>.devui-select-custom-area{display:inline-block;overflow:auto;width:50%;border-left:1px solid #dfe1e6}.devui-dropdown-menu.devui-custom-right>.devui-select-custom-area::before{display:none}.devui-dropdown-menu .devui-dropdown-menu-wrap{position:initial}.devui-dropdown-menu-cdk{position:static;display:block;border:none}.devui-form-group.devui-has-feedback[tabindex]{outline:0}.devui-form-group.devui-has-feedback:focus .devui-select-list-wrapper.devui-form-control:not(.disabled):not([disabled]),.devui-form-group.devui-has-feedback:focus input.devui-form-control.devui-select-input:not(.disabled):not([disabled]){border-color:#5e7ce0}.devui-select-list-wrapper.devui-form-control,.devui-select-placeholder,.devui-select-selected-item-with-template{font-size:14px}.devui-form-group>input.devui-form-control.devui-select-input{cursor:pointer;padding-right:2em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.devui-select-list-wrapper.devui-form-control{cursor:pointer;height:auto;margin:0;padding:2px 30px 0 2px}.devui-dropdown-item{font-size:14px;display:block;min-height:36px;line-height:20px;width:100%;padding:8px 13px;clear:both;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border:0;color:#252b3a}.devui-dropdown-item input[name=search]{font-size:14px}.devui-dropdown-item ::ng-deep .devui-select-checkbox label{max-width:calc(100%);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px}.devui-dropdown-item.selected ::ng-deep .devui-select-checkbox .checkbox-label{color:#5e7ce0}.devui-dropdown-item.active ::ng-deep .devui-select-checkbox .checkbox-label{color:#5e7ce0}.devui-select-lg{font-size:18px;min-height:46px;line-height:28px}.devui-select-lg .devui-select-list-wrapper.devui-form-control,.devui-select-lg .devui-select-placeholder,.devui-select-lg .devui-select-selected-item-with-template{font-size:18px}.devui-select-lg .devui-dropdown-item{font-size:18px;min-height:40px;line-height:28px}.devui-select-lg .devui-dropdown-item input[name=search]{font-size:18px}.devui-select-lg ::ng-deep .devui-checkbox,.devui-select-lg ::ng-deep .devui-select-checkbox label .checkbox-label{font-size:18px;line-height:28px}.devui-select-lg ::ng-deep .devui-checkbox-material{width:18px;height:18px}.devui-select-sm{font-size:12px;min-height:30px;line-height:14px}.devui-select-sm .devui-select-list-wrapper.devui-form-control,.devui-select-sm .devui-select-placeholder,.devui-select-sm .devui-select-selected-item-with-template{font-size:12px}.devui-select-sm .devui-dropdown-item{font-size:12px;min-height:30px;line-height:14px}.devui-select-sm .devui-dropdown-item input[name=search]{font-size:12px}.devui-select-sm ::ng-deep .devui-select-checkbox label .checkbox-label{font-size:12px;line-height:16px}.devui-select-sm ::ng-deep .devui-checkbox-material{width:12px;height:12px}.devui-dropdown-menu-lg .devui-dropdown-item{font-size:18px;min-height:40px;line-height:28px}.devui-dropdown-menu-lg .devui-dropdown-item input[name=search]{font-size:18px}.devui-dropdown-menu-lg ::ng-deep .devui-checkbox,.devui-dropdown-menu-lg ::ng-deep .devui-select-checkbox label .checkbox-label{font-size:18px;line-height:28px}.devui-dropdown-menu-lg ::ng-deep .devui-checkbox-material{width:18px;height:18px}.devui-dropdown-menu-sm .devui-dropdown-item{font-size:12px;min-height:30px;line-height:14px}.devui-dropdown-menu-sm .devui-dropdown-item input[name=search]{font-size:12px}.devui-dropdown-menu-sm ::ng-deep .devui-select-checkbox label .checkbox-label{font-size:12px;line-height:16px}.devui-dropdown-menu-sm ::ng-deep .devui-checkbox-material{width:12px;height:12px}div.devui-dropdown-menu{margin-bottom:5px;cursor:pointer;min-width:auto;box-shadow:0 4px 8px 0 rgba(41,48,64,.2)}div.devui-dropdown-menu .devui-select-list-unstyled,div.devui-dropdown-menu>ul.devui-select-list-unstyled{overflow-y:auto}div.devui-dropdown-menu .devui-select-list-unstyled li:hover:not(.active):not(.disabled),div.devui-dropdown-menu>ul.devui-select-list-unstyled li:hover:not(.active):not(.disabled){background-color:#f2f5fc}div.devui-dropdown-menu .devui-select-list-unstyled li.active,div.devui-dropdown-menu .devui-select-list-unstyled li.active:hover,div.devui-dropdown-menu .devui-select-list-unstyled li.selected,div.devui-dropdown-menu>ul.devui-list-unstyled li.active,div.devui-dropdown-menu>ul.devui-list-unstyled li.active:hover,div.devui-dropdown-menu>ul.devui-select-list-unstyled li.selected{background-color:#f2f5fc;color:#5e7ce0}.devui-has-feedback{z-index:5}.devui-form-control,.devui-form-group .devui-form-control{border-radius:1px;box-shadow:none}.devui-form-control.no-radius,.devui-form-group .devui-form-control.no-radius{border-radius:1px 1px 0 0}.devui-form-control:focus:not(.disabled):not(:disabled),.devui-form-control:hover:not(.disabled):not(:disabled),.devui-form-group .devui-form-control.devui-select-underlined-border:focus:not(.disabled):not(:disabled),.devui-form-group .devui-form-control.devui-select-underlined-border:hover:not(.disabled):not(:disabled),.devui-form-group .devui-form-control:focus:not(.disabled):not(:disabled),.devui-form-group .devui-form-control:hover:not(.disabled):not(:disabled){border-color:#344899}.devui-form-group .devui-form-control.devui-select-underlined-border{border:0;border-bottom:1px solid #adb0b8;border-radius:0}.devui-form-control.devui-select-input-lg{line-height:1.3333333;height:46px}.devui-form-control.devui-select-input-lg+.devui-form-control-feedback{height:46px;width:46px;line-height:46px}.devui-form-control.devui-select-input-sm{line-height:1.5;height:30px}.devui-form-control.devui-select-input-sm+.devui-form-control-feedback{height:30px;width:30px;line-height:30px}.devui-select-list-wrapper .devui-select-selected-item-with-template{height:28px;line-height:28px;padding:0 10px;cursor:pointer}.devui-select-list-wrapper .devui-select-placeholder{height:28px;line-height:28px;color:#8a8e99;padding-left:10px}.devui-select-list-wrapper .devui-select-tag-list{height:28px;margin:0;padding:0;list-style-type:none;overflow:hidden}.devui-select-list-wrapper .devui-select-tag-list.normal{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.devui-select-list-wrapper .devui-select-tag-list.scroll-y{overflow-y:auto;overflow-x:hidden}.devui-select-list-wrapper .devui-select-tag-list.multiple-line{height:auto;overflow-y:auto;overflow-x:hidden;line-height:1.42857143}.devui-select-list-wrapper .devui-select-tag-item{display:inline-block;margin:3px 2px 0;padding:0 5px;min-height:20px;line-height:20px;max-height:20px;border-radius:1px;color:#252b3a;background:#eef0f5;max-width:100%;position:relative}.devui-select-list-wrapper .devui-select-tag-item span{display:inline-block;max-width:100%;padding-right:14px}.devui-select-list-wrapper .devui-select-tag-item.disabled span{padding-right:5px}.devui-select-list-wrapper .devui-select-tag-item .devui-select-tag-remove-button{position:absolute;right:2px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);line-height:20px;color:#252b3a;width:1em;height:1em;display:block;-webkit-transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s;pointer-events:auto;cursor:pointer}.devui-select-list-wrapper .devui-select-tag-item .devui-select-tag-remove-button::after,.devui-select-list-wrapper .devui-select-tag-item .devui-select-tag-remove-button::before{position:absolute;content:'';height:.6em;width:.0715em;background-color:#252b3a;left:calc(50% - 1px);top:.25em;-webkit-transform-origin:center;transform-origin:center}.devui-select-list-wrapper .devui-select-tag-item .devui-select-tag-remove-button::before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.devui-select-list-wrapper .devui-select-tag-item .devui-select-tag-remove-button::after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.devui-select-list-wrapper .over-flow-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.devui-select-list-wrapper.devui-select-input-lg{line-height:1.3333333}.devui-select-list-wrapper.devui-select-input-lg .devui-select-placeholder,.devui-select-list-wrapper.devui-select-input-lg .devui-select-selected-item-with-template,.devui-select-list-wrapper.devui-select-input-lg .devui-select-tag-list{height:42px}.devui-select-list-wrapper.devui-select-input-lg .devui-select-placeholder,.devui-select-list-wrapper.devui-select-input-lg .devui-select-selected-item-with-template{line-height:42px}.devui-select-list-wrapper.devui-select-input-lg .devui-select-tag-item{margin:7px 3px 0;padding:0 5px;min-height:26px;line-height:26px;max-height:26px}.devui-select-list-wrapper.devui-select-input-sm{line-height:1.5}.devui-select-list-wrapper.devui-select-input-sm .devui-select-placeholder,.devui-select-list-wrapper.devui-select-input-sm .devui-select-selected-item-with-template,.devui-select-list-wrapper.devui-select-input-sm .devui-select-tag-list{height:26px}.devui-select-list-wrapper.devui-select-input-sm .devui-select-placeholder,.devui-select-list-wrapper.devui-select-input-sm .devui-select-selected-item-with-template{line-height:26px}.devui-select-list-wrapper.devui-select-input-sm .devui-select-tag-item{margin:3px 2px 0;padding:0 5px;min-height:18px;line-height:18px;max-height:18px}.devui-dropdown-item.disabled,.devui-dropdown-item.disabled:hover,div.devui-dropdown-menu .devui-select-list-unstyled li.disabled:hover,div.devui-dropdown-menu li.disabled:hover,div.devui-dropdown-menu>ul.devui-select-list-unstyled li.disabled:hover{cursor:not-allowed;opacity:.3;color:#252b3a;background:#fff}div.devui-dropdown-menu .devui-select-list-unstyled li.active.disabled:hover,div.devui-dropdown-menu>ul.devui-select-list-unstyled li.active.disabled:hover{background:#f2f5fc}.devui-dropdown-menu .devui-select-list-unstyled li.disabled ::ng-deep .devui-checkbox.disabled,.devui-dropdown-menu>ul.devui-select-list-unstyled li.disabled ::ng-deep .devui-checkbox.disabled,:host ::ng-deep .devui-dropdown-menu .devui-select-list-unstyled li.disabled .devui-checkbox.disabled,:host ::ng-deep .devui-dropdown-menu>ul.devui-select-list-unstyled li.disabled .devui-checkbox.disabled{opacity:1}.devui-no-data-tip{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:not-allowed;padding:5px 12px;opacity:.3}.devui-form-control.devui-select-input:disabled,.devui-form-group .devui-form-control.devui-select-input:disabled,.devui-select-list-wrapper.devui-form-control.disabled{cursor:not-allowed}.devui-select-list-wrapper.devui-form-control.disabled{opacity:.3}.devui-form-control-feedback .devui-select-chevron-icon{background:0 0}.devui-form-control.devui-select-input:disabled+.devui-form-control-feedback,.devui-select-list-wrapper.devui-form-control.disabled+.devui-form-control-feedback{opacity:.3}.devui-select-custom-area::before{display:block;content:'';width:calc(100% - 20px);margin:0 10px;height:1px;border-top:1px solid #dfe1e6}svg.svg-icon-search>path{fill:#252b3a}.open .devui-select-chevron-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.devui-select-chevron-icon{display:-webkit-inline-box;display:inline-flex;vertical-align:middle;-webkit-transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s}.devui-select-chevron-icon svg>g>polygon{fill:#252b3a}.devui-form-group.devui-has-feedback:hover .devui-form-control:not(.disabled):not([disabled]){border-color:#344899}.devui-form-group.devui-has-feedback:hover .devui-form-control-feedback.devui-clear-icon-show .devui-select-chevron-icon{display:none}.devui-form-group.devui-has-feedback:hover .devui-form-control-feedback.devui-clear-icon-show .devui-select-clear-icon{display:-webkit-inline-box;display:inline-flex;vertical-align:middle}.devui-select-clear-icon{width:14px;height:14px;display:none;-webkit-transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s;pointer-events:auto;cursor:pointer}.devui-select-clear-icon::after,.devui-select-clear-icon::before{position:absolute;content:'';height:14px;width:2px;background-color:#252b3a;left:50%}.devui-select-clear-icon::before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.devui-select-clear-icon::after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}input::-ms-clear{display:none}.devui-dropup .devui-dropdown-menu{top:auto;bottom:100%}"]}]}],e.ctorParameters=function(){return[{type:t.Renderer2},{type:l.WindowRef},{type:t.ChangeDetectorRef},{type:r.I18nService},{type:t.NgZone}]},e.propDecorators={options:[{type:t.Input}],isSearch:[{type:t.Input}],toggleOnFocus:[{type:t.Input}],scrollHight:[{type:t.Input}],hightLightItemClass:[{type:t.Input}],filterKey:[{type:t.Input}],multiple:[{type:t.Input}],isSelectAll:[{type:t.Input}],readonly:[{type:t.Input}],size:[{type:t.Input}],appendToBody:[{type:t.Input}],width:[{type:t.Input}],templateItemSize:[{type:t.Input}],disabled:[{type:t.Input}],placeholder:[{type:t.Input}],searchFn:[{type:t.Input}],valueParser:[{type:t.Input}],formatter:[{type:t.Input}],direction:[{type:t.Input}],overview:[{type:t.Input}],allowClear:[{type:t.Input}],color:[{type:t.Input}],enableLazyLoad:[{type:t.Input}],virtualScroll:[{type:t.Input}],inputItemTemplate:[{type:t.Input}],itemTemplate:[{type:t.ContentChild,args:[t.TemplateRef,{static:!1}]}],valueChange:[{type:t.Output}],toggleChange:[{type:t.Output}],loadMore:[{type:t.Output}],extraConfig:[{type:t.Input}],optionDisabledKey:[{type:t.Input}],optionImmutableKey:[{type:t.Input}],noResultItemTemplate:[{type:t.Input}],keepMultipleOrder:[{type:t.Input}],customViewTemplate:[{type:t.Input}],customViewDirection:[{type:t.Input}],autoFocus:[{type:t.Input}],notAutoScroll:[{type:t.Input}],selectInputElement:[{type:t.ViewChild,args:["selectInput",{static:!1}]}],selectMenuElement:[{type:t.ViewChild,args:["selectMenu",{static:!1}]}],selectBoxElement:[{type:t.ViewChild,args:["selectBox",{static:!0}]}],selectInputWithTemplateElement:[{type:t.ViewChild,args:["selectInputWithTemplate",{static:!1}]}],selectInputWithLabelElement:[{type:t.ViewChild,args:["selectInputWithLabel",{static:!1}]}],filterInputElement:[{type:t.ViewChild,args:["filterInput",{static:!1}]}],dropdownUl:[{type:t.ViewChild,args:["dropdownUl",{static:!1}]}],connectedOverlay:[{type:t.ViewChild,args:[s.CdkConnectedOverlay,{static:!1}]}],setMouseEventTrue:[{type:t.HostListener,args:["mousedown",["$event"]]}],setMouseEventFalse:[{type:t.HostListener,args:["mouseup",["$event"]]}]},e}();var m=function(){function e(){}return e.decorators=[{type:t.NgModule,args:[{imports:[u.CommonModule,i.FormsModule,s.OverlayModule,a.ScrollingModule,p.CheckBoxModule,c.LoadingModule,d.LazyLoadModule],exports:[v],declarations:[v],providers:[l.WindowRef,l.DocumentRef]}]}],e}();e.SelectComponent=v,e.SelectModule=m,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=ng-devui-select.umd.min.js.map