@infineon/infineon-design-system-stencil 39.4.4-canary.0 → 39.5.0--canary.2134.ef608256dd1abad1333d432c8cc2958560d19738.0

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

@@ -0,0 +1 @@
+{"version":3,"names":["filterTypeGroupCss","IfxFilterTypeGroup","constructor","hostRef","this","selectedOptions","handleResetEvent","accordionSlot","el","shadowRoot","querySelector","filterAccordionSlottedElements","assignedElements","flatten","forEach","accordionElement","ifxLists","querySelectorAll","ifxListElement","resetTrigger","filterSearchSlot","filterSearchSlottedElements","filterSearchWrapper","filterSearch","searchField","length","searchFieldElement","value","ifxSidebarFilterChange","emit","handleUpdateSidebarFilter","event","filterName","detail","getAttribute","searchSlot","assignedNodes","searchElement","nodeType","Node","ELEMENT_NODE","filterSearchComponent","firstElementChild","setAttribute","dispatchEvent","CustomEvent","bubbles","composed","newSelectedOptions","map","option","filterGroupName","Object","assign","selectedItems","handleAccordionChange","handleFilterChange","handleSearchChange","type","filterValue","existingOptionIndex","findIndex","push","connectedCallback","addEventListener","window","componentWillUnload","removeEventListener","render","h","Host","key","class","name"],"sources":["src/components/table-advanced-version/filter-type-group/filter-type-group.scss?tag=ifx-filter-type-group&encapsulation=shadow","src/components/table-advanced-version/filter-type-group/filter-type-group.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n\n:host {\n  display: flex;\n}\n\n.filter-type-group {\n  width: 260px;\n  align-items: flex-start;\n  gap: tokens.$ifxSpace100;\n}\n\n.filter-type-group > ::slotted(*) {\n  margin-bottom: 8px;\n}\n\n","import { Component, h, State, Event, EventEmitter, Element, Host } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-filter-type-group',\n  styleUrl: 'filter-type-group.scss',\n  shadow: true,\n})\nexport class IfxFilterTypeGroup {\n  @Element() el: HTMLElement;\n  @State() selectedOptions: Array<{ filterGroupName: string, selectedItems?: Array<{ filterName: string, value: boolean | string }>, value?: string }> = [];\n  @Event() ifxSidebarFilterChange: EventEmitter;\n\n\n\n  /* If the component is ever removed and then reattached to the DOM, \n  connectedCallback ensures that the event listeners are properly set up again */\n  connectedCallback() {\n    this.el.addEventListener('ifxFilterAccordionChange', this.handleAccordionChange);\n    this.el.addEventListener('ifxFilterSearchChange', this.handleSearchChange);\n    window.addEventListener('ifxResetFiltersEvent', this.handleResetEvent);\n    window.addEventListener('ifxUpdateSidebarFilter', this.handleUpdateSidebarFilter);\n   }\n\n\n  componentWillUnload() {\n    this.el.removeEventListener('ifxFilterAccordionChange', this.handleAccordionChange);\n    this.el.removeEventListener('ifxFilterSearchChange', this.handleSearchChange);\n    window.removeEventListener('ifxResetFiltersEvent', this.handleResetEvent);\n  }\n\n  handleResetEvent = () => {\n    const accordionSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-accordion\"]');\n    const filterAccordionSlottedElements = (accordionSlot as HTMLSlotElement).assignedElements({ flatten: true });\n\n\n    filterAccordionSlottedElements.forEach(accordionElement => {\n      const ifxLists = accordionElement.querySelectorAll('ifx-list');\n\n      ifxLists.forEach((ifxListElement: HTMLIfxListElement) => {\n        ifxListElement.resetTrigger = !ifxListElement.resetTrigger;\n      });\n    });\n\n    const filterSearchSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-search\"]');\n    const filterSearchSlottedElements = (filterSearchSlot as HTMLSlotElement).assignedElements({ flatten: true });\n\n    filterSearchSlottedElements.forEach((filterSearchWrapper: HTMLElement) => {\n      const filterSearch = filterSearchWrapper.querySelector('ifx-filter-search');\n\n      const searchField = filterSearch.shadowRoot.querySelectorAll('ifx-search-field')\n\n      if (searchField.length > 0) {\n        searchField.forEach((searchFieldElement: any) => {\n          searchFieldElement.value = '';\n        });\n\n      }\n    });\n\n    this.selectedOptions = [];\n\n    // Emit the change to inform any parent components that the filters have been reset\n    this.ifxSidebarFilterChange.emit(this.selectedOptions);\n  }\n\n  handleUpdateSidebarFilter = (event: CustomEvent) => {\n    const { filterName } = event.detail;\n\n    const accordionSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-accordion\"]');\n    const filterAccordionSlottedElements = accordionSlot ? (accordionSlot as HTMLSlotElement).assignedElements({ flatten: true }) : [];\n\n    filterAccordionSlottedElements.forEach(accordionElement => {\n      const ifxLists = accordionElement.querySelectorAll('ifx-list');\n\n      ifxLists.forEach((ifxListElement: HTMLIfxListElement) => {\n        if (ifxListElement.getAttribute('name') === filterName) {\n          ifxListElement.resetTrigger = !ifxListElement.resetTrigger;\n        }\n      });\n    });\n\n    // Clear the search bar within the filter-search slot\n    const searchSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-search\"]');\n    const filterSearchSlottedElements = searchSlot ? (searchSlot as HTMLSlotElement).assignedNodes({ flatten: true }) : [];\n  \n    filterSearchSlottedElements.forEach(searchElement => {\n      if (searchElement.nodeType === Node.ELEMENT_NODE) {\n        // Identify the ifx-filter-search component within the slot\n        const filterSearchComponent = searchElement as HTMLElement;\n          const searchField: any = filterSearchComponent.firstElementChild;\n          if (searchField) {\n             searchField.setAttribute('value', '');\n            searchField.dispatchEvent(new CustomEvent('ifxInput', { bubbles: true, composed: true, detail: '' })); // Trigger ifxInput event to reset\n          }\n        \n      }\n    });\n\n    const newSelectedOptions = this.selectedOptions.map(option => {\n      if (option.filterGroupName === filterName) {\n        return { ...option, selectedItems: [], value: '' };\n      }\n      return option;\n    });\n\n    this.selectedOptions = newSelectedOptions;\n\n    this.ifxSidebarFilterChange.emit(this.selectedOptions);\n  }\n\n\n  handleAccordionChange = (event: CustomEvent) => {\n    this.handleFilterChange(event);\n  }\n\n  handleSearchChange = (event: CustomEvent) => {\n    // Call handleFilterChange with the created CustomEvent object\n    this.handleFilterChange(event);\n  }\n\n\n  handleFilterChange = (event: CustomEvent) => {\n    // Create a new array to hold the new state\n    const newSelectedOptions = [...this.selectedOptions];\n\n    // Check the type of the event\n    if (event.type === 'ifxFilterSearchChange') {\n      // Handle the ifxFilterSearchChange event\n      const { filterName, filterValue } = event.detail;\n\n      // Find the existing filter with the same filterName\n      const existingOptionIndex = newSelectedOptions.findIndex(option => typeof option !== 'string' && option.filterGroupName === filterName);\n\n      if (existingOptionIndex !== -1) {\n        // If an existing filter is found, update its value\n        newSelectedOptions[existingOptionIndex].value = filterValue;\n      } else {\n        // If no existing filter is found, append the new filter\n        newSelectedOptions.push({ filterGroupName: filterName, value: filterValue });\n      }\n    } else if (event.type === 'ifxFilterAccordionChange') {\n      const { filterGroupName, selectedItems } = event.detail;\n\n      // Find the existing filter group with the same filterGroupName\n      const existingOptionIndex = newSelectedOptions.findIndex(option => option.filterGroupName === filterGroupName);\n\n      if (existingOptionIndex !== -1) {\n        // If an existing filter group is found, update its selectedItems\n        newSelectedOptions[existingOptionIndex] = { filterGroupName, selectedItems };\n      } else {\n        // If no existing filter group is found, append the new filter group\n        newSelectedOptions.push({ filterGroupName, selectedItems });\n      }\n    }\n\n    // Update the state with the new selected options\n    this.selectedOptions = newSelectedOptions;\n\n    // Emit the entire selectedOptions array\n    this.ifxSidebarFilterChange.emit(this.selectedOptions);\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"filter-type-group\">\n          <slot name=\"filter-search\" />\n          <slot name=\"filter-accordion\" />\n        </div>\n      </Host>\n    );\n  }\n}"],"mappings":"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","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"names":["setFilterCss","SetFilter","constructor","hostRef","this","type","filterValues","handleTextInputChange","event","target","value","ifxFilterSelect","emit","filterName","handleSingleSelectChange","detail","handleMultiselectOptionChange","map","option","label","render","optionsArray","options","JSON","parse","e","console","error","Array","isArray","h","disabled","placeholder","onIfxInput","filterLabel","onIfxSelect"],"sources":["src/components/table-advanced-version/set-filter/set-filter.scss?tag=ifx-set-filter&encapsulation=shadow","src/components/table-advanced-version/set-filter/setFilter.tsx"],"sourcesContent":["/* set-filter.css */\r\n\r\n","// SetFilter.tsx\r\nimport { Component, h, Event, EventEmitter, Prop, State } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'ifx-set-filter',\r\n  styleUrl: 'set-filter.scss',\r\n  shadow: true\r\n})\r\nexport class SetFilter {\r\n  @Prop() filterName: string;\r\n  @Prop() filterLabel: string;\r\n  @Prop() placeholder: string;\r\n  @Prop() type: 'text' | 'single-select' | 'multi-select' = 'text';\r\n  @Prop() options: any[] | string;\r\n  @State() filterValues: string[] = [];\r\n\r\n  @Event() ifxFilterSelect: EventEmitter;\r\n\r\n\r\n  handleTextInputChange(event: Event) {\r\n    const target = event.target as HTMLInputElement;\r\n    const value = target.value;\r\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\r\n\r\n  }\r\n\r\n  handleSingleSelectChange(event: CustomEvent) {\r\n    const value = event.detail.value;\r\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\r\n  }\r\n\r\n\r\n  handleMultiselectOptionChange(event: CustomEvent) {\r\n    this.filterValues = event.detail.map(option => ({\r\n      label: option.value,\r\n      value: option.value\r\n    }));\r\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: this.filterValues, type: this.type });\r\n  }\r\n\r\n\r\n  render() {\r\n    let optionsArray = [];\r\n\r\n    // Parse options if it's a string\r\n    if (typeof this.options === 'string') {\r\n      try {\r\n        optionsArray = JSON.parse(this.options);\r\n      } catch (e) {\r\n        console.error('Failed to parse options:', e);\r\n        optionsArray = [];\r\n      }\r\n    } else if (Array.isArray(this.options)) {\r\n      optionsArray = this.options;\r\n    }\r\n\r\n    switch (this.type) {\r\n      case 'text':\r\n        return (\r\n          <ifx-text-field error={false} disabled={false} placeholder={this.placeholder}\r\n            onIfxInput={event => this.handleTextInputChange(event)}\r\n          >{this.filterLabel}</ifx-text-field>\r\n        );\r\n      case 'single-select':\r\n        return (\r\n          <ifx-select\r\n            placeholder=\"true\"\r\n            search-enabled=\"true\"\r\n            search-placeholder-value=\"Search...\"\r\n            onIfxSelect={event => this.handleSingleSelectChange(event)}\r\n            ifx-placeholder-value={this.placeholder}\r\n            ifx-label={this.filterLabel}\r\n            ifx-options={this.options}\r\n          ></ifx-select>\r\n        );\r\n      case 'multi-select':\r\n        return (\r\n          <ifx-multiselect\r\n            label={this.filterLabel}\r\n            placeholder={this.placeholder}\r\n            onIfxSelect={event => this.handleMultiselectOptionChange(event)}\r\n          >\r\n            {optionsArray.map(option => (\r\n              <ifx-multiselect-option value={option.value || option}>\r\n                {option.label || option}\r\n              </ifx-multiselect-option>\r\n            ))}\r\n          </ifx-multiselect>\r\n        );\r\n      default:\r\n        return null;\r\n    }\r\n  }\r\n}\r\n\r\n"],"mappings":"kDAAA,MAAMA,EAAe,G,MCQRC,EAAS,MALtB,WAAAC,CAAAC,G,2DASUC,KAAIC,KAA8C,OAEjDD,KAAYE,aAAa,EA+EnC,CA1EC,qBAAAC,CAAsBC,GACpB,MAAMC,EAASD,EAAMC,OACrB,MAAMC,EAAQD,EAAOC,MACrBN,KAAKO,gBAAgBC,KAAK,CAAEC,WAAYT,KAAKS,WAAYP,aAAc,CAACI,GAAQL,KAAMD,KAAKC,M,CAI7F,wBAAAS,CAAyBN,GACvB,MAAME,EAAQF,EAAMO,OAAOL,MAC3BN,KAAKO,gBAAgBC,KAAK,CAAEC,WAAYT,KAAKS,WAAYP,aAAc,CAACI,GAAQL,KAAMD,KAAKC,M,CAI7F,6BAAAW,CAA8BR,GAC5BJ,KAAKE,aAAeE,EAAMO,OAAOE,KAAIC,IAAM,CACzCC,MAAOD,EAAOR,MACdA,MAAOQ,EAAOR,UAEhBN,KAAKO,gBAAgBC,KAAK,CAAEC,WAAYT,KAAKS,WAAYP,aAAcF,KAAKE,aAAcD,KAAMD,KAAKC,M,CAIvG,MAAAe,GACE,IAAIC,EAAe,GAGnB,UAAWjB,KAAKkB,UAAY,SAAU,CACpC,IACED,EAAeE,KAAKC,MAAMpB,KAAKkB,Q,CAC/B,MAAOG,GACPC,QAAQC,MAAM,2BAA4BF,GAC1CJ,EAAe,E,OAEZ,GAAIO,MAAMC,QAAQzB,KAAKkB,SAAU,CACtCD,EAAejB,KAAKkB,O,CAGtB,OAAQlB,KAAKC,MACX,IAAK,OACH,OACEyB,EAAA,kBAAgBH,MAAO,MAAOI,SAAU,MAAOC,YAAa5B,KAAK4B,YAC/DC,WAAYzB,GAASJ,KAAKG,sBAAsBC,IAChDJ,KAAK8B,aAEX,IAAK,gBACH,OACEJ,EACE,cAAAE,YAAY,OAAM,iBACH,OAAM,2BACI,YACzBG,YAAa3B,GAASJ,KAAKU,yBAAyBN,GAAM,wBACnCJ,KAAK4B,YACjB,YAAA5B,KAAK8B,YAAW,cACd9B,KAAKkB,UAGxB,IAAK,eACH,OACEQ,EACE,mBAAAX,MAAOf,KAAK8B,YACZF,YAAa5B,KAAK4B,YAClBG,YAAa3B,GAASJ,KAAKY,8BAA8BR,IAExDa,EAAaJ,KAAIC,GAChBY,EAAwB,0BAAApB,MAAOQ,EAAOR,OAASQ,GAC5CA,EAAOC,OAASD,MAK3B,QACE,OAAO,K","ignoreList":[]}
+{"version":3,"names":["setFilterCss","SetFilter","constructor","hostRef","this","type","filterValues","handleTextInputChange","event","target","value","ifxFilterSelect","emit","filterName","handleSingleSelectChange","detail","handleMultiselectOptionChange","map","option","label","render","optionsArray","options","JSON","parse","e","console","error","Array","isArray","h","disabled","placeholder","onIfxInput","filterLabel","onIfxSelect"],"sources":["src/components/table-advanced-version/set-filter/set-filter.scss?tag=ifx-set-filter&encapsulation=shadow","src/components/table-advanced-version/set-filter/setFilter.tsx"],"sourcesContent":["/* set-filter.css */\n\n","// SetFilter.tsx\nimport { Component, h, Event, EventEmitter, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-set-filter',\n  styleUrl: 'set-filter.scss',\n  shadow: true\n})\nexport class SetFilter {\n  @Prop() filterName: string;\n  @Prop() filterLabel: string;\n  @Prop() placeholder: string;\n  @Prop() type: 'text' | 'single-select' | 'multi-select' = 'text';\n  @Prop() options: any[] | string;\n  @State() filterValues: string[] = [];\n\n  @Event() ifxFilterSelect: EventEmitter;\n\n\n  handleTextInputChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n    const value = target.value;\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\n\n  }\n\n  handleSingleSelectChange(event: CustomEvent) {\n    const value = event.detail.value;\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\n  }\n\n\n  handleMultiselectOptionChange(event: CustomEvent) {\n    this.filterValues = event.detail.map(option => ({\n      label: option.value,\n      value: option.value\n    }));\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: this.filterValues, type: this.type });\n  }\n\n\n  render() {\n    let optionsArray = [];\n\n    // Parse options if it's a string\n    if (typeof this.options === 'string') {\n      try {\n        optionsArray = JSON.parse(this.options);\n      } catch (e) {\n        console.error('Failed to parse options:', e);\n        optionsArray = [];\n      }\n    } else if (Array.isArray(this.options)) {\n      optionsArray = this.options;\n    }\n\n    switch (this.type) {\n      case 'text':\n        return (\n          <ifx-text-field error={false} disabled={false} placeholder={this.placeholder}\n            onIfxInput={event => this.handleTextInputChange(event)}\n          >{this.filterLabel}</ifx-text-field>\n        );\n      case 'single-select':\n        return (\n          <ifx-select\n            placeholder=\"true\"\n            search-enabled=\"true\"\n            search-placeholder-value=\"Search...\"\n            onIfxSelect={event => this.handleSingleSelectChange(event)}\n            ifx-placeholder-value={this.placeholder}\n            ifx-label={this.filterLabel}\n            ifx-options={this.options}\n          ></ifx-select>\n        );\n      case 'multi-select':\n        return (\n          <ifx-multiselect\n            label={this.filterLabel}\n            placeholder={this.placeholder}\n            onIfxSelect={event => this.handleMultiselectOptionChange(event)}\n          >\n            {optionsArray.map(option => (\n              <ifx-multiselect-option value={option.value || option}>\n                {option.label || option}\n              </ifx-multiselect-option>\n            ))}\n          </ifx-multiselect>\n        );\n      default:\n        return null;\n    }\n  }\n}\n\n"],"mappings":"kDAAA,MAAMA,EAAe,G,MCQRC,EAAS,MALtB,WAAAC,CAAAC,G,2DASUC,KAAIC,KAA8C,OAEjDD,KAAYE,aAAa,EA+EnC,CA1EC,qBAAAC,CAAsBC,GACpB,MAAMC,EAASD,EAAMC,OACrB,MAAMC,EAAQD,EAAOC,MACrBN,KAAKO,gBAAgBC,KAAK,CAAEC,WAAYT,KAAKS,WAAYP,aAAc,CAACI,GAAQL,KAAMD,KAAKC,M,CAI7F,wBAAAS,CAAyBN,GACvB,MAAME,EAAQF,EAAMO,OAAOL,MAC3BN,KAAKO,gBAAgBC,KAAK,CAAEC,WAAYT,KAAKS,WAAYP,aAAc,CAACI,GAAQL,KAAMD,KAAKC,M,CAI7F,6BAAAW,CAA8BR,GAC5BJ,KAAKE,aAAeE,EAAMO,OAAOE,KAAIC,IAAM,CACzCC,MAAOD,EAAOR,MACdA,MAAOQ,EAAOR,UAEhBN,KAAKO,gBAAgBC,KAAK,CAAEC,WAAYT,KAAKS,WAAYP,aAAcF,KAAKE,aAAcD,KAAMD,KAAKC,M,CAIvG,MAAAe,GACE,IAAIC,EAAe,GAGnB,UAAWjB,KAAKkB,UAAY,SAAU,CACpC,IACED,EAAeE,KAAKC,MAAMpB,KAAKkB,Q,CAC/B,MAAOG,GACPC,QAAQC,MAAM,2BAA4BF,GAC1CJ,EAAe,E,OAEZ,GAAIO,MAAMC,QAAQzB,KAAKkB,SAAU,CACtCD,EAAejB,KAAKkB,O,CAGtB,OAAQlB,KAAKC,MACX,IAAK,OACH,OACEyB,EAAA,kBAAgBH,MAAO,MAAOI,SAAU,MAAOC,YAAa5B,KAAK4B,YAC/DC,WAAYzB,GAASJ,KAAKG,sBAAsBC,IAChDJ,KAAK8B,aAEX,IAAK,gBACH,OACEJ,EACE,cAAAE,YAAY,OAAM,iBACH,OAAM,2BACI,YACzBG,YAAa3B,GAASJ,KAAKU,yBAAyBN,GAAM,wBACnCJ,KAAK4B,YACjB,YAAA5B,KAAK8B,YAAW,cACd9B,KAAKkB,UAGxB,IAAK,eACH,OACEQ,EACE,mBAAAX,MAAOf,KAAK8B,YACZF,YAAa5B,KAAK4B,YAClBG,YAAa3B,GAASJ,KAAKY,8BAA8BR,IAExDa,EAAaJ,KAAIC,GAChBY,EAAwB,0BAAApB,MAAOQ,EAAOR,OAASQ,GAC5CA,EAAOC,OAASD,MAK3B,QACE,OAAO,K","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as t,c as s,h as a,a as e}from"./p-PqnYwNKt.js";const r=":host{display:block}";const i=class{constructor(a){t(this,a);this.tabHeaderChange=s(this,"tabHeaderChange",7);this.icon="";this.iconPosition="left"}componentWillUpdate(){this.tabHeaderChange.emit(this.header)}render(){return a("slot",{key:"dad01fbbf74d672ac8755a57cf6a31b18b4de550"})}get el(){return e(this)}};i.style=r;export{i as ifx_tab};
+//# sourceMappingURL=p-94dfe026.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["tabCss","IfxTab","constructor","hostRef","this","icon","iconPosition","componentWillUpdate","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,uB,MCOFC,EAAM,MALnB,WAAAC,CAAAC,G,2DASUC,KAAIC,KAAW,GACfD,KAAYE,aAAqB,MAU1C,CAPC,mBAAAC,GACEH,KAAKI,gBAAgBC,KAAKL,KAAKM,O,CAGjC,MAAAC,GACE,OAAOC,EAAA,QAAAC,IAAA,4C","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-7cf9f8a3.entry.js → p-9517d1b0.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as a,h as t,a as s}from"./p-PqnYwNKt.js";import{d as i,t as l}from"./p-DcmcuUOA.js";import{i as r}from"./p-Bw2fh5LT.js";const d=':host{display:block}.tree-view{font-family:var(--ifx-font-family, sans-serif);font-size:14px;color:var(--ifx-color-text, #1a1a1a);display:flex;flex-wrap:wrap;flex-direction:column;overflow-x:auto;overflow-y:hidden}.tree-view__label{font:600 1.125rem/1.625rem "Source Sans 3";margin-bottom:8px}';const n=class{constructor(t){e(this,t);this.ifxTreeViewExpandAllChange=a(this,"ifxTreeViewExpandAllChange",7);this.ifxTreeViewDisableAllChange=a(this,"ifxTreeViewDisableAllChange",7);this.disableAllItems=false;this.expandAllItems=false;this.handleSlotRef=e=>{if(e){if(this.disableAllItems){e.setAttribute("data-disable-all-items","true")}else{e.removeAttribute("data-disable-all-items")}if(this.expandAllItems){e.setAttribute("data-expand-all-items","true")}else{e.removeAttribute("data-expand-all-items")}}}}handleExpandAllItemsChange(e){this.ifxTreeViewExpandAllChange.emit(e)}handleDisableAllItemsChange(e){this.ifxTreeViewDisableAllChange.emit(e)}async componentDidLoad(){if(!r(this.el)){const e=i();l("ifx-tree-view",await e)}}render(){return t("div",{key:"aba162fba2a38dd4db22ed431781a043df9164d3",class:`tree-view ${this.disableAllItems?" tree-view--disabled":""}`,role:"tree","aria-label":this.ariaLabel},this.label&&this.label.trim()!==""&&t("div",{key:"4c145a78864804bf55c39961e6171658b822f8df",class:"tree-view__label"},this.label),t("slot",{key:"9597e6f0faacbca5b3f2d63b643c7cd8e95eb75d",ref:this.handleSlotRef}))}get el(){return s(this)}static get watchers(){return{expandAllItems:["handleExpandAllItemsChange"],disableAllItems:["handleDisableAllItemsChange"]}}};n.style=d;export{n as ifx_tree_view};
-//# sourceMappingURL=p-7cf9f8a3.entry.js.map
+import{r as e,c as a,h as t,a as s}from"./p-PqnYwNKt.js";import{d as i,t as l}from"./p-DcmcuUOA.js";import{i as r}from"./p-Bw2fh5LT.js";const d=':host{display:block}.tree-view{font-family:var(--ifx-font-family, sans-serif);font-size:14px;color:var(--ifx-color-text, #1a1a1a);display:flex;flex-wrap:wrap;flex-direction:column;overflow-x:auto;overflow-y:hidden}.tree-view__label{font:600 1.125rem/1.625rem "Source Sans 3";margin-bottom:8px}';const n=class{constructor(t){e(this,t);this.ifxTreeViewExpandAllChange=a(this,"ifxTreeViewExpandAllChange",7);this.ifxTreeViewDisableAllChange=a(this,"ifxTreeViewDisableAllChange",7);this.disableAllItems=false;this.expandAllItems=false;this.handleSlotRef=e=>{if(e){if(this.disableAllItems){e.setAttribute("data-disable-all-items","true")}else{e.removeAttribute("data-disable-all-items")}if(this.expandAllItems){e.setAttribute("data-expand-all-items","true")}else{e.removeAttribute("data-expand-all-items")}}}}handleExpandAllItemsChange(e){this.ifxTreeViewExpandAllChange.emit(e)}handleDisableAllItemsChange(e){this.ifxTreeViewDisableAllChange.emit(e)}async componentDidLoad(){if(!r(this.el)){const e=i();l("ifx-tree-view",await e)}}render(){return t("div",{key:"d8339646d8f0aab7afd0a0c75423b03106c5eb1f",class:`tree-view ${this.disableAllItems?" tree-view--disabled":""}`,role:"tree","aria-label":this.ariaLabel},this.label&&this.label.trim()!==""&&t("div",{key:"010f9c98e9c17b4d6be10d886dce7738dc094a55",class:"tree-view__label"},this.label),t("slot",{key:"d09ddb739ede79d1b22ec390510444783cc2e8fc",ref:this.handleSlotRef}))}get el(){return s(this)}static get watchers(){return{expandAllItems:["handleExpandAllItemsChange"],disableAllItems:["handleDisableAllItemsChange"]}}};n.style=d;export{n as ifx_tree_view};
+//# sourceMappingURL=p-9517d1b0.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["treeViewCss","TreeView","constructor","hostRef","this","disableAllItems","expandAllItems","handleSlotRef","el","setAttribute","removeAttribute","handleExpandAllItemsChange","newValue","ifxTreeViewExpandAllChange","emit","handleDisableAllItemsChange","ifxTreeViewDisableAllChange","componentDidLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","render","h","key","class","role","ariaLabel","label","trim","ref"],"sources":["src/components/tree-view/tree-view.scss?tag=ifx-tree-view&encapsulation=shadow","src/components/tree-view/tree-view.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n  display: block;\n}\n\n.tree-view {\n  font-family: var(--ifx-font-family, sans-serif);\n  font-size: 14px;\n  color: var(--ifx-color-text, #1a1a1a);\n\n  display: flex;\n  flex-wrap: wrap;\n  flex-direction: column;\n  overflow-x: auto;\n  overflow-y: hidden;\n\n  &__label {\n    font: tokens.$ifxHeadingHeading06;\n    margin-bottom: tokens.$ifxSpace100;\n  }\n}\n","import { Component, h, Prop, Event, EventEmitter, Watch, Element } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n  tag: 'ifx-tree-view',\n  styleUrl: 'tree-view.scss',\n  shadow: true,\n})\nexport class TreeView {\n  @Element() el: HTMLElement;\n  @Prop() label?: string;\n  @Prop() disableAllItems: boolean = false;\n  @Prop() expandAllItems: boolean = false;\n  @Prop() ariaLabel: string | null;\n\n  @Event() ifxTreeViewExpandAllChange: EventEmitter<boolean>;\n  @Event() ifxTreeViewDisableAllChange: EventEmitter<boolean>;\n\n  @Watch('expandAllItems')\n  handleExpandAllItemsChange(newValue: boolean) {\n    this.ifxTreeViewExpandAllChange.emit(newValue);\n  }\n\n  @Watch('disableAllItems')\n  handleDisableAllItemsChange(newValue: boolean) {\n    this.ifxTreeViewDisableAllChange.emit(newValue);\n  }\n\n  private handleSlotRef = (el: HTMLSlotElement | null) => {\n    if (el) {\n      if (this.disableAllItems) {\n        el.setAttribute('data-disable-all-items', 'true');\n      } else {\n        el.removeAttribute('data-disable-all-items');\n      }\n      if (this.expandAllItems) {\n        el.setAttribute('data-expand-all-items', 'true');\n      } else {\n        el.removeAttribute('data-expand-all-items');\n      }\n    }\n  };\n\n  async componentDidLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-tree-view', await framework)\n    }\n  }\n\n  render() {\n    return (\n      <div\n        class={`tree-view ${this.disableAllItems ? ' tree-view--disabled' : ''}`}\n        role=\"tree\"\n        aria-label={this.ariaLabel}\n      >\n        {this.label && this.label.trim() !== '' && <div class=\"tree-view__label\">{this.label}</div>}\n        <slot ref={this.handleSlotRef}></slot>\n      </div>\n    );\n  }\n}\n"],"mappings":"wIAAA,MAAMA,EAAc,wS,MCUPC,EAAQ,MALrB,WAAAC,CAAAC,G,0JAQUC,KAAeC,gBAAY,MAC3BD,KAAcE,eAAY,MAgB1BF,KAAAG,cAAiBC,IACvB,GAAIA,EAAI,CACN,GAAIJ,KAAKC,gBAAiB,CACxBG,EAAGC,aAAa,yBAA0B,O,KACrC,CACLD,EAAGE,gBAAgB,yB,CAErB,GAAIN,KAAKE,eAAgB,CACvBE,EAAGC,aAAa,wBAAyB,O,KACpC,CACLD,EAAGE,gBAAgB,wB,GAwB1B,CA3CC,0BAAAC,CAA2BC,GACzBR,KAAKS,2BAA2BC,KAAKF,E,CAIvC,2BAAAG,CAA4BH,GAC1BR,KAAKY,4BAA4BF,KAAKF,E,CAkBxC,sBAAMK,GACJ,IAAIC,EAAuBd,KAAKI,IAAK,CACnC,MAAMW,EAAYC,IAClBC,EAAe,sBAAuBF,E,EAI1C,MAAAG,GACE,OACEC,EACE,OAAAC,IAAA,2CAAAC,MAAO,aAAarB,KAAKC,gBAAkB,uBAAyB,KACpEqB,KAAK,OAAM,aACCtB,KAAKuB,WAEhBvB,KAAKwB,OAASxB,KAAKwB,MAAMC,SAAW,IAAMN,EAAA,OAAAC,IAAA,2CAAKC,MAAM,oBAAoBrB,KAAKwB,OAC/EL,EAAM,QAAAC,IAAA,2CAAAM,IAAK1B,KAAKG,gB","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-81289e5f.entry.js → p-97b2ac42.entry.js}

@@ -1,2 +1,2 @@
-import{r as o,h as t,a as i,c as e}from"./p-PqnYwNKt.js";import{d as n,t as r}from"./p-DcmcuUOA.js";import{i as c}from"./p-Bw2fh5LT.js";const s=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{display:block}.accordion-wrapper{display:flex;flex-direction:column;gap:8px;font-family:var(--ifx-font-family)}';const a=class{constructor(t){o(this,t);this.autoCollapse=false}async componentDidLoad(){if(!c(this.el)){const o=n();r("ifx-accordion",await o)}}async onItemOpen(o){if(this.autoCollapse){const t=Array.from(this.el.querySelectorAll("ifx-accordion-item"));for(const i of t){const t=i;if(t!==o.target&&await t.open){t.open=false}}}}render(){return t("div",{key:"9e32f92c7a61c58a537e033e48c57770c4fa60d4",class:"accordion-wrapper"},t("slot",{key:"ec234435886b3271ce2f2712f3e3f54fa3dca8ff"}))}static get delegatesFocus(){return true}get el(){return i(this)}};a.style=s;const d=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.accordion-item{border-radius:3px;transition:all 0.3s;font-family:var(--ifx-font-family)}.accordion-title:focus{outline:none}.accordion-title:focus::after{content:"";display:block;position:absolute;top:-4px;bottom:-4px;left:-4px;right:-4px;border-radius:5px;border:2px solid #0A8276;box-sizing:border-box}.accordion-title:hover{border:1px solid #EEEDED;color:#08665C}.accordion-title{display:flex;align-items:center;position:relative;padding:12px 16px;gap:12px;color:#0A8276;background-color:#FFFFFF;border:1px solid #EEEDED;cursor:pointer;margin:4px 4px 0px}.accordion-caption{font-weight:600;font-size:1.125rem}.accordion-content{gap:8px;overflow:hidden;height:0;transition:height 0.3s ease;line-height:24px;font-size:1rem;font-weight:400}.inner-content{background-color:#FFFFFF;padding:16px;word-wrap:break-word;overflow-wrap:anywhere;align-self:stretch;margin:0 4px 4px;border:1px solid transparent;border-top:1px solid transparent}.accordion-icon{font-weight:bold;display:flex;transition:transform 0.3s}.accordion-icon:hover{color:#08665C}.accordion-item.open .accordion-content{max-height:1000px}.accordion-item.open .accordion-icon{transform:rotate(-180deg)}.accordion-item.open .inner-content{border-color:#EEEDED;border-top-color:transparent;transition:border-color 0s}.accordion-item:not(.open) .inner-content{transition:border-color 0s 0.3s}.inner-content.no-content{border:none;padding:0;margin:0}';const f=class{constructor(t){o(this,t);this.ifxOpen=e(this,"ifxOpen",7);this.ifxClose=e(this,"ifxClose",7);this.open=false;this.AriaLevel=3;this.internalOpen=false}componentWillLoad(){this.internalOpen=this.open}componentDidLoad(){this.checkSlotContent();this.openAccordionItem();this.contentEl=this.el.shadowRoot.querySelector("#accordion-content");if(this.contentEl){this.attachResizeObserver()}}componentDidUpdate(){this.checkSlotContent();this.openAccordionItem()}openChanged(o){this.internalOpen=o}toggleOpen(){this.internalOpen=!this.internalOpen;this.open=this.internalOpen;if(this.internalOpen){this.ifxOpen.emit({isOpen:this.internalOpen})}else{this.ifxClose.emit({isClosed:!this.internalOpen})}}openAccordionItem(){if(this.internalOpen){this.contentEl.style.height=`${this.contentEl.scrollHeight}px`;this.contentEl.style.overflow="hidden"}else{this.contentEl.style.height="0";this.contentEl.style.overflow="hidden"}}getInnerContentWrapper(){const o=this.el.shadowRoot.querySelector(".inner-content");return o}attachResizeObserver(){const o=this.getInnerContentWrapper();if(o){this.resizeObserver=new ResizeObserver((()=>{if(this.internalOpen){this.openAccordionItem()}}));this.resizeObserver.observe(o)}}handleKeydown(o){const t=o.composedPath();if(!t.includes(this.titleEl)){return}switch(o.key){case"Enter":case" ":o.preventDefault();this.toggleOpen();break}}checkSlotContent(){const o=this.el.shadowRoot.querySelector("slot");const t=o.assignedNodes().length>0;const i=this.getInnerContentWrapper();if(!t){i.classList.add("no-content")}else if(i.classList.contains("no-content")){i.classList.remove("no-content")}}render(){return t("div",{key:"8e4ee04a7a8fa3dbea906d43a1be6064e4c208a6",class:`accordion-item ${this.internalOpen?"open":""}`},t("div",{key:"109998fb112b8206eb8a28a6ef479e40e317e92c",role:"button","aria-expanded":this.internalOpen,"aria-controls":"accordion-content",class:"accordion-title",onClick:()=>this.toggleOpen(),tabindex:"0",ref:o=>this.titleEl=o},t("span",{key:"4936b00dd6203f5856e68ffb6c13ac8f588057fa","aria-hidden":"true",role:"heading","aria-level":String(this.AriaLevel),class:"accordion-icon"},t("ifx-icon",{key:"511d52bd160ccbe2e1936152c45517567061f57d",icon:"chevron-down-16"})),t("span",{key:"fd82b2df5cbf8d50cfb00c54e59793348500323b",id:"accordion-caption",class:"accordion-caption"},this.caption)),t("div",{key:"77c229869cdf02d27ff1011cd5e5ad3fa201343e",id:"accordion-content",class:"accordion-content",ref:o=>this.contentEl=o,role:"region","aria-labelledby":"accordion-caption"},t("div",{key:"0c9f7ea889fe60957ad9223426142b9509b3883b",class:"inner-content"},t("slot",{key:"1e4218f5554a774a3cde38749a21a7490f72d18d"}))))}get el(){return i(this)}static get watchers(){return{open:["openChanged"]}}};f.style=d;export{a as ifx_accordion,f as ifx_accordion_item};
-//# sourceMappingURL=p-81289e5f.entry.js.map
+import{r as o,h as t,a as i,c as e}from"./p-PqnYwNKt.js";import{d as n,t as r}from"./p-DcmcuUOA.js";import{i as c}from"./p-Bw2fh5LT.js";const a=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{display:block}.accordion-wrapper{display:flex;flex-direction:column;gap:8px;font-family:var(--ifx-font-family)}';const s=class{constructor(t){o(this,t);this.autoCollapse=false}async componentDidLoad(){if(!c(this.el)){const o=n();r("ifx-accordion",await o)}}async onItemOpen(o){if(this.autoCollapse){const t=Array.from(this.el.querySelectorAll("ifx-accordion-item"));for(const i of t){const t=i;if(t!==o.target&&await t.open){t.open=false}}}}render(){return t("div",{key:"903cc44b4886b77e59e66ab2a5cdf681dafeb9bc",class:"accordion-wrapper"},t("slot",{key:"e0abec42188606e8c80fc3db44fba19a7aa69ed8"}))}static get delegatesFocus(){return true}get el(){return i(this)}};s.style=a;const d=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.accordion-item{border-radius:3px;transition:all 0.3s;font-family:var(--ifx-font-family)}.accordion-title:focus{outline:none}.accordion-title:focus::after{content:"";display:block;position:absolute;top:-4px;bottom:-4px;left:-4px;right:-4px;border-radius:5px;border:2px solid #0A8276;box-sizing:border-box}.accordion-title:hover{border:1px solid #EEEDED;color:#08665C}.accordion-title{display:flex;align-items:center;position:relative;padding:12px 16px;gap:12px;color:#0A8276;background-color:#FFFFFF;border:1px solid #EEEDED;cursor:pointer;margin:4px 4px 0px}.accordion-caption{font-weight:600;font-size:1.125rem}.accordion-content{gap:8px;overflow:hidden;height:0;transition:height 0.3s ease;line-height:24px;font-size:1rem;font-weight:400}.inner-content{background-color:#FFFFFF;padding:16px;word-wrap:break-word;overflow-wrap:anywhere;align-self:stretch;margin:0 4px 4px;border:1px solid transparent;border-top:1px solid transparent}.accordion-icon{font-weight:bold;display:flex;transition:transform 0.3s}.accordion-icon:hover{color:#08665C}.accordion-item.open .accordion-content{max-height:1000px}.accordion-item.open .accordion-icon{transform:rotate(-180deg)}.accordion-item.open .inner-content{border-color:#EEEDED;border-top-color:transparent;transition:border-color 0s}.accordion-item:not(.open) .inner-content{transition:border-color 0s 0.3s}.inner-content.no-content{border:none;padding:0;margin:0}';const f=class{constructor(t){o(this,t);this.ifxOpen=e(this,"ifxOpen",7);this.ifxClose=e(this,"ifxClose",7);this.open=false;this.AriaLevel=3;this.internalOpen=false}componentWillLoad(){this.internalOpen=this.open}componentDidLoad(){this.checkSlotContent();this.openAccordionItem();this.contentEl=this.el.shadowRoot.querySelector("#accordion-content");if(this.contentEl){this.attachResizeObserver()}}componentDidUpdate(){this.checkSlotContent();this.openAccordionItem()}openChanged(o){this.internalOpen=o}toggleOpen(){this.internalOpen=!this.internalOpen;this.open=this.internalOpen;if(this.internalOpen){this.ifxOpen.emit({isOpen:this.internalOpen})}else{this.ifxClose.emit({isClosed:!this.internalOpen})}}openAccordionItem(){if(this.internalOpen){this.contentEl.style.height=`${this.contentEl.scrollHeight}px`;this.contentEl.style.overflow="hidden"}else{this.contentEl.style.height="0";this.contentEl.style.overflow="hidden"}}getInnerContentWrapper(){const o=this.el.shadowRoot.querySelector(".inner-content");return o}attachResizeObserver(){const o=this.getInnerContentWrapper();if(o){this.resizeObserver=new ResizeObserver((()=>{if(this.internalOpen){this.openAccordionItem()}}));this.resizeObserver.observe(o)}}handleKeydown(o){const t=o.composedPath();if(!t.includes(this.titleEl)){return}switch(o.key){case"Enter":case" ":o.preventDefault();this.toggleOpen();break}}checkSlotContent(){const o=this.el.shadowRoot.querySelector("slot");const t=o.assignedNodes().length>0;const i=this.getInnerContentWrapper();if(!t){i.classList.add("no-content")}else if(i.classList.contains("no-content")){i.classList.remove("no-content")}}render(){return t("div",{key:"1317347110a9c74932695b8ffff8ca31d3c8e6c3",class:`accordion-item ${this.internalOpen?"open":""}`},t("div",{key:"ad5d46e476f76ac121239c15904a4884a6ba4cc5",role:"button","aria-expanded":this.internalOpen,"aria-controls":"accordion-content",class:"accordion-title",onClick:()=>this.toggleOpen(),tabindex:"0",ref:o=>this.titleEl=o},t("span",{key:"924e061fd270701a7c78433a56fcd70a40dfe7f5","aria-hidden":"true",role:"heading","aria-level":String(this.AriaLevel),class:"accordion-icon"},t("ifx-icon",{key:"40cee40a058eb576d0ef5482f6f7f0adb47a5f4e",icon:"chevron-down-16"})),t("span",{key:"37715ae9f3621954f081bec3d4e861d1dd60847b",id:"accordion-caption",class:"accordion-caption"},this.caption)),t("div",{key:"32c1186d1f4dd1a5a09842224cbfe3d648cc7fac",id:"accordion-content",class:"accordion-content",ref:o=>this.contentEl=o,role:"region","aria-labelledby":"accordion-caption"},t("div",{key:"35618fea4d36844fbad5aed1c07dc2e7378a1d4e",class:"inner-content"},t("slot",{key:"eaa5cdaffd9381f8b05b202f6213d8304fbf7cbb"}))))}get el(){return i(this)}static get watchers(){return{open:["openChanged"]}}};f.style=d;export{s as ifx_accordion,f as ifx_accordion_item};
+//# sourceMappingURL=p-97b2ac42.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["accordionCss","Accordion","constructor","hostRef","this","autoCollapse","componentDidLoad","isNestedInIfxComponent","el","framework","detectFramework","trackComponent","onItemOpen","event","items","Array","from","querySelectorAll","item","itemElement","target","open","render","h","key","class","accordionItemCss","AccordionItem","AriaLevel","internalOpen","componentWillLoad","checkSlotContent","openAccordionItem","contentEl","shadowRoot","querySelector","attachResizeObserver","componentDidUpdate","openChanged","newValue","toggleOpen","ifxOpen","emit","isOpen","ifxClose","isClosed","style","height","scrollHeight","overflow","getInnerContentWrapper","innerContentEl","resizeObserver","ResizeObserver","observe","handleKeydown","ev","path","composedPath","includes","titleEl","preventDefault","slot","hasContent","assignedNodes","length","innerContent","classList","add","contains","remove","role","onClick","tabindex","ref","String","icon","id","caption"],"sources":["src/components/accordion/accordion.scss?tag=ifx-accordion&encapsulation=shadow","src/components/accordion/accordion.tsx","src/components/accordion/accordionItem.scss?tag=ifx-accordion-item&encapsulation=shadow","src/components/accordion/accordionItem.tsx"],"sourcesContent":["// ifxAccordion.scss\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: block;\n}\n\n.accordion-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: tokens.$ifxSpace100;\n  font-family:  var(--ifx-font-family) // tokens.$ifxFontFamilyBody;\n}","import { Component, h, Listen, Element, Prop } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n  tag: 'ifx-accordion',\n  styleUrl: 'accordion.scss',\n  shadow: { delegatesFocus: true },\n})\nexport class Accordion {\n  @Element() el: HTMLElement;\n  @Prop() autoCollapse: boolean = false;\n\n  async componentDidLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-accordion', await framework)\n    }\n  }\n\n  @Listen('ifxOpen')\n  async onItemOpen(event: CustomEvent) {\n    if (this.autoCollapse) {\n      const items = Array.from(this.el.querySelectorAll('ifx-accordion-item'));\n      for (const item of items) {\n        const itemElement = item as HTMLIfxAccordionItemElement;\n        if (itemElement !== event.target && (await itemElement.open)) {\n          itemElement.open = false;\n        }\n      }\n    }\n  }\n\n  render() {\n    return (\n      <div class=\"accordion-wrapper\">\n        <slot />\n      </div>\n    );\n  }\n}\n","// ifxAccordionItem.scss\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n\n.accordion-item {\n  border-radius: 3px;\n  transition: all 0.3s;\n  font-family: var(--ifx-font-family) // tokens.$ifxFontFamilyBody;\n\n}\n\n.accordion-title:focus {\n  outline: none;\n}\n\n// workaround to add corner radius to outline\n.accordion-title:focus::after {\n  content: '';\n  display: block;\n  position: absolute;\n  top: -4px;\n  bottom: -4px;\n  left: -4px;\n  right: -4px;\n  border-radius: 5px;\n  border: 2px solid tokens.$ifxColorOcean500;\n  box-sizing: border-box;\n}\n\n.accordion-title:hover {\n  border: 1px solid tokens.$ifxColorEngineering200;\n  color: tokens.$ifxColorOcean600;\n}\n\n.accordion-title {\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: tokens.$ifxSpace150 tokens.$ifxSpace200;\n  gap: tokens.$ifxSpace150;\n  color: tokens.$ifxColorOcean500;\n  background-color: tokens.$ifxColorBaseWhite;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  cursor: pointer;\n  margin: 4px 4px 0px;\n}\n\n.accordion-caption {\n  font-weight: tokens.$ifxFontWeightSemibold;\n  font-size: tokens.$ifxFontSizeL;\n}\n\n.accordion-content {\n  gap: tokens.$ifxSpace100;\n  overflow: hidden;\n  height: 0;\n  transition: height 0.3s ease;\n  line-height: 24px;\n  font-size: tokens.$ifxFontSizeM;\n  font-weight: 400;\n}\n\n.inner-content {\n  background-color: tokens.$ifxColorBaseWhite;\n  padding: tokens.$ifxSpace200;\n  word-wrap: break-word;\n  overflow-wrap: anywhere;\n  align-self: stretch;\n  margin: 0 4px 4px;\n  border: 1px solid transparent;\n  border-top: 1px solid transparent;\n}\n\n.accordion-icon {\n  font-weight: bold;\n  display: flex;\n  transition: transform 0.3s;\n\n  &:hover {\n    color: tokens.$ifxColorOcean600;\n\n  }\n}\n\n\n.accordion-item.open .accordion-content {\n  max-height: 1000px; // Arbitrary large value to allow content to expand\n}\n\n.accordion-item.open .accordion-icon {\n  transform: rotate(-180deg);\n}\n\n.accordion-item.open .inner-content {\n  border-color: tokens.$ifxColorEngineering200;\n  border-top-color: transparent;\n  transition: border-color 0s; \n}\n\n.accordion-item:not(.open) .inner-content {\n  transition: border-color 0s 0.3s; \n}\n\n.inner-content {\n  &.no-content { \n    border: none;\n    padding: 0;\n    margin: 0;\n  }\n}","//ifxAccordionItem\nimport { Component, Prop, h, State, Event, EventEmitter, Watch, Listen, Element } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-accordion-item',\n  styleUrl: 'accordionItem.scss',\n  shadow: true,\n})\nexport class AccordionItem {\n  @Element() el;\n  @Prop() caption: string;\n  @Prop({\n    mutable: true,\n  })\n  open: boolean = false;\n  @Prop() AriaLevel = 3;\n  @State() internalOpen: boolean = false;\n  @Event() ifxOpen: EventEmitter;\n  @Event() ifxClose: EventEmitter;\n  private contentEl!: HTMLElement;\n  private titleEl!: HTMLElement;\n  private resizeObserver!: ResizeObserver;\n\n  componentWillLoad() {\n    this.internalOpen = this.open;\n  }\n\n  componentDidLoad() {\n    this.checkSlotContent()\n    this.openAccordionItem();\n    this.contentEl = this.el.shadowRoot.querySelector('#accordion-content');\n    if (this.contentEl) {\n      this.attachResizeObserver();\n    }\n  }\n\n  componentDidUpdate() {\n    this.checkSlotContent()\n    this.openAccordionItem();\n  }\n\n  @Watch('open')\n  openChanged(newValue: boolean) {\n    this.internalOpen = newValue;\n  }\n\n  toggleOpen() {\n    this.internalOpen = !this.internalOpen;\n    this.open = this.internalOpen;\n\n    if (this.internalOpen) {\n      this.ifxOpen.emit({ isOpen: this.internalOpen });\n    } else {\n      this.ifxClose.emit({ isClosed: !this.internalOpen });\n    }\n  }\n\n  openAccordionItem() {\n    if (this.internalOpen) {\n      this.contentEl.style.height = `${this.contentEl.scrollHeight}px`;\n      this.contentEl.style.overflow = 'hidden';\n    } else {\n      this.contentEl.style.height = '0';\n      this.contentEl.style.overflow = 'hidden';\n    }\n  }\n\n  getInnerContentWrapper() {\n    const innerContentEl = this.el.shadowRoot.querySelector('.inner-content');\n    return innerContentEl;\n  }\n\n  attachResizeObserver() {\n    const innerContentEl = this.getInnerContentWrapper();\n\n    if (innerContentEl) {\n      this.resizeObserver = new ResizeObserver(() => {\n        if (this.internalOpen) {\n          this.openAccordionItem();\n        }\n      });\n\n      this.resizeObserver.observe(innerContentEl);\n    }\n  }\n\n  @Listen('keydown')\n  handleKeydown(ev: KeyboardEvent) {\n    const path = ev.composedPath();\n\n    if (!path.includes(this.titleEl)) {\n      return;\n    }\n\n    switch (ev.key) {\n      case 'Enter': // fallthrough\n      case ' ': // space\n        ev.preventDefault();\n        this.toggleOpen();\n        break;\n    }\n  }\n\n  checkSlotContent() {\n    const slot = this.el.shadowRoot.querySelector('slot') as HTMLSlotElement;\n    const hasContent = slot.assignedNodes().length > 0;\n    const innerContent = this.getInnerContentWrapper();\n    if (!hasContent) {\n      innerContent.classList.add('no-content');\n    } else if (innerContent.classList.contains('no-content')) {\n      innerContent.classList.remove('no-content');\n    }\n  }\n\n  render() {\n    return (\n      <div class={`accordion-item ${this.internalOpen ? 'open' : ''}`}>\n        <div\n          role=\"button\"\n          aria-expanded={this.internalOpen}\n          aria-controls=\"accordion-content\"\n          class=\"accordion-title\"\n          onClick={() => this.toggleOpen()}\n          tabindex=\"0\"\n          ref={el => (this.titleEl = el as HTMLElement)}\n        >\n          <span aria-hidden=\"true\" role=\"heading\" aria-level={String(this.AriaLevel) as string} class=\"accordion-icon\">\n            <ifx-icon icon=\"chevron-down-16\" />\n          </span>\n          <span id=\"accordion-caption\" class=\"accordion-caption\">\n            {this.caption}\n          </span>\n        </div>\n        <div id=\"accordion-content\" class=\"accordion-content\" ref={el => (this.contentEl = el as HTMLElement)} role=\"region\" aria-labelledby=\"accordion-caption\">\n          <div class=\"inner-content\">\n            <slot />\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-9f1ec0af.entry.js → p-9b06df76.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,a as n}from"./p-PqnYwNKt.js";const i=':host(.hidden){display:none}.navbar__item{position:relative;display:flex;flex-direction:row;align-items:center;padding:0px 8px;flex:none;order:0;flex-grow:0;font-family:var(--ifx-font-family);text-decoration:none;font-weight:400;font-size:16px;color:#1D1D1D}.navbar__item.hide{display:none}.navbar__item.isParent{gap:8px}.navbar__item .navItemIconWrapper{transition:0.3s;display:flex}.navbar__item.open .navItemIconWrapper{transform:rotate(-180deg);transition:0.3s}.navbar__item:hover{color:#0A8276;cursor:pointer}.navbar__item:hover .username__tooltip{display:block}.navbar__item:hover .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{cursor:pointer;background-color:#08665C}.navbar__item.remove{display:none}.navbar__item.removeLabel .label__wrapper{display:none}.navbar__item .number__indicator-wrapper{position:relative;top:-11px}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .username__tooltip{display:none;position:absolute;top:35px;right:0;text-wrap:nowrap;padding:1px 5px;font-size:13px;font-family:"Source Sans 3";background-color:black;color:#fff;z-index:99}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper:hover .username__tooltip{display:block}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;border-radius:100%;background-color:#0A8276}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper .initials{color:#FFF;text-align:center;font-family:"Source Sans 3";font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper img{width:24px;height:24px;border-radius:100%}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.removeWrapper{display:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.hide{display:none}.container{position:relative}.container:focus{outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.container .sub__layer-back-button{display:none}.container .sub__layer-back-button.show{display:flex;justify-content:flex-start}.container .sub__layer-back-button.show .back__button-wrapper{display:flex;align-items:center;gap:8px;padding:8px 0 16px 0;color:#0A8276;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.container .sub__layer-back-button.show .back__button-wrapper span:hover,.container .sub__layer-back-button.show .back__button-wrapper ifx-icon:hover{cursor:pointer}.container.hide{display:none}.container .inner__content-wrapper{position:relative;display:flex;justify-content:space-between;align-items:center;gap:8px}.container .inner__content-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .navbar__container-right-content-navigation-item-icon-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .number__indicator-wrapper{position:relative;top:-11px}.navbar-menu{position:absolute;display:none;list-style-type:none;visibility:visible;flex-direction:column;width:224px;min-width:224px;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)}.navbar-menu.open:not(.itemInMobileMenu){display:flex}.navbar-menu.itemInMobileMenu{display:none}.navbar-menu.right{left:100%;top:-40%}.navbar-menu.left{top:-40%;right:100%}.navbar-menu.rightSideItemMenu{left:initial;right:0px}.navbar__item.layer__item-parent{color:#1D1D1D;font-size:24px;font-style:normal;font-weight:600;line-height:32px;letter-spacing:-0.24px;cursor:initial}.navbar__item.layer__item-parent .navbar__container-right-content-navigation-item-icon-wrapper ifx-icon svg{width:24px;height:24px}.navbar__item.sidebarMenuItem{justify-content:space-between;padding:0}.navbar__item.menuItem{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;justify-content:space-between;padding:8px 16px;gap:8px;font-family:var(--ifx-font-family)}.navbar__item.menuItem.hide{display:none}.navbar__item.menuItem .label__wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__item.menuItem:hover{cursor:pointer;background-color:#EEEDED}.navbar__item.menuItem:active{background-color:#BFBBBB}.sub__layer-menu{padding:5px;display:none}.sub__layer-menu.remove__margin{margin:0;padding:0}.sub__layer-menu.open{display:block}.navbar__item.hide{display:none}.menuItemRightIconWrapper.hide{display:none}.navItemIconWrapper.hide{display:none}';const a=class{constructor(t){e(this,t);this.showLabel=true;this.href="";this.imageUrl="";this.target="_self";this.alt="";this.userName="";this.internalHref="";this.isMenuItem=false;this.hasChildNavItems=false;this.internalImageUrl={type:"",value:""};this.defaultProfileImage=`<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">\n<rect width="48" height="48" fill="#0A8276"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M24 14C21.7909 14 20 15.7909 20 18C20 20.2091 21.7909 22 24 22C26.2091 22 28 20.2091 28 18C28 15.7909 26.2091 14 24 14ZM18 18C18 14.6863 20.6863 12 24 12C27.3137 12 30 14.6863 30 18C30 21.3137 27.3137 24 24 24C20.6863 24 18 21.3137 18 18ZM16.5869 28.3984C18.2683 27.0179 20.7466 26 24 26C27.2541 26 29.7324 27.0209 31.4134 28.4024C33.0562 29.7526 34 31.5119 34 33V35C34 35.5523 33.5523 36 33 36H15C14.4477 36 14 35.5523 14 35V33C14 31.5074 14.9433 29.7479 16.5869 28.3984ZM17.8561 29.9441C16.5187 31.0421 16 32.2826 16 33V34H32V33C32 32.2881 31.4818 31.0474 30.1436 29.9476C28.8436 28.8791 26.8219 28 24 28C21.1774 28 19.1557 28.8771 17.8561 29.9441Z" fill="white"/>\n</svg>`}handleOutsideClick(e){const t=e.composedPath();const n=this.getItemMenu();if(n){if(n.classList.contains("open")){if(!t.includes(this.el)){this.closeItemMenu()}}}}componentWillLoad(){this.setHref();this.setImage();const e=this.getNavbarItems();if(e.length!==0){this.hasChildNavItems=true}else{this.hasChildNavItems=false}}componentDidLoad(){this.setProfileGap();if(this.hasChildNavItems){const e=this.getNavbarItems();this.appendNavItemToMenu(e)}}async hideComponent(){this.el.style.display="none"}async showComponent(){this.el.style.display=""}handleClassList(e,t,n){e.classList[t](n);if(t==="contains"){return e.classList.contains(n)}}getNavbarItems(){const e=this.el.querySelectorAll("ifx-navbar-item");return e}getNavBarItem(){const e=this.el.shadowRoot.querySelector(".navbar__item");return e}relocateUsingSlot(e){e.forEach((e=>{e.setAttribute("slot","first__layer")}))}appendNavItemToMenu(e){this.relocateUsingSlot(e)}isValidHttpUrl(e){let t;try{t=new URL(e)}catch(e){return false}return t.protocol==="http:"||t.protocol==="https:"}setImage(){if(this.imageUrl.toLowerCase().trim()===""){this.internalImageUrl={type:undefined,value:""}}else if(this.isValidHttpUrl(this.imageUrl)){this.internalImageUrl={type:"url",value:this.imageUrl}}else{this.internalImageUrl={type:"initials",value:this.imageUrl}}}setHref(){if(this.href.toLowerCase().trim()===""){this.internalHref=undefined}else this.internalHref=this.href}setProfileGap(){const e=this.el.shadowRoot.querySelector(".inner__content-wrapper");const t=this.el.shadowRoot.querySelector(".label__wrapper");const n=t.querySelector("slot");const i=n.assignedNodes();if(!i.length){this.handleClassList(e,"add","no-gap")}else{this.handleClassList(e,"remove","no-gap")}}getItemMenu(){const e=this.el.shadowRoot.querySelector(".navbar-menu");return e}closeItemMenu(){const e=this.getItemMenu();const t=this.getNavBarItem();if(e){this.handleClassList(e,"remove","open");this.handleClassList(t,"remove","open")}}toggleItemMenu(){if(!this.internalHref){if(this.isMenuItem&&this.hasChildNavItems){const e=this.getItemMenu();this.handleClassList(e,"add","right")}if(this.hasChildNavItems){const e=this.getItemMenu();const t=this.getNavBarItem();this.handleClassList(e,"toggle","open");this.handleClassList(t,"toggle","open")}}}itemHasNestedItems(){const e=this.el.shadowRoot.querySelector("ifx-navbar-item");if(e){return true}else{return false}}render(){return t("div",{key:"09755c71c7e46d56a94447445c43a26c7afdea27",class:"container"},t("a",{key:"258b91863549bd58c304861c8690da5daaed02f4",href:this.internalHref,target:this.target,onClick:()=>this.toggleItemMenu(),class:`navbar__item ${!this.showLabel?"removeLabel":""} ${this.hasChildNavItems?"isParent":""}`},t("div",{key:"2eb0ed918c8768defe04ca1891d886110a80112b",class:"inner__content-wrapper"},t("div",{key:"a25a6900785380daa05e7dfd22d0371dfae1b916",class:`navbar__container-right-content-navigation-item-icon-wrapper`},this.userName.trim()!==""&&t("div",{key:"45b50379fa5ffd224d343609728931201361c27e",class:"username__tooltip"},this.userName),this.internalImageUrl.type!=="initials"&&t("img",{key:"d21aaf5d8673b0d15b8ff1c4aa35be96b7cd27dc",src:this.internalImageUrl.type==="url"?this.internalImageUrl.value:`data:image/svg+xml,${encodeURIComponent(this.defaultProfileImage)}`,alt:this.alt}),this.internalImageUrl.type==="initials"&&t("div",{key:"a4cc931179b662a90fa66e91bc42fbfbd609be04",class:"initials__wrapper"},t("span",{key:"be3e056ae6ca08228c90684bb693b052067ae9c0",class:"initials"},this.internalImageUrl.value))),t("span",{key:"abf45497fc5e740d068545d5772ff4fea7a5a6ac",class:"label__wrapper"},t("slot",{key:"178cdc5b7f2168ac27483e81055168a4373e96d3",onSlotchange:()=>this.setProfileGap()})))),this.hasChildNavItems&&t("ul",{key:"a937f2412c2cefe1be4c57467778a6bae664fb20",class:"navbar-menu rightSideItemMenu"}," ",t("slot",{key:"8856b0921c0309ad07cbc190a51c74bf8e7f057b",name:"first__layer"})," "))}static get assetsDirs(){return["assets"]}get el(){return n(this)}};a.style=i;export{a as ifx_navbar_profile};
-//# sourceMappingURL=p-9f1ec0af.entry.js.map
+import{r as e,h as t,a as n}from"./p-PqnYwNKt.js";const i=':host(.hidden){display:none}.navbar__item{position:relative;display:flex;flex-direction:row;align-items:center;padding:0px 8px;flex:none;order:0;flex-grow:0;font-family:var(--ifx-font-family);text-decoration:none;font-weight:400;font-size:16px;color:#1D1D1D}.navbar__item.hide{display:none}.navbar__item.isParent{gap:8px}.navbar__item .navItemIconWrapper{transition:0.3s;display:flex}.navbar__item.open .navItemIconWrapper{transform:rotate(-180deg);transition:0.3s}.navbar__item:hover{color:#0A8276;cursor:pointer}.navbar__item:hover .username__tooltip{display:block}.navbar__item:hover .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{cursor:pointer;background-color:#08665C}.navbar__item.remove{display:none}.navbar__item.removeLabel .label__wrapper{display:none}.navbar__item .number__indicator-wrapper{position:relative;top:-11px}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .username__tooltip{display:none;position:absolute;top:35px;right:0;text-wrap:nowrap;padding:1px 5px;font-size:13px;font-family:"Source Sans 3";background-color:black;color:#fff;z-index:99}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper:hover .username__tooltip{display:block}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;border-radius:100%;background-color:#0A8276}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper .initials{color:#FFF;text-align:center;font-family:"Source Sans 3";font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper img{width:24px;height:24px;border-radius:100%}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.removeWrapper{display:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.hide{display:none}.container{position:relative}.container:focus{outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.container .sub__layer-back-button{display:none}.container .sub__layer-back-button.show{display:flex;justify-content:flex-start}.container .sub__layer-back-button.show .back__button-wrapper{display:flex;align-items:center;gap:8px;padding:8px 0 16px 0;color:#0A8276;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.container .sub__layer-back-button.show .back__button-wrapper span:hover,.container .sub__layer-back-button.show .back__button-wrapper ifx-icon:hover{cursor:pointer}.container.hide{display:none}.container .inner__content-wrapper{position:relative;display:flex;justify-content:space-between;align-items:center;gap:8px}.container .inner__content-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .navbar__container-right-content-navigation-item-icon-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .number__indicator-wrapper{position:relative;top:-11px}.navbar-menu{position:absolute;display:none;list-style-type:none;visibility:visible;flex-direction:column;width:224px;min-width:224px;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)}.navbar-menu.open:not(.itemInMobileMenu){display:flex}.navbar-menu.itemInMobileMenu{display:none}.navbar-menu.right{left:100%;top:-40%}.navbar-menu.left{top:-40%;right:100%}.navbar-menu.rightSideItemMenu{left:initial;right:0px}.navbar__item.layer__item-parent{color:#1D1D1D;font-size:24px;font-style:normal;font-weight:600;line-height:32px;letter-spacing:-0.24px;cursor:initial}.navbar__item.layer__item-parent .navbar__container-right-content-navigation-item-icon-wrapper ifx-icon svg{width:24px;height:24px}.navbar__item.sidebarMenuItem{justify-content:space-between;padding:0}.navbar__item.menuItem{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;justify-content:space-between;padding:8px 16px;gap:8px;font-family:var(--ifx-font-family)}.navbar__item.menuItem.hide{display:none}.navbar__item.menuItem .label__wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__item.menuItem:hover{cursor:pointer;background-color:#EEEDED}.navbar__item.menuItem:active{background-color:#BFBBBB}.sub__layer-menu{padding:5px;display:none}.sub__layer-menu.remove__margin{margin:0;padding:0}.sub__layer-menu.open{display:block}.navbar__item.hide{display:none}.menuItemRightIconWrapper.hide{display:none}.navItemIconWrapper.hide{display:none}';const a=class{constructor(t){e(this,t);this.showLabel=true;this.href="";this.imageUrl="";this.target="_self";this.alt="";this.userName="";this.internalHref="";this.isMenuItem=false;this.hasChildNavItems=false;this.internalImageUrl={type:"",value:""};this.defaultProfileImage=`<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">\n<rect width="48" height="48" fill="#0A8276"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M24 14C21.7909 14 20 15.7909 20 18C20 20.2091 21.7909 22 24 22C26.2091 22 28 20.2091 28 18C28 15.7909 26.2091 14 24 14ZM18 18C18 14.6863 20.6863 12 24 12C27.3137 12 30 14.6863 30 18C30 21.3137 27.3137 24 24 24C20.6863 24 18 21.3137 18 18ZM16.5869 28.3984C18.2683 27.0179 20.7466 26 24 26C27.2541 26 29.7324 27.0209 31.4134 28.4024C33.0562 29.7526 34 31.5119 34 33V35C34 35.5523 33.5523 36 33 36H15C14.4477 36 14 35.5523 14 35V33C14 31.5074 14.9433 29.7479 16.5869 28.3984ZM17.8561 29.9441C16.5187 31.0421 16 32.2826 16 33V34H32V33C32 32.2881 31.4818 31.0474 30.1436 29.9476C28.8436 28.8791 26.8219 28 24 28C21.1774 28 19.1557 28.8771 17.8561 29.9441Z" fill="white"/>\n</svg>`}handleOutsideClick(e){const t=e.composedPath();const n=this.getItemMenu();if(n){if(n.classList.contains("open")){if(!t.includes(this.el)){this.closeItemMenu()}}}}componentWillLoad(){this.setHref();this.setImage();const e=this.getNavbarItems();if(e.length!==0){this.hasChildNavItems=true}else{this.hasChildNavItems=false}}componentDidLoad(){this.setProfileGap();if(this.hasChildNavItems){const e=this.getNavbarItems();this.appendNavItemToMenu(e)}}async hideComponent(){this.el.style.display="none"}async showComponent(){this.el.style.display=""}handleClassList(e,t,n){e.classList[t](n);if(t==="contains"){return e.classList.contains(n)}}getNavbarItems(){const e=this.el.querySelectorAll("ifx-navbar-item");return e}getNavBarItem(){const e=this.el.shadowRoot.querySelector(".navbar__item");return e}relocateUsingSlot(e){e.forEach((e=>{e.setAttribute("slot","first__layer")}))}appendNavItemToMenu(e){this.relocateUsingSlot(e)}isValidHttpUrl(e){let t;try{t=new URL(e)}catch(e){return false}return t.protocol==="http:"||t.protocol==="https:"}setImage(){if(this.imageUrl.toLowerCase().trim()===""){this.internalImageUrl={type:undefined,value:""}}else if(this.isValidHttpUrl(this.imageUrl)){this.internalImageUrl={type:"url",value:this.imageUrl}}else{this.internalImageUrl={type:"initials",value:this.imageUrl}}}setHref(){if(this.href.toLowerCase().trim()===""){this.internalHref=undefined}else this.internalHref=this.href}setProfileGap(){const e=this.el.shadowRoot.querySelector(".inner__content-wrapper");const t=this.el.shadowRoot.querySelector(".label__wrapper");const n=t.querySelector("slot");const i=n.assignedNodes();if(!i.length){this.handleClassList(e,"add","no-gap")}else{this.handleClassList(e,"remove","no-gap")}}getItemMenu(){const e=this.el.shadowRoot.querySelector(".navbar-menu");return e}closeItemMenu(){const e=this.getItemMenu();const t=this.getNavBarItem();if(e){this.handleClassList(e,"remove","open");this.handleClassList(t,"remove","open")}}toggleItemMenu(){if(!this.internalHref){if(this.isMenuItem&&this.hasChildNavItems){const e=this.getItemMenu();this.handleClassList(e,"add","right")}if(this.hasChildNavItems){const e=this.getItemMenu();const t=this.getNavBarItem();this.handleClassList(e,"toggle","open");this.handleClassList(t,"toggle","open")}}}itemHasNestedItems(){const e=this.el.shadowRoot.querySelector("ifx-navbar-item");if(e){return true}else{return false}}render(){return t("div",{key:"837122b11b554e17b60c07c303944a11b17a1eae",class:"container"},t("a",{key:"fde977c00f830b4a070edad21927393d5a79c117",href:this.internalHref,target:this.target,onClick:()=>this.toggleItemMenu(),class:`navbar__item ${!this.showLabel?"removeLabel":""} ${this.hasChildNavItems?"isParent":""}`},t("div",{key:"d4d190de3cf180bef8579d362a28519ddaa5fe3b",class:"inner__content-wrapper"},t("div",{key:"af01f7621f00de51db3ce906164c008778324ef5",class:`navbar__container-right-content-navigation-item-icon-wrapper`},this.userName.trim()!==""&&t("div",{key:"5df6af9768a82cc9265b252b36f7927c37b51539",class:"username__tooltip"},this.userName),this.internalImageUrl.type!=="initials"&&t("img",{key:"c9748a87892e169c9b472d21fbdb2d4957bb6bfb",src:this.internalImageUrl.type==="url"?this.internalImageUrl.value:`data:image/svg+xml,${encodeURIComponent(this.defaultProfileImage)}`,alt:this.alt}),this.internalImageUrl.type==="initials"&&t("div",{key:"604c7d5245f09daba9b19a890eaabbde87951d8b",class:"initials__wrapper"},t("span",{key:"2bc213ff673fc4af3d10da3caa99275ba38d276c",class:"initials"},this.internalImageUrl.value))),t("span",{key:"e073d5b6763d3b716980c598b78f0ed099fc4791",class:"label__wrapper"},t("slot",{key:"051f2cc80248b847944a03b04651786785d2fa4f",onSlotchange:()=>this.setProfileGap()})))),this.hasChildNavItems&&t("ul",{key:"cefecb5bef10e87e336aa8c0620cb996da674ea3",class:"navbar-menu rightSideItemMenu"}," ",t("slot",{key:"ae09e66ce2dedcec664c7d1d8c351cfca2c6a647",name:"first__layer"})," "))}static get assetsDirs(){return["assets"]}get el(){return n(this)}};a.style=i;export{a as ifx_navbar_profile};
+//# sourceMappingURL=p-9b06df76.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["navbarItemCss","NavbarProfile","constructor","hostRef","this","showLabel","href","imageUrl","target","alt","userName","internalHref","isMenuItem","hasChildNavItems","internalImageUrl","type","value","defaultProfileImage","handleOutsideClick","event","path","composedPath","itemMenu","getItemMenu","classList","contains","includes","el","closeItemMenu","componentWillLoad","setHref","setImage","sidebarItems","getNavbarItems","length","componentDidLoad","setProfileGap","navItems","appendNavItemToMenu","hideComponent","style","display","showComponent","handleClassList","className","querySelectorAll","getNavBarItem","navItem","shadowRoot","querySelector","relocateUsingSlot","forEach","item","setAttribute","isValidHttpUrl","string","url","URL","_","protocol","toLowerCase","trim","undefined","innerContentWrapper","labelWrapper","labelSlot","nodes","assignedNodes","menu","menuItem","toggleItemMenu","itemHasNestedItems","childNavItem","render","h","key","class","onClick","src","encodeURIComponent","onSlotchange","name"],"sources":["src/components/navigation/navbar/navbar-item.scss?tag=ifx-navbar-profile&encapsulation=shadow","src/components/navigation/navbar/navbar-profile.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host(.hidden) {\n  display: none;\n}\n\n.navbar__item {\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 0px 8px;\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n  text-decoration: none;\n  font-weight: 400;\n  font-size: 16px;\n  color: tokens.$ifxColorBaseBlack;\n\n  \n\n  &.hide { \n    display: none;\n  }\n\n  &.isParent { \n    gap: 8px;\n  }\n\n  & .navItemIconWrapper { \n    transition: .3s;\n    display: flex;\n  }\n\n  &.open { \n    & .navItemIconWrapper { \n      transform: rotate(-180deg);\n      transition: .3s;\n    }\n  }\n\n  &:hover {\n    color: tokens.$ifxColorOcean500;\n    cursor: pointer;\n\n    & .username__tooltip { \n      display: block;\n    }\n\n    & .navbar__container-right-content-navigation-item-icon-wrapper { \n      & .initials__wrapper { \n        cursor: pointer;\n        background-color: tokens.$ifxColorOcean600;\n      }\n    }\n  }\n\n  &.remove {\n    display: none;\n  }\n\n  &.removeLabel {\n    & .label__wrapper {\n      display: none;\n    }\n  }\n\n  & .number__indicator-wrapper { \n    position: relative;\n    top: -11px;\n  }\n\n  & .navbar__container-right-content-navigation-item-icon-wrapper {\n    position: relative;\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    padding: 0px;\n    gap: 8px;\n    flex: none;\n    order: 0;\n    flex-grow: 0;\n\n \n    & .username__tooltip { \n      display: none;\n      position: absolute;\n      top: 35px;\n      right: 0;\n      text-wrap: nowrap;\n      padding: 1px 5px;\n      font-size: 13px;\n      font-family: \"Source Sans 3\";\n      background-color: black;\n      color: #fff;\n      z-index: 99;\n    }\n\n    &:hover { \n      & .username__tooltip { \n        display: block;\n      }\n    }\n\n    & .initials__wrapper { \n      display: flex;\n      width: 24px;\n      height: 24px;\n      justify-content: center;\n      align-items: center;\n      border-radius: 100%;\n      background-color: tokens.$ifxColorOcean500;\n\n\n      & .initials { \n        color: #FFF;\n        text-align: center;\n        font-family: \"Source Sans 3\";\n        font-size: 14px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: 20px; \n\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n        -khtml-user-select: none;\n        -moz-user-select: none;\n        -ms-user-select: none;\n        user-select: none;\n      \n      }\n    }\n\n    & img { \n      width: 24px; \n      height: 24px;\n      border-radius: 100%;\n    }\n\n    &.removeWrapper {\n      display: none;\n    }\n\n    &.hide {\n      display: none;\n    }\n  }\n}\n\n.container { \n  position: relative;\n  \n       &:focus{\n    outline: none;\n      box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n  }\n\n  & .sub__layer-back-button { \n    display: none;\n    &.show { \n      display: flex;\n      justify-content: flex-start;\n\n      & .back__button-wrapper { \n        display: flex;\n        align-items: center;\n        gap: tokens.$ifxSpace100;\n        padding: tokens.$ifxSpace100 0 tokens.$ifxSpace200 0;\n        color: tokens.$ifxColorOcean500;\n        font-size: 16px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: 24px;\n\n        & span, & ifx-icon { \n          &:hover { \n            cursor: pointer;\n          }\n        }\n\n      }\n    }\n  }\n\n  &.hide { \n    display: none;\n  }\n\n  & .inner__content-wrapper { \n    position: relative;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 8px;\n    &.no-gap { \n      gap: 0px;\n    }\n\n    & .navbar__container-right-content-navigation-item-icon-wrapper {\n      &.no-gap { \n        gap: 0px;\n      }\n    }\n\n    & .number__indicator-wrapper { \n      position: relative;\n      top: -11px;\n    }\n\n  }\n}\n\n.navbar-menu  {\n  position: absolute;\n  display: none;\n  list-style-type: none;\n  visibility: visible;\n  flex-direction: column;\n  width: 224px;\n  min-width: 224px;\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); // tokens.$ifxFontFamilyBody;\n\n\n\n  &.open:not(.itemInMobileMenu) {\n    display: flex;\n  }\n\n  &.itemInMobileMenu { \n    display: none;\n  }\n\n  &.right { \n    left: 100%;\n    top: -40%;\n  }\n\n  &.left { \n    top: -40%;\n    right: 100%;\n  }\n\n  &.rightSideItemMenu { \n    left: initial;\n    right: 0px;\n  }\n}\n\n.navbar__item { \n    &.layer__item-parent { \n      color: tokens.$ifxColorBaseBlack;\n      font-size: 24px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 32px; \n      letter-spacing: -0.24px;\n      cursor: initial;\n\n      & .navbar__container-right-content-navigation-item-icon-wrapper { \n        & ifx-icon { \n          & svg { \n            width: 24px;\n            height: 24px;\n          }\n        }\n      }\n    }\n\n\n  &.sidebarMenuItem { \n    justify-content: space-between;\n    padding: 0;\n  }\n\n\n  &.menuItem {\n    text-decoration: none;\n    color: tokens.$ifxColorBaseBlack;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 8px 16px;\n    gap: 8px;\n    font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n  \n    &.hide {\n      display: none;\n    }\n  \n    & .label__wrapper {\n      color: tokens.$ifxColorBaseBlack;\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 24px;\n    }\n  \n    &:hover {\n      cursor: pointer;\n      background-color: tokens.$ifxColorEngineering200;\n    }\n  \n    &:active {\n      background-color: tokens.$ifxColorEngineering300;\n    }\n  }\n}\n\n.sub__layer-menu { \n  padding: 5px;\n  display: none;\n\n  &.remove__margin { \n    margin: 0;\n    padding: 0;\n  }\n \n  &.open { \n    display: block;\n  }\n}\n\n.navbar__item { \n  &.hide { \n    display: none;\n  }\n}\n\n.menuItemRightIconWrapper { \n  &.hide { \n    display: none;\n  }\n}\n\n.navItemIconWrapper { \n  &.hide { \n    display: none;\n  }\n}\n\n","import { Component, h, Element, Prop, State, Listen, Method } from \"@stencil/core\";\n\n@Component({\n  tag: 'ifx-navbar-profile',\n  styleUrl: 'navbar-item.scss',\n  shadow: true,\n  assetsDirs: ['assets']\n})\n\nexport class NavbarProfile {\n\n  @Element() el;\n  @Prop() showLabel: boolean = true;\n  @Prop() href: string = \"\"\n  @Prop() imageUrl: string = \"\"\n  @Prop() target: string = \"_self\";\n  @Prop() alt: string = \"\"\n  @Prop() userName: string = \"\";\n  @State() internalHref: string = \"\"\n  @State() isMenuItem: boolean = false;\n  @State() hasChildNavItems: boolean = false;\n  @State() internalImageUrl: any = {type: \"\", value: \"\"}\n \n  private defaultProfileImage = `<svg width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<rect width=\"48\" height=\"48\" fill=\"#0A8276\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M24 14C21.7909 14 20 15.7909 20 18C20 20.2091 21.7909 22 24 22C26.2091 22 28 20.2091 28 18C28 15.7909 26.2091 14 24 14ZM18 18C18 14.6863 20.6863 12 24 12C27.3137 12 30 14.6863 30 18C30 21.3137 27.3137 24 24 24C20.6863 24 18 21.3137 18 18ZM16.5869 28.3984C18.2683 27.0179 20.7466 26 24 26C27.2541 26 29.7324 27.0209 31.4134 28.4024C33.0562 29.7526 34 31.5119 34 33V35C34 35.5523 33.5523 36 33 36H15C14.4477 36 14 35.5523 14 35V33C14 31.5074 14.9433 29.7479 16.5869 28.3984ZM17.8561 29.9441C16.5187 31.0421 16 32.2826 16 33V34H32V33C32 32.2881 31.4818 31.0474 30.1436 29.9476C28.8436 28.8791 26.8219 28 24 28C21.1774 28 19.1557 28.8771 17.8561 29.9441Z\" fill=\"white\"/>\n</svg>`\n\n  @Listen('mousedown', { target: 'document' })\n  handleOutsideClick(event: MouseEvent) {\n    const path = event.composedPath();\n    const itemMenu = this.getItemMenu()\n    if(itemMenu) { \n      if(itemMenu.classList.contains('open')) { \n        if (!path.includes(this.el)) {\n          this.closeItemMenu();\n        }\n      }\n    }\n  }\n\n  componentWillLoad() {\n    this.setHref()\n    this.setImage()\n    const sidebarItems = this.getNavbarItems();\n    if (sidebarItems.length !== 0) {\n      this.hasChildNavItems = true;\n    } else {\n      this.hasChildNavItems = false;\n    }\n  }\n\n  componentDidLoad() { \n    this.setProfileGap()\n    if(this.hasChildNavItems) { \n      const navItems = this.getNavbarItems();\n      this.appendNavItemToMenu(navItems)\n    }\n  }\n\n  @Method()\n  async hideComponent() { \n    this.el.style.display = 'none';\n  }\n\n  @Method()\n  async showComponent() { \n    this.el.style.display = '';\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  getNavbarItems() {\n    const navItems = this.el.querySelectorAll('ifx-navbar-item')\n    return navItems;\n  }\n  \n  getNavBarItem() { \n    const navItem = this.el.shadowRoot.querySelector('.navbar__item')\n    return navItem;\n  }\n\n  relocateUsingSlot(navItems) { \n    navItems.forEach(item => {\n     item.setAttribute('slot', 'first__layer')\n   })\n }\n\n  appendNavItemToMenu(navItems) { \n    this.relocateUsingSlot(navItems)\n  }\n\n  isValidHttpUrl(string) {\n    let url;\n    \n    try {\n      url = new URL(string);\n    } catch (_) {\n      return false;  \n    }\n  \n    return url.protocol === \"http:\" || url.protocol === \"https:\";\n  }\n\n  setImage() { \n    if (this.imageUrl.toLowerCase().trim() === \"\") {\n      this.internalImageUrl = {type: undefined, value: \"\"}\n    } else if(this.isValidHttpUrl(this.imageUrl)) {\n      this.internalImageUrl = { type: 'url', value: this.imageUrl}\n    } else { \n      this.internalImageUrl = { type: 'initials', value: this.imageUrl}\n    }\n  }\n\n  setHref() {\n    if (this.href.toLowerCase().trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  setProfileGap() { \n    const innerContentWrapper = this.el.shadowRoot.querySelector('.inner__content-wrapper')\n    const labelWrapper = this.el.shadowRoot.querySelector('.label__wrapper')\n    const labelSlot = labelWrapper.querySelector('slot')\n    const nodes = labelSlot.assignedNodes();\n    if(!nodes.length) { \n      this.handleClassList(innerContentWrapper, 'add', 'no-gap')\n    } else { \n      this.handleClassList(innerContentWrapper, 'remove', 'no-gap')\n    }\n  }\n\n  getItemMenu() { \n    const menu = this.el.shadowRoot.querySelector('.navbar-menu');\n    return menu;\n  }\n\n  closeItemMenu() { \n    const itemMenu = this.getItemMenu()\n    const menuItem = this.getNavBarItem()\n    if(itemMenu) { \n      this.handleClassList(itemMenu, 'remove', 'open')\n      this.handleClassList(menuItem, 'remove', 'open')\n    }\n  }\n\n  toggleItemMenu() {\n    if(!this.internalHref) {     \n      if(this.isMenuItem && this.hasChildNavItems) { \n        const itemMenu = this.getItemMenu()\n        this.handleClassList(itemMenu, 'add', 'right')\n      }\n   \n      if(this.hasChildNavItems) { \n        const itemMenu = this.getItemMenu();\n        const menuItem = this.getNavBarItem()\n        this.handleClassList(itemMenu, 'toggle', 'open');\n        this.handleClassList(menuItem, 'toggle', 'open');\n      } \n    }\n  }\n\n  itemHasNestedItems() { \n    const childNavItem = this.el.shadowRoot.querySelector('ifx-navbar-item')\n    if(childNavItem) { \n      return true;\n    } else {\n      return false;\n    }\n  }\n\n\n  render() {\n    return (\n      <div class=\"container\">\n        <a href={this.internalHref} target={this.target} onClick={() => this.toggleItemMenu()} class=   {`navbar__item ${!this.showLabel ? 'removeLabel' : \"\"} ${this.hasChildNavItems ? 'isParent' : \"\"}`}>\n          <div class=\"inner__content-wrapper\">\n            <div class={`navbar__container-right-content-navigation-item-icon-wrapper`}>\n             {this.userName.trim() !== \"\" && <div class='username__tooltip'>{this.userName}</div>}\n\n             {this.internalImageUrl.type !== 'initials' && \n              <img src={ this.internalImageUrl.type === 'url' ? this.internalImageUrl.value : `data:image/svg+xml,${encodeURIComponent(this.defaultProfileImage)}`} alt={this.alt} />}\n\n              {this.internalImageUrl.type === 'initials' && \n              <div class=\"initials__wrapper\">\n                <span class=\"initials\">{this.internalImageUrl.value}</span>\n              </div>}\n              \n            </div>\n            <span class=\"label__wrapper\">\n              <slot onSlotchange={() => this.setProfileGap()} />\n            </span>\n          </div>\n          {/* {this.userName.trim() !== \"\" && <div class='username__tooltip'>{this.userName}</div>} */}\n        </a>\n        \n        {this.hasChildNavItems && <ul class='navbar-menu rightSideItemMenu'> <slot name=\"first__layer\" /> </ul>}\n      </div>\n    )\n  }\n}"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as e,h as i,a}from"./p-PqnYwNKt.js";const t=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{pointer-events:none}.card__headline-wrapper{padding-bottom:16px}.card__headline-wrapper.withDesc{padding-bottom:8px}.card-headline{margin-top:0;padding-top:0;font-family:var(--ifx-font-family);font-weight:600;font-size:1.5rem;line-height:2rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.card-headline.horizontal{font-size:1.25rem;line-height:28px}';const o=class{constructor(i){e(this,i)}componentWillLoad(){var e;const i=this.el.closest("ifx-card");if(i){const a=(e=i.shadowRoot.querySelector(".card"))===null||e===void 0?void 0:e.className;if(a&&a.includes("horizontal")){this.direction="horizontal"}const t=i.querySelector("ifx-card-text");if(t){this.hasDesc=true}}}render(){return i("div",{key:"46766a6fd8ea2e16ad47662ad5ad06d25359f5e0",class:`card__headline-wrapper ${this.hasDesc?"withDesc":""}`},i("div",{key:"2368c853f7f8ce565ab00628b925c86eae56eae1",class:`card-headline ${this.direction}`},i("slot",{key:"8c99851e5308f19672df8aa625ca428464fea515"})))}get el(){return a(this)}};o.style=t;export{o as ifx_card_headline};
+//# sourceMappingURL=p-9ba730bb.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["cardHeadlineCss","CardHeadline","componentWillLoad","cardElement","this","el","closest","cardClass","_a","shadowRoot","querySelector","className","includes","direction","desc","hasDesc","render","h","key","class"],"sources":["src/components/card/card-headline/card-headline.scss?tag=ifx-card-headline&encapsulation=shadow","src/components/card/card-headline/card-headline.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__headline-wrapper {\n  padding-bottom: 16px;\n\n  &.withDesc {\n    padding-bottom: 8px;\n  }\n}\n\n.card-headline {\n  margin-top: 0;\n  padding-top: 0;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n  font-weight: tokens.$ifxFontWeightSemibold;\n  font-size: tokens.$ifxFontSize3xl;\n  line-height: tokens.$ifxLineHeight3xl;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  text-overflow: ellipsis;\n\n  &.horizontal {\n    font-size: tokens.$ifxFontSizeXl;\n    line-height: 28px;\n  }\n\n}","import { Component, h, Element, State } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-card-headline',\n  styleUrl: 'card-headline.scss',\n  shadow: true,\n})\n\nexport class CardHeadline {\n  @Element() el;\n  @State() direction: string;\n  @State() hasDesc: boolean;\n\n  componentWillLoad() {\n    const cardElement = this.el.closest('ifx-card');\n\n    if (cardElement) {\n      const cardClass = cardElement.shadowRoot.querySelector('.card')?.className;\n\n      if (cardClass && cardClass.includes('horizontal')) {\n        this.direction = 'horizontal'\n      }\n\n      const desc = cardElement.querySelector('ifx-card-text');\n      if (desc) {\n        this.hasDesc = true;\n      }\n    }\n  }\n\n\n  render() {\n    return (\n      <div class={`card__headline-wrapper ${this.hasDesc ? 'withDesc' : \"\"}`}>\n        <div class={`card-headline ${this.direction}`}>\n          <slot />\n        </div>\n      </div>\n    )\n  }\n}\n"],"mappings":"6CAAA,MAAMA,EAAkB,ke,MCQXC,EAAY,M,yBAKvB,iBAAAC,G,MACE,MAAMC,EAAcC,KAAKC,GAAGC,QAAQ,YAEpC,GAAIH,EAAa,CACf,MAAMI,GAAYC,EAAAL,EAAYM,WAAWC,cAAc,YAAQ,MAAAF,SAAA,SAAAA,EAAEG,UAEjE,GAAIJ,GAAaA,EAAUK,SAAS,cAAe,CACjDR,KAAKS,UAAY,Y,CAGnB,MAAMC,EAAOX,EAAYO,cAAc,iBACvC,GAAII,EAAM,CACRV,KAAKW,QAAU,I,GAMrB,MAAAC,GACE,OACEC,EAAK,OAAAC,IAAA,2CAAAC,MAAO,0BAA0Bf,KAAKW,QAAU,WAAa,MAChEE,EAAA,OAAAC,IAAA,2CAAKC,MAAO,iBAAiBf,KAAKS,aAChCI,EAAQ,QAAAC,IAAA,8C","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-e66a51e4.entry.js → p-9deaa65e.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as i,a as o}from"./p-PqnYwNKt.js";import{d as e,t as r}from"./p-DcmcuUOA.js";import{i as a}from"./p-Bw2fh5LT.js";const n=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.radio-button-group-container{display:flex;flex-direction:column}.radio-button-group{display:flex;gap:8px}.radio-button-group.horizontal{flex-direction:row;column-gap:12px}.radio-button-group.vertical{flex-direction:column;row-gap:12px}.group-label{font-size:1rem;color:#1D1D1D;line-height:1.5rem;font-weight:400;margin-bottom:8px;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.group-label .required{color:#575352;margin-left:4px}.group-label .required.error{color:#CD002F}.caption{margin-top:8px;align-self:flex-start;display:flex;width:100%;column-gap:8px;justify-content:space-between;align-items:center}.caption.default{color:#1D1D1D}.caption.error{color:#CD002F}.caption-text{font-size:0.75rem;line-height:1rem;flex:1;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption-icon{flex:0;display:flex}';const s=class{constructor(i){t(this,i);this.errorStates=new Map;this.alignment="vertical";this.groupLabelText="Group Label Text";this.required=false;this.hasErrors=false;this.handleSlotChange=()=>{this.initializeState()}}handleRadioButtonError(t){const i=t.target;if(i.tagName.toLowerCase()==="ifx-radio-button"){this.errorStates.set(i,t.detail);this.updateHasErrors()}}async setGroupError(t){const i=Array.from(this.el.querySelectorAll("ifx-radio-button"));i.forEach((i=>{i.error=t}))}componentWillLoad(){this.initializeState()}async componentDidLoad(){if(!a(this.el)){const t=e();r("ifx-radio-button-group",await t)}}initializeState(){this.errorStates.clear();const t=Array.from(this.el.querySelectorAll("ifx-radio-button"));t.forEach((t=>{if(!this.errorStates.has(t)){this.errorStates.set(t,t.error||false)}}));this.updateHasErrors()}updateHasErrors(){console.log("here");this.hasErrors=Array.from(this.errorStates.values()).some((t=>t))}render(){return i("div",{key:"9d56fb1bbb2ad9ce178e55f2e703bcba8be4e6b2",class:"radio-button-group-container"},this.showGroupLabel&&i("div",{key:"314ff595785c24d188cf98dc232a9dae19205f44",class:"group-label"},this.groupLabelText,this.required&&i("span",{key:"fe839163d77957b80d72b7bcf8369a68e7a3d992",class:`required ${this.hasErrors?"error":""}`},"*")),i("div",{key:"018d84f32df0e17743080ac09d98bc030fe09e30",class:`radio-button-group ${this.alignment} ${this.size}`},i("slot",{key:"d632718b08c8100e6c8604059f86abfc324e2ba8",onSlotchange:this.handleSlotChange})),this.showCaption?i("div",{class:`caption ${this.hasErrors?"error":"default"}`},this.showCaptionIcon?i("div",{class:"caption-icon"},i("ifx-icon",{icon:"c-info-16"})):"",i("div",{class:"caption-text"},this.captionText)):"")}get el(){return o(this)}};s.style=n;export{s as ifx_radio_button_group};
-//# sourceMappingURL=p-e66a51e4.entry.js.map
+import{r as t,h as i,a as o}from"./p-PqnYwNKt.js";import{d as e,t as r}from"./p-DcmcuUOA.js";import{i as a}from"./p-Bw2fh5LT.js";const n=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.radio-button-group-container{display:flex;flex-direction:column}.radio-button-group{display:flex;gap:8px}.radio-button-group.horizontal{flex-direction:row;column-gap:12px}.radio-button-group.vertical{flex-direction:column;row-gap:12px}.group-label{font-size:1rem;color:#1D1D1D;line-height:1.5rem;font-weight:400;margin-bottom:8px;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.group-label .required{color:#575352;margin-left:4px}.group-label .required.error{color:#CD002F}.caption{margin-top:8px;align-self:flex-start;display:flex;width:100%;column-gap:8px;justify-content:space-between;align-items:center}.caption.default{color:#1D1D1D}.caption.error{color:#CD002F}.caption-text{font-size:0.75rem;line-height:1rem;flex:1;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption-icon{flex:0;display:flex}';const s=class{constructor(i){t(this,i);this.errorStates=new Map;this.alignment="vertical";this.groupLabelText="Group Label Text";this.required=false;this.hasErrors=false;this.handleSlotChange=()=>{this.initializeState()}}handleRadioButtonError(t){const i=t.target;if(i.tagName.toLowerCase()==="ifx-radio-button"){this.errorStates.set(i,t.detail);this.updateHasErrors()}}async setGroupError(t){const i=Array.from(this.el.querySelectorAll("ifx-radio-button"));i.forEach((i=>{i.error=t}))}componentWillLoad(){this.initializeState()}async componentDidLoad(){if(!a(this.el)){const t=e();r("ifx-radio-button-group",await t)}}initializeState(){this.errorStates.clear();const t=Array.from(this.el.querySelectorAll("ifx-radio-button"));t.forEach((t=>{if(!this.errorStates.has(t)){this.errorStates.set(t,t.error||false)}}));this.updateHasErrors()}updateHasErrors(){console.log("here");this.hasErrors=Array.from(this.errorStates.values()).some((t=>t))}render(){return i("div",{key:"dcd66919142f41e8d51054f7de1663361c273232",class:"radio-button-group-container"},this.showGroupLabel&&i("div",{key:"7765acb090b78c495b03b17f242b0efacba29a10",class:"group-label"},this.groupLabelText,this.required&&i("span",{key:"e500cc4867c756991d6e76b77640b6fc1f052296",class:`required ${this.hasErrors?"error":""}`},"*")),i("div",{key:"05211a3727a84a135588bccee63d22c36511cbee",class:`radio-button-group ${this.alignment} ${this.size}`},i("slot",{key:"4d9cbd4f52276f6c101306208bd6156e01287f2f",onSlotchange:this.handleSlotChange})),this.showCaption?i("div",{class:`caption ${this.hasErrors?"error":"default"}`},this.showCaptionIcon?i("div",{class:"caption-icon"},i("ifx-icon",{icon:"c-info-16"})):"",i("div",{class:"caption-text"},this.captionText)):"")}get el(){return o(this)}};s.style=n;export{s as ifx_radio_button_group};
+//# sourceMappingURL=p-9deaa65e.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["radioButtonGroupCss","RadioButtonGroup","constructor","hostRef","this","errorStates","Map","alignment","groupLabelText","required","hasErrors","handleSlotChange","initializeState","handleRadioButtonError","event","radioButton","target","tagName","toLowerCase","set","detail","updateHasErrors","setGroupError","error","radioButtons","Array","from","el","querySelectorAll","forEach","componentWillLoad","componentDidLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","clear","has","console","log","values","some","render","h","key","class","showGroupLabel","size","onSlotchange","showCaption","showCaptionIcon","icon","captionText"],"sources":["src/components/radio-button-group/radio-button-group.scss?tag=ifx-radio-button-group&encapsulation=shadow","src/components/radio-button-group/radio-button-group.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.radio-button-group-container {\n    display: flex;\n    flex-direction: column;\n}\n\n.radio-button-group {\n    display: flex;\n    gap: tokens.$ifxSpace100;\n\n    &.horizontal {\n        flex-direction: row;\n        column-gap: tokens.$ifxSpace150;\n    }\n\n    &.vertical {\n        flex-direction: column;\n        row-gap: tokens.$ifxSpace150;\n    }\n}\n\n.group-label {\n    font-size: tokens.$ifxFontSizeM;\n    color: tokens.$ifxColorBaseBlack;\n    line-height: tokens.$ifxLineHeightM;\n    font-weight: tokens.$ifxFontWeightRegular;\n    margin-bottom: tokens.$ifxSpace100;\n    text-align: left;\n    text-underline-position: from-font;\n    text-decoration-skip-ink: none;\n}\n\n.group-label .required {\n    color: tokens.$ifxColorEngineering500;\n    margin-left: tokens.$ifxSpace50;\n}\n\n.group-label .required.error {\n    color: tokens.$ifxColorRed500;\n}\n\n.caption {\n    margin-top: tokens.$ifxSpace100;\n    align-self: flex-start;\n    display: flex;\n    width: 100%;\n    column-gap: tokens.$ifxSpace100;\n    justify-content: space-between;\n    align-items: center;\n\n    &.default {\n        color: tokens.$ifxColorBaseBlack;\n    }\n\n    &.error {\n        color: tokens.$ifxColorRed500;\n    }\n}\n\n.caption-text {\n    font-size: tokens.$ifxFontSizeXs;\n    line-height: tokens.$ifxLineHeightXs;\n    flex: 1;\n    text-align: left;\n    text-underline-position: from-font;\n    text-decoration-skip-ink: none;\n}\n\n.caption-icon {\n    flex:0;\n    display: flex;\n}","import { Component, State, Prop, h, Element, Listen, Method } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n    tag: 'ifx-radio-button-group',\n    styleUrl: 'radio-button-group.scss',\n    shadow: true,\n    // formAssociated: true\n})\n\nexport class RadioButtonGroup {\n    private errorStates: Map<HTMLElement, boolean> = new Map();\n\n    @Element() el: HTMLElement;\n    @Prop() alignment: 'horizontal' | 'vertical' = 'vertical';\n    @Prop() size: string;\n    @Prop() showGroupLabel: boolean;\n    @Prop() groupLabelText: string = 'Group Label Text';\n    @Prop() showCaption: boolean;\n    @Prop() captionText: string;\n    @Prop() showCaptionIcon: boolean;\n    @Prop() required: boolean = false;\n    @State() hasErrors: boolean = false;\n    \n    @Listen('ifxError')\n    handleRadioButtonError(event: CustomEvent) {\n        const radioButton = event.target as HTMLElement;\n        if (radioButton.tagName.toLowerCase() === 'ifx-radio-button') {\n            this.errorStates.set(radioButton, event.detail);\n            this.updateHasErrors();\n        }\n    }\n\n     // Method to set the error state of all radio-butttons in the group\n      @Method()\n      async setGroupError(error: boolean) {\n        const radioButtons = Array.from(this.el.querySelectorAll('ifx-radio-button'));\n        radioButtons.forEach((radioButton) => {\n          (radioButton as any).error = error;\n        });\n      }\n\n    componentWillLoad() {\n        this.initializeState();\n    }\n\n    async componentDidLoad() { \n        if(!isNestedInIfxComponent(this.el)) { \n            const framework = detectFramework();\n            trackComponent('ifx-radio-button-group', await framework)\n        }\n    }\n\n    handleSlotChange = () => {\n        this.initializeState();\n    };\n\n    private initializeState() {\n        this.errorStates.clear();\n        const radioButtons = Array.from(this.el.querySelectorAll('ifx-radio-button'));\n        radioButtons.forEach((radioButton) => {\n            if (!this.errorStates.has(radioButton)) {\n                this.errorStates.set(radioButton, (radioButton as any).error || false);\n            }\n        });\n        this.updateHasErrors();\n    }\n\n    private updateHasErrors() {\n        console.log('here')\n        this.hasErrors = Array.from(this.errorStates.values()).some((error) => error);\n    }\n\n    render() {\n        return (\n            <div class='radio-button-group-container'>\n                {this.showGroupLabel && (\n                    <div class=\"group-label\">\n                        {this.groupLabelText}\n                        {this.required && <span class={`required ${this.hasErrors ? 'error' : ''}`}>*</span>}\n                    </div>\n                )}\n                <div class={`radio-button-group ${this.alignment} ${this.size}`}>\n                    <slot onSlotchange={this.handleSlotChange} ></slot>\n                </div>\n                {this.showCaption ? (\n                    <div class={`caption ${this.hasErrors ? 'error' : 'default'}`}>\n                        {this.showCaptionIcon ? <div class='caption-icon'><ifx-icon icon=\"c-info-16\">\n                        </ifx-icon></div> : ''}\n                        <div class='caption-text'>{this.captionText}</div>\n                    </div>) : ''}\n            </div>\n        );\n    }\n}"],"mappings":"iIAAA,MAAMA,EAAsB,u6B,MCYfC,EAAgB,MAP7B,WAAAC,CAAAC,G,UAQYC,KAAAC,YAAyC,IAAIC,IAG7CF,KAASG,UAA8B,WAGvCH,KAAcI,eAAW,mBAIzBJ,KAAQK,SAAY,MACnBL,KAASM,UAAY,MA+B9BN,KAAgBO,iBAAG,KACfP,KAAKQ,iBAAiB,CAwC7B,CArEG,sBAAAC,CAAuBC,GACnB,MAAMC,EAAcD,EAAME,OAC1B,GAAID,EAAYE,QAAQC,gBAAkB,mBAAoB,CAC1Dd,KAAKC,YAAYc,IAAIJ,EAAaD,EAAMM,QACxChB,KAAKiB,iB,EAMX,mBAAMC,CAAcC,GAClB,MAAMC,EAAeC,MAAMC,KAAKtB,KAAKuB,GAAGC,iBAAiB,qBACzDJ,EAAaK,SAASd,IACnBA,EAAoBQ,MAAQA,CAAK,G,CAIxC,iBAAAO,GACI1B,KAAKQ,iB,CAGT,sBAAMmB,GACF,IAAIC,EAAuB5B,KAAKuB,IAAK,CACjC,MAAMM,EAAYC,IAClBC,EAAe,+BAAgCF,E,EAQ/C,eAAArB,GACJR,KAAKC,YAAY+B,QACjB,MAAMZ,EAAeC,MAAMC,KAAKtB,KAAKuB,GAAGC,iBAAiB,qBACzDJ,EAAaK,SAASd,IAClB,IAAKX,KAAKC,YAAYgC,IAAItB,GAAc,CACpCX,KAAKC,YAAYc,IAAIJ,EAAcA,EAAoBQ,OAAS,M,KAGxEnB,KAAKiB,iB,CAGD,eAAAA,GACJiB,QAAQC,IAAI,QACZnC,KAAKM,UAAYe,MAAMC,KAAKtB,KAAKC,YAAYmC,UAAUC,MAAMlB,GAAUA,G,CAG3E,MAAAmB,GACI,OACIC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,gCACNzC,KAAK0C,gBACFH,EAAK,OAAAC,IAAA,2CAAAC,MAAM,eACNzC,KAAKI,eACLJ,KAAKK,UAAYkC,EAAA,QAAAC,IAAA,2CAAMC,MAAO,YAAYzC,KAAKM,UAAY,QAAU,MAAc,MAG5FiC,EAAK,OAAAC,IAAA,2CAAAC,MAAO,sBAAsBzC,KAAKG,aAAaH,KAAK2C,QACrDJ,EAAA,QAAAC,IAAA,2CAAMI,aAAc5C,KAAKO,oBAE5BP,KAAK6C,YACFN,EAAA,OAAKE,MAAO,WAAWzC,KAAKM,UAAY,QAAU,aAC7CN,KAAK8C,gBAAkBP,EAAK,OAAAE,MAAM,gBAAeF,EAAU,YAAAQ,KAAK,eAC7C,GACpBR,EAAA,OAAKE,MAAM,gBAAgBzC,KAAKgD,cAC1B,G","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"file":"p-Bw2fh5LT.js","sources":["src/global/utils/dom-utils.ts"],"sourcesContent":["export const isNestedInIfxComponent = (el: HTMLElement): boolean => {\r\n  let parent: Node | ShadowRoot | null = el.parentNode;\r\n  \r\n  while (parent) {\r\n    if (parent instanceof ShadowRoot) {\r\n      parent = parent.host;\r\n      continue;\r\n    }\r\n    \r\n    if (parent instanceof HTMLElement && parent.tagName.toLowerCase().startsWith('ifx')) {\r\n      return true;\r\n    }\r\n    \r\n    parent = parent.parentNode;\r\n  }\r\n  \r\n  return false;\r\n};"],"names":[],"mappings":"AAAa,MAAA,sBAAsB,GAAG,CAAC,EAAe,KAAa;AACjE,IAAA,IAAI,MAAM,GAA6B,EAAE,CAAC,UAAU;IAEpD,OAAO,MAAM,EAAE;AACb,QAAA,IAAI,MAAM,YAAY,UAAU,EAAE;AAChC,YAAA,MAAM,GAAG,MAAM,CAAC,IAAI;YACpB;;AAGF,QAAA,IAAI,MAAM,YAAY,WAAW,IAAI,MAAM,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE;AACnF,YAAA,OAAO,IAAI;;AAGb,QAAA,MAAM,GAAG,MAAM,CAAC,UAAU;;AAG5B,IAAA,OAAO,KAAK;AACd;;;;"}
+{"version":3,"file":"p-Bw2fh5LT.js","sources":["src/global/utils/dom-utils.ts"],"sourcesContent":["export const isNestedInIfxComponent = (el: HTMLElement): boolean => {\n  let parent: Node | ShadowRoot | null = el.parentNode;\n  \n  while (parent) {\n    if (parent instanceof ShadowRoot) {\n      parent = parent.host;\n      continue;\n    }\n    \n    if (parent instanceof HTMLElement && parent.tagName.toLowerCase().startsWith('ifx')) {\n      return true;\n    }\n    \n    parent = parent.parentNode;\n  }\n  \n  return false;\n};"],"names":[],"mappings":"AAAa,MAAA,sBAAsB,GAAG,CAAC,EAAe,KAAa;AACjE,IAAA,IAAI,MAAM,GAA6B,EAAE,CAAC,UAAU;IAEpD,OAAO,MAAM,EAAE;AACb,QAAA,IAAI,MAAM,YAAY,UAAU,EAAE;AAChC,YAAA,MAAM,GAAG,MAAM,CAAC,IAAI;YACpB;;AAGF,QAAA,IAAI,MAAM,YAAY,WAAW,IAAI,MAAM,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE;AACnF,YAAA,OAAO,IAAI;;AAGb,QAAA,MAAM,GAAG,MAAM,CAAC,UAAU;;AAG5B,IAAA,OAAO,KAAK;AACd;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"p-DcmcuUOA.js","sources":["src/global/utils/tracking.ts","src/global/utils/dom-ready.ts","src/global/utils/framework-detection.ts"],"sourcesContent":["declare global {\r\n  interface Window {\r\n    btntConfig?: any;\r\n    btntQueue?: any[];\r\n    btnt?: (data: object) => void;\r\n    INFINEON_TRACKED_COMPONENTS?: Set<string>; \r\n  }\r\n}\r\n\r\nconst isTestEnvironment = typeof process !== 'undefined' &&\r\n  process.env &&\r\n  process.env.NODE_ENV === 'test';\r\n\r\nfunction initializeTracking() {\r\n  if (isTestEnvironment) {\r\n    if (!window.btnt) { \r\n      window.btnt = () => { };\r\n    }\r\n    return;\r\n  }\r\n\r\n  (function (t, r, _kk, n, pp) {\r\n    if (typeof window.btntConfig !== \"object\") {\r\n      window.btntConfig = {\r\n        domain: \"https://ssgtm.infineon.com\",\r\n        withCookies: true,\r\n        maxBatchSize: 10\r\n      };\r\n    }\r\n\r\n    if (window[\"btnt\"]) return;\r\n\r\n    window[\"btnt\"] = function (z) {\r\n      if (typeof z !== \"object\") {\r\n        z = {};\r\n      }\r\n      if (typeof window.btntQueue !== \"object\") {\r\n        window.btntQueue = [];\r\n      }\r\n      window.btntQueue.push(z);\r\n    };\r\n\r\n    n = t.createElement(r);\r\n\r\n    // Add safety check for test environments\r\n    pp = t.getElementsByTagName(r)[0];\r\n    if (pp && pp.parentNode) {\r\n      n.async = 1;\r\n      n.src = window.btntConfig.domain + \"/btnt.js\";\r\n      pp.parentNode.insertBefore(n, pp);\r\n    }\r\n  })(document, \"script\");\r\n}\r\n\r\nexport function trackComponent(componentName: string, environment: string) {\r\n  const skipEnvironments = ['jest', 'localhost', 'error'];\r\n  if (skipEnvironments.includes(environment)) {\r\n    return;\r\n  }\r\n\r\n  if (!window.INFINEON_TRACKED_COMPONENTS) {\r\n    window.INFINEON_TRACKED_COMPONENTS = new Set();\r\n  }\r\n\r\n  if (window.INFINEON_TRACKED_COMPONENTS.has(componentName)) {\r\n    return; \r\n  }\r\n\r\n  window.INFINEON_TRACKED_COMPONENTS.add(componentName);\r\n\r\n  if (!window.btnt) initializeTracking();\r\n\r\n  window.btnt({\r\n    event_name: \"component_initialized\",\r\n    component_name: componentName,\r\n    environment: environment\r\n  });\r\n}\r\n\r\nexport default trackComponent;","export const waitForDOMReady = (): Promise<void> => {\r\n  return new Promise((resolve) => {\r\n    if (document.readyState === 'complete' || document.readyState === 'interactive') {\r\n      resolve();\r\n    } else {\r\n      const onReady = () => {\r\n        resolve();\r\n        document.removeEventListener('DOMContentLoaded', onReady);\r\n      };\r\n      document.addEventListener('DOMContentLoaded', onReady);\r\n    }\r\n  });\r\n};","let frameworkCache: string | null = null;\r\nimport { waitForDOMReady } from './dom-ready';\r\n\r\nexport const detectFramework = async (): Promise<string> => {\r\n  if (frameworkCache) return frameworkCache;\r\n  \r\n  if (typeof window === 'undefined' || typeof document === 'undefined') {\r\n    frameworkCache = 'non-browser';\r\n    return frameworkCache;\r\n  }\r\n\r\n  const win = window as any;\r\n  const doc = document;\r\n\r\n  const isJest = typeof process !== 'undefined' && \r\n                 process.env && \r\n                 process.env.NODE_ENV === 'test';\r\n  if (isJest) {\r\n    frameworkCache = 'jest';\r\n    return frameworkCache;\r\n  }\r\n\r\n  const isStorybook = win.location.search.includes('viewMode') || \r\n                      win.location.href.includes('viewMode') ||\r\n                      win.__STORYBOOK_ENV__;\r\n  \r\n  if (isStorybook) {\r\n    frameworkCache = 'Storybook';\r\n    return frameworkCache;\r\n  }\r\n\r\n  const isLocalhost = ['localhost', '127.0.0.1'].includes(win.location.hostname);\r\n  if (isLocalhost) {\r\n    frameworkCache = 'localhost';\r\n    return frameworkCache;\r\n  }\r\n\r\n  try {\r\n\r\n    if (win.React || win.ReactDOM) {\r\n      frameworkCache = 'React';\r\n      return frameworkCache;\r\n    }\r\n    \r\n    if (win.ng || win.getAllAngularRootElements) {\r\n      frameworkCache = 'Angular';\r\n      return frameworkCache;\r\n    }\r\n    \r\n    if (win.Vue || win.__VUE__) {\r\n      frameworkCache = 'Vue';\r\n      return frameworkCache;\r\n    }\r\n\r\n    await waitForDOMReady();\r\n\r\n    const reactRoot = doc.querySelector('[data-reactroot], [data-reactid]');\r\n    if (reactRoot) {\r\n      frameworkCache = 'React';\r\n      return frameworkCache;\r\n    }\r\n    \r\n    const rootContainers = Array.from(doc.querySelectorAll('body > div'));\r\n    const hasReactRoot = rootContainers.some(container => {\r\n      const keys = Object.keys(container);\r\n      return keys.some(key => key.startsWith('__reactContainer'));\r\n    });\r\n    \r\n    if (hasReactRoot) {\r\n      frameworkCache = 'React';\r\n      return frameworkCache;\r\n    }\r\n    \r\n    if (doc.querySelector('[ng-version], [ng-app]')) {\r\n      frameworkCache = 'Angular';\r\n      return frameworkCache;\r\n    }\r\n    \r\n    if (doc.querySelector('[data-v-app]')) {\r\n      frameworkCache = 'Vue';\r\n      return frameworkCache;\r\n    }\r\n\r\n    frameworkCache = 'Vanilla';\r\n    return frameworkCache;\r\n  } catch (e) {\r\n    frameworkCache = 'error';\r\n    return frameworkCache;\r\n  }\r\n};"],"names":[],"mappings":"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"}
+{"version":3,"file":"p-DcmcuUOA.js","sources":["src/global/utils/tracking.ts","src/global/utils/dom-ready.ts","src/global/utils/framework-detection.ts"],"sourcesContent":["declare global {\n  interface Window {\n    btntConfig?: any;\n    btntQueue?: any[];\n    btnt?: (data: object) => void;\n    INFINEON_TRACKED_COMPONENTS?: Set<string>; \n  }\n}\n\nconst isTestEnvironment = typeof process !== 'undefined' &&\n  process.env &&\n  process.env.NODE_ENV === 'test';\n\nfunction initializeTracking() {\n  if (isTestEnvironment) {\n    if (!window.btnt) { \n      window.btnt = () => { };\n    }\n    return;\n  }\n\n  (function (t, r, _kk, n, pp) {\n    if (typeof window.btntConfig !== \"object\") {\n      window.btntConfig = {\n        domain: \"https://ssgtm.infineon.com\",\n        withCookies: true,\n        maxBatchSize: 10\n      };\n    }\n\n    if (window[\"btnt\"]) return;\n\n    window[\"btnt\"] = function (z) {\n      if (typeof z !== \"object\") {\n        z = {};\n      }\n      if (typeof window.btntQueue !== \"object\") {\n        window.btntQueue = [];\n      }\n      window.btntQueue.push(z);\n    };\n\n    n = t.createElement(r);\n\n    // Add safety check for test environments\n    pp = t.getElementsByTagName(r)[0];\n    if (pp && pp.parentNode) {\n      n.async = 1;\n      n.src = window.btntConfig.domain + \"/btnt.js\";\n      pp.parentNode.insertBefore(n, pp);\n    }\n  })(document, \"script\");\n}\n\nexport function trackComponent(componentName: string, environment: string) {\n  const skipEnvironments = ['jest', 'localhost', 'error'];\n  if (skipEnvironments.includes(environment)) {\n    return;\n  }\n\n  if (!window.INFINEON_TRACKED_COMPONENTS) {\n    window.INFINEON_TRACKED_COMPONENTS = new Set();\n  }\n\n  if (window.INFINEON_TRACKED_COMPONENTS.has(componentName)) {\n    return; \n  }\n\n  window.INFINEON_TRACKED_COMPONENTS.add(componentName);\n\n  if (!window.btnt) initializeTracking();\n\n  window.btnt({\n    event_name: \"component_initialized\",\n    component_name: componentName,\n    environment: environment\n  });\n}\n\nexport default trackComponent;","export const waitForDOMReady = (): Promise<void> => {\n  return new Promise((resolve) => {\n    if (document.readyState === 'complete' || document.readyState === 'interactive') {\n      resolve();\n    } else {\n      const onReady = () => {\n        resolve();\n        document.removeEventListener('DOMContentLoaded', onReady);\n      };\n      document.addEventListener('DOMContentLoaded', onReady);\n    }\n  });\n};","let frameworkCache: string | null = null;\nimport { waitForDOMReady } from './dom-ready';\n\nexport const detectFramework = async (): Promise<string> => {\n  if (frameworkCache) return frameworkCache;\n  \n  if (typeof window === 'undefined' || typeof document === 'undefined') {\n    frameworkCache = 'non-browser';\n    return frameworkCache;\n  }\n\n  const win = window as any;\n  const doc = document;\n\n  const isJest = typeof process !== 'undefined' && \n                 process.env && \n                 process.env.NODE_ENV === 'test';\n  if (isJest) {\n    frameworkCache = 'jest';\n    return frameworkCache;\n  }\n\n  const isStorybook = win.location.search.includes('viewMode') || \n                      win.location.href.includes('viewMode') ||\n                      win.__STORYBOOK_ENV__;\n  \n  if (isStorybook) {\n    frameworkCache = 'Storybook';\n    return frameworkCache;\n  }\n\n  const isLocalhost = ['localhost', '127.0.0.1'].includes(win.location.hostname);\n  if (isLocalhost) {\n    frameworkCache = 'localhost';\n    return frameworkCache;\n  }\n\n  try {\n\n    if (win.React || win.ReactDOM) {\n      frameworkCache = 'React';\n      return frameworkCache;\n    }\n    \n    if (win.ng || win.getAllAngularRootElements) {\n      frameworkCache = 'Angular';\n      return frameworkCache;\n    }\n    \n    if (win.Vue || win.__VUE__) {\n      frameworkCache = 'Vue';\n      return frameworkCache;\n    }\n\n    await waitForDOMReady();\n\n    const reactRoot = doc.querySelector('[data-reactroot], [data-reactid]');\n    if (reactRoot) {\n      frameworkCache = 'React';\n      return frameworkCache;\n    }\n    \n    const rootContainers = Array.from(doc.querySelectorAll('body > div'));\n    const hasReactRoot = rootContainers.some(container => {\n      const keys = Object.keys(container);\n      return keys.some(key => key.startsWith('__reactContainer'));\n    });\n    \n    if (hasReactRoot) {\n      frameworkCache = 'React';\n      return frameworkCache;\n    }\n    \n    if (doc.querySelector('[ng-version], [ng-app]')) {\n      frameworkCache = 'Angular';\n      return frameworkCache;\n    }\n    \n    if (doc.querySelector('[data-v-app]')) {\n      frameworkCache = 'Vue';\n      return frameworkCache;\n    }\n\n    frameworkCache = 'Vanilla';\n    return frameworkCache;\n  } catch (e) {\n    frameworkCache = 'error';\n    return frameworkCache;\n  }\n};"],"names":[],"mappings":"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"}

package/dist/infineon-design-system-stencil/{p-5251b206.entry.js → p-a4dd2fe1.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t}from"./p-PqnYwNKt.js";const r=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.step-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;gap:8px;font:400 1rem/1.5rem "Source Sans 3"}.step-wrapper.vertical{flex-direction:row;gap:12px;width:unset;height:100%}.step-wrapper.vertical .step-icon-wrapper{flex-direction:column;width:unset;height:100%}.step-wrapper.compact{gap:0;max-width:100%}.step-wrapper.compact .step-label{max-width:100%;cursor:auto;align-self:flex-start;color:#575352}.step-wrapper.compact.indicator-left{align-items:flex-end;text-align:right}.step-wrapper.compact.indicator-right{align-items:flex-start}.step-wrapper .step-label{max-width:90%;color:#BFBBBB;word-wrap:break-word}.step-wrapper .step-label.curr-label{font:600 1.25rem/1.75rem "Source Sans 3"}.step-wrapper .step-label:focus{outline:2px solid #0A8276;outline-offset:2px}.step-wrapper .step-label.next-label{font:400 0.75rem/1rem "Source Sans 3"}.step-wrapper .step-label :hover{color:#BFBBBB}.step-wrapper.first-step .step-connector-l{height:0px}.step-wrapper.last-step .step-connector-r{height:0px}.step-wrapper.vertical.first-step .step-connector-l,.step-wrapper.vertical.last-step .step-connector-r{width:0px}.step-wrapper.complete .step-connector-l,.step-wrapper.complete .step-connector-r,.step-wrapper.complete .step-icon{background:#0A8276}.step-wrapper.complete .step-connector-l.active,.step-wrapper.complete .step-connector-l.error,.step-wrapper.complete .step-connector-r.active,.step-wrapper.complete .step-connector-r.error,.step-wrapper.complete .step-icon.active,.step-wrapper.complete .step-icon.error{background:#BFBBBB}.step-wrapper.complete:not(.disabled) .step-label{cursor:pointer;color:#1D1D1D}.step-wrapper.complete:not(.disabled) .step-label :hover{color:#08665C}.step-wrapper.disabled .step-connector-l,.step-wrapper.disabled .step-connector-r,.step-wrapper.disabled .step-icon{background-color:#BFBBBB}.step-wrapper.disabled .step-label,.step-wrapper.disabled .step-label :hover{color:#BFBBBB}.step-wrapper.active .step-connector-l,.step-wrapper.active .step-connector-r,.step-wrapper.active .step-icon{background:#0A8276}.step-wrapper.active .step-connector-l.active,.step-wrapper.active .step-connector-l.error,.step-wrapper.active .step-connector-r.active,.step-wrapper.active .step-connector-r.error,.step-wrapper.active .step-icon.active,.step-wrapper.active .step-icon.error{background:#BFBBBB}.step-wrapper.active .step-label,.step-wrapper.active .step-label :hover{color:#1D1D1D}.step-wrapper.active.complete .step-label{cursor:auto}.step-wrapper.clickable:not(.active) .step-label{cursor:pointer}.step-wrapper.error:not(.active){color:#CD002F}.step-wrapper.error:not(.active) .step-label{color:#CD002F}.step-wrapper.error:not(.active) .step-label :hover{color:#0A8276}.step-wrapper.disabled .step-label{cursor:auto}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon{background:#08665C}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l.error,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r.error,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon.error{background:#BFBBBB}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-label{color:#08665C}.active-indic{width:16px;height:16px;border-radius:9999px;background:white}.step-icon-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%}.step-icon{width:24px;height:24px;background-color:#BFBBBB;border-radius:9999px;display:flex;align-items:center;justify-content:center;color:white}.step-connector-r,.step-connector-l{height:2px;min-width:40px;flex-grow:1;background-color:#BFBBBB}.vertical .step-connector-r,.vertical .step-connector-l{height:unset;min-width:unset;width:2px;min-height:40px}';const p=class{constructor(t){e(this,t);this.complete=false;this.disabled=false;this.error=false;this.lastStep=false;this.stepId=1;this.stepperState={activeStep:1,showStepNumber:false,variant:"default",indicatorPosition:"left"};this.clickable=false}onStepChange(e){const t=e.detail.previousActiveStep;if(t===this.stepId&&this.error){this.clickable=true}}updateCurrentStep(e){this.active=e.activeStep===this.stepId}updateErrorState(){if(this.active){this.error=false}}handleStepClick(){if(!this.disabled&&this.stepperState.variant!=="compact"&&(this.clickable||this.complete)){this.stepperState.setActiveStep(this.stepId,true)}}handleStepKeyDown(e){if(!this.disabled&&this.stepperState.variant!=="compact"&&(this.clickable||this.complete)&&e.key==="Enter"){this.stepperState.setActiveStep(this.stepId,true)}}stopOnClickPropogation(e){if(this.disabled){e.stopPropagation()}}render(){return t("div",{key:"1f778ed752335fa923c0a67eab7f7809a8386109","aria-current":this.active?"step":false,"aria-disabled":this.active||this.complete?false:true,onClick:e=>this.stopOnClickPropogation(e),class:`step-wrapper ${this.stepId===1?"first-step":""} \n                        ${this.error?"error":""}\n                        ${this.stepperState.variant}\n                        ${this.complete?"complete":""}\n                        ${this.lastStep?"last-step":""}\n                        indicator-${this.stepperState.indicatorPosition}\n                        ${this.active?"active":""}\n                        ${this.clickable?"clickable":""}\n                        ${this.disabled?"disabled":""}`},t("div",{key:"aa426822898b5151f6d5647befea92729117ef8d",class:"step-icon-wrapper"},this.stepperState.variant!=="compact"&&t("span",{key:"07937dc730e69e916b45bdf1caa328901b0dc1ff",class:"step-connector-l"}),this.stepperState.variant!=="compact"&&(!this.error||this.error&&this.active)&&t("div",{key:"13de06c3623199feeea739654ded0cd16fca3531",class:"step-icon"},this.stepperState.showStepNumber&&!this.complete&&!this.active?this.stepId:"",this.complete&&!this.active&&t("ifx-icon",{key:"e42c6f5cc67f840addf4b66f829cd1c1cebf19ee",icon:"check16"}),this.active&&t("span",{key:"198a9faaed9ed2c04622d39e1fd07753cc781d90",class:"active-indic"})),this.stepperState.variant!=="compact"&&this.error&&!this.active&&t("ifx-icon",{key:"4580d809db3368e8bb76c07e3e32b77c77dd98d2",icon:"warningF16"}),this.stepperState.variant!=="compact"&&t("span",{key:"9766552769baedf48b506cc790cef3ffcfef85cd",class:`step-connector-r ${this.active?"active":""}`})),(this.stepperState.variant!=="compact"||this.stepperState.variant==="compact"&&(this.active||this.stepId===this.stepperState.activeStep+1))&&t("div",{key:"875dec70a774a03043aa35e0a2448ed8ea1d5402",tabIndex:!this.disabled&&this.complete&&!this.active?0:-1,class:`step-label ${this.stepperState.variant==="compact"?this.active?"curr-label":"next-label":""}`,onClick:()=>{this.handleStepClick()},onKeyDown:e=>{this.handleStepKeyDown(e)}},this.stepperState.variant!=="compact"&&t("slot",{key:"df35686cab150ffceb42278824a74e2f754a5164"}),this.stepperState.variant==="compact"&&!this.active?"Next: ":"",this.stepperState.variant==="compact"&&t("slot",{key:"25dd5987f5fa7e0c61a5e0c07d3874bb3718d39d"})))}static get watchers(){return{stepperState:["updateCurrentStep"],active:["updateErrorState"]}}};p.style=r;export{p as ifx_step};
-//# sourceMappingURL=p-5251b206.entry.js.map
+import{r as e,h as t}from"./p-PqnYwNKt.js";const r=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.step-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;gap:8px;font:400 1rem/1.5rem "Source Sans 3"}.step-wrapper.vertical{flex-direction:row;gap:12px;width:unset;height:100%}.step-wrapper.vertical .step-icon-wrapper{flex-direction:column;width:unset;height:100%}.step-wrapper.compact{gap:0;max-width:100%}.step-wrapper.compact .step-label{max-width:100%;cursor:auto;align-self:flex-start;color:#575352}.step-wrapper.compact.indicator-left{align-items:flex-end;text-align:right}.step-wrapper.compact.indicator-right{align-items:flex-start}.step-wrapper .step-label{max-width:90%;color:#BFBBBB;word-wrap:break-word}.step-wrapper .step-label.curr-label{font:600 1.25rem/1.75rem "Source Sans 3"}.step-wrapper .step-label:focus{outline:2px solid #0A8276;outline-offset:2px}.step-wrapper .step-label.next-label{font:400 0.75rem/1rem "Source Sans 3"}.step-wrapper .step-label :hover{color:#BFBBBB}.step-wrapper.first-step .step-connector-l{height:0px}.step-wrapper.last-step .step-connector-r{height:0px}.step-wrapper.vertical.first-step .step-connector-l,.step-wrapper.vertical.last-step .step-connector-r{width:0px}.step-wrapper.complete .step-connector-l,.step-wrapper.complete .step-connector-r,.step-wrapper.complete .step-icon{background:#0A8276}.step-wrapper.complete .step-connector-l.active,.step-wrapper.complete .step-connector-l.error,.step-wrapper.complete .step-connector-r.active,.step-wrapper.complete .step-connector-r.error,.step-wrapper.complete .step-icon.active,.step-wrapper.complete .step-icon.error{background:#BFBBBB}.step-wrapper.complete:not(.disabled) .step-label{cursor:pointer;color:#1D1D1D}.step-wrapper.complete:not(.disabled) .step-label :hover{color:#08665C}.step-wrapper.disabled .step-connector-l,.step-wrapper.disabled .step-connector-r,.step-wrapper.disabled .step-icon{background-color:#BFBBBB}.step-wrapper.disabled .step-label,.step-wrapper.disabled .step-label :hover{color:#BFBBBB}.step-wrapper.active .step-connector-l,.step-wrapper.active .step-connector-r,.step-wrapper.active .step-icon{background:#0A8276}.step-wrapper.active .step-connector-l.active,.step-wrapper.active .step-connector-l.error,.step-wrapper.active .step-connector-r.active,.step-wrapper.active .step-connector-r.error,.step-wrapper.active .step-icon.active,.step-wrapper.active .step-icon.error{background:#BFBBBB}.step-wrapper.active .step-label,.step-wrapper.active .step-label :hover{color:#1D1D1D}.step-wrapper.active.complete .step-label{cursor:auto}.step-wrapper.clickable:not(.active) .step-label{cursor:pointer}.step-wrapper.error:not(.active){color:#CD002F}.step-wrapper.error:not(.active) .step-label{color:#CD002F}.step-wrapper.error:not(.active) .step-label :hover{color:#0A8276}.step-wrapper.disabled .step-label{cursor:auto}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon{background:#08665C}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l.error,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r.error,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon.error{background:#BFBBBB}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-label{color:#08665C}.active-indic{width:16px;height:16px;border-radius:9999px;background:white}.step-icon-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%}.step-icon{width:24px;height:24px;background-color:#BFBBBB;border-radius:9999px;display:flex;align-items:center;justify-content:center;color:white}.step-connector-r,.step-connector-l{height:2px;min-width:40px;flex-grow:1;background-color:#BFBBBB}.vertical .step-connector-r,.vertical .step-connector-l{height:unset;min-width:unset;width:2px;min-height:40px}';const p=class{constructor(t){e(this,t);this.complete=false;this.disabled=false;this.error=false;this.lastStep=false;this.stepId=1;this.stepperState={activeStep:1,showStepNumber:false,variant:"default",indicatorPosition:"left"};this.clickable=false}onStepChange(e){const t=e.detail.previousActiveStep;if(t===this.stepId&&this.error){this.clickable=true}}updateCurrentStep(e){this.active=e.activeStep===this.stepId}updateErrorState(){if(this.active){this.error=false}}handleStepClick(){if(!this.disabled&&this.stepperState.variant!=="compact"&&(this.clickable||this.complete)){this.stepperState.setActiveStep(this.stepId,true)}}handleStepKeyDown(e){if(!this.disabled&&this.stepperState.variant!=="compact"&&(this.clickable||this.complete)&&e.key==="Enter"){this.stepperState.setActiveStep(this.stepId,true)}}stopOnClickPropogation(e){if(this.disabled){e.stopPropagation()}}render(){return t("div",{key:"9a603ade945d1020bcba53fa85777a27f08f7df1","aria-current":this.active?"step":false,"aria-disabled":this.active||this.complete?false:true,onClick:e=>this.stopOnClickPropogation(e),class:`step-wrapper ${this.stepId===1?"first-step":""} \n                        ${this.error?"error":""}\n                        ${this.stepperState.variant}\n                        ${this.complete?"complete":""}\n                        ${this.lastStep?"last-step":""}\n                        indicator-${this.stepperState.indicatorPosition}\n                        ${this.active?"active":""}\n                        ${this.clickable?"clickable":""}\n                        ${this.disabled?"disabled":""}`},t("div",{key:"ec1bdd77edfd87f066df44db5f3f0e115b3f7a67",class:"step-icon-wrapper"},this.stepperState.variant!=="compact"&&t("span",{key:"46ae721e9ba89b6f561540d6228b4928d74522a0",class:"step-connector-l"}),this.stepperState.variant!=="compact"&&(!this.error||this.error&&this.active)&&t("div",{key:"e168325daeff9ca6b2ff4e045bce5ec974e9c5d5",class:"step-icon"},this.stepperState.showStepNumber&&!this.complete&&!this.active?this.stepId:"",this.complete&&!this.active&&t("ifx-icon",{key:"4eb3de9575a8704f0ed7e1ade9ccae31ea59c572",icon:"check16"}),this.active&&t("span",{key:"c0c554eaae6a28783a4597633e4c60dbe14c0fda",class:"active-indic"})),this.stepperState.variant!=="compact"&&this.error&&!this.active&&t("ifx-icon",{key:"1b27252ddf3369c3732e7b40786645ec2720d8bb",icon:"warningF16"}),this.stepperState.variant!=="compact"&&t("span",{key:"38bf07c39837ed4f77de59c44a2a32fbdb069439",class:`step-connector-r ${this.active?"active":""}`})),(this.stepperState.variant!=="compact"||this.stepperState.variant==="compact"&&(this.active||this.stepId===this.stepperState.activeStep+1))&&t("div",{key:"f13581114efa81deaeecd38ffe27b14d1d3dcc87",tabIndex:!this.disabled&&this.complete&&!this.active?0:-1,class:`step-label ${this.stepperState.variant==="compact"?this.active?"curr-label":"next-label":""}`,onClick:()=>{this.handleStepClick()},onKeyDown:e=>{this.handleStepKeyDown(e)}},this.stepperState.variant!=="compact"&&t("slot",{key:"6accb517e6d561549759a3a723c4c24b1729e80a"}),this.stepperState.variant==="compact"&&!this.active?"Next: ":"",this.stepperState.variant==="compact"&&t("slot",{key:"c6960ab0dd25316c6407433ecad376b66b47d28c"})))}static get watchers(){return{stepperState:["updateCurrentStep"],active:["updateErrorState"]}}};p.style=r;export{p as ifx_step};
+//# sourceMappingURL=p-a4dd2fe1.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["stepCss","Step","constructor","hostRef","this","complete","disabled","error","lastStep","stepId","stepperState","activeStep","showStepNumber","variant","indicatorPosition","clickable","onStepChange","event","previousActiveStep","detail","updateCurrentStep","newStepperState","active","updateErrorState","handleStepClick","setActiveStep","handleStepKeyDown","key","stopOnClickPropogation","stopPropagation","render","h","onClick","e","class","icon","tabIndex","onKeyDown"],"sources":["src/components/stepper/step/step.scss?tag=ifx-step&encapsulation=shadow","src/components/stepper/step/step.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n.step-wrapper {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: flex-start;\n    width: 100%;\n    gap: tokens.$ifxSize100;\n    font: tokens.$ifxBodyBody03;\n\n\n    &.vertical {\n        flex-direction: row;\n        gap: tokens.$ifxSize150;\n        width: unset;\n        height: 100%;\n        \n        .step-icon-wrapper {\n            flex-direction: column;\n            width: unset;\n            height: 100%;\n        }\n    }\n    \n    &.compact {\n        gap: 0;\n        max-width: 100%;\n        .step-label{\n            max-width: 100%;\n            cursor: auto;\n            align-self: flex-start;\n            color: tokens.$ifxColorEngineering500;\n        }\n        \n        &.indicator-left {\n            align-items: flex-end;\n            text-align: right;\n        }\n        \n        &.indicator-right {\n            align-items: flex-start;\n        }\n    }\n\n    .step-label {\n        max-width: 90%;\n        color: tokens.$ifxColorEngineering300; \n        word-wrap: break-word;\n        &.curr-label{\n            font: tokens.$ifxHeadingHeadingCompact04; \n        }\n        &:focus {\n        outline: 2px solid tokens.$ifxColorOcean500; \n        outline-offset: 2px;\n    }\n        &.next-label{\n            font: tokens.$ifxBodyBody05;\n        }\n        :hover{\n            color: tokens.$ifxColorEngineering300;\n        }\n    }\n\n    \n    &.first-step {\n        .step-connector-l{\n            height: 0px;\n        }\n    }\n    \n    &.last-step{\n        .step-connector-r{\n            height: 0px;\n        }\n    }\n\n    &.vertical {\n        &.first-step .step-connector-l,\n        &.last-step .step-connector-r {\n            width: 0px;\n        }\n    }\n\n    &.complete{\n        .step-connector-l, .step-connector-r, .step-icon {\n            background: tokens.$ifxColorOcean500;\n            &.active, &.error {\n                background: tokens.$ifxColorEngineering300;\n            }\n        }\n        &:not(.disabled) {\n            .step-label{\n                cursor: pointer;\n                color: tokens.$ifxColorBaseBlack;\n                :hover {\n                    color: tokens.$ifxColorOcean600;\n                }\n            }\n        }\n    } \n    \n    &.disabled{\n        .step-connector-l, \n        .step-connector-r, \n        .step-icon {\n            background-color: tokens.$ifxColorEngineering300;\n        }\n        .step-label, \n        .step-label :hover{\n            color: tokens.$ifxColorEngineering300;\n        }\n    }\n    \n    &.active{\n        .step-connector-l, \n        .step-connector-r, \n        .step-icon {\n            background: tokens.$ifxColorOcean500;\n            &.active, \n            &.error {\n                background: tokens.$ifxColorEngineering300;\n            }\n        }\n        .step-label, \n        .step-label :hover{\n            color: tokens.$ifxColorBaseBlack;\n        }\n        &.complete .step-label { \n            cursor: auto;\n        }\n        \n    } \n\n    &.clickable:not(.active) .step-label{\n        cursor: pointer;\n    }\n\n    &.error:not(.active){\n        color: tokens.$ifxColorRed500;\n        .step-label{\n            color: tokens.$ifxColorRed500;\n            :hover{\n                color: tokens.$ifxColorOcean500;\n            }\n        }\n    }\n\n    &.disabled{\n        .step-label{\n            cursor: auto;\n        }\n    }\n\n    &:hover{\n        &.complete:not(.disabled):not(.active){\n            .step-connector-l, \n            .step-connector-r, \n            .step-icon {\n                background: tokens.$ifxColorOcean600;\n                &.active, \n                &.error {\n                    background: tokens.$ifxColorEngineering300;\n                }\n            } \n            .step-label {\n                color: tokens.$ifxColorOcean600;\n            }\n        }\n    }\n    \n}\n\n.active-indic {\n    width: tokens.$ifxSize200;\n    height: tokens.$ifxSize200;\n    border-radius: tokens.$ifxBorderRadiusRound;\n    background: white;\n}\n\n.step-icon-wrapper {\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    width: 100%;\n}\n\n.step-icon {\n    width: tokens.$ifxSize300;\n    height: tokens.$ifxSize300;\n    background-color: tokens.$ifxColorEngineering300;\n    border-radius: tokens.$ifxBorderRadiusRound;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: white;\n}\n\n.step-connector-r, \n.step-connector-l {\n    height: 2px;\n    min-width: tokens.$ifxSize500;\n    flex-grow: 1;\n    background-color: tokens.$ifxColorEngineering300;\n}\n\n.vertical {\n    .step-connector-r, \n    .step-connector-l {\n        height: unset;\n        min-width: unset;\n        width: 2px;\n        min-height: tokens.$ifxSize500;\n    }\n}","import { h, \n         Component, \n         Listen, \n         Prop, \n         State, \n         Watch } from \"@stencil/core\";\nimport { StepperState } from \"../interfaces\";\n\n@Component({\n    tag: 'ifx-step',\n    styleUrl: 'step.scss',\n    shadow: true\n})\n\nexport class Step {\n    @Prop() complete?: boolean = false;\n    @Prop() disabled?: boolean = false;\n    @Prop({ mutable: true }) error?: boolean = false;\n    @Prop({ reflect: false }) lastStep: boolean = false;\n    @Prop() stepId: number = 1;\n    @Prop({ reflect: false }) stepperState: StepperState = { activeStep: 1, \n                                                             showStepNumber: false, \n                                                             variant: 'default', \n                                                             indicatorPosition: 'left' };\n\n    @State() active: boolean;\n    @State() clickable: boolean = false;\n\n    @Listen('ifxChange', { target: 'document' })\n    onStepChange(event: CustomEvent) {\n        const previousActiveStep = event.detail.previousActiveStep;\n        if (previousActiveStep === this.stepId && this.error) {\n            this.clickable = true;\n        }\n    } \n\n    @Watch('stepperState')\n    updateCurrentStep(newStepperState) {\n        this.active = (newStepperState.activeStep === this.stepId)\n    }\n\n    @Watch('active')\n    updateErrorState(){\n        if (this.active) {\n            this.error = false;\n        }\n    }\n\n\n    handleStepClick() {\n        if (!this.disabled && this.stepperState.variant !== 'compact' && (this.clickable || this.complete)) {\n            this.stepperState.setActiveStep(this.stepId, true)\n        } \n    }\n    \n    handleStepKeyDown(event: KeyboardEvent) {\n        if (!this.disabled && this.stepperState.variant !== 'compact' && (this.clickable || this.complete) && event.key === 'Enter') {\n            this.stepperState.setActiveStep(this.stepId, true)\n        } \n    }\n    \n    stopOnClickPropogation(event: Event) {\n        if (this.disabled) {\n            event.stopPropagation();\n        }\n    }\n\n    render() {\n        return (\n            <div aria-current = {this.active ? 'step': false}\n                aria-disabled = {this.active || this.complete ? false : true}\n                onClick={ (e) => this.stopOnClickPropogation(e) }\n                class = {`step-wrapper ${this.stepId === 1 ? 'first-step': ''} \n                        ${this.error ? 'error': ''}\n                        ${this.stepperState.variant}\n                        ${this.complete ? 'complete': ''}\n                        ${this.lastStep ? 'last-step': ''}\n                        indicator-${this.stepperState.indicatorPosition}\n                        ${this.active ? 'active' : ''}\n                        ${this.clickable ? 'clickable' : ''}\n                        ${this.disabled ? 'disabled': ''}`}>\n\n                <div class = 'step-icon-wrapper'>\n                    {/* Left connector */}\n                    {this.stepperState.variant !== 'compact' && <span class = 'step-connector-l'/>}\n\n                    {\n                        (this.stepperState.variant !== 'compact' && (!this.error || (this.error && this.active))) && \n                        <div class = 'step-icon'>\n                            {(this.stepperState.showStepNumber && !this.complete && !this.active) ? this.stepId : ''}\n                            {(this.complete && !this.active) && <ifx-icon icon='check16'></ifx-icon>}\n                            {this.active && <span class = 'active-indic'></span>}\n                        </div>\n                    }\n\n                    {(this.stepperState.variant !=='compact' && this.error && !this.active) && <ifx-icon icon='warningF16'></ifx-icon>}\n                    \n                    {/* Right connector */}\n                    {this.stepperState.variant !== 'compact' && <span class = {`step-connector-r ${this.active ? 'active' : ''}`}/>}\n                </div>\n\n                {\n                    /* Step labels */\n                    (this.stepperState.variant !== 'compact' || (this.stepperState.variant === 'compact' && (this.active || this.stepId === this.stepperState.activeStep+1))) && \n                    <div tabIndex={!this.disabled && this.complete && !this.active ? 0 : -1} \n                        class = {`step-label ${this.stepperState.variant === 'compact' ? (this.active ? 'curr-label' : 'next-label') : ''}`} \n                        onClick={() => { this.handleStepClick() }} \n                        onKeyDown={(e) => { this.handleStepKeyDown(e) }}>\n\n                        {(this.stepperState.variant !== 'compact') && <slot/>}\n\n                        {this.stepperState.variant === 'compact' &&  !this.active  ? 'Next: ' : ''}\n                        {this.stepperState.variant === 'compact' && <slot/>}\n                    </div>\n                }\n\n            </div>\n        );\n    };\n}\n"],"mappings":"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","ignoreList":[]}