@infineon/infineon-design-system-stencil 30.9.2--canary.1640.55f6082d40b32de317977a352b37983c1f14902c.0 → 30.9.2--canary.1640.c975b901d4687359a30b31a7f68f83e3017eabd6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (137) hide show
  1. package/dist/cjs/ifx-accordion_2.cjs.entry.js +6 -6
  2. package/dist/cjs/ifx-accordion_2.cjs.entry.js.map +1 -1
  3. package/dist/cjs/ifx-breadcrumb-item-label.cjs.entry.js +2 -2
  4. package/dist/cjs/ifx-breadcrumb-item-label.cjs.entry.js.map +1 -1
  5. package/dist/cjs/ifx-breadcrumb.cjs.entry.js +3 -3
  6. package/dist/cjs/ifx-breadcrumb.cjs.entry.js.map +1 -1
  7. package/dist/cjs/ifx-chip_3.cjs.entry.js +18 -18
  8. package/dist/cjs/ifx-chip_3.cjs.entry.js.map +1 -1
  9. package/dist/cjs/ifx-table.cjs.entry.js +2 -2
  10. package/dist/cjs/ifx-table.cjs.entry.js.map +1 -1
  11. package/dist/cjs/infineon-design-system-stencil.cjs.js +1 -1
  12. package/dist/cjs/loader.cjs.js +1 -1
  13. package/dist/collection/components/accordion/accordion.js +2 -2
  14. package/dist/collection/components/accordion/accordion.js.map +1 -1
  15. package/dist/collection/components/accordion/accordion.stories.js +18 -18
  16. package/dist/collection/components/accordion/accordion.stories.js.map +1 -1
  17. package/dist/collection/components/accordion/accordionItem.js +7 -7
  18. package/dist/collection/components/accordion/accordionItem.js.map +1 -1
  19. package/dist/collection/components/breadcrumb/breadcrumb-item-label.js +4 -4
  20. package/dist/collection/components/breadcrumb/breadcrumb-item-label.js.map +1 -1
  21. package/dist/collection/components/breadcrumb/breadcrumb.js +3 -3
  22. package/dist/collection/components/breadcrumb/breadcrumb.js.map +1 -1
  23. package/dist/collection/components/breadcrumb/breadcrumb.stories.js +29 -14
  24. package/dist/collection/components/breadcrumb/breadcrumb.stories.js.map +1 -1
  25. package/dist/collection/components/button/button.stories.js +1 -4
  26. package/dist/collection/components/button/button.stories.js.map +1 -1
  27. package/dist/collection/components/card/card.stories.js +9 -11
  28. package/dist/collection/components/card/card.stories.js.map +1 -1
  29. package/dist/collection/components/checkbox/checkbox.stories.js +1 -4
  30. package/dist/collection/components/checkbox/checkbox.stories.js.map +1 -1
  31. package/dist/collection/components/chip/chip-item/chip-item.js +4 -4
  32. package/dist/collection/components/chip/chip-item/chip-item.js.map +1 -1
  33. package/dist/collection/components/chip/chip.js +15 -15
  34. package/dist/collection/components/chip/chip.js.map +1 -1
  35. package/dist/collection/components/chip/chip.stories.js +18 -26
  36. package/dist/collection/components/chip/chip.stories.js.map +1 -1
  37. package/dist/collection/components/chip/interfaces.js.map +1 -1
  38. package/dist/collection/components/content-switcher/content-switcher.stories.js +2 -2
  39. package/dist/collection/components/content-switcher/content-switcher.stories.js.map +1 -1
  40. package/dist/collection/components/date-picker/date-picker.stories.js +22 -1
  41. package/dist/collection/components/date-picker/date-picker.stories.js.map +1 -1
  42. package/dist/collection/components/dropdown/dropdown.stories.js +100 -39
  43. package/dist/collection/components/dropdown/dropdown.stories.js.map +1 -1
  44. package/dist/collection/components/link/link.stories.js +1 -4
  45. package/dist/collection/components/link/link.stories.js.map +1 -1
  46. package/dist/collection/components/navigation/navbar/navbar.stories.js +5 -32
  47. package/dist/collection/components/navigation/navbar/navbar.stories.js.map +1 -1
  48. package/dist/collection/components/notification/notification.stories.js +1 -1
  49. package/dist/collection/components/notification/notification.stories.js.map +1 -1
  50. package/dist/collection/components/number-indicator/number-indicator.stories.js +1 -1
  51. package/dist/collection/components/number-indicator/number-indicator.stories.js.map +1 -1
  52. package/dist/collection/components/radio-button/radio-button.stories.js +1 -1
  53. package/dist/collection/components/radio-button/radio-button.stories.js.map +1 -1
  54. package/dist/collection/components/segmented-control/segmented-control.stories.js +0 -3
  55. package/dist/collection/components/segmented-control/segmented-control.stories.js.map +1 -1
  56. package/dist/collection/components/status/status.stories.js +1 -1
  57. package/dist/collection/components/status/status.stories.js.map +1 -1
  58. package/dist/collection/components/switch/switch.stories.js +2 -5
  59. package/dist/collection/components/switch/switch.stories.js.map +1 -1
  60. package/dist/collection/components/table-advanced-version/table.js +3 -3
  61. package/dist/collection/components/table-advanced-version/table.js.map +1 -1
  62. package/dist/collection/components/tag/tag.stories.js +2 -2
  63. package/dist/collection/components/tag/tag.stories.js.map +1 -1
  64. package/dist/collection/components/text-field/text-field.stories.js +1 -1
  65. package/dist/collection/components/text-field/text-field.stories.js.map +1 -1
  66. package/dist/components/ifx-accordion-item.js +1 -1
  67. package/dist/components/ifx-accordion.js +1 -1
  68. package/dist/components/ifx-breadcrumb-item-label.js +3 -3
  69. package/dist/components/ifx-breadcrumb-item-label.js.map +1 -1
  70. package/dist/components/ifx-breadcrumb.js +3 -3
  71. package/dist/components/ifx-breadcrumb.js.map +1 -1
  72. package/dist/components/ifx-chip-item.js +1 -1
  73. package/dist/components/ifx-chip.js +1 -1
  74. package/dist/components/ifx-faq.js +2 -2
  75. package/dist/components/ifx-table.js +5 -5
  76. package/dist/components/ifx-table.js.map +1 -1
  77. package/dist/components/{p-62c6aeb2.js → p-053d42ef.js} +6 -6
  78. package/dist/components/{p-62c6aeb2.js.map → p-053d42ef.js.map} +1 -1
  79. package/dist/components/{p-094bb435.js → p-3baaa460.js} +3 -3
  80. package/dist/components/{p-094bb435.js.map → p-3baaa460.js.map} +1 -1
  81. package/dist/components/{p-184f1004.js → p-793d89e7.js} +15 -15
  82. package/dist/components/p-793d89e7.js.map +1 -0
  83. package/dist/components/{p-23cdd5a7.js → p-7b5e297f.js} +5 -5
  84. package/dist/components/p-7b5e297f.js.map +1 -0
  85. package/dist/esm/ifx-accordion_2.entry.js +6 -6
  86. package/dist/esm/ifx-accordion_2.entry.js.map +1 -1
  87. package/dist/esm/ifx-breadcrumb-item-label.entry.js +2 -2
  88. package/dist/esm/ifx-breadcrumb-item-label.entry.js.map +1 -1
  89. package/dist/esm/ifx-breadcrumb.entry.js +3 -3
  90. package/dist/esm/ifx-breadcrumb.entry.js.map +1 -1
  91. package/dist/esm/ifx-chip_3.entry.js +18 -18
  92. package/dist/esm/ifx-chip_3.entry.js.map +1 -1
  93. package/dist/esm/ifx-table.entry.js +2 -2
  94. package/dist/esm/ifx-table.entry.js.map +1 -1
  95. package/dist/esm/infineon-design-system-stencil.js +1 -1
  96. package/dist/esm/loader.js +1 -1
  97. package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js +1 -1
  98. package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js.map +1 -1
  99. package/dist/infineon-design-system-stencil/{p-00d6e46e.entry.js → p-26810237.entry.js} +2 -2
  100. package/dist/infineon-design-system-stencil/p-26810237.entry.js.map +1 -0
  101. package/dist/infineon-design-system-stencil/p-26df4dfe.entry.js +2 -0
  102. package/dist/infineon-design-system-stencil/{p-28fb795b.entry.js.map → p-26df4dfe.entry.js.map} +1 -1
  103. package/dist/infineon-design-system-stencil/p-355cea09.entry.js +2 -0
  104. package/dist/infineon-design-system-stencil/p-355cea09.entry.js.map +1 -0
  105. package/dist/infineon-design-system-stencil/p-9f6c1499.entry.js +2 -0
  106. package/dist/infineon-design-system-stencil/p-9f6c1499.entry.js.map +1 -0
  107. package/dist/infineon-design-system-stencil/p-df6cadc1.entry.js +2 -0
  108. package/dist/infineon-design-system-stencil/p-df6cadc1.entry.js.map +1 -0
  109. package/dist/types/components/accordion/accordion.stories.d.ts +2 -2
  110. package/dist/types/components/accordion/accordionItem.d.ts +2 -2
  111. package/dist/types/components/breadcrumb/breadcrumb-item-label.d.ts +1 -1
  112. package/dist/types/components/breadcrumb/breadcrumb.stories.d.ts +19 -2
  113. package/dist/types/components/button/button.stories.d.ts +0 -3
  114. package/dist/types/components/card/card.stories.d.ts +10 -10
  115. package/dist/types/components/checkbox/checkbox.stories.d.ts +0 -3
  116. package/dist/types/components/chip/chip-item/chip-item.d.ts +1 -1
  117. package/dist/types/components/chip/chip.d.ts +1 -1
  118. package/dist/types/components/chip/chip.stories.d.ts +11 -4
  119. package/dist/types/components/chip/interfaces.d.ts +1 -1
  120. package/dist/types/components/date-picker/date-picker.stories.d.ts +21 -0
  121. package/dist/types/components/dropdown/dropdown.stories.d.ts +3 -30
  122. package/dist/types/components/link/link.stories.d.ts +0 -3
  123. package/dist/types/components/navigation/navbar/navbar.stories.d.ts +1 -22
  124. package/dist/types/components/segmented-control/segmented-control.stories.d.ts +0 -3
  125. package/dist/types/components/switch/switch.stories.d.ts +0 -3
  126. package/dist/types/components.d.ts +8 -8
  127. package/package.json +1 -1
  128. package/dist/components/p-184f1004.js.map +0 -1
  129. package/dist/components/p-23cdd5a7.js.map +0 -1
  130. package/dist/infineon-design-system-stencil/p-00d6e46e.entry.js.map +0 -1
  131. package/dist/infineon-design-system-stencil/p-28fb795b.entry.js +0 -2
  132. package/dist/infineon-design-system-stencil/p-72d804fb.entry.js +0 -2
  133. package/dist/infineon-design-system-stencil/p-72d804fb.entry.js.map +0 -1
  134. package/dist/infineon-design-system-stencil/p-7bef9272.entry.js +0 -2
  135. package/dist/infineon-design-system-stencil/p-7bef9272.entry.js.map +0 -1
  136. package/dist/infineon-design-system-stencil/p-dac5d6d5.entry.js +0 -2
  137. package/dist/infineon-design-system-stencil/p-dac5d6d5.entry.js.map +0 -1
@@ -1,2 +0,0 @@
1
- import{r as e,c as a,h as n,g as i}from"./p-6b122987.js";const r=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.breadcrumb-item-label-container{display:flex;align-items:center;gap:8px;text-decoration:none;color:#1D1D1D}.breadcrumb-item-label-container.margin{margin-left:16px}.breadcrumb-item-label-container ifx-icon:empty{display:none}.breadcrumb-item-label-container .label-icon-wrapper{display:inline-flex}.breadcrumb-item-label-container .menu-icon-wrapper{display:flex;justify-content:center;align-items:center;width:16px;height:16px}.breadcrumb-item-label-container .menu-icon-wrapper.hide{display:none}.breadcrumb-item-label-container .menu-icon-wrapper ifx-icon{transition:0.3s}.breadcrumb-item-label-container .menu-icon-wrapper.show ifx-icon{transition:0.3s;transform:rotate(180deg)}';const t=r;const c=class{constructor(n){e(this,n);this.breadcrumbMenuIconWrapper=a(this,"breadcrumbMenuIconWrapper",7);this.icon=undefined;this.url=undefined;this.target="_self"}componentDidLoad(){const e=this.el.shadowRoot.querySelector(".breadcrumb-item-label-container");const a=e.querySelector(".menu-icon-wrapper");this.breadcrumbMenuIconWrapper.emit(a)}render(){return n("a",{key:"16ddbc6dfce781d06c5e852423d1646426c6fb04",href:this.url,target:this.target,class:"breadcrumb-item-label-container",role:"link"},n("ifx-icon",{key:"6d62e4f854b7ea735c46a3849a92c09a8d222e54",icon:this.icon,"aria-hidden":"true"}),n("span",{key:"452dc64f08a93f4872f0f033b0b7016073818aab",class:"label-wrapper"},n("slot",{key:"0a522ff8d13c3133367e62b50480af2dc970961d"})),n("span",{key:"7f5d3a5305ad187e312ae20a59610c9cfe4b13cf",class:"menu-icon-wrapper","aria-hiden":"true"},n("ifx-icon",{key:"07dc7f9912e3d87f286273e5758490f39df31d0d",icon:"chevron-down-12"})))}get el(){return i(this)}};c.style=t;export{c as ifx_breadcrumb_item_label};
2
- //# sourceMappingURL=p-7bef9272.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["breadcrumbItemLabelCss","IfxBreadcrumbItemLabelStyle0","BreadcrumbItemLabel","componentDidLoad","container","this","el","shadowRoot","querySelector","menuWrapper","breadcrumbMenuIconWrapper","emit","render","h","key","href","url","target","class","role","icon"],"sources":["src/components/breadcrumb/breadcrumb-item-label.scss?tag=ifx-breadcrumb-item-label&encapsulation=shadow","src/components/breadcrumb/breadcrumb-item-label.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.breadcrumb-item-label-container {\n display: flex;\n align-items: center;\n gap: tokens.$ifxSpace100;\n text-decoration: none;\n color: tokens.$ifxColorBaseBlack;\n\n &.margin {\n margin-left: 16px;\n }\n\n & ifx-icon:empty {\n display: none;\n }\n\n & .label-icon-wrapper {\n display: inline-flex;\n }\n\n & .menu-icon-wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n width: tokens.$ifxSize200;\n height: tokens.$ifxSize200;\n\n &.hide {\n display: none;\n }\n\n & ifx-icon {\n transition: .3s;\n }\n\n &.show {\n & ifx-icon {\n transition: .3s;\n transform: rotate(180deg);\n }\n }\n }\n}","import { Component, h, Prop, Element, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'ifx-breadcrumb-item-label',\n styleUrl: 'breadcrumb-item-label.scss',\n shadow: true,\n})\nexport class BreadcrumbItemLabel {\n @Prop() icon: string;\n @Prop() url: string;\n @Prop() target: string = \"_self\"\n @Element() el;\n @Event() breadcrumbMenuIconWrapper: EventEmitter<CustomEvent>;\n\n componentDidLoad() { \n const container = this.el.shadowRoot.querySelector('.breadcrumb-item-label-container')\n const menuWrapper = container.querySelector('.menu-icon-wrapper')\n this.breadcrumbMenuIconWrapper.emit(menuWrapper)\n }\n\n render() {\n return (\n <a href={this.url} target={this.target} class=\"breadcrumb-item-label-container\" role='link'>\n <ifx-icon icon={this.icon} aria-hidden=\"true\"></ifx-icon>\n <span class=\"label-wrapper\">\n <slot />\n </span>\n <span class=\"menu-icon-wrapper\" aria-hiden=\"true\">\n <ifx-icon icon=\"chevron-down-12\"></ifx-icon>\n </span>\n </a>\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAyB,qwBAC/B,MAAAC,EAAeD,E,MCMFE,EAAmB,M,iJAGL,O,CAIzB,gBAAAC,GACE,MAAMC,EAAYC,KAAKC,GAAGC,WAAWC,cAAc,oCACnD,MAAMC,EAAcL,EAAUI,cAAc,sBAC5CH,KAAKK,0BAA0BC,KAAKF,E,CAGtC,MAAAG,GACE,OACEC,EAAA,KAAAC,IAAA,2CAAGC,KAAMV,KAAKW,IAAKC,OAAQZ,KAAKY,OAAQC,MAAM,kCAAkCC,KAAK,QACnFN,EAAA,YAAAC,IAAA,2CAAUM,KAAMf,KAAKe,KAAI,cAAc,SACvCP,EAAA,QAAAC,IAAA,2CAAMI,MAAM,iBACVL,EAAA,QAAAC,IAAA,8CAEHD,EAAA,QAAAC,IAAA,2CAAMI,MAAM,oBAAmB,aAAY,QAC1CL,EAAA,YAAAC,IAAA,2CAAUM,KAAK,qB","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{r as o,h as i,g as e,c as t}from"./p-6b122987.js";const n=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:block}.accordion-wrapper{display:flex;flex-direction:column;gap:8px;font-family:var(--ifx-font-family)}';const a=n;const c=class{constructor(i){o(this,i);this.autoCollapse=false}async onItemOpen(o){if(this.autoCollapse){const i=Array.from(this.el.querySelectorAll("ifx-accordion-item"));for(const e of i){const i=e;if(i!==o.target&&await i.open){i.open=false}}}}render(){return i("div",{key:"a69a6bea9d5347c0e1808d4635d458ce16614000",class:"accordion-wrapper"},i("slot",{key:"389e9039f9272a88d95aca8b83efbb754736a5dd"}))}static get delegatesFocus(){return true}get el(){return e(this)}};c.style=a;const s=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.accordion-item{border-radius:3px;overflow:hidden;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}.accordion-caption{font-weight:600;font-size:1.125rem}.accordion-content{gap:8px;max-height:0;overflow:hidden;transition:max-height 0.3s ease-in-out;line-height:24px;font-size:1rem;font-weight:400}.inner-content{background-color:#FFFFFF;padding:24px;word-wrap:break-word;overflow-wrap:anywhere;align-self:stretch;}.accordion-icon{font-weight:bold;display:inline-block;transition:transform 0.3s}.accordion-icon:hover{color:#08665C}.accordion-item.open .accordion-icon{transform:rotate(-180deg)}';const r=s;const d=class{constructor(i){o(this,i);this.ifxItemOpen=t(this,"ifxItemOpen",7);this.ifxItemClose=t(this,"ifxItemClose",7);this.caption=undefined;this.open=false;this.AriaLevel=3;this.internalOpen=false}componentWillLoad(){this.internalOpen=this.open}componentDidLoad(){this.openAccordionItem()}componentDidUpdate(){this.openAccordionItem()}openChanged(o){this.internalOpen=o}toggleOpen(){this.internalOpen=!this.internalOpen;this.open=this.internalOpen;if(this.internalOpen){this.ifxItemOpen.emit({isOpen:this.internalOpen})}else{this.ifxItemClose.emit({isClosed:!this.internalOpen})}}openAccordionItem(){if(this.internalOpen){this.contentEl.style.maxHeight=`${this.contentEl.scrollHeight}px`}else{this.contentEl.style.maxHeight="0"}}handleSlotChange(o){const i=o.target;const e=i.assignedNodes();if(e.length>0){e.forEach((o=>{const i=new MutationObserver(((o,i)=>{for(let i of o){if(i.type==="childList"){if(this.internalOpen){this.openAccordionItem()}}}}));i.observe(o,{attributes:true,childList:true,subtree:true})}))}if(this.internalOpen){this.openAccordionItem()}}handleKeydown(o){switch(o.key){case"Enter":case" ":o.preventDefault();this.toggleOpen();break}}render(){return i("div",{key:"81ca5bfa7f1766eb5b2657b4e2df0019cde776aa",class:`accordion-item ${this.internalOpen?"open":""}`},i("div",{key:"0b4daafa22e601cbf1ad1efbe79665c19b751fde",role:"button","aria-expanded":this.internalOpen,"aria-controls":"accordion-content",class:"accordion-title",onClick:()=>this.toggleOpen(),tabindex:"0"},i("span",{key:"e48ea5054c730b317df221a3f191d13186af1932","aria-hidden":"true",role:"heading","aria-level":String(this.AriaLevel),class:"accordion-icon"},i("ifx-icon",{key:"e9581b95bb5a60319c1537c3de6525030d56bf2c",icon:"chevron-down-12"})),i("span",{key:"28862a5c2e3c801b6be02d38c20bd91dce003cbf",id:"accordion-caption",class:"accordion-caption"},this.caption)),i("div",{key:"bfe16bfca9899e00e3356bf723caeec83e256486",id:"accordion-content",class:"accordion-content",ref:o=>this.contentEl=o,role:"region","aria-labelledby":"accordion-caption"},i("div",{key:"1da3e12ea0120b6450f3f88c3a81e40b9c0c2cd5",class:"inner-content"},i("slot",{key:"229dec050d2cf0fdd1f78b03dc37e831869c624d",onSlotchange:o=>this.handleSlotChange(o)}))))}static get watchers(){return{open:["openChanged"]}}};d.style=r;export{c as ifx_accordion,d as ifx_accordion_item};
2
- //# sourceMappingURL=p-dac5d6d5.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["accordionCss","IfxAccordionStyle0","Accordion","onItemOpen","event","this","autoCollapse","items","Array","from","el","querySelectorAll","item","itemElement","target","open","render","h","key","class","accordionItemCss","IfxAccordionItemStyle0","IfxAccordionItem","componentWillLoad","internalOpen","componentDidLoad","openAccordionItem","componentDidUpdate","openChanged","newValue","toggleOpen","ifxItemOpen","emit","isOpen","ifxItemClose","isClosed","contentEl","style","maxHeight","scrollHeight","handleSlotChange","e","slotElement","nodes","assignedNodes","length","forEach","node","observer","MutationObserver","mutationsList","_","mutation","type","observe","attributes","childList","subtree","handleKeydown","ev","preventDefault","role","onClick","tabindex","String","AriaLevel","icon","id","caption","ref","onSlotchange"],"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);\n\n}","//ifxAccordion.tsx\nimport { Component, h, Listen, Element, Prop } from '@stencil/core';\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\n @Listen('ifxItemOpen')\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 overflow: hidden;\n transition: all 0.3s;\n font-family: var(--ifx-font-family);\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;\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 max-height: 0;\n overflow: hidden;\n transition: max-height 0.3s ease-in-out;\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.$ifxSpace300;\n // white-space: pre-wrap;\n /* wraps text at spaces and within words */\n word-wrap: break-word;\n /* breaks text within a word if necessary */\n overflow-wrap: anywhere;\n align-self: stretch;\n\n /* breaks text at arbitrary points when needed */\n}\n\n.accordion-icon {\n font-weight: bold;\n display: inline-block;\n transition: transform 0.3s;\n\n &:hover {\n color: tokens.$ifxColorOcean600;\n\n }\n}\n\n\n\n.accordion-item.open .accordion-icon {\n transform: rotate(-180deg);\n}","//ifxAccordionItem\nimport { Component, Prop, h, State, Event, EventEmitter, Watch, Listen } from '@stencil/core';\n\n@Component({\n tag: 'ifx-accordion-item',\n styleUrl: 'accordionItem.scss',\n shadow: true,\n})\nexport class IfxAccordionItem {\n @Prop() caption: string;\n @Prop({\n mutable: true,\n }) open: boolean = false;\n @Prop() AriaLevel = 3;\n @State() internalOpen: boolean = false;\n @Event() ifxItemOpen: EventEmitter;\n @Event() ifxItemClose: EventEmitter;\n private contentEl!: HTMLElement;\n\n\n componentWillLoad() {\n this.internalOpen = this.open;\n }\n\n componentDidLoad() {\n this.openAccordionItem()\n }\n\n componentDidUpdate() {\n this.openAccordionItem()\n }\n\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.ifxItemOpen.emit({ isOpen: this.internalOpen });\n } else {\n this.ifxItemClose.emit({ isClosed: !this.internalOpen });\n }\n }\n\n openAccordionItem() {\n if (this.internalOpen) {\n this.contentEl.style.maxHeight = `${this.contentEl.scrollHeight}px`;\n } else {\n this.contentEl.style.maxHeight = '0';\n }\n }\n\n handleSlotChange(e) {\n const slotElement = e.target;\n const nodes = slotElement.assignedNodes();\n \n if(nodes.length > 0) {\n nodes.forEach(node => {\n const observer = new MutationObserver((mutationsList, _) => {\n for(let mutation of mutationsList) {\n if (mutation.type === 'childList') {\n if (this.internalOpen) {\n this.openAccordionItem();\n }\n }\n }\n });\n observer.observe(node, { attributes: true, childList: true, subtree: true });\n });\n }\n\n if (this.internalOpen) {\n this.openAccordionItem();\n }\n }\n\n \n\n @Listen('keydown')\n handleKeydown(ev: KeyboardEvent) {\n switch (ev.key) {\n case 'Enter': // fallthrough\n case ' ': // space\n ev.preventDefault();\n this.toggleOpen();\n break;\n }\n }\n\n\n render() {\n return (\n <div class={`accordion-item ${this.internalOpen ? 'open' : ''}`}>\n <div role=\"button\" aria-expanded={this.internalOpen} aria-controls=\"accordion-content\" class=\"accordion-title\" onClick={() => this.toggleOpen()} tabindex='0'>\n <span aria-hidden=\"true\" role=\"heading\" aria-level={String(this.AriaLevel) as string} class=\"accordion-icon\">\n <ifx-icon icon=\"chevron-down-12\"/>\n </span>\n <span id=\"accordion-caption\" class=\"accordion-caption\">{this.caption}</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 onSlotchange={(e) => this.handleSlotChange(e)} />\n </div>\n </div>\n </div>\n );\n }\n}"],"mappings":"yDAAA,MAAMA,EAAe,+MACrB,MAAAC,EAAeD,E,MCOFE,EAAS,M,2CAEY,K,CAIhC,gBAAMC,CAAWC,GACf,GAAIC,KAAKC,aAAc,CACrB,MAAMC,EAAQC,MAAMC,KAAKJ,KAAKK,GAAGC,iBAAiB,uBAClD,IAAK,MAAMC,KAAQL,EAAO,CACxB,MAAMM,EAAcD,EACpB,GAAIC,IAAgBT,EAAMU,cAAiBD,EAAYE,KAAO,CAC5DF,EAAYE,KAAO,K,IAM3B,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,qBACTF,EAAA,QAAAC,IAAA,6C,6EC7BR,MAAME,EAAmB,8nCACzB,MAAAC,EAAeD,E,MCOFE,EAAgB,M,8IAIR,M,eACC,E,kBACa,K,CAMjC,iBAAAC,GACElB,KAAKmB,aAAenB,KAAKU,I,CAG3B,gBAAAU,GACEpB,KAAKqB,mB,CAGP,kBAAAC,GACEtB,KAAKqB,mB,CAMP,WAAAE,CAAYC,GACVxB,KAAKmB,aAAeK,C,CAGtB,UAAAC,GACEzB,KAAKmB,cAAgBnB,KAAKmB,aAC1BnB,KAAKU,KAAOV,KAAKmB,aAEjB,GAAInB,KAAKmB,aAAc,CACrBnB,KAAK0B,YAAYC,KAAK,CAAEC,OAAQ5B,KAAKmB,c,KAChC,CACLnB,KAAK6B,aAAaF,KAAK,CAAEG,UAAW9B,KAAKmB,c,EAI7C,iBAAAE,GACE,GAAIrB,KAAKmB,aAAc,CACrBnB,KAAK+B,UAAUC,MAAMC,UAAY,GAAGjC,KAAK+B,UAAUG,gB,KAC9C,CACLlC,KAAK+B,UAAUC,MAAMC,UAAY,G,EAIrC,gBAAAE,CAAiBC,GACf,MAAMC,EAAcD,EAAE3B,OACtB,MAAM6B,EAAQD,EAAYE,gBAE1B,GAAGD,EAAME,OAAS,EAAG,CACnBF,EAAMG,SAAQC,IACZ,MAAMC,EAAW,IAAIC,kBAAiB,CAACC,EAAeC,KACpD,IAAI,IAAIC,KAAYF,EAAe,CACjC,GAAIE,EAASC,OAAS,YAAa,CACjC,GAAIhD,KAAKmB,aAAc,CACrBnB,KAAKqB,mB,OAKbsB,EAASM,QAAQP,EAAM,CAAEQ,WAAY,KAAMC,UAAW,KAAMC,QAAS,MAAO,G,CAIhF,GAAIpD,KAAKmB,aAAc,CACrBnB,KAAKqB,mB,EAOT,aAAAgC,CAAcC,GACZ,OAAQA,EAAGzC,KACT,IAAK,QACL,IAAK,IACHyC,EAAGC,iBACHvD,KAAKyB,aACL,M,CAKN,MAAAd,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,kBAAkBd,KAAKmB,aAAe,OAAS,MACzDP,EAAA,OAAAC,IAAA,2CAAK2C,KAAK,SAAQ,gBAAgBxD,KAAKmB,aAAY,gBAAgB,oBAAoBL,MAAM,kBAAkB2C,QAAS,IAAMzD,KAAKyB,aAAciC,SAAS,KACxJ9C,EAAA,QAAAC,IAAA,yDAAkB,OAAO2C,KAAK,UAAS,aAAaG,OAAO3D,KAAK4D,WAAsB9C,MAAM,kBAC1FF,EAAA,YAAAC,IAAA,2CAAUgD,KAAK,qBAEjBjD,EAAA,QAAAC,IAAA,2CAAMiD,GAAG,oBAAoBhD,MAAM,qBAAqBd,KAAK+D,UAE/DnD,EAAA,OAAAC,IAAA,2CAAKiD,GAAG,oBAAoBhD,MAAM,oBAAoBkD,IAAM3D,GAAQL,KAAK+B,UAAY1B,EAAoBmD,KAAK,SAAQ,kBAAiB,qBACrI5C,EAAA,OAAAC,IAAA,2CAAKC,MAAM,iBACTF,EAAA,QAAAC,IAAA,2CAAMoD,aAAe7B,GAAMpC,KAAKmC,iBAAiBC,O","ignoreList":[]}