carbon-components-angular/docs/storybook/tag-tag-stories.b4426a9b.iframe.bundle.js

Next generation components

"use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[3867],{"./src/icon/icon.directive.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{a:()=>IconDirective});var tslib__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_icon_service__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/icon/icon.service.ts"),_carbon_icon_helpers__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@carbon/icon-helpers/es/index.js");let IconDirective=class IconDirective{constructor(elementRef,iconService){this.elementRef=elementRef,this.iconService=iconService,this.cdsIcon="",this.size="16",this.title="",this.ariaLabel="",this.ariaLabelledBy="",this.ariaHidden="",this.isFocusable=!1}set ibmIcon(iconName){this.cdsIcon=iconName}renderIcon(iconName){const root=this.elementRef.nativeElement;let icon;try{icon=this.iconService.get(iconName,this.size.toString())}catch(error){return void console.warn(error)}const domParser=new DOMParser,rawSVG=icon.svg,svgElement=domParser.parseFromString(rawSVG,"image/svg+xml").documentElement;let node="SVG"!==root.tagName.toUpperCase()?svgElement:svgElement.firstChild;for(root.innerHTML="";node;)root.appendChild(root.ownerDocument.importNode(node,!0)),node=node.nextSibling;const svg="SVG"!==root.tagName.toUpperCase()?svgElement:root,xmlns="http://www.w3.org/2000/svg";svg.setAttribute("xmlns",xmlns);const attributes=(0,_carbon_icon_helpers__WEBPACK_IMPORTED_MODULE_1__.u9)({width:icon.attrs.width,height:icon.attrs.height,viewBox:icon.attrs.viewBox,title:this.title,"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledBy,"aria-hidden":this.ariaHidden,focusable:this.isFocusable.toString(),fill:icon.attrs.fill}),attrKeys=Object.keys(attributes);for(let i=0;i<attrKeys.length;i++){const key=attrKeys[i],value=attributes[key];"title"!==key&&(value&&svg.setAttribute(key,value))}if(attributes.title){const title=document.createElementNS(xmlns,"title");title.textContent=attributes.title,IconDirective.titleIdCounter++,title.setAttribute("id",`${icon.name}-title-${IconDirective.titleIdCounter}`),svg.insertBefore(title,svg.firstElementChild),svg.setAttribute("aria-labelledby",`${icon.name}-title-${IconDirective.titleIdCounter}`)}}ngAfterViewInit(){this.renderIcon(this.cdsIcon)}ngOnChanges({cdsIcon}){cdsIcon&&!cdsIcon.isFirstChange()&&this.renderIcon(this.cdsIcon)}};IconDirective.titleIdCounter=0,IconDirective.ctorParameters=()=>[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.ElementRef},{type:_icon_service__WEBPACK_IMPORTED_MODULE_0__.C6}],IconDirective.propDecorators={ibmIcon:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],cdsIcon:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],size:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],title:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],ariaLabel:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],ariaLabelledBy:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],ariaHidden:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}],isFocusable:[{type:_angular_core__WEBPACK_IMPORTED_MODULE_2__.Input}]},IconDirective=(0,tslib__WEBPACK_IMPORTED_MODULE_3__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_2__.Directive)({selector:"[cdsIcon], [ibmIcon]"})],IconDirective)},"./src/icon/icon.module.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{QX:()=>IconModule});var tslib__WEBPACK_IMPORTED_MODULE_58__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_57__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_angular_common__WEBPACK_IMPORTED_MODULE_59__=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),_icon_directive__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/icon/icon.directive.ts"),_icon_service__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/icon/icon.service.ts"),_carbon_icons_es_add_16__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@carbon/icons/es/add/16.js"),_carbon_icons_es_add_20__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@carbon/icons/es/add/20.js"),_carbon_icons_es_bee_16__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@carbon/icons/es/bee/16.js"),_carbon_icons_es_bee_20__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@carbon/icons/es/bee/20.js"),_carbon_icons_es_calendar_16__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@carbon/icons/es/calendar/16.js"),_carbon_icons_es_carbon_16__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@carbon/icons/es/carbon/16.js"),_carbon_icons_es_carbon_20__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./node_modules/@carbon/icons/es/carbon/20.js"),_carbon_icons_es_caret_down_16__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__("./node_modules/@carbon/icons/es/caret--down/16.js"),_carbon_icons_es_caret_left_16__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/@carbon/icons/es/caret--left/16.js"),_carbon_icons_es_caret_right_16__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/@carbon/icons/es/caret--right/16.js"),_carbon_icons_es_caret_up_16__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/@carbon/icons/es/caret--up/16.js"),_carbon_icons_es_checkmark_16__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark/16.js"),_carbon_icons_es_checkmark_filled_16__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--filled/16.js"),_carbon_icons_es_checkmark_filled_20__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--filled/20.js"),_carbon_icons_es_checkmark_outline_16__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./node_modules/@carbon/icons/es/checkmark--outline/16.js"),_carbon_icons_es_checkbox_16__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./node_modules/@carbon/icons/es/checkbox/16.js"),_carbon_icons_es_checkbox_checked_filled_16__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./node_modules/@carbon/icons/es/checkbox--checked--filled/16.js"),_carbon_icons_es_chevron_down_16__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./node_modules/@carbon/icons/es/chevron--down/16.js"),_carbon_icons_es_chevron_right_16__WEBPACK_IMPORTED_MODULE_20__=__webpack_require__("./node_modules/@carbon/icons/es/chevron--right/16.js"),_carbon_icons_es_circle_dash_16__WEBPACK_IMPORTED_MODULE_21__=__webpack_require__("./node_modules/@carbon/icons/es/circle-dash/16.js"),_carbon_icons_es_close_16__WEBPACK_IMPORTED_MODULE_22__=__webpack_require__("./node_modules/@carbon/icons/es/close/16.js"),_carbon_icons_es_close_20__WEBPACK_IMPORTED_MODULE_23__=__webpack_require__("./node_modules/@carbon/icons/es/close/20.js"),_carbon_icons_es_copy_16__WEBPACK_IMPORTED_MODULE_24__=__webpack_require__("./node_modules/@carbon/icons/es/copy/16.js"),_carbon_icons_es_copy_20__WEBPACK_IMPORTED_MODULE_25__=__webpack_require__("./node_modules/@carbon/icons/es/copy/20.js"),_carbon_icons_es_data_2_16__WEBPACK_IMPORTED_MODULE_26__=__webpack_require__("./node_modules/@carbon/icons/es/data--2/16.js"),_carbon_icons_es_data_2_20__WEBPACK_IMPORTED_MODULE_27__=__webpack_require__("./node_modules/@carbon/icons/es/data--2/20.js"),_carbon_icons_es_document_16__WEBPACK_IMPORTED_MODULE_28__=__webpack_require__("./node_modules/@carbon/icons/es/document/16.js"),_carbon_icons_es_document_20__WEBPACK_IMPORTED_MODULE_29__=__webpack_require__("./node_modules/@carbon/icons/es/document/20.js"),_carbon_icons_es_download_16__WEBPACK_IMPORTED_MODULE_30__=__webpack_require__("./node_modules/@carbon/icons/es/download/16.js"),_carbon_icons_es_error_filled_16__WEBPACK_IMPORTED_MODULE_31__=__webpack_require__("./node_modules/@carbon/icons/es/error--filled/16.js"),_carbon_icons_es_error_filled_20__WEBPACK_IMPORTED_MODULE_32__=__webpack_require__("./node_modules/@carbon/icons/es/error--filled/20.js"),_carbon_icons_es_fade_16__WEBPACK_IMPORTED_MODULE_33__=__webpack_require__("./node_modules/@carbon/icons/es/fade/16.js"),_carbon_icons_es_fade_20__WEBPACK_IMPORTED_MODULE_34__=__webpack_require__("./node_modules/@carbon/icons/es/fade/20.js"),_carbon_icons_es_folder_16__WEBPACK_IMPORTED_MODULE_35__=__webpack_require__("./node_modules/@carbon/icons/es/folder/16.js"),_carbon_icons_es_incomplete_16__WEBPACK_IMPORTED_MODULE_36__=__webpack_require__("./node_modules/@carbon/icons/es/incomplete/16.js"),_carbon_icons_es_information_filled_16__WEBPACK_IMPORTED_MODULE_37__=__webpack_require__("./node_modules/@carbon/icons/es/information--filled/16.js"),_carbon_icons_es_information_filled_20__WEBPACK_IMPORTED_MODULE_38__=__webpack_require__("./node_modules/@carbon/icons/es/information--filled/20.js"),_carbon_icons_es_information_square_filled_20__WEBPACK_IMPORTED_MODULE_39__=__webpack_require__("./node_modules/@carbon/icons/es/information--square--filled/20.js"),_carbon_icons_es_menu_16__WEBPACK_IMPORTED_MODULE_40__=__webpack_require__("./node_modules/@carbon/icons/es/menu/16.js"),_carbon_icons_es_menu_20__WEBPACK_IMPORTED_MODULE_41__=__webpack_require__("./node_modules/@carbon/icons/es/menu/20.js"),_carbon_icons_es_overflow_menu_vertical_16__WEBPACK_IMPORTED_MODULE_42__=__webpack_require__("./node_modules/@carbon/icons/es/overflow-menu--vertical/16.js"),_carbon_icons_es_overflow_menu_horizontal_16__WEBPACK_IMPORTED_MODULE_43__=__webpack_require__("./node_modules/@carbon/icons/es/overflow-menu--horizontal/16.js"),_carbon_icons_es_save_16__WEBPACK_IMPORTED_MODULE_44__=__webpack_require__("./node_modules/@carbon/icons/es/save/16.js"),_carbon_icons_es_search_16__WEBPACK_IMPORTED_MODULE_45__=__webpack_require__("./node_modules/@carbon/icons/es/search/16.js"),_carbon_icons_es_settings_16__WEBPACK_IMPORTED_MODULE_46__=__webpack_require__("./node_modules/@carbon/icons/es/settings/16.js"),_carbon_icons_es_settings_adjust_16__WEBPACK_IMPORTED_MODULE_47__=__webpack_require__("./node_modules/@carbon/icons/es/settings--adjust/16.js"),_carbon_icons_es_subtract_16__WEBPACK_IMPORTED_MODULE_48__=__webpack_require__("./node_modules/@carbon/icons/es/subtract/16.js"),_carbon_icons_es_trash_can_16__WEBPACK_IMPORTED_MODULE_49__=__webpack_require__("./node_modules/@carbon/icons/es/trash-can/16.js"),_carbon_icons_es_warning_16__WEBPACK_IMPORTED_MODULE_50__=__webpack_require__("./node_modules/@carbon/icons/es/warning/16.js"),_carbon_icons_es_warning_filled_16__WEBPACK_IMPORTED_MODULE_51__=__webpack_require__("./node_modules/@carbon/icons/es/warning--filled/16.js"),_carbon_icons_es_warning_filled_20__WEBPACK_IMPORTED_MODULE_52__=__webpack_require__("./node_modules/@carbon/icons/es/warning--filled/20.js"),_carbon_icons_es_warning_alt_filled_16__WEBPACK_IMPORTED_MODULE_53__=__webpack_require__("./node_modules/@carbon/icons/es/warning--alt--filled/16.js"),_carbon_icons_es_warning_alt_filled_20__WEBPACK_IMPORTED_MODULE_54__=__webpack_require__("./node_modules/@carbon/icons/es/warning--alt--filled/20.js"),_carbon_icons_es_view_16__WEBPACK_IMPORTED_MODULE_55__=__webpack_require__("./node_modules/@carbon/icons/es/view/16.js"),_carbon_icons_es_view_off_16__WEBPACK_IMPORTED_MODULE_56__=__webpack_require__("./node_modules/@carbon/icons/es/view--off/16.js");const ICON_SERVICE_PROVIDER={provide:_icon_service__WEBPACK_IMPORTED_MODULE_1__.C6,deps:[[new _angular_core__WEBPACK_IMPORTED_MODULE_57__.Optional,new _angular_core__WEBPACK_IMPORTED_MODULE_57__.SkipSelf,_icon_service__WEBPACK_IMPORTED_MODULE_1__.C6]],useFactory:function ICON_SERVICE_PROVIDER_FACTORY(parentService){return parentService||new _icon_service__WEBPACK_IMPORTED_MODULE_1__.C6}};let IconModule=class IconModule{constructor(iconService){this.iconService=iconService,iconService.registerAll([_carbon_icons_es_add_16__WEBPACK_IMPORTED_MODULE_2__.Z,_carbon_icons_es_add_20__WEBPACK_IMPORTED_MODULE_3__.Z,_carbon_icons_es_bee_16__WEBPACK_IMPORTED_MODULE_4__.Z,_carbon_icons_es_bee_20__WEBPACK_IMPORTED_MODULE_5__.Z,_carbon_icons_es_calendar_16__WEBPACK_IMPORTED_MODULE_6__.Z,_carbon_icons_es_carbon_16__WEBPACK_IMPORTED_MODULE_7__.Z,_carbon_icons_es_carbon_20__WEBPACK_IMPORTED_MODULE_8__.Z,_carbon_icons_es_caret_down_16__WEBPACK_IMPORTED_MODULE_9__.Z,_carbon_icons_es_caret_left_16__WEBPACK_IMPORTED_MODULE_10__.Z,_carbon_icons_es_caret_right_16__WEBPACK_IMPORTED_MODULE_11__.Z,_carbon_icons_es_caret_up_16__WEBPACK_IMPORTED_MODULE_12__.Z,_carbon_icons_es_checkmark_16__WEBPACK_IMPORTED_MODULE_13__.Z,_carbon_icons_es_checkmark_filled_16__WEBPACK_IMPORTED_MODULE_14__.Z,_carbon_icons_es_checkmark_filled_20__WEBPACK_IMPORTED_MODULE_15__.Z,_carbon_icons_es_checkmark_outline_16__WEBPACK_IMPORTED_MODULE_16__.Z,_carbon_icons_es_checkbox_16__WEBPACK_IMPORTED_MODULE_17__.Z,_carbon_icons_es_checkbox_checked_filled_16__WEBPACK_IMPORTED_MODULE_18__.Z,_carbon_icons_es_chevron_down_16__WEBPACK_IMPORTED_MODULE_19__.Z,_carbon_icons_es_chevron_right_16__WEBPACK_IMPORTED_MODULE_20__.Z,_carbon_icons_es_circle_dash_16__WEBPACK_IMPORTED_MODULE_21__.Z,_carbon_icons_es_close_16__WEBPACK_IMPORTED_MODULE_22__.Z,_carbon_icons_es_close_20__WEBPACK_IMPORTED_MODULE_23__.Z,_carbon_icons_es_copy_16__WEBPACK_IMPORTED_MODULE_24__.Z,_carbon_icons_es_copy_20__WEBPACK_IMPORTED_MODULE_25__.Z,_carbon_icons_es_data_2_16__WEBPACK_IMPORTED_MODULE_26__.Z,_carbon_icons_es_data_2_20__WEBPACK_IMPORTED_MODULE_27__.Z,_carbon_icons_es_document_16__WEBPACK_IMPORTED_MODULE_28__.Z,_carbon_icons_es_document_20__WEBPACK_IMPORTED_MODULE_29__.Z,_carbon_icons_es_download_16__WEBPACK_IMPORTED_MODULE_30__.Z,_carbon_icons_es_error_filled_16__WEBPACK_IMPORTED_MODULE_31__.Z,_carbon_icons_es_error_filled_20__WEBPACK_IMPORTED_MODULE_32__.Z,_carbon_icons_es_fade_16__WEBPACK_IMPORTED_MODULE_33__.Z,_carbon_icons_es_fade_20__WEBPACK_IMPORTED_MODULE_34__.Z,_carbon_icons_es_folder_16__WEBPACK_IMPORTED_MODULE_35__.Z,_carbon_icons_es_incomplete_16__WEBPACK_IMPORTED_MODULE_36__.Z,_carbon_icons_es_information_filled_16__WEBPACK_IMPORTED_MODULE_37__.Z,_carbon_icons_es_information_filled_20__WEBPACK_IMPORTED_MODULE_38__.Z,_carbon_icons_es_information_square_filled_20__WEBPACK_IMPORTED_MODULE_39__.Z,_carbon_icons_es_menu_16__WEBPACK_IMPORTED_MODULE_40__.Z,_carbon_icons_es_menu_20__WEBPACK_IMPORTED_MODULE_41__.Z,_carbon_icons_es_overflow_menu_vertical_16__WEBPACK_IMPORTED_MODULE_42__.Z,_carbon_icons_es_overflow_menu_horizontal_16__WEBPACK_IMPORTED_MODULE_43__.Z,_carbon_icons_es_save_16__WEBPACK_IMPORTED_MODULE_44__.Z,_carbon_icons_es_search_16__WEBPACK_IMPORTED_MODULE_45__.Z,_carbon_icons_es_settings_16__WEBPACK_IMPORTED_MODULE_46__.Z,_carbon_icons_es_settings_adjust_16__WEBPACK_IMPORTED_MODULE_47__.Z,_carbon_icons_es_subtract_16__WEBPACK_IMPORTED_MODULE_48__.Z,_carbon_icons_es_trash_can_16__WEBPACK_IMPORTED_MODULE_49__.Z,_carbon_icons_es_view_16__WEBPACK_IMPORTED_MODULE_55__.Z,_carbon_icons_es_view_off_16__WEBPACK_IMPORTED_MODULE_56__.Z,_carbon_icons_es_warning_16__WEBPACK_IMPORTED_MODULE_50__.Z,_carbon_icons_es_warning_filled_16__WEBPACK_IMPORTED_MODULE_51__.Z,_carbon_icons_es_warning_filled_20__WEBPACK_IMPORTED_MODULE_52__.Z,_carbon_icons_es_warning_alt_filled_16__WEBPACK_IMPORTED_MODULE_53__.Z,_carbon_icons_es_warning_alt_filled_20__WEBPACK_IMPORTED_MODULE_54__.Z])}};IconModule.ctorParameters=()=>[{type:_icon_service__WEBPACK_IMPORTED_MODULE_1__.C6}],IconModule=(0,tslib__WEBPACK_IMPORTED_MODULE_58__.gn)([(0,_angular_core__WEBPACK_IMPORTED_MODULE_57__.NgModule)({declarations:[_icon_directive__WEBPACK_IMPORTED_MODULE_0__.a],exports:[_icon_directive__WEBPACK_IMPORTED_MODULE_0__.a],imports:[_angular_common__WEBPACK_IMPORTED_MODULE_59__.CommonModule],providers:[ICON_SERVICE_PROVIDER]})],IconModule)},"./src/icon/icon.service.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{C6:()=>IconService});var tslib__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/tslib/tslib.es6.js"),_angular_core__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),_carbon_icon_helpers__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@carbon/icon-helpers/es/index.js");class IconNameNotFoundError extends Error{constructor(name){super(`Icon ${name} not found`)}}class IconSizeNotFoundError extends Error{constructor(size,name){super("Size ${size} for ${name} not found")}}class IconMemoryCache extends class IconCache{}{constructor(){super(...arguments),this.iconMap=new Map}get(name,size){if(!this.iconMap.has(name))throw new IconNameNotFoundError(name);const sizeMap=this.iconMap.get(name);if(!sizeMap.has(size))throw new IconSizeNotFoundError(size,name);return sizeMap.get(size)}set(name,size,descriptor){this.iconMap.has(name)||this.iconMap.set(name,new Map);this.iconMap.get(name).set(size,descriptor)}}let IconService=class IconService{constructor(){this.iconCache=new IconMemoryCache}registerAll(descriptors){descriptors.forEach((icon=>this.register(icon)))}register(descriptor){const{name}=descriptor;this.registerAs(name,descriptor)}registerAs(name,descriptor){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/popover/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{OI:()=>PopoverContainer,yk:()=>PopoverContent,UU:()=>PopoverModule});var asyncToGenerator=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js"),tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),floating_ui_dom=__webpack_require__("./node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs");let PopoverContainer=class PopoverContainer{constructor(elementRef,ngZone,renderer,changeDetectorRef){this.elementRef=elementRef,this.ngZone=ngZone,this.renderer=renderer,this.changeDetectorRef=changeDetectorRef,this._align="bottom",this.alignmentClassPrefix="cds--popover--",this.onClose=new core.EventEmitter,this.onOpen=new core.EventEmitter,this.isOpenChange=new core.EventEmitter,this.caret=!0,this.dropShadow=!0,this.highContrast=!1,this.autoAlign=!1,this.containerClass=!0,this.isOpen=!1}set align(alignment){if(!alignment)return;const previousAlignment=this._align;switch(alignment){case"top-left":this._align="top-start";break;case"top-right":this._align="top-end";break;case"bottom-left":this._align="bottom-start";break;case"bottom-right":this._align="bottom-end";break;case"left-top":this._align="left-start";break;case"left-bottom":this._align="left-end";break;case"right-top":this._align="right-start";break;case"right-bottom":this._align="right-end";break;default:this._align=alignment}this.updateAlignmentClass(this._align,previousAlignment)}handleChange(open,event){if(this.isOpen!==open&&event&&this.isOpenChange.emit(open),open){if(event&&this.onOpen.emit(event),this.autoAlign){if(this.caretRef){const computedStyle=getComputedStyle(this.caretRef),offset=computedStyle.getPropertyValue("--cds-popover-offset"),height=computedStyle.getPropertyValue("--cds-popover-caret-height");this.caretOffset=(offset?.includes("px")?Number(offset.split("px",1)[0]):16*Number(offset.split("rem",1)[0]))||10,this.caretHeight=(height?.includes("px")?Number(height.split("px",1)[0]):16*Number(height.split("rem",1)[0]))||6}this.elementRef.nativeElement&&this.popoverContentRef&&(this.unmountFloatingElement=(0,floating_ui_dom.Me)(this.elementRef.nativeElement,this.popoverContentRef,this.recomputePosition.bind(this)))}}else this.cleanUp(),event&&this.onClose.emit(event);this.isOpen=open,this.changeDetectorRef.markForCheck()}roundByDPR(value){const dpr=window.devicePixelRatio||1;return Math.round(value*dpr)/dpr}recomputePosition(){var _this=this;this.ngZone.runOutsideAngular((0,asyncToGenerator.Z)((function*(){const{x,y,placement,middlewareData}=yield(0,floating_ui_dom.oo)(_this.elementRef.nativeElement,_this.popoverContentRef,{placement:_this._align,strategy:"fixed",middleware:[(0,floating_ui_dom.cv)(_this.caretOffset),(0,floating_ui_dom.RR)({fallbackAxisSideDirection:"start"}),(0,floating_ui_dom.x7)({element:_this.caretRef})]}),previousAlignment=_this._align;if(_this._align=placement,_this.updateAlignmentClass(_this._align,previousAlignment),Object.assign(_this.popoverContentRef.style,{position:"fixed",top:"0",left:"0",transform:`translate(${_this.roundByDPR(x)}px,${_this.roundByDPR(y)}px)`}),middlewareData.arrow){const{x:arrowX,y:arrowY}=middlewareData.arrow,staticSide={top:"bottom",right:"left",bottom:"top",left:"right"}[placement.split("-")[0]];_this.caretRef.style.left=null!=arrowX?`${arrowX}px`:"",_this.caretRef.style.top=null!=arrowY?`${arrowY}px`:"",_this.caretRef.style.right="",_this.caretRef.style.bottom="",staticSide&&(_this.caretRef.style[staticSide]=-_this.caretHeight+"px")}})))}ngOnChanges(changes){const originalState=this.isOpen;this.handleChange(!1),changes.autoAlign&&!changes.autoAlign.firstChange&&(this.popoverContentRef=this.elementRef.nativeElement.querySelector(".cds--popover-content"),this.popoverContentRef.setAttribute("style",""),this.caretRef=this.elementRef.nativeElement.querySelector("span.cds--popover-caret")),this.handleChange(originalState)}ngAfterViewInit(){this.initializeReferences()}initializeReferences(){this.updateAlignmentClass(this._align),this.popoverContentRef=this.elementRef.nativeElement.querySelector(".cds--popover-content"),this.caretRef=this.elementRef.nativeElement.querySelector("span.cds--popover-caret"),this.handleChange(this.isOpen)}ngOnDestroy(){this.cleanUp()}cleanUp(){this.unmountFloatingElement&&this.unmountFloatingElement(),this.unmountFloatingElement=void 0}updateAlignmentClass(newAlignment,previousAlignment){if(this.elementRef.nativeElement&&previousAlignment!==newAlignment){const regexp=new RegExp("right|top|left|bottom");this.elementRef.nativeElement.classList.forEach((className=>{regexp.test(className)&&this.renderer.removeClass(this.elementRef.nativeElement,`${className}`)})),this.renderer.addClass(this.elementRef.nativeElement,`${this.alignmentClassPrefix}${newAlignment}`)}}};PopoverContainer.ctorParameters=()=>[{type:core.ElementRef},{type:core.NgZone},{type:core.Renderer2},{type:core.ChangeDetectorRef}],PopoverContainer.propDecorators={align:[{type:core.Input}],onClose:[{type:core.Output}],onOpen:[{type:core.Output}],isOpenChange:[{type:core.Output}],caret:[{type:core.HostBinding,args:["class.cds--popover--caret"]},{type:core.Input}],dropShadow:[{type:core.HostBinding,args:["class.cds--popover--drop-shadow"]},{type:core.Input}],highContrast:[{type:core.HostBinding,args:["class.cds--popover--high-contrast"]},{type:core.Input}],autoAlign:[{type:core.HostBinding,args:["class.cds--popover--auto-align"]},{type:core.Input}],containerClass:[{type:core.HostBinding,args:["class.cds--popover-container"]}],isOpen:[{type:core.Input},{type:core.HostBinding,args:["class.cds--popover--open"]}]},PopoverContainer=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsPopover], [ibmPopover]"})],PopoverContainer);let PopoverContent=class PopoverContent{constructor(changeDetectorRef){this.changeDetectorRef=changeDetectorRef,this.popoverClass=!0,this.autoAlign=!1}ngAfterViewInit(){this.popoverContent&&(this.autoAlign=!!this.popoverContent.nativeElement.closest(".cds--popover--auto-align"),this.changeDetectorRef.detectChanges())}};PopoverContent.ctorParameters=()=>[{type:core.ChangeDetectorRef}],PopoverContent.propDecorators={popoverClass:[{type:core.HostBinding,args:["class.cds--popover"]}],popoverContent:[{type:core.ViewChild,args:["content"]}]},PopoverContent=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-popover-content, ibm-popover-content",template:'\n\t\t<span class="cds--popover-content" #content>\n\t\t\t<div>\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</div>\n\t\t\t<span *ngIf="autoAlign" class="cds--popover-caret cds--popover--auto-align"></span>\n\t\t</span>\n\t\t<span *ngIf="!autoAlign" class="cds--popover-caret"></span>\n\t'})],PopoverContent);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs");let PopoverModule=class PopoverModule{};PopoverModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[PopoverContainer,PopoverContent],exports:[PopoverContainer,PopoverContent],imports:[common.CommonModule]})],PopoverModule)},"./src/tag/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Vp:()=>Tag,Wh:()=>TagModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs");let Tag=class Tag{constructor(){this.type="gray",this.size="md",this.class="",this.skeleton=!1}get attrClass(){const skeletonClass=this.skeleton?"cds--skeleton":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`;return`cds--tag cds--tag--${this.type} ${sizeClass} ${skeletonClass} ${this.class}`}};Tag.propDecorators={type:[{type:core.Input}],size:[{type:core.Input}],class:[{type:core.Input}],skeleton:[{type:core.Input}],attrClass:[{type:core.HostBinding,args:["attr.class"]}]},Tag=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag, ibm-tag",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span class="cds--tag__label">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t</ng-container>\n\t'})],Tag);let TagFilter=class TagFilter extends Tag{constructor(){super(...arguments),this.closeButtonLabel="Clear Filter",this.disabled=!1,this.close=new core.EventEmitter,this.click=new core.EventEmitter}onClick(event){event.stopImmediatePropagation(),this.disabled||this.click.emit({action:"click"})}onClose(event){event.stopImmediatePropagation(),this.click.emit({action:"close"}),this.close.emit()}get attrClass(){const disabledClass=this.disabled?"cds--tag--disabled":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`,skeletonClass=this.skeleton?"cds--skeleton":"";return`cds--tag cds--tag--filter cds--tag--${this.type} ${disabledClass} ${sizeClass} ${skeletonClass} ${this.class}`}get attrAriaLabel(){return`${this.title||""} ${this.closeButtonLabel}`.trim()}};TagFilter.propDecorators={closeButtonLabel:[{type:core.Input}],disabled:[{type:core.Input}],title:[{type:core.Input}],close:[{type:core.Output}],click:[{type:core.Output}],attrClass:[{type:core.HostBinding,args:["attr.class"]}],attrAriaLabel:[{type:core.HostBinding,args:["attr.aria-label"]}]},TagFilter=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag-filter, ibm-tag-filter",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span\n\t\t\t\tclass="cds--tag__label"\n\t\t\t\t[attr.title]="title ? title : null"\n\t\t\t\t(click)="onClick($event)">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t\t<button\n\t\t\t\tclass="cds--tag__close-icon"\n\t\t\t\t(click)="onClose($event)"\n\t\t\t\t[disabled]="disabled"\n\t\t\t\t[title]="closeButtonLabel">\n\t\t\t\t<span class="cds--visually-hidden">{{closeButtonLabel}}</span>\n\t\t\t\t<svg cdsIcon="close" size="16"></svg>\n\t\t\t</button>\n\t\t</ng-container>\n\t'})],TagFilter);let TagIconDirective=class TagIconDirective{constructor(){this.tagIcon=!0}};TagIconDirective.propDecorators={tagIcon:[{type:core.HostBinding,args:["class.cds--tag__custom-icon"]}]},TagIconDirective=(0,tslib_es6.gn)([(0,core.Directive)({selector:"[cdsTagIcon], [ibmTagIcon]"})],TagIconDirective);let TagSelectableComponent=class TagSelectableComponent{constructor(){this.role="button",this.buttonType="button",this.tabIndex=0,this.size="md",this.skeleton=!1,this.disabled=!1,this.class="",this.selected=!1,this.selectedChange=new core.EventEmitter}get ariaPressed(){return this.selected}onClick(){this.selected=!this.selected,this.selectedChange.emit(this.selected)}get attrClass(){const disabledClass=this.disabled?"cds--tag--disabled":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`,skeletonClass=this.skeleton?"cds--skeleton":"";return`cds--tag cds--tag--selectable ${this.selected?"cds--tag--selectable-selected":""} ${disabledClass} ${sizeClass} ${skeletonClass} ${this.class}`}};TagSelectableComponent.propDecorators={role:[{type:core.HostBinding,args:["attr.role"]}],buttonType:[{type:core.HostBinding,args:["attr.type"]}],tabIndex:[{type:core.HostBinding,args:["attr.tabindex"]}],ariaPressed:[{type:core.HostBinding,args:["attr.aria-pressed"]}],size:[{type:core.Input}],skeleton:[{type:core.Input}],disabled:[{type:core.Input}],class:[{type:core.Input}],selected:[{type:core.Input}],selectedChange:[{type:core.Output}],onClick:[{type:core.HostListener,args:["click"]}],attrClass:[{type:core.HostBinding,args:["attr.class"]}]},TagSelectableComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag-selectable, ibm-tag-selectable",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span class="cds--tag__label">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t</ng-container>\n\t',changeDetection:core.ChangeDetectionStrategy.OnPush})],TagSelectableComponent);let TagOperationalComponent=class TagOperationalComponent extends Tag{constructor(){super(...arguments),this.role="button",this.buttonType="button",this.tabIndex=0,this.disabled=!1}get attrClass(){const disabledClass=this.disabled?"cds--tag--disabled":"",sizeClass=`cds--tag--${this.size} cds--layout--size-${this.size}`,skeletonClass=this.skeleton?"cds--skeleton":"";return`cds--tag cds--tag--operational cds--tag--${this.type} ${disabledClass} ${sizeClass} ${skeletonClass} ${this.class}`}};TagOperationalComponent.propDecorators={role:[{type:core.HostBinding,args:["attr.role"]}],buttonType:[{type:core.HostBinding,args:["attr.type"]}],tabIndex:[{type:core.HostBinding,args:["attr.tabindex"]}],disabled:[{type:core.Input}],attrClass:[{type:core.HostBinding,args:["attr.class"]}]},TagOperationalComponent=(0,tslib_es6.gn)([(0,core.Component)({selector:"cds-tag-operational, ibm-tag-operational",template:'\n\t\t<ng-container *ngIf="!skeleton">\n\t\t\t<ng-content select="[cdsTagIcon],[ibmTagIcon]"></ng-content>\n\t\t\t<span class="cds--tag__label">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</span>\n\t\t</ng-container>\n\t',changeDetection:core.ChangeDetectionStrategy.OnPush})],TagOperationalComponent);var common=__webpack_require__("./node_modules/@angular/common/fesm2020/common.mjs"),icon=__webpack_require__("./src/icon/index.ts");let TagModule=class TagModule{};TagModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[Tag,TagFilter,TagIconDirective,TagSelectableComponent,TagOperationalComponent],exports:[Tag,TagFilter,TagIconDirective,TagSelectableComponent,TagOperationalComponent],imports:[common.CommonModule,icon.QX]})],TagModule)},"./src/tag/tag.stories.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Basic:()=>Basic,Filter:()=>Filter,OperationalTag:()=>OperationalTag,SelectedTag:()=>SelectedTag,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var _storybook_angular__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@storybook/angular/dist/index.mjs"),___WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/tag/index.ts"),_icon__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/icon/index.ts"),_popover__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/popover/index.ts");const __WEBPACK_DEFAULT_EXPORT__={title:"Components/Tag",decorators:[(0,_storybook_angular__WEBPACK_IMPORTED_MODULE_0__.moduleMetadata)({imports:[___WEBPACK_IMPORTED_MODULE_1__.Wh,_icon__WEBPACK_IMPORTED_MODULE_2__.QX,_popover__WEBPACK_IMPORTED_MODULE_3__.UU]})],args:{size:"md",type:"red",skeleton:!1},argTypes:{type:{options:["warm-gray","red","magenta","purple","blue","cyan","teal","green","cool-gray","high-contrast","outline"],control:"select"}},component:___WEBPACK_IMPORTED_MODULE_1__.Vp},Basic=(args=>({props:args,template:'\n        <cds-tag\n            [type]="type"\n            [skeleton]="skeleton"\n            [size]="size">\n            <div cdsTagIcon>\n                <svg ibmIcon="settings" size="16"></svg>\n            </div>\n            Read only\n        </cds-tag>\n    '})).bind({}),Filter=(args=>({props:args,template:'\n        <cds-tag-filter\n            [type]="type"\n            [size]="size"\n            [skeleton]="skeleton"\n            title="Filter"\n            closeButtonLabel="Clear">\n            <div cdsTagIcon>\n                <svg ibmIcon="settings" size="16"></svg>\n            </div>\n            Filtered\n        </cds-tag-filter>\n    '})).bind({}),SelectedTag=(args=>({props:args,template:'\n        <cds-tag-selectable\n            [size]="size"\n            [skeleton]="skeleton"\n            [selected]="selected"\n            (selectedChange)="selectedChange($event)"\n            (click)="onClick($event)">\n            <div cdsTagIcon>\n                <svg ibmIcon="settings" size="16"></svg>\n            </div>\n            Selectable\n        </cds-tag-selectable>\n    '})).bind({});SelectedTag.args={selected:!1},SelectedTag.argTypes={onClick:{action:"clicked"},selectedChange:{action:"Selected change"}};const OperationalTag=(args=>({props:args,template:'\n        <cds-tag-operational\n            type="cyan"\n            [size]="size"\n            [skeleton]="skeleton"\n            (click)="onClick($event)">\n            <div cdsTagIcon>\n                <svg ibmIcon="settings" size="16"></svg>\n            </div>\n            Operational\n        </cds-tag-operational>\n\n\n        <div\n            cdsPopover\n            [isOpen]="isOpen"\n            [highContrast]="true">\n            <cds-tag-operational\n                [type]="type"\n                [size]="size"\n                [skeleton]="skeleton"\n                (click)="isOpen = !isOpen">\n                <div cdsTagIcon>\n                    <svg ibmIcon="settings" size="16"></svg>\n                </div>\n                Operational w/ popover\n            </cds-tag-operational>\n            <cds-popover-content>\n                <div class="popover-content">\n                    Tag 1 name <br>\n                    Tag 2 name <br>\n                    Tag 3 name <br>\n                    Tag 4 name <br>\n                    <cds-tag type="green">Tag 5 name</cds-tag>\n                </div>\n            </cds-popover-content>\n        </div>\n    ',styles:[".popover-content {\n            line-height: 1.5;\n            padding: 1rem;\n            font-size: 14px;\n        }"]})).bind({});OperationalTag.argTypes={onClick:{action:"clicked"}},Basic.parameters={...Basic.parameters,docs:{...Basic.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        <cds-tag\n            [type]="type"\n            [skeleton]="skeleton"\n            [size]="size">\n            <div cdsTagIcon>\n                <svg ibmIcon="settings" size="16"></svg>\n            </div>\n            Read only\n        </cds-tag>\n    `\n})',...Basic.parameters?.docs?.source}}},Filter.parameters={...Filter.parameters,docs:{...Filter.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        <cds-tag-filter\n            [type]="type"\n            [size]="size"\n            [skeleton]="skeleton"\n            title="Filter"\n            closeButtonLabel="Clear">\n            <div cdsTagIcon>\n                <svg ibmIcon="settings" size="16"></svg>\n            </div>\n            Filtered\n        </cds-tag-filter>\n    `\n})',...Filter.parameters?.docs?.source}}},SelectedTag.parameters={...SelectedTag.parameters,docs:{...SelectedTag.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        <cds-tag-selectable\n            [size]="size"\n            [skeleton]="skeleton"\n            [selected]="selected"\n            (selectedChange)="selectedChange($event)"\n            (click)="onClick($event)">\n            <div cdsTagIcon>\n                <svg ibmIcon="settings" size="16"></svg>\n            </div>\n            Selectable\n        </cds-tag-selectable>\n    `\n})',...SelectedTag.parameters?.docs?.source}}},OperationalTag.parameters={...OperationalTag.parameters,docs:{...OperationalTag.parameters?.docs,source:{originalSource:'args => ({\n  props: args,\n  template: `\n        <cds-tag-operational\n            type="cyan"\n            [size]="size"\n            [skeleton]="skeleton"\n            (click)="onClick($event)">\n            <div cdsTagIcon>\n                <svg ibmIcon="settings" size="16"></svg>\n            </div>\n            Operational\n        </cds-tag-operational>\n\n\n        <div\n            cdsPopover\n            [isOpen]="isOpen"\n            [highContrast]="true">\n            <cds-tag-operational\n                [type]="type"\n                [size]="size"\n                [skeleton]="skeleton"\n                (click)="isOpen = !isOpen">\n                <div cdsTagIcon>\n                    <svg ibmIcon="settings" size="16"></svg>\n                </div>\n                Operational w/ popover\n            </cds-tag-operational>\n            <cds-popover-content>\n                <div class="popover-content">\n                    Tag 1 name <br>\n                    Tag 2 name <br>\n                    Tag 3 name <br>\n                    Tag 4 name <br>\n                    <cds-tag type="green">Tag 5 name</cds-tag>\n                </div>\n            </cds-popover-content>\n        </div>\n    `,\n  styles: [`.popover-content {\n            line-height: 1.5;\n            padding: 1rem;\n            font-size: 14px;\n        }`]\n})',...OperationalTag.parameters?.docs?.source}}};const __namedExportsOrder=["Basic","Filter","SelectedTag","OperationalTag"]}}]);