@infineon/infineon-design-system-stencil 35.3.0--canary.1921.fedfabbd84b997ca6a665946264f8e5a0caa1ac7.0 → 35.3.0

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

@@ -0,0 +1,2 @@
+import{r as t,c as s,h as n,a as e}from"./p-b7a462e5.js";import{g as o}from"./p-4d96fed0.js";const i="ifx-icon{display:inline-flex;justify-content:center}ifx-icon:empty{display:none}";const c=i;const r=class{constructor(n){t(this,n);this.consoleError=s(this,"consoleError",7);this.icon=""}updateIcon(t){this.internalIcon=t;this.setIcon()}convertStringToHtml(t){const s=document.createElement("div");s.innerHTML=t;return s.firstChild}convertHtmlToObject(t){let s=Array.from(t.attributes,(({name:t,value:s})=>({name:t,value:s}))).reduce(((t,s)=>{t[s.name]=s.value;return t}),{});return s}convertPathsToVnode(t){let s=[];const e=this.convertHtmlToObject(t);const o=n("path",e);s.push(o);if(t.firstChild){const e=t.querySelectorAll("path");const o=t.querySelectorAll("path").length;for(let t=0;t<o;t++){let o=this.convertHtmlToObject(e[t]);let i=n("path",o);s.push(i)}}return s}getSVG(t){const s=this.convertStringToHtml(this.ifxIcon);const e=s.getAttribute("width");const o=s.getAttribute("height");const i=s.getAttribute("fill");const c=s.getAttribute("viewBox");return n("svg",{class:"inline-svg",width:e,height:o,xmlns:"http://www.w3.org/2000/svg",fill:i,viewBox:c},...t)}constructIcon(){if(this.ifxIcon){const t=this.convertStringToHtml(this.ifxIcon);const s=this.convertPathsToVnode(t);const n=this.getSVG(s);return n}else if(this.icon!==""){console.error("Icon not found!");this.consoleError.emit(true);return}else{return}}setIcon(){const t=t=>t.replace(/[-_]+(.)/g,((t,s)=>s.toUpperCase())).replace(/^(.)/,(t=>t.toLowerCase()));const s=t(this.internalIcon);this.ifxIcon=o(s)}componentWillLoad(){this.internalIcon=this.icon;this.setIcon()}render(){return n(e,{key:"28a16b1fa9ecc7e956d9012e18e0d7ca71d839b2"},this.constructIcon())}static get watchers(){return{icon:["updateIcon"]}}};r.style=c;export{r as ifx_icon};
+//# sourceMappingURL=p-74bee1c8.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["infineonIconStencilCss","IfxIconStyle0","InfineonIconStencil","constructor","hostRef","this","icon","updateIcon","newIcon","internalIcon","setIcon","convertStringToHtml","htmlString","div","document","createElement","innerHTML","firstChild","convertHtmlToObject","htmlElement","pathToObject","Array","from","attributes","name","value","reduce","acc","current","convertPathsToVnode","htmlPath","svgPaths","parentPath","parentPathToVnode","h","push","paths","querySelectorAll","pathLength","length","i","objToVnode","getSVG","svgPath","ifxIcon","width","getAttribute","height","fill","viewBox","class","xmlns","constructIcon","SVG","console","error","consoleError","emit","toCamelCase","str","replace","_","chr","toUpperCase","m","toLowerCase","iconName","getIcon","componentWillLoad","render","Host","key"],"sources":["src/components/icon/infineonIconStencil.scss?tag=ifx-icon","src/components/icon/infineonIconStencil.tsx"],"sourcesContent":["ifx-icon {\n  display: inline-flex;\n  justify-content: center;\n\n  &:empty {\n    display: none;\n  }\n}","import { Component, Prop, h, Host, Event, EventEmitter, Watch, State } from '@stencil/core';\nimport { getIcon } from '@infineon/infineon-icons'\n \n\n\n@Component({\n  tag: 'ifx-icon',\n  styleUrl: './infineonIconStencil.scss'\n})\n\nexport class InfineonIconStencil {\n  @Prop({ mutable: true }) icon: string = \"\"\n  @Prop({ mutable: true }) ifxIcon: any;\n  @State() internalIcon: string;\n  @Event() consoleError: EventEmitter<boolean>;\n\n   @Watch('icon')\n    updateIcon(newIcon: string) { \n      this.internalIcon = newIcon;\n      this.setIcon()\n    }\n\n  convertStringToHtml(htmlString) { \n    const div = document.createElement('div')\n    div.innerHTML = htmlString\n    return div.firstChild\n  }\n\n  convertHtmlToObject(htmlElement) { \n    let pathToObject = Array\n      .from(htmlElement.attributes, ({ name, value }) => ({ name, value }))\n      .reduce((acc, current) => {\n        acc[current.name] = current.value\n        return acc\n      }, {})\n\n    return pathToObject\n  }\n\n  convertPathsToVnode(htmlPath) { \n    let svgPaths = []\n    const parentPath = this.convertHtmlToObject(htmlPath);\n    const parentPathToVnode = h(\"path\", parentPath);\n    svgPaths.push(parentPathToVnode)\n    if(htmlPath.firstChild) { \n      const paths = htmlPath.querySelectorAll('path');\n      const pathLength = htmlPath.querySelectorAll('path').length;\n      for(let i = 0; i < pathLength; i++) { \n        let pathToObject = this.convertHtmlToObject(paths[i])\n        let objToVnode = h(\"path\", pathToObject)\n        svgPaths.push(objToVnode)\n      }      \n    }\n    return svgPaths\n  }\n\n  getSVG(svgPath) {\n    const htmlPath = this.convertStringToHtml(this.ifxIcon) as SVGElement;\n    const width = htmlPath.getAttribute('width');\n    const height = htmlPath.getAttribute('height');\n    const fill = htmlPath.getAttribute('fill');\n    const viewBox = htmlPath.getAttribute('viewBox');\n    \n    return <svg class=\"inline-svg\" width={width} height={height} xmlns=\"http://www.w3.org/2000/svg\" fill={fill} viewBox={viewBox}>{...svgPath}</svg>\n  }\n\n  constructIcon() {\n    if(this.ifxIcon) {\n      const htmlPath = this.convertStringToHtml(this.ifxIcon)\n      const svgPath = this.convertPathsToVnode(htmlPath)\n      const SVG = this.getSVG(svgPath)\n      return SVG;\n    } else if(this.icon !== \"\") {\n      console.error('Icon not found!')\n      this.consoleError.emit(true)\n      return;\n    }  else { \n      return;\n    }\n  }\n\nsetIcon() { \n  const toCamelCase = str =>\n    str\n      .replace(/[-_]+(.)/g, (_, chr) => chr.toUpperCase()) // handle - and _ to uppercase\n      .replace(/^(.)/, (m) => m.toLowerCase()); // ensure first letter is lowercase\n\n  const iconName = toCamelCase(this.internalIcon);\n  this.ifxIcon = getIcon(iconName);\n}\n\n  componentWillLoad() {\n    this.internalIcon = this.icon;\n    this.setIcon()\n  }\n\n  render() {\n    return (\n      <Host>\n      {this.constructIcon()}\n      </Host>\n    );\n  }\n}"],"mappings":"6FAAA,MAAMA,EAAyB,mFAC/B,MAAAC,EAAeD,E,MCSFE,EAAmB,MALhC,WAAAC,CAAAC,G,qDAM2BC,KAAAC,KAAe,E,CAMtC,UAAAC,CAAWC,GACTH,KAAKI,aAAeD,EACpBH,KAAKK,S,CAGT,mBAAAC,CAAoBC,GAClB,MAAMC,EAAMC,SAASC,cAAc,OACnCF,EAAIG,UAAYJ,EAChB,OAAOC,EAAII,U,CAGb,mBAAAC,CAAoBC,GAClB,IAAIC,EAAeC,MAChBC,KAAKH,EAAYI,YAAY,EAAGC,OAAMC,YAAO,CAAQD,OAAMC,YAC3DC,QAAO,CAACC,EAAKC,KACZD,EAAIC,EAAQJ,MAAQI,EAAQH,MAC5B,OAAOE,CAAG,GACT,IAEL,OAAOP,C,CAGT,mBAAAS,CAAoBC,GAClB,IAAIC,EAAW,GACf,MAAMC,EAAa3B,KAAKa,oBAAoBY,GAC5C,MAAMG,EAAoBC,EAAE,OAAQF,GACpCD,EAASI,KAAKF,GACd,GAAGH,EAASb,WAAY,CACtB,MAAMmB,EAAQN,EAASO,iBAAiB,QACxC,MAAMC,EAAaR,EAASO,iBAAiB,QAAQE,OACrD,IAAI,IAAIC,EAAI,EAAGA,EAAIF,EAAYE,IAAK,CAClC,IAAIpB,EAAef,KAAKa,oBAAoBkB,EAAMI,IAClD,IAAIC,EAAaP,EAAE,OAAQd,GAC3BW,EAASI,KAAKM,E,EAGlB,OAAOV,C,CAGT,MAAAW,CAAOC,GACL,MAAMb,EAAWzB,KAAKM,oBAAoBN,KAAKuC,SAC/C,MAAMC,EAAQf,EAASgB,aAAa,SACpC,MAAMC,EAASjB,EAASgB,aAAa,UACrC,MAAME,EAAOlB,EAASgB,aAAa,QACnC,MAAMG,EAAUnB,EAASgB,aAAa,WAEtC,OAAOZ,EAAA,OAAKgB,MAAM,aAAaL,MAAOA,EAAOE,OAAQA,EAAQI,MAAM,6BAA6BH,KAAMA,EAAMC,QAASA,MAAaN,E,CAGpI,aAAAS,GACE,GAAG/C,KAAKuC,QAAS,CACf,MAAMd,EAAWzB,KAAKM,oBAAoBN,KAAKuC,SAC/C,MAAMD,EAAUtC,KAAKwB,oBAAoBC,GACzC,MAAMuB,EAAMhD,KAAKqC,OAAOC,GACxB,OAAOU,C,MACF,GAAGhD,KAAKC,OAAS,GAAI,CAC1BgD,QAAQC,MAAM,mBACdlD,KAAKmD,aAAaC,KAAK,MACvB,M,KACM,CACN,M,EAIN,OAAA/C,GACE,MAAMgD,EAAcC,GAClBA,EACGC,QAAQ,aAAa,CAACC,EAAGC,IAAQA,EAAIC,gBACrCH,QAAQ,QAASI,GAAMA,EAAEC,gBAE9B,MAAMC,EAAWR,EAAYrD,KAAKI,cAClCJ,KAAKuC,QAAUuB,EAAQD,E,CAGvB,iBAAAE,GACE/D,KAAKI,aAAeJ,KAAKC,KACzBD,KAAKK,S,CAGP,MAAA2D,GACE,OACEnC,EAACoC,EAAI,CAAAC,IAAA,4CACJlE,KAAK+C,gB","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as o,h as e,g as i,c as t}from"./p-b7a462e5.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 n=a;const c=class{constructor(e){o(this,e);this.autoCollapse=false}async onItemOpen(o){if(this.autoCollapse){const e=Array.from(this.el.querySelectorAll("ifx-accordion-item"));for(const i of e){const e=i;if(e!==o.target&&await e.open){e.open=false}}}}render(){return e("div",{key:"663e6aac2f3002d3898856b854dbfd96d9519a68",class:"accordion-wrapper"},e("slot",{key:"0f54044bc1e0d2860ccd3096ee2711eb0a1cb927"}))}static get delegatesFocus(){return true}get el(){return i(this)}};c.style=n;const s=':root{--ifx-font-family:"Source Sans 3", "Arial, 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:flex;transition:transform 0.3s}.accordion-icon:hover{color:#08665C}.accordion-item.open .accordion-icon{transform:rotate(-180deg)}';const r=s;const d=class{constructor(e){o(this,e);this.ifxOpen=t(this,"ifxOpen",7);this.ifxClose=t(this,"ifxClose",7);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.ifxOpen.emit({isOpen:this.internalOpen})}else{this.ifxClose.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 e=o.target;const i=e.assignedNodes();if(i.length>0){i.forEach((o=>{const e=new MutationObserver(((o,e)=>{for(let e of o){if(e.type==="childList"){if(this.internalOpen){this.openAccordionItem()}}}}));e.observe(o,{attributes:true,childList:true,subtree:true})}))}if(this.internalOpen){this.openAccordionItem()}}handleKeydown(o){const e=o.composedPath();if(!e.includes(this.titleEl)){return}switch(o.key){case"Enter":case" ":o.preventDefault();this.toggleOpen();break}}render(){return e("div",{key:"7d6ed35b5c84e3dbfe0cc42f74408ab4655a61d2",class:`accordion-item ${this.internalOpen?"open":""}`},e("div",{key:"19350af96518b086d24cfb653ba8c41ce9a8d4e8",role:"button","aria-expanded":this.internalOpen,"aria-controls":"accordion-content",class:"accordion-title",onClick:()=>this.toggleOpen(),tabindex:"0",ref:o=>this.titleEl=o},e("span",{key:"56d40596ed604a5c24274dbde190802dd000e801","aria-hidden":"true",role:"heading","aria-level":String(this.AriaLevel),class:"accordion-icon"},e("ifx-icon",{key:"c93ace2e23cc1b9d5e50f8ea3e6a4e3b6c65e811",icon:"chevron-down-16"})),e("span",{key:"9ac2410b6c4e9f9918ec7ca7370470c744a2cf6b",id:"accordion-caption",class:"accordion-caption"},this.caption)),e("div",{key:"a8a9058e232dcaae9aaa0ebf43a4f3fba958136a",id:"accordion-content",class:"accordion-content",ref:o=>this.contentEl=o,role:"region","aria-labelledby":"accordion-caption"},e("div",{key:"81c6d61ccae983dae7ffeff557fa7e51fd10ab77",class:"inner-content"},e("slot",{key:"54ddfcf9375576b2118822057f17ddd765e2ca47",onSlotchange:o=>this.handleSlotChange(o)}))))}get el(){return i(this)}static get watchers(){return{open:["openChanged"]}}};d.style=r;export{c as ifx_accordion,d as ifx_accordion_item};
+//# sourceMappingURL=p-a356a82d.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["accordionCss","IfxAccordionStyle0","Accordion","constructor","hostRef","this","autoCollapse","onItemOpen","event","items","Array","from","el","querySelectorAll","item","itemElement","target","open","render","h","key","class","accordionItemCss","IfxAccordionItemStyle0","IfxAccordionItem","AriaLevel","internalOpen","componentWillLoad","componentDidLoad","openAccordionItem","componentDidUpdate","openChanged","newValue","toggleOpen","ifxOpen","emit","isOpen","ifxClose","isClosed","contentEl","style","maxHeight","scrollHeight","handleSlotChange","e","slotElement","nodes","assignedNodes","length","forEach","node","observer","MutationObserver","mutationsList","_","mutation","type","observe","attributes","childList","subtree","handleKeydown","ev","path","composedPath","includes","titleEl","preventDefault","role","onClick","tabindex","ref","String","icon","id","caption","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) // tokens.$ifxFontFamilyBody;\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('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  overflow: hidden;\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;\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: flex;\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, Element } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-accordion-item',\n  styleUrl: 'accordionItem.scss',\n  shadow: true,\n})\nexport class IfxAccordionItem {\n  @Element() el;\n  @Prop() caption: string;\n  @Prop({\n    mutable: true,\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\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.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.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    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\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' ref={(el) => (this.titleEl = el as HTMLElement)}>\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\">{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":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-54a2b0d7.entry.js → p-aaf08082.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as i,g as a}from"./p-b7a462e5.js";import{i as t}from"./p-1e2705c8.js";const n='.container{display:flex;flex-direction:column;gap:10px}.alert__wrapper{margin-bottom:40px}.snippet__wrapper{display:flex;flex-direction:column;gap:5px;position:sticky;top:0;left:0;z-index:99;background-color:white}.html-wrapper{background:rgb(38, 38, 38);padding:20px;color:white;font-family:monospace}.html-wrapper button{position:absolute;right:0px;bottom:0px;background:rgba(0, 0, 0, 0.85);color:#C9CDCF;border:0 none;padding:4px 10px;font-size:0.75rem;font-family:"Nunito Sans";font-weight:700;border-top:1px solid rgba(255, 255, 255, 0.1);border-left:1px solid rgba(255, 255, 255, 0.1);margin-left:-1px;border-radius:4px 0 0 0;cursor:pointer}.html-wrapper .component-name{color:#A8FF60}.html-wrapper .attribute-name{color:rgb(150, 203, 254)}.html-wrapper .attribute-value{color:rgb(180, 116, 221)}.preview__container{box-sizing:border-box;display:flex;align-items:center;padding:2px;flex-wrap:wrap;gap:4px}.preview__container .no-results{width:100%;text-align:center}.preview__container .preview__container-item{display:flex;justify-content:center;align-items:center;border:1px solid #f1f1f1;padding:2px;width:50px;height:50px;position:relative}.preview__container .preview__container-item:active{border-color:#378375}.preview__container .preview__container-item:hover{cursor:pointer}.preview__container .preview__container-item.copied::after{z-index:50;content:"copied!";position:absolute;top:0;left:50px;background-color:#000;color:white;padding:3px;border-radius:4px}';const o=n;const c=class{constructor(i){e(this,i);this.iconsArray=[];this.isCopied=false;this.copiedIcon=null;this.htmlTag='<ifx-icon icon="calendar-16"></ifx-icon>';this.iconName=`""`;this.searchTerm=""}handleCopiedText(){this.isCopied=true;setTimeout((()=>{this.isCopied=false}),2e3)}copyIconText(e){this.htmlTag=`<ifx-icon icon="${e}"></ifx-icon>`;this.iconName=`"${e}"`;this.copiedIcon=e}copyHtmlString(){const e=`<ifx-icon icon=${this.iconName}></ifx-icon>`;navigator.clipboard.writeText(e);this.handleCopiedText()}get filteredIcons(){const e=this.searchTerm.toLowerCase().trim();if(!e)return this.iconsArray;return this.iconsArray.filter((i=>i.toLowerCase().includes(e)))}getIconIndex(e){return this.iconsArray.indexOf(e)}handleIconFilter(){const e=this.el.shadowRoot.querySelector("#search__field");e.addEventListener("ifxInput",(e=>{this.searchTerm=e.detail}))}componentWillLoad(){this.iconsArray=Object.keys(t)}componentDidLoad(){this.handleIconFilter()}render(){return i("div",{key:"7b9c4b5b3212cdae77e4522bd573939b1bc32e62",class:"container"},i("div",{key:"8e4047341dd331f402a2ce249b6bd68b7fe398d5",class:"alert__wrapper"},i("ifx-notification",{key:"42e17eefa571360711ea0aca45d57dae6a5b70a6",icon:"c-check-16",variant:"neutral","link-text":"Figma icon library","link-href":"https://www.figma.com/design/yWwaLoqsWLWygDxXfvdym9/Infineon-DDS-%7C-UI-icon-library?node-id=13284-1289&p=f&t=SD6EdmXaSufsjPCv-0","link-target":"_blank"},"You can also find the UI icons in Figma for use in mockups.")),i("div",{key:"ecd1f37f5edb25b913157626ba674f10c2a00026",class:"snippet__wrapper"},i("div",{key:"58f5fd04a7fef398ba47d71c23c74515c5461337",class:"search__wrapper"},i("ifx-search-field",{key:"76802675d5c01562a0f7d69f8d3bd3df15c2944b",id:"search__field",size:"m","show-delete-icon":"true",value:"",autocomplete:"on",placeholder:"Search icon"})),i("div",{key:"2160ef2e64b86140232aa6566db2f153d724b107",class:"html-wrapper"},i("span",{key:"810aa571906d82fbe93d631322bec4ed08b956d4",class:"html-tag"},"<"),i("span",{key:"2aeeb86927938a7b2a3d9f5fb2ef57f0aa925eaa",class:"component-name"},"ifx-icon"),i("span",{key:"de18997563df168af3e976b1ad81d205cd2a850a",class:"attribute-name"}," icon"),"=",i("span",{key:"a93dfbec210940b2d9b2c1dd349a727e5f7185ce",class:"attribute-value"},this.iconName),i("span",{key:"b2900ea9e7099ab4fcb890d6df05cab4d6109c55",class:"html-tag"},">"),i("span",{key:"fee18bd1c39103e29ec84bc115b1719c11a66849",class:"html-tag"},"</"),i("span",{key:"57c6db27a4156d0ad50c20d691138817db80ba18",class:"component-name"},"ifx-icon"),i("span",{key:"395b55e085cb49a133beaca0bf79338662c0905b",class:"html-tag"},">"),i("button",{key:"a6c81538ec62f435c06460e8822aa1784ec06138",onClick:()=>this.copyHtmlString()},this.isCopied?"Copied":"Copy"))),i("div",{key:"dcac1dacdfc1f4d0cdeeabbe908b2b71bc79334e",class:"preview__container"},this.filteredIcons.map((e=>i("div",{key:e,class:`preview__container-item ${this.isCopied&&this.copiedIcon===e?"copied":""}`,onClick:()=>this.copyIconText(e)},i("ifx-icon",{icon:e})))),this.filteredIcons.length===0&&i("div",{key:"128cee79fdfa10ea937e704b1a48ae83485c0c1f",class:"no-results"},'No icons found matching "',this.searchTerm,'"')))}get el(){return a(this)}};c.style=o;export{c as ifx_icons_preview};
-//# sourceMappingURL=p-54a2b0d7.entry.js.map
+import{r as e,h as i,g as a}from"./p-b7a462e5.js";import{i as t}from"./p-4d96fed0.js";const n='.container{display:flex;flex-direction:column;gap:10px}.alert__wrapper{margin-bottom:40px}.snippet__wrapper{display:flex;flex-direction:column;gap:5px;position:sticky;top:0;left:0;z-index:99;background-color:white}.html-wrapper{background:rgb(38, 38, 38);padding:20px;color:white;font-family:monospace}.html-wrapper button{position:absolute;right:0px;bottom:0px;background:rgba(0, 0, 0, 0.85);color:#C9CDCF;border:0 none;padding:4px 10px;font-size:0.75rem;font-family:"Nunito Sans";font-weight:700;border-top:1px solid rgba(255, 255, 255, 0.1);border-left:1px solid rgba(255, 255, 255, 0.1);margin-left:-1px;border-radius:4px 0 0 0;cursor:pointer}.html-wrapper .component-name{color:#A8FF60}.html-wrapper .attribute-name{color:rgb(150, 203, 254)}.html-wrapper .attribute-value{color:rgb(180, 116, 221)}.preview__container{box-sizing:border-box;display:flex;align-items:center;padding:2px;flex-wrap:wrap;gap:4px}.preview__container .no-results{width:100%;text-align:center}.preview__container .preview__container-item{display:flex;justify-content:center;align-items:center;border:1px solid #f1f1f1;padding:2px;width:50px;height:50px;position:relative}.preview__container .preview__container-item:active{border-color:#378375}.preview__container .preview__container-item:hover{cursor:pointer}.preview__container .preview__container-item.copied::after{z-index:50;content:"copied!";position:absolute;top:0;left:50px;background-color:#000;color:white;padding:3px;border-radius:4px}';const o=n;const c=class{constructor(i){e(this,i);this.iconsArray=[];this.isCopied=false;this.copiedIcon=null;this.htmlTag='<ifx-icon icon="calendar-16"></ifx-icon>';this.iconName=`""`;this.searchTerm=""}handleCopiedText(){this.isCopied=true;setTimeout((()=>{this.isCopied=false}),2e3)}copyIconText(e){this.htmlTag=`<ifx-icon icon="${e}"></ifx-icon>`;this.iconName=`"${e}"`;this.copiedIcon=e}copyHtmlString(){const e=`<ifx-icon icon=${this.iconName}></ifx-icon>`;navigator.clipboard.writeText(e);this.handleCopiedText()}get filteredIcons(){const e=this.searchTerm.toLowerCase().trim();if(!e)return this.iconsArray;return this.iconsArray.filter((i=>i.toLowerCase().includes(e)))}getIconIndex(e){return this.iconsArray.indexOf(e)}handleIconFilter(){const e=this.el.shadowRoot.querySelector("#search__field");e.addEventListener("ifxInput",(e=>{this.searchTerm=e.detail}))}componentWillLoad(){this.iconsArray=Object.keys(t)}componentDidLoad(){this.handleIconFilter()}render(){return i("div",{key:"7b9c4b5b3212cdae77e4522bd573939b1bc32e62",class:"container"},i("div",{key:"8e4047341dd331f402a2ce249b6bd68b7fe398d5",class:"alert__wrapper"},i("ifx-notification",{key:"42e17eefa571360711ea0aca45d57dae6a5b70a6",icon:"c-check-16",variant:"neutral","link-text":"Figma icon library","link-href":"https://www.figma.com/design/yWwaLoqsWLWygDxXfvdym9/Infineon-DDS-%7C-UI-icon-library?node-id=13284-1289&p=f&t=SD6EdmXaSufsjPCv-0","link-target":"_blank"},"You can also find the UI icons in Figma for use in mockups.")),i("div",{key:"ecd1f37f5edb25b913157626ba674f10c2a00026",class:"snippet__wrapper"},i("div",{key:"58f5fd04a7fef398ba47d71c23c74515c5461337",class:"search__wrapper"},i("ifx-search-field",{key:"76802675d5c01562a0f7d69f8d3bd3df15c2944b",id:"search__field",size:"m","show-delete-icon":"true",value:"",autocomplete:"on",placeholder:"Search icon"})),i("div",{key:"2160ef2e64b86140232aa6566db2f153d724b107",class:"html-wrapper"},i("span",{key:"810aa571906d82fbe93d631322bec4ed08b956d4",class:"html-tag"},"<"),i("span",{key:"2aeeb86927938a7b2a3d9f5fb2ef57f0aa925eaa",class:"component-name"},"ifx-icon"),i("span",{key:"de18997563df168af3e976b1ad81d205cd2a850a",class:"attribute-name"}," icon"),"=",i("span",{key:"a93dfbec210940b2d9b2c1dd349a727e5f7185ce",class:"attribute-value"},this.iconName),i("span",{key:"b2900ea9e7099ab4fcb890d6df05cab4d6109c55",class:"html-tag"},">"),i("span",{key:"fee18bd1c39103e29ec84bc115b1719c11a66849",class:"html-tag"},"</"),i("span",{key:"57c6db27a4156d0ad50c20d691138817db80ba18",class:"component-name"},"ifx-icon"),i("span",{key:"395b55e085cb49a133beaca0bf79338662c0905b",class:"html-tag"},">"),i("button",{key:"a6c81538ec62f435c06460e8822aa1784ec06138",onClick:()=>this.copyHtmlString()},this.isCopied?"Copied":"Copy"))),i("div",{key:"dcac1dacdfc1f4d0cdeeabbe908b2b71bc79334e",class:"preview__container"},this.filteredIcons.map((e=>i("div",{key:e,class:`preview__container-item ${this.isCopied&&this.copiedIcon===e?"copied":""}`,onClick:()=>this.copyIconText(e)},i("ifx-icon",{icon:e})))),this.filteredIcons.length===0&&i("div",{key:"128cee79fdfa10ea937e704b1a48ae83485c0c1f",class:"no-results"},'No icons found matching "',this.searchTerm,'"')))}get el(){return a(this)}};c.style=o;export{c as ifx_icons_preview};
+//# sourceMappingURL=p-aaf08082.entry.js.map