@infineon/infineon-design-system-stencil 30.10.0--canary.1690.3d3b622c5283d21417323e397dba5684776ee0fb.0 → 30.10.0--canary.1696.f6fc7149013229dfeecb984f52e464c01a339d3d.0

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

@@ -0,0 +1 @@
+{"version":3,"names":["chipCss","IfxChipStyle0","Chip","undefined","handleValueChange","newValue","this","syncSelectedOptionsWithProp","handleReadOnlyChange","opened","closeDropdownOnOutsideClick","event","path","composedPath","chipWrapper","chip","shadowRoot","querySelector","chipDropdown","includes","toggleDropdownMenu","handleKeyDown","code","preventDefault","target","tagName","handleWrapperKeyDown","handleDropdownKeyDown","updateSelectedOptions","eventDetail","detail","previousSelection","selectedOptions","variant","selected","chipItems","getChipItems","forEach","chipItem","chipState","Object","assign","emitIfxChipItemSelect","value","find","option","filter","map","emitIfxChipChange","ifxChipChange","emit","currentSelection","name","placeholder","querySelectorAll","getSelectedOptions","label","join","slice","readOnly","focusChipItemAt","index","item","length","console","error","shadowItem","setTimeout","focus","focusChip","handleUnselectButtonClick","stopPropagation","itemGotUnselected","handleWrapperClick","chipitems","targetIndex","Array","from","indexOf","syncChipState","key","size","generateKey","count","isArray","componentWillLoad","render","h","class","tabIndex","onClick","role","AriaLabel","toString","icon","e","id","chipItemCss","IfxChipItemStyle0","ChipItem","updateItemSelection","parentElement","validateSelected","oldValue","emitIfxChipItemSelectEvent","getItemLabel","innerText","toggleItemSelection","ifxChipItemSelect","handleItemClick","handleItemKeyDown","handleSelectedState","onKeyDown","checked","paginationCss","IfxPaginationStyle0","Pagination","CLASS_DISABLED","CLASS_ACTIVE","CLASS_SIBLING_ACTIVE","DATA_KEY","setItemsPerPage","itemsPerPage","parseInt","componentDidLoad","calculateVisiblePageIndices","paginationElement","el","leftArrow","navigateSinglePage","calculateNumberOfPages","isNaN","currentPage","total","totalPageNumber","Math","ceil","internalPage","numberOfPages","_","componentDidUpdate","listItems","addEventListenersToPageItems","dataset","changePage","componentWillUpdate","handleEventEmission","currActive","totalPages","prevPage","nextPage","ifxPageChange","paginationContainer","addEventListener","parent","currentTarget","initPagination","initialValue","classList","contains","closest","pagination","remove","floor","add","disabled","options","color","href"],"sources":["src/components/chip/chip.scss?tag=ifx-chip&encapsulation=shadow","src/components/chip/chip.tsx","src/components/chip/chip-item/chip-item.scss?tag=ifx-chip-item&encapsulation=shadow","src/components/chip/chip-item/chip-item.tsx","src/components/pagination/pagination.scss?tag=ifx-pagination&encapsulation=shadow","src/components/pagination/pagination.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n    display: inline-block;\n}\n\n.chip {\n    position: relative;\n}\n\n.chip__wrapper {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: tokens.$ifxSpace100;\n\n    box-sizing: border-box;\n    border: 1px solid tokens.$ifxColorEngineering300;\n    border-radius: tokens.$ifxBorderRadiusRound;\n    \n    background: tokens.$ifxColorBaseWhite;\n    \n    cursor: pointer;  \n    \n    transition: border 100ms ease;\n\n    font: tokens.$ifxBodyBody04;\n    \n    &:hover, &:focus-visible {\n        outline: none;\n        border: 1px solid tokens.$ifxColorEngineering500;\n    }\n\n    &:focus {\n        border: 1px solid tokens.$ifxColorOcean500;\n    }\n    \n    &.chip__wrapper--small {\n        padding: tokens.$ifxSpace50 tokens.$ifxSpace150;\n    }\n    \n    &.chip__wrapper--large {\n        padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n    }\n    \n    &.chip__wrapper--opened {\n        border: 1px solid tokens.$ifxColorOcean500;\n        \n        .wrapper__open-button {\n            transform: rotate(-180deg);\n        }\n    }\n    \n    &.chip__wrapper--selected {\n        outline: 3px solid tokens.$ifxColorOcean500;\n        outline-offset: -3px;\n        \n        color: tokens.$ifxColorOcean500;\n        \n        &:hover, &:focus-visible {\n            outline: 3px solid tokens.$ifxColorOcean600;\n            \n            color: tokens.$ifxColorOcean600;\n        }\n    }\n}\n\n.wrapper__label {\n    display: inline-flex;\n    align-items: center;\n    gap: tokens.$ifxSpace50;\n\n    font: tokens.$ifxBodyBody04;\n    \n    .label__selected-options {\n        font: tokens.$ifxBodyBodySemibold04;\n    }\n}\n\n.wrapper__open-button {\n    display:flex;\n    align-items: center;\n    \n    transition: all 300ms ease;\n}\n\n.wrapper__unselect-button {\n    display:flex;\n    align-items: center;\n}\n\n.chip__dropdown {\n    position: absolute;\n    z-index: 1;\n\n    box-shadow: 0px 6px 9px 0px #1D1D1D1A;\n    border: 1px solid tokens.$ifxColorEngineering200;\n    border-radius: tokens.$ifxBorderRadius12;\n    padding: tokens.$ifxSpace100 0;\n\n    min-width: 222px;\n    \n    background-color: tokens.$ifxColorBaseWhite;\n}\n","import { h, Component, Element, Event, EventEmitter, Listen, Prop, State, Watch } from '@stencil/core';\nimport { ChipItemSelectEvent } from './interfaces';\n\n@Component({\n  tag: 'ifx-chip',\n  styleUrl: 'chip.scss',\n  shadow: true\n})\nexport class Chip {\n  @Element() chip: HTMLIfxChipElement;\n\n  @Event() ifxChipChange: EventEmitter<{ previousSelection: Array<ChipItemSelectEvent>, currentSelection: Array<ChipItemSelectEvent>, name: string }>;\n  @Prop() placeholder: string = '';\n  @Prop() size: 'small' | 'large' = 'large';\n  @Prop({ mutable: true }) value: Array<string> | string = undefined;\n  @Prop() variant: 'single' | 'multi' = 'single';\n  @Prop() readOnly: boolean = false;\n  @Prop() AriaLabel: string;\n\n  @State() opened: boolean = false;\n  @State() selectedOptions: Array<ChipItemSelectEvent> = [];\n\n  @Watch('value')\n  handleValueChange(newValue: Array<string> | string) {\n    this.syncSelectedOptionsWithProp(newValue);\n  }\n\n  @Watch('readOnly')\n  handleReadOnlyChange(newValue: boolean) {\n    if (newValue) {\n      this.opened = false;\n    }\n  }\n\n  @Listen('mousedown', { target: 'document' })\n  closeDropdownOnOutsideClick(event: MouseEvent) {\n    const path = event.composedPath();\n    const chipWrapper: HTMLElement = this.chip.shadowRoot.querySelector('.chip__wrapper');\n    const chipDropdown: HTMLElement = this.chip.shadowRoot.querySelector('.chip__dropdown');\n    if (!path.includes(chipDropdown) && !path.includes(chipWrapper) && this.opened) {\n      this.toggleDropdownMenu();\n    }\n  }\n\n  @Listen('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    // override behavior of all keys except Tab. Users should be able to tab out of the component.\n    if (event.code !== 'Tab') {\n      event.preventDefault(); \n    }\n\n    if ((event.target as HTMLElement).tagName === 'IFX-CHIP') {\n      this.handleWrapperKeyDown(event);\n    } else if ((event.target as HTMLElement).tagName === 'IFX-CHIP-ITEM') {\n      this.handleDropdownKeyDown(event);\n    }\n  }\n\n  @Listen('ifxChipItemSelect')\n  updateSelectedOptions(event: CustomEvent<ChipItemSelectEvent>) {\n    const eventDetail: ChipItemSelectEvent = event.detail;\n    const previousSelection: Array<ChipItemSelectEvent> = [...this.selectedOptions];\n\n    if (this.variant !== 'multi') {\n      if (eventDetail.selected) {\n        this.opened = false;\n        const chipItems: NodeList = this.getChipItems();\n        chipItems.forEach((chipItem: HTMLIfxChipItemElement) => {\n          if (chipItem.selected && chipItem !== event.target) {\n            chipItem.chipState = {\n              ...chipItem.chipState,\n              emitIfxChipItemSelect: false,\n            };\n            chipItem.selected = false;\n          }\n        });\n        this.selectedOptions = [eventDetail];\n      } else {\n        this.selectedOptions = [];\n      }\n      this.value = this.selectedOptions[0] ? this.selectedOptions[0].value : undefined;\n    } else {\n      if (eventDetail.selected) {\n        // Prevent duplicate entries\n        if (!this.selectedOptions.find(option => option.value === eventDetail.value)) {\n          this.selectedOptions = [...this.selectedOptions, eventDetail];\n        }\n      } else {\n        this.selectedOptions = this.selectedOptions.filter((option) => option.value !== eventDetail.value);\n      }\n      this.value = this.selectedOptions.map((option) => option.value);\n    }\n\n    if (eventDetail.emitIfxChipChange) {\n      this.ifxChipChange.emit({\n        previousSelection: previousSelection,\n        currentSelection: this.selectedOptions,\n        name: this.placeholder\n      });\n    }\n  }\n\n  getChipItems(): NodeList {\n    return this.chip.querySelectorAll('ifx-chip-item');\n  }\n\n  getSelectedOptions(): string {\n    if (this.variant !== 'multi') {\n      return this.selectedOptions.map(option => option.label).join('');\n    }\n    return this.selectedOptions.slice(0, 2).map(option => option.label).join(', ');\n  }\n\n  toggleDropdownMenu() {\n    if (this.readOnly) return;\n    this.opened = !this.opened;\n  }\n\n  /**\n   * Focuses the chip item at the specified index.\n   * @param index the index of the chip item to focus. -1 will focus the last chip item.\n   */\n  focusChipItemAt(index: number = 0) {\n    this.opened = true;\n    const chipItems: NodeList = this.getChipItems();\n    let item: HTMLIfxChipItemElement;\n    \n    if (index === -1) {\n      item = chipItems.item(chipItems.length - 1) as HTMLIfxChipItemElement;\n    } else if (index >= 0 && index < chipItems.length) {\n      item = chipItems.item(index) as HTMLIfxChipItemElement;\n    } else {\n      console.error(`Invalid index: ${index}`);\n      return;\n    }\n\n    const shadowItem = item.shadowRoot.querySelector('.chip-item') as HTMLDivElement;\n    if (shadowItem) {\n      // Delay needed for the shadow item to be rendered.\n      setTimeout(() => {\n        shadowItem.focus();\n      }, 1);\n    }\n  }\n\n  focusChip() {\n    const chipWrapper: HTMLElement = this.chip.shadowRoot.querySelector('.chip__wrapper');\n    chipWrapper.focus();\n  }\n\n  handleUnselectButtonClick(event: MouseEvent) {\n    event.stopPropagation();\n    this.opened = false;\n\n    let itemGotUnselected = false;\n    const chipItems: NodeList = this.getChipItems();\n    chipItems.forEach((chipItem: HTMLIfxChipItemElement) => {\n      if (chipItem.selected) {\n        itemGotUnselected = true;\n        chipItem.chipState = {\n          ...chipItem.chipState,\n          emitIfxChipItemSelect: false,\n        }\n        chipItem.selected = false;\n      }\n    });\n\n    /* Emit event only if at least one item was unselected. */\n    if (itemGotUnselected) {\n      const previousSelection: Array<ChipItemSelectEvent> = this.selectedOptions;\n      this.selectedOptions = [];\n      this.value = [];\n      this.ifxChipChange.emit({\n        previousSelection: previousSelection,\n        currentSelection: [],\n        name: this.placeholder\n      });\n    }\n  }\n\n  handleWrapperClick() {\n    if (!this.readOnly) {\n      this.toggleDropdownMenu();\n    }\n  }\n\n  handleWrapperKeyDown(event: KeyboardEvent) {\n    // Keymap oriented at https://www.w3.org/WAI/ARIA/apg/patterns/combobox/#keyboard_interaction\n    if (this.readOnly) return;\n\n    if (!this.opened) {\n      switch (event.code) {\n        case 'Space':\n        case 'Enter':\n        case 'ArrowDown':\n          this.focusChipItemAt(0);\n          break;\n        case 'ArrowUp':\n          this.focusChipItemAt(-1);\n          break;\n      }\n    } else {\n      switch (event.code) {\n        case 'Escape':\n          this.opened = false;\n          this.focusChip();\n          break;\n      }\n    }\n  }\n\n  handleDropdownKeyDown(event: KeyboardEvent) {\n    let chipitems = this.getChipItems();\n\n    let targetIndex = Array.from(chipitems).indexOf(event.target as HTMLIfxChipItemElement);\n    if (targetIndex === -1) {\n      console.error('Target not found in chip items');\n      return;\n    }\n\n    switch (event.code) {\n      case 'ArrowDown':\n        if (targetIndex === chipitems.length - 1) break;\n        this.focusChipItemAt(targetIndex + 1);\n        break;\n      case 'ArrowUp':\n        if (targetIndex === 0) break;\n        this.focusChipItemAt( targetIndex - 1);\n        break;\n      case 'Escape':\n        this.opened = false;\n        this.focusChip();\n        break;\n      case 'Space':\n        // selection is handled by the chip-item component\n        if (this.variant === 'single') {\n          // only close dropdown if single select\n          this.opened = false;\n          this.focusChip();\n        }\n        break;\n      case 'Enter':\n        // selection is handled by the chip-item component\n        this.opened = false;\n        this.focusChip();\n        break;\n      }\n    }\n\n  syncChipState() {\n    const chipItems: NodeList = this.getChipItems();\n    let key: number = 0;\n    chipItems.forEach((chipItem: HTMLIfxChipItemElement) => {\n      chipItem.chipState = {\n        emitIfxChipItemSelect: true,\n        size: (this.size === 'small' ? 'small' : 'large'),\n        variant: (this.variant === 'multi' ? 'multi' : 'single'),\n        key: key++\n      };\n    });\n  }\n\n  syncSelectedOptionsWithProp(newValue: Array<string> | string) {\n    // Clear old selected options\n    this.selectedOptions = [];\n\n    const generateKey = (() => {\n      let count = 0;\n      return () => count++;\n    })();\n\n    if (Array.isArray(newValue)) {\n      this.selectedOptions = newValue.map(value => ({\n        value,\n        label: value,\n        selected: true,\n        key: generateKey(),\n        emitIfxChipChange: true\n      }));\n    } else if (typeof newValue === 'string') {\n      this.selectedOptions = [{\n        value: newValue,\n        label: newValue,\n        selected: true,\n        key: generateKey(),\n        emitIfxChipChange: true\n      }];\n    }\n\n    this.syncChipState();\n  }\n\n  componentWillLoad() {\n    this.syncSelectedOptionsWithProp(this.value);\n  }\n\n  render() {\n    return (\n      <div class='chip'>\n        <div class={`chip__wrapper chip__wrapper--${this.size === 'small' ? 'small' : 'large'}\n                  chip__wrapper--${this.variant === 'multi' ? 'multi' : 'single'}\n                  ${this.opened && !this.readOnly ? 'chip__wrapper--opened' : ''}\n                  ${this.selectedOptions.length ? 'chip__wrapper--selected' : ''}`}\n          tabIndex={0}\n          onClick={!this.readOnly ? () => { this.handleWrapperClick() } : undefined}\n          role='combobox'\n          aria-label={this.AriaLabel}\n          aria-value={this.getSelectedOptions()}\n          aria-haspopup={!this.readOnly ? 'listbox' : undefined}\n          aria-expanded={!this.readOnly ? this.opened.toString() : undefined}\n          aria-controls={!this.readOnly ? 'dropdown' : undefined}\n          aria-readonly={this.readOnly ? 'true' : undefined}\n          aria-multiselectable={this.variant === 'multi' ? 'true' : undefined}\n          >\n\n          <div class='wrapper__label'>\n            {\n              (this.selectedOptions.length === 0) && `${this.placeholder}`\n            }\n\n            {\n              (this.selectedOptions.length !== 0 && (this.variant === 'multi' || this.readOnly) && this.placeholder !== '') &&\n              `${this.placeholder}:`\n            }\n\n            {\n              (this.selectedOptions.length !== 0) &&\n              <div class='label__selected-options'>\n                {this.getSelectedOptions()}\n              </div>\n            }\n\n            {\n              (this.selectedOptions.length > 2 && this.variant === 'multi') &&\n              <ifx-number-indicator>  {`+${this.selectedOptions.length - 2}`} </ifx-number-indicator>\n            }\n          </div>\n\n          {\n            !this.readOnly && (this.variant !== 'multi' || (this.variant === 'multi' && this.selectedOptions.length === 0)) &&\n            <div class='wrapper__open-button'>\n              <ifx-icon key={1} icon={`chevrondown16`} />\n            </div>\n          }\n\n\n          { \n            (this.variant !== 'multi' && this.readOnly !== false && this.selectedOptions.length > 0) &&\n            <div class='wrapper__unselect-button' onClick={(e) => { this.handleUnselectButtonClick(e) }}>\n              <ifx-icon key={2} icon={`cross16`} />\n            </div>\n          }\n\n          {\n            ((this.selectedOptions.length >= 1) && this.variant === 'multi') &&\n            <div class='wrapper__unselect-button' onClick={(e) => { this.handleUnselectButtonClick(e) }}>\n              <ifx-icon key={2} icon={`cross16`} />\n            </div>\n          }\n\n        </div>\n\n        {\n          this.opened && !this.readOnly &&\n          <div id='dropdown' role='listbox' class='chip__dropdown'>\n            <slot />\n          </div>\n        }\n      </div>\n    );\n  }\n}\n","@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n.chip-item {\n    display: flex;\n    align-items: center;\n    gap: tokens.$ifxSpace100;\n    \n    padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n    \n    user-select: none;\n    \n    transition: all 100ms ease;\n    transition-property: background, color;\n    \n    &:hover {\n        cursor: pointer;\n        \n        background-color: tokens.$ifxColorEngineering200;\n    }\n    \n    &:active {\n        background-color: tokens.$ifxColorEngineering300;\n    }\n\n    &:focus {\n        outline: 2px solid tokens.$ifxColorOcean500;\n    }\n    \n    &.chip-item--large {\n        font: tokens.$ifxBodyBody03;\n    }\n    \n    &.chip-item--small {\n        font: tokens.$ifxBodyBody04;\n    }\n\n    &.chip-item--selected {\n        color: tokens.$ifxColorOcean500;\n\n        .chip-item__selected-indicator {\n            display: block;\n        }\n    }\n}\n\n.chip-item__selected-indicator {\n    display: none;\n    \n    margin-left: auto;\n}\n\n","import { h,\n    Component,\n    Element,\n    Event,\n    EventEmitter, \n    Listen,\n    Prop, \n    Watch } from '@stencil/core';\nimport { ChipItemSelectEvent, ChipState } from '../interfaces';\n\n@Component({\ntag: 'ifx-chip-item',\nstyleUrl: 'chip-item.scss',\nshadow: true\n})\n\nexport class ChipItem {\n@Element() chipItem: HTMLIfxChipItemElement;\n\n@Event({ composed: false }) ifxChipItemSelect: EventEmitter<ChipItemSelectEvent>;\n\n@Prop() value: string = undefined;\n@Prop() chipState: ChipState = { emitIfxChipItemSelect: true, variant: 'multi', size: 'large' }; \n@Prop({ mutable: true, reflect: true }) selected: boolean = false;\n\n@Listen('ifxChipItemSelect', { target: 'body' })\nupdateItemSelection(event: CustomEvent<ChipItemSelectEvent>) {\n   if (this.chipState.variant === 'single') {\n       const target = event.target as HTMLIfxChipItemElement;\n       /* Also making sure chip items are from the same group (parent) while unselecting. */\n       if (this.chipItem !== target && this.chipItem.parentElement === target.parentElement) {\n           this.selected = false;\n       }\n   }\n} \n\n@Watch('selected')\nvalidateSelected(newValue: boolean, oldValue: boolean) {\n   if (newValue !== oldValue) {\n       /* Do not emit if ChipState does not allow. */\n       if (this.chipState.emitIfxChipItemSelect){\n           this.emitIfxChipItemSelectEvent();\n       } else {\n           this.chipState.emitIfxChipItemSelect = true;\n       }\n   }\n} \n\ngetItemLabel(): string {\n   return this.chipItem.innerText as string;\n}\n\ntoggleItemSelection() {\n   this.selected = !this.selected;\n}\n   \n\nemitIfxChipItemSelectEvent(emitIfxChipChange: boolean = true) {\n   this.ifxChipItemSelect.emit({ emitIfxChipChange: emitIfxChipChange,\n                           key: this.chipState.key,\n                           label: this.getItemLabel(), \n                           selected: this.selected, \n                           value: this.value });\n}\n\nhandleItemClick() {\n   this.toggleItemSelection();\n}\n\nhandleItemKeyDown(event: KeyboardEvent) {\n   if (event.code === 'Enter' || event.code === 'Space') {\n       this.toggleItemSelection();\n   }\n}\n\nhandleSelectedState() {\n   if (this.selected) {\n       this.emitIfxChipItemSelectEvent(false);\n   }\n}\n\n\ncomponentWillLoad() {\n   /* Propogating the selected state to the Chip (Parent) component if it is set. */\n   this.handleSelectedState();\n}\n\nrender() {\n   return (\n       <div class={`chip-item chip-item--${this.chipState.size} \n                    chip-item--${(this.selected && this.chipState.variant) === 'single' ? 'selected' : ''}`} \n           tabIndex={0}\n           onClick={() => {this.handleItemClick()}}\n           onKeyDown={(e) => {this.handleItemKeyDown(e)}}\n           role=\"option\"\n           aria-selected={this.selected.toString()}>    \n           {/* Checkbox; renders only in 'multi' variant. */}\n           { \n               this.chipState.variant === 'multi' &&\n               <ifx-checkbox checked={this.selected}\n                   tabIndex={-1} \n                   size='s'>\n               </ifx-checkbox>\n           }\n\n           <div class='chip-item__label'> <slot /> </div>\n\n           {/* Selected indicator only visible in 'single' variant. */}\n           <div class='chip-item__selected-indicator'> \n               <ifx-icon icon={`check${this.chipState.size === 'small' ? '12' : '16'}`}> </ifx-icon> \n           </div>\n\n       </div>\n   );\n}\n}","@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: inline-flex;\n}\n\n.container {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  gap: 32px;\n  font-family: var(--ifx-font-family);\n\n\n  & .items__per-page-wrapper {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n\n    & .items__per-page-label {\n      color: #1D1D1D;\n      font-size: 14px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 20px;\n    }\n\n    & .items__per-page-field {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n\n      & ifx-select {\n        width: 92px;\n      }\n    }\n  }\n\n  & .items__total-wrapper {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: 12px;\n\n    & .items__total-button {\n      display: flex;\n      width: 40px;\n      height: 40px;\n      justify-content: center;\n      align-items: center;\n      border-radius: 100px;\n      border: 1px solid #BFBBBB;\n      background: #FFF;\n    }\n\n    & .page__numbers-wrapper {\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      gap: 12px;\n\n      & .page__number-item {\n        display: flex;\n        padding: 6px;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n        gap: 10px;\n        border-radius: 100px;\n\n        &.active {\n          background-color: #0A8276;\n\n          & span {\n            color: #fff;\n          }\n        }\n\n        &:hover {\n          cursor: pointer;\n        }\n\n        &:hover:not(.active) {\n          background-color: #ddd;\n\n        }\n\n        &:active:not(.active) {\n          background-color: #575352;\n        }\n\n        & span {\n          display: flex;\n          width: 16px;\n          height: 16px;\n          flex-direction: column;\n          justify-content: center;\n          color: #1D1D1D;\n          text-align: center;\n          font-size: 13px;\n          font-style: normal;\n          font-weight: 400;\n          line-height: 20px;\n        }\n      }\n    }\n  }\n}\n\n\n.pagination {\n  display: flex;\n\n  & ifx-icon-button:first-of-type {\n    margin-right: 12px;\n  }\n\n  & ifx-icon-button:last-of-type {\n    margin-left: 12px;\n  }\n}\n\na {\n  padding: 8px;\n  border-radius: 100px;\n}\n\nol {\n  list-style-type: none;\n  padding: 0;\n  margin: 0;\n  display: inline-flex;\n  align-items: center;\n  gap: 12px;\n}\n\nli {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  border-radius: 100px;\n\n  &:hover:not(.active) {\n    & a {\n      background-color: #EEEDED;\n    }\n  }\n\n  &:active:not(.active) {\n    & a {\n      background-color: #575352;\n      color: #fff;\n    }\n  }\n\n  &.active {\n    background-color: #0A8276;\n\n    & a {\n      color: #fff;\n    }\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n\n  & a {\n    text-decoration: none;\n    display: flex;\n    width: 16px;\n    height: 16px;\n    flex-direction: column;\n    justify-content: center;\n    color: #1D1D1D;\n    text-align: center;\n    font-size: 13px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 20px;\n    align-items: center;\n  }\n}\n\n.prev,\n.next {\n  &.disabled {\n    cursor: default;\n\n    &:hover {\n      cursor: default;\n      text-decoration: none;\n    }\n  }\n}\n\n.prev {\n  margin-right: 2.5px;\n}\n\n.next {\n  margin-left: 2.5px;\n}\n\n\n@mixin ellipsis($before: true) {\n  content: \"\\2026\";\n  font-size: 13px;\n  display: inline-block;\n\n  @if($before) {\n    margin-right: 6px;\n  }\n\n  @else {\n    margin-left: 6px;\n  }\n}\n\n\n// @media(max-width:460px) {\n//   li {\n\n//     &:first-child,\n//     &.active,\n//     &.active-sibling:nth-last-child(2), // Show second to last child if the last one is active\n//     &:last-child {\n//       //display: inline-block !important;\n//       display: inline-flex !important;\n//       flex-direction: row;\n//     }\n\n//     $how-many-on-ends: 3; // 1,2,3,...,10 || 1,...,8,9,10\n//     // There are >= 5 pages\n//     &:first-child:nth-last-child(n+6) {\n\n//       &~li {\n//         // Start out with all siblings hidden\n//         display: none;\n\n//         // Show the last children in the list by default\n//         &:nth-last-child(-n+#{$how-many-on-ends}) {\n//           //display: inline-block;\n//           display: inline-flex;\n//           flex-direction: row;\n\n//         }\n\n//         // The child at the beginning of the last group shows ellipsis for the group\n//         &:nth-last-child(#{$how-many-on-ends}) {\n//           &:before {\n//             @include ellipsis(true);\n//           }\n//         }\n\n//         // The very beginning elements do not need to show ellipsis\n//         // The very end elements do not need to show ellipsis\n//       }\n\n\n//       &.active,\n//        &~li.active {\n\n//          // Show ellipsis before and after the active element\n//          &:before {\n//            @include ellipsis(true);\n//          }\n//          &:after {\n//            @include ellipsis(false);\n//          }\n\n\n//          // If the active element is in the first or last group, don't show ellipsis (siblings will take care of it)\n//          &:nth-child(-n+#{$how-many-on-ends - 1}),\n//          &:nth-last-child(-n+#{$how-many-on-ends - 1}) {\n//            &:before, &:after {\n//              display: none;\n//            }\n//          }\n\n//          // Hide the last group if \"active\" comes before them\n//          &~li:nth-last-child(-n+#{$how-many-on-ends}) {\n//            display: none;\n//          }\n\n//          // Show the first group together if \"active\" comes before them\n//          &~li:nth-child(-n+#{$how-many-on-ends}) {\n//            //display: inline-block;\n//            display: inline-flex;\n//            flex-direction: row;\n//          }\n\n//          // If \"active\" is before the last member in the group, don't show ellipsis\n//          &~li:nth-child(-n+#{$how-many-on-ends - 1}) {\n//             &:after {\n//               display: none;\n//             }\n//          }\n\n\n//         // The child at the end of the first group shows ellipsis for the group\n//         &~li:nth-child(#{$how-many-on-ends}) {\n//           &:after {\n//             @include ellipsis(false);\n//           }\n//         }\n//       }\n//     }\n//   }\n// }\n\n@media (min-width: 400px) {\n  li {\n\n    &:first-child,\n    &.active-sibling,\n    &.active,\n    &.active+li,\n    &:last-child {\n      //display: inline-block!important;\n      display: inline-flex !important;\n      flex-direction: row;\n    }\n\n    // There are >= 7 pages\n    &:first-child:nth-last-child(n+8) {\n      $how-many-on-ends: 5; // 1,2,3,4,5,...,10 || 1,...6,7,8,9,10\n\n      &~li {\n        // Start out with all siblings hidden\n        display: none;\n\n        // Show ellipsis before the previous one\n        &.active-sibling:before {\n          @include ellipsis(true);\n        }\n\n        // Show ellipsis after the next one\n        &.active+li:after {\n          @include ellipsis(false);\n        }\n\n        // Show the last children in the list by default\n        &:nth-last-child(-n+#{$how-many-on-ends}) {\n          //display: inline-block;\n          display: inline-flex;\n          flex-direction: row;\n        }\n\n        // The child at the beginning of the last group shows ellipsis for the group\n        &:nth-last-child(#{$how-many-on-ends}) {\n          &:before {\n            @include ellipsis(true);\n          }\n        }\n\n        // The very beginning elements do not need to show ellipsis\n        &:nth-child(-n+#{$how-many-on-ends - 3}),\n        // The very end elements do not need to show ellipsis\n        &:nth-last-child(-n+#{$how-many-on-ends - 3}),\n        // Even if it's a sibling to \"active\"\n        &.active-sibling:nth-last-child(-n+#{$how-many-on-ends - 1}) {\n\n          &:before,\n          &:after {\n            display: none !important;\n          }\n        }\n      }\n\n      &.active,\n      &~li.active {\n\n        // Hide the last group if \"active\" comes before them\n        &~li:nth-last-child(-n+#{$how-many-on-ends}) {\n          display: none;\n\n          // If there is overlap, the element will show, but hide it's ellipsis\n          &:before {\n            display: none;\n          }\n        }\n\n        // Show the first group together if \"active\" comes before them\n        &~li:nth-child(-n+#{$how-many-on-ends}) {\n          //display: inline-block;\n          display: inline-flex !important;\n          flex-direction: row;\n        }\n\n        // If \"active\" is before the last member in the group, don't show ellipsis\n        &~li:nth-child(-n+#{$how-many-on-ends - 1}) {\n          &:after {\n            display: none;\n          }\n        }\n\n\n        // The child at the end of the first group shows ellipsis for the group\n        &~li:nth-child(#{$how-many-on-ends}) {\n          &:after {\n            @include ellipsis(false);\n          }\n        }\n\n        // \"active\" should never show ellipsis\n        &:before,\n        &:after {\n          display: none;\n        }\n      }\n    }\n  }\n}","import { Component, h, Element, Event, EventEmitter, Prop, State, Listen } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-pagination',\n  styleUrl: 'pagination.scss',\n  shadow: true\n})\nexport class Pagination {\n  @Element() el;\n  @Event() ifxPageChange: EventEmitter;\n  @Event() ifxNextPage: EventEmitter;\n  @Event() ifxPrevPage: EventEmitter;\n  @Prop() currentPage: number = 0;\n  @State() internalPage: number = 1;\n  @State() itemsPerPage: number = 10;\n  @State() numberOfPages: number[] = [];\n  @Prop() total: number = 1;\n\n  private CLASS_DISABLED = \"disabled\"\n  private CLASS_ACTIVE = \"active\"\n  private CLASS_SIBLING_ACTIVE = \"active-sibling\"\n  private DATA_KEY = \"pagination\";\n\n  @Listen('ifxSelect')\n  setItemsPerPage(e) {\n    if(e.detail) {\n      this.itemsPerPage = parseInt(e.detail.label)\n    } else { \n      this.itemsPerPage = 10;\n    }\n  }\n\n  componentDidLoad() {\n    this.calculateVisiblePageIndices()\n    var paginationElement = this.el.shadowRoot.querySelector(\".pagination\");\n    let leftArrow = paginationElement.querySelector('.prev')\n    this.navigateSinglePage(leftArrow, true)\n\n  }\n\n  calculateNumberOfPages() {\n    if (isNaN(this.currentPage)) {\n      this.currentPage = 1;\n    }\n    const total = this.total <= this.itemsPerPage ? this.itemsPerPage : this.total;\n    const itemsPerPage = this.itemsPerPage;\n    const totalPageNumber = Math.ceil(total / itemsPerPage);\n\n    if (this.currentPage <= 0) {\n      this.internalPage = 1;\n    } else if (this.currentPage > totalPageNumber) {\n      this.internalPage = totalPageNumber;\n    } else this.internalPage = this.currentPage;\n\n    this.numberOfPages = Array.from({ length: totalPageNumber }, (_, index) => index + 1);\n  }\n\n  componentWillLoad() {\n    this.calculateNumberOfPages()\n  }\n\n  componentDidUpdate() {\n    var paginationElement = this.el.shadowRoot.querySelector(\".pagination\");\n    var listItems = paginationElement.querySelectorAll(\"li\");\n    this.addEventListenersToPageItems(listItems, paginationElement)\n\n    if (paginationElement.dataset[this.DATA_KEY] < this.numberOfPages) {\n      paginationElement.dataset[this.DATA_KEY] = paginationElement.dataset[this.DATA_KEY];\n    } else paginationElement.dataset[this.DATA_KEY] = 0;\n\n    this.changePage(paginationElement, false)\n  }\n\n  componentWillUpdate() {\n    this.calculateNumberOfPages()\n  }\n\n  handleEventEmission(currActive) {\n    let currentPage = currActive + 1;\n    let totalPages = this.numberOfPages.length;\n    let prevPage = currActive === 0 ? null : currActive;\n    let nextPage = currActive + 2 > totalPages ? null : currActive + 2;\n    let itemsPerPage = this.itemsPerPage\n    this.ifxPageChange.emit({ currentPage, totalPages, prevPage, nextPage, itemsPerPage })\n  }\n\n  addEventListenersToPageItems(listItems, paginationContainer) {\n    listItems.forEach((item) => {\n      item.addEventListener(\"click\", (e) => {\n        var parent = paginationContainer;\n        let listItems = parent.querySelectorAll(\"li\");\n        parent.dataset[this.DATA_KEY] = Array.from(listItems).indexOf(e.currentTarget)\n        this.changePage(parent, false)\n      });\n    });\n  }\n\n  initPagination(paginationContainer) {\n    var listItems = paginationContainer.querySelectorAll(\"li\");\n\n    paginationContainer.dataset[this.DATA_KEY] = Array.from(listItems).indexOf(paginationContainer.querySelector(\".active\"));\n\n    paginationContainer.querySelector(\".prev\").addEventListener(\"click\", (e) => this.navigateSinglePage(e, false));\n    paginationContainer.querySelector(\".next\").addEventListener(\"click\", (e) => this.navigateSinglePage(e, false));\n\n    this.addEventListenersToPageItems(listItems, paginationContainer)\n  }\n\n  navigateSinglePage(e, initialValue) {\n    let el = e;\n    if (typeof e.target === 'object') {\n      el = e.target\n    }\n\n    if (!el.classList.contains(this.CLASS_DISABLED)) {\n      var parent = el.closest(\".pagination\");\n      var currActive = parseInt(parent.dataset[this.DATA_KEY], 10);\n      currActive += 1 * (el.classList.contains(\"prev\") ? -1 : 1);\n\n      if (currActive === -1) {\n        currActive = 0;\n      }\n\n      parent.dataset[this.DATA_KEY] = currActive;\n      this.changePage(parent, initialValue)\n    }\n  }\n\n  changePage(pagination, initialValue) {\n    const paginationContainer = pagination;\n    var listItems = paginationContainer.querySelectorAll(\"li\");\n    var currActive = parseInt(paginationContainer.dataset[this.DATA_KEY], 10);\n\n    listItems.forEach((item) => {\n      item.classList.remove(this.CLASS_ACTIVE);\n      item.classList.remove(this.CLASS_SIBLING_ACTIVE);\n    });\n\n    if (initialValue && this.internalPage > 1) {\n      currActive = Math.floor(this.internalPage - 1);\n      paginationContainer.dataset[this.DATA_KEY] = currActive;\n    }\n\n    this.handleEventEmission(currActive)\n\n    listItems[currActive].classList.add(this.CLASS_ACTIVE);\n\n    if (currActive === 0) {\n      paginationContainer.querySelector(\".prev\").classList.add(this.CLASS_DISABLED);\n      paginationContainer.querySelector(\".prev\").disabled = true;\n\n    } else {\n      listItems[currActive - 1].classList.add(this.CLASS_SIBLING_ACTIVE);\n      paginationContainer.querySelector(\".prev\").classList.remove(this.CLASS_DISABLED);\n      paginationContainer.querySelector(\".prev\").disabled = false;\n    }\n\n    if (currActive === (listItems.length - 1)) {\n      paginationContainer.querySelector(\".next\").classList.add(this.CLASS_DISABLED);\n      paginationContainer.querySelector(\".next\").disabled = true;\n\n    } else {\n      paginationContainer.querySelector(\".next\").classList.remove(this.CLASS_DISABLED);\n      paginationContainer.querySelector(\".next\").disabled = false;\n    }\n  }\n\n  calculateVisiblePageIndices() {\n    var paginationElement = this.el.shadowRoot.querySelector(\".pagination\");\n    this.initPagination(paginationElement)\n  }\n\n  render() {\n    return (\n      <div aria-label='a pagination' aria-value={this.currentPage} class=\"container\">\n        <div class='items__per-page-wrapper'>\n          <div class='items__per-page-label'>Results per Page</div>\n          <div class='items__per-page-field'>\n            <ifx-select\n              value='undefined'\n              size='s'\n              placeholder='false'\n              show-search='false'\n              search-placeholder-value='Search...'\n              disabled={false}\n              error={false}\n              error-message='Error'\n              label=''\n              placeholder-value='Placeholder'\n              options='[{\"value\":\"ten\",\"label\":\"10\",\"selected\":true}, {\"value\":\"Twenty\",\"label\":\"20\",\"selected\":false}, {\"value\":\"Thirty\",\"label\":\"30\",\"selected\":false}]' >\n            </ifx-select>\n          </div>\n        </div>\n        <div class='items__total-wrapper'>\n          <div class='page__numbers-wrapper'>\n            <div class=\"pagination\">\n              <ifx-icon-button variant='secondary' class=\"prev\" color='primary' icon='arrow-left-24'></ifx-icon-button>\n              <ol>\n                {this.numberOfPages.map((item) =>\n                  <li class={`${this.internalPage === item ? 'active' : \"\"}`}><a href={undefined}>{item}</a></li>)}\n              </ol>\n              <ifx-icon-button class=\"next\" variant='secondary' color='primary' icon='arrow-right-24'></ifx-icon-button>\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }\n}"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as e,c as i,h as t,g as s}from"./p-6b122987.js";function a(e){return Array.from(e.querySelectorAll("ifx-list-entry")).filter((e=>e.getAttribute("value")==="true")).map((e=>({label:e.getAttribute("label"),value:e.getAttribute("value"),type:e.getAttribute("type")})))}const n=".header{display:flex;align-items:flex-start;align-self:stretch;cursor:pointer;border-left:3px solid transparent}.text-and-icon{display:flex;padding:12px 16px 12px 20px;align-items:center;gap:16px;flex:1 0 0}.header.expanded{border-left:3px solid #0A8276}.text{display:flex;align-items:center;gap:8px;flex:1 0 0;color:#1D1D1D;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.hidden{display:none}.accordion{border-bottom:1px solid #EEEDED}.filter-accordion-container{display:flex;padding:8px 16px 16px 20px;flex-direction:column;align-items:flex-start;gap:12px;align-self:stretch;border-left:3px solid #0A8276}::slotted(ifx-filter-entry:nth-child(n+7)){display:none}.link{display:flex;align-items:center;gap:8px}.show-more ::slotted(ifx-filter-entry:nth-child(n+7)){display:block}.show-more .show-more-link{display:none}";const d=n;const c=class{constructor(t){e(this,t);this.ifxFilterAccordionChange=i(this,"ifxFilterAccordionChange",7);this.initialized=false;this.handleCheckedChange=e=>{const i=e.detail.selectedItems;this.count=i.length;this.ifxFilterAccordionChange.emit({filterGroupName:this.filterGroupName,selectedItems:i})};this.toggleAccordion=e=>{e.stopPropagation();this.expanded=!this.expanded};this.expanded=false;this.maxVisibleItems=undefined;this.count=0;this.totalItems=0;this.filterGroupName=""}componentWillLoad(){this.el.addEventListener("ifxListUpdate",this.handleCheckedChange)}componentDidLoad(){if(!this.initialized){const e=a(this.el);this.count=e.length;this.initialized=true}}componentWillUnload(){this.el.removeEventListener("ifxListUpdate",this.handleCheckedChange)}render(){return t("div",{key:"b5be6a4c8e2b8406e20b4139461d75d1acc5e88c",class:`accordion ${this.expanded?"expanded":""}`},t("div",{key:"88ce1afb0ab07d2b3b1351d698632d24521f6870",class:`header ${this.expanded?"expanded":""}`,onClick:this.toggleAccordion},t("div",{key:"2c850d5b01d985473ba69ca347fbfcfa076670b5",class:`text-and-icon ${this.expanded?"expanded":""}`},t("div",{key:"b50240640314ca9d971f1db017d8f2bf4fae5cc1",class:"text"},t("span",{key:"12a6ef3c45f33540669af8dc60f2d8c104e07953"},this.filterGroupName),t("ifx-number-indicator",{key:"049ecf530b429920f6f977e240de3913fbd0c013"},this.count)),t("ifx-icon",{key:"fee323359acf051fb4bd0040c0eb1bea7a9696fe",class:this.expanded?"":"hidden",icon:"minus-16",onClick:this.toggleAccordion}),t("ifx-icon",{key:"f7b60e6232b404bc5f4345dd9db80e513c4a6dcd",class:this.expanded?"hidden":"",icon:"plus-16",onClick:this.toggleAccordion}))),this.expanded&&t("div",{key:"f802a7ec2ff47ecf22b3f69ec5b4adbcdb599522",class:"filter-accordion-container"},t("slot",{key:"5877962924effa0e52163d9ec5a2d436ac8a3ac7",name:"list"})))}get el(){return s(this)}};c.style=d;export{c as ifx_filter_accordion};
+//# sourceMappingURL=p-42c07031.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["getInitiallySelectedItems","el","Array","from","querySelectorAll","filter","entry","getAttribute","map","label","value","type","filterAccordionCss","IfxFilterAccordionStyle0","FilterAccordion","this","initialized","handleCheckedChange","event","selectedItems","detail","count","length","ifxFilterAccordionChange","emit","filterGroupName","toggleAccordion","stopPropagation","expanded","componentWillLoad","addEventListener","componentDidLoad","componentWillUnload","removeEventListener","render","h","key","class","onClick","icon","name"],"sources":["src/components/table-advanced-version/filter-type-group/utils.ts","src/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.scss?tag=ifx-filter-accordion&encapsulation=shadow","src/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.tsx"],"sourcesContent":["// utils.ts\nexport function getInitiallySelectedItems(el: HTMLElement) {\n   return Array.from(el.querySelectorAll('ifx-list-entry'))\n\n    .filter(entry => entry.getAttribute('value') === 'true')\n    .map(entry => {\n      return {\n        label: entry.getAttribute('label'),\n        value: entry.getAttribute('value'),\n        type: entry.getAttribute('type')\n      };\n    });\n}","@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n\n.header {\n  display: flex;\n  align-items: flex-start;\n  align-self: stretch;\n  cursor: pointer;\n  border-left: 3px solid transparent;\n}\n\n.text-and-icon {\n  display: flex;\n  padding: tokens.$ifxSpace150 tokens.$ifxSpace200 tokens.$ifxSpace150 tokens.$ifxSpace250;\n  align-items: center;\n  gap: tokens.$ifxSpace200;\n  flex: 1 0 0;\n}\n\n.header.expanded {\n  border-left: 3px solid tokens.$ifxColorOcean500;\n}\n\n.text {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex: 1 0 0;\n  color: tokens.$ifxColorBaseBlack;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 24px;\n}\n\n.hidden {\n  display: none;\n}\n\n.accordion {\n  border-bottom: 1px solid tokens.$ifxColorEngineering200;\n}\n\n\n.filter-accordion-container {\n  display: flex;\n  padding: 8px 16px 16px 20px;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 12px;\n  align-self: stretch;\n  border-left: 3px solid tokens.$ifxColorOcean500;\n}\n\n::slotted(ifx-filter-entry:nth-child(n+7)) {\n  display: none;\n}\n\n.link {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.show-more ::slotted(ifx-filter-entry:nth-child(n+7)) {\n  display: block;\n}\n\n.show-more .show-more-link {\n  display: none;\n}","import { Component, h, Prop, State, Event, EventEmitter, Element } from '@stencil/core';\nimport { getInitiallySelectedItems } from '../utils';\n\n@Component({\n  tag: 'ifx-filter-accordion',\n  styleUrl: 'filter-accordion.scss',\n  shadow: true,\n})\nexport class FilterAccordion {\n  private initialized = false;\n  @Element() private el: HTMLElement;\n  @State() expanded: boolean = false;\n  @Prop() maxVisibleItems: number;\n  @State() count: number = 0;\n  @State() totalItems = 0;\n\n  @Prop() filterGroupName = \"\";\n\n  @Event() ifxFilterAccordionChange: EventEmitter;\n\n  componentWillLoad() {\n    this.el.addEventListener('ifxListUpdate', this.handleCheckedChange);\n\n  }\n\ncomponentDidLoad() {\n  if (!this.initialized) {\n    const selectedItems = getInitiallySelectedItems(this.el);\n    this.count = selectedItems.length;\n    this.initialized = true; // Prevent further execution in future calls\n  }\n}\n\n\nhandleCheckedChange = (event: CustomEvent) => {\n    const selectedItems = event.detail.selectedItems;\n    this.count = selectedItems.length;\n    this.ifxFilterAccordionChange.emit({ filterGroupName: this.filterGroupName, selectedItems });\n  }\n\n  componentWillUnload() {\n    this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);\n  }\n\n  toggleAccordion = (event: MouseEvent) => {\n    event.stopPropagation();\n    this.expanded = !this.expanded;\n  }\n\n  render() {\n    return (\n      <div class={`accordion ${this.expanded ? 'expanded' : ''}`}>\n        <div class={`header ${this.expanded ? 'expanded' : ''}`} onClick={this.toggleAccordion} >\n          <div class={`text-and-icon ${this.expanded ? 'expanded' : ''}`}>\n            <div class=\"text\">\n              <span>{this.filterGroupName}</span>\n              <ifx-number-indicator>{this.count}</ifx-number-indicator>\n            </div>\n            <ifx-icon\n              class={this.expanded ? '' : 'hidden'}\n              icon=\"minus-16\"\n              onClick={this.toggleAccordion}\n            ></ifx-icon>\n            <ifx-icon\n              class={this.expanded ? 'hidden' : ''}\n              icon=\"plus-16\"\n              onClick={this.toggleAccordion}\n            ></ifx-icon>\n          </div>\n        </div>\n        {this.expanded &&\n          <div class=\"filter-accordion-container\">\n            <slot name=\"list\"></slot>\n          </div>\n        }\n      </div>\n    );\n  }\n}"],"mappings":"kEACgBA,EAA0BC,GACvC,OAAOC,MAAMC,KAAKF,EAAGG,iBAAiB,mBAEpCC,QAAOC,GAASA,EAAMC,aAAa,WAAa,SAChDC,KAAIF,IACI,CACLG,MAAOH,EAAMC,aAAa,SAC1BG,MAAOJ,EAAMC,aAAa,SAC1BI,KAAML,EAAMC,aAAa,WAGjC,CCZA,MAAMK,EAAqB,u0BAC3B,MAAAC,EAAeD,E,MCOFE,EAAe,M,4FAClBC,KAAAC,YAAc,MAyBxBD,KAAAE,oBAAuBC,IACnB,MAAMC,EAAgBD,EAAME,OAAOD,cACnCJ,KAAKM,MAAQF,EAAcG,OAC3BP,KAAKQ,yBAAyBC,KAAK,CAAEC,gBAAiBV,KAAKU,gBAAiBN,iBAAgB,EAO9FJ,KAAAW,gBAAmBR,IACjBA,EAAMS,kBACNZ,KAAKa,UAAYb,KAAKa,QAAQ,E,cAnCH,M,0CAEJ,E,gBACH,E,qBAEI,E,CAI1B,iBAAAC,GACEd,KAAKd,GAAG6B,iBAAiB,gBAAiBf,KAAKE,oB,CAInD,gBAAAc,GACE,IAAKhB,KAAKC,YAAa,CACrB,MAAMG,EAAgBnB,EAA0Be,KAAKd,IACrDc,KAAKM,MAAQF,EAAcG,OAC3BP,KAAKC,YAAc,I,EAWrB,mBAAAgB,GACEjB,KAAKd,GAAGgC,oBAAoB,gBAAiBlB,KAAKE,oB,CAQpD,MAAAiB,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,aAAatB,KAAKa,SAAW,WAAa,MACpDO,EAAA,OAAAC,IAAA,2CAAKC,MAAO,UAAUtB,KAAKa,SAAW,WAAa,KAAMU,QAASvB,KAAKW,iBACrES,EAAA,OAAAC,IAAA,2CAAKC,MAAO,iBAAiBtB,KAAKa,SAAW,WAAa,MACxDO,EAAA,OAAAC,IAAA,2CAAKC,MAAM,QACTF,EAAA,QAAAC,IAAA,4CAAOrB,KAAKU,iBACZU,EAAA,wBAAAC,IAAA,4CAAuBrB,KAAKM,QAE9Bc,EAAA,YAAAC,IAAA,2CACEC,MAAOtB,KAAKa,SAAW,GAAK,SAC5BW,KAAK,WACLD,QAASvB,KAAKW,kBAEhBS,EAAA,YAAAC,IAAA,2CACEC,MAAOtB,KAAKa,SAAW,SAAW,GAClCW,KAAK,UACLD,QAASvB,KAAKW,oBAInBX,KAAKa,UACJO,EAAA,OAAAC,IAAA,2CAAKC,MAAM,8BACTF,EAAA,QAAAC,IAAA,2CAAMI,KAAK,U","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as t,c as s,h as i,g as e}from"./p-6b122987.js";const h=".link-wrapper{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:8px}";const r=h;const n=class{constructor(i){t(this,i);this.ifxListUpdate=s(this,"ifxListUpdate",7);this.handleMutation=()=>{const t=this.getTotalItems();if(t!==this.totalItems){this.totalItems=t;this.handleCheckedChange()}this.updateListEntriesType(this.type)};this.toggleList=t=>{t.stopPropagation();this.expanded=!this.expanded};this.toggleShowMore=t=>{t.stopPropagation();this.showMore=!this.showMore};this.handleCheckedChange=t=>{if(t&&t.detail.type==="radio-button"&&t.detail.value){const s=Array.from(this.el.querySelectorAll("ifx-list-entry")).filter((s=>s.getAttribute("type")==="radio-button"&&s!==t.target));s.forEach((t=>t.setAttribute("value","false")))}const s=this.getSelectedItems(this.el);this.selectedCount=s.length;this.ifxListUpdate.emit({name:this.name,selectedItems:s})};this.expanded=false;this.showMore=false;this.selectedCount=0;this.totalItems=0;this.name="";this.maxVisibleItems=6;this.type="checkbox";this.resetTrigger=undefined;this.internalResetTrigger=false}handleTypeChange(t){this.updateListEntriesType(t)}resetTriggerChanged(t){if(t){this.reset();this.resetTrigger=false}}componentWillLoad(){this.setupListenersAndObservers();this.initializeList()}disconnectedCallback(){this.cleanupListenersAndObservers()}reset(){this.resetListEntries();this.expanded=false;this.showMore=false;this.selectedCount=0;this.ifxListUpdate.emit({name:this.name,selectedItems:[]})}render(){return this.renderList()}setupListenersAndObservers(){this.el.addEventListener("ifxListEntryChange",this.handleCheckedChange);this.observer=new MutationObserver(this.handleMutation);this.observer.observe(this.el,{childList:true})}cleanupListenersAndObservers(){this.el.removeEventListener("ifxListEntryChange",this.handleCheckedChange);this.observer.disconnect()}initializeList(){this.selectedCount=this.getSelectedItems(this.el).length;this.totalItems=this.getTotalItems();this.updateListEntriesType(this.type);this.checkRadioButtonConstraint()}updateListEntriesType(t){const s=Array.from(this.el.querySelectorAll("ifx-list-entry"));s.forEach((s=>s.setAttribute("type",t)))}resetListEntries(){const t=Array.from(this.el.querySelectorAll("ifx-list-entry"));t.forEach((t=>{t.value=false;t.setAttribute("value","false")}))}checkRadioButtonConstraint(){if(this.type==="radio-button"&&this.selectedCount>1){this.resetListEntries();this.selectedCount=0}}getTotalItems(){return this.el.querySelectorAll("ifx-list-entry").length}getSelectedItems(t){return Array.from(t.querySelectorAll("ifx-list-entry")).filter((t=>t.getAttribute("value")==="true")).map((t=>({label:t.getAttribute("label"),value:t.getAttribute("value"),type:t.getAttribute("type"),element:t})))}renderList(){const t=Array.from(this.el.querySelectorAll("ifx-list-entry"));const s=this.showMore?t:t.slice(0,this.maxVisibleItems);const e=t.length-s.length;return i("div",{class:"list-wrapper"},s.map((t=>i("slot",{name:t.getAttribute("slot")}))),(e>0||this.showMore)&&i("div",{class:"link-wrapper",onClick:this.toggleShowMore},i("ifx-icon",{key:this.showMore.toString(),icon:this.showMore?"chevron-up-12":"chevron-down-12"}),i("ifx-link",{size:"s",href:"",target:"_blank",variant:"underlined",disabled:false},this.showMore?"Show less":`Show ${e} more`)))}get el(){return e(this)}static get watchers(){return{type:["handleTypeChange"],resetTrigger:["resetTriggerChanged"]}}};n.style=r;export{n as ifx_list};
+//# sourceMappingURL=p-466fea81.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["listCss","IfxListStyle0","List","this","handleMutation","newTotalItems","getTotalItems","totalItems","handleCheckedChange","updateListEntriesType","type","toggleList","event","stopPropagation","expanded","toggleShowMore","showMore","detail","value","otherRadioButtons","Array","from","el","querySelectorAll","filter","entry","getAttribute","target","forEach","radioButton","setAttribute","selectedItems","getSelectedItems","selectedCount","length","ifxListUpdate","emit","name","handleTypeChange","newType","resetTriggerChanged","newValue","reset","resetTrigger","componentWillLoad","setupListenersAndObservers","initializeList","disconnectedCallback","cleanupListenersAndObservers","resetListEntries","render","renderList","addEventListener","observer","MutationObserver","observe","childList","removeEventListener","disconnect","checkRadioButtonConstraint","listEntries","map","label","element","visibleItems","slice","maxVisibleItems","remainingItems","h","class","onClick","key","toString","icon","size","href","variant","disabled"],"sources":["src/components/table-advanced-version/list/list.scss?tag=ifx-list&encapsulation=shadow","src/components/table-advanced-version/list/list.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.link-wrapper {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: tokens.$ifxSpace100;\n  margin-top: tokens.$ifxSpace100;\n}","import { Component, h, Prop, State, Event, EventEmitter, Element, Watch } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-list',\n  styleUrl: 'list.scss',\n  shadow: true,\n})\nexport class List {\n  @Element() private el: HTMLElement;\n  @State() expanded: boolean = false;\n  @State() showMore = false;\n  @State() selectedCount: number = 0;\n  @State() totalItems = 0;\n  @Prop() name = \"\";\n  @Prop() maxVisibleItems = 6;\n  @Prop() type: string = \"checkbox\"; //default value\n  @Prop({ mutable: true }) resetTrigger: boolean;\n  @State() internalResetTrigger: boolean = false;\n\n  @Event() ifxListUpdate: EventEmitter;\n\n  observer: MutationObserver;\n\n  @Watch('type')\n  handleTypeChange(newType: string) {\n    this.updateListEntriesType(newType);\n  }\n\n  @Watch('resetTrigger')\n  resetTriggerChanged(newValue: boolean) {\n    if (newValue) {\n      this.reset();\n      this.resetTrigger = false; // Resetting the trigger after the action is performed\n    }\n  }\n\n  componentWillLoad() {\n    this.setupListenersAndObservers();\n    this.initializeList();\n  }\n\n  disconnectedCallback() {\n    this.cleanupListenersAndObservers();\n  }\n\n  reset() {\n    this.resetListEntries();\n    this.expanded = false;\n    this.showMore = false;\n    this.selectedCount = 0;\n    this.ifxListUpdate.emit({ name: this.name, selectedItems: [] });\n  }\n\n\n  render() {\n    return this.renderList();\n  }\n\n\n    // Refactored methods for clarity and maintainability\n    private setupListenersAndObservers() {\n      this.el.addEventListener('ifxListEntryChange', this.handleCheckedChange);\n      this.observer = new MutationObserver(this.handleMutation);\n      this.observer.observe(this.el, { childList: true });\n    }\n\n    private cleanupListenersAndObservers() {\n      this.el.removeEventListener('ifxListEntryChange', this.handleCheckedChange);\n      this.observer.disconnect();\n    }\n  \n    private initializeList() {\n      this.selectedCount = this.getSelectedItems(this.el).length;\n      this.totalItems = this.getTotalItems();\n      this.updateListEntriesType(this.type);\n      this.checkRadioButtonConstraint();\n    }\n\n    \n  private updateListEntriesType(newType: string) {\n    const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n    listEntries.forEach(entry => entry.setAttribute('type', newType));\n  }\n\n  private resetListEntries() {\n    const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n    listEntries.forEach(entry => {\n      entry.value = false;\n      entry.setAttribute('value', 'false');\n    });\n  }\n\n  private handleMutation = () => {\n    const newTotalItems = this.getTotalItems();\n    if (newTotalItems !== this.totalItems) {\n      this.totalItems = newTotalItems;\n      this.handleCheckedChange();\n    }\n    this.updateListEntriesType(this.type);\n  }\n\n  private checkRadioButtonConstraint() {\n    if (this.type === 'radio-button' && this.selectedCount > 1) {\n      this.resetListEntries(); // Reset all and let the user select again\n      this.selectedCount = 0;\n    }\n  }\n\n  getTotalItems() {\n    return this.el.querySelectorAll('ifx-list-entry').length;\n  }\n\n\n  toggleList = (event: MouseEvent) => {\n    event.stopPropagation();\n    this.expanded = !this.expanded;\n  }\n\n  toggleShowMore = (event: MouseEvent) => {\n    event.stopPropagation();\n    this.showMore = !this.showMore;\n  }\n\n  getSelectedItems(el: HTMLElement) {\n    return Array.from(el.querySelectorAll('ifx-list-entry'))\n      .filter(entry => entry.getAttribute('value') === 'true')\n      .map(entry => ({\n        label: entry.getAttribute('label'),\n        value: entry.getAttribute('value'),\n        type: entry.getAttribute('type'),\n        element: entry\n      }));\n  }\n\n\n  handleCheckedChange = (event?: CustomEvent) => {\n    // If the type of the changed entry is 'radio-button' and its value is true, deselect all other radio buttons\n    if (event && event.detail.type === 'radio-button' && event.detail.value) {\n      const otherRadioButtons = Array.from(this.el.querySelectorAll('ifx-list-entry'))\n        .filter(entry => entry.getAttribute('type') === 'radio-button' && entry !== event.target);\n      otherRadioButtons.forEach(radioButton => radioButton.setAttribute('value', 'false'));\n    }\n\n    const selectedItems = this.getSelectedItems(this.el);\n    this.selectedCount = selectedItems.length;\n\n    this.ifxListUpdate.emit({ name: this.name, selectedItems });\n  }\n\n  private renderList() {\n    const listEntries = Array.from(this.el.querySelectorAll('ifx-list-entry'));\n    const visibleItems = this.showMore ? listEntries : listEntries.slice(0, this.maxVisibleItems);\n    const remainingItems = listEntries.length - visibleItems.length;\n\n    return (\n      <div class=\"list-wrapper\">\n        {visibleItems.map(entry => <slot name={entry.getAttribute('slot')}></slot>)}\n        {(remainingItems > 0 || this.showMore) && (\n          <div class=\"link-wrapper\" onClick={this.toggleShowMore}>\n            <ifx-icon key={this.showMore.toString()} icon={this.showMore ? 'chevron-up-12' : 'chevron-down-12'} />\n            <ifx-link size=\"s\" href=\"\" target=\"_blank\" variant=\"underlined\" disabled={false} >\n              {this.showMore ? 'Show less' : `Show ${remainingItems} more`}\n            </ifx-link>\n          </div>\n        )}\n      </div>\n    );\n  }\n}"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-095df841.entry.js → p-4b21c0e6.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as o,a as t}from"./p-c63974da.js";const r='.ifx-content-switcher-item{all:unset;height:36px;box-sizing:border-box;border-radius:9999px;border:3px solid transparent;padding:7px 20px;font-family:"Source Sans 3";font-weight:600;font-size:14px;line-height:20px;display:flex;justify-content:center;align-items:center;gap:8px;background-color:transparent}.ifx-content-switcher-item.selected{color:#0A8276;background-color:#FFFFFF;border:3px solid #0A8276}.ifx-content-switcher-item:hover{color:#08665C;background-color:#FFFFFF;border:3px solid #08665C;cursor:pointer}.ifx-content-switcher-item:active{color:#08665C;background-color:#FFFFFF;border:3px solid #06534B}.ifx-content-switcher-item:focus{color:#08665C;background-color:#FFFFFF;border:3px solid #08665C}';const c=r;const i=class{constructor(o){e(this,o);this.selected=false}render(){return o(t,{key:"99244cbfde12465c294ba0ce760731ba6e88c8db"},o("button",{key:"76e0009bcd1dc452964c03cb10e851321467cec2",class:"ifx-content-switcher-item"+(this.selected?" selected":"")},o("slot",{key:"987a09faed55d3066f1b80740cdbf6b7de571496"})))}};i.style=c;export{i as ifx_content_switcher_item};
-//# sourceMappingURL=p-095df841.entry.js.map
+import{r as e,h as t,a as o}from"./p-6b122987.js";const r='.ifx-content-switcher-item{all:unset;height:36px;box-sizing:border-box;border-radius:9999px;border:3px solid transparent;padding:7px 20px;font-family:"Source Sans 3";font-weight:600;font-size:14px;line-height:20px;display:flex;justify-content:center;align-items:center;gap:8px;background-color:transparent}.ifx-content-switcher-item.selected{color:#0A8276;background-color:#FFFFFF;border:3px solid #0A8276}.ifx-content-switcher-item:hover{color:#08665C;background-color:#FFFFFF;border:3px solid #08665C;cursor:pointer}.ifx-content-switcher-item:active{color:#08665C;background-color:#FFFFFF;border:3px solid #06534B}.ifx-content-switcher-item:focus{color:#08665C;background-color:#FFFFFF;border:3px solid #08665C}';const c=r;const i=class{constructor(t){e(this,t);this.selected=false;this.value=undefined}render(){return t(o,{key:"99244cbfde12465c294ba0ce760731ba6e88c8db"},t("button",{key:"76e0009bcd1dc452964c03cb10e851321467cec2",class:"ifx-content-switcher-item"+(this.selected?" selected":"")},t("slot",{key:"987a09faed55d3066f1b80740cdbf6b7de571496"})))}};i.style=c;export{i as ifx_content_switcher_item};
+//# sourceMappingURL=p-4b21c0e6.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["contentSwitcherItemCss","IfxContentSwitcherItemStyle0","ContentSwitcherItem","render","h","Host","key","class","this","selected"],"sources":["src/components/content-switcher/content-switcher-item.scss?tag=ifx-content-switcher-item&encapsulation=shadow","src/components/content-switcher/content-switcher-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.ifx-content-switcher-item {\n    all: unset;\n\n    height: tokens.$ifxSize450;\n    box-sizing: border-box;\n    border-radius: tokens.$ifxBorderRadiusRound;\n    border: 3px solid transparent; // avoid jumping around\n    padding: 7px tokens.$ifxSize250;\n\n    font-family: tokens.$ifxFontFamilyBody;\n    font-weight: tokens.$ifxFontWeightSemibold;\n    font-size: tokens.$ifxSize175;\n    line-height: 20px;\n\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: tokens.$ifxSpace100;\n    background-color: transparent;\n\n    &.selected {\n        color: tokens.$ifxColorOcean500;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 3px solid tokens.$ifxColorOcean500;\n    }\n\n    &:hover {\n        color: tokens.$ifxColorOcean600;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 3px solid tokens.$ifxColorOcean600;\n        cursor: pointer;\n    }\n\n    &:active {\n        color: tokens.$ifxColorOcean600;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 3px solid tokens.$ifxColorOcean700;\n    }\n\n    &:focus {\n        color: tokens.$ifxColorOcean600;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 3px solid tokens.$ifxColorOcean600;\n    }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-content-switcher-item',\n  styleUrl: './content-switcher-item.scss',\n  shadow: true,\n})\nexport class ContentSwitcherItem {\n  @Prop() selected: boolean = false;\n  @Prop() value: string;\n\n  render() {\n    return (\n      <Host>\n        <button class={'ifx-content-switcher-item' + (this.selected ? ' selected' : '')}>\n          <slot></slot>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAyB,4sBAC/B,MAAAC,EAAeD,E,MCMFE,EAAmB,M,uCACF,M,qBAG5B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,UAAAE,IAAA,2CAAQC,MAAO,6BAA+BC,KAAKC,SAAW,YAAc,KAC1EL,EAAA,QAAAE,IAAA,8C","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as e,c as i,h as t,g as a}from"./p-6b122987.js";const s=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{position:relative}.sidebar__nav-item:focus,.sidebar__nav-item.header__section:focus{outline:none}.sidebar__nav-item:focus .sidebar__nav-item-icon-wrapper,.sidebar__nav-item.header__section:focus .sidebar__nav-item-icon-wrapper{color:#08665C}.sidebar__nav-item:focus .sidebar__nav-item-label,.sidebar__nav-item.header__section:focus .sidebar__nav-item-label{outline:none;color:#08665C}.sidebar__nav-item:focus .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon,.sidebar__nav-item.header__section:focus .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{color:#08665C}.sidebar__nav-item:hover,.sidebar__nav-item.header__section:hover{outline:none}.sidebar__nav-item:hover .sidebar__nav-item-icon-wrapper,.sidebar__nav-item.header__section:hover .sidebar__nav-item-icon-wrapper{color:#08665C}.sidebar__nav-item:hover .sidebar__nav-item-label,.sidebar__nav-item.header__section:hover .sidebar__nav-item-label{outline:none;color:#08665C}.sidebar__nav-item:hover .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon,.sidebar__nav-item.header__section:hover .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{color:#08665C}.sidebar__nav-item{display:flex;flex-direction:row;align-items:center;width:100%;padding:8px 0px;gap:4px;flex:none;order:0;flex-grow:0;text-decoration:none;color:#1D1D1D;cursor:pointer;font-family:var(--ifx-font-family)}.sidebar__nav-item.extra-padding__bottom{padding:8px 0px 16px 0px}.sidebar__nav-item.active{color:#0A8276}.sidebar__nav-item.active-section::before{content:"";position:absolute;left:-32px;height:40px;width:2px;background:#0A8276}.sidebar__nav-item.open{padding:8px 0px}.sidebar__nav-item.open .sidebar__nav-item-label{font-size:16px;font-style:normal;font-weight:400;line-height:24px}.sidebar__nav-item.open .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{transform:rotate(-180deg)}.sidebar__nav-item.header__section{box-sizing:padding-box;border-top:1px solid #EEEDED;padding:16px 0px;display:-webkit-flex;-webkit-line-clamp:1;-webkit-box-orient:horizontal;overflow:hidden;text-overflow:ellipsis}.sidebar__nav-item.header__section.no-top-border{border-top:none}.sidebar__nav-item.header__section.active-section::before{content:"";position:absolute;left:-32px;height:40px;width:2px;background:#0A8276}.sidebar__nav-item.header__section.open{padding:16px 0px 8px 0px}.sidebar__nav-item.header__section.open .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{transform:rotate(-180deg)}.sidebar__nav-item.header__section .sidebar__nav-item-label{color:#1D1D1D;font-family:Source Sans 3;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.sidebar__nav-item.submenu__item{padding:4px 0px}.sidebar__nav-item.submenu__item.extra-padding__bottom{padding:4px 0px 16px 0px}.sidebar__nav-item .sidebar__nav-item-icon-wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;gap:8px;flex-shrink:0}.sidebar__nav-item .sidebar__nav-item-icon-wrapper.noIcon{display:none}.sidebar__nav-item .sidebar__nav-item-icon-wrapper ifx-icon{width:16px;height:16px}.sidebar__nav-item .sidebar__nav-item-label{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;display:flex;align-items:center;flex:none;order:1;flex-grow:1;cursor:pointer}.sidebar__nav-item .sidebar__nav-item-indicator{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px 4px;flex:none;order:2;flex-grow:0}.expandable__submenu{display:none;list-style-type:none;flex-direction:column;padding:0;margin:0;padding-left:40px}.expandable__submenu.open{display:flex}.header__section+.expandable__submenu{padding-left:0}';const n=s;const r=class{constructor(t){e(this,t);this.ifxSidebarMenu=i(this,"ifxSidebarMenu",7);this.ifxSidebarNavigationItem=i(this,"ifxSidebarNavigationItem",7);this.ifxSidebarActionItem=i(this,"ifxSidebarActionItem",7);this.icon="";this.hasIcon=true;this.hasIconWrapper=false;this.href="";this.internalHref="";this.target="_self";this.isExpandable=false;this.isNested=true;this.isSubMenuItem=false;this.numberIndicator=undefined;this.active=false;this.isActionItem=false;this.internalActiveState=false;this.value="";this.handleItemClick=undefined}handleActiveChange(e,i){if(this.isActionItem){this.internalActiveState=false;return}this.internalActiveState=e;if(e!==i){let i=this.getNavItem(this.el.shadowRoot);if(!this.isExpandable&&!e){this.handleClassList(i,"remove","active")}if(!this.isExpandable&&e){this.handleClassList(i,"add","active")}}}handleConsoleError(e){if(e.detail){this.hasIcon=false}else{this.hasIcon=true}}handleEventEmission(){this.ifxSidebarMenu.emit(this.el)}handleClassList(e,i,t){e.classList[i](t);if(i==="contains"){return e.classList.contains(t)}}getExpandableMenu(){const e=this.el.shadowRoot.querySelector(".expandable__submenu");return e}getNavItem(e){return e===null||e===void 0?void 0:e.querySelector(".sidebar__nav-item")}getSidebarMenuItems(e=this.el){const i=e.querySelectorAll("ifx-sidebar-item");if(i.length===0){return e.shadowRoot.querySelectorAll("ifx-sidebar-item")}return i}getSidebarMenuItem(){const e=this.el.shadowRoot.querySelector(".sidebar__nav-item");return e}toggleSubmenu(){if(this.isExpandable){const e=this.getSidebarMenuItem();const i=this.getExpandableMenu();this.handleClassList(i,"toggle","open");this.handleClassList(e,"toggle","open");this.handleEventEmission()}else{if(this.isActionItem){this.ifxSidebarActionItem.emit(this.el);return}else{this.handleActiveChange(true,this.internalActiveState);this.ifxSidebarNavigationItem.emit(this.el)}if(this.handleItemClick){this.handleItemClick(this.el)}}}handleExpandableMenu(e){const i=this.getExpandableMenu();e.forEach((e=>{const t=document.createElement("li");t.appendChild(e);i.appendChild(t)}))}parentElementIsSidebar(){const e=this.el.parentElement;if(e.tagName.toUpperCase()==="IFX-SIDEBAR"){return true}else return false}checkIfMenuItemIsNested(){const e=this.parentElementIsSidebar();if(e){this.isNested=false}}checkIfMenuItemIsSubMenu(){const e=this.el.parentElement;const i=this.getNavItem(e.shadowRoot);if(e.tagName.toUpperCase()==="IFX-SIDEBAR-ITEM"&&!this.handleClassList(i,"contains","header__section")){this.isSubMenuItem=true}else{this.isSubMenuItem=false}}isActive(e){const i=e.getAttribute("active");const t=i==="true";return t}getParentSection(e){let i=e.parentElement;while(i&&i.tagName.toUpperCase()!=="IFX-SIDEBAR"){if(i.tagName.toUpperCase()==="IFX-SIDEBAR-ITEM"){return i}i=i.parentElement}return null}handleBorderIndicatorDisplacement(e){const i=(e,t)=>{const a=this.isActive(e);if(a){const e=this.handleClassList(t,"contains","open");const i=this.getActiveItemSection();if(!e){this.handleClassList(i,"add","active-section")}else{this.handleClassList(i,"remove","active-section")}}const s=this.getSidebarMenuItems(e);s.forEach((e=>i(e,t)))};const t=this.getSidebarMenuItems();t.forEach((t=>i(t,e)))}setHref(){if(this.href.toLowerCase().trim()===""){this.internalHref=undefined}else this.internalHref=this.href}getActiveItemSection(){const e=this.parentElementIsSidebar();if(e){const e=this.getNavItem(this.el.shadowRoot);return e}else{const e=this.getNavItem(this.el.shadowRoot);return e}}async setActiveClasses(){const e=this.getNavItem(this.el.shadowRoot);this.handleClassList(e,"add","active")}async expandMenu(e){const i=this.getSidebarMenuItem();const t=this.getExpandableMenu();this.handleClassList(t,"add","open");this.handleClassList(i,"add","open");if(e){this.handleClassList(t,"remove","active-section");this.handleClassList(i,"remove","active-section")}}async isItemExpandable(){return this.isExpandable}handleActiveState(){if(this.internalActiveState){this.setActiveClasses()}}handleKeyDown(e){if(e.key==="Enter"){this.toggleSubmenu()}}componentDidLoad(){this.handleActiveState();if(this.isExpandable){const e=this.getSidebarMenuItems();this.handleExpandableMenu(e)}}componentWillLoad(){this.internalActiveState=this.active;this.checkIfMenuItemIsNested();this.checkIfMenuItemIsSubMenu();this.setHref();const e=this.getSidebarMenuItems();if(e.length!==0){this.isExpandable=true}else{this.isExpandable=false}}componentWillUpdate(){if(this.active&&!this.internalActiveState){this.internalActiveState=this.active;this.ifxSidebarNavigationItem.emit(this.el)}}render(){var e,i;return t("div",{key:"bcce093f08956b787324175d4a1b93d84140a4c1"},t("a",{key:"1d41b50b01283468055a21c3103652796687e8f1",tabIndex:1,onKeyDown:e=>this.handleKeyDown(e),href:this.internalHref,onClick:()=>this.toggleSubmenu(),target:this.target,class:`sidebar__nav-item ${!this.isNested&&this.isExpandable?"header__section":""} ${this.isSubMenuItem?"submenu__item":""}`},this.icon&&t("div",{key:"cd3557255c8a72b1ae6f0b7f72f0ef21e6ae0fe8",class:`sidebar__nav-item-icon-wrapper ${!this.hasIcon?"noIcon":""}`},t("ifx-icon",{key:"5069aedfa130d4398ca95edda5aacd9b43e52469",icon:this.icon})),t("div",{key:"480bf51599b9a0531abdba0a4641550123219df1",class:"sidebar__nav-item-label"},t("slot",{key:"b56681b0a818d042b76d5bee7d05c4f0d7a9913e"})),(this.isExpandable||((e=this.numberIndicator)===null||e===void 0?void 0:e.trim()))&&t("div",{key:"3127324a7b69eaaafe8637cf5d90a80e4a3723fb",class:"sidebar__nav-item-indicator"},this.isExpandable&&t("span",{key:"91749e9a94235f95b9de7b2cddc92051e36bb6a1",class:"item__arrow-wrapper"},t("ifx-icon",{key:"c69e378b057299216c36b8167d4f8dff8ec019bb",icon:"chevron-down-12"})),((i=this.numberIndicator)===null||i===void 0?void 0:i.trim())&&!this.isExpandable&&!this.isNested&&t("span",{key:"adf4b61fd8832214d7a1b348a60d7acedcf30538",class:"item__number-indicator"},t("ifx-number-indicator",{key:"d51224084ea102e12b498f1e3369c2d2c569f2fc"},this.numberIndicator)))),this.isExpandable&&t("ul",{key:"c3f08c8d6cc8f825592aebe79aaa3c9fe83ea1e0",class:"expandable__submenu"}))}get el(){return a(this)}static get watchers(){return{active:["handleActiveChange"]}}};r.style=n;export{r as ifx_sidebar_item};
+//# sourceMappingURL=p-4b84fbcf.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["sidebarItemCss","IfxSidebarItemStyle0","SidebarItem","handleActiveChange","newValue","oldValue","this","isActionItem","internalActiveState","labelElement","getNavItem","el","shadowRoot","isExpandable","handleClassList","handleConsoleError","event","detail","hasIcon","handleEventEmission","ifxSidebarMenu","emit","type","className","classList","contains","getExpandableMenu","expandableSubmenu","querySelector","getSidebarMenuItems","sidebarItems","querySelectorAll","length","getSidebarMenuItem","sidebarItem","toggleSubmenu","menuItem","expandableMenu","ifxSidebarActionItem","ifxSidebarNavigationItem","handleItemClick","handleExpandableMenu","sidebarExpandableMenu","forEach","li","document","createElement","appendChild","parentElementIsSidebar","parentElement","tagName","toUpperCase","checkIfMenuItemIsNested","parentIsSidebar","isNested","checkIfMenuItemIsSubMenu","navItem","isSubMenuItem","isActive","iteratedComponent","activeAttributeValue","getAttribute","getParentSection","handleBorderIndicatorDisplacement","handleItem","item","isOpen","activeMenuItemSection","getActiveItemSection","children","child","topLevelItems","setHref","href","toLowerCase","trim","internalHref","undefined","setActiveClasses","activeMenuItem","expandMenu","ac","isItemExpandable","handleActiveState","handleKeyDown","key","componentDidLoad","componentWillLoad","active","componentWillUpdate","render","h","tabIndex","onKeyDown","onClick","target","class","icon","_a","numberIndicator","_b"],"sources":["src/components/navigation/sidebar/sidebar-item.scss?tag=ifx-sidebar-item&encapsulation=shadow","src/components/navigation/sidebar/sidebar-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n:host {\n  position: relative;\n}\n\n.sidebar__nav-item,\n.sidebar__nav-item.header__section {\n  &:focus {\n    outline: none;\n\n    & .sidebar__nav-item-icon-wrapper {\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-label {\n      outline: none;\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          color: tokens.$ifxColorOcean600;\n        }\n      }\n    }\n  }\n\n  &:hover {\n    outline: none;\n\n    & .sidebar__nav-item-icon-wrapper {\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-label {\n      outline: none;\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          color: tokens.$ifxColorOcean600;\n        }\n      }\n    }\n  }\n}\n\n.sidebar__nav-item {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n  padding: 8px 0px;\n  gap: 4px;\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n  text-decoration: none;\n  color: tokens.$ifxColorBaseBlack;\n  cursor: pointer;\n  font-family: var(--ifx-font-family);\n\n  &.extra-padding__bottom {\n    padding: 8px 0px 16px 0px;\n  }\n\n  &.active {\n    color: tokens.$ifxColorOcean500;\n  }\n\n  &.active-section {\n    &::before {\n      content: \"\";\n      position: absolute;\n      left: -32px;\n      height: 40px;\n      width: 2px;\n      background: tokens.$ifxColorOcean500;\n    }\n  }\n\n\n  &.open {\n    padding: 8px 0px;\n\n    & .sidebar__nav-item-label {\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 24px;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          transform: rotate(-180deg);\n        }\n      }\n    }\n  }\n\n  &.header__section {\n    box-sizing: padding-box;\n    border-top: 1px solid tokens.$ifxColorEngineering200;\n    padding: 16px 0px;\n    display: -webkit-flex;\n    -webkit-line-clamp: 1;\n    -webkit-box-orient: horizontal;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    \n    &.no-top-border {\n      border-top: none;\n    }\n\n    &.active-section {\n      &::before {\n        content: \"\";\n        position: absolute;\n        left: -32px;\n        height: 40px;\n        width: 2px;\n        background: tokens.$ifxColorOcean500;\n      }\n    }\n\n    &.open {\n      \n      padding: 16px 0px 8px 0px;\n\n      & .sidebar__nav-item-indicator {\n        & .item__arrow-wrapper {\n          & ifx-icon {\n            transform: rotate(-180deg);\n          }\n        }\n      }\n    }\n\n    & .sidebar__nav-item-label {\n      color: tokens.$ifxColorBaseBlack;\n      font-family: Source Sans 3;\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 24px;\n    }\n  }\n\n  &.submenu__item {\n    padding: 4px 0px;\n    \n    &.extra-padding__bottom {\n      padding: 4px 0px 16px 0px;\n    }\n  }\n\n  & .sidebar__nav-item-icon-wrapper {\n    display: flex;\n    width: tokens.$ifxSize300;\n    height: tokens.$ifxSize300;\n    justify-content: center;\n    align-items: center;\n    gap: tokens.$ifxSpace100;\n    flex-shrink: 0;\n\n    &.noIcon {\n      display: none;\n    }\n\n    & ifx-icon {\n      width: tokens.$ifxSize200;\n      height: tokens.$ifxSize200;\n    }\n  }\n\n  & .sidebar__nav-item-label {\n    font-style: normal;\n    font-weight: 400;\n    font-size: tokens.$ifxFontSizeM;\n    line-height: tokens.$ifxLineHeightM;\n    display: flex;\n    align-items: center;\n    flex: none;\n    order: 1;\n    flex-grow: 1;\n    cursor: pointer;\n  }\n\n  & .sidebar__nav-item-indicator {\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    padding: 0px 4px;\n    flex: none;\n    order: 2;\n    flex-grow: 0;\n  }\n}\n\n.expandable__submenu {\n  display: none;\n  list-style-type: none;\n  flex-direction: column;\n  padding: 0;\n  margin: 0;\n  padding-left: 40px;\n\n  &.open {\n    display: flex;\n  }\n}\n\n.header__section + .expandable__submenu{\n  padding-left: 0;\n}\n","import { Component, h, Prop, Element, State, Listen, Watch, Event, EventEmitter, Method } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-sidebar-item',\n  styleUrl: 'sidebar-item.scss',\n  shadow: true\n})\nexport class SidebarItem {\n  @Element() el;\n  @Prop() icon: string = \"\"\n  @State() hasIcon: boolean = true;\n  @State() hasIconWrapper: boolean = false;\n  @Prop() href: string = \"\";\n  @State() internalHref: string = \"\";\n  @Prop() target: string = \"_self\";\n  @State() isExpandable: boolean = false;\n  @State() isNested: boolean = true;\n  @State() isSubMenuItem: boolean = false;\n  @Prop() numberIndicator: string;\n  @Prop() active: boolean = false; // set to true manually or by clicking on a navigation item\n  @Prop() isActionItem: boolean = false; // if an item is an action item, it can not become active\n\n  @State() internalActiveState: boolean = false;\n\n  @Event({ bubbles: true, composed: true }) ifxSidebarMenu: EventEmitter;\n  @Event({ bubbles: true, composed: true }) ifxSidebarNavigationItem: EventEmitter;\n  @Event({ bubbles: true, composed: true }) ifxSidebarActionItem: EventEmitter;\n\n\n  @Prop() value: string = \"\"\n  @Prop() handleItemClick: (item: HTMLElement) => void;\n\n\n  @Watch('active')\n  handleActiveChange(newValue: boolean, oldValue: boolean) {\n    // If the item is an action item, ignore the active prop\n    if (this.isActionItem) {\n      this.internalActiveState = false;\n      return;\n    }\n    this.internalActiveState = newValue;\n    if (newValue !== oldValue) {\n      let labelElement = this.getNavItem(this.el.shadowRoot)\n      if (!this.isExpandable && !newValue) {\n        this.handleClassList(labelElement, 'remove', 'active');\n      }\n      if (!this.isExpandable && newValue) {\n        this.handleClassList(labelElement, 'add', 'active');\n      }\n    }\n  }\n\n\n\n  @Listen('consoleError')\n  handleConsoleError(event: CustomEvent<boolean>) {\n    if (event.detail) {\n      this.hasIcon = false;\n    } else {\n      this.hasIcon = true;\n    }\n  }\n\n  handleEventEmission() {\n    // Get the active item section\n    this.ifxSidebarMenu.emit(this.el)\n  }\n\n  handleClassList(el, type, className) {\n    el.classList[type](className)\n    if (type === 'contains') {\n      return el.classList.contains(className)\n    }\n  }\n\n  getExpandableMenu() {\n    const expandableSubmenu = this.el.shadowRoot.querySelector('.expandable__submenu')\n    return expandableSubmenu\n  }\n\n  getNavItem(el) {\n    return el?.querySelector('.sidebar__nav-item')\n  }\n\n\n\n  getSidebarMenuItems(el = this.el) {\n    const sidebarItems = el.querySelectorAll('ifx-sidebar-item');\n    if (sidebarItems.length === 0) {\n      return el.shadowRoot.querySelectorAll('ifx-sidebar-item');\n    }\n    return sidebarItems;\n  }\n\n  getSidebarMenuItem() {\n    const sidebarItem = this.el.shadowRoot.querySelector('.sidebar__nav-item')\n    return sidebarItem;\n  }\n\n\n  toggleSubmenu() {\n    if (this.isExpandable) {\n      const menuItem = this.getSidebarMenuItem();\n      const expandableMenu = this.getExpandableMenu();\n      this.handleClassList(expandableMenu, 'toggle', 'open');\n      this.handleClassList(menuItem, 'toggle', 'open');\n      // Emit an event with the current component\n      this.handleEventEmission();\n    } else {\n      // If the sidebar item is not expandable, it's a leaf item without a submenu.\n      // Emit an event to the parent `ifx-sidebar` component to notify it that a leaf item has been clicked.\n      if (this.isActionItem) { //its an action item that eg opens an overlay etc and should not influence the active state of the item\n        this.ifxSidebarActionItem.emit(this.el); // emit new event if isActionItem is true\n        return;\n      } else { //its a navigation item which becomes active after clicking it\n        this.handleActiveChange(true, this.internalActiveState)\n        this.ifxSidebarNavigationItem.emit(this.el);\n      }\n      // If the sidebar item is selectable (not expandable), then call the handler function with the current element.\n      if (this.handleItemClick) {\n        this.handleItemClick(this.el);\n      }\n    }\n    // // Emit an event with the current component\n    // this.handleEventEmission();\n  }\n\n\n\n  handleExpandableMenu(sidebarItems) {\n    const sidebarExpandableMenu = this.getExpandableMenu();\n    sidebarItems.forEach((el: HTMLElement) => {\n      const li = document.createElement('li')\n      li.appendChild(el)\n      sidebarExpandableMenu.appendChild(li)\n    })\n  }\n\n  parentElementIsSidebar() {\n    const parentElement = this.el.parentElement;\n    if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR') {\n      return true;\n    } else return false;\n  }\n\n  checkIfMenuItemIsNested() {\n    const parentIsSidebar = this.parentElementIsSidebar()\n    if (parentIsSidebar) {\n      this.isNested = false;\n    }\n  }\n\n  checkIfMenuItemIsSubMenu() {\n    const parentElement = this.el.parentElement;\n    const navItem = this.getNavItem(parentElement.shadowRoot);\n    if(parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM' && !this.handleClassList(navItem, 'contains', 'header__section')) {\n      this.isSubMenuItem = true;\n    }else {\n      this.isSubMenuItem = false;\n    }\n  }\n\n  isActive(iteratedComponent) {\n    const activeAttributeValue = iteratedComponent.getAttribute('active');\n    const isActive = activeAttributeValue === 'true';\n    return isActive\n  }\n\n  getParentSection(el: HTMLElement) {\n    let parentElement = el.parentElement;\n\n    while (parentElement && parentElement.tagName.toUpperCase() !== 'IFX-SIDEBAR') {\n      if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM') {\n        return parentElement;\n      }\n      parentElement = parentElement.parentElement;\n    }\n\n    return null;\n  }\n\n\n\n  handleBorderIndicatorDisplacement(menuItem) {\n    // Recursive function to handle each item\n    const handleItem = (item, menuItem) => {\n      const isActive = this.isActive(item);\n      if (isActive) {\n        const isOpen = this.handleClassList(menuItem, 'contains', 'open');\n        const activeMenuItemSection = this.getActiveItemSection();\n        if (!isOpen) {\n          this.handleClassList(activeMenuItemSection, 'add', 'active-section');\n        } else {\n          this.handleClassList(activeMenuItemSection, 'remove', 'active-section');\n        }\n      }\n\n      // Process each child item\n      const children = this.getSidebarMenuItems(item);\n      children.forEach((child) => handleItem(child, menuItem));\n    }\n\n    // Start with the top-level items\n    const topLevelItems = this.getSidebarMenuItems();\n    topLevelItems.forEach((item) => handleItem(item, menuItem));\n  }\n\n\n  setHref() {\n    if (this.href.toLowerCase().trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  getActiveItemSection() {\n    const parentIsSidebar = this.parentElementIsSidebar()\n    if (parentIsSidebar) {\n      const labelElement = this.getNavItem(this.el.shadowRoot)\n      return labelElement;\n    } else {\n      const labelElement = this.getNavItem(this.el.shadowRoot)\n      return labelElement;\n    }\n  }\n\n  @Method()\n  async setActiveClasses() {\n    const activeMenuItem = this.getNavItem(this.el.shadowRoot)\n    this.handleClassList(activeMenuItem, 'add', 'active')\n  }\n\n  @Method()\n  async expandMenu(ac: boolean){\n      const menuItem = this.getSidebarMenuItem();\n      const expandableMenu = this.getExpandableMenu();\n      this.handleClassList(expandableMenu, 'add', 'open');\n      this.handleClassList(menuItem, 'add', 'open');\n      if(ac){\n        this.handleClassList(expandableMenu, 'remove', 'active-section')\n        this.handleClassList(menuItem, 'remove', 'active-section')\n      }\n  }\n  \n  @Method()\n  async isItemExpandable(){\n    return this.isExpandable;\n  }\n\n  handleActiveState() {\n    if (this.internalActiveState) {\n      this.setActiveClasses()\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter') {\n      this.toggleSubmenu()\n    }\n  }\n\n  componentDidLoad() {\n    this.handleActiveState();\n    if (this.isExpandable) {\n      const sidebarItems = this.getSidebarMenuItems();\n      this.handleExpandableMenu(sidebarItems)\n    }\n  }\n  \n  componentWillLoad() {\n    this.internalActiveState = this.active;\n    this.checkIfMenuItemIsNested();\n    this.checkIfMenuItemIsSubMenu();\n    this.setHref()\n    const sidebarItems = this.getSidebarMenuItems();\n    if (sidebarItems.length !== 0) {\n      this.isExpandable = true;\n    } else {\n      this.isExpandable = false;\n    }\n  }\n\n  componentWillUpdate() {\n    // If the active prop has been set to true and the internalActiveState has not been set to true yet\n    if (this.active && !this.internalActiveState) {\n      // Set the internal active state to true\n      this.internalActiveState = this.active;\n\n      // Emit the event to notify the parent Sidebar\n      this.ifxSidebarNavigationItem.emit(this.el);\n    }\n  }\n\n\n  render() {\n    return (\n      <div>\n        <a tabIndex={1} onKeyDown={(event) => this.handleKeyDown(event)} href={this.internalHref} onClick={() => this.toggleSubmenu()} target={this.target} class={`sidebar__nav-item ${!this.isNested && this.isExpandable ? 'header__section' : \"\"} ${this.isSubMenuItem ? 'submenu__item' : \"\"}`}>\n          {this.icon &&\n            <div class={`sidebar__nav-item-icon-wrapper ${!this.hasIcon ? 'noIcon' : \"\"}`}>\n              <ifx-icon icon={this.icon}></ifx-icon>\n            </div>}\n          <div class=\"sidebar__nav-item-label\">\n            <slot />\n          </div>\n          {\n          (this.isExpandable || this.numberIndicator?.trim()) && \n            <div class=\"sidebar__nav-item-indicator\">\n              {this.isExpandable &&\n                <span class='item__arrow-wrapper'>\n                  <ifx-icon icon=\"chevron-down-12\" />\n                </span>\n              }\n\n              {this.numberIndicator?.trim() && !this.isExpandable && !this.isNested &&\n                <span class='item__number-indicator'>\n                  <ifx-number-indicator>{this.numberIndicator}</ifx-number-indicator>\n                </span>}\n\n            </div>\n          }\n        </a>\n        {this.isExpandable && <ul class='expandable__submenu'></ul>}\n\n      </div>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as t,c as s,h as e,g as i}from"./p-6b122987.js";const a=":host{display:block}";const n=a;const o=class{constructor(e){t(this,e);this.tabHeaderChange=s(this,"tabHeaderChange",7);this.header=undefined;this.disabled=undefined;this.icon="";this.iconPosition="left"}componentWillUpdate(){this.tabHeaderChange.emit(this.header)}render(){return e("slot",{key:"845e795d2a758c1612b8601ea2eafab0385f02dc"})}get el(){return i(this)}};o.style=n;export{o as ifx_tab};
+//# sourceMappingURL=p-4be9914a.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["tabCss","IfxTabStyle0","IfxTab","componentWillUpdate","this","tabHeaderChange","emit","header","render","h","key"],"sources":["src/components/tabs/tab.scss?tag=ifx-tab","src/components/tabs/tab.tsx"],"sourcesContent":[":host {\n  display: block;\n}","import { Component, h, Element, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-tab',\n  styleUrl: 'tab.scss',\n  shadow: false\n})\nexport class IfxTab {\n  @Element() el: HTMLElement;\n  @Prop() header: string;\n  @Prop() disabled: boolean;\n  @Prop() icon: string = '';\n  @Prop() iconPosition: 'left' | 'right' = 'left';\n  @Event() tabHeaderChange: EventEmitter;\n\n  componentWillUpdate() { \n    this.tabHeaderChange.emit(this.header)\n  }\n\n  render() {\n    return <slot />;\n  }\n}"],"mappings":"yDAAA,MAAMA,EAAS,uBACf,MAAAC,EAAeD,E,MCMFE,EAAM,M,kIAIM,G,kBACkB,M,CAGzC,mBAAAC,GACEC,KAAKC,gBAAgBC,KAAKF,KAAKG,O,CAGjC,MAAAC,GACE,OAAOC,EAAA,QAAAC,IAAA,4C","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-11580775.entry.js → p-51980b19.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as a}from"./p-c63974da.js";const i=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.badge__container{display:inline-flex;justify-content:center;align-items:center;padding:4px 8px;gap:8px;border:1px solid #EEEDED;background-color:#EEEDED;border-radius:100px;font-family:var(--ifx-font-family);font-size:0.875rem;line-height:1.25rem;font-weight:400;color:#1D1D1D}';const n=i;const o=class{constructor(a){e(this,a)}render(){return a("div",{key:"eaa5be7836515fc284e17ed7fb6acfdcc6ce11f1",class:"badge__container"},a("slot",{key:"f00f0415cb6cdfa25ce8e7b0df798f8a98eb2373"}))}};o.style=n;export{o as ifx_badge};
-//# sourceMappingURL=p-11580775.entry.js.map
+import{r as e,h as i}from"./p-6b122987.js";const n=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.badge__container{display:inline-flex;justify-content:center;align-items:center;padding:4px 8px;gap:8px;border:1px solid #EEEDED;background-color:#EEEDED;border-radius:100px;font-family:var(--ifx-font-family);font-size:0.875rem;line-height:1.25rem;font-weight:400;color:#1D1D1D}';const o=n;const a=class{constructor(i){e(this,i)}render(){return i("div",{key:"eaa5be7836515fc284e17ed7fb6acfdcc6ce11f1",class:"badge__container"},i("slot",{key:"f00f0415cb6cdfa25ce8e7b0df798f8a98eb2373"}))}};a.style=o;export{a as ifx_badge};
+//# sourceMappingURL=p-51980b19.entry.js.map

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

@@ -0,0 +1,2 @@
+import{r as i,c as t,h as s}from"./p-6b122987.js";const e=".card-image{width:100%;height:100%;vertical-align:bottom;object-fit:cover}";const o=e;const n=class{constructor(s){i(this,s);this.imgPosition=t(this,"imgPosition",7);this.src=undefined;this.alt=undefined;this.position=undefined}handlePosition(i){this.imgPosition.emit(i)}componentWillLoad(){this.handlePosition(this.position)}componentDidUpdate(){this.handlePosition(this.position)}render(){return s("img",{key:"e08992cdb9c62e7b4f98d58d39457702233ee300",src:this.src,alt:this.alt,class:"card-image"})}};n.style=o;export{n as ifx_card_image};
+//# sourceMappingURL=p-51c4e760.entry.js.map

package/dist/infineon-design-system-stencil/{p-4baf201d.entry.js.map → p-51c4e760.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["cardImageCss","IfxCardImageStyle0","CardImage","handlePosition","position","this","imgPosition","emit","componentWillLoad","componentDidUpdate","render","h","key","src","alt","class"],"sources":["src/components/card/card-image/card-image.scss?tag=ifx-card-image&encapsulation=shadow","src/components/card/card-image/card-image.tsx"],"sourcesContent":[".card-image {\n  width: 100%;\n  height: 100%;\n  vertical-align: bottom;\n  object-fit: cover;\n}","import { Component, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-card-image',\n  styleUrl: 'card-image.scss',\n  shadow: true,\n})\n\nexport class CardImage {\n  @Prop() src: string;\n  @Prop() alt: string;\n  @Prop() position: string;\n  @Event() imgPosition: EventEmitter;\n\n  handlePosition(position) {\n    this.imgPosition.emit(position)\n  }\n\n  componentWillLoad() {\n    this.handlePosition(this.position)\n  }\n\n  componentDidUpdate() {\n    this.handlePosition(this.position)\n  }\n\n  render() {\n    return (\n      <img src={this.src} alt={this.alt} class=\"card-image\" />\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAe,6EACrB,MAAAC,EAAeD,E,MCOFE,EAAS,M,kEAMpB,cAAAC,CAAeC,GACbC,KAAKC,YAAYC,KAAKH,E,CAGxB,iBAAAI,GACEH,KAAKF,eAAeE,KAAKD,S,CAG3B,kBAAAK,GACEJ,KAAKF,eAAeE,KAAKD,S,CAG3B,MAAAM,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,IAAKR,KAAKQ,IAAKC,IAAKT,KAAKS,IAAKC,MAAM,c","ignoreList":[]}
+{"version":3,"names":["cardImageCss","IfxCardImageStyle0","CardImage","handlePosition","position","this","imgPosition","emit","componentWillLoad","componentDidUpdate","render","h","key","src","alt","class"],"sources":["src/components/card/card-image/card-image.scss?tag=ifx-card-image&encapsulation=shadow","src/components/card/card-image/card-image.tsx"],"sourcesContent":[".card-image {\n  width: 100%;\n  height: 100%;\n  vertical-align: bottom;\n  object-fit: cover;\n}","import { Component, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-card-image',\n  styleUrl: 'card-image.scss',\n  shadow: true,\n})\n\nexport class CardImage {\n  @Prop() src: string;\n  @Prop() alt: string;\n  @Prop() position: string;\n  @Event() imgPosition: EventEmitter;\n\n  handlePosition(position) {\n    this.imgPosition.emit(position)\n  }\n\n  componentWillLoad() {\n    this.handlePosition(this.position)\n  }\n\n  componentDidUpdate() {\n    this.handlePosition(this.position)\n  }\n\n  render() {\n    return (\n      <img src={this.src} alt={this.alt} class=\"card-image\" />\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAe,6EACrB,MAAAC,EAAeD,E,MCOFE,EAAS,M,gIAMpB,cAAAC,CAAeC,GACbC,KAAKC,YAAYC,KAAKH,E,CAGxB,iBAAAI,GACEH,KAAKF,eAAeE,KAAKD,S,CAG3B,kBAAAK,GACEJ,KAAKF,eAAeE,KAAKD,S,CAG3B,MAAAM,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,IAAKR,KAAKQ,IAAKC,IAAKT,KAAKS,IAAKC,MAAM,c","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as s,g as e}from"./p-6b122987.js";const a=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:flex}.tabs{display:flex;font-family:var(--ifx-font-family);width:100%}.tabs.horizontal{flex-direction:column}.tabs.vertical{flex-direction:row}.tabs-list{display:flex;list-style:none;padding:0;margin:0;position:relative;font-weight:600}.tabs-list:focus-within .active-border{display:none}.active-border{content:"";position:absolute;transition:left 0.3s ease-in-out, top 0.3s ease-in-out, height 0.3s ease-in-out}.tabs.horizontal .active-border{bottom:0;left:0;height:2px;background-color:#0A8276}.tabs.vertical .tabs-list{flex-direction:column;border-bottom:none}.tabs.vertical .tab-content{padding-top:0px;padding-left:32px}.tabs:not(.vertical) .tab-item.full-width{flex:1}.tab-item{display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 16px;cursor:pointer;position:relative}.tab-item.icon__right{flex-direction:row-reverse;justify-content:flex-end}.tab-item:hover{color:#0A8276}.tab-item:active,.tab-item.active{color:#0A8276}.tab-item:focus,.tab-item.focus{outline:none;border-radius:1px;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.tab-item:focus+.active-border,.tab-item.focus+.active-border{display:none}.tab-item.disabled{color:#BFBBBB;pointer-events:none}.tabs.vertical .tab-item{border-right:2px solid transparent;min-width:7em}.tabs.vertical .active-border{left:0;top:0;width:2px;background-color:#0A8276}.tab-content{padding-top:24px;padding-left:0px;flex-grow:1}.tabs.small .tab-item{font-size:0.875rem}';const o=a;const n=class{constructor(s){t(this,s);this.ifxTabChange=i(this,"ifxTabChange",7);this.orientation="horizontal";this.activeTabIndex=0;this.fullWidth=false;this.internalOrientation=undefined;this.internalActiveTabIndex=0;this.internalFocusedTabIndex=0;this.tabRefs=[];this.tabHeaderRefs=[];this.disabledTabs=[];this.tabObjects=[]}updateBorderOnWindowResize(){this.updateBorderAndFocus()}setActiveAndFocusedTab(t){var i;if(t>=this.tabObjects.length){t=this.tabObjects.length-1}if(t<0){t=0}if(!((i=this.tabObjects[t])===null||i===void 0?void 0:i.disabled)){this.internalActiveTabIndex=t;this.internalFocusedTabIndex=t}}handleTabHeaderChange(t){const i=t.target.getAttribute("slot").replace("tab-","");this.tabObjects[i].header=t.detail;this.tabObjects=[...this.tabObjects]}activeTabIndexChanged(t,i){if(t!==i){this.setActiveAndFocusedTab(t)}}componentWillLoad(){this.internalOrientation=this.orientation.toLowerCase()==="vertical"?"vertical":"horizontal";if(this.internalActiveTabIndex!==this.activeTabIndex){this.ifxTabChange.emit({previousTab:this.internalActiveTabIndex,currentTab:this.activeTabIndex})}this.onSlotChange();this.setActiveAndFocusedTab(this.activeTabIndex);this.updateTabStyles()}updateTabStyles(){this.tabHeaderRefs.forEach(((t,i)=>{t.classList.toggle("active",i===this.internalActiveTabIndex);t.setAttribute("aria-selected",i===this.internalActiveTabIndex?"true":"false")}))}reRenderBorder(){const t=this.el.shadowRoot.querySelector(".active-border");if(t&&this.tabHeaderRefs[this.internalActiveTabIndex]){if(this.orientation==="horizontal"){t.style.left=`${this.tabHeaderRefs[this.internalActiveTabIndex].offsetLeft}px`;t.style.width=`${this.tabHeaderRefs[this.internalActiveTabIndex].offsetWidth}px`;t.style.top="";t.style.height=""}else{t.style.top=`${this.tabHeaderRefs[this.internalActiveTabIndex].offsetTop}px`;t.style.height=`${this.tabHeaderRefs[this.internalActiveTabIndex].offsetHeight}px`;t.style.left="";t.style.width=""}}}onSlotChange(){const t=this.el.querySelectorAll("ifx-tab");this.tabObjects=Array.from(t).map((t=>({header:t===null||t===void 0?void 0:t.header,disabled:(t===null||t===void 0?void 0:t.disabled)===true,icon:t===null||t===void 0?void 0:t.icon,iconPosition:t===null||t===void 0?void 0:t.iconPosition})));this.tabRefs=Array.from(t);this.tabRefs.forEach(((t,i)=>{t.setAttribute("slot",`tab-${i}`)}))}setDefaultOrientation(){const t=["horizontal","vertical"];const i=this.orientation.toLowerCase();if(!t.includes(i)){this.internalOrientation="horizontal"}else this.internalOrientation=this.orientation}componentDidLoad(){this.updateBorderAndFocus();this.tabHeaderRefs.forEach(((t,i)=>{t.addEventListener("focus",this.onTabFocus(i))}))}onTabFocus(t){return()=>{this.internalFocusedTabIndex=t}}disconnectedCallback(){this.tabHeaderRefs.forEach(((t,i)=>{t.removeEventListener("focus",this.onTabFocus(i))}))}componentDidUpdate(){this.updateBorderAndFocus()}updateBorderAndFocus(){this.reRenderBorder();this.updateTabFocusability()}updateTabFocusability(){this.tabHeaderRefs.forEach(((t,i)=>{t.tabIndex=i===this.internalActiveTabIndex?0:-1}))}focusNextTab(){let t=this.internalFocusedTabIndex+1;while(t<this.tabHeaderRefs.length&&this.tabObjects[t].disabled){t++}if(t>=0&&t<this.tabHeaderRefs.length){this.internalFocusedTabIndex=t;this.tabHeaderRefs[t].focus()}}focusPreviousTab(){let t=this.internalFocusedTabIndex-1;while(t>=0&&this.tabObjects[t].disabled){t--}if(t>=0&&t<this.tabHeaderRefs.length){this.internalFocusedTabIndex=t;this.tabHeaderRefs[t].focus()}}getTabItemClass(t){const i=t===this.internalActiveTabIndex&&!this.tabObjects[t].disabled;const s=this.tabObjects[t].disabled;const e=this.tabObjects[t].iconPosition;return`tab-item ${this.fullWidth?"full-width":""} ${i?"active":""} ${s?"disabled":""} ${"icon__"+e}`}handleClick(t,i){this.ifxTabChange.emit({previousTab:this.internalActiveTabIndex,currentTab:i});if(!t.disabled)this.internalActiveTabIndex=i}handleKeyDown(t){if(t.key==="Tab"){if(t.shiftKey){if(this.internalFocusedTabIndex===0){return}else{t.preventDefault();this.focusPreviousTab()}}else{if(this.internalFocusedTabIndex===this.tabHeaderRefs.length-1){return}else{t.preventDefault();this.focusNextTab()}}}else if(t.key==="Enter"){if(this.internalFocusedTabIndex!==-1&&!this.tabObjects[this.internalFocusedTabIndex].disabled){const t=this.internalActiveTabIndex;this.internalActiveTabIndex=this.internalFocusedTabIndex;this.ifxTabChange.emit({previousTab:t,currentTab:this.internalFocusedTabIndex})}}}render(){var t;return s("div",{key:"7baac06946d2ea4b5be00be46cd99039dd2a67af","aria-label":"navigation tabs",class:`tabs ${this.internalOrientation}`},s("ul",{key:"518474ef80c90ef954f3c0fc23acdbec0bcbf3fc",role:"tablist",class:"tabs-list"},(t=this.tabObjects)===null||t===void 0?void 0:t.map(((t,i)=>s("li",{class:this.getTabItemClass(i),ref:t=>this.tabHeaderRefs[i]=t,onMouseDown:t=>t.preventDefault(),onClick:()=>this.handleClick(t,i),"aria-selected":i===this.internalActiveTabIndex?"true":"false","aria-disabled":t.disabled?"true":"false",role:"tab"},(t===null||t===void 0?void 0:t.icon)?s("ifx-icon",{icon:t.icon}):"",t===null||t===void 0?void 0:t.header))),s("div",{key:"40b9bfd4ef5fe4ccf9601a1a7f71abba828d2050",class:"active-border"})),s("div",{key:"e20214a729692ced82aa6df62112864848035128",class:"tab-content"},Array.from(this.tabObjects).map(((t,i)=>s("div",{style:{display:i===this.internalActiveTabIndex?"block":"none"}},s("slot",{name:`tab-${i}`}))))))}get el(){return e(this)}static get watchers(){return{activeTabIndex:["activeTabIndexChanged"]}}};n.style=o;export{n as ifx_tabs};
+//# sourceMappingURL=p-569b2ffb.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["tabsCss","IfxTabsStyle0","IfxTabs","updateBorderOnWindowResize","this","updateBorderAndFocus","setActiveAndFocusedTab","index","tabObjects","length","_a","disabled","internalActiveTabIndex","internalFocusedTabIndex","handleTabHeaderChange","e","tabIndex","target","getAttribute","replace","header","detail","activeTabIndexChanged","newValue","oldValue","componentWillLoad","internalOrientation","orientation","toLowerCase","activeTabIndex","ifxTabChange","emit","previousTab","currentTab","onSlotChange","updateTabStyles","tabHeaderRefs","forEach","tab","classList","toggle","setAttribute","reRenderBorder","borderElement","el","shadowRoot","querySelector","style","left","offsetLeft","width","offsetWidth","top","height","offsetTop","offsetHeight","tabs","querySelectorAll","Array","from","map","icon","iconPosition","tabRefs","setDefaultOrientation","validOrientations","lowercaseOrientation","includes","componentDidLoad","addEventListener","onTabFocus","disconnectedCallback","removeEventListener","componentDidUpdate","updateTabFocusability","focusNextTab","nextIndex","focus","focusPreviousTab","prevIndex","getTabItemClass","isActive","isDisabled","fullWidth","handleClick","handleKeyDown","ev","key","shiftKey","preventDefault","previouslyActiveTabIndex","render","h","class","role","ref","onMouseDown","event","onClick","_","display","name"],"sources":["src/components/tabs/tabs.scss?tag=ifx-tabs&encapsulation=shadow","src/components/tabs/tabs.tsx"],"sourcesContent":["//ifxTabs.scss\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: flex;\n}\n\n.tabs {\n  display: flex;\n  font-family: var(--ifx-font-family);\n  width: 100%;\n}\n\n.tabs.horizontal {\n  flex-direction: column;\n}\n\n.tabs.vertical {\n  flex-direction: row;\n}\n\n.tabs-list {\n  display: flex;\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  position: relative;\n  font-weight: tokens.$ifxFontWeightSemibold;\n}\n\n.tabs-list:focus-within .active-border {\n  display: none;\n}\n\n.active-border {\n  content: \"\";\n  position: absolute;\n  transition: left 0.3s ease-in-out, top 0.3s ease-in-out, height 0.3s ease-in-out;\n}\n\n.tabs.horizontal .active-border {\n  bottom: 0;\n  left: 0;\n  height: 2px;\n  background-color: tokens.$ifxColorOcean500;\n}\n\n.tabs.vertical .tabs-list {\n  flex-direction: column;\n  border-bottom: none;\n}\n\n.tabs.vertical .tab-content {\n  padding-top: 0px;\n  padding-left: 32px;\n}\n\n.tabs:not(.vertical) {\n  & .tab-item {\n    &.full-width { \n      flex: 1;\n    }\n  }\n}\n\n.tab-item {\n  // Reduced padding values\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n  cursor: pointer;\n  position: relative;\n\n  &.icon__right {\n    flex-direction: row-reverse;\n    justify-content: flex-end;\n  }\n  \n  &:hover {\n    color: tokens.$ifxColorOcean500;\n  }\n  \n  &:active,\n  &.active {\n    color: tokens.$ifxColorOcean500;\n  }\n\n  &:focus,\n  &.focus {\n    outline: none;\n    border-radius: 1px;\n    box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n    \n    // Assuming .active-border is a sibling of .tab-item\n    +.active-border {\n      display: none; // Hide the active border when the tab is in focus\n    }\n  }\n  \n  &.disabled {\n    color: tokens.$ifxColorEngineering300;\n    pointer-events: none;\n  }\n}\n\n.tabs.vertical .tab-item {\n  border-right: 2px solid transparent;\n  min-width: 7em;\n}\n\n.tabs.vertical .active-border {\n  left: 0;\n  top: 0;\n  width: 2px;\n  background-color: tokens.$ifxColorOcean500;\n}\n\n\n.tab-content {\n  padding-top: 24px;\n  padding-left: 0px;\n  flex-grow: 1;\n}\n\n.tabs.small .tab-item {\n  font-size: tokens.$ifxFontSizeS;\n}","//ifxTabs.tsx\nimport { Component, h, Prop, State, Element, Listen, Event, EventEmitter, Watch } from '@stencil/core';\n \n\n\n@Component({\n  tag: 'ifx-tabs',\n  styleUrl: 'tabs.scss',\n  shadow: true\n})\nexport class IfxTabs {\n  @Element() el: HTMLElement;\n\n  @Prop() orientation: string = \"horizontal\";\n  @Prop({ mutable: true }) activeTabIndex: number = 0;\n  @Prop() fullWidth: boolean = false;\n\n  @State() internalOrientation: string;\n  @State() internalActiveTabIndex: number = 0;\n  @State() internalFocusedTabIndex: number = 0;\n  @State() tabRefs: HTMLElement[] = [];\n  @State() tabHeaderRefs: HTMLElement[] = [];\n  @State() disabledTabs: string[] = [];\n  @State() tabObjects: any[] = [];\n\n  @Event() ifxTabChange: EventEmitter;\n\n  @Listen('resize', {target: 'window'})\n  updateBorderOnWindowResize() {\n    this.updateBorderAndFocus();\n  }\n\n  setActiveAndFocusedTab(index: number) {\n    if (index >= this.tabObjects.length) {\n      index = this.tabObjects.length - 1;\n    }\n    if (index < 0) {\n      index = 0;\n    }\n    if (!this.tabObjects[index]?.disabled) {\n      this.internalActiveTabIndex = index;\n      this.internalFocusedTabIndex = index;\n    }\n  }\n\n  @Listen('tabHeaderChange')\n  handleTabHeaderChange(e) { \n    const tabIndex = e.target.getAttribute('slot').replace('tab-', '');\n    this.tabObjects[tabIndex].header = e.detail;\n    this.tabObjects = [...this.tabObjects]; \n  }\n  \n\n  @Watch('activeTabIndex')\n  activeTabIndexChanged(newValue: number, oldValue: number) {\n    if (newValue !== oldValue) {\n      this.setActiveAndFocusedTab(newValue);\n    }\n  }\n\n\n\n  componentWillLoad() {\n    this.internalOrientation = this.orientation.toLowerCase() === 'vertical' ? 'vertical' : 'horizontal';\n    if (this.internalActiveTabIndex !== this.activeTabIndex) {\n      this.ifxTabChange.emit({ previousTab: this.internalActiveTabIndex, currentTab: this.activeTabIndex });\n    };\n    this.onSlotChange();\n    this.setActiveAndFocusedTab(this.activeTabIndex);\n    this.updateTabStyles();\n  }\n\n  updateTabStyles() {\n    this.tabHeaderRefs.forEach((tab, index) => {\n      tab.classList.toggle('active', index === this.internalActiveTabIndex);\n      tab.setAttribute('aria-selected', index === this.internalActiveTabIndex ? 'true' : 'false')\n    });\n  }\n\n\n  // needed for smooth border transition\n  reRenderBorder() {\n    const borderElement = this.el.shadowRoot.querySelector('.active-border') as HTMLElement;\n    if (borderElement && this.tabHeaderRefs[this.internalActiveTabIndex]) {\n      if (this.orientation === 'horizontal') {\n\n        borderElement.style.left = `${this.tabHeaderRefs[this.internalActiveTabIndex].offsetLeft}px`;\n        borderElement.style.width = `${this.tabHeaderRefs[this.internalActiveTabIndex].offsetWidth}px`;\n        borderElement.style.top = '';\n        borderElement.style.height = '';\n      } else {\n        borderElement.style.top = `${this.tabHeaderRefs[this.internalActiveTabIndex].offsetTop}px`;\n        borderElement.style.height = `${this.tabHeaderRefs[this.internalActiveTabIndex].offsetHeight}px`;\n        borderElement.style.left = '';\n        borderElement.style.width = '';\n      }\n    }\n  }\n\n\n  // when a slot is removed / added\n  @Listen('slotchange')\n  onSlotChange() {\n    const tabs = this.el.querySelectorAll('ifx-tab');\n    this.tabObjects = Array.from(tabs).map((tab) => {\n      return {\n        header: tab?.header,\n        disabled: tab?.disabled === true,\n        icon: tab?.icon,\n        iconPosition: tab?.iconPosition\n      }\n    });\n\n    this.tabRefs = Array.from(tabs);\n    this.tabRefs.forEach((tab, index) => {\n      tab.setAttribute('slot', `tab-${index}`);\n    });\n  }\n\n  setDefaultOrientation() {\n    const validOrientations = ['horizontal', 'vertical'];\n    const lowercaseOrientation = this.orientation.toLowerCase();\n\n    if (!validOrientations.includes(lowercaseOrientation)) {\n      this.internalOrientation = 'horizontal';\n    } else this.internalOrientation = this.orientation;\n  }\n\n  componentDidLoad() {\n    this.updateBorderAndFocus();\n    // Add keyboard event listeners for each tab header\n    this.tabHeaderRefs.forEach((tab, index) => {\n      tab.addEventListener('focus', this.onTabFocus(index));\n    });\n\n  }\n\n  onTabFocus(index) {\n    return () => {\n      this.internalFocusedTabIndex = index;\n    };\n  }\n\n  disconnectedCallback() {\n    // Remove keyboard event listeners when component is unmounted\n    this.tabHeaderRefs.forEach((tab, index) => {\n      tab.removeEventListener('focus', this.onTabFocus(index));\n    });\n  }\n  componentDidUpdate() {\n    this.updateBorderAndFocus();\n  }\n\n  private updateBorderAndFocus() {\n    this.reRenderBorder()\n    this.updateTabFocusability();\n  }\n\n  private updateTabFocusability() {\n    this.tabHeaderRefs.forEach((tab, index) => {\n      tab.tabIndex = index === this.internalActiveTabIndex ? 0 : -1;\n    })\n  }\n\n\n  private focusNextTab() {\n    let nextIndex = this.internalFocusedTabIndex + 1;\n    while (nextIndex < this.tabHeaderRefs.length && this.tabObjects[nextIndex].disabled) {\n      nextIndex++;\n    }\n    if (nextIndex >= 0 && nextIndex < this.tabHeaderRefs.length) {\n      this.internalFocusedTabIndex = nextIndex;\n      this.tabHeaderRefs[nextIndex].focus();\n    }\n  }\n\n  private focusPreviousTab() {\n    let prevIndex = this.internalFocusedTabIndex - 1;\n    while ((prevIndex >= 0) && (this.tabObjects[prevIndex].disabled)) {\n      prevIndex--;\n    }\n    if ((prevIndex >= 0) && (prevIndex < this.tabHeaderRefs.length)) {\n      this.internalFocusedTabIndex = prevIndex;\n      this.tabHeaderRefs[prevIndex].focus();\n    }\n  }\n\n\n  private getTabItemClass(index: number) {\n    const isActive = index === this.internalActiveTabIndex && !this.tabObjects[index].disabled;\n    const isDisabled = this.tabObjects[index].disabled;\n    const iconPosition = this.tabObjects[index].iconPosition\n    return `tab-item ${this.fullWidth ? 'full-width' : \"\"} ${isActive ? 'active' : ''} ${isDisabled ? 'disabled' : ''} ${'icon__'+iconPosition}`;\n  }\n\n  private handleClick(tab, index) {\n    this.ifxTabChange.emit({ previousTab: this.internalActiveTabIndex, currentTab: index })\n    if (!tab.disabled) this.internalActiveTabIndex = index;\n\n  }\n\n\n\n  @Listen('keydown')\n  handleKeyDown(ev: KeyboardEvent) {\n    if (ev.key === 'Tab') {\n\n      if (ev.shiftKey) {\n        // Shift + Tab\n        if (this.internalFocusedTabIndex === 0) {\n          // Allow default behavior to move focus out of component\n          return;\n        } else {\n          ev.preventDefault();\n          this.focusPreviousTab();\n        }\n      } else {\n        // Tab\n        if (this.internalFocusedTabIndex === this.tabHeaderRefs.length - 1) {\n          // Allow default behavior to move focus out of component\n          return;\n        } else {\n          ev.preventDefault();\n          this.focusNextTab();\n        }\n      }\n    } else if (ev.key === 'Enter') {\n      if (this.internalFocusedTabIndex !== -1 && !this.tabObjects[this.internalFocusedTabIndex].disabled) {\n        const previouslyActiveTabIndex = this.internalActiveTabIndex;\n        this.internalActiveTabIndex = this.internalFocusedTabIndex;\n        this.ifxTabChange.emit({ previousTab: previouslyActiveTabIndex, currentTab: this.internalFocusedTabIndex })\n      }\n    }\n  }\n\n\n  render() {\n    return (\n      <div aria-label=\"navigation tabs\" class={`tabs ${this.internalOrientation}`}>\n        <ul role=\"tablist\" class=\"tabs-list\">\n          {this.tabObjects?.map((tab, index) => (\n            <li\n              class={this.getTabItemClass(index)}\n              ref={(el) => (this.tabHeaderRefs[index] = el)}\n              onMouseDown={(event) => event.preventDefault()}\n              onClick={() => this.handleClick(tab, index)}\n              aria-selected={index === this.internalActiveTabIndex ? 'true' : 'false'}\n              aria-disabled={tab.disabled ? 'true' : 'false'}\n              role=\"tab\"\n            > \n              {tab?.icon ? <ifx-icon icon = {tab.icon}></ifx-icon> : ''}\n              {tab?.header}\n            </li>\n          ))}\n          <div class=\"active-border\"></div>\n        </ul>\n        <div class=\"tab-content\">\n          {Array.from(this.tabObjects).map((_, index) => (\n            <div style={{ display: index === this.internalActiveTabIndex ? 'block' : 'none' }}>\n              <slot name={`tab-${index}`} />\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  }\n\n}"],"mappings":"yDAAA,MAAMA,EAAU,wgDAChB,MAAAC,EAAeD,E,MCSFE,EAAO,M,qFAGY,a,oBACoB,E,eACrB,M,+DAGa,E,6BACC,E,aACT,G,mBACM,G,kBACN,G,gBACL,E,CAK7B,0BAAAC,GACEC,KAAKC,sB,CAGP,sBAAAC,CAAuBC,G,MACrB,GAAIA,GAASH,KAAKI,WAAWC,OAAQ,CACnCF,EAAQH,KAAKI,WAAWC,OAAS,C,CAEnC,GAAIF,EAAQ,EAAG,CACbA,EAAQ,C,CAEV,MAAKG,EAAAN,KAAKI,WAAWD,MAAM,MAAAG,SAAA,SAAAA,EAAEC,UAAU,CACrCP,KAAKQ,uBAAyBL,EAC9BH,KAAKS,wBAA0BN,C,EAKnC,qBAAAO,CAAsBC,GACpB,MAAMC,EAAWD,EAAEE,OAAOC,aAAa,QAAQC,QAAQ,OAAQ,IAC/Df,KAAKI,WAAWQ,GAAUI,OAASL,EAAEM,OACrCjB,KAAKI,WAAa,IAAIJ,KAAKI,W,CAK7B,qBAAAc,CAAsBC,EAAkBC,GACtC,GAAID,IAAaC,EAAU,CACzBpB,KAAKE,uBAAuBiB,E,EAMhC,iBAAAE,GACErB,KAAKsB,oBAAsBtB,KAAKuB,YAAYC,gBAAkB,WAAa,WAAa,aACxF,GAAIxB,KAAKQ,yBAA2BR,KAAKyB,eAAgB,CACvDzB,KAAK0B,aAAaC,KAAK,CAAEC,YAAa5B,KAAKQ,uBAAwBqB,WAAY7B,KAAKyB,gB,CAEtFzB,KAAK8B,eACL9B,KAAKE,uBAAuBF,KAAKyB,gBACjCzB,KAAK+B,iB,CAGP,eAAAA,GACE/B,KAAKgC,cAAcC,SAAQ,CAACC,EAAK/B,KAC/B+B,EAAIC,UAAUC,OAAO,SAAUjC,IAAUH,KAAKQ,wBAC9C0B,EAAIG,aAAa,gBAAiBlC,IAAUH,KAAKQ,uBAAyB,OAAS,QAAQ,G,CAM/F,cAAA8B,GACE,MAAMC,EAAgBvC,KAAKwC,GAAGC,WAAWC,cAAc,kBACvD,GAAIH,GAAiBvC,KAAKgC,cAAchC,KAAKQ,wBAAyB,CACpE,GAAIR,KAAKuB,cAAgB,aAAc,CAErCgB,EAAcI,MAAMC,KAAO,GAAG5C,KAAKgC,cAAchC,KAAKQ,wBAAwBqC,eAC9EN,EAAcI,MAAMG,MAAQ,GAAG9C,KAAKgC,cAAchC,KAAKQ,wBAAwBuC,gBAC/ER,EAAcI,MAAMK,IAAM,GAC1BT,EAAcI,MAAMM,OAAS,E,KACxB,CACLV,EAAcI,MAAMK,IAAM,GAAGhD,KAAKgC,cAAchC,KAAKQ,wBAAwB0C,cAC7EX,EAAcI,MAAMM,OAAS,GAAGjD,KAAKgC,cAAchC,KAAKQ,wBAAwB2C,iBAChFZ,EAAcI,MAAMC,KAAO,GAC3BL,EAAcI,MAAMG,MAAQ,E,GAQlC,YAAAhB,GACE,MAAMsB,EAAOpD,KAAKwC,GAAGa,iBAAiB,WACtCrD,KAAKI,WAAakD,MAAMC,KAAKH,GAAMI,KAAKtB,IAC/B,CACLlB,OAAQkB,IAAG,MAAHA,SAAG,SAAHA,EAAKlB,OACbT,UAAU2B,IAAG,MAAHA,SAAG,SAAHA,EAAK3B,YAAa,KAC5BkD,KAAMvB,IAAG,MAAHA,SAAG,SAAHA,EAAKuB,KACXC,aAAcxB,IAAG,MAAHA,SAAG,SAAHA,EAAKwB,iBAIvB1D,KAAK2D,QAAUL,MAAMC,KAAKH,GAC1BpD,KAAK2D,QAAQ1B,SAAQ,CAACC,EAAK/B,KACzB+B,EAAIG,aAAa,OAAQ,OAAOlC,IAAQ,G,CAI5C,qBAAAyD,GACE,MAAMC,EAAoB,CAAC,aAAc,YACzC,MAAMC,EAAuB9D,KAAKuB,YAAYC,cAE9C,IAAKqC,EAAkBE,SAASD,GAAuB,CACrD9D,KAAKsB,oBAAsB,Y,MACtBtB,KAAKsB,oBAAsBtB,KAAKuB,W,CAGzC,gBAAAyC,GACEhE,KAAKC,uBAELD,KAAKgC,cAAcC,SAAQ,CAACC,EAAK/B,KAC/B+B,EAAI+B,iBAAiB,QAASjE,KAAKkE,WAAW/D,GAAO,G,CAKzD,UAAA+D,CAAW/D,GACT,MAAO,KACLH,KAAKS,wBAA0BN,CAAK,C,CAIxC,oBAAAgE,GAEEnE,KAAKgC,cAAcC,SAAQ,CAACC,EAAK/B,KAC/B+B,EAAIkC,oBAAoB,QAASpE,KAAKkE,WAAW/D,GAAO,G,CAG5D,kBAAAkE,GACErE,KAAKC,sB,CAGC,oBAAAA,GACND,KAAKsC,iBACLtC,KAAKsE,uB,CAGC,qBAAAA,GACNtE,KAAKgC,cAAcC,SAAQ,CAACC,EAAK/B,KAC/B+B,EAAItB,SAAWT,IAAUH,KAAKQ,uBAAyB,GAAK,CAAC,G,CAKzD,YAAA+D,GACN,IAAIC,EAAYxE,KAAKS,wBAA0B,EAC/C,MAAO+D,EAAYxE,KAAKgC,cAAc3B,QAAUL,KAAKI,WAAWoE,GAAWjE,SAAU,CACnFiE,G,CAEF,GAAIA,GAAa,GAAKA,EAAYxE,KAAKgC,cAAc3B,OAAQ,CAC3DL,KAAKS,wBAA0B+D,EAC/BxE,KAAKgC,cAAcwC,GAAWC,O,EAI1B,gBAAAC,GACN,IAAIC,EAAY3E,KAAKS,wBAA0B,EAC/C,MAAQkE,GAAa,GAAO3E,KAAKI,WAAWuE,GAAmB,SAAG,CAChEA,G,CAEF,GAAKA,GAAa,GAAOA,EAAY3E,KAAKgC,cAAc3B,OAAS,CAC/DL,KAAKS,wBAA0BkE,EAC/B3E,KAAKgC,cAAc2C,GAAWF,O,EAK1B,eAAAG,CAAgBzE,GACtB,MAAM0E,EAAW1E,IAAUH,KAAKQ,yBAA2BR,KAAKI,WAAWD,GAAOI,SAClF,MAAMuE,EAAa9E,KAAKI,WAAWD,GAAOI,SAC1C,MAAMmD,EAAe1D,KAAKI,WAAWD,GAAOuD,aAC5C,MAAO,YAAY1D,KAAK+E,UAAY,aAAe,MAAMF,EAAW,SAAW,MAAMC,EAAa,WAAa,MAAM,SAASpB,G,CAGxH,WAAAsB,CAAY9C,EAAK/B,GACvBH,KAAK0B,aAAaC,KAAK,CAAEC,YAAa5B,KAAKQ,uBAAwBqB,WAAY1B,IAC/E,IAAK+B,EAAI3B,SAAUP,KAAKQ,uBAAyBL,C,CAOnD,aAAA8E,CAAcC,GACZ,GAAIA,EAAGC,MAAQ,MAAO,CAEpB,GAAID,EAAGE,SAAU,CAEf,GAAIpF,KAAKS,0BAA4B,EAAG,CAEtC,M,KACK,CACLyE,EAAGG,iBACHrF,KAAK0E,kB,MAEF,CAEL,GAAI1E,KAAKS,0BAA4BT,KAAKgC,cAAc3B,OAAS,EAAG,CAElE,M,KACK,CACL6E,EAAGG,iBACHrF,KAAKuE,c,QAGJ,GAAIW,EAAGC,MAAQ,QAAS,CAC7B,GAAInF,KAAKS,2BAA6B,IAAMT,KAAKI,WAAWJ,KAAKS,yBAAyBF,SAAU,CAClG,MAAM+E,EAA2BtF,KAAKQ,uBACtCR,KAAKQ,uBAAyBR,KAAKS,wBACnCT,KAAK0B,aAAaC,KAAK,CAAEC,YAAa0D,EAA0BzD,WAAY7B,KAAKS,yB,GAMvF,MAAA8E,G,MACE,OACEC,EAAA,OAAAL,IAAA,wDAAgB,kBAAkBM,MAAO,QAAQzF,KAAKsB,uBACpDkE,EAAA,MAAAL,IAAA,2CAAIO,KAAK,UAAUD,MAAM,cACtBnF,EAAAN,KAAKI,cAAU,MAAAE,SAAA,S,EAAEkD,KAAI,CAACtB,EAAK/B,IAC1BqF,EAAA,MACEC,MAAOzF,KAAK4E,gBAAgBzE,GAC5BwF,IAAMnD,GAAQxC,KAAKgC,cAAc7B,GAASqC,EAC1CoD,YAAcC,GAAUA,EAAMR,iBAC9BS,QAAS,IAAM9F,KAAKgF,YAAY9C,EAAK/B,GAAM,gBAC5BA,IAAUH,KAAKQ,uBAAyB,OAAS,QAAO,gBACxD0B,EAAI3B,SAAW,OAAS,QACvCmF,KAAK,QAEJxD,IAAG,MAAHA,SAAG,SAAHA,EAAKuB,MAAO+B,EAAA,YAAU/B,KAAQvB,EAAIuB,OAAoB,GACtDvB,IAAG,MAAHA,SAAG,SAAHA,EAAKlB,UAGVwE,EAAA,OAAAL,IAAA,2CAAKM,MAAM,mBAEbD,EAAA,OAAAL,IAAA,2CAAKM,MAAM,eACRnC,MAAMC,KAAKvD,KAAKI,YAAYoD,KAAI,CAACuC,EAAG5F,IACnCqF,EAAA,OAAK7C,MAAO,CAAEqD,QAAS7F,IAAUH,KAAKQ,uBAAyB,QAAU,SACvEgF,EAAA,QAAMS,KAAM,OAAO9F,U","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-16390b05.entry.js → p-584149bd.entry.js}

@@ -1,2 +1,2 @@
-import{r as i,c as t,h as e,g as o}from"./p-c63974da.js";const s=":host{position:relative;z-index:1000}.dropdown-menu{display:none;visibility:hidden;flex-direction:column;width:224px;max-height:289px;min-width:224px;overflow-y:auto;background:#FFFFFF;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;padding:8px 0px;font-family:var(--ifx-font-family)}.dropdown-menu.small{max-height:266px;max-width:186px;overflow-y:auto}.dropdown-menu.hideTopPadding{padding-top:0px}.dropdown-menu.show{display:flex;visibility:visible}";const d=s;const n=class{constructor(e){i(this,e);this.menuSize=t(this,"menuSize",7);this.ifxDropdownMenuItem=t(this,"ifxDropdownMenuItem",7);this.isOpen=false;this.size="l";this.hideTopPadding=false;this.filteredItems=[]}handleMenuFilter(i){const t=i.detail;this.filterDropdownItems(t)}handleDropdownItemValueEmission(i){this.ifxDropdownMenuItem.emit(i.detail)}filterDropdownItems(i){const t=Array.from(this.el.querySelectorAll("ifx-dropdown-item"));let e,o;let s=i.toUpperCase();for(let i=0;i<t.length;i++){e=t[i];o=e.textContent||e.innerText;if(o.toUpperCase().indexOf(s)>-1){e.setAttribute("hide",false)}else{e.setAttribute("hide",true)}}}componentWillUpdate(){this.menuSize.emit(this.size)}componentWillLoad(){this.filteredItems=Array.from(this.el.querySelectorAll("ifx-dropdown-item"));const i=this.el.querySelector("ifx-search-field");const t=this.el.querySelector("ifx-dropdown-header");if(i||t){this.hideTopPadding=true}else this.hideTopPadding=false}render(){return e("div",{key:"6a0875682a7dbdf9734794347bd64148b4f2c8b5",class:`dropdown-menu \n      ${this.isOpen?"show":""} \n      ${this.hideTopPadding?"hideTopPadding":""}\n      ${this.size==="s"?"small":""}`},e("slot",{key:"0a89ee2b042f28395f977172d003575b1d080611"}))}get el(){return o(this)}};n.style=d;export{n as ifx_dropdown_menu};
-//# sourceMappingURL=p-16390b05.entry.js.map
+import{r as i,c as t,h as e,g as o}from"./p-6b122987.js";const s=":host{position:relative;z-index:1000}.dropdown-menu{display:none;visibility:hidden;flex-direction:column;width:224px;max-height:289px;min-width:224px;overflow-y:auto;background:#FFFFFF;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;padding:8px 0px;font-family:var(--ifx-font-family)}.dropdown-menu.small{max-height:266px;max-width:186px;overflow-y:auto}.dropdown-menu.hideTopPadding{padding-top:0px}.dropdown-menu.show{display:flex;visibility:visible}";const d=s;const n=class{constructor(e){i(this,e);this.menuSize=t(this,"menuSize",7);this.ifxDropdownMenuItem=t(this,"ifxDropdownMenuItem",7);this.isOpen=false;this.size="l";this.hideTopPadding=false;this.filteredItems=[]}handleMenuFilter(i){const t=i.detail;this.filterDropdownItems(t)}handleDropdownItemValueEmission(i){this.ifxDropdownMenuItem.emit(i.detail)}filterDropdownItems(i){const t=Array.from(this.el.querySelectorAll("ifx-dropdown-item"));let e,o;let s=i.toUpperCase();for(let i=0;i<t.length;i++){e=t[i];o=e.textContent||e.innerText;if(o.toUpperCase().indexOf(s)>-1){e.setAttribute("hide",false)}else{e.setAttribute("hide",true)}}}componentWillUpdate(){this.menuSize.emit(this.size)}componentWillLoad(){this.filteredItems=Array.from(this.el.querySelectorAll("ifx-dropdown-item"));const i=this.el.querySelector("ifx-search-field");const t=this.el.querySelector("ifx-dropdown-header");if(i||t){this.hideTopPadding=true}else this.hideTopPadding=false}render(){return e("div",{key:"6a0875682a7dbdf9734794347bd64148b4f2c8b5",class:`dropdown-menu \n      ${this.isOpen?"show":""} \n      ${this.hideTopPadding?"hideTopPadding":""}\n      ${this.size==="s"?"small":""}`},e("slot",{key:"0a89ee2b042f28395f977172d003575b1d080611"}))}get el(){return o(this)}};n.style=d;export{n as ifx_dropdown_menu};
+//# sourceMappingURL=p-584149bd.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["dropdownMenuCss","IfxDropdownMenuStyle0","DropdownMenu","handleMenuFilter","event","searchValue","detail","this","filterDropdownItems","handleDropdownItemValueEmission","ifxDropdownMenuItem","emit","allItems","Array","from","el","querySelectorAll","dropdownItem","txtValue","query","toUpperCase","i","length","textContent","innerText","indexOf","setAttribute","componentWillUpdate","menuSize","size","componentWillLoad","filteredItems","searchField","querySelector","dropdownHeader","hideTopPadding","render","h","key","class","isOpen"],"sources":["src/components/dropdown/dropdown-menu/dropdown-menu.scss?tag=ifx-dropdown-menu&encapsulation=shadow","src/components/dropdown/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n  position: relative;\n  z-index: 1000;\n}\n\n.dropdown-menu {\n  display: none;\n  visibility: hidden;\n  flex-direction: column;\n  width: 224px;\n  max-height: 289px;\n  min-width: 224px;\n  overflow-y: auto;\n  background: tokens.$ifxColorBaseWhite;\n  box-shadow: 0px 6px 9px 0px #1d1d1d1a;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  padding: 8px 0px;\n  font-family: var(--ifx-font-family);\n\n  &.small {\n    max-height: 266px;\n    max-width: 186px;\n    overflow-y: auto;\n  }\n\n  &.hideTopPadding {\n    padding-top: 0px;\n  }\n}\n\n.dropdown-menu.show {\n  display: flex;\n  visibility: visible;\n}","// dropdown-menu.tsx\nimport { Component, h, Prop, Element, State, Event, EventEmitter, Listen } from \"@stencil/core\";\n\n@Component({\n  tag: 'ifx-dropdown-menu',\n  styleUrl: 'dropdown-menu.scss',\n  shadow: true\n})\n\nexport class DropdownMenu {\n  @Prop() isOpen: boolean = false;\n  @Prop() size: string = 'l'\n  @State() hideTopPadding: boolean = false;\n  @Element() el;\n\n  @Event() menuSize: EventEmitter;\n  @State() filteredItems: HTMLIfxDropdownItemElement[] = [];\n  @Event() ifxDropdownMenuItem: EventEmitter<CustomEvent>;\n\n  @Listen('ifxInput')\n  handleMenuFilter(event: CustomEvent) {\n    const searchValue = event.detail;\n    this.filterDropdownItems(searchValue)\n  }\n\n  @Listen('ifxDropdownItem')\n  handleDropdownItemValueEmission(event: CustomEvent) {\n    this.ifxDropdownMenuItem.emit(event.detail)\n  }\n\n  filterDropdownItems(searchValue: string) {\n    const allItems = Array.from(this.el.querySelectorAll('ifx-dropdown-item'));\n    let dropdownItem, txtValue;\n    let query = searchValue.toUpperCase()\n\n    for (let i = 0; i < allItems.length; i++) {\n      dropdownItem = allItems[i];\n      txtValue = dropdownItem.textContent || dropdownItem.innerText;\n\n      if (txtValue.toUpperCase().indexOf(query) > -1) {\n        dropdownItem.setAttribute('hide', false)\n      } else {\n        dropdownItem.setAttribute('hide', true)\n      }\n    }\n  }\n\n  componentWillUpdate() {\n    this.menuSize.emit(this.size)\n  }\n\n  componentWillLoad() {\n    this.filteredItems = Array.from(this.el.querySelectorAll('ifx-dropdown-item')) as HTMLIfxDropdownItemElement[];\n    const searchField = this.el.querySelector('ifx-search-field')\n    const dropdownHeader = this.el.querySelector('ifx-dropdown-header')\n\n    if (searchField || dropdownHeader) {\n      this.hideTopPadding = true;\n    } else this.hideTopPadding = false;\n  }\n\n\n  render() {\n    return (\n      <div class={`dropdown-menu \n      ${this.isOpen ? 'show' : ''} \n      ${this.hideTopPadding ? 'hideTopPadding' : \"\"}\n      ${this.size === 's' ? 'small' : \"\"}`\n      } >\n        <slot />\n      </div >\n    );\n  }\n}"],"mappings":"yDAAA,MAAMA,EAAkB,0eACxB,MAAAC,EAAeD,E,MCQFE,EAAY,M,iIACG,M,UACH,I,oBACY,M,mBAIoB,E,CAIvD,gBAAAC,CAAiBC,GACf,MAAMC,EAAcD,EAAME,OAC1BC,KAAKC,oBAAoBH,E,CAI3B,+BAAAI,CAAgCL,GAC9BG,KAAKG,oBAAoBC,KAAKP,EAAME,O,CAGtC,mBAAAE,CAAoBH,GAClB,MAAMO,EAAWC,MAAMC,KAAKP,KAAKQ,GAAGC,iBAAiB,sBACrD,IAAIC,EAAcC,EAClB,IAAIC,EAAQd,EAAYe,cAExB,IAAK,IAAIC,EAAI,EAAGA,EAAIT,EAASU,OAAQD,IAAK,CACxCJ,EAAeL,EAASS,GACxBH,EAAWD,EAAaM,aAAeN,EAAaO,UAEpD,GAAIN,EAASE,cAAcK,QAAQN,IAAU,EAAG,CAC9CF,EAAaS,aAAa,OAAQ,M,KAC7B,CACLT,EAAaS,aAAa,OAAQ,K,GAKxC,mBAAAC,GACEpB,KAAKqB,SAASjB,KAAKJ,KAAKsB,K,CAG1B,iBAAAC,GACEvB,KAAKwB,cAAgBlB,MAAMC,KAAKP,KAAKQ,GAAGC,iBAAiB,sBACzD,MAAMgB,EAAczB,KAAKQ,GAAGkB,cAAc,oBAC1C,MAAMC,EAAiB3B,KAAKQ,GAAGkB,cAAc,uBAE7C,GAAID,GAAeE,EAAgB,CACjC3B,KAAK4B,eAAiB,I,MACjB5B,KAAK4B,eAAiB,K,CAI/B,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,yBACVhC,KAAKiC,OAAS,OAAS,cACvBjC,KAAK4B,eAAiB,iBAAmB,aACzC5B,KAAKsB,OAAS,IAAM,QAAU,MAE9BQ,EAAA,QAAAC,IAAA,6C","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as t,h as e,g as i}from"./p-6b122987.js";const a=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{pointer-events:none}.card__text-wrapper{padding-bottom:0px}.card__text-wrapper.hasBtn{padding-bottom:16px}.card-text{line-height:1.5rem;font-size:1rem;font-weight:400;white-space:wrap;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}';const r=a;const o=class{constructor(e){t(this,e);this.hasBtn=undefined}componentWillLoad(){const t=this.el.closest("ifx-card").querySelector("ifx-link");const e=this.el.closest("ifx-card").querySelector("ifx-button");if(t||e){this.hasBtn=true}}render(){return e("div",{key:"fea1823e8000b8699142eefb127eb1716a606bcd",class:`card__text-wrapper ${this.hasBtn?"hasBtn":""}`},e("div",{key:"ee9baf1f210a6bf109669d3dbb075f56cf52ee22",class:`card-text`},e("slot",{key:"d4e94f54325b349d0a908f1812412e4a6ff1adad"})))}get el(){return i(this)}};o.style=r;export{o as ifx_card_text};
+//# sourceMappingURL=p-58966086.entry.js.map

package/dist/infineon-design-system-stencil/{p-85b61d98.entry.js.map → p-58966086.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["cardTextCss","IfxCardTextStyle0","CardText","componentWillLoad","link","this","el","closest","querySelector","button","hasBtn","render","h","key","class"],"sources":["src/components/card/card-text/card-text.scss?tag=ifx-card-text&encapsulation=shadow","src/components/card/card-text/card-text.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n:host {\n  pointer-events: none;\n}\n\n.card__text-wrapper {\n  padding-bottom: 0px;\n\n  &.hasBtn {\n    padding-bottom: 16px;\n  }\n}\n\n.card-text {\n  line-height: tokens.$ifxLineHeightM;\n  font-size: tokens.$ifxFontSizeM;\n  font-weight: 400;\n  white-space: wrap;\n  display: -webkit-box;\n  -webkit-line-clamp: 3;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}","import { Component, h, Element, State} from '@stencil/core';\n\n@Component({\n  tag: 'ifx-card-text',\n  styleUrl: './card-text.scss',\n  shadow: true,\n})\n\nexport class CardText {\n  @Element() el;\n  @State() hasBtn: boolean;\n\n  componentWillLoad() { \n    const link = this.el.closest('ifx-card').querySelector('ifx-link');\n    const button = this.el.closest('ifx-card').querySelector('ifx-button');\n    if(link || button) { \n      this.hasBtn = true;\n    }\n  }\n\n  render() {\n    return (\n      <div class={`card__text-wrapper ${this.hasBtn ? 'hasBtn' : \"\"}`}>\n        <div class={`card-text`}>\n          <slot />\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAc,oYACpB,MAAAC,EAAeD,E,MCOFE,EAAQ,M,yBAInB,iBAAAC,GACE,MAAMC,EAAOC,KAAKC,GAAGC,QAAQ,YAAYC,cAAc,YACvD,MAAMC,EAASJ,KAAKC,GAAGC,QAAQ,YAAYC,cAAc,cACzD,GAAGJ,GAAQK,EAAQ,CACjBJ,KAAKK,OAAS,I,EAIlB,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,sBAAsBT,KAAKK,OAAS,SAAW,MACzDE,EAAA,OAAAC,IAAA,2CAAKC,MAAO,aACVF,EAAA,QAAAC,IAAA,8C","ignoreList":[]}
+{"version":3,"names":["cardTextCss","IfxCardTextStyle0","CardText","componentWillLoad","link","this","el","closest","querySelector","button","hasBtn","render","h","key","class"],"sources":["src/components/card/card-text/card-text.scss?tag=ifx-card-text&encapsulation=shadow","src/components/card/card-text/card-text.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n:host {\n  pointer-events: none;\n}\n\n.card__text-wrapper {\n  padding-bottom: 0px;\n\n  &.hasBtn {\n    padding-bottom: 16px;\n  }\n}\n\n.card-text {\n  line-height: tokens.$ifxLineHeightM;\n  font-size: tokens.$ifxFontSizeM;\n  font-weight: 400;\n  white-space: wrap;\n  display: -webkit-box;\n  -webkit-line-clamp: 3;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}","import { Component, h, Element, State} from '@stencil/core';\n\n@Component({\n  tag: 'ifx-card-text',\n  styleUrl: './card-text.scss',\n  shadow: true,\n})\n\nexport class CardText {\n  @Element() el;\n  @State() hasBtn: boolean;\n\n  componentWillLoad() { \n    const link = this.el.closest('ifx-card').querySelector('ifx-link');\n    const button = this.el.closest('ifx-card').querySelector('ifx-button');\n    if(link || button) { \n      this.hasBtn = true;\n    }\n  }\n\n  render() {\n    return (\n      <div class={`card__text-wrapper ${this.hasBtn ? 'hasBtn' : \"\"}`}>\n        <div class={`card-text`}>\n          <slot />\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAc,oYACpB,MAAAC,EAAeD,E,MCOFE,EAAQ,M,+CAInB,iBAAAC,GACE,MAAMC,EAAOC,KAAKC,GAAGC,QAAQ,YAAYC,cAAc,YACvD,MAAMC,EAASJ,KAAKC,GAAGC,QAAQ,YAAYC,cAAc,cACzD,GAAGJ,GAAQK,EAAQ,CACjBJ,KAAKK,OAAS,I,EAIlB,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,sBAAsBT,KAAKK,OAAS,SAAW,MACzDE,EAAA,OAAAC,IAAA,2CAAKC,MAAO,aACVF,EAAA,QAAAC,IAAA,8C","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as t,c as s,h as n,a as e}from"./p-6b122987.js";import{g as o}from"./p-38c8a9b0.js";const i="ifx-icon{display:inline-flex;justify-content:center}ifx-icon:empty{display:none}";const c=i;const r=class{constructor(n){t(this,n);this.consoleError=s(this,"consoleError",7);this.icon="";this.ifxIcon=undefined}convertStringToHtml(t){const s=document.createElement("div");s.innerHTML=t;return s.firstChild}convertHtmlToObject(t){let s=Array.from(t.attributes,(({name:t,value:s})=>({name:t,value:s}))).reduce(((t,s)=>{t[s.name]=s.value;return t}),{});return s}convertPathsToVnode(t){let s=[];const e=this.convertHtmlToObject(t);const o=n("path",e);s.push(o);if(t.firstChild){const e=t.querySelectorAll("path");const o=t.querySelectorAll("path").length;for(let t=0;t<o;t++){let o=this.convertHtmlToObject(e[t]);let i=n("path",o);s.push(i)}}return s}getSVG(t){return n("svg",{class:"inline-svg",width:this.ifxIcon.width,height:this.ifxIcon.height,xmlns:"http://www.w3.org/2000/svg",fill:this.ifxIcon.fill,viewBox:this.ifxIcon.viewBox},...t)}constructIcon(){if(this.ifxIcon){const t=this.convertStringToHtml(this.ifxIcon.svgContent);const s=this.convertPathsToVnode(t);const n=this.getSVG(s);return n}else if(this.icon!==""){console.error("Icon not found!");this.consoleError.emit(true);return}else{return}}componentWillLoad(){const t=t=>t.toLowerCase().replace(/[^a-zA-Z0-9]+(.)/g,((t,s)=>s));this.ifxIcon=o(t(this.icon))}render(){return n(e,{key:"91ccb22f1cc67f3d4b91fb69c37cda13c941e109"},this.constructIcon())}};r.style=c;export{r as ifx_icon};
+//# sourceMappingURL=p-6389a7b8.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["infineonIconStencilCss","IfxIconStyle0","InfineonIconStencil","convertStringToHtml","htmlString","div","document","createElement","innerHTML","firstChild","convertHtmlToObject","htmlElement","pathToObject","Array","from","attributes","name","value","reduce","acc","current","convertPathsToVnode","htmlPath","svgPaths","parentPath","this","parentPathToVnode","h","push","paths","querySelectorAll","pathLength","length","i","objToVnode","getSVG","svgPath","class","width","ifxIcon","height","xmlns","fill","viewBox","constructIcon","svgContent","SVG","icon","console","error","consoleError","emit","componentWillLoad","removeHyphen","str","toLowerCase","replace","_m","chr","getIcon","render","Host","key"],"sources":["src/components/icon/infineonIconStencil.scss?tag=ifx-icon","src/components/icon/infineonIconStencil.tsx"],"sourcesContent":["ifx-icon {\n  display: inline-flex;\n  justify-content: center;\n\n  &:empty {\n    display: none;\n  }\n}","import { Component, Prop, h, Host, Event, EventEmitter } from '@stencil/core';\nimport { getIcon } from '@infineon/infineon-icons'\n \n\n\n@Component({\n  tag: 'ifx-icon',\n  styleUrl: './infineonIconStencil.scss'\n})\n\nexport class InfineonIconStencil {\n  @Prop({ mutable: true }) icon: string = \"\"\n  @Prop({ mutable: true }) ifxIcon: any;\n  @Event() consoleError: EventEmitter<boolean>;\n \n  convertStringToHtml(htmlString) { \n    const div = document.createElement('div')\n    div.innerHTML = htmlString\n    return div.firstChild\n  }\n\n  convertHtmlToObject(htmlElement) { \n    let pathToObject = Array\n      .from(htmlElement.attributes, ({ name, value }) => ({ name, value }))\n      .reduce((acc, current) => {\n        acc[current.name] = current.value\n        return acc\n      }, {})\n\n    return pathToObject\n  }\n\n  convertPathsToVnode(htmlPath) { \n    let svgPaths = []\n    const parentPath = this.convertHtmlToObject(htmlPath);\n    const parentPathToVnode = h(\"path\", parentPath);\n    svgPaths.push(parentPathToVnode)\n    if(htmlPath.firstChild) { \n      const paths = htmlPath.querySelectorAll('path');\n      const pathLength = htmlPath.querySelectorAll('path').length;\n      for(let i = 0; i < pathLength; i++) { \n        let pathToObject = this.convertHtmlToObject(paths[i])\n        let objToVnode = h(\"path\", pathToObject)\n        svgPaths.push(objToVnode)\n      }      \n    }\n    return svgPaths\n  }\n\n  getSVG(svgPath) {\n    return <svg class=\"inline-svg\" width={this.ifxIcon.width} height={this.ifxIcon.height} xmlns=\"http://www.w3.org/2000/svg\" fill={this.ifxIcon.fill} viewBox={this.ifxIcon.viewBox}>{...svgPath}</svg>\n  }\n\n  constructIcon() {\n    if(this.ifxIcon) {\n      const htmlPath = this.convertStringToHtml(this.ifxIcon.svgContent)\n      const svgPath = this.convertPathsToVnode(htmlPath)\n      const SVG = this.getSVG(svgPath)\n      return SVG;\n    } else if(this.icon !== \"\") {\n      console.error('Icon not found!')\n      this.consoleError.emit(true)\n      return;\n    }  else { \n      return;\n    }\n  }\n\n  componentWillLoad() {\n    const removeHyphen = (str) => str.toLowerCase().replace(/[^a-zA-Z0-9]+(.)/g, (_m, chr) => chr);\n    this.ifxIcon = getIcon(removeHyphen(this.icon));\n  }\n\n\n\n  render() {\n    return (\n      <Host>\n      {this.constructIcon()}\n      </Host>\n    );\n  }\n}"],"mappings":"6FAAA,MAAMA,EAAyB,mFAC/B,MAAAC,EAAeD,E,MCSFE,EAAmB,M,8EACU,G,uBAIxC,mBAAAC,CAAoBC,GAClB,MAAMC,EAAMC,SAASC,cAAc,OACnCF,EAAIG,UAAYJ,EAChB,OAAOC,EAAII,U,CAGb,mBAAAC,CAAoBC,GAClB,IAAIC,EAAeC,MAChBC,KAAKH,EAAYI,YAAY,EAAGC,OAAMC,YAAO,CAAQD,OAAMC,YAC3DC,QAAO,CAACC,EAAKC,KACZD,EAAIC,EAAQJ,MAAQI,EAAQH,MAC5B,OAAOE,CAAG,GACT,IAEL,OAAOP,C,CAGT,mBAAAS,CAAoBC,GAClB,IAAIC,EAAW,GACf,MAAMC,EAAaC,KAAKf,oBAAoBY,GAC5C,MAAMI,EAAoBC,EAAE,OAAQH,GACpCD,EAASK,KAAKF,GACd,GAAGJ,EAASb,WAAY,CACtB,MAAMoB,EAAQP,EAASQ,iBAAiB,QACxC,MAAMC,EAAaT,EAASQ,iBAAiB,QAAQE,OACrD,IAAI,IAAIC,EAAI,EAAGA,EAAIF,EAAYE,IAAK,CAClC,IAAIrB,EAAea,KAAKf,oBAAoBmB,EAAMI,IAClD,IAAIC,EAAaP,EAAE,OAAQf,GAC3BW,EAASK,KAAKM,E,EAGlB,OAAOX,C,CAGT,MAAAY,CAAOC,GACL,OAAOT,EAAA,OAAKU,MAAM,aAAaC,MAAOb,KAAKc,QAAQD,MAAOE,OAAQf,KAAKc,QAAQC,OAAQC,MAAM,6BAA6BC,KAAMjB,KAAKc,QAAQG,KAAMC,QAASlB,KAAKc,QAAQI,YAAaP,E,CAGxL,aAAAQ,GACE,GAAGnB,KAAKc,QAAS,CACf,MAAMjB,EAAWG,KAAKtB,oBAAoBsB,KAAKc,QAAQM,YACvD,MAAMT,EAAUX,KAAKJ,oBAAoBC,GACzC,MAAMwB,EAAMrB,KAAKU,OAAOC,GACxB,OAAOU,C,MACF,GAAGrB,KAAKsB,OAAS,GAAI,CAC1BC,QAAQC,MAAM,mBACdxB,KAAKyB,aAAaC,KAAK,MACvB,M,KACM,CACN,M,EAIJ,iBAAAC,GACE,MAAMC,EAAgBC,GAAQA,EAAIC,cAAcC,QAAQ,qBAAqB,CAACC,EAAIC,IAAQA,IAC1FjC,KAAKc,QAAUoB,EAAQN,EAAa5B,KAAKsB,M,CAK3C,MAAAa,GACE,OACEjC,EAACkC,EAAI,CAAAC,IAAA,4CACJrC,KAAKmB,gB","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-cb2bfd10.entry.js → p-680f8e2c.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as o}from"./p-c63974da.js";const r=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{pointer-events:none}.card-overline{font-size:1rem;font-weight:400;color:#575352;padding-bottom:4px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-all}';const t=r;const i=class{constructor(o){e(this,o)}render(){return o("div",{key:"edb86d9c621859391a960610c81ab5fa3a3558fd",class:"card-overline"},o("slot",{key:"2b4846831c111a2b598b6632559b5346c152568f"}))}};i.style=t;export{i as ifx_card_overline};
-//# sourceMappingURL=p-cb2bfd10.entry.js.map
+import{r as e,h as o}from"./p-6b122987.js";const r=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{pointer-events:none}.card-overline{font-size:1rem;font-weight:400;color:#575352;padding-bottom:4px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-all}';const t=r;const i=class{constructor(o){e(this,o)}render(){return o("div",{key:"edb86d9c621859391a960610c81ab5fa3a3558fd",class:"card-overline"},o("slot",{key:"2b4846831c111a2b598b6632559b5346c152568f"}))}};i.style=t;export{i as ifx_card_overline};
+//# sourceMappingURL=p-680f8e2c.entry.js.map

package/dist/infineon-design-system-stencil/{p-d93f128c.entry.js → p-6ae18c50.entry.js}

@@ -1,2 +1,2 @@
-import{r,h as s}from"./p-c63974da.js";const o=":host{display:inline-block;cursor:pointer}";const e=o;const t=class{constructor(s){r(this,s);this.isOpen=false}render(){return s("slot",{key:"3e51ceb827b5c52cb850e6433d3235e9400fe5c0"})}};t.style=e;export{t as ifx_dropdown_trigger};
-//# sourceMappingURL=p-d93f128c.entry.js.map
+import{r,h as s}from"./p-6b122987.js";const o=":host{display:inline-block;cursor:pointer}";const e=o;const t=class{constructor(s){r(this,s);this.isOpen=false}render(){return s("slot",{key:"3e51ceb827b5c52cb850e6433d3235e9400fe5c0"})}};t.style=e;export{t as ifx_dropdown_trigger};
+//# sourceMappingURL=p-6ae18c50.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["dropdownTriggerCss","IfxDropdownTriggerStyle0","DropdownItem","render","h","key"],"sources":["src/components/dropdown/dropdown-trigger/dropdown-trigger.scss?tag=ifx-dropdown-trigger&encapsulation=shadow","src/components/dropdown/dropdown-trigger/dropdown-trigger.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n  display: inline-block;\n  cursor: pointer;\n}","// dropdown-trigger-button.tsx\nimport { Component, Prop, h } from \"@stencil/core\";\nimport { IOpenable } from '../IOpenable';\n\n@Component({\n  tag: 'ifx-dropdown-trigger',\n  styleUrl: 'dropdown-trigger.scss',\n  shadow: true\n})\n\nexport class DropdownItem implements IOpenable {\n  @Prop() isOpen: boolean = false;\n\n  render() {\n    return (\n      <slot />\n    )\n  }\n}"],"mappings":"sCAAA,MAAMA,EAAqB,6CAC3B,MAAAC,EAAeD,E,MCSFE,EAAY,M,qCACG,K,CAE1B,MAAAC,GACE,OACEC,EAAA,QAAAC,IAAA,4C","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-6b122987.js

@@ -0,0 +1,3 @@
+const e="infineon-design-system-stencil";const t={allRenderFn:true,appendChildSlotFix:false,asyncLoading:true,asyncQueue:false,attachStyles:true,cloneNodeFix:true,cmpDidLoad:true,cmpDidRender:true,cmpDidUnload:false,cmpDidUpdate:true,cmpShouldUpdate:false,cmpWillLoad:true,cmpWillRender:true,cmpWillUpdate:true,connectedCallback:true,constructableCSS:true,cssAnnotations:true,devTools:false,disconnectedCallback:true,element:false,event:true,experimentalScopedSlotChanges:false,experimentalSlotFixes:false,formAssociated:true,hasRenderFn:true,hostListener:true,hostListenerTarget:true,hostListenerTargetBody:true,hostListenerTargetDocument:true,hostListenerTargetParent:false,hostListenerTargetWindow:true,hotModuleReplacement:false,hydrateClientSide:false,hydrateServerSide:false,hydratedAttribute:false,hydratedClass:true,hydratedSelectorName:"hydrated",initializeNextTick:false,invisiblePrehydration:true,isDebug:false,isDev:false,isTesting:false,lazyLoad:true,lifecycle:true,lifecycleDOMEvents:false,member:true,method:true,mode:false,observeAttribute:true,profile:false,prop:true,propBoolean:true,propMutable:true,propNumber:true,propString:true,reflect:true,scoped:false,scopedSlotTextContentFix:false,scriptDataOpts:false,shadowDelegatesFocus:true,shadowDom:true,slot:true,slotChildNodesFix:false,slotRelocation:true,state:true,style:true,svg:true,taskQueue:true,transformTagName:false,updatable:true,vdomAttribute:true,vdomClass:true,vdomFunctional:false,vdomKey:true,vdomListener:true,vdomPropOrAttr:true,vdomRef:true,vdomRender:true,vdomStyle:true,vdomText:true,vdomXlink:true,watchCallback:true};var r=Object.defineProperty;var n=(e,t)=>{for(var n in t)r(e,n,{get:t[n],enumerable:true})};var s=new WeakMap;var l=e=>s.get(e);var i=(e,t)=>s.set(t.t=e,t);var o=(e,t)=>{const r={l:0,$hostElement$:e,i:t,o:new Map};{r.u=new Promise((e=>r.v=e))}{r.h=new Promise((e=>r.p=e));e["s-p"]=[];e["s-rc"]=[]}return s.set(e,r)};var a=(e,t)=>t in e;var f=(e,t)=>(0,console.error)(e,t);var c=new Map;var u=(e,t,r)=>{const n=e.m.replace(/-/g,"_");const s=e.$;if(!s){return void 0}const l=c.get(s);if(l){return l[n]}
+/*!__STENCIL_STATIC_IMPORT_SWITCH__*/return import(`./${s}.entry.js${""}`).then((e=>{{c.set(s,e)}return e[n]}),f)};var v=new Map;var d="{visibility:hidden}.hydrated{visibility:inherit}";var h="slot-fb{display:contents}slot-fb[hidden]{display:none}";var p="http://www.w3.org/1999/xlink";var m=["formAssociatedCallback","formResetCallback","formDisabledCallback","formStateRestoreCallback"];var b=typeof window!=="undefined"?window:{};var y=b.document||{head:{}};var w=b.HTMLElement||class{};var g={l:0,S:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,t,r,n)=>e.addEventListener(t,r,n),rel:(e,t,r,n)=>e.removeEventListener(t,r,n),ce:(e,t)=>new CustomEvent(e,t)};var $=t.shadowDom;var S=(()=>{let e=false;try{y.addEventListener("e",null,Object.defineProperty({},"passive",{get(){e=true}}))}catch(e){}return e})();var k=e=>Promise.resolve(e);var C=(()=>{try{new CSSStyleSheet;return typeof(new CSSStyleSheet).replaceSync==="function"}catch(e){}return false})();var j=false;var O=[];var x=[];var R=(e,t)=>r=>{e.push(r);if(!j){j=true;if(t&&g.l&4){E(T)}else{g.raf(T)}}};var D=e=>{for(let t=0;t<e.length;t++){try{e[t](performance.now())}catch(e){f(e)}}e.length=0};var T=()=>{D(O);{D(x);if(j=O.length>0){g.raf(T)}}};var E=e=>k().then(e);var L=R(x,true);var A={};var F="http://www.w3.org/2000/svg";var M="http://www.w3.org/1999/xhtml";var P=e=>e!=null;var U=e=>{e=typeof e;return e==="object"||e==="function"};function N(e){var t,r,n;return(n=(r=(t=e.head)==null?void 0:t.querySelector('meta[name="csp-nonce"]'))==null?void 0:r.getAttribute("content"))!=null?n:void 0}var W={};n(W,{err:()=>z,map:()=>B,ok:()=>H,unwrap:()=>I,unwrapErr:()=>Q});var H=e=>({isOk:true,isErr:false,value:e});var z=e=>({isOk:false,isErr:true,value:e});function B(e,t){if(e.isOk){const r=t(e.value);if(r instanceof Promise){return r.then((e=>H(e)))}else{return H(r)}}if(e.isErr){const t=e.value;return z(t)}throw"should never get here"}var I=e=>{if(e.isOk){return e.value}else{throw e.value}};var Q=e=>{if(e.isErr){return e.value}else{throw e.value}};var q=(e,t,...r)=>{let n=null;let s=null;let l=null;let i=false;let o=false;const a=[];const f=t=>{for(let r=0;r<t.length;r++){n=t[r];if(Array.isArray(n)){f(n)}else if(n!=null&&typeof n!=="boolean"){if(i=typeof e!=="function"&&!U(n)){n=String(n)}if(i&&o){a[a.length-1].k+=n}else{a.push(i?G(null,n):n)}o=i}}};f(r);if(t){if(t.key){s=t.key}if(t.name){l=t.name}{const e=t.className||t.class;if(e){t.class=typeof e!=="object"?e:Object.keys(e).filter((t=>e[t])).join(" ")}}}const c=G(e,null);c.C=t;if(a.length>0){c.j=a}{c.O=s}{c.R=l}return c};var G=(e,t)=>{const r={l:0,D:e,k:t,T:null,j:null};{r.C=null}{r.O=null}{r.R=null}return r};var K={};var V=e=>e&&e.D===K;var X=(e,t,r,n,s,l)=>{if(r!==n){let i=a(e,t);let o=t.toLowerCase();if(t==="class"){const t=e.classList;const s=J(r);const l=J(n);if(e["s-si"]&&l.indexOf(e["s-si"])<0){l.push(e["s-si"])}t.remove(...s.filter((e=>e&&!l.includes(e))));t.add(...l.filter((e=>e&&!s.includes(e))))}else if(t==="style"){{for(const t in r){if(!n||n[t]==null){if(t.includes("-")){e.style.removeProperty(t)}else{e.style[t]=""}}}}for(const t in n){if(!r||n[t]!==r[t]){if(t.includes("-")){e.style.setProperty(t,n[t])}else{e.style[t]=n[t]}}}}else if(t==="key");else if(t==="ref"){if(n){n(e)}}else if(!i&&t[0]==="o"&&t[1]==="n"){if(t[2]==="-"){t=t.slice(3)}else if(a(b,o)){t=o.slice(2)}else{t=o[2]+t.slice(3)}if(r||n){const s=t.endsWith(Y);t=t.replace(Z,"");if(r){g.rel(e,t,r,s)}if(n){g.ael(e,t,n,s)}}}else{const a=U(n);if((i||a&&n!==null)&&!s){try{if(!e.tagName.includes("-")){const s=n==null?"":n;if(t==="list"){i=false}else if(r==null||e[t]!=s){if(typeof e.__lookupSetter__(t)==="function"){e[t]=s}else{e.setAttribute(t,s)}}}else{e[t]=n}}catch(e){}}let f=false;{if(o!==(o=o.replace(/^xlink\:?/,""))){t=o;f=true}}if(n==null||n===false){if(n!==false||e.getAttribute(t)===""){if(f){e.removeAttributeNS(p,t)}else{e.removeAttribute(t)}}}else if((!i||l&4||s)&&!a){n=n===true?"":n;if(f){e.setAttributeNS(p,t,n)}else{e.setAttribute(t,n)}}}}};var _=/\s/;var J=e=>!e?[]:e.split(_);var Y="Capture";var Z=new RegExp(Y+"$");var ee=(e,t,r)=>{const n=t.T.nodeType===11&&t.T.host?t.T.host:t.T;const s=e&&e.C||A;const l=t.C||A;{for(const e of te(Object.keys(s))){if(!(e in l)){X(n,e,s[e],void 0,r,t.l)}}}for(const e of te(Object.keys(l))){X(n,e,s[e],l[e],r,t.l)}};function te(e){return e.includes("ref")?[...e.filter((e=>e!=="ref")),"ref"]:e}var re;var ne;var se;var le=false;var ie=false;var oe=false;var ae=false;var fe=(e,r,n,s)=>{var l;const i=r.j[n];let o=0;let a;let f;let c;if(!le){oe=true;if(i.D==="slot"){if(re){s.classList.add(re+"-s")}i.l|=i.j?2:1}}if(i.k!==null){a=i.T=y.createTextNode(i.k)}else if(i.l&1){a=i.T=y.createTextNode("")}else{if(!ae){ae=i.D==="svg"}a=i.T=y.createElementNS(ae?F:M,!le&&t.slotRelocation&&i.l&2?"slot-fb":i.D);if(ae&&i.D==="foreignObject"){ae=false}{ee(null,i,ae)}const r=a.getRootNode();const n=!r.querySelector("body");if(!n&&t.scoped&&P(re)&&a["s-si"]!==re){a.classList.add(a["s-si"]=re)}if(i.j){for(o=0;o<i.j.length;++o){f=fe(e,i,o,a);if(f){a.appendChild(f)}}}{if(i.D==="svg"){ae=false}else if(a.tagName==="foreignObject"){ae=true}}}a["s-hn"]=se;{if(i.l&(2|1)){a["s-sr"]=true;a["s-cr"]=ne;a["s-sn"]=i.R||"";a["s-rf"]=(l=i.C)==null?void 0:l.ref;c=e&&e.j&&e.j[n];if(c&&c.D===i.D&&e.T){{ce(e.T,false)}}}}return a};var ce=(e,r)=>{g.l|=1;const n=Array.from(e.__childNodes||e.childNodes);if(e["s-sr"]&&t.experimentalSlotFixes){let t=e;while(t=t.nextSibling){if(t&&t["s-sn"]===e["s-sn"]&&t["s-sh"]===se){n.push(t)}}}for(let e=n.length-1;e>=0;e--){const t=n[e];if(t["s-hn"]!==se&&t["s-ol"]){ke(me(t),t,pe(t));t["s-ol"].remove();t["s-ol"]=void 0;t["s-sh"]=void 0;oe=true}if(r){ce(t,r)}}g.l&=~1};var ue=(e,t,r,n,s,l)=>{let i=e["s-cr"]&&e["s-cr"].parentNode||e;let o;if(i.shadowRoot&&i.tagName===se){i=i.shadowRoot}for(;s<=l;++s){if(n[s]){o=fe(null,r,s,e);if(o){n[s].T=o;ke(i,o,pe(t))}}}};var ve=(e,t,r)=>{for(let n=t;n<=r;++n){const t=e[n];if(t){const e=t.T;Se(t);if(e){{ie=true;if(e["s-ol"]){e["s-ol"].remove()}else{ce(e,true)}}e.remove()}}}};var de=(e,t,r,n,s=false)=>{let l=0;let i=0;let o=0;let a=0;let f=t.length-1;let c=t[0];let u=t[f];let v=n.length-1;let d=n[0];let h=n[v];let p;let m;while(l<=f&&i<=v){if(c==null){c=t[++l]}else if(u==null){u=t[--f]}else if(d==null){d=n[++i]}else if(h==null){h=n[--v]}else if(he(c,d,s)){be(c,d,s);c=t[++l];d=n[++i]}else if(he(u,h,s)){be(u,h,s);u=t[--f];h=n[--v]}else if(he(c,h,s)){if(c.D==="slot"||h.D==="slot"){ce(c.T.parentNode,false)}be(c,h,s);ke(e,c.T,u.T.nextSibling);c=t[++l];h=n[--v]}else if(he(u,d,s)){if(c.D==="slot"||h.D==="slot"){ce(u.T.parentNode,false)}be(u,d,s);ke(e,u.T,c.T);u=t[--f];d=n[++i]}else{o=-1;{for(a=l;a<=f;++a){if(t[a]&&t[a].O!==null&&t[a].O===d.O){o=a;break}}}if(o>=0){m=t[o];if(m.D!==d.D){p=fe(t&&t[i],r,o,e)}else{be(m,d,s);t[o]=void 0;p=m.T}d=n[++i]}else{p=fe(t&&t[i],r,i,e);d=n[++i]}if(p){{ke(me(c.T),p,pe(c.T))}}}}if(l>f){ue(e,n[v+1]==null?null:n[v+1].T,r,n,i,v)}else if(i>v){ve(t,l,f)}};var he=(e,t,r=false)=>{if(e.D===t.D){if(e.D==="slot"){if("L"in e&&r&&e.T.nodeType!==8){return false}return e.R===t.R}if(!r){return e.O===t.O}return true}return false};var pe=e=>e&&e["s-ol"]||e;var me=e=>(e["s-ol"]?e["s-ol"]:e).parentNode;var be=(e,r,n=false)=>{const s=r.T=e.T;const l=e.j;const i=r.j;const o=r.D;const a=r.k;let f;if(a===null){{ae=o==="svg"?true:o==="foreignObject"?false:ae}{if(o==="slot"&&!le);else{ee(e,r,ae)}}if(l!==null&&i!==null){de(s,l,r,i,n)}else if(i!==null){if(e.k!==null){s.textContent=""}ue(s,null,r,i,0,i.length-1)}else if(!n&&t.updatable&&l!==null){ve(l,0,l.length-1)}if(ae&&o==="svg"){ae=false}}else if(f=s["s-cr"]){f.parentNode.textContent=a}else if(e.k!==a){s.data=a}};var ye=e=>{const t=e.__childNodes||e.childNodes;for(const e of t){if(e.nodeType===1){if(e["s-sr"]){const r=e["s-sn"];e.hidden=false;for(const n of t){if(n!==e){if(n["s-hn"]!==e["s-hn"]||r!==""){if(n.nodeType===1&&(r===n.getAttribute("slot")||r===n["s-sn"])||n.nodeType===3&&r===n["s-sn"]){e.hidden=true;break}}else if(r===n["s-sn"]){if(n.nodeType===1||n.nodeType===3&&n.textContent.trim()!==""){e.hidden=true;break}}}}}ye(e)}}};var we=[];var ge=e=>{let r;let n;let s;const l=e.__childNodes||e.childNodes;for(const e of l){if(e["s-sr"]&&(r=e["s-cr"])&&r.parentNode){n=r.parentNode.__childNodes||r.parentNode.childNodes;const l=e["s-sn"];for(s=n.length-1;s>=0;s--){r=n[s];if(!r["s-cn"]&&!r["s-nr"]&&r["s-hn"]!==e["s-hn"]&&!t.experimentalSlotFixes){if($e(r,l)){let t=we.find((e=>e.A===r));ie=true;r["s-sn"]=r["s-sn"]||l;if(t){t.A["s-sh"]=e["s-hn"];t.F=e}else{r["s-sh"]=e["s-hn"];we.push({F:e,A:r})}if(r["s-sr"]){we.map((e=>{if($e(e.A,r["s-sn"])){t=we.find((e=>e.A===r));if(t&&!e.F){e.F=t.F}}}))}}else if(!we.some((e=>e.A===r))){we.push({A:r})}}}}if(e.nodeType===1){ge(e)}}};var $e=(e,t)=>{if(e.nodeType===1){if(e.getAttribute("slot")===null&&t===""){return true}if(e.getAttribute("slot")===t){return true}return false}if(e["s-sn"]===t){return true}return t===""};var Se=e=>{{e.C&&e.C.ref&&e.C.ref(null);e.j&&e.j.map(Se)}};var ke=(e,t,r)=>{const n=e==null?void 0:e.insertBefore(t,r);return n};var Ce=(e,t,r=false)=>{var n,s,l,i;const o=e.$hostElement$;const a=e.i;const f=e.M||G(null,null);const c=V(t)?t:q(null,null,t);se=o.tagName;if(a.P){c.C=c.C||{};a.P.map((([e,t])=>c.C[t]=o[e]))}if(r&&c.C){for(const e of Object.keys(c.C)){if(o.hasAttribute(e)&&!["key","ref","style","class"].includes(e)){c.C[e]=o[e]}}}c.D=null;c.l|=4;e.M=c;c.T=f.T=o.shadowRoot||o;{re=o["s-sc"]}le=(a.l&1)!==0;{ne=o["s-cr"];ie=false}be(f,c,r);{g.l|=1;if(oe){ge(c.T);for(const e of we){const t=e.A;if(!t["s-ol"]){const e=y.createTextNode("");e["s-nr"]=t;ke(t.parentNode,t["s-ol"]=e,t)}}for(const e of we){const t=e.A;const o=e.F;if(o){const e=o.parentNode;let r=o.nextSibling;{let l=(n=t["s-ol"])==null?void 0:n.previousSibling;while(l){let n=(s=l["s-nr"])!=null?s:null;if(n&&n["s-sn"]===t["s-sn"]&&e===n.parentNode){n=n.nextSibling;while(n===t||(n==null?void 0:n["s-sr"])){n=n==null?void 0:n.nextSibling}if(!n||!n["s-nr"]){r=n;break}}l=l.previousSibling}}if(!r&&e!==t.parentNode||t.nextSibling!==r){if(t!==r){if(!t["s-hn"]&&t["s-ol"]){t["s-hn"]=t["s-ol"].parentNode.nodeName}ke(e,t,r);if(t.nodeType===1){t.hidden=(l=t["s-ih"])!=null?l:false}}}t&&typeof o["s-rf"]==="function"&&o["s-rf"](t)}else{if(t.nodeType===1){if(r){t["s-ih"]=(i=t.hidden)!=null?i:false}t.hidden=true}}}}if(ie){ye(c.T)}g.l&=~1;we.length=0}ne=void 0};var je=e=>{const t=e.cloneNode;e.cloneNode=function(e){const r=this;const n=r.shadowRoot&&$;const s=t.call(r,n?e:false);if(!n&&e){let e=0;let t,r;const n=["s-id","s-cr","s-lr","s-rc","s-sc","s-p","s-cn","s-sr","s-sn","s-hn","s-ol","s-nr","s-si","s-rf","s-scs"];const l=this.__childNodes||this.childNodes;for(;e<l.length;e++){t=l[e]["s-nr"];r=n.every((t=>!l[e][t]));if(t){{s.appendChild(t.cloneNode(true))}}if(r){s.appendChild(l[e].cloneNode(true))}}}return s}};var Oe=(e,t="")=>{{return()=>{}}};var xe=(e,t)=>{{return()=>{}}};var Re=(e,t)=>{if(e!=null&&!U(e)){if(t&4){return e==="false"?false:e===""||!!e}if(t&2){return parseFloat(e)}if(t&1){return String(e)}return e}return e};var De=e=>l(e).$hostElement$;var Te=(e,t,r)=>{const n=De(e);return{emit:e=>Ee(n,t,{bubbles:!!(r&4),composed:!!(r&2),cancelable:!!(r&1),detail:e})}};var Ee=(e,t,r)=>{const n=g.ce(t,r);e.dispatchEvent(n);return n};var Le=new WeakMap;var Ae=(e,t,r)=>{let n=v.get(e);if(C&&r){n=n||new CSSStyleSheet;if(typeof n==="string"){n=t}else{n.replaceSync(t)}}else{n=t}v.set(e,n)};var Fe=(e,t,r)=>{var n;const s=Pe(t);const l=v.get(s);e=e.nodeType===11?e:y;if(l){if(typeof l==="string"){e=e.head||e;let r=Le.get(e);let i;if(!r){Le.set(e,r=new Set)}if(!r.has(s)){{i=y.createElement("style");i.innerHTML=l;const r=(n=g.U)!=null?n:N(y);if(r!=null){i.setAttribute("nonce",r)}if(!(t.l&1)){if(e.nodeName==="HEAD"){const t=e.querySelectorAll("link[rel=preconnect]");const r=t.length>0?t[t.length-1].nextSibling:e.querySelector("style");e.insertBefore(i,r)}else if("host"in e){if(C){const t=new CSSStyleSheet;t.replaceSync(l);e.adoptedStyleSheets=[t,...e.adoptedStyleSheets]}else{const t=e.querySelector("style");if(t){t.innerHTML=l+t.innerHTML}else{e.prepend(i)}}}else{e.append(i)}}if(t.l&1&&e.nodeName!=="HEAD"){e.insertBefore(i,null)}}if(t.l&4){i.innerHTML+=h}if(r){r.add(s)}}}else if(!e.adoptedStyleSheets.includes(l)){e.adoptedStyleSheets=[...e.adoptedStyleSheets,l]}}return s};var Me=e=>{const t=e.i;const r=e.$hostElement$;const n=t.l;const s=Oe("attachStyles",t.m);const l=Fe(r.shadowRoot?r.shadowRoot:r.getRootNode(),t);if(n&10&&n&2){r["s-sc"]=l;r.classList.add(l+"-h")}s()};var Pe=(e,t)=>"sc-"+e.m;var Ue=(e,t)=>{if(t&&!e.N&&t["s-p"]){t["s-p"].push(new Promise((t=>e.N=t)))}};var Ne=(e,t)=>{{e.l|=16}if(e.l&4){e.l|=512;return}Ue(e,e.W);const r=()=>We(e,t);return L(r)};var We=(e,t)=>{const r=e.$hostElement$;const n=Oe("scheduleUpdate",e.i.m);const s=e.t;if(!s){throw new Error(`Can't render component <${r.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`)}let l;if(t){{e.l|=256;if(e.H){e.H.map((([e,t])=>Ge(s,e,t)));e.H=void 0}}{l=Ge(s,"componentWillLoad")}}else{{l=Ge(s,"componentWillUpdate")}}{l=He(l,(()=>Ge(s,"componentWillRender")))}n();return He(l,(()=>Be(e,s,t)))};var He=(e,t)=>ze(e)?e.then(t).catch((e=>{console.error(e);t()})):t();var ze=e=>e instanceof Promise||e&&e.then&&typeof e.then==="function";var Be=async(e,t,r)=>{var n;const s=e.$hostElement$;const l=Oe("update",e.i.m);const i=s["s-rc"];if(r){Me(e)}const o=Oe("render",e.i.m);{Ie(e,t,s,r)}if(i){i.map((e=>e()));s["s-rc"]=void 0}o();l();{const t=(n=s["s-p"])!=null?n:[];const r=()=>Qe(e);if(t.length===0){r()}else{Promise.all(t).then(r);e.l|=4;t.length=0}}};var Ie=(e,t,r,n)=>{try{t=t.render();{e.l&=~16}{e.l|=2}{{{Ce(e,t,n)}}}}catch(t){f(t,e.$hostElement$)}return null};var Qe=e=>{const t=e.i.m;const r=e.$hostElement$;const n=Oe("postUpdate",t);const s=e.t;const l=e.W;{Ge(s,"componentDidRender")}if(!(e.l&64)){e.l|=64;{Ke(r)}{Ge(s,"componentDidLoad")}n();{e.p(r);if(!l){qe()}}}else{{Ge(s,"componentDidUpdate")}n()}{e.v(r)}{if(e.N){e.N();e.N=void 0}if(e.l&512){E((()=>Ne(e,false)))}e.l&=~(4|512)}};var qe=t=>{{Ke(y.documentElement)}E((()=>Ee(b,"appload",{detail:{namespace:e}})))};var Ge=(e,t,r)=>{if(e&&e[t]){try{return e[t](r)}catch(e){f(e)}}return void 0};var Ke=e=>{var r;return e.classList.add((r=t.hydratedSelectorName)!=null?r:"hydrated")};var Ve=(e,t)=>l(e).o.get(t);var Xe=(e,t,r,n)=>{const s=l(e);if(!s){throw new Error(`Couldn't find host element for "${n.m}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/ionic-team/stencil/issues/5457).`)}const i=s.$hostElement$;const o=s.o.get(t);const a=s.l;const c=s.t;r=Re(r,n.B[t][0]);const u=Number.isNaN(o)&&Number.isNaN(r);const v=r!==o&&!u;if((!(a&8)||o===void 0)&&v){s.o.set(t,r);if(c){if(n.I&&a&128){const e=n.I[t];if(e){e.map((e=>{try{c[e](r,o,t)}catch(e){f(e,i)}}))}}if((a&(2|16))===2){Ne(s,false)}}}};var _e=(e,t,r)=>{var n,s;const i=e.prototype;if(t.l&64&&r&1){m.forEach((e=>{Object.defineProperty(i,e,{value(...t){const r=l(this);const n=r.t;if(!n){r.h.then((r=>{const n=r[e];typeof n==="function"&&n.call(r,...t)}))}else{const r=n[e];typeof r==="function"&&r.call(n,...t)}}})}))}if(t.B||(t.I||e.watchers)){if(e.watchers&&!t.I){t.I=e.watchers}const o=Object.entries((n=t.B)!=null?n:{});o.map((([e,[n]])=>{if(n&31||r&2&&n&32){if((n&2048)===0){Object.defineProperty(i,e,{get(){return Ve(this,e)},set(r){Xe(this,e,r,t)},configurable:true,enumerable:true})}else if(r&1&&n&2048){{Object.defineProperty(i,e,{get(){const t=l(this);const r=t?t.t:i;if(!r)return;return r[e]},configurable:true,enumerable:true})}if(n&4096){const r=Object.getOwnPropertyDescriptor(i,e).set;Object.defineProperty(i,e,{set(n){const s=l(this);if(r){const l=s.$hostElement$[e];if(!s.o.get(e)&&l){s.o.set(e,l)}r.apply(this,[Re(n,t.B[e][0])]);Xe(this,e,s.$hostElement$[e],t);return}if(!s)return;const i=()=>{const r=s.t[e];if(!s.o.get(e)&&r){s.o.set(e,r)}s.t[e]=Re(n,t.B[e][0]);Xe(this,e,s.t[e],t)};if(s.t){i()}else{s.h.then((()=>i()))}}})}}}else if(r&1&&n&64){Object.defineProperty(i,e,{value(...t){var r;const n=l(this);return(r=n==null?void 0:n.u)==null?void 0:r.then((()=>{var r;return(r=n.t)==null?void 0:r[e](...t)}))}})}}));if(r&1){const r=new Map;i.attributeChangedCallback=function(e,n,s){g.jmp((()=>{var o;const a=r.get(e);if(this.hasOwnProperty(a)){s=this[a];delete this[a]}else if(i.hasOwnProperty(a)&&typeof this[a]==="number"&&this[a]==s){return}else if(a==null){const r=l(this);const i=r==null?void 0:r.l;if(i&&!(i&8)&&i&128&&s!==n){const l=r.t;const i=(o=t.I)==null?void 0:o[e];i==null?void 0:i.forEach((t=>{if(l[t]!=null){l[t].call(l,s,n,e)}}))}return}const f=Object.getOwnPropertyDescriptor(i,a);if(!f.get||!!f.set){this[a]=s===null&&typeof this[a]==="boolean"?false:s}}))};e.observedAttributes=Array.from(new Set([...Object.keys((s=t.I)!=null?s:{}),...o.filter((([e,t])=>t[0]&15)).map((([e,n])=>{var s;const l=n[1]||e;r.set(l,e);if(n[0]&512){(s=t.P)==null?void 0:s.push([e,l])}return l}))]))}}return e};var Je=async(e,t,r,n)=>{let s;if((t.l&32)===0){t.l|=32;const n=r.$;if(n){const e=u(r);if(e&&"then"in e){const t=xe();s=await e;t()}else{s=e}if(!s){throw new Error(`Constructor for "${r.m}#${t.q}" was not found`)}if(!s.isProxied){{r.I=s.watchers}_e(s,r,2);s.isProxied=true}const n=Oe("createInstance",r.m);{t.l|=8}try{new s(t)}catch(e){f(e)}{t.l&=~8}{t.l|=128}n();Ye(t.t)}else{s=e.constructor;const r=e.localName;customElements.whenDefined(r).then((()=>t.l|=128))}if(s&&s.style){let e;if(typeof s.style==="string"){e=s.style}const t=Pe(r);if(!v.has(t)){const n=Oe("registerStyles",r.m);Ae(t,e,!!(r.l&1));n()}}}const l=t.W;const i=()=>Ne(t,true);if(l&&l["s-rc"]){l["s-rc"].push(i)}else{i()}};var Ye=e=>{{Ge(e,"connectedCallback")}};var Ze=e=>{if((g.l&1)===0){const t=l(e);const r=t.i;const n=Oe("connectedCallback",r.m);if(!(t.l&1)){t.l|=1;{if(r.l&(4|8)){et(e)}}{let r=e;while(r=r.parentNode||r.host){if(r["s-p"]){Ue(t,t.W=r);break}}}if(r.B){Object.entries(r.B).map((([t,[r]])=>{if(r&31&&e.hasOwnProperty(t)){const r=e[t];delete e[t];e[t]=r}}))}{Je(e,t,r)}}else{st(e,t,r.G);if(t==null?void 0:t.t){Ye(t.t)}else if(t==null?void 0:t.h){t.h.then((()=>Ye(t.t)))}}n()}};var et=e=>{const t=e["s-cr"]=y.createComment("");t["s-cn"]=true;ke(e,t,e.firstChild)};var tt=e=>{{Ge(e,"disconnectedCallback")}};var rt=async e=>{if((g.l&1)===0){const t=l(e);{if(t.K){t.K.map((e=>e()));t.K=void 0}}if(t==null?void 0:t.t){tt(t.t)}else if(t==null?void 0:t.h){t.h.then((()=>tt(t.t)))}}};var nt=(e,t={})=>{var r;const n=Oe();const s=[];const i=t.exclude||[];const a=b.customElements;const f=y.head;const c=f.querySelector("meta[charset]");const u=y.createElement("style");const v=[];let p;let m=true;Object.assign(g,t);g.S=new URL(t.resourcesUrl||"./",y.baseURI).href;let w=false;e.map((e=>{e[1].map((t=>{var r;const n={l:t[0],m:t[1],B:t[2],G:t[3]};if(n.l&4){w=true}{n.B=t[2]}{n.G=t[3]}{n.P=[]}{n.I=(r=t[4])!=null?r:{}}const f=n.m;const c=class extends HTMLElement{constructor(e){super(e);this.hasRegisteredEventListeners=false;e=this;o(e,n);if(n.l&1){{if(!e.shadowRoot){{e.attachShadow({mode:"open",delegatesFocus:!!(n.l&16)})}}else{if(e.shadowRoot.mode!=="open"){throw new Error(`Unable to re-use existing shadow root for ${n.m}! Mode is set to ${e.shadowRoot.mode} but Stencil only supports open shadow roots.`)}}}}}connectedCallback(){const e=l(this);if(!this.hasRegisteredEventListeners){this.hasRegisteredEventListeners=true;st(this,e,n.G)}if(p){clearTimeout(p);p=null}if(m){v.push(this)}else{g.jmp((()=>Ze(this)))}}disconnectedCallback(){g.jmp((()=>rt(this)))}componentOnReady(){return l(this).h}};{{je(c.prototype)}}if(n.l&64){c.formAssociated=true}n.$=e[0];if(!i.includes(f)&&!a.get(f)){s.push(f);a.define(f,_e(c,n,1))}}))}));if(s.length>0){if(w){u.textContent+=h}{u.textContent+=s.sort()+d}if(u.innerHTML.length){u.setAttribute("data-styles","");const e=(r=g.U)!=null?r:N(y);if(e!=null){u.setAttribute("nonce",e)}f.insertBefore(u,c?c.nextSibling:f.firstChild)}}m=false;if(v.length){v.map((e=>e.connectedCallback()))}else{{g.jmp((()=>p=setTimeout(qe,30)))}}n()};var st=(e,t,r,n)=>{if(r){r.map((([r,n,s])=>{const l=it(e,r);const i=lt(t,s);const o=ot(r);g.ael(l,n,i,o);(t.K=t.K||[]).push((()=>g.rel(l,n,i,o)))}))}};var lt=(e,t)=>r=>{var n;try{{if(e.l&256){(n=e.t)==null?void 0:n[t](r)}else{(e.H=e.H||[]).push([t,r])}}}catch(e){f(e)}};var it=(e,t)=>{if(t&4)return y;if(t&8)return b;if(t&16)return y.body;return e};var ot=e=>S?{passive:(e&1)!==0,capture:(e&2)!==0}:(e&2)!==0;var at=e=>g.U=e;export{w as H,K as a,nt as b,Te as c,De as g,q as h,k as p,i as r,at as s};
+//# sourceMappingURL=p-6b122987.js.map