@infineon/infineon-design-system-stencil 37.13.1--canary.1992.854aaf1c0bff5fdb0752d9b89b6e9e1a8f43bab6.0 → 37.13.1--canary.2001.c3b06ba3cc438de9e271efa72087b305440874f3.0

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

@@ -1 +0,0 @@
-{"version":3,"names":["checkboxCss","Checkbox","constructor","hostRef","this","disabled","checked","error","size","indeterminate","handleCheckbox","inputElement","internalChecked","internalIndeterminate","value","undefined","internals","setFormValue","ifxChange","emit","isChecked","toggleCheckedState","newVal","valueChanged","newValue","oldValue","errorChanged","ifxError","indeterminateChanged","handleKeydown","event","keyCode","preventDefault","componentWillLoad","componentDidLoad","isNestedInIfxComponent","el","framework","detectFramework","trackComponent","componentDidRender","formResetCallback","getCheckedClassName","render","slot","innerHTML","hasSlot","h","key","class","type","hidden","ref","onChange","bind","id","tabindex","onClick","onKeyDown","role","toString","icon"],"sources":["src/components/checkbox/checkbox.scss?tag=ifx-checkbox&encapsulation=shadow","src/components/checkbox/checkbox.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n    display: inline-flex;\n    vertical-align: top;\n}\n\n.checkbox__container {\n    box-sizing: border-box;\n    display: inline-flex;\n    flex-direction: row;\n    align-items: top;\n    padding: 0px;\n    gap: tokens.$ifxSpace100;\n    font-family: tokens.$ifxFontFamilyBody;\n    vertical-align: bottom;\n\n    & .checkbox__wrapper {\n        box-sizing: border-box;\n        display: flex;\n        position: relative; //needs to be added for the indeterminate state of the checkbox\n        justify-content: center;\n        align-items: center;\n        width: tokens.$ifxSize250;\n        height: tokens.$ifxSize250;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 1px solid #575352;\n        border-radius: tokens.$ifxBorderRadius12;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n        align-self: flex-start;\n\n        &.checkbox-m {\n            height: tokens.$ifxSize300;\n            width: tokens.$ifxSize300;\n        }\n\n        &.error {\n            border-color: #CD002F;\n        }\n\n        &:focus-visible {\n            border: 1px solid #575352;\n            outline: 2px solid #0A8276;\n            outline-offset: 2px;\n        }\n\n        &:hover {\n            background-color: #EEEDED;\n            border: 1px solid #575352;\n            border-radius: tokens.$ifxBorderRadius12;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n        }\n\n        &.disabled {\n            background-color: #BFBBBB;\n            border-color: #BFBBBB;\n            border-radius: tokens.$ifxBorderRadius12;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n        }\n\n        &.checked:not(.indeterminate) {\n            background-color: #0A8276;\n            border-radius: tokens.$ifxBorderRadius12;\n            border-color: tokens.$ifxColorBaseTransparent;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n            color: tokens.$ifxColorBaseWhite;\n\n            &.error {\n                background-color: #CD002F;\n            }\n\n            &:focus-visible {\n                border: 1px solid transparent;\n                outline: 2px solid #0A8276;\n                outline-offset: 2px;\n            }\n\n            &:hover {\n                background-color: #08665C;\n                border-radius: tokens.$ifxBorderRadius12;\n                flex: none;\n                order: 0;\n                flex-grow: 0;\n            }\n\n            &.disabled {\n                background: #BFBBBB;\n                border-radius: tokens.$ifxBorderRadius12;\n                flex: none;\n                order: 0;\n                flex-grow: 0;\n            }\n        }\n\n        &.indeterminate {\n            &:before {\n                content: \"\";\n                display: block;\n                width: 70%; // Adjust as needed for the width of the minus sign\n                height: 2px; // Adjust for thickness of the minus sign\n                background-color: #08665C; // Color of the minus sign\n                position: absolute;\n                top: 50%;\n                left: 50%;\n                transform: translate(-50%, -50%);\n            }\n        }\n\n    }\n\n    & .label {\n        font-style: normal;\n        font-weight: 400;\n        font-size: tokens.$ifxFontSizeS;\n        line-height: tokens.$ifxLineHeightS;\n        color: tokens.$ifxColorBaseBlack;\n        overflow-wrap: break-word;\n        word-wrap: break-word;\n        word-break: break-all;\n        max-width: 100%;\n\n        &.label-m {\n            font-size: tokens.$ifxFontSizeM;\n            line-height: tokens.$ifxLineHeightM;\n        }\n\n        &.disabled {\n            color: #BFBBBB;\n        }\n    }\n\n    & .checkbox__wrapper,\n    & .label {\n        &:hover {\n            cursor: pointer;\n        }\n    }\n}","import { Component, h, Prop, Element, State, Event, EventEmitter, Watch, Method, AttachInternals } 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-checkbox',\n  styleUrl: 'checkbox.scss',\n  shadow: true,\n  formAssociated: true\n})\n\nexport class Checkbox {\n  private inputElement: HTMLInputElement;\n\n  @Element() el;\n  @Prop() disabled: boolean = false;\n  @Prop() checked: boolean = false;\n  @Prop() error: boolean = false;\n  @Prop() size: string = 'm';\n  @Prop() indeterminate: boolean = false;\n  @Prop() value: string;\n  @State() internalChecked: boolean;\n  @State() internalIndeterminate: boolean;\n\n  @AttachInternals() internals: ElementInternals;\n\n  @Event({ bubbles: true, composed: true }) ifxChange: EventEmitter;\n  @Event({ bubbles: true, composed: true }) ifxError: EventEmitter;\n\n  handleCheckbox() {\n    if (!this.disabled) {\n      if (!this.inputElement.indeterminate) {\n        this.internalChecked = !this.internalChecked;\n      } \n      if (this.internalChecked && !this.internalIndeterminate) {\n        if (this.value !== undefined) {\n          this.internals.setFormValue(this.value);\n        } else {\n          this.internals.setFormValue(\"on\")\n        }\n      } else {\n        this.internals.setFormValue(null)\n      }\n      this.ifxChange.emit(this.internalChecked);\n    }\n  }\n\n  @Method()\n  async isChecked(): Promise<boolean> {\n    return this.internalChecked;\n  }\n\n  @Method()\n  async toggleCheckedState(newVal: boolean) {\n    this.internalChecked = newVal;\n  }\n\n  @Watch('checked')\n  valueChanged(newValue: boolean, oldValue: boolean) {\n    if (newValue !== oldValue) {\n      this.internalChecked = newValue;\n      this.inputElement.checked = this.internalChecked; // update the checkbox's checked property\n    }\n  }\n\n  @Watch('error')\n  errorChanged(newValue: boolean, oldValue: boolean) {\n    if (newValue !== oldValue) {\n      this.ifxError.emit(newValue);\n    }\n  }\n\n  @Watch('indeterminate')\n  indeterminateChanged(newValue: boolean, oldValue: boolean) {\n    if (newValue !== oldValue) {\n      this.internalIndeterminate = newValue;\n      this.inputElement.indeterminate = this.internalIndeterminate; // update the checkbox's indeterminate property\n    }\n  }\n\n  handleKeydown(event) {\n    // Keycode 32 corresponds to the Space key, 13 corresponds to the Enter key\n    if (event.keyCode === 32 || event.keyCode === 13) {\n      this.handleCheckbox();\n      event.preventDefault();  // prevent the default action when space or enter is pressed\n    }\n  }\n\n  componentWillLoad() {\n    this.internalChecked = this.checked;\n    this.internalIndeterminate = this.indeterminate;\n  }\n\n  async componentDidLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-checkbox', await framework)\n    }\n  }\n\n  componentDidRender() {\n    this.inputElement.indeterminate = this.internalIndeterminate;\n  }\n\n  /**\n   * Callback for form association.\n   * Called whenever the form is reset.\n   */\n  formResetCallback() {\n    this.internals.setFormValue(null);\n  }\n\n  getCheckedClassName() {\n    if (this.error) {\n      if (this.internalChecked) {\n        return \"checked error\"\n      } else {\n        return \"error\"\n      }\n    } else if (this.internalChecked) {\n      return \"checked\";\n    } else return \"\"\n  }\n\n  render() {\n    const slot = this.el.innerHTML;\n    let hasSlot = false;\n    if (slot) {\n      hasSlot = true;\n    }\n    return (\n      <div class=\"checkbox__container\">\n        <input\n          type=\"checkbox\"\n          hidden\n          ref={(el) => (this.inputElement = el)}\n          checked={this.internalChecked}\n          onChange={this.handleCheckbox.bind(this)} // Listen for changes here\n          id='checkbox'\n          value={`${this.value}`}\n          disabled={this.disabled ? true : undefined}\n        />\n        <div\n          tabindex=\"0\"\n          onClick={this.handleCheckbox.bind(this)}\n          onKeyDown={this.handleKeydown.bind(this)}\n          role=\"checkbox\"\n          aria-checked={this.indeterminate ? 'mixed' : this.internalChecked.toString()}\n          aria-disabled={this.disabled}\n          aria-labelledby=\"label\"\n          class={`checkbox__wrapper \n          ${this.getCheckedClassName()}\n        ${this.size === \"m\" ? \"checkbox-m\" : \"\"}\n        ${this.indeterminate ? 'indeterminate' : \"\"}\n        ${this.disabled ? 'disabled' : \"\"}`}\n        >\n          {this.internalChecked && !this.internalIndeterminate && <ifx-icon icon=\"check-16\" aria-hidden=\"true\"></ifx-icon>}\n        </div>\n        {hasSlot &&\n          <div id=\"label\" class={`label ${this.size === \"m\" ? \"label-m\" : \"\"} ${this.disabled ? 'disabled' : \"\"} `} onClick={this.handleCheckbox.bind(this)}>\n            <slot />\n          </div>}\n      </div>\n    );\n  }\n}"],"mappings":"wIAAA,MAAMA,EAAc,g1E,MCYPC,EAAQ,MAPrB,WAAAC,CAAAC,G,kPAWUC,KAAQC,SAAY,MACpBD,KAAOE,QAAY,MACnBF,KAAKG,MAAY,MACjBH,KAAII,KAAW,IACfJ,KAAaK,cAAY,KAkJlC,CAxIC,cAAAC,GACE,IAAKN,KAAKC,SAAU,CAClB,IAAKD,KAAKO,aAAaF,cAAe,CACpCL,KAAKQ,iBAAmBR,KAAKQ,e,CAE/B,GAAIR,KAAKQ,kBAAoBR,KAAKS,sBAAuB,CACvD,GAAIT,KAAKU,QAAUC,UAAW,CAC5BX,KAAKY,UAAUC,aAAab,KAAKU,M,KAC5B,CACLV,KAAKY,UAAUC,aAAa,K,MAEzB,CACLb,KAAKY,UAAUC,aAAa,K,CAE9Bb,KAAKc,UAAUC,KAAKf,KAAKQ,gB,EAK7B,eAAMQ,GACJ,OAAOhB,KAAKQ,e,CAId,wBAAMS,CAAmBC,GACvBlB,KAAKQ,gBAAkBU,C,CAIzB,YAAAC,CAAaC,EAAmBC,GAC9B,GAAID,IAAaC,EAAU,CACzBrB,KAAKQ,gBAAkBY,EACvBpB,KAAKO,aAAaL,QAAUF,KAAKQ,e,EAKrC,YAAAc,CAAaF,EAAmBC,GAC9B,GAAID,IAAaC,EAAU,CACzBrB,KAAKuB,SAASR,KAAKK,E,EAKvB,oBAAAI,CAAqBJ,EAAmBC,GACtC,GAAID,IAAaC,EAAU,CACzBrB,KAAKS,sBAAwBW,EAC7BpB,KAAKO,aAAaF,cAAgBL,KAAKS,qB,EAI3C,aAAAgB,CAAcC,GAEZ,GAAIA,EAAMC,UAAY,IAAMD,EAAMC,UAAY,GAAI,CAChD3B,KAAKM,iBACLoB,EAAME,gB,EAIV,iBAAAC,GACE7B,KAAKQ,gBAAkBR,KAAKE,QAC5BF,KAAKS,sBAAwBT,KAAKK,a,CAGpC,sBAAMyB,GACJ,IAAIC,EAAuB/B,KAAKgC,IAAK,CACnC,MAAMC,EAAYC,IAClBC,EAAe,qBAAsBF,E,EAIzC,kBAAAG,GACEpC,KAAKO,aAAaF,cAAgBL,KAAKS,qB,CAOzC,iBAAA4B,GACErC,KAAKY,UAAUC,aAAa,K,CAG9B,mBAAAyB,GACE,GAAItC,KAAKG,MAAO,CACd,GAAIH,KAAKQ,gBAAiB,CACxB,MAAO,e,KACF,CACL,MAAO,O,OAEJ,GAAIR,KAAKQ,gBAAiB,CAC/B,MAAO,S,MACF,MAAO,E,CAGhB,MAAA+B,GACE,MAAMC,EAAOxC,KAAKgC,GAAGS,UACrB,IAAIC,EAAU,MACd,GAAIF,EAAM,CACRE,EAAU,I,CAEZ,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,uBACTF,EAAA,SAAAC,IAAA,2CACEE,KAAK,WACLC,OAAM,KACNC,IAAMhB,GAAQhC,KAAKO,aAAeyB,EAClC9B,QAASF,KAAKQ,gBACdyC,SAAUjD,KAAKM,eAAe4C,KAAKlD,MACnCmD,GAAG,WACHzC,MAAO,GAAGV,KAAKU,QACfT,SAAUD,KAAKC,SAAW,KAAOU,YAEnCgC,EACE,OAAAC,IAAA,2CAAAQ,SAAS,IACTC,QAASrD,KAAKM,eAAe4C,KAAKlD,MAClCsD,UAAWtD,KAAKyB,cAAcyB,KAAKlD,MACnCuD,KAAK,WAAU,eACDvD,KAAKK,cAAgB,QAAUL,KAAKQ,gBAAgBgD,WACnD,gBAAAxD,KAAKC,SACJ,0BAChB4C,MAAO,iCACL7C,KAAKsC,kCACPtC,KAAKI,OAAS,IAAM,aAAe,eACnCJ,KAAKK,cAAgB,gBAAkB,eACvCL,KAAKC,SAAW,WAAa,MAE5BD,KAAKQ,kBAAoBR,KAAKS,uBAAyBkC,EAAA,YAAAC,IAAA,2CAAUa,KAAK,WAAU,cAAa,UAE/Ff,GACCC,EAAA,OAAAC,IAAA,2CAAKO,GAAG,QAAQN,MAAO,SAAS7C,KAAKI,OAAS,IAAM,UAAY,MAAMJ,KAAKC,SAAW,WAAa,MAAOoD,QAASrD,KAAKM,eAAe4C,KAAKlD,OAC1I2C,EAAQ,QAAAC,IAAA,8C","ignoreList":[]}

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

@@ -1,2 +0,0 @@
-import{r as e,h as r}from"./p-DS8meZSd.js";const s=":host{display:inline-block;cursor:pointer}";const o=class{constructor(r){e(this,r);this.isOpen=false}render(){return r("slot",{key:"ef3ea59efc3e4cd4779f4e8dc50fae826c760015"})}};o.style=s;export{o as ifx_dropdown_trigger};
-//# sourceMappingURL=p-202d262d.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["radioButtonCss","RadioButton","constructor","hostRef","this","disabled","error","size","internalChecked","hasSlot","isChecked","componentWillLoad","fallbackInput","document","createElement","type","hidden","className","style","cssText","setAttribute","tabIndex","el","appendChild","HTMLElement","prototype","internals","attachInternals","e","console","warn","checked","querySelector","innerHTML","trim","componentDidLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","handleCheckedChange","newValue","updateFormValue","_a","setFormValue","value","name","errorChanged","oldValue","ifxError","emit","handleRadioButtonClick","event","stopPropagation","inputElement","click","ifxChange","changeEvent","CustomEvent","bubbles","composed","detail","dispatchEvent","handleKeyDown","ev","includes","key","preventDefault","PointerEvent","handleExternalChange","target","tagName","toLowerCase","getAttribute","render","h","role","String","class","onClick","tabindex","ref"],"sources":["src/components/radio-button/radio-button.scss?tag=ifx-radio-button&encapsulation=shadow","src/components/radio-button/radio-button.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n    display: inline-flex;\n    --_ifx-fallback-display: none !important;\n}\n\n._ifx-radiobutton-fallback {\n    display: var(--_ifx-fallback-display);\n    position: absolute !important;\n    width: 1px !important;\n    height: 1px !important;\n    padding: 0 !important;\n    margin: -1px !important;\n    overflow: hidden !important;\n    clip: rect(0,0,0,0) !important;\n    border: 0 !important;\n  }\n\n.radioButton__container {\n    box-sizing: border-box;\n    display: inline-flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 0px;\n    gap: tokens.$ifxSpace100;\n    cursor: pointer;\n    font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n    outline: none;\n\n    &:focus .radioButton__wrapper {\n        &::before {\n            content: '';\n            position: absolute;\n            width: calc(100% + 4px);\n            height: calc(100% + 4px);\n            top: 50%;\n            left: 50%;\n            transform: translate(-50%, -50%);\n            border: 2px solid tokens.$ifxColorOcean500;\n            border-radius: 50%;\n        }\n    }\n\n    &.m .radioButton__wrapper {\n        width: tokens.$ifxSize300;\n        height: tokens.$ifxSize300;\n    }\n\n    .radioButton__wrapper {\n        width: tokens.$ifxSize250;\n        height: tokens.$ifxSize250;\n        position: relative;\n        display: block;\n        border-radius: 50%;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 1px solid #575352;\n\n        .radioButton__wrapper-mark {\n            position: absolute;\n            top: 50%;\n            left: 50%;\n            transform: translate(-50%, -50%);\n            background-color: #0A8276;\n            border-radius: 50%;\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            border-color: tokens.$ifxColorBaseTransparent;\n        }\n\n        &:hover {\n            background-color: tokens.$ifxColorEngineering200;\n        }\n\n        &.disabled {\n            background-color: #BFBBBB;\n            border-color: #BFBBBB;\n\n            &.error {\n\n                &:hover,\n                &:focus-visible {\n                    border-color: #CD002F;\n                }\n            }\n        }\n\n        &.checked {\n            border-color: #0A8276;\n\n            &::after {\n                content: \"\";\n                position: absolute;\n                top: 50%;\n                left: 50%;\n                transform: translate(-50%, -50%);\n                width: 10px;\n                height: 10px;\n                background-color: #0A8276;\n                border-radius: 50%;\n            }\n\n            &.disabled::after {\n                background-color: #BFBBBB;\n            }\n\n\n            &:hover {\n                border-color: tokens.$ifxColorOcean600;\n\n                & .radioButton__wrapper-mark {\n                    background-color: tokens.$ifxColorOcean600;\n                }\n            }\n\n            &.disabled {\n                background-color: tokens.$ifxColorBaseWhite;\n                border-color: #BFBBBB;\n\n                &.disabled::after {\n                    background-color: #BFBBBB;\n                }\n\n                & .radioButton__wrapper-mark {\n                    background-color: #BFBBBB;\n                }\n            }\n            &.error::after {\n                border-color: #CD002F;\n                background-color: #CD002F;\n            }\n        }\n\n        &.error:not(.disabled) {\n            border-color: #CD002F;\n\n            &:hover,\n            &:focus-visible {\n                border-color: #CD002F;\n            }\n        }\n    }\n\n    .label {\n        display: flex;\n        align-items: center;\n        height: tokens.$ifxSize250;\n        font-style: normal;\n        font-weight: 400;\n        font-size: tokens.$ifxFontSizeS;\n        line-height: tokens.$ifxLineHeightS;\n        color: tokens.$ifxColorBaseBlack;\n        flex: none;\n        order: 1;\n        flex-grow: 0;\n\n        &.label-m {\n            height: tokens.$ifxSize300;\n            font-size: tokens.$ifxFontSizeM;\n            line-height: tokens.$ifxLineHeightM;\n        }\n\n        &.disabled {\n            color: #BFBBBB;\n        }\n\n\n\n        &:hover {\n            cursor: pointer;\n        }\n    }\n}\n\n","import { Component, h, Prop, Element, State, Event, EventEmitter, Listen, Watch, 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',\n  styleUrl: 'radio-button.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class RadioButton {\n  @Element() el: HTMLElement;\n  @Prop() disabled: boolean = false;\n  @Prop() value: string;\n  @Prop() error: boolean = false;\n  @Prop({ reflect: true }) size: \"s\" | \"m\" = \"s\";\n  @Prop({ reflect: true }) name: string;\n  @Prop({ mutable: true }) checked: boolean;\n  @State() internalChecked: boolean = false;\n  @State() hasSlot: boolean = false;\n\n  @Method()\n  async isChecked(): Promise<boolean> {\n    return this.internalChecked;\n  }\n  \n  private inputElement: HTMLInputElement;\n  private internals: ElementInternals;\n  private fallbackInput: HTMLInputElement;\n\n  @Event({ eventName: 'ifxChange' }) ifxChange: EventEmitter;\n  @Event({ eventName: 'ifxError' }) ifxError: EventEmitter;\n\n  componentWillLoad() {\n    // Fallback for form association\n    this.fallbackInput = document.createElement('input');\n    this.fallbackInput.type = 'radio';\n    this.fallbackInput.hidden = true;\n    this.fallbackInput.className = '_ifx-radiobutton-fallback';\n    this.fallbackInput.style.cssText = `\n      display: none !important;\n      position: absolute !important;\n      opacity: 0 !important;\n      pointer-events: none !important;\n      width: 0 !important;\n      height: 0 !important;\n    `;\n    this.fallbackInput.setAttribute('aria-hidden', 'true');\n    this.fallbackInput.tabIndex = -1;\n    this.el.appendChild(this.fallbackInput);\n\n    // Initialize ElementInternals if supported\n    if ('attachInternals' in HTMLElement.prototype) {\n      try {\n        this.internals = this.el.attachInternals();\n      } catch (e) {\n        console.warn('ElementInternals not supported');\n      }\n    }\n\n    // Initial state\n    this.internalChecked = this.checked || false;\n    this.hasSlot = !!this.el.querySelector('[slot]') || this.el.innerHTML.trim() !== '';\n  }\n\n  async componentDidLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-radio-button', await framework)\n    }\n  }\n\n  @Watch('checked')\n  handleCheckedChange(newValue: boolean) {\n    this.internalChecked = newValue;\n  }\n\n  @Watch('internalChecked')\n  updateFormValue() {\n    // Update both ElementInternals and fallback input\n    if (this.internals?.setFormValue) {\n      this.internals.setFormValue(this.internalChecked ? this.value : null);\n    }\n    this.fallbackInput.checked = this.internalChecked;\n    this.fallbackInput.name = this.name;\n    this.fallbackInput.value = this.value;\n    this.fallbackInput.disabled = this.disabled;\n  }\n\n  @Watch('error')\n    errorChanged(newValue: boolean, oldValue: boolean) {\n      if (newValue !== oldValue) {\n        this.ifxError.emit(newValue);\n      }\n    }\n\n  handleRadioButtonClick(event: Event) {\n    if (this.disabled) {\n      event.stopPropagation();\n      return;\n    }\n\n    this.inputElement.click();\n    this.internalChecked = this.inputElement.checked;\n    this.checked = this.internalChecked;\n    this.ifxChange.emit(this.internalChecked);\n\n    const changeEvent = new CustomEvent('change', {\n      bubbles: true,\n      composed: true,\n      detail: { checked: this.internalChecked }\n    });\n    this.el.dispatchEvent(changeEvent);\n  }\n\n  @Listen('keydown')\n  handleKeyDown(ev: KeyboardEvent) {\n    if ([' ', 'Enter'].includes(ev.key)) {\n      ev.preventDefault();\n      this.handleRadioButtonClick(new PointerEvent('click'));\n    }\n  }\n\n  @Listen('change', { target: 'document' })\n  handleExternalChange(event: Event) {\n    const target = event.target as HTMLElement;\n    if (target === this.el || target.tagName.toLowerCase() !== 'ifx-radio-button') return;\n    \n    if (target.getAttribute('name') === this.name) {\n      this.internalChecked = false;\n    }\n  }\n\n  render() {\n    return (\n      <div\n        role=\"radio\"\n        aria-checked={String(this.internalChecked)}\n        aria-disabled={String(this.disabled)}\n        class={`radioButton__container ${this.size} ${this.disabled ? 'disabled' : ''}`}\n        onClick={(e) => this.handleRadioButtonClick(e)}\n        tabindex={this.disabled ? -1 : 0}\n      >\n        <div\n          class={`radioButton__wrapper \n            ${this.internalChecked ? 'checked' : ''} \n            ${this.disabled ? 'disabled' : ''} \n            ${this.error ? 'error' : ''}`}\n        >\n          {this.internalChecked && <div class=\"radioButton__wrapper-mark\"></div>}\n        </div>\n\n        {this.hasSlot && (\n          <div class={`label ${this.size === \"m\" ? \"label-m\" : \"\"} ${this.disabled ? 'disabled' : ''}`}>\n            <slot />\n          </div>\n        )}\n\n        <input\n          type=\"radio\"\n          hidden\n          ref={el => this.inputElement = el}\n          name={this.name}\n          value={this.value}\n          checked={this.internalChecked}\n          disabled={this.disabled}\n          onClick={(e) => e.stopPropagation()}\n        />\n      </div>\n    );\n  }\n}"],"mappings":"wIAAA,MAAMA,EAAiB,wuG,MCWVC,EAAW,MANxB,WAAAC,CAAAC,G,kFAQUC,KAAQC,SAAY,MAEpBD,KAAKE,MAAY,MACAF,KAAIG,KAAc,IAGlCH,KAAeI,gBAAY,MAC3BJ,KAAOK,QAAY,KAwJ7B,CArJC,eAAMC,GACJ,OAAON,KAAKI,e,CAUd,iBAAAG,GAEEP,KAAKQ,cAAgBC,SAASC,cAAc,SAC5CV,KAAKQ,cAAcG,KAAO,QAC1BX,KAAKQ,cAAcI,OAAS,KAC5BZ,KAAKQ,cAAcK,UAAY,4BAC/Bb,KAAKQ,cAAcM,MAAMC,QAAU,+MAQnCf,KAAKQ,cAAcQ,aAAa,cAAe,QAC/ChB,KAAKQ,cAAcS,UAAW,EAC9BjB,KAAKkB,GAAGC,YAAYnB,KAAKQ,eAGzB,GAAI,oBAAqBY,YAAYC,UAAW,CAC9C,IACErB,KAAKsB,UAAYtB,KAAKkB,GAAGK,iB,CACzB,MAAOC,GACPC,QAAQC,KAAK,iC,EAKjB1B,KAAKI,gBAAkBJ,KAAK2B,SAAW,MACvC3B,KAAKK,UAAYL,KAAKkB,GAAGU,cAAc,WAAa5B,KAAKkB,GAAGW,UAAUC,SAAW,E,CAGnF,sBAAMC,GACJ,IAAIC,EAAuBhC,KAAKkB,IAAK,CACnC,MAAMe,EAAYC,IAClBC,EAAe,yBAA0BF,E,EAK7C,mBAAAG,CAAoBC,GAClBrC,KAAKI,gBAAkBiC,C,CAIzB,eAAAC,G,MAEE,IAAIC,EAAAvC,KAAKsB,aAAW,MAAAiB,SAAA,SAAAA,EAAAC,aAAc,CAChCxC,KAAKsB,UAAUkB,aAAaxC,KAAKI,gBAAkBJ,KAAKyC,MAAQ,K,CAElEzC,KAAKQ,cAAcmB,QAAU3B,KAAKI,gBAClCJ,KAAKQ,cAAckC,KAAO1C,KAAK0C,KAC/B1C,KAAKQ,cAAciC,MAAQzC,KAAKyC,MAChCzC,KAAKQ,cAAcP,SAAWD,KAAKC,Q,CAInC,YAAA0C,CAAaN,EAAmBO,GAC9B,GAAIP,IAAaO,EAAU,CACzB5C,KAAK6C,SAASC,KAAKT,E,EAIzB,sBAAAU,CAAuBC,GACrB,GAAIhD,KAAKC,SAAU,CACjB+C,EAAMC,kBACN,M,CAGFjD,KAAKkD,aAAaC,QAClBnD,KAAKI,gBAAkBJ,KAAKkD,aAAavB,QACzC3B,KAAK2B,QAAU3B,KAAKI,gBACpBJ,KAAKoD,UAAUN,KAAK9C,KAAKI,iBAEzB,MAAMiD,EAAc,IAAIC,YAAY,SAAU,CAC5CC,QAAS,KACTC,SAAU,KACVC,OAAQ,CAAE9B,QAAS3B,KAAKI,mBAE1BJ,KAAKkB,GAAGwC,cAAcL,E,CAIxB,aAAAM,CAAcC,GACZ,GAAI,CAAC,IAAK,SAASC,SAASD,EAAGE,KAAM,CACnCF,EAAGG,iBACH/D,KAAK+C,uBAAuB,IAAIiB,aAAa,S,EAKjD,oBAAAC,CAAqBjB,GACnB,MAAMkB,EAASlB,EAAMkB,OACrB,GAAIA,IAAWlE,KAAKkB,IAAMgD,EAAOC,QAAQC,gBAAkB,mBAAoB,OAE/E,GAAIF,EAAOG,aAAa,UAAYrE,KAAK0C,KAAM,CAC7C1C,KAAKI,gBAAkB,K,EAI3B,MAAAkE,GACE,OACEC,EAAA,OAAAT,IAAA,2CACEU,KAAK,QAAO,eACEC,OAAOzE,KAAKI,iBAAgB,gBAC3BqE,OAAOzE,KAAKC,UAC3ByE,MAAO,0BAA0B1E,KAAKG,QAAQH,KAAKC,SAAW,WAAa,KAC3E0E,QAAUnD,GAAMxB,KAAK+C,uBAAuBvB,GAC5CoD,SAAU5E,KAAKC,UAAW,EAAK,GAE/BsE,EAAA,OAAAT,IAAA,2CACEY,MAAO,sCACH1E,KAAKI,gBAAkB,UAAY,oBACnCJ,KAAKC,SAAW,WAAa,oBAC7BD,KAAKE,MAAQ,QAAU,MAE1BF,KAAKI,iBAAmBmE,EAAA,OAAAT,IAAA,2CAAKY,MAAM,+BAGrC1E,KAAKK,SACJkE,EAAA,OAAAT,IAAA,2CAAKY,MAAO,SAAS1E,KAAKG,OAAS,IAAM,UAAY,MAAMH,KAAKC,SAAW,WAAa,MACtFsE,EAAA,QAAAT,IAAA,8CAIJS,EACE,SAAAT,IAAA,2CAAAnD,KAAK,QACLC,OACA,KAAAiE,IAAK3D,GAAMlB,KAAKkD,aAAehC,EAC/BwB,KAAM1C,KAAK0C,KACXD,MAAOzC,KAAKyC,MACZd,QAAS3B,KAAKI,gBACdH,SAAUD,KAAKC,SACf0E,QAAUnD,GAAMA,EAAEyB,oB","ignoreList":[]}

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

@@ -1,2 +0,0 @@
-import{r as e,e as a,h as t,a as s}from"./p-DS8meZSd.js";const i="*{padding:0;margin:0}.templates__container{display:flex;flex-direction:column;align-items:center}.templates__container .back__btn-wrapper{display:none}.templates__container .back__btn-wrapper.show{display:flex;justify-content:space-between;width:100%}.templates__container .back__btn-wrapper .alert__wrapper{display:none}.templates__container .back__btn-wrapper .alert__wrapper.show{display:block}.templates__container .templates__wrapper{display:flex;padding:20px 0px;gap:20px;flex-wrap:wrap}.templates__container .templates__title.hide{display:none}";const r=class{constructor(t){e(this,t);this.tableTemplate=a(`https://raw.githubusercontent.com/Infineon/public-assets/refs/heads/main/table_template.png`);this.wizardTemplate=a(`https://raw.githubusercontent.com/Infineon/public-assets/refs/heads/main/wizard_template.png`)}toggleTemplate(e){const a=this.el.shadowRoot.querySelector(".templates__wrapper").querySelectorAll("ifx-template");a.forEach((a=>{a.toggleTemplate(e)}))}handleError(e){const a=this.el.shadowRoot.querySelector(".alert__wrapper");if(e.detail){a.classList.add("show")}else{a.classList.remove("show")}}filterTemplates(e){const a=this.el.shadowRoot.querySelector(".templates__title");const t=this.el.shadowRoot.querySelector(".back__btn-wrapper");if(e.detail){a.classList.add("hide");if(e.detail!=="details"){t.classList.add("show")}this.toggleTemplate(e.detail)}else{a.classList.remove("hide");t.classList.remove("show");this.toggleTemplate(null)}}closeAlert(){const e=this.el.shadowRoot.querySelector(".alert__wrapper");e.classList.remove("show")}render(){return t("div",{key:"36aa01d8eaf43a955bde103c515ff1acb18bfe88",class:"templates__container"},t("div",{key:"9ce85c759c10f016692f155a74e5f63353915f66",class:"back__btn-wrapper"},t("ifx-icon-button",{key:"53a8c146a85d2cba1efc15cb994f6c48d742f333",onClick:()=>this.filterTemplates(false),shape:"round",variant:"tertiary",icon:"arrow-left-16",target:"_blank",size:"m"}),t("div",{key:"8e21e8970aa37fa859da1b3672178e3b7b840f0b",class:"alert__wrapper"},t("ifx-alert",{key:"004e9f5284878a2d3b8de51620078d518bcfaa8f",onClick:()=>this.closeAlert(),"aria-live":"assertive",variant:"danger",icon:"c-info-16"},"All fields are mandatory"))),t("h2",{key:"d9821c5e2dd87bc85bb4628bb77077a1bf03da5e",class:"templates__title"},"Choose your template"),t("div",{key:"d2710a5ffacc29bb5d11a02e927f125a4a9035df",class:"templates__wrapper"},t("ifx-template",{key:"46ee28ec8d68016117e00a6abe12106203aa83f4",name:"template-01",thumbnail:this.tableTemplate}),t("ifx-template",{key:"08a20b67ccc818e63935dadfdec9f48adf2769b9",name:"template-02",thumbnail:this.wizardTemplate})))}static get assetsDirs(){return["assets"]}get el(){return s(this)}};r.style=i;export{r as ifx_templates_ui};
-//# sourceMappingURL=p-27264beb.entry.js.map

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

@@ -1,2 +0,0 @@
-import{r as e,h as c,a}from"./p-DS8meZSd.js";const d='*{font-family:"Source Sans 3";box-sizing:border-box}body{margin:0;padding:0;overflow-x:hidden}header{margin-bottom:15px;display:flex;justify-content:center}.header__info-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}.infoboard__wrapper{display:flex;gap:15px;background-color:#f1f1f1;padding:5px 10px;border-radius:10px}.title{font-size:30px;font-weight:bold}.view{margin:auto}.wrapper{position:relative;width:100%;height:calc(100vh - var(--header-height) - 15px);overflow:auto}table{width:100%;table-layout:fixed;border-spacing:0}thead tr th{border-top:1px solid #dddddd}td,th{padding:10px;background-color:white;border:none;box-shadow:0 0 0 1px #dddddd;box-sizing:border-box}table th:nth-child(1){width:150px}table th:not(:nth-child(1)){width:240px}th{position:sticky;top:0;background-color:white}.sticky-col{position:sticky;z-index:1}th.sticky-col{z-index:2}.second-col{left:0;border-left:1px solid #ddd}.wrapped-content{width:250px;white-space:normal}a{text-decoration:none;color:black}.basic__info{display:flex;gap:5px}ul{padding:0 5px;margin:0 15px;list-style-type:none}tr:nth-child(even) td{background-color:#f1f1f1}ul li{font-size:12px;display:flex;gap:5px;line-height:13px}li.planned__component-wrapper{align-items:center;line-height:16px}.version__wrapper{display:flex;flex-direction:column}ifx-icon{color:rgb(10, 130, 118)}.check__icon{width:10px;height:10px}.planned__icon{width:12px;height:12px;vertical-align:sub}';const f=class{constructor(c){e(this,c);this.getPlannedComponents=()=>{const e=this.el.shadowRoot.querySelectorAll(".planned__component");return e.length};this.setPlannedComponentsNumber=()=>{const e=this.getPlannedComponents();const c=this.el.shadowRoot.getElementById("number__indicator-planned");c.number=e};this.getCompletedComponents=()=>{const e=this.el.shadowRoot.querySelectorAll(".completed__component");return e.length};this.setCompletedComponentsNumber=()=>{const e=this.getCompletedComponents();const c=this.el.shadowRoot.getElementById("number__indicator-completed");c.number=e};this.setTotalComponentsNumber=()=>{const e=this.getPlannedComponents();const c=this.getCompletedComponents();const a=this.el.shadowRoot.getElementById("number__indicator-total");const d=e+c;a.number=d}}componentWillLoad(){let e=this.el.parentElement;if(e){e=e.parentElement;e.style.padding="0px"}}componentDidLoad(){const e=this.el.shadowRoot.querySelector("header");const c=e.offsetHeight;const a=this.el.shadowRoot.querySelector(".wrapper");a.style.setProperty("--header-height",`${c}px`);this.setPlannedComponentsNumber();this.setCompletedComponentsNumber();this.setTotalComponentsNumber()}render(){return c("div",{key:"b5e0adfc133dd7351fbcdef0433e060e43cc83d8",class:"container"},c("header",{key:"eef4d038fa80ac4494326b7ee8f83d74ecd2b3bb",class:"header"},c("div",{key:"9265e37a2949a24a7872894c9165fa4a86771364",class:"header__info-wrapper"},c("div",{key:"cd8f01827f3aba08ab39335da369de47ef8dd346",class:"title"},"DDS Components Overview"),c("div",{key:"22b3d83eeeececce070658ae42074a97c3f78625",class:"infoboard__wrapper"},c("div",{key:"f0ca1e1817cfd593bb5662b82081ed2b0184fcf4",class:"basic__info"},c("div",{key:"f8683b70ef8374a4efcc5a48ae2119cd7d50b4dd"},"Total Number:"),c("div",{key:"ef78725ee53a2473e254f2de9f58624519201717"},c("ifx-indicator",{key:"f6cd423ca86cfbaa3e248611d96c57b072bfdb92",id:"number__indicator-total",variant:"number"}))),c("div",{key:"38cbf38cea93c1398bef588db752f71de6e2cb30",class:"basic__info"},c("div",{key:"6f37b37c570f20fd0e22d65e339d093b8e8a2fbe"},"Completed:"),c("div",{key:"39d6cc670b53a60464578051663a2932075e6055"},c("ifx-indicator",{key:"81af885e0238921dbb6b2e1fb0f5820af9ddc65b",id:"number__indicator-completed",variant:"number"}))),c("div",{key:"a9edb18f33a0479a709a6d375e423dc262b7dc04",class:"basic__info"},c("div",{key:"9c8124a35b4f05bf60f799f5b0976305237077b8"},"In Progress:"),c("div",{key:"e87d2db5107df9e35be68ab5395ba1e47b0eac3d"},c("ifx-indicator",{key:"4af86636abd1a065063e573d85040d461c9fbec7",id:"number__indicator-planned",variant:"number"})))))),c("div",{key:"4180e631ddd7a2799f5086f160277ce9685db9f0",class:"view"},c("div",{key:"7ae6bbce05c2bafc03e070583c8b32e887a1c7d9",class:"wrapper"},c("table",{key:"1c76978a40e04a433c4ede3c21c5b81634e1c1ba"},c("thead",{key:"9cd53a94231d0d1c25f10f6edd7030d0372577b1"},c("tr",{key:"e02324eb99e3c24dff51f5999cd2cf48d796850b"},c("th",{key:"bf0211071f2f72f2087598a932aff6482baec915",class:"sticky-col second-col"},"Component"),c("th",{key:"66d0dd746cbf010f889f26dabcf0239ebe2e2de5"},c("div",{key:"955ed744c8fb849a83b19e0a34eebd6ec3176c62",class:"version__wrapper"},c("span",{key:"3ab5f6730052f4805ed7f84fc19e3ce1fbd9ddef"},"Version 1"))),c("th",{key:"358c32e624f3a891269ad30b647cde68117446b0"},c("div",{key:"7a1d397e9ed7e5752f4fcc68aeb0cd1e34e4cfb8",class:"version__wrapper"},c("span",{key:"af62565d5f30beba1a2b3e0883ad7ddcaf2409ae"},"Version 2"))),c("th",{key:"dfe06aa4e0e2bf2ce5a3114de07ca8862c548de3"},"Version 3"))),c("tbody",{key:"70ca2c72c3e8999247a9e7328ccf4ff91ce1028b"},c("tr",{key:"ef6862ceeb5b7ad9020566613dbc947ad8f3eefe"},c("td",{key:"71d84cebbd82fb6f45f401ee5e0b925602efc6b6",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"36b05c653829284c26f3ada7df7c2e01683df032",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-accordion--development",size:"s",variant:"bold"},"Accordion")),c("td",{key:"35c44faf4a2125a515a062e5ad509598bfb3d5be"},c("ul",{key:"fffe062ddf59cf7257f4840fe3efca07c59d392b"},c("li",{key:"de871839444ab4c82c9ac5f20c30ceb758cce88c"},c("span",{key:"35b44abd6e730619766ea0554d9fec32e281a589"},c("ifx-icon",{key:"cca03057d42741dec9067d8095f8428bb341e142",class:"check__icon",icon:"check16"})),c("span",{key:"a0dae6b4f4d90eea1d608db3f3f98ec7b4242080"},"Includes essential functionality such as expand/collapse behavior and minimal customization options")),c("li",{key:"f93fe8bb00c70dba490999591d4cfffd6c5539b2"},c("span",{key:"e982a873c34bfb3cbcf0ac83b13cc2cee20a4c8f"},c("ifx-icon",{key:"ae2dee094fa814a3c79e726f362779d32311f3f1",class:"check__icon",icon:"check16"})),c("span",{key:"e0543dbda56a1bba4653713b26643b5c3f4c6a9e"},"Adheres to web standards")),c("li",{key:"0e2715826d7adfcf2ba05cf0b1b65fabf1fd596d"},c("span",{key:"741e77827cd7e76fcfaabd962ff691686d33894f"},c("ifx-icon",{key:"133fa6a0076851fb94a30edb8116a9c3c19b15f6",class:"check__icon",icon:"check16"})),c("span",{key:"7da5239790c48e23e3f8aae99065ccdcef4d59ef"},"Provides a simple and lightweight way to organize and display collapsible content")))),c("td",{key:"66367794109267440dc101a24cfa5255d7372563"},c("ul",{key:"9c938d2d5c0cdfaaea0c7159b0a48f99604818f8"},c("li",{key:"f46d0817a49d77f93ba28e1feedb40941389d99c"},c("span",{key:"2603649086086475ec32a405c04d5deda840c240"},c("ifx-icon",{key:"bc1c5915decba40a4f32c7632313504a2fdc3b03",class:"check__icon",icon:"check16"})),c("span",{key:"d91a7d8acf80ced5d731588354c108977a77b517"},"Auto collapse feature")),c("li",{key:"937ba350e7260a1cab80f5467d96e1dad3634766"},c("span",{key:"437f66de8781f78164f5bc7dfc6a60c97707bef8"},c("ifx-icon",{key:"43adeb46764b4df97a1902a5fe26bf9a8de38429",class:"check__icon",icon:"check16"})),c("span",{key:"3d409974451942fbfad0843d05c31072e69d5dc6"},"Initial collapse feature")),c("li",{key:"bde800bb2243b3f33be199553129124989d8ab94"},c("span",{key:"51b413f3f0a98dcf9fc17e9c3ae0d9824abd7e31"},c("ifx-icon",{key:"4c0763b4e1c7ef4148cc4428971b80e3e5d7023c",class:"check__icon",icon:"check16"})),c("span",{key:"fc4a201c761ecb1984582f1ac61fba1cc8496c80"},"React, Vue and Angular wrapper integration")))),c("td",{key:"b0fc109026afb30bd3abc62a7bd06d74b71af99a"})),c("tr",{key:"be70be42345356164a4e93c07e5a877ffb6db25e"},c("td",{key:"6a8d92542fc5168ccefd7f248921ff61bee41a76",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"9ff4f29fdcd1d98c7247f1156075c0a805d60e57",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-alert--development",size:"s",variant:"bold"},"Alert")),c("td",{key:"80aca05168134b09b6681c7bca72ea70f3f0a1b9"},c("ul",{key:"eaa65ad7bd1c8c2861420deef4da570221b4c089"},c("li",{key:"35ba15309951b5d28e4c79700dc8c6d6f8bffd30"},c("span",{key:"d82a4763116577392422c61d0999e51cefb254d5"},c("ifx-icon",{key:"76c4cb2d23987f30c7447c315512f0c00b98eee5",class:"check__icon",icon:"check16"})),c("span",{key:"cabb57e1085c46391e79b6f779afbc41d99d9ef0"},"Provides a lightweight and customizable interface for presenting alerts, including options for different alert types (e.g., primary, success, danger, warning) and basic styling configurations")),c("li",{key:"4a8b4daa5dd369d3a2e1b7e6edb0dc21609ef158"},c("span",{key:"f64abac1d2dff7ad150a81d7d26af1b499388873"},c("ifx-icon",{key:"e067bc51c5cbad6b94bd7e7fdd4c5d70d2d3c485",class:"check__icon",icon:"check16"})),c("span",{key:"a15a59ec05fafabcecc178300a3bdc7aec634dc6"},"Adheres to web standards")))),c("td",{key:"e93a5a47064cbb2fc5a5efb8d6aecd04b5f0300a"},c("ul",{key:"2b35bf768ce10783d9f9a43be42b8c97b94cdb6c"},c("li",{key:"b7abf46cb986c0319114b992402334b337ab3fe0"},c("span",{key:"037507d036e9d9ae8e899d60316cdf2f0f40e9da"},c("ifx-icon",{key:"fe401a7d941f27ec6eb3bca2f50fb25ca1f3d0ed",class:"check__icon",icon:"check16"})),c("span",{key:"88ec6c13d08b8c232bb0eaec1c692895a2b78084"},"Configurable close button")),c("li",{key:"7fb90e6a9cfab77aa52108461dd02b070e3f48c2"},c("span",{key:"b0312764773a6d7a9e99d7cd9363904d0900fde7"},c("ifx-icon",{key:"32e63d575bf7da267ffb7b1573a3f4942425e500",class:"check__icon",icon:"check16"})),c("span",{key:"ecf701142b756f02a70bd7487844b9dcd94b8ce0"},"Additional Info variant")),c("li",{key:"90b2b3bf79f0cf085d4e5d151b19d7a6160d95de"},c("span",{key:"fa24e42a184d51b194cdb651f520174b4a6a0a71"},c("ifx-icon",{key:"e41b0853b0baf114bc2f3ea5f1bfe13c09d1a9ce",class:"check__icon",icon:"check16"})),c("span",{key:"7263b4af10c8fbc40f29ecf5c0bdca89441f8f2b"},"React, Vue and Angular wrapper integration")))),c("td",{key:"25417a20bb4bf5527a8638649d318f011d9471f6"})),c("tr",{key:"42646d457631866da201939615fa4dd5bf9d15f4"},c("td",{key:"ecfd6783a9235cef0abf939bd5fb05a52815fc7d",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"a7cd189f11727ee98df0c317fac1489ad9e232b1",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-badge--development",size:"s",variant:"bold"},"Badge")),c("td",{key:"d2d86afe2fd9e3ac9a9b9fbe48fb05b275075935"},c("ul",{key:"f8214a3db21168a00bc9b69d905745e9f6ee02e7"},c("li",{key:"bd8ce9e62745824792a94d701302b1f28f0062f8"},c("span",{key:"1d91255881fc50459496ff4d1736b9df618683e7"},c("ifx-icon",{key:"e44012950118e540489521e5448194a30c82e053",class:"check__icon",icon:"check16"})),c("span",{key:"21057fd1b0a37b7bc83c19cf6d2f08331228d7ae"},"Offers simple customization options for displaying badges, allowing developers to indicate specific actions, statuses, or categories with visual cues")),c("li",{key:"aa0247f9ed934af5f297da6d4a5474e6eaa7b1be"},c("span",{key:"95a026cfcb50d500c94b802c19868a8c6ef49ed7"},c("ifx-icon",{key:"440888b274591bd3bd355656b1865c7c732a5aed",class:"check__icon",icon:"check16"})),c("span",{key:"fbd79b42870163b60f4450f67d0c35055b323897"},"Designed to seamlessly integrate with existing UI elements and adhere to web standards")))),c("td",{key:"398633367d12857bdb62c69895ae5a488079c32b"},c("ul",{key:"9cad239ad02589a59c6d9b02743820fbe11d5de1"},c("li",{key:"b51c853040ff843581a51313f5ef544e36b8f181"},c("span",{key:"240e041a865ad263f9b5e49fb59b8a451becd23d"},c("ifx-icon",{key:"77593c85378791da9cc23efea05d6c9cb360c81e",class:"check__icon",icon:"check16"})),c("span",{key:"961e61b73d57470e072316cd03db228dad9d9f07"},"React, Vue and Angular wrapper integration")))),c("td",{key:"3ddb8cb00d4093a1acdd0bd9b6cc693189797ee8"})),c("tr",{key:"35fd4ff056bff86aa847b42880e59c96707fe429"},c("td",{key:"dd14ad1dd143acbadddce37961532acc1844c032",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8978906d0fc88e047dcda3bc4bb55601e7b01872",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-breadcrumb--development",size:"s",variant:"bold"},"Breadcrumb")),c("td",{key:"027de7ef110364c7652783d73e6d9f7651624c01"},c("ul",{key:"cdf70596221a1c0d40f7e0709779c85229ac00d5"},c("li",{key:"3410e5a3a8eae2d0d52fe7d3d4087d69cb9f2ef6"},c("span",{key:"eefa555aa0c436ab3ca014d41e5cc108a1967cf0"},c("ifx-icon",{key:"d4cfcafc434cbdee834da5d26f5d9b0d9b47f73d",class:"check__icon",icon:"check16"})),c("span",{key:"867bf6ddfeef13211fb1f6b86c825684a11464ac"},"Provides a simple and customizable way to display a sequential trail of links or indicators,  representing the user's current location within a hierarchy of content")),c("li",{key:"434d12df37e10624a10bebef9bf791369b73c072"},c("span",{key:"400c4c4354a243effe7950279a0730c69256ab1b"},c("ifx-icon",{key:"a41b4523892eac99797119289d6f1b73befcfd96",class:"check__icon",icon:"check16"})),c("span",{key:"f4257c75077b3be4466b4d2150d05264570955d4"},"Adheres to web standards")))),c("td",{key:"76f5c5f45b30558010f2f4e9a8fc523a13878b90"},c("ul",{key:"644a3698105ed59dd15440ae0409d0cef2b60e2a"},c("li",{key:"5899a6f9fc3e661aeae7347a8a87812a8630940a"},c("span",{key:"6b70e1d0f953a007feb6eea1b5a9807cbdf5d836"},c("ifx-icon",{key:"ec2bedddee3afe85920c05dcfdfe42b28cec9af1",class:"check__icon",icon:"check16"})),c("span",{key:"93b61730071db89093fd632a2cb2f08a8b7d3a2b"},"Possibility to add an icon")),c("li",{key:"ec6be8815cf1f63c4f9385b53e3b06f4d9988d66"},c("span",{key:"34a130cb5b6e9ae9eac9c16d9a16b347f7218b6d"},c("ifx-icon",{key:"d3eea1b61f0963b71bd0c6b42dca0fe43c52351e",class:"check__icon",icon:"check16"})),c("span",{key:"385c10483d060f5c3ae1ba6d100a5f1cd4a1260f"},"Incorporated dropdown-menu for individual items")),c("li",{key:"55fa61ecf5693ba8b2feb18e2a994c6e7ca4f989"},c("span",{key:"f68b066a9f3b98bc97a314b8a29ab8ecd39627d5"},c("ifx-icon",{key:"b8840a40f374f66e03101391aae1e7cb647b4ea3",class:"check__icon",icon:"check16"})),c("span",{key:"10ca0e779bfc258994fb1088476c4e26b1ebe504"},"React, Vue and Angular wrapper integration")))),c("td",{key:"4180634496cb7dbddc5c44c0758e361227c41c81"})),c("tr",{key:"b1579a6a421a0e7948e5e025523f83b4c75265d6"},c("td",{key:"d64e8759703b10b7e39f6c928ae90d95e846861e",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"ca306bd52b8e8dfc18e204f31d7a498099817e2c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-button--development",size:"s",variant:"bold"},"Button")),c("td",{key:"50124b76a6125bdf45a0a547bd4e72f54deb9999"},c("ul",{key:"7f1ff4f2c69f800e4f12b299c7c4a54c827c449d"},c("li",{key:"a6d1bff2b7c74865b911b949e46146cdb6694a19"},c("span",{key:"d020f9867fecaada16a3310776fe788262bad33c"},c("ifx-icon",{key:"543e55ace901e0522151ad0b2e64977914797a3c",class:"check__icon",icon:"check16"})),c("span",{key:"fe24f1ebf794440eb852371ec5d83d2424c21672"},"Includes basic styling options such as colors, sizes, and states, providing essential functionality for initiating actions")),c("li",{key:"08c253aacdf16b936845220fcd217b78bcf35a94"},c("span",{key:"8532f1afd318af6db6c28e19a97ef33e39ca94fc"},c("ifx-icon",{key:"b01613de68ad2735d0730518eea3881e91203995",class:"check__icon",icon:"check16"})),c("span",{key:"0b668b20276dfa13380ba6200dc618a288d3c6c9"},"Adheres to web standards")))),c("td",{key:"e1798c2b20411cc3e0b17c815be0d5c2b8bd4f2c"},c("ul",{key:"cb0dc410fd812328284e315b12982b5f967e7d90"},c("li",{key:"a42daaf37ecf64fd50cbfa84c6363347a8b38400"},c("span",{key:"551a20a3661271dfe1b4ef3662e5e4e8a02d011a"},c("ifx-icon",{key:"948302a896d093169d47af290003e0787a45d979",class:"check__icon",icon:"check16"})),c("span",{key:"b40d8d6b2ea4eea75d0ffeba8a5feed5bc620b6b"},"fullWidth feature")),c("li",{key:"1ea4390b205b5e301f69596b9495841e64e6ec11"},c("span",{key:"1bbd67ca381a88892606edbcc4c10aecac11d323"},c("ifx-icon",{key:"b5eae37a4d2ae4e543a3e363009bc258151bc185",class:"check__icon",icon:"check16"})),c("span",{key:"188cd852ed37a50d9c9656844dce24d6e7a01da4"},"Icon integration")),c("li",{key:"fb9022e2cc1e4153c9f9ec0f7836bc5672b8a40d"},c("span",{key:"5b57995a38f2f1855236737b562d0dfeb2a64d5c"},c("ifx-icon",{key:"50d16f110cc464258e5f89929080a6c17a656128",class:"check__icon",icon:"check16"})),c("span",{key:"ea48b20054173971fb403d4a317c302d1f88432e"},"Link integration")),c("li",{key:"d2859004f74ae15020bd929c77fd61214211ccf5"},c("span",{key:"61815b38b0c1fe5778e72576a201d3e1fba8fd26"},c("ifx-icon",{key:"f7d4dbab64ecd7c39557c63c553be70cae5d1886",class:"check__icon",icon:"check16"})),c("span",{key:"a3905ca0b0539c3683cbf1196cdba8638dc744c4"},"React, Vue and Angular wrapper integration")))),c("td",{key:"3f8ff8ea386ce074f1e1af25f646c8362c7ecc54"},c("ul",{key:"fd5f3d17eb8b2782b6a75665468860bc3821ee0e"},c("li",{key:"9f1e8ee498f6d6c474f755f83da8f42e02a97b7f"},c("span",{key:"ffd2a19ed5035a7734a8fe3cb0f3b6d9f5e131b8"},c("ifx-icon",{key:"63717150bc6da6984dfb86c8b80e6cbef14f765a",class:"check__icon",icon:"check16"})),c("span",{key:"bd3c7c27ce904193f35c5461f43c89ac9b664521"},"Form integration"))))),c("tr",{key:"d8b668a1d9fd828ae446b0a2bac07b43d0def322"},c("td",{key:"014fbe2fb58adb9cb847eceb1402747a455894cd",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"d6207ba2dedce82edaab38df10da3eb3cd226821",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-card--development",size:"s",variant:"bold"},"Card")),c("td",{key:"75a401c27d8db4fa33cef3171f7dda78d223cd2f"},c("ul",{key:"02c97fa64684263727d54e513a5501a4f1f80cf1"},c("li",{key:"21c64001e5c7c976a20ea22e0b1547d71c31ea1e"},c("span",{key:"d6cae0521fcb91620f8600eda5f7bd15e38e487c"},c("ifx-icon",{key:"381c72e88d1d6c61cb50224c34e23ff6480da47f",class:"check__icon",icon:"check16"})),c("span",{key:"03d152deb030c87651d54a23805f49965be1e68e"},"Provides a structured and customizable layout, featuring elements such as headings, images, text, and buttons")),c("li",{key:"443a1f368da14e1c91bf16783967915d2314b407"},c("span",{key:"0af82bb56f25e5a6e87c3bfc7ddc0dd2ce59e5d3"},c("ifx-icon",{key:"dc806df7d3f0f31c7cedcdeeb0510dae55ca7617",class:"check__icon",icon:"check16"})),c("span",{key:"43fb7cedf91c099c26bfdc6e20b27d2556013a74"},"Adheres to web standards")),c("li",{key:"5bd7141e0c24c07b643c7f596359e1cf8fbb7160"},c("span",{key:"aa89d7b416060d160ab910649a3ba11870519d99"},c("ifx-icon",{key:"cedd2ce1a6dbba6cf4f38a4e01dc585c8530bdfe",class:"check__icon",icon:"check16"})),c("span",{key:"ab2160c779423ecabef625c32f454c1b18914d67"},"Horizontal and Vertical layout")))),c("td",{key:"21d2053d4395ffafd83d11ac69eb7df7e761ef30"},c("ul",{key:"4124f34070cb78e57eaf8b37d74a63846c361a73"},c("li",{key:"0bcb6be6db18905c6646bcc572070d075ce528c9"},c("span",{key:"9af0e4bfd94a15860a642a07dccb6b667a853c2e"},c("ifx-icon",{key:"22b5c4f70f0136dbd27837ec970268caae29c52e",class:"check__icon",icon:"check16"})),c("span",{key:"23628607aa7d5a7d3b47fc76b8b625672f74dfcf"},"Possibility to embed multiple buttons")),c("li",{key:"f31a9d3218445b0f2ed1f78c5783c3dbc2cee632"},c("span",{key:"42fdc8fb33377f343b32f59eda417ce7fa264b90"},c("ifx-icon",{key:"7c19e6e0608c845a52904cad1a992877bbc29881",class:"check__icon",icon:"check16"})),c("span",{key:"80f7a25c0d61e1f0d36214e35833ee266397fb7a"},"A switch between a Link and a Button")),c("li",{key:"cd0c8660dfa134b189b0beafd42b3849e89cfeca"},c("span",{key:"4c5253e0a939c4cc896278703045559d0bac2c97"},c("ifx-icon",{key:"f67188d0beccc7aa050019c9ff3d821a84bce89c",class:"check__icon",icon:"check16"})),c("span",{key:"8cbbba68cef8a6d484d0b41d50dc94f04f4577e9"},"Enhanced stylying behavior")),c("li",{key:"00843de5c4616a4754436e53421bd5999364a8b6"},c("span",{key:"bd48144655af152b22fab93184e0e04bc58de953"},c("ifx-icon",{key:"c45dc166b7a3c6df8e0b5916389c90f0c428b50d",class:"check__icon",icon:"check16"})),c("span",{key:"f373a722cb241461b73182f46e18f189bbc98c7e"},"React, Vue and Angular wrapper integration")))),c("td",{key:"8ad7254dd49bb71ce24bd2975a51b7cd799b01ae"})),c("tr",{key:"006d2ef89a7e49123361b072f5ddde73d21d28f8"},c("td",{key:"143065f4ef07448524db3ac97cc516d0aaff7753",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"babad0b2e5dfe7a1be41a69f473acfe37bdd23b4",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-checkbox--development",size:"s",variant:"bold"},"Checkbox")),c("td",{key:"960fe99bd21d830c9559714c827ba559fb45af5f"},c("ul",{key:"d64f7182f8b102b263295ae563815c5cdffafccf"},c("li",{key:"df433c6da4b20116d9821b3507e2222d40457020"},c("span",{key:"d5e2be6f5e80864e93ae7b53b071f72f2aaec329"},c("ifx-icon",{key:"ecbfd649639ca09b9b4bdad948ac54404cdbc6d5",class:"check__icon",icon:"check16"})),c("span",{key:"3f568c5dd43802ea475015e3f5031866788ca039"},"Offers a simple and customizable checkbox input, allowing users to toggle between checked and unchecked states")),c("li",{key:"40e96f7f3e8934c6f84f06105be4dd70d9dd76cd"},c("span",{key:"3734dc7933bb5eb043e24e74e35c8cd0c7a45438"},c("ifx-icon",{key:"1c4b18a92ad5a7a9fd68010bbd4dccb13e0380ea",class:"check__icon",icon:"check16"})),c("span",{key:"a731c4ede6c6f6886c6b2f80b26b98e641bca04e"},"Adheres to web standards")))),c("td",{key:"eb953f7b108e46dabe142699f523df775ee9d6d6"},c("ul",{key:"185f1cf69df61b9b927629253984389fa84bb2c0"},c("li",{key:"a7cea79e720f6cf0627dcaf8b6cfaf30be67686a"},c("span",{key:"6cd230e65f6c0e1a708527d20160198b1a1d00f2"},c("ifx-icon",{key:"b0cf26d3bfef01ed85c8523c046ddacd4ac47d2a",class:"check__icon",icon:"check16"})),c("span",{key:"bdf46d90d64e6af117445cc44b2a15ca4ee6a7b0"},"Indeterminate state variant")),c("li",{key:"e960a5ab5ad68c092607d378beedde535d2308ac"},c("span",{key:"ee12589781ecae32dea3b7b28b426cc0a5384594"},c("ifx-icon",{key:"d842ea9676853794b3223eab798c13464349367d",class:"check__icon",icon:"check16"})),c("span",{key:"fdcdacbf65cb5e5bdd68f6bb69c1138a7d413044"},"React, Vue and Angular wrapper integration")))),c("td",{key:"6404a9c05ba59dd153486ed5a5002fff097fe867"})),c("tr",{key:"97f4d5cb04534dc2a4450001b330bc7f4c597f97"},c("td",{key:"e2349a614dbecf846eda94b18ea81cbef4021a54",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"cc12208196989074b87724959768a48eb528f7a1",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-checkbox-group--development",size:"s",variant:"bold"},"Checkbox Group")),c("td",{key:"acc0420f2bfdbe10ecb688593408f1cb5ba70594"},c("ul",{key:"b9c07fad73ae98752ccae5d0d34638c4ba6d99e5"},c("li",{key:"f0b7ecac3eda46eb317ee5cfc4bf3ddc8475094c"},c("span",{key:"63ebdf778ebc256cd00f5e26a5a69df620317cfe"},c("ifx-icon",{key:"c296a30a9d4770d7b785875b5295f8718f5f2694",class:"check__icon",icon:"check16"})),c("span",{key:"08a9f998b94df5ece8a3c05a6ad2f022dd15cd8f"},"Provides a simple and customizable interface for grouping multiple checkbox inputs")),c("li",{key:"c55f42785d749cc388ac8d458091fc96f28e0406"},c("span",{key:"bda8cc9e8cfe0e83a93ccff931169dd070bd1fd9"},c("ifx-icon",{key:"9d01b7d8a6a505c8ea74410c1c615102665e34e3",class:"check__icon",icon:"check16"})),c("span",{key:"62f5d2b6dd43757857417f83187712d07e23ece4"},"Allows users to set and display group label, caption text and caption icon")),c("li",{key:"354a0139f6231cf951b1517b63a5d7850b624ca9"},c("span",{key:"d591848100be21f430990e63d83ba6fba8e4e87b"},c("ifx-icon",{key:"947ead78892854825cba2abf1c1f643699fb37fa",class:"check__icon",icon:"check16"})),c("span",{key:"23e262e9fc692482a998e8327f409533d5491db1"},"Allows to display individual or group error")),c("li",{key:"41d955077aeccec04d6753276392ee4c0a7a80a6"},c("span",{key:"390a61060dcccac5e8e5ad44e8261467e45a4294"},c("ifx-icon",{key:"47af5a995581fdc6a3a0afbd44989bf57b077781",class:"check__icon",icon:"check16"})),c("span",{key:"6761b50e1c6c19790cc35b61ed6ca51862b71021"},"React, Vue and Angular wrapper integration")),c("li",{key:"590888ad3f6ae8cd28116c471f30a99cfbe31789"},c("span",{key:"af78de773d7c26bb9773d22fc3905a865470e17f"},c("ifx-icon",{key:"28903a16c5b2f51663ccc0ee480fef349f132015",class:"check__icon",icon:"check16"})),c("span",{key:"a1eb36400e5f6858f452b5b76d744b6ac4e070b7"},"Adheres to web standards")))),c("td",{key:"3c2204e0421e1b6bf9b8bc59e169bf4e7f67f3d5"}),c("td",{key:"8063dc4ff719d45bc31f4a69d0d537e9b8b5c96a"})),c("tr",{key:"f62ef2e4b4fc17b38896330c17802ed17e125800"},c("td",{key:"e7be534e436a180e1e31e4682c4e6dda85c63c93",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"c3e7fc6a8d07ee2623918803fcc8f3f697765461",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-chip--development",size:"s",variant:"bold"},"Chip")),c("td",{key:"01bad88b9937d771c557d3e74a6cc55185f8c0e1"},c("ul",{key:"a73389fcc78909c38fdc4d8177e80ef2887d926c"},c("li",{key:"c26096f9db726e98fd2edaeff8909e5d0cd375ec"},c("span",{key:"5545052bc8d5ab3610ac1fa1fb03ee7310e40022"},c("ifx-icon",{key:"4d0f61c75add47c67cf4eef1694223d7bb806d8c",class:"check__icon",icon:"check16"})),c("span",{key:"c1edbd22cca3be551267303b3859a8797c68a27d"},"Provides a simple and customizable interface, representing discrete units of information or user interactions, such as labels, categories, or removable entities")),c("li",{key:"80969c62f8054f4b45314218dd70b741d2c14d5f"},c("span",{key:"286a9eb6372bff40758493ed67b9c67dd8915a47"},c("ifx-icon",{key:"cc4e79905eac6385761f3972a701d4245627a39a",class:"check__icon",icon:"check16"})),c("span",{key:"43c384b79303d43133a8ee055070c24ae9946e2c"},"Adheres to web standards")))),c("td",{key:"b7f8ee1d5a53dab75acb1299cf6adb5d62e7c691"},c("ul",{key:"a9c11b44cd34715c0b1c5d1d0643ceee7ede8b95"},c("li",{key:"5efac007eb5f1db55fe6e19dbaf97c7248a21a2b"},c("span",{key:"786c759c4c411acc07486f12fb0b5596c79eac29"},c("ifx-icon",{key:"25278b1d67aaa39374fb49dbaf44d86b497aa678",class:"check__icon",icon:"check16"})),c("span",{key:"c181ff6fa4a32f617600cf356dfa7a08d3ab1c9c"},"Incorporated dropdown-menu for individual item selection")),c("li",{key:"b556d832b146892c24114de717eeeb8125aeefd3"},c("span",{key:"fbe2c4784a2824fb30d2950e19623d954826b949"},c("ifx-icon",{key:"8e330e55cbb49d8129db3cf6457c9ab34e577f08",class:"check__icon",icon:"check16"})),c("span",{key:"fd5ba17aa83a7d0473dc7e2dfd602482abff02eb"},"React, Vue and Angular wrapper integration")))),c("td",{key:"a6a408d7ae956c0ec4e6896bd674ec9add583531"})),c("tr",{key:"6f690cde04af8a16a630ceb38f4b235b58edf1cd"},c("td",{key:"0ab24a91d163946972931ae8da379e7369e18883",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"0de79a23c2413427839034df5d5083bcc487c92c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-content-switcher--development",size:"s",variant:"bold"},"Content Switcher")),c("td",{key:"7c357ee169ff30b0ad3852d700380a8fad04f71e"},c("ul",{key:"f68fcd8e4a723c14f57dc5f686d3d83674640b76"},c("li",{key:"a5e1518e58cb854ac174564d2edad70d6d10a01e"},c("span",{key:"32574a2926634a09f7844b9208b4e9ee4a6f0c2e"},c("ifx-icon",{key:"3d78acf86e199c93e5b41c748c9eea2b3552cba1",class:"check__icon",icon:"check16"})),c("span",{key:"d8f37d0b65a0c7c0a645d9ce85e55b76020c8df8"},"Provides a flexible and intuitive interface for dynamically switching between different content sections or views within a web application")),c("li",{key:"6b6c922c56f0df18cc0191bc9c59d602471c8678"},c("span",{key:"3deb5b14fbeefab2d22073f1578fcbd4ff0db8d8"},c("ifx-icon",{key:"72c1f362859323fdb435991064788406781c72cf",class:"check__icon",icon:"check16"})),c("span",{key:"cb47fc19873d692ee5f0037a243480fc28530387"},"Offers a customizable mechanism for users to toggle and display diverse content panels, facilitating seamless navigation and interaction with varying information or functional contexts")),c("li",{key:"1570349199398ece57abf959b1327a120056b088"},c("span",{key:"e64eb40587964e83a692571f35522216ecd72aab"},c("ifx-icon",{key:"484d9cdb7ef909f8d33dddfcb50080bb9dd35ae8",class:"check__icon",icon:"check16"})),c("span",{key:"304d2a51f2e76f4766d7c88cc118a72fe5944f9d"},"Adheres to web standards")))),c("td",{key:"4e854776456a344612f4d03d58227eca08238a53"}),c("td",{key:"50ff00462f7f6e83677b99e25cb4924d619689eb"})),c("tr",{key:"d55d511156bebf0450f70baa817c47dab341fcc8"},c("td",{key:"320533190546bef9a35d3dd26ef3a637432b6031",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"ec061fe5caa708d270d0ae0e9c79116ca006b186",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-chip--development",size:"s",variant:"bold"},"Date Picker")),c("td",{key:"720e3fb98fef36ba1cbdbaf318bada7e07ac7112"},c("ul",{key:"5183dd2401625e3de49e58bbbe522fca252f1015"},c("li",{key:"3ae99fd1a2106f7c95086db4fffb9e7eca9462ae"},c("span",{key:"27713cca06caf7ce53e557a84837b04bd1c9a8e1"},c("ifx-icon",{key:"1f6d4c8ce810a107612ad40dcbc2a9854a3b633a",class:"check__icon",icon:"check16"})),c("span",{key:"9cc4906b8a4d6ec7ea996a069d1479d2dc3c4168"},"Provides a customized wrapper and theming for the standard date picker element, enhancing its appearance and user interaction")),c("li",{key:"88176710f3c3198bc4e1e8c443d82f50db18adaf"},c("span",{key:"059d70c9d0cf4b5f37dc2cac0b27f4ee0ad78e5b"},c("ifx-icon",{key:"27f2e98cb7f0e2c995475a5176a2706599810cff",class:"check__icon",icon:"check16"})),c("span",{key:"d0cc595979c23ecd5e29e75e636a96ae71a74b9a"},"Cross browser compatibility")),c("li",{key:"50a04bf08aeca9f9100ad1ef8a9aed825ff8c3c1"},c("span",{key:"04d335c257fb8293f7b4045c6211cc1dcd4867d5"},c("ifx-icon",{key:"4c4d136fd7836b15237782e8549d121fc57f6eae",class:"check__icon",icon:"check16"})),c("span",{key:"c7a8398867c7c9e3e3fb98f4cdb4fcabb923cd13"},"Form integration")),c("li",{key:"3da0f2225b4644d504eb0fb79fca1715431a5d57"},c("span",{key:"d89b575416e4b7379f20b2a00843222253b8bca3"},c("ifx-icon",{key:"eea805a3ef86b8b5b86256e09faffd78e450bd70",class:"check__icon",icon:"check16"})),c("span",{key:"06f9d36e04ca350b827fb0cfd69ad3414761e9d5"},"Adheres to web standards")))),c("td",{key:"22197d4182c47f803e3d31a94115682da37ebc4e"},c("ul",{key:"b23e570499f4dde790f5c5835bf884aae6dcca75"},c("li",{key:"9b87a29084f511762c4db61393017831d4e1f520"},c("span",{key:"f771ed91134e47a354cb55c432ea4dd40131d23f"},c("ifx-icon",{key:"694f58fba754ffc0d671a94e6fa29f2dc5d64fc5",class:"check__icon",icon:"check16"})),c("span",{key:"0f57444f5995180653d96a9b5a130f30abbd4d65"},"Range")),c("li",{key:"0fd5ea3b976b775a8c939d90ae0f92d89e53614c"},c("span",{key:"a11db987adaefbaf32a5aa27517d9ab14b3beef5"},c("ifx-icon",{key:"5a0891100009915692a6517a180da16d3e90916b",class:"check__icon",icon:"check16"})),c("span",{key:"22293825bf33eeb58142454cb52bddf0dd8f7785"},"Default value")))),c("td",{key:"35c7273db695539617994cebd65a5cffec72b5da"},c("ul",{key:"15c685f52c2e296eea27bd19c2d3c7b4c816a678"},c("li",{key:"52f4e1a67e0e6454c1f016f09f8bb2324f716dc6"},c("span",{key:"0d3df621c3227c3e417da67a49ed37e7b8b9b4b1"},c("ifx-icon",{key:"8091dfd641477beaf1ac1e655bcc86e0a5e5f0e5",class:"check__icon",icon:"check16"})),c("span",{key:"256dcdd91ea36d5e2550196e8bceadd8a31edf8f"},"Datetime-local type incorporated"))))),c("tr",{key:"22de18d3f8b3c2cdc7dcbdf428e82309549889f3"},c("td",{key:"9e5157d6f5ec74cae30f3025a5efbf7528628470",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"290b364f5951fb8b8a7d901dea4c38c7c6f1974b",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-dropdown--development",size:"s",variant:"bold"},"Dropdown")),c("td",{key:"1b6169dc5a62521483d6eca1e577399b6bdaee9d"},c("ul",{key:"1af732ad4c4090ecfbfd18398f16987e0b284708"},c("li",{key:"df98a8b50a0de134ed8a27ef852a31c65769dd73"},c("span",{key:"cd3a3dfb4937f219ec8b05e7b427a8339fa43c2d"},c("ifx-icon",{key:"b789cf2ff4c278475e6fb2fe4399b3c8d5dad5fa",class:"check__icon",icon:"check16"})),c("span",{key:"390e9cbe658c8536d89a44c8e448e310f87bf919"},"Offers a versatile and interactive user interface element for presenting a list of options or actions")),c("li",{key:"2f196f4a736f15126e695e90bb2d4a06e825e9da"},c("span",{key:"d5a488b83fed415a75adcf2b51dff76e2d7fd2df"},c("ifx-icon",{key:"714ca7f99136c39bbdd68ebb1f360e7444b2c601",class:"check__icon",icon:"check16"})),c("span",{key:"878cab9c65eca56cea90436b9b1a6fdc16dc86f2"},"Ensures consistent behavior and compatibility with web standards for a reliable user experience, while intentionally limiting customization options to emphasize a standardized appearance and behavior")))),c("td",{key:"b7cb7fc6936aaaa98982691bc1ef4a0f37236179"},c("ul",{key:"c594188d76488c7cc5b6cb7e306f6cbf801b2cd8"},c("li",{key:"263d97b82516a07d30f2fa0e4fe7113b768fb1e9"},c("span",{key:"8c817ff9821effbf13933b0a46bcc600b087f477"},c("ifx-icon",{key:"986f3a4921f488ad1515e74a1a112d68cf1eaf6f",class:"check__icon",icon:"check16"})),c("span",{key:"44a8de4ed86d5cc4d37b43ba2a79420650db0e9e"},"Search filter")),c("li",{key:"5461de2b0c2334be56b6ccb9d5d96580eb02fb49"},c("span",{key:"7926e4fbc6eb0203c391c3479a9d7ee93cbf80e7"},c("ifx-icon",{key:"406d9a3c53f279164a7261481dfd91a3268fcbc4",class:"check__icon",icon:"check16"})),c("span",{key:"cfa465b54a158657cf912a8063c8824b0fc8e686"},"Header section")),c("li",{key:"5bb2959a756fcd49a28b56828e88ededed3925f2"},c("span",{key:"ed022d5013591a5d69ab9ddcfa9ada61764a0901"},c("ifx-icon",{key:"2b5a96a9ea1152ec7c157a6a47625c3b1358ddd2",class:"check__icon",icon:"check16"})),c("span",{key:"cd073ef6b5aa9396cc02b7cc7371a652429147c3"},"Menu Item Divider")),c("li",{key:"5248112c32382e624e99606a615aecccfa8f925e"},c("span",{key:"6a6e57bbc70c82119180bc8a5800848305ea1f0b"},c("ifx-icon",{key:"52543afcf115261ddae94165eb510818b7eca32f",class:"check__icon",icon:"check16"})),c("span",{key:"eebb6b4e2c3b63f64dd9d6255269009325af7ddf"},"Icon incorporated")),c("li",{key:"65e42f2caf56a83a4d2b284bd3ceb95602d853c0"},c("span",{key:"df32c8163ec03d406b74db71fa642586337e3716"},c("ifx-icon",{key:"cef0148c5c34f8f5b8abda9589c56b1188d64d74",class:"check__icon",icon:"check16"})),c("span",{key:"126303fb357073947e24523bb767f15b180d2792"},"Extended customization and configurations")),c("li",{key:"545abad60e0d2be8b3fe5528d7b2ec0271637325"},c("span",{key:"d69ce55ac0f71bd63979e2d7d5c7627ff664f505"},c("ifx-icon",{key:"322b787c73ed4d204ad1edc3858c8f326849f254",class:"check__icon",icon:"check16"})),c("span",{key:"ac094c5d48ad30e7d4cdb3c7cc8da658c7425016"},"Separate label trigger")),c("li",{key:"3736b9e26acb6fa9254862561932bd1ad1961f92"},c("span",{key:"fe37db32c32d8418d49bb1e2da8db5231b7ce4da"},c("ifx-icon",{key:"2c21621e37f6fc4b23eb8326c52751e52717463a",class:"check__icon",icon:"check16"})),c("span",{key:"17e0c387ba631927fbbca7abaa2e76defeb754f9"},"React, Vue and Angular wrapper integration")))),c("td",{key:"82e5cbd256e7bd2e78527136fec87d9e2c457c87"})),c("tr",{key:"b7d15dcc67ced094bf4b224bfb1e79d0795b38fe"},c("td",{key:"43352a33da15dfbf2e2a5bc617ec6feba71b7eba",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"71a2e1c2a1e43ea04995e3718ed8235f029ae37c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-file-upload--development",size:"s",variant:"bold"},"File Upload")),c("td",{key:"6c0fda06c70a5856234fb5aa9538fdaef27c9da8"},c("ul",{key:"997c097e8716e2dd1c3f9bf475736e4bca3d5b61"},c("li",{key:"a1c7ed63dc1269b16d71623cd6ccc153a3f0ce4d"},c("span",{key:"9f943d8f493a9ed1de4b8e4bf360fdfadd5c5555"},c("ifx-icon",{key:"18a64a8956b191f5aa1429e341f2479d899358d6",class:"check__icon",icon:"check16"})),c("span",{key:"0ced4f68cfdaa9d31062813c6fea9f3f4414a073"},"Provides a clear and interactive interface for users to transfer files from their devices to a web application")),c("li",{key:"f6a3f3461b180f6e930d07132e55ad6478ef82ca"},c("span",{key:"6c3c381d60fd73fdffa8c3b6799cf350c33a1059"},c("ifx-icon",{key:"5d0e7f755468f2d640b8bbe8eebb1519671e065b",class:"check__icon",icon:"check16"})),c("span",{key:"babbc4d5117cf7811b2a8de13627fb14dd0aa87b"},"Supports manual file selection and drag-drop interactions")),c("li",{key:"f9c4650f76103a78deee5cf2f09bd4a5ba5ec62a"},c("span",{key:"c352323f00ed6e078069331c14cc22c90620cbd1"},c("ifx-icon",{key:"f25c3d92924d4ccecd903e0d138c4ff9c15da149",class:"check__icon",icon:"check16"})),c("span",{key:"4ba2353522744ade3dbc55bef4adf6be3fe228a5"},"Offers real-time feedback on upload progress and status, file type validation, and customizable upload buttons")),c("li",{key:"68b940846e016bdaee027d79268d6a2cd7a73b5f"},c("span",{key:"6a4af83ffabb6a7a0fbaef27935759e94b1ea48f"},c("ifx-icon",{key:"f39bb77fa611adcc5ae1882c929513792d38ebf2",class:"check__icon",icon:"check16"})),c("span",{key:"9aecb2b4b603acc22c3f909ab0b6d0659a75829f"},"React, Vue and Angular wrapper integration")),c("li",{key:"0ddd11f3338885266e537cfe6c646110219fc841"},c("span",{key:"995830ea40f859cc8454ba447bf0e59e7bf0868c"},c("ifx-icon",{key:"19fb94be9b59c50d0dfc42fd8f6cdda573ead643",class:"check__icon",icon:"check16"})),c("span",{key:"638b86e8057000b2bfb23a3de2edf1667890b78d"},"Adheres to web standards")))),c("td",{key:"cb43208e12a4705d9c8301b8c291f71cae2a33da"}),c("td",{key:"3492e180151b1ca0c9b1d297033a46d7f1c47493"})),c("tr",{key:"a9117c80fb06c8a14016f4eb31a05934625795cf"},c("td",{key:"d12759729b1f4ee616fd544e5f01d8dfbee64c19",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8a2f2cfca60f7690573b30b59de1b535afec9744",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-footer--development",size:"s",variant:"bold"},"Footer")),c("td",{key:"db5e086efddfd11184725e00c14a99980a6016d7"},c("ul",{key:"8d881060a7082c7e91de56b3e2ba745a125d2594"},c("li",{key:"e2328413b53402e0e68555735b3b3381e6d9a4a6"},c("span",{key:"d7a596899ef015e18726d13e06901ec91eccc7a7"},c("ifx-icon",{key:"09c3e0802727d63ff831901f0a38054cca5971e9",class:"check__icon",icon:"check16"})),c("span",{key:"910c04b79a5081e0b373e31cceeb32a75b7a9529"},"Provides a standardized and customizable way to display essential information, navigation links, and branding at the bottom of web pages or application interfaces")),c("li",{key:"48bf70cc2bb5ceebfdbca2d1ded2ab1ce2c58b7a"},c("span",{key:"a7aaa8f1b4dc06dc360366cd1ccdf132a8221085"},c("ifx-icon",{key:"3e240484438f8775beaf402e6d3e200c71da8819",class:"check__icon",icon:"check16"})),c("span",{key:"96e6fa81b9b72eda2243f84e00413d96a3474fdf"},"Offers a flexible and configurable layout for organizing copyright notices, contact details, sitemap links, and other pertinent information")),c("li",{key:"7a6ecb3fca436de14ce06a177f068ba7396e6e5c"},c("span",{key:"667c42421ea5d344f315e79a7c4ea3eb22069a46"},c("ifx-icon",{key:"0c383cfa05399719ab16c278033e7189e2c5a4b3",class:"check__icon",icon:"check16"})),c("span",{key:"66e9e47d408d7f8e1c54b388dbbc1c6fd57f6847"},"Adheres to web standards")))),c("td",{key:"d4566087dcc4c8998abd5fae22153a6597c16157"},c("ul",{key:"79ec88c5c0ae702791bf68f9772247121c88b928"},c("li",{key:"573b83ba2efe0db68f80a964ff848a4918dfc7a8"},c("span",{key:"73d311799d309203d07039454a96fe516d83ffd4"},c("ifx-icon",{key:"9cf3aacccc151133f85288ea3dd01054b5f62551",class:"check__icon",icon:"check16"})),c("span",{key:"f2e23d8dc679d95981fbc7b25ea797a99ffdeb99"},"Small, Medium and Large variants")),c("li",{key:"26b26b234fb6da6f55d5baf2c217e3a454cbd95a"},c("span",{key:"7a434f3455644dc4c24f81899bdcdaf863477b7c"},c("ifx-icon",{key:"a1044e6b3ab414c41fedb4d31c7eef37a0cc3d8c",class:"check__icon",icon:"check16"})),c("span",{key:"6d7f6fc7b97f2b6fd44d958f95828622f508a3cd"},"React, Vue and Angular wrapper integration")))),c("td",{key:"b8ddd0fb4f6fef78100606c2c14192afdae34aad"},c("ul",{key:"0f473ef40355216bf54bd2e6de9eb0abd2a918a9"},c("li",{key:"61707fe02675a4389d143210891431a94b4e7101"},c("span",{key:"88322fff8e3f9f23806f4c0300519620305cda11"},c("ifx-icon",{key:"24b25e23565a4f7718b569e6f6e50b745d60700b",class:"check__icon",icon:"check16"})),c("span",{key:"7b8b6c6760899d9a6b4e1f63f7820fc784ac9578"},"Customizable and removable links"))))),c("tr",{key:"d2e4a06afd05cab92310c7c92691f5c1f1c0d708"},c("td",{key:"c6b805c3090ed32422af36592e1b01cd852f9d4d",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"1ff8ed3e2f0d14d9bf358ba4fc6f96b7a48b5b86",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-icon-button--development",size:"s",variant:"bold"},"Icon Button")),c("td",{key:"5b5a0438c51ff928818785850c6542131625bdbc"},c("ul",{key:"e5c4c5698ecb2a09168024e717d1a22ae20a1702"},c("li",{key:"f4a1e51d5f21f2182ef5a1e2d4256357dcf6430b"},c("span",{key:"1a8f570db9cbaf2c74dd5849eb580210a2f97231"},c("ifx-icon",{key:"0c57be46b8cda31db1eb4b77a444c4e94570cba0",class:"check__icon",icon:"check16"})),c("span",{key:"d8e9e47e22109fe2cd6fd5ebb34ba99836e61a99"},"Offers a compact and interactive icon-based button element")),c("li",{key:"3f0886a551450e0b34a4475648ac4012d224034d"},c("span",{key:"912e1890833069236a1ede16a587a1ae254e5ab7"},c("ifx-icon",{key:"46fd18a5ff04ac82695d65d5ba8096b266d5ff6f",class:"check__icon",icon:"check16"})),c("span",{key:"fcad68c6c9394faf7c7d9d2bfaa6a783c1e191e6"},"Provides a limited scope of customization")),c("li",{key:"b22ab9470e3ed7aa6bc109ca0f98d13ce4cc646a"},c("span",{key:"ee0b9dc6175724f5077de657d3e839be3f14d6fb"},c("ifx-icon",{key:"520cc769a6da3b848b54bc6bdad0e94c74e95228",class:"check__icon",icon:"check16"})),c("span",{key:"bc694c6de51237ab97e579d35fa6c8310cb19736"},"Adheres to web standards")))),c("td",{key:"9c3d44aed163c7b7df2be097648d5f017abdd108"},c("ul",{key:"435a01b38396aeca41130c58868afa3df0b131b4"},c("li",{key:"43a79e8d7e99603ef0fea3a4c6262a62e03efda3"},c("span",{key:"2eefb405378eca738f394ea33d17ee67bec89518"},c("ifx-icon",{key:"7ebf5b336da3449e045abade04a7234585327447",class:"check__icon",icon:"check16"})),c("span",{key:"86d428a35635f529b9c56c192eb1ad68999e1a76"},"Additional Round and Square shape variants")),c("li",{key:"e996e8823103d3bdc7b316ec6fe0f7362baa9f76"},c("span",{key:"f9dbf60336cef60d043c0084b5b6f3acf4b9a8d1"},c("ifx-icon",{key:"4b6dcc074dc01e0e48654279b35013ceef2d8688",class:"check__icon",icon:"check16"})),c("span",{key:"7eea53f2c792342f520ed6e31c02c010a82768a6"},"Small, Medium and Large size")),c("li",{key:"adcae07d39be7067b12dd51ad95e1c04bba5da6a"},c("span",{key:"4541e4f9d98f09f6bed1f03071f9486318c59aa9"},c("ifx-icon",{key:"72ce89a9c90890dc7e209d1bf069673d6a337347",class:"check__icon",icon:"check16"})),c("span",{key:"b56a1983f57df7b0ef313d370de9e906e22743d1"},"React, Vue and Angular wrapper integration")))),c("td",{key:"5104b2890352f5641e06011c0e3eaa9575e55531"})),c("tr",{key:"26d23f24cde36f1f8d7154403e7c742cbb1f57f5"},c("td",{key:"124a697e512e85e281f924db3667ff8ba7df50b2",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"67d0957fd7116a8aeb572a24a13fe46941998abf",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-icon--development",size:"s",variant:"bold"},"Icon")),c("td",{key:"0ace99b93b727532609a7dbc684137a82fcac824"},c("ul",{key:"a8374859ce3cf74f1ef22a0364e064c052dff7f5"},c("li",{key:"e36bdeb37ab6b6d555743a5743cbc95caa5ee494"},c("span",{key:"108aa8f1079ac38f5ec9bc89ff620275a9912e4b"},c("ifx-icon",{key:"b1c765000b237e22a57ebe6481c5367fa4f13fb4",class:"check__icon",icon:"check16"})),c("span",{key:"c1aafa11733f64a976fc311c6687c7f83ee78be2"},"Offers a wide range of iconography options, allowing developers to easily incorporate symbols, glyphs, or visual indicators to enhance the user interface and convey information or actions effectively")))),c("td",{key:"db36e547306cdfc8b85340e7ff09ec4ae204859d"},c("ul",{key:"b6e3fd6ced75406adc45d052c7c37dfbb7b7b33d"},c("li",{key:"e563d0390f9fdd7c4ba0ed202907a87df433ec55"},c("span",{key:"bc64df98b4f496fe49a469705b00320492c520e4"},c("ifx-icon",{key:"250fe8f90a4cfa7cd4d72fdb817b78abc40811c6",class:"check__icon",icon:"check16"})),c("span",{key:"79c5021d85aa418198b48675beeb5b4e79401eff"},"React, Vue and Angular wrapper integration")))),c("td",{key:"f1a9cc2add11eda426d121ef4db3e386a30f66d5"})),c("tr",{key:"825cb1a9978bddefb220def323104b544bbbe0a4"},c("td",{key:"a8df71ae441e8321b7f0e16fde7528428407948f",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"9000811e6b92a2414e319bd735e179ce2dc0c86c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-link--development",size:"s",variant:"bold"},"Link")),c("td",{key:"4872fb3a3a8deb0f32953d4d88a5ce071e52c87a"},c("ul",{key:"17fdf2f802801df5b4326b2bf30ca38579278a95"},c("li",{key:"6f41b9cb07ff9d275a4f425268c90f6ab72a19d7"},c("span",{key:"44fa7946edd512916a84fe5a217bd1eca652f79d"},c("ifx-icon",{key:"d251ef217d5b2ba6471bfd5881229990ed2c8639",class:"check__icon",icon:"check16"})),c("span",{key:"a5d04b9190be597880edc8ed040f7bddab440d68"},"Provides a flexible and customizable element for creating hyperlinks within a web application")),c("li",{key:"3505eac0ca54c7f769f8c06cdf5f978755815a40"},c("span",{key:"a85f63389b8de4a730a4420df4f7245e4c12f111"},c("ifx-icon",{key:"090a1ea005de34b7352347937e7f8dec68302099",class:"check__icon",icon:"check16"})),c("span",{key:"39a4daec468a0e168dade6051e797f84a6944d4f"},"Offers essential functionality for defining clickable text or elements")),c("li",{key:"7af44dd4d4422090493202a932363f73eb4b6661"},c("span",{key:"2e960bb8a521b167485fa3236cd83d00e510e7ca"},c("ifx-icon",{key:"45888cab927147af3b002475624a2e6706b3a189",class:"check__icon",icon:"check16"})),c("span",{key:"4aa85021cab27cbce7c16156336e4dcebade4ab9"},"Adheres to web standards")))),c("td",{key:"9a47574a8a7f51f5aef74a4c986724fdd72b9024"},c("ul",{key:"86d0827b448d66af268e8142117433dcb70f9f76"},c("li",{key:"05f97f3eef6dce664841409d6c2f1dc74506273a"},c("span",{key:"ad1cc064d218426ca734aed4c6a900326a3b7243"},c("ifx-icon",{key:"f1668bb51884cb34e07e640499527b2d9101bb1f",class:"check__icon",icon:"check16"})),c("span",{key:"8b8d79e664235eb63d19375790b07eb2ce6b15b2"},"Small, Medium, Large, Extra Large size variants")),c("li",{key:"1b4bba1f6a5d575a6f3e01c5894229fc63231d8f"},c("span",{key:"b6e1ce7c9998db5518132ed2faac681651e21a2d"},c("ifx-icon",{key:"c11fe4d79480a136d78158b727412aae7cec0070",class:"check__icon",icon:"check16"})),c("span",{key:"c2c6c92f39724805727b532724948bf5b030902e"},"Icon incorporated")),c("li",{key:"e57d86486fed01372ffe516d5030087e47832130"},c("span",{key:"30aca39f12619a25e403bea7ef342f9a3817d817"},c("ifx-icon",{key:"857ce3b18f8dab3f49e465c1f90c635a82d49e4b",class:"check__icon",icon:"check16"})),c("span",{key:"6713142d00b3f0b2e7277b036d3a85e0059a7b8f"},"React, Vue and Angular wrapper integration")))),c("td",{key:"bc2ea4278197e1a49b33c2bb4a41225f432d15ca"},c("ul",{key:"953b26bbc6f79b911d38705a843347b8c222a21f"},c("li",{key:"0af788fcdcc1e9d7d6d1851aa1e41e39da0b1700"},c("span",{key:"8cdd54f1edea62ae42a3b48eb7d6caaa959e4531"},c("ifx-icon",{key:"b274ea24c6ed9b9536f0f8e2f4326c288c363d4f",class:"check__icon",icon:"check16"})),c("span",{key:"d00a32ec32993948a3266a532277208d2c8b5acb"},"Bold, Underlined, Title, Menu state variants"))))),c("tr",{key:"742e2170c8aa720f99b04d06df52d6acb9655539"},c("td",{key:"bf1adad854d1ee2b113f1feff2ab3f28d64b12b2",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"63c4b186e9bf47ee0f7f5219ebe86e3685c16e81",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-modal--development",size:"s",variant:"bold"},"Modal")),c("td",{key:"a354ab18a249f89e98642d20cd94884be9fb9d37"},c("ul",{key:"9adfaeb267a0d81595673c1ce7125b4d417af06f"},c("li",{key:"6ec42d165fc12922dc48ed573ac1b16b42ffd008"},c("span",{key:"87f27df53fc6a4178d54a30ce2054947ac29df21"},c("ifx-icon",{key:"52c2d280949bf9cb8f422726c7cebe6c0b6b72da",class:"check__icon",icon:"check16"})),c("span",{key:"9608ad2129de4813b5324d9e1dd2ccd67e50bd12"},"Provides a customizable modal window, typically used for displaying contextual information, user interactions, or additional content without navigating away from the current context")),c("li",{key:"58bf1c1c8b72d870c74304cbddae7cc57bef4eff"},c("span",{key:"02f7f6b848485532ee5b7dfba02d52fb8df7f8a1"},c("ifx-icon",{key:"b792ea8ae459b2cdc9ffba78712f09f1cb3b026f",class:"check__icon",icon:"check16"})),c("span",{key:"e4b209b0947ec2958b9b5f838d9f4c9e97d6c2c8"},"Adheres to webstandards")))),c("td",{key:"d7ad8707a309dba8e82d13db8ae6310c4a920e35"},c("ul",{key:"3415000e378191996fe1cdc80522e15d7eee9adf"},c("li",{key:"b2cbbf8a50f5a96faf93d72045e91d1cc16d05d1"},c("span",{key:"77e0709cd4dd363bde1aa261e74e196de0c61716"},c("ifx-icon",{key:"37cd240298858df5669904e7393026b767c9d46a",class:"check__icon",icon:"check16"})),c("span",{key:"ca262b2b5ddcf046d9e0ba346ec5bea61a9e53e5"},"Alert-brand and Alert-danger theme variants")),c("li",{key:"2bd8f08e287f93c43c4284c022856ad6054d313d"},c("span",{key:"f6b5aa29fdf8112f423042be24eec295ed507ec6"},c("ifx-icon",{key:"736eb0e9f2dc2f0cea565269bb3dd599c5daa3c9",class:"check__icon",icon:"check16"})),c("span",{key:"8b4347bc639a0fc92e6f42a1489737cf4ec96c64"},"Extended customization")),c("li",{key:"9fbe7d8a5c0b60819fdc010dee391f5cfe99c74d"},c("span",{key:"4acf5092bba3309133d9b86f2163130b5b73aef8"},c("ifx-icon",{key:"9c32db5eb1405c69128a7876d161d8e6f5cc447a",class:"check__icon",icon:"check16"})),c("span",{key:"eba5122e60d437a78345337b5e71269abfbc8be2"},"React, Vue and Angular wrapper integration")))),c("td",{key:"723e6b9b6ff642e17d3a7ae76f708037f6c53c8c"},c("ul",{key:"684281a49c5377292ebdda96b3893e5d454c5d07"},c("li",{key:"24836636baded9cf6cc8c6d6c05931fd38dee854"},c("span",{key:"4e89a0cf71ee2fc8a99090d35e63bb4b90c27123"},c("ifx-icon",{key:"b50fe423f04f732cc9f08847deb2d3c6599a516e",class:"check__icon",icon:"check16"})),c("span",{key:"f27b7b77e59897a7005dcbfbb9c6b27594549ffc"},"Removable close button"))))),c("tr",{key:"e612d8f4c340d3982798e290831882f2a4816dbc"},c("td",{key:"e525e2b49dbd5c97c9a5ff6ee7ea1059c893b2db",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"867dafe8958869780ba7a5321ed01780da81f448",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-navigation-navbar--development",size:"s",variant:"bold"},"Navbar")),c("td",{key:"47565654bff1be1e0e5a437fa0aa1636e69eac31"},c("ul",{key:"07e2fd28ff4b794d99f6b61da82ff0a5e66c554b"},c("li",{key:"e06c78422c5be69d155132624f723e74226f9cb3"},c("span",{key:"e8c2e25f92c70fa080a826dfe022aa553673a1c6"},c("ifx-icon",{key:"1e93e23bf8f41f6b9449d777571d32aa575245ac",class:"check__icon",icon:"check16"})),c("span",{key:"7984a3a78cf49f673f3de268fb4fb4fe432ce704"},"Provides a standardized and customizable navigation bar for organizing and presenting essential links, menus, branding, and interactive elements within a web application")),c("li",{key:"33ba5c8d5627fe1fe9a0c0e995601d79c4ed2151"},c("span",{key:"f905f71cf5b9ad8fcdbb9ed9a24bcceb53789a5b"},c("ifx-icon",{key:"1d9255fdf1f8dde097688530043e4ebbf34a3e25",class:"check__icon",icon:"check16"})),c("span",{key:"50b68453ee5ce72b8651ec068c81831eb67a29d1"},"Adheres to web stadards")))),c("td",{key:"d8eb79f336209d8019073bb3f57002c5f18d6dcc"},c("ul",{key:"ac34f52893ff92ffad9b98afee4a45f26d02f20d"},c("li",{key:"ed10adce89046bfdffb9b0ea628a536e20fb2322"},c("span",{key:"790dc07234ccf01d60f6dfc2229ba7e1bd1549eb"},c("ifx-icon",{key:"614f34f57394f58d3a2fd0a30a7259a216c091a4",class:"check__icon",icon:"check16"})),c("span",{key:"41e4722db6e38bf426a6dad138b62590bb6f69d2"},"Navbar-profile component")),c("li",{key:"c9cac7ff18bbe583417f84e9f999a3c31586fdff"},c("span",{key:"18c46950f1b1979331d6360793c9f9759271c4a1"},c("ifx-icon",{key:"5c3420fa7fb5dc6d61b293427c716649c8a2c605",class:"check__icon",icon:"check16"})),c("span",{key:"988c7745f9993a597c75be9eb166656f72a7578a"},"Mobile Responsiveness")),c("li",{key:"889e09e7ff66f2887303f738e030fb6f15283230"},c("span",{key:"e53a8268ca03c3229e5f72ce3f3020b2c5f46e3f"},c("ifx-icon",{key:"7355be5751411999f39b687f8ca0966ba7ee09c9",class:"check__icon",icon:"check16"})),c("span",{key:"447f9c0606728a26ae3406798e636423fadfc16f"},"Mobile Sidebar")),c("li",{key:"bca5c7fd05be1d605f8608994bfce549d7559115"},c("span",{key:"f064b41518a60b17128a2aba8a5c213f3fcbab73"},c("ifx-icon",{key:"87210fe54a54cde4475aeb1eb17c14bfe8dbfb24",class:"check__icon",icon:"check16"})),c("span",{key:"3921667a6e95849adf843089729cb7653850a4dd"},"Extended customization")),c("li",{key:"cf09122e80170448485edb58e0c1584bd455207a"},c("span",{key:"23cc50e7510127254f09c982945f8369b3064b6c"},c("ifx-icon",{key:"e84756bba89c44903893bce9afcbd220fa63d805",class:"check__icon",icon:"check16"})),c("span",{key:"e67ecbd56febda0dac1b6d4f27c1954864ea3030"},"React, Vue and Angular wrapper integration")))),c("td",{key:"3334909526a1521e47db0c6064fa9f9e36171308"})),c("tr",{key:"a93c6a3eed28c839589d4cd13908ac6b6e2092e3"},c("td",{key:"caad29572df7a9abefeb669ce43063458a05c92e",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"1faa0cbd8b0363ad8baacf88fa827ac5632ec9f3",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-indicator--development",size:"s",variant:"bold"},"Indicator")),c("td",{key:"f1e3682d5cb49d5d8f21f5ec86506bfce1642cd3"},c("ul",{key:"92d2d20facaecaeacfde641330c85522f39a0353"},c("li",{key:"7fc54dbc62c18f3e697c82d727d82d9916a58a2b"},c("span",{key:"af10278073d539f7982f594bb39b5b49978de9cc"},c("ifx-icon",{key:"19e451ffd3a217c26774f78402ac887a2b9208d6",class:"check__icon",icon:"check16"})),c("span",{key:"0bae43b6ba222f71e5fcc206bdedb176ef08a602"},"Provides a compact and configurable display for showcasing numeric data or dot indicator")),c("li",{key:"52384211a0e9b43a444177b0c757bf75da2ded26"},c("span",{key:"153bbdaf7f5953314a2310fc4285f0776b9665f8"},c("ifx-icon",{key:"0fa75386cbef8a7388ddb5c338c9584b907ff01f",class:"check__icon",icon:"check16"})),c("span",{key:"f1dfa84bc2aa7e76282abd9d5e4f405c22380b7c"},"Adheres to web standards")))),c("td",{key:"14a9da410651c0ee2459f1f6c7c5895d7b2950c1"},c("ul",{key:"289d3310917dde0cfd722b0dba4e3c2d72da697a"},c("li",{key:"84ad1950b6ef50fa1f47868af6bdbc44417fbd9d"},c("span",{key:"10f40ed10c6c7d1621d99b3a332eb8321d932476"},c("ifx-icon",{key:"3ad039ad2f674fa9a4649f56a6e42ff0ea7e9159",class:"check__icon",icon:"check16"})),c("span",{key:"db185bac28ab1898826fd1320d7d05f20c549281"},"Inverted option")),c("li",{key:"ac58a2e66eac039cfbc19741108a2828376cad54"},c("span",{key:"3c17b0b2bcfefed28fb84c79f3ba30089e928699"},c("ifx-icon",{key:"401d56bb69b9f0bf6486b593a171d35fa323ff0f",class:"check__icon",icon:"check16"})),c("span",{key:"a83aede0b89db58c536e75f8f085317088524b54"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c15cdf058a50f17195ebffb5a4f872ec98592230"})),c("tr",{key:"16fc8390d705348a08f028a8c33bde0ccbcc1572"},c("td",{key:"bbeb1fe205683e46ffffab48c291f0f560ba57da",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"13100d080cf8383c4427ba3e678437a940a7af32",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-notification--development",size:"s",variant:"bold"},"Notification")),c("td",{key:"08f4bb670054a187e35e54833b04031f6bd49fcf"},c("ul",{key:"ca1de3027d3b935bd9d91ee2e87bd1ab86d599db"},c("li",{key:"3965644bf624e78f139e4f2f7da11901345cc89d"},c("span",{key:"7e4566ec8b95662d764b6c88c2642febb86c7f19"},c("ifx-icon",{key:"76c84a26b2f28155ba77081cf92b750934bd854e",class:"check__icon",icon:"check16"})),c("span",{key:"9df0ae036b06aaec26251f0d8a14fec4bf34dc66"},"Offers a flexible and visually distinct container for presenting informative, warning, or error messages to users, enhancing the overall user experience with timely and relevant feedback")),c("li",{key:"c304e8ddcb487ec66a8e028eedaf8fe55fc78769"},c("span",{key:"bbdb37c6503cf529fa56babf49b9bb0912d245e2"},c("ifx-icon",{key:"f4b3d8385027e634e9ce343a11f47090d05ad5f8",class:"check__icon",icon:"check16"})),c("span",{key:"df19a03d53110191fd9f00304c3cfc9c11e023a6"},"Adheres to web standards")))),c("td",{key:"5675fadc9be00abae87f4726740e05074d1c9302"}),c("td",{key:"aaf7b6fef2b915f8dd7c9d2e6799da525880ca16"})),c("tr",{key:"3aaaee1d34601f3bf63525af727333985fbc2a4a"},c("td",{key:"9d6f014d593d41293fada3208c775f5a746d71dd",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"098d7b916dff3e72749a21dfebcbb9188e6584ab",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-pagination--development",size:"s",variant:"bold"},"Pagination")),c("td",{key:"174cf4cccb8023ce12244ed19fb634451c156455"},c("ul",{key:"f3633036ce29846198081d27d7810b87926e85c9"},c("li",{key:"d9ceb0098903745bb551b7e6813c546d8d9a9a71"},c("span",{key:"faf30a974b40781d92ec0ceea113e7b24434a019"},c("ifx-icon",{key:"df0e821230bf00a916da747cac4cba5d16c66759",class:"check__icon",icon:"check16"})),c("span",{key:"12fec05bacc5798ecdbc55df13e1e68f02010819"},"Offers a configurable set of controls for navigating through sequential pages of content, typically used for displaying large datasets or segmented information")),c("li",{key:"cebc7bcea4b54f327c78d017a7188450cf669b54"},c("span",{key:"28e5cbbe19a90b7c68d3e46b202685784d61ea31"},c("ifx-icon",{key:"397c419c49d2531729380ccdfeb0029ed51900f0",class:"check__icon",icon:"check16"})),c("span",{key:"50d9a125645796d3337469375486a16f4fda0c2d"},"Adheres to web standards")))),c("td",{key:"9497ff214fc68d4bf416bc9abe25792a5b5fef33"},c("ul",{key:"6671c22c069f9a5be6580ae1e826be774d35a6b5"},c("li",{key:"42d436c2eb04aa11c61367a3120a6db242415c09"},c("span",{key:"78fae521c0afc410c15a226d6fc1e32518909e22"},c("ifx-icon",{key:"c2b1b024eb18606d77458130b060579423fed2b2",class:"check__icon",icon:"check16"})),c("span",{key:"41ee10078b768a2d8955c78ae9fca1c6be31ecb2"},"Extended customization")),c("li",{key:"516c63b3560769d8ee66f668df34f78afae194a6"},c("span",{key:"c605d03a59a50ad7302fcc7029f75762089ef026"},c("ifx-icon",{key:"b9d30e127a5191a5d869d3572bc3e6a335160588",class:"check__icon",icon:"check16"})),c("span",{key:"5beba430aac041c673ba8ee417f654efcf705622"},"Configurable Results Per Page option")),c("li",{key:"ca8eaefac90a460246e86fedc6a82fdc4896d06b"},c("span",{key:"17b5951a7c9557b28176d12cd2199818e610215f"},c("ifx-icon",{key:"e651575b6f012645e1de6fbe74903bc7f507646d",class:"check__icon",icon:"check16"})),c("span",{key:"0bf93e284f00f517f1303fe2e4cec254e768f967"},"React, Vue and Angular wrapper integration")))),c("td",{key:"d4b6504ea06dcb1e677bf72117677e43e74f2a4f"})),c("tr",{key:"e7674da5f9ab5876b54e015486d33c3069f6ef0e"},c("td",{key:"c5ab89e5891723b4a73fe7cb424577b2b24e3169",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"d3acb34281641a37bf5aefb5ee348673dd3b968a",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-progress-bar--development",size:"s",variant:"bold"},"Progress Bar")),c("td",{key:"39a9805c05c5e3e970ac7c98a21ff0c43b139161"},c("ul",{key:"77a97b589177d2100f4a0967a03c73d3c914f42d"},c("li",{key:"d912b141869f46bbd27b476d6ff79f417ceaacf5"},c("span",{key:"029703d7619ded624f443c44bd69e818b49e4a0b"},c("ifx-icon",{key:"185f8bc494e9de3dc2f3c884503d5be11eb7e744",class:"check__icon",icon:"check16"})),c("span",{key:"85836b665e44cded20313cd2ddcad256c49c3db0"},"Offers a customizable and dynamic bar that visually represents the advancement of a process, typically used to convey loading status, or task completion")),c("li",{key:"906f34ede92ad6badf1837e91316955d3a66bd5b"},c("span",{key:"20c3679982be16d7d78868a772acadfc19cc4fc2"},c("ifx-icon",{key:"cce2972b29962c3d000d9ee7e1a38c0490b60b14",class:"check__icon",icon:"check16"})),c("span",{key:"19da513700445a49a2f945ba9f84bbe3a077a9e6"},"Adheres to web standards")))),c("td",{key:"f66d8ffcd15840a6629e5194be747d2e6f770d3a"},c("ul",{key:"08b07cee36f5704bf907b22a2ef35f8fe9ddac90"},c("li",{key:"0fcda8d5dc12806f46f6e753e02a4a00f8672c79"},c("span",{key:"b48011965d036a1744c1010fe5cc66e0329e7f71"},c("ifx-icon",{key:"d17eb0c8bf9140b502dbe53950bea4f7167c8ee5",class:"check__icon",icon:"check16"})),c("span",{key:"a421864eaee51f9224b4b47132b983d23fd00aa0"},"Extended customization")),c("li",{key:"1c04cef50287613c507d127c643efbe401729097"},c("span",{key:"408d42c121c49960b25403543ac141efad7eabee"},c("ifx-icon",{key:"ff2df95fb12751e4e63477622127e6c1a96a7098",class:"check__icon",icon:"check16"})),c("span",{key:"bf0de0bab8c914f496939509b62c936a66b39c8f"},"Show percentage option")),c("li",{key:"f7d9f21bc794722f31034584f2c3ca487ebfc440"},c("span",{key:"abe2fb6a8b3e0160e03aaee0397bb16c5e32a443"},c("ifx-icon",{key:"683d1cc172a9ec819f19f4734613b733f645f977",class:"check__icon",icon:"check16"})),c("span",{key:"728fb453b224f8f0680ac0cb4ed66e50b66a3d85"},"Small and With Label variants included")),c("li",{key:"06d546d79de6b7237a6cb6539ef1efc4da9a26fe"},c("span",{key:"4e0372ce27c86495cad70c989c81e56930f25ed1"},c("ifx-icon",{key:"a8f0c40399d3ab85d6a381482da792052d08c8f6",class:"check__icon",icon:"check16"})),c("span",{key:"63c4215edbda1ac7c239de130d046ecbbb3a90d4"},"React, Vue and Angular wrapper integration")))),c("td",{key:"8e4046d758e0e0183f4614366147ead58d8e5c7b"})),c("tr",{key:"3dff3928ae52b404c4348a2b66119336628ddcb6"},c("td",{key:"37a79c4c483353b6c90db214bf69479befdd5275",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"91d3814085dab1b0a9fdff9e8291cc064e10aafe",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-radio-button--development",size:"s",variant:"bold"},"Radio Button")),c("td",{key:"01998ad05aa38542fe1c9c3bb5823fab565b4b64"},c("ul",{key:"46239e4910c5c071486b127717e3e05d9a40c963"},c("li",{key:"906712f315709f4adddea3cd108e16a41c126ff5"},c("span",{key:"03b8db963cd62a0c1c8de06372540f2580e42933"},c("ifx-icon",{key:"133494e2e6bd5677c3842e7314c32f15559ed111",class:"check__icon",icon:"check16"})),c("span",{key:"3f7fe238e7ba175cb7f4a2a5af8466a0fd51929e"},"Offers a customizable radio input, allowing users to make a single selection from a predefined list of options, typically used for multiple-choice selection or exclusive input")),c("li",{key:"13b29e4736d40eab4255e74a8136ac94d2b72c97"},c("span",{key:"657340fd5b910d9ceca4561d6be395d80c672642"},c("ifx-icon",{key:"2c8abfb4bbe381975b6983d58f4dbed8784d0085",class:"check__icon",icon:"check16"})),c("span",{key:"8f2a23b8802976c059d874da60a8de25a8b490a7"},"Adheres to web standards")))),c("td",{key:"3b7d8df928a06f6743fcafda80d3045b42ee77c2"},c("ul",{key:"b36d84fa1463ca5c7bea67ef9f2b7415f4bc4e7f"},c("li",{key:"ee7d13252783c26bb55223b5a4782371cedbbd3b"},c("span",{key:"795d385248f4e95afb056387103dece4dd33ff66"},c("ifx-icon",{key:"c3ab7b2f066ffe21969b0080bd206b991d483311",class:"check__icon",icon:"check16"})),c("span",{key:"8ecaf961fcda183d66b6b181ed9e5611e98cc51f"},"React, Vue and Angular wrapper integration")))),c("td",{key:"b00d7a22afe4133b17e915ea3a32c7f9f3f30747"})),c("tr",{key:"d8ecc887d6e65da2fb81b11c10985f938c278165"},c("td",{key:"cecd750bbe39f2a99bad85805b56362601f02c66",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"15da7b7baeaa1247e8b26664dd6c8a54128ffedc",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-radio-button-group--development",size:"s",variant:"bold"},"Radio Button Group")),c("td",{key:"0d5192cc385bc454ef1e44f70714d852234edf73"},c("ul",{key:"a4319f642d377715171bf218385583bf24aedb19"},c("li",{key:"ff129207c7fd755b2b0fd1566ff6003b1aef23f1"},c("span",{key:"b76fc06cea5696a52ffc0a1aa3ec611ab574f38e"},c("ifx-icon",{key:"4c786b066ce4d5dae563b71108436ce00ad27f06",class:"check__icon",icon:"check16"})),c("span",{key:"a20e49cd90197b648ed6a11c611d3ff7b80c1e5b"},"Provides a customizable interface for grouping multiple radio-button inputs")),c("li",{key:"faf287b2624dc5140077850e2550694c27bdab9f"},c("span",{key:"a03e26118c3dc3091fb4f2d84f763683d8c2e3c3"},c("ifx-icon",{key:"801ac4e9bbdae97c34673f231d62e2495c85668e",class:"check__icon",icon:"check16"})),c("span",{key:"a38fd355f73789f3b6d0c7a5c1f2076bbf7e46e9"},"Allows users to set and display group label, caption text and caption icon")),c("li",{key:"8e1fa5ab1928b092a018ece4b54b8c3f37c0a6cc"},c("span",{key:"d09ac30a367b00193996c7176b34454b87e9e6f9"},c("ifx-icon",{key:"47882149ccea60230198b1dd51bc926e5c2bcdcc",class:"check__icon",icon:"check16"})),c("span",{key:"8facb54a911fbc003784856bca45143382094528"},"Allows to display individual or group error")),c("li",{key:"8a3a306756616a1de76b232739d940fddb42371a"},c("span",{key:"7739d302ed9887840c245ee0341b87c3f86e7165"},c("ifx-icon",{key:"f69f38ac7d727a4c3ee6934a9285aec2d1826b0a",class:"check__icon",icon:"check16"})),c("span",{key:"9bbc7a6ca7344fc43ac4e9c1cadc0ae304761ffa"},"React, Vue and Angular wrapper integration")),c("li",{key:"ea51b085305efa90ca85521b8b35150e0fe6414f"},c("span",{key:"7c08f7541254c5dd702d706259d0f340b998eb99"},c("ifx-icon",{key:"a81ccc3c9b1c4116ac124a766fbd91a737afa291",class:"check__icon",icon:"check16"})),c("span",{key:"94b1477e9cf343b29ea691ac6b48a5330d86e769"},"Adheres to web standards")))),c("td",{key:"a97d5db68a18bb79d088dbb0ae40b5912f47c246"}),c("td",{key:"4fb59f3ea447bbbc5033fcf73a84f4d2274adcc9"})),c("tr",{key:"0ee05dd89b669f81c560a6be3049a6d58a9aea8e"},c("td",{key:"8361c280b87d44e2a6c2e45c7cea570276b547f0",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"47010b4f57eb1f12a3b49d236b1adbe8e530a0ff",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-search-bar--development",size:"s",variant:"bold"},"Search Bar")),c("td",{key:"dbc25580adc2d904c3bcd15b1ca6e827f98ad887"},c("ul",{key:"d94254dc85cb25737ef61b0f052fe4690d0d1c1b"},c("li",{key:"0662711f7c65119160864abf78d5909479da773c"},c("span",{key:"c03baa942f8caaaa72fe204a675c8e114a42530e"},c("ifx-icon",{key:"47b7359b619229bf1af622208ed63607b3619bde",class:"check__icon",icon:"check16"})),c("span",{key:"a07ceed65f2814c8e393e9d6f5428581c5803e3d"},"Offers a dynamic and customizable input area that allows users to input search terms and trigger search actions, typically used for querying and filtering content within the application")),c("li",{key:"a876c5cf563f584c8129355738b13c4b428d2a15"},c("span",{key:"169138a5ccfce922816659ee2ccec65de06262cd"},c("ifx-icon",{key:"e416f6eaa40ad5873e9fa591f23b747a767ad927",class:"check__icon",icon:"check16"})),c("span",{key:"3b4257976c0c53b481a970d2d7463d10532c234e"},"Adheres to web standards")))),c("td",{key:"adf0fa204b52c894e3bb5b021cf13ff4196ce294"},c("ul",{key:"67a06f91b8443bb02714c3f152789e944ee4da2e"},c("li",{key:"1c4772537aa11b9bdcf7aae0128375a476287d74"},c("span",{key:"1c1634077dd2c12425d53abbb3c943f46e138448"},c("ifx-icon",{key:"7a490e23f36771d4abaf4d64f19732a47fc4fc61",class:"check__icon",icon:"check16"})),c("span",{key:"67bd114956621a87722e26ab7ac1d04ebd8aaaa7"},"Collapsable option")),c("li",{key:"d55ab4646dd39eaabe58a6631e384b911576d402"},c("span",{key:"6b9bbb170e7ddb883578a7c7ed9cac16265a6b84"},c("ifx-icon",{key:"e2c012501124ff2d4c5bb2c6eeaacb1612bb2fc5",class:"check__icon",icon:"check16"})),c("span",{key:"43813ddb5bdd7904b0b4f294a943c1453f79426f"},"React, Vue and Angular wrapper integration")))),c("td",{key:"8c4cf80f3eb6050c080eafd457bddefa9a26e8e0"})),c("tr",{key:"ee7aaf6fe846246eef6e1661a796780f7c507b58"},c("td",{key:"3c33aeed5c2fe323038f11896a3ef202bb52cb4c",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"62b135e12f2515ca0facdc4a437c5c9bc7cb13d3",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-search-field--development",size:"s",variant:"bold"},"Search Field")),c("td",{key:"faecaaa8dd2b3bfd16cf2c18807d290b4bb6c751"},c("ul",{key:"ef7a205a66f0ddc599d92a284ea3924e2c800109"},c("li",{key:"79c157dbb4d057ad3cd6224b02a076e27df319f1"},c("span",{key:"dd9636436decbe2342e8fb400eb8a29ca77c3a36"},c("ifx-icon",{key:"39e40d587f094e08db391e3aa9bdecd97b5e5532",class:"check__icon",icon:"check16"})),c("span",{key:"94ad84286fe9fa63477969561d9927a7b9093cb6"},"Offers an interactive and adaptable input area that allows users to enter search terms and trigger search actions, facilitating efficient querying and filtering of content within the application")),c("li",{key:"af770756dd4e2b423fedda3f3547535c02745a89"},c("span",{key:"348fa57e13119e5a25791eed3199e73ea8abc20b"},c("ifx-icon",{key:"ba6a9109084574e407bc5b893711a9ea419f90e4",class:"check__icon",icon:"check16"})),c("span",{key:"36ea220aa402785efbac4a672867f41f4315548c"},"Adheres to web standards")))),c("td",{key:"3e37a10c8cf32a32ad6bbfaf07d73b117d36e57d"},c("ul",{key:"2639a1efd573350c593fe3834b0648990af021ae"},c("li",{key:"110466b62f9deb064e722d35e14b3c42a7d2daf7"},c("span",{key:"8dc91ab12d83f567afaaf8f767f4b8310484cacc"},c("ifx-icon",{key:"156c50ab0685442abc4d42d50db46d7eb173bad0",class:"check__icon",icon:"check16"})),c("span",{key:"71fbf7ba6d0ed5bbc63d39abddd5c54e43c50d4b"},"Show Delete Icon option")),c("li",{key:"9b21d2c3f0d392b8205c1599054249df37ae9b9d"},c("span",{key:"6e00dde5dcccf65c326c77eb978983a08742d26d"},c("ifx-icon",{key:"0d80af0ba4539daab13ed773decbc330fcd0585b",class:"check__icon",icon:"check16"})),c("span",{key:"054c16a2ab1d4a2b973620ecae026cc3e1811ae9"},"React, Vue and Angular wrapper integration")))),c("td",{key:"33d5e80db5bd13280142170f256b5eab5a7c2703"})),c("tr",{key:"7fecfda2735ef3bbf4898bf44dfe32c8efe92c9d"},c("td",{key:"a909e24f7c5de0f2ea0c850272d25955fff92ae0",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"fad510dd9a4d97642910b9c81e7ef2e7620a3a0d",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-segmented-control--development",size:"s",variant:"bold"},"Segmented Control")),c("td",{key:"db05d3afde09df8b2b354f588ccc26c1064fcb3a"},c("ul",{key:"aece4b089b774bbeaaa9e5e9cdb0f76a892e1c79"},c("li",{key:"a9a46238fcda32fbb64ebd75b86b24eb25585cb2"},c("span",{key:"f064eb90fe38b7d35013c235c2d72874c954c476"},c("ifx-icon",{key:"ebde489cc0a76b7298479373ccda75910d4cdc56",class:"check__icon",icon:"check16"})),c("span",{key:"179c5152b55b0bc2c6bda622d14853fad542bee9"},"Provides a clear and interactive interface for users to make mutually exclusive selections among multiple options within a web application")),c("li",{key:"d94101eef0e0ea447557d09dabb6ff5c02f34c4c"},c("span",{key:"6d509127463c7f2776c92248c228874a183fccc6"},c("ifx-icon",{key:"be21423adc66e7f1343377e5ddef5070a07af8e6",class:"check__icon",icon:"check16"})),c("span",{key:"d02c57ee6376611e9a304a4d7ca847377e078f08"},"Offers a customizable set of segmented buttons or tabs, allowing users to toggle between different choices or views, typically used for filtering, categorization, or navigation purposes")),c("li",{key:"72c5da127c1396f75be3a41481bfcc4af2e66679"},c("span",{key:"a2803a88b1fbcde48b510c1d6d76843473770e37"},c("ifx-icon",{key:"7b64c76728cbd3012467cda82eeb4d47733d3d7a",class:"check__icon",icon:"check16"})),c("span",{key:"f91e247f9f5bdff5a24ce3e96dd448fc7eae106f"},"Adheres to web standards")))),c("td",{key:"1d34807884b0879fa0484089814e1a96f235f1e1"}),c("td",{key:"9af6df4c3dd680433e423c843459d31f260fa1e9"})),c("tr",{key:"f384bc8d77e926aa0458b4be2922f2043187c263"},c("td",{key:"eb0ea31db2d5ba0ad9b6ff9c8249ef404f15007f",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"e0bea8571ba73ee8e43c9c9130fb85695e0babae",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-select-single-select--development",size:"s",variant:"bold"},"Single Select")),c("td",{key:"38c9a1720fa88f206d3b260859a8c51d0832f5a7"},c("ul",{key:"ffc6e2e956c8d5175ea35299097f338bdd636bdc"},c("li",{key:"8b02a89d323097967819c1db794fa08a3a277f4e"},c("span",{key:"73838f811daacff2fc77950580ac44d21135b76d"},c("ifx-icon",{key:"c04e69d483c9e6301381f98960082b1cfbe68a2c",class:"check__icon",icon:"check16"})),c("span",{key:"fcb0ceb31a629764a95a469090a7126f0b96d1ac"},"Provides a user-friendly and interactive dropdown list for selecting a single option from a set of choices within a web application")))),c("td",{key:"c707dcad6b552aff805bd8eff924ef2e3025bd3a"},c("ul",{key:"d5e97b0e53ddad58ba6c847593b97b7b7ce7989c"},c("li",{key:"12103a46e9c14f51e1f5f55f2fdca4b3aadde136"},c("span",{key:"2c40f00a53b816e59148efe25c20aa676709d651"},c("ifx-icon",{key:"6976633c38bb6ce005470af7ba23a8c2bf348249",class:"check__icon",icon:"check16"})),c("span",{key:"8545355262d3167840bdd8d0f50cd838f41f3ccb"},"Extended customization")),c("li",{key:"a8dd7ac2294e73e845c2319e4a3e3dd252a601f7"},c("span",{key:"54ac6f617428e2a3cf373b15c108f89387569711"},c("ifx-icon",{key:"18a45c07773111cf231b881a114e9d6568ff0abe",class:"check__icon",icon:"check16"})),c("span",{key:"aa1c29794c7896bad31bc67fbbfdbbb8be0c12a8"},"Option to enable and disable the search")),c("li",{key:"565d2d3b1f50d2152ba4bd0b8b1e222f9f9f4d57"},c("span",{key:"8a1d947e7a983b5d944ddfdb2f62cbe7999fcfbb"},c("ifx-icon",{key:"eef4018206f889db3704eaf52c0078886a48ad17",class:"check__icon",icon:"check16"})),c("span",{key:"9221b0fce57c3982fb951c18e1cb12d0929c201a"},"React, Vue and Angular wrapper integration")))),c("td",{key:"4d0c1e468c528b31d6e7eb05931db9f867cf23c8"})),c("tr",{key:"66ecaabf1333c8b3b8af4b99409ff3072cbf83ef"},c("td",{key:"173f4f4f3e87b0f5240d4fce438a6e5da8967665",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"f51dc54ea2014b01ec763496f26f41d7804f7555",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-select-multi-select--development",size:"s",variant:"bold"},"Multi Select")),c("td",{key:"c7da75fb2054fe4959f01e5adfcfa0c33bd80013"},c("ul",{key:"f32644b1a1e065cdf0cf6cebb1588c0fe843f211"},c("li",{key:"4035c350fddb2a7b675d9d5c297cce6a57a115e7"},c("span",{key:"120c76efd425a7d5e113ef0c022d5fb396fc7856"},c("ifx-icon",{key:"832d0c924f0ec63b2795375a948067c96c823e2e",class:"check__icon",icon:"check16"})),c("span",{key:"ec576f08125e1db8911697916cbbc3c4b3f51540"},"Provides a dynamic and customizable dropdown list that allows users to make multiple selections from a list of options")),c("li",{key:"5da13f905692a2ac82efd43b7894f6383219cdce"},c("span",{key:"24da7b26ea0939df64edf492306f00ebe31a91c2"},c("ifx-icon",{key:"b68e729b2d59fec6685ee10e8d9386887f7c7566",class:"check__icon",icon:"check16"})),c("span",{key:"0308cbd5ec7b481441bb159bc27eb9c74068ed0e"},"Adheres to web standards")))),c("td",{key:"a0a1743b64e33e85b43ebbde6d968c82355b31e0"},c("ul",{key:"3f2d98df6a1d17a7d33ba33fa0367990ba7baa67"},c("li",{key:"10fb815fee028ed782577a3c3e1118348b02534d"},c("span",{key:"357f3d9eb7dd44606579f3e3be16618a8513df5e"},c("ifx-icon",{key:"3dd0f14226a119a10e28696a3ecbb69846763949",class:"check__icon",icon:"check16"})),c("span",{key:"0dbbffce10b6d124d4b3109b8d19e79afde8e515"},"Extended customization")),c("li",{key:"3285ff665b7e823a12301de3173e0392b8bc5fba"},c("span",{key:"4782c92811e87a2d6fae787c6311ad59c9e29ea9"},c("ifx-icon",{key:"c9d0e2e747f9608743c4b86f342539b938dab5c6",class:"check__icon",icon:"check16"})),c("span",{key:"9ba550d4cd35f227cb1a8d155468659b875059f4"},"Nestable options")),c("li",{key:"e0edff83cb79e16b04264b10e148aa1b8e611f13"},c("span",{key:"75dd2f4208fe7067ab3d001fce4ea3acc213a358"},c("ifx-icon",{key:"0c3f1ff650a2fb62a8d20bf9ab2a79f00c6e0386",class:"check__icon",icon:"check16"})),c("span",{key:"0e66f240fa84e1c4dfa522964a8625deb4c6f749"},"React, Vue and Angular wrapper integration")))),c("td",{key:"8aed9bf49a7d9f9b16b33c9ed9b09fc9b85b3bf1"},c("ul",{key:"ebcb01dbc4934d0d0f7adc4ceeeb074de7844522"},c("li",{key:"4ded87592804fdba16d4a1cf521575dde37790e3"},c("span",{key:"960cae2492747e772892936afcd2f35d708610e3"},c("ifx-icon",{key:"61a30347f40c6a7180f4f157bec3b02cdd8fd37c",class:"check__icon",icon:"check16"})),c("span",{key:"490531f1cd89eb9ca0a1166d9dd1a716a6862b2e"},"Option to enable and disable the search"))))),c("tr",{key:"345cff9362fc25a58f35bdd32399c1560bbeaa9b"},c("td",{key:"b0b8fa8c8282b0d5a74f5885435faabf83d6830d",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"5a91d94893a9343cff431e0550f4ac05307957cb",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-navigation-sidebar--development",size:"s",variant:"bold"},"Sidebar")),c("td",{key:"e35436c719a26b15bf9890b1ff54e66740b8b661"},c("ul",{key:"5be2a80659bb31c25ca9bbf544e609bb133170e7"},c("li",{key:"96b105bb3504da32389c0bf2342f212bac535e5b"},c("span",{key:"d0652ea4fab5492a2ac97435b36149cf0e155c6e"},c("ifx-icon",{key:"328918bb0b03220b4c0f090d993639ab24da4d8c",class:"check__icon",icon:"check16"})),c("span",{key:"4aa65a1a2dbcadab0b9bf207778bef9c074de4f4"},"Offers a configurable and collapsible panel that typically occupies the side of the screen, allowing users to access additional sections, or menus while maintaining the main content area")),c("li",{key:"755f895bbf0192f0056e57e1a472a86cae957560"},c("span",{key:"6f113f94ec4ed6b02e5cb432e817ed71fb1ac00f"},c("ifx-icon",{key:"3b8b48afed758ca6f63af3ebda0bf85d6362b3d4",class:"check__icon",icon:"check16"})),c("span",{key:"b6192afafe1b931c1ae19e6629321a7663f6fa8f"},"Adheres to web standards")))),c("td",{key:"f98b859c2c8792112cea69b5a564f235733bc936"},c("ul",{key:"a409669e003a46d066a5b1d8a31b1b011fbbd04d"},c("li",{key:"f8adc27529fde84ba740ce077c59c6ad380562bf"},c("span",{key:"94d0cbef8bafef57bac3338dd1c851951bc87a90"},c("ifx-icon",{key:"b1832b10ce65383493d96c6dc39137c51fd1e6f7",class:"check__icon",icon:"check16"})),c("span",{key:"b14300ef14c3c38e020652df65558336a3e438a7"},"Extended customization")),c("li",{key:"6cef419f3a754334c83fd9bab66349ffb3df7c0b"},c("span",{key:"9a695cab7993949aefe6f9f88d2949826337c940"},c("ifx-icon",{key:"32add7d652774c3324b124a785eecb976b77b447",class:"check__icon",icon:"check16"})),c("span",{key:"07b08473ea794c8104ddd3764b664842b45108e8"},"Multi-layer nestable items and menu")),c("li",{key:"84a5350484465e80996be7efd51fc25aca9358b3"},c("span",{key:"6a28436af6c72969892f5d877561bb70ce3f61e2"},c("ifx-icon",{key:"a46dc295e240f2fff1c7c44d599892b7d5981d3e",class:"check__icon",icon:"check16"})),c("span",{key:"57c3649feef3a7df62d32aadf23affc26475b376"},"Initial collapse option")),c("li",{key:"ac2d441c4c6601c8e8d1546468bdd9c47580c5d3"},c("span",{key:"98ac4ffde51792df2cd13ab92d5803ef5829caa7"},c("ifx-icon",{key:"fe0e10ca8b2bfd175a4dc51ba3223d2a662e8737",class:"check__icon",icon:"check16"})),c("span",{key:"898b1ea2f9547f20f1b6526e094d0d4fc02c7086"},"Active and action item feature")),c("li",{key:"8261c38a5fc7ff34bbcbb89d51e35be35054a12c"},c("span",{key:"3296d6cd565c2b0430545cb3c5a100326edc3350"},c("ifx-icon",{key:"5e234bbdb07e93952925ec4d9016dfae959bea89",class:"check__icon",icon:"check16"})),c("span",{key:"3d2745e484d4125476d0bb636667257ee8cde715"},"Number indicator integration")),c("li",{key:"717b4ae460d7db2b3860617b59296d73544c0417"},c("span",{key:"d40ec03ce7116fa61bb577cd3fabb8c34040e6f0"},c("ifx-icon",{key:"5582e188881015207b95da1c368fc06ae7c5c1f6",class:"check__icon",icon:"check16"})),c("span",{key:"9040ba71cda88308cfe5f8fb112bb42a87e9cad6"},"React, Vue and Angular wrapper integration")))),c("td",{key:"cec6e785ce7c01627a9f2dc56153209961d72e34"},c("ul",{key:"dc5917c77316c68d0e94bc0ed1c6e2bd97a4d986"},c("li",{key:"596d00d8900adc49785faf8b657d5c276feea3fd"},c("span",{key:"075ed213d00af3040381274dbde1558900427ff4"},c("ifx-icon",{key:"542c9b2c8f78a522848fd0c005f7740868f5aa19",class:"check__icon",icon:"check16"})),c("span",{key:"13bdd73e68ccca4f117e427b4629010177d0da72"},"Removable Footer, Header and Logo")),c("li",{key:"6204592076d5b14c3034cbe61628934604daf603"},c("span",{key:"e9ae461fcd95c5ee251c8b19a13bde1e9d3ede57"},c("ifx-icon",{key:"7e18e25ef9cd70398925a435035712bd1d6035c9",class:"check__icon",icon:"check16"})),c("span",{key:"c5d271d968f9ef88fca56ea32d0f337959b991f5"},"Removable and customizable Links"))))),c("tr",{key:"98d5cc24a5740ac0be5a3d3e05f34325b2e45cf9"},c("td",{key:"b84b43b2475a249e6acc330de6492e40e80aa903",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8dac9c20358687c6eb11caa610a8799dc2c5c7c2",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-slider--development",size:"s",variant:"bold"},"Slider")),c("td",{key:"804934dfb6372c5974a6cec96d8606c3b19feee8"},c("ul",{key:"60a3e11045beca2c87d4a7ee74fc91c83b8bcc7d"},c("li",{key:"3a34dbdbd428cdfe500a0a8d52e700fea1fc6595"},c("span",{key:"23ed00c95a7aad690a5e1b43d004a48af95510b3"},c("ifx-icon",{key:"b8b338c636b193c2332709c91900b5e796b22ef7",class:"check__icon",icon:"check16"})),c("span",{key:"ac11bea5b2ea1fbedc042f9ad21afe34d4cb28a2"},"Provides an interactive and customizable input control for selecting a value within a defined range, often used for settings such as volume control, data selection, or numerical input")),c("li",{key:"fef27e58a7f09b7701257c2417ddd530f9b756ae"},c("span",{key:"f5a075560f1a9f1c98a941d097b6402d342aeda4"},c("ifx-icon",{key:"5bbad2b803a0de28bcb4409676ef488fb61f8b43",class:"check__icon",icon:"check16"})),c("span",{key:"10162611cc709d3258a06b46ae3dd1a7a6520eaf"},"Adheres to web standards")))),c("td",{key:"3981a4a191095a38e31a28fa04fad15e8fa02f8b"},c("ul",{key:"b3f88ab68bbc702864936bf13149acdf72afc1fa"},c("li",{key:"518fca746e8f5cb5324935942b00dc8568978b1a"},c("span",{key:"06aa09a81f50c6ac4371d5340a77ebbf7746e4e6"},c("ifx-icon",{key:"8e8c6d0203f78233463b9b6ed42624ba670eb623",class:"check__icon",icon:"check16"})),c("span",{key:"9b3c9ac1c622a03772288af63eca4bf899ce620c"},"Icon incorporated")),c("li",{key:"410d1447292a8ba5bc0a927f701591540010389e"},c("span",{key:"14df41709a4a4a975fabd64a53bfd6e0eeb6aa56"},c("ifx-icon",{key:"ebb963f0d5c2cc90d97c79d9eaff4b8cd5bf83ff",class:"check__icon",icon:"check16"})),c("span",{key:"f83e6ebece6aab47dd02552e8bdbd97ec4c935ba"},"Percentage variant")),c("li",{key:"de77dd9fa5df7f7242ce7db516214b12d2e11ad2"},c("span",{key:"f6679b811c25de4ae49e39082dc6f309b1385f02"},c("ifx-icon",{key:"a8ba44ce58085b2796e9278a5607eb1efbe785bc",class:"check__icon",icon:"check16"})),c("span",{key:"4e9eba17b7ef21824658d782d713eb1c2f97e4d3"},"Text variant")),c("li",{key:"0bd0f2493c2d2c3e18cda336ebb8e8c063a2812d"},c("span",{key:"28d6e142b7e60e26146bac9083ca2aad20e05560"},c("ifx-icon",{key:"9d252407a747044aa20d3374e7f1a3acfe167a2a",class:"check__icon",icon:"check16"})),c("span",{key:"b43abb5a2d142c528079dd157bcecf3da83790bd"},"React, Vue and Angular wrapper integration")))),c("td",{key:"6500c4d24f8cb901b705bd404ebc7eae8a221efd"})),c("tr",{key:"ba2b5a5a174815693e63c6e9d1744c2b837fde52"},c("td",{key:"b46b7f56119fc6df59f4e18e83ea6c06d9ef938b",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"792fe7a7c27350bd0e79321ab16385a4caa4b512",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-spinner--development",size:"s",variant:"bold"},"Spinner")),c("td",{key:"abbc5af8052c27da911bc6de186ce1049d25e059"},c("ul",{key:"2d087a2347a286ca442f357171672d686f73c376"},c("li",{key:"d1858b10ada0d64c91a6840cdfbd07ca33bcdb80"},c("span",{key:"ab51b2a7e9d8c007dd2cedc8916607f35648f9e7"},c("ifx-icon",{key:"1717d1537db4d79ae3c61914d3b3d4a54f819902",class:"check__icon",icon:"check16"})),c("span",{key:"4a34f515a5da4ddbc31724a562869ae27516b116"},"Offers a customizable and animated symbol that conveys to users that a task is in progress, typically used to signify loading content, data retrieval, or pending operations")),c("li",{key:"50055f8e4bbd530607db12124910ff64d5e5a444"},c("span",{key:"3b893b3e5c956dff733135852af97a7538b95829"},c("ifx-icon",{key:"95d0129f85be088fdd468edc3a48e25033067a60",class:"check__icon",icon:"check16"})),c("span",{key:"fab14ab5148df2f3a72016a3f5d53e751cb7ffb4"},"Adheres to web standards")))),c("td",{key:"ab6d5b3dd86a7d725369dbbe72edd37e8d6f9ca6"},c("ul",{key:"bd8f1217c014e5b3fce6fddc27eb6ada63394501"},c("li",{key:"3f5b468a9d7b1cc7d328cbe09af102fa53db846d"},c("span",{key:"f15828d653c53591014436167f7157809277a008"},c("ifx-icon",{key:"41caf9189776c0e3902730c991ee3fd331b02ad0",class:"check__icon",icon:"check16"})),c("span",{key:"36059dd9b30cb5425bdaa01ccd8dcb7456694adf"},"Brand variant")),c("li",{key:"35d6a7cce745b56d2081d29c55120ea796065c43"},c("span",{key:"94d997ccc10a7d020cc8fe4bda09a442621f3452"},c("ifx-icon",{key:"0ab3c3da3bd67708a31f9f957dc9d70e40650e40",class:"check__icon",icon:"check16"})),c("span",{key:"d5d01ff68f020c6830673075209984c84ce7bde6"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c8b599bdd6d56d8b3bcce6b02733111bab97d203"})),c("tr",{key:"c77e3971e123a9f25b950d6d41a2884d8a19a037"},c("td",{key:"067fca48c186e344d6fed6dc8f5e2826c576c999",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"1d3a899146f645639015287110d672a1b24b99ff",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-status--development",size:"s",variant:"bold"},"Status")),c("td",{key:"cc3041b3df51f11ca4e24155c1de678f36f66da9"},c("ul",{key:"e5ac840761ca5da2741545ab2ccf5ab7441a04fa"},c("li",{key:"d0765c25699f057e6d2d247f986f32f1346a25dd"},c("span",{key:"d9efe54908ff79182458ebe9026cc22f29796abe"},c("ifx-icon",{key:"c076782e88809c45c63a4635938f77e3be9b93c2",class:"check__icon",icon:"check16"})),c("span",{key:"c23f9cbd6b9e37d63d4244b8390514b351a6ad12"},"Provides a visual indicator for conveying the state, status, or condition of an item, process, or entity within a web application")))),c("td",{key:"88997b9ec21974e834a5d17e6b403a74e766c4e7"},c("ul",{key:"795efc4de38289fb6e14a706b73b94f0edf334e1"},c("li",{key:"d695a8b00c983cb0b3420ed438bfd76d8348ccc9"},c("span",{key:"d9521e8c7c46f0f43c87e1d8b0732620e204efa8"},c("ifx-icon",{key:"e44e0415a07f93246732277422d9ef96628be3d1",class:"check__icon",icon:"check16"})),c("span",{key:"79d9735625cb466093b4887fd386a60b1efef9ad"},"Ocean, Orange, Grey, Light-grey, Red, Green and Berry color variants")),c("li",{key:"4a737b62273da043392f95aba769082a870eff01"},c("span",{key:"a761e1e7c59c76c08f2fbd5b9b2144961b91f692"},c("ifx-icon",{key:"f16fd8e67a8e04e636c0636538571977c404dfc8",class:"check__icon",icon:"check16"})),c("span",{key:"e15b2e574f06c389d62b13287746fc12cf811268"},"Removable border")),c("li",{key:"0079f6e462db770e77dfc96db75930c62c30f4ac"},c("span",{key:"6536d1d0f51f2a1b213a376a71350dec3b778f9d"},c("ifx-icon",{key:"c99bc4d51cc5fc814b75af75ce1a3edf65080658",class:"check__icon",icon:"check16"})),c("span",{key:"2221823f8c21f6fe87de5bdae08879e678989fb7"},"React, Vue and Angular wrapper integration")))),c("td",{key:"1155a0deeee389acd483f8cf9fd43cbe276a3203"})),c("tr",{key:"d65cb3c9f5165809c2888b19334fcef316b5e6ae"},c("td",{key:"ae27dfe573b3dd63b5aad1184af7922cfa17ac5c",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"93856628b3e33f65b5635edf65b906f82771f544",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-stepper--development",size:"s",variant:"bold"},"Stepper")),c("td",{key:"c2f2b42ca5187ce83dc7bb2b85aeb11b4cbe1348"},c("ul",{key:"bc21d5431c5580cce5e3c8b082f63429bb31ddb0"},c("li",{key:"c6a88e660993c0e247cbb327857474469fcd7462"},c("span",{key:"c2bbfc9dadbfc6bb73f8a396433277944f45f75d"},c("ifx-icon",{key:"fa6d69d4c13ad2e26cab041d00ea450b8b04f418",class:"check__icon",icon:"check16"})),c("span",{key:"e745e07cdece660358dd1e28e445b52c2a08fc86"},"Offers a customizable and intuitive control that allows users to navigate through sequential steps")),c("li",{key:"75aaf4f7b326e6f78e0981dfc7c66cce706e2593"},c("span",{key:"ccd3c6528ad932f34b0424fabf9ff0bebadc5e7d"},c("ifx-icon",{key:"08db5151b3d3d4012f49fb259aa7bc6701b3f0c5",class:"check__icon",icon:"check16"})),c("span",{key:"34d381e5bfd961118b93ab3158cd8b332e3adde8"},"Default and Compact variants")),c("li",{key:"4f1e851e474cea45149f79022d491211e8683994"},c("span",{key:"be8fe08cfeae5e1062d3388dc67f97dcdd2ecea1"},c("ifx-icon",{key:"28849153194b2c162af8bc04fb72aee0a75ff8d7",class:"check__icon",icon:"check16"})),c("span",{key:"296b320696f1b0c5a7d26bc90fdfa19ec0fce887"},"React, Vue and Angular wrapper integration")))),c("td",{key:"80bd51c0969f0d49fc4fc5faef00eac129d9d7f0"},c("ul",{key:"79af4f3fb502422f42b38cebd72e789c8d832a34"},c("li",{key:"3630b6e86af6cee14a44206595bf35f1e96a562a"},c("span",{key:"c5529b116e32490f3b2918c5404889fc470244b5"},c("ifx-icon",{key:"203e9a956ef927ab39ef2f352a9337835e9f8512",class:"check__icon",icon:"check16"})),c("span",{key:"8a86f49fe548542877f2e8b70bf616d514d56f32"},"Vertical variant")))),c("td",{key:"0ca74a72005130cbf5f9803e588c8af8becf5d89"})),c("tr",{key:"900c43bb42de666a32f9dae5b5d6afdc489717ed"},c("td",{key:"ecc33f7bbbf02de050fa478a790ba7dee023e7be",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"135b588717ba2d1f2a7708c7de21a30a54d5edb0",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-switch--development",size:"s",variant:"bold"},"Switch")),c("td",{key:"ac4fd887b4ca0c3836c8e9f71b1d38309d005226"},c("ul",{key:"ca4ca148bb15875fbb7fc67145c32eb84d158120"},c("li",{key:"d6e094ca1962cb0331365936f567ba0a27c8b32d"},c("span",{key:"816708932b9548943264c97533b600a890c1ef2b"},c("ifx-icon",{key:"96772db12ba1daa784f8908cbe12c81313187178",class:"check__icon",icon:"check16"})),c("span",{key:"6211e35648386cbf4924819b3834f75907bca51d"},"Provides an interactive and customizable interface for toggling between two states, typically representing an on/off or active/inactive status within a web application")),c("li",{key:"20401d963f6e764a37e91d316eccf1798b3092ae"},c("span",{key:"e5421c25b3f5a0e8ee289358b618cda16a4f8c72"},c("ifx-icon",{key:"371b780e2cd409ce6ac021172255e0a72476af42",class:"check__icon",icon:"check16"})),c("span",{key:"32e40921c009e4348895965f0e04b80717338034"},"Adheres to web standards")))),c("td",{key:"1d466b423d81e454eabaf0800723831572ad91d1"},c("ul",{key:"ea110c843bd22103d7721f6d556db1dfb4797af2"},c("li",{key:"eb1638620ae03cf22fea29c897f1e4a4e1955c78"},c("span",{key:"97c42ae145ad0ab83ede04859192d43799988dc4"},c("ifx-icon",{key:"ea357ffd9ba5e625569871afd5ba09c54e212644",class:"check__icon",icon:"check16"})),c("span",{key:"d33e4aab8b993b77d6a4dc9bdc3179175ca1bae0"},"Incorporated label feature")),c("li",{key:"c77a3155c9f2727217a0764ac187ce4396fb0e5a"},c("span",{key:"6b5603add3b10490c06a0f5648471ed24ca39162"},c("ifx-icon",{key:"0fdc1ab312df911e1ef105a1eb7825c844d78739",class:"check__icon",icon:"check16"})),c("span",{key:"d6fadd12f8d83c7e8c3352d99010e6c45cb7fe9f"},"React, Vue and Angular wrapper integration")))),c("td",{key:"9694bd1c25298e38ae27ede66053b6244d58ae51"})),c("tr",{key:"213375844682a77f328970e08a52feadd5bd17d2"},c("td",{key:"98045e797005403fadf6280cf8d411d564dfd76a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"6ba6dddb877cc12d0e53e6088a42d25bae07d99c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-table-basic--development",size:"s",variant:"bold"},"Basic Table")),c("td",{key:"c5afe72c3a77b6516be19727e26c046e76edad4e"},c("ul",{key:"cf0c09139d53d8da2569d6d6c53f97d27edab269"},c("li",{key:"a98b4162e2ecc14f2bd3786a7a9a5d0aa2ac6522"},c("span",{key:"e9d90a6aa6e4cbb39e85ddb5771dae2b89f389ec"},c("ifx-icon",{key:"dadff739dae840c4d6264e361241573380eb787c",class:"check__icon",icon:"check16"})),c("span",{key:"e2932dbd8c61c0e0a5b30ca1378eaa659d9d9acc"},"Offers essential functionality for organizing data into rows and columns, allowing users to view, sort, and interact with structured information efficiently")),c("li",{key:"4132f60f8740f65c840f5d3b64c3b192684e3647"},c("span",{key:"4af7aa5842804a447f423e0f43bb63a9a5534e47"},c("ifx-icon",{key:"9342bd9ac34b4dd96885b445a49d04b26b923939",class:"check__icon",icon:"check16"})),c("span",{key:"cade8e62f1228f747e09280c80b0c76db7b11c7a"},"Includes basic features such as column sorting")))),c("td",{key:"8faf18679027590cfb3bfb53cb59c42007d9cb2b"},c("ul",{key:"1dc750e9c8ec986476e251fd927a9a4df0675665"},c("li",{key:"ad090e8be72235c1cf5723d9b7b4891625356f84"},c("span",{key:"7467c913fa731735c4c26ec72b5b89f1d6f0dc32"},c("ifx-icon",{key:"4112a9c7b9d6c88e5d7f20ec702e23caa322e12f",class:"check__icon",icon:"check16"})),c("span",{key:"ae776cd9e0750933c2539cdfdd88c7d12aab58c0"},"Compact and Default variant")),c("li",{key:"a64bb11dcbcd372ec92396e2188fb4df2fde7f06"},c("span",{key:"4efa40fdb6b700fd5d4b14eae3b98708645980c6"},c("ifx-icon",{key:"d442e2f52dda66a19af65ae76820bb0b297f5faf",class:"check__icon",icon:"check16"})),c("span",{key:"2859d345ff7aa085e12ec9fb1bd64dc1bbf6702d"},"React, Vue and Angular wrapper integration")))),c("td",{key:"322648b316715f9d1a0a99a975d43aeb52c43e43"})),c("tr",{key:"4359d9a37fa702420d2f5dcf68006ddb72cd1e9f"},c("td",{key:"61a810ac029c9b9606bdfe5b8ea36678ce3cc7f5",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"63afaf7f578d38ee5f58ce7d8acf52c952cfdfc8",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-table-advanced--development",size:"s",variant:"bold"},"Advanced Table")),c("td",{key:"0330808910d97f6740fd3b1d550e27e0454df909"},c("ul",{key:"bcb12b69c7f2372562ddd6d6c516b5e225e1528b"},c("li",{key:"6c26c07da285b5c27d5ffdab5921803ca656f704"},c("span",{key:"2bbdd7f220a2f35a2295475ca0bfd0aa6729e504"},c("ifx-icon",{key:"9932f2f7144159b6efcb3e6bb54e790c8ebc02b8",class:"check__icon",icon:"check16"})),c("span",{key:"75bed8f3157602e09011bda65616919e453b155c"},"Pagination")),c("li",{key:"bec93bbe22cac674cf4ff3a6f94bc401831bd8dc"},c("span",{key:"8e11ce5cc774a9c7d554757b42182c30af611389"},c("ifx-icon",{key:"de095ac4603b1fa3572ebd74dd5729f7105fc2e0",class:"check__icon",icon:"check16"})),c("span",{key:"1e6b27de01e045459571cd8936c7f964955c8b86"},"Sidebar filter")),c("li",{key:"6b403229db8b642a39a6a8f213508c6f419b2e6e"},c("span",{key:"0fcfc73249b2ad6ffd961c7aa1dc9d9ac022857d"},c("ifx-icon",{key:"e9a0c21eb1b2bffd8bc3b4c2fb981af6b0fb6e42",class:"check__icon",icon:"check16"})),c("span",{key:"124dc9c37259bbc4827122154257dd21fa06c3ee"},"Topbar filter")),c("li",{key:"033883139d4bf45d334356a94396096747234c9e"},c("span",{key:"99c00b85c66fd8b9c0b47536c77fe5cda8ace60e"},c("ifx-icon",{key:"8b01c9c948afce2f09d88941c166d4b35cf0de2d",class:"check__icon",icon:"check16"})),c("span",{key:"37eb70158318df36e0a73b0aa6e020dcc18ab4bc"},"Nestable buttons")))),c("td",{key:"6e1ec56687dcfb152eec510c3cd8ed52a9adc397"}),c("td",{key:"6a4abf2b6f3dbae90c1de94b1af933a1be849d2b"})),c("tr",{key:"d6cbc4c4d1aac8a8dacaeec6f49a129de9ddd00a"},c("td",{key:"ffc88719c34b824bc776dca636ff71702bf6aeea",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"1304bac49554f96138aa8586b2e8328e409867c6",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tabs--development",size:"s",variant:"bold"},"Tabs")),c("td",{key:"8a65c337bd96d62b7bbe53967e9548e4973107fb"},c("ul",{key:"18fdef282115c916ff5fb7c627ccb0ea6ab99f91"},c("li",{key:"dd0e570e1b00b30e66df0b158c1d974e1d23aefc"},c("span",{key:"099f8cdbb6fdb1244746b834d5ea7c0d0ee57662"},c("ifx-icon",{key:"099e0c687be2fbb6476b77617cc8684dd57ae504",class:"check__icon",icon:"check16"})),c("span",{key:"d780b2fa9257be7c761dce78256bbb0ded8d73c7"},"Offers a customizable and interactive layout that allows users to switch between different content panels, typically used for organizing related information or functional sections")),c("li",{key:"f849b92c9c7853e71df757d7a2b21169205f547f"},c("span",{key:"dffb3449e4a15ae92d37f8532eaa4fc628e01a9c"},c("ifx-icon",{key:"6d6f0e3f2e772e78532dcf5e898646ecc114fb3c",class:"check__icon",icon:"check16"})),c("span",{key:"39449c3242ae965d65ae208642878ae75db57c65"},"Adheres to web standards")))),c("td",{key:"124363f55e2620d3a6e9430f37168ac98dd4f727"},c("ul",{key:"c98f5cbd0094b7b6a087254d1d34d5bcfb73a9ae"},c("li",{key:"3e02a4c22b82357abf1fc652b660ae61828f5769"},c("span",{key:"a9ae055d6843be09c727b55dce637ec10aca435a"},c("ifx-icon",{key:"24f47c04d059cdaf0268b5e6ab34f73c3a319b82",class:"check__icon",icon:"check16"})),c("span",{key:"741e917e668743ec601af37f42e26ec44c65382c"},"Horizontal and Vertical orientation")),c("li",{key:"0e05a0dab579e85ebac3e6071380cd1c6cedf356"},c("span",{key:"5cf6dd143b7da2ed2cec5d98ed46e44f4c57d564"},c("ifx-icon",{key:"4083f186e0bc6ea32d27a8c5696c9a0fe4fccf3e",class:"check__icon",icon:"check16"})),c("span",{key:"b5312dc60b2d9aef8524317da48f077579c44c9f"},"Extended customization")),c("li",{key:"038e18960ec88fe93378125710bc0dcfafd0accc"},c("span",{key:"908209936f6c2ee4a279a5f5f68bc30339fa41a4"},c("ifx-icon",{key:"c1ab7fdb6a009e45f8da5360ad8e7e30cf484f9b",class:"check__icon",icon:"check16"})),c("span",{key:"0700798ad67bf2ae6b0356d2ccbd3024bc200326"},"React, Vue and Angular wrapper integration")))),c("td",{key:"3b2e9ec7b58225bdb006a59555166642a5dd0ddb"})),c("tr",{key:"5845a5494329a5ee39df4ac03b339c63955c5c3f"},c("td",{key:"c21da679006bb5e14ce641d6dd4b804ef9044b67",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"23b8ba7b359165b124b13be72790cf69f68a78a3",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tag--development",size:"s",variant:"bold"},"Tag")),c("td",{key:"62319b7eaccd82f065f0cad870903c249d1784f7"},c("ul",{key:"23e2082ad22da23e2639aaa7f646c0b0d429a969"},c("li",{key:"1892edd45095ff5cf0414d62c8725b6c4b687b1d"},c("span",{key:"a1fd32b7f8e0316df83938a08fdbf83080e4b746"},c("ifx-icon",{key:"7294511d110391d390a35b4fd3d9178be1d0f5d9",class:"check__icon",icon:"check16"})),c("span",{key:"f57d2f433a1ce5bab8cc70f03d9a7f865d6320be"},"Offers a customizable and stylized marker that allows users to quickly identify and associate specific items or content with descriptive labels or categories")))),c("td",{key:"f6d216e637039581b97fcc0a073799a66ad003eb"},c("ul",{key:"1cafb4926550db38fc3165637fd6fd6bb63f5a74"},c("li",{key:"1894d92f33b2d9de7b72625f1d6fe23e36309be2"},c("span",{key:"4e8e4eaa4d71c4d066f07be009889828085662cb"},c("ifx-icon",{key:"9f95367c2e5ebd70c417817c5f8298ab8c6fb59c",class:"check__icon",icon:"check16"})),c("span",{key:"4952d6737cc37c57f9302a41797574cb06707586"},"Icon incorporated")),c("li",{key:"c1c470b470f37675a2852aa8b8ec8601082765d5"},c("span",{key:"b4af9ecf3c8da9a5f1567ddcf0bb1d98f74c97c6"},c("ifx-icon",{key:"aea2f36da777428703ac4fad43899a89a1eac78b",class:"check__icon",icon:"check16"})),c("span",{key:"117fc853d06cc4bdbcec75fb03ecb7f6a9c44230"},"React, Vue and Angular wrapper integration")))),c("td",{key:"23762a73d079ee8aaeeba65d369c8772bd95c6da"})),c("tr",{key:"8a5a326a813b2c4f6a2bbe5826afa7512e1e1f91"},c("td",{key:"d187912c06efa51ac244256cf91a324cc4824caa",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"d429efa83d4cec9fd5da8826f2516952bce2ac5d",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-text-field--development",size:"s",variant:"bold"},"Text Field")),c("td",{key:"61f04ba23b743247d4a07e5412ea4049f673caaf"},c("ul",{key:"71272b96fdb290400ff6f07bb6e59dd03eb69360"},c("li",{key:"a3e701bcbe7aaee24401afceb670f5ee145bade0"},c("span",{key:"9d267de3cc2547789b3d4f822c869108dbd7fbd3"},c("ifx-icon",{key:"8e13a2f89d54ff0c4941f4cb01d3959210036d6d",class:"check__icon",icon:"check16"})),c("span",{key:"a5cce47496785ae7c211e2151da70cc18a7d3bd3"},"Offers a customizable and accessible interface that allows users to input and modify text, facilitating various data entry and form submission tasks")),c("li",{key:"3f1ec27fa30c957370788acf05d74e18592f2f14"},c("span",{key:"dd3a86ab313bea00fe097177ffd3e4d43fc5739a"},c("ifx-icon",{key:"6adf0a61b75dc3c91434c0bea7ca37af3520c79a",class:"check__icon",icon:"check16"})),c("span",{key:"52fcaae1ac1a03cb98e3c5ce265e52f0ea067f21"},"Adheres to web standards")))),c("td",{key:"3fc277e5144e5ba2d0a4a8f7ad5667a23b81f3c0"},c("ul",{key:"aee07ed27f6f127b2ab98b32d6f9a175c004f19b"},c("li",{key:"57b2a8f5fab14655229870d80262d905fcc56326"},c("span",{key:"88443022d8cc39240290f4ed245a281a25dbbb1c"},c("ifx-icon",{key:"f7331af34184ac9e6058927a9c2fec06f2171afd",class:"check__icon",icon:"check16"})),c("span",{key:"7f00256fbcd5282b9bb65224c73363c96a400d86"},"Extended customization")),c("li",{key:"dc9f9cc059cfe36895013b623432ea31ab5fccfe"},c("span",{key:"43c1d7e933a57ad258bd0dfb60241653a3b46a5a"},c("ifx-icon",{key:"c1364c2abff817d5532a5389b1c7b629c25a9345",class:"check__icon",icon:"check16"})),c("span",{key:"32f2eada379133684a7787c24e3fa6762633f9a8"},"Possibility for icon configuration")),c("li",{key:"cceca1bbc98454fc81ac61de3e5016f47b17caa8"},c("span",{key:"75a4cf4070446280a9a348e99077783c1119632b"},c("ifx-icon",{key:"cf9c33c4cab2a58da341c57453b254f3ee97e1f4",class:"check__icon",icon:"check16"})),c("span",{key:"5daf6a28629d872caa3b6b26c8e098652a0a114c"},"React, Vue and Angular wrapper integration")))),c("td",{key:"14dad0c82f037e50f7e6283f7fe7ff61b9fba5d5"},c("ul",{key:"5ee391e3018b19cae4ffb9adc60f389154e3c454"},c("li",{key:"1e7c46155ba00e63ce3b7c0c505198d21640b811"},c("span",{key:"d20371a66b877c3b0f2b00260c52a97be6ae2185"},c("ifx-icon",{key:"18895ef41615c90b1689acc265c61c322e5dbb76",class:"check__icon",icon:"check16"})),c("span",{key:"99cad28b5da7299f33c019a00e3023e115697271"},"Form integration"))))),c("tr",{key:"54defdc42411cb639da285252c5c2f8c5be9591d"},c("td",{key:"9f66aa70124c8bfc1ed3364fdaf3020d96315e62",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8de28fe0f986e0569fece992444f45772953e38e",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tooltip--development",size:"s",variant:"bold"},"Tooltip")),c("td",{key:"0fc83624d62c2ffc5abc42f0f23b71959c57b343"},c("ul",{key:"fdd20e132ca8dbb5a4ef4a50148a438a8281b9d0"},c("li",{key:"6ace2bb1fa6f82b2152ec1008ccb98d908c1329a"},c("span",{key:"83ae4ad5dd7a79f124a526d3a0f8fe93c46ab75f"},c("ifx-icon",{key:"b4aec54e224c2cf1634d5c73cbe4b560cb87af6c",class:"check__icon",icon:"check16"})),c("span",{key:"01241c6cbe81621a0254c167bd7d2f5bb5e22815"},"Provides a simple and informative interface for displaying supplementary text or contextual information when users interact with specific elements within a web application")),c("li",{key:"66a423b5d29a479fe2a9cf915f9fb9528063db93"},c("span",{key:"5b0624ba4c7603f781ff6a1eb5a23c69ec77ce47"},c("ifx-icon",{key:"c626b881715d6b12e7cd1bdda629d6d3c48304ae",class:"check__icon",icon:"check16"})),c("span",{key:"8c803f7313548aba7ef32e175d3a838243e6a7b7"},"Adheres to web standards")))),c("td",{key:"11ff4d0667a12d847880da664435f3c61fe058ea"},c("ul",{key:"fcad459bcdc846e90fa55acf1847e90775744c78"},c("li",{key:"ccfd46cc720a42d037e69d1c1c786d7764d323df"},c("span",{key:"5b57cf7cc0f3f23855d08313fea16bd72195f368"},c("ifx-icon",{key:"7f31c679e3da64d7960c631512fca7ced3ddca3a",class:"check__icon",icon:"check16"})),c("span",{key:"6de19e86b83605ddf27c08fbfb146f07c0cfc93d"},"Compact, dismissible and Extended variants")),c("li",{key:"cd9f7be54cefda18b402235aa25f31c1bc5e09ec"},c("span",{key:"607dd37558ea5df1b12ea22ef414c72f575f0a28"},c("ifx-icon",{key:"f7c15a2067415240590dd816a562cbf0b7897def",class:"check__icon",icon:"check16"})),c("span",{key:"efb27f947414b775f7640fe2a9696921cb0fb7ff"},"Auto-adjusting position")),c("li",{key:"3008fd5ae0b90835bf5f7de1eb02779f8c216e56"},c("span",{key:"173c38f6a684762fb9423f8bcd7cbd281a162707"},c("ifx-icon",{key:"a1d1e9dba46965e5fa18683657f086e2ec572183",class:"check__icon",icon:"check16"})),c("span",{key:"8b072f033962c7f8a38abca222f0de31686191ba"},"Icon incorporated")),c("li",{key:"effbbd56130f90c87ea345836c694ead17b95a38"},c("span",{key:"3b89ccb8b3b6eaf9b87fa6197540e42b80aa0001"},c("ifx-icon",{key:"dac32e7e64328ec065ac5554ad6e0ad13a6a8d5a",class:"check__icon",icon:"check16"})),c("span",{key:"52780b97da8c45f09ae1eef20eb4258a6b7561f3"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c53c2653993e30f4a8a834b4bc1d87222018ea58"})),c("tr",{key:"8ccfb3aa6d132afcf6e78cd73f277fecc30a97d5"},c("td",{key:"11868d7e51f4f3d909d5f9e36167ad1f069582db",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"cc2c65597c69b557a2e698e3bf36d0345880c220",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tree-view--development",size:"s",variant:"bold"},"Tree View")),c("td",{key:"350992bb8f896ee63fb7acd46380ae8d2d49231e"},c("ul",{key:"7f8072e6a0266c7aeae519927ac770187365fd40"},c("li",{key:"00c8415e4ca867af3a7fab598dabbb5546585baa"},c("span",{key:"41de20ae1e7e4c8b02ec9e1e8e567c18f416130c"},c("ifx-icon",{key:"8f3e837fec6c7968ca0d484ec521460ea0a324e6",class:"check__icon",icon:"check16"})),c("span",{key:"1586e3612e3bcf1b74b839630610f768514af4aa"},"Provides a structured and expandable interface for presenting hierarchical data")),c("li",{key:"ddf19e392ea9a6f0f5c91c356cd4bb64b56db103"},c("span",{key:"f2a7ce6081e930e1d72a510c296612645df69403"},c("ifx-icon",{key:"25a31115acdeedbe25e6efea234ff8e5eb103524",class:"check__icon",icon:"check16"})),c("span",{key:"4953eca5fdbc7a9b6e31048c3d69834f356c9706"},"Enables users to navigate complex information architectures by expanding or collapsing nodes")),c("li",{key:"fbbfba643e2420780349c1a71ab45b4fc83dc3a1"},c("span",{key:"d3e89a87b5f80ec2b7002529267e9f97ce2236b8"},c("ifx-icon",{key:"0cc7d81d6f000876d3f7a462a3759c90a15d29ec",class:"check__icon",icon:"check16"})),c("span",{key:"9bece1e744de1ea699c0f07e64441fdb5ae070b3"},"React, Vue and Angular wrapper integration")),c("li",{key:"2457762b77ae3f553ff8461ff746e3cf0cb8e9bd"},c("span",{key:"16dc98a17a193e49f27f0f47f21f70be89f2d878"},c("ifx-icon",{key:"d60613d55e996556642510df0e06134e04e26271",class:"check__icon",icon:"check16"})),c("span",{key:"446bb983ccc994abc334741dc97e96c4c7f2c42c"},"Adheres to web standards")))),c("td",{key:"4f76267b10e4d9ba12582089223d10ff36d2b04a"}),c("td",{key:"a820a2e660bab66d4f1e8386709dcaa6a29e619d"})),c("tr",{key:"c2525ce9704cc1bca82e2520378ca538f2f55c4d"},c("td",{key:"a90e64b550c9cece666cb2eca12c775686dcefb2",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"ddb7016ca86de205368afeed0167e92e0e8e45a3",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-segmented-controls--development",size:"s",variant:"bold"},"Textarea")),c("td",{key:"d017656fe5a0c91ba8385e0bf0196da31b10b126"},c("ul",{key:"e04dd74ca09e5ae3f399c95ceef945fabaa6d5fb"},c("li",{key:"83bb3be1164c937015317f5ca07ebcd3b19fbf97"},c("span",{key:"0a843e774594179457b6fc2d08cecbb61c54616a"},c("ifx-icon",{key:"615236c34b9f864fba1576b6627d90eddb2f97de",class:"check__icon",icon:"check16"})),c("span",{key:"811a7c4759e2aa04885a9697d5d0b9b1eef079bd"},"Provides a customizable multi-line text input interface, enabling users to input, edit, and view large amounts of text, while adhering to web standards for accessibility and usability.")),c("li",{key:"69079a91b37d072076efddc5487665aeaa96c5ea"},c("span",{key:"aeac86614c907326f9b10c44811d086c07021476"},c("ifx-icon",{key:"1f6b5f5e2a5ea6bf83814b290f29694676de5dda",class:"check__icon",icon:"check16"})),c("span",{key:"ec286c23885cdd89a81666e20f59e1449aca78be"},"Form integration")))),c("td",{key:"bceec10eb2a42a08142375858be99afc9d5ef523"}),c("td",{key:"42d17e1af35f65f46c0fcd8cf51e9db823a5497c"})),c("tr",{key:"4c4b9a2ef17123c55818b08d4d52cbe78ec2eb85"},c("td",{key:"8f4734726a6e729d6484c376a97b64d2a1e79910",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"618cf178d8f8d5667276be746bceda4c0923ee44",href:"",size:"s",variant:"bold"},"Card Group")),c("td",{key:"e0d62d852c7e0f9dcc8090216f77cebffd1cf90e"},c("ul",{key:"ab93962c4ed1ee560dfe5f18fee332218d97e080"},c("li",{key:"031670361307ea0a38e132d4d2bebee2b596de20",class:"planned__component-wrapper"},c("span",{key:"845c8c43cf26b0622870a86f047e1f86a856f2cf"},c("ifx-icon",{key:"f30f8ee0fe804ed66f13ef7b71a901b06bd2ee4a",class:"planned__icon",icon:"clock16"})),c("span",{key:"1c045169801bb157c5f7f36f00e52a5b986cc7c3"},"On Hold")))),c("td",{key:"6f3e5e6f54bd077cc1519a484457eb877fcfb714"}),c("td",{key:"018f57f26144017cb97d1f389a73fa77369ded67"})),c("tr",{key:"7a1eb4a28ae3849f2f22a52a21eed2aa8694e0e7"},c("td",{key:"11a601af0530fb5cde8c09d86b0a77a3d4fa7918",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"b58e02117aed28f6cf210a95d1791c1640af1508",href:"",size:"s",variant:"bold"},"Popover")),c("td",{key:"01f97f1fd6a666509e79129f12932d63a9d7a33f"},c("ul",{key:"3ebf05ccfac88faa6591a5b922828820901408ea"},c("li",{key:"4386df08cdc5c3e07c9ab40a2d19e302b53fa343",class:"planned__component-wrapper"},c("span",{key:"e62a61053306820536473b1e5c79a2226f80959b"},c("ifx-icon",{key:"4eeb95b9f475e759e5a78ca132b067d6a6708636",class:"planned__icon",icon:"roboticarm16"})),c("span",{key:"92fb29292f00f34e6a35a52fa2a7dcff2fe751b3"},"In Progress")))),c("td",{key:"214bc00f21006f69a95f23518283b546da483e74"}),c("td",{key:"45f6309bbf24413357145579e0547db47cf92a08"})))))))}get el(){return a(this)}};f.style=d;export{f as ifx_overview_table};
-//# sourceMappingURL=p-2bccf9a7.entry.js.map