npm - @infineon/infineon-design-system-stencil - Versions diffs - 37.5.0--canary.1962.875bf271db275475cfcbe143f557fd09f5b19850.0 → 37.6.0--canary.1954.c32dabd608bdc0a314e8b9bc33fa322b50e86319.0 - Mend

@infineon/infineon-design-system-stencil 37.5.0--canary.1962.875bf271db275475cfcbe143f557fd09f5b19850.0 → 37.6.0--canary.1954.c32dabd608bdc0a314e8b9bc33fa322b50e86319.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 (212) hide show

package/dist/components/{p-4366492e.js.map → p-f4531a17.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-4366492e.js","mappings":"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","names":[],"sources":["src/components/select/multi-select/multiselect-option.scss?tag=ifx-multiselect-option&encapsulation=shadow","src/components/select/multi-select/multiselect-option.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n display: block;\n width: 100%;\n}\n\n.option {\n display: flex;\n flex-direction: column;\n position: relative;\n cursor: pointer;\n list-style: none;\n\n &.option--expanded {\n position: relative;\n }\n\n &.option--has-children {\n position: relative;\n\n .option-item > .chevron-wrapper {\n display: flex;\n }\n }\n\n &--disabled {\n cursor: not-allowed;\n pointer-events: none;\n color: tokens.$ifxColorEngineering300;\n }\n\n &--selected {\n // Additional styles for selected state if needed\n // .option-item {\n // background: red;\n // }\n }\n\n &.search-hidden {\n display: none !important;\n }\n\n &.search-match {\n .option-item {\n .option-label {\n .search-highlight {\n font-weight: bold;\n // color: tokens.$ifxColorOcean400;\n }\n }\n }\n }\n}\n\n.option-item {\n display: flex;\n flex-direction: row;\n align-items: center;\n white-space: nowrap;\n min-height: tokens.$ifxSize250;\n padding: tokens.$ifxSize50 tokens.$ifxSpace200;\n background-color: tokens.$ifxColorBaseWhite;\n transition: background-color 0.2s ease-in-out;\n\n &:hover {\n background-color: tokens.$ifxColorEngineering100;\n }\n\n .option--disabled & {\n &:hover {\n background-color: transparent;\n }\n }\n}\n\n.option-children {\n display: block;\n}\n\n.chevron-wrapper {\n display: none;\n align-items: center;\n justify-content: center;\n margin-right: tokens.$ifxSpace100;\n width: tokens.$ifxSize250;\n height: tokens.$ifxSize250;\n flex-shrink: 0;\n\n &:focus {\n outline: none;\n }\n\n &:focus-visible {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n border-radius: tokens.$ifxBorderRadius12;\n }\n\n .option--has-children & {\n display: flex;\n }\n\n .chevron {\n transition: transform 0.2s ease-in-out;\n color: tokens.$ifxColorEngineering600;\n\n &.chevron--expanded {\n transform: rotate(90deg);\n }\n\n &.chevron--collapsed {\n transform: rotate(0deg);\n }\n }\n}\n\n.checkbox-wrapper {\n display: flex;\n align-items: center;\n margin-right: tokens.$ifxSpace100;\n flex-shrink: 0;\n}\n\n.option-label {\n flex-grow: 1;\n display: flex;\n align-items: center;\n cursor: pointer;\n padding: tokens.$ifxSpace25 0;\n font-size: tokens.$ifxFontSizeS;\n\n &:focus {\n outline: none;\n }\n\n &:focus-visible {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n border-radius: tokens.$ifxBorderRadius12;\n }\n\n .option--disabled & {\n cursor: not-allowed;\n color: tokens.$ifxColorEngineering300;\n }\n}\n","import { Component, Prop, Element, h, Host, State, Listen } from '@stencil/core';\n\n@Component({\n tag: 'ifx-multiselect-option',\n styleUrl: 'multiselect-option.scss',\n shadow: true,\n})\nexport class MultiselectOption {\n @Element() el: HTMLElement;\n\n @Prop() value: string;\n @Prop({ reflect: true, mutable: true }) selected: boolean = false;\n @Prop({ reflect: true, mutable: true }) disabled: boolean = false;\n @Prop({ reflect: true, mutable: true }) indeterminate: boolean = false;\n\n @State() private isExpanded: boolean = false;\n @State() private hasChildren: boolean = false;\n @State() private depth: number = 0;\n @State() private searchTerm: string = '';\n @State() private isSearchActive: boolean = false;\n @State() private isSearchDisabled: boolean = false;\n\n componentWillLoad() {\n this.hasChildren = this.el.children.length > 0;\n this.depth = this.calculateDepth();\n\n this.el.setAttribute('data-level', this.depth.toString());\n\n if (this.hasChildren) {\n const hasSelectedChildren = this.hasAnySelectedChildren();\n if (hasSelectedChildren) {\n this.isExpanded = true;\n }\n }\n }\n\n componentDidLoad() {\n (this.el as any)['__stencil_instance'] = this;\n this.notifyMultiselect();\n this.el.addEventListener('ifx-search-filter', this.handleSearchFilter);\n }\n\n disconnectedCallback() {\n this.el.removeEventListener('ifx-search-filter', this.handleSearchFilter);\n }\n\n private handleSearchFilter = (event: CustomEvent) => {\n const { searchTerm, isActive } = event.detail;\n this.searchTerm = searchTerm.toLowerCase();\n this.isSearchActive = isActive;\n\n requestAnimationFrame(() => {\n this.updateSearchClasses();\n });\n }\n\n private updateSearchClasses() {\n const optionDiv = this.el.shadowRoot?.querySelector('.option');\n if (!optionDiv) return;\n\n if (!this.isSearchActive) {\n optionDiv.classList.remove('search-hidden', 'search-parent', 'search-match');\n this.removeHighlighting();\n this.isSearchDisabled = false;\n return;\n }\n\n const textContent = this.getTextContent().toLowerCase();\n const matchesSearch = textContent.includes(this.searchTerm);\n const hasMatchingParent = this.hasMatchingParent();\n\n requestAnimationFrame(() => {\n const hasMatchingChildren = this.hasMatchingChildren();\n\n optionDiv.classList.remove('search-hidden', 'search-parent', 'search-match');\n this.isSearchDisabled = false;\n\n if (matchesSearch && !this.hasChildren) {\n optionDiv.classList.add('search-match');\n this.highlightSearchTerm();\n } else if (matchesSearch && this.hasChildren) {\n optionDiv.classList.add('search-match');\n this.highlightSearchTerm();\n this.isExpanded = true;\n } else if (!matchesSearch && this.hasChildren && hasMatchingChildren) {\n optionDiv.classList.add('search-parent');\n this.removeHighlighting();\n this.isExpanded = true;\n this.isSearchDisabled = true;\n } else if (hasMatchingParent) {\n optionDiv.classList.add('search-match');\n this.removeHighlighting();\n } else {\n optionDiv.classList.add('search-hidden');\n this.removeHighlighting();\n }\n });\n }\n\n private highlightSearchTerm() {\n if (!this.searchTerm) return;\n\n const labelElement = this.el.shadowRoot?.querySelector('.option-label');\n if (!labelElement) return;\n\n const slotElement = labelElement.querySelector('slot');\n if (!slotElement) return;\n\n this.removeHighlighting();\n\n const originalText = this.getTextContent();\n const searchTermLower = this.searchTerm.toLowerCase();\n const originalTextLower = originalText.toLowerCase();\n\n if (!originalTextLower.includes(searchTermLower)) return;\n\n const searchIndex = originalTextLower.indexOf(searchTermLower);\n\n if (searchIndex === -1) return;\n\n const beforeMatch = originalText.substring(0, searchIndex);\n const matchText = originalText.substring(searchIndex, searchIndex + searchTermLower.length);\n const afterMatch = originalText.substring(searchIndex + searchTermLower.length);\n\n const highlightedContent = document.createElement('span');\n highlightedContent.className = 'highlighted-text';\n\n if (beforeMatch) {\n highlightedContent.appendChild(document.createTextNode(beforeMatch));\n }\n\n const boldElement = document.createElement('strong');\n boldElement.className = 'search-highlight';\n boldElement.textContent = matchText;\n highlightedContent.appendChild(boldElement);\n\n if (afterMatch) {\n highlightedContent.appendChild(document.createTextNode(afterMatch));\n }\n\n labelElement.setAttribute('data-original-content', 'true');\n slotElement.style.display = 'none';\n labelElement.appendChild(highlightedContent);\n }\n\n private removeHighlighting() {\n const labelElement = this.el.shadowRoot?.querySelector('.option-label');\n if (!labelElement) return;\n\n const slotElement = labelElement.querySelector('slot');\n const highlightedElement = labelElement.querySelector('.highlighted-text');\n\n if (highlightedElement) {\n labelElement.removeChild(highlightedElement);\n }\n\n if (slotElement) {\n slotElement.style.display = '';\n }\n\n labelElement.removeAttribute('data-original-content');\n }\n\n private getTextContent(): string {\n let text = '';\n Array.from(this.el.childNodes).forEach(node => {\n if (node.nodeType === Node.TEXT_NODE) {\n text += node.textContent?.trim() \|\| '';\n }\n });\n return text \|\| this.value \|\| '';\n }\n\n private hasMatchingChildren(): boolean {\n if (!this.hasChildren) return false;\n\n const childOptions = Array.from(this.el.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION') as HTMLElement[];\n\n return childOptions.some(child => {\n const childInstance = (child as any)['__stencil_instance'];\n if (!childInstance) return false;\n\n const childText = childInstance.getTextContent().toLowerCase();\n const childMatches = childText.includes(this.searchTerm);\n const grandChildrenMatch = childInstance.hasMatchingChildren();\n\n return childMatches \|\| grandChildrenMatch;\n });\n }\n\n private hasMatchingParent(): boolean {\n let parent = this.el.parentElement;\n while (parent && parent.tagName === 'IFX-MULTISELECT-OPTION') {\n const parentInstance = (parent as any)['__stencil_instance'];\n if (parentInstance) {\n const parentText = parentInstance.getTextContent().toLowerCase();\n if (parentText.includes(this.searchTerm)) {\n return true;\n }\n }\n parent = parent.parentElement;\n }\n return false;\n }\n\n private calculateDepth(): number {\n let depth = 0;\n let parent = this.el.parentElement;\n while (parent && parent.tagName !== 'IFX-MULTISELECT') {\n if (parent.tagName === 'IFX-MULTISELECT-OPTION') {\n depth++;\n }\n parent = parent.parentElement;\n }\n return depth;\n }\n\n @Listen('click')\n handleClick(event: Event) {\n if (this.disabled \|\| (this.isSearchActive && this.isSearchDisabled)) return;\n\n event.stopPropagation();\n\n if (event.type === 'click' && (event.target as HTMLElement).closest('.chevron-wrapper')) {\n this.toggleExpansion();\n return;\n }\n\n let newSelectedState: boolean;\n\n if (this.indeterminate) {\n newSelectedState = true;\n } else {\n newSelectedState = !this.selected;\n }\n\n this.selected = newSelectedState;\n this.indeterminate = false;\n\n if (this.hasChildren) {\n this.isExpanded = newSelectedState;\n\n requestAnimationFrame(() => {\n this.selectAllChildren(newSelectedState);\n this.expandAllChildren(newSelectedState);\n });\n }\n\n this.updateParentStates();\n this.notifyMultiselect();\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n if (this.disabled \|\| (this.isSearchActive && this.isSearchDisabled)) return;\n\n const target = event.target as HTMLElement;\n\n if (target.closest('.chevron-wrapper') \|\| target.closest('.checkbox-wrapper')) {\n return;\n }\n\n if (event.key !== 'ArrowUp' && event.key !== 'ArrowDown') {\n event.stopPropagation();\n }\n\n if (event.key === 'ArrowRight' && this.hasChildren) {\n this.isExpanded = true;\n }\n\n if (event.key === 'ArrowLeft' && this.hasChildren) {\n this.isExpanded = false;\n }\n }\n\n private notifyMultiselect() {\n const updateEvent = new CustomEvent('ifx-option-changed', {\n bubbles: true,\n detail: {\n value: this.value,\n selected: this.selected,\n indeterminate: this.indeterminate\n }\n });\n this.el.dispatchEvent(updateEvent);\n }\n\n private selectAllChildren(selected: boolean) {\n const directChildren = Array.from(this.el.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION') as any[];\n\n directChildren.forEach((child: any) => {\n const childInstance = child['__stencil_instance'];\n if (childInstance) {\n childInstance.selected = selected;\n childInstance.indeterminate = false;\n\n if (childInstance.hasChildren) {\n childInstance.isExpanded = selected;\n childInstance.selectAllChildren(selected);\n }\n childInstance.notifyMultiselect?.();\n }\n });\n }\n\n private expandAllChildren(expanded: boolean) {\n const directChildren = Array.from(this.el.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION') as any[];\n\n directChildren.forEach((child: any) => {\n const childInstance = child['__stencil_instance'];\n if (childInstance && childInstance.hasChildren) {\n childInstance.isExpanded = expanded;\n childInstance.expandAllChildren(expanded);\n }\n });\n }\n\n private updateParentStates() {\n let parent = this.el.parentElement;\n while (parent && parent.tagName === 'IFX-MULTISELECT-OPTION') {\n const parentInstance = (parent as any)['__stencil_instance'];\n if (!parentInstance) {\n parent = parent.parentElement;\n continue;\n }\n\n const siblings = Array.from(parent.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION')\n .map(child => (child as any)['__stencil_instance'])\n .filter(instance => instance !== null);\n\n const selectedCount = siblings.filter(sibling => sibling.selected).length;\n const indeterminateCount = siblings.filter(sibling => sibling.indeterminate).length;\n const totalCount = siblings.length;\n\n if (selectedCount === totalCount && indeterminateCount === 0) {\n parentInstance.selected = true;\n parentInstance.indeterminate = false;\n } else if (selectedCount === 0 && indeterminateCount === 0) {\n parentInstance.selected = false;\n parentInstance.indeterminate = false;\n } else {\n parentInstance.selected = false;\n parentInstance.indeterminate = true;\n }\n\n parentInstance.notifyMultiselect?.();\n parent = parent.parentElement;\n }\n }\n\n private toggleExpansion() {\n this.isExpanded = !this.isExpanded;\n }\n\n private handleCheckboxClick = (event: Event) => {\n if (this.disabled \|\| (this.isSearchActive && this.isSearchDisabled)) return;\n\n event.stopPropagation();\n\n let newSelectedState: boolean;\n\n if (this.indeterminate) {\n newSelectedState = true;\n } else {\n newSelectedState = !this.selected;\n }\n\n this.selected = newSelectedState;\n this.indeterminate = false;\n\n if (this.hasChildren) {\n this.isExpanded = newSelectedState;\n\n requestAnimationFrame(() => {\n this.selectAllChildren(newSelectedState);\n this.expandAllChildren(newSelectedState);\n });\n }\n\n this.updateParentStates();\n this.notifyMultiselect();\n }\n\n private handleHeaderClick = (event: Event) => {\n event.stopPropagation();\n if (!this.disabled && !(this.isSearchActive && this.isSearchDisabled)) {\n this.handleClick(event);\n }\n }\n\n private hasAnySelectedChildren(): boolean {\n const childOptions = Array.from(this.el.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION') as HTMLElement[];\n\n return childOptions.some(child => {\n const hasSelected = child.hasAttribute('selected');\n const hasSelectedDescendants = this.checkForSelectedDescendants(child);\n\n return hasSelected \|\| hasSelectedDescendants;\n });\n }\n\n private checkForSelectedDescendants(element: HTMLElement): boolean {\n const nestedOptions = Array.from(element.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION') as HTMLElement[];\n\n return nestedOptions.some(nestedChild => {\n const isSelected = nestedChild.hasAttribute('selected');\n const hasSelectedNested = this.checkForSelectedDescendants(nestedChild);\n\n return isSelected \|\| hasSelectedNested;\n });\n }\n\n render() {\n let isFlatMultiselect = false;\n const parentMultiselect = this.el.closest('ifx-multiselect');\n if (parentMultiselect) {\n const allOptions = Array.from(parentMultiselect.querySelectorAll('ifx-multiselect-option'));\n isFlatMultiselect = allOptions.every(option => option.children.length === 0);\n }\n\n const basePadding = this.depth * 28 + 16;\n const additionalPadding = this.hasChildren ? 0 : 28;\n let totalPadding = basePadding + additionalPadding;\n\n const optionItemStyle = isFlatMultiselect ? undefined : { paddingLeft: `${totalPadding}px` };\n\n return (\n <Host>\n <div\n class={{\n 'option': true,\n 'option--has-children': this.hasChildren,\n 'option--expanded': this.isExpanded,\n 'option--disabled': this.disabled,\n 'option--selected': this.selected,\n }}\n role=\"option\"\n aria-expanded={this.hasChildren ? (this.isExpanded ? 'true' : 'false') : undefined}\n aria-selected={this.selected ? 'true' : 'false'}\n aria-disabled={this.disabled ? 'true' : 'false'}\n data-level={this.depth}\n data-value={this.value}\n >\n <div\n class=\"option-item\"\n style={optionItemStyle}\n >\n <div\n class=\"chevron-wrapper\"\n tabIndex={this.hasChildren ? 0 : -1}\n role={this.hasChildren ? \"button\" : undefined}\n aria-label={this.hasChildren ? (this.isExpanded ? \"Collapse\" : \"Expand\") : undefined}\n onClick={(e) => { e.stopPropagation(); this.toggleExpansion(); }}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n e.stopPropagation();\n this.toggleExpansion();\n }\n }}\n >\n {this.hasChildren && (\n <ifx-icon\n class={`chevron ${this.isExpanded ? 'chevron--expanded' : 'chevron--collapsed'}`}\n icon=\"chevron-right-16\"\n />\n )}\n </div>\n\n <div class=\"checkbox-wrapper\" onClick={(e) => e.stopPropagation()}>\n <ifx-checkbox\n size='s'\n checked={(this.isSearchActive && this.isSearchDisabled) ? false : (this.indeterminate ? false : this.selected)}\n indeterminate={(this.isSearchActive && this.isSearchDisabled) ? false : this.indeterminate}\n onClick={this.handleCheckboxClick}\n disabled={this.disabled \|\| (this.isSearchActive && this.isSearchDisabled)}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n e.stopPropagation();\n this.handleCheckboxClick(e);\n }\n }}\n />\n </div>\n\n <div\n class=\"option-label\"\n onClick={this.handleHeaderClick}\n tabIndex={-1}\n >\n <slot/>\n </div>\n </div>\n\n {this.isExpanded && <div class=\"option-children\"><slot name=\"children\"/></div>}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"p-f4531a17.js","mappings":"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","names":[],"sources":["src/components/select/multi-select/multiselect-option.scss?tag=ifx-multiselect-option&encapsulation=shadow","src/components/select/multi-select/multiselect-option.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n display: block;\n width: 100%;\n}\n\n.option {\n display: flex;\n flex-direction: column;\n position: relative;\n cursor: pointer;\n list-style: none;\n\n &.option--expanded {\n position: relative;\n }\n\n &.option--has-children {\n position: relative;\n\n .option-item > .chevron-wrapper {\n display: flex;\n }\n }\n\n &--disabled {\n cursor: not-allowed;\n pointer-events: none;\n color: tokens.$ifxColorEngineering300;\n }\n\n &--selected {\n // Additional styles for selected state if needed\n // .option-item {\n // background: red;\n // }\n }\n\n &.search-hidden {\n display: none !important;\n }\n\n &.search-match {\n .option-item {\n .option-label {\n .search-highlight {\n font-weight: bold;\n // color: tokens.$ifxColorOcean400;\n }\n }\n }\n }\n}\n\n.option-item {\n display: flex;\n flex-direction: row;\n align-items: center;\n white-space: nowrap;\n min-height: tokens.$ifxSize250;\n padding: tokens.$ifxSize50 tokens.$ifxSpace200;\n background-color: tokens.$ifxColorBaseWhite;\n transition: background-color 0.2s ease-in-out;\n\n &:hover {\n background-color: tokens.$ifxColorEngineering100;\n }\n\n .option--disabled & {\n &:hover {\n background-color: transparent;\n }\n }\n}\n\n.option-children {\n display: block;\n}\n\n.chevron-wrapper {\n display: none;\n align-items: center;\n justify-content: center;\n margin-right: tokens.$ifxSpace100;\n width: tokens.$ifxSize250;\n height: tokens.$ifxSize250;\n flex-shrink: 0;\n\n &:focus {\n outline: none;\n }\n\n &:focus-visible {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n border-radius: tokens.$ifxBorderRadius12;\n }\n\n .option--has-children & {\n display: flex;\n }\n\n .chevron {\n transition: transform 0.2s ease-in-out;\n color: tokens.$ifxColorEngineering600;\n\n &.chevron--expanded {\n transform: rotate(90deg);\n }\n\n &.chevron--collapsed {\n transform: rotate(0deg);\n }\n }\n}\n\n.checkbox-wrapper {\n display: flex;\n align-items: center;\n margin-right: tokens.$ifxSpace100;\n flex-shrink: 0;\n}\n\n.option-label {\n flex-grow: 1;\n display: flex;\n align-items: center;\n cursor: pointer;\n padding: tokens.$ifxSpace25 0;\n font-size: tokens.$ifxFontSizeS;\n\n &:focus {\n outline: none;\n }\n\n &:focus-visible {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n border-radius: tokens.$ifxBorderRadius12;\n }\n\n .option--disabled & {\n cursor: not-allowed;\n color: tokens.$ifxColorEngineering300;\n }\n}\n","import { Component, Prop, Element, h, Host, State, Listen } from '@stencil/core';\n\n@Component({\n tag: 'ifx-multiselect-option',\n styleUrl: 'multiselect-option.scss',\n shadow: true,\n})\nexport class MultiselectOption {\n @Element() el: HTMLElement;\n\n @Prop() value: string;\n @Prop({ reflect: true, mutable: true }) selected: boolean = false;\n @Prop({ reflect: true, mutable: true }) disabled: boolean = false;\n @Prop({ reflect: true, mutable: true }) indeterminate: boolean = false;\n\n @State() private isExpanded: boolean = false;\n @State() private hasChildren: boolean = false;\n @State() private depth: number = 0;\n @State() private searchTerm: string = '';\n @State() private isSearchActive: boolean = false;\n @State() private isSearchDisabled: boolean = false;\n\n componentWillLoad() {\n this.hasChildren = this.el.children.length > 0;\n this.depth = this.calculateDepth();\n\n this.el.setAttribute('data-level', this.depth.toString());\n\n if (this.hasChildren) {\n const hasSelectedChildren = this.hasAnySelectedChildren();\n if (hasSelectedChildren) {\n this.isExpanded = true;\n }\n }\n }\n\n componentDidLoad() {\n (this.el as any)['__stencil_instance'] = this;\n this.notifyMultiselect();\n this.el.addEventListener('ifx-search-filter', this.handleSearchFilter);\n }\n\n disconnectedCallback() {\n this.el.removeEventListener('ifx-search-filter', this.handleSearchFilter);\n }\n\n private handleSearchFilter = (event: CustomEvent) => {\n const { searchTerm, isActive } = event.detail;\n this.searchTerm = searchTerm.toLowerCase();\n this.isSearchActive = isActive;\n\n requestAnimationFrame(() => {\n this.updateSearchClasses();\n });\n }\n\n private updateSearchClasses() {\n const optionDiv = this.el.shadowRoot?.querySelector('.option');\n if (!optionDiv) return;\n\n if (!this.isSearchActive) {\n optionDiv.classList.remove('search-hidden', 'search-parent', 'search-match');\n this.removeHighlighting();\n this.isSearchDisabled = false;\n return;\n }\n\n const textContent = this.getTextContent().toLowerCase();\n const matchesSearch = textContent.includes(this.searchTerm);\n const hasMatchingParent = this.hasMatchingParent();\n\n requestAnimationFrame(() => {\n const hasMatchingChildren = this.hasMatchingChildren();\n\n optionDiv.classList.remove('search-hidden', 'search-parent', 'search-match');\n this.isSearchDisabled = false;\n\n if (matchesSearch && !this.hasChildren) {\n optionDiv.classList.add('search-match');\n this.highlightSearchTerm();\n } else if (matchesSearch && this.hasChildren) {\n optionDiv.classList.add('search-match');\n this.highlightSearchTerm();\n this.isExpanded = true;\n } else if (!matchesSearch && this.hasChildren && hasMatchingChildren) {\n optionDiv.classList.add('search-parent');\n this.removeHighlighting();\n this.isExpanded = true;\n this.isSearchDisabled = true;\n } else if (hasMatchingParent) {\n optionDiv.classList.add('search-match');\n this.removeHighlighting();\n } else {\n optionDiv.classList.add('search-hidden');\n this.removeHighlighting();\n }\n });\n }\n\n private highlightSearchTerm() {\n if (!this.searchTerm) return;\n\n const labelElement = this.el.shadowRoot?.querySelector('.option-label');\n if (!labelElement) return;\n\n const slotElement = labelElement.querySelector('slot');\n if (!slotElement) return;\n\n this.removeHighlighting();\n\n const originalText = this.getTextContent();\n const searchTermLower = this.searchTerm.toLowerCase();\n const originalTextLower = originalText.toLowerCase();\n\n if (!originalTextLower.includes(searchTermLower)) return;\n\n const searchIndex = originalTextLower.indexOf(searchTermLower);\n\n if (searchIndex === -1) return;\n\n const beforeMatch = originalText.substring(0, searchIndex);\n const matchText = originalText.substring(searchIndex, searchIndex + searchTermLower.length);\n const afterMatch = originalText.substring(searchIndex + searchTermLower.length);\n\n const highlightedContent = document.createElement('span');\n highlightedContent.className = 'highlighted-text';\n\n if (beforeMatch) {\n highlightedContent.appendChild(document.createTextNode(beforeMatch));\n }\n\n const boldElement = document.createElement('strong');\n boldElement.className = 'search-highlight';\n boldElement.textContent = matchText;\n highlightedContent.appendChild(boldElement);\n\n if (afterMatch) {\n highlightedContent.appendChild(document.createTextNode(afterMatch));\n }\n\n labelElement.setAttribute('data-original-content', 'true');\n slotElement.style.display = 'none';\n labelElement.appendChild(highlightedContent);\n }\n\n private removeHighlighting() {\n const labelElement = this.el.shadowRoot?.querySelector('.option-label');\n if (!labelElement) return;\n\n const slotElement = labelElement.querySelector('slot');\n const highlightedElement = labelElement.querySelector('.highlighted-text');\n\n if (highlightedElement) {\n labelElement.removeChild(highlightedElement);\n }\n\n if (slotElement) {\n slotElement.style.display = '';\n }\n\n labelElement.removeAttribute('data-original-content');\n }\n\n private getTextContent(): string {\n let text = '';\n Array.from(this.el.childNodes).forEach(node => {\n if (node.nodeType === Node.TEXT_NODE) {\n text += node.textContent?.trim() \|\| '';\n }\n });\n return text \|\| this.value \|\| '';\n }\n\n private hasMatchingChildren(): boolean {\n if (!this.hasChildren) return false;\n\n const childOptions = Array.from(this.el.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION') as HTMLElement[];\n\n return childOptions.some(child => {\n const childInstance = (child as any)['__stencil_instance'];\n if (!childInstance) return false;\n\n const childText = childInstance.getTextContent().toLowerCase();\n const childMatches = childText.includes(this.searchTerm);\n const grandChildrenMatch = childInstance.hasMatchingChildren();\n\n return childMatches \|\| grandChildrenMatch;\n });\n }\n\n private hasMatchingParent(): boolean {\n let parent = this.el.parentElement;\n while (parent && parent.tagName === 'IFX-MULTISELECT-OPTION') {\n const parentInstance = (parent as any)['__stencil_instance'];\n if (parentInstance) {\n const parentText = parentInstance.getTextContent().toLowerCase();\n if (parentText.includes(this.searchTerm)) {\n return true;\n }\n }\n parent = parent.parentElement;\n }\n return false;\n }\n\n private calculateDepth(): number {\n let depth = 0;\n let parent = this.el.parentElement;\n while (parent && parent.tagName !== 'IFX-MULTISELECT') {\n if (parent.tagName === 'IFX-MULTISELECT-OPTION') {\n depth++;\n }\n parent = parent.parentElement;\n }\n return depth;\n }\n\n @Listen('click')\n handleClick(event: Event) {\n if (this.disabled \|\| (this.isSearchActive && this.isSearchDisabled)) return;\n\n event.stopPropagation();\n\n if (event.type === 'click' && (event.target as HTMLElement).closest('.chevron-wrapper')) {\n this.toggleExpansion();\n return;\n }\n\n let newSelectedState: boolean;\n\n if (this.indeterminate) {\n newSelectedState = true;\n } else {\n newSelectedState = !this.selected;\n }\n\n this.selected = newSelectedState;\n this.indeterminate = false;\n\n if (this.hasChildren) {\n this.isExpanded = newSelectedState;\n\n requestAnimationFrame(() => {\n this.selectAllChildren(newSelectedState);\n this.expandAllChildren(newSelectedState);\n });\n }\n\n this.updateParentStates();\n this.notifyMultiselect();\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n if (this.disabled \|\| (this.isSearchActive && this.isSearchDisabled)) return;\n\n const target = event.target as HTMLElement;\n\n if (target.closest('.chevron-wrapper') \|\| target.closest('.checkbox-wrapper')) {\n return;\n }\n\n if (event.key !== 'ArrowUp' && event.key !== 'ArrowDown') {\n event.stopPropagation();\n }\n\n if (event.key === 'ArrowRight' && this.hasChildren) {\n this.isExpanded = true;\n }\n\n if (event.key === 'ArrowLeft' && this.hasChildren) {\n this.isExpanded = false;\n }\n }\n\n private notifyMultiselect() {\n const updateEvent = new CustomEvent('ifx-option-changed', {\n bubbles: true,\n detail: {\n value: this.value,\n selected: this.selected,\n indeterminate: this.indeterminate\n }\n });\n this.el.dispatchEvent(updateEvent);\n }\n\n private selectAllChildren(selected: boolean) {\n const directChildren = Array.from(this.el.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION') as any[];\n\n directChildren.forEach((child: any) => {\n const childInstance = child['__stencil_instance'];\n if (childInstance) {\n childInstance.selected = selected;\n childInstance.indeterminate = false;\n\n if (childInstance.hasChildren) {\n childInstance.isExpanded = selected;\n childInstance.selectAllChildren(selected);\n }\n childInstance.notifyMultiselect?.();\n }\n });\n }\n\n private expandAllChildren(expanded: boolean) {\n const directChildren = Array.from(this.el.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION') as any[];\n\n directChildren.forEach((child: any) => {\n const childInstance = child['__stencil_instance'];\n if (childInstance && childInstance.hasChildren) {\n childInstance.isExpanded = expanded;\n childInstance.expandAllChildren(expanded);\n }\n });\n }\n\n private updateParentStates() {\n let parent = this.el.parentElement;\n while (parent && parent.tagName === 'IFX-MULTISELECT-OPTION') {\n const parentInstance = (parent as any)['__stencil_instance'];\n if (!parentInstance) {\n parent = parent.parentElement;\n continue;\n }\n\n const siblings = Array.from(parent.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION')\n .map(child => (child as any)['__stencil_instance'])\n .filter(instance => instance !== null);\n\n const selectedCount = siblings.filter(sibling => sibling.selected).length;\n const indeterminateCount = siblings.filter(sibling => sibling.indeterminate).length;\n const totalCount = siblings.length;\n\n if (selectedCount === totalCount && indeterminateCount === 0) {\n parentInstance.selected = true;\n parentInstance.indeterminate = false;\n } else if (selectedCount === 0 && indeterminateCount === 0) {\n parentInstance.selected = false;\n parentInstance.indeterminate = false;\n } else {\n parentInstance.selected = false;\n parentInstance.indeterminate = true;\n }\n\n parentInstance.notifyMultiselect?.();\n parent = parent.parentElement;\n }\n }\n\n private toggleExpansion() {\n this.isExpanded = !this.isExpanded;\n }\n\n private handleCheckboxClick = (event: Event) => {\n if (this.disabled \|\| (this.isSearchActive && this.isSearchDisabled)) return;\n\n event.stopPropagation();\n\n let newSelectedState: boolean;\n\n if (this.indeterminate) {\n newSelectedState = true;\n } else {\n newSelectedState = !this.selected;\n }\n\n this.selected = newSelectedState;\n this.indeterminate = false;\n\n if (this.hasChildren) {\n this.isExpanded = newSelectedState;\n\n requestAnimationFrame(() => {\n this.selectAllChildren(newSelectedState);\n this.expandAllChildren(newSelectedState);\n });\n }\n\n this.updateParentStates();\n this.notifyMultiselect();\n }\n\n private handleHeaderClick = (event: Event) => {\n event.stopPropagation();\n if (!this.disabled && !(this.isSearchActive && this.isSearchDisabled)) {\n this.handleClick(event);\n }\n }\n\n private hasAnySelectedChildren(): boolean {\n const childOptions = Array.from(this.el.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION') as HTMLElement[];\n\n return childOptions.some(child => {\n const hasSelected = child.hasAttribute('selected');\n const hasSelectedDescendants = this.checkForSelectedDescendants(child);\n\n return hasSelected \|\| hasSelectedDescendants;\n });\n }\n\n private checkForSelectedDescendants(element: HTMLElement): boolean {\n const nestedOptions = Array.from(element.children)\n .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION') as HTMLElement[];\n\n return nestedOptions.some(nestedChild => {\n const isSelected = nestedChild.hasAttribute('selected');\n const hasSelectedNested = this.checkForSelectedDescendants(nestedChild);\n\n return isSelected \|\| hasSelectedNested;\n });\n }\n\n render() {\n let isFlatMultiselect = false;\n const parentMultiselect = this.el.closest('ifx-multiselect');\n if (parentMultiselect) {\n const allOptions = Array.from(parentMultiselect.querySelectorAll('ifx-multiselect-option'));\n isFlatMultiselect = allOptions.every(option => option.children.length === 0);\n }\n\n const basePadding = this.depth * 28 + 16;\n const additionalPadding = this.hasChildren ? 0 : 28;\n let totalPadding = basePadding + additionalPadding;\n\n const optionItemStyle = isFlatMultiselect ? undefined : { paddingLeft: `${totalPadding}px` };\n\n return (\n <Host>\n <div\n class={{\n 'option': true,\n 'option--has-children': this.hasChildren,\n 'option--expanded': this.isExpanded,\n 'option--disabled': this.disabled,\n 'option--selected': this.selected,\n }}\n role=\"option\"\n aria-expanded={this.hasChildren ? (this.isExpanded ? 'true' : 'false') : undefined}\n aria-selected={this.selected ? 'true' : 'false'}\n aria-disabled={this.disabled ? 'true' : 'false'}\n data-level={this.depth}\n data-value={this.value}\n >\n <div\n class=\"option-item\"\n style={optionItemStyle}\n >\n <div\n class=\"chevron-wrapper\"\n tabIndex={this.hasChildren ? 0 : -1}\n role={this.hasChildren ? \"button\" : undefined}\n aria-label={this.hasChildren ? (this.isExpanded ? \"Collapse\" : \"Expand\") : undefined}\n onClick={(e) => { e.stopPropagation(); this.toggleExpansion(); }}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n e.stopPropagation();\n this.toggleExpansion();\n }\n }}\n >\n {this.hasChildren && (\n <ifx-icon\n class={`chevron ${this.isExpanded ? 'chevron--expanded' : 'chevron--collapsed'}`}\n icon=\"chevron-right-16\"\n />\n )}\n </div>\n\n <div class=\"checkbox-wrapper\" onClick={(e) => e.stopPropagation()}>\n <ifx-checkbox\n size='s'\n checked={(this.isSearchActive && this.isSearchDisabled) ? false : (this.indeterminate ? false : this.selected)}\n indeterminate={(this.isSearchActive && this.isSearchDisabled) ? false : this.indeterminate}\n onClick={this.handleCheckboxClick}\n disabled={this.disabled \|\| (this.isSearchActive && this.isSearchDisabled)}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n e.stopPropagation();\n this.handleCheckboxClick(e);\n }\n }}\n />\n </div>\n\n <div\n class=\"option-label\"\n onClick={this.handleHeaderClick}\n tabIndex={-1}\n >\n <slot/>\n </div>\n </div>\n\n {this.isExpanded && <div class=\"option-children\"><slot name=\"children\"/></div>}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/{p-b56aae98.js → p-fa8735da.js} RENAMED Viewed

@@ -65,12 +65,12 @@ const TextField = /*@__PURE__*/ proxyCustomElement(class TextField extends H {
         }
     }
     render() {
-        return (h("div", { key: 'a1a791d34651ec8730e2bf22cc5cee00a31a2fe1', "aria-label": "a text field for user input", "aria-value": this.value, "aria-disabled": this.disabled, class: `textInput__container ${this.disabled ? 'disabled' : ""}` }, h("div", { key: '3292d42833b893180b20004ac737f6eb0a35a597', class: "textInput__top-wrapper" }, h("label", { key: '501b3ee4e4dc6fc77f27aa15c3c2a0e651f0bd46', htmlFor: this.internalId }, h("slot", { key: 'f5ed741edfec81477081e637fc4ddc91e4c3ea33' }), this.optional && this.required ? (h("span", { class: "optional-required" }, "(optional) *")) : this.optional ? (h("span", { class: "optional" }, "(optional)")) : this.required ? (h("span", { class: `required ${this.error ? 'error' : ""}` }, "*")) : null)), h("div", { key: 'de64c03a946f67819b852651fa0ce25794665b52', class: "textInput__bottom-wrapper" }, h("div", { key: '357e7f12d0295ab0b8908361c955cf93cf3150ab', class: "input-container" }, this.icon && (h("ifx-icon", { key: '075064b23c293f407585716575aaabc1430ff1ab', class: 'input-icon', icon: this.icon })), h("input", { key: '3e287bf7ce34d5ba8fb2676e2ccc119ad92ae177', ref: (el) => (this.inputElement = el), disabled: this.disabled, autocomplete: this.autocomplete, type: this.internalType, id: this.internalId, value: this.value, onInput: () => this.handleInput(), placeholder: this.placeholder, maxlength: this.maxlength, class: `${this.icon ? 'icon' : ""}
+        return (h("div", { key: 'eb43a6d13d3c5a1b8dd83431d9cb2ff5dc3e6ed0', "aria-label": "a text field for user input", "aria-value": this.value, "aria-disabled": this.disabled, class: `textInput__container ${this.disabled ? 'disabled' : ""}` }, h("div", { key: 'dbab2baa66620a5e35ce0a6e420177d2d824889d', class: "textInput__top-wrapper" }, h("label", { key: 'e651d3d01bd6178f5e6f6274191057e2ea7c4c3d', htmlFor: this.internalId }, h("slot", { key: '8e19106cd1033f8655101c07b18b443df88cded3' }), this.optional && this.required ? (h("span", { class: "optional-required" }, "(optional) *")) : this.optional ? (h("span", { class: "optional" }, "(optional)")) : this.required ? (h("span", { class: `required ${this.error ? 'error' : ""}` }, "*")) : null)), h("div", { key: 'aa5de9988a8134792b5da884a65ef2659089788e', class: "textInput__bottom-wrapper" }, h("div", { key: 'e6fb7025e637c0ee6608b3734df6c8dae444a017', class: "input-container" }, this.icon && (h("ifx-icon", { key: '3fe591fd59434633ae1466613baa2def56a7268d', class: 'input-icon', icon: this.icon })), h("input", { key: '093626ea0e15f92ca55b517605ff04248f07e2aa', ref: (el) => (this.inputElement = el), disabled: this.disabled, autocomplete: this.autocomplete, type: this.internalType, id: this.internalId, value: this.value, onInput: () => this.handleInput(), placeholder: this.placeholder, maxlength: this.maxlength, class: `${this.icon ? 'icon' : ""}
                 ${this.error ? 'error' : ""}
               ${this.size === "s" ? "input-s" : ""}
-              ${this.success ? "success" : ""}` }), (this.showDeleteIcon && this.value) && (h("ifx-icon", { key: 'a1651bb96f79860a1e409e78fb3b2a031fe55b2d', class: "delete-icon", icon: "cRemove16", onClick: () => this.handleDeleteContent() }))), this.caption && !this.error &&
-            h("div", { key: '2a9da68228cec89376babc9276a287228dc9d593', class: `textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""` }, this.caption), this.error &&
-            h("div", { key: '7057aa1d1f5cef589197360c000f543caff8a2eb', class: "textInput__bottom-wrapper-caption error" }, this.caption))));
+              ${this.success ? "success" : ""}` }), (this.showDeleteIcon && this.value) && (h("ifx-icon", { key: '4dd889a2de7060403eea5b1d57d3cd87af1643b8', class: "delete-icon", icon: "cRemove16", onClick: () => this.handleDeleteContent() }))), this.caption && !this.error &&
+            h("div", { key: 'a98a495f5e5b34c60f2b842bd5100d478927f25b', class: `textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""` }, this.caption), this.error &&
+            h("div", { key: '5d6088d0b6938c9cd4875ffd1c72c9c717b91f3a', class: "textInput__bottom-wrapper-caption error" }, this.caption))));
     }
     static get formAssociated() { return true; }
     get el() { return this; }
@@ -121,4 +121,4 @@ function defineCustomElement() {
 export { TextField as T, defineCustomElement as d };
-//# sourceMappingURL=p-b56aae98.js.map
+//# sourceMappingURL=p-fa8735da.js.map

package/dist/components/{p-b56aae98.js.map → p-fa8735da.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-b56aae98.js","mappings":"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","names":[],"sources":["src/components/text-field/text-field.scss?tag=ifx-text-field&encapsulation=shadow","src/components/text-field/text-field.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: flex;\n}\n\n.textInput__container {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 0px;\n width: 100%;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n\n &.disabled {\n & .textInput__top-wrapper {\n & label {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n & .textInput__bottom-wrapper {\n input {\n border: 1px solid tokens.$ifxColorEngineering500;\n background-color: tokens.$ifxColorEngineering200;\n\n &::placeholder {\n font-size: tokens.$ifxFontSizeS;\n color: tokens.$ifxColorEngineering500;\n }\n }\n }\n }\n\n & .textInput__top-wrapper {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n padding: 0px;\n gap: 4px;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n\n & label {\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n display: flex;\n align-items: center;\n color: tokens.$ifxColorBaseBlack;\n flex: none;\n order: 0;\n flex-grow: 0;\n\n & .optional-required {\n margin-left: 4px;\n }\n\n & .optional {\n margin-left: 4px;\n }\n\n & .required {\n margin-left: 4px;\n \n &.error {\n color: #CD002F;\n }\n }\n }\n }\n\n .input-container {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n }\n\n\n & .textInput__bottom-wrapper {\n flex-grow: 1;\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 0px;\n gap: 4px;\n flex: none;\n order: 1;\n align-self: stretch;\n flex-grow: 0;\n\n & input {\n width: 100%;\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n gap: tokens.$ifxSpace100;\n height: tokens.$ifxSize500;\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorBaseBlack;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n border: 1px solid tokens.$ifxColorEngineering400;\n border-radius: tokens.$ifxBorderRadius12;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n text-overflow: ellipsis;\n\n &.input-s {\n height: tokens.$ifxSize450;\n font-size: tokens.$ifxFontSizeS;\n line-height: tokens.$ifxLineHeightS;\n\n &::placeholder {\n font-size: tokens.$ifxFontSizeS;\n line-height: tokens.$ifxLineHeightS;\n }\n\n }\n\n &.icon {\n padding-left: tokens.$ifxSpace500;\n }\n\n &.error {\n border: 1px solid #CD002F;\n\n &:focus {\n outline: none;\n }\n }\n\n &.success {\n border: 1px solid #4CA460;\n\n &:focus {\n outline: none;\n }\n }\n\n\n &:focus:not(.error, .success) {\n outline: none;\n border: 1px solid tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border: 1px solid tokens.$ifxColorEngineering500;\n }\n\n &::placeholder {\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n color: #8D8786;\n flex: none;\n order: 1;\n flex-grow: 1;\n }\n }\n\n & .input-icon {\n // Position the icon within the icon container\n // Adjust the positioning as needed\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n left: tokens.$ifxSpace200;\n /* Adjust this value to control the icon's left offset /\n transition: .3s;\n color: tokens.$ifxColorEngineering400;\n }\n\n & .textInput__bottom-wrapper-caption {\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeXs;\n line-height: tokens.$ifxLineHeightXs;\n letter-spacing: 0.2px;\n color: tokens.$ifxColorBaseBlack;\n flex: none;\n order: 1;\n align-self: stretch;\n flex-grow: 0;\n\n &.error {\n color: #CD002F;\n\n }\n\n &.disabled {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n \n }\n .delete-icon {\n position: absolute;\n right: tokens.$ifxSpace200;\n\n :hover {\n cursor: pointer;\n }\n }\n}","import { Component, h, Event, Element, Prop, EventEmitter, Watch, Method, AttachInternals, State } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking'; \nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n tag: 'ifx-text-field',\n styleUrl: 'text-field.scss',\n shadow: true,\n formAssociated: true\n})\n\nexport class TextField {\n private inputElement: HTMLInputElement;\n @Element() el;\n @Prop() placeholder: string = \"Placeholder\"\n @Prop({ mutable: true }) value: string = '';\n @Prop() error: boolean = false;\n @Prop() label: string = \"\";\n @Prop() icon: string = \"\";\n @Prop() caption: string = \"\";\n @Prop() size: string = 'm';\n @Prop() required: boolean = false;\n @Prop() optional: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() maxlength?: number;\n @Prop() showDeleteIcon: boolean = false;\n @Prop() autocomplete: string = 'on'\n @Prop() type: 'text' \| 'password' = 'text';\n @Prop() internalId: string = \"text-field\"\n @State() internalType: string;\n @Event() ifxInput: EventEmitter<String>;\n // @Prop({ reflect: true })\n // resetOnSubmit: boolean = false;\n\n @AttachInternals() internals: ElementInternals;\n\n\n @Watch('value')\n valueWatcher(newValue: string) {\n if (newValue !== this.inputElement.value) {\n this.inputElement.value = newValue;\n }\n }\n\n @Method()\n async reset() {\n this.value = '';\n this.inputElement.value = '';\n }\n\n handleDeleteContent() {\n this.reset();\n this.ifxInput.emit(this.value);\n }\n\n handleInput() {\n const query = this.inputElement.value;\n this.value = query; // update the value property when input changes\n this.internals.setFormValue(query) // update form value\n this.ifxInput.emit(this.value);\n }\n\n handleTypeProp() { \n this.internalType = this.type === 'text' \|\| this.type === 'password' ? this.type : 'text'\n }\n\n formResetCallback() {\n this.internals.setValidity({});\n this.internals.setFormValue(\"\");\n }\n\n componentWillLoad() { \n this.handleTypeProp()\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-text-field', await framework)\n }\n }\n\n render() {\n return (\n <div aria-label=\"a text field for user input\" aria-value={this.value} aria-disabled={this.disabled} class={`textInput__container ${this.disabled ? 'disabled' : \"\"}`}>\n <div class=\"textInput__top-wrapper\">\n <label htmlFor={this.internalId}>\n <slot></slot>\n {this.optional && this.required ? (\n <span class=\"optional-required\">(optional) </span>\n ) : this.optional ? (\n <span class=\"optional\">(optional)</span>\n ) : this.required ? (\n <span class={`required ${this.error ? 'error' : \"\"}`}>*</span>\n ) : null}\n </label>\n </div>\n\n <div class=\"textInput__bottom-wrapper\">\n <div class=\"input-container\">\n {this.icon && (\n <ifx-icon class='input-icon' icon={this.icon} />\n )}\n <input\n ref={(el) => (this.inputElement = el)}\n disabled={this.disabled}\n autocomplete={this.autocomplete}\n type={this.internalType}\n id={this.internalId}\n value={this.value}\n onInput={() => this.handleInput()}\n placeholder={this.placeholder}\n maxlength={this.maxlength}\n class={\n `${this.icon ? 'icon' : \"\"}\n ${this.error ? 'error' : \"\"} \n ${this.size === \"s\" ? \"input-s\" : \"\"}\n ${this.success ? \"success\" : \"\"}`} />\n\n { (this.showDeleteIcon && this.value) && (\n <ifx-icon class=\"delete-icon\" icon=\"cRemove16\" onClick={() => this.handleDeleteContent()}></ifx-icon> \n )}\n </div>\n {this.caption && !this.error &&\n <div class={`textInput__bottom-wrapper-caption ${this.disabled} ? disabled : \"\"`}>\n {this.caption}\n </div>}\n {this.error &&\n <div class=\"textInput__bottom-wrapper-caption error\">\n {this.caption}\n </div>}\n </div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"p-fa8735da.js","mappings":"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","names":[],"sources":["src/components/text-field/text-field.scss?tag=ifx-text-field&encapsulation=shadow","src/components/text-field/text-field.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: flex;\n}\n\n.textInput__container {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 0px;\n width: 100%;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n\n &.disabled {\n & .textInput__top-wrapper {\n & label {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n & .textInput__bottom-wrapper {\n input {\n border: 1px solid tokens.$ifxColorEngineering500;\n background-color: tokens.$ifxColorEngineering200;\n\n &::placeholder {\n font-size: tokens.$ifxFontSizeS;\n color: tokens.$ifxColorEngineering500;\n }\n }\n }\n }\n\n & .textInput__top-wrapper {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n padding: 0px;\n gap: 4px;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n\n & label {\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n display: flex;\n align-items: center;\n color: tokens.$ifxColorBaseBlack;\n flex: none;\n order: 0;\n flex-grow: 0;\n\n & .optional-required {\n margin-left: 4px;\n }\n\n & .optional {\n margin-left: 4px;\n }\n\n & .required {\n margin-left: 4px;\n \n &.error {\n color: #CD002F;\n }\n }\n }\n }\n\n .input-container {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n }\n\n\n & .textInput__bottom-wrapper {\n flex-grow: 1;\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 0px;\n gap: 4px;\n flex: none;\n order: 1;\n align-self: stretch;\n flex-grow: 0;\n\n & input {\n width: 100%;\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n gap: tokens.$ifxSpace100;\n height: tokens.$ifxSize500;\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorBaseBlack;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n border: 1px solid tokens.$ifxColorEngineering400;\n border-radius: tokens.$ifxBorderRadius12;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n text-overflow: ellipsis;\n\n &.input-s {\n height: tokens.$ifxSize450;\n font-size: tokens.$ifxFontSizeS;\n line-height: tokens.$ifxLineHeightS;\n\n &::placeholder {\n font-size: tokens.$ifxFontSizeS;\n line-height: tokens.$ifxLineHeightS;\n }\n\n }\n\n &.icon {\n padding-left: tokens.$ifxSpace500;\n }\n\n &.error {\n border: 1px solid #CD002F;\n\n &:focus {\n outline: none;\n }\n }\n\n &.success {\n border: 1px solid #4CA460;\n\n &:focus {\n outline: none;\n }\n }\n\n\n &:focus:not(.error, .success) {\n outline: none;\n border: 1px solid tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border: 1px solid tokens.$ifxColorEngineering500;\n }\n\n &::placeholder {\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n color: #8D8786;\n flex: none;\n order: 1;\n flex-grow: 1;\n }\n }\n\n & .input-icon {\n // Position the icon within the icon container\n // Adjust the positioning as needed\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n left: tokens.$ifxSpace200;\n /* Adjust this value to control the icon's left offset /\n transition: .3s;\n color: tokens.$ifxColorEngineering400;\n }\n\n & .textInput__bottom-wrapper-caption {\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeXs;\n line-height: tokens.$ifxLineHeightXs;\n letter-spacing: 0.2px;\n color: tokens.$ifxColorBaseBlack;\n flex: none;\n order: 1;\n align-self: stretch;\n flex-grow: 0;\n\n &.error {\n color: #CD002F;\n\n }\n\n &.disabled {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n \n }\n .delete-icon {\n position: absolute;\n right: tokens.$ifxSpace200;\n\n :hover {\n cursor: pointer;\n }\n }\n}","import { Component, h, Event, Element, Prop, EventEmitter, Watch, Method, AttachInternals, State } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking'; \nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n tag: 'ifx-text-field',\n styleUrl: 'text-field.scss',\n shadow: true,\n formAssociated: true\n})\n\nexport class TextField {\n private inputElement: HTMLInputElement;\n @Element() el;\n @Prop() placeholder: string = \"Placeholder\"\n @Prop({ mutable: true }) value: string = '';\n @Prop() error: boolean = false;\n @Prop() label: string = \"\";\n @Prop() icon: string = \"\";\n @Prop() caption: string = \"\";\n @Prop() size: string = 'm';\n @Prop() required: boolean = false;\n @Prop() optional: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() maxlength?: number;\n @Prop() showDeleteIcon: boolean = false;\n @Prop() autocomplete: string = 'on'\n @Prop() type: 'text' \| 'password' = 'text';\n @Prop() internalId: string = \"text-field\"\n @State() internalType: string;\n @Event() ifxInput: EventEmitter<String>;\n // @Prop({ reflect: true })\n // resetOnSubmit: boolean = false;\n\n @AttachInternals() internals: ElementInternals;\n\n\n @Watch('value')\n valueWatcher(newValue: string) {\n if (newValue !== this.inputElement.value) {\n this.inputElement.value = newValue;\n }\n }\n\n @Method()\n async reset() {\n this.value = '';\n this.inputElement.value = '';\n }\n\n handleDeleteContent() {\n this.reset();\n this.ifxInput.emit(this.value);\n }\n\n handleInput() {\n const query = this.inputElement.value;\n this.value = query; // update the value property when input changes\n this.internals.setFormValue(query) // update form value\n this.ifxInput.emit(this.value);\n }\n\n handleTypeProp() { \n this.internalType = this.type === 'text' \|\| this.type === 'password' ? this.type : 'text'\n }\n\n formResetCallback() {\n this.internals.setValidity({});\n this.internals.setFormValue(\"\");\n }\n\n componentWillLoad() { \n this.handleTypeProp()\n }\n\n async componentDidLoad() { \n if(!isNestedInIfxComponent(this.el)) { \n const framework = detectFramework();\n trackComponent('ifx-text-field', await framework)\n }\n }\n\n render() {\n return (\n <div aria-label=\"a text field for user input\" aria-value={this.value} aria-disabled={this.disabled} class={`textInput__container ${this.disabled ? 'disabled' : \"\"}`}>\n <div class=\"textInput__top-wrapper\">\n <label htmlFor={this.internalId}>\n <slot></slot>\n {this.optional && this.required ? (\n <span class=\"optional-required\">(optional) </span>\n ) : this.optional ? (\n <span class=\"optional\">(optional)</span>\n ) : this.required ? (\n <span class={`required ${this.error ? 'error' : \"\"}`}>*</span>\n ) : null}\n </label>\n </div>\n\n <div class=\"textInput__bottom-wrapper\">\n <div class=\"input-container\">\n {this.icon && (\n <ifx-icon class='input-icon' icon={this.icon} />\n )}\n <input\n ref={(el) => (this.inputElement = el)}\n disabled={this.disabled}\n autocomplete={this.autocomplete}\n type={this.internalType}\n id={this.internalId}\n value={this.value}\n onInput={() => this.handleInput()}\n placeholder={this.placeholder}\n maxlength={this.maxlength}\n class={\n `${this.icon ? 'icon' : \"\"}\n ${this.error ? 'error' : \"\"} \n ${this.size === \"s\" ? \"input-s\" : \"\"}\n ${this.success ? \"success\" : \"\"}`} />\n\n { (this.showDeleteIcon && this.value) && (\n <ifx-icon class=\"delete-icon\" icon=\"cRemove16\" onClick={() => this.handleDeleteContent()}></ifx-icon> \n )}\n </div>\n {this.caption && !this.error &&\n <div class={`textInput__bottom-wrapper-caption ${this.disabled} ? disabled : \"\"`}>\n {this.caption}\n </div>}\n {this.error &&\n <div class=\"textInput__bottom-wrapper-caption error\">\n {this.caption}\n </div>}\n </div>\n </div>\n );\n }\n}\n"],"version":3}

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

@@ -182,7 +182,7 @@ const Template = class {
         }
     }
     render() {
-        return (h("div", { key: 'a6433871f9175e0616c40389d0a39a94797d67b3' }, this.isTemplatePage
+        return (h("div", { key: '1de8086432131979b1290ea28de6027cf52aa043' }, this.isTemplatePage
             ?
                 h("div", { class: "template__page-wrapper" }, !this.repoUrl && !this.repoError &&
                     h("div", null, h("h3", null, "Your repository is getting ready.."), h("p", null, "This will only take a minute.")), this.isLoading && !this.repoError && h("div", null, h("ifx-spinner", { variant: 'default', size: 's' })), this.repoUrl && h("ifx-link", { href: this.repoUrl, target: "_parent", size: "m", variant: "underlined" }, "Your repository"), this.repoError && h("div", null, this.repoError))

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

@@ -185,7 +185,7 @@ const Table = class {
         return {};
     }
     render() {
-        return (h(Host, { key: 'b0be2eaf2bf175887f3f2271cf2965b5a663b42a' }, h("div", { key: '400318fcaacf00f1b4cefce90b7763c14e7ab49d', id: "table-wrapper", class: this.getClassNames() }, h("div", { key: 'e4844ee2cf7179dc9566c0c7176250f51ab6cf54', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ""}`, style: this.getTableStyle(), ref: (el) => (this.container = el) }))));
+        return (h(Host, { key: '5968712e3cbe5605b5128dc19997941d18d21ffc' }, h("div", { key: '8a39d36f4006095de577777bb8c31f2ba3b9a2ee', id: "table-wrapper", class: this.getClassNames() }, h("div", { key: '8dd8dfaa472da2cd56ade80f5105cdbebeb8013b', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ""}`, style: this.getTableStyle(), ref: (el) => (this.container = el) }))));
     }
     get host() { return getElement(this); }
 };

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

@@ -8,7 +8,7 @@ const Faq = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h("div", { key: 'fa2142cca68e60417092d614cb11367974b407f3', class: 'container' }, h("ifx-accordion", { key: '3abf4ca4138b9b177c6c21dbcdf5b84452d8de34' }, h("ifx-accordion-item", { key: 'fe98e253e30e79d0adb3dc2a1aad25d0aeb64250', caption: "What is the Infineon DDS?" }, "The Infineon Digital Design System consists of code components, design principles, tools and guidelines as well as a dedicated interdisciplinary team. Its purpose is to support internal and external colleagues create digital user interfaces with a high level of usability as well as a consistent expression of the Infineon brand. The DDS does not focus on the content of a web application but it describes how the design of the application\u2019s structure should be."), h("ifx-accordion-item", { key: '6397a595ea17aeb437fabec2cc15bb56faade295', caption: "How do I get access to the DDS?" }, "You can use the provided Figma file as a foundation for mockups and prototypes, use Storybook to view what UI components and variants are available and use code components provided via Storybook or Github."), h("ifx-accordion-item", { key: '2429a303ad7938271651286232f8a1489d0df958', caption: "Can I integrate the Infineon DDS into my project?" }, "Yes, you can. We are happy to discuss with you which point in time and which scope of integration is bestsuited for updating your interface to the Infineon DDS. (To avoid that users get confused by a mixture of UI components, we recommend choosing larger updates or technology changes as opportunity to integrate the Infineon DDS.)"), h("ifx-accordion-item", { key: '2fc8ae1d8a7bb66bb99c09f25b7f25a329817a94', caption: "Are Infineon DDS components accessable?" }, "We have taken WCAG 2.0 Level AA as baseline level for all design decisions inside the Infineon Digital Design System. To make an online experience truly accessible you have to implement the specific code, content, and visual design according to the accessibility standard. Find an introduction to this topic here."), h("ifx-accordion-item", { key: '23c340c8cf0c8356a1dfd180050c1e92c7aadcec', caption: "How to request a new component?" }, "Please contact us like described in the contribution section! We are planning to expand the number of components continually. If your component is also usable for multiple other projects, there is a good chance we might work together with you."))));
+        return (h("div", { key: 'd65665af11d77f22eba694be830c0d2cbd1c2aed', class: 'container' }, h("ifx-accordion", { key: '21a6945e8e2989152d4ae3b525d0b03100289a53' }, h("ifx-accordion-item", { key: '6a17004a92a541a569d0a0fcfc99ab3b036e0321', caption: "What is the Infineon DDS?" }, "The Infineon Digital Design System consists of code components, design principles, tools and guidelines as well as a dedicated interdisciplinary team. Its purpose is to support internal and external colleagues create digital user interfaces with a high level of usability as well as a consistent expression of the Infineon brand. The DDS does not focus on the content of a web application but it describes how the design of the application\u2019s structure should be."), h("ifx-accordion-item", { key: '173ea57ea7fb62173945b1c8c804e2472f174f34', caption: "How do I get access to the DDS?" }, "You can use the provided Figma file as a foundation for mockups and prototypes, use Storybook to view what UI components and variants are available and use code components provided via Storybook or Github."), h("ifx-accordion-item", { key: '7344d949d820868fee6ab85b8197fdde1b4574c7', caption: "Can I integrate the Infineon DDS into my project?" }, "Yes, you can. We are happy to discuss with you which point in time and which scope of integration is bestsuited for updating your interface to the Infineon DDS. (To avoid that users get confused by a mixture of UI components, we recommend choosing larger updates or technology changes as opportunity to integrate the Infineon DDS.)"), h("ifx-accordion-item", { key: '6f242e7e3a4116bdf122905becd07fc8f8f4cd22', caption: "Are Infineon DDS components accessable?" }, "We have taken WCAG 2.0 Level AA as baseline level for all design decisions inside the Infineon Digital Design System. To make an online experience truly accessible you have to implement the specific code, content, and visual design according to the accessibility standard. Find an introduction to this topic here."), h("ifx-accordion-item", { key: '1dd2fe2389021540de4d1ded1f66003592644a1d', caption: "How to request a new component?" }, "Please contact us like described in the contribution section! We are planning to expand the number of components continually. If your component is also usable for multiple other projects, there is a good chance we might work together with you."))));
     }
 };
 Faq.style = IfxFaqStyle0;

package/dist/esm/ifx-filter-accordion.entry.js CHANGED Viewed

@@ -49,8 +49,8 @@ const FilterAccordion = class {
         this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);
     }
     render() {
-        return (h("div", { key: '558e64611cf0084dd56486b67b028978be06e279', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '1a367b0dedd7df65a29b0019768b89ddf60de767', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: 'f920f8151fb45340d509bdcc7c0f7581d09bf0b9', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '2e116feece138ad8c768c5da4bfd78992d5d3a23', class: "text" }, h("span", { key: '509dfead8b2d73932db222dcb20d98131834b6b6' }, this.filterGroupName), h("ifx-indicator", { key: '75bbde2dbd115e744db2a5cca0c2b362e67e0fb8', variant: 'number', number: this.count })), h("ifx-icon", { key: '0132b2973bc3c12bb296528a86af2adeab7868f8', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: 'a10114bfc855eab89923e29702014e894bb23788', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
-            h("div", { key: '235c0fdf9082d73a57dbff0ed468cf519a467c44', class: "filter-accordion-container" }, h("slot", { key: '129a804487fe1c42b35907a3d5288e65ad7dfa61', name: "list" }))));
+        return (h("div", { key: '3d0fd2cc850927fc6cc458867b049a582f47a0f5', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '0bc0dafdcfd874ae01fd7bb8446036ad34c07603', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: '5b8a0a61ca1b4b5c640933b7e81e6c5f3f406ba1', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '16e29f1f8ca7870e1e62cd5bcd56766a8a6ac512', class: "text" }, h("span", { key: '69687b082848bebb93647219eb8c1908b21d2c03' }, this.filterGroupName), h("ifx-indicator", { key: 'ede8211d6cee49e3a5af93e377b05863b324ab52', variant: 'number', number: this.count })), h("ifx-icon", { key: '27394e246008a8cefc69782b50885973cb548ce6', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: 'c517b29a5a66c8747a724af163ca761d3a7e11d9', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
+            h("div", { key: '289e7251b83c88a26445be01f22575c85c5689e3', class: "filter-accordion-container" }, h("slot", { key: 'd63dbb79d3676b8881afaa318b6d642563935baa', name: "list" }))));
     }
     get el() { return getElement(this); }
 };

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

@@ -93,7 +93,7 @@ const FilterBar = class {
         // Calculate slotsToShow safely
         const slotsToShow = Math.min(safeVisibleSlots, actualNumberOfComponents, Number.MAX_SAFE_INTEGER);
         const slots = Array.from({ length: slotsToShow }, (_, i) => (h("div", { class: "filter-slot-wrapper" }, h("slot", { name: `filter-component-${i + 1}` }))));
-        return (h(Host, { key: '883d2316936a342059ab9009149ac8ce2ed877b2' }, h("div", { key: '24e0f7e2dde9ff7ddccf19e03e075b24807ec9d4', class: "search-container" }, h("slot", { key: '10bcfd474cfd9286d3e57e19d110bea6311c4297', name: "filter-search" }), " "), h("div", { key: '3aa8a6c4fb666ff47c7868333c2c494d6cb7bd90', class: "components-container" }, slots.length > 0 ? slots : h("slot", { name: "filter-component" }), this.showMoreFiltersButton && !this.showAllFilters && (h("div", { key: '1b87cf569495c351b639bc88d714dd195bd943b0', class: "more-filters-wrapper", onClick: this.handleMoreFiltersClick }, h("ifx-button", { key: '9f8073be95597553d1aa4eaccd19fc534ce3f9c6', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false" }, h("ifx-icon", { key: '157558f67217a770963b16ca3f6b3a5cc8ed191c', icon: "filter-16" }), "More filters"))))));
+        return (h(Host, { key: '390d4edb8b2681c33017c1245d3b47c254086065' }, h("div", { key: '631db42c0db2e69c53a35a3a4878863215466783', class: "search-container" }, h("slot", { key: 'd3b7e942185a37da9af701ede28b22aabca08812', name: "filter-search" }), " "), h("div", { key: '599234808c4076a085f19bbe489a5a6746bfcda9', class: "components-container" }, slots.length > 0 ? slots : h("slot", { name: "filter-component" }), this.showMoreFiltersButton && !this.showAllFilters && (h("div", { key: '6ceade00712115f448158081ad7ec082d9c6c416', class: "more-filters-wrapper", onClick: this.handleMoreFiltersClick }, h("ifx-button", { key: 'd1dbd53565e30c526e75ceebff18ecaf9355997a', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false" }, h("ifx-icon", { key: '43ec4bbcd0ac7b76534aafe26af8b330627d2f32', icon: "filter-16" }), "More filters"))))));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/ifx-filter-search.entry.js CHANGED Viewed

@@ -29,7 +29,7 @@ const FilterSearch = class {
         this.ifxFilterSearchChange.emit({ filterName: this.filterName, filterValue: this.filterValue, filterKey: this.filterKey }); // Emitting filterKey along with other properties
     }
     render() {
-        return (h("div", { key: '0faa67e585464ac86a1163626e3d85340d4781fb', class: `${this.filterOrientation === 'sidebar' ? 'sidebar-filter-search-wrapper' : 'topbar-filter-search-wrapper'}` }, h("div", { key: '7bdb336d4e79fe38eee59f4e41ac44e62051b515', class: "filter-name" }, this.filterName), h("ifx-search-field", { key: '08613ab1e040959373722caffaee5dcf71b62add', placeholder: this.placeholder, "show-delete-icon": this.showDeleteIcon, disabled: this.disabled, value: this.filterValue })));
+        return (h("div", { key: '3e287efc07bf8225fe661ae9551c8cc2e980e622', class: `${this.filterOrientation === 'sidebar' ? 'sidebar-filter-search-wrapper' : 'topbar-filter-search-wrapper'}` }, h("div", { key: '3b9a27b4e94843db8109028fb6a3ba849c4cf206', class: "filter-name" }, this.filterName), h("ifx-search-field", { key: '62cd45208bfe565cc2f903c361ced6fa02499942', placeholder: this.placeholder, "show-delete-icon": this.showDeleteIcon, disabled: this.disabled, value: this.filterValue })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

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

@@ -125,7 +125,7 @@ const IfxFilterTypeGroup = class {
         window.removeEventListener('ifxResetFiltersEvent', this.handleResetEvent);
     }
     render() {
-        return (h(Host, { key: 'c9833666ea9bcb00708bd0dab1cd9680e08ed114' }, h("div", { key: '0ee50ec91a5f1c3bd35899082de4d8f53a40b23e', class: "filter-type-group" }, h("slot", { key: 'f7f4982f39e972d38fb937b88d02bec40513e78c', name: "filter-search" }), h("slot", { key: '25cc8aea032f31c64bd2b164b39af263cf8fb107', name: "filter-accordion" }))));
+        return (h(Host, { key: '1d0bf0c68fb42e0394e0aa9bb5e66660d3ef5cda' }, h("div", { key: '215cd4cb99b4200d6a37c73267658f5dea619fff', class: "filter-type-group" }, h("slot", { key: 'e3a96b1a72ae653d2bcd51faf9c3a297bc541de3', name: "filter-search" }), h("slot", { key: '828ff0797c6f7ae7b3d6a2b6b0cdbde982b95cb1', name: "filter-accordion" }))));
     }
     get el() { return getElement(this); }
 };

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

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

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

@@ -901,25 +901,25 @@ const MultiselectOption = class {
         const additionalPadding = this.hasChildren ? 0 : 28;
         let totalPadding = basePadding + additionalPadding;
         const optionItemStyle = isFlatMultiselect ? undefined : { paddingLeft: `${totalPadding}px` };
-        return (h(Host, { key: 'f836f58884e2e57c4c5fb4953f10d5ff4a34c8da' }, h("div", { key: '9eca6e87bb3c21512a051596b1e92931b707e88f', class: {
+        return (h(Host, { key: '53ab714e5bc86c83569b2c1cf6f479405f528880' }, h("div", { key: 'b5597349b4d3ef268b5826047f414dd7ce0c7854', class: {
                 'option': true,
                 'option--has-children': this.hasChildren,
                 'option--expanded': this.isExpanded,
                 'option--disabled': this.disabled,
                 'option--selected': this.selected,
-            }, role: "option", "aria-expanded": this.hasChildren ? (this.isExpanded ? 'true' : 'false') : undefined, "aria-selected": this.selected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "data-level": this.depth, "data-value": this.value }, h("div", { key: '41d24ef38470f5f7f8aa36daa33b339b7d8079f3', class: "option-item", style: optionItemStyle }, h("div", { key: '27d33336e7d15ccce1703429b70494fe86808214', class: "chevron-wrapper", tabIndex: this.hasChildren ? 0 : -1, role: this.hasChildren ? "button" : undefined, "aria-label": this.hasChildren ? (this.isExpanded ? "Collapse" : "Expand") : undefined, onClick: (e) => { e.stopPropagation(); this.toggleExpansion(); }, onKeyDown: (e) => {
+            }, role: "option", "aria-expanded": this.hasChildren ? (this.isExpanded ? 'true' : 'false') : undefined, "aria-selected": this.selected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "data-level": this.depth, "data-value": this.value }, h("div", { key: '3052a22b111e61ac0e48ecd64460c35aa2b06fea', class: "option-item", style: optionItemStyle }, h("div", { key: 'a392db43dbb81f06a4cfd4e5faad7672108bc4bb', class: "chevron-wrapper", tabIndex: this.hasChildren ? 0 : -1, role: this.hasChildren ? "button" : undefined, "aria-label": this.hasChildren ? (this.isExpanded ? "Collapse" : "Expand") : undefined, onClick: (e) => { e.stopPropagation(); this.toggleExpansion(); }, onKeyDown: (e) => {
                 if (e.key === 'Enter' || e.key === ' ') {
                     e.preventDefault();
                     e.stopPropagation();
                     this.toggleExpansion();
                 }
-            } }, this.hasChildren && (h("ifx-icon", { key: '68e975b49b4aa9edf564b80644c5a55809185629', class: `chevron ${this.isExpanded ? 'chevron--expanded' : 'chevron--collapsed'}`, icon: "chevron-right-16" }))), h("div", { key: 'f651aefe4cc30db6056331ffaafd8e6ea17039fc', class: "checkbox-wrapper", onClick: (e) => e.stopPropagation() }, h("ifx-checkbox", { key: 'e8cb2c7a75921a81e0321ff22718d9373cb6f437', size: 's', checked: (this.isSearchActive && this.isSearchDisabled) ? false : (this.indeterminate ? false : this.selected), indeterminate: (this.isSearchActive && this.isSearchDisabled) ? false : this.indeterminate, onClick: this.handleCheckboxClick, disabled: this.disabled || (this.isSearchActive && this.isSearchDisabled), onKeyDown: (e) => {
+            } }, this.hasChildren && (h("ifx-icon", { key: '033471dbc46d73d82f0ab44a07a1dfa5fd9625fb', class: `chevron ${this.isExpanded ? 'chevron--expanded' : 'chevron--collapsed'}`, icon: "chevron-right-16" }))), h("div", { key: 'd6fc07097a390e9e29f8c4dcc55c90f755b10fc9', class: "checkbox-wrapper", onClick: (e) => e.stopPropagation() }, h("ifx-checkbox", { key: '7d39f30d45c2f917edd924b3b8ce6c22f4146c19', size: 's', checked: (this.isSearchActive && this.isSearchDisabled) ? false : (this.indeterminate ? false : this.selected), indeterminate: (this.isSearchActive && this.isSearchDisabled) ? false : this.indeterminate, onClick: this.handleCheckboxClick, disabled: this.disabled || (this.isSearchActive && this.isSearchDisabled), onKeyDown: (e) => {
                 if (e.key === 'Enter' || e.key === ' ') {
                     e.preventDefault();
                     e.stopPropagation();
                     this.handleCheckboxClick(e);
                 }
-            } })), h("div", { key: '4f626380753927d4bedca0f78643e6647eff6356', class: "option-label", onClick: this.handleHeaderClick, tabIndex: -1 }, h("slot", { key: '8207d9f952bff231fda0bf0be43e1c567aa6a6da' }))), this.isExpanded && h("div", { key: '930d611f27451ff393d1403386bb6cd6b4a54980', class: "option-children" }, h("slot", { key: '269eb6381257f82b74b888188646559e6881a9d9', name: "children" })))));
+            } })), h("div", { key: 'e09de6a2559a8334553abb9d45b901c1459a2da7', class: "option-label", onClick: this.handleHeaderClick, tabIndex: -1 }, h("slot", { key: '941edb6987ef6add787211833e0e1aad0d5b9066' }))), this.isExpanded && h("div", { key: 'b5248d64937e418587f1c807e434874be4952f48', class: "option-children" }, h("slot", { key: '8e6e69e5000661632c114279a5afc5c80f361b8e', name: "children" })))));
     }
     get el() { return getElement(this); }
 };