carbon-components-angular/docs/storybook/structured-list-structured-list-stories.5eb20ce3.iframe.bundle.js

Next generation components

"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[7291],{"./src/icon/icon.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{a:()=>IconDirective});var tslib__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_icon_service__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/icon/icon.service.ts"),_carbon_icon_helpers__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@carbon/icon-helpers/es/index.js");let IconDirective=class IconDirective{constructor(elementRef,iconService){this.elementRef=elementRef,this.iconService=iconService,this.cdsIcon="",this.size="16",this.title="",this.ariaLabel="",this.ariaLabelledBy="",this.ariaHidden="",this.isFocusable=!1}set ibmIcon(iconName){this.cdsIcon=iconName}renderIcon(iconName){const root=this.elementRef.nativeElement;let icon;try{icon=this.iconService.get(iconName,this.size.toString())}catch(error){return void console.warn(error)}const domParser=new DOMParser,rawSVG=icon.svg,svgElement=domParser.parseFromString(rawSVG,"image/svg+xml").documentElement;let node="SVG"!==root.tagName.toUpperCase()?svgElement:svgElement.firstChild;for(root.innerHTML="";node;)root.appendChild(root.ownerDocument.importNode(node,!0)),node=node.nextSibling;const svg="SVG"!==root.tagName.toUpperCase()?svgElement:root,xmlns="http://www.w3.org/2000/svg";svg.setAttribute("xmlns",xmlns);const attributes=(0,_carbon_icon_helpers__WEBPACK_IMPORTED_MODULE_1__.u9)({width:icon.attrs.width,height:icon.attrs.height,viewBox:icon.attrs.viewBox,title:this.title,"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledBy,"aria-hidden":this.ariaHidden,focusable:this.isFocusable.toString(),fill:icon.attrs.fill}),attrKeys=Object.keys(attributes);for(let i=0;i<attrKeys.length;i++){const key=attrKeys[i],value=attributes[key];"title"!==key&&(value&&svg.setAttribute(key,value))}if(attributes.title){const title=document.createElementNS(xmlns,"title");title.textContent=attributes.title,IconDirective.titleIdCounter++,title.setAttribute("id",`${icon.name}-title-${IconDirective.titleIdCounter}`),svg.insertBefore(title,svg.firstElementChild),svg.setAttribute("aria-labelledby",`${icon.name}-title-${IconDirective.titleIdCounter}`)}}ngAfterViewInit(){this.renderIcon(this.cdsIcon)}ngOnChanges({cdsIcon}){cdsIcon&&!cdsIcon.isFirstChange()&&this.renderIcon(this.cdsIcon)}};IconDirective.titleIdCounter=0,IconDirective.ctorParameters=()=>[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.ElementRef},{type:_icon_service__WEBPACK_IMPORTED_MODULE_0__.C6}],IconDirective.propDecorators={ibmIcon:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],cdsIcon:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],size:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],title:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],ariaLabel:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],ariaLabelledBy:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],ariaHidden:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],isFocusable:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}]},IconDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_3__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Directive)({selector:"[cdsIcon], [ibmIcon]"})],IconDirective)},"./src/icon/icon.module.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{QX:()=>IconModule});var tslib__WEBPACK_IMPORTED_MODULE_58__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_57__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_angular_common__WEBPACK_IMPORTED_MODULE_59__=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),_icon_directive__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/icon/icon.directive.ts"),_icon_service__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/icon/icon.service.ts"),_carbon_icons_es_add_16__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@carbon/icons/es/add/16.js"),_carbon_icons_es_add_20__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@carbon/icons/es/add/20.js"),_carbon_icons_es_bee_16__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@carbon/icons/es/bee/16.js"),_carbon_icons_es_bee_20__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@carbon/icons/es/bee/20.js"),_carbon_icons_es_calendar_16__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@carbon/icons/es/calendar/16.js"),_carbon_icons_es_carbon_16__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@carbon/icons/es/carbon/16.js"),_carbon_icons_es_carbon_20__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./node_modules/@carbon/icons/es/carbon/20.js"),_carbon_icons_es_caret_down_16__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__("./node_modules/@carbon/icons/es/caret--down/16.js"),_carbon_icons_es_caret_left_16__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/@carbon/icons/es/caret--left/16.js"),_carbon_icons_es_caret_right_16__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/@carbon/icons/es/caret--right/16.js"),_carbon_icons_es_caret_up_16__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/@carbon/icons/es/caret--up/16.js"),_carbon_icons_es_checkmark_16__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark/16.js"),_carbon_icons_es_checkmark_filled_16__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--filled/16.js"),_carbon_icons_es_checkmark_filled_20__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--filled/20.js"),_carbon_icons_es_checkmark_outline_16__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--outline/16.js"),_carbon_icons_es_checkbox_16__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./node_modules/@carbon/icons/es/checkbox/16.js"),_carbon_icons_es_checkbox_checked_filled_16__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./node_modules/@carbon/icons/es/checkbox--checked--filled/16.js"),_carbon_icons_es_chevron_down_16__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./node_modules/@carbon/icons/es/chevron--down/16.js"),_carbon_icons_es_chevron_right_16__WEBPACK_IMPORTED_MODULE_20__=__webpack_require__("./node_modules/@carbon/icons/es/chevron--right/16.js"),_carbon_icons_es_circle_dash_16__WEBPACK_IMPORTED_MODULE_21__=__webpack_require__("./node_modules/@carbon/icons/es/circle-dash/16.js"),_carbon_icons_es_close_16__WEBPACK_IMPORTED_MODULE_22__=__webpack_require__("./node_modules/@carbon/icons/es/close/16.js"),_carbon_icons_es_close_20__WEBPACK_IMPORTED_MODULE_23__=__webpack_require__("./node_modules/@carbon/icons/es/close/20.js"),_carbon_icons_es_copy_16__WEBPACK_IMPORTED_MODULE_24__=__webpack_require__("./node_modules/@carbon/icons/es/copy/16.js"),_carbon_icons_es_copy_20__WEBPACK_IMPORTED_MODULE_25__=__webpack_require__("./node_modules/@carbon/icons/es/copy/20.js"),_carbon_icons_es_data_2_16__WEBPACK_IMPORTED_MODULE_26__=__webpack_require__("./node_modules/@carbon/icons/es/data--2/16.js"),_carbon_icons_es_data_2_20__WEBPACK_IMPORTED_MODULE_27__=__webpack_require__("./node_modules/@carbon/icons/es/data--2/20.js"),_carbon_icons_es_document_16__WEBPACK_IMPORTED_MODULE_28__=__webpack_require__("./node_modules/@carbon/icons/es/document/16.js"),_carbon_icons_es_document_20__WEBPACK_IMPORTED_MODULE_29__=__webpack_require__("./node_modules/@carbon/icons/es/document/20.js"),_carbon_icons_es_download_16__WEBPACK_IMPORTED_MODULE_30__=__webpack_require__("./node_modules/@carbon/icons/es/download/16.js"),_carbon_icons_es_error_filled_16__WEBPACK_IMPORTED_MODULE_31__=__webpack_require__("./node_modules/@carbon/icons/es/error--filled/16.js"),_carbon_icons_es_error_filled_20__WEBPACK_IMPORTED_MODULE_32__=__webpack_require__("./node_modules/@carbon/icons/es/error--filled/20.js"),_carbon_icons_es_fade_16__WEBPACK_IMPORTED_MODULE_33__=__webpack_require__("./node_modules/@carbon/icons/es/fade/16.js"),_carbon_icons_es_fade_20__WEBPACK_IMPORTED_MODULE_34__=__webpack_require__("./node_modules/@carbon/icons/es/fade/20.js"),_carbon_icons_es_folder_16__WEBPACK_IMPORTED_MODULE_35__=__webpack_require__("./node_modules/@carbon/icons/es/folder/16.js"),_carbon_icons_es_incomplete_16__WEBPACK_IMPORTED_MODULE_36__=__webpack_require__("./node_modules/@carbon/icons/es/incomplete/16.js"),_carbon_icons_es_information_filled_16__WEBPACK_IMPORTED_MODULE_37__=__webpack_require__("./node_modules/@carbon/icons/es/information--filled/16.js"),_carbon_icons_es_information_filled_20__WEBPACK_IMPORTED_MODULE_38__=__webpack_require__("./node_modules/@carbon/icons/es/information--filled/20.js"),_carbon_icons_es_information_square_filled_20__WEBPACK_IMPORTED_MODULE_39__=__webpack_require__("./node_modules/@carbon/icons/es/information--square--filled/20.js"),_carbon_icons_es_menu_16__WEBPACK_IMPORTED_MODULE_40__=__webpack_require__("./node_modules/@carbon/icons/es/menu/16.js"),_carbon_icons_es_menu_20__WEBPACK_IMPORTED_MODULE_41__=__webpack_require__("./node_modules/@carbon/icons/es/menu/20.js"),_carbon_icons_es_overflow_menu_vertical_16__WEBPACK_IMPORTED_MODULE_42__=__webpack_require__("./node_modules/@carbon/icons/es/overflow-menu--vertical/16.js"),_carbon_icons_es_overflow_menu_horizontal_16__WEBPACK_IMPORTED_MODULE_43__=__webpack_require__("./node_modules/@carbon/icons/es/overflow-menu--horizontal/16.js"),_carbon_icons_es_save_16__WEBPACK_IMPORTED_MODULE_44__=__webpack_require__("./node_modules/@carbon/icons/es/save/16.js"),_carbon_icons_es_search_16__WEBPACK_IMPORTED_MODULE_45__=__webpack_require__("./node_modules/@carbon/icons/es/search/16.js"),_carbon_icons_es_settings_16__WEBPACK_IMPORTED_MODULE_46__=__webpack_require__("./node_modules/@carbon/icons/es/settings/16.js"),_carbon_icons_es_settings_adjust_16__WEBPACK_IMPORTED_MODULE_47__=__webpack_require__("./node_modules/@carbon/icons/es/settings--adjust/16.js"),_carbon_icons_es_subtract_16__WEBPACK_IMPORTED_MODULE_48__=__webpack_require__("./node_modules/@carbon/icons/es/subtract/16.js"),_carbon_icons_es_trash_can_16__WEBPACK_IMPORTED_MODULE_49__=__webpack_require__("./node_modules/@carbon/icons/es/trash-can/16.js"),_carbon_icons_es_warning_16__WEBPACK_IMPORTED_MODULE_50__=__webpack_require__("./node_modules/@carbon/icons/es/warning/16.js"),_carbon_icons_es_warning_filled_16__WEBPACK_IMPORTED_MODULE_51__=__webpack_require__("./node_modules/@carbon/icons/es/warning--filled/16.js"),_carbon_icons_es_warning_filled_20__WEBPACK_IMPORTED_MODULE_52__=__webpack_require__("./node_modules/@carbon/icons/es/warning--filled/20.js"),_carbon_icons_es_warning_alt_filled_16__WEBPACK_IMPORTED_MODULE_53__=__webpack_require__("./node_modules/@carbon/icons/es/warning--alt--filled/16.js"),_carbon_icons_es_warning_alt_filled_20__WEBPACK_IMPORTED_MODULE_54__=__webpack_require__("./node_modules/@carbon/icons/es/warning--alt--filled/20.js"),_carbon_icons_es_view_16__WEBPACK_IMPORTED_MODULE_55__=__webpack_require__("./node_modules/@carbon/icons/es/view/16.js"),_carbon_icons_es_view_off_16__WEBPACK_IMPORTED_MODULE_56__=__webpack_require__("./node_modules/@carbon/icons/es/view--off/16.js");const ICON_SERVICE_PROVIDER={provide:_icon_service__WEBPACK_IMPORTED_MODULE_1__.C6,deps:[[new _angular_core__WEBPACK_IMPORTED_MODULE_57__.Optional,new _angular_core__WEBPACK_IMPORTED_MODULE_57__.SkipSelf,_icon_service__WEBPACK_IMPORTED_MODULE_1__.C6]],useFactory:function ICON_SERVICE_PROVIDER_FACTORY(parentService){return parentService||new _icon_service__WEBPACK_IMPORTED_MODULE_1__.C6}};let IconModule=class IconModule{constructor(iconService){this.iconService=iconService,iconService.registerAll([_carbon_icons_es_add_16__WEBPACK_IMPORTED_MODULE_2__.Z,_carbon_icons_es_add_20__WEBPACK_IMPORTED_MODULE_3__.Z,_carbon_icons_es_bee_16__WEBPACK_IMPORTED_MODULE_4__.Z,_carbon_icons_es_bee_20__WEBPACK_IMPORTED_MODULE_5__.Z,_carbon_icons_es_calendar_16__WEBPACK_IMPORTED_MODULE_6__.Z,_carbon_icons_es_carbon_16__WEBPACK_IMPORTED_MODULE_7__.Z,_carbon_icons_es_carbon_20__WEBPACK_IMPORTED_MODULE_8__.Z,_carbon_icons_es_caret_down_16__WEBPACK_IMPORTED_MODULE_9__.Z,_carbon_icons_es_caret_left_16__WEBPACK_IMPORTED_MODULE_10__.Z,_carbon_icons_es_caret_right_16__WEBPACK_IMPORTED_MODULE_11__.Z,_carbon_icons_es_caret_up_16__WEBPACK_IMPORTED_MODULE_12__.Z,_carbon_icons_es_checkmark_16__WEBPACK_IMPORTED_MODULE_13__.Z,_carbon_icons_es_checkmark_filled_16__WEBPACK_IMPORTED_MODULE_14__.Z,_carbon_icons_es_checkmark_filled_20__WEBPACK_IMPORTED_MODULE_15__.Z,_carbon_icons_es_checkmark_outline_16__WEBPACK_IMPORTED_MODULE_16__.Z,_carbon_icons_es_checkbox_16__WEBPACK_IMPORTED_MODULE_17__.Z,_carbon_icons_es_checkbox_checked_filled_16__WEBPACK_IMPORTED_MODULE_18__.Z,_carbon_icons_es_chevron_down_16__WEBPACK_IMPORTED_MODULE_19__.Z,_carbon_icons_es_chevron_right_16__WEBPACK_IMPORTED_MODULE_20__.Z,_carbon_icons_es_circle_dash_16__WEBPACK_IMPORTED_MODULE_21__.Z,_carbon_icons_es_close_16__WEBPACK_IMPORTED_MODULE_22__.Z,_carbon_icons_es_close_20__WEBPACK_IMPORTED_MODULE_23__.Z,_carbon_icons_es_copy_16__WEBPACK_IMPORTED_MODULE_24__.Z,_carbon_icons_es_copy_20__WEBPACK_IMPORTED_MODULE_25__.Z,_carbon_icons_es_data_2_16__WEBPACK_IMPORTED_MODULE_26__.Z,_carbon_icons_es_data_2_20__WEBPACK_IMPORTED_MODULE_27__.Z,_carbon_icons_es_document_16__WEBPACK_IMPORTED_MODULE_28__.Z,_carbon_icons_es_document_20__WEBPACK_IMPORTED_MODULE_29__.Z,_carbon_icons_es_download_16__WEBPACK_IMPORTED_MODULE_30__.Z,_carbon_icons_es_error_filled_16__WEBPACK_IMPORTED_MODULE_31__.Z,_carbon_icons_es_error_filled_20__WEBPACK_IMPORTED_MODULE_32__.Z,_carbon_icons_es_fade_16__WEBPACK_IMPORTED_MODULE_33__.Z,_carbon_icons_es_fade_20__WEBPACK_IMPORTED_MODULE_34__.Z,_carbon_icons_es_folder_16__WEBPACK_IMPORTED_MODULE_35__.Z,_carbon_icons_es_incomplete_16__WEBPACK_IMPORTED_MODULE_36__.Z,_carbon_icons_es_information_filled_16__WEBPACK_IMPORTED_MODULE_37__.Z,_carbon_icons_es_information_filled_20__WEBPACK_IMPORTED_MODULE_38__.Z,_carbon_icons_es_information_square_filled_20__WEBPACK_IMPORTED_MODULE_39__.Z,_carbon_icons_es_menu_16__WEBPACK_IMPORTED_MODULE_40__.Z,_carbon_icons_es_menu_20__WEBPACK_IMPORTED_MODULE_41__.Z,_carbon_icons_es_overflow_menu_vertical_16__WEBPACK_IMPORTED_MODULE_42__.Z,_carbon_icons_es_overflow_menu_horizontal_16__WEBPACK_IMPORTED_MODULE_43__.Z,_carbon_icons_es_save_16__WEBPACK_IMPORTED_MODULE_44__.Z,_carbon_icons_es_search_16__WEBPACK_IMPORTED_MODULE_45__.Z,_carbon_icons_es_settings_16__WEBPACK_IMPORTED_MODULE_46__.Z,_carbon_icons_es_settings_adjust_16__WEBPACK_IMPORTED_MODULE_47__.Z,_carbon_icons_es_subtract_16__WEBPACK_IMPORTED_MODULE_48__.Z,_carbon_icons_es_trash_can_16__WEBPACK_IMPORTED_MODULE_49__.Z,_carbon_icons_es_view_16__WEBPACK_IMPORTED_MODULE_55__.Z,_carbon_icons_es_view_off_16__WEBPACK_IMPORTED_MODULE_56__.Z,_carbon_icons_es_warning_16__WEBPACK_IMPORTED_MODULE_50__.Z,_carbon_icons_es_warning_filled_16__WEBPACK_IMPORTED_MODULE_51__.Z,_carbon_icons_es_warning_filled_20__WEBPACK_IMPORTED_MODULE_52__.Z,_carbon_icons_es_warning_alt_filled_16__WEBPACK_IMPORTED_MODULE_53__.Z,_carbon_icons_es_warning_alt_filled_20__WEBPACK_IMPORTED_MODULE_54__.Z])}};IconModule.ctorParameters=()=>[{type:_icon_service__WEBPACK_IMPORTED_MODULE_1__.C6}],IconModule=(0,tslib__WEBPACK_IMPORTED_MODULE_58__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_57__.NgModule)({declarations:[_icon_directive__WEBPACK_IMPORTED_MODULE_0__.a],exports:[_icon_directive__WEBPACK_IMPORTED_MODULE_0__.a],imports:[_angular_common__WEBPACK_IMPORTED_MODULE_59__.CommonModule],providers:[ICON_SERVICE_PROVIDER]})],IconModule)},"./src/icon/icon.service.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{C6:()=>IconService});var tslib__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_carbon_icon_helpers__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@carbon/icon-helpers/es/index.js");class IconNameNotFoundError extends Error{constructor(name){super(`Icon ${name} not found`)}}class IconSizeNotFoundError extends Error{constructor(size,name){super(`Size ${size} for ${name} not found`)}}class IconMemoryCache extends class IconCache{}{constructor(){super(...arguments),this.iconMap=new Map}get(name,size){if(!this.iconMap.has(name))throw new IconNameNotFoundError(name);const sizeMap=this.iconMap.get(name);if(!sizeMap.has(size))throw new IconSizeNotFoundError(size,name);return sizeMap.get(size)}set(name,size,descriptor){this.iconMap.has(name)||this.iconMap.set(name,new Map);this.iconMap.get(name).set(size,descriptor)}}let IconService=class IconService{constructor(){this.iconCache=new IconMemoryCache}registerAll(descriptors){descriptors.forEach((icon=>this.register(icon)))}register(descriptor){const{name}=descriptor;this.registerAs(name,descriptor)}registerAs(name,descriptor){let{size,attrs:{width}}=descriptor;this.iconCache.set(name,(size??width).toString(),descriptor)}get(name,size){try{const icon=this.iconCache.get(name,size.toString());return icon.svg||(icon.svg=(0,_carbon_icon_helpers__WEBPACK_IMPORTED_MODULE_0__.BB)(icon)),icon}catch(e){throw e}}configure(options){this.iconCache=options.cache}};IconService=(0,tslib__WEBPACK_IMPORTED_MODULE_1__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Injectable)()],IconService)},"./src/icon/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{ar:()=>icon_directive.a,QX:()=>icon_module.QX,C6:()=>icon_service.C6});var icon_directive=__webpack_require__("./src/icon/icon.directive.ts"),icon_module=__webpack_require__("./src/icon/icon.module.ts"),icon_service=__webpack_require__("./src/icon/icon.service.ts")},"./src/structured-list/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{hu:()=>ListColumn,Bu:()=>ListHeader,wc:()=>ListRow,zn:()=>StructuredList,ic:()=>StructuredListModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let ListColumn=class ListColumn{constructor(){this.skeleton=!1,this.role="cell",this.isHeaderColumn=!0,this.isBodyColumn=!0,this.nowrap=!1}};ListColumn.propDecorators={skeleton:[{type:core.Input}],role:[{type:core.HostBinding,args:["attr.role"]}],isHeaderColumn:[{type:core.HostBinding,args:["class.cds--structured-list-th"]}],isBodyColumn:[{type:core.HostBinding,args:["class.cds--structured-list-td"]}],nowrap:[{type:core.HostBinding,args:["class.cds--structured-list-content--nowrap"]},{type:core.Input}]},ListColumn=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-list-column, ibm-list-column",template:'\n\t\t<span *ngIf="skeleton"></span>\n\t\t<ng-content></ng-content>\n\t'})],ListColumn);let ListHeader=class ListHeader{constructor(){this.wrapper=!0,this.role="rowgroup",this.selection=!1,this._skeleton=!1}set skeleton(value){this._skeleton=value,this.updateChildren()}get skeleton(){return this._skeleton}ngAfterContentInit(){this.columns.forEach((column=>{column.isBodyColumn=!1,column.isHeaderColumn=!0})),this.updateChildren()}updateChildren(){this.columns&&this.columns.toArray().forEach((child=>child.skeleton=this.skeleton))}};ListHeader.propDecorators={wrapper:[{type:core.HostBinding,args:["class.cds--structured-list-thead"]}],role:[{type:core.HostBinding,args:["attr.role"]}],skeleton:[{type:core.Input}],columns:[{type:core.ContentChildren,args:[ListColumn]}]},ListHeader=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-list-header, ibm-list-header",template:'\n\t\t<div class="cds--structured-list-row cds--structured-list-row--header-row" role="row">\n\t\t\t<ng-content></ng-content>\n\t\t\t<div *ngIf="selection" class="cds--structured-list-th"></div>\n\t\t</div>\n\t'})],ListHeader);let ListRow=class ListRow{constructor(){this.selected=!1,this.change=new core.EventEmitter,this.selection=!1,this.name="list",this.wrapper=!0,this.role="row",this.isFocused=!1}get focusClass(){return this.isFocused}ngAfterContentInit(){this.columns.forEach((column=>{column.isBodyColumn=!0,column.isHeaderColumn=!1}))}onclick(){this.selection&&this.input.nativeElement.click()}onChange(event){this.change.emit(event)}handleFocus(isFocused){this.selection&&(this.isFocused=isFocused,this.isFocused&&this.input.nativeElement.click())}};ListRow.propDecorators={focusClass:[{type:core.HostBinding,args:["class.cds--structured-list-row--focused-within"]}],selected:[{type:core.Input},{type:core.HostBinding,args:["class.cds--structured-list-row--selected"]}],label:[{type:core.Input},{type:core.HostBinding,args:["attr.aria-label"]}],value:[{type:core.Input}],change:[{type:core.Output}],wrapper:[{type:core.HostBinding,args:["class.cds--structured-list-row"]}],role:[{type:core.HostBinding,args:["attr.role"]}],columns:[{type:core.ContentChildren,args:[ListColumn]}],input:[{type:core.ViewChild,args:["input"]}],onclick:[{type:core.HostListener,args:["click"]}]},ListRow=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-list-row, ibm-list-row",template:'\n\t\t<ng-content></ng-content>\n\t\t<ng-container *ngIf="selection">\n\t\t\t<input\n\t\t\t\t#input\n\t\t\t\tclass="cds--structured-list-input cds--visually-hidden"\n\t\t\t\ttype="radio"\n\t\t\t\t[value]="value"\n\t\t\t\t[name]="name"\n\t\t\t\t[title]="label"\n\t\t\t\t(focus)="handleFocus(true)"\n\t\t\t\t(blur)="handleFocus(false)"\n\t\t\t\t(change)="onChange($event)"\n\t\t\t\t[checked]="selected"/>\n\t\t\t<div class="cds--structured-list-td">\n\t\t\t\t<svg cdsIcon="checkmark--filled" size="16" class="cds--structured-list-svg"></svg>\n\t\t\t</div>\n\t\t</ng-container>\n\t'})],ListRow);var fesm2020_forms=__webpack_require__("./node_modules/@angular/forms/fesm2020/forms.mjs");let StructuredList=class StructuredList{constructor(){this.selection=!1,this.flushed=!1,this.condensed=!1,this.name="structured-list-"+StructuredList.listCount++,this.selected=new core.EventEmitter,this._skeleton=!1,this.onChange=_=>{},this.onTouched=()=>{}}set skeleton(value){this._skeleton=value,this.updateChildren()}get skeleton(){return this._skeleton}ngAfterContentInit(){const setSelection=rowOrHeader=>{rowOrHeader.selection=this.selection};this.headers.forEach(setSelection),this.rows.forEach((row=>{setSelection(row),row.name=this.name,row.change.subscribe((()=>{this.selected.emit({value:row.value,selected:row.selected,name:this.name}),this.onChange(row.value),this.writeValue(row.value)}))})),this.updateChildren()}writeValue(value){this.rows&&this.rows.forEach((row=>{row.value===value?row.selected=!0:row.selected=!1}))}registerOnChange(fn){this.onChange=fn}registerOnTouched(fn){this.onTouched=fn}updateChildren(){this.headers&&this.headers.toArray().forEach((child=>child.skeleton=this.skeleton))}};StructuredList.listCount=0,StructuredList.propDecorators={selection:[{type:core.Input}],flushed:[{type:core.Input}],condensed:[{type:core.Input}],name:[{type:core.Input}],skeleton:[{type:core.Input}],selected:[{type:core.Output}],rows:[{type:core.ContentChildren,args:[ListRow]}],headers:[{type:core.ContentChildren,args:[ListHeader]}]},StructuredList=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-structured-list, ibm-structured-list",template:'\n\t\t<div\n\t\t\tclass="cds--structured-list"\n\t\t\trole="table"\n\t\t\t[ngClass]="{\n\t\t\t\t\'cds--structured-list--flush\': flushed,\n\t\t\t\t\'cds--structured-list--selection\': selection,\n\t\t\t\t\'cds--structured-list--condensed\': condensed,\n\t\t\t\t\'cds--skeleton\': skeleton\n\t\t\t}">\n\t\t\t<ng-content select="cds-list-header,ibm-list-header"></ng-content>\n\t\t\t<div class="cds--structured-list-tbody" role="rowgroup">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</div>\n\t\t</div>\n\t',providers:[{provide:fesm2020_forms.JU,useExisting:StructuredList,multi:!0}]})],StructuredList);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),icon=__webpack_require__("./src/icon/index.ts");let StructuredListModule=class StructuredListModule{};StructuredListModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[StructuredList,ListRow,ListHeader,ListColumn],exports:[StructuredList,ListRow,ListHeader,ListColumn],imports:[common.CommonModule,icon.QX]})],StructuredListModule)},"./src/structured-list/structured-list.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Basic:()=>Basic,Selection:()=>Selection,Skeleton:()=>Skeleton,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var _angular_forms__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@angular/forms/fesm2020/forms.mjs"),_storybook_angular__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),___WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/structured-list/index.ts");const __WEBPACK_DEFAULT_EXPORT__={title:"Components/Structured List",decorators:[(0,_storybook_angular__WEBPACK_IMPORTED_MODULE_0__.moduleMetadata)({imports:[___WEBPACK_IMPORTED_MODULE_1__.ic,_angular_forms__WEBPACK_IMPORTED_MODULE_2__.u5]})],component:___WEBPACK_IMPORTED_MODULE_1__.zn,subcomponents:{ListHeader:___WEBPACK_IMPORTED_MODULE_1__.Bu,ListRow:___WEBPACK_IMPORTED_MODULE_1__.wc,ListColumn:___WEBPACK_IMPORTED_MODULE_1__.hu}},Basic=(args=>({props:args,template:'\n        <cds-structured-list [condensed]="condensed">\n            <cds-list-header>\n                <cds-list-column nowrap="true">Column 1</cds-list-column>\n                <cds-list-column nowrap="true">Column 2</cds-list-column>\n                <cds-list-column>Column 3</cds-list-column>\n            </cds-list-header>\n            <cds-list-row>\n                <cds-list-column>Row 1</cds-list-column>\n                <cds-list-column nowrap="true">Row One</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n            <cds-list-row>\n                <cds-list-column>Row 2</cds-list-column>\n                <cds-list-column nowrap="true">Row Two</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n        </cds-structured-list>\n    '})).bind({});Basic.args={condensed:!1};const Selection=(args=>({props:args,template:'\n        <cds-structured-list\n            [condensed]="condensed"\n            [selection]="true"\n            [(ngModel)]="valueSelected">\n            <cds-list-header>\n                <cds-list-column nowrap="true">Column 1</cds-list-column>\n                <cds-list-column nowrap="true">Column 2</cds-list-column>\n                <cds-list-column>Column 3</cds-list-column>\n            </cds-list-header>\n            <cds-list-row value="row1">\n                <cds-list-column>Row 1</cds-list-column>\n                <cds-list-column nowrap="true">Row One</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n            <cds-list-row value="row2">\n                <cds-list-column>Row 2</cds-list-column>\n                <cds-list-column nowrap="true">Row Two</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n            <cds-list-row value="row3">\n                <cds-list-column>Row 3</cds-list-column>\n                <cds-list-column nowrap="true">Row Three</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n            <cds-list-row value="row4">\n                <cds-list-column>Row 4</cds-list-column>\n                <cds-list-column nowrap="true">Row Four</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n        </cds-structured-list>\n        <p>{{valueSelected}}</p>\n    '})).bind({});Selection.args={...Basic.args};const Skeleton=(args=>({props:args,template:'\n        <cds-structured-list\n            skeleton="true"\n            [border]="border"\n            [condensed]="condensed"\n            [nowrap]="nowrap">\n            <cds-list-header>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n            </cds-list-header>\n            <cds-list-row>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n            </cds-list-row>\n            <cds-list-row>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n            </cds-list-row>\n        </cds-structured-list>\n    '})).bind({});Skeleton.args={...Basic.args},Basic.parameters={...Basic.parameters,docs:{...Basic.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        <cds-structured-list [condensed]="condensed">\n            <cds-list-header>\n                <cds-list-column nowrap="true">Column 1</cds-list-column>\n                <cds-list-column nowrap="true">Column 2</cds-list-column>\n                <cds-list-column>Column 3</cds-list-column>\n            </cds-list-header>\n            <cds-list-row>\n                <cds-list-column>Row 1</cds-list-column>\n                <cds-list-column nowrap="true">Row One</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n            <cds-list-row>\n                <cds-list-column>Row 2</cds-list-column>\n                <cds-list-column nowrap="true">Row Two</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n        </cds-structured-list>\n    `\n})',...Basic.parameters?.docs?.source}}},Selection.parameters={...Selection.parameters,docs:{...Selection.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        <cds-structured-list\n            [condensed]="condensed"\n            [selection]="true"\n            [(ngModel)]="valueSelected">\n            <cds-list-header>\n                <cds-list-column nowrap="true">Column 1</cds-list-column>\n                <cds-list-column nowrap="true">Column 2</cds-list-column>\n                <cds-list-column>Column 3</cds-list-column>\n            </cds-list-header>\n            <cds-list-row value="row1">\n                <cds-list-column>Row 1</cds-list-column>\n                <cds-list-column nowrap="true">Row One</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n            <cds-list-row value="row2">\n                <cds-list-column>Row 2</cds-list-column>\n                <cds-list-column nowrap="true">Row Two</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n            <cds-list-row value="row3">\n                <cds-list-column>Row 3</cds-list-column>\n                <cds-list-column nowrap="true">Row Three</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n            <cds-list-row value="row4">\n                <cds-list-column>Row 4</cds-list-column>\n                <cds-list-column nowrap="true">Row Four</cds-list-column>\n                <cds-list-column>\n                    Lorem ipsum dolor sit amet,\n                    consectetur adipiscing elit. Nunc dui magna,\n                    finibus id tortor sed, aliquet bibendum augue.\n                    Aenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n                    Pellentesque vulputate nisl a porttitor interdum.\n                </cds-list-column>\n            </cds-list-row>\n        </cds-structured-list>\n        <p>{{valueSelected}}</p>\n    `\n})',...Selection.parameters?.docs?.source}}},Skeleton.parameters={...Skeleton.parameters,docs:{...Skeleton.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        <cds-structured-list\n            skeleton="true"\n            [border]="border"\n            [condensed]="condensed"\n            [nowrap]="nowrap">\n            <cds-list-header>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n            </cds-list-header>\n            <cds-list-row>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n            </cds-list-row>\n            <cds-list-row>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n                <cds-list-column></cds-list-column>\n            </cds-list-row>\n        </cds-structured-list>\n    `\n})',...Skeleton.parameters?.docs?.source}}};const __namedExportsOrder=["Basic","Selection","Skeleton"]}}]);