carbon-components-angular 5.55.0 → 5.56.1
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/button/icon-button.component.d.ts +5 -1
- package/docs/documentation/components/Dropdown.html +504 -152
- package/docs/documentation/components/IconButton.html +53 -14
- package/docs/documentation/coverage.html +6 -6
- package/docs/documentation/js/search/search_index.js +2 -2
- package/docs/documentation/modules/CodeSnippetModule/dependencies.svg +4 -4
- package/docs/documentation/modules/CodeSnippetModule.html +4 -4
- package/docs/documentation/modules/ComboBoxModule/dependencies.svg +4 -4
- package/docs/documentation/modules/ComboBoxModule.html +4 -4
- package/docs/documentation/modules/DatePickerInputModule/dependencies.svg +4 -4
- package/docs/documentation/modules/DatePickerInputModule.html +4 -4
- package/docs/documentation/modules/DatePickerModule/dependencies.svg +4 -4
- package/docs/documentation/modules/DatePickerModule.html +4 -4
- package/docs/documentation/modules/FileUploaderModule/dependencies.svg +34 -34
- package/docs/documentation/modules/FileUploaderModule.html +34 -34
- package/docs/documentation/modules/NFormsModule/dependencies.svg +4 -4
- package/docs/documentation/modules/NFormsModule.html +4 -4
- package/docs/documentation/modules/NumberModule/dependencies.svg +4 -4
- package/docs/documentation/modules/NumberModule.html +4 -4
- package/docs/documentation/modules/RadioModule/dependencies.svg +61 -57
- package/docs/documentation/modules/RadioModule.html +61 -57
- package/docs/documentation/modules/SearchModule/dependencies.svg +4 -4
- package/docs/documentation/modules/SearchModule.html +4 -4
- package/docs/documentation/modules/SliderModule/dependencies.svg +4 -4
- package/docs/documentation/modules/SliderModule.html +4 -4
- package/docs/documentation/modules/StructuredListModule/dependencies.svg +66 -66
- package/docs/documentation/modules/StructuredListModule.html +66 -66
- package/docs/documentation/modules/TagModule/dependencies.svg +4 -4
- package/docs/documentation/modules/TagModule.html +4 -4
- package/docs/documentation/modules/ThemeModule/dependencies.svg +4 -4
- package/docs/documentation/modules/ThemeModule.html +4 -4
- package/docs/documentation/modules/TilesModule/dependencies.svg +106 -106
- package/docs/documentation/modules/TilesModule.html +106 -106
- package/docs/documentation/modules/TimePickerModule/dependencies.svg +18 -18
- package/docs/documentation/modules/TimePickerModule.html +18 -18
- package/docs/documentation/modules/TimePickerSelectModule/dependencies.svg +49 -45
- package/docs/documentation/modules/TimePickerSelectModule.html +49 -45
- package/docs/documentation/modules/ToggletipModule/dependencies.svg +37 -37
- package/docs/documentation/modules/ToggletipModule.html +37 -37
- package/docs/documentation/modules/TooltipModule/dependencies.svg +28 -28
- package/docs/documentation/modules/TooltipModule.html +28 -28
- package/docs/documentation.json +255 -111
- package/docs/storybook/3224.9896492c.iframe.bundle.js +1 -0
- package/docs/storybook/7141.9d9ce230.iframe.bundle.js +1 -0
- package/docs/storybook/button-button-set-stories.1094a620.iframe.bundle.js +1 -0
- package/docs/storybook/button-button-stories.a0ff29b1.iframe.bundle.js +1 -0
- package/docs/storybook/button-icon-button-stories.db9a9ba5.iframe.bundle.js +1 -0
- package/docs/storybook/code-snippet-code-snippet-stories.cc0ddba0.iframe.bundle.js +1 -0
- package/docs/storybook/{dropdown-dropdown-stories.03c37214.iframe.bundle.js → dropdown-dropdown-stories.0a8f052e.iframe.bundle.js} +1 -1
- package/docs/storybook/iframe.html +2 -2
- package/docs/storybook/index-stories.69d5a816.iframe.bundle.js +1 -0
- package/docs/storybook/index.json +1 -1
- package/docs/storybook/input-input-stories.68ee4653.iframe.bundle.js +1 -0
- package/docs/storybook/input-password-stories.3084ebfc.iframe.bundle.js +1 -0
- package/docs/storybook/input-textarea-stories.e3f84fc4.iframe.bundle.js +1 -0
- package/docs/storybook/{main.fd9128ab.iframe.bundle.js → main.6feba07b.iframe.bundle.js} +1 -1
- package/docs/storybook/patterns-loading-large-loading-stories.67f20584.iframe.bundle.js +1 -0
- package/docs/storybook/project.json +1 -1
- package/docs/storybook/{runtime~main.d4ace00c.iframe.bundle.js → runtime~main.ee91208b.iframe.bundle.js} +1 -1
- package/docs/storybook/stories.json +1 -1
- package/docs/storybook/tiles-expandable-tile-stories.8658f693.iframe.bundle.js +1 -0
- package/docs/storybook/toggletip-toggletip-stories.f20fbe75.iframe.bundle.js +1 -0
- package/docs/storybook/ui-shell-ui-shell-stories.157336b4.iframe.bundle.js +1 -0
- package/dropdown/dropdown.component.d.ts +12 -3
- package/esm2020/button/icon-button.component.mjs +10 -4
- package/esm2020/code-snippet/code-snippet.component.mjs +1 -1
- package/esm2020/dropdown/dropdown.component.mjs +79 -37
- package/esm2020/modal/modal-header.component.mjs +1 -1
- package/esm2020/pagination/pagination-nav/pagination-nav.component.mjs +1 -1
- package/esm2020/ui-shell/header/header-action.component.mjs +1 -1
- package/fesm2015/carbon-components-angular-button.mjs +9 -3
- package/fesm2015/carbon-components-angular-button.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-code-snippet.mjs +1 -1
- package/fesm2015/carbon-components-angular-code-snippet.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-dropdown.mjs +79 -37
- package/fesm2015/carbon-components-angular-dropdown.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-modal.mjs +1 -1
- package/fesm2015/carbon-components-angular-modal.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-pagination.mjs +1 -1
- package/fesm2015/carbon-components-angular-pagination.mjs.map +1 -1
- package/fesm2015/carbon-components-angular-ui-shell.mjs +1 -1
- package/fesm2015/carbon-components-angular-ui-shell.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-button.mjs +9 -3
- package/fesm2020/carbon-components-angular-button.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-code-snippet.mjs +1 -1
- package/fesm2020/carbon-components-angular-code-snippet.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-dropdown.mjs +79 -37
- package/fesm2020/carbon-components-angular-dropdown.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-modal.mjs +1 -1
- package/fesm2020/carbon-components-angular-modal.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-pagination.mjs +1 -1
- package/fesm2020/carbon-components-angular-pagination.mjs.map +1 -1
- package/fesm2020/carbon-components-angular-ui-shell.mjs +1 -1
- package/fesm2020/carbon-components-angular-ui-shell.mjs.map +1 -1
- package/package.json +1 -1
- package/docs/storybook/3224.c0834124.iframe.bundle.js +0 -1
- package/docs/storybook/7141.e6990367.iframe.bundle.js +0 -1
- package/docs/storybook/button-button-set-stories.ed1d0fd9.iframe.bundle.js +0 -1
- package/docs/storybook/button-button-stories.de18db98.iframe.bundle.js +0 -1
- package/docs/storybook/button-icon-button-stories.4a9748f3.iframe.bundle.js +0 -1
- package/docs/storybook/code-snippet-code-snippet-stories.2701eee9.iframe.bundle.js +0 -1
- package/docs/storybook/index-stories.fba8f9b4.iframe.bundle.js +0 -1
- package/docs/storybook/input-input-stories.4bd7425d.iframe.bundle.js +0 -1
- package/docs/storybook/input-password-stories.575fa23d.iframe.bundle.js +0 -1
- package/docs/storybook/input-textarea-stories.75dfc9b8.iframe.bundle.js +0 -1
- package/docs/storybook/patterns-loading-large-loading-stories.a8a467eb.iframe.bundle.js +0 -1
- package/docs/storybook/tiles-expandable-tile-stories.97c48cb1.iframe.bundle.js +0 -1
- package/docs/storybook/toggletip-toggletip-stories.73f8eaaa.iframe.bundle.js +0 -1
- package/docs/storybook/ui-shell-ui-shell-stories.642f613c.iframe.bundle.js +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[3402],{"./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 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 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"]}],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"]}],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}};ButtonSet.propDecorators={buttonSetClass:[{type:core.HostBinding,args:["class.cds--btn-set"]}]},ButtonSet=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-button-set, ibm-button-set",template:"<ng-content></ng-content>"})],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/tiles/expandable-tile.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Basic:()=>Basic,Interactive:()=>Interactive,WithLayers:()=>WithLayers,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var _storybook_angular__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),_layer__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/layer/index.ts"),_button__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/button/index.ts"),___WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/tiles/index.ts");const __WEBPACK_DEFAULT_EXPORT__={title:"Components/Tiles/Expandable",decorators:[(0,_storybook_angular__WEBPACK_IMPORTED_MODULE_0__.moduleMetadata)({imports:[_button__WEBPACK_IMPORTED_MODULE_2__.hJ,_layer__WEBPACK_IMPORTED_MODULE_1__.D,___WEBPACK_IMPORTED_MODULE_3__.i$]})],component:___WEBPACK_IMPORTED_MODULE_3__.wN},Basic=(args=>({props:args,template:'\n <cds-expandable-tile>\n <span cdsAboveFold style="height: 200px">Above the fold content here</span>\n <span cdsBelowFold style="height: 400px">Below the fold content here</span>\n </cds-expandable-tile>\n '})).bind({}),Interactive=(args=>({props:args,template:'\n <cds-expandable-tile [interactive]="true">\n <span cdsAboveFold style="height: 200px">\n Above the fold content\n <button ibmButton>Click me!</button>\n </span>\n <span cdsBelowFold style="height: 400px">\n Below the fold content here\n <button ibmButton>No me!</button>\n </span>\n </cds-expandable-tile>\n '})).bind({}),WithLayers=(args=>({props:args,template:'\n <cds-expandable-tile>\n <span cdsAboveFold style="height: 200px">\n First Layer, above the fold content here\n </span>\n <span cdsBelowFold style="height: 400px">\n First Layer, below the fold content here\n </span>\n </cds-expandable-tile>\n <div cdsLayer>\n <cds-expandable-tile>\n <span cdsAboveFold style="height: 200px">\n Second layer, above the fold content here\n </span>\n <span cdsBelowFold style="height: 400px">\n Second layer, below the fold content here\n </span>\n </cds-expandable-tile>\n <div cdsLayer>\n <cds-expandable-tile>\n <span cdsAboveFold style="height: 200px">\n Third layer, above the fold content here\n </span>\n <span cdsBelowFold style="height: 400px">\n Third layer, below the fold content here\n </span>\n </cds-expandable-tile>\n </div>\n </div>\n '})).bind({});WithLayers.parameters={controls:{disable:!0}},Basic.parameters={...Basic.parameters,docs:{...Basic.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <cds-expandable-tile>\n <span cdsAboveFold style="height: 200px">Above the fold content here</span>\n <span cdsBelowFold style="height: 400px">Below the fold content here</span>\n </cds-expandable-tile>\n `\n})',...Basic.parameters?.docs?.source}}},Interactive.parameters={...Interactive.parameters,docs:{...Interactive.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <cds-expandable-tile [interactive]="true">\n <span cdsAboveFold style="height: 200px">\n Above the fold content\n <button ibmButton>Click me!</button>\n </span>\n <span cdsBelowFold style="height: 400px">\n Below the fold content here\n <button ibmButton>No me!</button>\n </span>\n </cds-expandable-tile>\n `\n})',...Interactive.parameters?.docs?.source}}},WithLayers.parameters={...WithLayers.parameters,docs:{...WithLayers.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <cds-expandable-tile>\n <span cdsAboveFold style="height: 200px">\n First Layer, above the fold content here\n </span>\n <span cdsBelowFold style="height: 400px">\n First Layer, below the fold content here\n </span>\n </cds-expandable-tile>\n <div cdsLayer>\n <cds-expandable-tile>\n <span cdsAboveFold style="height: 200px">\n Second layer, above the fold content here\n </span>\n <span cdsBelowFold style="height: 400px">\n Second layer, below the fold content here\n </span>\n </cds-expandable-tile>\n <div cdsLayer>\n <cds-expandable-tile>\n <span cdsAboveFold style="height: 200px">\n Third layer, above the fold content here\n </span>\n <span cdsBelowFold style="height: 400px">\n Third layer, below the fold content here\n </span>\n </cds-expandable-tile>\n </div>\n </div>\n `\n})',...WithLayers.parameters?.docs?.source}}};const __namedExportsOrder=["Basic","Interactive","WithLayers"]}}]);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[703],{"./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 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 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"]}],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"]}],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}};ButtonSet.propDecorators={buttonSetClass:[{type:core.HostBinding,args:["class.cds--btn-set"]}]},ButtonSet=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-button-set, ibm-button-set",template:"<ng-content></ng-content>"})],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/link/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{rU:()=>Link,LO:()=>LinkModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let Link=class Link{constructor(){this.baseClass=!0,this.inline=!1}set disabled(disabled){this._disabled=disabled,this.tabindex=this.disabled?-1:null}get disabled(){return this._disabled}};Link.propDecorators={baseClass:[{type:core.HostBinding,args:["class.cds--link"]}],tabindex:[{type:core.HostBinding,args:["attr.tabindex"]}],inline:[{type:core.Input},{type:core.HostBinding,args:["class.cds--link--inline"]}],disabled:[{type:core.Input},{type:core.HostBinding,args:["attr.aria-disabled"]},{type:core.HostBinding,args:["class.cds--link--disabled"]}]},Link=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsLink], [ibmLink]"})],Link);let LinkIconDirective=class LinkIconDirective{constructor(){this.iconClass=!0}};LinkIconDirective.propDecorators={iconClass:[{type:core.HostBinding,args:["class.cds--link__icon"]}]},LinkIconDirective=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[ibmLinkIcon], [cdsLinkIcon]"})],LinkIconDirective);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs");let LinkModule=class LinkModule{};LinkModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Link,LinkIconDirective],exports:[Link,LinkIconDirective],imports:[common.CommonModule]})],LinkModule)},"./node_modules/@storybook/angular/dist/client/argsToTemplate.js":(__unused_webpack_module,exports)=>{Object.defineProperty(exports,"__esModule",{value:!0}),exports.argsToTemplate=void 0,exports.argsToTemplate=function argsToTemplate(args,options={}){const includeSet=options.include?new Set(options.include):null,excludeSet=options.exclude?new Set(options.exclude):null;return Object.entries(args).filter((([key])=>void 0!==args[key])).filter((([key])=>includeSet?includeSet.has(key):!excludeSet||!excludeSet.has(key))).map((([key,value])=>"function"==typeof value?`(${key})="${key}($event)"`:`[${key}]="${key}"`)).join(" ")}},"./node_modules/@storybook/angular/dist/client/decorators.js":(__unused_webpack_module,exports,__webpack_require__)=>{Object.defineProperty(exports,"__esModule",{value:!0}),exports.componentWrapperDecorator=exports.applicationConfig=exports.moduleMetadata=void 0;const ComputesTemplateFromComponent_1=__webpack_require__("./node_modules/@storybook/angular/dist/client/angular-beta/ComputesTemplateFromComponent.js"),NgComponentAnalyzer_1=__webpack_require__("./node_modules/@storybook/angular/dist/client/angular-beta/utils/NgComponentAnalyzer.js");exports.moduleMetadata=metadata=>storyFn=>{const story=storyFn(),storyMetadata=story.moduleMetadata||{};return metadata=metadata||{},{...story,moduleMetadata:{declarations:[...metadata.declarations||[],...storyMetadata.declarations||[]],entryComponents:[...metadata.entryComponents||[],...storyMetadata.entryComponents||[]],imports:[...metadata.imports||[],...storyMetadata.imports||[]],schemas:[...metadata.schemas||[],...storyMetadata.schemas||[]],providers:[...metadata.providers||[],...storyMetadata.providers||[]]}}},exports.applicationConfig=function applicationConfig(config){return storyFn=>{const story=storyFn(),storyConfig=story.applicationConfig;return{...story,applicationConfig:storyConfig||config?{...config,...storyConfig,providers:[...config?.providers||[],...storyConfig?.providers||[]]}:void 0}}};exports.componentWrapperDecorator=(element,props)=>(storyFn,storyContext)=>{const story=storyFn(),currentProps="function"==typeof props?props(storyContext):props,template=(0,NgComponentAnalyzer_1.isComponent)(element)?(0,ComputesTemplateFromComponent_1.computesTemplateFromComponent)(element,currentProps??{},story.template):element(story.template);return{...story,template,...currentProps||story.props?{props:{...currentProps,...story.props}}:{}}}},"./node_modules/@storybook/angular/dist/client/index.js":function(__unused_webpack_module,exports,__webpack_require__){var __createBinding=this&&this.__createBinding||(Object.create?function(o,m,k,k2){void 0===k2&&(k2=k);var desc=Object.getOwnPropertyDescriptor(m,k);desc&&!("get"in desc?!m.__esModule:desc.writable||desc.configurable)||(desc={enumerable:!0,get:function(){return m[k]}}),Object.defineProperty(o,k2,desc)}:function(o,m,k,k2){void 0===k2&&(k2=k),o[k2]=m[k]}),__exportStar=this&&this.__exportStar||function(m,exports){for(var p in m)"default"===p||Object.prototype.hasOwnProperty.call(exports,p)||__createBinding(exports,m,p)};Object.defineProperty(exports,"__esModule",{value:!0}),exports.argsToTemplate=exports.applicationConfig=exports.componentWrapperDecorator=exports.moduleMetadata=void 0,__webpack_require__("./node_modules/@storybook/angular/dist/client/globals.js"),__exportStar(__webpack_require__("./node_modules/@storybook/angular/dist/client/public-api.js"),exports),__exportStar(__webpack_require__("./node_modules/@storybook/angular/dist/client/public-types.js"),exports);var decorators_1=__webpack_require__("./node_modules/@storybook/angular/dist/client/decorators.js");Object.defineProperty(exports,"moduleMetadata",{enumerable:!0,get:function(){return decorators_1.moduleMetadata}}),Object.defineProperty(exports,"componentWrapperDecorator",{enumerable:!0,get:function(){return decorators_1.componentWrapperDecorator}}),Object.defineProperty(exports,"applicationConfig",{enumerable:!0,get:function(){return decorators_1.applicationConfig}});var argsToTemplate_1=__webpack_require__("./node_modules/@storybook/angular/dist/client/argsToTemplate.js");Object.defineProperty(exports,"argsToTemplate",{enumerable:!0,get:function(){return argsToTemplate_1.argsToTemplate}})},"./node_modules/@storybook/angular/dist/client/public-api.js":function(__unused_webpack_module,exports,__webpack_require__){var __createBinding=this&&this.__createBinding||(Object.create?function(o,m,k,k2){void 0===k2&&(k2=k);var desc=Object.getOwnPropertyDescriptor(m,k);desc&&!("get"in desc?!m.__esModule:desc.writable||desc.configurable)||(desc={enumerable:!0,get:function(){return m[k]}}),Object.defineProperty(o,k2,desc)}:function(o,m,k,k2){void 0===k2&&(k2=k),o[k2]=m[k]}),__exportStar=this&&this.__exportStar||function(m,exports){for(var p in m)"default"===p||Object.prototype.hasOwnProperty.call(exports,p)||__createBinding(exports,m,p)},__importDefault=this&&this.__importDefault||function(mod){return mod&&mod.__esModule?mod:{default:mod}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.raw=exports.forceReRender=exports.configure=exports.storiesOf=void 0;const preview_api_1=__webpack_require__("@storybook/preview-api"),render_1=__webpack_require__("./node_modules/@storybook/angular/dist/client/render.js"),decorateStory_1=__importDefault(__webpack_require__("./node_modules/@storybook/angular/dist/client/decorateStory.js"));__exportStar(__webpack_require__("./node_modules/@storybook/angular/dist/client/public-types.js"),exports);const api=(0,preview_api_1.start)(render_1.renderToCanvas,{decorateStory:decorateStory_1.default,render:render_1.render});exports.storiesOf=(kind,m)=>api.clientApi.storiesOf(kind,m).addParameters({renderer:"angular"});exports.configure=(...args)=>api.configure("angular",...args),exports.forceReRender=api.forceReRender,exports.raw=api.clientApi.raw},"./node_modules/@storybook/angular/dist/client/public-types.js":(__unused_webpack_module,exports)=>{Object.defineProperty(exports,"__esModule",{value:!0})},"./node_modules/@storybook/angular/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{var _client_index__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@storybook/angular/dist/client/index.js");__webpack_require__.o(_client_index__WEBPACK_IMPORTED_MODULE_0__,"applicationConfig")&&__webpack_require__.d(__webpack_exports__,{applicationConfig:function(){return _client_index__WEBPACK_IMPORTED_MODULE_0__.applicationConfig}}),__webpack_require__.o(_client_index__WEBPACK_IMPORTED_MODULE_0__,"componentWrapperDecorator")&&__webpack_require__.d(__webpack_exports__,{componentWrapperDecorator:function(){return _client_index__WEBPACK_IMPORTED_MODULE_0__.componentWrapperDecorator}}),__webpack_require__.o(_client_index__WEBPACK_IMPORTED_MODULE_0__,"moduleMetadata")&&__webpack_require__.d(__webpack_exports__,{moduleMetadata:function(){return _client_index__WEBPACK_IMPORTED_MODULE_0__.moduleMetadata}})},"./src/toggletip/toggletip.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Basic:()=>Basic,WithAutoAlign:()=>WithAutoAlign,__namedExportsOrder:()=>__namedExportsOrder,default:()=>toggletip_stories});var dist=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),src_link=__webpack_require__("./src/link/index.ts"),src_button=__webpack_require__("./src/button/index.ts"),tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let ToggletipAction=class ToggletipAction{constructor(){this.toggleTipActions=!0}};ToggletipAction.propDecorators={toggleTipActions:[{type:core.HostBinding,args:["class.cds--toggletip-actions"]}]},ToggletipAction=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsToggletipAction], [ibmToggletipAction]"})],ToggletipAction);let ToggletipButton=class ToggletipButton{constructor(){this.toggletipButton=!0,this.toggletipButtonType="button",this.ariaLabel="Show information"}};ToggletipButton.propDecorators={toggletipButton:[{type:core.HostBinding,args:["class.cds--toggletip-button"]}],toggletipButtonType:[{type:core.HostBinding,args:["attr.type"]}],ariaLabel:[{type:core.HostBinding,args:["attr.aria-label"]},{type:core.Input}]},ToggletipButton=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsToggletipButton], [ibmToggletipButton]"})],ToggletipButton);let ToggletipContent=class ToggletipContent{constructor(){this.toggletipContent=!0}};ToggletipContent.propDecorators={toggletipContent:[{type:core.HostBinding,args:["class.cds--toggletip-content"]}]},ToggletipContent=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsToggletipContent], [ibmToggletipContent]"})],ToggletipContent);let ToggletipLabel=class ToggletipLabel{constructor(){this.toggleTipLabel=!0}};ToggletipLabel.propDecorators={toggleTipLabel:[{type:core.HostBinding,args:["class.cds--toggletip-label"]}]},ToggletipLabel=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsToggletipLabel], [ibmToggletipLabel]"})],ToggletipLabel);var fromEvent=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/observable/fromEvent.js"),popover=__webpack_require__("./src/popover/index.ts");let Toggletip=class Toggletip extends popover.OI{constructor(hostElement,ngZone,renderer,changeDetectorRef){super(hostElement,ngZone,renderer,changeDetectorRef),this.hostElement=hostElement,this.ngZone=ngZone,this.renderer=renderer,this.changeDetectorRef=changeDetectorRef,this.id="tooltip-"+Toggletip.toggletipCounter++,this.toggletipClass=!0,this.isOpen=!1,this.documentClick=this.handleFocusOut.bind(this),this.highContrast=!0,this.dropShadow=!1}ngAfterViewInit(){this.initializeReferences(),this.subscription=(0,fromEvent.R)(this.btn.nativeElement,"click").subscribe((event=>{this.isOpen?document.removeEventListener("click",this.documentClick):document.addEventListener("click",this.documentClick),this.handleExpansion(!this.isOpen,event)})),this.isOpen&&document.addEventListener("click",this.documentClick),this.btn&&this.renderer.setAttribute(this.btn.nativeElement,"aria-controls",this.id)}hostkeys(event){open&&"Escape"===event.key&&(event.stopPropagation(),this.handleExpansion(!1,event))}handleFocusOut(event){this.hostElement.nativeElement.contains(event.target)||this.handleExpansion(!1,event)}ngOnDestroy(){this.subscription.unsubscribe()}handleExpansion(state=!1,event){this.handleChange(state,event),this.btn&&this.renderer.setAttribute(this.btn.nativeElement,"aria-expanded",this.isOpen.toString())}};Toggletip.toggletipCounter=0,Toggletip.ctorParameters=()=>[{type:core.ElementRef},{type:core.NgZone},{type:core.Renderer2},{type:core.ChangeDetectorRef}],Toggletip.propDecorators={id:[{type:core.Input}],toggletipClass:[{type:core.HostBinding,args:["class.cds--toggletip"]}],isOpen:[{type:core.HostBinding,args:["class.cds--toggletip--open"]},{type:core.Input}],btn:[{type:core.ContentChild,args:[ToggletipButton,{read:core.ElementRef}]}],hostkeys:[{type:core.HostListener,args:["keyup",["$event"]]}]},Toggletip=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-toggletip, ibm-toggletip",changeDetection:core.ChangeDetectionStrategy.OnPush,template:'\n\t\t<ng-content select="[cdsToggletipButton]"></ng-content>\n\t\t<cds-popover-content>\n\t\t\t<ng-content select="[cdsToggletipContent]"></ng-content>\n\t\t</cds-popover-content>\n\t'})],Toggletip);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs");let ToggletipModule=class ToggletipModule{};ToggletipModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Toggletip,ToggletipLabel,ToggletipAction,ToggletipButton,ToggletipContent],exports:[Toggletip,ToggletipLabel,ToggletipAction,ToggletipButton,ToggletipContent],imports:[common.CommonModule,popover.UU]})],ToggletipModule);const toggletip_stories={title:"Components/Toggletip",decorators:[(0,dist.moduleMetadata)({imports:[ToggletipModule,src_link.LO,src_button.hJ]})],args:{isOpen:!0,align:"bottom",autoAlign:!1},argTypes:{autoAlign:{control:!1},onOpen:{control:"Opened!"},onClose:{control:"Closed!"},isOpenChange:{control:"Is Open Change!"},align:{options:["top","bottom","left","right"],control:"select"}},component:Toggletip,subcomponents:{ToggletipAction,ToggletipButton,ToggletipContent,ToggletipLabel}},Basic=(args=>({props:args,template:'\n <span cdsToggletipLabel>Toggletip label</span>\n <cds-toggletip\n [isOpen]="isOpen"\n [align]="align"\n (isOpenChange)="isOpenChange($event)"\n (onClose)="onClose($event)"\n (onOpen)="onOpen($event)">\n <button cdsToggletipButton>\n <svg preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 32 32">\n <path d="M26,4H6A2,2,0,0,0,4,6V26a2,2,0,0,0,2,2H26a2,2,0,0,0,2-2V6A2,2,0,0,0,26,4ZM6,26V6H26V26Z"></path>\n </svg>\n </button>\n <div cdsToggletipContent>\n <p>\n Lorem ipsum dolor sit amet, di os consectetur adipiscing elit, sed\n do eiusmod tempor incididunt ut fsil labore et dolore magna aliqua.\n </p>\n <div cdsToggletipAction>\n <a href="#" cdsLink>Link action</a>\n <button cdsButton size="sm">Some button</button>\n </div>\n </div>\n </cds-toggletip>\n ',styles:["\n .tooltip-trigger {\n box-sizing: border-box;\n margin: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n background: white;\n border: 1px solid var(--cds-border-subtle);\n cursor: pointer;\n }\n svg { fill: var(--cds-background-inverse); }\n "]})).bind({});Basic.parameters={docs:{story:{inline:!1,height:"30rem"}},layout:"centered"};const WithAutoAlign=(args=>({props:args,template:'\n <div style="height:3000px">\n Scrolling will update the position of the popover:\n <div style="position: absolute; top: 500px; left: 500px;">\n <span cdsToggletipLabel>Toggletip label</span>\n <cds-toggletip\n [isOpen]="isOpen"\n [align]="align"\n [autoAlign]="true"\n (isOpenChange)="isOpenChange($event)"\n (onClose)="onClose($event)"\n (onOpen)="onOpen($event)">\n <button cdsToggletipButton>\n <svg preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 32 32">\n <path d="M26,4H6A2,2,0,0,0,4,6V26a2,2,0,0,0,2,2H26a2,2,0,0,0,2-2V6A2,2,0,0,0,26,4ZM6,26V6H26V26Z"></path>\n </svg>\n </button>\n <div cdsToggletipContent>\n <p>\n Lorem ipsum dolor sit amet, di os consectetur adipiscing elit, sed\n do eiusmod tempor incididunt ut fsil labore et dolore magna aliqua.\n </p>\n <div cdsToggletipAction>\n <a href="#" cdsLink>Link action</a>\n <button cdsButton size="sm">Some button</button>\n </div>\n </div>\n </cds-toggletip>\n </div>\n </div>\n ',styles:["\n .tooltip-trigger {\n box-sizing: border-box;\n margin: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n background: white;\n border: 1px solid var(--cds-border-subtle);\n cursor: pointer;\n }\n svg { fill: var(--cds-background-inverse); }\n "]})).bind({});WithAutoAlign.args={autoAlign:!0,align:"top"},Basic.parameters={...Basic.parameters,docs:{...Basic.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <span cdsToggletipLabel>Toggletip label</span>\n <cds-toggletip\n [isOpen]="isOpen"\n [align]="align"\n (isOpenChange)="isOpenChange($event)"\n (onClose)="onClose($event)"\n (onOpen)="onOpen($event)">\n <button cdsToggletipButton>\n <svg preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 32 32">\n <path d="M26,4H6A2,2,0,0,0,4,6V26a2,2,0,0,0,2,2H26a2,2,0,0,0,2-2V6A2,2,0,0,0,26,4ZM6,26V6H26V26Z"></path>\n </svg>\n </button>\n <div cdsToggletipContent>\n <p>\n Lorem ipsum dolor sit amet, di os consectetur adipiscing elit, sed\n do eiusmod tempor incididunt ut fsil labore et dolore magna aliqua.\n </p>\n <div cdsToggletipAction>\n <a href="#" cdsLink>Link action</a>\n <button cdsButton size="sm">Some button</button>\n </div>\n </div>\n </cds-toggletip>\n `,\n styles: [`\n .tooltip-trigger {\n box-sizing: border-box;\n margin: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n background: white;\n border: 1px solid var(--cds-border-subtle);\n cursor: pointer;\n }\n svg { fill: var(--cds-background-inverse); }\n `]\n})',...Basic.parameters?.docs?.source}}},WithAutoAlign.parameters={...WithAutoAlign.parameters,docs:{...WithAutoAlign.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div style="height:3000px">\n Scrolling will update the position of the popover:\n <div style="position: absolute; top: 500px; left: 500px;">\n <span cdsToggletipLabel>Toggletip label</span>\n <cds-toggletip\n [isOpen]="isOpen"\n [align]="align"\n [autoAlign]="true"\n (isOpenChange)="isOpenChange($event)"\n (onClose)="onClose($event)"\n (onOpen)="onOpen($event)">\n <button cdsToggletipButton>\n <svg preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 32 32">\n <path d="M26,4H6A2,2,0,0,0,4,6V26a2,2,0,0,0,2,2H26a2,2,0,0,0,2-2V6A2,2,0,0,0,26,4ZM6,26V6H26V26Z"></path>\n </svg>\n </button>\n <div cdsToggletipContent>\n <p>\n Lorem ipsum dolor sit amet, di os consectetur adipiscing elit, sed\n do eiusmod tempor incididunt ut fsil labore et dolore magna aliqua.\n </p>\n <div cdsToggletipAction>\n <a href="#" cdsLink>Link action</a>\n <button cdsButton size="sm">Some button</button>\n </div>\n </div>\n </cds-toggletip>\n </div>\n </div>\n `,\n styles: [`\n .tooltip-trigger {\n box-sizing: border-box;\n margin: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n background: white;\n border: 1px solid var(--cds-border-subtle);\n cursor: pointer;\n }\n svg { fill: var(--cds-background-inverse); }\n `]\n})',...WithAutoAlign.parameters?.docs?.source}}};const __namedExportsOrder=["Basic","WithAutoAlign"]}}]);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[9660],{"./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 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 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"]}],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"]}],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}};ButtonSet.propDecorators={buttonSetClass:[{type:core.HostBinding,args:["class.cds--btn-set"]}]},ButtonSet=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-button-set, ibm-button-set",template:"<ng-content></ng-content>"})],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/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;svg.setAttribute("xmlns","http://www.w3.org/2000/svg");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.createElement("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_56__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_55__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_angular_common__WEBPACK_IMPORTED_MODULE_57__=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),_icon_directive__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/icon/icon.directive.ts"),_icon_service__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/icon/icon.service.ts"),_carbon_icons_es_add_16__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@carbon/icons/es/add/16.js"),_carbon_icons_es_add_20__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@carbon/icons/es/add/20.js"),_carbon_icons_es_bee_16__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@carbon/icons/es/bee/16.js"),_carbon_icons_es_bee_20__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@carbon/icons/es/bee/20.js"),_carbon_icons_es_calendar_16__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@carbon/icons/es/calendar/16.js"),_carbon_icons_es_carbon_16__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@carbon/icons/es/carbon/16.js"),_carbon_icons_es_carbon_20__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./node_modules/@carbon/icons/es/carbon/20.js"),_carbon_icons_es_caret_down_16__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__("./node_modules/@carbon/icons/es/caret--down/16.js"),_carbon_icons_es_caret_left_16__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/@carbon/icons/es/caret--left/16.js"),_carbon_icons_es_caret_right_16__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/@carbon/icons/es/caret--right/16.js"),_carbon_icons_es_caret_up_16__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/@carbon/icons/es/caret--up/16.js"),_carbon_icons_es_checkmark_16__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark/16.js"),_carbon_icons_es_checkmark_filled_16__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--filled/16.js"),_carbon_icons_es_checkmark_filled_20__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--filled/20.js"),_carbon_icons_es_checkmark_outline_16__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--outline/16.js"),_carbon_icons_es_chevron_down_16__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./node_modules/@carbon/icons/es/chevron--down/16.js"),_carbon_icons_es_chevron_right_16__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./node_modules/@carbon/icons/es/chevron--right/16.js"),_carbon_icons_es_circle_dash_16__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./node_modules/@carbon/icons/es/circle-dash/16.js"),_carbon_icons_es_close_16__WEBPACK_IMPORTED_MODULE_20__=__webpack_require__("./node_modules/@carbon/icons/es/close/16.js"),_carbon_icons_es_close_20__WEBPACK_IMPORTED_MODULE_21__=__webpack_require__("./node_modules/@carbon/icons/es/close/20.js"),_carbon_icons_es_copy_16__WEBPACK_IMPORTED_MODULE_22__=__webpack_require__("./node_modules/@carbon/icons/es/copy/16.js"),_carbon_icons_es_copy_20__WEBPACK_IMPORTED_MODULE_23__=__webpack_require__("./node_modules/@carbon/icons/es/copy/20.js"),_carbon_icons_es_data_2_16__WEBPACK_IMPORTED_MODULE_24__=__webpack_require__("./node_modules/@carbon/icons/es/data--2/16.js"),_carbon_icons_es_data_2_20__WEBPACK_IMPORTED_MODULE_25__=__webpack_require__("./node_modules/@carbon/icons/es/data--2/20.js"),_carbon_icons_es_document_16__WEBPACK_IMPORTED_MODULE_26__=__webpack_require__("./node_modules/@carbon/icons/es/document/16.js"),_carbon_icons_es_document_20__WEBPACK_IMPORTED_MODULE_27__=__webpack_require__("./node_modules/@carbon/icons/es/document/20.js"),_carbon_icons_es_download_16__WEBPACK_IMPORTED_MODULE_28__=__webpack_require__("./node_modules/@carbon/icons/es/download/16.js"),_carbon_icons_es_error_filled_16__WEBPACK_IMPORTED_MODULE_29__=__webpack_require__("./node_modules/@carbon/icons/es/error--filled/16.js"),_carbon_icons_es_error_filled_20__WEBPACK_IMPORTED_MODULE_30__=__webpack_require__("./node_modules/@carbon/icons/es/error--filled/20.js"),_carbon_icons_es_fade_16__WEBPACK_IMPORTED_MODULE_31__=__webpack_require__("./node_modules/@carbon/icons/es/fade/16.js"),_carbon_icons_es_fade_20__WEBPACK_IMPORTED_MODULE_32__=__webpack_require__("./node_modules/@carbon/icons/es/fade/20.js"),_carbon_icons_es_folder_16__WEBPACK_IMPORTED_MODULE_33__=__webpack_require__("./node_modules/@carbon/icons/es/folder/16.js"),_carbon_icons_es_incomplete_16__WEBPACK_IMPORTED_MODULE_34__=__webpack_require__("./node_modules/@carbon/icons/es/incomplete/16.js"),_carbon_icons_es_information_filled_16__WEBPACK_IMPORTED_MODULE_35__=__webpack_require__("./node_modules/@carbon/icons/es/information--filled/16.js"),_carbon_icons_es_information_filled_20__WEBPACK_IMPORTED_MODULE_36__=__webpack_require__("./node_modules/@carbon/icons/es/information--filled/20.js"),_carbon_icons_es_information_square_filled_20__WEBPACK_IMPORTED_MODULE_37__=__webpack_require__("./node_modules/@carbon/icons/es/information--square--filled/20.js"),_carbon_icons_es_menu_16__WEBPACK_IMPORTED_MODULE_38__=__webpack_require__("./node_modules/@carbon/icons/es/menu/16.js"),_carbon_icons_es_menu_20__WEBPACK_IMPORTED_MODULE_39__=__webpack_require__("./node_modules/@carbon/icons/es/menu/20.js"),_carbon_icons_es_overflow_menu_vertical_16__WEBPACK_IMPORTED_MODULE_40__=__webpack_require__("./node_modules/@carbon/icons/es/overflow-menu--vertical/16.js"),_carbon_icons_es_overflow_menu_horizontal_16__WEBPACK_IMPORTED_MODULE_41__=__webpack_require__("./node_modules/@carbon/icons/es/overflow-menu--horizontal/16.js"),_carbon_icons_es_save_16__WEBPACK_IMPORTED_MODULE_42__=__webpack_require__("./node_modules/@carbon/icons/es/save/16.js"),_carbon_icons_es_search_16__WEBPACK_IMPORTED_MODULE_43__=__webpack_require__("./node_modules/@carbon/icons/es/search/16.js"),_carbon_icons_es_settings_16__WEBPACK_IMPORTED_MODULE_44__=__webpack_require__("./node_modules/@carbon/icons/es/settings/16.js"),_carbon_icons_es_settings_adjust_16__WEBPACK_IMPORTED_MODULE_45__=__webpack_require__("./node_modules/@carbon/icons/es/settings--adjust/16.js"),_carbon_icons_es_subtract_16__WEBPACK_IMPORTED_MODULE_46__=__webpack_require__("./node_modules/@carbon/icons/es/subtract/16.js"),_carbon_icons_es_trash_can_16__WEBPACK_IMPORTED_MODULE_47__=__webpack_require__("./node_modules/@carbon/icons/es/trash-can/16.js"),_carbon_icons_es_warning_16__WEBPACK_IMPORTED_MODULE_48__=__webpack_require__("./node_modules/@carbon/icons/es/warning/16.js"),_carbon_icons_es_warning_filled_16__WEBPACK_IMPORTED_MODULE_49__=__webpack_require__("./node_modules/@carbon/icons/es/warning--filled/16.js"),_carbon_icons_es_warning_filled_20__WEBPACK_IMPORTED_MODULE_50__=__webpack_require__("./node_modules/@carbon/icons/es/warning--filled/20.js"),_carbon_icons_es_warning_alt_filled_16__WEBPACK_IMPORTED_MODULE_51__=__webpack_require__("./node_modules/@carbon/icons/es/warning--alt--filled/16.js"),_carbon_icons_es_warning_alt_filled_20__WEBPACK_IMPORTED_MODULE_52__=__webpack_require__("./node_modules/@carbon/icons/es/warning--alt--filled/20.js"),_carbon_icons_es_view_16__WEBPACK_IMPORTED_MODULE_53__=__webpack_require__("./node_modules/@carbon/icons/es/view/16.js"),_carbon_icons_es_view_off_16__WEBPACK_IMPORTED_MODULE_54__=__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_55__.Optional,new _angular_core__WEBPACK_IMPORTED_MODULE_55__.SkipSelf,_icon_service__WEBPACK_IMPORTED_MODULE_1__.C6]],useFactory:function ICON_SERVICE_PROVIDER_FACTORY(parentService){return parentService||new _icon_service__WEBPACK_IMPORTED_MODULE_1__.C6}};let IconModule=class IconModule{constructor(iconService){this.iconService=iconService,iconService.registerAll([_carbon_icons_es_add_16__WEBPACK_IMPORTED_MODULE_2__.Z,_carbon_icons_es_add_20__WEBPACK_IMPORTED_MODULE_3__.Z,_carbon_icons_es_bee_16__WEBPACK_IMPORTED_MODULE_4__.Z,_carbon_icons_es_bee_20__WEBPACK_IMPORTED_MODULE_5__.Z,_carbon_icons_es_calendar_16__WEBPACK_IMPORTED_MODULE_6__.Z,_carbon_icons_es_carbon_16__WEBPACK_IMPORTED_MODULE_7__.Z,_carbon_icons_es_carbon_20__WEBPACK_IMPORTED_MODULE_8__.Z,_carbon_icons_es_caret_down_16__WEBPACK_IMPORTED_MODULE_9__.Z,_carbon_icons_es_caret_left_16__WEBPACK_IMPORTED_MODULE_10__.Z,_carbon_icons_es_caret_right_16__WEBPACK_IMPORTED_MODULE_11__.Z,_carbon_icons_es_caret_up_16__WEBPACK_IMPORTED_MODULE_12__.Z,_carbon_icons_es_checkmark_16__WEBPACK_IMPORTED_MODULE_13__.Z,_carbon_icons_es_checkmark_filled_16__WEBPACK_IMPORTED_MODULE_14__.Z,_carbon_icons_es_checkmark_filled_20__WEBPACK_IMPORTED_MODULE_15__.Z,_carbon_icons_es_checkmark_outline_16__WEBPACK_IMPORTED_MODULE_16__.Z,_carbon_icons_es_chevron_down_16__WEBPACK_IMPORTED_MODULE_17__.Z,_carbon_icons_es_chevron_right_16__WEBPACK_IMPORTED_MODULE_18__.Z,_carbon_icons_es_circle_dash_16__WEBPACK_IMPORTED_MODULE_19__.Z,_carbon_icons_es_close_16__WEBPACK_IMPORTED_MODULE_20__.Z,_carbon_icons_es_close_20__WEBPACK_IMPORTED_MODULE_21__.Z,_carbon_icons_es_copy_16__WEBPACK_IMPORTED_MODULE_22__.Z,_carbon_icons_es_copy_20__WEBPACK_IMPORTED_MODULE_23__.Z,_carbon_icons_es_data_2_16__WEBPACK_IMPORTED_MODULE_24__.Z,_carbon_icons_es_data_2_20__WEBPACK_IMPORTED_MODULE_25__.Z,_carbon_icons_es_document_16__WEBPACK_IMPORTED_MODULE_26__.Z,_carbon_icons_es_document_20__WEBPACK_IMPORTED_MODULE_27__.Z,_carbon_icons_es_download_16__WEBPACK_IMPORTED_MODULE_28__.Z,_carbon_icons_es_error_filled_16__WEBPACK_IMPORTED_MODULE_29__.Z,_carbon_icons_es_error_filled_20__WEBPACK_IMPORTED_MODULE_30__.Z,_carbon_icons_es_fade_16__WEBPACK_IMPORTED_MODULE_31__.Z,_carbon_icons_es_fade_20__WEBPACK_IMPORTED_MODULE_32__.Z,_carbon_icons_es_folder_16__WEBPACK_IMPORTED_MODULE_33__.Z,_carbon_icons_es_incomplete_16__WEBPACK_IMPORTED_MODULE_34__.Z,_carbon_icons_es_information_filled_16__WEBPACK_IMPORTED_MODULE_35__.Z,_carbon_icons_es_information_filled_20__WEBPACK_IMPORTED_MODULE_36__.Z,_carbon_icons_es_information_square_filled_20__WEBPACK_IMPORTED_MODULE_37__.Z,_carbon_icons_es_menu_16__WEBPACK_IMPORTED_MODULE_38__.Z,_carbon_icons_es_menu_20__WEBPACK_IMPORTED_MODULE_39__.Z,_carbon_icons_es_overflow_menu_vertical_16__WEBPACK_IMPORTED_MODULE_40__.Z,_carbon_icons_es_overflow_menu_horizontal_16__WEBPACK_IMPORTED_MODULE_41__.Z,_carbon_icons_es_save_16__WEBPACK_IMPORTED_MODULE_42__.Z,_carbon_icons_es_search_16__WEBPACK_IMPORTED_MODULE_43__.Z,_carbon_icons_es_settings_16__WEBPACK_IMPORTED_MODULE_44__.Z,_carbon_icons_es_settings_adjust_16__WEBPACK_IMPORTED_MODULE_45__.Z,_carbon_icons_es_subtract_16__WEBPACK_IMPORTED_MODULE_46__.Z,_carbon_icons_es_trash_can_16__WEBPACK_IMPORTED_MODULE_47__.Z,_carbon_icons_es_view_16__WEBPACK_IMPORTED_MODULE_53__.Z,_carbon_icons_es_view_off_16__WEBPACK_IMPORTED_MODULE_54__.Z,_carbon_icons_es_warning_16__WEBPACK_IMPORTED_MODULE_48__.Z,_carbon_icons_es_warning_filled_16__WEBPACK_IMPORTED_MODULE_49__.Z,_carbon_icons_es_warning_filled_20__WEBPACK_IMPORTED_MODULE_50__.Z,_carbon_icons_es_warning_alt_filled_16__WEBPACK_IMPORTED_MODULE_51__.Z,_carbon_icons_es_warning_alt_filled_20__WEBPACK_IMPORTED_MODULE_52__.Z])}};IconModule.ctorParameters=()=>[{type:_icon_service__WEBPACK_IMPORTED_MODULE_1__.C6}],IconModule=(0,tslib__WEBPACK_IMPORTED_MODULE_56__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_55__.NgModule)({declarations:[_icon_directive__WEBPACK_IMPORTED_MODULE_0__.a],exports:[_icon_directive__WEBPACK_IMPORTED_MODULE_0__.a],imports:[_angular_common__WEBPACK_IMPORTED_MODULE_57__.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){const{size}=descriptor;this.iconCache.set(name,size.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/layer/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>LayerDirective,D:()=>LayerModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let LayerDirective=class LayerDirective{set ibmLayer(level){this.cdsLayer=level}set cdsLayer(level){"number"==typeof level&&(this._passedLevel=level,this.layer=level)}get cdsLayer(){return this._passedLevel}set layer(level){"number"==typeof level&&(this._level=Math.max(0,Math.min(level,2)),this.layerChildren&&this.layerChildren.forEach((layer=>{layer!==this&&(layer.layer="number"==typeof layer._passedLevel?layer._passedLevel:this.layer+1)})))}get layer(){return this._level}get layerOneClass(){return 0===this.layer}get layerTwoClass(){return 1===this.layer}get layerThreeClass(){return 2===this.layer}ngAfterContentInit(){"number"!=typeof this.cdsLayer&&(this.layer=1)}};LayerDirective.propDecorators={ibmLayer:[{type:core.Input}],cdsLayer:[{type:core.Input}],layerOneClass:[{type:core.HostBinding,args:["class.cds--layer-one"]}],layerTwoClass:[{type:core.HostBinding,args:["class.cds--layer-two"]}],layerThreeClass:[{type:core.HostBinding,args:["class.cds--layer-three"]}],layerChildren:[{type:core.ContentChildren,args:[LayerDirective,{descendants:!1}]}]},LayerDirective=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsLayer], [ibmLayer]",exportAs:"layer"})],LayerDirective);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs");let LayerModule=class LayerModule{};LayerModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[LayerDirective],exports:[LayerDirective],imports:[common.CommonModule]})],LayerModule)},"./src/search/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{o:()=>Search,t:()=>SearchModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),search_componentngResource=__webpack_require__("./src/search/search.component.html?ngResource"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),fesm2020_forms=__webpack_require__("./node_modules/@angular/forms/fesm2020/forms.mjs"),i18n=__webpack_require__("./src/i18n/index.ts");let Search=class Search{constructor(elementRef,i18n){this.elementRef=elementRef,this.i18n=i18n,this.theme="dark",this.size="md",this.disabled=!1,this.toolbar=!1,this.expandable=!1,this.skeleton=!1,this.active=!1,this.tableSearch=!1,this.id=`search-${Search.searchCount}`,this.value="",this.autocomplete="on",this.label=this.i18n.get().SEARCH.LABEL,this.placeholder=this.i18n.get().SEARCH.PLACEHOLDER,this.clearButtonTitle=this.i18n.get().SEARCH.CLEAR_BUTTON,this.searchTitle="",this.fluid=!1,this.valueChange=new core.EventEmitter,this.open=new core.EventEmitter,this.clear=new core.EventEmitter,this.search=new core.EventEmitter,this.isComposing=!1,this.onTouched=()=>{},this.propagateChange=_=>{},Search.searchCount++}get containerClass(){return!(this.toolbar||this.expandable)}get fluidSkeletonClass(){return this.skeleton&&this.fluid}writeValue(value){this.value=value}registerOnChange(fn){this.propagateChange=fn}registerOnTouched(fn){this.onTouched=fn}onSearch(search){this.isComposing||(this.value=search,this.doValueChange())}onEnter(){this.search.emit(this.value)}clearSearch(){this.value="",this.clear.emit(),this.propagateChange(this.value)}doValueChange(){this.valueChange.emit(this.value),this.propagateChange(this.value)}openSearch(){this.active=!0,this.open.emit(this.active),setTimeout((()=>this.inputRef.nativeElement.focus()))}keyDown(event){(this.toolbar||this.expandable)&&("Escape"===event.key?""===this.value&&(this.active=!1,this.open.emit(this.active)):"Enter"===event.key&&this.openSearch()),"Escape"===event.key&&""!==this.value&&this.clearSearch()}focusOut(event){this.onTouched(),(this.expandable||this.toolbar)&&this.inputRef&&""===this.inputRef.nativeElement.value&&!this.elementRef.nativeElement.contains(event.relatedTarget)&&(this.active=!1,this.open.emit(this.active))}focusIn(event){this.onTouched(),!this.expandable&&!this.toolbar||!this.inputRef||event.relatedTarget||this.elementRef.nativeElement.contains(event.relatedTarget)||this.openSearch()}compositionStart(event){this.isComposing=!0}compositionEnd(event){this.isComposing=!1,this.onSearch(this.value+event.data)}};Search.searchCount=0,Search.ctorParameters=()=>[{type:core.ElementRef},{type:i18n.oc}],Search.propDecorators={containerClass:[{type:core.HostBinding,args:["class.cds--form-item"]}],fluidSkeletonClass:[{type:core.HostBinding,args:["class.cds--text-input--fluid__skeleton"]}],theme:[{type:core.Input}],size:[{type:core.Input}],disabled:[{type:core.Input}],toolbar:[{type:core.Input}],expandable:[{type:core.Input}],skeleton:[{type:core.Input}],active:[{type:core.Input}],tableSearch:[{type:core.Input}],name:[{type:core.Input}],id:[{type:core.Input}],required:[{type:core.Input}],value:[{type:core.Input}],autocomplete:[{type:core.Input}],label:[{type:core.Input}],placeholder:[{type:core.Input}],clearButtonTitle:[{type:core.Input}],searchTitle:[{type:core.Input}],ariaLabel:[{type:core.Input}],fluid:[{type:core.Input}],valueChange:[{type:core.Output}],open:[{type:core.Output}],clear:[{type:core.Output}],search:[{type:core.Output}],inputRef:[{type:core.ViewChild,args:["input"]}],keyDown:[{type:core.HostListener,args:["keydown",["$event"]]}],focusOut:[{type:core.HostListener,args:["focusout",["$event"]]}],focusIn:[{type:core.HostListener,args:["focusin",["$event"]]}],compositionStart:[{type:core.HostListener,args:["compositionstart",["$event"]]}],compositionEnd:[{type:core.HostListener,args:["compositionend",["$event"]]}]},Search=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-search, ibm-search",template:search_componentngResource,providers:[{provide:fesm2020_forms.JU,useExisting:Search,multi:!0}]})],Search);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),icon=__webpack_require__("./src/icon/index.ts");let SearchModule=class SearchModule{};SearchModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Search],exports:[Search],imports:[fesm2020_forms.u5,common.CommonModule,i18n.LU,icon.QX]})],SearchModule)},"./src/theme/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{E:()=>ThemeDirective,O:()=>ThemeModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),src_layer=__webpack_require__("./src/layer/index.ts");let ThemeDirective=class ThemeDirective{constructor(){this.cdsTheme="white",this.layerClass=!0}set ibmTheme(type){this.cdsTheme=type}get whiteThemeClass(){return"white"===this.cdsTheme||!this.cdsTheme}get g10ThemeClass(){return"g10"===this.cdsTheme}get g90ThemeClass(){return"g90"===this.cdsTheme}get g100ThemeClass(){return"g100"===this.cdsTheme}ngAfterContentChecked(){this.layerChildren.toArray().forEach((layer=>{"number"!=typeof layer.cdsLayer&&(layer.cdsLayer=1)}))}};ThemeDirective.propDecorators={ibmTheme:[{type:core.Input}],cdsTheme:[{type:core.Input}],layerChildren:[{type:core.ContentChildren,args:[src_layer.A,{descendants:!1}]}],whiteThemeClass:[{type:core.HostBinding,args:["class.cds--white"]}],g10ThemeClass:[{type:core.HostBinding,args:["class.cds--g10"]}],g90ThemeClass:[{type:core.HostBinding,args:["class.cds--g90"]}],g100ThemeClass:[{type:core.HostBinding,args:["class.cds--g100"]}],layerClass:[{type:core.HostBinding,args:["class.cds--layer-one"]}]},ThemeDirective=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsTheme], [ibmTheme]",exportAs:"theme"})],ThemeDirective);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs");let ThemeModule=class ThemeModule{};ThemeModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[ThemeDirective],exports:[ThemeDirective],imports:[common.CommonModule,src_layer.D]})],ThemeModule)},"./src/ui-shell/ui-shell.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{AngularRouting:()=>AngularRouting,Header:()=>Header,HeaderFluid:()=>HeaderFluid,HeaderWithRouter:()=>HeaderWithRouter,HeaderWithTemp:()=>HeaderWithTemp,SideNavigation:()=>SideNavigation,SideNavigationRail:()=>SideNavigationRail,SideNavigationRouter:()=>SideNavigationRouter,SideNavigationUseRouter:()=>SideNavigationUseRouter,SidePanel:()=>SidePanel,Together:()=>Together,WithModel:()=>WithModel,__namedExportsOrder:()=>__namedExportsOrder,default:()=>ui_shell_stories});var core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),router=__webpack_require__("./node_modules/@angular/router/fesm2020/router.mjs"),dist=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),search=__webpack_require__("./src/search/index.ts"),icon=__webpack_require__("./src/icon/index.ts"),theme=__webpack_require__("./src/theme/index.ts"),ui_shell=__webpack_require__("./src/ui-shell/index.ts"),tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js");let BarComponent=class BarComponent{};BarComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-bar",template:"<h1>bar</h1>"})],BarComponent);let FooComponent=class FooComponent{};FooComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-foo",template:"<h1>foo</h1>"})],FooComponent);let HeaderFluidComponent=class HeaderFluidComponent{constructor(){this.hasHamburger=!1}};HeaderFluidComponent.propDecorators={headerItems:[{type:core.Input}]},HeaderFluidComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"app-header-fluid",template:'\n\t\t<cds-header name="[Platform]">\n\t\t\t<cds-hamburger\n\t\t\t\t(selected)="hasHamburger = !hasHamburger"\n\t\t\t\tclass="cds--header__menu-toggle__hidden"></cds-hamburger>\n\t\t\t<cds-header-navigation [navigationItems]="headerItems"></cds-header-navigation>\n\t\t\t<cds-sidenav\n\t\t\t\t*ngIf="hasHamburger"\n\t\t\t\t[navigationItems]="headerItems"\n\t\t\t\tclass="cds--header__menu-toggle__hidden"></cds-sidenav>\n\t\t</cds-header>\n\t'})],HeaderFluidComponent);const ui_shell_stories={title:"Components/UI Shell",decorators:[(0,dist.applicationConfig)({providers:[(0,core.importProvidersFrom)(router.Bz.forRoot([{path:"bar",component:BarComponent},{path:"foo",component:FooComponent}],{useHash:!0}))]}),(0,dist.moduleMetadata)({declarations:[BarComponent,FooComponent,HeaderFluidComponent],imports:[theme.O,ui_shell.p5,icon.QX,search.t,router.Bz]})],args:{theme:"white"},argTypes:{theme:{options:["white","g10","g90","g100"],control:"radio"}},parameters:{docs:{story:{height:"30rem"}}}},Header=(args=>({props:args,template:'\n <div [cdsTheme]="theme">\n <cds-header name="[Platform]">\n <cds-hamburger *ngIf="hasHamburger" (click)="expanded($event)"></cds-hamburger>\n <cds-header-navigation>\n <cds-header-item>Catalog</cds-header-item>\n <cds-header-item isCurrentPage="true">Docs</cds-header-item>\n <cds-header-item>Support</cds-header-item>\n <cds-header-menu title="Manage">\n <cds-header-item>Link 1</cds-header-item>\n <cds-header-item>Link 2</cds-header-item>\n <cds-header-item>Link 3</cds-header-item>\n </cds-header-menu>\n </cds-header-navigation>\n <cds-header-global>\n <cds-header-action description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n <cds-header-action description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n </cds-header-global>\n </cds-header>\n </div>\n '})).bind({});Header.args={hasHamburger:!0},Header.argTypes={expanded:{action:"Menu clicked!"}};const HeaderFluid=(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/ui-shell/stories/header-fluid.component.ts\n --\x3e\n <app-header-fluid [headerItems]="headerItems"></app-header-fluid>\n '})).bind({});HeaderFluid.storyName="Header fluid items to side navigation",HeaderFluid.args={headerItems:[{type:"item",content:"Catalog",title:"Catalog"},{type:"item",content:"Docs",isCurrentPage:!0},{type:"item",content:"Support"},{type:"menu",title:"Manage",menuItems:[{type:"item",content:"Link 1"},{type:"item",content:"Link 2"},{type:"item",content:"Link 3"}]}]},HeaderFluid.argTypes={headerItems:{control:!1},theme:{control:!1}};const HeaderWithTemp=(args=>({props:args,template:'\n <div [cdsTheme]="theme">\n <cds-header name="[Platform]" [brand]="brandTemplate">\n <cds-hamburger *ngIf="hasHamburger" (click)="expanded($event)"></cds-hamburger>\n <cds-header-navigation>\n <cds-header-item>Catalog</cds-header-item>\n <cds-header-item>Docs</cds-header-item>\n <cds-header-item>Support</cds-header-item>\n <cds-header-menu title="Manage">\n <cds-header-item>Link 1</cds-header-item>\n <cds-header-item>Link 2</cds-header-item>\n <cds-header-item>Link 3</cds-header-item>\n </cds-header-menu>\n </cds-header-navigation>\n <cds-header-global>\n <cds-header-action description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n <cds-header-action description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n </cds-header-global>\n </cds-header>\n </div>\n <ng-template #brandTemplate>\n <a class="cds--header__name">\n <svg cdsIcon="carbon" size="32" style="stroke:white;fill:white"></svg>\n <span class="cds--header__name--prefix">IBM</span>\n [Platform]\n </a>\n </ng-template>\n '})).bind({});HeaderWithTemp.storyName="Header with template",HeaderWithTemp.args={hasHamburger:!0},HeaderWithTemp.argTypes={expanded:{action:"Menu clicked!"}};const HeaderWithRouter=(args=>({props:args,template:'\n <div [cdsTheme]="theme">\n <cds-header name="[Platform]" [route]="[\'bar\']">\n <cds-header-navigation>\n <cds-header-item [route]="[\'foo\']">Catalog</cds-header-item>\n <cds-header-item [route]="[\'bar\']">Docs</cds-header-item>\n <cds-header-item [route]="[\'foo\']">Support</cds-header-item>\n <cds-header-menu title="Manage">\n <cds-header-item [route]="[\'foo\']">Link 1</cds-header-item>\n <cds-header-item [route]="[\'bar\']">Link 2</cds-header-item>\n <cds-header-item [route]="[\'foo\']">Link 3</cds-header-item>\n </cds-header-menu>\n </cds-header-navigation>\n </cds-header>\n </div>\n <div style="margin-top: 2rem">\n <router-outlet></router-outlet>\n </div>\n '})).bind({});HeaderWithRouter.argTypes={expanded:{action:"Menu clicked!"}};const SideNavigation=(args=>({props:args,template:'\n <div [cdsTheme]="theme">\n <cds-sidenav>\n <cds-sidenav-item [active]="true">\n Link\n </cds-sidenav-item>\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" icon size="16"></svg>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n </div>\n '})).bind({});SideNavigation.args={options:[{content:"Option 1",value:1},{content:"Option 2",value:2},{content:"Option 3",value:3}]},SideNavigation.argTypes={options:{control:!1}};const SideNavigationRouter=(args=>({props:args,template:'\n <div [cdsTheme]="theme">\n <cds-sidenav>\n <cds-sidenav-item [route]="[\'foo\']">\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-item [route]="[\'bar\']">\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" icon size="16"></svg>\n <cds-sidenav-item [route]="[\'foo\']">Link</cds-sidenav-item>\n <cds-sidenav-item [route]="[\'bar\']">Link</cds-sidenav-item>\n <cds-sidenav-item [route]="[\'foo\']">Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n </div>\n <div style="margin-left: 18rem">\n <router-outlet></router-outlet>\n </div>\n '})).bind({});SideNavigationRouter.storyName="Side Navigation with router";const SideNavigationUseRouter=(args=>({props:args,template:'\n <div [cdsTheme]="theme">\n <cds-sidenav>\n <cds-sidenav-item [route]="[\'foo\']" [useRouter]="true">\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-item [route]="[\'bar\']" [useRouter]="true" [routeExtras]="routeExtras">\n <svg cdsIcon="fade" size="16"></svg>\n Link with query params\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" icon size="16"></svg>\n <cds-sidenav-item [route]="[\'foo\']" [useRouter]="true">Link</cds-sidenav-item>\n <cds-sidenav-item [route]="[\'bar\']" [useRouter]="true">Link</cds-sidenav-item>\n <cds-sidenav-item [route]="[\'foo\']" [useRouter]="true">Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n </div>\n <div style="margin-left: 256px">\n <router-outlet></router-outlet>\n </div>\n '})).bind({});SideNavigationUseRouter.storyName="Side Navigation with useRouter",SideNavigationUseRouter.args={routeExtras:{queryParams:{key:"value"}}};const SidePanel=(args=>({props:args,template:'\n <div [cdsTheme]="theme">\n <cds-panel expanded="true">\n <cds-switcher-list>\n <cds-switcher-list-item [route]="[\'foo\']">Switcher item one</cds-switcher-list-item>\n <cds-switcher-list-item [route]="[\'bar\']">Switcher item two</cds-switcher-list-item>\n <cds-switcher-list-item [route]="[\'foo\']">Switcher item three</cds-switcher-list-item>\n <cds-switcher-list-item [route]="[\'bar\']">Switcher item four</cds-switcher-list-item>\n </cds-switcher-list>\n </cds-panel>\n </div>\n <div>\n <router-outlet></router-outlet>\n </div>\n '})).bind({});SidePanel.storyName="Side Panel with router";const Together=(args=>({props:args,template:'\n <div>\n <cds-header name="[Platform]">\n <cds-hamburger *ngIf="hasHamburger" [active]="active" (selected)="active = !active"></cds-hamburger>\n <cds-header-navigation>\n <cds-header-item>Catalog</cds-header-item>\n <cds-header-item>Docs</cds-header-item>\n <cds-header-item>Support</cds-header-item>\n <cds-header-menu title="Manage">\n <cds-header-item>Link 1</cds-header-item>\n <cds-header-item>Link 2</cds-header-item>\n <cds-header-item>Link 3</cds-header-item>\n </cds-header-menu>\n </cds-header-navigation>\n <cds-header-global>\n <cds-header-action #firstAction description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n <cds-header-action [(active)]="secondAction" description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n </cds-header-global>\n </cds-header>\n <cds-sidenav [expanded]="active" style="margin-top: 3rem">\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" size="16"></svg>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item [active]="hasActiveChild">Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n <cds-panel [expanded]="firstAction.active"></cds-panel>\n <cds-panel [expanded]="secondAction">\n <cds-switcher-list>\n <cds-switcher-list-item active="true">Switcher item one</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item two</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item three</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item four</cds-switcher-list-item>\n </cds-switcher-list>\n </cds-panel>\n </div>\n '})).bind({});Together.args={hasHamburger:!0,active:!0,secondAction:!1,hasActiveChild:!0,options:[{content:"Option 1",value:1},{content:"Option 2",value:2},{content:"Option 3",value:3}]},Together.argTypes={options:{control:!1}};const SideNavigationRail=(args=>({props:args,template:'\n <div [cdsTheme]="theme">\n <cds-sidenav rail="true" [expanded]="false">\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" icon size="16"></svg>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n </div>\n '})).bind({});SideNavigationRail.args={options:[{content:"Option 1",value:1},{content:"Option 2",value:2},{content:"Option 3",value:3}]},SideNavigationRail.argTypes={options:{control:!1}};const WithModel=(args=>({props:args,template:'\n <div [cdsTheme]="theme">\n <cds-header name="[Platform]">\n <cds-hamburger *ngIf="hasHamburger" [active]="active" (selected)="active = !active"></cds-hamburger>\n <cds-header-navigation [navigationItems]="headerItems">\n </cds-header-navigation>\n <cds-header-global>\n <cds-header-action #firstAction description="action">\n <svg\n width="20"\n height="20"\n xmlns="http://www.w3.org/2000/svg"\n viewBox="0 0 32 32"\n aria-hidden="true">\n <path\n d="M8.24 25.14L7 26.67a14 14 0 0 0 4.18 2.44l.68-1.88a12\n 12 0 0 1-3.62-2.09zm-4.05-7.07l-2 .35A13.89 13.89 0 0 0 3.86\n 23l1.73-1a11.9 11.9 0 0 1-1.4-3.93zm7.63-13.31l-.68-1.88A14\n 14 0 0 0 7 5.33l1.24 1.53a12 12 0 0 1 3.58-2.1zM5.59\n 10L3.86 9a13.89 13.89 0 0 0-1.64 4.54l2 .35A11.9 11.9 0 0 1 5.59\n 10zM16 2v2a12 12 0 0 1 0 24v2a14 14 0 0 0 0-28z" />\n </svg>\n </cds-header-action>\n <cds-header-action #secondAction description="action">\n <svg\n width="20"\n height="20"\n xmlns="http://www.w3.org/2000/svg"\n viewBox="0 0 32 32"\n aria-hidden="true">\n <path\n d="M8.24 25.14L7 26.67a14 14 0 0 0 4.18 2.44l.68-1.88a12\n 12 0 0 1-3.62-2.09zm-4.05-7.07l-2 .35A13.89 13.89 0 0 0 3.86\n 23l1.73-1a11.9 11.9 0 0 1-1.4-3.93zm7.63-13.31l-.68-1.88A14\n 14 0 0 0 7 5.33l1.24 1.53a12 12 0 0 1 3.58-2.1zM5.59\n 10L3.86 9a13.89 13.89 0 0 0-1.64 4.54l2 .35A11.9 11.9 0 0 1 5.59\n 10zM16 2v2a12 12 0 0 1 0 24v2a14 14 0 0 0 0-28z" />\n </svg>\n </cds-header-action>\n </cds-header-global>\n </cds-header>\n <cds-sidenav [navigationItems]="headerItems" style="margin-top: 3rem">\n <cds-sidenav-menu title="Category title">\n <svg icon width="20" height="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" aria-hidden="true">\n <path\n d="M8.24 25.14L7 26.67a14 14 0 0 0 4.18 2.44l.68-1.88a12\n 12 0 0 1-3.62-2.09zm-4.05-7.07l-2 .35A13.89 13.89 0 0 0 3.86\n 23l1.73-1a11.9 11.9 0 0 1-1.4-3.93zm7.63-13.31l-.68-1.88A14\n 14 0 0 0 7 5.33l1.24 1.53a12 12 0 0 1 3.58-2.1zM5.59\n 10L3.86 9a13.89 13.89 0 0 0-1.64 4.54l2 .35A11.9 11.9 0 0 1 5.59\n 10zM16 2v2a12 12 0 0 1 0 24v2a14 14 0 0 0 0-28z" />\n </svg>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n <cds-panel [expanded]="firstAction.active"></cds-panel>\n <cds-panel [expanded]="secondAction.active">\n <cds-switcher-list>\n <cds-switcher-list-item active="true">Switcher item one</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item two</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item three</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item four</cds-switcher-list-item>\n </cds-switcher-list>\n </cds-panel>\n </div>\n <router-outlet></router-outlet>\n '})).bind({});WithModel.args={options:[{content:"Option 1",value:1},{content:"Option 2",value:2},{content:"Option 3",value:3}],headerItems:[{type:"item",route:["foo"],content:"Catalog"},{type:"item",route:["bar"],content:"Docs"},{type:"item",route:["foo"],content:"Support"},{type:"menu",title:"Manage",trigger:"click",menuItems:[{type:"item",route:["foo"],content:"Link 1"},{type:"item",route:["bar"],content:"Link 2"}]}]},WithModel.argTypes={options:{control:!1},headerItems:{control:!1}};const AngularRouting=(args=>({props:args,template:'\n <div [cdsTheme]="theme">\n <cds-sidenav rail="true" [expanded]="false">\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" icon size="16"></svg>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n <div>\n '})).bind({});AngularRouting.storyName="Use angular router attributes for routing",Header.parameters={...Header.parameters,docs:{...Header.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div [cdsTheme]="theme">\n <cds-header name="[Platform]">\n <cds-hamburger *ngIf="hasHamburger" (click)="expanded($event)"></cds-hamburger>\n <cds-header-navigation>\n <cds-header-item>Catalog</cds-header-item>\n <cds-header-item isCurrentPage="true">Docs</cds-header-item>\n <cds-header-item>Support</cds-header-item>\n <cds-header-menu title="Manage">\n <cds-header-item>Link 1</cds-header-item>\n <cds-header-item>Link 2</cds-header-item>\n <cds-header-item>Link 3</cds-header-item>\n </cds-header-menu>\n </cds-header-navigation>\n <cds-header-global>\n <cds-header-action description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n <cds-header-action description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n </cds-header-global>\n </cds-header>\n </div>\n `\n})',...Header.parameters?.docs?.source}}},HeaderFluid.parameters={...HeaderFluid.parameters,docs:{...HeaderFluid.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/ui-shell/stories/header-fluid.component.ts\n --\x3e\n <app-header-fluid [headerItems]="headerItems"></app-header-fluid>\n `\n})',...HeaderFluid.parameters?.docs?.source}}},HeaderWithTemp.parameters={...HeaderWithTemp.parameters,docs:{...HeaderWithTemp.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div [cdsTheme]="theme">\n <cds-header name="[Platform]" [brand]="brandTemplate">\n <cds-hamburger *ngIf="hasHamburger" (click)="expanded($event)"></cds-hamburger>\n <cds-header-navigation>\n <cds-header-item>Catalog</cds-header-item>\n <cds-header-item>Docs</cds-header-item>\n <cds-header-item>Support</cds-header-item>\n <cds-header-menu title="Manage">\n <cds-header-item>Link 1</cds-header-item>\n <cds-header-item>Link 2</cds-header-item>\n <cds-header-item>Link 3</cds-header-item>\n </cds-header-menu>\n </cds-header-navigation>\n <cds-header-global>\n <cds-header-action description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n <cds-header-action description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n </cds-header-global>\n </cds-header>\n </div>\n <ng-template #brandTemplate>\n <a class="cds--header__name">\n <svg cdsIcon="carbon" size="32" style="stroke:white;fill:white"></svg>\n <span class="cds--header__name--prefix">IBM</span>\n [Platform]\n </a>\n </ng-template>\n `\n})',...HeaderWithTemp.parameters?.docs?.source}}},HeaderWithRouter.parameters={...HeaderWithRouter.parameters,docs:{...HeaderWithRouter.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div [cdsTheme]="theme">\n <cds-header name="[Platform]" [route]="[\'bar\']">\n <cds-header-navigation>\n <cds-header-item [route]="[\'foo\']">Catalog</cds-header-item>\n <cds-header-item [route]="[\'bar\']">Docs</cds-header-item>\n <cds-header-item [route]="[\'foo\']">Support</cds-header-item>\n <cds-header-menu title="Manage">\n <cds-header-item [route]="[\'foo\']">Link 1</cds-header-item>\n <cds-header-item [route]="[\'bar\']">Link 2</cds-header-item>\n <cds-header-item [route]="[\'foo\']">Link 3</cds-header-item>\n </cds-header-menu>\n </cds-header-navigation>\n </cds-header>\n </div>\n <div style="margin-top: 2rem">\n <router-outlet></router-outlet>\n </div>\n `\n})',...HeaderWithRouter.parameters?.docs?.source}}},SideNavigation.parameters={...SideNavigation.parameters,docs:{...SideNavigation.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div [cdsTheme]="theme">\n <cds-sidenav>\n <cds-sidenav-item [active]="true">\n Link\n </cds-sidenav-item>\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" icon size="16"></svg>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n </div>\n `\n})',...SideNavigation.parameters?.docs?.source}}},SideNavigationRouter.parameters={...SideNavigationRouter.parameters,docs:{...SideNavigationRouter.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div [cdsTheme]="theme">\n <cds-sidenav>\n <cds-sidenav-item [route]="[\'foo\']">\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-item [route]="[\'bar\']">\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" icon size="16"></svg>\n <cds-sidenav-item [route]="[\'foo\']">Link</cds-sidenav-item>\n <cds-sidenav-item [route]="[\'bar\']">Link</cds-sidenav-item>\n <cds-sidenav-item [route]="[\'foo\']">Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n </div>\n <div style="margin-left: 18rem">\n <router-outlet></router-outlet>\n </div>\n `\n})',...SideNavigationRouter.parameters?.docs?.source}}},SideNavigationUseRouter.parameters={...SideNavigationUseRouter.parameters,docs:{...SideNavigationUseRouter.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div [cdsTheme]="theme">\n <cds-sidenav>\n <cds-sidenav-item [route]="[\'foo\']" [useRouter]="true">\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-item [route]="[\'bar\']" [useRouter]="true" [routeExtras]="routeExtras">\n <svg cdsIcon="fade" size="16"></svg>\n Link with query params\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" icon size="16"></svg>\n <cds-sidenav-item [route]="[\'foo\']" [useRouter]="true">Link</cds-sidenav-item>\n <cds-sidenav-item [route]="[\'bar\']" [useRouter]="true">Link</cds-sidenav-item>\n <cds-sidenav-item [route]="[\'foo\']" [useRouter]="true">Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n </div>\n <div style="margin-left: 256px">\n <router-outlet></router-outlet>\n </div>\n `\n})',...SideNavigationUseRouter.parameters?.docs?.source}}},SidePanel.parameters={...SidePanel.parameters,docs:{...SidePanel.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div [cdsTheme]="theme">\n <cds-panel expanded="true">\n <cds-switcher-list>\n <cds-switcher-list-item [route]="[\'foo\']">Switcher item one</cds-switcher-list-item>\n <cds-switcher-list-item [route]="[\'bar\']">Switcher item two</cds-switcher-list-item>\n <cds-switcher-list-item [route]="[\'foo\']">Switcher item three</cds-switcher-list-item>\n <cds-switcher-list-item [route]="[\'bar\']">Switcher item four</cds-switcher-list-item>\n </cds-switcher-list>\n </cds-panel>\n </div>\n <div>\n <router-outlet></router-outlet>\n </div>\n `\n})',...SidePanel.parameters?.docs?.source}}},Together.parameters={...Together.parameters,docs:{...Together.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div>\n <cds-header name="[Platform]">\n <cds-hamburger *ngIf="hasHamburger" [active]="active" (selected)="active = !active"></cds-hamburger>\n <cds-header-navigation>\n <cds-header-item>Catalog</cds-header-item>\n <cds-header-item>Docs</cds-header-item>\n <cds-header-item>Support</cds-header-item>\n <cds-header-menu title="Manage">\n <cds-header-item>Link 1</cds-header-item>\n <cds-header-item>Link 2</cds-header-item>\n <cds-header-item>Link 3</cds-header-item>\n </cds-header-menu>\n </cds-header-navigation>\n <cds-header-global>\n <cds-header-action #firstAction description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n <cds-header-action [(active)]="secondAction" description="action">\n <svg cdsIcon="fade" size="20"></svg>\n </cds-header-action>\n </cds-header-global>\n </cds-header>\n <cds-sidenav [expanded]="active" style="margin-top: 3rem">\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" size="16"></svg>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item [active]="hasActiveChild">Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n <cds-panel [expanded]="firstAction.active"></cds-panel>\n <cds-panel [expanded]="secondAction">\n <cds-switcher-list>\n <cds-switcher-list-item active="true">Switcher item one</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item two</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item three</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item four</cds-switcher-list-item>\n </cds-switcher-list>\n </cds-panel>\n </div>\n `\n})',...Together.parameters?.docs?.source}}},SideNavigationRail.parameters={...SideNavigationRail.parameters,docs:{...SideNavigationRail.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div [cdsTheme]="theme">\n <cds-sidenav rail="true" [expanded]="false">\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" icon size="16"></svg>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n </div>\n `\n})',...SideNavigationRail.parameters?.docs?.source}}},WithModel.parameters={...WithModel.parameters,docs:{...WithModel.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div [cdsTheme]="theme">\n <cds-header name="[Platform]">\n <cds-hamburger *ngIf="hasHamburger" [active]="active" (selected)="active = !active"></cds-hamburger>\n <cds-header-navigation [navigationItems]="headerItems">\n </cds-header-navigation>\n <cds-header-global>\n <cds-header-action #firstAction description="action">\n <svg\n width="20"\n height="20"\n xmlns="http://www.w3.org/2000/svg"\n viewBox="0 0 32 32"\n aria-hidden="true">\n <path\n d="M8.24 25.14L7 26.67a14 14 0 0 0 4.18 2.44l.68-1.88a12\n 12 0 0 1-3.62-2.09zm-4.05-7.07l-2 .35A13.89 13.89 0 0 0 3.86\n 23l1.73-1a11.9 11.9 0 0 1-1.4-3.93zm7.63-13.31l-.68-1.88A14\n 14 0 0 0 7 5.33l1.24 1.53a12 12 0 0 1 3.58-2.1zM5.59\n 10L3.86 9a13.89 13.89 0 0 0-1.64 4.54l2 .35A11.9 11.9 0 0 1 5.59\n 10zM16 2v2a12 12 0 0 1 0 24v2a14 14 0 0 0 0-28z" />\n </svg>\n </cds-header-action>\n <cds-header-action #secondAction description="action">\n <svg\n width="20"\n height="20"\n xmlns="http://www.w3.org/2000/svg"\n viewBox="0 0 32 32"\n aria-hidden="true">\n <path\n d="M8.24 25.14L7 26.67a14 14 0 0 0 4.18 2.44l.68-1.88a12\n 12 0 0 1-3.62-2.09zm-4.05-7.07l-2 .35A13.89 13.89 0 0 0 3.86\n 23l1.73-1a11.9 11.9 0 0 1-1.4-3.93zm7.63-13.31l-.68-1.88A14\n 14 0 0 0 7 5.33l1.24 1.53a12 12 0 0 1 3.58-2.1zM5.59\n 10L3.86 9a13.89 13.89 0 0 0-1.64 4.54l2 .35A11.9 11.9 0 0 1 5.59\n 10zM16 2v2a12 12 0 0 1 0 24v2a14 14 0 0 0 0-28z" />\n </svg>\n </cds-header-action>\n </cds-header-global>\n </cds-header>\n <cds-sidenav [navigationItems]="headerItems" style="margin-top: 3rem">\n <cds-sidenav-menu title="Category title">\n <svg icon width="20" height="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" aria-hidden="true">\n <path\n d="M8.24 25.14L7 26.67a14 14 0 0 0 4.18 2.44l.68-1.88a12\n 12 0 0 1-3.62-2.09zm-4.05-7.07l-2 .35A13.89 13.89 0 0 0 3.86\n 23l1.73-1a11.9 11.9 0 0 1-1.4-3.93zm7.63-13.31l-.68-1.88A14\n 14 0 0 0 7 5.33l1.24 1.53a12 12 0 0 1 3.58-2.1zM5.59\n 10L3.86 9a13.89 13.89 0 0 0-1.64 4.54l2 .35A11.9 11.9 0 0 1 5.59\n 10zM16 2v2a12 12 0 0 1 0 24v2a14 14 0 0 0 0-28z" />\n </svg>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n <cds-panel [expanded]="firstAction.active"></cds-panel>\n <cds-panel [expanded]="secondAction.active">\n <cds-switcher-list>\n <cds-switcher-list-item active="true">Switcher item one</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item two</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item three</cds-switcher-list-item>\n <cds-switcher-list-item>Switcher item four</cds-switcher-list-item>\n </cds-switcher-list>\n </cds-panel>\n </div>\n <router-outlet></router-outlet>\n `\n})',...WithModel.parameters?.docs?.source}}},AngularRouting.parameters={...AngularRouting.parameters,docs:{...AngularRouting.parameters?.docs,source:{originalSource:'args => ({\n props: args,\n template: `\n <div [cdsTheme]="theme">\n <cds-sidenav rail="true" [expanded]="false">\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-item>\n <svg cdsIcon="fade" size="16"></svg>\n Link\n </cds-sidenav-item>\n <cds-sidenav-menu title="Category title">\n <svg cdsIcon="fade" icon size="16"></svg>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n <cds-sidenav-item>Link</cds-sidenav-item>\n </cds-sidenav-menu>\n </cds-sidenav>\n <div>\n `\n})',...AngularRouting.parameters?.docs?.source}}};const __namedExportsOrder=["Header","HeaderFluid","HeaderWithTemp","HeaderWithRouter","SideNavigation","SideNavigationRouter","SideNavigationUseRouter","SidePanel","Together","SideNavigationRail","WithModel","AngularRouting"]},"./src/search/search.component.html?ngResource":module=>{module.exports='<div\n\tclass="cds--search"\n\t[ngClass]="{\n\t\t\'cds--search--sm\': size === \'sm\',\n\t\t\'cds--search--md\': size === \'md\',\n\t\t\'cds--search--lg\': size === \'lg\',\n\t\t\'cds--search--light\': theme === \'light\',\n\t\t\'cds--skeleton\': skeleton && !fluid,\n\t\t\'cds--search--expandable\': expandable && !tableSearch,\n\t\t\'cds--search--expanded\': expandable && !tableSearch && active,\n\t\t\'cds--toolbar-search\': toolbar && !expandable,\n\t\t\'cds--toolbar-search--active\': toolbar && !expandable && active,\n\t\t\'cds--toolbar-search-container-persistent\': tableSearch && !expandable,\n\t\t\'cds--toolbar-search-container-expandable\': tableSearch && expandable,\n\t\t\'cds--toolbar-search-container-active\': tableSearch && expandable && active,\n\t\t\'cds--search--fluid\': fluid,\n\t\t\'cds--search--disabled\': disabled\n\t}"\n\trole="search"\n\t[attr.aria-label]="ariaLabel"\n\t(click)="openSearch()">\n\t<label\n\t\tclass="cds--label"\n\t\t[for]="id"\n\t\t[ngClass]="{ \'cds--skeleton\': skeleton && fluid }">\n\t\t{{ !skeleton ? label : \'\'}}\n\t</label>\n\n\t<div *ngIf="skeleton; else enableInput" class="cds--text-input cds--skeleton"></div>\n\t<ng-template #enableInput>\n\t\t<input\n\t\t\t#input\n\t\t\tclass="cds--search-input"\n\t\t\t[type]="tableSearch || !toolbar ? \'text\' : \'search\'"\n\t\t\t[id]="id"\n\t\t\t[value]="value"\n\t\t\t[autocomplete]="autocomplete"\n\t\t\t[placeholder]="placeholder"\n\t\t\t[disabled]="disabled"\n\t\t\t[required]="required"\n\t\t\t(input)="onSearch($event.target.value)"\n\t\t\t(keyup.enter)="onEnter()"/>\n\t\t<button\n\t\t\t*ngIf="!tableSearch && toolbar"\n\t\t\tclass="cds--toolbar-search__btn"\n\t\t\t(click)="openSearch()"\n\t\t\taria-label="Open search">\n\t\t\t<svg cdsIcon="search" size="16" class="cds--search-magnifier-icon"></svg>\n\t\t</button>\n\t\t<svg\n\t\t\tcdsIcon="search"\n\t\t\t*ngIf="tableSearch || !toolbar"\n\t\t\tclass="cds--search-magnifier-icon"\n\t\t\tsize="16">\n\t\t</svg>\n\t</ng-template>\n\n\t<button\n\t\t*ngIf="tableSearch || !toolbar"\n\t\tclass="cds--search-close"\n\t\t[ngClass]="{\n\t\t\t\'cds--search-close--hidden\': !value || value.length === 0\n\t\t}"\n\t\t[title]="clearButtonTitle"\n\t\t(click)="clearSearch()">\n\t\t<span class="cds--visually-hidden">{{ clearButtonTitle }}</span>\n\t\t<svg cdsIcon="close" size="16"></svg>\n\t</button>\n</div>\n'}}]);
|
|
@@ -55,6 +55,10 @@ export declare class Dropdown implements OnInit, AfterContentInit, AfterViewInit
|
|
|
55
55
|
protected dropdownService: DropdownService;
|
|
56
56
|
protected elementService: ElementService;
|
|
57
57
|
static dropdownCount: number;
|
|
58
|
+
get fluidInvalidClass(): boolean;
|
|
59
|
+
get fluidFocusClass(): boolean;
|
|
60
|
+
protected get writtenValue(): any[];
|
|
61
|
+
protected set writtenValue(val: any[]);
|
|
58
62
|
id: string;
|
|
59
63
|
/**
|
|
60
64
|
* Label for the dropdown.
|
|
@@ -189,6 +193,11 @@ export declare class Dropdown implements OnInit, AfterContentInit, AfterViewInit
|
|
|
189
193
|
*/
|
|
190
194
|
dropdownMenu: any;
|
|
191
195
|
hostClass: boolean;
|
|
196
|
+
hostWrapperClass: boolean;
|
|
197
|
+
/**
|
|
198
|
+
* Experimental: enable fluid state
|
|
199
|
+
*/
|
|
200
|
+
fluid: boolean;
|
|
192
201
|
/**
|
|
193
202
|
* Set to `true` if the dropdown is closed (not expanded).
|
|
194
203
|
*/
|
|
@@ -203,9 +212,8 @@ export declare class Dropdown implements OnInit, AfterContentInit, AfterViewInit
|
|
|
203
212
|
keyboardNav: any;
|
|
204
213
|
protected visibilitySubscription: Subscription;
|
|
205
214
|
protected onTouchedCallback: () => void;
|
|
215
|
+
protected _isFocused: boolean;
|
|
206
216
|
private _writtenValue;
|
|
207
|
-
protected get writtenValue(): any[];
|
|
208
|
-
protected set writtenValue(val: any[]);
|
|
209
217
|
/**
|
|
210
218
|
* Creates an instance of Dropdown.
|
|
211
219
|
*/
|
|
@@ -310,10 +318,11 @@ export declare class Dropdown implements OnInit, AfterContentInit, AfterViewInit
|
|
|
310
318
|
*/
|
|
311
319
|
toggleMenu(): void;
|
|
312
320
|
isTemplate(value: any): boolean;
|
|
321
|
+
handleFocus(event: FocusEvent): void;
|
|
313
322
|
/**
|
|
314
323
|
* Controls when it's needed to apply the selection feedback
|
|
315
324
|
*/
|
|
316
325
|
protected checkForReorder(): void;
|
|
317
326
|
static ɵfac: i0.ɵɵFactoryDeclaration<Dropdown, never>;
|
|
318
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<Dropdown, "cds-dropdown, ibm-dropdown", never, { "id": "id"; "label": "label"; "hideLabel": "hideLabel"; "helperText": "helperText"; "placeholder": "placeholder"; "displayValue": "displayValue"; "clearText": "clearText"; "size": "size"; "type": "type"; "theme": "theme"; "disabled": "disabled"; "readonly": "readonly"; "skeleton": "skeleton"; "inline": "inline"; "disableArrowKeys": "disableArrowKeys"; "invalid": "invalid"; "invalidText": "invalidText"; "warn": "warn"; "warnText": "warnText"; "appendInline": "appendInline"; "scrollableContainer": "scrollableContainer"; "itemValueKey": "itemValueKey"; "selectionFeedback": "selectionFeedback"; "menuButtonLabel": "menuButtonLabel"; "selectedLabel": "selectedLabel"; "dropUp": "dropUp"; }, { "selected": "selected"; "onClose": "onClose"; "close": "close"; }, ["view"], ["*"], false>;
|
|
327
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<Dropdown, "cds-dropdown, ibm-dropdown", never, { "id": "id"; "label": "label"; "hideLabel": "hideLabel"; "helperText": "helperText"; "placeholder": "placeholder"; "displayValue": "displayValue"; "clearText": "clearText"; "size": "size"; "type": "type"; "theme": "theme"; "disabled": "disabled"; "readonly": "readonly"; "skeleton": "skeleton"; "inline": "inline"; "disableArrowKeys": "disableArrowKeys"; "invalid": "invalid"; "invalidText": "invalidText"; "warn": "warn"; "warnText": "warnText"; "appendInline": "appendInline"; "scrollableContainer": "scrollableContainer"; "itemValueKey": "itemValueKey"; "selectionFeedback": "selectionFeedback"; "menuButtonLabel": "menuButtonLabel"; "selectedLabel": "selectedLabel"; "dropUp": "dropUp"; "fluid": "fluid"; }, { "selected": "selected"; "onClose": "onClose"; "close": "close"; }, ["view"], ["*"], false>;
|
|
319
328
|
}
|
|
@@ -41,6 +41,10 @@ export class IconButton extends BaseIconButton {
|
|
|
41
41
|
* Set to `true` to disable button
|
|
42
42
|
*/
|
|
43
43
|
this.disabled = false;
|
|
44
|
+
/**
|
|
45
|
+
* Indicates whether the tooltip should be shown when the button is disabled
|
|
46
|
+
*/
|
|
47
|
+
this.showTooltipWhenDisabled = false;
|
|
44
48
|
/**
|
|
45
49
|
* Common button events
|
|
46
50
|
*/
|
|
@@ -106,11 +110,11 @@ export class IconButton extends BaseIconButton {
|
|
|
106
110
|
}
|
|
107
111
|
IconButton.iconButtonCounter = 0;
|
|
108
112
|
IconButton.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IconButton, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
109
|
-
IconButton.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: { buttonNgClass: "buttonNgClass", buttonAttributes: "buttonAttributes", buttonId: "buttonId", kind: "kind", size: "size", type: "type", isExpressive: "isExpressive", disabled: "disabled", description: "description" }, outputs: { click: "click", focus: "focus", blur: "blur", tooltipClick: "tooltipClick" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
|
|
113
|
+
IconButton.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: { buttonNgClass: "buttonNgClass", buttonAttributes: "buttonAttributes", buttonId: "buttonId", kind: "kind", size: "size", type: "type", isExpressive: "isExpressive", disabled: "disabled", description: "description", showTooltipWhenDisabled: "showTooltipWhenDisabled" }, outputs: { click: "click", focus: "focus", blur: "blur", tooltipClick: "tooltipClick" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
|
|
110
114
|
<cds-tooltip
|
|
111
115
|
class="cds--icon-tooltip"
|
|
112
116
|
[description]="description"
|
|
113
|
-
[disabled]="disabled"
|
|
117
|
+
[disabled]="showTooltipWhenDisabled ? false : disabled"
|
|
114
118
|
[caret]="caret"
|
|
115
119
|
[dropShadow]="dropShadow"
|
|
116
120
|
[highContrast]="highContrast"
|
|
@@ -145,7 +149,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
145
149
|
<cds-tooltip
|
|
146
150
|
class="cds--icon-tooltip"
|
|
147
151
|
[description]="description"
|
|
148
|
-
[disabled]="disabled"
|
|
152
|
+
[disabled]="showTooltipWhenDisabled ? false : disabled"
|
|
149
153
|
[caret]="caret"
|
|
150
154
|
[dropShadow]="dropShadow"
|
|
151
155
|
[highContrast]="highContrast"
|
|
@@ -194,6 +198,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
194
198
|
type: Input
|
|
195
199
|
}], description: [{
|
|
196
200
|
type: Input
|
|
201
|
+
}], showTooltipWhenDisabled: [{
|
|
202
|
+
type: Input
|
|
197
203
|
}], click: [{
|
|
198
204
|
type: Output
|
|
199
205
|
}], focus: [{
|
|
@@ -203,4 +209,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
203
209
|
}], tooltipClick: [{
|
|
204
210
|
type: Output
|
|
205
211
|
}] } });
|
|
206
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
212
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi1idXR0b24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2J1dHRvbi9pY29uLWJ1dHRvbi5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUVOLFNBQVMsRUFFVCxZQUFZLEVBQ1osS0FBSyxFQUNMLE1BQU0sRUFHTixTQUFTLEVBQ1QsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLDhCQUE4QixDQUFDOzs7OztBQUc5RDs7Ozs7Ozs7R0FRRztBQW1DSCxNQUFNLE9BQU8sVUFBVyxTQUFRLGNBQWM7SUF1RjdDLFlBQW9CLFFBQW1CO1FBQ3RDLEtBQUssRUFBRSxDQUFDO1FBRFcsYUFBUSxHQUFSLFFBQVEsQ0FBVztRQS9DdkM7O1dBRUc7UUFDTSxhQUFRLEdBQUcsWUFBWSxVQUFVLENBQUMsaUJBQWlCLEVBQUUsRUFBRSxDQUFDO1FBQ2pFOztXQUVHO1FBQ00sU0FBSSxHQUFlLFNBQVMsQ0FBQztRQUN0Qzs7V0FFRztRQUNNLFNBQUksR0FBZSxJQUFJLENBQUM7UUFDakM7O1dBRUc7UUFDTSxTQUFJLEdBQUcsUUFBUSxDQUFDO1FBQ3pCOztXQUVHO1FBQ00saUJBQVksR0FBRyxLQUFLLENBQUM7UUFDOUI7O1dBRUc7UUFDTSxhQUFRLEdBQUcsS0FBSyxDQUFDO1FBSzFCOztXQUVHO1FBQ00sNEJBQXVCLEdBQUcsS0FBSyxDQUFDO1FBRXpDOztXQUVHO1FBQ08sVUFBSyxHQUFHLElBQUksWUFBWSxFQUFTLENBQUM7UUFDbEMsVUFBSyxHQUFHLElBQUksWUFBWSxFQUFTLENBQUM7UUFDbEMsU0FBSSxHQUFHLElBQUksWUFBWSxFQUFTLENBQUM7UUFDM0M7O1dBRUc7UUFDTyxpQkFBWSxHQUFHLElBQUksWUFBWSxFQUFTLENBQUM7UUFFM0MsY0FBUyxHQUErQixFQUFFLENBQUM7UUFDM0Msa0JBQWEsR0FBOEIsRUFBRSxDQUFDO0lBSXRELENBQUM7SUF4RkQ7O09BRUc7SUFDSCxJQUFhLGFBQWEsQ0FBQyxHQUErQjtRQUN6RCxJQUFJLENBQUMsU0FBUyxHQUFHLE1BQU0sQ0FBQyxNQUFNLENBQUMsRUFBRSxvQkFBb0IsRUFBRSxJQUFJLENBQUMsUUFBUSxFQUFFLEVBQUUsR0FBRyxDQUFDLENBQUM7SUFDOUUsQ0FBQztJQUVELElBQUksYUFBYTtRQUNoQixPQUFPLElBQUksQ0FBQyxTQUFTLENBQUM7SUFDdkIsQ0FBQztJQUVEOzs7O09BSUc7SUFDSCxJQUFhLGdCQUFnQixDQUFDLEdBQThCO1FBQzNELElBQUksSUFBSSxDQUFDLE1BQU0sRUFBRTtZQUNoQix3QkFBd0I7WUFDeEIsTUFBTSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUMsR0FBVyxFQUFFLEVBQUU7Z0JBQ3ZELElBQUksQ0FBQyxRQUFRLENBQUMsZUFBZSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsYUFBYSxFQUFFLEdBQUcsQ0FBQyxDQUFDO1lBQy9ELENBQUMsQ0FBQyxDQUFDO1lBQ0gscUJBQXFCO1lBQ3JCLE1BQU0sQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUMsR0FBVyxFQUFFLEVBQUU7Z0JBQ3hDLElBQUksQ0FBQyxRQUFRLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsYUFBYSxFQUFFLEdBQUcsRUFBRSxHQUFHLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQztZQUN0RSxDQUFDLENBQUMsQ0FBQztTQUNIO1FBQ0QscUJBQXFCO1FBQ3JCLElBQUksQ0FBQyxhQUFhLEdBQUcsR0FBRyxDQUFDO0lBQzFCLENBQUM7SUFFRCxJQUFJLGdCQUFnQjtRQUNuQixPQUFPLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQztJQUM5QixDQUFDO0lBeURELGVBQWU7UUFDZCx1Q0FBdUM7UUFDdkMsSUFBSSxDQUFDLGdCQUFnQixHQUFHLElBQUksQ0FBQyxhQUFhLENBQUM7SUFDNUMsQ0FBQztJQUVEOzs7T0FHRztJQUNILGNBQWMsQ0FBQyxLQUFLLEVBQUUsVUFBZ0MsUUFBUTtRQUM3RCxLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7UUFDdkIsS0FBSyxDQUFDLGVBQWUsRUFBRSxDQUFDO1FBQ3hCLHVGQUF1RjtRQUN2RixJQUFJLE9BQU8sS0FBSyxTQUFTLEVBQUU7WUFDMUIsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDOUIsT0FBTztTQUNQO1FBQ0QsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDeEIsQ0FBQzs7QUF6RU0sNEJBQWlCLEdBQUcsQ0FBQyxDQUFDO3VHQXBDakIsVUFBVTsyRkFBVixVQUFVLGdqQkFoQ1o7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztFQThCVDsyRkFFVyxVQUFVO2tCQWxDdEIsU0FBUzttQkFBQztvQkFDVixRQUFRLEVBQUUsa0NBQWtDO29CQUM1QyxRQUFRLEVBQUU7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztFQThCVDtpQkFDRDtnR0FLYSxhQUFhO3NCQUF6QixLQUFLO2dCQWFPLGdCQUFnQjtzQkFBNUIsS0FBSztnQkFxQmUsTUFBTTtzQkFBMUIsU0FBUzt1QkFBQyxRQUFRO2dCQUtWLFFBQVE7c0JBQWhCLEtBQUs7Z0JBSUcsSUFBSTtzQkFBWixLQUFLO2dCQUlHLElBQUk7c0JBQVosS0FBSztnQkFJRyxJQUFJO3NCQUFaLEtBQUs7Z0JBSUcsWUFBWTtzQkFBcEIsS0FBSztnQkFJRyxRQUFRO3NCQUFoQixLQUFLO2dCQUlHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBSUcsdUJBQXVCO3NCQUEvQixLQUFLO2dCQUtJLEtBQUs7c0JBQWQsTUFBTTtnQkFDRyxLQUFLO3NCQUFkLE1BQU07Z0JBQ0csSUFBSTtzQkFBYixNQUFNO2dCQUlHLFlBQVk7c0JBQXJCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuXHRBZnRlclZpZXdJbml0LFxuXHRDb21wb25lbnQsXG5cdEVsZW1lbnRSZWYsXG5cdEV2ZW50RW1pdHRlcixcblx0SW5wdXQsXG5cdE91dHB1dCxcblx0UmVuZGVyZXIyLFxuXHRUZW1wbGF0ZVJlZixcblx0Vmlld0NoaWxkXG59IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBCYXNlSWNvbkJ1dHRvbiB9IGZyb20gXCIuL2Jhc2UtaWNvbi1idXR0b24uY29tcG9uZW50XCI7XG5pbXBvcnQgeyBCdXR0b25TaXplLCBCdXR0b25UeXBlIH0gZnJvbSBcIi4vYnV0dG9uLnR5cGVzXCI7XG5cbi8qKlxuICogR2V0IHN0YXJ0ZWQgd2l0aCBpbXBvcnRpbmcgdGhlIG1vZHVsZTpcbiAqXG4gKiBgYGB0eXBlc2NyaXB0XG4gKiBpbXBvcnQgeyBCdXR0b25Nb2R1bGUgfSBmcm9tICdjYXJib24tY29tcG9uZW50cy1hbmd1bGFyJztcbiAqIGBgYFxuICpcbiAqIFtTZWUgZGVtb10oLi4vLi4vP3BhdGg9L3N0b3J5L2NvbXBvbmVudHMtYnV0dG9uLWljb24tYnV0dG9uLS1iYXNpYylcbiAqL1xuQENvbXBvbmVudCh7XG5cdHNlbGVjdG9yOiBcImNkcy1pY29uLWJ1dHRvbiwgaWJtLWljb24tYnV0dG9uXCIsXG5cdHRlbXBsYXRlOiBgXG5cdDxjZHMtdG9vbHRpcFxuXHRcdGNsYXNzPVwiY2RzLS1pY29uLXRvb2x0aXBcIlxuXHRcdFtkZXNjcmlwdGlvbl09XCJkZXNjcmlwdGlvblwiXG5cdFx0W2Rpc2FibGVkXT1cInNob3dUb29sdGlwV2hlbkRpc2FibGVkID8gZmFsc2UgOiBkaXNhYmxlZFwiXG5cdFx0W2NhcmV0XT1cImNhcmV0XCJcblx0XHRbZHJvcFNoYWRvd109XCJkcm9wU2hhZG93XCJcblx0XHRbaGlnaENvbnRyYXN0XT1cImhpZ2hDb250cmFzdFwiXG5cdFx0W2lzT3Blbl09XCJpc09wZW5cIlxuXHRcdFthbGlnbl09XCJhbGlnblwiXG5cdFx0W2F1dG9BbGlnbl09XCJhdXRvQWxpZ25cIlxuXHRcdFtlbnRlckRlbGF5TXNdPVwiZW50ZXJEZWxheU1zXCJcblx0XHRbbGVhdmVEZWxheU1zXT1cImxlYXZlRGVsYXlNc1wiXG5cdFx0KGNsaWNrKT1cImVtaXRDbGlja0V2ZW50KCRldmVudCwgJ3Rvb2x0aXAnKVwiPlxuXHRcdDxidXR0b25cblx0XHRcdCNidXR0b25cblx0XHRcdFtpZF09XCJidXR0b25JZFwiXG5cdFx0XHRbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxuXHRcdFx0W2F0dHIudHlwZV09XCJ0eXBlXCJcblx0XHRcdFtpY29uT25seV09XCJ0cnVlXCJcblx0XHRcdFtuZ0NsYXNzXT1cImJ1dHRvbk5nQ2xhc3NcIlxuXHRcdFx0W2Nkc0J1dHRvbl09XCJraW5kXCJcblx0XHRcdFtzaXplXT1cInNpemVcIlxuXHRcdFx0W2lzRXhwcmVzc2l2ZV09XCJpc0V4cHJlc3NpdmVcIlxuXHRcdFx0KGNsaWNrKT1cImVtaXRDbGlja0V2ZW50KCRldmVudClcIlxuXHRcdFx0KGZvY3VzKT1cImZvY3VzLmVtaXQoJGV2ZW50KVwiXG5cdFx0XHQoYmx1cik9XCJibHVyLmVtaXQoJGV2ZW50KVwiPlxuXHRcdFx0PG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuXHRcdDwvYnV0dG9uPlxuXHQ8L2Nkcy10b29sdGlwPlxuXHRgXG59KVxuZXhwb3J0IGNsYXNzIEljb25CdXR0b24gZXh0ZW5kcyBCYXNlSWNvbkJ1dHRvbiBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuXHQvKipcblx0ICogUGFzcyBnbG9iYWwgY2FyYm9uIGNsYXNzZXMgdG8gaWNvbiBidXR0b25cblx0ICovXG5cdEBJbnB1dCgpIHNldCBidXR0b25OZ0NsYXNzKG9iajogeyBba2V5OiBzdHJpbmddOiBib29sZWFuIH0pIHtcblx0XHR0aGlzLmNsYXNzTGlzdCA9IE9iamVjdC5hc3NpZ24oeyBcImNkcy0tYnRuLS1kaXNhYmxlZFwiOiB0aGlzLmRpc2FibGVkIH0sIG9iaik7XG5cdH1cblxuXHRnZXQgYnV0dG9uTmdDbGFzcygpIHtcblx0XHRyZXR1cm4gdGhpcy5jbGFzc0xpc3Q7XG5cdH1cblxuXHQvKipcblx0ICogQHBhcmFtIG9iajogeyBba2V5OiBzdHJpbmddOiBzdHJpbmdcblx0ICogVXNlciBjYW4gcGFzcyBhZGRpdGlvbmFsIGJ1dHRvbiBhdHRyaWJ1dGVzIGlmIGNvbXBvbmVudCBwcm9wZXJ0eSBkb2VzIG5vdCBhbHJlYWR5IGV4aXN0XG5cdCAqIEtleSBpcyB0aGUgYXR0cmlidXRlIG5hbWUgJiB2YWx1ZSBpcyB0aGUgYXR0cmlidXRlIHZhbHVlIGZvciB0aGUgYnV0dG9uXG5cdCAqL1xuXHRASW5wdXQoKSBzZXQgYnV0dG9uQXR0cmlidXRlcyhvYmo6IHsgW2tleTogc3RyaW5nXTogc3RyaW5nIH0pIHtcblx0XHRpZiAodGhpcy5idXR0b24pIHtcblx0XHRcdC8vIFJlbW92ZSBvbGQgYXR0cmlidXRlc1xuXHRcdFx0T2JqZWN0LmtleXModGhpcy5hdHRyaWJ1dGVMaXN0KS5mb3JFYWNoKChrZXk6IHN0cmluZykgPT4ge1xuXHRcdFx0XHR0aGlzLnJlbmRlcmVyLnJlbW92ZUF0dHJpYnV0ZSh0aGlzLmJ1dHRvbi5uYXRpdmVFbGVtZW50LCBrZXkpO1xuXHRcdFx0fSk7XG5cdFx0XHQvLyBTZXQgbmV3IGF0dHJpYnV0ZXNcblx0XHRcdE9iamVjdC5rZXlzKG9iaikuZm9yRWFjaCgoa2V5OiBzdHJpbmcpID0+IHtcblx0XHRcdFx0dGhpcy5yZW5kZXJlci5zZXRBdHRyaWJ1dGUodGhpcy5idXR0b24ubmF0aXZlRWxlbWVudCwga2V5LCBvYmpba2V5XSk7XG5cdFx0XHR9KTtcblx0XHR9XG5cdFx0Ly8gU2V0IG5ldyBhdHRyaWJ1dGVzXG5cdFx0dGhpcy5hdHRyaWJ1dGVMaXN0ID0gb2JqO1xuXHR9XG5cblx0Z2V0IGJ1dHRvbkF0dHJpYnV0ZXMoKSB7XG5cdFx0cmV0dXJuIHRoaXMuYnV0dG9uQXR0cmlidXRlcztcblx0fVxuXG5cdHN0YXRpYyBpY29uQnV0dG9uQ291bnRlciA9IDA7XG5cblx0QFZpZXdDaGlsZChcImJ1dHRvblwiKSBidXR0b246IEVsZW1lbnRSZWY7XG5cblx0LyoqXG5cdCAqIE92ZXJyaWRlIGlkXG5cdCAqL1xuXHRASW5wdXQoKSBidXR0b25JZCA9IGBpY29uLWJ0bi0ke0ljb25CdXR0b24uaWNvbkJ1dHRvbkNvdW50ZXIrK31gO1xuXHQvKipcblx0ICogU2V0cyB0aGUgYnV0dG9uIHR5cGUuXG5cdCAqL1xuXHRASW5wdXQoKSBraW5kOiBCdXR0b25UeXBlID0gXCJwcmltYXJ5XCI7XG5cdC8qKlxuXHQgKiBTcGVjaWZ5IHRoZSBzaXplIG9mIHRoZSBidXR0b24uXG5cdCAqL1xuXHRASW5wdXQoKSBzaXplOiBCdXR0b25TaXplID0gXCJsZ1wiO1xuXHQvKipcblx0ICogU2V0IGJ1dHRvbiB0eXBlLCBgYnV0dG9uYCBieSBkZWZhdWx0XG5cdCAqL1xuXHRASW5wdXQoKSB0eXBlID0gXCJidXR0b25cIjtcblx0LyoqXG5cdCAqIFNldCB0byBgdHJ1ZWAgdG8gbWFrZSBidXR0b24gZXhwcmVzc2l2ZVxuXHQgKi9cblx0QElucHV0KCkgaXNFeHByZXNzaXZlID0gZmFsc2U7XG5cdC8qKlxuXHQgKiBTZXQgdG8gYHRydWVgIHRvIGRpc2FibGUgYnV0dG9uXG5cdCAqL1xuXHRASW5wdXQoKSBkaXNhYmxlZCA9IGZhbHNlO1xuXHQvKipcblx0ICogVGhlIHN0cmluZyBvciB0ZW1wbGF0ZSBjb250ZW50IHRvIGJlIGV4cG9zZWQgYnkgdGhlIHRvb2x0aXAuXG5cdCAqL1xuXHRASW5wdXQoKSBkZXNjcmlwdGlvbjogc3RyaW5nIHwgVGVtcGxhdGVSZWY8YW55Pjtcblx0LyoqXG5cdCAqIEluZGljYXRlcyB3aGV0aGVyIHRoZSB0b29sdGlwIHNob3VsZCBiZSBzaG93biB3aGVuIHRoZSBidXR0b24gaXMgZGlzYWJsZWRcblx0ICovXG5cdEBJbnB1dCgpIHNob3dUb29sdGlwV2hlbkRpc2FibGVkID0gZmFsc2U7XG5cblx0LyoqXG5cdCAqIENvbW1vbiBidXR0b24gZXZlbnRzXG5cdCAqL1xuXHRAT3V0cHV0KCkgY2xpY2sgPSBuZXcgRXZlbnRFbWl0dGVyPEV2ZW50PigpO1xuXHRAT3V0cHV0KCkgZm9jdXMgPSBuZXcgRXZlbnRFbWl0dGVyPEV2ZW50PigpO1xuXHRAT3V0cHV0KCkgYmx1ciA9IG5ldyBFdmVudEVtaXR0ZXI8RXZlbnQ+KCk7XG5cdC8qKlxuXHQgKiBFdmVudCB0byBlbWl0IHdoZW4gY2xpY2sgZXZlbnQgaXMgZmlyZWQgZnJvbSB0b29sdGlwXG5cdCAqL1xuXHRAT3V0cHV0KCkgdG9vbHRpcENsaWNrID0gbmV3IEV2ZW50RW1pdHRlcjxFdmVudD4oKTtcblxuXHRwcml2YXRlIGNsYXNzTGlzdDogeyBba2V5OiBzdHJpbmddOiBib29sZWFuIH0gPSB7fTtcblx0cHJpdmF0ZSBhdHRyaWJ1dGVMaXN0OiB7IFtrZXk6IHN0cmluZ106IHN0cmluZyB9ID0ge307XG5cblx0Y29uc3RydWN0b3IocHJpdmF0ZSByZW5kZXJlcjogUmVuZGVyZXIyKSB7XG5cdFx0c3VwZXIoKTtcblx0fVxuXG5cdG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcblx0XHQvLyBTZXQgYXR0cmlidXRlcyBvbmNlIGVsZW1lbnQgaXMgZm91bmRcblx0XHR0aGlzLmJ1dHRvbkF0dHJpYnV0ZXMgPSB0aGlzLmF0dHJpYnV0ZUxpc3Q7XG5cdH1cblxuXHQvKipcblx0ICogU3RvcCBwcm9wb2dhdGlvbiBvZiBjbGljayBldmVudFxuXHQgKiBFbHNlIGRvdWJsZSBmaXJlcyAoY2xpY2spIGV2ZW50XG5cdCAqL1xuXHRlbWl0Q2xpY2tFdmVudChldmVudCwgZWxlbWVudDogXCJ0b29sdGlwXCIgfCBcImJ1dHRvblwiID0gXCJidXR0b25cIikge1xuXHRcdGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG5cdFx0ZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG5cdFx0Ly8gUHJldmVudHMgKGNsaWNrKSBldmVudCBmcm9tIGJ1YmJsaW5nIHNpbmNlIGl0IHdvdWxkIGFwcGVhciB1c2VyIGNsaWNrZWQgdGhlIGBidXR0b25gXG5cdFx0aWYgKGVsZW1lbnQgPT09IFwidG9vbHRpcFwiKSB7XG5cdFx0XHR0aGlzLnRvb2x0aXBDbGljay5lbWl0KGV2ZW50KTtcblx0XHRcdHJldHVybjtcblx0XHR9XG5cdFx0dGhpcy5jbGljay5lbWl0KGV2ZW50KTtcblx0fVxufVxuIl19
|
|
@@ -305,7 +305,7 @@ CodeSnippet.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
|
305
305
|
<ng-template #codeTemplate>
|
|
306
306
|
<ng-content></ng-content>
|
|
307
307
|
</ng-template>
|
|
308
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "directive", type: i5.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }] });
|
|
308
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "directive", type: i5.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }] });
|
|
309
309
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CodeSnippet, decorators: [{
|
|
310
310
|
type: Component,
|
|
311
311
|
args: [{
|