@infineon/infineon-design-system-stencil 30.10.0--canary.1702.6c63d2d857f4174f3e9f8e7b7cb49f6bca39238a.0 → 30.10.0

package/dist/infineon-design-system-stencil/p-00d6e46e.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-030a5b46.entry.js

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

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

@@ -0,0 +1 @@
+{"version":3,"names":["switchCss","IfxSwitchStyle0","Switch","isChecked","this","internalChecked","componentWillLoad","checked","toggleLabelGap","slot","el","shadowRoot","querySelector","container","assignedNodes","length","classList","add","remove","componentDidLoad","valueChanged","newValue","oldValue","toggleSwitch","disabled","value","undefined","internals","setFormValue","ifxChange","emit","handleKeyDown","event","key","formResetCallback","render","h","class","role","name","onClick","onKeyDown","tabindex","type","hidden","htmlFor","onSlotchange"],"sources":["src/components/switch/switch.scss?tag=ifx-switch&encapsulation=shadow","src/components/switch/switch.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n/* switch.css */\n:host {\n  display: inline-block;\n  user-select: none;\n}\n\n.container {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  &.gap {\n    gap: tokens.$ifxSpace200;\n  }\n}\n\n\n.switch__checkbox-container {\n  padding: tokens.$ifxSpace50;\n  display: flex;\n  align-items: center;\n  position: relative;\n  // Subtracting padding size from both height and width\n  width: (tokens.$ifxSpace500)-8px;\n  height: 16px;\n  background-color: tokens.$ifxColorBaseWhite;\n  border: 1px solid tokens.$ifxColorEngineering500;\n  border-radius: 20px;\n  cursor: pointer;\n  transition: background-color 0.3s ease;\n  outline: none;\n\n  &:focus {\n    outline: 4px solid tokens.$ifxColorOcean500;\n    outline-offset: 2px;\n  }\n\n  &:focus:not(:focus-visible) {\n    outline: none;\n  }\n\n  &:focus-visible {\n    outline: 2px solid tokens.$ifxColorOcean500;\n    outline-offset: 2px;\n  }\n\n  &.disabled {\n    cursor: default;\n    border-color: tokens.$ifxColorEngineering300;\n  }\n\n\n}\n\n\n.switch__label-wrapper {\n\n  & label { \n    &:hover { \n      cursor: pointer;\n    }\n  }\n\n  &.disabled {\n    color: tokens.$ifxColorEngineering300;\n  }\n}\n\n\n.switch__checkbox-wrapper {\n\n  .switch {\n    // position: absolute;\n    width: tokens.$ifxSpace200;\n    height: tokens.$ifxSpace200;\n    background-color: tokens.$ifxColorEngineering500;\n    border-radius: 50%;\n    transition: transform 0.3s ease, background-color 0.3s ease;\n\n    &.disabled {\n      background-color: tokens.$ifxColorEngineering300;\n      border-color: tokens.$ifxColorEngineering300;\n      cursor: default;\n    }\n  }\n\n  .switch.checked {\n    transform: translateX(16px);\n    background-color: tokens.$ifxColorBaseWhite;\n\n    &.disabled {\n      cursor: default;\n    }\n\n  }\n\n}\n\n.switch__checkbox-container:hover .toggle-switch {\n  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);\n}\n\n\n\n.switch__checkbox-container.checked {\n  background-color: tokens.$ifxColorOcean500;\n  border-color: tokens.$ifxColorOcean500;\n\n  &.disabled {\n    background-color: tokens.$ifxColorEngineering300;\n    border-color: tokens.$ifxColorEngineering300;\n    cursor: default;\n  }\n}","import { AttachInternals, Method } from '@stencil/core';\nimport { Component, Prop, State, Watch, h, Event, EventEmitter, Element } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-switch',\n  styleUrl: 'switch.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class Switch {\n  @Prop() checked: boolean = false;\n  @Prop() name: string = '';\n  @Prop() disabled: boolean = false;\n  @Prop() value: string;\n  @State() internalChecked: boolean = false;\n\n  @AttachInternals() internals: ElementInternals;\n\n  @Element() el: HTMLIfxSwitchElement;\n\n  @Event({ eventName: 'ifxChange' }) ifxChange: EventEmitter<boolean>;\n\n  @Method()\n  async isChecked(): Promise<boolean> {\n    return this.internalChecked;\n  }\n\n  componentWillLoad() {\n    this.internalChecked = this.checked;\n  }\n  \n\n  toggleLabelGap() {\n    const slot = this.el.shadowRoot.querySelector('slot');\n    const container = this.el.shadowRoot.querySelector('.container');\n    if (slot.assignedNodes().length) {\n      container.classList.add('gap')\n    } else { \n      container.classList.remove('gap')\n    }\n  }\n  \n  componentDidLoad() {\n    this.toggleLabelGap();\n\n  }\n    \n  @Watch('checked')\n  valueChanged(newValue: boolean, oldValue: boolean) {\n    if (newValue !== oldValue) {\n      this.internalChecked = newValue;\n    }\n  }\n\n  toggleSwitch() {\n    if (this.disabled) return;\n    this.internalChecked = !this.internalChecked;\n\n    if (this.internalChecked) {\n      if (this.value !== undefined) {\n        this.internals.setFormValue(this.value);\n      } else {\n        this.internals.setFormValue(\"on\")\n      }\n    } else {\n      this.internals.setFormValue(null)\n    }\n\n    this.ifxChange.emit(this.internalChecked);\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    if (this.disabled) return;\n    // If the pressed key is either 'Enter' or 'Space' \n    if (event.key === 'Enter' || event.key === ' ') {\n      this.toggleSwitch();\n    }\n  }\n\n  /**\n   * Callback for form association.\n   * Called whenever the form is reset.\n   */\n  formResetCallback() {\n    this.internals.setFormValue(null);\n  }\n\n  render() {\n    return (\n      <div\n        class=\"container\"\n        role=\"switch\"\n        aria-checked={this.internalChecked ? 'true' : 'false'}\n        aria-label={this.name}\n        onClick={() => this.toggleSwitch()}\n        onKeyDown={(event) => this.handleKeyDown(event)}\n        >\n        {/* Checkbox */}\n        <div \n          class={`switch__checkbox-container ${this.internalChecked ? 'checked' : ''} ${this.disabled ? 'disabled' : ''}`}\n          tabindex=\"0\"\n        >\n          <div class=\"switch__checkbox-wrapper\">\n            <input type=\"checkbox\" hidden\n              name={this.name}\n              disabled={this.disabled}\n              checked={this.internalChecked}\n              value={`${this.value}`} />\n            <div class={`switch ${this.internalChecked ? 'checked' : ''} ${this.disabled ? 'disabled' : ''}`} />\n          </div>\n        </div >\n\n        {/* Label */}\n        <div class={`switch__label-wrapper ${this.disabled ? 'disabled' : ''}`} >\n          <label htmlFor=\"switch\">\n            <slot onSlotchange={() => this.toggleLabelGap()} />\n          </label>\n        </div>\n      </div>\n    )\n\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAY,giDAClB,MAAAC,EAAeD,E,MCSFE,EAAM,M,2OACU,M,UACJ,G,cACK,M,0CAEQ,K,CASpC,eAAMC,GACJ,OAAOC,KAAKC,e,CAGd,iBAAAC,GACEF,KAAKC,gBAAkBD,KAAKG,O,CAI9B,cAAAC,GACE,MAAMC,EAAOL,KAAKM,GAAGC,WAAWC,cAAc,QAC9C,MAAMC,EAAYT,KAAKM,GAAGC,WAAWC,cAAc,cACnD,GAAIH,EAAKK,gBAAgBC,OAAQ,CAC/BF,EAAUG,UAAUC,IAAI,M,KACnB,CACLJ,EAAUG,UAAUE,OAAO,M,EAI/B,gBAAAC,GACEf,KAAKI,gB,CAKP,YAAAY,CAAaC,EAAmBC,GAC9B,GAAID,IAAaC,EAAU,CACzBlB,KAAKC,gBAAkBgB,C,EAI3B,YAAAE,GACE,GAAInB,KAAKoB,SAAU,OACnBpB,KAAKC,iBAAmBD,KAAKC,gBAE7B,GAAID,KAAKC,gBAAiB,CACxB,GAAID,KAAKqB,QAAUC,UAAW,CAC5BtB,KAAKuB,UAAUC,aAAaxB,KAAKqB,M,KAC5B,CACLrB,KAAKuB,UAAUC,aAAa,K,MAEzB,CACLxB,KAAKuB,UAAUC,aAAa,K,CAG9BxB,KAAKyB,UAAUC,KAAK1B,KAAKC,gB,CAG3B,aAAA0B,CAAcC,GACZ,GAAI5B,KAAKoB,SAAU,OAEnB,GAAIQ,EAAMC,MAAQ,SAAWD,EAAMC,MAAQ,IAAK,CAC9C7B,KAAKmB,c,EAQT,iBAAAW,GACE9B,KAAKuB,UAAUC,aAAa,K,CAG9B,MAAAO,GACE,OACEC,EAAA,OAAAH,IAAA,2CACEI,MAAM,YACNC,KAAK,SAAQ,eACClC,KAAKC,gBAAkB,OAAS,QAAO,aACzCD,KAAKmC,KACjBC,QAAS,IAAMpC,KAAKmB,eACpBkB,UAAYT,GAAU5B,KAAK2B,cAAcC,IAGzCI,EAAA,OAAAH,IAAA,2CACEI,MAAO,8BAA8BjC,KAAKC,gBAAkB,UAAY,MAAMD,KAAKoB,SAAW,WAAa,KAC3GkB,SAAS,KAETN,EAAA,OAAAH,IAAA,2CAAKI,MAAM,4BACTD,EAAA,SAAAH,IAAA,2CAAOU,KAAK,WAAWC,OAAM,KAC3BL,KAAMnC,KAAKmC,KACXf,SAAUpB,KAAKoB,SACfjB,QAASH,KAAKC,gBACdoB,MAAO,GAAGrB,KAAKqB,UACjBW,EAAA,OAAAH,IAAA,2CAAKI,MAAO,UAAUjC,KAAKC,gBAAkB,UAAY,MAAMD,KAAKoB,SAAW,WAAa,SAKhGY,EAAA,OAAAH,IAAA,2CAAKI,MAAO,yBAAyBjC,KAAKoB,SAAW,WAAa,MAChEY,EAAA,SAAAH,IAAA,2CAAOY,QAAQ,UACbT,EAAA,QAAAH,IAAA,2CAAMa,aAAc,IAAM1C,KAAKI,qB","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as s}from"./p-6b122987.js";const n=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.segment{display:flex;align-items:center;justify-content:center;gap:8px;position:relative;border:1px solid #BFBBBB;border-radius:1px;padding:0 8px 0 8px;height:34px;background-color:#FFFFFF;transition:all 100ms ease;transition-property:color, background;font:600 0.875rem/1.25rem "Source Sans 3"}.segment:focus-visible{color:#FFFFFF;background-color:#0A8276}.segment:hover{color:#FFFFFF;background-color:#08665C;cursor:pointer}.segment:active{background-color:#06534B}.segment.segment--selected{color:#FFFFFF;background-color:#0A8276}.segment.segment--small{height:30px}.segment::after{position:absolute;top:0;left:0;width:100%;height:100%;outline:1px solid #BFBBBB;border-radius:1px;content:""}';const o=n;const i=class{constructor(s){e(this,s);this.segmentSelect=t(this,"segmentSelect",5);this.icon=undefined;this.segmentIndex=undefined;this.selected=false;this.value=undefined}handleSegmentClick(){if(this.selected)return;this.selected=true;this.segmentSelect.emit(this.segmentIndex)}handleSegmentKeyDown(e){if(e.code==="Enter"||e.code==="Space"){if(this.selected)return;this.selected=true;this.segmentSelect.emit(this.segmentIndex)}}render(){return s("div",{key:"49c56df2adf407d13685ae7c99b512afa532c6de",class:`segment ${this.selected?"segment--selected":""}`,tabIndex:0,onClick:()=>{this.handleSegmentClick()},onKeyDown:e=>{this.handleSegmentKeyDown(e)}},s("ifx-icon",{key:"c576b2bb7b09ae6ed1946759df7303df36b430dc",icon:this.icon})," ",s("slot",{key:"61d467f2cda3552d5c90e9995ceccdca76c6825c"}))}};i.style=o;export{i as ifx_segment};
+//# sourceMappingURL=p-0a011c63.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["segmentCss","IfxSegmentStyle0","Segment","handleSegmentClick","this","selected","segmentSelect","emit","segmentIndex","handleSegmentKeyDown","event","code","render","h","key","class","tabIndex","onClick","onKeyDown","e","icon"],"sources":["src/components/segmented-control/segment/segment.scss?tag=ifx-segment&encapsulation=shadow","src/components/segmented-control/segment/segment.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n.segment {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: tokens.$ifxSize100;\n    position: relative;\n\n    border: tokens.$ifxBorderRadius12 solid tokens.$ifxColorEngineering300;\n    border-radius: tokens.$ifxBorderRadius12;\n    padding: 0 tokens.$ifxSize100 0 tokens.$ifxSize100;\n    \n    height: 34px;\n\n    background-color: tokens.$ifxColorBaseWhite;\n\n    transition: all 100ms ease;\n    transition-property: color, background;\n    \n    font: tokens.$ifxBodyBodySemibold04;\n\n    &:focus-visible {\n        color: tokens.$ifxColorBaseWhite;\n        background-color: tokens.$ifxColorOcean500;\n    }\n\n    &:hover {         \n        color: tokens.$ifxColorBaseWhite;\n        background-color: tokens.$ifxColorOcean600;\n        \n        cursor: pointer;\n    }\n    \n    &:active {\n        background-color: tokens.$ifxColorOcean700;\n    }\n    \n    &.segment--selected {\n        color: tokens.$ifxColorBaseWhite;\n        \n        background-color: tokens.$ifxColorOcean500;\n    }\n\n    &.segment--small {\n        height: 30px;\n    }\n}\n\n.segment::after {\n    position: absolute;\n    top: 0;\n    left: 0;\n\n    width: 100%;\n    height: 100%;\n\n    outline: tokens.$ifxBorderRadius12 solid tokens.$ifxColorEngineering300;\n    border-radius: tokens.$ifxBorderRadius12;\n\n    content: '';\n}","import { h, Component, Event, EventEmitter, Prop } from \"@stencil/core\";\n\n@Component ({\n    tag: 'ifx-segment',\n    styleUrl: 'segment.scss',\n    shadow: true\n})\n\nexport class Segment {\n    @Event({ composed: false }) segmentSelect: EventEmitter<number>;\n\n    @Prop() icon: string;\n    @Prop() segmentIndex: number;\n    @Prop({ mutable: true }) selected: boolean = false;\n    @Prop() value!: string;\n\n    handleSegmentClick() {\n        if (this.selected) return;\n        this.selected = true;\n        this.segmentSelect.emit(this.segmentIndex);\n    }\n    \n    handleSegmentKeyDown(event: KeyboardEvent) {\n        if (event.code === 'Enter' || event.code === 'Space') {\n            if (this.selected) return;\n            this.selected = true;\n            this.segmentSelect.emit(this.segmentIndex);\n        }\n    }\n\n    render() {\n        return (\n            <div class={`segment ${this.selected ? 'segment--selected' : ''}`} \n                tabIndex={0}\n                onClick={() => {this.handleSegmentClick()}}\n                onKeyDown={(e) => {this.handleSegmentKeyDown(e)}}>\n                <ifx-icon icon={this.icon}></ifx-icon> <slot />\n            </div>\n        );\n    }\n}"],"mappings":"kDAAA,MAAMA,EAAa,ixBACnB,MAAAC,EAAeD,E,MCOFE,EAAO,M,oIAK6B,M,qBAG7C,kBAAAC,GACI,GAAIC,KAAKC,SAAU,OACnBD,KAAKC,SAAW,KAChBD,KAAKE,cAAcC,KAAKH,KAAKI,a,CAGjC,oBAAAC,CAAqBC,GACjB,GAAIA,EAAMC,OAAS,SAAWD,EAAMC,OAAS,QAAS,CAClD,GAAIP,KAAKC,SAAU,OACnBD,KAAKC,SAAW,KAChBD,KAAKE,cAAcC,KAAKH,KAAKI,a,EAIrC,MAAAI,GACI,OACIC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,WAAWX,KAAKC,SAAW,oBAAsB,KACzDW,SAAU,EACVC,QAAS,KAAOb,KAAKD,oBAAoB,EACzCe,UAAYC,IAAOf,KAAKK,qBAAqBU,EAAE,GAC/CN,EAAA,YAAAC,IAAA,2CAAUM,KAAMhB,KAAKgB,OAAiB,IAACP,EAAA,QAAAC,IAAA,6C","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as e,h as t,g as r}from"./p-6b122987.js";const i=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.breadcrumb-parent{display:flex;flex-direction:row;align-items:center;padding:0px;gap:12px;min-height:24px;justify-content:center}.breadcrumb-parent:hover{cursor:pointer}.breadcrumb-parent .breadcrumb-wrapper{display:flex;flex-direction:row;align-items:center;padding:0px;gap:8px;position:relative}.breadcrumb-parent .breadcrumb-wrapper .dropdown-menu{display:none;position:absolute;top:20px}.breadcrumb-parent .breadcrumb-wrapper .dropdown-menu.open{display:block}.breadcrumb-parent .breadcrumb-wrapper a{text-decoration:none;color:#1D1D1D;font-family:var(--ifx-font-family);font-style:normal;font-weight:400;font-size:0.875rem;line-height:1.25rem;display:flex;align-items:center;color:#1D1D1D;flex-direction:column;justify-content:center;padding:0px;border-bottom:1px solid #1D1D1D}.breadcrumb-parent .breadcrumb-divider{width:10px;height:16px;color:#EEEDED;line-height:13px;font-size:1.25rem;margin-right:12px}';const n=i;const o=class{constructor(t){e(this,t);this.isLastItem=false;this.uniqueId=undefined;this.hasDropdownMenu=false}handleOutsideClick(e){const t=e.composedPath();if(!t.includes(this.el)){this.closeDropdownMenu()}}handleKeyDown(e){if(e.key==="Enter"||e.key===" "){this.toggleDropdownMenu()}else if(e.key==="Escape"){this.closeDropdownMenu()}}getDropdownMenu(){const e=this.el.shadowRoot.querySelector(".dropdown-menu");return e}menuWrapperEventReEmitter(e){this.emittedElement=e.detail}getMenuIconWrapper(){return this.emittedElement}handleClassList(e,t,r){e.classList[t](r)}closeDropdownMenu(){if(this.hasDropdownMenu){const e=this.getDropdownMenu();const t=this.getMenuIconWrapper();this.handleClassList(e,"remove","open");this.handleClassList(t,"remove","show")}}toggleDropdownMenu(){if(this.hasDropdownMenu){const e=this.getDropdownMenu();const t=this.getMenuIconWrapper();this.handleClassList(e,"toggle","open");this.handleClassList(t,"toggle","show")}}isDropdownMenuOpen(){const e=this.getDropdownMenu();return this.hasDropdownMenu&&e&&e.classList.contains("open")}handleLastItem(){const e=this.el.closest("ifx-breadcrumb").querySelectorAll("ifx-breadcrumb-item");if(this.el===e[e.length-1]){this.isLastItem=true}else this.isLastItem=false}generateUniqueId(e="id"){return`${e}-${Math.random().toString(36).substring(2,9)}`}componentWillLoad(){if(!this.uniqueId){this.uniqueId=this.generateUniqueId("breadcrumb-dropdown")}this.handleLastItem()}componentDidUpdate(){this.handleLastItem()}componentWillRender(){this.setHasDropdownMenuState()}setHasDropdownMenuState(){const e=this.getIfxDropdownMenuComponent();if(e){this.hasDropdownMenu=!!e}}getIfxDropdownMenuComponent(){const e=this.el.querySelector("ifx-dropdown-menu");return e}componentDidLoad(){const e=this.getIfxDropdownMenuComponent();if(!this.hasDropdownMenu){const e=this.getMenuIconWrapper();this.handleClassList(e,"toggle","hide")}else{e.isOpen=true}}render(){return t("li",{key:"5779bbe0854a084c33c1bb535655fe484165784e",class:"breadcrumb-parent","aria-current":`${this.isLastItem?"page":""}`},t("li",{key:"63e956424dda4002a84c7da17bfe42b3f7f830b0",role:"button",tabindex:this.hasDropdownMenu?0:-1,class:"breadcrumb-wrapper",onClick:()=>this.toggleDropdownMenu(),"aria-controls":this.uniqueId,"aria-haspopup":"menu","aria-label":"Toggle dropdown menu"},t("slot",{key:"14f66501d9ac8efc9ff9e6b771757e30c70814a6",name:"label"}),t("div",{key:"9620ab0608dc5c74aa39fe321a332421ee4c76b3",id:this.uniqueId,class:"dropdown-menu","aria-expanded":this.isDropdownMenuOpen(),"aria-label":"Dropdown menu"},t("slot",{key:"c4e6e9b1650f2467876f7824201139b369625b3d"}))),!this.isLastItem&&t("span",{key:"5c028ab8720841b8a2777a84d7ad3f933ab43b79",class:"breadcrumb-divider","aria-hidden":"true"},"/"))}get el(){return r(this)}};o.style=n;export{o as ifx_breadcrumb_item};
+//# sourceMappingURL=p-0c4276df.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["breadcrumbItemCss","IfxBreadcrumbItemStyle0","BreadcrumbItem","handleOutsideClick","event","path","composedPath","includes","this","el","closeDropdownMenu","handleKeyDown","ev","key","toggleDropdownMenu","getDropdownMenu","dropdownMenu","shadowRoot","querySelector","menuWrapperEventReEmitter","emittedElement","detail","getMenuIconWrapper","handleClassList","type","className","classList","hasDropdownMenu","menuWrapper","isDropdownMenuOpen","contains","handleLastItem","breadcrumbItems","closest","querySelectorAll","length","isLastItem","generateUniqueId","prefix","Math","random","toString","substring","componentWillLoad","uniqueId","componentDidUpdate","componentWillRender","setHasDropdownMenuState","getIfxDropdownMenuComponent","componentDidLoad","iconMenuWrapper","isOpen","render","h","class","role","tabindex","onClick","name","id"],"sources":["src/components/breadcrumb/breadcrumb-item.scss?tag=ifx-breadcrumb-item&encapsulation=shadow","src/components/breadcrumb/breadcrumb-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.breadcrumb-parent {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 0px;\n  gap: tokens.$ifxSpace150;\n  min-height: tokens.$ifxSize300;\n  justify-content: center;\n\n  &:hover {\n    cursor: pointer;\n  }\n\n  & .breadcrumb-wrapper {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 0px;\n    gap: tokens.$ifxSpace100;\n    position: relative;\n\n    & .dropdown-menu {\n      display: none;\n      position: absolute;\n      top: 20px;\n\n      &.open {\n        display: block;\n      }\n    }\n\n    & a {\n      text-decoration: none;\n      color: tokens.$ifxColorBaseBlack;\n      font-family: var(--ifx-font-family);\n      font-style: normal;\n      font-weight: 400;\n      font-size: tokens.$ifxFontSizeS;\n      line-height: tokens.$ifxLineHeightS;\n      display: flex;\n      align-items: center;\n      color: tokens.$ifxColorBaseBlack;\n      flex-direction: column;\n      justify-content: center;\n      padding: 0px;\n      border-bottom: 1px solid #1D1D1D;\n    }\n  }\n\n  & .breadcrumb-divider {\n    width: 10px;\n    height: tokens.$ifxSize200;\n    color: tokens.$ifxColorEngineering200;\n    line-height: 13px;\n    font-size: tokens.$ifxFontSizeXl;\n\n    margin-right: 12px;\n  }\n}","import { Component, h, Element, State, Listen } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-breadcrumb-item',\n  styleUrl: 'breadcrumb-item.scss',\n  shadow: true,\n})\nexport class BreadcrumbItem {\n\n  @State() isLastItem: boolean = false;\n  @Element() el;\n  private emittedElement: HTMLElement;\n  @State() uniqueId: string;\n  @State() hasDropdownMenu: boolean = false;\n\n  @Listen('mousedown', { target: 'document' })\n  handleOutsideClick(event: MouseEvent) {\n    const path = event.composedPath();\n    if (!path.includes(this.el)) {\n      this.closeDropdownMenu();\n    }\n  }\n\n  @Listen('keydown')\n  handleKeyDown(ev: KeyboardEvent) {\n    if (ev.key === 'Enter' || ev.key === ' ') {\n      this.toggleDropdownMenu();\n    } else if (ev.key === 'Escape') {\n      this.closeDropdownMenu();\n    }\n  }\n\n  getDropdownMenu() {\n    const dropdownMenu = this.el.shadowRoot.querySelector('.dropdown-menu');\n    return dropdownMenu\n  }\n\n  @Listen('breadcrumbMenuIconWrapper')\n  menuWrapperEventReEmitter(event: CustomEvent<HTMLElement>) { \n    this.emittedElement = event.detail;\n  }\n\n  getMenuIconWrapper(): HTMLElement | undefined {\n    return this.emittedElement;\n  }\n\n  handleClassList(el, type, className) {\n    el.classList[type](className)\n  }\n\n  closeDropdownMenu() {\n    if(this.hasDropdownMenu) {\n      const dropdownMenu = this.getDropdownMenu()\n      const menuWrapper = this.getMenuIconWrapper()\n      this.handleClassList(dropdownMenu, 'remove', 'open')\n      this.handleClassList(menuWrapper, 'remove', 'show')\n    }\n  }\n\n  toggleDropdownMenu() { \n    if(this.hasDropdownMenu) {\n      const dropdownMenu = this.getDropdownMenu()\n      const menuWrapper = this.getMenuIconWrapper()\n      this.handleClassList(dropdownMenu, 'toggle', 'open')\n      this.handleClassList(menuWrapper, 'toggle', 'show')\n    }\n  }\n\n  isDropdownMenuOpen(): boolean {\n    const dropdownMenu = this.getDropdownMenu()\n    return this.hasDropdownMenu && dropdownMenu && dropdownMenu.classList.contains('open')\n  }\n\n  handleLastItem() { \n    const breadcrumbItems = this.el.closest('ifx-breadcrumb').querySelectorAll('ifx-breadcrumb-item')\n    if(this.el === breadcrumbItems[breadcrumbItems.length-1]) { \n      this.isLastItem = true;\n    } else this.isLastItem = false;\n  }\n\n  generateUniqueId(prefix = 'id') {\n    return `${prefix}-${Math.random().toString(36).substring(2, 9)}`;\n  }\n\n  componentWillLoad() { \n    if (!this.uniqueId) {\n      this.uniqueId = this.generateUniqueId('breadcrumb-dropdown');\n    }\n    this.handleLastItem()\n  }\n\n  componentDidUpdate() {\n    this.handleLastItem()\n  }\n\n  componentWillRender() { \n    this.setHasDropdownMenuState()\n  }\n\n  setHasDropdownMenuState() { \n    const dropdownMenu = this.getIfxDropdownMenuComponent();\n    if(dropdownMenu) {\n      this.hasDropdownMenu = !!dropdownMenu;\n    }\n  }\n\n  getIfxDropdownMenuComponent() { \n    const dropdownMenu = this.el.querySelector('ifx-dropdown-menu');\n    return dropdownMenu;\n  }\n\n  componentDidLoad() { \n    const dropdownMenu = this.getIfxDropdownMenuComponent();\n\n    if(!this.hasDropdownMenu) { \n      const iconMenuWrapper = this.getMenuIconWrapper();\n      this.handleClassList(iconMenuWrapper, 'toggle', 'hide');\n    } else { \n      dropdownMenu.isOpen = true;\n    }\n  }\n\n  render() {\n    return (\n      <li class='breadcrumb-parent' aria-current={`${this.isLastItem ? 'page' : \"\"}`}>\n       <li role=\"button\" tabindex={this.hasDropdownMenu ? 0 : -1} class=\"breadcrumb-wrapper\" onClick={() => this.toggleDropdownMenu()} aria-controls={this.uniqueId} aria-haspopup=\"menu\" aria-label=\"Toggle dropdown menu\">\n          <slot name='label'/>\n          <div id={this.uniqueId} class=\"dropdown-menu\" aria-expanded={this.isDropdownMenuOpen()} aria-label=\"Dropdown menu\">\n            <slot />\n          </div>\n        </li>\n        {!this.isLastItem && <span class=\"breadcrumb-divider\" aria-hidden=\"true\">/</span>}\n      </li>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as s}from"./p-6b122987.js";const i="";const l=i;const h=class{constructor(s){e(this,s);this.ifxFilterSelect=t(this,"ifxFilterSelect",7);this.filterName=undefined;this.filterLabel=undefined;this.placeholder=undefined;this.type="text";this.options=undefined;this.filterValues=[]}handleTextInputChange(e){const t=e.target;const s=t.value;this.ifxFilterSelect.emit({filterName:this.filterName,filterValues:[s],type:this.type})}handleSingleSelectChange(e){const t=e.detail.value;this.ifxFilterSelect.emit({filterName:this.filterName,filterValues:[t],type:this.type})}handleMultiselectOptionChange(e){this.filterValues=e.detail;this.ifxFilterSelect.emit({filterName:this.filterName,filterValues:this.filterValues,type:this.type})}render(){switch(this.type){case"text":return s("ifx-text-field",{error:false,disabled:false,placeholder:this.placeholder,onIfxInput:e=>this.handleTextInputChange(e)},this.filterLabel);case"single-select":return s("ifx-select",{placeholder:"true","search-enabled":"true","search-placeholder-value":"Search...",onIfxSelect:e=>this.handleSingleSelectChange(e),"ifx-placeholder-value":this.placeholder,"ifx-label":this.filterLabel,"ifx-options":this.options});case"multi-select":return s("ifx-multiselect",{label:this.filterLabel,placeholder:this.placeholder,options:this.options,onIfxSelect:e=>this.handleMultiselectOptionChange(e)});default:return null}}};h.style=l;export{h as ifx_set_filter};
+//# sourceMappingURL=p-189c89c3.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["setFilterCss","IfxSetFilterStyle0","SetFilter","handleTextInputChange","event","target","value","this","ifxFilterSelect","emit","filterName","filterValues","type","handleSingleSelectChange","detail","handleMultiselectOptionChange","render","h","error","disabled","placeholder","onIfxInput","filterLabel","onIfxSelect","options","label"],"sources":["src/components/table-advanced-version/set-filter/set-filter.scss?tag=ifx-set-filter&encapsulation=shadow","src/components/table-advanced-version/set-filter/setFilter.tsx"],"sourcesContent":["/* set-filter.css */\n\n","// SetFilter.tsx\nimport { Component, h, Event, EventEmitter, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-set-filter',\n  styleUrl: 'set-filter.scss',\n  shadow: true\n})\nexport class SetFilter {\n  @Prop() filterName: string;\n  @Prop() filterLabel: string;\n  @Prop() placeholder: string;\n  @Prop() type: 'text' | 'single-select' | 'multi-select' = 'text';\n  @Prop() options: any[] | string;\n  @State() filterValues: string[] = [];\n\n  @Event() ifxFilterSelect: EventEmitter;\n\n\n  handleTextInputChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n    const value = target.value;\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\n\n  }\n\n  handleSingleSelectChange(event: CustomEvent) {\n    const value = event.detail.value;\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\n  }\n\n\n  handleMultiselectOptionChange(event: CustomEvent) {\n    this.filterValues = event.detail; // Assuming that ifx-multiselect emits an array of selected options\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: this.filterValues, type: this.type });\n  }\n\n\n  render() {\n    switch (this.type) {\n      case 'text':\n        return (\n          <ifx-text-field error={false} disabled={false} placeholder={this.placeholder}\n            onIfxInput={event => this.handleTextInputChange(event)}\n          >{this.filterLabel}</ifx-text-field>\n        );\n      case 'single-select':\n        return (\n          <ifx-select\n            placeholder=\"true\"\n            search-enabled=\"true\"\n            search-placeholder-value=\"Search...\"\n            onIfxSelect={event => this.handleSingleSelectChange(event)}\n            ifx-placeholder-value={this.placeholder}\n            ifx-label={this.filterLabel}\n            ifx-options={this.options}\n          ></ifx-select>\n        );\n      case 'multi-select':\n        return (\n          <ifx-multiselect\n            label={this.filterLabel}\n            placeholder={this.placeholder}\n            options={this.options}\n            onIfxSelect={event => this.handleMultiselectOptionChange(event)}\n          />\n        );\n      default:\n        return null;\n    }\n  }\n}\n\n"],"mappings":"kDAAA,MAAMA,EAAe,GACrB,MAAAC,EAAeD,E,MCOFE,EAAS,M,oKAIsC,O,yCAExB,E,CAKlC,qBAAAC,CAAsBC,GACpB,MAAMC,EAASD,EAAMC,OACrB,MAAMC,EAAQD,EAAOC,MACrBC,KAAKC,gBAAgBC,KAAK,CAAEC,WAAYH,KAAKG,WAAYC,aAAc,CAACL,GAAQM,KAAML,KAAKK,M,CAI7F,wBAAAC,CAAyBT,GACvB,MAAME,EAAQF,EAAMU,OAAOR,MAC3BC,KAAKC,gBAAgBC,KAAK,CAAEC,WAAYH,KAAKG,WAAYC,aAAc,CAACL,GAAQM,KAAML,KAAKK,M,CAI7F,6BAAAG,CAA8BX,GAC5BG,KAAKI,aAAeP,EAAMU,OAC1BP,KAAKC,gBAAgBC,KAAK,CAAEC,WAAYH,KAAKG,WAAYC,aAAcJ,KAAKI,aAAcC,KAAML,KAAKK,M,CAIvG,MAAAI,GACE,OAAQT,KAAKK,MACX,IAAK,OACH,OACEK,EAAA,kBAAgBC,MAAO,MAAOC,SAAU,MAAOC,YAAab,KAAKa,YAC/DC,WAAYjB,GAASG,KAAKJ,sBAAsBC,IAChDG,KAAKe,aAEX,IAAK,gBACH,OACEL,EAAA,cACEG,YAAY,OAAM,iBACH,OAAM,2BACI,YACzBG,YAAanB,GAASG,KAAKM,yBAAyBT,GAAM,wBACnCG,KAAKa,YAAW,YAC5Bb,KAAKe,YAAW,cACdf,KAAKiB,UAGxB,IAAK,eACH,OACEP,EAAA,mBACEQ,MAAOlB,KAAKe,YACZF,YAAab,KAAKa,YAClBI,QAASjB,KAAKiB,QACdD,YAAanB,GAASG,KAAKQ,8BAA8BX,KAG/D,QACE,OAAO,K","ignoreList":[]}