@infineon/infineon-design-system-stencil 37.14.1--canary.2005.99ac1d98777d6916e7e421ca72db2a9a0f407149.0 → 37.14.1--canary.2009.a1675c98d08311581a1733f9e5d2d89304b688e7.0

package/dist/infineon-design-system-stencil/p-262afd53.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["ButtonCellRenderer","init","params","this","createButton","getGui","eGui","refresh","updateButton","config","data","button","options","colDef","cellRendererParams","document","createElement","eButton","hasRequiredKeys","setButtonAttributes","appendChild","attachEventListener","innerHTML","detachEventListener","setAttribute","disabled","toString","variant","theme","type","size","fullWidth","target","href","textContent","text","eventListener","event","onButtonClick","addEventListener","removeEventListener","CustomNoRowsOverlay","noRowsMessageFunc","_params","CustomLoadingOverlay","tableCss","Table","constructor","hostRef","currentPage","rowData","colData","filterOptions","currentFilters","allRowData","rowHeight","tableHeight","pagination","paginationPageSize","filterOrientation","showSidebarFilters","matchingResultsCount","showLoading","originalRowData","internalItemsPerPage","JSON","stringify","value","label","selected","rowsChanged","_newVal","parsed","parseArrayInput","rows","length","updateTableView","updateFilterOptions","colsChanged","getColData","gridApi","setGridOption","sizeColumnsToFit","defaultMinWidth","handleResultsPerPageChange","e","Number","detail","handleChipChange","name","currentSelection","previousSelection","updatedFilters","Object","assign","customEvent","CustomEvent","filterName","bubbles","composed","host","dispatchEvent","filterValues","map","selection","applyAllFilters","onButtonRendererOptionsChanged","setColumnDefs","input","parse","Array","isArray","_a","console","error","toggleSidebarFilters","col","field","Set","row","handleSidebarFilterChange","filterGroups","forEach","filterGroup","filterGroupName","selectedItems","item","handleTopbarFilterChange","filters","filter","filterInfo","selectedValues","toLowerCase","textFilterMatched","property","hasOwnProperty","rowValue","String","some","filterValue","startsWith","includesUndefined","includes","startIndex","endIndex","visibleRowData","slice","clearAllFilters","onBtShowLoading","showLoadingOverlay","setPaginationItemsPerPage","newItemsPerPage","paginationItemsPerPage","itemsPerPageArray","selectedOption","find","option","componentWillLoad","uniqueKey","Math","floor","random","getRowData","gridOptions","headerHeight","defaultColDef","resizable","suppressDragLeaveHidesColumns","enableCellTextSelection","onFirstDataRendered","bind","columnDefs","loadingOverlayComponent","noRowsOverlayComponent","noRowsOverlayComponentParams","icons","sortAscending","sortDescending","sortUnSort","rowDragManaged","dndSource","animateRows","componentDidRender","componentDidLoad","container","isNestedInIfxComponent","framework","detectFramework","trackComponent","createGrid","paginationElement","shadowRoot","querySelector","handlePageChange","sidebarFilterElements","querySelectorAll","sidebarFilterElement","topbarFilterElements","topbarFilterElement","componentWillUnmount","sidebarFilters","sidebarFilter","topbarFilters","topbarFilter","isJSONParseable","str","undefined","cols","buttonColumn","column","cellRenderer","valueFormatter","buttonRendererOptions","api","handleResetButtonClick","resetEvent","window","disconnectedCallback","resetButton","getTableClassNames","classNames","render","style","height","filterClass","h","Host","key","class","onClick","icon","keys","isMultiSelect","placeholder","readOnly","id","ref","el","total","hasButtonCol","onDragOver","dragSupported","dataTransfer","dropEffect","preventDefault","onDrop","jsonData","getData","eJsonRow","classList","add","innerText","eJsonDisplay"],"sources":["src/components/table-advanced-version/buttonCellRenderer.ts","src/components/table-advanced-version/customNoRowsOverlay.ts","src/components/table-advanced-version/customLoadingOverlay.ts","src/components/table-advanced-version/table.scss?tag=ifx-table&encapsulation=shadow","src/components/table-advanced-version/table.tsx"],"sourcesContent":["import { ICellRendererComp, ICellRendererParams } from 'ag-grid-community';\nimport { ButtonInterface } from './interfaces';\n\nexport class ButtonCellRenderer implements ICellRendererComp {\n  eGui!: HTMLDivElement;\n  eButton!: HTMLElement;  // Change to a generic HTMLElement to accommodate custom elements\n  eventListener!: (event: Event) => void;\n\n  init(params: ICellRendererParams) {\n    this.createButton(params);\n  }\n\n  getGui() {\n    return this.eGui;\n  }\n\n  refresh(params: ICellRendererParams) {\n    this.updateButton(params);\n    return true;\n  }\n\n  private createButton(params: ICellRendererParams) {\n    const config = params.data.button;\n    const options = params.colDef.cellRendererParams || {};\n    \n    this.eGui = document.createElement('div');\n    this.eButton = document.createElement('ifx-button') as HTMLElement;\n    \n    if (this.hasRequiredKeys(config)) {\n      this.setButtonAttributes(config);\n      this.eGui.appendChild(this.eButton);\n      this.attachEventListener(options, params);\n    } else {\n      this.eGui.innerHTML = `<span>${config}</span>`;\n    }\n  }\n\n  private updateButton(params: ICellRendererParams) {\n    const config = params.data.button;\n    const options = params.colDef.cellRendererParams || {};\n    \n    if (this.hasRequiredKeys(config)) {\n      this.setButtonAttributes(config);\n      this.detachEventListener();\n      this.attachEventListener(options, params);\n    } else {\n      this.eGui.innerHTML = `<span>${config}</span>`;\n    }\n  }\n\n  private setButtonAttributes(config: ButtonInterface) {\n    this.eButton.setAttribute('disabled', config.disabled.toString());\n    this.eButton.setAttribute('variant', config.variant);\n    this.eButton.setAttribute('theme', config.theme);\n    this.eButton.setAttribute('type', config.type);\n    this.eButton.setAttribute('size', config.size);\n    this.eButton.setAttribute('full-width', config.fullWidth.toString());\n    this.eButton.setAttribute('target', config.target);\n    this.eButton.setAttribute('href', config.href);\n    this.eButton.textContent = config.text;\n  }\n\n  private attachEventListener(options: any, params: ICellRendererParams) {\n    this.eventListener = (event: Event) => {\n      if (options.onButtonClick) {\n        options.onButtonClick(params, event);\n      }\n    };\n    this.eButton.addEventListener('click', this.eventListener);\n  }\n\n  private detachEventListener() {\n    if (this.eventListener) {\n      this.eButton.removeEventListener('click', this.eventListener);\n    }\n  }\n\n  private hasRequiredKeys(config: ButtonInterface): boolean {\n    return config && config.text !== '' && config.variant !== '' && config.size !== '' && config.type !== '';\n  }\n}\n","import { ICellRendererComp, ICellRendererParams } from 'ag-grid-community';\n\nexport class CustomNoRowsOverlay implements ICellRendererComp {\n  eGui!: HTMLElement;\n\n  init(params: ICellRendererParams & { noRowsMessageFunc: () => string }) {\n    this.eGui = document.createElement('div');\n    this.eGui.innerHTML = `\n            <div role=\"presentation\" class=\"ag-overlay-loading-center\" >\n               ${params.noRowsMessageFunc()}\n            </div>\n        `;\n  }\n\n  getGui() {\n    return this.eGui;\n  }\n\n  refresh(_params: ICellRendererParams): boolean {\n    return false;\n  }\n}","import { ICellRendererComp, ICellRendererParams } from 'ag-grid-community';\n\nexport class CustomLoadingOverlay implements ICellRendererComp {\n  eGui!: HTMLElement;\n\n  init(_params: ICellRendererParams & { loadingMessage: string }) {\n    this.eGui = document.createElement('div');\n    this.eGui.innerHTML = `<div class=\"ag-overlay-loading-center\" role=\"presentation\">\n<ifx-spinner></ifx-spinner>\n            </div>`;\n  }\n\n  getGui() {\n    return this.eGui;\n  }\n\n  refresh(_params: ICellRendererParams): boolean {\n    return false;\n  }\n}","@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n@import \"~ag-grid-community/styles/ag-grid.css\";\n\n.zebra { \n  & .ag-row-odd { \n    background-color: tokens.$ifxColorEngineering100!important;\n  }\n\n  & .ag-row { \n    border-bottom: none!important;\n  }\n}\n\n.ag-header-viewport { \n  background-color: tokens.$ifxColorEngineering200!important;\n}\n\n\n.table-container {\n  display: block;\n}\n\n.sidebar-btn {\n  margin-bottom: 24px;\n}\n\n.sidebar-container {\n  margin-right: 24px;\n}\n\n.sidebar-layout {\n  display: flex;\n  flex-direction: row;\n}\n\n.topbar-layout {\n  display: flex;\n  flex-direction: column;\n}\n\n.table-pagination-wrapper {\n  display: flex;\n  flex-direction: column;\n  align-items: stretch; // stretches items to fill the container horizontally\n  width: 100%; // ensures the wrapper takes up the full width of its parent\n}\n\n#table-wrapper {\n  flex: 1; // allows the table to take up the remaining space\n  padding-bottom: tokens.$ifxSpace100;\n}\n\n\n.table-wrapper .ag-root-wrapper-body {\n  height: auto !important;\n  min-height: 100px !important;\n  min-width: 100px;\n}\n\n.filter-chips { \n  display:flex;\n  gap:tokens.$ifxSpace100;\n  margin-bottom: 12px;\n}\n\n.filter-chips > ifx-button { // ifx-button with icon and text has a paddingof 16 px. This is to remove the padding to align with the filter-chips container definition\n  margin-left: -8px;\n}\n\n.set-filter-wrapper-sidebar {\n  display: flex;\n  flex-direction: column;\n  margin-bottom: tokens.$ifxSpace100;\n}\n\n.set-filter-wrapper-topbar {\n  display: flex;\n  flex-wrap: wrap;\n  flex-direction: row;\n  margin-bottom: tokens.$ifxSpace100;\n  background: tokens.$ifxColorEngineering100;\n  padding-top: 32px;\n  padding-bottom: 32px;\n  gap: 24px;\n }\n\n\n.ifx-ag-grid {\n  display: grid;\n  height: 100%;\n  width: 100%;\n  min-width: 100px;\n  //padding-bottom: tokens.$ifxSpace100;\n}\n\n\n.ifx-ag-grid .ag-header-cell::after {\n  outline: none !important;\n  border: none !important;\n  box-shadow: none !important;\n}\n\n.ifx-ag-grid .ag-header-cell:focus {\n  outline: none !important;\n}\n\n.ifx-ag-grid *:not(.ag-header-cell):focus {\n  outline: none;\n}\n\n\n.ifx-ag-grid .ag-header-cell:not(:last-child)::before {\n  content: '';\n  position: absolute;\n  right: 0;\n  top: calc(50% - 12px);\n  height: 24px; \n  width: 1px;\n  background-color: tokens.$ifxColorEngineering300; \n}\n\n\n.ag-overlay-loading-center {\n  border: none;\n  background: none;\n  border-radius: none;\n  box-shadow: none;\n}\n\n\n.ag-root-wrapper {\n  border: 1px solid tokens.$ifxColorEngineering200;\n}\n\n\n\n.ag-header {\n  background-color: tokens.$ifxColorEngineering100;\n  border-bottom: none;\n\n  &.ag-header-active {\n    outline: none !important;\n    border-color: #0A8276 !important;\n  }\n}\n\n.ag-header-cell {\n  padding-left: 16px;\n  padding-right: 16px;\n  gap: 4px;\n}\n\n\n.ag-header-cell-focus {\n  border: none !important;\n  outline: none !important;\n}\n\n.ag-header-cell-text {\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 20px;\n  color: tokens.$ifxColorBaseBlack;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n}\n\n.ag-row-focus {\n  background-color: inherit !important;\n  /* Reset the hover color to the row's original color */\n}\n\n.ag-row-hover {\n  background-color: tokens.$ifxColorBaseWhite !important; //inherit !important;\n  /* Reset the hover color to the row's original color */\n}\n\n\n.ag-cell-focus {\n  border: none !important;\n  outline: none !important;\n  background-color: inherit !important;\n}\n\n\n\n.ag-row {\n  background-color: tokens.$ifxColorBaseWhite;\n  border-bottom: 1px solid tokens.$ifxColorEngineering200;\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  z-index: 1; //ensure the stacking order when used inside js frameworks\n}\n\n.ag-row-odd {\n  background-color: tokens.$ifxColorBaseWhite;\n}\n\n.ag-cell {\n  display: flex;\n  padding-left: 16px;\n  padding-right: 16px;\n  align-items: center;\n\n}\n\n.ag-ltr .ag-sort-indicator-icon {\n  padding-left: 0px;\n  vertical-align: bottom;\n  line-height: 12px;\n}\n\n.ag-sort-indicator-container .ag-sort-order { \n  display: none;\n}\n\n.unsort-icon-custom-color {\n  color: tokens.$ifxColorEngineering400;\n}\n\n\n// Table with set filters in sidebar orientation\n\n\n.filters-title {\n  font-size: 24px;\n  font-weight: 600;\n}\n\n\n.matching-results-container {\n  display: flex;\n  gap: 4px;\n  font-size: 14px;\n}\n\n.matching-results-count {\n  font-weight: 600;\n}\n\n.matching-results-text {\n  font-weight: 400;\n}","import { Component, h, Host, Method, Element, Prop, State, Listen, Watch } from '@stencil/core';\nimport classNames from 'classnames';\nimport { trackComponent } from '../../global/utils/tracking'; \nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport { createGrid, FirstDataRenderedEvent, GridApi, GridOptions } from 'ag-grid-community';\nimport { ButtonCellRenderer } from './buttonCellRenderer';\nimport { CustomNoRowsOverlay } from './customNoRowsOverlay';\nimport { CustomLoadingOverlay } from './customLoadingOverlay';\n\n\n@Component({\n  tag: 'ifx-table',\n  styleUrl: 'table.scss',\n  shadow: true\n})\nexport class Table {\n  gridOptions: GridOptions;\n  gridApi: GridApi;\n  @State() currentPage: number = 1;\n  @Prop() cols: any;\n  @Prop() rows: any;\n  @Prop() buttonRendererOptions?: { onButtonClick?: (params: any, event: Event) => void;}; \n  @State() rowData: any[] = [];\n  @State() colData: any[] = [];\n  @State() filterOptions: { [key: string]: string[] } = {};\n  @State() currentFilters = {};\n  @State() uniqueKey: string;\n  allRowData: any[] = [];\n  @Prop() rowHeight: string = 'default';\n  @Prop() tableHeight: string = 'auto';\n  @Prop() pagination: boolean = true;\n  @Prop() paginationItemsPerPage: string;\n  @State() paginationPageSize: number = 10;\n  @Prop() filterOrientation: string = 'sidebar';\n  @State() showSidebarFilters: boolean = true;\n  @State() matchingResultsCount: number = 0;\n  @Prop() variant: string = 'default'\n\n  @Prop() showLoading: boolean = false;\n  private container: HTMLDivElement;\n  @Element() host: HTMLElement;\n  originalRowData: any[] = [];\n\n  private internalItemsPerPage = JSON.stringify([\n    { value: 10, label: '10', selected: true },\n    { value: 20, label: '20', selected: false },\n    { value: 30, label: '30', selected: false }\n  ]); \n\n  @Watch('rows')\n  rowsChanged(_newVal: any) {\n    const parsed = this.parseArrayInput<any>(this.rows);\n\n    this.currentFilters = {};\n    this.currentPage = 1;\n    this.originalRowData = [...parsed];\n    this.allRowData = [...parsed];\n    this.matchingResultsCount = this.allRowData.length;\n\n    this.updateTableView();\n    this.updateFilterOptions(); \n  }\n\n  @Watch('cols')\n  colsChanged(_newVal: any) {\n    this.colData = this.getColData();\n\n    if (this.gridApi) {\n      this.gridApi.setGridOption('columnDefs', this.colData);\n      this.gridApi.sizeColumnsToFit({\n        defaultMinWidth: 100,\n      });\n    }\n\n    this.updateFilterOptions();\n  }\n\n  @Listen('ifxItemsPerPageChange')\n  handleResultsPerPageChange(e: CustomEvent<string>) { \n      this.paginationPageSize = Number(e.detail);\n      this.currentPage = 1;\n      this.updateTableView();\n  }\n\n  @Listen('ifxChange')\n  handleChipChange(event: CustomEvent<{ previousSelection: Array<any>, currentSelection: Array<any>, name: string }>) {\n    const { name, currentSelection, previousSelection } = event.detail;\n    if(currentSelection && previousSelection) { \n      // Clone the current filters state\n      const updatedFilters = { ...this.currentFilters };\n  \n      if (currentSelection.length === 0) {\n        // If there are no selections for this filter, delete the filter\n        delete updatedFilters[name];\n  \n        // Emit event with specific filter name\n        const customEvent = new CustomEvent('ifxUpdateSidebarFilter', { detail: { filterName: name }, bubbles: true, composed: true });\n        this.host.dispatchEvent(customEvent);\n      } else {\n        // Otherwise, update the filter values with the current selection\n        updatedFilters[name].filterValues = currentSelection.map(selection => selection.value);\n      }\n  \n      // Update the component's filters\n      this.currentFilters = updatedFilters;\n  \n      // Ensure table data is updated\n      this.allRowData = this.applyAllFilters(this.originalRowData, this.currentFilters);\n      this.updateTableView();\n    }\n  }\n\n  @Watch('buttonRendererOptions')\n  onButtonRendererOptionsChanged() {\n     this.colData = this.getColData();  // Re-fetch column data to apply new renderer options\n    if (this.gridApi) {\n      this.gridApi.setColumnDefs(this.colData);  // Update column definitions in the grid API\n    }\n  }\n\n  private parseArrayInput<T>(input: any): T[] {\n  if (typeof input === 'string') {\n    try {\n      const parsed = JSON.parse(input);\n      return Array.isArray(parsed) ? parsed : [];\n    } catch {\n      console.error('Failed to parse input:', input);\n      return [];\n    }\n  }\n    if (Array.isArray(input)) return input;\n    if (typeof input === 'object' && input !== null) return [input as T];\n    return [];\n  }\n\n  toggleSidebarFilters() {\n    this.showSidebarFilters = !this.showSidebarFilters;\n  }\n\n  updateFilterOptions() {\n    const options = {};\n    for (let col of this.colData) {\n      options[col.field] = [...new Set(this.rowData.map(row => row[col.field]))];\n    }\n    this.filterOptions = options;\n  }\n\n  handleSidebarFilterChange(event: CustomEvent) {\n    const filterGroups = event.detail;\n    const updatedFilters = {};\n\n    filterGroups.forEach(filterGroup => {\n      const filterName = filterGroup.filterGroupName;\n      let filterValues;\n      let type;\n\n      if (filterGroup.selectedItems && filterGroup.selectedItems.length > 0) {\n        filterValues = filterGroup.selectedItems.map(item => item.label);\n        type = 'multi-select';\n      } else if (filterGroup.value) {\n        filterValues = [filterGroup.value];\n        type = 'text';\n      } else {\n        filterValues = [];\n      }\n\n      if (!(filterValues.length === 0 || (filterValues.length === 1 && type === 'text' && filterValues[0] === ''))) {\n        updatedFilters[filterName] = { filterValues, type };\n      }\n    });\n\n    this.allRowData = this.applyAllFilters(this.originalRowData, updatedFilters);\n    this.updateTableView();\n    this.currentFilters = updatedFilters;\n  }\n\n\n  handleTopbarFilterChange(event: CustomEvent) {\n    const filters = event.detail;\n\n    // Start by resetting the filter conditions to a blank object\n    this.currentFilters = {};\n\n    // Loop through each filter group provided in the event detail\n    filters.forEach(filter => {\n      const filterName = filter.filterName;\n      let filterValues;\n\n      let type = filter.type;\n\n      if (type === 'text') {\n        // Search/Text filter\n        filterValues = filter.filterValues\n      } else {\n        // Multi-select/Single-Select\n        filterValues = filter.filterValues.map(item => item.label);\n      }\n\n      // If there are no filter values, or the filter is a text filter with an empty value, remove the filter\n      if (!(filterValues.length === 0 || (filterValues.length === 1 && type === 'text' && filterValues[0] === ''))) {\n        // Add or update the filter in the currentFilters object\n        this.currentFilters[filterName] = { filterValues, type };\n      }\n    });\n\n\n    // Now that the currentFilters object has been updated, apply all filters to the data\n    this.allRowData = this.applyAllFilters(this.originalRowData, this.currentFilters);\n\n    // After filtering, update the table view with the new filtered data\n    this.updateTableView();\n  }\n\n\n  applyAllFilters(data, filters) {\n    return data.filter(row => {\n      for (const filterName in filters) {\n        const filterInfo = filters[filterName];\n        let selectedValues = (filterInfo.filterValues || []).map(value => {\n          if (typeof value === 'string') {\n            return value.toLowerCase();\n          } else if (typeof value === 'number' || typeof value === 'boolean') {\n            return value.toString();\n          }\n          return '';\n        });\n\n        // For text filters, check if row values start with any of the selectedValues\n        if (filterInfo.type === 'text') {\n          let textFilterMatched = false;\n          for (let property in row) {\n            if (row.hasOwnProperty(property)) {\n              let rowValue = row[property] != null ? String(row[property]).toLowerCase() : '';\n              if (selectedValues.some(filterValue => rowValue.startsWith(filterValue))) {\n                textFilterMatched = true;\n                break;\n              }\n            }\n          }\n          if (!textFilterMatched) return false;\n        }\n        // For multi-select filters, this remains unchanged\n        else if (filterInfo.type === 'multi-select') {\n          let rowValue = row[filterName] != null ? String(row[filterName]).toLowerCase() : '';\n          // Check if 'undefined' is a selected value and include rows with empty values in that case\n          let includesUndefined = selectedValues.includes('undefined');\n          if (!selectedValues.includes(rowValue) && !(includesUndefined && rowValue === '')) {\n            return false;\n          }\n        }\n      }\n      return true;\n    });\n  }\n\n  updateTableView() {\n    const startIndex = (this.currentPage - 1) * this.paginationPageSize;\n    const endIndex = startIndex + this.paginationPageSize;\n    const visibleRowData = this.allRowData.slice(startIndex, endIndex);\n\n    this.rowData = visibleRowData;\n    this.gridApi.setGridOption('rowData', this.rowData);\n\n    this.matchingResultsCount = this.allRowData.length;\n  }\n\n  clearAllFilters() {\n    this.currentFilters = {};\n    this.allRowData = [...this.originalRowData];\n  }\n\n  @Method()\n  async onBtShowLoading() {\n    this.gridApi.showLoadingOverlay();\n  }\n\n  setPaginationItemsPerPage() { \n    const newItemsPerPage = this.paginationItemsPerPage;\n    if (newItemsPerPage) {\n      this.internalItemsPerPage = this.paginationItemsPerPage;\n      const itemsPerPageArray = JSON.parse(this.internalItemsPerPage);\n      \n      const selectedOption = itemsPerPageArray.find(option => option.selected);\n      if (selectedOption) {\n        this.paginationPageSize = Number(selectedOption.value);\n      } else if (itemsPerPageArray.length > 0) {\n        this.paginationPageSize = Number(itemsPerPageArray[0].value);\n      }\n    }\n  }\n\n  componentWillLoad() {\n    this.setPaginationItemsPerPage();\n\n    this.uniqueKey = `unique-${Math.floor(Math.random() * 1000000)}`;\n    this.rowData = this.getRowData();\n    this.colData = this.getColData();\n    this.updateFilterOptions();\n\n    this.gridOptions = {\n\n      rowHeight: this.rowHeight === 'default' ? 40 : 32,\n      headerHeight: 40,\n      defaultColDef: {\n        resizable: true,\n      },\n      suppressDragLeaveHidesColumns: true,\n      enableCellTextSelection: true,\n      onFirstDataRendered: this.onFirstDataRendered.bind(this),\n      columnDefs: this.colData,\n      rowData: this.rowData,\n      loadingOverlayComponent: CustomLoadingOverlay,\n      noRowsOverlayComponent: CustomNoRowsOverlay,\n      noRowsOverlayComponentParams: {\n        noRowsMessageFunc: () =>\n          'No rows found' //at: ' + new Date().toLocaleTimeString(),\n      },\n      icons: {\n        sortAscending: '<ifx-icon icon=\"arrow-triangle-up-16\"></ifx-icon>',\n        sortDescending: '<ifx-icon icon=\"arrow-triangle-down-16\"></ifx-icon>',\n        sortUnSort: '<a class=\"unsort-icon-custom-color\"><ifx-icon icon=\"arrow-triangle-vertikal-16\"></ifx-icon></a>'\n      },\n      rowDragManaged: this.colData.some(col => col.dndSource === true) ? true : false,\n      animateRows: this.colData.some(col => col.dndSource === true) ? true : false,\n    };\n\n  }\n\n  componentDidRender() {\n    if (this.gridApi) {\n      this.gridApi.setGridOption('columnDefs', this.colData);\n    }\n  }\n\n  async componentDidLoad() {\n    if (this.container) {\n      if(!isNestedInIfxComponent(this.host)) { \n        const framework = detectFramework();\n        trackComponent('ifx-table', await framework)\n      }\n      this.gridApi = createGrid(this.container, this.gridOptions);\n      if (this.gridApi) {\n        this.gridApi.sizeColumnsToFit({\n          defaultMinWidth: 100,\n        });\n        this.gridApi.setGridOption('columnDefs', this.colData);\n        this.gridApi.setGridOption('rowData', this.rowData);\n\n        if (this.pagination) {\n          const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n          if (paginationElement) {\n            paginationElement.addEventListener('ifxPageChange', this.handlePageChange.bind(this));\n          }\n        }\n        const sidebarFilterElements = this.host.querySelectorAll('ifx-filter-type-group');\n        // Add an event listener to each SetFilter component\n        sidebarFilterElements.forEach(sidebarFilterElement => {\n          sidebarFilterElement.addEventListener('ifxSidebarFilterChange', this.handleSidebarFilterChange.bind(this));\n        });\n        const topbarFilterElements = this.host.querySelectorAll('ifx-filter-bar');\n        // Add an event listener to each SetFilter component\n        topbarFilterElements.forEach(topbarFilterElement => {\n          topbarFilterElement.addEventListener('ifxTopbarFilterChange', this.handleTopbarFilterChange.bind(this));\n        });\n      }\n    }\n  }\n\n  componentWillUnmount() {\n    if (this.pagination) {\n      const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n      if (paginationElement) {\n        paginationElement.removeEventListener('ifxPageChange', this.handlePageChange.bind(this));\n      }\n    }\n    const sidebarFilters = this.host.shadowRoot.querySelectorAll('ifx-filter-type-group');\n    // Remove the event listener from each SetFilter component\n    sidebarFilters.forEach(sidebarFilter => {\n      sidebarFilter.removeEventListener('ifxSidebarFilterChange', this.handleSidebarFilterChange.bind(this));\n    });\n    const topbarFilters = this.host.shadowRoot.querySelectorAll('ifx-filter-type-group');\n    // Remove the event listener from each SetFilter component\n    topbarFilters.forEach(topbarFilter => {\n      topbarFilter.removeEventListener('ifxTopbarFilterChange', this.handleTopbarFilterChange.bind(this));\n    });\n  }\n\n  handlePageChange(event) {\n    this.currentPage = event.detail.currentPage;\n    const startIndex = (this.currentPage - 1) * this.paginationPageSize;\n    const endIndex = startIndex + this.paginationPageSize;\n    const visibleRowData = this.allRowData.slice(startIndex, endIndex);\n    // Update the data in the grid\n    if (this.gridApi) {\n      this.gridApi.setGridOption('rowData', visibleRowData);\n    }\n  }\n\n  isJSONParseable(str) {\n    try {\n      JSON.parse(str);\n      return true;\n    } catch (e) {\n      return false;\n    }\n  }\n\n\n  getRowData() {\n    let rows: any[] = [];\n    if (this.rows === undefined || this.rows === null) {\n      return rows;\n    }\n \n    if (this.isJSONParseable(this.rows)) {\n      rows = [...JSON.parse(this.rows)];\n    }\n    else if (Array.isArray(this.rows) || typeof this.rows === 'object') {\n       rows = [...this.rows];\n    }\n    else {\n      console.error('Unexpected value for rows: ', this.rows);\n    }\n\n    this.allRowData = rows;\n    this.originalRowData = [...rows]; // Deep copy the original data\n    this.matchingResultsCount = this.allRowData.length;\n\n    return rows.slice(0, this.paginationPageSize);\n  }\n\n\n  getColData() {\n    let cols: any[] = [];\n    if (this.cols === undefined || this.cols === null) {\n      return cols;\n    }\n  \n    if (this.isJSONParseable(this.cols)) {\n      cols = [...JSON.parse(this.cols)];\n    } else if (Array.isArray(this.cols) || typeof this.cols === 'object') {\n      cols = [...this.cols];\n    } else {\n      console.error('Unexpected value for cols: ', this.cols);\n    }\n  \n    const buttonColumn = cols.find(column => column.field === 'button');\n    if (buttonColumn) {\n      buttonColumn.cellRenderer = ButtonCellRenderer;\n      buttonColumn.valueFormatter = params => params.value.text;\n      \n      // No JSON.parse needed now\n      if (this.buttonRendererOptions && typeof this.buttonRendererOptions === 'object') {\n        if (this.buttonRendererOptions.onButtonClick) {\n          buttonColumn.cellRendererParams = {\n            onButtonClick: this.buttonRendererOptions.onButtonClick\n          };\n        }\n      }\n    }\n  \n    return cols;\n  }\n  \n\n  onFirstDataRendered(params: FirstDataRenderedEvent) {\n    params.api.sizeColumnsToFit();\n  }\n\n  handleResetButtonClick() {\n    const resetEvent = new CustomEvent('ifxResetFiltersEvent', { bubbles: true, composed: true });\n    window.dispatchEvent(resetEvent); // Dispatch from the window object\n\n    this.clearAllFilters();\n    this.updateTableView();  // Update table view with the original data\n  }\n\n\n  disconnectedCallback() {\n    if (this.pagination) {\n      const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n      if (paginationElement) {\n        paginationElement.removeEventListener('ifxPageChange', this.handlePageChange);\n      }\n    }\n\n    const resetButton = this.host.shadowRoot.querySelector('#reset-filters-button');\n    if (resetButton) {\n      resetButton.removeEventListener('click', this.handleResetButtonClick.bind(this));\n    }\n  }\n\n\n\n  getTableClassNames() {\n    return classNames(\n      this.tableHeight === 'auto' && 'table-wrapper ag-root-wrapper-body',\n      'table-wrapper',\n    );\n  }\n\n\n  render() {\n    let style = {};\n    if (this.tableHeight !== 'auto') {\n      style = {\n        'height': this.tableHeight\n      };\n    }\n    const filterClass = this.filterOrientation === 'topbar' ? 'topbar-layout' : 'sidebar-layout';\n    return (\n      <Host>\n        <div class=\"table-container\">\n          {this.filterOrientation === 'sidebar' && (\n            <div class=\"sidebar-btn\">\n              <ifx-button\n                type=\"button\"\n                disabled={false}\n                variant=\"secondary\"\n                size=\"m\"\n                target=\"_blank\"\n                theme=\"default\"\n                full-width=\"false\"\n                onClick={() => this.toggleSidebarFilters()}\n              >\n                <ifx-icon icon=\"cross-16\"></ifx-icon>{this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'}\n              </ifx-button>\n            </div>\n          )}\n\n          <div class={filterClass}>\n            {this.filterOrientation === 'sidebar' && this.showSidebarFilters && (\n              <div class=\"sidebar-container\">\n                <div class=\"filters-title-container\">\n                  <span class=\"filters-title\">Filters</span>\n                </div>\n                <div class=\"set-filter-wrapper-sidebar\">\n                  {(this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (\n                    <slot name=\"sidebar-filter\"></slot>\n                  )}\n                </div>\n              </div>\n            )}\n\n            {this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (\n              <div class=\"set-filter-wrapper-topbar\">\n                {(this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (\n                  <slot name=\"topbar-filter\"></slot>\n                )}\n              </div>\n            )}\n\n            <div class=\"table-pagination-wrapper\">\n              <div class=\"filter-chips\">\n                {this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (\n                  Object.keys(this.currentFilters).map(name => {\n                    const filter = this.currentFilters[name];\n                    const filterValues = filter.filterValues;\n                    const isMultiSelect = filter.type !== 'text';\n\n                    return filterValues.length > 0 ? (\n                      <ifx-chip\n                        placeholder={name}\n                        size=\"large\"\n                        variant={isMultiSelect ? \"multi\" : \"single\"}\n                        readOnly={true}\n                        value={filterValues} // Ensure value prop is set\n                        key={name}\n                      >\n                        {filterValues.map(filterValue => (\n                          <ifx-chip-item value={filterValue} selected={true} key={filterValue}>\n                            {filterValue}\n                          </ifx-chip-item>\n                        ))}\n                      </ifx-chip>\n                    ) : null;\n                  })\n                )}\n\n                {this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (\n                  <ifx-button type=\"button\" disabled={false} variant=\"tertiary\" size=\"m\" target=\"_blank\" theme=\"default\" full-width=\"false\" onClick={() => this.handleResetButtonClick()}\n                  >\n                    <ifx-icon icon=\"curved-arrow-left-16\"></ifx-icon>Reset all\n                  </ifx-button>\n                )}\n              </div>\n\n              {this.filterOrientation !== 'none' && (\n                <div class=\"matching-results-container\">\n                  <span class=\"matching-results-count\">\n                    {this.matchingResultsCount}\n                  </span>\n                  <span class=\"matching-results-text\">\n                    matching results\n                  </span>\n                </div>\n              )}\n\n              <div id=\"table-wrapper\" class={this.getTableClassNames()}>\n                <div id={`ifxTable-${this.uniqueKey}`} class={`ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : \"\"}`} style={style} ref={(el) => this.container = el}>\n                </div>\n              </div>\n              {this.pagination ? <ifx-pagination total={this.allRowData.length} current-page={this.currentPage} items-per-page={this.internalItemsPerPage}></ifx-pagination> : null}\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n\n\n  hasButtonCol(): boolean {\n    return this.getColData().some(column => column.field === 'button');\n  }\n\n  onDragOver(event) {\n    var dragSupported = event.dataTransfer.length;\n\n    if (dragSupported) {\n      event.dataTransfer.dropEffect = 'move';\n    }\n\n    event.preventDefault();\n  }\n\n  onDrop(event) {\n    var jsonData = event.dataTransfer.getData('application/json');\n\n    var eJsonRow = document.createElement('div');\n    eJsonRow.classList.add('json-row');\n    eJsonRow.innerText = jsonData;\n\n    var eJsonDisplay = document.querySelector('#eJsonDisplay');\n\n    eJsonDisplay.appendChild(eJsonRow);\n    event.preventDefault();\n  }\n\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-a5b15118.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as r,h as a,d as t,a as s}from"./p-PqnYwNKt.js";import{d as i,t as o}from"./p-DcmcuUOA.js";import{i as l}from"./p-Bw2fh5LT.js";const p=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{display:flex;flex-direction:column;width:100%}.wrapper__label{color:#1D1D1D;font:400 1rem/1.5rem "Source Sans 3"}.wrapper__label .required{margin-left:4px}.wrapper__label .required.error{color:#CD002F}:host(.wrapper--disabled) .wrapper__label{color:#575352}.wrapper__textarea{width:100%}.wrapper__textarea.fullWidth{width:100%}.wrapper__textarea.fullWidth textarea{width:100%;box-sizing:border-box}.wrapper__textarea textarea{border:1px solid #8D8786;border-radius:1px;padding:8px 16px;background-color:#FFFFFF;color:#1D1D1D;font:400 1rem/1.5rem "Source Sans 3";transition:all 100ms ease;transition-property:border-color}.wrapper__textarea textarea:hover{border:1px solid #575352}.wrapper__textarea textarea:focus-within{outline:none;border:1px solid #0A8276}:host(.wrapper--error) .wrapper__textarea textarea{border:1px solid #CD002F}:host(.wrapper--disabled) .wrapper__textarea textarea{border:1px solid #575352;background-color:#EEEDED}.wrapper__caption{color:#1D1D1D;font:400 0.75rem/1rem "Source Sans 3"}:host(.wrapper--error) .wrapper__caption{color:#CD002F}:host(.wrapper--disabled) .wrapper__caption{color:#575352}';const h=class{constructor(a){e(this,a);this.ifxInput=r(this,"ifxInput",7);if(a.$hostElement$["s-ei"]){this.internals=a.$hostElement$["s-ei"]}else{this.internals=a.$hostElement$.attachInternals();a.$hostElement$["s-ei"]=this.internals}this.inputId=`ifx-textarea-${++d}`;this.disabled=false;this.error=false;this.required=false;this.readOnly=false;this.resize="both";this.wrap="soft";this.fullWidth="false"}async reset(){this.resetTextarea()}handleComponentWidth(){const e=this.el.shadowRoot.querySelector(".wrapper__textarea");const r=this.fullWidth.toLowerCase()==="true";if(r){e.classList.add("fullWidth")}else if(e.classList.contains("fullWidth")){e.classList.remove("fullWidth")}}componentDidRender(){this.handleComponentWidth()}formResetCallback(){this.resetTextarea()}handleOnInput(e){this.value=e.target.value;this.ifxInput.emit(this.value)}resetTextarea(){this.value=""}async componentDidLoad(){if(!l(this.el)){const e=i();o("ifx-textarea",await e)}}render(){var e,r;return a(t,{key:"ee0de67957ed930e680e97e81636b1a418cd07eb",class:`wrapper--${this.error?"error":""} wrapper--${this.disabled?"disabled":""}`},a("label",{key:"b8bba382fb5283af07023094489905b834e608fb",class:"wrapper__label",htmlFor:this.inputId},(e=this.label)===null||e===void 0?void 0:e.trim(),this.required&&a("span",{key:"5aaab42f9ff1f39eda2e8128a9f13f52d5201084",class:`required ${this.error?"error":""}`},"*")),a("div",{key:"6f6fdf2a46aae7e2176a531035220a82b11e65e7",class:"wrapper__textarea"},a("textarea",{key:"dc778e4a9fa29f19aed2322ed5842b72a256696b","aria-label":"a textarea","aria-value":this.value,"aria-disabled":this.disabled,id:this.inputId,style:{resize:this.resize},name:this.name?this.name:this.inputId,cols:this.cols,rows:this.rows,maxlength:this.maxlength,wrap:this.wrap,disabled:this.disabled,readonly:this.readOnly,placeholder:this.placeholder,value:this.value,onInput:e=>this.handleOnInput(e)})),((r=this.caption)===null||r===void 0?void 0:r.trim())&&a("div",{key:"3cf5e5c1f0d7a4fc9e82e4879374114bc172a756",class:"wrapper__caption"},this.caption.trim()))}get el(){return s(this)}};let d=0;h.style=p;export{h as ifx_textarea};
-//# sourceMappingURL=p-a5b15118.entry.js.map

package/dist/infineon-design-system-stencil/p-a5b15118.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["textareaCss","TextArea","constructor","hostRef","this","inputId","textareaId","disabled","error","required","readOnly","resize","wrap","fullWidth","reset","resetTextarea","handleComponentWidth","textareaWrapper","el","shadowRoot","querySelector","isFullWidth","toLowerCase","classList","add","contains","remove","componentDidRender","formResetCallback","handleOnInput","e","value","target","ifxInput","emit","componentDidLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","render","h","Host","key","class","htmlFor","_a","label","trim","id","style","name","cols","rows","maxlength","readonly","placeholder","onInput","_b","caption"],"sources":["src/components/textarea/textarea.scss?tag=ifx-textarea&encapsulation=shadow","src/components/textarea/textarea.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n}\n\n.wrapper__label {\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody03;\n    & .required {\n        margin-left: 4px;\n        \n        &.error {\n          color: #CD002F;\n        }\n      }\n}\n:host(.wrapper--disabled) .wrapper__label {\n    color: tokens.$ifxColorEngineering500;\n}\n\n.wrapper__textarea {\n    width: 100%;\n    &.fullWidth { \n        width: 100%;\n        & textarea { \n            width: 100%;\n            box-sizing: border-box; \n        }\n    }\n}\n\n.wrapper__textarea textarea {\n    border: 1px solid tokens.$ifxColorEngineering400;\n    border-radius: tokens.$ifxSpace12;\n    padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n    \n    background-color: tokens.$ifxColorBaseWhite;\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody03;\n    \n    transition: all 100ms ease;\n    transition-property: border-color;\n\n    &:hover {\n        border: 1px solid tokens.$ifxColorEngineering500;\n    }\n    \n    &:focus-within {\n        outline: none;\n        border: 1px solid tokens.$ifxColorOcean500;\n    }\n}\n\n:host(.wrapper--error) .wrapper__textarea textarea {\n    border: 1px solid tokens.$ifxColorRed500;\n}\n:host(.wrapper--disabled) .wrapper__textarea textarea {\n    border: 1px solid tokens.$ifxColorEngineering500;\n\n    background-color: tokens.$ifxColorEngineering200;\n}\n\n.wrapper__caption {\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody05;\n}\n:host(.wrapper--error) .wrapper__caption {\n    color: tokens.$ifxColorRed500;\n}\n:host(.wrapper--disabled) .wrapper__caption {\n    color: tokens.$ifxColorEngineering500;\n}","import { h, AttachInternals, Component, Event, EventEmitter, Host, Method, Prop, Element } 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\t// formAssociated: true,\n\tshadow: true,\n\tstyleUrl: 'textarea.scss',\n\ttag: 'ifx-textarea'\n})\n\nexport class TextArea {\n\n\tprivate inputId: string = `ifx-textarea-${++textareaId}`;\n\n\t@AttachInternals() internals: ElementInternals;\n\n\t@Event() ifxInput: EventEmitter<String>;\n\t@Element() el;\n\t@Prop() caption: string;\n\t@Prop() cols: number;\n\t@Prop() disabled: boolean = false;\n\t@Prop() error: boolean = false;\n\t@Prop() label: string;\n\t@Prop() maxlength: number;\n\t@Prop() name: string;\n\t@Prop() placeholder: string;\n\t@Prop() required: boolean = false;\n\t@Prop() readOnly: boolean = false;\n\t@Prop() resize: 'both' | 'horizontal' | 'vertical' | 'none' = 'both';\n\t@Prop() rows: number;\n\t@Prop({ mutable: true }) value: string;\n\t@Prop() wrap: 'hard' | 'soft' | 'off' = 'soft';\n\t@Prop({ reflect: true }) fullWidth: string = \"false\";\n\n\t@Method()\n\tasync reset() {\n\t\tthis.resetTextarea();\n\t}\n\n\thandleComponentWidth() {\n\t\tconst textareaWrapper = this.el.shadowRoot.querySelector('.wrapper__textarea')\n\t\tconst isFullWidth = this.fullWidth.toLowerCase() === \"true\";\n\n\t\tif (isFullWidth) {\n\t\t\ttextareaWrapper.classList.add('fullWidth')\n\t\t} else if (textareaWrapper.classList.contains('fullWidth')) {\n\t\t\ttextareaWrapper.classList.remove('fullWidth');\n\t\t}\n\t}\n\n\tcomponentDidRender() {\n\t\tthis.handleComponentWidth()\n\t}\n\n\tformResetCallback(): void {\n\t\tthis.resetTextarea();\n\t\t//this.internals.setFormValue(\"\");\n\t}\n\n\thandleOnInput(e: InputEvent): void {\n\t\tthis.value = (e.target as HTMLTextAreaElement).value;\n\t\t//this.internals.setFormValue(this.value);\n\t\tthis.ifxInput.emit(this.value);\n\t}\n\n\tresetTextarea() {\n\t\tthis.value = '';\n\t\t//this.internals.setValidity({});\n\t\t//this.internals.setFormValue('');\n\t}\n\n\t// componentWillLoad() {\n\t// \tthis.internals.setFormValue(this.value);\n\t// }\n\n\t\tasync componentDidLoad() { \n\t\tif(!isNestedInIfxComponent(this.el)) { \n\t\t\tconst framework = detectFramework();\n\t\t\ttrackComponent('ifx-textarea', await framework)\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`wrapper--${this.error ? 'error' : ''} wrapper--${this.disabled ? 'disabled' : ''}`}>\n\t\t\t\t<label class='wrapper__label' htmlFor={this.inputId}>\n\t\t\t\t\t{this.label?.trim()}\n\t\t\t\t\t{this.required && (\n\t\t\t\t\t\t<span class={`required ${this.error ? 'error' : \"\"}`}>*</span>\n\t\t\t\t\t)}\n\t\t\t\t</label>\n\n\t\t\t\t<div class='wrapper__textarea'>\n\t\t\t\t\t<textarea\n\t\t\t\t\t\taria-label='a textarea'\n\t\t\t\t\t\taria-value={this.value}\n\t\t\t\t\t\taria-disabled={this.disabled}\n\t\t\t\t\t\tid={this.inputId}\n\t\t\t\t\t\tstyle={{ resize: this.resize }}\n\t\t\t\t\t\tname={this.name ? this.name : this.inputId}\n\t\t\t\t\t\tcols={this.cols}\n\t\t\t\t\t\trows={this.rows}\n\t\t\t\t\t\tmaxlength={this.maxlength}\n\t\t\t\t\t\twrap={this.wrap}\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\treadonly={this.readOnly}\n\t\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\tonInput={(e) => this.handleOnInput(e)}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t{this.caption?.trim() && (\n\t\t\t\t\t<div class='wrapper__caption'>\n\t\t\t\t\t\t{this.caption.trim()}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n\nlet textareaId = 0;"],"mappings":"+IAAA,MAAMA,EAAc,wqC,MCYPC,EAAQ,MAPrB,WAAAC,CAAAC,G,6MASSC,KAAAC,QAAkB,kBAAkBC,IAQpCF,KAAQG,SAAY,MACpBH,KAAKI,MAAY,MAKjBJ,KAAQK,SAAY,MACpBL,KAAQM,SAAY,MACpBN,KAAMO,OAAgD,OAGtDP,KAAIQ,KAA4B,OACfR,KAASS,UAAW,OAwF7C,CArFA,WAAMC,GACLV,KAAKW,e,CAGN,oBAAAC,GACC,MAAMC,EAAkBb,KAAKc,GAAGC,WAAWC,cAAc,sBACzD,MAAMC,EAAcjB,KAAKS,UAAUS,gBAAkB,OAErD,GAAID,EAAa,CAChBJ,EAAgBM,UAAUC,IAAI,Y,MACxB,GAAIP,EAAgBM,UAAUE,SAAS,aAAc,CAC3DR,EAAgBM,UAAUG,OAAO,Y,EAInC,kBAAAC,GACCvB,KAAKY,sB,CAGN,iBAAAY,GACCxB,KAAKW,e,CAIN,aAAAc,CAAcC,GACb1B,KAAK2B,MAASD,EAAEE,OAA+BD,MAE/C3B,KAAK6B,SAASC,KAAK9B,KAAK2B,M,CAGzB,aAAAhB,GACCX,KAAK2B,MAAQ,E,CASb,sBAAMI,GACN,IAAIC,EAAuBhC,KAAKc,IAAK,CACpC,MAAMmB,EAAYC,IAClBC,EAAe,qBAAsBF,E,EAIvC,MAAAG,G,QACC,OACCC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,YAAYxC,KAAKI,MAAQ,QAAU,eAAeJ,KAAKG,SAAW,WAAa,MAC3FkC,EAAA,SAAAE,IAAA,2CAAOC,MAAM,iBAAiBC,QAASzC,KAAKC,UAC1CyC,EAAA1C,KAAK2C,SAAK,MAAAD,SAAA,SAAEA,EAAAE,OACZ5C,KAAKK,UACLgC,EAAA,QAAAE,IAAA,2CAAMC,MAAO,YAAYxC,KAAKI,MAAQ,QAAU,MAAc,MAIhEiC,EAAK,OAAAE,IAAA,2CAAAC,MAAM,qBACVH,EACY,YAAAE,IAAA,qEAAY,aACXvC,KAAK2B,MACF,gBAAA3B,KAAKG,SACpB0C,GAAI7C,KAAKC,QACT6C,MAAO,CAAEvC,OAAQP,KAAKO,QACtBwC,KAAM/C,KAAK+C,KAAO/C,KAAK+C,KAAO/C,KAAKC,QACnC+C,KAAMhD,KAAKgD,KACXC,KAAMjD,KAAKiD,KACXC,UAAWlD,KAAKkD,UAChB1C,KAAMR,KAAKQ,KACXL,SAAUH,KAAKG,SACfgD,SAAUnD,KAAKM,SACf8C,YAAapD,KAAKoD,YAClBzB,MAAO3B,KAAK2B,MACZ0B,QAAU3B,GAAM1B,KAAKyB,cAAcC,QAIpC4B,EAAAtD,KAAKuD,WAAO,MAAAD,SAAA,SAAAA,EAAEV,SACdP,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oBACTxC,KAAKuD,QAAQX,Q,2BAQpB,IAAI1C,EAAa,E","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-acc5ae62.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as r,h as o,a as i}from"./p-PqnYwNKt.js";import{d as c,t}from"./p-DcmcuUOA.js";import{i as n}from"./p-Bw2fh5LT.js";const a=':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}';const s=class{constructor(o){e(this,o);this.ifxChange=r(this,"ifxChange",7);this.ifxError=r(this,"ifxError",7);if(o.$hostElement$["s-ei"]){this.internals=o.$hostElement$["s-ei"]}else{this.internals=o.$hostElement$.attachInternals();o.$hostElement$["s-ei"]=this.internals}this.disabled=false;this.checked=false;this.error=false;this.size="m";this.indeterminate=false}handleCheckbox(){if(!this.disabled){if(!this.inputElement.indeterminate){this.internalChecked=!this.internalChecked}this.ifxChange.emit(this.internalChecked)}}async isChecked(){return this.internalChecked}async toggleCheckedState(e){this.internalChecked=e}valueChanged(e,r){if(e!==r){this.internalChecked=e;this.inputElement.checked=this.internalChecked}}errorChanged(e,r){if(e!==r){this.ifxError.emit(e)}}indeterminateChanged(e,r){if(e!==r){this.internalIndeterminate=e;this.inputElement.indeterminate=this.internalIndeterminate}}handleKeydown(e){if(e.keyCode===32||e.keyCode===13){this.handleCheckbox();e.preventDefault()}}componentWillLoad(){this.internalChecked=this.checked;this.internalIndeterminate=this.indeterminate}async componentDidLoad(){if(!n(this.el)){const e=c();t("ifx-checkbox",await e)}}componentDidRender(){this.inputElement.indeterminate=this.internalIndeterminate}getCheckedClassName(){if(this.error){if(this.internalChecked){return"checked error"}else{return"error"}}else if(this.internalChecked){return"checked"}else return""}render(){const e=this.el.innerHTML;let r=false;if(e){r=true}return o("div",{key:"9f9007f07cc512645b65ca762b9283cacb12b3c4",class:"checkbox__container"},o("input",{key:"0e93877954599bdac3ff3e51e529ed92b2fee3c1",type:"checkbox",hidden:true,ref:e=>this.inputElement=e,checked:this.internalChecked,onChange:this.handleCheckbox.bind(this),id:"checkbox",value:`${this.value}`,disabled:this.disabled?true:undefined}),o("div",{key:"2fec76efcf3f90902a5ea89087a00449ed5e6f66",tabindex:"0",onClick:this.handleCheckbox.bind(this),onKeyDown:this.handleKeydown.bind(this),role:"checkbox","aria-checked":this.indeterminate?"mixed":this.internalChecked.toString(),"aria-disabled":this.disabled,"aria-labelledby":"label",class:`checkbox__wrapper \n          ${this.getCheckedClassName()}\n        ${this.size==="m"?"checkbox-m":""}\n        ${this.indeterminate?"indeterminate":""}\n        ${this.disabled?"disabled":""}`},this.internalChecked&&!this.internalIndeterminate&&o("ifx-icon",{key:"f79a72d77886cc7d0ef1645dd4a66938c1f9d7ac",icon:"check-16","aria-hidden":"true"})),r&&o("div",{key:"d16dffc3c842967a5a143e6a3256c73c9c035b9d",id:"label",class:`label ${this.size==="m"?"label-m":""} ${this.disabled?"disabled":""} `,onClick:this.handleCheckbox.bind(this)},o("slot",{key:"4bc9b3b862a975c31ca17fd478d7bd82044d49b4"})))}get el(){return i(this)}static get watchers(){return{checked:["valueChanged"],error:["errorChanged"],indeterminate:["indeterminateChanged"]}}};s.style=a;export{s as ifx_checkbox};
-//# sourceMappingURL=p-acc5ae62.entry.js.map

package/dist/infineon-design-system-stencil/p-acc5ae62.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["checkboxCss","Checkbox","constructor","hostRef","this","disabled","checked","error","size","indeterminate","handleCheckbox","inputElement","internalChecked","ifxChange","emit","isChecked","toggleCheckedState","newVal","valueChanged","newValue","oldValue","errorChanged","ifxError","indeterminateChanged","internalIndeterminate","handleKeydown","event","keyCode","preventDefault","componentWillLoad","componentDidLoad","isNestedInIfxComponent","el","framework","detectFramework","trackComponent","componentDidRender","getCheckedClassName","render","slot","innerHTML","hasSlot","h","key","class","type","hidden","ref","onChange","bind","id","value","undefined","tabindex","onClick","onKeyDown","role","toString","icon"],"sources":["src/components/checkbox/checkbox.scss?tag=ifx-checkbox&encapsulation=shadow","src/components/checkbox/checkbox.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n    display: inline-flex;\n    vertical-align: top;\n}\n\n.checkbox__container {\n    box-sizing: border-box;\n    display: inline-flex;\n    flex-direction: row;\n    align-items: top;\n    padding: 0px;\n    gap: tokens.$ifxSpace100;\n    font-family: tokens.$ifxFontFamilyBody;\n    vertical-align: bottom;\n\n    & .checkbox__wrapper {\n        box-sizing: border-box;\n        display: flex;\n        position: relative; //needs to be added for the indeterminate state of the checkbox\n        justify-content: center;\n        align-items: center;\n        width: tokens.$ifxSize250;\n        height: tokens.$ifxSize250;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 1px solid #575352;\n        border-radius: tokens.$ifxBorderRadius12;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n        align-self: flex-start;\n\n        &.checkbox-m {\n            height: tokens.$ifxSize300;\n            width: tokens.$ifxSize300;\n        }\n\n        &.error {\n            border-color: #CD002F;\n        }\n\n        &:focus-visible {\n            border: 1px solid #575352;\n            outline: 2px solid #0A8276;\n            outline-offset: 2px;\n        }\n\n        &:hover {\n            background-color: #EEEDED;\n            border: 1px solid #575352;\n            border-radius: tokens.$ifxBorderRadius12;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n        }\n\n        &.disabled {\n            background-color: #BFBBBB;\n            border-color: #BFBBBB;\n            border-radius: tokens.$ifxBorderRadius12;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n        }\n\n        &.checked:not(.indeterminate) {\n            background-color: #0A8276;\n            border-radius: tokens.$ifxBorderRadius12;\n            border-color: tokens.$ifxColorBaseTransparent;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n            color: tokens.$ifxColorBaseWhite;\n\n            &.error {\n                background-color: #CD002F;\n            }\n\n            &:focus-visible {\n                border: 1px solid transparent;\n                outline: 2px solid #0A8276;\n                outline-offset: 2px;\n            }\n\n            &:hover {\n                background-color: #08665C;\n                border-radius: tokens.$ifxBorderRadius12;\n                flex: none;\n                order: 0;\n                flex-grow: 0;\n            }\n\n            &.disabled {\n                background: #BFBBBB;\n                border-radius: tokens.$ifxBorderRadius12;\n                flex: none;\n                order: 0;\n                flex-grow: 0;\n            }\n        }\n\n        &.indeterminate {\n            &:before {\n                content: \"\";\n                display: block;\n                width: 70%; // Adjust as needed for the width of the minus sign\n                height: 2px; // Adjust for thickness of the minus sign\n                background-color: #08665C; // Color of the minus sign\n                position: absolute;\n                top: 50%;\n                left: 50%;\n                transform: translate(-50%, -50%);\n            }\n        }\n\n    }\n\n    & .label {\n        font-style: normal;\n        font-weight: 400;\n        font-size: tokens.$ifxFontSizeS;\n        line-height: tokens.$ifxLineHeightS;\n        color: tokens.$ifxColorBaseBlack;\n        overflow-wrap: break-word;\n        word-wrap: break-word;\n        word-break: break-all;\n        max-width: 100%;\n\n        &.label-m {\n            font-size: tokens.$ifxFontSizeM;\n            line-height: tokens.$ifxLineHeightM;\n        }\n\n        &.disabled {\n            color: #BFBBBB;\n        }\n    }\n\n    & .checkbox__wrapper,\n    & .label {\n        &:hover {\n            cursor: pointer;\n        }\n    }\n}","import { Component, h, Prop, Element, State, Event, EventEmitter, Watch, Method, AttachInternals } 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-checkbox',\n  styleUrl: 'checkbox.scss',\n  shadow: true,\n  // formAssociated: true\n})\n\nexport class Checkbox {\n  private inputElement: HTMLInputElement;\n\n  @Element() el;\n  @Prop() disabled: boolean = false;\n  @Prop() checked: boolean = false;\n  @Prop() error: boolean = false;\n  @Prop() size: string = 'm';\n  @Prop() indeterminate: boolean = false;\n  @Prop() value: string;\n  @State() internalChecked: boolean;\n  @State() internalIndeterminate: boolean;\n\n  @AttachInternals() internals: ElementInternals;\n\n  @Event({ bubbles: true, composed: true }) ifxChange: EventEmitter;\n  @Event({ bubbles: true, composed: true }) ifxError: EventEmitter;\n\n  handleCheckbox() {\n    if (!this.disabled) {\n      if (!this.inputElement.indeterminate) {\n        this.internalChecked = !this.internalChecked;\n      } \n      if (this.internalChecked && !this.internalIndeterminate) {\n        if (this.value !== undefined) {\n          //this.internals.setFormValue(this.value);\n        } else {\n          //this.internals.setFormValue(\"on\")\n        }\n      } else {\n        //this.internals.setFormValue(null)\n      }\n      this.ifxChange.emit(this.internalChecked);\n    }\n  }\n\n  @Method()\n  async isChecked(): Promise<boolean> {\n    return this.internalChecked;\n  }\n\n  @Method()\n  async toggleCheckedState(newVal: boolean) {\n    this.internalChecked = newVal;\n  }\n\n  @Watch('checked')\n  valueChanged(newValue: boolean, oldValue: boolean) {\n    if (newValue !== oldValue) {\n      this.internalChecked = newValue;\n      this.inputElement.checked = this.internalChecked; // update the checkbox's checked property\n    }\n  }\n\n  @Watch('error')\n  errorChanged(newValue: boolean, oldValue: boolean) {\n    if (newValue !== oldValue) {\n      this.ifxError.emit(newValue);\n    }\n  }\n\n  @Watch('indeterminate')\n  indeterminateChanged(newValue: boolean, oldValue: boolean) {\n    if (newValue !== oldValue) {\n      this.internalIndeterminate = newValue;\n      this.inputElement.indeterminate = this.internalIndeterminate; // update the checkbox's indeterminate property\n    }\n  }\n\n  handleKeydown(event) {\n    // Keycode 32 corresponds to the Space key, 13 corresponds to the Enter key\n    if (event.keyCode === 32 || event.keyCode === 13) {\n      this.handleCheckbox();\n      event.preventDefault();  // prevent the default action when space or enter is pressed\n    }\n  }\n\n  componentWillLoad() {\n    this.internalChecked = this.checked;\n    this.internalIndeterminate = this.indeterminate;\n  }\n\n  async componentDidLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-checkbox', await framework)\n    }\n  }\n\n  componentDidRender() {\n    this.inputElement.indeterminate = this.internalIndeterminate;\n  }\n\n  /**\n   * Callback for form association.\n   * Called whenever the form is reset.\n   */\n  // formResetCallback() {\n  //   this.internals.setFormValue(null);\n  // }\n\n  getCheckedClassName() {\n    if (this.error) {\n      if (this.internalChecked) {\n        return \"checked error\"\n      } else {\n        return \"error\"\n      }\n    } else if (this.internalChecked) {\n      return \"checked\";\n    } else return \"\"\n  }\n\n  render() {\n    const slot = this.el.innerHTML;\n    let hasSlot = false;\n    if (slot) {\n      hasSlot = true;\n    }\n    return (\n      <div class=\"checkbox__container\">\n        <input\n          type=\"checkbox\"\n          hidden\n          ref={(el) => (this.inputElement = el)}\n          checked={this.internalChecked}\n          onChange={this.handleCheckbox.bind(this)} // Listen for changes here\n          id='checkbox'\n          value={`${this.value}`}\n          disabled={this.disabled ? true : undefined}\n        />\n        <div\n          tabindex=\"0\"\n          onClick={this.handleCheckbox.bind(this)}\n          onKeyDown={this.handleKeydown.bind(this)}\n          role=\"checkbox\"\n          aria-checked={this.indeterminate ? 'mixed' : this.internalChecked.toString()}\n          aria-disabled={this.disabled}\n          aria-labelledby=\"label\"\n          class={`checkbox__wrapper \n          ${this.getCheckedClassName()}\n        ${this.size === \"m\" ? \"checkbox-m\" : \"\"}\n        ${this.indeterminate ? 'indeterminate' : \"\"}\n        ${this.disabled ? 'disabled' : \"\"}`}\n        >\n          {this.internalChecked && !this.internalIndeterminate && <ifx-icon icon=\"check-16\" aria-hidden=\"true\"></ifx-icon>}\n        </div>\n        {hasSlot &&\n          <div id=\"label\" class={`label ${this.size === \"m\" ? \"label-m\" : \"\"} ${this.disabled ? 'disabled' : \"\"} `} onClick={this.handleCheckbox.bind(this)}>\n            <slot />\n          </div>}\n      </div>\n    );\n  }\n}"],"mappings":"mIAAA,MAAMA,EAAc,g1E,MCYPC,EAAQ,MAPrB,WAAAC,CAAAC,G,kPAWUC,KAAQC,SAAY,MACpBD,KAAOE,QAAY,MACnBF,KAAKG,MAAY,MACjBH,KAAII,KAAW,IACfJ,KAAaK,cAAY,KAkJlC,CAxIC,cAAAC,GACE,IAAKN,KAAKC,SAAU,CAClB,IAAKD,KAAKO,aAAaF,cAAe,CACpCL,KAAKQ,iBAAmBR,KAAKQ,e,CAW/BR,KAAKS,UAAUC,KAAKV,KAAKQ,gB,EAK7B,eAAMG,GACJ,OAAOX,KAAKQ,e,CAId,wBAAMI,CAAmBC,GACvBb,KAAKQ,gBAAkBK,C,CAIzB,YAAAC,CAAaC,EAAmBC,GAC9B,GAAID,IAAaC,EAAU,CACzBhB,KAAKQ,gBAAkBO,EACvBf,KAAKO,aAAaL,QAAUF,KAAKQ,e,EAKrC,YAAAS,CAAaF,EAAmBC,GAC9B,GAAID,IAAaC,EAAU,CACzBhB,KAAKkB,SAASR,KAAKK,E,EAKvB,oBAAAI,CAAqBJ,EAAmBC,GACtC,GAAID,IAAaC,EAAU,CACzBhB,KAAKoB,sBAAwBL,EAC7Bf,KAAKO,aAAaF,cAAgBL,KAAKoB,qB,EAI3C,aAAAC,CAAcC,GAEZ,GAAIA,EAAMC,UAAY,IAAMD,EAAMC,UAAY,GAAI,CAChDvB,KAAKM,iBACLgB,EAAME,gB,EAIV,iBAAAC,GACEzB,KAAKQ,gBAAkBR,KAAKE,QAC5BF,KAAKoB,sBAAwBpB,KAAKK,a,CAGpC,sBAAMqB,GACJ,IAAIC,EAAuB3B,KAAK4B,IAAK,CACnC,MAAMC,EAAYC,IAClBC,EAAe,qBAAsBF,E,EAIzC,kBAAAG,GACEhC,KAAKO,aAAaF,cAAgBL,KAAKoB,qB,CAWzC,mBAAAa,GACE,GAAIjC,KAAKG,MAAO,CACd,GAAIH,KAAKQ,gBAAiB,CACxB,MAAO,e,KACF,CACL,MAAO,O,OAEJ,GAAIR,KAAKQ,gBAAiB,CAC/B,MAAO,S,MACF,MAAO,E,CAGhB,MAAA0B,GACE,MAAMC,EAAOnC,KAAK4B,GAAGQ,UACrB,IAAIC,EAAU,MACd,GAAIF,EAAM,CACRE,EAAU,I,CAEZ,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,uBACTF,EAAA,SAAAC,IAAA,2CACEE,KAAK,WACLC,OAAM,KACNC,IAAMf,GAAQ5B,KAAKO,aAAeqB,EAClC1B,QAASF,KAAKQ,gBACdoC,SAAU5C,KAAKM,eAAeuC,KAAK7C,MACnC8C,GAAG,WACHC,MAAO,GAAG/C,KAAK+C,QACf9C,SAAUD,KAAKC,SAAW,KAAO+C,YAEnCV,EACE,OAAAC,IAAA,2CAAAU,SAAS,IACTC,QAASlD,KAAKM,eAAeuC,KAAK7C,MAClCmD,UAAWnD,KAAKqB,cAAcwB,KAAK7C,MACnCoD,KAAK,WAAU,eACDpD,KAAKK,cAAgB,QAAUL,KAAKQ,gBAAgB6C,WACnD,gBAAArD,KAAKC,SACJ,0BAChBuC,MAAO,iCACLxC,KAAKiC,kCACPjC,KAAKI,OAAS,IAAM,aAAe,eACnCJ,KAAKK,cAAgB,gBAAkB,eACvCL,KAAKC,SAAW,WAAa,MAE5BD,KAAKQ,kBAAoBR,KAAKoB,uBAAyBkB,EAAA,YAAAC,IAAA,2CAAUe,KAAK,WAAU,cAAa,UAE/FjB,GACCC,EAAA,OAAAC,IAAA,2CAAKO,GAAG,QAAQN,MAAO,SAASxC,KAAKI,OAAS,IAAM,UAAY,MAAMJ,KAAKC,SAAW,WAAa,MAAOiD,QAASlD,KAAKM,eAAeuC,KAAK7C,OAC1IsC,EAAQ,QAAAC,IAAA,8C","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-b4d19492.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as i,a as s,d as o}from"./p-PqnYwNKt.js";import{d as n,t as l}from"./p-DcmcuUOA.js";import{i as r}from"./p-Bw2fh5LT.js";const c=':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}';function a(t,e){let i;return function s(...o){const n=()=>{clearTimeout(i);t(...o)};clearTimeout(i);i=setTimeout(n,e)}}const h=class{constructor(i){t(this,i);this.ifxSelect=e(this,"ifxSelect",7);this.ifxOpen=e(this,"ifxOpen",7);if(i.$hostElement$["s-ei"]){this.internals=i.$hostElement$["s-ei"]}else{this.internals=i.$hostElement$.attachInternals();i.$hostElement$["s-ei"]=this.internals}this.disabled=false;this.error=false;this.errorMessage="Error";this.label="";this.placeholder="";this.showSearch=true;this.showSelectAll=true;this.showClearButton=true;this.showExpandCollapse=true;this.noResultsMessage="No results found.";this.showNoResultsMessage=true;this.searchPlaceholder="Search";this.selectAllLabel="Select all";this.expandLabel="Expand";this.collapseLabel="Collapse";this.ariaMultiSelectLabel="Multi-select dropdown";this.ariaMultiSelectLabelledBy="";this.ariaMultiSelectDescribedBy="";this.ariaSearchLabel="Search options";this.ariaClearLabel="Clear all selections";this.ariaToggleLabel="Toggle dropdown";this.ariaSelectAllLabel="Select all options";this.ariaExpandAllLabel="Expand all categories";this.ariaCollapseAllLabel="Collapse all categories";this.internalError=false;this.persistentSelectedOptions=[];this.dropdownOpen=false;this.searchTerm="";this.handleSearch=a((t=>{const e=t.value.toLowerCase();const i=e!=="";this.searchTerm=e;const s=this.el.shadowRoot.querySelector(".ifx-multiselect-wrapper");if(s){if(i){s.classList.remove("active")}else{const t=this.el.shadowRoot.querySelector("ifx-search-field");const e=t&&t.matches(":focus-within");if(!e){s.classList.add("active")}}}const o=this.el.shadowRoot.querySelector(".ifx-multiselect-options");if(o){if(i){o.classList.add("has-search-filter")}else{o.classList.remove("has-search-filter")}}requestAnimationFrame((()=>{const t=this.el.querySelectorAll("ifx-multiselect-option");t.forEach((t=>{const s=new CustomEvent("ifx-search-filter",{detail:{searchTerm:e,isActive:i}});t.dispatchEvent(s)}));if(i){setTimeout((()=>{const t=this.el.querySelectorAll("ifx-multiselect-option");let e=0;t.forEach((t=>{const i=window.getComputedStyle(t);const s=t.getBoundingClientRect();if(i.display!=="none"&&i.visibility!=="hidden"&&i.opacity!=="0"&&s.height>0){e++}}));const i=this.el.shadowRoot.querySelector(".ifx-multiselect-options");if(i){if(e===0){i.classList.add("show-no-results")}else{i.classList.remove("show-no-results")}}}),200)}else{const t=this.el.shadowRoot.querySelector(".ifx-multiselect-options");if(t){t.classList.remove("show-no-results")}}}))}),150);this.pendingSelectionUpdate=false;this.handleDocumentClick=t=>{const e=t.composedPath();if(!e.includes(this.dropdownElement)){this.dropdownOpen=false;document.removeEventListener("click",this.handleDocumentClick);this.resetSearch();this.ifxOpen.emit(this.dropdownOpen)}}}parseChildOptions(){const t=[];const e=Array.from(this.el.children);e.forEach(((e,i)=>{if(e.tagName==="IFX-MULTISELECT-OPTION"){const s=this.parseOptionElement(e,i);if(s){t.push(s)}}}));return t}parseOptionElement(t,e){const i=t.getAttribute("value")||`option-${e}`;const s=t.hasAttribute("selected");const o=t.hasAttribute("disabled");const n=t.hasAttribute("indeterminate");const l={value:i,selected:s,disabled:o,indeterminate:n};const r=Array.from(t.children).filter((t=>t.tagName==="IFX-MULTISELECT-OPTION")).map(((t,e)=>this.parseOptionElement(t,e))).filter((t=>t!==null));if(r.length>0){l.children=r}return l}loadInitialOptions(){this.internalError=this.error;this.internalErrorMessage=this.errorMessage;const t=this.parseChildOptions();const e=this.collectSelectedOptions(t);const i=e.filter((t=>!this.persistentSelectedOptions.some((e=>e.value==t.value))));this.persistentSelectedOptions=[...this.persistentSelectedOptions,...i]}collectSelectedOptions(t){let e=[];for(const i of t){if(i.selected){if(i.children&&i.children.length>0){e=e.concat(this.collectLeafOptions(i.children))}else{if(!e.some((t=>t.value===i.value))){e.push(i)}}}else{if(i.children&&i.children.length>0){e=e.concat(this.collectSelectedOptions(i.children))}}}return e}collectLeafOptions(t){let e=[];for(const i of t){if(i.children&&i.children.length>0){e=e.concat(this.collectLeafOptions(i.children))}else{e.push(i)}}return e}handleSearchFocus(t){const e=this.el.shadowRoot.querySelector(".ifx-multiselect-wrapper");if(e){if(t||this.searchTerm!==""){e.classList.remove("active")}else{e.classList.add("active")}}}positionDropdown(){var t;const e=(t=this.el.shadowRoot.querySelector(".ifx-multiselect-wrapper"))===null||t===void 0?void 0:t.getBoundingClientRect();const i=window.innerHeight-e.bottom;const s=e.top;if(s>i&&e.height>i||e.bottom>window.innerHeight){this.dropdownFlipped=true}else{this.dropdownFlipped=false}}updateSlotBasedSelections(t=false){const e=this.el.querySelectorAll("ifx-multiselect-option");const i=[];e.forEach((t=>{const e=t["__stencil_instance"];if(e&&e.selected&&!e.hasChildren){i.push({value:e.value,selected:true,disabled:e.disabled})}}));this.persistentSelectedOptions=i;if(t){this.ifxSelect.emit(this.persistentSelectedOptions)}}updateInitialParentStates(){const t=this.el.querySelectorAll("ifx-multiselect-option");const e=Array.from(t).map((t=>({element:t,instance:t["__stencil_instance"],depth:parseInt(t.getAttribute("data-level")||"0")}))).filter((t=>t.instance)).sort(((t,e)=>e.depth-t.depth));e.forEach((({instance:t})=>{if(t.hasChildren){this.updateParentState(t)}}))}updateParentState(t){const e=Array.from(t.el.children).filter((t=>t.tagName==="IFX-MULTISELECT-OPTION")).map((t=>t["__stencil_instance"])).filter((t=>t!==null));const i=e.filter((t=>t.selected)).length;const s=e.filter((t=>t.indeterminate)).length;const o=e.length;if(i===o&&s===0){t.selected=true;t.indeterminate=false}else if(i===0&&s===0){t.selected=false;t.indeterminate=false}else{t.selected=false;t.indeterminate=true}}async componentDidLoad(){if(!r(this.el)){const t=n();l("ifx-multiselect",await t)}setTimeout((()=>{this.positionDropdown()}),500);this.el.addEventListener("ifx-option-changed",(()=>{if(!this.pendingSelectionUpdate){this.pendingSelectionUpdate=true;requestAnimationFrame((()=>{this.updateSlotBasedSelections(true);setTimeout((()=>{this.pendingSelectionUpdate=false}),0)}))}}));setTimeout((()=>{this.updateSlotBasedSelections(false);this.updateInitialParentStates()}),100)}componentWillLoad(){this.loadInitialOptions()}updateInternalError(){this.internalError=this.error}updateInternalErrorMessage(){this.internalErrorMessage=this.errorMessage}onSelectionChange(t,e){const i=new FormData;t.forEach((t=>i.append(this.name,t.value)))}collapseAll(){const t=this.el.querySelectorAll("ifx-multiselect-option");t.forEach((t=>{const e=t["__stencil_instance"];if(e&&e.hasChildren){e.isExpanded=false}}))}expandAll(){const t=this.el.querySelectorAll("ifx-multiselect-option");t.forEach((t=>{const e=t["__stencil_instance"];if(e&&e.hasChildren){e.isExpanded=true}}))}selectAll(){this.resetSearch();const t=this.el.querySelectorAll("ifx-multiselect-option");t.forEach((t=>{const e=t["__stencil_instance"];if(e){if(e.hasChildren){e.isExpanded=true}else{e.selected=true}}}));setTimeout((()=>{this.updateInitialParentStates();this.updateSlotBasedSelections(false);this.ifxSelect.emit(this.persistentSelectedOptions)}),0)}async clearSelection(){const t=this.el.querySelectorAll("ifx-multiselect-option");t.forEach((t=>{const e=t["__stencil_instance"];if(e){e.selected=false;e.indeterminate=false;if(e.hasChildren){e.isExpanded=false}}}));this.persistentSelectedOptions=[];setTimeout((()=>{this.updateSlotBasedSelections(false);this.ifxSelect.emit(this.persistentSelectedOptions)}),0)}toggleDropdown(){this.dropdownOpen=!this.dropdownOpen;setTimeout((()=>{if(this.dropdownOpen){document.addEventListener("click",this.handleDocumentClick)}else{this.resetSearch()}this.ifxOpen.emit(this.dropdownOpen)}),0)}resetSearch(){this.searchTerm="";const t=this.el.shadowRoot.querySelector("ifx-search-field");if(t){t.value=""}const e=this.el.shadowRoot.querySelector(".ifx-multiselect-options");if(e){e.classList.remove("has-search-filter")}const i=this.el.querySelectorAll("ifx-multiselect-option");i.forEach((t=>{const e=new CustomEvent("ifx-search-filter",{detail:{searchTerm:"",isActive:false}});t.dispatchEvent(e)}))}handleWrapperClick(t){this.positionDropdown();if(t.currentTarget===t.target){this.toggleDropdown()}}handleKeyDown(t){if(this.disabled)return;if(!this.dropdownOpen){switch(t.code){case"Enter":case"Space":case"ArrowDown":t.preventDefault();this.toggleDropdown();break}return}switch(t.code){case"Escape":t.preventDefault();this.toggleDropdown();break;case"Enter":case"Space":const e=t.target;if(!e.closest(".ifx-multiselect-dropdown-functions")){t.preventDefault();this.toggleDropdown()}break;case"ArrowDown":case"ArrowUp":t.preventDefault();this.focusFirstOption();break}}focusFirstOption(){var t;const e=this.el.querySelector("ifx-multiselect-option:not(.search-hidden)");if(e){const i=(t=e.shadowRoot)===null||t===void 0?void 0:t.querySelector(".option-label");i===null||i===void 0?void 0:i.focus()}}renderSelectAll(){const t=this.el.querySelectorAll("ifx-multiselect-option");const e=Array.from(t).filter((t=>!t.hasChildren));const s=Array.from(t).filter((t=>!t.hasChildren&&t.selected));const o=e.length>0&&s.length===e.length;const n=t=>{if(t){t.preventDefault();t.stopPropagation()}if(o){this.clearSelection()}else{this.selectAll()}};return i("div",{class:"select-all-wrapper"},i("ifx-checkbox",{id:"selectAll",checked:o,size:"s","aria-label":this.ariaSelectAllLabel,onClick:n,onKeyDown:t=>{if(t.key==="Enter"||t.key===" "){t.preventDefault();t.stopPropagation();n(t)}}},this.selectAllLabel))}renderNoResultsMessage(){return i("div",{class:"ifx-multiselect-no-results"},i("div",{class:"no-results-content"},i("span",{class:"no-results-text"},this.noResultsMessage)))}render(){const t=this.persistentSelectedOptions.map((t=>{var e;const i=this.el.querySelector(`ifx-multiselect-option[value="${t.value}"]`);return((e=i===null||i===void 0?void 0:i.textContent)===null||e===void 0?void 0:e.trim())||t.value})).join(", ");const e=this.persistentSelectedOptions.length>0;let s=false;const o=this.el.querySelectorAll("ifx-multiselect-option");if(o.length>0){s=Array.from(o).every((t=>t.children.length===0))}return i("div",{class:`ifx-multiselect-container`,ref:t=>this.dropdownElement=t},this.label?i("div",{class:"ifx-label-wrapper"},i("span",null,this.label)):null,i("div",{class:`ifx-multiselect-wrapper\n        ${this.dropdownOpen?"active":""}\n        ${this.dropdownFlipped?"is-flipped":""}\n        ${this.internalError?"error":""}\n        ${this.disabled?"disabled":""}`,role:"combobox","aria-label":this.ariaMultiSelectLabel,"aria-labelledby":this.ariaMultiSelectLabelledBy||undefined,"aria-describedby":this.ariaMultiSelectDescribedBy||undefined,"aria-expanded":this.dropdownOpen,"aria-haspopup":"listbox","aria-disabled":this.disabled,tabindex:"0",onClick:this.disabled?undefined:t=>this.handleWrapperClick(t),onKeyDown:this.disabled?undefined:t=>this.handleKeyDown(t)},i("div",{class:`ifx-multiselect-input\n          ${e?"":"placeholder"}\n          `,onClick:this.disabled?undefined:()=>this.toggleDropdown()},e?t:this.placeholder),this.dropdownOpen&&i("div",{class:"ifx-multiselect-dropdown-menu"},(this.showSearch||this.showSelectAll||this.showExpandCollapse&&!s)&&i("div",{class:"ifx-multiselect-dropdown-functions",onClick:t=>t.stopPropagation()},this.showSearch&&i("div",{class:"ifx-multiselect-dropdown-search"},i("ifx-search-field",{class:"search-input",placeholder:this.searchPlaceholder,size:"s","show-delete-icon":"true","aria-label":this.ariaSearchLabel,onKeyDown:t=>{t.stopPropagation()},onIfxInput:t=>this.handleSearch(t.target),onFocus:()=>this.handleSearchFocus(true),onBlur:()=>this.handleSearchFocus(false)})),i("div",{class:"ifx-multiselect-dropdown-controls"},this.showSelectAll&&this.renderSelectAll(),this.showExpandCollapse&&!s&&i("div",{class:"expand-collapse-controls"},i("span",{class:"control-item",role:"button",tabIndex:0,"aria-label":this.ariaExpandAllLabel,onClick:t=>{t.stopPropagation();this.expandAll()},onKeyDown:t=>{if(t.key==="Enter"||t.key===" "){t.preventDefault();t.stopPropagation();this.expandAll()}}},this.expandLabel),i("span",{class:"control-item",role:"button",tabIndex:0,"aria-label":this.ariaCollapseAllLabel,onClick:t=>{t.stopPropagation();this.collapseAll()},onKeyDown:t=>{if(t.key==="Enter"||t.key===" "){t.preventDefault();t.stopPropagation();this.collapseAll()}}},this.collapseLabel)))),i("div",{class:"ifx-multiselect-options",role:"listbox","aria-multiselectable":"true"},i("slot",null),this.searchTerm&&this.showNoResultsMessage&&this.renderNoResultsMessage())),i("div",{class:"ifx-multiselect-icon-container"},this.persistentSelectedOptions.length>0&&i("div",{class:`ifx-clear-button ${!this.showClearButton?"hide":""}`,onClick:this.disabled?undefined:()=>this.clearSelection()},i("ifx-icon",{icon:"cRemove16"})),i("div",{class:"icon-wrapper-up",onClick:this.disabled?undefined:()=>this.toggleDropdown()},i("ifx-icon",{key:"icon-up",icon:"chevron-up-16"})),i("div",{class:"icon-wrapper-down",onClick:this.disabled?undefined:()=>this.toggleDropdown()},i("ifx-icon",{key:"icon-down",icon:"chevron-down-16"})))),this.internalError?i("div",{class:"ifx-error-message-wrapper"},i("span",null,this.internalErrorMessage)):null)}get el(){return s(this)}static get watchers(){return{error:["updateInternalError"],errorMessage:["updateInternalErrorMessage"],persistentSelectedOptions:["onSelectionChange"]}}};h.style=c;const f=":host{display:block;width:100%}.option{display:flex;flex-direction:column;position:relative;cursor:pointer;list-style:none}.option.option--expanded{position:relative}.option.option--has-children{position:relative}.option.option--has-children .option-item>.chevron-wrapper{display:flex}.option--disabled{cursor:not-allowed;pointer-events:none;color:#BFBBBB}.option.search-hidden{display:none !important}.option.search-match .option-item .option-label .search-highlight{font-weight:bold}.option-item{display:flex;flex-direction:row;align-items:center;white-space:nowrap;min-height:20px;padding:4px 16px;background-color:#FFFFFF;transition:background-color 0.2s ease-in-out}.option-item:hover{background-color:#F7F7F7}.option--disabled .option-item:hover{background-color:transparent}.option-children{display:block}.chevron-wrapper{display:none;align-items:center;justify-content:center;margin-right:8px;width:20px;height:20px;flex-shrink:0}.chevron-wrapper:focus{outline:none}.chevron-wrapper:focus-visible{outline:2px solid #0A8276;outline-offset:2px;border-radius:1px}.option--has-children .chevron-wrapper{display:flex}.chevron-wrapper .chevron{transition:transform 0.2s ease-in-out;color:#3C3A39}.chevron-wrapper .chevron.chevron--expanded{transform:rotate(90deg)}.chevron-wrapper .chevron.chevron--collapsed{transform:rotate(0deg)}.checkbox-wrapper{display:flex;align-items:center;margin-right:8px;flex-shrink:0}.option-label{flex-grow:1;display:flex;align-items:center;cursor:pointer;padding:2px 0;font-size:0.875rem}.option-label:focus{outline:none}.option-label:focus-visible{outline:2px solid #0A8276;outline-offset:2px;border-radius:1px}.option--disabled .option-label{cursor:not-allowed;color:#BFBBBB}";const d=class{constructor(e){t(this,e);this.selected=false;this.disabled=false;this.indeterminate=false;this.isExpanded=false;this.hasChildren=false;this.depth=0;this.searchTerm="";this.isSearchActive=false;this.isSearchDisabled=false;this.handleSearchFilter=t=>{const{searchTerm:e,isActive:i}=t.detail;this.searchTerm=e.toLowerCase();this.isSearchActive=i;requestAnimationFrame((()=>{this.updateSearchClasses()}))};this.handleCheckboxClick=t=>{if(this.disabled||this.isSearchActive&&this.isSearchDisabled)return;t.stopPropagation();let e;if(this.indeterminate){e=true}else{e=!this.selected}this.selected=e;this.indeterminate=false;if(this.hasChildren){this.isExpanded=e;requestAnimationFrame((()=>{this.selectAllChildren(e);this.expandAllChildren(e)}))}this.updateParentStates();this.notifyMultiselect()};this.handleHeaderClick=t=>{t.stopPropagation();if(!this.disabled&&!(this.isSearchActive&&this.isSearchDisabled)){this.handleClick(t)}}}componentWillLoad(){this.hasChildren=this.el.children.length>0;this.depth=this.calculateDepth();this.el.setAttribute("data-level",this.depth.toString());if(this.hasChildren){const t=this.hasAnySelectedChildren();if(t){this.isExpanded=true}}}componentDidLoad(){this.el["__stencil_instance"]=this;this.notifyMultiselect();this.el.addEventListener("ifx-search-filter",this.handleSearchFilter)}disconnectedCallback(){this.el.removeEventListener("ifx-search-filter",this.handleSearchFilter)}updateSearchClasses(){var t;const e=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector(".option");if(!e)return;if(!this.isSearchActive){e.classList.remove("search-hidden","search-parent","search-match");this.removeHighlighting();this.isSearchDisabled=false;return}const i=this.getTextContent().toLowerCase();const s=i.includes(this.searchTerm);const o=this.hasMatchingParent();requestAnimationFrame((()=>{const t=this.hasMatchingChildren();e.classList.remove("search-hidden","search-parent","search-match");this.isSearchDisabled=false;if(s&&!this.hasChildren){e.classList.add("search-match");this.highlightSearchTerm()}else if(s&&this.hasChildren){e.classList.add("search-match");this.highlightSearchTerm();this.isExpanded=true}else if(!s&&this.hasChildren&&t){e.classList.add("search-parent");this.removeHighlighting();this.isExpanded=true;this.isSearchDisabled=true}else if(o){e.classList.add("search-match");this.removeHighlighting()}else{e.classList.add("search-hidden");this.removeHighlighting()}}))}highlightSearchTerm(){var t;if(!this.searchTerm)return;const e=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector(".option-label");if(!e)return;const i=e.querySelector("slot");if(!i)return;this.removeHighlighting();const s=this.getTextContent();const o=this.searchTerm.toLowerCase();const n=s.toLowerCase();if(!n.includes(o))return;const l=n.indexOf(o);if(l===-1)return;const r=s.substring(0,l);const c=s.substring(l,l+o.length);const a=s.substring(l+o.length);const h=document.createElement("span");h.className="highlighted-text";if(r){h.appendChild(document.createTextNode(r))}const f=document.createElement("strong");f.className="search-highlight";f.textContent=c;h.appendChild(f);if(a){h.appendChild(document.createTextNode(a))}e.setAttribute("data-original-content","true");i.style.display="none";e.appendChild(h)}removeHighlighting(){var t;const e=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector(".option-label");if(!e)return;const i=e.querySelector("slot");const s=e.querySelector(".highlighted-text");if(s){e.removeChild(s)}if(i){i.style.display=""}e.removeAttribute("data-original-content")}getTextContent(){let t="";Array.from(this.el.childNodes).forEach((e=>{var i;if(e.nodeType===Node.TEXT_NODE){t+=((i=e.textContent)===null||i===void 0?void 0:i.trim())||""}}));return t||this.value||""}hasMatchingChildren(){if(!this.hasChildren)return false;const t=Array.from(this.el.children).filter((t=>t.tagName==="IFX-MULTISELECT-OPTION"));return t.some((t=>{const e=t["__stencil_instance"];if(!e)return false;const i=e.getTextContent().toLowerCase();const s=i.includes(this.searchTerm);const o=e.hasMatchingChildren();return s||o}))}hasMatchingParent(){let t=this.el.parentElement;while(t&&t.tagName==="IFX-MULTISELECT-OPTION"){const e=t["__stencil_instance"];if(e){const t=e.getTextContent().toLowerCase();if(t.includes(this.searchTerm)){return true}}t=t.parentElement}return false}calculateDepth(){let t=0;let e=this.el.parentElement;while(e&&e.tagName!=="IFX-MULTISELECT"){if(e.tagName==="IFX-MULTISELECT-OPTION"){t++}e=e.parentElement}return t}handleClick(t){if(this.disabled||this.isSearchActive&&this.isSearchDisabled)return;t.stopPropagation();if(t.type==="click"&&t.target.closest(".chevron-wrapper")){this.toggleExpansion();return}let e;if(this.indeterminate){e=true}else{e=!this.selected}this.selected=e;this.indeterminate=false;if(this.hasChildren){this.isExpanded=e;requestAnimationFrame((()=>{this.selectAllChildren(e);this.expandAllChildren(e)}))}this.updateParentStates();this.notifyMultiselect()}handleKeyDown(t){if(this.disabled||this.isSearchActive&&this.isSearchDisabled)return;const e=t.target;if(e.closest(".chevron-wrapper")||e.closest(".checkbox-wrapper")){return}if(t.key!=="ArrowUp"&&t.key!=="ArrowDown"){t.stopPropagation()}if(t.key==="ArrowRight"&&this.hasChildren){this.isExpanded=true}if(t.key==="ArrowLeft"&&this.hasChildren){this.isExpanded=false}}notifyMultiselect(){const t=new CustomEvent("ifx-option-changed",{bubbles:true,detail:{value:this.value,selected:this.selected,indeterminate:this.indeterminate}});this.el.dispatchEvent(t)}selectAllChildren(t){const e=Array.from(this.el.children).filter((t=>t.tagName==="IFX-MULTISELECT-OPTION"));e.forEach((e=>{var i;const s=e["__stencil_instance"];if(s){s.selected=t;s.indeterminate=false;if(s.hasChildren){s.isExpanded=t;s.selectAllChildren(t)}(i=s.notifyMultiselect)===null||i===void 0?void 0:i.call(s)}}))}expandAllChildren(t){const e=Array.from(this.el.children).filter((t=>t.tagName==="IFX-MULTISELECT-OPTION"));e.forEach((e=>{const i=e["__stencil_instance"];if(i&&i.hasChildren){i.isExpanded=t;i.expandAllChildren(t)}}))}updateParentStates(){var t;let e=this.el.parentElement;while(e&&e.tagName==="IFX-MULTISELECT-OPTION"){const i=e["__stencil_instance"];if(!i){e=e.parentElement;continue}const s=Array.from(e.children).filter((t=>t.tagName==="IFX-MULTISELECT-OPTION")).map((t=>t["__stencil_instance"])).filter((t=>t!==null));const o=s.filter((t=>t.selected)).length;const n=s.filter((t=>t.indeterminate)).length;const l=s.length;if(o===l&&n===0){i.selected=true;i.indeterminate=false}else if(o===0&&n===0){i.selected=false;i.indeterminate=false}else{i.selected=false;i.indeterminate=true}(t=i.notifyMultiselect)===null||t===void 0?void 0:t.call(i);e=e.parentElement}}toggleExpansion(){this.isExpanded=!this.isExpanded}hasAnySelectedChildren(){const t=Array.from(this.el.children).filter((t=>t.tagName==="IFX-MULTISELECT-OPTION"));return t.some((t=>{const e=t.hasAttribute("selected");const i=this.checkForSelectedDescendants(t);return e||i}))}checkForSelectedDescendants(t){const e=Array.from(t.children).filter((t=>t.tagName==="IFX-MULTISELECT-OPTION"));return e.some((t=>{const e=t.hasAttribute("selected");const i=this.checkForSelectedDescendants(t);return e||i}))}render(){let t=false;const e=this.el.closest("ifx-multiselect");if(e){const i=Array.from(e.querySelectorAll("ifx-multiselect-option"));t=i.every((t=>t.children.length===0))}const s=this.depth*28+16;const n=this.hasChildren?0:28;let l=s+n;const r=t?undefined:{paddingLeft:`${l}px`};return i(o,{key:"53ab714e5bc86c83569b2c1cf6f479405f528880"},i("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},i("div",{key:"3052a22b111e61ac0e48ecd64460c35aa2b06fea",class:"option-item",style:r},i("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:t=>{t.stopPropagation();this.toggleExpansion()},onKeyDown:t=>{if(t.key==="Enter"||t.key===" "){t.preventDefault();t.stopPropagation();this.toggleExpansion()}}},this.hasChildren&&i("ifx-icon",{key:"033471dbc46d73d82f0ab44a07a1dfa5fd9625fb",class:`chevron ${this.isExpanded?"chevron--expanded":"chevron--collapsed"}`,icon:"chevron-right-16"})),i("div",{key:"d6fc07097a390e9e29f8c4dcc55c90f755b10fc9",class:"checkbox-wrapper",onClick:t=>t.stopPropagation()},i("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:t=>{if(t.key==="Enter"||t.key===" "){t.preventDefault();t.stopPropagation();this.handleCheckboxClick(t)}}})),i("div",{key:"e09de6a2559a8334553abb9d45b901c1459a2da7",class:"option-label",onClick:this.handleHeaderClick,tabIndex:-1},i("slot",{key:"941edb6987ef6add787211833e0e1aad0d5b9066"}))),this.isExpanded&&i("div",{key:"b5248d64937e418587f1c807e434874be4952f48",class:"option-children"},i("slot",{key:"8e6e69e5000661632c114279a5afc5c80f361b8e",name:"children"}))))}get el(){return s(this)}};d.style=f;export{h as ifx_multiselect,d as ifx_multiselect_option};
-//# sourceMappingURL=p-b4d19492.entry.js.map

package/dist/infineon-design-system-stencil/p-b4d19492.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["multiselectCss","debounce","func","wait","timeout","executedFunction","args","later","clearTimeout","setTimeout","Multiselect","constructor","hostRef","this","disabled","error","errorMessage","label","placeholder","showSearch","showSelectAll","showClearButton","showExpandCollapse","noResultsMessage","showNoResultsMessage","searchPlaceholder","selectAllLabel","expandLabel","collapseLabel","ariaMultiSelectLabel","ariaMultiSelectLabelledBy","ariaMultiSelectDescribedBy","ariaSearchLabel","ariaClearLabel","ariaToggleLabel","ariaSelectAllLabel","ariaExpandAllLabel","ariaCollapseAllLabel","internalError","persistentSelectedOptions","dropdownOpen","searchTerm","handleSearch","targetElement","value","toLowerCase","isSearchActive","wrapper","el","shadowRoot","querySelector","classList","remove","searchField","searchFieldHasFocus","matches","add","optionsContainer","requestAnimationFrame","allOptions","querySelectorAll","forEach","option","searchEvent","CustomEvent","detail","isActive","dispatchEvent","visibleCount","style","window","getComputedStyle","rect","getBoundingClientRect","display","visibility","opacity","height","pendingSelectionUpdate","handleDocumentClick","event","path","composedPath","includes","dropdownElement","document","removeEventListener","resetSearch","ifxOpen","emit","parseChildOptions","options","childElements","Array","from","children","child","index","tagName","parseOptionElement","push","element","getAttribute","selected","hasAttribute","indeterminate","nestedOptions","filter","map","childIndex","opt","length","loadInitialOptions","internalErrorMessage","initiallySelected","collectSelectedOptions","initiallySelectedNotInState","init","some","selectedOptions","concat","collectLeafOptions","existingOption","leafOptions","handleSearchFocus","hasFocus","positionDropdown","wrapperRect","_a","spaceBelow","innerHeight","bottom","spaceAbove","top","dropdownFlipped","updateSlotBasedSelections","emitEvent","allOptionElements","selectedLeafOptions","optionEl","instance","hasChildren","ifxSelect","updateInitialParentStates","optionsByDepth","depth","parseInt","item","sort","a","b","updateParentState","parentInstance","directChildren","selectedCount","indeterminateCount","totalCount","componentDidLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","addEventListener","componentWillLoad","updateInternalError","updateInternalErrorMessage","onSelectionChange","newValue","_","formData","FormData","append","name","collapseAll","isExpanded","expandAll","selectAll","clearSelection","toggleDropdown","handleWrapperClick","currentTarget","target","handleKeyDown","code","preventDefault","closest","focusFirstOption","firstOption","labelElement","focus","renderSelectAll","allSelected","toggleSelectAll","stopPropagation","h","class","id","checked","size","onClick","onKeyDown","e","key","renderNoResultsMessage","render","selectedOptionsLabels","optionElement","textContent","trim","join","hasSelections","isFlatMultiselect","every","ref","role","undefined","tabindex","onIfxInput","onFocus","onBlur","tabIndex","icon","multiselectOptionCss","MultiselectOption","isSearchDisabled","handleSearchFilter","updateSearchClasses","handleCheckboxClick","newSelectedState","selectAllChildren","expandAllChildren","updateParentStates","notifyMultiselect","handleHeaderClick","handleClick","calculateDepth","setAttribute","toString","hasSelectedChildren","hasAnySelectedChildren","disconnectedCallback","optionDiv","removeHighlighting","getTextContent","matchesSearch","hasMatchingParent","hasMatchingChildren","highlightSearchTerm","slotElement","originalText","searchTermLower","originalTextLower","searchIndex","indexOf","beforeMatch","substring","matchText","afterMatch","highlightedContent","createElement","className","appendChild","createTextNode","boldElement","highlightedElement","removeChild","removeAttribute","text","childNodes","node","nodeType","Node","TEXT_NODE","childOptions","childInstance","childText","childMatches","grandChildrenMatch","parent","parentElement","parentText","type","toggleExpansion","updateEvent","bubbles","call","expanded","siblings","sibling","hasSelected","hasSelectedDescendants","checkForSelectedDescendants","nestedChild","isSelected","hasSelectedNested","parentMultiselect","basePadding","additionalPadding","totalPadding","optionItemStyle","paddingLeft","Host"],"sources":["src/components/select/multi-select/multiselect.scss?tag=ifx-multiselect&encapsulation=shadow","src/components/select/multi-select/multiselect.tsx","src/components/select/multi-select/multiselect-option.scss?tag=ifx-multiselect-option&encapsulation=shadow","src/components/select/multi-select/multiselect-option.tsx"],"sourcesContent":["// @import '~choices.js/public/assets/styles/choices.css';\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n.ifx-multiselect-container {\n  position: relative;\n  box-sizing: border-box;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n  &:hover {\n    cursor: pointer;\n  }\n\n  .ifx-label-wrapper {\n    font-size: tokens.$ifxFontSizeM;\n    line-height: tokens.$ifxLineHeightM;\n    white-space: pre-wrap;\n    word-wrap: break-word;\n    overflow-wrap: anywhere;\n    max-width: 100%;\n  }\n\n  .ifx-error-message-wrapper {\n    color: #CD002F;\n    font-size: tokens.$ifxFontSizeXs;\n    line-height: tokens.$ifxLineHeightXs;\n    white-space: pre-wrap;\n    word-wrap: break-word;\n    overflow-wrap: anywhere;\n    max-width: 100%;\n  }\n\n  .ifx-multiselect-wrapper {\n    background-color: tokens.$ifxColorBaseWhite;\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    border: 1px solid tokens.$ifxColorEngineering400;\n    border-radius: tokens.$ifxBorderRadius12;\n    width: 100%;\n    font-weight: 400;\n    font-style: normal;\n    height: 40px;\n    line-height: 24px;\n    padding: 8px 16px;\n    font-size: tokens.$ifxFontSizeM;\n    line-height: tokens.$ifxLineHeightM;\n\n    &:focus-visible {\n      outline: none;\n    }\n\n    &:focus-visible:not(.active):not(:active) {\n      outline: none;\n\n      &::before {\n        content: '';\n        position: absolute;\n        width: calc(100% + 4px);\n        height: calc(100% + 4px);\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        border: 2px solid tokens.$ifxColorOcean500;\n        border-radius: 2px;\n\n      }\n    }\n\n    &.disabled {\n      background: tokens.$ifxColorEngineering200;\n      color: #575352;\n      border-color: #575352;\n      cursor: default;\n      -webkit-user-select: none;\n      -ms-user-select: none;\n      user-select: none;\n    }\n\n    &.error {\n      border-color: #CD002F;\n    }\n\n    &:hover:not(.focus, :focus) {\n      border-color: tokens.$ifxColorEngineering500;\n    }\n\n    &.active {\n      border-color: tokens.$ifxColorOcean500 !important; // Active border color\n\n      & .icon-wrapper-up {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        padding-left: tokens.$ifxSpace100;\n      }\n\n      & .icon-wrapper-down {\n        display: none\n      }\n    }\n\n\n    & .icon-wrapper-up {\n      display: none;\n    }\n\n    & .icon-wrapper-down {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding-left: tokens.$ifxSpace100;\n    }\n\n    &.is-flipped {\n      .ifx-multiselect-dropdown-menu {\n        top: auto;\n        bottom: 100%;\n      }\n    }\n  }\n\n  .ifx-multiselect-input {\n    flex-grow: 1;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    &.placeholder {\n      opacity: 0.5;\n    }\n\n  }\n\n\n  .ifx-multiselect-icon-container {\n    margin-left: auto;\n    display: flex;\n    align-items: center;\n    gap: tokens.$ifxSpace100;\n\n    .ifx-multiselect-icon-container {\n      display: flex;\n    }\n\n    .icon-wrapper {\n      display: flex;\n      align-items: center;\n      transition: transform 0.2s ease-in-out;\n    }\n\n    .icon-wrapper--open {\n      transform: rotate(180deg);\n    }\n  }\n\n  .ifx-clear-button {\n    display: flex;\n    align-items: center;\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  .ifx-multiselect-dropdown-menu {\n    box-sizing: border-box;\n    position: absolute;\n    top: 100%;\n    left: 0;\n    width: 100%;\n    margin-top: tokens.$ifxSpace50;\n    border: 1px solid tokens.$ifxColorEngineering200;\n    background-color: #fff;\n    box-shadow: 0px 6px 9px 0px rgba(29, 29, 29, 0.10);\n    max-height: 300px;\n    z-index: 1000;\n    display: flex;\n    flex-direction: column;\n  }\n}\n\n.ifx-multiselect-dropdown-functions {\n  padding: tokens.$ifxSpace150 tokens.$ifxSpace200;\n  border-bottom: 1px solid tokens.$ifxColorEngineering200;\n  flex-shrink: 0;\n}\n\n.ifx-multiselect-dropdown-search {\n  margin-bottom: tokens.$ifxSpace150;\n}\n\n.ifx-multiselect-dropdown-controls {\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: space-between;\n  gap: tokens.$ifxSpace100;\n\n  .select-all-wrapper {\n    display: flex;\n  }\n\n  .expand-collapse-controls {\n    display: flex;\n    gap: tokens.$ifxSpace150;\n  }\n\n  .control-item {\n    font-size: tokens.$ifxFontSizeS;\n    line-height: tokens.$ifxLineHeightS;\n\n    &:hover {\n      color: tokens.$ifxColorOcean500;\n    }\n\n    &:active {\n      color: tokens.$ifxColorOcean600;\n    }\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}\n\n.ifx-multiselect-options {\n  flex: 1;\n  overflow-y: auto;\n  padding-top: tokens.$ifxSpace150;\n  padding-bottom: tokens.$ifxSpace150;\n\n  &.show-no-results {\n    .ifx-multiselect-no-results {\n      display: block;\n    }\n  }\n}\n\n.ifx-multiselect-no-results {\n  padding-left: tokens.$ifxSpace200;\n  padding-right: tokens.$ifxSpace200;\n  display: none;\n}\n\n","import { Component, Prop, State, Event, EventEmitter, Element, h, Watch, AttachInternals, Method } from '@stencil/core';\nimport { trackComponent } from '../../../global/utils/tracking'; \nimport { isNestedInIfxComponent } from '../../../global/utils/dom-utils';\nimport { detectFramework } from '../../../global/utils/framework-detection';\nimport { Option } from './interfaces';\n\nfunction debounce(func, wait) {\n  let timeout;\n  return function executedFunction(...args) {\n    const later = () => {\n      clearTimeout(timeout);\n      func(...args);\n    };\n    clearTimeout(timeout);\n    timeout = setTimeout(later, wait);\n  };\n}\n\n@Component({\n  tag: 'ifx-multiselect',\n  styleUrl: 'multiselect.scss',\n  shadow: true,\n  // formAssociated: true\n})\n\nexport class Multiselect {\n  @Prop() name: string;\n  @Prop() disabled: boolean = false;\n  @Prop() error: boolean = false;\n  @Prop() errorMessage: string = \"Error\";\n  @Prop() label: string = \"\";\n  @Prop() placeholder: string = \"\";\n  @Prop() showSearch: boolean = true;\n  @Prop() showSelectAll: boolean = true;\n  @Prop() showClearButton: boolean = true;\n  @Prop() showExpandCollapse: boolean = true;\n  @Prop() noResultsMessage: string = \"No results found.\";\n  @Prop() showNoResultsMessage: boolean = true;\n  @Prop() searchPlaceholder: string = \"Search\";\n  @Prop() selectAllLabel: string = \"Select all\";\n  @Prop() expandLabel: string = \"Expand\";\n  @Prop() collapseLabel: string = \"Collapse\";\n  @Prop() ariaMultiSelectLabel: string = \"Multi-select dropdown\";\n  @Prop() ariaMultiSelectLabelledBy: string = \"\";\n  @Prop() ariaMultiSelectDescribedBy: string = \"\";\n  @Prop() ariaSearchLabel: string = \"Search options\";\n  @Prop() ariaClearLabel: string = \"Clear all selections\";\n  @Prop() ariaToggleLabel: string = \"Toggle dropdown\";\n  @Prop() ariaSelectAllLabel: string = \"Select all options\";\n  @Prop() ariaExpandAllLabel: string = \"Expand all categories\";\n  @Prop() ariaCollapseAllLabel: string = \"Collapse all categories\";\n\n  @State() internalError: boolean = false;\n  @State() internalErrorMessage: string;\n  @State() persistentSelectedOptions: Option[] = [];\n  @State() dropdownOpen = false;\n  @State() dropdownFlipped: boolean;\n  @State() searchTerm: string = '';\n\n  @Event() ifxSelect: EventEmitter;\n  @Event() ifxOpen: EventEmitter;\n\n  @Element() el: HTMLElement;\n  dropdownElement!: HTMLElement;\n\n  @AttachInternals() internals: ElementInternals;\n  private parseChildOptions(): Option[] {\n    const options: Option[] = [];\n    const childElements = Array.from(this.el.children);\n\n    childElements.forEach((child, index) => {\n      if (child.tagName === 'IFX-MULTISELECT-OPTION') {\n        const option = this.parseOptionElement(child as HTMLElement, index);\n        if (option) {\n          options.push(option);\n        }\n      }\n    });\n\n    return options;\n  }\n\n  private parseOptionElement(element: HTMLElement, index: number): Option | null {\n    const value = element.getAttribute('value') || `option-${index}`;\n    const selected = element.hasAttribute('selected');\n    const disabled = element.hasAttribute('disabled');\n    const indeterminate = element.hasAttribute('indeterminate');\n\n    const option: Option = {\n      value,\n      selected,\n      disabled,\n      indeterminate\n    };\n\n    const nestedOptions = Array.from(element.children)\n      .filter(child => child.tagName === 'IFX-MULTISELECT-OPTION')\n      .map((child, childIndex) => this.parseOptionElement(child as HTMLElement, childIndex))\n      .filter(opt => opt !== null) as Option[];\n\n    if (nestedOptions.length > 0) {\n      option.children = nestedOptions;\n    }\n\n    return option;\n  }\n\n  loadInitialOptions() {\n    this.internalError = this.error;\n    this.internalErrorMessage = this.errorMessage;\n\n    const allOptions = this.parseChildOptions();\n    const initiallySelected = this.collectSelectedOptions(allOptions);\n    const initiallySelectedNotInState = initiallySelected.filter(init =>\n      !this.persistentSelectedOptions.some(opt => opt.value == init.value)\n    );\n    this.persistentSelectedOptions = [...this.persistentSelectedOptions, ...initiallySelectedNotInState];\n  }\n\n  private collectSelectedOptions(options: Option[]): Option[] {\n    let selectedOptions: Option[] = [];\n\n    for (const option of options) {\n      if (option.selected) {\n        if (option.children && option.children.length > 0) {\n          selectedOptions = selectedOptions.concat(this.collectLeafOptions(option.children));\n        } else {\n          if (!selectedOptions.some(existingOption => existingOption.value === option.value)) {\n            selectedOptions.push(option);\n          }\n        }\n      } else {\n        if (option.children && option.children.length > 0) {\n          selectedOptions = selectedOptions.concat(this.collectSelectedOptions(option.children));\n        }\n      }\n    }\n\n    return selectedOptions;\n  }\n\n  private collectLeafOptions(children: Option[]): Option[] {\n    let leafOptions = [];\n\n    for (const child of children) {\n      if (child.children && child.children.length > 0) {\n        leafOptions = leafOptions.concat(this.collectLeafOptions(child.children));\n      } else {\n        leafOptions.push(child);\n      }\n    }\n    return leafOptions;\n  }\n\n  handleSearch = debounce((targetElement: HTMLInputElement) => {\n    const searchTerm = targetElement.value.toLowerCase();\n    const isSearchActive = searchTerm !== '';\n\n    this.searchTerm = searchTerm;\n\n    const wrapper = this.el.shadowRoot.querySelector('.ifx-multiselect-wrapper');\n    if (wrapper) {\n      if (isSearchActive) {\n        wrapper.classList.remove('active');\n      } else {\n        const searchField = this.el.shadowRoot.querySelector('ifx-search-field');\n        const searchFieldHasFocus = searchField && searchField.matches(':focus-within');\n        if (!searchFieldHasFocus) {\n          wrapper.classList.add('active');\n        }\n      }\n    }\n\n    const optionsContainer = this.el.shadowRoot.querySelector('.ifx-multiselect-options');\n    if (optionsContainer) {\n      if (isSearchActive) {\n        optionsContainer.classList.add('has-search-filter');\n      } else {\n        optionsContainer.classList.remove('has-search-filter');\n      }\n    }\n\n    requestAnimationFrame(() => {\n      const allOptions = this.el.querySelectorAll('ifx-multiselect-option');\n      allOptions.forEach(option => {\n        const searchEvent = new CustomEvent('ifx-search-filter', {\n          detail: { searchTerm, isActive: isSearchActive }\n        });\n        option.dispatchEvent(searchEvent);\n      });\n\n      if (isSearchActive) {\n        setTimeout(() => {\n          const allOptions = this.el.querySelectorAll('ifx-multiselect-option');\n          let visibleCount = 0;\n\n          allOptions.forEach(option => {\n            const style = window.getComputedStyle(option);\n            const rect = option.getBoundingClientRect();\n\n            if (style.display !== 'none' &&\n                style.visibility !== 'hidden' &&\n                style.opacity !== '0' &&\n                rect.height > 0) {\n              visibleCount++;\n            }\n          });\n\n          const optionsContainer = this.el.shadowRoot.querySelector('.ifx-multiselect-options');\n          if (optionsContainer) {\n            if (visibleCount === 0) {\n              optionsContainer.classList.add('show-no-results');\n            } else {\n              optionsContainer.classList.remove('show-no-results');\n            }\n          }\n        }, 200);\n      } else {\n        const optionsContainer = this.el.shadowRoot.querySelector('.ifx-multiselect-options');\n        if (optionsContainer) {\n          optionsContainer.classList.remove('show-no-results');\n        }\n      }\n    });\n  }, 150);\n\n  private handleSearchFocus(hasFocus: boolean) {\n    const wrapper = this.el.shadowRoot.querySelector('.ifx-multiselect-wrapper');\n    if (wrapper) {\n      if (hasFocus || this.searchTerm !== '') {\n        wrapper.classList.remove('active');\n      } else {\n        wrapper.classList.add('active');\n      }\n    }\n  }\n\n  positionDropdown() {\n    const wrapperRect = this.el.shadowRoot.querySelector('.ifx-multiselect-wrapper')?.getBoundingClientRect();\n    const spaceBelow = window.innerHeight - wrapperRect.bottom;\n    const spaceAbove = wrapperRect.top;\n\n    if ((spaceAbove > spaceBelow && wrapperRect.height > spaceBelow) || (wrapperRect.bottom > window.innerHeight)) {\n      this.dropdownFlipped = true;\n    } else {\n      this.dropdownFlipped = false;\n    }\n  }\n\n  private pendingSelectionUpdate = false;\n  public updateSlotBasedSelections(emitEvent: boolean = false) {\n    const allOptionElements = this.el.querySelectorAll('ifx-multiselect-option');\n    const selectedLeafOptions: Option[] = [];\n\n    allOptionElements.forEach((optionEl: any) => {\n      const instance = optionEl['__stencil_instance'];\n      if (instance && instance.selected && !instance.hasChildren) {\n        selectedLeafOptions.push({\n          value: instance.value,\n          selected: true,\n          disabled: instance.disabled\n        });\n      }\n    });\n\n    this.persistentSelectedOptions = selectedLeafOptions;\n\n    if (emitEvent) {\n      this.ifxSelect.emit(this.persistentSelectedOptions);\n    }\n  }\n\n  private updateInitialParentStates() {\n    const allOptionElements = this.el.querySelectorAll('ifx-multiselect-option');\n    const optionsByDepth = Array.from(allOptionElements)\n      .map(el => ({\n        element: el,\n        instance: (el as any)['__stencil_instance'],\n        depth: parseInt(el.getAttribute('data-level') || '0')\n      }))\n      .filter(item => item.instance)\n      .sort((a, b) => b.depth - a.depth);\n\n    optionsByDepth.forEach(({ instance }) => {\n      if (instance.hasChildren) {\n        this.updateParentState(instance);\n      }\n    });\n  }\n\n  private updateParentState(parentInstance: any) {\n    const directChildren = Array.from(parentInstance.el.children as HTMLCollection)\n      .filter((child: Element) => child.tagName === 'IFX-MULTISELECT-OPTION')\n      .map(child => (child as any)['__stencil_instance'])\n      .filter(instance => instance !== null);\n\n    const selectedCount = directChildren.filter(child => child.selected).length;\n    const indeterminateCount = directChildren.filter(child => child.indeterminate).length;\n    const totalCount = directChildren.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\n  async componentDidLoad() {\n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-multiselect', await framework)\n    }\n    setTimeout(() => {\n      this.positionDropdown();\n    }, 500);\n\n    this.el.addEventListener('ifx-option-changed', () => {\n      if (!this.pendingSelectionUpdate) {\n        this.pendingSelectionUpdate = true;\n        requestAnimationFrame(() => {\n          this.updateSlotBasedSelections(true);\n          setTimeout(() => {\n            this.pendingSelectionUpdate = false;\n          }, 0);\n        });\n      }\n    });\n\n    setTimeout(() => {\n      this.updateSlotBasedSelections(false);\n      this.updateInitialParentStates();\n    }, 100);\n  }\n\n  componentWillLoad() {\n    this.loadInitialOptions();\n  }\n\n  @Watch('error')\n  updateInternalError() {\n    this.internalError = this.error;\n  }\n\n  @Watch('errorMessage')\n  updateInternalErrorMessage() {\n    this.internalErrorMessage = this.errorMessage;\n  }\n\n  @Watch('persistentSelectedOptions')\n  onSelectionChange(newValue: Option[], _: Option[]) {\n    const formData = new FormData();\n    newValue.forEach(option => formData.append(this.name, option.value));\n    //this.internals.setFormValue(formData);\n  }\n  collapseAll() {\n    const allOptionElements = this.el.querySelectorAll('ifx-multiselect-option');\n    allOptionElements.forEach((optionEl: any) => {\n      const instance = optionEl['__stencil_instance'];\n      if (instance && instance.hasChildren) {\n        instance.isExpanded = false;\n      }\n    });\n  }\n\n  expandAll() {\n    const allOptionElements = this.el.querySelectorAll('ifx-multiselect-option');\n    allOptionElements.forEach((optionEl: any) => {\n      const instance = optionEl['__stencil_instance'];\n      if (instance && instance.hasChildren) {\n        instance.isExpanded = true;\n      }\n    });\n  }\n\n  selectAll() {\n    this.resetSearch();\n\n    const allOptionElements = this.el.querySelectorAll('ifx-multiselect-option');\n\n    allOptionElements.forEach((optionEl: any) => {\n      const instance = optionEl['__stencil_instance'];\n      if (instance) {\n        if (instance.hasChildren) {\n          instance.isExpanded = true;\n        } else {\n          instance.selected = true;\n        }\n      }\n    });\n\n    setTimeout(() => {\n      this.updateInitialParentStates();\n      this.updateSlotBasedSelections(false);\n      this.ifxSelect.emit(this.persistentSelectedOptions);\n    }, 0);\n  }\n\n  @Method()\n  async clearSelection() {\n    const allOptionElements = this.el.querySelectorAll('ifx-multiselect-option');\n    allOptionElements.forEach((optionEl: any) => {\n      const instance = optionEl['__stencil_instance'];\n      if (instance) {\n        instance.selected = false;\n        instance.indeterminate = false;\n        if (instance.hasChildren) {\n          instance.isExpanded = false;\n        }\n      }\n    });\n\n    this.persistentSelectedOptions = [];\n\n    setTimeout(() => {\n      this.updateSlotBasedSelections(false);\n      this.ifxSelect.emit(this.persistentSelectedOptions);\n    }, 0);\n  }\n\n  handleDocumentClick = (event: Event) => {\n    const path = event.composedPath();\n    if (!path.includes(this.dropdownElement)) {\n      this.dropdownOpen = false;\n      document.removeEventListener('click', this.handleDocumentClick);\n      this.resetSearch();\n      this.ifxOpen.emit(this.dropdownOpen);\n    }\n  }\n\n  toggleDropdown() {\n    this.dropdownOpen = !this.dropdownOpen;\n    setTimeout(() => {\n      if (this.dropdownOpen) {\n        document.addEventListener('click', this.handleDocumentClick);\n      } else {\n        this.resetSearch();\n      }\n      this.ifxOpen.emit(this.dropdownOpen);\n    }, 0);\n  }\n\n  private resetSearch() {\n    this.searchTerm = '';\n\n    const searchField = this.el.shadowRoot.querySelector('ifx-search-field') as any;\n    if (searchField) {\n      searchField.value = '';\n    }\n\n    const optionsContainer = this.el.shadowRoot.querySelector('.ifx-multiselect-options');\n    if (optionsContainer) {\n      optionsContainer.classList.remove('has-search-filter');\n    }\n\n    const allOptions = this.el.querySelectorAll('ifx-multiselect-option');\n    allOptions.forEach(option => {\n      const searchEvent = new CustomEvent('ifx-search-filter', {\n        detail: { searchTerm: '', isActive: false }\n      });\n      option.dispatchEvent(searchEvent);\n    });\n  }\n\n  handleWrapperClick(event: MouseEvent) {\n    this.positionDropdown();\n\n    if (event.currentTarget === event.target) {\n      this.toggleDropdown();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    if (this.disabled) return;\n\n    // If dropdown is closed, only allow opening\n    if (!this.dropdownOpen) {\n      switch (event.code) {\n        case 'Enter':\n        case 'Space':\n        case 'ArrowDown':\n          event.preventDefault();\n          this.toggleDropdown();\n          break;\n      }\n      return;\n    }\n\n    // Dropdown is open - handle navigation and controls\n    switch (event.code) {\n      case 'Escape':\n        event.preventDefault();\n        this.toggleDropdown();\n        break;\n      case 'Enter':\n      case 'Space':\n        // Don't close dropdown when pressing space/enter in controls area\n        const target = event.target as HTMLElement;\n        if (!target.closest('.ifx-multiselect-dropdown-functions')) {\n          event.preventDefault();\n          this.toggleDropdown();\n        }\n        break;\n      case 'ArrowDown':\n      case 'ArrowUp':\n        // Focus first/last option for navigation\n        event.preventDefault();\n        this.focusFirstOption();\n        break;\n    }\n  }\n\n  private focusFirstOption() {\n    const firstOption = this.el.querySelector('ifx-multiselect-option:not(.search-hidden)');\n    if (firstOption) {\n      const labelElement = firstOption.shadowRoot?.querySelector('.option-label') as HTMLElement;\n      labelElement?.focus();\n    }\n  }\n\n  private renderSelectAll() {\n    const allOptionElements = this.el.querySelectorAll('ifx-multiselect-option');\n    const leafOptions = Array.from(allOptionElements).filter((el: any) => !el.hasChildren);\n    const selectedLeafOptions = Array.from(allOptionElements).filter((el: any) => !el.hasChildren && el.selected);\n\n    const allSelected = leafOptions.length > 0 && selectedLeafOptions.length === leafOptions.length;\n\n    const toggleSelectAll = (event?: Event) => {\n      if (event) {\n        event.preventDefault();\n        event.stopPropagation();\n      }\n\n      if (allSelected) {\n        this.clearSelection();\n      } else {\n        this.selectAll();\n      }\n    };\n\n    return (\n      <div class=\"select-all-wrapper\">\n        <ifx-checkbox\n          id='selectAll'\n          checked={allSelected}\n          size=\"s\"\n          aria-label={this.ariaSelectAllLabel}\n          onClick={toggleSelectAll}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault();\n              e.stopPropagation();\n              toggleSelectAll(e);\n            }\n          }}\n        >\n          {this.selectAllLabel}\n        </ifx-checkbox>\n      </div>\n    );\n  }\n\n  private renderNoResultsMessage() {\n    return (\n      <div class=\"ifx-multiselect-no-results\">\n        <div class=\"no-results-content\">\n          <span class=\"no-results-text\">{this.noResultsMessage}</span>\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    const selectedOptionsLabels = this.persistentSelectedOptions\n      .map((option) => {\n        const optionElement = this.el.querySelector(`ifx-multiselect-option[value=\"${option.value}\"]`);\n        return optionElement?.textContent?.trim() || option.value;\n      })\n      .join(', ');\n\n    const hasSelections = this.persistentSelectedOptions.length > 0;\n\n    let isFlatMultiselect = false;\n    const allOptionElements = this.el.querySelectorAll('ifx-multiselect-option');\n    if (allOptionElements.length > 0) {\n      isFlatMultiselect = Array.from(allOptionElements).every(option => option.children.length === 0);\n    }\n\n    return (\n      <div class={`ifx-multiselect-container`} ref={el => this.dropdownElement = el as HTMLElement}>\n        {\n          this.label ?\n            <div class=\"ifx-label-wrapper\">\n              <span>{this.label}</span>\n            </div> : null\n        }\n        <div class={`ifx-multiselect-wrapper\n        ${this.dropdownOpen ? 'active' : ''}\n        ${this.dropdownFlipped ? 'is-flipped' : ''}\n        ${this.internalError ? 'error' : \"\"}\n        ${this.disabled ? 'disabled' : \"\"}`}\n          role=\"combobox\"\n          aria-label={this.ariaMultiSelectLabel}\n          aria-labelledby={this.ariaMultiSelectLabelledBy || undefined}\n          aria-describedby={this.ariaMultiSelectDescribedBy || undefined}\n          aria-expanded={this.dropdownOpen}\n          aria-haspopup=\"listbox\"\n          aria-disabled={this.disabled}\n          tabindex=\"0\"\n          onClick={this.disabled ? undefined : (event) => this.handleWrapperClick(event)}\n          onKeyDown={this.disabled ? undefined : (event) => this.handleKeyDown(event)} >\n          <div class={`ifx-multiselect-input\n          ${hasSelections ? '' : 'placeholder'}\n          `}\n            onClick={this.disabled ? undefined : () => this.toggleDropdown()}\n          >\n            {hasSelections ? selectedOptionsLabels : this.placeholder}\n          </div>\n          {this.dropdownOpen && (\n            <div class=\"ifx-multiselect-dropdown-menu\">\n\n              {(this.showSearch || this.showSelectAll || (this.showExpandCollapse && !isFlatMultiselect)) && (\n                <div class=\"ifx-multiselect-dropdown-functions\" onClick={(e) => e.stopPropagation()}>\n                  {this.showSearch && (\n                    <div class=\"ifx-multiselect-dropdown-search\">\n                      <ifx-search-field\n                        class=\"search-input\"\n                        placeholder={this.searchPlaceholder}\n                        size=\"s\"\n                        show-delete-icon=\"true\"\n                        aria-label={this.ariaSearchLabel}\n                        onKeyDown={(e) => { e.stopPropagation() }}\n                        onIfxInput={(event) => this.handleSearch(event.target)}\n                        onFocus={() => this.handleSearchFocus(true)}\n                        onBlur={() => this.handleSearchFocus(false)}\n                      ></ifx-search-field>\n                    </div>\n                  )}\n\n                  <div class=\"ifx-multiselect-dropdown-controls\">\n                    {this.showSelectAll && this.renderSelectAll()}\n                    {this.showExpandCollapse && !isFlatMultiselect && (\n                      <div class=\"expand-collapse-controls\">\n                        <span\n                          class=\"control-item\"\n                          role=\"button\"\n                          tabIndex={0}\n                          aria-label={this.ariaExpandAllLabel}\n                          onClick={(e) => { e.stopPropagation(); this.expandAll(); }}\n                          onKeyDown={(e) => {\n                            if (e.key === 'Enter' || e.key === ' ') {\n                              e.preventDefault();\n                              e.stopPropagation();\n                              this.expandAll();\n                            }\n                          }}\n                        >\n                          {this.expandLabel}\n                        </span>\n                        <span\n                          class=\"control-item\"\n                          role=\"button\"\n                          tabIndex={0}\n                          aria-label={this.ariaCollapseAllLabel}\n                          onClick={(e) => { e.stopPropagation(); this.collapseAll(); }}\n                          onKeyDown={(e) => {\n                            if (e.key === 'Enter' || e.key === ' ') {\n                              e.preventDefault();\n                              e.stopPropagation();\n                              this.collapseAll();\n                            }\n                          }}\n                        >\n                          {this.collapseLabel}\n                        </span>\n                      </div>\n                    )}\n                  </div>\n                </div>\n              )}\n\n              <div class=\"ifx-multiselect-options\" role=\"listbox\" aria-multiselectable=\"true\">\n                <slot />\n                {this.searchTerm && this.showNoResultsMessage && this.renderNoResultsMessage()}\n              </div>\n            </div>\n          )}\n          <div class='ifx-multiselect-icon-container'>\n\n            {/* Clear Button - will show only if there's a selection */}\n            {this.persistentSelectedOptions.length > 0 && (\n              <div class={`ifx-clear-button ${!this.showClearButton ? 'hide' : ''}`} onClick={this.disabled ? undefined : () => this.clearSelection()}>\n                <ifx-icon icon=\"cRemove16\"></ifx-icon>\n              </div>\n            )}\n            <div class=\"icon-wrapper-up\" onClick={this.disabled ? undefined : () => this.toggleDropdown()}>\n              <ifx-icon\n                key='icon-up'\n                icon='chevron-up-16'></ifx-icon>\n            </div>\n            <div class=\"icon-wrapper-down\" onClick={this.disabled ? undefined : () => this.toggleDropdown()}>\n              <ifx-icon\n                key='icon-down'\n                icon='chevron-down-16'></ifx-icon>\n            </div>\n          </div>\n\n        </div>\n        {\n          this.internalError ?\n            <div class=\"ifx-error-message-wrapper\">\n              <span>{this.internalErrorMessage}</span>\n            </div> : null\n        }\n      </div>\n    );\n  }\n}","@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"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-be04a034.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c,h as i,a as s}from"./p-PqnYwNKt.js";import{d as t,t as o}from"./p-DcmcuUOA.js";import{i as a}from"./p-Bw2fh5LT.js";const r=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{display:inline-block;user-select:none}.container{display:flex;flex-direction:row;align-items:center}.container.gap{gap:16px}.switch__checkbox-container{padding:4px;display:flex;align-items:center;position:relative;width:32px;height:16px;background-color:#FFFFFF;border:1px solid #575352;border-radius:20px;cursor:pointer;transition:background-color 0.3s ease;outline:none}.switch__checkbox-container:focus{outline:4px solid #0A8276;outline-offset:2px}.switch__checkbox-container:focus:not(:focus-visible){outline:none}.switch__checkbox-container:focus-visible{outline:2px solid #0A8276;outline-offset:2px}.switch__checkbox-container.disabled{cursor:default;border-color:#BFBBBB}.switch__label-wrapper label:hover{cursor:pointer}.switch__label-wrapper.disabled{color:#BFBBBB}.switch__checkbox-wrapper .switch{width:16px;height:16px;background-color:#575352;border-radius:50%;transition:transform 0.3s ease, background-color 0.3s ease}.switch__checkbox-wrapper .switch.disabled{background-color:#BFBBBB;border-color:#BFBBBB;cursor:default}.switch__checkbox-wrapper .switch.checked{transform:translateX(16px);background-color:#FFFFFF}.switch__checkbox-wrapper .switch.checked.disabled{cursor:default}.switch__checkbox-container:hover .toggle-switch{box-shadow:0 0 5px rgba(0, 0, 0, 0.2)}.switch__checkbox-container.checked{background-color:#0A8276;border-color:#0A8276}.switch__checkbox-container.checked.disabled{background-color:#BFBBBB;border-color:#BFBBBB;cursor:default}';const h=class{constructor(i){e(this,i);this.ifxChange=c(this,"ifxChange",7);if(i.$hostElement$["s-ei"]){this.internals=i.$hostElement$["s-ei"]}else{this.internals=i.$hostElement$.attachInternals();i.$hostElement$["s-ei"]=this.internals}this.checked=false;this.name="";this.disabled=false;this.internalChecked=false}async isChecked(){return this.internalChecked}componentWillLoad(){this.internalChecked=this.checked}toggleLabelGap(){const e=this.el.shadowRoot.querySelector("slot");const c=this.el.shadowRoot.querySelector(".container");if(e.assignedNodes().length){c.classList.add("gap")}else{c.classList.remove("gap")}}async componentDidLoad(){if(!a(this.el)){const e=t();o("ifx-switch",await e)}this.toggleLabelGap()}valueChanged(e,c){if(e!==c){this.internalChecked=e}}toggleSwitch(){if(this.disabled)return;this.internalChecked=!this.internalChecked;this.ifxChange.emit(this.internalChecked)}handleKeyDown(e){if(this.disabled)return;if(e.key==="Enter"||e.key===" "){this.toggleSwitch()}}render(){return i("div",{key:"305eeaf2fe5904134c21a5abe556303366b65ae6",class:"container",role:"switch","aria-checked":this.internalChecked?"true":"false","aria-label":this.name,onClick:()=>this.toggleSwitch(),onKeyDown:e=>this.handleKeyDown(e)},i("div",{key:"bd115571fc983d6c79f05cc4e04956354f6f18f3",class:`switch__checkbox-container ${this.internalChecked?"checked":""} ${this.disabled?"disabled":""}`,tabindex:"0"},i("div",{key:"cd26894c8d3329d5b3f97460fe25e6dcb9713865",class:"switch__checkbox-wrapper"},i("input",{key:"e1785eb1b9d77b4d5043dbf52bd8892b5c8d33a6",type:"checkbox",hidden:true,name:this.name,disabled:this.disabled,checked:this.internalChecked,value:`${this.value}`}),i("div",{key:"212d207114a8c783c2019e962585c7aca3f2a6ab",class:`switch ${this.internalChecked?"checked":""} ${this.disabled?"disabled":""}`}))),i("div",{key:"5dc8dde1aa40fe6e889a52bc63866b1c3a753e24",class:`switch__label-wrapper ${this.disabled?"disabled":""}`},i("label",{key:"6e61b7f75aeac9db0d497b2c8843e22ca5a0c590",htmlFor:"switch"},i("slot",{key:"4692e1b1dab2874fc52c6d2828a1daf4962fa549",onSlotchange:()=>this.toggleLabelGap()}))))}get el(){return s(this)}static get watchers(){return{checked:["valueChanged"]}}};h.style=r;export{h as ifx_switch};
-//# sourceMappingURL=p-be04a034.entry.js.map

package/dist/infineon-design-system-stencil/p-be04a034.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["switchCss","Switch","constructor","hostRef","this","checked","name","disabled","internalChecked","isChecked","componentWillLoad","toggleLabelGap","slot","el","shadowRoot","querySelector","container","assignedNodes","length","classList","add","remove","componentDidLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","valueChanged","newValue","oldValue","toggleSwitch","ifxChange","emit","handleKeyDown","event","key","render","h","class","role","onClick","onKeyDown","tabindex","type","hidden","value","htmlFor","onSlotchange"],"sources":["src/components/switch/switch.scss?tag=ifx-switch&encapsulation=shadow","src/components/switch/switch.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n/* switch.css */\n:host {\n  display: inline-block;\n  user-select: none;\n}\n\n.container {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  &.gap {\n    gap: tokens.$ifxSpace200;\n  }\n}\n\n\n.switch__checkbox-container {\n  padding: tokens.$ifxSpace50;\n  display: flex;\n  align-items: center;\n  position: relative;\n  // Subtracting padding size from both height and width\n  width: (tokens.$ifxSpace500)-8px;\n  height: 16px;\n  background-color: tokens.$ifxColorBaseWhite;\n  border: 1px solid tokens.$ifxColorEngineering500;\n  border-radius: 20px;\n  cursor: pointer;\n  transition: background-color 0.3s ease;\n  outline: none;\n\n  &:focus {\n    outline: 4px solid tokens.$ifxColorOcean500;\n    outline-offset: 2px;\n  }\n\n  &:focus:not(:focus-visible) {\n    outline: none;\n  }\n\n  &:focus-visible {\n    outline: 2px solid tokens.$ifxColorOcean500;\n    outline-offset: 2px;\n  }\n\n  &.disabled {\n    cursor: default;\n    border-color: tokens.$ifxColorEngineering300;\n  }\n\n\n}\n\n\n.switch__label-wrapper {\n\n  & label { \n    &:hover { \n      cursor: pointer;\n    }\n  }\n\n  &.disabled {\n    color: tokens.$ifxColorEngineering300;\n  }\n}\n\n\n.switch__checkbox-wrapper {\n\n  .switch {\n    // position: absolute;\n    width: tokens.$ifxSpace200;\n    height: tokens.$ifxSpace200;\n    background-color: tokens.$ifxColorEngineering500;\n    border-radius: 50%;\n    transition: transform 0.3s ease, background-color 0.3s ease;\n\n    &.disabled {\n      background-color: tokens.$ifxColorEngineering300;\n      border-color: tokens.$ifxColorEngineering300;\n      cursor: default;\n    }\n  }\n\n  .switch.checked {\n    transform: translateX(16px);\n    background-color: tokens.$ifxColorBaseWhite;\n\n    &.disabled {\n      cursor: default;\n    }\n\n  }\n\n}\n\n.switch__checkbox-container:hover .toggle-switch {\n  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);\n}\n\n\n\n.switch__checkbox-container.checked {\n  background-color: tokens.$ifxColorOcean500;\n  border-color: tokens.$ifxColorOcean500;\n\n  &.disabled {\n    background-color: tokens.$ifxColorEngineering300;\n    border-color: tokens.$ifxColorEngineering300;\n    cursor: default;\n  }\n}","import { AttachInternals, Method } from '@stencil/core';\nimport { Component, Prop, State, Watch, h, Event, EventEmitter, Element } 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-switch',\n  styleUrl: 'switch.scss',\n  shadow: true,\n  // formAssociated: true\n})\nexport class Switch {\n  @Prop() checked: boolean = false;\n  @Prop() name: string = '';\n  @Prop() disabled: boolean = false;\n  @Prop() value: string;\n  @State() internalChecked: boolean = false;\n\n  @AttachInternals() internals: ElementInternals;\n\n  @Element() el: HTMLIfxSwitchElement;\n\n  @Event({ eventName: 'ifxChange' }) ifxChange: EventEmitter<boolean>;\n\n  @Method()\n  async isChecked(): Promise<boolean> {\n    return this.internalChecked;\n  }\n\n  componentWillLoad() {\n    this.internalChecked = this.checked;\n  }\n  \n\n  toggleLabelGap() {\n    const slot = this.el.shadowRoot.querySelector('slot');\n    const container = this.el.shadowRoot.querySelector('.container');\n    if (slot.assignedNodes().length) {\n      container.classList.add('gap')\n    } else { \n      container.classList.remove('gap')\n    }\n  }\n  \n  async componentDidLoad() {\n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-switch', await framework)\n    }\n    this.toggleLabelGap();\n  }\n    \n  @Watch('checked')\n  valueChanged(newValue: boolean, oldValue: boolean) {\n    if (newValue !== oldValue) {\n      this.internalChecked = newValue;\n    }\n  }\n\n  toggleSwitch() {\n    if (this.disabled) return;\n    this.internalChecked = !this.internalChecked;\n\n    if (this.internalChecked) {\n      if (this.value !== undefined) {\n        //this.internals.setFormValue(this.value);\n      } else {\n        //this.internals.setFormValue(\"on\")\n      }\n    } else {\n      //this.internals.setFormValue(null)\n    }\n\n    this.ifxChange.emit(this.internalChecked);\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    if (this.disabled) return;\n    // If the pressed key is either 'Enter' or 'Space' \n    if (event.key === 'Enter' || event.key === ' ') {\n      this.toggleSwitch();\n    }\n  }\n\n  /**\n   * Callback for form association.\n   * Called whenever the form is reset.\n   */\n  // formResetCallback() {\n  //   this.internals.setFormValue(null);\n  // }\n\n  render() {\n    return (\n      <div\n        class=\"container\"\n        role=\"switch\"\n        aria-checked={this.internalChecked ? 'true' : 'false'}\n        aria-label={this.name}\n        onClick={() => this.toggleSwitch()}\n        onKeyDown={(event) => this.handleKeyDown(event)}\n        >\n        {/* Checkbox */}\n        <div \n          class={`switch__checkbox-container ${this.internalChecked ? 'checked' : ''} ${this.disabled ? 'disabled' : ''}`}\n          tabindex=\"0\"\n        >\n          <div class=\"switch__checkbox-wrapper\">\n            <input type=\"checkbox\" hidden\n              name={this.name}\n              disabled={this.disabled}\n              checked={this.internalChecked}\n              value={`${this.value}`} />\n            <div class={`switch ${this.internalChecked ? 'checked' : ''} ${this.disabled ? 'disabled' : ''}`} />\n          </div>\n        </div >\n\n        {/* Label */}\n        <div class={`switch__label-wrapper ${this.disabled ? 'disabled' : ''}`} >\n          <label htmlFor=\"switch\">\n            <slot onSlotchange={() => this.toggleLabelGap()} />\n          </label>\n        </div>\n      </div>\n    )\n\n  }\n}\n"],"mappings":"mIAAA,MAAMA,EAAY,sgD,MCYLC,EAAM,MANnB,WAAAC,CAAAC,G,+MAOUC,KAAOC,QAAY,MACnBD,KAAIE,KAAW,GACfF,KAAQG,SAAY,MAEnBH,KAAeI,gBAAY,KA+GrC,CAtGC,eAAMC,GACJ,OAAOL,KAAKI,e,CAGd,iBAAAE,GACEN,KAAKI,gBAAkBJ,KAAKC,O,CAI9B,cAAAM,GACE,MAAMC,EAAOR,KAAKS,GAAGC,WAAWC,cAAc,QAC9C,MAAMC,EAAYZ,KAAKS,GAAGC,WAAWC,cAAc,cACnD,GAAIH,EAAKK,gBAAgBC,OAAQ,CAC/BF,EAAUG,UAAUC,IAAI,M,KACnB,CACLJ,EAAUG,UAAUE,OAAO,M,EAI/B,sBAAMC,GACJ,IAAIC,EAAuBnB,KAAKS,IAAK,CACnC,MAAMW,EAAYC,IAClBC,EAAe,mBAAoBF,E,CAErCpB,KAAKO,gB,CAIP,YAAAgB,CAAaC,EAAmBC,GAC9B,GAAID,IAAaC,EAAU,CACzBzB,KAAKI,gBAAkBoB,C,EAI3B,YAAAE,GACE,GAAI1B,KAAKG,SAAU,OACnBH,KAAKI,iBAAmBJ,KAAKI,gBAY7BJ,KAAK2B,UAAUC,KAAK5B,KAAKI,gB,CAG3B,aAAAyB,CAAcC,GACZ,GAAI9B,KAAKG,SAAU,OAEnB,GAAI2B,EAAMC,MAAQ,SAAWD,EAAMC,MAAQ,IAAK,CAC9C/B,KAAK0B,c,EAYT,MAAAM,GACE,OACEC,EAAA,OAAAF,IAAA,2CACEG,MAAM,YACNC,KAAK,SACS,eAAAnC,KAAKI,gBAAkB,OAAS,QAAO,aACzCJ,KAAKE,KACjBkC,QAAS,IAAMpC,KAAK0B,eACpBW,UAAYP,GAAU9B,KAAK6B,cAAcC,IAGzCG,EAAA,OAAAF,IAAA,2CACEG,MAAO,8BAA8BlC,KAAKI,gBAAkB,UAAY,MAAMJ,KAAKG,SAAW,WAAa,KAC3GmC,SAAS,KAETL,EAAK,OAAAF,IAAA,2CAAAG,MAAM,4BACTD,EAAA,SAAAF,IAAA,2CAAOQ,KAAK,WAAWC,OAAM,KAC3BtC,KAAMF,KAAKE,KACXC,SAAUH,KAAKG,SACfF,QAASD,KAAKI,gBACdqC,MAAO,GAAGzC,KAAKyC,UACjBR,EAAA,OAAAF,IAAA,2CAAKG,MAAO,UAAUlC,KAAKI,gBAAkB,UAAY,MAAMJ,KAAKG,SAAW,WAAa,SAKhG8B,EAAA,OAAAF,IAAA,2CAAKG,MAAO,yBAAyBlC,KAAKG,SAAW,WAAa,MAChE8B,EAAO,SAAAF,IAAA,2CAAAW,QAAQ,UACbT,EAAA,QAAAF,IAAA,2CAAMY,aAAc,IAAM3C,KAAKO,qB","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-d094dc8e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["datePickerCss","DatePicker","constructor","hostRef","this","inputId","datePickerId","size","error","success","disabled","type","required","autocomplete","getDate","e","inputValue","target","value","selectedDate","Date","day","month","getMonth","year","getFullYear","hours","getHours","minutes","getMinutes","ifxDate","emit","input","el","shadowRoot","querySelector","classList","add","handleInputFocusOnIconClick","focus","getBrowser","navigator","userAgent","indexOf","setFireFoxClasses","browser","contains","remove","componentDidLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","componentWillUpdate","render","h","key","class","htmlFor","_a","label","trim","undefined","ariaLabel","max","min","onChange","role","onClick","icon","_b","caption"],"sources":["src/components/date-picker/date-picker.scss?tag=ifx-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx"],"sourcesContent":["@use '~@infineon/design-system-tokens/dist/tokens';\n\n.date__picker-container {\n  display: flex;\n  flex-direction: column;\n\n  & .label__wrapper {\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody03;\n\n    & .asterisk { \n      display: none;\n      &.required {\n        display: inline;\n        margin-left: 4px;\n        \n        &.error {\n          color: #CD002F;\n        }\n      }\n    }\n\n  }\n\n  &.disabled {\n    .label__wrapper {\n      color: tokens.$ifxColorEngineering500;\n    }\n  }\n\n  &.error {\n    .caption__wrapper {\n      color: tokens.$ifxColorRed500;\n    }\n  }\n\n  &.disabled {\n    .caption__wrapper {\n      color: tokens.$ifxColorEngineering500;\n    }\n  }\n\n  & .caption__wrapper {\n    margin-top: tokens.$ifxSpace50;\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody05;\n  }\n}\n\n.date__picker-input {\n  font-family: 'Source Sans 3';\n  outline: none;\n  width: 100%;\n  cursor: pointer;\n  border-radius: 1px;\n  border: 1px solid tokens.$ifxColorEngineering400;\n  height: 100%;\n\n  &.firefox__classes {\n    padding: 8px 16px;\n    color: tokens.$ifxColorEngineering400;\n    font-size: 16px;\n    text-transform: uppercase;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 24px;\n    cursor: pointer;\n  }\n\n  &:focus:not(.error, .success) {\n    border-color: tokens.$ifxColorOcean500;\n  }\n\n  &:hover:not(:disabled, :focus, .error, .success) {\n    border-color: tokens.$ifxColorEngineering500;\n  }\n\n  &:disabled {\n    border-color: tokens.$ifxColorEngineering500;\n    background-color: tokens.$ifxColorEngineering200;\n  }\n\n  &.error {\n    border-color: tokens.$ifxColorRed500;\n  }\n\n  &.success:not(.error) {\n    border-color: tokens.$ifxColorGreen500;\n  }\n\n  &::-webkit-datetime-edit-text {\n    color: tokens.$ifxColorEngineering400;\n    font-size: 16px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 24px;\n  }\n\n  &.has-value::-webkit-datetime-edit-text {\n    color: tokens.$ifxColorBaseBlack;\n  }\n\n  &.has-value::-webkit-datetime-edit {\n    color: tokens.$ifxColorBaseBlack;\n  }\n}\n\n::-webkit-datetime-edit {\n  color: tokens.$ifxColorEngineering400;\n  font-size: 16px;\n  text-transform: uppercase;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 24px;\n}\n\n::-webkit-datetime-edit-fields-wrapper {\n  padding: 8px 16px;\n  padding-bottom: 9px;\n  transform: translateY(1px);\n}\n\n::-webkit-inner-spin-button {\n  display: none;\n}\n\n::-webkit-calendar-picker-indicator {\n  position: absolute;\n  right: 15px;\n  font-size: 19px;\n  cursor: pointer;\n  border-radius: 1px;\n  &:focus-within {\n    outline: 2px solid tokens.$ifxColorOcean500;\n    outline-offset: 2px;\n  }\n}\n\n.input__wrapper {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  align-self: stretch;\n  background: tokens.$ifxColorBaseWhite;\n  position: relative;\n  &.large {\n    height: 40px;\n  }\n\n  &.small {\n    height: 36px;\n  }\n\n  &.disabled {\n    & .icon__wrapper {\n      background-color: tokens.$ifxColorEngineering200;\n    }\n  }\n}\n\n.icon__wrapper {\n  position: absolute;\n  right: 17px;\n  padding: 2px;\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  pointer-events: none;\n  z-index: 100;\n  background-color: tokens.$ifxColorBaseWhite;\n  line-height: 16px;\n\n  & ifx-icon {\n    vertical-align: middle;\n  }\n}\n","import { AttachInternals } from '@stencil/core';\nimport { Component, Prop, h, Element, Event, EventEmitter } 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-date-picker',\n  styleUrl: 'date-picker.scss',\n  shadow: true,\n  // formAssociated: true,\n})\n\nexport class DatePicker {\n  private inputId: string = `ifx-date-picker-${++datePickerId}`;\n\n  @Element() el: HTMLElement;\n  @Prop() size: string = 's';\n  @Prop() error: boolean = false;\n  @Prop() success: boolean = false;\n  @Prop() disabled: boolean = false;\n  @Prop() ariaLabel: string | null;\n  @Prop() value: string;\n  @Prop() type: string = 'date'\n  @Prop() max: string;\n  @Prop() min: string;\n  @Prop() required: boolean = false;\n  @Prop() label: string;\n  @Prop() caption: string;\n  @Prop() autocomplete: string = 'on';\n\n  @AttachInternals() internals: ElementInternals;\n\n  @Event() ifxDate: EventEmitter;\n\n  getDate(e) { \n    const inputValue = e.target.value;\n    const selectedDate = new Date(inputValue);\n    const day = selectedDate.getDate();\n    const month = selectedDate.getMonth() + 1; \n    const year = selectedDate.getFullYear();\n\n \n      \n    if (!inputValue) {\n      //this.internals.setFormValue(null);\n\n      if(this.type === 'datetime-local') { \n        const hours = selectedDate.getHours();\n        const minutes = selectedDate.getMinutes();\n        this.ifxDate.emit({day, month, year, hours, minutes});\n      } else { \n        this.ifxDate.emit({day, month, year});\n      }\n      return;\n    }\n\n    const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n    input.classList.add('has-value');\n\n    //this.internals.setFormValue(selectedDate.toISOString().substring(0,10))\n    if(this.type === 'datetime-local') { \n      const hours = selectedDate.getHours();\n      const minutes = selectedDate.getMinutes();\n      this.ifxDate.emit({day, month, year, hours, minutes});\n    } else { \n      this.ifxDate.emit({day, month, year})\n    }\n  }\n\n  handleInputFocusOnIconClick() { \n    const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n    if(input) { \n      input.focus()\n    }\n  }\n\n getBrowser() {\n    if( navigator.userAgent.indexOf(\"Chrome\") != -1 ) {\n      return \"Chrome\";\n    } else if( navigator.userAgent.indexOf(\"Opera\") != -1 ) {\n      return \"Opera\";\n    } else if( navigator.userAgent.indexOf(\"MSIE\") != -1 ) {\n      return \"IE\";\n    } else if( navigator.userAgent.indexOf(\"Firefox\") != -1 ) {\n      return \"Firefox\";\n    } else {\n      return \"unknown\";\n    }\n  }\n\n  setFireFoxClasses() { \n    const browser = this.getBrowser()\n    const input = this.el.shadowRoot.querySelector('.date__picker-input');\n\n    if(browser === 'Firefox') { \n      input.classList.add('firefox__classes')\n    } else if(input.classList.contains('firefox__classes')) { \n      input.classList.remove('firefox__classes')\n    }\n  }\n\n  async componentDidLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-date-picker', await framework)\n    }\n    this.setFireFoxClasses()\n  }\n\n  componentWillUpdate() { \n    if (this.value) {\n      this.getDate({ target: { value: this.value } });\n    }\n  }\n\n  // formResetCallback() {\n  //   this.internals.setFormValue(null);\n  // }\n\n  render() {\n    return (\n      <div class={`date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled': ''}`}>\n\n        <label class='label__wrapper' htmlFor={ this.inputId }>\n          { this.label?.trim() }\n          <span class={`asterisk ${this.required ? 'required' : \"\"} ${this.error ? 'error' : \"\"}`}>*</span>\n        </label>\n\n        <div class={`input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}`}>\n          <input\n          type={this.type}\n          autocomplete={this.autocomplete}\n          class={`date__picker-input ${this.error ? 'error' : \"\"} ${this.success ? \"success\" : \"\"}`}\n          disabled={this.disabled ? true : undefined}\n          aria-invalid={this.error ? true : undefined}\n          aria-label={this.ariaLabel}\n          max={this.max}\n          min={this.min}\n          value={this.value}\n          required={this.required}\n          onChange={(e) => this.getDate(e)} />\n          <div class=\"icon__wrapper\" role=\"button\" onClick={() => this.handleInputFocusOnIconClick()}>\n            <ifx-icon icon='calendar16' aria-hidden=\"true\"></ifx-icon>\n          </div>\n        </div>\n\n        { this.caption?.trim() && (\n            <div class='caption__wrapper'>\n              { this.caption.trim() }\n            </div> \n          )}\n      </div>\n    )\n  }\n}\n\nlet datePickerId = 0;"],"mappings":"wIAAA,MAAMA,EAAgB,qhF,MCaTC,EAAU,MAPvB,WAAAC,CAAAC,G,2MAQUC,KAAAC,QAAkB,qBAAqBC,IAGvCF,KAAIG,KAAW,IACfH,KAAKI,MAAY,MACjBJ,KAAOK,QAAY,MACnBL,KAAQM,SAAY,MAGpBN,KAAIO,KAAW,OAGfP,KAAQQ,SAAY,MAGpBR,KAAYS,aAAW,IA8HhC,CAxHC,OAAAC,CAAQC,GACN,MAAMC,EAAaD,EAAEE,OAAOC,MAC5B,MAAMC,EAAe,IAAIC,KAAKJ,GAC9B,MAAMK,EAAMF,EAAaL,UACzB,MAAMQ,EAAQH,EAAaI,WAAa,EACxC,MAAMC,EAAOL,EAAaM,cAI1B,IAAKT,EAAY,CAGf,GAAGZ,KAAKO,OAAS,iBAAkB,CACjC,MAAMe,EAAQP,EAAaQ,WAC3B,MAAMC,EAAUT,EAAaU,aAC7BzB,KAAK0B,QAAQC,KAAK,CAACV,MAAKC,QAAOE,OAAME,QAAOE,W,KACvC,CACLxB,KAAK0B,QAAQC,KAAK,CAACV,MAAKC,QAAOE,Q,CAEjC,M,CAGF,MAAMQ,EAAQ5B,KAAK6B,GAAGC,WAAWC,cAAc,uBAC/CH,EAAMI,UAAUC,IAAI,aAGpB,GAAGjC,KAAKO,OAAS,iBAAkB,CACjC,MAAMe,EAAQP,EAAaQ,WAC3B,MAAMC,EAAUT,EAAaU,aAC7BzB,KAAK0B,QAAQC,KAAK,CAACV,MAAKC,QAAOE,OAAME,QAAOE,W,KACvC,CACLxB,KAAK0B,QAAQC,KAAK,CAACV,MAAKC,QAAOE,Q,EAInC,2BAAAc,GACE,MAAMN,EAAQ5B,KAAK6B,GAAGC,WAAWC,cAAc,uBAC/C,GAAGH,EAAO,CACRA,EAAMO,O,EAIX,UAAAC,GACG,GAAIC,UAAUC,UAAUC,QAAQ,YAAa,EAAK,CAChD,MAAO,Q,MACF,GAAIF,UAAUC,UAAUC,QAAQ,WAAY,EAAK,CACtD,MAAO,O,MACF,GAAIF,UAAUC,UAAUC,QAAQ,UAAW,EAAK,CACrD,MAAO,I,MACF,GAAIF,UAAUC,UAAUC,QAAQ,aAAc,EAAK,CACxD,MAAO,S,KACF,CACL,MAAO,S,EAIX,iBAAAC,GACE,MAAMC,EAAUzC,KAAKoC,aACrB,MAAMR,EAAQ5B,KAAK6B,GAAGC,WAAWC,cAAc,uBAE/C,GAAGU,IAAY,UAAW,CACxBb,EAAMI,UAAUC,IAAI,mB,MACf,GAAGL,EAAMI,UAAUU,SAAS,oBAAqB,CACtDd,EAAMI,UAAUW,OAAO,mB,EAI3B,sBAAMC,GACJ,IAAIC,EAAuB7C,KAAK6B,IAAK,CACnC,MAAMiB,EAAYC,IAClBC,EAAe,wBAAyBF,E,CAE1C9C,KAAKwC,mB,CAGP,mBAAAS,GACE,GAAIjD,KAAKc,MAAO,CACdd,KAAKU,QAAQ,CAAEG,OAAQ,CAAEC,MAAOd,KAAKc,Q,EAQzC,MAAAoC,G,QACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,0BAA0BrD,KAAKI,MAAQ,QAAU,MAAMJ,KAAKM,SAAW,WAAY,MAE7F6C,EAAA,SAAAC,IAAA,2CAAOC,MAAM,iBAAiBC,QAAUtD,KAAKC,UACzCsD,EAAAvD,KAAKwD,SAAK,MAAAD,SAAA,SAAEA,EAAAE,OACdN,EAAA,QAAAC,IAAA,2CAAMC,MAAO,YAAYrD,KAAKQ,SAAW,WAAa,MAAMR,KAAKI,MAAQ,QAAU,MAAI,MAGzF+C,EAAA,OAAAC,IAAA,2CAAKC,MAAO,kBAAkBrD,KAAKG,OAAS,IAAM,QAAU,WAAWH,KAAKM,SAAW,WAAa,MAClG6C,EACA,SAAAC,IAAA,2CAAA7C,KAAMP,KAAKO,KACXE,aAAcT,KAAKS,aACnB4C,MAAO,sBAAsBrD,KAAKI,MAAQ,QAAU,MAAMJ,KAAKK,QAAU,UAAY,KACrFC,SAAUN,KAAKM,SAAW,KAAOoD,UAAS,eAC5B1D,KAAKI,MAAQ,KAAOsD,UACtB,aAAA1D,KAAK2D,UACjBC,IAAK5D,KAAK4D,IACVC,IAAK7D,KAAK6D,IACV/C,MAAOd,KAAKc,MACZN,SAAUR,KAAKQ,SACfsD,SAAWnD,GAAMX,KAAKU,QAAQC,KAC9BwC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,gBAAgBU,KAAK,SAASC,QAAS,IAAMhE,KAAKkC,+BAC3DiB,EAAA,YAAAC,IAAA,2CAAUa,KAAK,aAAY,cAAa,aAI1CC,EAAAlE,KAAKmE,WAAO,MAAAD,SAAA,SAAAA,EAAET,SACZN,EAAA,OAAAC,IAAA,2CAAKC,MAAM,oBACPrD,KAAKmE,QAAQV,Q,2BAQ7B,IAAIvD,EAAe,E","ignoreList":[]}