npm - @infineon/infineon-design-system-stencil - Versions diffs - 39.4.4-canary.0 → 39.5.0 - Mend

@infineon/infineon-design-system-stencil 39.4.4-canary.0 → 39.5.0

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.

Files changed (1210) hide show

package/dist/cjs/ifx-link.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ifx-link.entry.cjs.js","mappings":"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","names":["isNestedInIfxComponent","detectFramework","trackComponent","h","classNames"],"sources":["src/components/link/link.scss?tag=ifx-link&encapsulation=shadow","src/components/link/link.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\r\n@use \"../../global/font.scss\";\r\n\r\n:host {\r\n display: inline-flex;\r\n}\r\n\r\n.link {\r\n display: inline-flex;\r\n align-items: center;\r\n font-weight: 400;\r\n font-size: tokens.$ifxFontSizeM;\r\n text-decoration: none;\r\n color: tokens.$ifxColorOcean500;\r\n gap: tokens.$ifxSpace100;\r\n line-height: 1.6;\r\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\r\n\r\n\r\n\r\n &:hover { \r\n cursor: pointer;\r\n }\r\n\r\n &:focus {\r\n outline-width: 2px;\r\n outline-style: solid;\r\n outline-color: #0A8276;\r\n outline-offset: 4px;\r\n border-radius: 3px;\r\n }\r\n\r\n &.bold {\r\n font-weight: tokens.$ifxFontWeightSemibold;\r\n\r\n &:hover {\r\n text-decoration: underline;\r\n }\r\n\r\n &:active {\r\n color: #08665C;\r\n font-style: normal;\r\n font-weight: 600;\r\n text-decoration: underline;\r\n }\r\n\r\n }\r\n\r\n &.underlined {\r\n text-decoration: underline;\r\n text-decoration-color: tokens.$ifxColorOcean500;\r\n color: #1D1D1D;\r\n text-underline-offset: 8px;\r\n \r\n &:hover {\r\n color: tokens.$ifxColorOcean500;;\r\n }\r\n \r\n &:active {\r\n color: #0A8276;\r\n }\r\n\r\n &:disabled,\r\n &.disabled {\r\n text-decoration-color: tokens.$ifxColorEngineering300;\r\n }\r\n }\r\n\r\n &.title {\r\n text-decoration: none;\r\n font-weight: tokens.$ifxFontWeightSemibold;\r\n color: #1D1D1D;\r\n\r\n &:hover {\r\n color: tokens.$ifxColorOcean500;\r\n }\r\n\r\n &:active {\r\n color: #08665C;\r\n }\r\n }\r\n\r\n &.menu {\r\n font-weight: 400;\r\n font-style: normal;\r\n line-height: 26px;\r\n color: #1D1D1D;\r\n\r\n &:hover {\r\n color: tokens.$ifxColorOcean500;\r\n }\r\n\r\n &:active {\r\n color: #08665C;\r\n }\r\n }\r\n\r\n &.small {\r\n font-size: tokens.$ifxFontSizeS;\r\n }\r\n\r\n &.medium {\r\n font-size: tokens.$ifxFontSizeM;\r\n }\r\n\r\n &.large {\r\n font-size: tokens.$ifxFontSizeL;\r\n }\r\n\r\n &.extraLarge {\r\n font-size: tokens.$ifxFontSizeXl;\r\n }\r\n\r\n &.underline {\r\n text-decoration: underline;\r\n }\r\n\r\n &:disabled,\r\n &.disabled {\r\n color: tokens.$ifxColorEngineering300;\r\n cursor: default;\r\n pointer-events: none;\r\n }\r\n\r\n}","import { Component, Prop, h, State, Element } from \"@stencil/core\";\r\nimport { trackComponent } from '../../global/utils/tracking';\r\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\r\nimport { detectFramework } from '../../global/utils/framework-detection';\r\nimport classNames from 'classnames';\r\n \r\n@Component({\r\n tag: 'ifx-link',\r\n styleUrl: 'link.scss',\r\n shadow: true\r\n})\r\n\r\nexport class Link {\r\n @Element() el;\r\n @Prop() href: string = undefined;\r\n @Prop() target: string = '_self';\r\n @Prop() variant: string = 'bold';\r\n @Prop() size: string;\r\n @Prop() disabled: boolean = false;\r\n @Prop() download: string;\r\n @Prop() ariaLabel: string \| null;\r\n @State() internalHref: string ='';\r\n @State() internalTarget: string = '';\r\n @State() internalVariant: string = '';\r\n\r\n setInternalStates() {\r\n if(this.href){\r\n this.internalHref = this.href.trim();\r\n }else{\r\n this.internalHref = undefined;\r\n }\r\n this.internalTarget = this.target.trim();\r\n this.internalVariant = this.variant.trim().toLowerCase();\r\n }\r\n\r\n componentWillRender(){\r\n this.setInternalStates();\r\n }\r\n\r\n handleKeyDown(event: KeyboardEvent) {\r\n if (this.disabled) {\r\n event.preventDefault();\r\n } else if (event.key === 'Enter') {\r\n event.preventDefault();\r\n }\r\n }\r\n\r\n async componentDidLoad() { \r\n if(!isNestedInIfxComponent(this.el)) { \r\n const framework = detectFramework();\r\n trackComponent('ifx-link', await framework)\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <a\r\n tabindex=\"0\"\r\n role=\"link\"\r\n aria-label={this.ariaLabel}\r\n aria-disabled={this.disabled \|\| !this.internalHref}\r\n href={this.disabled ? undefined : this.internalHref}\r\n download={this.download}\r\n target={this.internalTarget}\r\n class={this.linkClassNames()}>\r\n <slot></slot>\r\n </a>)\r\n }\r\n\r\n getSizeClass() {\r\n const small = this.size === 's' ? 'small' : null;\r\n const medium = this.size === 'm' ? 'medium' : null;\r\n const large = this.size === 'l' ? 'large' : null;\r\n const extraLarge = this.size === 'xl' ? 'extraLarge' : null;\r\n\r\n if (small) {\r\n return small;\r\n } else if (medium) {\r\n return medium;\r\n } else if (large) {\r\n return large;\r\n } else if (extraLarge && this.internalVariant === 'underlined') {\r\n return 'large';\r\n } else if (extraLarge && this.internalVariant !== 'underlined') {\r\n return extraLarge;\r\n } else return \"\";\r\n }\r\n\r\n getVariantClass() {\r\n const bold = this.internalVariant === 'bold' ? 'bold' : null;\r\n const title = this.internalVariant === 'title' ? 'title' : null;\r\n const underlined = this.internalVariant === 'underlined' ? 'underlined' : null;\r\n const menu = this.internalVariant === 'menu' ? 'menu' : null;\r\n\r\n if (bold) {\r\n return bold\r\n } else if (title) {\r\n return title;\r\n } else if (underlined) {\r\n return underlined;\r\n } else if (menu) {\r\n return menu;\r\n } else return bold;\r\n }\r\n\r\n linkClassNames() {\r\n return classNames(\r\n 'link',\r\n 'primary',\r\n this.getVariantClass(),\r\n this.getSizeClass(),\r\n this.disabled ? 'disabled' : '',\r\n );\r\n }\r\n}"],"version":3}
1	+ {"file":"ifx-link.entry.cjs.js","mappings":"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","names":["isNestedInIfxComponent","detectFramework","trackComponent","h","classNames"],"sources":["src/components/link/link.scss?tag=ifx-link&encapsulation=shadow","src/components/link/link.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-flex;\n}\n\n.link {\n display: inline-flex;\n align-items: center;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n text-decoration: none;\n color: tokens.$ifxColorOcean500;\n gap: tokens.$ifxSpace100;\n line-height: 1.6;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n &:hover { \n cursor: pointer;\n }\n\n &:focus {\n outline-width: 2px;\n outline-style: solid;\n outline-color: #0A8276;\n outline-offset: 4px;\n border-radius: 3px;\n }\n\n &.bold {\n font-weight: tokens.$ifxFontWeightSemibold;\n\n &:hover {\n text-decoration: underline;\n }\n\n &:active {\n color: #08665C;\n font-style: normal;\n font-weight: 600;\n text-decoration: underline;\n }\n\n }\n\n &.underlined {\n text-decoration: underline;\n text-decoration-color: tokens.$ifxColorOcean500;\n color: #1D1D1D;\n text-underline-offset: 8px;\n \n &:hover {\n color: tokens.$ifxColorOcean500;;\n }\n \n &:active {\n color: #0A8276;\n }\n\n &:disabled,\n &.disabled {\n text-decoration-color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.title {\n text-decoration: none;\n font-weight: tokens.$ifxFontWeightSemibold;\n color: #1D1D1D;\n\n &:hover {\n color: tokens.$ifxColorOcean500;\n }\n\n &:active {\n color: #08665C;\n }\n }\n\n &.menu {\n font-weight: 400;\n font-style: normal;\n line-height: 26px;\n color: #1D1D1D;\n\n &:hover {\n color: tokens.$ifxColorOcean500;\n }\n\n &:active {\n color: #08665C;\n }\n }\n\n &.small {\n font-size: tokens.$ifxFontSizeS;\n }\n\n &.medium {\n font-size: tokens.$ifxFontSizeM;\n }\n\n &.large {\n font-size: tokens.$ifxFontSizeL;\n }\n\n &.extraLarge {\n font-size: tokens.$ifxFontSizeXl;\n }\n\n &.underline {\n text-decoration: underline;\n }\n\n &:disabled,\n &.disabled {\n color: tokens.$ifxColorEngineering300;\n cursor: default;\n pointer-events: none;\n }\n\n}","import { Component, Prop, h, State, Element } from \"@stencil/core\";\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport classNames from 'classnames';\n \n@Component({\n tag: 'ifx-link',\n styleUrl: 'link.scss',\n shadow: true\n})\n\nexport class Link {\n @Element() el;\n @Prop() href: string = undefined;\n @Prop() target: string = '_self';\n @Prop() variant: string = 'bold';\n @Prop() size: string;\n @Prop() disabled: boolean = false;\n @Prop() download: string;\n @Prop() ariaLabel: string \| null;\n @State() internalHref: string ='';\n @State() internalTarget: string = '';\n @State() internalVariant: string = '';\n\n setInternalStates() {\n if(this.href){\n this.internalHref = this.href.trim();\n }else{\n this.internalHref = undefined;\n }\n this.internalTarget = this.target.trim();\n this.internalVariant = this.variant.trim().toLowerCase();\n }\n\n componentWillRender(){\n this.setInternalStates();\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (this.disabled) {\n event.preventDefault();\n } else if (event.key === 'Enter') {\n event.preventDefault();\n }\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-link', await framework)\n }\n }\n\n render() {\n return (\n <a\n tabindex=\"0\"\n role=\"link\"\n aria-label={this.ariaLabel}\n aria-disabled={this.disabled \|\| !this.internalHref}\n href={this.disabled ? undefined : this.internalHref}\n download={this.download}\n target={this.internalTarget}\n class={this.linkClassNames()}>\n <slot></slot>\n </a>)\n }\n\n getSizeClass() {\n const small = this.size === 's' ? 'small' : null;\n const medium = this.size === 'm' ? 'medium' : null;\n const large = this.size === 'l' ? 'large' : null;\n const extraLarge = this.size === 'xl' ? 'extraLarge' : null;\n\n if (small) {\n return small;\n } else if (medium) {\n return medium;\n } else if (large) {\n return large;\n } else if (extraLarge && this.internalVariant === 'underlined') {\n return 'large';\n } else if (extraLarge && this.internalVariant !== 'underlined') {\n return extraLarge;\n } else return \"\";\n }\n\n getVariantClass() {\n const bold = this.internalVariant === 'bold' ? 'bold' : null;\n const title = this.internalVariant === 'title' ? 'title' : null;\n const underlined = this.internalVariant === 'underlined' ? 'underlined' : null;\n const menu = this.internalVariant === 'menu' ? 'menu' : null;\n\n if (bold) {\n return bold\n } else if (title) {\n return title;\n } else if (underlined) {\n return underlined;\n } else if (menu) {\n return menu;\n } else return bold;\n }\n\n linkClassNames() {\n return classNames(\n 'link',\n 'primary',\n this.getVariantClass(),\n this.getSizeClass(),\n this.disabled ? 'disabled' : '',\n );\n }\n}"],"version":3}

package/dist/cjs/ifx-link.entry.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ifx-link.entry.cjs.js","sources":["src/components/link/link.scss?tag=ifx-link&encapsulation=shadow","src/components/link/link.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\r\n@use \"../../global/font.scss\";\r\n\r\n:host {\r\n display: inline-flex;\r\n}\r\n\r\n.link {\r\n display: inline-flex;\r\n align-items: center;\r\n font-weight: 400;\r\n font-size: tokens.$ifxFontSizeM;\r\n text-decoration: none;\r\n color: tokens.$ifxColorOcean500;\r\n gap: tokens.$ifxSpace100;\r\n line-height: 1.6;\r\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\r\n\r\n\r\n\r\n &:hover { \r\n cursor: pointer;\r\n }\r\n\r\n &:focus {\r\n outline-width: 2px;\r\n outline-style: solid;\r\n outline-color: #0A8276;\r\n outline-offset: 4px;\r\n border-radius: 3px;\r\n }\r\n\r\n &.bold {\r\n font-weight: tokens.$ifxFontWeightSemibold;\r\n\r\n &:hover {\r\n text-decoration: underline;\r\n }\r\n\r\n &:active {\r\n color: #08665C;\r\n font-style: normal;\r\n font-weight: 600;\r\n text-decoration: underline;\r\n }\r\n\r\n }\r\n\r\n &.underlined {\r\n text-decoration: underline;\r\n text-decoration-color: tokens.$ifxColorOcean500;\r\n color: #1D1D1D;\r\n text-underline-offset: 8px;\r\n \r\n &:hover {\r\n color: tokens.$ifxColorOcean500;;\r\n }\r\n \r\n &:active {\r\n color: #0A8276;\r\n }\r\n\r\n &:disabled,\r\n &.disabled {\r\n text-decoration-color: tokens.$ifxColorEngineering300;\r\n }\r\n }\r\n\r\n &.title {\r\n text-decoration: none;\r\n font-weight: tokens.$ifxFontWeightSemibold;\r\n color: #1D1D1D;\r\n\r\n &:hover {\r\n color: tokens.$ifxColorOcean500;\r\n }\r\n\r\n &:active {\r\n color: #08665C;\r\n }\r\n }\r\n\r\n &.menu {\r\n font-weight: 400;\r\n font-style: normal;\r\n line-height: 26px;\r\n color: #1D1D1D;\r\n\r\n &:hover {\r\n color: tokens.$ifxColorOcean500;\r\n }\r\n\r\n &:active {\r\n color: #08665C;\r\n }\r\n }\r\n\r\n &.small {\r\n font-size: tokens.$ifxFontSizeS;\r\n }\r\n\r\n &.medium {\r\n font-size: tokens.$ifxFontSizeM;\r\n }\r\n\r\n &.large {\r\n font-size: tokens.$ifxFontSizeL;\r\n }\r\n\r\n &.extraLarge {\r\n font-size: tokens.$ifxFontSizeXl;\r\n }\r\n\r\n &.underline {\r\n text-decoration: underline;\r\n }\r\n\r\n &:disabled,\r\n &.disabled {\r\n color: tokens.$ifxColorEngineering300;\r\n cursor: default;\r\n pointer-events: none;\r\n }\r\n\r\n}","import { Component, Prop, h, State, Element } from \"@stencil/core\";\r\nimport { trackComponent } from '../../global/utils/tracking';\r\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\r\nimport { detectFramework } from '../../global/utils/framework-detection';\r\nimport classNames from 'classnames';\r\n \r\n@Component({\r\n tag: 'ifx-link',\r\n styleUrl: 'link.scss',\r\n shadow: true\r\n})\r\n\r\nexport class Link {\r\n @Element() el;\r\n @Prop() href: string = undefined;\r\n @Prop() target: string = '_self';\r\n @Prop() variant: string = 'bold';\r\n @Prop() size: string;\r\n @Prop() disabled: boolean = false;\r\n @Prop() download: string;\r\n @Prop() ariaLabel: string \| null;\r\n @State() internalHref: string ='';\r\n @State() internalTarget: string = '';\r\n @State() internalVariant: string = '';\r\n\r\n setInternalStates() {\r\n if(this.href){\r\n this.internalHref = this.href.trim();\r\n }else{\r\n this.internalHref = undefined;\r\n }\r\n this.internalTarget = this.target.trim();\r\n this.internalVariant = this.variant.trim().toLowerCase();\r\n }\r\n\r\n componentWillRender(){\r\n this.setInternalStates();\r\n }\r\n\r\n handleKeyDown(event: KeyboardEvent) {\r\n if (this.disabled) {\r\n event.preventDefault();\r\n } else if (event.key === 'Enter') {\r\n event.preventDefault();\r\n }\r\n }\r\n\r\n async componentDidLoad() { \r\n if(!isNestedInIfxComponent(this.el)) { \r\n const framework = detectFramework();\r\n trackComponent('ifx-link', await framework)\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <a\r\n tabindex=\"0\"\r\n role=\"link\"\r\n aria-label={this.ariaLabel}\r\n aria-disabled={this.disabled \|\| !this.internalHref}\r\n href={this.disabled ? undefined : this.internalHref}\r\n download={this.download}\r\n target={this.internalTarget}\r\n class={this.linkClassNames()}>\r\n <slot></slot>\r\n </a>)\r\n }\r\n\r\n getSizeClass() {\r\n const small = this.size === 's' ? 'small' : null;\r\n const medium = this.size === 'm' ? 'medium' : null;\r\n const large = this.size === 'l' ? 'large' : null;\r\n const extraLarge = this.size === 'xl' ? 'extraLarge' : null;\r\n\r\n if (small) {\r\n return small;\r\n } else if (medium) {\r\n return medium;\r\n } else if (large) {\r\n return large;\r\n } else if (extraLarge && this.internalVariant === 'underlined') {\r\n return 'large';\r\n } else if (extraLarge && this.internalVariant !== 'underlined') {\r\n return extraLarge;\r\n } else return \"\";\r\n }\r\n\r\n getVariantClass() {\r\n const bold = this.internalVariant === 'bold' ? 'bold' : null;\r\n const title = this.internalVariant === 'title' ? 'title' : null;\r\n const underlined = this.internalVariant === 'underlined' ? 'underlined' : null;\r\n const menu = this.internalVariant === 'menu' ? 'menu' : null;\r\n\r\n if (bold) {\r\n return bold\r\n } else if (title) {\r\n return title;\r\n } else if (underlined) {\r\n return underlined;\r\n } else if (menu) {\r\n return menu;\r\n } else return bold;\r\n }\r\n\r\n linkClassNames() {\r\n return classNames(\r\n 'link',\r\n 'primary',\r\n this.getVariantClass(),\r\n this.getSizeClass(),\r\n this.disabled ? 'disabled' : '',\r\n );\r\n }\r\n}"],"names":["isNestedInIfxComponent","detectFramework","trackComponent","h","classNames"],"mappings":"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"}
1	+ {"version":3,"file":"ifx-link.entry.cjs.js","sources":["src/components/link/link.scss?tag=ifx-link&encapsulation=shadow","src/components/link/link.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-flex;\n}\n\n.link {\n display: inline-flex;\n align-items: center;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n text-decoration: none;\n color: tokens.$ifxColorOcean500;\n gap: tokens.$ifxSpace100;\n line-height: 1.6;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n &:hover { \n cursor: pointer;\n }\n\n &:focus {\n outline-width: 2px;\n outline-style: solid;\n outline-color: #0A8276;\n outline-offset: 4px;\n border-radius: 3px;\n }\n\n &.bold {\n font-weight: tokens.$ifxFontWeightSemibold;\n\n &:hover {\n text-decoration: underline;\n }\n\n &:active {\n color: #08665C;\n font-style: normal;\n font-weight: 600;\n text-decoration: underline;\n }\n\n }\n\n &.underlined {\n text-decoration: underline;\n text-decoration-color: tokens.$ifxColorOcean500;\n color: #1D1D1D;\n text-underline-offset: 8px;\n \n &:hover {\n color: tokens.$ifxColorOcean500;;\n }\n \n &:active {\n color: #0A8276;\n }\n\n &:disabled,\n &.disabled {\n text-decoration-color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.title {\n text-decoration: none;\n font-weight: tokens.$ifxFontWeightSemibold;\n color: #1D1D1D;\n\n &:hover {\n color: tokens.$ifxColorOcean500;\n }\n\n &:active {\n color: #08665C;\n }\n }\n\n &.menu {\n font-weight: 400;\n font-style: normal;\n line-height: 26px;\n color: #1D1D1D;\n\n &:hover {\n color: tokens.$ifxColorOcean500;\n }\n\n &:active {\n color: #08665C;\n }\n }\n\n &.small {\n font-size: tokens.$ifxFontSizeS;\n }\n\n &.medium {\n font-size: tokens.$ifxFontSizeM;\n }\n\n &.large {\n font-size: tokens.$ifxFontSizeL;\n }\n\n &.extraLarge {\n font-size: tokens.$ifxFontSizeXl;\n }\n\n &.underline {\n text-decoration: underline;\n }\n\n &:disabled,\n &.disabled {\n color: tokens.$ifxColorEngineering300;\n cursor: default;\n pointer-events: none;\n }\n\n}","import { Component, Prop, h, State, Element } from \"@stencil/core\";\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport classNames from 'classnames';\n \n@Component({\n tag: 'ifx-link',\n styleUrl: 'link.scss',\n shadow: true\n})\n\nexport class Link {\n @Element() el;\n @Prop() href: string = undefined;\n @Prop() target: string = '_self';\n @Prop() variant: string = 'bold';\n @Prop() size: string;\n @Prop() disabled: boolean = false;\n @Prop() download: string;\n @Prop() ariaLabel: string \| null;\n @State() internalHref: string ='';\n @State() internalTarget: string = '';\n @State() internalVariant: string = '';\n\n setInternalStates() {\n if(this.href){\n this.internalHref = this.href.trim();\n }else{\n this.internalHref = undefined;\n }\n this.internalTarget = this.target.trim();\n this.internalVariant = this.variant.trim().toLowerCase();\n }\n\n componentWillRender(){\n this.setInternalStates();\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (this.disabled) {\n event.preventDefault();\n } else if (event.key === 'Enter') {\n event.preventDefault();\n }\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-link', await framework)\n }\n }\n\n render() {\n return (\n <a\n tabindex=\"0\"\n role=\"link\"\n aria-label={this.ariaLabel}\n aria-disabled={this.disabled \|\| !this.internalHref}\n href={this.disabled ? undefined : this.internalHref}\n download={this.download}\n target={this.internalTarget}\n class={this.linkClassNames()}>\n <slot></slot>\n </a>)\n }\n\n getSizeClass() {\n const small = this.size === 's' ? 'small' : null;\n const medium = this.size === 'm' ? 'medium' : null;\n const large = this.size === 'l' ? 'large' : null;\n const extraLarge = this.size === 'xl' ? 'extraLarge' : null;\n\n if (small) {\n return small;\n } else if (medium) {\n return medium;\n } else if (large) {\n return large;\n } else if (extraLarge && this.internalVariant === 'underlined') {\n return 'large';\n } else if (extraLarge && this.internalVariant !== 'underlined') {\n return extraLarge;\n } else return \"\";\n }\n\n getVariantClass() {\n const bold = this.internalVariant === 'bold' ? 'bold' : null;\n const title = this.internalVariant === 'title' ? 'title' : null;\n const underlined = this.internalVariant === 'underlined' ? 'underlined' : null;\n const menu = this.internalVariant === 'menu' ? 'menu' : null;\n\n if (bold) {\n return bold\n } else if (title) {\n return title;\n } else if (underlined) {\n return underlined;\n } else if (menu) {\n return menu;\n } else return bold;\n }\n\n linkClassNames() {\n return classNames(\n 'link',\n 'primary',\n this.getVariantClass(),\n this.getSizeClass(),\n this.disabled ? 'disabled' : '',\n );\n }\n}"],"names":["isNestedInIfxComponent","detectFramework","trackComponent","h","classNames"],"mappings":"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"}

package/dist/cjs/ifx-list-entry.cjs.entry.js CHANGED Viewed

@@ -22,7 +22,7 @@ const ListEntry = class {
         this.ifxListEntryChange.emit({ label: this.label, value: this.value, type: this.type });
     }
     render() {
-        return (index.h("div", { key: '8da9e3dcee4cd8b2d0d69a362834f4cdd6661a8f', class: "wrapper" }, this.type === 'checkbox' ? (index.h("div", { class: "list-entry" }, index.h("ifx-checkbox", { size: "s", checked: this.value }, this.label))) : (index.h("div", { class: "list-entry" }, index.h("ifx-radio-button", { size: "s", checked: this.value }, this.label)))));
+        return (index.h("div", { key: '696527cfd70dab938c5cb9ee45add98cfda271ec', class: "wrapper" }, this.type === 'checkbox' ? (index.h("div", { class: "list-entry" }, index.h("ifx-checkbox", { size: "s", checked: this.value }, this.label))) : (index.h("div", { class: "list-entry" }, index.h("ifx-radio-button", { size: "s", checked: this.value }, this.label)))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ifx-list-entry.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ifx-list-entry.entry.cjs.js","mappings":";;;;AAAA,MAAM,YAAY,GAAG,gFAAgF;;MCOxF,SAAS,GAAA,MAAA;;;;;AAUpB,IAAA,YAAY,CAAC,QAAiB,EAAA;QAC5B,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC;;aAClC;AACL,YAAA,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC;;;AAKtC,IAAA,uBAAuB,CAAC,KAAkB,EAAA;AACxC,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM;QACzB,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;;IAIzF,MAAM,GAAA;QACJ,QACEA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EACjB,IAAI,CAAC,IAAI,KAAK,UAAU,IACvBA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACrBA,OAAc,CAAA,cAAA,EAAA,EAAA,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAG,EAAA,IAAI,CAAC,KAAK,CAAgB,CACnE,KAENA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrBA,OAAA,CAAA,kBAAA,EAAA,EAAkB,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAG,EAAA,IAAI,CAAC,KAAK,CAAoB,CAC3E,CACP,CACG;;;;;;;;;;;","names":["h"],"sources":["src/components/table-advanced-version/list/list-entry/list-entry.scss?tag=ifx-list-entry&encapsulation=shadow","src/components/table-advanced-version/list/list-entry/list-entry.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\r\n\r\n\r\n.list-entry {\r\n display: flex;\r\n align-items: center;\r\n margin-top: tokens.$ifxSpace100; //gap doesnt apply to child elements\r\n align-self: stretch;\r\n}","import { Component, h, Prop, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'ifx-list-entry',\r\n styleUrl: 'list-entry.scss',\r\n shadow: true,\r\n})\r\nexport class ListEntry {\r\n @Element() host: HTMLElement;\r\n @Prop({ mutable: true }) value: boolean;\r\n @Prop() label: string;\r\n\r\n @Prop() type: string;\r\n @Event() ifxListEntryChange: EventEmitter;\r\n\r\n\r\n @Watch('value')\r\n valueChanged(newValue: boolean) {\r\n if (newValue) {\r\n this.host.setAttribute('value', 'true');\r\n } else {\r\n this.host.removeAttribute('value');\r\n }\r\n }\r\n\r\n @Listen('ifxChange')\r\n handleFilterEntryChange(event: CustomEvent) {\r\n this.value = event.detail;\r\n this.ifxListEntryChange.emit({ label: this.label, value: this.value, type: this.type });\r\n }\r\n\r\n\r\n render() {\r\n return (\r\n <div class=\"wrapper\">\r\n {this.type === 'checkbox' ? (\r\n <div class=\"list-entry\">\r\n <ifx-checkbox size=\"s\" checked={this.value}>{this.label}</ifx-checkbox>\r\n </div>\r\n ) : (\r\n <div class=\"list-entry\">\r\n <ifx-radio-button size=\"s\" checked={this.value}>{this.label}</ifx-radio-button>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"ifx-list-entry.entry.cjs.js","mappings":";;;;AAAA,MAAM,YAAY,GAAG,gFAAgF;;MCOxF,SAAS,GAAA,MAAA;;;;;AAUpB,IAAA,YAAY,CAAC,QAAiB,EAAA;QAC5B,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC;;aAClC;AACL,YAAA,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC;;;AAKtC,IAAA,uBAAuB,CAAC,KAAkB,EAAA;AACxC,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM;QACzB,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;;IAIzF,MAAM,GAAA;QACJ,QACEA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EACjB,IAAI,CAAC,IAAI,KAAK,UAAU,IACvBA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACrBA,OAAc,CAAA,cAAA,EAAA,EAAA,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAG,EAAA,IAAI,CAAC,KAAK,CAAgB,CACnE,KAENA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrBA,OAAA,CAAA,kBAAA,EAAA,EAAkB,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAG,EAAA,IAAI,CAAC,KAAK,CAAoB,CAC3E,CACP,CACG;;;;;;;;;;;","names":["h"],"sources":["src/components/table-advanced-version/list/list-entry/list-entry.scss?tag=ifx-list-entry&encapsulation=shadow","src/components/table-advanced-version/list/list-entry/list-entry.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n\n.list-entry {\n display: flex;\n align-items: center;\n margin-top: tokens.$ifxSpace100; //gap doesnt apply to child elements\n align-self: stretch;\n}","import { Component, h, Prop, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list-entry',\n styleUrl: 'list-entry.scss',\n shadow: true,\n})\nexport class ListEntry {\n @Element() host: HTMLElement;\n @Prop({ mutable: true }) value: boolean;\n @Prop() label: string;\n\n @Prop() type: string;\n @Event() ifxListEntryChange: EventEmitter;\n\n\n @Watch('value')\n valueChanged(newValue: boolean) {\n if (newValue) {\n this.host.setAttribute('value', 'true');\n } else {\n this.host.removeAttribute('value');\n }\n }\n\n @Listen('ifxChange')\n handleFilterEntryChange(event: CustomEvent) {\n this.value = event.detail;\n this.ifxListEntryChange.emit({ label: this.label, value: this.value, type: this.type });\n }\n\n\n render() {\n return (\n <div class=\"wrapper\">\n {this.type === 'checkbox' ? (\n <div class=\"list-entry\">\n <ifx-checkbox size=\"s\" checked={this.value}>{this.label}</ifx-checkbox>\n </div>\n ) : (\n <div class=\"list-entry\">\n <ifx-radio-button size=\"s\" checked={this.value}>{this.label}</ifx-radio-button>\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ifx-list-entry.entry.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ifx-list-entry.entry.cjs.js","sources":["src/components/table-advanced-version/list/list-entry/list-entry.scss?tag=ifx-list-entry&encapsulation=shadow","src/components/table-advanced-version/list/list-entry/list-entry.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\r\n\r\n\r\n.list-entry {\r\n display: flex;\r\n align-items: center;\r\n margin-top: tokens.$ifxSpace100; //gap doesnt apply to child elements\r\n align-self: stretch;\r\n}","import { Component, h, Prop, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'ifx-list-entry',\r\n styleUrl: 'list-entry.scss',\r\n shadow: true,\r\n})\r\nexport class ListEntry {\r\n @Element() host: HTMLElement;\r\n @Prop({ mutable: true }) value: boolean;\r\n @Prop() label: string;\r\n\r\n @Prop() type: string;\r\n @Event() ifxListEntryChange: EventEmitter;\r\n\r\n\r\n @Watch('value')\r\n valueChanged(newValue: boolean) {\r\n if (newValue) {\r\n this.host.setAttribute('value', 'true');\r\n } else {\r\n this.host.removeAttribute('value');\r\n }\r\n }\r\n\r\n @Listen('ifxChange')\r\n handleFilterEntryChange(event: CustomEvent) {\r\n this.value = event.detail;\r\n this.ifxListEntryChange.emit({ label: this.label, value: this.value, type: this.type });\r\n }\r\n\r\n\r\n render() {\r\n return (\r\n <div class=\"wrapper\">\r\n {this.type === 'checkbox' ? (\r\n <div class=\"list-entry\">\r\n <ifx-checkbox size=\"s\" checked={this.value}>{this.label}</ifx-checkbox>\r\n </div>\r\n ) : (\r\n <div class=\"list-entry\">\r\n <ifx-radio-button size=\"s\" checked={this.value}>{this.label}</ifx-radio-button>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n }\r\n}\r\n"],"names":["h"],"mappings":";;;;AAAA,MAAM,YAAY,GAAG,gFAAgF;;MCOxF,SAAS,GAAA,MAAA;;;;;AAUpB,IAAA,YAAY,CAAC,QAAiB,EAAA;QAC5B,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC;;aAClC;AACL,YAAA,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC;;;AAKtC,IAAA,uBAAuB,CAAC,KAAkB,EAAA;AACxC,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM;QACzB,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;;IAIzF,MAAM,GAAA;QACJ,QACEA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EACjB,IAAI,CAAC,IAAI,KAAK,UAAU,IACvBA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACrBA,OAAc,CAAA,cAAA,EAAA,EAAA,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAG,EAAA,IAAI,CAAC,KAAK,CAAgB,CACnE,KAENA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrBA,OAAA,CAAA,kBAAA,EAAA,EAAkB,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAG,EAAA,IAAI,CAAC,KAAK,CAAoB,CAC3E,CACP,CACG;;;;;;;;;;;"}
1	+ {"version":3,"file":"ifx-list-entry.entry.cjs.js","sources":["src/components/table-advanced-version/list/list-entry/list-entry.scss?tag=ifx-list-entry&encapsulation=shadow","src/components/table-advanced-version/list/list-entry/list-entry.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n\n.list-entry {\n display: flex;\n align-items: center;\n margin-top: tokens.$ifxSpace100; //gap doesnt apply to child elements\n align-self: stretch;\n}","import { Component, h, Prop, Event, EventEmitter, Listen, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list-entry',\n styleUrl: 'list-entry.scss',\n shadow: true,\n})\nexport class ListEntry {\n @Element() host: HTMLElement;\n @Prop({ mutable: true }) value: boolean;\n @Prop() label: string;\n\n @Prop() type: string;\n @Event() ifxListEntryChange: EventEmitter;\n\n\n @Watch('value')\n valueChanged(newValue: boolean) {\n if (newValue) {\n this.host.setAttribute('value', 'true');\n } else {\n this.host.removeAttribute('value');\n }\n }\n\n @Listen('ifxChange')\n handleFilterEntryChange(event: CustomEvent) {\n this.value = event.detail;\n this.ifxListEntryChange.emit({ label: this.label, value: this.value, type: this.type });\n }\n\n\n render() {\n return (\n <div class=\"wrapper\">\n {this.type === 'checkbox' ? (\n <div class=\"list-entry\">\n <ifx-checkbox size=\"s\" checked={this.value}>{this.label}</ifx-checkbox>\n </div>\n ) : (\n <div class=\"list-entry\">\n <ifx-radio-button size=\"s\" checked={this.value}>{this.label}</ifx-radio-button>\n </div>\n )}\n </div>\n );\n }\n}\n"],"names":["h"],"mappings":";;;;AAAA,MAAM,YAAY,GAAG,gFAAgF;;MCOxF,SAAS,GAAA,MAAA;;;;;AAUpB,IAAA,YAAY,CAAC,QAAiB,EAAA;QAC5B,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC;;aAClC;AACL,YAAA,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC;;;AAKtC,IAAA,uBAAuB,CAAC,KAAkB,EAAA;AACxC,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM;QACzB,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;;IAIzF,MAAM,GAAA;QACJ,QACEA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EACjB,IAAI,CAAC,IAAI,KAAK,UAAU,IACvBA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACrBA,OAAc,CAAA,cAAA,EAAA,EAAA,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAG,EAAA,IAAI,CAAC,KAAK,CAAgB,CACnE,KAENA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrBA,OAAA,CAAA,kBAAA,EAAA,EAAkB,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAG,EAAA,IAAI,CAAC,KAAK,CAAoB,CAC3E,CACP,CACG;;;;;;;;;;;"}

package/dist/cjs/ifx-list.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ifx-list.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/components/table-advanced-version/list/list.scss?tag=ifx-list&encapsulation=shadow","src/components/table-advanced-version/list/list.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\r\n\r\n.link-wrapper {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: tokens.$ifxSpace100;\r\n margin-top: tokens.$ifxSpace100;\r\n}","import { Component, h, Prop, State, Event, EventEmitter, Element, Watch } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'ifx-list',\r\n styleUrl: 'list.scss',\r\n shadow: true,\r\n})\r\nexport class List {\r\n @Element() private el: HTMLElement;\r\n @State() expanded: boolean = false;\r\n @State() showMore = false;\r\n @State() selectedCount: number = 0;\r\n @State() totalItems = 0;\r\n @Prop() name = \"\";\r\n @Prop() maxVisibleItems = 6;\r\n @Prop() type: string = \"checkbox\"; //default value\r\n @Prop({ mutable: true }) resetTrigger: boolean;\r\n @State() internalResetTrigger: boolean = false;\r\n\r\n @Event() ifxListUpdate: EventEmitter;\r\n\r\n observer: MutationObserver;\r\n\r\n @Watch('type')\r\n handleTypeChange(newType: string) {\r\n this.updateListEntriesType(newType);\r\n }\r\n\r\n @Watch('resetTrigger')\r\n resetTriggerChanged(newValue: boolean) {\r\n if (newValue) {\r\n this.reset();\r\n this.resetTrigger = false; // Resetting the trigger after the action is performed\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.setupListenersAndObservers();\r\n this.initializeList();\r\n }\r\n\r\n disconnectedCallback() {\r\n this.cleanupListenersAndObservers();\r\n }\r\n\r\n reset() {\r\n this.resetListEntries();\r\n this.expanded = false;\r\n this.showMore = false;\r\n this.selectedCount = 0;\r\n this.ifxListUpdate.emit({ name: this.name, selectedItems: [] });\r\n }\r\n\r\n\r\n render() {\r\n return this.renderList();\r\n }\r\n\r\n\r\n // Refactored methods for clarity and maintainability\r\n private setupListenersAndObservers() {\r\n this.el.addEventListener('ifxListEntryChange', this.handleCheckedChange);\r\n this.observer = new MutationObserver(this.handleMutation);\r\n this.observer.observe(this.el, { childList: true });\r\n }\r\n\r\n private cleanupListenersAndObservers() {\r\n this.el.removeEventListener('ifxListEntryChange', this.handleCheckedChange);\r\n this.observer.disconnect();\r\n }\r\n \r\n private initializeList() {\r\n this.selectedCount = this.getSelectedItems(this.el).length;\r\n this.totalItems = this.getTotalItems();\r\n this.updateListEntriesType(this.type);\r\n this.checkRadioButtonConstraint();\r\n }\r\n\r\n \r\n private updateListEntriesType(newType: string) {\r\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\r\n listEntries.forEach(entry => entry.setAttribute('type', newType));\r\n }\r\n\r\n private resetListEntries() {\r\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\r\n listEntries.forEach(entry => {\r\n entry.value = false;\r\n entry.setAttribute('value', 'false');\r\n });\r\n }\r\n\r\n private handleMutation = () => {\r\n const newTotalItems = this.getTotalItems();\r\n if (newTotalItems !== this.totalItems) {\r\n this.totalItems = newTotalItems;\r\n this.handleCheckedChange();\r\n }\r\n this.updateListEntriesType(this.type);\r\n }\r\n\r\n private checkRadioButtonConstraint() {\r\n if (this.type === 'radio-button' && this.selectedCount > 1) {\r\n this.resetListEntries(); // Reset all and let the user select again\r\n this.selectedCount = 0;\r\n }\r\n }\r\n\r\n getTotalItems() {\r\n return this.el.querySelectorAll('ifx-list-entry').length;\r\n }\r\n\r\n\r\n toggleList = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.expanded = !this.expanded;\r\n }\r\n\r\n toggleShowMore = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.showMore = !this.showMore;\r\n }\r\n\r\n getSelectedItems(el: HTMLElement) {\r\n return Array.from(el.querySelectorAll('ifx-list-entry'))\r\n .filter(entry => entry.getAttribute('value') === 'true')\r\n .map(entry => ({\r\n label: entry.getAttribute('label'),\r\n value: entry.getAttribute('value'),\r\n type: entry.getAttribute('type'),\r\n element: entry\r\n }));\r\n }\r\n\r\n\r\n handleCheckedChange = (event?: CustomEvent) => {\r\n // If the type of the changed entry is 'radio-button' and its value is true, deselect all other radio buttons\r\n if (event && event.detail.type === 'radio-button' && event.detail.value) {\r\n const otherRadioButtons = Array.from(this.el.querySelectorAll('ifx-list-entry'))\r\n .filter(entry => entry.getAttribute('type') === 'radio-button' && entry !== event.target);\r\n otherRadioButtons.forEach(radioButton => radioButton.setAttribute('value', 'false'));\r\n }\r\n\r\n const selectedItems = this.getSelectedItems(this.el);\r\n this.selectedCount = selectedItems.length;\r\n\r\n this.ifxListUpdate.emit({ name: this.name, selectedItems });\r\n }\r\n\r\n private renderList() {\r\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\r\n const visibleItems = this.showMore ? listEntries : listEntries.slice(0, this.maxVisibleItems);\r\n const remainingItems = listEntries.length - visibleItems.length;\r\n\r\n return (\r\n <div class=\"list-wrapper\">\r\n {visibleItems.map(entry => <slot name={entry.getAttribute('slot')}></slot>)}\r\n {(remainingItems > 0 \|\| this.showMore) && (\r\n <div class=\"link-wrapper\" onClick={this.toggleShowMore}>\r\n <ifx-icon key={this.showMore.toString()} icon={this.showMore ? 'chevron-up-16' : 'chevron-down-16'} />\r\n <ifx-link size=\"s\" href=\"\" target=\"_blank\" variant=\"underlined\" disabled={false} >\r\n {this.showMore ? 'Show less' : `Show ${remainingItems} more`}\r\n </ifx-link>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n }\r\n}"],"version":3}
1	+ {"file":"ifx-list.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/components/table-advanced-version/list/list.scss?tag=ifx-list&encapsulation=shadow","src/components/table-advanced-version/list/list.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.link-wrapper {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: tokens.$ifxSpace100;\n margin-top: tokens.$ifxSpace100;\n}","import { Component, h, Prop, State, Event, EventEmitter, Element, Watch } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list',\n styleUrl: 'list.scss',\n shadow: true,\n})\nexport class List {\n @Element() private el: HTMLElement;\n @State() expanded: boolean = false;\n @State() showMore = false;\n @State() selectedCount: number = 0;\n @State() totalItems = 0;\n @Prop() name = \"\";\n @Prop() maxVisibleItems = 6;\n @Prop() type: string = \"checkbox\"; //default value\n @Prop({ mutable: true }) resetTrigger: boolean;\n @State() internalResetTrigger: boolean = false;\n\n @Event() ifxListUpdate: EventEmitter;\n\n observer: MutationObserver;\n\n @Watch('type')\n handleTypeChange(newType: string) {\n this.updateListEntriesType(newType);\n }\n\n @Watch('resetTrigger')\n resetTriggerChanged(newValue: boolean) {\n if (newValue) {\n this.reset();\n this.resetTrigger = false; // Resetting the trigger after the action is performed\n }\n }\n\n componentWillLoad() {\n this.setupListenersAndObservers();\n this.initializeList();\n }\n\n disconnectedCallback() {\n this.cleanupListenersAndObservers();\n }\n\n reset() {\n this.resetListEntries();\n this.expanded = false;\n this.showMore = false;\n this.selectedCount = 0;\n this.ifxListUpdate.emit({ name: this.name, selectedItems: [] });\n }\n\n\n render() {\n return this.renderList();\n }\n\n\n // Refactored methods for clarity and maintainability\n private setupListenersAndObservers() {\n this.el.addEventListener('ifxListEntryChange', this.handleCheckedChange);\n this.observer = new MutationObserver(this.handleMutation);\n this.observer.observe(this.el, { childList: true });\n }\n\n private cleanupListenersAndObservers() {\n this.el.removeEventListener('ifxListEntryChange', this.handleCheckedChange);\n this.observer.disconnect();\n }\n \n private initializeList() {\n this.selectedCount = this.getSelectedItems(this.el).length;\n this.totalItems = this.getTotalItems();\n this.updateListEntriesType(this.type);\n this.checkRadioButtonConstraint();\n }\n\n \n private updateListEntriesType(newType: string) {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n listEntries.forEach(entry => entry.setAttribute('type', newType));\n }\n\n private resetListEntries() {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n listEntries.forEach(entry => {\n entry.value = false;\n entry.setAttribute('value', 'false');\n });\n }\n\n private handleMutation = () => {\n const newTotalItems = this.getTotalItems();\n if (newTotalItems !== this.totalItems) {\n this.totalItems = newTotalItems;\n this.handleCheckedChange();\n }\n this.updateListEntriesType(this.type);\n }\n\n private checkRadioButtonConstraint() {\n if (this.type === 'radio-button' && this.selectedCount > 1) {\n this.resetListEntries(); // Reset all and let the user select again\n this.selectedCount = 0;\n }\n }\n\n getTotalItems() {\n return this.el.querySelectorAll('ifx-list-entry').length;\n }\n\n\n toggleList = (event: MouseEvent) => {\n event.stopPropagation();\n this.expanded = !this.expanded;\n }\n\n toggleShowMore = (event: MouseEvent) => {\n event.stopPropagation();\n this.showMore = !this.showMore;\n }\n\n getSelectedItems(el: HTMLElement) {\n return Array.from(el.querySelectorAll('ifx-list-entry'))\n .filter(entry => entry.getAttribute('value') === 'true')\n .map(entry => ({\n label: entry.getAttribute('label'),\n value: entry.getAttribute('value'),\n type: entry.getAttribute('type'),\n element: entry\n }));\n }\n\n\n handleCheckedChange = (event?: CustomEvent) => {\n // If the type of the changed entry is 'radio-button' and its value is true, deselect all other radio buttons\n if (event && event.detail.type === 'radio-button' && event.detail.value) {\n const otherRadioButtons = Array.from(this.el.querySelectorAll('ifx-list-entry'))\n .filter(entry => entry.getAttribute('type') === 'radio-button' && entry !== event.target);\n otherRadioButtons.forEach(radioButton => radioButton.setAttribute('value', 'false'));\n }\n\n const selectedItems = this.getSelectedItems(this.el);\n this.selectedCount = selectedItems.length;\n\n this.ifxListUpdate.emit({ name: this.name, selectedItems });\n }\n\n private renderList() {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n const visibleItems = this.showMore ? listEntries : listEntries.slice(0, this.maxVisibleItems);\n const remainingItems = listEntries.length - visibleItems.length;\n\n return (\n <div class=\"list-wrapper\">\n {visibleItems.map(entry => <slot name={entry.getAttribute('slot')}></slot>)}\n {(remainingItems > 0 \|\| this.showMore) && (\n <div class=\"link-wrapper\" onClick={this.toggleShowMore}>\n <ifx-icon key={this.showMore.toString()} icon={this.showMore ? 'chevron-up-16' : 'chevron-down-16'} />\n <ifx-link size=\"s\" href=\"\" target=\"_blank\" variant=\"underlined\" disabled={false} >\n {this.showMore ? 'Show less' : `Show ${remainingItems} more`}\n </ifx-link>\n </div>\n )}\n </div>\n );\n }\n}"],"version":3}

package/dist/cjs/ifx-list.entry.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ifx-list.entry.cjs.js","sources":["src/components/table-advanced-version/list/list.scss?tag=ifx-list&encapsulation=shadow","src/components/table-advanced-version/list/list.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\r\n\r\n.link-wrapper {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: tokens.$ifxSpace100;\r\n margin-top: tokens.$ifxSpace100;\r\n}","import { Component, h, Prop, State, Event, EventEmitter, Element, Watch } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'ifx-list',\r\n styleUrl: 'list.scss',\r\n shadow: true,\r\n})\r\nexport class List {\r\n @Element() private el: HTMLElement;\r\n @State() expanded: boolean = false;\r\n @State() showMore = false;\r\n @State() selectedCount: number = 0;\r\n @State() totalItems = 0;\r\n @Prop() name = \"\";\r\n @Prop() maxVisibleItems = 6;\r\n @Prop() type: string = \"checkbox\"; //default value\r\n @Prop({ mutable: true }) resetTrigger: boolean;\r\n @State() internalResetTrigger: boolean = false;\r\n\r\n @Event() ifxListUpdate: EventEmitter;\r\n\r\n observer: MutationObserver;\r\n\r\n @Watch('type')\r\n handleTypeChange(newType: string) {\r\n this.updateListEntriesType(newType);\r\n }\r\n\r\n @Watch('resetTrigger')\r\n resetTriggerChanged(newValue: boolean) {\r\n if (newValue) {\r\n this.reset();\r\n this.resetTrigger = false; // Resetting the trigger after the action is performed\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.setupListenersAndObservers();\r\n this.initializeList();\r\n }\r\n\r\n disconnectedCallback() {\r\n this.cleanupListenersAndObservers();\r\n }\r\n\r\n reset() {\r\n this.resetListEntries();\r\n this.expanded = false;\r\n this.showMore = false;\r\n this.selectedCount = 0;\r\n this.ifxListUpdate.emit({ name: this.name, selectedItems: [] });\r\n }\r\n\r\n\r\n render() {\r\n return this.renderList();\r\n }\r\n\r\n\r\n // Refactored methods for clarity and maintainability\r\n private setupListenersAndObservers() {\r\n this.el.addEventListener('ifxListEntryChange', this.handleCheckedChange);\r\n this.observer = new MutationObserver(this.handleMutation);\r\n this.observer.observe(this.el, { childList: true });\r\n }\r\n\r\n private cleanupListenersAndObservers() {\r\n this.el.removeEventListener('ifxListEntryChange', this.handleCheckedChange);\r\n this.observer.disconnect();\r\n }\r\n \r\n private initializeList() {\r\n this.selectedCount = this.getSelectedItems(this.el).length;\r\n this.totalItems = this.getTotalItems();\r\n this.updateListEntriesType(this.type);\r\n this.checkRadioButtonConstraint();\r\n }\r\n\r\n \r\n private updateListEntriesType(newType: string) {\r\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\r\n listEntries.forEach(entry => entry.setAttribute('type', newType));\r\n }\r\n\r\n private resetListEntries() {\r\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\r\n listEntries.forEach(entry => {\r\n entry.value = false;\r\n entry.setAttribute('value', 'false');\r\n });\r\n }\r\n\r\n private handleMutation = () => {\r\n const newTotalItems = this.getTotalItems();\r\n if (newTotalItems !== this.totalItems) {\r\n this.totalItems = newTotalItems;\r\n this.handleCheckedChange();\r\n }\r\n this.updateListEntriesType(this.type);\r\n }\r\n\r\n private checkRadioButtonConstraint() {\r\n if (this.type === 'radio-button' && this.selectedCount > 1) {\r\n this.resetListEntries(); // Reset all and let the user select again\r\n this.selectedCount = 0;\r\n }\r\n }\r\n\r\n getTotalItems() {\r\n return this.el.querySelectorAll('ifx-list-entry').length;\r\n }\r\n\r\n\r\n toggleList = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.expanded = !this.expanded;\r\n }\r\n\r\n toggleShowMore = (event: MouseEvent) => {\r\n event.stopPropagation();\r\n this.showMore = !this.showMore;\r\n }\r\n\r\n getSelectedItems(el: HTMLElement) {\r\n return Array.from(el.querySelectorAll('ifx-list-entry'))\r\n .filter(entry => entry.getAttribute('value') === 'true')\r\n .map(entry => ({\r\n label: entry.getAttribute('label'),\r\n value: entry.getAttribute('value'),\r\n type: entry.getAttribute('type'),\r\n element: entry\r\n }));\r\n }\r\n\r\n\r\n handleCheckedChange = (event?: CustomEvent) => {\r\n // If the type of the changed entry is 'radio-button' and its value is true, deselect all other radio buttons\r\n if (event && event.detail.type === 'radio-button' && event.detail.value) {\r\n const otherRadioButtons = Array.from(this.el.querySelectorAll('ifx-list-entry'))\r\n .filter(entry => entry.getAttribute('type') === 'radio-button' && entry !== event.target);\r\n otherRadioButtons.forEach(radioButton => radioButton.setAttribute('value', 'false'));\r\n }\r\n\r\n const selectedItems = this.getSelectedItems(this.el);\r\n this.selectedCount = selectedItems.length;\r\n\r\n this.ifxListUpdate.emit({ name: this.name, selectedItems });\r\n }\r\n\r\n private renderList() {\r\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\r\n const visibleItems = this.showMore ? listEntries : listEntries.slice(0, this.maxVisibleItems);\r\n const remainingItems = listEntries.length - visibleItems.length;\r\n\r\n return (\r\n <div class=\"list-wrapper\">\r\n {visibleItems.map(entry => <slot name={entry.getAttribute('slot')}></slot>)}\r\n {(remainingItems > 0 \|\| this.showMore) && (\r\n <div class=\"link-wrapper\" onClick={this.toggleShowMore}>\r\n <ifx-icon key={this.showMore.toString()} icon={this.showMore ? 'chevron-up-16' : 'chevron-down-16'} />\r\n <ifx-link size=\"s\" href=\"\" target=\"_blank\" variant=\"underlined\" disabled={false} >\r\n {this.showMore ? 'Show less' : `Show ${remainingItems} more`}\r\n </ifx-link>\r\n </div>\r\n )}\r\n </div>\r\n );\r\n }\r\n}"],"names":["h"],"mappings":"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"}
1	+ {"version":3,"file":"ifx-list.entry.cjs.js","sources":["src/components/table-advanced-version/list/list.scss?tag=ifx-list&encapsulation=shadow","src/components/table-advanced-version/list/list.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.link-wrapper {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: tokens.$ifxSpace100;\n margin-top: tokens.$ifxSpace100;\n}","import { Component, h, Prop, State, Event, EventEmitter, Element, Watch } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list',\n styleUrl: 'list.scss',\n shadow: true,\n})\nexport class List {\n @Element() private el: HTMLElement;\n @State() expanded: boolean = false;\n @State() showMore = false;\n @State() selectedCount: number = 0;\n @State() totalItems = 0;\n @Prop() name = \"\";\n @Prop() maxVisibleItems = 6;\n @Prop() type: string = \"checkbox\"; //default value\n @Prop({ mutable: true }) resetTrigger: boolean;\n @State() internalResetTrigger: boolean = false;\n\n @Event() ifxListUpdate: EventEmitter;\n\n observer: MutationObserver;\n\n @Watch('type')\n handleTypeChange(newType: string) {\n this.updateListEntriesType(newType);\n }\n\n @Watch('resetTrigger')\n resetTriggerChanged(newValue: boolean) {\n if (newValue) {\n this.reset();\n this.resetTrigger = false; // Resetting the trigger after the action is performed\n }\n }\n\n componentWillLoad() {\n this.setupListenersAndObservers();\n this.initializeList();\n }\n\n disconnectedCallback() {\n this.cleanupListenersAndObservers();\n }\n\n reset() {\n this.resetListEntries();\n this.expanded = false;\n this.showMore = false;\n this.selectedCount = 0;\n this.ifxListUpdate.emit({ name: this.name, selectedItems: [] });\n }\n\n\n render() {\n return this.renderList();\n }\n\n\n // Refactored methods for clarity and maintainability\n private setupListenersAndObservers() {\n this.el.addEventListener('ifxListEntryChange', this.handleCheckedChange);\n this.observer = new MutationObserver(this.handleMutation);\n this.observer.observe(this.el, { childList: true });\n }\n\n private cleanupListenersAndObservers() {\n this.el.removeEventListener('ifxListEntryChange', this.handleCheckedChange);\n this.observer.disconnect();\n }\n \n private initializeList() {\n this.selectedCount = this.getSelectedItems(this.el).length;\n this.totalItems = this.getTotalItems();\n this.updateListEntriesType(this.type);\n this.checkRadioButtonConstraint();\n }\n\n \n private updateListEntriesType(newType: string) {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n listEntries.forEach(entry => entry.setAttribute('type', newType));\n }\n\n private resetListEntries() {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n listEntries.forEach(entry => {\n entry.value = false;\n entry.setAttribute('value', 'false');\n });\n }\n\n private handleMutation = () => {\n const newTotalItems = this.getTotalItems();\n if (newTotalItems !== this.totalItems) {\n this.totalItems = newTotalItems;\n this.handleCheckedChange();\n }\n this.updateListEntriesType(this.type);\n }\n\n private checkRadioButtonConstraint() {\n if (this.type === 'radio-button' && this.selectedCount > 1) {\n this.resetListEntries(); // Reset all and let the user select again\n this.selectedCount = 0;\n }\n }\n\n getTotalItems() {\n return this.el.querySelectorAll('ifx-list-entry').length;\n }\n\n\n toggleList = (event: MouseEvent) => {\n event.stopPropagation();\n this.expanded = !this.expanded;\n }\n\n toggleShowMore = (event: MouseEvent) => {\n event.stopPropagation();\n this.showMore = !this.showMore;\n }\n\n getSelectedItems(el: HTMLElement) {\n return Array.from(el.querySelectorAll('ifx-list-entry'))\n .filter(entry => entry.getAttribute('value') === 'true')\n .map(entry => ({\n label: entry.getAttribute('label'),\n value: entry.getAttribute('value'),\n type: entry.getAttribute('type'),\n element: entry\n }));\n }\n\n\n handleCheckedChange = (event?: CustomEvent) => {\n // If the type of the changed entry is 'radio-button' and its value is true, deselect all other radio buttons\n if (event && event.detail.type === 'radio-button' && event.detail.value) {\n const otherRadioButtons = Array.from(this.el.querySelectorAll('ifx-list-entry'))\n .filter(entry => entry.getAttribute('type') === 'radio-button' && entry !== event.target);\n otherRadioButtons.forEach(radioButton => radioButton.setAttribute('value', 'false'));\n }\n\n const selectedItems = this.getSelectedItems(this.el);\n this.selectedCount = selectedItems.length;\n\n this.ifxListUpdate.emit({ name: this.name, selectedItems });\n }\n\n private renderList() {\n const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n const visibleItems = this.showMore ? listEntries : listEntries.slice(0, this.maxVisibleItems);\n const remainingItems = listEntries.length - visibleItems.length;\n\n return (\n <div class=\"list-wrapper\">\n {visibleItems.map(entry => <slot name={entry.getAttribute('slot')}></slot>)}\n {(remainingItems > 0 \|\| this.showMore) && (\n <div class=\"link-wrapper\" onClick={this.toggleShowMore}>\n <ifx-icon key={this.showMore.toString()} icon={this.showMore ? 'chevron-up-16' : 'chevron-down-16'} />\n <ifx-link size=\"s\" href=\"\" target=\"_blank\" variant=\"underlined\" disabled={false} >\n {this.showMore ? 'Show less' : `Show ${remainingItems} more`}\n </ifx-link>\n </div>\n )}\n </div>\n );\n }\n}"],"names":["h"],"mappings":"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"}

package/dist/cjs/ifx-modal.cjs.entry.js CHANGED Viewed

@@ -339,8 +339,8 @@ const IfxModal = class {
     }
     render() {
         const isAlertVariant = this.variant !== 'default';
-        return (index.h(index.Host, { key: '6bbf2c70a6bec5646ac9e0dd0d407647d8a8bfe0' }, index.h("div", { key: 'ad9073f6168097d55b950cb1f998b65445af2528', ref: (el) => (this.modalContainer = el), class: `modal-container ${this.showModal ? 'open' : ''}` }, index.h("div", { key: '98bef6177dcc0ebcd4fd2d6afb4dde487bd6da0c', class: "modal-overlay", onClick: () => this.handleOverlayClick() }), index.h("div", { key: '107156697de5fe6a6777da70918891cb8a32744f', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabindex: "0" }), index.h("div", { key: '56252e01d98d2d99cd38bbabe66cdc7be5c3cd3f', class: `modal-content-container ${this.size}`, role: "dialog", "aria-modal": "true", "aria-label": this.captionAriaLabel }, isAlertVariant ? (index.h("div", { class: `modal-icon-container ${this.variant === 'alert-brand' ? '' : 'danger'}` }, this.alertIcon ? index.h("ifx-icon", { icon: this.alertIcon }) : null)) : null, index.h("div", { key: '3865db58ca34df99500d2c5d3e03070e7dc0bcbf', class: "modal-content" }, index.h("div", { key: '81ea4d6edd35c84e903bfcaaebf5a51293e24412', class: "modal-header" }, index.h("h2", { key: 'efd86cf75acb7c8631e009714d987d4e92b00460', class: "modal-caption" }, this.caption), this.showCloseButton &&
-            index.h("ifx-icon-button", { key: '219502e33c5d4ae07b3f35295b60a717a3eef45e', class: 'modal-close-button', ref: (el) => (this.closeButton = el), icon: "cross-16", variant: "tertiary", onClick: () => this.doBeforeClose('CLOSE_BUTTON') })), index.h("div", { key: 'e00b53e5f2759232d7c0c5aae77e6254708814a4', class: "modal-body" }, index.h("slot", { key: '64b8b62f167181641116084d91ec29d3a84c9e78', name: "content", onSlotchange: (e) => this.handleContentUpdate(e) })), index.h("div", { key: '1b7a3d6dd7ae33cab61b3b01a6ee0f83f19fa891', class: `modal-footer ${this.slotButtonsPresent ? 'buttons-present' : ''}` }, index.h("slot", { key: '41a45a714c573e2b122ecced7fd258d80a74e7d6', name: "buttons", onSlotchange: (e) => this.handleButtonsSlotChange(e) })))), index.h("div", { key: 'eec4ae5bed38dbe5390afd80291a6c31d6bc62bd', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
+        return (index.h(index.Host, { key: '8927c0356e8b8987acf9310b559c1568c6de4f37' }, index.h("div", { key: 'df0f8b0be2953a4974ca739120c7b7495c52fc1f', ref: (el) => (this.modalContainer = el), class: `modal-container ${this.showModal ? 'open' : ''}` }, index.h("div", { key: '8e6d35ddf390200573b38c6b2057bdf382838428', class: "modal-overlay", onClick: () => this.handleOverlayClick() }), index.h("div", { key: '324587e244e5519f7e0d755cbf1b43b1ca998ce7', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabindex: "0" }), index.h("div", { key: '11cb80157d6ae5e0c57b786c0a295722b6c94d85', class: `modal-content-container ${this.size}`, role: "dialog", "aria-modal": "true", "aria-label": this.captionAriaLabel }, isAlertVariant ? (index.h("div", { class: `modal-icon-container ${this.variant === 'alert-brand' ? '' : 'danger'}` }, this.alertIcon ? index.h("ifx-icon", { icon: this.alertIcon }) : null)) : null, index.h("div", { key: 'ec6865df02bd71ac1b8513e147bf48bab522479b', class: "modal-content" }, index.h("div", { key: 'c9591304fc6ee447a60d16eea4c5017903397691', class: "modal-header" }, index.h("h2", { key: 'de9241b726711243ca5101ce3e49250f743c994b', class: "modal-caption" }, this.caption), this.showCloseButton &&
+            index.h("ifx-icon-button", { key: '561e1f6783efc4f54f422856cc4cb36c89503529', class: 'modal-close-button', ref: (el) => (this.closeButton = el), icon: "cross-16", variant: "tertiary", onClick: () => this.doBeforeClose('CLOSE_BUTTON') })), index.h("div", { key: '12788241b957ea98433872238c15a8d2ad9c13f6', class: "modal-body" }, index.h("slot", { key: '1dab9a551e1dbe7e90334869282ef0c6597104a7', name: "content", onSlotchange: (e) => this.handleContentUpdate(e) })), index.h("div", { key: '215c3be2970c6191a97a878d8fb97d5c8a2a40e6', class: `modal-footer ${this.slotButtonsPresent ? 'buttons-present' : ''}` }, index.h("slot", { key: '221bf1f5442baa42a6e098505baa32b5aa343ba0', name: "buttons", onSlotchange: (e) => this.handleButtonsSlotChange(e) })))), index.h("div", { key: '516f850b612376cde60c4cff6f7e04927bda5e7e', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ifx-modal.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ifx-modal.entry.cjs.js","mappings":"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","names":["isNestedInIfxComponent","detectFramework","trackComponent","h","Host"],"sources":["src/global/utils/focus-trap.ts","src/global/utils/animation.ts","src/components/modal/modal.scss?tag=ifx-modal&encapsulation=shadow","src/components/modal/modal.tsx"],"sourcesContent":["/*\r\n Copy/pasted from https://github.com/andreasbm/focus-trap\r\n /\r\n\r\n/\r\n Traverses the slots of the open shadowroots and returns all children matching the query.\r\n * We need to traverse each child-depth one at a time because if an element should be skipped\r\n * (for example because it is hidden) we need to skip all of it's children. If we use querySelectorAll(\"\")\r\n the information of whether the children is within a hidden parent is lost.\r\n * @param {ShadowRoot \| HTMLElement} root\r\n * @param skipNode\r\n * @param isMatch\r\n * @param {number} maxDepth\r\n * @param {number} depth\r\n * @returns {HTMLElement[]}\r\n /\r\nexport function queryShadowRoot(\r\n root: ShadowRoot \| HTMLElement,\r\n skipNode: ($elem: HTMLElement) => boolean,\r\n isMatch: ($elem: HTMLElement) => boolean,\r\n maxDepth: number = 20,\r\n depth: number = 0\r\n): HTMLElement[] {\r\n const matches: HTMLElement[] = [];\r\n\r\n // If the depth is above the max depth, abort the searching here.\r\n if (depth >= maxDepth) {\r\n return matches;\r\n }\r\n\r\n // Traverses a slot element\r\n const traverseSlot = ($slot: HTMLSlotElement) => {\r\n // Only check nodes that are of the type Node.ELEMENT_NODE\r\n // Read more here https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType\r\n const assignedNodes = $slot\r\n .assignedNodes()\r\n .filter((node) => node.nodeType === 1);\r\n if (assignedNodes.length > 0) {\r\n const $slotParent = assignedNodes[0].parentElement!;\r\n return queryShadowRoot(\r\n $slotParent,\r\n skipNode,\r\n isMatch,\r\n maxDepth,\r\n depth + 1\r\n );\r\n }\r\n\r\n return [];\r\n };\r\n\r\n // Go through each child and continue the traversing if necessary\r\n // Even though the typing says that children can't be undefined, Edge 15 sometimes gives an undefined value.\r\n // Therefore we fallback to an empty array if it is undefined.\r\n const children = Array.from(root.children \|\| []) as HTMLElement[];\r\n for (const $child of children) {\r\n // Check if the element and its descendants should be skipped\r\n if (skipNode($child)) {\r\n // console.log('-- SKIP', $child);\r\n continue;\r\n }\r\n\r\n // console.log('$child', $child);\r\n\r\n // If the element matches we always add it\r\n if (isMatch($child)) {\r\n matches.push($child);\r\n }\r\n\r\n if ($child.shadowRoot != null) {\r\n // If the element has a shadow root we need to traverse it\r\n matches.push(\r\n ...queryShadowRoot(\r\n $child.shadowRoot,\r\n skipNode,\r\n isMatch,\r\n maxDepth,\r\n depth + 1\r\n )\r\n );\r\n } else if ($child.tagName === 'SLOT') {\r\n // If the child is a slot we need to traverse each assigned node\r\n matches.push(...traverseSlot($child as HTMLSlotElement));\r\n } else {\r\n // Traverse the children of the element\r\n matches.push(\r\n ...queryShadowRoot($child, skipNode, isMatch, maxDepth, depth + 1)\r\n );\r\n }\r\n }\r\n\r\n return matches;\r\n}\r\n\r\n/\r\n Returns whether the element is hidden.\r\n * @param $elem\r\n /\r\nexport function isHidden($elem: HTMLElement): boolean {\r\n return (\r\n $elem.hasAttribute('hidden') \|\|\r\n ($elem.hasAttribute('aria-hidden') &&\r\n $elem.getAttribute('aria-hidden') !== 'false') \|\|\r\n // A quick and dirty way to check whether the element is hidden.\r\n // For a more fine-grained check we could use \"window.getComputedStyle\" but we don't because of bad performance.\r\n // If the element has visibility set to \"hidden\" or \"collapse\", display set to \"none\" or opacity set to \"0\" through CSS\r\n // we won't be able to catch it here. We accept it due to the huge performance benefits.\r\n $elem.style.display === `none` \|\|\r\n $elem.style.opacity === `0` \|\|\r\n $elem.style.visibility === `hidden` \|\|\r\n $elem.style.visibility === `collapse`\r\n );\r\n\r\n // If offsetParent is null we can assume that the element is hidden\r\n // https://stackoverflow.com/questions/306305/what-would-make-offsetparent-null\r\n // \|\| $elem.offsetParent == null;\r\n}\r\n\r\n/\r\n Returns whether the element is disabled.\r\n * @param $elem\r\n /\r\nexport function isDisabled($elem: HTMLElement): boolean {\r\n return (\r\n $elem.hasAttribute('disabled') \|\|\r\n ($elem.hasAttribute('aria-disabled') &&\r\n $elem.getAttribute('aria-disabled') !== 'false')\r\n );\r\n}\r\n\r\n/\r\n Determines whether an element is focusable.\r\n * Read more here: https://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus/1600194#1600194\r\n * Or here: https://stackoverflow.com/questions/18261595/how-to-check-if-a-dom-element-is-focusable\r\n * @param $elem\r\n /\r\nexport function isFocusable($elem: HTMLElement): boolean {\r\n // Discard elements that are removed from the tab order.\r\n if (\r\n $elem.getAttribute('tabindex') === '-1' \|\|\r\n isHidden($elem) \|\|\r\n isDisabled($elem)\r\n ) {\r\n return false;\r\n }\r\n\r\n return (\r\n // At this point we know that the element can have focus (eg. won't be -1) if the tabindex attribute exists\r\n $elem.hasAttribute('tabindex') \|\|\r\n // Anchor tags or area tags with a href set\r\n (($elem instanceof HTMLAnchorElement \|\| $elem instanceof HTMLAreaElement) &&\r\n $elem.hasAttribute('href')) \|\|\r\n // Form elements which are not disabled\r\n $elem instanceof HTMLButtonElement \|\|\r\n $elem instanceof HTMLInputElement \|\|\r\n $elem instanceof HTMLTextAreaElement \|\|\r\n $elem instanceof HTMLSelectElement \|\|\r\n // IFrames\r\n $elem instanceof HTMLIFrameElement\r\n );\r\n}","export function animationTo(\r\n element: HTMLElement,\r\n keyframes: Keyframe \| Keyframe[],\r\n options?: KeyframeAnimationOptions\r\n) {\r\n const animated = element.animate(keyframes, { ...options, fill: 'both' });\r\n animated.addEventListener('finish', () => {\r\n // @ts-ignore\r\n animated.commitStyles();\r\n animated.cancel();\r\n });\r\n\r\n return animated;\r\n}\r\n\r\nconst keyframeDefaults = {\r\n easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',\r\n};\r\n\r\nexport const KEYFRAMES = {\r\n fadeIn: [\r\n {\r\n offset: 0,\r\n ...keyframeDefaults,\r\n opacity: 0,\r\n },\r\n {\r\n offset: 1,\r\n ...keyframeDefaults,\r\n opacity: 1,\r\n },\r\n ],\r\n fadeOut: [\r\n {\r\n offset: 0,\r\n ...keyframeDefaults,\r\n opacity: 1,\r\n },\r\n {\r\n offset: 1,\r\n ...keyframeDefaults,\r\n opacity: 0,\r\n },\r\n ],\r\n};","@use \"~@infineon/design-system-tokens/dist/tokens\";\r\n@use \"../../global/font.scss\";\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n.modal-container {\r\n display: none;\r\n justify-content: center;\r\n align-items: center;\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n z-index: 1060;\r\n overflow-y: auto;\r\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\r\n\r\n\r\n\r\n}\r\n\r\n.modal-container.open {\r\n display: flex;\r\n}\r\n\r\n.modal-overlay {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background-color: tokens.$ifxColorBaseBlack;\r\n opacity: 0.5;\r\n z-index: 0;\r\n}\r\n\r\n.modal-content-container {\r\n position: absolute;\r\n display: flex;\r\n justify-content: center;\r\n width: 90%;\r\n min-height: 218px;\r\n background-color: #fff;\r\n border-radius: tokens.$ifxBorderRadiusNone;\r\n box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\r\n \r\n //overflow: hidden;\r\n\r\n box-sizing: border-box;\r\n align-items: stretch;\r\n}\r\n\r\n.modal-content-container {\r\n &.no-overflow { \r\n overflow: hidden;\r\n & .modal-body { \r\n overflow-y: auto;\r\n }\r\n }\r\n}\r\n\r\n/ Add desktop size here /\r\n@media screen and (min-width: 768px) {\r\n .modal-content-container {\r\n width: 540px;\r\n min-height: 132px;\r\n\r\n &.m,\r\n &.l,\r\n &.s {\r\n width: 90%;\r\n }\r\n }\r\n}\r\n\r\n@media screen and (min-width: 1024px) {\r\n .modal-content-container {\r\n\r\n &.s {\r\n width: 47vw;\r\n }\r\n\r\n &.m {\r\n width: 63vw;\r\n }\r\n\r\n &.l {\r\n width: 80%;\r\n }\r\n }\r\n}\r\n\r\n.modal-content {\r\n display: flex;\r\n flex-direction: column;\r\n width: 100%;\r\n max-height: 90vh;\r\n}\r\n\r\n.modal-icon-container {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 32px;\r\n background-color: tokens.$ifxColorOcean500;\r\n align-self: stretch;\r\n\r\n &.danger {\r\n background-color: tokens.$ifxColorRed500;\r\n }\r\n\r\n & ifx-icon {\r\n color: tokens.$ifxColorBaseWhite;\r\n }\r\n}\r\n\r\n.modal-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n padding: 24px;\r\n min-height: 76px;\r\n max-height: 105px;\r\n box-sizing: border-box;\r\n border-radius: 1px 1px 0px 0px;\r\n border-bottom: 1px solid tokens.$ifxColorEngineering200;\r\n}\r\n\r\n.modal-caption {\r\n max-height: 56px;\r\n display: -webkit-box;\r\n overflow: hidden;\r\n white-space: pre-wrap;\r\n word-wrap: break-word;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical; \r\n}\r\n\r\n.modal-header h2 {\r\n margin: 0;\r\n font-weight: tokens.$ifxFontWeightSemibold;\r\n font-size: tokens.$ifxFontSizeXl;\r\n line-height: 28px;\r\n}\r\n\r\n.modal-header button {\r\n background: none;\r\n border: none;\r\n font-size: 1.5em;\r\n padding: 0;\r\n cursor: pointer;\r\n}\r\n\r\n.modal-close-button {\r\n align-self: flex-start;\r\n margin-right: -8px;\r\n}\r\n\r\n.modal-body {\r\n padding: 16px 24px;\r\n min-height: 56px;\r\n box-sizing: border-box;\r\n flex: 1;\r\n \r\n //overflow-y: auto;\r\n}\r\n\r\n.modal-footer.buttons-present ::slotted(){\r\n display: flex;\r\n justify-content: flex-end;\r\n gap: 16px;\r\n padding: 16px 24px 32px 16px\r\n}\r\n\r\n.modal-border {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 100%;\r\n font-size: 1.5em;\r\n flex-grow: 1;\r\n\r\n &.primary {\r\n background-color: tokens.$ifxColorOcean500;\r\n }\r\n\r\n &.secondary {\r\n background-color: tokens.$ifxColorEngineering500;\r\n }\r\n\r\n &.danger {\r\n background-color: tokens.$ifxColorRed500;\r\n }\r\n\r\n &.success {\r\n background-color: tokens.$ifxColorGreen500;\r\n }\r\n\r\n &.warning {\r\n background-color: tokens.$ifxColorOrange500;\r\n }\r\n\r\n &.orange {\r\n background-color: tokens.$ifxColorOrange500;\r\n }\r\n\r\n &.ocean {\r\n background-color: tokens.$ifxColorOcean500;\r\n }\r\n\r\n &.grey {\r\n background-color: tokens.$ifxColorEngineering500;\r\n }\r\n\r\n &.grey-200 {\r\n background-color: tokens.$ifxColorEngineering200;\r\n }\r\n\r\n &.red {\r\n background-color: tokens.$ifxColorRed500;\r\n }\r\n\r\n &.green {\r\n background-color: tokens.$ifxColorGreen500;\r\n }\r\n\r\n &.berry {\r\n background-color: tokens.$ifxColorBerry500;\r\n }\r\n}","import { Component, Prop, Element, State, Event, Host, EventEmitter, h, Watch } from '@stencil/core';\r\nimport { trackComponent } from '../../global/utils/tracking';\r\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\r\nimport { detectFramework } from '../../global/utils/framework-detection';\r\nimport { queryShadowRoot, isHidden, isFocusable } from '../../global/utils/focus-trap';\r\nimport { animationTo, KEYFRAMES } from '../../global/utils/animation';\r\n \r\ntype CloseEventTrigger = 'CLOSE_BUTTON' \| 'ESCAPE_KEY' \| 'BACKDROP';\r\n\r\nexport interface BeforeCloseEventDetail {\r\n trigger: CloseEventTrigger;\r\n}\r\n@Component({\r\n tag: 'ifx-modal',\r\n styleUrl: 'modal.scss',\r\n shadow: true\r\n})\r\nexport class IfxModal {\r\n @Prop({ reflect: true, mutable: true }) opened?: boolean = false;\r\n @State() showModal: boolean = this.opened \|\| false;\r\n\r\n @Prop() caption: string = 'Modal Title';\r\n @Prop() captionAriaLabel: string \| null;\r\n\r\n @Prop() closeOnOverlayClick: boolean = true;\r\n\r\n @Event() ifxOpen: EventEmitter;\r\n @Event() ifxClose: EventEmitter;\r\n\r\n @Prop() variant: 'default' \| 'alert-brand' \| 'alert-danger' = 'default';\r\n\r\n @Prop() size: 's' \| 'm' \| 'l' = 's';\r\n\r\n @Prop() alertIcon: string = '';\r\n @Prop() okButtonLabel: string = 'OK';\r\n @Prop() cancelButtonLabel: string = 'Cancel';\r\n @Prop() closeButtonAriaLabel: string \| null;\r\n\r\n @Element() hostElement: HTMLElement;\r\n\r\n @State() slotButtonsPresent: boolean = false;\r\n\r\n @Prop() showCloseButton: boolean = true;\r\n\r\n private modalContainer: HTMLElement;\r\n private focusableElements: HTMLElement[] = [];\r\n private closeButton: HTMLButtonElement \| HTMLIfxIconButtonElement;\r\n private resizeTimeout: ReturnType<typeof setTimeout>;\r\n\r\n handleResize = () => {\r\n clearTimeout(this.resizeTimeout);\r\n this.resizeTimeout = setTimeout(() => {\r\n if (this.showModal) {\r\n this.handleComponentOverflow();\r\n }\r\n }, 100);\r\n};\r\n\r\n async componentDidLoad() {\r\n if(!isNestedInIfxComponent(this.hostElement)) { \r\n const framework = detectFramework();\r\n trackComponent('ifx-modal', await framework)\r\n }\r\n // Query all focusable elements and store them in `focusableElements`.\r\n // Needed for the \"focus trap\" functionality.\r\n this.focusableElements = queryShadowRoot(\r\n this.hostElement.shadowRoot,\r\n (el) => isHidden(el) \|\| el.matches('[data-focus-trap-edge]'),\r\n isFocusable\r\n );\r\n window.addEventListener('resize', this.handleResize);\r\n }\r\n\r\n disconnectedCallback() {\r\n window.removeEventListener('resize', this.handleResize);\r\n}\r\n\r\n componentWillRender() { \r\n if(this.showModal) { \r\n this.handleComponentOverflow();\r\n }\r\n }\r\n\r\n async handleComponentOverflow() { \r\n const modalContentContainer = this.hostElement.shadowRoot.querySelector('.modal-content-container');\r\n if (this.showModal && await this.isModalContentContainerHeightReachedViewport()) {\r\n modalContentContainer.classList.add('no-overflow')\r\n } else if (modalContentContainer?.classList.contains('no-overflow')) {\r\n modalContentContainer?.classList.remove('no-overflow')\r\n }\r\n }\r\n\r\n getFirstFocusableElement(): HTMLElement \| null {\r\n return this.focusableElements[0];\r\n }\r\n\r\n getLastFocusableElement(): HTMLElement \| null {\r\n return this.focusableElements[this.focusableElements.length - 1];\r\n }\r\n\r\n handleTopFocus = () => {\r\n this.attemptFocus(this.getLastFocusableElement());\r\n };\r\n\r\n handleBottomFocus = () => {\r\n this.attemptFocus(this.getFirstFocusableElement());\r\n };\r\n\r\n attemptFocus(element: HTMLElement \| null) {\r\n if (element == null) {\r\n setTimeout(() => { //wait until DOM is fully loaded\r\n this.closeButton.focus();\r\n },);\r\n return;\r\n }\r\n\r\n setTimeout(() => { //wait until DOM is fully loaded\r\n element.focus();\r\n }, 0);\r\n }\r\n\r\n open() {\r\n this.showModal = true;\r\n try {\r\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeIn, {\r\n duration: 200,\r\n });\r\n anim.addEventListener('finish', () => {\r\n // Setting focus on last item and removing immediately\r\n // so, on tab press first element is focused\r\n setTimeout(() => {\r\n this.getLastFocusableElement()?.focus();\r\n this.getLastFocusableElement()?.blur();\r\n }, 0);\r\n\r\n this.ifxOpen.emit();\r\n });\r\n\r\n this.hostElement.addEventListener('keydown', this.handleKeypress);\r\n } catch (err) {\r\n this.ifxOpen.emit();\r\n }\r\n }\r\n\r\n close() {\r\n try {\r\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {\r\n duration: 200,\r\n });\r\n anim.addEventListener('finish', () => {\r\n this.showModal = false;\r\n this.ifxClose.emit();\r\n });\r\n this.hostElement.removeEventListener('keydown', this.handleKeypress);\r\n } catch (err) {\r\n this.showModal = false;\r\n this.ifxClose.emit();\r\n }\r\n }\r\n\r\n handleKeypress = (event: KeyboardEvent) => {\r\n if (!this.showModal) {\r\n return;\r\n }\r\n if (event.key === 'Escape') {\r\n this.doBeforeClose('ESCAPE_KEY');\r\n }\r\n };\r\n\r\n doBeforeClose(trigger: CloseEventTrigger) {\r\n const triggers = [];\r\n triggers.push(trigger);\r\n const prevented = triggers.some((event) => event.defaultPrevented);\r\n if (!prevented) {\r\n this.opened = false;\r\n }\r\n }\r\n\r\n @Watch('opened')\r\n openedChanged(newValue) {\r\n if (newValue === true) {\r\n this.open();\r\n } else {\r\n this.close()\r\n }\r\n }\r\n\r\n handleOverlayClick() {\r\n if (this.closeOnOverlayClick) {\r\n this.doBeforeClose('BACKDROP')\r\n }\r\n }\r\n\r\n handleContentUpdate(e) {\r\n const slotElement = e.target;\r\n const nodes = slotElement.assignedNodes();\r\n if (nodes.length > 0) {\r\n nodes.forEach(node => {\r\n if (node.observer) {\r\n node.observer.disconnect();\r\n delete node.observer;\r\n }\r\n const observer = new MutationObserver((mutationsList, _) => {\r\n for (let mutation of mutationsList) {\r\n if (mutation.type === 'childList') {\r\n if (this.showModal) {\r\n this.handleComponentOverflow();\r\n }\r\n }\r\n }\r\n });\r\n observer.observe(node, { attributes: true, childList: true, subtree: true });\r\n node.observer = observer;\r\n });\r\n }\r\n }\r\n\r\n handleButtonsSlotChange(e) {\r\n if (e.currentTarget.assignedElements()[0]?.childElementCount > 0) {\r\n this.slotButtonsPresent = true;\r\n } else {\r\n this.slotButtonsPresent = false;\r\n }\r\n }\r\n\r\n isModalContentContainerHeightReachedViewport() {\r\n //Adding timeout for proper height detection on Edge browser\r\n return new Promise(resolve => {\r\n setTimeout(() => {\r\n const modalContent = this.hostElement.shadowRoot.querySelector('.modal-content') as HTMLElement;\r\n const modalContentHeight = modalContent.offsetHeight;\r\n const viewportHeight = window.innerHeight;\r\n const extraMarginForEdgeBrowser = 3;\r\n resolve(modalContentHeight + extraMarginForEdgeBrowser >= viewportHeight * 0.9);\r\n }, 100);\r\n });\r\n}\r\n\r\n\r\n render() {\r\n const isAlertVariant = this.variant !== 'default';\r\n return (\r\n <Host>\r\n <div\r\n ref={(el) => (this.modalContainer = el)}\r\n class={`modal-container ${this.showModal ? 'open' : ''}`}\r\n >\r\n <div\r\n class=\"modal-overlay\"\r\n onClick={() => this.handleOverlayClick()}\r\n ></div>\r\n <div\r\n data-focus-trap-edge\r\n onFocus={this.handleTopFocus}\r\n tabindex=\"0\"\r\n ></div>\r\n <div\r\n class={`modal-content-container ${this.size}`}\r\n role=\"dialog\"\r\n aria-modal=\"true\"\r\n aria-label={this.captionAriaLabel}>\r\n {isAlertVariant ? (\r\n <div class={`modal-icon-container ${this.variant === 'alert-brand' ? '' : 'danger'}`}>\r\n {this.alertIcon ? <ifx-icon icon={this.alertIcon} /> : null}\r\n </div>\r\n ) : null}\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <h2 class=\"modal-caption\">{this.caption}</h2>\r\n {\r\n this.showCloseButton &&\r\n <ifx-icon-button class='modal-close-button' ref={(el) => (this.closeButton = el)} icon=\"cross-16\" variant=\"tertiary\" onClick={() => this.doBeforeClose('CLOSE_BUTTON')}>\r\n </ifx-icon-button>\r\n }\r\n </div>\r\n <div class=\"modal-body\">\r\n <slot name=\"content\" onSlotchange={(e) => this.handleContentUpdate(e)} />\r\n </div>\r\n <div class={`modal-footer ${this.slotButtonsPresent ? 'buttons-present' : ''}`}>\r\n <slot name=\"buttons\" onSlotchange={(e) => this.handleButtonsSlotChange(e)}>\r\n </slot>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n data-focus-trap-edge\r\n onFocus={this.handleBottomFocus}\r\n tabindex=\"0\"\r\n ></div>\r\n </div>\r\n </Host>\r\n\r\n );\r\n }\r\n}"],"version":3}
1	+ {"file":"ifx-modal.entry.cjs.js","mappings":"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","names":["isNestedInIfxComponent","detectFramework","trackComponent","h","Host"],"sources":["src/global/utils/focus-trap.ts","src/global/utils/animation.ts","src/components/modal/modal.scss?tag=ifx-modal&encapsulation=shadow","src/components/modal/modal.tsx"],"sourcesContent":["/*\n Copy/pasted from https://github.com/andreasbm/focus-trap\n /\n\n/\n Traverses the slots of the open shadowroots and returns all children matching the query.\n * We need to traverse each child-depth one at a time because if an element should be skipped\n * (for example because it is hidden) we need to skip all of it's children. If we use querySelectorAll(\"\")\n the information of whether the children is within a hidden parent is lost.\n * @param {ShadowRoot \| HTMLElement} root\n * @param skipNode\n * @param isMatch\n * @param {number} maxDepth\n * @param {number} depth\n * @returns {HTMLElement[]}\n /\nexport function queryShadowRoot(\n root: ShadowRoot \| HTMLElement,\n skipNode: ($elem: HTMLElement) => boolean,\n isMatch: ($elem: HTMLElement) => boolean,\n maxDepth: number = 20,\n depth: number = 0\n): HTMLElement[] {\n const matches: HTMLElement[] = [];\n\n // If the depth is above the max depth, abort the searching here.\n if (depth >= maxDepth) {\n return matches;\n }\n\n // Traverses a slot element\n const traverseSlot = ($slot: HTMLSlotElement) => {\n // Only check nodes that are of the type Node.ELEMENT_NODE\n // Read more here https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType\n const assignedNodes = $slot\n .assignedNodes()\n .filter((node) => node.nodeType === 1);\n if (assignedNodes.length > 0) {\n const $slotParent = assignedNodes[0].parentElement!;\n return queryShadowRoot(\n $slotParent,\n skipNode,\n isMatch,\n maxDepth,\n depth + 1\n );\n }\n\n return [];\n };\n\n // Go through each child and continue the traversing if necessary\n // Even though the typing says that children can't be undefined, Edge 15 sometimes gives an undefined value.\n // Therefore we fallback to an empty array if it is undefined.\n const children = Array.from(root.children \|\| []) as HTMLElement[];\n for (const $child of children) {\n // Check if the element and its descendants should be skipped\n if (skipNode($child)) {\n // console.log('-- SKIP', $child);\n continue;\n }\n\n // console.log('$child', $child);\n\n // If the element matches we always add it\n if (isMatch($child)) {\n matches.push($child);\n }\n\n if ($child.shadowRoot != null) {\n // If the element has a shadow root we need to traverse it\n matches.push(\n ...queryShadowRoot(\n $child.shadowRoot,\n skipNode,\n isMatch,\n maxDepth,\n depth + 1\n )\n );\n } else if ($child.tagName === 'SLOT') {\n // If the child is a slot we need to traverse each assigned node\n matches.push(...traverseSlot($child as HTMLSlotElement));\n } else {\n // Traverse the children of the element\n matches.push(\n ...queryShadowRoot($child, skipNode, isMatch, maxDepth, depth + 1)\n );\n }\n }\n\n return matches;\n}\n\n/\n Returns whether the element is hidden.\n * @param $elem\n /\nexport function isHidden($elem: HTMLElement): boolean {\n return (\n $elem.hasAttribute('hidden') \|\|\n ($elem.hasAttribute('aria-hidden') &&\n $elem.getAttribute('aria-hidden') !== 'false') \|\|\n // A quick and dirty way to check whether the element is hidden.\n // For a more fine-grained check we could use \"window.getComputedStyle\" but we don't because of bad performance.\n // If the element has visibility set to \"hidden\" or \"collapse\", display set to \"none\" or opacity set to \"0\" through CSS\n // we won't be able to catch it here. We accept it due to the huge performance benefits.\n $elem.style.display === `none` \|\|\n $elem.style.opacity === `0` \|\|\n $elem.style.visibility === `hidden` \|\|\n $elem.style.visibility === `collapse`\n );\n\n // If offsetParent is null we can assume that the element is hidden\n // https://stackoverflow.com/questions/306305/what-would-make-offsetparent-null\n // \|\| $elem.offsetParent == null;\n}\n\n/\n Returns whether the element is disabled.\n * @param $elem\n /\nexport function isDisabled($elem: HTMLElement): boolean {\n return (\n $elem.hasAttribute('disabled') \|\|\n ($elem.hasAttribute('aria-disabled') &&\n $elem.getAttribute('aria-disabled') !== 'false')\n );\n}\n\n/\n Determines whether an element is focusable.\n * Read more here: https://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus/1600194#1600194\n * Or here: https://stackoverflow.com/questions/18261595/how-to-check-if-a-dom-element-is-focusable\n * @param $elem\n /\nexport function isFocusable($elem: HTMLElement): boolean {\n // Discard elements that are removed from the tab order.\n if (\n $elem.getAttribute('tabindex') === '-1' \|\|\n isHidden($elem) \|\|\n isDisabled($elem)\n ) {\n return false;\n }\n\n return (\n // At this point we know that the element can have focus (eg. won't be -1) if the tabindex attribute exists\n $elem.hasAttribute('tabindex') \|\|\n // Anchor tags or area tags with a href set\n (($elem instanceof HTMLAnchorElement \|\| $elem instanceof HTMLAreaElement) &&\n $elem.hasAttribute('href')) \|\|\n // Form elements which are not disabled\n $elem instanceof HTMLButtonElement \|\|\n $elem instanceof HTMLInputElement \|\|\n $elem instanceof HTMLTextAreaElement \|\|\n $elem instanceof HTMLSelectElement \|\|\n // IFrames\n $elem instanceof HTMLIFrameElement\n );\n}","export function animationTo(\n element: HTMLElement,\n keyframes: Keyframe \| Keyframe[],\n options?: KeyframeAnimationOptions\n) {\n const animated = element.animate(keyframes, { ...options, fill: 'both' });\n animated.addEventListener('finish', () => {\n // @ts-ignore\n animated.commitStyles();\n animated.cancel();\n });\n\n return animated;\n}\n\nconst keyframeDefaults = {\n easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',\n};\n\nexport const KEYFRAMES = {\n fadeIn: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 0,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 1,\n },\n ],\n fadeOut: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 1,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 0,\n },\n ],\n};","@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: block;\n}\n\n.modal-container {\n display: none;\n justify-content: center;\n align-items: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1060;\n overflow-y: auto;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n}\n\n.modal-container.open {\n display: flex;\n}\n\n.modal-overlay {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: tokens.$ifxColorBaseBlack;\n opacity: 0.5;\n z-index: 0;\n}\n\n.modal-content-container {\n position: absolute;\n display: flex;\n justify-content: center;\n width: 90%;\n min-height: 218px;\n background-color: #fff;\n border-radius: tokens.$ifxBorderRadiusNone;\n box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n \n //overflow: hidden;\n\n box-sizing: border-box;\n align-items: stretch;\n}\n\n.modal-content-container {\n &.no-overflow { \n overflow: hidden;\n & .modal-body { \n overflow-y: auto;\n }\n }\n}\n\n/ Add desktop size here /\n@media screen and (min-width: 768px) {\n .modal-content-container {\n width: 540px;\n min-height: 132px;\n\n &.m,\n &.l,\n &.s {\n width: 90%;\n }\n }\n}\n\n@media screen and (min-width: 1024px) {\n .modal-content-container {\n\n &.s {\n width: 47vw;\n }\n\n &.m {\n width: 63vw;\n }\n\n &.l {\n width: 80%;\n }\n }\n}\n\n.modal-content {\n display: flex;\n flex-direction: column;\n width: 100%;\n max-height: 90vh;\n}\n\n.modal-icon-container {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n background-color: tokens.$ifxColorOcean500;\n align-self: stretch;\n\n &.danger {\n background-color: tokens.$ifxColorRed500;\n }\n\n & ifx-icon {\n color: tokens.$ifxColorBaseWhite;\n }\n}\n\n.modal-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 24px;\n min-height: 76px;\n max-height: 105px;\n box-sizing: border-box;\n border-radius: 1px 1px 0px 0px;\n border-bottom: 1px solid tokens.$ifxColorEngineering200;\n}\n\n.modal-caption {\n max-height: 56px;\n display: -webkit-box;\n overflow: hidden;\n white-space: pre-wrap;\n word-wrap: break-word;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical; \n}\n\n.modal-header h2 {\n margin: 0;\n font-weight: tokens.$ifxFontWeightSemibold;\n font-size: tokens.$ifxFontSizeXl;\n line-height: 28px;\n}\n\n.modal-header button {\n background: none;\n border: none;\n font-size: 1.5em;\n padding: 0;\n cursor: pointer;\n}\n\n.modal-close-button {\n align-self: flex-start;\n margin-right: -8px;\n}\n\n.modal-body {\n padding: 16px 24px;\n min-height: 56px;\n box-sizing: border-box;\n flex: 1;\n \n //overflow-y: auto;\n}\n\n.modal-footer.buttons-present ::slotted(){\n display: flex;\n justify-content: flex-end;\n gap: 16px;\n padding: 16px 24px 32px 16px\n}\n\n.modal-border {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n font-size: 1.5em;\n flex-grow: 1;\n\n &.primary {\n background-color: tokens.$ifxColorOcean500;\n }\n\n &.secondary {\n background-color: tokens.$ifxColorEngineering500;\n }\n\n &.danger {\n background-color: tokens.$ifxColorRed500;\n }\n\n &.success {\n background-color: tokens.$ifxColorGreen500;\n }\n\n &.warning {\n background-color: tokens.$ifxColorOrange500;\n }\n\n &.orange {\n background-color: tokens.$ifxColorOrange500;\n }\n\n &.ocean {\n background-color: tokens.$ifxColorOcean500;\n }\n\n &.grey {\n background-color: tokens.$ifxColorEngineering500;\n }\n\n &.grey-200 {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &.red {\n background-color: tokens.$ifxColorRed500;\n }\n\n &.green {\n background-color: tokens.$ifxColorGreen500;\n }\n\n &.berry {\n background-color: tokens.$ifxColorBerry500;\n }\n}","import { Component, Prop, Element, State, Event, Host, EventEmitter, h, Watch } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport { queryShadowRoot, isHidden, isFocusable } from '../../global/utils/focus-trap';\nimport { animationTo, KEYFRAMES } from '../../global/utils/animation';\n \ntype CloseEventTrigger = 'CLOSE_BUTTON' \| 'ESCAPE_KEY' \| 'BACKDROP';\n\nexport interface BeforeCloseEventDetail {\n trigger: CloseEventTrigger;\n}\n@Component({\n tag: 'ifx-modal',\n styleUrl: 'modal.scss',\n shadow: true\n})\nexport class IfxModal {\n @Prop({ reflect: true, mutable: true }) opened?: boolean = false;\n @State() showModal: boolean = this.opened \|\| false;\n\n @Prop() caption: string = 'Modal Title';\n @Prop() captionAriaLabel: string \| null;\n\n @Prop() closeOnOverlayClick: boolean = true;\n\n @Event() ifxOpen: EventEmitter;\n @Event() ifxClose: EventEmitter;\n\n @Prop() variant: 'default' \| 'alert-brand' \| 'alert-danger' = 'default';\n\n @Prop() size: 's' \| 'm' \| 'l' = 's';\n\n @Prop() alertIcon: string = '';\n @Prop() okButtonLabel: string = 'OK';\n @Prop() cancelButtonLabel: string = 'Cancel';\n @Prop() closeButtonAriaLabel: string \| null;\n\n @Element() hostElement: HTMLElement;\n\n @State() slotButtonsPresent: boolean = false;\n\n @Prop() showCloseButton: boolean = true;\n\n private modalContainer: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n private closeButton: HTMLButtonElement \| HTMLIfxIconButtonElement;\n private resizeTimeout: ReturnType<typeof setTimeout>;\n\n handleResize = () => {\n clearTimeout(this.resizeTimeout);\n this.resizeTimeout = setTimeout(() => {\n if (this.showModal) {\n this.handleComponentOverflow();\n }\n }, 100);\n};\n\n async componentDidLoad() {\n if(!isNestedInIfxComponent(this.hostElement)) { \n const framework = detectFramework();\n trackComponent('ifx-modal', await framework)\n }\n // Query all focusable elements and store them in `focusableElements`.\n // Needed for the \"focus trap\" functionality.\n this.focusableElements = queryShadowRoot(\n this.hostElement.shadowRoot,\n (el) => isHidden(el) \|\| el.matches('[data-focus-trap-edge]'),\n isFocusable\n );\n window.addEventListener('resize', this.handleResize);\n }\n\n disconnectedCallback() {\n window.removeEventListener('resize', this.handleResize);\n}\n\n componentWillRender() { \n if(this.showModal) { \n this.handleComponentOverflow();\n }\n }\n\n async handleComponentOverflow() { \n const modalContentContainer = this.hostElement.shadowRoot.querySelector('.modal-content-container');\n if (this.showModal && await this.isModalContentContainerHeightReachedViewport()) {\n modalContentContainer.classList.add('no-overflow')\n } else if (modalContentContainer?.classList.contains('no-overflow')) {\n modalContentContainer?.classList.remove('no-overflow')\n }\n }\n\n getFirstFocusableElement(): HTMLElement \| null {\n return this.focusableElements[0];\n }\n\n getLastFocusableElement(): HTMLElement \| null {\n return this.focusableElements[this.focusableElements.length - 1];\n }\n\n handleTopFocus = () => {\n this.attemptFocus(this.getLastFocusableElement());\n };\n\n handleBottomFocus = () => {\n this.attemptFocus(this.getFirstFocusableElement());\n };\n\n attemptFocus(element: HTMLElement \| null) {\n if (element == null) {\n setTimeout(() => { //wait until DOM is fully loaded\n this.closeButton.focus();\n },);\n return;\n }\n\n setTimeout(() => { //wait until DOM is fully loaded\n element.focus();\n }, 0);\n }\n\n open() {\n this.showModal = true;\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeIn, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n // Setting focus on last item and removing immediately\n // so, on tab press first element is focused\n setTimeout(() => {\n this.getLastFocusableElement()?.focus();\n this.getLastFocusableElement()?.blur();\n }, 0);\n\n this.ifxOpen.emit();\n });\n\n this.hostElement.addEventListener('keydown', this.handleKeypress);\n } catch (err) {\n this.ifxOpen.emit();\n }\n }\n\n close() {\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n this.showModal = false;\n this.ifxClose.emit();\n });\n this.hostElement.removeEventListener('keydown', this.handleKeypress);\n } catch (err) {\n this.showModal = false;\n this.ifxClose.emit();\n }\n }\n\n handleKeypress = (event: KeyboardEvent) => {\n if (!this.showModal) {\n return;\n }\n if (event.key === 'Escape') {\n this.doBeforeClose('ESCAPE_KEY');\n }\n };\n\n doBeforeClose(trigger: CloseEventTrigger) {\n const triggers = [];\n triggers.push(trigger);\n const prevented = triggers.some((event) => event.defaultPrevented);\n if (!prevented) {\n this.opened = false;\n }\n }\n\n @Watch('opened')\n openedChanged(newValue) {\n if (newValue === true) {\n this.open();\n } else {\n this.close()\n }\n }\n\n handleOverlayClick() {\n if (this.closeOnOverlayClick) {\n this.doBeforeClose('BACKDROP')\n }\n }\n\n handleContentUpdate(e) {\n const slotElement = e.target;\n const nodes = slotElement.assignedNodes();\n if (nodes.length > 0) {\n nodes.forEach(node => {\n if (node.observer) {\n node.observer.disconnect();\n delete node.observer;\n }\n const observer = new MutationObserver((mutationsList, _) => {\n for (let mutation of mutationsList) {\n if (mutation.type === 'childList') {\n if (this.showModal) {\n this.handleComponentOverflow();\n }\n }\n }\n });\n observer.observe(node, { attributes: true, childList: true, subtree: true });\n node.observer = observer;\n });\n }\n }\n\n handleButtonsSlotChange(e) {\n if (e.currentTarget.assignedElements()[0]?.childElementCount > 0) {\n this.slotButtonsPresent = true;\n } else {\n this.slotButtonsPresent = false;\n }\n }\n\n isModalContentContainerHeightReachedViewport() {\n //Adding timeout for proper height detection on Edge browser\n return new Promise(resolve => {\n setTimeout(() => {\n const modalContent = this.hostElement.shadowRoot.querySelector('.modal-content') as HTMLElement;\n const modalContentHeight = modalContent.offsetHeight;\n const viewportHeight = window.innerHeight;\n const extraMarginForEdgeBrowser = 3;\n resolve(modalContentHeight + extraMarginForEdgeBrowser >= viewportHeight * 0.9);\n }, 100);\n });\n}\n\n\n render() {\n const isAlertVariant = this.variant !== 'default';\n return (\n <Host>\n <div\n ref={(el) => (this.modalContainer = el)}\n class={`modal-container ${this.showModal ? 'open' : ''}`}\n >\n <div\n class=\"modal-overlay\"\n onClick={() => this.handleOverlayClick()}\n ></div>\n <div\n data-focus-trap-edge\n onFocus={this.handleTopFocus}\n tabindex=\"0\"\n ></div>\n <div\n class={`modal-content-container ${this.size}`}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={this.captionAriaLabel}>\n {isAlertVariant ? (\n <div class={`modal-icon-container ${this.variant === 'alert-brand' ? '' : 'danger'}`}>\n {this.alertIcon ? <ifx-icon icon={this.alertIcon} /> : null}\n </div>\n ) : null}\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2 class=\"modal-caption\">{this.caption}</h2>\n {\n this.showCloseButton &&\n <ifx-icon-button class='modal-close-button' ref={(el) => (this.closeButton = el)} icon=\"cross-16\" variant=\"tertiary\" onClick={() => this.doBeforeClose('CLOSE_BUTTON')}>\n </ifx-icon-button>\n }\n </div>\n <div class=\"modal-body\">\n <slot name=\"content\" onSlotchange={(e) => this.handleContentUpdate(e)} />\n </div>\n <div class={`modal-footer ${this.slotButtonsPresent ? 'buttons-present' : ''}`}>\n <slot name=\"buttons\" onSlotchange={(e) => this.handleButtonsSlotChange(e)}>\n </slot>\n </div>\n </div>\n </div>\n <div\n data-focus-trap-edge\n onFocus={this.handleBottomFocus}\n tabindex=\"0\"\n ></div>\n </div>\n </Host>\n\n );\n }\n}"],"version":3}