@infineon/infineon-design-system-stencil 30.9.3--canary.1496.9fc4de9852ba9ec2e36ce3e0ff89d8fddb5acdc5.0 → 30.9.3--canary.1679.8d0c83c3f0040ae0386585c5203298c7d94911f3.0

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

@@ -0,0 +1 @@
+{"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","IfxTableStyle0","Table","allRowData","originalRowData","handleChipChange","name","currentSelection","detail","updatedFilters","Object","assign","currentFilters","length","customEvent","CustomEvent","filterName","bubbles","composed","host","dispatchEvent","filterValues","map","selection","value","applyAllFilters","updateTableView","onButtonRendererOptionsChanged","colData","getColData","gridApi","setColumnDefs","toggleSidebarFilters","showSidebarFilters","updateFilterOptions","col","field","Set","rowData","row","filterOptions","handleSidebarFilterChange","filterGroups","forEach","filterGroup","filterGroupName","selectedItems","item","label","handleTopbarFilterChange","filters","filter","filterInfo","selectedValues","toLowerCase","textFilterMatched","property","hasOwnProperty","rowValue","String","some","filterValue","startsWith","includesUndefined","includes","startIndex","currentPage","paginationPageSize","endIndex","visibleRowData","slice","setGridOption","matchingResultsCount","clearAllFilters","onBtShowLoading","showLoadingOverlay","componentWillLoad","uniqueKey","Math","floor","random","getRowData","gridOptions","rowHeight","headerHeight","defaultColDef","resizable","suppressDragLeaveHidesColumns","enableCellTextSelection","onFirstDataRendered","bind","columnDefs","loadingOverlayComponent","noRowsOverlayComponent","noRowsOverlayComponentParams","icons","sortAscending","sortDescending","sortUnSort","rowDragManaged","dndSource","animateRows","componentDidRender","componentDidLoad","container","createGrid","sizeColumnsToFit","defaultMinWidth","pagination","paginationElement","shadowRoot","querySelector","handlePageChange","sidebarFilterElements","querySelectorAll","sidebarFilterElement","topbarFilterElements","topbarFilterElement","componentWillUnmount","sidebarFilters","sidebarFilter","topbarFilters","topbarFilter","isJSONParseable","str","JSON","parse","e","rows","undefined","Array","isArray","console","error","cols","buttonColumn","find","column","cellRenderer","valueFormatter","buttonRendererOptions","api","handleResetButtonClick","resetEvent","window","disconnectedCallback","resetButton","getTableClassNames","classNames","tableHeight","render","style","height","filterClass","filterOrientation","h","Host","key","class","onClick","icon","keys","isMultiSelect","placeholder","readOnly","selected","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\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}\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: none;\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);\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';\n\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() paginationPageSize: number = 10;\n  @Prop() filterOrientation: string = 'sidebar'; // topbar / none\n  @State() showSidebarFilters: boolean = true;\n  @State() matchingResultsCount: number = 0;\n\n  @Prop() showLoading: boolean = false;\n  private container: HTMLDivElement;\n  @Element() host: HTMLElement;\n  originalRowData: any[] = [];\n\n  @Listen('ifxChipChange')\n  handleChipChange(event: CustomEvent<{ previousSelection: Array<any>, currentSelection: Array<any>, name: string }>) {\n    const { name, currentSelection } = event.detail;\n\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  @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  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\n\n  updateTableView() {\n    // Calculate the slice of data to display based on pagination\n    const startIndex = (this.currentPage - 1) * this.paginationPageSize;\n    const endIndex = startIndex + this.paginationPageSize;\n    const visibleRowData = this.allRowData.slice(startIndex, endIndex);\n\n    // Update the row data in the table\n    this.rowData = visibleRowData;\n    this.gridApi.setGridOption('rowData', this.rowData);\n\n    // Update matching results count\n    this.matchingResultsCount = this.allRowData.length;\n  }\n\n\n  clearAllFilters() {\n    this.currentFilters = {};\n    this.allRowData = [...this.originalRowData];\n  }\n\n\n  @Method()\n  async onBtShowLoading() {\n    this.gridApi.showLoadingOverlay();\n  }\n\n  componentWillLoad() {\n    this.uniqueKey = `unique-${Math.floor(Math.random() * 1000000)}`;\n\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=\"arrowtriangleup16\"></ifx-icon>',\n        sortDescending: '<ifx-icon icon=\"arrowtriangledown16\"></ifx-icon>',\n        sortUnSort: '<a class=\"unsort-icon-custom-color\"><ifx-icon icon=\"arrowtrianglevertikal16\"></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\n\n  componentDidLoad() {\n    if (this.container) {\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-12\"></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' style={style} ref={(el) => this.container = el}>\n                </div>\n              </div>\n              {this.pagination ? <ifx-pagination total={this.allRowData.length} current-page={this.currentPage}></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-c7f80bba.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as c,g as a}from"./p-6b122987.js";const d='*{font-family:"Source Sans 3";box-sizing:border-box}body{margin:0;padding:0;overflow-x:hidden}header{margin-bottom:15px;display:flex;justify-content:center}.header__info-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}.infoboard__wrapper{display:flex;gap:15px;background-color:#f1f1f1;padding:5px 10px;border-radius:10px}.title{font-size:30px;font-weight:bold}.view{margin:auto}.wrapper{position:relative;width:100%;height:calc(100vh - var(--header-height) - 15px);overflow:auto}table{width:100%;table-layout:fixed;border-spacing:0}thead tr th{border-top:1px solid #dddddd}td,th{padding:10px;background-color:white;border:none;box-shadow:0 0 0 1px #dddddd;box-sizing:border-box}table th:nth-child(1){width:150px}table th:not(:nth-child(1)){width:240px}th{position:sticky;top:0;background-color:white}.sticky-col{position:sticky;z-index:1}th.sticky-col{z-index:2}.second-col{left:0;border-left:1px solid #ddd}.wrapped-content{width:250px;white-space:normal}a{text-decoration:none;color:black}.basic__info{display:flex;gap:5px}ul{padding:0 5px;margin:0 15px;list-style-type:none}tr:nth-child(even) td{background-color:#f1f1f1}ul li{font-size:12px;display:flex;gap:5px;line-height:13px}li.planned__component-wrapper{align-items:center;line-height:16px}.version__wrapper{display:flex;flex-direction:column}ifx-icon{color:rgb(10, 130, 118)}.check__icon{width:10px;height:10px}.planned__icon{width:12px;height:12px;vertical-align:sub}';const f=d;const b=class{constructor(c){e(this,c);this.getPlannedComponents=()=>{const e=this.el.shadowRoot.querySelectorAll(".planned__component");return e.length};this.setPlannedComponentsNumber=()=>{const e=this.getPlannedComponents();const c=this.el.shadowRoot.getElementById("number__indicator-planned");c.innerHTML=e};this.getCompletedComponents=()=>{const e=this.el.shadowRoot.querySelectorAll(".completed__component");return e.length};this.setCompletedComponentsNumber=()=>{const e=this.getCompletedComponents();const c=this.el.shadowRoot.getElementById("number__indicator-completed");c.innerHTML=e};this.setTotalComponentsNumber=()=>{const e=this.getPlannedComponents();const c=this.getCompletedComponents();const a=this.el.shadowRoot.getElementById("number__indicator-total");const d=e+c;a.innerHTML=d}}componentWillLoad(){let e=this.el.parentElement;if(e){e=e.parentElement;e.style.padding="0px"}}componentDidLoad(){const e=this.el.shadowRoot.querySelector("header");const c=e.offsetHeight;const a=this.el.shadowRoot.querySelector(".wrapper");a.style.setProperty("--header-height",`${c}px`);this.setPlannedComponentsNumber();this.setCompletedComponentsNumber();this.setTotalComponentsNumber()}render(){return c("div",{key:"94ef0cd5e94c2cd278b42251bd942ef7bed3bc9e",class:"container"},c("header",{key:"29fa237275093d906d19dd7c4f7ef103ebe23a91",class:"header"},c("div",{key:"983ce63f77dafd26ed5b25da2cc518f8b7834e35",class:"header__info-wrapper"},c("div",{key:"6a909d8f1fbd3efdc928ae99aace2fbe2d6ce888",class:"title"},"DDS Components Overview"),c("div",{key:"95ec497b9e4b65d6e1e48a9dd8754a052ee79281",class:"infoboard__wrapper"},c("div",{key:"fedd769a5cda6dcc7320d0b259d58e9482f750a3",class:"basic__info"},c("div",{key:"18e40e6b586afeae9ca1ec9a9edb4c849acad717"},"Total Number:"),c("div",{key:"0327edd0557b74ef60a1fde6a4f4b1b66b190cb2"},c("ifx-number-indicator",{key:"37206eb3e0e30bc54906745c45b312805cdc9453",id:"number__indicator-total"}))),c("div",{key:"92d6dea0710d1e2d2193049543530b205e514bd3",class:"basic__info"},c("div",{key:"497953be0cb32f373757140ad4f39f087e83d41c"},"Completed:"),c("div",{key:"5d353eedddeb5adc70b8f2cdfaa7d82eb5358587"},c("ifx-number-indicator",{key:"837f9bb96855ea0c8bc6a58017bf2b93f22527d4",id:"number__indicator-completed"}))),c("div",{key:"8dee70161f789692a569643bf24fac938b06539a",class:"basic__info"},c("div",{key:"26f4a5ea75d6d3f91cf3fcd301807a43ae1b132a"},"In Progress:"),c("div",{key:"6b36c07112366eb3ea0d12f4704823ead18a892c"},c("ifx-number-indicator",{key:"454c1b760527366374b46a32a7f9a26e6746399a",id:"number__indicator-planned"})))))),c("div",{key:"4e2349c5d71032a0fc4ec18bf3753ffc4ebb9bfd",class:"view"},c("div",{key:"201ded58bf4b595562445677c08cff1944426ea2",class:"wrapper"},c("table",{key:"a27ee204659d8ad1ca6bfd2015ab2a6dfc42954c"},c("thead",{key:"0fe9b4e836cf884e708a40e98711e397e9988268"},c("tr",{key:"9189ba17125982fda16a0a05dbbe73279b0d81f8"},c("th",{key:"67d5182d415ee892696b7a33ff4024824e53046c",class:"sticky-col second-col"},"Component"),c("th",{key:"6f546e2b5681d14124e7f6c7be96194eb7156771"},c("div",{key:"cb01f34d8d0d05e553bbc1cee742bd46a238b149",class:"version__wrapper"},c("span",{key:"92aa213436a98e7794f37ba573cc0e7e1ea1524d"},"Version 1"))),c("th",{key:"df61570f92d456836c3755ab0f62dd7fd4d89426"},c("div",{key:"50489ed3424003794a5b8344422f2b0a624d75d3",class:"version__wrapper"},c("span",{key:"78629e20c10b5bac6e4293a361b8a0067d3d940c"},"Version 2"))),c("th",{key:"6c8115976c082ba1122f922d9cdaa72df2791b1b"},"Version 3"))),c("tbody",{key:"0a6455ddce92d1c25b3bd45db290af7deefe3707"},c("tr",{key:"b598af041a6f3e51094a200c4b3084dbceb1c555"},c("td",{key:"e795f6e5abf128f2fcf1336d114bf77468f28a96",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"e1c3ecf42c3433a1708e0ae5d9088b99536496d5",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-accordion--development",size:"s",variant:"bold"},"Accordion")),c("td",{key:"40ebc65154f49ee09f504ef5782c4191bba27e92"},c("ul",{key:"60d9ee3c1a25fad5edf6c5bf0f2313a8d263f973"},c("li",{key:"37f79e0e57c08d7dcb9f25ad86884038fdc79ff2"},c("span",{key:"be049cf79476587d212746e0c1a5914eab273eb7"},c("ifx-icon",{key:"dc61a02131094abf32fb715b593e439ce596a9b9",class:"check__icon",icon:"check12"})),c("span",{key:"d5a2d994fccedeadc8cb0ecd3d8e6efe71314e05"},"Includes essential functionality such as expand/collapse behavior and minimal customization options")),c("li",{key:"457b623dc3fcd451ba736a7c8f327817b6574e87"},c("span",{key:"5cbe8527c814ff3e5689ad5875f2c959882d5c2c"},c("ifx-icon",{key:"faeab4af2670659cf2f58ceeb87b6d2f8a978ce8",class:"check__icon",icon:"check12"})),c("span",{key:"ebd7a5db84eca81da34d77ba2522a3659221de03"},"Adheres to web standards")),c("li",{key:"cb4a6d8ae95e77adce24376eb42acd21a64cdb6a"},c("span",{key:"ec31aaff74855da2ac91c18f1fbaea34d8f4dc69"},c("ifx-icon",{key:"6b48f88000731fc782b514b97b987b7ac22ce5c0",class:"check__icon",icon:"check12"})),c("span",{key:"7a2949072e16cf4467798477ca393dc4c0f6ae88"},"Provides a simple and lightweight way to organize and display collapsible content")))),c("td",{key:"c61fde63a81278555182cbb27991ab5461c6611e"},c("ul",{key:"5ee77d58854bad176f43011292e958e1dbd27dda"},c("li",{key:"e95be64eb112ee39495e2c6fbcba20676cbb747f"},c("span",{key:"f8f1570fed7d9e829d8c3503d2e41986617eea24"},c("ifx-icon",{key:"45baa82725ca721045d65cce34792fa65a353b83",class:"check__icon",icon:"check12"})),c("span",{key:"6c3ce948145b2a9d3ceb70dfcbfac7e56f0cbe47"},"Auto collapse feature")),c("li",{key:"2698e9963be778a4ac34424d3444ffd67c7ef788"},c("span",{key:"b08e4aaf2273da66bdae9be6dd0397e7d713f8dd"},c("ifx-icon",{key:"f422aa2a0185ad088f3613f8feacef03f9f5c11a",class:"check__icon",icon:"check12"})),c("span",{key:"a4adfa592feec11645a5454fe2afe4bd98b336fa"},"Initial collapse feature")),c("li",{key:"4d3edb6fe01f8d753f2defbb012e0dbb7896046b"},c("span",{key:"4150c87dec05ff04cf89761038fb33977933b195"},c("ifx-icon",{key:"ccf693d2aef10d111c6a1ab3a401f7e0c54cdc41",class:"check__icon",icon:"check12"})),c("span",{key:"eed5a5b3e1709fbf49e34d96d05610890f9180c5"},"React, Vue and Angular wrapper integration")))),c("td",{key:"928dbf258b958e858b056f8ed3584711e7c283c0"})),c("tr",{key:"42535b2c12485e7a213ccd721a733ac70c996c32"},c("td",{key:"0052287ec495d253bd4c012c4b9da78e3cc66d15",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"0f027f26ecc5ba509e92caa43873b1b8921d2c94",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-alert--development",size:"s",variant:"bold"},"Alert")),c("td",{key:"69243d98a53e6acd24575e914b215ca4961877f4"},c("ul",{key:"1af9ff86ac0eb84705b14cc246afeb9d387e6ec1"},c("li",{key:"eddeb4c11d034ece0ca658b09d7257956582d42f"},c("span",{key:"0e73c3cdbb0528837055fe515cd2d02ba92317b6"},c("ifx-icon",{key:"9c6068398ac45636bb058ec023019b3e29c05678",class:"check__icon",icon:"check12"})),c("span",{key:"bc9353bc9c18a19e792834c73aae38ee2758440e"},"Provides a lightweight and customizable interface for presenting alerts, including options for different alert types (e.g., primary, success, danger, warning) and basic styling configurations")),c("li",{key:"8cfefe626c93e464e502ffca2cdf94f52c9ac88f"},c("span",{key:"7b00ac3fc8a8d8ccd49654d2d704e7441259fa06"},c("ifx-icon",{key:"cc58cd630c7336f0ae7d87ccc9150046df8dca22",class:"check__icon",icon:"check12"})),c("span",{key:"ce428ab59abc1d5febc458a1b2b94f4f951ad30e"},"Adheres to web standards")))),c("td",{key:"40128f668e879d4cc63ae71994dab826217eea9f"},c("ul",{key:"54ae983a69edbc9917a65740ce2797e538f09188"},c("li",{key:"a4ea0f0b88664e87ab77aee96195806cdc677c47"},c("span",{key:"ec96ce45f2be131790a7d34db1d332f821841e1f"},c("ifx-icon",{key:"e264dac478022217205a442580521a297dc88fab",class:"check__icon",icon:"check12"})),c("span",{key:"7a0f0646a2769fecdfc2b6f70ea115975f6823b9"},"Configurable close button")),c("li",{key:"a8f745131d982aa5b35e3cddc469f23d959ae763"},c("span",{key:"f3a48f12774d4a5e40143891c0b58f65692595e1"},c("ifx-icon",{key:"db45b84b32389ff4366856304a929dd82899d78e",class:"check__icon",icon:"check12"})),c("span",{key:"fcf7143a144e46b4f951c61f5f42e0de51c73acd"},"Additional Info variant")),c("li",{key:"f061934669df125b1bc644e780a4502d7658e091"},c("span",{key:"2bedaf5fa2c3ce77aac7a618d98b4654d62cb4bc"},c("ifx-icon",{key:"1ab37982bb0390df92e96a6d3dd475e569e3d5b3",class:"check__icon",icon:"check12"})),c("span",{key:"7e6a1031e3668eaa688eae46a8b229bd6517a50e"},"React, Vue and Angular wrapper integration")))),c("td",{key:"7e2b72ba9c3aa90d871d8dae4fb9a1e75adab631"})),c("tr",{key:"a912b471325929c5c4e98a8ac23d11dad38562b2"},c("td",{key:"12c144973a5787b9af186e0f453c3377a9a854d2",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"18925f2858448cc69ceeadb4ad0e8367146df30e",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-badge--development",size:"s",variant:"bold"},"Badge")),c("td",{key:"0266b9a7306d83836324a8e9644ed0f652dbe076"},c("ul",{key:"df73eb97dba110daf14f05f821b976eec8179558"},c("li",{key:"943918ba87c3e42c961bad97c7105eb1d13729d7"},c("span",{key:"709f65596aa279f72b59fe0bef047ddcb20079cd"},c("ifx-icon",{key:"e921c062a3ca815159a31592802419a073db1188",class:"check__icon",icon:"check12"})),c("span",{key:"21083e88f63ccd7e0887852495c091cf1809f99c"},"Offers simple customization options for displaying badges, allowing developers to indicate specific actions, statuses, or categories with visual cues")),c("li",{key:"70ee9c1ad01837ba045f1c7934760de863dc31bf"},c("span",{key:"86d1d054ebe753a1e03c04706beebed45bc0a5c3"},c("ifx-icon",{key:"78406b1778129d994ec2431387477e4390d028c2",class:"check__icon",icon:"check12"})),c("span",{key:"805c8fe88d898eeaeec23cb907b422549bbe2b83"},"Designed to seamlessly integrate with existing UI elements and adhere to web standards")))),c("td",{key:"6c83cb9b1f8277c67c5b8ce035436dd14ab6e9c9"},c("ul",{key:"8d75a3f4909d2dffe373d892eb8010672442e2f6"},c("li",{key:"5b77fea0b304db06f29189463ec46398fab6e64c"},c("span",{key:"3e3d35cd4b75a412c6d67dacb262d1595e1ef99e"},c("ifx-icon",{key:"280665ef569e73f344855b07f089f5d164b59090",class:"check__icon",icon:"check12"})),c("span",{key:"7e0e13d3c2a36f7a71646d0f0bc64708d4a51f4d"},"React, Vue and Angular wrapper integration")))),c("td",{key:"a86b3c17d08b071cb10b11b55f85c5deb3f59550"})),c("tr",{key:"88bfaebe869023ef94a9b54f274e6aa159caba95"},c("td",{key:"af9bec690861fac6be6d31207dd4c9b0c0af8369",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"6d6ac5ffa4e1ec3f11ce6bfb93a999dc2a99e69b",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-breadcrumb--development",size:"s",variant:"bold"},"Breadcrumb")),c("td",{key:"a629edab0452e8873d8b22ee3e33377fc75169e0"},c("ul",{key:"280b762ab5aa19ca05c1e1db28e0368413dc5217"},c("li",{key:"2c60125c0ac3f67eeea8480a135d1b6f26803312"},c("span",{key:"803c59b077ad0d8eb2f31b575f73d22e7b73cddd"},c("ifx-icon",{key:"2008d8469a576f5fab435c1e75ea7eb05204057b",class:"check__icon",icon:"check12"})),c("span",{key:"9d1331cadb11f207534c99d3f565b1f4d4543165"},"Provides a simple and customizable way to display a sequential trail of links or indicators,  representing the user's current location within a hierarchy of content")),c("li",{key:"44476725da6b6d0ae2b0398e21eb24f0d4bc5695"},c("span",{key:"b17fdabaa095dc599066b4fd68c93d5f4e3b7344"},c("ifx-icon",{key:"7b8a58bee3f180c17e3f0ca636ffd3e54e63e48f",class:"check__icon",icon:"check12"})),c("span",{key:"d1519645e6d2f28cb3ee6a289163303e321241d3"},"Adheres to web standards")))),c("td",{key:"ea8cb1822e12f785bcfb544d64567ad274530376"},c("ul",{key:"aac603b96593e05989dfbc01a4183234aa07d02b"},c("li",{key:"3e78b3aa72cff2718928050f3ccfbbc00193cdd5"},c("span",{key:"459b5a0a5252d638f88a79b6ff9a849e950b1502"},c("ifx-icon",{key:"c696691ce31ec51d784ad4eb8b1d427e2327f6c3",class:"check__icon",icon:"check12"})),c("span",{key:"8cbfb840e7a7b261c7dae636acc10025b5b9798c"},"Possibility to add an icon")),c("li",{key:"d1ddd1f1bfc1c1a155eb85558dad34bd4b35703e"},c("span",{key:"aefdd11b822003eb68b264de592763efe6ab8fc9"},c("ifx-icon",{key:"0152b25b6d4e1bfc46446ba45c84c79f29a3f06d",class:"check__icon",icon:"check12"})),c("span",{key:"91b0c2ab2f373e2849806f61cd637c87b1646e99"},"Incorporated dropdown-menu for individual items")),c("li",{key:"eb5ec0e139cc0106b9e78136c84ad3f660b965b2"},c("span",{key:"08128db435df9fb59ddd734e33fd178725bc1119"},c("ifx-icon",{key:"26d71651eb3ba22501b1fb43900b24cdc1e4df5f",class:"check__icon",icon:"check12"})),c("span",{key:"fb53e44ce6d5e563f33f53bb96f337a0b08c88b6"},"React, Vue and Angular wrapper integration")))),c("td",{key:"530c4772c140f8cb6fee0e7757c8bfeb3bce2881"})),c("tr",{key:"e9869f920d1dbade1a67c4721f49303bd73bdff9"},c("td",{key:"a51b7e1cfcb1990107cfa0f647b1afb59dfb13a5",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"f6232318bc58777423bbb449e10b46d16c2b8ae1",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-button--development",size:"s",variant:"bold"},"Button")),c("td",{key:"fcdefdf15949b715d961159c2dcddf504fbdd673"},c("ul",{key:"36d525e48a7df25afdd447996b04bc9d73ec96cd"},c("li",{key:"0493b3ffb5d9a72b16bb9d8878cf402173b500e6"},c("span",{key:"5791ef78a6cecc527f44dba3013bcfb2fbc49cd2"},c("ifx-icon",{key:"18deb22a8638d3483dab2fc356ddaac739b5f5c3",class:"check__icon",icon:"check12"})),c("span",{key:"5bf054b09332de983bf5563940ecfd9cefc73d87"},"Includes basic styling options such as colors, sizes, and states, providing essential functionality for initiating actions")),c("li",{key:"43b43b6d21392fdd420e4d5de9156527d0be0d6b"},c("span",{key:"21c8e421b141575855735e9e6883910a39c7bec4"},c("ifx-icon",{key:"57579c0ff62da49adcdf3cddb1e3bf1e84b71a1f",class:"check__icon",icon:"check12"})),c("span",{key:"78d641b6f05eeeb6a814be86863fd609e2eb78aa"},"Adheres to web standards")))),c("td",{key:"e151102e6d1086c310415a2c33f3b80008f68e2b"},c("ul",{key:"b6e177c354f511b6c3827d609bae988d93dde3ac"},c("li",{key:"97dfc9b18ea758002589fb71e2c7a9e46caaf216"},c("span",{key:"af8bfb54a35f066c0b958457255ae70882018d5a"},c("ifx-icon",{key:"950e77cc7939c6d18f5b4ca2fcc8e089283980a3",class:"check__icon",icon:"check12"})),c("span",{key:"8e62043c26ad0ce65ad41bba072cd0e600ec0b11"},"fullWidth feature")),c("li",{key:"d78251795f4ca2cfe931bf7c7aa1662679573d73"},c("span",{key:"de20563fd28bc87fb2854638b744b66529723733"},c("ifx-icon",{key:"0f19319f77093efc0ac7c41456ae52087b9ea85d",class:"check__icon",icon:"check12"})),c("span",{key:"85bbe99ff7aca59084ac3a8014f5b66b019d729b"},"Icon integration")),c("li",{key:"6ad8b71217454fad5aff9b2a80ea35cc88563484"},c("span",{key:"ccbecb192b20f199dfbb2ba67ce1af7c339c438b"},c("ifx-icon",{key:"997c35faa553f3907df4c0876be728b3651e4f5d",class:"check__icon",icon:"check12"})),c("span",{key:"dd0d5db341741435ad450343b7c305747b92018c"},"Link integration")),c("li",{key:"c5eaaff12880b0196783b191574dc44f92421bea"},c("span",{key:"c96eec7fe549c422c508c2dc994ea01663ef5c5a"},c("ifx-icon",{key:"eadbb622bf64b9a3c8ae949fc3a5938891223875",class:"check__icon",icon:"check12"})),c("span",{key:"588b5199a7062d6bab67056c9b87932d54125c98"},"React, Vue and Angular wrapper integration")))),c("td",{key:"908d173f46640ecb4cc5c3e315c87047a45d2c05"},c("ul",{key:"0271a6c781fc850752e27c9446f66ca11145676b"},c("li",{key:"2ecad646d03baa8e0a8ef505dde2235b3ac08869"},c("span",{key:"eb059f2484d52054d1217e97170f759b30e2143c"},c("ifx-icon",{key:"0950cde5d1888a74672786a9c03a0f1939d8b800",class:"check__icon",icon:"check12"})),c("span",{key:"58ffac6e58bbe36fcae213f6ad6e8e7b2dcae08d"},"Form integration"))))),c("tr",{key:"62bf201d672843a3659742c3c0974a1df03fa610"},c("td",{key:"b81dcfae5ef6d64e75ad2c13d3e94dd774e4fe13",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"17c2850979ff42007cf91a06aee453967aef790a",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-card--development",size:"s",variant:"bold"},"Card")),c("td",{key:"f8f10063b913ae90d4a31832849c2d51098225f1"},c("ul",{key:"276a9bc25010aa7059b7898041e3e8f9d4685213"},c("li",{key:"91be80d95e13731290db11fbf126c9296b1cd835"},c("span",{key:"804f1cd8dc601820957e5d5937b018ac5b85ddfa"},c("ifx-icon",{key:"117355d111a36a824c3531c1d05563552ae00ad5",class:"check__icon",icon:"check12"})),c("span",{key:"1137a5058d66e16c642b53f6085a18be127206f9"},"Provides a structured and customizable layout, featuring elements such as headings, images, text, and buttons")),c("li",{key:"27af1fcde3f2d03958e91b47f64cd3dd4f8f5b06"},c("span",{key:"f390da2994a4afd01554a04128b4f5bda3169953"},c("ifx-icon",{key:"1d835e545a75e4600d9ac57841aa21228727beac",class:"check__icon",icon:"check12"})),c("span",{key:"2b476badd5bd2d7d587d59fac8f8da7001537241"},"Adheres to web standards")),c("li",{key:"c29e2cb4c31129893e8da47923ca4915d545b3b1"},c("span",{key:"3798871acd1a68b512fb1f358b99fe25b9b2031e"},c("ifx-icon",{key:"ff4bfe8132064cea4a20a86cc505567a828fea90",class:"check__icon",icon:"check12"})),c("span",{key:"4610fe22f9b666d5cabca62353d3f7296ad079c4"},"Horizontal and Vertical layout")))),c("td",{key:"515164d2489a6183cd3639ca2498637fe1f212c4"},c("ul",{key:"9cd69b209a60cac0bd7d4a37cfc5b1e6f574f593"},c("li",{key:"6e43f28144571ffd461f461a210e7d392d9302b8"},c("span",{key:"d5f86e578029475ea732117f9900affdc5fb8789"},c("ifx-icon",{key:"ca2f09237e82b74dd82707c1967e547f2345d194",class:"check__icon",icon:"check12"})),c("span",{key:"d7b8d78858342803b0ec1d1f7ecb8ece8951ab0c"},"Possibility to embed multiple buttons")),c("li",{key:"3162580c38dd88ecdc5966502d867d4092119b1e"},c("span",{key:"5a3da3fea3f8aca11e216958e654fcfbe46912e6"},c("ifx-icon",{key:"e01cc056299fa160bfadb63a75878ab3f798de87",class:"check__icon",icon:"check12"})),c("span",{key:"2a127996bdf745d267a3d8904ae8f39d13c6d76e"},"A switch between a Link and a Button")),c("li",{key:"82f487e46d51cfc47433f230d91059ad2fcffdab"},c("span",{key:"8fcdb02e90b02067f5a0f45747adeea010d1da93"},c("ifx-icon",{key:"d31d54ea56f73b8bf30894e3bd2086f40d24b441",class:"check__icon",icon:"check12"})),c("span",{key:"6671674f90a9509e3e9c7ed5456d6046ad5b5de4"},"Enhanced stylying behavior")),c("li",{key:"e7623c3195b7fa278db2669fc35785a83de64f73"},c("span",{key:"b4e1ee37c8c9100afcd46db6964ce743dc3f6761"},c("ifx-icon",{key:"3d6c530613323a145f5c190c4d4b61cd4452f4aa",class:"check__icon",icon:"check12"})),c("span",{key:"8ad6e6fa5718aadd8647aa5083910f52f2ee1b77"},"React, Vue and Angular wrapper integration")))),c("td",{key:"44e5bac77cc8037d5d25c93283fc3554e2f93e21"})),c("tr",{key:"482c4a07fa26b97e37930b7e86d43c22aba7cd58"},c("td",{key:"1da5efdbb5e692ad09b0eac4cae20d5446b0b8c2",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"54c5609814760b280633bc6cc5648ea946c6e20e",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-checkbox--development",size:"s",variant:"bold"},"Checkbox")),c("td",{key:"327d5d5a57c216b127505b0e964ffd743e705136"},c("ul",{key:"06f7ca321b5e1c9a3310ac10d4c9012bba74173e"},c("li",{key:"c1be0d6ba7f2833938d0691d1e20a597c5603936"},c("span",{key:"d4477a320c3dbb92a564cb67f48faec32929faa8"},c("ifx-icon",{key:"15954e9093eb86ffa19e1ea91e2a827e5b4752d6",class:"check__icon",icon:"check12"})),c("span",{key:"df80e616dfd039834ff2e45534cfe23ec691bc55"},"Offers a simple and customizable checkbox input, allowing users to toggle between checked and unchecked states")),c("li",{key:"c8ea1229a046f0d0e23f87661a6ca192ea9f819d"},c("span",{key:"eb6534e61918e63b7b2f93c566bba5751ba31829"},c("ifx-icon",{key:"03f9abd29e525ad819aacb4b37d3da4cf6bfc9fb",class:"check__icon",icon:"check12"})),c("span",{key:"867c6b854b755bb0cc7be8bffd6e999763e00e8f"},"Adheres to web standards")))),c("td",{key:"2fd48fc3135c39abf065e0f5d03c0fe31a96cdb1"},c("ul",{key:"a888984d2df2c404fecbd709ba3a3c3808af2461"},c("li",{key:"d9220a36335ff4a65f9813ee3ebc0606a486c3f4"},c("span",{key:"757377e5060d96c44a2ff169925ddd3d35b357e4"},c("ifx-icon",{key:"e937e4a6c47680e83162f00e7f745ab532d11173",class:"check__icon",icon:"check12"})),c("span",{key:"4363044a97c05fdd68e2d7b74eb8b96260909f11"},"Indeterminate state variant")),c("li",{key:"a5105da5764d95915a3c5ae2e3e479219ad90e78"},c("span",{key:"b37f8591962c25ca24f0d2968117005acf85bc1e"},c("ifx-icon",{key:"11e3aabfc01dec22157fb258d64b808cc87a0b40",class:"check__icon",icon:"check12"})),c("span",{key:"c0c8d800db702e3fd2f53641a15c533b802ecd44"},"React, Vue and Angular wrapper integration")))),c("td",{key:"8c1793f4998ff4f3741f2931145bf718d5fa89ab"})),c("tr",{key:"f6f571ad63ba685376e98b51933c6999f574054f"},c("td",{key:"0d1dcaa8f774d63a53b09ad03a3e9d12c11c2671",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"355792182617c017fb87936e322b4c52748c60c7",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-chip--development",size:"s",variant:"bold"},"Chip")),c("td",{key:"0fa5cbfc9fb379ff9d1a93ae234987625d320f12"},c("ul",{key:"1113170a696cba283594825f786d12595f67c252"},c("li",{key:"5e25521216fffdb373c5b137147e54adf5f07b45"},c("span",{key:"436eb79c84c27c43640ae5a91c134ae6d66dfd39"},c("ifx-icon",{key:"f3fc8d01abce2c270a1c0febfc9f66bf92751308",class:"check__icon",icon:"check12"})),c("span",{key:"ae690e461a8319a098ffbd26f5a50f635b5123d3"},"Provides a simple and customizable interface, representing discrete units of information or user interactions, such as labels, categories, or removable entities")),c("li",{key:"9921d90399b8f11634b2637f15eae4c45f6142f4"},c("span",{key:"52f0519a23f8b5e136dd07476f144badafb86c6b"},c("ifx-icon",{key:"2ca127b36bb11d81639c6683091fe7a870bc9e9c",class:"check__icon",icon:"check12"})),c("span",{key:"f1a027d5a78a468622c4b53e801673d7b866ab9f"},"Adheres to web standards")))),c("td",{key:"d59a3f50cc59e0acde1b726dfc8f9935e555b935"},c("ul",{key:"3ce7ac973c5e4306a1ad0128e14d9105679d1a56"},c("li",{key:"e3e4d1092c7a53e34580de4bd3a19544119ee4a2"},c("span",{key:"5050a30e808713707bc8857178a7e17f6a0b5a08"},c("ifx-icon",{key:"30dc35bd1fea23d7298afe3fe366cd9d67b288e9",class:"check__icon",icon:"check12"})),c("span",{key:"fb60be48055dc83babf6d435edd9a8989266cf35"},"Incorporated dropdown-menu for individual item selection")),c("li",{key:"5b6edab1edeb9fa7a3cb16d484404764948ec112"},c("span",{key:"01cf48db9323ed58660e8de6669c218c23138e21"},c("ifx-icon",{key:"6f712b193c14388ede4615ceeae0dab06627757d",class:"check__icon",icon:"check12"})),c("span",{key:"e6eacc979b07f468d9bf49bcc73ee28d49bb23a0"},"React, Vue and Angular wrapper integration")))),c("td",{key:"beb7d2a2aa21113378eaadbc0cda48cf0bbad5f4"})),c("tr",{key:"49e6b4769c2ba4319d3b0ec052ea4f74a6e448a9"},c("td",{key:"e193176fad7f1fa7d1c84c193dbc8f3b47c970f0",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"20bbed9a7ab0c8fd3d2a70742540cecc689b332f",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-chip--development",size:"s",variant:"bold"},"Date Picker")),c("td",{key:"6b23022ba9b820cae9bdc153a4271f1914f08c88"},c("ul",{key:"2bcd78af106ae04e6b5128c47a9f5b3ab6039afd"},c("li",{key:"2980e14f53b99deccbc0c4c8845543e1c647900c"},c("span",{key:"e6b3496809a94d214d580f941c010c467ab5d549"},c("ifx-icon",{key:"e9645270065d9745e5523427699b7e8f54662f9d",class:"check__icon",icon:"check12"})),c("span",{key:"f0cda89dcdda2e115d8f5ffbf35ef8fe4f1c20ca"},"Provides a customized wrapper and theming for the standard date picker element, enhancing its appearance and user interaction")),c("li",{key:"c6ca28a3978257ba2619b19406e7e7f81155ae0d"},c("span",{key:"f2c6f0e9f4416365cc75e0c7430e0a7af3cc1643"},c("ifx-icon",{key:"bb56f728c795450f5023d2e9dcd19f21fdfe385c",class:"check__icon",icon:"check12"})),c("span",{key:"80b94dfdc93f2823e34f7cd52f0ce9dadf819448"},"Cross browser compatibility")),c("li",{key:"8f645e32c0f72f43347a07623b2304c672fa70db"},c("span",{key:"a93bad2033f92f43a03499713f421c9fb4eac3bc"},c("ifx-icon",{key:"9e6d9e617d8ad0e1e01c9b829efc6759f801769a",class:"check__icon",icon:"check12"})),c("span",{key:"faba747262a06d53aa7ca8d583d82144ae992eb2"},"Form integration")),c("li",{key:"c12e9657c1787f548c3734f93126ae3c6b3e11b9"},c("span",{key:"2c37bc6b43d1262c5f6d23f9c4e28bad4e4846df"},c("ifx-icon",{key:"f8698a13a004ab4c63e6faaa53e1851b14cee9a7",class:"check__icon",icon:"check12"})),c("span",{key:"5020f035c8b9f2f3ad49ed9092a3c77cb602cd37"},"Adheres to web standards")))),c("td",{key:"392404ca7627f9b1d0e66dbb5dc2a8530fd542a6"},c("ul",{key:"891b9291e1bfbf3c5836a8ae544c81918a0b6f7c"},c("li",{key:"3dd3e221c1a4250ad28dbb229e721c8f90fffef8"},c("span",{key:"cd57f407c223b6a1672a6b4f0876fbcff76fc0d1"},c("ifx-icon",{key:"40a8172ead4e8f7bae3645551ef17d20dbe064a3",class:"check__icon",icon:"check12"})),c("span",{key:"c1548d5f27ae96ea95aefa8f982e7db14c6233b0"},"Range feature")),c("li",{key:"14d75c5b545fb152db843bb2fceb49cbd757b741"},c("span",{key:"8a0afa3e7da06a2af138757609a336958eaae591"},c("ifx-icon",{key:"f4c0b8badad327b582ec97d46d54bb79db6dd72b",class:"check__icon",icon:"check12"})),c("span",{key:"f52c1155abd6ceed075920a370ba234e30fd3161"},"Default value feature")))),c("td",{key:"6505a91cf9487cd6b5ec7c3ec6743471a29569ba"})),c("tr",{key:"f336dd2d43dc6fb2fc40a672e2b1497de362d958"},c("td",{key:"46889a9deb32c2af5a0003a134498f192fb923d2",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"5f24d30c1891cbf42bede30e23843c766e387f11",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-dropdown--development",size:"s",variant:"bold"},"Dropdown")),c("td",{key:"f3cbfa4ad22ea8d17d68b181b783e3a01c5d07c6"},c("ul",{key:"76e05448d76224b2198ce77bb18e1cdd7293cc1f"},c("li",{key:"32208afca9745946268cfaffc79b27684bdb4e95"},c("span",{key:"318823f712c9cacea7c1ec4785d6089f30f88636"},c("ifx-icon",{key:"be0faf87adcd3aa3c444feff8aec2fb61feac35e",class:"check__icon",icon:"check12"})),c("span",{key:"15dcdb363d7bc22ed7827c54dd541fe25ed426d6"},"Offers a versatile and interactive user interface element for presenting a list of options or actions")),c("li",{key:"deb1c5b7be24da657a8be156bc5d746933efe4d9"},c("span",{key:"a2d786776c8c0522f6efe8421fa3d080c0a52112"},c("ifx-icon",{key:"ee5344ed97eed9da3f1edf6bedb16c1f7bf6ca75",class:"check__icon",icon:"check12"})),c("span",{key:"4eeb7d6e779e6fe9051d6265b69506039227f62b"},"Ensures consistent behavior and compatibility with web standards for a reliable user experience, while intentionally limiting customization options to emphasize a standardized appearance and behavior")))),c("td",{key:"9b7b5fdc15b8bff488694606c3c7b33cb8c6c597"},c("ul",{key:"863f41485abae1210a56f30e766da6b07911d9c2"},c("li",{key:"8bde9d1ccb25cceb31275ddb2947b218ab6f0b8a"},c("span",{key:"e12883e453417fe00f4fc5c098b8c47b29247ad6"},c("ifx-icon",{key:"bccaf31c33161448772f7cd794043270a2b17abd",class:"check__icon",icon:"check12"})),c("span",{key:"ea11a2fd90d3171d8ff63de509cd7118ba3599d2"},"Search filter")),c("li",{key:"153af7553b147ff3c2d2179a148084f516fba414"},c("span",{key:"78dcdcdb70254a9072bfeb5eecceb0bf1f2988cb"},c("ifx-icon",{key:"ab32b9486c4a5ec13619b01ef14de8f006a3a38d",class:"check__icon",icon:"check12"})),c("span",{key:"6c273a7dab8b98c8242180710b614a4b81ba9848"},"Header section")),c("li",{key:"7cf8e5a2f6fa3de55d783a20c9e3c9f61e59ace6"},c("span",{key:"09a1043829ca6dc3ed2c12b924ffef37a6ef925f"},c("ifx-icon",{key:"1ce0c121cba205b567930392d83fb650733cafa4",class:"check__icon",icon:"check12"})),c("span",{key:"9b458cd5d0d7e0ebe496b6f5198cc753158216dc"},"Menu Item Divider")),c("li",{key:"f5ed807582c84ae1bf3f69f7e53960a6b2732e8f"},c("span",{key:"99756e02ad72e0204f00015b7ee951d28d482aa9"},c("ifx-icon",{key:"d8b3719d87ee3a2fdcafb99fb4a4db73874c5e5f",class:"check__icon",icon:"check12"})),c("span",{key:"dcf09281474b14527eea54822a573d70c6c667f8"},"Icon incorporated")),c("li",{key:"17f20fbffb58d490e834084f3f7838c8d6a93228"},c("span",{key:"21c79baf94c22996f2028b70f6a9d92d10d7f51c"},c("ifx-icon",{key:"9a0b6cc05b4246c1f08bd1ec662546fdc6aeb252",class:"check__icon",icon:"check12"})),c("span",{key:"85759cb5e0c84f07e393d232c59eb052a621fc18"},"Extended customization and configurations")),c("li",{key:"eadedd7a782ab404adf9ee5b02a58801b30a0030"},c("span",{key:"404f8f95bd284a3a4bcd7aeb3d0ac0df8f868b1a"},c("ifx-icon",{key:"8eef923fcc68a3dfb754f639193a824add68d474",class:"check__icon",icon:"check12"})),c("span",{key:"a3c1e6edc62f443819ba5ee36ef141cb2db4af39"},"Separate label trigger")),c("li",{key:"4ef0732f17b1a9062672dfa81446655d62733cad"},c("span",{key:"88a1db92a13968b9397f488574e059fb5e60146d"},c("ifx-icon",{key:"2d53673c2b20b614ee622ae63b794903b4875b35",class:"check__icon",icon:"check12"})),c("span",{key:"6be06064d8526a31da0ec56a601c1141d06bd975"},"React, Vue and Angular wrapper integration")))),c("td",{key:"2e514217c29e41fe3d8f7971f8f168f6ff9a6284"})),c("tr",{key:"0e1c139acac843cc90d5b905be2c82c27edd9499"},c("td",{key:"d86c952061b67e401d6895e7ac2121f4be9aba85",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"d2922ed290eab6abd7cd60ec48cb181879d43529",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-footer--development",size:"s",variant:"bold"},"Footer")),c("td",{key:"ea7352459679046835363dcff5e99e86e7626586"},c("ul",{key:"16e59103f38750fb54bdaddf586e928b6bc16b39"},c("li",{key:"e1bbcc94f6b160989a00c782d0afee1fd73a9b9a"},c("span",{key:"b2c2e399d284776c387266331154b04aa5784dc7"},c("ifx-icon",{key:"07aa15ddc7581ad135431f9aedec72c86d405f9d",class:"check__icon",icon:"check12"})),c("span",{key:"ba1db2be365beaf3a86c2e6582ba88727bc27653"},"Provides a standardized and customizable way to display essential information, navigation links, and branding at the bottom of web pages or application interfaces")),c("li",{key:"07bd986c21986d5efaef78001ffca111e7cf234c"},c("span",{key:"6d6ff94101bdf41dd3ac88afa05cea15780ae6aa"},c("ifx-icon",{key:"d7ca7aa8746ed13aad44a1d5a8512f570cf29ac3",class:"check__icon",icon:"check12"})),c("span",{key:"bb0b5b92a1418ced1682abc783ee1769006d86bb"},"Offers a flexible and configurable layout for organizing copyright notices, contact details, sitemap links, and other pertinent information")),c("li",{key:"1e27bf73d3920fccdb6fef7f5d467f3934f7dfac"},c("span",{key:"09bf4165ef6f805d89ffbc66b8eedf6eb1e3e692"},c("ifx-icon",{key:"a400c2b8d539f0063b32012f74f56c1d3802dc1d",class:"check__icon",icon:"check12"})),c("span",{key:"e86bd535af295fd2808eadff4e7c56c873a908ee"},"Adheres to web standards")))),c("td",{key:"9024db11009df0abab7558e336745f25357f1338"},c("ul",{key:"583bab41e163ead12f0c402e5b5bcbd2da106259"},c("li",{key:"a67705bd1d08a3680f64f83e29d699fd344ef378"},c("span",{key:"52945269f2f944e75649a26bca179ccb54368087"},c("ifx-icon",{key:"d8a660144f57d2ddd9c27ca9bea4c29ef0612704",class:"check__icon",icon:"check12"})),c("span",{key:"c2e1997db08ad4d933b062a3f28a757e77bdc63f"},"Small, Medium and Large variants")),c("li",{key:"939f35f724a58280e23e0d4dd7c22762176f2711"},c("span",{key:"ce655665893b175c5eb823548d6b9e7f82ca2ea1"},c("ifx-icon",{key:"2403f5cfe4e24bb6bd88eabcf6107235e9854fb0",class:"check__icon",icon:"check12"})),c("span",{key:"8ab489af7675903c66ed0ad6015e251954d0b3a7"},"React, Vue and Angular wrapper integration")))),c("td",{key:"7861e5f406fe0ab6911cf01164c257aa194992f8"},c("ul",{key:"3df0946a9071885183f03a05ffa796d7befc46b0"},c("li",{key:"18bb629b5f484fdabf09b481bfd6f43b8be9f156"},c("span",{key:"6004b8f4cee5e24166c8bd9281ad3e7ad8329d6c"},c("ifx-icon",{key:"89d48c03d713d298fd1acc245e6a3f0c60f66db5",class:"check__icon",icon:"check12"})),c("span",{key:"79c9938e0b7054857d750dd512ed9ffe7085156d"},"Customizable and removable links"))))),c("tr",{key:"26ab80a60cb90bf91da323d6239c0bfc9742d28f"},c("td",{key:"a671d8bd405a7fdf0a652266f2de23f6fa67e77d",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"4f3e2fe6e68396dd3f826f073ded755f2859f800",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-icon-button--development",size:"s",variant:"bold"},"Icon Button")),c("td",{key:"a6fe623f72a5e2423f9b4e5125301d225f17e0cb"},c("ul",{key:"383430ad5b4352cec3fdfe87d7569a98f47a81a6"},c("li",{key:"b4f6b114dcb6de7c1e8ad3a343edd25abd640066"},c("span",{key:"8899ad1f8f8338791375a19e1884a31bdb963bff"},c("ifx-icon",{key:"dc8091635c84230a13ea6480ef9535ba4f16455d",class:"check__icon",icon:"check12"})),c("span",{key:"e73f95375fdb8a48d2f48faa93b10b21f6a4349f"},"Offers a compact and interactive icon-based button element")),c("li",{key:"b92a9f0068cff32382729b35fc36212f8896979f"},c("span",{key:"9bdb475785da5e031a76ce7137604b9c1e1b9608"},c("ifx-icon",{key:"c32d9d82fe461d7772f9f8dbe68831842f250428",class:"check__icon",icon:"check12"})),c("span",{key:"b62377a124666c0b5d8bf74e35c9aa0c0c5ea1fe"},"Provides a limited scope of customization")),c("li",{key:"11e19cbb76092920b11badbe8575290249e71635"},c("span",{key:"ae7cebb7deb481f6f551b96b7df30b3b22b9fdd1"},c("ifx-icon",{key:"622ff031a8950fcab7cdb3a944c219d30850e5b6",class:"check__icon",icon:"check12"})),c("span",{key:"17dd94e230a029feefa91e81a195e25b9b4fe029"},"Adheres to web standards")))),c("td",{key:"db3ddbbe899ee15b7077d20053de6dff14c6532c"},c("ul",{key:"a0728ececcafc221adda0720ae6b25254b2b3e40"},c("li",{key:"f418dd14e8d57068d9ae6e153b4f6016f9b8b0be"},c("span",{key:"d5974c448b9b7feeb6c964e73e0098990ec69368"},c("ifx-icon",{key:"03b41d4362265268bd938c17849adc6f7a70d582",class:"check__icon",icon:"check12"})),c("span",{key:"372f6613be4117267c1fc41198a4da54149f440e"},"Additional Round and Square shape variants")),c("li",{key:"77887f4cdcf29682994d231f57faa9d22abb74a2"},c("span",{key:"dba6a5f864bead69619b0406a6651cf9df988454"},c("ifx-icon",{key:"e72f9a6103255b40ed4da4c299612130d43de834",class:"check__icon",icon:"check12"})),c("span",{key:"94883f5d6b8060fde4e23860b23dea104ee5785f"},"Small, Medium and Large size")),c("li",{key:"f556d97d00400169b4e8a4842c952c260a0cb9b4"},c("span",{key:"9cee94072a6533afca7378b31cd8e68868c22c61"},c("ifx-icon",{key:"a6f3e718770d571a8c1e454eab0bc4ca08d93db9",class:"check__icon",icon:"check12"})),c("span",{key:"109191d47bc951b21ed20b856780b07182ae987d"},"React, Vue and Angular wrapper integration")))),c("td",{key:"f5ab5449a3b08d97a53f0d40704b9b3fd2227cea"})),c("tr",{key:"2c31a663d82461c6a74d4d03d4facf99252c249a"},c("td",{key:"a11a8e5ac41aba683c584362b7a3d8cc762f2e38",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"63c0dfdc3dc9b589afc6800b7a749593b33eae6d",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-icon--development",size:"s",variant:"bold"},"Icon")),c("td",{key:"bcd6112b703c67d37a55247fd56b3daa7a628c5e"},c("ul",{key:"bb22fac71b666322c82d7e1d5c716a00dc9964ec"},c("li",{key:"394452e293677cd4d1b1f2c0dc30cf3edb860217"},c("span",{key:"feaced7cd94fb6e82318d5316ccbe10fb953d307"},c("ifx-icon",{key:"9a9d17ebd0ed8c35884ca4296407f9ad3deb26cc",class:"check__icon",icon:"check12"})),c("span",{key:"9d63060d6664237999f06205b259ab71734c5d23"},"Offers a wide range of iconography options, allowing developers to easily incorporate symbols, glyphs, or visual indicators to enhance the user interface and convey information or actions effectively")))),c("td",{key:"847e30c5adfaac483ad955b9ae1bb700cdd01c6a"},c("ul",{key:"8262dafe666991b839cb8e5864f9c36995b8ce73"},c("li",{key:"e50b9de4a41f9b4f763ec09a8ca61cc2e40f8cf8"},c("span",{key:"cd370a0ab59e4ceac582059d3710eff962d12ec4"},c("ifx-icon",{key:"8351a085eba35ca0da1191b076b1ea9408c6e6e7",class:"check__icon",icon:"check12"})),c("span",{key:"27f27f4197f5e181598269c5704816b934655da2"},"React, Vue and Angular wrapper integration")))),c("td",{key:"0b040c474e63f2508c6f363f44a20a8e0eb5fe58"})),c("tr",{key:"33bdcb92534b871a8ad55ed649c2dbb7cfe5bc0a"},c("td",{key:"ce578b5b201973307c2fcad8be34fe3ec04c2513",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"113863a95123feb3d62b281ab0e1aff55d16ae6c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-link--development",size:"s",variant:"bold"},"Link")),c("td",{key:"fef84c1b493ce0452f0436950d3b030f8f338d37"},c("ul",{key:"45af80aa175e1c2518f55587be76d75865775da4"},c("li",{key:"1941c3ab9c67e44ffde9e1fb058a8c89bfdd06bf"},c("span",{key:"9a558cffbee71d9bbd94f6471c99db2414ea7e4b"},c("ifx-icon",{key:"3ba4a7e002dbc5382622be201ec78c470b94fc92",class:"check__icon",icon:"check12"})),c("span",{key:"b7b1de46b3951803c3ada18e1d689b350b1d1d03"},"Provides a flexible and customizable element for creating hyperlinks within a web application")),c("li",{key:"a98802ac3e3386852011535ded0b020108f525ab"},c("span",{key:"c69719a2bef312b2d933f0ef544a9e17bc49f816"},c("ifx-icon",{key:"2859d80c6ecceceef3a2a0412c7b81666944acd3",class:"check__icon",icon:"check12"})),c("span",{key:"b82f9412dd22522ea04c81720616b3f5813a17bb"},"Offers essential functionality for defining clickable text or elements")),c("li",{key:"2158c616ecc5181b264f034004dae6c368cf3c90"},c("span",{key:"401b66fc41b3eb1766093528276f1aeeeae6f8a3"},c("ifx-icon",{key:"c9123731f56e980d1bce44f0d100d37f008e265b",class:"check__icon",icon:"check12"})),c("span",{key:"c6447df406fcc4a14d7f1d8f322fd05816feefc1"},"Adheres to web standards")))),c("td",{key:"35d9a1e356566d8a948726540bb34ddf0bb8ed2c"},c("ul",{key:"0b8bc2015a325f959086d6f964d74fd042d91bd1"},c("li",{key:"eff9446b8974e519c4a4dc0d7c25e8ef439a51a2"},c("span",{key:"060297827e511d30d9d35eacc64cae319971ac9d"},c("ifx-icon",{key:"665355eb136acb834707771d7d1ab529c0321fa8",class:"check__icon",icon:"check12"})),c("span",{key:"3fce26e2d3d27910095db84d263f143d978f6670"},"Small, Medium, Large, Extra Large size variants")),c("li",{key:"beee67e84dc26a83c11175c92c801d64c2749b93"},c("span",{key:"0ee9cc3fbcadd89eeeb4977f79cbb656d1b21581"},c("ifx-icon",{key:"9c4de24b633b602ee852b01e99458461fdd51a34",class:"check__icon",icon:"check12"})),c("span",{key:"a2f5679420a3a5bbe63c407701365fe3b37bc9e0"},"Icon incorporated")),c("li",{key:"b8c695734b94a1565a96e6d52215da0d06e3f5f7"},c("span",{key:"46f5ec7ef5d955724a6e3a7e217c763738764300"},c("ifx-icon",{key:"cebb302ed606533f8702a5851127953c29f5c7ea",class:"check__icon",icon:"check12"})),c("span",{key:"a4a90a81841364d2763ff5a93f350192dcd6f96a"},"React, Vue and Angular wrapper integration")))),c("td",{key:"1e210fe9dcf0c28cb0ee4e33e1bab8651b231733"},c("ul",{key:"ab8509ee90240bc9abd9a130fdb65e212468dc44"},c("li",{key:"efd8ae40ac630efed4a0fa7a445bd4822e1bf760"},c("span",{key:"4ce83e0ea018c6bee18b471fa19fb0903e9c899f"},c("ifx-icon",{key:"6e2fb46ab2a83c5718662347dbb7c12f24518c88",class:"check__icon",icon:"check12"})),c("span",{key:"f891f1ee4f89c75dfa79135f39e5df8d1ba0f6a2"},"Bold, Underlined, Title, Menu state variants"))))),c("tr",{key:"276f687094fbe6e6f32647fbd72d49217248caaf"},c("td",{key:"d879bdf13fed4280e5bb2da1a9f83cbabe5c26d2",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"e6658037e05a465020eacb894977f87f6d11acb9",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-modal--development",size:"s",variant:"bold"},"Modal")),c("td",{key:"018faa54408a1fa9b6fd52f2d4c364f91ef9a557"},c("ul",{key:"a09a25e5cfdb2cd1a28070786bf79f9dc2d31fb0"},c("li",{key:"14598338886aaa7472bf4aebf5fe32f8ec7746cc"},c("span",{key:"78fe9b4aa6012f1a2fa999b320afff9221fbd889"},c("ifx-icon",{key:"be9586c185db395c75c796be6ae23088b44250f3",class:"check__icon",icon:"check12"})),c("span",{key:"ecbcdc3d53644f7941d8cfc62d5bc7399bef5e00"},"Provides a customizable modal window, typically used for displaying contextual information, user interactions, or additional content without navigating away from the current context")),c("li",{key:"33f03fc0a1e6d717c2a1f82aed87945a3dd5c421"},c("span",{key:"7f87572748f197f79a4a1a89c3ea1d00c2078ec1"},c("ifx-icon",{key:"35dd46b0d8786d7e6e992cc03dd95e5caea4cca9",class:"check__icon",icon:"check12"})),c("span",{key:"8ceaea029ad7bce9666549b363230ac25868b6ac"},"Adheres to webstandards")))),c("td",{key:"b788df49c333b99dc5678b2381128523b9534c27"},c("ul",{key:"b311bcc55fa1044b950690594f7700128fe096d7"},c("li",{key:"2b8ba1f2916092571ed67065f1393d70129e93c4"},c("span",{key:"690bdb4978a777320f8bb42ff8b02d5fce4f99b2"},c("ifx-icon",{key:"d59413ee383db1b265457d9f0122674c12fe9dd3",class:"check__icon",icon:"check12"})),c("span",{key:"800e020291fd676c06f7769aa02ea2e58aa32a77"},"Alert-brand and Alert-danger theme variants")),c("li",{key:"cf9c944ec205db5dfa2c216213277237354e6bc8"},c("span",{key:"77fd7d9b909f6d64d8da8cce1f22e7fe0a5fe83b"},c("ifx-icon",{key:"79fceeaa25ff8ab1ed34521918ce4646067859d5",class:"check__icon",icon:"check12"})),c("span",{key:"572cd6f3c63854ddaf8b3c0f12dee56283018d32"},"Extended customization")),c("li",{key:"2e1424ecfc175620e6545e23a245e457886211b4"},c("span",{key:"454ec29ec14d0942fdec248093351542174acdca"},c("ifx-icon",{key:"e0120ccd152a7f060a0c785519c69ca65f392c08",class:"check__icon",icon:"check12"})),c("span",{key:"f21ad33cc7dd728a756a2b50a788f67691182f14"},"React, Vue and Angular wrapper integration")))),c("td",{key:"72529c1c46e6d138335449ca1a823e01773933a5"},c("ul",{key:"403756504fe5946adca4e53cd1a77d6b2efe9040"},c("li",{key:"87b5c837cdef3d5184b95cfce40983892b8b1ae9"},c("span",{key:"2126f42ef9553b9242ce717f2226a0ff1be02e8b"},c("ifx-icon",{key:"b49ecbfc0d91e2e2d98b807cf0ab871323489f03",class:"check__icon",icon:"check12"})),c("span",{key:"817cf972bfd1c0996ab15474132597e65de2b690"},"Removable close button"))))),c("tr",{key:"ef9adce0cd3ac33cc666bfc49c2f195d1de31673"},c("td",{key:"8d5c42615367857b8b84d5b8c1ee41e3550ef4c5",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"6c3c7ddf8e73aa45f489044981e258689079c4bf",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-navigation-navbar--development",size:"s",variant:"bold"},"Navbar")),c("td",{key:"ba3b702ed170898faf1e781a853261a76338b1da"},c("ul",{key:"6a33d6c2009dead40c758ec83ce67aded860ce6e"},c("li",{key:"b27c5bf1875174623b41f382ade790811cd4951f"},c("span",{key:"e9ae00d08869663d0dcf0d8bf61b0d1247e492d0"},c("ifx-icon",{key:"7ac688ddbcb358bc3e8547d6ed9ee6d102682afb",class:"check__icon",icon:"check12"})),c("span",{key:"ba6696982c8a6e720d57a31f631be58465135238"},"Provides a standardized and customizable navigation bar for organizing and presenting essential links, menus, branding, and interactive elements within a web application")),c("li",{key:"8ea46688116c10a753d80946c4d7c765863c476a"},c("span",{key:"8e0f77190d1bb634142c1db59df0d88577db51ed"},c("ifx-icon",{key:"7f3a10bf562c4465c5c490edc275fc38b67569a3",class:"check__icon",icon:"check12"})),c("span",{key:"3ec5970355a73114b71f5376e7190d4f1316babb"},"Adheres to web stadards")))),c("td",{key:"19ba243773fb20d67b9469d09a8409f56ea99917"},c("ul",{key:"7ec536587bf5c6b1558860fefd765fa178920109"},c("li",{key:"f4c3c79ea758ad7338732f3edc47fc27122448a1"},c("span",{key:"20487570f310debf1cdfcb99f9156ab7fbb6aa44"},c("ifx-icon",{key:"180e35dedfecdbc06a72f0490dafdcff135be449",class:"check__icon",icon:"check12"})),c("span",{key:"14da508b0d0f7412754356f2b1652ee41e3c6a62"},"Navbar-profile component")),c("li",{key:"fd36cad0345f833187e04dc06b3303a831e77f40"},c("span",{key:"c18d4115cb796b680a60b7021ee79fdc64ce3fde"},c("ifx-icon",{key:"1efa884074542c9a9cdc0cf09f502d533c912dca",class:"check__icon",icon:"check12"})),c("span",{key:"e5cfa2e0768350e116a76a692dbbf094f9b15ac1"},"Mobile Responsiveness")),c("li",{key:"446c07bcc84b97cdc36f6b49dd0602c94c301446"},c("span",{key:"4d9c85cb95947b03eecb893468227c2f000aee60"},c("ifx-icon",{key:"13a02114c4e18703617db4f604281f32cac2a9d5",class:"check__icon",icon:"check12"})),c("span",{key:"3ef49a2ab9065e02115c717ce490dc3cefda59b4"},"Mobile Sidebar")),c("li",{key:"54202b7cd335f42b76fd114b84ec9f2e7f0bd932"},c("span",{key:"e692e077c5ae45801dc76c9840caea1513965649"},c("ifx-icon",{key:"66894d295bbf38b18e71670f341b6e3f260f9cf4",class:"check__icon",icon:"check12"})),c("span",{key:"f36264f09123dd876e818b44c4e51577ada50d60"},"Extended customization")),c("li",{key:"4703f135983081254d9f6bff564884db98c1edb1"},c("span",{key:"3d2a757d3ffb02275f254f78c6b6665a1c572141"},c("ifx-icon",{key:"54a4dd12b47b1cc7d790edbb67df53e1081621b8",class:"check__icon",icon:"check12"})),c("span",{key:"23cebe67010fcb5988679ff71a497ef5b21cc0ba"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c40851932c7704a15e1b483c746b13f0b16c562c"})),c("tr",{key:"efbb0b8d23e7e943330bfaba86f08f0cc9e1573d"},c("td",{key:"53d653f2679916272e3470178a84fdf6c71e1ed3",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"bd37b3fdc6c85b79fda8a6716a493d68bda4c548",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-number-indicator--development",size:"s",variant:"bold"},"Number Indicator")),c("td",{key:"868e7621e4b18a6d7527ecd52d98be0244c704f9"},c("ul",{key:"9268a4d16b35775422605bad995bbc53bcdb080f"},c("li",{key:"09e9bc3f78444b4e0ce5351aac842eeb2ebc49b2"},c("span",{key:"53ac2c9a71bf277e1747e188428efa4b5aa0f094"},c("ifx-icon",{key:"2f94889b22879039194943995153644569816fbf",class:"check__icon",icon:"check12"})),c("span",{key:"3fe974b61937b9dfe1aa2912edd03b8045b89056"},"Provides a compact and configurable display for showcasing numeric data")),c("li",{key:"3cc930e62379b0e682caef6680e52afe8cf96da7"},c("span",{key:"7c92d8163a5b02053650da15d805ced1aea6e549"},c("ifx-icon",{key:"d5993daa28fc48a67120c810260d65dbc50938ee",class:"check__icon",icon:"check12"})),c("span",{key:"ed4fe256e5b47cf6a4c36a882379e9e3600957b9"},"Adheres to web standards")))),c("td",{key:"e1dacf30a166d42dda09bc6668c4bca8b27413dd"},c("ul",{key:"ce9d245915ad048f02b740b17cf43cb5f7c5dcd9"},c("li",{key:"41e9e645b15ba9aafdbee8e0db7eb39e2f19fe7b"},c("span",{key:"246bd23b02b649b2da5fa4feb32fa9a737e7c548"},c("ifx-icon",{key:"996b2b75bd77cf58ec592dbf9aef5e62a12a9e6a",class:"check__icon",icon:"check12"})),c("span",{key:"86ac39772beac0ce7173874680fc5c247025f276"},"Inverted option")),c("li",{key:"10de2983f986035a1b68c7b2e59f7f1f92e00bd9"},c("span",{key:"e206fa452d7eb8198e66fc241c9cbc9081cad55c"},c("ifx-icon",{key:"afb150dfac7a5c76ac12c59b4b18fc77fcd0f226",class:"check__icon",icon:"check12"})),c("span",{key:"af0435b025e5a92361edfcb32f6fa986367e28a4"},"React, Vue and Angular wrapper integration")))),c("td",{key:"21bfc5f3532cdf505a6aa6a70e1ead01cb4dd64a"})),c("tr",{key:"ef8827a64f9b88aa9bfac3cc05b382cac30a59b1"},c("td",{key:"efe4c18cf84073dc8b3b5106f5c718a088770c6a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"e17162398338edb4dfb23adac86cdb4c32583fa8",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-pagination--development",size:"s",variant:"bold"},"Pagination")),c("td",{key:"30bc6d01a1b819111029deaf2fb3169f98fe4989"},c("ul",{key:"d8994ffe407ff45b48e1eda1f498f18c7b14c76d"},c("li",{key:"904650c60a69e463b80ec653febf92d7295e4676"},c("span",{key:"7d5e05e14de2ccfd36257ad80548dfbb234b5943"},c("ifx-icon",{key:"38248551759fef96b0c8210a2a3168869907025f",class:"check__icon",icon:"check12"})),c("span",{key:"2b317ff727953f9821a3828f6bbc44ac1a1dc0ee"},"Offers a configurable set of controls for navigating through sequential pages of content, typically used for displaying large datasets or segmented information")),c("li",{key:"9544c59191b55c0753a1377a43688a8cd023d427"},c("span",{key:"3fdc7eec23a9c70885c9f77e6d2f1e8043e0a23f"},c("ifx-icon",{key:"d89be04f98f84a1f0fca92f3c5ad6ec91d379178",class:"check__icon",icon:"check12"})),c("span",{key:"68e8325ddd8b09da3d759ba5ee6c1b8bff052927"},"Adheres to web standards")))),c("td",{key:"a0209bf2353c0ae1f535bd0bc6da06fae4aba268"},c("ul",{key:"29fe56f1f74278014f774fa6ca8e7cc0c6b94d36"},c("li",{key:"d9aab779d44d987c8253b594df41bfddffec1802"},c("span",{key:"4506d67a48d6c5b856cf516d04adc85d2b4ec5d3"},c("ifx-icon",{key:"7548d1958c2807a2bf96bde3633a901bd9d98901",class:"check__icon",icon:"check12"})),c("span",{key:"6b7405ec977badbd863a88657e068d510ae6f8ca"},"Extended customization")),c("li",{key:"d6dd3288ab597eff5b5215e1e3f4937f1096ed4b"},c("span",{key:"563e3219890aebe7addbaa65d0a693f162814384"},c("ifx-icon",{key:"50e041944484066cd7b9a6a344848987ab5589af",class:"check__icon",icon:"check12"})),c("span",{key:"287a930b68f58c630a1b636a806178b293409ccc"},"Configurable Results Per Page option")),c("li",{key:"d5b21fdaa28b2bcee1c2fb25f169ee310bdeba50"},c("span",{key:"66ae6a91e96771c2d79a3241e3652ab3772f9204"},c("ifx-icon",{key:"94523ca6b742d1f68b1b541238ec73d91345fbec",class:"check__icon",icon:"check12"})),c("span",{key:"fb989fcc7754b4fc71454f65219b999c58eb7652"},"React, Vue and Angular wrapper integration")))),c("td",{key:"36441c5a79acb4d1ad8c347c659f4015a36326bc"})),c("tr",{key:"a9a23d07e4810b9e0075d4df247190050f320be1"},c("td",{key:"b6b8e332f66df4f48c6c024e6af85fa147554eb6",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"978d4889d464c1a971173791770ed3776642e026",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-progress-bar--development",size:"s",variant:"bold"},"Progress Bar")),c("td",{key:"3450e5405992a182cf94644468b6b85235cea5fc"},c("ul",{key:"f83b239ccdd776b54d8de610ac69689b2783487a"},c("li",{key:"87b59d9ca59d3ed6f5c58a8cad831d5e669d5c2f"},c("span",{key:"9e6d9728e910b55a34b74ef88487d13217ebcf56"},c("ifx-icon",{key:"cd5ac69b7ec86312b7c06c006391eae50e3afe64",class:"check__icon",icon:"check12"})),c("span",{key:"78e27998c2ba4faf79bdcc7e93853aa17a82e40d"},"Offers a customizable and dynamic bar that visually represents the advancement of a process, typically used to convey loading status, or task completion")),c("li",{key:"dd7e305828e49bd54f01cd86c374596fd69d5c26"},c("span",{key:"e433c1e3e27b13cc86819d71abaee7a03fc124ab"},c("ifx-icon",{key:"dfb34ecafb7b117a7cea4c0bd1a9584634c11c32",class:"check__icon",icon:"check12"})),c("span",{key:"8eabee716d86292c454db62cf621d83004b78d95"},"Adheres to web standards")))),c("td",{key:"1fd49eef1845a49c546c51d681017dc6f282bd91"},c("ul",{key:"d70875b2c5e6de5c2ac0b44703e5145e1d3ca95b"},c("li",{key:"173c5a7896a5af72df5ee46fed43c4d73f198b25"},c("span",{key:"0f2086be679152fa4764bf5ae914a267e48ffe02"},c("ifx-icon",{key:"49189b8cb9633c8d0c95a825a10bedd9b8b3b1ae",class:"check__icon",icon:"check12"})),c("span",{key:"b7f55c187146cc7652019d8672fc79f92dc9abd0"},"Extended customization")),c("li",{key:"e506269fcbb4a430d0e20c26c97133bf7796fa54"},c("span",{key:"5294d8f7d30230baa83e29311977755a97458b32"},c("ifx-icon",{key:"d70fc1f4038aa7c021255c34451f57ebf65a61c5",class:"check__icon",icon:"check12"})),c("span",{key:"18a3ebee41e40c262b0af296a22b95514ef9ae08"},"Show percentage option")),c("li",{key:"dd6f22cf9815af96a6c7bcf672ebd5fdd594c32c"},c("span",{key:"13dbd3a113ff9939af5b5dfe57f51af81ad9f8a9"},c("ifx-icon",{key:"dc583d44c9d972cfde926adc97376a9111a1889b",class:"check__icon",icon:"check12"})),c("span",{key:"c202222467cfb4c23d49bd97ded9f8a23349c882"},"Small and With Label variants included")),c("li",{key:"0b85bb688ede239e3a7e8e0359b214d6fff37e86"},c("span",{key:"ee74a4d6d53be1716447b98d31d0765966ffe2e6"},c("ifx-icon",{key:"cc827fb534b8683abf7f5df34ac19a6a686d1a82",class:"check__icon",icon:"check12"})),c("span",{key:"ad7844d06c318bedc9bee4ab2f273631fc1d0ad2"},"React, Vue and Angular wrapper integration")))),c("td",{key:"f40e1feddb710778a7d808e20b70861828d4ce3b"})),c("tr",{key:"1dfb4174129d4845f4a009e1e2b2c3f233ee22fc"},c("td",{key:"1a35400276e581bd98c0a964c992f2f04b6f561e",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"65dd0c3669144c4d886e8287448734915f10cbee",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-radio-button--development",size:"s",variant:"bold"},"Radio Button")),c("td",{key:"256e3be27d62d72c26fc39092d272d8a9e5d51f5"},c("ul",{key:"f57914d5c731d13673b88da71b178eeedc82075b"},c("li",{key:"c2e961844f3957cd8d8ec24e9bb7b3366b7c7daa"},c("span",{key:"702cef7c2fa69e52e758c5884793824641f1b353"},c("ifx-icon",{key:"2cb0918ddf4135a1e7ff04b806dfdebe14b93626",class:"check__icon",icon:"check12"})),c("span",{key:"e8bfe622aa82d009370a9f43186db64c07ffc8e7"},"Offers a customizable radio input, allowing users to make a single selection from a predefined list of options, typically used for multiple-choice selection or exclusive input")),c("li",{key:"a77a90a14e3d044d0b6605e2ddf220227aea4e08"},c("span",{key:"b0ef10afa05f4bf948184061ef13deab646d562c"},c("ifx-icon",{key:"de57a325e242f1975d3fa96e8689c38cb61b946d",class:"check__icon",icon:"check12"})),c("span",{key:"f39b0b52ef784be7ccd99f7dfcb8072751fd1607"},"Adheres to web standards")))),c("td",{key:"c2f8674de1b8d6fa4d989480a060bf16b75c4277"},c("ul",{key:"90f4bd236b217a0349706268a1c1cdb024624ceb"},c("li",{key:"02b6803d89a4803e8761079aa8e140d80634f99b"},c("span",{key:"deecbd5a327abaaad58bbbb74df96ff922d7837d"},c("ifx-icon",{key:"3711f09b7406275f19ca5e50482debd863519b69",class:"check__icon",icon:"check12"})),c("span",{key:"d40c12665e51b62bc7f7ee037d43ac841e2065b8"},"React, Vue and Angular wrapper integration")))),c("td",{key:"7f7c6184ffa08eeb6f24294a8096683b71d87497"})),c("tr",{key:"d6c5553fd941d600e8b3246bbc4d316122b08e73"},c("td",{key:"c11f4c710838de0b2910c9063e13f4633b147a95",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"b4eebd29ec36db74bbd6c4b0dcdeff0bf0f6e9a2",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-search-bar--development",size:"s",variant:"bold"},"Search Bar")),c("td",{key:"8ad7ba8182512fef24d8dc883bc6624d6e47734d"},c("ul",{key:"a8c48d5f1d7762beb9c338622ad6079450caf9ad"},c("li",{key:"7bce35dd1fd2825c25919ad990cb9545be6afa69"},c("span",{key:"feeada98f6e698301163140a05f008fce512c4ee"},c("ifx-icon",{key:"21a037eddf3cab1ea4fd70a717074bf558880297",class:"check__icon",icon:"check12"})),c("span",{key:"5612c7dc651e259cc456e65970a4c4be5d3eb290"},"Offers a dynamic and customizable input area that allows users to input search terms and trigger search actions, typically used for querying and filtering content within the application")),c("li",{key:"7092c74a0ed9546736f1195fee566ffe416b3209"},c("span",{key:"7e00528ef7245a91201660043d9aa977e35c639a"},c("ifx-icon",{key:"6bf7c9f8206186c138cafb0c923dc8b34cb9c594",class:"check__icon",icon:"check12"})),c("span",{key:"27f2ef6b9a380e367df0fbd65ad912ac949f803e"},"Adheres to web standards")))),c("td",{key:"4a67a08440427a6e85753c9887962746dfae5921"},c("ul",{key:"24b065aa8271099c92f6e6db502acb06118815aa"},c("li",{key:"88b609be89865f35644110e8c425b18bf933778d"},c("span",{key:"30895e1e790e4a8390ef13946701e2dfe2e405ea"},c("ifx-icon",{key:"c70e3ae61d77ec68cde823ea7ad0ff8cda6e24ac",class:"check__icon",icon:"check12"})),c("span",{key:"4a1b5bf3f14bdec63565bb56ebd6c6831d4a63c2"},"Collapsable option")),c("li",{key:"9bc393602edd640f3ef43c9d22cd6f1ecd5794a4"},c("span",{key:"748d38a0d2bd75f3799c7862f6c43718f38fff3b"},c("ifx-icon",{key:"6da4ff9cb04d24f5bf6d8f1e8585b0b61d0bb156",class:"check__icon",icon:"check12"})),c("span",{key:"8ea12544908df3aaf1c5c7cc4873dcb17b5d7e90"},"React, Vue and Angular wrapper integration")))),c("td",{key:"4457f3dbc32ea0ad1a29034f7f9f515a019631fe"})),c("tr",{key:"8cf62c8154d2913acf159a8df829d87f8b3eeb17"},c("td",{key:"ec03cd8e72244129155d04b9228b66ff2d10b7ef",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"ee0dfb87a01c9dfcd50f62604ff30e211a3286e0",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-search-field--development",size:"s",variant:"bold"},"Search Field")),c("td",{key:"666e0068efb143e54614170f52089b52370978fa"},c("ul",{key:"c436deec50ec1e91c75a85d319a09eb55cd59cb2"},c("li",{key:"387a8255b941e7cdb0151e4ed1c4d9055dc30cd5"},c("span",{key:"7b678f1b8213d62caa3b8bb39a047ef8fe7e684b"},c("ifx-icon",{key:"6640a36c1eb551a2fb3fba4e98d2726b0095f08e",class:"check__icon",icon:"check12"})),c("span",{key:"dd728f508e903707294f64dcac805e977a86509f"},"Offers an interactive and adaptable input area that allows users to enter search terms and trigger search actions, facilitating efficient querying and filtering of content within the application")),c("li",{key:"f617a4ef28e2b9d56c075a32fe99c59c68d81d4d"},c("span",{key:"ed6abf6b5c0f25a56c21fccff408b39d7aa73907"},c("ifx-icon",{key:"c369f4ae2d7d1973c33894ccad63fc18648fba01",class:"check__icon",icon:"check12"})),c("span",{key:"5e40e1f4dc3ed1de9859d6b2f103fd7a5c3675af"},"Adheres to web standards")))),c("td",{key:"b5e8c3397b862c132b0c014e14f9ec249fd71f57"},c("ul",{key:"0756249a96baec523a6157d70ed579da91b66e41"},c("li",{key:"c350070ac299abef1e1a39f482a7012d23fbe982"},c("span",{key:"3fb9bb71491fa99b16966caf92484d4a10e8638c"},c("ifx-icon",{key:"7ded36aa7e5a5cac8d284a229022cece4be88580",class:"check__icon",icon:"check12"})),c("span",{key:"337fc483b9ec72b57cd36642e26349cda561a320"},"Show Delete Icon option")),c("li",{key:"6d116fc42fc4049f2ecbaa87e097abf071b8e7cc"},c("span",{key:"64f94c4be999766cfff6b144e9a349304e55ad8c"},c("ifx-icon",{key:"fa9f46fbb1a5908e6c9fe256dce44c9ca6d47e90",class:"check__icon",icon:"check12"})),c("span",{key:"efeb669067e708a1a3a2938dc51490562c51b9d2"},"React, Vue and Angular wrapper integration")))),c("td",{key:"8368dd8a17dcf8c2525f59e065199649ce8a3c71"})),c("tr",{key:"541eef9efcee201c0ee9911ef1ab3657856f760a"},c("td",{key:"1b027b4bea9fcceb7656f3d56a5601ab303ffdd7",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"fce075e00d6dd1251a0994659ddd450ac8b9ae7a",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-select-single-select--development",size:"s",variant:"bold"},"Single Select")),c("td",{key:"fd02dfa3dc2b1ef678da9a01d23a43afc5e80ffb"},c("ul",{key:"32bd3e76a87c118f2db9d53e2503049a24d92f2a"},c("li",{key:"4f9aae2a54d3fd9e8d6eb90cd5e34dbdcd5b3bef"},c("span",{key:"f664881c8f2eb8e06a7c30f5f7673147d873de2e"},c("ifx-icon",{key:"d7fd5383b10fa6fcd00ec01d4d3646cdaca0714b",class:"check__icon",icon:"check12"})),c("span",{key:"1ff55607d0ef904bf6ff425ae6ae014aaee0c280"},"Provides a user-friendly and interactive dropdown list for selecting a single option from a set of choices within a web application")))),c("td",{key:"f10f6f8d66ef443e67fdc00a63d6616162c82c29"},c("ul",{key:"b8ad5b93da1784c71dc54573b2ef11a3d2ef93fb"},c("li",{key:"9d43ff175fcc8983706b292b8ffa8d3658921dde"},c("span",{key:"399f636ed18902423c23ee509cb1ef092aceab24"},c("ifx-icon",{key:"530b27297e048407a4505b789df6ddce40df96bf",class:"check__icon",icon:"check12"})),c("span",{key:"6a8d2f5d46dfa9587960ec76ea7c461610f30031"},"Extended customization")),c("li",{key:"7daca368662e0ba1edd11c7f8b6cf80ed41d85f7"},c("span",{key:"549b1f5a24646c4db66b3222a3c1599338e69aa7"},c("ifx-icon",{key:"cbcb4644e8d26075d7393d65c19163e78d123cff",class:"check__icon",icon:"check12"})),c("span",{key:"efd3e6ade25d541181099fa13c5150a5a980a487"},"Option to enable and disable the search")),c("li",{key:"53f1b169453790e89c63ab5e329fd5b75f03dd8e"},c("span",{key:"3304f9f782a7817240e25e3804c3d2d7468d04c9"},c("ifx-icon",{key:"0563b4dd1332ab9b41708f85f37ef76b062122b7",class:"check__icon",icon:"check12"})),c("span",{key:"75886bf0835a0988ed45f9184dd148da288397b0"},"React, Vue and Angular wrapper integration")))),c("td",{key:"60ce6ff9fe7bf39c708278f8159189f5aea4d8b6"})),c("tr",{key:"d0a9d72f2f567745dddaef8cd7634062e7f71ee5"},c("td",{key:"011b990177e2c7da2fd8567b4a31c3b05ab8ba66",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"48286a9aa127b2ea7c45079d7b76da73f3aeb6cc",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-select-multi-select--development",size:"s",variant:"bold"},"Multi Select")),c("td",{key:"b53b5fb32c03493172a11badac997715f5e841ac"},c("ul",{key:"2b25f1bc7c5172370c7776841057b62bdd5dcfc1"},c("li",{key:"32893e898074cc47a1b7adac0433c8ad35c9d5e7"},c("span",{key:"412418caa83421c9245a3156fd3afd518094f403"},c("ifx-icon",{key:"d5c004aa780904cabfb278fac308c7770aec6aa2",class:"check__icon",icon:"check12"})),c("span",{key:"40c7d67e7fbfcb1ecb748c25241b3eb0a53c0ee2"},"Provides a dynamic and customizable dropdown list that allows users to make multiple selections from a list of options")),c("li",{key:"437793f35926e8e2c7a24608d5e593200d1f2129"},c("span",{key:"df37c1434b3b436ca258fceac79f4180bab884ab"},c("ifx-icon",{key:"ffed68e6c756816099ffe0169e4764c345e55a88",class:"check__icon",icon:"check12"})),c("span",{key:"c4f27a8849853ac2024957fc3b5859a7a8773ec2"},"Adheres to web standards")))),c("td",{key:"153b5861f69aac95f63c34dc6da652188f54dfb5"},c("ul",{key:"4da68c91b65572fadaa536c16ce2e9b593c32cf6"},c("li",{key:"408f66488975b643a20aeaed62393f95755231de"},c("span",{key:"383f912fb6eacd5bcd48adb8a0c4d3f3db60a2e2"},c("ifx-icon",{key:"83f411a868a5a17ac57bb90cd1edc725b75221d9",class:"check__icon",icon:"check12"})),c("span",{key:"1884ee9fdf7f7b76fc9aba8a5c62c1c6d0fced41"},"Extended customization")),c("li",{key:"68a5fa23017fb51e0814febee590636fcf6325aa"},c("span",{key:"44cc2891dcbbeac0cd4c82464188e557e3c10c81"},c("ifx-icon",{key:"d6f31d406f090f8ef8a3914f0810b684b6ef1bdd",class:"check__icon",icon:"check12"})),c("span",{key:"e2b0d0b060a4c7e102866005023d75097b1e3908"},"Nestable options")),c("li",{key:"fd3da80a94bb30a876c31868000da6ab0f8dc173"},c("span",{key:"8da58387d90b14d2771d5ff1d64ce6623a28eafc"},c("ifx-icon",{key:"9063d22f85ca5f34577190d58a3667e1a2126af5",class:"check__icon",icon:"check12"})),c("span",{key:"95dc393c9d3b46bdf1c697e561c67951629f8a50"},"React, Vue and Angular wrapper integration")))),c("td",{key:"ad1bba418a0dfa3814b4922c22829cdf96cb4493"},c("ul",{key:"bd29c5b028102a9f5e53008bc1e1fb8b00b2f8ad"},c("li",{key:"74459b08e7c2a2de3821a59133c4e41e7ee1a110"},c("span",{key:"765ac506fd131b6d96553f059cde59d1ba7923e5"},c("ifx-icon",{key:"3306b6f65c9c99abbd9f435a3ae711025043acc5",class:"check__icon",icon:"check12"})),c("span",{key:"156c613f23b5e2cbcc3f48b058d171810f6e9a6b"},"Option to enable and disable the search"))))),c("tr",{key:"2aea1d8a8c2ec520a8dffbdb58daad90ccb14301"},c("td",{key:"d5fb896e9c2b03e0e66c37c5db15e65a00fbcf03",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"fbbed981efdbb81ce75a11b07ca24256c4e31900",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-navigation-sidebar--development",size:"s",variant:"bold"},"Sidebar")),c("td",{key:"5e58c57dac04ab2f4c3172fc8c48f14fa1eb526c"},c("ul",{key:"21289ac828fec43fac0eeb242be5852865086b76"},c("li",{key:"680a514996943e6bd59da71bfa7fd3a648f3bd06"},c("span",{key:"87372e27360113abd864fb40acbc01abf3436912"},c("ifx-icon",{key:"4f212aa1f4e4d9cc08c07b50d9ec1d63d8cc758c",class:"check__icon",icon:"check12"})),c("span",{key:"842c5429e231aa85e7eac2e511d8035eddb3d0f1"},"Offers a configurable and collapsible panel that typically occupies the side of the screen, allowing users to access additional sections, or menus while maintaining the main content area")),c("li",{key:"8bd6312896c99982bc33b3737cd60b96bff50db8"},c("span",{key:"08a346e2f51342502ccc5785d5e3ab1193cf7ee4"},c("ifx-icon",{key:"c6c09782c34acd6988b8255e05775be8d452d566",class:"check__icon",icon:"check12"})),c("span",{key:"2cf0958cb7613d9fb715b3605767a14a4bcf2f43"},"Adheres to web standards")))),c("td",{key:"20588aaf7c19e9e29cfad5e5b9ebbecf01ff3cc6"},c("ul",{key:"4703bb60e9051a4333376344cdc868137337d7bf"},c("li",{key:"06b8ed0994fe3bdf622eae4f49bafae916f9fcee"},c("span",{key:"add59e103a913b1d2550aa2c11d65fb39d3d617a"},c("ifx-icon",{key:"30fa796dfd1a5565d260e0f10c7d12f37719ddd6",class:"check__icon",icon:"check12"})),c("span",{key:"b65ec20e1425253e140a43d9f5f75b7b0847b134"},"Extended customization")),c("li",{key:"a0f25b5b5d7672d01dc19bafe92aae63f981d598"},c("span",{key:"7578a309e1db7e200fa9ad110e94e6cda50d7f45"},c("ifx-icon",{key:"1124d475bc9b5a160f14a21086ac127e6c3a5089",class:"check__icon",icon:"check12"})),c("span",{key:"e52e1a4c5eeb9f919042df6e361e8d3abe9f7936"},"Multi-layer nestable items and menu")),c("li",{key:"3bda0929bc73a94c4f0843563a88640c785b4462"},c("span",{key:"881975e8c903592bc75fc03707f9327b489ee92d"},c("ifx-icon",{key:"2fca88d56ec6b7770ca148fe3ec9013212191d85",class:"check__icon",icon:"check12"})),c("span",{key:"16451956fee552dc38c8fc476e6b55ce2a49891e"},"Initial collapse option")),c("li",{key:"5dfe0922559ed03e91517b865f84a0e03178c53c"},c("span",{key:"248ff1bb788e022e5fa9e6e27f2f844817f2ef05"},c("ifx-icon",{key:"0ee93b39f1d164d433fc0e0fef2687fdd0fd02f7",class:"check__icon",icon:"check12"})),c("span",{key:"c38af78da17648856b0cd3fab760e6b315dfb434"},"Active and action item feature")),c("li",{key:"6e44196a29aa31f9c420d1fe013d4487771b6aef"},c("span",{key:"e6f6f18549ad17bc8eabf0ec2fdb69332c95de96"},c("ifx-icon",{key:"def7d5f6c2ead4052033fd0a50d2a1cf37e4afa3",class:"check__icon",icon:"check12"})),c("span",{key:"866039d410230c7d623f70d92dd96b54d0f53d62"},"Number indicator integration")),c("li",{key:"1566d374d74c5af5eaf3047dd59151833df20368"},c("span",{key:"ba69a1b0bd1ee98d838f3c0bb71c832688d7cfd2"},c("ifx-icon",{key:"ec7912c029996084d9a9ccdfd6556aef3338adba",class:"check__icon",icon:"check12"})),c("span",{key:"e7c82af71138fcdd9a359128b1f395ac86aa370a"},"React, Vue and Angular wrapper integration")))),c("td",{key:"f59170421770efb001b68c3daccc7ac88e36079a"},c("ul",{key:"8df5af68d713424e0313002c769c0e44ce35f8f2"},c("li",{key:"3596f6241843384043e73d6ebb6585f6086c5b57"},c("span",{key:"14d693fd428341951b459e7b505ff36d6f437671"},c("ifx-icon",{key:"3fb8d3c72703fb103320e63a8c8b6f5e1495c0db",class:"check__icon",icon:"check12"})),c("span",{key:"1bd575d05957a26abaf32122883a999b005d035a"},"Removable Footer, Header and Logo")),c("li",{key:"986867b555b1f4e6051112d2ce378de5866eb839"},c("span",{key:"0d49268b16948c8f05b145b6d4da2cb63eced957"},c("ifx-icon",{key:"1a46284caf69a46160ff24ee9dafd1e47b9792f3",class:"check__icon",icon:"check12"})),c("span",{key:"b04779504685343850bee753b9790bf7398a5d7f"},"Removable and customizable Links"))))),c("tr",{key:"18068c5791e8c79501089d269613530763c87fa8"},c("td",{key:"26f13b08fe74c04ef66ff9c81ec3f84b96b9c12a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"69a0776a296aadaeec91a055042b02be0d999b22",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-slider--development",size:"s",variant:"bold"},"Slider")),c("td",{key:"b1937ec67f39d501f9cc3cebb628e7d871d6fa34"},c("ul",{key:"6db743e2d849d8393cb61ff78b1d2835c0beba68"},c("li",{key:"83dfa044c715d5ec5d6d0aa481affb85e052efc8"},c("span",{key:"7a8691cb0169abb4f7663ef221e8d6496e3b12fd"},c("ifx-icon",{key:"44f8e6e500e8b0860fd68169cda4b2db7db6d84c",class:"check__icon",icon:"check12"})),c("span",{key:"298198a6b35ff68542c51655124a905a25ed91f8"},"Provides an interactive and customizable input control for selecting a value within a defined range, often used for settings such as volume control, data selection, or numerical input")),c("li",{key:"f8c197b1d9ec05f89815e6546595ffd561094c9b"},c("span",{key:"f35c0c6fcad8771d556b4e7261b5bbd985657b79"},c("ifx-icon",{key:"d6713f586c2c055d4fd528dcab8d6459a20af398",class:"check__icon",icon:"check12"})),c("span",{key:"37803411af8c87e656f41dccd0cd6e4c40c7a7c5"},"Adheres to web standards")))),c("td",{key:"2f9f321c3f64c7f822f79857e67a0e6f90083fc4"},c("ul",{key:"d2958c94380e54eec49d74c972bcc89147aaae6e"},c("li",{key:"573903779004c604be2ab9cdbe58bb14399a9efb"},c("span",{key:"65bf4d223eb1efed5ba64f62f99d212fe9dcd48d"},c("ifx-icon",{key:"05bc747e4aae780dbd93bad858d39704684da615",class:"check__icon",icon:"check12"})),c("span",{key:"371488bfac649feeb956edbd8bdee134e2780c0a"},"Icon incorporated")),c("li",{key:"d09eaba506dbae15b40d8ae0a92860a636e96111"},c("span",{key:"5300e77df85ecb57ac818903b80327e4da26e888"},c("ifx-icon",{key:"4bf980bc46f62b6752764da38aec95ce7442b5bb",class:"check__icon",icon:"check12"})),c("span",{key:"77579e8de8b14f7a70ff87971f831b764eb1118b"},"Percentage variant")),c("li",{key:"81ea358bd441842b3871fc3a232f92dfb838c39b"},c("span",{key:"a7d8cd1aabf868060f3133649868ae4ccf5e9070"},c("ifx-icon",{key:"a7a0267dab0fcdc8871715f12ea3e0e3a38f4468",class:"check__icon",icon:"check12"})),c("span",{key:"265e6831a52a172432afef3eb8d44b5843b64da8"},"Text variant")),c("li",{key:"14fde78c824585be04b02d7ca34f52c4d059a604"},c("span",{key:"cc5a581b676c220d9706aa3730f2e2a83cf1ba97"},c("ifx-icon",{key:"a388b67c3af23b34259a79276b0438cfba046d44",class:"check__icon",icon:"check12"})),c("span",{key:"ca3d1dddc52f782db5efcbe42de2585b8d8d6746"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c410357cedb9e070713a390cedc6b4f5bc8e5b0d"})),c("tr",{key:"6645222ad7c0cad5132160e8e833a8d5acb1d5b1"},c("td",{key:"9b4d80222c5177b4b8c17768cb532f6a2c79c129",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"3ed2666fdf26083d82bb3aa62db9dc5d1e58e12e",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-spinner--development",size:"s",variant:"bold"},"Spinner")),c("td",{key:"a46b84f0a625ef588922e2fc49209e8d71fe3f3b"},c("ul",{key:"9027e1ff5d8be0cfa892da0ad6ac8e184bb61427"},c("li",{key:"fed14f7d935c066fa5579ea233bd3337875378bb"},c("span",{key:"b421317553ef52be419836e4cfb864676e718d78"},c("ifx-icon",{key:"c777506897364c09133c4263cf7cef67dc5c4787",class:"check__icon",icon:"check12"})),c("span",{key:"44ec29d1ec31af21dfc853577fee7c363c707d63"},"Offers a customizable and animated symbol that conveys to users that a task is in progress, typically used to signify loading content, data retrieval, or pending operations")),c("li",{key:"61fd1da5914f96ac7276bdc4d9d4475be3f80ef3"},c("span",{key:"b768a935cad0ca62f4f3cfce0c242f507eb55e78"},c("ifx-icon",{key:"9287f88fdc5e3b0902e4e2f430d461f4667cdb5a",class:"check__icon",icon:"check12"})),c("span",{key:"10876277354cff3bb9ba1dbdde66fbd366f8ee81"},"Adheres to web standards")))),c("td",{key:"36f00945aa774cd0430795600a22f3fe23717636"},c("ul",{key:"9dd42edeaf51d08eff1fd9c5cba5bb1dfc5e5a73"},c("li",{key:"e2fb0995867bc08c1413005c673e31d8964474c7"},c("span",{key:"b935cc9f600bc11b87bd3d599fe509e5d5bb592f"},c("ifx-icon",{key:"85e86a0653e934ea2d6ef58bd4e401afeca38ca3",class:"check__icon",icon:"check12"})),c("span",{key:"6033659a9cfa37c2f69e34c8b06d72b7f931e365"},"Brand variant")),c("li",{key:"47d5424d975f86811d93a5e50bf5e210a28acca5"},c("span",{key:"43272ae5709c80bab2e63bb3313a7cb7cca60732"},c("ifx-icon",{key:"05a82c509635e26e77283ce9713d297b6d29c713",class:"check__icon",icon:"check12"})),c("span",{key:"7708011497d6bb709738b63a88750ce5b631835e"},"React, Vue and Angular wrapper integration")))),c("td",{key:"e1fc8ad63d2074478dc21456da2c2f4482d9270e"})),c("tr",{key:"0b843c976ed9d943b4769f2e5772b517feae9be4"},c("td",{key:"27b83cee5e3733e42d13595d116104c0ff648b4e",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"44903460d123796f0e34cc2864869f2a3c200a51",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-status--development",size:"s",variant:"bold"},"Status")),c("td",{key:"287a091d508e9e4b887b00934e442fa31132af33"},c("ul",{key:"5b049a5bfa6d49e7229a5a773d77bc17c562d493"},c("li",{key:"9caa8da3d20097ddb6a15e6e201c4e0001b7d484"},c("span",{key:"d81106196f825f8f69de4f7cd04fed5efb1f060f"},c("ifx-icon",{key:"a862344ff25e790a41ac01408c6d1a8e205c6c80",class:"check__icon",icon:"check12"})),c("span",{key:"c3795d7492fff31ba9af0a0a7f0d904accabee38"},"Provides a visual indicator for conveying the state, status, or condition of an item, process, or entity within a web application")))),c("td",{key:"43d46f75adba85daaffd51ea4c7c9bafd97958e6"},c("ul",{key:"f848dda50586292120598fb91b2a73e430365429"},c("li",{key:"75ce9ea3c69af368bcc806328b427d556acf1ecf"},c("span",{key:"1678f28cbbfec683deead72a31704d53edbef47e"},c("ifx-icon",{key:"509cb85bec0644dceab09503ed352c351db22bcb",class:"check__icon",icon:"check12"})),c("span",{key:"d801f1e2be3576cb24f0099923ff983a6901ade4"},"Ocean, Orange, Grey, Light-grey, Red, Green and Berry color variants")),c("li",{key:"9149e49475521708639b40412ff1a07a0f67a2d3"},c("span",{key:"4ed6d6f1af26ab913d3d4c10a1c9283440197dd2"},c("ifx-icon",{key:"1eebb40ba5f4d8ce25df729ad6ed0303b6386fd8",class:"check__icon",icon:"check12"})),c("span",{key:"223f84bc78ef56babd08a73be19538174a9c039f"},"Removable border")),c("li",{key:"a04d43016b209bd62a1b6e5cff40e4932580f51c"},c("span",{key:"d84bec08969f61b318ebbcce240668c59a0a7359"},c("ifx-icon",{key:"9028524b08bf6eb10a311724cb4566e2569fb0f6",class:"check__icon",icon:"check12"})),c("span",{key:"dc0da50e3c728b1409c1f741aa0db747cf975718"},"React, Vue and Angular wrapper integration")))),c("td",{key:"8367f7b634a480130a36814505d727fbc876c0f7"})),c("tr",{key:"2b30d0a26a5dccff6659fe2b4b6dd64a4b882862"},c("td",{key:"f190b6aa243391148e5f52201c613c7a26242df7",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"a44e9fc28dd2991196541e9b96a3a89af601ad45",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-stepper--development",size:"s",variant:"bold"},"Stepper")),c("td",{key:"e31f6092ae4f6c628365137d36950d4004a43051"},c("ul",{key:"e33f50cfdf307df155f6227cb6648a04419bbaea"},c("li",{key:"48d3c0ac5956b7d605c84a35193d3669c2fad160"},c("span",{key:"08bf089fa80d6dd2a4d42787c18f31af272caaa8"},c("ifx-icon",{key:"dba9a64706a35e85d8ab506bc5b9954a5bd33154",class:"check__icon",icon:"check12"})),c("span",{key:"051d6287ee9757989eee9e25588fba7782129e8a"},"Offers a customizable and intuitive control that allows users to navigate through sequential steps")),c("li",{key:"a7b86c8f1020ebaf3d23de533c7ecb7d693e5bef"},c("span",{key:"cc6df53b0df670c6b0ace603ff6878096afce5e3"},c("ifx-icon",{key:"ecc7a5ed0c03a41c37fdffb30c661bad1e067cc0",class:"check__icon",icon:"check12"})),c("span",{key:"4847ceb99f886ca2f40f25a138a0f06e5b68af02"},"Default and Compact variants")),c("li",{key:"698a82b385f04a497a96ae408da777fd981bc51c"},c("span",{key:"962ad620d24ee02f41147db97e485d0fa022da42"},c("ifx-icon",{key:"5430002c950e2fb02788feb6cabe804f2deb2f61",class:"check__icon",icon:"check12"})),c("span",{key:"d4585844fbe5dfd27fad55fd5f3797a0b3ea00f9"},"React, Vue and Angular wrapper integration")))),c("td",{key:"ddb72dc01968e8d3122abe9e265d409c11e63dd1"},c("ul",{key:"24a4ad7294a1adda529280db6dc4c049acc6ff56"},c("li",{key:"2753610997988a34528dbe0ad32c9bb58fd18698"},c("span",{key:"1600ad0dca89c4c325ee074b4c98b5263d4c0345"},c("ifx-icon",{key:"879ccaba6b330bedd1c9a70acb21276ba70ed3d5",class:"check__icon",icon:"check12"})),c("span",{key:"59afcb1dc6052f81874801aa751e7637bb70c186"},"Vertical variant")))),c("td",{key:"9d5401185742f926ec5010a601d2148a6dce0aab"})),c("tr",{key:"c12c679ed1538aeb12b16d470abf500241955bc0"},c("td",{key:"745cefa06c8aff26db09756fc68bdf2cf8094eb6",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"d94579e3bf0fdacbd2d40f29bd03b8aa366522cd",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-switch--development",size:"s",variant:"bold"},"Switch")),c("td",{key:"b99453243c4e641c562c043b8bdf0dc41e5ea56c"},c("ul",{key:"9b8ef94265a6b636c6d5510f709d527896a770b8"},c("li",{key:"b9d5c65ba43520b71c514a1731f2234c178fec03"},c("span",{key:"56d4a9e1c62ca274fd512637e4ae1bc3e77a6d9c"},c("ifx-icon",{key:"048508b0f240adf6a552f7b67426b2cb694d8c7e",class:"check__icon",icon:"check12"})),c("span",{key:"59980fdc6f4924b3a63db7a22a6e4f7150bb93f1"},"Provides an interactive and customizable interface for toggling between two states, typically representing an on/off or active/inactive status within a web application")),c("li",{key:"f19ec9b790f49ff6fc67c44f5e1f5ecf80cef0a9"},c("span",{key:"6df6d5d6c5e6ce31aaa584fa7ea895549260d3b3"},c("ifx-icon",{key:"a820c8c545eadbc98fd993fd0672b1e158b8e066",class:"check__icon",icon:"check12"})),c("span",{key:"e25849a2c0eefc8af6680b3d5105adc81c65d398"},"Adheres to web standards")))),c("td",{key:"db4642f20b962bd916ab4b2703f6436800229dfa"},c("ul",{key:"0c8ac3bcd9935cedc3a8c68aef954d0a16e2c63a"},c("li",{key:"a00cd83274b696210fc52537062184247fb576e7"},c("span",{key:"644d63ad90b4da08843b3ffec9db621b40bb6111"},c("ifx-icon",{key:"a853e435da10215af383663deefb630592f6d914",class:"check__icon",icon:"check12"})),c("span",{key:"e26a35c799ed13fe99bbc215b4fafcf79afee416"},"Incorporated label feature")),c("li",{key:"b0b88d8fdb897e676aae5f7583f351421f9207a7"},c("span",{key:"0401535e68d920e59d1d960b67971a147ac403f4"},c("ifx-icon",{key:"0e80a6986dbc0da9fc8e64464f2b2cf0a249d3d4",class:"check__icon",icon:"check12"})),c("span",{key:"48cb6aed55570830eb6b05f9a6c66e1d522af2b9"},"React, Vue and Angular wrapper integration")))),c("td",{key:"cc67474464785826f86d41bdfce44264daa88f4c"})),c("tr",{key:"3216cbc858aec2afe69ecd1f2d75d9bc6863077e"},c("td",{key:"a179d02535ab75fddaaa268840992814b4780b02",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"5afd9a02abf6b493795628ce3dd2b6ddc2dca4da",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-table-basic--development",size:"s",variant:"bold"},"Basic Table")),c("td",{key:"59a54e17b98b9bcdc1351108356f59a7069b538d"},c("ul",{key:"879eeb21d71c272794cf78db1eb029baddd668a4"},c("li",{key:"f406596b033213d4ccec7045a301078cf119ce70"},c("span",{key:"476d4bce581295d9b618ea10dc73a598a06f948d"},c("ifx-icon",{key:"beb33095856f252857be9ecc3e1b69845b0bc2af",class:"check__icon",icon:"check12"})),c("span",{key:"3570ff47f473f74487265b8b39724d5d04e6e46e"},"Offers essential functionality for organizing data into rows and columns, allowing users to view, sort, and interact with structured information efficiently")),c("li",{key:"98e79b8fb3ee568d9beec346f5585271ebc84b26"},c("span",{key:"5794e82204321df8cc599768721031cd67a01161"},c("ifx-icon",{key:"478a1758236d5718cf7ffbd434bb4d9929518a0a",class:"check__icon",icon:"check12"})),c("span",{key:"c86b9ac8f369924ea787641f4a6df113a13e02ba"},"Includes basic features such as column sorting")))),c("td",{key:"1d89ef30fc66084d74ce8ebba222063b68400151"},c("ul",{key:"7f1b34b29346f32adde011f219c9c838a5c42dfa"},c("li",{key:"158f6ff795a032263101c3d79b5cfd06da1b3d1c"},c("span",{key:"96996ee4808123e5dc4925605d06324c70294d83"},c("ifx-icon",{key:"529e0fb3b8c5ee8bb8ea89c2a1364b892f3775b6",class:"check__icon",icon:"check12"})),c("span",{key:"b0fc4639728f88d44083ce9936d51cbf8165215b"},"Compact and Default variant")),c("li",{key:"265e4e7daadf3611c226f1431d79da45e0cca949"},c("span",{key:"79e1fd9468e7a8db627dbe5d9dcaa33e85b2c762"},c("ifx-icon",{key:"61f3c15284712029941116cd6e416510d8e500fc",class:"check__icon",icon:"check12"})),c("span",{key:"842efdea673c8f95491e588623ece3080dc04980"},"React, Vue and Angular wrapper integration")))),c("td",{key:"fe57a7fdb4b267e341a23a910b58237246ed311c"})),c("tr",{key:"ef97a7183a7cf380f4c6e3a6ff8f23762da71d12"},c("td",{key:"68147efed7ae619ee575a6186aea73b1fccecb98",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"07fc7c8580f4d367d6fc86aeeb10d26fc2dc433f",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-table-advanced--development",size:"s",variant:"bold"},"Advanced Table")),c("td",{key:"1306f4cc4e51ed9107654cf8b44a4a4fad5492da"},c("ul",{key:"7d6989223b0ebcf1ad48027fdd1604f3f950c89b"},c("li",{key:"f1c4025d8c49c6f898cd9adb7560708057f46f66"},c("span",{key:"800398f423b840bd340fe0bebd36affc7b09de2f"},c("ifx-icon",{key:"f3ec8057013f054d13a22eb04914117552969125",class:"check__icon",icon:"check12"})),c("span",{key:"8559f2883627cf2b5d734c39d7424ea67f2aef85"},"Pagination")),c("li",{key:"8101c885424128dd2a23a0bde53ab8dfe25c7042"},c("span",{key:"5b4aac2a3d1a8a69f2ebeb5ec0ad006aa96b01ea"},c("ifx-icon",{key:"6a24669d15b728d1d7ec6d6b0cde99415f4a5401",class:"check__icon",icon:"check12"})),c("span",{key:"beb9b20b0f23ff9727b86924b424dc8ce604e208"},"Sidebar filter")),c("li",{key:"f0948347ad29864f036e4a6eb59207d3751e3ceb"},c("span",{key:"2d6b71ab5b91f3fee04482f67fbfd85906f54b69"},c("ifx-icon",{key:"b7261a8f62f2124dc46280aeb7f69216205cd2f6",class:"check__icon",icon:"check12"})),c("span",{key:"8aa29956947149198b2d7bd270f673151d5907fc"},"Topbar filter")),c("li",{key:"b4ef4c83fe6620cf4da482ec63851a9adfed0ab2"},c("span",{key:"fe988a01f52964acedb492c7eef3ffb257b7b7e6"},c("ifx-icon",{key:"9085a95b65d0ed7709337af59308ae37eca1d8f7",class:"check__icon",icon:"check12"})),c("span",{key:"a67e75c96dcd3096fa2f8fe693b4e93be4b55f97"},"Nestable buttons")))),c("td",{key:"99f322154a50d54931e008085b80e671a6b5f648"}),c("td",{key:"f669c3dca92a37fc97d27fcbb7e4364da9d2423a"})),c("tr",{key:"72f038ba182acd6e00a7641bcfbbe69938f91d30"},c("td",{key:"c2476a383599a019a01282930644eada864cc9f7",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"99c1714670f1005c2211be4dfc785568eb663f3b",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tabs--development",size:"s",variant:"bold"},"Tabs")),c("td",{key:"37a76b3394274f005ef5a228ffa59d28f26f48d8"},c("ul",{key:"302da22ae2737a99d3fcaff964b81bf0f97cf037"},c("li",{key:"aa41c4bb1fecd846dca221e41f4d5d0e286345e8"},c("span",{key:"1db18a86a00155f4cfc6b18588724fb30fe5f72a"},c("ifx-icon",{key:"766f7bfdae62ed22230c6951f4cdb23bfbc2b5e6",class:"check__icon",icon:"check12"})),c("span",{key:"26260ca3897aa874928de4d8ea3541b3ae3de47b"},"Offers a customizable and interactive layout that allows users to switch between different content panels, typically used for organizing related information or functional sections")),c("li",{key:"8c2c480dc92c04fe7a874d36a721c737e13aca88"},c("span",{key:"35e953e2defc3ba76393694e7953c15d084e34a2"},c("ifx-icon",{key:"38b346ecb6fcf8a69fd75e9c840dc49155313062",class:"check__icon",icon:"check12"})),c("span",{key:"0dec5000780221fe5f3bc5f5e1cd1b59df45d9ed"},"Adheres to web standards")))),c("td",{key:"a62d213a3a4249fc107248f1fee705d62637a78c"},c("ul",{key:"1eaa5293eaab899c62a3de6e28326676d5c189b2"},c("li",{key:"d8d6b9d5b2e3a4e220244b8a00bbaf9ee62d7d44"},c("span",{key:"2055826414c26fdcaaf80125c85677d693edbca4"},c("ifx-icon",{key:"2a8d251b03b8a5c31dd8b87916a0e11a4004f9c2",class:"check__icon",icon:"check12"})),c("span",{key:"c16c872d33bd51ccd20c1eb722c15ed6a2dde708"},"Horizontal and Vertical orientation")),c("li",{key:"235f693ed87ddfb9afbe4c0ca61c135ea3eb033c"},c("span",{key:"03675245e7cc6a8ab05c9816cdc7c72b40e488e1"},c("ifx-icon",{key:"1854de24077f4687851296e8e5363c26fe142c6c",class:"check__icon",icon:"check12"})),c("span",{key:"82948253f2f4f813716796b1739d62d2959ea94c"},"Extended customization")),c("li",{key:"3f4a15f373ea217b7adb97faf258d74d030df55a"},c("span",{key:"8100dbbb22bf4397e9b15a049fd626bd2687d45c"},c("ifx-icon",{key:"d3ebe0224a0a5382c9c21f83758426b0ba938335",class:"check__icon",icon:"check12"})),c("span",{key:"2532fd0ba70458273976bac8ef55a420beca0567"},"React, Vue and Angular wrapper integration")))),c("td",{key:"984975fe8a78e3bca1a364f23d0ffaba74ac100f"})),c("tr",{key:"d205860a1f864a19e34e83d7ad5b24667695afc4"},c("td",{key:"f01425d3428f27b6839e0b867b925befbaf61561",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"49ee0577df6dce449871964937196ee54581151c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tag--development",size:"s",variant:"bold"},"Tag")),c("td",{key:"7d2e4f0f45fd7bf9cd06cf99b3e46ad0b583c8a1"},c("ul",{key:"2494caca45d19f663f6718ad44290382f5cf39a8"},c("li",{key:"2ddc32cf9e9fbd5d0802ebd08756014a375c6d00"},c("span",{key:"ec7a42efa9effdc33f6e289e51bbb3db8ea8b48e"},c("ifx-icon",{key:"f9dd57e5869b248f9ca31294b7364ecd0cc3b881",class:"check__icon",icon:"check12"})),c("span",{key:"734366192197969438963479856cc98f4b9fa393"},"Offers a customizable and stylized marker that allows users to quickly identify and associate specific items or content with descriptive labels or categories")))),c("td",{key:"8e450bffee71bac444f53167918a75cbf43eca84"},c("ul",{key:"421e307000e30e67b48d29cbc1ab263a4fad74c4"},c("li",{key:"b3f6ce635164365a3eb7d2e1fd2d97bd8df5f257"},c("span",{key:"082fda49ed81efbec9ad3de47405a7624fd25212"},c("ifx-icon",{key:"c3ac50ad08bae2a054599334f9236d79aceae6f8",class:"check__icon",icon:"check12"})),c("span",{key:"1591bfef4d668aa34cea55515b71f399df54b80a"},"Icon incorporated")),c("li",{key:"a0d2fa6e037be585892762605c65bf68dd37727d"},c("span",{key:"156c465b4e2cc3ac26660264b0a504bac856766e"},c("ifx-icon",{key:"7302921c54928088f309fb8589d771009d079a1d",class:"check__icon",icon:"check12"})),c("span",{key:"39732202f5b1f8a11bd193340546af3237edb905"},"React, Vue and Angular wrapper integration")))),c("td",{key:"e1a138ce41e3deceda5000a1e7e50187df3ab7d7"})),c("tr",{key:"de63dece5f9f6c1bb57f1113dea38cf848a24536"},c("td",{key:"00dc076239db38c70e697a0d57e297ba96386ac1",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"b723cd5f8c71fe6cd12aec87ef3e3e19c5398a9c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-text-field--development",size:"s",variant:"bold"},"Text Field")),c("td",{key:"5f03a7e0a228e975d6b0584f59b276a418ee06f5"},c("ul",{key:"9a918b1d0e014bd575c070a1acea6c9d2133dc42"},c("li",{key:"e2d22dd3094d99c141ad802da65ca49711fe4f26"},c("span",{key:"42c23bc76808807de4a2fc1bcf8987c8ada7ba0b"},c("ifx-icon",{key:"40b6350199052fe70d840fc93f3bfb2690e80dac",class:"check__icon",icon:"check12"})),c("span",{key:"1fc736142bbd846a7e657fb086a7503bfc0d4213"},"Offers a customizable and accessible interface that allows users to input and modify text, facilitating various data entry and form submission tasks")),c("li",{key:"104354e4917da4e5981e2691f083952ce677bafe"},c("span",{key:"9bdebe747b8860932e69ec24916151dbdb090192"},c("ifx-icon",{key:"ab752f34b489e7841faaf5093fb94acad4871313",class:"check__icon",icon:"check12"})),c("span",{key:"7c5f04b4628fb35b91dabc77871f5d4a2663242d"},"Adheres to web standards")))),c("td",{key:"5e5a2c4982fb337d0029ddc7953279ffae8504f7"},c("ul",{key:"2a1422e6551c69168bbda8e78480aa82ae3f260f"},c("li",{key:"71b1a3154ee61486f28725658cc2cb958c3cd8e8"},c("span",{key:"1670888c377b7cfaa3b0e5d1c1d33795767dd036"},c("ifx-icon",{key:"722a24f2e82aef232b455e75d9b1e1fbfe2b0770",class:"check__icon",icon:"check12"})),c("span",{key:"35d452601289ee72a23d22f61ee91e58e1181258"},"Extended customization")),c("li",{key:"d4b0d17f9bc4f073a98441805bb212425f70c586"},c("span",{key:"bb72e4ea1b95f93c5e01b95b1c4623f8658cb36a"},c("ifx-icon",{key:"5877d846b279e31284784c3fb9aa80ed9be9c4a0",class:"check__icon",icon:"check12"})),c("span",{key:"e96c443966c4d5d4f0a517b62b4583e05fde4194"},"Possibility for icon configuration")),c("li",{key:"84d98674329bb9e0d7f8c2f52921ed2aea4b1fbc"},c("span",{key:"80d5acad09595cf6b1dfca0b94ad575e27bc2663"},c("ifx-icon",{key:"2205f6eb777e3453ade86bdad507ec0fda77d571",class:"check__icon",icon:"check12"})),c("span",{key:"8f15d2f8bbfc4f73bffc66882a5b617e08b8ef59"},"React, Vue and Angular wrapper integration")))),c("td",{key:"917f33e9311c70421b819d925757c41f89ba321d"},c("ul",{key:"3cd2bffccc11ca3e3482c5b36b7003bb58c0ea5e"},c("li",{key:"de4065b5b623493bc94828956af7f19afd697f2c"},c("span",{key:"242923bf4d6de12a67fe60a697334ba6666e3281"},c("ifx-icon",{key:"5959e225b8899379def4965c4459e2cec6027dc5",class:"check__icon",icon:"check12"})),c("span",{key:"d69c7d40a040230e09c022e201a9b8df8fa89306"},"Form integration"))))),c("tr",{key:"55447ff4855c5a1e88f12d22770f87a258ab50f6"},c("td",{key:"68c1b7b80357169179db53e846b3dabf5886825b",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"3721ae3b1d7fa75b61a39f19defd83d9b473d303",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tooltip--development",size:"s",variant:"bold"},"Tooltip")),c("td",{key:"f24556e080eeaf5e8d2421723e6f94d8c83d89ef"},c("ul",{key:"faf05530aaead6e5dc2e6d7805e6ebfa6a9543df"},c("li",{key:"6c51e84af36572d37fd49827f7d419b7e5705b9a"},c("span",{key:"0ff2a494565d238735eab75c088ffaca0a9ea607"},c("ifx-icon",{key:"5463fe8ee6e9b5f5a8b7549603e4e59008e561dc",class:"check__icon",icon:"check12"})),c("span",{key:"a3d09d1c43219eaf98ec9e0a492c8e1511219972"},"Provides a simple and informative interface for displaying supplementary text or contextual information when users interact with specific elements within a web application")),c("li",{key:"2da3b0aebb079b4c27819b190c21ca5dd4bc6303"},c("span",{key:"5bdf0e30647ed7e964d1a03546fabc534d9ae23a"},c("ifx-icon",{key:"091216290acfe214ec43793e8c63ededbbaef105",class:"check__icon",icon:"check12"})),c("span",{key:"f6bd44761e2f25fb1106f40d26fc530cdf29975c"},"Adheres to web standards")))),c("td",{key:"156f063b44fe11558b9d7a06ea81228362cccc76"},c("ul",{key:"67aa9c0f0f522a504bd9060997713a9fb62ba6c8"},c("li",{key:"f2614bf8f28afcd9741183a35f5ebfe1e343b02f"},c("span",{key:"102dafb7ac89c059bb99ebf47fb3d648c87d9277"},c("ifx-icon",{key:"c56f27e1a4761393545a8a33c9c1ea999c8625b5",class:"check__icon",icon:"check12"})),c("span",{key:"12dc00ab16e6fd520bbda743590fde3006bb3edc"},"Compact, dismissible and Extended variants")),c("li",{key:"88037113c4a7741affe5127e43d1d2139346dcf7"},c("span",{key:"0074f8199b24461db18a8f16e0d27d63b458226f"},c("ifx-icon",{key:"9aac71f91c2f7006e5a35e1f7b43ded1f2d9e56e",class:"check__icon",icon:"check12"})),c("span",{key:"149c7fc003f190ccb5ab9d6a93e98808831fe7a9"},"Auto-adjusting position")),c("li",{key:"06fafffb8eb021400c57725453a9a5d3af99248f"},c("span",{key:"bb6e19dcf5b6496688667760095faa5ae4ec1884"},c("ifx-icon",{key:"456468d0b0e88c287020209b3ff22bfe7334da2d",class:"check__icon",icon:"check12"})),c("span",{key:"bd0629f9cf8b3a16dbc66faa9e2616c2f8880c27"},"Icon incorporated")),c("li",{key:"adf59bda269288e2e4d33ab587148ee1093d1f34"},c("span",{key:"d9900466ea0d3ff3911ce94c94bf7048025b9c23"},c("ifx-icon",{key:"20a9335b7623f70d61d318bd2a204e7b7a0fb62a",class:"check__icon",icon:"check12"})),c("span",{key:"6b010e61cef644a608e777ff89b7a4034b9b9781"},"React, Vue and Angular wrapper integration")))),c("td",{key:"2e0b0b0a6deab46b25c9dea89ff74e6676683238"})),c("tr",{key:"7522e0bc6cb1085ed3d3c7dbb04fa5a0e57fe330"},c("td",{key:"ac2d4bdeb961320e454168730c908a4cd970772b",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"584e660268e6220914ccc1173ecbc7be0dc0d4cf",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-notification--development",size:"s",variant:"bold"},"Notification")),c("td",{key:"4b9eaf065f82661174d51d64e90a6aaa1102a387"},c("ul",{key:"d0b75d24a62ba4776fc8055cc8764efd937540cd"},c("li",{key:"e37b3fb21eb9fc36a7971da51132bd09a0266a81"},c("span",{key:"725fa563a764bb0d03d23111d7d827cafe9b96ae"},c("ifx-icon",{key:"98ec67267c3adba646cd0d5b8f5f77b7b1e82619",class:"check__icon",icon:"check12"})),c("span",{key:"54b4b8df39e9ee534c420da0f8ec69505ac572c3"},"Offers a flexible and visually distinct container for presenting informative, warning, or error messages to users, enhancing the overall user experience with timely and relevant feedback")),c("li",{key:"ba98febabc69c9f67d8cd55a05844e66d7211ccd"},c("span",{key:"95a9cbcd4a206c1e58f8e6b977e888432c5a4259"},c("ifx-icon",{key:"a18442700abd5bcd07faca8d6d618a55e42152f2",class:"check__icon",icon:"check12"})),c("span",{key:"df3e2e066e5d80ef8a9f9918154e91ae50bf45b6"},"Adheres to web standards")))),c("td",{key:"672718bf92f33840acfb7e3ca42ac5db08d1ccf1"}),c("td",{key:"3e664ddd80c4962ba5cbd9ba2b939569468ebb0f"})),c("tr",{key:"d0289edc05dce3d6378998bc4f907cf6032aad53"},c("td",{key:"4fb3f8a763425164541026e988e264b71790bbd5",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"417c70d975f8c8627c56b24353dcc0404a1fec37",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-content-switcher--development",size:"s",variant:"bold"},"Content Switcher")),c("td",{key:"23afb257ce78ebb8867832c7994c2cb6ddc99d47"},c("ul",{key:"f027923da7a141e41768b40ceb820c2f7fb0074f"},c("li",{key:"418e824fc5c088f30cba36b5e9b549d84444ddcc"},c("span",{key:"7ca97513cc9dc0e0642cb771921fc3ddca8fbcaf"},c("ifx-icon",{key:"8d8d78dbb54151c17b268162f4cfac671830844b",class:"check__icon",icon:"check12"})),c("span",{key:"4e3c129c58a8ec44804b1f7a7df1c8116ad85427"},"Provides a flexible and intuitive interface for dynamically switching between different content sections or views within a web application")),c("li",{key:"70652164a0b54d3f7d2f2681d7147d1a632501b3"},c("span",{key:"24c27b195311d2d69662acd096e7c74cdd8358c4"},c("ifx-icon",{key:"fe5eab0a7b0a1f97bef42a407792418b9f051857",class:"check__icon",icon:"check12"})),c("span",{key:"2a4273aa8f29ec7e46bae2bd1c93edc52de46e18"},"Offers a customizable mechanism for users to toggle and display diverse content panels, facilitating seamless navigation and interaction with varying information or functional contexts")),c("li",{key:"588805b23ba2c6f56b8c12af0609bc965275a78f"},c("span",{key:"48835a6f4abc61727457e2fb1558aa67f678f506"},c("ifx-icon",{key:"f975e72ddc0cb814f5d58a49d85da293a7a66630",class:"check__icon",icon:"check12"})),c("span",{key:"f04f1e2a4d3360528eaeeddbaf9fa82370d3e95f"},"Adheres to web standards")))),c("td",{key:"5f348ed412e195a53b96ef6dffa012b23b2e9f21"}),c("td",{key:"4d703c8dd3cabab169b82763c058ce487393d0d9"})),c("tr",{key:"3cf626778e61e0d3ce158f441539866ae1b5ff5c"},c("td",{key:"f46791a54c93e30026c8cc9b5a13c30914367393",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"1f718daba931983c53adef9e4c5d4bcc5ffd10e4",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-segmented-control--development",size:"s",variant:"bold"},"Segmented Control")),c("td",{key:"023a66ab894ca692b7c16c7aa9f1b6a0da38475c"},c("ul",{key:"8a64eebb26deb6b0559aca18d11023b5ea35f516"},c("li",{key:"598111d843a8e73bddd38291d0f4f8a4a8ba1322"},c("span",{key:"386972b74830e2014a8f27665bcba93a530d035f"},c("ifx-icon",{key:"ae73eef82af1133b3ee030d014041a4cada45d4c",class:"check__icon",icon:"check12"})),c("span",{key:"74d3c6c77d5e21b02a6ebf1d22c4f3625eff693e"},"Provides a clear and interactive interface for users to make mutually exclusive selections among multiple options within a web application")),c("li",{key:"5c553ef5b260486df63232410370385b41972e13"},c("span",{key:"78d2ed0762aed7d08b1d5de2116d9a9037cef500"},c("ifx-icon",{key:"f1d1630590611a8ab6fe36025a9eb849141165a5",class:"check__icon",icon:"check12"})),c("span",{key:"11060ea0d6532199b0710e6673f58f9248aab0cc"},"Offers a customizable set of segmented buttons or tabs, allowing users to toggle between different choices or views, typically used for filtering, categorization, or navigation purposes")),c("li",{key:"0a74348cc14fd322a146874e8b478267bd80fc73"},c("span",{key:"e41fefa6c462cc2d13b75f3e2fe6603c3b7102ac"},c("ifx-icon",{key:"f85a933d8106ba757bc0ebbbbfefbb3a5b247e5b",class:"check__icon",icon:"check12"})),c("span",{key:"3667fb97f74a53ea0ed6381bbce1b1cb751634a6"},"Adheres to web standards")))),c("td",{key:"113acd9ce78f63a22f37691e07c39a1c5992087f"}),c("td",{key:"c243dc31cf2c18ab9e2b0e44f509621535dd4b04"})),c("tr",{key:"54dbad1554ea7300a41e41848046a3074f4cc5cc"},c("td",{key:"be726c511c779d9261c4dc28a8421170067de26f",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"53de31292dc3681193133e2c06c090135c9aaf45",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-segmented-controls--development",size:"s",variant:"bold"},"Textarea")),c("td",{key:"af03546d5d14a5f9f59de0914de45730ad7171d3"},c("ul",{key:"d010013d4bfc0126b7fc629703d58b7915e57a30"},c("li",{key:"d44e88c8b85b5de252ba61816e78a7e43fa52fc6"},c("span",{key:"aca1bb2299d78fe9fc3256751bf2dd6884893efc"},c("ifx-icon",{key:"20673940da6065fd32259befdb58acf420127b3f",class:"check__icon",icon:"check12"})),c("span",{key:"3a7a6d4a2f67e08050488cdfd8c1632ae6150135"},"Provides a customizable multi-line text input interface, enabling users to input, edit, and view large amounts of text, while adhering to web standards for accessibility and usability.")),c("li",{key:"dbc7d0d8138d908468300984977c9447e8c59d6e"},c("span",{key:"264a198c83b08d8ec3fbc5540071cc9d05e1c179"},c("ifx-icon",{key:"3977e17ffad6076c50c9a3d471b4623904bdd63f",class:"check__icon",icon:"check12"})),c("span",{key:"07ffe17ad6c7dc125648c92c6ddef1a733016356"},"Form integration")))),c("td",{key:"4f8687bd3de464d055c9c7fd5970ca4092f91678"}),c("td",{key:"7dc1c0741920ceb9e3f8d632989045bf011b2a40"})),c("tr",{key:"02d43a5feee19b112b837875a006c34f08c3f04c"},c("td",{key:"c1c02fa35b707ac2f4a4bc09a4d4696d38d81b34",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"a8a7984540322c9df098411500a23f5301e94ad5",href:"",size:"s",variant:"bold"},"Card Group")),c("td",{key:"2f130749f3a4f483b35c6e7c7bd156baa6c1ded9"},c("ul",{key:"f5df39d3cad64727f7a6c26519635324a90db2b5"},c("li",{key:"5c1b0fa9a3986ae94786c6ec067d21361ceec03e",class:"planned__component-wrapper"},c("span",{key:"ad34c79df1211fa7a10de8107d5522a6a99b9da7"},c("ifx-icon",{key:"dce5b0516c468a5d7862c43bf7185e19bd5e6cef",class:"planned__icon",icon:"clock24"})),c("span",{key:"b45ed1109611d9854433f731447eb40594fb7efc"},"On Hold")))),c("td",{key:"dd1a464908da28ace3182d53e0b6eb09ba48c5ee"}),c("td",{key:"134fbaad9e05a847d2500bb634bee31cf0dcfd6e"})),c("tr",{key:"6826ce509def76ee141579700f6f4a6d161abbaa"},c("td",{key:"71ec7b75efdc5ce8f2922f9ebe26debf0769a2b1",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"e33205bfcfd9a24fbafddab3d626feb887a0620e",href:"",size:"s",variant:"bold"},"Advanced Date Picker")),c("td",{key:"69d2bb3e307a8ed1ea0918d181c9526c96e58a10"},c("ul",{key:"ffc69e6a5c5d143a1ab9d05928284cd835d43df7"},c("li",{key:"6e76d268cde49da8340987645718fbc2ab01ac62",class:"planned__component-wrapper"},c("span",{key:"079ba82c2a4794ffa277c574fd7842ef3c3bd4e2"},c("ifx-icon",{key:"2276e8282512529ae3293ecdae4ece959e2fff0e",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"f9ac3485db470fbef609ff1795ca37727303077d"},"In Progress")))),c("td",{key:"8837a83640cc8d77dbe211634bd6089390ef5391"}),c("td",{key:"769f17db51a79102e70a856ded5703f6146bce0c"})),c("tr",{key:"40a7f4fc97efd7f1a8b50b6715162541e432e6e6"},c("td",{key:"593366970f463a7f0bb71ec18ec5b60224a8eb8d",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"16e88160b79ca862beebbc50664aacff098078d0",href:"",size:"s",variant:"bold"},"Upload")),c("td",{key:"6f8eb7aab6ed8c5aa74b7b5e018933b88ea3746d"},c("ul",{key:"276a421550569566d9f88a1aedcb37bc092deca3"},c("li",{key:"d9817faaac46bb07e7b88f1fd52394fd8f193a54",class:"planned__component-wrapper"},c("span",{key:"27a0dde3ec71adf68124d2ddd357bffb96ffcaa3"},c("ifx-icon",{key:"0d45075762875ee5d85ff45835b365c161f86a21",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"8457a046b7305574f6791328f58b248b40a28cf7"},"In Progress")))),c("td",{key:"5769d35800da365fd5151689fd697a7e174a96b2"}),c("td",{key:"ca6290c8ef9415edd9e423be070a4e9740cd48b2"})),c("tr",{key:"60a567a2ab257acf91ecabae339116f8b8479d84"},c("td",{key:"eafdb07c6360f9da75691b23c7298fe2670b58b5",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"d69cd945ada0c1efff758ea75e4af56f2ea08ac3",href:"",size:"s",variant:"bold"},"Checkbox Group")),c("td",{key:"749810cb14a3cd97fa758dd3eb430f9a6b61a0d1"},c("ul",{key:"cf888204e6a6cc314034853f332d05c136b8283e"},c("li",{key:"01abc15974e304ab1bcbd351cd20456cb167ab08",class:"planned__component-wrapper"},c("span",{key:"f3f2db06c64198f381bc04aa61404c5d383d8fd9"},c("ifx-icon",{key:"385100ea5a00e5e177409abb57b259f0bbe76a32",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"43fd48c9c61e38d7067e8b917175cb160ae19ae6"},"In Progress")))),c("td",{key:"a38de755ceb19b8b3a1a48193d01963c7ada8de1"}),c("td",{key:"de4468e0cd1593144ffeba941982c2741fb6c9f1"})),c("tr",{key:"ccf8303e7467c1a034aad7c003161b3c5a0b3200"},c("td",{key:"f0e7b385fafc34b811d1f9f6606ac4c52cc249d7",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"c9b886b77ee2ffe50bba6bc7ffe490256b0b986c",href:"",size:"s",variant:"bold"},"Radio Group")),c("td",{key:"dbdb0b3b3885185ba567c3f65f0854433bb90cda"},c("ul",{key:"381c75777f5db67fa93e178120fde578aa91a937"},c("li",{key:"04839723b7b1efe7a90e0810cb4240b6e1874d87",class:"planned__component-wrapper"},c("span",{key:"becd5aefa3c3c2fea6398ea6c6e8ba4c127de79c"},c("ifx-icon",{key:"e3f99a644a46e0db5dc84f5f22c8a56d02da8b19",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"375553a23aafd99333ade33a66c6421dd5f95eae"},"In Progress")))),c("td",{key:"7766ab73806f39b07ea178fc3d81788034ff7d68"}),c("td",{key:"06e1840c788983b36e3dc32db2783e0259d3ad6a"})),c("tr",{key:"accaa4990846650a849816b0a11781b176055c9e"},c("td",{key:"64f19bf1cad8b7943dc4e1941ad605d2cee410e4",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"51ad6960c2e4790d3c9fb183d7981d47d85457a6",href:"",size:"s",variant:"bold"},"Tree View")),c("td",{key:"8f9c5b8eee55cbb4858028645e42b35ad0147c43"},c("ul",{key:"6ac551c8dbddb2be4b7f728dd266f970591cd59e"},c("li",{key:"0434deb84be37e7d365aa3aaec82789f0092a5ca",class:"planned__component-wrapper"},c("span",{key:"cf261075238b52dd11d7f7352120160bc605a641"},c("ifx-icon",{key:"ce941d6469e406b66776f855423d9698538da25c",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"9cd2f487600c547dbcca83dc4ab520257c9b030b"},"In Progress")))),c("td",{key:"fb6ca9516e8f4ab5b7fd2014ca632ee03f6b4cd7"}),c("td",{key:"3a0fb4d54d77d2004da0ad1285f3dbcf54272700"})),c("tr",{key:"a8402acb4914a13aa03f67fdc873152f8a538223"},c("td",{key:"f84c25439f44751239c5dc52c8cf2e0b7b35e60a",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"f5a968fd3be31fca9d127698aa6b3cc6fef86691",href:"",size:"s",variant:"bold"},"Popover")),c("td",{key:"f4adc303e2717678b4755270d043ffe915465623"},c("ul",{key:"16f5b430b3a09158d315d99105749a23df7a6cad"},c("li",{key:"b00da00ab0cc6a5e131b594187c75264c62989f5",class:"planned__component-wrapper"},c("span",{key:"bd3209eb70863a541d793ab610f504bcfd3f6a24"},c("ifx-icon",{key:"6aa0cb890752da6afdac01ef3e480bab0a5d42a9",class:"planned__icon",icon:"clock24"})),c("span",{key:"25e7e4cdbec7cd2aec96526418db2135934a7296"},"On Hold")))),c("td",{key:"0c7445d7e2a22c2032c3eae9b164d55dad7cff59"}),c("td",{key:"05df64cdf231c703bc0887612cb19a9470850ae6"})))))))}get el(){return a(this)}};b.style=f;export{b as ifx_overview_table};
+//# sourceMappingURL=p-c7f80bba.entry.js.map