New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
ionic-selectable
Advanced tools
ionic-selectable - npm Package Compare versions
Comparing version 4.0.0 to 4.1.0
@@ -1,2 +0,2 @@ | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("@ionic/angular"),require("@angular/common")):"function"==typeof define&&define.amd?define("ionic-selectable",["exports","@angular/core","@angular/forms","@ionic/angular","@angular/common"],t):t(e["ionic-selectable"]={},e.ng.core,e.ng.forms,e.angular,e.ng.common)}(this,function(e,l,t,n,i){"use strict";function o(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var i,o,s=n.call(e),l=[];try{for(;(void 0===t||0<t--)&&!(i=s.next()).done;)l.push(i.value)}catch(a){o={error:a}}finally{try{i&&!i.done&&(n=s["return"])&&n.call(s)}finally{if(o)throw o.error}}return l}function s(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(o(arguments[t]));return e}var a=function(){function e(e,t,n,i,o,s){this._modalController=e,this._platform=t,this.ionItem=n,this._iterableDiffers=i,this._element=o,this._renderer=s,this._cssClass=!0,this._isOnSearchEnabled=!0,this._isEnabled=!0,this._isOpened=!1,this._value=null,this._canClear=!1,this._isMultiple=!1,this.onItemsChange=new l.EventEmitter,this._valueItems=[],this._searchText="",this._hasSearchText=!1,this._groups=[],this._itemsToConfirm=[],this._selectedItems=[],this._filteredGroups=[],this._footerButtonsCount=0,this.items=[],this.itemsChange=new l.EventEmitter,this.isOkButtonEnabled=!0,this.itemValueField=null,this.itemTextField=null,this.canSearch=!1,this.hasInfiniteScroll=!1,this.hasVirtualScroll=!1,this.virtualScrollApproxItemHeight="40px",this.searchPlaceholder="Search",this.placeholder=null,this.searchFailText="No items found.",this.clearButtonText="Clear",this.okButtonText="OK",this.closeButtonText="Cancel",this.shouldFocusSearchbar=!1,this.headerColor=null,this.onChange=new l.EventEmitter,this.onSearch=new l.EventEmitter,this.onInfiniteScroll=new l.EventEmitter,this.onOpen=new l.EventEmitter,this.onClose=new l.EventEmitter,this.searchDebounce=250,this.shouldStoreItemValue=!1,this.propagateOnChange=function(e){},this.propagateOnTouched=function(){},this.items&&this.items.length||(this.items=[]),this._itemsDiffer=this._iterableDiffers.find(this.items).create()}return Object.defineProperty(e.prototype,"_isMultipleCssClass",{get:function(){return this.isMultiple},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasValueCssClass",{get:function(){return this.hasValue()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasPlaceholderCssClass",{get:function(){return this._hasPlaceholder},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasInfiniteScroll",{get:function(){return!!(this.isEnabled&&this._selectPageComponent&&this._selectPageComponent._infiniteScroll)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_shouldStoreItemValue",{get:function(){return this.shouldStoreItemValue&&this._hasObjects},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"searchText",{get:function(){return this._searchText},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isSearching",{get:function(){return this._isSearching},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"hasSearchText",{get:function(){return this._hasSearchText},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"value",{get:function(){return this._value},set:function(e){this._value=e,this._valueItems.splice(0,this._valueItems.length),this.isMultiple?e&&e.length&&Array.prototype.push.apply(this._valueItems,e):this._isNullOrWhiteSpace(e)||this._valueItems.push(e),this._setIonItemHasValue(),this._setHasPlaceholder()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isEnabled",{get:function(){return this._isEnabled},set:function(e){this._isEnabled=!!e,this.enableIonItem(this._isEnabled)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isOpened",{get:function(){return this._isOpened},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isOnSearchEnabled",{get:function(){return this._isOnSearchEnabled},set:function(e){this._isOnSearchEnabled=!!e},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"canClear",{get:function(){return this._canClear},set:function(e){this._canClear=!!e,this._countFooterButtons()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isMultiple",{get:function(){return this._isMultiple},set:function(e){this._isMultiple=!!e,this._countFooterButtons()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"itemsToConfirm",{get:function(){return this._itemsToConfirm},enumerable:!0,configurable:!0}),e.prototype.initFocus=function(){},e.prototype.enableIonItem=function(e){this.ionItem&&(this.ionItem.disabled=!e)},e.prototype._isNullOrWhiteSpace=function(e){return null===e||e===undefined||e.toString().replace(/\s/g,"").length<1},e.prototype._setHasSearchText=function(){this._hasSearchText=!this._isNullOrWhiteSpace(this._searchText)},e.prototype._hasOnSearch=function(){return this.isOnSearchEnabled&&0<this.onSearch.observers.length},e.prototype._select=function(e){this.value=e,this._emitValueChange()},e.prototype._emitValueChange=function(){this.propagateOnChange(this.value),this.onChange.emit({component:this,value:this.value})},e.prototype._emitSearch=function(){this.canSearch&&this.onSearch.emit({component:this,text:this._searchText})},e.prototype._formatItem=function(e){return this._isNullOrWhiteSpace(e)?null:this.itemTextField?e[this.itemTextField]:e.toString()},e.prototype._getLabelText=function(){var e=this._ionItemElement?this._ionItemElement.querySelector("ion-label"):null;return e?e.textContent:null},e.prototype._getItemValue=function(e){return this._hasObjects?e[this.itemValueField]:e},e.prototype._getStoredItemValue=function(e){return this._hasObjects?this._shouldStoreItemValue?e:e[this.itemValueField]:e},e.prototype._onSearchbarClear=function(){this._searchText=""},e.prototype._filterItems=function(){var n=this;if(this._setHasSearchText(),this._hasOnSearch())this._emitSearch();else{var i=[];if(this._searchText&&this._searchText.trim()){var o=this._searchText.trim().toLowerCase();this._groups.forEach(function(e){var t=e.items.filter(function(e){return-1!==(n.itemTextField?e[n.itemTextField]:e).toString().toLowerCase().indexOf(o)});t.length&&i.push({value:e.value,text:e.text,items:t})}),i.length||i.push({items:[]})}else i=this._groups;this._filteredGroups=i}},e.prototype._isItemSelected=function(t){var n=this;return this._selectedItems.find(function(e){return n._getItemValue(t)===n._getStoredItemValue(e)})!==undefined},e.prototype._addSelectedItem=function(e){this._shouldStoreItemValue?this._selectedItems.push(this._getItemValue(e)):this._selectedItems.push(e)},e.prototype._deleteSelectedItem=function(n){var i,o=this;this._selectedItems.forEach(function(e,t){o._getItemValue(n)===o._getStoredItemValue(e)&&(i=t)}),this._selectedItems.splice(i,1)},e.prototype._click=function(){var e=this;this.isEnabled&&(this._labelText=this._getLabelText(),this.open().then(function(){e.onOpen.emit({component:e})}))},e.prototype._countFooterButtons=function(){var e=0;this.canClear&&e++,this.isMultiple&&e++,this._footerButtonsCount=e},e.prototype._setItems=function(e){var t=[{items:e||[]}];this._groups=t,this._filteredGroups=this._groups},e.prototype._formatValueItem=function(t){var n=this;if(this._shouldStoreItemValue){var e=this.items.find(function(e){return e[n.itemValueField]===t});return this._formatItem(e)}return this._formatItem(t)},e.prototype._setIonItemHasFocus=function(e){this.ionItem&&this._setIonItemCssClass("item-has-focus",e)},e.prototype._setIonItemHasValue=function(){this.ionItem&&this._setIonItemCssClass("item-has-value",this.hasValue())},e.prototype._setHasPlaceholder=function(){this._hasPlaceholder=!this.hasValue()&&!this._isNullOrWhiteSpace(this.placeholder)},e.prototype._setIonItemCssClass=function(e,t){this._ionItemElement&&this._renderer.setElementClass(this._ionItemElement,e,t)},e.prototype.writeValue=function(e){this.value=e},e.prototype.registerOnChange=function(e){this.propagateOnChange=e},e.prototype.registerOnTouched=function(e){this.propagateOnTouched=e},e.prototype.setDisabledState=function(e){this.isEnabled=!e},e.prototype.ngOnInit=function(){this._isIos=this._platform.is("ios"),this._isMD=!this._isIos,this._hasObjects=!this._isNullOrWhiteSpace(this.itemValueField),this.ionItem&&(this._ionItemElement=this._element.nativeElement.closest("ion-item"),this._setIonItemCssClass("item-interactive",!0),this._setIonItemCssClass("item-ionic-selectable",!0)),this.enableIonItem(this.isEnabled)},e.prototype.ngDoCheck=function(){this._itemsDiffer.diff(this.items)&&(this._setItems(this.items),this.value=this.value,this.onItemsChange.emit({component:this}))},e.prototype.hasValue=function(){return this.isMultiple?0!==this._valueItems.length:0!==this._valueItems.length&&!this._isNullOrWhiteSpace(this._valueItems[0])},e.prototype.open=function(){var n=this;return new Promise(function(t,e){n._isEnabled&&!n._isOpened?(n._filterItems(),n._isOpened=!0,n._modalController.create({component:c,componentProps:{selectComponent:n}}).then(function(e){(n._modal=e).present().then(function(){n._setIonItemHasFocus(!0),t()}),e.onWillDismiss().then(function(){n._setIonItemHasFocus(!1)}),e.onDidDismiss().then(function(e){n._isOpened=!1,n.isMultiple&&(n._itemsToConfirm=[]),"backdrop"===e.role&&n.onClose.emit({component:n})})})):e("IonicSelectable is disabled or already opened.")})},e.prototype.close=function(){var n=this;return new Promise(function(e,t){n._isEnabled&&n._isOpened?(n.propagateOnTouched(),n._isOpened=!1,n._modal.dismiss().then(function(){n._setIonItemHasFocus(!1),e()})):t("IonicSelectable is disabled or already closed.")})},e.prototype.clear=function(){this.value=this.isMultiple?[]:null,this.isMultiple&&(this._itemsToConfirm=[]),this.propagateOnChange(this.value)},e.prototype.scrollToTop=function(){var n=this;return new Promise(function(e,t){n._isOpened?n._selectPageComponent._content.scrollToTop().then(function(){e()}):t("IonicSelectable content cannot be scrolled.")})},e.prototype.scrollToBottom=function(){var n=this;return new Promise(function(e,t){n._isOpened?n._selectPageComponent._content.scrollToBottom().then(function(){e()}):t("IonicSelectable content cannot be scrolled.")})},e.prototype.startSearch=function(){this._isEnabled&&this.showLoading()},e.prototype.endSearch=function(){this._isEnabled&&(this.hideLoading(),this._setItems(this.items))},e.prototype.enableInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!1)},e.prototype.disableInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!0)},e.prototype.endInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.complete(),this._setItems(this.items))},e.prototype.search=function(e){this._isEnabled&&this._isOpened&&this.canSearch&&(this._searchText=e,this._setHasSearchText(),this._filterItems())},e.prototype.showLoading=function(){this._isEnabled&&(this._isSearching=!0)},e.prototype.hideLoading=function(){this._isEnabled&&(this._isSearching=!1)},e}();a.decorators=[{type:l.Component,args:[{selector:"ionic-selectable",template:'<div class="ionic-selectable-value">\n <span *ngIf="_valueItems.length">\n <div class="ionic-selectable-value-item" *ngFor="let valueItem of _valueItems">\n {{_formatValueItem(valueItem)}}\n </div>\n </span>\n <div class="ionic-selectable-value-item" *ngIf="_hasPlaceholder">\n {{placeholder}}\n </div>\n \x3c!-- Fix icon allignment when there\'s no value or placeholder. --\x3e\n <span *ngIf="!_valueItems.length && !_hasPlaceholder"> </span>\n</div>\n<div class="ionic-selectable-icon">\n <div class="ionic-selectable-icon-inner"></div>\n</div>\n<button class="ionic-selectable-cover" [disabled]="!isEnabled" (click)="_click()">\n</button>\n',styles:[".item-label-floating .ionic-selectable,.item-label-stacked .ionic-selectable{-ms-flex-item-align:stretch;align-self:stretch;max-width:100%;padding-left:0;padding-top:8px;padding-bottom:8px}.item-label-floating .ionic-selectable-value,.item-label-stacked .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:19px}.item-label-floating .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-icon-inner{top:7px}.item-label-floating .ionic-selectable-ios .ionic-selectable-value,.item-label-stacked .ionic-selectable-ios .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:20px}.item-label-floating .ionic-selectable-ios .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-ios .ionic-selectable-icon-inner{top:8px}.item:not(.item-label-stacked):not(.item-label-floating) .ionic-selectable-value{padding-left:var(--padding-start,16px)}.item-ionic-selectable .item-inner .input-wrapper{-webkit-box-align:normal;-ms-flex-align:normal;align-items:normal}.item-ionic-selectable ion-label{-webkit-box-flex:1;-ms-flex:1;flex:1;max-width:initial}.ionic-selectable{display:-webkit-box;display:-ms-flexbox;display:flex;max-width:45%}.ionic-selectable-has-placeholder .ionic-selectable-value-item{color:var(--placeholder-color,#999)}.ionic-selectable-value{-webkit-box-flex:1;-ms-flex:1;flex:1;padding-top:13px;padding-bottom:13px;overflow:hidden}.ionic-selectable-value-item{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ionic-selectable-value-item:not(:last-child){margin-bottom:5px}.ionic-selectable-icon{position:relative;width:20px}.ionic-selectable-icon-inner{position:absolute;top:20px;left:5px;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;pointer-events:none;color:var(--icon-color,#999)}.ionic-selectable-ios .ionic-selectable-value{padding-top:11px;padding-bottom:11px}.ionic-selectable-ios .ionic-selectable-icon-inner{top:19px}.ionic-selectable-spinner{position:fixed;bottom:0;top:0;left:0;right:0;z-index:1}.ionic-selectable-spinner-background{top:0;bottom:0;left:0;right:0;position:absolute;background-color:#000;opacity:.05}.ionic-selectable-spinner ion-spinner{position:absolute;top:50%;left:50%;z-index:10;margin-top:-14px;margin-left:-14px}.ionic-selectable-cover{left:0;top:0;margin:0;position:absolute;width:100%;height:100%;border:0;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:first-child{padding-right:8px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:last-child{padding-left:8px}.ionic-selectable-page.ionic-selectable-page-is-searching .scroll-content{overflow-y:hidden}"],encapsulation:l.ViewEncapsulation.None,providers:[{provide:t.NG_VALUE_ACCESSOR,useExisting:l.forwardRef(function(){return a}),multi:!0}]}]}],a.ctorParameters=function(){return[{type:n.ModalController},{type:n.Platform},{type:n.Item,decorators:[{type:l.Optional}]},{type:l.IterableDiffers},{type:l.ElementRef},{type:l.Renderer}]},a.propDecorators={_cssClass:[{type:l.HostBinding,args:["class.ionic-selectable"]}],_isIos:[{type:l.HostBinding,args:["class.ionic-selectable-ios"]}],_isMD:[{type:l.HostBinding,args:["class.ionic-selectable-md"]}],_isMultipleCssClass:[{type:l.HostBinding,args:["class.ionic-selectable-is-multiple"]}],_hasValueCssClass:[{type:l.HostBinding,args:["class.ionic-selectable-has-value"]}],_hasPlaceholderCssClass:[{type:l.HostBinding,args:["class.ionic-selectable-has-placeholder"]}],items:[{type:l.Input}],itemsChange:[{type:l.Output}],isEnabled:[{type:l.HostBinding,args:["class.ionic-selectable-is-enabled"]},{type:l.Input,args:["isEnabled"]}],isOkButtonEnabled:[{type:l.Input}],itemValueField:[{type:l.Input}],itemTextField:[{type:l.Input}],canSearch:[{type:l.Input}],isOnSearchEnabled:[{type:l.Input,args:["isOnSearchEnabled"]}],canClear:[{type:l.HostBinding,args:["class.ionic-selectable-can-clear"]},{type:l.Input,args:["canClear"]}],hasInfiniteScroll:[{type:l.Input}],hasVirtualScroll:[{type:l.Input}],virtualScrollApproxItemHeight:[{type:l.Input}],searchPlaceholder:[{type:l.Input}],placeholder:[{type:l.Input}],isMultiple:[{type:l.Input,args:["isMultiple"]}],searchFailText:[{type:l.Input}],clearButtonText:[{type:l.Input}],okButtonText:[{type:l.Input}],closeButtonText:[{type:l.Input}],shouldFocusSearchbar:[{type:l.Input}],headerColor:[{type:l.Input}],onChange:[{type:l.Output}],onSearch:[{type:l.Output}],onInfiniteScroll:[{type:l.Output}],onOpen:[{type:l.Output}],onClose:[{type:l.Output}],searchDebounce:[{type:l.Input}],shouldStoreItemValue:[{type:l.Input}]};var c=function(){function e(e){var t=this;this.navParams=e,this._cssClass=!0,this.selectComponent=this.navParams.get("selectComponent"),(this.selectComponent._selectPageComponent=this).selectComponent._selectedItems=[],this.selectComponent._isNullOrWhiteSpace(this.selectComponent.value)||(this.selectComponent.isMultiple?this.selectComponent.value.forEach(function(e){t.selectComponent._selectedItems.push(e)}):this.selectComponent._selectedItems.push(this.selectComponent.value)),this._setItemsToConfirm(this.selectComponent._selectedItems)}return Object.defineProperty(e.prototype,"_canClearCssClass",{get:function(){return this.selectComponent.canClear},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isMultipleCssClass",{get:function(){return this.selectComponent.isMultiple},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isSearchingCssClass",{get:function(){return this.selectComponent._isSearching},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isIos",{get:function(){return this.selectComponent._isIos},enumerable:!0,configurable:!0}),e.prototype._isMD=function(){return this.selectComponent._isMD},e.prototype.ngAfterViewInit=function(){var e=this;this._searchbarComponent&&this.selectComponent.shouldFocusSearchbar&&setTimeout(function(){e._searchbarComponent.focus()},1e3)},e.prototype._setItemsToConfirm=function(e){this.selectComponent._itemsToConfirm=[].concat(e)},e.prototype._getMoreItems=function(){this.selectComponent.onInfiniteScroll.emit({component:this.selectComponent,text:this.selectComponent._searchText})},e.prototype._select=function(e){this.selectComponent.isMultiple?(this.selectComponent._isItemSelected(e)?this.selectComponent._deleteSelectedItem(e):this.selectComponent._addSelectedItem(e),this._setItemsToConfirm(this.selectComponent._selectedItems)):(this.selectComponent._isItemSelected(e)||(this.selectComponent._selectedItems=[],this.selectComponent._addSelectedItem(e),this.selectComponent._shouldStoreItemValue?this.selectComponent._select(this.selectComponent._getItemValue(e)):this.selectComponent._select(e)),this._close())},e.prototype._ok=function(){this.selectComponent._select(this.selectComponent._selectedItems),this._close()},e.prototype._close=function(){var e=this;this.selectComponent.close().then(function(){e.selectComponent.onClose.emit({component:e.selectComponent})}),this.selectComponent._hasOnSearch()||(this.selectComponent._searchText="",this.selectComponent._setHasSearchText())},e.prototype._clear=function(){var e=this;this.selectComponent.clear(),this.selectComponent._emitValueChange(),this.selectComponent.close().then(function(){e.selectComponent.onClose.emit({component:e.selectComponent})})},e}();c.decorators=[{type:l.Component,args:[{selector:"ionic-selectable-page",template:'<ion-header>\n <ion-toolbar [color]="selectComponent.headerColor ? selectComponent.headerColor : null">\n <ion-buttons slot="start">\n <ion-button (click)="_close()">\n {{selectComponent.closeButtonText}}\n </ion-button>\n </ion-buttons>\n <ion-title>\n <span>\n {{selectComponent._labelText}}\n </span>\n </ion-title>\n </ion-toolbar>\n <ion-toolbar *ngIf="selectComponent.canSearch">\n <ion-searchbar *ngIf="selectComponent.canSearch" #searchbarComponent\n [(ngModel)]="selectComponent._searchText" (ionChange)="selectComponent._filterItems()"\n (ionClear)="selectComponent._onSearchbarClear()" [placeholder]="selectComponent.searchPlaceholder"\n [debounce]="selectComponent.searchDebounce">\n </ion-searchbar>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <div class="ionic-selectable-spinner" *ngIf="selectComponent._isSearching">\n <div class="ionic-selectable-spinner-background"></div>\n <ion-spinner></ion-spinner>\n </div>\n <ion-list no-margin *ngIf="!selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length">\n <ion-item-group *ngFor="let group of selectComponent._filteredGroups" class="ionic-selectable-group">\n <ion-item button detail="false" *ngFor="let item of group.items" (click)="_select(item)"\n class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item)\n }">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null"\n slot="start">\n </ion-icon>\n <span>\n {{selectComponent._formatItem(item)}}\n </span>\n </ion-item>\n </ion-item-group>\n </ion-list>\n \x3c!-- Fail text should be above InfiniteScroll to avoid a gap when no items are found. --\x3e\n <div *ngIf="!selectComponent._filteredGroups.length || !selectComponent._filteredGroups[0].items.length">\n <div margin>\n {{selectComponent.searchFailText}}\n </div>\n </div>\n <ion-infinite-scroll *ngIf="!selectComponent.hasVirtualScroll" [disabled]="!selectComponent.hasInfiniteScroll"\n (ionInfinite)="_getMoreItems($event)">\n <ion-infinite-scroll-content></ion-infinite-scroll-content>\n </ion-infinite-scroll>\n <ion-virtual-scroll no-margin *ngIf="selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length"\n [items]="selectComponent._filteredGroups[0].items" [approxItemHeight]="selectComponent.virtualScrollApproxItemHeight">\n <ion-item button detail="false" *virtualItem="let item" (click)="_select(item)"\n class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item)\n }">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null" slot="start">\n </ion-icon>\n <span>\n {{selectComponent._formatItem(item)}}\n </span>\n </ion-item>\n </ion-virtual-scroll>\n</ion-content>\n<ion-footer *ngIf="selectComponent._footerButtonsCount > 0">\n <ion-toolbar>\n <ion-row>\n <ion-col *ngIf="selectComponent.canClear" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)=" _clear()" [disabled]="!selectComponent._selectedItems.length">\n {{selectComponent.clearButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf="selectComponent.isMultiple" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)=" _ok()" [disabled]="!selectComponent.isOkButtonEnabled">\n {{selectComponent.okButtonText}}\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-toolbar>\n</ion-footer>\n'}]}],c.ctorParameters=function(){return[{type:n.NavParams}]},c.propDecorators={_content:[{type:l.ViewChild,args:[n.Content]}],_searchbarComponent:[{type:l.ViewChild,args:["searchbarComponent"]}],_infiniteScroll:[{type:l.ViewChild,args:[n.InfiniteScroll]}],_cssClass:[{type:l.HostBinding,args:["class.ionic-selectable-page"]}],_canClearCssClass:[{type:l.HostBinding,args:["class.ionic-selectable-page-can-clear"]}],_isMultipleCssClass:[{type:l.HostBinding,args:["class.ionic-selectable-page-is-multiple"]}],_isSearchingCssClass:[{type:l.HostBinding,args:["class.ionic-selectable-page-is-searching"]}],_isIos:[{type:l.HostBinding,args:["class.ionic-selectable-page-ios"]}],_isMD:[{type:l.HostBinding,args:["class.ionic-selectable-page-md"]}]};var r=[a,c],p=function h(){};p.decorators=[{type:l.NgModule,args:[{imports:[i.CommonModule,t.FormsModule,n.IonicModule],declarations:s(r),exports:s(r),entryComponents:r}]}],p.ctorParameters=function(){return[]},e.IonicSelectablePageComponent=c,e.IonicSelectableComponent=a,e.IonicSelectableModule=p,Object.defineProperty(e,"__esModule",{value:!0})}); | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("@ionic/angular"),require("rxjs"),require("@angular/common")):"function"==typeof define&&define.amd?define("ionic-selectable",["exports","@angular/core","@angular/forms","@ionic/angular","rxjs","@angular/common"],t):t(e["ionic-selectable"]={},e.ng.core,e.ng.forms,e.angular,null,e.ng.common)}(this,function(e,s,t,n,i,o){"use strict";function l(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var i,o,l=n.call(e),s=[];try{for(;(void 0===t||0<t--)&&!(i=l.next()).done;)s.push(i.value)}catch(a){o={error:a}}finally{try{i&&!i.done&&(n=l["return"])&&n.call(l)}finally{if(o)throw o.error}}return s}function a(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(l(arguments[t]));return e}var r=function S(){};r.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectableAddItemTemplate]"}]}],r.ctorParameters=function(){return[]};var c=function x(){};c.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectableCloseButtonTemplate]"}]}],c.ctorParameters=function(){return[]};var p=function O(){};p.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectableGroupRightTemplate]"}]}],p.ctorParameters=function(){return[]};var m=function P(){};m.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectableGroupTemplate]"}]}],m.ctorParameters=function(){return[]};var u=function E(){};u.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectableItemRightTemplate]"}]}],u.ctorParameters=function(){return[]};var h=function V(){};h.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectableItemTemplate]"}]}],h.ctorParameters=function(){return[]};var d=function w(){};d.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectableMessageTemplate]"}]}],d.ctorParameters=function(){return[]};var f=function F(){};f.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectablePlaceholderTemplate]"}]}],f.ctorParameters=function(){return[]};var g=function D(){};g.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectableSearchFailTemplate]"}]}],g.ctorParameters=function(){return[]};var b=function k(){};b.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectableTitleTemplate]"}]}],b.ctorParameters=function(){return[]};var _=function A(){};_.decorators=[{type:s.Directive,args:[{selector:"[ionicSelectableValueTemplate]"}]}],_.ctorParameters=function(){return[]};var I=function(){function e(e,t,n,i,o,l){this._modalController=e,this._platform=t,this.ionItem=n,this._iterableDiffers=i,this._element=o,this._renderer=l,this._cssClass=!0,this._isOnSearchEnabled=!0,this._isEnabled=!0,this._isOpened=!1,this._value=null,this._canClear=!1,this._isMultiple=!1,this._canAddItem=!1,this.onItemsChange=new s.EventEmitter,this._valueItems=[],this._searchText="",this._hasSearchText=!1,this._groups=[],this._itemsToConfirm=[],this._selectedItems=[],this._filteredGroups=[],this._isAddItemTemplateVisible=!1,this._isFooterVisible=!0,this._itemToAdd=null,this._footerButtonsCount=0,this.items=[],this.itemsChange=new s.EventEmitter,this.isOkButtonEnabled=!0,this.itemValueField=null,this.itemTextField=null,this.groupValueField=null,this.groupTextField=null,this.canSearch=!1,this.hasInfiniteScroll=!1,this.hasVirtualScroll=!1,this.virtualScrollApproxItemHeight="40px",this.searchPlaceholder="Search",this.placeholder=null,this.searchFailText="No items found.",this.clearButtonText="Clear",this.addButtonText="Add",this.okButtonText="OK",this.closeButtonText="Cancel",this.shouldFocusSearchbar=!1,this.headerColor=null,this.groupColor=null,this.onChange=new s.EventEmitter,this.onSearch=new s.EventEmitter,this.onSearchFail=new s.EventEmitter,this.onSearchSuccess=new s.EventEmitter,this.onInfiniteScroll=new s.EventEmitter,this.onOpen=new s.EventEmitter,this.onClose=new s.EventEmitter,this.searchDebounce=250,this.disabledItems=[],this.shouldStoreItemValue=!1,this.canSaveItem=!1,this.canDeleteItem=!1,this.onSaveItem=new s.EventEmitter,this.onDeleteItem=new s.EventEmitter,this.onAddItem=new s.EventEmitter,this.virtualScrollHeaderFn=function(){return null},this.propagateOnChange=function(e){},this.propagateOnTouched=function(){},this.items&&this.items.length||(this.items=[]),this._itemsDiffer=this._iterableDiffers.find(this.items).create()}return Object.defineProperty(e.prototype,"_isMultipleCssClass",{get:function(){return this.isMultiple},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasValueCssClass",{get:function(){return this.hasValue()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasPlaceholderCssClass",{get:function(){return this._hasPlaceholder},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasInfiniteScroll",{get:function(){return!!(this.isEnabled&&this._selectPageComponent&&this._selectPageComponent._infiniteScroll)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_shouldStoreItemValue",{get:function(){return this.shouldStoreItemValue&&this._hasObjects},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"searchText",{get:function(){return this._searchText},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isSearching",{get:function(){return this._isSearching},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"hasSearchText",{get:function(){return this._hasSearchText},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"value",{get:function(){return this._value},set:function(e){this._value=e,this._valueItems.splice(0,this._valueItems.length),this.isMultiple?e&&e.length&&Array.prototype.push.apply(this._valueItems,e):this._isNullOrWhiteSpace(e)||this._valueItems.push(e),this._setIonItemHasValue(),this._setHasPlaceholder()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isEnabled",{get:function(){return this._isEnabled},set:function(e){this._isEnabled=!!e,this.enableIonItem(this._isEnabled)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isOpened",{get:function(){return this._isOpened},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isOnSearchEnabled",{get:function(){return this._isOnSearchEnabled},set:function(e){this._isOnSearchEnabled=!!e},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"canClear",{get:function(){return this._canClear},set:function(e){this._canClear=!!e,this._countFooterButtons()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isMultiple",{get:function(){return this._isMultiple},set:function(e){this._isMultiple=!!e,this._countFooterButtons()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"itemsToConfirm",{get:function(){return this._itemsToConfirm},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"canAddItem",{get:function(){return this._canAddItem},set:function(e){this._canAddItem=!!e,this._countFooterButtons()},enumerable:!0,configurable:!0}),e.prototype.initFocus=function(){},e.prototype.enableIonItem=function(e){this.ionItem&&(this.ionItem.disabled=!e)},e.prototype._isNullOrWhiteSpace=function(e){return null===e||e===undefined||e.toString().replace(/\s/g,"").length<1},e.prototype._setHasSearchText=function(){this._hasSearchText=!this._isNullOrWhiteSpace(this._searchText)},e.prototype._hasOnSearch=function(){return this.isOnSearchEnabled&&0<this.onSearch.observers.length},e.prototype._hasOnSaveItem=function(){return this.canSaveItem&&0<this.onSaveItem.observers.length},e.prototype._hasOnAddItem=function(){return this.canAddItem&&0<this.onAddItem.observers.length},e.prototype._hasOnDeleteItem=function(){return this.canDeleteItem&&0<this.onDeleteItem.observers.length},e.prototype._select=function(e){this.value=e,this._emitValueChange()},e.prototype._emitValueChange=function(){this.propagateOnChange(this.value),this.onChange.emit({component:this,value:this.value})},e.prototype._emitSearch=function(){this.canSearch&&this.onSearch.emit({component:this,text:this._searchText})},e.prototype._formatItem=function(e){return this._isNullOrWhiteSpace(e)?null:this.itemTextField?e[this.itemTextField]:e.toString()},e.prototype._getLabelText=function(){var e=this._ionItemElement?this._ionItemElement.querySelector("ion-label"):null;return e?e.textContent:null},e.prototype._getItemValue=function(e){return this._hasObjects?e[this.itemValueField]:e},e.prototype._getStoredItemValue=function(e){return this._hasObjects?this._shouldStoreItemValue?e:e[this.itemValueField]:e},e.prototype._onSearchbarClear=function(){this._searchText=""},e.prototype._filterItems=function(){var n=this;if(this._setHasSearchText(),this._hasOnSearch())this._emitSearch();else{var i=[];if(this._searchText&&this._searchText.trim()){var o=this._searchText.trim().toLowerCase();this._groups.forEach(function(e){var t=e.items.filter(function(e){return-1!==(n.itemTextField?e[n.itemTextField]:e).toString().toLowerCase().indexOf(o)});t.length&&i.push({value:e.value,text:e.text,items:t})}),i.length||i.push({items:[]})}else i=this._groups;this._filteredGroups=i,this._areGroupsEmpty(i)?this.onSearchFail.emit({component:this,text:this._searchText}):this.onSearchSuccess.emit({component:this,text:this._searchText})}},e.prototype._isItemDisabled=function(t){var n=this;if(this.disabledItems)return this.disabledItems.some(function(e){return n._getItemValue(e)===n._getItemValue(t)})},e.prototype._isItemSelected=function(t){var n=this;return this._selectedItems.find(function(e){return n._getItemValue(t)===n._getStoredItemValue(e)})!==undefined},e.prototype._addSelectedItem=function(e){this._shouldStoreItemValue?this._selectedItems.push(this._getItemValue(e)):this._selectedItems.push(e)},e.prototype._deleteSelectedItem=function(n){var i,o=this;this._selectedItems.forEach(function(e,t){o._getItemValue(n)===o._getStoredItemValue(e)&&(i=t)}),this._selectedItems.splice(i,1)},e.prototype._click=function(){var e=this;this.isEnabled&&(this._labelText=this._getLabelText(),this.open().then(function(){e.onOpen.emit({component:e})}))},e.prototype._saveItem=function(e,t){e.stopPropagation(),this._itemToAdd=t,this._hasOnSaveItem()?this.onSaveItem.emit({component:this,item:this._itemToAdd}):this.showAddItemTemplate()},e.prototype._deleteItemClick=function(e,t){e.stopPropagation(),this._itemToAdd=t,this._hasOnDeleteItem()?this.onDeleteItem.emit({component:this,item:this._itemToAdd}):this.deleteItem(this._itemToAdd)},e.prototype._addItemClick=function(){this._itemToAdd=null,this._hasOnAddItem()?this.onAddItem.emit({component:this}):this.showAddItemTemplate()},e.prototype._positionAddItemTemplate=function(){var t=this;setTimeout(function(){var e=t._selectPageComponent._element.nativeElement.querySelector(".ionic-selectable-add-item-template ion-footer");t._addItemTemplateFooterHeight=e?"calc(100% - "+e.offsetHeight+"px)":"100%"},100)},e.prototype._areGroupsEmpty=function(e){return 0===e.length||e.every(function(e){return!e.items||0===e.items.length})},e.prototype._countFooterButtons=function(){var e=0;this.canClear&&e++,this.isMultiple&&e++,this.canAddItem&&e++,this._footerButtonsCount=e},e.prototype._setItems=function(e){var i=this,o=[{items:e||[]}];e&&e.length&&this._hasGroups&&(o=[],e.forEach(function(e){var t=i._getPropertyValue(e,i.groupValueField),n=o.find(function(e){return e.value===t});n?n.items.push(e):o.push({value:t,text:i._getPropertyValue(e,i.groupTextField),items:[e]})})),this._groups=o,this._filteredGroups=this._groups},e.prototype._formatValueItem=function(t){var n=this;if(this._shouldStoreItemValue){var e=this.items.find(function(e){return e[n.itemValueField]===t});return this._formatItem(e)}return this._formatItem(t)},e.prototype._getPropertyValue=function(e,t){return t?t.split(".").reduce(function(e,t){return e?e[t]:null},e):null},e.prototype._setIonItemHasFocus=function(e){this.ionItem&&this._setIonItemCssClass("item-has-focus",e)},e.prototype._setIonItemHasValue=function(){this.ionItem&&this._setIonItemCssClass("item-has-value",this.hasValue())},e.prototype._setHasPlaceholder=function(){this._hasPlaceholder=!(this.hasValue()||this._isNullOrWhiteSpace(this.placeholder)&&!this.placeholderTemplate)},e.prototype._setIonItemCssClass=function(e,t){this._ionItemElement&&this._renderer.setElementClass(this._ionItemElement,e,t)},e.prototype._toggleAddItemTemplate=function(e){this.addItemTemplate&&(this._isAddItemTemplateVisible=e,this._isFooterVisible=!e)},e.prototype.writeValue=function(e){this.value=e},e.prototype.registerOnChange=function(e){this.propagateOnChange=e},e.prototype.registerOnTouched=function(e){this.propagateOnTouched=e},e.prototype.setDisabledState=function(e){this.isEnabled=!e},e.prototype.ngOnInit=function(){this._isIos=this._platform.is("ios"),this._isMD=!this._isIos,this._hasObjects=!this._isNullOrWhiteSpace(this.itemValueField),this._hasGroups=Boolean(this._hasObjects&&this.groupValueField&&!this.hasVirtualScroll),this.ionItem&&(this._ionItemElement=this._element.nativeElement.closest("ion-item"),this._setIonItemCssClass("item-interactive",!0),this._setIonItemCssClass("item-ionic-selectable",!0)),this.enableIonItem(this.isEnabled)},e.prototype.ngDoCheck=function(){this._itemsDiffer.diff(this.items)&&(this._setItems(this.items),this.value=this.value,this.onItemsChange.emit({component:this}))},e.prototype.addItem=function(e){var n=this;return this.items.unshift(e),this._addItemObservable&&this._addItemObservable.unsubscribe(),new Promise(function(e,t){n._addItemObservable=n.onItemsChange.asObservable().subscribe(function(){n._addItemObservable.unsubscribe(),e()},function(){n._addItemObservable.unsubscribe(),t()})})},e.prototype.deleteItem=function(t){var n=this,i=this,e=!1;if(this._selectedItems&&(this._selectedItems=this._selectedItems.filter(function(e){return n._getItemValue(t)!==n._getStoredItemValue(e)})),this.value)if(this.isMultiple){var o=this.value.filter(function(e){return e.id!==t.id});o.length!==this.value.length&&(this.value=o,e=!0)}else t===this.value&&(e=!(this.value=null));e&&this._emitValueChange();var l=this.items.filter(function(e){return e.id!==t.id});return this.itemsChange.emit(l),this._setItems(l),this.onItemsChange.emit({component:this}),this._deleteItemObservable&&this._deleteItemObservable.unsubscribe(),new Promise(function(e,t){i._deleteItemObservable=i.onItemsChange.asObservable().subscribe(function(){i._deleteItemObservable.unsubscribe(),e()},function(){i._deleteItemObservable.unsubscribe(),t()})})},e.prototype.hasValue=function(){return this.isMultiple?0!==this._valueItems.length:0!==this._valueItems.length&&!this._isNullOrWhiteSpace(this._valueItems[0])},e.prototype.open=function(){var n=this;return new Promise(function(t,e){n._isEnabled&&!n._isOpened?(n._filterItems(),n._isOpened=!0,n._modalController.create({component:C,componentProps:{selectComponent:n}}).then(function(e){(n._modal=e).present().then(function(){n._setIonItemHasFocus(!0),t()}),e.onWillDismiss().then(function(){n._setIonItemHasFocus(!1)}),e.onDidDismiss().then(function(e){n._isOpened=!1,n.isMultiple&&(n._itemsToConfirm=[]),"backdrop"===e.role&&n.onClose.emit({component:n})})})):e("IonicSelectable is disabled or already opened.")})},e.prototype.close=function(){var n=this;return new Promise(function(e,t){n._isEnabled&&n._isOpened?(n.propagateOnTouched(),n._isOpened=!1,n._itemToAdd=null,n._modal.dismiss().then(function(){n._setIonItemHasFocus(!1),n.hideAddItemTemplate(),e()})):t("IonicSelectable is disabled or already closed.")})},e.prototype.clear=function(){this.value=this.isMultiple?[]:null,this.isMultiple&&(this._itemsToConfirm=[]),this.propagateOnChange(this.value)},e.prototype.scrollToTop=function(){var n=this;return new Promise(function(e,t){n._isOpened?n._selectPageComponent._content.scrollToTop().then(function(){e()}):t("IonicSelectable content cannot be scrolled.")})},e.prototype.scrollToBottom=function(){var n=this;return new Promise(function(e,t){n._isOpened?n._selectPageComponent._content.scrollToBottom().then(function(){e()}):t("IonicSelectable content cannot be scrolled.")})},e.prototype.startSearch=function(){this._isEnabled&&this.showLoading()},e.prototype.endSearch=function(){this._isEnabled&&(this.hideLoading(),this._setItems(this.items),this._areGroupsEmpty(this._filteredGroups)?this.onSearchFail.emit({component:this,text:this._searchText}):this.onSearchSuccess.emit({component:this,text:this._searchText}))},e.prototype.enableInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!1)},e.prototype.disableInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!0)},e.prototype.endInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.complete(),this._setItems(this.items))},e.prototype.search=function(e){this._isEnabled&&this._isOpened&&this.canSearch&&(this._searchText=e,this._setHasSearchText(),this._filterItems())},e.prototype.showLoading=function(){this._isEnabled&&(this._isSearching=!0)},e.prototype.hideLoading=function(){this._isEnabled&&(this._isSearching=!1)},e.prototype.showAddItemTemplate=function(){this._toggleAddItemTemplate(!0),this._positionAddItemTemplate()},e.prototype.hideAddItemTemplate=function(){this._toggleAddItemTemplate(!1)},e}();I.decorators=[{type:s.Component,args:[{selector:"ionic-selectable",template:'<div class="ionic-selectable-inner">\n <div class="ionic-selectable-value">\n <div *ngIf="valueTemplate && _valueItems.length && isMultiple"\n [ngTemplateOutlet]="valueTemplate" [ngTemplateOutletContext]="{ value: _valueItems }">\n </div>\n <div class="ionic-selectable-value-item" *ngIf="valueTemplate && _valueItems.length && !isMultiple">\n <div [ngTemplateOutlet]="valueTemplate" [ngTemplateOutletContext]="{ value: _valueItems[0] }">\n </div>\n </div>\n <span *ngIf="!valueTemplate && _valueItems.length">\n <div class="ionic-selectable-value-item" *ngFor="let valueItem of _valueItems">\n {{_formatValueItem(valueItem)}}\n </div>\n </span>\n <div *ngIf="_hasPlaceholder && placeholderTemplate" class="ionic-selectable-value-item">\n <div [ngTemplateOutlet]="placeholderTemplate">\n </div>\n </div>\n <div class="ionic-selectable-value-item" *ngIf="_hasPlaceholder && !placeholderTemplate">\n {{placeholder}}\n </div>\n \x3c!-- Fix icon allignment when there\'s no value or placeholder. --\x3e\n <span *ngIf="!_valueItems.length && !_hasPlaceholder"> </span>\n </div>\n <div class="ionic-selectable-icon">\n <div class="ionic-selectable-icon-inner"></div>\n </div>\n <button class="ionic-selectable-cover" [disabled]="!isEnabled" (click)="_click()">\n </button>\n</div>\n',styles:[".item:not(.item-label) .ionic-selectable{max-width:100%;width:100%}.item:not(.item-label) .ionic-selectable-value-item{text-align:right}.item-label-floating .ionic-selectable,.item-label-stacked .ionic-selectable{-ms-flex-item-align:stretch;align-self:stretch;max-width:100%;padding-left:0;padding-top:8px;padding-bottom:8px}.item-label-floating .ionic-selectable-value,.item-label-stacked .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:19px}.item-label-floating .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-icon-inner{top:7px}.item-label-floating .ionic-selectable-ios .ionic-selectable-value,.item-label-stacked .ionic-selectable-ios .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:20px}.item-label-floating .ionic-selectable-ios .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-ios .ionic-selectable-icon-inner{top:8px}.item:not(.item-label-stacked):not(.item-label-floating) .ionic-selectable-value{padding-left:var(--padding-start,16px)}.item-ionic-selectable .item-inner .input-wrapper{-webkit-box-align:normal;-ms-flex-align:normal;align-items:normal}.item-ionic-selectable ion-label{-webkit-box-flex:1;-ms-flex:1;flex:1;max-width:initial}.ionic-selectable{display:block;max-width:45%}.ionic-selectable-inner{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.ionic-selectable-has-placeholder .ionic-selectable-value-item{color:var(--placeholder-color,#999)}.ionic-selectable-value{-webkit-box-flex:1;-ms-flex:1;flex:1;padding-top:13px;padding-bottom:13px;overflow:hidden}.ionic-selectable-value-item{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ionic-selectable-value-item:not(:last-child){margin-bottom:5px}.ionic-selectable-icon{position:relative;width:20px}.ionic-selectable-icon-inner{position:absolute;top:20px;left:5px;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;pointer-events:none;color:var(--icon-color,#999)}.ionic-selectable-ios .ionic-selectable-value{padding-top:11px;padding-bottom:11px}.ionic-selectable-ios .ionic-selectable-icon-inner{top:19px}.ionic-selectable-spinner{position:fixed;bottom:0;top:0;left:0;right:0;z-index:1}.ionic-selectable-spinner-background{top:0;bottom:0;left:0;right:0;position:absolute;background-color:#000;opacity:.05}.ionic-selectable-spinner ion-spinner{position:absolute;top:50%;left:50%;z-index:10;margin-top:-14px;margin-left:-14px}.ionic-selectable-cover{left:0;top:0;margin:0;position:absolute;width:100%;height:100%;border:0;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0}.ionic-selectable-add-item-template{position:fixed;bottom:0;left:0;right:0;background-color:#fff}.ionic-selectable-add-item-template-inner{overflow-y:auto}.ionic-selectable-add-item-template-inner>ion-footer{bottom:0;position:absolute}.ionic-selectable-page-ios .ionic-selectable-message{padding:8px}.ionic-selectable-page-md .ionic-selectable-message{padding:8px 12px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:first-child{padding-right:8px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:last-child{padding-left:8px}.ionic-selectable-page.ionic-selectable-page-is-add-item-template-visible>.content>.scroll-content,.ionic-selectable-page.ionic-selectable-page-is-searching .scroll-content{overflow-y:hidden}"],encapsulation:s.ViewEncapsulation.None,providers:[{provide:t.NG_VALUE_ACCESSOR,useExisting:s.forwardRef(function(){return I}),multi:!0}]}]}],I.ctorParameters=function(){return[{type:n.ModalController},{type:n.Platform},{type:n.Item,decorators:[{type:s.Optional}]},{type:s.IterableDiffers},{type:s.ElementRef},{type:s.Renderer}]},I.propDecorators={_cssClass:[{type:s.HostBinding,args:["class.ionic-selectable"]}],_isIos:[{type:s.HostBinding,args:["class.ionic-selectable-ios"]}],_isMD:[{type:s.HostBinding,args:["class.ionic-selectable-md"]}],_isMultipleCssClass:[{type:s.HostBinding,args:["class.ionic-selectable-is-multiple"]}],_hasValueCssClass:[{type:s.HostBinding,args:["class.ionic-selectable-has-value"]}],_hasPlaceholderCssClass:[{type:s.HostBinding,args:["class.ionic-selectable-has-placeholder"]}],items:[{type:s.Input}],itemsChange:[{type:s.Output}],isEnabled:[{type:s.HostBinding,args:["class.ionic-selectable-is-enabled"]},{type:s.Input,args:["isEnabled"]}],isOkButtonEnabled:[{type:s.Input}],itemValueField:[{type:s.Input}],itemTextField:[{type:s.Input}],groupValueField:[{type:s.Input}],groupTextField:[{type:s.Input}],canSearch:[{type:s.Input}],isOnSearchEnabled:[{type:s.Input,args:["isOnSearchEnabled"]}],canClear:[{type:s.HostBinding,args:["class.ionic-selectable-can-clear"]},{type:s.Input,args:["canClear"]}],hasInfiniteScroll:[{type:s.Input}],hasVirtualScroll:[{type:s.Input}],virtualScrollApproxItemHeight:[{type:s.Input}],searchPlaceholder:[{type:s.Input}],placeholder:[{type:s.Input}],isMultiple:[{type:s.Input,args:["isMultiple"]}],searchFailText:[{type:s.Input}],clearButtonText:[{type:s.Input}],addButtonText:[{type:s.Input}],okButtonText:[{type:s.Input}],closeButtonText:[{type:s.Input}],shouldFocusSearchbar:[{type:s.Input}],headerColor:[{type:s.Input}],groupColor:[{type:s.Input}],onChange:[{type:s.Output}],onSearch:[{type:s.Output}],onSearchFail:[{type:s.Output}],onSearchSuccess:[{type:s.Output}],onInfiniteScroll:[{type:s.Output}],onOpen:[{type:s.Output}],onClose:[{type:s.Output}],searchDebounce:[{type:s.Input}],disabledItems:[{type:s.Input}],shouldStoreItemValue:[{type:s.Input}],canSaveItem:[{type:s.Input}],canDeleteItem:[{type:s.Input}],canAddItem:[{type:s.Input,args:["canAddItem"]}],onSaveItem:[{type:s.Output}],onDeleteItem:[{type:s.Output}],onAddItem:[{type:s.Output}],valueTemplate:[{type:s.ContentChild,args:[_,{read:s.TemplateRef}]}],itemTemplate:[{type:s.ContentChild,args:[h,{read:s.TemplateRef}]}],itemRightTemplate:[{type:s.ContentChild,args:[u,{read:s.TemplateRef}]}],titleTemplate:[{type:s.ContentChild,args:[b,{read:s.TemplateRef}]}],placeholderTemplate:[{type:s.ContentChild,args:[f,{read:s.TemplateRef}]}],messageTemplate:[{type:s.ContentChild,args:[d,{read:s.TemplateRef}]}],groupTemplate:[{type:s.ContentChild,args:[m,{read:s.TemplateRef}]}],groupRightTemplate:[{type:s.ContentChild,args:[p,{read:s.TemplateRef}]}],closeButtonTemplate:[{type:s.ContentChild,args:[c,{read:s.TemplateRef}]}],searchFailTemplate:[{type:s.ContentChild,args:[g,{read:s.TemplateRef}]}],addItemTemplate:[{type:s.ContentChild,args:[r,{read:s.TemplateRef}]}],virtualScrollHeaderFn:[{type:s.Input}]};var C=function(){function e(e,t){var n=this;this.navParams=e,this._element=t,this._cssClass=!0,this.selectComponent=this.navParams.get("selectComponent"),(this.selectComponent._selectPageComponent=this).selectComponent._selectedItems=[],this.selectComponent._isNullOrWhiteSpace(this.selectComponent.value)||(this.selectComponent.isMultiple?this.selectComponent.value.forEach(function(e){n.selectComponent._selectedItems.push(e)}):this.selectComponent._selectedItems.push(this.selectComponent.value)),this._setItemsToConfirm(this.selectComponent._selectedItems)}return Object.defineProperty(e.prototype,"_canClearCssClass",{get:function(){return this.selectComponent.canClear},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isMultipleCssClass",{get:function(){return this.selectComponent.isMultiple},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isSearchingCssClass",{get:function(){return this.selectComponent._isSearching},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isIos",{get:function(){return this.selectComponent._isIos},enumerable:!0,configurable:!0}),e.prototype._isMD=function(){return this.selectComponent._isMD},Object.defineProperty(e.prototype,"_isAddItemTemplateVisibleCssClass",{get:function(){return this.selectComponent._isAddItemTemplateVisible},enumerable:!0,configurable:!0}),e.prototype.onResize=function(){this.selectComponent._positionAddItemTemplate()},e.prototype.ngAfterViewInit=function(){var e=this;this._header=this._element.nativeElement.querySelector("ion-header"),this._searchbarComponent&&this.selectComponent.shouldFocusSearchbar&&setTimeout(function(){e._searchbarComponent.focus()},1e3)},e.prototype._setItemsToConfirm=function(e){this.selectComponent._itemsToConfirm=[].concat(e)},e.prototype._getMoreItems=function(){this.selectComponent.onInfiniteScroll.emit({component:this.selectComponent,text:this.selectComponent._searchText})},e.prototype._select=function(e){this.selectComponent.isMultiple?(this.selectComponent._isItemSelected(e)?this.selectComponent._deleteSelectedItem(e):this.selectComponent._addSelectedItem(e),this._setItemsToConfirm(this.selectComponent._selectedItems)):(this.selectComponent._isItemSelected(e)||(this.selectComponent._selectedItems=[],this.selectComponent._addSelectedItem(e),this.selectComponent._shouldStoreItemValue?this.selectComponent._select(this.selectComponent._getItemValue(e)):this.selectComponent._select(e)),this._close())},e.prototype._ok=function(){this.selectComponent._select(this.selectComponent._selectedItems),this._close()},e.prototype._close=function(){var e=this;this.selectComponent.close().then(function(){e.selectComponent.onClose.emit({component:e.selectComponent})}),this.selectComponent._hasOnSearch()||(this.selectComponent._searchText="",this.selectComponent._setHasSearchText())},e.prototype._clear=function(){var e=this;this.selectComponent.clear(),this.selectComponent._emitValueChange(),this.selectComponent.close().then(function(){e.selectComponent.onClose.emit({component:e.selectComponent})})},e}();C.decorators=[{type:s.Component,args:[{selector:"ionic-selectable-page",template:'<ion-header>\n <ion-toolbar [color]="selectComponent.headerColor ? selectComponent.headerColor : null">\n <ion-buttons slot="start">\n <ion-button (click)="_close()">\n <span *ngIf="selectComponent.closeButtonTemplate" [ngTemplateOutlet]="selectComponent.closeButtonTemplate">\n </span>\n <span *ngIf="!selectComponent.closeButtonTemplate">\n {{selectComponent.closeButtonText}}\n </span>\n </ion-button>\n </ion-buttons>\n <ion-title>\n \x3c!-- Need span for for text ellipsis. --\x3e\n <span *ngIf="selectComponent.titleTemplate" [ngTemplateOutlet]="selectComponent.titleTemplate">\n </span>\n <span *ngIf="!selectComponent.titleTemplate">\n {{selectComponent._labelText}}\n </span>\n </ion-title>\n </ion-toolbar>\n <ion-toolbar *ngIf="selectComponent.canSearch || selectComponent.messageTemplate">\n <ion-searchbar *ngIf="selectComponent.canSearch" #searchbarComponent\n [(ngModel)]="selectComponent._searchText" (ionChange)="selectComponent._filterItems()"\n (ionClear)="selectComponent._onSearchbarClear()" [placeholder]="selectComponent.searchPlaceholder"\n [debounce]="selectComponent.searchDebounce">\n </ion-searchbar>\n <div class="ionic-selectable-message" *ngIf="selectComponent.messageTemplate">\n <div [ngTemplateOutlet]="selectComponent.messageTemplate">\n </div>\n </div>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <div class="ionic-selectable-spinner" *ngIf="selectComponent._isSearching">\n <div class="ionic-selectable-spinner-background"></div>\n <ion-spinner></ion-spinner>\n </div>\n <ion-list no-margin *ngIf="!selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length">\n <ion-item-group *ngFor="let group of selectComponent._filteredGroups" class="ionic-selectable-group">\n <ion-item-divider *ngIf="selectComponent._hasGroups" [color]="selectComponent.groupColor ? selectComponent.groupColor : null">\n \x3c!-- Need span for for text ellipsis. --\x3e\n <span *ngIf="selectComponent.groupTemplate" [ngTemplateOutlet]="selectComponent.groupTemplate"\n [ngTemplateOutletContext]="{ group: group }">\n </span>\n \x3c!-- Need ion-label for text ellipsis. --\x3e\n <ion-label *ngIf="!selectComponent.groupTemplate">\n {{group.text}}\n </ion-label>\n <div *ngIf="selectComponent.groupRightTemplate" slot="end">\n <div [ngTemplateOutlet]="selectComponent.groupRightTemplate"\n [ngTemplateOutletContext]="{ group: group }">\n </div>\n </div>\n </ion-item-divider>\n <ion-item button="true" detail="false" *ngFor="let item of group.items"\n (click)="_select(item)" class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item),\n \'ionic-selectable-item-is-disabled\': selectComponent._isItemDisabled(item)\n }"\n [disabled]="selectComponent._isItemDisabled(item)">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null"\n slot="start">\n </ion-icon>\n \x3c!-- Need span for text ellipsis. --\x3e\n <span *ngIf="selectComponent.itemTemplate" [ngTemplateOutlet]="selectComponent.itemTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </span>\n \x3c!-- Need ion-label for text ellipsis. --\x3e\n <ion-label *ngIf="!selectComponent.itemTemplate">\n {{selectComponent._formatItem(item)}}\n </ion-label>\n <div *ngIf="selectComponent.itemRightTemplate" slot="end">\n <div [ngTemplateOutlet]="selectComponent.itemRightTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </div>\n </div>\n <ion-button *ngIf="selectComponent.canSaveItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._saveItem($event, item)">\n <ion-icon slot="icon-only" name="md-create"></ion-icon>\n </ion-button>\n <ion-button *ngIf="selectComponent.canDeleteItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._deleteItemClick($event, item)">\n <ion-icon slot="icon-only" name="md-trash"></ion-icon>\n </ion-button>\n </ion-item>\n </ion-item-group>\n </ion-list>\n \x3c!-- Fail text should be above InfiniteScroll to avoid a gap when no items are found. --\x3e\n <div *ngIf="!selectComponent._filteredGroups.length || !selectComponent._filteredGroups[0].items.length">\n <span *ngIf="selectComponent.searchFailTemplate" [ngTemplateOutlet]="selectComponent.searchFailTemplate">\n </span>\n <div *ngIf="!selectComponent.searchFailTemplate" margin>\n {{selectComponent.searchFailText}}\n </div>\n </div>\n <ion-infinite-scroll *ngIf="!selectComponent.hasVirtualScroll" [disabled]="!selectComponent.hasInfiniteScroll"\n (ionInfinite)="_getMoreItems($event)">\n <ion-infinite-scroll-content></ion-infinite-scroll-content>\n </ion-infinite-scroll>\n <ion-virtual-scroll no-margin *ngIf="selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length"\n [items]="selectComponent._filteredGroups[0].items" [headerFn]="selectComponent.virtualScrollHeaderFn"\n [approxItemHeight]="selectComponent.virtualScrollApproxItemHeight">\n <ion-item-divider *virtualHeader="let header" [color]="selectComponent.groupColor ? selectComponent.groupColor : null">\n {{header}}\n </ion-item-divider>\n <ion-item button="true" detail="false" *virtualItem="let item" (click)="_select(item)"\n class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item),\n \'ionic-selectable-item-is-disabled\': selectComponent._isItemDisabled(item)\n }"\n [disabled]="selectComponent._isItemDisabled(item)">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null" slot="start">\n </ion-icon>\n \x3c!-- Need span for text ellipsis. --\x3e\n <span *ngIf="selectComponent.itemTemplate" [ngTemplateOutlet]="selectComponent.itemTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </span>\n \x3c!-- Need ion-label for text ellipsis. --\x3e\n <ion-label *ngIf="!selectComponent.itemTemplate">\n {{selectComponent._formatItem(item)}}\n </ion-label>\n <div *ngIf="selectComponent.itemRightTemplate" slot="end">\n <div [ngTemplateOutlet]="selectComponent.itemRightTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </div>\n </div>\n <ion-button *ngIf="selectComponent.canSaveItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._saveItem($event, item)">\n <ion-icon slot="icon-only" name="md-create"></ion-icon>\n </ion-button>\n <ion-button *ngIf="selectComponent.canDeleteItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._deleteItemClick($event, item)">\n <ion-icon slot="icon-only" name="md-trash"></ion-icon>\n </ion-button>\n </ion-item>\n </ion-virtual-scroll>\n</ion-content>\n<div class="ionic-selectable-add-item-template" *ngIf="selectComponent._isAddItemTemplateVisible"\n [ngStyle]="{ \'top.px\': _header.offsetHeight }">\n <div class="ionic-selectable-add-item-template-inner" [ngStyle]="{ \'height\': selectComponent._addItemTemplateFooterHeight }">\n <span [ngTemplateOutlet]="selectComponent.addItemTemplate"\n [ngTemplateOutletContext]="{ item: selectComponent._itemToAdd, isAdd: selectComponent._itemToAdd === null }">\n </span>\n </div>\n</div>\n<ion-footer *ngIf="selectComponent._footerButtonsCount > 0" [ngStyle]="{ \'visibility\': selectComponent._isFooterVisible ? \'initial\' : \'hidden\' }">\n <ion-toolbar>\n <ion-row>\n <ion-col *ngIf="selectComponent.canClear" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)="_clear()" [disabled]="!selectComponent._selectedItems.length">\n {{selectComponent.clearButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf="selectComponent.canAddItem" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)="selectComponent._addItemClick()">\n {{selectComponent.addButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf="selectComponent.isMultiple" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)="_ok()" [disabled]="!selectComponent.isOkButtonEnabled">\n {{selectComponent.okButtonText}}\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-toolbar>\n</ion-footer>\n'}]}],C.ctorParameters=function(){return[{type:n.NavParams},{type:s.ElementRef}]},C.propDecorators={_content:[{type:s.ViewChild,args:[n.Content]}],_searchbarComponent:[{type:s.ViewChild,args:["searchbarComponent"]}],_infiniteScroll:[{type:s.ViewChild,args:[n.InfiniteScroll]}],_cssClass:[{type:s.HostBinding,args:["class.ionic-selectable-page"]}],_canClearCssClass:[{type:s.HostBinding,args:["class.ionic-selectable-page-can-clear"]}],_isMultipleCssClass:[{type:s.HostBinding,args:["class.ionic-selectable-page-is-multiple"]}],_isSearchingCssClass:[{type:s.HostBinding,args:["class.ionic-selectable-page-is-searching"]}],_isIos:[{type:s.HostBinding,args:["class.ionic-selectable-page-ios"]}],_isMD:[{type:s.HostBinding,args:["class.ionic-selectable-page-md"]}],_isAddItemTemplateVisibleCssClass:[{type:s.HostBinding,args:["class.ionic-selectable-page-is-add-item-template-visible"]}],onResize:[{type:s.HostListener,args:["window:resize",["$event"]]}]};var v=[I,C],y=[_,h,u,b,f,d,m,p,c,g,r],T=function B(){};T.decorators=[{type:s.NgModule,args:[{imports:[o.CommonModule,t.FormsModule,n.IonicModule],declarations:a(v,y),exports:a(v,y),entryComponents:v}]}],T.ctorParameters=function(){return[]},e.IonicSelectableAddItemTemplateDirective=r,e.IonicSelectableCloseButtonTemplateDirective=c,e.IonicSelectableGroupRightTemplateDirective=p,e.IonicSelectableGroupTemplateDirective=m,e.IonicSelectableItemRightTemplateDirective=u,e.IonicSelectableItemTemplateDirective=h,e.IonicSelectableMessageTemplateDirective=d,e.IonicSelectablePageComponent=C,e.IonicSelectablePlaceholderTemplateDirective=f,e.IonicSelectableSearchFailTemplateDirective=g,e.IonicSelectableTitleTemplateDirective=b,e.IonicSelectableValueTemplateDirective=_,e.IonicSelectableComponent=I,e.IonicSelectableModule=T,Object.defineProperty(e,"__esModule",{value:!0})}); | ||
| //# sourceMappingURL=ionic-selectable.umd.min.js.map |
@@ -1,1 +0,1 @@ | ||
| import{Component,ElementRef,EventEmitter,forwardRef,HostBinding,Input,IterableDiffers,Optional,Output,Renderer,ViewEncapsulation,ViewChild,NgModule}from"@angular/core";import{NG_VALUE_ACCESSOR,FormsModule}from"@angular/forms";import{Item,ModalController,Platform,Content,InfiniteScroll,NavParams,IonicModule}from"@ionic/angular";import{CommonModule}from"@angular/common";class IonicSelectableComponent{constructor(e,t,s,n,i,o){this._modalController=e,this._platform=t,this.ionItem=s,this._iterableDiffers=n,this._element=i,this._renderer=o,this._cssClass=!0,this._isOnSearchEnabled=!0,this._isEnabled=!0,this._isOpened=!1,this._value=null,this._canClear=!1,this._isMultiple=!1,this.onItemsChange=new EventEmitter,this._valueItems=[],this._searchText="",this._hasSearchText=!1,this._groups=[],this._itemsToConfirm=[],this._selectedItems=[],this._filteredGroups=[],this._footerButtonsCount=0,this.items=[],this.itemsChange=new EventEmitter,this.isOkButtonEnabled=!0,this.itemValueField=null,this.itemTextField=null,this.canSearch=!1,this.hasInfiniteScroll=!1,this.hasVirtualScroll=!1,this.virtualScrollApproxItemHeight="40px",this.searchPlaceholder="Search",this.placeholder=null,this.searchFailText="No items found.",this.clearButtonText="Clear",this.okButtonText="OK",this.closeButtonText="Cancel",this.shouldFocusSearchbar=!1,this.headerColor=null,this.onChange=new EventEmitter,this.onSearch=new EventEmitter,this.onInfiniteScroll=new EventEmitter,this.onOpen=new EventEmitter,this.onClose=new EventEmitter,this.searchDebounce=250,this.shouldStoreItemValue=!1,this.propagateOnChange=(e=>{}),this.propagateOnTouched=(()=>{}),this.items&&this.items.length||(this.items=[]),this._itemsDiffer=this._iterableDiffers.find(this.items).create()}get _isMultipleCssClass(){return this.isMultiple}get _hasValueCssClass(){return this.hasValue()}get _hasPlaceholderCssClass(){return this._hasPlaceholder}get _hasInfiniteScroll(){return!!(this.isEnabled&&this._selectPageComponent&&this._selectPageComponent._infiniteScroll)}get _shouldStoreItemValue(){return this.shouldStoreItemValue&&this._hasObjects}get searchText(){return this._searchText}get isSearching(){return this._isSearching}get hasSearchText(){return this._hasSearchText}get value(){return this._value}set value(e){this._value=e,this._valueItems.splice(0,this._valueItems.length),this.isMultiple?e&&e.length&&Array.prototype.push.apply(this._valueItems,e):this._isNullOrWhiteSpace(e)||this._valueItems.push(e),this._setIonItemHasValue(),this._setHasPlaceholder()}get isEnabled(){return this._isEnabled}set isEnabled(e){this._isEnabled=!!e,this.enableIonItem(this._isEnabled)}get isOpened(){return this._isOpened}get isOnSearchEnabled(){return this._isOnSearchEnabled}set isOnSearchEnabled(e){this._isOnSearchEnabled=!!e}get canClear(){return this._canClear}set canClear(e){this._canClear=!!e,this._countFooterButtons()}get isMultiple(){return this._isMultiple}set isMultiple(e){this._isMultiple=!!e,this._countFooterButtons()}get itemsToConfirm(){return this._itemsToConfirm}initFocus(){}enableIonItem(e){this.ionItem&&(this.ionItem.disabled=!e)}_isNullOrWhiteSpace(e){return null==e||e.toString().replace(/\s/g,"").length<1}_setHasSearchText(){this._hasSearchText=!this._isNullOrWhiteSpace(this._searchText)}_hasOnSearch(){return this.isOnSearchEnabled&&this.onSearch.observers.length>0}_select(e){this.value=e,this._emitValueChange()}_emitValueChange(){this.propagateOnChange(this.value),this.onChange.emit({component:this,value:this.value})}_emitSearch(){this.canSearch&&this.onSearch.emit({component:this,text:this._searchText})}_formatItem(e){return this._isNullOrWhiteSpace(e)?null:this.itemTextField?e[this.itemTextField]:e.toString()}_getLabelText(){const e=this._ionItemElement?this._ionItemElement.querySelector("ion-label"):null;return e?e.textContent:null}_getItemValue(e){return this._hasObjects?e[this.itemValueField]:e}_getStoredItemValue(e){return this._hasObjects?this._shouldStoreItemValue?e:e[this.itemValueField]:e}_onSearchbarClear(){this._searchText=""}_filterItems(){if(this._setHasSearchText(),this._hasOnSearch())this._emitSearch();else{let e=[];if(this._searchText&&this._searchText.trim()){const t=this._searchText.trim().toLowerCase();this._groups.forEach(s=>{const n=s.items.filter(e=>{return-1!==(this.itemTextField?e[this.itemTextField]:e).toString().toLowerCase().indexOf(t)});n.length&&e.push({value:s.value,text:s.text,items:n})}),e.length||e.push({items:[]})}else e=this._groups;this._filteredGroups=e}}_isItemSelected(e){return void 0!==this._selectedItems.find(t=>this._getItemValue(e)===this._getStoredItemValue(t))}_addSelectedItem(e){this._shouldStoreItemValue?this._selectedItems.push(this._getItemValue(e)):this._selectedItems.push(e)}_deleteSelectedItem(e){let t;this._selectedItems.forEach((s,n)=>{this._getItemValue(e)===this._getStoredItemValue(s)&&(t=n)}),this._selectedItems.splice(t,1)}_click(){this.isEnabled&&(this._labelText=this._getLabelText(),this.open().then(()=>{this.onOpen.emit({component:this})}))}_countFooterButtons(){let e=0;this.canClear&&e++,this.isMultiple&&e++,this._footerButtonsCount=e}_setItems(e){const t=[{items:e||[]}];this._groups=t,this._filteredGroups=this._groups}_formatValueItem(e){if(this._shouldStoreItemValue){const t=this.items.find(t=>t[this.itemValueField]===e);return this._formatItem(t)}return this._formatItem(e)}_setIonItemHasFocus(e){this.ionItem&&this._setIonItemCssClass("item-has-focus",e)}_setIonItemHasValue(){this.ionItem&&this._setIonItemCssClass("item-has-value",this.hasValue())}_setHasPlaceholder(){this._hasPlaceholder=!this.hasValue()&&!this._isNullOrWhiteSpace(this.placeholder)}_setIonItemCssClass(e,t){this._ionItemElement&&this._renderer.setElementClass(this._ionItemElement,e,t)}writeValue(e){this.value=e}registerOnChange(e){this.propagateOnChange=e}registerOnTouched(e){this.propagateOnTouched=e}setDisabledState(e){this.isEnabled=!e}ngOnInit(){this._isIos=this._platform.is("ios"),this._isMD=!this._isIos,this._hasObjects=!this._isNullOrWhiteSpace(this.itemValueField),this.ionItem&&(this._ionItemElement=this._element.nativeElement.closest("ion-item"),this._setIonItemCssClass("item-interactive",!0),this._setIonItemCssClass("item-ionic-selectable",!0)),this.enableIonItem(this.isEnabled)}ngDoCheck(){this._itemsDiffer.diff(this.items)&&(this._setItems(this.items),this.value=this.value,this.onItemsChange.emit({component:this}))}hasValue(){return this.isMultiple?0!==this._valueItems.length:0!==this._valueItems.length&&!this._isNullOrWhiteSpace(this._valueItems[0])}open(){const e=this;return new Promise(function(t,s){e._isEnabled&&!e._isOpened?(e._filterItems(),e._isOpened=!0,e._modalController.create({component:IonicSelectablePageComponent,componentProps:{selectComponent:e}}).then(s=>{e._modal=s,s.present().then(()=>{e._setIonItemHasFocus(!0),t()}),s.onWillDismiss().then(()=>{e._setIonItemHasFocus(!1)}),s.onDidDismiss().then(t=>{e._isOpened=!1,e.isMultiple&&(e._itemsToConfirm=[]),"backdrop"===t.role&&e.onClose.emit({component:e})})})):s("IonicSelectable is disabled or already opened.")})}close(){const e=this;return new Promise(function(t,s){e._isEnabled&&e._isOpened?(e.propagateOnTouched(),e._isOpened=!1,e._modal.dismiss().then(()=>{e._setIonItemHasFocus(!1),t()})):s("IonicSelectable is disabled or already closed.")})}clear(){this.value=this.isMultiple?[]:null,this.isMultiple&&(this._itemsToConfirm=[]),this.propagateOnChange(this.value)}scrollToTop(){const e=this;return new Promise(function(t,s){e._isOpened?e._selectPageComponent._content.scrollToTop().then(()=>{t()}):s("IonicSelectable content cannot be scrolled.")})}scrollToBottom(){const e=this;return new Promise(function(t,s){e._isOpened?e._selectPageComponent._content.scrollToBottom().then(()=>{t()}):s("IonicSelectable content cannot be scrolled.")})}startSearch(){this._isEnabled&&this.showLoading()}endSearch(){this._isEnabled&&(this.hideLoading(),this._setItems(this.items))}enableInfiniteScroll(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!1)}disableInfiniteScroll(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!0)}endInfiniteScroll(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.complete(),this._setItems(this.items))}search(e){this._isEnabled&&this._isOpened&&this.canSearch&&(this._searchText=e,this._setHasSearchText(),this._filterItems())}showLoading(){this._isEnabled&&(this._isSearching=!0)}hideLoading(){this._isEnabled&&(this._isSearching=!1)}}IonicSelectableComponent.decorators=[{type:Component,args:[{selector:"ionic-selectable",template:'<div class="ionic-selectable-value">\n <span *ngIf="_valueItems.length">\n <div class="ionic-selectable-value-item" *ngFor="let valueItem of _valueItems">\n {{_formatValueItem(valueItem)}}\n </div>\n </span>\n <div class="ionic-selectable-value-item" *ngIf="_hasPlaceholder">\n {{placeholder}}\n </div>\n \x3c!-- Fix icon allignment when there\'s no value or placeholder. --\x3e\n <span *ngIf="!_valueItems.length && !_hasPlaceholder"> </span>\n</div>\n<div class="ionic-selectable-icon">\n <div class="ionic-selectable-icon-inner"></div>\n</div>\n<button class="ionic-selectable-cover" [disabled]="!isEnabled" (click)="_click()">\n</button>\n',styles:[".item-label-floating .ionic-selectable,.item-label-stacked .ionic-selectable{-ms-flex-item-align:stretch;align-self:stretch;max-width:100%;padding-left:0;padding-top:8px;padding-bottom:8px}.item-label-floating .ionic-selectable-value,.item-label-stacked .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:19px}.item-label-floating .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-icon-inner{top:7px}.item-label-floating .ionic-selectable-ios .ionic-selectable-value,.item-label-stacked .ionic-selectable-ios .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:20px}.item-label-floating .ionic-selectable-ios .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-ios .ionic-selectable-icon-inner{top:8px}.item:not(.item-label-stacked):not(.item-label-floating) .ionic-selectable-value{padding-left:var(--padding-start,16px)}.item-ionic-selectable .item-inner .input-wrapper{-webkit-box-align:normal;-ms-flex-align:normal;align-items:normal}.item-ionic-selectable ion-label{-webkit-box-flex:1;-ms-flex:1;flex:1;max-width:initial}.ionic-selectable{display:-webkit-box;display:-ms-flexbox;display:flex;max-width:45%}.ionic-selectable-has-placeholder .ionic-selectable-value-item{color:var(--placeholder-color,#999)}.ionic-selectable-value{-webkit-box-flex:1;-ms-flex:1;flex:1;padding-top:13px;padding-bottom:13px;overflow:hidden}.ionic-selectable-value-item{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ionic-selectable-value-item:not(:last-child){margin-bottom:5px}.ionic-selectable-icon{position:relative;width:20px}.ionic-selectable-icon-inner{position:absolute;top:20px;left:5px;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;pointer-events:none;color:var(--icon-color,#999)}.ionic-selectable-ios .ionic-selectable-value{padding-top:11px;padding-bottom:11px}.ionic-selectable-ios .ionic-selectable-icon-inner{top:19px}.ionic-selectable-spinner{position:fixed;bottom:0;top:0;left:0;right:0;z-index:1}.ionic-selectable-spinner-background{top:0;bottom:0;left:0;right:0;position:absolute;background-color:#000;opacity:.05}.ionic-selectable-spinner ion-spinner{position:absolute;top:50%;left:50%;z-index:10;margin-top:-14px;margin-left:-14px}.ionic-selectable-cover{left:0;top:0;margin:0;position:absolute;width:100%;height:100%;border:0;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:first-child{padding-right:8px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:last-child{padding-left:8px}.ionic-selectable-page.ionic-selectable-page-is-searching .scroll-content{overflow-y:hidden}"],encapsulation:ViewEncapsulation.None,providers:[{provide:NG_VALUE_ACCESSOR,useExisting:forwardRef(()=>IonicSelectableComponent),multi:!0}]}]}],IonicSelectableComponent.ctorParameters=(()=>[{type:ModalController},{type:Platform},{type:Item,decorators:[{type:Optional}]},{type:IterableDiffers},{type:ElementRef},{type:Renderer}]),IonicSelectableComponent.propDecorators={_cssClass:[{type:HostBinding,args:["class.ionic-selectable"]}],_isIos:[{type:HostBinding,args:["class.ionic-selectable-ios"]}],_isMD:[{type:HostBinding,args:["class.ionic-selectable-md"]}],_isMultipleCssClass:[{type:HostBinding,args:["class.ionic-selectable-is-multiple"]}],_hasValueCssClass:[{type:HostBinding,args:["class.ionic-selectable-has-value"]}],_hasPlaceholderCssClass:[{type:HostBinding,args:["class.ionic-selectable-has-placeholder"]}],items:[{type:Input}],itemsChange:[{type:Output}],isEnabled:[{type:HostBinding,args:["class.ionic-selectable-is-enabled"]},{type:Input,args:["isEnabled"]}],isOkButtonEnabled:[{type:Input}],itemValueField:[{type:Input}],itemTextField:[{type:Input}],canSearch:[{type:Input}],isOnSearchEnabled:[{type:Input,args:["isOnSearchEnabled"]}],canClear:[{type:HostBinding,args:["class.ionic-selectable-can-clear"]},{type:Input,args:["canClear"]}],hasInfiniteScroll:[{type:Input}],hasVirtualScroll:[{type:Input}],virtualScrollApproxItemHeight:[{type:Input}],searchPlaceholder:[{type:Input}],placeholder:[{type:Input}],isMultiple:[{type:Input,args:["isMultiple"]}],searchFailText:[{type:Input}],clearButtonText:[{type:Input}],okButtonText:[{type:Input}],closeButtonText:[{type:Input}],shouldFocusSearchbar:[{type:Input}],headerColor:[{type:Input}],onChange:[{type:Output}],onSearch:[{type:Output}],onInfiniteScroll:[{type:Output}],onOpen:[{type:Output}],onClose:[{type:Output}],searchDebounce:[{type:Input}],shouldStoreItemValue:[{type:Input}]};class IonicSelectablePageComponent{constructor(e){this.navParams=e,this._cssClass=!0,this.selectComponent=this.navParams.get("selectComponent"),this.selectComponent._selectPageComponent=this,this.selectComponent._selectedItems=[],this.selectComponent._isNullOrWhiteSpace(this.selectComponent.value)||(this.selectComponent.isMultiple?this.selectComponent.value.forEach(e=>{this.selectComponent._selectedItems.push(e)}):this.selectComponent._selectedItems.push(this.selectComponent.value)),this._setItemsToConfirm(this.selectComponent._selectedItems)}get _canClearCssClass(){return this.selectComponent.canClear}get _isMultipleCssClass(){return this.selectComponent.isMultiple}get _isSearchingCssClass(){return this.selectComponent._isSearching}get _isIos(){return this.selectComponent._isIos}_isMD(){return this.selectComponent._isMD}ngAfterViewInit(){this._searchbarComponent&&this.selectComponent.shouldFocusSearchbar&&setTimeout(()=>{this._searchbarComponent.focus()},1e3)}_setItemsToConfirm(e){this.selectComponent._itemsToConfirm=[].concat(e)}_getMoreItems(){this.selectComponent.onInfiniteScroll.emit({component:this.selectComponent,text:this.selectComponent._searchText})}_select(e){this.selectComponent.isMultiple?(this.selectComponent._isItemSelected(e)?this.selectComponent._deleteSelectedItem(e):this.selectComponent._addSelectedItem(e),this._setItemsToConfirm(this.selectComponent._selectedItems)):(this.selectComponent._isItemSelected(e)||(this.selectComponent._selectedItems=[],this.selectComponent._addSelectedItem(e),this.selectComponent._shouldStoreItemValue?this.selectComponent._select(this.selectComponent._getItemValue(e)):this.selectComponent._select(e)),this._close())}_ok(){this.selectComponent._select(this.selectComponent._selectedItems),this._close()}_close(){this.selectComponent.close().then(()=>{this.selectComponent.onClose.emit({component:this.selectComponent})}),this.selectComponent._hasOnSearch()||(this.selectComponent._searchText="",this.selectComponent._setHasSearchText())}_clear(){this.selectComponent.clear(),this.selectComponent._emitValueChange(),this.selectComponent.close().then(()=>{this.selectComponent.onClose.emit({component:this.selectComponent})})}}IonicSelectablePageComponent.decorators=[{type:Component,args:[{selector:"ionic-selectable-page",template:'<ion-header>\n <ion-toolbar [color]="selectComponent.headerColor ? selectComponent.headerColor : null">\n <ion-buttons slot="start">\n <ion-button (click)="_close()">\n {{selectComponent.closeButtonText}}\n </ion-button>\n </ion-buttons>\n <ion-title>\n <span>\n {{selectComponent._labelText}}\n </span>\n </ion-title>\n </ion-toolbar>\n <ion-toolbar *ngIf="selectComponent.canSearch">\n <ion-searchbar *ngIf="selectComponent.canSearch" #searchbarComponent\n [(ngModel)]="selectComponent._searchText" (ionChange)="selectComponent._filterItems()"\n (ionClear)="selectComponent._onSearchbarClear()" [placeholder]="selectComponent.searchPlaceholder"\n [debounce]="selectComponent.searchDebounce">\n </ion-searchbar>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <div class="ionic-selectable-spinner" *ngIf="selectComponent._isSearching">\n <div class="ionic-selectable-spinner-background"></div>\n <ion-spinner></ion-spinner>\n </div>\n <ion-list no-margin *ngIf="!selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length">\n <ion-item-group *ngFor="let group of selectComponent._filteredGroups" class="ionic-selectable-group">\n <ion-item button detail="false" *ngFor="let item of group.items" (click)="_select(item)"\n class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item)\n }">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null"\n slot="start">\n </ion-icon>\n <span>\n {{selectComponent._formatItem(item)}}\n </span>\n </ion-item>\n </ion-item-group>\n </ion-list>\n \x3c!-- Fail text should be above InfiniteScroll to avoid a gap when no items are found. --\x3e\n <div *ngIf="!selectComponent._filteredGroups.length || !selectComponent._filteredGroups[0].items.length">\n <div margin>\n {{selectComponent.searchFailText}}\n </div>\n </div>\n <ion-infinite-scroll *ngIf="!selectComponent.hasVirtualScroll" [disabled]="!selectComponent.hasInfiniteScroll"\n (ionInfinite)="_getMoreItems($event)">\n <ion-infinite-scroll-content></ion-infinite-scroll-content>\n </ion-infinite-scroll>\n <ion-virtual-scroll no-margin *ngIf="selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length"\n [items]="selectComponent._filteredGroups[0].items" [approxItemHeight]="selectComponent.virtualScrollApproxItemHeight">\n <ion-item button detail="false" *virtualItem="let item" (click)="_select(item)"\n class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item)\n }">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null" slot="start">\n </ion-icon>\n <span>\n {{selectComponent._formatItem(item)}}\n </span>\n </ion-item>\n </ion-virtual-scroll>\n</ion-content>\n<ion-footer *ngIf="selectComponent._footerButtonsCount > 0">\n <ion-toolbar>\n <ion-row>\n <ion-col *ngIf="selectComponent.canClear" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)=" _clear()" [disabled]="!selectComponent._selectedItems.length">\n {{selectComponent.clearButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf="selectComponent.isMultiple" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)=" _ok()" [disabled]="!selectComponent.isOkButtonEnabled">\n {{selectComponent.okButtonText}}\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-toolbar>\n</ion-footer>\n'}]}],IonicSelectablePageComponent.ctorParameters=(()=>[{type:NavParams}]),IonicSelectablePageComponent.propDecorators={_content:[{type:ViewChild,args:[Content]}],_searchbarComponent:[{type:ViewChild,args:["searchbarComponent"]}],_infiniteScroll:[{type:ViewChild,args:[InfiniteScroll]}],_cssClass:[{type:HostBinding,args:["class.ionic-selectable-page"]}],_canClearCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-can-clear"]}],_isMultipleCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-is-multiple"]}],_isSearchingCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-is-searching"]}],_isIos:[{type:HostBinding,args:["class.ionic-selectable-page-ios"]}],_isMD:[{type:HostBinding,args:["class.ionic-selectable-page-md"]}]};const components=[IonicSelectableComponent,IonicSelectablePageComponent];class IonicSelectableModule{}IonicSelectableModule.decorators=[{type:NgModule,args:[{imports:[CommonModule,FormsModule,IonicModule],declarations:[...components],exports:[...components],entryComponents:components}]}],IonicSelectableModule.ctorParameters=(()=>[]);export{IonicSelectablePageComponent,IonicSelectableComponent,IonicSelectableModule}; | ||
| import{Directive,Component,ContentChild,ElementRef,EventEmitter,forwardRef,HostBinding,Input,IterableDiffers,Optional,Output,Renderer,TemplateRef,ViewEncapsulation,HostListener,ViewChild,NgModule}from"@angular/core";import{NG_VALUE_ACCESSOR,FormsModule}from"@angular/forms";import{Item,ModalController,Platform,Content,InfiniteScroll,NavParams,IonicModule}from"@ionic/angular";import"rxjs";import{CommonModule}from"@angular/common";class IonicSelectableAddItemTemplateDirective{}IonicSelectableAddItemTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableAddItemTemplate]"}]}],IonicSelectableAddItemTemplateDirective.ctorParameters=(()=>[]);class IonicSelectableCloseButtonTemplateDirective{}IonicSelectableCloseButtonTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableCloseButtonTemplate]"}]}],IonicSelectableCloseButtonTemplateDirective.ctorParameters=(()=>[]);class IonicSelectableGroupRightTemplateDirective{}IonicSelectableGroupRightTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableGroupRightTemplate]"}]}],IonicSelectableGroupRightTemplateDirective.ctorParameters=(()=>[]);class IonicSelectableGroupTemplateDirective{}IonicSelectableGroupTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableGroupTemplate]"}]}],IonicSelectableGroupTemplateDirective.ctorParameters=(()=>[]);class IonicSelectableItemRightTemplateDirective{}IonicSelectableItemRightTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableItemRightTemplate]"}]}],IonicSelectableItemRightTemplateDirective.ctorParameters=(()=>[]);class IonicSelectableItemTemplateDirective{}IonicSelectableItemTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableItemTemplate]"}]}],IonicSelectableItemTemplateDirective.ctorParameters=(()=>[]);class IonicSelectableMessageTemplateDirective{}IonicSelectableMessageTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableMessageTemplate]"}]}],IonicSelectableMessageTemplateDirective.ctorParameters=(()=>[]);class IonicSelectablePlaceholderTemplateDirective{}IonicSelectablePlaceholderTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectablePlaceholderTemplate]"}]}],IonicSelectablePlaceholderTemplateDirective.ctorParameters=(()=>[]);class IonicSelectableSearchFailTemplateDirective{}IonicSelectableSearchFailTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableSearchFailTemplate]"}]}],IonicSelectableSearchFailTemplateDirective.ctorParameters=(()=>[]);class IonicSelectableTitleTemplateDirective{}IonicSelectableTitleTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableTitleTemplate]"}]}],IonicSelectableTitleTemplateDirective.ctorParameters=(()=>[]);class IonicSelectableValueTemplateDirective{}IonicSelectableValueTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableValueTemplate]"}]}],IonicSelectableValueTemplateDirective.ctorParameters=(()=>[]);class IonicSelectableComponent{constructor(e,t,i,n,l,s){this._modalController=e,this._platform=t,this.ionItem=i,this._iterableDiffers=n,this._element=l,this._renderer=s,this._cssClass=!0,this._isOnSearchEnabled=!0,this._isEnabled=!0,this._isOpened=!1,this._value=null,this._canClear=!1,this._isMultiple=!1,this._canAddItem=!1,this.onItemsChange=new EventEmitter,this._valueItems=[],this._searchText="",this._hasSearchText=!1,this._groups=[],this._itemsToConfirm=[],this._selectedItems=[],this._filteredGroups=[],this._isAddItemTemplateVisible=!1,this._isFooterVisible=!0,this._itemToAdd=null,this._footerButtonsCount=0,this.items=[],this.itemsChange=new EventEmitter,this.isOkButtonEnabled=!0,this.itemValueField=null,this.itemTextField=null,this.groupValueField=null,this.groupTextField=null,this.canSearch=!1,this.hasInfiniteScroll=!1,this.hasVirtualScroll=!1,this.virtualScrollApproxItemHeight="40px",this.searchPlaceholder="Search",this.placeholder=null,this.searchFailText="No items found.",this.clearButtonText="Clear",this.addButtonText="Add",this.okButtonText="OK",this.closeButtonText="Cancel",this.shouldFocusSearchbar=!1,this.headerColor=null,this.groupColor=null,this.onChange=new EventEmitter,this.onSearch=new EventEmitter,this.onSearchFail=new EventEmitter,this.onSearchSuccess=new EventEmitter,this.onInfiniteScroll=new EventEmitter,this.onOpen=new EventEmitter,this.onClose=new EventEmitter,this.searchDebounce=250,this.disabledItems=[],this.shouldStoreItemValue=!1,this.canSaveItem=!1,this.canDeleteItem=!1,this.onSaveItem=new EventEmitter,this.onDeleteItem=new EventEmitter,this.onAddItem=new EventEmitter,this.virtualScrollHeaderFn=(()=>null),this.propagateOnChange=(e=>{}),this.propagateOnTouched=(()=>{}),this.items&&this.items.length||(this.items=[]),this._itemsDiffer=this._iterableDiffers.find(this.items).create()}get _isMultipleCssClass(){return this.isMultiple}get _hasValueCssClass(){return this.hasValue()}get _hasPlaceholderCssClass(){return this._hasPlaceholder}get _hasInfiniteScroll(){return!!(this.isEnabled&&this._selectPageComponent&&this._selectPageComponent._infiniteScroll)}get _shouldStoreItemValue(){return this.shouldStoreItemValue&&this._hasObjects}get searchText(){return this._searchText}get isSearching(){return this._isSearching}get hasSearchText(){return this._hasSearchText}get value(){return this._value}set value(e){this._value=e,this._valueItems.splice(0,this._valueItems.length),this.isMultiple?e&&e.length&&Array.prototype.push.apply(this._valueItems,e):this._isNullOrWhiteSpace(e)||this._valueItems.push(e),this._setIonItemHasValue(),this._setHasPlaceholder()}get isEnabled(){return this._isEnabled}set isEnabled(e){this._isEnabled=!!e,this.enableIonItem(this._isEnabled)}get isOpened(){return this._isOpened}get isOnSearchEnabled(){return this._isOnSearchEnabled}set isOnSearchEnabled(e){this._isOnSearchEnabled=!!e}get canClear(){return this._canClear}set canClear(e){this._canClear=!!e,this._countFooterButtons()}get isMultiple(){return this._isMultiple}set isMultiple(e){this._isMultiple=!!e,this._countFooterButtons()}get itemsToConfirm(){return this._itemsToConfirm}get canAddItem(){return this._canAddItem}set canAddItem(e){this._canAddItem=!!e,this._countFooterButtons()}initFocus(){}enableIonItem(e){this.ionItem&&(this.ionItem.disabled=!e)}_isNullOrWhiteSpace(e){return null==e||e.toString().replace(/\s/g,"").length<1}_setHasSearchText(){this._hasSearchText=!this._isNullOrWhiteSpace(this._searchText)}_hasOnSearch(){return this.isOnSearchEnabled&&this.onSearch.observers.length>0}_hasOnSaveItem(){return this.canSaveItem&&this.onSaveItem.observers.length>0}_hasOnAddItem(){return this.canAddItem&&this.onAddItem.observers.length>0}_hasOnDeleteItem(){return this.canDeleteItem&&this.onDeleteItem.observers.length>0}_select(e){this.value=e,this._emitValueChange()}_emitValueChange(){this.propagateOnChange(this.value),this.onChange.emit({component:this,value:this.value})}_emitSearch(){this.canSearch&&this.onSearch.emit({component:this,text:this._searchText})}_formatItem(e){return this._isNullOrWhiteSpace(e)?null:this.itemTextField?e[this.itemTextField]:e.toString()}_getLabelText(){const e=this._ionItemElement?this._ionItemElement.querySelector("ion-label"):null;return e?e.textContent:null}_getItemValue(e){return this._hasObjects?e[this.itemValueField]:e}_getStoredItemValue(e){return this._hasObjects?this._shouldStoreItemValue?e:e[this.itemValueField]:e}_onSearchbarClear(){this._searchText=""}_filterItems(){if(this._setHasSearchText(),this._hasOnSearch())this._emitSearch();else{let e=[];if(this._searchText&&this._searchText.trim()){const t=this._searchText.trim().toLowerCase();this._groups.forEach(i=>{const n=i.items.filter(e=>{return-1!==(this.itemTextField?e[this.itemTextField]:e).toString().toLowerCase().indexOf(t)});n.length&&e.push({value:i.value,text:i.text,items:n})}),e.length||e.push({items:[]})}else e=this._groups;this._filteredGroups=e,this._areGroupsEmpty(e)?this.onSearchFail.emit({component:this,text:this._searchText}):this.onSearchSuccess.emit({component:this,text:this._searchText})}}_isItemDisabled(e){if(this.disabledItems)return this.disabledItems.some(t=>this._getItemValue(t)===this._getItemValue(e))}_isItemSelected(e){return void 0!==this._selectedItems.find(t=>this._getItemValue(e)===this._getStoredItemValue(t))}_addSelectedItem(e){this._shouldStoreItemValue?this._selectedItems.push(this._getItemValue(e)):this._selectedItems.push(e)}_deleteSelectedItem(e){let t;this._selectedItems.forEach((i,n)=>{this._getItemValue(e)===this._getStoredItemValue(i)&&(t=n)}),this._selectedItems.splice(t,1)}_click(){this.isEnabled&&(this._labelText=this._getLabelText(),this.open().then(()=>{this.onOpen.emit({component:this})}))}_saveItem(e,t){e.stopPropagation(),this._itemToAdd=t,this._hasOnSaveItem()?this.onSaveItem.emit({component:this,item:this._itemToAdd}):this.showAddItemTemplate()}_deleteItemClick(e,t){e.stopPropagation(),this._itemToAdd=t,this._hasOnDeleteItem()?this.onDeleteItem.emit({component:this,item:this._itemToAdd}):this.deleteItem(this._itemToAdd)}_addItemClick(){this._itemToAdd=null,this._hasOnAddItem()?this.onAddItem.emit({component:this}):this.showAddItemTemplate()}_positionAddItemTemplate(){setTimeout(()=>{const e=this._selectPageComponent._element.nativeElement.querySelector(".ionic-selectable-add-item-template ion-footer");this._addItemTemplateFooterHeight=e?`calc(100% - ${e.offsetHeight}px)`:"100%"},100)}_areGroupsEmpty(e){return 0===e.length||e.every(e=>!e.items||0===e.items.length)}_countFooterButtons(){let e=0;this.canClear&&e++,this.isMultiple&&e++,this.canAddItem&&e++,this._footerButtonsCount=e}_setItems(e){let t=[{items:e||[]}];e&&e.length&&this._hasGroups&&(t=[],e.forEach(e=>{const i=this._getPropertyValue(e,this.groupValueField),n=t.find(e=>e.value===i);n?n.items.push(e):t.push({value:i,text:this._getPropertyValue(e,this.groupTextField),items:[e]})})),this._groups=t,this._filteredGroups=this._groups}_formatValueItem(e){if(this._shouldStoreItemValue){const t=this.items.find(t=>t[this.itemValueField]===e);return this._formatItem(t)}return this._formatItem(e)}_getPropertyValue(e,t){return t?t.split(".").reduce((e,t)=>e?e[t]:null,e):null}_setIonItemHasFocus(e){this.ionItem&&this._setIonItemCssClass("item-has-focus",e)}_setIonItemHasValue(){this.ionItem&&this._setIonItemCssClass("item-has-value",this.hasValue())}_setHasPlaceholder(){this._hasPlaceholder=!(this.hasValue()||this._isNullOrWhiteSpace(this.placeholder)&&!this.placeholderTemplate)}_setIonItemCssClass(e,t){this._ionItemElement&&this._renderer.setElementClass(this._ionItemElement,e,t)}_toggleAddItemTemplate(e){this.addItemTemplate&&(this._isAddItemTemplateVisible=e,this._isFooterVisible=!e)}writeValue(e){this.value=e}registerOnChange(e){this.propagateOnChange=e}registerOnTouched(e){this.propagateOnTouched=e}setDisabledState(e){this.isEnabled=!e}ngOnInit(){this._isIos=this._platform.is("ios"),this._isMD=!this._isIos,this._hasObjects=!this._isNullOrWhiteSpace(this.itemValueField),this._hasGroups=Boolean(this._hasObjects&&this.groupValueField&&!this.hasVirtualScroll),this.ionItem&&(this._ionItemElement=this._element.nativeElement.closest("ion-item"),this._setIonItemCssClass("item-interactive",!0),this._setIonItemCssClass("item-ionic-selectable",!0)),this.enableIonItem(this.isEnabled)}ngDoCheck(){this._itemsDiffer.diff(this.items)&&(this._setItems(this.items),this.value=this.value,this.onItemsChange.emit({component:this}))}addItem(e){const t=this;return this.items.unshift(e),this._addItemObservable&&this._addItemObservable.unsubscribe(),new Promise(function(e,i){t._addItemObservable=t.onItemsChange.asObservable().subscribe(()=>{t._addItemObservable.unsubscribe(),e()},()=>{t._addItemObservable.unsubscribe(),i()})})}deleteItem(e){const t=this;let i=!1;if(this._selectedItems&&(this._selectedItems=this._selectedItems.filter(t=>this._getItemValue(e)!==this._getStoredItemValue(t))),this.value)if(this.isMultiple){const t=this.value.filter(t=>t.id!==e.id);t.length!==this.value.length&&(this.value=t,i=!0)}else e===this.value&&(this.value=null,i=!0);i&&this._emitValueChange();const n=this.items.filter(t=>t.id!==e.id);return this.itemsChange.emit(n),this._setItems(n),this.onItemsChange.emit({component:this}),this._deleteItemObservable&&this._deleteItemObservable.unsubscribe(),new Promise(function(e,i){t._deleteItemObservable=t.onItemsChange.asObservable().subscribe(()=>{t._deleteItemObservable.unsubscribe(),e()},()=>{t._deleteItemObservable.unsubscribe(),i()})})}hasValue(){return this.isMultiple?0!==this._valueItems.length:0!==this._valueItems.length&&!this._isNullOrWhiteSpace(this._valueItems[0])}open(){const e=this;return new Promise(function(t,i){e._isEnabled&&!e._isOpened?(e._filterItems(),e._isOpened=!0,e._modalController.create({component:IonicSelectablePageComponent,componentProps:{selectComponent:e}}).then(i=>{e._modal=i,i.present().then(()=>{e._setIonItemHasFocus(!0),t()}),i.onWillDismiss().then(()=>{e._setIonItemHasFocus(!1)}),i.onDidDismiss().then(t=>{e._isOpened=!1,e.isMultiple&&(e._itemsToConfirm=[]),"backdrop"===t.role&&e.onClose.emit({component:e})})})):i("IonicSelectable is disabled or already opened.")})}close(){const e=this;return new Promise(function(t,i){e._isEnabled&&e._isOpened?(e.propagateOnTouched(),e._isOpened=!1,e._itemToAdd=null,e._modal.dismiss().then(()=>{e._setIonItemHasFocus(!1),e.hideAddItemTemplate(),t()})):i("IonicSelectable is disabled or already closed.")})}clear(){this.value=this.isMultiple?[]:null,this.isMultiple&&(this._itemsToConfirm=[]),this.propagateOnChange(this.value)}scrollToTop(){const e=this;return new Promise(function(t,i){e._isOpened?e._selectPageComponent._content.scrollToTop().then(()=>{t()}):i("IonicSelectable content cannot be scrolled.")})}scrollToBottom(){const e=this;return new Promise(function(t,i){e._isOpened?e._selectPageComponent._content.scrollToBottom().then(()=>{t()}):i("IonicSelectable content cannot be scrolled.")})}startSearch(){this._isEnabled&&this.showLoading()}endSearch(){this._isEnabled&&(this.hideLoading(),this._setItems(this.items),this._areGroupsEmpty(this._filteredGroups)?this.onSearchFail.emit({component:this,text:this._searchText}):this.onSearchSuccess.emit({component:this,text:this._searchText}))}enableInfiniteScroll(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!1)}disableInfiniteScroll(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!0)}endInfiniteScroll(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.complete(),this._setItems(this.items))}search(e){this._isEnabled&&this._isOpened&&this.canSearch&&(this._searchText=e,this._setHasSearchText(),this._filterItems())}showLoading(){this._isEnabled&&(this._isSearching=!0)}hideLoading(){this._isEnabled&&(this._isSearching=!1)}showAddItemTemplate(){this._toggleAddItemTemplate(!0),this._positionAddItemTemplate()}hideAddItemTemplate(){this._toggleAddItemTemplate(!1)}}IonicSelectableComponent.decorators=[{type:Component,args:[{selector:"ionic-selectable",template:'<div class="ionic-selectable-inner">\n <div class="ionic-selectable-value">\n <div *ngIf="valueTemplate && _valueItems.length && isMultiple"\n [ngTemplateOutlet]="valueTemplate" [ngTemplateOutletContext]="{ value: _valueItems }">\n </div>\n <div class="ionic-selectable-value-item" *ngIf="valueTemplate && _valueItems.length && !isMultiple">\n <div [ngTemplateOutlet]="valueTemplate" [ngTemplateOutletContext]="{ value: _valueItems[0] }">\n </div>\n </div>\n <span *ngIf="!valueTemplate && _valueItems.length">\n <div class="ionic-selectable-value-item" *ngFor="let valueItem of _valueItems">\n {{_formatValueItem(valueItem)}}\n </div>\n </span>\n <div *ngIf="_hasPlaceholder && placeholderTemplate" class="ionic-selectable-value-item">\n <div [ngTemplateOutlet]="placeholderTemplate">\n </div>\n </div>\n <div class="ionic-selectable-value-item" *ngIf="_hasPlaceholder && !placeholderTemplate">\n {{placeholder}}\n </div>\n \x3c!-- Fix icon allignment when there\'s no value or placeholder. --\x3e\n <span *ngIf="!_valueItems.length && !_hasPlaceholder"> </span>\n </div>\n <div class="ionic-selectable-icon">\n <div class="ionic-selectable-icon-inner"></div>\n </div>\n <button class="ionic-selectable-cover" [disabled]="!isEnabled" (click)="_click()">\n </button>\n</div>\n',styles:[".item:not(.item-label) .ionic-selectable{max-width:100%;width:100%}.item:not(.item-label) .ionic-selectable-value-item{text-align:right}.item-label-floating .ionic-selectable,.item-label-stacked .ionic-selectable{-ms-flex-item-align:stretch;align-self:stretch;max-width:100%;padding-left:0;padding-top:8px;padding-bottom:8px}.item-label-floating .ionic-selectable-value,.item-label-stacked .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:19px}.item-label-floating .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-icon-inner{top:7px}.item-label-floating .ionic-selectable-ios .ionic-selectable-value,.item-label-stacked .ionic-selectable-ios .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:20px}.item-label-floating .ionic-selectable-ios .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-ios .ionic-selectable-icon-inner{top:8px}.item:not(.item-label-stacked):not(.item-label-floating) .ionic-selectable-value{padding-left:var(--padding-start,16px)}.item-ionic-selectable .item-inner .input-wrapper{-webkit-box-align:normal;-ms-flex-align:normal;align-items:normal}.item-ionic-selectable ion-label{-webkit-box-flex:1;-ms-flex:1;flex:1;max-width:initial}.ionic-selectable{display:block;max-width:45%}.ionic-selectable-inner{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.ionic-selectable-has-placeholder .ionic-selectable-value-item{color:var(--placeholder-color,#999)}.ionic-selectable-value{-webkit-box-flex:1;-ms-flex:1;flex:1;padding-top:13px;padding-bottom:13px;overflow:hidden}.ionic-selectable-value-item{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ionic-selectable-value-item:not(:last-child){margin-bottom:5px}.ionic-selectable-icon{position:relative;width:20px}.ionic-selectable-icon-inner{position:absolute;top:20px;left:5px;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;pointer-events:none;color:var(--icon-color,#999)}.ionic-selectable-ios .ionic-selectable-value{padding-top:11px;padding-bottom:11px}.ionic-selectable-ios .ionic-selectable-icon-inner{top:19px}.ionic-selectable-spinner{position:fixed;bottom:0;top:0;left:0;right:0;z-index:1}.ionic-selectable-spinner-background{top:0;bottom:0;left:0;right:0;position:absolute;background-color:#000;opacity:.05}.ionic-selectable-spinner ion-spinner{position:absolute;top:50%;left:50%;z-index:10;margin-top:-14px;margin-left:-14px}.ionic-selectable-cover{left:0;top:0;margin:0;position:absolute;width:100%;height:100%;border:0;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0}.ionic-selectable-add-item-template{position:fixed;bottom:0;left:0;right:0;background-color:#fff}.ionic-selectable-add-item-template-inner{overflow-y:auto}.ionic-selectable-add-item-template-inner>ion-footer{bottom:0;position:absolute}.ionic-selectable-page-ios .ionic-selectable-message{padding:8px}.ionic-selectable-page-md .ionic-selectable-message{padding:8px 12px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:first-child{padding-right:8px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:last-child{padding-left:8px}.ionic-selectable-page.ionic-selectable-page-is-add-item-template-visible>.content>.scroll-content,.ionic-selectable-page.ionic-selectable-page-is-searching .scroll-content{overflow-y:hidden}"],encapsulation:ViewEncapsulation.None,providers:[{provide:NG_VALUE_ACCESSOR,useExisting:forwardRef(()=>IonicSelectableComponent),multi:!0}]}]}],IonicSelectableComponent.ctorParameters=(()=>[{type:ModalController},{type:Platform},{type:Item,decorators:[{type:Optional}]},{type:IterableDiffers},{type:ElementRef},{type:Renderer}]),IonicSelectableComponent.propDecorators={_cssClass:[{type:HostBinding,args:["class.ionic-selectable"]}],_isIos:[{type:HostBinding,args:["class.ionic-selectable-ios"]}],_isMD:[{type:HostBinding,args:["class.ionic-selectable-md"]}],_isMultipleCssClass:[{type:HostBinding,args:["class.ionic-selectable-is-multiple"]}],_hasValueCssClass:[{type:HostBinding,args:["class.ionic-selectable-has-value"]}],_hasPlaceholderCssClass:[{type:HostBinding,args:["class.ionic-selectable-has-placeholder"]}],items:[{type:Input}],itemsChange:[{type:Output}],isEnabled:[{type:HostBinding,args:["class.ionic-selectable-is-enabled"]},{type:Input,args:["isEnabled"]}],isOkButtonEnabled:[{type:Input}],itemValueField:[{type:Input}],itemTextField:[{type:Input}],groupValueField:[{type:Input}],groupTextField:[{type:Input}],canSearch:[{type:Input}],isOnSearchEnabled:[{type:Input,args:["isOnSearchEnabled"]}],canClear:[{type:HostBinding,args:["class.ionic-selectable-can-clear"]},{type:Input,args:["canClear"]}],hasInfiniteScroll:[{type:Input}],hasVirtualScroll:[{type:Input}],virtualScrollApproxItemHeight:[{type:Input}],searchPlaceholder:[{type:Input}],placeholder:[{type:Input}],isMultiple:[{type:Input,args:["isMultiple"]}],searchFailText:[{type:Input}],clearButtonText:[{type:Input}],addButtonText:[{type:Input}],okButtonText:[{type:Input}],closeButtonText:[{type:Input}],shouldFocusSearchbar:[{type:Input}],headerColor:[{type:Input}],groupColor:[{type:Input}],onChange:[{type:Output}],onSearch:[{type:Output}],onSearchFail:[{type:Output}],onSearchSuccess:[{type:Output}],onInfiniteScroll:[{type:Output}],onOpen:[{type:Output}],onClose:[{type:Output}],searchDebounce:[{type:Input}],disabledItems:[{type:Input}],shouldStoreItemValue:[{type:Input}],canSaveItem:[{type:Input}],canDeleteItem:[{type:Input}],canAddItem:[{type:Input,args:["canAddItem"]}],onSaveItem:[{type:Output}],onDeleteItem:[{type:Output}],onAddItem:[{type:Output}],valueTemplate:[{type:ContentChild,args:[IonicSelectableValueTemplateDirective,{read:TemplateRef}]}],itemTemplate:[{type:ContentChild,args:[IonicSelectableItemTemplateDirective,{read:TemplateRef}]}],itemRightTemplate:[{type:ContentChild,args:[IonicSelectableItemRightTemplateDirective,{read:TemplateRef}]}],titleTemplate:[{type:ContentChild,args:[IonicSelectableTitleTemplateDirective,{read:TemplateRef}]}],placeholderTemplate:[{type:ContentChild,args:[IonicSelectablePlaceholderTemplateDirective,{read:TemplateRef}]}],messageTemplate:[{type:ContentChild,args:[IonicSelectableMessageTemplateDirective,{read:TemplateRef}]}],groupTemplate:[{type:ContentChild,args:[IonicSelectableGroupTemplateDirective,{read:TemplateRef}]}],groupRightTemplate:[{type:ContentChild,args:[IonicSelectableGroupRightTemplateDirective,{read:TemplateRef}]}],closeButtonTemplate:[{type:ContentChild,args:[IonicSelectableCloseButtonTemplateDirective,{read:TemplateRef}]}],searchFailTemplate:[{type:ContentChild,args:[IonicSelectableSearchFailTemplateDirective,{read:TemplateRef}]}],addItemTemplate:[{type:ContentChild,args:[IonicSelectableAddItemTemplateDirective,{read:TemplateRef}]}],virtualScrollHeaderFn:[{type:Input}]};class IonicSelectablePageComponent{constructor(e,t){this.navParams=e,this._element=t,this._cssClass=!0,this.selectComponent=this.navParams.get("selectComponent"),this.selectComponent._selectPageComponent=this,this.selectComponent._selectedItems=[],this.selectComponent._isNullOrWhiteSpace(this.selectComponent.value)||(this.selectComponent.isMultiple?this.selectComponent.value.forEach(e=>{this.selectComponent._selectedItems.push(e)}):this.selectComponent._selectedItems.push(this.selectComponent.value)),this._setItemsToConfirm(this.selectComponent._selectedItems)}get _canClearCssClass(){return this.selectComponent.canClear}get _isMultipleCssClass(){return this.selectComponent.isMultiple}get _isSearchingCssClass(){return this.selectComponent._isSearching}get _isIos(){return this.selectComponent._isIos}_isMD(){return this.selectComponent._isMD}get _isAddItemTemplateVisibleCssClass(){return this.selectComponent._isAddItemTemplateVisible}onResize(){this.selectComponent._positionAddItemTemplate()}ngAfterViewInit(){this._header=this._element.nativeElement.querySelector("ion-header"),this._searchbarComponent&&this.selectComponent.shouldFocusSearchbar&&setTimeout(()=>{this._searchbarComponent.focus()},1e3)}_setItemsToConfirm(e){this.selectComponent._itemsToConfirm=[].concat(e)}_getMoreItems(){this.selectComponent.onInfiniteScroll.emit({component:this.selectComponent,text:this.selectComponent._searchText})}_select(e){this.selectComponent.isMultiple?(this.selectComponent._isItemSelected(e)?this.selectComponent._deleteSelectedItem(e):this.selectComponent._addSelectedItem(e),this._setItemsToConfirm(this.selectComponent._selectedItems)):(this.selectComponent._isItemSelected(e)||(this.selectComponent._selectedItems=[],this.selectComponent._addSelectedItem(e),this.selectComponent._shouldStoreItemValue?this.selectComponent._select(this.selectComponent._getItemValue(e)):this.selectComponent._select(e)),this._close())}_ok(){this.selectComponent._select(this.selectComponent._selectedItems),this._close()}_close(){this.selectComponent.close().then(()=>{this.selectComponent.onClose.emit({component:this.selectComponent})}),this.selectComponent._hasOnSearch()||(this.selectComponent._searchText="",this.selectComponent._setHasSearchText())}_clear(){this.selectComponent.clear(),this.selectComponent._emitValueChange(),this.selectComponent.close().then(()=>{this.selectComponent.onClose.emit({component:this.selectComponent})})}}IonicSelectablePageComponent.decorators=[{type:Component,args:[{selector:"ionic-selectable-page",template:'<ion-header>\n <ion-toolbar [color]="selectComponent.headerColor ? selectComponent.headerColor : null">\n <ion-buttons slot="start">\n <ion-button (click)="_close()">\n <span *ngIf="selectComponent.closeButtonTemplate" [ngTemplateOutlet]="selectComponent.closeButtonTemplate">\n </span>\n <span *ngIf="!selectComponent.closeButtonTemplate">\n {{selectComponent.closeButtonText}}\n </span>\n </ion-button>\n </ion-buttons>\n <ion-title>\n \x3c!-- Need span for for text ellipsis. --\x3e\n <span *ngIf="selectComponent.titleTemplate" [ngTemplateOutlet]="selectComponent.titleTemplate">\n </span>\n <span *ngIf="!selectComponent.titleTemplate">\n {{selectComponent._labelText}}\n </span>\n </ion-title>\n </ion-toolbar>\n <ion-toolbar *ngIf="selectComponent.canSearch || selectComponent.messageTemplate">\n <ion-searchbar *ngIf="selectComponent.canSearch" #searchbarComponent\n [(ngModel)]="selectComponent._searchText" (ionChange)="selectComponent._filterItems()"\n (ionClear)="selectComponent._onSearchbarClear()" [placeholder]="selectComponent.searchPlaceholder"\n [debounce]="selectComponent.searchDebounce">\n </ion-searchbar>\n <div class="ionic-selectable-message" *ngIf="selectComponent.messageTemplate">\n <div [ngTemplateOutlet]="selectComponent.messageTemplate">\n </div>\n </div>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <div class="ionic-selectable-spinner" *ngIf="selectComponent._isSearching">\n <div class="ionic-selectable-spinner-background"></div>\n <ion-spinner></ion-spinner>\n </div>\n <ion-list no-margin *ngIf="!selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length">\n <ion-item-group *ngFor="let group of selectComponent._filteredGroups" class="ionic-selectable-group">\n <ion-item-divider *ngIf="selectComponent._hasGroups" [color]="selectComponent.groupColor ? selectComponent.groupColor : null">\n \x3c!-- Need span for for text ellipsis. --\x3e\n <span *ngIf="selectComponent.groupTemplate" [ngTemplateOutlet]="selectComponent.groupTemplate"\n [ngTemplateOutletContext]="{ group: group }">\n </span>\n \x3c!-- Need ion-label for text ellipsis. --\x3e\n <ion-label *ngIf="!selectComponent.groupTemplate">\n {{group.text}}\n </ion-label>\n <div *ngIf="selectComponent.groupRightTemplate" slot="end">\n <div [ngTemplateOutlet]="selectComponent.groupRightTemplate"\n [ngTemplateOutletContext]="{ group: group }">\n </div>\n </div>\n </ion-item-divider>\n <ion-item button="true" detail="false" *ngFor="let item of group.items"\n (click)="_select(item)" class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item),\n \'ionic-selectable-item-is-disabled\': selectComponent._isItemDisabled(item)\n }"\n [disabled]="selectComponent._isItemDisabled(item)">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null"\n slot="start">\n </ion-icon>\n \x3c!-- Need span for text ellipsis. --\x3e\n <span *ngIf="selectComponent.itemTemplate" [ngTemplateOutlet]="selectComponent.itemTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </span>\n \x3c!-- Need ion-label for text ellipsis. --\x3e\n <ion-label *ngIf="!selectComponent.itemTemplate">\n {{selectComponent._formatItem(item)}}\n </ion-label>\n <div *ngIf="selectComponent.itemRightTemplate" slot="end">\n <div [ngTemplateOutlet]="selectComponent.itemRightTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </div>\n </div>\n <ion-button *ngIf="selectComponent.canSaveItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._saveItem($event, item)">\n <ion-icon slot="icon-only" name="md-create"></ion-icon>\n </ion-button>\n <ion-button *ngIf="selectComponent.canDeleteItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._deleteItemClick($event, item)">\n <ion-icon slot="icon-only" name="md-trash"></ion-icon>\n </ion-button>\n </ion-item>\n </ion-item-group>\n </ion-list>\n \x3c!-- Fail text should be above InfiniteScroll to avoid a gap when no items are found. --\x3e\n <div *ngIf="!selectComponent._filteredGroups.length || !selectComponent._filteredGroups[0].items.length">\n <span *ngIf="selectComponent.searchFailTemplate" [ngTemplateOutlet]="selectComponent.searchFailTemplate">\n </span>\n <div *ngIf="!selectComponent.searchFailTemplate" margin>\n {{selectComponent.searchFailText}}\n </div>\n </div>\n <ion-infinite-scroll *ngIf="!selectComponent.hasVirtualScroll" [disabled]="!selectComponent.hasInfiniteScroll"\n (ionInfinite)="_getMoreItems($event)">\n <ion-infinite-scroll-content></ion-infinite-scroll-content>\n </ion-infinite-scroll>\n <ion-virtual-scroll no-margin *ngIf="selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length"\n [items]="selectComponent._filteredGroups[0].items" [headerFn]="selectComponent.virtualScrollHeaderFn"\n [approxItemHeight]="selectComponent.virtualScrollApproxItemHeight">\n <ion-item-divider *virtualHeader="let header" [color]="selectComponent.groupColor ? selectComponent.groupColor : null">\n {{header}}\n </ion-item-divider>\n <ion-item button="true" detail="false" *virtualItem="let item" (click)="_select(item)"\n class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item),\n \'ionic-selectable-item-is-disabled\': selectComponent._isItemDisabled(item)\n }"\n [disabled]="selectComponent._isItemDisabled(item)">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null" slot="start">\n </ion-icon>\n \x3c!-- Need span for text ellipsis. --\x3e\n <span *ngIf="selectComponent.itemTemplate" [ngTemplateOutlet]="selectComponent.itemTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </span>\n \x3c!-- Need ion-label for text ellipsis. --\x3e\n <ion-label *ngIf="!selectComponent.itemTemplate">\n {{selectComponent._formatItem(item)}}\n </ion-label>\n <div *ngIf="selectComponent.itemRightTemplate" slot="end">\n <div [ngTemplateOutlet]="selectComponent.itemRightTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </div>\n </div>\n <ion-button *ngIf="selectComponent.canSaveItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._saveItem($event, item)">\n <ion-icon slot="icon-only" name="md-create"></ion-icon>\n </ion-button>\n <ion-button *ngIf="selectComponent.canDeleteItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._deleteItemClick($event, item)">\n <ion-icon slot="icon-only" name="md-trash"></ion-icon>\n </ion-button>\n </ion-item>\n </ion-virtual-scroll>\n</ion-content>\n<div class="ionic-selectable-add-item-template" *ngIf="selectComponent._isAddItemTemplateVisible"\n [ngStyle]="{ \'top.px\': _header.offsetHeight }">\n <div class="ionic-selectable-add-item-template-inner" [ngStyle]="{ \'height\': selectComponent._addItemTemplateFooterHeight }">\n <span [ngTemplateOutlet]="selectComponent.addItemTemplate"\n [ngTemplateOutletContext]="{ item: selectComponent._itemToAdd, isAdd: selectComponent._itemToAdd === null }">\n </span>\n </div>\n</div>\n<ion-footer *ngIf="selectComponent._footerButtonsCount > 0" [ngStyle]="{ \'visibility\': selectComponent._isFooterVisible ? \'initial\' : \'hidden\' }">\n <ion-toolbar>\n <ion-row>\n <ion-col *ngIf="selectComponent.canClear" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)="_clear()" [disabled]="!selectComponent._selectedItems.length">\n {{selectComponent.clearButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf="selectComponent.canAddItem" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)="selectComponent._addItemClick()">\n {{selectComponent.addButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf="selectComponent.isMultiple" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)="_ok()" [disabled]="!selectComponent.isOkButtonEnabled">\n {{selectComponent.okButtonText}}\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-toolbar>\n</ion-footer>\n'}]}],IonicSelectablePageComponent.ctorParameters=(()=>[{type:NavParams},{type:ElementRef}]),IonicSelectablePageComponent.propDecorators={_content:[{type:ViewChild,args:[Content]}],_searchbarComponent:[{type:ViewChild,args:["searchbarComponent"]}],_infiniteScroll:[{type:ViewChild,args:[InfiniteScroll]}],_cssClass:[{type:HostBinding,args:["class.ionic-selectable-page"]}],_canClearCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-can-clear"]}],_isMultipleCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-is-multiple"]}],_isSearchingCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-is-searching"]}],_isIos:[{type:HostBinding,args:["class.ionic-selectable-page-ios"]}],_isMD:[{type:HostBinding,args:["class.ionic-selectable-page-md"]}],_isAddItemTemplateVisibleCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-is-add-item-template-visible"]}],onResize:[{type:HostListener,args:["window:resize",["$event"]]}]};const components=[IonicSelectableComponent,IonicSelectablePageComponent],directives=[IonicSelectableValueTemplateDirective,IonicSelectableItemTemplateDirective,IonicSelectableItemRightTemplateDirective,IonicSelectableTitleTemplateDirective,IonicSelectablePlaceholderTemplateDirective,IonicSelectableMessageTemplateDirective,IonicSelectableGroupTemplateDirective,IonicSelectableGroupRightTemplateDirective,IonicSelectableCloseButtonTemplateDirective,IonicSelectableSearchFailTemplateDirective,IonicSelectableAddItemTemplateDirective];class IonicSelectableModule{}IonicSelectableModule.decorators=[{type:NgModule,args:[{imports:[CommonModule,FormsModule,IonicModule],declarations:[...components,...directives],exports:[...components,...directives],entryComponents:components}]}],IonicSelectableModule.ctorParameters=(()=>[]);export{IonicSelectableAddItemTemplateDirective,IonicSelectableCloseButtonTemplateDirective,IonicSelectableGroupRightTemplateDirective,IonicSelectableGroupTemplateDirective,IonicSelectableItemRightTemplateDirective,IonicSelectableItemTemplateDirective,IonicSelectableMessageTemplateDirective,IonicSelectablePageComponent,IonicSelectablePlaceholderTemplateDirective,IonicSelectableSearchFailTemplateDirective,IonicSelectableTitleTemplateDirective,IonicSelectableValueTemplateDirective,IonicSelectableComponent,IonicSelectableModule}; |
@@ -1,1 +0,1 @@ | ||
| import{__spread}from"tslib";import{Component,ElementRef,EventEmitter,forwardRef,HostBinding,Input,IterableDiffers,Optional,Output,Renderer,ViewEncapsulation,ViewChild,NgModule}from"@angular/core";import{NG_VALUE_ACCESSOR,FormsModule}from"@angular/forms";import{Item,ModalController,Platform,Content,InfiniteScroll,NavParams,IonicModule}from"@ionic/angular";import{CommonModule}from"@angular/common";var IonicSelectableComponent=function(){function e(e,t,n,o,i,s){this._modalController=e,this._platform=t,this.ionItem=n,this._iterableDiffers=o,this._element=i,this._renderer=s,this._cssClass=!0,this._isOnSearchEnabled=!0,this._isEnabled=!0,this._isOpened=!1,this._value=null,this._canClear=!1,this._isMultiple=!1,this.onItemsChange=new EventEmitter,this._valueItems=[],this._searchText="",this._hasSearchText=!1,this._groups=[],this._itemsToConfirm=[],this._selectedItems=[],this._filteredGroups=[],this._footerButtonsCount=0,this.items=[],this.itemsChange=new EventEmitter,this.isOkButtonEnabled=!0,this.itemValueField=null,this.itemTextField=null,this.canSearch=!1,this.hasInfiniteScroll=!1,this.hasVirtualScroll=!1,this.virtualScrollApproxItemHeight="40px",this.searchPlaceholder="Search",this.placeholder=null,this.searchFailText="No items found.",this.clearButtonText="Clear",this.okButtonText="OK",this.closeButtonText="Cancel",this.shouldFocusSearchbar=!1,this.headerColor=null,this.onChange=new EventEmitter,this.onSearch=new EventEmitter,this.onInfiniteScroll=new EventEmitter,this.onOpen=new EventEmitter,this.onClose=new EventEmitter,this.searchDebounce=250,this.shouldStoreItemValue=!1,this.propagateOnChange=function(e){},this.propagateOnTouched=function(){},this.items&&this.items.length||(this.items=[]),this._itemsDiffer=this._iterableDiffers.find(this.items).create()}return Object.defineProperty(e.prototype,"_isMultipleCssClass",{get:function(){return this.isMultiple},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasValueCssClass",{get:function(){return this.hasValue()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasPlaceholderCssClass",{get:function(){return this._hasPlaceholder},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasInfiniteScroll",{get:function(){return!!(this.isEnabled&&this._selectPageComponent&&this._selectPageComponent._infiniteScroll)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_shouldStoreItemValue",{get:function(){return this.shouldStoreItemValue&&this._hasObjects},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"searchText",{get:function(){return this._searchText},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isSearching",{get:function(){return this._isSearching},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"hasSearchText",{get:function(){return this._hasSearchText},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"value",{get:function(){return this._value},set:function(e){this._value=e,this._valueItems.splice(0,this._valueItems.length),this.isMultiple?e&&e.length&&Array.prototype.push.apply(this._valueItems,e):this._isNullOrWhiteSpace(e)||this._valueItems.push(e),this._setIonItemHasValue(),this._setHasPlaceholder()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isEnabled",{get:function(){return this._isEnabled},set:function(e){this._isEnabled=!!e,this.enableIonItem(this._isEnabled)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isOpened",{get:function(){return this._isOpened},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isOnSearchEnabled",{get:function(){return this._isOnSearchEnabled},set:function(e){this._isOnSearchEnabled=!!e},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"canClear",{get:function(){return this._canClear},set:function(e){this._canClear=!!e,this._countFooterButtons()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isMultiple",{get:function(){return this._isMultiple},set:function(e){this._isMultiple=!!e,this._countFooterButtons()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"itemsToConfirm",{get:function(){return this._itemsToConfirm},enumerable:!0,configurable:!0}),e.prototype.initFocus=function(){},e.prototype.enableIonItem=function(e){this.ionItem&&(this.ionItem.disabled=!e)},e.prototype._isNullOrWhiteSpace=function(e){return null==e||e.toString().replace(/\s/g,"").length<1},e.prototype._setHasSearchText=function(){this._hasSearchText=!this._isNullOrWhiteSpace(this._searchText)},e.prototype._hasOnSearch=function(){return this.isOnSearchEnabled&&this.onSearch.observers.length>0},e.prototype._select=function(e){this.value=e,this._emitValueChange()},e.prototype._emitValueChange=function(){this.propagateOnChange(this.value),this.onChange.emit({component:this,value:this.value})},e.prototype._emitSearch=function(){this.canSearch&&this.onSearch.emit({component:this,text:this._searchText})},e.prototype._formatItem=function(e){return this._isNullOrWhiteSpace(e)?null:this.itemTextField?e[this.itemTextField]:e.toString()},e.prototype._getLabelText=function(){var e=this._ionItemElement?this._ionItemElement.querySelector("ion-label"):null;return e?e.textContent:null},e.prototype._getItemValue=function(e){return this._hasObjects?e[this.itemValueField]:e},e.prototype._getStoredItemValue=function(e){return this._hasObjects?this._shouldStoreItemValue?e:e[this.itemValueField]:e},e.prototype._onSearchbarClear=function(){this._searchText=""},e.prototype._filterItems=function(){var e=this;if(this._setHasSearchText(),this._hasOnSearch())this._emitSearch();else{var t=[];if(this._searchText&&this._searchText.trim()){var n=this._searchText.trim().toLowerCase();this._groups.forEach(function(o){var i=o.items.filter(function(t){return-1!==(e.itemTextField?t[e.itemTextField]:t).toString().toLowerCase().indexOf(n)});i.length&&t.push({value:o.value,text:o.text,items:i})}),t.length||t.push({items:[]})}else t=this._groups;this._filteredGroups=t}},e.prototype._isItemSelected=function(e){var t=this;return void 0!==this._selectedItems.find(function(n){return t._getItemValue(e)===t._getStoredItemValue(n)})},e.prototype._addSelectedItem=function(e){this._shouldStoreItemValue?this._selectedItems.push(this._getItemValue(e)):this._selectedItems.push(e)},e.prototype._deleteSelectedItem=function(e){var t,n=this;this._selectedItems.forEach(function(o,i){n._getItemValue(e)===n._getStoredItemValue(o)&&(t=i)}),this._selectedItems.splice(t,1)},e.prototype._click=function(){var e=this;this.isEnabled&&(this._labelText=this._getLabelText(),this.open().then(function(){e.onOpen.emit({component:e})}))},e.prototype._countFooterButtons=function(){var e=0;this.canClear&&e++,this.isMultiple&&e++,this._footerButtonsCount=e},e.prototype._setItems=function(e){var t=[{items:e||[]}];this._groups=t,this._filteredGroups=this._groups},e.prototype._formatValueItem=function(e){var t=this;if(this._shouldStoreItemValue){var n=this.items.find(function(n){return n[t.itemValueField]===e});return this._formatItem(n)}return this._formatItem(e)},e.prototype._setIonItemHasFocus=function(e){this.ionItem&&this._setIonItemCssClass("item-has-focus",e)},e.prototype._setIonItemHasValue=function(){this.ionItem&&this._setIonItemCssClass("item-has-value",this.hasValue())},e.prototype._setHasPlaceholder=function(){this._hasPlaceholder=!this.hasValue()&&!this._isNullOrWhiteSpace(this.placeholder)},e.prototype._setIonItemCssClass=function(e,t){this._ionItemElement&&this._renderer.setElementClass(this._ionItemElement,e,t)},e.prototype.writeValue=function(e){this.value=e},e.prototype.registerOnChange=function(e){this.propagateOnChange=e},e.prototype.registerOnTouched=function(e){this.propagateOnTouched=e},e.prototype.setDisabledState=function(e){this.isEnabled=!e},e.prototype.ngOnInit=function(){this._isIos=this._platform.is("ios"),this._isMD=!this._isIos,this._hasObjects=!this._isNullOrWhiteSpace(this.itemValueField),this.ionItem&&(this._ionItemElement=this._element.nativeElement.closest("ion-item"),this._setIonItemCssClass("item-interactive",!0),this._setIonItemCssClass("item-ionic-selectable",!0)),this.enableIonItem(this.isEnabled)},e.prototype.ngDoCheck=function(){this._itemsDiffer.diff(this.items)&&(this._setItems(this.items),this.value=this.value,this.onItemsChange.emit({component:this}))},e.prototype.hasValue=function(){return this.isMultiple?0!==this._valueItems.length:0!==this._valueItems.length&&!this._isNullOrWhiteSpace(this._valueItems[0])},e.prototype.open=function(){var e=this;return new Promise(function(t,n){e._isEnabled&&!e._isOpened?(e._filterItems(),e._isOpened=!0,e._modalController.create({component:IonicSelectablePageComponent,componentProps:{selectComponent:e}}).then(function(n){e._modal=n,n.present().then(function(){e._setIonItemHasFocus(!0),t()}),n.onWillDismiss().then(function(){e._setIonItemHasFocus(!1)}),n.onDidDismiss().then(function(t){e._isOpened=!1,e.isMultiple&&(e._itemsToConfirm=[]),"backdrop"===t.role&&e.onClose.emit({component:e})})})):n("IonicSelectable is disabled or already opened.")})},e.prototype.close=function(){var e=this;return new Promise(function(t,n){e._isEnabled&&e._isOpened?(e.propagateOnTouched(),e._isOpened=!1,e._modal.dismiss().then(function(){e._setIonItemHasFocus(!1),t()})):n("IonicSelectable is disabled or already closed.")})},e.prototype.clear=function(){this.value=this.isMultiple?[]:null,this.isMultiple&&(this._itemsToConfirm=[]),this.propagateOnChange(this.value)},e.prototype.scrollToTop=function(){var e=this;return new Promise(function(t,n){e._isOpened?e._selectPageComponent._content.scrollToTop().then(function(){t()}):n("IonicSelectable content cannot be scrolled.")})},e.prototype.scrollToBottom=function(){var e=this;return new Promise(function(t,n){e._isOpened?e._selectPageComponent._content.scrollToBottom().then(function(){t()}):n("IonicSelectable content cannot be scrolled.")})},e.prototype.startSearch=function(){this._isEnabled&&this.showLoading()},e.prototype.endSearch=function(){this._isEnabled&&(this.hideLoading(),this._setItems(this.items))},e.prototype.enableInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!1)},e.prototype.disableInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!0)},e.prototype.endInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.complete(),this._setItems(this.items))},e.prototype.search=function(e){this._isEnabled&&this._isOpened&&this.canSearch&&(this._searchText=e,this._setHasSearchText(),this._filterItems())},e.prototype.showLoading=function(){this._isEnabled&&(this._isSearching=!0)},e.prototype.hideLoading=function(){this._isEnabled&&(this._isSearching=!1)},e}();IonicSelectableComponent.decorators=[{type:Component,args:[{selector:"ionic-selectable",template:'<div class="ionic-selectable-value">\n <span *ngIf="_valueItems.length">\n <div class="ionic-selectable-value-item" *ngFor="let valueItem of _valueItems">\n {{_formatValueItem(valueItem)}}\n </div>\n </span>\n <div class="ionic-selectable-value-item" *ngIf="_hasPlaceholder">\n {{placeholder}}\n </div>\n \x3c!-- Fix icon allignment when there\'s no value or placeholder. --\x3e\n <span *ngIf="!_valueItems.length && !_hasPlaceholder"> </span>\n</div>\n<div class="ionic-selectable-icon">\n <div class="ionic-selectable-icon-inner"></div>\n</div>\n<button class="ionic-selectable-cover" [disabled]="!isEnabled" (click)="_click()">\n</button>\n',styles:[".item-label-floating .ionic-selectable,.item-label-stacked .ionic-selectable{-ms-flex-item-align:stretch;align-self:stretch;max-width:100%;padding-left:0;padding-top:8px;padding-bottom:8px}.item-label-floating .ionic-selectable-value,.item-label-stacked .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:19px}.item-label-floating .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-icon-inner{top:7px}.item-label-floating .ionic-selectable-ios .ionic-selectable-value,.item-label-stacked .ionic-selectable-ios .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:20px}.item-label-floating .ionic-selectable-ios .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-ios .ionic-selectable-icon-inner{top:8px}.item:not(.item-label-stacked):not(.item-label-floating) .ionic-selectable-value{padding-left:var(--padding-start,16px)}.item-ionic-selectable .item-inner .input-wrapper{-webkit-box-align:normal;-ms-flex-align:normal;align-items:normal}.item-ionic-selectable ion-label{-webkit-box-flex:1;-ms-flex:1;flex:1;max-width:initial}.ionic-selectable{display:-webkit-box;display:-ms-flexbox;display:flex;max-width:45%}.ionic-selectable-has-placeholder .ionic-selectable-value-item{color:var(--placeholder-color,#999)}.ionic-selectable-value{-webkit-box-flex:1;-ms-flex:1;flex:1;padding-top:13px;padding-bottom:13px;overflow:hidden}.ionic-selectable-value-item{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ionic-selectable-value-item:not(:last-child){margin-bottom:5px}.ionic-selectable-icon{position:relative;width:20px}.ionic-selectable-icon-inner{position:absolute;top:20px;left:5px;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;pointer-events:none;color:var(--icon-color,#999)}.ionic-selectable-ios .ionic-selectable-value{padding-top:11px;padding-bottom:11px}.ionic-selectable-ios .ionic-selectable-icon-inner{top:19px}.ionic-selectable-spinner{position:fixed;bottom:0;top:0;left:0;right:0;z-index:1}.ionic-selectable-spinner-background{top:0;bottom:0;left:0;right:0;position:absolute;background-color:#000;opacity:.05}.ionic-selectable-spinner ion-spinner{position:absolute;top:50%;left:50%;z-index:10;margin-top:-14px;margin-left:-14px}.ionic-selectable-cover{left:0;top:0;margin:0;position:absolute;width:100%;height:100%;border:0;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:first-child{padding-right:8px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:last-child{padding-left:8px}.ionic-selectable-page.ionic-selectable-page-is-searching .scroll-content{overflow-y:hidden}"],encapsulation:ViewEncapsulation.None,providers:[{provide:NG_VALUE_ACCESSOR,useExisting:forwardRef(function(){return IonicSelectableComponent}),multi:!0}]}]}],IonicSelectableComponent.ctorParameters=function(){return[{type:ModalController},{type:Platform},{type:Item,decorators:[{type:Optional}]},{type:IterableDiffers},{type:ElementRef},{type:Renderer}]},IonicSelectableComponent.propDecorators={_cssClass:[{type:HostBinding,args:["class.ionic-selectable"]}],_isIos:[{type:HostBinding,args:["class.ionic-selectable-ios"]}],_isMD:[{type:HostBinding,args:["class.ionic-selectable-md"]}],_isMultipleCssClass:[{type:HostBinding,args:["class.ionic-selectable-is-multiple"]}],_hasValueCssClass:[{type:HostBinding,args:["class.ionic-selectable-has-value"]}],_hasPlaceholderCssClass:[{type:HostBinding,args:["class.ionic-selectable-has-placeholder"]}],items:[{type:Input}],itemsChange:[{type:Output}],isEnabled:[{type:HostBinding,args:["class.ionic-selectable-is-enabled"]},{type:Input,args:["isEnabled"]}],isOkButtonEnabled:[{type:Input}],itemValueField:[{type:Input}],itemTextField:[{type:Input}],canSearch:[{type:Input}],isOnSearchEnabled:[{type:Input,args:["isOnSearchEnabled"]}],canClear:[{type:HostBinding,args:["class.ionic-selectable-can-clear"]},{type:Input,args:["canClear"]}],hasInfiniteScroll:[{type:Input}],hasVirtualScroll:[{type:Input}],virtualScrollApproxItemHeight:[{type:Input}],searchPlaceholder:[{type:Input}],placeholder:[{type:Input}],isMultiple:[{type:Input,args:["isMultiple"]}],searchFailText:[{type:Input}],clearButtonText:[{type:Input}],okButtonText:[{type:Input}],closeButtonText:[{type:Input}],shouldFocusSearchbar:[{type:Input}],headerColor:[{type:Input}],onChange:[{type:Output}],onSearch:[{type:Output}],onInfiniteScroll:[{type:Output}],onOpen:[{type:Output}],onClose:[{type:Output}],searchDebounce:[{type:Input}],shouldStoreItemValue:[{type:Input}]};var IonicSelectablePageComponent=function(){function e(e){var t=this;this.navParams=e,this._cssClass=!0,this.selectComponent=this.navParams.get("selectComponent"),this.selectComponent._selectPageComponent=this,this.selectComponent._selectedItems=[],this.selectComponent._isNullOrWhiteSpace(this.selectComponent.value)||(this.selectComponent.isMultiple?this.selectComponent.value.forEach(function(e){t.selectComponent._selectedItems.push(e)}):this.selectComponent._selectedItems.push(this.selectComponent.value)),this._setItemsToConfirm(this.selectComponent._selectedItems)}return Object.defineProperty(e.prototype,"_canClearCssClass",{get:function(){return this.selectComponent.canClear},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isMultipleCssClass",{get:function(){return this.selectComponent.isMultiple},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isSearchingCssClass",{get:function(){return this.selectComponent._isSearching},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isIos",{get:function(){return this.selectComponent._isIos},enumerable:!0,configurable:!0}),e.prototype._isMD=function(){return this.selectComponent._isMD},e.prototype.ngAfterViewInit=function(){var e=this;this._searchbarComponent&&this.selectComponent.shouldFocusSearchbar&&setTimeout(function(){e._searchbarComponent.focus()},1e3)},e.prototype._setItemsToConfirm=function(e){this.selectComponent._itemsToConfirm=[].concat(e)},e.prototype._getMoreItems=function(){this.selectComponent.onInfiniteScroll.emit({component:this.selectComponent,text:this.selectComponent._searchText})},e.prototype._select=function(e){this.selectComponent.isMultiple?(this.selectComponent._isItemSelected(e)?this.selectComponent._deleteSelectedItem(e):this.selectComponent._addSelectedItem(e),this._setItemsToConfirm(this.selectComponent._selectedItems)):(this.selectComponent._isItemSelected(e)||(this.selectComponent._selectedItems=[],this.selectComponent._addSelectedItem(e),this.selectComponent._shouldStoreItemValue?this.selectComponent._select(this.selectComponent._getItemValue(e)):this.selectComponent._select(e)),this._close())},e.prototype._ok=function(){this.selectComponent._select(this.selectComponent._selectedItems),this._close()},e.prototype._close=function(){var e=this;this.selectComponent.close().then(function(){e.selectComponent.onClose.emit({component:e.selectComponent})}),this.selectComponent._hasOnSearch()||(this.selectComponent._searchText="",this.selectComponent._setHasSearchText())},e.prototype._clear=function(){var e=this;this.selectComponent.clear(),this.selectComponent._emitValueChange(),this.selectComponent.close().then(function(){e.selectComponent.onClose.emit({component:e.selectComponent})})},e}();IonicSelectablePageComponent.decorators=[{type:Component,args:[{selector:"ionic-selectable-page",template:'<ion-header>\n <ion-toolbar [color]="selectComponent.headerColor ? selectComponent.headerColor : null">\n <ion-buttons slot="start">\n <ion-button (click)="_close()">\n {{selectComponent.closeButtonText}}\n </ion-button>\n </ion-buttons>\n <ion-title>\n <span>\n {{selectComponent._labelText}}\n </span>\n </ion-title>\n </ion-toolbar>\n <ion-toolbar *ngIf="selectComponent.canSearch">\n <ion-searchbar *ngIf="selectComponent.canSearch" #searchbarComponent\n [(ngModel)]="selectComponent._searchText" (ionChange)="selectComponent._filterItems()"\n (ionClear)="selectComponent._onSearchbarClear()" [placeholder]="selectComponent.searchPlaceholder"\n [debounce]="selectComponent.searchDebounce">\n </ion-searchbar>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <div class="ionic-selectable-spinner" *ngIf="selectComponent._isSearching">\n <div class="ionic-selectable-spinner-background"></div>\n <ion-spinner></ion-spinner>\n </div>\n <ion-list no-margin *ngIf="!selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length">\n <ion-item-group *ngFor="let group of selectComponent._filteredGroups" class="ionic-selectable-group">\n <ion-item button detail="false" *ngFor="let item of group.items" (click)="_select(item)"\n class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item)\n }">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null"\n slot="start">\n </ion-icon>\n <span>\n {{selectComponent._formatItem(item)}}\n </span>\n </ion-item>\n </ion-item-group>\n </ion-list>\n \x3c!-- Fail text should be above InfiniteScroll to avoid a gap when no items are found. --\x3e\n <div *ngIf="!selectComponent._filteredGroups.length || !selectComponent._filteredGroups[0].items.length">\n <div margin>\n {{selectComponent.searchFailText}}\n </div>\n </div>\n <ion-infinite-scroll *ngIf="!selectComponent.hasVirtualScroll" [disabled]="!selectComponent.hasInfiniteScroll"\n (ionInfinite)="_getMoreItems($event)">\n <ion-infinite-scroll-content></ion-infinite-scroll-content>\n </ion-infinite-scroll>\n <ion-virtual-scroll no-margin *ngIf="selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length"\n [items]="selectComponent._filteredGroups[0].items" [approxItemHeight]="selectComponent.virtualScrollApproxItemHeight">\n <ion-item button detail="false" *virtualItem="let item" (click)="_select(item)"\n class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item)\n }">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null" slot="start">\n </ion-icon>\n <span>\n {{selectComponent._formatItem(item)}}\n </span>\n </ion-item>\n </ion-virtual-scroll>\n</ion-content>\n<ion-footer *ngIf="selectComponent._footerButtonsCount > 0">\n <ion-toolbar>\n <ion-row>\n <ion-col *ngIf="selectComponent.canClear" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)=" _clear()" [disabled]="!selectComponent._selectedItems.length">\n {{selectComponent.clearButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf="selectComponent.isMultiple" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)=" _ok()" [disabled]="!selectComponent.isOkButtonEnabled">\n {{selectComponent.okButtonText}}\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-toolbar>\n</ion-footer>\n'}]}],IonicSelectablePageComponent.ctorParameters=function(){return[{type:NavParams}]},IonicSelectablePageComponent.propDecorators={_content:[{type:ViewChild,args:[Content]}],_searchbarComponent:[{type:ViewChild,args:["searchbarComponent"]}],_infiniteScroll:[{type:ViewChild,args:[InfiniteScroll]}],_cssClass:[{type:HostBinding,args:["class.ionic-selectable-page"]}],_canClearCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-can-clear"]}],_isMultipleCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-is-multiple"]}],_isSearchingCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-is-searching"]}],_isIos:[{type:HostBinding,args:["class.ionic-selectable-page-ios"]}],_isMD:[{type:HostBinding,args:["class.ionic-selectable-page-md"]}]};var components=[IonicSelectableComponent,IonicSelectablePageComponent],IonicSelectableModule=function(){return function(){}}();IonicSelectableModule.decorators=[{type:NgModule,args:[{imports:[CommonModule,FormsModule,IonicModule],declarations:__spread(components),exports:__spread(components),entryComponents:components}]}],IonicSelectableModule.ctorParameters=function(){return[]};export{IonicSelectablePageComponent,IonicSelectableComponent,IonicSelectableModule}; | ||
| import{__spread}from"tslib";import{Directive,Component,ContentChild,ElementRef,EventEmitter,forwardRef,HostBinding,Input,IterableDiffers,Optional,Output,Renderer,TemplateRef,ViewEncapsulation,HostListener,ViewChild,NgModule}from"@angular/core";import{NG_VALUE_ACCESSOR,FormsModule}from"@angular/forms";import{Item,ModalController,Platform,Content,InfiniteScroll,NavParams,IonicModule}from"@ionic/angular";import"rxjs";import{CommonModule}from"@angular/common";var IonicSelectableAddItemTemplateDirective=function(){return function(){}}();IonicSelectableAddItemTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableAddItemTemplate]"}]}],IonicSelectableAddItemTemplateDirective.ctorParameters=function(){return[]};var IonicSelectableCloseButtonTemplateDirective=function(){return function(){}}();IonicSelectableCloseButtonTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableCloseButtonTemplate]"}]}],IonicSelectableCloseButtonTemplateDirective.ctorParameters=function(){return[]};var IonicSelectableGroupRightTemplateDirective=function(){return function(){}}();IonicSelectableGroupRightTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableGroupRightTemplate]"}]}],IonicSelectableGroupRightTemplateDirective.ctorParameters=function(){return[]};var IonicSelectableGroupTemplateDirective=function(){return function(){}}();IonicSelectableGroupTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableGroupTemplate]"}]}],IonicSelectableGroupTemplateDirective.ctorParameters=function(){return[]};var IonicSelectableItemRightTemplateDirective=function(){return function(){}}();IonicSelectableItemRightTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableItemRightTemplate]"}]}],IonicSelectableItemRightTemplateDirective.ctorParameters=function(){return[]};var IonicSelectableItemTemplateDirective=function(){return function(){}}();IonicSelectableItemTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableItemTemplate]"}]}],IonicSelectableItemTemplateDirective.ctorParameters=function(){return[]};var IonicSelectableMessageTemplateDirective=function(){return function(){}}();IonicSelectableMessageTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableMessageTemplate]"}]}],IonicSelectableMessageTemplateDirective.ctorParameters=function(){return[]};var IonicSelectablePlaceholderTemplateDirective=function(){return function(){}}();IonicSelectablePlaceholderTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectablePlaceholderTemplate]"}]}],IonicSelectablePlaceholderTemplateDirective.ctorParameters=function(){return[]};var IonicSelectableSearchFailTemplateDirective=function(){return function(){}}();IonicSelectableSearchFailTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableSearchFailTemplate]"}]}],IonicSelectableSearchFailTemplateDirective.ctorParameters=function(){return[]};var IonicSelectableTitleTemplateDirective=function(){return function(){}}();IonicSelectableTitleTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableTitleTemplate]"}]}],IonicSelectableTitleTemplateDirective.ctorParameters=function(){return[]};var IonicSelectableValueTemplateDirective=function(){return function(){}}();IonicSelectableValueTemplateDirective.decorators=[{type:Directive,args:[{selector:"[ionicSelectableValueTemplate]"}]}],IonicSelectableValueTemplateDirective.ctorParameters=function(){return[]};var IonicSelectableComponent=function(){function e(e,t,n,i,o,l){this._modalController=e,this._platform=t,this.ionItem=n,this._iterableDiffers=i,this._element=o,this._renderer=l,this._cssClass=!0,this._isOnSearchEnabled=!0,this._isEnabled=!0,this._isOpened=!1,this._value=null,this._canClear=!1,this._isMultiple=!1,this._canAddItem=!1,this.onItemsChange=new EventEmitter,this._valueItems=[],this._searchText="",this._hasSearchText=!1,this._groups=[],this._itemsToConfirm=[],this._selectedItems=[],this._filteredGroups=[],this._isAddItemTemplateVisible=!1,this._isFooterVisible=!0,this._itemToAdd=null,this._footerButtonsCount=0,this.items=[],this.itemsChange=new EventEmitter,this.isOkButtonEnabled=!0,this.itemValueField=null,this.itemTextField=null,this.groupValueField=null,this.groupTextField=null,this.canSearch=!1,this.hasInfiniteScroll=!1,this.hasVirtualScroll=!1,this.virtualScrollApproxItemHeight="40px",this.searchPlaceholder="Search",this.placeholder=null,this.searchFailText="No items found.",this.clearButtonText="Clear",this.addButtonText="Add",this.okButtonText="OK",this.closeButtonText="Cancel",this.shouldFocusSearchbar=!1,this.headerColor=null,this.groupColor=null,this.onChange=new EventEmitter,this.onSearch=new EventEmitter,this.onSearchFail=new EventEmitter,this.onSearchSuccess=new EventEmitter,this.onInfiniteScroll=new EventEmitter,this.onOpen=new EventEmitter,this.onClose=new EventEmitter,this.searchDebounce=250,this.disabledItems=[],this.shouldStoreItemValue=!1,this.canSaveItem=!1,this.canDeleteItem=!1,this.onSaveItem=new EventEmitter,this.onDeleteItem=new EventEmitter,this.onAddItem=new EventEmitter,this.virtualScrollHeaderFn=function(){return null},this.propagateOnChange=function(e){},this.propagateOnTouched=function(){},this.items&&this.items.length||(this.items=[]),this._itemsDiffer=this._iterableDiffers.find(this.items).create()}return Object.defineProperty(e.prototype,"_isMultipleCssClass",{get:function(){return this.isMultiple},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasValueCssClass",{get:function(){return this.hasValue()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasPlaceholderCssClass",{get:function(){return this._hasPlaceholder},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_hasInfiniteScroll",{get:function(){return!!(this.isEnabled&&this._selectPageComponent&&this._selectPageComponent._infiniteScroll)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_shouldStoreItemValue",{get:function(){return this.shouldStoreItemValue&&this._hasObjects},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"searchText",{get:function(){return this._searchText},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isSearching",{get:function(){return this._isSearching},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"hasSearchText",{get:function(){return this._hasSearchText},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"value",{get:function(){return this._value},set:function(e){this._value=e,this._valueItems.splice(0,this._valueItems.length),this.isMultiple?e&&e.length&&Array.prototype.push.apply(this._valueItems,e):this._isNullOrWhiteSpace(e)||this._valueItems.push(e),this._setIonItemHasValue(),this._setHasPlaceholder()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isEnabled",{get:function(){return this._isEnabled},set:function(e){this._isEnabled=!!e,this.enableIonItem(this._isEnabled)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isOpened",{get:function(){return this._isOpened},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isOnSearchEnabled",{get:function(){return this._isOnSearchEnabled},set:function(e){this._isOnSearchEnabled=!!e},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"canClear",{get:function(){return this._canClear},set:function(e){this._canClear=!!e,this._countFooterButtons()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"isMultiple",{get:function(){return this._isMultiple},set:function(e){this._isMultiple=!!e,this._countFooterButtons()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"itemsToConfirm",{get:function(){return this._itemsToConfirm},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"canAddItem",{get:function(){return this._canAddItem},set:function(e){this._canAddItem=!!e,this._countFooterButtons()},enumerable:!0,configurable:!0}),e.prototype.initFocus=function(){},e.prototype.enableIonItem=function(e){this.ionItem&&(this.ionItem.disabled=!e)},e.prototype._isNullOrWhiteSpace=function(e){return null==e||e.toString().replace(/\s/g,"").length<1},e.prototype._setHasSearchText=function(){this._hasSearchText=!this._isNullOrWhiteSpace(this._searchText)},e.prototype._hasOnSearch=function(){return this.isOnSearchEnabled&&this.onSearch.observers.length>0},e.prototype._hasOnSaveItem=function(){return this.canSaveItem&&this.onSaveItem.observers.length>0},e.prototype._hasOnAddItem=function(){return this.canAddItem&&this.onAddItem.observers.length>0},e.prototype._hasOnDeleteItem=function(){return this.canDeleteItem&&this.onDeleteItem.observers.length>0},e.prototype._select=function(e){this.value=e,this._emitValueChange()},e.prototype._emitValueChange=function(){this.propagateOnChange(this.value),this.onChange.emit({component:this,value:this.value})},e.prototype._emitSearch=function(){this.canSearch&&this.onSearch.emit({component:this,text:this._searchText})},e.prototype._formatItem=function(e){return this._isNullOrWhiteSpace(e)?null:this.itemTextField?e[this.itemTextField]:e.toString()},e.prototype._getLabelText=function(){var e=this._ionItemElement?this._ionItemElement.querySelector("ion-label"):null;return e?e.textContent:null},e.prototype._getItemValue=function(e){return this._hasObjects?e[this.itemValueField]:e},e.prototype._getStoredItemValue=function(e){return this._hasObjects?this._shouldStoreItemValue?e:e[this.itemValueField]:e},e.prototype._onSearchbarClear=function(){this._searchText=""},e.prototype._filterItems=function(){var e=this;if(this._setHasSearchText(),this._hasOnSearch())this._emitSearch();else{var t=[];if(this._searchText&&this._searchText.trim()){var n=this._searchText.trim().toLowerCase();this._groups.forEach(function(i){var o=i.items.filter(function(t){return-1!==(e.itemTextField?t[e.itemTextField]:t).toString().toLowerCase().indexOf(n)});o.length&&t.push({value:i.value,text:i.text,items:o})}),t.length||t.push({items:[]})}else t=this._groups;this._filteredGroups=t,this._areGroupsEmpty(t)?this.onSearchFail.emit({component:this,text:this._searchText}):this.onSearchSuccess.emit({component:this,text:this._searchText})}},e.prototype._isItemDisabled=function(e){var t=this;if(this.disabledItems)return this.disabledItems.some(function(n){return t._getItemValue(n)===t._getItemValue(e)})},e.prototype._isItemSelected=function(e){var t=this;return void 0!==this._selectedItems.find(function(n){return t._getItemValue(e)===t._getStoredItemValue(n)})},e.prototype._addSelectedItem=function(e){this._shouldStoreItemValue?this._selectedItems.push(this._getItemValue(e)):this._selectedItems.push(e)},e.prototype._deleteSelectedItem=function(e){var t,n=this;this._selectedItems.forEach(function(i,o){n._getItemValue(e)===n._getStoredItemValue(i)&&(t=o)}),this._selectedItems.splice(t,1)},e.prototype._click=function(){var e=this;this.isEnabled&&(this._labelText=this._getLabelText(),this.open().then(function(){e.onOpen.emit({component:e})}))},e.prototype._saveItem=function(e,t){e.stopPropagation(),this._itemToAdd=t,this._hasOnSaveItem()?this.onSaveItem.emit({component:this,item:this._itemToAdd}):this.showAddItemTemplate()},e.prototype._deleteItemClick=function(e,t){e.stopPropagation(),this._itemToAdd=t,this._hasOnDeleteItem()?this.onDeleteItem.emit({component:this,item:this._itemToAdd}):this.deleteItem(this._itemToAdd)},e.prototype._addItemClick=function(){this._itemToAdd=null,this._hasOnAddItem()?this.onAddItem.emit({component:this}):this.showAddItemTemplate()},e.prototype._positionAddItemTemplate=function(){var e=this;setTimeout(function(){var t=e._selectPageComponent._element.nativeElement.querySelector(".ionic-selectable-add-item-template ion-footer");e._addItemTemplateFooterHeight=t?"calc(100% - "+t.offsetHeight+"px)":"100%"},100)},e.prototype._areGroupsEmpty=function(e){return 0===e.length||e.every(function(e){return!e.items||0===e.items.length})},e.prototype._countFooterButtons=function(){var e=0;this.canClear&&e++,this.isMultiple&&e++,this.canAddItem&&e++,this._footerButtonsCount=e},e.prototype._setItems=function(e){var t=this,n=[{items:e||[]}];e&&e.length&&this._hasGroups&&(n=[],e.forEach(function(e){var i=t._getPropertyValue(e,t.groupValueField),o=n.find(function(e){return e.value===i});o?o.items.push(e):n.push({value:i,text:t._getPropertyValue(e,t.groupTextField),items:[e]})})),this._groups=n,this._filteredGroups=this._groups},e.prototype._formatValueItem=function(e){var t=this;if(this._shouldStoreItemValue){var n=this.items.find(function(n){return n[t.itemValueField]===e});return this._formatItem(n)}return this._formatItem(e)},e.prototype._getPropertyValue=function(e,t){return t?t.split(".").reduce(function(e,t){return e?e[t]:null},e):null},e.prototype._setIonItemHasFocus=function(e){this.ionItem&&this._setIonItemCssClass("item-has-focus",e)},e.prototype._setIonItemHasValue=function(){this.ionItem&&this._setIonItemCssClass("item-has-value",this.hasValue())},e.prototype._setHasPlaceholder=function(){this._hasPlaceholder=!(this.hasValue()||this._isNullOrWhiteSpace(this.placeholder)&&!this.placeholderTemplate)},e.prototype._setIonItemCssClass=function(e,t){this._ionItemElement&&this._renderer.setElementClass(this._ionItemElement,e,t)},e.prototype._toggleAddItemTemplate=function(e){this.addItemTemplate&&(this._isAddItemTemplateVisible=e,this._isFooterVisible=!e)},e.prototype.writeValue=function(e){this.value=e},e.prototype.registerOnChange=function(e){this.propagateOnChange=e},e.prototype.registerOnTouched=function(e){this.propagateOnTouched=e},e.prototype.setDisabledState=function(e){this.isEnabled=!e},e.prototype.ngOnInit=function(){this._isIos=this._platform.is("ios"),this._isMD=!this._isIos,this._hasObjects=!this._isNullOrWhiteSpace(this.itemValueField),this._hasGroups=Boolean(this._hasObjects&&this.groupValueField&&!this.hasVirtualScroll),this.ionItem&&(this._ionItemElement=this._element.nativeElement.closest("ion-item"),this._setIonItemCssClass("item-interactive",!0),this._setIonItemCssClass("item-ionic-selectable",!0)),this.enableIonItem(this.isEnabled)},e.prototype.ngDoCheck=function(){this._itemsDiffer.diff(this.items)&&(this._setItems(this.items),this.value=this.value,this.onItemsChange.emit({component:this}))},e.prototype.addItem=function(e){var t=this;return this.items.unshift(e),this._addItemObservable&&this._addItemObservable.unsubscribe(),new Promise(function(e,n){t._addItemObservable=t.onItemsChange.asObservable().subscribe(function(){t._addItemObservable.unsubscribe(),e()},function(){t._addItemObservable.unsubscribe(),n()})})},e.prototype.deleteItem=function(e){var t=this,n=this,i=!1;if(this._selectedItems&&(this._selectedItems=this._selectedItems.filter(function(n){return t._getItemValue(e)!==t._getStoredItemValue(n)})),this.value)if(this.isMultiple){var o=this.value.filter(function(t){return t.id!==e.id});o.length!==this.value.length&&(this.value=o,i=!0)}else e===this.value&&(this.value=null,i=!0);i&&this._emitValueChange();var l=this.items.filter(function(t){return t.id!==e.id});return this.itemsChange.emit(l),this._setItems(l),this.onItemsChange.emit({component:this}),this._deleteItemObservable&&this._deleteItemObservable.unsubscribe(),new Promise(function(e,t){n._deleteItemObservable=n.onItemsChange.asObservable().subscribe(function(){n._deleteItemObservable.unsubscribe(),e()},function(){n._deleteItemObservable.unsubscribe(),t()})})},e.prototype.hasValue=function(){return this.isMultiple?0!==this._valueItems.length:0!==this._valueItems.length&&!this._isNullOrWhiteSpace(this._valueItems[0])},e.prototype.open=function(){var e=this;return new Promise(function(t,n){e._isEnabled&&!e._isOpened?(e._filterItems(),e._isOpened=!0,e._modalController.create({component:IonicSelectablePageComponent,componentProps:{selectComponent:e}}).then(function(n){e._modal=n,n.present().then(function(){e._setIonItemHasFocus(!0),t()}),n.onWillDismiss().then(function(){e._setIonItemHasFocus(!1)}),n.onDidDismiss().then(function(t){e._isOpened=!1,e.isMultiple&&(e._itemsToConfirm=[]),"backdrop"===t.role&&e.onClose.emit({component:e})})})):n("IonicSelectable is disabled or already opened.")})},e.prototype.close=function(){var e=this;return new Promise(function(t,n){e._isEnabled&&e._isOpened?(e.propagateOnTouched(),e._isOpened=!1,e._itemToAdd=null,e._modal.dismiss().then(function(){e._setIonItemHasFocus(!1),e.hideAddItemTemplate(),t()})):n("IonicSelectable is disabled or already closed.")})},e.prototype.clear=function(){this.value=this.isMultiple?[]:null,this.isMultiple&&(this._itemsToConfirm=[]),this.propagateOnChange(this.value)},e.prototype.scrollToTop=function(){var e=this;return new Promise(function(t,n){e._isOpened?e._selectPageComponent._content.scrollToTop().then(function(){t()}):n("IonicSelectable content cannot be scrolled.")})},e.prototype.scrollToBottom=function(){var e=this;return new Promise(function(t,n){e._isOpened?e._selectPageComponent._content.scrollToBottom().then(function(){t()}):n("IonicSelectable content cannot be scrolled.")})},e.prototype.startSearch=function(){this._isEnabled&&this.showLoading()},e.prototype.endSearch=function(){this._isEnabled&&(this.hideLoading(),this._setItems(this.items),this._areGroupsEmpty(this._filteredGroups)?this.onSearchFail.emit({component:this,text:this._searchText}):this.onSearchSuccess.emit({component:this,text:this._searchText}))},e.prototype.enableInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!1)},e.prototype.disableInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.disabled=!0)},e.prototype.endInfiniteScroll=function(){this._hasInfiniteScroll&&(this._selectPageComponent._infiniteScroll.complete(),this._setItems(this.items))},e.prototype.search=function(e){this._isEnabled&&this._isOpened&&this.canSearch&&(this._searchText=e,this._setHasSearchText(),this._filterItems())},e.prototype.showLoading=function(){this._isEnabled&&(this._isSearching=!0)},e.prototype.hideLoading=function(){this._isEnabled&&(this._isSearching=!1)},e.prototype.showAddItemTemplate=function(){this._toggleAddItemTemplate(!0),this._positionAddItemTemplate()},e.prototype.hideAddItemTemplate=function(){this._toggleAddItemTemplate(!1)},e}();IonicSelectableComponent.decorators=[{type:Component,args:[{selector:"ionic-selectable",template:'<div class="ionic-selectable-inner">\n <div class="ionic-selectable-value">\n <div *ngIf="valueTemplate && _valueItems.length && isMultiple"\n [ngTemplateOutlet]="valueTemplate" [ngTemplateOutletContext]="{ value: _valueItems }">\n </div>\n <div class="ionic-selectable-value-item" *ngIf="valueTemplate && _valueItems.length && !isMultiple">\n <div [ngTemplateOutlet]="valueTemplate" [ngTemplateOutletContext]="{ value: _valueItems[0] }">\n </div>\n </div>\n <span *ngIf="!valueTemplate && _valueItems.length">\n <div class="ionic-selectable-value-item" *ngFor="let valueItem of _valueItems">\n {{_formatValueItem(valueItem)}}\n </div>\n </span>\n <div *ngIf="_hasPlaceholder && placeholderTemplate" class="ionic-selectable-value-item">\n <div [ngTemplateOutlet]="placeholderTemplate">\n </div>\n </div>\n <div class="ionic-selectable-value-item" *ngIf="_hasPlaceholder && !placeholderTemplate">\n {{placeholder}}\n </div>\n \x3c!-- Fix icon allignment when there\'s no value or placeholder. --\x3e\n <span *ngIf="!_valueItems.length && !_hasPlaceholder"> </span>\n </div>\n <div class="ionic-selectable-icon">\n <div class="ionic-selectable-icon-inner"></div>\n </div>\n <button class="ionic-selectable-cover" [disabled]="!isEnabled" (click)="_click()">\n </button>\n</div>\n',styles:[".item:not(.item-label) .ionic-selectable{max-width:100%;width:100%}.item:not(.item-label) .ionic-selectable-value-item{text-align:right}.item-label-floating .ionic-selectable,.item-label-stacked .ionic-selectable{-ms-flex-item-align:stretch;align-self:stretch;max-width:100%;padding-left:0;padding-top:8px;padding-bottom:8px}.item-label-floating .ionic-selectable-value,.item-label-stacked .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:19px}.item-label-floating .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-icon-inner{top:7px}.item-label-floating .ionic-selectable-ios .ionic-selectable-value,.item-label-stacked .ionic-selectable-ios .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:20px}.item-label-floating .ionic-selectable-ios .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-ios .ionic-selectable-icon-inner{top:8px}.item:not(.item-label-stacked):not(.item-label-floating) .ionic-selectable-value{padding-left:var(--padding-start,16px)}.item-ionic-selectable .item-inner .input-wrapper{-webkit-box-align:normal;-ms-flex-align:normal;align-items:normal}.item-ionic-selectable ion-label{-webkit-box-flex:1;-ms-flex:1;flex:1;max-width:initial}.ionic-selectable{display:block;max-width:45%}.ionic-selectable-inner{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.ionic-selectable-has-placeholder .ionic-selectable-value-item{color:var(--placeholder-color,#999)}.ionic-selectable-value{-webkit-box-flex:1;-ms-flex:1;flex:1;padding-top:13px;padding-bottom:13px;overflow:hidden}.ionic-selectable-value-item{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ionic-selectable-value-item:not(:last-child){margin-bottom:5px}.ionic-selectable-icon{position:relative;width:20px}.ionic-selectable-icon-inner{position:absolute;top:20px;left:5px;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;pointer-events:none;color:var(--icon-color,#999)}.ionic-selectable-ios .ionic-selectable-value{padding-top:11px;padding-bottom:11px}.ionic-selectable-ios .ionic-selectable-icon-inner{top:19px}.ionic-selectable-spinner{position:fixed;bottom:0;top:0;left:0;right:0;z-index:1}.ionic-selectable-spinner-background{top:0;bottom:0;left:0;right:0;position:absolute;background-color:#000;opacity:.05}.ionic-selectable-spinner ion-spinner{position:absolute;top:50%;left:50%;z-index:10;margin-top:-14px;margin-left:-14px}.ionic-selectable-cover{left:0;top:0;margin:0;position:absolute;width:100%;height:100%;border:0;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0}.ionic-selectable-add-item-template{position:fixed;bottom:0;left:0;right:0;background-color:#fff}.ionic-selectable-add-item-template-inner{overflow-y:auto}.ionic-selectable-add-item-template-inner>ion-footer{bottom:0;position:absolute}.ionic-selectable-page-ios .ionic-selectable-message{padding:8px}.ionic-selectable-page-md .ionic-selectable-message{padding:8px 12px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:first-child{padding-right:8px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:last-child{padding-left:8px}.ionic-selectable-page.ionic-selectable-page-is-add-item-template-visible>.content>.scroll-content,.ionic-selectable-page.ionic-selectable-page-is-searching .scroll-content{overflow-y:hidden}"],encapsulation:ViewEncapsulation.None,providers:[{provide:NG_VALUE_ACCESSOR,useExisting:forwardRef(function(){return IonicSelectableComponent}),multi:!0}]}]}],IonicSelectableComponent.ctorParameters=function(){return[{type:ModalController},{type:Platform},{type:Item,decorators:[{type:Optional}]},{type:IterableDiffers},{type:ElementRef},{type:Renderer}]},IonicSelectableComponent.propDecorators={_cssClass:[{type:HostBinding,args:["class.ionic-selectable"]}],_isIos:[{type:HostBinding,args:["class.ionic-selectable-ios"]}],_isMD:[{type:HostBinding,args:["class.ionic-selectable-md"]}],_isMultipleCssClass:[{type:HostBinding,args:["class.ionic-selectable-is-multiple"]}],_hasValueCssClass:[{type:HostBinding,args:["class.ionic-selectable-has-value"]}],_hasPlaceholderCssClass:[{type:HostBinding,args:["class.ionic-selectable-has-placeholder"]}],items:[{type:Input}],itemsChange:[{type:Output}],isEnabled:[{type:HostBinding,args:["class.ionic-selectable-is-enabled"]},{type:Input,args:["isEnabled"]}],isOkButtonEnabled:[{type:Input}],itemValueField:[{type:Input}],itemTextField:[{type:Input}],groupValueField:[{type:Input}],groupTextField:[{type:Input}],canSearch:[{type:Input}],isOnSearchEnabled:[{type:Input,args:["isOnSearchEnabled"]}],canClear:[{type:HostBinding,args:["class.ionic-selectable-can-clear"]},{type:Input,args:["canClear"]}],hasInfiniteScroll:[{type:Input}],hasVirtualScroll:[{type:Input}],virtualScrollApproxItemHeight:[{type:Input}],searchPlaceholder:[{type:Input}],placeholder:[{type:Input}],isMultiple:[{type:Input,args:["isMultiple"]}],searchFailText:[{type:Input}],clearButtonText:[{type:Input}],addButtonText:[{type:Input}],okButtonText:[{type:Input}],closeButtonText:[{type:Input}],shouldFocusSearchbar:[{type:Input}],headerColor:[{type:Input}],groupColor:[{type:Input}],onChange:[{type:Output}],onSearch:[{type:Output}],onSearchFail:[{type:Output}],onSearchSuccess:[{type:Output}],onInfiniteScroll:[{type:Output}],onOpen:[{type:Output}],onClose:[{type:Output}],searchDebounce:[{type:Input}],disabledItems:[{type:Input}],shouldStoreItemValue:[{type:Input}],canSaveItem:[{type:Input}],canDeleteItem:[{type:Input}],canAddItem:[{type:Input,args:["canAddItem"]}],onSaveItem:[{type:Output}],onDeleteItem:[{type:Output}],onAddItem:[{type:Output}],valueTemplate:[{type:ContentChild,args:[IonicSelectableValueTemplateDirective,{read:TemplateRef}]}],itemTemplate:[{type:ContentChild,args:[IonicSelectableItemTemplateDirective,{read:TemplateRef}]}],itemRightTemplate:[{type:ContentChild,args:[IonicSelectableItemRightTemplateDirective,{read:TemplateRef}]}],titleTemplate:[{type:ContentChild,args:[IonicSelectableTitleTemplateDirective,{read:TemplateRef}]}],placeholderTemplate:[{type:ContentChild,args:[IonicSelectablePlaceholderTemplateDirective,{read:TemplateRef}]}],messageTemplate:[{type:ContentChild,args:[IonicSelectableMessageTemplateDirective,{read:TemplateRef}]}],groupTemplate:[{type:ContentChild,args:[IonicSelectableGroupTemplateDirective,{read:TemplateRef}]}],groupRightTemplate:[{type:ContentChild,args:[IonicSelectableGroupRightTemplateDirective,{read:TemplateRef}]}],closeButtonTemplate:[{type:ContentChild,args:[IonicSelectableCloseButtonTemplateDirective,{read:TemplateRef}]}],searchFailTemplate:[{type:ContentChild,args:[IonicSelectableSearchFailTemplateDirective,{read:TemplateRef}]}],addItemTemplate:[{type:ContentChild,args:[IonicSelectableAddItemTemplateDirective,{read:TemplateRef}]}],virtualScrollHeaderFn:[{type:Input}]};var IonicSelectablePageComponent=function(){function e(e,t){var n=this;this.navParams=e,this._element=t,this._cssClass=!0,this.selectComponent=this.navParams.get("selectComponent"),this.selectComponent._selectPageComponent=this,this.selectComponent._selectedItems=[],this.selectComponent._isNullOrWhiteSpace(this.selectComponent.value)||(this.selectComponent.isMultiple?this.selectComponent.value.forEach(function(e){n.selectComponent._selectedItems.push(e)}):this.selectComponent._selectedItems.push(this.selectComponent.value)),this._setItemsToConfirm(this.selectComponent._selectedItems)}return Object.defineProperty(e.prototype,"_canClearCssClass",{get:function(){return this.selectComponent.canClear},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isMultipleCssClass",{get:function(){return this.selectComponent.isMultiple},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isSearchingCssClass",{get:function(){return this.selectComponent._isSearching},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"_isIos",{get:function(){return this.selectComponent._isIos},enumerable:!0,configurable:!0}),e.prototype._isMD=function(){return this.selectComponent._isMD},Object.defineProperty(e.prototype,"_isAddItemTemplateVisibleCssClass",{get:function(){return this.selectComponent._isAddItemTemplateVisible},enumerable:!0,configurable:!0}),e.prototype.onResize=function(){this.selectComponent._positionAddItemTemplate()},e.prototype.ngAfterViewInit=function(){var e=this;this._header=this._element.nativeElement.querySelector("ion-header"),this._searchbarComponent&&this.selectComponent.shouldFocusSearchbar&&setTimeout(function(){e._searchbarComponent.focus()},1e3)},e.prototype._setItemsToConfirm=function(e){this.selectComponent._itemsToConfirm=[].concat(e)},e.prototype._getMoreItems=function(){this.selectComponent.onInfiniteScroll.emit({component:this.selectComponent,text:this.selectComponent._searchText})},e.prototype._select=function(e){this.selectComponent.isMultiple?(this.selectComponent._isItemSelected(e)?this.selectComponent._deleteSelectedItem(e):this.selectComponent._addSelectedItem(e),this._setItemsToConfirm(this.selectComponent._selectedItems)):(this.selectComponent._isItemSelected(e)||(this.selectComponent._selectedItems=[],this.selectComponent._addSelectedItem(e),this.selectComponent._shouldStoreItemValue?this.selectComponent._select(this.selectComponent._getItemValue(e)):this.selectComponent._select(e)),this._close())},e.prototype._ok=function(){this.selectComponent._select(this.selectComponent._selectedItems),this._close()},e.prototype._close=function(){var e=this;this.selectComponent.close().then(function(){e.selectComponent.onClose.emit({component:e.selectComponent})}),this.selectComponent._hasOnSearch()||(this.selectComponent._searchText="",this.selectComponent._setHasSearchText())},e.prototype._clear=function(){var e=this;this.selectComponent.clear(),this.selectComponent._emitValueChange(),this.selectComponent.close().then(function(){e.selectComponent.onClose.emit({component:e.selectComponent})})},e}();IonicSelectablePageComponent.decorators=[{type:Component,args:[{selector:"ionic-selectable-page",template:'<ion-header>\n <ion-toolbar [color]="selectComponent.headerColor ? selectComponent.headerColor : null">\n <ion-buttons slot="start">\n <ion-button (click)="_close()">\n <span *ngIf="selectComponent.closeButtonTemplate" [ngTemplateOutlet]="selectComponent.closeButtonTemplate">\n </span>\n <span *ngIf="!selectComponent.closeButtonTemplate">\n {{selectComponent.closeButtonText}}\n </span>\n </ion-button>\n </ion-buttons>\n <ion-title>\n \x3c!-- Need span for for text ellipsis. --\x3e\n <span *ngIf="selectComponent.titleTemplate" [ngTemplateOutlet]="selectComponent.titleTemplate">\n </span>\n <span *ngIf="!selectComponent.titleTemplate">\n {{selectComponent._labelText}}\n </span>\n </ion-title>\n </ion-toolbar>\n <ion-toolbar *ngIf="selectComponent.canSearch || selectComponent.messageTemplate">\n <ion-searchbar *ngIf="selectComponent.canSearch" #searchbarComponent\n [(ngModel)]="selectComponent._searchText" (ionChange)="selectComponent._filterItems()"\n (ionClear)="selectComponent._onSearchbarClear()" [placeholder]="selectComponent.searchPlaceholder"\n [debounce]="selectComponent.searchDebounce">\n </ion-searchbar>\n <div class="ionic-selectable-message" *ngIf="selectComponent.messageTemplate">\n <div [ngTemplateOutlet]="selectComponent.messageTemplate">\n </div>\n </div>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <div class="ionic-selectable-spinner" *ngIf="selectComponent._isSearching">\n <div class="ionic-selectable-spinner-background"></div>\n <ion-spinner></ion-spinner>\n </div>\n <ion-list no-margin *ngIf="!selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length">\n <ion-item-group *ngFor="let group of selectComponent._filteredGroups" class="ionic-selectable-group">\n <ion-item-divider *ngIf="selectComponent._hasGroups" [color]="selectComponent.groupColor ? selectComponent.groupColor : null">\n \x3c!-- Need span for for text ellipsis. --\x3e\n <span *ngIf="selectComponent.groupTemplate" [ngTemplateOutlet]="selectComponent.groupTemplate"\n [ngTemplateOutletContext]="{ group: group }">\n </span>\n \x3c!-- Need ion-label for text ellipsis. --\x3e\n <ion-label *ngIf="!selectComponent.groupTemplate">\n {{group.text}}\n </ion-label>\n <div *ngIf="selectComponent.groupRightTemplate" slot="end">\n <div [ngTemplateOutlet]="selectComponent.groupRightTemplate"\n [ngTemplateOutletContext]="{ group: group }">\n </div>\n </div>\n </ion-item-divider>\n <ion-item button="true" detail="false" *ngFor="let item of group.items"\n (click)="_select(item)" class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item),\n \'ionic-selectable-item-is-disabled\': selectComponent._isItemDisabled(item)\n }"\n [disabled]="selectComponent._isItemDisabled(item)">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null"\n slot="start">\n </ion-icon>\n \x3c!-- Need span for text ellipsis. --\x3e\n <span *ngIf="selectComponent.itemTemplate" [ngTemplateOutlet]="selectComponent.itemTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </span>\n \x3c!-- Need ion-label for text ellipsis. --\x3e\n <ion-label *ngIf="!selectComponent.itemTemplate">\n {{selectComponent._formatItem(item)}}\n </ion-label>\n <div *ngIf="selectComponent.itemRightTemplate" slot="end">\n <div [ngTemplateOutlet]="selectComponent.itemRightTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </div>\n </div>\n <ion-button *ngIf="selectComponent.canSaveItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._saveItem($event, item)">\n <ion-icon slot="icon-only" name="md-create"></ion-icon>\n </ion-button>\n <ion-button *ngIf="selectComponent.canDeleteItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._deleteItemClick($event, item)">\n <ion-icon slot="icon-only" name="md-trash"></ion-icon>\n </ion-button>\n </ion-item>\n </ion-item-group>\n </ion-list>\n \x3c!-- Fail text should be above InfiniteScroll to avoid a gap when no items are found. --\x3e\n <div *ngIf="!selectComponent._filteredGroups.length || !selectComponent._filteredGroups[0].items.length">\n <span *ngIf="selectComponent.searchFailTemplate" [ngTemplateOutlet]="selectComponent.searchFailTemplate">\n </span>\n <div *ngIf="!selectComponent.searchFailTemplate" margin>\n {{selectComponent.searchFailText}}\n </div>\n </div>\n <ion-infinite-scroll *ngIf="!selectComponent.hasVirtualScroll" [disabled]="!selectComponent.hasInfiniteScroll"\n (ionInfinite)="_getMoreItems($event)">\n <ion-infinite-scroll-content></ion-infinite-scroll-content>\n </ion-infinite-scroll>\n <ion-virtual-scroll no-margin *ngIf="selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length"\n [items]="selectComponent._filteredGroups[0].items" [headerFn]="selectComponent.virtualScrollHeaderFn"\n [approxItemHeight]="selectComponent.virtualScrollApproxItemHeight">\n <ion-item-divider *virtualHeader="let header" [color]="selectComponent.groupColor ? selectComponent.groupColor : null">\n {{header}}\n </ion-item-divider>\n <ion-item button="true" detail="false" *virtualItem="let item" (click)="_select(item)"\n class="ionic-selectable-item" [ngClass]="{\n \'ionic-selectable-item-is-selected\': selectComponent._isItemSelected(item),\n \'ionic-selectable-item-is-disabled\': selectComponent._isItemDisabled(item)\n }"\n [disabled]="selectComponent._isItemDisabled(item)">\n <ion-icon [name]="selectComponent._isItemSelected(item) ? \'checkmark-circle\' : \'radio-button-off\'"\n [color]="selectComponent._isItemSelected(item) ? \'primary\' : null" slot="start">\n </ion-icon>\n \x3c!-- Need span for text ellipsis. --\x3e\n <span *ngIf="selectComponent.itemTemplate" [ngTemplateOutlet]="selectComponent.itemTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </span>\n \x3c!-- Need ion-label for text ellipsis. --\x3e\n <ion-label *ngIf="!selectComponent.itemTemplate">\n {{selectComponent._formatItem(item)}}\n </ion-label>\n <div *ngIf="selectComponent.itemRightTemplate" slot="end">\n <div [ngTemplateOutlet]="selectComponent.itemRightTemplate"\n [ngTemplateOutletContext]="{ item: item }">\n </div>\n </div>\n <ion-button *ngIf="selectComponent.canSaveItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._saveItem($event, item)">\n <ion-icon slot="icon-only" name="md-create"></ion-icon>\n </ion-button>\n <ion-button *ngIf="selectComponent.canDeleteItem" class="ionic-selectable-item-button"\n slot="end" fill="outline" (click)="selectComponent._deleteItemClick($event, item)">\n <ion-icon slot="icon-only" name="md-trash"></ion-icon>\n </ion-button>\n </ion-item>\n </ion-virtual-scroll>\n</ion-content>\n<div class="ionic-selectable-add-item-template" *ngIf="selectComponent._isAddItemTemplateVisible"\n [ngStyle]="{ \'top.px\': _header.offsetHeight }">\n <div class="ionic-selectable-add-item-template-inner" [ngStyle]="{ \'height\': selectComponent._addItemTemplateFooterHeight }">\n <span [ngTemplateOutlet]="selectComponent.addItemTemplate"\n [ngTemplateOutletContext]="{ item: selectComponent._itemToAdd, isAdd: selectComponent._itemToAdd === null }">\n </span>\n </div>\n</div>\n<ion-footer *ngIf="selectComponent._footerButtonsCount > 0" [ngStyle]="{ \'visibility\': selectComponent._isFooterVisible ? \'initial\' : \'hidden\' }">\n <ion-toolbar>\n <ion-row>\n <ion-col *ngIf="selectComponent.canClear" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)="_clear()" [disabled]="!selectComponent._selectedItems.length">\n {{selectComponent.clearButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf="selectComponent.canAddItem" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)="selectComponent._addItemClick()">\n {{selectComponent.addButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf="selectComponent.isMultiple" [size]="12 / selectComponent._footerButtonsCount">\n <ion-button expand="full" (click)="_ok()" [disabled]="!selectComponent.isOkButtonEnabled">\n {{selectComponent.okButtonText}}\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-toolbar>\n</ion-footer>\n'}]}],IonicSelectablePageComponent.ctorParameters=function(){return[{type:NavParams},{type:ElementRef}]},IonicSelectablePageComponent.propDecorators={_content:[{type:ViewChild,args:[Content]}],_searchbarComponent:[{type:ViewChild,args:["searchbarComponent"]}],_infiniteScroll:[{type:ViewChild,args:[InfiniteScroll]}],_cssClass:[{type:HostBinding,args:["class.ionic-selectable-page"]}],_canClearCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-can-clear"]}],_isMultipleCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-is-multiple"]}],_isSearchingCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-is-searching"]}],_isIos:[{type:HostBinding,args:["class.ionic-selectable-page-ios"]}],_isMD:[{type:HostBinding,args:["class.ionic-selectable-page-md"]}],_isAddItemTemplateVisibleCssClass:[{type:HostBinding,args:["class.ionic-selectable-page-is-add-item-template-visible"]}],onResize:[{type:HostListener,args:["window:resize",["$event"]]}]};var components=[IonicSelectableComponent,IonicSelectablePageComponent],directives=[IonicSelectableValueTemplateDirective,IonicSelectableItemTemplateDirective,IonicSelectableItemRightTemplateDirective,IonicSelectableTitleTemplateDirective,IonicSelectablePlaceholderTemplateDirective,IonicSelectableMessageTemplateDirective,IonicSelectableGroupTemplateDirective,IonicSelectableGroupRightTemplateDirective,IonicSelectableCloseButtonTemplateDirective,IonicSelectableSearchFailTemplateDirective,IonicSelectableAddItemTemplateDirective],IonicSelectableModule=function(){return function(){}}();IonicSelectableModule.decorators=[{type:NgModule,args:[{imports:[CommonModule,FormsModule,IonicModule],declarations:__spread(components,directives),exports:__spread(components,directives),entryComponents:components}]}],IonicSelectableModule.ctorParameters=function(){return[]};export{IonicSelectableAddItemTemplateDirective,IonicSelectableCloseButtonTemplateDirective,IonicSelectableGroupRightTemplateDirective,IonicSelectableGroupTemplateDirective,IonicSelectableItemRightTemplateDirective,IonicSelectableItemTemplateDirective,IonicSelectableMessageTemplateDirective,IonicSelectablePageComponent,IonicSelectablePlaceholderTemplateDirective,IonicSelectableSearchFailTemplateDirective,IonicSelectableTitleTemplateDirective,IonicSelectableValueTemplateDirective,IonicSelectableComponent,IonicSelectableModule}; |
@@ -1,1 +0,1 @@ | ||
| {"__symbolic":"module","version":4,"metadata":{"IonicSelectableModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":11,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":13,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":14,"character":4},{"__symbolic":"reference","module":"@ionic/angular","name":"IonicModule","line":15,"character":4}],"declarations":[{"__symbolic":"reference","name":"IonicSelectableComponent"},{"__symbolic":"reference","name":"IonicSelectablePageComponent"}],"exports":[{"__symbolic":"reference","name":"IonicSelectableComponent"},{"__symbolic":"reference","name":"IonicSelectablePageComponent"}],"entryComponents":[{"__symbolic":"reference","name":"IonicSelectableComponent"},{"__symbolic":"reference","name":"IonicSelectablePageComponent"}]}]}],"members":{}},"IonicSelectablePageComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"ionic-selectable-page","template":"<ion-header>\n <ion-toolbar [color]=\"selectComponent.headerColor ? selectComponent.headerColor : null\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"_close()\">\n {{selectComponent.closeButtonText}}\n </ion-button>\n </ion-buttons>\n <ion-title>\n <span>\n {{selectComponent._labelText}}\n </span>\n </ion-title>\n </ion-toolbar>\n <ion-toolbar *ngIf=\"selectComponent.canSearch\">\n <ion-searchbar *ngIf=\"selectComponent.canSearch\" #searchbarComponent\n [(ngModel)]=\"selectComponent._searchText\" (ionChange)=\"selectComponent._filterItems()\"\n (ionClear)=\"selectComponent._onSearchbarClear()\" [placeholder]=\"selectComponent.searchPlaceholder\"\n [debounce]=\"selectComponent.searchDebounce\">\n </ion-searchbar>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <div class=\"ionic-selectable-spinner\" *ngIf=\"selectComponent._isSearching\">\n <div class=\"ionic-selectable-spinner-background\"></div>\n <ion-spinner></ion-spinner>\n </div>\n <ion-list no-margin *ngIf=\"!selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length\">\n <ion-item-group *ngFor=\"let group of selectComponent._filteredGroups\" class=\"ionic-selectable-group\">\n <ion-item button detail=\"false\" *ngFor=\"let item of group.items\" (click)=\"_select(item)\"\n class=\"ionic-selectable-item\" [ngClass]=\"{\n 'ionic-selectable-item-is-selected': selectComponent._isItemSelected(item)\n }\">\n <ion-icon [name]=\"selectComponent._isItemSelected(item) ? 'checkmark-circle' : 'radio-button-off'\"\n [color]=\"selectComponent._isItemSelected(item) ? 'primary' : null\"\n slot=\"start\">\n </ion-icon>\n <span>\n {{selectComponent._formatItem(item)}}\n </span>\n </ion-item>\n </ion-item-group>\n </ion-list>\n <!-- Fail text should be above InfiniteScroll to avoid a gap when no items are found. -->\n <div *ngIf=\"!selectComponent._filteredGroups.length || !selectComponent._filteredGroups[0].items.length\">\n <div margin>\n {{selectComponent.searchFailText}}\n </div>\n </div>\n <ion-infinite-scroll *ngIf=\"!selectComponent.hasVirtualScroll\" [disabled]=\"!selectComponent.hasInfiniteScroll\"\n (ionInfinite)=\"_getMoreItems($event)\">\n <ion-infinite-scroll-content></ion-infinite-scroll-content>\n </ion-infinite-scroll>\n <ion-virtual-scroll no-margin *ngIf=\"selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length\"\n [items]=\"selectComponent._filteredGroups[0].items\" [approxItemHeight]=\"selectComponent.virtualScrollApproxItemHeight\">\n <ion-item button detail=\"false\" *virtualItem=\"let item\" (click)=\"_select(item)\"\n class=\"ionic-selectable-item\" [ngClass]=\"{\n 'ionic-selectable-item-is-selected': selectComponent._isItemSelected(item)\n }\">\n <ion-icon [name]=\"selectComponent._isItemSelected(item) ? 'checkmark-circle' : 'radio-button-off'\"\n [color]=\"selectComponent._isItemSelected(item) ? 'primary' : null\" slot=\"start\">\n </ion-icon>\n <span>\n {{selectComponent._formatItem(item)}}\n </span>\n </ion-item>\n </ion-virtual-scroll>\n</ion-content>\n<ion-footer *ngIf=\"selectComponent._footerButtonsCount > 0\">\n <ion-toolbar>\n <ion-row>\n <ion-col *ngIf=\"selectComponent.canClear\" [size]=\"12 / selectComponent._footerButtonsCount\">\n <ion-button expand=\"full\" (click)=\" _clear()\" [disabled]=\"!selectComponent._selectedItems.length\">\n {{selectComponent.clearButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf=\"selectComponent.isMultiple\" [size]=\"12 / selectComponent._footerButtonsCount\">\n <ion-button expand=\"full\" (click)=\" _ok()\" [disabled]=\"!selectComponent.isOkButtonEnabled\">\n {{selectComponent.okButtonText}}\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-toolbar>\n</ion-footer>\n"}]}],"members":{"_content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":92,"character":3},"arguments":[{"__symbolic":"reference","module":"@ionic/angular","name":"Content","line":92,"character":13}]}]}],"_searchbarComponent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":95,"character":3},"arguments":["searchbarComponent"]}]}],"_infiniteScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":97,"character":3},"arguments":[{"__symbolic":"reference","module":"@ionic/angular","name":"InfiniteScroll","line":97,"character":13}]}]}],"_cssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":99,"character":3},"arguments":["class.ionic-selectable-page"]}]}],"_canClearCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":101,"character":3},"arguments":["class.ionic-selectable-page-can-clear"]}]}],"_isMultipleCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":105,"character":3},"arguments":["class.ionic-selectable-page-is-multiple"]}]}],"_isSearchingCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":109,"character":3},"arguments":["class.ionic-selectable-page-is-searching"]}]}],"_isIos":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":113,"character":3},"arguments":["class.ionic-selectable-page-ios"]}]}],"_isMD":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":117,"character":3},"arguments":["class.ionic-selectable-page-md"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@ionic/angular","name":"NavParams","line":123,"character":23}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"_setItemsToConfirm":[{"__symbolic":"method"}],"_getMoreItems":[{"__symbolic":"method"}],"_select":[{"__symbolic":"method"}],"_ok":[{"__symbolic":"method"}],"_close":[{"__symbolic":"method"}],"_clear":[{"__symbolic":"method"}]}},"IonicSelectableComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"ionic-selectable","template":"<div class=\"ionic-selectable-value\">\n <span *ngIf=\"_valueItems.length\">\n <div class=\"ionic-selectable-value-item\" *ngFor=\"let valueItem of _valueItems\">\n {{_formatValueItem(valueItem)}}\n </div>\n </span>\n <div class=\"ionic-selectable-value-item\" *ngIf=\"_hasPlaceholder\">\n {{placeholder}}\n </div>\n <!-- Fix icon allignment when there's no value or placeholder. -->\n <span *ngIf=\"!_valueItems.length && !_hasPlaceholder\"> </span>\n</div>\n<div class=\"ionic-selectable-icon\">\n <div class=\"ionic-selectable-icon-inner\"></div>\n</div>\n<button class=\"ionic-selectable-cover\" [disabled]=\"!isEnabled\" (click)=\"_click()\">\n</button>\n","styles":[".item-label-floating .ionic-selectable,.item-label-stacked .ionic-selectable{-ms-flex-item-align:stretch;align-self:stretch;max-width:100%;padding-left:0;padding-top:8px;padding-bottom:8px}.item-label-floating .ionic-selectable-value,.item-label-stacked .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:19px}.item-label-floating .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-icon-inner{top:7px}.item-label-floating .ionic-selectable-ios .ionic-selectable-value,.item-label-stacked .ionic-selectable-ios .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:20px}.item-label-floating .ionic-selectable-ios .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-ios .ionic-selectable-icon-inner{top:8px}.item:not(.item-label-stacked):not(.item-label-floating) .ionic-selectable-value{padding-left:var(--padding-start,16px)}.item-ionic-selectable .item-inner .input-wrapper{-webkit-box-align:normal;-ms-flex-align:normal;align-items:normal}.item-ionic-selectable ion-label{-webkit-box-flex:1;-ms-flex:1;flex:1;max-width:initial}.ionic-selectable{display:-webkit-box;display:-ms-flexbox;display:flex;max-width:45%}.ionic-selectable-has-placeholder .ionic-selectable-value-item{color:var(--placeholder-color,#999)}.ionic-selectable-value{-webkit-box-flex:1;-ms-flex:1;flex:1;padding-top:13px;padding-bottom:13px;overflow:hidden}.ionic-selectable-value-item{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ionic-selectable-value-item:not(:last-child){margin-bottom:5px}.ionic-selectable-icon{position:relative;width:20px}.ionic-selectable-icon-inner{position:absolute;top:20px;left:5px;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;pointer-events:none;color:var(--icon-color,#999)}.ionic-selectable-ios .ionic-selectable-value{padding-top:11px;padding-bottom:11px}.ionic-selectable-ios .ionic-selectable-icon-inner{top:19px}.ionic-selectable-spinner{position:fixed;bottom:0;top:0;left:0;right:0;z-index:1}.ionic-selectable-spinner-background{top:0;bottom:0;left:0;right:0;position:absolute;background-color:#000;opacity:.05}.ionic-selectable-spinner ion-spinner{position:absolute;top:50%;left:50%;z-index:10;margin-top:-14px;margin-left:-14px}.ionic-selectable-cover{left:0;top:0;margin:0;position:absolute;width:100%;height:100%;border:0;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:first-child{padding-right:8px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:last-child{padding-left:8px}.ionic-selectable-page.ionic-selectable-page-is-searching .scroll-content{overflow-y:hidden}"],"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":27,"character":19},"member":"None"},"providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":29,"character":17},"useExisting":{"__symbolic":"reference","name":"IonicSelectableComponent"},"multi":true}]}]}],"members":{"_cssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":35,"character":5},"arguments":["class.ionic-selectable"]}]}],"_isIos":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":37,"character":5},"arguments":["class.ionic-selectable-ios"]}]}],"_isMD":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":39,"character":5},"arguments":["class.ionic-selectable-md"]}]}],"_isMultipleCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":41,"character":5},"arguments":["class.ionic-selectable-is-multiple"]}]}],"_hasValueCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":45,"character":5},"arguments":["class.ionic-selectable-has-value"]}]}],"_hasPlaceholderCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":49,"character":5},"arguments":["class.ionic-selectable-has-placeholder"]}]}],"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":149,"character":5}}]}],"itemsChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":151,"character":5}}]}],"isEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":161,"character":5},"arguments":["class.ionic-selectable-is-enabled"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":162,"character":5},"arguments":["isEnabled"]}]}],"isOkButtonEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":190,"character":5}}]}],"itemValueField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":201,"character":5}}]}],"itemTextField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":212,"character":5}}]}],"canSearch":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":222,"character":5}}]}],"isOnSearchEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":232,"character":5},"arguments":["isOnSearchEnabled"]}]}],"canClear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":247,"character":5},"arguments":["class.ionic-selectable-can-clear"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":248,"character":5},"arguments":["canClear"]}]}],"hasInfiniteScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":265,"character":5}}]}],"hasVirtualScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":276,"character":5}}]}],"virtualScrollApproxItemHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":286,"character":5}}]}],"searchPlaceholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":296,"character":5}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":306,"character":5}}]}],"isMultiple":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":316,"character":5},"arguments":["isMultiple"]}]}],"searchFailText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":332,"character":5}}]}],"clearButtonText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":342,"character":5}}]}],"okButtonText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":352,"character":5}}]}],"closeButtonText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":363,"character":5}}]}],"shouldFocusSearchbar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":373,"character":5}}]}],"headerColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":383,"character":5}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":392,"character":5}}]}],"onSearch":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":402,"character":5}}]}],"onInfiniteScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":412,"character":5}}]}],"onOpen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":421,"character":5}}]}],"onClose":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":430,"character":5}}]}],"searchDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":454,"character":5}}]}],"shouldStoreItemValue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":465,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":471,"character":9}}],null,null,null],"parameters":[{"__symbolic":"reference","module":"@ionic/angular","name":"ModalController","line":469,"character":34},{"__symbolic":"reference","module":"@ionic/angular","name":"Platform","line":470,"character":27},{"__symbolic":"reference","module":"@ionic/angular","name":"Item","line":471,"character":37},{"__symbolic":"reference","module":"@angular/core","name":"IterableDiffers","line":472,"character":34},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":473,"character":26},{"__symbolic":"reference","module":"@angular/core","name":"Renderer","line":474,"character":27}]}],"initFocus":[{"__symbolic":"method"}],"enableIonItem":[{"__symbolic":"method"}],"_isNullOrWhiteSpace":[{"__symbolic":"method"}],"_setHasSearchText":[{"__symbolic":"method"}],"_hasOnSearch":[{"__symbolic":"method"}],"_select":[{"__symbolic":"method"}],"_emitValueChange":[{"__symbolic":"method"}],"_emitSearch":[{"__symbolic":"method"}],"_formatItem":[{"__symbolic":"method"}],"_getLabelText":[{"__symbolic":"method"}],"_getItemValue":[{"__symbolic":"method"}],"_getStoredItemValue":[{"__symbolic":"method"}],"_onSearchbarClear":[{"__symbolic":"method"}],"_filterItems":[{"__symbolic":"method"}],"_isItemSelected":[{"__symbolic":"method"}],"_addSelectedItem":[{"__symbolic":"method"}],"_deleteSelectedItem":[{"__symbolic":"method"}],"_click":[{"__symbolic":"method"}],"_countFooterButtons":[{"__symbolic":"method"}],"_setItems":[{"__symbolic":"method"}],"_formatValueItem":[{"__symbolic":"method"}],"_setIonItemHasFocus":[{"__symbolic":"method"}],"_setIonItemHasValue":[{"__symbolic":"method"}],"_setHasPlaceholder":[{"__symbolic":"method"}],"_setIonItemCssClass":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"hasValue":[{"__symbolic":"method"}],"open":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"clear":[{"__symbolic":"method"}],"scrollToTop":[{"__symbolic":"method"}],"scrollToBottom":[{"__symbolic":"method"}],"startSearch":[{"__symbolic":"method"}],"endSearch":[{"__symbolic":"method"}],"enableInfiniteScroll":[{"__symbolic":"method"}],"disableInfiniteScroll":[{"__symbolic":"method"}],"endInfiniteScroll":[{"__symbolic":"method"}],"search":[{"__symbolic":"method"}],"showLoading":[{"__symbolic":"method"}],"hideLoading":[{"__symbolic":"method"}]}}},"origins":{"IonicSelectableModule":"./src/app/components/ionic-selectable/ionic-selectable.module","IonicSelectablePageComponent":"./src/app/components/ionic-selectable/ionic-selectable-page.component","IonicSelectableComponent":"./src/app/components/ionic-selectable/ionic-selectable.component"},"importAs":"ionic-selectable"} | ||
| {"__symbolic":"module","version":4,"metadata":{"IonicSelectableModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":46,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":48,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":49,"character":4},{"__symbolic":"reference","module":"@ionic/angular","name":"IonicModule","line":50,"character":4}],"declarations":[{"__symbolic":"reference","name":"IonicSelectableComponent"},{"__symbolic":"reference","name":"IonicSelectablePageComponent"},{"__symbolic":"reference","name":"IonicSelectableValueTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableItemTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableItemRightTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableTitleTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectablePlaceholderTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableMessageTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableGroupTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableGroupRightTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableCloseButtonTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableSearchFailTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableAddItemTemplateDirective"}],"exports":[{"__symbolic":"reference","name":"IonicSelectableComponent"},{"__symbolic":"reference","name":"IonicSelectablePageComponent"},{"__symbolic":"reference","name":"IonicSelectableValueTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableItemTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableItemRightTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableTitleTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectablePlaceholderTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableMessageTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableGroupTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableGroupRightTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableCloseButtonTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableSearchFailTemplateDirective"},{"__symbolic":"reference","name":"IonicSelectableAddItemTemplateDirective"}],"entryComponents":[{"__symbolic":"reference","name":"IonicSelectableComponent"},{"__symbolic":"reference","name":"IonicSelectablePageComponent"}]}]}],"members":{}},"IonicSelectableAddItemTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectableAddItemTemplate]"}]}],"members":{}},"IonicSelectableCloseButtonTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectableCloseButtonTemplate]"}]}],"members":{}},"IonicSelectableGroupRightTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectableGroupRightTemplate]"}]}],"members":{}},"IonicSelectableGroupTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectableGroupTemplate]"}]}],"members":{}},"IonicSelectableItemRightTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectableItemRightTemplate]"}]}],"members":{}},"IonicSelectableItemTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectableItemTemplate]"}]}],"members":{}},"IonicSelectableMessageTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectableMessageTemplate]"}]}],"members":{}},"IonicSelectablePageComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"ionic-selectable-page","template":"<ion-header>\n <ion-toolbar [color]=\"selectComponent.headerColor ? selectComponent.headerColor : null\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"_close()\">\n <span *ngIf=\"selectComponent.closeButtonTemplate\" [ngTemplateOutlet]=\"selectComponent.closeButtonTemplate\">\n </span>\n <span *ngIf=\"!selectComponent.closeButtonTemplate\">\n {{selectComponent.closeButtonText}}\n </span>\n </ion-button>\n </ion-buttons>\n <ion-title>\n <!-- Need span for for text ellipsis. -->\n <span *ngIf=\"selectComponent.titleTemplate\" [ngTemplateOutlet]=\"selectComponent.titleTemplate\">\n </span>\n <span *ngIf=\"!selectComponent.titleTemplate\">\n {{selectComponent._labelText}}\n </span>\n </ion-title>\n </ion-toolbar>\n <ion-toolbar *ngIf=\"selectComponent.canSearch || selectComponent.messageTemplate\">\n <ion-searchbar *ngIf=\"selectComponent.canSearch\" #searchbarComponent\n [(ngModel)]=\"selectComponent._searchText\" (ionChange)=\"selectComponent._filterItems()\"\n (ionClear)=\"selectComponent._onSearchbarClear()\" [placeholder]=\"selectComponent.searchPlaceholder\"\n [debounce]=\"selectComponent.searchDebounce\">\n </ion-searchbar>\n <div class=\"ionic-selectable-message\" *ngIf=\"selectComponent.messageTemplate\">\n <div [ngTemplateOutlet]=\"selectComponent.messageTemplate\">\n </div>\n </div>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <div class=\"ionic-selectable-spinner\" *ngIf=\"selectComponent._isSearching\">\n <div class=\"ionic-selectable-spinner-background\"></div>\n <ion-spinner></ion-spinner>\n </div>\n <ion-list no-margin *ngIf=\"!selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length\">\n <ion-item-group *ngFor=\"let group of selectComponent._filteredGroups\" class=\"ionic-selectable-group\">\n <ion-item-divider *ngIf=\"selectComponent._hasGroups\" [color]=\"selectComponent.groupColor ? selectComponent.groupColor : null\">\n <!-- Need span for for text ellipsis. -->\n <span *ngIf=\"selectComponent.groupTemplate\" [ngTemplateOutlet]=\"selectComponent.groupTemplate\"\n [ngTemplateOutletContext]=\"{ group: group }\">\n </span>\n <!-- Need ion-label for text ellipsis. -->\n <ion-label *ngIf=\"!selectComponent.groupTemplate\">\n {{group.text}}\n </ion-label>\n <div *ngIf=\"selectComponent.groupRightTemplate\" slot=\"end\">\n <div [ngTemplateOutlet]=\"selectComponent.groupRightTemplate\"\n [ngTemplateOutletContext]=\"{ group: group }\">\n </div>\n </div>\n </ion-item-divider>\n <ion-item button=\"true\" detail=\"false\" *ngFor=\"let item of group.items\"\n (click)=\"_select(item)\" class=\"ionic-selectable-item\" [ngClass]=\"{\n 'ionic-selectable-item-is-selected': selectComponent._isItemSelected(item),\n 'ionic-selectable-item-is-disabled': selectComponent._isItemDisabled(item)\n }\"\n [disabled]=\"selectComponent._isItemDisabled(item)\">\n <ion-icon [name]=\"selectComponent._isItemSelected(item) ? 'checkmark-circle' : 'radio-button-off'\"\n [color]=\"selectComponent._isItemSelected(item) ? 'primary' : null\"\n slot=\"start\">\n </ion-icon>\n <!-- Need span for text ellipsis. -->\n <span *ngIf=\"selectComponent.itemTemplate\" [ngTemplateOutlet]=\"selectComponent.itemTemplate\"\n [ngTemplateOutletContext]=\"{ item: item }\">\n </span>\n <!-- Need ion-label for text ellipsis. -->\n <ion-label *ngIf=\"!selectComponent.itemTemplate\">\n {{selectComponent._formatItem(item)}}\n </ion-label>\n <div *ngIf=\"selectComponent.itemRightTemplate\" slot=\"end\">\n <div [ngTemplateOutlet]=\"selectComponent.itemRightTemplate\"\n [ngTemplateOutletContext]=\"{ item: item }\">\n </div>\n </div>\n <ion-button *ngIf=\"selectComponent.canSaveItem\" class=\"ionic-selectable-item-button\"\n slot=\"end\" fill=\"outline\" (click)=\"selectComponent._saveItem($event, item)\">\n <ion-icon slot=\"icon-only\" name=\"md-create\"></ion-icon>\n </ion-button>\n <ion-button *ngIf=\"selectComponent.canDeleteItem\" class=\"ionic-selectable-item-button\"\n slot=\"end\" fill=\"outline\" (click)=\"selectComponent._deleteItemClick($event, item)\">\n <ion-icon slot=\"icon-only\" name=\"md-trash\"></ion-icon>\n </ion-button>\n </ion-item>\n </ion-item-group>\n </ion-list>\n <!-- Fail text should be above InfiniteScroll to avoid a gap when no items are found. -->\n <div *ngIf=\"!selectComponent._filteredGroups.length || !selectComponent._filteredGroups[0].items.length\">\n <span *ngIf=\"selectComponent.searchFailTemplate\" [ngTemplateOutlet]=\"selectComponent.searchFailTemplate\">\n </span>\n <div *ngIf=\"!selectComponent.searchFailTemplate\" margin>\n {{selectComponent.searchFailText}}\n </div>\n </div>\n <ion-infinite-scroll *ngIf=\"!selectComponent.hasVirtualScroll\" [disabled]=\"!selectComponent.hasInfiniteScroll\"\n (ionInfinite)=\"_getMoreItems($event)\">\n <ion-infinite-scroll-content></ion-infinite-scroll-content>\n </ion-infinite-scroll>\n <ion-virtual-scroll no-margin *ngIf=\"selectComponent.hasVirtualScroll && selectComponent._filteredGroups.length\"\n [items]=\"selectComponent._filteredGroups[0].items\" [headerFn]=\"selectComponent.virtualScrollHeaderFn\"\n [approxItemHeight]=\"selectComponent.virtualScrollApproxItemHeight\">\n <ion-item-divider *virtualHeader=\"let header\" [color]=\"selectComponent.groupColor ? selectComponent.groupColor : null\">\n {{header}}\n </ion-item-divider>\n <ion-item button=\"true\" detail=\"false\" *virtualItem=\"let item\" (click)=\"_select(item)\"\n class=\"ionic-selectable-item\" [ngClass]=\"{\n 'ionic-selectable-item-is-selected': selectComponent._isItemSelected(item),\n 'ionic-selectable-item-is-disabled': selectComponent._isItemDisabled(item)\n }\"\n [disabled]=\"selectComponent._isItemDisabled(item)\">\n <ion-icon [name]=\"selectComponent._isItemSelected(item) ? 'checkmark-circle' : 'radio-button-off'\"\n [color]=\"selectComponent._isItemSelected(item) ? 'primary' : null\" slot=\"start\">\n </ion-icon>\n <!-- Need span for text ellipsis. -->\n <span *ngIf=\"selectComponent.itemTemplate\" [ngTemplateOutlet]=\"selectComponent.itemTemplate\"\n [ngTemplateOutletContext]=\"{ item: item }\">\n </span>\n <!-- Need ion-label for text ellipsis. -->\n <ion-label *ngIf=\"!selectComponent.itemTemplate\">\n {{selectComponent._formatItem(item)}}\n </ion-label>\n <div *ngIf=\"selectComponent.itemRightTemplate\" slot=\"end\">\n <div [ngTemplateOutlet]=\"selectComponent.itemRightTemplate\"\n [ngTemplateOutletContext]=\"{ item: item }\">\n </div>\n </div>\n <ion-button *ngIf=\"selectComponent.canSaveItem\" class=\"ionic-selectable-item-button\"\n slot=\"end\" fill=\"outline\" (click)=\"selectComponent._saveItem($event, item)\">\n <ion-icon slot=\"icon-only\" name=\"md-create\"></ion-icon>\n </ion-button>\n <ion-button *ngIf=\"selectComponent.canDeleteItem\" class=\"ionic-selectable-item-button\"\n slot=\"end\" fill=\"outline\" (click)=\"selectComponent._deleteItemClick($event, item)\">\n <ion-icon slot=\"icon-only\" name=\"md-trash\"></ion-icon>\n </ion-button>\n </ion-item>\n </ion-virtual-scroll>\n</ion-content>\n<div class=\"ionic-selectable-add-item-template\" *ngIf=\"selectComponent._isAddItemTemplateVisible\"\n [ngStyle]=\"{ 'top.px': _header.offsetHeight }\">\n <div class=\"ionic-selectable-add-item-template-inner\" [ngStyle]=\"{ 'height': selectComponent._addItemTemplateFooterHeight }\">\n <span [ngTemplateOutlet]=\"selectComponent.addItemTemplate\"\n [ngTemplateOutletContext]=\"{ item: selectComponent._itemToAdd, isAdd: selectComponent._itemToAdd === null }\">\n </span>\n </div>\n</div>\n<ion-footer *ngIf=\"selectComponent._footerButtonsCount > 0\" [ngStyle]=\"{ 'visibility': selectComponent._isFooterVisible ? 'initial' : 'hidden' }\">\n <ion-toolbar>\n <ion-row>\n <ion-col *ngIf=\"selectComponent.canClear\" [size]=\"12 / selectComponent._footerButtonsCount\">\n <ion-button expand=\"full\" (click)=\"_clear()\" [disabled]=\"!selectComponent._selectedItems.length\">\n {{selectComponent.clearButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf=\"selectComponent.canAddItem\" [size]=\"12 / selectComponent._footerButtonsCount\">\n <ion-button expand=\"full\" (click)=\"selectComponent._addItemClick()\">\n {{selectComponent.addButtonText}}\n </ion-button>\n </ion-col>\n <ion-col *ngIf=\"selectComponent.isMultiple\" [size]=\"12 / selectComponent._footerButtonsCount\">\n <ion-button expand=\"full\" (click)=\"_ok()\" [disabled]=\"!selectComponent.isOkButtonEnabled\">\n {{selectComponent.okButtonText}}\n </ion-button>\n </ion-col>\n </ion-row>\n </ion-toolbar>\n</ion-footer>\n"}]}],"members":{"_content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":177,"character":3},"arguments":[{"__symbolic":"reference","module":"@ionic/angular","name":"Content","line":177,"character":13}]}]}],"_searchbarComponent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":181,"character":3},"arguments":["searchbarComponent"]}]}],"_infiniteScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":183,"character":3},"arguments":[{"__symbolic":"reference","module":"@ionic/angular","name":"InfiniteScroll","line":183,"character":13}]}]}],"_cssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":185,"character":3},"arguments":["class.ionic-selectable-page"]}]}],"_canClearCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":187,"character":3},"arguments":["class.ionic-selectable-page-can-clear"]}]}],"_isMultipleCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":191,"character":3},"arguments":["class.ionic-selectable-page-is-multiple"]}]}],"_isSearchingCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":195,"character":3},"arguments":["class.ionic-selectable-page-is-searching"]}]}],"_isIos":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":199,"character":3},"arguments":["class.ionic-selectable-page-ios"]}]}],"_isMD":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":203,"character":3},"arguments":["class.ionic-selectable-page-md"]}]}],"_isAddItemTemplateVisibleCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":207,"character":3},"arguments":["class.ionic-selectable-page-is-add-item-template-visible"]}]}],"onResize":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":211,"character":3},"arguments":["window:resize",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@ionic/angular","name":"NavParams","line":219,"character":23},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":220,"character":21}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"_setItemsToConfirm":[{"__symbolic":"method"}],"_getMoreItems":[{"__symbolic":"method"}],"_select":[{"__symbolic":"method"}],"_ok":[{"__symbolic":"method"}],"_close":[{"__symbolic":"method"}],"_clear":[{"__symbolic":"method"}]}},"IonicSelectablePlaceholderTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectablePlaceholderTemplate]"}]}],"members":{}},"IonicSelectableSearchFailTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectableSearchFailTemplate]"}]}],"members":{}},"IonicSelectableTitleTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectableTitleTemplate]"}]}],"members":{}},"IonicSelectableValueTemplateDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[ionicSelectableValueTemplate]"}]}],"members":{}},"IonicSelectableComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":18,"character":1},"arguments":[{"selector":"ionic-selectable","template":"<div class=\"ionic-selectable-inner\">\n <div class=\"ionic-selectable-value\">\n <div *ngIf=\"valueTemplate && _valueItems.length && isMultiple\"\n [ngTemplateOutlet]=\"valueTemplate\" [ngTemplateOutletContext]=\"{ value: _valueItems }\">\n </div>\n <div class=\"ionic-selectable-value-item\" *ngIf=\"valueTemplate && _valueItems.length && !isMultiple\">\n <div [ngTemplateOutlet]=\"valueTemplate\" [ngTemplateOutletContext]=\"{ value: _valueItems[0] }\">\n </div>\n </div>\n <span *ngIf=\"!valueTemplate && _valueItems.length\">\n <div class=\"ionic-selectable-value-item\" *ngFor=\"let valueItem of _valueItems\">\n {{_formatValueItem(valueItem)}}\n </div>\n </span>\n <div *ngIf=\"_hasPlaceholder && placeholderTemplate\" class=\"ionic-selectable-value-item\">\n <div [ngTemplateOutlet]=\"placeholderTemplate\">\n </div>\n </div>\n <div class=\"ionic-selectable-value-item\" *ngIf=\"_hasPlaceholder && !placeholderTemplate\">\n {{placeholder}}\n </div>\n <!-- Fix icon allignment when there's no value or placeholder. -->\n <span *ngIf=\"!_valueItems.length && !_hasPlaceholder\"> </span>\n </div>\n <div class=\"ionic-selectable-icon\">\n <div class=\"ionic-selectable-icon-inner\"></div>\n </div>\n <button class=\"ionic-selectable-cover\" [disabled]=\"!isEnabled\" (click)=\"_click()\">\n </button>\n</div>\n","styles":[".item:not(.item-label) .ionic-selectable{max-width:100%;width:100%}.item:not(.item-label) .ionic-selectable-value-item{text-align:right}.item-label-floating .ionic-selectable,.item-label-stacked .ionic-selectable{-ms-flex-item-align:stretch;align-self:stretch;max-width:100%;padding-left:0;padding-top:8px;padding-bottom:8px}.item-label-floating .ionic-selectable-value,.item-label-stacked .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:19px}.item-label-floating .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-icon-inner{top:7px}.item-label-floating .ionic-selectable-ios .ionic-selectable-value,.item-label-stacked .ionic-selectable-ios .ionic-selectable-value{padding-top:0;padding-bottom:0;min-height:20px}.item-label-floating .ionic-selectable-ios .ionic-selectable-icon-inner,.item-label-stacked .ionic-selectable-ios .ionic-selectable-icon-inner{top:8px}.item:not(.item-label-stacked):not(.item-label-floating) .ionic-selectable-value{padding-left:var(--padding-start,16px)}.item-ionic-selectable .item-inner .input-wrapper{-webkit-box-align:normal;-ms-flex-align:normal;align-items:normal}.item-ionic-selectable ion-label{-webkit-box-flex:1;-ms-flex:1;flex:1;max-width:initial}.ionic-selectable{display:block;max-width:45%}.ionic-selectable-inner{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.ionic-selectable-has-placeholder .ionic-selectable-value-item{color:var(--placeholder-color,#999)}.ionic-selectable-value{-webkit-box-flex:1;-ms-flex:1;flex:1;padding-top:13px;padding-bottom:13px;overflow:hidden}.ionic-selectable-value-item{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ionic-selectable-value-item:not(:last-child){margin-bottom:5px}.ionic-selectable-icon{position:relative;width:20px}.ionic-selectable-icon-inner{position:absolute;top:20px;left:5px;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;pointer-events:none;color:var(--icon-color,#999)}.ionic-selectable-ios .ionic-selectable-value{padding-top:11px;padding-bottom:11px}.ionic-selectable-ios .ionic-selectable-icon-inner{top:19px}.ionic-selectable-spinner{position:fixed;bottom:0;top:0;left:0;right:0;z-index:1}.ionic-selectable-spinner-background{top:0;bottom:0;left:0;right:0;position:absolute;background-color:#000;opacity:.05}.ionic-selectable-spinner ion-spinner{position:absolute;top:50%;left:50%;z-index:10;margin-top:-14px;margin-left:-14px}.ionic-selectable-cover{left:0;top:0;margin:0;position:absolute;width:100%;height:100%;border:0;background:0 0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:0}.ionic-selectable-add-item-template{position:fixed;bottom:0;left:0;right:0;background-color:#fff}.ionic-selectable-add-item-template-inner{overflow-y:auto}.ionic-selectable-add-item-template-inner>ion-footer{bottom:0;position:absolute}.ionic-selectable-page-ios .ionic-selectable-message{padding:8px}.ionic-selectable-page-md .ionic-selectable-message{padding:8px 12px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:first-child{padding-right:8px}.ionic-selectable-page.ionic-selectable-page-can-clear.ionic-selectable-page-is-multiple .footer .col:last-child{padding-left:8px}.ionic-selectable-page.ionic-selectable-page-is-add-item-template-visible>.content>.scroll-content,.ionic-selectable-page.ionic-selectable-page-is-searching .scroll-content{overflow-y:hidden}"],"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":52,"character":17},"member":"None"},"providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":54,"character":13},"useExisting":{"__symbolic":"reference","name":"IonicSelectableComponent"},"multi":true}]}]}],"members":{"_cssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":60,"character":3},"arguments":["class.ionic-selectable"]}]}],"_isIos":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":62,"character":3},"arguments":["class.ionic-selectable-ios"]}]}],"_isMD":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":64,"character":3},"arguments":["class.ionic-selectable-md"]}]}],"_isMultipleCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":66,"character":3},"arguments":["class.ionic-selectable-is-multiple"]}]}],"_hasValueCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":70,"character":3},"arguments":["class.ionic-selectable-has-value"]}]}],"_hasPlaceholderCssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":74,"character":3},"arguments":["class.ionic-selectable-has-placeholder"]}]}],"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":182,"character":3}}]}],"itemsChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":184,"character":3}}]}],"isEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":194,"character":3},"arguments":["class.ionic-selectable-is-enabled"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":195,"character":3},"arguments":["isEnabled"]}]}],"isOkButtonEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":223,"character":3}}]}],"itemValueField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":234,"character":3}}]}],"itemTextField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":245,"character":3}}]}],"groupValueField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":257,"character":3}}]}],"groupTextField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":268,"character":3}}]}],"canSearch":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":278,"character":3}}]}],"isOnSearchEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":288,"character":3},"arguments":["isOnSearchEnabled"]}]}],"canClear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":303,"character":3},"arguments":["class.ionic-selectable-can-clear"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":304,"character":3},"arguments":["canClear"]}]}],"hasInfiniteScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":321,"character":3}}]}],"hasVirtualScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":332,"character":3}}]}],"virtualScrollApproxItemHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":342,"character":3}}]}],"searchPlaceholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":352,"character":3}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":362,"character":3}}]}],"isMultiple":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":372,"character":3},"arguments":["isMultiple"]}]}],"searchFailText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":388,"character":3}}]}],"clearButtonText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":398,"character":3}}]}],"addButtonText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":408,"character":3}}]}],"okButtonText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":418,"character":3}}]}],"closeButtonText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":429,"character":3}}]}],"shouldFocusSearchbar":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":439,"character":3}}]}],"headerColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":449,"character":3}}]}],"groupColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":459,"character":3}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":468,"character":3}}]}],"onSearch":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":478,"character":3}}]}],"onSearchFail":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":487,"character":3}}]}],"onSearchSuccess":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":496,"character":3}}]}],"onInfiniteScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":506,"character":3}}]}],"onOpen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":515,"character":3}}]}],"onClose":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":524,"character":3}}]}],"searchDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":548,"character":3}}]}],"disabledItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":558,"character":3}}]}],"shouldStoreItemValue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":569,"character":3}}]}],"canSaveItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":579,"character":3}}]}],"canDeleteItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":589,"character":3}}]}],"canAddItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":599,"character":3},"arguments":["canAddItem"]}]}],"onSaveItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":616,"character":3}}]}],"onDeleteItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":626,"character":3}}]}],"onAddItem":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":637,"character":3}}]}],"valueTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":640,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectableValueTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":640,"character":63}}]}]}],"itemTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":642,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectableItemTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":642,"character":62}}]}]}],"itemRightTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":644,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectableItemRightTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":644,"character":67}}]}]}],"titleTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":646,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectableTitleTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":646,"character":63}}]}]}],"placeholderTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":648,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectablePlaceholderTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":648,"character":69}}]}]}],"messageTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":650,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectableMessageTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":650,"character":65}}]}]}],"groupTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":652,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectableGroupTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":652,"character":63}}]}]}],"groupRightTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":654,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectableGroupRightTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":654,"character":68}}]}]}],"closeButtonTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":656,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectableCloseButtonTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":656,"character":69}}]}]}],"searchFailTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":658,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectableSearchFailTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":658,"character":68}}]}]}],"addItemTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":660,"character":3},"arguments":[{"__symbolic":"reference","name":"IonicSelectableAddItemTemplateDirective"},{"read":{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":660,"character":65}}]}]}],"virtualScrollHeaderFn":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":670,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":678,"character":5}}],null,null,null],"parameters":[{"__symbolic":"reference","module":"@ionic/angular","name":"ModalController","line":676,"character":30},{"__symbolic":"reference","module":"@ionic/angular","name":"Platform","line":677,"character":23},{"__symbolic":"reference","module":"@ionic/angular","name":"Item","line":678,"character":33},{"__symbolic":"reference","module":"@angular/core","name":"IterableDiffers","line":679,"character":30},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":680,"character":22},{"__symbolic":"reference","module":"@angular/core","name":"Renderer","line":681,"character":23}]}],"initFocus":[{"__symbolic":"method"}],"enableIonItem":[{"__symbolic":"method"}],"_isNullOrWhiteSpace":[{"__symbolic":"method"}],"_setHasSearchText":[{"__symbolic":"method"}],"_hasOnSearch":[{"__symbolic":"method"}],"_hasOnSaveItem":[{"__symbolic":"method"}],"_hasOnAddItem":[{"__symbolic":"method"}],"_hasOnDeleteItem":[{"__symbolic":"method"}],"_select":[{"__symbolic":"method"}],"_emitValueChange":[{"__symbolic":"method"}],"_emitSearch":[{"__symbolic":"method"}],"_formatItem":[{"__symbolic":"method"}],"_getLabelText":[{"__symbolic":"method"}],"_getItemValue":[{"__symbolic":"method"}],"_getStoredItemValue":[{"__symbolic":"method"}],"_onSearchbarClear":[{"__symbolic":"method"}],"_filterItems":[{"__symbolic":"method"}],"_isItemDisabled":[{"__symbolic":"method"}],"_isItemSelected":[{"__symbolic":"method"}],"_addSelectedItem":[{"__symbolic":"method"}],"_deleteSelectedItem":[{"__symbolic":"method"}],"_click":[{"__symbolic":"method"}],"_saveItem":[{"__symbolic":"method"}],"_deleteItemClick":[{"__symbolic":"method"}],"_addItemClick":[{"__symbolic":"method"}],"_positionAddItemTemplate":[{"__symbolic":"method"}],"_areGroupsEmpty":[{"__symbolic":"method"}],"_countFooterButtons":[{"__symbolic":"method"}],"_setItems":[{"__symbolic":"method"}],"_formatValueItem":[{"__symbolic":"method"}],"_getPropertyValue":[{"__symbolic":"method"}],"_setIonItemHasFocus":[{"__symbolic":"method"}],"_setIonItemHasValue":[{"__symbolic":"method"}],"_setHasPlaceholder":[{"__symbolic":"method"}],"_setIonItemCssClass":[{"__symbolic":"method"}],"_toggleAddItemTemplate":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"addItem":[{"__symbolic":"method"}],"deleteItem":[{"__symbolic":"method"}],"hasValue":[{"__symbolic":"method"}],"open":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}],"clear":[{"__symbolic":"method"}],"scrollToTop":[{"__symbolic":"method"}],"scrollToBottom":[{"__symbolic":"method"}],"startSearch":[{"__symbolic":"method"}],"endSearch":[{"__symbolic":"method"}],"enableInfiniteScroll":[{"__symbolic":"method"}],"disableInfiniteScroll":[{"__symbolic":"method"}],"endInfiniteScroll":[{"__symbolic":"method"}],"search":[{"__symbolic":"method"}],"showLoading":[{"__symbolic":"method"}],"hideLoading":[{"__symbolic":"method"}],"showAddItemTemplate":[{"__symbolic":"method"}],"hideAddItemTemplate":[{"__symbolic":"method"}]}}},"origins":{"IonicSelectableModule":"./src/app/components/ionic-selectable/ionic-selectable.module","IonicSelectableAddItemTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-add-item-template.directive","IonicSelectableCloseButtonTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-close-button-template.directive","IonicSelectableGroupRightTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-group-right-template.directive","IonicSelectableGroupTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-group-template.directive","IonicSelectableItemRightTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-item-right-template.directive","IonicSelectableItemTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-item-template.directive","IonicSelectableMessageTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-message-template.directive","IonicSelectablePageComponent":"./src/app/components/ionic-selectable/ionic-selectable-page.component","IonicSelectablePlaceholderTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-placeholder-template.directive","IonicSelectableSearchFailTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-search-fail-template.directive","IonicSelectableTitleTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-title-template.directive","IonicSelectableValueTemplateDirective":"./src/app/components/ionic-selectable/ionic-selectable-value-template.directive","IonicSelectableComponent":"./src/app/components/ionic-selectable/ionic-selectable.component"},"importAs":"ionic-selectable"} |
| { | ||
| "version": "4.0.0", | ||
| "version": "4.1.0", | ||
| "name": "ionic-selectable", | ||
@@ -25,3 +25,3 @@ "title": "Ionic Selectable", | ||
| "@angular/core": ">=6.1.1", | ||
| "@ionic/angular": ">=4.0.0-beta.11", | ||
| "@ionic/angular": ">=4.0.0-beta.12", | ||
| "rxjs": ">=6.2.2", | ||
@@ -28,0 +28,0 @@ "zone.js": ">=0.8.26" |
137
README.md
@@ -11,2 +11,4 @@ [npm-url]: https://npmjs.org/package/ionic-selectable | ||
| [Demo](https://stackblitz.com/edit/ionic-selectable-basic?file=pages/home/home.html) | [Getting started](#getting-started) | [Features](#features) | [FAQ](../../wiki/FAQ) | [Docs](../../wiki/Documentation) | [Share it](#Share-it) | [Ask on LinkendIn](https://www.linkedin.com/in/evgeniikoriakin/) | ||
| An Ionic component similar to [Ionic Select](https://ionicframework.com/docs/api/components/select/Select/), that allows to search items, including async search, infinite scrolling and more. | ||
@@ -20,6 +22,6 @@ | ||
| * [Supported Ionic versions](#supported-ionic-versions) | ||
| * [Features](#Features) | ||
| * [FAQ](../../wiki/FAQ) | ||
| * [Documentation](../../wiki/Documentation) | ||
| * [Docs](../../wiki/Documentation) | ||
| * [Theming](../../wiki/Theming) | ||
| * [Version comparison](#version-comparison) | ||
@@ -33,7 +35,3 @@ ## Supported Ionic versions | ||
| 1. Decide on the version you want to use [Free](https://www.npmjs.com/package/ionic-selectable) or [Pro](https://market.ionicframework.com/plugins/ionic-selectable-pro). See [Version comparison](#version-comparison) to help you choose. | ||
| 2. Install it. | ||
| `Ionic Selectable Free` | ||
| 1. Install it. | ||
| ``` | ||
@@ -47,13 +45,3 @@ // Ionic 3 | ||
| `Ionic Selectable Pro` | ||
| Purchase it from [Ionic Market](https://market.ionicframework.com/plugins/ionic-selectable-pro). | ||
| Copy `ionic-selectable-<version>.tgz` archive to the root of your project. Then `cd` to the project root and install the package. | ||
| ``` | ||
| npm install ionic-selectable-<version>.tgz | ||
| ``` | ||
| 3. Import it. | ||
| 2. Import it. | ||
| First, import `IonicSelectableModule` to your `app.module.ts` that is normally located in `src\app\app.module.ts`. | ||
@@ -65,5 +53,5 @@ | ||
| @NgModule({ | ||
| imports: [ | ||
| IonicSelectableModule | ||
| ] | ||
| imports: [ | ||
| IonicSelectableModule | ||
| ] | ||
| }) | ||
@@ -81,9 +69,9 @@ export class AppModule { } | ||
| @NgModule({ | ||
| declarations: [ | ||
| HomePage | ||
| ], | ||
| imports: [ | ||
| IonicPageModule.forChild(HomePage), | ||
| IonicSelectableModule | ||
| ] | ||
| declarations: [ | ||
| HomePage | ||
| ], | ||
| imports: [ | ||
| IonicPageModule.forChild(HomePage), | ||
| IonicSelectableModule | ||
| ] | ||
| }) | ||
@@ -94,19 +82,19 @@ export class HomePageModule { } | ||
| 4. Add it to template. | ||
| 3. Add it to template. | ||
| ``` | ||
| <ion-item> | ||
| <ion-label>Port</ion-label> | ||
| <ionic-selectable | ||
| item-content // You don't need it if you use Ionic 4. | ||
| [(ngModel)]="port" | ||
| [items]="ports" | ||
| itemValueField="id" | ||
| itemTextField="name" | ||
| [canSearch]="true" | ||
| (onChange)="portChange($event)"> | ||
| </ionic-selectable> | ||
| <ion-label>Port</ion-label> | ||
| <ionic-selectable | ||
| item-content // You don't need it if you use Ionic 4. | ||
| [(ngModel)]="port" | ||
| [items]="ports" | ||
| itemValueField="id" | ||
| itemTextField="name" | ||
| [canSearch]="true" | ||
| (onChange)="portChange($event)"> | ||
| </ionic-selectable> | ||
| </ion-item> | ||
| ``` | ||
| 5. Configure it. | ||
| 4. Configure it. | ||
| ``` | ||
@@ -116,4 +104,4 @@ import { IonicSelectableComponent } from 'ionic-selectable'; | ||
| class Port { | ||
| public id: number; | ||
| public name: string; | ||
| public id: number; | ||
| public name: string; | ||
| } | ||
@@ -123,45 +111,42 @@ | ||
| export class HomePage { | ||
| ports: Port[]; | ||
| port: Port; | ||
| ports: Port[]; | ||
| port: Port; | ||
| constructor() { | ||
| this.ports = [ | ||
| { id: 1, name: 'Tokai' }, | ||
| { id: 2, name: 'Vladivostok' }, | ||
| { id: 3, name: 'Navlakhi' } | ||
| ]; | ||
| } | ||
| constructor() { | ||
| this.ports = [ | ||
| { id: 1, name: 'Tokai' }, | ||
| { id: 2, name: 'Vladivostok' }, | ||
| { id: 3, name: 'Navlakhi' } | ||
| ]; | ||
| } | ||
| portChange(event: { | ||
| component: IonicSelectableComponent, | ||
| value: any | ||
| }) { | ||
| console.log('port:', event.value); | ||
| } | ||
| portChange(event: { | ||
| component: IonicSelectableComponent, | ||
| value: any | ||
| }) { | ||
| console.log('port:', event.value); | ||
| } | ||
| } | ||
| ``` | ||
| 6. Enjoy it 😉 | ||
| 7. Check out live demos for [Ionic Selectable Free](https://stackblitz.com/@eakoriakin) and [Ionic Selectable Pro](https://ionic-selectable.herokuapp.com) to see what it is capable of. | ||
| 5. Enjoy it 😉 | ||
| 6. Check out [live demos](https://stackblitz.com/@eakoriakin) to see what it is capable of. | ||
| Also, explore the [docs](../../wiki/Documentation) and [FAQ](../../wiki/FAQ) to learn more about its features. | ||
| 7. Have a question? Ask me on [LinkendIn](https://www.linkedin.com/in/evgeniikoriakin/)! | ||
| ## Version comparison | ||
| ## Features | ||
| * [Single selection](https://stackblitz.com/edit/ionic-selectable-basic?file=pages/home/home.html) | ||
| * [Multiple selection](../../wiki/Documentation#ismultiple) | ||
| * [Search items](https://stackblitz.com/edit/ionic-selectable-basic?file=pages/home/home.html) | ||
| * [Search items asynchronously](https://stackblitz.com/edit/ionic-selectable-on-search?file=pages/home/home.html) | ||
| * [Search by several item fields](https://stackblitz.com/edit/ionic-selectable-on-search?file=pages/home/home.html) | ||
| * [Forms](https://stackblitz.com/edit/ionic-selectable-form-control?file=pages/home/home.html) | ||
| * [InfiniteScroll](https://stackblitz.com/edit/ionic-selectable-infinite-scroll?file=pages/home/home.html) | ||
| * [VirtualScroll](https://stackblitz.com/edit/ionic-selectable-virtual-scroll?file=pages/home/home.html) | ||
| * [Templates](../../wiki/Documentation#templates) | ||
| * [Grouping items](../..//wiki/Documentation#grouping) | ||
| * [Editing, adding and deleting items](../../wiki/Documentation#editing) | ||
| * [Disabling items](../../wiki/Documentation#disableditems) | ||
| | Ionic Selectable Free | Ionic Selectable Pro | | ||
| | - | - | | ||
| | [Single item selection](https://stackblitz.com/edit/ionic-selectable-basic?file=pages/home/home.html) | [Single item selection](https://stackblitz.com/edit/ionic-selectable-basic?file=pages/home/home.html) | | ||
| | [Multiple item selection](../../wiki/Documentation#ismultiple) | [Multiple item selection](../../wiki/Documentation#ismultiple) | | ||
| | [Search items](https://stackblitz.com/edit/ionic-selectable-basic?file=pages/home/home.html) | [Search items](https://stackblitz.com/edit/ionic-selectable-basic?file=pages/home/home.html) | | ||
| | [Search items asynchronously](https://stackblitz.com/edit/ionic-selectable-on-search?file=pages/home/home.html) | [Search items asynchronously](https://stackblitz.com/edit/ionic-selectable-on-search?file=pages/home/home.html) | | ||
| | [Angular Forms integration](https://stackblitz.com/edit/ionic-selectable-form-control?file=pages/home/home.html) | [Angular Forms integration](https://stackblitz.com/edit/ionic-selectable-form-control?file=pages/home/home.html) | | ||
| | [Validation](../../wiki/Documentation#validation) | [Validation](../../wiki/Documentation#validation) | | ||
| | [Ionic InfiniteScroll](https://stackblitz.com/edit/ionic-selectable-infinite-scroll?file=pages/home/home.html) | [Ionic InfiniteScroll](https://stackblitz.com/edit/ionic-selectable-infinite-scroll?file=pages/home/home.html) | | ||
| | [Ionic VirtualScroll](https://stackblitz.com/edit/ionic-selectable-virtual-scroll?file=pages/home/home.html) | [Ionic VirtualScroll](https://stackblitz.com/edit/ionic-selectable-virtual-scroll?file=pages/home/home.html) | | ||
| | [Search by several item fields](https://stackblitz.com/edit/ionic-selectable-on-search?file=pages/home/home.html) | [Search by several item fields](https://stackblitz.com/edit/ionic-selectable-on-search?file=pages/home/home.html) | | ||
| | | [Templates](../../wiki/Documentation#templates) | | ||
| | | [Grouping items](../..//wiki/Documentation#grouping) | | ||
| | | [Editing, adding and deleting items](../../wiki/Documentation#editing) | | ||
| | | [Disabling items](../../wiki/Documentation#disableditems) | | ||
| ## Share it | ||
| If you find this component useful, please star the [repo](https://github.com/eakoriakin/ionic-selectable) to let others know that it's reliable. Also, share it with friends and colleagues who might find it useful as well. Thank you 😄 |
@@ -1,2 +0,2 @@ | ||
| import { AfterViewInit } from '@angular/core'; | ||
| import { AfterViewInit, ElementRef } from '@angular/core'; | ||
| import { Content, InfiniteScroll, NavParams } from '@ionic/angular'; | ||
@@ -6,3 +6,5 @@ import { IonicSelectableComponent } from './ionic-selectable.component'; | ||
| private navParams; | ||
| _element: ElementRef; | ||
| _content: Content; | ||
| _header: HTMLElement; | ||
| selectComponent: IonicSelectableComponent; | ||
@@ -17,3 +19,5 @@ private _searchbarComponent; | ||
| private _isMD; | ||
| constructor(navParams: NavParams); | ||
| private readonly _isAddItemTemplateVisibleCssClass; | ||
| onResize(): void; | ||
| constructor(navParams: NavParams, _element: ElementRef); | ||
| ngAfterViewInit(): void; | ||
@@ -20,0 +24,0 @@ private _setItemsToConfirm; |
@@ -1,2 +0,2 @@ | ||
| import { DoCheck, ElementRef, EventEmitter, IterableDiffers, OnInit, Renderer } from '@angular/core'; | ||
| import { DoCheck, ElementRef, EventEmitter, IterableDiffers, OnInit, Renderer, TemplateRef } from '@angular/core'; | ||
| import { ControlValueAccessor } from '@angular/forms'; | ||
@@ -27,2 +27,5 @@ import { Item, ModalController, Platform } from '@ionic/angular'; | ||
| private _isMultiple; | ||
| private _canAddItem; | ||
| private _addItemObservable; | ||
| private _deleteItemObservable; | ||
| private onItemsChange; | ||
@@ -40,5 +43,9 @@ private _ionItemElement; | ||
| _filteredGroups: any[]; | ||
| _hasGroups: boolean; | ||
| _isSearching: boolean; | ||
| _labelText: string; | ||
| _hasPlaceholder: boolean; | ||
| _isAddItemTemplateVisible: boolean; | ||
| _isFooterVisible: boolean; | ||
| _itemToAdd: any; | ||
| _footerButtonsCount: number; | ||
@@ -126,2 +133,21 @@ /** | ||
| /** | ||
| * | ||
| * Group property to use as a unique identifier to group items, e.g. `'country.id'`. | ||
| * **Note**: `items` should be an object array. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#groupvaluefield). | ||
| * | ||
| * @default null | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| groupValueField: string; | ||
| /** | ||
| * Group property to display, e.g. `'country.name'`. | ||
| * **Note**: `items` should be an object array. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#grouptextfield). | ||
| * | ||
| * @default null | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| groupTextField: string; | ||
| /** | ||
| * Determines whether to show Searchbar. | ||
@@ -217,2 +243,10 @@ * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#cansearch). | ||
| /** | ||
| * Add button text. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#addbuttontext). | ||
| * | ||
| * @default 'Add' | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| addButtonText: string; | ||
| /** | ||
| * OK button text. | ||
@@ -251,2 +285,10 @@ * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#okbuttontext). | ||
| /** | ||
| * Group color. [Ionic colors](https://ionicframework.com/docs/theming/theming-your-app/) are supported. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#groupcolor). | ||
| * | ||
| * @default null | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| groupColor: string; | ||
| /** | ||
| * Fires when the user has selected item/s. | ||
@@ -273,2 +315,22 @@ * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#onchange). | ||
| /** | ||
| * Fires when no items have been found. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#onsearchfail). | ||
| * | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| onSearchFail: EventEmitter<{ | ||
| component: IonicSelectableComponent; | ||
| text: string; | ||
| }>; | ||
| /** | ||
| * Fires when some items have been found. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#onsearchsuccess). | ||
| * | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| onSearchSuccess: EventEmitter<{ | ||
| component: IonicSelectableComponent; | ||
| text: string; | ||
| }>; | ||
| /** | ||
| * Fires when the user has scrolled to the end of the list. | ||
@@ -322,2 +384,10 @@ * **Note**: `hasInfiniteScroll` has to be enabled. | ||
| /** | ||
| * A list of items to disable. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#disableditems). | ||
| * | ||
| * @default [] | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| disabledItems: any[]; | ||
| /** | ||
| * Determines whether item value only should be stored in `ngModel`, not the entire item. | ||
@@ -331,2 +401,79 @@ * **Note**: Item value is defined by `itemValueField`. | ||
| shouldStoreItemValue: boolean; | ||
| /** | ||
| * Determines whether to allow editing items. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#cansaveitem). | ||
| * | ||
| * @default false | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| canSaveItem: boolean; | ||
| /** | ||
| * Determines whether to allow deleting items. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#candeleteitem). | ||
| * | ||
| * @default false | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| canDeleteItem: boolean; | ||
| /** | ||
| * Determines whether to allow adding items. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#canadditem). | ||
| * | ||
| * @default false | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| canAddItem: boolean; | ||
| /** | ||
| * Fires when the user has clicked Edit item button. | ||
| * When the button has been clicked `ionicSelectableAddItemTemplate` will be shown. Use the template to create a form to edit item. | ||
| * **Note**: `canSaveItem` has to be enabled. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#onsaveitem). | ||
| * | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| onSaveItem: EventEmitter<{ | ||
| component: IonicSelectableComponent; | ||
| item: any; | ||
| }>; | ||
| /** | ||
| * Fires when the user has clicked Delete item button. | ||
| * **Note**: `canDeleteItem` has to be enabled. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#ondeleteitem). | ||
| * | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| onDeleteItem: EventEmitter<{ | ||
| component: IonicSelectableComponent; | ||
| item: any; | ||
| }>; | ||
| /** | ||
| * Fires when the user has clicked Add item button. | ||
| * When the button has been clicked `ionicSelectableAddItemTemplate` will be shown. Use the template to create a form to add item. | ||
| * **Note**: `canAddItem` has to be enabled. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#onadditem). | ||
| * | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| onAddItem: EventEmitter<{ | ||
| component: IonicSelectableComponent; | ||
| }>; | ||
| valueTemplate: TemplateRef<any>; | ||
| itemTemplate: TemplateRef<any>; | ||
| itemRightTemplate: TemplateRef<any>; | ||
| titleTemplate: TemplateRef<any>; | ||
| placeholderTemplate: TemplateRef<any>; | ||
| messageTemplate: TemplateRef<any>; | ||
| groupTemplate: TemplateRef<any>; | ||
| groupRightTemplate: TemplateRef<any>; | ||
| closeButtonTemplate: TemplateRef<any>; | ||
| searchFailTemplate: TemplateRef<any>; | ||
| addItemTemplate: TemplateRef<any>; | ||
| _addItemTemplateFooterHeight: string; | ||
| /** | ||
| * See Ionic VirtualScroll [headerFn](https://ionicframework.com/docs/api/components/virtual-scroll/VirtualScroll/). | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#virtualscrollheaderfn). | ||
| * | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| virtualScrollHeaderFn: () => any; | ||
| constructor(_modalController: ModalController, _platform: Platform, ionItem: Item, _iterableDiffers: IterableDiffers, _element: ElementRef, _renderer: Renderer); | ||
@@ -338,2 +485,5 @@ initFocus(): void; | ||
| _hasOnSearch(): boolean; | ||
| _hasOnSaveItem(): boolean; | ||
| _hasOnAddItem(): boolean; | ||
| _hasOnDeleteItem(): boolean; | ||
| _select(selectedItem: any): void; | ||
@@ -348,2 +498,3 @@ _emitValueChange(): void; | ||
| _filterItems(): void; | ||
| _isItemDisabled(item: any): boolean; | ||
| _isItemSelected(item: any): boolean; | ||
@@ -353,5 +504,11 @@ _addSelectedItem(item: any): void; | ||
| _click(): void; | ||
| _saveItem(event: Event, item: any): void; | ||
| _deleteItemClick(event: Event, item: any): void; | ||
| _addItemClick(): void; | ||
| _positionAddItemTemplate(): void; | ||
| private _areGroupsEmpty; | ||
| private _countFooterButtons; | ||
| private _setItems; | ||
| private _formatValueItem; | ||
| private _getPropertyValue; | ||
| private _setIonItemHasFocus; | ||
@@ -363,5 +520,6 @@ private _setIonItemHasValue; | ||
| private _setIonItemCssClass; | ||
| private _toggleAddItemTemplate; | ||
| writeValue(value: any): void; | ||
| registerOnChange(fn: any): void; | ||
| registerOnTouched(fn: () => void): void; | ||
| registerOnChange(method: any): void; | ||
| registerOnTouched(method: () => void): void; | ||
| setDisabledState(isDisabled: boolean): void; | ||
@@ -371,2 +529,22 @@ ngOnInit(): void; | ||
| /** | ||
| * Adds item. | ||
| * **Note**: If you want an item to be added to the original array as well use two-way data binding syntax on `[(items)]` field. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#additem). | ||
| * | ||
| * @param item Item to add. | ||
| * @returns Promise that resolves when item has been added. | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| addItem(item: any): Promise<any>; | ||
| /** | ||
| * Deletes item. | ||
| * **Note**: If you want an item to be deleted from the original array as well use two-way data binding syntax on `[(items)]` field. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#deleteitem). | ||
| * | ||
| * @param item Item to delete. | ||
| * @returns Promise that resolves when item has been deleted. | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| deleteItem(item: any): Promise<any>; | ||
| /** | ||
| * Determines whether any item has been selected. | ||
@@ -478,2 +656,16 @@ * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#hasvalue). | ||
| hideLoading(): void; | ||
| /** | ||
| * Shows `ionicSelectableAddItemTemplate`. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#showadditemtemplate). | ||
| * | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| showAddItemTemplate(): void; | ||
| /** | ||
| * Hides `ionicSelectableAddItemTemplate`. | ||
| * See more on [GitHub](https://github.com/eakoriakin/ionic-selectable/wiki/Documentation#hideadditemtemplate). | ||
| * | ||
| * @memberof IonicSelectableComponent | ||
| */ | ||
| hideAddItemTemplate(): void; | ||
| } |
@@ -0,4 +1,15 @@ | ||
| export { IonicSelectableAddItemTemplateDirective } from './ionic-selectable-add-item-template.directive'; | ||
| export { IonicSelectableCloseButtonTemplateDirective } from './ionic-selectable-close-button-template.directive'; | ||
| export { IonicSelectableGroupRightTemplateDirective } from './ionic-selectable-group-right-template.directive'; | ||
| export { IonicSelectableGroupTemplateDirective } from './ionic-selectable-group-template.directive'; | ||
| export { IonicSelectableItemRightTemplateDirective } from './ionic-selectable-item-right-template.directive'; | ||
| export { IonicSelectableItemTemplateDirective } from './ionic-selectable-item-template.directive'; | ||
| export { IonicSelectableMessageTemplateDirective } from './ionic-selectable-message-template.directive'; | ||
| export { IonicSelectablePageComponent } from './ionic-selectable-page.component'; | ||
| export { IonicSelectablePlaceholderTemplateDirective } from './ionic-selectable-placeholder-template.directive'; | ||
| export { IonicSelectableSearchFailTemplateDirective } from './ionic-selectable-search-fail-template.directive'; | ||
| export { IonicSelectableTitleTemplateDirective } from './ionic-selectable-title-template.directive'; | ||
| export { IonicSelectableValueTemplateDirective } from './ionic-selectable-value-template.directive'; | ||
| export { IonicSelectableComponent } from './ionic-selectable.component'; | ||
| export declare class IonicSelectableModule { | ||
| } |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Fixed alerts
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Unidentified License
License(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by11.43%
1842103
- Number of package files
- increased by61.11%
29
- Number of low license alerts
- decreased by-100%
0
- License quality
- increased by25%
100
- Lines of code
- increased by47.6%
890
Worsened metrics
- Number of lines in readme file
- decreased by-9.43%
144
- Number of low supply chain risk alerts
- increased by50%
9
No dependency changes