@infineon/infineon-design-system-stencil 30.6.2--canary.1658.4e0299382cc78146674b539e7aec5baa0c8f1d1c.0 → 30.7.0--canary.1659.b0566d16d24e575a317729dc3e9da288c96252e2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/ifx-basic-table.cjs.entry.js +1 -1
- package/dist/cjs/ifx-chip_3.cjs.entry.js +1 -1
- package/dist/cjs/ifx-faq.cjs.entry.js +1 -1
- package/dist/cjs/ifx-filter-accordion.cjs.entry.js +2 -2
- package/dist/cjs/ifx-filter-bar.cjs.entry.js +1 -1
- package/dist/cjs/ifx-filter-search.cjs.entry.js +1 -1
- package/dist/cjs/ifx-filter-type-group.cjs.entry.js +1 -1
- package/dist/cjs/ifx-list-entry.cjs.entry.js +1 -1
- package/dist/cjs/ifx-modal.cjs.entry.js +2 -2
- package/dist/cjs/ifx-multiselect_2.cjs.entry.js +4 -4
- package/dist/cjs/ifx-navbar-item.cjs.entry.js +2 -2
- package/dist/cjs/ifx-navbar-profile.cjs.entry.js +3 -3
- package/dist/cjs/ifx-navbar.cjs.entry.js +3 -3
- package/dist/cjs/ifx-notification.cjs.entry.js +2 -2
- package/dist/cjs/ifx-number-indicator.cjs.entry.js +1 -1
- package/dist/cjs/ifx-overview-table.cjs.entry.js +1 -1
- package/dist/cjs/ifx-progress-bar.cjs.entry.js +1 -1
- package/dist/cjs/ifx-radio-button.cjs.entry.js +2 -2
- package/dist/cjs/ifx-search-bar.cjs.entry.js +1 -1
- package/dist/cjs/ifx-search-field.cjs.entry.js +1 -1
- package/dist/cjs/ifx-segment.cjs.entry.js +1 -1
- package/dist/cjs/ifx-segmented-control.cjs.entry.js +2 -2
- package/dist/cjs/ifx-select.cjs.entry.js +3 -11
- package/dist/cjs/ifx-select.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-sidebar-item.cjs.entry.js +5 -5
- package/dist/cjs/ifx-sidebar-title.cjs.entry.js +1 -1
- package/dist/cjs/ifx-sidebar.cjs.entry.js +5 -5
- package/dist/cjs/ifx-slider.cjs.entry.js +2 -2
- package/dist/cjs/ifx-spinner.cjs.entry.js +2 -2
- package/dist/cjs/ifx-status.cjs.entry.js +1 -1
- package/dist/cjs/ifx-step.cjs.entry.js +4 -4
- package/dist/cjs/ifx-stepper.cjs.entry.js +2 -2
- package/dist/cjs/ifx-switch.cjs.entry.js +1 -1
- package/dist/cjs/ifx-tab.cjs.entry.js +1 -1
- package/dist/cjs/ifx-table.cjs.entry.js +2 -2
- package/dist/cjs/ifx-tabs.cjs.entry.js +2 -2
- package/dist/cjs/ifx-tag.cjs.entry.js +1 -1
- package/dist/cjs/ifx-textarea.cjs.entry.js +2 -2
- package/dist/cjs/ifx-tooltip.cjs.entry.js +4 -4
- package/dist/cjs/index-af3b4f6c.js +0 -12
- package/dist/cjs/infineon-design-system-stencil.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +0 -3
- package/dist/collection/components/modal/modal.js +2 -2
- package/dist/collection/components/navigation/navbar/navbar-item.js +2 -2
- package/dist/collection/components/navigation/navbar/navbar-profile.js +3 -3
- package/dist/collection/components/navigation/navbar/navbar.js +3 -3
- package/dist/collection/components/navigation/sidebar/sidebar-item.js +5 -5
- package/dist/collection/components/navigation/sidebar/sidebar-title.js +1 -1
- package/dist/collection/components/navigation/sidebar/sidebar.js +5 -5
- package/dist/collection/components/notification/notification.js +2 -2
- package/dist/collection/components/number-indicator/number-indicator.js +1 -1
- package/dist/collection/components/overview-table/overview-table.js +1 -1
- package/dist/collection/components/pagination/pagination.js +1 -1
- package/dist/collection/components/progress-bar/progress-bar.js +1 -1
- package/dist/collection/components/radio-button/radio-button.js +2 -2
- package/dist/collection/components/search-bar/search-bar.js +1 -1
- package/dist/collection/components/search-field/search-field.js +1 -1
- package/dist/collection/components/segmented-control/segment/segment.js +1 -1
- package/dist/collection/components/segmented-control/segmented-control.js +2 -2
- package/dist/collection/components/select/single-select/select.js +3 -11
- package/dist/collection/components/select/single-select/select.js.map +1 -1
- package/dist/collection/components/slider/slider.js +2 -2
- package/dist/collection/components/spinner/spinner.js +2 -2
- package/dist/collection/components/status/status.js +1 -1
- package/dist/collection/components/stepper/step/step.js +4 -4
- package/dist/collection/components/stepper/stepper.js +2 -2
- package/dist/collection/components/switch/switch.js +1 -1
- package/dist/collection/components/table-advanced-version/filter-bar/filter-bar.js +1 -1
- package/dist/collection/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.js +2 -2
- package/dist/collection/components/table-advanced-version/filter-type-group/filter-search/filter-search.js +1 -1
- package/dist/collection/components/table-advanced-version/filter-type-group/filter-type-group.js +1 -1
- package/dist/collection/components/table-advanced-version/list/list-entry/list-entry.js +1 -1
- package/dist/collection/components/table-advanced-version/table.js +2 -2
- package/dist/collection/components/table-basic-version/table.js +1 -1
- package/dist/collection/components/tabs/tab.js +1 -1
- package/dist/collection/components/tabs/tabs.js +2 -2
- package/dist/collection/components/tag/tag.js +1 -1
- package/dist/collection/components/text-field/text-field.js +4 -4
- package/dist/collection/components/textarea/textarea.js +2 -2
- package/dist/collection/components/tooltip/tooltip.js +4 -4
- package/dist/collection/stories/setup-and-installation/faq/faq.js +1 -1
- package/dist/components/ifx-basic-table.js +1 -1
- package/dist/components/ifx-chip.js +1 -1
- package/dist/components/ifx-faq.js +1 -1
- package/dist/components/ifx-filter-accordion.js +3 -3
- package/dist/components/ifx-filter-bar.js +1 -1
- package/dist/components/ifx-filter-search.js +2 -2
- package/dist/components/ifx-filter-type-group.js +1 -1
- package/dist/components/ifx-list-entry.js +2 -2
- package/dist/components/ifx-modal.js +2 -2
- package/dist/components/ifx-navbar-item.js +2 -2
- package/dist/components/ifx-navbar-profile.js +3 -3
- package/dist/components/ifx-navbar.js +3 -3
- package/dist/components/ifx-notification.js +2 -2
- package/dist/components/ifx-number-indicator.js +1 -1
- package/dist/components/ifx-overview-table.js +2 -2
- package/dist/components/ifx-pagination.js +1 -1
- package/dist/components/ifx-progress-bar.js +1 -1
- package/dist/components/ifx-radio-button.js +1 -1
- package/dist/components/ifx-search-bar.js +2 -2
- package/dist/components/ifx-search-field.js +1 -1
- package/dist/components/ifx-segment.js +1 -1
- package/dist/components/ifx-segmented-control.js +2 -2
- package/dist/components/ifx-select.js +1 -1
- package/dist/components/ifx-set-filter.js +2 -2
- package/dist/components/ifx-sidebar-item.js +6 -6
- package/dist/components/ifx-sidebar-title.js +1 -1
- package/dist/components/ifx-sidebar.js +5 -5
- package/dist/components/ifx-slider.js +2 -2
- package/dist/components/ifx-spinner.js +2 -2
- package/dist/components/ifx-status.js +1 -1
- package/dist/components/ifx-step.js +4 -4
- package/dist/components/ifx-stepper.js +2 -2
- package/dist/components/ifx-switch.js +1 -1
- package/dist/components/ifx-tab.js +1 -1
- package/dist/components/ifx-table.js +6 -6
- package/dist/components/ifx-tabs.js +2 -2
- package/dist/components/ifx-tag.js +1 -1
- package/dist/components/ifx-text-field.js +1 -1
- package/dist/components/ifx-textarea.js +2 -2
- package/dist/components/ifx-tooltip.js +4 -4
- package/dist/components/{p-ecf8c880.js → p-12e02e47.js} +5 -5
- package/dist/components/{p-ecf8c880.js.map → p-12e02e47.js.map} +1 -1
- package/dist/components/{p-147fa378.js → p-184f1004.js} +2 -2
- package/dist/components/{p-147fa378.js.map → p-184f1004.js.map} +1 -1
- package/dist/components/{p-6062b2cd.js → p-20d5a2d5.js} +3 -3
- package/dist/components/{p-6062b2cd.js.map → p-20d5a2d5.js.map} +1 -1
- package/dist/components/{p-3f591754.js → p-7bbdeac1.js} +3 -3
- package/dist/components/{p-3f591754.js.map → p-7bbdeac1.js.map} +1 -1
- package/dist/components/{p-aecf447b.js → p-9ee4ea24.js} +2 -2
- package/dist/components/{p-aecf447b.js.map → p-9ee4ea24.js.map} +1 -1
- package/dist/components/{p-66a6b6bc.js → p-a058bdd9.js} +4 -12
- package/dist/components/p-a058bdd9.js.map +1 -0
- package/dist/components/{p-3fe9ad26.js → p-d57db1c4.js} +2 -2
- package/dist/components/{p-3fe9ad26.js.map → p-d57db1c4.js.map} +1 -1
- package/dist/esm/ifx-basic-table.entry.js +1 -1
- package/dist/esm/ifx-chip_3.entry.js +1 -1
- package/dist/esm/ifx-faq.entry.js +1 -1
- package/dist/esm/ifx-filter-accordion.entry.js +2 -2
- package/dist/esm/ifx-filter-bar.entry.js +1 -1
- package/dist/esm/ifx-filter-search.entry.js +1 -1
- package/dist/esm/ifx-filter-type-group.entry.js +1 -1
- package/dist/esm/ifx-list-entry.entry.js +1 -1
- package/dist/esm/ifx-modal.entry.js +2 -2
- package/dist/esm/ifx-multiselect_2.entry.js +4 -4
- package/dist/esm/ifx-navbar-item.entry.js +2 -2
- package/dist/esm/ifx-navbar-profile.entry.js +3 -3
- package/dist/esm/ifx-navbar.entry.js +3 -3
- package/dist/esm/ifx-notification.entry.js +2 -2
- package/dist/esm/ifx-number-indicator.entry.js +1 -1
- package/dist/esm/ifx-overview-table.entry.js +1 -1
- package/dist/esm/ifx-progress-bar.entry.js +1 -1
- package/dist/esm/ifx-radio-button.entry.js +2 -2
- package/dist/esm/ifx-search-bar.entry.js +1 -1
- package/dist/esm/ifx-search-field.entry.js +1 -1
- package/dist/esm/ifx-segment.entry.js +1 -1
- package/dist/esm/ifx-segmented-control.entry.js +2 -2
- package/dist/esm/ifx-select.entry.js +3 -11
- package/dist/esm/ifx-select.entry.js.map +1 -1
- package/dist/esm/ifx-sidebar-item.entry.js +5 -5
- package/dist/esm/ifx-sidebar-title.entry.js +1 -1
- package/dist/esm/ifx-sidebar.entry.js +5 -5
- package/dist/esm/ifx-slider.entry.js +2 -2
- package/dist/esm/ifx-spinner.entry.js +2 -2
- package/dist/esm/ifx-status.entry.js +1 -1
- package/dist/esm/ifx-step.entry.js +4 -4
- package/dist/esm/ifx-stepper.entry.js +2 -2
- package/dist/esm/ifx-switch.entry.js +1 -1
- package/dist/esm/ifx-tab.entry.js +1 -1
- package/dist/esm/ifx-table.entry.js +2 -2
- package/dist/esm/ifx-tabs.entry.js +2 -2
- package/dist/esm/ifx-tag.entry.js +1 -1
- package/dist/esm/ifx-textarea.entry.js +2 -2
- package/dist/esm/ifx-tooltip.entry.js +4 -4
- package/dist/esm/index-dc4139fb.js +0 -12
- package/dist/esm/infineon-design-system-stencil.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js +1 -1
- package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js.map +1 -1
- package/dist/infineon-design-system-stencil/p-030a5b46.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-10b773f0.entry.js.map → p-030a5b46.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/{p-b9d2484b.entry.js → p-0a011c63.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/p-18f5a5e3.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-7fd186f3.entry.js → p-210f9ccc.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-b25e5ad7.entry.js → p-32510d11.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-5c1596a7.entry.js → p-35d0daa5.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-b69e69b9.entry.js → p-39d2f2d1.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-7f3ca443.entry.js → p-3b99fb06.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-e5e130b7.entry.js → p-3c5a8615.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-322d20bc.entry.js → p-436babb8.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-fc081136.entry.js → p-44b2cbe1.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-fea52bc2.entry.js → p-499dba27.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-a2147bb7.entry.js → p-4fab3a1e.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-1e62f8ef.entry.js → p-53f2ab7f.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-d2a39f3c.entry.js → p-5c6d5571.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-d0afd39c.entry.js → p-6c5f0f7b.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-c593bed5.entry.js → p-6c739e13.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-2f8767b1.entry.js → p-6fdc1a34.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-3058194d.entry.js → p-72d804fb.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-60a18a26.entry.js → p-775d187b.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-15704add.entry.js → p-7f59e05a.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-ef63774d.entry.js → p-7fa8ccd3.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-a8d45ca9.entry.js → p-8a497a15.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-874482ee.entry.js → p-91f91586.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-68eb8e5a.entry.js → p-9481adc8.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/p-9ee328a5.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-1cffc36f.entry.js → p-a116e0d2.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-d3b4b20b.entry.js → p-a2d7c880.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/p-b5a3fad1.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-1de1bf3c.entry.js → p-bc8a4226.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-08b6d9c1.entry.js → p-c34f5517.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-ee055108.entry.js → p-c5daebfa.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-c456c22b.entry.js → p-c80f9282.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-f5e3fe85.entry.js → p-caff080b.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-af6d2a8f.entry.js → p-cfce9006.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/p-cfce9006.entry.js.map +1 -0
- package/dist/infineon-design-system-stencil/{p-74b1b50f.entry.js → p-d101e5a0.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-27fde7a5.entry.js → p-dc7deb14.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-0d774a43.entry.js → p-f8d7bbe2.entry.js} +2 -2
- package/dist/types/components/select/single-select/select.d.ts +0 -2
- package/dist/types/components.d.ts +0 -57
- package/package.json +1 -1
- package/dist/cjs/ifx-list-group.cjs.entry.js +0 -28
- package/dist/cjs/ifx-list-group.cjs.entry.js.map +0 -1
- package/dist/cjs/ifx-list-item.cjs.entry.js +0 -42
- package/dist/cjs/ifx-list-item.cjs.entry.js.map +0 -1
- package/dist/cjs/ifx-list-notification.cjs.entry.js +0 -87
- package/dist/cjs/ifx-list-notification.cjs.entry.js.map +0 -1
- package/dist/collection/components/list-group/list-group-item.css +0 -42
- package/dist/collection/components/list-group/list-group-item.js +0 -110
- package/dist/collection/components/list-group/list-group-item.js.map +0 -1
- package/dist/collection/components/list-group/list-group-notification.css +0 -50
- package/dist/collection/components/list-group/list-group-notification.js +0 -155
- package/dist/collection/components/list-group/list-group-notification.js.map +0 -1
- package/dist/collection/components/list-group/list-group.css +0 -9
- package/dist/collection/components/list-group/list-group.js +0 -91
- package/dist/collection/components/list-group/list-group.js.map +0 -1
- package/dist/components/ifx-list-group.d.ts +0 -11
- package/dist/components/ifx-list-group.js +0 -46
- package/dist/components/ifx-list-group.js.map +0 -1
- package/dist/components/ifx-list-item.d.ts +0 -11
- package/dist/components/ifx-list-item.js +0 -67
- package/dist/components/ifx-list-item.js.map +0 -1
- package/dist/components/ifx-list-notification.d.ts +0 -11
- package/dist/components/ifx-list-notification.js +0 -107
- package/dist/components/ifx-list-notification.js.map +0 -1
- package/dist/components/p-66a6b6bc.js.map +0 -1
- package/dist/esm/ifx-list-group.entry.js +0 -24
- package/dist/esm/ifx-list-group.entry.js.map +0 -1
- package/dist/esm/ifx-list-item.entry.js +0 -38
- package/dist/esm/ifx-list-item.entry.js.map +0 -1
- package/dist/esm/ifx-list-notification.entry.js +0 -83
- package/dist/esm/ifx-list-notification.entry.js.map +0 -1
- package/dist/infineon-design-system-stencil/p-10b773f0.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-10f15012.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-83007eb9.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-a351a04d.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-abff59ea.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-abff59ea.entry.js.map +0 -1
- package/dist/infineon-design-system-stencil/p-af6d2a8f.entry.js.map +0 -1
- package/dist/infineon-design-system-stencil/p-dd339d82.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-dd339d82.entry.js.map +0 -1
- package/dist/infineon-design-system-stencil/p-ddd9ece3.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-ddd9ece3.entry.js.map +0 -1
- package/dist/types/components/list-group/list-group-item.d.ts +0 -9
- package/dist/types/components/list-group/list-group-notification.d.ts +0 -15
- package/dist/types/components/list-group/list-group.d.ts +0 -7
- /package/dist/infineon-design-system-stencil/{p-b9d2484b.entry.js.map → p-0a011c63.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-a351a04d.entry.js.map → p-18f5a5e3.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-7fd186f3.entry.js.map → p-210f9ccc.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-b25e5ad7.entry.js.map → p-32510d11.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-5c1596a7.entry.js.map → p-35d0daa5.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-b69e69b9.entry.js.map → p-39d2f2d1.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-7f3ca443.entry.js.map → p-3b99fb06.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-e5e130b7.entry.js.map → p-3c5a8615.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-322d20bc.entry.js.map → p-436babb8.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-fc081136.entry.js.map → p-44b2cbe1.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-fea52bc2.entry.js.map → p-499dba27.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-a2147bb7.entry.js.map → p-4fab3a1e.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-1e62f8ef.entry.js.map → p-53f2ab7f.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-d2a39f3c.entry.js.map → p-5c6d5571.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-d0afd39c.entry.js.map → p-6c5f0f7b.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-c593bed5.entry.js.map → p-6c739e13.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-2f8767b1.entry.js.map → p-6fdc1a34.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-3058194d.entry.js.map → p-72d804fb.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-60a18a26.entry.js.map → p-775d187b.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-15704add.entry.js.map → p-7f59e05a.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-ef63774d.entry.js.map → p-7fa8ccd3.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-a8d45ca9.entry.js.map → p-8a497a15.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-874482ee.entry.js.map → p-91f91586.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-68eb8e5a.entry.js.map → p-9481adc8.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-83007eb9.entry.js.map → p-9ee328a5.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-1cffc36f.entry.js.map → p-a116e0d2.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-d3b4b20b.entry.js.map → p-a2d7c880.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-10f15012.entry.js.map → p-b5a3fad1.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-1de1bf3c.entry.js.map → p-bc8a4226.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-08b6d9c1.entry.js.map → p-c34f5517.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-ee055108.entry.js.map → p-c5daebfa.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-c456c22b.entry.js.map → p-c80f9282.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-f5e3fe85.entry.js.map → p-caff080b.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-74b1b50f.entry.js.map → p-d101e5a0.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-27fde7a5.entry.js.map → p-dc7deb14.entry.js.map} +0 -0
- /package/dist/infineon-design-system-stencil/{p-0d774a43.entry.js.map → p-f8d7bbe2.entry.js.map} +0 -0
@@ -1,24 +0,0 @@
|
|
1
|
-
import { r as registerInstance, h, a as Host, g as getElement } from './index-dc4139fb.js';
|
2
|
-
|
3
|
-
const listGroupCss = ":host{display:inline-flex}.list-group-container{display:inline-flex;flex-direction:column;gap:3px}";
|
4
|
-
const IfxListGroupStyle0 = listGroupCss;
|
5
|
-
|
6
|
-
const ListGroup = class {
|
7
|
-
constructor(hostRef) {
|
8
|
-
registerInstance(this, hostRef);
|
9
|
-
this.flush = false;
|
10
|
-
this.bulletpoint = false;
|
11
|
-
this.notification = false;
|
12
|
-
}
|
13
|
-
render() {
|
14
|
-
return (h(Host, { key: '5d89f65af5f1b8e1f78b88f70065c55281eb8c27' }, h("div", { key: '0ae653b5307044468d507ee9be6539a430c2103c', class: `list-group-container
|
15
|
-
${this.flush ? 'flush' : ""}
|
16
|
-
${this.bulletpoint ? 'bulletpoint' : ""}` }, h("slot", { key: 'd7cd601c0b1bfd63aa5dee3f4f657082fa1e30e3', name: 'list-item' }), h("slot", { key: '77efa54a094a8f97081f0d2dd26e527e96a3d79f', name: "list-notification" }))));
|
17
|
-
}
|
18
|
-
get el() { return getElement(this); }
|
19
|
-
};
|
20
|
-
ListGroup.style = IfxListGroupStyle0;
|
21
|
-
|
22
|
-
export { ListGroup as ifx_list_group };
|
23
|
-
|
24
|
-
//# sourceMappingURL=ifx-list-group.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"file":"ifx-list-group.entry.js","mappings":";;AAAA,MAAM,YAAY,GAAG,oGAAoG,CAAC;AAC1H,2BAAe,YAAY;;MCQd,SAAS;;;qBAEK,KAAK;2BACC,KAAK;4BACJ,KAAK;;IAGrC,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EACR;UACA,IAAI,CAAC,KAAK,GAAG,OAAO,GAAG,EAAE;UACzB,IAAI,CAAC,WAAW,GAAG,aAAa,GAAG,EAAE,EAAE,IAEvC,6DAAM,IAAI,EAAC,WAAW,GAAG,EACzB,6DAAM,IAAI,EAAC,mBAAmB,GAAG,CAC7B,CACD,EACP;KACH;;;;;;;","names":[],"sources":["src/components/list-group/list-group.scss?tag=ifx-list-group&encapsulation=shadow","src/components/list-group/list-group.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n\n:host {\n display: inline-flex;\n}\n\n.list-group-container {\n display: inline-flex;\n flex-direction: column;\n gap: 3px;\n}","import { Component, h, Element, Prop, Host } from '@stencil/core';\n \n\n@Component({\n tag: 'ifx-list-group',\n styleUrl: 'list-group.scss',\n shadow: true,\n})\n\nexport class ListGroup {\n @Element() el;\n @Prop() flush: boolean = false;\n @Prop() bulletpoint: boolean = false;\n @Prop() notification: boolean = false;\n\n\n render() {\n return (\n <Host>\n <div class={\n `list-group-container \n ${this.flush ? 'flush' : \"\"} \n ${this.bulletpoint ? 'bulletpoint' : \"\"}`\n }>\n <slot name='list-item' />\n <slot name=\"list-notification\" />\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|
@@ -1,38 +0,0 @@
|
|
1
|
-
import { r as registerInstance, h, g as getElement } from './index-dc4139fb.js';
|
2
|
-
|
3
|
-
const listGroupItemCss = "@charset \"UTF-8\";.list-group-item{display:flex;align-items:center;justify-content:space-between;height:40px;width:350px;padding:8px 16px;background-color:#FFFFFF;border:1px solid #EEEDED;border-radius:1px 1px 0px 0px;font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;font-family:var(--ifx-font-family)}.list-group-item.flush{border:none;border-bottom:1px solid #EEEDED}.list-group-item.flush.bulletpoint{padding:8px}.list-group-item.bulletpoint .list-group-item-content::before{content:\"•\";display:inline-block;font-size:1.125rem;padding-right:10px}.list-group-item:hover:not(.show){background-color:#EEEDED}.list-group-item:active:not(.show){background-color:#0A8276;color:#FFFFFF}.list-group-item.show{display:block;height:88px;padding:16px}";
|
4
|
-
const IfxListItemStyle0 = listGroupItemCss;
|
5
|
-
|
6
|
-
const ListGroupItem = class {
|
7
|
-
constructor(hostRef) {
|
8
|
-
registerInstance(this, hostRef);
|
9
|
-
this.isFlush = false;
|
10
|
-
this.hasBulletpoint = false;
|
11
|
-
this.badge = false;
|
12
|
-
this.badgeValue = 0;
|
13
|
-
}
|
14
|
-
componentWillLoad() {
|
15
|
-
const ifxListGroup = this.el.closest('ifx-list-group');
|
16
|
-
if (ifxListGroup.flush) {
|
17
|
-
this.isFlush = true;
|
18
|
-
}
|
19
|
-
else
|
20
|
-
this.isFlush = false;
|
21
|
-
if (ifxListGroup.bulletpoint && !this.badge) {
|
22
|
-
this.hasBulletpoint = true;
|
23
|
-
}
|
24
|
-
else
|
25
|
-
this.hasBulletpoint = false;
|
26
|
-
}
|
27
|
-
render() {
|
28
|
-
return (h("div", { key: 'd50beef84939fea9d25bd5a7a0450683f4580f89', class: `list-group-item
|
29
|
-
${this.isFlush ? 'flush' : ""}
|
30
|
-
${this.hasBulletpoint ? 'bulletpoint' : ""}` }, h("div", { key: '56373799f79b2379fb0f22ef0f2abf8468bd74c9', class: "list-group-item-content" }, h("slot", { key: '2080edc3978491aa3abd0de9dff866f5d8582a4b' })), this.badge && h("ifx-number-indicator", { key: '212364a9efd52a75d47f453c7652574c2332082c' }, this.badgeValue)));
|
31
|
-
}
|
32
|
-
get el() { return getElement(this); }
|
33
|
-
};
|
34
|
-
ListGroupItem.style = IfxListItemStyle0;
|
35
|
-
|
36
|
-
export { ListGroupItem as ifx_list_item };
|
37
|
-
|
38
|
-
//# sourceMappingURL=ifx-list-item.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"file":"ifx-list-item.entry.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,+vBAA+vB,CAAC;AACzxB,0BAAe,gBAAgB;;MCOlB,aAAa;;;uBAEoB,KAAK;8BACd,KAAK;qBACf,KAAK;0BACD,CAAC;;IAE9B,iBAAiB;QACf,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAA;QACtD,IAAI,YAAY,CAAC,KAAK,EAAE;YACtB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;SACrB;;YAAM,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QAE5B,IAAI,YAAY,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YAC3C,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;SAC5B;;YAAM,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;KACpC;IAED,MAAM;QACJ,QACE,4DAAK,KAAK,EACR;UACE,IAAI,CAAC,OAAO,GAAG,OAAO,GAAG,EAAE;UAC3B,IAAI,CAAC,cAAc,GAAG,aAAa,GAAG,EAAE,EAAE,IAC5C,4DAAK,KAAK,EAAC,yBAAyB,IAClC,8DAAQ,CACJ,EACL,IAAI,CAAC,KAAK,IAAI,+EAAuB,IAAI,CAAC,UAAU,CAAwB,CACzE,EACN;KACH;;;;;;;","names":[],"sources":["src/components/list-group/list-group-item.scss?tag=ifx-list-item&encapsulation=shadow","src/components/list-group/list-group-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.list-group-item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: tokens.$ifxSize500;\n width: 350px;\n padding: 8px 16px;\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid tokens.$ifxColorEngineering200;\n border-radius: 1px 1px 0px 0px;\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n font-family: var(--ifx-font-family);\n\n &.flush {\n border: none;\n border-bottom: 1px solid tokens.$ifxColorEngineering200;\n\n &.bulletpoint {\n padding: 8px;\n }\n }\n\n &.bulletpoint {\n & .list-group-item-content::before {\n content: \"•\";\n display: inline-block;\n font-size: tokens.$ifxFontSizeL;\n padding-right: 10px;\n }\n }\n\n &:hover:not(.show) {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &:active:not(.show) {\n background-color: tokens.$ifxColorOcean500;\n color: tokens.$ifxColorBaseWhite;\n }\n\n &.show {\n display: block;\n height: 88px;\n padding: 16px;\n }\n}","import { Component, h, Element, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list-item',\n styleUrl: 'list-group-item.scss',\n shadow: true,\n})\n\nexport class ListGroupItem {\n @Element() el;\n @Prop({ mutable: true }) isFlush: boolean = false;\n @State() hasBulletpoint: boolean = false;\n @Prop() badge: boolean = false;\n @Prop() badgeValue: number = 0;\n\n componentWillLoad() {\n const ifxListGroup = this.el.closest('ifx-list-group')\n if (ifxListGroup.flush) {\n this.isFlush = true;\n } else this.isFlush = false;\n\n if (ifxListGroup.bulletpoint && !this.badge) {\n this.hasBulletpoint = true;\n } else this.hasBulletpoint = false;\n }\n\n render() {\n return (\n <div class={\n `list-group-item \n ${this.isFlush ? 'flush' : \"\"}\n ${this.hasBulletpoint ? 'bulletpoint' : \"\"}`}>\n <div class=\"list-group-item-content\">\n <slot />\n </div>\n {this.badge && <ifx-number-indicator>{this.badgeValue}</ifx-number-indicator>}\n </div>\n );\n }\n}\n"],"version":3}
|
@@ -1,83 +0,0 @@
|
|
1
|
-
import { r as registerInstance, h, g as getElement } from './index-dc4139fb.js';
|
2
|
-
|
3
|
-
const listGroupNotificationCss = ".list-group-notification{width:350px;height:88px;padding:16px;margin-bottom:8px;background-color:#FFFFFF;border:1px solid #EEEDED;font-family:var(--ifx-font-family)}.list-group-notification .description__section{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.list-group-notification.flush{border:none;border-bottom:1px solid #EEEDED}.list-group-notification .heading__section{display:flex;justify-content:space-between;margin-bottom:8px;color:#0A8276}.list-group-notification .heading__section-title{flex:1;margin:0;font-weight:600;line-height:1.2;font-size:1rem;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.list-group-notification .heading__section-time{flex:none;margin-left:2px;font-size:0.875rem;line-height:1.25rem;font-weight:400;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}";
|
4
|
-
const IfxListNotificationStyle0 = listGroupNotificationCss;
|
5
|
-
|
6
|
-
const ListGroupNotification = class {
|
7
|
-
constructor(hostRef) {
|
8
|
-
registerInstance(this, hostRef);
|
9
|
-
this.titleText = "";
|
10
|
-
this.isFlush = false;
|
11
|
-
this.creationTime = undefined;
|
12
|
-
this.postTime = undefined;
|
13
|
-
this.shownTime = undefined;
|
14
|
-
}
|
15
|
-
setDisplayTime(seconds, minutes, hours, days) {
|
16
|
-
if (seconds <= 60) {
|
17
|
-
this.shownTime = `Just now`;
|
18
|
-
}
|
19
|
-
else if (minutes <= 60) {
|
20
|
-
this.shownTime = `${minutes} min. ago`;
|
21
|
-
}
|
22
|
-
else if (hours <= 24) {
|
23
|
-
this.shownTime = hours > 1 ? `${hours} hr. ago` : `${hours} hrs. ago`;
|
24
|
-
}
|
25
|
-
else if (days) {
|
26
|
-
this.shownTime = hours < 48 ? `1 day ago` : `${days} days ago`;
|
27
|
-
if (hours > 168) {
|
28
|
-
this.shownTime = `${new Date().getDay()}.${new Date().getMonth()}.${new Date().getFullYear()}`;
|
29
|
-
}
|
30
|
-
}
|
31
|
-
}
|
32
|
-
stringToDate(dataString) {
|
33
|
-
if (!dataString)
|
34
|
-
return null;
|
35
|
-
let dateParts = dataString.split("/");
|
36
|
-
if (dateParts[2]) {
|
37
|
-
if (dateParts[2].split(" ")[1]) {
|
38
|
-
let timeParts = dateParts[2].split(" ")[1].split(":");
|
39
|
-
dateParts[2] = dateParts[2].split(" ")[0];
|
40
|
-
return new Date(+dateParts[2], dateParts[1] - 1, +dateParts[0], timeParts[0], timeParts[1], timeParts[2]);
|
41
|
-
}
|
42
|
-
}
|
43
|
-
}
|
44
|
-
getElapsedTime(time) {
|
45
|
-
let date = this.stringToDate(time);
|
46
|
-
if (date) {
|
47
|
-
let miliseconds = Date.now() - date.getTime();
|
48
|
-
let seconds = Math.floor(miliseconds / 1000);
|
49
|
-
let minutes = Math.floor(miliseconds / 60000);
|
50
|
-
let hours = Math.floor(minutes / 60);
|
51
|
-
let days = Math.floor(hours / 24);
|
52
|
-
this.setDisplayTime(seconds, minutes, hours, days);
|
53
|
-
}
|
54
|
-
}
|
55
|
-
setTimeInterval(time) {
|
56
|
-
this.postTime = window.setInterval(() => {
|
57
|
-
this.getElapsedTime(time);
|
58
|
-
}, 1000);
|
59
|
-
}
|
60
|
-
;
|
61
|
-
componentWillLoad() {
|
62
|
-
this.getElapsedTime(this.creationTime);
|
63
|
-
this.setTimeInterval(this.creationTime); //if time update on refresh, delete this & clear interval
|
64
|
-
const ifxListGroup = this.el.closest('ifx-list-group');
|
65
|
-
if (ifxListGroup.flush) {
|
66
|
-
this.isFlush = true;
|
67
|
-
}
|
68
|
-
else
|
69
|
-
this.isFlush = false;
|
70
|
-
}
|
71
|
-
disconnectedCallback() {
|
72
|
-
window.clearInterval(this.postTime);
|
73
|
-
}
|
74
|
-
render() {
|
75
|
-
return (h("div", { key: '91e1c400374162be139fed99ce0d7e4495b46eb6', class: `list-group-notification ${this.isFlush ? 'flush' : ""}` }, h("div", { key: 'f15575375e0698d0bedb1989e86bfcc24347d1a6', class: "heading__section" }, h("h6", { key: 'ea441212ebfe13f6d2714417dbe3f2770598fd6d', class: "heading__section-title" }, this.titleText), h("div", { key: '0dffec118ce4c588e992531d68492382ad20476d', class: "heading__section-time" }, this.shownTime)), h("div", { key: '063ccfbb83b2a2d839e6e230ec88fba4b9d59a1d', class: "description__section" }, h("slot", { key: 'e449dec2d47fba283a71b1f284963652d39b8ac8' }))));
|
76
|
-
}
|
77
|
-
get el() { return getElement(this); }
|
78
|
-
};
|
79
|
-
ListGroupNotification.style = IfxListNotificationStyle0;
|
80
|
-
|
81
|
-
export { ListGroupNotification as ifx_list_notification };
|
82
|
-
|
83
|
-
//# sourceMappingURL=ifx-list-notification.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"file":"ifx-list-notification.entry.js","mappings":";;AAAA,MAAM,wBAAwB,GAAG,48BAA48B,CAAC;AAC9+B,kCAAe,wBAAwB;;MCO1B,qBAAqB;;;yBAEJ,EAAE;uBACH,KAAK;;;;;IAKhC,cAAc,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI;QAC1C,IAAI,OAAO,IAAI,EAAE,EAAE;YACjB,IAAI,CAAC,SAAS,GAAG,UAAU,CAAA;SAC5B;aAAM,IAAI,OAAO,IAAI,EAAE,EAAE;YACxB,IAAI,CAAC,SAAS,GAAG,GAAG,OAAO,WAAW,CAAA;SACvC;aAAM,IAAI,KAAK,IAAI,EAAE,EAAE;YACtB,IAAI,CAAC,SAAS,GAAG,KAAK,GAAG,CAAC,GAAG,GAAG,KAAK,UAAU,GAAG,GAAG,KAAK,WAAW,CAAA;SACtE;aAAM,IAAI,IAAI,EAAE;YACf,IAAI,CAAC,SAAS,GAAG,KAAK,GAAG,EAAE,GAAG,WAAW,GAAG,GAAG,IAAI,WAAW,CAAA;YAC9D,IAAI,KAAK,GAAG,GAAG,EAAE;gBACf,IAAI,CAAC,SAAS,GAAG,GAAG,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,IAAI,IAAI,IAAI,EAAE,CAAC,QAAQ,EAAE,IAAI,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE,EAAE,CAAA;aAC/F;SACF;KACF;IAED,YAAY,CAAC,UAAU;QACrB,IAAI,CAAC,UAAU;YAAE,OAAO,IAAI,CAAA;QAC5B,IAAI,SAAS,GAAG,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACtC,IAAI,SAAS,CAAC,CAAC,CAAC,EAAE;YAChB,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE;gBAC9B,IAAI,SAAS,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;gBACtD,SAAS,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC1C,OAAO,IAAI,IAAI,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;aAC3G;SACF;KACF;IAED,cAAc,CAAC,IAAI;QACjB,IAAI,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAA;QAClC,IAAI,IAAI,EAAE;YACR,IAAI,WAAW,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,OAAO,EAAE,CAAA;YAC7C,IAAI,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;YAC7C,IAAI,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,KAAK,CAAC,CAAC;YAC9C,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC,CAAC;YACrC,IAAI,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC;YAClC,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,CAAA;SACnD;KACF;IAED,eAAe,CAAC,IAAI;QAClB,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,WAAW,CAAC;YACjC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAA;SAC1B,EAAE,IAAI,CAAC,CAAA;KACT;;IAED,iBAAiB;QACf,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;QACtC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;QACvC,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAA;QACtD,IAAI,YAAY,CAAC,KAAK,EAAE;YACtB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;SACrB;;YAAM,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;KAC7B;IAED,oBAAoB;QAClB,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;KACrC;IAED,MAAM;QACJ,QACE,4DAAK,KAAK,EAAE,2BAA2B,IAAI,CAAC,OAAO,GAAG,OAAO,GAAG,EAAE,EAAE,IAClE,4DAAK,KAAK,EAAC,kBAAkB,IAC3B,2DAAI,KAAK,EAAC,wBAAwB,IAAE,IAAI,CAAC,SAAS,CAAM,EACxD,4DAAK,KAAK,EAAC,uBAAuB,IAAE,IAAI,CAAC,SAAS,CAAO,CACrD,EACN,4DAAK,KAAK,EAAC,sBAAsB,IAC/B,8DAAQ,CACJ,CACF,EACN;KACH;;;;;;;","names":[],"sources":["src/components/list-group/list-group-notification.scss?tag=ifx-list-notification&encapsulation=shadow","src/components/list-group/list-group-notification.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.list-group-notification {\n width: 350px;\n height: 88px;\n padding: 16px;\n margin-bottom: 8px;\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid tokens.$ifxColorEngineering200;\n font-family: var(--ifx-font-family);\n\n & .description__section {\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &.flush {\n border: none;\n border-bottom: 1px solid tokens.$ifxColorEngineering200;\n }\n\n & .heading__section {\n display: flex;\n justify-content: space-between;\n margin-bottom: 8px;\n color: tokens.$ifxColorOcean500;\n }\n\n & .heading__section-title {\n flex: 1;\n margin: 0;\n font-weight: tokens.$ifxFontWeightSemibold;\n line-height: 1.2;\n font-size: tokens.$ifxFontSizeM;\n\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n & .heading__section-time {\n flex: none;\n margin-left: 2px;\n font-size: tokens.$ifxFontSizeS;\n line-height: tokens.$ifxLineHeightS;\n font-weight: 400;\n\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}","import { Component, h, Element, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list-notification',\n styleUrl: 'list-group-notification.scss',\n shadow: true,\n})\n\nexport class ListGroupNotification {\n @Element() el;\n @Prop() titleText: string = \"\"\n @Prop() isFlush: boolean = false;\n @Prop() creationTime: any;\n @State() postTime: number;\n @State() shownTime: string;\n\n setDisplayTime(seconds, minutes, hours, days) {\n if (seconds <= 60) {\n this.shownTime = `Just now`\n } else if (minutes <= 60) {\n this.shownTime = `${minutes} min. ago`\n } else if (hours <= 24) {\n this.shownTime = hours > 1 ? `${hours} hr. ago` : `${hours} hrs. ago`\n } else if (days) {\n this.shownTime = hours < 48 ? `1 day ago` : `${days} days ago`\n if (hours > 168) {\n this.shownTime = `${new Date().getDay()}.${new Date().getMonth()}.${new Date().getFullYear()}`\n }\n }\n }\n\n stringToDate(dataString) {\n if (!dataString) return null\n let dateParts = dataString.split(\"/\");\n if (dateParts[2]) {\n if (dateParts[2].split(\" \")[1]) {\n let timeParts = dateParts[2].split(\" \")[1].split(\":\");\n dateParts[2] = dateParts[2].split(\" \")[0];\n return new Date(+dateParts[2], dateParts[1] - 1, +dateParts[0], timeParts[0], timeParts[1], timeParts[2]);\n }\n }\n }\n\n getElapsedTime(time) {\n let date = this.stringToDate(time)\n if (date) {\n let miliseconds = Date.now() - date.getTime()\n let seconds = Math.floor(miliseconds / 1000);\n let minutes = Math.floor(miliseconds / 60000);\n let hours = Math.floor(minutes / 60);\n let days = Math.floor(hours / 24);\n this.setDisplayTime(seconds, minutes, hours, days)\n }\n }\n\n setTimeInterval(time) {\n this.postTime = window.setInterval(() => {\n this.getElapsedTime(time)\n }, 1000)\n };\n\n componentWillLoad() {\n this.getElapsedTime(this.creationTime)\n this.setTimeInterval(this.creationTime) //if time update on refresh, delete this & clear interval\n const ifxListGroup = this.el.closest('ifx-list-group')\n if (ifxListGroup.flush) {\n this.isFlush = true;\n } else this.isFlush = false;\n }\n\n disconnectedCallback() {\n window.clearInterval(this.postTime);\n }\n\n render() {\n return (\n <div class={`list-group-notification ${this.isFlush ? 'flush' : \"\"}`}>\n <div class=\"heading__section\">\n <h6 class=\"heading__section-title\">{this.titleText}</h6>\n <div class=\"heading__section-time\">{this.shownTime}</div>\n </div>\n <div class=\"description__section\">\n <slot />\n </div>\n </div>\n );\n }\n}\n"],"version":3}
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as e,c,h as i,g as t}from"./p-6b122987.js";const s=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-block;user-select:none}.container{display:flex;flex-direction:row;align-items:center}.container.gap{gap:16px}.switch__checkbox-container{padding:4px;display:flex;align-items:center;position:relative;width:32px;height:16px;background-color:#FFFFFF;border:1px solid #575352;border-radius:20px;cursor:pointer;transition:background-color 0.3s ease;outline:none}.switch__checkbox-container:focus{outline:4px solid #0A8276;outline-offset:2px}.switch__checkbox-container:focus:not(:focus-visible){outline:none}.switch__checkbox-container:focus-visible{outline:2px solid #0A8276;outline-offset:2px}.switch__checkbox-container.disabled{cursor:default;border-color:#BFBBBB}.switch__label-wrapper label:hover{cursor:pointer}.switch__label-wrapper.disabled{color:#BFBBBB}.switch__checkbox-wrapper .switch{width:16px;height:16px;background-color:#575352;border-radius:50%;transition:transform 0.3s ease, background-color 0.3s ease}.switch__checkbox-wrapper .switch.disabled{background-color:#BFBBBB;border-color:#BFBBBB;cursor:default}.switch__checkbox-wrapper .switch.checked{transform:translateX(16px);background-color:#FFFFFF}.switch__checkbox-wrapper .switch.checked.disabled{cursor:default}.switch__checkbox-container:hover .toggle-switch{box-shadow:0 0 5px rgba(0, 0, 0, 0.2)}.switch__checkbox-container.checked{background-color:#0A8276;border-color:#0A8276}.switch__checkbox-container.checked.disabled{background-color:#BFBBBB;border-color:#BFBBBB;cursor:default}';const o=s;const a=class{constructor(i){e(this,i);this.ifxChange=c(this,"ifxChange",7);if(i.$hostElement$["s-ei"]){this.internals=i.$hostElement$["s-ei"]}else{this.internals=i.$hostElement$.attachInternals();i.$hostElement$["s-ei"]=this.internals}this.checked=false;this.name="";this.disabled=false;this.value=undefined;this.internalChecked=false}async isChecked(){return this.internalChecked}componentWillLoad(){this.internalChecked=this.checked}toggleLabelGap(){const e=this.el.shadowRoot.querySelector("slot");const c=this.el.shadowRoot.querySelector(".container");if(e.assignedNodes().length){c.classList.add("gap")}else{c.classList.remove("gap")}}componentDidLoad(){this.toggleLabelGap()}valueChanged(e,c){if(e!==c){this.internalChecked=e}}toggleSwitch(){if(this.disabled)return;this.internalChecked=!this.internalChecked;if(this.internalChecked){if(this.value!==undefined){this.internals.setFormValue(this.value)}else{this.internals.setFormValue("on")}}else{this.internals.setFormValue(null)}this.ifxChange.emit(this.internalChecked)}handleKeyDown(e){if(this.disabled)return;if(e.key==="Enter"||e.key===" "){this.toggleSwitch()}}formResetCallback(){this.internals.setFormValue(null)}render(){return i("div",{key:"16d5d06fafa337fd6beac9ace18322ab5727968f",class:"container",role:"switch","aria-checked":this.internalChecked?"true":"false","aria-label":this.name,onClick:()=>this.toggleSwitch(),onKeyDown:e=>this.handleKeyDown(e)},i("div",{key:"79dc45173c4a30f01075c4294771181bdfe18423",class:`switch__checkbox-container ${this.internalChecked?"checked":""} ${this.disabled?"disabled":""}`,tabindex:"0"},i("div",{key:"8aee9283fdd91234ba4c19d37a38de74f244445a",class:"switch__checkbox-wrapper"},i("input",{key:"8d1c55b322721fecce9b4015a91410760a8cb469",type:"checkbox",hidden:true,name:this.name,disabled:this.disabled,checked:this.internalChecked,value:`${this.value}`}),i("div",{key:"34c9e0a329a4b326adbf9d5372cd43ff0c3645a5",class:`switch ${this.internalChecked?"checked":""} ${this.disabled?"disabled":""}`}))),i("div",{key:"a27b19ca30180b0ff29c2c5bff8e59a8c98bb417",class:`switch__label-wrapper ${this.disabled?"disabled":""}`},i("label",{key:"502e523b69a2bb3007eb7023321904848c1e6c1a",htmlFor:"switch"},i("slot",{key:"46adc952c72ee5320bc26c1ed1e41d1ef52857af",onSlotchange:()=>this.toggleLabelGap()}))))}static get formAssociated(){return true}get el(){return t(this)}static get watchers(){return{checked:["valueChanged"]}}};a.style=o;export{a as ifx_switch};
|
2
|
-
//# sourceMappingURL=p-10b773f0.entry.js.map
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as e,h as t,g as r}from"./p-6b122987.js";const a=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{position:relative}.sidebar__title{width:100%;height:fit-content;border-top:1px solid #EEEDED;padding:12px 0}.sidebar__title.no-top-border{border-top:none}.sidebar__title-label{height:20px;font:600 0.875rem/1.25rem "Source Sans 3";text-transform:uppercase;color:#575352;letter-spacing:3px}';const i=a;const s=class{constructor(t){e(this,t)}render(){return t("div",{key:"6a42cc97dadcab602872bda9d993f9bf7c12b199",class:"sidebar__title"},t("div",{key:"ebd8129870e6d9541b5053e194fe6e271aec9e3a",class:"sidebar__title-label"},t("slot",{key:"c27949801198f4eeb0495b8aebcbdda6576859a8"})))}get el(){return r(this)}};s.style=i;export{s as ifx_sidebar_title};
|
2
|
-
//# sourceMappingURL=p-10f15012.entry.js.map
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as t,c as s,h as e,g as i}from"./p-6b122987.js";const n=":host{display:block}";const a=n;const o=class{constructor(e){t(this,e);this.tabHeaderChange=s(this,"tabHeaderChange",7);this.header=undefined;this.disabled=undefined;this.icon="";this.iconPosition="left"}componentWillUpdate(){this.tabHeaderChange.emit(this.header)}render(){return e("slot",{key:"32b2746133a9943640f4c6171d368a2be9b0fe1e"})}get el(){return i(this)}};o.style=a;export{o as ifx_tab};
|
2
|
-
//# sourceMappingURL=p-83007eb9.entry.js.map
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as e,h as c,g as a}from"./p-6b122987.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=d;const b=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.innerHTML=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.innerHTML=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.innerHTML=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:"58bcc3c924c8fda2264d16b88d10de0c1f257383",class:"container"},c("header",{key:"c649fb556fefc3d8f90cdc3d7302ee98e1edf482",class:"header"},c("div",{key:"55941472401417773dc18831d2b7f3c17adbf41c",class:"header__info-wrapper"},c("div",{key:"cfc5c58cf8dfa433848e79127da1ff488dab8738",class:"title"},"DDS Components Overview"),c("div",{key:"3c716164a73c23c10d91d3de8f4f3d7372d56f9b",class:"infoboard__wrapper"},c("div",{key:"0351dc1fcaf3c2aa2252aa772060fa65325717d1",class:"basic__info"},c("div",{key:"22c0ca81cbe88be25839a747c4b0a044d9d38424"},"Total Number:"),c("div",{key:"69bf8387c96a741e1fe8c45055f34ad9ba72cc6a"},c("ifx-number-indicator",{key:"25e3cf73e1ca88f5fb969ff9ec50e6a279c8cfa9",id:"number__indicator-total"}))),c("div",{key:"43e0b04c8f4fd626d35d06517aea71ac7c90fee7",class:"basic__info"},c("div",{key:"85f56e1a5cb772a480fcb432d72eebb6d4998176"},"Completed:"),c("div",{key:"91c497ed8be6052519ccb55702cf6afaa413dffc"},c("ifx-number-indicator",{key:"115782a1273751cf92ba4253f3c3736599d7f50a",id:"number__indicator-completed"}))),c("div",{key:"53a35a69e1d5ad5c9b05a57ca8b3f92ff97b3320",class:"basic__info"},c("div",{key:"bade786e668266a066055cbe0dbf25e43d85654f"},"In Progress:"),c("div",{key:"c68b08ed0c7f0cf07cb06d7b73c0a3dc4dbb4724"},c("ifx-number-indicator",{key:"dfc5ea00421e50157e60a7eb9f4665d21582812c",id:"number__indicator-planned"})))))),c("div",{key:"025dbb4cc97976311123ff6d9b48bb06f736e071",class:"view"},c("div",{key:"3cf15283971a0a2c4ffa4d640102a88d9cdb2f56",class:"wrapper"},c("table",{key:"a744c17e710402b8918653bd077fe74d4a2210a8"},c("thead",{key:"17a42ce736998401e1414200632696188d4b36ec"},c("tr",{key:"5861a807134e8d3b052f2db6be6329ced5c50e91"},c("th",{key:"bc2259efacb54972dadd7af8d7b0f384307f18ad",class:"sticky-col second-col"},"Component"),c("th",{key:"783f5127a4e6b4971fe6d275d0eb6894ec771fef"},c("div",{key:"54fc70f2248b121a89ba67300aaf747c7c1a6480",class:"version__wrapper"},c("span",{key:"20022bd2e880000b1155f34683ddae50f4eba3da"},"Version 1"))),c("th",{key:"8b97836da1fe317f2e5177384629878380656da9"},c("div",{key:"74a6bee8b644fc1a34f2d599c8c6b397920ed586",class:"version__wrapper"},c("span",{key:"0590e77fc0d8790fe6a8f3bcc8a5c8723bdc0111"},"Version 2"))),c("th",{key:"af82c826bf1cc0201e0ad1db9b7d3ded4fed7a49"},"Version 3"))),c("tbody",{key:"db38c90f3b8a3e7e89670f946ba3b166f31939dd"},c("tr",{key:"00d4b410b0834d91e9b97025264087c630009aa2"},c("td",{key:"28815c2be9cc3a6765794a5c3a2fb41dc631e6ab",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8db368f2f0d40c582f76796a3c5e5b066673e9c2",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-accordion--development",size:"s",variant:"bold"},"Accordion")),c("td",{key:"f88b7382ee4e3e06be35473bd512be9ede2469e8"},c("ul",{key:"9903cbfa52325178b426df4fcbc159857fcc477f"},c("li",{key:"6b77c1fa9ed149bc9309fa63d93e54ceb17df4e4"},c("span",{key:"0ea1bbd6e45902a1a6757d88c445608953952b9b"},c("ifx-icon",{key:"4089a5c2d044b8bdc85869277c95db9df0db3b7b",class:"check__icon",icon:"check12"})),c("span",{key:"c80780e0fc654edd8df9def86ada555cfd671a03"},"Includes essential functionality such as expand/collapse behavior and minimal customization options")),c("li",{key:"2654bf13e33b0e28ae9e37b0d9b09a1de6363460"},c("span",{key:"3a46b65b21c09fda3f48046914e97d8d527744fd"},c("ifx-icon",{key:"c2b6b6807b180670a3187907aacd73acb8051581",class:"check__icon",icon:"check12"})),c("span",{key:"08f0d73844db534e1a8c6bad130f50a7ea85d0e0"},"Adheres to web standards")),c("li",{key:"4f6f2601bba527c0729486e14ef87cbed9808845"},c("span",{key:"ebec6a932f939349973760153286eb11b7f2e640"},c("ifx-icon",{key:"40a5097233d6b836b6590b9e71bc8514dac4e169",class:"check__icon",icon:"check12"})),c("span",{key:"602220a6fa4ed0c6f7dd3f7d1fc3254f3a518c48"},"Provides a simple and lightweight way to organize and display collapsible content")))),c("td",{key:"6d6d3f28f46e8f8011e8d999b18804a72a03be52"},c("ul",{key:"04f7f72b405a2e0be62d351ef3bf500a1bd3d260"},c("li",{key:"972122ad4b03e1cd29695670499bdf717881b8e4"},c("span",{key:"de370d308d50e78c93877799b12659ed49392444"},c("ifx-icon",{key:"d04e03d6ca8497c11de7ca9094fe88dc46bc54e4",class:"check__icon",icon:"check12"})),c("span",{key:"68252eec74314008daf2a5bcb9c15375c82a0bb7"},"Auto collapse feature")),c("li",{key:"9ee41de115bdfd98f1377a76ab57db0ecabaaf34"},c("span",{key:"e133cec4d6b1dbaca4120ebe432d0d11facf2eb9"},c("ifx-icon",{key:"987eea46ba7bf50b10e0ac6371129e95f61dfea1",class:"check__icon",icon:"check12"})),c("span",{key:"b1abbe6539a608bdddf73ab261fc1ff9649a89eb"},"Initial collapse feature")),c("li",{key:"ee9f53413ff326b0d7f018204ce1da412a962637"},c("span",{key:"a5e91065043524e47706a7f2a087bb2309888d6a"},c("ifx-icon",{key:"d782424c30af7bc9d59eb7b95c86b45ebbe1eb80",class:"check__icon",icon:"check12"})),c("span",{key:"0febdb92056d0e94954abfcb075d855119a5c3b7"},"React, Vue and Angular wrapper integration")))),c("td",{key:"1821c8c2220c6b660c7bffe037b270ff540f37f0"})),c("tr",{key:"a27ec8c79bb44a51cd9dd121595221e9b5a6f03a"},c("td",{key:"261fb95278e5120588fe378569e66487cf884df1",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"39da978c3e351bee80d8a9265bbbaac08d0e3889",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-alert--development",size:"s",variant:"bold"},"Alert")),c("td",{key:"febd7a3a2416c69a5c1c034f50d825bfa763a6e1"},c("ul",{key:"3dbf5090cfc2d9447e4fe8a64171c31c4888f1ca"},c("li",{key:"fd51155900a60adc01c255a529363ae90645fbc8"},c("span",{key:"422a3000343a65c3d65122e23aa302b36a3ad3de"},c("ifx-icon",{key:"7411adfac4674c0a16df2f7189551304dbdafdac",class:"check__icon",icon:"check12"})),c("span",{key:"c2a8cae06c78bd23e35c8c35694b497417ae7a62"},"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:"b80cea32a97c1b53b455fcf62d2c713f58e3ae91"},c("span",{key:"41b9ef533dd92e580715caec63aecb3d86e62e84"},c("ifx-icon",{key:"07e2bfa7f84beee6f452ee78fc69965567483647",class:"check__icon",icon:"check12"})),c("span",{key:"a2ca0d142a9decb98121d55ae5e39c2ef08cb0be"},"Adheres to web standards")))),c("td",{key:"e1b69cf274ae0e696169dcdfe81e32c6e71070ac"},c("ul",{key:"48d45ff945fe5dc9819f61e7f9020690d6d96ecb"},c("li",{key:"fd154f7ada345eaf0c67c16ed3d6c6515cf830b0"},c("span",{key:"a19cd1ed35fd1ae7321e07bb43bbedbed4cd2e33"},c("ifx-icon",{key:"9fdfa1b1e669aafef03fcae9ee6acacf84fb5822",class:"check__icon",icon:"check12"})),c("span",{key:"ea48985726986eef19b0f493d1e08d3c160182cd"},"Configurable close button")),c("li",{key:"7efd4511cd34ff592e2ec3239e5dfb1ad21562a3"},c("span",{key:"738176312bd671a15747bc8ae9353a9598c6a61e"},c("ifx-icon",{key:"bd5cf42e04ca36f4ab0f15ee84d207563ee5597e",class:"check__icon",icon:"check12"})),c("span",{key:"f21ac4d20c76569ad92dc0b210463aa239f03e0d"},"Additional Info variant")),c("li",{key:"a8010658168244e38f19214dfdfe59204ca94cae"},c("span",{key:"0080a29136b8eae5a0976537ba4c79337ad12b8c"},c("ifx-icon",{key:"c41c35242fb7a9bc7231ea063b2ecfe44bc80dd0",class:"check__icon",icon:"check12"})),c("span",{key:"7bd7072b7199a0dce0c4c571cf844520cf97c21d"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c5e00193d59c495bb76b7fcf5d6bd2c36f75aabc"})),c("tr",{key:"c897e44fcbb10b1b74882c14b4be6ff750ded301"},c("td",{key:"8582b92260f1a5f21d5bb16394955840be0d7116",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"86ee3bffa4514312757f16f8191581c07856253d",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-badge--development",size:"s",variant:"bold"},"Badge")),c("td",{key:"4b4239b94e527bd1ddc159a0df090e9ca608806f"},c("ul",{key:"3b99a36780263daf54f05a535663746095c4daf9"},c("li",{key:"1385c83273f4c72e81184879a63c5c9a5d314662"},c("span",{key:"7c193393a8b51eac098b7f6f07db3290253acab7"},c("ifx-icon",{key:"bae2a32bab237cce925d9dc05cd211fc24cb644b",class:"check__icon",icon:"check12"})),c("span",{key:"91b0d4e54efd2de137595912f305efe4b05f334f"},"Offers simple customization options for displaying badges, allowing developers to indicate specific actions, statuses, or categories with visual cues")),c("li",{key:"c1e22cf6d9f47bf23a324aaea7520867efebd616"},c("span",{key:"12a12ccb3863774456163f471cba02e33faa32ae"},c("ifx-icon",{key:"c6ee24cb00027496c83208845cf3dcff489e8de7",class:"check__icon",icon:"check12"})),c("span",{key:"bac47544f45c6e575b40258cdf1a7a3e41602f50"},"Designed to seamlessly integrate with existing UI elements and adhere to web standards")))),c("td",{key:"6ed0da1526e4cc1b9a39fd7f33b76ed8db0cefb2"},c("ul",{key:"17cf08d7ad57cda8ec82e5dd22d4887905bf1e6b"},c("li",{key:"c49b5861fbcd5895883f35c31e0b1427f531393b"},c("span",{key:"a5c45712803452219b2ac3740ac6143b58fbb9e6"},c("ifx-icon",{key:"ea64ff836449a6dd1f813096156f9eb4149295be",class:"check__icon",icon:"check12"})),c("span",{key:"dfa7c32a1ef46cbba96cb89db81cbb1b81201584"},"React, Vue and Angular wrapper integration")))),c("td",{key:"67e9d545162a1a3f1b3156d2cc6ac1b25a3f0108"})),c("tr",{key:"a55a1b8e46b958e4fb4c6074e08bea9858391fae"},c("td",{key:"056a58f90ee6f20a3afcfa284b337b11913ab9f7",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"7077476757190af2e1877733cc8f96155babc8ca",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-breadcrumb--development",size:"s",variant:"bold"},"Breadcrumb")),c("td",{key:"8fb8e21f533e3cbb86d7377a373a70645e484d90"},c("ul",{key:"be3136e0a25254ef38277513270bb2fcdf9dcb5b"},c("li",{key:"0cd65d0c7b7ed100077943715c6693a3ae0a76a6"},c("span",{key:"7fc871c12dd057ff33d36e8df4ec78c333b80652"},c("ifx-icon",{key:"34fd29d6ca2a4e3aa7b0135fa7ae1290faf4fa03",class:"check__icon",icon:"check12"})),c("span",{key:"5d51a3a597324d754ef3eba0f8a6d89ec3f293c0"},"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:"975f0489a280bc04174927b2470fa1939b93866a"},c("span",{key:"fa246c0af16b4df516fd5c9a8bf2aa610223da7e"},c("ifx-icon",{key:"c225e2e6ead488c250034e5bef678f306c7b6a3b",class:"check__icon",icon:"check12"})),c("span",{key:"87552d656066e576f9b2019d3e1135359b274135"},"Adheres to web standards")))),c("td",{key:"6eafad50998d0234ed154074024965ac3dcb052f"},c("ul",{key:"61956dccb9f73440a0716b78d62de449c195fcf3"},c("li",{key:"bd08107616b6f2b06060501b4a9c27764530c106"},c("span",{key:"555fb1ba75ad16ca10106869a5f5980bb3d34741"},c("ifx-icon",{key:"33de92ebf2011c273618df99c2781a6d41abdfa7",class:"check__icon",icon:"check12"})),c("span",{key:"9d6238d3d590e12bf98c304e2e8814c032647068"},"Possibility to add an icon")),c("li",{key:"698e0586cd361b6c3aa5e32cd18c158ed138d1c7"},c("span",{key:"23749f72e79fb3304e114163de9a51d55afdd211"},c("ifx-icon",{key:"75216dc2006a45c409f846341963c975efb67ce0",class:"check__icon",icon:"check12"})),c("span",{key:"a6d7d97ee14caa5c988fc6cbd8743e4f6b5443ad"},"Incorporated dropdown-menu for individual items")),c("li",{key:"4152aae60994d1bdc4799acba21273a1418cb330"},c("span",{key:"1c7be76a5aa72cf559fca510bb8aec429e229a82"},c("ifx-icon",{key:"4b3efcedd33582da6c08dae27978a27752b176d5",class:"check__icon",icon:"check12"})),c("span",{key:"4826995a27d96a7f8ac7d4dbc1208c6c0b865fe9"},"React, Vue and Angular wrapper integration")))),c("td",{key:"7edb1a860d2b36ba60c9e965dd97fbbc8928251f"})),c("tr",{key:"2e41a0b5ff3da2c4e2bb044427d1f86bef8101a7"},c("td",{key:"d34b1f4df6f48e0bdfe35169490317909fb25e11",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"afc3b820877db98ea6cddb2f350d5d37ca8d9ec1",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-button--development",size:"s",variant:"bold"},"Button")),c("td",{key:"2d0647bf0c0d2230cec376886d91d9793cae53c2"},c("ul",{key:"7cacf96f66fd8f4cc9a206db9ac1056c63598698"},c("li",{key:"0bac305f4d4c9f5147e6e6797f2ef4e7bc59f56c"},c("span",{key:"41b1e0ede04ae53285554cb3aa6717b9c512d9a8"},c("ifx-icon",{key:"84c58a1c56a1f538686dbf6f361c096d9d68ae22",class:"check__icon",icon:"check12"})),c("span",{key:"13454301d04efc0a47a4bdc24bc8a2452ce1cec5"},"Includes basic styling options such as colors, sizes, and states, providing essential functionality for initiating actions")),c("li",{key:"f2ea5c37befa257aac988be68411d88223b0f06a"},c("span",{key:"49e6f3607d9bad0515282d2045f69f30c0a860fe"},c("ifx-icon",{key:"38bb60e21b806b6eeee752ce88682089f0e9d22d",class:"check__icon",icon:"check12"})),c("span",{key:"27182dc2176f8365f3b2f9c4fbb1a008977185fc"},"Adheres to web standards")))),c("td",{key:"9e7e79586ac2d9d85cd249318fcd260912a0c42d"},c("ul",{key:"d073794cdd0f5bf55435ca05e5b86841b3e878fd"},c("li",{key:"4a3394e30e10a62e7ff2e6f3a50d2b3570e09d9d"},c("span",{key:"340df7e7e062962e49d669a85d046676e3c1cb73"},c("ifx-icon",{key:"a28f7972ad0321683660215cc1373b1122c3b9fc",class:"check__icon",icon:"check12"})),c("span",{key:"f6f0d6d00e7a7e2f88c12b7527342f2efd4fff20"},"fullWidth feature")),c("li",{key:"7d88f62b2d30fba1aa2e51c6f1a594889b8a990f"},c("span",{key:"e773b0cca3c6a2e01066a10b1359ac12ab87d082"},c("ifx-icon",{key:"e80f51be96fb91036b65c455699b94fe96a1bb9d",class:"check__icon",icon:"check12"})),c("span",{key:"b4923abb0392ce2a2f2d0d842e12694a6f266bb3"},"Icon integration")),c("li",{key:"dd437882a5a5a59592deb781d8c2f24ded5d2146"},c("span",{key:"97eba381ccaae31dd3e2d4b68198891db52e034f"},c("ifx-icon",{key:"09db1beee7645f8c1dcc52031563363aa00a7d9a",class:"check__icon",icon:"check12"})),c("span",{key:"20cb6abd8d38a07e2ce2b6b0d19b1074bfc1f6b5"},"Link integration")),c("li",{key:"1e4a3e1d893d154731cd11c0af0de0fee93aea7d"},c("span",{key:"f5ebe6051bab40a246ca983f2c8a9aa819c62059"},c("ifx-icon",{key:"2660e83ca77aa6abd1c8e7ccfa5f7eb77ea4997c",class:"check__icon",icon:"check12"})),c("span",{key:"7fb61497698d0215b7e6eba2d9aac45bcd550218"},"React, Vue and Angular wrapper integration")))),c("td",{key:"76dda6d9e9c5fa1fba778cbb2623e42558bb2de6"},c("ul",{key:"9a3ed85293cd51f68f07b29eed076dba89947e8e"},c("li",{key:"58bc3de786bb01999afff9b09e98cde014f5a4c1"},c("span",{key:"96cac9d7d129c237d27eb75a1329f3248476bd30"},c("ifx-icon",{key:"845649d33f77728669274409ebeb1663a11b1cc5",class:"check__icon",icon:"check12"})),c("span",{key:"2af4164d2f151627a84ed5300a974c0b1f0e8a06"},"Form integration"))))),c("tr",{key:"1fb62972bfea2ce1f34cca3e22fa2a1e44aac28e"},c("td",{key:"468463391df9ae7cd8149980f02ae216ce51ccb4",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"ec0b83a5492b3e970bfcc46309d765368b53d183",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-card--development",size:"s",variant:"bold"},"Card")),c("td",{key:"ebadc14b164088f3390f19d8512921552811af50"},c("ul",{key:"ef28f31f4c0104eddce1d503c77b368155f4fe89"},c("li",{key:"7540b1fe6e0b737d19511aba3a512e85b951453d"},c("span",{key:"9dab205bc86b4b12df5a58a8d0d5b6d9f6da68f7"},c("ifx-icon",{key:"d226b2313628ae2945cfacac595bc6788c19587e",class:"check__icon",icon:"check12"})),c("span",{key:"7fbe1623bbec98af3675092eb54abb1efbc7096c"},"Provides a structured and customizable layout, featuring elements such as headings, images, text, and buttons")),c("li",{key:"bd5d0c07e0439cb81c965e173f98f9baf330ce67"},c("span",{key:"a8dc48d5f82a41604270ff74f17a524e6363e34d"},c("ifx-icon",{key:"dd485fda1bdd7ea284ffae345fe0479d35cfcf76",class:"check__icon",icon:"check12"})),c("span",{key:"d9bd032ead8fae4fb316bb1011320c00f76b0377"},"Adheres to web standards")),c("li",{key:"7955d199878b7438addcac3e3f8da05aac26ab0b"},c("span",{key:"0bb80a60dd502c806a06a5e42603f20466d8a1b2"},c("ifx-icon",{key:"64162d091d0eaf2202b674b2c94322fb273b3f71",class:"check__icon",icon:"check12"})),c("span",{key:"7a67719135dd12aa31e0a779185fc907ff978ee6"},"Horizontal and Vertical layout")))),c("td",{key:"1b964f0695dbc08fc2ed47bcbd8297b5ec4f5cf4"},c("ul",{key:"6d0b052f1a46bc5dfbb076143e258e95d8e0752a"},c("li",{key:"f80f7247eb3e24095154118264c1004919ec4463"},c("span",{key:"8c63b886b22483c86d54b7ae1d3896abcee8826c"},c("ifx-icon",{key:"4b0ad842a0a78874d8f2e0a859ce42ca48188a22",class:"check__icon",icon:"check12"})),c("span",{key:"339b2f8449e02b1a3a62f4729b79e76ff5a6bfb9"},"Possibility to embed multiple buttons")),c("li",{key:"851312f7a4cc8c7ac36e163605e4fd6877a51016"},c("span",{key:"e0ad76bf6248678a72ca1edccf422b33bb614202"},c("ifx-icon",{key:"d0639cf6f0d4f42b55bdde2ff3bdb66dde25c161",class:"check__icon",icon:"check12"})),c("span",{key:"d1da26f5ca4a6b03db18c08d9f7ec00d3edae627"},"A switch between a Link and a Button")),c("li",{key:"217c179c549c2417886e3c6cee12012b0ae1e5b4"},c("span",{key:"44a6f38131ef21966f42fbaa3327ae40880c285a"},c("ifx-icon",{key:"23f5b8640ee9a1ea684fa78c30b656b058f68469",class:"check__icon",icon:"check12"})),c("span",{key:"79cccdafe346b65d5577745be440fbba8e8c06eb"},"Enhanced stylying behavior")),c("li",{key:"5eafa7507f0e74f48d4aed16d0a1236508a9fb37"},c("span",{key:"817af64aca16cea913eebca5a13385c1be9364e1"},c("ifx-icon",{key:"d26764d614a1efbfbaa8d995e36b97b4d303b6fb",class:"check__icon",icon:"check12"})),c("span",{key:"7aa705b7ed9ab3553d71f8fcdc0efda2009a90dd"},"React, Vue and Angular wrapper integration")))),c("td",{key:"4c05a59cc02ee88bfd88982d7f7d0b4a97d10749"})),c("tr",{key:"65353b34a985b46712efd60ea1f5fef9126989e1"},c("td",{key:"ad47a7dd862d7040159f7c7dfc8bc4c1d8bad8c0",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"0684642f1f319a381fd8b35b865f55ecb184d220",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-checkbox--development",size:"s",variant:"bold"},"Checkbox")),c("td",{key:"90936983258d69d512e93fdc4d3e30df46cc2836"},c("ul",{key:"74de288446a12ae7f8eab56edaf83ed88981cc07"},c("li",{key:"c8205c0f2fabd0c0527ce219664c95411d882ccc"},c("span",{key:"3f2a4f399645cf2fac94455351bf11ca8b28564c"},c("ifx-icon",{key:"2dcc053ec2c4887ee004b6b4884088fed4645950",class:"check__icon",icon:"check12"})),c("span",{key:"62cbe17dd6c2176fab7a26204be36179ffa9aa32"},"Offers a simple and customizable checkbox input, allowing users to toggle between checked and unchecked states")),c("li",{key:"cd602406a511e5417c9962a0d1bb88cd296a6568"},c("span",{key:"9b662cc278a1cfb809897cd9f656d56f1f24c26f"},c("ifx-icon",{key:"ded0d8a9d322abf4d77d82e6b8eb28d9397f0ebb",class:"check__icon",icon:"check12"})),c("span",{key:"29fa5590fb3e5b649e3f8ace7589148703757db6"},"Adheres to web standards")))),c("td",{key:"22018d55ce26e5fe53f2f70b6f15611176b750e1"},c("ul",{key:"6775badb7edbd565280585044cd621c26e87ec2a"},c("li",{key:"e766a47b163e828fe7e235da61344f2c0c3fd5c2"},c("span",{key:"e68171156d7eb1027c70b3d370b1fa1f1d70830a"},c("ifx-icon",{key:"8ef8dac4d102925b4d0d90f542f559aad904b792",class:"check__icon",icon:"check12"})),c("span",{key:"d993273933c9787496fe70e7e72ec966813ed847"},"Indeterminate state variant")),c("li",{key:"4100aacbba90c7a7459ec3ef7d8737c78ec23c99"},c("span",{key:"73597d549f82b38dc65c3587cd147d304d7909e1"},c("ifx-icon",{key:"6f7d7f2314d1a20139ec306db2e22ee97e248893",class:"check__icon",icon:"check12"})),c("span",{key:"d316e940289aac75cc8ec5d0ad767b034d5b1254"},"React, Vue and Angular wrapper integration")))),c("td",{key:"1424d2813b80501e0ad1e7ebea1d5b1f7cead618"})),c("tr",{key:"8ccfe60401de832bcb4d896b265815c075048f58"},c("td",{key:"1e2e4c0e3c3c7b4bae3a897bed281399422f720d",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"2e1f971e885c173d55a74dffd9e7474ee2b100ba",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-chip--development",size:"s",variant:"bold"},"Chip")),c("td",{key:"4e00bbdce2b9a670cd5bb94b519e1216f91f44d4"},c("ul",{key:"ca91dd24e0fd27850095c3e47ffa960d67759181"},c("li",{key:"fd0fc432049686f0f2ec2b824671666373a9bb6a"},c("span",{key:"fd7a4fd825327740906709f03b57af49abc09070"},c("ifx-icon",{key:"894647025923625d40cd3079886c20e6151ab41b",class:"check__icon",icon:"check12"})),c("span",{key:"040ce8e9f866acaa4b1f1a75c3f4ba6149eeafc7"},"Provides a simple and customizable interface, representing discrete units of information or user interactions, such as labels, categories, or removable entities")),c("li",{key:"3b9eb20ceb9c672c62bbab1c95398e506ee2ab7e"},c("span",{key:"daecc1e15d70f3a45c6618944f0aff59100af223"},c("ifx-icon",{key:"038029abc4263dd88e523c6bb172c927ad9bb1e1",class:"check__icon",icon:"check12"})),c("span",{key:"996cc130693a4c215b91561589f95254b8e722cb"},"Adheres to web standards")))),c("td",{key:"28a47220f7b22e587202e873838f2d16833f2b8a"},c("ul",{key:"c563dcb688bfd19b50f4a1557d6c9cc30d9e6709"},c("li",{key:"62e50a0696d9b6f006104d2450566a777292c408"},c("span",{key:"b88a0097e5ca83bb1dd70cab6c6153462293d7f8"},c("ifx-icon",{key:"c6dbdb086f6b03d38e4e9c867fc7809125749c4d",class:"check__icon",icon:"check12"})),c("span",{key:"c1addcc8e5b25f32943eedede6b177eabfbc4be5"},"Incorporated dropdown-menu for individual item selection")),c("li",{key:"44e0c3d8c32855cb0ae6f7181b1d851657405c28"},c("span",{key:"6107a2d140ecb5ed04f5513f499ddeda3800ca8d"},c("ifx-icon",{key:"053c21d6ae6e5139fe61e39d176ed11ad43a56f2",class:"check__icon",icon:"check12"})),c("span",{key:"2603a7c91bca6c39bf6567e3d08592c46e75564f"},"React, Vue and Angular wrapper integration")))),c("td",{key:"2d2bc56b6b321d7bd32bd74cba15de16e4a18417"})),c("tr",{key:"008a7a602c02875a70e0cb3eac3ccd95920c2756"},c("td",{key:"bc04674eaca43867e6af4801d028ac160611eb6f",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"4a64dd6416aff883e32ca90055979dc5851b02a3",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:"1855f2effcd734d348e245bacfc92a2fb77ce77e"},c("ul",{key:"71e32caf283476ad93e07399a173e327c509c8fa"},c("li",{key:"15428b43d4ad3f21a626a70de4bb4048a1ad0a45"},c("span",{key:"f6031bc6a27c9f890460131ae708f0b1b5c86d43"},c("ifx-icon",{key:"8ed7aed3b741b8f9ad4a507319b2a8caa6986791",class:"check__icon",icon:"check12"})),c("span",{key:"3e19f3802e0ec161d7ba2987618249fecaf6040d"},"Provides a customized wrapper and theming for the standard date picker element, enhancing its appearance and user interaction")),c("li",{key:"f43068bbda989eac88d7c1036a036f53374e6ea2"},c("span",{key:"78f5ac0a9fa85034dc62707ebfb854a9eb627835"},c("ifx-icon",{key:"3b2e5d79f8f0400e255d5ebdbfb4502b18476ca0",class:"check__icon",icon:"check12"})),c("span",{key:"54463b12d3ad69485d551f830c54c94331f74e2b"},"Cross browser compatibility")),c("li",{key:"95f3d4735fa9a6d68ff33966deed67cc10511094"},c("span",{key:"839b4747e0803c6ed5615b1e48f1d7190d142bc5"},c("ifx-icon",{key:"107b29ec3149c155742917014c9c15501239e9d6",class:"check__icon",icon:"check12"})),c("span",{key:"789439bfe1cccc605d8af63f3e1a744c5ba9f3a8"},"Form integration")),c("li",{key:"8e095e1bfdafdcfbe9256bfcb07fba1539e7766d"},c("span",{key:"3ad457f1c397eedf1a33c4e80c8612bb7e21db42"},c("ifx-icon",{key:"509fa957a7f9d1661e3c7b3c0a0234bc33ca6fde",class:"check__icon",icon:"check12"})),c("span",{key:"95fa64296d248ce08a71682b9e8433add152b57d"},"Adheres to web standards")))),c("td",{key:"e9fad5f80ef75f2ed90377e4a5ecd015695169a9"},c("ul",{key:"8e8fd8be135aad994b9e31031e8b2e8974a228f2"})),c("td",{key:"8f8afbfaadb481d15b3f41da231312f9cd83d760"})),c("tr",{key:"c4f20cf523ea663e7edce012966edd779ceb6f57"},c("td",{key:"ce71f0c20482376ff8ef2a57bea3284850d9a76d",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"3436264f694b75530d28c54a18076c17e16c1b0e",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-dropdown--development",size:"s",variant:"bold"},"Dropdown")),c("td",{key:"0d4c491272bd466073077a3269ea7b46f36da901"},c("ul",{key:"1adefef1d7083350e2819fcef6bef46f5fe2fcc7"},c("li",{key:"15ef25935fa77f8db5a5646ca7a145ec3b45396c"},c("span",{key:"68355d326504b2615d75f745c0747eb67998b4b0"},c("ifx-icon",{key:"afe464c685c1368be5b60edb0497cce4794091f9",class:"check__icon",icon:"check12"})),c("span",{key:"3e77a8e7720e081332b94981755e2abd17d5adc1"},"Offers a versatile and interactive user interface element for presenting a list of options or actions")),c("li",{key:"c2b097d9c65f5b669af3e990cf114b35c2af0232"},c("span",{key:"182a609e3e1fc9c9ea78087d3a736e53f13b90ce"},c("ifx-icon",{key:"5b0a4fc70bae2a35aa12be266c4d37dfc8a1a70c",class:"check__icon",icon:"check12"})),c("span",{key:"3e160873b4bc0f1f01404a2b7946a46c12b777a7"},"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:"3733afbbc0f2750d244a762726e6bdda281dd3ae"},c("ul",{key:"d86bd70efb1d658490db0b6eab74ed4cdbcd9a1c"},c("li",{key:"34a568765b958a72fdcd691dfa764d1558cbf38f"},c("span",{key:"f98c27374524c25d895a96091be4b95cc4b93716"},c("ifx-icon",{key:"2b9c0de2213ae906ebd1980e3f711bb1ea726152",class:"check__icon",icon:"check12"})),c("span",{key:"9ad35277def64ff895239b6e09b45b6f6d34a372"},"Search filter")),c("li",{key:"08f488fa768c37f625bfc723d6c4ec1b6caf1990"},c("span",{key:"d6d5f88e3e877b1da95758dcce389fd41c7bf1d9"},c("ifx-icon",{key:"efe9c88e95b946f164e1853e04860262c071badd",class:"check__icon",icon:"check12"})),c("span",{key:"3da77ea238e674ccd99bb741659cd3428eabe12c"},"Header section")),c("li",{key:"bf2ec5c8983c1ca0f9cfddcfa1bb5f985d932aba"},c("span",{key:"42174c02647fe1a199cb82813f5734d95c1cb53f"},c("ifx-icon",{key:"93821830720e0e14460f0fe55c672c57f03d0642",class:"check__icon",icon:"check12"})),c("span",{key:"05f55522e623695deb19c29fa85cb088f99423c3"},"Menu Item Divider")),c("li",{key:"83e0175896797d068b51112add6f7244bbe61799"},c("span",{key:"677136ca494c52b42f2d9102e484a96ca23c146a"},c("ifx-icon",{key:"33916f1c9602e503205540b445c5d7d91972654f",class:"check__icon",icon:"check12"})),c("span",{key:"8abd3305723312be9da15937993ccbada6a92e2b"},"Icon incorporated")),c("li",{key:"e10d0f3a2c0ccceb629a4f58c5f1502331423bd8"},c("span",{key:"b20a407542787896ec26b85927796166cef673e1"},c("ifx-icon",{key:"d028797f510ed472ab09a892d807fc811658e222",class:"check__icon",icon:"check12"})),c("span",{key:"f637c8bd1dd4745decffbc862471c00109deebc5"},"Extended customization and configurations")),c("li",{key:"50af067a5583acfafd3eb3135f64639d2311e7a0"},c("span",{key:"509548b2bcb0c652d360dbd2994bc728b5b09a80"},c("ifx-icon",{key:"135cfb2433a8a02f06346af2fed3c8e99090140d",class:"check__icon",icon:"check12"})),c("span",{key:"4de9f5f99e2252628c7e73cf7c1e699e9e0b1391"},"Separate label trigger")),c("li",{key:"8e0cef3573fb2eb9098ac8029a58171218832890"},c("span",{key:"4e0f5f6e6a3c56d2dd062942c9aae8acf05c3812"},c("ifx-icon",{key:"dd4458e1ba39220132bc9eae7bef4763697e1c3a",class:"check__icon",icon:"check12"})),c("span",{key:"1dd77756af2c3ce13cdc982570569d55bb6081a8"},"React, Vue and Angular wrapper integration")))),c("td",{key:"47913b950782b6d02d8929d4df55021cc1ef3ba9"})),c("tr",{key:"f8efde995371736386ab9c0895fcf353c11dab39"},c("td",{key:"cd5d29a88e819b79f64684a778274dc59ca1f8c1",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"e539c91d70d9c8a31b52c29781518414b8c86be2",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-footer--development",size:"s",variant:"bold"},"Footer")),c("td",{key:"17435978a471d16bd004bfde9da3529ec67da430"},c("ul",{key:"e463426bc271129f3cc0edbbb714ab2618d06a38"},c("li",{key:"5f4525b581e102bba02216117bc5e430509e4d79"},c("span",{key:"6b84af35d1278909c8d9c0f0a6140c087d2c41fc"},c("ifx-icon",{key:"d994b361070ac520c9520988f15f8aebb77d523f",class:"check__icon",icon:"check12"})),c("span",{key:"a81b240577072b7c5355709e7d007a02c66279dc"},"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:"cede9e35d82ea655a75d1e4a05577692ba75cd9d"},c("span",{key:"f5fbbf1c20bdc308c50eacc727fa68cc12b3188a"},c("ifx-icon",{key:"e287b1078a886ef6b060c89b56a69da2e13b9fc2",class:"check__icon",icon:"check12"})),c("span",{key:"ecbbb3bb60bd747ebbb6d8446d43e3fdb79b5223"},"Offers a flexible and configurable layout for organizing copyright notices, contact details, sitemap links, and other pertinent information")),c("li",{key:"8c04495a8ecfa07846813975d02cf3d27bfc4df2"},c("span",{key:"d29dee64742541208d6940402ec4ade58e1e97a7"},c("ifx-icon",{key:"ae2b52ef61e1b15f8e8fb5beb698877a2adabbb2",class:"check__icon",icon:"check12"})),c("span",{key:"f4cd55b4c58967d04969f19f0eae2e3d4abdc54f"},"Adheres to web standards")))),c("td",{key:"26ef5bd10cc6cc1eed158b29d5c34fc8a6211afa"},c("ul",{key:"f00284163a58247c043233c26edc0ba1aa709b3a"},c("li",{key:"5c475c32d48d44a9eb0832498a916e3f1cb89a1c"},c("span",{key:"db83802bcb4b20f4900da62f78fcab1cab8a10c7"},c("ifx-icon",{key:"0d18b23c39137a6e1a80feb509120c017a990940",class:"check__icon",icon:"check12"})),c("span",{key:"14289e3a5f282ed2d7303ea2eba9ab636c322fe5"},"Small, Medium and Large variants")),c("li",{key:"d9217b66c12cb8ee46bfed0cfaf8e4a29541f16b"},c("span",{key:"f29fd30eb305a3069eb11c667da65608135f5299"},c("ifx-icon",{key:"bac8175a4159405230c5d77bb4f238a72a7cdac8",class:"check__icon",icon:"check12"})),c("span",{key:"66ccbddbc135f7f6f29c90f64cdaddf668f20ef5"},"React, Vue and Angular wrapper integration")))),c("td",{key:"cd479d10b17d836a754f108f3cdba4145e64c354"},c("ul",{key:"9b09b9ab1871b23b67695677df91ce077fbea287"},c("li",{key:"c237291644d0465b8bbfcac28893d9e0e3538bf8"},c("span",{key:"4be4cf605b63c38ed0aad60df32423136b31bf87"},c("ifx-icon",{key:"77fe2515d8196c6c2882bad6cf6a8dc1d9e6a158",class:"check__icon",icon:"check12"})),c("span",{key:"9202b7c0f8bf630bd901ecffb46303d8f0bcb54d"},"Customizable and removable links"))))),c("tr",{key:"a30d082dc9b3679f6fe4d992bf503965f398879f"},c("td",{key:"b11980403e715d4bab53acce842ae62fc8d4064a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"a86d2703fe65ba2a99c86ce67a772043944cc00d",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:"8fa15011bb5f48a4e0346bc9273693fa02a0f7f8"},c("ul",{key:"fef9a3dd748d1bd83e5f879dd6fe18b7163a816d"},c("li",{key:"813d4300ec62e7d1136e2ae24030168d60429681"},c("span",{key:"9254dbba5703b81d349ecb1573edd80a6cf6abf4"},c("ifx-icon",{key:"25c7f6970bb201e11be8817ff997a8f0090da051",class:"check__icon",icon:"check12"})),c("span",{key:"47c34cde4ab304153626ded8c6c89ab1ed4b0709"},"Offers a compact and interactive icon-based button element")),c("li",{key:"8648b6fa1342470e04878d46340cad80d0b77ca8"},c("span",{key:"38b682ef6962df718c5f5597ead6fa05751c778a"},c("ifx-icon",{key:"a06400b0fdda5a48571170bc1d4f217a1f33ac60",class:"check__icon",icon:"check12"})),c("span",{key:"9e2c0a5405379ebf5eef0d3e99be1969e06d662d"},"Provides a limited scope of customization")),c("li",{key:"4de14b50154003501d15ae946b6806a9ddf6ed6c"},c("span",{key:"17bfc0ae5a65a196797e2a09eeb098488a3ff605"},c("ifx-icon",{key:"19e7425372a2f5ec6351709eea2b90c23b3465e7",class:"check__icon",icon:"check12"})),c("span",{key:"a3578858279509a3e397388c6481be7d1ba35b93"},"Adheres to web standards")))),c("td",{key:"92645ada1699c071adfbfeffe0e6eb8c7f025b54"},c("ul",{key:"abc1d22e78a58fb3235d07dbc60913ec31756b4a"},c("li",{key:"079efedc8f8acbc1eb0f15f07b7b92180dafc98d"},c("span",{key:"8988c3c93f0e5d2087700fb6106b57276c6ede85"},c("ifx-icon",{key:"a31b8f982b9003524096b2c97ef4108e8deb34cd",class:"check__icon",icon:"check12"})),c("span",{key:"51579521f8f691199d962fddacfc8b20757c2b66"},"Additional Round and Square shape variants")),c("li",{key:"296787a21edd5a41f19dc1f596ccbd75e966184e"},c("span",{key:"f763f76c6b2b0f3f4c7518db91b393e1b9739c51"},c("ifx-icon",{key:"3e5dcbf6c9e45241a5d24f70d2c4bf78c8c61e1a",class:"check__icon",icon:"check12"})),c("span",{key:"dd1c2ffd95843842a1d95076b45c2725a40126e3"},"Small, Medium and Large size")),c("li",{key:"d5d94a669a6ff63dcc4b334b9ab7003cf4ad8f29"},c("span",{key:"926606a1e503236a0f9d80c876fa2d1bd8abbed8"},c("ifx-icon",{key:"a3072421af8171af8eee9b49894160b6b3baf706",class:"check__icon",icon:"check12"})),c("span",{key:"a3a013829f98717c65bfe56831cbf808bf2e0dd5"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c40a01ba94c4e0f4ee6093ac799befa325963b91"})),c("tr",{key:"ce70da6ecdc78714d0333bc90115f25c37613557"},c("td",{key:"1191246bb65ea5636178aadf555af7250503ad45",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"e6e61da116d4b608f92253a8853ceeb84140e30b",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-icon--development",size:"s",variant:"bold"},"Icon")),c("td",{key:"2df2b4031b01d73118d50b1eb625a61b74913e25"},c("ul",{key:"005eff0a7b383b920ac1502f9c826db98fbe83d5"},c("li",{key:"671504fb5b70eb9639bb12f03800474e6db77bf3"},c("span",{key:"681d3b9dd160e15e02854215858eda6b70c1e691"},c("ifx-icon",{key:"28a7e99ca8468aa597464097f48876e00ecc0fc0",class:"check__icon",icon:"check12"})),c("span",{key:"53897b5ce32abc2d537f85446cd716b9de94daca"},"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:"8da79863e4acd20e94a8d646611d885c1b1de49b"},c("ul",{key:"92df9e1862e0ab4513520a8225f5e8964f60c881"},c("li",{key:"ec1e228ca5edcbe9773c207863ab335dc221dc0f"},c("span",{key:"ad253e7cb4f1c6b24718111194abc2ce57782f22"},c("ifx-icon",{key:"566ffdfa7b4a3f8c19ac6c959f1cecaebd3028b6",class:"check__icon",icon:"check12"})),c("span",{key:"cb230184d83422020d82c9a6da2f8ddd24d3c312"},"React, Vue and Angular wrapper integration")))),c("td",{key:"92c258f04cbf34ccf45ab3c1898be6bb1c22416f"})),c("tr",{key:"4c90cc3a8beda90cdb119611b838939a65274a88"},c("td",{key:"209e6a876e8762fed042df79c75dd1bd677a394b",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"fd55c610229826fed8fbe714e01abd3e363433cf",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-link--development",size:"s",variant:"bold"},"Link")),c("td",{key:"9ce42f2cff9062e4e0e82c188e1772e233ec597a"},c("ul",{key:"82e999f8cd920719a92d8761980f30ef08579620"},c("li",{key:"a96124d971da1d74a0942c81b87a42e7c8cce60f"},c("span",{key:"ef6064d6a19e3d68367b3e7a1effa9850cf81b76"},c("ifx-icon",{key:"4054e999896634de6d98c078c4fcce3fe49a1f70",class:"check__icon",icon:"check12"})),c("span",{key:"a8ac46f1188ce23fdf3b3c6753241b97e71fbfd7"},"Provides a flexible and customizable element for creating hyperlinks within a web application")),c("li",{key:"42d92fbae7559615303d45a7f1226f4201c3b8d1"},c("span",{key:"3e14c8d38445e83c4758241c057fff1080ae3a86"},c("ifx-icon",{key:"66f7d1ea7b4ffb16cb3fb120b6a336fa9255e1f4",class:"check__icon",icon:"check12"})),c("span",{key:"ee3196027e7350547e5a5643f76f3586ed4afe89"},"Offers essential functionality for defining clickable text or elements")),c("li",{key:"d96d6e74bbf05be1206c037ec2bf5adb9f9cafb3"},c("span",{key:"64da0b91003a3f6ac7818398f3dcb91c018e6772"},c("ifx-icon",{key:"ba126e43f7f71f313f0e3e96d6903f00faa7f379",class:"check__icon",icon:"check12"})),c("span",{key:"43f0e3ab14b6f5676b9d21b40c6d726e750594e9"},"Adheres to web standards")))),c("td",{key:"eecaed986a6446de293b08e9df1da9eb4f00596a"},c("ul",{key:"3327aea09a6f43affe3533840eec022594f1570d"},c("li",{key:"47b9c8f03e0739175b80bd4cb5d5da69b0bf6923"},c("span",{key:"90816ccd10885511c7d7a3f5159b0a91802fde47"},c("ifx-icon",{key:"2100175d9ebabc4d1dd729e7b47cd11dd5860332",class:"check__icon",icon:"check12"})),c("span",{key:"75f054a524ff883798751b62f8bd46d80efd55e5"},"Small, Medium, Large, Extra Large size variants")),c("li",{key:"a7c0a9a86cc3b91a6e58cf931b7d241443724929"},c("span",{key:"d9ff501e64b1e1119df494ce450d1677ed2e646e"},c("ifx-icon",{key:"5ab8d80086851527f470c99c0c1e6b103b36c51d",class:"check__icon",icon:"check12"})),c("span",{key:"53cb106982053bc2c883dc108f2093b57a7f62da"},"Icon incorporated")),c("li",{key:"457bdd5ea7f563c482202d7fd1bc6fb2fdd08c19"},c("span",{key:"ac6c279effd5f177fb37115d7d0f32b56448c7db"},c("ifx-icon",{key:"314f2d114375729a07f8aed0f3e19f405bf9b89b",class:"check__icon",icon:"check12"})),c("span",{key:"cb5b86b55bc6f3643623c2bc7b59ec40154bea07"},"React, Vue and Angular wrapper integration")))),c("td",{key:"475a22077123b75ee72c4c17bd4270e2d3a72a58"},c("ul",{key:"fd3b5389a8a612489664da4e626a140baa021e9b"},c("li",{key:"7f14ffda61af9e6910c2660413753a441079644d"},c("span",{key:"0d3954162c8e741e015c148aeec02dd249ea0e6a"},c("ifx-icon",{key:"33757c46fdaa00a97e161a42dd228b6c333ed23d",class:"check__icon",icon:"check12"})),c("span",{key:"a5a8a95a73c6f4db510c79682f47802345837d70"},"Bold, Underlined, Title, Menu state variants"))))),c("tr",{key:"d6a12b24790630b4a365de03de6253b1dc134902"},c("td",{key:"4fe320c1fdf6badea0431088bc9711c6b62764eb",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8a7473be2204eb3c179899b588bc882eef9bb694",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-modal--development",size:"s",variant:"bold"},"Modal")),c("td",{key:"9ceb52610abefb67f9fccee4fe40d96f9c04b4ae"},c("ul",{key:"3a78d8ab8ae138b76784390566b14af5a61ec092"},c("li",{key:"90365093050018f080953a3bf83fccc0faf54825"},c("span",{key:"e0699f3a067a0e30e4850dda4ceabb3a7852f523"},c("ifx-icon",{key:"de3b0c7f28877dc7329f995d5edbc9e7282ece54",class:"check__icon",icon:"check12"})),c("span",{key:"bf1aa178d5d0aa41926f40ff801860219c64217b"},"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:"01bafd5070c53a1407eb4e326f098e49967906cb"},c("span",{key:"6b1516f679100d8754dca4991d5927c095bf5d68"},c("ifx-icon",{key:"79b4d6adff4159ac3bdd2481c018f3ad8b6aaecc",class:"check__icon",icon:"check12"})),c("span",{key:"1986286365cb5b3009b0fe6001caecb27060d305"},"Adheres to webstandards")))),c("td",{key:"815d5abe5331e94a728d356bc255e098353beb9b"},c("ul",{key:"dae7f1119f0fbcf2550161a4796c1c019f367705"},c("li",{key:"36f7ab9e1e5203c000bfa0d586a11a3ba0a47373"},c("span",{key:"ba518b90f325b6f65338d524a628124af000a704"},c("ifx-icon",{key:"15d20a0b32b51976ce0d0a095e9ff1f959c170a0",class:"check__icon",icon:"check12"})),c("span",{key:"72c85b73a99a0644116e1e3d05a2a996b58119a0"},"Alert-brand and Alert-danger theme variants")),c("li",{key:"42ffa75ab3fd5fada18d7de77cc8bea04b721a85"},c("span",{key:"9e67fe4cb0e5b18c1d5b8356b05b0fddd69de4ca"},c("ifx-icon",{key:"8e7464b06451fe0dddc465b77fa24cc4bd8f2db1",class:"check__icon",icon:"check12"})),c("span",{key:"e3501a04a11006485f913d5c366d4bebf74e1ad9"},"Extended customization")),c("li",{key:"522976ad4709abaa9b225958e0a81b4870bb9b1b"},c("span",{key:"16ba1c35fe9a46916dd15fa85bde0dedc1d42daa"},c("ifx-icon",{key:"faa1086d6deb7a97d91a616f4f9a030173b7b245",class:"check__icon",icon:"check12"})),c("span",{key:"be499b565845abd662afbe6ccf7187639b4f331d"},"React, Vue and Angular wrapper integration")))),c("td",{key:"bb6757a121d20718f1a301dec536d00364e4edcb"},c("ul",{key:"e378d2f0593dd09803bf6c1a260d4dae65dbb899"},c("li",{key:"6da045c456a7af2b725003aabfc758214b97d7e1"},c("span",{key:"d43e85b915fdf518c690c20a6e78fbffe109a157"},c("ifx-icon",{key:"925de449fae94e797922e55f57d66ba680157d3d",class:"check__icon",icon:"check12"})),c("span",{key:"9f5b661bde7194116214699d87f6295ec428bc6b"},"Removable close button"))))),c("tr",{key:"f023a30286e24d333de94ccb722b2fe44e5f5f5c"},c("td",{key:"f5ad404fd911652863af029b8bf02d4629efc8fb",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"a9154928ced18c10f3ac29765209991ae1aad14f",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:"c2b1cbb4791dbf39ad4003d4f44a81131fd39c28"},c("ul",{key:"fcd7c3d51f2ea44e0a418a96fe8449cbc734ac78"},c("li",{key:"ed2f3015b951517defbbff450c38b2b1779b50a6"},c("span",{key:"682d6e3c7afa47b93d1b121bee0bee45981b97c8"},c("ifx-icon",{key:"49eb91ea4283ee1a911ebd946dc8407fa0a1d1d7",class:"check__icon",icon:"check12"})),c("span",{key:"f5eec04eda12d1bbc6e8af53f446a528c70cc710"},"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:"8702bad7386374a4c6c9cda52572e76aa193fdba"},c("span",{key:"0a9cadbe50719e9bcecec782793dd55f82491822"},c("ifx-icon",{key:"66f8fe10af418b9310c4503c4d5e6b92378a03fe",class:"check__icon",icon:"check12"})),c("span",{key:"153a373b9d4617fd64d45f507b255aa64ad10c59"},"Adheres to web stadards")))),c("td",{key:"cbfe08531bab8e266cbbd207cc798c370718f874"},c("ul",{key:"81f7b72550b6f8116b8d40921229c39197d699d2"},c("li",{key:"5ec385826066e36ea4cebc903582719754a27ab2"},c("span",{key:"46e3aa617e0146fe5cdb6ce3bd18bb2897b7ad9c"},c("ifx-icon",{key:"24f8bc42995d78b803672b976a7ff7b9eef7df6c",class:"check__icon",icon:"check12"})),c("span",{key:"6d2d5839cd50fdbce882af11028b5b062eeda837"},"Navbar-profile component")),c("li",{key:"ce5356bcb2a1e022dfa1431aefc196f5927a5962"},c("span",{key:"221bf669887dd09223d542e2a9a328944a901ef0"},c("ifx-icon",{key:"1111b912266801d28fe5733ea428a3c76d640078",class:"check__icon",icon:"check12"})),c("span",{key:"fba728ccd96fe39190f16602c1cfb1c9306d1c85"},"Mobile Responsiveness")),c("li",{key:"66d9b3a943cdd96d1f3db350b433917aca6cd2de"},c("span",{key:"96a579aa3fcdac6ca482ff304396948961691094"},c("ifx-icon",{key:"d710879b694635f5f2371e8850677672bbf4607e",class:"check__icon",icon:"check12"})),c("span",{key:"b7de5fe2661bdce304690e09fbbbb40621230aad"},"Mobile Sidebar")),c("li",{key:"3762dfc86ed62ab40c0a4e7483133f8d43ece416"},c("span",{key:"9f762b5281581aa98056169e5006665816b9be19"},c("ifx-icon",{key:"6b007148081eaab4cff495bad948950e2cdd6112",class:"check__icon",icon:"check12"})),c("span",{key:"f17ff84b5a91540c69a491cca0829d04c5eb3de7"},"Extended customization")),c("li",{key:"92b6a13eede0801e63b378d850e9dc1bb0e6f6fe"},c("span",{key:"a4ba4e3dbec81d5595098f23e4086298f720ea38"},c("ifx-icon",{key:"755c60f8db5e5bcc2e0ebd5bc34a85d07ed219d3",class:"check__icon",icon:"check12"})),c("span",{key:"4d61affd5289d86ec08e0da709a9ae207f180b95"},"React, Vue and Angular wrapper integration")))),c("td",{key:"4dc28a2e796dcd98117777b6b9e80acc45782153"})),c("tr",{key:"43c4b378573491910fc769815d342f83487c6518"},c("td",{key:"734a1fdd581a0fabb45b367dd7752ccc4daae38a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"22c3d6ad976b2026d14c1d580c139b888ee6aa91",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-number-indicator--development",size:"s",variant:"bold"},"Number Indicator")),c("td",{key:"f19d44994499447fce65d259e59473118336e8fe"},c("ul",{key:"91e49d1acd5388e3f08aefb41e9151cb2ddd2f86"},c("li",{key:"82be4faaa244558a980160c68c2f5865cd3d342a"},c("span",{key:"891b10f8c13640845babc01377f7650a7a8a593d"},c("ifx-icon",{key:"19015f6aa25b5c6485fde331931f91c96719ef06",class:"check__icon",icon:"check12"})),c("span",{key:"bb228b3af6897e70cf6dc573288d65797de59372"},"Provides a compact and configurable display for showcasing numeric data")),c("li",{key:"4ca1194d5d8e24302590cf580f8c4848a471d209"},c("span",{key:"39bef42167a877eec107ef1137e85e2d765aec1d"},c("ifx-icon",{key:"b6a9af528b63ccc486ce0e87fb0112d4d9f59faa",class:"check__icon",icon:"check12"})),c("span",{key:"9e686166ccaabcab5daa45f085fc395bdff36fb5"},"Adheres to web standards")))),c("td",{key:"2bc6a2004265ce618d565c7c0b82665b8517e31c"},c("ul",{key:"385eec4eaee4f481a93bd20e6040e78239f1e399"},c("li",{key:"6de71d4d30d469b2e09c8aa1be7c65edef96dfdd"},c("span",{key:"4979ea9184e7b363ec32eb2cf424d751b9a36716"},c("ifx-icon",{key:"4f204bfb4ed1112944b06d339bbf302f85a9d919",class:"check__icon",icon:"check12"})),c("span",{key:"933103459afcf517ca61bfd58609bd91f5f0aa74"},"Inverted option")),c("li",{key:"8591e44da5910c0aaeb2a0149c5467e455d46f1f"},c("span",{key:"508f291d6769a44f9c4228b8f5744293d713ff0d"},c("ifx-icon",{key:"e1dbf1488bcd98cb0c914ce11343025c1c9ff6a4",class:"check__icon",icon:"check12"})),c("span",{key:"3ccde971205971f143d4f566ebd34c47c4733095"},"React, Vue and Angular wrapper integration")))),c("td",{key:"9318aae460f3cb85b7ec5e91f69bb87c87502d84"})),c("tr",{key:"bd9267697ed4835a9314934b2467dc685c9fb0a4"},c("td",{key:"80147ac50a679e076d72c23b449c1a9541d2fc8a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"37428c5556a30dc2dbe9b7c6aba86712e11b9526",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-pagination--development",size:"s",variant:"bold"},"Pagination")),c("td",{key:"16338c819ed99f8502ceb91e43fa4e1e817ba355"},c("ul",{key:"999751745f3ac3c1f74bc512536f9c4b9306d178"},c("li",{key:"3b6fd7e3e32539d17767eb8629a57a1d8de8da57"},c("span",{key:"06437ec59ea6196c106bf44c62d5caad9559d104"},c("ifx-icon",{key:"7b78c92e7d597fe645487a1e938f9f56dec77a7c",class:"check__icon",icon:"check12"})),c("span",{key:"07828b414fd68db0c4413c2395e1061fbf6a5ab0"},"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:"6da6eb36f99b2f23a488560dcbd04d02888e3508"},c("span",{key:"e8a1d737a8945a5a69c7f1bc1fcd0ea4cbe9799d"},c("ifx-icon",{key:"cb8da2c9a087497f6910c563e528afd2848116e7",class:"check__icon",icon:"check12"})),c("span",{key:"7698a25480d56a0eec8f17dab4658112db9019ae"},"Adheres to web standards")))),c("td",{key:"8ef628f895f1d5a3af1376f3acb95a5758d31a78"},c("ul",{key:"db469c6dda5300520fb4e1178af4e83cd1689015"},c("li",{key:"08133344b149cafe523ba5568a48a5d27b54b8da"},c("span",{key:"94ba5049e1f796d688105b462fc915396b9789c5"},c("ifx-icon",{key:"a765c2ffe7213051244c68c8acecdb6f9f82a6b9",class:"check__icon",icon:"check12"})),c("span",{key:"b4f755ee7aca3c00a4b4ca57e1b116120103ae18"},"Extended customization")),c("li",{key:"233f3280f47717787503a0874e838106d3093409"},c("span",{key:"68ed1ba52980a9fda4cb58cd07e3390bd7bc9c6f"},c("ifx-icon",{key:"2e429f86b3ba95b8755759356d65756cc8505921",class:"check__icon",icon:"check12"})),c("span",{key:"87f90615d4f167cfaa44e212a90cfb4175c16e59"},"Configurable Results Per Page option")),c("li",{key:"1673d97835cc80762fc38332f377c64b2678d4d8"},c("span",{key:"9e9bbb3b2070513f1acfc8acd0c7955ee6386f6c"},c("ifx-icon",{key:"a5399ae477969f897999e9fb0534183534aa8109",class:"check__icon",icon:"check12"})),c("span",{key:"1cb3c9cc9cdf336ebd36b520e462862ad143cd7e"},"React, Vue and Angular wrapper integration")))),c("td",{key:"5df01b2df5ae34850498b53b836f9199ef40b4c8"})),c("tr",{key:"17472da91aad0b6241ecfbf11991df3d53ae3956"},c("td",{key:"a5aba1c6dfdde03785e85a0c6bada9eb440c80fc",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"97cf2546025704bbc45e8854683540262039f676",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:"2c9c8184852627dc2c82eadf7e06a84a46522293"},c("ul",{key:"e9a1b32c1458add79acd16466566582ff1fcabac"},c("li",{key:"0df4b5c3b590d5aa9803a1b06ef9b0c9688c5442"},c("span",{key:"d3ef8b790f573abfd54e3fb0db954cfaa8ef00d7"},c("ifx-icon",{key:"436e4854baf99da52afa45b40c7450abdf513e1d",class:"check__icon",icon:"check12"})),c("span",{key:"e931507bd57105ad0c9c6c21a242ebe7f6d30eff"},"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:"296906cc8c7fbb0d8b0a42303e6744ae2fd37a32"},c("span",{key:"3669cfb7e5ea40485e5aece0494d97e3820bccce"},c("ifx-icon",{key:"7490b0035e372082e06d8b4e5dd86ef7a04d3f39",class:"check__icon",icon:"check12"})),c("span",{key:"df1db0c6b623d1dfbdb1978c4ea70529dd016156"},"Adheres to web standards")))),c("td",{key:"12f7745431f6834a23d9e16596770f926ebce398"},c("ul",{key:"429f94eb273308d6ffbd83925b6b630e3473e58e"},c("li",{key:"dd85ffa8385faf0c07c601e2d6ac6f196db87dcd"},c("span",{key:"e1d7be1770b6363a6d1211bb6c698eed27673581"},c("ifx-icon",{key:"93fab3e424fccfea7290b4a9b8eed721c8a1a275",class:"check__icon",icon:"check12"})),c("span",{key:"352e687227a2e9011219cd734782d4a61d5b03b2"},"Extended customization")),c("li",{key:"b83fc44ac2f4507f59c36f2b83db8a41710ef0f4"},c("span",{key:"b1b44d6c3b35ef14afef7758d66e4618d4b7de54"},c("ifx-icon",{key:"fab6c3ffd927ac72d8ba2c4d162d61419900ccdc",class:"check__icon",icon:"check12"})),c("span",{key:"f954d9840652c4da9c1ce2c9dc58d6890732274c"},"Show percentage option")),c("li",{key:"4e314c382da6dde5c71dc062bacdc779b203dc44"},c("span",{key:"aa03a85fa4018e3dfa7d9a6344b69fa66f3d464d"},c("ifx-icon",{key:"75a3fc2155084c53782e2e59d2f36c93b442a5a8",class:"check__icon",icon:"check12"})),c("span",{key:"07aa0f9d06181af36dfc5b405e0572811668eb65"},"Small and With Label variants included")),c("li",{key:"37bb56eb213da40020477f93cb9fb2ee682ec11d"},c("span",{key:"244c6a28136e6a4139b3a7aa4597e5689219720e"},c("ifx-icon",{key:"e7fe3d6124b6dc4bfe12ae54ee0c9ea506856de0",class:"check__icon",icon:"check12"})),c("span",{key:"4fbefde0a547c12853aa6f7a00baa83512820f5a"},"React, Vue and Angular wrapper integration")))),c("td",{key:"8d080be27a071406beba9617ec2f2908840dbdce"})),c("tr",{key:"eaceb3dc039eaea804936a2fd930f614f43e515f"},c("td",{key:"4b012ab429ce5bb5d0f279de1348b5ad9c3cdd70",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8cd99957e7c33e4f4256e8844922d713d2234dcd",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:"2f13390aadaac9f40c9e47c2dd37296db9488008"},c("ul",{key:"7b44b323c96b382d96e2141ec653a8a491bcbc44"},c("li",{key:"6d4bf99138e916347eb4e9c081896d96d81bbba0"},c("span",{key:"365eb95e7c89687ca6cf370dec51781588b0be81"},c("ifx-icon",{key:"2a42d1c7522609e9fe3633f92b73ec26177097a4",class:"check__icon",icon:"check12"})),c("span",{key:"bf46adc0107b9b89398d3d1b23829045c73d5dc7"},"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:"f74f965d8cb099384b03f7634dfcf1087921982b"},c("span",{key:"4bb2e45c02b0d3e9a482a52f79da3975b4c9c273"},c("ifx-icon",{key:"8e97e4d8b01c7010eb42b6c8acc260dc6ff39c81",class:"check__icon",icon:"check12"})),c("span",{key:"ca6b4d9990a72182e5fee7de4cf8e6af9822b1ba"},"Adheres to web standards")))),c("td",{key:"8dcf9c8e5ed0dddb14bb9eff499f43bf98e657e9"},c("ul",{key:"75221038f3e706f00f30f3ff0e9ce847cded8439"},c("li",{key:"fa6ef4b17b509dd4b01fcb95b308171d47530ef7"},c("span",{key:"fe3c70a7bc375d4546d7236e3b9d240d46d17e57"},c("ifx-icon",{key:"3d90f53fba7e84baef48a99282a3ded627c772fc",class:"check__icon",icon:"check12"})),c("span",{key:"650e37aeff1e4bb16240815d7cd2c8df3f635cb8"},"React, Vue and Angular wrapper integration")))),c("td",{key:"4d250f42c5100783eaec95df77047a1b211fa20c"})),c("tr",{key:"718d68099ede04299a11de385bb84fb7dfbad505"},c("td",{key:"482ab22a9b76d4b9dc3c7006c164506000fb3325",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"4dec19a30f5a056c1ef718348a4dda55f12ffc3c",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:"b42f6800e4925fb536a4f319aad7c958ecf745a1"},c("ul",{key:"0fc359984abce28702eee6fdcc4a8c6205c269c6"},c("li",{key:"9e30c20408f344fb7041db5f0bf791967dbfd3a1"},c("span",{key:"483da5beda2c5f9e31380876ae0727715a34e35c"},c("ifx-icon",{key:"26b315bfcfde7d5bfb6973760d41832282fee2d6",class:"check__icon",icon:"check12"})),c("span",{key:"5bd8747b41a8cb122e521274a54561c4cf08a879"},"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:"469fda73075d857e178a2556eb4e87580fdef225"},c("span",{key:"dc3c5a1e92f9550c27976506db18aba5ee5d4b2a"},c("ifx-icon",{key:"df310c324629d356b3fb3823f82eba3aa06f710f",class:"check__icon",icon:"check12"})),c("span",{key:"67663b7174f06a2eedb81cbaa0b59646274c69cf"},"Adheres to web standards")))),c("td",{key:"a8601118405310717dfb54f6a57a53565c477045"},c("ul",{key:"6a046ce8254c42c46a6c340940f2cf029f6fc571"},c("li",{key:"47571418a5ffc364958f41993f83dece78b46106"},c("span",{key:"1b5f18dfb30c0db3cc88ab112317e076eb9b539d"},c("ifx-icon",{key:"6f5ab0a2aa1bda786ce9f12edc84fafa0aa1d286",class:"check__icon",icon:"check12"})),c("span",{key:"1998533bb3f90b8122924e02f14aa084cf1ee3e7"},"Collapsable option")),c("li",{key:"b842e160b4d0898123d54bc6f8bc7687eb2dbf6c"},c("span",{key:"e47e096c109ad029356c51dfea59029319e4be8a"},c("ifx-icon",{key:"0ee76c6b88fa703ca3a515fe5f05da767dc707ae",class:"check__icon",icon:"check12"})),c("span",{key:"524112b3cffd5ebbef0a538738f3916668dbbc58"},"React, Vue and Angular wrapper integration")))),c("td",{key:"cb55fc9a002de9f824446881bdf4fecef8d73252"})),c("tr",{key:"729040266fa3bc0f74d0f23cd1b8da9e0189ba4b"},c("td",{key:"5f85f45bedeea8bb928110f81a361d86ad4e885f",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"fd3e35b6b339644a824538f8fef8749e3b726359",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:"e068d48dcf2aab9c00aedb354b31118546baf1ed"},c("ul",{key:"79417a134d504d45c35eac708bcd2923d5278ffa"},c("li",{key:"be5afaa10261621586ef38cb52ff5885e5920715"},c("span",{key:"e21d9de82a0686488e82d830cf6b65037c7a317c"},c("ifx-icon",{key:"dd77d23af39981fdec18aca0d525a8f554b29849",class:"check__icon",icon:"check12"})),c("span",{key:"a35cfe1649ea3c4231a1a843fe466f1935353054"},"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:"30cb4ed372cc2f9daf9751c3d252725abe1a5b9a"},c("span",{key:"21757322fe395c705564e4fec3429f3ccb8f7460"},c("ifx-icon",{key:"b86729010bc4e0c69598c4819e5f85b3610edbde",class:"check__icon",icon:"check12"})),c("span",{key:"6ea4691a5c6c09c6b72f629d4c08c81aad4e1e16"},"Adheres to web standards")))),c("td",{key:"5ed49694ee52dba4dda521cd7b59a36968fa1c59"},c("ul",{key:"26971cb8b836cabd4d25d0647e09940da88b241c"},c("li",{key:"41c89f27a3f5e434e86673a35da15a2152c595b1"},c("span",{key:"9a7e1c37001f12f1c8d23ccaa5dc50275c23fcf7"},c("ifx-icon",{key:"da3ff8e3c1e6415324fa06b406ab6c199e37749e",class:"check__icon",icon:"check12"})),c("span",{key:"3763295ff8699bd4e9d7ca3699e85aded6460bb5"},"Show Delete Icon option")),c("li",{key:"c0a81b052ad2c68feca815329c240353f2089fd0"},c("span",{key:"18e89959328a24cdfc8e98c89bd576970a51ba05"},c("ifx-icon",{key:"ef629f1a35171e0129fd37d7e4baa0f9f6266b08",class:"check__icon",icon:"check12"})),c("span",{key:"733ed59003ada766095df6ac8369a50b26bd4550"},"React, Vue and Angular wrapper integration")))),c("td",{key:"d59592297075bb1d637c90a846d916320b50bb67"})),c("tr",{key:"2c40e1b6a05f2379ff27040d88444e54e19df363"},c("td",{key:"59087e3b60894b2dfcaf98b65cd044b87d4a91ac",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"3cbeedd17b032a4119fcd7eca9563b3237a967eb",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:"989e6626db048c8a27470a2cf3511d6a57f69b84"},c("ul",{key:"e1150378f0328814b82ecf027e6e343ab25a2250"},c("li",{key:"e976272fbf8e6f19fc57a990f8738886d991f4e1"},c("span",{key:"eaee182fb8f385a1b696d96814168b706aac27fe"},c("ifx-icon",{key:"ada924066628c352f8afbf8c0608eb26fb68a460",class:"check__icon",icon:"check12"})),c("span",{key:"9787b88871c46849584db0d9350c60e02eccb655"},"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:"2cbfd1b1765bf780601c5dd7e8895c137c1151a4"},c("ul",{key:"22aba18e2e333e151206fc09238a5aba090c08be"},c("li",{key:"7aa736398a51d7da0fb696b0e723eaa04a4c6cb2"},c("span",{key:"1ef88dfc3f795736f35297a943089f7fa4313aed"},c("ifx-icon",{key:"00c4f4d4a4ad1d5dcd8780313e5e9ade3a24ccff",class:"check__icon",icon:"check12"})),c("span",{key:"bc9a5dfa92f3a6a2bae9c139dfab84017c640a42"},"Extended customization")),c("li",{key:"dd322348fb74a92ded985c924015ce8644e13f8b"},c("span",{key:"bd1da5014822ad40f82cecd8606c6d3b9c17712f"},c("ifx-icon",{key:"a671a78a0df898d3dd80535834cc1edb536bbc61",class:"check__icon",icon:"check12"})),c("span",{key:"a1586f65eca07f6273b549ce5a4af9be50ca19f4"},"Option to enable and disable the search")),c("li",{key:"0dd6afcd740c752ca11bb045a7855ff629320180"},c("span",{key:"72ac5cad60989fca5d1d8c3d53b02d5f5b766258"},c("ifx-icon",{key:"a4c7254c740442d05aacde31f2954d6cf6ae4f47",class:"check__icon",icon:"check12"})),c("span",{key:"064b93166b9b9ba3937b87300cef978736c0a34d"},"React, Vue and Angular wrapper integration")))),c("td",{key:"7a4a192c7e1396c6fcb7da7cb55701066e08a095"})),c("tr",{key:"0b2f53716d76048ec4916f93c4891755c333db94"},c("td",{key:"fb6eb897d15a52d3306350e57fc3f39ac1136e6b",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"1c32c8bb784a786691a340b3d2845ba5673a6dda",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:"5546ac9be2a8233a05d906c6f3bd7bdf3abecceb"},c("ul",{key:"f99ea0d8f0553bc46441c5413f3de060345d2df9"},c("li",{key:"7aba30f46d846bb9cf09a22ebd19be73e18c6287"},c("span",{key:"85ac6464ec892107b343bcc7c0c6471aa26b5d9b"},c("ifx-icon",{key:"2d7fb8036e895d3d31651d6ebfdb920c918eb24f",class:"check__icon",icon:"check12"})),c("span",{key:"05c798d59c6043f02f4dacf2760856abdaf9ee5c"},"Provides a dynamic and customizable dropdown list that allows users to make multiple selections from a list of options")),c("li",{key:"31996162bfb3f2fee48b185448d23f358e89743c"},c("span",{key:"e406f5233d394c22c8d16d07d5d029c265d3d366"},c("ifx-icon",{key:"07a8ddd021975dcd39cc9f296a7c8bd23daeab62",class:"check__icon",icon:"check12"})),c("span",{key:"01960931b9f948c792e271e1e89f23aecb0970d6"},"Adheres to web standards")))),c("td",{key:"ef1129848e75d46acea34257e713905ff394baf3"},c("ul",{key:"39019e1b5dbf23a2d5f1f0d5efe229ebd81bbe80"},c("li",{key:"bc4744ae268805c7e96a6414f433a9cfae4fc30c"},c("span",{key:"19881f73c1d02f878cd8e68b82a18a12c3642b24"},c("ifx-icon",{key:"bf8e3528d9d6189e895d20aff00ebf71fd9ba462",class:"check__icon",icon:"check12"})),c("span",{key:"29797542bf50c1d059e0aed2d1b92e9ff03c959c"},"Extended customization")),c("li",{key:"303d005aaf5a152ffc8e855dc187e5a8cb03cd52"},c("span",{key:"6a362701f98b79431f3de1dcf845ce4cd6f3a57a"},c("ifx-icon",{key:"7477e7dc9883f60004aba4fd474902c7ca104f35",class:"check__icon",icon:"check12"})),c("span",{key:"bc8643199a44c52080854b3483c6973288c4ab49"},"Nestable options")),c("li",{key:"b567d910096359b2ddf9fd8b69614360698fd388"},c("span",{key:"3d5c0acd81fea3647449e7925bf69dcd49ac8f85"},c("ifx-icon",{key:"652bb2bd902e356cf0b61618c8b018a07d7d8e3d",class:"check__icon",icon:"check12"})),c("span",{key:"8be57d5314cb3420bc0b0f65011aa362b9d69b70"},"React, Vue and Angular wrapper integration")))),c("td",{key:"0bba60ddba12552ad3d272521225eb8265d2f7f5"},c("ul",{key:"7080522d019444f587055631ada14d9c01936c62"},c("li",{key:"78bd88893ffd356b891537770df8839b954f9c63"},c("span",{key:"f954dcd84c59685fabc6654a383b646b07285f09"},c("ifx-icon",{key:"2def2296896aed4621094682456d29ae33c87794",class:"check__icon",icon:"check12"})),c("span",{key:"f76e073b875ef6ae11e37215cbea66631f252ac6"},"Option to enable and disable the search"))))),c("tr",{key:"6144dd18eb3b095a312f759742af6864391d69a7"},c("td",{key:"0b97c49cbd6eb0f0ea4538e693c8515f5a292a0f",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"127929e73d6726b384a8f50c449e8f6c756e604f",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:"eace6d7c4f3b502f57c4edfc66b23a1bd871018e"},c("ul",{key:"2de54edc67e266b7c39bd9ec1f003e7d55eff3e5"},c("li",{key:"95d9910df07152688c8448a38bb134487f58b218"},c("span",{key:"7d7b656d1989b1e8cb9818f980189dddb1faf413"},c("ifx-icon",{key:"414dceb499c1ee484fde783aca5d1446a7dbd73f",class:"check__icon",icon:"check12"})),c("span",{key:"845c9be7f9164a5401d1d8a4e450f9f94e721922"},"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:"3f9e677993c7ca8ed3b7bee3970891461118806a"},c("span",{key:"fca551fcb7fdcfa1df3a5c5accf018c018851e4e"},c("ifx-icon",{key:"f23e846a1c87614030e8504475de974cd2de2d99",class:"check__icon",icon:"check12"})),c("span",{key:"c3498011a692d24c080928ede150a26f3c494c09"},"Adheres to web standards")))),c("td",{key:"feb55dde7fa50fb78d67a83205a2081a477a84ff"},c("ul",{key:"583cfe43f6463034066fabb7c14d8e863e6ed276"},c("li",{key:"fb13fd36c967a72c7fd6d6894766c276b8fdbf90"},c("span",{key:"0784802d786fa09e2139d2a85b7335a5126921aa"},c("ifx-icon",{key:"77030761f3d65473dd0402043d94a208ea9836c9",class:"check__icon",icon:"check12"})),c("span",{key:"5d10d6c1d066ef5212d5dac0c8671005fd433913"},"Extended customization")),c("li",{key:"cc0b3ba6fc5c63b352b86a2db2acb413756b4a4f"},c("span",{key:"cfde1aa239ca319983d1449981b49cf3fddabde1"},c("ifx-icon",{key:"f6f64445d1b79b8692bb3c23091ba4ecef184b39",class:"check__icon",icon:"check12"})),c("span",{key:"35e652502fc2a3ebe0ddcf0e93c4ea285e20963d"},"Multi-layer nestable items and menu")),c("li",{key:"30832a0d497cc237c429ee7f1f4e3581d534c44f"},c("span",{key:"3d1cceedfc5fd9807446033a2463c7e2a6bd3ecc"},c("ifx-icon",{key:"b3036227841bbf47823a27900f557eceaf21c178",class:"check__icon",icon:"check12"})),c("span",{key:"58dc0039a6f9237ae3b017cebaaef869111f801b"},"Initial collapse option")),c("li",{key:"d915b8d7d2cdf10f897094f6cd9c3833a4daea49"},c("span",{key:"95176b6ec5ea5d36477628df1247d02aba3122e4"},c("ifx-icon",{key:"ea4628a8d2e3edeb9e28c53a7c0816afc76ba123",class:"check__icon",icon:"check12"})),c("span",{key:"5563a188539ad74531f5ac1c82c3346c932dddf5"},"Active and action item feature")),c("li",{key:"7fece3c812896ffeb90ca0b1d18b02175d39ac45"},c("span",{key:"fb79eeaee9c5c33b94e28dc091a57b27d8652463"},c("ifx-icon",{key:"51a715b22a7bac2c61e221c87c29e5b3945ace89",class:"check__icon",icon:"check12"})),c("span",{key:"0aca0d4bf9dea6b3b4cd72d5555e22b7f28a82f6"},"Number indicator integration")),c("li",{key:"ea3c556998c2aed3da5d39a9c8a0fa3511294488"},c("span",{key:"e6912506c3420261c2bad32bbeef45a449fcf51c"},c("ifx-icon",{key:"aaa4d829bb5472c6272506d288f40b2f436e69bd",class:"check__icon",icon:"check12"})),c("span",{key:"4947a4e494d82f6093f46890c1aec03c5701be5a"},"React, Vue and Angular wrapper integration")))),c("td",{key:"f540d01fe3ad12ebcffda59e43648e0e5aecd16d"},c("ul",{key:"ca91cbeaf3905b9934a789637b8e7ded4beefe04"},c("li",{key:"f44adeecb9d66b89b4694cd1a59e52b8bbcc7c1f"},c("span",{key:"a95e0eff2f12e1f18a103cbd7ec4565da294cee4"},c("ifx-icon",{key:"2347c76deca884747a770bc0f8abce4ec1e31acc",class:"check__icon",icon:"check12"})),c("span",{key:"aa9d7a82eeb94d8709cb0ddea743acdd2428f3bb"},"Removable Footer, Header and Logo")),c("li",{key:"f8e45cbad89ec451b7b3f072070338c842d996fb"},c("span",{key:"5497dcd1e565f1e1fd72699867fcc9b800d5c876"},c("ifx-icon",{key:"b3e73b0199c2123026c7ded6d707851da19b93f8",class:"check__icon",icon:"check12"})),c("span",{key:"373e84c157fded65f3655a19f51bd0d129ff02c6"},"Removable and customizable Links"))))),c("tr",{key:"9e3dca9fa7727d2d33c0c6bee45f156646ea5c2b"},c("td",{key:"e30c3a84f2cb3222a81bd1392308d6d23837bf4f",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8f78e710e31495a1f44317c7216ef67a65473307",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-slider--development",size:"s",variant:"bold"},"Slider")),c("td",{key:"e882ffae4fdbbd02085591d7a2354a2094d14e98"},c("ul",{key:"60d1190e500affcc9d7fb24477854b9148246867"},c("li",{key:"c215f6b54cca72b7748f8f8f6286e28fe37ff9ca"},c("span",{key:"b01f34823c54846d37b87e008c2a8b804875d410"},c("ifx-icon",{key:"b33195dbbe5ecfff34f6cec272c4d5e1bd5dd820",class:"check__icon",icon:"check12"})),c("span",{key:"381f27f207f373be9bfd1bb8eefc1bc30d6a9c16"},"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:"4a3319a35115efed7e7a905f4b0dd5d8f5b819de"},c("span",{key:"df8796a9e72fcd0140e648af5043eef42cc7f718"},c("ifx-icon",{key:"8b19b3543ac9b14b9488865202b995e445656fa3",class:"check__icon",icon:"check12"})),c("span",{key:"a9d9f5fbec7e2ecdd86cb9cefc944e29986a14c6"},"Adheres to web standards")))),c("td",{key:"b0d545da07af19ff42104487c5645c53962a244b"},c("ul",{key:"89bffd1e11a85af325650bc0e7d915857a49eab6"},c("li",{key:"8f5f9e317bf11dcb391c03cff32923811fc1db45"},c("span",{key:"2e08025a0d5b279fed176ded20b7fc3e0efb254c"},c("ifx-icon",{key:"69fc7216437107f960fd1a334fcfcee45c827ae4",class:"check__icon",icon:"check12"})),c("span",{key:"2060773599d642703de8099e1574a063351400c7"},"Icon incorporated")),c("li",{key:"afc5722fe89a79178be12a686bf9e08b62238bb2"},c("span",{key:"bfd4200bc1e90117f6f3c3bee823259009cc80ae"},c("ifx-icon",{key:"13822dcdabf0ac038eeeca11cb0044bcb590a33a",class:"check__icon",icon:"check12"})),c("span",{key:"ea1fa000b95f0e180cfba6e113cd80120d2aa1d3"},"Percentage variant")),c("li",{key:"1233710d8603aae872f8906ec3e328e9d0d5b433"},c("span",{key:"a86a115b4bcd19bb8c0b2cd6a64dd2fa25d61283"},c("ifx-icon",{key:"1b1b16586a077ab9687ea0d8f8c79365c860e779",class:"check__icon",icon:"check12"})),c("span",{key:"44bfbf4c53ac90dc478070b1d6358213303e08ca"},"Text variant")),c("li",{key:"e817b7cc52564d6be27ab219f4672a6f55e2307a"},c("span",{key:"20c93ea921ae6c2a4b1164742f44b1c5024e4321"},c("ifx-icon",{key:"be484860198f77be544079b03f34a2cb4786c927",class:"check__icon",icon:"check12"})),c("span",{key:"2892b228fcc05b1645c281d8887c81e882fed7c6"},"React, Vue and Angular wrapper integration")))),c("td",{key:"147398a576c2874035516b2c321d315c21a12b4f"})),c("tr",{key:"61ecfd2ecb4facb88ec203ca5762490a698dcf7e"},c("td",{key:"de4049ac955513c156679e78f575e197c9928cbd",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"2cfd795ccce8f02debcf949de499194a58b40258",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-spinner--development",size:"s",variant:"bold"},"Spinner")),c("td",{key:"b2db51410bab3004816fea7e41433298e61b2af6"},c("ul",{key:"eaf9347edb24efcd2b4706a098fa75dad536345b"},c("li",{key:"dc3d6644d1e1d5daa8e38332f47adeec30ed2da4"},c("span",{key:"ad713d74ff73f373c139effbb5f22101e602e9a5"},c("ifx-icon",{key:"fcfb2936f0f78af504f9f31f3e94b5a9b09cfad8",class:"check__icon",icon:"check12"})),c("span",{key:"fb85e3d1760b23aa292d9cc914ff7414acc789ac"},"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:"17116d379d83f032b5f14370b5e8ce58ed28ef89"},c("span",{key:"9e104d8e838cbc151bc95498a7ab33095bb9e760"},c("ifx-icon",{key:"95fc2f853e295cb53859e39bdb2c83d60c65cef3",class:"check__icon",icon:"check12"})),c("span",{key:"087d9964795a435dcc2039729c645d417ee8e4f7"},"Adheres to web standards")))),c("td",{key:"cef224b2ea37b1ac26f4f1f2ec93bba45ad20ee0"},c("ul",{key:"ad93caf9e9c1779b4b53004d51dca7aa04c9f8f4"},c("li",{key:"2e9648dc8da8da2cc7f4a9561b47f31d721e3a6d"},c("span",{key:"8762b8321b96b57c270cc093dca98a54974f7496"},c("ifx-icon",{key:"7464271247889f8b4985cf185766ba742a8ddf84",class:"check__icon",icon:"check12"})),c("span",{key:"6eed6863a26c7a405517ec9851f715f42f49f246"},"Brand variant")),c("li",{key:"d53283bbc86b164ddb483e01a6e1634d73379d94"},c("span",{key:"7cc4a43a98d37eb33ea0e1f4d61e88fd981d4f1c"},c("ifx-icon",{key:"d707d7e8de96f2e49384725e3d1a7a115e4785e7",class:"check__icon",icon:"check12"})),c("span",{key:"706c8b4c56c29b92d1af66b6ecc3e2169ed86403"},"React, Vue and Angular wrapper integration")))),c("td",{key:"d1e8e32371f670a0fbb7f3c19ae6cd1639ecd2c7"})),c("tr",{key:"e3071690a9c72721179c126b5a6e08ab89267c48"},c("td",{key:"ab547f6dcc9d9c5b7b4ac846a5d11305b2da5676",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"4997986d7f39d2c1c481bdeb778fa2585af1635c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-status--development",size:"s",variant:"bold"},"Status")),c("td",{key:"1874ba067b84dc85dc5f67e2abf42184a3dd043d"},c("ul",{key:"0de2f67c6dc3fd19f35c2dc004d72c694948da93"},c("li",{key:"870da91242e96d5500b493ded2752c4c78f22f5f"},c("span",{key:"fc60df93dc3985b3ebdbabd33f20f3fbf4998abb"},c("ifx-icon",{key:"38f14f8b7d405a5128511f37458db8f02187d14d",class:"check__icon",icon:"check12"})),c("span",{key:"e7da5810a4beec38d48656f359ab66d13ca9d497"},"Provides a visual indicator for conveying the state, status, or condition of an item, process, or entity within a web application")))),c("td",{key:"5b0b864b9b4c6757acee1f8454598caccb414c29"},c("ul",{key:"6ef541be4d2f99835956c01dcfa06e28babea50a"},c("li",{key:"fdec65418041f947c649fd232d07b42fbe4c00fb"},c("span",{key:"83a9f2f20ed759b601a4a13552819b8d2281c67a"},c("ifx-icon",{key:"b8d47d7ab4909a20435422666904bd407069b525",class:"check__icon",icon:"check12"})),c("span",{key:"a0ef0b476efffb95c700ea166c819f496f920397"},"Ocean, Orange, Grey, Light-grey, Red, Green and Berry color variants")),c("li",{key:"1325eba9148119f8fd688a383d284a6f8ffdefa1"},c("span",{key:"78c22ba7b7e7b8a9bd3196281be1619242183223"},c("ifx-icon",{key:"45793b78fa258921681a7708172e748c190df8d5",class:"check__icon",icon:"check12"})),c("span",{key:"60753b308b3f12b8b70321f6a4ace0a530a7fa90"},"Removable border")),c("li",{key:"8e888bce7c8362e748a67b18c1c2a544c2e2f43b"},c("span",{key:"be398525bea030a6cde957e7df75b57de60cc2a5"},c("ifx-icon",{key:"a49862312b1be489e5f2e7d924dcb93a8e09c025",class:"check__icon",icon:"check12"})),c("span",{key:"c3d503bb547c074d2b8aa6ebe35d4d27655aee68"},"React, Vue and Angular wrapper integration")))),c("td",{key:"ef5955198e362e2871a99fde0c01eecba85961a6"})),c("tr",{key:"a1fd4a2e796f691e0d148a85a3749f310feada06"},c("td",{key:"5953a33cf47324ca3c3e365e2091f7361f9187d9",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"16203b32095e0f8ab1387a14d05767347afe635f",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-stepper--development",size:"s",variant:"bold"},"Stepper")),c("td",{key:"9d438a1e95c3f2fa0451f19588411b397a32a196"},c("ul",{key:"0524ac01883fddc7d29761ed1a3c5656f98ad0c4"},c("li",{key:"83d9d3318e285c2cf2117e45c95665f6e736fda7"},c("span",{key:"fe6d9a5c0495054a423f5e9b0c842c75541f9654"},c("ifx-icon",{key:"cf210ce96776f388c72640a22013827c5ed9fd44",class:"check__icon",icon:"check12"})),c("span",{key:"1831da2aae1f6a31e8cae6796004b100e5840d3b"},"Offers a customizable and intuitive control that allows users to navigate through sequential steps")),c("li",{key:"adc44092f41483ace53ef14a372d54cf7e1b3352"},c("span",{key:"0c09ef537cd043aaff16a92d788bf3f35c9ec6a5"},c("ifx-icon",{key:"d84b323db8998e972227a921aaa6e86088d7659e",class:"check__icon",icon:"check12"})),c("span",{key:"d55eaf5a24750dbaeddb28e3483573e18da9718c"},"Default and Compact variants")),c("li",{key:"72174d1057e23ae49b0aa143843c0fa9c69e65f6"},c("span",{key:"c2e2bee1195ef68295c2c99c8bf7976d6ea127a5"},c("ifx-icon",{key:"4c3f6170417b417cfc79508081579263ca898d7c",class:"check__icon",icon:"check12"})),c("span",{key:"0630f897fc1359693c4bbc8f66166589e77215ff"},"React, Vue and Angular wrapper integration")))),c("td",{key:"bf528d7cb21e681e3ddf2638ebc34ff852b40e4c"},c("ul",{key:"a789ea877ea5a5af70291ac424d60152db7c037f"},c("li",{key:"2c9060cade724a46c098eaba5243861c7d0e423c"},c("span",{key:"163f7c2dac4a94711076a2414abee750e0396025"},c("ifx-icon",{key:"08b7e4bee3cc9a933d020a999bb57e2cb36a2c23",class:"check__icon",icon:"check12"})),c("span",{key:"2e5082c4f300e57f8f11f5d4573878066d16bc04"},"Vertical variant")))),c("td",{key:"f3e2e0c55c4a3a43c53f0c7ad3210227d07cc49b"})),c("tr",{key:"f1742cbcccb66e33ad0bce78493671f3e93396bd"},c("td",{key:"874cfb3a7881d89e112b824baebef427ec4b4c60",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"afb74ba2b23e05a1ff3e18ff10edca1beb29366d",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-switch--development",size:"s",variant:"bold"},"Switch")),c("td",{key:"26321a07dc7bd74da1ba2b24a95082dddbec9ee1"},c("ul",{key:"8c913ae0334a6181949c7c21b593d817eb37bc07"},c("li",{key:"53ecd6cf9827da14b1d35999eeca6aaf8f278952"},c("span",{key:"548964bd9cb0aa74a997e3746dbdd29e1c6f76ba"},c("ifx-icon",{key:"f07a28b1d40272fe451c962b022998ef5e26f397",class:"check__icon",icon:"check12"})),c("span",{key:"bdfd6295c62fabe1f611d61a0ba9a86dab18d8b2"},"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:"7bfb5e01ac8b0c2cea1eed8aca4d93cea027c0bf"},c("span",{key:"becb6ce2d0352d08bc42a84f782d54f7bd7fe8f3"},c("ifx-icon",{key:"fe321b9defb13092e8f773dcff1b8a0b5638dbae",class:"check__icon",icon:"check12"})),c("span",{key:"49d648d28c99fcc7e9812305dd7ebac056d3ad7a"},"Adheres to web standards")))),c("td",{key:"df4e955edfc56e64cf1b01287064e6a65ace4ea9"},c("ul",{key:"1b43160ac4fd07084cbc592ed9a8ce5fd3f84a10"},c("li",{key:"a47f6552d274139ebaf9948fcf72919e585a682b"},c("span",{key:"20508a82b75012684b3147641ba5e4a12662ddd0"},c("ifx-icon",{key:"1d8aeffcd6b0158b16e7001bf4d8790eb0799dd7",class:"check__icon",icon:"check12"})),c("span",{key:"6750709e9d5869e1614e7043a50837fca98cfa61"},"Incorporated label feature")),c("li",{key:"75bdccb1920ee850c00ee6c7979eefa33b6bac08"},c("span",{key:"947cb8586477da71882897f0ba87b06c68fc99ed"},c("ifx-icon",{key:"7618831d62b6075eac9770c5b9a94325a43103af",class:"check__icon",icon:"check12"})),c("span",{key:"3ae15d5fce8c16510e2599f1ec7d3a2a2db1d80e"},"React, Vue and Angular wrapper integration")))),c("td",{key:"6025afa49d739cfcb93e637d8b7bbf4f59fc3b2e"})),c("tr",{key:"50bdb8c33fcfcd61ba08586f72db15dcc1e9210e"},c("td",{key:"111e8e061f05ecfd5b4d9e99448eaf666c45f8e1",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"bbeecc3158c3041b0387c0666319ce7144aa42a9",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:"e64600f73ff7ccee5721f0eacfb643fad0514716"},c("ul",{key:"5f6cf55819c16cbd0535ef0712460ec91363ef5b"},c("li",{key:"34a026a622a8d8424dee100044880ad5a1de63fa"},c("span",{key:"dd8c1f9804d56d9880d5818dfa27f65253b7e2c0"},c("ifx-icon",{key:"8938ce7399a48416f4f4f4f06e56172ce85c50fb",class:"check__icon",icon:"check12"})),c("span",{key:"2dd797c38941180a636883ea21a25fa7f6156f2f"},"Offers essential functionality for organizing data into rows and columns, allowing users to view, sort, and interact with structured information efficiently")),c("li",{key:"038563127f15457b84a66d73d635fcf25222555a"},c("span",{key:"8ff7c4f6913f7765561d45991f6171531c124a01"},c("ifx-icon",{key:"9e07a5e76c893f0f1f9f9adb699a8f31fb27ebf4",class:"check__icon",icon:"check12"})),c("span",{key:"8d1801d5fff9770fb48ca5762929f2045035f659"},"Includes basic features such as column sorting")))),c("td",{key:"a617d47231ecb2fc897b5d40d70d94ca7b7972f1"},c("ul",{key:"640479008a2ae97d071947f8283b276a5ceebcb5"},c("li",{key:"fbc1b5c37305509845fd814f197d1d6d92aee393"},c("span",{key:"ba13ddbb786309954cd9ef494fe5dc26e81554fd"},c("ifx-icon",{key:"4f7ba85fc6a070f85c2016f4f07f201fffc630ba",class:"check__icon",icon:"check12"})),c("span",{key:"07906fef6155d351edcefff001977f6cab438ea3"},"Compact and Default variant")),c("li",{key:"ac04018278baf57d505aade4561433d9d28e5ade"},c("span",{key:"9a391cf9b6001fa304f4d402a8de35708d2676a0"},c("ifx-icon",{key:"7b6af9d5b3c011eaea27a6bbb19c4d103674fb24",class:"check__icon",icon:"check12"})),c("span",{key:"d82acfa68d5bb5c4d95afe22bd8f68f5268c3aeb"},"React, Vue and Angular wrapper integration")))),c("td",{key:"3afc94d776369ee7ee8b4a6dd77c8a2fccc7fb31"})),c("tr",{key:"0d25afbb2ee8663b9eb3d613b759b916a9442f5f"},c("td",{key:"c78092d3ddefa177b9cf35ab9e59adf6e993e1d2",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"0494528d5c04aa22ed58d99ae2029bb573a727e8",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:"1773d410bfaeb6bedbbc9b61eed6f7c87f583d99"},c("ul",{key:"e7f436d574a152a696dea3881b7685b45bdb2f5b"},c("li",{key:"6c240b6cbf8f6990d00dc329113f763e8c61c8cb"},c("span",{key:"735e91cf3ef705d27020aa64c8cbbfe11c064b3a"},c("ifx-icon",{key:"2b6465b9afa0bd2505e5ad5d2d568e3eb8c2be19",class:"check__icon",icon:"check12"})),c("span",{key:"39a5266e9f08e16ecef175da5b654b55e2c5f6fb"},"Pagination")),c("li",{key:"6711d8afe1478ffb423868842b4a5dcfb841cd60"},c("span",{key:"5cd8f1eca6bc02eef7b1fffc52c200e03235d598"},c("ifx-icon",{key:"ae5fda9059bde3c318417b828e13a209bc732a47",class:"check__icon",icon:"check12"})),c("span",{key:"b9806a9b45a080f21b5a148208676a2843a70e17"},"Sidebar filter")),c("li",{key:"497159d6a0a27138896df424b0d577d21da20820"},c("span",{key:"040ea45b2438a49bffa1493462496ae8e941b802"},c("ifx-icon",{key:"6240ae49e7247b33fc8a0ad4a7586451fbddf528",class:"check__icon",icon:"check12"})),c("span",{key:"72664995b441beab9416eee9be0837960d235353"},"Topbar filter")),c("li",{key:"68923860691e93ee22ddddb74db599d5359ab45c"},c("span",{key:"9f657f8d6fe768e5aa428fd899b5a48aaf6b4840"},c("ifx-icon",{key:"088724290de37dfdce15c9d53b2fb0d8f61f4ca9",class:"check__icon",icon:"check12"})),c("span",{key:"4618ac82bef5c77fe1e75ffc3dec3953f2db3a44"},"Nestable buttons")))),c("td",{key:"a90ae39175ba41a68e244d46e234946c3fc50dd6"}),c("td",{key:"6c8d68abf4c27c3c1f255a988bb746dc69426d33"})),c("tr",{key:"ece4aa52bbd5d3bf5cb4a7f4998ed47279979881"},c("td",{key:"f5e20f778f16725a798e6e0094082c3000de5f97",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"9088c137e1ace5656cdf65c5e4d4b0e9e469e70a",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tabs--development",size:"s",variant:"bold"},"Tabs")),c("td",{key:"e1d8bda73b2dfc7186d802153da28481c9f844e1"},c("ul",{key:"c99e2dc27208a3dff2a0f292a4fa0c051dc81e4b"},c("li",{key:"bfbb25a2f54d29db29eb31b16309142cccc0a7aa"},c("span",{key:"050de00700494c62c02c1eec37bd2722e1e31b25"},c("ifx-icon",{key:"ed8957cfcd08c894cb7fe46270c0cd41c1774f70",class:"check__icon",icon:"check12"})),c("span",{key:"cbceb352b2b5cf660f6973f9a74bc38c4c3ce94a"},"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:"2fba8a7895aa89d68dab5aad420638d00a37865d"},c("span",{key:"696c6ed8b5d9c287dea5493ae1939a597354d5d4"},c("ifx-icon",{key:"dc113d6371f8a0308a2d7229fda7d5a7e08ea308",class:"check__icon",icon:"check12"})),c("span",{key:"2ee2f3b17416db5cf562bb0c98f0f2031e26ba72"},"Adheres to web standards")))),c("td",{key:"af734e3179e964945581b461b2ce2473dd748cb9"},c("ul",{key:"95bda2533a291c3db4c7530b4b741efa3de53719"},c("li",{key:"0c303e02a74f8e1d44388d27d283f8f556a0c021"},c("span",{key:"e6b0bc9be4975d93bb18671e4789f266610be45c"},c("ifx-icon",{key:"a904dd8eb9accf8a889a350cece6eac109be8b67",class:"check__icon",icon:"check12"})),c("span",{key:"df042e9e4bc5a7490635e3369ae7fe40721e6593"},"Horizontal and Vertical orientation")),c("li",{key:"9f23698caaa8d32a0c7a11ef5a069200f106e53f"},c("span",{key:"a4617c061fa06c3a87cc6ac7093df88a12c25577"},c("ifx-icon",{key:"716c5555ab752e7b9369bc1e07d33639cb282969",class:"check__icon",icon:"check12"})),c("span",{key:"59c7c895e0afe144346014b7164a5ca81a546390"},"Extended customization")),c("li",{key:"0f57ef3aac17fc559579885c02dce2d05459eef0"},c("span",{key:"4a2dbd4a253b980b09f7fe560437904fc9967358"},c("ifx-icon",{key:"b3a212e8f47a0d088edc84668939648401a81009",class:"check__icon",icon:"check12"})),c("span",{key:"810cc300429feed758a1833d995cbaec1d635e99"},"React, Vue and Angular wrapper integration")))),c("td",{key:"582bdd19fe0337a4efb2c02c5cb9e52a1cfd26b8"})),c("tr",{key:"05d72ace7263c3131831825095920a3ab29b7436"},c("td",{key:"4a3926efb248e9cd20e9e253fb1bc3589011fa8b",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"72d347ab03e06bf1c94c4bc317eea8071a8e9749",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tag--development",size:"s",variant:"bold"},"Tag")),c("td",{key:"00ed2935ae1fc78337c09192b2ac5d89d24db810"},c("ul",{key:"a0cf287854b0501e5f5fdde0b468c5ff25a73c11"},c("li",{key:"97ff4b59be396417f37ea4d065a2f9fe67e2de6a"},c("span",{key:"7c748b6b26fd6023032b5f694725541def005417"},c("ifx-icon",{key:"25a77739d7dfbd67d45b4765a46bd78b7bcfbda7",class:"check__icon",icon:"check12"})),c("span",{key:"b119cd329d5785c6906b3207977c4e41edb6acba"},"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:"b1e4fc4dc88d609c414385e417791f5239a31f5a"},c("ul",{key:"e89aa0eb4134374167f19e14e1fd7e37c6d9c88c"},c("li",{key:"a6d1f3178272c05419de3b1e524d91ad02b8265c"},c("span",{key:"a52e4aaff563c0dbed1b50724220e12934c4d603"},c("ifx-icon",{key:"096901de10dc45d626fb3e75b03eecd397cb3de0",class:"check__icon",icon:"check12"})),c("span",{key:"585ddb1d5ab7adb8430b3de6276ac7bb2686f7a7"},"Icon incorporated")),c("li",{key:"9cfa8fbfbb9a8dfe7749428d63d8ab4756603827"},c("span",{key:"3583279b2762232ee39ef084510640b53e791610"},c("ifx-icon",{key:"50a0e0f6114fb3aa63334fa587d5e2174696303a",class:"check__icon",icon:"check12"})),c("span",{key:"2392d14ed6702db45dba3c6de87ca05a5723f3d8"},"React, Vue and Angular wrapper integration")))),c("td",{key:"a7ffd0779dae7f13ac5ecc06357a445416c98ff4"})),c("tr",{key:"3d6ebd9417d5963700a25590b31a13acb1e3336e"},c("td",{key:"6bbe31e83e2b7ac7dc13438ca5a10c6bb8b7fcc1",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"4ba61af8e4535b810de5c631976585e6cf137e8b",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:"544bb5390853d29280200e7300c6342ce6627522"},c("ul",{key:"20c3b2dae2eec15f0fa2cd31fdc2253da87920dc"},c("li",{key:"6a74a06769c811e0ba0a5e4220533c29a48d2629"},c("span",{key:"26a6d69b4bcc8929db5280be0e4f83ecf0d5f383"},c("ifx-icon",{key:"50af14b744b90d8416272059d5fc327285fe1d25",class:"check__icon",icon:"check12"})),c("span",{key:"ead11822d771350b0dda896499c475f46f108386"},"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:"c23cd02be749420e921129e6bf21dcda5a930715"},c("span",{key:"0de77bf691355405911cef68212042fc6bf05ddd"},c("ifx-icon",{key:"f6c561cc58c52df748165a9d028c8b9c02dec71b",class:"check__icon",icon:"check12"})),c("span",{key:"987d0306c8d3e5d10d70032cffd35bc1592b445b"},"Adheres to web standards")))),c("td",{key:"0b4ee733d30c12e139653b0f2d6110960c365c8d"},c("ul",{key:"95ae0b422fb8b4dd0cc866f0001903bd640dc694"},c("li",{key:"8c869de093c50fd85d9ef43758485f02813f9c50"},c("span",{key:"af1012348307f06bb84ab5e9d7a575d65b2da038"},c("ifx-icon",{key:"4b6498f38dbb73d75a9fcab791fda85fc44b5335",class:"check__icon",icon:"check12"})),c("span",{key:"6760d25420b620baa116daa41b412e61cb06b930"},"Extended customization")),c("li",{key:"21678aef2745c50ab5236ee8f95435bfa8ec6b8d"},c("span",{key:"0b396d562021aee5e19025db91f32c3c25bf94e0"},c("ifx-icon",{key:"61b1ee24610c1f09516db709272c6f3cfa0b7ea6",class:"check__icon",icon:"check12"})),c("span",{key:"21736bc739cec896f4af1b9051c1188199d12235"},"Possibility for icon configuration")),c("li",{key:"1aa5abdd91726c8ef33163f4da36781938f0e5f3"},c("span",{key:"8e0a7d38ee31fdf7503925516f62f290762ee801"},c("ifx-icon",{key:"40d07bb72c1d6354a27bda049330f657485b3f83",class:"check__icon",icon:"check12"})),c("span",{key:"7c47b54e2445122043c1f4a6654c8cad1c5dc243"},"React, Vue and Angular wrapper integration")))),c("td",{key:"77d5fced038b85d6c37a65167f52949057154d59"},c("ul",{key:"e749d7b5de0ad204ddd2ac585e145ca91ef5a79d"},c("li",{key:"299e16cc670cb39d0554a06548fbda167ee85a34"},c("span",{key:"e043575f812bcee295611b1f7e9daad81291be6e"},c("ifx-icon",{key:"d095d655fd0c66bca75894166a655af179d8be03",class:"check__icon",icon:"check12"})),c("span",{key:"ff4bdf50d13a93df08b98d3b9814c556b4c692a1"},"Form integration"))))),c("tr",{key:"d0e9ff288956c48939868434a8ff9b4221bcbff5"},c("td",{key:"00f909f1e1112f42f87fe1969df1ab09f5f61037",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"e8998ce8719e2713fce3616c6025159486476cd3",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tooltip--development",size:"s",variant:"bold"},"Tooltip")),c("td",{key:"22e84451b5fc4e0c0f109672108ce10a48df7925"},c("ul",{key:"349ad6d5228503ffb43d2b7e166d3e35c111adeb"},c("li",{key:"3c6362906c9360478529bbdfacd47e57fe9d3b61"},c("span",{key:"17999453c52a9c3e693a3ee905cabc2d4dbf3a7d"},c("ifx-icon",{key:"ba4b1e576440f28fd2d0f2dc65e504cf6fb1e7cc",class:"check__icon",icon:"check12"})),c("span",{key:"fc345b7e835ceedaf2197ddd1fd5e32cef04ba18"},"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:"e5e099d08173ce6d3a81786c54f3707f1b6d7370"},c("span",{key:"9b8ab7c169e6873a66b412ecd58fba6cd80a383e"},c("ifx-icon",{key:"03fe507a53342625d56fe990759a8d387d918dee",class:"check__icon",icon:"check12"})),c("span",{key:"9618dc44255ff457cab2039ee0151c006f61e62b"},"Adheres to web standards")))),c("td",{key:"8ec7bb6c2c0ee907abd218a46e2d5d4d59d4373d"},c("ul",{key:"12ef1f715fef2f37312f56a5d49187502f247901"},c("li",{key:"d25083266a6228ddc2c1cde9231f54e5ff4d4a08"},c("span",{key:"f2d78095330f407c2a4d142e24437770d92b3c94"},c("ifx-icon",{key:"a9e8bbf557148dd97319d9c3808f638e06ec6692",class:"check__icon",icon:"check12"})),c("span",{key:"e513652684ba954321ecb003ddd1b211ac4468fc"},"Compact, dismissible and Extended variants")),c("li",{key:"4c88d5d33a2f7ec386fe9e58e136b35e147b4f0f"},c("span",{key:"056ab545d0d306be7c02061375ea48767d79d9fe"},c("ifx-icon",{key:"099a1e30e8bb6a78ad2c3c83129b4c0e19fee66b",class:"check__icon",icon:"check12"})),c("span",{key:"eb56cce0e88e7c3217dbba189faebca4e3e1f51e"},"Auto-adjusting position")),c("li",{key:"53b743681f1ae0cc2147ccb197d9f411bde1793e"},c("span",{key:"e9d5d4f12a5d28d8478173306a2897a7985bdddf"},c("ifx-icon",{key:"2a87313ccb76e934365069378596b45a50bf442f",class:"check__icon",icon:"check12"})),c("span",{key:"6d1782a57765c125f5d10a06cc0913eec150d248"},"Icon incorporated")),c("li",{key:"f1ee754e2bda910abbf55f03d3fa9c44df07fd90"},c("span",{key:"8c09c98b4a63a85f140aef5bd7beac27b267ae92"},c("ifx-icon",{key:"6cebf715d529b449687b53f544333c9ab69bf735",class:"check__icon",icon:"check12"})),c("span",{key:"d9578999c7e617ae29bb7da70272f4bfe63b7932"},"React, Vue and Angular wrapper integration")))),c("td",{key:"2c15b2a0c74c6154469874daaa106a3eaf88fc7e"})),c("tr",{key:"1ffca361bfa6101474de746c3b24766c6db616e9"},c("td",{key:"ce4eb4cb8cbbc7d52b9adffe3805e7d5138f6e57",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"98e1fb985d3f0bdfcd624998d4a4dbfcd6523445",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-notification--development",size:"s",variant:"bold"},"Notification")),c("td",{key:"a25e9b448a8c4304aa83761ee7c04056c30810a9"},c("ul",{key:"0a12ae783de3f6096ae2e32399e550cd294fb85c"},c("li",{key:"662940fde1aeb92be4407e72fd3f2cb30521de40"},c("span",{key:"c0a4c33f20d6ef8f35e80d1d929756e9d3f008bc"},c("ifx-icon",{key:"628afcfbb77368458fe8f66c2b6d08b92a6e50e4",class:"check__icon",icon:"check12"})),c("span",{key:"d5ac1198a874c44373845681e1cd88e8c965240c"},"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:"bb25ebc60c90c80890baf046dbeb0d42e90c55e4"},c("span",{key:"e354786bd861068130fd2b6ea5e7a750046080a5"},c("ifx-icon",{key:"92d1141bec82c9ddd0cde4ef1e2d71c113bc79e8",class:"check__icon",icon:"check12"})),c("span",{key:"c1407a429874cd9e852f09293fc51c4b94be7265"},"Adheres to web standards")))),c("td",{key:"d7c91f87f44534ccf37ebbd3d64fb93fc222db16"}),c("td",{key:"b38c8b748c74d2c51387011cb4ae4b0a1a7adbc6"})),c("tr",{key:"e2484a41ac53ffda71153131f39ec45a9bfb180a"},c("td",{key:"d0c62691d9c1700cf45f86b29737914d8f0452b4",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"4d5b66407c59de357de70a678d75a1fce10ad989",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:"19e2abc3f34abf59f83ccd56e22a17ec8aa91ced"},c("ul",{key:"1b3eb7b1095e97c6b1ed941d9a7110a29e732874"},c("li",{key:"949476d0f63fbeb6930fa6b294a7247582f526bf"},c("span",{key:"e6e710d14c4352bf8dc75cf0596e933333c9d6b6"},c("ifx-icon",{key:"d71d19ff3a3e27ef49028c276a3890940849a7ad",class:"check__icon",icon:"check12"})),c("span",{key:"c26d92e4a7cc97823e94be1c0c7f8a4dc3c9e5af"},"Provides a flexible and intuitive interface for dynamically switching between different content sections or views within a web application")),c("li",{key:"5cb01cb70e407d0154589faf35b12fa40e699f64"},c("span",{key:"97128f4a5d92de01c2b745949f3d5b8305d7b599"},c("ifx-icon",{key:"d58280a6a4b8eccda54dab1d129167d240c74841",class:"check__icon",icon:"check12"})),c("span",{key:"c469a7052d7bcd9b794a793caf2a271ef0121e5b"},"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:"eb8212c0d16a20d65e55270c2577f58aaa721c07"},c("span",{key:"2209c41e67a882520fb857f6c2db21fef9aa5db8"},c("ifx-icon",{key:"2d0826c7071cb4e106259f101f1a11464dc25172",class:"check__icon",icon:"check12"})),c("span",{key:"259a555bae1166ed46efa0d070397dc3e619c2fb"},"Adheres to web standards")))),c("td",{key:"57f463a572dbd1e815ead1543efae8c160a464ba"}),c("td",{key:"f0273df569fb5d23e8c597dddb2916b5646adc29"})),c("tr",{key:"2e7e29d9989ede5f5349f6cd470e9e503ca25fc7"},c("td",{key:"5e653e57c63da6fa165cd55a22d9b075f73380c8",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"2fcc61aba9d0777c2f79b9287e6aef983b283596",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:"19a8f705061c6e4906044822458b359016c74c89"},c("ul",{key:"4ae4de1bf679aa8c7ff1fd2311a9aeb58ba32ac0"},c("li",{key:"83a9cef2c85f49d351f88ccdd400b9afe5601641"},c("span",{key:"01a569c6d643f0c17a5f185724f1733025c95f08"},c("ifx-icon",{key:"3829f6fc8aee414a9c412f0412d773a836d1f5d2",class:"check__icon",icon:"check12"})),c("span",{key:"8c38b9e7151667431f61e0037d62c5e220feb86d"},"Provides a clear and interactive interface for users to make mutually exclusive selections among multiple options within a web application")),c("li",{key:"5d45cec37bc94df150ceca772bc289583f3660da"},c("span",{key:"8bb2946aa1caee944a58fc7c11c5f3a19415120f"},c("ifx-icon",{key:"9667d89dbec92167e3eb285af2c26408d484ae14",class:"check__icon",icon:"check12"})),c("span",{key:"d2e63954a736487fc4ed4f25e0edb55adf5ac4fe"},"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:"c405a51ae66a1aae6765fb621265afb3f9d5f8fd"},c("span",{key:"14a275d65f742068f3051065e3745e51fb43e74b"},c("ifx-icon",{key:"ce67811f367f2c1726346e0a5c8b86c57a4eb4ec",class:"check__icon",icon:"check12"})),c("span",{key:"ef75cca237b5c1bc68f043a1cf76c7eb386329aa"},"Adheres to web standards")))),c("td",{key:"4c8faaf9ab2bf528d07c7d24c40f1ba26b86e9ae"}),c("td",{key:"3e2fb75f79cc521b813b642fda2593415c9fe32f"})),c("tr",{key:"c1fbf0b68d4b031e9fb706b926d3eb2315d0dffe"},c("td",{key:"f880bdb2847354c9017904ad02440c6b6106eec4",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"17f1c4fcdb224950df5401025dc1e76fc265c767",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:"4052175f7a0c50b4ec4409798668f1238523b8f5"},c("ul",{key:"9e3b141c19d08c407ba9f2a7cc704f14f782b25a"},c("li",{key:"cc56599c4e40b21599b465562b1d0cecd334784d"},c("span",{key:"75d929425bc82fd079a6a3ace778bfad77988dff"},c("ifx-icon",{key:"dfe5e90e16ca2a70fa3a2f276b9df2d288b9c2e7",class:"check__icon",icon:"check12"})),c("span",{key:"17625204aab7b6ad268ec4ba985a5942e9b28988"},"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:"0162915725717813be8d5f1a9b291acb768aaa78"},c("span",{key:"9cc77e035237cafdc9763f9496dd507d5674071e"},c("ifx-icon",{key:"31b545f84d2448fa6f975bfabff4e5a9838d7f7a",class:"check__icon",icon:"check12"})),c("span",{key:"894cbf597915b989a6bd514d79c86615e840a366"},"Form integration")))),c("td",{key:"c2f8d8aaff7bfc967fe234b24d2fb5a79f81f3c2"}),c("td",{key:"0356f6a69bde137ceb6ea010ef3b0fe3db1ef9f8"})),c("tr",{key:"ebc1dd6a6c209dfea0c69c717f0b994838f39ef0"},c("td",{key:"30b63e3873ca0db62a50294b039eb090b37a7ae3",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"b28386d0e5c84f1c6ad25521fdf97279a4ab1420",href:"",size:"s",variant:"bold"},"Card Group")),c("td",{key:"70b1c8d07ce7e085cf4ad2c535355161bdf0611e"},c("ul",{key:"5f09b68dae9a888cc8189b9bedeb24be45480ef7"},c("li",{key:"2559e8e32a8575c07d8965f10680c6296893712a",class:"planned__component-wrapper"},c("span",{key:"66cc55f64bf325be08f2f03c4dfd6d37ba0230f8"},c("ifx-icon",{key:"e8c1d396d770cb951d41649d5749f3f5360ab05c",class:"planned__icon",icon:"clock24"})),c("span",{key:"273e6d3e42d422dc47e4b923a3244da1727bc138"},"On Hold")))),c("td",{key:"276136133ea5896b0b61c7ddb86a8f86766bc1d7"}),c("td",{key:"5976c754bff445eb67321ed9e80ac9ffea54c378"})),c("tr",{key:"e5b78f6e35859a3c482bfcf64e43a0720bf59ef2"},c("td",{key:"ae5a327ebf4bec9423e75c1e70dd7eb209a03e57",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"a36f52b0b79aee96d34fa1f04b140f0cf28fbbe8",href:"",size:"s",variant:"bold"},"Advanced Date Picker")),c("td",{key:"e307a405ebf671ca868c69e36db01d42878db6c4"},c("ul",{key:"83e5318171b812eca2ef2207e6d18dba7b6a7a50"},c("li",{key:"d298126d9e8afbc0be197a48a42a1da0c3d38145",class:"planned__component-wrapper"},c("span",{key:"b33729420a794055015084495654568dbfcf146f"},c("ifx-icon",{key:"b322d0574818c3a23c24d5067d894616228232f2",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"7e3982a64dc68b36f8791644337b400ae4f02345"},"In Progress")))),c("td",{key:"84327611713b5fecad7c450ee02e414dad59ef46"}),c("td",{key:"c18486ccdcaf2ca8694b2c517592375209c8c490"})),c("tr",{key:"3737084745a8499ee9acbb4a7daf8542b2fa0a0e"},c("td",{key:"c76f6b83fe3285f6a69c73e3031417724c978c62",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"1b835385b00bff104140ecc5a827f6a0c5ab630c",href:"",size:"s",variant:"bold"},"Upload")),c("td",{key:"aaeaadc5dc978e58535e736bcd45c5696c4b5350"},c("ul",{key:"b8cb5aa8ba5f024df5eafa4f8991bccffe399969"},c("li",{key:"6e5c1f0c01ea7f176ad0a2d1f63a5b29f980ff09",class:"planned__component-wrapper"},c("span",{key:"208fd4f95927c7b0c6907eca6b35dfade3fb9dac"},c("ifx-icon",{key:"dfb5b81f943ada5b6f4187afb118976da93d5167",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"dd558928334ae1b503f9b94cf935e913f14f1a35"},"In Progress")))),c("td",{key:"d7f9b2d79490ae2507e17174098ae72e39383cbe"}),c("td",{key:"8eb9fbe01832e0367bd7c5c044fc548700023a79"})),c("tr",{key:"7879b70db93b2751a8a27174028984273a146bcb"},c("td",{key:"35fac9a1d135886fb4d454f4b3cefc0ec3e3ee35",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"c7fa884edc24506caae56ab20f7ba30881e4a698",href:"",size:"s",variant:"bold"},"Checkbox Group")),c("td",{key:"aba11d003aefb495d3a36baa0648c9449aea7fbf"},c("ul",{key:"4cb4ff32c66b6e1897ff0ad3a6757a101b25c8fc"},c("li",{key:"3da6cd743a717ad7d71b2313fa63cf0ddd3b2a81",class:"planned__component-wrapper"},c("span",{key:"54f639c94b4a3d0b0c85ce614900f9c9b029406d"},c("ifx-icon",{key:"04209bd3ffa6a3cb42d06e484ec651baef4db440",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"c3c28fb265de62f599f9ef39a674ef4d92b10ca9"},"In Progress")))),c("td",{key:"ea54d48d3c2822bbf9ce2f6fbfcf459ab76f5fb5"}),c("td",{key:"6aa8aee42945b54a06bcaff9c6f290ecda4f0d4d"})),c("tr",{key:"3399ddbc45a63d880fdbd9eecc6f49c7ee2a5d3b"},c("td",{key:"8b0542c484e0a27a7fc3863df64367815b45e8ae",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"e80316aed87c1e68b818ea9a99ad01ca23b80d01",href:"",size:"s",variant:"bold"},"Radio Group")),c("td",{key:"27968e0410d6037666f2a72e95be6fc04ad250f8"},c("ul",{key:"f1a923912e98fa65137522310d130cc0b5023529"},c("li",{key:"2dbcd0ddd77985eba3444f9bd5bab603324b6e19",class:"planned__component-wrapper"},c("span",{key:"d2a60665ddbe6f3c211bcd0bab0f1c46a2865184"},c("ifx-icon",{key:"640502e72e930d308cb649ac1a4c9880fda423f1",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"dfbc022f6275f97837d6e7495dc5240349582158"},"In Progress")))),c("td",{key:"a6b7c07666887f1732395273c993b666866e07c8"}),c("td",{key:"fbe836182038e510cbc84ef0368072292d236937"})),c("tr",{key:"117ac09efe645c177b3da0a66c7b679a9e2d917c"},c("td",{key:"eaeaf5685a952ea8b42b48f85795365d3e10c289",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"38bc43388dfb5ca277fea5154854e47842ad7b1f",href:"",size:"s",variant:"bold"},"Tree View")),c("td",{key:"2b4289ed166230af67946d4af98555d80f4e7980"},c("ul",{key:"51788d2842c6d53866936fff4edd01854de38abc"},c("li",{key:"e6e2b397028a060ffa4b7838250e0fb7847fdeaa",class:"planned__component-wrapper"},c("span",{key:"a7a9c85952e534f148fd9535421a2c72b3dc283f"},c("ifx-icon",{key:"0efc87eb1dc1061141b1eac5d2d75a4db160d1be",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"8481ff1f835ceab50de8cfd685fc022057ce3571"},"In Progress")))),c("td",{key:"938c52189f6aadced95a7ff10557325015ae09b5"}),c("td",{key:"e1d72ce79cf29f9f14a4ef27b66d813d9bdefca6"})),c("tr",{key:"09cd4567590e775861b6c728d3dbdbf57330390b"},c("td",{key:"3f9cea55d4574f6cf5208943b32a755a8a34b760",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"6469d152b6b7082e8d1c0f39ba54fed111d8a2a4",href:"",size:"s",variant:"bold"},"Popover")),c("td",{key:"73cbd1a8889609040f4659466fa433d4fbcf1dfa"},c("ul",{key:"eaefefeb82112d1454e7d0ced6aa7d3ae8d0fb91"},c("li",{key:"fd2d7845d7b29d10258943ad6c9450c531348c87",class:"planned__component-wrapper"},c("span",{key:"7287ad73119349c8080e61a4a0914355ff00666d"},c("ifx-icon",{key:"9815332414572bfb8ec13b1b8eb394d50f944aeb",class:"planned__icon",icon:"clock24"})),c("span",{key:"58fcf34ef7c009aaf149cc5af5fbd8190d9ad347"},"On Hold")))),c("td",{key:"34666308834740e96fc4035f98dfb7d8b46f4d43"}),c("td",{key:"5edb9397312e38dd63c10ff5c24d23dc0736a3ae"})))))))}get el(){return a(this)}};b.style=f;export{b as ifx_overview_table};
|
2
|
-
//# sourceMappingURL=p-a351a04d.entry.js.map
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as t,h as i,g as e}from"./p-6b122987.js";const s='@charset "UTF-8";.list-group-item{display:flex;align-items:center;justify-content:space-between;height:40px;width:350px;padding:8px 16px;background-color:#FFFFFF;border:1px solid #EEEDED;border-radius:1px 1px 0px 0px;font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;font-family:var(--ifx-font-family)}.list-group-item.flush{border:none;border-bottom:1px solid #EEEDED}.list-group-item.flush.bulletpoint{padding:8px}.list-group-item.bulletpoint .list-group-item-content::before{content:"•";display:inline-block;font-size:1.125rem;padding-right:10px}.list-group-item:hover:not(.show){background-color:#EEEDED}.list-group-item:active:not(.show){background-color:#0A8276;color:#FFFFFF}.list-group-item.show{display:block;height:88px;padding:16px}';const o=s;const l=class{constructor(i){t(this,i);this.isFlush=false;this.hasBulletpoint=false;this.badge=false;this.badgeValue=0}componentWillLoad(){const t=this.el.closest("ifx-list-group");if(t.flush){this.isFlush=true}else this.isFlush=false;if(t.bulletpoint&&!this.badge){this.hasBulletpoint=true}else this.hasBulletpoint=false}render(){return i("div",{key:"d50beef84939fea9d25bd5a7a0450683f4580f89",class:`list-group-item \n ${this.isFlush?"flush":""}\n ${this.hasBulletpoint?"bulletpoint":""}`},i("div",{key:"56373799f79b2379fb0f22ef0f2abf8468bd74c9",class:"list-group-item-content"},i("slot",{key:"2080edc3978491aa3abd0de9dff866f5d8582a4b"})),this.badge&&i("ifx-number-indicator",{key:"212364a9efd52a75d47f453c7652574c2332082c"},this.badgeValue))}get el(){return e(this)}};l.style=o;export{l as ifx_list_item};
|
2
|
-
//# sourceMappingURL=p-abff59ea.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["listGroupItemCss","IfxListItemStyle0","ListGroupItem","componentWillLoad","ifxListGroup","this","el","closest","flush","isFlush","bulletpoint","badge","hasBulletpoint","render","h","key","class","badgeValue"],"sources":["src/components/list-group/list-group-item.scss?tag=ifx-list-item&encapsulation=shadow","src/components/list-group/list-group-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.list-group-item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: tokens.$ifxSize500;\n width: 350px;\n padding: 8px 16px;\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid tokens.$ifxColorEngineering200;\n border-radius: 1px 1px 0px 0px;\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n font-family: var(--ifx-font-family);\n\n &.flush {\n border: none;\n border-bottom: 1px solid tokens.$ifxColorEngineering200;\n\n &.bulletpoint {\n padding: 8px;\n }\n }\n\n &.bulletpoint {\n & .list-group-item-content::before {\n content: \"•\";\n display: inline-block;\n font-size: tokens.$ifxFontSizeL;\n padding-right: 10px;\n }\n }\n\n &:hover:not(.show) {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &:active:not(.show) {\n background-color: tokens.$ifxColorOcean500;\n color: tokens.$ifxColorBaseWhite;\n }\n\n &.show {\n display: block;\n height: 88px;\n padding: 16px;\n }\n}","import { Component, h, Element, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'ifx-list-item',\n styleUrl: 'list-group-item.scss',\n shadow: true,\n})\n\nexport class ListGroupItem {\n @Element() el;\n @Prop({ mutable: true }) isFlush: boolean = false;\n @State() hasBulletpoint: boolean = false;\n @Prop() badge: boolean = false;\n @Prop() badgeValue: number = 0;\n\n componentWillLoad() {\n const ifxListGroup = this.el.closest('ifx-list-group')\n if (ifxListGroup.flush) {\n this.isFlush = true;\n } else this.isFlush = false;\n\n if (ifxListGroup.bulletpoint && !this.badge) {\n this.hasBulletpoint = true;\n } else this.hasBulletpoint = false;\n }\n\n render() {\n return (\n <div class={\n `list-group-item \n ${this.isFlush ? 'flush' : \"\"}\n ${this.hasBulletpoint ? 'bulletpoint' : \"\"}`}>\n <div class=\"list-group-item-content\">\n <slot />\n </div>\n {this.badge && <ifx-number-indicator>{this.badgeValue}</ifx-number-indicator>}\n </div>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAmB,4vBACzB,MAAAC,EAAeD,E,MCOFE,EAAa,M,sCAEoB,M,oBACT,M,WACV,M,gBACI,C,CAE7B,iBAAAC,GACE,MAAMC,EAAeC,KAAKC,GAAGC,QAAQ,kBACrC,GAAIH,EAAaI,MAAO,CACtBH,KAAKI,QAAU,I,MACVJ,KAAKI,QAAU,MAEtB,GAAIL,EAAaM,cAAgBL,KAAKM,MAAO,CAC3CN,KAAKO,eAAiB,I,MACjBP,KAAKO,eAAiB,K,CAG/B,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MACH,6BACEX,KAAKI,QAAU,QAAU,eACzBJ,KAAKO,eAAiB,cAAgB,MACxCE,EAAA,OAAAC,IAAA,2CAAKC,MAAM,2BACTF,EAAA,QAAAC,IAAA,8CAEDV,KAAKM,OAASG,EAAA,wBAAAC,IAAA,4CAAuBV,KAAKY,Y","ignoreList":[]}
|