@infineon/infineon-design-system-stencil 33.2.0 → 33.2.1--canary.1845.491a66dcc03a541697e62d5bb63a47ca939c570b.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-accordion_2.cjs.entry.js +2 -2
- package/dist/cjs/ifx-accordion_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-alert_2.cjs.entry.js +1 -1
- package/dist/cjs/ifx-alert_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-badge.cjs.entry.js +1 -1
- package/dist/cjs/ifx-badge.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-basic-table.cjs.entry.js +1 -1
- package/dist/cjs/ifx-basic-table.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-breadcrumb-item-label.cjs.entry.js +1 -1
- package/dist/cjs/ifx-breadcrumb-item-label.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-breadcrumb-item.cjs.entry.js +1 -1
- package/dist/cjs/ifx-breadcrumb-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-breadcrumb.cjs.entry.js +1 -1
- package/dist/cjs/ifx-breadcrumb.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-button.cjs.entry.js +1 -1
- package/dist/cjs/ifx-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-card-headline.cjs.entry.js +1 -1
- package/dist/cjs/ifx-card-headline.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-card-links.cjs.entry.js +1 -1
- package/dist/cjs/ifx-card-links.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-card-overline.cjs.entry.js +1 -1
- package/dist/cjs/ifx-card-overline.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-card-text.cjs.entry.js +1 -1
- package/dist/cjs/ifx-card-text.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-card.cjs.entry.js +1 -1
- package/dist/cjs/ifx-card.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-checkbox-group.cjs.entry.js +1 -1
- package/dist/cjs/ifx-checkbox-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-chip_3.cjs.entry.js +3 -3
- package/dist/cjs/ifx-chip_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-dropdown-header.cjs.entry.js +1 -1
- package/dist/cjs/ifx-dropdown-header.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-dropdown-item.cjs.entry.js +1 -1
- package/dist/cjs/ifx-dropdown-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-footer-column.cjs.entry.js +1 -1
- package/dist/cjs/ifx-footer-column.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-footer.cjs.entry.js +1 -1
- package/dist/cjs/ifx-footer.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-link.cjs.entry.js +1 -1
- package/dist/cjs/ifx-link.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-modal.cjs.entry.js +1 -1
- package/dist/cjs/ifx-modal.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-multiselect.cjs.entry.js +1 -1
- package/dist/cjs/ifx-multiselect.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-navbar.cjs.entry.js +1 -1
- package/dist/cjs/ifx-navbar.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-notification.cjs.entry.js +1 -1
- package/dist/cjs/ifx-notification.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-number-indicator.cjs.entry.js +1 -1
- package/dist/cjs/ifx-number-indicator.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-progress-bar.cjs.entry.js +1 -1
- package/dist/cjs/ifx-progress-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-radio-button-group.cjs.entry.js +1 -1
- package/dist/cjs/ifx-radio-button-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-radio-button.cjs.entry.js +1 -1
- package/dist/cjs/ifx-radio-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-search-bar.cjs.entry.js +1 -1
- package/dist/cjs/ifx-search-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-search-field.cjs.entry.js +1 -1
- package/dist/cjs/ifx-search-field.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-segment.cjs.entry.js +1 -1
- package/dist/cjs/ifx-segment.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-segmented-control.cjs.entry.js +1 -1
- package/dist/cjs/ifx-segmented-control.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-select.cjs.entry.js +1 -1
- package/dist/cjs/ifx-select.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-sidebar-item.cjs.entry.js +1 -1
- package/dist/cjs/ifx-sidebar-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-sidebar-title.cjs.entry.js +1 -1
- package/dist/cjs/ifx-sidebar-title.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-sidebar.cjs.entry.js +1 -1
- package/dist/cjs/ifx-sidebar.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-slider.cjs.entry.js +1 -1
- package/dist/cjs/ifx-slider.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-spinner_2.cjs.entry.js +1 -1
- package/dist/cjs/ifx-spinner_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-status.cjs.entry.js +1 -1
- package/dist/cjs/ifx-status.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-step.cjs.entry.js +1 -1
- package/dist/cjs/ifx-step.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-stepper.cjs.entry.js +1 -1
- package/dist/cjs/ifx-stepper.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-switch.cjs.entry.js +1 -1
- package/dist/cjs/ifx-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-table.cjs.entry.js +1 -1
- package/dist/cjs/ifx-table.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-tabs.cjs.entry.js +1 -1
- package/dist/cjs/ifx-tabs.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-tag.cjs.entry.js +1 -1
- package/dist/cjs/ifx-tag.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-textarea.cjs.entry.js +1 -1
- package/dist/cjs/ifx-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/ifx-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/ifx-tooltip.cjs.entry.js.map +1 -1
- package/dist/collection/components/accordion/accordion.css +2 -2
- package/dist/collection/components/accordion/accordionItem.css +2 -2
- package/dist/collection/components/alert/alert.css +1 -1
- package/dist/collection/components/badge/badge.css +1 -1
- package/dist/collection/components/breadcrumb/breadcrumb-item-label.css +1 -1
- package/dist/collection/components/breadcrumb/breadcrumb-item.css +1 -1
- package/dist/collection/components/breadcrumb/breadcrumb.css +1 -1
- package/dist/collection/components/button/button.css +1 -1
- package/dist/collection/components/card/card-headline/card-headline.css +1 -1
- package/dist/collection/components/card/card-links/card-links.css +1 -1
- package/dist/collection/components/card/card-overline/card-overline.css +1 -1
- package/dist/collection/components/card/card-text/card-text.css +1 -1
- package/dist/collection/components/card/card.css +1 -1
- package/dist/collection/components/checkbox-group/checkbox-group.css +1 -1
- package/dist/collection/components/chip/chip-item/chip-item.css +1 -1
- package/dist/collection/components/chip/chip.css +1 -1
- package/dist/collection/components/dropdown/dropdown-header/dropdown-header.css +1 -1
- package/dist/collection/components/dropdown/dropdown-item/dropdown-item.css +1 -1
- package/dist/collection/components/footer/footer-column.css +1 -1
- package/dist/collection/components/footer/footer.css +1 -1
- package/dist/collection/components/link/link.css +1 -1
- package/dist/collection/components/modal/modal.css +1 -1
- package/dist/collection/components/navigation/navbar/navbar.css +1 -1
- package/dist/collection/components/navigation/sidebar/sidebar-item.css +1 -1
- package/dist/collection/components/navigation/sidebar/sidebar-title.css +1 -1
- package/dist/collection/components/navigation/sidebar/sidebar.css +1 -1
- package/dist/collection/components/notification/notification.css +1 -1
- package/dist/collection/components/number-indicator/number-indicator.css +1 -1
- package/dist/collection/components/pagination/pagination.css +1 -1
- package/dist/collection/components/progress-bar/progress-bar.css +1 -1
- package/dist/collection/components/radio-button/radio-button.css +1 -1
- package/dist/collection/components/radio-button-group/radio-button-group.css +1 -1
- package/dist/collection/components/search-bar/search-bar.css +1 -1
- package/dist/collection/components/search-field/search-field.css +1 -1
- package/dist/collection/components/segmented-control/segment/segment.css +1 -1
- package/dist/collection/components/segmented-control/segmented-control.css +1 -1
- package/dist/collection/components/select/multi-select/multiselect.css +1 -1
- package/dist/collection/components/select/single-select/select.css +1 -1
- package/dist/collection/components/slider/slider.css +1 -1
- package/dist/collection/components/status/status.css +1 -1
- package/dist/collection/components/stepper/step/step.css +1 -1
- package/dist/collection/components/stepper/stepper.css +1 -1
- package/dist/collection/components/switch/switch.css +1 -1
- package/dist/collection/components/table-advanced-version/table.css +1 -1
- package/dist/collection/components/table-basic-version/table.css +1 -1
- package/dist/collection/components/tabs/tabs.css +1 -1
- package/dist/collection/components/tag/tag.css +1 -1
- package/dist/collection/components/text-field/text-field.css +1 -1
- package/dist/collection/components/textarea/textarea.css +1 -1
- package/dist/collection/components/tooltip/tooltip.css +1 -1
- package/dist/components/ifx-accordion-item.js +1 -1
- package/dist/components/ifx-accordion.js +1 -1
- package/dist/components/ifx-alert.js +1 -1
- package/dist/components/ifx-badge.js +1 -1
- package/dist/components/ifx-badge.js.map +1 -1
- package/dist/components/ifx-basic-table.js +1 -1
- package/dist/components/ifx-basic-table.js.map +1 -1
- package/dist/components/ifx-breadcrumb-item-label.js +1 -1
- package/dist/components/ifx-breadcrumb-item-label.js.map +1 -1
- package/dist/components/ifx-breadcrumb-item.js +1 -1
- package/dist/components/ifx-breadcrumb-item.js.map +1 -1
- package/dist/components/ifx-breadcrumb.js +1 -1
- package/dist/components/ifx-breadcrumb.js.map +1 -1
- package/dist/components/ifx-button.js +1 -1
- package/dist/components/ifx-card-headline.js +1 -1
- package/dist/components/ifx-card-headline.js.map +1 -1
- package/dist/components/ifx-card-links.js +1 -1
- package/dist/components/ifx-card-links.js.map +1 -1
- package/dist/components/ifx-card-overline.js +1 -1
- package/dist/components/ifx-card-overline.js.map +1 -1
- package/dist/components/ifx-card-text.js +1 -1
- package/dist/components/ifx-card-text.js.map +1 -1
- package/dist/components/ifx-card.js +1 -1
- package/dist/components/ifx-card.js.map +1 -1
- package/dist/components/ifx-checkbox-group.js +1 -1
- package/dist/components/ifx-checkbox-group.js.map +1 -1
- package/dist/components/ifx-chip-item.js +1 -1
- package/dist/components/ifx-chip.js +1 -1
- package/dist/components/ifx-download.js +1 -1
- package/dist/components/ifx-dropdown-header.js +1 -1
- package/dist/components/ifx-dropdown-header.js.map +1 -1
- package/dist/components/ifx-dropdown-item.js +1 -1
- package/dist/components/ifx-dropdown-item.js.map +1 -1
- package/dist/components/ifx-dropdown-trigger-button.js +1 -1
- package/dist/components/ifx-faq.js +2 -2
- package/dist/components/ifx-filter-accordion.js +1 -1
- package/dist/components/ifx-filter-bar.js +1 -1
- package/dist/components/ifx-filter-search.js +1 -1
- package/dist/components/ifx-footer-column.js +1 -1
- package/dist/components/ifx-footer-column.js.map +1 -1
- package/dist/components/ifx-footer.js +1 -1
- package/dist/components/ifx-footer.js.map +1 -1
- package/dist/components/ifx-icons-preview.js +2 -2
- package/dist/components/ifx-link.js +1 -1
- package/dist/components/ifx-list-entry.js +1 -1
- package/dist/components/ifx-list.js +1 -1
- package/dist/components/ifx-modal.js +1 -1
- package/dist/components/ifx-modal.js.map +1 -1
- package/dist/components/ifx-multiselect.js +1 -1
- package/dist/components/ifx-navbar-item.js +1 -1
- package/dist/components/ifx-navbar.js +1 -1
- package/dist/components/ifx-navbar.js.map +1 -1
- package/dist/components/ifx-notification.js +1 -1
- 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-progress-bar.js.map +1 -1
- package/dist/components/ifx-radio-button-group.js +1 -1
- package/dist/components/ifx-radio-button-group.js.map +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-bar.js.map +1 -1
- package/dist/components/ifx-search-field.js +1 -1
- package/dist/components/ifx-segment.js +1 -1
- package/dist/components/ifx-segment.js.map +1 -1
- package/dist/components/ifx-segmented-control.js +1 -1
- package/dist/components/ifx-segmented-control.js.map +1 -1
- package/dist/components/ifx-select.js +1 -1
- package/dist/components/ifx-set-filter.js +3 -3
- package/dist/components/ifx-sidebar-item.js +2 -2
- package/dist/components/ifx-sidebar-item.js.map +1 -1
- package/dist/components/ifx-sidebar-title.js +1 -1
- package/dist/components/ifx-sidebar-title.js.map +1 -1
- package/dist/components/ifx-sidebar.js +1 -1
- package/dist/components/ifx-sidebar.js.map +1 -1
- package/dist/components/ifx-slider.js +1 -1
- package/dist/components/ifx-slider.js.map +1 -1
- package/dist/components/ifx-status.js +1 -1
- package/dist/components/ifx-status.js.map +1 -1
- package/dist/components/ifx-step.js +1 -1
- package/dist/components/ifx-step.js.map +1 -1
- package/dist/components/ifx-stepper.js +1 -1
- package/dist/components/ifx-stepper.js.map +1 -1
- package/dist/components/ifx-switch.js +1 -1
- package/dist/components/ifx-switch.js.map +1 -1
- package/dist/components/ifx-table.js +7 -7
- package/dist/components/ifx-table.js.map +1 -1
- package/dist/components/ifx-tabs.js +1 -1
- package/dist/components/ifx-tabs.js.map +1 -1
- package/dist/components/ifx-tag.js +1 -1
- package/dist/components/ifx-tag.js.map +1 -1
- package/dist/components/ifx-template.js +1 -1
- package/dist/components/ifx-templates-ui.js +5 -5
- package/dist/components/ifx-text-field.js +1 -1
- package/dist/components/ifx-textarea.js +1 -1
- package/dist/components/ifx-textarea.js.map +1 -1
- package/dist/components/ifx-tooltip.js +1 -1
- package/dist/components/ifx-tooltip.js.map +1 -1
- package/dist/components/{p-0ccba8b1.js → p-078c6a8c.js} +3 -3
- package/dist/components/{p-0ccba8b1.js.map → p-078c6a8c.js.map} +1 -1
- package/dist/components/{p-ee5532fd.js → p-1954dccf.js} +3 -3
- package/dist/components/{p-ee5532fd.js.map → p-1954dccf.js.map} +1 -1
- package/dist/components/{p-7b38ddd5.js → p-2ee3b6f1.js} +2 -2
- package/dist/components/{p-7b38ddd5.js.map → p-2ee3b6f1.js.map} +1 -1
- package/dist/components/{p-f36effad.js → p-61da5077.js} +2 -2
- package/dist/components/{p-f36effad.js.map → p-61da5077.js.map} +1 -1
- package/dist/components/{p-59110a4e.js → p-65790300.js} +2 -2
- package/dist/components/{p-59110a4e.js.map → p-65790300.js.map} +1 -1
- package/dist/components/{p-26e62031.js → p-7b823d73.js} +2 -2
- package/dist/components/{p-26e62031.js.map → p-7b823d73.js.map} +1 -1
- package/dist/components/{p-b4e91450.js → p-7ddd7e93.js} +2 -2
- package/dist/components/{p-b4e91450.js.map → p-7ddd7e93.js.map} +1 -1
- package/dist/components/p-7e81b330.js +164 -0
- package/dist/components/{p-cc9cb040.js.map → p-7e81b330.js.map} +1 -1
- package/dist/components/{p-5b5399c2.js → p-9346ec80.js} +2 -2
- package/dist/components/p-9346ec80.js.map +1 -0
- package/dist/components/{p-23757cfd.js → p-934aaccc.js} +2 -2
- package/dist/components/{p-23757cfd.js.map → p-934aaccc.js.map} +1 -1
- package/dist/components/{p-327af560.js → p-aafad924.js} +2 -2
- package/dist/components/{p-327af560.js.map → p-aafad924.js.map} +1 -1
- package/dist/components/{p-1d737cf7.js → p-ab0eb700.js} +2 -2
- package/dist/components/{p-1d737cf7.js.map → p-ab0eb700.js.map} +1 -1
- package/dist/components/{p-04a697ad.js → p-acceee38.js} +2 -2
- package/dist/components/{p-04a697ad.js.map → p-acceee38.js.map} +1 -1
- package/dist/components/{p-88691420.js → p-b4f0f616.js} +3 -3
- package/dist/components/{p-88691420.js.map → p-b4f0f616.js.map} +1 -1
- package/dist/components/{p-7c7a5393.js → p-f309fc91.js} +2 -2
- package/dist/components/p-f309fc91.js.map +1 -0
- package/dist/components/{p-79352b7c.js → p-f9b7eeac.js} +4 -4
- package/dist/components/{p-79352b7c.js.map → p-f9b7eeac.js.map} +1 -1
- package/dist/esm/ifx-accordion_2.entry.js +2 -2
- package/dist/esm/ifx-accordion_2.entry.js.map +1 -1
- package/dist/esm/ifx-alert_2.entry.js +1 -1
- package/dist/esm/ifx-alert_2.entry.js.map +1 -1
- package/dist/esm/ifx-badge.entry.js +1 -1
- package/dist/esm/ifx-badge.entry.js.map +1 -1
- package/dist/esm/ifx-basic-table.entry.js +1 -1
- package/dist/esm/ifx-basic-table.entry.js.map +1 -1
- package/dist/esm/ifx-breadcrumb-item-label.entry.js +1 -1
- package/dist/esm/ifx-breadcrumb-item-label.entry.js.map +1 -1
- package/dist/esm/ifx-breadcrumb-item.entry.js +1 -1
- package/dist/esm/ifx-breadcrumb-item.entry.js.map +1 -1
- package/dist/esm/ifx-breadcrumb.entry.js +1 -1
- package/dist/esm/ifx-breadcrumb.entry.js.map +1 -1
- package/dist/esm/ifx-button.entry.js +1 -1
- package/dist/esm/ifx-button.entry.js.map +1 -1
- package/dist/esm/ifx-card-headline.entry.js +1 -1
- package/dist/esm/ifx-card-headline.entry.js.map +1 -1
- package/dist/esm/ifx-card-links.entry.js +1 -1
- package/dist/esm/ifx-card-links.entry.js.map +1 -1
- package/dist/esm/ifx-card-overline.entry.js +1 -1
- package/dist/esm/ifx-card-overline.entry.js.map +1 -1
- package/dist/esm/ifx-card-text.entry.js +1 -1
- package/dist/esm/ifx-card-text.entry.js.map +1 -1
- package/dist/esm/ifx-card.entry.js +1 -1
- package/dist/esm/ifx-card.entry.js.map +1 -1
- package/dist/esm/ifx-checkbox-group.entry.js +1 -1
- package/dist/esm/ifx-checkbox-group.entry.js.map +1 -1
- package/dist/esm/ifx-chip_3.entry.js +3 -3
- package/dist/esm/ifx-chip_3.entry.js.map +1 -1
- package/dist/esm/ifx-dropdown-header.entry.js +1 -1
- package/dist/esm/ifx-dropdown-header.entry.js.map +1 -1
- package/dist/esm/ifx-dropdown-item.entry.js +1 -1
- package/dist/esm/ifx-dropdown-item.entry.js.map +1 -1
- package/dist/esm/ifx-footer-column.entry.js +1 -1
- package/dist/esm/ifx-footer-column.entry.js.map +1 -1
- package/dist/esm/ifx-footer.entry.js +1 -1
- package/dist/esm/ifx-footer.entry.js.map +1 -1
- package/dist/esm/ifx-link.entry.js +1 -1
- package/dist/esm/ifx-link.entry.js.map +1 -1
- package/dist/esm/ifx-modal.entry.js +1 -1
- package/dist/esm/ifx-modal.entry.js.map +1 -1
- package/dist/esm/ifx-multiselect.entry.js +1 -1
- package/dist/esm/ifx-multiselect.entry.js.map +1 -1
- package/dist/esm/ifx-navbar.entry.js +1 -1
- package/dist/esm/ifx-navbar.entry.js.map +1 -1
- package/dist/esm/ifx-notification.entry.js +1 -1
- package/dist/esm/ifx-notification.entry.js.map +1 -1
- package/dist/esm/ifx-number-indicator.entry.js +1 -1
- package/dist/esm/ifx-number-indicator.entry.js.map +1 -1
- package/dist/esm/ifx-progress-bar.entry.js +1 -1
- package/dist/esm/ifx-progress-bar.entry.js.map +1 -1
- package/dist/esm/ifx-radio-button-group.entry.js +1 -1
- package/dist/esm/ifx-radio-button-group.entry.js.map +1 -1
- package/dist/esm/ifx-radio-button.entry.js +1 -1
- package/dist/esm/ifx-radio-button.entry.js.map +1 -1
- package/dist/esm/ifx-search-bar.entry.js +1 -1
- package/dist/esm/ifx-search-bar.entry.js.map +1 -1
- package/dist/esm/ifx-search-field.entry.js +1 -1
- package/dist/esm/ifx-search-field.entry.js.map +1 -1
- package/dist/esm/ifx-segment.entry.js +1 -1
- package/dist/esm/ifx-segment.entry.js.map +1 -1
- package/dist/esm/ifx-segmented-control.entry.js +1 -1
- package/dist/esm/ifx-segmented-control.entry.js.map +1 -1
- package/dist/esm/ifx-select.entry.js +1 -1
- package/dist/esm/ifx-select.entry.js.map +1 -1
- package/dist/esm/ifx-sidebar-item.entry.js +1 -1
- package/dist/esm/ifx-sidebar-item.entry.js.map +1 -1
- package/dist/esm/ifx-sidebar-title.entry.js +1 -1
- package/dist/esm/ifx-sidebar-title.entry.js.map +1 -1
- package/dist/esm/ifx-sidebar.entry.js +1 -1
- package/dist/esm/ifx-sidebar.entry.js.map +1 -1
- package/dist/esm/ifx-slider.entry.js +1 -1
- package/dist/esm/ifx-slider.entry.js.map +1 -1
- package/dist/esm/ifx-spinner_2.entry.js +1 -1
- package/dist/esm/ifx-spinner_2.entry.js.map +1 -1
- package/dist/esm/ifx-status.entry.js +1 -1
- package/dist/esm/ifx-status.entry.js.map +1 -1
- package/dist/esm/ifx-step.entry.js +1 -1
- package/dist/esm/ifx-step.entry.js.map +1 -1
- package/dist/esm/ifx-stepper.entry.js +1 -1
- package/dist/esm/ifx-stepper.entry.js.map +1 -1
- package/dist/esm/ifx-switch.entry.js +1 -1
- package/dist/esm/ifx-switch.entry.js.map +1 -1
- package/dist/esm/ifx-table.entry.js +1 -1
- package/dist/esm/ifx-table.entry.js.map +1 -1
- package/dist/esm/ifx-tabs.entry.js +1 -1
- package/dist/esm/ifx-tabs.entry.js.map +1 -1
- package/dist/esm/ifx-tag.entry.js +1 -1
- package/dist/esm/ifx-tag.entry.js.map +1 -1
- package/dist/esm/ifx-textarea.entry.js +1 -1
- package/dist/esm/ifx-textarea.entry.js.map +1 -1
- package/dist/esm/ifx-tooltip.entry.js +1 -1
- package/dist/esm/ifx-tooltip.entry.js.map +1 -1
- package/dist/infineon-design-system-stencil/infineon-design-system-stencil.css +1 -1
- package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js +1 -1
- package/dist/infineon-design-system-stencil/p-021d8925.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-33f48cf1.entry.js.map → p-021d8925.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-028211a8.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-69799784.entry.js.map → p-028211a8.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-06a36457.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-602a1ada.entry.js.map → p-06a36457.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-0abcae42.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-fe55dfcd.entry.js.map → p-0abcae42.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-0f8df960.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-d9f7f285.entry.js.map → p-0f8df960.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-187cdbed.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-b6bdc0a5.entry.js.map → p-187cdbed.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-1ed0a8dd.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-332313b0.entry.js.map → p-1ed0a8dd.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-290049e9.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-661a7c0b.entry.js.map → p-290049e9.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-2dfd258b.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-dd27040f.entry.js.map → p-2dfd258b.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-34fdb2e6.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-427b82a8.entry.js.map → p-34fdb2e6.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-354be5a1.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-0333c09a.entry.js.map → p-354be5a1.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-3b15bc96.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-fc455450.entry.js.map → p-3b15bc96.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-42ff3839.entry.js +2 -0
- package/dist/infineon-design-system-stencil/p-42ff3839.entry.js.map +1 -0
- package/dist/infineon-design-system-stencil/p-46f7e1c0.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-e93396ed.entry.js.map → p-46f7e1c0.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-4db60e07.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-dc5ff11a.entry.js.map → p-4db60e07.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-515a5f97.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-c4eac5cd.entry.js.map → p-515a5f97.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-526f19a6.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-b1c2e67a.entry.js.map → p-526f19a6.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-5aecf191.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-080456bc.entry.js.map → p-5aecf191.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-5c3dccd3.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-41316712.entry.js.map → p-5c3dccd3.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-635473c7.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-b6d2073e.entry.js.map → p-635473c7.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-6ca6263d.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-aac226ce.entry.js.map → p-6ca6263d.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-6e76886f.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-4ddb3e72.entry.js.map → p-6e76886f.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-75f8f1ca.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-76e2c9c5.entry.js.map → p-75f8f1ca.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-76b9997a.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-1f745731.entry.js.map → p-76b9997a.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-88e85ddd.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-f88b928c.entry.js.map → p-88e85ddd.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-8b0bf932.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-6c3c5b20.entry.js.map → p-8b0bf932.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-98c681ce.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-c183f92b.entry.js.map → p-98c681ce.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-a71081a1.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-2f87fada.entry.js.map → p-a71081a1.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-a7b72b06.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-dba0c2d2.entry.js.map → p-a7b72b06.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-ad290bef.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-74fd43e9.entry.js.map → p-ad290bef.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-b4a34f95.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-0d11b881.entry.js.map → p-b4a34f95.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-ba7c44ef.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-b84588f9.entry.js.map → p-ba7c44ef.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/{p-8531337f.entry.js → p-c9b73ef0.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-8531337f.entry.js.map → p-c9b73ef0.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/{p-63679298.entry.js → p-cb35f847.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-63679298.entry.js.map → p-cb35f847.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-cda1cd7c.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-6a8bfce7.entry.js.map → p-cda1cd7c.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-cf93476d.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-485ba923.entry.js.map → p-cf93476d.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-d68e8fbf.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-1d47cfa5.entry.js.map → p-d68e8fbf.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-d9338f57.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-a1bb909f.entry.js.map → p-d9338f57.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-dac01fef.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-47893f7e.entry.js.map → p-dac01fef.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/{p-5d486e15.entry.js → p-dda7c74e.entry.js} +2 -2
- package/dist/infineon-design-system-stencil/{p-5d486e15.entry.js.map → p-dda7c74e.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-e31a54fa.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-96ba5e8c.entry.js.map → p-e31a54fa.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-e6ee3ecc.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-0a69604b.entry.js.map → p-e6ee3ecc.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-e8871d52.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-05d332bd.entry.js.map → p-e8871d52.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-ea15fc7d.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-61010cd5.entry.js.map → p-ea15fc7d.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-ed6fcfcd.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-7de29aa8.entry.js.map → p-ed6fcfcd.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-f1649115.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-50793991.entry.js.map → p-f1649115.entry.js.map} +1 -1
- package/dist/infineon-design-system-stencil/p-f17ca236.entry.js +2 -0
- package/dist/infineon-design-system-stencil/{p-db9bdd7d.entry.js.map → p-f17ca236.entry.js.map} +1 -1
- package/package.json +1 -1
- package/dist/components/p-5b5399c2.js.map +0 -1
- package/dist/components/p-7c7a5393.js.map +0 -1
- package/dist/components/p-cc9cb040.js +0 -164
- package/dist/infineon-design-system-stencil/p-0333c09a.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-05d332bd.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-080456bc.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-0a69604b.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-0d11b881.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-1d47cfa5.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-1f745731.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-2f87fada.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-332313b0.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-33f48cf1.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-41316712.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-427b82a8.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-47893f7e.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-485ba923.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-4ddb3e72.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-50793991.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-602a1ada.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-61010cd5.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-661a7c0b.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-69799784.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-6a8bfce7.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-6c3c5b20.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-74fd43e9.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-76e2c9c5.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-7de29aa8.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-96ba5e8c.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-a1bb909f.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-aac226ce.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-b1c2e67a.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-b39303be.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-b39303be.entry.js.map +0 -1
- package/dist/infineon-design-system-stencil/p-b6bdc0a5.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-b6d2073e.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-b84588f9.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-c183f92b.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-c4eac5cd.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-d9f7f285.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-db9bdd7d.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-dba0c2d2.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-dc5ff11a.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-dd27040f.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-e93396ed.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-f88b928c.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-fc455450.entry.js +0 -2
- package/dist/infineon-design-system-stencil/p-fe55dfcd.entry.js +0 -2
@@ -0,0 +1,2 @@
|
|
1
|
+
import{r as o,h as r}from"./p-e6edf72d.js";const e=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{display:inline-block}.container{display:flex;min-height:1.25em;align-items:center;padding:0 8px;border-radius:9999px;font-family:"Source Sans 3"}.container.no-border{padding:0}.container.border-engineering-100{border:1px solid #F7F7F7}.container.border-engineering-200{border:1px solid #EEEDED}.container.border-engineering-300{border:1px solid #BFBBBB}.container.border-engineering-400{border:1px solid #8D8786}.container.border-engineering-500{border:1px solid #575352}.container.border-engineering-600{border:1px solid #3C3A39}.container.border-ocean-100{border:1px solid #DFF4F3}.container.border-ocean-200{border:1px solid #B8DEDA}.container.border-ocean-300{border:1px solid #6CB4AD}.container.border-ocean-400{border:1px solid #3B9B91}.container.border-ocean-500{border:1px solid #0A8276}.container.border-ocean-600{border:1px solid #08665C}.container.border-ocean-700{border:1px solid #06534B}.container.border-red-500{border:1px solid #CD002F}.container.border-red-600{border:1px solid #A2001E}.container.border-red-700{border:1px solid #900021}.container.border-orange-500{border:1px solid #E16B25}.container.border-green-500{border:1px solid #4CA460}.container.border-lawn-400{border:1px solid #B9D257}.container.border-lawn-500{border:1px solid #9BBA43}.container.border-lawn-700{border:1px solid #3C6C0F}.container.border-berry-400{border:1px solid #BE3283}.container.border-berry-500{border:1px solid #9C216E}.container.border-sun-400{border:1px solid #FF9737}.container.border-sun-500{border:1px solid #F97414}.container.border-sand-400{border:1px solid #FBE273}.container.border-sand-500{border:1px solid #FCD442}.text{margin:0;padding-left:4px;font-style:normal;font-weight:600;font-size:1rem;line-height:1.25rem;display:inline;color:#1D1D1D}.dot{display:inline-block;width:8px;height:8px;border-radius:9999px}.dot.engineering-100{background-color:#F7F7F7}.dot.engineering-200{background-color:#EEEDED}.dot.engineering-300{background-color:#BFBBBB}.dot.engineering-400{background-color:#8D8786}.dot.engineering-500{background-color:#575352}.dot.engineering-600{background-color:#3C3A39}.dot.ocean-100{background-color:#DFF4F3}.dot.ocean-200{background-color:#B8DEDA}.dot.ocean-300{background-color:#6CB4AD}.dot.ocean-400{background-color:#3B9B91}.dot.ocean-500{background-color:#0A8276}.dot.ocean-600{background-color:#08665C}.dot.ocean-700{background-color:#06534B}.dot.red-500{background-color:#CD002F}.dot.red-600{background-color:#A2001E}.dot.red-700{background-color:#900021}.dot.orange-500{background-color:#E16B25}.dot.green-500{background-color:#4CA460}.dot.lawn-400{background-color:#B9D257}.dot.lawn-500{background-color:#9BBA43}.dot.lawn-700{background-color:#3C6C0F}.dot.berry-400{background-color:#BE3283}.dot.berry-500{background-color:#9C216E}.dot.sun-400{background-color:#FF9737}.dot.sun-500{background-color:#F97414}.dot.sand-400{background-color:#FBE273}.dot.sand-500{background-color:#FCD442}';const n=e;const d=class{constructor(r){o(this,r);this.border=false;this.color="orange-500"}render(){var o;const e=((o=this.color)===null||o===void 0?void 0:o.trim())?this.color:"orange-500";const n=this.border?`container border-${e}`:"container no-border";return r("div",{key:"f613dcda2a1cdf86cb9169937a3674b1f8d985f7","aria-label":"a status indicator","aria-value":this.label,class:n},r("span",{key:"17792fd234e467d0396d00f6e244a5842d08e1ce",class:`dot ${e}`}),r("p",{key:"51261dabeec924c46a9a710c74de9bb7140bf927",class:"text"},this.label))}};d.style=n;export{d as ifx_status};
|
2
|
+
//# sourceMappingURL=p-e8871d52.entry.js.map
|
package/dist/infineon-design-system-stencil/{p-05d332bd.entry.js.map → p-e8871d52.entry.js.map}
RENAMED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["statusCss","IfxStatusStyle0","Status","constructor","hostRef","this","border","color","render","effectiveColor","_a","trim","containerClass","h","key","label","class"],"sources":["src/components/status/status.scss?tag=ifx-status&encapsulation=shadow","src/components/status/status.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-block;\n}\n\n.container {\n display: flex;\n min-height: 1.25em;\n align-items: center;\n padding: 0 tokens.$ifxSpace100;\n border-radius: tokens.$ifxBorderRadiusRound;\n font-family: tokens.$ifxFontFamilyBody;\n\n &.no-border {\n padding: 0; // Remove padding when border is not present\n }\n\n &.border-engineering-100{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering100;\n }\n\n &.border-engineering-200{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering200;\n }\n\n &.border-engineering-300{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering300;\n }\n\n &.border-engineering-400{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering400;\n }\n\n &.border-engineering-500{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering500;\n }\n\n &.border-engineering-600{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering600;\n }\n\n &.border-ocean-100 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean100;\n }\n\n &.border-ocean-200 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean200;\n }\n\n &.border-ocean-300 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean300;\n }\n\n &.border-ocean-400 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean400;\n }\n\n &.border-ocean-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean500;\n }\n\n &.border-ocean-600 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean600;\n }\n\n &.border-ocean-700 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean700;\n }\n\n &.border-red-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorRed500;\n }\n\n &.border-red-600 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorRed600;\n }\n\n &.border-red-700 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorRed700;\n }\n\n &.border-orange-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOrange500;\n }\n\n &.border-green-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorGreen500;\n }\n\n &.border-lawn-400 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorLawn400;\n }\n\n &.border-lawn-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorLawn500;\n }\n\n &.border-lawn-700 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorLawn700;\n }\n\n &.border-berry-400 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorBerry400;\n }\n\n &.border-berry-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorBerry500;\n }\n\n &.border-sun-400 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSun400;\n }\n\n &.border-sun-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSun500;\n }\n\n &.border-sand-400{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSand400;\n }\n\n &.border-sand-500{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSand500;\n }\n\n\n}\n\n.text {\n margin: 0;\n padding-left: tokens.$ifxSpace50;\n font-style: normal;\n font-weight: tokens.$ifxFontWeightSemibold;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightS;\n display: inline;\n color: tokens.$ifxColorBaseBlack;\n}\n\n.dot {\n display: inline-block;\n width: tokens.$ifxSize100;\n height: tokens.$ifxSize100;\n border-radius: tokens.$ifxBorderRadiusRound;\n}\n\n\n.dot {\n &.engineering-100 {\n background-color: tokens.$ifxColorEngineering100;\n }\n\n &.engineering-200 {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &.engineering-300 {\n background-color: tokens.$ifxColorEngineering300;\n }\n\n &.engineering-400 {\n background-color: tokens.$ifxColorEngineering400;\n }\n\n &.engineering-500 {\n background-color: tokens.$ifxColorEngineering500;\n }\n\n &.engineering-600 {\n background-color: tokens.$ifxColorEngineering600;\n }\n\n &.ocean-100 {\n background-color: tokens.$ifxColorOcean100;\n }\n\n &.ocean-200 {\n background-color: tokens.$ifxColorOcean200;\n }\n\n &.ocean-300 {\n background-color: tokens.$ifxColorOcean300;\n }\n\n &.ocean-400 {\n background-color: tokens.$ifxColorOcean400;\n }\n\n &.ocean-500 {\n background-color: tokens.$ifxColorOcean500;\n }\n\n &.ocean-600 {\n background-color: tokens.$ifxColorOcean600;\n }\n\n &.ocean-700 {\n background-color: tokens.$ifxColorOcean700;\n }\n\n &.red-500 {\n background-color: tokens.$ifxColorRed500;\n }\n\n &.red-600 {\n background-color: tokens.$ifxColorRed600;\n }\n\n &.red-700 {\n background-color: tokens.$ifxColorRed700;\n }\n\n &.orange-500 {\n background-color: tokens.$ifxColorOrange500;\n }\n\n &.green-500 {\n background-color: tokens.$ifxColorGreen500;\n }\n\n &.lawn-400{\n background-color: tokens.$ifxColorLawn400;\n }\n\n &.lawn-500{\n background-color: tokens.$ifxColorLawn500;\n }\n\n &.lawn-700 {\n background-color: tokens.$ifxColorLawn700;\n }\n\n &.berry-400 {\n background-color: tokens.$ifxColorBerry400;\n }\n\n &.berry-500 {\n background-color: tokens.$ifxColorBerry500;\n }\n\n &.sun-400 {\n background-color: tokens.$ifxColorSun400;\n }\n\n &.sun-500 {\n background-color: tokens.$ifxColorSun500;\n }\n\n &.sand-400{\n background-color: tokens.$ifxColorSand400;\n }\n\n &.sand-500{\n background-color: tokens.$ifxColorSand500;\n }\n}","import { Component, h, Prop } from '@stencil/core';\n \n\n@Component({\n tag: 'ifx-status',\n styleUrl: 'status.scss',\n shadow: true\n})\n\nexport class Status {\n @Prop() label: string;\n @Prop() border: boolean = false;\n @Prop() color: string = 'orange-500';\n\n\n render() {\n const effectiveColor = this.color?.trim() ? this.color : 'orange-500';\n const containerClass = this.border ? `container border-${effectiveColor}` : 'container no-border';\n\n return (\n <div aria-label=\"a status indicator\" aria-value={this.label} class={containerClass}>\n <span class={`dot ${effectiveColor}`}></span>\n <p class=\"text\">{this.label}</p>\n </div>\n );\n }\n}"],"mappings":"2CAAA,MAAMA,EAAY,
|
1
|
+
{"version":3,"names":["statusCss","IfxStatusStyle0","Status","constructor","hostRef","this","border","color","render","effectiveColor","_a","trim","containerClass","h","key","label","class"],"sources":["src/components/status/status.scss?tag=ifx-status&encapsulation=shadow","src/components/status/status.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-block;\n}\n\n.container {\n display: flex;\n min-height: 1.25em;\n align-items: center;\n padding: 0 tokens.$ifxSpace100;\n border-radius: tokens.$ifxBorderRadiusRound;\n font-family: tokens.$ifxFontFamilyBody;\n\n &.no-border {\n padding: 0; // Remove padding when border is not present\n }\n\n &.border-engineering-100{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering100;\n }\n\n &.border-engineering-200{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering200;\n }\n\n &.border-engineering-300{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering300;\n }\n\n &.border-engineering-400{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering400;\n }\n\n &.border-engineering-500{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering500;\n }\n\n &.border-engineering-600{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering600;\n }\n\n &.border-ocean-100 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean100;\n }\n\n &.border-ocean-200 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean200;\n }\n\n &.border-ocean-300 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean300;\n }\n\n &.border-ocean-400 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean400;\n }\n\n &.border-ocean-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean500;\n }\n\n &.border-ocean-600 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean600;\n }\n\n &.border-ocean-700 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean700;\n }\n\n &.border-red-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorRed500;\n }\n\n &.border-red-600 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorRed600;\n }\n\n &.border-red-700 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorRed700;\n }\n\n &.border-orange-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOrange500;\n }\n\n &.border-green-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorGreen500;\n }\n\n &.border-lawn-400 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorLawn400;\n }\n\n &.border-lawn-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorLawn500;\n }\n\n &.border-lawn-700 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorLawn700;\n }\n\n &.border-berry-400 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorBerry400;\n }\n\n &.border-berry-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorBerry500;\n }\n\n &.border-sun-400 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSun400;\n }\n\n &.border-sun-500 {\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSun500;\n }\n\n &.border-sand-400{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSand400;\n }\n\n &.border-sand-500{\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSand500;\n }\n\n\n}\n\n.text {\n margin: 0;\n padding-left: tokens.$ifxSpace50;\n font-style: normal;\n font-weight: tokens.$ifxFontWeightSemibold;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightS;\n display: inline;\n color: tokens.$ifxColorBaseBlack;\n}\n\n.dot {\n display: inline-block;\n width: tokens.$ifxSize100;\n height: tokens.$ifxSize100;\n border-radius: tokens.$ifxBorderRadiusRound;\n}\n\n\n.dot {\n &.engineering-100 {\n background-color: tokens.$ifxColorEngineering100;\n }\n\n &.engineering-200 {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &.engineering-300 {\n background-color: tokens.$ifxColorEngineering300;\n }\n\n &.engineering-400 {\n background-color: tokens.$ifxColorEngineering400;\n }\n\n &.engineering-500 {\n background-color: tokens.$ifxColorEngineering500;\n }\n\n &.engineering-600 {\n background-color: tokens.$ifxColorEngineering600;\n }\n\n &.ocean-100 {\n background-color: tokens.$ifxColorOcean100;\n }\n\n &.ocean-200 {\n background-color: tokens.$ifxColorOcean200;\n }\n\n &.ocean-300 {\n background-color: tokens.$ifxColorOcean300;\n }\n\n &.ocean-400 {\n background-color: tokens.$ifxColorOcean400;\n }\n\n &.ocean-500 {\n background-color: tokens.$ifxColorOcean500;\n }\n\n &.ocean-600 {\n background-color: tokens.$ifxColorOcean600;\n }\n\n &.ocean-700 {\n background-color: tokens.$ifxColorOcean700;\n }\n\n &.red-500 {\n background-color: tokens.$ifxColorRed500;\n }\n\n &.red-600 {\n background-color: tokens.$ifxColorRed600;\n }\n\n &.red-700 {\n background-color: tokens.$ifxColorRed700;\n }\n\n &.orange-500 {\n background-color: tokens.$ifxColorOrange500;\n }\n\n &.green-500 {\n background-color: tokens.$ifxColorGreen500;\n }\n\n &.lawn-400{\n background-color: tokens.$ifxColorLawn400;\n }\n\n &.lawn-500{\n background-color: tokens.$ifxColorLawn500;\n }\n\n &.lawn-700 {\n background-color: tokens.$ifxColorLawn700;\n }\n\n &.berry-400 {\n background-color: tokens.$ifxColorBerry400;\n }\n\n &.berry-500 {\n background-color: tokens.$ifxColorBerry500;\n }\n\n &.sun-400 {\n background-color: tokens.$ifxColorSun400;\n }\n\n &.sun-500 {\n background-color: tokens.$ifxColorSun500;\n }\n\n &.sand-400{\n background-color: tokens.$ifxColorSand400;\n }\n\n &.sand-500{\n background-color: tokens.$ifxColorSand500;\n }\n}","import { Component, h, Prop } from '@stencil/core';\n \n\n@Component({\n tag: 'ifx-status',\n styleUrl: 'status.scss',\n shadow: true\n})\n\nexport class Status {\n @Prop() label: string;\n @Prop() border: boolean = false;\n @Prop() color: string = 'orange-500';\n\n\n render() {\n const effectiveColor = this.color?.trim() ? this.color : 'orange-500';\n const containerClass = this.border ? `container border-${effectiveColor}` : 'container no-border';\n\n return (\n <div aria-label=\"a status indicator\" aria-value={this.label} class={containerClass}>\n <span class={`dot ${effectiveColor}`}></span>\n <p class=\"text\">{this.label}</p>\n </div>\n );\n }\n}"],"mappings":"2CAAA,MAAMA,EAAY,u7FAClB,MAAAC,EAAeD,E,MCQFE,EAAM,MANnB,WAAAC,CAAAC,G,UAQUC,KAAAC,OAAkB,MAClBD,KAAAE,MAAgB,Y,CAGxB,MAAAC,G,MACE,MAAMC,IAAiBC,EAAAL,KAAKE,SAAK,MAAAG,SAAA,SAAAA,EAAEC,QAASN,KAAKE,MAAQ,aACzD,MAAMK,EAAiBP,KAAKC,OAAS,oBAAoBG,IAAmB,sBAE5E,OACEI,EAAA,OAAAC,IAAA,wDAAgB,qBAAoB,aAAaT,KAAKU,MAAOC,MAAOJ,GAClEC,EAAA,QAAAC,IAAA,2CAAME,MAAO,OAAOP,MACpBI,EAAA,KAAAC,IAAA,2CAAGE,MAAM,QAAQX,KAAKU,O","ignoreList":[]}
|
@@ -0,0 +1,2 @@
|
|
1
|
+
import{r as e,h as i}from"./p-e6edf72d.js";import{c as n}from"./p-5cdc6210.js";const t=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{display:inline-flex}.link{display:inline-flex;align-items:center;font-weight:400;font-size:1rem;text-decoration:none;color:#0A8276;gap:8px;line-height:1.6;font-family:"Source Sans 3"}.link:hover{cursor:pointer}.link:focus{outline-width:2px;outline-style:solid;outline-color:#0A8276;outline-offset:4px;border-radius:3px}.link.bold{font-weight:600}.link.bold:hover{text-decoration:underline}.link.bold:active{color:#08665C;font-style:normal;font-weight:600;text-decoration:underline}.link.underlined{text-decoration:underline;text-decoration-color:#0A8276;color:#1D1D1D;text-underline-offset:8px}.link.underlined:hover{color:#0A8276}.link.underlined:active{color:#0A8276}.link.underlined:disabled,.link.underlined.disabled{text-decoration-color:#BFBBBB}.link.title{text-decoration:none;font-weight:600;color:#1D1D1D}.link.title:hover{color:#0A8276}.link.title:active{color:#08665C}.link.menu{font-weight:400;font-style:normal;line-height:26px;color:#1D1D1D}.link.menu:hover{color:#0A8276}.link.menu:active{color:#08665C}.link.small{font-size:0.875rem}.link.medium{font-size:1rem}.link.large{font-size:1.125rem}.link.extraLarge{font-size:1.25rem}.link.underline{text-decoration:underline}.link:disabled,.link.disabled{color:#BFBBBB;cursor:default;pointer-events:none}';const l=t;const o=class{constructor(i){e(this,i);this.href=undefined;this.target="_self";this.variant="bold";this.disabled=false;this.internalHref="";this.internalTarget="";this.internalVariant=""}setInternalStates(){if(this.href){this.internalHref=this.href.trim()}else{this.internalHref=undefined}this.internalTarget=this.target.trim();this.internalVariant=this.variant.trim().toLowerCase()}componentWillRender(){this.setInternalStates()}handleKeyDown(e){if(this.disabled){e.preventDefault()}else if(e.key==="Enter"){e.preventDefault()}}render(){return i("a",{key:"2e0b6e74651491be887613e0811efdcdea7828fb",role:"link","aria-label":this.ariaLabel,"aria-disabled":this.disabled||!this.internalHref,href:this.disabled?undefined:this.internalHref,download:this.download,target:this.internalTarget,class:this.linkClassNames()},i("slot",{key:"c870b53c84b03fa953a78c23d37ebbfdff5f72cb"}))}getSizeClass(){const e=this.size==="s"?"small":null;const i=this.size==="m"?"medium":null;const n=this.size==="l"?"large":null;const t=this.size==="xl"?"extraLarge":null;if(e){return e}else if(i){return i}else if(n){return n}else if(t&&this.internalVariant==="underlined"){return"large"}else if(t&&this.internalVariant!=="underlined"){return t}else return""}getVariantClass(){const e=this.internalVariant==="bold"?"bold":null;const i=this.internalVariant==="title"?"title":null;const n=this.internalVariant==="underlined"?"underlined":null;const t=this.internalVariant==="menu"?"menu":null;if(e){return e}else if(i){return i}else if(n){return n}else if(t){return t}else return e}linkClassNames(){return n("link","primary",this.getVariantClass(),this.getSizeClass(),this.disabled?"disabled":"")}};o.style=l;export{o as ifx_link};
|
2
|
+
//# sourceMappingURL=p-ea15fc7d.entry.js.map
|
package/dist/infineon-design-system-stencil/{p-61010cd5.entry.js.map → p-ea15fc7d.entry.js.map}
RENAMED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["linkCss","IfxLinkStyle0","Link","constructor","hostRef","this","href","undefined","target","variant","disabled","internalHref","internalTarget","internalVariant","setInternalStates","trim","toLowerCase","componentWillRender","handleKeyDown","event","preventDefault","key","render","h","role","ariaLabel","download","class","linkClassNames","getSizeClass","small","size","medium","large","extraLarge","getVariantClass","bold","title","underlined","menu","classNames"],"sources":["src/components/link/link.scss?tag=ifx-link&encapsulation=shadow","src/components/link/link.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-flex;\n}\n\n.link {\n display: inline-flex;\n align-items: center;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n text-decoration: none;\n color: tokens.$ifxColorOcean500;\n gap: tokens.$ifxSpace100;\n line-height: 1.6;\n font-family: tokens.$ifxFontFamilyBody;\n\n &:hover { \n cursor: pointer;\n }\n\n &:focus {\n outline-width: 2px;\n outline-style: solid;\n outline-color: #0A8276;\n outline-offset: 4px;\n border-radius: 3px;\n }\n\n &.bold {\n font-weight: tokens.$ifxFontWeightSemibold;\n\n &:hover {\n text-decoration: underline;\n }\n\n &:active {\n color: #08665C;\n font-style: normal;\n font-weight: 600;\n text-decoration: underline;\n }\n\n }\n\n &.underlined {\n text-decoration: underline;\n text-decoration-color: tokens.$ifxColorOcean500;\n color: #1D1D1D;\n text-underline-offset: 8px;\n \n &:hover {\n color: tokens.$ifxColorOcean500;;\n }\n \n &:active {\n color: #0A8276;\n }\n\n &:disabled,\n &.disabled {\n text-decoration-color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.title {\n text-decoration: none;\n font-weight: tokens.$ifxFontWeightSemibold;\n color: #1D1D1D;\n\n &:hover {\n color: tokens.$ifxColorOcean500;\n }\n\n &:active {\n color: #08665C;\n }\n }\n\n &.menu {\n font-weight: 400;\n font-style: normal;\n line-height: 26px;\n color: #1D1D1D;\n\n &:hover {\n color: tokens.$ifxColorOcean500;\n }\n\n &:active {\n color: #08665C;\n }\n }\n\n &.small {\n font-size: tokens.$ifxFontSizeS;\n }\n\n &.medium {\n font-size: tokens.$ifxFontSizeM;\n }\n\n &.large {\n font-size: tokens.$ifxFontSizeL;\n }\n\n &.extraLarge {\n font-size: tokens.$ifxFontSizeXl;\n }\n\n &.underline {\n text-decoration: underline;\n }\n\n &:disabled,\n &.disabled {\n color: tokens.$ifxColorEngineering300;\n cursor: default;\n pointer-events: none;\n }\n\n}","import { Component, Prop, h, State } from \"@stencil/core\";\nimport classNames from 'classnames';\n \n\n@Component({\n tag: 'ifx-link',\n styleUrl: 'link.scss',\n shadow: true\n})\n\nexport class Link {\n @Prop() href: string = undefined;\n @Prop() target: string = '_self';\n @Prop() variant: string = 'bold';\n @Prop() size: string;\n @Prop() disabled: boolean = false;\n @Prop() download: string;\n @Prop() ariaLabel: string | null;\n @State() internalHref: string ='';\n @State() internalTarget: string = '';\n @State() internalVariant: string = '';\n\n setInternalStates() {\n if(this.href){\n this.internalHref = this.href.trim();\n }else{\n this.internalHref = undefined;\n }\n this.internalTarget = this.target.trim();\n this.internalVariant = this.variant.trim().toLowerCase();\n }\n\n componentWillRender(){\n this.setInternalStates();\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (this.disabled) {\n event.preventDefault();\n } else if (event.key === 'Enter') {\n event.preventDefault();\n }\n }\n\n render() {\n return (\n <a\n role=\"link\"\n aria-label={this.ariaLabel}\n aria-disabled={this.disabled || !this.internalHref}\n href={this.disabled ? undefined : this.internalHref}\n download={this.download}\n target={this.internalTarget}\n class={this.linkClassNames()}>\n <slot></slot>\n </a>)\n }\n\n getSizeClass() {\n const small = this.size === 's' ? 'small' : null;\n const medium = this.size === 'm' ? 'medium' : null;\n const large = this.size === 'l' ? 'large' : null;\n const extraLarge = this.size === 'xl' ? 'extraLarge' : null;\n\n if (small) {\n return small;\n } else if (medium) {\n return medium;\n } else if (large) {\n return large;\n } else if (extraLarge && this.internalVariant === 'underlined') {\n return 'large';\n } else if (extraLarge && this.internalVariant !== 'underlined') {\n return extraLarge;\n } else return \"\";\n }\n\n getVariantClass() {\n const bold = this.internalVariant === 'bold' ? 'bold' : null;\n const title = this.internalVariant === 'title' ? 'title' : null;\n const underlined = this.internalVariant === 'underlined' ? 'underlined' : null;\n const menu = this.internalVariant === 'menu' ? 'menu' : null;\n\n if (bold) {\n return bold\n } else if (title) {\n return title;\n } else if (underlined) {\n return underlined;\n } else if (menu) {\n return menu;\n } else return bold;\n }\n\n linkClassNames() {\n return classNames(\n 'link',\n 'primary',\n this.getVariantClass(),\n this.getSizeClass(),\n this.disabled ? 'disabled' : '',\n );\n }\n}"],"mappings":"+EAAA,MAAMA,EAAU,
|
1
|
+
{"version":3,"names":["linkCss","IfxLinkStyle0","Link","constructor","hostRef","this","href","undefined","target","variant","disabled","internalHref","internalTarget","internalVariant","setInternalStates","trim","toLowerCase","componentWillRender","handleKeyDown","event","preventDefault","key","render","h","role","ariaLabel","download","class","linkClassNames","getSizeClass","small","size","medium","large","extraLarge","getVariantClass","bold","title","underlined","menu","classNames"],"sources":["src/components/link/link.scss?tag=ifx-link&encapsulation=shadow","src/components/link/link.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-flex;\n}\n\n.link {\n display: inline-flex;\n align-items: center;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n text-decoration: none;\n color: tokens.$ifxColorOcean500;\n gap: tokens.$ifxSpace100;\n line-height: 1.6;\n font-family: tokens.$ifxFontFamilyBody;\n\n &:hover { \n cursor: pointer;\n }\n\n &:focus {\n outline-width: 2px;\n outline-style: solid;\n outline-color: #0A8276;\n outline-offset: 4px;\n border-radius: 3px;\n }\n\n &.bold {\n font-weight: tokens.$ifxFontWeightSemibold;\n\n &:hover {\n text-decoration: underline;\n }\n\n &:active {\n color: #08665C;\n font-style: normal;\n font-weight: 600;\n text-decoration: underline;\n }\n\n }\n\n &.underlined {\n text-decoration: underline;\n text-decoration-color: tokens.$ifxColorOcean500;\n color: #1D1D1D;\n text-underline-offset: 8px;\n \n &:hover {\n color: tokens.$ifxColorOcean500;;\n }\n \n &:active {\n color: #0A8276;\n }\n\n &:disabled,\n &.disabled {\n text-decoration-color: tokens.$ifxColorEngineering300;\n }\n }\n\n &.title {\n text-decoration: none;\n font-weight: tokens.$ifxFontWeightSemibold;\n color: #1D1D1D;\n\n &:hover {\n color: tokens.$ifxColorOcean500;\n }\n\n &:active {\n color: #08665C;\n }\n }\n\n &.menu {\n font-weight: 400;\n font-style: normal;\n line-height: 26px;\n color: #1D1D1D;\n\n &:hover {\n color: tokens.$ifxColorOcean500;\n }\n\n &:active {\n color: #08665C;\n }\n }\n\n &.small {\n font-size: tokens.$ifxFontSizeS;\n }\n\n &.medium {\n font-size: tokens.$ifxFontSizeM;\n }\n\n &.large {\n font-size: tokens.$ifxFontSizeL;\n }\n\n &.extraLarge {\n font-size: tokens.$ifxFontSizeXl;\n }\n\n &.underline {\n text-decoration: underline;\n }\n\n &:disabled,\n &.disabled {\n color: tokens.$ifxColorEngineering300;\n cursor: default;\n pointer-events: none;\n }\n\n}","import { Component, Prop, h, State } from \"@stencil/core\";\nimport classNames from 'classnames';\n \n\n@Component({\n tag: 'ifx-link',\n styleUrl: 'link.scss',\n shadow: true\n})\n\nexport class Link {\n @Prop() href: string = undefined;\n @Prop() target: string = '_self';\n @Prop() variant: string = 'bold';\n @Prop() size: string;\n @Prop() disabled: boolean = false;\n @Prop() download: string;\n @Prop() ariaLabel: string | null;\n @State() internalHref: string ='';\n @State() internalTarget: string = '';\n @State() internalVariant: string = '';\n\n setInternalStates() {\n if(this.href){\n this.internalHref = this.href.trim();\n }else{\n this.internalHref = undefined;\n }\n this.internalTarget = this.target.trim();\n this.internalVariant = this.variant.trim().toLowerCase();\n }\n\n componentWillRender(){\n this.setInternalStates();\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (this.disabled) {\n event.preventDefault();\n } else if (event.key === 'Enter') {\n event.preventDefault();\n }\n }\n\n render() {\n return (\n <a\n role=\"link\"\n aria-label={this.ariaLabel}\n aria-disabled={this.disabled || !this.internalHref}\n href={this.disabled ? undefined : this.internalHref}\n download={this.download}\n target={this.internalTarget}\n class={this.linkClassNames()}>\n <slot></slot>\n </a>)\n }\n\n getSizeClass() {\n const small = this.size === 's' ? 'small' : null;\n const medium = this.size === 'm' ? 'medium' : null;\n const large = this.size === 'l' ? 'large' : null;\n const extraLarge = this.size === 'xl' ? 'extraLarge' : null;\n\n if (small) {\n return small;\n } else if (medium) {\n return medium;\n } else if (large) {\n return large;\n } else if (extraLarge && this.internalVariant === 'underlined') {\n return 'large';\n } else if (extraLarge && this.internalVariant !== 'underlined') {\n return extraLarge;\n } else return \"\";\n }\n\n getVariantClass() {\n const bold = this.internalVariant === 'bold' ? 'bold' : null;\n const title = this.internalVariant === 'title' ? 'title' : null;\n const underlined = this.internalVariant === 'underlined' ? 'underlined' : null;\n const menu = this.internalVariant === 'menu' ? 'menu' : null;\n\n if (bold) {\n return bold\n } else if (title) {\n return title;\n } else if (underlined) {\n return underlined;\n } else if (menu) {\n return menu;\n } else return bold;\n }\n\n linkClassNames() {\n return classNames(\n 'link',\n 'primary',\n this.getVariantClass(),\n this.getSizeClass(),\n this.disabled ? 'disabled' : '',\n );\n }\n}"],"mappings":"+EAAA,MAAMA,EAAU,szCAChB,MAAAC,EAAeD,E,MCSFE,EAAI,MANjB,WAAAC,CAAAC,G,UAOUC,KAAAC,KAAeC,UACfF,KAAAG,OAAiB,QACjBH,KAAAI,QAAkB,OAElBJ,KAAAK,SAAoB,MAGnBL,KAAAM,aAAsB,GACtBN,KAAAO,eAAyB,GACzBP,KAAAQ,gBAA0B,E,CAEnC,iBAAAC,GACE,GAAGT,KAAKC,KAAK,CACXD,KAAKM,aAAeN,KAAKC,KAAKS,M,KAC3B,CACHV,KAAKM,aAAeJ,S,CAEtBF,KAAKO,eAAiBP,KAAKG,OAAOO,OAClCV,KAAKQ,gBAAkBR,KAAKI,QAAQM,OAAOC,a,CAG7C,mBAAAC,GACEZ,KAAKS,mB,CAGP,aAAAI,CAAcC,GACZ,GAAId,KAAKK,SAAU,CACjBS,EAAMC,gB,MACD,GAAID,EAAME,MAAQ,QAAS,CAChCF,EAAMC,gB,EAIV,MAAAE,GACE,OACEC,EAAA,KAAAF,IAAA,2CACEG,KAAK,OAAM,aACCnB,KAAKoB,UAAS,gBACXpB,KAAKK,WAAaL,KAAKM,aACtCL,KAAMD,KAAKK,SAAWH,UAAYF,KAAKM,aACvCe,SAAUrB,KAAKqB,SACflB,OAAQH,KAAKO,eACbe,MAAOtB,KAAKuB,kBACZL,EAAA,QAAAF,IAAA,6C,CAIN,YAAAQ,GACE,MAAMC,EAAQzB,KAAK0B,OAAS,IAAM,QAAU,KAC5C,MAAMC,EAAS3B,KAAK0B,OAAS,IAAM,SAAW,KAC9C,MAAME,EAAQ5B,KAAK0B,OAAS,IAAM,QAAU,KAC5C,MAAMG,EAAa7B,KAAK0B,OAAS,KAAO,aAAe,KAEvD,GAAID,EAAO,CACT,OAAOA,C,MACF,GAAIE,EAAQ,CACjB,OAAOA,C,MACF,GAAIC,EAAO,CAChB,OAAOA,C,MACF,GAAIC,GAAc7B,KAAKQ,kBAAoB,aAAc,CAC9D,MAAO,O,MACF,GAAIqB,GAAc7B,KAAKQ,kBAAoB,aAAc,CAC9D,OAAOqB,C,MACF,MAAO,E,CAGhB,eAAAC,GACE,MAAMC,EAAO/B,KAAKQ,kBAAoB,OAAS,OAAS,KACxD,MAAMwB,EAAQhC,KAAKQ,kBAAoB,QAAU,QAAU,KAC3D,MAAMyB,EAAajC,KAAKQ,kBAAoB,aAAe,aAAe,KAC1E,MAAM0B,EAAOlC,KAAKQ,kBAAoB,OAAS,OAAS,KAExD,GAAIuB,EAAM,CACR,OAAOA,C,MACF,GAAIC,EAAO,CAChB,OAAOA,C,MACF,GAAIC,EAAY,CACrB,OAAOA,C,MACF,GAAIC,EAAM,CACf,OAAOA,C,MACF,OAAOH,C,CAGhB,cAAAR,GACE,OAAOY,EACL,OACA,UACAnC,KAAK8B,kBACL9B,KAAKwB,eACLxB,KAAKK,SAAW,WAAa,G","ignoreList":[]}
|
@@ -0,0 +1,2 @@
|
|
1
|
+
import{r as t,c as r,h as o,g as e}from"./p-e6edf72d.js";const i=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{display:inline-flex;--_ifx-fallback-display:none !important}._ifx-radiobutton-fallback{display:var(--_ifx-fallback-display);position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;border:0 !important}.radioButton__container{box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:center;padding:0px;gap:8px;cursor:pointer;font-family:"Source Sans 3"}.radioButton__container.m .radioButton__wrapper{width:24px;height:24px}.radioButton__container .radioButton__wrapper{width:20px;height:20px;position:relative;display:block;border-radius:50%;background-color:#FFFFFF;border:1px solid #575352}.radioButton__container .radioButton__wrapper:focus{outline:none}.radioButton__container .radioButton__wrapper:focus::before{content:"";position:absolute;width:calc(100% + 4px);height:calc(100% + 4px);top:50%;left:50%;transform:translate(-50%, -50%);border:2px solid #0A8276;border-radius:50%}.radioButton__container .radioButton__wrapper .radioButton__wrapper-mark{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);background-color:#0A8276;border-radius:50%;display:flex;justify-content:center;align-items:center;border-color:transparent}.radioButton__container .radioButton__wrapper:hover{background-color:#EEEDED}.radioButton__container .radioButton__wrapper.disabled{background-color:#BFBBBB;border-color:#BFBBBB}.radioButton__container .radioButton__wrapper.disabled.error:hover,.radioButton__container .radioButton__wrapper.disabled.error:focus-visible{border-color:#CD002F}.radioButton__container .radioButton__wrapper.checked{border-color:#0A8276}.radioButton__container .radioButton__wrapper.checked::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;background-color:#0A8276;border-radius:50%}.radioButton__container .radioButton__wrapper.checked.disabled::after{background-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked:hover{border-color:#08665C}.radioButton__container .radioButton__wrapper.checked:hover .radioButton__wrapper-mark{background-color:#08665C}.radioButton__container .radioButton__wrapper.checked.disabled{background-color:#FFFFFF;border-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked.disabled.disabled::after{background-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked.disabled .radioButton__wrapper-mark{background-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked.error::after{border-color:#CD002F;background-color:#CD002F}.radioButton__container .radioButton__wrapper.error:not(.disabled){border-color:#CD002F}.radioButton__container .radioButton__wrapper.error:not(.disabled):hover,.radioButton__container .radioButton__wrapper.error:not(.disabled):focus-visible{border-color:#CD002F}.radioButton__container .label{display:flex;align-items:center;height:20px;font-style:normal;font-weight:400;font-size:0.875rem;line-height:1.25rem;color:#1D1D1D;flex:none;order:1;flex-grow:0}.radioButton__container .label.label-m{height:24px;font-size:1rem;line-height:1.5rem}.radioButton__container .label.disabled{color:#BFBBBB}.radioButton__container .label:hover{cursor:pointer}';const a=i;const n=class{constructor(o){t(this,o);this.ifxChange=r(this,"ifxChange",7);this.ifxError=r(this,"ifxError",7);this.disabled=false;this.error=false;this.size="s";this.internalChecked=false;this.hasSlot=false}componentWillLoad(){this.fallbackInput=document.createElement("input");this.fallbackInput.type="radio";this.fallbackInput.hidden=true;this.fallbackInput.className="_ifx-radiobutton-fallback";this.fallbackInput.style.cssText=`\n display: none !important;\n position: absolute !important;\n opacity: 0 !important;\n pointer-events: none !important;\n width: 0 !important;\n height: 0 !important;\n `;this.fallbackInput.setAttribute("aria-hidden","true");this.fallbackInput.tabIndex=-1;this.el.appendChild(this.fallbackInput);if("attachInternals"in HTMLElement.prototype){try{this.internals=this.el.attachInternals()}catch(t){console.warn("ElementInternals not supported")}}this.internalChecked=this.checked||false;this.hasSlot=!!this.el.querySelector("[slot]")||this.el.innerHTML.trim()!==""}handleCheckedChange(t){this.internalChecked=t}updateFormValue(){var t;if((t=this.internals)===null||t===void 0?void 0:t.setFormValue){this.internals.setFormValue(this.internalChecked?this.value:null)}this.fallbackInput.checked=this.internalChecked;this.fallbackInput.name=this.name;this.fallbackInput.value=this.value;this.fallbackInput.disabled=this.disabled}errorChanged(t,r){if(t!==r){this.ifxError.emit(t)}}handleRadioButtonClick(t){if(this.disabled){t.stopPropagation();return}this.inputElement.click();this.internalChecked=this.inputElement.checked;this.checked=this.internalChecked;this.ifxChange.emit(this.internalChecked);const r=new CustomEvent("change",{bubbles:true,composed:true,detail:{checked:this.internalChecked}});this.el.dispatchEvent(r)}handleKeyDown(t){if([" ","Enter"].includes(t.key)){t.preventDefault();this.handleRadioButtonClick(new PointerEvent("click"))}}handleExternalChange(t){const r=t.target;if(r===this.el||r.tagName.toLowerCase()!=="ifx-radio-button")return;if(r.getAttribute("name")===this.name){this.internalChecked=false}}render(){return o("div",{key:"8b8ef83f01253deda3870317ac1899ea1e6d7bca",role:"radio","aria-checked":String(this.internalChecked),"aria-disabled":String(this.disabled),class:`radioButton__container ${this.size} ${this.disabled?"disabled":""}`,onClick:t=>this.handleRadioButtonClick(t),tabindex:this.disabled?-1:0},o("div",{key:"7668fa54b0682d512ef1af676dac8aee5575f8e8",class:`radioButton__wrapper \n ${this.internalChecked?"checked":""} \n ${this.disabled?"disabled":""} \n ${this.error?"error":""}`},this.internalChecked&&o("div",{key:"5bd3bd3000434c1f0811534d0239b4b119e73f34",class:"radioButton__wrapper-mark"})),this.hasSlot&&o("div",{key:"a4a533b20998726877f131d75f8477e41f7205e1",class:`label ${this.size==="m"?"label-m":""} ${this.disabled?"disabled":""}`},o("slot",{key:"5e097bb9d5048fd13d1a8a790ec3e0af666a24b4"})),o("input",{key:"52c6fb892db708d17a460df3c31ea998d2528895",type:"radio",hidden:true,ref:t=>this.inputElement=t,name:this.name,value:this.value,checked:this.internalChecked,disabled:this.disabled,onClick:t=>t.stopPropagation()}))}static get formAssociated(){return true}get el(){return e(this)}static get watchers(){return{checked:["handleCheckedChange"],internalChecked:["updateFormValue"],error:["errorChanged"]}}};n.style=a;export{n as ifx_radio_button};
|
2
|
+
//# sourceMappingURL=p-ed6fcfcd.entry.js.map
|
package/dist/infineon-design-system-stencil/{p-7de29aa8.entry.js.map → p-ed6fcfcd.entry.js.map}
RENAMED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["radioButtonCss","IfxRadioButtonStyle0","RadioButton","constructor","hostRef","this","disabled","error","size","internalChecked","hasSlot","componentWillLoad","fallbackInput","document","createElement","type","hidden","className","style","cssText","setAttribute","tabIndex","el","appendChild","HTMLElement","prototype","internals","attachInternals","e","console","warn","checked","querySelector","innerHTML","trim","handleCheckedChange","newValue","updateFormValue","_a","setFormValue","value","name","errorChanged","oldValue","ifxError","emit","handleRadioButtonClick","event","stopPropagation","inputElement","click","ifxChange","changeEvent","CustomEvent","bubbles","composed","detail","dispatchEvent","handleKeyDown","ev","includes","key","preventDefault","PointerEvent","handleExternalChange","target","tagName","toLowerCase","getAttribute","render","h","role","String","class","onClick","tabindex","ref"],"sources":["src/components/radio-button/radio-button.scss?tag=ifx-radio-button&encapsulation=shadow","src/components/radio-button/radio-button.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-flex;\n --_ifx-fallback-display: none !important;\n}\n\n._ifx-radiobutton-fallback {\n display: var(--_ifx-fallback-display);\n position: absolute !important;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n margin: -1px !important;\n overflow: hidden !important;\n clip: rect(0,0,0,0) !important;\n border: 0 !important;\n }\n\n.radioButton__container {\n box-sizing: border-box;\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 0px;\n gap: tokens.$ifxSpace100;\n cursor: pointer;\n font-family: tokens.$ifxFontFamilyBody;\n\n &.m .radioButton__wrapper {\n width: tokens.$ifxSize300;\n height: tokens.$ifxSize300;\n }\n\n .radioButton__wrapper {\n width: tokens.$ifxSize250;\n height: tokens.$ifxSize250;\n position: relative;\n display: block;\n border-radius: 50%;\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid #575352;\n\n &:focus {\n outline: none;\n\n &::before {\n content: '';\n position: absolute;\n width: calc(100% + 4px);\n height: calc(100% + 4px);\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n border: 2px solid tokens.$ifxColorOcean500;\n border-radius: 50%;\n }\n }\n\n .radioButton__wrapper-mark {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: #0A8276;\n border-radius: 50%;\n display: flex;\n justify-content: center;\n align-items: center;\n border-color: tokens.$ifxColorBaseTransparent;\n }\n\n &:hover {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &.disabled {\n background-color: #BFBBBB;\n border-color: #BFBBBB;\n\n &.error {\n\n &:hover,\n &:focus-visible {\n border-color: #CD002F;\n }\n }\n }\n\n &.checked {\n border-color: #0A8276;\n\n &::after {\n content: \"\";\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 10px;\n height: 10px;\n background-color: #0A8276;\n border-radius: 50%;\n }\n\n &.disabled::after {\n background-color: #BFBBBB;\n }\n\n\n &:hover {\n border-color: tokens.$ifxColorOcean600;\n\n & .radioButton__wrapper-mark {\n background-color: tokens.$ifxColorOcean600;\n }\n }\n\n &.disabled {\n background-color: tokens.$ifxColorBaseWhite;\n border-color: #BFBBBB;\n\n &.disabled::after {\n background-color: #BFBBBB;\n }\n\n & .radioButton__wrapper-mark {\n background-color: #BFBBBB;\n }\n }\n &.error::after {\n border-color: #CD002F;\n background-color: #CD002F;\n }\n }\n\n &.error:not(.disabled) {\n border-color: #CD002F;\n\n &:hover,\n &:focus-visible {\n border-color: #CD002F;\n }\n }\n }\n\n .label {\n display: flex;\n align-items: center;\n height: tokens.$ifxSize250;\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeS;\n line-height: tokens.$ifxLineHeightS;\n color: tokens.$ifxColorBaseBlack;\n flex: none;\n order: 1;\n flex-grow: 0;\n\n &.label-m {\n height: tokens.$ifxSize300;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n }\n\n &.disabled {\n color: #BFBBBB;\n }\n\n\n\n &:hover {\n cursor: pointer;\n }\n }\n}\n\n","import { Component, h, Prop, Element, State, Event, EventEmitter, Listen, Watch } from '@stencil/core';\n\n@Component({\n tag: 'ifx-radio-button',\n styleUrl: 'radio-button.scss',\n shadow: true,\n formAssociated: true\n})\nexport class RadioButton {\n @Element() el: HTMLElement;\n @Prop() disabled: boolean = false;\n @Prop() value: string;\n @Prop() error: boolean = false;\n @Prop({ reflect: true }) size: \"s\" | \"m\" = \"s\";\n @Prop({ reflect: true }) name: string;\n @Prop({ mutable: true }) checked: boolean;\n @State() internalChecked: boolean = false;\n @State() hasSlot: boolean = false;\n\n private inputElement: HTMLInputElement;\n private internals: ElementInternals;\n private fallbackInput: HTMLInputElement;\n\n @Event({ eventName: 'ifxChange' }) ifxChange: EventEmitter;\n @Event({ eventName: 'ifxError' }) ifxError: EventEmitter;\n\n componentWillLoad() {\n // Fallback for form association\n this.fallbackInput = document.createElement('input');\n this.fallbackInput.type = 'radio';\n this.fallbackInput.hidden = true;\n this.fallbackInput.className = '_ifx-radiobutton-fallback';\n this.fallbackInput.style.cssText = `\n display: none !important;\n position: absolute !important;\n opacity: 0 !important;\n pointer-events: none !important;\n width: 0 !important;\n height: 0 !important;\n `;\n this.fallbackInput.setAttribute('aria-hidden', 'true');\n this.fallbackInput.tabIndex = -1;\n this.el.appendChild(this.fallbackInput);\n\n // Initialize ElementInternals if supported\n if ('attachInternals' in HTMLElement.prototype) {\n try {\n this.internals = this.el.attachInternals();\n } catch (e) {\n console.warn('ElementInternals not supported');\n }\n }\n\n // Initial state\n this.internalChecked = this.checked || false;\n this.hasSlot = !!this.el.querySelector('[slot]') || this.el.innerHTML.trim() !== '';\n }\n\n @Watch('checked')\n handleCheckedChange(newValue: boolean) {\n this.internalChecked = newValue;\n }\n\n @Watch('internalChecked')\n updateFormValue() {\n // Update both ElementInternals and fallback input\n if (this.internals?.setFormValue) {\n this.internals.setFormValue(this.internalChecked ? this.value : null);\n }\n this.fallbackInput.checked = this.internalChecked;\n this.fallbackInput.name = this.name;\n this.fallbackInput.value = this.value;\n this.fallbackInput.disabled = this.disabled;\n }\n\n @Watch('error')\n errorChanged(newValue: boolean, oldValue: boolean) {\n if (newValue !== oldValue) {\n this.ifxError.emit(newValue);\n }\n }\n\n handleRadioButtonClick(event: Event) {\n if (this.disabled) {\n event.stopPropagation();\n return;\n }\n\n this.inputElement.click();\n this.internalChecked = this.inputElement.checked;\n this.checked = this.internalChecked;\n this.ifxChange.emit(this.internalChecked);\n\n const changeEvent = new CustomEvent('change', {\n bubbles: true,\n composed: true,\n detail: { checked: this.internalChecked }\n });\n this.el.dispatchEvent(changeEvent);\n }\n\n @Listen('keydown')\n handleKeyDown(ev: KeyboardEvent) {\n if ([' ', 'Enter'].includes(ev.key)) {\n ev.preventDefault();\n this.handleRadioButtonClick(new PointerEvent('click'));\n }\n }\n\n @Listen('change', { target: 'document' })\n handleExternalChange(event: Event) {\n const target = event.target as HTMLElement;\n if (target === this.el || target.tagName.toLowerCase() !== 'ifx-radio-button') return;\n \n if (target.getAttribute('name') === this.name) {\n this.internalChecked = false;\n }\n }\n\n render() {\n return (\n <div\n role=\"radio\"\n aria-checked={String(this.internalChecked)}\n aria-disabled={String(this.disabled)}\n class={`radioButton__container ${this.size} ${this.disabled ? 'disabled' : ''}`}\n onClick={(e) => this.handleRadioButtonClick(e)}\n tabindex={this.disabled ? -1 : 0}\n >\n <div\n class={`radioButton__wrapper \n ${this.internalChecked ? 'checked' : ''} \n ${this.disabled ? 'disabled' : ''} \n ${this.error ? 'error' : ''}`}\n >\n {this.internalChecked && <div class=\"radioButton__wrapper-mark\"></div>}\n </div>\n\n {this.hasSlot && (\n <div class={`label ${this.size === \"m\" ? \"label-m\" : \"\"} ${this.disabled ? 'disabled' : ''}`}>\n <slot />\n </div>\n )}\n\n <input\n type=\"radio\"\n hidden\n ref={el => this.inputElement = el}\n name={this.name}\n value={this.value}\n checked={this.internalChecked}\n disabled={this.disabled}\n onClick={(e) => e.stopPropagation()}\n />\n </div>\n );\n }\n}"],"mappings":"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","ignoreList":[]}
|
1
|
+
{"version":3,"names":["radioButtonCss","IfxRadioButtonStyle0","RadioButton","constructor","hostRef","this","disabled","error","size","internalChecked","hasSlot","componentWillLoad","fallbackInput","document","createElement","type","hidden","className","style","cssText","setAttribute","tabIndex","el","appendChild","HTMLElement","prototype","internals","attachInternals","e","console","warn","checked","querySelector","innerHTML","trim","handleCheckedChange","newValue","updateFormValue","_a","setFormValue","value","name","errorChanged","oldValue","ifxError","emit","handleRadioButtonClick","event","stopPropagation","inputElement","click","ifxChange","changeEvent","CustomEvent","bubbles","composed","detail","dispatchEvent","handleKeyDown","ev","includes","key","preventDefault","PointerEvent","handleExternalChange","target","tagName","toLowerCase","getAttribute","render","h","role","String","class","onClick","tabindex","ref"],"sources":["src/components/radio-button/radio-button.scss?tag=ifx-radio-button&encapsulation=shadow","src/components/radio-button/radio-button.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-flex;\n --_ifx-fallback-display: none !important;\n}\n\n._ifx-radiobutton-fallback {\n display: var(--_ifx-fallback-display);\n position: absolute !important;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n margin: -1px !important;\n overflow: hidden !important;\n clip: rect(0,0,0,0) !important;\n border: 0 !important;\n }\n\n.radioButton__container {\n box-sizing: border-box;\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 0px;\n gap: tokens.$ifxSpace100;\n cursor: pointer;\n font-family: tokens.$ifxFontFamilyBody;\n\n &.m .radioButton__wrapper {\n width: tokens.$ifxSize300;\n height: tokens.$ifxSize300;\n }\n\n .radioButton__wrapper {\n width: tokens.$ifxSize250;\n height: tokens.$ifxSize250;\n position: relative;\n display: block;\n border-radius: 50%;\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid #575352;\n\n &:focus {\n outline: none;\n\n &::before {\n content: '';\n position: absolute;\n width: calc(100% + 4px);\n height: calc(100% + 4px);\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n border: 2px solid tokens.$ifxColorOcean500;\n border-radius: 50%;\n }\n }\n\n .radioButton__wrapper-mark {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: #0A8276;\n border-radius: 50%;\n display: flex;\n justify-content: center;\n align-items: center;\n border-color: tokens.$ifxColorBaseTransparent;\n }\n\n &:hover {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &.disabled {\n background-color: #BFBBBB;\n border-color: #BFBBBB;\n\n &.error {\n\n &:hover,\n &:focus-visible {\n border-color: #CD002F;\n }\n }\n }\n\n &.checked {\n border-color: #0A8276;\n\n &::after {\n content: \"\";\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 10px;\n height: 10px;\n background-color: #0A8276;\n border-radius: 50%;\n }\n\n &.disabled::after {\n background-color: #BFBBBB;\n }\n\n\n &:hover {\n border-color: tokens.$ifxColorOcean600;\n\n & .radioButton__wrapper-mark {\n background-color: tokens.$ifxColorOcean600;\n }\n }\n\n &.disabled {\n background-color: tokens.$ifxColorBaseWhite;\n border-color: #BFBBBB;\n\n &.disabled::after {\n background-color: #BFBBBB;\n }\n\n & .radioButton__wrapper-mark {\n background-color: #BFBBBB;\n }\n }\n &.error::after {\n border-color: #CD002F;\n background-color: #CD002F;\n }\n }\n\n &.error:not(.disabled) {\n border-color: #CD002F;\n\n &:hover,\n &:focus-visible {\n border-color: #CD002F;\n }\n }\n }\n\n .label {\n display: flex;\n align-items: center;\n height: tokens.$ifxSize250;\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeS;\n line-height: tokens.$ifxLineHeightS;\n color: tokens.$ifxColorBaseBlack;\n flex: none;\n order: 1;\n flex-grow: 0;\n\n &.label-m {\n height: tokens.$ifxSize300;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n }\n\n &.disabled {\n color: #BFBBBB;\n }\n\n\n\n &:hover {\n cursor: pointer;\n }\n }\n}\n\n","import { Component, h, Prop, Element, State, Event, EventEmitter, Listen, Watch } from '@stencil/core';\n\n@Component({\n tag: 'ifx-radio-button',\n styleUrl: 'radio-button.scss',\n shadow: true,\n formAssociated: true\n})\nexport class RadioButton {\n @Element() el: HTMLElement;\n @Prop() disabled: boolean = false;\n @Prop() value: string;\n @Prop() error: boolean = false;\n @Prop({ reflect: true }) size: \"s\" | \"m\" = \"s\";\n @Prop({ reflect: true }) name: string;\n @Prop({ mutable: true }) checked: boolean;\n @State() internalChecked: boolean = false;\n @State() hasSlot: boolean = false;\n\n private inputElement: HTMLInputElement;\n private internals: ElementInternals;\n private fallbackInput: HTMLInputElement;\n\n @Event({ eventName: 'ifxChange' }) ifxChange: EventEmitter;\n @Event({ eventName: 'ifxError' }) ifxError: EventEmitter;\n\n componentWillLoad() {\n // Fallback for form association\n this.fallbackInput = document.createElement('input');\n this.fallbackInput.type = 'radio';\n this.fallbackInput.hidden = true;\n this.fallbackInput.className = '_ifx-radiobutton-fallback';\n this.fallbackInput.style.cssText = `\n display: none !important;\n position: absolute !important;\n opacity: 0 !important;\n pointer-events: none !important;\n width: 0 !important;\n height: 0 !important;\n `;\n this.fallbackInput.setAttribute('aria-hidden', 'true');\n this.fallbackInput.tabIndex = -1;\n this.el.appendChild(this.fallbackInput);\n\n // Initialize ElementInternals if supported\n if ('attachInternals' in HTMLElement.prototype) {\n try {\n this.internals = this.el.attachInternals();\n } catch (e) {\n console.warn('ElementInternals not supported');\n }\n }\n\n // Initial state\n this.internalChecked = this.checked || false;\n this.hasSlot = !!this.el.querySelector('[slot]') || this.el.innerHTML.trim() !== '';\n }\n\n @Watch('checked')\n handleCheckedChange(newValue: boolean) {\n this.internalChecked = newValue;\n }\n\n @Watch('internalChecked')\n updateFormValue() {\n // Update both ElementInternals and fallback input\n if (this.internals?.setFormValue) {\n this.internals.setFormValue(this.internalChecked ? this.value : null);\n }\n this.fallbackInput.checked = this.internalChecked;\n this.fallbackInput.name = this.name;\n this.fallbackInput.value = this.value;\n this.fallbackInput.disabled = this.disabled;\n }\n\n @Watch('error')\n errorChanged(newValue: boolean, oldValue: boolean) {\n if (newValue !== oldValue) {\n this.ifxError.emit(newValue);\n }\n }\n\n handleRadioButtonClick(event: Event) {\n if (this.disabled) {\n event.stopPropagation();\n return;\n }\n\n this.inputElement.click();\n this.internalChecked = this.inputElement.checked;\n this.checked = this.internalChecked;\n this.ifxChange.emit(this.internalChecked);\n\n const changeEvent = new CustomEvent('change', {\n bubbles: true,\n composed: true,\n detail: { checked: this.internalChecked }\n });\n this.el.dispatchEvent(changeEvent);\n }\n\n @Listen('keydown')\n handleKeyDown(ev: KeyboardEvent) {\n if ([' ', 'Enter'].includes(ev.key)) {\n ev.preventDefault();\n this.handleRadioButtonClick(new PointerEvent('click'));\n }\n }\n\n @Listen('change', { target: 'document' })\n handleExternalChange(event: Event) {\n const target = event.target as HTMLElement;\n if (target === this.el || target.tagName.toLowerCase() !== 'ifx-radio-button') return;\n \n if (target.getAttribute('name') === this.name) {\n this.internalChecked = false;\n }\n }\n\n render() {\n return (\n <div\n role=\"radio\"\n aria-checked={String(this.internalChecked)}\n aria-disabled={String(this.disabled)}\n class={`radioButton__container ${this.size} ${this.disabled ? 'disabled' : ''}`}\n onClick={(e) => this.handleRadioButtonClick(e)}\n tabindex={this.disabled ? -1 : 0}\n >\n <div\n class={`radioButton__wrapper \n ${this.internalChecked ? 'checked' : ''} \n ${this.disabled ? 'disabled' : ''} \n ${this.error ? 'error' : ''}`}\n >\n {this.internalChecked && <div class=\"radioButton__wrapper-mark\"></div>}\n </div>\n\n {this.hasSlot && (\n <div class={`label ${this.size === \"m\" ? \"label-m\" : \"\"} ${this.disabled ? 'disabled' : ''}`}>\n <slot />\n </div>\n )}\n\n <input\n type=\"radio\"\n hidden\n ref={el => this.inputElement = el}\n name={this.name}\n value={this.value}\n checked={this.internalChecked}\n disabled={this.disabled}\n onClick={(e) => e.stopPropagation()}\n />\n </div>\n );\n }\n}"],"mappings":"yDAAA,MAAMA,EAAiB,qxGACvB,MAAAC,EAAeD,E,MCOFE,EAAW,MANxB,WAAAC,CAAAC,G,kFAQUC,KAAAC,SAAoB,MAEpBD,KAAAE,MAAiB,MACAF,KAAAG,KAAkB,IAGlCH,KAAAI,gBAA2B,MAC3BJ,KAAAK,QAAmB,K,CAS5B,iBAAAC,GAEEN,KAAKO,cAAgBC,SAASC,cAAc,SAC5CT,KAAKO,cAAcG,KAAO,QAC1BV,KAAKO,cAAcI,OAAS,KAC5BX,KAAKO,cAAcK,UAAY,4BAC/BZ,KAAKO,cAAcM,MAAMC,QAAU,+MAQnCd,KAAKO,cAAcQ,aAAa,cAAe,QAC/Cf,KAAKO,cAAcS,UAAY,EAC/BhB,KAAKiB,GAAGC,YAAYlB,KAAKO,eAGzB,GAAI,oBAAqBY,YAAYC,UAAW,CAC9C,IACEpB,KAAKqB,UAAYrB,KAAKiB,GAAGK,iB,CACzB,MAAOC,GACPC,QAAQC,KAAK,iC,EAKjBzB,KAAKI,gBAAkBJ,KAAK0B,SAAW,MACvC1B,KAAKK,UAAYL,KAAKiB,GAAGU,cAAc,WAAa3B,KAAKiB,GAAGW,UAAUC,SAAW,E,CAInF,mBAAAC,CAAoBC,GAClB/B,KAAKI,gBAAkB2B,C,CAIzB,eAAAC,G,MAEE,IAAIC,EAAAjC,KAAKqB,aAAS,MAAAY,SAAA,SAAAA,EAAEC,aAAc,CAChClC,KAAKqB,UAAUa,aAAalC,KAAKI,gBAAkBJ,KAAKmC,MAAQ,K,CAElEnC,KAAKO,cAAcmB,QAAU1B,KAAKI,gBAClCJ,KAAKO,cAAc6B,KAAOpC,KAAKoC,KAC/BpC,KAAKO,cAAc4B,MAAQnC,KAAKmC,MAChCnC,KAAKO,cAAcN,SAAWD,KAAKC,Q,CAInC,YAAAoC,CAAaN,EAAmBO,GAC9B,GAAIP,IAAaO,EAAU,CACzBtC,KAAKuC,SAASC,KAAKT,E,EAIzB,sBAAAU,CAAuBC,GACrB,GAAI1C,KAAKC,SAAU,CACjByC,EAAMC,kBACN,M,CAGF3C,KAAK4C,aAAaC,QAClB7C,KAAKI,gBAAkBJ,KAAK4C,aAAalB,QACzC1B,KAAK0B,QAAU1B,KAAKI,gBACpBJ,KAAK8C,UAAUN,KAAKxC,KAAKI,iBAEzB,MAAM2C,EAAc,IAAIC,YAAY,SAAU,CAC5CC,QAAS,KACTC,SAAU,KACVC,OAAQ,CAAEzB,QAAS1B,KAAKI,mBAE1BJ,KAAKiB,GAAGmC,cAAcL,E,CAIxB,aAAAM,CAAcC,GACZ,GAAI,CAAC,IAAK,SAASC,SAASD,EAAGE,KAAM,CACnCF,EAAGG,iBACHzD,KAAKyC,uBAAuB,IAAIiB,aAAa,S,EAKjD,oBAAAC,CAAqBjB,GACnB,MAAMkB,EAASlB,EAAMkB,OACrB,GAAIA,IAAW5D,KAAKiB,IAAM2C,EAAOC,QAAQC,gBAAkB,mBAAoB,OAE/E,GAAIF,EAAOG,aAAa,UAAY/D,KAAKoC,KAAM,CAC7CpC,KAAKI,gBAAkB,K,EAI3B,MAAA4D,GACE,OACEC,EAAA,OAAAT,IAAA,2CACEU,KAAK,QAAO,eACEC,OAAOnE,KAAKI,iBAAgB,gBAC3B+D,OAAOnE,KAAKC,UAC3BmE,MAAO,0BAA0BpE,KAAKG,QAAQH,KAAKC,SAAW,WAAa,KAC3EoE,QAAU9C,GAAMvB,KAAKyC,uBAAuBlB,GAC5C+C,SAAUtE,KAAKC,UAAY,EAAI,GAE/BgE,EAAA,OAAAT,IAAA,2CACEY,MAAO,sCACHpE,KAAKI,gBAAkB,UAAY,oBACnCJ,KAAKC,SAAW,WAAa,oBAC7BD,KAAKE,MAAQ,QAAU,MAE1BF,KAAKI,iBAAmB6D,EAAA,OAAAT,IAAA,2CAAKY,MAAM,+BAGrCpE,KAAKK,SACJ4D,EAAA,OAAAT,IAAA,2CAAKY,MAAO,SAASpE,KAAKG,OAAS,IAAM,UAAY,MAAMH,KAAKC,SAAW,WAAa,MACtFgE,EAAA,QAAAT,IAAA,8CAIJS,EAAA,SAAAT,IAAA,2CACE9C,KAAK,QACLC,OAAM,KACN4D,IAAKtD,GAAMjB,KAAK4C,aAAe3B,EAC/BmB,KAAMpC,KAAKoC,KACXD,MAAOnC,KAAKmC,MACZT,QAAS1B,KAAKI,gBACdH,SAAUD,KAAKC,SACfoE,QAAU9C,GAAMA,EAAEoB,oB","ignoreList":[]}
|
@@ -0,0 +1,2 @@
|
|
1
|
+
import{r as e,h as a}from"./p-e6edf72d.js";const r=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{display:inline-flex}.container{display:inline-flex;align-items:center;padding:4px 16px;border:1px solid #BFBBBB;border-radius:9999px;background-color:#FFFFFF;gap:8px;font-family:"Source Sans 3"}.container:hover{cursor:pointer;border-color:#8D8786}.container:active,.container.active{border-color:#1D1D1D}.container:focus:not(:active,.active){outline:none;border-color:#1D1D1D}.container .label-wrapper{text-decoration:none}.container .label-wrapper .label{margin:0;font-weight:400;font-size:1rem;line-height:20px;color:#1D1D1D}';const o=r;const n=class{constructor(a){e(this,a)}render(){return a("div",{key:"226762652cca543b0a1d18e5369522b4e3f8e439","aria-label":"a tag",class:"container"},this.icon&&a("ifx-icon",{key:"fdbc2d0f9db2230d6a5dfa0c8bce6168c84be5ed",icon:this.icon}),a("a",{key:"4b0b1c215663bb98233e9f4a1839c039d5a62677",href:"javascript:void(null);",class:"label-wrapper"},a("p",{key:"886e29da34a796cd03db982a9a189512c4a0a953",class:"label"},a("slot",{key:"e202efd131d0acb79b9d47a4dfaa8ba865598377"}))))}};n.style=o;export{n as ifx_tag};
|
2
|
+
//# sourceMappingURL=p-f1649115.entry.js.map
|
package/dist/infineon-design-system-stencil/{p-50793991.entry.js.map → p-f1649115.entry.js.map}
RENAMED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["tagCss","IfxTagStyle0","Tag","render","h","key","class","this","icon","href"],"sources":["src/components/tag/tag.scss?tag=ifx-tag&encapsulation=shadow","src/components/tag/tag.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-flex;\n}\n\n.container {\n display: inline-flex;\n align-items: center;\n padding: tokens.$ifxSpace50 tokens.$ifxSpace200;\n border: 1px solid tokens.$ifxColorEngineering300;\n border-radius: tokens.$ifxBorderRadiusRound;\n background-color: tokens.$ifxColorBaseWhite;\n gap: tokens.$ifxSpace100;\n font-family: tokens.$ifxFontFamilyBody;\n\n &:hover {\n cursor: pointer;\n border-color: tokens.$ifxColorEngineering400;\n }\n\n &:active,\n &.active {\n border-color: tokens.$ifxColorBaseBlack;\n }\n\n &:focus:not(:active, .active) {\n outline: none;\n border-color: tokens.$ifxColorBaseBlack;\n }\n\n .label-wrapper {\n text-decoration: none;\n\n .label {\n margin: 0;\n font-weight: tokens.$ifxFontWeightRegular;\n font-size: tokens.$ifxFontSizeM;\n line-height: 20px;\n color: tokens.$ifxColorBaseBlack;\n }\n }\n}","import { Component, Prop, h } from '@stencil/core';\n \n\n@Component({\n tag: 'ifx-tag',\n styleUrl: 'tag.scss',\n shadow: true\n})\nexport class Tag {\n @Prop() icon: string;\n\n\n\n render() {\n return (\n <div aria-label=\"a tag\" class=\"container\">\n {this.icon && (\n <ifx-icon icon={this.icon}></ifx-icon>)}\n <a href=\"javascript:void(null);\" class=\"label-wrapper\" >\n <p class=\"label\">\n <slot />\n </p>\n </a>\n </div>\n\n );\n }\n}"],"mappings":"2CAAA,MAAMA,EAAS,
|
1
|
+
{"version":3,"names":["tagCss","IfxTagStyle0","Tag","render","h","key","class","this","icon","href"],"sources":["src/components/tag/tag.scss?tag=ifx-tag&encapsulation=shadow","src/components/tag/tag.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-flex;\n}\n\n.container {\n display: inline-flex;\n align-items: center;\n padding: tokens.$ifxSpace50 tokens.$ifxSpace200;\n border: 1px solid tokens.$ifxColorEngineering300;\n border-radius: tokens.$ifxBorderRadiusRound;\n background-color: tokens.$ifxColorBaseWhite;\n gap: tokens.$ifxSpace100;\n font-family: tokens.$ifxFontFamilyBody;\n\n &:hover {\n cursor: pointer;\n border-color: tokens.$ifxColorEngineering400;\n }\n\n &:active,\n &.active {\n border-color: tokens.$ifxColorBaseBlack;\n }\n\n &:focus:not(:active, .active) {\n outline: none;\n border-color: tokens.$ifxColorBaseBlack;\n }\n\n .label-wrapper {\n text-decoration: none;\n\n .label {\n margin: 0;\n font-weight: tokens.$ifxFontWeightRegular;\n font-size: tokens.$ifxFontSizeM;\n line-height: 20px;\n color: tokens.$ifxColorBaseBlack;\n }\n }\n}","import { Component, Prop, h } from '@stencil/core';\n \n\n@Component({\n tag: 'ifx-tag',\n styleUrl: 'tag.scss',\n shadow: true\n})\nexport class Tag {\n @Prop() icon: string;\n\n\n\n render() {\n return (\n <div aria-label=\"a tag\" class=\"container\">\n {this.icon && (\n <ifx-icon icon={this.icon}></ifx-icon>)}\n <a href=\"javascript:void(null);\" class=\"label-wrapper\" >\n <p class=\"label\">\n <slot />\n </p>\n </a>\n </div>\n\n );\n }\n}"],"mappings":"2CAAA,MAAMA,EAAS,qlBACf,MAAAC,EAAeD,E,MCOFE,EAAG,M,yBAKd,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,wDAAgB,QAAQC,MAAM,aAC3BC,KAAKC,MACJJ,EAAA,YAAAC,IAAA,2CAAUG,KAAMD,KAAKC,OACvBJ,EAAA,KAAAC,IAAA,2CAAGI,KAAK,yBAAyBH,MAAM,iBACrCF,EAAA,KAAAC,IAAA,2CAAGC,MAAM,SACPF,EAAA,QAAAC,IAAA,+C","ignoreList":[]}
|
@@ -0,0 +1,2 @@
|
|
1
|
+
import{r as e,c as t,h as i,g as o}from"./p-e6edf72d.js";const s=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.dropdown-item{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;padding:8px 16px;gap:8px;font-family:"Source Sans 3"}.dropdown-item.hide{display:none}.dropdown-item span{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px;}.dropdown-item.small span{font-size:14px}.dropdown-item:hover{cursor:pointer;background-color:#EEEDED}.dropdown-item:active{background-color:#BFBBBB}.icon{margin-right:4px}';const n=s;const r=class{constructor(i){e(this,i);this.ifxDropdownItem=t(this,"ifxDropdownItem",7);this.href="";this.target="_self";this.hide=false;this.size="l"}handleMenuSize(e){this.size=e.detail}handleEventEmission(){this.ifxDropdownItem.emit(this.el.textContent)}render(){let e=this.href?{href:this.href,target:this.target}:{};return i("a",Object.assign({key:"5ec61a932268bd6bc279546d2718347deec616f7"},e,{onClick:()=>this.handleEventEmission(),class:`dropdown-item ${this.size==="s"?"small":""} ${this.hide?"hide":""}`}),this.icon&&i("ifx-icon",{key:"f8644bd37348ec718f54657faaf912d48b2b696d",class:"icon",icon:this.icon}),i("span",{key:"c3643953f6fcf084a3d033df50b79bc8de562640"},i("slot",{key:"624c93095768745e9af06b60f7a7f5fcdbe0d05e"})))}get el(){return o(this)}};r.style=n;export{r as ifx_dropdown_item};
|
2
|
+
//# sourceMappingURL=p-f17ca236.entry.js.map
|
package/dist/infineon-design-system-stencil/{p-db9bdd7d.entry.js.map → p-f17ca236.entry.js.map}
RENAMED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["dropdownItemCss","IfxDropdownItemStyle0","DropdownItem","constructor","hostRef","this","href","target","hide","size","handleMenuSize","event","detail","handleEventEmission","ifxDropdownItem","emit","el","textContent","render","hrefAttr","h","Object","assign","key","onClick","class","icon"],"sources":["src/components/dropdown/dropdown-item/dropdown-item.scss?tag=ifx-dropdown-item&encapsulation=shadow","src/components/dropdown/dropdown-item/dropdown-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n.dropdown-item {\n text-decoration: none;\n color: tokens.$ifxColorBaseBlack;\n display: flex;\n align-items: center;\n padding: 8px 16px;\n gap: tokens.$ifxSize100;\n font-family: tokens.$ifxFontFamilyBody;\n\n &.hide {\n display: none;\n }\n\n & span {\n color: tokens.$ifxColorBaseBlack;\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n /* 150% */\n }\n\n &.small {\n & span {\n font-size: 14px;\n }\n }\n\n &:hover {\n cursor: pointer;\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &:active {\n background-color: tokens.$ifxColorEngineering300;\n }\n}\n\n.icon {\n margin-right: 4px;\n}","// dropdown-item.tsx\nimport { Component, Prop, h, Listen, State, Event, EventEmitter, Element } from \"@stencil/core\";\n\n@Component({\n tag: 'ifx-dropdown-item',\n styleUrl: 'dropdown-item.scss',\n shadow: true\n})\n\nexport class DropdownItem {\n @Prop() icon: string;\n @Prop() href: string = \"\"\n @Prop() target: string = \"_self\"\n @Prop() hide: boolean = false;\n @State() size: string = 'l'\n @Event() ifxDropdownItem: EventEmitter;\n @Element() el;\n\n @Listen('menuSize', { target: 'body' })\n handleMenuSize(event: CustomEvent) {\n this.size = event.detail;\n }\n\n handleEventEmission() {\n this.ifxDropdownItem.emit(this.el.textContent)\n }\n\n render() {\n let hrefAttr = this.href ? { href: this.href, target: this.target } : {};\n return (\n <a {...hrefAttr} onClick={() => this.handleEventEmission()} class={`dropdown-item ${this.size === 's' ? 'small' : \"\"} ${this.hide ? 'hide' : \"\"}`}>\n {this.icon && <ifx-icon class=\"icon\" icon={this.icon}></ifx-icon>}\n <span>\n <slot />\n </span>\n </a>\n );\n }\n}"],"mappings":"yDAAA,MAAMA,EAAkB,
|
1
|
+
{"version":3,"names":["dropdownItemCss","IfxDropdownItemStyle0","DropdownItem","constructor","hostRef","this","href","target","hide","size","handleMenuSize","event","detail","handleEventEmission","ifxDropdownItem","emit","el","textContent","render","hrefAttr","h","Object","assign","key","onClick","class","icon"],"sources":["src/components/dropdown/dropdown-item/dropdown-item.scss?tag=ifx-dropdown-item&encapsulation=shadow","src/components/dropdown/dropdown-item/dropdown-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n.dropdown-item {\n text-decoration: none;\n color: tokens.$ifxColorBaseBlack;\n display: flex;\n align-items: center;\n padding: 8px 16px;\n gap: tokens.$ifxSize100;\n font-family: tokens.$ifxFontFamilyBody;\n\n &.hide {\n display: none;\n }\n\n & span {\n color: tokens.$ifxColorBaseBlack;\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n /* 150% */\n }\n\n &.small {\n & span {\n font-size: 14px;\n }\n }\n\n &:hover {\n cursor: pointer;\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &:active {\n background-color: tokens.$ifxColorEngineering300;\n }\n}\n\n.icon {\n margin-right: 4px;\n}","// dropdown-item.tsx\nimport { Component, Prop, h, Listen, State, Event, EventEmitter, Element } from \"@stencil/core\";\n\n@Component({\n tag: 'ifx-dropdown-item',\n styleUrl: 'dropdown-item.scss',\n shadow: true\n})\n\nexport class DropdownItem {\n @Prop() icon: string;\n @Prop() href: string = \"\"\n @Prop() target: string = \"_self\"\n @Prop() hide: boolean = false;\n @State() size: string = 'l'\n @Event() ifxDropdownItem: EventEmitter;\n @Element() el;\n\n @Listen('menuSize', { target: 'body' })\n handleMenuSize(event: CustomEvent) {\n this.size = event.detail;\n }\n\n handleEventEmission() {\n this.ifxDropdownItem.emit(this.el.textContent)\n }\n\n render() {\n let hrefAttr = this.href ? { href: this.href, target: this.target } : {};\n return (\n <a {...hrefAttr} onClick={() => this.handleEventEmission()} class={`dropdown-item ${this.size === 's' ? 'small' : \"\"} ${this.hide ? 'hide' : \"\"}`}>\n {this.icon && <ifx-icon class=\"icon\" icon={this.icon}></ifx-icon>}\n <span>\n <slot />\n </span>\n </a>\n );\n }\n}"],"mappings":"yDAAA,MAAMA,EAAkB,yfACxB,MAAAC,EAAeD,E,MCQFE,EAAY,MANzB,WAAAC,CAAAC,G,2DAQUC,KAAAC,KAAe,GACfD,KAAAE,OAAiB,QACjBF,KAAAG,KAAgB,MACfH,KAAAI,KAAe,G,CAKxB,cAAAC,CAAeC,GACbN,KAAKI,KAAOE,EAAMC,M,CAGpB,mBAAAC,GACER,KAAKS,gBAAgBC,KAAKV,KAAKW,GAAGC,Y,CAGpC,MAAAC,GACE,IAAIC,EAAWd,KAAKC,KAAO,CAAEA,KAAMD,KAAKC,KAAMC,OAAQF,KAAKE,QAAW,GACtE,OACEa,EAAA,IAAAC,OAAAC,OAAA,CAAAC,IAAA,4CAAOJ,EAAQ,CAAEK,QAAS,IAAMnB,KAAKQ,sBAAuBY,MAAO,iBAAiBpB,KAAKI,OAAS,IAAM,QAAU,MAAMJ,KAAKG,KAAO,OAAS,OAC1IH,KAAKqB,MAAQN,EAAA,YAAAG,IAAA,2CAAUE,MAAM,OAAOC,KAAMrB,KAAKqB,OAChDN,EAAA,QAAAG,IAAA,4CACEH,EAAA,QAAAG,IAAA,8C","ignoreList":[]}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@infineon/infineon-design-system-stencil",
|
3
|
-
"version": "33.2.0",
|
3
|
+
"version": "33.2.1--canary.1845.491a66dcc03a541697e62d5bb63a47ca939c570b.0",
|
4
4
|
"private": false,
|
5
5
|
"description": "Infineon design system Stencil web components",
|
6
6
|
"homepage": "https://infineon.github.io/infineon-design-system-stencil",
|
@@ -1 +0,0 @@
|
|
1
|
-
{"file":"p-5b5399c2.js","mappings":";;AAAA,MAAM,YAAY,GAAG,kKAAkK,CAAC;AACxL,2BAAe,YAAY;;MCOd,SAAS;IALtB;;;;QAOU,iBAAY,GAAY,KAAK,CAAC;KAuBvC;IAnBC,MAAM,UAAU,CAAC,KAAkB;QACjC,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAC,CAAC;YACzE,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;gBACxB,MAAM,WAAW,GAAG,IAAmC,CAAC;gBACxD,IAAI,WAAW,KAAK,KAAK,CAAC,MAAM,KAAK,MAAM,WAAW,CAAC,IAAI,CAAC,EAAE;oBAC5D,WAAW,CAAC,IAAI,GAAG,KAAK,CAAC;iBAC1B;aACF;SACF;KACF;IAED,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,mBAAmB,IAC5B,8DAAQ,CACJ,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/accordion/accordion.scss?tag=ifx-accordion&encapsulation=shadow","src/components/accordion/accordion.tsx"],"sourcesContent":["// ifxAccordion.scss\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: block;\n}\n\n.accordion-wrapper {\n display: flex;\n flex-direction: column;\n gap: tokens.$ifxSpace100;\n font-family: tokens.$ifxFontFamilyBody;\n\n}","//ifxAccordion.tsx\nimport { Component, h, Listen, Element, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ifx-accordion',\n styleUrl: 'accordion.scss',\n shadow: { delegatesFocus: true },\n})\nexport class Accordion {\n @Element() el: HTMLElement;\n @Prop() autoCollapse: boolean = false;\n\n\n @Listen('ifxOpen')\n async onItemOpen(event: CustomEvent) {\n if (this.autoCollapse) {\n const items = Array.from(this.el.querySelectorAll('ifx-accordion-item'));\n for (const item of items) {\n const itemElement = item as HTMLIfxAccordionItemElement;\n if (itemElement !== event.target && (await itemElement.open)) {\n itemElement.open = false;\n }\n }\n }\n }\n\n render() {\n return (\n <div class=\"accordion-wrapper\">\n <slot />\n </div>\n );\n }\n}\n"],"version":3}
|
@@ -1 +0,0 @@
|
|
1
|
-
{"file":"p-7c7a5393.js","mappings":"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","names":[],"sources":["src/components/accordion/accordionItem.scss?tag=ifx-accordion-item&encapsulation=shadow","src/components/accordion/accordionItem.tsx"],"sourcesContent":["// ifxAccordionItem.scss\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n\n.accordion-item {\n border-radius: 3px;\n overflow: hidden;\n transition: all 0.3s;\n font-family: tokens.$ifxFontFamilyBody;\n\n}\n\n.accordion-title:focus {\n outline: none;\n}\n\n// workaround to add corner radius to outline\n.accordion-title:focus::after {\n content: '';\n display: block;\n position: absolute;\n top: -4px;\n bottom: -4px;\n left: -4px;\n right: -4px;\n border-radius: 5px;\n border: 2px solid tokens.$ifxColorOcean500;\n box-sizing: border-box;\n}\n\n.accordion-title:hover {\n border: 1px solid tokens.$ifxColorEngineering200;\n color: tokens.$ifxColorOcean600;\n}\n\n.accordion-title {\n display: flex;\n align-items: center;\n position: relative;\n padding: tokens.$ifxSpace150 tokens.$ifxSpace200;\n gap: tokens.$ifxSpace150;\n color: tokens.$ifxColorOcean500;\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid tokens.$ifxColorEngineering200;\n cursor: pointer;\n margin: 4px;\n}\n\n.accordion-caption {\n font-weight: tokens.$ifxFontWeightSemibold;\n font-size: tokens.$ifxFontSizeL;\n}\n\n.accordion-content {\n gap: tokens.$ifxSpace100;\n max-height: 0;\n overflow: hidden;\n transition: max-height 0.3s ease-in-out;\n line-height: 24px;\n font-size: tokens.$ifxFontSizeM;\n font-weight: 400;\n}\n\n.inner-content {\n background-color: tokens.$ifxColorBaseWhite;\n padding: tokens.$ifxSpace300;\n // white-space: pre-wrap;\n /* wraps text at spaces and within words */\n word-wrap: break-word;\n /* breaks text within a word if necessary */\n overflow-wrap: anywhere;\n align-self: stretch;\n\n /* breaks text at arbitrary points when needed */\n}\n\n.accordion-icon {\n font-weight: bold;\n display: inline-block;\n transition: transform 0.3s;\n\n &:hover {\n color: tokens.$ifxColorOcean600;\n\n }\n}\n\n\n\n.accordion-item.open .accordion-icon {\n transform: rotate(-180deg);\n}","//ifxAccordionItem\nimport { Component, Prop, h, State, Event, EventEmitter, Watch, Listen, Element } from '@stencil/core';\n\n@Component({\n tag: 'ifx-accordion-item',\n styleUrl: 'accordionItem.scss',\n shadow: true,\n})\nexport class IfxAccordionItem {\n @Element() el;\n @Prop() caption: string;\n @Prop({\n mutable: true,\n }) open: boolean = false;\n @Prop() AriaLevel = 3;\n @State() internalOpen: boolean = false;\n @Event() ifxOpen: EventEmitter;\n @Event() ifxClose: EventEmitter;\n private contentEl!: HTMLElement;\n private titleEl!: HTMLElement;\n\n\n componentWillLoad() {\n this.internalOpen = this.open;\n }\n\n componentDidLoad() {\n this.openAccordionItem()\n }\n\n componentDidUpdate() {\n this.openAccordionItem()\n }\n\n\n\n @Watch('open')\n openChanged(newValue: boolean) {\n this.internalOpen = newValue;\n }\n\n toggleOpen() {\n this.internalOpen = !this.internalOpen;\n this.open = this.internalOpen;\n\n if (this.internalOpen) {\n this.ifxOpen.emit({ isOpen: this.internalOpen });\n } else {\n this.ifxClose.emit({ isClosed: !this.internalOpen });\n }\n }\n\n openAccordionItem() {\n if (this.internalOpen) {\n this.contentEl.style.maxHeight = `${this.contentEl.scrollHeight}px`;\n } else {\n this.contentEl.style.maxHeight = '0';\n }\n }\n\n handleSlotChange(e) {\n const slotElement = e.target;\n const nodes = slotElement.assignedNodes();\n \n if(nodes.length > 0) {\n nodes.forEach(node => {\n const observer = new MutationObserver((mutationsList, _) => {\n for(let mutation of mutationsList) {\n if (mutation.type === 'childList') {\n if (this.internalOpen) {\n this.openAccordionItem();\n }\n }\n }\n });\n observer.observe(node, { attributes: true, childList: true, subtree: true });\n });\n }\n\n if (this.internalOpen) {\n this.openAccordionItem();\n }\n }\n\n \n\n @Listen('keydown')\n handleKeydown(ev: KeyboardEvent) {\n const path = ev.composedPath();\n\n if(!path.includes(this.titleEl)) { \n return;\n }\n\n switch (ev.key) {\n case 'Enter': // fallthrough\n case ' ': // space\n ev.preventDefault();\n this.toggleOpen();\n break;\n }\n }\n\n\n render() {\n return (\n <div class={`accordion-item ${this.internalOpen ? 'open' : ''}`}>\n <div role=\"button\" aria-expanded={this.internalOpen} aria-controls=\"accordion-content\" class=\"accordion-title\" onClick={() => this.toggleOpen()} tabindex='0' ref={(el) => (this.titleEl = el as HTMLElement)}>\n <span aria-hidden=\"true\" role=\"heading\" aria-level={String(this.AriaLevel) as string} class=\"accordion-icon\">\n <ifx-icon icon=\"chevron-down-12\"/>\n </span>\n <span id=\"accordion-caption\" class=\"accordion-caption\">{this.caption}</span>\n </div>\n <div id=\"accordion-content\" class=\"accordion-content\" ref={(el) => (this.contentEl = el as HTMLElement)} role=\"region\" aria-labelledby=\"accordion-caption\">\n <div class=\"inner-content\">\n <slot onSlotchange={(e) => this.handleSlotChange(e)} />\n </div>\n </div>\n </div>\n );\n }\n}"],"version":3}
|
@@ -1,164 +0,0 @@
|
|
1
|
-
import { p as proxyCustomElement, H, h, d as Host } from './p-2cc378b8.js';
|
2
|
-
import { c as classNames } from './p-5cdc6210.js';
|
3
|
-
|
4
|
-
const buttonCss = ":root{font-family:\"Source Sans 3\", sans-serif}:host{vertical-align:bottom;display:inline-flex;width:var(--bw, fit-content)}.btn{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0px 16px;gap:8px;color:#FFFFFF;font-weight:600;border-radius:1px;line-height:1.5rem;font-family:\"Source Sans 3\";font-style:normal;text-decoration:none;user-select:none;font-size:1rem;transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;width:var(--bw, fit-content)}.btn:not(.disabled){cursor:pointer}.btn.disabled{pointer-events:none}.btn-default{color:#FFFFFF;background-color:#0A8276}.btn-default:disabled,.btn-default.disabled{background-color:#BFBBBB;color:#FFFFFF;pointer-events:none}.btn-secondary-default{background-color:#FFFFFF;color:#0A8276;border:1px solid #0A8276}.btn-secondary-default:disabled,.btn-secondary-default.disabled{background-color:#FFFFFF;border:1px solid #BFBBBB;color:#BFBBBB;pointer-events:none}.btn-tertiary-default{background-color:transparent;color:#0A8276}.btn-tertiary-default:disabled,.btn-tertiary-default.disabled{color:#BFBBBB;pointer-events:none}.btn-danger{color:#FFFFFF;background-color:#CD002F;border-color:#CD002F}.btn-danger:disabled,.btn-danger.disabled{background-color:#BFBBBB;color:#FFFFFF;pointer-events:none}.btn-secondary-danger{background-color:#FFFFFF;color:#CD002F;border:1px solid #CD002F}.btn-secondary-danger:disabled,.btn-secondary-danger.disabled{background-color:#FFFFFF;border:1px solid #BFBBBB;color:#BFBBBB;pointer-events:none}.btn-tertiary-danger{background-color:transparent;color:#CD002F}.btn-tertiary-danger:disabled,.btn-tertiary-danger.disabled{background-color:#FFFFFF;color:#BFBBBB;pointer-events:none}.btn-inverse{color:#0A8276;background-color:#FFFFFF}.btn-inverse:disabled,.btn-inverse.disabled{opacity:1;background-color:#FFFFFF;color:#0A8276;pointer-events:none}.btn-secondary-inverse{color:#FFFFFF;border:1px solid #FFFFFF}.btn-secondary-inverse:disabled,.btn-secondary-inverse.disabled{border:1px solid #FFFFFF;color:#FFFFFF;pointer-events:none}.btn-tertiary-inverse{color:#FFFFFF}.btn-tertiary-inverse:disabled,.btn-tertiary-inverse.disabled{color:#FFFFFF;opacity:1;pointer-events:none}.btn ifx-icon:empty{display:none}.btn.btn-xs{font-size:0.875rem;height:32px;line-height:1rem}.btn.btn-s{font-size:0.875rem;height:36px;line-height:1.25rem}.btn.btn-l{font-size:1.25rem;height:48px;line-height:1.75rem}.btn.btn-default:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-default:not(:disabled,.disabled):hover{background-color:#08665C}.btn.btn-default:not(:disabled,.disabled):active,.btn.btn-default:not(:disabled,.disabled).active{background-color:#06534B}.btn.btn-secondary-default:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-secondary-default:not(:disabled,.disabled):hover{color:#FFFFFF;background-color:#08665C}.btn.btn-secondary-default:not(:disabled,.disabled):active,.btn.btn-secondary-default:not(:disabled,.disabled).active{background-color:#06534B}.btn.btn-secondary:not(:disabled,.disabled):hover{background-color:#9C216E}.btn.btn-secondary:not(:disabled,.disabled):active,.btn.btn-secondary:not(:disabled,.disabled).active{background-color:#9C216E}.btn.btn-danger:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-danger:not(:disabled,.disabled):hover{background-color:#A2001E}.btn.btn-danger:not(:disabled,.disabled):active,.btn.btn-danger:not(:disabled,.disabled).active{background-color:#900021}.btn.btn-secondary-danger:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-secondary-danger:not(:disabled,.disabled):hover{color:#FFFFFF;background-color:#A2001E}.btn.btn-secondary-danger:not(:disabled,.disabled):active,.btn.btn-secondary-danger:not(:disabled,.disabled).active{background-color:#900021}.btn.btn-inverse:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #0A8276, 0 0 0 4px #FFFFFF}.btn.btn-inverse:not(:disabled,.disabled):hover{background-color:#EEEDED}.btn.btn-inverse:not(:disabled,.disabled):active,.btn.btn-inverse:not(:disabled,.disabled).active{background-color:#BFBBBB}.btn.btn-secondary-inverse:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #0A8276, 0 0 0 4px #FFFFFF}.btn.btn-secondary-inverse:not(:disabled,.disabled):hover{color:#0A8276;background-color:#EEEDED}.btn.btn-secondary-inverse:not(:disabled,.disabled):active,.btn.btn-secondary-inverse:not(:disabled,.disabled).active{color:#0A8276;background-color:#BFBBBB}.btn.btn-tertiary-default:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #08665C}.btn.btn-tertiary-default:not(:disabled,.disabled):hover{color:#08665C}.btn.btn-tertiary-default:not(:disabled,.disabled):active,.btn.btn-tertiary-default:not(:disabled,.disabled).active{color:#06534B}.btn.btn-tertiary-danger:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #A2001E}.btn.btn-tertiary-danger:not(:disabled,.disabled):hover{color:#A2001E}.btn.btn-tertiary-danger:not(:disabled,.disabled):active,.btn.btn-tertiary-danger:not(:disabled,.disabled).active{color:#900021}.btn.btn-tertiary-inverse:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #0A8276, 0 0 0 4px #FFFFFF}.btn.btn-tertiary-inverse:not(:disabled,.disabled):hover{color:#EEEDED}.btn.btn-tertiary-inverse:not(:disabled,.disabled):active,.btn.btn-tertiary-inverse:not(:disabled,.disabled).active{color:#BFBBBB}";
|
5
|
-
const IfxButtonStyle0 = buttonCss;
|
6
|
-
|
7
|
-
const Button = /*@__PURE__*/ proxyCustomElement(class Button extends H {
|
8
|
-
constructor() {
|
9
|
-
super();
|
10
|
-
this.__registerHost();
|
11
|
-
this.__attachShadow();
|
12
|
-
this.variant = 'primary';
|
13
|
-
this.theme = 'default';
|
14
|
-
this.size = 'm';
|
15
|
-
this.disabled = false;
|
16
|
-
this.target = '_self';
|
17
|
-
this.type = "button";
|
18
|
-
this.fullWidth = false;
|
19
|
-
this.handleClick = (ev) => {
|
20
|
-
if (this.el.shadowRoot) {
|
21
|
-
const parentForm = this.el.closest('form');
|
22
|
-
if (parentForm) {
|
23
|
-
ev.preventDefault();
|
24
|
-
if (this.type === 'reset') {
|
25
|
-
// If the button type is 'reset', manually reset all custom form fields
|
26
|
-
this.resetClickHandler(); //this will reset all ifx-text-fields within a form
|
27
|
-
}
|
28
|
-
else {
|
29
|
-
const fakeButton = document.createElement('button');
|
30
|
-
if (this.type) {
|
31
|
-
fakeButton.type = this.type;
|
32
|
-
}
|
33
|
-
fakeButton.style.display = 'none';
|
34
|
-
parentForm.appendChild(fakeButton);
|
35
|
-
fakeButton.click();
|
36
|
-
fakeButton.remove();
|
37
|
-
}
|
38
|
-
}
|
39
|
-
}
|
40
|
-
};
|
41
|
-
}
|
42
|
-
setInternalHref(newValue) {
|
43
|
-
this.internalHref = newValue;
|
44
|
-
}
|
45
|
-
async setFocus() {
|
46
|
-
this.focusableElement.focus();
|
47
|
-
}
|
48
|
-
insertNativeButton() {
|
49
|
-
this.nativeButton = document.createElement('button');
|
50
|
-
this.nativeButton.type = this.type;
|
51
|
-
this.nativeButton.style.display = 'none';
|
52
|
-
this.el.closest('form').appendChild(this.nativeButton);
|
53
|
-
}
|
54
|
-
handleFormAndInternalHref() {
|
55
|
-
if (this.el.closest('form')) {
|
56
|
-
if (this.el.href) {
|
57
|
-
this.el.internalHref = undefined;
|
58
|
-
}
|
59
|
-
this.insertNativeButton();
|
60
|
-
}
|
61
|
-
else {
|
62
|
-
this.internalHref = this.href;
|
63
|
-
}
|
64
|
-
}
|
65
|
-
handleButtonWidth() {
|
66
|
-
if (this.fullWidth) {
|
67
|
-
this.el.style.setProperty('--bw', '100%');
|
68
|
-
}
|
69
|
-
else {
|
70
|
-
this.el.style.setProperty('--bw', 'fit-content');
|
71
|
-
}
|
72
|
-
}
|
73
|
-
componentWillLoad() {
|
74
|
-
this.handleFormAndInternalHref();
|
75
|
-
}
|
76
|
-
componentWillRender() {
|
77
|
-
this.handleButtonWidth();
|
78
|
-
}
|
79
|
-
resetClickHandler() {
|
80
|
-
const formElement = this.el.closest('form');
|
81
|
-
const customElements = formElement.querySelectorAll('ifx-text-field, ifx-textarea');
|
82
|
-
customElements.forEach(element => {
|
83
|
-
element.reset();
|
84
|
-
});
|
85
|
-
}
|
86
|
-
handleKeyDown(ev) {
|
87
|
-
if (ev.key === " " || ev.key === 'Enter' && !this.disabled) {
|
88
|
-
this.focusableElement.click();
|
89
|
-
}
|
90
|
-
}
|
91
|
-
handleHostClick(event) {
|
92
|
-
if (this.disabled === true) {
|
93
|
-
event.stopImmediatePropagation();
|
94
|
-
}
|
95
|
-
}
|
96
|
-
handleFocus(event) {
|
97
|
-
if (this.disabled) {
|
98
|
-
event.preventDefault();
|
99
|
-
this.focusableElement.blur();
|
100
|
-
}
|
101
|
-
}
|
102
|
-
render() {
|
103
|
-
return (h(Host, { key: 'a220864c79a3eee88b277dd2277487581c7de8b0' }, h("a", { key: '4fd4cbd07205a0f538cf4d977a1b88d23d64be36', role: this.href ? 'link' : 'button', tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.focusableElement = el), class: this.getClassNames(), href: !this.disabled ? this.internalHref : undefined, target: this.target, onClick: this.handleClick, rel: this.target === '_blank' ? 'noopener noreferrer' : undefined, onFocus: (event) => this.handleFocus(event), "aria-disabled": this.disabled ? 'true' : null, "aria-describedby": this.theme === 'danger' ? 'Dangerous action' : undefined, "aria-label": this.ariaLabel || undefined }, h("slot", { key: 'f64f20c4b3d1af19c6276713aef4e230d7aaf0e3' }))));
|
104
|
-
}
|
105
|
-
getVariantClass() {
|
106
|
-
return `${this.variant}` === "secondary"
|
107
|
-
? `secondary-${this.theme}`
|
108
|
-
: `${this.variant}` === 'tertiary'
|
109
|
-
? `tertiary-${this.theme}`
|
110
|
-
: `${this.theme}`;
|
111
|
-
}
|
112
|
-
getSizeClass() {
|
113
|
-
if (`${this.size}` === "xs") {
|
114
|
-
return "xs";
|
115
|
-
}
|
116
|
-
else if (`${this.size}` === "s") {
|
117
|
-
return "s";
|
118
|
-
}
|
119
|
-
else if (`${this.size}` === "l") {
|
120
|
-
return "l";
|
121
|
-
}
|
122
|
-
else
|
123
|
-
return "";
|
124
|
-
}
|
125
|
-
getClassNames() {
|
126
|
-
return classNames('btn', this.size && `btn-${this.getSizeClass()}`, `btn-${this.getVariantClass()}`, this.disabled ? 'disabled' : '');
|
127
|
-
}
|
128
|
-
get el() { return this; }
|
129
|
-
static get watchers() { return {
|
130
|
-
"href": ["setInternalHref"]
|
131
|
-
}; }
|
132
|
-
static get style() { return IfxButtonStyle0; }
|
133
|
-
}, [1, "ifx-button", {
|
134
|
-
"variant": [1],
|
135
|
-
"theme": [1],
|
136
|
-
"size": [1],
|
137
|
-
"disabled": [4],
|
138
|
-
"href": [1],
|
139
|
-
"target": [1],
|
140
|
-
"type": [1],
|
141
|
-
"fullWidth": [4, "full-width"],
|
142
|
-
"ariaLabel": [1, "aria-label"],
|
143
|
-
"internalHref": [32],
|
144
|
-
"setFocus": [64]
|
145
|
-
}, [[0, "keydown", "handleKeyDown"], [2, "click", "handleHostClick"]], {
|
146
|
-
"href": ["setInternalHref"]
|
147
|
-
}]);
|
148
|
-
function defineCustomElement() {
|
149
|
-
if (typeof customElements === "undefined") {
|
150
|
-
return;
|
151
|
-
}
|
152
|
-
const components = ["ifx-button"];
|
153
|
-
components.forEach(tagName => { switch (tagName) {
|
154
|
-
case "ifx-button":
|
155
|
-
if (!customElements.get(tagName)) {
|
156
|
-
customElements.define(tagName, Button);
|
157
|
-
}
|
158
|
-
break;
|
159
|
-
} });
|
160
|
-
}
|
161
|
-
|
162
|
-
export { Button as B, defineCustomElement as d };
|
163
|
-
|
164
|
-
//# sourceMappingURL=p-cc9cb040.js.map
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as e,c as a,h as r,g as n}from"./p-e6edf72d.js";const i=':root{font-family:"Source Sans 3", sans-serif}.breadcrumb-item-label-container{display:flex;align-items:center;gap:8px;text-decoration:none;color:#1D1D1D}.breadcrumb-item-label-container.margin{margin-left:16px}.breadcrumb-item-label-container ifx-icon:empty{display:none}.breadcrumb-item-label-container .label-icon-wrapper{display:inline-flex}.breadcrumb-item-label-container .menu-icon-wrapper{display:flex;justify-content:center;align-items:center;width:16px;height:16px}.breadcrumb-item-label-container .menu-icon-wrapper.hide{display:none}.breadcrumb-item-label-container .menu-icon-wrapper ifx-icon{transition:0.3s}.breadcrumb-item-label-container .menu-icon-wrapper.show ifx-icon{transition:0.3s;transform:rotate(180deg)}';const c=i;const t=class{constructor(r){e(this,r);this.breadcrumbMenuIconWrapper=a(this,"breadcrumbMenuIconWrapper",7);this.target="_self"}componentDidLoad(){const e=this.el.shadowRoot.querySelector(".breadcrumb-item-label-container");const a=e.querySelector(".menu-icon-wrapper");this.breadcrumbMenuIconWrapper.emit(a)}render(){return r("a",{key:"856f06f931087b841e5f0350f1eb03e83b70e598",href:this.href,target:this.target,class:"breadcrumb-item-label-container",role:"link"},r("ifx-icon",{key:"b67ee6634bea1f1626e073c1cf4238d12e0e8902",icon:this.icon,"aria-hidden":"true"}),r("span",{key:"270394a637cc6dd822d74d47dcc0bce51e9455c5",class:"label-wrapper"},r("slot",{key:"a2c15ce4581d3323d52fe931706ed86f3a777e08"})),r("span",{key:"f013021b230b0a83a9fc1133d395f91c74cec4c4",class:"menu-icon-wrapper","aria-hiden":"true"},r("ifx-icon",{key:"b22c149f7cb47f43054ba7e7a2ca669a94f2d8bc",icon:"chevron-down-12"})))}get el(){return n(this)}};t.style=c;export{t as ifx_breadcrumb_item_label};
|
2
|
-
//# sourceMappingURL=p-0333c09a.entry.js.map
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as o,h as r}from"./p-e6edf72d.js";const e=':root{font-family:"Source Sans 3", sans-serif}:host{display:inline-block}.container{display:flex;min-height:1.25em;align-items:center;padding:0 8px;border-radius:9999px;font-family:"Source Sans 3"}.container.no-border{padding:0}.container.border-engineering-100{border:1px solid #F7F7F7}.container.border-engineering-200{border:1px solid #EEEDED}.container.border-engineering-300{border:1px solid #BFBBBB}.container.border-engineering-400{border:1px solid #8D8786}.container.border-engineering-500{border:1px solid #575352}.container.border-engineering-600{border:1px solid #3C3A39}.container.border-ocean-100{border:1px solid #DFF4F3}.container.border-ocean-200{border:1px solid #B8DEDA}.container.border-ocean-300{border:1px solid #6CB4AD}.container.border-ocean-400{border:1px solid #3B9B91}.container.border-ocean-500{border:1px solid #0A8276}.container.border-ocean-600{border:1px solid #08665C}.container.border-ocean-700{border:1px solid #06534B}.container.border-red-500{border:1px solid #CD002F}.container.border-red-600{border:1px solid #A2001E}.container.border-red-700{border:1px solid #900021}.container.border-orange-500{border:1px solid #E16B25}.container.border-green-500{border:1px solid #4CA460}.container.border-lawn-400{border:1px solid #B9D257}.container.border-lawn-500{border:1px solid #9BBA43}.container.border-lawn-700{border:1px solid #3C6C0F}.container.border-berry-400{border:1px solid #BE3283}.container.border-berry-500{border:1px solid #9C216E}.container.border-sun-400{border:1px solid #FF9737}.container.border-sun-500{border:1px solid #F97414}.container.border-sand-400{border:1px solid #FBE273}.container.border-sand-500{border:1px solid #FCD442}.text{margin:0;padding-left:4px;font-style:normal;font-weight:600;font-size:1rem;line-height:1.25rem;display:inline;color:#1D1D1D}.dot{display:inline-block;width:8px;height:8px;border-radius:9999px}.dot.engineering-100{background-color:#F7F7F7}.dot.engineering-200{background-color:#EEEDED}.dot.engineering-300{background-color:#BFBBBB}.dot.engineering-400{background-color:#8D8786}.dot.engineering-500{background-color:#575352}.dot.engineering-600{background-color:#3C3A39}.dot.ocean-100{background-color:#DFF4F3}.dot.ocean-200{background-color:#B8DEDA}.dot.ocean-300{background-color:#6CB4AD}.dot.ocean-400{background-color:#3B9B91}.dot.ocean-500{background-color:#0A8276}.dot.ocean-600{background-color:#08665C}.dot.ocean-700{background-color:#06534B}.dot.red-500{background-color:#CD002F}.dot.red-600{background-color:#A2001E}.dot.red-700{background-color:#900021}.dot.orange-500{background-color:#E16B25}.dot.green-500{background-color:#4CA460}.dot.lawn-400{background-color:#B9D257}.dot.lawn-500{background-color:#9BBA43}.dot.lawn-700{background-color:#3C6C0F}.dot.berry-400{background-color:#BE3283}.dot.berry-500{background-color:#9C216E}.dot.sun-400{background-color:#FF9737}.dot.sun-500{background-color:#F97414}.dot.sand-400{background-color:#FBE273}.dot.sand-500{background-color:#FCD442}';const n=e;const d=class{constructor(r){o(this,r);this.border=false;this.color="orange-500"}render(){var o;const e=((o=this.color)===null||o===void 0?void 0:o.trim())?this.color:"orange-500";const n=this.border?`container border-${e}`:"container no-border";return r("div",{key:"f613dcda2a1cdf86cb9169937a3674b1f8d985f7","aria-label":"a status indicator","aria-value":this.label,class:n},r("span",{key:"17792fd234e467d0396d00f6e244a5842d08e1ce",class:`dot ${e}`}),r("p",{key:"51261dabeec924c46a9a710c74de9bb7140bf927",class:"text"},this.label))}};d.style=n;export{d as ifx_status};
|
2
|
-
//# sourceMappingURL=p-05d332bd.entry.js.map
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as n,c as a,h as e,g as t}from"./p-e6edf72d.js";const r=':root{font-family:"Source Sans 3", sans-serif}:host{width:100%;display:block}.navbar__wrapper{font-family:"Source Sans 3";height:63px;position:sticky;z-index:1030;border-bottom:1px solid #EEEDED}.navbar__wrapper.fixed{border-bottom:none}.navbar__main-container{position:absolute;top:0;width:100%;transition:all 1s;z-index:1020}.navbar__main-container.fixed{position:fixed}.navbar__main-container.fixed .navbar__container{border-bottom:1px solid #EEEDED}.navbar__main-container.show{height:100vh;bottom:0;background-color:rgba(29, 29, 29, 0.2);transition:1s;z-index:1}.navbar__sidebar{box-sizing:border-box;position:fixed;right:-100%;top:64px;display:flex;flex-direction:column;align-items:flex-start;width:375px;height:calc(100vh - 64px);background-color:#FFFFFF;transition:right 1s;z-index:1030}.navbar__sidebar.show{right:0;transition:right 1s}.navbar__sidebar .navbar__sidebar-top-row{display:flex;padding:var(--borderRadius-none, 0px) var(--space-300, 24px) 30px var(--space-300, 24px);flex-direction:column;align-items:flex-start;gap:var(--space-200, 16px);flex:1 0 0;align-self:stretch;overflow-y:auto}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper{display:flex;padding-top:var(--space-200, 16px);flex-direction:column;align-items:flex-start;align-self:stretch;gap:16px}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper.expand{align-items:initial}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper .navbar__sidebar-top-row-item{display:flex;padding:var(--space-200, 0px) var(--space-50, 4px) var(--space-200, 0px) 0px;align-items:center;gap:var(--space-100, 8px);align-self:stretch;justify-content:space-between}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper .navbar__sidebar-top-row-item .navbar__sidebar-top-row-item-icon-wrapper ifx-icon{vertical-align:middle}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper .navbar__sidebar-top-row-item:hover{cursor:pointer}.navbar__sidebar .navbar__sidebar-top-row .navbar__sidebar-top-row-wrapper .navbar__sidebar-top-row-item .navbar__sidebar-top-row-item-label{color:var(--color-base-black, #1D1D1D);font-family:"Source Sans 3";font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__sidebar .navbar__sidebar-bottom-row{display:none;padding:var(--space-150, 12px) var(--space-300, 24px) var(--space-150, 12px) var(--space-200, 16px);flex-direction:column;align-items:flex-start;align-self:stretch;background:var(--color-engineering-100, #F7F7F7);border-top:1px solid var(--color-engineering-200, #EEEDED);gap:10px;max-height:160px;overflow-y:auto}.navbar__sidebar .navbar__sidebar-bottom-row.show{display:flex}.navbar__sidebar .navbar__sidebar-bottom-row .navbar__sidebar-bottom-row-item{display:flex;height:40px;padding-right:var(--space-50, 4px);align-items:center;gap:var(--space-100, 8px);flex:1 0 0}.navbar__sidebar .navbar__sidebar-bottom-row .navbar__sidebar-bottom-row-item .navbar__sidebar-bottom-row-item-label{color:var(--color-base-black, #1D1D1D);font-family:"Source Sans 3";font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__sidebar .navbar__sidebar-bottom-row .navbar__sidebar-bottom-row-item .navbar__sidebar-bottom-row-item-icon-wrapper{display:flex;align-items:center}.navbar__sidebar .navbar__sidebar-content-products,.navbar__sidebar .navbar__sidebar-content-main{display:flex;flex-direction:column;align-items:flex-start;padding:0px;gap:24px;flex:none;order:0;align-self:stretch;flex-grow:0}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-header,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-about-header,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-header,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-about-header{display:flex;flex-direction:row;align-items:center;padding:0px;gap:16px;flex:none;order:0;align-self:stretch;flex-grow:0;color:#BFBBBB}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-header span,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-about-header span,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-header span,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-about-header span{color:#1D1D1D;font-weight:600;font-size:18px;line-height:28px;display:flex;align-items:center}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu{display:flex;flex-direction:column;align-items:flex-start;padding:0px;gap:16px;flex:none;order:1;flex-grow:0;width:100%}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-products-menu-item,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-products-menu-item,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-products-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-products-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item{display:flex;flex-direction:row;align-items:center;padding:0px;flex:none;order:0;flex-grow:0}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-products-menu-item a,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-products-menu-item a,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-products-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-products-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item a{text-decoration:none;font-style:normal;font-weight:400;font-size:16px;line-height:24px;display:flex;align-items:center;color:#1D1D1D}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item{color:#BFBBBB}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-products-menu .navbar__sidebar-content-main-menu-item a,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu .navbar__sidebar-content-main-menu-item a{font-style:normal;font-weight:600;font-size:18px;line-height:28px;display:flex;align-items:center;color:#1D1D1D;flex:none;order:0;flex-grow:1}.navbar__sidebar .navbar__sidebar-content-products .navbar__sidebar-content-main-menu,.navbar__sidebar .navbar__sidebar-content-main .navbar__sidebar-content-main-menu{align-items:normal}.navbar__container{display:flex;justify-content:space-between;align-items:center;padding:8px 40px;gap:16px;background-color:#FFFFFF;font-family:"Source Sans 3"}.navbar__container.expanded{justify-content:initial}.navbar__container .navbar__container-search-field-wrapper{display:none}.navbar__container .navbar__container-search-field-wrapper.show{display:flex}.navbar__container .navbar__container-left{display:flex;flex-direction:row;align-items:center;padding:0;gap:16px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-left.hide{display:none}.navbar__container .navbar__container-left.expand{justify-content:initial;flex:1}.navbar__container .navbar__container-left.expand .navbar__container-left-content{align-items:initial;flex:1}.navbar__container .navbar__container-left.expand .navbar__container-left-content .navbar__container-left-content-navigation-group{justify-content:initial;flex:1}.navbar__container .navbar__container-left.expand .navbar__container-left-content .navbar__container-left-content-navigation-group .navbar__container-left-content-navigation-item-search-bar{flex:1}.navbar__container .navbar__container-left .navbar__container-left-logo{display:flex;flex-direction:row;align-items:center;padding:0px;gap:16px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-logo.hide{display:none}.navbar__container .navbar__container-left .navbar__container-left-logo h6{position:relative;margin:0;padding:0;font-style:normal;font-weight:600;font-size:16px;display:flex;align-items:center;color:#1D1D1D;flex:none;order:1;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-logo .navbar__container-left-logo-default{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:12px 0px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-logo .navbar__container-left-logo-default svg{width:91px;height:40px;flex:none;order:0;flex-grow:0;vertical-align:bottom}.navbar__container .navbar__container-left .navbar__container-left-logo .navbar__container-left-logo-divider{width:1px;height:32px;background:#EEEDED;flex:none;order:2;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-content{display:flex;flex-direction:row;justify-content:center;align-items:flex-start;padding:0px;flex:none;order:1;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-content .navbar__container-left-content-navigation-group{display:flex;flex-direction:row;align-items:center;padding:0px;gap:4px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-content .navbar__container-left-content-navigation-group .navbar__container-left-content-navigation-item-search-bar{display:flex;flex-direction:row;align-items:center;padding:0px 8px;flex:none;order:5;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-content .navbar__container-left-content-navigation-group .navbar__container-left-content-navigation-item{display:flex;flex-direction:row;align-items:center;padding:0px 8px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-left .navbar__container-left-content .navbar__container-left-content-navigation-group .navbar__container-left-content-navigation-item a{display:flex;align-items:center;font-weight:400;font-size:16px;line-height:24px;color:#1D1D1D;text-decoration:none;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;padding:0;gap:8px;flex:none;order:1;flex-grow:0}.navbar__container .navbar__container-right.hide{display:none}.navbar__container .navbar__container-right.expand{justify-content:initial;flex:1}.navbar__container .navbar__container-right.expand .navbar__container-right-content{align-items:initial;flex:1}.navbar__container .navbar__container-right.expand .navbar__container-right-content .navbar__container-right-content-navigation-group{justify-content:initial;flex:1}.navbar__container .navbar__container-right.expand .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar{flex:1}.navbar__container .navbar__container-right.expand .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-search-bar-icon-wrapper{flex:1}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:4px 0px 4px 16px;border-left:1px solid #BFBBBB;gap:16px;flex:none;order:1;flex-grow:0;width:41px;height:40px}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper.hide{display:none}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__burger-icon{display:flex;align-items:center}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__burger-icon:hover{cursor:pointer}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__burger-icon.close{display:none}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__cross-icon{display:none;align-items:center}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__cross-icon.show{display:flex}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper .navbar__cross-icon.show:hover{cursor:pointer}.navbar__container .navbar__container-right .navbar__container-right-content{display:flex;flex-direction:column;align-items:flex-start;padding:0px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group{position:relative;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;padding:0px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar{display:flex;flex-direction:row;align-items:center;padding:0px 8px;gap:4px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item .navbar__container-right-content-navigation-item-search-bar-icon-wrapper,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile .navbar__container-right-content-navigation-item-search-bar-icon-wrapper,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-search-bar-icon-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item .navbar__container-right-content-navigation-item-search-bar-icon-wrapper.isOpen,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile .navbar__container-right-content-navigation-item-search-bar-icon-wrapper.isOpen,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-search-bar-icon-wrapper.isOpen{position:absolute;top:10px}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item .navbar__container-right-content-navigation-item-navigation-profile,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile .navbar__container-right-content-navigation-item-navigation-profile,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-navigation-profile{position:relative;width:24px;height:24px;background:#0A8276;border-radius:100px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item .navbar__container-right-content-navigation-item-navigation-profile a,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile .navbar__container-right-content-navigation-item-navigation-profile a,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-navigation-profile a{position:absolute;width:22px;height:20px;left:calc(50% - 11px);top:calc(50% - 10px);font-style:normal;font-weight:600;font-size:14px;line-height:20px;text-decoration:none;display:flex;align-items:center;justify-content:center;text-align:center;color:#FFFFFF}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item .navbar__container-right-content-navigation-item-icon-wrapper,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile .navbar__container-right-content-navigation-item-icon-wrapper,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar .navbar__container-right-content-navigation-item-icon-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item a,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-profile a,.navbar__container .navbar__container-right .navbar__container-right-content .navbar__container-right-content-navigation-group .navbar__container-right-content-navigation-item-search-bar a{font-style:normal;font-weight:400;font-size:14px;line-height:20px;color:#1D1D1D;text-decoration:none;display:flex;align-items:center;flex:none;order:1;flex-grow:0}@media screen and (max-width: 800px){.navbar__container{padding:0px 16px;height:64px;gap:initial}.navbar__container.expanded .navbar__container-right .navbar__burger-icon-wrapper{display:none}.navbar__container .navbar__container-left .navbar__container-left-content{display:none}.navbar__container .navbar__container-left .navbar__container-left-logo .navbar__container-left-logo-divider{display:none}.navbar__container .navbar__container-right{flex:1}.navbar__sidebar{width:0;transition:1s}}@media screen and (max-width: 500px){.navbar__sidebar.show{width:100%}}@media screen and (min-width: 500px){.navbar__sidebar.show{width:50%}}@media screen and (min-width: 800px){.navbar__wrapper{height:63px}.navbar__container{padding:0px 16px;height:63px;gap:initial}.navbar__container .navbar__container-right .navbar__burger-icon-wrapper{display:none}.navbar__main-container.show{height:auto;background-color:inherit;transition:none}.navbar__sidebar{width:0;transition:1s}.navbar__sidebar.show{right:-100%}}@media screen and (min-width: 1024px){.navbar__wrapper{height:72px}.navbar__container{padding:0px 24px;height:72px}.navbar__container .navbar__container-left{gap:12px;display:flex}.navbar__container .navbar__container-left .navbar__container-left-content{display:flex}.navbar__container .navbar__container-left .navbar__container-left-logo-default svg{width:72.8px;height:32px}.navbar__main-container.show{height:auto;background-color:inherit;transition:none}}@media screen and (min-width: 1200px){.navbar__wrapper{height:80px}.navbar__container{padding:0px 32px;height:80px}.navbar__container .navbar__container-left .navbar__container-left-content{justify-content:inherit}.navbar__container .navbar__container-right .navbar__container-right-content{justify-content:inherit}}@media screen and (min-width: 1440px){.navbar__wrapper{height:80px}.navbar__container{padding:0px 40px;height:80px}.navbar__container .navbar__container-left .navbar__container-left-content{justify-content:center}.navbar__container .navbar__container-right .navbar__container-right-content{justify-content:inherit}}';const i=r;const o=class{constructor(e){n(this,e);this.ifxNavbarMobileMenuIsOpen=a(this,"ifxNavbarMobileMenuIsOpen",7);this.main=true;this.products=false;this.applications=false;this.design=false;this.support=false;this.about=false;this.applicationName="";this.hasLeftMenuItems=true;this.fixed=true;this.showLogoAndAppname=true;this.logoHref="";this.internalLogoHref="";this.logoHrefTarget="_self";this.internalLogoHrefTarget="_self"}addEventListenersToHandleCustomFocusState(){const n=this.el.shadowRoot.firstChild;if(!n){console.error("element not found");return}n.tabIndex=-1;const a=n.querySelectorAll("a");for(let n=0;n<a.length;n++){a[n].tabIndex=-1}const e=n.querySelector("slot");if(e){const n=e.assignedNodes();for(let a=0;a<n.length;a++){const e=n[a];if(e.nodeName==="IFX-NAVBAR-ITEM"){const n=e;const a=n===null||n===void 0?void 0:n.shadowRoot.querySelectorAll("a");for(let n=0;n<a.length;n++){a[n].tabIndex=-1}}}}}clearFirstLayerMenu(n){if(n.detail.action==="hideFirstLayer"){const a=this.getMobileMenuTop();for(let e=0;e<a.length;e++){if(!a[e].isSameNode(n.detail.component)){a[e].hideComponent()}}}if(n.detail.action==="hideSecondLayer"){const a=n.detail.parent;const e=a.children;a.toggleFirstLayerItem("remove","add");for(let a=0;a<e.length;a++){if(!e[a].isSameNode(n.detail.component)){e[a].hideComponent()}}}if(n.detail.action==="returnToSecondLayer"){const a=n.detail.parent;const e=a.children;a.toggleFirstLayerItem("add","remove");for(let a=0;a<e.length;a++){if(!e[a].isSameNode(n.detail.component)){e[a].showComponent()}}}if(n.detail.action==="show"){const a=this.el.querySelectorAll('[slot="left-item"]');for(let e=0;e<a.length;e++){if(!a[e].isSameNode(n.detail.component)){a[e].showComponent()}}}if(n.detail.action==="return"){const a=this.getMobileMenuTop();for(let e=0;e<a.length;e++){if(!a[e].isSameNode(n.detail.component)){a[e].showComponent()}}}}getWrappers(){const n=this.el.shadowRoot.querySelector(".navbar__container-right-content-navigation-group");const a=this.el.shadowRoot.querySelector(".navbar__container-right-content-navigation-item-search-bar-icon-wrapper");const e=this.el.shadowRoot.querySelector(".navbar__container-left-content-navigation-item-search-bar");const t=n.querySelector('slot[name="right-item"]');const r=a.querySelector("slot");const i=e.querySelector("slot");const o=r.assignedNodes();const _=i.assignedNodes();const c=this.el.querySelector("ifx-navbar-profile");const b=this.el.querySelectorAll('[slot="left-item"]');const s=this.el.querySelectorAll('[slot="right-item"]');const d=this.el.shadowRoot.querySelector(".navbar__sidebar-top-row-wrapper");return{rightSideItemSlot:t,rightSideSlot:r,leftSideSlot:i,rightAssignedNodes:o,leftAssignedNodes:_,navbarProfile:c,leftMenuItems:b,rightMenuItems:s,topRowWrapper:d}}hideNavItems(){const{rightAssignedNodes:n,leftAssignedNodes:a,navbarProfile:e,leftMenuItems:t,rightMenuItems:r,topRowWrapper:i}=this.getWrappers();if(n.length!==0){this.searchBarIsOpen="right"}else if(a.length!==0){this.searchBarIsOpen="left"}if(e){e.hideComponent()}for(let n=0;n<t.length;n++){if(!i.classList.contains("expand")){t[n].hideComponent()}}for(let n=0;n<r.length;n++){if(i.classList.contains("expand")){if(!r[n].hideOnMobile){r[n].hideComponent()}}else{r[n].hideComponent()}}}showNavItems(){const{navbarProfile:n,leftMenuItems:a,rightMenuItems:e,topRowWrapper:t}=this.getWrappers();this.searchBarIsOpen=undefined;if(n){n.showComponent()}for(let n=0;n<a.length;n++){if(!t.classList.contains("expand")){a[n].showComponent()}}for(let n=0;n<e.length;n++){if(t.classList.contains("expand")){if(!e[n].hideOnMobile){e[n].showComponent()}}else{e[n].showComponent()}}}handleSearchBarToggle(n){if(n.detail){this.hideNavItems()}else if(!n.detail){this.showNavItems()}}toggleClass(n,a){n.classList.toggle(a)}handleSidebar(n){const a=n.currentTarget.closest(".navbar__burger-icon-wrapper");const e=a.querySelector(".navbar__burger-icon");const t=a.querySelector(".navbar__cross-icon");const r=n.currentTarget.closest(".navbar__main-container");const i=n.currentTarget.closest(".navbar__wrapper");const o=i.querySelector(".navbar__sidebar");this.toggleClass(i,"show");this.toggleClass(r,"show");this.toggleClass(o,"show");this.toggleClass(e,"close");this.toggleClass(t,"show");if(t.classList.contains("show")){this.handleBodyScroll("hide")}else{this.handleBodyScroll("show")}}handleBodyScroll(n){const a=this.el.closest("body");if(!this.fixed&&n==="hide"){a.style.overflow="hidden"}else if(n==="show"){a.style.overflow="visible"}}handleDropdownMenu(n){const a=n.currentTarget.querySelector(".navbar__dropdown-wrapper");a.classList.toggle("open");const e=n.currentTarget.querySelector("a");e.classList.toggle("open")}async setItemMenuPosition(){const n=this.el.querySelectorAll("ifx-navbar-item");const a=this.el.querySelector("ifx-navbar-profile");if(a){const n=a.querySelectorAll("ifx-navbar-item");if(n.length!==0){n.forEach((n=>{n.setMenuItemPosition();this.setMenuItemChildrenPosition(n)}))}}if(n.length!==0){for(let a=0;a<n.length;a++){const e=n[a];const t=e.querySelectorAll("ifx-navbar-item");if(t.length!==0){const n=await e.setItemSideSpecifications();if(n){t.forEach((n=>{n.setMenuItemPosition();this.setMenuItemChildrenPosition(n)}))}}}}}setMenuItemChildrenPosition(n){const a=n.querySelectorAll("ifx-navbar-item");if(a.length!==0){a.forEach((n=>{n.setMenuItemPosition();this.setMenuItemChildrenPosition(n)}))}}getMediaQueryList(){const n=window.matchMedia("(max-width: 800px)");return n}componentDidLoad(){this.setItemMenuPosition();this.addEventListenersToHandleCustomFocusState();const n=this.getMediaQueryList();if(n.matches){this.moveNavItemsToSidebar()}}handleMobileMenuBottom(n){const a=this.el.shadowRoot.querySelector(".navbar__sidebar-bottom-row");const e=n.target;const t=e.assignedNodes();if(t.length>0){a.classList.add("show")}else{a.classList.remove("show")}}handleLogoHrefAndTarget(){if(this.logoHref.trim()===""){this.internalLogoHref=undefined}else{this.internalLogoHref=this.logoHref}if(["_self","_blank","_parent"].includes(this.logoHrefTarget.trim())){this.internalLogoHrefTarget=this.logoHrefTarget}else{this.internalLogoHrefTarget="_self"}}componentWillLoad(){this.RemoveSpaceOnStorybookSnippet();const n=this.el.querySelector("ifx-navbar-menu");const a=this.el.querySelectorAll('[slot="left-item"]');if(!a.length&&!n){this.hasLeftMenuItems=false}this.handleLogoHrefAndTarget();const e=window.matchMedia("(max-width: 800px)");e.addEventListener("change",(n=>this.moveNavItemsToSidebar(n)))}getSearchBarLeftWrapper(){const n=this.el.shadowRoot.querySelector(".navbar__container-left-content-navigation-item-search-bar");return n}getMobileMenuTop(){const n=this.el.querySelectorAll('[slot="mobile-menu-top"]');return n}getMobileMenuBottom(){const n=this.el.querySelectorAll('[slot="mobile-menu-bottom"]');return n}handleBurgerIcon(){const n=this.getMobileMenuTop();const a=this.getMobileMenuBottom();if(!n.length&&!a.length){const n=this.el.shadowRoot.querySelector(".navbar__burger-icon-wrapper");this.toggleClass(n,"hide")}}moveNavItemsToSidebar(n){const a=this.el.shadowRoot.querySelector(".navbar__sidebar-top-row-wrapper");const e=this.getMediaQueryList();const t=n?n.matches:e.matches;if(t){a.classList.add("expand");const n=this.el.shadowRoot.querySelector(".navbar__cross-icon");if(n.classList.contains("show")){this.handleBodyScroll("hide")}const e=this.el.querySelector('[slot="search-bar-left"]');if(e){if(this.searchBarIsOpen){e.onNavbarMobile()}const n=this.getSearchBarLeftWrapper();n.classList.add("initial");e.setAttribute("slot","search-bar-right")}const t=this.el.querySelectorAll('[slot="left-item"]');for(let n=0;n<t.length;n++){t[n].setAttribute("slot","mobile-menu-top");t[n].moveChildComponentsIntoSubLayerMenu();if(this.searchBarIsOpen){t[n].showComponent()}}const r=this.el.querySelectorAll('[slot="right-item"]');for(let n=0;n<r.length;n++){if(r[n].tagName.toUpperCase()==="IFX-NAVBAR-PROFILE"){r[n].showLabel=false}else{if(r[n].hideOnMobile){r[n].setAttribute("slot","mobile-menu-bottom");r[n].toggleChildren("add");r[n].showLabel=true;if(this.searchBarIsOpen){r[n].showComponent()}}}}this.handleBurgerIcon()}else{a.classList.remove("expand");this.handleBodyScroll("show");const n=this.getSearchBarLeftWrapper();const e=n.classList.contains("initial");const t=this.el.querySelector('[slot="search-bar-right"]');if(e){if(this.searchBarIsOpen){t.onNavbarMobile()}if(t){t.setAttribute("slot","search-bar-left")}}const r=this.getMobileMenuTop();for(let n=0;n<r.length;n++){r[n].setAttribute("slot","left-item");r[n].moveChildComponentsBackIntoNavbar()}const i=this.getMobileMenuBottom();const o=this.el.querySelector("ifx-navbar-profile");if(o){const n=o.getAttribute("show-label");o.setAttribute("show-label",n)}for(let n=0;n<i.length;n++){i[n].setAttribute("slot","right-item");i[n].toggleChildren("remove");const a=i[n].getAttribute("show-label");i[n].setAttribute("show-label",a);if(this.searchBarIsOpen){i[n].hideComponent()}}}}RemoveSpaceOnStorybookSnippet(){let n=this.el.parentElement;if(n){let a=n.closest(".css-xzp052");if(a){a.style.overflow="visible"}}}render(){return e("div",{key:"ebe2eeecbea3013d177c533021ac0960ac3085fc","aria-label":"a navigation navbar",class:`navbar__wrapper ${this.fixed?"fixed":""}`},e("div",{key:"84f86c0889c46318e952e848d42322374895da61",class:`navbar__main-container ${this.fixed?"fixed":""}`},e("div",{key:"41b11914d6b1a4b42182004d75a692374f04e4bd",class:`navbar__container ${this.searchBarIsOpen?"expanded":""}`},e("div",{key:"959a9428b0dd35c5b7ced16d104e4dbde6194f3a",class:`navbar__container-left ${this.searchBarIsOpen==="left"?"expand":this.searchBarIsOpen==="right"?"hide":""}`},this.showLogoAndAppname&&e("div",{key:"984ad3b24724faf14feb2efd3cd45a60e3e9e4bf",class:`navbar__container-left-logo ${this.searchBarIsOpen==="left"?"hide":""}`},e("div",{key:"4cf4b27551abeeb994cf30fdcc5f84da9429e3c2",class:"navbar__container-left-logo-default"},e("a",{key:"460c320de332c2f50f602db197bdd049d6011907",href:this.internalLogoHref,target:this.internalLogoHrefTarget},e("svg",{key:"38531c396a5b9d30e702997ab6695c7ec81b3acd",width:"91",height:"40",viewBox:"0 0 91 40",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e("g",{key:"1e5db78b4c2244bdd78b926c13261654fc4a9875","clip-path":"url(#clip0_2396_2480)"},e("path",{key:"844312d5b32d059d930c000e7c8f207527feaeed",d:"M67.691 26.7766C71.0884 26.7766 72.1461 23.1841 72.1461 19.8802C72.1461 15.4536 70.2871 13.1441 67.691 13.1441C64.4219 13.1441 63.2681 16.7367 63.3001 19.9443C63.3322 23.1199 64.2296 26.7766 67.691 26.7766ZM66.0244 19.8481C66.0244 18.533 66.0244 15.4536 67.691 15.4536C69.4859 15.4536 69.4218 18.5009 69.4218 19.9123C69.4218 21.2595 69.4218 24.5313 67.7551 24.5313C65.9603 24.4992 66.0244 21.2274 66.0244 19.8481ZM57.8195 26.7766C59.1976 26.7766 60.3835 26.2313 61.5053 25.0445L60.5117 23.1841C59.7425 24.018 58.9733 24.4671 58.0438 24.4671C57.2746 24.4671 56.6336 24.018 56.249 23.2482C55.9285 22.5746 55.8644 21.8048 55.8644 20.9708V20.7142H61.6335V20.1368C61.6335 17.282 61.2809 15.7102 60.3835 14.5234C59.7104 13.6253 58.7169 13.1441 57.499 13.1441C56.2169 13.1441 55.1593 13.7215 54.39 14.8442C53.5567 16.0631 53.2042 17.699 53.2042 19.9443C53.1721 24.2426 54.8708 26.7766 57.8195 26.7766ZM57.531 15.2612C58.172 15.2612 58.5566 15.614 58.813 16.1914C59.0053 16.7046 59.1015 17.5707 59.1015 18.5971H55.8644C55.8964 16.3197 56.3772 15.2612 57.531 15.2612ZM74.2614 26.4559H76.7614V16.8329C77.3703 16.0952 78.0754 15.6782 78.5882 15.6782C78.9087 15.6782 79.2292 15.7423 79.4215 15.9989C79.6138 16.2876 79.71 16.7046 79.71 17.699V26.4559H82.21V16.5442C82.21 15.6782 82.1138 14.8121 81.601 14.1706C81.1523 13.5932 80.4472 13.2404 79.5497 13.2404C78.3959 13.2404 77.2101 13.914 76.569 14.6838C76.537 14.0102 76.3126 13.3687 76.2485 13.1441L73.9089 13.7536C74.0371 14.4593 74.2294 15.3253 74.2294 16.8971V26.4559H74.2614ZM45.2236 14.6838C45.1915 14.0102 44.9672 13.3687 44.9031 13.1441L42.5634 13.7536C42.6916 14.4593 42.8839 15.3253 42.8839 16.8971V26.4238H45.3838V16.8008C45.9928 16.0631 46.6979 15.6461 47.2107 15.6461C47.5312 15.6461 47.8517 15.7102 48.044 15.9669C48.2363 16.2555 48.3325 16.6725 48.3325 17.6669V26.4238H50.8324V16.5442C50.8324 15.6782 50.7363 14.8121 50.2235 14.1706C49.7748 13.5932 49.0696 13.2404 48.1722 13.2404C47.0505 13.2404 45.8646 13.914 45.2236 14.6838ZM14.6473 9.07042C16.1216 9.07042 17.3075 7.88359 17.3075 6.40807C17.3075 4.93256 16.1216 3.74573 14.6473 3.74573C13.173 3.74573 11.9871 4.93256 11.9871 6.40807C11.9871 7.88359 13.173 9.07042 14.6473 9.07042ZM26.9227 26.4559V16.5442C26.9227 15.6782 26.8265 14.8121 26.3137 14.1706C25.865 13.5932 25.1599 13.2404 24.2625 13.2404C23.1087 13.2404 21.9228 13.914 21.2818 14.6838C21.2497 14.0102 21.0254 13.3687 20.9613 13.1441L18.6536 13.7857C18.7818 14.4913 18.9741 15.3574 18.9741 16.9291V26.4559H21.4741V16.8329C22.0831 16.0952 22.7882 15.6782 23.301 15.6782C23.6215 15.6782 23.942 15.7423 24.1343 15.9989C24.3266 16.2876 24.4227 16.7046 24.4227 17.699V26.4559H26.9227ZM38.4289 8.36474C37.4994 8.36474 36.7622 9.10249 36.7622 10.0327C36.7622 10.9629 37.4994 11.7007 38.3968 11.7007C39.3263 11.7007 40.0634 10.9629 40.0634 10.0327C40.0634 9.10249 39.3263 8.36474 38.4289 8.36474ZM13.4614 26.4559H15.9614V10.8346L13.4614 11.1554V26.4559ZM33.8777 9.90441C34.3264 9.90441 34.7751 10.0648 35.0635 10.2893L35.7687 8.33266C35.0956 7.85151 34.3584 7.62698 33.429 7.62698C32.788 7.62698 32.1149 7.78736 31.5059 8.26851C30.897 8.78173 30.256 9.80818 30.256 11.7328C30.256 12.5667 30.288 13.4328 30.288 13.4328H29.4226V15.6461H30.288V26.4238H32.8521V15.6782H34.743L35.2238 13.4649H32.8841V11.4762C32.8841 10.5139 33.2687 9.90441 33.8777 9.90441ZM37.1468 26.4559H39.6788V13.2404L37.1468 13.5611V26.4559Z",fill:"#005DA9"}),e("path",{key:"cb619f03091deacfa620b306010f5b82bb1ddc31",d:"M77.0816 33.5126C68.6203 36.0146 58.3321 37.1052 48.2682 37.1052C22.7239 37.1052 6.24986 29.5993 5.09604 19.6877C4.67938 15.9668 7.59599 12.3422 12.4677 9.26285C11.6023 8.62132 11.0575 7.59488 11.0254 6.44012C3.97427 10.161 0 15.0366 0 19.9764C0 30.9145 19.5188 40.1525 48.5246 39.7676C58.6205 39.6393 67.0498 38.1958 74.6778 35.6939C83.7482 32.7428 89.4532 28.5087 90.8313 26.6483C89.1968 28.1238 85.3186 31.0748 77.0816 33.5126ZM23.2687 4.38723C24.9674 3.80985 27.3712 3.0721 27.3712 3.0721C34.1339 1.21166 41.6017 0.121063 48.5566 0.185215C40.544 -0.295931 33.2365 0.185215 26.8584 1.33997C26.8584 1.33997 24.743 1.69281 22.4675 2.27018C22.4675 2.27018 21.3777 2.55887 20.7047 2.75133C20.0316 2.94379 19.1021 3.2004 19.1021 3.2004C18.4611 3.39286 17.8201 3.6174 17.1791 3.84193C17.8201 4.48346 18.2047 5.31745 18.2368 6.27974C19.3586 5.76652 21.5059 4.99668 23.2687 4.38723Z",fill:"#E30034"})),e("defs",{key:"ff566637ca083691d93e0bc7e262685f431bb30c"},e("clipPath",{key:"b253c1ed08e4ba91fcd6d61e29e4e188a90c8693",id:"clip0_2396_2480"},e("rect",{key:"b0d5f2ae4d10517a24177a3c5a98d565789f850c",width:"91",height:"40",fill:"white"})))))),this.applicationName&&e("h6",{key:"f9562f459a71bfaa9cbba66d027f70e5b68471fd"},this.applicationName),this.applicationName&&this.hasLeftMenuItems&&e("div",{key:"8cd99655ece3b7539aa25a016eb53d9c153e69da",class:"navbar__container-left-logo-divider"})),e("div",{key:"e8243b7b512ddca9cc0d7385e848ea4814093ec2",class:"navbar__container-left-content"},e("div",{key:"af3ec5e7fcfb3406440172c15eff04867bd223f8",class:"navbar__container-left-content-navigation-group"},e("slot",{key:"748183bf5e86c5b47a8aa1ed9f926997a43bf5d5",name:"left-item"}),e("div",{key:"0cac8556d3e25afe66f25cfe188fa89d74889839",class:"navbar__container-left-content-navigation-item-search-bar"},e("slot",{key:"b65b4f11b4f46569419415d7049bcb46e92b94ee",name:"search-bar-left"}))))),e("div",{key:"3ae39c3c0666545c99a52279c983e033009eb2b0",class:`navbar__container-right ${this.searchBarIsOpen==="right"?"expand":this.searchBarIsOpen==="left"?"hide":""}`},e("div",{key:"b628a1d626e1d85a6d6c44a4e29cfafadfc8bff2",class:"navbar__container-right-content"},e("div",{key:"551c29917faa0e29d32817c01a3cd7807edf7516",class:"navbar__container-right-content-navigation-group"},e("div",{key:"387dc47d641c112d4a4e33055009869e26a6ec2f",class:"navbar__container-right-content-navigation-item-search-bar"},e("div",{key:"fd96d6469098bcc901a21d465ca6e274b5c21020",class:`navbar__container-right-content-navigation-item-search-bar-icon-wrapper`},e("slot",{key:"6019858f33f706102813f6aed03d4cf65c53c1e1",name:"search-bar-right"}))),e("slot",{key:"259c995dcdd4e01855ead5b7378dfd908d64f5a7",name:"right-item"}))),e("div",{key:"1548f02afdb0f23a11ebe186f7c268cb9dae7cfe",class:`navbar__burger-icon-wrapper`,onClick:this.handleSidebar.bind(this)},e("div",{key:"ac96ec019e35b4f5a4f213c6dfcf43df31e7c2eb",class:"navbar__burger-icon"},e("ifx-icon",{key:"c4f5886f05f1bdf7fa5bf12acaab33f901a61b03",icon:"menu-right-24"})),e("div",{key:"beb20352ed0cca5cb113defdf74aecc67b3102fe",class:"navbar__cross-icon"},e("ifx-icon",{key:"717c3ed448ff923c4ee2767d78686ea2a7069304",icon:"cross-24"})))))),e("div",{key:"f38c13d8ee2aac9868ffd8e166c5c055b1bb0d4a",class:"navbar__sidebar"},e("div",{key:"d6fd04c344bd04b97bcb138a0de0a2c2372805e7",class:"navbar__sidebar-top-row"},e("div",{key:"fa4b6b3bdfe0b6ecd54bf1f794569a402139ec55",class:"navbar__sidebar-top-row-wrapper"},e("slot",{key:"c5f43dd26b32514a60a09e72b250c29636097ba3",name:"mobile-menu-top"}))),e("div",{key:"406df55dbd93bb7f2000089d9ecbf7adc157f148",class:"navbar__sidebar-bottom-row"},e("slot",{key:"600291cc2d9ce2b4debd6f60b249755efebf8727",name:"mobile-menu-bottom",onSlotchange:n=>this.handleMobileMenuBottom(n)}))))}get el(){return t(this)}};o.style=i;export{o as ifx_navbar};
|
2
|
-
//# sourceMappingURL=p-080456bc.entry.js.map
|