npm - @infineon/infineon-design-system-stencil - Versions diffs - 37.4.1--canary.1962.b7d8ef9ebfd6ebfa169ce05a1ae77ed7feccc9c3.0 → 37.4.1--canary.1962.bd8632192f8848270a8b0c53af90a64a5796bf0e.0 - Mend

@infineon/infineon-design-system-stencil 37.4.1--canary.1962.b7d8ef9ebfd6ebfa169ce05a1ae77ed7feccc9c3.0 → 37.4.1--canary.1962.bd8632192f8848270a8b0c53af90a64a5796bf0e.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 (299) hide show

package/dist/components/{p-ef6801dd.js.map → p-e27cd696.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-ef6801dd.js","mappings":"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","names":[],"sources":["src/components/button/button.scss?tag=ifx-button&encapsulation=shadow","src/components/button/button.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n vertical-align: bottom;\n display: inline-flex;\n width: var(--bw, fit-content);\n}\n\n.btn {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n height: tokens.$ifxSize500;\n padding: 0px tokens.$ifxSpace200;\n gap: tokens.$ifxSpace100;\n color: tokens.$ifxColorBaseWhite;\n font-weight: tokens.$ifxFontWeightSemibold;\n border-radius: tokens.$ifxBorderRadius12;\n line-height: tokens.$ifxLineHeightM;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n font-style: normal;\n text-decoration: none;\n user-select: none;\n font-size: tokens.$ifxFontSizeM;\n transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;\n width: var(--bw, fit-content);\n}\n\n.btn:not(.disabled) {\n cursor: pointer;\n}\n\n.btn.disabled {\n pointer-events: none;\n}\n\n.btn-default {\n //default variant=primary; default color=default\n color: tokens.$ifxColorBaseWhite;\n background-color: tokens.$ifxColorOcean500;\n\n &:disabled,\n &.disabled {\n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n pointer-events: none;\n\n }\n}\n\n.btn-secondary-default {\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorOcean500;\n border: 1px solid tokens.$ifxColorOcean500;\n\n &:disabled,\n &.disabled {\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorEngineering300;\n pointer-events: none;\n\n }\n}\n\n.btn-tertiary-default {\n background-color: tokens.$ifxColorBaseTransparent;\n color: tokens.$ifxColorOcean500;\n\n &:disabled,\n &.disabled {\n color: tokens.$ifxColorEngineering300;\n pointer-events: none;\n\n }\n}\n\n\n.btn-danger {\n color: tokens.$ifxColorBaseWhite;\n background-color: tokens.$ifxColorRed500;\n border-color: tokens.$ifxColorRed500;\n\n &:disabled,\n &.disabled {\n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n pointer-events: none;\n\n }\n}\n\n.btn-secondary-danger {\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorRed500;\n border: 1px solid tokens.$ifxColorRed500;\n\n &:disabled,\n &.disabled {\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorEngineering300;\n pointer-events: none;\n\n }\n}\n\n.btn-tertiary-danger {\n //combination tertiary + danger not in design\n background-color: tokens.$ifxColorBaseTransparent;\n color: tokens.$ifxColorRed500;\n\n &:disabled,\n &.disabled {\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorEngineering300;\n pointer-events: none;\n\n }\n}\n\n.btn-inverse {\n color: tokens.$ifxColorOcean500;\n background-color: tokens.$ifxColorBaseWhite;\n\n &:disabled,\n &.disabled {\n opacity: tokens.$ifxOpacity100;\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorOcean500;\n pointer-events: none;\n }\n}\n\n.btn-secondary-inverse {\n color: tokens.$ifxColorBaseWhite;\n border: 1px solid tokens.$ifxColorBaseWhite;\n\n &:disabled,\n &.disabled {\n border: 1px solid tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorBaseWhite;\n pointer-events: none;\n\n }\n}\n\n\n.btn-tertiary-inverse {\n color: tokens.$ifxColorBaseWhite;\n\n &:disabled,\n &.disabled {\n color: tokens.$ifxColorBaseWhite;\n opacity: tokens.$ifxOpacity100;\n pointer-events: none;\n\n }\n}\n\n.btn {\n & ifx-icon:empty {\n display: none;\n }\n\n &.btn-xs {\n font-size: tokens.$ifxFontSizeS;\n height: tokens.$ifxSize400;\n line-height: tokens.$ifxLineHeightXs;\n }\n\n &.btn-s {\n font-size: tokens.$ifxFontSizeS;\n height: tokens.$ifxSize450;\n line-height: tokens.$ifxLineHeightS;\n }\n\n // &.btn-m { //default\n // font-size: tokens.$ifxFontSizeM;\n // height: tokens.$ifxSize400;\n // line-height: tokens.$ifxLineHeightM;\n // }\n\n\n &.btn-l {\n font-size: tokens.$ifxFontSizeXl;\n height: tokens.$ifxSize600;\n line-height: tokens.$ifxLineHeightXl;\n }\n\n\n\n &.btn-default:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n }\n\n &:hover {\n background-color: tokens.$ifxColorOcean600;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorOcean700;\n }\n }\n\n &.btn-secondary-default:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n }\n\n &:hover {\n color: tokens.$ifxColorBaseWhite;\n background-color: tokens.$ifxColorOcean600;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorOcean700;\n }\n }\n\n &.btn-secondary:not(:disabled, .disabled) {\n\n &:hover {\n background-color: tokens.$ifxColorBerry500;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorBerry500;\n }\n }\n\n\n\n &.btn-danger:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n }\n\n &:hover {\n background-color: tokens.$ifxColorRed600;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorRed700;\n }\n }\n\n &.btn-secondary-danger:not(:disabled, .disabled) {\n\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n }\n\n &:hover {\n color: tokens.$ifxColorBaseWhite;\n background-color: tokens.$ifxColorRed600;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorRed700;\n }\n }\n\n\n &.btn-inverse:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorOcean500, 0 0 0 4px tokens.$ifxColorBaseWhite;\n }\n\n &:hover {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.btn-secondary-inverse:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorOcean500, 0 0 0 4px tokens.$ifxColorBaseWhite;\n }\n\n &:hover {\n color: tokens.$ifxColorOcean500;\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &:active,\n &.active {\n color: tokens.$ifxColorOcean500;\n background-color: tokens.$ifxColorEngineering300;\n }\n }\n\n\n\n &.btn-tertiary-default:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean600;\n }\n\n &:hover {\n color: tokens.$ifxColorOcean600;\n }\n\n &:active,\n &.active {\n color: tokens.$ifxColorOcean700;\n }\n\n\n }\n\n\n\n\n\n &.btn-tertiary-danger:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorRed600;\n }\n\n &:hover {\n color: tokens.$ifxColorRed600;\n }\n\n &:active,\n &.active {\n color: tokens.$ifxColorRed700;\n }\n\n }\n\n\n &.btn-tertiary-inverse:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorOcean500, 0 0 0 4px tokens.$ifxColorBaseWhite;\n }\n\n &:hover {\n color: tokens.$ifxColorEngineering200;\n\n }\n\n &:active,\n &.active {\n color: tokens.$ifxColorEngineering300;\n }\n }\n}","import { Component, Prop, h, Host, Method, Element, Listen, State, 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 classNames from 'classnames';\n \n@Component({\n tag: 'ifx-button',\n styleUrl: 'button.scss',\n shadow: true,\n})\nexport class Button {\n @Prop() variant: 'primary' \| 'secondary' \| 'tertiary' = 'primary';\n @Prop() theme: 'default' \| 'danger' \| 'inverse' = 'default';\n @Prop() size: string = 'm';\n @Prop() disabled: boolean = false;\n @State() internalHref: string;\n @Prop() href: string;\n @Prop() target: string = '_self';\n @Prop() type: \"button\" \| \"submit\" \| \"reset\" = \"button\";\n @Prop() fullWidth: boolean = false;\n @Prop() ariaLabel: string \| null;\n @Element() el;\n\n private focusableElement: HTMLElement;\n private nativeButton: HTMLButtonElement \| HTMLInputElement;\n\n @Watch('href')\n setInternalHref(newValue: string) {\n this.internalHref = newValue;\n }\n\n @Method()\n async setFocus() {\n this.focusableElement.focus();\n }\n\n insertNativeButton() {\n this.nativeButton = document.createElement('button');\n this.nativeButton.type = this.type;\n this.nativeButton.style.display = 'none';\n this.el.closest('form').appendChild(this.nativeButton);\n }\n\n handleFormAndInternalHref() {\n if (this.el.closest('form')) {\n if (this.el.href) {\n this.el.internalHref = undefined;\n }\n this.insertNativeButton()\n } else {\n this.internalHref = this.href;\n }\n }\n\n handleButtonWidth() {\n if (this.fullWidth) {\n this.el.style.setProperty('--bw', '100%');\n } else {\n this.el.style.setProperty('--bw', 'fit-content');\n }\n }\n\n componentWillLoad() {\n this.handleFormAndInternalHref()\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-button', await framework)\n }\n }\n\n componentWillRender() {\n this.handleButtonWidth()\n }\n\n\n\n handleClick = (ev: Event) => {\n if (this.el.shadowRoot) {\n const parentForm = this.el.closest('form');\n if (parentForm) {\n ev.preventDefault();\n\n if (this.type === 'reset') {\n // If the button type is 'reset', manually reset all custom form fields\n this.resetClickHandler(); //this will reset all ifx-text-fields within a form\n } else {\n const fakeButton = document.createElement('button');\n if (this.type) {\n fakeButton.type = this.type;\n }\n fakeButton.style.display = 'none';\n parentForm.appendChild(fakeButton);\n fakeButton.click();\n fakeButton.remove();\n }\n }\n }\n }\n\n resetClickHandler() {\n const formElement = this.el.closest('form');\n const customElements = formElement.querySelectorAll('ifx-text-field, ifx-textarea');\n customElements.forEach(element => {\n element.reset();\n });\n }\n\n @Listen('keydown')\n handleKeyDown(ev: KeyboardEvent) {\n if ( ev.key === \" \" \|\| ev.key === 'Enter' && !this.disabled) {\n this.focusableElement.click();\n }\n }\n\n @Listen('click', { capture: true })\n handleHostClick(event: Event) {\n if (this.disabled === true) {\n event.stopImmediatePropagation();\n }\n }\n\n handleFocus(event: FocusEvent) {\n if (this.disabled) {\n event.preventDefault();\n this.focusableElement.blur();\n }\n }\n\n render() {\n return (\n <Host>\n <a\n role={this.href ? 'link' : 'button'}\n tabIndex={this.disabled ? -1 : 0}\n ref={(el) => (this.focusableElement = el)}\n class={this.getClassNames()}\n href={!this.disabled ? this.internalHref : undefined}\n target={this.target}\n onClick={this.handleClick}\n rel={this.target === '_blank' ? 'noopener noreferrer' : undefined}\n onFocus={(event) => this.handleFocus(event)}\n aria-disabled={this.disabled ? 'true' : null}\n aria-describedby={this.theme === 'danger' ? 'Dangerous action' : undefined}\n aria-label={this.ariaLabel \|\| undefined}\n >\n <slot></slot>\n </a>\n </Host>\n );\n }\n\n\n getVariantClass() {\n return `${this.variant}` === \"secondary\"\n ? `secondary-${this.theme}`\n : `${this.variant}` === 'tertiary'\n ? `tertiary-${this.theme}`\n : `${this.theme}`;\n }\n\n getSizeClass() {\n if (`${this.size}` === \"xs\") {\n return \"xs\"\n }\n else if (`${this.size}` === \"s\") {\n return \"s\"\n }\n else if (`${this.size}` === \"l\") {\n return \"l\"\n }\n else return \"\";\n }\n\n getClassNames() {\n return classNames(\n 'btn',\n this.size && `btn-${this.getSizeClass()}`,\n `btn-${this.getVariantClass()}`,\n this.disabled ? 'disabled' : ''\n );\n }\n}"],"version":3}
1	+ {"file":"p-e27cd696.js","mappings":"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","names":[],"sources":["src/components/button/button.scss?tag=ifx-button&encapsulation=shadow","src/components/button/button.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n vertical-align: bottom;\n display: inline-flex;\n width: var(--bw, fit-content);\n}\n\n.btn {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n height: tokens.$ifxSize500;\n padding: 0px tokens.$ifxSpace200;\n gap: tokens.$ifxSpace100;\n color: tokens.$ifxColorBaseWhite;\n font-weight: tokens.$ifxFontWeightSemibold;\n border-radius: tokens.$ifxBorderRadius12;\n line-height: tokens.$ifxLineHeightM;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n font-style: normal;\n text-decoration: none;\n user-select: none;\n font-size: tokens.$ifxFontSizeM;\n transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;\n width: var(--bw, fit-content);\n}\n\n.btn:not(.disabled) {\n cursor: pointer;\n}\n\n.btn.disabled {\n pointer-events: none;\n}\n\n.btn-default {\n //default variant=primary; default color=default\n color: tokens.$ifxColorBaseWhite;\n background-color: tokens.$ifxColorOcean500;\n\n &:disabled,\n &.disabled {\n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n pointer-events: none;\n\n }\n}\n\n.btn-secondary-default {\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorOcean500;\n border: 1px solid tokens.$ifxColorOcean500;\n\n &:disabled,\n &.disabled {\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorEngineering300;\n pointer-events: none;\n\n }\n}\n\n.btn-tertiary-default {\n background-color: tokens.$ifxColorBaseTransparent;\n color: tokens.$ifxColorOcean500;\n\n &:disabled,\n &.disabled {\n color: tokens.$ifxColorEngineering300;\n pointer-events: none;\n\n }\n}\n\n\n.btn-danger {\n color: tokens.$ifxColorBaseWhite;\n background-color: tokens.$ifxColorRed500;\n border-color: tokens.$ifxColorRed500;\n\n &:disabled,\n &.disabled {\n background-color: tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorBaseWhite;\n pointer-events: none;\n\n }\n}\n\n.btn-secondary-danger {\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorRed500;\n border: 1px solid tokens.$ifxColorRed500;\n\n &:disabled,\n &.disabled {\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid tokens.$ifxColorEngineering300;\n color: tokens.$ifxColorEngineering300;\n pointer-events: none;\n\n }\n}\n\n.btn-tertiary-danger {\n //combination tertiary + danger not in design\n background-color: tokens.$ifxColorBaseTransparent;\n color: tokens.$ifxColorRed500;\n\n &:disabled,\n &.disabled {\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorEngineering300;\n pointer-events: none;\n\n }\n}\n\n.btn-inverse {\n color: tokens.$ifxColorOcean500;\n background-color: tokens.$ifxColorBaseWhite;\n\n &:disabled,\n &.disabled {\n opacity: tokens.$ifxOpacity100;\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorOcean500;\n pointer-events: none;\n }\n}\n\n.btn-secondary-inverse {\n color: tokens.$ifxColorBaseWhite;\n border: 1px solid tokens.$ifxColorBaseWhite;\n\n &:disabled,\n &.disabled {\n border: 1px solid tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorBaseWhite;\n pointer-events: none;\n\n }\n}\n\n\n.btn-tertiary-inverse {\n color: tokens.$ifxColorBaseWhite;\n\n &:disabled,\n &.disabled {\n color: tokens.$ifxColorBaseWhite;\n opacity: tokens.$ifxOpacity100;\n pointer-events: none;\n\n }\n}\n\n.btn {\n & ifx-icon:empty {\n display: none;\n }\n\n &.btn-xs {\n font-size: tokens.$ifxFontSizeS;\n height: tokens.$ifxSize400;\n line-height: tokens.$ifxLineHeightXs;\n }\n\n &.btn-s {\n font-size: tokens.$ifxFontSizeS;\n height: tokens.$ifxSize450;\n line-height: tokens.$ifxLineHeightS;\n }\n\n // &.btn-m { //default\n // font-size: tokens.$ifxFontSizeM;\n // height: tokens.$ifxSize400;\n // line-height: tokens.$ifxLineHeightM;\n // }\n\n\n &.btn-l {\n font-size: tokens.$ifxFontSizeXl;\n height: tokens.$ifxSize600;\n line-height: tokens.$ifxLineHeightXl;\n }\n\n\n\n &.btn-default:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n }\n\n &:hover {\n background-color: tokens.$ifxColorOcean600;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorOcean700;\n }\n }\n\n &.btn-secondary-default:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n }\n\n &:hover {\n color: tokens.$ifxColorBaseWhite;\n background-color: tokens.$ifxColorOcean600;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorOcean700;\n }\n }\n\n &.btn-secondary:not(:disabled, .disabled) {\n\n &:hover {\n background-color: tokens.$ifxColorBerry500;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorBerry500;\n }\n }\n\n\n\n &.btn-danger:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n }\n\n &:hover {\n background-color: tokens.$ifxColorRed600;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorRed700;\n }\n }\n\n &.btn-secondary-danger:not(:disabled, .disabled) {\n\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n }\n\n &:hover {\n color: tokens.$ifxColorBaseWhite;\n background-color: tokens.$ifxColorRed600;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorRed700;\n }\n }\n\n\n &.btn-inverse:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorOcean500, 0 0 0 4px tokens.$ifxColorBaseWhite;\n }\n\n &:hover {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &:active,\n &.active {\n background-color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.btn-secondary-inverse:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorOcean500, 0 0 0 4px tokens.$ifxColorBaseWhite;\n }\n\n &:hover {\n color: tokens.$ifxColorOcean500;\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &:active,\n &.active {\n color: tokens.$ifxColorOcean500;\n background-color: tokens.$ifxColorEngineering300;\n }\n }\n\n\n\n &.btn-tertiary-default:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean600;\n }\n\n &:hover {\n color: tokens.$ifxColorOcean600;\n }\n\n &:active,\n &.active {\n color: tokens.$ifxColorOcean700;\n }\n\n\n }\n\n\n\n\n\n &.btn-tertiary-danger:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorRed600;\n }\n\n &:hover {\n color: tokens.$ifxColorRed600;\n }\n\n &:active,\n &.active {\n color: tokens.$ifxColorRed700;\n }\n\n }\n\n\n &.btn-tertiary-inverse:not(:disabled, .disabled) {\n &:focus:not(:active, .active) {\n outline: none;\n box-shadow: 0 0 0 2px tokens.$ifxColorOcean500, 0 0 0 4px tokens.$ifxColorBaseWhite;\n }\n\n &:hover {\n color: tokens.$ifxColorEngineering200;\n\n }\n\n &:active,\n &.active {\n color: tokens.$ifxColorEngineering300;\n }\n }\n}","import { Component, Prop, h, Host, Method, Element, Listen, State, 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 classNames from 'classnames';\n \n@Component({\n tag: 'ifx-button',\n styleUrl: 'button.scss',\n shadow: true,\n})\nexport class Button {\n @Prop() variant: 'primary' \| 'secondary' \| 'tertiary' = 'primary';\n @Prop() theme: 'default' \| 'danger' \| 'inverse' = 'default';\n @Prop() size: string = 'm';\n @Prop() disabled: boolean = false;\n @State() internalHref: string;\n @Prop() href: string;\n @Prop() target: string = '_self';\n @Prop() type: \"button\" \| \"submit\" \| \"reset\" = \"button\";\n @Prop() fullWidth: boolean = false;\n @Prop() ariaLabel: string \| null;\n @Element() el;\n\n private focusableElement: HTMLElement;\n private nativeButton: HTMLButtonElement \| HTMLInputElement;\n\n @Watch('href')\n setInternalHref(newValue: string) {\n this.internalHref = newValue;\n }\n\n @Method()\n async setFocus() {\n this.focusableElement.focus();\n }\n\n insertNativeButton() {\n this.nativeButton = document.createElement('button');\n this.nativeButton.type = this.type;\n this.nativeButton.style.display = 'none';\n this.el.closest('form').appendChild(this.nativeButton);\n }\n\n handleFormAndInternalHref() {\n if (this.el.closest('form')) {\n if (this.el.href) {\n this.el.internalHref = undefined;\n }\n this.insertNativeButton()\n } else {\n this.internalHref = this.href;\n }\n }\n\n handleButtonWidth() {\n if (this.fullWidth) {\n this.el.style.setProperty('--bw', '100%');\n } else {\n this.el.style.setProperty('--bw', 'fit-content');\n }\n }\n\n componentWillLoad() {\n this.handleFormAndInternalHref()\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-button', await framework)\n }\n }\n\n componentWillRender() {\n this.handleButtonWidth()\n }\n\n\n\n handleClick = (ev: Event) => {\n if (this.el.shadowRoot) {\n const parentForm = this.el.closest('form');\n if (parentForm) {\n ev.preventDefault();\n\n if (this.type === 'reset') {\n // If the button type is 'reset', manually reset all custom form fields\n this.resetClickHandler(); //this will reset all ifx-text-fields within a form\n } else {\n const fakeButton = document.createElement('button');\n if (this.type) {\n fakeButton.type = this.type;\n }\n fakeButton.style.display = 'none';\n parentForm.appendChild(fakeButton);\n fakeButton.click();\n fakeButton.remove();\n }\n }\n }\n }\n\n resetClickHandler() {\n const formElement = this.el.closest('form');\n const customElements = formElement.querySelectorAll('ifx-text-field, ifx-textarea');\n customElements.forEach(element => {\n element.reset();\n });\n }\n\n @Listen('keydown')\n handleKeyDown(ev: KeyboardEvent) {\n if ( ev.key === \" \" \|\| ev.key === 'Enter' && !this.disabled) {\n this.focusableElement.click();\n }\n }\n\n @Listen('click', { capture: true })\n handleHostClick(event: Event) {\n if (this.disabled === true) {\n event.stopImmediatePropagation();\n }\n }\n\n handleFocus(event: FocusEvent) {\n if (this.disabled) {\n event.preventDefault();\n this.focusableElement.blur();\n }\n }\n\n render() {\n return (\n <Host>\n <a\n role={this.href ? 'link' : 'button'}\n tabIndex={this.disabled ? -1 : 0}\n ref={(el) => (this.focusableElement = el)}\n class={this.getClassNames()}\n href={!this.disabled ? this.internalHref : undefined}\n target={this.target}\n onClick={this.handleClick}\n rel={this.target === '_blank' ? 'noopener noreferrer' : undefined}\n onFocus={(event) => this.handleFocus(event)}\n aria-disabled={this.disabled ? 'true' : null}\n aria-describedby={this.theme === 'danger' ? 'Dangerous action' : undefined}\n aria-label={this.ariaLabel \|\| undefined}\n >\n <slot></slot>\n </a>\n </Host>\n );\n }\n\n\n getVariantClass() {\n return `${this.variant}` === \"secondary\"\n ? `secondary-${this.theme}`\n : `${this.variant}` === 'tertiary'\n ? `tertiary-${this.theme}`\n : `${this.theme}`;\n }\n\n getSizeClass() {\n if (`${this.size}` === \"xs\") {\n return \"xs\"\n }\n else if (`${this.size}` === \"s\") {\n return \"s\"\n }\n else if (`${this.size}` === \"l\") {\n return \"l\"\n }\n else return \"\";\n }\n\n getClassNames() {\n return classNames(\n 'btn',\n this.size && `btn-${this.getSizeClass()}`,\n `btn-${this.getVariantClass()}`,\n this.disabled ? 'disabled' : ''\n );\n }\n}"],"version":3}

package/dist/components/{p-7fc63460.js → p-e28b6d6d.js} RENAMED Viewed

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
-import { d as detectFramework, t as trackComponent } from './p-1f6a8baa.js';
+import { d as detectFramework, t as trackComponent } from './p-4d6cad33.js';
 import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
 import { c as classNames } from './p-5cdc6210.js';
-import { d as defineCustomElement$1 } from './p-fe2152fc.js';
+import { d as defineCustomElement$1 } from './p-8a7696b0.js';
 const searchFieldCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:flex}.search-field{box-sizing:border-box;background-color:#FFFFFF;width:100%;font-family:var(--ifx-font-family)}.search-field .search-field__wrapper{box-sizing:border-box;height:40px;display:flex;align-items:center;border:1px solid #8D8786;border-radius:1px;padding:8px 16px;gap:12px;flex:none;order:0;align-self:stretch;flex-grow:0;position:relative;width:100%;outline:none;color:#8D8786}.search-field .search-field__wrapper.focused{border:1px solid #0A8276}.search-field .search-field__wrapper.focused ifx-icon{color:#575352}.search-field .search-field__wrapper.search-field__wrapper-s{height:36px}.search-field .search-field__wrapper:hover:not(.focused,:focus){border:1px solid #3C3A39}.search-field .search-field__wrapper:focus{outline:none;border:1px solid #0A8276}.search-field .search-field__wrapper .delete-icon{right:12px;cursor:pointer}.search-field .search-field__wrapper input[type=text]{font-style:normal;font-weight:400;font-size:16px;color:#8D8786;border:none;width:100%;outline:none;height:16px}.search-field .search-field__wrapper input[type=text]:focus{outline:none;color:#1d1d1d}.search-field .search-field__wrapper input[type=text]:disabled{background-color:#EEEDED}.search-field .search-field__wrapper:has(input[disabled]){background-color:#EEEDED}";
 const IfxSearchFieldStyle0 = searchFieldCss;
@@ -113,4 +113,4 @@ function defineCustomElement() {
 export { SearchField as S, defineCustomElement as d };
-//# sourceMappingURL=p-7fc63460.js.map
+//# sourceMappingURL=p-e28b6d6d.js.map

package/dist/components/{p-7fc63460.js.map → p-e28b6d6d.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~7fc63460~~.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,s0CAAs0C,CAAC;AAC91C,6BAAe,cAAc;;MCYhB,WAAW;IAPxB;;;;;QAU2B,UAAK,GAAW,EAAE,CAAC;QAGnC,mBAAc,GAAY,KAAK,CAAC;QAEjC,mBAAc,GAAY,KAAK,CAAC;QAC/B,gCAA2B,GAAY,KAAK,CAAC;QAC9C,aAAQ,GAAY,KAAK,CAAC;QAC1B,SAAI,GAAW,GAAG,CAAC;QAClB,cAAS,GAAY,KAAK,CAAC;QAC5B,gBAAW,GAAW,WAAW,CAAC;QAClC,iBAAY,GAAW,IAAI,CAAC;QAC5B,cAAS,GAAY,IAAI,CAAC;QAkBlC,gBAAW,GAAG;YACZ,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;YACtC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SAChC,CAAC;QAEF,iBAAY,GAAG;YACb,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,EAAE,CAAC;YAC7B,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;YAChB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SAChC,CAAA;KA8DF;IAvFC,kBAAkB,CAAC,KAAiB;QAClC,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE,CAAC;QAClC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE;YACrC,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;SACxB;KACF;IAGD,YAAY,CAAC,QAAgB;QAC3B,IAAI,QAAQ,KAAK,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE;YACxC,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,QAAQ,CAAC;SACpC;KACF;IAeD,UAAU;QACR,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,CAAC;QAC1B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;KACvB;IAED,MAAM,gBAAgB;QACpB,IAAG,CAAC,sBAAsB,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;YACnC,MAAM,SAAS,GAAG,eAAe,EAAE,CAAC;YACpC,cAAc,CAAC,kBAAkB,EAAE,MAAM,SAAS,CAAC,CAAA;SACpD;KACF;IAED,mBAAmB;QACjB,IAAI,IAAI,CAAC,KAAK,KAAK,EAAE,EAAE;YACrB,IAAI,CAAC,2BAA2B,GAAG,IAAI,CAAC;SACzC;;YAAM,IAAI,CAAC,2BAA2B,GAAG,KAAK,CAAC;KACjD;IAED,MAAM;QACJ,QACE,0EAAgB,+BAA+B,mBAAgB,IAAI,CAAC,QAAQ,gBAAc,IAAI,CAAC,KAAK,EAAE,KAAK,EAAC,cAAc,IACxH,4DAAK,KAAK,EAAE,IAAI,CAAC,oBAAoB,EAAE,EACrC,QAAQ,EAAE,CAAC,EACX,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,EAAE,EAChC,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,EAAE,IAEhC,iEAAU,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,aAAa,GAAY,EAC1D,8DACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC,EACrC,IAAI,EAAC,MAAM,EACX,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,EACjC,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,EACD,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,2BAA2B,IACtD,gBAAU,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,aAAa,EAAC,OAAO,EAAE,IAAI,CAAC,YAAY,GAC9D,IACT,IAAI,CACJ,CACF,EACN;KACH;IAED,YAAY;QACV,OAAO,GAAG,IAAI,CAAC,IAAI,EAAE,KAAK,GAAG;cACzB,yBAAyB;cACzB,EAAE,CAAC;KACR;IAGD,oBAAoB;QAClB,OAAO,UAAU,CACf,uBAAuB,EACvB,yBAAyB,IAAI,CAAC,YAAY,EAAE,EAAE,EAC9C,GAAG,IAAI,CAAC,SAAS,GAAG,SAAS,GAAG,EAAE,EAAE,CACrC,CAAC;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/search-field/search-field.scss?tag=ifx-search-field&encapsulation=shadow","src/components/search-field/search-field.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: flex;\n}\n\n.search-field {\n box-sizing: border-box;\n background-color: tokens.$ifxColorBaseWhite;\n width: 100%;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n\n .search-field__wrapper {\n box-sizing: border-box;\n height: tokens.$ifxSize500;\n display: flex;\n align-items: center;\n border: 1px solid #8D8786;\n border-radius: tokens.$ifxBorderRadius12;\n padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n gap: tokens.$ifxSpace150;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n position: relative;\n width: 100%;\n outline: none;\n color: tokens.$ifxColorEngineering400;\n\n &.focused {\n border: 1px solid tokens.$ifxColorOcean500;\n\n & ifx-icon {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n &.search-field__wrapper-s {\n height: 36px;\n }\n\n\n &:hover:not(.focused, :focus) {\n border: 1px solid #3C3A39;\n }\n\n &:focus {\n outline: none;\n border: 1px solid #0A8276;\n }\n\n\n .delete-icon {\n right: 12px;\n cursor: pointer;\n }\n\n input[type='text'] {\n font-style: normal;\n font-weight: 400;\n font-size: 16px;\n //line-height: 24px;\n color: #8D8786;\n border: none;\n width: 100%;\n outline: none;\n //height: 100%;\n height: 16px;\n\n &:focus {\n outline: none;\n color: #1d1d1d;\n }\n\n &:disabled {\n background-color: #EEEDED;\n }\n }\n\n &:has(input[disabled]) {\n background-color: #EEEDED;\n }\n }\n}","import { Component, EventEmitter, h, Event, Prop, Watch, State, Listen, 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-search-field',\n styleUrl: 'search-field.scss',\n shadow: true\n})\n\n\nexport class SearchField {\n @Element() el;\n private inputElement: HTMLInputElement;\n @Prop({ mutable: true }) value: string = '';\n\n @Event() ifxInput: EventEmitter<String>;\n @State() insideDropdown: boolean = false;\n\n @Prop() showDeleteIcon: boolean = false;\n @State() showDeleteIconInternalState: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() size: string = 'l';\n @State() isFocused: boolean = false;\n @Prop() placeholder: string = \"Search...\";\n @Prop() autocomplete: string = \"on\";\n @Prop() maxlength?: number = null; \n\n @Listen('mousedown', { target: 'document' })\n handleOutsideClick(event: MouseEvent) {\n const path = event.composedPath();\n if (!path.includes(this.inputElement)) {\n this.isFocused = false;\n }\n }\n\n @Watch('value')\n valueWatcher(newValue: string) {\n if (newValue !== this.inputElement.value) {\n this.inputElement.value = newValue;\n }\n }\n\n\n handleInput = () => {\n const query = this.inputElement.value;\n this.value = query; // update the value property when input changes\n this.ifxInput.emit(this.value);\n };\n\n handleDelete = () => {\n this.inputElement.value = '';\n this.value = \"\";\n this.ifxInput.emit(this.value);\n }\n\n focusInput() {\n this.inputElement.focus();\n this.isFocused = true;\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-search-field', await framework)\n }\n }\n \n componentWillUpdate() {\n if (this.value !== \"\") {\n this.showDeleteIconInternalState = true;\n } else this.showDeleteIconInternalState = false;\n }\n\n render() {\n return (\n <div aria-label=\"a search field for user input\" aria-disabled={this.disabled} aria-value={this.value} class='search-field'>\n <div class={this.getWrapperClassNames()}\n tabindex={1}\n onFocus={() => this.focusInput()}\n onClick={() => this.focusInput()}\n >\n <ifx-icon icon=\"search-16\" class=\"search-icon\"></ifx-icon>\n <input\n ref={(el) => (this.inputElement = el)}\n type=\"text\"\n autocomplete={this.autocomplete}\n onInput={() => this.handleInput()}\n placeholder={this.placeholder}\n disabled={this.disabled}\n maxlength={this.maxlength}\n value={this.value} // bind the value property to input element\n />\n {this.showDeleteIcon && this.showDeleteIconInternalState ? (\n <ifx-icon icon=\"cRemove16\" class=\"delete-icon\" onClick={this.handleDelete}>\n </ifx-icon>\n ) : null}\n </div>\n </div>\n );\n }\n\n getSizeClass() {\n return `${this.size}` === \"s\"\n ? \"search-field__wrapper-s\"\n : \"\";\n }\n\n\n getWrapperClassNames() {\n return classNames(\n `search-field__wrapper`,\n `search-field__wrapper ${this.getSizeClass()}`,\n `${this.isFocused ? 'focused' : \"\"}`\n );\n }\n}"],"version":3}
1	+ {"file":"p-e28b6d6d.js","mappings":"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","names":[],"sources":["src/components/search-field/search-field.scss?tag=ifx-search-field&encapsulation=shadow","src/components/search-field/search-field.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: flex;\n}\n\n.search-field {\n box-sizing: border-box;\n background-color: tokens.$ifxColorBaseWhite;\n width: 100%;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n\n .search-field__wrapper {\n box-sizing: border-box;\n height: tokens.$ifxSize500;\n display: flex;\n align-items: center;\n border: 1px solid #8D8786;\n border-radius: tokens.$ifxBorderRadius12;\n padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n gap: tokens.$ifxSpace150;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n position: relative;\n width: 100%;\n outline: none;\n color: tokens.$ifxColorEngineering400;\n\n &.focused {\n border: 1px solid tokens.$ifxColorOcean500;\n\n & ifx-icon {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n &.search-field__wrapper-s {\n height: 36px;\n }\n\n\n &:hover:not(.focused, :focus) {\n border: 1px solid #3C3A39;\n }\n\n &:focus {\n outline: none;\n border: 1px solid #0A8276;\n }\n\n\n .delete-icon {\n right: 12px;\n cursor: pointer;\n }\n\n input[type='text'] {\n font-style: normal;\n font-weight: 400;\n font-size: 16px;\n //line-height: 24px;\n color: #8D8786;\n border: none;\n width: 100%;\n outline: none;\n //height: 100%;\n height: 16px;\n\n &:focus {\n outline: none;\n color: #1d1d1d;\n }\n\n &:disabled {\n background-color: #EEEDED;\n }\n }\n\n &:has(input[disabled]) {\n background-color: #EEEDED;\n }\n }\n}","import { Component, EventEmitter, h, Event, Prop, Watch, State, Listen, 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-search-field',\n styleUrl: 'search-field.scss',\n shadow: true\n})\n\n\nexport class SearchField {\n @Element() el;\n private inputElement: HTMLInputElement;\n @Prop({ mutable: true }) value: string = '';\n\n @Event() ifxInput: EventEmitter<String>;\n @State() insideDropdown: boolean = false;\n\n @Prop() showDeleteIcon: boolean = false;\n @State() showDeleteIconInternalState: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() size: string = 'l';\n @State() isFocused: boolean = false;\n @Prop() placeholder: string = \"Search...\";\n @Prop() autocomplete: string = \"on\";\n @Prop() maxlength?: number = null; \n\n @Listen('mousedown', { target: 'document' })\n handleOutsideClick(event: MouseEvent) {\n const path = event.composedPath();\n if (!path.includes(this.inputElement)) {\n this.isFocused = false;\n }\n }\n\n @Watch('value')\n valueWatcher(newValue: string) {\n if (newValue !== this.inputElement.value) {\n this.inputElement.value = newValue;\n }\n }\n\n\n handleInput = () => {\n const query = this.inputElement.value;\n this.value = query; // update the value property when input changes\n this.ifxInput.emit(this.value);\n };\n\n handleDelete = () => {\n this.inputElement.value = '';\n this.value = \"\";\n this.ifxInput.emit(this.value);\n }\n\n focusInput() {\n this.inputElement.focus();\n this.isFocused = true;\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-search-field', await framework)\n }\n }\n \n componentWillUpdate() {\n if (this.value !== \"\") {\n this.showDeleteIconInternalState = true;\n } else this.showDeleteIconInternalState = false;\n }\n\n render() {\n return (\n <div aria-label=\"a search field for user input\" aria-disabled={this.disabled} aria-value={this.value} class='search-field'>\n <div class={this.getWrapperClassNames()}\n tabindex={1}\n onFocus={() => this.focusInput()}\n onClick={() => this.focusInput()}\n >\n <ifx-icon icon=\"search-16\" class=\"search-icon\"></ifx-icon>\n <input\n ref={(el) => (this.inputElement = el)}\n type=\"text\"\n autocomplete={this.autocomplete}\n onInput={() => this.handleInput()}\n placeholder={this.placeholder}\n disabled={this.disabled}\n maxlength={this.maxlength}\n value={this.value} // bind the value property to input element\n />\n {this.showDeleteIcon && this.showDeleteIconInternalState ? (\n <ifx-icon icon=\"cRemove16\" class=\"delete-icon\" onClick={this.handleDelete}>\n </ifx-icon>\n ) : null}\n </div>\n </div>\n );\n }\n\n getSizeClass() {\n return `${this.size}` === \"s\"\n ? \"search-field__wrapper-s\"\n : \"\";\n }\n\n\n getWrapperClassNames() {\n return classNames(\n `search-field__wrapper`,\n `search-field__wrapper ${this.getSizeClass()}`,\n `${this.isFocused ? 'focused' : \"\"}`\n );\n }\n}"],"version":3}

package/dist/esm/{framework-detection-4f7178ab.js → framework-detection-33c31a6d.js} RENAMED Viewed

@@ -38,7 +38,7 @@ function initializeTracking() {
     })(document, "script");
 }
 function trackComponent(componentName, environment) {
-    const skipEnvironments = ['jest', 'error'];
+    const skipEnvironments = ['jest', 'localhost', 'error'];
     if (skipEnvironments.includes(environment)) {
         return;
     }
@@ -66,19 +66,16 @@ const waitForDOMReady = () => {
     });
 };
-// framework-detection.ts
 let frameworkCache = null;
 const detectFramework = async () => {
     if (frameworkCache)
         return frameworkCache;
-    // Check for non-browser environments
     if (typeof window === 'undefined' || typeof document === 'undefined') {
         frameworkCache = 'non-browser';
         return frameworkCache;
     }
     const win = window;
     const doc = document;
-    // Detect environments that don't need DOM
     const isJest = typeof process !== 'undefined' &&
         process.env &&
         "production" === 'test';
@@ -93,13 +90,12 @@ const detectFramework = async () => {
         frameworkCache = 'Storybook';
         return frameworkCache;
     }
-    // const isLocalhost = ['localhost', '127.0.0.1'].includes(win.location.hostname);
-    // if (isLocalhost) {
-    //   frameworkCache = 'localhost';
-    //   return frameworkCache;
-    // }
+    const isLocalhost = ['localhost', '127.0.0.1'].includes(win.location.hostname);
+    if (isLocalhost) {
+        frameworkCache = 'localhost';
+        return frameworkCache;
+    }
     try {
-        // 1. First check sync-safe framework indicators
         if (win.React || win.ReactDOM) {
             frameworkCache = 'React';
             return frameworkCache;
@@ -112,10 +108,7 @@ const detectFramework = async () => {
             frameworkCache = 'Vue';
             return frameworkCache;
         }
-        // 2. Wait for DOM to be ready for DOM-based detection
         await waitForDOMReady();
-        // 3. Now perform DOM-based framework detection
-        // React DOM checks
         const reactRoot = doc.querySelector('[data-reactroot], [data-reactid]');
         if (reactRoot) {
             frameworkCache = 'React';
@@ -130,17 +123,14 @@ const detectFramework = async () => {
             frameworkCache = 'React';
             return frameworkCache;
         }
-        // Angular DOM checks
         if (doc.querySelector('[ng-version], [ng-app]')) {
             frameworkCache = 'Angular';
             return frameworkCache;
         }
-        // Vue DOM check
         if (doc.querySelector('[data-v-app]')) {
             frameworkCache = 'Vue';
             return frameworkCache;
         }
-        // Default to Vanilla
         frameworkCache = 'Vanilla';
         return frameworkCache;
     }
@@ -152,4 +142,4 @@ const detectFramework = async () => {
 export { detectFramework as d, trackComponent as t };
-//# sourceMappingURL=framework-detection-4f7178ab.js.map
+//# sourceMappingURL=framework-detection-33c31a6d.js.map

package/dist/esm/framework-detection-33c31a6d.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"framework-detection-33c31a6d.js","mappings":"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","names":[],"sources":["src/global/utils/tracking.ts","src/global/utils/dom-ready.ts","src/global/utils/framework-detection.ts"],"sourcesContent":["declare global {\n interface Window {\n btntConfig?: any;\n btntQueue?: any[];\n btnt?: (data: object) => void;\n }\n}\n\nconst isTestEnvironment = typeof process !== 'undefined' &&\n process.env &&\n process.env.NODE_ENV === 'test';\n\nfunction initializeTracking() {\n if (isTestEnvironment) {\n if (!window.btnt) { \n window.btnt = () => { };\n }\n return;\n }\n\n (function (t, r, _kk, n, pp) {\n if (typeof window.btntConfig !== \"object\") {\n window.btntConfig = {\n domain: \"https://ssgtm.infineon.com\",\n withCookies: true,\n maxBatchSize: 10\n };\n }\n\n if (window[\"btnt\"]) return;\n\n window[\"btnt\"] = function (z) {\n if (typeof z !== \"object\") {\n z = {};\n }\n if (typeof window.btntQueue !== \"object\") {\n window.btntQueue = [];\n }\n window.btntQueue.push(z);\n };\n\n n = t.createElement(r);\n\n // Add safety check for test environments\n pp = t.getElementsByTagName(r)[0];\n if (pp && pp.parentNode) {\n n.async = 1;\n n.src = window.btntConfig.domain + \"/btnt.js\";\n pp.parentNode.insertBefore(n, pp);\n }\n })(document, \"script\");\n}\n\nexport function trackComponent(componentName: string, environment: string) {\n const skipEnvironments = ['jest', 'localhost', 'error'];\n if (skipEnvironments.includes(environment)) {\n return;\n }\n\n if (!window.btnt) initializeTracking();\n\n window.btnt({\n event_name: \"component_initialized\",\n component_name: componentName,\n environment: environment\n });\n}\n\nexport default trackComponent;","export const waitForDOMReady = (): Promise<void> => {\n return new Promise((resolve) => {\n if (document.readyState === 'complete' || document.readyState === 'interactive') {\n resolve();\n } else {\n const onReady = () => {\n resolve();\n document.removeEventListener('DOMContentLoaded', onReady);\n };\n document.addEventListener('DOMContentLoaded', onReady);\n }\n });\n};","let frameworkCache: string | null = null;\nimport { waitForDOMReady } from './dom-ready';\n\nexport const detectFramework = async (): Promise<string> => {\n if (frameworkCache) return frameworkCache;\n \n if (typeof window === 'undefined' || typeof document === 'undefined') {\n frameworkCache = 'non-browser';\n return frameworkCache;\n }\n\n const win = window as any;\n const doc = document;\n\n const isJest = typeof process !== 'undefined' && \n process.env && \n process.env.NODE_ENV === 'test';\n if (isJest) {\n frameworkCache = 'jest';\n return frameworkCache;\n }\n\n const isStorybook = win.location.search.includes('viewMode') || \n win.location.href.includes('viewMode') ||\n win.__STORYBOOK_ENV__;\n \n if (isStorybook) {\n frameworkCache = 'Storybook';\n return frameworkCache;\n }\n\n const isLocalhost = ['localhost', '127.0.0.1'].includes(win.location.hostname);\n if (isLocalhost) {\n frameworkCache = 'localhost';\n return frameworkCache;\n }\n\n try {\n\n if (win.React || win.ReactDOM) {\n frameworkCache = 'React';\n return frameworkCache;\n }\n \n if (win.ng || win.getAllAngularRootElements) {\n frameworkCache = 'Angular';\n return frameworkCache;\n }\n \n if (win.Vue || win.__VUE__) {\n frameworkCache = 'Vue';\n return frameworkCache;\n }\n\n await waitForDOMReady();\n\n const reactRoot = doc.querySelector('[data-reactroot], [data-reactid]');\n if (reactRoot) {\n frameworkCache = 'React';\n return frameworkCache;\n }\n \n const rootContainers = Array.from(doc.querySelectorAll('body > div'));\n const hasReactRoot = rootContainers.some(container => {\n const keys = Object.keys(container);\n return keys.some(key => key.startsWith('__reactContainer'));\n });\n \n if (hasReactRoot) {\n frameworkCache = 'React';\n return frameworkCache;\n }\n \n if (doc.querySelector('[ng-version], [ng-app]')) {\n frameworkCache = 'Angular';\n return frameworkCache;\n }\n \n if (doc.querySelector('[data-v-app]')) {\n frameworkCache = 'Vue';\n return frameworkCache;\n }\n\n frameworkCache = 'Vanilla';\n return frameworkCache;\n } catch (e) {\n frameworkCache = 'error';\n return frameworkCache;\n }\n};"],"version":3}

package/dist/esm/ifx-accordion_2.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement, c as createEvent } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const accordionCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:block}.accordion-wrapper{display:flex;flex-direction:column;gap:8px;font-family:var(--ifx-font-family)}";

package/dist/esm/ifx-alert_2.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const alertCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:block}.alert__info-wrapper{display:flex;padding:16px 24px;font-family:var(--ifx-font-family);box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843)}.alert__info-wrapper .info__text-wrapper{display:flex;flex-direction:column;gap:8px;width:100%}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper{display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper,.alert__info-wrapper .info__text-wrapper .info__description-wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper ::slotted(p),.alert__info-wrapper .info__text-wrapper .info__description-wrapper ::slotted(p){padding:0;margin:0}.alert__info-wrapper .info__text-wrapper .info__description-wrapper{font-weight:400}.alert__info-wrapper .close-icon-wrapper{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}.alert__info-wrapper .close-icon-wrapper button{all:unset;display:flex;align-items:center;justify-content:center;line-height:0;color:#1D1D1D;height:24px;width:24px}.alert__info-wrapper .close-icon-wrapper button:focus{outline:2px solid #0A8276;outline-offset:2px}.alert{display:flex;border:1px solid #0A8276;border-radius:1px;color:#1D1D1D;background-color:#FFFFFF;font-family:var(--ifx-font-family);box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843)}.alert .close-icon-wrapper{display:flex;align-items:center;justify-content:center;min-width:40px}.alert .close-icon-wrapper button{all:unset;display:flex;align-items:center;justify-content:center;line-height:0;color:#1D1D1D;height:24px;width:24px}.alert .close-icon-wrapper button:focus{outline:2px solid #0A8276;outline-offset:2px}.alert .icon-wrapper{position:relative;min-width:48px;display:flex;justify-content:center;align-items:center;background-color:#0A8276}.alert .alert-text{font-size:16px;width:100%;padding:12px 0px 12px 12px;color:#1D1D1D;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere;}.alert.primary{border:1px solid #0A8276}.alert.primary .icon-wrapper{background-color:#0A8276;color:#FFFFFF}.alert.success{border:1px solid #4CA460}.alert.success .icon-wrapper{background-color:#4CA460;color:#FFFFFF}.alert.danger{border:1px solid #CD002F}.alert.danger .icon-wrapper{background-color:#CD002F;color:#FFFFFF}.alert.warning{border:1px solid #E16B25}.alert.warning .icon-wrapper{background-color:#E16B25;color:#FFFFFF}.close-icon-wrapper ifx-icon:hover{cursor:pointer}";

package/dist/esm/ifx-badge.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const badgeCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:inline-flex}.badge__container{display:inline-flex;justify-content:center;align-items:center;padding:4px 8px;gap:8px;border:1px solid #EEEDED;background-color:#EEEDED;border-radius:100px;font-family:var(--ifx-font-family);font-size:0.875rem;line-height:1.25rem;font-weight:400;color:#1D1D1D}";

package/dist/esm/ifx-basic-table.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, a as Host, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 import { c as createGrid } from './main.esm-b8709563.js';
 import { c as classNames } from './index-72ac5051.js';

package/dist/esm/ifx-breadcrumb.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const breadcrumbCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:flex}.breadcrumb{list-style:none;padding:0px;margin:0px;display:flex;flex-direction:row;font-family:var(--ifx-font-family);font-size:0.875rem;align-items:flex-start}";

package/dist/esm/ifx-button.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, a as Host, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 import { c as classNames } from './index-72ac5051.js';

package/dist/esm/ifx-card.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, a as Host, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const cardCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:inline-flex}.card{position:relative;display:inline-flex;flex-direction:column;word-wrap:break-word;background-color:#FFFFFF;background-clip:border-box;border:1px solid #EEEDED;border-radius:1px;width:350px;height:auto;font-family:var(--ifx-font-family)}.card:has(.card-href:focus),.card:has(.card-href:hover){outline:none;border-color:#0A8276}.card:has(.card-href:focus) ::slotted(ifx-card-headline),.card:has(.card-href:hover) ::slotted(ifx-card-headline){color:#0A8276}.card.noBtns .vertical .lower__body-wrapper{padding-bottom:24px}.card.noBtns .horizontal .lower__body-wrapper{padding-bottom:24px}.card .horizontal{display:flex;flex-direction:row;min-height:218px}.card .horizontal .card-img{flex:1;text-decoration:none}.card .horizontal .card-img.noImage{display:none}.card .horizontal .card-img ::slotted([slot=img]){width:100%;vertical-align:bottom}.card .horizontal .lower__body-wrapper{flex:1;display:grid;grid-template-rows:1fr auto}.card .horizontal .lower__body-wrapper .upper-body{display:flex;flex-direction:column;text-decoration:none;color:#1D1D1D;padding:24px 24px 0px 24px}.card .vertical .upper__body-wrapper{text-decoration:none;color:#1D1D1D}.card .vertical .upper__body-wrapper .card-img{height:190px}.card .vertical .upper__body-wrapper .card-img.noImage{display:none}.card .vertical .upper__body-wrapper .upper-body{padding:24px 24px 0px 24px}.card .vertical .lower__body-wrapper:hover{border-color:#EEEDED}.card.horizontal{flex-direction:row;width:538px}.card.horizontal .card-img{flex:1;order:2}.card.horizontal .card-img ::slotted([slot=img]){width:100%;height:100%;vertical-align:bottom;object-fit:cover}.card.horizontal.left .horizontal .card-img{order:1}.card.horizontal.left .horizontal .lower__body-wrapper{order:2}.card .card-href:focus{outline:none}";

package/dist/esm/ifx-checkbox-group.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const checkboxGroupCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}.checkbox-group-container{display:flex;flex-direction:column}.checkbox-group{display:flex;font-family:var(--ifx-font-family);gap:8px}.checkbox-group.horizontal{flex-direction:row;column-gap:12px}.checkbox-group.vertical{flex-direction:column;row-gap:12px}.group-label{font:400 0.75rem/1rem \"Source Sans 3\";margin-bottom:8px;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption{margin-top:8px;align-self:flex-start;display:flex;width:100%;column-gap:8px;justify-content:space-between;align-items:center}.caption.default{color:#1D1D1D}.caption.error{color:#CD002F}.caption-text{font:400 0.75rem/1rem \"Source Sans 3\";flex:1;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption-icon{flex:0;display:flex}";

package/dist/esm/ifx-checkbox.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const checkboxCss = ":host{display:inline-flex;vertical-align:top}.checkbox__container{box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:top;padding:0px;gap:8px;font-family:\"Source Sans 3\";vertical-align:bottom}.checkbox__container .checkbox__wrapper{box-sizing:border-box;display:flex;position:relative;justify-content:center;align-items:center;width:20px;height:20px;background-color:#FFFFFF;border:1px solid #575352;border-radius:1px;flex:none;order:0;flex-grow:0;align-self:flex-start}.checkbox__container .checkbox__wrapper.checkbox-m{height:24px;width:24px}.checkbox__container .checkbox__wrapper.error{border-color:#CD002F}.checkbox__container .checkbox__wrapper:focus-visible{border:1px solid #575352;outline:2px solid #0A8276;outline-offset:2px}.checkbox__container .checkbox__wrapper:hover{background-color:#EEEDED;border:1px solid #575352;border-radius:1px;flex:none;order:0;flex-grow:0}.checkbox__container .checkbox__wrapper.disabled{background-color:#BFBBBB;border-color:#BFBBBB;border-radius:1px;flex:none;order:0;flex-grow:0}.checkbox__container .checkbox__wrapper.checked:not(.indeterminate){background-color:#0A8276;border-radius:1px;border-color:transparent;flex:none;order:0;flex-grow:0;color:#FFFFFF}.checkbox__container .checkbox__wrapper.checked:not(.indeterminate).error{background-color:#CD002F}.checkbox__container .checkbox__wrapper.checked:not(.indeterminate):focus-visible{border:1px solid transparent;outline:2px solid #0A8276;outline-offset:2px}.checkbox__container .checkbox__wrapper.checked:not(.indeterminate):hover{background-color:#08665C;border-radius:1px;flex:none;order:0;flex-grow:0}.checkbox__container .checkbox__wrapper.checked:not(.indeterminate).disabled{background:#BFBBBB;border-radius:1px;flex:none;order:0;flex-grow:0}.checkbox__container .checkbox__wrapper.indeterminate:before{content:\"\";display:block;width:70%;height:2px;background-color:#08665C;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.checkbox__container .label{font-style:normal;font-weight:400;font-size:0.875rem;line-height:1.25rem;color:#1D1D1D;overflow-wrap:break-word;word-wrap:break-word;word-break:break-all;max-width:100%}.checkbox__container .label.label-m{font-size:1rem;line-height:1.5rem}.checkbox__container .label.disabled{color:#BFBBBB}.checkbox__container .checkbox__wrapper:hover,.checkbox__container .label:hover{cursor:pointer}";

package/dist/esm/ifx-chip_3.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const chipCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:inline-block}.chip{position:relative}.chip__wrapper{display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;border:1px solid #BFBBBB;border-radius:9999px;background:#FFFFFF;cursor:pointer;transition:border 100ms ease;font:400 0.875rem/1.25rem \"Source Sans 3\"}.chip__wrapper:hover,.chip__wrapper:focus-visible{outline:none;border:1px solid #575352}.chip__wrapper:focus{border:1px solid #0A8276}.chip__wrapper.chip__wrapper--small{padding:4px 12px}.chip__wrapper.chip__wrapper--large{padding:8px 16px}.chip__wrapper.chip__wrapper--opened{border:1px solid #0A8276}.chip__wrapper.chip__wrapper--opened .wrapper__open-button{transform:rotate(-180deg)}.chip__wrapper.chip__wrapper--selected{outline:3px solid #0A8276;outline-offset:-3px;color:#0A8276}.chip__wrapper.chip__wrapper--selected:hover,.chip__wrapper.chip__wrapper--selected:focus-visible{outline:3px solid #08665C;color:#08665C}.wrapper__label{display:inline-flex;align-items:center;gap:4px;font:400 0.875rem/1.25rem \"Source Sans 3\"}.wrapper__label .label__selected-options{font:600 0.875rem/1.25rem \"Source Sans 3\"}.wrapper__open-button{display:flex;align-items:center;transition:all 300ms ease}.wrapper__unselect-button{display:flex;align-items:center}.chip__dropdown{position:absolute;z-index:1;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;border-radius:1px;padding:8px 0;min-width:222px;background-color:#FFFFFF}";

package/dist/esm/ifx-content-switcher.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const contentSwitcherCss = ".ifx-content-switcher{background-color:#FFFFFF;border:1px solid #BFBBBB;border-radius:9999px;height:36px;width:fit-content;box-sizing:border-box;display:flex;flex-direction:row;align-items:center}.ifx-content-switcher ::slotted(ifx-content-switcher-item){position:relative}.ifx-content-switcher ::slotted(ifx-content-switcher-item:first-child){left:-1px;margin-right:-1px}.ifx-content-switcher ::slotted(ifx-content-switcher-item:last-child){right:-1px;margin-left:-1px}.ifx-content-switcher ::slotted(.ifx-content-switcher-divider){width:1px;height:20px;background-color:#8D8786;margin:0px 1px;visibility:visible}.ifx-content-switcher ::slotted(.ifx-content-switcher-divider.hidden){visibility:hidden}";

package/dist/esm/ifx-date-picker.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const datePickerCss = ".date__picker-container{display:flex;flex-direction:column}.date__picker-container .label__wrapper{color:#1D1D1D;font:400 1rem/1.5rem \"Source Sans 3\"}.date__picker-container .label__wrapper .asterisk{display:none}.date__picker-container .label__wrapper .asterisk.required{display:inline;margin-left:4px}.date__picker-container .label__wrapper .asterisk.required.error{color:#CD002F}.date__picker-container.disabled .label__wrapper{color:#575352}.date__picker-container.error .caption__wrapper{color:#CD002F}.date__picker-container.disabled .caption__wrapper{color:#575352}.date__picker-container .caption__wrapper{margin-top:4px;color:#1D1D1D;font:400 0.75rem/1rem \"Source Sans 3\"}.date__picker-input{font-family:\"Source Sans 3\";outline:none;width:100%;cursor:pointer;border-radius:1px;border:1px solid #8D8786;height:100%}.date__picker-input.firefox__classes{padding:8px 16px;color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px;cursor:pointer}.date__picker-input:focus:not(.error,.success){border-color:#0A8276}.date__picker-input:hover:not(:disabled,:focus,.error,.success){border-color:#575352}.date__picker-input:disabled{border-color:#575352;background-color:#EEEDED}.date__picker-input.error{border-color:#CD002F}.date__picker-input.success:not(.error){border-color:#4CA460}.date__picker-input::-webkit-datetime-edit-text{color:#8D8786;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.date__picker-input.has-value::-webkit-datetime-edit-text{color:#1D1D1D}.date__picker-input.has-value::-webkit-datetime-edit{color:#1D1D1D}::-webkit-datetime-edit{color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px}::-webkit-datetime-edit-fields-wrapper{padding:8px 16px;padding-bottom:9px;transform:translateY(1px)}::-webkit-inner-spin-button{display:none}::-webkit-calendar-picker-indicator{position:absolute;right:15px;font-size:19px;cursor:pointer;border-radius:1px}::-webkit-calendar-picker-indicator:focus-within{outline:2px solid #0A8276;outline-offset:2px}.input__wrapper{display:flex;justify-content:space-between;align-items:center;align-self:stretch;background:#FFFFFF;position:relative}.input__wrapper.large{height:40px}.input__wrapper.small{height:36px}.input__wrapper.disabled .icon__wrapper{background-color:#EEEDED}.icon__wrapper{position:absolute;right:17px;padding:2px;display:flex;justify-content:flex-end;align-items:center;pointer-events:none;z-index:100;background-color:#FFFFFF;line-height:16px}.icon__wrapper ifx-icon{vertical-align:middle}";

package/dist/esm/ifx-dropdown.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 import { c as createPopper } from './popper-1604923e.js';

package/dist/esm/ifx-file-upload.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const fileUploadCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{font-family:var(--ifx-font-family, sans-serif)}.file-upload-wrapper{display:flex;flex-direction:column}.file-upload-wrapper.disabled{pointer-events:none}.file-upload-wrapper.disabled label,.file-upload-wrapper.disabled .file-upload-info{color:#575352}.file-upload-label{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;color:#1D1D1D}.file-upload-label .required{display:inline-block;margin-left:4px}.file-upload-label .required.error{color:#CD002F}.upload-dropzone{border:1px dashed #BFBBBB;padding:40px;text-align:center;cursor:pointer;color:#1D1D1D;transition:border-color 0.3s ease;border-radius:1px;background:#FFFFFF}.upload-dropzone ifx-icon{color:#0A8276}.upload-dropzone:hover{border:1px dashed #8D8786}.upload-dropzone.drag-over{border:1px solid #0A8276;background:#F7F7F7}.upload-dropzone.drag-over.error{border:1px solid #0A8276}.upload-dropzone.error{border-color:#CD002F}.disabled .upload-dropzone{pointer-events:none;border-color:#BFBBBB;color:#BFBBBB}.disabled .upload-dropzone ifx-icon{color:#BFBBBB}.upload-dropzone input{display:none}.file-upload-info{font-style:normal;font-weight:400;font-size:0.75rem;line-height:1rem;letter-spacing:0em;color:#1D1D1D;margin:0;margin-top:4px}.file-upload-status{font-style:normal;font-weight:400;font-size:0.75rem;line-height:1rem;letter-spacing:0.2px;margin-top:8px}.file-upload-status.file-upload-status__error{display:flex;align-items:center;color:#CD002F}.file-upload-status.file-upload-status__error ifx-icon{position:relative;top:-1px;color:#CD002F;margin-right:8px}.upload-heading{font:600 1.125rem/1.625rem \"Source Sans 3\";margin-bottom:8px}.file-list-wrapper{margin-top:16px}.file-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:16px}.file-item{border:1px solid #BFBBBB;padding-top:12px;padding-right:16px;padding-bottom:8px;padding-left:16px;display:flex;gap:8px}.file-info{width:100%;min-width:0}.file-top-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:-8px}.file-top-row ifx-icon{flex-shrink:0}.file-name-wrapper{display:flex;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;font-weight:400;font-size:0.875rem}.file-name-base{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:1;min-width:0}.file-name-ext{flex-shrink:0;margin-left:0}.file-middle-row{display:flex;align-items:center;font-size:0.75rem;line-height:1rem;flex-wrap:wrap;color:#575352}.file-middle-row .file-status{margin-left:12px}.file-middle-row .file-status ifx-icon{margin-right:8px}.file-progress-row{margin-top:4px}.file-progress-row ifx-progress-bar{width:100%}.upload-success{border-color:#0A8276}.upload-success .file-status ifx-icon{position:relative;top:1px;color:#4CA460}.upload-failed{border-color:#CD002F}.upload-failed .file-status{color:#CD002F;margin-left:0}";

package/dist/esm/ifx-footer.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, a as Host, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const footerCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:block;width:100%}.footer__container{padding:0px 32px;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#FFFFFF;font-family:var(--ifx-font-family)}.footer__container .footer__wrapper{display:flex;flex-direction:column;width:100%}@media (max-width: 768px){.footer__container .footer__wrapper{margin-top:48px}}.footer__container .footer__wrapper .footer__logo_top svg{display:none}@media (max-width: 768px){.footer__container .footer__wrapper .footer__logo_top svg{display:inline}}.footer__container .footer__wrapper .footer__logo_btm svg{display:inline;vertical-align:bottom}.footer__container .footer__wrapper .col-wrapper{display:flex;align-items:flex-start;width:100%;justify-content:space-between;margin:32px 0}@media (max-width: 768px){.footer__container .footer__wrapper .col-wrapper{flex-wrap:wrap;justify-content:space-between;margin:24px 0}}.footer__container .footer__wrapper .col-wrapper ::slotted([slot=col]){display:flex;gap:32px}@media (max-width: 768px){.footer__container .footer__wrapper .col-wrapper ::slotted([slot=col]){flex-wrap:wrap;margin-top:24px}}.footer__container .footer__wrapper .default{display:flex;justify-content:space-between;align-items:center;width:100%;padding:24px 0;border-bottom:1px solid #BFBBBB;margin-top:24px}.footer__container .footer__wrapper .default .footer__logo_btm svg{display:inline;vertical-align:bottom}@media (max-width: 768px){.footer__container .footer__wrapper .default .footer__logo_btm svg{display:none}}@media (max-width: 768px){.footer__container .footer__wrapper .default{margin-top:0px;flex-direction:column;align-items:flex-start}}.footer__container .footer__wrapper .default ::slotted([slot=socials]){display:flex;gap:32px}@media (max-width: 768px){.footer__container .footer__wrapper .default ::slotted([slot=socials]){flex-wrap:wrap}}.footer__container .footer__wrapper .footer__base{display:flex;justify-content:space-between;width:100%;padding:24px 0}.footer__container .footer__wrapper .footer__base .footer__brand{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;color:#1D1D1D;flex-grow:1}.footer__container .footer__wrapper .footer__base .footer__info>::slotted([slot=info]){display:flex;gap:24px;padding-right:16px;justify-content:flex-end;flex-grow:1}.footer__container .footer__wrapper .footer__base .footer__info>::slotted([slot=info]) a{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;text-decoration:none}@media (max-width: 768px){.footer__container .footer__wrapper .footer__base .footer__info>::slotted([slot=info]){justify-content:flex-start;flex-wrap:wrap;gap:12px 16px}}@media (max-width: 768px){.footer__container .footer__wrapper .footer__base{flex-direction:column-reverse}.footer__container .footer__wrapper .footer__base .footer__brand{margin-top:16px}}";

package/dist/esm/ifx-icon-button.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, a as Host, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 import { c as classNames } from './index-72ac5051.js';

package/dist/esm/ifx-icon.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-6c9eba32.js';
 import { g as getIcon } from './icons-0f976ed0.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const infineonIconStencilCss = "ifx-icon{display:inline-flex;justify-content:center}ifx-icon:empty{display:none}";

package/dist/esm/ifx-indicator.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const indicatorCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:inline-flex}.indicator__container .dot__wrapper{display:flex;width:8px;height:8px;justify-content:center;align-items:center;flex-shrink:0;border-radius:50%;background-color:#0A8276}.indicator__container .number__container{height:16px;display:inline-flex;padding:0;min-width:16px;justify-content:center;align-items:center;border-radius:100px;background-color:#0A8276}.indicator__container .number__container .number__wrapper{padding:0 4px;color:#FFFFFF;text-align:center;font-size:0.875rem;font-style:normal;font-weight:600;line-height:16px}.indicator__container .number__container.inverted{background-color:#FFFFFF}.indicator__container .number__container.inverted .number__wrapper{color:#0A8276}";

package/dist/esm/ifx-link.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 import { c as classNames } from './index-72ac5051.js';

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

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 /**

package/dist/esm/ifx-multiselect_2.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, g as getElement, a as Host } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const multiselectCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}.ifx-multiselect-container{position:relative;box-sizing:border-box;font-family:var(--ifx-font-family)}.ifx-multiselect-container:hover{cursor:pointer}.ifx-multiselect-container .ifx-label-wrapper{font-size:1rem;line-height:1.5rem;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere;max-width:100%}.ifx-multiselect-container .ifx-error-message-wrapper{color:#CD002F;font-size:0.75rem;line-height:1rem;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere;max-width:100%}.ifx-multiselect-container .ifx-multiselect-wrapper{background-color:#FFFFFF;box-sizing:border-box;display:flex;align-items:center;border:1px solid #8D8786;border-radius:1px;width:100%;font-weight:400;font-style:normal;height:40px;line-height:24px;padding:8px 16px;font-size:1rem;line-height:1.5rem}.ifx-multiselect-container .ifx-multiselect-wrapper:focus-visible{outline:none}.ifx-multiselect-container .ifx-multiselect-wrapper:focus-visible:not(.active):not(:active){outline:none}.ifx-multiselect-container .ifx-multiselect-wrapper:focus-visible:not(.active):not(:active)::before{content:\"\";position:absolute;width:calc(100% + 4px);height:calc(100% + 4px);top:50%;left:50%;transform:translate(-50%, -50%);border:2px solid #0A8276;border-radius:2px}.ifx-multiselect-container .ifx-multiselect-wrapper.disabled{background:#EEEDED;color:#575352;border-color:#575352;cursor:default;-webkit-user-select:none;-ms-user-select:none;user-select:none}.ifx-multiselect-container .ifx-multiselect-wrapper.error{border-color:#CD002F}.ifx-multiselect-container .ifx-multiselect-wrapper:hover:not(.focus,:focus){border-color:#575352}.ifx-multiselect-container .ifx-multiselect-wrapper.active{border-color:#0A8276 !important}.ifx-multiselect-container .ifx-multiselect-wrapper.active .icon-wrapper-up{display:flex;align-items:center;justify-content:center;padding-left:8px}.ifx-multiselect-container .ifx-multiselect-wrapper.active .icon-wrapper-down{display:none}.ifx-multiselect-container .ifx-multiselect-wrapper .icon-wrapper-up{display:none}.ifx-multiselect-container .ifx-multiselect-wrapper .icon-wrapper-down{display:flex;align-items:center;justify-content:center;padding-left:8px}.ifx-multiselect-container .ifx-multiselect-wrapper.is-flipped .ifx-multiselect-dropdown-menu{top:auto;bottom:100%}.ifx-multiselect-container .ifx-multiselect-input{flex-grow:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ifx-multiselect-container .ifx-multiselect-input.placeholder{opacity:0.5}.ifx-multiselect-container .ifx-multiselect-icon-container{margin-left:auto;display:flex;align-items:center;gap:8px}.ifx-multiselect-container .ifx-multiselect-icon-container .ifx-multiselect-icon-container{display:flex}.ifx-multiselect-container .ifx-multiselect-icon-container .icon-wrapper{display:flex;align-items:center;transition:transform 0.2s ease-in-out}.ifx-multiselect-container .ifx-multiselect-icon-container .icon-wrapper--open{transform:rotate(180deg)}.ifx-multiselect-container .ifx-clear-button{display:flex;align-items:center}.ifx-multiselect-container .ifx-clear-button.hide{display:none}.ifx-multiselect-container .ifx-multiselect-dropdown-menu{box-sizing:border-box;position:absolute;top:100%;left:0;width:100%;margin-top:4px;border:1px solid #EEEDED;background-color:#fff;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1);max-height:300px;z-index:1000;display:flex;flex-direction:column}.ifx-multiselect-dropdown-functions{padding:12px 16px;border-bottom:1px solid #EEEDED;flex-shrink:0}.ifx-multiselect-dropdown-search{margin-bottom:12px}.ifx-multiselect-dropdown-controls{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px}.ifx-multiselect-dropdown-controls .select-all-wrapper{display:flex}.ifx-multiselect-dropdown-controls .expand-collapse-controls{display:flex;gap:12px}.ifx-multiselect-dropdown-controls .control-item{font-size:0.875rem;line-height:1.25rem}.ifx-multiselect-dropdown-controls .control-item:hover{color:#0A8276}.ifx-multiselect-dropdown-controls .control-item:active{color:#08665C}.ifx-multiselect-dropdown-controls .control-item:focus{outline:none}.ifx-multiselect-dropdown-controls .control-item:focus-visible{outline:2px solid #0A8276;outline-offset:2px;border-radius:1px}.ifx-multiselect-options{flex:1;overflow-y:auto;padding-top:12px;padding-bottom:12px}.ifx-multiselect-options.show-no-results .ifx-multiselect-no-results{display:block}.ifx-multiselect-no-results{padding-left:16px;padding-right:16px;display:none}";

package/dist/esm/ifx-navbar.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 const navbarCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{width:100%;display:block}.navbar__wrapper{font-family:var(--ifx-font-family);height:63px;position:sticky;z-index:1030;border-bottom:1px solid #EEEDED}.navbar__wrapper.fixed{border-bottom:none}.navbar__main-container{position:absolute;top:0;width:100%;transition:all 1s;z-index:1020}.navbar__main-container.fixed{position:fixed}.navbar__main-container.fixed .navbar__container{border-bottom:1px solid #EEEDED}.navbar__main-container.show{height:100vh;bottom:0;background-color:rgba(29, 29, 29, 0.2);transition:1s;z-index:1}.navbar__sidebar{box-sizing:border-box;position:fixed;right:-100%;top:64px;display:flex;flex-direction:column;align-items:flex-start;width:375px;height:calc(100vh - 64px);background-color:#FFFFFF;transition:right 1s;z-index:1030}.navbar__sidebar.show{right:0;transition:right 1s}.navbar__sidebar .navbar__sidebar-top-row{display:flex;padding:var(--borderRadius-none, 0px) var(--space-300, 24px) 30px var(--space-300, 24px);flex-direction:column;align-items:flex-start;gap:var(--space-200, 16px);flex:1 0 0;align-self:stretch;overflow-y:auto}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper{display:flex;padding-top:var(--space-200, 16px);flex-direction:column;align-items:flex-start;align-self:stretch;gap:16px}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper.expand{align-items:initial}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper .navbar__sidebar-top-row-item{display:flex;padding:var(--space-200, 0px) var(--space-50, 4px) var(--space-200, 0px) 0px;align-items:center;gap:var(--space-100, 8px);align-self:stretch;justify-content:space-between}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper .navbar__sidebar-top-row-item .navbar__sidebar-top-row-item-icon-wrapper ifx-icon{vertical-align:middle}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper .navbar__sidebar-top-row-item:hover{cursor:pointer}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper .navbar__sidebar-top-row-item .navbar__sidebar-top-row-item-label{color:var(--color-base-black, #1D1D1D);font-family:\"Source Sans 3\";font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__sidebar .navbar__sidebar-bottom-row{display:none;padding:var(--space-150, 12px) var(--space-300, 24px) var(--space-150, 12px) var(--space-200, 16px);flex-direction:column;align-items:flex-start;align-self:stretch;background:var(--color-engineering-100, #F7F7F7);border-top:1px solid var(--color-engineering-200, #EEEDED);gap:10px;max-height:160px;overflow-y:auto}.navbar__sidebar .navbar__sidebar-bottom-row.show{display:flex}.navbar__sidebar .navbar__sidebar-bottom-row .navbar__sidebar-bottom-row-item{display:flex;height:40px;padding-right:var(--space-50, 4px);align-items:center;gap:var(--space-100, 8px);flex:1 0 0}.navbar__sidebar .navbar__sidebar-bottom-row .navbar__sidebar-bottom-row-item .navbar__sidebar-bottom-row-item-label{color:var(--color-base-black, #1D1D1D);font-family:\"Source Sans 3\";font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__sidebar .navbar__sidebar-bottom-row .navbar__sidebar-bottom-row-item .navbar__sidebar-bottom-row-item-icon-wrapper{display:flex;align-items:center}.navbar__sidebar .navbar__sidebar-content-products,.navbar__sidebar .navbar__sidebar-content-main{display:flex;flex-direction:column;align-items:flex-start;padding:0px;gap:24px;flex:none;order:0;align-self:stretch;flex-grow:0}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-header,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-about-header,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-header,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-about-header{display:flex;flex-direction:row;align-items:center;padding:0px;gap:16px;flex:none;order:0;align-self:stretch;flex-grow:0;color:#BFBBBB}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-header span,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-about-header span,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-header span,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-about-header span{color:#1D1D1D;font-weight:600;font-size:18px;line-height:28px;display:flex;align-items:center}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu{display:flex;flex-direction:column;align-items:flex-start;padding:0px;gap:16px;flex:none;order:1;flex-grow:0;width:100%}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-products-menu-item,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-products-menu-item,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-products-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-products-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item{display:flex;flex-direction:row;align-items:center;padding:0px;flex:none;order:0;flex-grow:0}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-products-menu-item a,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-products-menu-item a,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-products-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-products-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item a{text-decoration:none;font-style:normal;font-weight:400;font-size:16px;line-height:24px;display:flex;align-items:center;color:#1D1D1D}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item{color:#BFBBBB}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item a{font-style:normal;font-weight:600;font-size:18px;line-height:28px;display:flex;align-items:center;color:#1D1D1D;flex:none;order:0;flex-grow:1}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu{align-items:normal}.navbar__container{display:flex;justify-content:space-between;align-items:center;padding:8px 40px;gap:16px;background-color:#FFFFFF;font-family:var(--ifx-font-family)}.navbar__container.expanded{justify-content:initial}.navbar__container .navbar__container-search-field-wrapper{display:none}.navbar__container .navbar__container-search-field-wrapper.show{display:flex}.navbar__container .navbar__container-left{display:flex;flex-direction:row;align-items:center;padding:0;gap:16px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-left.hide{display:none}.navbar__container .navbar__container-left.expand{justify-content:initial;flex:1}.navbar__container .navbar__container-left.expand .navbar__container-left-content{align-items:initial;flex:1}.navbar__container .navbar__container-left.expand .navbar__container-left-content .navbar__container-left-content-navigation-group{justify-content:initial;flex:1}.navbar__container .navbar__container-left.expand .navbar__container-left-content .navbar__container-left-content-navigation-group .navbar__container-left-content-navigation-item-search-bar{flex:1}.navbar__container .navbar__container-left .navbar__container-left-logo{display:flex;flex-direction:row;align-items:center;padding:0px;gap:16px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-logo.hide{display:none}.navbar__container .navbar__container-left .navbar__container-left-logo h6{position:relative;margin:0;padding:0;font-style:normal;font-weight:600;font-size:16px;display:flex;align-items:center;color:#1D1D1D;flex:none;order:1;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-logo .navbar__container-left-logo-default{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:12px 0px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-logo .navbar__container-left-logo-default svg{width:91px;height:40px;flex:none;order:0;flex-grow:0;vertical-align:bottom}.navbar__container .navbar__container-left .navbar__container-left-logo .navbar__container-left-logo-divider{width:1px;height:32px;background:#EEEDED;flex:none;order:2;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-content{display:flex;flex-direction:row;justify-content:center;align-items:flex-start;padding:0px;flex:none;order:1;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-content .navbar__container-left-content-navigation-group{display:flex;flex-direction:row;align-items:center;padding:0px;gap:4px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-content .navbar__container-left-content-navigation-group .navbar__container-left-content-navigation-item-search-bar{display:flex;flex-direction:row;align-items:center;padding:0px 8px;flex:none;order:5;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-content .navbar__container-left-content-navigation-group .navbar__container-left-content-navigation-item{display:flex;flex-direction:row;align-items:center;padding:0px 8px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-content .navbar__container-left-content-navigation-group .navbar__container-left-content-navigation-item a{display:flex;align-items:center;font-weight:400;font-size:16px;line-height:24px;color:#1D1D1D;text-decoration:none;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;padding:0;gap:8px;flex:none;order:1;flex-grow:0}.navbar__container .navbar__container-right.hide{display:none}.navbar__container .navbar__container-right.expand{justify-content:initial;flex:1}.navbar__container .navbar__container-right.expand .navbar__container-right-content{align-items:initial;flex:1}.navbar__container .navbar__container-right.expand .navbar__container-right-content .navbar__container-right-content-navigation-group{justify-content:initial;flex:1}.navbar__container .navbar__container-right.expand .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar{flex:1}.navbar__container .navbar__container-right.expand .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-search-bar-icon-wrapper{flex:1}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:4px 0px 4px 16px;border-left:1px solid #BFBBBB;gap:16px;flex:none;order:1;flex-grow:0;width:41px;height:40px}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper.hide{display:none}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__burger-icon{display:flex;align-items:center}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__burger-icon:hover{cursor:pointer}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__burger-icon.close{display:none}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__cross-icon{display:none;align-items:center}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__cross-icon.show{display:flex}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__cross-icon.show:hover{cursor:pointer}.navbar__container .navbar__container-right .navbar__container-right-content{display:flex;flex-direction:column;align-items:flex-start;padding:0px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group{position:relative;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;padding:0px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar{display:flex;flex-direction:row;align-items:center;padding:0px 8px;gap:4px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item .navbar__container-right-content-navigation-item-search-bar-icon-wrapper,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile .navbar__container-right-content-navigation-item-search-bar-icon-wrapper,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-search-bar-icon-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item .navbar__container-right-content-navigation-item-search-bar-icon-wrapper.isOpen,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile .navbar__container-right-content-navigation-item-search-bar-icon-wrapper.isOpen,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-search-bar-icon-wrapper.isOpen{position:absolute;top:10px}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item .navbar__container-right-content-navigation-item-navigation-profile,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile .navbar__container-right-content-navigation-item-navigation-profile,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-navigation-profile{position:relative;width:24px;height:24px;background:#0A8276;border-radius:100px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item .navbar__container-right-content-navigation-item-navigation-profile a,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile .navbar__container-right-content-navigation-item-navigation-profile a,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-navigation-profile a{position:absolute;width:22px;height:20px;left:calc(50% - 11px);top:calc(50% - 10px);font-style:normal;font-weight:600;font-size:14px;line-height:20px;text-decoration:none;display:flex;align-items:center;justify-content:center;text-align:center;color:#FFFFFF}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item .navbar__container-right-content-navigation-item-icon-wrapper,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile .navbar__container-right-content-navigation-item-icon-wrapper,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-icon-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item a,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile a,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar a{font-style:normal;font-weight:400;font-size:14px;line-height:20px;color:#1D1D1D;text-decoration:none;display:flex;align-items:center;flex:none;order:1;flex-grow:0}@media screen and (max-width: 800px){.navbar__container{padding:0px 16px;height:64px;gap:initial}.navbar__container.expanded .navbar__container-right .navbar__burger-icon-wrapper{display:none}.navbar__container .navbar__container-left .navbar__container-left-content{display:none}.navbar__container .navbar__container-left .navbar__container-left-logo .navbar__container-left-logo-divider{display:none}.navbar__container .navbar__container-right{flex:1}.navbar__sidebar{width:0;transition:1s}}@media screen and (max-width: 500px){.navbar__sidebar.show{width:100%}}@media screen and (min-width: 500px){.navbar__sidebar.show{width:50%}}@media screen and (min-width: 800px){.navbar__wrapper{height:63px}.navbar__container{padding:0px 16px;height:63px;gap:initial}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper{display:none}.navbar__main-container.show{height:auto;background-color:inherit;transition:none}.navbar__sidebar{width:0;transition:1s}.navbar__sidebar.show{right:-100%}}@media screen and (min-width: 1024px){.navbar__wrapper{height:72px}.navbar__container{padding:0px 24px;height:72px}.navbar__container .navbar__container-left{gap:12px;display:flex}.navbar__container .navbar__container-left .navbar__container-left-content{display:flex}.navbar__container .navbar__container-left .navbar__container-left-logo-default svg{width:72.8px;height:32px}.navbar__main-container.show{height:auto;background-color:inherit;transition:none}}@media screen and (min-width: 1200px){.navbar__wrapper{height:80px}.navbar__container{padding:0px 32px;height:80px}.navbar__container .navbar__container-left .navbar__container-left-content{justify-content:inherit}.navbar__container .navbar__container-right .navbar__container-right-content{justify-content:inherit}}@media screen and (min-width: 1440px){.navbar__wrapper{height:80px}.navbar__container{padding:0px 40px;height:80px}.navbar__container .navbar__container-left .navbar__container-left-content{justify-content:center}.navbar__container .navbar__container-right .navbar__container-right-content{justify-content:inherit}}";
 const IfxNavbarStyle0 = navbarCss;

package/dist/esm/ifx-notification.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, a as Host, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const notificationCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}.ifx-notification__wrapper{display:flex;flex-direction:row;align-items:center;padding:8px 16px;background-color:#FFFFFF;font-family:var(--ifx-font-family);color:#1D1D1D;border:1px solid #EEEDED}.ifx-notification__wrapper.ifx-notification__wrapper--success{border-left:4px solid #4CA460}.ifx-notification__wrapper.ifx-notification__wrapper--success .ifx-notification__icon{color:#4CA460}.ifx-notification__wrapper.ifx-notification__wrapper--locked{border-left:4px solid #E16B25}.ifx-notification__wrapper.ifx-notification__wrapper--locked .ifx-notification__icon{color:#E16B25}.ifx-notification__wrapper.ifx-notification__wrapper--error{border-left:4px solid #CD002F}.ifx-notification__wrapper.ifx-notification__wrapper--error .ifx-notification__icon{color:#CD002F}.ifx-notification__wrapper.ifx-notification__wrapper--neutral{border-left:4px solid #0A8276}.ifx-notification__wrapper.ifx-notification__wrapper--neutral .ifx-notification__icon{color:#0A8276}.ifx-notification__wrapper .ifx-notification__icon{margin-right:8px;display:flex;align-self:center}.ifx-notification__wrapper .ifx-notification__body{display:flex;flex-direction:row;flex-grow:1;font-size:0.875rem}.ifx-notification__wrapper .ifx-notification__body .ifx-notification__slot{flex-grow:1;display:inline-flex;align-items:center}.ifx-notification__wrapper .ifx-notification__link{font-size:0.875rem}@media (max-width: 576px){.ifx-notification__wrapper .ifx-notification__icon{align-self:flex-start}.ifx-notification__wrapper .ifx-notification__body{flex-direction:column}.ifx-notification__wrapper .ifx-notification__link{margin-top:8px}}";

package/dist/esm/ifx-progress-bar.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const progressBarCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:flex;width:100%}.progress-bar{height:16px;bottom:0;right:0;top:0;left:0;display:flex;height:20px;border-radius:1px;width:100%;overflow:hidden;background-color:#EEEDED;font-family:var(--ifx-font-family)}.progress-bar.s{height:4px}.progress-bar .label{font-style:normal;font-size:0.875rem;font-weight:400;line-height:1.25rem;color:#FFFFFF}.progress-bar .progress{display:flex;align-items:center;justify-content:center;min-width:fit-content;height:100%;background-color:#0A8276;transition:width 0.2s ease}";

package/dist/esm/ifx-radio-button-group.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const radioButtonGroupCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}.radio-button-group-container{display:flex;flex-direction:column}.radio-button-group{display:flex;font-family:var(--ifx-font-family);gap:8px}.radio-button-group.horizontal{flex-direction:row;column-gap:12px}.radio-button-group.vertical{flex-direction:column;row-gap:12px}.group-label{font:400 0.75rem/1rem \"Source Sans 3\";margin-bottom:8px;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption{margin-top:8px;align-self:flex-start;display:flex;width:100%;column-gap:8px;justify-content:space-between;align-items:center}.caption.default{color:#1D1D1D}.caption.error{color:#CD002F}.caption-text{font:400 0.75rem/1rem \"Source Sans 3\";flex:1;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption-icon{flex:0;display:flex}";

package/dist/esm/ifx-radio-button.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-6c9eba32.js';
-import { d as detectFramework, t as trackComponent } from './framework-detection-4f7178ab.js';
+import { d as detectFramework, t as trackComponent } from './framework-detection-33c31a6d.js';
 import { i as isNestedInIfxComponent } from './dom-utils-1988cdf1.js';
 const radioButtonCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:inline-flex;--_ifx-fallback-display:none !important}._ifx-radiobutton-fallback{display:var(--_ifx-fallback-display);position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;border:0 !important}.radioButton__container{box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:center;padding:0px;gap:8px;cursor:pointer;font-family:var(--ifx-font-family)}.radioButton__container.m .radioButton__wrapper{width:24px;height:24px}.radioButton__container .radioButton__wrapper{width:20px;height:20px;position:relative;display:block;border-radius:50%;background-color:#FFFFFF;border:1px solid #575352}.radioButton__container .radioButton__wrapper:focus{outline:none}.radioButton__container .radioButton__wrapper:focus::before{content:\"\";position:absolute;width:calc(100% + 4px);height:calc(100% + 4px);top:50%;left:50%;transform:translate(-50%, -50%);border:2px solid #0A8276;border-radius:50%}.radioButton__container .radioButton__wrapper .radioButton__wrapper-mark{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);background-color:#0A8276;border-radius:50%;display:flex;justify-content:center;align-items:center;border-color:transparent}.radioButton__container .radioButton__wrapper:hover{background-color:#EEEDED}.radioButton__container .radioButton__wrapper.disabled{background-color:#BFBBBB;border-color:#BFBBBB}.radioButton__container .radioButton__wrapper.disabled.error:hover,.radioButton__container .radioButton__wrapper.disabled.error:focus-visible{border-color:#CD002F}.radioButton__container .radioButton__wrapper.checked{border-color:#0A8276}.radioButton__container .radioButton__wrapper.checked::after{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;background-color:#0A8276;border-radius:50%}.radioButton__container .radioButton__wrapper.checked.disabled::after{background-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked:hover{border-color:#08665C}.radioButton__container .radioButton__wrapper.checked:hover .radioButton__wrapper-mark{background-color:#08665C}.radioButton__container .radioButton__wrapper.checked.disabled{background-color:#FFFFFF;border-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked.disabled.disabled::after{background-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked.disabled .radioButton__wrapper-mark{background-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked.error::after{border-color:#CD002F;background-color:#CD002F}.radioButton__container .radioButton__wrapper.error:not(.disabled){border-color:#CD002F}.radioButton__container .radioButton__wrapper.error:not(.disabled):hover,.radioButton__container .radioButton__wrapper.error:not(.disabled):focus-visible{border-color:#CD002F}.radioButton__container .label{display:flex;align-items:center;height:20px;font-style:normal;font-weight:400;font-size:0.875rem;line-height:1.25rem;color:#1D1D1D;flex:none;order:1;flex-grow:0}.radioButton__container .label.label-m{height:24px;font-size:1rem;line-height:1.5rem}.radioButton__container .label.disabled{color:#BFBBBB}.radioButton__container .label:hover{cursor:pointer}";