carbon-components-angular 5.72.0 → 5.72.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/combobox/combobox.component.d.ts +3 -0
- package/docs/documentation/components/ComboBox.html +214 -67
- package/docs/documentation/components/Dropdown.html +322 -134
- package/docs/documentation/components/DropdownList.html +6 -2
- package/docs/documentation/components/RadioGroup.html +166 -77
- package/docs/documentation/components/TextInputLabelComponent.html +171 -65
- package/docs/documentation/components/TextareaLabelComponent.html +142 -74
- package/docs/documentation/coverage.html +22 -22
- package/docs/documentation/directives/TextArea.html +106 -11
- package/docs/documentation/directives/TextInput.html +118 -24
- package/docs/documentation/js/search/search_index.js +2 -2
- package/docs/documentation/modules/CheckboxModule/dependencies.svg +42 -42
- package/docs/documentation/modules/CheckboxModule.html +42 -42
- package/docs/documentation/modules/CodeSnippetModule/dependencies.svg +4 -4
- package/docs/documentation/modules/CodeSnippetModule.html +4 -4
- package/docs/documentation/modules/ComboBoxModule/dependencies.svg +6 -6
- package/docs/documentation/modules/ComboBoxModule.html +6 -6
- package/docs/documentation/modules/ContentSwitcherModule/dependencies.svg +4 -4
- package/docs/documentation/modules/ContentSwitcherModule.html +4 -4
- package/docs/documentation/modules/ContextMenuModule/dependencies.svg +67 -67
- package/docs/documentation/modules/ContextMenuModule.html +67 -67
- package/docs/documentation/modules/DatePickerInputModule/dependencies.svg +4 -4
- package/docs/documentation/modules/DatePickerInputModule.html +4 -4
- package/docs/documentation/modules/DatePickerModule/dependencies.svg +6 -6
- package/docs/documentation/modules/DatePickerModule.html +6 -6
- package/docs/documentation/modules/DialogModule/dependencies.svg +33 -33
- package/docs/documentation/modules/DialogModule.html +33 -33
- package/docs/documentation/modules/DocumentationModule/dependencies.svg +4 -4
- package/docs/documentation/modules/DocumentationModule.html +4 -4
- package/docs/documentation/modules/DropdownModule/dependencies.svg +53 -53
- package/docs/documentation/modules/DropdownModule.html +53 -53
- package/docs/documentation/modules/FileUploaderModule/dependencies.svg +35 -35
- package/docs/documentation/modules/FileUploaderModule.html +35 -35
- package/docs/documentation/modules/GridModule/dependencies.svg +61 -61
- package/docs/documentation/modules/GridModule.html +61 -61
- package/docs/documentation/modules/HeaderModule/dependencies.svg +4 -4
- package/docs/documentation/modules/HeaderModule.html +4 -4
- package/docs/documentation/modules/I18nModule/dependencies.svg +13 -13
- package/docs/documentation/modules/I18nModule.html +13 -13
- package/docs/documentation/modules/InlineLoadingModule/dependencies.svg +15 -15
- package/docs/documentation/modules/InlineLoadingModule.html +15 -15
- package/docs/documentation/modules/InputModule/dependencies.svg +4 -4
- package/docs/documentation/modules/InputModule.html +4 -4
- package/docs/documentation/modules/LayerModule/dependencies.svg +4 -4
- package/docs/documentation/modules/LayerModule.html +4 -4
- package/docs/documentation/modules/MenuButtonModule/dependencies.svg +4 -4
- package/docs/documentation/modules/MenuButtonModule.html +4 -4
- package/docs/documentation/modules/ModalModule/dependencies.svg +114 -114
- package/docs/documentation/modules/ModalModule.html +114 -114
- package/docs/documentation/modules/NFormsModule/dependencies.svg +4 -4
- package/docs/documentation/modules/NFormsModule.html +4 -4
- package/docs/documentation/modules/NotificationModule/dependencies.svg +4 -4
- package/docs/documentation/modules/NotificationModule.html +4 -4
- package/docs/documentation/modules/NumberModule/dependencies.svg +25 -25
- package/docs/documentation/modules/NumberModule.html +25 -25
- package/docs/documentation/modules/PaginationModule/dependencies.svg +4 -4
- package/docs/documentation/modules/PaginationModule.html +4 -4
- package/docs/documentation/modules/PanelModule/dependencies.svg +4 -4
- package/docs/documentation/modules/PanelModule.html +4 -4
- package/docs/documentation/modules/PlaceholderModule/dependencies.svg +4 -4
- package/docs/documentation/modules/PlaceholderModule.html +4 -4
- package/docs/documentation/modules/RadioModule/dependencies.svg +4 -4
- package/docs/documentation/modules/RadioModule.html +4 -4
- package/docs/documentation/modules/SearchModule/dependencies.svg +48 -44
- package/docs/documentation/modules/SearchModule.html +48 -44
- package/docs/documentation/modules/SelectModule/dependencies.svg +4 -4
- package/docs/documentation/modules/SelectModule.html +4 -4
- package/docs/documentation/modules/SideNavModule/dependencies.svg +4 -4
- package/docs/documentation/modules/SideNavModule.html +4 -4
- package/docs/documentation/modules/SkeletonModule/dependencies.svg +4 -4
- package/docs/documentation/modules/SkeletonModule.html +4 -4
- package/docs/documentation/modules/SliderModule/dependencies.svg +26 -26
- package/docs/documentation/modules/SliderModule.html +26 -26
- package/docs/documentation/modules/StructuredListModule/dependencies.svg +43 -43
- package/docs/documentation/modules/StructuredListModule.html +43 -43
- package/docs/documentation/modules/TableModule/dependencies.svg +225 -225
- package/docs/documentation/modules/TableModule.html +225 -225
- package/docs/documentation/modules/TabsModule/dependencies.svg +136 -136
- package/docs/documentation/modules/TabsModule.html +136 -136
- package/docs/documentation/modules/TagModule/dependencies.svg +38 -38
- package/docs/documentation/modules/TagModule.html +38 -38
- package/docs/documentation/modules/ThemeModule/dependencies.svg +4 -4
- package/docs/documentation/modules/ThemeModule.html +4 -4
- package/docs/documentation/modules/TilesModule/dependencies.svg +108 -108
- package/docs/documentation/modules/TilesModule.html +108 -108
- package/docs/documentation/modules/TimePickerModule/dependencies.svg +41 -45
- package/docs/documentation/modules/TimePickerModule.html +41 -45
- package/docs/documentation/modules/TimePickerSelectModule/dependencies.svg +46 -42
- package/docs/documentation/modules/TimePickerSelectModule.html +46 -42
- package/docs/documentation/modules/ToggleModule/dependencies.svg +7 -7
- package/docs/documentation/modules/ToggleModule.html +7 -7
- package/docs/documentation/modules/TooltipModule/dependencies.svg +28 -28
- package/docs/documentation/modules/TooltipModule.html +28 -28
- package/docs/documentation/modules/TreeviewModule/dependencies.svg +28 -28
- package/docs/documentation/modules/TreeviewModule.html +28 -28
- package/docs/documentation.json +510 -362
- package/docs/storybook/1345.da6e3dec.iframe.bundle.js +1 -0
- package/docs/storybook/3224.14e2c79a.iframe.bundle.js +1 -0
- package/docs/storybook/557.d4341469.iframe.bundle.js +1 -0
- package/docs/storybook/7019.75ad5817.iframe.bundle.js +2 -0
- package/docs/storybook/955.7522f55b.iframe.bundle.js +1 -0
- package/docs/storybook/combobox-combobox-stories.e3d08f7d.iframe.bundle.js +1 -0
- package/docs/storybook/dropdown-dropdown-stories.cf59b2ab.iframe.bundle.js +1 -0
- package/docs/storybook/iframe.html +2 -2
- package/docs/storybook/{input-input-stories.85a9e65e.iframe.bundle.js → input-input-stories.8bf34960.iframe.bundle.js} +1 -1
- package/docs/storybook/{input-textarea-stories.77240fb3.iframe.bundle.js → input-textarea-stories.ad775432.iframe.bundle.js} +1 -1
- package/docs/storybook/main.a1247bb8.iframe.bundle.js +1 -0
- package/docs/storybook/modal-modal-stories.cc2d04cb.iframe.bundle.js +1 -0
- package/docs/storybook/{pagination-pagination-nav-stories.547eede3.iframe.bundle.js → pagination-pagination-nav-stories.01637d11.iframe.bundle.js} +1 -1
- package/docs/storybook/{pagination-pagination-stories.fa7c9094.iframe.bundle.js → pagination-pagination-stories.40d17ebd.iframe.bundle.js} +1 -1
- package/docs/storybook/{patterns-filtering-single-selection-stories.ec91f833.iframe.bundle.js → patterns-filtering-multi-selection-stories.a46a1d6e.iframe.bundle.js} +1 -1
- package/docs/storybook/{patterns-filtering-multiple-categories-stories.531f27d7.iframe.bundle.js → patterns-filtering-multiple-categories-stories.740c719e.iframe.bundle.js} +1 -1
- package/docs/storybook/{patterns-filtering-multi-selection-stories.9086f77f.iframe.bundle.js → patterns-filtering-single-selection-stories.cc647b4a.iframe.bundle.js} +1 -1
- package/docs/storybook/{patterns-forms-multi-step-form-stories.8696062a.iframe.bundle.js → patterns-forms-multi-step-form-stories.2ea46e56.iframe.bundle.js} +1 -1
- package/docs/storybook/{patterns-loading-large-loading-stories.734fb9bc.iframe.bundle.js → patterns-loading-large-loading-stories.e6ae3e31.iframe.bundle.js} +1 -1
- package/docs/storybook/{patterns-loading-progressive-loading-stories.10bcf9f2.iframe.bundle.js → patterns-loading-progressive-loading-stories.63165c09.iframe.bundle.js} +1 -1
- package/docs/storybook/project.json +1 -1
- package/docs/storybook/radio-radio-stories.8ff73370.iframe.bundle.js +1 -0
- package/docs/storybook/runtime~main.b11c471e.iframe.bundle.js +1 -0
- package/dropdown/dropdown.component.d.ts +8 -1
- package/dropdown/list/dropdown-list.component.d.ts +1 -1
- package/esm2020/combobox/combobox.component.mjs +19 -9
- package/esm2020/dropdown/dropdown.component.mjs +31 -15
- package/esm2020/dropdown/list/dropdown-list.component.mjs +1 -1
- package/esm2020/input/input.directive.mjs +11 -5
- package/esm2020/input/text-area.directive.mjs +11 -5
- package/esm2020/input/text-input-label.component.mjs +38 -15
- package/esm2020/input/textarea-label.component.mjs +46 -21
- package/esm2020/radio/radio-group.component.mjs +19 -7
- package/fesm2015/carbon-components-angular-combobox.mjs +18 -8
- package/fesm2015/carbon-components-angular-combobox.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-dropdown.mjs +31 -14
- package/fesm2015/carbon-components-angular-dropdown.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-input.mjs +112 -46
- package/fesm2015/carbon-components-angular-input.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-radio.mjs +18 -6
- package/fesm2015/carbon-components-angular-radio.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-combobox.mjs +18 -8
- package/fesm2020/carbon-components-angular-combobox.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-dropdown.mjs +30 -14
- package/fesm2020/carbon-components-angular-dropdown.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-input.mjs +102 -45
- package/fesm2020/carbon-components-angular-input.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-radio.mjs +18 -6
- package/fesm2020/carbon-components-angular-radio.mjs.map +1 -1
- package/input/input.directive.d.ts +4 -1
- package/input/text-area.directive.d.ts +4 -1
- package/input/text-input-label.component.d.ts +9 -5
- package/input/textarea-label.component.d.ts +5 -3
- package/package.json +1 -1
- package/radio/radio-group.component.d.ts +4 -2
- package/docs/storybook/1250.47c381c1.iframe.bundle.js +0 -1
- package/docs/storybook/1345.9ccf4f3f.iframe.bundle.js +0 -1
- package/docs/storybook/3224.3e279e46.iframe.bundle.js +0 -1
- package/docs/storybook/7019.b8944046.iframe.bundle.js +0 -2
- package/docs/storybook/955.99b6ac85.iframe.bundle.js +0 -1
- package/docs/storybook/combobox-combobox-stories.e7427226.iframe.bundle.js +0 -1
- package/docs/storybook/dropdown-dropdown-stories.a76101be.iframe.bundle.js +0 -1
- package/docs/storybook/main.cdbf1814.iframe.bundle.js +0 -1
- package/docs/storybook/modal-modal-stories.0a864a6a.iframe.bundle.js +0 -1
- package/docs/storybook/radio-radio-stories.444fc044.iframe.bundle.js +0 -1
- package/docs/storybook/runtime~main.e32f2dfb.iframe.bundle.js +0 -1
- /package/docs/storybook/{7019.b8944046.iframe.bundle.js.LICENSE.txt → 7019.75ad5817.iframe.bundle.js.LICENSE.txt} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[799],{"./src/button/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{HL:()=>BaseIconButton,zx:()=>Button,hJ:()=>ButtonModule,uV:()=>ButtonSet,hU:()=>IconButton});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let Button=class Button{constructor(){this.cdsButton="primary",this.skeleton=!1,this.iconOnly=!1,this.isExpressive=!1,this.baseClass=!0}set ibmButton(type){this.cdsButton=type}get primaryButton(){return"primary"===this.cdsButton||!this.cdsButton}get secondaryButton(){return"secondary"===this.cdsButton}get tertiaryButton(){return"tertiary"===this.cdsButton}get ghostButton(){return"ghost"===this.cdsButton}get dangerButton(){return"danger"===this.cdsButton||"danger--primary"===this.cdsButton}get dangerTertiary(){return"danger--tertiary"===this.cdsButton}get dangerGhost(){return"danger--ghost"===this.cdsButton}get extraSmallSize(){return"xs"===this.size&&!this.isExpressive}get smallSize(){return"sm"===this.size&&!this.isExpressive}get mediumSize(){return"md"===this.size&&!this.isExpressive}get largeSize(){return"lg"===this.size}get extraLargeSize(){return"xl"===this.size}get twoExtraLargeSize(){return"2xl"===this.size}get extraSmallLayoutSize(){return"xs"===this.size&&!this.isExpressive}get smallLayoutSize(){return"sm"===this.size&&!this.isExpressive}get mediumLayoutSize(){return"md"===this.size&&!this.isExpressive}get largeLayoutSize(){return"lg"===this.size}get extraLargeLayoutSize(){return"xl"===this.size}get twoExtraLargeLayoutSize(){return"2xl"===this.size}};Button.propDecorators={ibmButton:[{type:core.Input}],cdsButton:[{type:core.Input}],size:[{type:core.Input}],skeleton:[{type:core.HostBinding,args:["class.cds--skeleton"]},{type:core.Input}],iconOnly:[{type:core.HostBinding,args:["class.cds--btn--icon-only"]},{type:core.Input}],isExpressive:[{type:core.HostBinding,args:["class.cds--btn--expressive"]},{type:core.Input}],baseClass:[{type:core.HostBinding,args:["class.cds--btn"]}],primaryButton:[{type:core.HostBinding,args:["class.cds--btn--primary"]}],secondaryButton:[{type:core.HostBinding,args:["class.cds--btn--secondary"]}],tertiaryButton:[{type:core.HostBinding,args:["class.cds--btn--tertiary"]}],ghostButton:[{type:core.HostBinding,args:["class.cds--btn--ghost"]}],dangerButton:[{type:core.HostBinding,args:["class.cds--btn--danger"]}],dangerTertiary:[{type:core.HostBinding,args:["class.cds--btn--danger--tertiary"]}],dangerGhost:[{type:core.HostBinding,args:["class.cds--btn--danger--ghost"]}],extraSmallSize:[{type:core.HostBinding,args:["class.cds--btn--xs"]}],smallSize:[{type:core.HostBinding,args:["class.cds--btn--sm"]}],mediumSize:[{type:core.HostBinding,args:["class.cds--btn--md"]}],largeSize:[{type:core.HostBinding,args:["class.cds--btn--lg"]}],extraLargeSize:[{type:core.HostBinding,args:["class.cds--btn--xl"]}],twoExtraLargeSize:[{type:core.HostBinding,args:["class.cds--btn--2xl"]}],extraSmallLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-xs"]}],smallLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-sm"]}],mediumLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-md"]}],largeLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-lg"]}],extraLargeLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-xl"]}],twoExtraLargeLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-2xl"]}]},Button=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsButton], [ibmButton]"})],Button);let ButtonSet=class ButtonSet{constructor(){this.buttonSetClass=!0,this.fluid=!1,this.stacked=!1}get fluidClass(){return this.fluid}get stackedClass(){return this.stacked}};ButtonSet.propDecorators={buttonSetClass:[{type:core.HostBinding,args:["class.cds--btn-set"]}],fluid:[{type:core.Input}],stacked:[{type:core.Input}],fluidClass:[{type:core.HostBinding,args:["class.cds--btn-set--fluid"]}],stackedClass:[{type:core.HostBinding,args:["class.cds--btn-set--stacked"]}]},ButtonSet=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-button-set, ibm-button-set",template:'\n\t\t<div *ngIf="fluid" class="cds--btn-set__fluid-inner cds--btn-set__fluid-inner--auto-stack">\n\t\t\t<ng-container *ngTemplateOutlet="content"></ng-container>\n\t\t</div>\n\t\t<ng-container *ngIf="!fluid">\n\t\t\t<ng-container *ngTemplateOutlet="content"></ng-container>\n\t\t</ng-container>\n\n\t\t<ng-template #content>\n\t\t\t<ng-content></ng-content>\n\t\t</ng-template>\n\t'})],ButtonSet);let BaseIconButton=class BaseIconButton{constructor(){this.caret=!0,this.dropShadow=!0,this.highContrast=!0,this.isOpen=!1,this.align="bottom",this.autoAlign=!1,this.enterDelayMs=100,this.leaveDelayMs=300}};BaseIconButton.propDecorators={caret:[{type:core.Input}],dropShadow:[{type:core.Input}],highContrast:[{type:core.Input}],isOpen:[{type:core.Input}],align:[{type:core.Input}],autoAlign:[{type:core.Input}],enterDelayMs:[{type:core.Input}],leaveDelayMs:[{type:core.Input}]},BaseIconButton=(0,tslib_es6.gn)([(0,core.Component)({template:""})],BaseIconButton);let IconButton=class IconButton extends BaseIconButton{constructor(renderer){super(),this.renderer=renderer,this.buttonId="icon-btn-"+IconButton.iconButtonCounter++,this.kind="primary",this.size="lg",this.type="button",this.isExpressive=!1,this.disabled=!1,this.showTooltipWhenDisabled=!1,this.click=new core.EventEmitter,this.focus=new core.EventEmitter,this.blur=new core.EventEmitter,this.tooltipClick=new core.EventEmitter,this.classList={},this.attributeList={}}set buttonNgClass(obj){this.classList=Object.assign({"cds--btn--disabled":this.disabled},obj)}get buttonNgClass(){return this.classList}set buttonAttributes(obj){this.button&&(Object.keys(this.attributeList).forEach((key=>{this.renderer.removeAttribute(this.button.nativeElement,key)})),Object.keys(obj).forEach((key=>{this.renderer.setAttribute(this.button.nativeElement,key,obj[key])}))),this.attributeList=obj}get buttonAttributes(){return this.buttonAttributes}ngAfterViewInit(){this.buttonAttributes=this.attributeList}emitClickEvent(event,element="button"){event.preventDefault(),event.stopPropagation(),"tooltip"!==element?this.click.emit(event):this.tooltipClick.emit(event)}};IconButton.iconButtonCounter=0,IconButton.ctorParameters=()=>[{type:core.Renderer2}],IconButton.propDecorators={buttonNgClass:[{type:core.Input}],buttonAttributes:[{type:core.Input}],button:[{type:core.ViewChild,args:["button"]}],buttonId:[{type:core.Input}],kind:[{type:core.Input}],size:[{type:core.Input}],type:[{type:core.Input}],isExpressive:[{type:core.Input}],disabled:[{type:core.Input}],description:[{type:core.Input}],showTooltipWhenDisabled:[{type:core.Input}],click:[{type:core.Output}],focus:[{type:core.Output}],blur:[{type:core.Output}],tooltipClick:[{type:core.Output}]},IconButton=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-icon-button, ibm-icon-button",template:'\n\t<cds-tooltip\n\t\tclass="cds--icon-tooltip"\n\t\t[description]="description"\n\t\t[disabled]="showTooltipWhenDisabled ? false : disabled"\n\t\t[caret]="caret"\n\t\t[dropShadow]="dropShadow"\n\t\t[highContrast]="highContrast"\n\t\t[isOpen]="isOpen"\n\t\t[align]="align"\n\t\t[autoAlign]="autoAlign"\n\t\t[enterDelayMs]="enterDelayMs"\n\t\t[leaveDelayMs]="leaveDelayMs"\n\t\t(click)="emitClickEvent($event, \'tooltip\')">\n\t\t<button\n\t\t\t#button\n\t\t\t[id]="buttonId"\n\t\t\t[disabled]="disabled"\n\t\t\t[attr.type]="type"\n\t\t\t[iconOnly]="true"\n\t\t\t[ngClass]="buttonNgClass"\n\t\t\t[cdsButton]="kind"\n\t\t\t[size]="size"\n\t\t\t[isExpressive]="isExpressive"\n\t\t\t(click)="emitClickEvent($event)"\n\t\t\t(focus)="focus.emit($event)"\n\t\t\t(blur)="blur.emit($event)">\n\t\t\t<ng-content></ng-content>\n\t\t</button>\n\t</cds-tooltip>\n\t'})],IconButton);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),tooltip=__webpack_require__("./src/tooltip/index.ts");let ButtonModule=class ButtonModule{};ButtonModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Button,ButtonSet,BaseIconButton,IconButton],exports:[Button,ButtonSet,IconButton],imports:[common.CommonModule,tooltip.z8]})],ButtonModule)},"./src/experimental/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{OV:()=>ExperimentalModule,tM:()=>ExperimentalService});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let ExperimentalService=class ExperimentalService{constructor(){this.experiments=new Map}addExperiment(name,options={enabled:!1}){this.experiments.has(name)||this.experiments.set(name,options)}enableExperiment(name){this.getExperiment(name).enabled=!0}disableExperiment(name){this.getExperiment(name).enabled=!1}getExperiment(name){return this.experiments.has(name)?this.experiments.get(name):(this.addExperiment(name),this.getExperiment(name))}getExperiments(){return Array.from(this.experiments.entries())}};ExperimentalService=(0,tslib_es6.gn)([(0,core.Injectable)()],ExperimentalService);const EXPERIMENTAL_SERVICE_PROVIDER={provide:ExperimentalService,deps:[[new core.Optional,new core.SkipSelf,ExperimentalService]],useFactory:function EXPERIMENTAL_SERVICE_PROVIDER_FACTORY(parentService){return parentService||new ExperimentalService}};let ExperimentalModule=class ExperimentalModule{};ExperimentalModule=(0,tslib_es6.gn)([(0,core.NgModule)({providers:[ExperimentalService,EXPERIMENTAL_SERVICE_PROVIDER]})],ExperimentalModule)},"./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/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_61__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_60__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_angular_common__WEBPACK_IMPORTED_MODULE_62__=__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_arrow_down_16__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@carbon/icons/es/arrow--down/16.js"),_carbon_icons_es_arrows_vertical_16__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@carbon/icons/es/arrows--vertical/16.js"),_carbon_icons_es_bee_16__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@carbon/icons/es/bee/16.js"),_carbon_icons_es_bee_20__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@carbon/icons/es/bee/20.js"),_carbon_icons_es_calendar_16__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./node_modules/@carbon/icons/es/calendar/16.js"),_carbon_icons_es_carbon_16__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__("./node_modules/@carbon/icons/es/carbon/16.js"),_carbon_icons_es_carbon_20__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/@carbon/icons/es/carbon/20.js"),_carbon_icons_es_caret_down_16__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/@carbon/icons/es/caret--down/16.js"),_carbon_icons_es_caret_left_16__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/@carbon/icons/es/caret--left/16.js"),_carbon_icons_es_caret_right_16__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./node_modules/@carbon/icons/es/caret--right/16.js"),_carbon_icons_es_caret_up_16__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@carbon/icons/es/caret--up/16.js"),_carbon_icons_es_checkmark_16__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark/16.js"),_carbon_icons_es_checkmark_filled_16__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--filled/16.js"),_carbon_icons_es_checkmark_filled_20__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--filled/20.js"),_carbon_icons_es_checkmark_outline_16__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--outline/16.js"),_carbon_icons_es_checkbox_16__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./node_modules/@carbon/icons/es/checkbox/16.js"),_carbon_icons_es_checkbox_checked_filled_16__WEBPACK_IMPORTED_MODULE_20__=__webpack_require__("./node_modules/@carbon/icons/es/checkbox--checked--filled/16.js"),_carbon_icons_es_chevron_down_16__WEBPACK_IMPORTED_MODULE_21__=__webpack_require__("./node_modules/@carbon/icons/es/chevron--down/16.js"),_carbon_icons_es_chevron_right_16__WEBPACK_IMPORTED_MODULE_22__=__webpack_require__("./node_modules/@carbon/icons/es/chevron--right/16.js"),_carbon_icons_es_circle_dash_16__WEBPACK_IMPORTED_MODULE_23__=__webpack_require__("./node_modules/@carbon/icons/es/circle-dash/16.js"),_carbon_icons_es_close_16__WEBPACK_IMPORTED_MODULE_24__=__webpack_require__("./node_modules/@carbon/icons/es/close/16.js"),_carbon_icons_es_close_20__WEBPACK_IMPORTED_MODULE_25__=__webpack_require__("./node_modules/@carbon/icons/es/close/20.js"),_carbon_icons_es_copy_16__WEBPACK_IMPORTED_MODULE_26__=__webpack_require__("./node_modules/@carbon/icons/es/copy/16.js"),_carbon_icons_es_copy_20__WEBPACK_IMPORTED_MODULE_27__=__webpack_require__("./node_modules/@carbon/icons/es/copy/20.js"),_carbon_icons_es_data_2_16__WEBPACK_IMPORTED_MODULE_28__=__webpack_require__("./node_modules/@carbon/icons/es/data--2/16.js"),_carbon_icons_es_data_2_20__WEBPACK_IMPORTED_MODULE_29__=__webpack_require__("./node_modules/@carbon/icons/es/data--2/20.js"),_carbon_icons_es_document_16__WEBPACK_IMPORTED_MODULE_30__=__webpack_require__("./node_modules/@carbon/icons/es/document/16.js"),_carbon_icons_es_document_20__WEBPACK_IMPORTED_MODULE_31__=__webpack_require__("./node_modules/@carbon/icons/es/document/20.js"),_carbon_icons_es_download_16__WEBPACK_IMPORTED_MODULE_32__=__webpack_require__("./node_modules/@carbon/icons/es/download/16.js"),_carbon_icons_es_error_filled_16__WEBPACK_IMPORTED_MODULE_33__=__webpack_require__("./node_modules/@carbon/icons/es/error--filled/16.js"),_carbon_icons_es_error_filled_20__WEBPACK_IMPORTED_MODULE_34__=__webpack_require__("./node_modules/@carbon/icons/es/error--filled/20.js"),_carbon_icons_es_fade_16__WEBPACK_IMPORTED_MODULE_35__=__webpack_require__("./node_modules/@carbon/icons/es/fade/16.js"),_carbon_icons_es_fade_20__WEBPACK_IMPORTED_MODULE_36__=__webpack_require__("./node_modules/@carbon/icons/es/fade/20.js"),_carbon_icons_es_folder_16__WEBPACK_IMPORTED_MODULE_37__=__webpack_require__("./node_modules/@carbon/icons/es/folder/16.js"),_carbon_icons_es_incomplete_16__WEBPACK_IMPORTED_MODULE_38__=__webpack_require__("./node_modules/@carbon/icons/es/incomplete/16.js"),_carbon_icons_es_information_filled_16__WEBPACK_IMPORTED_MODULE_39__=__webpack_require__("./node_modules/@carbon/icons/es/information--filled/16.js"),_carbon_icons_es_information_filled_20__WEBPACK_IMPORTED_MODULE_40__=__webpack_require__("./node_modules/@carbon/icons/es/information--filled/20.js"),_carbon_icons_es_information_square_filled_20__WEBPACK_IMPORTED_MODULE_41__=__webpack_require__("./node_modules/@carbon/icons/es/information--square--filled/20.js"),_carbon_icons_es_menu_16__WEBPACK_IMPORTED_MODULE_42__=__webpack_require__("./node_modules/@carbon/icons/es/menu/16.js"),_carbon_icons_es_menu_20__WEBPACK_IMPORTED_MODULE_43__=__webpack_require__("./node_modules/@carbon/icons/es/menu/20.js"),_carbon_icons_es_overflow_menu_vertical_16__WEBPACK_IMPORTED_MODULE_44__=__webpack_require__("./node_modules/@carbon/icons/es/overflow-menu--vertical/16.js"),_carbon_icons_es_overflow_menu_horizontal_16__WEBPACK_IMPORTED_MODULE_45__=__webpack_require__("./node_modules/@carbon/icons/es/overflow-menu--horizontal/16.js"),_carbon_icons_es_save_16__WEBPACK_IMPORTED_MODULE_46__=__webpack_require__("./node_modules/@carbon/icons/es/save/16.js"),_carbon_icons_es_search_16__WEBPACK_IMPORTED_MODULE_47__=__webpack_require__("./node_modules/@carbon/icons/es/search/16.js"),_carbon_icons_es_settings_16__WEBPACK_IMPORTED_MODULE_48__=__webpack_require__("./node_modules/@carbon/icons/es/settings/16.js"),_carbon_icons_es_settings_adjust_16__WEBPACK_IMPORTED_MODULE_49__=__webpack_require__("./node_modules/@carbon/icons/es/settings--adjust/16.js"),_carbon_icons_es_subtract_16__WEBPACK_IMPORTED_MODULE_50__=__webpack_require__("./node_modules/@carbon/icons/es/subtract/16.js"),_carbon_icons_es_trash_can_16__WEBPACK_IMPORTED_MODULE_51__=__webpack_require__("./node_modules/@carbon/icons/es/trash-can/16.js"),_carbon_icons_es_warning_16__WEBPACK_IMPORTED_MODULE_52__=__webpack_require__("./node_modules/@carbon/icons/es/warning/16.js"),_carbon_icons_es_warning_filled_16__WEBPACK_IMPORTED_MODULE_53__=__webpack_require__("./node_modules/@carbon/icons/es/warning--filled/16.js"),_carbon_icons_es_warning_filled_20__WEBPACK_IMPORTED_MODULE_54__=__webpack_require__("./node_modules/@carbon/icons/es/warning--filled/20.js"),_carbon_icons_es_warning_alt_filled_16__WEBPACK_IMPORTED_MODULE_55__=__webpack_require__("./node_modules/@carbon/icons/es/warning--alt--filled/16.js"),_carbon_icons_es_warning_alt_filled_20__WEBPACK_IMPORTED_MODULE_56__=__webpack_require__("./node_modules/@carbon/icons/es/warning--alt--filled/20.js"),_carbon_icons_es_undo_16__WEBPACK_IMPORTED_MODULE_57__=__webpack_require__("./node_modules/@carbon/icons/es/undo/16.js"),_carbon_icons_es_view_16__WEBPACK_IMPORTED_MODULE_58__=__webpack_require__("./node_modules/@carbon/icons/es/view/16.js"),_carbon_icons_es_view_off_16__WEBPACK_IMPORTED_MODULE_59__=__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_60__.Optional,new _angular_core__WEBPACK_IMPORTED_MODULE_60__.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_arrow_down_16__WEBPACK_IMPORTED_MODULE_4__.Z,_carbon_icons_es_arrows_vertical_16__WEBPACK_IMPORTED_MODULE_5__.Z,_carbon_icons_es_bee_16__WEBPACK_IMPORTED_MODULE_6__.Z,_carbon_icons_es_bee_20__WEBPACK_IMPORTED_MODULE_7__.Z,_carbon_icons_es_calendar_16__WEBPACK_IMPORTED_MODULE_8__.Z,_carbon_icons_es_carbon_16__WEBPACK_IMPORTED_MODULE_9__.Z,_carbon_icons_es_carbon_20__WEBPACK_IMPORTED_MODULE_10__.Z,_carbon_icons_es_caret_down_16__WEBPACK_IMPORTED_MODULE_11__.Z,_carbon_icons_es_caret_left_16__WEBPACK_IMPORTED_MODULE_12__.Z,_carbon_icons_es_caret_right_16__WEBPACK_IMPORTED_MODULE_13__.Z,_carbon_icons_es_caret_up_16__WEBPACK_IMPORTED_MODULE_14__.Z,_carbon_icons_es_checkmark_16__WEBPACK_IMPORTED_MODULE_15__.Z,_carbon_icons_es_checkmark_filled_16__WEBPACK_IMPORTED_MODULE_16__.Z,_carbon_icons_es_checkmark_filled_20__WEBPACK_IMPORTED_MODULE_17__.Z,_carbon_icons_es_checkmark_outline_16__WEBPACK_IMPORTED_MODULE_18__.Z,_carbon_icons_es_checkbox_16__WEBPACK_IMPORTED_MODULE_19__.Z,_carbon_icons_es_checkbox_checked_filled_16__WEBPACK_IMPORTED_MODULE_20__.Z,_carbon_icons_es_chevron_down_16__WEBPACK_IMPORTED_MODULE_21__.Z,_carbon_icons_es_chevron_right_16__WEBPACK_IMPORTED_MODULE_22__.Z,_carbon_icons_es_circle_dash_16__WEBPACK_IMPORTED_MODULE_23__.Z,_carbon_icons_es_close_16__WEBPACK_IMPORTED_MODULE_24__.Z,_carbon_icons_es_close_20__WEBPACK_IMPORTED_MODULE_25__.Z,_carbon_icons_es_copy_16__WEBPACK_IMPORTED_MODULE_26__.Z,_carbon_icons_es_copy_20__WEBPACK_IMPORTED_MODULE_27__.Z,_carbon_icons_es_data_2_16__WEBPACK_IMPORTED_MODULE_28__.Z,_carbon_icons_es_data_2_20__WEBPACK_IMPORTED_MODULE_29__.Z,_carbon_icons_es_document_16__WEBPACK_IMPORTED_MODULE_30__.Z,_carbon_icons_es_document_20__WEBPACK_IMPORTED_MODULE_31__.Z,_carbon_icons_es_download_16__WEBPACK_IMPORTED_MODULE_32__.Z,_carbon_icons_es_error_filled_16__WEBPACK_IMPORTED_MODULE_33__.Z,_carbon_icons_es_error_filled_20__WEBPACK_IMPORTED_MODULE_34__.Z,_carbon_icons_es_fade_16__WEBPACK_IMPORTED_MODULE_35__.Z,_carbon_icons_es_fade_20__WEBPACK_IMPORTED_MODULE_36__.Z,_carbon_icons_es_folder_16__WEBPACK_IMPORTED_MODULE_37__.Z,_carbon_icons_es_incomplete_16__WEBPACK_IMPORTED_MODULE_38__.Z,_carbon_icons_es_information_filled_16__WEBPACK_IMPORTED_MODULE_39__.Z,_carbon_icons_es_information_filled_20__WEBPACK_IMPORTED_MODULE_40__.Z,_carbon_icons_es_information_square_filled_20__WEBPACK_IMPORTED_MODULE_41__.Z,_carbon_icons_es_menu_16__WEBPACK_IMPORTED_MODULE_42__.Z,_carbon_icons_es_menu_20__WEBPACK_IMPORTED_MODULE_43__.Z,_carbon_icons_es_overflow_menu_vertical_16__WEBPACK_IMPORTED_MODULE_44__.Z,_carbon_icons_es_overflow_menu_horizontal_16__WEBPACK_IMPORTED_MODULE_45__.Z,_carbon_icons_es_save_16__WEBPACK_IMPORTED_MODULE_46__.Z,_carbon_icons_es_search_16__WEBPACK_IMPORTED_MODULE_47__.Z,_carbon_icons_es_settings_16__WEBPACK_IMPORTED_MODULE_48__.Z,_carbon_icons_es_settings_adjust_16__WEBPACK_IMPORTED_MODULE_49__.Z,_carbon_icons_es_subtract_16__WEBPACK_IMPORTED_MODULE_50__.Z,_carbon_icons_es_trash_can_16__WEBPACK_IMPORTED_MODULE_51__.Z,_carbon_icons_es_undo_16__WEBPACK_IMPORTED_MODULE_57__.Z,_carbon_icons_es_view_16__WEBPACK_IMPORTED_MODULE_58__.Z,_carbon_icons_es_view_off_16__WEBPACK_IMPORTED_MODULE_59__.Z,_carbon_icons_es_warning_16__WEBPACK_IMPORTED_MODULE_52__.Z,_carbon_icons_es_warning_filled_16__WEBPACK_IMPORTED_MODULE_53__.Z,_carbon_icons_es_warning_filled_20__WEBPACK_IMPORTED_MODULE_54__.Z,_carbon_icons_es_warning_alt_filled_16__WEBPACK_IMPORTED_MODULE_55__.Z,_carbon_icons_es_warning_alt_filled_20__WEBPACK_IMPORTED_MODULE_56__.Z])}};IconModule.ctorParameters=()=>[{type:_icon_service__WEBPACK_IMPORTED_MODULE_1__.C6}],IconModule=(0,tslib__WEBPACK_IMPORTED_MODULE_61__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_60__.NgModule)({declarations:[_icon_directive__WEBPACK_IMPORTED_MODULE_0__.a],exports:[_icon_directive__WEBPACK_IMPORTED_MODULE_0__.a],imports:[_angular_common__WEBPACK_IMPORTED_MODULE_62__.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/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);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.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,setTimeout((()=>{this.updateSelectedRadioFromValue(),this.checkSelectedRadio()}))}ngAfterContentInit(){this.radios.changes.subscribe((()=>{this.updateRadios(),this.updateRadioChangeHandler()})),this.updateChildren(),this.updateRadioChangeHandler()}ngAfterViewInit(){this.updateRadios()}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/pagination/pagination.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Basic:()=>Basic,__namedExportsOrder:()=>__namedExportsOrder,default:()=>pagination_stories});var dist=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),pagination=__webpack_require__("./src/pagination/index.ts"),tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let PaginationStory=class PaginationStory{constructor(){this.model=new pagination.wi,this.skeleton=!1,this.disabled=!1,this.pageInputDisabled=!1,this.paginationSize="md",this.pagesUnknown=!1,this.showPageInput=!0,this.backwardDisabled=!1,this.forwardDisabled=!1}get totalDataLength(){return this.model.totalDataLength}set totalDataLength(value){this.model.totalDataLength=value}ngOnInit(){this.model.pageLength=10,this.model.currentPage=1}selectPage(page){console.log("Loading page",page,"from pagination model"),this.model.currentPage=page}};PaginationStory.propDecorators={model:[{type:core.Input}],skeleton:[{type:core.Input}],disabled:[{type:core.Input}],pageInputDisabled:[{type:core.Input}],paginationSize:[{type:core.Input}],pagesUnknown:[{type:core.Input}],showPageInput:[{type:core.Input}],backwardDisabled:[{type:core.Input}],forwardDisabled:[{type:core.Input}],totalDataLength:[{type:core.Input}]},PaginationStory=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-pagination",template:'\n\t\t<cds-pagination\n\t\t\t[model]="model"\n\t\t\t[disabled]="disabled"\n\t\t\t[pageInputDisabled]="pageInputDisabled"\n\t\t\t[size]="paginationSize"\n\t\t\t[pagesUnknown]="pagesUnknown"\n\t\t\t[showPageInput]="showPageInput"\n\t\t\t[skeleton]="skeleton"\n\t\t\t[backwardDisabled]="backwardDisabled"\n\t\t\t[forwardDisabled]="forwardDisabled"\n\t\t\t(selectPage)="selectPage($event)">\n\t\t</cds-pagination>\n\t'})],PaginationStory);const pagination_stories={title:"Components/Pagination",decorators:[(0,dist.moduleMetadata)({imports:[pagination.u3],declarations:[PaginationStory]})],component:pagination.tl},Basic=(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/pagination/stories/pagination.component.ts\n --\x3e\n <app-pagination\n [disabled]="disabled"\n [pageInputDisabled]="pageInputDisabled"\n [paginationSize]="paginationSize"\n [pagesUnknown]="pagesUnknown"\n [totalDataLength]="totalDataLength"\n [showPageInput]="showPageInput"\n [backwardDisabled]="backwardDisabled"\n [forwardDisabled]="forwardDisabled"\n [skeleton]="skeleton">\n </app-pagination>\n '})).bind({});Basic.args={disabled:!1,pageInputDisabled:!1,paginationSize:"md",pagesUnknown:!1,totalDataLength:105,showPageInput:!0,skeleton:!1,backwardDisabled:!1,forwardDisabled:!1},Basic.parameters={...Basic.parameters,docs:{...Basic.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/pagination/stories/pagination.component.ts\n --\x3e\n <app-pagination\n [disabled]="disabled"\n [pageInputDisabled]="pageInputDisabled"\n [paginationSize]="paginationSize"\n [pagesUnknown]="pagesUnknown"\n [totalDataLength]="totalDataLength"\n [showPageInput]="showPageInput"\n [backwardDisabled]="backwardDisabled"\n [forwardDisabled]="forwardDisabled"\n [skeleton]="skeleton">\n </app-pagination>\n `\n})',...Basic.parameters?.docs?.source}}};const __namedExportsOrder=["Basic"]}}]);
|
|
1
|
+
"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[799],{"./src/button/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{HL:()=>BaseIconButton,zx:()=>Button,hJ:()=>ButtonModule,uV:()=>ButtonSet,hU:()=>IconButton});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let Button=class Button{constructor(){this.cdsButton="primary",this.skeleton=!1,this.iconOnly=!1,this.isExpressive=!1,this.baseClass=!0}set ibmButton(type){this.cdsButton=type}get primaryButton(){return"primary"===this.cdsButton||!this.cdsButton}get secondaryButton(){return"secondary"===this.cdsButton}get tertiaryButton(){return"tertiary"===this.cdsButton}get ghostButton(){return"ghost"===this.cdsButton}get dangerButton(){return"danger"===this.cdsButton||"danger--primary"===this.cdsButton}get dangerTertiary(){return"danger--tertiary"===this.cdsButton}get dangerGhost(){return"danger--ghost"===this.cdsButton}get extraSmallSize(){return"xs"===this.size&&!this.isExpressive}get smallSize(){return"sm"===this.size&&!this.isExpressive}get mediumSize(){return"md"===this.size&&!this.isExpressive}get largeSize(){return"lg"===this.size}get extraLargeSize(){return"xl"===this.size}get twoExtraLargeSize(){return"2xl"===this.size}get extraSmallLayoutSize(){return"xs"===this.size&&!this.isExpressive}get smallLayoutSize(){return"sm"===this.size&&!this.isExpressive}get mediumLayoutSize(){return"md"===this.size&&!this.isExpressive}get largeLayoutSize(){return"lg"===this.size}get extraLargeLayoutSize(){return"xl"===this.size}get twoExtraLargeLayoutSize(){return"2xl"===this.size}};Button.propDecorators={ibmButton:[{type:core.Input}],cdsButton:[{type:core.Input}],size:[{type:core.Input}],skeleton:[{type:core.HostBinding,args:["class.cds--skeleton"]},{type:core.Input}],iconOnly:[{type:core.HostBinding,args:["class.cds--btn--icon-only"]},{type:core.Input}],isExpressive:[{type:core.HostBinding,args:["class.cds--btn--expressive"]},{type:core.Input}],baseClass:[{type:core.HostBinding,args:["class.cds--btn"]}],primaryButton:[{type:core.HostBinding,args:["class.cds--btn--primary"]}],secondaryButton:[{type:core.HostBinding,args:["class.cds--btn--secondary"]}],tertiaryButton:[{type:core.HostBinding,args:["class.cds--btn--tertiary"]}],ghostButton:[{type:core.HostBinding,args:["class.cds--btn--ghost"]}],dangerButton:[{type:core.HostBinding,args:["class.cds--btn--danger"]}],dangerTertiary:[{type:core.HostBinding,args:["class.cds--btn--danger--tertiary"]}],dangerGhost:[{type:core.HostBinding,args:["class.cds--btn--danger--ghost"]}],extraSmallSize:[{type:core.HostBinding,args:["class.cds--btn--xs"]}],smallSize:[{type:core.HostBinding,args:["class.cds--btn--sm"]}],mediumSize:[{type:core.HostBinding,args:["class.cds--btn--md"]}],largeSize:[{type:core.HostBinding,args:["class.cds--btn--lg"]}],extraLargeSize:[{type:core.HostBinding,args:["class.cds--btn--xl"]}],twoExtraLargeSize:[{type:core.HostBinding,args:["class.cds--btn--2xl"]}],extraSmallLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-xs"]}],smallLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-sm"]}],mediumLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-md"]}],largeLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-lg"]}],extraLargeLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-xl"]}],twoExtraLargeLayoutSize:[{type:core.HostBinding,args:["class.cds--layout--size-2xl"]}]},Button=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsButton], [ibmButton]"})],Button);let ButtonSet=class ButtonSet{constructor(){this.buttonSetClass=!0,this.fluid=!1,this.stacked=!1}get fluidClass(){return this.fluid}get stackedClass(){return this.stacked}};ButtonSet.propDecorators={buttonSetClass:[{type:core.HostBinding,args:["class.cds--btn-set"]}],fluid:[{type:core.Input}],stacked:[{type:core.Input}],fluidClass:[{type:core.HostBinding,args:["class.cds--btn-set--fluid"]}],stackedClass:[{type:core.HostBinding,args:["class.cds--btn-set--stacked"]}]},ButtonSet=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-button-set, ibm-button-set",template:'\n\t\t<div *ngIf="fluid" class="cds--btn-set__fluid-inner cds--btn-set__fluid-inner--auto-stack">\n\t\t\t<ng-container *ngTemplateOutlet="content"></ng-container>\n\t\t</div>\n\t\t<ng-container *ngIf="!fluid">\n\t\t\t<ng-container *ngTemplateOutlet="content"></ng-container>\n\t\t</ng-container>\n\n\t\t<ng-template #content>\n\t\t\t<ng-content></ng-content>\n\t\t</ng-template>\n\t'})],ButtonSet);let BaseIconButton=class BaseIconButton{constructor(){this.caret=!0,this.dropShadow=!0,this.highContrast=!0,this.isOpen=!1,this.align="bottom",this.autoAlign=!1,this.enterDelayMs=100,this.leaveDelayMs=300}};BaseIconButton.propDecorators={caret:[{type:core.Input}],dropShadow:[{type:core.Input}],highContrast:[{type:core.Input}],isOpen:[{type:core.Input}],align:[{type:core.Input}],autoAlign:[{type:core.Input}],enterDelayMs:[{type:core.Input}],leaveDelayMs:[{type:core.Input}]},BaseIconButton=(0,tslib_es6.gn)([(0,core.Component)({template:""})],BaseIconButton);let IconButton=class IconButton extends BaseIconButton{constructor(renderer){super(),this.renderer=renderer,this.buttonId="icon-btn-"+IconButton.iconButtonCounter++,this.kind="primary",this.size="lg",this.type="button",this.isExpressive=!1,this.disabled=!1,this.showTooltipWhenDisabled=!1,this.click=new core.EventEmitter,this.focus=new core.EventEmitter,this.blur=new core.EventEmitter,this.tooltipClick=new core.EventEmitter,this.classList={},this.attributeList={}}set buttonNgClass(obj){this.classList=Object.assign({"cds--btn--disabled":this.disabled},obj)}get buttonNgClass(){return this.classList}set buttonAttributes(obj){this.button&&(Object.keys(this.attributeList).forEach((key=>{this.renderer.removeAttribute(this.button.nativeElement,key)})),Object.keys(obj).forEach((key=>{this.renderer.setAttribute(this.button.nativeElement,key,obj[key])}))),this.attributeList=obj}get buttonAttributes(){return this.buttonAttributes}ngAfterViewInit(){this.buttonAttributes=this.attributeList}emitClickEvent(event,element="button"){event.preventDefault(),event.stopPropagation(),"tooltip"!==element?this.click.emit(event):this.tooltipClick.emit(event)}};IconButton.iconButtonCounter=0,IconButton.ctorParameters=()=>[{type:core.Renderer2}],IconButton.propDecorators={buttonNgClass:[{type:core.Input}],buttonAttributes:[{type:core.Input}],button:[{type:core.ViewChild,args:["button"]}],buttonId:[{type:core.Input}],kind:[{type:core.Input}],size:[{type:core.Input}],type:[{type:core.Input}],isExpressive:[{type:core.Input}],disabled:[{type:core.Input}],description:[{type:core.Input}],showTooltipWhenDisabled:[{type:core.Input}],click:[{type:core.Output}],focus:[{type:core.Output}],blur:[{type:core.Output}],tooltipClick:[{type:core.Output}]},IconButton=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-icon-button, ibm-icon-button",template:'\n\t<cds-tooltip\n\t\tclass="cds--icon-tooltip"\n\t\t[description]="description"\n\t\t[disabled]="showTooltipWhenDisabled ? false : disabled"\n\t\t[caret]="caret"\n\t\t[dropShadow]="dropShadow"\n\t\t[highContrast]="highContrast"\n\t\t[isOpen]="isOpen"\n\t\t[align]="align"\n\t\t[autoAlign]="autoAlign"\n\t\t[enterDelayMs]="enterDelayMs"\n\t\t[leaveDelayMs]="leaveDelayMs"\n\t\t(click)="emitClickEvent($event, \'tooltip\')">\n\t\t<button\n\t\t\t#button\n\t\t\t[id]="buttonId"\n\t\t\t[disabled]="disabled"\n\t\t\t[attr.type]="type"\n\t\t\t[iconOnly]="true"\n\t\t\t[ngClass]="buttonNgClass"\n\t\t\t[cdsButton]="kind"\n\t\t\t[size]="size"\n\t\t\t[isExpressive]="isExpressive"\n\t\t\t(click)="emitClickEvent($event)"\n\t\t\t(focus)="focus.emit($event)"\n\t\t\t(blur)="blur.emit($event)">\n\t\t\t<ng-content></ng-content>\n\t\t</button>\n\t</cds-tooltip>\n\t'})],IconButton);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),tooltip=__webpack_require__("./src/tooltip/index.ts");let ButtonModule=class ButtonModule{};ButtonModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Button,ButtonSet,BaseIconButton,IconButton],exports:[Button,ButtonSet,IconButton],imports:[common.CommonModule,tooltip.z8]})],ButtonModule)},"./src/experimental/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{OV:()=>ExperimentalModule,tM:()=>ExperimentalService});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let ExperimentalService=class ExperimentalService{constructor(){this.experiments=new Map}addExperiment(name,options={enabled:!1}){this.experiments.has(name)||this.experiments.set(name,options)}enableExperiment(name){this.getExperiment(name).enabled=!0}disableExperiment(name){this.getExperiment(name).enabled=!1}getExperiment(name){return this.experiments.has(name)?this.experiments.get(name):(this.addExperiment(name),this.getExperiment(name))}getExperiments(){return Array.from(this.experiments.entries())}};ExperimentalService=(0,tslib_es6.gn)([(0,core.Injectable)()],ExperimentalService);const EXPERIMENTAL_SERVICE_PROVIDER={provide:ExperimentalService,deps:[[new core.Optional,new core.SkipSelf,ExperimentalService]],useFactory:function EXPERIMENTAL_SERVICE_PROVIDER_FACTORY(parentService){return parentService||new ExperimentalService}};let ExperimentalModule=class ExperimentalModule{};ExperimentalModule=(0,tslib_es6.gn)([(0,core.NgModule)({providers:[ExperimentalService,EXPERIMENTAL_SERVICE_PROVIDER]})],ExperimentalModule)},"./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/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_61__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_60__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_angular_common__WEBPACK_IMPORTED_MODULE_62__=__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_arrow_down_16__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@carbon/icons/es/arrow--down/16.js"),_carbon_icons_es_arrows_vertical_16__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@carbon/icons/es/arrows--vertical/16.js"),_carbon_icons_es_bee_16__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@carbon/icons/es/bee/16.js"),_carbon_icons_es_bee_20__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@carbon/icons/es/bee/20.js"),_carbon_icons_es_calendar_16__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./node_modules/@carbon/icons/es/calendar/16.js"),_carbon_icons_es_carbon_16__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__("./node_modules/@carbon/icons/es/carbon/16.js"),_carbon_icons_es_carbon_20__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/@carbon/icons/es/carbon/20.js"),_carbon_icons_es_caret_down_16__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/@carbon/icons/es/caret--down/16.js"),_carbon_icons_es_caret_left_16__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/@carbon/icons/es/caret--left/16.js"),_carbon_icons_es_caret_right_16__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./node_modules/@carbon/icons/es/caret--right/16.js"),_carbon_icons_es_caret_up_16__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@carbon/icons/es/caret--up/16.js"),_carbon_icons_es_checkmark_16__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark/16.js"),_carbon_icons_es_checkmark_filled_16__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--filled/16.js"),_carbon_icons_es_checkmark_filled_20__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--filled/20.js"),_carbon_icons_es_checkmark_outline_16__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--outline/16.js"),_carbon_icons_es_checkbox_16__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./node_modules/@carbon/icons/es/checkbox/16.js"),_carbon_icons_es_checkbox_checked_filled_16__WEBPACK_IMPORTED_MODULE_20__=__webpack_require__("./node_modules/@carbon/icons/es/checkbox--checked--filled/16.js"),_carbon_icons_es_chevron_down_16__WEBPACK_IMPORTED_MODULE_21__=__webpack_require__("./node_modules/@carbon/icons/es/chevron--down/16.js"),_carbon_icons_es_chevron_right_16__WEBPACK_IMPORTED_MODULE_22__=__webpack_require__("./node_modules/@carbon/icons/es/chevron--right/16.js"),_carbon_icons_es_circle_dash_16__WEBPACK_IMPORTED_MODULE_23__=__webpack_require__("./node_modules/@carbon/icons/es/circle-dash/16.js"),_carbon_icons_es_close_16__WEBPACK_IMPORTED_MODULE_24__=__webpack_require__("./node_modules/@carbon/icons/es/close/16.js"),_carbon_icons_es_close_20__WEBPACK_IMPORTED_MODULE_25__=__webpack_require__("./node_modules/@carbon/icons/es/close/20.js"),_carbon_icons_es_copy_16__WEBPACK_IMPORTED_MODULE_26__=__webpack_require__("./node_modules/@carbon/icons/es/copy/16.js"),_carbon_icons_es_copy_20__WEBPACK_IMPORTED_MODULE_27__=__webpack_require__("./node_modules/@carbon/icons/es/copy/20.js"),_carbon_icons_es_data_2_16__WEBPACK_IMPORTED_MODULE_28__=__webpack_require__("./node_modules/@carbon/icons/es/data--2/16.js"),_carbon_icons_es_data_2_20__WEBPACK_IMPORTED_MODULE_29__=__webpack_require__("./node_modules/@carbon/icons/es/data--2/20.js"),_carbon_icons_es_document_16__WEBPACK_IMPORTED_MODULE_30__=__webpack_require__("./node_modules/@carbon/icons/es/document/16.js"),_carbon_icons_es_document_20__WEBPACK_IMPORTED_MODULE_31__=__webpack_require__("./node_modules/@carbon/icons/es/document/20.js"),_carbon_icons_es_download_16__WEBPACK_IMPORTED_MODULE_32__=__webpack_require__("./node_modules/@carbon/icons/es/download/16.js"),_carbon_icons_es_error_filled_16__WEBPACK_IMPORTED_MODULE_33__=__webpack_require__("./node_modules/@carbon/icons/es/error--filled/16.js"),_carbon_icons_es_error_filled_20__WEBPACK_IMPORTED_MODULE_34__=__webpack_require__("./node_modules/@carbon/icons/es/error--filled/20.js"),_carbon_icons_es_fade_16__WEBPACK_IMPORTED_MODULE_35__=__webpack_require__("./node_modules/@carbon/icons/es/fade/16.js"),_carbon_icons_es_fade_20__WEBPACK_IMPORTED_MODULE_36__=__webpack_require__("./node_modules/@carbon/icons/es/fade/20.js"),_carbon_icons_es_folder_16__WEBPACK_IMPORTED_MODULE_37__=__webpack_require__("./node_modules/@carbon/icons/es/folder/16.js"),_carbon_icons_es_incomplete_16__WEBPACK_IMPORTED_MODULE_38__=__webpack_require__("./node_modules/@carbon/icons/es/incomplete/16.js"),_carbon_icons_es_information_filled_16__WEBPACK_IMPORTED_MODULE_39__=__webpack_require__("./node_modules/@carbon/icons/es/information--filled/16.js"),_carbon_icons_es_information_filled_20__WEBPACK_IMPORTED_MODULE_40__=__webpack_require__("./node_modules/@carbon/icons/es/information--filled/20.js"),_carbon_icons_es_information_square_filled_20__WEBPACK_IMPORTED_MODULE_41__=__webpack_require__("./node_modules/@carbon/icons/es/information--square--filled/20.js"),_carbon_icons_es_menu_16__WEBPACK_IMPORTED_MODULE_42__=__webpack_require__("./node_modules/@carbon/icons/es/menu/16.js"),_carbon_icons_es_menu_20__WEBPACK_IMPORTED_MODULE_43__=__webpack_require__("./node_modules/@carbon/icons/es/menu/20.js"),_carbon_icons_es_overflow_menu_vertical_16__WEBPACK_IMPORTED_MODULE_44__=__webpack_require__("./node_modules/@carbon/icons/es/overflow-menu--vertical/16.js"),_carbon_icons_es_overflow_menu_horizontal_16__WEBPACK_IMPORTED_MODULE_45__=__webpack_require__("./node_modules/@carbon/icons/es/overflow-menu--horizontal/16.js"),_carbon_icons_es_save_16__WEBPACK_IMPORTED_MODULE_46__=__webpack_require__("./node_modules/@carbon/icons/es/save/16.js"),_carbon_icons_es_search_16__WEBPACK_IMPORTED_MODULE_47__=__webpack_require__("./node_modules/@carbon/icons/es/search/16.js"),_carbon_icons_es_settings_16__WEBPACK_IMPORTED_MODULE_48__=__webpack_require__("./node_modules/@carbon/icons/es/settings/16.js"),_carbon_icons_es_settings_adjust_16__WEBPACK_IMPORTED_MODULE_49__=__webpack_require__("./node_modules/@carbon/icons/es/settings--adjust/16.js"),_carbon_icons_es_subtract_16__WEBPACK_IMPORTED_MODULE_50__=__webpack_require__("./node_modules/@carbon/icons/es/subtract/16.js"),_carbon_icons_es_trash_can_16__WEBPACK_IMPORTED_MODULE_51__=__webpack_require__("./node_modules/@carbon/icons/es/trash-can/16.js"),_carbon_icons_es_warning_16__WEBPACK_IMPORTED_MODULE_52__=__webpack_require__("./node_modules/@carbon/icons/es/warning/16.js"),_carbon_icons_es_warning_filled_16__WEBPACK_IMPORTED_MODULE_53__=__webpack_require__("./node_modules/@carbon/icons/es/warning--filled/16.js"),_carbon_icons_es_warning_filled_20__WEBPACK_IMPORTED_MODULE_54__=__webpack_require__("./node_modules/@carbon/icons/es/warning--filled/20.js"),_carbon_icons_es_warning_alt_filled_16__WEBPACK_IMPORTED_MODULE_55__=__webpack_require__("./node_modules/@carbon/icons/es/warning--alt--filled/16.js"),_carbon_icons_es_warning_alt_filled_20__WEBPACK_IMPORTED_MODULE_56__=__webpack_require__("./node_modules/@carbon/icons/es/warning--alt--filled/20.js"),_carbon_icons_es_undo_16__WEBPACK_IMPORTED_MODULE_57__=__webpack_require__("./node_modules/@carbon/icons/es/undo/16.js"),_carbon_icons_es_view_16__WEBPACK_IMPORTED_MODULE_58__=__webpack_require__("./node_modules/@carbon/icons/es/view/16.js"),_carbon_icons_es_view_off_16__WEBPACK_IMPORTED_MODULE_59__=__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_60__.Optional,new _angular_core__WEBPACK_IMPORTED_MODULE_60__.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_arrow_down_16__WEBPACK_IMPORTED_MODULE_4__.Z,_carbon_icons_es_arrows_vertical_16__WEBPACK_IMPORTED_MODULE_5__.Z,_carbon_icons_es_bee_16__WEBPACK_IMPORTED_MODULE_6__.Z,_carbon_icons_es_bee_20__WEBPACK_IMPORTED_MODULE_7__.Z,_carbon_icons_es_calendar_16__WEBPACK_IMPORTED_MODULE_8__.Z,_carbon_icons_es_carbon_16__WEBPACK_IMPORTED_MODULE_9__.Z,_carbon_icons_es_carbon_20__WEBPACK_IMPORTED_MODULE_10__.Z,_carbon_icons_es_caret_down_16__WEBPACK_IMPORTED_MODULE_11__.Z,_carbon_icons_es_caret_left_16__WEBPACK_IMPORTED_MODULE_12__.Z,_carbon_icons_es_caret_right_16__WEBPACK_IMPORTED_MODULE_13__.Z,_carbon_icons_es_caret_up_16__WEBPACK_IMPORTED_MODULE_14__.Z,_carbon_icons_es_checkmark_16__WEBPACK_IMPORTED_MODULE_15__.Z,_carbon_icons_es_checkmark_filled_16__WEBPACK_IMPORTED_MODULE_16__.Z,_carbon_icons_es_checkmark_filled_20__WEBPACK_IMPORTED_MODULE_17__.Z,_carbon_icons_es_checkmark_outline_16__WEBPACK_IMPORTED_MODULE_18__.Z,_carbon_icons_es_checkbox_16__WEBPACK_IMPORTED_MODULE_19__.Z,_carbon_icons_es_checkbox_checked_filled_16__WEBPACK_IMPORTED_MODULE_20__.Z,_carbon_icons_es_chevron_down_16__WEBPACK_IMPORTED_MODULE_21__.Z,_carbon_icons_es_chevron_right_16__WEBPACK_IMPORTED_MODULE_22__.Z,_carbon_icons_es_circle_dash_16__WEBPACK_IMPORTED_MODULE_23__.Z,_carbon_icons_es_close_16__WEBPACK_IMPORTED_MODULE_24__.Z,_carbon_icons_es_close_20__WEBPACK_IMPORTED_MODULE_25__.Z,_carbon_icons_es_copy_16__WEBPACK_IMPORTED_MODULE_26__.Z,_carbon_icons_es_copy_20__WEBPACK_IMPORTED_MODULE_27__.Z,_carbon_icons_es_data_2_16__WEBPACK_IMPORTED_MODULE_28__.Z,_carbon_icons_es_data_2_20__WEBPACK_IMPORTED_MODULE_29__.Z,_carbon_icons_es_document_16__WEBPACK_IMPORTED_MODULE_30__.Z,_carbon_icons_es_document_20__WEBPACK_IMPORTED_MODULE_31__.Z,_carbon_icons_es_download_16__WEBPACK_IMPORTED_MODULE_32__.Z,_carbon_icons_es_error_filled_16__WEBPACK_IMPORTED_MODULE_33__.Z,_carbon_icons_es_error_filled_20__WEBPACK_IMPORTED_MODULE_34__.Z,_carbon_icons_es_fade_16__WEBPACK_IMPORTED_MODULE_35__.Z,_carbon_icons_es_fade_20__WEBPACK_IMPORTED_MODULE_36__.Z,_carbon_icons_es_folder_16__WEBPACK_IMPORTED_MODULE_37__.Z,_carbon_icons_es_incomplete_16__WEBPACK_IMPORTED_MODULE_38__.Z,_carbon_icons_es_information_filled_16__WEBPACK_IMPORTED_MODULE_39__.Z,_carbon_icons_es_information_filled_20__WEBPACK_IMPORTED_MODULE_40__.Z,_carbon_icons_es_information_square_filled_20__WEBPACK_IMPORTED_MODULE_41__.Z,_carbon_icons_es_menu_16__WEBPACK_IMPORTED_MODULE_42__.Z,_carbon_icons_es_menu_20__WEBPACK_IMPORTED_MODULE_43__.Z,_carbon_icons_es_overflow_menu_vertical_16__WEBPACK_IMPORTED_MODULE_44__.Z,_carbon_icons_es_overflow_menu_horizontal_16__WEBPACK_IMPORTED_MODULE_45__.Z,_carbon_icons_es_save_16__WEBPACK_IMPORTED_MODULE_46__.Z,_carbon_icons_es_search_16__WEBPACK_IMPORTED_MODULE_47__.Z,_carbon_icons_es_settings_16__WEBPACK_IMPORTED_MODULE_48__.Z,_carbon_icons_es_settings_adjust_16__WEBPACK_IMPORTED_MODULE_49__.Z,_carbon_icons_es_subtract_16__WEBPACK_IMPORTED_MODULE_50__.Z,_carbon_icons_es_trash_can_16__WEBPACK_IMPORTED_MODULE_51__.Z,_carbon_icons_es_undo_16__WEBPACK_IMPORTED_MODULE_57__.Z,_carbon_icons_es_view_16__WEBPACK_IMPORTED_MODULE_58__.Z,_carbon_icons_es_view_off_16__WEBPACK_IMPORTED_MODULE_59__.Z,_carbon_icons_es_warning_16__WEBPACK_IMPORTED_MODULE_52__.Z,_carbon_icons_es_warning_filled_16__WEBPACK_IMPORTED_MODULE_53__.Z,_carbon_icons_es_warning_filled_20__WEBPACK_IMPORTED_MODULE_54__.Z,_carbon_icons_es_warning_alt_filled_16__WEBPACK_IMPORTED_MODULE_55__.Z,_carbon_icons_es_warning_alt_filled_20__WEBPACK_IMPORTED_MODULE_56__.Z])}};IconModule.ctorParameters=()=>[{type:_icon_service__WEBPACK_IMPORTED_MODULE_1__.C6}],IconModule=(0,tslib__WEBPACK_IMPORTED_MODULE_61__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_60__.NgModule)({declarations:[_icon_directive__WEBPACK_IMPORTED_MODULE_0__.a],exports:[_icon_directive__WEBPACK_IMPORTED_MODULE_0__.a],imports:[_angular_common__WEBPACK_IMPORTED_MODULE_62__.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/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/pagination/pagination.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Basic:()=>Basic,__namedExportsOrder:()=>__namedExportsOrder,default:()=>pagination_stories});var dist=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),pagination=__webpack_require__("./src/pagination/index.ts"),tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let PaginationStory=class PaginationStory{constructor(){this.model=new pagination.wi,this.skeleton=!1,this.disabled=!1,this.pageInputDisabled=!1,this.paginationSize="md",this.pagesUnknown=!1,this.showPageInput=!0,this.backwardDisabled=!1,this.forwardDisabled=!1}get totalDataLength(){return this.model.totalDataLength}set totalDataLength(value){this.model.totalDataLength=value}ngOnInit(){this.model.pageLength=10,this.model.currentPage=1}selectPage(page){console.log("Loading page",page,"from pagination model"),this.model.currentPage=page}};PaginationStory.propDecorators={model:[{type:core.Input}],skeleton:[{type:core.Input}],disabled:[{type:core.Input}],pageInputDisabled:[{type:core.Input}],paginationSize:[{type:core.Input}],pagesUnknown:[{type:core.Input}],showPageInput:[{type:core.Input}],backwardDisabled:[{type:core.Input}],forwardDisabled:[{type:core.Input}],totalDataLength:[{type:core.Input}]},PaginationStory=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-pagination",template:'\n\t\t<cds-pagination\n\t\t\t[model]="model"\n\t\t\t[disabled]="disabled"\n\t\t\t[pageInputDisabled]="pageInputDisabled"\n\t\t\t[size]="paginationSize"\n\t\t\t[pagesUnknown]="pagesUnknown"\n\t\t\t[showPageInput]="showPageInput"\n\t\t\t[skeleton]="skeleton"\n\t\t\t[backwardDisabled]="backwardDisabled"\n\t\t\t[forwardDisabled]="forwardDisabled"\n\t\t\t(selectPage)="selectPage($event)">\n\t\t</cds-pagination>\n\t'})],PaginationStory);const pagination_stories={title:"Components/Pagination",decorators:[(0,dist.moduleMetadata)({imports:[pagination.u3],declarations:[PaginationStory]})],component:pagination.tl},Basic=(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/pagination/stories/pagination.component.ts\n --\x3e\n <app-pagination\n [disabled]="disabled"\n [pageInputDisabled]="pageInputDisabled"\n [paginationSize]="paginationSize"\n [pagesUnknown]="pagesUnknown"\n [totalDataLength]="totalDataLength"\n [showPageInput]="showPageInput"\n [backwardDisabled]="backwardDisabled"\n [forwardDisabled]="forwardDisabled"\n [skeleton]="skeleton">\n </app-pagination>\n '})).bind({});Basic.args={disabled:!1,pageInputDisabled:!1,paginationSize:"md",pagesUnknown:!1,totalDataLength:105,showPageInput:!0,skeleton:!1,backwardDisabled:!1,forwardDisabled:!1},Basic.parameters={...Basic.parameters,docs:{...Basic.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/pagination/stories/pagination.component.ts\n --\x3e\n <app-pagination\n [disabled]="disabled"\n [pageInputDisabled]="pageInputDisabled"\n [paginationSize]="paginationSize"\n [pagesUnknown]="pagesUnknown"\n [totalDataLength]="totalDataLength"\n [showPageInput]="showPageInput"\n [backwardDisabled]="backwardDisabled"\n [forwardDisabled]="forwardDisabled"\n [skeleton]="skeleton">\n </app-pagination>\n `\n})',...Basic.parameters?.docs?.source}}};const __namedExportsOrder=["Basic"]}}]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[3610],{"./src/grid/column.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{i:()=>ColumnDirective});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"),rxjs__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),_grid_service__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.service.ts");let ColumnDirective=class ColumnDirective{constructor(gridService){this.gridService=gridService,this.class="",this.columnNumbers={},this.offsets={},this.columnHang=!1,this._columnClasses=[],this.isCssGrid=!1,this.subscription=new rxjs__WEBPACK_IMPORTED_MODULE_1__.w0}get columnClasses(){return this._columnClasses.join(" ")}set columnClasses(classes){this._columnClasses=classes.split(" ")}ngOnInit(){this.gridService?this.subscription=this.gridService.gridObservable.subscribe((isCssGrid=>{this.isCssGrid=isCssGrid,this.updateColumnClasses()})):this.updateColumnClasses()}ngOnChanges(){this.updateColumnClasses()}ngOnDestroy(){this.subscription.unsubscribe()}updateColumnClasses(){try{this._columnClasses=[];const columnKeys=Object.keys(this.columnNumbers);this.isCssGrid?(this._columnClasses.push("cds--css-grid-column"),this.columnHang&&this._columnClasses.push("cds--grid-column-hang"),columnKeys.forEach((key=>{"auto"===this.columnNumbers[key]?this._columnClasses.push(`cds--${key}:col-span-auto`):"object"==typeof this.columnNumbers[key]?(this.columnNumbers[key].start&&this._columnClasses.push(`cds--${key}:col-start-${this.columnNumbers[key].start}`),this.columnNumbers[key].end&&this._columnClasses.push(`cds--${key}:col-end-${this.columnNumbers[key].end}`),this.columnNumbers[key].span&&this._columnClasses.push(`cds--${key}:col-span-${this.columnNumbers[key].span}`)):this._columnClasses.push(`cds--${key}:col-span-${this.columnNumbers[key]}`)})),Object.keys(this.offsets).forEach((key=>{this._columnClasses.push(`cds--${key}:col-start-${this.offsets[key]}`)}))):(columnKeys.length<=0&&this._columnClasses.push("cds--col"),columnKeys.forEach((key=>{"nobreak"===this.columnNumbers[key]?this._columnClasses.push(`cds--col-${key}`):this._columnClasses.push(`cds--col-${key}-${this.columnNumbers[key]}`)})),Object.keys(this.offsets).forEach((key=>{this._columnClasses.push(`cds--offset-${key}-${this.offsets[key]}`)})))}catch(err){console.error(`Malformed \`offsets\` or \`columnNumbers\`: ${err}`)}this.class&&this._columnClasses.push(this.class)}};ColumnDirective.ctorParameters=()=>[{type:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r,decorators:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Optional}]}],ColumnDirective.propDecorators={columnClasses:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class"]}],class:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],columnNumbers:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],offsets:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],columnHang:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}]},ColumnDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_3__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Directive)({selector:"[cdsCol], [ibmCol]"})],ColumnDirective)},"./src/grid/grid.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{l:()=>GridDirective});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"),rxjs__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),_grid_service__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.service.ts");let GridDirective=class GridDirective{constructor(gridService){this.gridService=gridService,this.condensed=!1,this.narrow=!1,this.fullWidth=!1,this.cssGridEnabled=!1,this.isSubgrid=!1,this.subscription=new rxjs__WEBPACK_IMPORTED_MODULE_1__.w0}set useCssGrid(enable){this.cssGridEnabled=enable,this.gridService.updateGridType(enable)}get flexGrid(){return!this.cssGridEnabled}get flexCondensed(){return!this.cssGridEnabled&&this.condensed}get flexNarrow(){return!this.cssGridEnabled&&this.narrow}get flexFullWidth(){return!this.cssGridEnabled&&this.fullWidth}get ccsGrid(){return this.cssGridEnabled&&!this.isSubgrid}get ccsCondensed(){return this.cssGridEnabled&&!this.isSubgrid&&this.condensed}get ccsNarrow(){return this.cssGridEnabled&&!this.isSubgrid&&this.narrow}get ccsFullWidth(){return this.cssGridEnabled&&!this.isSubgrid&&this.fullWidth}get subGrid(){return this.cssGridEnabled&&this.isSubgrid}get subCondensed(){return this.cssGridEnabled&&this.isSubgrid&&this.condensed}get subNarrow(){return this.cssGridEnabled&&this.isSubgrid&&this.narrow}get subFullWidth(){return this.cssGridEnabled&&this.isSubgrid&&this.fullWidth}ngOnInit(){this.subscription=this.gridService.gridObservable.subscribe((isCssGrid=>{this.cssGridEnabled=isCssGrid}))}set cssGridChildren(list){this.cssGridEnabled&&list.forEach((grid=>{grid!==this&&(grid.isSubgrid=!0)}))}ngOnDestroy(){this.subscription.unsubscribe()}};GridDirective.ctorParameters=()=>[{type:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r}],GridDirective.propDecorators={condensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],narrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],fullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],useCssGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],flexGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid"]}],flexCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--condensed"]}],flexNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--narrow"]}],flexFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--full-width"]}],ccsGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid"]}],ccsCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--condensed"]}],ccsNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--narrow"]}],ccsFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--full-width"]}],subGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid"]}],subCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--condensed"]}],subNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--narrow"]}],subFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--wide"]}],cssGridChildren:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.ContentChildren,args:[GridDirective,{descendants:!0}]}]},GridDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_3__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Directive)({selector:"[cdsGrid], [ibmGrid]",providers:[{provide:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r,deps:[[new _angular_core__WEBPACK_IMPORTED_MODULE_2__.Optional,new _angular_core__WEBPACK_IMPORTED_MODULE_2__.SkipSelf,_grid_service__WEBPACK_IMPORTED_MODULE_0__.r]],useFactory:parentService=>parentService||new _grid_service__WEBPACK_IMPORTED_MODULE_0__.r}]})],GridDirective)},"./src/grid/grid.module.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{z:()=>GridModule});var tslib__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_angular_common__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),_column_directive__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/column.directive.ts"),_row_directive__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/grid/row.directive.ts"),_grid_directive__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/grid/grid.directive.ts"),_grid_service__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/grid/grid.service.ts");let GridModule=class GridModule{};GridModule=(0,tslib__WEBPACK_IMPORTED_MODULE_4__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_5__.NgModule)({declarations:[_column_directive__WEBPACK_IMPORTED_MODULE_0__.i,_grid_directive__WEBPACK_IMPORTED_MODULE_2__.l,_row_directive__WEBPACK_IMPORTED_MODULE_1__.v],exports:[_column_directive__WEBPACK_IMPORTED_MODULE_0__.i,_grid_directive__WEBPACK_IMPORTED_MODULE_2__.l,_row_directive__WEBPACK_IMPORTED_MODULE_1__.v],providers:[_grid_service__WEBPACK_IMPORTED_MODULE_3__.r],imports:[_angular_common__WEBPACK_IMPORTED_MODULE_6__.CommonModule]})],GridModule)},"./src/grid/grid.service.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{r:()=>GridService});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"),rxjs__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/BehaviorSubject.js");let GridService=class GridService{constructor(){this.gridSubject=new rxjs__WEBPACK_IMPORTED_MODULE_0__.X(!1),this.cssGridEnabled=!1,this.gridObservable=this.gridSubject.asObservable()}updateGridType(enableCssGrid){this.cssGridEnabled!==enableCssGrid&&(this.cssGridEnabled=!0,this.gridSubject.next(enableCssGrid))}};GridService.ctorParameters=()=>[],GridService=(0,tslib__WEBPACK_IMPORTED_MODULE_1__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Injectable)()],GridService)},"./src/grid/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{iK:()=>_column_directive__WEBPACK_IMPORTED_MODULE_4__.i,lj:()=>_grid_directive__WEBPACK_IMPORTED_MODULE_1__.l,vZ:()=>_row_directive__WEBPACK_IMPORTED_MODULE_3__.v,zE:()=>_grid_module__WEBPACK_IMPORTED_MODULE_0__.z});var _grid_module__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.module.ts"),_grid_directive__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/grid/grid.directive.ts"),_row_directive__WEBPACK_IMPORTED_MODULE_3__=(__webpack_require__("./src/grid/grid.service.ts"),__webpack_require__("./src/grid/row.directive.ts")),_column_directive__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/grid/column.directive.ts")},"./src/grid/row.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{v:()=>RowDirective});var tslib__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let RowDirective=class RowDirective{constructor(){this.baseClass=!0,this.condensed=!1,this.narrow=!1}};RowDirective.propDecorators={baseClass:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row"]}],condensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row--condensed"]},{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.Input}],narrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row--narrow"]},{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.Input}]},RowDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_1__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Directive)({selector:"[cdsRow], [ibmRow]"})],RowDirective)},"./src/patterns/filtering/single-selection.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{SingleSelection:()=>SingleSelection,__namedExportsOrder:()=>__namedExportsOrder,default:()=>single_selection_stories});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js");var core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),dist=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),table=__webpack_require__("./src/table/index.ts"),dropdown=__webpack_require__("./src/dropdown/index.ts"),grid=__webpack_require__("./src/grid/index.ts"),ui_shell=__webpack_require__("./src/ui-shell/index.ts");let SampleSingleSelection=class SampleSingleSelection{constructor(){this.model=new table.G0,this.selected=[],this.items=[{content:"All"},{content:"Vegetable"},{content:"Fruit"},{content:"Meat"}],this.dataset=[{name:"Apple",type:"Fruit"},{name:"Grape",type:"Fruit"},{name:"Eggplant",type:"Fruit"},{name:"Lettuce",type:"Vegetable"},{name:"Daikon Radish",type:"Vegetable"},{name:"Beef",type:"Meat"}]}onSelected(event){this.model.data=this.dataset.filter((data=>data.type===event.item.content||"All"===event.item.content)).map((filteredData=>[new table.r8({data:filteredData.name}),new table.r8({data:"Lorem ipsum dolor sit amet, consectetur adipiscing elit."})]))}ngOnInit(){document.querySelector(".sb-show-main")?.classList.add("full-page"),this.model.header=[new table.jr({data:"Name"}),new table.jr({data:"Description"})],this.model.data=this.dataset.map((datapoint=>[new table.r8({data:datapoint.name}),new table.r8({data:"Lorem ipsum dolor sit amet, consectetur adipiscing elit."})]))}ngOnDestroy(){document.querySelector(".sb-show-main")?.classList.remove("full-page")}};SampleSingleSelection=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-sample-single-selection",template:'\n <div cdsGrid>\n <div cdsRow class="header">\n <cds-header name="Patterns">\n <cds-hamburger></cds-hamburger>\n </cds-header>\n </div>\n <div cdsRow>\n <div cdsCol [columnNumbers]="{\'lg\': 3, \'md\': 3, \'sm\': 3}">\n <label cdsText class="dropdown-label">\n Filter by:\n <cds-dropdown\n class="filter-dropdown"\n placeholder="Type"\n inline="true"\n (selected)="onSelected($event)">\n <cds-dropdown-list [items]="items"></cds-dropdown-list>\n </cds-dropdown>\n </label>\n </div>\n </div>\n <div cdsRow>\n <div cdsCol [columnNumbers]="{\'lg\': 12, \'md\': 12, \'sm\': 12}">\n <cds-table-container>\n <cds-table\n class="data-table"\n [model]="model"\n size="lg"\n [showSelectionColumn]="false">\n <ng-content></ng-content>\n </cds-table>\n </cds-table-container>\n </div>\n </div>\n </div>\n ',styles:["\n\t\t.header {\n\t\t\tmargin-bottom: 80px;\n\t\t}\n\n\t\t.dropdown-label {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tflex-direction: row;\n\t\t}\n\n\t\t.data-table {\n\t\t\twidth: 100%;\n\t\t}\n\n\t\t.filter-dropdown {\n\t\t\tflex-grow: 1;\n\t\t\tmargin-left: 20px;\n\t\t}\n\t"]})],SampleSingleSelection);const single_selection_stories={title:"Pattern/Filtering",decorators:[(0,dist.moduleMetadata)({declarations:[SampleSingleSelection],imports:[table.U$,dropdown.kW,grid.zE,ui_shell.p5]})]},SingleSelection=(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 as an example.\n --\x3e\n <app-sample-single-selection></app-sample-single-selection>\n "})).bind({});SingleSelection.parameters={...SingleSelection.parameters,docs:{...SingleSelection.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 as an example.\n --\x3e\n <app-sample-single-selection></app-sample-single-selection>\n `\n})",...SingleSelection.parameters?.docs?.source}}};const __namedExportsOrder=["SingleSelection"]}}]);
|
|
1
|
+
"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[4762],{"./src/grid/column.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{i:()=>ColumnDirective});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"),rxjs__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),_grid_service__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.service.ts");let ColumnDirective=class ColumnDirective{constructor(gridService){this.gridService=gridService,this.class="",this.columnNumbers={},this.offsets={},this.columnHang=!1,this._columnClasses=[],this.isCssGrid=!1,this.subscription=new rxjs__WEBPACK_IMPORTED_MODULE_1__.w0}get columnClasses(){return this._columnClasses.join(" ")}set columnClasses(classes){this._columnClasses=classes.split(" ")}ngOnInit(){this.gridService?this.subscription=this.gridService.gridObservable.subscribe((isCssGrid=>{this.isCssGrid=isCssGrid,this.updateColumnClasses()})):this.updateColumnClasses()}ngOnChanges(){this.updateColumnClasses()}ngOnDestroy(){this.subscription.unsubscribe()}updateColumnClasses(){try{this._columnClasses=[];const columnKeys=Object.keys(this.columnNumbers);this.isCssGrid?(this._columnClasses.push("cds--css-grid-column"),this.columnHang&&this._columnClasses.push("cds--grid-column-hang"),columnKeys.forEach((key=>{"auto"===this.columnNumbers[key]?this._columnClasses.push(`cds--${key}:col-span-auto`):"object"==typeof this.columnNumbers[key]?(this.columnNumbers[key].start&&this._columnClasses.push(`cds--${key}:col-start-${this.columnNumbers[key].start}`),this.columnNumbers[key].end&&this._columnClasses.push(`cds--${key}:col-end-${this.columnNumbers[key].end}`),this.columnNumbers[key].span&&this._columnClasses.push(`cds--${key}:col-span-${this.columnNumbers[key].span}`)):this._columnClasses.push(`cds--${key}:col-span-${this.columnNumbers[key]}`)})),Object.keys(this.offsets).forEach((key=>{this._columnClasses.push(`cds--${key}:col-start-${this.offsets[key]}`)}))):(columnKeys.length<=0&&this._columnClasses.push("cds--col"),columnKeys.forEach((key=>{"nobreak"===this.columnNumbers[key]?this._columnClasses.push(`cds--col-${key}`):this._columnClasses.push(`cds--col-${key}-${this.columnNumbers[key]}`)})),Object.keys(this.offsets).forEach((key=>{this._columnClasses.push(`cds--offset-${key}-${this.offsets[key]}`)})))}catch(err){console.error(`Malformed \`offsets\` or \`columnNumbers\`: ${err}`)}this.class&&this._columnClasses.push(this.class)}};ColumnDirective.ctorParameters=()=>[{type:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r,decorators:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Optional}]}],ColumnDirective.propDecorators={columnClasses:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class"]}],class:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],columnNumbers:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],offsets:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],columnHang:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}]},ColumnDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_3__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Directive)({selector:"[cdsCol], [ibmCol]"})],ColumnDirective)},"./src/grid/grid.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{l:()=>GridDirective});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"),rxjs__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),_grid_service__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.service.ts");let GridDirective=class GridDirective{constructor(gridService){this.gridService=gridService,this.condensed=!1,this.narrow=!1,this.fullWidth=!1,this.cssGridEnabled=!1,this.isSubgrid=!1,this.subscription=new rxjs__WEBPACK_IMPORTED_MODULE_1__.w0}set useCssGrid(enable){this.cssGridEnabled=enable,this.gridService.updateGridType(enable)}get flexGrid(){return!this.cssGridEnabled}get flexCondensed(){return!this.cssGridEnabled&&this.condensed}get flexNarrow(){return!this.cssGridEnabled&&this.narrow}get flexFullWidth(){return!this.cssGridEnabled&&this.fullWidth}get ccsGrid(){return this.cssGridEnabled&&!this.isSubgrid}get ccsCondensed(){return this.cssGridEnabled&&!this.isSubgrid&&this.condensed}get ccsNarrow(){return this.cssGridEnabled&&!this.isSubgrid&&this.narrow}get ccsFullWidth(){return this.cssGridEnabled&&!this.isSubgrid&&this.fullWidth}get subGrid(){return this.cssGridEnabled&&this.isSubgrid}get subCondensed(){return this.cssGridEnabled&&this.isSubgrid&&this.condensed}get subNarrow(){return this.cssGridEnabled&&this.isSubgrid&&this.narrow}get subFullWidth(){return this.cssGridEnabled&&this.isSubgrid&&this.fullWidth}ngOnInit(){this.subscription=this.gridService.gridObservable.subscribe((isCssGrid=>{this.cssGridEnabled=isCssGrid}))}set cssGridChildren(list){this.cssGridEnabled&&list.forEach((grid=>{grid!==this&&(grid.isSubgrid=!0)}))}ngOnDestroy(){this.subscription.unsubscribe()}};GridDirective.ctorParameters=()=>[{type:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r}],GridDirective.propDecorators={condensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],narrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],fullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],useCssGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],flexGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid"]}],flexCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--condensed"]}],flexNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--narrow"]}],flexFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--full-width"]}],ccsGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid"]}],ccsCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--condensed"]}],ccsNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--narrow"]}],ccsFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--full-width"]}],subGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid"]}],subCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--condensed"]}],subNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--narrow"]}],subFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--wide"]}],cssGridChildren:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.ContentChildren,args:[GridDirective,{descendants:!0}]}]},GridDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_3__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Directive)({selector:"[cdsGrid], [ibmGrid]",providers:[{provide:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r,deps:[[new _angular_core__WEBPACK_IMPORTED_MODULE_2__.Optional,new _angular_core__WEBPACK_IMPORTED_MODULE_2__.SkipSelf,_grid_service__WEBPACK_IMPORTED_MODULE_0__.r]],useFactory:parentService=>parentService||new _grid_service__WEBPACK_IMPORTED_MODULE_0__.r}]})],GridDirective)},"./src/grid/grid.module.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{z:()=>GridModule});var tslib__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_angular_common__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),_column_directive__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/column.directive.ts"),_row_directive__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/grid/row.directive.ts"),_grid_directive__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/grid/grid.directive.ts"),_grid_service__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/grid/grid.service.ts");let GridModule=class GridModule{};GridModule=(0,tslib__WEBPACK_IMPORTED_MODULE_4__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_5__.NgModule)({declarations:[_column_directive__WEBPACK_IMPORTED_MODULE_0__.i,_grid_directive__WEBPACK_IMPORTED_MODULE_2__.l,_row_directive__WEBPACK_IMPORTED_MODULE_1__.v],exports:[_column_directive__WEBPACK_IMPORTED_MODULE_0__.i,_grid_directive__WEBPACK_IMPORTED_MODULE_2__.l,_row_directive__WEBPACK_IMPORTED_MODULE_1__.v],providers:[_grid_service__WEBPACK_IMPORTED_MODULE_3__.r],imports:[_angular_common__WEBPACK_IMPORTED_MODULE_6__.CommonModule]})],GridModule)},"./src/grid/grid.service.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{r:()=>GridService});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"),rxjs__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/BehaviorSubject.js");let GridService=class GridService{constructor(){this.gridSubject=new rxjs__WEBPACK_IMPORTED_MODULE_0__.X(!1),this.cssGridEnabled=!1,this.gridObservable=this.gridSubject.asObservable()}updateGridType(enableCssGrid){this.cssGridEnabled!==enableCssGrid&&(this.cssGridEnabled=!0,this.gridSubject.next(enableCssGrid))}};GridService.ctorParameters=()=>[],GridService=(0,tslib__WEBPACK_IMPORTED_MODULE_1__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Injectable)()],GridService)},"./src/grid/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{iK:()=>_column_directive__WEBPACK_IMPORTED_MODULE_4__.i,lj:()=>_grid_directive__WEBPACK_IMPORTED_MODULE_1__.l,vZ:()=>_row_directive__WEBPACK_IMPORTED_MODULE_3__.v,zE:()=>_grid_module__WEBPACK_IMPORTED_MODULE_0__.z});var _grid_module__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.module.ts"),_grid_directive__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/grid/grid.directive.ts"),_row_directive__WEBPACK_IMPORTED_MODULE_3__=(__webpack_require__("./src/grid/grid.service.ts"),__webpack_require__("./src/grid/row.directive.ts")),_column_directive__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/grid/column.directive.ts")},"./src/grid/row.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{v:()=>RowDirective});var tslib__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let RowDirective=class RowDirective{constructor(){this.baseClass=!0,this.condensed=!1,this.narrow=!1}};RowDirective.propDecorators={baseClass:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row"]}],condensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row--condensed"]},{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.Input}],narrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row--narrow"]},{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.Input}]},RowDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_1__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Directive)({selector:"[cdsRow], [ibmRow]"})],RowDirective)},"./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}},"./src/patterns/filtering/multi-selection.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{MultiSelection:()=>MultiSelection,__namedExportsOrder:()=>__namedExportsOrder,default:()=>multi_selection_stories});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js");var core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),dist=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),table=__webpack_require__("./src/table/index.ts"),dropdown=__webpack_require__("./src/dropdown/index.ts"),grid=__webpack_require__("./src/grid/index.ts"),ui_shell=__webpack_require__("./src/ui-shell/index.ts");let SampleMultiSelection=class SampleMultiSelection{constructor(){this.model=new table.G0,this.items=[{content:"Vegetable"},{content:"Fruit"},{content:"Meat"}],this.dataset=[{name:"Apple",type:["Fruit"]},{name:"Grape",type:["Fruit"]},{name:"Eggplant",type:["Fruit"]},{name:"FruitVegMeat",type:["Fruit","Vegetable","Meat"]},{name:"Lettuce",type:["Vegetable"]},{name:"Daikon Radish",type:["Vegetable"]},{name:"Beef",type:["Meat"]}]}onSelected(event){const checkboxFilters=event.map((filter=>filter.content));this.model.data=this.dataset.filter((data=>checkboxFilters.every((filter=>data.type.includes(filter))))).map((filteredData=>[new table.r8({data:filteredData.name}),new table.r8({data:"Lorem ipsum dolor sit amet, consectetur adipiscing elit."})]))}ngOnInit(){document.querySelector(".sb-show-main")?.classList.add("full-page"),this.model.header=[new table.jr({data:"Name"}),new table.jr({data:"Description"})],this.model.data=this.dataset.map((datapoint=>[new table.r8({data:datapoint.name}),new table.r8({data:"Lorem ipsum dolor sit amet, consectetur adipiscing elit."})]))}ngOnDestroy(){document.querySelector(".sb-show-main")?.classList.remove("full-page")}};SampleMultiSelection=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-sample-multi-selection",template:'\n <div cdsGrid>\n <div cdsRow class="header">\n <cds-header name="Patterns">\n <cds-hamburger></cds-hamburger>\n </cds-header>\n </div>\n <div cdsRow>\n <div cdsCol [columnNumbers]="{\'lg\': 3, \'md\': 3, \'sm\': 3}">\n <label cdsText class="dropdown-label">\n Filter by:\n <cds-dropdown\n class="filter-dropdown"\n type="multi"\n placeholder="Type"\n inline="true"\n (selected)="onSelected($event)">\n <cds-dropdown-list [items]="items"></cds-dropdown-list>\n </cds-dropdown>\n </label>\n </div>\n </div>\n <div cdsRow>\n <div cdsCol [columnNumbers]="{\'lg\': 12, \'md\': 12, \'sm\': 12}">\n <cds-table-container>\n <cds-table\n class="data-table"\n [model]="model"\n size="lg"\n [showSelectionColumn]="false">\n <ng-content></ng-content>\n </cds-table>\n </cds-table-container>\n <div>\n </div>\n </div>\n ',styles:["\n\t\t.header {\n\t\t\tmargin-bottom: 80px;\n\t\t}\n\n\t\t.dropdown-label {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t}\n\n\t\t.data-table {\n\t\t\twidth: 100%;\n\t\t}\n\n\t\t.filter-dropdown {\n\t\t\tmargin-left: 20px;\n\t\t\tflex-grow: 1;\n\t\t}\n\t"]})],SampleMultiSelection);const multi_selection_stories={title:"Pattern/Filtering",decorators:[(0,dist.moduleMetadata)({declarations:[SampleMultiSelection],imports:[table.U$,dropdown.kW,grid.zE,ui_shell.p5]})]},MultiSelection=(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 as an example.\n --\x3e\n <app-sample-multi-selection></app-sample-multi-selection>\n "})).bind({});MultiSelection.parameters={...MultiSelection.parameters,docs:{...MultiSelection.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 as an example.\n --\x3e\n <app-sample-multi-selection></app-sample-multi-selection>\n `\n})",...MultiSelection.parameters?.docs?.source}}};const __namedExportsOrder=["MultiSelection"]}}]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[3314],{"./src/grid/column.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{i:()=>ColumnDirective});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"),rxjs__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),_grid_service__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.service.ts");let ColumnDirective=class ColumnDirective{constructor(gridService){this.gridService=gridService,this.class="",this.columnNumbers={},this.offsets={},this.columnHang=!1,this._columnClasses=[],this.isCssGrid=!1,this.subscription=new rxjs__WEBPACK_IMPORTED_MODULE_1__.w0}get columnClasses(){return this._columnClasses.join(" ")}set columnClasses(classes){this._columnClasses=classes.split(" ")}ngOnInit(){this.gridService?this.subscription=this.gridService.gridObservable.subscribe((isCssGrid=>{this.isCssGrid=isCssGrid,this.updateColumnClasses()})):this.updateColumnClasses()}ngOnChanges(){this.updateColumnClasses()}ngOnDestroy(){this.subscription.unsubscribe()}updateColumnClasses(){try{this._columnClasses=[];const columnKeys=Object.keys(this.columnNumbers);this.isCssGrid?(this._columnClasses.push("cds--css-grid-column"),this.columnHang&&this._columnClasses.push("cds--grid-column-hang"),columnKeys.forEach((key=>{"auto"===this.columnNumbers[key]?this._columnClasses.push(`cds--${key}:col-span-auto`):"object"==typeof this.columnNumbers[key]?(this.columnNumbers[key].start&&this._columnClasses.push(`cds--${key}:col-start-${this.columnNumbers[key].start}`),this.columnNumbers[key].end&&this._columnClasses.push(`cds--${key}:col-end-${this.columnNumbers[key].end}`),this.columnNumbers[key].span&&this._columnClasses.push(`cds--${key}:col-span-${this.columnNumbers[key].span}`)):this._columnClasses.push(`cds--${key}:col-span-${this.columnNumbers[key]}`)})),Object.keys(this.offsets).forEach((key=>{this._columnClasses.push(`cds--${key}:col-start-${this.offsets[key]}`)}))):(columnKeys.length<=0&&this._columnClasses.push("cds--col"),columnKeys.forEach((key=>{"nobreak"===this.columnNumbers[key]?this._columnClasses.push(`cds--col-${key}`):this._columnClasses.push(`cds--col-${key}-${this.columnNumbers[key]}`)})),Object.keys(this.offsets).forEach((key=>{this._columnClasses.push(`cds--offset-${key}-${this.offsets[key]}`)})))}catch(err){console.error(`Malformed \`offsets\` or \`columnNumbers\`: ${err}`)}this.class&&this._columnClasses.push(this.class)}};ColumnDirective.ctorParameters=()=>[{type:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r,decorators:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Optional}]}],ColumnDirective.propDecorators={columnClasses:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class"]}],class:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],columnNumbers:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],offsets:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],columnHang:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}]},ColumnDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_3__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Directive)({selector:"[cdsCol], [ibmCol]"})],ColumnDirective)},"./src/grid/grid.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{l:()=>GridDirective});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"),rxjs__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),_grid_service__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.service.ts");let GridDirective=class GridDirective{constructor(gridService){this.gridService=gridService,this.condensed=!1,this.narrow=!1,this.fullWidth=!1,this.cssGridEnabled=!1,this.isSubgrid=!1,this.subscription=new rxjs__WEBPACK_IMPORTED_MODULE_1__.w0}set useCssGrid(enable){this.cssGridEnabled=enable,this.gridService.updateGridType(enable)}get flexGrid(){return!this.cssGridEnabled}get flexCondensed(){return!this.cssGridEnabled&&this.condensed}get flexNarrow(){return!this.cssGridEnabled&&this.narrow}get flexFullWidth(){return!this.cssGridEnabled&&this.fullWidth}get ccsGrid(){return this.cssGridEnabled&&!this.isSubgrid}get ccsCondensed(){return this.cssGridEnabled&&!this.isSubgrid&&this.condensed}get ccsNarrow(){return this.cssGridEnabled&&!this.isSubgrid&&this.narrow}get ccsFullWidth(){return this.cssGridEnabled&&!this.isSubgrid&&this.fullWidth}get subGrid(){return this.cssGridEnabled&&this.isSubgrid}get subCondensed(){return this.cssGridEnabled&&this.isSubgrid&&this.condensed}get subNarrow(){return this.cssGridEnabled&&this.isSubgrid&&this.narrow}get subFullWidth(){return this.cssGridEnabled&&this.isSubgrid&&this.fullWidth}ngOnInit(){this.subscription=this.gridService.gridObservable.subscribe((isCssGrid=>{this.cssGridEnabled=isCssGrid}))}set cssGridChildren(list){this.cssGridEnabled&&list.forEach((grid=>{grid!==this&&(grid.isSubgrid=!0)}))}ngOnDestroy(){this.subscription.unsubscribe()}};GridDirective.ctorParameters=()=>[{type:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r}],GridDirective.propDecorators={condensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],narrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],fullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],useCssGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],flexGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid"]}],flexCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--condensed"]}],flexNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--narrow"]}],flexFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--full-width"]}],ccsGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid"]}],ccsCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--condensed"]}],ccsNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--narrow"]}],ccsFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--full-width"]}],subGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid"]}],subCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--condensed"]}],subNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--narrow"]}],subFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--wide"]}],cssGridChildren:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.ContentChildren,args:[GridDirective,{descendants:!0}]}]},GridDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_3__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Directive)({selector:"[cdsGrid], [ibmGrid]",providers:[{provide:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r,deps:[[new _angular_core__WEBPACK_IMPORTED_MODULE_2__.Optional,new _angular_core__WEBPACK_IMPORTED_MODULE_2__.SkipSelf,_grid_service__WEBPACK_IMPORTED_MODULE_0__.r]],useFactory:parentService=>parentService||new _grid_service__WEBPACK_IMPORTED_MODULE_0__.r}]})],GridDirective)},"./src/grid/grid.module.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{z:()=>GridModule});var tslib__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_angular_common__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),_column_directive__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/column.directive.ts"),_row_directive__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/grid/row.directive.ts"),_grid_directive__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/grid/grid.directive.ts"),_grid_service__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/grid/grid.service.ts");let GridModule=class GridModule{};GridModule=(0,tslib__WEBPACK_IMPORTED_MODULE_4__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_5__.NgModule)({declarations:[_column_directive__WEBPACK_IMPORTED_MODULE_0__.i,_grid_directive__WEBPACK_IMPORTED_MODULE_2__.l,_row_directive__WEBPACK_IMPORTED_MODULE_1__.v],exports:[_column_directive__WEBPACK_IMPORTED_MODULE_0__.i,_grid_directive__WEBPACK_IMPORTED_MODULE_2__.l,_row_directive__WEBPACK_IMPORTED_MODULE_1__.v],providers:[_grid_service__WEBPACK_IMPORTED_MODULE_3__.r],imports:[_angular_common__WEBPACK_IMPORTED_MODULE_6__.CommonModule]})],GridModule)},"./src/grid/grid.service.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{r:()=>GridService});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"),rxjs__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/BehaviorSubject.js");let GridService=class GridService{constructor(){this.gridSubject=new rxjs__WEBPACK_IMPORTED_MODULE_0__.X(!1),this.cssGridEnabled=!1,this.gridObservable=this.gridSubject.asObservable()}updateGridType(enableCssGrid){this.cssGridEnabled!==enableCssGrid&&(this.cssGridEnabled=!0,this.gridSubject.next(enableCssGrid))}};GridService.ctorParameters=()=>[],GridService=(0,tslib__WEBPACK_IMPORTED_MODULE_1__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Injectable)()],GridService)},"./src/grid/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{iK:()=>_column_directive__WEBPACK_IMPORTED_MODULE_4__.i,lj:()=>_grid_directive__WEBPACK_IMPORTED_MODULE_1__.l,vZ:()=>_row_directive__WEBPACK_IMPORTED_MODULE_3__.v,zE:()=>_grid_module__WEBPACK_IMPORTED_MODULE_0__.z});var _grid_module__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.module.ts"),_grid_directive__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/grid/grid.directive.ts"),_row_directive__WEBPACK_IMPORTED_MODULE_3__=(__webpack_require__("./src/grid/grid.service.ts"),__webpack_require__("./src/grid/row.directive.ts")),_column_directive__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/grid/column.directive.ts")},"./src/grid/row.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{v:()=>RowDirective});var tslib__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let RowDirective=class RowDirective{constructor(){this.baseClass=!0,this.condensed=!1,this.narrow=!1}};RowDirective.propDecorators={baseClass:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row"]}],condensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row--condensed"]},{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.Input}],narrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row--narrow"]},{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.Input}]},RowDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_1__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Directive)({selector:"[cdsRow], [ibmRow]"})],RowDirective)},"./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.ariaLabel="Structured list section",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}],ariaLabel:[{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[attr.aria-label]="ariaLabel"\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/tag/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Vp:()=>Tag,Wh:()=>TagModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let Tag=class Tag{constructor(){this.type="gray",this.size="md",this.class="",this.skeleton=!1}get attrClass(){const skeletonClass=this.skeleton?"cds--skeleton":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`;return`cds--tag cds--tag--${this.type} ${sizeClass} ${skeletonClass} ${this.class}`}};Tag.propDecorators={type:[{type:core.Input}],size:[{type:core.Input}],class:[{type:core.Input}],skeleton:[{type:core.Input}],decorator:[{type:core.Input}],attrClass:[{type:core.HostBinding,args:["attr.class"]}]},Tag=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag, ibm-tag",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span class="cds--tag__label">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t\t<ng-container *ngIf="decorator">\n\t\t\t\t<div class="cds--tag__decorator">\n\t\t\t\t\t<ng-template [ngTemplateOutlet]="decorator"></ng-template>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t</ng-container>\n\t'})],Tag);let TagFilter=class TagFilter extends Tag{constructor(){super(...arguments),this.closeButtonLabel="Clear Filter",this.disabled=!1,this.close=new core.EventEmitter,this.click=new core.EventEmitter}onClick(event){event.stopImmediatePropagation(),this.disabled||this.click.emit({action:"click"})}onClose(event){event.stopImmediatePropagation(),this.click.emit({action:"close"}),this.close.emit()}get attrClass(){const disabledClass=this.disabled?"cds--tag--disabled":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`,skeletonClass=this.skeleton?"cds--skeleton":"";return`cds--tag cds--tag--filter cds--tag--${this.type} ${disabledClass} ${sizeClass} ${skeletonClass} ${this.class}`}get attrAriaLabel(){return`${this.title||""} ${this.closeButtonLabel}`.trim()}};TagFilter.propDecorators={closeButtonLabel:[{type:core.Input}],disabled:[{type:core.Input}],title:[{type:core.Input}],close:[{type:core.Output}],click:[{type:core.Output}],attrClass:[{type:core.HostBinding,args:["attr.class"]}],attrAriaLabel:[{type:core.HostBinding,args:["attr.aria-label"]}]},TagFilter=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag-filter, ibm-tag-filter",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span\n\t\t\t\tclass="cds--tag__label"\n\t\t\t\t[attr.title]="title ? title : null"\n\t\t\t\t(click)="onClick($event)">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t\t<ng-container *ngIf="decorator">\n\t\t\t\t<div class="cds--tag__decorator">\n\t\t\t\t\t<ng-template [ngTemplateOutlet]="decorator"></ng-template>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<button\n\t\t\t\tclass="cds--tag__close-icon"\n\t\t\t\t(click)="onClose($event)"\n\t\t\t\t[disabled]="disabled"\n\t\t\t\t[title]="closeButtonLabel">\n\t\t\t\t<span class="cds--visually-hidden">{{closeButtonLabel}}</span>\n\t\t\t\t<svg cdsIcon="close" size="16"></svg>\n\t\t\t</button>\n\t\t</ng-container>\n\t'})],TagFilter);let TagIconDirective=class TagIconDirective{constructor(){this.tagIcon=!0}};TagIconDirective.propDecorators={tagIcon:[{type:core.HostBinding,args:["class.cds--tag__custom-icon"]}]},TagIconDirective=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsTagIcon], [ibmTagIcon]"})],TagIconDirective);let TagSelectableComponent=class TagSelectableComponent{constructor(){this.role="button",this.buttonType="button",this.tabIndex=0,this.size="md",this.skeleton=!1,this.disabled=!1,this.class="",this.selected=!1,this.selectedChange=new core.EventEmitter}get ariaPressed(){return this.selected}onClick(){this.selected=!this.selected,this.selectedChange.emit(this.selected)}get attrClass(){const disabledClass=this.disabled?"cds--tag--disabled":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`,skeletonClass=this.skeleton?"cds--skeleton":"";return`cds--tag cds--tag--selectable ${this.selected?"cds--tag--selectable-selected":""} ${disabledClass} ${sizeClass} ${skeletonClass} ${this.class}`}};TagSelectableComponent.propDecorators={role:[{type:core.HostBinding,args:["attr.role"]}],buttonType:[{type:core.HostBinding,args:["attr.type"]}],tabIndex:[{type:core.HostBinding,args:["attr.tabindex"]}],ariaPressed:[{type:core.HostBinding,args:["attr.aria-pressed"]}],size:[{type:core.Input}],skeleton:[{type:core.Input}],disabled:[{type:core.Input}],class:[{type:core.Input}],selected:[{type:core.Input}],selectedChange:[{type:core.Output}],onClick:[{type:core.HostListener,args:["click"]}],attrClass:[{type:core.HostBinding,args:["attr.class"]}]},TagSelectableComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag-selectable, ibm-tag-selectable",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span class="cds--tag__label">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t</ng-container>\n\t',changeDetection:core.ChangeDetectionStrategy.OnPush})],TagSelectableComponent);let TagOperationalComponent=class TagOperationalComponent extends Tag{constructor(){super(...arguments),this.role="button",this.buttonType="button",this.tabIndex=0,this.disabled=!1}get attrClass(){const disabledClass=this.disabled?"cds--tag--disabled":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`,skeletonClass=this.skeleton?"cds--skeleton":"";return`cds--tag cds--tag--operational cds--tag--${this.type} ${disabledClass} ${sizeClass} ${skeletonClass} ${this.class}`}};TagOperationalComponent.propDecorators={role:[{type:core.HostBinding,args:["attr.role"]}],buttonType:[{type:core.HostBinding,args:["attr.type"]}],tabIndex:[{type:core.HostBinding,args:["attr.tabindex"]}],disabled:[{type:core.Input}],attrClass:[{type:core.HostBinding,args:["attr.class"]}]},TagOperationalComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag-operational, ibm-tag-operational",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span class="cds--tag__label">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t</ng-container>\n\t',changeDetection:core.ChangeDetectionStrategy.OnPush})],TagOperationalComponent);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),icon=__webpack_require__("./src/icon/index.ts");let TagModule=class TagModule{};TagModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Tag,TagFilter,TagIconDirective,TagSelectableComponent,TagOperationalComponent],exports:[Tag,TagFilter,TagIconDirective,TagSelectableComponent,TagOperationalComponent],imports:[common.CommonModule,icon.QX]})],TagModule)},"./src/patterns/filtering/multiple-categories.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{MultipleCategories:()=>MultipleCategories,__namedExportsOrder:()=>__namedExportsOrder,default:()=>multiple_categories_stories});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js");var core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),dist=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),table=__webpack_require__("./src/table/index.ts"),dropdown=__webpack_require__("./src/dropdown/index.ts"),structured_list=__webpack_require__("./src/structured-list/index.ts"),grid=__webpack_require__("./src/grid/index.ts"),src_radio=__webpack_require__("./src/radio/index.ts"),src_checkbox=__webpack_require__("./src/checkbox/index.ts"),src_button=__webpack_require__("./src/button/index.ts"),tag=__webpack_require__("./src/tag/index.ts"),ui_shell=__webpack_require__("./src/ui-shell/index.ts");let SampleMultiCategories=class SampleMultiCategories{constructor(){this.model=new table.G0,this.checkBoxFilters=[],this.radioFilter=null,this.dataset=[{name:"Apple",type:["Fruit"],color:"Red"},{name:"Grape",type:["Fruit"],color:"Purple"},{name:"Eggplant",type:["Fruit"],color:"Purple"},{name:"FruitVegMeat",type:["Fruit","Vegetable","Meat"],color:"White"},{name:"Lettuce",type:["Vegetable"],color:"Green"},{name:"Daikon Radish",type:["Vegetable"],color:"White"},{name:"Beef",type:["Meat"],color:"Red"}],this.radios=[{color:"Red",checked:!1},{color:"Purple",checked:!1},{color:"Green",checked:!1},{color:"White",checked:!1}],this.checkboxList=[{value:"Fruit",checked:!1},{value:"Vegetable",checked:!1},{value:"Meat",checked:!1}]}onCheckboxChange(event){event.checked?this.checkBoxFilters.push(event.source.value):this.checkBoxFilters.splice(this.checkBoxFilters.indexOf(event.source.value),1),this.applyFilters()}onRadioChange(event){this.radioFilter=event.value,this.applyFilters()}resetFilters(){this.resetCheckboxList(),this.resetRadios()}resetCheckboxList(){this.checkBoxFilters=[],this.checkboxList=this.checkboxList.map((obj=>({value:obj.value,checked:!1}))),this.applyFilters()}resetRadios(){this.radioFilter=null,this.radios=this.radios.map((obj=>({color:obj.color,checked:!1}))),this.applyFilters()}applyFilters(){this.model.data=this.dataset.filter((data=>this.checkBoxFilters.every((filter=>data.type.includes(filter)))&&(data.color===this.radioFilter||!this.radioFilter))).map((filteredData=>[new table.r8({data:filteredData.name}),new table.r8({data:"Lorem ipsum dolor sit amet, consectetur adipiscing elit."})]))}ngOnInit(){document.querySelector(".sb-show-main")?.classList.add("full-page"),this.model.header=[new table.jr({data:"Name"}),new table.jr({data:"Description"})],this.model.data=this.dataset.map((datapoint=>[new table.r8({data:datapoint.name}),new table.r8({data:"Lorem ipsum dolor sit amet, consectetur adipiscing elit."})]))}ngOnDestroy(){document.querySelector(".sb-show-main")?.classList.remove("full-page")}};SampleMultiCategories=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-sample-multi-categories",template:'\n <div cdsGrid>\n <div cdsRow class="header">\n <cds-header name="Patterns">\n <cds-hamburger></cds-hamburger>\n </cds-header>\n </div>\n <div cdsRow>\n <div cdsCol [columnNumbers]="{\'lg\': 2, \'md\': 2, \'sm\': 1}" class="multi-selection">\n <button cdsButton (click)="resetFilters()" class="reset-button">Reset Filters</button>\n <fieldset class="cds--fieldset">\n <legend class="cds--label">Radio button label</legend>\n <cds-radio-group\n aria-label="radiogroup"\n orientation="vertical"\n labelPlacement="right"\n [(ngModel)]="radio"\n (change)="onRadioChange($event)">\n <cds-radio *ngFor="let radio of radios"\n [value]="radio.color"\n [disabled]="radio.disabled">\n {{radio.color}}\n </cds-radio>\n </cds-radio-group>\n </fieldset>\n <fieldset class="cds--fieldset">\n <div cdsRow>\n <div cdsCol [columnNumbers]="{\'lg\': 2, \'md\': 2, \'sm\': 1}">\n <legend class="cds--label">Type</legend>\n </div>\n <div cdsCol [columnNumbers]="{\'lg\': 2, \'md\': 2, \'sm\': 1}">\n <cds-tag-filter\n *ngIf="checkBoxFilters.size > 0"\n (close)="resetCheckboxList()">\n {{checkBoxFilters.size}}\n </cds-tag-filter>\n </div>\n </div>\n <cds-checkbox\n *ngFor="let listItem of checkboxList"\n [hideLabel]="hideLabel"\n [checked]="listItem.checked"\n [value]="listItem.value"\n (change)="onCheckboxChange($event)">\n {{ listItem.value }}\n </cds-checkbox>\n </fieldset>\n </div>\n <div cdsCol [columnNumbers]="{\'lg\': 10, \'md\': 10, \'sm\': 3}" class="data-table">\n <cds-table-container>\n <cds-table\n class="data-table"\n [model]="model"\n size="lg"\n [showSelectionColumn]="false">\n <ng-content></ng-content>\n </cds-table>\n </cds-table-container>\n </div>\n </div>\n </div>\n ',styles:["\n\t\t.header {\n\t\t\tmargin-bottom: 80px;\n\t\t}\n\n\t\t.reset-button {\n\t\t\tmargin-bottom: 20px;\n\t\t}\n\n\t\t.data-table {\n\t\t\twidth: 100%;\n\t\t}\n\t"]})],SampleMultiCategories);const multiple_categories_stories={title:"Pattern/Filtering",decorators:[(0,dist.moduleMetadata)({declarations:[SampleMultiCategories],imports:[table.U$,dropdown.kW,grid.zE,structured_list.ic,src_radio.dU,src_checkbox.nD,src_button.hJ,tag.Wh,ui_shell.p5]})]},MultipleCategories=(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 as an example.\n --\x3e\n <app-sample-multi-categories></app-sample-multi-categories>\n "})).bind({});MultipleCategories.parameters={...MultipleCategories.parameters,docs:{...MultipleCategories.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 as an example.\n --\x3e\n <app-sample-multi-categories></app-sample-multi-categories>\n `\n})",...MultipleCategories.parameters?.docs?.source}}};const __namedExportsOrder=["MultipleCategories"]}}]);
|
|
1
|
+
"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[3314],{"./src/grid/column.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{i:()=>ColumnDirective});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"),rxjs__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),_grid_service__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.service.ts");let ColumnDirective=class ColumnDirective{constructor(gridService){this.gridService=gridService,this.class="",this.columnNumbers={},this.offsets={},this.columnHang=!1,this._columnClasses=[],this.isCssGrid=!1,this.subscription=new rxjs__WEBPACK_IMPORTED_MODULE_1__.w0}get columnClasses(){return this._columnClasses.join(" ")}set columnClasses(classes){this._columnClasses=classes.split(" ")}ngOnInit(){this.gridService?this.subscription=this.gridService.gridObservable.subscribe((isCssGrid=>{this.isCssGrid=isCssGrid,this.updateColumnClasses()})):this.updateColumnClasses()}ngOnChanges(){this.updateColumnClasses()}ngOnDestroy(){this.subscription.unsubscribe()}updateColumnClasses(){try{this._columnClasses=[];const columnKeys=Object.keys(this.columnNumbers);this.isCssGrid?(this._columnClasses.push("cds--css-grid-column"),this.columnHang&&this._columnClasses.push("cds--grid-column-hang"),columnKeys.forEach((key=>{"auto"===this.columnNumbers[key]?this._columnClasses.push(`cds--${key}:col-span-auto`):"object"==typeof this.columnNumbers[key]?(this.columnNumbers[key].start&&this._columnClasses.push(`cds--${key}:col-start-${this.columnNumbers[key].start}`),this.columnNumbers[key].end&&this._columnClasses.push(`cds--${key}:col-end-${this.columnNumbers[key].end}`),this.columnNumbers[key].span&&this._columnClasses.push(`cds--${key}:col-span-${this.columnNumbers[key].span}`)):this._columnClasses.push(`cds--${key}:col-span-${this.columnNumbers[key]}`)})),Object.keys(this.offsets).forEach((key=>{this._columnClasses.push(`cds--${key}:col-start-${this.offsets[key]}`)}))):(columnKeys.length<=0&&this._columnClasses.push("cds--col"),columnKeys.forEach((key=>{"nobreak"===this.columnNumbers[key]?this._columnClasses.push(`cds--col-${key}`):this._columnClasses.push(`cds--col-${key}-${this.columnNumbers[key]}`)})),Object.keys(this.offsets).forEach((key=>{this._columnClasses.push(`cds--offset-${key}-${this.offsets[key]}`)})))}catch(err){console.error(`Malformed \`offsets\` or \`columnNumbers\`: ${err}`)}this.class&&this._columnClasses.push(this.class)}};ColumnDirective.ctorParameters=()=>[{type:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r,decorators:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Optional}]}],ColumnDirective.propDecorators={columnClasses:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class"]}],class:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],columnNumbers:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],offsets:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],columnHang:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}]},ColumnDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_3__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Directive)({selector:"[cdsCol], [ibmCol]"})],ColumnDirective)},"./src/grid/grid.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{l:()=>GridDirective});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"),rxjs__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),_grid_service__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.service.ts");let GridDirective=class GridDirective{constructor(gridService){this.gridService=gridService,this.condensed=!1,this.narrow=!1,this.fullWidth=!1,this.cssGridEnabled=!1,this.isSubgrid=!1,this.subscription=new rxjs__WEBPACK_IMPORTED_MODULE_1__.w0}set useCssGrid(enable){this.cssGridEnabled=enable,this.gridService.updateGridType(enable)}get flexGrid(){return!this.cssGridEnabled}get flexCondensed(){return!this.cssGridEnabled&&this.condensed}get flexNarrow(){return!this.cssGridEnabled&&this.narrow}get flexFullWidth(){return!this.cssGridEnabled&&this.fullWidth}get ccsGrid(){return this.cssGridEnabled&&!this.isSubgrid}get ccsCondensed(){return this.cssGridEnabled&&!this.isSubgrid&&this.condensed}get ccsNarrow(){return this.cssGridEnabled&&!this.isSubgrid&&this.narrow}get ccsFullWidth(){return this.cssGridEnabled&&!this.isSubgrid&&this.fullWidth}get subGrid(){return this.cssGridEnabled&&this.isSubgrid}get subCondensed(){return this.cssGridEnabled&&this.isSubgrid&&this.condensed}get subNarrow(){return this.cssGridEnabled&&this.isSubgrid&&this.narrow}get subFullWidth(){return this.cssGridEnabled&&this.isSubgrid&&this.fullWidth}ngOnInit(){this.subscription=this.gridService.gridObservable.subscribe((isCssGrid=>{this.cssGridEnabled=isCssGrid}))}set cssGridChildren(list){this.cssGridEnabled&&list.forEach((grid=>{grid!==this&&(grid.isSubgrid=!0)}))}ngOnDestroy(){this.subscription.unsubscribe()}};GridDirective.ctorParameters=()=>[{type:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r}],GridDirective.propDecorators={condensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],narrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],fullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],useCssGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],flexGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid"]}],flexCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--condensed"]}],flexNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--narrow"]}],flexFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--grid--full-width"]}],ccsGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid"]}],ccsCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--condensed"]}],ccsNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--narrow"]}],ccsFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--css-grid--full-width"]}],subGrid:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid"]}],subCondensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--condensed"]}],subNarrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--narrow"]}],subFullWidth:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.HostBinding,args:["class.cds--subgrid--wide"]}],cssGridChildren:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.ContentChildren,args:[GridDirective,{descendants:!0}]}]},GridDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_3__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Directive)({selector:"[cdsGrid], [ibmGrid]",providers:[{provide:_grid_service__WEBPACK_IMPORTED_MODULE_0__.r,deps:[[new _angular_core__WEBPACK_IMPORTED_MODULE_2__.Optional,new _angular_core__WEBPACK_IMPORTED_MODULE_2__.SkipSelf,_grid_service__WEBPACK_IMPORTED_MODULE_0__.r]],useFactory:parentService=>parentService||new _grid_service__WEBPACK_IMPORTED_MODULE_0__.r}]})],GridDirective)},"./src/grid/grid.module.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{z:()=>GridModule});var tslib__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_angular_common__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),_column_directive__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/column.directive.ts"),_row_directive__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/grid/row.directive.ts"),_grid_directive__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/grid/grid.directive.ts"),_grid_service__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/grid/grid.service.ts");let GridModule=class GridModule{};GridModule=(0,tslib__WEBPACK_IMPORTED_MODULE_4__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_5__.NgModule)({declarations:[_column_directive__WEBPACK_IMPORTED_MODULE_0__.i,_grid_directive__WEBPACK_IMPORTED_MODULE_2__.l,_row_directive__WEBPACK_IMPORTED_MODULE_1__.v],exports:[_column_directive__WEBPACK_IMPORTED_MODULE_0__.i,_grid_directive__WEBPACK_IMPORTED_MODULE_2__.l,_row_directive__WEBPACK_IMPORTED_MODULE_1__.v],providers:[_grid_service__WEBPACK_IMPORTED_MODULE_3__.r],imports:[_angular_common__WEBPACK_IMPORTED_MODULE_6__.CommonModule]})],GridModule)},"./src/grid/grid.service.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{r:()=>GridService});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"),rxjs__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/BehaviorSubject.js");let GridService=class GridService{constructor(){this.gridSubject=new rxjs__WEBPACK_IMPORTED_MODULE_0__.X(!1),this.cssGridEnabled=!1,this.gridObservable=this.gridSubject.asObservable()}updateGridType(enableCssGrid){this.cssGridEnabled!==enableCssGrid&&(this.cssGridEnabled=!0,this.gridSubject.next(enableCssGrid))}};GridService.ctorParameters=()=>[],GridService=(0,tslib__WEBPACK_IMPORTED_MODULE_1__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Injectable)()],GridService)},"./src/grid/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{iK:()=>_column_directive__WEBPACK_IMPORTED_MODULE_4__.i,lj:()=>_grid_directive__WEBPACK_IMPORTED_MODULE_1__.l,vZ:()=>_row_directive__WEBPACK_IMPORTED_MODULE_3__.v,zE:()=>_grid_module__WEBPACK_IMPORTED_MODULE_0__.z});var _grid_module__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/grid/grid.module.ts"),_grid_directive__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/grid/grid.directive.ts"),_row_directive__WEBPACK_IMPORTED_MODULE_3__=(__webpack_require__("./src/grid/grid.service.ts"),__webpack_require__("./src/grid/row.directive.ts")),_column_directive__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/grid/column.directive.ts")},"./src/grid/row.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{v:()=>RowDirective});var tslib__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let RowDirective=class RowDirective{constructor(){this.baseClass=!0,this.condensed=!1,this.narrow=!1}};RowDirective.propDecorators={baseClass:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row"]}],condensed:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row--condensed"]},{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.Input}],narrow:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.HostBinding,args:["class.cds--row--narrow"]},{type:_angular_core__WEBPACK_IMPORTED_MODULE_0__.Input}]},RowDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_1__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Directive)({selector:"[cdsRow], [ibmRow]"})],RowDirective)},"./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.ariaLabel="Structured list section",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}],ariaLabel:[{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[attr.aria-label]="ariaLabel"\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/tag/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Vp:()=>Tag,Wh:()=>TagModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let Tag=class Tag{constructor(){this.type="gray",this.size="md",this.class="",this.skeleton=!1}get attrClass(){const skeletonClass=this.skeleton?"cds--skeleton":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`;return`cds--tag cds--tag--${this.type} ${sizeClass} ${skeletonClass} ${this.class}`}};Tag.propDecorators={type:[{type:core.Input}],size:[{type:core.Input}],class:[{type:core.Input}],skeleton:[{type:core.Input}],decorator:[{type:core.Input}],attrClass:[{type:core.HostBinding,args:["attr.class"]}]},Tag=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag, ibm-tag",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span class="cds--tag__label">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t\t<ng-container *ngIf="decorator">\n\t\t\t\t<div class="cds--tag__decorator">\n\t\t\t\t\t<ng-template [ngTemplateOutlet]="decorator"></ng-template>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t</ng-container>\n\t'})],Tag);let TagFilter=class TagFilter extends Tag{constructor(){super(...arguments),this.closeButtonLabel="Clear Filter",this.disabled=!1,this.close=new core.EventEmitter,this.click=new core.EventEmitter}onClick(event){event.stopImmediatePropagation(),this.disabled||this.click.emit({action:"click"})}onClose(event){event.stopImmediatePropagation(),this.click.emit({action:"close"}),this.close.emit()}get attrClass(){const disabledClass=this.disabled?"cds--tag--disabled":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`,skeletonClass=this.skeleton?"cds--skeleton":"";return`cds--tag cds--tag--filter cds--tag--${this.type} ${disabledClass} ${sizeClass} ${skeletonClass} ${this.class}`}get attrAriaLabel(){return`${this.title||""} ${this.closeButtonLabel}`.trim()}};TagFilter.propDecorators={closeButtonLabel:[{type:core.Input}],disabled:[{type:core.Input}],title:[{type:core.Input}],close:[{type:core.Output}],click:[{type:core.Output}],attrClass:[{type:core.HostBinding,args:["attr.class"]}],attrAriaLabel:[{type:core.HostBinding,args:["attr.aria-label"]}]},TagFilter=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag-filter, ibm-tag-filter",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span\n\t\t\t\tclass="cds--tag__label"\n\t\t\t\t[attr.title]="title ? title : null"\n\t\t\t\t(click)="onClick($event)">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t\t<ng-container *ngIf="decorator">\n\t\t\t\t<div class="cds--tag__decorator">\n\t\t\t\t\t<ng-template [ngTemplateOutlet]="decorator"></ng-template>\n\t\t\t\t</div>\n\t\t\t</ng-container>\n\t\t\t<button\n\t\t\t\tclass="cds--tag__close-icon"\n\t\t\t\t(click)="onClose($event)"\n\t\t\t\t[disabled]="disabled"\n\t\t\t\t[title]="closeButtonLabel">\n\t\t\t\t<span class="cds--visually-hidden">{{closeButtonLabel}}</span>\n\t\t\t\t<svg cdsIcon="close" size="16"></svg>\n\t\t\t</button>\n\t\t</ng-container>\n\t'})],TagFilter);let TagIconDirective=class TagIconDirective{constructor(){this.tagIcon=!0}};TagIconDirective.propDecorators={tagIcon:[{type:core.HostBinding,args:["class.cds--tag__custom-icon"]}]},TagIconDirective=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsTagIcon], [ibmTagIcon]"})],TagIconDirective);let TagSelectableComponent=class TagSelectableComponent{constructor(){this.role="button",this.buttonType="button",this.tabIndex=0,this.size="md",this.skeleton=!1,this.disabled=!1,this.class="",this.selected=!1,this.selectedChange=new core.EventEmitter}get ariaPressed(){return this.selected}onClick(){this.selected=!this.selected,this.selectedChange.emit(this.selected)}get attrClass(){const disabledClass=this.disabled?"cds--tag--disabled":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`,skeletonClass=this.skeleton?"cds--skeleton":"";return`cds--tag cds--tag--selectable ${this.selected?"cds--tag--selectable-selected":""} ${disabledClass} ${sizeClass} ${skeletonClass} ${this.class}`}};TagSelectableComponent.propDecorators={role:[{type:core.HostBinding,args:["attr.role"]}],buttonType:[{type:core.HostBinding,args:["attr.type"]}],tabIndex:[{type:core.HostBinding,args:["attr.tabindex"]}],ariaPressed:[{type:core.HostBinding,args:["attr.aria-pressed"]}],size:[{type:core.Input}],skeleton:[{type:core.Input}],disabled:[{type:core.Input}],class:[{type:core.Input}],selected:[{type:core.Input}],selectedChange:[{type:core.Output}],onClick:[{type:core.HostListener,args:["click"]}],attrClass:[{type:core.HostBinding,args:["attr.class"]}]},TagSelectableComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag-selectable, ibm-tag-selectable",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span class="cds--tag__label">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t</ng-container>\n\t',changeDetection:core.ChangeDetectionStrategy.OnPush})],TagSelectableComponent);let TagOperationalComponent=class TagOperationalComponent extends Tag{constructor(){super(...arguments),this.role="button",this.buttonType="button",this.tabIndex=0,this.disabled=!1}get attrClass(){const disabledClass=this.disabled?"cds--tag--disabled":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`,skeletonClass=this.skeleton?"cds--skeleton":"";return`cds--tag cds--tag--operational cds--tag--${this.type} ${disabledClass} ${sizeClass} ${skeletonClass} ${this.class}`}};TagOperationalComponent.propDecorators={role:[{type:core.HostBinding,args:["attr.role"]}],buttonType:[{type:core.HostBinding,args:["attr.type"]}],tabIndex:[{type:core.HostBinding,args:["attr.tabindex"]}],disabled:[{type:core.Input}],attrClass:[{type:core.HostBinding,args:["attr.class"]}]},TagOperationalComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag-operational, ibm-tag-operational",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span class="cds--tag__label">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t</ng-container>\n\t',changeDetection:core.ChangeDetectionStrategy.OnPush})],TagOperationalComponent);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),icon=__webpack_require__("./src/icon/index.ts");let TagModule=class TagModule{};TagModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Tag,TagFilter,TagIconDirective,TagSelectableComponent,TagOperationalComponent],exports:[Tag,TagFilter,TagIconDirective,TagSelectableComponent,TagOperationalComponent],imports:[common.CommonModule,icon.QX]})],TagModule)},"./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}},"./src/patterns/filtering/multiple-categories.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{MultipleCategories:()=>MultipleCategories,__namedExportsOrder:()=>__namedExportsOrder,default:()=>multiple_categories_stories});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js");var core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),dist=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),table=__webpack_require__("./src/table/index.ts"),dropdown=__webpack_require__("./src/dropdown/index.ts"),structured_list=__webpack_require__("./src/structured-list/index.ts"),grid=__webpack_require__("./src/grid/index.ts"),src_radio=__webpack_require__("./src/radio/index.ts"),src_checkbox=__webpack_require__("./src/checkbox/index.ts"),src_button=__webpack_require__("./src/button/index.ts"),tag=__webpack_require__("./src/tag/index.ts"),ui_shell=__webpack_require__("./src/ui-shell/index.ts");let SampleMultiCategories=class SampleMultiCategories{constructor(){this.model=new table.G0,this.checkBoxFilters=[],this.radioFilter=null,this.dataset=[{name:"Apple",type:["Fruit"],color:"Red"},{name:"Grape",type:["Fruit"],color:"Purple"},{name:"Eggplant",type:["Fruit"],color:"Purple"},{name:"FruitVegMeat",type:["Fruit","Vegetable","Meat"],color:"White"},{name:"Lettuce",type:["Vegetable"],color:"Green"},{name:"Daikon Radish",type:["Vegetable"],color:"White"},{name:"Beef",type:["Meat"],color:"Red"}],this.radios=[{color:"Red",checked:!1},{color:"Purple",checked:!1},{color:"Green",checked:!1},{color:"White",checked:!1}],this.checkboxList=[{value:"Fruit",checked:!1},{value:"Vegetable",checked:!1},{value:"Meat",checked:!1}]}onCheckboxChange(event){event.checked?this.checkBoxFilters.push(event.source.value):this.checkBoxFilters.splice(this.checkBoxFilters.indexOf(event.source.value),1),this.applyFilters()}onRadioChange(event){this.radioFilter=event.value,this.applyFilters()}resetFilters(){this.resetCheckboxList(),this.resetRadios()}resetCheckboxList(){this.checkBoxFilters=[],this.checkboxList=this.checkboxList.map((obj=>({value:obj.value,checked:!1}))),this.applyFilters()}resetRadios(){this.radioFilter=null,this.radios=this.radios.map((obj=>({color:obj.color,checked:!1}))),this.applyFilters()}applyFilters(){this.model.data=this.dataset.filter((data=>this.checkBoxFilters.every((filter=>data.type.includes(filter)))&&(data.color===this.radioFilter||!this.radioFilter))).map((filteredData=>[new table.r8({data:filteredData.name}),new table.r8({data:"Lorem ipsum dolor sit amet, consectetur adipiscing elit."})]))}ngOnInit(){document.querySelector(".sb-show-main")?.classList.add("full-page"),this.model.header=[new table.jr({data:"Name"}),new table.jr({data:"Description"})],this.model.data=this.dataset.map((datapoint=>[new table.r8({data:datapoint.name}),new table.r8({data:"Lorem ipsum dolor sit amet, consectetur adipiscing elit."})]))}ngOnDestroy(){document.querySelector(".sb-show-main")?.classList.remove("full-page")}};SampleMultiCategories=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-sample-multi-categories",template:'\n <div cdsGrid>\n <div cdsRow class="header">\n <cds-header name="Patterns">\n <cds-hamburger></cds-hamburger>\n </cds-header>\n </div>\n <div cdsRow>\n <div cdsCol [columnNumbers]="{\'lg\': 2, \'md\': 2, \'sm\': 1}" class="multi-selection">\n <button cdsButton (click)="resetFilters()" class="reset-button">Reset Filters</button>\n <fieldset class="cds--fieldset">\n <legend class="cds--label">Radio button label</legend>\n <cds-radio-group\n aria-label="radiogroup"\n orientation="vertical"\n labelPlacement="right"\n [(ngModel)]="radio"\n (change)="onRadioChange($event)">\n <cds-radio *ngFor="let radio of radios"\n [value]="radio.color"\n [disabled]="radio.disabled">\n {{radio.color}}\n </cds-radio>\n </cds-radio-group>\n </fieldset>\n <fieldset class="cds--fieldset">\n <div cdsRow>\n <div cdsCol [columnNumbers]="{\'lg\': 2, \'md\': 2, \'sm\': 1}">\n <legend class="cds--label">Type</legend>\n </div>\n <div cdsCol [columnNumbers]="{\'lg\': 2, \'md\': 2, \'sm\': 1}">\n <cds-tag-filter\n *ngIf="checkBoxFilters.size > 0"\n (close)="resetCheckboxList()">\n {{checkBoxFilters.size}}\n </cds-tag-filter>\n </div>\n </div>\n <cds-checkbox\n *ngFor="let listItem of checkboxList"\n [hideLabel]="hideLabel"\n [checked]="listItem.checked"\n [value]="listItem.value"\n (change)="onCheckboxChange($event)">\n {{ listItem.value }}\n </cds-checkbox>\n </fieldset>\n </div>\n <div cdsCol [columnNumbers]="{\'lg\': 10, \'md\': 10, \'sm\': 3}" class="data-table">\n <cds-table-container>\n <cds-table\n class="data-table"\n [model]="model"\n size="lg"\n [showSelectionColumn]="false">\n <ng-content></ng-content>\n </cds-table>\n </cds-table-container>\n </div>\n </div>\n </div>\n ',styles:["\n\t\t.header {\n\t\t\tmargin-bottom: 80px;\n\t\t}\n\n\t\t.reset-button {\n\t\t\tmargin-bottom: 20px;\n\t\t}\n\n\t\t.data-table {\n\t\t\twidth: 100%;\n\t\t}\n\t"]})],SampleMultiCategories);const multiple_categories_stories={title:"Pattern/Filtering",decorators:[(0,dist.moduleMetadata)({declarations:[SampleMultiCategories],imports:[table.U$,dropdown.kW,grid.zE,structured_list.ic,src_radio.dU,src_checkbox.nD,src_button.hJ,tag.Wh,ui_shell.p5]})]},MultipleCategories=(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 as an example.\n --\x3e\n <app-sample-multi-categories></app-sample-multi-categories>\n "})).bind({});MultipleCategories.parameters={...MultipleCategories.parameters,docs:{...MultipleCategories.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 as an example.\n --\x3e\n <app-sample-multi-categories></app-sample-multi-categories>\n `\n})",...MultipleCategories.parameters?.docs?.source}}};const __namedExportsOrder=["MultipleCategories"]}}]);
|