carbon-components-angular 5.72.1 → 5.72.2

package/docs/storybook/3224.14e2c79a.iframe.bundle.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[3224],{"./src/dropdown/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{jq:()=>AbstractDropdownView,Lt:()=>Dropdown,kW:()=>DropdownModule,Vn:()=>DropdownService});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),fesm2020_forms=__webpack_require__("./node_modules/@angular/forms/fesm2020/forms.mjs"),Subscription=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),of=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/observable/of.js"),isUndefined=__webpack_require__("./node_modules/lodash-es/isUndefined.js"),isNull=__webpack_require__("./node_modules/lodash-es/isNull.js");let AbstractDropdownView=class AbstractDropdownView{constructor(){this.type="single",this.size="md"}set items(value){}get items(){}getNextItem(){}hasNextElement(){}getNextElement(){}getPrevItem(){}hasPrevElement(){}getPrevElement(){}getSelected(){}getCurrentItem(){}getCurrentElement(){}getListItems(){}propagateSelected(value){}filterBy(value){}initFocus(){}onItemsReady(subcription){}reorderSelected(moveFocus){}};AbstractDropdownView.propDecorators={items:[{type:core.Input}],select:[{type:core.Output}],blurIntent:[{type:core.Output}]},AbstractDropdownView=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsAbstractDropdownView], [ibmAbstractDropdownView]"})],AbstractDropdownView);var i18n=__webpack_require__("./src/i18n/index.ts"),placeholder=__webpack_require__("./src/placeholder/index.ts"),utils_position=__webpack_require__("./node_modules/@carbon/utils-position/index.js"),utils=__webpack_require__("./src/utils/index.ts");const defaultOffset={top:0,left:0};let DropdownService=class DropdownService{constructor(placeholderService,animationFrameService){this.placeholderService=placeholderService,this.animationFrameService=animationFrameService,this.animationFrameSubscription=new Subscription.w0,this._offset=defaultOffset}set offset(value){this._offset=Object.assign({},defaultOffset,value)}get offset(){return this._offset}appendToBody(parentRef,menuRef,classList){menuRef.style.display="block";const dropdownWrapper=document.createElement("div");return dropdownWrapper.className=`dropdown ${classList}`,dropdownWrapper.style.width=parentRef.offsetWidth+"px",dropdownWrapper.style.position="absolute",dropdownWrapper.appendChild(menuRef),this.placeholderService.hasPlaceholderRef()?this.placeholderService.appendElement(dropdownWrapper):document.body.appendChild(dropdownWrapper),this.menuInstance=dropdownWrapper,this.animationFrameSubscription=this.animationFrameService.tick.subscribe((()=>{this.positionDropdown(parentRef,dropdownWrapper)})),this.positionDropdown(parentRef,dropdownWrapper),dropdownWrapper}appendToDropdown(hostRef){if(!this.menuInstance)return;const instance=this.menuInstance,menu=instance.firstElementChild;return this.menuInstance=null,menu.style.display="none",hostRef.appendChild(menu),this.animationFrameSubscription.unsubscribe(),this.placeholderService.hasPlaceholderRef()&&this.placeholderService.hasElement(instance)?this.placeholderService.removeElement(instance):document.body.contains(instance)&&document.body.removeChild(instance),instance}updatePosition(parentRef){this.positionDropdown(parentRef,this.menuInstance)}ngOnDestroy(){this.animationFrameSubscription.unsubscribe()}positionDropdown(parentRef,menuRef){if(!menuRef)return;let leftOffset=0;const boxMenu=menuRef.querySelector(".cds--list-box__menu");if(boxMenu)if(parentRef.getBoundingClientRect().left!==boxMenu.getBoundingClientRect().left){parentRef.getBoundingClientRect().left-boxMenu.getBoundingClientRect().left+boxMenu.getBoundingClientRect().right>(window.innerWidth||document.documentElement.clientWidth)&&(leftOffset=parentRef.offsetWidth-boxMenu.offsetWidth)}else boxMenu.getBoundingClientRect().right>(window.innerWidth||document.documentElement.clientWidth)&&(leftOffset=parentRef.offsetWidth-boxMenu.offsetWidth);const closestMenuWithPos=(0,utils._K)("position",["relative","fixed","absolute"],menuRef.parentElement),topPos=closestMenuWithPos?-1*closestMenuWithPos.getBoundingClientRect().top:this.offset.top,leftPos=closestMenuWithPos?-1*closestMenuWithPos.getBoundingClientRect().left:this.offset.left+leftOffset;let pos=utils_position.FK.findAbsolute(parentRef,menuRef,"bottom");pos=utils_position.FK.addOffset(pos,topPos,leftPos),utils_position.FK.setElement(menuRef,pos)}};DropdownService.ctorParameters=()=>[{type:placeholder.Q_},{type:utils.NV}],DropdownService=(0,tslib_es6.gn)([(0,core.Injectable)()],DropdownService);let Dropdown=class Dropdown{constructor(elementRef,i18n,dropdownService,elementService){this.elementRef=elementRef,this.i18n=i18n,this.dropdownService=dropdownService,this.elementService=elementService,this.id="dropdown-"+Dropdown.dropdownCount++,this.hideLabel=!1,this.placeholder="",this.displayValue="",this.clearText=this.i18n.get().DROPDOWN.CLEAR,this.size="md",this.type="single",this.theme="dark",this.disabled=!1,this.readonly=!1,this.skeleton=!1,this.inline=!1,this.disableArrowKeys=!1,this.invalid=!1,this.warn=!1,this.appendInline=null,this.selectionFeedback="top-after-reopen",this.menuButtonLabel=this.i18n.get().DROPDOWN.OPEN,this.selectedLabel=this.i18n.get().DROPDOWN.SELECTED,this.allowNullValues=!1,this.selected=new core.EventEmitter,this.onClose=new core.EventEmitter,this.close=new core.EventEmitter,this.hostClass=!0,this.hostWrapperClass=!0,this.fluid=!1,this.menuIsClosed=!0,this._dropUp=!1,this.noop=this._noop.bind(this),this.outsideClick=this._outsideClick.bind(this),this.outsideKey=this._outsideKey.bind(this),this.keyboardNav=this._keyboardNav.bind(this),this.visibilitySubscription=new Subscription.w0,this.onTouchedCallback=this._noop,this._isFocused=!1,this._writtenValue=[],this._isUsingNgControl=!1,this.propagateChange=_=>{}}get fluidInvalidClass(){return this.invalid&&this.fluid}get fluidFocusClass(){return this.fluid&&this._isFocused&&this.menuIsClosed}get writtenValue(){return this._writtenValue}set writtenValue(val){val&&0===val.length&&this.clearSelected(),this._writtenValue=val}get hasDecorator(){return!!this.decorator}ngOnInit(){this.view&&(this.view.type=this.type)}ngAfterContentInit(){if(!this.view)return;this.view.type=this.type,this.view.size=this.size;const isUpdate=event=>event&&event.isUpdate;this.selectionSubscription=this.view.select.subscribe((event=>{if("single"!==this.type||isUpdate(event)||Array.isArray(event)||(this.closeMenu(),event.item&&event.item.selected?this.itemValueKey?this._propagateChange(event.item[this.itemValueKey]):this._propagateChange(event.item):this._propagateChange(null)),"multi"===this.type&&!isUpdate(event))if(this.itemValueKey&&this.view.getSelected()){const values=this.view.getSelected().map((item=>item[this.itemValueKey]));this._propagateChange(values)}else this._propagateChange(this.view.getSelected());isUpdate(event)?this._isUsingNgControl&&this.writeValue(this.writtenValue):(this.checkForReorder(),this.selected.emit(event))}))}ngAfterViewInit(){null===this.appendInline&&(0,utils.OQ)(this.elementRef.nativeElement)?this.appendInline=!1:null===this.appendInline&&(this.appendInline=!0),this.checkForReorder()}ngOnDestroy(){this.appendInline||this._appendToDropdown(),this.visibilitySubscription?.unsubscribe(),this.selectionSubscription?.unsubscribe()}writeValue(value){this.writtenValue=value,this.view.onItemsReady((()=>{if((0,isUndefined.Z)(value)||(0,isNull.Z)(value)&&!this.allowNullValues)this.view.propagateSelected([value]);else if("single"===this.type)if(this.itemValueKey){const newValue=Object.assign({},this.view.getListItems().find((item=>item[this.itemValueKey]===value)));newValue.selected=!0,this.view.propagateSelected([newValue])}else this.view.propagateSelected([value]);else if(this.itemValueKey){let newValues=[];for(const v of value)for(const item of this.view.getListItems())item[this.itemValueKey]===v&&newValues.push(Object.assign({},item,{selected:!0}));this.view.propagateSelected(newValues)}else this.view.propagateSelected(value||[value]);this.checkForReorder()}))}onBlur(){this.onTouchedCallback()}registerOnChange(fn){this._isUsingNgControl=!0,this.propagateChange=fn}registerOnTouched(fn){this.onTouchedCallback=fn}_propagateChange(value){this.writtenValue=value,this.propagateChange(value)}setDisabledState(isDisabled){this.disabled=isDisabled}onKeyDown(event){if(!this.readonly){if("Escape"!==event.key||this.menuIsClosed||event.stopImmediatePropagation(),"Escape"===event.key)event.preventDefault(),this.closeMenu(),this.dropdownButton.nativeElement.focus();else if(this.menuIsClosed&&(" "===event.key||"ArrowDown"===event.key||"ArrowUp"===event.key)){if(this.disableArrowKeys&&("ArrowDown"===event.key||"ArrowUp"===event.key))return;event.preventDefault(),this.openMenu()}!this.menuIsClosed&&"Tab"===event.key&&this.dropdownMenu.nativeElement.contains(event.target)&&this.closeMenu(),!this.menuIsClosed&&"Tab"===event.key&&event.shiftKey&&this.closeMenu(),"multi"!==this.type&&this.menuIsClosed&&this.closedDropdownNavigation(event)}}closedDropdownNavigation(event){if("ArrowDown"===event.key){event.preventDefault(),this.view.getCurrentItem().selected=!1;let item=this.view.getNextItem();item&&(item.selected=!0)}else if("ArrowUp"===event.key){event.preventDefault(),this.view.getCurrentItem().selected=!1;let item=this.view.getPrevItem();item&&(item.selected=!0)}}getDisplayStringValue(){if(!this.view||this.skeleton)return;let selected=this.view.getSelected();return!selected.length||this.displayValue&&this.isRenderString()?selected.length&&this.isRenderString()?(0,of.of)(this.displayValue):(0,of.of)(this.placeholder):"multi"===this.type?(0,of.of)(this.placeholder):(0,of.of)(selected[0].content)}isRenderString(){return"string"==typeof this.displayValue}getRenderTemplateContext(){if(!this.view)return;let selected=this.view.getSelected();return"multi"===this.type?{items:selected}:selected&&selected.length>0?{item:selected[0]}:{}}getSelectedCount(){if(this.view.getSelected())return this.view.getSelected().length}clearSelected(){if(!this.disabled&&0!==this.getSelectedCount()){for(const item of this.view.getListItems())item.selected=!1;this.selected.emit([]),this._propagateChange([])}}valueSelected(){return!!this.view.getSelected()}_noop(){}_outsideClick(event){this.elementRef.nativeElement.contains(event.target)||this.dropdownMenu.nativeElement.contains(event.target)||this.closeMenu()}_outsideKey(event){!this.menuIsClosed&&"Tab"===event.key&&this.dropdownMenu.nativeElement.contains(event.target)&&this.closeMenu()}_keyboardNav(event){"Escape"!==event.key||this.menuIsClosed||event.stopImmediatePropagation(),"Escape"===event.key?(event.preventDefault(),this.closeMenu(),this.dropdownButton.nativeElement.focus()):this.menuIsClosed||"Tab"!==event.key||(this.dropdownButton.nativeElement.focus(),this.dropdownButton.nativeElement.dispatchEvent(new KeyboardEvent("keydown",{bubbles:!0,cancelable:!0,key:"Tab"})),this.closeMenu())}_appendToDropdown(){this.dropdownService.appendToDropdown(this.elementRef.nativeElement),this.dropdownMenu.nativeElement.removeEventListener("keydown",this.keyboardNav,!0)}_appendToBody(){const lightClass="light"===this.theme?" cds--list-box--light":"",expandedClass=this.menuIsClosed?"":" cds--list-box--expanded";this.dropdownService.appendToBody(this.dropdownButton.nativeElement,this.dropdownMenu.nativeElement,`${this.elementRef.nativeElement.className}${lightClass}${expandedClass}`),this.dropdownMenu.nativeElement.addEventListener("keydown",this.keyboardNav,!0)}_shouldDropUp(){const menu=this.dropdownMenu&&this.dropdownMenu.nativeElement.querySelector(".cds--list-box__menu"),menuRect=menu&&menu.getBoundingClientRect();if(menu&&menuRect){return(0,utils.O3)(menu).reduce(((shouldDropUp,parent)=>{const parentRect=parent.getBoundingClientRect(),isBelowParent=!(menuRect.bottom<=parentRect.bottom);return shouldDropUp||isBelowParent}),!1)}return!1}openMenu(){if(0!==this.view.getListItems().length){if(this._dropUp=!1,this.menuIsClosed=!1,!this.appendInline){const target=this.dropdownButton.nativeElement,parent=this.elementRef.nativeElement;this.visibilitySubscription=this.elementService.visibility(target,parent).subscribe((value=>{value.visible||this.closeMenu()})),this._appendToBody()}setTimeout((()=>{null!==this.dropUp&&void 0!==this.dropUp||(this._dropUp=this._shouldDropUp())}),0),document.body.firstElementChild.addEventListener("click",this.noop,!0),document.body.firstElementChild.addEventListener("keydown",this.noop,!0),document.addEventListener("click",this.outsideClick,!0),document.addEventListener("keydown",this.outsideKey,!0),setTimeout((()=>this.view.initFocus()),0)}}closeMenu(){this.menuIsClosed||(this.menuIsClosed=!0,this.checkForReorder(),this.onClose.emit(),this.close.emit(),this.dropdownButton.nativeElement.focus(),this.view.disableScroll&&this.view.disableScroll(),this.appendInline||(this.visibilitySubscription.unsubscribe(),this._appendToDropdown()),document.body.firstElementChild.removeEventListener("click",this.noop,!0),document.body.firstElementChild.removeEventListener("keydown",this.noop,!0),document.removeEventListener("click",this.outsideClick,!0),document.removeEventListener("keydown",this.outsideKey,!0))}toggleMenu(){this.menuIsClosed?this.openMenu():this.closeMenu()}isTemplate(value){return value instanceof core.TemplateRef}handleFocus(event){this._isFocused="focus"===event.type,"blur"===event.type&&this.onBlur()}checkForReorder(){const topAfterReopen=this.menuIsClosed&&"top-after-reopen"===this.selectionFeedback;"multi"!==this.type||!topAfterReopen&&"top"!==this.selectionFeedback||this.view.reorderSelected()}};Dropdown.dropdownCount=0,Dropdown.ctorParameters=()=>[{type:core.ElementRef},{type:i18n.oc},{type:DropdownService},{type:utils.d2}],Dropdown.propDecorators={fluidInvalidClass:[{type:core.HostBinding,args:["class.cds--list-box__wrapper--fluid--invalid"]}],fluidFocusClass:[{type:core.HostBinding,args:["class.cds--list-box__wrapper--fluid--focus"]}],id:[{type:core.Input}],label:[{type:core.Input}],hideLabel:[{type:core.Input}],helperText:[{type:core.Input}],decorator:[{type:core.Input}],placeholder:[{type:core.Input}],displayValue:[{type:core.Input}],clearText:[{type:core.Input}],size:[{type:core.Input}],type:[{type:core.Input}],theme:[{type:core.Input}],disabled:[{type:core.Input}],readonly:[{type:core.Input}],skeleton:[{type:core.Input}],inline:[{type:core.Input}],disableArrowKeys:[{type:core.Input}],invalid:[{type:core.Input}],invalidText:[{type:core.Input}],warn:[{type:core.Input}],warnText:[{type:core.Input}],appendInline:[{type:core.Input}],scrollableContainer:[{type:core.Input}],itemValueKey:[{type:core.Input}],selectionFeedback:[{type:core.Input}],menuButtonLabel:[{type:core.Input}],selectedLabel:[{type:core.Input}],dropUp:[{type:core.Input}],allowNullValues:[{type:core.Input}],selected:[{type:core.Output}],onClose:[{type:core.Output}],close:[{type:core.Output}],view:[{type:core.ContentChild,args:[AbstractDropdownView,{static:!0}]}],dropdownButton:[{type:core.ViewChild,args:["dropdownButton",{static:!0}]}],dropdownMenu:[{type:core.ViewChild,args:["dropdownMenu",{static:!0}]}],hostClass:[{type:core.HostBinding,args:["class.cds--dropdown__wrapper"]}],hostWrapperClass:[{type:core.HostBinding,args:["class.cds--list-box__wrapper"]}],hasDecorator:[{type:core.HostBinding,args:["class.cds--list-box__wrapper--decorator"]}],fluid:[{type:core.HostBinding,args:["class.cds--list-box__wrapper--fluid"]},{type:core.Input}],onKeyDown:[{type:core.HostListener,args:["keydown",["$event"]]}]},Dropdown=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-dropdown, ibm-dropdown",template:'\n\t<label\n\t\t*ngIf="label && !skeleton"\n\t\t[for]="id"\n\t\tclass="cds--label"\n\t\t[ngClass]="{\n\t\t\t\'cds--label--disabled\': disabled,\n\t\t\t\'cds--visually-hidden\': hideLabel\n\t\t}">\n\t\t<ng-container *ngIf="!isTemplate(label)">{{label}}</ng-container>\n\t\t<ng-template *ngIf="isTemplate(label)" [ngTemplateOutlet]="label"></ng-template>\n\t</label>\n\t<div\n\t\tclass="cds--list-box"\n\t\t[ngClass]="{\n\t\t\t\'cds--dropdown\': type !== \'multi\' && !(skeleton && fluid),\n\t\t\t\'cds--multiselect\': type === \'multi\',\n\t\t\t\'cds--multi-select--selected\': type === \'multi\' && getSelectedCount() > 0,\n\t\t\t\'cds--dropdown--light\': theme === \'light\',\n\t\t\t\'cds--list-box--light\': theme === \'light\',\n\t\t\t\'cds--list-box--inline\': inline,\n\t\t\t\'cds--skeleton\': skeleton,\n\t\t\t\'cds--dropdown--disabled cds--list-box--disabled\': disabled,\n\t\t\t\'cds--dropdown--readonly\': readonly,\n\t\t\t\'cds--dropdown--invalid\': invalid,\n\t\t\t\'cds--dropdown--warning cds--list-box--warning\': warn,\n\t\t\t\'cds--dropdown--sm cds--list-box--sm\': size === \'sm\',\n\t\t\t\'cds--dropdown--md cds--list-box--md\': size === \'md\',\n\t\t\t\'cds--dropdown--lg cds--list-box--lg\': size === \'lg\',\n\t\t\t\'cds--list-box--expanded\': !menuIsClosed,\n\t\t\t\'cds--list-box--invalid\': invalid\n\t\t}"\n\t\t[attr.data-invalid]="invalid ? true : null">\n\t\t<div *ngIf="skeleton && fluid" class="cds--list-box__label"></div>\n\t\t<button\n\t\t\t#dropdownButton\n\t\t\t[id]="id"\n\t\t\ttype="button"\n\t\t\tclass="cds--list-box__field"\n\t\t\t[ngClass]="{\'a\': !menuIsClosed}"\n\t\t\t[attr.aria-expanded]="!menuIsClosed"\n\t\t\t[attr.aria-disabled]="disabled"\n\t\t\taria-haspopup="listbox"\n\t\t\t(click)="disabled || readonly ? $event.stopPropagation() : toggleMenu()"\n\t\t\t(focus)="fluid ? handleFocus($event) : null"\n\t\t\t(blur)="fluid ? handleFocus($event) : onBlur()"\n\t\t\t[attr.disabled]="disabled ? true : null">\n\t\t\t<div\n\t\t\t\t(click)="clearSelected()"\n\t\t\t\t(keydown.enter)="clearSelected()"\n\t\t\t\t*ngIf="type === \'multi\' && getSelectedCount() > 0"\n\t\t\t\tclass="cds--list-box__selection cds--tag--filter cds--list-box__selection--multi"\n\t\t\t\ttabindex="0"\n\t\t\t\t[title]="clearText">\n\t\t\t\t{{getSelectedCount()}}\n\t\t\t\t<svg\n\t\t\t\t\tfocusable="false"\n\t\t\t\t\tpreserveAspectRatio="xMidYMid meet"\n\t\t\t\t\tstyle="will-change: transform;"\n\t\t\t\t\trole="img"\n\t\t\t\t\txmlns="http://www.w3.org/2000/svg"\n\t\t\t\t\twidth="16"\n\t\t\t\t\theight="16"\n\t\t\t\t\tviewBox="0 0 16 16"\n\t\t\t\t\taria-hidden="true">\n\t\t\t\t\t<path d="M12 4.7l-.7-.7L8 7.3 4.7 4l-.7.7L7.3 8 4 11.3l.7.7L8 8.7l3.3 3.3.7-.7L8.7 8z"></path>\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t\t<span *ngIf="isRenderString()" class="cds--list-box__label">{{getDisplayStringValue() | async}}</span>\n\t\t\t<ng-template\n\t\t\t\t*ngIf="!isRenderString()"\n\t\t\t\t[ngTemplateOutletContext]="getRenderTemplateContext()"\n\t\t\t\t[ngTemplateOutlet]="displayValue">\n\t\t\t</ng-template>\n\t\t\t<span class="cds--list-box__menu-icon">\n\t\t\t\t<svg\n\t\t\t\t\t*ngIf="!skeleton"\n\t\t\t\t\tcdsIcon="chevron--down"\n\t\t\t\t\tsize="16"\n\t\t\t\t\t[attr.aria-label]="menuButtonLabel"\n\t\t\t\t\t[ngClass]="{\'cds--list-box__menu-icon--open\': !menuIsClosed }">\n\t\t\t\t</svg>\n\t\t\t</span>\n\t\t</button>\n\t\t<ng-container *ngIf="decorator">\n\t\t\t<div class="cds--list-box__inner-wrapper--decorator">\n\t\t\t\t<ng-template [ngTemplateOutlet]="decorator"></ng-template>\n\t\t\t</div>\n\t\t</ng-container>\n\t\t<svg\n\t\t\t*ngIf="invalid"\n\t\t\tclass="cds--list-box__invalid-icon"\n\t\t\tcdsIcon="warning--filled"\n\t\t\tsize="16">\n\t\t</svg>\n\t\t<svg\n\t\t\t*ngIf="!invalid && warn"\n\t\t\tcdsIcon="warning--alt--filled"\n\t\t\tsize="16"\n\t\t\tclass="cds--list-box__invalid-icon cds--list-box__invalid-icon--warning">\n\t\t</svg>\n\t\t<div\n\t\t\t#dropdownMenu\n\t\t\t[ngClass]="{\n\t\t\t\t\'cds--list-box--up\': this.dropUp !== null && this.dropUp !== undefined ? dropUp : _dropUp\n\t\t\t}">\n\t\t\t<ng-content *ngIf="!menuIsClosed"></ng-content>\n\t\t</div>\n\t</div>\n\t<hr *ngIf="fluid" class="cds--list-box__divider" />\n\t<div\n\t\t*ngIf="helperText && !invalid && !warn && !skeleton && !fluid"\n\t\tclass="cds--form__helper-text"\n\t\t[ngClass]="{\n\t\t\t\'cds--form__helper-text--disabled\': disabled\n\t\t}">\n\t\t<ng-container *ngIf="!isTemplate(helperText)">{{helperText}}</ng-container>\n\t\t<ng-template *ngIf="isTemplate(helperText)" [ngTemplateOutlet]="helperText"></ng-template>\n\t</div>\n\t<div *ngIf="invalid" class="cds--form-requirement">\n\t\t<ng-container *ngIf="!isTemplate(invalidText)">{{ invalidText }}</ng-container>\n\t\t<ng-template *ngIf="isTemplate(invalidText)" [ngTemplateOutlet]="invalidText"></ng-template>\n\t</div>\n\t<div *ngIf="!invalid && warn" class="cds--form-requirement">\n\t\t<ng-container *ngIf="!isTemplate(warnText)">{{warnText}}</ng-container>\n\t\t<ng-template *ngIf="isTemplate(warnText)" [ngTemplateOutlet]="warnText"></ng-template>\n\t</div>\n\t',providers:[{provide:fesm2020_forms.JU,useExisting:Dropdown,multi:!0}]})],Dropdown);var isObservable=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/util/isObservable.js"),Observable=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Observable.js"),first=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/operators/first.js"),fromEvent=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/observable/fromEvent.js"),debounceTime=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/operators/debounceTime.js"),map=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/operators/map.js"),filter=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/operators/filter.js");let DropdownList=class DropdownList{constructor(elementRef,i18n,appRef){this.elementRef=elementRef,this.i18n=i18n,this.appRef=appRef,this.ariaLabel=this.i18n.get().DROPDOWN_LIST.LABEL,this.listTpl=null,this.select=new core.EventEmitter,this.scroll=new core.EventEmitter,this.blurIntent=new core.EventEmitter,this.type="single",this.showTitles=!0,this.size="md",this.listId="listbox-"+DropdownList.listCount++,this.highlightedItem=null,this.displayItems=[],this.index=-1,this._items=[]}set items(value){(0,isObservable.b)(value)?(this._itemsSubscription&&this._itemsSubscription.unsubscribe(),this._itemsReady=new Observable.y((observer=>{this._itemsSubscription=value.subscribe((v=>{this.updateList(v),observer.next(!0),observer.complete()}))})),this.onItemsReady(null)):this.updateList(value),this._originalItems=value}get items(){return this._originalItems}ngAfterViewInit(){this.index=this.getListItems().findIndex((item=>item.selected)),this.setupFocusObservable(),setTimeout((()=>{this.doEmitSelect(!0)}))}ngOnDestroy(){this.focusJump&&this.focusJump.unsubscribe(),this._itemsSubscription&&this._itemsSubscription.unsubscribe()}doEmitSelect(isUpdate=!0){if("single"===this.type)this.select.emit({item:this._items.find((item=>item.selected)),isUpdate});else{const selected=this.getSelected()||[];selected.isUpdate=isUpdate,this.select.emit(selected)}}getItemId(index){return`${this.listId}-${index}`}updateList(items){this._items=items.map((item=>Object.assign({},item))),this.displayItems=this._items,this.updateIndex(),this.setupFocusObservable(),this.doEmitSelect()}filterBy(query=""){query?(this.displayItems=this.getListItems().filter((item=>item.content.toLowerCase().includes(query.toLowerCase()))),this.displayItems&&(this.index=0)):this.displayItems=this.getListItems(),this.updateIndex()}setupFocusObservable(){if(!this.list)return;this.focusJump&&this.focusJump.unsubscribe();let elList=Array.from(this.list.nativeElement.querySelectorAll("li"));this.focusJump=function watchFocusJump(target,elements){return(0,fromEvent.R)(target,"keydown").pipe((0,debounceTime.b)(150),(0,map.U)((ev=>{let el=elements.find((itemEl=>itemEl.textContent.trim().toLowerCase().startsWith(ev.key)));if(el)return el})),(0,filter.h)((el=>!!el)))}(this.list.nativeElement,elList).subscribe((el=>{el.focus()}))}getNextItem(){return this.index<this.displayItems.length-1&&this.index++,this.displayItems[this.index]}hasNextElement(){return this.index<this.displayItems.length-1&&(!(this.index===this.displayItems.length-2)||!this.displayItems[this.index+1].disabled)}getNextElement(){const elemList=this.listElementList?this.listElementList.toArray():[];if(!elemList.length)return null;for(let i=this.index+1;i<elemList.length;i++)if(!this.displayItems[i].disabled)return this.index=i,elemList[i].nativeElement;return elemList[this.index]?.nativeElement}getPrevItem(){return this.index>0&&this.index--,this.displayItems[this.index]}hasPrevElement(){return this.index>0&&(!(1===this.index)||!this.displayItems[0].disabled)}getPrevElement(){const elemList=this.listElementList?this.listElementList.toArray():[];if(!elemList.length)return null;for(let i=this.index-1;i<this.index&&i>=0;i--)if(!this.displayItems[i].disabled)return this.index=i,elemList[i].nativeElement;return elemList[this.index].nativeElement}getCurrentItem(){return this.index<0?this.displayItems[0]:this.displayItems[this.index]}getCurrentElement(){return this.index<0?this.listElementList.first.nativeElement:this.listElementList.toArray()[this.index].nativeElement}getListItems(){return this._items}getSelected(){let selected=this.getListItems().filter((item=>item.selected));return 0===selected.length?[]:selected}propagateSelected(value){Array.isArray(value)||console.error(`${this.constructor.name}.propagateSelected expects an Array<ListItem>, got ${JSON.stringify(value)}`),this.onItemsReady((()=>{const selectedNewItems=[];for(let newItem of value)if(newItem&&newItem.selected){let tempNewItem=Object.assign({},newItem);delete tempNewItem.selected,tempNewItem=JSON.stringify(tempNewItem),selectedNewItems.push(tempNewItem)}for(let oldItem of this.getListItems()){if(0===selectedNewItems.length){oldItem.selected=!1;continue}let tempOldItem=Object.assign({},oldItem);delete tempOldItem.selected,tempOldItem=JSON.stringify(tempOldItem);for(let selectedNewItem of selectedNewItems){if(tempOldItem.includes(selectedNewItem)){oldItem.selected=!0;break}oldItem.selected=!1}}}))}initFocus(){this.index<0&&this.updateIndex(),this.list.nativeElement.focus(),setTimeout((()=>{this.highlightedItem=this.getItemId(this.index)}))}updateIndex(){const selected=this.getSelected();selected.length?this.index=this.displayItems.indexOf(selected[0]):this.index<0&&this.hasNextElement()&&this.getNextElement()}navigateList(event){"Enter"===event.key||" "===event.key?(this.listElementList.some((option=>option.nativeElement===event.target))&&event.preventDefault(),"Enter"===event.key&&this.doClick(event,this.getCurrentItem())):"ArrowDown"!==event.key&&"ArrowUp"!==event.key||(event.preventDefault(),"ArrowDown"===event.key?this.hasNextElement()?this.getNextElement()?.scrollIntoView({block:"end"}):this.blurIntent.emit("bottom"):"ArrowUp"===event.key&&(this.hasPrevElement()?this.getPrevElement().scrollIntoView({block:"nearest"}):this.blurIntent.emit("top")),setTimeout((()=>{this.highlightedItem=this.getItemId(this.index)})))}doClick(event,item){if(event.preventDefault(),item&&!item.disabled){if(this.list.nativeElement.focus(),"single"===this.type){item.selected=!0;for(let otherItem of this.getListItems())item!==otherItem&&(otherItem.selected=!1)}else item.selected=!item.selected;this.index=this.displayItems.indexOf(item),this.highlightedItem=this.getItemId(this.index),this.doEmitSelect(!1),this.appRef.tick()}}onItemFocus(index){const element=this.listElementList.toArray()[index].nativeElement;element.classList.add("cds--list-box__menu-item--highlighted"),element.tabIndex=0}onItemBlur(index){const element=this.listElementList.toArray()[index].nativeElement;element.classList.remove("cds--list-box__menu-item--highlighted"),element.tabIndex=-1}emitScroll(event){const customScrollEvent={atTop:0===event.srcElement.scrollTop,atBottom:event.srcElement.scrollHeight-event.srcElement.scrollTop===event.srcElement.clientHeight,event};this.scroll.emit(customScrollEvent)}onItemsReady(subcription){(this._itemsReady||(0,of.of)(!0)).pipe((0,first.P)()).subscribe(subcription)}reorderSelected(moveFocus=!0){this.displayItems=[...this.getSelected(),...this.getListItems().filter((item=>!item.selected))],moveFocus&&setTimeout((()=>{this.updateIndex(),this.highlightedItem=this.getItemId(this.index)}))}};DropdownList.listCount=0,DropdownList.ctorParameters=()=>[{type:core.ElementRef},{type:i18n.oc},{type:core.ApplicationRef}],DropdownList.propDecorators={ariaLabel:[{type:core.Input}],items:[{type:core.Input}],listTpl:[{type:core.Input}],select:[{type:core.Output}],scroll:[{type:core.Output}],blurIntent:[{type:core.Output}],list:[{type:core.ViewChild,args:["list",{static:!0}]}],type:[{type:core.Input}],showTitles:[{type:core.Input}],listElementList:[{type:core.ViewChildren,args:["listItem"]}]},DropdownList=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-dropdown-list, ibm-dropdown-list",template:'\n\t\t<ul\n\t\t\t#list\n\t\t\t[id]="listId"\n\t\t\trole="listbox"\n\t\t\tclass="cds--list-box__menu cds--multi-select"\n\t\t\t(scroll)="emitScroll($event)"\n\t\t\t(keydown)="navigateList($event)"\n\t\t\ttabindex="0"\n\t\t\t[attr.aria-label]="ariaLabel"\n\t\t\t[attr.aria-activedescendant]="highlightedItem">\n\t\t\t<li\n\t\t\t\trole="option"\n\t\t\t\t*ngFor="let item of displayItems; let i = index"\n\t\t\t\t(click)="doClick($event, item)"\n\t\t\t\tclass="cds--list-box__menu-item"\n\t\t\t\t[attr.aria-selected]="item.selected"\n\t\t\t\t[id]="getItemId(i)"\n\t\t\t\t[attr.tabindex]="highlightedItem === getItemId(i) ? 0 : null"\n\t\t\t\t[attr.title]=" showTitles ? item.content : null"\n\t\t\t\t[attr.disabled]="item.disabled ? true : null"\n\t\t\t\t[ngClass]="{\n\t\t\t\t\t\'cds--list-box__menu-item--active\': item.selected,\n\t\t\t\t\t\'cds--list-box__menu-item--highlighted\': highlightedItem === getItemId(i)\n\t\t\t\t}">\n\t\t\t\t<div\n\t\t\t\t\t#listItem\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tclass="cds--list-box__menu-item__option">\n\t\t\t\t\t<div\n\t\t\t\t\t\t*ngIf="!listTpl && type === \'multi\'"\n\t\t\t\t\t\tclass="cds--form-item cds--checkbox-wrapper">\n\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t[attr.data-contained-checkbox-state]="item.selected"\n\t\t\t\t\t\t\tclass="cds--checkbox-label">\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass="cds--checkbox"\n\t\t\t\t\t\t\t\ttype="checkbox"\n\t\t\t\t\t\t\t\t[checked]="item.selected"\n\t\t\t\t\t\t\t\t[disabled]="item.disabled"\n\t\t\t\t\t\t\t\ttabindex="-1">\n\t\t\t\t\t\t\t<span class="cds--checkbox-appearance"></span>\n\t\t\t\t\t\t\t<span class="cds--checkbox-label-text">{{item.content}}</span>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ng-container *ngIf="!listTpl && type === \'single\'">{{item.content}}</ng-container>\n\t\t\t\t\t<svg\n\t\t\t\t\t\t*ngIf="!listTpl && type === \'single\'"\n\t\t\t\t\t\tcdsIcon="checkmark"\n\t\t\t\t\t\tsize="16"\n\t\t\t\t\t\tclass="cds--list-box__menu-item__selected-icon">\n\t\t\t\t\t</svg>\n\t\t\t\t\t<ng-template\n\t\t\t\t\t\t*ngIf="listTpl"\n\t\t\t\t\t\t[ngTemplateOutletContext]="{item: item}"\n\t\t\t\t\t\t[ngTemplateOutlet]="listTpl">\n\t\t\t\t\t</ng-template>\n\t\t\t\t</div>\n\t\t\t</li>\n\t\t</ul>',providers:[{provide:AbstractDropdownView,useExisting:DropdownList}]})],DropdownList);let ScrollableList=class ScrollableList{constructor(elementRef){this.elementRef=elementRef,this.nScrollableList=null,this.scrollEnabled=!0,this.scrollBy=10,this.canScrollUp=!1,this.canScrollDown=!1,this.list=this.elementRef.nativeElement}ngOnChanges(changes){changes.scrollEnabled&&(changes.scrollEnabled.currentValue?(this.list.style.overflow="hidden",this.scrollUpTarget.style.display="flex",this.scrollDownTarget.style.display="flex",this.canScrollUp=!0,this.canScrollDown=!0,this.updateScrollHeight(),this.checkScrollArrows(),setTimeout((()=>{this.checkScrollArrows()}))):(this.scrollUpTarget.style.display="none",this.scrollDownTarget.style.display="none",this.canScrollUp=!1,this.canScrollDown=!1,this.list.style.height=null,this.list.style.overflow=null,clearInterval(this.hoverScrollInterval)))}ngAfterViewInit(){this.nScrollableList&&(this.list=this.elementRef.nativeElement.querySelector(this.nScrollableList)),this.scrollUpTarget.addEventListener("mouseover",(()=>this.onHoverUp(!0))),this.scrollUpTarget.addEventListener("mouseout",(()=>this.onHoverUp(!1))),this.scrollDownTarget.addEventListener("mouseover",(()=>this.onHoverDown(!0))),this.scrollDownTarget.addEventListener("mouseout",(()=>this.onHoverDown(!1)))}updateScrollHeight(){if(this.scrollEnabled){const containerRect=this.elementRef.nativeElement.parentElement.getBoundingClientRect(),innerHeightDiff=this.list.getBoundingClientRect().top-containerRect.top,height=containerRect.height-(containerRect.bottom-window.innerHeight)-innerHeightDiff-40;this.list.style.height=`${height}px`}}checkScrollArrows(){const scrollUpHeight=this.scrollUpTarget.offsetHeight,scrollDownHeight=this.scrollDownTarget.offsetHeight;0===this.list.scrollTop?(this.canScrollUp&&(this.list.style.height=`${parseInt(this.list.style.height,10)+scrollUpHeight}px`),this.scrollUpTarget.style.display="none",this.canScrollUp=!1):this.list.scrollTop===this.list.scrollTopMax?(this.canScrollDown&&(this.list.style.height=`${parseInt(this.list.style.height,10)+scrollDownHeight}px`),this.scrollDownTarget.style.display="none",this.canScrollDown=!1):(this.canScrollUp||(this.list.style.height=parseInt(this.list.style.height,10)-scrollUpHeight+"px"),this.canScrollDown||(this.list.style.height=parseInt(this.list.style.height,10)-scrollDownHeight+"px"),this.scrollUpTarget.style.display="flex",this.scrollDownTarget.style.display="flex",this.canScrollUp=!0,this.canScrollDown=!0)}onWheel(event){event.deltaY<0?this.list.scrollTop-=this.scrollBy:this.list.scrollTop+=this.scrollBy,this.list.scrollTop!==this.list.scrollTopMax&&0!==this.list.scrollTop&&(event.preventDefault(),event.stopPropagation()),this.checkScrollArrows()}onTouchStart(event){event.touches[0]&&(this.lastTouch=event.touches[0].clientY)}onTouchMove(event){if(event.preventDefault(),event.stopPropagation(),event.touches[0]){const touch=event.touches[0];this.list.scrollTop+=this.lastTouch-touch.clientY,this.lastTouch=touch.clientY,this.checkScrollArrows()}}hoverScrollBy(hovering,amount){hovering?this.hoverScrollInterval=setInterval((()=>{this.list.scrollTop+=amount,this.checkScrollArrows()}),1):clearInterval(this.hoverScrollInterval)}onHoverUp(hovering){this.hoverScrollBy(hovering,-3)}onHoverDown(hovering){this.hoverScrollBy(hovering,3)}onKeyDown(event){"ArrowDown"!==event.key&&"ArrowUp"!==event.key||this.checkScrollArrows()}};ScrollableList.ctorParameters=()=>[{type:core.ElementRef}],ScrollableList.propDecorators={nScrollableList:[{type:core.Input}],scrollEnabled:[{type:core.Input}],scrollUpTarget:[{type:core.Input}],scrollDownTarget:[{type:core.Input}],scrollBy:[{type:core.Input}],onWheel:[{type:core.HostListener,args:["wheel",["$event"]]}],onTouchStart:[{type:core.HostListener,args:["touchstart",["$event"]]}],onTouchMove:[{type:core.HostListener,args:["touchmove",["$event"]]}],onKeyDown:[{type:core.HostListener,args:["keydown",["$event"]]}]},ScrollableList=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsScrollableList], [ibmScrollableList]",exportAs:"scrollable-list"})],ScrollableList);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),icon=__webpack_require__("./src/icon/index.ts");let DropdownModule=class DropdownModule{};DropdownModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Dropdown,DropdownList,ScrollableList,AbstractDropdownView],exports:[Dropdown,DropdownList,ScrollableList,AbstractDropdownView],imports:[common.CommonModule,fesm2020_forms.u5,i18n.LU,placeholder.Qq,utils.As,icon.QX],providers:[DropdownService]})],DropdownModule)}}]);

package/docs/storybook/557.d4341469.iframe.bundle.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[557],{"./node_modules/@carbon/utils-position/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{var _a,PLACEMENTS;__webpack_require__.d(__webpack_exports__,{FK:()=>position,ZP:()=>__WEBPACK_DEFAULT_EXPORT__}),function(PLACEMENTS){PLACEMENTS.LEFT="left",PLACEMENTS.RIGHT="right",PLACEMENTS.TOP="top",PLACEMENTS.BOTTOM="bottom"}(PLACEMENTS||(PLACEMENTS={}));var defaultPositions=((_a={})[PLACEMENTS.LEFT]=function(referenceOffset,target,referenceRect){return{top:referenceOffset.top-Math.round(target.offsetHeight/2)+Math.round(referenceRect.height/2),left:Math.round(referenceOffset.left-target.offsetWidth)}},_a[PLACEMENTS.RIGHT]=function(referenceOffset,target,referenceRect){return{top:referenceOffset.top-Math.round(target.offsetHeight/2)+Math.round(referenceRect.height/2),left:Math.round(referenceOffset.left+referenceRect.width)}},_a[PLACEMENTS.TOP]=function(referenceOffset,target,referenceRect){return{top:Math.round(referenceOffset.top-target.offsetHeight),left:referenceOffset.left-Math.round(target.offsetWidth/2)+Math.round(referenceRect.width/2)}},_a[PLACEMENTS.BOTTOM]=function(referenceOffset,target,referenceRect){return{top:Math.round(referenceOffset.top+referenceRect.height),left:referenceOffset.left-Math.round(target.offsetWidth/2)+Math.round(referenceRect.width/2)}},_a),windowRef="undefined"!=typeof window?window:{innerHeight:0,scrollY:0,innerWidth:0,scrollX:0},Position=function(){function Position(positions){void 0===positions&&(positions={}),this.positions=defaultPositions,this.positions=Object.assign({},defaultPositions,positions)}return Position.prototype.getRelativeOffset=function(target){for(var offsets={left:target.offsetLeft,top:target.offsetTop};target.offsetParent&&"static"===getComputedStyle(target.offsetParent).position;)offsets.left+=target.offsetLeft,offsets.top+=target.offsetTop,target=target.offsetParent;return offsets},Position.prototype.getAbsoluteOffset=function(target){for(var currentNode=target,margins={top:0,left:0};currentNode.offsetParent;){var computed=getComputedStyle(currentNode.offsetParent);"static"===computed.position&&computed.marginLeft&&computed.marginTop&&(parseInt(computed.marginTop,10)&&(margins.top+=parseInt(computed.marginTop,10)),parseInt(computed.marginLeft,10)&&(margins.left+=parseInt(computed.marginLeft,10))),currentNode=currentNode.offsetParent}var targetRect=target.getBoundingClientRect(),relativeRect=document.body.getBoundingClientRect();return{top:targetRect.top-relativeRect.top+margins.top,left:targetRect.left-relativeRect.left+margins.left}},Position.prototype.findRelative=function(reference,target,placement){var referenceOffset=this.getRelativeOffset(reference),referenceRect=reference.getBoundingClientRect();return this.calculatePosition(referenceOffset,referenceRect,target,placement)},Position.prototype.findAbsolute=function(reference,target,placement){var referenceOffset=this.getAbsoluteOffset(reference),referenceRect=reference.getBoundingClientRect();return this.calculatePosition(referenceOffset,referenceRect,target,placement)},Position.prototype.findPosition=function(reference,target,placement,offsetFunction){void 0===offsetFunction&&(offsetFunction=this.getAbsoluteOffset.bind(this));var referenceOffset=offsetFunction(reference),referenceRect=reference.getBoundingClientRect();return this.calculatePosition(referenceOffset,referenceRect,target,placement)},Position.prototype.findPositionAt=function(offset,target,placement){return this.calculatePosition(offset,{top:0,left:0,height:0,width:0},target,placement)},Position.prototype.getPlacementBox=function(target,position){var targetBottom=target.offsetHeight+position.top,targetRight=target.offsetWidth+position.left;return{top:position.top,bottom:targetBottom,left:position.left,right:targetRight}},Position.prototype.addOffset=function(position,top,left){return void 0===top&&(top=0),void 0===left&&(left=0),Object.assign({},position,{top:position.top+top,left:position.left+left})},Position.prototype.setElement=function(element,position){element.style.top=position.top+"px",element.style.left=position.left+"px"},Position.prototype.findBestPlacement=function(reference,target,placements,containerFunction,positionFunction){var _this=this;void 0===containerFunction&&(containerFunction=this.defaultContainerFunction.bind(this)),void 0===positionFunction&&(positionFunction=this.findPosition.bind(this));var weightedPlacements=placements.map((function(placement){var pos=positionFunction(reference,target,placement),box=_this.getPlacementBox(target,pos),hiddenHeight=0,hiddenWidth=0,container=containerFunction();box.top<container.top?hiddenHeight=container.top-box.top:box.bottom>container.height&&(hiddenHeight=box.bottom-container.height),box.left<container.left?hiddenWidth=container.left-box.left:box.right>container.width&&(hiddenWidth=box.right-container.width),hiddenHeight&&!hiddenWidth?hiddenWidth=1:hiddenWidth&&!hiddenHeight&&(hiddenHeight=1);var area=target.offsetHeight*target.offsetWidth;return{placement,weight:(area-hiddenHeight*hiddenWidth)/area}}));return weightedPlacements.sort((function(a,b){return b.weight-a.weight})),weightedPlacements[0].placement},Position.prototype.findBestPlacementAt=function(offset,target,placements,containerFunction){var _this=this;void 0===containerFunction&&(containerFunction=this.defaultContainerFunction.bind(this));return this.findBestPlacement(null,target,placements,containerFunction,(function(_,target,placement){return _this.findPositionAt(offset,target,placement)}))},Position.prototype.defaultContainerFunction=function(){return{top:0,left:0,height:windowRef.innerHeight,width:windowRef.innerWidth}},Position.prototype.calculatePosition=function(referenceOffset,referenceRect,target,placement){return this.positions[placement]?this.positions[placement](referenceOffset,target,referenceRect):(console.error("No function found for placement, defaulting to 0,0"),{left:0,top:0})},Position}(),position=new Position;const __WEBPACK_DEFAULT_EXPORT__=Position},"./node_modules/lodash-es/isEqual.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Z:()=>lodash_es_isEqual});const _listCacheClear=function listCacheClear(){this.__data__=[],this.size=0};const lodash_es_eq=function eq(value,other){return value===other||value!=value&&other!=other};const _assocIndexOf=function assocIndexOf(array,key){for(var length=array.length;length--;)if(lodash_es_eq(array[length][0],key))return length;return-1};var splice=Array.prototype.splice;const _listCacheDelete=function listCacheDelete(key){var data=this.__data__,index=_assocIndexOf(data,key);return!(index<0)&&(index==data.length-1?data.pop():splice.call(data,index,1),--this.size,!0)};const _listCacheGet=function listCacheGet(key){var data=this.__data__,index=_assocIndexOf(data,key);return index<0?void 0:data[index][1]};const _listCacheHas=function listCacheHas(key){return _assocIndexOf(this.__data__,key)>-1};const _listCacheSet=function listCacheSet(key,value){var data=this.__data__,index=_assocIndexOf(data,key);return index<0?(++this.size,data.push([key,value])):data[index][1]=value,this};function ListCache(entries){var index=-1,length=null==entries?0:entries.length;for(this.clear();++index<length;){var entry=entries[index];this.set(entry[0],entry[1])}}ListCache.prototype.clear=_listCacheClear,ListCache.prototype.delete=_listCacheDelete,ListCache.prototype.get=_listCacheGet,ListCache.prototype.has=_listCacheHas,ListCache.prototype.set=_listCacheSet;const _ListCache=ListCache;const _stackClear=function stackClear(){this.__data__=new _ListCache,this.size=0};const _stackDelete=function stackDelete(key){var data=this.__data__,result=data.delete(key);return this.size=data.size,result};const _stackGet=function stackGet(key){return this.__data__.get(key)};const _stackHas=function stackHas(key){return this.__data__.has(key)};var isFunction=__webpack_require__("./node_modules/lodash-es/isFunction.js"),_root=__webpack_require__("./node_modules/lodash-es/_root.js");const _coreJsData=_root.Z["__core-js_shared__"];var uid,maskSrcKey=(uid=/[^.]+$/.exec(_coreJsData&&_coreJsData.keys&&_coreJsData.keys.IE_PROTO||""))?"Symbol(src)_1."+uid:"";const _isMasked=function isMasked(func){return!!maskSrcKey&&maskSrcKey in func};var isObject=__webpack_require__("./node_modules/lodash-es/isObject.js"),funcToString=Function.prototype.toString;const _toSource=function toSource(func){if(null!=func){try{return funcToString.call(func)}catch(e){}try{return func+""}catch(e){}}return""};var reIsHostCtor=/^\[object .+?Constructor\]$/,_baseIsNative_funcProto=Function.prototype,objectProto=Object.prototype,_baseIsNative_funcToString=_baseIsNative_funcProto.toString,_baseIsNative_hasOwnProperty=objectProto.hasOwnProperty,reIsNative=RegExp("^"+_baseIsNative_funcToString.call(_baseIsNative_hasOwnProperty).replace(/[\\^$.*+?()[\]{}|]/g,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$");const _baseIsNative=function baseIsNative(value){return!(!(0,isObject.Z)(value)||_isMasked(value))&&((0,isFunction.Z)(value)?reIsNative:reIsHostCtor).test(_toSource(value))};const _getValue=function getValue(object,key){return null==object?void 0:object[key]};const _getNative=function getNative(object,key){var value=_getValue(object,key);return _baseIsNative(value)?value:void 0};const _Map=_getNative(_root.Z,"Map");const _nativeCreate=_getNative(Object,"create");const _hashClear=function hashClear(){this.__data__=_nativeCreate?_nativeCreate(null):{},this.size=0};const _hashDelete=function hashDelete(key){var result=this.has(key)&&delete this.__data__[key];return this.size-=result?1:0,result};var _hashGet_hasOwnProperty=Object.prototype.hasOwnProperty;const _hashGet=function hashGet(key){var data=this.__data__;if(_nativeCreate){var result=data[key];return"__lodash_hash_undefined__"===result?void 0:result}return _hashGet_hasOwnProperty.call(data,key)?data[key]:void 0};var _hashHas_hasOwnProperty=Object.prototype.hasOwnProperty;const _hashHas=function hashHas(key){var data=this.__data__;return _nativeCreate?void 0!==data[key]:_hashHas_hasOwnProperty.call(data,key)};const _hashSet=function hashSet(key,value){var data=this.__data__;return this.size+=this.has(key)?0:1,data[key]=_nativeCreate&&void 0===value?"__lodash_hash_undefined__":value,this};function Hash(entries){var index=-1,length=null==entries?0:entries.length;for(this.clear();++index<length;){var entry=entries[index];this.set(entry[0],entry[1])}}Hash.prototype.clear=_hashClear,Hash.prototype.delete=_hashDelete,Hash.prototype.get=_hashGet,Hash.prototype.has=_hashHas,Hash.prototype.set=_hashSet;const _Hash=Hash;const _mapCacheClear=function mapCacheClear(){this.size=0,this.__data__={hash:new _Hash,map:new(_Map||_ListCache),string:new _Hash}};const _isKeyable=function isKeyable(value){var type=typeof value;return"string"==type||"number"==type||"symbol"==type||"boolean"==type?"__proto__"!==value:null===value};const _getMapData=function getMapData(map,key){var data=map.__data__;return _isKeyable(key)?data["string"==typeof key?"string":"hash"]:data.map};const _mapCacheDelete=function mapCacheDelete(key){var result=_getMapData(this,key).delete(key);return this.size-=result?1:0,result};const _mapCacheGet=function mapCacheGet(key){return _getMapData(this,key).get(key)};const _mapCacheHas=function mapCacheHas(key){return _getMapData(this,key).has(key)};const _mapCacheSet=function mapCacheSet(key,value){var data=_getMapData(this,key),size=data.size;return data.set(key,value),this.size+=data.size==size?0:1,this};function MapCache(entries){var index=-1,length=null==entries?0:entries.length;for(this.clear();++index<length;){var entry=entries[index];this.set(entry[0],entry[1])}}MapCache.prototype.clear=_mapCacheClear,MapCache.prototype.delete=_mapCacheDelete,MapCache.prototype.get=_mapCacheGet,MapCache.prototype.has=_mapCacheHas,MapCache.prototype.set=_mapCacheSet;const _MapCache=MapCache;const _stackSet=function stackSet(key,value){var data=this.__data__;if(data instanceof _ListCache){var pairs=data.__data__;if(!_Map||pairs.length<199)return pairs.push([key,value]),this.size=++data.size,this;data=this.__data__=new _MapCache(pairs)}return data.set(key,value),this.size=data.size,this};function Stack(entries){var data=this.__data__=new _ListCache(entries);this.size=data.size}Stack.prototype.clear=_stackClear,Stack.prototype.delete=_stackDelete,Stack.prototype.get=_stackGet,Stack.prototype.has=_stackHas,Stack.prototype.set=_stackSet;const _Stack=Stack;const _setCacheAdd=function setCacheAdd(value){return this.__data__.set(value,"__lodash_hash_undefined__"),this};const _setCacheHas=function setCacheHas(value){return this.__data__.has(value)};function SetCache(values){var index=-1,length=null==values?0:values.length;for(this.__data__=new _MapCache;++index<length;)this.add(values[index])}SetCache.prototype.add=SetCache.prototype.push=_setCacheAdd,SetCache.prototype.has=_setCacheHas;const _SetCache=SetCache;const _arraySome=function arraySome(array,predicate){for(var index=-1,length=null==array?0:array.length;++index<length;)if(predicate(array[index],index,array))return!0;return!1};const _cacheHas=function cacheHas(cache,key){return cache.has(key)};const _equalArrays=function equalArrays(array,other,bitmask,customizer,equalFunc,stack){var isPartial=1&bitmask,arrLength=array.length,othLength=other.length;if(arrLength!=othLength&&!(isPartial&&othLength>arrLength))return!1;var arrStacked=stack.get(array),othStacked=stack.get(other);if(arrStacked&&othStacked)return arrStacked==other&&othStacked==array;var index=-1,result=!0,seen=2&bitmask?new _SetCache:void 0;for(stack.set(array,other),stack.set(other,array);++index<arrLength;){var arrValue=array[index],othValue=other[index];if(customizer)var compared=isPartial?customizer(othValue,arrValue,index,other,array,stack):customizer(arrValue,othValue,index,array,other,stack);if(void 0!==compared){if(compared)continue;result=!1;break}if(seen){if(!_arraySome(other,(function(othValue,othIndex){if(!_cacheHas(seen,othIndex)&&(arrValue===othValue||equalFunc(arrValue,othValue,bitmask,customizer,stack)))return seen.push(othIndex)}))){result=!1;break}}else if(arrValue!==othValue&&!equalFunc(arrValue,othValue,bitmask,customizer,stack)){result=!1;break}}return stack.delete(array),stack.delete(other),result};var _Symbol=__webpack_require__("./node_modules/lodash-es/_Symbol.js");const _Uint8Array=_root.Z.Uint8Array;const _mapToArray=function mapToArray(map){var index=-1,result=Array(map.size);return map.forEach((function(value,key){result[++index]=[key,value]})),result};const _setToArray=function setToArray(set){var index=-1,result=Array(set.size);return set.forEach((function(value){result[++index]=value})),result};var symbolProto=_Symbol.Z?_Symbol.Z.prototype:void 0,symbolValueOf=symbolProto?symbolProto.valueOf:void 0;const _equalByTag=function equalByTag(object,other,tag,bitmask,customizer,equalFunc,stack){switch(tag){case"[object DataView]":if(object.byteLength!=other.byteLength||object.byteOffset!=other.byteOffset)return!1;object=object.buffer,other=other.buffer;case"[object ArrayBuffer]":return!(object.byteLength!=other.byteLength||!equalFunc(new _Uint8Array(object),new _Uint8Array(other)));case"[object Boolean]":case"[object Date]":case"[object Number]":return lodash_es_eq(+object,+other);case"[object Error]":return object.name==other.name&&object.message==other.message;case"[object RegExp]":case"[object String]":return object==other+"";case"[object Map]":var convert=_mapToArray;case"[object Set]":var isPartial=1&bitmask;if(convert||(convert=_setToArray),object.size!=other.size&&!isPartial)return!1;var stacked=stack.get(object);if(stacked)return stacked==other;bitmask|=2,stack.set(object,other);var result=_equalArrays(convert(object),convert(other),bitmask,customizer,equalFunc,stack);return stack.delete(object),result;case"[object Symbol]":if(symbolValueOf)return symbolValueOf.call(object)==symbolValueOf.call(other)}return!1};const _arrayPush=function arrayPush(array,values){for(var index=-1,length=values.length,offset=array.length;++index<length;)array[offset+index]=values[index];return array};var isArray=__webpack_require__("./node_modules/lodash-es/isArray.js");const _baseGetAllKeys=function baseGetAllKeys(object,keysFunc,symbolsFunc){var result=keysFunc(object);return(0,isArray.Z)(object)?result:_arrayPush(result,symbolsFunc(object))};const _arrayFilter=function arrayFilter(array,predicate){for(var index=-1,length=null==array?0:array.length,resIndex=0,result=[];++index<length;){var value=array[index];predicate(value,index,array)&&(result[resIndex++]=value)}return result};const lodash_es_stubArray=function stubArray(){return[]};var propertyIsEnumerable=Object.prototype.propertyIsEnumerable,nativeGetSymbols=Object.getOwnPropertySymbols;const _getSymbols=nativeGetSymbols?function(object){return null==object?[]:(object=Object(object),_arrayFilter(nativeGetSymbols(object),(function(symbol){return propertyIsEnumerable.call(object,symbol)})))}:lodash_es_stubArray;var keys=__webpack_require__("./node_modules/lodash-es/keys.js");const _getAllKeys=function getAllKeys(object){return _baseGetAllKeys(object,keys.Z,_getSymbols)};var _equalObjects_hasOwnProperty=Object.prototype.hasOwnProperty;const _equalObjects=function equalObjects(object,other,bitmask,customizer,equalFunc,stack){var isPartial=1&bitmask,objProps=_getAllKeys(object),objLength=objProps.length;if(objLength!=_getAllKeys(other).length&&!isPartial)return!1;for(var index=objLength;index--;){var key=objProps[index];if(!(isPartial?key in other:_equalObjects_hasOwnProperty.call(other,key)))return!1}var objStacked=stack.get(object),othStacked=stack.get(other);if(objStacked&&othStacked)return objStacked==other&&othStacked==object;var result=!0;stack.set(object,other),stack.set(other,object);for(var skipCtor=isPartial;++index<objLength;){var objValue=object[key=objProps[index]],othValue=other[key];if(customizer)var compared=isPartial?customizer(othValue,objValue,key,other,object,stack):customizer(objValue,othValue,key,object,other,stack);if(!(void 0===compared?objValue===othValue||equalFunc(objValue,othValue,bitmask,customizer,stack):compared)){result=!1;break}skipCtor||(skipCtor="constructor"==key)}if(result&&!skipCtor){var objCtor=object.constructor,othCtor=other.constructor;objCtor==othCtor||!("constructor"in object)||!("constructor"in other)||"function"==typeof objCtor&&objCtor instanceof objCtor&&"function"==typeof othCtor&&othCtor instanceof othCtor||(result=!1)}return stack.delete(object),stack.delete(other),result};const _DataView=_getNative(_root.Z,"DataView");const _Promise=_getNative(_root.Z,"Promise");const _Set=_getNative(_root.Z,"Set");const _WeakMap=_getNative(_root.Z,"WeakMap");var _baseGetTag=__webpack_require__("./node_modules/lodash-es/_baseGetTag.js"),dataViewCtorString=_toSource(_DataView),mapCtorString=_toSource(_Map),promiseCtorString=_toSource(_Promise),setCtorString=_toSource(_Set),weakMapCtorString=_toSource(_WeakMap),getTag=_baseGetTag.Z;(_DataView&&"[object DataView]"!=getTag(new _DataView(new ArrayBuffer(1)))||_Map&&"[object Map]"!=getTag(new _Map)||_Promise&&"[object Promise]"!=getTag(_Promise.resolve())||_Set&&"[object Set]"!=getTag(new _Set)||_WeakMap&&"[object WeakMap]"!=getTag(new _WeakMap))&&(getTag=function(value){var result=(0,_baseGetTag.Z)(value),Ctor="[object Object]"==result?value.constructor:void 0,ctorString=Ctor?_toSource(Ctor):"";if(ctorString)switch(ctorString){case dataViewCtorString:return"[object DataView]";case mapCtorString:return"[object Map]";case promiseCtorString:return"[object Promise]";case setCtorString:return"[object Set]";case weakMapCtorString:return"[object WeakMap]"}return result});const _getTag=getTag;var isBuffer=__webpack_require__("./node_modules/lodash-es/isBuffer.js"),isTypedArray=__webpack_require__("./node_modules/lodash-es/isTypedArray.js"),_baseIsEqualDeep_hasOwnProperty=Object.prototype.hasOwnProperty;const _baseIsEqualDeep=function baseIsEqualDeep(object,other,bitmask,customizer,equalFunc,stack){var objIsArr=(0,isArray.Z)(object),othIsArr=(0,isArray.Z)(other),objTag=objIsArr?"[object Array]":_getTag(object),othTag=othIsArr?"[object Array]":_getTag(other),objIsObj="[object Object]"==(objTag="[object Arguments]"==objTag?"[object Object]":objTag),othIsObj="[object Object]"==(othTag="[object Arguments]"==othTag?"[object Object]":othTag),isSameTag=objTag==othTag;if(isSameTag&&(0,isBuffer.Z)(object)){if(!(0,isBuffer.Z)(other))return!1;objIsArr=!0,objIsObj=!1}if(isSameTag&&!objIsObj)return stack||(stack=new _Stack),objIsArr||(0,isTypedArray.Z)(object)?_equalArrays(object,other,bitmask,customizer,equalFunc,stack):_equalByTag(object,other,objTag,bitmask,customizer,equalFunc,stack);if(!(1&bitmask)){var objIsWrapped=objIsObj&&_baseIsEqualDeep_hasOwnProperty.call(object,"__wrapped__"),othIsWrapped=othIsObj&&_baseIsEqualDeep_hasOwnProperty.call(other,"__wrapped__");if(objIsWrapped||othIsWrapped){var objUnwrapped=objIsWrapped?object.value():object,othUnwrapped=othIsWrapped?other.value():other;return stack||(stack=new _Stack),equalFunc(objUnwrapped,othUnwrapped,bitmask,customizer,stack)}}return!!isSameTag&&(stack||(stack=new _Stack),_equalObjects(object,other,bitmask,customizer,equalFunc,stack))};var isObjectLike=__webpack_require__("./node_modules/lodash-es/isObjectLike.js");const _baseIsEqual=function baseIsEqual(value,other,bitmask,customizer,stack){return value===other||(null==value||null==other||!(0,isObjectLike.Z)(value)&&!(0,isObjectLike.Z)(other)?value!=value&&other!=other:_baseIsEqualDeep(value,other,bitmask,customizer,baseIsEqual,stack))};const lodash_es_isEqual=function isEqual(value,other){return _baseIsEqual(value,other)}},"./node_modules/lodash-es/isNull.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Z:()=>__WEBPACK_DEFAULT_EXPORT__});const __WEBPACK_DEFAULT_EXPORT__=function isNull(value){return null===value}},"./node_modules/lodash-es/isUndefined.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Z:()=>__WEBPACK_DEFAULT_EXPORT__});const __WEBPACK_DEFAULT_EXPORT__=function isUndefined(value){return void 0===value}}}]);

package/docs/storybook/955.7522f55b.iframe.bundle.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[955],{"./src/forms/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{hJ:()=>src_button.hJ,s:()=>NFormsModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),fesm2020_forms=__webpack_require__("./node_modules/@angular/forms/fesm2020/forms.mjs"),common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),src_checkbox=__webpack_require__("./src/checkbox/index.ts"),toggle=__webpack_require__("./src/toggle/index.ts"),src_radio=__webpack_require__("./src/radio/index.ts"),input=__webpack_require__("./src/input/index.ts"),src_button=__webpack_require__("./src/button/index.ts");let NFormsModule=class NFormsModule{};NFormsModule=(0,tslib_es6.gn)([(0,core.NgModule)({exports:[src_checkbox.nD,toggle.vm,src_radio.dU,input.gP,src_button.hJ,input.gP],imports:[common.CommonModule,fesm2020_forms.u5,src_checkbox.nD,toggle.vm,src_radio.dU,input.gP,src_button.hJ]})],NFormsModule)},"./src/radio/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Y8:()=>Radio,Ee:()=>RadioGroup,dU:()=>RadioModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),fesm2020_forms=__webpack_require__("./node_modules/@angular/forms/fesm2020/forms.mjs");class RadioChange{constructor(source,value){this.source=source,this.value=value}}let Radio=class Radio{constructor(){this.checked=!1,this.name="",this.disabled=!1,this.labelPlacement="right",this.required=!1,this.skeleton=!1,this.id="radio-"+Radio.radioCount++,this.change=new core.EventEmitter,this.hostClass=!0,this.disabledFromGroup=!1,this._labelledby="",this.radioChangeHandler=event=>{}}set ariaLabelledby(value){this._labelledby=value}get ariaLabelledby(){return this._labelledby?this._labelledby:`label-${this.id}`}get hasDecorator(){return!!this.decorator}get labelLeft(){return"left"===this.labelPlacement}onChange(event){event.stopPropagation()}onClick(event){this.checked=event.target.checked;const radioEvent=new RadioChange(this,this.value);this.change.emit(radioEvent),this.radioChangeHandler(radioEvent)}registerRadioChangeHandler(fn){this.radioChangeHandler=fn}setDisabledFromGroup(disabled){this.disabledFromGroup=disabled}};Radio.radioCount=0,Radio.propDecorators={checked:[{type:core.Input}],name:[{type:core.Input}],disabled:[{type:core.Input}],labelPlacement:[{type:core.Input}],ariaLabelledby:[{type:core.Input}],ariaLabel:[{type:core.Input}],required:[{type:core.Input}],value:[{type:core.Input}],skeleton:[{type:core.Input}],id:[{type:core.Input}],change:[{type:core.Output}],hostClass:[{type:core.HostBinding,args:["class.cds--radio-button-wrapper"]}],hasDecorator:[{type:core.HostBinding,args:["class.cds--radio-button-wrapper--decorator"]}],labelLeft:[{type:core.HostBinding,args:["class.cds--radio-button-wrapper--label-left"]}],decorator:[{type:core.Input}]},Radio=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-radio, ibm-radio",template:'\n\t\t<input\n\t\t\t*ngIf="!skeleton"\n\t\t\tclass="cds--radio-button"\n\t\t\ttype="radio"\n\t\t\t[checked]="checked"\n\t\t\t[disabled]="disabled || disabledFromGroup"\n\t\t\t[name]="name"\n\t\t\t[id]="id"\n\t\t\t[required]="required"\n\t\t\t[attr.value]="value"\n\t\t\t[attr.aria-labelledby]="ariaLabelledby"\n\t\t\t(change)="onChange($event)"\n\t\t\t(click)="onClick($event)">\n\t\t<div *ngIf="skeleton" class="cds--radio-button cds--skeleton"></div>\n\t\t<label\n\t\t\tclass="cds--radio-button__label"\n\t\t\t[attr.aria-label]="ariaLabel"\n\t\t\t[ngClass]="{\n\t\t\t\t\'cds--skeleton\': skeleton\n\t\t\t}"\n\t\t\t[for]="id"\n\t\t\tid="label-{{id}}">\n\t\t\t<span class="cds--radio-button__appearance"></span>\n\t\t\t<span class="cds--radio-button__label-text">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t\t<ng-container *ngIf="decorator">\n\t\t\t\t\t<div class="cds--radio-button-wrapper-inner--decorator">\n\t\t\t\t\t\t<ng-template [ngTemplateOutlet]="decorator"></ng-template>\n\t\t\t\t\t</div>\n\t\t\t\t</ng-container>\n\t\t\t</span>\n\t\t</label>\n\t',providers:[{provide:fesm2020_forms.JU,useExisting:Radio,multi:!0}]})],Radio);var Subscription=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js");let RadioGroup=class RadioGroup{constructor(){this.orientation="horizontal",this.labelPlacement="right",this.invalid=!1,this.warn=!1,this.change=new core.EventEmitter,this.radioButtonGroupClass=!0,this.isInitialized=!1,this._disabled=!1,this._skeleton=!1,this._value=null,this._selected=null,this._name="radio-group-"+RadioGroup.radioGroupCount++,this.subscription=new Subscription.w0,this.onTouched=()=>{},this.propagateChange=_=>{}}set selected(selected){(this._selected&&this._selected.value)===(selected&&selected.value)||(this._selected&&(this._selected.checked=!1),this._selected=selected,this.value=selected?selected.value:null,this.checkSelectedRadio())}get selected(){return this._selected}set value(newValue){this._value!==newValue&&(this._value=newValue,this.updateSelectedRadioFromValue(),this.checkSelectedRadio())}get value(){return this._value}set name(name){this._name=name,this.updateRadios()}get name(){return this._name}set disabled(disabled){this._disabled=disabled,this.updateRadios()}get disabled(){return this._disabled}get skeleton(){return this._skeleton}set skeleton(value){this._skeleton=value,this.updateChildren()}checkSelectedRadio(){this.selected&&!this._selected.checked&&(this.selected.checked=!0)}updateSelectedRadioFromValue(){let alreadySelected=null!=this._selected&&this._selected.value===this._value;this.radios&&!alreadySelected&&(this.selected&&this.value&&(this.selected.checked=!1),this._selected=null,this.radios.forEach((radio=>{(radio.checked||radio.value===this._value)&&(this._selected=radio)})),this.selected&&!this.value&&(this._value=this.selected.value))}setDisabledState(isDisabled){this.disabled=isDisabled}emitChangeEvent(event){this.change.emit(event),this.propagateChange(event.value),this.onTouched()}updateRadios(){this.radios&&setTimeout((()=>{this.radios.forEach((radio=>{radio.name=this.name,radio.setDisabledFromGroup(this.disabled),"left"===this.labelPlacement&&(radio.labelPlacement="left")}))}))}writeValue(value){this.value=value}ngAfterContentInit(){this.subscription.add(this.radios.changes.subscribe((()=>{this.value&&(this.selected&&(this._selected=null),this.updateSelectedRadioFromValue(),this.checkSelectedRadio()),this.updateRadios(),this.updateRadioChangeHandler()}))),this.value&&(this.updateSelectedRadioFromValue(),this.checkSelectedRadio()),this.updateChildren(),this.updateRadioChangeHandler()}ngAfterViewInit(){this.updateRadios()}ngOnDestroy(){this.subscription.unsubscribe()}registerOnChange(fn){this.propagateChange=fn}registerOnTouched(fn){this.onTouched=fn}focusOut(){this.onTouched()}isTemplate(value){return value instanceof core.TemplateRef}updateChildren(){this.radios&&this.radios.forEach((child=>child.skeleton=this.skeleton))}updateRadioChangeHandler(){this.radios.forEach((radio=>{radio.registerRadioChangeHandler((event=>{(this.selected&&this.selected.value)!==event.value&&(this.selected&&(this.selected.checked=!1),this._selected=event.source,this._value=event.value,this.emitChangeEvent(event))}))}))}};RadioGroup.radioGroupCount=0,RadioGroup.propDecorators={selected:[{type:core.Input}],value:[{type:core.Input}],name:[{type:core.Input}],disabled:[{type:core.Input}],skeleton:[{type:core.Input}],orientation:[{type:core.Input}],labelPlacement:[{type:core.Input}],legend:[{type:core.Input}],decorator:[{type:core.Input}],ariaLabel:[{type:core.Input}],ariaLabelledby:[{type:core.Input}],helperText:[{type:core.Input}],invalid:[{type:core.Input}],invalidText:[{type:core.Input}],warn:[{type:core.Input}],warnText:[{type:core.Input}],change:[{type:core.Output}],radios:[{type:core.ContentChildren,args:[(0,core.forwardRef)((()=>Radio))]}],radioButtonGroupClass:[{type:core.HostBinding,args:["class.cds--form-item"]}],focusOut:[{type:core.HostListener,args:["focusout"]}]},RadioGroup=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-radio-group, ibm-radio-group",template:'\n\t\t<fieldset\n\t\t\tclass="cds--radio-button-group"\n\t\t\t[attr.aria-label]="ariaLabel"\n\t\t\t[attr.aria-labelledby]="ariaLabelledby"\n\t\t\t[ngClass]="{\n\t\t\t\t\'cds--radio-button-group--vertical\': orientation === \'vertical\',\n\t\t\t\t\'cds--radio-button-group--label-left\': labelPlacement === \'left\',\n\t\t\t\t\'cds--radio-button-group--invalid\': invalid,\n\t\t\t\t\'cds--radio-button-group--warning\': !invalid && warn,\n\t\t\t\t\'cds--radio-button-group--decorator\': !!decorator\n\t\t\t}"\n\t\t\t[attr.data-invalid]="invalid ? true : null">\n\t\t\t<legend *ngIf="legend" class="cds--label">\n\t\t\t\t<ng-template *ngIf="isTemplate(legend); else legendLabel;" [ngTemplateOutlet]="legend"></ng-template>\n\t\t\t\t<ng-template #legendLabel>{{legend}}</ng-template>\n\t\t\t\t<ng-container *ngIf="decorator">\n\t\t\t\t\t<div class="cds--radio-button-group-inner--decorator">\n\t\t\t\t\t\t<ng-template [ngTemplateOutlet]="decorator"></ng-template>\n\t\t\t\t\t</div>\n\t\t\t\t</ng-container>\n\t\t\t</legend>\n\t\t\t<ng-content></ng-content>\n\t\t</fieldset>\n\t\t<div class="cds--radio-button__validation-msg">\n\t\t\t<ng-container *ngIf="invalid">\n\t\t\t\t<svg\n\t\t\t\t\tcdsIcon="warning--filled"\n\t\t\t\t\tsize="16"\n\t\t\t\t\tclass="cds--radio-button__invalid-icon">\n\t\t\t\t</svg>\n\t\t\t\t<div class="cds--form-requirement">\n\t\t\t\t\t<ng-container *ngIf="!isTemplate(invalidText)">{{ invalidText }}</ng-container>\n\t\t\t\t\t<ng-template *ngIf="isTemplate(invalidText)" [ngTemplateOutlet]="invalidText"></ng-template>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<ng-container *ngIf="!invalid && warn">\n\t\t\t\t<svg\n\t\t\t\t\tcdsIcon="warning--alt--filled"\n\t\t\t\t\tclass="cds--radio-button__invalid-icon cds--radio-button__invalid-icon--warning"\n\t\t\t\t\tsize="16">\n\t\t\t\t</svg>\n\t\t\t\t<div class="cds--form-requirement">\n\t\t\t\t\t<ng-container *ngIf="!isTemplate(warnText)">{{warnText}}</ng-container>\n\t\t\t\t\t<ng-template *ngIf="isTemplate(warnText)" [ngTemplateOutlet]="warnText"></ng-template>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t</div>\n\t\t<div\n\t\t\t*ngIf="helperText && !invalid && !warn"\n\t\t\tclass="cds--form__helper-text"\n\t\t\t[ngClass]="{\'cds--form__helper-text--disabled\': disabled}">\n\t\t\t<ng-container *ngIf="!isTemplate(helperText)">{{helperText}}</ng-container>\n\t\t\t<ng-template *ngIf="isTemplate(helperText)" [ngTemplateOutlet]="helperText"></ng-template>\n\t\t</div>\n\t',providers:[{provide:fesm2020_forms.JU,useExisting:RadioGroup,multi:!0}]})],RadioGroup);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),icon=__webpack_require__("./src/icon/index.ts");let RadioModule=class RadioModule{};RadioModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Radio,RadioGroup],exports:[Radio,RadioGroup],imports:[common.CommonModule,fesm2020_forms.u5,icon.QX]})],RadioModule)},"./src/search/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{o:()=>Search,t:()=>SearchModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),search_componentngResource=__webpack_require__("./src/search/search.component.html?ngResource"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),fesm2020_forms=__webpack_require__("./node_modules/@angular/forms/fesm2020/forms.mjs"),i18n=__webpack_require__("./src/i18n/index.ts");let Search=class Search{constructor(elementRef,i18n){this.elementRef=elementRef,this.i18n=i18n,this.theme="dark",this.size="md",this.disabled=!1,this.toolbar=!1,this.expandable=!1,this.skeleton=!1,this.active=!1,this.tableSearch=!1,this.id=`search-${Search.searchCount}`,this.value="",this.autocomplete="on",this.label=this.i18n.get().SEARCH.LABEL,this.placeholder=this.i18n.get().SEARCH.PLACEHOLDER,this.clearButtonTitle=this.i18n.get().SEARCH.CLEAR_BUTTON,this.searchTitle="",this.fluid=!1,this.valueChange=new core.EventEmitter,this.open=new core.EventEmitter,this.clear=new core.EventEmitter,this.search=new core.EventEmitter,this.isComposing=!1,this.onTouched=()=>{},this.propagateChange=_=>{},Search.searchCount++}get containerClass(){return!(this.toolbar||this.expandable)}get fluidSkeletonClass(){return this.skeleton&&this.fluid}writeValue(value){this.value=value}registerOnChange(fn){this.propagateChange=fn}registerOnTouched(fn){this.onTouched=fn}onSearch(search){this.isComposing||(this.value=search,this.doValueChange())}onEnter(){this.search.emit(this.value)}clearSearch(){this.value="",this.doValueChange(),this.clear.emit()}doValueChange(){this.propagateChange(this.value),this.valueChange.emit(this.value)}openSearch(){this.active=!0,this.open.emit(this.active),setTimeout((()=>this.inputRef.nativeElement.focus()))}keyDown(event){(this.toolbar||this.expandable)&&("Escape"===event.key?""===this.value&&(this.active=!1,this.open.emit(this.active)):"Enter"===event.key&&this.openSearch()),"Escape"===event.key&&""!==this.value&&this.clearSearch()}focusOut(event){this.onTouched(),(this.expandable||this.toolbar)&&this.inputRef&&""===this.inputRef.nativeElement.value&&!this.elementRef.nativeElement.contains(event.relatedTarget)&&(this.active=!1,this.open.emit(this.active))}focusIn(event){this.onTouched(),!this.expandable&&!this.toolbar||!this.inputRef||event.relatedTarget||this.elementRef.nativeElement.contains(event.relatedTarget)||this.openSearch()}compositionStart(event){this.isComposing=!0}compositionEnd(event){this.isComposing=!1,this.onSearch(this.value+event.data)}};Search.searchCount=0,Search.ctorParameters=()=>[{type:core.ElementRef},{type:i18n.oc}],Search.propDecorators={containerClass:[{type:core.HostBinding,args:["class.cds--form-item"]}],fluidSkeletonClass:[{type:core.HostBinding,args:["class.cds--text-input--fluid__skeleton"]}],theme:[{type:core.Input}],size:[{type:core.Input}],disabled:[{type:core.Input}],toolbar:[{type:core.Input}],expandable:[{type:core.Input}],skeleton:[{type:core.Input}],active:[{type:core.Input}],tableSearch:[{type:core.Input}],name:[{type:core.Input}],id:[{type:core.Input}],required:[{type:core.Input}],value:[{type:core.Input}],autocomplete:[{type:core.Input}],label:[{type:core.Input}],placeholder:[{type:core.Input}],clearButtonTitle:[{type:core.Input}],searchTitle:[{type:core.Input}],ariaLabel:[{type:core.Input}],fluid:[{type:core.Input}],valueChange:[{type:core.Output}],open:[{type:core.Output}],clear:[{type:core.Output}],search:[{type:core.Output}],inputRef:[{type:core.ViewChild,args:["input"]}],keyDown:[{type:core.HostListener,args:["keydown",["$event"]]}],focusOut:[{type:core.HostListener,args:["focusout",["$event"]]}],focusIn:[{type:core.HostListener,args:["focusin",["$event"]]}],compositionStart:[{type:core.HostListener,args:["compositionstart",["$event"]]}],compositionEnd:[{type:core.HostListener,args:["compositionend",["$event"]]}]},Search=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-search, ibm-search",template:search_componentngResource,providers:[{provide:fesm2020_forms.JU,useExisting:Search,multi:!0}]})],Search);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),icon=__webpack_require__("./src/icon/index.ts");let SearchModule=class SearchModule{};SearchModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Search],exports:[Search],imports:[fesm2020_forms.u5,common.CommonModule,i18n.LU,icon.QX]})],SearchModule)},"./src/table/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{iA:()=>Table,jr:()=>table_header_item_class.j,r8:()=>table_item_class.r,G0:()=>table_model_class.G,U$:()=>TableModule,SC:()=>TableRow});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),i18n=__webpack_require__("./src/i18n/index.ts");let TableToolbar=class TableToolbar{constructor(i18n){this.i18n=i18n,this.size="md",this.cancel=new core.EventEmitter,this.actionBarLabel=this.i18n.getOverridable("TABLE_TOOLBAR.ACTION_BAR"),this._cancelText=this.i18n.getOverridable("TABLE_TOOLBAR.CANCEL"),this._batchTextLegacy=this.i18n.getOverridable("TABLE_TOOLBAR.BATCH_TEXT"),this._batchTextSingle=this.i18n.getOverridable("TABLE_TOOLBAR.BATCH_TEXT_SINGLE"),this._batchTextMultiple=this.i18n.getOverridable("TABLE_TOOLBAR.BATCH_TEXT_MULTIPLE")}set batchText(value){"object"==typeof value?(this._batchTextSingle.override(value.SINGLE),this._batchTextMultiple.override(value.MULTIPLE)):this._batchTextLegacy.override(value)}set ariaLabel(value){this.actionBarLabel.override(value.ACTION_BAR)}set cancelText(value){this._cancelText.override(value.CANCEL)}get cancelText(){return{CANCEL:this._cancelText.value}}get count(){return this.model.totalDataLength>0?this.model.rowsSelected.reduce(((previous,current)=>previous+(current?1:0)),0):0}get selected(){return this.model.totalDataLength>0&&this.model.rowsSelected.some((item=>item))}onCancel(){this.model.selectAll(!1),this.cancel.emit()}};TableToolbar.ctorParameters=()=>[{type:i18n.oc}],TableToolbar.propDecorators={model:[{type:core.Input}],batchText:[{type:core.Input}],ariaLabel:[{type:core.Input}],cancelText:[{type:core.Input}],size:[{type:core.Input}],cancel:[{type:core.Output}]},TableToolbar=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-table-toolbar, ibm-table-toolbar",template:'\n\t<section\n\t\tclass="cds--table-toolbar"\n\t\t[ngClass]="{\'cds--table-toolbar--sm\' : size === \'sm\'}"\n\t\t[attr.aria-label]="actionBarLabel.subject | async">\n\t\t<div\n\t\t\t*ngIf="model"\n\t\t\tclass="cds--batch-actions"\n\t\t\t[ngClass]="{\n\t\t\t\t\'cds--batch-actions--active\': selected\n\t\t\t}">\n\t\t\t<div class="cds--batch-summary">\n\t\t\t\t<p class="cds--batch-summary__para" *ngIf="count as n">\n\t\t\t\t\t<ng-container *ngIf="_batchTextLegacy.subject | async as legacyText; else batchTextBlock">\n\t\t\t\t\t\t<span>{{n}}</span> {{legacyText}}\n\t\t\t\t\t</ng-container>\n\t\t\t\t\t<ng-template #batchTextBlock>\n\t\t\t\t\t\t<span *ngIf="n === 1">{{_batchTextSingle.subject | async}}</span>\n\t\t\t\t\t\t<span *ngIf="n !== 1">{{_batchTextMultiple.subject | i18nReplace: {count: n} | async}}</span>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</p>\n\t\t\t</div>\n\t\t\t<div class="cds--action-list">\n\t\t\t\t<ng-content select="cds-table-toolbar-actions,ibm-table-toolbar-actions"></ng-content>\n\t\t\t\t<button\n\t\t\t\t\tcdsButton="primary"\n\t\t\t\t\tclass="cds--batch-summary__cancel"\n\t\t\t\t\t[tabindex]="selected ? 0 : -1"\n\t\t\t\t\t(click)="onCancel()">\n\t\t\t\t\t{{_cancelText.subject | async}}\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t</div>\n\t\t<ng-content></ng-content>\n\t</section>\n\t'})],TableToolbar);let TableToolbarActions=class TableToolbarActions{};TableToolbarActions=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-table-toolbar-actions, ibm-table-toolbar-actions",template:"<ng-content></ng-content>"})],TableToolbarActions);var search_componentngResource=__webpack_require__("./src/search/search.component.html?ngResource"),search=__webpack_require__("./src/search/index.ts"),fesm2020_forms=__webpack_require__("./node_modules/@angular/forms/fesm2020/forms.mjs");let TableToolbarSearch=class TableToolbarSearch extends search.o{constructor(){super(...arguments),this.tableSearch=!0,this.size="lg",this.hostClass=!0}ngAfterViewInit(){setTimeout((()=>{this.value&&this.openSearch()}))}};TableToolbarSearch.propDecorators={hostClass:[{type:core.HostBinding,args:["class.cds--toolbar-content"]}]},TableToolbarSearch=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-table-toolbar-search, ibm-table-toolbar-search",template:search_componentngResource,providers:[{provide:fesm2020_forms.JU,useExisting:TableToolbarSearch,multi:!0}]})],TableToolbarSearch);let TableToolbarContent=class TableToolbarContent{constructor(){this.class=!0}};TableToolbarContent.propDecorators={class:[{type:core.HostBinding,args:["class.cds--toolbar-content"]}]},TableToolbarContent=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-table-toolbar-content, ibm-table-toolbar-content",template:"<ng-content></ng-content>"})],TableToolbarContent);let TableHeaderDescription=class TableHeaderDescription{constructor(){this.id="table-description-"+TableHeaderDescription.counter++,this.descriptionClass=!0}};TableHeaderDescription.counter=0,TableHeaderDescription.propDecorators={id:[{type:core.HostBinding,args:["attr.id"]},{type:core.Input}],descriptionClass:[{type:core.HostBinding,args:["class.cds--data-table-header__description"]}]},TableHeaderDescription=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsTableHeaderDescription], [ibmTableHeaderDescription]"})],TableHeaderDescription);let TableHeaderTitle=class TableHeaderTitle{constructor(){this.id="table-title-"+TableHeaderTitle.counter++,this.titleClass=!0}};TableHeaderTitle.counter=0,TableHeaderTitle.propDecorators={id:[{type:core.HostBinding,args:["attr.id"]},{type:core.Input}],titleClass:[{type:core.HostBinding,args:["class.cds--data-table-header__title"]}]},TableHeaderTitle=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsTableHeaderTitle], [ibmTableHeaderTitle]"})],TableHeaderTitle);var TableDomSpanDirection,Subscription=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),fromEvent=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/observable/fromEvent.js"),table_model_class=__webpack_require__("./src/table/table-model.class.ts"),table_header_item_class=__webpack_require__("./src/table/table-header-item.class.ts"),table_item_class=__webpack_require__("./src/table/table-item.class.ts"),tab_service=__webpack_require__("./src/common/tab.service.ts"),utils=__webpack_require__("./src/utils/index.ts"),BehaviorSubject=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/BehaviorSubject.js"),combineLatest=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/observable/combineLatest.js"),map=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/operators/map.js");class DataGridInteractionModel{constructor(keyboardEventStream,clickEventStream,tableAdapter){this.keyboardEventStream=keyboardEventStream,this.clickEventStream=clickEventStream,this.tableAdapter=tableAdapter,this.rowSubject=new BehaviorSubject.X({current:0,previous:-1}),this.columnSubject=new BehaviorSubject.X({current:0,previous:-1}),this.rowIndex=this.rowSubject.asObservable(),this.columnIndex=this.columnSubject.asObservable(),this.position=(0,combineLatest.a)(this.rowIndex,this.columnIndex).pipe((0,map.U)((positions=>{const[row,column]=positions;return{current:[row.current,column.current],previous:[row.previous,column.previous]}}))),this.keyboardEventStream.subscribe(this.handleKeyboardEvent.bind(this)),this.clickEventStream.subscribe(this.handleClickEvent.bind(this))}get currentRow(){return this.rowSubject.getValue().current}get currentColumn(){return this.columnSubject.getValue().current}get lastColumn(){return this.tableAdapter.lastColumnIndex}get lastRow(){return this.tableAdapter.lastRowIndex}handleKeyboardEvent(event){const currentCell=this.tableAdapter.getCell(this.currentRow,this.currentColumn);let currentColumn=this.tableAdapter.findColumnIndex(currentCell),currentRow=this.tableAdapter.findRowIndex(currentCell);switch(event.key){case"ArrowRight":event.preventDefault(),this.goToColumn(currentColumn+currentCell.colSpan);break;case"ArrowLeft":event.preventDefault(),this.goToColumn(currentColumn-1);break;case"ArrowDown":event.preventDefault(),this.goToRow(currentRow+currentCell.rowSpan);break;case"ArrowUp":event.preventDefault(),this.goToRow(currentRow-1);break;case"Home":event.preventDefault(),event.ctrlKey?this.goTo({row:0,column:0}):this.goToColumn(0);break;case"End":event.preventDefault(),event.ctrlKey?this.goTo({row:this.lastRow,column:this.lastColumn}):this.goToColumn(this.lastColumn)}}handleClickEvent(event){const cell=event.target.closest("td, th"),[rowIndex,cellIndex]=this.tableAdapter.findIndex(cell);this.goTo({row:rowIndex,column:cellIndex})}goToColumn(index){index>this.lastColumn||index<0||this.goTo({row:this.currentRow,column:index})}goToRow(index){index>this.lastRow||index<0||this.goTo({row:index,column:this.currentColumn})}goTo({row,column}){this.rowSubject.next({current:row,previous:this.currentRow}),this.columnSubject.next({current:column,previous:this.currentColumn})}resetTabIndexes(newTabIndex=-1){for(let i=0;i<this.tableAdapter.lastRowIndex;i++){const row=this.tableAdapter.getRow(i);for(const cell of Array.from(row.cells)){(0,tab_service.ZW)(cell,tab_service.X9).forEach((node=>node.tabIndex=newTabIndex)),cell.tabIndex=newTabIndex}}this.reset()}reset(){this.rowSubject.next({current:0,previous:-1}),this.columnSubject.next({current:0,previous:-1})}}!function(TableDomSpanDirection){TableDomSpanDirection.colSpan="colSpan",TableDomSpanDirection.rowSpan="rowSpan"}(TableDomSpanDirection||(TableDomSpanDirection={}));class TableDomAdapter{constructor(tableElement){this.tableElement=tableElement}get lastColumnIndex(){return this.getRealRowLength(this.tableElement.rows[0])}get lastRowIndex(){return this.tableElement.rows.length-1}getCell(row,column){const col=this.getColumn(column);return this.findCellInColumn(col,row).cell}getColumn(column){const firstHeader=Array.from(this.tableElement.rows[0].cells),{cell:header,realIndex:realColumnIndex}=this.findCellInRow(firstHeader,column),linkedCells=[];for(let i=1;i<this.tableElement.rows.length;i++){const linkedRowCells=this.tableElement.rows[i].querySelectorAll(`[headers~='${header.id}']`);if(linkedRowCells.length>1){const{cell}=this.findCellInRow(Array.from(linkedRowCells),column-realColumnIndex);linkedCells.push(cell)}else linkedRowCells[0]&&linkedCells.push(linkedRowCells[0])}return linkedCells?[header,...linkedCells]:[]}getRow(row){return this.tableElement.rows[row]}findColumnIndex(cell){const row=this.getRow(this.findRowIndex(cell));if(!row)return;if(cell&&cell.headers){const ids=cell.headers.split(" "),headerRows=Array.from(this.tableElement.tHead.rows),indexes=[];for(const headerRow of headerRows.reverse()){const headerCells=Array.from(headerRow.cells),header=headerCells.find((headerCell=>ids.includes(headerCell.id)));if(header){let cellIndex=0;for(const c of headerCells){if(c===header)break;cellIndex+=c.colSpan}indexes.push(cellIndex)}}const firstIndex=indexes.sort(((a,b)=>b-a))[0];let similarCells=[];for(const id of ids){const rowCells=Array.from(row.querySelectorAll(`[headers~='${id}']`));for(const rowCell of rowCells)similarCells.includes(rowCell)||similarCells.push(rowCell)}return similarCells=similarCells.sort(((a,b)=>a.cellIndex-b.cellIndex)),firstIndex+similarCells.indexOf(cell)}let cellIndex=0;for(const c of Array.from(row.cells)){if(c===cell)break;cellIndex+=c.colSpan}return cellIndex}findRowIndex(cell){for(const row of Array.from(this.tableElement.rows))if(row.contains(cell))return row.rowIndex}findIndex(cell){return[this.findRowIndex(cell),this.findColumnIndex(cell)]}getRealRowLength(row){return Array.from(row.cells).reduce(((count,cell)=>count+cell.colSpan),-1)}findCell(cells,targetIndex,spanDirection){let realIndex=0;for(let i=0;i<targetIndex&&(i+=cells[realIndex][spanDirection],!(i>targetIndex));)realIndex++;return{cell:cells[realIndex],realIndex}}findCellInRow(row,index){return this.findCell(row,index,TableDomSpanDirection.colSpan)}findCellInColumn(col,index){return this.findCell(col,index,TableDomSpanDirection.rowSpan)}}let Table=class Table{constructor(elementRef,applicationRef,i18n){this.elementRef=elementRef,this.applicationRef=applicationRef,this.i18n=i18n,this.size="md",this.skeleton=!1,this.sortable=!0,this.noBorder=!0,this.showExpandAllToggle=!1,this.showSelectionColumn=!0,this.enableSingleSelect=!1,this.scrollLoadDistance=0,this.striped=!0,this.withRowAILabels=!1,this.tableContent=!0,this.stickyHeader=!1,this.sort=new core.EventEmitter,this.selectAll=new core.EventEmitter,this.deselectAll=new core.EventEmitter,this.selectRow=new core.EventEmitter,this.deselectRow=new core.EventEmitter,this.rowClick=new core.EventEmitter,this.scrollLoad=new core.EventEmitter,this.selectAllCheckbox=!1,this.selectAllCheckboxSomeSelected=!1,this.isColumnDragging=!1,this.columnDraggedHoverIndex=-1,this.columnDraggedPosition="",this._isDataGrid=!1,this.isViewReady=!1,this.subscriptions=new Subscription.w0,this._expandButtonAriaLabel=this.i18n.getOverridable("TABLE.EXPAND_BUTTON"),this._sortDescendingLabel=this.i18n.getOverridable("TABLE.SORT_DESCENDING"),this._sortAscendingLabel=this.i18n.getOverridable("TABLE.SORT_ASCENDING"),this._checkboxHeaderLabel=this.i18n.getOverridable("TABLE.CHECKBOX_HEADER"),this._checkboxRowLabel=this.i18n.getOverridable("TABLE.CHECKBOX_ROW"),this._endOfDataText=this.i18n.getOverridable("TABLE.END_OF_DATA"),this._scrollTopText=this.i18n.getOverridable("TABLE.SCROLL_TOP"),this._filterTitle=this.i18n.getOverridable("TABLE.FILTER")}static skeletonModel(rowCount,columnCount){const model=new table_model_class.G;let header=new Array,data=new Array,row=new Array;for(let i=0;i<columnCount;i++)header.push(new table_header_item_class.j),row.push(new table_item_class.r);for(let i=0;i<rowCount-1;i++)data.push(row);return model.header=header,model.data=data,model}static setTabIndex(element,index){const focusElementList=(0,tab_service.ZW)(element,tab_service.X9);element.firstElementChild&&element.firstElementChild.classList.contains("cds--table-sort")&&focusElementList.length>1?focusElementList[1].tabIndex=index:focusElementList.length>0?focusElementList[0].tabIndex=index:element.tabIndex=index}static focus(element){const focusElementList=(0,tab_service.ZW)(element,tab_service.X9);element.firstElementChild?.classList.contains("cds--table-sort")&&focusElementList.length>1||focusElementList.length>0?focusElementList[0].focus():element.focus()}set model(m){this._model&&(this.subscriptions.unsubscribe(),this.subscriptions=new Subscription.w0),this._model=m;const rowsChange=this._model.rowsSelectedChange.subscribe((()=>this.updateSelectAllCheckbox())),dataChange=this._model.dataChange.subscribe((()=>{this.isDataGrid&&this.resetTabIndex(),this.updateSelectAllCheckbox()}));if(this.subscriptions.add(rowsChange),this.subscriptions.add(dataChange),this.isDataGrid){const expandedChange=this._model.rowsExpandedChange.subscribe((()=>{setTimeout((()=>{const expandedRows=this.elementRef.nativeElement.querySelectorAll(".cds--expandable-row:not(.cds--parent-row)");Array.from(expandedRows).forEach((row=>{void 0!==row.firstElementChild.tabIndex&&-1===row.firstElementChild.tabIndex||(row.firstElementChild.tabIndex=-1)}))}))}));this.subscriptions.add(expandedChange)}}get model(){return this._model}set isDataGrid(value){this._isDataGrid=value,this.isViewReady&&(value?this.enableDataGridInteractions():this.disableDataGridInteractions())}get isDataGrid(){return this._isDataGrid}set expandButtonAriaLabel(value){this._expandButtonAriaLabel.override(value)}get expandButtonAriaLabel(){return this._expandButtonAriaLabel.value}set sortDescendingLabel(value){this._sortDescendingLabel.override(value)}get sortDescendingLabel(){return this._sortDescendingLabel.value}set sortAscendingLabel(value){this._sortAscendingLabel.override(value)}get sortAscendingLabel(){return this._sortAscendingLabel.value}set translations(value){const valueWithDefaults=(0,utils.TS)(this.i18n.getMultiple("TABLE"),value);this._filterTitle.override(valueWithDefaults.FILTER),this._endOfDataText.override(valueWithDefaults.END_OF_DATA),this._scrollTopText.override(valueWithDefaults.SCROLL_TOP),this._checkboxHeaderLabel.override(valueWithDefaults.CHECKBOX_HEADER),this._checkboxRowLabel.override(valueWithDefaults.CHECKBOX_ROW)}get noData(){return!this.model.data||0===this.model.data.length||1===this.model.data.length&&0===this.model.data[0].length}ngOnInit(){this.updateSelectAllCheckbox()}ngAfterViewInit(){this.isViewReady=!0,this.isDataGrid&&this.enableDataGridInteractions()}ngOnDestroy(){this.subscriptions.unsubscribe(),this.positionSubscription&&this.positionSubscription.unsubscribe()}enableDataGridInteractions(){if(this.interactionModel)return;const table=this.elementRef.nativeElement.querySelector("table"),tableAdapter=new TableDomAdapter(table),keydownEventStream=(0,fromEvent.R)(table,"keydown"),clickEventStream=(0,fromEvent.R)(table,"click");this.interactionModel=new DataGridInteractionModel(keydownEventStream,clickEventStream,tableAdapter),this.positionSubscription=this.interactionModel.position.subscribe((event=>{const[currentRow,currentColumn]=event.current,[previousRow,previousColumn]=event.previous,currentElement=tableAdapter.getCell(currentRow,currentColumn);if(Table.setTabIndex(currentElement,0),-1!==previousRow&&-1!==previousColumn){if(previousRow!==currentRow||previousColumn!==currentColumn){const previousElement=tableAdapter.getCell(previousRow,previousColumn);Table.setTabIndex(previousElement,-1)}Table.focus(currentElement)}})),this.resetTabIndex()}disableDataGridInteractions(){this.positionSubscription&&this.positionSubscription.unsubscribe(),this.resetTabIndex(0),this.interactionModel=null}onSelectAll(){this.model.selectAll(!0),this.selectAll.emit(this.model)}onDeselectAll(){this.model.selectAll(!1),this.deselectAll.emit(this.model)}onSelectRow(event){Object.keys(event).includes("selectedRowIndex")?(this.enableSingleSelect&&this.model.selectAll(!1),this.model.selectRow(event.selectedRowIndex,!0),this.selectRow.emit(event)):(this.model.selectRow(event.deselectedRowIndex,!1),this.deselectRow.emit(event))}onRowClick(index){this.rowClick.emit(index)}updateSelectAllCheckbox(){const selectedRowsCount=this.model.selectedRowsCount();selectedRowsCount<=0?(this.selectAllCheckbox=!1,this.selectAllCheckboxSomeSelected=!1):selectedRowsCount<this.model.data.length?(this.selectAllCheckbox=!0,this.selectAllCheckboxSomeSelected=!0):(this.selectAllCheckbox=!0,this.selectAllCheckboxSomeSelected=!1)}resetTabIndex(newTabIndex=-1){setTimeout((()=>{const focusElementList=(0,tab_service.ZW)(this.elementRef.nativeElement,tab_service.X9);focusElementList&&focusElementList.forEach((tabbable=>{tabbable.tabIndex=newTabIndex})),this.interactionModel&&this.interactionModel.resetTabIndexes(newTabIndex)}))}columnResizeStart(event,column){this.columnResizeWidth=parseInt(column.style.width,10),this.columnResizeMouseX=event.clientX,event.preventDefault(),this.mouseMoveSubscription=(0,fromEvent.R)(document.body,"mousemove").subscribe((event=>{this.columnResizeProgress(event,column)})),this.mouseUpSubscription=(0,fromEvent.R)(document.body,"mouseup").subscribe((event=>{this.columnResizeEnd(event,column)}))}columnResizeProgress(event,column){const move=event.clientX-this.columnResizeMouseX;column.style.width=`${this.columnResizeWidth+move}px`}columnResizeEnd(event,column){this.mouseMoveSubscription.unsubscribe(),this.mouseUpSubscription.unsubscribe()}onScroll(event){event.target.scrollHeight-event.target.clientHeight-event.target.scrollTop<=this.scrollLoadDistance?this.scrollLoad.emit(this.model):this.model.isEnd=!1}columnDragStart(event,columnIndex){this.isColumnDragging=!0,this.columnDraggedHoverIndex=columnIndex,event.dataTransfer.setData("columnIndex",JSON.stringify(columnIndex))}columnDragEnd(event,columnIndex){this.isColumnDragging=!1,this.columnDraggedHoverIndex=-1}columnDragEnter(event,position,columnIndex){this.columnDraggedPosition=position,this.columnDraggedHoverIndex=columnIndex}columnDragLeave(event,position,columnIndex){this.columnDraggedPosition=""}columnDragover(event,position,columnIndex){this.columnDraggedHoverIndex=columnIndex,this.columnDraggedPosition=position,event.preventDefault()}columnDrop(event,position,columnIndex){this.isColumnDragging=!1,this.columnDraggedHoverIndex=-1,this.columnDraggedPosition="",this.model.moveColumn(parseInt(event.dataTransfer.getData("columnIndex"),10),columnIndex+("right"===position?1:0))}doSort(index){0===this.sort.observers.length&&(this.model.cycleSortState(index),this.model.sort(index)),this.sort.emit(index)}scrollToTop(event){event.target.parentElement.parentElement.parentElement.parentElement.children[1].scrollTop=0,this.model.isEnd=!1}getSelectionLabelValue(row){return this.selectionLabelColumn?{value:row[this.selectionLabelColumn].data}:{value:this.i18n.get().TABLE.ROW}}getExpandButtonAriaLabel(){return this._expandButtonAriaLabel.subject}getSortDescendingLabel(){return this._sortDescendingLabel.subject}getSortAscendingLabel(){return this._sortAscendingLabel.subject}getCheckboxHeaderLabel(){return this._checkboxHeaderLabel.subject}getCheckboxRowLabel(){return this._checkboxRowLabel.subject}getEndOfDataText(){return this._endOfDataText.subject}getScrollTopText(){return this._scrollTopText.subject}getFilterTitle(){return this._filterTitle.subject}};Table.ctorParameters=()=>[{type:core.ElementRef},{type:core.ApplicationRef},{type:i18n.oc}],Table.propDecorators={ariaLabelledby:[{type:core.Input}],ariaDescribedby:[{type:core.Input}],model:[{type:core.Input}],size:[{type:core.Input}],skeleton:[{type:core.Input}],isDataGrid:[{type:core.Input}],sortable:[{type:core.Input}],noBorder:[{type:core.Input}],showExpandAllToggle:[{type:core.Input}],showSelectionColumn:[{type:core.Input}],enableSingleSelect:[{type:core.Input}],scrollLoadDistance:[{type:core.Input}],expandButtonAriaLabel:[{type:core.Input}],sortDescendingLabel:[{type:core.Input}],sortAscendingLabel:[{type:core.Input}],translations:[{type:core.Input}],striped:[{type:core.Input}],withRowAILabels:[{type:core.Input}],tableContent:[{type:core.HostBinding,args:["class.cds--data-table-content"]}],stickyHeader:[{type:core.HostBinding,args:["class.cds--data-table_inner-container"]},{type:core.Input}],footerTemplate:[{type:core.Input}],selectionLabelColumn:[{type:core.Input}],sort:[{type:core.Output}],selectAll:[{type:core.Output}],deselectAll:[{type:core.Output}],selectRow:[{type:core.Output}],deselectRow:[{type:core.Output}],rowClick:[{type:core.Output}],scrollLoad:[{type:core.Output}]},Table=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-table, ibm-table",template:'\n\t<table\n\t\tcdsTable\n\t\t[sortable]="sortable"\n\t\t[noBorder]="noBorder"\n\t\t[ngClass]="{\'cds--data-table--sticky-header\': stickyHeader}"\n\t\t[size]="size"\n\t\t[striped]="striped"\n\t\t[skeleton]="skeleton"\n\t\t[attr.aria-labelledby]="ariaLabelledby"\n\t\t[attr.aria-describedby]="ariaDescribedby">\n\t\t<thead\n\t\t\tcdsTableHead\n\t\t\t[sortable]="sortable"\n\t\t\t(deselectAll)="onDeselectAll()"\n\t\t\t(selectAll)="onSelectAll()"\n\t\t\t(expandAllRows)="model.expandAllRows(true)"\n\t\t\t(collapseAllRows)="model.expandAllRows(false)"\n\t\t\t(sort)="doSort($event)"\n\t\t\t[checkboxHeaderLabel]="getCheckboxHeaderLabel()"\n\t\t\t[filterTitle]="getFilterTitle()"\n\t\t\t[model]="model"\n\t\t\t[selectAllCheckbox]="selectAllCheckbox"\n\t\t\t[selectAllCheckboxSomeSelected]="selectAllCheckboxSomeSelected"\n\t\t\t[showSelectionColumn]="showSelectionColumn"\n\t\t\t[enableSingleSelect]="enableSingleSelect"\n\t\t\t[showExpandAllToggle]="showExpandAllToggle"\n\t\t\t[skeleton]="skeleton"\n\t\t\t[sortAscendingLabel]="sortAscendingLabel"\n\t\t\t[sortDescendingLabel]="sortDescendingLabel"\n\t\t\t[stickyHeader]="stickyHeader"\n\t\t\t[withRowAILabels]="withRowAILabels">\n\t\t</thead>\n\t\t<tbody\n\t\t\tcdsTableBody\n\t\t\t(deselectRow)="onSelectRow($event)"\n\t\t\t(scroll)="onScroll($event)"\n\t\t\t(selectRow)="onSelectRow($event)"\n\t\t\t[checkboxRowLabel]="getCheckboxRowLabel()"\n\t\t\t[enableSingleSelect]="enableSingleSelect"\n\t\t\t(rowClick)="onRowClick($event)"\n\t\t\t[expandButtonAriaLabel]="expandButtonAriaLabel"\n\t\t\t[model]="model"\n\t\t\t[size]="size"\n\t\t\t[ngStyle]="{\'overflow-y\': \'scroll\'}"\n\t\t\t[selectionLabelColumn]="selectionLabelColumn"\n\t\t\t[showSelectionColumn]="showSelectionColumn"\n\t\t\t[skeleton]="skeleton"\n\t\t\t[withRowAILabels]="withRowAILabels"\n\t\t\t*ngIf="!noData; else noDataTemplate">\n\t\t</tbody>\n\t\t<ng-template #noDataTemplate><ng-content></ng-content></ng-template>\n\t\t<tfoot>\n\t\t\t<ng-template\n\t\t\t\t[ngTemplateOutlet]="footerTemplate">\n\t\t\t</ng-template>\n\t\t\t<tr *ngIf="this.model.isLoading">\n\t\t\t\t<td class="table_loading-indicator">\n\t\t\t\t\t<div class="cds--loading cds--loading--small">\n\t\t\t\t\t\t<svg class="cds--loading__svg" viewBox="-75 -75 150 150">\n\t\t\t\t\t\t\t<circle class="cds--loading__stroke" cx="0" cy="0" r="37.5" />\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t</div>\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t\t<tr *ngIf="this.model.isEnd">\n\t\t\t\t<td class="table_end-indicator">\n\t\t\t\t\t<h5>{{getEndOfDataText() | async}}</h5>\n\t\t\t\t\t<button (click)="scrollToTop($event)" class="btn--secondary-sm">\n\t\t\t\t\t\t{{getScrollTopText() | async}}\n\t\t\t\t\t</button>\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t</tfoot>\n\t</table>\n\t',styles:["\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t}\n\t"]})],Table);let TableContainer=class TableContainer{constructor(){this.containerClass=!0,this.aiEnabled=!1}ngAfterContentInit(){this.table&&(this.table.ariaLabelledby=this.headerTitle?.id,this.table.ariaDescribedby=this.headerDescription?.id)}};TableContainer.propDecorators={containerClass:[{type:core.HostBinding,args:["class.cds--data-table-container"]}],aiEnabled:[{type:core.Input},{type:core.HostBinding,args:["class.cds--data-table-container--ai-enabled"]}],headerTitle:[{type:core.ContentChild,args:[TableHeaderTitle]}],headerDescription:[{type:core.ContentChild,args:[TableHeaderDescription]}],table:[{type:core.ContentChild,args:[Table]}]},TableContainer=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-table-container, ibm-table-container",template:"<ng-content></ng-content>"})],TableContainer);let TableHeaderDecorator=class TableHeaderDecorator{};TableHeaderDecorator=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-table-header-decorator, ibm-table-header-decorator",template:'\n\t\t<div class="cds--data-table-header__decorator">\n\t\t\t<ng-content></ng-content>\n\t\t</div>\n\t'})],TableHeaderDecorator);let TableHeader=class TableHeader{constructor(){this.headerClass=!0,this.displayStyle="block",this.hasDecorator=!1,this.decoratorStandalone=!1}ngAfterContentInit(){this.hasDecorator=!!this.decorator,this.decoratorStandalone=this.hasDecorator&&!this.headerTitle&&!this.headerDescription,this.displayStyle=this.hasDecorator?"flex":"block"}};TableHeader.propDecorators={headerClass:[{type:core.HostBinding,args:["class.cds--data-table-header"]}],displayStyle:[{type:core.HostBinding,args:["style.display"]}],hasDecorator:[{type:core.HostBinding,args:["class.cds--data-table-header__with-decorator"]}],decoratorStandalone:[{type:core.HostBinding,args:["class.cds--data-table-header__with-decorator--standalone"]}],decorator:[{type:core.ContentChild,args:[TableHeaderDecorator]}],headerTitle:[{type:core.ContentChild,args:[TableHeaderTitle]}],headerDescription:[{type:core.ContentChild,args:[TableHeaderDescription]}]},TableHeader=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-table-header, ibm-table-header",template:'\n\t\t<div class="cds--data-table-header__content">\n\t\t\t<ng-content></ng-content>\n\t\t</div>\n\t\t<ng-content select="cds-table-header-decorator, ibm-table-header-decorator"></ng-content>\n\t'})],TableHeader);let TableHeadCellLabel=class TableHeadCellLabel{constructor(){this.baseClass=!0}};TableHeadCellLabel.propDecorators={baseClass:[{type:core.HostBinding,args:["class.cds--table-header-label"]}]},TableHeadCellLabel=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsTableHeadCellLabel], [ibmTableHeadCellLabel]"})],TableHeadCellLabel);let ExpandedRowHover=class ExpandedRowHover{addHoverClass(event){event.target.previousElementSibling.classList.add("cds--expandable-row--hover")}removeHoverClass(event){event.target.previousElementSibling.classList.remove("cds--expandable-row--hover")}};ExpandedRowHover.propDecorators={addHoverClass:[{type:core.HostListener,args:["mouseenter",["$event"]]}],removeHoverClass:[{type:core.HostListener,args:["mouseleave",["$event"]]}]},ExpandedRowHover=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsExpandedRowHover], [ibmExpandedRowHover]"})],ExpandedRowHover);let TableDirective=class TableDirective{constructor(){this.sortable=!0,this.noBorder=!0,this.striped=!1,this.skeleton=!1,this.size="md",this.tableClass=!0}get extraSmallSize(){return"xs"===this.size}get smallSize(){return"sm"===this.size}get mediumSize(){return"md"===this.size}get LargeSize(){return"lg"===this.size}get extraLargeSize(){return"xl"===this.size}};TableDirective.propDecorators={sortable:[{type:core.Input},{type:core.HostBinding,args:["class.cds--data-table--sort"]}],noBorder:[{type:core.Input},{type:core.HostBinding,args:["class.cds--data-table--no-border"]}],striped:[{type:core.Input},{type:core.HostBinding,args:["class.cds--data-table--zebra"]}],skeleton:[{type:core.Input},{type:core.HostBinding,args:["class.cds--skeleton"]}],size:[{type:core.Input}],tableClass:[{type:core.HostBinding,args:["class.cds--data-table"]}],extraSmallSize:[{type:core.HostBinding,args:["class.cds--data-table--xs"]}],smallSize:[{type:core.HostBinding,args:["class.cds--data-table--sm"]}],mediumSize:[{type:core.HostBinding,args:["class.cds--data-table--md"]}],LargeSize:[{type:core.HostBinding,args:["class.cds--data-table--lg"]}],extraLargeSize:[{type:core.HostBinding,args:["class.cds--data-table--xl"]}]},TableDirective=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsTable], [ibmTable]"})],TableDirective);let TableHead=class TableHead{constructor(i18n){this.i18n=i18n,this.showSelectionColumn=!0,this.enableSingleSelect=!1,this.selectAllCheckboxSomeSelected=!1,this.selectAllCheckbox=!1,this.skeleton=!1,this.stickyHeader=!1,this.showExpandAllToggle=!1,this.sortable=!0,this.withRowAILabels=!1,this.sort=new core.EventEmitter,this.selectAll=new core.EventEmitter,this.deselectAll=new core.EventEmitter,this.expandAllRows=new core.EventEmitter,this.collapseAllRows=new core.EventEmitter,this.scrollbarWidth=0,this._checkboxHeaderLabel=this.i18n.getOverridable("TABLE.CHECKBOX_HEADER"),this._sortDescendingLabel=this.i18n.getOverridable("TABLE.SORT_DESCENDING"),this._sortAscendingLabel=this.i18n.getOverridable("TABLE.SORT_ASCENDING"),this._filterTitle=this.i18n.getOverridable("TABLE.FILTER")}set checkboxHeaderLabel(value){this._checkboxHeaderLabel.override(value)}get checkboxHeaderLabel(){return this._checkboxHeaderLabel.value}set sortDescendingLabel(value){this._sortDescendingLabel.override(value)}get sortDescendingLabel(){return this._sortDescendingLabel.value}set sortAscendingLabel(value){this._sortAscendingLabel.override(value)}get sortAscendingLabel(){return this._sortAscendingLabel.value}set filterTitle(value){this._filterTitle.override(value)}get filterTitle(){return this._filterTitle.value}ngAfterViewInit(){setTimeout((()=>{this.scrollbarWidth=(0,utils.np)()}))}onSelectAllCheckboxChange(){this.selectAllCheckbox||this.selectAllCheckboxSomeSelected?this.deselectAll.emit(this.model):this.selectAll.emit(this.model)}onExpandAllRowsChange(expand){expand?this.expandAllRows.emit(this.model):this.collapseAllRows.emit(this.model)}getCheckboxHeaderLabel(){return this._checkboxHeaderLabel.subject}getSortDescendingLabel(){return this._sortDescendingLabel.subject}getSortAscendingLabel(){return this._sortAscendingLabel.subject}getFilterTitle(){return this._filterTitle.subject}};TableHead.ctorParameters=()=>[{type:i18n.oc}],TableHead.propDecorators={model:[{type:core.Input}],showSelectionColumn:[{type:core.Input}],enableSingleSelect:[{type:core.Input}],selectAllCheckboxSomeSelected:[{type:core.Input}],selectAllCheckbox:[{type:core.Input}],skeleton:[{type:core.Input}],stickyHeader:[{type:core.Input}],showExpandAllToggle:[{type:core.Input}],sortable:[{type:core.Input}],withRowAILabels:[{type:core.Input}],checkboxHeaderLabel:[{type:core.Input}],sortDescendingLabel:[{type:core.Input}],sortAscendingLabel:[{type:core.Input}],filterTitle:[{type:core.Input}],sort:[{type:core.Output}],selectAll:[{type:core.Output}],deselectAll:[{type:core.Output}],expandAllRows:[{type:core.Output}],collapseAllRows:[{type:core.Output}]},TableHead=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableHead], [ibmTableHead]",template:'\n\t<ng-container *ngIf="model">\n\t\t<tr>\n\t\t\t<th\n\t\t\t\t*ngIf="withRowAILabels && model.header[0] && model.header[0].visible"\n\t\t\t\t[ngStyle]="model.header[0].style"\n\t\t\t\tcdsTableHeadCell\n\t\t\t\tscope="col"\n\t\t\t\t[class]="model.header[0].className"\n\t\t\t\t[sortable]="sortable"\n\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t[id]="model.getId(0)"\n\t\t\t\t[column]="model.header[0]"\n\t\t\t\t[filterTitle]="getFilterTitle()"\n\t\t\t\t[attr.colspan]="model.header[0].colSpan"\n\t\t\t\t[attr.rowspan]="model.header[0].rowSpan"\n\t\t\t\t(sort)="sort.emit(0)">\n\t\t\t</th>\n\t\t\t<th\n\t\t\t\tcdsTableHeadExpand\n\t\t\t\t*ngIf="model.hasExpandableRows()"\n\t\t\t\tscope="col"\n\t\t\t\t[showExpandAllToggle]="showExpandAllToggle"\n\t\t\t\t[ngClass]="{\'cds--table-expand-v2\': stickyHeader}"\n\t\t\t\t[id]="model.getId(\'expand\')"\n\t\t\t\t[expanded]="model.expandableRowsCount() === model.expandedRowsCount()"\n\t\t\t\t(expandedChange)="onExpandAllRowsChange($event)">\n\t\t\t</th>\n\t\t\t<th\n\t\t\t\t*ngIf="!skeleton && showSelectionColumn && enableSingleSelect"\n\t\t\t\tscope="col"\n\t\t\t\t[id]="model.getId(\'select\')">\n\t\t\t\t\x3c!-- add width 0; since the carbon styles don\'t seem to constrain this headers width --\x3e\n\t\t\t</th>\n\t\t\t<th\n\t\t\t\tcdsTableHeadCheckbox\n\t\t\t\t*ngIf="!skeleton && showSelectionColumn && !enableSingleSelect"\n\t\t\t\tscope="col"\n\t\t\t\t[checked]="selectAllCheckbox"\n\t\t\t\t[indeterminate]="selectAllCheckboxSomeSelected"\n\t\t\t\t[ariaLabel]="getCheckboxHeaderLabel()"\n\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t[name]="model.getHeaderId(\'select\')"\n\t\t\t\t(change)="onSelectAllCheckboxChange()"\n\t\t\t\t[id]="model.getId(\'select\')">\n\t\t\t</th>\n\t\t\t<ng-container *ngFor="let column of model.header; let i = index">\n\t\t\t\t<th\n\t\t\t\t\t*ngIf="column && column.visible && (!withRowAILabels || i > 0)"\n\t\t\t\t\t[ngStyle]="column.style"\n\t\t\t\t\tcdsTableHeadCell\n\t\t\t\t\tscope="col"\n\t\t\t\t\t[class]="column.className"\n\t\t\t\t\t[sortable]="sortable"\n\t\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t\t[id]="model.getId(i)"\n\t\t\t\t\t[column]="column"\n\t\t\t\t\t[filterTitle]="getFilterTitle()"\n\t\t\t\t\t[attr.colspan]="column.colSpan"\n\t\t\t\t\t[attr.rowspan]="column.rowSpan"\n\t\t\t\t\t(sort)="sort.emit(i)">\n\t\t\t\t</th>\n\t\t\t</ng-container>\n\t\t\t<th *ngIf="!skeleton && stickyHeader && scrollbarWidth"\n\t\t\t\tscope="col"\n\t\t\t\t[ngStyle]="{\'width\': scrollbarWidth + \'px\', \'padding\': 0, \'border\': 0}">\n\t\t\t\t\x3c!--\n\t\t\t\t\tScrollbar pushes body to the left so this header column is added to push\n\t\t\t\t\tthe title bar the same amount and keep the header and body columns aligned.\n\t\t\t\t--\x3e\n\t\t\t</th>\n\t\t</tr>\n\t</ng-container>\n\t<ng-content></ng-content>\n\t',styles:["\n\t\t.cds--table-expand-v2 {\n\t\t\tpadding-left: 2.5rem;\n\t\t}\n\t"]})],TableHead);let TableHeadCell=class TableHeadCell{constructor(i18n){this.i18n=i18n,this.skeleton=!1,this.sortable=!0,this.sort=new core.EventEmitter,this.theadAction=!1,this._sortDescendingLabel=this.i18n.getOverridable("TABLE.SORT_DESCENDING"),this._sortAscendingLabel=this.i18n.getOverridable("TABLE.SORT_ASCENDING"),this._filterTitle=this.i18n.getOverridable("TABLE.FILTER")}set sortDescendingLabel(value){this._sortDescendingLabel.override(value)}get sortDescendingLabel(){return this._sortDescendingLabel.value}set sortAscendingLabel(value){this._sortAscendingLabel.override(value)}get sortAscendingLabel(){return this._sortAscendingLabel.value}set filterTitle(value){this._filterTitle.override(value)}get filterTitle(){return this._filterTitle.value}get sortHeaderHost(){return this.sortable&&this.sort.observers.length>0&&this.column?.sortable}get sortHeaderAILabelHost(){return this.column?.hasAILabelHeader&&this.sortHeaderHost}get sortHeaderDecoratorHost(){return this.column?.hasAILabelHeader&&this.column?.template&&this.sortHeaderHost}get headerAILabelDecoratorLayout(){return!(!this.column?.hasAILabelHeader||!this.column?.template)}ngOnChanges(){this.theadAction=!(!this.column||!this.column.filterTemplate)||this.sort.observers.length>0}getHeaderLabelText(){if(!this.column)return"";const d=this.column.data;return null!=d&&"object"==typeof d&&"label"in d&&null!=d.label?String(d.label):"string"==typeof d?d:""}getSortDescendingLabel(){return this._sortDescendingLabel.subject.pipe(this.sortLabelMap())}getSortAscendingLabel(){return this._sortAscendingLabel.subject.pipe(this.sortLabelMap())}onDecoratorRegionClick(event){event.preventDefault(),event.stopPropagation()}onClick(event){this.skeleton||this.column?.hasAILabelHeader&&this.decoratorInnerRef?.nativeElement?.contains(event.target)||this.sort.emit()}sortLabelMap(){return(0,map.U)((str=>{if(this.column.ariaSortLabel)return this.column.ariaSortLabel;if(this.column.formatSortLabel)return this.column.formatSortLabel(str,this.column.ariaSortLabel);return`${this.getHeaderLabelText()||("string"==typeof this.column.data?this.column.data:"")} - ${str}`}))}};TableHeadCell.ctorParameters=()=>[{type:i18n.oc}],TableHeadCell.propDecorators={column:[{type:core.Input}],skeleton:[{type:core.Input}],sortable:[{type:core.Input}],sortDescendingLabel:[{type:core.Input}],sortAscendingLabel:[{type:core.Input}],filterTitle:[{type:core.Input}],sort:[{type:core.Output}],decoratorInnerRef:[{type:core.ViewChild,args:["decoratorInner"]}],theadAction:[{type:core.HostBinding,args:["class.thead_action"]}],sortHeaderHost:[{type:core.HostBinding,args:["class.cds--table-sort__header"]}],sortHeaderAILabelHost:[{type:core.HostBinding,args:["class.cds--table-sort__header--ai-label"]}],sortHeaderDecoratorHost:[{type:core.HostBinding,args:["class.cds--table-sort__header--decorator"]}]},TableHeadCell=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableHeadCell], [ibmTableHeadCell]",template:'\n\t\t<button\n\t\t\tclass="cds--table-sort"\n\t\t\t*ngIf="sortable && this.sort.observers.length > 0 && column.sortable"\n\t\t\t[attr.aria-label]="(column.sorted && column.ascending ? getSortDescendingLabel() : getSortAscendingLabel()) | async"\n\t\t\taria-live="polite"\n\t\t\t[ngClass]="{\n\t\t\t\t\'cds--table-sort--active\': column.sorted,\n\t\t\t\t\'cds--table-sort--descending\': column.ascending\n\t\t\t}"\n\t\t\t(click)="onClick($event)">\n\t\t\t<span\n\t\t\t\t*ngIf="headerAILabelDecoratorLayout"\n\t\t\t\tclass="cds--table-sort__flex"\n\t\t\t\t[title]="column.title"\n\t\t\t\ttabindex="-1">\n\t\t\t\t<div cdsTableHeadCellLabel>{{ getHeaderLabelText() }}</div>\n\t\t\t\t<svg *ngIf="!skeleton" class="cds--table-sort__icon" cdsIcon="arrow--down"></svg>\n\t\t\t\t<svg *ngIf="!skeleton" class="cds--table-sort__icon-unsorted" cdsIcon="arrows--vertical"></svg>\n\t\t\t<div\n\t\t\t\t#decoratorInner\n\t\t\t\tclass="cds--table-header-label--decorator-inner"\n\t\t\t\t(click)="onDecoratorRegionClick($event)">\n\t\t\t\t<ng-template\n\t\t\t\t\t[ngTemplateOutlet]="column.template"\n\t\t\t\t\t[ngTemplateOutletContext]="{data: column.data}">\n\t\t\t\t</ng-template>\n\t\t\t</div>\n\t\t\t</span>\n\t\t\t<span\n\t\t\t\t*ngIf="!headerAILabelDecoratorLayout"\n\t\t\t\tclass="cds--table-sort__flex"\n\t\t\t\t[title]="column.title"\n\t\t\t\ttabindex="-1">\n\t\t\t\t<div\n\t\t\t\t\t*ngIf="!skeleton && !column.template"\n\t\t\t\t\tcdsTableHeadCellLabel\n\t\t\t\t\t[class.cds--table-header-label--ai-label]="column.hasAILabelHeader"\n\t\t\t\t\t[class.cds--table-header-label--slug]="column.hasAILabelHeader">\n\t\t\t\t\t{{column.data}}\n\t\t\t\t</div>\n\t\t\t\t<div\n\t\t\t\t\t*ngIf="!skeleton && column.template"\n\t\t\t\t\tcdsTableHeadCellLabel\n\t\t\t\t\t[class.cds--table-header-label--ai-label]="column.hasAILabelHeader"\n\t\t\t\t\t[class.cds--table-header-label--slug]="column.hasAILabelHeader">\n\t\t\t\t\t<ng-template\n\t\t\t\t\t\t[ngTemplateOutlet]="column.template"\n\t\t\t\t\t\t[ngTemplateOutletContext]="{data: column.data}">\n\t\t\t\t\t</ng-template>\n\t\t\t\t</div>\n\t\t\t\t<svg *ngIf="!skeleton" class="cds--table-sort__icon" cdsIcon="arrow--down"></svg>\n\t\t\t\t<svg *ngIf="!skeleton" class="cds--table-sort__icon-unsorted" cdsIcon="arrows--vertical"></svg>\n\t\t\t</span>\n\t\t</button>\n\t\t<div\n\t\t\t*ngIf="headerAILabelDecoratorLayout && ((!skeleton && sort.observers.length === 0) || (sort.observers.length > 0 && !column.sortable) || !sortable)"\n\t\t\tclass="cds--table-header-label"\n\t\t\t[ngClass]="{\n\t\t\t\t\'cds--table-header-label--ai-label\': column.hasAILabelHeader,\n\t\t\t\t\'cds--table-header-label--slug\': column.hasAILabelHeader,\n\t\t\t\t\'cds--table-header-label--decorator\': column.hasAILabelHeader\n\t\t\t}">\n\t\t\t<span *ngIf="getHeaderLabelText()">{{ getHeaderLabelText() }}</span>\n\t\t\t<div class="cds--table-header-label--decorator-inner">\n\t\t\t\t<ng-template\n\t\t\t\t\t[ngTemplateOutlet]="column.template"\n\t\t\t\t\t[ngTemplateOutletContext]="{data: column.data}">\n\t\t\t\t</ng-template>\n\t\t\t</div>\n\t\t</div>\n\t\t<div\n\t\t\tclass="cds--table-header-label"\n\t\t\t*ngIf="!headerAILabelDecoratorLayout && ((!skeleton && sort.observers.length === 0) || (sort.observers.length > 0 && !column.sortable) || !sortable)"\n\t\t\t[ngClass]="{\n\t\t\t\t\'cds--table-header-label--ai-label\': column.hasAILabelHeader,\n\t\t\t\t\'cds--table-header-label--slug\': column.hasAILabelHeader\n\t\t\t}">\n\t\t\t<span *ngIf="!column.template" [title]="column.data">\n\t\t\t\t<ng-container *ngIf="!skeleton">\n\t\t\t\t\t{{column.data}}\n\t\t\t\t</ng-container>\n\t\t\t</span>\n\t\t\t<ng-template\n\t\t\t\t[ngTemplateOutlet]="column.template" [ngTemplateOutletContext]="{data: column.data}">\n\t\t\t</ng-template>\n\t\t</div>\n\t'})],TableHeadCell);let TableHeadCheckbox=class TableHeadCheckbox{constructor(i18n){this.i18n=i18n,this.checked=!1,this.indeterminate=!1,this.skeleton=!1,this.name="select-all-"+TableHeadCheckbox.tableSelectAllCount++,this.change=new core.EventEmitter,this.hostClass=!0,this._ariaLabel=this.i18n.getOverridable("TABLE.CHECKBOX_HEADER")}set ariaLabel(value){this._ariaLabel.override(value)}get ariaLabel(){return this._ariaLabel.value}getAriaLabel(){return this._ariaLabel.subject}};TableHeadCheckbox.tableSelectAllCount=0,TableHeadCheckbox.ctorParameters=()=>[{type:i18n.oc}],TableHeadCheckbox.propDecorators={checked:[{type:core.Input}],indeterminate:[{type:core.Input}],skeleton:[{type:core.Input}],name:[{type:core.Input}],ariaLabel:[{type:core.Input}],change:[{type:core.Output}],hostClass:[{type:core.HostBinding,args:["class.cds--table-column-checkbox"]}]},TableHeadCheckbox=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableHeadCheckbox], [ibmTableHeadCheckbox]",template:'\n\t\t<cds-checkbox\n\t\t\t*ngIf="!skeleton"\n\t\t\tinline="true"\n\t\t\t[name]="name"\n\t\t\t[checked]="checked"\n\t\t\t[indeterminate]="indeterminate"\n\t\t\t(checkedChange)="change.emit()"\n\t\t\t[hideLabel]="true">\n\t\t\t\t{{getAriaLabel() | async}}\n\t\t</cds-checkbox>\n\t',styles:["\n        :host { width: 10px; }\n    "]})],TableHeadCheckbox);let TableHeadExpand=class TableHeadExpand{constructor(i18n){this.i18n=i18n,this.hostClass=!0,this.showExpandAllToggle=!1,this.expanded=!1,this.expandedChange=new core.EventEmitter,this._ariaLabel=this.i18n.getOverridable("TABLE.EXPAND_ALL_BUTTON")}get previousValue(){return this.expanded?"collapsed":null}getAriaLabel(){return this._ariaLabel.subject}};TableHeadExpand.ctorParameters=()=>[{type:i18n.oc}],TableHeadExpand.propDecorators={hostClass:[{type:core.HostBinding,args:["class.cds--table-expand"]}],showExpandAllToggle:[{type:core.Input}],expanded:[{type:core.Input}],expandedChange:[{type:core.Output}],previousValue:[{type:core.HostBinding,args:["attr.data-previous-value"]}]},TableHeadExpand=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableHeadExpand], [ibmTableHeadExpand]",template:'\n\t\t<button\n\t\t\t*ngIf="showExpandAllToggle"\n\t\t\tclass="cds--table-expand__button"\n\t\t\t[attr.aria-label]="getAriaLabel() | async"\n\t\t\t(click)="expandedChange.emit(!expanded)">\n\t\t\t<svg cdsIcon="chevron--right" size="16" class="cds--table-expand__svg"></svg>\n\t\t</button>\n\t\t<ng-container *ngIf="!showExpandAllToggle">\n\t\t\t<ng-content></ng-content>\n\t\t</ng-container>\n\t'})],TableHeadExpand);let TableBody=class TableBody{constructor(i18n){this.i18n=i18n,this.enableSingleSelect=!1,this.showSelectionColumn=!0,this.size="md",this.skeleton=!1,this.withRowAILabels=!1,this.selectRow=new core.EventEmitter,this.deselectRow=new core.EventEmitter,this.rowClick=new core.EventEmitter,this._checkboxRowLabel=this.i18n.getOverridable("TABLE.CHECKBOX_ROW"),this._expandButtonAriaLabel=this.i18n.getOverridable("TABLE.EXPAND_BUTTON")}set expandButtonAriaLabel(value){this._expandButtonAriaLabel.override(value)}get expandButtonAriaLabel(){return this._expandButtonAriaLabel.value}set checkboxRowLabel(value){this._checkboxRowLabel.override(value)}get checkboxRowLabel(){return this._checkboxRowLabel.value}onRowCheckboxChange(index){this.model.isRowSelected(index)?this.deselectRow.emit({model:this.model,deselectedRowIndex:index}):this.selectRow.emit({model:this.model,selectedRowIndex:index})}onRowClick(index){this.rowClick.emit(index)}getCheckboxRowLabel(){return this._checkboxRowLabel.subject}getExpandButtonAriaLabel(){return this._expandButtonAriaLabel.subject}firstExpandedDataInRow(row){const found=row.find((d=>d.expandedData));return found?found.expandedData:found}shouldExpandAsTable(row){return row.some((d=>d.expandAsTable))}};TableBody.ctorParameters=()=>[{type:i18n.oc}],TableBody.propDecorators={model:[{type:core.Input}],enableSingleSelect:[{type:core.Input}],expandButtonAriaLabel:[{type:core.Input}],checkboxRowLabel:[{type:core.Input}],showSelectionColumn:[{type:core.Input}],size:[{type:core.Input}],selectionLabelColumn:[{type:core.Input}],skeleton:[{type:core.Input}],withRowAILabels:[{type:core.Input}],selectRow:[{type:core.Output}],deselectRow:[{type:core.Output}],rowClick:[{type:core.Output}]},TableBody=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableBody], [ibmTableBody]",template:'\n\t\t<ng-container *ngIf="model">\n\t\t\t<ng-container *ngFor="let row of model.data; let i = index">\n\t\t\t\t<tr\n\t\t\t\t\tcdsTableRow\n\t\t\t\t\t[model]="model"\n\t\t\t\t\t[row]="row"\n\t\t\t\t\t[size]="size"\n\t\t\t\t\t[selected]="model.isRowSelected(i)"\n\t\t\t\t\t[expandable]="model.isRowExpandable(i)"\n\t\t\t\t\t[expanded]="model.isRowExpanded(i)"\n\t\t\t\t\t[checkboxLabel]="getCheckboxRowLabel()"\n\t\t\t\t\t[expandButtonAriaLabel]="getExpandButtonAriaLabel()"\n\t\t\t\t\t[showSelectionColumn]="showSelectionColumn"\n\t\t\t\t\t[enableSingleSelect]="enableSingleSelect"\n\t\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t\t[withRowAILabels]="withRowAILabels"\n\t\t\t\t\t(selectRow)="onRowCheckboxChange(i)"\n\t\t\t\t\t(deselectRow)="onRowCheckboxChange(i)"\n\t\t\t\t\t(expandRow)="model.expandRow(i, !model.isRowExpanded(i))"\n\t\t\t\t\t(rowClick)="onRowClick(i)"\n\t\t\t\t\t*ngIf="!model.isRowFiltered(i)"\n\t\t\t\t\t[class]="(model.rowsClass[i] ? model.rowsClass[i] : null)"\n\t\t\t\t\t[ngClass]="{\n\t\t\t\t\t\t\'tbody_row--success\': !model.isRowSelected(i) && model.getRowContext(i) === \'success\',\n\t\t\t\t\t\t\'tbody_row--warning\': !model.isRowSelected(i) && model.getRowContext(i) === \'warning\',\n\t\t\t\t\t\t\'tbody_row--info\': !model.isRowSelected(i) && model.getRowContext(i) === \'info\',\n\t\t\t\t\t\t\'tbody_row--error\': !model.isRowSelected(i) && model.getRowContext(i) === \'error\'\n\t\t\t\t\t}">\n\t\t\t\t</tr>\n\t\t\t\t<tr\n\t\t\t\t\t*ngIf="model.isRowExpandable(i) && !shouldExpandAsTable(row) && !model.isRowFiltered(i)"\n\t\t\t\t\tcdsTableExpandedRow\n\t\t\t\t\tcdsExpandedRowHover\n\t\t\t\t\t[row]="row"\n\t\t\t\t\t[expanded]="model.isRowExpanded(i)"\n\t\t\t\t\t[skeleton]="skeleton">\n\t\t\t\t</tr>\n\t\t\t\t<ng-container\n\t\t\t\t\t*ngIf="model.isRowExpandable(i) && shouldExpandAsTable(row) && model.isRowExpanded(i) && !model.isRowFiltered(i)">\n\t\t\t\t\t<tr\n\t\t\t\t\t\t*ngFor="let expandedDataRow of firstExpandedDataInRow(row)"\n\t\t\t\t\t\tcdsTableRow\n\t\t\t\t\t\t[model]="model"\n\t\t\t\t\t\t[showSelectionColumnCheckbox]="false"\n\t\t\t\t\t\t[showSelectionColumn]="showSelectionColumn"\n\t\t\t\t\t\t[row]="expandedDataRow"\n\t\t\t\t\t\t[size]="size"\n\t\t\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t\t\t[withRowAILabels]="withRowAILabels">\n\t\t\t\t\t</tr>\n\t\t\t\t</ng-container>\n\t\t\t</ng-container>\n\t\t</ng-container>\n\t\t<ng-content></ng-content>\n\t'})],TableBody);let TableRowComponent=class TableRowComponent{constructor(i18n){this.i18n=i18n,this.expanded=!1,this.expandable=!1,this.selected=!1,this.size="md",this.enableSingleSelect=!1,this.showSelectionColumn=!0,this.showSelectionColumnCheckbox=!0,this.skeleton=!1,this.selectRow=new core.EventEmitter,this.deselectRow=new core.EventEmitter,this.expandRow=new core.EventEmitter,this.rowClick=new core.EventEmitter,this.withRowAILabels=!1,this._checkboxLabel=this.i18n.getOverridable("TABLE.CHECKBOX_ROW"),this._expandButtonAriaLabel=this.i18n.getOverridable("TABLE.EXPAND_BUTTON")}set expandButtonAriaLabel(value){this._expandButtonAriaLabel.override(value)}get expandButtonAriaLabel(){return this._expandButtonAriaLabel.value}set checkboxLabel(value){this._checkboxLabel.override(value)}get checkboxLabel(){return this._checkboxLabel.value}get selectedClass(){return this.selected}get aiLabelRowClass(){return this.withRowAILabels&&!0===this.row?.[0]?.hasAILabelDecorator}get slugRowClass(){return this.withRowAILabels&&!0===this.row?.[0]?.hasAILabelDecorator}get parentRowClass(){return this.expandable}get expandableRowClass(){return this.expanded}get selectableClass(){return!1}get isParentRow(){return!!this.expandable||null}get isAccessible(){return this.enableSingleSelect&&!this.showSelectionColumn?0:null}onHostClick(){this.enableSingleSelect&&!this.showSelectionColumn&&this.onSelectionChange()}onRowClick(){this.rowClick.emit()}onSelectionChange(){this.selected?this.deselectRow.emit():this.selectRow.emit()}getCheckboxLabel(){return this._checkboxLabel.subject}getExpandButtonAriaLabel(){return this._expandButtonAriaLabel.subject}cellClassNames(j,item){const header=this.model.getHeader(j),parts=[header?.className,item?.cellClassName].filter(Boolean);return header?.hasAILabelHeader&&parts.push("cds--table-cell--column-slug"),parts.join(" ")}};TableRowComponent.ctorParameters=()=>[{type:i18n.oc}],TableRowComponent.propDecorators={model:[{type:core.Input}],row:[{type:core.Input}],expanded:[{type:core.Input}],expandable:[{type:core.Input}],selected:[{type:core.Input}],size:[{type:core.Input}],enableSingleSelect:[{type:core.Input}],expandButtonAriaLabel:[{type:core.Input}],checkboxLabel:[{type:core.Input}],showSelectionColumn:[{type:core.Input}],showSelectionColumnCheckbox:[{type:core.Input}],selectionLabelColumn:[{type:core.Input}],skeleton:[{type:core.Input}],selectRow:[{type:core.Output}],deselectRow:[{type:core.Output}],expandRow:[{type:core.Output}],rowClick:[{type:core.Output}],selectedClass:[{type:core.HostBinding,args:["class.cds--data-table--selected"]}],withRowAILabels:[{type:core.Input}],aiLabelRowClass:[{type:core.HostBinding,args:["class.cds--data-table--ai-label-row"]}],slugRowClass:[{type:core.HostBinding,args:["class.cds--data-table--slug-row"]}],parentRowClass:[{type:core.HostBinding,args:["class.cds--parent-row"]}],expandableRowClass:[{type:core.HostBinding,args:["class.cds--expandable-row"]}],selectableClass:[{type:core.HostBinding,args:["class.tbody_row--selectable"]}],isParentRow:[{type:core.HostBinding,args:["attr.data-parent-row"]}],isAccessible:[{type:core.HostBinding,args:["attr.tabindex"]}],onHostClick:[{type:core.HostListener,args:["click"]}]},TableRowComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableRow], [ibmTableRow]",template:'\n\t\t<ng-container *ngIf="model">\n\t\t\t<td\n\t\t\t\t*ngIf="withRowAILabels && row[0] && model.getHeader(0) && model.getHeader(0).visible"\n\t\t\t\tcdsTableData\n\t\t\t\t[headers]="model.getHeaderId(0, row[0].colSpan)"\n\t\t\t\t[item]="row[0]"\n\t\t\t\t[title]="row[0].title"\n\t\t\t\t[class]="cellClassNames(0, row[0])"\n\t\t\t\t[ngStyle]="model.getHeader(0).style"\n\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t[attr.colspan]="row[0].colSpan"\n\t\t\t\t[attr.rowspan]="row[0].rowSpan"\n\t\t\t\t(click)="onRowClick()"\n\t\t\t\t(keydown.enter)="onRowClick()">\n\t\t\t</td>\n\t\t\t<td\n\t\t\t\t*ngIf="model.hasExpandableRows()"\n\t\t\t\tcdsTableExpandButton\n\t\t\t\tclass="cds--table-expand-v2"\n\t\t\t\t[expanded]="expanded"\n\t\t\t\t[expandable]="expandable"\n\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t[ariaLabel]="getExpandButtonAriaLabel()"\n\t\t\t\t[headers]="model.getHeaderId(\'expand\')"\n\t\t\t\t(expandRow)="expandRow.emit()">\n\t\t\t</td>\n\t\t\t<ng-container *ngIf="!skeleton && showSelectionColumn && !enableSingleSelect">\n\t\t\t\t<td\n\t\t\t\t\t*ngIf="!showSelectionColumnCheckbox; else tableCheckboxTemplate">\n\t\t\t\t</td>\n\t\t\t\t<ng-template #tableCheckboxTemplate>\n\t\t\t\t\t<td\n\t\t\t\t\t\tcdsTableCheckbox\n\t\t\t\t\t\tclass="cds--table-column-checkbox"\n\t\t\t\t\t\t[size]="size"\n\t\t\t\t\t\t[selected]="selected"\n\t\t\t\t\t\t[label]="getCheckboxLabel()"\n\t\t\t\t\t\t[row]="row"\n\t\t\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t\t\t[headers]="model.getHeaderId(\'select\')"\n\t\t\t\t\t\t(selectedChange)="onSelectionChange()">\n\t\t\t\t\t</td>\n\t\t\t\t</ng-template>\n\t\t\t</ng-container>\n\t\t\t<td\n\t\t\t\t*ngIf="!skeleton && showSelectionColumn && enableSingleSelect"\n\t\t\t\tcdsTableRadio\n\t\t\t\t[selected]="selected"\n\t\t\t\t[label]="getCheckboxLabel()"\n\t\t\t\t[row]="row"\n\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t[headers]="model.getHeaderId(\'select\')"\n\t\t\t\t(change)="onSelectionChange()">\n\t\t\t</td>\n\t\t\t<ng-container *ngFor="let item of row; let j = index">\n\t\t\t\t<td\n\t\t\t\t\t*ngIf="(!withRowAILabels || j > 0) && item && model.getHeader(j) && model.getHeader(j).visible"\n\t\t\t\t\tcdsTableData\n\t\t\t\t\t[headers]="model.getHeaderId(j, item.colSpan)"\n\t\t\t\t\t[item]="item"\n\t\t\t\t\t[title]="item.title"\n\t\t\t\t\t[class]="cellClassNames(j, item)"\n\t\t\t\t\t[ngStyle]="model.getHeader(j).style"\n\t\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t\t[attr.colspan]="item.colSpan"\n\t\t\t\t\t[attr.rowspan]="item.rowSpan"\n\t\t\t\t\t(click)="onRowClick()"\n\t\t\t\t\t(keydown.enter)="onRowClick()">\n\t\t\t\t</td>\n\t\t\t\t<td\n\t\t\t\t\t*ngIf="(!withRowAILabels || j > 0) && item && model.getHeader(j) == null"\n\t\t\t\t\tcdsTableData\n\t\t\t\t\t[headers]="model.getHeaderId(j, item.colSpan)"\n\t\t\t\t\t[item]="item"\n\t\t\t\t\t[title]="item.title"\n\t\t\t\t\t[class]="cellClassNames(j, item)"\n\t\t\t\t\t[skeleton]="skeleton"\n\t\t\t\t\t[attr.colspan]="item.colSpan"\n\t\t\t\t\t[attr.rowspan]="item.rowSpan"\n\t\t\t\t\t(click)="onRowClick()"\n\t\t\t\t\t(keydown.enter)="onRowClick()">\n\t\t\t\t</td>\n\t\t\t</ng-container>\n\t\t</ng-container>\n\t\t<ng-content></ng-content>\n\t'})],TableRowComponent);let TableExpandedRow=class TableExpandedRow{constructor(){this.skeleton=!1,this.expandableRowClass=!0,this.dataChildRow=!0,this.expanded=!1}get displayStyle(){return this.expanded?null:"none"}firstExpandedTemplateInRow(row){const found=row.find((d=>d.expandedTemplate));return found?found.expandedTemplate:found}firstExpandedDataInRow(row){const found=row.find((d=>d.expandedData));return found?found.expandedData:found}};TableExpandedRow.propDecorators={row:[{type:core.Input}],skeleton:[{type:core.Input}],expandableRowClass:[{type:core.HostBinding,args:["class.cds--expandable-row"]}],dataChildRow:[{type:core.HostBinding,args:["attr.data-child-row"]}],expanded:[{type:core.Input}],displayStyle:[{type:core.HostBinding,args:["style.display"]}]},TableExpandedRow=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableExpandedRow], [ibmTableExpandedRow]",template:'\n\t\t<td [attr.colspan]="row.length + 2">\n\t\t\t<ng-container *ngIf="!firstExpandedTemplateInRow(row)">\n\t\t\t\t{{firstExpandedDataInRow(row)}}\n\t\t\t</ng-container>\n\t\t\t<ng-template\n\t\t\t\t[ngTemplateOutlet]="firstExpandedTemplateInRow(row)"\n\t\t\t\t[ngTemplateOutletContext]="{data: firstExpandedDataInRow(row)}">\n\t\t\t</ng-template>\n\t\t</td>\n\t'})],TableExpandedRow);let TableData=class TableData{constructor(){this.skeleton=!1}};TableData.propDecorators={item:[{type:core.Input}],skeleton:[{type:core.Input}]},TableData=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableData], [ibmTableData]",template:'\n\t\t<ng-container *ngIf="!skeleton && !item.template">{{item.data}}</ng-container>\n\t\t<ng-template\n\t\t\t*ngIf="!skeleton"\n\t\t\t[ngTemplateOutlet]="item.template"\n\t\t\t[ngTemplateOutletContext]="{data: item.data}">\n\t\t</ng-template>\n\t'})],TableData);let TableCheckbox=class TableCheckbox{constructor(i18n){this.i18n=i18n,this.selected=!1,this.name="",this.size="md",this.skeleton=!1,this.selectedChange=new core.EventEmitter,this._label=this.i18n.getOverridable("TABLE.CHECKBOX_ROW")}get disabled(){return!!this.row&&!!this.row.disabled}set label(value){this._label.override(value)}get label(){return this._label.value}getSelectionLabelValue(row){return this.selectionLabelColumn?{value:row[this.selectionLabelColumn].data}:{value:this.i18n.get().TABLE.ROW}}getLabel(){return this._label.subject}};TableCheckbox.ctorParameters=()=>[{type:i18n.oc}],TableCheckbox.propDecorators={row:[{type:core.Input}],selected:[{type:core.Input}],name:[{type:core.Input}],size:[{type:core.Input}],label:[{type:core.Input}],selectionLabelColumn:[{type:core.Input}],skeleton:[{type:core.Input}],selectedChange:[{type:core.Output}]},TableCheckbox=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableCheckbox], [ibmTableCheckbox]",template:'\n\t\t<cds-checkbox\n\t\t\t*ngIf="!skeleton"\n\t\t\tinline="true"\n\t\t\t[name]="name"\n\t\t\t[checked]="selected"\n\t\t\t[disabled]="disabled"\n\t\t\t(checkedChange)="selectedChange.emit()"\n\t\t\t[hideLabel]="true">\n\t\t\t\t{{getLabel() | i18nReplace:getSelectionLabelValue(row) | async}}\n\t\t</cds-checkbox>\n\t'})],TableCheckbox);let TableRadio=class TableRadio{constructor(i18n){this.i18n=i18n,this.selected=!1,this.radioColumn=!0,this.selectableColumn=!0,this.skeleton=!1,this.change=new core.EventEmitter,this._label=this.i18n.getOverridable("TABLE.CHECKBOX_ROW")}set label(value){this._label.override(value)}get label(){return this._label.value}get disabled(){return!!this.row&&!!this.row.disabled}getSelectionLabelValue(row){return this.selectionLabelColumn?{value:row[this.selectionLabelColumn].data}:{value:this.i18n.get().TABLE.ROW}}getLabel(){return this._label.subject}};TableRadio.ctorParameters=()=>[{type:i18n.oc}],TableRadio.propDecorators={row:[{type:core.Input}],selected:[{type:core.Input}],label:[{type:core.Input}],radioColumn:[{type:core.HostBinding,args:["class.cds--table-column-radio"]}],selectableColumn:[{type:core.HostBinding,args:["class.cds--table-column-checkbox"]}],selectionLabelColumn:[{type:core.Input}],skeleton:[{type:core.Input}],change:[{type:core.Output}]},TableRadio=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableRadio], [ibmTableRadio]",template:'\n\t\t<cds-radio\n\t\t\t*ngIf="!skeleton"\n\t\t\t[attr.aria-label]="getLabel() | i18nReplace:getSelectionLabelValue(row) | async"\n\t\t\t[ariaLabel]="getLabel() | i18nReplace:getSelectionLabelValue(row) | async"\n\t\t\t[checked]="selected"\n\t\t\t[disabled]="disabled"\n\t\t\t(change)="change.emit()">\n\t\t</cds-radio>\n\t'})],TableRadio);let TableExpandButton=class TableExpandButton{constructor(i18n){this.i18n=i18n,this.expanded=!1,this.expandable=!1,this.skeleton=!1,this.expandClass=!0,this.expandRow=new core.EventEmitter,this._ariaLabel=this.i18n.getOverridable("TABLE.EXPAND_BUTTON")}set ariaLabel(value){this._ariaLabel.override(value)}get ariaLabel(){return this._ariaLabel.value}get previousValue(){return this.expanded?"collapsed":null}getAriaLabel(){return this._ariaLabel.subject}};TableExpandButton.ctorParameters=()=>[{type:i18n.oc}],TableExpandButton.propDecorators={expanded:[{type:core.Input}],expandable:[{type:core.Input}],ariaLabel:[{type:core.Input}],skeleton:[{type:core.Input}],expandClass:[{type:core.HostBinding,args:["class.cds--table-expand"]}],previousValue:[{type:core.HostBinding,args:["attr.data-previous-value"]}],expandRow:[{type:core.Output}]},TableExpandButton=(0,tslib_es6.gn)([(0,core.Component)({selector:"[cdsTableExpandButton], [ibmTableExpandButton]",template:'\n\t\t<button\n\t\t\t*ngIf="expandable"\n\t\t\tclass="cds--table-expand__button"\n\t\t\t[attr.aria-label]="getAriaLabel() | async"\n\t\t\t(click)="expandRow.emit()">\n\t\t\t<svg cdsIcon="chevron--right" size="16" class="cds--table-expand__svg"></svg>\n\t\t</button>\n\t'})],TableExpandButton);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),src_forms=__webpack_require__("./src/forms/index.ts"),dialog=__webpack_require__("./src/dialog/index.ts"),src_button=__webpack_require__("./src/button/index.ts"),icon=__webpack_require__("./src/icon/index.ts");class TableRow extends Array{constructor(){super(...arguments),this.disabled=!1}}let TableModule=class TableModule{};TableModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[TableToolbar,TableContainer,TableHeader,TableHeaderTitle,TableHeaderDescription,TableHeaderDecorator,TableHeadCellLabel,TableToolbarActions,TableToolbarSearch,TableToolbarContent,ExpandedRowHover,Table,TableDirective,TableHead,TableHeadCell,TableHeadCheckbox,TableHeadExpand,TableBody,TableRowComponent,TableExpandedRow,TableData,TableCheckbox,TableRadio,TableExpandButton],exports:[TableToolbar,TableContainer,TableHeader,TableHeaderTitle,TableHeaderDescription,TableHeaderDecorator,TableHeadCellLabel,TableToolbarActions,TableToolbarSearch,TableToolbarContent,ExpandedRowHover,Table,TableDirective,TableHead,TableHeadCell,TableHeadCheckbox,TableHeadExpand,TableBody,TableRowComponent,TableExpandedRow,TableData,TableCheckbox,TableRadio,TableExpandButton],imports:[common.CommonModule,src_forms.s,fesm2020_forms.u5,dialog.Su,src_button.hJ,search.t,i18n.LU,icon.QX]})],TableModule)},"./src/table/table-header-item.class.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{j:()=>TableHeaderItem});class TableHeaderItem{constructor(rawData){this.visible=!0,this.sorted=!1,this.sortable=!0,this.filterCount=0,this.rowSpan=1,this.colSpan=1,this.hasAILabelHeader=!1,this.style={},this.sortDirection="NONE";const defaults={data:"",visible:this.visible,style:this.style,filterCount:this.filterCount,filterData:{data:""}},data=Object.assign({},defaults,rawData);for(let property of Object.getOwnPropertyNames(data))data.hasOwnProperty(property)&&(this[property]=data[property])}set ascending(asc){this.sortDirection=asc?"ASCENDING":"DESCENDING"}get ascending(){return"ASCENDING"===this.sortDirection}set descending(desc){this.sortDirection=desc?"DESCENDING":"ASCENDING"}get descending(){return"DESCENDING"===this.sortDirection}get title(){return this._title?this._title:this.data?"string"==typeof this.data?this.data:this.data.toString&&this.data.constructor!=={}.constructor?this.data.toString():"":""}set title(title){this._title=title}compare(one,two){return one&&two?"string"==typeof one.data?one.data.localeCompare(two.data):one.data<two.data?-1:one.data>two.data?1:0:0}filter(item){return this.filterCount=0,!1}}},"./src/table/table-item.class.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{r:()=>TableItem});class TableItem{constructor(rawData){this.rowSpan=1,this.colSpan=1,this.hasAILabelDecorator=!1;const data=Object.assign({},{data:""},rawData);for(const property of Object.getOwnPropertyNames(data))data.hasOwnProperty(property)&&(this[property]=data[property])}get title(){return"string"==typeof this._title?this._title:this.data?"string"==typeof this.data?this.data:this.data.toString&&this.data.constructor!=={}.constructor?this.data.toString():"":""}set title(title){this._title=title}}},"./src/table/table-model.class.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{G:()=>TableModel});var _angular_core__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_table_header_item_class__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/table/table-header-item.class.ts"),_table_item_class__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/table/table-item.class.ts"),rxjs__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subject.js");class TableModel{constructor(){this.dataChange=new _angular_core__WEBPACK_IMPORTED_MODULE_0__.EventEmitter,this.rowsSelectedChange=new _angular_core__WEBPACK_IMPORTED_MODULE_0__.EventEmitter,this.rowsExpandedChange=new _angular_core__WEBPACK_IMPORTED_MODULE_0__.EventEmitter,this.rowsExpandedAllChange=new _angular_core__WEBPACK_IMPORTED_MODULE_0__.EventEmitter,this.rowsCollapsedAllChange=new _angular_core__WEBPACK_IMPORTED_MODULE_0__.EventEmitter,this.selectAllChange=new rxjs__WEBPACK_IMPORTED_MODULE_1__.x,this.rowsSelected=[],this.rowsExpanded=[],this.rowsIndices=[],this.rowsContext=[],this.rowsClass=[],this.header=[],this.currentPage=1,this.pageLength=10,this.isEnd=!1,this.isLoading=!1,this._data=[[]],this.tableModelCount=0,this.tableModelCount=TableModel.COUNT++}set data(newData){if((!newData||Array.isArray(newData)&&0===newData.length)&&(newData=[[]]),this._data=newData,this.rowsSelected=new Array(this._data.length).fill(!1),this.rowsExpanded=new Array(this._data.length).fill(!1),this.rowsIndices=[...Array(this._data.length).keys()],this.rowsContext=new Array(this._data.length),this.rowsClass=new Array(this._data.length),null==this.header||this.header.length!==this._data[0].length&&this._data[0].length>0){let header=new Array;for(let i=0;i<this._data[0].length;i++)header.push(new _table_header_item_class__WEBPACK_IMPORTED_MODULE_2__.j);this.header=header}this.dataChange.emit()}get data(){return this._data}set totalDataLength(length){this._totalDataLength=isNaN(length)?null:length}get totalDataLength(){return null!==this._totalDataLength&&this._totalDataLength>=0?this._totalDataLength:this.data&&1===this.data.length&&0===this.data[0].length?0:this.data.length}getId(column,row=0){return`table-header-${row}-${column}-${this.tableModelCount}`}getHeaderId(column,colSpan=1){if("select"===column||"expand"===column)return this.getId(column);let ids=[];for(let i=column;i>=0;i--)if(this.header[i]){for(let j=0;j<colSpan;j++)ids.push(this.getId(i+j));break}return ids.join(" ")}getHeader(column){if(!this.header)return null;for(let i=column;i>=0;i--){const headerCell=this.header[i];if(headerCell)return headerCell}return null}selectedRowsCount(){let count=0;return this.rowsSelected&&this.rowsSelected.forEach((rowSelected=>{rowSelected&&count++})),count}expandedRowsCount(){let count=0;return this.rowsExpanded&&this.rowsExpanded.forEach((rowExpanded=>{rowExpanded&&count++})),count}row(index){return this.data[this.realRowIndex(index)]}addRow(row,index){if(!this.data||0===this.data.length||0===this.data[0].length){let newData=new Array;return newData.push(row||[new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r]),void(this.data=newData)}let realRow=row;const columnCount=this.data[0].length;if(null==row){realRow=new Array;for(let i=0;i<columnCount;i++)realRow.push(new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r)}if(realRow.length<columnCount){const difference=columnCount-realRow.length;for(let i=0;i<difference;i++)realRow.push(new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r)}else if(realRow.length>columnCount){let difference=realRow.length-this.header.length;for(let j=0;j<difference;j++)this.header.push(new _table_header_item_class__WEBPACK_IMPORTED_MODULE_2__.j);for(let i=0;i<this.data.length;i++){let currentRow=this.data[i];difference=realRow.length-currentRow.length;for(let j=0;j<difference;j++)currentRow.push(new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r)}}if(null==index)this.data.push(realRow),this.rowsSelected.push(!1),this.rowsExpanded.push(!1),this.rowsContext.push(void 0),this.rowsClass.push(void 0),this.rowsIndices.push(this.data.length-1);else{const ri=this.realRowIndex(index);this.data.splice(ri,0,realRow),this.rowsSelected.splice(ri,0,!1),this.rowsExpanded.splice(ri,0,!1),this.rowsContext.splice(ri,0,void 0),this.rowsClass.splice(ri,0,void 0),this.rowsIndices.splice(ri,0,this.data.length-1)}this.dataChange.emit()}deleteRow(index){const rri=this.realRowIndex(index);this.data.splice(rri,1),this.rowsSelected.splice(rri,1),this.rowsExpanded.splice(rri,1),this.rowsContext.splice(rri,1),this.rowsClass.splice(rri,1);const rowIndex=this.rowsIndices[rri];this.rowsIndices.splice(rri,1),this.rowsIndices=this.rowsIndices.map((value=>value>rowIndex?--value:value)),this.dataChange.emit()}deleteAllRows(){this.data=[]}hasExpandableRows(){return this.data.some((data=>data.some((d=>d&&d.expandedData))))}expandableRowsCount(){return this.data.reduce(((counter,_,index)=>counter=this.isRowExpandable(index)?counter+1:counter),0)}isRowExpandable(index){return this.data[index].some((d=>d&&d.expandedData))}isRowExpanded(index){return this.rowsExpanded[index]}getRowContext(index){return this.rowsContext[index]}column(index){let column=new Array;const ri=this.realColumnIndex(index),rc=this.data.length;for(let i=0;i<rc;i++){const row=this.data[i];column.push(row[ri])}return column}addColumn(column,index){if(!this.data||0===this.data.length||0===this.data[0].length){let newData=new Array;if(null==column)newData.push([new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r]);else for(let i=0;i<column.length;i++){let item=column[i];newData.push([item])}return void(this.data=newData)}let rc=this.data.length,ci=this.realColumnIndex(index);for(let i=0;null!=column&&i<column.length-rc;i++)this.addRow();if(rc=this.data.length,null==index){for(let i=0;i<rc;i++){this.data[i].push(null==column||null==column[i]?new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r:column[i])}this.header.length<this.data[0].length&&this.header.push(new _table_header_item_class__WEBPACK_IMPORTED_MODULE_2__.j)}else{index>=this.data[0].length&&ci++;for(let i=0;i<rc;i++){this.data[i].splice(ci,0,null==column||null==column[i]?new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r:column[i])}this.header.length<this.data[0].length&&this.header.splice(ci,0,new _table_header_item_class__WEBPACK_IMPORTED_MODULE_2__.j)}this.dataChange.emit()}deleteColumn(index){const rci=this.realColumnIndex(index),rowCount=this.data.length;for(let i=0;i<rowCount;i++)this.data[i].splice(rci,1);this.header.length>this.data[0].length&&this.header.splice(rci,1),this.dataChange.emit()}moveColumn(indexFrom,indexTo){const headerFrom=this.header[indexFrom];this.addColumn(this.column(indexFrom),indexTo),this.deleteColumn(indexFrom+(indexTo<indexFrom?1:0)),this.header[indexTo+(indexTo>indexFrom?-1:0)]=headerFrom}cycleSortState(index){switch(this.header[index].sortDirection){case"ASCENDING":this.header[index].sortDirection="DESCENDING";break;case"DESCENDING":this.header[index].sortDirection="NONE";break;default:this.header[index].sortDirection="ASCENDING"}}sort(index){this.pushRowStateToModelData();const headerSorted=this.header[index].sorted;if(this.header.forEach((column=>column.sorted=!1)),"NONE"===this.header[index].sortDirection&&headerSorted){const oldData=this._data;this._data=[];for(let i=0;i<this.rowsIndices.length;i++){const ri=this.rowsIndices[i];this._data[ri]=oldData[i]}}else{const descending="DESCENDING"===this.header[index].sortDirection?-1:1;this.data.sort(((a,b)=>descending*this.header[index].compare(a[index],b[index]))),this.header[index].sorted=!0}this.popRowStateFromModelData()}pushRowStateToModelData(){for(let i=0;i<this.data.length;i++){const rowSelectedMark=new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r;rowSelectedMark.data=this.rowsSelected[i],this.data[i].push(rowSelectedMark);const rowExpandedMark=new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r;rowExpandedMark.data=this.rowsExpanded[i],this.data[i].push(rowExpandedMark);const rowContext=new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r;rowContext.data=this.rowsContext[i],this.data[i].push(rowContext);const rowClass=new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r;rowClass.data=this.rowsClass[i],this.data[i].push(rowClass);const rowIndex=new _table_item_class__WEBPACK_IMPORTED_MODULE_3__.r;rowIndex.data=this.rowsIndices[i],this.data[i].push(rowIndex)}}popRowStateFromModelData(){for(let i=0;i<this.data.length;i++)this.rowsIndices[i]=this.data[i].pop().data,this.rowsClass[i]=this.data[i].pop().data,this.rowsContext[i]=this.data[i].pop().data,this.rowsExpanded[i]=!!this.data[i].pop().data,this.rowsSelected[i]=!!this.data[i].pop().data}isRowFiltered(index){const realIndex=this.realRowIndex(index);return this.header.some(((item,i)=>item&&item.filter(this.row(realIndex)[i])))}selectRow(index,value=!0){this.isRowDisabled(index)||(this.rowsSelected[index]=value,this.rowsSelectedChange.emit(index))}selectAll(value=!0){if(this.data.length>=1&&this.data[0].length>=1)for(let i=0;i<this.rowsSelected.length;i++)this.selectRow(i,value);this.selectAllChange.next(value)}isRowSelected(index){return this.rowsSelected[index]}isRowDisabled(index){return!!this.data[index].disabled}expandRow(index,value=!0){this.rowsExpanded[index]=value,this.rowsExpandedChange.emit(index)}expandAllRows(value=!0){if(this.data.length>0){for(let i=0;i<this.data.length;i++)this.isRowExpandable(i)&&(this.rowsExpanded[i]=value);value?this.rowsExpandedAllChange.emit():this.rowsCollapsedAllChange.emit()}}realRowIndex(index){return this.realIndex(index,this.data.length)}realColumnIndex(index){return this.realIndex(index,this.data[0].length)}realIndex(index,length){return null==index?length-1:index>=0?index>=length?length-1:index:-index>=length?0:length+index}}TableModel.COUNT=0},"./src/search/search.component.html?ngResource":module=>{module.exports='<div\n\tclass="cds--search"\n\t[ngClass]="{\n\t\t\'cds--search--sm\': size === \'sm\',\n\t\t\'cds--search--md\': size === \'md\',\n\t\t\'cds--search--lg\': size === \'lg\',\n\t\t\'cds--search--light\': theme === \'light\',\n\t\t\'cds--skeleton\': skeleton && !fluid,\n\t\t\'cds--search--expandable\': expandable && !tableSearch,\n\t\t\'cds--search--expanded\': expandable && !tableSearch && active,\n\t\t\'cds--toolbar-search\': toolbar && !expandable,\n\t\t\'cds--toolbar-search--active\': toolbar && !expandable && active,\n\t\t\'cds--toolbar-search-container-persistent\': tableSearch && !expandable,\n\t\t\'cds--toolbar-search-container-expandable\': tableSearch && expandable,\n\t\t\'cds--toolbar-search-container-active\': tableSearch && expandable && active,\n\t\t\'cds--search--fluid\': fluid,\n\t\t\'cds--search--disabled\': disabled\n\t}"\n\trole="search"\n\t[attr.aria-label]="ariaLabel"\n\t(click)="openSearch()">\n\t<label\n\t\tclass="cds--label"\n\t\t[for]="id"\n\t\t[ngClass]="{ \'cds--skeleton\': skeleton && fluid }">\n\t\t{{ !skeleton ? label : \'\'}}\n\t</label>\n\n\t<div *ngIf="skeleton; else enableInput" class="cds--text-input cds--skeleton"></div>\n\t<ng-template #enableInput>\n\t\t<input\n\t\t\t#input\n\t\t\tclass="cds--search-input"\n\t\t\t[type]="tableSearch || !toolbar ? \'text\' : \'search\'"\n\t\t\t[id]="id"\n\t\t\t[value]="value"\n\t\t\t[autocomplete]="autocomplete"\n\t\t\t[placeholder]="placeholder"\n\t\t\t[disabled]="disabled"\n\t\t\t[required]="required"\n\t\t\t(input)="onSearch($event.target.value)"\n\t\t\t(keyup.enter)="onEnter()"/>\n\t\t<button\n\t\t\t*ngIf="!tableSearch && toolbar"\n\t\t\tclass="cds--toolbar-search__btn"\n\t\t\t(click)="openSearch()"\n\t\t\taria-label="Open search">\n\t\t\t<svg cdsIcon="search" size="16" class="cds--search-magnifier-icon"></svg>\n\t\t</button>\n\t\t<svg\n\t\t\tcdsIcon="search"\n\t\t\t*ngIf="tableSearch || !toolbar"\n\t\t\tclass="cds--search-magnifier-icon"\n\t\t\tsize="16">\n\t\t</svg>\n\t</ng-template>\n\n\t<button\n\t\t*ngIf="tableSearch || !toolbar"\n\t\tclass="cds--search-close"\n\t\t[ngClass]="{\n\t\t\t\'cds--search-close--hidden\': !value || value.length === 0\n\t\t}"\n\t\t[title]="clearButtonTitle"\n\t\t(click)="clearSearch()">\n\t\t<span class="cds--visually-hidden">{{ clearButtonTitle }}</span>\n\t\t<svg cdsIcon="close" size="16"></svg>\n\t</button>\n</div>\n'}}]);

package/docs/storybook/combobox-combobox-stories.e3d08f7d.iframe.bundle.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[9736],{"./src/ai-label/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{zb:()=>AILabelActions,UD:()=>AILabelComponent,q:()=>AILabelContent,uV:()=>AILabelModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let AILabelActions=class AILabelActions{constructor(){this.toggletipActions=!0,this.aiLabelActions=!0}};AILabelActions.propDecorators={toggletipActions:[{type:core.HostBinding,args:["class.cds--toggletip-actions"]}],aiLabelActions:[{type:core.HostBinding,args:["class.cds--ai-label-actions"]}]},AILabelActions=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsAILabelActions], [ibmAILabelActions]"})],AILabelActions);let AILabelContent=class AILabelContent{};AILabelContent=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsAILabelContent], [ibmAILabelContent]"})],AILabelContent);var popover=__webpack_require__("./src/popover/index.ts");let AILabelPopoverDirective=class AILabelPopoverDirective extends popover.OI{constructor(elementRef,ngZone,renderer,changeDetectorRef){super(elementRef,ngZone,renderer,changeDetectorRef),this.elementRef=elementRef,this.ngZone=ngZone,this.renderer=renderer,this.changeDetectorRef=changeDetectorRef,this.highContrast=!0,this.dropShadow=!1}initializeReferences(){this.updateAlignmentClass(this._align),this.bindPopoverRefs(),this.handleChange(this.isOpen)}ngOnChanges(changes){const originalState=this.isOpen;this.handleChange(!1),changes.autoAlign&&!changes.autoAlign.firstChange&&(this.popoverContentRef?.setAttribute("style",""),this.bindPopoverRefs()),this.handleChange(originalState)}bindPopoverRefs(){const panel=this.elementRef.nativeElement.querySelector(":scope > span.cds--popover");panel&&(this.popoverContentRef=panel.querySelector(":scope > span.cds--popover-content"),this.caretRef=this.resolveCaretRef(panel))}resolveCaretRef(panel){return this.autoAlign?panel.querySelector("span.cds--popover-content > span.cds--popover-caret.cds--popover--auto-align"):panel.querySelector(":scope > span.cds--popover-caret")}};AILabelPopoverDirective.ctorParameters=()=>[{type:core.ElementRef},{type:core.NgZone},{type:core.Renderer2},{type:core.ChangeDetectorRef}],AILabelPopoverDirective=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsAILabelPopover]"})],AILabelPopoverDirective);let AILabelComponent=class AILabelComponent{constructor(elementRef){this.elementRef=elementRef,this.aiLabelClass=!0,this.caret=!0,this.dropShadow=!1,this.highContrast=!0,this.autoAlign=!1,this.isOpen=!1,this.onClose=new core.EventEmitter,this.onOpen=new core.EventEmitter,this.isOpenChange=new core.EventEmitter,this.id="ai-label-"+AILabelComponent.labelCounter++,this.aiText="AI",this.kind="default",this.size="xs",this.revertActive=!1,this.revertLabel="Revert to AI input",this.ariaLabel="Show information",this.revertClick=new core.EventEmitter,this.documentClick=this.handleOutsideClick.bind(this)}get revertClass(){return this.revertActive}get alignmentAxisOffset(){return["mini","2xs","xs"].includes(this.size)?-24:0}onPopoverIsOpenChange(open){this.isOpen=open,this.isOpenChange.emit(open)}get triggerClasses(){return{"cds--toggletip-button":!0,"cds--ai-label__button":!0,[`cds--ai-label__button--${this.size}`]:!0,[`cds--ai-label__button--${this.kind}`]:!0,"cds--ai-label__button--inline-with-content":"inline"===this.kind&&!!this.textLabel}}get computedAriaLabel(){const suffix="inline"===this.kind&&this.textLabel?this.textLabel:this.ariaLabel;return`${this.aiText} ${suffix}`}ngAfterViewInit(){this.isOpen&&document.addEventListener("click",this.documentClick)}ngOnChanges(changes){changes.revertActive&&!changes.revertActive.firstChange&&changes.revertActive.currentValue&&(this.isOpen=!1,document.removeEventListener("click",this.documentClick))}ngOnDestroy(){document.removeEventListener("click",this.documentClick)}onTriggerClick(event){const opening=!this.isOpen;opening?document.addEventListener("click",this.documentClick):document.removeEventListener("click",this.documentClick),this.aiLabelPopover?.handleChange(opening,event)}onRevertButtonClick(event){this.revertClick.emit(event)}hostkeys(event){this.isOpen&&"Escape"===event.key&&(event.stopPropagation(),document.removeEventListener("click",this.documentClick),this.aiLabelPopover?.handleChange(!1,event))}handleOutsideClick(event){this.elementRef.nativeElement.contains(event.target)||(this.aiLabelPopover?.handleChange(!1,event),document.removeEventListener("click",this.documentClick))}};AILabelComponent.labelCounter=0,AILabelComponent.ctorParameters=()=>[{type:core.ElementRef}],AILabelComponent.propDecorators={aiLabelClass:[{type:core.HostBinding,args:["class.cds--ai-label"]}],revertClass:[{type:core.HostBinding,args:["class.cds--ai-label--revert"]}],align:[{type:core.Input}],caret:[{type:core.Input}],dropShadow:[{type:core.Input}],highContrast:[{type:core.Input}],autoAlign:[{type:core.Input}],isOpen:[{type:core.Input}],onClose:[{type:core.Output}],onOpen:[{type:core.Output}],isOpenChange:[{type:core.Output}],id:[{type:core.Input}],aiText:[{type:core.Input}],textLabel:[{type:core.Input}],kind:[{type:core.Input}],size:[{type:core.Input}],revertActive:[{type:core.Input}],revertLabel:[{type:core.Input}],ariaLabel:[{type:core.Input}],revertClick:[{type:core.Output}],aiLabelPopover:[{type:core.ViewChild,args:["aiLabelPopoverHost",{read:AILabelPopoverDirective}]}],hostkeys:[{type:core.HostListener,args:["keyup",["$event"]]}]},AILabelComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-ai-label, ibm-ai-label",changeDetection:core.ChangeDetectionStrategy.OnPush,template:'\n\t\t<ng-container *ngIf="!revertActive">\n\t\t\t<span\n\t\t\t\t#aiLabelPopoverHost\n\t\t\t\tcdsAILabelPopover\n\t\t\t\tclass="cds--toggletip"\n\t\t\t\t[isOpen]="isOpen"\n\t\t\t\t(isOpenChange)="onPopoverIsOpenChange($event)"\n\t\t\t\t(onOpen)="onOpen.emit($event)"\n\t\t\t\t(onClose)="onClose.emit($event)"\n\t\t\t\t[align]="align"\n\t\t\t\t[caret]="caret"\n\t\t\t\t[dropShadow]="dropShadow"\n\t\t\t\t[highContrast]="highContrast"\n\t\t\t\t[autoAlign]="autoAlign"\n\t\t\t\t[alignmentAxisOffset]="alignmentAxisOffset">\n\t\t\t\t<button\n\t\t\t\t\ttype="button"\n\t\t\t\t\t[attr.aria-label]="computedAriaLabel"\n\t\t\t\t\t[attr.aria-expanded]="isOpen"\n\t\t\t\t\t[attr.aria-controls]="id"\n\t\t\t\t\t[ngClass]="triggerClasses"\n\t\t\t\t\t(click)="onTriggerClick($event)">\n\t\t\t\t\t<span class="cds--ai-label__text">{{aiText}}</span>\n\t\t\t\t\t<span *ngIf="kind === \'inline\' && textLabel" class="cds--ai-label__additional-text">{{textLabel}}</span>\n\t\t\t\t</button>\n\n\t\t\t\t<span\n\t\t\t\t\t[id]="id"\n\t\t\t\t\tclass="cds--popover"\n\t\t\t\t\taria-live="polite">\n\t\t\t\t\t<span class="cds--popover-content cds--ai-label-content">\n\t\t\t\t\t\t<div class="cds--toggletip-content">\n\t\t\t\t\t\t\t<ng-content></ng-content>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<span *ngIf="autoAlign" class="cds--popover-caret cds--popover--auto-align"></span>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf="!autoAlign" class="cds--popover-caret"></span>\n\t\t\t\t</span>\n\t\t\t</span>\n\t\t</ng-container>\n\n\t\t<cds-icon-button\n\t\t\t*ngIf="revertActive"\n\t\t\tkind="ghost"\n\t\t\tsize="sm"\n\t\t\t[description]="revertLabel"\n\t\t\t[autoAlign]="autoAlign"\n\t\t\t[buttonAttributes]="{ \'aria-label\': revertLabel }"\n\t\t\t(click)="onRevertButtonClick($event)">\n\t\t\t<svg cdsIcon="undo" size="16"></svg>\n\t\t</cds-icon-button>\n\t'})],AILabelComponent);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),src_button=__webpack_require__("./src/button/index.ts"),icon=__webpack_require__("./src/icon/index.ts");let AILabelModule=class AILabelModule{};AILabelModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[AILabelComponent,AILabelPopoverDirective,AILabelContent,AILabelActions],exports:[AILabelComponent,AILabelContent,AILabelActions],imports:[common.CommonModule,src_button.hJ,icon.QX,popover.UU]})],AILabelModule)},"./src/placeholder/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Qq:()=>PlaceholderModule,Q_:()=>PlaceholderService});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let PlaceholderService=class PlaceholderService{constructor(){this.viewContainerRef=null,this.viewContainerMap=new Map}registerViewContainerRef(vcRef,id){id?this.viewContainerMap.set(id,vcRef):this.viewContainerRef=vcRef}createComponent(component,injector,id,environment){return id?this.viewContainerMap.has(id)?this.viewContainerMap.get(id).createComponent(component,{index:this.viewContainerMap.size,injector}):void console.error(`No view container with id ${id} found`):this.viewContainerRef?this.viewContainerRef.createComponent(component,{index:this.viewContainerRef.length,injector,environmentInjector:environment}):void console.error("No view container defined! Likely due to a missing `cds-placeholder`")}destroyComponent(component){component.destroy()}hasComponentRef(component,id){return id?!(this.viewContainerMap.get(id).indexOf(component.hostView)<0):!(this.viewContainerRef.indexOf(component.hostView)<0)}hasPlaceholderRef(id){return id?this.viewContainerMap.has(id):!!this.viewContainerRef}appendElement(element,id){return id?this.viewContainerMap.get(id).element.nativeElement.appendChild(element):this.viewContainerRef.element.nativeElement.appendChild(element)}removeElement(element,id){return id?this.viewContainerMap.get(id).element.nativeElement.removeChild(element):this.viewContainerRef.element.nativeElement.removeChild(element)}hasElement(element,id){return id?this.viewContainerMap.get(id).element.nativeElement.contains(element):this.viewContainerRef.element.nativeElement.contains(element)}};PlaceholderService=(0,tslib_es6.gn)([(0,core.Injectable)()],PlaceholderService);let Placeholder=class Placeholder{constructor(placeholderService){this.placeholderService=placeholderService}ngOnInit(){this.placeholderService.registerViewContainerRef(this.viewContainerRef)}};Placeholder.ctorParameters=()=>[{type:PlaceholderService}],Placeholder.propDecorators={id:[{type:core.Input}],viewContainerRef:[{type:core.ViewChild,args:["placeholder",{read:core.ViewContainerRef,static:!0}]}]},Placeholder=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-placeholder, ibm-placeholder",template:"<div #placeholder></div>"})],Placeholder);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs");const PLACEHOLDER_SERVICE_PROVIDER={provide:PlaceholderService,deps:[[new core.Optional,new core.SkipSelf,PlaceholderService]],useFactory:function PLACEHOLDER_SERVICE_PROVIDER_FACTORY(parentService){return parentService||new PlaceholderService}};let PlaceholderModule=class PlaceholderModule{};PlaceholderModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Placeholder],exports:[Placeholder],providers:[PLACEHOLDER_SERVICE_PROVIDER],imports:[common.CommonModule]})],PlaceholderModule)},"./src/combobox/combobox.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Basic:()=>Basic,BasicMax:()=>BasicMax,Dynamic:()=>Dynamic,Fluid:()=>Fluid,MockQuerySearch:()=>MockQuerySearch,Multiselect:()=>Multiselect,ReactiveForms:()=>ReactiveForms,__namedExportsOrder:()=>__namedExportsOrder,default:()=>combobox_stories,filterableWithAILabel:()=>filterableWithAILabel,withAILabel:()=>withAILabel});var fesm2020_forms=__webpack_require__("./node_modules/@angular/forms/fesm2020/forms.mjs"),dist=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),dropdown=__webpack_require__("./src/dropdown/index.ts"),filter=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/operators/filter.js"),utils=__webpack_require__("./src/utils/index.ts"),i18n=__webpack_require__("./src/i18n/index.ts");let ComboBox=class ComboBox{constructor(elementRef,dropdownService,i18n){this.elementRef=elementRef,this.dropdownService=dropdownService,this.i18n=i18n,this.id="combobox-"+ComboBox.comboBoxCount++,this.labelId="combobox-label-"+ComboBox.comboBoxCount++,this.items=[],this.type="single",this.size="md",this.hideLabel=!1,this.appendInline=null,this.invalid=!1,this.warn=!1,this.maxLength=null,this.theme="dark",this.selectionFeedback="top-after-reopen",this.autocomplete="list",this.disabled=!1,this.readonly=!1,this.fluid=!1,this.selected=new core.EventEmitter,this.submit=new core.EventEmitter,this.close=new core.EventEmitter,this.search=new core.EventEmitter,this.clear=new core.EventEmitter,this.hostClass=!0,this.open=!1,this.showClearButton=!1,this.pills=[],this.selectedValue="",this.outsideClick=this._outsideClick.bind(this),this.keyboardNav=this._keyboardNav.bind(this),this._dropUp=!1,this.noop=this._noop.bind(this),this.onTouchedCallback=this._noop,this.propagateChangeCallback=this._noop,this._placeholder=this.i18n.getOverridable("COMBOBOX.PLACEHOLDER"),this._closeMenuAria=this.i18n.getOverridable("COMBOBOX.A11Y.CLOSE_MENU"),this._openMenuAria=this.i18n.getOverridable("COMBOBOX.A11Y.OPEN_MENU"),this._clearSelectionsTitle=this.i18n.getOverridable("COMBOBOX.CLEAR_SELECTIONS"),this._clearSelectionsAria=this.i18n.getOverridable("COMBOBOX.A11Y.CLEAR_SELECTIONS"),this._clearSelectionTitle=this.i18n.getOverridable("COMBOBOX.CLEAR_SELECTED"),this._clearSelectionAria=this.i18n.getOverridable("COMBOBOX.A11Y.CLEAR_SELECTED"),this._isFocused=!1,this._isUsingNgControl=!1}set placeholder(value){this._placeholder.override(value)}get placeholder(){return this._placeholder.value}set openMenuAria(value){this._openMenuAria.override(value)}get openMenuAria(){return this._openMenuAria.value}set closeMenuAria(value){this._closeMenuAria.override(value)}get closeMenuAria(){return this._closeMenuAria.value}set clearSelectionsTitle(value){this._clearSelectionsTitle.override(value)}get clearSelectionsTitle(){return this._clearSelectionsTitle.value}set clearSelectionsAria(value){this._clearSelectionsAria.override(value)}get clearSelectionsAria(){return this._clearSelectionsAria.value}set clearSelectionTitle(value){this._clearSelectionTitle.override(value)}get clearSelectionTitle(){return this._clearSelectionTitle.value}set clearSelectionAria(value){this._clearSelectionAria.override(value)}get clearSelectionAria(){return this._clearSelectionAria.value}ngOnChanges(changes){changes.items&&(this.view.items=changes.items.currentValue,this.updateSelected(),("multi"===this.type||"single"===this.type&&!this.selectedValue)&&this.onSearch(this.input.nativeElement.value,!1))}ngAfterContentInit(){if(this.view){this.view.type=this.type;const isUpdate=event=>event&&event.isUpdate;this.view.select.subscribe((event=>{if(Array.isArray(event)){if(this.updatePills(),!isUpdate(event)){if(this.itemValueKey&&this.view.getSelected()){const values=this.view.getSelected().map((item=>item[this.itemValueKey]));this._propagateChange(values)}else this._propagateChange(this.view.getSelected());this.selected.emit(event)}}else event.item&&event.item.selected?(this.showClearButton=!0,this.selectedValue=event.item.content,isUpdate(event)||(this.itemValueKey?this._propagateChange(event.item[this.itemValueKey]):this._propagateChange(event.item))):(this.selectedValue="",isUpdate(event)||this._propagateChange(null)),isUpdate(event)?this._isUsingNgControl&&this.writeValue(this._writtenValue):(this.elementRef.nativeElement.querySelector("input").focus(),this.view.filterBy(""),this.selected.emit(event.item),this.closeDropdown())})),setTimeout((()=>{this.updateSelected()})),this.view.blurIntent.pipe((0,filter.h)((v=>"top"===v))).subscribe((()=>{this.elementRef.nativeElement.querySelector(".cds--text-input").focus()}))}}ngAfterViewInit(){null===this.appendInline&&(0,utils.OQ)(this.elementRef.nativeElement)?this.appendInline=!1:null===this.appendInline&&(this.appendInline=!0)}ngOnDestroy(){this.appendInline||this._appendToDropdown()}hostkeys(ev){"Escape"===ev.key?this.closeDropdown():"ArrowDown"!==ev.key||this.dropdownMenu&&this.dropdownMenu.nativeElement.contains(ev.target)||(ev.preventDefault(),this.openDropdown(),setTimeout((()=>{this.view.initFocus()}),0)),this.open&&"Tab"===ev.key&&(this.dropdownMenu.nativeElement.contains(ev.target)||ev.target===this.input.nativeElement)&&this.closeDropdown(),this.open&&"Tab"===ev.key&&ev.shiftKey&&this.closeDropdown()}_noop(){}writeValue(value){if(this._writtenValue=value,"single"===this.type){if(this.itemValueKey){const newValue=Object.assign({},this.view.getListItems().find((item=>item[this.itemValueKey]===value)));newValue.selected=!0,this.view.propagateSelected([newValue])}else this.view.propagateSelected([value||""]);this.showClearButton=!(!value||!this.view.getSelected().length)}else if(this.itemValueKey){let newValues=[];for(const v of value??[])for(const item of this.view.getListItems())item[this.itemValueKey]===v&&newValues.push(Object.assign({},item,{selected:!0}));this.view.propagateSelected(newValues)}else this.view.propagateSelected(value||[""]);this.updateSelected()}_propagateChange(value){this._writtenValue=value,this.propagateChangeCallback(value)}onBlur(){this.onTouchedCallback()}registerOnChange(fn){this._isUsingNgControl=!0,this.propagateChangeCallback=fn}registerOnTouched(fn){this.onTouchedCallback=fn}setDisabledState(isDisabled){this.disabled=isDisabled}updatePills(){this.pills=this.view.getSelected()||[],this.checkForReorder()}clearSelected(event){this.items=this.items.map((item=>(item.disabled||(item.selected=!1),item))),this.view.propagateSelected([]),this.updatePills();const selected=this.view.getSelected();if(this.itemValueKey&&selected){const values=selected.map((item=>item[this.itemValueKey]));this._propagateChange(values)}else this._propagateChange(selected);this.selected.emit(selected),this.clear.emit(event)}closeDropdown(){this.open=!1,this.checkForReorder(),this.close.emit(),this.appendInline||this._appendToDropdown(),document.removeEventListener("click",this.outsideClick,!0)}openDropdown(){this.disabled||this.readonly||(this.open=!0,this._dropUp=!1,this.appendInline||this._appendToBody(),document.addEventListener("click",this.outsideClick,!0),setTimeout((()=>{null!==this.dropUp&&void 0!==this.dropUp||(this._dropUp=this._shouldDropUp())}),0))}toggleDropdown(){this.open?this.closeDropdown():this.openDropdown()}onSearch(searchString,shouldEmitSearch=!0){if(shouldEmitSearch&&this.search.emit(searchString),this.showClearButton=!!searchString,this.view.filterBy(searchString),""!==searchString?this.open||this.openDropdown():(this.selectedValue="","multi"!==this.type||"top"!==this.selectionFeedback&&"top-after-reopen"!==this.selectionFeedback||this.view.reorderSelected()),"single"===this.type){if(!this.view.getListItems().some((item=>item.content.toLowerCase().includes(searchString.toLowerCase())))){const selected=this.view.getSelected();selected&&selected[0]||this.view.filterBy(searchString)}}}onSubmit(event){this.submit.emit({items:this.view.getListItems(),index:0,value:{content:event.target.value,selected:!1}})}clearInput(event){event.stopPropagation(),event.preventDefault(),this.disabled||this.readonly||("single"===this.type&&(this.clearSelected(event),this.closeDropdown()),this.selectedValue="",this.input.nativeElement.value="",this.showClearButton=!1,this.input.nativeElement.focus(),this.onSearch(this.input.nativeElement.value))}isTemplate(value){return value instanceof core.TemplateRef}_keyboardNav(event){"Escape"===event.key&&this.open&&event.stopImmediatePropagation(),"Escape"===event.key?(event.preventDefault(),this.closeDropdown(),this.input.nativeElement.focus()):this.open&&"Tab"===event.key&&(this.input.nativeElement.focus(),this.input.nativeElement.dispatchEvent(new KeyboardEvent("keydown",{bubbles:!0,cancelable:!0,key:"Tab"})),this.closeDropdown())}_appendToBody(){this.dropdownService.appendToBody(this.listbox.nativeElement,this.dropdownMenu.nativeElement,`${this.elementRef.nativeElement.className}${this.open?" cds--list-box--expanded":""}`),this.dropdownMenu.nativeElement.addEventListener("keydown",this.keyboardNav,!0)}_appendToDropdown(){this.dropdownService.appendToDropdown(this.elementRef.nativeElement),this.dropdownMenu.nativeElement.removeEventListener("keydown",this.keyboardNav,!0)}_shouldDropUp(){const menu=this.dropdownMenu&&this.dropdownMenu.nativeElement.querySelector(".cds--list-box__menu"),menuRect=menu&&menu.getBoundingClientRect();if(menu&&menuRect){return(0,utils.O3)(menu).reduce(((shouldDropUp,parent)=>{const parentRect=parent.getBoundingClientRect(),isBelowParent=!(menuRect.bottom<=parentRect.bottom);return shouldDropUp||isBelowParent}),!1)}return!1}_outsideClick(event){this.elementRef.nativeElement.contains(event.target)||this.dropdownMenu.nativeElement.contains(event.target)||this.closeDropdown()}handleFocus(event){this._isFocused="focus"===event.type}updateSelected(){const selected=this.view.getSelected();if("multi"===this.type)this.updatePills();else if(selected){const value=selected[0]?selected[0].content:"";selected[0]&&selected[0];this.selectedValue=value,this.showClearButton=!!value}}checkForReorder(){const topAfterReopen=!this.open&&"top-after-reopen"===this.selectionFeedback;"multi"!==this.type||!topAfterReopen&&"top"!==this.selectionFeedback||this.view.reorderSelected(!0)}};ComboBox.comboBoxCount=0,ComboBox.ctorParameters=()=>[{type:core.ElementRef},{type:dropdown.Vn},{type:i18n.oc}],ComboBox.propDecorators={placeholder:[{type:core.Input}],openMenuAria:[{type:core.Input}],closeMenuAria:[{type:core.Input}],clearSelectionsTitle:[{type:core.Input}],clearSelectionsAria:[{type:core.Input}],clearSelectionTitle:[{type:core.Input}],clearSelectionAria:[{type:core.Input}],id:[{type:core.Input}],labelId:[{type:core.Input}],items:[{type:core.Input}],type:[{type:core.Input}],size:[{type:core.Input}],itemValueKey:[{type:core.Input}],label:[{type:core.Input}],hideLabel:[{type:core.Input}],helperText:[{type:core.Input}],decorator:[{type:core.Input}],appendInline:[{type:core.Input}],invalid:[{type:core.Input}],invalidText:[{type:core.Input}],warn:[{type:core.Input}],warnText:[{type:core.Input}],maxLength:[{type:core.Input}],theme:[{type:core.Input}],selectionFeedback:[{type:core.Input}],autocomplete:[{type:core.Input}],dropUp:[{type:core.Input}],disabled:[{type:core.Input}],readonly:[{type:core.Input}],fluid:[{type:core.Input}],selected:[{type:core.Output}],submit:[{type:core.Output}],close:[{type:core.Output}],search:[{type:core.Output}],clear:[{type:core.Output}],view:[{type:core.ContentChild,args:[dropdown.jq,{static:!0}]}],dropdownMenu:[{type:core.ViewChild,args:["dropdownMenu"]}],input:[{type:core.ViewChild,args:["input",{static:!0}]}],listbox:[{type:core.ViewChild,args:["listbox",{static:!0}]}],hostClass:[{type:core.HostBinding,args:["class.cds--list-box__wrapper"]}],hostkeys:[{type:core.HostListener,args:["keydown",["$event"]]}]},ComboBox=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-combo-box, ibm-combo-box",template:'\n\t\t<div\n\t\t\tclass="cds--list-box__wrapper"\n\t\t\t[ngClass]="{\n\t\t\t\t\'cds--list-box__wrapper--fluid\': fluid,\n\t\t\t\t\'cds--list-box__wrapper--fluid--invalid\': fluid && invalid,\n\t\t\t\t\'cds--list-box__wrapper--fluid--focus\': fluid && _isFocused,\n\t\t\t\t\'cds--list-box__wrapper--decorator\': !!decorator\n\t\t\t}">\n\t\t\t<label\n\t\t\t\t*ngIf="label"\n\t\t\t\t[for]="id"\n\t\t\t\t[id]="labelId"\n\t\t\t\tclass="cds--label"\n\t\t\t\t[ngClass]="{\n\t\t\t\t\t\'cds--label--disabled\': disabled,\n\t\t\t\t\t\'cds--visually-hidden\': hideLabel\n\t\t\t\t}">\n\t\t\t\t<ng-container *ngIf="!isTemplate(label)">{{label}}</ng-container>\n\t\t\t\t<ng-template *ngIf="isTemplate(label)" [ngTemplateOutlet]="label"></ng-template>\n\t\t\t</label>\n\t\t\t<div\n\t\t\t\t#listbox\n\t\t\t\t[ngClass]="{\n\t\t\t\t\t\'cds--multi-select cds--multi-select--filterable\': type === \'multi\',\n\t\t\t\t\t\'cds--list-box--light\': theme === \'light\',\n\t\t\t\t\t\'cds--list-box--expanded\': open,\n\t\t\t\t\t\'cds--list-box--sm\': size === \'sm\',\n\t\t\t\t\t\'cds--list-box--md\': size === \'md\',\n\t\t\t\t\t\'cds--list-box--lg\': size === \'lg\',\n\t\t\t\t\t\'cds--list-box--disabled\': disabled,\n\t\t\t\t\t\'cds--combo-box--readonly\': readonly,\n\t\t\t\t\t\'cds--combo-box--warning cds--list-box--warning\': warn,\n\t\t\t\t\t\'cds--list-box--invalid\': invalid\n\t\t\t\t}"\n\t\t\t\tclass="cds--list-box cds--combo-box"\n\t\t\t\t[attr.data-invalid]="(invalid ? true : null)">\n\t\t\t\t<div\n\t\t\t\t\tclass="cds--list-box__field"\n\t\t\t\t\t(click)="toggleDropdown()"\n\t\t\t\t\t(blur)="onBlur()">\n\t\t\t\t\t<div\n\t\t\t\t\t\t*ngIf="type === \'multi\' && pills.length > 0"\n\t\t\t\t\t\tclass="cds--tag cds--tag--filter cds--tag--high-contrast"\n\t\t\t\t\t\t[ngClass]="{\'cds--tag--disabled\': disabled || readonly}">\n\t\t\t\t\t\t<span class="cds--tag__label">{{ pills.length }}</span>\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\ttype="button"\n\t\t\t\t\t\t\t(click)="clearSelected($event)"\n\t\t\t\t\t\t\t(blur)="onBlur()"\n\t\t\t\t\t\t\t(keydown.enter)="clearSelected($event)"\n\t\t\t\t\t\t\tclass="cds--tag__close-icon"\n\t\t\t\t\t\t\ttabindex="0"\n\t\t\t\t\t\t\t[title]="clearSelectionsTitle"\n\t\t\t\t\t\t\t[disabled]="disabled || readonly"\n\t\t\t\t\t\t\t[attr.aria-label]="clearSelectionAria">\n\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\tfocusable="false"\n\t\t\t\t\t\t\t\tpreserveAspectRatio="xMidYMid meet"\n\t\t\t\t\t\t\t\tstyle="will-change: transform;"\n\t\t\t\t\t\t\t\trole="img"\n\t\t\t\t\t\t\t\txmlns="http://www.w3.org/2000/svg"\n\t\t\t\t\t\t\t\twidth="16"\n\t\t\t\t\t\t\t\theight="16"\n\t\t\t\t\t\t\t\tviewBox="0 0 16 16"\n\t\t\t\t\t\t\t\taria-hidden="true">\n\t\t\t\t\t\t\t\t<path d="M12 4.7l-.7-.7L8 7.3 4.7 4l-.7.7L7.3 8 4 11.3l.7.7L8 8.7l3.3 3.3.7-.7L8.7 8z"></path>\n\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#input\n\t\t\t\t\t\ttype="text"\n\t\t\t\t\t\tautocomplete="off"\n\t\t\t\t\t\trole="combobox"\n\t\t\t\t\t\t[disabled]="disabled"\n\t\t\t\t\t\t[readOnly]="readonly"\n\t\t\t\t\t\t(input)="onSearch($event.target.value)"\n\t\t\t\t\t\t(focus)="fluid ? handleFocus($event) : null"\n\t\t\t\t\t\t(blur)="fluid ? handleFocus($event) : onBlur()"\n\t\t\t\t\t\t(keydown.enter)="onSubmit($event)"\n\t\t\t\t\t\t[value]="selectedValue"\n\t\t\t\t\t\tclass="cds--text-input"\n\t\t\t\t\t\t[ngClass]="{\'cds--text-input--empty\': !showClearButton}"\n\t\t\t\t\t\ttabindex="0"\n\t\t\t\t\t\t[id]="id"\n\t\t\t\t\t\t[attr.aria-labelledby]="labelId"\n\t\t\t\t\t\t[attr.aria-expanded]="open"\n\t\t\t\t\t\taria-haspopup="listbox"\n\t\t\t\t\t\t[attr.maxlength]="maxLength"\n\t\t\t\t\t\t[attr.aria-controls]="open ? view?.listId : null"\n\t\t\t\t\t\t[attr.aria-autocomplete]="autocomplete"\n\t\t\t\t\t\t[placeholder]="placeholder"/>\n\t\t\t\t\t<svg\n\t\t\t\t\t\t*ngIf="invalid"\n\t\t\t\t\t\tcdsIcon="warning--filled"\n\t\t\t\t\t\tsize="16"\n\t\t\t\t\t\tclass="cds--list-box__invalid-icon">\n\t\t\t\t\t</svg>\n\t\t\t\t\t<svg\n\t\t\t\t\t\t*ngIf="!invalid && warn"\n\t\t\t\t\t\tcdsIcon="warning--alt--filled"\n\t\t\t\t\t\tsize="16"\n\t\t\t\t\t\tclass="cds--list-box__invalid-icon cds--list-box__invalid-icon--warning">\n\t\t\t\t\t</svg>\n\t\t\t\t\t<div\n\t\t\t\t\t\t*ngIf="showClearButton"\n\t\t\t\t\t\trole="button"\n\t\t\t\t\t\tclass="cds--list-box__selection"\n\t\t\t\t\t\ttabindex="0"\n\t\t\t\t\t\t[attr.aria-label]="clearSelectionAria"\n\t\t\t\t\t\t[title]="clearSelectionTitle"\n\t\t\t\t\t\t(keyup.enter)="clearInput($event)"\n\t\t\t\t\t\t(click)="clearInput($event)"\n\t\t\t\t\t\t(blur)="onBlur()">\n\t\t\t\t\t\t<svg cdsIcon="close" size="16"></svg>\n\t\t\t\t\t</div>\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype="button"\n\t\t\t\t\t\trole="button"\n\t\t\t\t\t\tclass="cds--list-box__menu-icon"\n\t\t\t\t\t\ttabindex="-1"\n\t\t\t\t\t\t[title]="open ? closeMenuAria : openMenuAria"\n\t\t\t\t\t\t[attr.aria-label]="open ? closeMenuAria : openMenuAria"\n\t\t\t\t\t\t[ngClass]="{\'cds--list-box__menu-icon--open\': open}">\n\t\t\t\t\t\t<svg cdsIcon="chevron--down" size="16"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</div>\n\t\t\t\t<ng-container *ngIf="decorator">\n\t\t\t\t\t<div class="cds--list-box__inner-wrapper--decorator">\n\t\t\t\t\t\t<ng-template [ngTemplateOutlet]="decorator"></ng-template>\n\t\t\t\t\t</div>\n\t\t\t\t</ng-container>\n\t\t\t\t<div\n\t\t\t\t\t#dropdownMenu\n\t\t\t\t\t[ngClass]="{\n\t\t\t\t\t\t\'cds--list-box--up\': this.dropUp !== null && this.dropUp !== undefined ? dropUp : _dropUp\n\t\t\t\t\t}">\n\t\t\t\t\t<ng-content *ngIf="open"></ng-content>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<hr *ngIf="fluid" class="cds--list-box__divider" />\n\t\t\t<div\n\t\t\t\t*ngIf="helperText && !invalid && !warn && !fluid"\n\t\t\t\tclass="cds--form__helper-text"\n\t\t\t\t[ngClass]="{\'cds--form__helper-text--disabled\': disabled}">\n\t\t\t\t<ng-container *ngIf="!isTemplate(helperText)">{{helperText}}</ng-container>\n\t\t\t\t<ng-template *ngIf="isTemplate(helperText)" [ngTemplateOutlet]="helperText"></ng-template>\n\t\t\t</div>\n\t\t\t<div *ngIf="invalid" class="cds--form-requirement">\n\t\t\t\t<ng-container *ngIf="!isTemplate(invalidText)">{{ invalidText }}</ng-container>\n\t\t\t\t<ng-template *ngIf="isTemplate(invalidText)" [ngTemplateOutlet]="invalidText"></ng-template>\n\t\t\t</div>\n\t\t\t<div *ngIf="!invalid && warn" class="cds--form-requirement">\n\t\t\t\t<ng-container *ngIf="!isTemplate(warnText)">{{warnText}}</ng-container>\n\t\t\t\t<ng-template *ngIf="isTemplate(warnText)" [ngTemplateOutlet]="warnText"></ng-template>\n\t\t\t</div>\n\t\t</div>\n\t',providers:[{provide:fesm2020_forms.JU,useExisting:ComboBox,multi:!0}]})],ComboBox);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),icon=__webpack_require__("./src/icon/index.ts");let ComboBoxModule=class ComboBoxModule{};ComboBoxModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[ComboBox],exports:[ComboBox,dropdown.kW],imports:[common.CommonModule,dropdown.kW,i18n.LU,utils.As,icon.QX],providers:[dropdown.Vn]})],ComboBoxModule);let DynamicListComboBox=class DynamicListComboBox{constructor(){this.items=[{content:"one"},{content:"two"},{content:"three"},{content:"four"}]}updateSelected(event){this.items.forEach((item=>{event.some((selectedItem=>selectedItem.content===item.content))?item.selected=!0:item.selected=!1}))}ngAfterViewInit(){setTimeout((()=>{const newItems=JSON.parse(JSON.stringify(this.items));newItems.push({content:`New ${newItems.length}`}),this.items=newItems}),4e3)}};DynamicListComboBox=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-dynamic-list-combobox",template:'\n\t\t<cds-combo-box\n\t\t\t[(items)]="items"\n\t\t\titemValueKey="content"\n\t\t\ttype="multi"\n\t\t\t(selected)="updateSelected($event)">\n\t\t\t<cds-dropdown-list></cds-dropdown-list>\n\t\t</cds-combo-box>\n\t'})],DynamicListComboBox);let MockQueryCombobox=class MockQueryCombobox{constructor(){this.filterItems=[]}onSearch(){setTimeout((()=>{const array=[{content:`Random ${Math.random()}`},{content:`Random ${Math.random()}`},{content:`Random ${Math.random()}`},{content:`Random ${Math.random()}`}];this.currentlySelected&&array.push(this.currentlySelected),this.filterItems=array}),1e3)}selected(event){Array.isArray(event)&&!event.length?this.currentlySelected=void 0:this.currentlySelected=event}};MockQueryCombobox=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-mock-query-search",template:'\n\t\t<cds-combo-box\n\t\t\tappendInline="true"\n\t\t\t[items]="filterItems"\n\t\t\titemValueKey="content"\n\t\t\t(search)="onSearch($event)"\n\t\t\t(selected)="selected($event)">\n\t\t\t<cds-dropdown-list></cds-dropdown-list>\n\t\t</cds-combo-box>\n\t'})],MockQueryCombobox);var isEqual=__webpack_require__("./node_modules/lodash-es/isEqual.js");let ReactiveFormsCombobox=class ReactiveFormsCombobox{constructor(fb){this.fb=fb,this.invalid=!1,this.invalidText="",this.warn=!1,this.warnText="",this.label="",this.helperText="",this.size="md",this.theme="dark",this.itemValueKey="",this._items=[]}set items(newItems){newItems.length||(newItems=[]),(0,isEqual.Z)(this._items,newItems)||(this._items=newItems)}set disabled(isDisabled){this.sampleForm&&(isDisabled?this.sampleForm.disable():this.sampleForm.enable())}ngOnInit(){this.sampleForm=this.fb.group({combobox:new fesm2020_forms.NI,multibox:new fesm2020_forms.NI}),this.sampleForm.get("combobox")?.setValue("four"),this.sampleForm.get("multibox")?.setValue(["four","two"])}};ReactiveFormsCombobox.ctorParameters=()=>[{type:fesm2020_forms.qu}],ReactiveFormsCombobox.propDecorators={invalid:[{type:core.Input}],invalidText:[{type:core.Input}],warn:[{type:core.Input}],warnText:[{type:core.Input}],label:[{type:core.Input}],helperText:[{type:core.Input}],size:[{type:core.Input}],theme:[{type:core.Input}],itemValueKey:[{type:core.Input}],items:[{type:core.Input}],disabled:[{type:core.Input}]},ReactiveFormsCombobox=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-reactive-combobox",template:'\n\t\t<form [formGroup]="sampleForm" (ngSubmit)="onSubmit(sampleForm)">\n\t\t\t<cds-combo-box\n\t\t\t\tformControlName="combobox"\n\t\t\t\t[size]="size"\n\t\t\t\t[label]="label"\n\t\t\t\t[helperText]="helperText"\n\t\t\t\t[itemValueKey]="itemValueKey"\n\t\t\t\t[theme]="theme"\n\t\t\t\t[invalid]="invalid"\n\t\t\t\t[invalidText]="invalidText"\n\t\t\t\t[warn]="warn"\n\t\t\t\t[warnText]="warnText"\n\t\t\t\t[items]="_items">\n\t\t\t\t<cds-dropdown-list></cds-dropdown-list>\n\t\t\t</cds-combo-box>\n\t\t\tselected: {{ sampleForm.get("combobox").value | json }}\n\t\t\t<cds-combo-box\n\t\t\t\tstyle="margin-top: 40px"\n\t\t\t\tformControlName="multibox"\n\t\t\t\t[label]="label"\n\t\t\t\t[size]="size"\n\t\t\t\t[itemValueKey]="itemValueKey"\n\t\t\t\t[helperText]="helperText"\n\t\t\t\ttype="multi"\n\t\t\t\t[invalid]="invalid"\n\t\t\t\t[invalidText]="invalidText"\n\t\t\t\t[warn]="warn"\n\t\t\t\t[warnText]="warnText"\n\t\t\t\t[items]="_items">\n\t\t\t\t<cds-dropdown-list></cds-dropdown-list>\n\t\t\t</cds-combo-box>\n\t\t\tselected: {{ sampleForm.get("multibox").value | json }}\n\t\t</form>\n\t'})],ReactiveFormsCombobox);var ai_label=__webpack_require__("./src/ai-label/index.ts"),src_button=__webpack_require__("./src/button/index.ts"),ai_label_story_shared=__webpack_require__("./src/storybook/ai-label-story-shared.ts");const combobox_stories={title:"Components/Combobox",decorators:[(0,dist.moduleMetadata)({declarations:[DynamicListComboBox,ReactiveFormsCombobox,MockQueryCombobox],imports:[fesm2020_forms.u5,fesm2020_forms.UX,ComboBoxModule,ai_label.uV,src_button.hJ,icon.QX]})],args:{label:"Label",hideLabel:!1,helperText:"Optional helper text",disabled:!1,readonly:!1,invalid:!1,invalidText:"A valid value is required",warn:!1,warnText:"This is a warning",items:[{content:"one"},{content:"two"},{content:"three"},{content:"four"},{content:"five"},{content:"six"},{content:"seven"},{content:"eight"},{content:"nine"},{content:"ten"}],appendInline:!1,dropUp:!1,selectionFeedback:"top-after-reopen",size:"md",theme:"dark",fluid:!1,itemValueKey:"content"},argTypes:{size:{options:["sm","md","lg"],control:"radio"},theme:{options:["light","dark"],control:"radio"},maxLength:{control:!1},type:{control:!1},selected:{action:"Selection changed!"},submit:{action:"Submit"},search:{action:"Search"},clear:{action:"Clear!"}},parameters:{layout:"centered"},component:ComboBox},Template=args=>({props:args,template:'\n        <cds-combo-box\n            [(ngModel)]="model"\n            [disabled]="disabled"\n            [readonly]="readonly"\n            [invalid]="invalid"\n            [size]="size"\n            [appendInline]="appendInline"\n            [invalidText]="invalidText"\n            [warn]="warn"\n            [warnText]="warnText"\n            [label]="label"\n            [hideLabel]="hideLabel"\n            [helperText]="helperText"\n            [items]="items"\n            [theme]="theme"\n            [dropUp]="dropUp"\n            [fluid]="fluid"\n            [itemValueKey]="itemValueKey"\n            (selected)="selected($event)"\n            (submit)="submit($event)"\n            (search)="search($event)"\n            (clear)="clear($event)">\n            <cds-dropdown-list></cds-dropdown-list>\n        </cds-combo-box>\n        <span>{{model | json}}</span>\n    '}),Basic=Template.bind({});Basic.argTypes={items:{controls:!1}};const BasicMax=(args=>({props:args,template:"\n        \x3c!--\n        app-* components are for demo purposes only.\n        You can create your own implementation by using the component source found at:\n        https://github.com/IBM/carbon-components-angular/tree/master/src/combobox/stories/app-dynamic-list-combobox.component.ts\n        --\x3e\n        <app-dynamic-list-combobox></app-dynamic-list-combobox>\n    "})).bind({});BasicMax.storyName="Basic with max length",BasicMax.args={maxLength:4},BasicMax.argTypes={maxLength:{control:"number"}};const Dynamic=(args=>({props:args,template:"\n        \x3c!--\n        app-* components are for demo purposes only.\n        You can create your own implementation by using the component source found at:\n        https://github.com/IBM/carbon-components-angular/tree/master/src/combobox/stories/app-dynamic-list-combobox.component.ts\n        --\x3e\n        <app-dynamic-list-combobox></app-dynamic-list-combobox>\n    "})).bind({});Dynamic.storyName="Dynamically added list items",Dynamic.parameters={controls:{disable:!0}};const Fluid=Template.bind({});Fluid.args={fluid:!0};const Multiselect=(args=>({props:args,template:'\n        <cds-combo-box\n            [invalid]="invalid"\n            [invalidText]="invalidText"\n            [label]="label"\n            [hideLabel]="hideLabel"\n            [warn]="warn"\n            [disabled]="disabled"\n            [readonly]="readonly"\n            [size]="size"\n            [helperText]="helperText"\n            [appendInline]="false"\n            [items]="items"\n            [theme]="theme"\n            [selectionFeedback]="selectionFeedback"\n            [dropUp]="dropUp"\n            [appendInline]="appendInline"\n            [fluid]="fluid"\n            [itemValueKey]="itemValueKey"\n            type="multi"\n            (selected)="selected($event)"\n            (submit)="submit($event)"\n            (clear)="clear($event)">\n            <cds-dropdown-list></cds-dropdown-list>\n        </cds-combo-box>\n    '})).bind({});Multiselect.argTypes={selectionFeedback:"top-after-reopen"};const ReactiveForms=(args=>({props:args,template:'\n        \x3c!--\n        app-* components are for demo purposes only.\n        You can create your own implementation by using the component source found at:\n        https://github.com/IBM/carbon-components-angular/tree/master/src/combobox/stories/app-reactive-combobox.component.ts\n        --\x3e\n        <app-reactive-combobox\n            [disabled]="disabled"\n            [invalid]="invalid"\n            [size]="size"\n            [invalidText]="invalidText"\n            [warn]="warn"\n            [warnText]="warnText"\n            [label]="label"\n            [helperText]="helperText"\n            [items]="items"\n            [theme]="theme"\n            [itemValueKey]="itemValueKey">\n        </app-reactive-combobox>\n    '})).bind({}),MockQuerySearch=(args=>({props:args,template:"\n        \x3c!--\n        app-* components are for demo purposes only.\n        You can create your own implementation by using the component source found at:\n        https://github.com/IBM/carbon-components-angular/tree/master/src/combobox/stories/app-mock-query-search.component.ts\n        --\x3e\n        <app-mock-query-search></app-mock-query-search>\n    "})).bind({});MockQuerySearch.parameters={controls:{disable:!0}};const withAILabelTemplate=args=>({props:args,styles:ai_label_story_shared.J6,template:'\n        <div style="width: 400px">\n            <cds-combo-box\n                [(ngModel)]="model"\n                [invalid]="invalid"\n                [invalidText]="invalidText"\n                [warn]="warn"\n                [warnText]="warnText"\n                [label]="label"\n                [hideLabel]="hideLabel"\n                [helperText]="helperText"\n                [items]="items"\n                [theme]="theme"\n                [dropUp]="dropUp"\n                [fluid]="fluid"\n                [decorator]="decoratorTpl"\n                [itemValueKey]="itemValueKey"\n                (selected)="selected($event)"\n                (submit)="submit($event)"\n                (search)="search($event)"\n                (clear)="clear($event)">\n                <cds-dropdown-list></cds-dropdown-list>\n            </cds-combo-box>\n        </div>\n        <ng-template #decoratorTpl>\n            <cds-ai-label\n                class="ai-label-container"\n                kind="default"\n                size="mini"\n                [autoAlign]="true"\n                aiText="AI"\n                ariaLabel="Show information">\n                '+ai_label_story_shared.Ag+"\n            </cds-ai-label>\n        </ng-template>\n    "}),withAILabel=withAILabelTemplate.bind({}),filterableWithAILabel=withAILabelTemplate.bind({});filterableWithAILabel.storyName="Filterable with AI label",Basic.parameters={...Basic.parameters,docs:{...Basic.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        <cds-combo-box\n            [(ngModel)]="model"\n            [disabled]="disabled"\n            [readonly]="readonly"\n            [invalid]="invalid"\n            [size]="size"\n            [appendInline]="appendInline"\n            [invalidText]="invalidText"\n            [warn]="warn"\n            [warnText]="warnText"\n            [label]="label"\n            [hideLabel]="hideLabel"\n            [helperText]="helperText"\n            [items]="items"\n            [theme]="theme"\n            [dropUp]="dropUp"\n            [fluid]="fluid"\n            [itemValueKey]="itemValueKey"\n            (selected)="selected($event)"\n            (submit)="submit($event)"\n            (search)="search($event)"\n            (clear)="clear($event)">\n            <cds-dropdown-list></cds-dropdown-list>\n        </cds-combo-box>\n        <span>{{model | json}}</span>\n    `\n})',...Basic.parameters?.docs?.source}}},BasicMax.parameters={...BasicMax.parameters,docs:{...BasicMax.parameters?.docs,source:{originalSource:"args => ({\n  props: args,\n  template: `\n        \x3c!--\n        app-* components are for demo purposes only.\n        You can create your own implementation by using the component source found at:\n        https://github.com/IBM/carbon-components-angular/tree/master/src/combobox/stories/app-dynamic-list-combobox.component.ts\n        --\x3e\n        <app-dynamic-list-combobox></app-dynamic-list-combobox>\n    `\n})",...BasicMax.parameters?.docs?.source}}},Dynamic.parameters={...Dynamic.parameters,docs:{...Dynamic.parameters?.docs,source:{originalSource:"args => ({\n  props: args,\n  template: `\n        \x3c!--\n        app-* components are for demo purposes only.\n        You can create your own implementation by using the component source found at:\n        https://github.com/IBM/carbon-components-angular/tree/master/src/combobox/stories/app-dynamic-list-combobox.component.ts\n        --\x3e\n        <app-dynamic-list-combobox></app-dynamic-list-combobox>\n    `\n})",...Dynamic.parameters?.docs?.source}}},Fluid.parameters={...Fluid.parameters,docs:{...Fluid.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        <cds-combo-box\n            [(ngModel)]="model"\n            [disabled]="disabled"\n            [readonly]="readonly"\n            [invalid]="invalid"\n            [size]="size"\n            [appendInline]="appendInline"\n            [invalidText]="invalidText"\n            [warn]="warn"\n            [warnText]="warnText"\n            [label]="label"\n            [hideLabel]="hideLabel"\n            [helperText]="helperText"\n            [items]="items"\n            [theme]="theme"\n            [dropUp]="dropUp"\n            [fluid]="fluid"\n            [itemValueKey]="itemValueKey"\n            (selected)="selected($event)"\n            (submit)="submit($event)"\n            (search)="search($event)"\n            (clear)="clear($event)">\n            <cds-dropdown-list></cds-dropdown-list>\n        </cds-combo-box>\n        <span>{{model | json}}</span>\n    `\n})',...Fluid.parameters?.docs?.source}}},Multiselect.parameters={...Multiselect.parameters,docs:{...Multiselect.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        <cds-combo-box\n            [invalid]="invalid"\n            [invalidText]="invalidText"\n            [label]="label"\n            [hideLabel]="hideLabel"\n            [warn]="warn"\n            [disabled]="disabled"\n            [readonly]="readonly"\n            [size]="size"\n            [helperText]="helperText"\n            [appendInline]="false"\n            [items]="items"\n            [theme]="theme"\n            [selectionFeedback]="selectionFeedback"\n            [dropUp]="dropUp"\n            [appendInline]="appendInline"\n            [fluid]="fluid"\n            [itemValueKey]="itemValueKey"\n            type="multi"\n            (selected)="selected($event)"\n            (submit)="submit($event)"\n            (clear)="clear($event)">\n            <cds-dropdown-list></cds-dropdown-list>\n        </cds-combo-box>\n    `\n})',...Multiselect.parameters?.docs?.source}}},ReactiveForms.parameters={...ReactiveForms.parameters,docs:{...ReactiveForms.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        \x3c!--\n        app-* components are for demo purposes only.\n        You can create your own implementation by using the component source found at:\n        https://github.com/IBM/carbon-components-angular/tree/master/src/combobox/stories/app-reactive-combobox.component.ts\n        --\x3e\n        <app-reactive-combobox\n            [disabled]="disabled"\n            [invalid]="invalid"\n            [size]="size"\n            [invalidText]="invalidText"\n            [warn]="warn"\n            [warnText]="warnText"\n            [label]="label"\n            [helperText]="helperText"\n            [items]="items"\n            [theme]="theme"\n            [itemValueKey]="itemValueKey">\n        </app-reactive-combobox>\n    `\n})',...ReactiveForms.parameters?.docs?.source}}},MockQuerySearch.parameters={...MockQuerySearch.parameters,docs:{...MockQuerySearch.parameters?.docs,source:{originalSource:"args => ({\n  props: args,\n  template: `\n        \x3c!--\n        app-* components are for demo purposes only.\n        You can create your own implementation by using the component source found at:\n        https://github.com/IBM/carbon-components-angular/tree/master/src/combobox/stories/app-mock-query-search.component.ts\n        --\x3e\n        <app-mock-query-search></app-mock-query-search>\n    `\n})",...MockQuerySearch.parameters?.docs?.source}}},withAILabel.parameters={...withAILabel.parameters,docs:{...withAILabel.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  styles: AI_LABEL_STORY_STYLES,\n  template: `\n        <div style="width: 400px">\n            <cds-combo-box\n                [(ngModel)]="model"\n                [invalid]="invalid"\n                [invalidText]="invalidText"\n                [warn]="warn"\n                [warnText]="warnText"\n                [label]="label"\n                [hideLabel]="hideLabel"\n                [helperText]="helperText"\n                [items]="items"\n                [theme]="theme"\n                [dropUp]="dropUp"\n                [fluid]="fluid"\n                [decorator]="decoratorTpl"\n                [itemValueKey]="itemValueKey"\n                (selected)="selected($event)"\n                (submit)="submit($event)"\n                (search)="search($event)"\n                (clear)="clear($event)">\n                <cds-dropdown-list></cds-dropdown-list>\n            </cds-combo-box>\n        </div>\n        <ng-template #decoratorTpl>\n            <cds-ai-label\n                class="ai-label-container"\n                kind="default"\n                size="mini"\n                [autoAlign]="true"\n                aiText="AI"\n                ariaLabel="Show information">\n                ` + AI_LABEL_INNER + `\n            </cds-ai-label>\n        </ng-template>\n    `\n})',...withAILabel.parameters?.docs?.source}}},filterableWithAILabel.parameters={...filterableWithAILabel.parameters,docs:{...filterableWithAILabel.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  styles: AI_LABEL_STORY_STYLES,\n  template: `\n        <div style="width: 400px">\n            <cds-combo-box\n                [(ngModel)]="model"\n                [invalid]="invalid"\n                [invalidText]="invalidText"\n                [warn]="warn"\n                [warnText]="warnText"\n                [label]="label"\n                [hideLabel]="hideLabel"\n                [helperText]="helperText"\n                [items]="items"\n                [theme]="theme"\n                [dropUp]="dropUp"\n                [fluid]="fluid"\n                [decorator]="decoratorTpl"\n                [itemValueKey]="itemValueKey"\n                (selected)="selected($event)"\n                (submit)="submit($event)"\n                (search)="search($event)"\n                (clear)="clear($event)">\n                <cds-dropdown-list></cds-dropdown-list>\n            </cds-combo-box>\n        </div>\n        <ng-template #decoratorTpl>\n            <cds-ai-label\n                class="ai-label-container"\n                kind="default"\n                size="mini"\n                [autoAlign]="true"\n                aiText="AI"\n                ariaLabel="Show information">\n                ` + AI_LABEL_INNER + `\n            </cds-ai-label>\n        </ng-template>\n    `\n})',...filterableWithAILabel.parameters?.docs?.source}}};const __namedExportsOrder=["Basic","BasicMax","Dynamic","Fluid","Multiselect","ReactiveForms","MockQuerySearch","withAILabel","filterableWithAILabel"]}}]);