@ukic/web-components 3.3.0 → 3.4.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/core.cjs.js +1 -1
- package/dist/cjs/ic-accordion.cjs.entry.js +9 -7
- package/dist/cjs/ic-accordion.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-alert.cjs.entry.js +1 -1
- package/dist/cjs/ic-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-breadcrumb-group.cjs.entry.js +2 -2
- package/dist/cjs/ic-breadcrumb.cjs.entry.js +2 -2
- package/dist/cjs/ic-button_3.cjs.entry.js +8 -8
- package/dist/cjs/ic-button_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-card-vertical.cjs.entry.js +1 -1
- package/dist/cjs/ic-card-vertical.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-checkbox-group.cjs.entry.js +2 -2
- package/dist/cjs/ic-checkbox.cjs.entry.js +7 -12
- package/dist/cjs/ic-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-data-list.cjs.entry.js +2 -2
- package/dist/cjs/ic-data-row.cjs.entry.js +2 -2
- package/dist/cjs/ic-dialog.cjs.entry.js +1 -1
- package/dist/cjs/ic-empty-state.cjs.entry.js +2 -2
- package/dist/cjs/ic-footer-link.cjs.entry.js +2 -2
- package/dist/cjs/ic-hero.cjs.entry.js +6 -5
- package/dist/cjs/ic-hero.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-horizontal-scroll.cjs.entry.js +5 -5
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js +22 -21
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-input-label_2.cjs.entry.js +7 -7
- package/dist/cjs/ic-link.cjs.entry.js +11 -21
- package/dist/cjs/ic-link.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-menu-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-navigation-group.cjs.entry.js +115 -163
- package/dist/cjs/ic-navigation-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-item.cjs.entry.js +64 -61
- package/dist/cjs/ic-navigation-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-menu.cjs.entry.js +4 -4
- package/dist/cjs/ic-page-header.cjs.entry.js +6 -6
- package/dist/cjs/ic-pagination-item.cjs.entry.js +1 -1
- package/dist/cjs/ic-pagination.cjs.entry.js +4 -4
- package/dist/cjs/ic-popover-menu.cjs.entry.js +5 -5
- package/dist/cjs/ic-popover-menu.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-radio-group.cjs.entry.js +4 -4
- package/dist/cjs/ic-radio-option.cjs.entry.js +4 -4
- package/dist/cjs/ic-search-bar.cjs.entry.js +49 -31
- package/dist/cjs/ic-search-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-section-container.cjs.entry.js +2 -2
- package/dist/cjs/ic-select.cjs.entry.js +141 -217
- package/dist/cjs/ic-select.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-side-navigation.cjs.entry.js +23 -4
- package/dist/cjs/ic-side-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-skeleton.cjs.entry.js +2 -2
- package/dist/cjs/ic-skip-link.cjs.entry.js +2 -2
- package/dist/cjs/ic-status-tag.cjs.entry.js +2 -2
- package/dist/cjs/ic-step.cjs.entry.js +13 -13
- package/dist/cjs/ic-stepper.cjs.entry.js +2 -2
- package/dist/cjs/ic-switch.cjs.entry.js +4 -4
- package/dist/cjs/ic-tab-context.cjs.entry.js +1 -1
- package/dist/cjs/ic-tab-group.cjs.entry.js +2 -2
- package/dist/cjs/ic-tab-panel.cjs.entry.js +2 -2
- package/dist/cjs/ic-text-field.cjs.entry.js +15 -10
- package/dist/cjs/ic-text-field.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-theme.cjs.entry.js +1 -1
- package/dist/cjs/ic-toast-region.cjs.entry.js +1 -1
- package/dist/cjs/ic-toast.cjs.entry.js +3 -3
- package/dist/cjs/ic-toggle-button-group.cjs.entry.js +53 -67
- package/dist/cjs/ic-toggle-button-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-toggle-button.cjs.entry.js +61 -63
- package/dist/cjs/ic-toggle-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-top-navigation.cjs.entry.js +64 -62
- package/dist/cjs/ic-top-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-typography.cjs.entry.js +2 -2
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/ic-accordion/ic-accordion.js +9 -7
- package/dist/collection/components/ic-accordion/ic-accordion.js.map +1 -1
- package/dist/collection/components/ic-accordion/ic-accordion.stories.js +1 -1
- package/dist/collection/components/ic-alert/ic-alert.css +4 -0
- package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.js +2 -2
- package/dist/collection/components/ic-breadcrumb-group/ic-breadcrumb-group.js +2 -2
- package/dist/collection/components/ic-button/ic-button.css +0 -8
- package/dist/collection/components/ic-button/ic-button.js +2 -2
- package/dist/collection/components/ic-button/ic-button.js.map +1 -1
- package/dist/collection/components/ic-card-vertical/ic-card-vertical.css +3 -0
- package/dist/collection/components/ic-checkbox/ic-checkbox.css +9 -1
- package/dist/collection/components/ic-checkbox/ic-checkbox.js +6 -11
- package/dist/collection/components/ic-checkbox/ic-checkbox.js.map +1 -1
- package/dist/collection/components/ic-checkbox-group/ic-checkbox-group.js +2 -2
- package/dist/collection/components/ic-data-list/ic-data-list.js +2 -2
- package/dist/collection/components/ic-data-row/ic-data-row.js +2 -2
- package/dist/collection/components/ic-dialog/ic-dialog.js +1 -1
- package/dist/collection/components/ic-empty-state/ic-empty-state.js +2 -2
- package/dist/collection/components/ic-footer-link/ic-footer-link.js +2 -2
- package/dist/collection/components/ic-hero/ic-hero.css +13 -4
- package/dist/collection/components/ic-hero/ic-hero.js +5 -4
- package/dist/collection/components/ic-hero/ic-hero.js.map +1 -1
- package/dist/collection/components/ic-hero/ic-hero.stories.js +1 -0
- package/dist/collection/components/ic-horizontal-scroll/ic-horizontal-scroll.js +5 -5
- package/dist/collection/components/ic-input-component-container/ic-input-component-container.js +3 -3
- package/dist/collection/components/ic-input-container/ic-input-container.js +2 -2
- package/dist/collection/components/ic-input-label/ic-input-label.js +4 -4
- package/dist/collection/components/ic-input-validation/ic-input-validation.js +3 -3
- package/dist/collection/components/ic-link/ic-link.js +12 -25
- package/dist/collection/components/ic-link/ic-link.js.map +1 -1
- package/dist/collection/components/ic-loading-indicator/ic-loading-indicator.js +3 -3
- package/dist/collection/components/ic-menu/ic-menu.js +41 -40
- package/dist/collection/components/ic-menu/ic-menu.js.map +1 -1
- package/dist/collection/components/ic-menu-group/ic-menu-group.js +1 -1
- package/dist/collection/components/ic-navigation-group/ic-navigation-group.js +119 -167
- package/dist/collection/components/ic-navigation-group/ic-navigation-group.js.map +1 -1
- package/dist/collection/components/ic-navigation-item/ic-navigation-item.css +7 -13
- package/dist/collection/components/ic-navigation-item/ic-navigation-item.js +80 -74
- package/dist/collection/components/ic-navigation-item/ic-navigation-item.js.map +1 -1
- package/dist/collection/components/ic-navigation-menu/ic-navigation-menu.js +4 -4
- package/dist/collection/components/ic-page-header/ic-page-header.js +6 -6
- package/dist/collection/components/ic-pagination/ic-pagination.js +4 -4
- package/dist/collection/components/ic-pagination-item/ic-pagination-item.js +1 -1
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.css +3 -0
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.js +4 -4
- package/dist/collection/components/ic-radio-group/ic-radio-group.js +4 -4
- package/dist/collection/components/ic-radio-option/ic-radio-option.js +4 -4
- package/dist/collection/components/ic-search-bar/ic-search-bar.js +52 -32
- package/dist/collection/components/ic-search-bar/ic-search-bar.js.map +1 -1
- package/dist/collection/components/ic-search-bar/ic-search-bar.stories.js +9 -8
- package/dist/collection/components/ic-section-container/ic-section-container.js +2 -2
- package/dist/collection/components/ic-select/ic-select.js +196 -271
- package/dist/collection/components/ic-select/ic-select.js.map +1 -1
- package/dist/collection/components/ic-select/ic-select_(single).stories.js +30 -21
- package/dist/collection/components/ic-side-navigation/ic-side-navigation.js +43 -4
- package/dist/collection/components/ic-side-navigation/ic-side-navigation.js.map +1 -1
- package/dist/collection/components/ic-side-navigation/ic-side-navigation.stories.js +247 -0
- package/dist/collection/components/ic-skeleton/ic-skeleton.js +2 -2
- package/dist/collection/components/ic-skip-link/ic-skip-link.js +2 -2
- package/dist/collection/components/ic-status-tag/ic-status-tag.js +2 -2
- package/dist/collection/components/ic-step/ic-step.js +13 -13
- package/dist/collection/components/ic-stepper/ic-stepper.js +2 -2
- package/dist/collection/components/ic-switch/ic-switch.js +4 -4
- package/dist/collection/components/ic-tab-context/ic-tab-context.js +1 -1
- package/dist/collection/components/ic-tab-group/ic-tab-group.js +2 -2
- package/dist/collection/components/ic-tab-panel/ic-tab-panel.js +2 -2
- package/dist/collection/components/ic-text-field/ic-text-field.js +20 -14
- package/dist/collection/components/ic-text-field/ic-text-field.js.map +1 -1
- package/dist/collection/components/ic-theme/ic-theme.js +1 -1
- package/dist/collection/components/ic-toast/ic-toast.js +3 -3
- package/dist/collection/components/ic-toast-region/ic-toast-region.js +1 -1
- package/dist/collection/components/ic-toggle-button/ic-toggle-button.css +40 -7
- package/dist/collection/components/ic-toggle-button/ic-toggle-button.js +80 -82
- package/dist/collection/components/ic-toggle-button/ic-toggle-button.js.map +1 -1
- package/dist/collection/components/ic-toggle-button-group/ic-toggle-button-group.js +79 -88
- package/dist/collection/components/ic-toggle-button-group/ic-toggle-button-group.js.map +1 -1
- package/dist/collection/components/ic-tooltip/ic-tooltip.js +2 -2
- package/dist/collection/components/ic-top-navigation/ic-top-navigation.js +81 -79
- package/dist/collection/components/ic-top-navigation/ic-top-navigation.js.map +1 -1
- package/dist/collection/components/ic-typography/ic-typography.js +2 -2
- package/dist/components/ic-accordion.js +9 -7
- package/dist/components/ic-accordion.js.map +1 -1
- package/dist/components/ic-alert.js +1 -1
- package/dist/components/ic-alert.js.map +1 -1
- package/dist/components/ic-breadcrumb-group.js +2 -2
- package/dist/components/ic-breadcrumb2.js +2 -2
- package/dist/components/ic-button2.js +3 -3
- package/dist/components/ic-button2.js.map +1 -1
- package/dist/components/ic-card-vertical.js +1 -1
- package/dist/components/ic-card-vertical.js.map +1 -1
- package/dist/components/ic-checkbox-group.js +2 -2
- package/dist/components/ic-checkbox.js +7 -12
- package/dist/components/ic-checkbox.js.map +1 -1
- package/dist/components/ic-data-list.js +2 -2
- package/dist/components/ic-data-row.js +2 -2
- package/dist/components/ic-dialog.js +1 -1
- package/dist/components/ic-empty-state.js +2 -2
- package/dist/components/ic-footer-link.js +2 -2
- package/dist/components/ic-hero.js +6 -5
- package/dist/components/ic-hero.js.map +1 -1
- package/dist/components/ic-horizontal-scroll2.js +5 -5
- package/dist/components/ic-input-component-container2.js +3 -3
- package/dist/components/ic-input-container2.js +2 -2
- package/dist/components/ic-input-label2.js +4 -4
- package/dist/components/ic-input-validation2.js +3 -3
- package/dist/components/ic-link2.js +12 -24
- package/dist/components/ic-link2.js.map +1 -1
- package/dist/components/ic-loading-indicator2.js +3 -3
- package/dist/components/ic-menu-group.js +1 -1
- package/dist/components/ic-menu2.js +17 -16
- package/dist/components/ic-menu2.js.map +1 -1
- package/dist/components/ic-navigation-group.js +115 -163
- package/dist/components/ic-navigation-group.js.map +1 -1
- package/dist/components/ic-navigation-item.js +67 -62
- package/dist/components/ic-navigation-item.js.map +1 -1
- package/dist/components/ic-navigation-menu2.js +4 -4
- package/dist/components/ic-page-header.js +6 -6
- package/dist/components/ic-pagination-item2.js +1 -1
- package/dist/components/ic-pagination.js +4 -4
- package/dist/components/ic-popover-menu.js +5 -5
- package/dist/components/ic-popover-menu.js.map +1 -1
- package/dist/components/ic-radio-group.js +4 -4
- package/dist/components/ic-radio-group.js.map +1 -1
- package/dist/components/ic-radio-option.js +4 -4
- package/dist/components/ic-search-bar.js +50 -31
- package/dist/components/ic-search-bar.js.map +1 -1
- package/dist/components/ic-section-container2.js +2 -2
- package/dist/components/ic-select.js +141 -217
- package/dist/components/ic-select.js.map +1 -1
- package/dist/components/ic-side-navigation.js +24 -4
- package/dist/components/ic-side-navigation.js.map +1 -1
- package/dist/components/ic-skeleton.js +2 -2
- package/dist/components/ic-skip-link.js +2 -2
- package/dist/components/ic-status-tag.js +2 -2
- package/dist/components/ic-step.js +13 -13
- package/dist/components/ic-stepper.js +2 -2
- package/dist/components/ic-switch.js +4 -4
- package/dist/components/ic-tab-context.js +1 -1
- package/dist/components/ic-tab-group.js +2 -2
- package/dist/components/ic-tab-panel.js +2 -2
- package/dist/components/ic-text-field.js +16 -10
- package/dist/components/ic-text-field.js.map +1 -1
- package/dist/components/ic-theme.js +1 -1
- package/dist/components/ic-toast-region.js +1 -1
- package/dist/components/ic-toast.js +3 -3
- package/dist/components/ic-toggle-button-group.js +53 -67
- package/dist/components/ic-toggle-button-group.js.map +1 -1
- package/dist/components/ic-toggle-button.js +61 -63
- package/dist/components/ic-toggle-button.js.map +1 -1
- package/dist/components/ic-tooltip2.js +2 -2
- package/dist/components/ic-top-navigation.js +65 -63
- package/dist/components/ic-top-navigation.js.map +1 -1
- package/dist/components/ic-typography2.js +2 -2
- package/dist/core/core.esm.js +1 -1
- package/dist/core/core.esm.js.map +1 -1
- package/dist/core/p-0fb68b4f.entry.js +2 -0
- package/dist/core/p-0fb68b4f.entry.js.map +1 -0
- package/dist/core/{p-a0161990.entry.js → p-1d172032.entry.js} +2 -2
- package/dist/core/{p-f0388d68.entry.js → p-1d254b71.entry.js} +2 -2
- package/dist/core/p-1d254b71.entry.js.map +1 -0
- package/dist/core/{p-83764268.entry.js → p-23536595.entry.js} +2 -2
- package/dist/core/{p-ba600947.entry.js → p-3676ac4e.entry.js} +2 -2
- package/dist/core/{p-bc2ca778.entry.js → p-3cb4ecef.entry.js} +2 -2
- package/dist/core/{p-18714198.entry.js → p-432aeae0.entry.js} +2 -2
- package/dist/core/{p-2c17cc67.entry.js → p-4a2acb2e.entry.js} +2 -2
- package/dist/core/{p-c9a4fe37.entry.js → p-4dc97b03.entry.js} +2 -2
- package/dist/core/p-4dc97b03.entry.js.map +1 -0
- package/dist/core/{p-cdf56a5d.entry.js → p-4e48a671.entry.js} +2 -2
- package/dist/core/p-4e48a671.entry.js.map +1 -0
- package/dist/core/{p-1440847f.entry.js → p-51b49429.entry.js} +2 -2
- package/dist/core/p-554845c4.entry.js +2 -0
- package/dist/core/p-554845c4.entry.js.map +1 -0
- package/dist/core/{p-9479f272.entry.js → p-56e0de32.entry.js} +2 -2
- package/dist/core/{p-ebab7a9e.entry.js → p-56fb0298.entry.js} +2 -2
- package/dist/core/p-59b48450.entry.js +2 -0
- package/dist/core/p-59b48450.entry.js.map +1 -0
- package/dist/core/{p-10e1e227.entry.js → p-5aec3757.entry.js} +2 -2
- package/dist/core/{p-d45d66c0.entry.js → p-5eb2ac90.entry.js} +2 -2
- package/dist/core/{p-a4f9b5bf.entry.js → p-60aad45d.entry.js} +2 -2
- package/dist/core/p-6cd0b010.entry.js +2 -0
- package/dist/core/p-6cd0b010.entry.js.map +1 -0
- package/dist/core/{p-788c96ac.entry.js → p-6eea869b.entry.js} +2 -2
- package/dist/core/{p-70a6cff1.entry.js → p-7d2c07e2.entry.js} +2 -2
- package/dist/core/p-7d352865.entry.js +2 -0
- package/dist/core/p-7d352865.entry.js.map +1 -0
- package/dist/core/{p-b371a498.entry.js → p-7deaf128.entry.js} +2 -2
- package/dist/core/p-803f2eb8.entry.js +2 -0
- package/dist/core/p-803f2eb8.entry.js.map +1 -0
- package/dist/core/{p-16f55230.entry.js → p-87fa5add.entry.js} +2 -2
- package/dist/core/p-87fa5add.entry.js.map +1 -0
- package/dist/core/{p-b8da5c07.entry.js → p-887e00bb.entry.js} +2 -2
- package/dist/core/p-8958c60f.entry.js +2 -0
- package/dist/core/p-8958c60f.entry.js.map +1 -0
- package/dist/core/{p-1838d1e9.entry.js → p-8c77dd65.entry.js} +2 -2
- package/dist/core/{p-fbf57f0a.entry.js → p-9a6dc8b1.entry.js} +2 -2
- package/dist/core/p-9a6dc8b1.entry.js.map +1 -0
- package/dist/core/p-a140bcaa.entry.js +2 -0
- package/dist/core/p-aad2abbf.entry.js +2 -0
- package/dist/core/p-aad2abbf.entry.js.map +1 -0
- package/dist/core/p-bdcc79dd.entry.js +2 -0
- package/dist/core/p-bdcc79dd.entry.js.map +1 -0
- package/dist/core/{p-b9459ba2.entry.js → p-bf3b853e.entry.js} +2 -2
- package/dist/core/{p-9cfc2bac.entry.js → p-c59fd23e.entry.js} +2 -2
- package/dist/core/{p-72c117b6.entry.js → p-c5ffe2cf.entry.js} +2 -2
- package/dist/core/{p-c4663e1a.entry.js → p-cfa9ed7d.entry.js} +2 -2
- package/dist/core/{p-df88ff5b.entry.js → p-d4903dcd.entry.js} +2 -2
- package/dist/core/{p-8c4f7c63.entry.js → p-d82b27df.entry.js} +2 -2
- package/dist/core/{p-bdc72446.entry.js → p-d8ce39ac.entry.js} +2 -2
- package/dist/core/{p-42a7d0b6.entry.js → p-dcce0dfd.entry.js} +2 -2
- package/dist/core/{p-9ca147f3.entry.js → p-de1e04ac.entry.js} +2 -2
- package/dist/core/{p-8b5022bc.entry.js → p-dee21f6d.entry.js} +2 -2
- package/dist/core/{p-00bc353b.entry.js → p-dfc8cba6.entry.js} +2 -2
- package/dist/core/{p-1be17f22.entry.js → p-e2629bfe.entry.js} +2 -2
- package/dist/core/{p-1b2690b4.entry.js → p-e38fddbb.entry.js} +2 -2
- package/dist/core/p-e38fddbb.entry.js.map +1 -0
- package/dist/core/p-eca6e215.entry.js +2 -0
- package/dist/core/p-eca6e215.entry.js.map +1 -0
- package/dist/core/{p-0a436c47.entry.js → p-ef4b752c.entry.js} +2 -2
- package/dist/core/p-ef4b752c.entry.js.map +1 -0
- package/dist/core/{p-267a19d4.entry.js → p-fa38ad2e.entry.js} +2 -2
- package/dist/core/p-fc4f7180.entry.js +2 -0
- package/dist/core/p-fc4f7180.entry.js.map +1 -0
- package/dist/esm/core.js +1 -1
- package/dist/esm/ic-accordion.entry.js +9 -7
- package/dist/esm/ic-accordion.entry.js.map +1 -1
- package/dist/esm/ic-alert.entry.js +1 -1
- package/dist/esm/ic-alert.entry.js.map +1 -1
- package/dist/esm/ic-breadcrumb-group.entry.js +2 -2
- package/dist/esm/ic-breadcrumb.entry.js +2 -2
- package/dist/esm/ic-button_3.entry.js +8 -8
- package/dist/esm/ic-button_3.entry.js.map +1 -1
- package/dist/esm/ic-card-vertical.entry.js +1 -1
- package/dist/esm/ic-card-vertical.entry.js.map +1 -1
- package/dist/esm/ic-checkbox-group.entry.js +2 -2
- package/dist/esm/ic-checkbox.entry.js +7 -12
- package/dist/esm/ic-checkbox.entry.js.map +1 -1
- package/dist/esm/ic-data-list.entry.js +2 -2
- package/dist/esm/ic-data-row.entry.js +2 -2
- package/dist/esm/ic-dialog.entry.js +1 -1
- package/dist/esm/ic-empty-state.entry.js +2 -2
- package/dist/esm/ic-footer-link.entry.js +2 -2
- package/dist/esm/ic-hero.entry.js +6 -5
- package/dist/esm/ic-hero.entry.js.map +1 -1
- package/dist/esm/ic-horizontal-scroll.entry.js +5 -5
- package/dist/esm/ic-input-component-container_3.entry.js +22 -21
- package/dist/esm/ic-input-component-container_3.entry.js.map +1 -1
- package/dist/esm/ic-input-label_2.entry.js +7 -7
- package/dist/esm/ic-link.entry.js +11 -21
- package/dist/esm/ic-link.entry.js.map +1 -1
- package/dist/esm/ic-menu-group.entry.js +1 -1
- package/dist/esm/ic-navigation-group.entry.js +115 -163
- package/dist/esm/ic-navigation-group.entry.js.map +1 -1
- package/dist/esm/ic-navigation-item.entry.js +64 -61
- package/dist/esm/ic-navigation-item.entry.js.map +1 -1
- package/dist/esm/ic-navigation-menu.entry.js +4 -4
- package/dist/esm/ic-page-header.entry.js +6 -6
- package/dist/esm/ic-pagination-item.entry.js +1 -1
- package/dist/esm/ic-pagination.entry.js +4 -4
- package/dist/esm/ic-popover-menu.entry.js +5 -5
- package/dist/esm/ic-popover-menu.entry.js.map +1 -1
- package/dist/esm/ic-radio-group.entry.js +4 -4
- package/dist/esm/ic-radio-option.entry.js +4 -4
- package/dist/esm/ic-search-bar.entry.js +49 -31
- package/dist/esm/ic-search-bar.entry.js.map +1 -1
- package/dist/esm/ic-section-container.entry.js +2 -2
- package/dist/esm/ic-select.entry.js +142 -218
- package/dist/esm/ic-select.entry.js.map +1 -1
- package/dist/esm/ic-side-navigation.entry.js +23 -4
- package/dist/esm/ic-side-navigation.entry.js.map +1 -1
- package/dist/esm/ic-skeleton.entry.js +2 -2
- package/dist/esm/ic-skip-link.entry.js +2 -2
- package/dist/esm/ic-status-tag.entry.js +2 -2
- package/dist/esm/ic-step.entry.js +13 -13
- package/dist/esm/ic-stepper.entry.js +2 -2
- package/dist/esm/ic-switch.entry.js +4 -4
- package/dist/esm/ic-tab-context.entry.js +1 -1
- package/dist/esm/ic-tab-group.entry.js +2 -2
- package/dist/esm/ic-tab-panel.entry.js +2 -2
- package/dist/esm/ic-text-field.entry.js +15 -10
- package/dist/esm/ic-text-field.entry.js.map +1 -1
- package/dist/esm/ic-theme.entry.js +1 -1
- package/dist/esm/ic-toast-region.entry.js +1 -1
- package/dist/esm/ic-toast.entry.js +3 -3
- package/dist/esm/ic-toggle-button-group.entry.js +53 -67
- package/dist/esm/ic-toggle-button-group.entry.js.map +1 -1
- package/dist/esm/ic-toggle-button.entry.js +61 -63
- package/dist/esm/ic-toggle-button.entry.js.map +1 -1
- package/dist/esm/ic-top-navigation.entry.js +65 -63
- package/dist/esm/ic-top-navigation.entry.js.map +1 -1
- package/dist/esm/ic-typography.entry.js +2 -2
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/ic-link/ic-link.d.ts +2 -3
- package/dist/types/components/ic-menu/ic-menu.d.ts +12 -12
- package/dist/types/components/ic-navigation-group/ic-navigation-group.d.ts +4 -18
- package/dist/types/components/ic-navigation-item/ic-navigation-item.d.ts +9 -7
- package/dist/types/components/ic-search-bar/ic-search-bar.d.ts +2 -0
- package/dist/types/components/ic-select/ic-select.d.ts +36 -38
- package/dist/types/components/ic-side-navigation/ic-side-navigation.d.ts +5 -0
- package/dist/types/components/ic-text-field/ic-text-field.d.ts +3 -2
- package/dist/types/components/ic-toggle-button/ic-toggle-button.d.ts +10 -11
- package/dist/types/components/ic-toggle-button-group/ic-toggle-button-group.d.ts +10 -12
- package/dist/types/components/ic-top-navigation/ic-top-navigation.d.ts +9 -8
- package/dist/types/components.d.ts +89 -81
- package/hydrate/index.js +748 -850
- package/hydrate/index.mjs +748 -850
- package/package.json +2 -2
- package/vscode-data.json +8 -4
- package/dist/core/p-0a436c47.entry.js.map +0 -1
- package/dist/core/p-16f55230.entry.js.map +0 -1
- package/dist/core/p-1b2690b4.entry.js.map +0 -1
- package/dist/core/p-206c2a26.entry.js +0 -2
- package/dist/core/p-206c2a26.entry.js.map +0 -1
- package/dist/core/p-2e44cf53.entry.js +0 -2
- package/dist/core/p-2e44cf53.entry.js.map +0 -1
- package/dist/core/p-730d2f6e.entry.js +0 -2
- package/dist/core/p-730d2f6e.entry.js.map +0 -1
- package/dist/core/p-7fb79e87.entry.js +0 -2
- package/dist/core/p-7fb79e87.entry.js.map +0 -1
- package/dist/core/p-910f5f14.entry.js +0 -2
- package/dist/core/p-910f5f14.entry.js.map +0 -1
- package/dist/core/p-b7568944.entry.js +0 -2
- package/dist/core/p-b7568944.entry.js.map +0 -1
- package/dist/core/p-c45023b7.entry.js +0 -2
- package/dist/core/p-c45023b7.entry.js.map +0 -1
- package/dist/core/p-c9a4fe37.entry.js.map +0 -1
- package/dist/core/p-cdf56a5d.entry.js.map +0 -1
- package/dist/core/p-d6c50565.entry.js +0 -2
- package/dist/core/p-d6c50565.entry.js.map +0 -1
- package/dist/core/p-d975bf2f.entry.js +0 -2
- package/dist/core/p-d975bf2f.entry.js.map +0 -1
- package/dist/core/p-dede4974.entry.js +0 -2
- package/dist/core/p-dede4974.entry.js.map +0 -1
- package/dist/core/p-e86a6d2d.entry.js +0 -2
- package/dist/core/p-eeab3a2e.entry.js +0 -2
- package/dist/core/p-eeab3a2e.entry.js.map +0 -1
- package/dist/core/p-f0388d68.entry.js.map +0 -1
- package/dist/core/p-fbf57f0a.entry.js.map +0 -1
- /package/dist/core/{p-a0161990.entry.js.map → p-1d172032.entry.js.map} +0 -0
- /package/dist/core/{p-83764268.entry.js.map → p-23536595.entry.js.map} +0 -0
- /package/dist/core/{p-ba600947.entry.js.map → p-3676ac4e.entry.js.map} +0 -0
- /package/dist/core/{p-bc2ca778.entry.js.map → p-3cb4ecef.entry.js.map} +0 -0
- /package/dist/core/{p-18714198.entry.js.map → p-432aeae0.entry.js.map} +0 -0
- /package/dist/core/{p-2c17cc67.entry.js.map → p-4a2acb2e.entry.js.map} +0 -0
- /package/dist/core/{p-1440847f.entry.js.map → p-51b49429.entry.js.map} +0 -0
- /package/dist/core/{p-9479f272.entry.js.map → p-56e0de32.entry.js.map} +0 -0
- /package/dist/core/{p-ebab7a9e.entry.js.map → p-56fb0298.entry.js.map} +0 -0
- /package/dist/core/{p-10e1e227.entry.js.map → p-5aec3757.entry.js.map} +0 -0
- /package/dist/core/{p-d45d66c0.entry.js.map → p-5eb2ac90.entry.js.map} +0 -0
- /package/dist/core/{p-a4f9b5bf.entry.js.map → p-60aad45d.entry.js.map} +0 -0
- /package/dist/core/{p-788c96ac.entry.js.map → p-6eea869b.entry.js.map} +0 -0
- /package/dist/core/{p-70a6cff1.entry.js.map → p-7d2c07e2.entry.js.map} +0 -0
- /package/dist/core/{p-b371a498.entry.js.map → p-7deaf128.entry.js.map} +0 -0
- /package/dist/core/{p-b8da5c07.entry.js.map → p-887e00bb.entry.js.map} +0 -0
- /package/dist/core/{p-1838d1e9.entry.js.map → p-8c77dd65.entry.js.map} +0 -0
- /package/dist/core/{p-e86a6d2d.entry.js.map → p-a140bcaa.entry.js.map} +0 -0
- /package/dist/core/{p-b9459ba2.entry.js.map → p-bf3b853e.entry.js.map} +0 -0
- /package/dist/core/{p-9cfc2bac.entry.js.map → p-c59fd23e.entry.js.map} +0 -0
- /package/dist/core/{p-72c117b6.entry.js.map → p-c5ffe2cf.entry.js.map} +0 -0
- /package/dist/core/{p-c4663e1a.entry.js.map → p-cfa9ed7d.entry.js.map} +0 -0
- /package/dist/core/{p-df88ff5b.entry.js.map → p-d4903dcd.entry.js.map} +0 -0
- /package/dist/core/{p-8c4f7c63.entry.js.map → p-d82b27df.entry.js.map} +0 -0
- /package/dist/core/{p-bdc72446.entry.js.map → p-d8ce39ac.entry.js.map} +0 -0
- /package/dist/core/{p-42a7d0b6.entry.js.map → p-dcce0dfd.entry.js.map} +0 -0
- /package/dist/core/{p-9ca147f3.entry.js.map → p-de1e04ac.entry.js.map} +0 -0
- /package/dist/core/{p-8b5022bc.entry.js.map → p-dee21f6d.entry.js.map} +0 -0
- /package/dist/core/{p-00bc353b.entry.js.map → p-dfc8cba6.entry.js.map} +0 -0
- /package/dist/core/{p-1be17f22.entry.js.map → p-e2629bfe.entry.js.map} +0 -0
- /package/dist/core/{p-267a19d4.entry.js.map → p-fa38ad2e.entry.js.map} +0 -0
package/hydrate/index.js
CHANGED
@@ -3697,6 +3697,7 @@ const icAccordionCss = "/*! normalize.css v8.0.1 | MIT License | github.com/neco
|
|
3697
3697
|
var IcAccordionStyle0 = icAccordionCss;
|
3698
3698
|
|
3699
3699
|
let accordionIds = 0;
|
3700
|
+
const EXPANDED_CONTENT_OPENED_CLASS = "expanded-content-opened";
|
3700
3701
|
/**
|
3701
3702
|
* @slot heading - Content is placed as the accordion heading.
|
3702
3703
|
* @slot icon - Content is placed to the left of the heading.
|
@@ -3743,7 +3744,7 @@ class Accordion {
|
|
3743
3744
|
};
|
3744
3745
|
this.setExpandedContentStyle = (ev, expandedContent) => {
|
3745
3746
|
if (ev.propertyName === "height" && expandedContent.clientHeight > 0) {
|
3746
|
-
expandedContent.classList.add(
|
3747
|
+
expandedContent.classList.add(EXPANDED_CONTENT_OPENED_CLASS);
|
3747
3748
|
expandedContent.style.height = "auto";
|
3748
3749
|
}
|
3749
3750
|
};
|
@@ -3770,7 +3771,7 @@ class Accordion {
|
|
3770
3771
|
if (expandedContentEl.scrollHeight > 0 && !this.expanded) {
|
3771
3772
|
expandedContentEl.style.height = "0";
|
3772
3773
|
this.setAccordionAnimation(expandedContentEl, "300", "height", "ease-in");
|
3773
|
-
expandedContentEl.classList.remove(
|
3774
|
+
expandedContentEl.classList.remove(EXPANDED_CONTENT_OPENED_CLASS);
|
3774
3775
|
}
|
3775
3776
|
expandedContentEl.addEventListener("transitionend", (e) => {
|
3776
3777
|
this.hideExpandedContent(e, expandedContentEl);
|
@@ -3808,23 +3809,24 @@ class Accordion {
|
|
3808
3809
|
if (this.expanded && this.expandedContentEl) {
|
3809
3810
|
this.expandedContentEl.style.height = "auto";
|
3810
3811
|
this.expandedContentEl.style.setProperty(this.CONTENT_VISIBILITY_PROPERTY, "visible");
|
3812
|
+
this.expandedContentEl.classList.add(EXPANDED_CONTENT_OPENED_CLASS);
|
3811
3813
|
}
|
3812
3814
|
}
|
3813
3815
|
render() {
|
3814
3816
|
const { size, disabled, expanded, theme } = this;
|
3815
|
-
return (hAsync(Host, { key: '
|
3817
|
+
return (hAsync(Host, { key: '9fff7c4dc37187f9a2d03ae477c48012ff17c870', id: this.accordionId, class: {
|
3816
3818
|
["ic-accordion-disabled"]: !!disabled,
|
3817
3819
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
3818
|
-
}, "aria-disabled": disabled ? "true" : "false" }, hAsync("button", { key: '
|
3820
|
+
}, "aria-disabled": disabled ? "true" : "false" }, hAsync("button", { key: '0f83275fbfc435eb5b640bd76b9a9582fcb3dca0', ref: (el) => (this.accordionBtnHeading = el), id: `${this.accordionId}-button`, disabled: disabled, tabindex: disabled ? -1 : 0, class: {
|
3819
3821
|
[`${size}`]: true,
|
3820
3822
|
["section-button"]: true,
|
3821
3823
|
["section-button-open"]: !!expanded && !disabled,
|
3822
|
-
}, "aria-expanded": `${expanded}`, "aria-controls": "expanded-content-area", onClick: this.toggleExpanded }, isSlotUsed(this.el, "icon") && (hAsync("div", { key: '
|
3824
|
+
}, "aria-expanded": `${expanded}`, "aria-controls": "expanded-content-area", onClick: this.toggleExpanded }, isSlotUsed(this.el, "icon") && (hAsync("div", { key: '41c88884df97917d026fbecb500c35b393045c7d', class: "icon-container" }, hAsync("slot", { key: 'ddc6894db8ab81e27c971350e261d99b51759756', name: "icon" }))), hAsync("ic-typography", { key: 'e0ca73dbe5a2d46dbe2f893d4405e3d82fd2a862', variant: "subtitle-large", class: "section-header" }, isSlotUsed(this.el, "heading") ? (hAsync("slot", { name: "heading" })) : (this.heading)), hAsync("span", { key: 'a95fad35c3e3f38415da026a93112079f74de4d7', class: {
|
3823
3825
|
["expand-chevron"]: true,
|
3824
3826
|
["content-expanded-chevron"]: !!expanded && !disabled,
|
3825
|
-
}, "aria-hidden": "true", innerHTML: chevronIcon })), hAsync("div", { key: '
|
3827
|
+
}, "aria-hidden": "true", innerHTML: chevronIcon })), hAsync("div", { key: '65b6322d5dde677528891631ecd9b95189948771', class: {
|
3826
3828
|
["expanded-content"]: true,
|
3827
|
-
}, "aria-labelledby": `${this.accordionId}-button`, role: "region", "aria-hidden": `${!expanded}`, id: "expanded-content-area", ref: (el) => (this.expandedContentEl = el) }, hAsync("div", { key: '
|
3829
|
+
}, "aria-labelledby": `${this.accordionId}-button`, role: "region", "aria-hidden": `${!expanded}`, id: "expanded-content-area", ref: (el) => (this.expandedContentEl = el) }, hAsync("div", { key: 'de9ec00d55757be20c097082817529b652200263', class: "expanded-content-inner" }, this.message ? (hAsync("ic-typography", { variant: "body" }, this.message)) : (hAsync("slot", null))))));
|
3828
3830
|
}
|
3829
3831
|
get el() { return getElement(this); }
|
3830
3832
|
static get watchers() { return {
|
@@ -4005,7 +4007,7 @@ var closeIcon = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fil
|
|
4005
4007
|
</svg>
|
4006
4008
|
`;
|
4007
4009
|
|
4008
|
-
const icAlertCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}:host ::slotted(ic-typography){--ic-typography-color:var(--ic-alert-description)}.container{min-height:var(--ic-alert-min-height);border-radius:var(--ic-space-xxs) var(--ic-space-xxxs) var(--ic-space-xxxs)\n var(--ic-space-xxs);position:relative;display:flex;align-items:center}.container-neutral{background-color:var(--ic-alert-background-neutral);border:var(--ic-space-xxxs) solid var(--ic-alert-border-neutral)}.container-info{background-color:var(--ic-alert-background-info);border:var(--ic-space-xxxs) solid var(--ic-alert-border-info)}.container-warning{background-color:var(--ic-alert-background-warning);border:var(--ic-space-xxxs) solid var(--ic-alert-border-warning)}.container-error{background-color:var(--ic-alert-background-error);border:var(--ic-space-xxxs) solid var(--ic-alert-border-error)}.container-success{background-color:var(--ic-alert-background-success);border:var(--ic-space-xxxs) solid var(--ic-alert-border-success)}.alert-icon-container{height:100%;display:flex;align-items:center}.divider{height:100%;width:var(--ic-space-xs);border-radius:var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);position:absolute}.divider-neutral{background-color:var(--ic-alert-status-type-neutral)}.divider-info{background-color:var(--ic-alert-status-type-info)}.divider-warning{background-color:var(--ic-alert-status-type-warning)}.divider-error{background-color:var(--ic-alert-status-type-error)}.divider-success{background-color:var(--ic-alert-status-type-success)}.alert-icon{height:var(--ic-space-lg);width:1.375rem;margin-left:1.125rem}.icon-placeholder{margin-left:var(--ic-space-xs)}.alert-icon>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}:host([showdefaulticon=\"false\"]) .icon-neutral{visibility:hidden;width:0;margin-left:0.625rem}.icon-neutral>svg,::slotted(svg){height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block;fill:var(--ic-alert-icon-neutral)}:host([variant=\"info\"]) .alert-icon svg{fill:var(--ic-alert-icon-info)}:host([variant=\"warning\"]) .alert-icon svg{fill:var(--ic-alert-icon-warning)}:host([variant=\"error\"]) .alert-icon svg{fill:var(--ic-alert-icon-error)}:host([variant=\"success\"]) .alert-icon svg{fill:var(--ic-alert-icon-success)}.alert-content{display:flex;align-items:center;margin-left:0.625rem;width:100%}.alert-message{display:flex;align-items:center;padding:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;flex:1;--ic-typography-color:var(--ic-alert-description)}.alert-message-title-above{display:inline}.alert-title{margin-right:var(--ic-space-xs);--ic-typography-color:var(--ic-alert-title)}.alert-title-above{white-space:normal}.alert-action-container{margin-right:var(--ic-space-xs);display:flex;align-items:center}.dismiss-icon{margin-right:var(--ic-space-xxxs);margin-left:-0.375rem;padding:0.375rem;border:none;border-radius:50%;background-color:inherit;display:flex;align-items:center;justify-content:center}.dismiss-icon>svg{color:var(--ic-alert-icon-dismissible)}.dismiss-icon:hover{cursor:pointer}@media (max-width: 628px){.alert-content{display:flex;flex-direction:column;align-items:flex-start}.alert-message{display:flex;flex-direction:column;align-items:flex-start}.alert-title{white-space:normal}.alert-action-container{margin-bottom:var(--ic-space-xs)}}@media (forced-colors: active){.container{border:var(--ic-border-hc)}}";
|
4010
|
+
const icAlertCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}:host ::slotted(ic-typography){--ic-typography-color:var(--ic-alert-description)}.container{min-height:var(--ic-alert-min-height);border-radius:var(--ic-space-xxs) var(--ic-space-xxxs) var(--ic-space-xxxs)\n var(--ic-space-xxs);position:relative;display:flex;align-items:center}.container-neutral{background-color:var(--ic-alert-background-neutral);border:var(--ic-space-xxxs) solid var(--ic-alert-border-neutral)}.container-info{background-color:var(--ic-alert-background-info);border:var(--ic-space-xxxs) solid var(--ic-alert-border-info)}.container-warning{background-color:var(--ic-alert-background-warning);border:var(--ic-space-xxxs) solid var(--ic-alert-border-warning)}.container-error{background-color:var(--ic-alert-background-error);border:var(--ic-space-xxxs) solid var(--ic-alert-border-error)}.container-success{background-color:var(--ic-alert-background-success);border:var(--ic-space-xxxs) solid var(--ic-alert-border-success)}.alert-icon-container{height:100%;display:flex;align-items:center}.divider{height:100%;width:var(--ic-space-xs);border-radius:var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);position:absolute}.divider-neutral{background-color:var(--ic-alert-status-type-neutral)}.divider-info{background-color:var(--ic-alert-status-type-info)}.divider-warning{background-color:var(--ic-alert-status-type-warning)}.divider-error{background-color:var(--ic-alert-status-type-error)}.divider-success{background-color:var(--ic-alert-status-type-success)}.alert-icon{height:var(--ic-space-lg);width:1.375rem;margin-left:1.125rem}.icon-placeholder{margin-left:var(--ic-space-xs)}.alert-icon>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}:host([showdefaulticon=\"false\"]) .icon-neutral{visibility:hidden;width:0;margin-left:0.625rem}.icon-neutral>svg,::slotted(svg){height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block;fill:var(--ic-alert-icon-neutral)}:host([variant=\"info\"]) .alert-icon svg{fill:var(--ic-alert-icon-info)}:host([variant=\"warning\"]) .alert-icon svg{fill:var(--ic-alert-icon-warning)}:host([variant=\"error\"]) .alert-icon svg{fill:var(--ic-alert-icon-error)}:host([variant=\"success\"]) .alert-icon svg{fill:var(--ic-alert-icon-success)}.alert-content{display:flex;align-items:center;margin-left:0.625rem;width:100%}.alert-message{display:flex;align-items:center;padding:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;flex:1;--ic-typography-color:var(--ic-alert-description)}.alert-message-title-above{display:inline}.alert-title{margin-right:var(--ic-space-xs);--ic-typography-color:var(--ic-alert-title)}.alert-title-above{white-space:normal}.alert-action-container{margin-right:var(--ic-space-xs);display:flex;align-items:center}.dismiss-icon{margin-right:var(--ic-space-xxxs);margin-left:-0.375rem;padding:0.375rem;border:none;border-radius:50%;background-color:inherit;display:flex;align-items:center;justify-content:center}.dismiss-icon>svg{color:var(--ic-alert-icon-dismissible)}.dismiss-icon:hover{cursor:pointer}@media (max-width: 628px){.alert-content{display:flex;flex-direction:column;align-items:flex-start}.alert-message{display:flex;flex-direction:column;align-items:flex-start}.alert-title{white-space:normal}.alert-action-container{margin-bottom:var(--ic-space-xs)}}@media (forced-colors: active){.container{border:var(--ic-border-hc)}.dismiss-icon>svg{color:var(--ic-architectural-white)}}";
|
4009
4011
|
var IcAlertStyle0 = icAlertCss;
|
4010
4012
|
|
4011
4013
|
/**
|
@@ -4609,11 +4611,11 @@ class Breadcrumb {
|
|
4609
4611
|
render() {
|
4610
4612
|
const { current, href, monochrome, pageTitle, showBackIcon, theme } = this;
|
4611
4613
|
const describedById = `${pageTitle === null || pageTitle === void 0 ? void 0 : pageTitle.toLowerCase().replace(" ", "-")}-describedby`;
|
4612
|
-
return (hAsync(Host, { key: '
|
4614
|
+
return (hAsync(Host, { key: '55dd358ca0c5d865a9fdd17809b6d7f3ac12a966', class: {
|
4613
4615
|
"ic-breadcrumb-back": showBackIcon,
|
4614
4616
|
"ic-breadcrumb-monochrome": monochrome,
|
4615
4617
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
4616
|
-
}, "aria-current": current && "page", role: "listitem" }, hAsync("div", { key: '
|
4618
|
+
}, "aria-current": current && "page", role: "listitem" }, hAsync("div", { key: '768e4c78b20b1ad9b0100ff2a36ce512db5d7c1c', class: "breadcrumb" }, hAsync("span", { key: '930d48bd5661f977f0ce2edcc4ea3ce02c1e282a', innerHTML: chevronIcon, class: "chevron", "aria-hidden": "true" }), showBackIcon && (hAsync("span", { key: '0b932408b17ef65e2e25b6b4e124e2a4941d8eae', id: describedById, class: "hide" }, `Back to ${pageTitle}`)), !href ? (hAsync("div", { class: "slotted-link-container" }, showBackIcon && this.renderBackIcon(), hAsync("span", { class: "link-wrapper" }, hAsync("slot", null)))) : current ? (hAsync("span", { class: "current-page-container" }, isSlotUsed(this.el, "icon") && hAsync("slot", { name: "icon" }), pageTitle)) : (hAsync("ic-link", { theme: theme, monochrome: monochrome, href: href, class: "breadcrumb-link", "aria-describedby": showBackIcon && describedById }, showBackIcon && this.renderBackIcon(), isSlotUsed(this.el, "icon") && hAsync("slot", { name: "icon" }), pageTitle)))));
|
4617
4619
|
}
|
4618
4620
|
static get delegatesFocus() { return true; }
|
4619
4621
|
get el() { return getElement(this); }
|
@@ -4855,11 +4857,11 @@ class BreadcrumbGroup {
|
|
4855
4857
|
}
|
4856
4858
|
render() {
|
4857
4859
|
const { backBreadcrumbOnly, collapsed, theme } = this;
|
4858
|
-
return (hAsync(Host, { key: '
|
4860
|
+
return (hAsync(Host, { key: 'c39081da4595fa3f6fca4325df9ecc8775201ecc', class: {
|
4859
4861
|
"ic-breadcrumb-group-back": backBreadcrumbOnly,
|
4860
4862
|
"ic-breadcrumb-group-collapsed": collapsed,
|
4861
4863
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
4862
|
-
} }, hAsync("nav", { key: '
|
4864
|
+
} }, hAsync("nav", { key: 'dffbf2a1a5e324c45e1d902f05eeef3e316c917a', "aria-label": "breadcrumbs" }, hAsync("ol", { key: '29e18e2d0dfde13eeeec0dd2266b73e11a9b4a84' }, hAsync("slot", { key: 'd6eb3a931fb3a7a8de0104960cfad4e54d6eeeaf' })))));
|
4863
4865
|
}
|
4864
4866
|
get el() { return getElement(this); }
|
4865
4867
|
static get watchers() { return {
|
@@ -4889,7 +4891,7 @@ var arrowDropdown = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
|
|
4889
4891
|
<path d="M7 9.5L12 14.5L17 9.5H7Z" fill="currentColor"/>
|
4890
4892
|
</svg>`;
|
4891
4893
|
|
4892
|
-
const icButtonCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:inline-block;position:relative;--icon-width:100%;--icon-height:100%}.button,::slotted(a){font-family:var(--ic-font-body-family);text-decoration:none;font-weight:600;font-size:0.875rem;transition:var(--ic-easing-transition-fast);border-radius:var(--ic-border-radius);min-width:var(--min-width, 6.25rem);display:inline-flex;flex-direction:row;justify-content:center;align-items:center;background:none;border:none;box-sizing:border-box;white-space:nowrap;vertical-align:middle}:host(.with-badge) .button{border-radius:0.2188rem}.button:hover,::slotted(a:hover){cursor:pointer}.button:focus,::slotted(a:focus){box-shadow:var(--ic-border-focus)}.button:focus-visible,::slotted(a:focus-visible){outline:var(--ic-hc-focus-outline)}:host(.ic-button-disabled),:host(.ic-button-disabled) .button,:host(.ic-button-disabled) ::slotted(a),:host(.ic-button-loading),:host(.ic-button-loading) .button{pointer-events:none}:host(.top-icon) .button{flex-direction:column;--height:fit-content}:host(.top-icon) .button .icon-container{margin-right:0}:host(.ic-button-variant-primary) .button,:host(.ic-button-variant-icon-primary) .button{color:var(--ic-button-primary-text);background-color:var(--ic-button-primary-background)}:host(.ic-button-variant-primary:not(.ic-button-disabled)) ::slotted(svg){color:var(--ic-button-primary-icon)}:host(.ic-button-variant-primary) ::slotted(a),:host(.ic-button-variant-icon-primary) ::slotted(a){--ic-typography-color:var(--ic-button-primary-text);color:var(--ic-button-primary-text);background-color:var(--ic-button-primary-background) !important}:host(.ic-button-variant-primary) .button:hover,:host(.ic-button-variant-icon-primary) .button:hover{background-color:var(--ic-button-primary-background-hover)}:host(.ic-button-variant-primary) ::slotted(a:hover),:host(.ic-button-variant-icon-primary) ::slotted(a:hover){background-color:var(--ic-button-primary-background-hover) !important}:host(.ic-button-variant-primary.ic-button-loading) .button,:host(.ic-button-variant-primary) .button:active,:host(.ic-button-variant-icon-primary.ic-button-loading) .button,:host(.ic-button-variant-icon-primary) .button:active{background-color:var(--ic-button-primary-background-pressed);--button-loading-inner-color:var(--ic-button-primary-text);--button-loading-outer-color:var(--ic-button-primary-background-pressed)}:host(.ic-button-variant-primary) ::slotted(a:active),:host(.ic-button-variant-icon-primary) ::slotted(a:active){background-color:var(--ic-button-primary-background-pressed) !important}:host(.ic-button-variant-primary.ic-button-disabled) .button,:host(.ic-button-variant-icon-primary.ic-button-disabled) .button{background:var(--ic-button-primary-background-disabled);color:var(--ic-button-primary-text-disabled)}:host(.ic-button-variant-primary.ic-button-disabled) ::slotted(a),:host(.ic-button-variant-icon-primary.ic-button-disabled) ::slotted(a){background:var(--ic-button-primary-background-disabled) !important;--ic-typography-color:var(--ic-button-primary-text-disabled) !important;color:var(--ic-button-primary-text-disabled) !important}:host(.ic-button-variant-primary.monochrome) .button,:host(.ic-button-variant-icon-primary.monochrome) .button{color:var(--ic-button-primary-text-monochrome);background-color:var(--ic-button-primary-background-monochrome)}:host(.ic-button-variant-primary.monochrome) ::slotted(a),:host(.ic-button-variant-icon-primary.monochrome) ::slotted(a){background-color:var(--ic-button-primary-background-monochrome) !important}:host(.ic-button-variant-primary.monochrome) .button:hover,:host(.ic-button-variant-icon-primary.monochrome) .button:hover{background-color:var(--ic-button-primary-background-hover-monochrome)}:host(.ic-button-variant-primary.monochrome) ::slotted(a:hover),:host(.ic-button-variant-icon-primary.monochrome) ::slotted(a:hover){background-color:var(\n --ic-button-primary-background-hover-monochrome\n ) !important}:host(.ic-button-variant-primary.ic-button-loading.monochrome) .button,:host(.ic-button-variant-primary.monochrome) .button:active,:host(.ic-button-variant-icon-primary.ic-button-loading.monochrome) .button,:host(.ic-button-variant-icon-primary.monochrome) .button:active{background-color:var(--ic-button-primary-background-pressed-monochrome);--button-loading-inner-color:var(--ic-button-primary-text-monochrome);--button-loading-outer-color:var(--ic-button-primary-background-monochrome)}:host(.ic-button-variant-primary.monochrome) ::slotted(a:active),:host(.ic-button-variant-icon-primary.monochrome) ::slotted(a:active){background-color:var(\n --ic-button-primary-background-pressed-monochrome\n ) !important}:host(.ic-button-variant-primary.ic-button-disabled.monochrome) .button,:host(.ic-button-variant-icon-primary.ic-button-disabled.monochrome) .button{background-color:var(--ic-button-primary-background-disabled-monochrome);color:var(--ic-button-primary-text-disabled-monochrome)}:host(.ic-button-variant-primary.ic-button-disabled.monochrome) ::slotted(a),:host(.ic-button-variant-icon-primary.ic-button-disabled.monochrome) ::slotted(a){background-color:var(\n --ic-button-primary-background-disabled-monochrome\n ) !important}:host(.ic-button-variant-secondary) .button,:host(.ic-button-variant-icon-secondary) .button{border:var(--ic-border-width) solid var(--ic-button-secondary-border);color:var(--ic-button-secondary-text)}:host(.ic-button-variant-secondary) ::slotted(a),:host(.ic-button-variant-icon-secondary) ::slotted(a){border:var(--ic-border-width) solid var(--ic-button-secondary-border) !important;color:var(--ic-button-secondary-text) !important;--ic-typography-color:var(--ic-button-secondary-text) !important}:host(.ic-button-variant-secondary) .button:hover,:host(.ic-button-variant-icon-secondary) .button:hover{background-color:var(--ic-button-secondary-background-hover-active);border-color:var(--ic-button-secondary-border-hover);color:var(--ic-button-secondary-text-hover-active)}:host(.ic-button-variant-secondary) ::slotted(a:hover),:host(.ic-button-variant-icon-secondary) ::slotted(a:hover){background-color:var(\n --ic-button-secondary-background-hover-active\n ) !important}:host(.ic-button-variant-secondary) .button:active,:host(.ic-button-variant-icon-secondary) .button:active{border-color:var(--ic-button-secondary-border-pressed);background-color:var(--ic-button-secondary-background-pressed-active);color:var(--ic-button-secondary-text-pressed-active)}:host(.ic-button-variant-secondary) ::slotted(a:active),:host(.ic-button-variant-icon-secondary) ::slotted(a:active){background-color:var(\n --ic-button-secondary-background-pressed-active\n ) !important}:host(.ic-button-variant-secondary.ic-button-loading) .button,:host(.ic-button-variant-icon-secondary.ic-button-loading) .button{border-color:var(--ic-button-secondary-border-pressed);background-color:var(\n --loading-button-background,\n var(--ic-button-secondary-background-pressed-active)\n ) !important;color:var(--ic-button-secondary-text-pressed-active);--button-loading-inner-color:var(--ic-button-secondary-border-pressed);--button-loading-outer-color:var(\n --ic-button-secondary-background-pressed-active\n )}:host(.ic-button-variant-secondary.ic-button-disabled) .button,:host(.ic-button-variant-icon-secondary.ic-button-disabled) .button{border-color:var(--ic-button-secondary-border-disabled);color:var(--ic-button-secondary-text-disabled);background:none}:host(.ic-button-variant-secondary.ic-button-disabled) ::slotted(a),:host(.ic-button-variant-icon-secondary.ic-button-disabled) ::slotted(a){background:none !important}:host(.ic-button-variant-secondary.background) .button,:host(.ic-button-variant-icon-secondary.background) .button{background-color:var(--ic-button-secondary-background)}:host(.ic-button-variant-secondary.background) ::slotted(a),:host(.ic-button-variant-icon-secondary.background) ::slotted(a){background-color:var(--ic-button-secondary-background) !important}:host(.ic-button-variant-secondary.background) .button:hover,:host(.ic-button-variant-icon-secondary.background) .button:hover{background-image:var(--ic-button-secondary-background-non-transparent-hover)}:host(.ic-button-variant-secondary.background) ::slotted(a:hover),:host(.ic-button-variant-icon-secondary.background) ::slotted(a:hover){background-image:var(\n --ic-button-secondary-background-non-transparent-hover\n ) !important}:host(.ic-button-variant-secondary.background) .button:active,:host(.ic-button-variant-icon-secondary.background) .button:active{background-image:var(\n --ic-button-secondary-background-non-transparent-active\n )}:host(.ic-button-variant-secondary.background) ::slotted(a:active),:host(.ic-button-variant-icon-secondary.background) ::slotted(a:active){background-image:var(\n --ic-button-secondary-background-non-transparent-active\n ) !important}:host(.ic-button-variant-secondary.monochrome) .button,:host(.ic-button-variant-icon-secondary.monochrome) .button{background-color:none;border:var(--ic-border-width) solid\n var(--ic-button-secondary-border-monochrome);color:var(--ic-button-secondary-text-monochrome)}:host(.ic-button-variant-secondary.monochrome) ::slotted(a),:host(.ic-button-variant-icon-secondary.monochrome) ::slotted(a){background-color:none !important}:host(.ic-button-variant-secondary.monochrome) .button:hover,:host(.ic-button-variant-icon-secondary.monochrome) .button:hover{background-color:var(--ic-button-secondary-background-hover-monochrome);border-color:var(--ic-button-secondary-border-hover-monochrome);color:var(--ic-button-secondary-text-hover-monochrome)}:host(.ic-button-variant-secondary.monochrome) ::slotted(a:hover),:host(.ic-button-variant-icon-secondary.monochrome) ::slotted(a:hover){background-color:var(\n --ic-button-secondary-background-hover-monochrome\n ) !important}:host(.ic-button-variant-secondary.monochrome) .button:active,:host(.ic-button-variant-icon-secondary.monochrome) .button:active{background-color:var(--ic-button-secondary-background-pressed-monochrome);border-color:var(--ic-button-secondary-border-pressed-monochrome);color:var(--ic-button-secondary-text-pressed-monochrome)}:host(.ic-button-variant-secondary.monochrome) ::slotted(a:active),:host(.ic-button-variant-icon-secondary.monochrome) ::slotted(a:active){background-color:var(\n --ic-button-secondary-background-pressed-monochrome\n ) !important}:host(.ic-button-variant-secondary.ic-button-loading.monochrome) .button,:host(.ic-button-variant-icon-secondary.ic-button-loading.monochrome) .button{background-color:var(\n --ic-button-secondary-background-pressed-monochrome\n ) !important;border-color:var(--ic-button-secondary-border-pressed-monochrome);color:var(--ic-button-secondary-text-pressed-monochrome);--button-loading-inner-color:var(\n --ic-button-secondary-text-pressed-monochrome\n );--button-loading-outer-color:var(\n --ic-button-secondary-background-pressed-monochrome\n )}:host(.ic-button-variant-secondary.ic-button-disabled.monochrome) .button,:host(.ic-button-variant-icon-secondary.ic-button-disabled.monochrome) .button{background:none;border-color:var(--ic-button-secondary-border-disabled-monochrome);color:var(--ic-button-secondary-text-disabled-monochrome)}:host(.ic-button-variant-secondary.ic-button-disabled.monochrome) ::slotted(a),:host(.ic-button-variant-icon-secondary.ic-button-disabled.monochrome) ::slotted(a){background:none !important}:host(.ic-button-variant-secondary.background.monochrome) .button,:host(.ic-button-variant-icon-secondary.background.monochrome) .button{background-color:var(--ic-button-secondary-background-monochrome)}:host(.ic-button-variant-secondary.background.monochrome) ::slotted(a),:host(.ic-button-variant-icon-secondary.background.monochrome) ::slotted(a){background-color:var(--ic-button-secondary-background-monochrome) !important}:host(.ic-button-variant-secondary.background.monochrome) .button:hover,:host(.ic-button-variant-icon-secondary.background.monochrome) .button:hover{background-image:var(\n --ic-button-secondary-background-non-transparent-monochrome-hover\n )}:host(.ic-button-variant-secondary.background.monochrome) ::slotted(a:hover),:host(.ic-button-variant-icon-secondary.background.monochrome) ::slotted(a:hover){background-image:var(\n --ic-button-secondary-background-non-transparent-monochrome-hover\n ) !important}:host(.ic-button-variant-secondary.background.monochrome) .button:active,:host(.ic-button-variant-icon-secondary.background.monochrome) .button:active{background-image:var(\n --ic-button-secondary-background-non-transparent-monochrome-active\n )}:host(.ic-button-variant-secondary.background.monochrome) ::slotted(a:active),:host(.ic-button-variant-icon-secondary.background.monochrome) ::slotted(a:active){background-image:var(\n --ic-button-secondary-background-non-transparent-monochrome-active\n ) !important}:host(.ic-button-variant-tertiary) .button,:host(.ic-button-variant-icon-tertiary) .button,:host(.ic-button-variant-tertiary) ::slotted(a),:host(.ic-button-variant-icon-tertiary) ::slotted(a){color:var(--ic-button-tertiary-text-active);--ic-typography-color:var(--ic-button-tertiary-text-active)}:host(.ic-button-variant-tertiary) .button:hover,:host(.ic-button-variant-icon-tertiary) .button:hover{background-color:var(--ic-button-tertiary-background-hover-active);color:var(--ic-button-tertiary-text-hover-active)}:host(.ic-button-variant-tertiary) ::slotted(a:hover),:host(.ic-button-variant-icon-tertiary) ::slotted(a:hover){background-color:var(\n --ic-button-tertiary-background-hover-active\n ) !important}:host(.ic-button-variant-tertiary) .button:active,:host(.ic-button-variant-tertiary.ic-button-loading) .button,:host(.ic-button-variant-icon-tertiary) .button:active,:host(.ic-button-variant-icon-tertiary.ic-button-loading) .button{background-color:var(--ic-button-tertiary-background-pressed-active);color:var(--ic-button-tertiary-text-pressed-active);--button-loading-inner-color:var(--ic-button-tertiary-text-pressed-active);--button-loading-outer-color:var(--ic-button-tertiary-background-pressed)}:host(.ic-button-variant-tertiary) ::slotted(a:active),:host(.ic-button-variant-icon-tertiary) ::slotted(a:active){background-color:var(\n --ic-button-tertiary-background-pressed-active\n ) !important}:host(.ic-button-variant-tertiary.ic-button-disabled) .button,:host(.ic-button-variant-icon-tertiary.ic-button-disabled) .button{color:var(--ic-button-tertiary-text-disabled);background:none}:host(.ic-button-variant-tertiary.ic-button-disabled) ::slotted(a),:host(.ic-button-variant-icon-tertiary.ic-button-disabled) ::slotted(a){background:none !important}:host(.ic-button-variant-tertiary.background) .button,:host(.ic-button-variant-icon-tertiary.background) .button{background-color:var(--ic-button-tertiary-background)}:host(.ic-button-variant-tertiary.background) ::slotted(a),:host(.ic-button-variant-icon-tertiary.background) ::slotted(a){background-color:var(--ic-button-tertiary-background) !important}:host(.ic-button-variant-tertiary.background) .button:hover,:host(.ic-button-variant-icon-tertiary.background) .button:hover{background-image:var(--ic-button-tertiary-background-non-transparent-hover)}:host(.ic-button-variant-tertiary.background) ::slotted(a:hover),:host(.ic-button-variant-icon-tertiary.background) ::slotted(a:hover){background-image:var(\n --ic-button-tertiary-background-non-transparent-hover\n ) !important}:host(.ic-button-variant-tertiary.background) .button:active,:host(.ic-button-variant-icon-tertiary.background) .button:active{background-image:var(--ic-button-tertiary-background-non-transparent-active)}:host(.ic-button-variant-tertiary.background) ::slotted(a:active),:host(.ic-button-variant-icon-tertiary.background) ::slotted(a:active){background-image:var(\n --ic-button-tertiary-background-non-transparent-active\n ) !important}:host(.ic-button-variant-tertiary.monochrome) .button,:host(.ic-button-variant-tertiary.monochrome) ::slotted(a),:host(.ic-button-variant-icon-tertiary.monochrome) .button,:host(.ic-button-variant-icon-tertiary.monochrome) ::slotted(a){color:var(--ic-button-tertiary-text-monochrome);--ic-typography-color:var(--ic-button-tertiary-text-monochrome)}:host(.ic-button-variant-tertiary.monochrome) .button:hover,:host(.ic-button-variant-icon-tertiary.monochrome) .button:hover{background-color:var(--ic-button-tertiary-background-hover-monochrome);color:var(--ic-button-tertiary-text-hover-monochrome)}:host(.ic-button-variant-tertiary.monochrome) ::slotted(a:hover),:host(.ic-button-variant-icon-tertiary.monochrome) ::slotted(a:hover){background-color:var(\n --ic-button-tertiary-background-hover-monochrome\n ) !important}:host(.ic-button-variant-tertiary.monochrome) .button:active,:host(.ic-button-variant-tertiary.ic-button-loading.monochrome) .button,:host(.ic-button-variant-icon-tertiary.monochrome) .button:active,:host(.ic-button-variant-icon-tertiary.ic-button-loading.monochrome) .button{background-color:var(--ic-button-tertiary-background-pressed-monochrome);color:var(--ic-button-tertiary-text-pressed-monochrome);--button-loading-inner-color:var(\n --ic-button-tertiary-text-pressed-monochrome\n );--button-loading-outer-color:var(\n --ic-button-tertiary-background-pressed-monochrome\n )}:host(.ic-button-variant-tertiary.monochrome) ::slotted(a:active),:host(.ic-button-variant-icon-tertiary.monochrome) ::slotted(a:active){background-color:var(\n --ic-button-tertiary-background-pressed-monochrome\n ) !important}:host(.ic-button-variant-tertiary.ic-button-disabled.monochrome) .button,:host(.ic-button-variant-icon-tertiary.ic-button-disabled.monochrome) .button{color:var(--ic-button-tertiary-text-disabled-monochrome);background:none}:host(.ic-button-variant-tertiary.ic-button-disabled.monochrome) ::slotted(a),:host(.ic-button-variant-icon-tertiary.ic-button-disabled.monochrome) ::slotted(a){background:none !important}:host(.ic-button-variant-tertiary.background.monochrome) .button,:host(.ic-button-variant-icon-tertiary.background.monochrome) .button{background-color:var(--ic-button-tertiary-background-monochrome)}:host(.ic-button-variant-tertiary.background.monochrome) ::slotted(a),:host(.ic-button-variant-icon-tertiary.background.monochrome) ::slotted(a){background-color:var(--ic-button-tertiary-background-monochrome) !important}:host(.ic-button-variant-tertiary.background.monochrome) .button:hover,:host(.ic-button-variant-icon-tertiary.background.monochrome) .button:hover{background-image:var(\n --ic-button-tertiary-background-non-transparent-monochrome-hover\n )}:host(.ic-button-variant-tertiary.background.monochrome) ::slotted(a:hover),:host(.ic-button-variant-icon-tertiary.background.monochrome) ::slotted(a:hover){background-image:var(\n --ic-button-tertiary-background-non-transparent-monochrome-hover\n ) !important}:host(.ic-button-variant-tertiary.background.monochrome) .button:active,:host(.ic-button-variant-icon-tertiary.background.monochrome) .button:active{background-image:var(\n --ic-button-tertiary-background-non-transparent-monochrome-active\n )}:host(.ic-button-variant-tertiary.background.monochrome) ::slotted(a:active),:host(.ic-button-variant-icon-tertiary.background.monochrome) ::slotted(a:active){background-image:var(\n --ic-button-tertiary-background-non-transparent-monochrome-active\n ) !important}:host(.ic-button-variant-destructive) .button,:host(.ic-button-variant-icon-destructive) .button{color:var(--ic-button-destructive-text);background-color:var(--ic-button-destructive-background);text-transform:uppercase}:host(.ic-button-variant-destructive) ::slotted(a),:host(.ic-button-variant-icon-destructive) ::slotted(a){color:var(--ic-button-destructive-text) !important;--ic-typography-color:var(--ic-button-destructive-text) !important;background-color:var(--ic-button-destructive-background) !important;text-transform:uppercase !important}:host(.ic-button-variant-destructive) .button:hover,:host(.ic-button-variant-icon-destructive) .button:hover{background-color:var(--ic-button-destructive-background-hover)}:host(.ic-button-variant-destructive) ::slotted(a:hover),:host(.ic-button-variant-icon-destructive) ::slotted(a:hover){background-color:var(--ic-button-destructive-background-hover) !important}:host(.ic-button-variant-destructive) .button:active,:host(.ic-button-variant-destructive.ic-button-loading) .button,:host(.ic-button-variant-icon-destructive.ic-button-loading) .button{color:var(--ic-button-primary-text);background-color:var(--ic-button-destructive-background-pressed);--button-loading-inner-color:var(--ic-button-primary-text);--button-loading-outer-color:var(--ic-button-destructive-background-pressed)}:host(.ic-button-variant-destructive) ::slotted(a:active),:host(.ic-button-variant-icon-destructive) ::slotted(a:active){background-color:var(--ic-button-destructive-background-pressed) !important}:host(.ic-button-variant-destructive.ic-button-disabled) .button,:host(.ic-button-variant-icon-destructive.ic-button-disabled) .button{background-color:var(--ic-button-destructive-background-disabled);color:var(--ic-button-destructive-text-disabled)}:host(.ic-button-variant-destructive.ic-button-disabled) ::slotted(a),:host(.ic-button-variant-icon-destructive.ic-button-disabled) ::slotted(a){background-color:var(--ic-button-destructive-background-disabled) !important}:host(.ic-button-variant-icon) .button{color:var(--ic-button-icon-color);background-color:var(--ic-button-icon-color-background);min-width:0;gap:var(--ic-space-xs)}:host(.ic-button-variant-icon) ::slotted(a){color:var(--ic-button-icon-color);background-color:var(--ic-button-icon-color-background) !important;min-width:0;gap:var(--ic-space-xs)}:host(.ic-button-variant-icon) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.ic-button-variant-icon) .button:hover{color:var(--ic-button-icon-color-hover);background-color:var(--ic-button-icon-color-background-hover)}:host(.ic-button-variant-icon) ::slotted(a:hover){color:var(--ic-button-icon-color-hover);background-color:var(--ic-button-icon-color-background-hover) !important}:host(.ic-button-variant-icon) .button:active:not(:focus),:host(.ic-button-variant-icon.ic-button-loading) .button{color:var(--ic-button-icon-color-active);background-color:var(--ic-button-icon-color-background-active)}:host(.ic-button-variant-icon) ::slotted(a:active:not(:focus)){color:var(--ic-button-icon-color-active);background-color:var(--ic-button-icon-color-background-active) !important}:host(.ic-button-variant-icon.ic-button-disabled) .button{color:var(--ic-color-icon-disabled-mid);background:none}:host(.ic-button-variant-icon.ic-button-disabled) ::slotted(a){color:var(--ic-color-icon-disabled-mid);background:none !important}:host(.ic-button-variant-icon-primary) .button,:host(.ic-button-variant-icon-primary) ::slotted(a){min-width:0;gap:var(--ic-space-xs);color:var(--ic-button-primary-icon)}:host(.ic-button-variant-icon-primary.monochrome) .button,:host(.ic-button-variant-primary.monochrome:not(.ic-button-disabled)) ::slotted(svg){color:var(--ic-button-primary-icon-monochrome)}:host(.ic-button-variant-icon-primary) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.ic-button-variant-icon.monochrome) ::slotted(a),:host(.ic-button-variant-icon.monochrome) ::slotted(svg){color:var(--ic-button-icon-monochrome)}:host(.ic-button-variant-icon-secondary) .button,:host(.ic-button-variant-icon-secondary) ::slotted(a){min-width:0;gap:var(--ic-space-xs)}:host(.ic-button-variant-icon-secondary) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.ic-button-variant-icon-tertiary) .button,:host(.ic-button-variant-icon-tertiary) ::slotted(a){min-width:0;gap:var(--ic-space-xs)}:host(.ic-button-variant-icon-tertiary) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.ic-button-variant-icon-destructive) .button,:host(.ic-button-variant-icon-destructive) ::slotted(a){min-width:0;gap:var(--ic-space-xs)}:host(.ic-button-variant-icon-destructive) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.ic-button-size-medium) .button{height:var(--height, 2.5rem);padding:var(--ic-space-xs) var(--ic-space-md)}:host(.ic-button-size-medium) ::slotted(a){height:var(--height, 2.5rem) !important;padding:var(--ic-space-xs) var(--ic-space-md) !important}:host(.ic-button-size-small) .button{height:var(--height, var(--ic-space-xl));padding:var(--ic-space-xxs) var(--ic-space-md)}:host(.ic-button-size-small) ::slotted(a){height:var(--height, var(--ic-space-xl)) !important;padding:var(--ic-space-xxs) var(--ic-space-md) !important}:host(.ic-button-size-large) .button{height:var(--height, var(--ic-space-xxl));padding:var(--ic-space-sm) var(--ic-space-md)}:host(.ic-button-size-large) ::slotted(a){height:var(--height, var(--ic-space-xxl)) !important;padding:var(--ic-space-sm) var(--ic-space-md) !important}:host(.ic-button-size-medium.ic-button-variant-icon) .button,:host(.ic-button-size-medium.ic-button-variant-icon-primary) .button,:host(.ic-button-size-medium.ic-button-variant-icon-secondary) .button,:host(.ic-button-size-medium.ic-button-variant-icon-tertiary) .button,:host(.ic-button-size-medium.ic-button-variant-icon-destructive) .button{height:var(--height, var(--ic-space-xl));width:var(--ic-space-xl);padding:0.375rem}:host(.ic-button-size-medium.ic-button-variant-icon-primary) ::slotted(a),:host(.ic-button-size-medium.ic-button-variant-icon-secondary) ::slotted(a),:host(.ic-button-size-medium.ic-button-variant-icon-tertiary) ::slotted(a),:host(.ic-button-size-medium.ic-button-variant-icon-destructive) ::slotted(a){height:var(--height, var(--ic-space-xl)) !important;width:var(--ic-space-xl) !important;padding:0.375rem !important}:host(.ic-button-size-small.ic-button-variant-icon) .button,:host(.ic-button-size-small.ic-button-variant-icon-primary) .button,:host(.ic-button-size-small.ic-button-variant-icon-secondary) .button,:host(.ic-button-size-small.ic-button-variant-icon-tertiary) .button,:host(.ic-button-size-small.ic-button-variant-icon-destructive) .button{height:var(--height, var(--ic-space-lg));width:var(--ic-space-lg);padding:var(--ic-space-xxs)}:host(.ic-button-size-small.ic-button-variant-icon-primary) ::slotted(a),:host(.ic-button-size-small.ic-button-variant-icon-secondary) ::slotted(a),:host(.ic-button-size-small.ic-button-variant-icon-tertiary) ::slotted(a),:host(.ic-button-size-small.ic-button-variant-icon-destructive) ::slotted(a),:host(.ic-button-size-small.ic-button-variant-icon) ::slotted(a){height:var(--height, var(--ic-space-lg)) !important;width:var(--ic-space-lg) !important;padding:var(--ic-space-xxs) !important}:host(.ic-button-size-large.ic-button-variant-icon) .button,:host(.ic-button-size-large.ic-button-variant-icon-primary) .button,:host(.ic-button-size-large.ic-button-variant-icon-secondary) .button,:host(.ic-button-size-large.ic-button-variant-icon-tertiary) .button,:host(.ic-button-size-large.ic-button-variant-icon-destructive) .button{height:var(--height, 2.5rem);width:2.5rem;padding:var(--ic-space-xs)}:host(.ic-button-size-large.ic-button-variant-icon-destructive) .button,:host(.ic-button-size-large.ic-button-variant-icon-primary) ::slotted(a),:host(.ic-button-size-large.ic-button-variant-icon-secondary) ::slotted(a),:host(.ic-button-size-large.ic-button-variant-icon-tertiary) ::slotted(a),:host(.ic-button-size-large.ic-button-variant-icon-destructive) ::slotted(a),:host(.ic-button-size-large.ic-button-variant-icon) ::slotted(a){height:var(--height, 2.5rem) !important;width:2.5rem !important;padding:var(--ic-space-xs) !important}:host(.ic-button-full-width),:host(.ic-button-full-width) .button{width:100%}:host(.ic-button-full-width) ::slotted(a){width:100% !important}div.loading-container{position:relative;align-items:center;width:100%}ic-loading-indicator{--inner-color:var(--button-loading-inner-color);--outer-color:var(--button-loading-outer-color), transparent}@keyframes loading-animation{0%{width:0%;left:0%}25%{width:0%;left:0%;opacity:0}50%{width:100%;left:0%;opacity:1}75%{width:0%;left:100%}100%{width:0%;left:100%;opacity:0}}div.icon-container{box-sizing:border-box;width:var(--ic-space-lg);height:var(--ic-space-lg);display:flex;justify-content:center;align-items:center;margin-right:var(--ic-space-xs)}div.right-icon{margin-right:auto;margin-left:var(--ic-space-xs)}:host(.ic-button-full-width) .right-icon{margin-right:var(--ic-space-xs)}::slotted(:not(ic-badge)){width:var(--icon-width) !important;height:var(--icon-height) !important;fill:currentcolor !important;pointer-events:none}:host(.ic-button-variant-icon) .button .icon-container{margin:0;pointer-events:none}:host(.search-submit-button) ::slotted(svg){--icon-height:1.25rem;--icon-width:1.25rem;color:var(--ic-atoms-input-search-button)}:host(.search-submit-button-small) ::slotted(svg){--icon-height:1rem;--icon-width:1rem;color:var(--ic-atoms-input-search-button)}:host(.search-submit-button) .button:focus{box-shadow:none}:host(.search-submit-button) .button:not(:active):focus{box-shadow:none;background-color:var(--ic-action-default-bg-hover)}:host(.search-submit-button) .button:not(:active):focus ::slotted(svg){color:var(--ic-button-primary-text)}:host(.search-submit-button){display:flex;align-items:center;margin:0 var(--ic-space-xxs)}:host(.ic-button-variant-icon) .button,:host(.ic-button-variant-icon) ::slotted(a){background-color:inherit;min-width:0;gap:var(--ic-space-xs)}:host(.button-variant-icon) .button,:host(.button-variant-icon) ::slotted(a){color:var(--button-default);min-width:0;gap:var(--ic-space-xs)}:host(.button-variant-icon) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.button-variant-icon) .button:hover,:host(.button-variant-icon) ::slotted(a:hover){background-color:var(--button-default-background-hover);color:var(--button-default-hover)}:host(.button-variant-icon) .button:active:not(:focus),:host(.button-variant-icon) ::slotted(a:active:not(:focus)),:host(.button-variant-icon.loading) .button{background-color:var(--button-default-background-active);color:var(--button-default-active)}:host(.button-variant-icon.disabled) .button,:host(.button-variant-icon.disabled) ::slotted(a){color:var(--ic-color-icon-disabled-mid);background:none}:host(.clear-button){margin:0 var(--ic-space-xxs)}:host(.clear-button) .button:focus,:host(.calendar-button) .button:focus{box-shadow:none}:host(.dismiss-icon) .button,:host(.clear-button) .button,:host(.dismiss-icon) ::slotted(a),:host(.clear-button) ::slotted(a){background-color:inherit;color:var(--ic-atoms-input-clear-button)}:host(.dismiss-icon) .button:hover,:host(.clear-button) .button:hover,:host(.dismiss-icon) ::slotted(a:hover),:host(.clear-button) ::slotted(a:hover){color:var(--ic-atoms-input-clear-button)}:host(.dismiss-icon),:host(.clear-button){color:var(--ic-atoms-input-clear-button);margin:0 var(--ic-space-xxs)}:host(.dismiss-icon) .button:focus,:host(.clear-button) .button:focus,:host(.calendar-button) .button:focus{box-shadow:none}:host(.dismiss-icon) .button:not(:active):focus ::slotted(svg),:host(.clear-button) .button:not(:active):focus ::slotted(svg){background-color:var(--ic-atoms-input-clear-button-focus-inner);color:var(--ic-button-primary-text);}:host(.menu-close-button) ::slotted(svg){--icon-height:0.875rem;--icon-width:0.875rem;color:var(--ic-top-navigation-icon-active)}:host(.popout-menu-button) .button{height:var(--height);justify-content:left;border-radius:0;white-space:pre-line;text-align:start}:host(.popout-menu-button) div.icon-container{flex:none}:host(.popout-menu-button) .button:focus{box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset)}.ic-button-describedby{display:none}:host .ic-tooltip{display:block}:host .arrow-dropdown{margin-top:auto}:host .dropdown-expanded{transform:rotate(180deg);margin-bottom:var(--ic-space-xxxs)}:host(.dropdown-no-icon) .button{padding-right:var(--ic-space-xs)}slot[name=\"router-item\"]::slotted(a){pointer-events:all}::slotted(a){font-size:0.875rem !important;border:none !important;vertical-align:middle !important}:host(#menu-button.ic-theme-dark){--ic-button-secondary-background-hover-monochrome:var(\n --ic-action-dark-bg-hover\n );--ic-button-secondary-background-pressed-monochrome:var(\n --ic-action-dark-bg-pressed\n );--ic-button-secondary-text-hover-monochrome:var(\n --ic-action-monochrome-hover-dark\n );--ic-button-secondary-text-pressed-monochrome:var(\n --ic-action-monochrome-pressed-dark\n );--ic-button-secondary-border-hover-monochrome:var(\n --ic-color-border-neutral-hover-dark\n );--ic-button-secondary-border-pressed-monochrome:var(\n --ic-color-border-neutral-pressed-dark\n )}:host(#menu-button.ic-theme-light){--ic-button-secondary-background-hover-monochrome:var(\n --ic-action-light-bg-hover\n );--ic-button-secondary-background-pressed-monochrome:var(\n --ic-action-light-bg-pressed\n );--ic-button-secondary-text-hover-monochrome:var(\n --ic-action-monochrome-hover\n );--ic-button-secondary-text-pressed-monochrome:var(\n --ic-action-monochrome-pressed\n );--ic-button-secondary-border-hover-monochrome:var(\n --ic-color-border-neutral-hover-light\n );--ic-button-secondary-border-pressed-monochrome:var(\n --ic-color-border-neutral-default\n )}@media (forced-colors: active){.button,::slotted(a){border:0.125rem solid transparent !important}.search-submit-button ::slotted(a),.ic-button-variant-icon ::slotted(a),.clear-button ::slotted(a),.search-submit-button ::slotted(svg),.ic-button-variant-icon ::slotted(svg),.clear-button ::slotted(svg){color:HighlightText}:host(.ic-button-variant-icon.monochrome) ::slotted(a),:host(.ic-button-variant-icon.monochrome) ::slotted(svg){color:white}:host(.dismiss-icon) .button:not(:active):focus ::slotted(svg),:host(.clear-button) .button:not(:active):focus ::slotted(svg){color:white !important;background-color:inherit}:host(.ic-button-variant-primary:not(.ic-button-disabled)) ::slotted(svg){color:currentcolor !important}}:host(.flip) ::slotted(svg){transform:scaleX(-1)}";
|
4894
|
+
const icButtonCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:inline-block;position:relative;--icon-width:100%;--icon-height:100%}.button,::slotted(a){font-family:var(--ic-font-body-family);text-decoration:none;font-weight:600;font-size:0.875rem;transition:var(--ic-easing-transition-fast);border-radius:var(--ic-border-radius);min-width:var(--min-width, 6.25rem);display:inline-flex;flex-direction:row;justify-content:center;align-items:center;background:none;border:none;box-sizing:border-box;white-space:nowrap;vertical-align:middle}:host(.with-badge) .button{border-radius:0.2188rem}.button:hover,::slotted(a:hover){cursor:pointer}.button:focus,::slotted(a:focus){box-shadow:var(--ic-border-focus)}.button:focus-visible,::slotted(a:focus-visible){outline:var(--ic-hc-focus-outline)}:host(.ic-button-disabled),:host(.ic-button-disabled) .button,:host(.ic-button-disabled) ::slotted(a),:host(.ic-button-loading),:host(.ic-button-loading) .button{pointer-events:none}:host(.top-icon) .button{flex-direction:column;--height:fit-content}:host(.top-icon) .button .icon-container{margin-right:0}:host(.ic-button-variant-primary) .button,:host(.ic-button-variant-icon-primary) .button{color:var(--ic-button-primary-text);background-color:var(--ic-button-primary-background)}:host(.ic-button-variant-primary:not(.ic-button-disabled)) ::slotted(svg){color:var(--ic-button-primary-icon)}:host(.ic-button-variant-primary) ::slotted(a),:host(.ic-button-variant-icon-primary) ::slotted(a){--ic-typography-color:var(--ic-button-primary-text);color:var(--ic-button-primary-text);background-color:var(--ic-button-primary-background) !important}:host(.ic-button-variant-primary) .button:hover,:host(.ic-button-variant-icon-primary) .button:hover{background-color:var(--ic-button-primary-background-hover)}:host(.ic-button-variant-primary) ::slotted(a:hover),:host(.ic-button-variant-icon-primary) ::slotted(a:hover){background-color:var(--ic-button-primary-background-hover) !important}:host(.ic-button-variant-primary.ic-button-loading) .button,:host(.ic-button-variant-primary) .button:active,:host(.ic-button-variant-icon-primary.ic-button-loading) .button,:host(.ic-button-variant-icon-primary) .button:active{background-color:var(--ic-button-primary-background-pressed);--button-loading-inner-color:var(--ic-button-primary-text);--button-loading-outer-color:var(--ic-button-primary-background-pressed)}:host(.ic-button-variant-primary) ::slotted(a:active),:host(.ic-button-variant-icon-primary) ::slotted(a:active){background-color:var(--ic-button-primary-background-pressed) !important}:host(.ic-button-variant-primary.ic-button-disabled) .button,:host(.ic-button-variant-icon-primary.ic-button-disabled) .button{background:var(--ic-button-primary-background-disabled);color:var(--ic-button-primary-text-disabled)}:host(.ic-button-variant-primary.ic-button-disabled) ::slotted(a),:host(.ic-button-variant-icon-primary.ic-button-disabled) ::slotted(a){background:var(--ic-button-primary-background-disabled) !important;--ic-typography-color:var(--ic-button-primary-text-disabled) !important;color:var(--ic-button-primary-text-disabled) !important}:host(.ic-button-variant-primary.monochrome) .button,:host(.ic-button-variant-icon-primary.monochrome) .button{color:var(--ic-button-primary-text-monochrome);background-color:var(--ic-button-primary-background-monochrome)}:host(.ic-button-variant-primary.monochrome) ::slotted(a),:host(.ic-button-variant-icon-primary.monochrome) ::slotted(a){background-color:var(--ic-button-primary-background-monochrome) !important}:host(.ic-button-variant-primary.monochrome) .button:hover,:host(.ic-button-variant-icon-primary.monochrome) .button:hover{background-color:var(--ic-button-primary-background-hover-monochrome)}:host(.ic-button-variant-primary.monochrome) ::slotted(a:hover),:host(.ic-button-variant-icon-primary.monochrome) ::slotted(a:hover){background-color:var(\n --ic-button-primary-background-hover-monochrome\n ) !important}:host(.ic-button-variant-primary.ic-button-loading.monochrome) .button,:host(.ic-button-variant-primary.monochrome) .button:active,:host(.ic-button-variant-icon-primary.ic-button-loading.monochrome) .button,:host(.ic-button-variant-icon-primary.monochrome) .button:active{background-color:var(--ic-button-primary-background-pressed-monochrome);--button-loading-inner-color:var(--ic-button-primary-text-monochrome);--button-loading-outer-color:var(--ic-button-primary-background-monochrome)}:host(.ic-button-variant-primary.monochrome) ::slotted(a:active),:host(.ic-button-variant-icon-primary.monochrome) ::slotted(a:active){background-color:var(\n --ic-button-primary-background-pressed-monochrome\n ) !important}:host(.ic-button-variant-primary.ic-button-disabled.monochrome) .button,:host(.ic-button-variant-icon-primary.ic-button-disabled.monochrome) .button{background-color:var(--ic-button-primary-background-disabled-monochrome);color:var(--ic-button-primary-text-disabled-monochrome)}:host(.ic-button-variant-primary.ic-button-disabled.monochrome) ::slotted(a),:host(.ic-button-variant-icon-primary.ic-button-disabled.monochrome) ::slotted(a){background-color:var(\n --ic-button-primary-background-disabled-monochrome\n ) !important}:host(.ic-button-variant-secondary) .button,:host(.ic-button-variant-icon-secondary) .button{border:var(--ic-border-width) solid var(--ic-button-secondary-border);color:var(--ic-button-secondary-text)}:host(.ic-button-variant-secondary) ::slotted(a),:host(.ic-button-variant-icon-secondary) ::slotted(a){border:var(--ic-border-width) solid var(--ic-button-secondary-border) !important;color:var(--ic-button-secondary-text) !important;--ic-typography-color:var(--ic-button-secondary-text) !important}:host(.ic-button-variant-secondary) .button:hover,:host(.ic-button-variant-icon-secondary) .button:hover{background-color:var(--ic-button-secondary-background-hover-active);border-color:var(--ic-button-secondary-border-hover);color:var(--ic-button-secondary-text-hover-active)}:host(.ic-button-variant-secondary) ::slotted(a:hover),:host(.ic-button-variant-icon-secondary) ::slotted(a:hover){background-color:var(\n --ic-button-secondary-background-hover-active\n ) !important}:host(.ic-button-variant-secondary) .button:active,:host(.ic-button-variant-icon-secondary) .button:active{border-color:var(--ic-button-secondary-border-pressed);background-color:var(--ic-button-secondary-background-pressed-active);color:var(--ic-button-secondary-text-pressed-active)}:host(.ic-button-variant-secondary) ::slotted(a:active),:host(.ic-button-variant-icon-secondary) ::slotted(a:active){background-color:var(\n --ic-button-secondary-background-pressed-active\n ) !important}:host(.ic-button-variant-secondary.ic-button-loading) .button,:host(.ic-button-variant-icon-secondary.ic-button-loading) .button{border-color:var(--ic-button-secondary-border-pressed);background-color:var(\n --loading-button-background,\n var(--ic-button-secondary-background-pressed-active)\n ) !important;color:var(--ic-button-secondary-text-pressed-active);--button-loading-inner-color:var(--ic-button-secondary-border-pressed);--button-loading-outer-color:var(\n --ic-button-secondary-background-pressed-active\n )}:host(.ic-button-variant-secondary.ic-button-disabled) .button,:host(.ic-button-variant-icon-secondary.ic-button-disabled) .button{border-color:var(--ic-button-secondary-border-disabled);color:var(--ic-button-secondary-text-disabled);background:none}:host(.ic-button-variant-secondary.ic-button-disabled) ::slotted(a),:host(.ic-button-variant-icon-secondary.ic-button-disabled) ::slotted(a){background:none !important}:host(.ic-button-variant-secondary.background) .button,:host(.ic-button-variant-icon-secondary.background) .button{background-color:var(--ic-button-secondary-background)}:host(.ic-button-variant-secondary.background) ::slotted(a),:host(.ic-button-variant-icon-secondary.background) ::slotted(a){background-color:var(--ic-button-secondary-background) !important}:host(.ic-button-variant-secondary.background) .button:hover,:host(.ic-button-variant-icon-secondary.background) .button:hover{background-image:var(--ic-button-secondary-background-non-transparent-hover)}:host(.ic-button-variant-secondary.background) ::slotted(a:hover),:host(.ic-button-variant-icon-secondary.background) ::slotted(a:hover){background-image:var(\n --ic-button-secondary-background-non-transparent-hover\n ) !important}:host(.ic-button-variant-secondary.background) .button:active,:host(.ic-button-variant-icon-secondary.background) .button:active{background-image:var(\n --ic-button-secondary-background-non-transparent-active\n )}:host(.ic-button-variant-secondary.background) ::slotted(a:active),:host(.ic-button-variant-icon-secondary.background) ::slotted(a:active){background-image:var(\n --ic-button-secondary-background-non-transparent-active\n ) !important}:host(.ic-button-variant-secondary.monochrome) .button,:host(.ic-button-variant-icon-secondary.monochrome) .button{background-color:none;border:var(--ic-border-width) solid\n var(--ic-button-secondary-border-monochrome);color:var(--ic-button-secondary-text-monochrome)}:host(.ic-button-variant-secondary.monochrome) ::slotted(a),:host(.ic-button-variant-icon-secondary.monochrome) ::slotted(a){background-color:none !important}:host(.ic-button-variant-secondary.monochrome) .button:hover,:host(.ic-button-variant-icon-secondary.monochrome) .button:hover{background-color:var(--ic-button-secondary-background-hover-monochrome);border-color:var(--ic-button-secondary-border-hover-monochrome);color:var(--ic-button-secondary-text-hover-monochrome)}:host(.ic-button-variant-secondary.monochrome) ::slotted(a:hover),:host(.ic-button-variant-icon-secondary.monochrome) ::slotted(a:hover){background-color:var(\n --ic-button-secondary-background-hover-monochrome\n ) !important}:host(.ic-button-variant-secondary.monochrome) .button:active,:host(.ic-button-variant-icon-secondary.monochrome) .button:active{background-color:var(--ic-button-secondary-background-pressed-monochrome);border-color:var(--ic-button-secondary-border-pressed-monochrome);color:var(--ic-button-secondary-text-pressed-monochrome)}:host(.ic-button-variant-secondary.monochrome) ::slotted(a:active),:host(.ic-button-variant-icon-secondary.monochrome) ::slotted(a:active){background-color:var(\n --ic-button-secondary-background-pressed-monochrome\n ) !important}:host(.ic-button-variant-secondary.ic-button-loading.monochrome) .button,:host(.ic-button-variant-icon-secondary.ic-button-loading.monochrome) .button{background-color:var(\n --ic-button-secondary-background-pressed-monochrome\n ) !important;border-color:var(--ic-button-secondary-border-pressed-monochrome);color:var(--ic-button-secondary-text-pressed-monochrome);--button-loading-inner-color:var(\n --ic-button-secondary-text-pressed-monochrome\n );--button-loading-outer-color:var(\n --ic-button-secondary-background-pressed-monochrome\n )}:host(.ic-button-variant-secondary.ic-button-disabled.monochrome) .button,:host(.ic-button-variant-icon-secondary.ic-button-disabled.monochrome) .button{background:none;border-color:var(--ic-button-secondary-border-disabled-monochrome);color:var(--ic-button-secondary-text-disabled-monochrome)}:host(.ic-button-variant-secondary.ic-button-disabled.monochrome) ::slotted(a),:host(.ic-button-variant-icon-secondary.ic-button-disabled.monochrome) ::slotted(a){background:none !important}:host(.ic-button-variant-secondary.background.monochrome) .button,:host(.ic-button-variant-icon-secondary.background.monochrome) .button{background-color:var(--ic-button-secondary-background-monochrome)}:host(.ic-button-variant-secondary.background.monochrome) ::slotted(a),:host(.ic-button-variant-icon-secondary.background.monochrome) ::slotted(a){background-color:var(--ic-button-secondary-background-monochrome) !important}:host(.ic-button-variant-secondary.background.monochrome) .button:hover,:host(.ic-button-variant-icon-secondary.background.monochrome) .button:hover{background-image:var(\n --ic-button-secondary-background-non-transparent-monochrome-hover\n )}:host(.ic-button-variant-secondary.background.monochrome) ::slotted(a:hover),:host(.ic-button-variant-icon-secondary.background.monochrome) ::slotted(a:hover){background-image:var(\n --ic-button-secondary-background-non-transparent-monochrome-hover\n ) !important}:host(.ic-button-variant-secondary.background.monochrome) .button:active,:host(.ic-button-variant-icon-secondary.background.monochrome) .button:active{background-image:var(\n --ic-button-secondary-background-non-transparent-monochrome-active\n )}:host(.ic-button-variant-secondary.background.monochrome) ::slotted(a:active),:host(.ic-button-variant-icon-secondary.background.monochrome) ::slotted(a:active){background-image:var(\n --ic-button-secondary-background-non-transparent-monochrome-active\n ) !important}:host(.ic-button-variant-tertiary) .button,:host(.ic-button-variant-icon-tertiary) .button,:host(.ic-button-variant-tertiary) ::slotted(a),:host(.ic-button-variant-icon-tertiary) ::slotted(a){color:var(--ic-button-tertiary-text-active);--ic-typography-color:var(--ic-button-tertiary-text-active)}:host(.ic-button-variant-tertiary) .button:hover,:host(.ic-button-variant-icon-tertiary) .button:hover{background-color:var(--ic-button-tertiary-background-hover-active);color:var(--ic-button-tertiary-text-hover-active)}:host(.ic-button-variant-tertiary) ::slotted(a:hover),:host(.ic-button-variant-icon-tertiary) ::slotted(a:hover){background-color:var(\n --ic-button-tertiary-background-hover-active\n ) !important}:host(.ic-button-variant-tertiary) .button:active,:host(.ic-button-variant-tertiary.ic-button-loading) .button,:host(.ic-button-variant-icon-tertiary) .button:active,:host(.ic-button-variant-icon-tertiary.ic-button-loading) .button{background-color:var(--ic-button-tertiary-background-pressed-active);color:var(--ic-button-tertiary-text-pressed-active);--button-loading-inner-color:var(--ic-button-tertiary-text-pressed-active);--button-loading-outer-color:var(--ic-button-tertiary-background-pressed)}:host(.ic-button-variant-tertiary) ::slotted(a:active),:host(.ic-button-variant-icon-tertiary) ::slotted(a:active){background-color:var(\n --ic-button-tertiary-background-pressed-active\n ) !important}:host(.ic-button-variant-tertiary.ic-button-disabled) .button,:host(.ic-button-variant-icon-tertiary.ic-button-disabled) .button{color:var(--ic-button-tertiary-text-disabled);background:none}:host(.ic-button-variant-tertiary.ic-button-disabled) ::slotted(a),:host(.ic-button-variant-icon-tertiary.ic-button-disabled) ::slotted(a){background:none !important}:host(.ic-button-variant-tertiary.background) .button,:host(.ic-button-variant-icon-tertiary.background) .button{background-color:var(--ic-button-tertiary-background)}:host(.ic-button-variant-tertiary.background) ::slotted(a),:host(.ic-button-variant-icon-tertiary.background) ::slotted(a){background-color:var(--ic-button-tertiary-background) !important}:host(.ic-button-variant-tertiary.background) .button:hover,:host(.ic-button-variant-icon-tertiary.background) .button:hover{background-image:var(--ic-button-tertiary-background-non-transparent-hover)}:host(.ic-button-variant-tertiary.background) ::slotted(a:hover),:host(.ic-button-variant-icon-tertiary.background) ::slotted(a:hover){background-image:var(\n --ic-button-tertiary-background-non-transparent-hover\n ) !important}:host(.ic-button-variant-tertiary.background) .button:active,:host(.ic-button-variant-icon-tertiary.background) .button:active{background-image:var(--ic-button-tertiary-background-non-transparent-active)}:host(.ic-button-variant-tertiary.background) ::slotted(a:active),:host(.ic-button-variant-icon-tertiary.background) ::slotted(a:active){background-image:var(\n --ic-button-tertiary-background-non-transparent-active\n ) !important}:host(.ic-button-variant-tertiary.monochrome) .button,:host(.ic-button-variant-tertiary.monochrome) ::slotted(a),:host(.ic-button-variant-icon-tertiary.monochrome) .button,:host(.ic-button-variant-icon-tertiary.monochrome) ::slotted(a){color:var(--ic-button-tertiary-text-monochrome);--ic-typography-color:var(--ic-button-tertiary-text-monochrome)}:host(.ic-button-variant-tertiary.monochrome) .button:hover,:host(.ic-button-variant-icon-tertiary.monochrome) .button:hover{background-color:var(--ic-button-tertiary-background-hover-monochrome);color:var(--ic-button-tertiary-text-hover-monochrome)}:host(.ic-button-variant-tertiary.monochrome) ::slotted(a:hover),:host(.ic-button-variant-icon-tertiary.monochrome) ::slotted(a:hover){background-color:var(\n --ic-button-tertiary-background-hover-monochrome\n ) !important}:host(.ic-button-variant-tertiary.monochrome) .button:active,:host(.ic-button-variant-tertiary.ic-button-loading.monochrome) .button,:host(.ic-button-variant-icon-tertiary.monochrome) .button:active,:host(.ic-button-variant-icon-tertiary.ic-button-loading.monochrome) .button{background-color:var(--ic-button-tertiary-background-pressed-monochrome);color:var(--ic-button-tertiary-text-pressed-monochrome);--button-loading-inner-color:var(\n --ic-button-tertiary-text-pressed-monochrome\n );--button-loading-outer-color:var(\n --ic-button-tertiary-background-pressed-monochrome\n )}:host(.ic-button-variant-tertiary.monochrome) ::slotted(a:active),:host(.ic-button-variant-icon-tertiary.monochrome) ::slotted(a:active){background-color:var(\n --ic-button-tertiary-background-pressed-monochrome\n ) !important}:host(.ic-button-variant-tertiary.ic-button-disabled.monochrome) .button,:host(.ic-button-variant-icon-tertiary.ic-button-disabled.monochrome) .button{color:var(--ic-button-tertiary-text-disabled-monochrome);background:none}:host(.ic-button-variant-tertiary.ic-button-disabled.monochrome) ::slotted(a),:host(.ic-button-variant-icon-tertiary.ic-button-disabled.monochrome) ::slotted(a){background:none !important}:host(.ic-button-variant-tertiary.background.monochrome) .button,:host(.ic-button-variant-icon-tertiary.background.monochrome) .button{background-color:var(--ic-button-tertiary-background-monochrome)}:host(.ic-button-variant-tertiary.background.monochrome) ::slotted(a),:host(.ic-button-variant-icon-tertiary.background.monochrome) ::slotted(a){background-color:var(--ic-button-tertiary-background-monochrome) !important}:host(.ic-button-variant-tertiary.background.monochrome) .button:hover,:host(.ic-button-variant-icon-tertiary.background.monochrome) .button:hover{background-image:var(\n --ic-button-tertiary-background-non-transparent-monochrome-hover\n )}:host(.ic-button-variant-tertiary.background.monochrome) ::slotted(a:hover),:host(.ic-button-variant-icon-tertiary.background.monochrome) ::slotted(a:hover){background-image:var(\n --ic-button-tertiary-background-non-transparent-monochrome-hover\n ) !important}:host(.ic-button-variant-tertiary.background.monochrome) .button:active,:host(.ic-button-variant-icon-tertiary.background.monochrome) .button:active{background-image:var(\n --ic-button-tertiary-background-non-transparent-monochrome-active\n )}:host(.ic-button-variant-tertiary.background.monochrome) ::slotted(a:active),:host(.ic-button-variant-icon-tertiary.background.monochrome) ::slotted(a:active){background-image:var(\n --ic-button-tertiary-background-non-transparent-monochrome-active\n ) !important}:host(.ic-button-variant-destructive) .button,:host(.ic-button-variant-icon-destructive) .button{color:var(--ic-button-destructive-text);background-color:var(--ic-button-destructive-background);text-transform:uppercase}:host(.ic-button-variant-destructive) ::slotted(a),:host(.ic-button-variant-icon-destructive) ::slotted(a){color:var(--ic-button-destructive-text) !important;--ic-typography-color:var(--ic-button-destructive-text) !important;background-color:var(--ic-button-destructive-background) !important;text-transform:uppercase !important}:host(.ic-button-variant-destructive) .button:hover,:host(.ic-button-variant-icon-destructive) .button:hover{background-color:var(--ic-button-destructive-background-hover)}:host(.ic-button-variant-destructive) ::slotted(a:hover),:host(.ic-button-variant-icon-destructive) ::slotted(a:hover){background-color:var(--ic-button-destructive-background-hover) !important}:host(.ic-button-variant-destructive) .button:active,:host(.ic-button-variant-destructive.ic-button-loading) .button,:host(.ic-button-variant-icon-destructive.ic-button-loading) .button{color:var(--ic-button-primary-text);background-color:var(--ic-button-destructive-background-pressed);--button-loading-inner-color:var(--ic-button-primary-text);--button-loading-outer-color:var(--ic-button-destructive-background-pressed)}:host(.ic-button-variant-destructive) ::slotted(a:active),:host(.ic-button-variant-icon-destructive) ::slotted(a:active){background-color:var(--ic-button-destructive-background-pressed) !important}:host(.ic-button-variant-destructive.ic-button-disabled) .button,:host(.ic-button-variant-icon-destructive.ic-button-disabled) .button{background-color:var(--ic-button-destructive-background-disabled);color:var(--ic-button-destructive-text-disabled)}:host(.ic-button-variant-destructive.ic-button-disabled) ::slotted(a),:host(.ic-button-variant-icon-destructive.ic-button-disabled) ::slotted(a){background-color:var(--ic-button-destructive-background-disabled) !important}:host(.ic-button-variant-icon) .button{color:var(--ic-button-icon-color);background-color:var(--ic-button-icon-color-background);min-width:0;gap:var(--ic-space-xs)}:host(.ic-button-variant-icon) ::slotted(a){color:var(--ic-button-icon-color);background-color:var(--ic-button-icon-color-background) !important;min-width:0;gap:var(--ic-space-xs)}:host(.ic-button-variant-icon) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.ic-button-variant-icon) .button:hover{color:var(--ic-button-icon-color-hover);background-color:var(--ic-button-icon-color-background-hover)}:host(.ic-button-variant-icon) ::slotted(a:hover){color:var(--ic-button-icon-color-hover);background-color:var(--ic-button-icon-color-background-hover) !important}:host(.ic-button-variant-icon) .button:active:not(:focus),:host(.ic-button-variant-icon.ic-button-loading) .button{color:var(--ic-button-icon-color-active);background-color:var(--ic-button-icon-color-background-active)}:host(.ic-button-variant-icon) ::slotted(a:active:not(:focus)){color:var(--ic-button-icon-color-active);background-color:var(--ic-button-icon-color-background-active) !important}:host(.ic-button-variant-icon.ic-button-disabled) .button{color:var(--ic-color-icon-disabled-mid);background:none}:host(.ic-button-variant-icon.ic-button-disabled) ::slotted(a){color:var(--ic-color-icon-disabled-mid);background:none !important}:host(.ic-button-variant-icon-primary) .button,:host(.ic-button-variant-icon-primary) ::slotted(a){min-width:0;gap:var(--ic-space-xs);color:var(--ic-button-primary-icon)}:host(.ic-button-variant-icon-primary.monochrome) .button,:host(.ic-button-variant-primary.monochrome:not(.ic-button-disabled)) ::slotted(svg){color:var(--ic-button-primary-icon-monochrome)}:host(.ic-button-variant-icon-primary) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.ic-button-variant-icon.monochrome) ::slotted(a),:host(.ic-button-variant-icon.monochrome) ::slotted(svg){color:var(--ic-button-icon-monochrome)}:host(.ic-button-variant-icon-secondary) .button,:host(.ic-button-variant-icon-secondary) ::slotted(a){min-width:0;gap:var(--ic-space-xs)}:host(.ic-button-variant-icon-secondary) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.ic-button-variant-icon-tertiary) .button,:host(.ic-button-variant-icon-tertiary) ::slotted(a){min-width:0;gap:var(--ic-space-xs)}:host(.ic-button-variant-icon-tertiary) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.ic-button-variant-icon-destructive) .button,:host(.ic-button-variant-icon-destructive) ::slotted(a){min-width:0;gap:var(--ic-space-xs)}:host(.ic-button-variant-icon-destructive) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.ic-button-size-medium) .button{height:var(--height, 2.5rem);padding:var(--ic-space-xs) var(--ic-space-md)}:host(.ic-button-size-medium) ::slotted(a){height:var(--height, 2.5rem) !important;padding:var(--ic-space-xs) var(--ic-space-md) !important}:host(.ic-button-size-small) .button{height:var(--height, var(--ic-space-xl));padding:var(--ic-space-xxs) var(--ic-space-md)}:host(.ic-button-size-small) ::slotted(a){height:var(--height, var(--ic-space-xl)) !important;padding:var(--ic-space-xxs) var(--ic-space-md) !important}:host(.ic-button-size-large) .button{height:var(--height, var(--ic-space-xxl));padding:var(--ic-space-sm) var(--ic-space-md)}:host(.ic-button-size-large) ::slotted(a){height:var(--height, var(--ic-space-xxl)) !important;padding:var(--ic-space-sm) var(--ic-space-md) !important}:host(.ic-button-size-medium.ic-button-variant-icon) .button,:host(.ic-button-size-medium.ic-button-variant-icon-primary) .button,:host(.ic-button-size-medium.ic-button-variant-icon-secondary) .button,:host(.ic-button-size-medium.ic-button-variant-icon-tertiary) .button,:host(.ic-button-size-medium.ic-button-variant-icon-destructive) .button{height:var(--height, var(--ic-space-xl));width:var(--ic-space-xl);padding:0.375rem}:host(.ic-button-size-medium.ic-button-variant-icon-primary) ::slotted(a),:host(.ic-button-size-medium.ic-button-variant-icon-secondary) ::slotted(a),:host(.ic-button-size-medium.ic-button-variant-icon-tertiary) ::slotted(a),:host(.ic-button-size-medium.ic-button-variant-icon-destructive) ::slotted(a){height:var(--height, var(--ic-space-xl)) !important;width:var(--ic-space-xl) !important;padding:0.375rem !important}:host(.ic-button-size-small.ic-button-variant-icon) .button,:host(.ic-button-size-small.ic-button-variant-icon-primary) .button,:host(.ic-button-size-small.ic-button-variant-icon-secondary) .button,:host(.ic-button-size-small.ic-button-variant-icon-tertiary) .button,:host(.ic-button-size-small.ic-button-variant-icon-destructive) .button{height:var(--height, var(--ic-space-lg));width:var(--ic-space-lg);padding:var(--ic-space-xxs)}:host(.ic-button-size-small.ic-button-variant-icon-primary) ::slotted(a),:host(.ic-button-size-small.ic-button-variant-icon-secondary) ::slotted(a),:host(.ic-button-size-small.ic-button-variant-icon-tertiary) ::slotted(a),:host(.ic-button-size-small.ic-button-variant-icon-destructive) ::slotted(a),:host(.ic-button-size-small.ic-button-variant-icon) ::slotted(a){height:var(--height, var(--ic-space-lg)) !important;width:var(--ic-space-lg) !important;padding:var(--ic-space-xxs) !important}:host(.ic-button-size-large.ic-button-variant-icon) .button,:host(.ic-button-size-large.ic-button-variant-icon-primary) .button,:host(.ic-button-size-large.ic-button-variant-icon-secondary) .button,:host(.ic-button-size-large.ic-button-variant-icon-tertiary) .button,:host(.ic-button-size-large.ic-button-variant-icon-destructive) .button{height:var(--height, 2.5rem);width:2.5rem;padding:var(--ic-space-xs)}:host(.ic-button-size-large.ic-button-variant-icon-destructive) .button,:host(.ic-button-size-large.ic-button-variant-icon-primary) ::slotted(a),:host(.ic-button-size-large.ic-button-variant-icon-secondary) ::slotted(a),:host(.ic-button-size-large.ic-button-variant-icon-tertiary) ::slotted(a),:host(.ic-button-size-large.ic-button-variant-icon-destructive) ::slotted(a),:host(.ic-button-size-large.ic-button-variant-icon) ::slotted(a){height:var(--height, 2.5rem) !important;width:2.5rem !important;padding:var(--ic-space-xs) !important}:host(.ic-button-full-width),:host(.ic-button-full-width) .button{width:100%}:host(.ic-button-full-width) ::slotted(a){width:100% !important}div.loading-container{position:relative;align-items:center;width:100%}ic-loading-indicator{--inner-color:var(--button-loading-inner-color);--outer-color:var(--button-loading-outer-color), transparent}@keyframes loading-animation{0%{width:0%;left:0%}25%{width:0%;left:0%;opacity:0}50%{width:100%;left:0%;opacity:1}75%{width:0%;left:100%}100%{width:0%;left:100%;opacity:0}}div.icon-container{box-sizing:border-box;width:var(--ic-space-lg);height:var(--ic-space-lg);display:flex;justify-content:center;align-items:center;margin-right:var(--ic-space-xs)}div.right-icon{margin-right:auto;margin-left:var(--ic-space-xs)}:host(.ic-button-full-width) .right-icon{margin-right:var(--ic-space-xs)}::slotted(:not(ic-badge)){width:var(--icon-width) !important;height:var(--icon-height) !important;fill:currentcolor !important;pointer-events:none}:host(.ic-button-variant-icon) .button .icon-container{margin:0;pointer-events:none}:host(.search-submit-button) ::slotted(svg){--icon-height:1.25rem;--icon-width:1.25rem;color:var(--ic-atoms-input-search-button)}:host(.search-submit-button-small) ::slotted(svg){--icon-height:1rem;--icon-width:1rem;color:var(--ic-atoms-input-search-button)}:host(.search-submit-button) .button:focus{box-shadow:none}:host(.search-submit-button) .button:not(:active):focus{box-shadow:none;background-color:var(--ic-action-default-bg-hover)}:host(.search-submit-button) .button:not(:active):focus ::slotted(svg){color:var(--ic-button-primary-text)}:host(.search-submit-button){display:flex;align-items:center;margin:0 var(--ic-space-xxs)}:host(.ic-button-variant-icon) .button,:host(.ic-button-variant-icon) ::slotted(a){background-color:inherit;min-width:0;gap:var(--ic-space-xs)}:host(.button-variant-icon) .button,:host(.button-variant-icon) ::slotted(a){color:var(--button-default);min-width:0;gap:var(--ic-space-xs)}:host(.button-variant-icon) .icon-container{width:var(--ic-space-lg) !important;height:var(--ic-space-lg) !important}:host(.button-variant-icon) .button:hover,:host(.button-variant-icon) ::slotted(a:hover){background-color:var(--button-default-background-hover);color:var(--button-default-hover)}:host(.button-variant-icon) .button:active:not(:focus),:host(.button-variant-icon) ::slotted(a:active:not(:focus)),:host(.button-variant-icon.loading) .button{background-color:var(--button-default-background-active);color:var(--button-default-active)}:host(.button-variant-icon.disabled) .button,:host(.button-variant-icon.disabled) ::slotted(a){color:var(--ic-color-icon-disabled-mid);background:none}:host(.clear-button){margin:0 var(--ic-space-xxs)}:host(.clear-button) .button:focus,:host(.calendar-button) .button:focus{box-shadow:none}:host(.clear-button) .button,:host(.clear-button) ::slotted(a){background-color:inherit;color:var(--ic-atoms-input-clear-button)}:host(.clear-button) .button:hover,:host(.clear-button) ::slotted(a:hover){color:var(--ic-atoms-input-clear-button)}:host(.clear-button){color:var(--ic-atoms-input-clear-button);margin:0 var(--ic-space-xxs)}:host(.clear-button) .button:focus,:host(.calendar-button) .button:focus{box-shadow:none}:host(.clear-button) .button:not(:active):focus ::slotted(svg){background-color:var(--ic-atoms-input-clear-button-focus-inner);color:var(--ic-button-primary-text);}:host(.menu-close-button) ::slotted(svg){--icon-height:0.875rem;--icon-width:0.875rem;color:var(--ic-top-navigation-icon-active)}:host(.popout-menu-button) .button{height:var(--height);justify-content:left;border-radius:0;white-space:pre-line;text-align:start}:host(.popout-menu-button) div.icon-container{flex:none}:host(.popout-menu-button) .button:focus{box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset)}.ic-button-describedby{display:none}:host .ic-tooltip{display:block}:host .arrow-dropdown{margin-top:auto}:host .dropdown-expanded{transform:rotate(180deg);margin-bottom:var(--ic-space-xxxs)}:host(.dropdown-no-icon) .button{padding-right:var(--ic-space-xs)}slot[name=\"router-item\"]::slotted(a){pointer-events:all}::slotted(a){font-size:0.875rem !important;border:none !important;vertical-align:middle !important}:host(#menu-button.ic-theme-dark){--ic-button-secondary-background-hover-monochrome:var(\n --ic-action-dark-bg-hover\n );--ic-button-secondary-background-pressed-monochrome:var(\n --ic-action-dark-bg-pressed\n );--ic-button-secondary-text-hover-monochrome:var(\n --ic-action-monochrome-hover-dark\n );--ic-button-secondary-text-pressed-monochrome:var(\n --ic-action-monochrome-pressed-dark\n );--ic-button-secondary-border-hover-monochrome:var(\n --ic-color-border-neutral-hover-dark\n );--ic-button-secondary-border-pressed-monochrome:var(\n --ic-color-border-neutral-pressed-dark\n )}:host(#menu-button.ic-theme-light){--ic-button-secondary-background-hover-monochrome:var(\n --ic-action-light-bg-hover\n );--ic-button-secondary-background-pressed-monochrome:var(\n --ic-action-light-bg-pressed\n );--ic-button-secondary-text-hover-monochrome:var(\n --ic-action-monochrome-hover\n );--ic-button-secondary-text-pressed-monochrome:var(\n --ic-action-monochrome-pressed\n );--ic-button-secondary-border-hover-monochrome:var(\n --ic-color-border-neutral-hover-light\n );--ic-button-secondary-border-pressed-monochrome:var(\n --ic-color-border-neutral-default\n )}@media (forced-colors: active){.button,::slotted(a){border:0.125rem solid transparent !important}.search-submit-button ::slotted(a),.ic-button-variant-icon ::slotted(a),.clear-button ::slotted(a),.search-submit-button ::slotted(svg),.ic-button-variant-icon ::slotted(svg),.clear-button ::slotted(svg){color:HighlightText}:host(.ic-button-variant-icon.monochrome) ::slotted(a),:host(.ic-button-variant-icon.monochrome) ::slotted(svg){color:white}:host(.clear-button) .button:not(:active):focus ::slotted(svg){color:white !important;background-color:inherit}:host(.ic-button-variant-primary:not(.ic-button-disabled)) ::slotted(svg){color:currentcolor !important}}:host(.flip) ::slotted(svg){transform:scaleX(-1)}";
|
4893
4895
|
var IcButtonStyle0 = icButtonCss;
|
4894
4896
|
|
4895
4897
|
var __rest = (undefined && undefined.__rest) || function (s, e) {
|
@@ -5260,7 +5262,7 @@ class Button {
|
|
5260
5262
|
variant !== "destructive" && (hAsync("span", { class: dropdownExpanded
|
5261
5263
|
? "dropdown-expanded"
|
5262
5264
|
: "arrow-dropdown", innerHTML: arrowDropdown }))))));
|
5263
|
-
return (hAsync(Host, { key: '
|
5265
|
+
return (hAsync(Host, { key: '76e9eabe7c49342e8b6c931180281063d6bc01f2', class: {
|
5264
5266
|
"ic-button-disabled": disabled && !loading,
|
5265
5267
|
"ic-button-full-width": fullWidth,
|
5266
5268
|
"ic-button-loading": loading,
|
@@ -5276,7 +5278,7 @@ class Button {
|
|
5276
5278
|
monochrome,
|
5277
5279
|
"top-icon": isSlotUsed(this.el, "top-icon"),
|
5278
5280
|
"with-badge": isSlotUsed(this.el, "badge"),
|
5279
|
-
}, onClick: handleClick, onKeyDown: handleKeyDown, "aria-owns": ariaOwnsId, "aria-controls": ariaControlsId, "aria-expanded": dropdown && `${dropdownExpanded}` }, hasTooltip && (hAsync("ic-tooltip", { key: '
|
5281
|
+
}, onClick: handleClick, onKeyDown: handleKeyDown, "aria-owns": ariaOwnsId, "aria-controls": ariaControlsId, "aria-expanded": dropdown && `${dropdownExpanded}` }, hasTooltip && (hAsync("ic-tooltip", { key: 'b206653b613d9d78da264c8f796a4b7b90e50db0', id: describedby, label: title || ariaLabel, target: buttonId, placement: tooltipPlacement, silent: isIconVariant() && !!ariaLabel }, hAsync(ButtonContent, { key: '9e63601518bac4f1ef197262e193a8977deb6df4' }))), isSlotUsed(this.el, "badge") && hAsync("slot", { key: 'da708210c9061b0f2e3a4678f61e339a446616e4', name: "badge" }), !hasTooltip && hAsync(ButtonContent, { key: '43131139c83a264a25995f616aac6b7431b86156' }), describedByContent && (hAsync("span", { key: '1b1b37a9c1f17d39f768d0e8cee845fc09595219', id: describedby, class: "ic-button-describedby" }, describedByContent))));
|
5280
5282
|
}
|
5281
5283
|
static get delegatesFocus() { return true; }
|
5282
5284
|
get el() { return getElement(this); }
|
@@ -5331,7 +5333,7 @@ class Button {
|
|
5331
5333
|
}; }
|
5332
5334
|
}
|
5333
5335
|
|
5334
|
-
const icCardVerticalCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n line-height: 1.15; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n ========================================================================== */\n\n/**\n * Remove the margin in all browsers.\n */\n\nbody {\n margin: 0;\n}\n\n/**\n * Render the `main` element consistently in IE.\n */\n\nmain {\n display: block;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n ========================================================================== */\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n box-sizing: content-box; /* 1 */\n height: 0; /* 1 */\n overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\npre {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n ========================================================================== */\n\n/**\n * Remove the gray background on active links in IE 10.\n */\n\na {\n background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n border-bottom: none; /* 1 */\n text-decoration: underline; /* 2 */\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted; /* 2 */\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/* Embedded content\n ========================================================================== */\n\n/**\n * Remove the border on images inside links in IE 10.\n */\n\nimg {\n border-style: none;\n}\n\n/* Forms\n ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-size: 100%; /* 1 */\n line-height: 1.15; /* 1 */\n margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput {\n /* 1 */\n overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect {\n /* 1 */\n text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n * `fieldset` elements in all browsers.\n */\n\nlegend {\n box-sizing: border-box; /* 1 */\n color: inherit; /* 2 */\n display: table; /* 1 */\n max-width: 100%; /* 1 */\n padding: 0; /* 3 */\n white-space: normal; /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\n\ntextarea {\n overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/* Interactive\n ========================================================================== */\n\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\n\ndetails {\n display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n display: list-item;\n}\n\n/* Misc\n ========================================================================== */\n\n/**\n * Add the correct display in IE 10+.\n */\n\ntemplate {\n display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n\n[hidden] {\n display: none;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n margin: 0;\n padding: 0;\n border: 0;\n font-size: 100%;\n font-style: inherit;\n vertical-align: baseline;\n}\n\n\n:host {\n display: flex;\n}\n\na {\n text-decoration: none !important;\n color: var(--ic-card-text-primary) !important;\n}\n\na:visited {\n color: var(--ic-card-link-action-dark) !important;\n}\n\nbutton {\n border: none;\n background-color: transparent;\n outline: var(--ic-hc-focus-outline);\n}\n\n.card {\n display: flex;\n flex-direction: column;\n border: var(--ic-space-1px) solid var(--ic-card-border-primary);\n border-radius: var(--ic-border-radius);\n box-sizing: border-box;\n padding: var(--ic-space-md);\n text-align: left;\n color: var(--ic-card-text-primary);\n transition: var(--ic-easing-transition-fast);\n position: relative;\n width: inherit;\n min-width: -moz-fit-content;\n min-width: fit-content;\n height: -moz-fit-content;\n height: fit-content;\n min-height: 100%;\n\n ::slotted(svg) {\n fill: var(--ic-card-icon);\n }\n\n &.monochrome {\n border: var(--ic-border-width) solid var(--ic-card-border-monochrome);\n }\n\n &.fullwidth {\n width: 100%;\n }\n\n &.clickable {\n &:hover {\n background-color: var(--ic-card-background-hover);\n border: var(--ic-space-1px) solid var(--ic-card-hover-border-color);\n cursor: pointer;\n }\n\n &.focussed,\n &:focus {\n background-color: var(--ic-card-background-hover);\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n border: var(--ic-space-1px) solid var(--ic-card-pressed-border-color);\n }\n\n &:active {\n background-color: var(--ic-card-background-pressed);\n box-shadow: var(--ic-border-focus);\n .card-title {\n text-decoration: none;\n }\n }\n\n .card-title {\n --ic-typography-color: var(--ic-card-clickable-text);\n color: var(--ic-card-clickable-text);\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n margin-bottom: var(--ic-space-xxs);\n }\n .interaction-button,\n .icon {\n margin-bottom: var(--ic-space-xxs);\n }\n }\n\n &.disabled {\n border: var(--ic-space-1px) dashed var(--ic-card-disabled-border-color);\n\n .card-message,\n .subheading,\n .card-title {\n --ic-typography-color: var(--ic-card-disabled-text);\n }\n\n .card-title {\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n text-decoration-color: var(--ic-card-disabled-text);\n color: var(--ic-card-disabled-text);\n }\n\n ::slotted(svg) {\n fill: var(--ic-card-icon-disabled);\n }\n }\n}\n\n.card-header {\n display: flex;\n align-items: center;\n}\n\n.icon {\n display: flex;\n align-items: center;\n padding-right: var(--ic-space-xs);\n}\n\n.card.clickable:hover .card-title,\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title {\n display: inline-block;\n border-bottom: 0.25rem solid !important;\n margin-bottom: 0 !important;\n text-decoration: none;\n}\n\n@supports (text-underline-offset: 25%) {\n .card.clickable:hover .card-title,\n .card.clickable:focus .card-title,\n .card.clickable.focussed .card-title {\n text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n border-bottom: 0 !important;\n margin-bottom: 0.25rem !important;\n }\n}\n\n.subheading {\n margin-top: var(--ic-space-xxs);\n}\n\n.adornment {\n margin-top: var(--ic-space-xxs);\n}\n\n.card-message {\n margin-top: var(--ic-space-md);\n align-items: left;\n}\n\n.interaction-button {\n margin-left: auto;\n}\n\n.image-top {\n margin-bottom: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.image-mid {\n margin-top: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.interaction-area {\n display: flex;\n flex-grow: 1;\n gap: var(--ic-space-md);\n margin-top: var(--ic-space-md);\n align-items: flex-end;\n}\n\n.interaction-controls {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--ic-space-sm);\n}\n\n.toggle-button {\n width: 2.5rem;\n height: 2.5rem;\n padding: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n min-width: 0;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n border-radius: var(--ic-border-radius);\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n background: none;\n border: none;\n box-sizing: border-box;\n white-space: nowrap;\n vertical-align: middle;\n\n &:hover {\n background-color: var(--ic-card-background-hover);\n }\n\n &:focus {\n box-shadow: var(--ic-border-focus);\n }\n\n &:active:not(:focus) {\n background-color: var(--ic-card-background-pressed);\n }\n\n svg {\n pointer-events: none;\n width: 100% !important;\n height: 100% !important;\n fill: currentcolor !important;\n }\n}\n\n#ic-tooltip-expand-button {\n margin-left: auto;\n position: relative;\n}\n\n.toggle-button-closed svg {\n transform: rotate(90deg);\n}\n\n.toggle-button-expanded svg {\n transform: rotate(-90deg);\n}\n\n.expanded-content {\n margin-top: var(--ic-space-md);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n .card {\n ::slotted(svg) {\n fill: currentcolor;\n }\n\n &.disabled {\n border-color: GrayText !important;\n\n ::slotted(svg) {\n fill: GrayText !important;\n }\n\n .card-message,\n .subheading,\n .card-title {\n color: GrayText;\n\n --ic-typography-color: GrayText;\n }\n }\n }\n\n .toggle-button:focus,\n .toggle-button:hover {\n outline-color: Highlight;\n }\n}\n";
|
5336
|
+
const icCardVerticalCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n line-height: 1.15; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n ========================================================================== */\n\n/**\n * Remove the margin in all browsers.\n */\n\nbody {\n margin: 0;\n}\n\n/**\n * Render the `main` element consistently in IE.\n */\n\nmain {\n display: block;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n ========================================================================== */\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n box-sizing: content-box; /* 1 */\n height: 0; /* 1 */\n overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\npre {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n ========================================================================== */\n\n/**\n * Remove the gray background on active links in IE 10.\n */\n\na {\n background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n border-bottom: none; /* 1 */\n text-decoration: underline; /* 2 */\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted; /* 2 */\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/* Embedded content\n ========================================================================== */\n\n/**\n * Remove the border on images inside links in IE 10.\n */\n\nimg {\n border-style: none;\n}\n\n/* Forms\n ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-size: 100%; /* 1 */\n line-height: 1.15; /* 1 */\n margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput {\n /* 1 */\n overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect {\n /* 1 */\n text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n * `fieldset` elements in all browsers.\n */\n\nlegend {\n box-sizing: border-box; /* 1 */\n color: inherit; /* 2 */\n display: table; /* 1 */\n max-width: 100%; /* 1 */\n padding: 0; /* 3 */\n white-space: normal; /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\n\ntextarea {\n overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/* Interactive\n ========================================================================== */\n\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\n\ndetails {\n display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n display: list-item;\n}\n\n/* Misc\n ========================================================================== */\n\n/**\n * Add the correct display in IE 10+.\n */\n\ntemplate {\n display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n\n[hidden] {\n display: none;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n margin: 0;\n padding: 0;\n border: 0;\n font-size: 100%;\n font-style: inherit;\n vertical-align: baseline;\n}\n\n\n:host {\n display: flex;\n}\n\na {\n text-decoration: none !important;\n color: var(--ic-card-text-primary) !important;\n}\n\na:visited {\n color: var(--ic-card-link-action-dark) !important;\n}\n\nbutton {\n border: none;\n background-color: transparent;\n outline: var(--ic-hc-focus-outline);\n}\n\n.card {\n display: flex;\n flex-direction: column;\n border: var(--ic-space-1px) solid var(--ic-card-border-primary);\n border-radius: var(--ic-border-radius);\n box-sizing: border-box;\n padding: var(--ic-space-md);\n text-align: left;\n color: var(--ic-card-text-primary);\n transition: var(--ic-easing-transition-fast);\n position: relative;\n width: inherit;\n min-width: -moz-fit-content;\n min-width: fit-content;\n height: -moz-fit-content;\n height: fit-content;\n min-height: 100%;\n\n ::slotted(svg) {\n fill: var(--ic-card-icon);\n }\n\n &.monochrome {\n border: var(--ic-border-width) solid var(--ic-card-border-monochrome);\n }\n\n &.fullwidth {\n width: 100%;\n }\n\n &.clickable {\n &:hover {\n background-color: var(--ic-card-background-hover);\n border: var(--ic-space-1px) solid var(--ic-card-hover-border-color);\n cursor: pointer;\n }\n\n &.focussed,\n &:focus {\n background-color: var(--ic-card-background-hover);\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n border: var(--ic-space-1px) solid var(--ic-card-pressed-border-color);\n }\n\n &:active {\n background-color: var(--ic-card-background-pressed);\n box-shadow: var(--ic-border-focus);\n\n .card-title {\n text-decoration: none;\n }\n }\n\n .card-title {\n --ic-typography-color: var(--ic-card-clickable-text);\n\n color: var(--ic-card-clickable-text);\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n margin-bottom: var(--ic-space-xxs);\n }\n\n .interaction-button,\n .icon {\n margin-bottom: var(--ic-space-xxs);\n }\n }\n\n &.disabled {\n border: var(--ic-space-1px) dashed var(--ic-card-disabled-border-color);\n\n .card-message,\n .subheading,\n .card-title {\n --ic-typography-color: var(--ic-card-disabled-text);\n }\n\n .card-title {\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n text-decoration-color: var(--ic-card-disabled-text);\n color: var(--ic-card-disabled-text);\n }\n\n ::slotted(svg) {\n fill: var(--ic-card-icon-disabled);\n }\n }\n}\n\n.card-header {\n display: flex;\n align-items: center;\n}\n\n.icon {\n display: flex;\n align-items: center;\n padding-right: var(--ic-space-xs);\n}\n\n.card.clickable:hover .card-title,\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title {\n display: inline-block;\n border-bottom: 0.25rem solid !important;\n margin-bottom: 0 !important;\n text-decoration: none;\n}\n\n@supports (text-underline-offset: 25%) {\n .card.clickable:hover .card-title,\n .card.clickable:focus .card-title,\n .card.clickable.focussed .card-title {\n text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n border-bottom: 0 !important;\n margin-bottom: 0.25rem !important;\n }\n}\n\n.subheading {\n margin-top: var(--ic-space-xxs);\n}\n\n.adornment {\n margin-top: var(--ic-space-xxs);\n}\n\n.card-message {\n margin-top: var(--ic-space-md);\n align-items: left;\n}\n\n.interaction-button {\n margin-left: auto;\n}\n\n.image-top {\n margin-bottom: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.image-mid {\n margin-top: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.interaction-area {\n display: flex;\n flex-grow: 1;\n gap: var(--ic-space-md);\n margin-top: var(--ic-space-md);\n align-items: flex-end;\n}\n\n.interaction-controls {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--ic-space-sm);\n}\n\n.toggle-button {\n width: 2.5rem;\n height: 2.5rem;\n padding: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n min-width: 0;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n border-radius: var(--ic-border-radius);\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n background: none;\n border: none;\n box-sizing: border-box;\n white-space: nowrap;\n vertical-align: middle;\n\n &:hover {\n background-color: var(--ic-card-background-hover);\n }\n\n &:focus {\n box-shadow: var(--ic-border-focus);\n }\n\n &:active:not(:focus) {\n background-color: var(--ic-card-background-pressed);\n }\n\n svg {\n pointer-events: none;\n width: 100% !important;\n height: 100% !important;\n fill: currentcolor !important;\n }\n}\n\n#ic-tooltip-expand-button {\n margin-left: auto;\n position: relative;\n}\n\n.toggle-button-closed svg {\n transform: rotate(90deg);\n}\n\n.toggle-button-expanded svg {\n transform: rotate(-90deg);\n}\n\n.expanded-content {\n margin-top: var(--ic-space-md);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n .card {\n ::slotted(svg) {\n fill: currentcolor;\n }\n\n &.disabled {\n border-color: GrayText !important;\n\n ::slotted(svg) {\n fill: GrayText !important;\n }\n\n .card-message,\n .subheading,\n .card-title {\n color: GrayText;\n\n --ic-typography-color: GrayText;\n }\n }\n }\n\n .toggle-button:focus,\n .toggle-button:hover {\n outline-color: Highlight;\n }\n}\n";
|
5335
5337
|
var IcCardVerticalStyle0 = icCardVerticalCss;
|
5336
5338
|
|
5337
5339
|
/**
|
@@ -5532,7 +5534,7 @@ class CardVertical {
|
|
5532
5534
|
}; }
|
5533
5535
|
}
|
5534
5536
|
|
5535
|
-
const icCheckboxCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.ic-checkbox-disabled){pointer-events:none}.container{display:flex;width:-moz-fit-content;width:fit-content;padding:var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);margin-bottom:var(--ic-space-xxs);align-items:center}:host(.ic-data-table-checkbox) .container{padding:0;margin-bottom:0}:host(.ic-checkbox-small) .container{margin-bottom:var(--ic-space-xxxs)}.checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;position:relative;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);background-color:var(--ic-checkbox-background-unselected);border:var(--ic-border-width) solid var(--ic-checkbox-border-unselected);border-radius:var(--ic-border-radius);outline:none;cursor:pointer;transition:var(--ic-easing-transition-fast);flex-shrink:0}:host .container svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}:host(.ic-checkbox-small) .checkbox,:host(.ic-checkbox-small) .container svg{width:var(--ic-space-md);height:var(--ic-space-md)}:host(.ic-checkbox-large) .checkbox,:host(.ic-checkbox-large) .container svg{width:var(--ic-space-xl);height:var(--ic-space-xl)}.checkbox:checked{background-color:var(--ic-checkbox-background-selected);border:var(--ic-border-width) solid var(--ic-checkbox-background-selected);transition:var(--ic-easing-transition-slow)}.checkbox:checked:disabled{background-color:var(--ic-checkbox-background-selected-disabled);border:var(--ic-border-width) solid\n var(--ic-checkbox-background-selected-disabled)}.checkbox:indeterminate,.checkbox.indeterminate:checked{background-color:var(--ic-checkbox-background-indeterminate);border:0.125rem solid var(--ic-checkbox-background-indeterminate)}.checkbox:indeterminate:disabled,.checkbox.indeterminate:checked:disabled{background-color:var(--ic-checkbox-background-indeterminate-disabled);border:0.125rem solid var(--ic-checkbox-background-indeterminate-disabled)}.checkbox:checked:hover{background-color:var(--ic-checkbox-background-selected-hover)}.checkbox:indeterminate:hover,.checkbox.indeterminate:checked:hover{background-color:var(--ic-checkbox-background-indeterminate-hover);border:0.125rem solid var(--ic-checkbox-background-indeterminate-hover)}.checkbox:checked:active{background-color:var(--ic-checkbox-background-selected-pressed)}.checkbox:indeterminate:active,.checkbox.indeterminate:checked:active{background-color:var(--ic-checkbox-background-indeterminate-pressed);border:0.125rem solid var(--ic-checkbox-background-indeterminate-pressed)}.checkbox:hover{box-shadow:0 0 0 0.25rem var(--ic-checkbox-action-background-hover);border:var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-hover)}.checkbox:active{box-shadow:0 0 0 0.25rem var(--ic-checkbox-action-background-pressed);border:var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-pressed)}.checkbox:focus{box-shadow:var(--ic-border-focus)}.checkbox:disabled{border:var(--ic-border-width) dashed\n var(--ic-checkbox-border-unselected-disabled)}.checkbox-label{padding-left:var(--ic-space-sm);color:var(--ic-checkbox-text);--ic-typography-color:var(--ic-checkbox-text)}:host(.ic-checkbox-disabled) .checkbox-label{color:var(--ic-checkbox-text-disabled);--ic-typography-color:var(--ic-checkbox-text-disabled)}.checkbox-label:hover{cursor:pointer}.checkmark{position:relative;right:calc(-1 * var(--ic-space-lg));margin-left:calc(-1 * var(--ic-space-lg));fill:var(--ic-checkbox-icon-pressed);z-index:1;background-color:transparent;pointer-events:none;flex-shrink:0}:host(.ic-checkbox-small) .checkmark{margin-left:calc(-1 * var(--ic-space-md));right:calc(-1 * var(--ic-space-md))}:host(.ic-checkbox-large) .checkmark{margin-left:calc(-1 * var(--ic-space-xl));right:calc(-1 * var(--ic-space-xl))}.indeterminate-symbol{position:relative;width:0.875rem;height:var(--ic-space-xxxs);right:-1.188rem;margin-left:-0.875rem;z-index:1;background-color:var(--ic-checkbox-icon-indeterminate);pointer-events:none;flex-shrink:0}:host(.ic-checkbox-small) .indeterminate-symbol{width:0.6rem;right:-0.8rem;margin-left:-0.6rem}:host(.ic-checkbox-large) .indeterminate-symbol{width:1.25rem;right:-1.625rem;margin-left:-1.25rem}.additional-field-wrapper{margin-left:calc(var(--ic-space-md) + var(--ic-space-lg));margin-top:calc(var(--ic-space-sm) / 2)}.branch-corner{height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 0.188rem;border-bottom:0.125rem solid var(--ic-checkbox-required-bar);border-left:0.125rem solid var(--ic-checkbox-required-bar)}.dynamic-container{display:flex;position:relative;margin:var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);gap:var(--ic-space-xs)}.dynamic-text{color:var(--ic-checkbox-required-text);--ic-typography-color:var(--ic-checkbox-required-text);margin-top:calc(var(--ic-space-sm) / 2);margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(
|
5537
|
+
const icCheckboxCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.ic-checkbox-disabled){pointer-events:none}.container{display:flex;width:-moz-fit-content;width:fit-content;padding:var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);margin-bottom:var(--ic-space-xxs);align-items:center}:host(.ic-data-table-checkbox) .container{padding:0;margin-bottom:0}:host(.ic-checkbox-small) .container{margin-bottom:var(--ic-space-xxxs)}.checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;position:relative;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);background-color:var(--ic-checkbox-background-unselected);border:var(--ic-border-width) solid var(--ic-checkbox-border-unselected);border-radius:var(--ic-border-radius);outline:none;cursor:pointer;transition:var(--ic-easing-transition-fast);flex-shrink:0}:host .container svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}:host(.ic-checkbox-small) .checkbox,:host(.ic-checkbox-small) .container svg{width:var(--ic-space-md);height:var(--ic-space-md)}:host(.ic-checkbox-large) .checkbox,:host(.ic-checkbox-large) .container svg{width:var(--ic-space-xl);height:var(--ic-space-xl)}.checkbox:checked{background-color:var(--ic-checkbox-background-selected);border:var(--ic-border-width) solid var(--ic-checkbox-background-selected);transition:var(--ic-easing-transition-slow)}.checkbox:checked:disabled{background-color:var(--ic-checkbox-background-selected-disabled);border:var(--ic-border-width) solid\n var(--ic-checkbox-background-selected-disabled)}.checkbox:indeterminate,.checkbox.indeterminate:checked{background-color:var(--ic-checkbox-background-indeterminate);border:0.125rem solid var(--ic-checkbox-background-indeterminate)}.checkbox:indeterminate:disabled,.checkbox.indeterminate:checked:disabled{background-color:var(--ic-checkbox-background-indeterminate-disabled);border:0.125rem solid var(--ic-checkbox-background-indeterminate-disabled)}.checkbox:checked:hover{background-color:var(--ic-checkbox-background-selected-hover)}.checkbox:indeterminate:hover,.checkbox.indeterminate:checked:hover{background-color:var(--ic-checkbox-background-indeterminate-hover);border:0.125rem solid var(--ic-checkbox-background-indeterminate-hover)}.checkbox:checked:active{background-color:var(--ic-checkbox-background-selected-pressed)}.checkbox:indeterminate:active,.checkbox.indeterminate:checked:active{background-color:var(--ic-checkbox-background-indeterminate-pressed);border:0.125rem solid var(--ic-checkbox-background-indeterminate-pressed)}.checkbox:hover{box-shadow:0 0 0 0.25rem var(--ic-checkbox-action-background-hover);border:var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-hover)}.checkbox:active{box-shadow:0 0 0 0.25rem var(--ic-checkbox-action-background-pressed);border:var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-pressed)}.checkbox:focus{box-shadow:var(--ic-border-focus)}.checkbox:disabled{border:var(--ic-border-width) dashed\n var(--ic-checkbox-border-unselected-disabled)}.checkbox-label{padding-left:var(--ic-space-sm);color:var(--ic-checkbox-text);--ic-typography-color:var(--ic-checkbox-text)}:host(.ic-checkbox-disabled) .checkbox-label{color:var(--ic-checkbox-text-disabled);--ic-typography-color:var(--ic-checkbox-text-disabled)}.checkbox-label:hover{cursor:pointer}.checkmark{position:relative;right:calc(-1 * var(--ic-space-lg));margin-left:calc(-1 * var(--ic-space-lg));fill:var(--ic-checkbox-icon-pressed);z-index:1;background-color:transparent;pointer-events:none;flex-shrink:0}:host(.ic-checkbox-small) .checkmark{margin-left:calc(-1 * var(--ic-space-md));right:calc(-1 * var(--ic-space-md))}:host(.ic-checkbox-large) .checkmark{margin-left:calc(-1 * var(--ic-space-xl));right:calc(-1 * var(--ic-space-xl))}.indeterminate-symbol{position:relative;width:0.875rem;height:var(--ic-space-xxxs);right:-1.188rem;margin-left:-0.875rem;z-index:1;background-color:var(--ic-checkbox-icon-indeterminate);pointer-events:none;flex-shrink:0}:host(.ic-checkbox-small) .indeterminate-symbol{width:0.6rem;right:-0.8rem;margin-left:-0.6rem}:host(.ic-checkbox-large) .indeterminate-symbol{width:1.25rem;right:-1.625rem;margin-left:-1.25rem}.additional-field-wrapper{margin-left:calc(var(--ic-space-md) + var(--ic-space-lg));margin-top:calc(var(--ic-space-sm) / 2)}.branch-corner{height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 0.188rem;border-bottom:0.125rem solid var(--ic-checkbox-required-bar);border-left:0.125rem solid var(--ic-checkbox-required-bar)}.dynamic-container{display:flex;position:relative;margin:var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);gap:var(--ic-space-xs)}.dynamic-text{color:var(--ic-checkbox-required-text);--ic-typography-color:var(--ic-checkbox-required-text);margin-top:calc(var(--ic-space-sm) / 2);margin-bottom:var(--ic-space-xs);border-radius:2%}.dynamic-field-container{flex:100%}@media (max-width: 576px){::slotted(*){--input-width:100%}.dynamic-field-container{flex:initial}}@media (forced-colors: active){.checkbox{-webkit-appearance:revert;-moz-appearance:revert;appearance:revert;transition:none}.checkbox:checked{transition:none}.checkbox:focus-visible{outline:0.125rem solid highlight}.checkbox:disabled:not(:checked){-webkit-appearance:none;-moz-appearance:none;appearance:none;border-color:GrayText}.checkmark{fill:none}.indeterminate-symbol{display:none}}.checkmark:dir(rtl){right:0}.checkbox-label:dir(rtl){padding-right:var(--ic-space-sm);padding-left:0}.indeterminate-symbol:dir(rtl){right:0.288rem}.branch-corner:dir(rtl){border-radius:0 0 0.188rem;border-right:0.125rem solid var(--ic-action-default);border-left:none}.dynamic-container:dir(rtl){margin:var(--ic-space-xxxs) var(--ic-space-sm) var(--ic-space-xxs) 0}";
|
5536
5538
|
var IcCheckboxStyle0 = icCheckboxCss;
|
5537
5539
|
|
5538
5540
|
/**
|
@@ -5616,13 +5618,8 @@ class Checkbox {
|
|
5616
5618
|
}
|
5617
5619
|
componentDidRender() {
|
5618
5620
|
if (this.additionalFieldDisplay === "static") {
|
5619
|
-
const
|
5620
|
-
|
5621
|
-
textfield === null || textfield === void 0 ? void 0 : textfield.setAttribute("disabled", "");
|
5622
|
-
}
|
5623
|
-
else {
|
5624
|
-
textfield === null || textfield === void 0 ? void 0 : textfield.removeAttribute("disabled");
|
5625
|
-
}
|
5621
|
+
const textfieldElements = this.el.querySelectorAll("ic-text-field");
|
5622
|
+
textfieldElements.forEach((textfield) => textfield.setAttribute("disabled", this.checked ? "false" : "true"));
|
5626
5623
|
}
|
5627
5624
|
else if (this.additionalFieldContainer) {
|
5628
5625
|
this.additionalFieldContainer.style.display = !this.checked
|
@@ -5647,17 +5644,17 @@ class Checkbox {
|
|
5647
5644
|
checked
|
5648
5645
|
? renderHiddenInput(el, value, name, disabled)
|
5649
5646
|
: removeHiddenInput(el);
|
5650
|
-
return (hAsync(Host, { key: '
|
5647
|
+
return (hAsync(Host, { key: '4e59ebe231623d859cfda67200bc46a77a16e2a0', class: {
|
5651
5648
|
"ic-checkbox-disabled": disabled,
|
5652
5649
|
[`ic-checkbox-${size}`]: !!size,
|
5653
5650
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
5654
|
-
} }, hAsync("div", { key: '
|
5651
|
+
} }, hAsync("div", { key: '846fa84372c3c5ef0e30428348bc400f8f9d5dd6', class: "container" }, displayIndeterminate ? (hAsync("div", { class: "indeterminate-symbol" })) : (checked && (hAsync("svg", { class: "checkmark", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", "fill-rule": "evenodd", "clip-rule": "evenodd" }, hAsync("title", null, "checkmark icon"), hAsync("path", { d: "M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z" })))), hAsync("input", { key: '5873bccb9f38a7a1c1a6e4b256cc1380c866f899', role: "checkbox", class: {
|
5655
5652
|
checkbox: true,
|
5656
5653
|
checked,
|
5657
5654
|
indeterminate: displayIndeterminate,
|
5658
|
-
}, ref: (el) => (this.checkboxEl = el), type: "checkbox", name: name, id: id, value: value, disabled: disabled, checked: checked, indeterminate: displayIndeterminate, onClick: handleClick, form: form, "aria-label": hideLabel ? label : undefined }), !hideLabel && (hAsync("ic-typography", { key: '
|
5655
|
+
}, ref: (el) => (this.checkboxEl = el), type: "checkbox", name: name, id: id, value: value, disabled: disabled, checked: checked, indeterminate: displayIndeterminate, onClick: handleClick, form: form, "aria-label": hideLabel ? label : undefined }), !hideLabel && (hAsync("ic-typography", { key: '5fc250523f1657dabc16280863cdff1d5fbe04bf', class: "checkbox-label", variant: "body" }, hAsync("label", { key: '6521127be76536bb18268aaf5bd1f06ef65bb0b0', htmlFor: id }, label)))), isSlotUsed(el, "additional-field") && (hAsync("div", { key: '3cf0dce0b43227f59990d6c4812cf3957f3ed519', class: "dynamic-container", ref: (el) => (this.additionalFieldContainer = el) }, isDynamicAdditionalField && hAsync("div", { key: '371ee59d1e341ef533e14316d4bddea2f05daac4', class: "branch-corner" }), hAsync("div", { key: 'da4b74e9f04ba113e150c42b36e8ae5f33daf6e0', class: "dynamic-field-container" }, isDynamicAdditionalField && (hAsync("ic-typography", { key: '5258d47e88c8db9d617f66db38ac9bbde87e7dd3', variant: "caption" }, hAsync("p", { key: '495ab440643663635f8b6af1599cebe325b58857', class: "dynamic-text", "aria-live": "polite" }, dynamicText))), hAsync("div", { key: '4c19f7b3c0ad841042693d516f973c4e5881f71a', class: {
|
5659
5656
|
"additional-field-wrapper": !isDynamicAdditionalField,
|
5660
|
-
} }, hAsync("slot", { key: '
|
5657
|
+
} }, hAsync("slot", { key: '7bbef0fdd54fc3aed87c13fadd65f8036257a57c', name: "additional-field" })))))));
|
5661
5658
|
}
|
5662
5659
|
static get delegatesFocus() { return true; }
|
5663
5660
|
get el() { return getElement(this); }
|
@@ -5789,11 +5786,11 @@ class CheckboxGroup {
|
|
5789
5786
|
const { disabled, helperText, hideLabel, label, name, required, size, theme, validationStatus, validationText, } = this;
|
5790
5787
|
const describedBy = getInputDescribedByText(name, helperText !== "", validationStatus !== "");
|
5791
5788
|
const renderSRText = validationStatus === "error" || required || hideLabel;
|
5792
|
-
return (hAsync(Host, { key: '
|
5789
|
+
return (hAsync(Host, { key: 'dd6561e0a06005db39cc273f561136d6ef8000e1', class: {
|
5793
5790
|
"ic-checkbox-group-disabled": !!disabled,
|
5794
5791
|
[`ic-checkbox-group-${size}`]: true,
|
5795
5792
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
5796
|
-
} }, renderSRText && (hAsync("span", { key: '
|
5793
|
+
} }, renderSRText && (hAsync("span", { key: 'ff0e15fca2694ea0474066455f6326277adaffc3', id: "screenReaderOnlyText", class: "screen-reader-only-text", "aria-hidden": "true" }, label, " ", validationStatus === "error" ? "invalid data " : null, " ", required ? "required" : null)), hAsync("fieldset", { key: '0fc5e56558f307bf725f40dd07206304bdc1ba21', id: name, "aria-labelledby": `${renderSRText ? "screenReaderOnlyText" : ""} ${describedBy}`.trim(), disabled: disabled }, !hideLabel && (hAsync("legend", { key: 'f6735766d825d26de30926e0731f92858c52075c' }, hAsync("ic-input-label", { key: 'dfaaf64894a538bdd967e31a75fee7ba7998d318', class: { [`${validationStatus}`]: true }, label: label, helperText: helperText, required: required, disabled: disabled, useLabelTag: false }))), hAsync("div", { key: 'f1e2957a700e05adb8d337a6f31eee9a7d6b704e', class: "checkboxes-container" }, hAsync("slot", { key: '8ab8f0230383099884c1a78cb91c266a7fbb9f4c' }))), hasValidationStatus(validationStatus, disabled) && (hAsync("ic-input-validation", { key: '5f5e1199788d9f4d59d5c10a09d4334c74ccc4d1', for: name, ariaLiveMode: "polite", status: validationStatus, message: validationText }))));
|
5797
5794
|
}
|
5798
5795
|
get el() { return getElement(this); }
|
5799
5796
|
static get watchers() { return {
|
@@ -6054,10 +6051,10 @@ class DataList {
|
|
6054
6051
|
if (size === "small") {
|
6055
6052
|
Array.from(el.children).forEach((child) => child.setAttribute("size", "small"));
|
6056
6053
|
}
|
6057
|
-
return (hAsync(Host, { key: '
|
6054
|
+
return (hAsync(Host, { key: '57187729e8c442e305a364a8bb870af10d7c789a', class: {
|
6058
6055
|
"ic-data-list-small": size === "small",
|
6059
6056
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
6060
|
-
} }, hAsync("div", { key: '
|
6057
|
+
} }, hAsync("div", { key: 'd208727c390375a5c9a137793dc4e49870d1fc5c', class: "heading", id: "data-list-heading" }, hAsync("slot", { key: 'cbaef30591b61e5cb08cd22defe9bfff47f442c3', name: "heading" }, hAsync("ic-typography", { key: '4dcdac2796af8a867123a49df76acf2f056de9cb', variant: "h3" }, heading))), hAsync("div", { key: '32168bcd286cdb0ed55fa824406e13dea9c97b03', class: "divider" }), hAsync("ul", { key: 'e8e98e25dd09803f4771d48ac20956ea518c8a12', "aria-labelledby": "data-list-heading", class: "rows" }, hAsync("slot", { key: '09dc75e0a80760d56e370ad0b52231f4143549e8' }))));
|
6061
6058
|
}
|
6062
6059
|
get el() { return getElement(this); }
|
6063
6060
|
static get style() { return IcDataListStyle0; }
|
@@ -6147,12 +6144,12 @@ class DataRow {
|
|
6147
6144
|
}
|
6148
6145
|
render() {
|
6149
6146
|
const { el, listSize, hasEndComponent, label, renderCellContent, size, theme, value, } = this;
|
6150
|
-
return (hAsync(Host, { key: '
|
6147
|
+
return (hAsync(Host, { key: '34f5970795bba243994fce6f2006d699c786cc51', class: {
|
6151
6148
|
["ic-data-row-small"]: size === "small",
|
6152
6149
|
["breakpoint-medium"]: listSize === "m",
|
6153
6150
|
["breakpoint-xs"]: listSize === "xs",
|
6154
6151
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
6155
|
-
}, role: "listitem" }, hAsync("div", { key: '
|
6152
|
+
}, role: "listitem" }, hAsync("div", { key: 'f855811376a3e1db1d4a8bab563715d028c07341', class: "data" }, hAsync("div", { key: '2395506f64696056aadfce34d46ffc99ab6db356', class: "text-cells" }, (isSlotUsed(el, "label") || label) && renderCellContent("label"), (isSlotUsed(el, "value") || value) && renderCellContent("value")), hasEndComponent && (hAsync("div", { key: '87993084bf9673f61edc6f0c04c937f20cd5a10d', class: "end-component" }, hAsync("slot", { key: 'f051b30c5f67e8ea324656391356699a5eeef818', name: "end-component" })))), hAsync("div", { key: 'bf023260ea85682f165370fb1295bd6facf8c45e', class: "divider" })));
|
6156
6153
|
}
|
6157
6154
|
get el() { return getElement(this); }
|
6158
6155
|
static get style() { return IcDataRowStyle0; }
|
@@ -6514,7 +6511,7 @@ class Dialog {
|
|
6514
6511
|
}
|
6515
6512
|
render() {
|
6516
6513
|
const { dialogRendered, disableHeightConstraint, fadeIn, theme } = this;
|
6517
|
-
return (hAsync(Host, { key: '
|
6514
|
+
return (hAsync(Host, { key: '87a6c4970c26fdc12f1aed7bc3bd95b4e2f21810', class: {
|
6518
6515
|
"ic-dialog-hidden": !dialogRendered,
|
6519
6516
|
"ic-dialog-fade-in": fadeIn,
|
6520
6517
|
"disable-height-constraint": !!disableHeightConstraint,
|
@@ -6714,11 +6711,11 @@ class EmptyState {
|
|
6714
6711
|
}
|
6715
6712
|
render() {
|
6716
6713
|
const { aligned, body, maxLines, heading, imageSize, subheading, theme } = this;
|
6717
|
-
return (hAsync(Host, { key: '
|
6714
|
+
return (hAsync(Host, { key: '995486bbd0f1f633fec42b3b01b13c4d8df5ea70', class: {
|
6718
6715
|
[`ic-empty-state-${aligned}`]: true,
|
6719
6716
|
[`image-${imageSize}`]: isSlotUsed(this.el, "image"),
|
6720
6717
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
6721
|
-
} }, isSlotUsed(this.el, "image") && hAsync("slot", { key: '
|
6718
|
+
} }, isSlotUsed(this.el, "image") && hAsync("slot", { key: 'd8fc4fccad70f8c76f3d2f3684d941369c005418', name: "image" }), hAsync("div", { key: '29923eb7b5f47ba5d6bfac9864f69c3a0b233fc9' }, hAsync("slot", { key: '89ec9f7dde4c6e726840ba32e3b93374d28ad1d1', name: "heading" }, hAsync("ic-typography", { key: 'a7bd4e5f9c7ad89032039b41c72a8a3ac44ee0c4', variant: "h4", class: "empty-state-heading" }, heading)), hAsync("slot", { key: 'b23c53436c1ca4c5c5c4e38c59bd2112f17496fe', name: "subheading" }, hAsync("ic-typography", { key: 'da22a6520f4a9de48708f82ea3a9bde7e978e06a', variant: "subtitle-small", class: "empty-state-subheading" }, subheading)), hAsync("slot", { key: 'f86fc11ab34c45122ff6a24ad13a57f8ed925865', name: "body" }, hAsync("ic-typography", { key: 'd978a50aa34e841b0d7726fa8b0d808734e00ffc', maxLines: maxLines, class: "empty-state-body" }, body))), isSlotUsed(this.el, "actions") && (hAsync("div", { key: 'bb3d3484cbe367efea17a3809a50a3089a135251', class: "action-area" }, hAsync("slot", { key: 'edb8ba0fc8813c0dd21f993e43fa788a9eb8074e', name: "actions" })))));
|
6722
6719
|
}
|
6723
6720
|
get el() { return getElement(this); }
|
6724
6721
|
static get style() { return IcEmptyStateStyle0; }
|
@@ -6911,12 +6908,12 @@ class FooterLink {
|
|
6911
6908
|
const { footerConfig, href, hreflang, referrerpolicy, rel, target, download, } = this;
|
6912
6909
|
const { small, grouped } = footerConfig;
|
6913
6910
|
const isLogoLink = !!this.el.closest("div[slot='logo']");
|
6914
|
-
return (hAsync(Host, { key: '
|
6911
|
+
return (hAsync(Host, { key: 'e76ea1dcfe97acba7db979b8ac64101c1701dbca', class: {
|
6915
6912
|
"footer-link": true,
|
6916
6913
|
[`footer-link-${grouped ? "grouped" : "ungrouped"}-${small ? "small" : "sparse"}`]: true,
|
6917
6914
|
[`footer-link-${this.foregroundColor}`]: true,
|
6918
6915
|
"footer-logo-link": isLogoLink,
|
6919
|
-
}, role: "listitem" }, hAsync("ic-link", { key: '
|
6916
|
+
}, role: "listitem" }, hAsync("ic-link", { key: '251207e62b8812870a36eb4e7b7aa9307c78668c', class: "footer-link", href: href, hreflang: hreflang, referrerpolicy: referrerpolicy, rel: rel, download: download !== false ? download : undefined, target: target }, hAsync("slot", { key: '3a073f12607a730a032665e55088da56cccf8c42' }))));
|
6920
6917
|
}
|
6921
6918
|
static get delegatesFocus() { return true; }
|
6922
6919
|
get el() { return getElement(this); }
|
@@ -7014,7 +7011,7 @@ class FooterLinkGroup {
|
|
7014
7011
|
}; }
|
7015
7012
|
}
|
7016
7013
|
|
7017
|
-
const icHeroCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;background-color:var(--ic-hero-background);--hero-heading-bottom-margin:var(--ic-space-md);--hero-keyline:var(--ic-hero-keyline)}:host(.ic-hero-dark){background-color:var(--ic-brand-color-secondary);--ic-hero-heading:var(--ic-color-text-primary-light);--ic-hero-body:var(--ic-color-text-primary-light);--ic-hero-secondary-heading:var(--ic-color-text-primary-light);--hero-keyline:var(--ic-brand-text-color)}.heading{--ic-typography-color:var(--ic-hero-heading)}.subheading{--ic-typography-color:var(--ic-hero-body)}.secondary-container{--ic-typography-color:var(--ic-hero-secondary-heading);display:flex;flex-direction:column;justify-content:center;border-left:var(--ic-space-xxxs) solid var(--hero-keyline)}:host(.has-background-image){background-repeat:no-repeat;background-position:right -6.25rem;background-size:auto calc(100% + 6.25rem);box-shadow:var(--ic-elevation-inset)}@media (prefers-reduced-motion){:host(.has-background-image){background-position:right -6.25rem !important}}ic-typography.heading-bottom-spacing{margin-bottom:var(--hero-heading-bottom-margin)}.section-container{display:flex;align-items:center;height:100%}.left-container{padding:var(--ic-space-xl) 0}.left-container:not(.left-container-full-width){flex-basis:50%}.left-container-full-width{width:100%}.right-container{flex-basis:50%}.interaction-container{display:flex;gap:var(--ic-space-md);margin-top:var(--ic-space-lg);flex-wrap:wrap}.secondary-subheading{margin-top:var(--ic-space-xxs)}:host([content-aligned=\"left\"]) .left-container,:host([content-aligned=\"left\"]) .interaction-container{justify-content:flex-start;text-align:left}:host([content-aligned=\"center\"]) .left-container,:host([content-aligned=\"center\"]) .interaction-container{justify-content:center;text-align:center}@media (min-width: 992px){.left-container-full-width{width:66.6%}}@media (min-width: 1044px){:host,.section-container{min-height:13rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:10.813rem}.left-container:not(.left-container-full-width){flex-basis:66.6%}.left-container{min-height:9rem}.right-container{flex-basis:33.3%;margin-left:3.125rem}.secondary-container{min-height:9rem}.secondary-heading,.secondary-subheading{margin-left:3.938rem}}@media (min-width: 801px) and (max-width: 1043px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:16rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:15rem}:host(.secondary-heading),:host(.secondary-heading) .section-container{min-height:14rem}.left-container{min-height:10rem}.secondary-container{min-height:10rem}.secondary-heading,.secondary-subheading{margin-left:5.922rem}.right-container{margin-left:3.125rem}}@media (min-width: 641px) and (max-width: 800px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:16rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:15rem}:host(.secondary-heading),:host(.secondary-heading) .section-container{min-height:14rem}.left-container{min-height:10rem}.secondary-container{min-height:10rem}.secondary-heading,.secondary-subheading{margin-left:2.125rem}
|
7014
|
+
const icHeroCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;background-color:var(--ic-hero-background);--hero-heading-bottom-margin:var(--ic-space-md);--hero-keyline:var(--ic-hero-keyline)}:host(.ic-hero-dark){background-color:var(--ic-brand-color-secondary);--ic-hero-heading:var(--ic-color-text-primary-light);--ic-hero-body:var(--ic-color-text-primary-light);--ic-hero-secondary-heading:var(--ic-color-text-primary-light);--hero-keyline:var(--ic-brand-text-color)}.heading{--ic-typography-color:var(--ic-hero-heading)}.subheading{--ic-typography-color:var(--ic-hero-body)}.secondary-container{--ic-typography-color:var(--ic-hero-secondary-heading);display:flex;flex-direction:column;justify-content:center;border-left:var(--ic-space-xxxs) solid var(--hero-keyline)}:host(.has-background-image){background-repeat:no-repeat;background-position:right -6.25rem;background-size:auto calc(100% + 6.25rem);box-shadow:var(--ic-elevation-inset)}@media (prefers-reduced-motion){:host(.has-background-image){background-position:right -6.25rem !important}}ic-typography.heading-bottom-spacing{margin-bottom:var(--hero-heading-bottom-margin)}.section-container{display:flex;align-items:center;height:100%}.left-container{padding:var(--ic-space-xl) 0}.left-container:not(.left-container-full-width){flex-basis:50%}.left-container-full-width{width:100%}.right-container{flex-basis:50%}.interaction-container{display:flex;gap:var(--ic-space-md);margin-top:var(--ic-space-lg);flex-wrap:wrap}.secondary-subheading{margin-top:var(--ic-space-xxs)}:host([content-aligned=\"left\"]) .left-container,:host([content-aligned=\"left\"]) .interaction-container{justify-content:flex-start;text-align:left}:host([content-aligned=\"center\"]) .left-container,:host([content-aligned=\"center\"]) .interaction-container{justify-content:center;text-align:center}@media (min-width: 992px){.left-container-full-width{width:66.6%}}@media (min-width: 1044px){:host,.section-container{min-height:13rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:10.813rem}.left-container:not(.left-container-full-width){flex-basis:66.6%}.left-container{min-height:9rem}.right-container{flex-basis:33.3%;margin-left:3.125rem}.secondary-container{min-height:9rem}.secondary-heading,.secondary-subheading{margin-left:3.938rem}}@media (min-width: 801px) and (max-width: 1043px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:16rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:15rem}:host(.secondary-heading),:host(.secondary-heading) .section-container{min-height:14rem}.left-container{min-height:10rem}.secondary-container{min-height:10rem}.secondary-heading,.secondary-subheading{margin-left:5.922rem}.right-container{margin-left:3.125rem}}@media (min-width: 641px) and (max-width: 800px){:host(.has-background-image){background-image:none !important}:host(.has-right-content) .section-container{flex-wrap:wrap}:host(.has-right-content) .left-container{flex-basis:100%}:host(.has-right-content) .right-container{flex-basis:100%;margin-bottom:2.5rem}:host,.section-container{min-height:16rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:15rem}:host(.secondary-heading),:host(.secondary-heading) .section-container{min-height:14rem}.left-container{min-height:10rem}.secondary-container{min-height:10rem}.secondary-heading,.secondary-subheading{margin-left:2.125rem}}@media (min-width: 481px) and (max-width: 640px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:13rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:10.813rem}:host(.secondary-heading),:host(.secondary-heading) .section-container{min-height:17.5rem}:host(.secondary-heading) .section-container,:host(.ic-hero-small) .section-container,.section-container{flex-direction:column;align-items:flex-start}.left-container{height:-moz-fit-content;height:fit-content}.secondary-container{height:-moz-fit-content;height:fit-content;border:none}.right-container{margin-bottom:2.5rem}}@media (max-width: 480px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:12rem}:host,.right-container{margin-bottom:var(--ic-space-md)}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:10.813rem}:host(.secondary-heading),:host(.secondary-heading) .section-container{min-height:16.5rem}:host(.secondary-heading) .section-container,:host(.ic-hero-small) .section-container,.section-container{flex-direction:column;align-items:flex-start}.left-container{height:-moz-fit-content;height:fit-content}.secondary-container{height:-moz-fit-content;height:fit-content;border:none}}";
|
7018
7015
|
var IcHeroStyle0 = icHeroCss;
|
7019
7016
|
|
7020
7017
|
/**
|
@@ -7091,17 +7088,18 @@ class Hero {
|
|
7091
7088
|
"background-position": scrollFactor,
|
7092
7089
|
};
|
7093
7090
|
}
|
7094
|
-
return (hAsync(Host, { key: '
|
7091
|
+
return (hAsync(Host, { key: '3231afd5fd4dce03033cff51bf51071ca4fd5047', class: {
|
7095
7092
|
[`ic-hero-${IcBrandForegroundEnum.Dark}`]: foregroundColor === IcBrandForegroundEnum.Dark,
|
7096
7093
|
["has-background-image"]: backgroundImage !== undefined,
|
7094
|
+
["has-right-content"]: this.rightContent,
|
7097
7095
|
["ic-hero-small"]: size === "small",
|
7098
7096
|
["secondary-heading"]: !!secondaryHeading,
|
7099
|
-
}, style: style }, hAsync("ic-section-container", { key: '
|
7097
|
+
}, style: style }, hAsync("ic-section-container", { key: '70ba24542ed24d67f517c35b35dc68e3cc1d0599', aligned: aligned, fullHeight: true, class: "section-container" }, hAsync("div", { key: '24161f2fc3452af40ae1ef17122f3c2813f9dc9f', class: {
|
7100
7098
|
["left-container"]: true,
|
7101
7099
|
["left-container-full-width"]: this.leftContentFullWidth,
|
7102
|
-
} }, hAsync("div", { key: '
|
7100
|
+
} }, hAsync("div", { key: 'ee424e3053f730be7dcca29df72e28101923fa98', class: "heading" }, hAsync("slot", { key: 'c235855cf4509ad184a250783ad26ab5b1e8b2bf', name: "heading" }, hAsync("ic-typography", { key: '47c148b51800bb803609fc8b69698c20db1059a0', variant: size === "small" ? "h2" : "h1", class: {
|
7103
7101
|
["heading-bottom-spacing"]: size !== "small",
|
7104
|
-
} }, hAsync("h2", { key: '
|
7102
|
+
} }, hAsync("h2", { key: '18daae7363614098996b603558e2c5adfdd53c51' }, heading)))), hAsync("div", { key: 'e085d77d98ed6e62b595412544e28f00b9259daa', class: "subheading" }, hAsync("slot", { key: '6a4642853376745f93a166a85820a4043fb58d13', name: "subheading" }, hAsync("ic-typography", { key: '64cddae668b40585dd0285959b0b6bbd3d50a59b', variant: "body" }, subheading))), hAsync("div", { key: '1601aeb153b5a46a9ebd767e0685976be84683ca', class: "interaction-container" }, hAsync("slot", { key: '7585fd3d34ef5e907617795419777dd2372b5e72', name: "interaction" }))), (isPropDefined(secondaryHeading) || this.rightContent) && (hAsync("div", { key: '2e272e20bc9cc0cae93d96a6d9f714ab7b6b263b', class: "right-container" }, hAsync("slot", { key: '6d86d7dbb668b9f34b2a60bdb3f6d444149e52dc', name: "secondary" }, secondaryHeading && (hAsync("div", { key: '97a5dd02c6ccbf08ba89dea069d0f67bd2272b16', class: "secondary-container" }, hAsync("div", { key: 'cb775d9ccc188403fc934923815cd35c6dd8be38', class: "secondary-heading" }, hAsync("ic-typography", { key: '08168a08c9c68b58a4e3cd6763a2e014ef2934da', variant: "h4" }, hAsync("h3", { key: 'f3936a5faf6183d305354ca99cdea8a413b315eb' }, secondaryHeading))), hAsync("div", { key: '99a4f800156a29430ac6b4b082a22e88671f91ab', class: "secondary-subheading" }, hAsync("ic-typography", { key: '947bf3d89afc359b2d596e20cf863659e14b8528', variant: "subtitle-small" }, secondarySubheading))))))))));
|
7105
7103
|
}
|
7106
7104
|
get el() { return getElement(this); }
|
7107
7105
|
static get style() { return IcHeroStyle0; }
|
@@ -7292,22 +7290,22 @@ class HorizontalScroll {
|
|
7292
7290
|
}
|
7293
7291
|
render() {
|
7294
7292
|
const { firstItemVisible, lastItemVisible, itemOverflow } = this;
|
7295
|
-
return (hAsync(Host, { key: '
|
7293
|
+
return (hAsync(Host, { key: '263be65dcc0cb0a113e7dd92a8b12c440b9867ea', class: {
|
7296
7294
|
["ic-horizontal-scroll-visible"]: itemOverflow,
|
7297
7295
|
["ic-horizontal-scroll-dark"]: this.appearance === IcBrandForegroundEnum.Dark,
|
7298
7296
|
["ic-horizontal-scroll-light"]: this.appearance === IcBrandForegroundEnum.Light,
|
7299
7297
|
[`ic-theme-${this.theme}`]: this.theme !== "inherit",
|
7300
|
-
} }, hAsync("div", { key: '
|
7298
|
+
} }, hAsync("div", { key: '2250a0f96500b700454e012e2a918e2ace6a6f68', "aria-hidden": "true", class: {
|
7301
7299
|
["scroll-container-left"]: true,
|
7302
7300
|
["hidden"]: !itemOverflow,
|
7303
7301
|
["disabled"]: firstItemVisible,
|
7304
|
-
}, role: "tab" }, hAsync("ic-button", { key: '
|
7302
|
+
}, role: "tab" }, hAsync("ic-button", { key: 'd55b6d37d7e9a9eea918def18aea64060db6c2ba', class: "scroll-arrow", variant: "icon-tertiary", "aria-label": "Scroll left", theme: this.theme === "light" || this.theme === "inherit"
|
7305
7303
|
? "dark"
|
7306
|
-
: "light", monochrome: this.monochrome, innerHTML: LeftArrow, disabled: firstItemVisible, tabindex: "-1", onClick: this.scrollLeft, onMouseDown: this.leftArrowMouseDownHandler }), hAsync("span", { key: '
|
7304
|
+
: "light", monochrome: this.monochrome, innerHTML: LeftArrow, disabled: firstItemVisible, tabindex: "-1", onClick: this.scrollLeft, onMouseDown: this.leftArrowMouseDownHandler }), hAsync("span", { key: '14d21b70c82e36f64cf383dc8371227b3e504312', class: "scroll-splitter-left" })), hAsync("slot", { key: 'a40cc561072ffcb5aacb27b10b815ec92f3f7ded' }), hAsync("div", { key: '212d94aca6d135dfff9664e69ec9eab42ae7ca56', "aria-hidden": "true", class: {
|
7307
7305
|
["scroll-container-right"]: true,
|
7308
7306
|
["hidden"]: !itemOverflow,
|
7309
7307
|
["disabled"]: lastItemVisible,
|
7310
|
-
}, role: "tab" }, hAsync("span", { key: '
|
7308
|
+
}, role: "tab" }, hAsync("span", { key: 'bd5e6c2dc94e2cebe6e9459de52e615982048a27', class: "scroll-splitter-right" }), hAsync("ic-button", { key: 'be8f57d173b04cca06d0654054bb3451a6f40c70', class: "scroll-arrow", variant: "icon-tertiary", "aria-label": "Scroll right", theme: this.theme === "light" || this.theme === "inherit"
|
7311
7309
|
? "dark"
|
7312
7310
|
: "light", monochrome: this.monochrome, innerHTML: RightArrow, disabled: lastItemVisible, tabindex: "-1", onClick: this.scrollRight, onMouseDown: this.rightArrowMouseDownHandler }))));
|
7313
7311
|
}
|
@@ -7382,15 +7380,15 @@ class InputComponentContainer {
|
|
7382
7380
|
}
|
7383
7381
|
render() {
|
7384
7382
|
const { size, validationStatus, disabled, readonly, multiLine, fullWidth, validationInline, } = this;
|
7385
|
-
return (hAsync(Host, { key: '
|
7383
|
+
return (hAsync(Host, { key: '3349803b2fc3756e616a3e6e9f88439c3d360897', class: {
|
7386
7384
|
[`ic-input-component-container-${size}`]: true,
|
7387
7385
|
[`ic-input-component-container-${validationStatus}`]: validationStatus !== "" && !disabled && !readonly,
|
7388
7386
|
"ic-input-component-container-disabled": !!disabled,
|
7389
7387
|
"ic-input-component-container-readonly": !!readonly,
|
7390
7388
|
"ic-input-component-container-multiline": !!multiLine,
|
7391
7389
|
"ic-input-component-container-full-width": !!fullWidth,
|
7392
|
-
}, "aria-disabled": disabled ? "true" : null }, hAsync("div", { key: '
|
7393
|
-
validationStatus === IcInformationStatus.Success && (hAsync("span", { key: '
|
7390
|
+
}, "aria-disabled": disabled ? "true" : null }, hAsync("div", { key: 'bf85d48b1507e4c7d8394e067314e383e77ffb72', class: "focus-indicator" }, slotHasContent(this.el, "left-icon") && (hAsync("div", { key: '7660d9c72526a8bf34e88488884933cc7a5a96cd', class: "icon-container" }, hAsync("slot", { key: 'dc31f454f708ecbcf821cb94cf4d8b5b354d149f', name: "left-icon" }))), hAsync("slot", { key: '92265e4967394e33cdf8763bd8c8b433dbe0536e' }), validationInline &&
|
7391
|
+
validationStatus === IcInformationStatus.Success && (hAsync("span", { key: 'ecefbb2eaf920a2300bb9a30e20c18a86754fba0', class: "inline-success", innerHTML: successIcon })))));
|
7394
7392
|
}
|
7395
7393
|
get el() { return getElement(this); }
|
7396
7394
|
static get watchers() { return {
|
@@ -7431,11 +7429,11 @@ class InputContainer {
|
|
7431
7429
|
this.readonly = false;
|
7432
7430
|
}
|
7433
7431
|
render() {
|
7434
|
-
return (hAsync(Host, { key: '
|
7432
|
+
return (hAsync(Host, { key: 'b990f9f26644a727f8d0f086c88dfbb18528ca1a' }, hAsync("div", { key: '32d9cce26c3e720e2d3343dc03fc64cc9436621a', class: {
|
7435
7433
|
["component-container"]: true,
|
7436
7434
|
["disabled"]: !!this.disabled,
|
7437
7435
|
["readonly"]: !!this.readonly,
|
7438
|
-
} }, hAsync("slot", { key: '
|
7436
|
+
} }, hAsync("slot", { key: '65cfdbd533ceef8f6cfbdfa8df68789ae5f39804' }))));
|
7439
7437
|
}
|
7440
7438
|
static get style() { return IcInputContainerStyle0; }
|
7441
7439
|
static get cmpMeta() { return {
|
@@ -7492,18 +7490,18 @@ class InputLabel {
|
|
7492
7490
|
render() {
|
7493
7491
|
const { disabled, readonly, label, required, helperText, status, hideLabel, useLabelTag, } = this;
|
7494
7492
|
const labelText = required ? label + " *" : label;
|
7495
|
-
return (hAsync(Host, { key: '
|
7493
|
+
return (hAsync(Host, { key: '5f5a9e086fe974f30c17fefc545d46bcff03aedd', class: {
|
7496
7494
|
"ic-input-label-disabled": !!disabled,
|
7497
7495
|
"ic-input-label-readonly": readonly,
|
7498
7496
|
"with-helper": helperText !== "",
|
7499
|
-
} }, !hideLabel && (hAsync("ic-typography", { key: '
|
7497
|
+
} }, !hideLabel && (hAsync("ic-typography", { key: '6e6caa0f10a437753996c84a66b980582cddcc30', variant: "label", class: {
|
7500
7498
|
"readonly-label": readonly,
|
7501
7499
|
"error-label": status === "error" && !(readonly || disabled),
|
7502
|
-
} }, readonly || !useLabelTag ? (`${labelText}`) : (hAsync("label", { htmlFor: this.for }, labelText)))), helperText !== "" && (hAsync("ic-typography", { key: '
|
7500
|
+
} }, readonly || !useLabelTag ? (`${labelText}`) : (hAsync("label", { htmlFor: this.for }, labelText)))), helperText !== "" && (hAsync("ic-typography", { key: 'e6a04af0aa3d09deb034217dcb35b47836bf13f3', variant: "caption", class: {
|
7503
7501
|
helpertext: true,
|
7504
7502
|
"helpertext-normal": !disabled && !readonly,
|
7505
7503
|
"helpertext-readonly": readonly,
|
7506
|
-
} }, hAsync("span", { key: '
|
7504
|
+
} }, hAsync("span", { key: '70cdef7f1ef75572ab4f9455e4b5b3401ce10950', id: this.for && getInputHelperTextID(this.for) }, helperText)))));
|
7507
7505
|
}
|
7508
7506
|
static get style() { return IcInputLabelStyle0; }
|
7509
7507
|
static get cmpMeta() { return {
|
@@ -7559,13 +7557,13 @@ class InputValidation {
|
|
7559
7557
|
render() {
|
7560
7558
|
const { ariaLiveMode, fullWidth, status, message } = this;
|
7561
7559
|
const displayIcon = status !== "" ? icon[status] : "";
|
7562
|
-
return (hAsync(Host, { key: '
|
7560
|
+
return (hAsync(Host, { key: '8d9f4b88cdd73d491aa836934b20855ac932c411', class: {
|
7563
7561
|
[`ic-input-validation-${status}`]: status !== "",
|
7564
7562
|
"ic-input-validation-full-width": !!fullWidth,
|
7565
|
-
} }, displayIcon !== "" && (hAsync("span", { key: '
|
7563
|
+
} }, displayIcon !== "" && (hAsync("span", { key: '7d067283e8646242ac0bcd3dcb35a96f33d814b0', class: {
|
7566
7564
|
"status-icon": true,
|
7567
7565
|
[`icon-${status}`]: true,
|
7568
|
-
}, innerHTML: displayIcon })), hAsync("ic-typography", { key: '
|
7566
|
+
}, innerHTML: displayIcon })), hAsync("ic-typography", { key: 'c34f1a34c9dc0da4bcb68f775611a7dfcfc6f407', variant: "caption", class: "statustext" }, hAsync("span", { key: 'a2e90e21fb834fea1b330c16606043afa1d42d01', "aria-live": ariaLiveMode, id: this.for && getInputValidationTextID(this.for) }, message)), hAsync("slot", { key: 'b5562931123e8b745535ae5042d6c7fe8a994717', name: "validation-message-adornment" })));
|
7569
7567
|
}
|
7570
7568
|
get el() { return getElement(this); }
|
7571
7569
|
static get style() { return IcInputValidationStyle0; }
|
@@ -7599,7 +7597,7 @@ class Link {
|
|
7599
7597
|
this.inheritedAttributes = {};
|
7600
7598
|
this.hostMutationObserver = null;
|
7601
7599
|
/**
|
7602
|
-
* If `true`, the user can save the linked URL instead of navigating to it.
|
7600
|
+
* If `true`, the user can save the linked URL instead of navigating to it. If the value is a string, it will be used as the filename for the download.
|
7603
7601
|
*/
|
7604
7602
|
this.download = false;
|
7605
7603
|
/**
|
@@ -7621,9 +7619,14 @@ class Link {
|
|
7621
7619
|
}
|
7622
7620
|
});
|
7623
7621
|
};
|
7624
|
-
|
7625
|
-
|
7626
|
-
|
7622
|
+
this.setDownloadAttribute = (value) => {
|
7623
|
+
if (typeof value === "boolean") {
|
7624
|
+
return value ? "" : undefined;
|
7625
|
+
}
|
7626
|
+
else {
|
7627
|
+
return value === "true" ? "" : value === "false" ? undefined : value;
|
7628
|
+
}
|
7629
|
+
};
|
7627
7630
|
}
|
7628
7631
|
componentWillLoad() {
|
7629
7632
|
this.inheritedAttributes = inheritAttributes(this.el, IC_INHERITED_ARIA);
|
@@ -7660,18 +7663,6 @@ class Link {
|
|
7660
7663
|
: IcBrandForegroundEnum.Light;
|
7661
7664
|
}
|
7662
7665
|
}
|
7663
|
-
updateDownload() {
|
7664
|
-
var _a;
|
7665
|
-
const element = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("a");
|
7666
|
-
if (element) {
|
7667
|
-
if (this.download) {
|
7668
|
-
element.setAttribute("download", this.download === true ? "" : this.download);
|
7669
|
-
}
|
7670
|
-
else {
|
7671
|
-
element.removeAttribute("download");
|
7672
|
-
}
|
7673
|
-
}
|
7674
|
-
}
|
7675
7666
|
hasRouterSlot() {
|
7676
7667
|
this.routerSlot = this.el.querySelector('[slot="router-item"]');
|
7677
7668
|
if (this.routerSlot) {
|
@@ -7681,19 +7672,16 @@ class Link {
|
|
7681
7672
|
}
|
7682
7673
|
render() {
|
7683
7674
|
const { download, href, hreflang, referrerpolicy, rel, target, monochrome, theme, } = this;
|
7684
|
-
return (hAsync(Host, { key: '
|
7675
|
+
return (hAsync(Host, { key: '363a33f7c903d0ab7d4b1e6c29a9ea87075dc01b', class: {
|
7685
7676
|
["ic-link"]: true,
|
7686
7677
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
7687
7678
|
["ic-link-monochrome"]: !!monochrome,
|
7688
7679
|
} }, this.hasRouterSlot() ? (hAsync("slot", { name: "router-item" })) : (hAsync("a", Object.assign({ class: {
|
7689
7680
|
["link"]: !!href,
|
7690
|
-
}, download: download
|
7681
|
+
}, download: this.setDownloadAttribute(download), href: href, hrefLang: hreflang, referrerPolicy: referrerpolicy, rel: rel, target: target, tabindex: href ? "0" : "-1" }, this.inheritedAttributes, { part: "link" }), hAsync("slot", null), target === "_blank" && (hAsync("span", { class: "ic-link-open-in-new-icon", innerHTML: OpenInNew }))))));
|
7691
7682
|
}
|
7692
7683
|
static get delegatesFocus() { return true; }
|
7693
7684
|
get el() { return getElement(this); }
|
7694
|
-
static get watchers() { return {
|
7695
|
-
"download": ["watchDownloadHandler"]
|
7696
|
-
}; }
|
7697
7685
|
static get style() { return IcLinkStyle0; }
|
7698
7686
|
static get cmpMeta() { return {
|
7699
7687
|
"$flags$": 25,
|
@@ -7922,15 +7910,15 @@ class LoadingIndicator {
|
|
7922
7910
|
render() {
|
7923
7911
|
const { theme, label, description, size, fullWidth, innerLabel, monochrome, } = this;
|
7924
7912
|
const { x, y, r } = this.setCircleXY();
|
7925
|
-
return (hAsync(Host, { key: '
|
7913
|
+
return (hAsync(Host, { key: '0031fe76c51b9cfcdb3916451bd2b56f6aac8721', class: {
|
7926
7914
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
7927
7915
|
"ic-loading-indicator-label": !!label,
|
7928
7916
|
"ic-loading-indicator-full-width": !!fullWidth,
|
7929
7917
|
"inner-label": !!innerLabel,
|
7930
7918
|
"ic-loading-indicator-monochrome": !!monochrome,
|
7931
|
-
} }, hAsync("div", { key: '
|
7919
|
+
} }, hAsync("div", { key: 'f0d87cb81fe19c7923cab83352692a820f864353', class: "ic-loading-container", part: "ic-loading-container" }, hAsync("div", { key: 'eed9c9ec0fa7677a73d97f84f2f0c4254ae895f9', ref: (el) => (this.outerElement = el), class: this.calcOuterClass(), role: "progressbar", "aria-labelledby": this.label && this.size !== "icon" && "ic-loading-label", "aria-label": description, "aria-valuenow": this.progress, "aria-valuemin": this.min, "aria-valuemax": this.max }, hAsync("div", { key: 'e6f08d5b7d7f7d3531f26773d82bdaab8b746de6', ref: (el) => (this.innerElement = el), class: `ic-loading-${this.type}-inner` }, this.innerLabel &&
|
7932
7920
|
this.innerLabel !== undefined &&
|
7933
|
-
this.size === "small" && (hAsync("ic-typography", { key: '
|
7921
|
+
this.size === "small" && (hAsync("ic-typography", { key: 'e5e16b071e7886eeaeddbe5d4ba9982d2dd835ac', variant: "subtitle-small", class: "inner-text" }, this.innerLabel)), this.type === "circular" && (hAsync("svg", { key: '242ce0f64c6b81f0495ce74844d42952d60889b1', class: "ic-loading-circular-svg", viewBox: `0 0 ${this.circularDiameter || 0} ${this.circularDiameter || 0}` }, hAsync("circle", { key: '89efba17cfc44471af357fac9fad70a80ee8f9c2', cx: `${x}`, cy: `${y}`, r: `${r}` }), hAsync("circle", { key: '47a39e6acf845c27e2817d563559fc332c9be3db', cx: `${x}`, cy: `${y}`, r: `${r}` }))))), label && size !== "icon" && (hAsync("ic-typography", { key: '383cf6d17daaaaa8275b8b381e6a65334f8b832e', id: "ic-loading-label", class: "ic-loading-label", role: "status", variant: this.getLabelVariant() }, hAsync("p", { key: 'b0009c0c194d3ebdf8b8bca21fcee5db1919ac1a' }, this.indicatorLabel))))));
|
7934
7922
|
}
|
7935
7923
|
get el() { return getElement(this); }
|
7936
7924
|
static get watchers() { return {
|
@@ -9843,10 +9831,11 @@ class Menu {
|
|
9843
9831
|
this.setInputValue(highlightedOptionIndex);
|
9844
9832
|
};
|
9845
9833
|
this.handleMenuChange = (open, focusInput) => {
|
9834
|
+
var _a;
|
9846
9835
|
this.menuStateChange.emit({ open, focusInput });
|
9847
9836
|
if (!open) {
|
9848
9837
|
if (focusInput !== false) {
|
9849
|
-
this.inputEl.focus();
|
9838
|
+
(_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.focus();
|
9850
9839
|
this.preventClickOpen = false;
|
9851
9840
|
}
|
9852
9841
|
// Reset optionHighlighted so previously highlighted option doesn't get reselected when Enter pressed
|
@@ -10356,9 +10345,10 @@ class Menu {
|
|
10356
10345
|
// (i.e. you don't have to press Enter select an option - just focus on it)
|
10357
10346
|
// and menu is focused
|
10358
10347
|
this.autoSetValueOnMenuKeyDown = (event) => {
|
10348
|
+
var _a, _b;
|
10359
10349
|
event.cancelBubble = true;
|
10360
10350
|
const selectedOptionIndex = this.ungroupedOptions.findIndex((option) => option[this.valueField] === this.value);
|
10361
|
-
const isSearchableSelect = this.inputEl.tagName === "INPUT";
|
10351
|
+
const isSearchableSelect = !!this.inputEl && this.inputEl.tagName === "INPUT";
|
10362
10352
|
this.keyboardNav = false;
|
10363
10353
|
switch (event.key) {
|
10364
10354
|
case " ":
|
@@ -10398,14 +10388,14 @@ class Menu {
|
|
10398
10388
|
break;
|
10399
10389
|
case "Backspace":
|
10400
10390
|
if (isSearchableSelect) {
|
10401
|
-
this.inputEl.focus();
|
10391
|
+
(_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.focus();
|
10402
10392
|
}
|
10403
10393
|
break;
|
10404
10394
|
case "Shift":
|
10405
10395
|
break;
|
10406
10396
|
default:
|
10407
10397
|
if (isSearchableSelect && event.key !== "Tab" && !this.hasTimedOut) {
|
10408
|
-
this.inputEl.focus();
|
10398
|
+
(_b = this.inputEl) === null || _b === void 0 ? void 0 : _b.focus();
|
10409
10399
|
}
|
10410
10400
|
if (event.key.length === 1) {
|
10411
10401
|
this.keyboardNav = true;
|
@@ -10481,7 +10471,7 @@ class Menu {
|
|
10481
10471
|
var _a;
|
10482
10472
|
let optionsHeight = 0;
|
10483
10473
|
this.host
|
10484
|
-
.querySelectorAll(".option")
|
10474
|
+
.querySelectorAll(".option, .option-group-title")
|
10485
10475
|
.forEach((option) => (optionsHeight += option.clientHeight));
|
10486
10476
|
if (optionsHeight >= 320) {
|
10487
10477
|
(_a = this.menu) === null || _a === void 0 ? void 0 : _a.classList.add("menu-scroll");
|
@@ -10537,7 +10527,8 @@ class Menu {
|
|
10537
10527
|
this.loadUngroupedOptions();
|
10538
10528
|
}
|
10539
10529
|
connectedCallback() {
|
10540
|
-
|
10530
|
+
if (this.parentEl)
|
10531
|
+
this.getParentEl(this.parentEl);
|
10541
10532
|
if (this.isSearchBar) {
|
10542
10533
|
if (this.searchMode === "navigation")
|
10543
10534
|
this.setHighlightedOption(0);
|
@@ -10545,12 +10536,10 @@ class Menu {
|
|
10545
10536
|
}
|
10546
10537
|
}
|
10547
10538
|
disconnectedCallback() {
|
10548
|
-
var _a, _b;
|
10549
|
-
|
10550
|
-
|
10551
|
-
|
10552
|
-
(_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.removeEventListener("icClear", this.handleClearListener);
|
10553
|
-
(_b = this.parentEl) === null || _b === void 0 ? void 0 : _b.removeEventListener("icSubmitSearch", this.handleSubmitSearch);
|
10539
|
+
var _a, _b, _c;
|
10540
|
+
(_a = this.popperInstance) === null || _a === void 0 ? void 0 : _a.destroy();
|
10541
|
+
(_b = this.parentEl) === null || _b === void 0 ? void 0 : _b.removeEventListener("icClear", this.handleClearListener);
|
10542
|
+
(_c = this.parentEl) === null || _c === void 0 ? void 0 : _c.removeEventListener("icSubmitSearch", this.handleSubmitSearch);
|
10554
10543
|
}
|
10555
10544
|
componentWillLoad() {
|
10556
10545
|
var _a, _b, _c, _d;
|
@@ -10598,7 +10587,7 @@ class Menu {
|
|
10598
10587
|
highlightedEl.focus();
|
10599
10588
|
}
|
10600
10589
|
}
|
10601
|
-
else if (this.inputEl.tagName !== "INPUT") {
|
10590
|
+
else if (this.inputEl && this.inputEl.tagName !== "INPUT") {
|
10602
10591
|
this.menu.focus();
|
10603
10592
|
}
|
10604
10593
|
}
|
@@ -10687,7 +10676,7 @@ class Menu {
|
|
10687
10676
|
const { inputLabel, options, menuId, value, fullWidth, hasTimedOut, isLoading, size, open, inputEl, keyboardNav, parentEl, SEARCH_BAR_TAG, } = this;
|
10688
10677
|
const selectAllButtonText = `${(value === null || value === void 0 ? void 0 : value.length) === this.ungroupedOptions.length ? "Clear" : "Select"} all`;
|
10689
10678
|
const hasNoResults = this.host.classList.contains("no-results");
|
10690
|
-
return (hAsync(Host, { key: '
|
10679
|
+
return (hAsync(Host, { key: '2468ababde479fb9a3c03b6148f7115589d4f8e3', class: {
|
10691
10680
|
"ic-menu-full-width": !!fullWidth,
|
10692
10681
|
"ic-menu-no-focus": ((inputEl === null || inputEl === void 0 ? void 0 : inputEl.tagName) === "INPUT" &&
|
10693
10682
|
(parentEl === null || parentEl === void 0 ? void 0 : parentEl.tagName) !== SEARCH_BAR_TAG) ||
|
@@ -10696,7 +10685,7 @@ class Menu {
|
|
10696
10685
|
[`ic-menu-${size}`]: true,
|
10697
10686
|
"ic-menu-open": open && options.length !== 0,
|
10698
10687
|
"ic-menu-multiple": this.isMultiSelect,
|
10699
|
-
} }, options.length !== 0 && (hAsync("ul", { key: '
|
10688
|
+
} }, options.length !== 0 && (hAsync("ul", { key: '961b191dcffc99d79159937780d31ae783c6a9a0', id: menuId, class: "menu", role: "listbox", "aria-label": `${inputLabel} pop-up`, "aria-multiselectable": this.isMultiSelect ? "true" : "false", tabindex: open &&
|
10700
10689
|
!keyboardNav &&
|
10701
10690
|
((inputEl === null || inputEl === void 0 ? void 0 : inputEl.tagName) !== "INPUT" ||
|
10702
10691
|
(parentEl === null || parentEl === void 0 ? void 0 : parentEl.tagName) === SEARCH_BAR_TAG)
|
@@ -10724,7 +10713,7 @@ class Menu {
|
|
10724
10713
|
this.isMultiSelect &&
|
10725
10714
|
!isLoading &&
|
10726
10715
|
!hasTimedOut &&
|
10727
|
-
!hasNoResults && (hAsync("div", { key: '
|
10716
|
+
!hasNoResults && (hAsync("div", { key: 'f396dbf8842b3f1cdd208f8da5e98ab473266127', class: "option-bar" }, hAsync("ic-typography", { key: 'ebccbbde58196d1c89c698cdc1af37bcc911f5fd' }, hAsync("p", { key: '2a88b61887611ad5ebfae51066e5e1160d6241e9' }, `${value ? value.length : 0}/${getOptionsWithoutGroupTitlesCount(this.options)} selected`)), hAsync("ic-button", { key: 'a56ebb07da92424910cf20ce14483ed2ddb2504a', class: "select-all-button", "aria-label": `${selectAllButtonText} options for ${inputLabel}`, ref: (el) => (this.selectAllButton = el), variant: "tertiary", onClick: this.handleSelectAllClick, onMouseDown: this.handleSelectAllMouseDown, onBlur: this.handleSelectAllBlur, onFocus: this.handleSelectAllFocus, size: size === "small" ? "small" : "medium" }, selectAllButtonText)))));
|
10728
10717
|
}
|
10729
10718
|
get host() { return getElement(this); }
|
10730
10719
|
static get watchers() { return {
|
@@ -10779,7 +10768,7 @@ class MenuGroup {
|
|
10779
10768
|
}
|
10780
10769
|
render() {
|
10781
10770
|
const parentMenu = this.el.closest("ic-popover-menu");
|
10782
|
-
return (hAsync(Host, { key: '
|
10771
|
+
return (hAsync(Host, { key: '90b5ca0096a1adba293d7e625f9408b3ae2da09e', role: "group", "aria-label": this.label !== null ? this.label : "" }, isPropDefined(this.label) && (hAsync("ic-typography", { key: '194816a4c0d806e819f34861a802528b549bb537', variant: "subtitle-small" }, this.label)), hAsync("span", { key: 'bd15205a1684a0b3ea65b8a247ca735d769b8027', class: "menu-items-wrapper" }, hAsync("slot", { key: 'b142f3aae263d46e543faf257b1c223554a870a4' })), this.el !== (parentMenu === null || parentMenu === void 0 ? void 0 : parentMenu.querySelector("ic-menu-group:last-child")) && (hAsync("hr", { key: '15740ec34778a2c68e71ad033f7e55861c500665' }))));
|
10783
10772
|
}
|
10784
10773
|
get el() { return getElement(this); }
|
10785
10774
|
static get style() { return IcMenuGroupStyle0; }
|
@@ -11063,22 +11052,24 @@ class NavigationButton {
|
|
11063
11052
|
const icNavigationGroupCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;--ic-typography-color:currentcolor}:host(.in-side-menu){border-bottom:var(--ic-border-width) solid\n var(--ic-divider-background-monochrome);padding:var(--ic-space-md) 0}:host .navigation-group{height:100%;width:-moz-fit-content;width:fit-content;color:var(--ic-brand-text-color);display:flex;gap:var(--ic-space-xxs);align-items:center;justify-content:center;padding:0 var(--ic-space-md);transition:var(--ic-easing-transition-slow);position:relative;background:none;border:none;text-align:left;box-sizing:border-box}:host .navigation-group:hover,:host .navigation-group:active,:host .selected{background-color:var(--ic-architectural-20);color:var(--ic-color-text-primary-light);outline:none;cursor:pointer}:host(.in-side-menu) .navigation-group{min-height:2.5rem;width:100%;gap:1.25rem}:host(.in-side-menu) .navigation-group .ic-typography-label{width:100%}:host(.in-side-menu:not(.ic-navigation-group-expandable)) .navigation-group,:host(.in-side-menu) .navigation-group-side-menu-collapsed,:host(.in-side-menu) .navigation-group-side-menu-expanded{color:var(--ic-top-navigation-nav-group-link);justify-content:flex-start;padding:var(--ic-space-xs) var(--ic-space-md)}:host(.in-side-menu) .navigation-group-side-menu-expanded{margin-bottom:var(--ic-space-xs)}:host(.in-side-menu) .navigation-group-side-menu-collapsed::after,:host(.in-side-menu) .navigation-group-side-menu-expanded::after{border-style:solid;border-width:0.125em 0.125em 0 0;content:\"\";display:inline-block;min-height:0.45em;position:relative;top:-0.1em;transform:rotate(135deg);vertical-align:top;min-width:0.45em}:host(.in-side-menu) .navigation-group-side-menu-expanded::after{top:0.15em;transform:rotate(-45deg)}:host(:not(.in-side-menu)) .navigation-group:focus{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline);z-index:var(--ic-z-index-navigation-item);transition:box-shadow var(--ic-easing-transition-fast)}:host(.in-side-menu) .navigation-group-side-menu-expanded:hover:not(:focus),:host(.in-side-menu) .navigation-group-side-menu-collapsed:hover:not(:focus){background-color:var(--ic-top-navigation-nav-group-hover);cursor:pointer}:host(.in-side-menu) .navigation-group-side-menu-expanded:active:not(:focus),:host(.in-side-menu) .navigation-group-side-menu-collapsed:active:not(:focus){background-color:var(--ic-top-navigation-nav-group-pressed)}:host(.in-side-menu) .navigation-group-side-menu-expanded:focus,:host(.in-side-menu) .navigation-group-side-menu-collapsed:focus{box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);outline:var(--ic-hc-focus-outline);background:none}:host .navigation-group-dropdown{background-color:var(--ic-top-navigation-menu-background);border-bottom:var(--ic-space-1px) solid var(--ic-top-navigation-menu-border);position:absolute;left:0;right:0;padding:var(--ic-space-xs) var(--ic-space-md);box-shadow:0 0.375rem 0.5rem -0.375rem rgba(0 0 0 / 20%);z-index:calc(var(--ic-z-index-navigation-item) - 1)}:host .navigation-group-dropdown-items-list{list-style:none;display:flex;flex-flow:column wrap;align-content:flex-start;padding-left:var(--ic-space-md);max-height:16.5rem}:host .chevron-toggle-icon-wrapper{display:flex;align-items:center}:host .chevron-toggle-icon-wrapper svg{transform:rotate(90deg);height:var(--ic-space-lg);width:var(--ic-space-lg)}:host .chevron-toggle-icon-closed svg{transform:rotate(-90deg)}:host(.ic-navigation-group-expanded) .grouped-links-wrapper{height:var(--navigation-child-items-height, auto) !important;transition:var(--ic-easing-transition-slow);overflow:hidden}:host(.ic-navigation-group-side-nav) .link,:host(.ic-navigation-group-side-nav) ::slotted(a){height:var(--navigation-child-items-height, auto)}:host(.ic-navigation-group-collapsed) .grouped-links-wrapper{height:0;transition:var(--ic-easing-transition-slow);overflow:hidden}:host(.ic-navigation-group-side-nav) .navigation-group{min-height:var(--navigation-group-height);min-width:100%;width:var(--navigation-group-width, auto);justify-content:var(--navigation-group-justify-content);padding:var(--ic-space-md) var(--navigation-group-expand-toggle-padding)\n var(--ic-space-xs) var(--ic-space-md)}:host(.ic-navigation-group-side-nav:not(.ic-navigation-group-expandable)) .navigation-group{padding-right:var(--ic-space-md)}:host(.ic-navigation-group-side-nav) .navigation-group:hover,:host(.ic-navigation-group-side-nav) .navigation-group:active,:host(.ic-navigation-group-side-nav) .selected{background-color:var(--navigation-group-hover);color:var(--navigation-group-text-hover)}:host(.ic-navigation-group-side-nav:not(.ic-navigation-group-expandable)) .navigation-group:hover,:host(.ic-navigation-group-side-nav:not(.ic-navigation-group-expandable)) .navigation-group:active,:host(.in-side-menu:not(.ic-navigation-group-expandable)) .navigation-group:hover,:host(.in-side-menu:not(.ic-navigation-group-expandable)) .navigation-group:active{background:none;cursor:auto}:host(.ic-navigation-group-side-nav) .navigation-group:focus{box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);background:none}:host(.ic-navigation-group-side-nav) .ic-typography-caption{position:var(--navigation-group-title-position);left:var(--navigation-group-title-position-left)}";
|
11064
11053
|
var IcNavigationGroupStyle0 = icNavigationGroupCss;
|
11065
11054
|
|
11055
|
+
const IC_NAVIGATION_ITEM = "ic-navigation-item";
|
11056
|
+
const DYNAMIC_GROUPED_LINKS_HEIGHT_MS = 100;
|
11057
|
+
const NODE_NAME = "IC-NAVIGATION-GROUP";
|
11066
11058
|
class NavigationGroup {
|
11067
11059
|
constructor(hostRef) {
|
11068
11060
|
registerInstance(this, hostRef);
|
11069
11061
|
this.navigationGroupOpened = createEvent(this, "navigationGroupOpened", 7);
|
11070
11062
|
this.navigationGroupExpanded = createEvent(this, "navigationGroupExpanded", 7);
|
11071
|
-
this.
|
11072
|
-
this.
|
11073
|
-
this.
|
11063
|
+
this.allGroupedNavigationItemHeights = "";
|
11064
|
+
this.collapsedNavItemsHeight = null;
|
11065
|
+
this.expandedNavItemsHeight = null;
|
11074
11066
|
this.mouseGate = false;
|
11075
|
-
this.nodeName = "IC-NAVIGATION-GROUP";
|
11076
|
-
this.GROUPED_LINKS_WRAPPER_CLASS = ".grouped-links-wrapper";
|
11077
11067
|
this.deviceSize = DEVICE_SIZES.XL;
|
11078
11068
|
this.dropdownOpen = false;
|
11079
11069
|
this.expanded = true;
|
11080
11070
|
this.focusStyle = getBrandForegroundAppearance();
|
11081
11071
|
this.inTopNavSideMenu = false;
|
11072
|
+
this.isSideNavExpanded = false;
|
11082
11073
|
/**
|
11083
11074
|
* If `true`, the group will be expandable when in an ic-side-navigation component, or, when in an ic-top-navigation component, in the side menu displayed at small screen sizes.
|
11084
11075
|
*/
|
@@ -11088,79 +11079,53 @@ class NavigationGroup {
|
|
11088
11079
|
*/
|
11089
11080
|
this.theme = "inherit";
|
11090
11081
|
this.sideNavExpandHandler = (event) => {
|
11091
|
-
var _a;
|
11092
11082
|
this.isSideNavExpanded = event.detail.sideNavExpanded;
|
11093
|
-
|
11094
|
-
if (!linkWrapper)
|
11083
|
+
if (!this.linkWrapper || !this.expanded)
|
11095
11084
|
return;
|
11096
|
-
|
11097
|
-
|
11098
|
-
|
11099
|
-
|
11100
|
-
|
11101
|
-
setTimeout(() => {
|
11102
|
-
this.expandedNavItemsHeight = this.getNavigationChildItemsHeight();
|
11103
|
-
this.setGroupedLinksElementHeight(linkWrapper, this.expandedNavItemsHeight);
|
11104
|
-
}, this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS);
|
11105
|
-
}
|
11085
|
+
const navItemsHeight = this.isSideNavExpanded
|
11086
|
+
? this.expandedNavItemsHeight
|
11087
|
+
: this.collapsedNavItemsHeight;
|
11088
|
+
if (navItemsHeight) {
|
11089
|
+
this.setGroupedLinksElementHeight(navItemsHeight);
|
11106
11090
|
}
|
11107
11091
|
else {
|
11108
|
-
|
11109
|
-
|
11110
|
-
|
11111
|
-
|
11112
|
-
|
11113
|
-
this.collapsedNavItemsHeight = this.
|
11114
|
-
|
11115
|
-
|
11116
|
-
}
|
11092
|
+
setTimeout(() => {
|
11093
|
+
if (this.isSideNavExpanded) {
|
11094
|
+
this.expandedNavItemsHeight = this.allGroupedNavigationItemHeights;
|
11095
|
+
}
|
11096
|
+
else {
|
11097
|
+
this.collapsedNavItemsHeight = this.allGroupedNavigationItemHeights;
|
11098
|
+
}
|
11099
|
+
this.setGroupedLinksElementHeight(this.allGroupedNavigationItemHeights);
|
11100
|
+
}, DYNAMIC_GROUPED_LINKS_HEIGHT_MS);
|
11117
11101
|
}
|
11118
11102
|
};
|
11119
|
-
this.topNavResizedHandler = ({ detail, }) => {
|
11103
|
+
this.topNavResizedHandler = ({ detail: { size }, }) => {
|
11120
11104
|
var _a;
|
11121
|
-
|
11122
|
-
|
11123
|
-
|
11124
|
-
|
11125
|
-
|
11126
|
-
|
11127
|
-
|
11105
|
+
if (size === this.deviceSize)
|
11106
|
+
return;
|
11107
|
+
this.deviceSize = size;
|
11108
|
+
this.inTopNavSideMenu =
|
11109
|
+
size <=
|
11110
|
+
(((_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.customMobileBreakpoint) ||
|
11111
|
+
DEVICE_SIZES.L);
|
11128
11112
|
};
|
11129
|
-
this.
|
11130
|
-
this.
|
11131
|
-
|
11132
|
-
|
11113
|
+
this.toggleExpanded = () => {
|
11114
|
+
this.expanded = !this.expanded;
|
11115
|
+
if (!this.linkWrapper)
|
11116
|
+
return;
|
11117
|
+
this.setGroupedLinksElementHeight(!this.expanded
|
11118
|
+
? "0"
|
11119
|
+
: this.isSideNavExpanded
|
11120
|
+
? this.expandedNavItemsHeight
|
11121
|
+
: this.collapsedNavItemsHeight);
|
11122
|
+
this.el.querySelectorAll(IC_NAVIGATION_ITEM).forEach((navigationItem) => {
|
11133
11123
|
var _a;
|
11134
11124
|
const navItem = ((_a = navigationItem.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("a")) ||
|
11135
11125
|
navigationItem.querySelector("a");
|
11136
|
-
|
11137
|
-
navItem.setAttribute("tabindex", tabIndexValue);
|
11138
|
-
}
|
11126
|
+
navItem === null || navItem === void 0 ? void 0 : navItem.setAttribute("tabindex", this.expanded ? "0" : "-1");
|
11139
11127
|
});
|
11140
11128
|
};
|
11141
|
-
this.toggleGroupedLinkWrapperHeight = (wrapper, expanded) => {
|
11142
|
-
if (!wrapper)
|
11143
|
-
return;
|
11144
|
-
if (expanded) {
|
11145
|
-
if (this.isSideNavExpanded) {
|
11146
|
-
this.setGroupedLinksElementHeight(wrapper, this.expandedNavItemsHeight);
|
11147
|
-
}
|
11148
|
-
else {
|
11149
|
-
this.setGroupedLinksElementHeight(wrapper, this.collapsedNavItemsHeight);
|
11150
|
-
}
|
11151
|
-
this.setGroupedNavItemTabIndex("0");
|
11152
|
-
}
|
11153
|
-
else {
|
11154
|
-
wrapper.style.setProperty("--navigation-child-items-height", "0");
|
11155
|
-
this.setGroupedNavItemTabIndex("-1");
|
11156
|
-
}
|
11157
|
-
};
|
11158
|
-
this.toggleExpanded = () => {
|
11159
|
-
var _a;
|
11160
|
-
this.expanded = !this.expanded;
|
11161
|
-
const linkWrapper = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(this.GROUPED_LINKS_WRAPPER_CLASS);
|
11162
|
-
this.toggleGroupedLinkWrapperHeight(linkWrapper, this.expanded);
|
11163
|
-
};
|
11164
11129
|
this.handleClick = (ev) => {
|
11165
11130
|
if (this.navigationType === "top" && ev.detail) {
|
11166
11131
|
this.toggleDropdown();
|
@@ -11170,50 +11135,46 @@ class NavigationGroup {
|
|
11170
11135
|
}
|
11171
11136
|
};
|
11172
11137
|
this.handleBlur = (ev) => {
|
11173
|
-
|
11174
|
-
if (!this.el.contains(target)) {
|
11175
|
-
this.hideDropdown();
|
11176
|
-
}
|
11177
|
-
};
|
11178
|
-
this.handleTopNavKeydown = (ev) => {
|
11179
|
-
if (ev.key === " " || ev.key === "Enter") {
|
11180
|
-
this.toggleDropdown();
|
11181
|
-
}
|
11182
|
-
else if (!this.inTopNavSideMenu && ev.key === "Escape") {
|
11138
|
+
if (!this.el.contains(ev.relatedTarget)) {
|
11183
11139
|
this.hideDropdown();
|
11184
11140
|
}
|
11185
11141
|
};
|
11186
11142
|
this.handleKeydown = (ev) => {
|
11187
|
-
|
11188
|
-
|
11189
|
-
|
11190
|
-
|
11191
|
-
|
11192
|
-
|
11193
|
-
this.
|
11194
|
-
|
11195
|
-
|
11196
|
-
|
11197
|
-
|
11198
|
-
|
11199
|
-
|
11143
|
+
const { key } = ev;
|
11144
|
+
if (key !== "Enter" && key !== " " && key !== "Escape")
|
11145
|
+
return;
|
11146
|
+
switch (this.navigationType) {
|
11147
|
+
case "top":
|
11148
|
+
if (key === " " || key === "Enter") {
|
11149
|
+
this.toggleDropdown();
|
11150
|
+
}
|
11151
|
+
else if (!this.inTopNavSideMenu) {
|
11152
|
+
this.hideDropdown();
|
11153
|
+
}
|
11154
|
+
break;
|
11155
|
+
case "side":
|
11156
|
+
this.toggleExpanded();
|
11157
|
+
ev.preventDefault();
|
11158
|
+
break;
|
11159
|
+
default:
|
11160
|
+
this.toggleExpanded();
|
11161
|
+
break;
|
11200
11162
|
}
|
11201
11163
|
};
|
11202
11164
|
this.handleMouseLeave = (ev) => {
|
11203
11165
|
const relTarget = ev.relatedTarget;
|
11204
11166
|
this.mouseGate = false;
|
11205
|
-
if (
|
11206
|
-
relTarget
|
11207
|
-
document.activeElement
|
11208
|
-
|
11209
|
-
|
11210
|
-
|
11167
|
+
if (this.el.contains(relTarget) ||
|
11168
|
+
relTarget === this.dropdown ||
|
11169
|
+
this.el.contains(document.activeElement))
|
11170
|
+
return;
|
11171
|
+
if (document.activeElement !== this.el &&
|
11172
|
+
(relTarget === null || relTarget === void 0 ? void 0 : relTarget.nodeName) === NODE_NAME &&
|
11173
|
+
this.dropdownOpen) {
|
11211
11174
|
this.mouseGate = true;
|
11212
11175
|
this.hideDropdown();
|
11213
11176
|
}
|
11214
|
-
else
|
11215
|
-
relTarget !== this.dropdown &&
|
11216
|
-
!this.el.contains(document.activeElement)) {
|
11177
|
+
else {
|
11217
11178
|
this.mouseGate = false;
|
11218
11179
|
setTimeout(() => {
|
11219
11180
|
this.dropdownOpen ? this.hideDropdown() : null;
|
@@ -11223,63 +11184,38 @@ class NavigationGroup {
|
|
11223
11184
|
this.handleMouseEnter = (ev) => {
|
11224
11185
|
const relTarget = ev.relatedTarget;
|
11225
11186
|
document.addEventListener("keydown", this.handleKeydown);
|
11226
|
-
if ((relTarget === null || relTarget === void 0 ? void 0 : relTarget.nodeName) ===
|
11187
|
+
if ((relTarget === null || relTarget === void 0 ? void 0 : relTarget.nodeName) === NODE_NAME && this.mouseGate) {
|
11227
11188
|
this.showDropdown();
|
11228
11189
|
}
|
11229
|
-
else if (this.dropdownOpen
|
11230
|
-
relTarget !== null &&
|
11231
|
-
this.mouseGate === false) {
|
11190
|
+
else if (!this.dropdownOpen && !this.mouseGate) {
|
11232
11191
|
this.mouseGate = true;
|
11233
11192
|
setTimeout(() => {
|
11234
|
-
this.mouseGate
|
11193
|
+
if (this.mouseGate)
|
11194
|
+
this.showDropdown();
|
11235
11195
|
}, 500);
|
11236
11196
|
}
|
11237
11197
|
};
|
11238
|
-
this.renderDropdownGroupedLinks = () => (hAsync("div", { class: {
|
11239
|
-
["navigation-group-dropdown"]: !this.inTopNavSideMenu,
|
11240
|
-
["navigation-group-dropdown-side-menu"]: this.inTopNavSideMenu,
|
11241
|
-
["selected"]: this.dropdownOpen && !this.inTopNavSideMenu,
|
11242
|
-
}, onMouseLeave: !this.inTopNavSideMenu ? this.handleMouseLeave : undefined, ref: (el) => (this.dropdown = el) }, hAsync("nav", { class: {
|
11243
|
-
["navigation-group-dropdown-items"]: !this.inTopNavSideMenu,
|
11244
|
-
}, "aria-labelledby": "nav-group-title" }, hAsync("ul", null, hAsync("slot", null)))));
|
11245
|
-
this.renderGroupedLinks = () => (hAsync("ul", { class: "grouped-links-wrapper" }, hAsync("slot", null)));
|
11246
|
-
/**
|
11247
|
-
* Gets the total height of navigation links to improve
|
11248
|
-
* smoothness of expand/collapse animations
|
11249
|
-
*/
|
11250
|
-
this.getNavigationChildItemsHeight = () => {
|
11251
|
-
let navigationChildItemsHeight = 0;
|
11252
|
-
this.allGroupedNavigationItems.forEach((navItem) => {
|
11253
|
-
navigationChildItemsHeight += navItem.offsetHeight;
|
11254
|
-
});
|
11255
|
-
return `${navigationChildItemsHeight}px`;
|
11256
|
-
};
|
11257
|
-
this.setInitialGroupedLinksWrapperHeight = () => {
|
11258
|
-
var _a;
|
11259
|
-
const linkWrapper = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(this.GROUPED_LINKS_WRAPPER_CLASS);
|
11260
|
-
if (!linkWrapper)
|
11261
|
-
return;
|
11262
|
-
if (!this.isSideNavExpanded &&
|
11263
|
-
!this.collapsedNavItemsHeight &&
|
11264
|
-
this.expanded) {
|
11265
|
-
this.collapsedNavItemsHeight = this.getNavigationChildItemsHeight();
|
11266
|
-
this.setGroupedLinksElementHeight(linkWrapper, this.collapsedNavItemsHeight);
|
11267
|
-
}
|
11268
|
-
if (this.isSideNavExpanded && this.expanded) {
|
11269
|
-
this.expandedNavItemsHeight = this.getNavigationChildItemsHeight();
|
11270
|
-
this.setGroupedLinksElementHeight(linkWrapper, this.expandedNavItemsHeight);
|
11271
|
-
}
|
11272
|
-
};
|
11273
11198
|
this.renderGroupTitleText = () => (hAsync("ic-typography", { id: "nav-group-title", variant: this.navigationType === "side" ? "caption" : "label" }, this.label));
|
11274
11199
|
this.renderNavigationItems = () => {
|
11275
11200
|
if (this.dropdownOpen || (this.inTopNavSideMenu && !this.expandable)) {
|
11276
|
-
return
|
11201
|
+
return (hAsync("div", { class: {
|
11202
|
+
[this.inTopNavSideMenu
|
11203
|
+
? "navigation-group-dropdown-side-menu"
|
11204
|
+
: "navigation-group-dropdown"]: true,
|
11205
|
+
selected: this.dropdownOpen && !this.inTopNavSideMenu,
|
11206
|
+
}, onMouseLeave: !this.inTopNavSideMenu ? this.handleMouseLeave : undefined, ref: (el) => (this.dropdown = el) }, hAsync("nav", { class: {
|
11207
|
+
"navigation-group-dropdown-items": !this.inTopNavSideMenu,
|
11208
|
+
}, "aria-labelledby": "nav-group-title" }, hAsync("ul", null, hAsync("slot", null)))));
|
11277
11209
|
}
|
11278
11210
|
if (this.navigationType !== "top") {
|
11279
|
-
return this.
|
11211
|
+
return (hAsync("ul", { ref: (el) => (this.linkWrapper = el), class: "grouped-links-wrapper" }, hAsync("slot", null)));
|
11280
11212
|
}
|
11281
11213
|
return null;
|
11282
11214
|
};
|
11215
|
+
this.setGroupedLinksElementHeight = (height) => {
|
11216
|
+
var _a;
|
11217
|
+
(_a = this.linkWrapper) === null || _a === void 0 ? void 0 : _a.style.setProperty("--navigation-child-items-height", height);
|
11218
|
+
};
|
11283
11219
|
}
|
11284
11220
|
disconnectedCallback() {
|
11285
11221
|
var _a, _b;
|
@@ -11307,12 +11243,20 @@ class NavigationGroup {
|
|
11307
11243
|
}
|
11308
11244
|
}
|
11309
11245
|
componentDidLoad() {
|
11310
|
-
this.
|
11246
|
+
this.allGroupedNavigationItemHeights = `${Array.from(this.el.querySelectorAll(IC_NAVIGATION_ITEM)).reduce((childrenHeights, { offsetHeight }) => childrenHeights + offsetHeight, 0)}px`;
|
11311
11247
|
/**
|
11312
11248
|
* debounce is required as the incorrect height was retrieved instantly after
|
11313
11249
|
* componentDidLoad is invoked.
|
11314
11250
|
*/
|
11315
|
-
setTimeout(() =>
|
11251
|
+
setTimeout(() => {
|
11252
|
+
if (!this.linkWrapper || !this.expanded)
|
11253
|
+
return;
|
11254
|
+
if (!this.isSideNavExpanded)
|
11255
|
+
this.collapsedNavItemsHeight = this.allGroupedNavigationItemHeights;
|
11256
|
+
else
|
11257
|
+
this.expandedNavItemsHeight = this.allGroupedNavigationItemHeights;
|
11258
|
+
this.setGroupedLinksElementHeight(this.allGroupedNavigationItemHeights);
|
11259
|
+
}, DYNAMIC_GROUPED_LINKS_HEIGHT_MS);
|
11316
11260
|
}
|
11317
11261
|
childBlurHandler() {
|
11318
11262
|
this.hideDropdown();
|
@@ -11332,14 +11276,14 @@ class NavigationGroup {
|
|
11332
11276
|
* Sets focus on the nav item.
|
11333
11277
|
*/
|
11334
11278
|
async setFocus() {
|
11335
|
-
|
11336
|
-
|
11337
|
-
}
|
11279
|
+
var _a;
|
11280
|
+
(_a = this.groupEl) === null || _a === void 0 ? void 0 : _a.focus();
|
11338
11281
|
}
|
11339
11282
|
toggleDropdown() {
|
11340
11283
|
this.dropdownOpen = !this.dropdownOpen;
|
11341
|
-
this.inTopNavSideMenu
|
11284
|
+
if (this.inTopNavSideMenu) {
|
11342
11285
|
this.navigationGroupExpanded.emit({ expanded: this.dropdownOpen });
|
11286
|
+
}
|
11343
11287
|
}
|
11344
11288
|
showDropdown() {
|
11345
11289
|
if (!this.dropdownOpen) {
|
@@ -11355,32 +11299,29 @@ class NavigationGroup {
|
|
11355
11299
|
this.toggleDropdown();
|
11356
11300
|
}
|
11357
11301
|
}
|
11358
|
-
setGroupedLinksElementHeight(groupedNavItemWrapper, height) {
|
11359
|
-
groupedNavItemWrapper.style.setProperty("--navigation-child-items-height", height);
|
11360
|
-
}
|
11361
11302
|
render() {
|
11362
|
-
const { dropdownOpen, expanded, inTopNavSideMenu, expandable } = this;
|
11303
|
+
const { dropdownOpen, expanded, inTopNavSideMenu, expandable, theme, isSideNavExpanded, focusStyle, } = this;
|
11304
|
+
const getExpandedClassSuffix = (prop) => prop ? "expanded" : "collapsed";
|
11363
11305
|
const navGroupTitleClassNames = {
|
11364
|
-
|
11365
|
-
[
|
11366
|
-
[
|
11367
|
-
|
11368
|
-
["selected"]: dropdownOpen && !inTopNavSideMenu,
|
11306
|
+
"navigation-group": true,
|
11307
|
+
[focusStyle]: !inTopNavSideMenu,
|
11308
|
+
[`navigation-group-side-menu-${getExpandedClassSuffix(dropdownOpen)}`]: inTopNavSideMenu && expandable,
|
11309
|
+
selected: dropdownOpen && !inTopNavSideMenu,
|
11369
11310
|
};
|
11370
11311
|
const isSideNav = this.navigationType === "side";
|
11371
11312
|
const isTopNav = this.navigationType === "top";
|
11313
|
+
const isTopNavDesktop = !inTopNavSideMenu && isTopNav;
|
11372
11314
|
const ariaExpanded = (isSideNav && expanded) || (isTopNav && dropdownOpen);
|
11373
|
-
return (hAsync(Host, { key: '
|
11374
|
-
|
11375
|
-
"ic-navigation-group-
|
11376
|
-
"ic-navigation-group-
|
11377
|
-
[
|
11378
|
-
[`ic-theme-${
|
11379
|
-
|
11380
|
-
}, role: "listitem" }, this.expandable || (!inTopNavSideMenu && isTopNav) ? (hAsync("button", { onMouseEnter: !inTopNavSideMenu && isTopNav ? this.handleMouseEnter : undefined, onMouseLeave: isTopNav ? this.handleMouseLeave : undefined, onBlur: this.handleBlur, onClick: this.handleClick, onKeyDown: this.handleKeydown, class: navGroupTitleClassNames, ref: (el) => (this.groupEl = el), "aria-expanded": `${ariaExpanded}`, "aria-haspopup": `${!inTopNavSideMenu && isTopNav}` }, this.renderGroupTitleText(), isSideNav && expandable && (hAsync("div", { class: {
|
11315
|
+
return (hAsync(Host, { key: 'ae7929d3d2206250e982dbe9475b4ecb63835369', class: {
|
11316
|
+
"in-side-menu": inTopNavSideMenu,
|
11317
|
+
"ic-navigation-group-expandable": expandable,
|
11318
|
+
"ic-navigation-group-side-nav": isSideNav,
|
11319
|
+
[`ic-navigation-group-${getExpandedClassSuffix(expanded)}`]: true,
|
11320
|
+
[`ic-theme-${theme}`]: theme !== "inherit",
|
11321
|
+
}, role: "listitem" }, expandable || isTopNavDesktop ? (hAsync("button", { onMouseEnter: isTopNavDesktop ? this.handleMouseEnter : undefined, onMouseLeave: isTopNav ? this.handleMouseLeave : undefined, onBlur: this.handleBlur, onClick: this.handleClick, onKeyDown: this.handleKeydown, class: navGroupTitleClassNames, ref: (el) => (this.groupEl = el), "aria-expanded": `${ariaExpanded}`, "aria-haspopup": `${isTopNavDesktop}` }, this.renderGroupTitleText(), isSideNav && expandable && (hAsync("div", { class: {
|
11381
11322
|
"chevron-toggle-icon-wrapper": true,
|
11382
11323
|
"chevron-toggle-icon-closed": expanded,
|
11383
|
-
}, innerHTML: chevronIcon })))) : isSideNav
|
11324
|
+
}, innerHTML: chevronIcon })))) : ((!isSideNav || isSideNavExpanded) && (hAsync("div", { class: navGroupTitleClassNames }, this.renderGroupTitleText()))), this.renderNavigationItems()));
|
11384
11325
|
}
|
11385
11326
|
static get delegatesFocus() { return true; }
|
11386
11327
|
get el() { return getElement(this); }
|
@@ -11408,7 +11349,7 @@ class NavigationGroup {
|
|
11408
11349
|
}; }
|
11409
11350
|
}
|
11410
11351
|
|
11411
|
-
const icNavigationItemCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;--navigation-link-colour:var(--ic-brand-text-color)}:host(:focus-within){z-index:var(--ic-z-index-navigation-item)}svg{width:var(--ic-space-xl);fill:var(--ic-brand-text-color)}.svg{margin-left:auto}.chevron-container svg,.chevron-container .svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}.chevron-container{flex-grow:1}:host(.expandable.navigation-item) .link,:host(.expandable.navigation-item) ::slotted(a){padding-right:0}:host(.navigation-item) .link,:host(.navigation-item) ::slotted(a){height:calc(100% - var(--ic-space-xxs));width:-moz-fit-content;width:fit-content;color:var(--navigation-link-colour);display:flex;align-items:center;justify-content:center;padding:0 var(--ic-space-md) var(--ic-space-xxs);text-decoration:none;transition:var(--ic-easing-transition-fast);position:relative;white-space:nowrap}:host(.navigation-item) ::slotted(a){height:100%;font:var(--ic-font-label) !important;letter-spacing:var(--ic-font-letter-spacing-0pt025) !important;padding:0 var(--ic-space-md) !important}:host(.navigation-item-selected) .link::after,:host(.navigation-item-selected) ::slotted(a.active)::after,:host(.navigation-item-top-nav) ::slotted(a.active)::after{content:\"\";height:0.25rem;width:100%;position:absolute;bottom:0;background-color:var(--ic-top-navigation-theme)}:host(.navigation-item-selected.navigation-item-page-header) ::slotted(a.active)::after,:host(.navigation-item-selected.navigation-item-page-header) .link::after,:host(.navigation-item.navigation-item-page-header) ::slotted(a.active)::after,:host(.navigation-item-top-nav-child) ::slotted(a.active)::after{content:none}:host(.navigation-item-side-menu-selected) .link,:host(.navigation-item-side-menu) ::slotted(a.active),:host(.navigation-item-top-nav-child) ::slotted(a.active){box-shadow:none}:host(.navigation-item) .link:hover:not(:focus){background-color:var(--ic-brand-hover);cursor:pointer}:host(.navigation-item:not(.navigation-item-page-header,.navigation-item-side-menu)) ::slotted(a:hover:not(:focus)){background-color:var(--ic-brand-hover) !important}:host(.navigation-item:not(.navigation-item-top-nav-child,.navigation-item-side-menu,.navigation-item-top-nav-child-selected .navigation-item-side-menu-selected)) .focus-indicator:focus-within{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius)}:host(.navigation-item) .link:focus,:host(.navigation-item) ::slotted(a:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline)}:host(.navigation-item-selected) .link:focus,:host(.navigation-item) ::slotted(a.active:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline)}:host(.navigation-item) .link:active:not(:focus),:host(.navigation-item) ::slotted(a:active:not(:focus)){background-color:var(--ic-brand-active)}:host(.navigation-item-side-menu) .link,:host(.navigation-item-side-menu) ::slotted(a){min-height:2.5rem;height:auto;width:100%;box-sizing:border-box;color:var(--ic-top-navigation-nav-item);--ic-typography-color:var(--ic-top-navigation-nav-item);display:flex;align-items:center;justify-content:flex-start;text-decoration:none;text-wrap:wrap;white-space:normal;transition:box-shadow var(--ic-transition-duration-fast),\n border-radius var(--ic-transition-duration-fast)}:host(.navigation-item-top-nav-child) ::slotted(svg),:host(.navigation-item-side-menu) ::slotted(svg),:host(.navigation-item-page-header) ::slotted(svg){fill:var(--ic-color-text-primary)}:host(.navigation-item-side-menu) ::slotted(a){font:var(--ic-font-body) !important;letter-spacing:var(--ic-font-letter-spacing-0pt005) !important;transition:box-shadow var(--ic-easing-transition-fast),\n background-color var(--ic-easing-transition-fast)}:host(.navigation-item-side-menu) .link:hover:not(:focus){background-color:var(--ic-top-navigation-nav-item-hover)}:host(.navigation-item-side-menu) ::slotted(a:hover:not(:focus)){background-color:var(--ic-top-navigation-nav-item-hover) !important}:host(.navigation-item-side-menu) .focus-indicator:focus-within{box-shadow:none}:host(.navigation-item-side-menu) .link:focus,:host(.navigation-item-side-menu) ::slotted(a:focus){box-shadow:var(--ic-border-focus-inset) !important;width:auto;border-radius:var(--ic-border-radius-inset) !important}:host(.navigation-item-side-menu-selected) .link,:host(.navigation-item-side-menu-selected) ::slotted(a){transition:box-shadow var(--ic-easing-transition-slow),\n background-color var(--ic-easing-transition-slow)}:host(.navigation-item-side-menu-selected) .link:focus,:host(.navigation-item-side-menu) ::slotted(a.active:focus),:host(.navigation-item-top-nav-child) ::slotted(a.active:focus){margin-left:var(--ic-space-xs) !important;padding-left:var(--ic-space-xs) !important}:host(.navigation-item-top-nav-child) .link,:host(.navigation-item-top-nav-child) ::slotted(a){height:2.5rem;width:-moz-fit-content;width:fit-content;min-width:9.063rem;color:var(--ic-top-navigation-nav-item);display:flex;align-items:center;justify-content:flex-start;padding:0 var(--ic-space-md) !important;text-decoration:none;position:relative;transition:box-shadow var(--ic-transition-duration-fast),\n border-radius var(--ic-transition-duration-slow)}:host(.navigation-item-top-nav-child) ::slotted(a){font:var(--ic-font-body) !important;letter-spacing:var(--ic-font-letter-spacing-0pt005) !important}:host(.navigation-item-top-nav-child) .link:hover:not(:focus){background-color:var(--ic-top-navigation-nav-item-hover) !important}:host(.navigation-item-top-nav-child) ::slotted(a:hover):not(:focus){background-color:var(--ic-top-navigation-nav-item-hover) !important}:host(.navigation-item-top-nav-child) .link:focus,:host(.navigation-item-top-nav-child) ::slotted(a:focus){z-index:1;outline:var(--ic-hc-focus-outline);border-radius:var(--ic-border-radius-inset);box-shadow:var(--ic-border-focus-inset);transition:border-radius 0s, box-shadow var(--ic-transition-duration-fast)}:host(.navigation-item-top-nav-child) ::slotted(a.active:focus){box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset)}:host(.navigation-item-side-menu) .link:active:not(:focus){background-color:var(--ic-top-navigation-nav-item-pressed)}:host(.navigation-item-top-nav-child) .link:active:not(:focus),:host(.navigation-item-top-nav-child) ::slotted(a:active):not(:focus){outline:var(--ic-hc-focus-outline);background-color:var(--ic-top-navigation-nav-item-pressed)}:host(.navigation-item-top-nav-child) ::slotted(a:active):not(:focus),:host(.navigation-item-side-menu) ::slotted(a:active):not(:focus){background-color:var(--ic-top-navigation-nav-item-pressed) !important}:host(.navigation-item-side-menu-selected) *,:host(.navigation-item-top-nav-child-selected) *,:host(.navigation-item-side-menu) ::slotted(a.active),:host(.navigation-item-top-nav-child) ::slotted(a.active){font-weight:700 !important}:host(.navigation-item-top-nav-child) ::slotted(a.active)::before,:host(.navigation-item-top-nav-child-selected) .link::before,:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu) ::slotted(a.active)::before,:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before{content:\"\";position:absolute;left:0;width:var(--ic-space-xs);height:inherit;min-height:2.5rem;background-color:var(--ic-top-navigation-nav-item-banner);transition:left 0s}:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu-selected) .link:focus::before{margin-top:var(--ic-space-xxs)}:host(.navigation-item-top-nav-child-selected) .link:focus{margin-left:var(--ic-space-xs);margin-right:calc(-1 * var(--ic-space-xs));padding-left:var(--ic-space-xs) !important}:host(.navigation-item-top-nav-child-selected) .link:focus::before{left:calc(-1 * var(--ic-space-xs));z-index:1}:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu) ::slotted(a.active)::before,:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before{z-index:1}:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before,:host(.navigation-item-top-nav-child) ::slotted(a.active:focus)::before{left:calc(-1 * var(--ic-space-xs))}:host(.navigation-item-side-menu-selected) .link::after{display:none}:host(.navigation-item-side-nav-collapsed) .link{height:100%}:host(.navigation-item-side-nav-collapsed) ::slotted(svg),:host(.navigation-item-side-nav-collapsed-with-label) ::slotted(svg){margin:auto;pointer-events:none}:host(.navigation-item-side-nav-collapsed) .icon,:host(.navigation-item-side-nav-collapsed-with-label) .icon,:host(.navigation-item-side-nav-collapsed-with-label) ic-typography{align-items:center;padding:0;margin:auto 0;width:-moz-fit-content;width:fit-content;pointer-events:none}:host(.navigation-item-side-nav-collapsed-with-label) ic-typography{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;text-align:center}:host(.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:flex;flex-direction:column;height:-moz-fit-content;height:fit-content;padding:var(--ic-space-xs) !important;gap:var(--ic-space-xxs)}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) ::slotted(a){height:auto !important;gap:0;width:auto;padding:var(--ic-space-xs) !important}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:block;text-align:center}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link ic-typography{opacity:1;min-width:-moz-min-content;min-width:min-content}:host(.navigation-item-side-nav-collapsed) svg,:host(.navigation-item-side-nav-collapsed-with-label) svg{display:none}::slotted(svg){fill:var(--ic-brand-text-color);height:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:var(--ic-space-md)}.icon{height:1.5rem;width:var(--ic-space-xxl);margin-left:calc(-1 * var(--ic-space-md));flex:0 1 0%;position:relative}.icon>::slotted(*){margin-left:var(--ic-space-md) !important;margin-right:var(--ic-space-xs)}.inline-badge{margin-left:var(--ic-space-xs)}.badge{margin-left:0}:host(.navigation-item-side-nav-collapsed) .icon>::slotted(*){margin:auto !important}:host(.navigation-item-side-nav) .icon>::slotted(*){margin-right:0}:host(.navigation-item-side-nav) .link,:host(.navigation-item-side-nav) ::slotted(a){height:var(--navigation-item-height, 4rem);min-height:var(--navigation-item-min-height);width:var(--navigation-item-width, auto);justify-content:var(--navigation-item-justify-content);display:flex;gap:var(--ic-space-xs);box-sizing:border-box;color:var(--navigation-item-child-color) !important;text-decoration:none !important;white-space:nowrap;padding:0 var(--ic-space-md);text-wrap:wrap}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a){height:var(--navigation-item-child-height);width:var(--navigation-group-width);color:var(--navigation-item-child-color) !important;display:flex;gap:0.625rem;box-sizing:border-box;min-width:0;transition:box-shadow var(--ic-easing-transition-fast);text-decoration:none !important;white-space:nowrap}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link:focus,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a:focus){box-shadow:var(--ic-border-focus-dark)}:host(.navigation-item-side-nav.navigation-item-side-menu) .link:active{background-color:var(--navigation-item-child-active)}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link:active,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a:active){background-color:var(--navigation-item-child-active)}:host(.navigation-item-side-nav) a.link ic-typography,:host(.navigation-item-side-nav.navigation-item-top-nav-child) a.link ic-typography,:host(.navigation-item-side-nav) div.link ic-typography,:host(.navigation-item-side-nav.navigation-item-top-nav-child) div.link ic-typography,.navigation-item-side-nav-slotted-text{opacity:var(--navigation-item-label-opacity);transition:opacity var(--ic-easing-transition-slow);white-space:wrap;text-overflow:ellipsis;overflow:hidden}:host(.navigation-item-side-nav.navigation-item-selected) .link,:host(.navigation-item-side-nav.navigation-item) ::slotted(a.active){box-shadow:inset 0.313rem 0 0 var(--ic-brand-text-color)}:host(.navigation-item-side-nav.navigation-item-selected) .link::before,:host(.navigation-item-side-nav) ::slotted(a.active)::before{content:\"\";display:block;position:absolute;inset:0 0 0 0.313rem;border-radius:0.688rem !important;transition:var(--ic-easing-transition-slow)}:host(.navigation-item-side-nav.navigation-item-selected) .link:focus::before,:host(.navigation-item-side-nav) ::slotted(a.active:focus)::before{box-shadow:var(--ic-border-focus-inset)}:host(:not(.navigation-item-side-nav-collapsed).navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link{opacity:var(--navigation-item-label-opacity);height:auto}:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) ::slotted(a){min-width:var(--navigation-group-item-min-width);padding:var(--ic-space-xs) !important;height:auto;gap:0}:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:block}:host(.navigation-item-side-nav.navigation-item-selected) .link::after,:host(.navigation-item-side-nav) ::slotted(a.active)::after{display:none}:host(.navigation-item-side-nav.navigation-item) .link:focus,:host(.navigation-item-side-nav.navigation-item) ::slotted(a:focus){box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);background-color:transparent}:host(.navigation-item-side-nav.navigation-item-selected) .link:focus,:host(.navigation-item-side-nav) ::slotted(a.active:focus){margin:0 auto;box-shadow:inset 0.313rem 0 0 var(--ic-brand-text-color);border-radius:0}:host(.navigation-item-side-nav.navigation-item) .link:hover:not(:focus){background-color:var(--ic-brand-hover) !important}:host(.navigation-item-page-header).link,:host(.navigation-item-page-header) a,:host(.navigation-item-page-header) ::slotted(a){height:2.5rem !important;color:var(--ic-color-text-primary) !important;transition:all var(--ic-easing-transition-fast) !important;box-shadow:rgba(23 89 188 / 0%) !important}:host(.navigation-item-page-header.navigation-item-selected) .link::after,:host(.navigation-item-page-header) ::slotted(a.active)::after{content:\" \" !important;position:absolute;bottom:0;left:0;right:0;height:var(--ic-space-xxs);background-color:var(--ic-action-default) !important}:host(.navigation-item-page-header) .link:hover,:host(.navigation-item-page-header) ::slotted(.link:hover),:host(.navigation-item-page-header) ::slotted(a:hover),:host(.navigation-item-page-header) .link:hover:not(:focus){background-color:var(--ic-action-default-bg-hover) !important;cursor:pointer}:host(.navigation-item-page-header) .link:focus,:host(.navigation-item-page-header) ::slotted(a:focus){box-shadow:var(--ic-border-focus)}:host(.navigation-item-page-header) .link:active,:host(.navigation-item-page-header) ::slotted(a:active){background-color:var(--ic-action-default-bg-pressed) !important}:host(.navigation-item-page-header.navigation-item-selected) .link:focus::after,:host(.navigation-item-page-header) ::slotted(a.active:focus)::after{border-bottom-left-radius:var(--ic-border-radius);border-bottom-right-radius:var(--ic-border-radius)}:host(.navigation-item-page-header.navigation-item-selected.with-transition) .link,:host(.navigation-item-page-header.navigation-item-selected.with-transition) ::slotted(a.active){transition:all var(--ic-easing-transition-fast),\n border-color var(--ic-transition-duration-fast)}:host(.navigation-item-page-header) ::slotted(a.active)::before,:host(.navigation-item-page-header) ::slotted(a.active:focus)::before,:host(.navigation-item-page-header.navigation-item-selected) .link:focus::before{display:none}.open-in-new-icon{flex:1}.open-in-new-icon svg{margin-top:var(--ic-space-xxs);padding-left:var(--ic-space-xs)}:host(.navigation-item-side-nav) .open-in-new-icon{margin-left:calc(-1 * var(--ic-space-xs))}:host(.navigation-item-top-nav) .open-in-new-icon svg,:host(.navigation-item-page-header) .open-in-new-icon svg,:host(.navigation-item-side-nav) .open-in-new-icon svg{height:0.875rem;width:0.875rem}:host(.navigation-item-side-menu) .open-in-new-icon svg,:host(.navigation-item-top-nav-child) .open-in-new-icon svg{height:var(--ic-space-md);width:var(--ic-space-md)}:host(.navigation-item-page-header) .open-in-new-icon svg,:host(.navigation-item-top-nav-child) .open-in-new-icon svg,:host(.navigation-item-side-menu) .open-in-new-icon svg{fill:var(--ic-color-text-primary)}@media (forced-colors: active){.open-in-new-icon svg{fill:currentcolor}}";
|
11352
|
+
const icNavigationItemCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;--navigation-link-colour:var(--ic-brand-text-color)}:host(:focus-within){z-index:var(--ic-z-index-navigation-item)}svg{width:var(--ic-space-xl);fill:var(--ic-brand-text-color)}.svg{margin-left:auto}.chevron-container svg,.chevron-container .svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}.chevron-container{flex-grow:1}:host(.expandable.navigation-item) .link,:host(.expandable.navigation-item) ::slotted(a){padding-right:0}:host(.navigation-item) .link,:host(.navigation-item) ::slotted(a){height:calc(100% - var(--ic-space-xxs));width:-moz-fit-content;width:fit-content;color:var(--navigation-link-colour);display:flex;align-items:center;justify-content:center;padding:0 var(--ic-space-md) var(--ic-space-xxs);text-decoration:none;transition:var(--ic-easing-transition-fast);position:relative;white-space:nowrap}:host(.navigation-item) ::slotted(a){height:100%;font:var(--ic-font-label) !important;letter-spacing:var(--ic-font-letter-spacing-0pt025) !important;padding:0 var(--ic-space-md) !important}:host(.navigation-item-selected) .link::after,:host(.navigation-item-selected) ::slotted(a.active)::after,:host(.navigation-item-top-nav) ::slotted(a.active)::after{content:\"\";height:0.25rem;width:100%;position:absolute;bottom:0;background-color:var(--ic-top-navigation-theme)}:host(.navigation-item-selected.navigation-item-page-header) ::slotted(a.active)::after,:host(.navigation-item-selected.navigation-item-page-header) .link::after,:host(.navigation-item.navigation-item-page-header) ::slotted(a.active)::after,:host(.navigation-item-top-nav-child) ::slotted(a.active)::after{content:none}:host(.navigation-item-side-menu-selected) .link,:host(.navigation-item-side-menu) ::slotted(a.active),:host(.navigation-item-top-nav-child) ::slotted(a.active){box-shadow:none}:host(.navigation-item) .link:hover:not(:focus){background-color:var(--ic-brand-hover);cursor:pointer}:host(.navigation-item:not(.navigation-item-top-nav-child,.navigation-item-side-menu,.navigation-item-top-nav-child-selected .navigation-item-side-menu-selected)) .focus-indicator:focus-within{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius)}:host(.navigation-item) .link:focus,:host(.navigation-item) ::slotted(a:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline);outline-offset:calc(-1 * (var(--ic-space-xxxs) + var(--ic-space-1px) / 2))}:host(.navigation-item-selected) .link:focus,:host(.navigation-item) ::slotted(a.active:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline);outline-offset:calc(-1 * (var(--ic-space-xxxs) + var(--ic-space-1px) / 2))}:host(.navigation-item) .link:active:not(:focus),:host(.navigation-item) ::slotted(a:active:not(:focus)){background-color:var(--ic-brand-active)}:host(.navigation-item-side-menu) .link,:host(.navigation-item-side-menu) ::slotted(a){min-height:2.5rem;height:auto;width:100%;box-sizing:border-box;color:var(--ic-top-navigation-nav-item);--ic-typography-color:var(--ic-top-navigation-nav-item);display:flex;align-items:center;justify-content:flex-start;text-decoration:none;text-wrap:wrap;white-space:normal;transition:box-shadow var(--ic-transition-duration-fast),\n border-radius var(--ic-transition-duration-fast)}:host(.navigation-item-top-nav-child) ::slotted(svg),:host(.navigation-item-side-menu) ::slotted(svg),:host(.navigation-item-page-header) ::slotted(svg){fill:var(--ic-color-text-primary)}:host(.navigation-item-side-menu) ::slotted(a){font:var(--ic-font-body) !important;letter-spacing:var(--ic-font-letter-spacing-0pt005) !important;transition:box-shadow var(--ic-easing-transition-fast),\n background-color var(--ic-easing-transition-fast)}:host(.navigation-item-side-menu) .link:hover:not(:focus){background-color:var(--ic-top-navigation-nav-item-hover)}:host(.navigation-item-side-menu) ::slotted(a:hover:not(:focus)){background-color:var(--ic-top-navigation-nav-item-hover) !important}:host(.navigation-item-side-menu) .focus-indicator:focus-within{box-shadow:none}:host(.navigation-item-side-menu) .link:focus,:host(.navigation-item-side-menu) ::slotted(a:focus){box-shadow:var(--ic-border-focus-inset) !important;width:auto;border-radius:var(--ic-border-radius-inset) !important}:host(.navigation-item-side-menu-selected) .link,:host(.navigation-item-side-menu-selected) ::slotted(a){transition:box-shadow var(--ic-easing-transition-slow),\n background-color var(--ic-easing-transition-slow)}:host(.navigation-item-side-menu-selected) .link:focus,:host(.navigation-item-side-menu) ::slotted(a.active:focus),:host(.navigation-item-top-nav-child) ::slotted(a.active:focus){margin-left:var(--ic-space-xs) !important;padding-left:var(--ic-space-xs) !important}:host(.navigation-item-top-nav-child) .link,:host(.navigation-item-top-nav-child) ::slotted(a){height:2.5rem;width:-moz-fit-content;width:fit-content;min-width:9.063rem;color:var(--ic-top-navigation-nav-item);display:flex;align-items:center;justify-content:flex-start;padding:0 var(--ic-space-md) !important;text-decoration:none;position:relative;transition:box-shadow var(--ic-transition-duration-fast),\n border-radius var(--ic-transition-duration-slow)}:host(.navigation-item-top-nav-child) ::slotted(a){font:var(--ic-font-body) !important;letter-spacing:var(--ic-font-letter-spacing-0pt005) !important}:host(.navigation-item-top-nav-child) .link:hover:not(:focus),:host(.navigation-item-top-nav-child) ::slotted(a:hover:not(:focus)){background-color:var(--ic-top-navigation-nav-item-hover) !important}:host(.navigation-item-top-nav-child) .link:focus,:host(.navigation-item-top-nav-child) ::slotted(a:focus){z-index:1;outline:var(--ic-hc-focus-outline);border-radius:var(--ic-border-radius-inset);box-shadow:var(--ic-border-focus-inset);transition:border-radius 0s, box-shadow var(--ic-transition-duration-fast)}:host(.navigation-item-top-nav-child) ::slotted(a.active:focus){box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset)}:host(.navigation-item-side-menu) .link:active:not(:focus){background-color:var(--ic-top-navigation-nav-item-pressed)}:host(.navigation-item-top-nav-child) .link:active:not(:focus),:host(.navigation-item-top-nav-child) ::slotted(a:active:not(:focus)){outline:var(--ic-hc-focus-outline);background-color:var(--ic-top-navigation-nav-item-pressed)}:host(.navigation-item-top-nav-child) ::slotted(a:active:not(:focus)),:host(.navigation-item-side-menu) ::slotted(a:active:not(:focus)){background-color:var(--ic-top-navigation-nav-item-pressed) !important}:host(.navigation-item-side-menu-selected) *,:host(.navigation-item-top-nav-child-selected) *,:host(.navigation-item-side-menu) ::slotted(a.active),:host(.navigation-item-top-nav-child) ::slotted(a.active){font-weight:700 !important}:host(.navigation-item-top-nav-child) ::slotted(a.active)::before,:host(.navigation-item-top-nav-child-selected) .link::before,:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu) ::slotted(a.active)::before,:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before{content:\"\";position:absolute;left:0;width:var(--ic-space-xs);height:inherit;min-height:2.5rem;background-color:var(--ic-top-navigation-nav-item-banner);transition:left 0s}:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu-selected) .link:focus::before{margin-top:var(--ic-space-xxs)}:host(.navigation-item-top-nav-child-selected) .link:focus{margin-left:var(--ic-space-xs);margin-right:calc(-1 * var(--ic-space-xs));padding-left:var(--ic-space-xs) !important}:host(.navigation-item-top-nav-child-selected) .link:focus::before{left:calc(-1 * var(--ic-space-xs));z-index:1}:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu) ::slotted(a.active)::before,:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before{z-index:1}:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before,:host(.navigation-item-top-nav-child) ::slotted(a.active:focus)::before{left:calc(-1 * var(--ic-space-xs))}:host(.navigation-item-side-menu-selected) .link::after{display:none}:host(.navigation-item-side-nav-collapsed) .link{height:100%}:host(.navigation-item-side-nav-collapsed) ::slotted(svg),:host(.navigation-item-side-nav-collapsed-with-label) ::slotted(svg){margin:auto;pointer-events:none}:host(.navigation-item-side-nav-collapsed) .icon,:host(.navigation-item-side-nav-collapsed-with-label) .icon,:host(.navigation-item-side-nav-collapsed-with-label) ic-typography{align-items:center;padding:0;margin:auto 0;width:-moz-fit-content;width:fit-content;pointer-events:none}:host(.navigation-item-side-nav-collapsed-with-label) ic-typography{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;text-align:center}:host(.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:flex;flex-direction:column;height:-moz-fit-content;height:fit-content;padding:var(--ic-space-xs) !important;gap:var(--ic-space-xxs)}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) ::slotted(a){height:auto !important;gap:0;width:auto;padding:var(--ic-space-xs) !important}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:block;text-align:center}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link ic-typography{opacity:1;min-width:-moz-min-content;min-width:min-content}:host(.navigation-item-side-nav-collapsed) svg,:host(.navigation-item-side-nav-collapsed-with-label) svg{display:none}::slotted(svg){fill:var(--ic-brand-text-color);height:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:var(--ic-space-md)}.icon{height:1.5rem;width:var(--ic-space-xxl);margin-left:calc(-1 * var(--ic-space-md));flex:0 1 0%;position:relative}.icon>::slotted(*){margin-left:var(--ic-space-md) !important;margin-right:var(--ic-space-xs)}.inline-badge{margin-left:var(--ic-space-xs)}.badge{margin-left:0}:host(.navigation-item-side-nav-collapsed) .icon>::slotted(*){margin:auto !important}:host(.navigation-item-side-nav) .icon>::slotted(*){margin-right:0}:host(.navigation-item-side-nav) .link,:host(.navigation-item-side-nav) ::slotted(a){height:var(--navigation-item-height, 4rem);min-height:var(--navigation-item-min-height);width:var(--navigation-item-width, auto);justify-content:var(--navigation-item-justify-content);display:flex;gap:var(--ic-space-xs);box-sizing:border-box;color:var(--navigation-item-child-color) !important;text-decoration:none !important;white-space:nowrap;padding:0 var(--ic-space-md);text-wrap:wrap}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a){height:var(--navigation-item-child-height);width:var(--navigation-group-width);color:var(--navigation-item-child-color) !important;display:flex;gap:0.625rem;box-sizing:border-box;min-width:0;transition:box-shadow var(--ic-easing-transition-fast);text-decoration:none !important;white-space:nowrap}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link:focus,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a:focus){box-shadow:var(--ic-border-focus-dark)}:host(.navigation-item-side-nav.navigation-item-side-menu) .link:active{background-color:var(--navigation-item-child-active)}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link:active,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a:active){background-color:var(--navigation-item-child-active)}:host(.navigation-item-side-nav) a.link ic-typography,:host(.navigation-item-side-nav.navigation-item-top-nav-child) a.link ic-typography,:host(.navigation-item-side-nav) div.link ic-typography,:host(.navigation-item-side-nav.navigation-item-top-nav-child) div.link ic-typography,.navigation-item-side-nav-slotted-text{opacity:var(--navigation-item-label-opacity);transition:opacity var(--ic-easing-transition-slow);white-space:wrap;text-overflow:ellipsis;overflow:hidden}:host(.navigation-item-side-nav.navigation-item-selected) .link,:host(.navigation-item-side-nav.navigation-item) ::slotted(a.active){box-shadow:inset 0.313rem 0 0 var(--ic-brand-text-color)}:host(.navigation-item-side-nav.navigation-item-selected) .link::before,:host(.navigation-item-side-nav) ::slotted(a.active)::before{content:\"\";display:block;position:absolute;inset:0 0 0 0.313rem;border-radius:0.688rem !important;transition:var(--ic-easing-transition-slow)}:host(.navigation-item-side-nav.navigation-item-selected) .link:focus::before,:host(.navigation-item-side-nav) ::slotted(a.active:focus)::before{box-shadow:var(--ic-border-focus-inset)}:host(:not(.navigation-item-side-nav-collapsed).navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link{opacity:var(--navigation-item-label-opacity);height:auto}:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) ::slotted(a){min-width:var(--navigation-group-item-min-width);padding:var(--ic-space-xs) !important;height:auto;gap:0}:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:block}:host(.navigation-item-side-nav.navigation-item-selected) .link::after,:host(.navigation-item-side-nav) ::slotted(a.active)::after{display:none}:host(.navigation-item-side-nav.navigation-item) .link:focus,:host(.navigation-item-side-nav.navigation-item) ::slotted(a:focus){box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);background-color:transparent}:host(.navigation-item-side-nav.navigation-item-selected) .link:focus,:host(.navigation-item-side-nav) ::slotted(a.active:focus){margin:0 auto;box-shadow:inset 0.313rem 0 0 var(--ic-brand-text-color);border-radius:0}:host(.navigation-item-side-nav.navigation-item) .link:hover:not(:focus){background-color:var(--ic-brand-hover) !important}:host(.navigation-item-page-header).link,:host(.navigation-item-page-header) a,:host(.navigation-item-page-header) ::slotted(a){height:2.5rem !important;color:var(--ic-color-text-primary) !important;transition:all var(--ic-easing-transition-fast) !important;box-shadow:rgba(23 89 188 / 0%) !important}:host(.navigation-item-page-header.navigation-item-selected) .link::after,:host(.navigation-item-page-header) ::slotted(a.active)::after{content:\" \" !important;position:absolute;bottom:0;left:0;right:0;height:var(--ic-space-xxs);background-color:var(--ic-action-default) !important}:host(.navigation-item-page-header) .link:hover,:host(.navigation-item-page-header) ::slotted(.link:hover),:host(.navigation-item-page-header) ::slotted(a:hover),:host(.navigation-item-page-header) .link:hover:not(:focus){background-color:var(--ic-action-default-bg-hover) !important;cursor:pointer}:host(.navigation-item-page-header) .link:focus,:host(.navigation-item-page-header) ::slotted(a:focus){box-shadow:var(--ic-border-focus)}:host(.navigation-item-page-header) .link:active,:host(.navigation-item-page-header) ::slotted(a:active){background-color:var(--ic-action-default-bg-pressed) !important}:host(.navigation-item-page-header.navigation-item-selected) .link:focus::after,:host(.navigation-item-page-header) ::slotted(a.active:focus)::after{border-bottom-left-radius:var(--ic-border-radius);border-bottom-right-radius:var(--ic-border-radius)}:host(.navigation-item-page-header.navigation-item-selected.with-transition) .link,:host(.navigation-item-page-header.navigation-item-selected.with-transition) ::slotted(a.active){transition:all var(--ic-easing-transition-fast),\n border-color var(--ic-transition-duration-fast)}:host(.navigation-item-page-header) ::slotted(a.active)::before,:host(.navigation-item-page-header) ::slotted(a.active:focus)::before,:host(.navigation-item-page-header.navigation-item-selected) .link:focus::before{display:none}.open-in-new-icon{flex:1}.open-in-new-icon svg{margin-top:var(--ic-space-xxs);padding-left:var(--ic-space-xs)}:host(.navigation-item-side-nav) .open-in-new-icon{margin-left:calc(-1 * var(--ic-space-xs))}:host(.navigation-item-top-nav) .open-in-new-icon svg,:host(.navigation-item-page-header) .open-in-new-icon svg,:host(.navigation-item-side-nav) .open-in-new-icon svg{height:0.875rem;width:0.875rem}:host(.navigation-item-side-menu) .open-in-new-icon svg,:host(.navigation-item-top-nav-child) .open-in-new-icon svg{height:var(--ic-space-md);width:var(--ic-space-md)}:host(.navigation-item-page-header) .open-in-new-icon svg,:host(.navigation-item-top-nav-child) .open-in-new-icon svg,:host(.navigation-item-side-menu) .open-in-new-icon svg{fill:var(--ic-color-text-primary)}@media (forced-colors: active){.open-in-new-icon svg{fill:currentcolor}}";
|
11412
11353
|
var IcNavigationItemStyle0 = icNavigationItemCss;
|
11413
11354
|
|
11414
11355
|
/**
|
@@ -11425,6 +11366,7 @@ class NavigationItem {
|
|
11425
11366
|
this.hostMutationObserver = null;
|
11426
11367
|
this.ANIMATION_DURATION = parseInt(getCssProperty("--ic-transition-duration-slow")) || 0;
|
11427
11368
|
this.ARIA_LABEL_STRING = "aria-label";
|
11369
|
+
this.isInSideNav = false;
|
11428
11370
|
this.deviceSize = DEVICE_SIZES.XL;
|
11429
11371
|
this.focusStyle = getBrandForegroundAppearance();
|
11430
11372
|
this.inTopNavSideMenu = false;
|
@@ -11460,7 +11402,7 @@ class NavigationItem {
|
|
11460
11402
|
* Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
|
11461
11403
|
*/
|
11462
11404
|
this.theme = "inherit";
|
11463
|
-
this.displayDefaultNavigationItem = (href, hreflang, target, rel, referrerpolicy, download
|
11405
|
+
this.displayDefaultNavigationItem = (href, label, hreflang, target, rel, referrerpolicy, download) => {
|
11464
11406
|
const variant = this.isTopNavChild || this.inTopNavSideMenu ? "body" : "label";
|
11465
11407
|
const ChevronIconComponent = this.expandable && (hAsync("div", { class: { svg: true }, innerHTML: chevronIcon }));
|
11466
11408
|
const slottedBadgeEl = this.el.querySelector('[slot="badge"]');
|
@@ -11468,11 +11410,8 @@ class NavigationItem {
|
|
11468
11410
|
this.inTopNavSideMenu
|
11469
11411
|
? "inline-badge"
|
11470
11412
|
: "badge" }, hAsync("slot", { name: "badge" })));
|
11471
|
-
const IconComponent = this.el.querySelector('[slot="icon"]') && (hAsync("div", { class: "icon" }, hAsync("slot", { name: "icon" }), this.
|
11472
|
-
|
11473
|
-
return (hAsync("a", { href: href, target: target, rel: rel, hreflang: hreflang, referrerPolicy: referrerpolicy, download: download !== false ? download : null, class: "link", ref: (el) => (this.itemEl = el), part: "link", "aria-label": this.ariaLabel ? this.ariaLabel : null }, IconComponent, hAsync("ic-typography", { variant: variant }, label), target === "_blank" && (hAsync("span", { class: "open-in-new-icon", innerHTML: OpenInNew })), BadgeComponent, hAsync("div", { class: "chevron-container" }, ChevronIconComponent)));
|
11474
|
-
}
|
11475
|
-
return (hAsync("div", { tabindex: "0", class: "link", ref: (el) => (this.itemEl = el) }, IconComponent, hAsync("ic-typography", { variant: variant }, label), ChevronIconComponent, BadgeComponent));
|
11413
|
+
const IconComponent = this.el.querySelector('[slot="icon"]') && (hAsync("div", { class: "icon" }, hAsync("slot", { name: "icon" }), this.isInSideNav && BadgeComponent));
|
11414
|
+
return href !== "" ? (hAsync("a", { href: href, target: target, rel: rel, hreflang: hreflang, referrerPolicy: referrerpolicy, download: download !== false ? download : null, class: "link", ref: (el) => (this.itemEl = el), part: "link", "aria-label": this.ariaLabel ? this.ariaLabel : null }, IconComponent, hAsync("ic-typography", { variant: variant }, label), target === "_blank" && (hAsync("span", { class: "open-in-new-icon", innerHTML: OpenInNew })), BadgeComponent, hAsync("div", { class: "chevron-container" }, ChevronIconComponent))) : (hAsync("div", { tabindex: "0", class: "link", ref: (el) => (this.itemEl = el) }, IconComponent, hAsync("ic-typography", { variant: variant }, label), ChevronIconComponent, BadgeComponent));
|
11476
11415
|
};
|
11477
11416
|
this.topNavResizedHandler = ({ detail, }) => {
|
11478
11417
|
var _a;
|
@@ -11488,7 +11427,7 @@ class NavigationItem {
|
|
11488
11427
|
const { sideNavExpanded, sideNavMobile } = detail;
|
11489
11428
|
this.sideNavExpanded = sideNavExpanded;
|
11490
11429
|
this.isSideNavMobile = sideNavMobile;
|
11491
|
-
this.sideNavToggleTooltip(!
|
11430
|
+
this.sideNavToggleTooltip(!sideNavExpanded && !sideNavMobile);
|
11492
11431
|
};
|
11493
11432
|
this.handleBlur = ({ relatedTarget }) => {
|
11494
11433
|
if (relatedTarget === null ||
|
@@ -11496,8 +11435,13 @@ class NavigationItem {
|
|
11496
11435
|
this.childBlur.emit();
|
11497
11436
|
}
|
11498
11437
|
};
|
11499
|
-
this.handleClick = () => {
|
11500
|
-
|
11438
|
+
this.handleClick = (event) => {
|
11439
|
+
if (event.type === "click" ||
|
11440
|
+
(event.type === "keydown" &&
|
11441
|
+
(event.key === "Enter" ||
|
11442
|
+
event.key === " "))) {
|
11443
|
+
this.navItemClicked.emit();
|
11444
|
+
}
|
11501
11445
|
};
|
11502
11446
|
// triggered when attributes of host element change
|
11503
11447
|
this.hostMutationCallback = (mutationList) => {
|
@@ -11511,25 +11455,19 @@ class NavigationItem {
|
|
11511
11455
|
});
|
11512
11456
|
};
|
11513
11457
|
this.generateTooltipLabel = () => {
|
11458
|
+
var _a;
|
11514
11459
|
if (this.label) {
|
11515
11460
|
return this.label;
|
11516
11461
|
}
|
11517
11462
|
if (this.navigationSlot) {
|
11518
|
-
return this.navigationSlot.textContent;
|
11463
|
+
return this.navigationSlot.textContent || "";
|
11519
11464
|
}
|
11520
|
-
|
11521
|
-
return this.el.children[0].textContent;
|
11522
|
-
}
|
11523
|
-
return "";
|
11465
|
+
return ((_a = this.el.children[0]) === null || _a === void 0 ? void 0 : _a.textContent) || "";
|
11524
11466
|
};
|
11525
11467
|
this.renderNavigationItemContent = () => {
|
11526
|
-
if (this.label)
|
11527
|
-
return
|
11528
|
-
}
|
11529
|
-
if (this.navigationSlot) {
|
11530
|
-
return hAsync("slot", { name: "navigation-item" });
|
11531
|
-
}
|
11532
|
-
return hAsync("slot", null);
|
11468
|
+
if (!this.label && !this.navigationSlot)
|
11469
|
+
return hAsync("slot", null);
|
11470
|
+
return this.label ? (this.displayDefaultNavigationItem(this.href, this.label, this.hreflang, this.target, this.rel, this.referrerpolicy, this.download)) : (hAsync("slot", { name: "navigation-item" }));
|
11533
11471
|
};
|
11534
11472
|
// Displays tooltip only once the collapsing animation is finished
|
11535
11473
|
this.sideNavToggleTooltip = (showTooltip) => {
|
@@ -11537,23 +11475,26 @@ class NavigationItem {
|
|
11537
11475
|
const tooltip = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("ic-tooltip");
|
11538
11476
|
const collapsedClass = "tooltip-navigation-item-side-nav-collapsed";
|
11539
11477
|
let timer;
|
11540
|
-
if (tooltip)
|
11541
|
-
|
11542
|
-
|
11543
|
-
|
11544
|
-
|
11545
|
-
|
11546
|
-
}
|
11547
|
-
|
11548
|
-
|
11549
|
-
|
11550
|
-
|
11478
|
+
if (!tooltip)
|
11479
|
+
return;
|
11480
|
+
if (showTooltip) {
|
11481
|
+
tooltip.displayTooltip(false); // Hides tooltip for when mouse is hovering over icon
|
11482
|
+
timer = setTimeout(() => {
|
11483
|
+
tooltip.classList.add(collapsedClass);
|
11484
|
+
}, this.ANIMATION_DURATION);
|
11485
|
+
}
|
11486
|
+
else {
|
11487
|
+
clearTimeout(timer);
|
11488
|
+
tooltip.classList.remove(collapsedClass);
|
11551
11489
|
}
|
11552
11490
|
};
|
11553
11491
|
}
|
11492
|
+
navigationTypeChangeHandler() {
|
11493
|
+
this.isInSideNav = this.navigationType === "side";
|
11494
|
+
}
|
11554
11495
|
disconnectedCallback() {
|
11555
11496
|
var _a, _b, _c;
|
11556
|
-
if (this.
|
11497
|
+
if (this.isInSideNav) {
|
11557
11498
|
(_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.removeEventListener("icSideNavExpanded", this.sideNavExpandHandler);
|
11558
11499
|
}
|
11559
11500
|
else if (this.navigationType === "top") {
|
@@ -11565,13 +11506,14 @@ class NavigationItem {
|
|
11565
11506
|
var _a, _b, _c, _d, _e, _f;
|
11566
11507
|
const { navType, parent } = getNavItemParentDetails(this.el);
|
11567
11508
|
this.navigationType = navType;
|
11509
|
+
this.isInSideNav = this.navigationType === "side";
|
11568
11510
|
this.parentEl = parent;
|
11569
11511
|
this.deviceSize = getCurrentDeviceSize();
|
11570
11512
|
this.sideNavExpanded =
|
11571
11513
|
((_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.classList.contains("sm-expanded")) ||
|
11572
11514
|
((_b = this.parentEl) === null || _b === void 0 ? void 0 : _b.classList.contains("xs-menu-open")) ||
|
11573
11515
|
false;
|
11574
|
-
if (this.
|
11516
|
+
if (this.isInSideNav) {
|
11575
11517
|
(_c = this.parentEl) === null || _c === void 0 ? void 0 : _c.addEventListener("icSideNavExpanded", this.sideNavExpandHandler);
|
11576
11518
|
}
|
11577
11519
|
else if (this.navigationType === "top") {
|
@@ -11611,36 +11553,38 @@ class NavigationItem {
|
|
11611
11553
|
this.itemEl ? this.itemEl.focus() : (_a = this.el.querySelector("a")) === null || _a === void 0 ? void 0 : _a.focus();
|
11612
11554
|
}
|
11613
11555
|
render() {
|
11614
|
-
const { inTopNavSideMenu, isTopNavChild, selected } = this;
|
11615
|
-
|
11616
|
-
|
11617
|
-
|
11618
|
-
|
11619
|
-
|
11620
|
-
|
11621
|
-
|
11622
|
-
|
11623
|
-
|
11624
|
-
|
11625
|
-
|
11626
|
-
|
11627
|
-
|
11628
|
-
|
11629
|
-
|
11630
|
-
|
11631
|
-
|
11632
|
-
|
11633
|
-
|
11634
|
-
[
|
11635
|
-
|
11636
|
-
|
11637
|
-
|
11638
|
-
|
11639
|
-
["tooltip-long-label-navigation-item-side-nav-expanded"]: this.el.hasAttribute("[display-navigation-tooltip = 'true']"),
|
11556
|
+
const { inTopNavSideMenu, isTopNavChild, selected, navigationType, focusStyle, isInitialRender, sideNavExpanded, displayNavigationTooltip, collapsedIconLabel, isSideNavMobile, expandable, isInSideNav, theme, } = this;
|
11557
|
+
const isTopNavChildDesktop = isTopNavChild && !inTopNavSideMenu;
|
11558
|
+
return (hAsync(Host, { key: 'a46e99d4929b5257bd6b1fecabfae154e896d1a6', class: {
|
11559
|
+
"navigation-item": true,
|
11560
|
+
"navigation-item-selected": !isTopNavChild && selected,
|
11561
|
+
"navigation-item-top-nav": !inTopNavSideMenu && navigationType === "top",
|
11562
|
+
"navigation-item-top-nav-child": isTopNavChildDesktop,
|
11563
|
+
"navigation-item-top-nav-child-selected": isTopNavChildDesktop && selected,
|
11564
|
+
"navigation-item-side-menu": inTopNavSideMenu,
|
11565
|
+
"navigation-item-side-menu-selected": inTopNavSideMenu && selected,
|
11566
|
+
"navigation-item-page-header": navigationType === "page-header",
|
11567
|
+
"navigation-item-side-nav": isInSideNav,
|
11568
|
+
"navigation-item-side-nav-collapsed": (!sideNavExpanded || displayNavigationTooltip) && isInSideNav,
|
11569
|
+
"navigation-item-side-nav-collapsed-with-label": !sideNavExpanded &&
|
11570
|
+
isInSideNav &&
|
11571
|
+
collapsedIconLabel &&
|
11572
|
+
!isSideNavMobile,
|
11573
|
+
"with-transition": !isInitialRender,
|
11574
|
+
expandable,
|
11575
|
+
[focusStyle]: isTopNavChild ? isInSideNav : !inTopNavSideMenu,
|
11576
|
+
[`ic-theme-${theme}`]: theme !== "inherit",
|
11577
|
+
}, onBlur: isTopNavChildDesktop ? this.handleBlur : null, onClick: this.handleClick, onKeyDown: this.handleClick, "aria-current": selected ? "page" : null, role: "listitem" }, hAsync("ic-tooltip", { key: 'ace34ef496173488d3957ef6e09e7dd6b8804ca1', label: this.generateTooltipLabel(), target: "navigation-item", placement: "right", class: {
|
11578
|
+
"tooltip-navigation-item": true,
|
11579
|
+
"tooltip-navigation-item-side-nav-collapsed": displayNavigationTooltip && isInSideNav,
|
11580
|
+
"tooltip-long-label-navigation-item-side-nav-expanded": this.el.hasAttribute("[display-navigation-tooltip = 'true']"),
|
11640
11581
|
} }, this.renderNavigationItemContent())));
|
11641
11582
|
}
|
11642
11583
|
static get delegatesFocus() { return true; }
|
11643
11584
|
get el() { return getElement(this); }
|
11585
|
+
static get watchers() { return {
|
11586
|
+
"navigationType": ["navigationTypeChangeHandler"]
|
11587
|
+
}; }
|
11644
11588
|
static get style() { return IcNavigationItemStyle0; }
|
11645
11589
|
static get cmpMeta() { return {
|
11646
11590
|
"$flags$": 25,
|
@@ -11803,16 +11747,16 @@ class NavigationMenu {
|
|
11803
11747
|
}
|
11804
11748
|
}
|
11805
11749
|
render() {
|
11806
|
-
return (hAsync(Host, { key: '
|
11750
|
+
return (hAsync(Host, { key: 'd37a801a1b4c312fb3d1e301150ce4b731b8e378', class: { [`ic-theme-${this.theme}`]: this.theme !== "inherit" } }, hAsync("div", { key: 'e243034b5ec260c946217f411c4c0c56773a3ff0', class: "popout-modal", onClick: this.closeMenu }), hAsync("div", { key: '3958153a358974fa0ba7260f985ca48bbe010a5d', class: "popout-menu", role: "dialog", "aria-modal": "true", "aria-label": `${this.hasNavigation ? "Navigation" : "App"} menu` }, hAsync("span", { key: 'ec3a59243f6fe8bc839f09cf6cb23013f1258cc0', "aria-hidden": "true", id: "navigation-landmark-text", class: "navigation-landmark-text" }, "Main navigation"), hAsync("nav", { key: 'f0fe76cf4eeec54e3382344abec7fe80b6ab5ba5', "aria-labelledby": "navigation-landmark-text", "aria-hidden": this.hasNavigation ? "false" : "true" }, hAsync("div", { key: '246f1b43500b11e0ec9b133030c79f140b5aacd3', class: {
|
11807
11751
|
["menu-close-button-container"]: true,
|
11808
11752
|
["nav-group-first"]: this.navGroupFirst,
|
11809
|
-
} }, hAsync("ic-button", { key: '
|
11753
|
+
} }, hAsync("ic-button", { key: 'c836f86ad0ca67841cca01b8a6717d78982163ed', ref: (el) => (this.closeButton = el), id: "menu-close-button", class: "menu-close-button", variant: "icon", size: "large", "aria-label": `Close ${this.hasNavigation ? "navigation" : "app"} menu`, onClick: this.closeMenu }, hAsync("svg", { key: 'd7524666b3f08ed7ab9ece6b33843fab72e521d7', width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: 'd659007ab35980d78395c7acbc2a34f333108d68', d: "M14 1.41L12.59 0L7 5.59L1.41 0L0 1.41L5.59 7L0 12.59L1.41 14L7 8.41L12.59 14L14 12.59L8.41 7L14 1.41Z" })))), this.hasNavigation && hAsync("slot", { key: '4067b296fb1eade8a35e62340be0b682faeebf0c', name: "navigation" })), this.hasButtons && (hAsync("div", { key: '6020b1dea12858619b1c4e42a9c28829ce9d926b', class: {
|
11810
11754
|
["menu-buttons-container"]: true,
|
11811
11755
|
["menu-buttons-container-nav-item-above"]: this.navItemAboveButtons,
|
11812
|
-
} }, hAsync("slot", { key: '
|
11756
|
+
} }, hAsync("slot", { key: '751e587cc503a8db8a668a8ca2335da12893e459', name: "buttons" }))), (this.status !== "" || this.version !== "") && (hAsync("div", { key: 'e368dacc5061176d89f726b891cc5cc2f3913b9d', class: {
|
11813
11757
|
["menu-status-version-container"]: true,
|
11814
11758
|
["status-version-no-buttons"]: !this.hasButtons,
|
11815
|
-
} }, this.status !== "" && (hAsync("div", { key: '
|
11759
|
+
} }, this.status !== "" && (hAsync("div", { key: '7745d4b718c9644598220a5625a260995d195ce1', class: "menu-status" }, hAsync("ic-typography", { key: '448b1a0d774fd9ffda795969c2184539e6d13ee3', variant: "label-uppercase", "aria-label": "app tag", class: "menu-status-text" }, this.status))), this.version !== "" && (hAsync("div", { key: '79a7a1467b334acf390661808a7c0eb9bbedcd6e', class: "menu-version" }, hAsync("ic-typography", { key: '87cc4741151c42401646094fb3ae20bc6efbc54d', variant: "label", class: "menu-version-text", "aria-label": "app version" }, this.version))))))));
|
11816
11760
|
}
|
11817
11761
|
get el() { return getElement(this); }
|
11818
11762
|
static get style() { return IcNavigationMenuStyle0; }
|
@@ -11945,19 +11889,19 @@ class PageHeader {
|
|
11945
11889
|
const navAriaLabel = `${isSlotUsed(this.el, "heading")
|
11946
11890
|
? (_b = (_a = this.el.querySelector('[slot="heading"]')) === null || _a === void 0 ? void 0 : _a.textContent) !== null && _b !== void 0 ? _b : ""
|
11947
11891
|
: heading !== null && heading !== void 0 ? heading : ""} page sections`;
|
11948
|
-
return (hAsync(Host, { key: '
|
11892
|
+
return (hAsync(Host, { key: 'd824bd22834b5c42ab5457e0ad6f09d2cc0d1f6f', class: {
|
11949
11893
|
["ic-page-header-sticky"]: !!sticky,
|
11950
11894
|
["ic-page-header-sticky-desktop"]: !sticky && !!stickyDesktopOnly,
|
11951
11895
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
11952
|
-
}, "aria-label": this.el.ariaLabel || "page header" }, hAsync("header", { key: '
|
11896
|
+
}, "aria-label": this.el.ariaLabel || "page header" }, hAsync("header", { key: '078f234437a6b6031215abdef6889f0f022445c9', class: {
|
11953
11897
|
["border-bottom"]: !!border,
|
11954
11898
|
["tabs"]: isSlotUsed(this.el, "tabs"),
|
11955
|
-
}, role: "presentation" }, hAsync("ic-section-container", { key: '
|
11899
|
+
}, role: "presentation" }, hAsync("ic-section-container", { key: '28365d7114d33baad19f681213e386b838f4daee', aligned: aligned, fullHeight: isSlotUsed(this.el, "tabs") }, isSlotUsed(this.el, "breadcrumbs") && (hAsync("div", { key: '5fd705035a0e0ad4959168808033106328da53cb', class: "breadcrumb-area" }, hAsync("slot", { key: '9b42e05e754c78870462b306b9874bc04533ff3a', name: "breadcrumbs" }))), hAsync("div", { key: 'e908d529ef2434efcc7fb3ad49443f308f019b15', class: "main-content" }, hAsync("div", { key: 'd6822ad86688e22f45d8a87eedf22a1b3c7e9218', class: "title-area" }, hAsync("div", { key: '4682ccbb1b9aa9b10bb884538f83d9f355bc6002', class: "header-content" }, hAsync("slot", { key: 'f578b80bf86ea81c26a44561fbd62501045b5de2', name: "heading" }, hAsync("ic-typography", { key: 'c2149b8207c2d873e93002835bfb4ee099e6cd8d', variant: size === "small" ? "h4" : "h2", class: "heading" }, hAsync("h2", { key: '24d19a7676e5c4cf93628d16384a6bbb30ee8ad5' }, heading))), hAsync("slot", { key: 'cd1c120dbd2c417273122ad8336a3d08c381e802', name: "heading-adornment" })), hAsync("div", { key: '23ba15f70724b5d33a10973a95371c71f07dcbaf', class: {
|
11956
11900
|
["subheading-content"]: !!subheading || isSlotUsed(this.el, "subheading"),
|
11957
11901
|
["small"]: size === "small",
|
11958
|
-
} }, hAsync("slot", { key: '
|
11959
|
-
isSlotUsed(this.el, "tabs")) && (hAsync("div", { key: '
|
11960
|
-
!isSlotUsed(this.el, "tabs") && hAsync("slot", { key: '
|
11902
|
+
} }, hAsync("slot", { key: 'f7d11c2051d787989caf27a43a216b106102be03', name: "subheading" }, hAsync("ic-typography", { key: 'fe349a99d560b3a4cea6b055bb7bda1e0224aeac', variant: "body" }, subheading)))), isSlotUsed(this.el, "actions") && (hAsync("div", { key: '943b5348b38bd35faae3d9fad3b0127972d585bc', class: "action-area" }, hAsync("slot", { key: '474d1aed9a1c6df3ceb7e6422ff0b58b1faeddda', name: "actions" }))), isSlotUsed(this.el, "input") && (hAsync("div", { key: 'd8b844fd28539346ab546a74b83e84b4a8837f47', class: "input-area" }, hAsync("slot", { key: '74a70bf47c9d6e9f2973ac7cd57b5171f1cdb859', name: "input" })))), (isSlotUsed(this.el, "stepper") ||
|
11903
|
+
isSlotUsed(this.el, "tabs")) && (hAsync("div", { key: 'a514e3cca152162977d3dccdd0037f57ac073507', class: "navigation-area" }, isSlotUsed(this.el, "stepper") &&
|
11904
|
+
!isSlotUsed(this.el, "tabs") && hAsync("slot", { key: '545c22316ae4bd5069fa1922c56dfad651af74ef', name: "stepper" }), isSlotUsed(this.el, "tabs") && (hAsync("nav", { key: '4a50c3f0ef99b0ca3839262d2be1d77cbe0b1c3a', "aria-label": navAriaLabel }, hAsync("ic-horizontal-scroll", { key: 'ff72b71abd6491ac2fe79aa05a4629aa4cd20ada' }, hAsync("ul", { key: '6c1b9eadc2d11a1c7073309987d52b376c149d08', class: "tabs-slot" }, hAsync("slot", { key: '86082f4787bab5cc0eb4fb69eb6db4a46e29a454', name: "tabs" })))))))))));
|
11961
11905
|
}
|
11962
11906
|
get el() { return getElement(this); }
|
11963
11907
|
static get style() { return IcPageHeaderStyle0; }
|
@@ -12235,14 +12179,14 @@ class Pagination {
|
|
12235
12179
|
}
|
12236
12180
|
render() {
|
12237
12181
|
const { type, currentPage, hideCurrentPage, disabled, hideFirstAndLastPageButton, label, theme, monochrome, } = this;
|
12238
|
-
return (hAsync(Host, { key: '
|
12182
|
+
return (hAsync(Host, { key: 'def082d6417770159241eaf69660011a9fa56978', class: {
|
12239
12183
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
12240
12184
|
["ic-pagination-monochrome"]: !!monochrome,
|
12241
|
-
} }, type === "simple" && (hAsync("nav", { key: '
|
12185
|
+
} }, type === "simple" && (hAsync("nav", { key: '7d2a663d826de4c5916d6ece70222bf28157b57b', class: {
|
12242
12186
|
["disabled"]: !!disabled,
|
12243
|
-
}, role: "navigation", "aria-label": "Pagination Navigation" }, hideFirstAndLastPageButton ? null : this.firstButton(), this.previousButton(), hAsync("ic-pagination-item", { key: '
|
12187
|
+
}, role: "navigation", "aria-label": "Pagination Navigation" }, hideFirstAndLastPageButton ? null : this.firstButton(), this.previousButton(), hAsync("ic-pagination-item", { key: '010243beef572daba8a9c1f58978213f02446b2e', theme: this.theme, monochrome: this.monochrome, type: "simple-current", page: currentPage, label: label, class: { ["hide-current-page"]: !!hideCurrentPage }, disabled: disabled }), this.nextButton(), hideFirstAndLastPageButton ? null : this.lastButton())), type === "complex" && (hAsync("nav", { key: '7ab291c9e698dfb1ead08c7a59858a4f3f715488', class: {
|
12244
12188
|
["disabled"]: !!disabled,
|
12245
|
-
}, role: "navigation", "aria-label": "Pagination Navigation" }, hideFirstAndLastPageButton ? null : this.firstButton(), this.previousButton(), this.renderStartItems(), this.startEllipsis && this.renderStartEllipsis(), this.renderMiddleItems(), this.endEllipsis && this.renderEndEllipsis(), this.renderEndItems(), this.nextButton(), hideFirstAndLastPageButton ? null : this.lastButton())), type === "complex" && (hAsync("span", { key: '
|
12189
|
+
}, role: "navigation", "aria-label": "Pagination Navigation" }, hideFirstAndLastPageButton ? null : this.firstButton(), this.previousButton(), this.renderStartItems(), this.startEllipsis && this.renderStartEllipsis(), this.renderMiddleItems(), this.endEllipsis && this.renderEndEllipsis(), this.renderEndItems(), this.nextButton(), hideFirstAndLastPageButton ? null : this.lastButton())), type === "complex" && (hAsync("span", { key: '2b7be6cd03fb72ccaf3a2bd08fbf5ef5f52e5050', class: "sr-only", "aria-live": "polite" }, "Page ", this.currentPage))));
|
12246
12190
|
}
|
12247
12191
|
get el() { return getElement(this); }
|
12248
12192
|
static get watchers() { return {
|
@@ -12326,7 +12270,7 @@ class PaginationItem {
|
|
12326
12270
|
}
|
12327
12271
|
render() {
|
12328
12272
|
const { page, selected, type, disabled, label, capitalizedLabel, monochrome, } = this;
|
12329
|
-
return (hAsync("a", { key: '
|
12273
|
+
return (hAsync("a", { key: '775649dcb0b2df73e18ddbb563cb088f5e4bf394', class: { ["monochrome"]: !!monochrome } }, type === "ellipsis" ? (hAsync("div", { class: {
|
12330
12274
|
["item-container"]: true,
|
12331
12275
|
["ellipsis"]: true,
|
12332
12276
|
["disabled"]: !!disabled,
|
@@ -12368,7 +12312,7 @@ class PaginationItem {
|
|
12368
12312
|
}; }
|
12369
12313
|
}
|
12370
12314
|
|
12371
|
-
const icPopoverMenuCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){:host .opening-from-parent{animation:slide-in var(--ic-transition-duration-slow) ease-in-out}:host .opening-from-child{animation:slide-out var(--ic-transition-duration-slow) ease-in-out}}:host{border-radius:var(--ic-border-radius);color:var(--ic-popover-nav-text);--ic-typography-color:var(--ic-popover-nav-text);position:relative;z-index:var(--ic-z-index-popover);box-sizing:border-box;box-shadow:var(--ic-elevation-overlay);display:none}:host(.on-dialog){inset:auto !important}:host(.on-dialog-fix-translate){transform:translate(0, var(--ic-space-xs)) !important}:host(.on-dialog-translate-y){transform:translate(0, calc(-1 * var(--translate-y))) !important}.menu{border:var(--ic-border-default);border-color:var(--ic-popover-border);border-radius:var(--ic-border-radius);background-color:var(--ic-popover-background);visibility:hidden;height:0}:host(:focus-within){box-shadow:var(--ic-border-focus)}.menu:focus-visible{outline:none}:host(.ic-popover-menu-open){display:block;min-width:calc(20rem - var(--ic-space-xl));width:var(--popover-width, 20rem);max-width:calc(100vw - var(--ic-space-xl))}:host(.ic-popover-menu-open) .menu{visibility:visible;height:-moz-fit-content;height:fit-content;max-height:var(--max-height, -moz-fit-content);max-height:var(--max-height, fit-content);overflow-y:auto;overflow-x:hidden}.parent-label{--ic-typography-color:var(--ic-popover-parent-label);margin:var(--ic-space-xs) var(--ic-space-xs) 0}@keyframes slide-in{from{opacity:0;transform:translateX(10rem)}to{opacity:1;transform:translateX(0)}}@keyframes slide-out{from{opacity:0;transform:translateX(-10rem)}to{opacity:1;transform:translateX(0)}}";
|
12315
|
+
const icPopoverMenuCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){:host .opening-from-parent{animation:slide-in var(--ic-transition-duration-slow) ease-in-out}:host .opening-from-child{animation:slide-out var(--ic-transition-duration-slow) ease-in-out}}:host{border-radius:var(--ic-border-radius);color:var(--ic-popover-nav-text);--ic-typography-color:var(--ic-popover-nav-text);position:relative;z-index:var(--ic-z-index-popover);box-sizing:border-box;box-shadow:var(--ic-elevation-overlay);display:none;overflow-x:clip}:host(.on-dialog){inset:auto !important}:host(.on-dialog-fix-translate){transform:translate(0, var(--ic-space-xs)) !important}:host(.on-dialog-translate-y){transform:translate(0, calc(-1 * var(--translate-y))) !important}.menu{border:var(--ic-border-default);border-color:var(--ic-popover-border);border-radius:var(--ic-border-radius);background-color:var(--ic-popover-background);visibility:hidden;height:0;display:flex;flex-direction:column}:host(:focus-within){box-shadow:var(--ic-border-focus)}.menu:focus-visible{outline:none}:host(.ic-popover-menu-open){display:block;min-width:calc(20rem - var(--ic-space-xl));width:var(--popover-width, 20rem);max-width:calc(100vw - var(--ic-space-xl))}:host(.ic-popover-menu-open) .menu{visibility:visible;height:-moz-fit-content;height:fit-content;max-height:var(--max-height, -moz-fit-content);max-height:var(--max-height, fit-content);overflow-y:auto;overflow-x:hidden}.parent-label{--ic-typography-color:var(--ic-popover-parent-label);margin:var(--ic-space-xs) var(--ic-space-xs) 0}@keyframes slide-in{from{opacity:0;transform:translateX(10rem)}to{opacity:1;transform:translateX(0)}}@keyframes slide-out{from{opacity:0;transform:translateX(-10rem)}to{opacity:1;transform:translateX(0)}}";
|
12372
12316
|
var IcPopoverMenuStyle0 = icPopoverMenuCss;
|
12373
12317
|
|
12374
12318
|
const MENU_SELECTOR = "div.menu-body";
|
@@ -12636,17 +12580,17 @@ class PopoverMenu {
|
|
12636
12580
|
}
|
12637
12581
|
}
|
12638
12582
|
render() {
|
12639
|
-
return (hAsync(Host, { key: '
|
12583
|
+
return (hAsync(Host, { key: '25b16bfd5f6ad9dd7ed1fcfedc773cb3bc1c76d2', class: {
|
12640
12584
|
["ic-popover-menu-open"]: !!this.open,
|
12641
12585
|
[`ic-theme-${this.theme}`]: this.theme !== "inherit",
|
12642
|
-
} }, hAsync("div", { key: '
|
12586
|
+
} }, hAsync("div", { key: '73acc30bb2ef5c83924e47508ad093dcbbc5adbe', id: this.parentPopover === undefined
|
12643
12587
|
? `ic-popover-submenu-${this.submenuId}`
|
12644
12588
|
: "", class: {
|
12645
12589
|
menu: true,
|
12646
|
-
} }, hAsync("span", { key: '
|
12590
|
+
} }, hAsync("span", { key: 'd0392b2ce914c01539f7a66c5aee443de194d434', class: {
|
12647
12591
|
"opening-from-parent": this.openingFromParent,
|
12648
12592
|
"opening-from-child": this.openingFromChild,
|
12649
|
-
} }, isPropDefined(this.submenuId) && (hAsync("span", { key: '
|
12593
|
+
} }, isPropDefined(this.submenuId) && (hAsync("span", { key: 'eb92f3ac08c7cb711d31ed8a12fd210aa44f7cc2' }, hAsync("span", { key: 'b0a051fe820b3a933dc09fdd370227a8cb19c2b2', role: "menu" }, hAsync("ic-menu-item", { key: '9f18829d0c1245e3539e4a74d62c37f5a8857203', class: "ic-popover-submenu-back-button", ref: (el) => (this.backButton = el), label: "Back", onClick: this.handleBackButtonClick, id: `ic-popover-submenu-back-button-${this.submenuLevel}` }, hAsync("svg", { key: '5f6918d86d7b179cef7f90c94e72a4055aaffd24', slot: "icon", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: "submenu-back-icon" }, hAsync("path", { key: 'e8dc4472dff2b10e5f127608a437efd19522ccd3', d: "M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z", fill: "currentColor" })))), hAsync("ic-typography", { key: '3c3b99b9548a300b37b1ae99a0d40de0eb748086', variant: "subtitle-small", class: "parent-label" }, this.parentLabel))), hAsync("div", { key: 'dc87929934a320edf8bb2ae3a6936c26500f4f11', class: "menu-body", "aria-label": this.getMenuAriaLabel(), role: "menu" }, hAsync("slot", { key: '6df2182e3b8832790238aded793393ec1f2f34ff' }))))));
|
12650
12594
|
}
|
12651
12595
|
static get delegatesFocus() { return true; }
|
12652
12596
|
get el() { return getElement(this); }
|
@@ -12904,16 +12848,16 @@ class RadioGroup {
|
|
12904
12848
|
}
|
12905
12849
|
render() {
|
12906
12850
|
const { currentOrientation, disabled, handleKeyDown, helperText, hideLabel, label, required, size, validationStatus, validationText, theme, } = this;
|
12907
|
-
return (hAsync(Host, { key: '
|
12851
|
+
return (hAsync(Host, { key: '820e82c681a22e98737769e9571cbe75d2223956', onKeyDown: handleKeyDown, class: {
|
12908
12852
|
"ic-radio-group-small": size === "small",
|
12909
12853
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
12910
|
-
} }, hAsync("div", { key: '
|
12854
|
+
} }, hAsync("div", { key: 'a95fd7bd0138f04cd3cf0b1e75df29183792d8cc', role: "radiogroup", "aria-label": `${label}${required ? ", required" : ""}` }, !hideLabel && (hAsync("ic-input-label", { key: '484c655cfd75c5994c3c5ee1b1e70aed491ad361', class: {
|
12911
12855
|
[`${validationStatus}`]: true,
|
12912
12856
|
["disabled"]: !!disabled,
|
12913
|
-
}, label: label, helperText: helperText, required: required, disabled: disabled })), hAsync("div", { key: '
|
12857
|
+
}, label: label, helperText: helperText, required: required, disabled: disabled })), hAsync("div", { key: 'eed17f3169436eb1f8b672ecfdd51759443d5f1c', class: {
|
12914
12858
|
"radio-buttons-container": true,
|
12915
12859
|
horizontal: currentOrientation === this.RADIO_HORIZONTAL,
|
12916
|
-
}, ref: (el) => (this.radioContainer = el) }, hAsync("slot", { key: '
|
12860
|
+
}, ref: (el) => (this.radioContainer = el) }, hAsync("slot", { key: '878666c0c36d6456ed072ee0eddc6683b98ef4a5' }))), hasValidationStatus(validationStatus, disabled) && (hAsync("ic-input-validation", { key: '79458eb93662029a89c31bb26b5174c2fd70c3af', ariaLiveMode: "polite", status: validationStatus, message: validationText }))));
|
12917
12861
|
}
|
12918
12862
|
get el() { return getElement(this); }
|
12919
12863
|
static get watchers() { return {
|
@@ -13093,15 +13037,15 @@ class RadioOption {
|
|
13093
13037
|
render() {
|
13094
13038
|
const { additionalFieldDisplay, disabled, dynamicText, form, groupLabel, handleClick, handleKeyDown, hasAdditionalField, label, name, selected, value, theme, } = this;
|
13095
13039
|
const id = `ic-radio-option-${isPropDefined(label) || value}-${groupLabel}`;
|
13096
|
-
return (hAsync(Host, { key: '
|
13040
|
+
return (hAsync(Host, { key: 'e775db934af98431874bc7b25a931de822c1a987', onClick: handleClick, onKeyDown: handleKeyDown, class: {
|
13097
13041
|
["ic-radio-option-disabled"]: !!disabled,
|
13098
13042
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
13099
|
-
} }, hAsync("div", { key: '
|
13043
|
+
} }, hAsync("div", { key: 'e80a4acc065eb631c897d3c35b03f1747f272acb', class: { container: true, disabled: !!disabled } }, hAsync("div", { key: 'b5d2a7fb6447ce7e365f8661e002767a8f909280' }, hAsync("input", { key: 'd352f22e5f86533b4bdfe6e23be01993ef5dc2a9', tabindex: selected ? "0" : "-1", type: "radio", name: name, id: id, value: value, disabled: disabled, checked: selected, ref: (el) => (this.radioElement = el), form: form }), hAsync("span", { key: '1718b2c24e76c82f98093b78bac5917da201af4d', class: "checkmark" })), hAsync("ic-typography", { key: '3938c3a33f1534fa8778abed7e09cbc496af0612', class: "radio-label", variant: "body" }, hAsync("label", { key: '586877cf41eafe536366cdd949d2330aa82aaaed', htmlFor: id }, label))), hasAdditionalField && (hAsync("div", { key: '3f7d2a81b51a533843b74b59a730ad3231752638', class: {
|
13100
13044
|
"dynamic-container": true,
|
13101
13045
|
hidden: additionalFieldDisplay === "dynamic" && !selected,
|
13102
|
-
} }, additionalFieldDisplay === "dynamic" && (hAsync("div", { key: '
|
13046
|
+
} }, additionalFieldDisplay === "dynamic" && (hAsync("div", { key: '430d6b7ec062db38e94360206b1b81ec645d9142', class: "branch-corner" })), hAsync("div", { key: 'd657669620a1a1047f7ce7c524ad74863cdfedb3' }, additionalFieldDisplay === "dynamic" && (hAsync("ic-typography", { key: '89583fec44af079b14161ab9f11eb06337890b0a', variant: "caption" }, hAsync("p", { key: 'b1e27f252e6f43faf95b9f5cd8da1bf792310331', class: "dynamic-text" }, dynamicText))), hAsync("div", { key: 'c5bdfc982b7dbbc1da3dfff5e8d8428df433af50', class: {
|
13103
13047
|
"additional-field-wrapper": additionalFieldDisplay === "static",
|
13104
|
-
} }, hAsync("slot", { key: '
|
13048
|
+
} }, hAsync("slot", { key: 'a1ae20ee1eaf80bd159215a46ddc8b6d4fec7653', name: ADDITIONAL_FIELD })))))));
|
13105
13049
|
}
|
13106
13050
|
get el() { return getElement(this); }
|
13107
13051
|
static get watchers() { return {
|
@@ -13308,6 +13252,7 @@ class SearchBar {
|
|
13308
13252
|
this.loading = false;
|
13309
13253
|
clearTimeout(this.timeoutTimer);
|
13310
13254
|
this.filteredOptions = this.options;
|
13255
|
+
this.showMenuWithNoInput() && this.setMenuChange(true);
|
13311
13256
|
this.el.setFocus();
|
13312
13257
|
this.icClear.emit();
|
13313
13258
|
ev.preventDefault();
|
@@ -13442,10 +13387,13 @@ class SearchBar {
|
|
13442
13387
|
}
|
13443
13388
|
};
|
13444
13389
|
this.handleHostFocus = () => {
|
13445
|
-
if (this.options &&
|
13390
|
+
if (this.options &&
|
13391
|
+
(this.value || this.showMenuWithNoInput()) &&
|
13392
|
+
!this.menuCloseFromMenuChangeEvent) {
|
13446
13393
|
this.setMenuChange(true);
|
13447
13394
|
}
|
13448
13395
|
this.truncateValue = false;
|
13396
|
+
this.showMenuWithNoInput() && this.debounceAriaLiveUpdate();
|
13449
13397
|
this.icSearchBarFocus.emit();
|
13450
13398
|
};
|
13451
13399
|
this.handleHostBlur = ({ relatedTarget }) => {
|
@@ -13469,6 +13417,7 @@ class SearchBar {
|
|
13469
13417
|
});
|
13470
13418
|
this.retryViaKeyPress = false;
|
13471
13419
|
this.retryButtonClick = false;
|
13420
|
+
this.showMenuWithNoInput() && this.updateSearchResultAriaLive();
|
13472
13421
|
};
|
13473
13422
|
this.handleFocusClearButton = () => {
|
13474
13423
|
this.clearButtonFocused = true;
|
@@ -13491,7 +13440,7 @@ class SearchBar {
|
|
13491
13440
|
const searchResultsStatusEl = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".search-results-status");
|
13492
13441
|
if (searchResultsStatusEl) {
|
13493
13442
|
if (!this.open ||
|
13494
|
-
this.value === "" ||
|
13443
|
+
(this.value === "" && !this.showMenuWithNoInput()) ||
|
13495
13444
|
this.value.length < this.charactersUntilSuggestion) {
|
13496
13445
|
searchResultsStatusEl.innerText = "";
|
13497
13446
|
}
|
@@ -13515,6 +13464,12 @@ class SearchBar {
|
|
13515
13464
|
this.hadNoOptions() ||
|
13516
13465
|
this.hasTimedOut ||
|
13517
13466
|
this.loading;
|
13467
|
+
this.showMenuWithNoInput = () => this.charactersUntilSuggestion === 0;
|
13468
|
+
}
|
13469
|
+
watchCharactersUntilSuggestionHandler() {
|
13470
|
+
if (this.showMenuWithNoInput()) {
|
13471
|
+
this.filteredOptions = this.options;
|
13472
|
+
}
|
13518
13473
|
}
|
13519
13474
|
watchDisabledHandler() {
|
13520
13475
|
removeDisabledFalse(this.disabled, this.el);
|
@@ -13532,28 +13487,33 @@ class SearchBar {
|
|
13532
13487
|
this.hasTimedOut = newOptions.some((opt) => opt.timedOut);
|
13533
13488
|
}
|
13534
13489
|
watchOptionsHandler(newOptions) {
|
13535
|
-
if (this.disableAutoFiltering
|
13536
|
-
this.
|
13537
|
-
|
13538
|
-
|
13539
|
-
|
13540
|
-
|
13541
|
-
else {
|
13542
|
-
if (this.hadNoOptions()) {
|
13543
|
-
return;
|
13490
|
+
if (this.disableAutoFiltering) {
|
13491
|
+
if (!this.hasTimedOut) {
|
13492
|
+
this.loading = false;
|
13493
|
+
clearTimeout(this.timeoutTimer);
|
13494
|
+
if (newOptions.length > 0) {
|
13495
|
+
this.filteredOptions = newOptions;
|
13544
13496
|
}
|
13545
|
-
|
13546
|
-
|
13547
|
-
|
13548
|
-
|
13549
|
-
|
13550
|
-
|
13551
|
-
|
13552
|
-
|
13497
|
+
else {
|
13498
|
+
if (this.hadNoOptions()) {
|
13499
|
+
return;
|
13500
|
+
}
|
13501
|
+
this.setMenuChange(true);
|
13502
|
+
if (!this.preLoad) {
|
13503
|
+
this.filteredOptions = [
|
13504
|
+
{
|
13505
|
+
[this.labelField]: this.emptyOptionListText,
|
13506
|
+
[this.valueField]: "",
|
13507
|
+
},
|
13508
|
+
];
|
13509
|
+
}
|
13510
|
+
this.preLoad = true;
|
13553
13511
|
}
|
13554
|
-
this.preLoad = true;
|
13555
13512
|
}
|
13556
13513
|
}
|
13514
|
+
else if (this.showMenuWithNoInput()) {
|
13515
|
+
this.filteredOptions = newOptions;
|
13516
|
+
}
|
13557
13517
|
this.debounceAriaLiveUpdate();
|
13558
13518
|
}
|
13559
13519
|
watchValueHandler(newValue) {
|
@@ -13577,7 +13537,7 @@ class SearchBar {
|
|
13577
13537
|
}
|
13578
13538
|
if (this.hasOptionsOrFilterDisabled()) {
|
13579
13539
|
this.renderAssistiveHintEl();
|
13580
|
-
if (this.disableAutoFiltering) {
|
13540
|
+
if (this.disableAutoFiltering || this.showMenuWithNoInput()) {
|
13581
13541
|
this.filteredOptions = this.options;
|
13582
13542
|
}
|
13583
13543
|
}
|
@@ -13644,48 +13604,50 @@ class SearchBar {
|
|
13644
13604
|
else if (describedBy !== "") {
|
13645
13605
|
describedById = describedBy;
|
13646
13606
|
}
|
13647
|
-
const hasSuggestedSearch = !!value
|
13607
|
+
const hasSuggestedSearch = (!!value || this.showMenuWithNoInput()) &&
|
13608
|
+
this.hasOptionsOrFilterDisabled();
|
13648
13609
|
const menuOpen = hasSuggestedSearch && open && filteredOptions.length > 0;
|
13649
13610
|
const menuRendered = menuOpen && value.length >= charactersUntilSuggestion;
|
13650
13611
|
const labelValue = getLabelFromValue(value, options, valueField, labelField);
|
13651
13612
|
renderHiddenInput(this.el, value, name, disabledMode);
|
13652
|
-
return (hAsync(Host, { key: '
|
13613
|
+
return (hAsync(Host, { key: 'bfb362b72aa0441cf00cb042f0dd623b6f41d5d7', class: {
|
13653
13614
|
"ic-search-bar-search": true,
|
13654
13615
|
"ic-search-bar-full-width": fullWidth,
|
13655
13616
|
"ic-search-bar-disabled": disabled,
|
13656
13617
|
"ic-search-bar-small": size === "small",
|
13657
13618
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
13658
|
-
}, onFocus: this.handleHostFocus, onBlur: this.handleHostBlur }, hAsync("ic-input-container", { key: '
|
13619
|
+
}, onFocus: this.handleHostFocus, onBlur: this.handleHostBlur }, hAsync("ic-input-container", { key: '4abc6ab7691d77e1659016957de4a7573c7b0ba8', readonly: readonly, disabled: disabledMode }, !hideLabel && (hAsync("ic-input-label", { key: '7dfd27f5e3837063f115bac7ea1af05783ad52c2', for: inputId, label: label, helperText: helperText, required: required, disabled: disabledMode && !readonly, readonly: readonly })), hAsync("ic-input-component-container", { key: 'bb9bd8d704ab9e9924d10b025bbd8b74310762e2', ref: (el) => (this.anchorEl = el), size: size, disabled: disabledMode, readonly: readonly, fullWidth: fullWidth }, hAsync("input", { key: '29c57007bfc75825bd91cdd4e24f9d9fd44e83d8', id: inputId, name: name, ref: (el) => (this.inputEl = el), value: options && !!labelValue ? labelValue : value, class: {
|
13659
13620
|
"no-left-pad": readonly,
|
13660
13621
|
readonly,
|
13661
13622
|
"truncate-value": truncateValue,
|
13662
|
-
}, placeholder: placeholder, required: required, disabled: disabledMode, readonly: readonly, onInput: this.onInput, onBlur: this.onInputBlur, onFocus: this.onInputFocus, "aria-label": label, "aria-activedescendant": ariaActiveDescendant, "aria-expanded": options.length > 0 && menuRendered ? `${menuOpen}` : undefined, "aria-owns": menuRendered ? menuId : undefined, "aria-describedby": describedById, "aria-controls": menuRendered ? menuId : undefined, "aria-haspopup": options.length > 0 ? "listbox" : undefined, "aria-autocomplete": hasSuggestedSearch ? "list" : undefined, role: options.length > 0 && menuRendered ? "combobox" : undefined, autocomplete: autocomplete, autocapitalize: autocapitalize, autoFocus: autofocus, spellcheck: spellcheck, inputmode: "search" }), hAsync("div", { key: '
|
13623
|
+
}, placeholder: placeholder, required: required, disabled: disabledMode, readonly: readonly, onInput: this.onInput, onBlur: this.onInputBlur, onFocus: this.onInputFocus, "aria-label": label, "aria-activedescendant": ariaActiveDescendant, "aria-expanded": options.length > 0 && menuRendered ? `${menuOpen}` : undefined, "aria-owns": menuRendered ? menuId : undefined, "aria-describedby": describedById, "aria-controls": menuRendered ? menuId : undefined, "aria-haspopup": options.length > 0 ? "listbox" : undefined, "aria-autocomplete": hasSuggestedSearch ? "list" : undefined, role: options.length > 0 && menuRendered ? "combobox" : undefined, autocomplete: autocomplete, autocapitalize: autocapitalize, autoFocus: autofocus, spellcheck: spellcheck, inputmode: "search" }), hAsync("div", { key: '2d5c5e1bc89f7dba8ef771e018534f7613c19295', class: {
|
13663
13624
|
"clear-button-container": true,
|
13664
13625
|
"clear-button-visible": !!value && !disabledMode && showClearButton,
|
13665
|
-
} }, hAsync("ic-button", { key: '
|
13626
|
+
} }, hAsync("ic-button", { key: '873de229be0ef641b2c94ccd283f5c17965fb5b9', id: "clear-button", class: {
|
13666
13627
|
"clear-button": true,
|
13667
13628
|
"clear-button-unfocused": !clearButtonFocused,
|
13668
|
-
}, "aria-label": "Clear", innerHTML: clearIcon, onClick: this.handleClear, onMouseDown: this.handleMouseDown, size: size, onFocus: this.handleFocusClearButton, onBlur: this.handleClearBlur, onKeyDown: this.handleClear, type: "submit", variant: "icon", theme: clearButtonFocused ? "light" : "dark" }), hAsync("div", { key: '
|
13629
|
+
}, "aria-label": "Clear", innerHTML: clearIcon, onClick: this.handleClear, onMouseDown: this.handleMouseDown, size: size, onFocus: this.handleFocusClearButton, onBlur: this.handleClearBlur, onKeyDown: this.handleClear, type: "submit", variant: "icon", theme: clearButtonFocused ? "light" : "dark" }), hAsync("div", { key: '5f459ff9941a45c937632a1aad6f4e51de1bf56a', class: "divider" })), hAsync("div", { key: '00bca9379e35fc62d6148258fb0d46a1a4f6a5bd', class: {
|
13669
13630
|
"search-submit-button-container": true,
|
13670
13631
|
"search-submit-button-disabled": this.isSubmitDisabled(),
|
13671
|
-
} }, hAsync("ic-button", { key: '
|
13632
|
+
} }, hAsync("ic-button", { key: '0733206601764cf6563aebfe739cd8ff10d0e779', id: "search-submit-button", "aria-label": "Search", ref: (el) => (this.searchSubmitButton = el), class: {
|
13672
13633
|
"search-submit-button": true,
|
13673
13634
|
"search-submit-button-small": size === "small",
|
13674
13635
|
"search-submit-button-unfocused": !searchSubmitFocused,
|
13675
13636
|
"search-submit-button-disabled": this.isSubmitDisabled(),
|
13676
|
-
}, disabled: this.isSubmitDisabled(), innerHTML: searchIcon, size: size, onClick: this.handleSubmitSearch, onMouseDown: this.handleMouseDown, onBlur: this.handleSubmitSearchBlur, onFocus: this.handleSubmitSearchFocus, onKeyDown: this.handleSubmitSearchKeyDown, type: "submit", variant: "icon", theme: searchSubmitFocused ? "light" : "dark" }))), hAsync("div", { key: '
|
13637
|
+
}, disabled: this.isSubmitDisabled(), innerHTML: searchIcon, size: size, onClick: this.handleSubmitSearch, onMouseDown: this.handleMouseDown, onBlur: this.handleSubmitSearchBlur, onFocus: this.handleSubmitSearchFocus, onKeyDown: this.handleSubmitSearchKeyDown, type: "submit", variant: "icon", theme: searchSubmitFocused ? "light" : "dark" }))), hAsync("div", { key: '30177d3af3b241db3e843cb83b5fbf3aab4bc003', class: {
|
13677
13638
|
"menu-container": true,
|
13678
13639
|
fullwidth: fullWidth,
|
13679
|
-
} }, menuRendered && this.anchorEl && this.inputEl && (hAsync("ic-menu", { key: '
|
13640
|
+
} }, menuRendered && this.anchorEl && this.inputEl && (hAsync("ic-menu", { key: '98b2ada7a19760d30ba958c31926ae93cce74988', class: {
|
13680
13641
|
"no-results": this.hadNoOptions() ||
|
13681
13642
|
(filteredOptions.length === 1 &&
|
13682
13643
|
(filteredOptions[0][labelField] === loadingLabel ||
|
13683
13644
|
filteredOptions[0][labelField] === loadingErrorLabel)),
|
13684
|
-
}, activationType: "manual", anchorEl: this.anchorEl, autofocusOnSelected: false, searchMode: searchMode, inputEl: this.inputEl, inputLabel: label, ref: (el) => (this.menu = el), fullWidth: fullWidth, menuId: menuId, open: true, options: filteredOptions, onMenuOptionSelect: this.handleOptionSelect, onMenuStateChange: this.handleMenuChange, onMenuOptionId: this.handleMenuOptionHighlight, onRetryButtonClicked: this.handleRetry, parentEl: this.el, value: value, labelField: labelField, valueField: valueField })))), hAsync("div", { key: '
|
13645
|
+
}, activationType: "manual", anchorEl: this.anchorEl, autofocusOnSelected: false, searchMode: searchMode, inputEl: this.inputEl, inputLabel: label, ref: (el) => (this.menu = el), fullWidth: fullWidth, menuId: menuId, open: true, options: filteredOptions, onMenuOptionSelect: this.handleOptionSelect, onMenuStateChange: this.handleMenuChange, onMenuOptionId: this.handleMenuOptionHighlight, onRetryButtonClicked: this.handleRetry, parentEl: this.el, value: value, labelField: labelField, valueField: valueField })))), hAsync("div", { key: '68d0f5afc16ce02c5b621b74754be51ffc55f2a6', "aria-live": "polite", role: "status", class: "search-results-status" })));
|
13685
13646
|
}
|
13686
13647
|
static get delegatesFocus() { return true; }
|
13687
13648
|
get el() { return getElement(this); }
|
13688
13649
|
static get watchers() { return {
|
13650
|
+
"charactersUntilSuggestion": ["watchCharactersUntilSuggestionHandler"],
|
13689
13651
|
"disabled": ["watchDisabledHandler"],
|
13690
13652
|
"debounce": ["debounceChanged"],
|
13691
13653
|
"loading": ["loadingHandler"],
|
@@ -13761,12 +13723,12 @@ class SectionContainer {
|
|
13761
13723
|
}
|
13762
13724
|
render() {
|
13763
13725
|
const { aligned, fullHeight } = this;
|
13764
|
-
return (hAsync(Host, { key: '
|
13726
|
+
return (hAsync(Host, { key: '828f3234c880ff0d46adef9554ceb358c472a25c', class: {
|
13765
13727
|
["aligned-left"]: aligned === "left" || aligned === null,
|
13766
13728
|
["aligned-center"]: aligned === "center",
|
13767
13729
|
["aligned-full-width"]: aligned === "full-width",
|
13768
13730
|
["no-vertical-padding"]: !!fullHeight,
|
13769
|
-
} }, hAsync("slot", { key: '
|
13731
|
+
} }, hAsync("slot", { key: 'aae75bbdd8d6ae40c36621ad1398ab0185a4325c' })));
|
13770
13732
|
}
|
13771
13733
|
static get style() { return IcSectionContainerStyle0; }
|
13772
13734
|
static get cmpMeta() { return {
|
@@ -13813,11 +13775,14 @@ class Select {
|
|
13813
13775
|
this.icOptionSelect = createEvent(this, "icOptionSelect", 7);
|
13814
13776
|
this.icOptionDeselect = createEvent(this, "icOptionDeselect", 7);
|
13815
13777
|
this.icRetryLoad = createEvent(this, "icRetryLoad", 7);
|
13778
|
+
this.blurredBecauseButtonPressed = false;
|
13816
13779
|
this.hasSetDefaultValue = false;
|
13780
|
+
this.hasTimedOut = false;
|
13817
13781
|
this.inheritedAttributes = {};
|
13818
13782
|
this.initialOptionsEmpty = false;
|
13819
13783
|
this.inputId = `ic-select-input-${inputIds$2++}`;
|
13820
13784
|
this.menuId = `${this.inputId}-menu`;
|
13785
|
+
this.retryButtonClick = false;
|
13821
13786
|
this.searchableMenuItemSelected = false;
|
13822
13787
|
this.ungroupedOptions = [];
|
13823
13788
|
this.hostMutationObserver = null;
|
@@ -13933,6 +13898,12 @@ class Select {
|
|
13933
13898
|
*/
|
13934
13899
|
this.debounce = 0;
|
13935
13900
|
this.currDebounce = this.debounce;
|
13901
|
+
/**
|
13902
|
+
* The value of the select, reflected by the value of the currently selected option.
|
13903
|
+
* For the searchable variant, the value is also reflected by the user input.
|
13904
|
+
* For the multi-select variant, the value must be an array of option values.
|
13905
|
+
*/
|
13906
|
+
this.value = null;
|
13936
13907
|
this.initialValue = this.value;
|
13937
13908
|
this.inputValueToFilter = this.value;
|
13938
13909
|
// triggered when attributes of host element change
|
@@ -13965,13 +13936,27 @@ class Select {
|
|
13965
13936
|
this.emitIcChange = (value) => {
|
13966
13937
|
// If "Select all" button clicked, replace value with new value (array of all option values)
|
13967
13938
|
if (this.multiple && !Array.isArray(value) && value !== null) {
|
13968
|
-
|
13939
|
+
// Update selected options - adds / removes them, in order of option list
|
13940
|
+
// Create new array if value prop is undefined
|
13941
|
+
if (this.value) {
|
13942
|
+
let valueArray = this.value.slice();
|
13943
|
+
if (this.value.includes(value)) {
|
13944
|
+
valueArray.splice(valueArray.indexOf(value), 1);
|
13945
|
+
}
|
13946
|
+
else {
|
13947
|
+
valueArray.push(value);
|
13948
|
+
valueArray = this.getValueSortedByOptions(valueArray);
|
13949
|
+
}
|
13950
|
+
this.value = valueArray.length === 0 ? null : valueArray;
|
13951
|
+
}
|
13952
|
+
else {
|
13953
|
+
this.value = [value];
|
13954
|
+
}
|
13969
13955
|
}
|
13970
13956
|
else {
|
13971
13957
|
this.value = value;
|
13972
13958
|
}
|
13973
|
-
|
13974
|
-
this.icChange.emit({ value: valueToEmit || null });
|
13959
|
+
this.icChange.emit({ value: this.multiple ? this.value : value });
|
13975
13960
|
};
|
13976
13961
|
this.emitIcInput = (value) => {
|
13977
13962
|
clearTimeout(this.debounceIcInput);
|
@@ -13984,30 +13969,25 @@ class Select {
|
|
13984
13969
|
if (this.options.length > 0) {
|
13985
13970
|
this.setOptionsValuesFromLabels();
|
13986
13971
|
this.uniqueOptions = this.deduplicateOptions(this.options);
|
13987
|
-
this.filteredOptions = this.uniqueOptions;
|
13988
13972
|
}
|
13989
13973
|
else {
|
13990
13974
|
this.noOptions = [{ label: this.emptyOptionListText, value: "" }];
|
13991
13975
|
this.uniqueOptions = this.noOptions;
|
13992
|
-
this.filteredOptions = this.noOptions;
|
13993
13976
|
}
|
13977
|
+
this.filteredOptions = this.uniqueOptions;
|
13994
13978
|
if (this.isExternalFiltering()) {
|
13995
13979
|
// When searchable select
|
13996
13980
|
this.noOptions = null;
|
13997
13981
|
this.updateSearchableSelectResultAriaLive();
|
13998
13982
|
this.setDefaultValue();
|
13999
13983
|
}
|
14000
|
-
else {
|
14001
|
-
|
14002
|
-
|
14003
|
-
this.initialOptionsEmpty = false;
|
14004
|
-
}
|
13984
|
+
else if (this.initialOptionsEmpty) {
|
13985
|
+
this.setDefaultValue();
|
13986
|
+
this.initialOptionsEmpty = false;
|
14005
13987
|
}
|
14006
13988
|
}
|
14007
|
-
else {
|
14008
|
-
|
14009
|
-
this.options = this.noOptions || [];
|
14010
|
-
}
|
13989
|
+
else if (!this.searchable) {
|
13990
|
+
this.options = this.noOptions || [];
|
14011
13991
|
}
|
14012
13992
|
};
|
14013
13993
|
/**
|
@@ -14018,11 +13998,10 @@ class Select {
|
|
14018
13998
|
this.deduplicateOptions = (options) => {
|
14019
13999
|
const uniqueValues = [];
|
14020
14000
|
const dedupedOptions = [];
|
14021
|
-
let dedupedChildren;
|
14022
14001
|
options.forEach((option) => {
|
14023
14002
|
if (option.children) {
|
14024
14003
|
//If an option has children, we will loop through them
|
14025
|
-
dedupedChildren = [];
|
14004
|
+
const dedupedChildren = [];
|
14026
14005
|
option.children.forEach((child) => {
|
14027
14006
|
if (uniqueValues.includes(child.value)) {
|
14028
14007
|
console.warn(`ic-select with label ${this.label} was populated with duplicate option (value: ${child.value}) which has been removed.`);
|
@@ -14033,8 +14012,7 @@ class Select {
|
|
14033
14012
|
}
|
14034
14013
|
});
|
14035
14014
|
// construct a modified option, inserting the deduplicated children alongside the original information
|
14036
|
-
|
14037
|
-
dedupedOptions.push(modifiedParent);
|
14015
|
+
dedupedOptions.push(Object.assign(Object.assign({}, option), { children: dedupedChildren }));
|
14038
14016
|
}
|
14039
14017
|
else {
|
14040
14018
|
// If an option does not have children, assess to see if it's value has been included already
|
@@ -14066,12 +14044,10 @@ class Select {
|
|
14066
14044
|
};
|
14067
14045
|
this.setTextColor = () => {
|
14068
14046
|
if (this.nativeSelectElement) {
|
14069
|
-
|
14070
|
-
this.nativeSelectElement.
|
14071
|
-
|
14072
|
-
|
14073
|
-
this.nativeSelectElement.className = "select-option-selected";
|
14074
|
-
}
|
14047
|
+
this.nativeSelectElement.className =
|
14048
|
+
this.nativeSelectElement.selectedIndex === 0
|
14049
|
+
? "placeholder"
|
14050
|
+
: "select-option-selected";
|
14075
14051
|
}
|
14076
14052
|
};
|
14077
14053
|
this.setMenuChange = (open) => {
|
@@ -14079,27 +14055,12 @@ class Select {
|
|
14079
14055
|
this.open = open;
|
14080
14056
|
}
|
14081
14057
|
};
|
14082
|
-
this.getLabelFromValue = (value) =>
|
14083
|
-
|
14084
|
-
}
|
14085
|
-
|
14086
|
-
|
14087
|
-
|
14088
|
-
};
|
14089
|
-
this.getFilteredChildMenuOptions = (option) => {
|
14090
|
-
let children = option.children;
|
14091
|
-
if (option.children) {
|
14092
|
-
if (this.searchable) {
|
14093
|
-
children = getFilteredMenuOptions(option.children, !!this.includeDescriptionsInSearch, this.searchableSelectInputValue || "", this.searchMatchPosition);
|
14094
|
-
}
|
14095
|
-
else {
|
14096
|
-
children = getFilteredMenuOptions(option.children, false, this.pressedCharacters, "start");
|
14097
|
-
}
|
14098
|
-
}
|
14099
|
-
const newOption = Object.assign({}, option);
|
14100
|
-
newOption.children = children;
|
14101
|
-
return newOption;
|
14102
|
-
};
|
14058
|
+
this.getLabelFromValue = (value) => getLabelFromValue(value, this.uniqueOptions);
|
14059
|
+
this.getMultipleOptionsString = (selectedValues) => selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.map((value) => this.getLabelFromValue(value)).filter((label) => !!label).join(", ");
|
14060
|
+
this.getFilteredChildMenuOptions = (option) => (Object.assign(Object.assign({}, option), { children: option.children &&
|
14061
|
+
getFilteredMenuOptions(option.children, this.searchable && !!this.includeDescriptionsInSearch, this.searchable
|
14062
|
+
? this.searchableSelectInputValue || ""
|
14063
|
+
: this.pressedCharacters, this.searchable ? this.searchMatchPosition : "start") }));
|
14103
14064
|
// (For multi-select) get value array, i.e. selected option values, in order they appear in option list
|
14104
14065
|
this.getValueSortedByOptions = (value) => {
|
14105
14066
|
const valueArray = value;
|
@@ -14118,13 +14079,13 @@ class Select {
|
|
14118
14079
|
// (rather than native <select> - rendered when viewed on a mobile / tablet screen)
|
14119
14080
|
this.handleCustomSelectChange = (event) => {
|
14120
14081
|
var _a, _b;
|
14121
|
-
const value = event.detail
|
14122
|
-
if (
|
14082
|
+
const { value, label, optionId } = event.detail;
|
14083
|
+
if (label === this.emptyOptionListText) {
|
14123
14084
|
(_a = this.searchableSelectElement) === null || _a === void 0 ? void 0 : _a.focus();
|
14124
14085
|
return;
|
14125
14086
|
}
|
14126
14087
|
if (this.searchable) {
|
14127
|
-
this.value = value;
|
14088
|
+
this.value = value || null;
|
14128
14089
|
this.searchableMenuItemSelected = true;
|
14129
14090
|
// After editing the input, if selecting the same option as before, set the input value to label again
|
14130
14091
|
if (this.value === this.currValue) {
|
@@ -14135,64 +14096,39 @@ class Select {
|
|
14135
14096
|
this.hiddenInputValue =
|
14136
14097
|
this.getValueFromLabel(this.searchableSelectInputValue) || null;
|
14137
14098
|
}
|
14138
|
-
if (
|
14139
|
-
this.
|
14140
|
-
|
14141
|
-
else {
|
14142
|
-
this.icOptionSelect.emit({ value });
|
14143
|
-
}
|
14144
|
-
this.ariaActiveDescendant = event.detail.optionId;
|
14145
|
-
this.emitIcChange(value);
|
14146
|
-
};
|
14147
|
-
// Update selected options - adds / removes them, in order of option list
|
14148
|
-
// Create new array if value prop is undefined
|
14149
|
-
this.handleMultipleSelectChange = (value) => {
|
14150
|
-
if (this.value) {
|
14151
|
-
let valueArray = this.value.slice();
|
14152
|
-
if (this.value.includes(value)) {
|
14153
|
-
const valueIndex = valueArray.indexOf(value);
|
14154
|
-
valueArray.splice(valueIndex, 1);
|
14099
|
+
if (value) {
|
14100
|
+
if (this.multiple && ((_b = this.value) === null || _b === void 0 ? void 0 : _b.includes(value))) {
|
14101
|
+
this.icOptionDeselect.emit({ value });
|
14155
14102
|
}
|
14156
14103
|
else {
|
14157
|
-
|
14158
|
-
valueArray = this.getValueSortedByOptions(valueArray);
|
14104
|
+
this.icOptionSelect.emit({ value });
|
14159
14105
|
}
|
14160
|
-
this.value = valueArray.length === 0 ? null : valueArray;
|
14161
14106
|
}
|
14162
|
-
|
14163
|
-
|
14164
|
-
|
14165
|
-
|
14166
|
-
|
14167
|
-
|
14168
|
-
|
14169
|
-
|
14170
|
-
const allEnabledOptions = this.ungroupedOptions.filter((option) => !option.disabled);
|
14171
|
-
const allValues = allEnabledOptions.map((option) => option.value);
|
14172
|
-
let newValue;
|
14173
|
-
if (selectAllOptions) {
|
14174
|
-
let unselectedValues;
|
14107
|
+
this.ariaActiveDescendant = optionId;
|
14108
|
+
this.emitIcChange(value || null);
|
14109
|
+
};
|
14110
|
+
this.handleSelectAllChange = ({ detail, }) => {
|
14111
|
+
const allValues = this.ungroupedOptions
|
14112
|
+
.filter((option) => !option.disabled)
|
14113
|
+
.map((option) => option.value);
|
14114
|
+
if (detail.select) {
|
14175
14115
|
// Only emit icOptionSelect for all values that are newly selected
|
14176
|
-
|
14177
|
-
|
14178
|
-
|
14179
|
-
else {
|
14180
|
-
unselectedValues = allValues;
|
14181
|
-
}
|
14116
|
+
const unselectedValues = this.value
|
14117
|
+
? allValues.filter((value) => this.value && !this.value.includes(value))
|
14118
|
+
: allValues;
|
14182
14119
|
unselectedValues.forEach((value) => this.icOptionSelect.emit({ value }));
|
14183
|
-
newValue = allValues;
|
14184
14120
|
}
|
14185
14121
|
else {
|
14186
14122
|
// Only emit icOptionDeselect for values that were selected
|
14187
14123
|
this.value.forEach((value) => this.icOptionDeselect.emit({ value }));
|
14188
|
-
newValue = null;
|
14189
14124
|
}
|
14190
|
-
this.emitIcChange(
|
14125
|
+
this.emitIcChange(detail.select ? allValues : null);
|
14191
14126
|
};
|
14192
14127
|
this.handleMenuChange = (event) => {
|
14193
14128
|
this.open = event.detail.open;
|
14194
14129
|
this.pressedCharacters = "";
|
14195
|
-
this.searchable
|
14130
|
+
if (this.searchable)
|
14131
|
+
this.handleFocusIndicatorDisplay();
|
14196
14132
|
};
|
14197
14133
|
// clears the debounce delay when navigating the menu with arrow keys etc
|
14198
14134
|
// to prevent delay in change event, which should only occur when typing in input
|
@@ -14267,19 +14203,18 @@ class Select {
|
|
14267
14203
|
if (this.open && key === " " && this.pressedCharacters.length === 0) {
|
14268
14204
|
this.setMenuChange(false);
|
14269
14205
|
}
|
14270
|
-
if (key.length
|
14271
|
-
window.clearTimeout(this.characterKeyPressTimer);
|
14272
|
-
this.characterKeyPressTimer = window.setTimeout(() => (this.pressedCharacters = ""), 1000);
|
14273
|
-
if (!(key === " " && !this.pressedCharacters)) {
|
14274
|
-
this.pressedCharacters += key;
|
14275
|
-
this.handleFilter();
|
14276
|
-
if (!this.noOptions) {
|
14277
|
-
this.emitIcChange(this.filteredOptions[0].value);
|
14278
|
-
}
|
14279
|
-
}
|
14280
|
-
}
|
14281
|
-
else {
|
14206
|
+
if (key.length !== 1 || this.searchable) {
|
14282
14207
|
this.pressedCharacters = "";
|
14208
|
+
return;
|
14209
|
+
}
|
14210
|
+
window.clearTimeout(this.characterKeyPressTimer);
|
14211
|
+
this.characterKeyPressTimer = window.setTimeout(() => (this.pressedCharacters = ""), 1000);
|
14212
|
+
if (key !== " " || !!this.pressedCharacters) {
|
14213
|
+
this.pressedCharacters += key;
|
14214
|
+
this.handleFilter();
|
14215
|
+
if (!this.noOptions) {
|
14216
|
+
this.emitIcChange(this.filteredOptions[0].value);
|
14217
|
+
}
|
14283
14218
|
}
|
14284
14219
|
};
|
14285
14220
|
this.handleNativeSelectKeyDown = (event) => {
|
@@ -14298,19 +14233,17 @@ class Select {
|
|
14298
14233
|
if (this.isExternalFiltering() && (event.key === "Enter" || isArrowKey)) {
|
14299
14234
|
this.menu.options = this.filteredOptions;
|
14300
14235
|
}
|
14301
|
-
else {
|
14302
|
-
|
14303
|
-
|
14304
|
-
this.menu.options = this.uniqueOptions;
|
14305
|
-
}
|
14236
|
+
else if (!this.hasTimedOut) {
|
14237
|
+
this.noOptions = null;
|
14238
|
+
this.menu.options = this.uniqueOptions;
|
14306
14239
|
}
|
14307
14240
|
}
|
14308
14241
|
if (this.open && event.key === "Enter") {
|
14309
14242
|
this.setMenuChange(false);
|
14310
14243
|
}
|
14311
14244
|
else {
|
14312
|
-
if (!
|
14313
|
-
if (
|
14245
|
+
if (!isArrowKey || this.noOptions === null) {
|
14246
|
+
if (event.key !== " " || this.pressedCharacters.length <= 0) {
|
14314
14247
|
// Keyboard events get passed onto ic-menu
|
14315
14248
|
(_a = this.menu) === null || _a === void 0 ? void 0 : _a.handleKeyboardOpen(event);
|
14316
14249
|
}
|
@@ -14326,9 +14259,9 @@ class Select {
|
|
14326
14259
|
this.handleClearButtonBlur = (ev) => {
|
14327
14260
|
var _a;
|
14328
14261
|
const retryButton = (_a = this.menu) === null || _a === void 0 ? void 0 : _a.querySelector("#retry-button");
|
14329
|
-
if (!
|
14330
|
-
ev.relatedTarget
|
14331
|
-
!
|
14262
|
+
if ((!this.searchableSelectElement ||
|
14263
|
+
ev.relatedTarget !== this.searchableSelectElement) &&
|
14264
|
+
(!retryButton || ev.relatedTarget !== retryButton)) {
|
14332
14265
|
this.setMenuChange(false);
|
14333
14266
|
this.handleFocusIndicatorDisplay();
|
14334
14267
|
}
|
@@ -14337,12 +14270,8 @@ class Select {
|
|
14337
14270
|
this.handleFilter = () => {
|
14338
14271
|
var _a;
|
14339
14272
|
const options = this.deduplicateOptions(this.searchable ? [...this.uniqueOptions] : this.ungroupedOptions);
|
14340
|
-
|
14273
|
+
const isGrouped = options.some((option) => !!option.children);
|
14341
14274
|
let newFilteredOptions = [];
|
14342
|
-
options.map((option) => {
|
14343
|
-
if (option.children)
|
14344
|
-
isGrouped = true;
|
14345
|
-
});
|
14346
14275
|
let menuOptionsFiltered;
|
14347
14276
|
if (this.searchable) {
|
14348
14277
|
menuOptionsFiltered = getFilteredMenuOptions(options, !!this.includeDescriptionsInSearch, this.inputValueToFilter || "", this.searchMatchPosition);
|
@@ -14356,30 +14285,14 @@ class Select {
|
|
14356
14285
|
newFilteredOptions = menuOptionsFiltered;
|
14357
14286
|
}
|
14358
14287
|
else if (isGrouped) {
|
14359
|
-
options.map((option) =>
|
14360
|
-
|
14361
|
-
|
14362
|
-
|
14363
|
-
|
14364
|
-
|
14365
|
-
|
14366
|
-
|
14367
|
-
}
|
14368
|
-
else {
|
14369
|
-
newFilteredOptions.push(this.getFilteredChildMenuOptions(option));
|
14370
|
-
}
|
14371
|
-
});
|
14372
|
-
}
|
14373
|
-
let noChildOptionsWhenFiltered = false;
|
14374
|
-
if (isGrouped) {
|
14375
|
-
noChildOptionsWhenFiltered = true;
|
14376
|
-
newFilteredOptions.map((option) => {
|
14377
|
-
if (option.children && option.children.length > 0) {
|
14378
|
-
noChildOptionsWhenFiltered = false;
|
14379
|
-
}
|
14380
|
-
});
|
14381
|
-
}
|
14382
|
-
if (newFilteredOptions.length > 0 && !noChildOptionsWhenFiltered) {
|
14288
|
+
newFilteredOptions = options.map((option) => this.includeGroupTitlesInSearch &&
|
14289
|
+
menuOptionsFiltered.indexOf(option) !== -1
|
14290
|
+
? option
|
14291
|
+
: this.getFilteredChildMenuOptions(option));
|
14292
|
+
}
|
14293
|
+
if (newFilteredOptions.length > 0 &&
|
14294
|
+
(!isGrouped ||
|
14295
|
+
newFilteredOptions.some(({ children }) => children && children.length > 0))) {
|
14383
14296
|
this.noOptions = null;
|
14384
14297
|
this.filteredOptions = newFilteredOptions;
|
14385
14298
|
}
|
@@ -14414,11 +14327,7 @@ class Select {
|
|
14414
14327
|
}, this.timeout);
|
14415
14328
|
}
|
14416
14329
|
};
|
14417
|
-
this.getValueFromLabel = (label) => {
|
14418
|
-
var _a;
|
14419
|
-
return (label &&
|
14420
|
-
((_a = this.uniqueOptions.find((option) => option.label === label)) === null || _a === void 0 ? void 0 : _a.value));
|
14421
|
-
};
|
14330
|
+
this.getValueFromLabel = (label) => { var _a; return label && ((_a = this.uniqueOptions.find((option) => option.label === label)) === null || _a === void 0 ? void 0 : _a.value); };
|
14422
14331
|
this.handleSearchableSelectInput = (event) => {
|
14423
14332
|
this.searchableSelectInputValue = event.target.value;
|
14424
14333
|
this.emitIcInput(this.searchableSelectInputValue);
|
@@ -14432,19 +14341,18 @@ class Select {
|
|
14432
14341
|
this.setMenuChange(true);
|
14433
14342
|
if (!this.disableAutoFiltering) {
|
14434
14343
|
this.handleFilter();
|
14435
|
-
this.
|
14344
|
+
clearTimeout(this.debounceAria);
|
14345
|
+
window.setTimeout(() => {
|
14346
|
+
this.updateSearchableSelectResultAriaLive();
|
14347
|
+
}, 800);
|
14436
14348
|
}
|
14437
14349
|
};
|
14438
14350
|
this.updateSearchableSelectResultAriaLive = () => {
|
14439
14351
|
var _a;
|
14440
14352
|
const searchableSelectResultsStatusEl = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".searchable-select-results-status");
|
14441
14353
|
if (searchableSelectResultsStatusEl) {
|
14442
|
-
|
14443
|
-
|
14444
|
-
}
|
14445
|
-
else {
|
14446
|
-
searchableSelectResultsStatusEl.innerText = "";
|
14447
|
-
}
|
14354
|
+
searchableSelectResultsStatusEl.innerText =
|
14355
|
+
this.noOptions !== null ? this.emptyOptionListText : "";
|
14448
14356
|
}
|
14449
14357
|
};
|
14450
14358
|
this.updateMultiSelectedCountAriaLive = () => {
|
@@ -14478,13 +14386,12 @@ class Select {
|
|
14478
14386
|
return;
|
14479
14387
|
}
|
14480
14388
|
const retryButton = (_a = this.menu) === null || _a === void 0 ? void 0 : _a.querySelector("#retry-button");
|
14481
|
-
|
14389
|
+
if (this.searchable &&
|
14482
14390
|
!!this.menu &&
|
14483
14391
|
target !== this.menu &&
|
14484
14392
|
!Array.from(this.menu.querySelectorAll("[role='option']")).includes(target) &&
|
14485
|
-
!
|
14486
|
-
!
|
14487
|
-
if (isSearchableAndNoFocusedInternalElements) {
|
14393
|
+
(!this.clearButton || target !== this.clearButton) &&
|
14394
|
+
(!retryButton || target !== retryButton)) {
|
14488
14395
|
if (!this.retryButtonClick) {
|
14489
14396
|
this.setMenuChange(false);
|
14490
14397
|
// Clear input field on blur when searchable if no option is selected
|
@@ -14523,6 +14430,7 @@ class Select {
|
|
14523
14430
|
this.filteredOptions = this.uniqueOptions;
|
14524
14431
|
}
|
14525
14432
|
};
|
14433
|
+
this.renderNativeOption = (option) => (hAsync("option", { value: option.value, disabled: option.disabled, selected: option.value === this.currValue }, option.label));
|
14526
14434
|
}
|
14527
14435
|
watchDisabledHandler() {
|
14528
14436
|
removeDisabledFalse(this.disabled, this.el);
|
@@ -14534,7 +14442,9 @@ class Select {
|
|
14534
14442
|
this.setOptions();
|
14535
14443
|
}
|
14536
14444
|
debounceChangedHandler(newValue) {
|
14537
|
-
this.
|
14445
|
+
if (this.currDebounce !== newValue) {
|
14446
|
+
this.currDebounce = newValue;
|
14447
|
+
}
|
14538
14448
|
}
|
14539
14449
|
valueChangedHandler() {
|
14540
14450
|
if (this.value !== this.currValue) {
|
@@ -14617,83 +14527,59 @@ class Select {
|
|
14617
14527
|
this.searchableSelectElement.focus();
|
14618
14528
|
}
|
14619
14529
|
}
|
14620
|
-
updateOnChangeDebounce(newValue) {
|
14621
|
-
if (this.currDebounce !== newValue) {
|
14622
|
-
this.currDebounce = newValue;
|
14623
|
-
}
|
14624
|
-
}
|
14625
|
-
debounceAriaLiveUpdate() {
|
14626
|
-
clearTimeout(this.debounceAria);
|
14627
|
-
window.setTimeout(() => {
|
14628
|
-
this.updateSearchableSelectResultAriaLive();
|
14629
|
-
}, 800);
|
14630
|
-
}
|
14631
14530
|
render() {
|
14632
|
-
|
14531
|
+
var _a;
|
14532
|
+
const { size, disabled, fullWidth, helperText, hideLabel, label, menuId, multiple, name, options, placeholder, readonly, required, searchable, showClearButton, validationStatus, validationText, currValue, theme, hiddenInputValue, open, inputId, searchableSelectInputValue, loading, value, emptyOptionListText, uniqueOptions, selectOnEnter, form, inheritedAttributes, ariaActiveDescendant, hasTimedOut, noOptions, filteredOptions, clearButtonFocused, } = this;
|
14633
14533
|
// HTML inputs only accept 'string' for their value
|
14634
14534
|
// Does not cause errors when it is a multi-select - sets value correctly, to a comma-separated string
|
14635
|
-
renderHiddenInput(this.el,
|
14535
|
+
renderHiddenInput(this.el, searchable ? hiddenInputValue : currValue, name || inputId, disabled);
|
14636
14536
|
const invalid = `${validationStatus === IcInformationStatus.Error}`;
|
14637
|
-
const describedBy = getInputDescribedByText(
|
14638
|
-
let showLeftIcon = !!this.el.querySelector(`[slot="icon"]`);
|
14639
|
-
if (showLeftIcon && (disabled || (readonly && !this.value))) {
|
14640
|
-
showLeftIcon = false;
|
14641
|
-
}
|
14642
|
-
const optionsSelectedCount = `${currValue === null || currValue === void 0 ? void 0 : currValue.length} of ${getOptionsWithoutGroupTitlesCount(this.options)} selected`;
|
14537
|
+
const describedBy = getInputDescribedByText(inputId, helperText !== "", hasValidationStatus(validationStatus, !!disabled)).trim();
|
14643
14538
|
const valueLabelString = multiple
|
14644
14539
|
? this.getMultipleOptionsString(currValue)
|
14645
14540
|
: this.getLabelFromValue(currValue);
|
14646
14541
|
const isClearable = !disabled &&
|
14647
14542
|
(searchable
|
14648
|
-
?
|
14649
|
-
: currValue && !
|
14650
|
-
return (hAsync(Host, { key: '
|
14651
|
-
"ic-select-disabled":
|
14652
|
-
"ic-select-searchable":
|
14543
|
+
? !!searchableSelectInputValue
|
14544
|
+
: !!currValue && !loading && showClearButton);
|
14545
|
+
return (hAsync(Host, { key: 'd128625d13fdd5c5ee1710116f071f42c9f9820f', class: {
|
14546
|
+
"ic-select-disabled": disabled,
|
14547
|
+
"ic-select-searchable": searchable,
|
14653
14548
|
[`ic-select-${size}`]: size !== "medium",
|
14654
|
-
"ic-select-full-width":
|
14549
|
+
"ic-select-full-width": fullWidth,
|
14655
14550
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
14656
|
-
}, onBlur: this.onBlur }, hAsync("ic-input-container", { key: '
|
14657
|
-
|
14658
|
-
|
14659
|
-
|
14660
|
-
|
14661
|
-
|
14662
|
-
}
|
14663
|
-
else {
|
14664
|
-
return (hAsync("option", { value: option.value, disabled: option.disabled, selected: option.value === currValue }, option.label));
|
14665
|
-
}
|
14666
|
-
}))) : searchable ? (hAsync("div", { class: "searchable-select-container" }, hAsync("input", { class: {
|
14551
|
+
}, onBlur: this.onBlur }, hAsync("ic-input-container", { key: 'd3d0381138d095fb6c2c673d543b9b61710c064b', readonly: readonly }, !hideLabel && (hAsync("ic-input-label", { key: '9cc4c487e780d00eed4bc4e4e3c3cbb66aab2a14', for: inputId, label: label, helperText: helperText, required: required, disabled: disabled, readonly: readonly })), hAsync("ic-input-component-container", { key: 'cc15c6396b6edcd506e2caa93871ec529f6f25a4', ref: (el) => (this.anchorEl = el), class: { "menu-open": open }, size: size, fullWidth: fullWidth, disabled: disabled, readonly: readonly, validationStatus: validationStatus }, isSlotUsed(this.el, "icon") &&
|
14552
|
+
!disabled &&
|
14553
|
+
(!readonly || !!value) && (hAsync("span", { key: '21933fa4367b40e02fc41692a35f612f0c6c17d5', slot: "left-icon", class: {
|
14554
|
+
readonly,
|
14555
|
+
"has-value": !!value,
|
14556
|
+
} }, hAsync("slot", { key: 'ad5ca4da28e3fb74526668811a042d7efdfad10c', name: "icon" }))), readonly ? (hAsync("ic-typography", null, hAsync("p", null, valueLabelString))) : isMobileOrTablet() && !multiple ? (hAsync("select", Object.assign({ ref: (el) => (this.nativeSelectElement = el), disabled: disabled, onChange: this.handleNativeSelectChange, required: required, id: inputId, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.handleNativeSelectKeyDown, form: form }, inheritedAttributes), hAsync("option", { value: "", selected: true, disabled: !showClearButton }, placeholder), options.map((option) => option.children ? (hAsync("optgroup", { label: option.label }, option.children.map((child) => this.renderNativeOption(child)))) : (this.renderNativeOption(option))))) : searchable ? (hAsync("div", { class: "searchable-select-container" }, hAsync("input", { class: {
|
14667
14557
|
"select-input": true,
|
14668
|
-
"with-clear-button": !!
|
14669
|
-
}, role: "combobox", autocomplete: "off", "aria-label": label, "aria-describedby": describedBy, "aria-activedescendant":
|
14670
|
-
(currValue === null ||
|
14558
|
+
"with-clear-button": !!searchableSelectInputValue,
|
14559
|
+
}, role: "combobox", autocomplete: "off", "aria-label": label, "aria-describedby": describedBy, "aria-activedescendant": ariaActiveDescendant, "aria-autocomplete": "list", "aria-expanded": `${open}`, "aria-invalid": invalid, "aria-required": `${required}`, "aria-controls": menuId, ref: (el) => (this.searchableSelectElement = el), id: inputId, value: searchableSelectInputValue || undefined, placeholder: placeholder, disabled: disabled, onInput: this.handleSearchableSelectInput, onClick: this.handleClick, onKeyDown: this.handleKeyDown, onFocus: this.onFocus, onBlur: this.onBlur, form: form }), isClearable && (hAsync("div", { class: "clear-button-container" }, hAsync("ic-button", { id: "clear-button", ref: (el) => (this.clearButton = el), "aria-label": searchableSelectInputValue &&
|
14560
|
+
(currValue === null || loading)
|
14671
14561
|
? "Clear input"
|
14672
|
-
: "Clear selection", class: "clear-button", innerHTML: Clear, onClick: this.handleClear, onFocus: this.handleClearButtonFocus, onBlur: this.handleClearButtonBlur, size: size, variant: "icon", theme:
|
14562
|
+
: "Clear selection", class: "clear-button", innerHTML: Clear, onClick: this.handleClear, onFocus: this.handleClearButtonFocus, onBlur: this.handleClearButtonBlur, size: size, variant: "icon", theme: clearButtonFocused ? "light" : "dark" }), hAsync("div", { class: "divider" }))), hAsync("span", { onMouseDown: this.handleExpandIconMouseDown, class: {
|
14673
14563
|
"expand-icon": true,
|
14674
|
-
"expand-icon-open":
|
14675
|
-
}, innerHTML: Expand, "aria-hidden": "true" }), hAsync("div", { "aria-live": "polite", role: "status", class: "searchable-select-results-status" }))) : (hAsync("div", { class: "select-container" }, hAsync("button", { class: "select-input", ref: (el) => (this.customSelectElement = el), id:
|
14676
|
-
? `${
|
14677
|
-
: valueLabelString) || placeholder}${required ? ", required" : ""}`, "aria-describedby": describedBy, "aria-invalid": invalid, "aria-haspopup": "listbox", "aria-expanded":
|
14564
|
+
"expand-icon-open": open,
|
14565
|
+
}, innerHTML: Expand, "aria-hidden": "true" }), hAsync("div", { "aria-live": "polite", role: "status", class: "searchable-select-results-status" }))) : (hAsync("div", { class: "select-container" }, hAsync("button", { class: "select-input", ref: (el) => (this.customSelectElement = el), id: inputId, "aria-label": `${label}, ${(multiple && currValue
|
14566
|
+
? `${currValue.length} of ${getOptionsWithoutGroupTitlesCount(options)} selected, ${valueLabelString}`
|
14567
|
+
: valueLabelString) || placeholder}${required ? ", required" : ""}`, "aria-describedby": describedBy, "aria-invalid": invalid, "aria-haspopup": "listbox", "aria-expanded": `${open}`, "aria-owns": menuId, "aria-controls": menuId, disabled: disabled, onBlur: this.onBlur, onFocus: this.onFocus, onClick: this.handleClick, onMouseDown: this.handleMouseDown, onKeyDown: this.handleKeyDown }, hAsync("ic-typography", { variant: "body", class: {
|
14678
14568
|
"value-text": true,
|
14679
|
-
"with-clear-button":
|
14680
|
-
placeholder: !
|
14681
|
-
? !
|
14569
|
+
"with-clear-button": isClearable,
|
14570
|
+
placeholder: !loading && multiple
|
14571
|
+
? !value || value.length < 1
|
14682
14572
|
: !this.getLabelFromValue(currValue),
|
14683
14573
|
} }, valueLabelString || placeholder), hAsync("div", { class: "select-input-end" }, isClearable && hAsync("div", { class: "divider" }), hAsync("span", { class: {
|
14684
14574
|
"expand-icon": true,
|
14685
|
-
"expand-icon-open":
|
14686
|
-
}, innerHTML: Expand, "aria-hidden": "true" }))), isClearable && (hAsync("ic-button", { id: "clear-button", "aria-label": "Clear selection", class: "clear-button", innerHTML: Clear, onClick: this.handleClear, onFocus: this.handleClearButtonFocus, onBlur: this.handleClearButtonBlur, size: size, variant: "icon", theme:
|
14687
|
-
"no-results":
|
14688
|
-
|
14689
|
-
(
|
14690
|
-
|
14691
|
-
this.noOptions[0].label === this.emptyOptionListText),
|
14692
|
-
}, ref: (el) => (this.menu = el), inputEl: (searchable
|
14575
|
+
"expand-icon-open": open,
|
14576
|
+
}, innerHTML: Expand, "aria-hidden": "true" }))), isClearable && (hAsync("ic-button", { id: "clear-button", "aria-label": "Clear selection", class: "clear-button", innerHTML: Clear, onClick: this.handleClear, onFocus: this.handleClearButtonFocus, onBlur: this.handleClearButtonBlur, size: size, variant: "icon", theme: clearButtonFocused ? "light" : "dark" }))))), (!isMobileOrTablet() || multiple) && (hAsync("ic-menu", { key: '341d478ae904d5bd2a4c6fa54fb29802d2851f3e', class: {
|
14577
|
+
"no-results": loading ||
|
14578
|
+
hasTimedOut ||
|
14579
|
+
((_a = noOptions === null || noOptions === void 0 ? void 0 : noOptions[0]) === null || _a === void 0 ? void 0 : _a.label) === emptyOptionListText,
|
14580
|
+
}, ref: (el) => (this.menu = el), inputEl: searchable
|
14693
14581
|
? this.searchableSelectElement
|
14694
|
-
: this.customSelectElement
|
14695
|
-
? "manual"
|
14696
|
-
: "automatic", closeOnSelect: !multiple })), this.multiple && (hAsync("div", { key: 'b1a65d56087d6603846cdd9cfc8c086e49597001', "aria-live": "polite", role: "status", class: "multi-select-selected-count" })), hasValidationStatus(this.validationStatus, !!this.disabled) && (hAsync("ic-input-validation", { key: 'e5553be7be57e5ae847bcd1a4d2525b18c4d1429', class: { "menu-open": this.open }, ariaLiveMode: "polite", status: validationStatus, message: validationText || "", for: this.inputId })))));
|
14582
|
+
: this.customSelectElement, inputLabel: label, anchorEl: this.anchorEl, size: size, menuId: menuId, open: open, options: searchable ? filteredOptions : uniqueOptions, value: multiple ? currValue : currValue, fullWidth: fullWidth, selectOnEnter: selectOnEnter, onMenuStateChange: this.handleMenuChange, onMenuOptionSelect: this.handleCustomSelectChange, onMenuOptionSelectAll: this.handleSelectAllChange, onMenuKeyPress: this.handleMenuKeyPress, onUngroupedOptionsSet: this.setUngroupedOptions, onRetryButtonClicked: this.handleRetry, parentEl: this.el, onTimeoutBlur: this.onTimeoutBlur, activationType: searchable || multiple || selectOnEnter ? "manual" : "automatic", closeOnSelect: !multiple })), multiple && (hAsync("div", { key: '8fb9874132ab430dc90eba61264424fcf200b944', "aria-live": "polite", role: "status", class: "multi-select-selected-count" })), hasValidationStatus(validationStatus, disabled) && (hAsync("ic-input-validation", { key: '872afd5e8f621258c64756d06061a266a4e09745', class: { "menu-open": open }, ariaLiveMode: "polite", status: validationStatus, message: validationText, for: inputId })))));
|
14697
14583
|
}
|
14698
14584
|
static get delegatesFocus() { return true; }
|
14699
14585
|
get el() { return getElement(this); }
|
@@ -14793,6 +14679,10 @@ class SideNavigation {
|
|
14793
14679
|
this.hasSecondaryNavigation = false;
|
14794
14680
|
this.menuExpanded = false;
|
14795
14681
|
this.menuOpen = false;
|
14682
|
+
/**
|
14683
|
+
* If `true`, the side navigation will close when a navigation item is clicked. This behaviour is only applicable on larger device sizes.
|
14684
|
+
*/
|
14685
|
+
this.closeOnNavItemClick = false;
|
14796
14686
|
/**
|
14797
14687
|
* If `true`, the icon and label will appear when side navigation is collapsed.
|
14798
14688
|
*/
|
@@ -15059,6 +14949,15 @@ class SideNavigation {
|
|
15059
14949
|
this.setMenuExpanded = (expanded) => {
|
15060
14950
|
this.menuExpanded = expanded;
|
15061
14951
|
};
|
14952
|
+
this.handleNavItemClicked = () => {
|
14953
|
+
if (!this.menuOpen &&
|
14954
|
+
this.deviceSize > DEVICE_SIZES.S &&
|
14955
|
+
this.menuExpanded) {
|
14956
|
+
setTimeout(() => {
|
14957
|
+
this.toggleMenuExpanded(false);
|
14958
|
+
}, 0);
|
14959
|
+
}
|
14960
|
+
};
|
15062
14961
|
/**
|
15063
14962
|
* As the mobile top bar is fixed, a padding top is required
|
15064
14963
|
* to push main content down the height of the mobile top bar
|
@@ -15175,6 +15074,9 @@ class SideNavigation {
|
|
15175
15074
|
this.arrangeSlottedNavigationItem(this.menuExpanded);
|
15176
15075
|
this.displayTooltipWithExpandedLongLabel(this.menuExpanded);
|
15177
15076
|
this.setExpandedButtonHeight();
|
15077
|
+
if (this.closeOnNavItemClick) {
|
15078
|
+
this.el.addEventListener("navItemClicked", this.handleNavItemClicked);
|
15079
|
+
}
|
15178
15080
|
!isSlotUsed(this.el, "app-title") &&
|
15179
15081
|
onComponentRequiredPropUndefined([{ prop: this.appTitle, propName: "app-title" }], "Side Navigation");
|
15180
15082
|
}
|
@@ -15184,6 +15086,9 @@ class SideNavigation {
|
|
15184
15086
|
this.resizeObserver.disconnect();
|
15185
15087
|
}
|
15186
15088
|
(_a = this.el) === null || _a === void 0 ? void 0 : _a.removeEventListener("transitionend", this.transitionEndHandler);
|
15089
|
+
if (this.closeOnNavItemClick) {
|
15090
|
+
this.el.removeEventListener("navItemClicked", this.handleNavItemClicked);
|
15091
|
+
}
|
15187
15092
|
}
|
15188
15093
|
brandChangeHandler({ detail }) {
|
15189
15094
|
this.foregroundColor = detail.mode;
|
@@ -15203,7 +15108,7 @@ class SideNavigation {
|
|
15203
15108
|
isAppNameSubtitleVariant,
|
15204
15109
|
appTitle: appTitle || "",
|
15205
15110
|
};
|
15206
|
-
return (hAsync(Host, { key: '
|
15111
|
+
return (hAsync(Host, { key: '15fb26b6255c8577321c0d8f6229657e708743a2', class: {
|
15207
15112
|
"xs-menu-open": menuOpen && isSDevice,
|
15208
15113
|
"xs-menu-close": !menuOpen && isSDevice,
|
15209
15114
|
"sm-collapsed": !isSDevice && !menuExpanded,
|
@@ -15212,12 +15117,12 @@ class SideNavigation {
|
|
15212
15117
|
[`ic-side-navigation-${IcBrandForegroundEnum.Dark}`]: foregroundColor === IcBrandForegroundEnum.Dark,
|
15213
15118
|
["collapsed-labels"]: !isSDevice && !menuExpanded && !!collapsedIconLabels,
|
15214
15119
|
["ic-side-navigation-inline"]: !!inline,
|
15215
|
-
} }, isSDevice && this.renderTopBar(Object.assign({}, topBarProps)), hAsync("div", { key: '
|
15120
|
+
} }, isSDevice && this.renderTopBar(Object.assign({}, topBarProps)), hAsync("div", { key: '7a61b9842b0178f2d278bba872b46f5e85f91ec6', class: "side-navigation", id: "side-navigation" }, !isSDevice && this.renderTopBar(Object.assign({}, topBarProps)), hAsync("div", { key: '17b4c931a5819104bc5d8895554e907775d17ede', class: "side-navigation-inner" }, isSlotUsed(this.el, "primary-navigation") && (hAsync("nav", { key: '02740005b1dbab60c1184d7c87365207fd23cfa4', class: "primary-navigation", "aria-labelledby": "primary-navigation-landmark" }, hAsync("span", { key: '5ab66ae81e990a476ea430149c45812d61054a25', "aria-hidden": "true", class: "navigation-landmark-title", id: "primary-navigation-landmark" }, "Primary"), hAsync("ul", { key: '4a0ce9df794e6a40d59b2445aaec4abc906b8534', class: "navigation-list" }, hAsync("slot", { key: 'a03aedf0f85e25ed693cfa07058e756f2e0e0445', name: "primary-navigation" }))))), hAsync("div", { key: 'bcf6f0da6c0f02bc284a786e5c667f9845bdbf8f', class: {
|
15216
15121
|
["bottom-wrapper"]: true,
|
15217
15122
|
["classification-spacing"]: hasClassificationBanner(),
|
15218
|
-
} }, isSlotUsed(this.el, "secondary-navigation") && (hAsync("nav", { key: '
|
15123
|
+
} }, isSlotUsed(this.el, "secondary-navigation") && (hAsync("nav", { key: 'dbef49a24d8e8d3001eea8d1c131a5a478a87c3d', class: "secondary-navigation", "aria-labelledby": "secondary-navigation-landmark" }, hAsync("span", { key: 'abab1109b3363bcc159364a392ab10930db86dbc', "aria-hidden": "true", class: "navigation-landmark-title", id: "secondary-navigation-landmark" }, "Secondary"), hAsync("ul", { key: 'b71571a5bad511452533ae01a6f875ad1ca70fa8', class: "navigation-list" }, hAsync("slot", { key: 'f889cc63a76aec21ab1897a426133907a2521153', name: "secondary-navigation" })))), hAsync("div", { key: '002dcfe1e4673ab9068ae841bdfb0ee95c2634db', class: "bottom-side-nav" }, this.hasSecondaryNavigation && hAsync("ic-divider", { key: 'bd87f4a2f9ddf55ed77b289eb82f3c0ceeed1ce7' }), displayExpandBtn && (hAsync("button", { key: '754ecc50a0ea7972e4f042e5316577b2e3e6b6f3', class: "menu-expand-button", innerHTML: chevronIcon, onClick: () => this.toggleMenuExpanded(!this.menuExpanded), "aria-label": `${menuExpanded ? "Collapse" : "Expand"} side navigation` })), hAsync("div", { key: '3c3060f672f549a905ff9ad13ea4ff1fdc23c97c', class: "app-status-wrapper" }, status !== "" && (hAsync("div", { key: '23cb48b7bf508a9d36b9185b9cb9af1576dfa048', class: {
|
15219
15124
|
["app-status"]: true,
|
15220
|
-
} }, hAsync("ic-typography", { key: '
|
15125
|
+
} }, hAsync("ic-typography", { key: '1128037e6b0438c727adac68a4ec50f8f3101ca9', "aria-label": "app tag", variant: "label-uppercase", class: "app-status-text" }, status))), version !== "" && (hAsync("ic-typography", { key: 'cc474438e8b625059dce3bf469010842ae2742ab', variant: "label", class: "app-version", "aria-label": "app version" }, version))))))));
|
15221
15126
|
}
|
15222
15127
|
get el() { return getElement(this); }
|
15223
15128
|
static get watchers() { return {
|
@@ -15229,6 +15134,7 @@ class SideNavigation {
|
|
15229
15134
|
"$tagName$": "ic-side-navigation",
|
15230
15135
|
"$members$": {
|
15231
15136
|
"appTitle": [1, "app-title"],
|
15137
|
+
"closeOnNavItemClick": [4, "close-on-nav-item-click"],
|
15232
15138
|
"collapsedIconLabels": [4, "collapsed-icon-labels"],
|
15233
15139
|
"disableAutoParentStyling": [4, "disable-auto-parent-styling"],
|
15234
15140
|
"disableTopBarBehaviour": [4, "disable-top-bar-behaviour"],
|
@@ -15280,11 +15186,11 @@ class Skeleton {
|
|
15280
15186
|
width: el.style.width || (variant === "circle" ? "25px" : "260px"),
|
15281
15187
|
}
|
15282
15188
|
: undefined;
|
15283
|
-
return (hAsync(Host, { key: '
|
15189
|
+
return (hAsync(Host, { key: 'd72d614e65bb23092c7cef2e2847fed1d4b7f09c', class: {
|
15284
15190
|
skeleton: true,
|
15285
15191
|
"ic-skeleton-circle": variant === "circle",
|
15286
15192
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
15287
|
-
}, style: style, "aria-disabled": "true" }, hAsync("slot", { key: '
|
15193
|
+
}, style: style, "aria-disabled": "true" }, hAsync("slot", { key: '53da4b02d7b0cca946041fe40cfed8f3609c7e55' })));
|
15288
15194
|
}
|
15289
15195
|
get el() { return getElement(this); }
|
15290
15196
|
static get style() { return IcSkeletonStyle0; }
|
@@ -15341,9 +15247,9 @@ class SkipLink {
|
|
15341
15247
|
}
|
15342
15248
|
render() {
|
15343
15249
|
const { fullWidth, inline, label, monochrome, target, theme, transparentBackground, } = this;
|
15344
|
-
return (hAsync(Host, { key: '
|
15250
|
+
return (hAsync(Host, { key: 'f5206da7f5818fffa8b702cdd373237a7df1352d', class: {
|
15345
15251
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
15346
|
-
} }, hAsync("ic-link", { key: '
|
15252
|
+
} }, hAsync("ic-link", { key: 'de29231082b19690757513b8df4a0724bb43d0eb', class: {
|
15347
15253
|
"display-top": !inline,
|
15348
15254
|
"full-width": !!fullWidth,
|
15349
15255
|
"show-background": !transparentBackground,
|
@@ -15408,12 +15314,12 @@ class StatusTag {
|
|
15408
15314
|
}
|
15409
15315
|
render() {
|
15410
15316
|
const { label, status, variant, size, announced, theme, uppercase } = this;
|
15411
|
-
return (hAsync(Host, { key: '
|
15317
|
+
return (hAsync(Host, { key: '49111e8b5eb75c70840fd09ea4a8a1dd3a7ba5f9', class: { [`ic-theme-${theme}`]: theme !== "inherit" }, role: announced ? "status" : null, "aria-label": "Status" }, hAsync("strong", { key: 'b0968e1e0b6a020d13b7156557ffd865c1032d65', class: {
|
15412
15318
|
["tag"]: true,
|
15413
15319
|
[`${variant}-${status}`]: true,
|
15414
15320
|
["outlined"]: variant === "outlined",
|
15415
15321
|
[`${size}`]: true,
|
15416
|
-
} }, hAsync("ic-typography", { key: '
|
15322
|
+
} }, hAsync("ic-typography", { key: '4c03e5a6c47f6c027f8150700d027dab67ca356c', variant: uppercase ? "label-uppercase" : "label", "apply-vertical-margins": false }, hAsync("span", { key: '861310210d2644c28dcd81fe59e846a14865b106' }, label)))));
|
15417
15323
|
}
|
15418
15324
|
static get style() { return IcStatusTagStyle0; }
|
15419
15325
|
static get cmpMeta() { return {
|
@@ -15497,29 +15403,29 @@ class Step {
|
|
15497
15403
|
// STATUS ICON FOR COMPACT STEP
|
15498
15404
|
let statusIcon;
|
15499
15405
|
if (this.type === "completed" || this.compactStepStyling === "completed") {
|
15500
|
-
statusIcon = (hAsync("span", { key: '
|
15406
|
+
statusIcon = (hAsync("span", { key: '4a9203e6aa1fd036fb787b0157742238663bcbd5', class: "check-icon step-icon", "aria-hidden": "true", innerHTML: checkIcon }));
|
15501
15407
|
}
|
15502
15408
|
else if (this.type === "disabled" ||
|
15503
15409
|
this.compactStepStyling === "disabled") {
|
15504
|
-
statusIcon = (hAsync("span", { key: '
|
15410
|
+
statusIcon = (hAsync("span", { key: '3e6f50e3f85e96b40066233cf8f579eeb2915a4a', class: "warning-icon step-icon", "aria-hidden": "true", innerHTML: warningIcon }));
|
15505
15411
|
}
|
15506
15412
|
// COMPACT STEP COMPONENT
|
15507
|
-
const compactStep = (hAsync("div", { key: '
|
15413
|
+
const compactStep = (hAsync("div", { key: 'e0176afedd5e4d78e9cf0cf3b9127fb350d37230', class: {
|
15508
15414
|
["step"]: true,
|
15509
15415
|
["current"]: !!this.current,
|
15510
15416
|
[`compact-step-${this.compactStepStyling}`]: !!this.compactStepStyling,
|
15511
15417
|
["disabled"]: this.type === "disabled" || this.compactStepStyling === "disabled",
|
15512
|
-
} }, hAsync("ic-loading-indicator", { key: '
|
15418
|
+
} }, hAsync("ic-loading-indicator", { key: '35b1cdf3892123ba853ca17b1442f40a4b769674', class: {
|
15513
15419
|
"compact-step-progress-indicator": true,
|
15514
15420
|
"not-required": this.type === "disabled" ||
|
15515
15421
|
this.compactStepStyling === "disabled",
|
15516
|
-
}, "aria-hidden": "true", size: "small", "inner-label": this.stepNum, progress: this.progress }), hAsync("div", { key: '
|
15422
|
+
}, "aria-hidden": "true", size: "small", "inner-label": this.stepNum, progress: this.progress }), hAsync("div", { key: '6280811d6995b9a06c2a758a2e27a8b4c50f6a3c', class: "heading-area" }, hAsync("ic-typography", { key: '44382dd1f5a00d397f857341d4c85c35fe3986b0', variant: "h4", class: "heading" }, this.heading), hAsync("div", { key: '80897d2a2b10a74e4effe62b37e1f991041d98d0', class: "info-line" }, hAsync("ic-typography", { key: 'a8fb18daae6c067825f7251a02dc0a43c4d8be00', variant: "caption", class: "step-num" }, `${this.stepNum} of ${this.lastStepNum}`, hAsync("span", { key: '7fec868e706c5ae8500e5f62bd40e06f207f27bc', class: "visually-hidden" }, " steps")), (this.subheading ||
|
15517
15423
|
this.type === "completed" ||
|
15518
15424
|
this.type === "disabled" ||
|
15519
15425
|
(this.variant === "compact" &&
|
15520
15426
|
!!this.compactStepStyling &&
|
15521
15427
|
this.compactStepStyling !== "active") ||
|
15522
|
-
!!this.status) && (hAsync("div", { key: '
|
15428
|
+
!!this.status) && (hAsync("div", { key: '2686329ae67e2d4e5ff70269c53111e51e40e22d', class: "step-status" }, statusIcon !== undefined && statusIcon, (this.subheading || stepType) && (hAsync("ic-typography", { key: '9d084452fe5fc69f3fb75d23e52cafaab618cc76', variant: "caption" }, this.subheading !== null && isPropDefined(this.subheading)
|
15523
15429
|
? this.subheading
|
15524
15430
|
: this.type === "disabled" ||
|
15525
15431
|
(this.variant === "compact" &&
|
@@ -15532,26 +15438,26 @@ class Step {
|
|
15532
15438
|
// ICON FOR DEFAULT STEP
|
15533
15439
|
let icon;
|
15534
15440
|
if (this.type !== "completed") {
|
15535
|
-
icon = (hAsync("ic-typography", { key: '
|
15441
|
+
icon = (hAsync("ic-typography", { key: '40a724fa1fd9fb124824b86c77f0e8e579e10ddf', variant: "subtitle-small" }, hAsync("span", { key: '80d7cee87c798fd31ef259c60cdc0207d1149569', class: "step-icon-inner", "aria-hidden": "true" }, this.stepNum)));
|
15536
15442
|
}
|
15537
15443
|
else {
|
15538
|
-
icon = (hAsync("div", { key: '
|
15444
|
+
icon = (hAsync("div", { key: 'af64e8626ca32695d539a300549709505f5e0074', class: "step-icon-inner", "aria-hidden": "true" }, hAsync("span", { key: 'ae8e6c0527c288eb8cba12ee407ba95b30518ef3', class: "check-icon", innerHTML: checkIcon })));
|
15539
15445
|
}
|
15540
15446
|
// STEP CONNECT FOR DEFAULT STEP
|
15541
|
-
const partialBar = this.type === "current" && (hAsync("div", { key: '
|
15542
|
-
const finalStep = !this.lastStep && (hAsync("div", { key: '
|
15447
|
+
const partialBar = this.type === "current" && (hAsync("div", { key: '36d5a9fa668901e1e975222a8b675330af53761d', class: "step-connect-inner" }));
|
15448
|
+
const finalStep = !this.lastStep && (hAsync("div", { key: '5326ee2373d2580f2ba5d41547a50b0c59ad31e6', class: {
|
15543
15449
|
["step-connect"]: true,
|
15544
15450
|
["aligned-full-width"]: !!(((_a = this.el.parentElement) === null || _a === void 0 ? void 0 : _a.classList.contains("ic-stepper-default")) &&
|
15545
15451
|
!this.el.parentElement.classList.contains("ic-stepper-aligned-left")),
|
15546
15452
|
} }, partialBar));
|
15547
15453
|
// DEFAULT STEP COMPONENT
|
15548
|
-
const defaultStep = (hAsync("div", { key: '
|
15454
|
+
const defaultStep = (hAsync("div", { key: 'de6aef5add716f0ab39f01025252963f93ff87db', class: {
|
15549
15455
|
["step"]: true,
|
15550
15456
|
[`${this.type}`]: true,
|
15551
|
-
} }, hAsync("div", { key: '
|
15457
|
+
} }, hAsync("div", { key: '1c4948393db6d357dddd34ede57e4f85525904e1', class: "step-top" }, hAsync("div", { key: '9a5fbf343c17dbf1426a8d81f7b35964f2ebe384', class: "step-icon" }, icon), finalStep), (this.heading || this.subheading || this.status) && (hAsync("div", { key: 'e9f4545dd4490ad1a7c1cc786c2339c9b097ba2b', class: "heading-area" }, this.heading && (hAsync("ic-typography", { key: 'e26a94db6d7e199eced26ec78b8997641652d77a', variant: "subtitle-large", class: "heading" }, this.heading)), this.heading && (this.subheading || this.status) && (hAsync("ic-typography", { key: 'a30708b8b2c1a7fc37d90b69426f88e794a4e9fb', variant: "caption", class: "subheading" }, this.subheading !== null && isPropDefined(this.subheading)
|
15552
15458
|
? this.subheading
|
15553
15459
|
: stepStatus))))));
|
15554
|
-
return (hAsync(Host, { key: '
|
15460
|
+
return (hAsync(Host, { key: 'b7faa59fe0e1e1315ff7753bcba19a24bc671368', role: "listitem", "aria-label": `Step ${this.stepNum}${ariaLabel}`, "aria-current": (this.current || this.type === "current") && "step", class: {
|
15555
15461
|
["aligned-full-width"]: !!(((_b = this.el.parentElement) === null || _b === void 0 ? void 0 : _b.classList.contains("ic-stepper-default")) &&
|
15556
15462
|
!this.el.parentElement.classList.contains("ic-stepper-aligned-left")),
|
15557
15463
|
[`ic-step-${this.variant}`]: true,
|
@@ -15832,11 +15738,11 @@ class Stepper {
|
|
15832
15738
|
checkResizeObserver(this.runResizeObserver);
|
15833
15739
|
}
|
15834
15740
|
render() {
|
15835
|
-
return (hAsync(Host, { key: '
|
15741
|
+
return (hAsync(Host, { key: 'c14ab03785dce7e9468fae22cc65ae18be102ae9', class: {
|
15836
15742
|
[`ic-stepper-${this.variant}`]: true,
|
15837
15743
|
["ic-stepper-aligned-left"]: this.variant === "default" && this.aligned === "left",
|
15838
15744
|
[`ic-theme-${this.theme}`]: this.theme !== "inherit",
|
15839
|
-
} }, hAsync("ul", { key: '
|
15745
|
+
} }, hAsync("ul", { key: 'f1ca972d94d0ba753baffc6af457b5458117e810', class: "step-item-list" }, hAsync("slot", { key: 'f2db26bd574543d137e5eb55e70bfa9201d50cae' }))));
|
15840
15746
|
}
|
15841
15747
|
get el() { return getElement(this); }
|
15842
15748
|
static get watchers() { return {
|
@@ -15965,16 +15871,16 @@ class Switch {
|
|
15965
15871
|
const { label, checkedState, size, disabled, name, value, hideLabel, helperText, inputId, theme, } = this;
|
15966
15872
|
const isSmall = size === "small";
|
15967
15873
|
renderHiddenInput(this.el, checkedState ? value : "", name, disabled);
|
15968
|
-
return (hAsync(Host, { key: '
|
15874
|
+
return (hAsync(Host, { key: '66d9e066d1e0f20f7fa59fa0ca51c1769562a80e', class: {
|
15969
15875
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
15970
|
-
} }, hAsync("label", { key: '
|
15876
|
+
} }, hAsync("label", { key: '4bb0893e84a0c5f5f60ae02a00f1939987d5feb6', class: {
|
15971
15877
|
"ic-switch-container": true,
|
15972
15878
|
"ic-switch-disabled": !!disabled,
|
15973
15879
|
"ic-switch-small": isSmall,
|
15974
|
-
}, htmlFor: inputId }, !hideLabel && (hAsync("ic-input-label", { key: '
|
15880
|
+
}, htmlFor: inputId }, !hideLabel && (hAsync("ic-input-label", { key: '30301d042cec22cb7075eaf3bb424253b6ca1a36', for: inputId, label: label, helperText: helperText, readonly: true, disabled: disabled, class: {
|
15975
15881
|
"ic-switch-label": true,
|
15976
15882
|
"ic-switch-label-small": isSmall,
|
15977
|
-
} })), !hideLabel && hAsync("span", { key: '
|
15883
|
+
} })), !hideLabel && hAsync("span", { key: '6427efd9a6a645dd73783cc6e0356c437856c1bb', class: "ic-switch-line-break" }), hAsync("input", { key: 'dace8d204c141350a2e5cf9ab6ea47337b98731c', checked: checkedState, disabled: disabled, "aria-label": label, "aria-checked": checkedState ? "true" : "false", "aria-describedby": getInputDescribedByText(inputId, helperText !== "", false), role: "switch", class: "ic-switch-input", type: "checkbox", name: "toggle", id: inputId, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.handleChange }), hAsync("span", { key: 'a443193b38189567ecb9740b47c60c6d9e09fdbc', class: "ic-switch-toggle" }, hAsync("svg", { key: 'b8b91083bb4afa7dc2d63c858e44594cebc5ee89', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, hAsync("line", { key: 'af086eb2f9f000b7c881620d19f879956b82a3e8', class: "ic-switch-icon-line", x1: "9", y1: isSmall ? "2" : "1", x2: "9", y2: isSmall ? "8" : "9" })), hAsync("svg", { key: '788815cfaf4aae19e33b5adb03a8452365d8c700', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, hAsync("circle", { key: 'f214643ebf7dfdd76f719e82f2241dc779bf5911', class: "ic-switch-icon-circle", fill: "none", cx: "5", cy: "5", r: isSmall ? "3.335" : "4.445" }))), hAsync("slot", { key: 'a88bdfafceb94160a60e4396c34d1a80ca21a58e', name: "right-adornment" }))));
|
15978
15884
|
}
|
15979
15885
|
static get delegatesFocus() { return true; }
|
15980
15886
|
get el() { return getElement(this); }
|
@@ -16352,7 +16258,7 @@ class TabContext {
|
|
16352
16258
|
}
|
16353
16259
|
}
|
16354
16260
|
render() {
|
16355
|
-
return hAsync("slot", { key: '
|
16261
|
+
return hAsync("slot", { key: '308c198fe6530957868154b0e7edb1a977629bca' });
|
16356
16262
|
}
|
16357
16263
|
get el() { return getElement(this); }
|
16358
16264
|
static get watchers() { return {
|
@@ -16398,11 +16304,11 @@ class TabGroup {
|
|
16398
16304
|
}
|
16399
16305
|
render() {
|
16400
16306
|
const { inline, theme, label, monochrome } = this;
|
16401
|
-
return (hAsync(Host, { key: '
|
16307
|
+
return (hAsync(Host, { key: '843cb9e2c3bf88635d7721ce01d0fbcac8c0f774', role: "tablist", "aria-label": label, class: {
|
16402
16308
|
["ic-tab-group-inline"]: !!inline,
|
16403
16309
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
16404
16310
|
["ic-tab-group-monochrome"]: !!monochrome,
|
16405
|
-
} }, hAsync("ic-horizontal-scroll", { key: '
|
16311
|
+
} }, hAsync("ic-horizontal-scroll", { key: '3e65658082dfa15c4249b942a4231402b9b20856', theme: theme, "focus-trigger": "tabFocus", monochrome: monochrome }, hAsync("div", { key: '579c86d070a566e752c102195b8d13de7bdd0ac9', class: "tabs-container" }, hAsync("slot", { key: 'c5d14fa4615b470d8aa01b567667768427f20e50' })))));
|
16406
16312
|
}
|
16407
16313
|
static get delegatesFocus() { return true; }
|
16408
16314
|
static get style() { return IcTabGroupStyle0; }
|
@@ -16445,10 +16351,10 @@ class TabPanel {
|
|
16445
16351
|
}
|
16446
16352
|
render() {
|
16447
16353
|
const { active, theme } = this;
|
16448
|
-
return (hAsync(Host, { key: '
|
16354
|
+
return (hAsync(Host, { key: 'b5bfad1dbd94c81d889c5cb1e5dabadece967655', class: {
|
16449
16355
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
16450
16356
|
"ic-tab-panel-hidden": !active,
|
16451
|
-
}, role: "tabpanel", "aria-hidden": `${!active}` }, hAsync("div", { key: '
|
16357
|
+
}, role: "tabpanel", "aria-hidden": `${!active}` }, hAsync("div", { key: 'a1032b06a9103331d74a35a9c4bd1a47a63d3335' }, hAsync("slot", { key: '5c8c7c9bbbc6573e9e3a05224cb50ef36740c81c' }))));
|
16452
16358
|
}
|
16453
16359
|
get el() { return getElement(this); }
|
16454
16360
|
static get style() { return IcTabPanelStyle0; }
|
@@ -16495,6 +16401,7 @@ class TextField {
|
|
16495
16401
|
this.minCharactersUnattained = false;
|
16496
16402
|
this.maxValueExceeded = false;
|
16497
16403
|
this.minValueUnattained = false;
|
16404
|
+
this.isFocussed = false;
|
16498
16405
|
/**
|
16499
16406
|
* The automatic capitalisation of the text value as it is entered/edited by the user.
|
16500
16407
|
* Available options: "off", "none", "on", "sentences", "words", "characters".
|
@@ -16678,11 +16585,13 @@ class TextField {
|
|
16678
16585
|
this.minCharactersUnattained =
|
16679
16586
|
this.minCharacters > 0 && this.numChars < this.minCharacters;
|
16680
16587
|
this.icBlur.emit({ value });
|
16588
|
+
this.isFocussed = false;
|
16681
16589
|
};
|
16682
16590
|
this.onFocus = (ev) => {
|
16683
16591
|
const target = ev.target;
|
16684
16592
|
target.addEventListener("wheel", this.onWheel);
|
16685
16593
|
this.icFocus.emit({ value: target.value });
|
16594
|
+
this.isFocussed = true;
|
16686
16595
|
};
|
16687
16596
|
this.onTextAreaScroll = () => {
|
16688
16597
|
this.icScroll.emit();
|
@@ -16793,7 +16702,7 @@ class TextField {
|
|
16793
16702
|
(_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.focus();
|
16794
16703
|
}
|
16795
16704
|
render() {
|
16796
|
-
const { inputId, name, label, required, size, placeholder, helperText, hideCharCount, rows, resize, disabled, value, min, max, numChars, readonly, maxCharacters, maxCharactersMessage, maxCharactersWarning, maxCharactersReached, maxMessage, minCharacters, minCharactersMessage, minCharactersUnattained, minMessage, minValueUnattained, maxValueExceeded, validationStatus, validationText, validationInline, validationInlineInternal, spellcheck, inputmode, fullWidth, truncateValue, hiddenInput, theme, hideLabel, type, autocapitalize, ariaActiveDescendant, inheritedAttributes, ariaExpanded, ariaOwns, autocomplete, role, } = this;
|
16705
|
+
const { inputId, name, label, required, size, placeholder, helperText, hideCharCount, rows, resize, disabled, value, min, max, numChars, readonly, maxCharacters, maxCharactersMessage, maxCharactersWarning, maxCharactersReached, maxMessage, minCharacters, minCharactersMessage, minCharactersUnattained, minMessage, minValueUnattained, maxValueExceeded, validationStatus, validationText, validationInline, validationInlineInternal, spellcheck, inputmode, fullWidth, truncateValue, hiddenInput, theme, hideLabel, type, autocapitalize, ariaActiveDescendant, inheritedAttributes, ariaExpanded, ariaOwns, autocomplete, role, isFocussed, } = this;
|
16797
16706
|
const el = this.el;
|
16798
16707
|
const disabledMode = readonly || disabled;
|
16799
16708
|
const currentStatus = maxValueExceeded ||
|
@@ -16824,43 +16733,45 @@ class TextField {
|
|
16824
16733
|
!(currentStatus == IcInformationStatus.Success && validationInline) &&
|
16825
16734
|
!validationInlineInternal;
|
16826
16735
|
const multiline = rows > 1;
|
16827
|
-
const charsRemaining = maxNumChars - numChars;
|
16828
16736
|
const hiddenCharCountDescId = maxCharacters > 0 ? `${inputId}-char-count-desc` : "";
|
16829
|
-
const
|
16737
|
+
const charsRemaining = maxNumChars - numChars;
|
16738
|
+
const remainingCharCountDescId = maxCharacters > 0 ? `${inputId}-remaining-char-count-desc` : "";
|
16739
|
+
const remainingCharCountDesc = `${charsRemaining} character${charsRemaining === 1 ? "" : "s"} remaining.`;
|
16740
|
+
const describedBy = `${hiddenCharCountDescId} ${numChars > 0 ? remainingCharCountDescId : ""} ${getInputDescribedByText(inputId, helperText !== "", showStatusText)}`.trim();
|
16830
16741
|
const disabledText = disabledMode && !readonly;
|
16831
16742
|
const showLeftIcon = !!this.el.querySelector(`[slot="icon"]`) && !disabledText;
|
16832
16743
|
const invalid = `${currentStatus === IcInformationStatus.Error}`;
|
16833
16744
|
hiddenInput
|
16834
16745
|
? renderHiddenInput(this.el, value, name, disabledMode)
|
16835
16746
|
: removeHiddenInput(this.el);
|
16836
|
-
return (hAsync(Host, { key: '
|
16747
|
+
return (hAsync(Host, { key: 'fe960598716052334b20c15f7e4b05477025783b', class: {
|
16837
16748
|
"ic-text-field-full-width": fullWidth,
|
16838
16749
|
"ic-text-field-disabled": disabledMode,
|
16839
16750
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
16840
|
-
} }, hAsync("ic-input-container", { key: '
|
16751
|
+
} }, hAsync("ic-input-container", { key: '1a4e6b2cd9ef8646ed34575b77ce53d82a1dbb1b', readonly: readonly, disabled: disabledMode }, !hideLabel && (hAsync("ic-input-label", { key: '1b56501853e8a8062a4b02fb85be73c69d4b5b1e', for: inputId, label: label, helperText: helperText, required: required, disabled: disabledText, readonly: readonly })), hAsync("ic-input-component-container", { key: '7e104a64fc5ab3a173b814d38287fd843cfb8eb4', size: size, validationStatus: currentStatus, multiLine: multiline, disabled: disabledMode, readonly: readonly, validationInline: validationInline, fullWidth: fullWidth }, showLeftIcon && (hAsync("span", { key: 'd3e31bb36c451e33d99b93eb069b6cad1e074de3', class: {
|
16841
16752
|
readonly,
|
16842
16753
|
"has-value": this.getNumberOfCharacters(value) > 0,
|
16843
|
-
}, slot: "left-icon" }, hAsync("slot", { key: '
|
16754
|
+
}, slot: "left-icon" }, hAsync("slot", { key: '6b91c9ac3cf054c3e30208712e3404c03c1e7d45', name: "icon" }))), !multiline ? (hAsync("input", Object.assign({ id: inputId, name: name, ref: (el) => (this.inputEl = el), type: type, min: min, max: max, value: value, class: {
|
16844
16755
|
"no-left-pad": !showLeftIcon && readonly,
|
16845
16756
|
readonly,
|
16846
16757
|
"truncate-value": truncateValue,
|
16847
|
-
}, placeholder: placeholder ? placeholder : "", required: required, disabled: disabledMode, readonly: readonly, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, "aria-activedescendant": ariaActiveDescendant, "aria-expanded": ariaExpanded, "aria-owns": ariaOwns, autocomplete: autocomplete, autocapitalize: autocapitalize, spellcheck: spellcheck, inputmode: inputmode, role: role, maxlength: maxCharactersReached ? maxCharacters : undefined, minlength: minCharactersUnattained ? minCharacters : undefined }, inheritedAttributes))) : (hAsync("textarea", Object.assign({ id: inputId, class: {
|
16758
|
+
}, placeholder: placeholder ? placeholder : "", required: required, disabled: disabledMode, readonly: readonly, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, "aria-activedescendant": ariaActiveDescendant, "aria-expanded": ariaExpanded, "aria-owns": ariaOwns, autocomplete: autocomplete, autocapitalize: autocapitalize, spellcheck: spellcheck, inputmode: inputmode, role: role || undefined, maxlength: maxCharactersReached ? maxCharacters : undefined, minlength: minCharactersUnattained ? minCharacters : undefined }, inheritedAttributes))) : (hAsync("textarea", Object.assign({ id: inputId, class: {
|
16848
16759
|
"no-resize": resize === false || !!readonly,
|
16849
16760
|
"no-left-pad": !showLeftIcon && !!readonly,
|
16850
16761
|
readonly: !!readonly,
|
16851
|
-
}, name: name, ref: (el) => (this.inputEl = el), value: value, rows: rows, required: required, disabled: disabledMode, placeholder: placeholder, readonly: readonly, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onScroll: this.onTextAreaScroll, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, autocapitalize: autocapitalize, spellcheck: spellcheck, inputmode: inputmode, maxlength: maxCharactersReached ? maxCharacters : undefined, minlength: minCharactersUnattained ? minCharacters : undefined }, inheritedAttributes))), isSlotUsed(el, "clear-button") && (hAsync("slot", { key: '
|
16762
|
+
}, name: name, ref: (el) => (this.inputEl = el), value: value, rows: rows, required: required, disabled: disabledMode, placeholder: placeholder, readonly: readonly, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onScroll: this.onTextAreaScroll, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, autocapitalize: autocapitalize, spellcheck: spellcheck, inputmode: inputmode, maxlength: maxCharactersReached ? maxCharacters : undefined, minlength: minCharactersUnattained ? minCharacters : undefined }, inheritedAttributes))), isSlotUsed(el, "clear-button") && (hAsync("slot", { key: '9b9a1124d52713bf7addfdaa9ad2c8f13538e988', name: "clear-button" })), isSlotUsed(el, "search-submit-button") && (hAsync("slot", { key: '3b84112cf83d64ae25bec34bd981a2d53d4cb00c', name: "search-submit-button" }))), isSlotUsed(el, "menu") && hAsync("slot", { key: 'f4b614d2451d5c264455536c365ce01510549df3', name: "menu" }), (!isEmptyString(validationStatus) ||
|
16852
16763
|
!isEmptyString(validationText) ||
|
16853
16764
|
maxNumChars > 0 ||
|
16854
16765
|
maxValueExceeded ||
|
16855
16766
|
maxCharactersWarning ||
|
16856
16767
|
minCharactersUnattained ||
|
16857
16768
|
minValueUnattained) &&
|
16858
|
-
!validationInlineInternal && (hAsync("ic-input-validation", { key: '
|
16769
|
+
!validationInlineInternal && (hAsync("ic-input-validation", { key: 'a3320c6413c9688905aa7195c07aedaeb5b07aac', status: this.hasStatus(currentStatus) === false ||
|
16859
16770
|
(currentStatus === IcInformationStatus.Success &&
|
16860
16771
|
validationInline) ||
|
16861
16772
|
validationInlineInternal
|
16862
16773
|
? ""
|
16863
|
-
: currentStatus, message: showStatusText ? currentValidationText : "", ariaLiveMode: messageAriaLive, for: inputId, fullWidth: fullWidth }, !readonly && maxNumChars > 0 && (hAsync("div", { key: '
|
16774
|
+
: currentStatus, message: showStatusText ? currentValidationText : "", ariaLiveMode: messageAriaLive, for: inputId, fullWidth: fullWidth }, !readonly && maxNumChars > 0 && (hAsync("div", { key: '50e3a895feaf7026e41698279e344ec987be3569', slot: "validation-message-adornment" }, !hideCharCount && (hAsync("ic-typography", { key: '6918f82e8bc0ab17941bdafa24249f7ac0fbc191', variant: "caption", class: "char-count-text" }, hAsync("span", { key: '59b2ea3ee4a854eff96af2faacb407f926c1b393', class: "char-count" }, numChars, "/", maxNumChars))), hAsync("span", { key: '977bfee3b55bad4412d6943dfc8e75bd0f4ddb41', class: "remaining-char-count-desc", "aria-live": "polite", hidden: !isFocussed, id: remainingCharCountDescId }, remainingCharCountDesc), hAsync("span", { key: '727328e80137330465fcbdc45711f168b5d9d54f', hidden: true, id: hiddenCharCountDescId }, "Field can contain a maximum of ", maxNumChars, " characters."))))))));
|
16864
16775
|
}
|
16865
16776
|
get el() { return getElement(this); }
|
16866
16777
|
static get watchers() { return {
|
@@ -16922,6 +16833,7 @@ class TextField {
|
|
16922
16833
|
"minCharactersUnattained": [32],
|
16923
16834
|
"maxValueExceeded": [32],
|
16924
16835
|
"minValueUnattained": [32],
|
16836
|
+
"isFocussed": [32],
|
16925
16837
|
"initialValue": [32],
|
16926
16838
|
"setFocus": [64]
|
16927
16839
|
},
|
@@ -16997,7 +16909,7 @@ class Theme {
|
|
16997
16909
|
}
|
16998
16910
|
render() {
|
16999
16911
|
const { themeClass } = this;
|
17000
|
-
return (hAsync(Host, { key: '
|
16912
|
+
return (hAsync(Host, { key: 'e353f7e1a95badecf478559b39cb0ecc20bd4c75', class: themeClass }, hAsync("slot", { key: '727a7e7a3240118efbc8b00dea9ff51f80a94878' })));
|
17001
16913
|
}
|
17002
16914
|
static get watchers() { return {
|
17003
16915
|
"brandColor": ["watchBrandColorPropHandler"],
|
@@ -17222,13 +17134,13 @@ class Toast {
|
|
17222
17134
|
}
|
17223
17135
|
render() {
|
17224
17136
|
const { variant, heading, message, visible, isManual, dismissButtonAriaLabel, } = this;
|
17225
|
-
return (hAsync(Host, { key: '
|
17137
|
+
return (hAsync(Host, { key: '07c2077a8b872900f4adc9943829b3fdc58d0910', class: { ["ic-toast-hidden"]: !visible }, tabindex: "0", onFocus: this.onFocus, onBlur: this.onBlur, role: isManual ? "dialog" : "alert", "aria-live": isManual ? null : "polite" }, hAsync("div", { key: 'd58b7d50131a67dadcaf03c85d1724bd57a522e3', class: "container" }, variant && visible && (hAsync("div", { key: '15c75b6bdc7a3d3fb0c31a3e9cdfd05d5f47d969', class: "toast-icon-container" }, hAsync("div", { key: 'e850996cd9d5f6d9a921dd56878bbec7d6d7c417', class: {
|
17226
17138
|
["divider"]: true,
|
17227
17139
|
[`divider-${variant}`]: true,
|
17228
|
-
} }), variant === "neutral" ? (hAsync("slot", { name: "neutral-icon" })) : (hAsync("span", { class: "toast-icon", innerHTML: VARIANT_ICONS[variant].icon })))), hAsync("div", { key: '
|
17140
|
+
} }), variant === "neutral" ? (hAsync("slot", { name: "neutral-icon" })) : (hAsync("span", { class: "toast-icon", innerHTML: VARIANT_ICONS[variant].icon })))), hAsync("div", { key: '3ba943e248e9492209bd89144c2baebc82a2c1f9', class: {
|
17229
17141
|
["toast-content"]: true,
|
17230
17142
|
["no-icon"]: variant === "neutral" && !isSlotUsed(this.el, "neutral-icon"),
|
17231
|
-
} }, hAsync("div", { key: '
|
17143
|
+
} }, hAsync("div", { key: 'e66852571c15ca60983bae3ee886fcf08b762276', class: "toast-text" }, hAsync("ic-typography", { key: '3ca4cdb553d651db0642a2ed788789cf843bcb68', variant: "subtitle-large", class: "toast-heading" }, visible && (isManual ? hAsync("h5", null, heading) : hAsync("p", null, heading))), message && (hAsync("ic-typography", { key: 'a5044b7a0916d2a1fb0f79bd747ffaf7b54b64f2', variant: "body", class: "toast-message" }, visible && hAsync("p", { key: '48e15b146bfbb18208f70998cf6df1c8c5758deb' }, message)))), isSlotUsed(this.el, "action") && (hAsync("div", { key: '010fac8238b54e19783d164bb5fac2a4ead5cb54', class: "toast-action-container" }, hAsync("slot", { key: '770796e85017801b9f48b1762392bac5c4ee11e5', name: "action" })))), !isManual ? (hAsync("ic-loading-indicator", { class: "toast-dismiss-timer", theme: "dark", monochrome: true, size: "icon", progress: this.timerProgress, description: "Dismiss timer" })) : (hAsync("ic-button", { id: "dismiss-button", innerHTML: closeIcon, onClick: this.dismissAction, variant: "icon", "aria-label": dismissButtonAriaLabel })))));
|
17232
17144
|
}
|
17233
17145
|
get el() { return getElement(this); }
|
17234
17146
|
static get watchers() { return {
|
@@ -17300,7 +17212,7 @@ class ToastRegion {
|
|
17300
17212
|
}
|
17301
17213
|
}
|
17302
17214
|
render() {
|
17303
|
-
return hAsync("slot", { key: '
|
17215
|
+
return hAsync("slot", { key: '3ff4dd455989c1922414e4d4ed83d9b5472736bf' });
|
17304
17216
|
}
|
17305
17217
|
get el() { return getElement(this); }
|
17306
17218
|
static get watchers() { return {
|
@@ -17318,9 +17230,19 @@ class ToastRegion {
|
|
17318
17230
|
}; }
|
17319
17231
|
}
|
17320
17232
|
|
17321
|
-
const icToggleButtonCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{--toggle-button-border:var(--ic-toggle-button-unselected-border);--toggle-button-text-colour:var(--ic-toggle-button-unselected-text);--toggle-button-border-hover:var(--ic-toggle-button-unselected-border-hover);--toggle-button-text-colour-hover:var(\n --ic-toggle-button-unselected-text-hover\n );--toggle-button-border-active:var(\n --ic-toggle-button-unselected-border-pressed\n );--toggle-button-text-colour-active:var(\n --ic-toggle-button-unselected-text-pressed\n )}:host(.ic-toggle-button-checked){--toggle-button-border:var(--ic-toggle-button-selected-border);--toggle-button-text-colour:var(--ic-toggle-button-selected-text);--toggle-button-border-hover:var(--ic-toggle-button-selected-border-hover);--toggle-button-text-colour-hover:var(--ic-toggle-button-selected-text);--toggle-button-border-active:var(\n --ic-toggle-button-selected-border-pressed\n );--toggle-button-text-colour-active:var(--ic-toggle-button-selected-text)}:host(.ic-toggle-button-monochrome){--toggle-button-border:var(--ic-toggle-button-unselected-border-monochrome);--toggle-button-text-colour:var(\n --ic-toggle-button-unselected-text-monochrome\n );--toggle-button-border-hover:var(\n --ic-toggle-button-unselected-border-hover-monochrome\n );--toggle-button-text-colour-hover:var(\n --ic-toggle-button-unselected-text-monochrome\n );--toggle-button-border-active:var(\n --ic-toggle-button-unselected-border-pressed-monochrome\n );--toggle-button-text-colour-active:var(\n --ic-toggle-button-unselected-text-monochrome\n )}:host(.ic-toggle-button-monochrome.ic-toggle-button-checked){--toggle-button-border:var(--ic-toggle-button-selected-border-monochrome);--toggle-button-text-colour:var(--ic-toggle-button-selected-text-monochrome);--toggle-button-border-hover:var(\n --ic-toggle-button-selected-border-hover-monochrome\n );--toggle-button-text-colour-hover:var(\n --ic-toggle-button-selected-text-monochrome\n );--toggle-button-border-active:var(\n --ic-toggle-button-selected-border-pressed-monochrome\n );--toggle-button-text-colour-active:var(\n --ic-toggle-button-selected-text-monochrome\n )}:host(.ic-toggle-button-disabled){--toggle-button-border:var(--ic-toggle-button-unselected-border-disabled);--toggle-button-text-colour:var(--ic-toggle-button-unselected-text-disabled)}:host(.ic-toggle-button-disabled.ic-toggle-button-monochrome){--toggle-button-border:var(\n --ic-toggle-button-unselected-border-disabled-monochrome\n );--toggle-button-text-colour:var(\n --ic-toggle-button-unselected-text-disabled-monochrome\n )}:host(.ic-toggle-button-disabled.ic-toggle-button-checked){--toggle-button-border:var(--ic-toggle-button-selected-border-disabled);--toggle-button-text-colour:var(--ic-toggle-button-selected-text-disabled)}:host(.ic-toggle-button-disabled.ic-toggle-button-checked.ic-toggle-button-monochrome){--toggle-button-border:var(\n --ic-toggle-button-selected-border-disabled-monochrome\n );--toggle-button-text-colour:var(\n --ic-toggle-button-selected-text-disabled-monochrome\n )}:host(.expand-toggle-group-child) ::part(button){width:100%;min-height:inherit;white-space:inherit;height:inherit}:host ic-button{--icon-width:var(--ic-space-lg);--icon-height:var(--ic-space-lg)}:host(.expand-toggle-group-child) ic-button{min-width:100%;min-height:100%;white-space:normal;height:100%}:host(.expand-toggle-group-child) ::part(button):focus,:host(.expand-toggle-group-child.ic-toggle-button-checked) ::part(button):focus{box-shadow:inset 0 0 0 var(--ic-space-xxxs) var(--ic-action-default),\n var(--ic-border-focus)}:host(.expand-toggle-group-child.ic-toggle-button-light) ::part(button):focus,:host(.expand-toggle-group-child.ic-toggle-button-dark) ::part(button):focus{box-shadow:inset 0 0 0 var(--ic-space-xxxs) var(--ic-action-monochrome-dark),\n var(--ic-border-focus)}:host(:focus){z-index:1}:host ::part(button){border:var(--ic-border-width) solid var(--toggle-button-border);color:var(--toggle-button-text-colour)}:host ::part(button):hover{border:var(--ic-border-width) solid var(--toggle-button-border-hover);color:var(--toggle-button-text-colour-hover);background-color:var(--ic-toggle-button-unselected-background-hover)}:host ::part(button):active{border:var(--ic-border-width) solid var(--toggle-button-border-active);color:var(--toggle-button-text-colour-active);background-color:var(--ic-toggle-button-unselected-background-pressed)}:host(.ic-toggle-button-disabled) ::part(button){border:var(--ic-space-1px) dashed var(--toggle-button-border);color:var(--toggle-button-text-colour)}:host(.ic-toggle-button-checked) ::part(button){background-color:var(--ic-toggle-button-selected-background);box-shadow:inset 0 0 0 var(--ic-space-xxxs)\n var(--ic-toggle-button-selected-text)}:host(.ic-toggle-button-checked) ::part(button):focus{box-shadow:inset 0 0 0 var(--ic-space-xxxs)\n var(--ic-toggle-button-selected-border-focus),\n var(--ic-border-focus)}:host(.ic-toggle-button-checked) ::part(button):hover{background-color:var(--ic-toggle-button-selected-background-hover)}:host(.ic-toggle-button-checked) ::part(button):active,:host(.ic-toggle-button-icon.ic-toggle-button-checked) ::part(button):active{background-color:var(--ic-toggle-button-selected-background-pressed)}:host(.ic-toggle-button-monochrome) ::part(button):hover{background-color:var(\n --ic-toggle-button-unselected-background-hover-monochrome\n )}:host(.ic-toggle-button-monochrome) ::part(button):active{background-color:var(\n --ic-toggle-button-unselected-background-pressed-monochrome\n )}:host(.ic-toggle-button-monochrome.ic-toggle-button-checked) ::part(button){background-color:var(--ic-toggle-button-selected-background-monochrome)}:host(.ic-toggle-button-monochrome.ic-toggle-button-checked) ::part(button):hover{background-color:var(\n --ic-toggle-button-selected-background-hover-monochrome\n )}:host(.ic-toggle-button-monochrome.ic-toggle-button-checked) ::part(button):active,:host(.ic-toggle-button-icon.ic-toggle-button-monochrome.ic-toggle-button-checked) ::part(button):active{background-color:var(\n --ic-toggle-button-selected-background-pressed-monochrome\n )}:host(.ic-toggle-button-monochrome.ic-toggle-button-checked) ::part(button):focus{box-shadow:inset 0 0 0 var(--ic-space-xxxs)\n var(--ic-toggle-button-selected-text),\n var(--ic-border-focus)}:host(.ic-toggle-button-disabled.ic-toggle-button-checked) ::part(button),:host(.ic-toggle-button-icon.ic-toggle-button-disabled.ic-toggle-button-checked) ::part(button){background-color:transparent}:host(.ic-toggle-button-disabled.ic-toggle-button-checked) ::part(button),:host(.ic-toggle-button-icon.ic-toggle-button-disabled.ic-toggle-button-checked) ::part(button)::before{background-image:radial-gradient(\n var(--ic-toggle-button-selected-background-disabled) 95%,\n white 20%\n );background-repeat:no-repeat}:host(.ic-toggle-button-disabled.ic-toggle-button-checked.ic-toggle-button-monochrome) ::part(button),:host(.ic-toggle-button-icon.ic-toggle-button-disabled.ic-toggle-button-checked.ic-toggle-button-monochrome) ::part(button)::before{background-image:radial-gradient(\n var(--ic-toggle-button-selected-background-disabled-monochrome) 95%,\n white 20%\n );background-repeat:no-repeat}:host(.ic-toggle-button-icon) ::part(button){height:calc(var(--ic-space-xl) + var(--ic-space-xs));width:calc(var(--ic-space-xl) + var(--ic-space-xs))}:host(.ic-toggle-button-icon) ::part(button):active{background-color:var(--ic-action-default-bg-pressed)}:host(.ic-toggle-button-icon.ic-toggle-button-dark) ::part(button):active{background-color:var(--ic-action-dark-bg-pressed)}:host(.ic-toggle-button-icon.ic-toggle-button-light) ::part(button):active{background-color:var(--ic-action-light-bg-pressed)}:host(.ic-toggle-button-icon.ic-toggle-button-small) ::part(button){height:var(--ic-space-xl);width:var(--ic-space-xl)}:host(.ic-toggle-button-icon.ic-toggle-button-large) ::part(button){height:var(--ic-space-xxl);width:var(--ic-space-xxl)}:host(.ic-toggle-button-checked.ic-toggle-button-loading) ::part(button){--loading-button-background:var(\n --ic-toggle-button-selected-background-pressed\n );background-color:var(--ic-toggle-button-selected-background-pressed)}:host(.ic-toggle-button-loading) ::part(button){--loading-button-background:var(\n --ic-toggle-button-unselected-background-pressed\n );background-color:var(--ic-toggle-button-unselected-background-pressed)}:host(.ic-toggle-button-checked.ic-toggle-button-loading) ::part(ic-loading-container){--inner-color:var(--ic-toggle-button-loading-bar)}:host(.ic-toggle-button-loading) ::part(ic-loading-container){--inner-color:var(--ic-toggle-button-selected-loading-bar)}:host(.ic-toggle-button-checked.ic-toggle-button-loading.ic-toggle-button-monochrome) ::part(button){--loading-button-background:var(\n --ic-toggle-button-selected-background-pressed-monochrome\n );background-color:var(\n --ic-toggle-button-selected-background-pressed-monochrome\n )}:host(.ic-toggle-button-loading.ic-toggle-button-monochrome) ::part(button){--loading-button-background:var(\n --ic-toggle-button-unselected-background-pressed-monochrome\n );background-color:var(\n --ic-toggle-button-unselected-background-pressed-monochrome\n )}@media (forced-colors: active){:host(.ic-toggle-button-checked) ::part(button),:host(.ic-toggle-button-checked) ::part(button):hover{background-color:Highlight}:host(.ic-toggle-button-checked.ic-toggle-button-light) ::part(button),:host(.ic-toggle-button-checked.ic-toggle-button-light) ::part(button):hover{background-color:Highlight}:host(.ic-toggle-button-checked.ic-toggle-button-dark) ::part(button),:host(.ic-toggle-button-checked.ic-toggle-button-dark) ::part(button):hover{background-color:Highlight}:host(.ic-toggle-button-checked.ic-toggle-button-disabled) ::part(button){background-color:GrayText}:host(.ic-toggle-button-checked.ic-toggle-button-loading) ::part(button),:host(.ic-toggle-button-checked.ic-toggle-button-loading) ::part(button):hover{--loading-button-background:Highlight}}";
|
17233
|
+
const icToggleButtonCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{--toggle-button-border:var(--ic-toggle-button-unselected-border);--toggle-button-text-colour:var(--ic-toggle-button-unselected-text);--toggle-button-border-hover:var(--ic-toggle-button-unselected-border-hover);--toggle-button-text-colour-hover:var(\n --ic-toggle-button-unselected-text-hover\n );--toggle-button-border-active:var(\n --ic-toggle-button-unselected-border-pressed\n );--toggle-button-text-colour-active:var(\n --ic-toggle-button-unselected-text-pressed\n )}:host(:not(.expand-toggle-group-child)){display:inline-block;border-radius:var(--ic-border-radius);border:var(--ic-border-width) solid var(--toggle-button-border)}:host(.ic-toggle-button-full-width:not(.expand-toggle-group-child)){width:100%}:host(.ic-toggle-button-checked){--toggle-button-border:var(--ic-toggle-button-selected-border);--toggle-button-text-colour:var(--ic-toggle-button-selected-text);--toggle-button-border-hover:var(--ic-toggle-button-selected-border-hover);--toggle-button-text-colour-hover:var(--ic-toggle-button-selected-text);--toggle-button-border-active:var(\n --ic-toggle-button-selected-border-pressed\n );--toggle-button-text-colour-active:var(--ic-toggle-button-selected-text)}:host(.ic-toggle-button-monochrome){--toggle-button-border:var(--ic-toggle-button-unselected-border-monochrome);--toggle-button-text-colour:var(\n --ic-toggle-button-unselected-text-monochrome\n );--toggle-button-border-hover:var(\n --ic-toggle-button-unselected-border-hover-monochrome\n );--toggle-button-text-colour-hover:var(\n --ic-toggle-button-unselected-text-monochrome\n );--toggle-button-border-active:var(\n --ic-toggle-button-unselected-border-pressed-monochrome\n );--toggle-button-text-colour-active:var(\n --ic-toggle-button-unselected-text-monochrome\n )}:host(.ic-toggle-button-monochrome.ic-toggle-button-checked){--toggle-button-border:var(--ic-toggle-button-selected-border-monochrome);--toggle-button-text-colour:var(--ic-toggle-button-selected-text-monochrome);--toggle-button-border-hover:var(\n --ic-toggle-button-selected-border-hover-monochrome\n );--toggle-button-text-colour-hover:var(\n --ic-toggle-button-selected-text-monochrome\n );--toggle-button-border-active:var(\n --ic-toggle-button-selected-border-pressed-monochrome\n );--toggle-button-text-colour-active:var(\n --ic-toggle-button-selected-text-monochrome\n )}:host(.ic-toggle-button-disabled){--toggle-button-border:var(--ic-toggle-button-unselected-border-disabled);--toggle-button-text-colour:var(--ic-toggle-button-unselected-text-disabled)}:host(.ic-toggle-button-disabled.ic-toggle-button-monochrome){--toggle-button-border:var(\n --ic-toggle-button-unselected-border-disabled-monochrome\n );--toggle-button-text-colour:var(\n --ic-toggle-button-unselected-text-disabled-monochrome\n )}:host(.ic-toggle-button-disabled.ic-toggle-button-checked){--toggle-button-border:var(--ic-toggle-button-selected-border-disabled);--toggle-button-text-colour:var(--ic-toggle-button-selected-text-disabled)}:host(.ic-toggle-button-disabled.ic-toggle-button-checked.ic-toggle-button-monochrome){--toggle-button-border:var(\n --ic-toggle-button-selected-border-disabled-monochrome\n );--toggle-button-text-colour:var(\n --ic-toggle-button-selected-text-disabled-monochrome\n )}:host(.expand-toggle-group-child) ::part(button){width:100%}:host(.expand-toggle-group-child:not(.ic-toggle-button-loading)) ::part(button){min-height:inherit;height:auto}:host ic-button{--icon-width:var(--ic-space-lg);--icon-height:var(--ic-space-lg)}:host(.expand-toggle-group-child) ic-button{min-width:100%;min-height:100%;height:100%}:host(.expand-toggle-group-child) ::part(button):focus,:host(.expand-toggle-group-child.ic-toggle-button-checked) ::part(button):focus{box-shadow:inset 0 0 0 var(--ic-space-xxxs) var(--ic-action-default),\n var(--ic-border-focus)}:host(.expand-toggle-group-child.ic-toggle-button-light) ::part(button):focus,:host(.expand-toggle-group-child.ic-toggle-button-dark) ::part(button):focus{box-shadow:inset 0 0 0 var(--ic-space-xxxs) var(--ic-action-monochrome-dark),\n var(--ic-border-focus)}:host(:focus){z-index:1}:host ::part(button){border:none;color:var(--toggle-button-text-colour)}:host ::part(button):hover{color:var(--toggle-button-text-colour-hover);background-color:var(--ic-toggle-button-unselected-background-hover)}:host ::part(button):active{color:var(--toggle-button-text-colour-active);background-color:var(--ic-toggle-button-unselected-background-pressed)}:host ::part(button):focus{border:var(--ic-border-width) solid var(--toggle-button-border)}:host ::part(button):hover:focus{border:var(--ic-border-width) solid var(--toggle-button-border-hover)}:host ::part(button):active:focus{border:var(--ic-border-width) solid var(--toggle-button-border-active)}:host(.ic-toggle-button-disabled) ::part(button){color:var(--toggle-button-text-colour)}:host(:not(.expand-toggle-group-child)):has(ic-button:hover){border:var(--ic-border-width) solid var(--toggle-button-border-hover)}:host(:not(.expand-toggle-group-child)):has(ic-button:active){border:var(--ic-border-width) solid var(--toggle-button-border-active)}:host(:not(.expand-toggle-group-child).ic-toggle-button-disabled){border:var(--ic-border-width) dashed var(--toggle-button-border)}:host(.ic-toggle-button-checked) ::part(button){background-color:var(--ic-toggle-button-selected-background);box-shadow:inset 0 0 0 var(--ic-space-xxxs)\n var(--ic-toggle-button-selected-text)}:host(.ic-toggle-button-checked) ::part(button):focus{box-shadow:inset 0 0 0 var(--ic-space-xxxs)\n var(--ic-toggle-button-selected-border-focus),\n var(--ic-border-focus)}:host(.ic-toggle-button-checked) ::part(button):hover{background-color:var(--ic-toggle-button-selected-background-hover)}:host(.ic-toggle-button-checked) ::part(button):active,:host(.ic-toggle-button-icon.ic-toggle-button-checked) ::part(button):active{background-color:var(--ic-toggle-button-selected-background-pressed)}:host(.ic-toggle-button-monochrome) ::part(button):hover{background-color:var(\n --ic-toggle-button-unselected-background-hover-monochrome\n )}:host(.ic-toggle-button-monochrome) ::part(button):active{background-color:var(\n --ic-toggle-button-unselected-background-pressed-monochrome\n )}:host(.ic-toggle-button-monochrome.ic-toggle-button-checked) ::part(button){background-color:var(--ic-toggle-button-selected-background-monochrome)}:host(.ic-toggle-button-monochrome.ic-toggle-button-checked) ::part(button):hover{background-color:var(\n --ic-toggle-button-selected-background-hover-monochrome\n )}:host(.ic-toggle-button-monochrome.ic-toggle-button-checked) ::part(button):active,:host(.ic-toggle-button-icon.ic-toggle-button-monochrome.ic-toggle-button-checked) ::part(button):active{background-color:var(\n --ic-toggle-button-selected-background-pressed-monochrome\n )}:host(.ic-toggle-button-monochrome.ic-toggle-button-checked) ::part(button):focus{box-shadow:inset 0 0 0 var(--ic-space-xxxs)\n var(--ic-toggle-button-selected-text),\n var(--ic-border-focus)}:host(.ic-toggle-button-disabled.ic-toggle-button-checked) ::part(button),:host(.ic-toggle-button-icon.ic-toggle-button-disabled.ic-toggle-button-checked) ::part(button){background-color:transparent}:host(.ic-toggle-button-disabled.ic-toggle-button-checked) ::part(button),:host(.ic-toggle-button-icon.ic-toggle-button-disabled.ic-toggle-button-checked) ::part(button)::before{background-image:radial-gradient(\n var(--ic-toggle-button-selected-background-disabled) 95%,\n white 20%\n );background-repeat:no-repeat}:host(.ic-toggle-button-disabled.ic-toggle-button-checked.ic-toggle-button-monochrome) ::part(button),:host(.ic-toggle-button-icon.ic-toggle-button-disabled.ic-toggle-button-checked.ic-toggle-button-monochrome) ::part(button)::before{background-image:radial-gradient(\n var(--ic-toggle-button-selected-background-disabled-monochrome) 95%,\n white 20%\n );background-repeat:no-repeat}:host(.ic-toggle-button-icon) ::part(button){height:calc(var(--ic-space-xl) + var(--ic-space-xs));width:calc(var(--ic-space-xl) + var(--ic-space-xs))}:host(.ic-toggle-button-icon) ::part(button):active{background-color:var(--ic-action-default-bg-pressed)}:host(.ic-toggle-button-icon.ic-toggle-button-dark) ::part(button):active{background-color:var(--ic-action-dark-bg-pressed)}:host(.ic-toggle-button-icon.ic-toggle-button-light) ::part(button):active{background-color:var(--ic-action-light-bg-pressed)}:host(.ic-toggle-button-icon.ic-toggle-button-small) ::part(button){height:var(--ic-space-xl);width:var(--ic-space-xl)}:host(.ic-toggle-button-icon.ic-toggle-button-large) ::part(button){height:var(--ic-space-xxl);width:var(--ic-space-xxl)}:host(.ic-toggle-button-checked.ic-toggle-button-loading) ::part(button){--loading-button-background:var(\n --ic-toggle-button-selected-background-pressed\n );background-color:var(--ic-toggle-button-selected-background-pressed)}:host(.ic-toggle-button-loading) ::part(button){--loading-button-background:var(\n --ic-toggle-button-unselected-background-pressed\n );background-color:var(--ic-toggle-button-unselected-background-pressed)}:host(.ic-toggle-button-checked.ic-toggle-button-loading) ::part(ic-loading-container){--inner-color:var(--ic-toggle-button-loading-bar)}:host(.ic-toggle-button-loading) ::part(ic-loading-container){--inner-color:var(--ic-toggle-button-selected-loading-bar)}:host(.ic-toggle-button-checked.ic-toggle-button-loading.ic-toggle-button-monochrome) ::part(button){--loading-button-background:var(\n --ic-toggle-button-selected-background-pressed-monochrome\n );background-color:var(\n --ic-toggle-button-selected-background-pressed-monochrome\n )}:host(.ic-toggle-button-loading.ic-toggle-button-monochrome) ::part(button){--loading-button-background:var(\n --ic-toggle-button-unselected-background-pressed-monochrome\n );background-color:var(\n --ic-toggle-button-unselected-background-pressed-monochrome\n )}@media (forced-colors: active){:host(.ic-toggle-button-checked) ::part(button),:host(.ic-toggle-button-checked) ::part(button):hover{background-color:Highlight}:host(.ic-toggle-button-checked.ic-toggle-button-light) ::part(button),:host(.ic-toggle-button-checked.ic-toggle-button-light) ::part(button):hover{background-color:Highlight}:host(.ic-toggle-button-checked.ic-toggle-button-dark) ::part(button),:host(.ic-toggle-button-checked.ic-toggle-button-dark) ::part(button):hover{background-color:Highlight}:host(.ic-toggle-button-checked.ic-toggle-button-disabled) ::part(button){background-color:GrayText}:host(.ic-toggle-button-checked.ic-toggle-button-loading) ::part(button),:host(.ic-toggle-button-checked.ic-toggle-button-loading) ::part(button):hover{--loading-button-background:Highlight}}";
|
17322
17234
|
var IcToggleButtonStyle0 = icToggleButtonCss;
|
17323
17235
|
|
17236
|
+
const TRACKED_ATTRIBUTES = [
|
17237
|
+
"loading",
|
17238
|
+
"disabled",
|
17239
|
+
"full-width",
|
17240
|
+
"icon-placement",
|
17241
|
+
"variant",
|
17242
|
+
"size",
|
17243
|
+
"theme",
|
17244
|
+
"monochrome",
|
17245
|
+
];
|
17324
17246
|
/**
|
17325
17247
|
* @slot icon - Content will be displayed alongside the toggle button label.
|
17326
17248
|
* @slot badge - Badge component overlaying the top right of the toggle button.
|
@@ -17369,72 +17291,58 @@ class ToggleButton {
|
|
17369
17291
|
* The variant of the toggle button.
|
17370
17292
|
*/
|
17371
17293
|
this.variant = "default";
|
17372
|
-
this.loopAttributes = () => {
|
17373
|
-
var _a;
|
17374
|
-
const trackedAttributes = [
|
17375
|
-
"loading",
|
17376
|
-
"disabled",
|
17377
|
-
"full-width",
|
17378
|
-
"icon-placement",
|
17379
|
-
"variant",
|
17380
|
-
"size",
|
17381
|
-
"theme",
|
17382
|
-
"monochrome",
|
17383
|
-
];
|
17384
|
-
const parentAttributes = (_a = this.el.parentElement) === null || _a === void 0 ? void 0 : _a.attributes;
|
17385
|
-
for (let i = 0; i < trackedAttributes.length; i++) {
|
17386
|
-
if (parentAttributes &&
|
17387
|
-
parentAttributes.getNamedItem(trackedAttributes[i]) !== null) {
|
17388
|
-
const attribute = parentAttributes.getNamedItem(trackedAttributes[i]);
|
17389
|
-
if (attribute) {
|
17390
|
-
switch (attribute.name) {
|
17391
|
-
case trackedAttributes[0]:
|
17392
|
-
this.loading = attribute.value !== "false";
|
17393
|
-
break;
|
17394
|
-
case trackedAttributes[1]:
|
17395
|
-
this.disabled = attribute.value !== "false";
|
17396
|
-
break;
|
17397
|
-
case trackedAttributes[2]:
|
17398
|
-
this.fullWidth = attribute.value !== "false";
|
17399
|
-
break;
|
17400
|
-
case trackedAttributes[3]:
|
17401
|
-
this.iconPlacement = attribute.value;
|
17402
|
-
break;
|
17403
|
-
case trackedAttributes[4]:
|
17404
|
-
this.variant = attribute.value;
|
17405
|
-
break;
|
17406
|
-
case trackedAttributes[5]:
|
17407
|
-
this.size = attribute.value;
|
17408
|
-
break;
|
17409
|
-
case trackedAttributes[6]:
|
17410
|
-
this.theme = attribute.value;
|
17411
|
-
break;
|
17412
|
-
case trackedAttributes[7]:
|
17413
|
-
this.monochrome = attribute.value !== "false";
|
17414
|
-
break;
|
17415
|
-
}
|
17416
|
-
}
|
17417
|
-
}
|
17418
|
-
}
|
17419
|
-
};
|
17420
17294
|
this.handleFocus = (ev) => {
|
17421
17295
|
ev.stopImmediatePropagation();
|
17422
17296
|
};
|
17423
17297
|
this.handleClick = () => {
|
17424
|
-
!this.loading &&
|
17425
|
-
!this.disabled &&
|
17298
|
+
if (!this.loading && !this.disabled) {
|
17426
17299
|
this.icToggleChecked.emit({
|
17427
17300
|
checked: this.checked,
|
17428
17301
|
});
|
17302
|
+
}
|
17429
17303
|
};
|
17430
17304
|
}
|
17431
17305
|
watchDisabledHandler() {
|
17432
17306
|
removeDisabledFalse(this.disabled, this.el);
|
17433
17307
|
}
|
17434
17308
|
componentWillLoad() {
|
17309
|
+
var _a;
|
17435
17310
|
removeDisabledFalse(this.disabled, this.el);
|
17436
|
-
if (isSlottedInGroup(this.el))
|
17437
|
-
|
17311
|
+
if (!isSlottedInGroup(this.el))
|
17312
|
+
return;
|
17313
|
+
const parentAttributes = (_a = this.el.parentElement) === null || _a === void 0 ? void 0 : _a.attributes;
|
17314
|
+
if (!parentAttributes)
|
17315
|
+
return;
|
17316
|
+
for (let i = 0; i < TRACKED_ATTRIBUTES.length; i++) {
|
17317
|
+
const attribute = parentAttributes.getNamedItem(TRACKED_ATTRIBUTES[i]);
|
17318
|
+
if (!attribute)
|
17319
|
+
continue;
|
17320
|
+
switch (attribute.name) {
|
17321
|
+
case TRACKED_ATTRIBUTES[0]:
|
17322
|
+
this.loading = attribute.value !== "false";
|
17323
|
+
break;
|
17324
|
+
case TRACKED_ATTRIBUTES[1]:
|
17325
|
+
this.disabled = attribute.value !== "false";
|
17326
|
+
break;
|
17327
|
+
case TRACKED_ATTRIBUTES[2]:
|
17328
|
+
this.fullWidth = attribute.value !== "false";
|
17329
|
+
break;
|
17330
|
+
case TRACKED_ATTRIBUTES[3]:
|
17331
|
+
this.iconPlacement = attribute.value;
|
17332
|
+
break;
|
17333
|
+
case TRACKED_ATTRIBUTES[4]:
|
17334
|
+
this.variant = attribute.value;
|
17335
|
+
break;
|
17336
|
+
case TRACKED_ATTRIBUTES[5]:
|
17337
|
+
this.size = attribute.value;
|
17338
|
+
break;
|
17339
|
+
case TRACKED_ATTRIBUTES[6]:
|
17340
|
+
this.theme = attribute.value;
|
17341
|
+
break;
|
17342
|
+
case TRACKED_ATTRIBUTES[7]:
|
17343
|
+
this.monochrome = attribute.value !== "false";
|
17344
|
+
break;
|
17345
|
+
}
|
17438
17346
|
}
|
17439
17347
|
}
|
17440
17348
|
componentDidLoad() {
|
@@ -17454,16 +17362,18 @@ class ToggleButton {
|
|
17454
17362
|
}
|
17455
17363
|
}
|
17456
17364
|
render() {
|
17457
|
-
|
17458
|
-
|
17459
|
-
|
17460
|
-
|
17461
|
-
|
17462
|
-
|
17463
|
-
|
17464
|
-
|
17465
|
-
|
17466
|
-
|
17365
|
+
const { accessibleLabel, checked, disabled, fullWidth, iconPlacement, monochrome, label, loading, size, theme, tooltipPlacement, variant, } = this;
|
17366
|
+
const iconVariant = variant === "icon";
|
17367
|
+
return (hAsync(Host, { key: 'e34299dc13ff4f36657b4fea7c88d5d478fa85c1', class: {
|
17368
|
+
"ic-toggle-button-checked": checked,
|
17369
|
+
"ic-toggle-button-disabled": disabled,
|
17370
|
+
"ic-toggle-button-icon": iconVariant,
|
17371
|
+
"ic-toggle-button-loading": loading,
|
17372
|
+
"ic-toggle-button-monochrome": monochrome,
|
17373
|
+
"ic-toggle-button-full-width": fullWidth,
|
17374
|
+
[`ic-toggle-button-${size}`]: true,
|
17375
|
+
[`ic-theme-${theme}`]: theme !== "inherit",
|
17376
|
+
}, onFocus: this.handleFocus }, hAsync("ic-button", { key: '9f6f52717db592139175316c88a781eaa98adb65', "aria-pressed": `${checked}`, variant: iconVariant ? "icon" : "secondary", onClick: this.handleClick, title: accessibleLabel, "aria-label": `${accessibleLabel ? accessibleLabel : label}, ${checked ? "ticked" : "unticked"}`, disabled: disabled, size: size, fullWidth: fullWidth, loading: loading, tooltipPlacement: tooltipPlacement }, !iconVariant && label, hAsync("slot", { key: 'c180d619e44820ba7a0f597070f0cea2d26a4830' }), isSlotUsed(this.el, "icon") && (hAsync("slot", { key: 'b2a2545a6b0ed44a7911da313306ed6de84c7862', name: "icon", slot: `${iconPlacement}-icon` })), isSlotUsed(this.el, "badge") && (hAsync("slot", { key: 'c7de6d7eb51d0f444ede14995f708ffcd42174a1', name: "badge", slot: "badge" })))));
|
17467
17377
|
}
|
17468
17378
|
static get delegatesFocus() { return true; }
|
17469
17379
|
get el() { return getElement(this); }
|
@@ -17556,52 +17466,43 @@ class ToggleButtonGroup {
|
|
17556
17466
|
shift: ev.shiftKey,
|
17557
17467
|
};
|
17558
17468
|
};
|
17559
|
-
this.
|
17560
|
-
var _a
|
17561
|
-
|
17562
|
-
|
17563
|
-
|
17564
|
-
|
17565
|
-
|
17566
|
-
|
17567
|
-
|
17568
|
-
if (
|
17569
|
-
|
17570
|
-
|
17571
|
-
|
17572
|
-
|
17573
|
-
const toggleButtons = Array.from(el.querySelectorAll("ic-toggle-button"));
|
17574
|
-
if (((toggleButtons.every((el) => !el.checked) ||
|
17575
|
-
this.selectType !== "single") &&
|
17576
|
-
this.lastKeyPressed.shift === false) ||
|
17577
|
-
(toggleButtons.every((el) => !el.checked) &&
|
17578
|
-
this.lastKeyPressed.shift === true &&
|
17579
|
-
relEl.tagName == TOGGLE_GROUP)) {
|
17580
|
-
toggleButtons[0].focus();
|
17581
|
-
}
|
17582
|
-
else if (this.lastKeyPressed.shift === false ||
|
17583
|
-
(this.lastKeyPressed.shift === true && relEl.tagName == TOGGLE_GROUP)) {
|
17469
|
+
this.handleHostFocus = ({ target, relatedTarget }) => {
|
17470
|
+
var _a;
|
17471
|
+
if (this.loading || this.disabled)
|
17472
|
+
return;
|
17473
|
+
const el = target;
|
17474
|
+
const relEl = relatedTarget;
|
17475
|
+
const toggleButtons = Array.from((el === null || el === void 0 ? void 0 : el.querySelectorAll("ic-toggle-button")) || []);
|
17476
|
+
const noToggleButtonsChecked = toggleButtons.every((el) => !el.checked);
|
17477
|
+
const { shift } = this.lastKeyPressed;
|
17478
|
+
if (((noToggleButtonsChecked || this.selectType !== "single") && !shift) ||
|
17479
|
+
(noToggleButtonsChecked && shift && (relEl === null || relEl === void 0 ? void 0 : relEl.tagName) == TOGGLE_GROUP)) {
|
17480
|
+
(_a = toggleButtons[0]) === null || _a === void 0 ? void 0 : _a.focus();
|
17481
|
+
}
|
17482
|
+
else if (!shift || (relEl === null || relEl === void 0 ? void 0 : relEl.tagName) == TOGGLE_GROUP) {
|
17584
17483
|
// if checked is true and selectMethod is "single", focus that toggle
|
17585
|
-
|
17586
|
-
toggledButton[0].focus();
|
17484
|
+
toggleButtons.filter((el) => el.checked)[0].focus();
|
17587
17485
|
}
|
17588
17486
|
};
|
17589
|
-
this.handleKeyDown = (
|
17487
|
+
this.handleKeyDown = ({ key }) => {
|
17488
|
+
if (key !== "ArrowDown" &&
|
17489
|
+
key !== "ArrowRight" &&
|
17490
|
+
key !== "ArrowLeft" &&
|
17491
|
+
key !== "ArrowUp")
|
17492
|
+
return;
|
17590
17493
|
const toggleButtonOptions = this.getAllToggleButtons();
|
17591
|
-
const
|
17592
|
-
|
17593
|
-
|
17594
|
-
|
17595
|
-
|
17596
|
-
|
17597
|
-
:
|
17598
|
-
|
17599
|
-
|
17600
|
-
|
17601
|
-
|
17602
|
-
|
17603
|
-
: toggleButtonOptions[this.getNextItemToSelect(focussedChild, false)].focus();
|
17604
|
-
break;
|
17494
|
+
const targetToggle = toggleButtonOptions[this.getNextItemToSelect(toggleButtonOptions.indexOf(toggleButtonOptions.filter((el) => el === document.activeElement)[0]), key === "ArrowDown" || key === "ArrowRight")];
|
17495
|
+
if (this.selectMethod === "auto") {
|
17496
|
+
// trigger selectHandler when unable to add 'target'
|
17497
|
+
targetToggle.checked = true;
|
17498
|
+
this.selectHandler(new CustomEvent("icToggleChecked", {
|
17499
|
+
detail: {
|
17500
|
+
checked: targetToggle.checked,
|
17501
|
+
},
|
17502
|
+
}), targetToggle);
|
17503
|
+
}
|
17504
|
+
else {
|
17505
|
+
targetToggle.focus();
|
17605
17506
|
}
|
17606
17507
|
};
|
17607
17508
|
this.getNextItemToSelect = (currentItem, movingDown) => {
|
@@ -17622,6 +17523,7 @@ class ToggleButtonGroup {
|
|
17622
17523
|
}
|
17623
17524
|
return nextItem;
|
17624
17525
|
};
|
17526
|
+
this.getAllToggleButtons = () => Array.from(this.el.querySelectorAll("ic-toggle-button"));
|
17625
17527
|
}
|
17626
17528
|
watchDisabledHandler() {
|
17627
17529
|
this.getAllToggleButtons().forEach((el) => {
|
@@ -17667,8 +17569,8 @@ class ToggleButtonGroup {
|
|
17667
17569
|
selectHandler(ev, tabTarget) {
|
17668
17570
|
const allToggles = this.getAllToggleButtons();
|
17669
17571
|
let clickedToggle = ev.target;
|
17670
|
-
|
17671
|
-
|
17572
|
+
if (tabTarget)
|
17573
|
+
tabTarget.focus(); // tabTarget used in proxySelectHandler
|
17672
17574
|
if (this.selectType === "single") {
|
17673
17575
|
if (!clickedToggle && tabTarget) {
|
17674
17576
|
clickedToggle = tabTarget;
|
@@ -17684,7 +17586,7 @@ class ToggleButtonGroup {
|
|
17684
17586
|
});
|
17685
17587
|
}
|
17686
17588
|
else {
|
17687
|
-
const toggledOptions =
|
17589
|
+
const toggledOptions = allToggles.filter((el) => el.checked && !el.disabled);
|
17688
17590
|
this.icChange.emit({
|
17689
17591
|
checked: toggledOptions.map((opt) => opt.checked),
|
17690
17592
|
toggledOptions: toggledOptions.map((opt) => ({
|
@@ -17695,13 +17597,20 @@ class ToggleButtonGroup {
|
|
17695
17597
|
}
|
17696
17598
|
}
|
17697
17599
|
componentWillLoad() {
|
17698
|
-
this.selectType === "multi"
|
17600
|
+
if (this.selectType === "multi")
|
17601
|
+
this.selectMethod = "manual";
|
17699
17602
|
document.addEventListener("keydown", this.keyListener);
|
17700
17603
|
removeDisabledFalse(this.disabled, this.el);
|
17701
17604
|
}
|
17702
17605
|
componentDidLoad() {
|
17703
17606
|
this.getAllToggleButtons().forEach((el, i) => {
|
17704
|
-
|
17607
|
+
var _a, _b, _c;
|
17608
|
+
const btn = (_c = (_b = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("ic-button")) === null || _b === void 0 ? void 0 : _b.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector("button");
|
17609
|
+
if (btn) {
|
17610
|
+
const btnAriaLabel = btn.getAttribute("aria-label");
|
17611
|
+
const aria = btnAriaLabel ? `${btnAriaLabel}, ` : "";
|
17612
|
+
btn.setAttribute("aria-label", `${aria}${this.accessibleLabel}`);
|
17613
|
+
}
|
17705
17614
|
el.id = i.toString();
|
17706
17615
|
el.tabIndex = -1;
|
17707
17616
|
el.addEventListener("keydown", (ev) => {
|
@@ -17713,28 +17622,15 @@ class ToggleButtonGroup {
|
|
17713
17622
|
disconnectedCallback() {
|
17714
17623
|
document === null || document === void 0 ? void 0 : document.removeEventListener("keydown", this.keyListener);
|
17715
17624
|
}
|
17716
|
-
// trigger selectHandler when unable to add 'target'
|
17717
|
-
proxySelectHandler(toggle) {
|
17718
|
-
toggle.checked = true;
|
17719
|
-
const customEv = new CustomEvent("icToggleChecked", {
|
17720
|
-
detail: {
|
17721
|
-
checked: toggle.checked,
|
17722
|
-
},
|
17723
|
-
});
|
17724
|
-
this.selectHandler(customEv, toggle);
|
17725
|
-
}
|
17726
|
-
getAllToggleButtons() {
|
17727
|
-
return Array.from(this.el.querySelectorAll("ic-toggle-button"));
|
17728
|
-
}
|
17729
17625
|
render() {
|
17730
|
-
|
17731
|
-
|
17732
|
-
|
17733
|
-
|
17734
|
-
|
17735
|
-
|
17736
|
-
[`ic-theme-${
|
17737
|
-
}, onFocus: this.handleHostFocus }, hAsync("slot", { key: '
|
17626
|
+
const { accessibleLabel, disabled, fullWidth, loading, monochrome, theme } = this;
|
17627
|
+
return (hAsync(Host, { key: '91a65da59d67e885a34b5d8c9390f6f419342125', role: "group", "aria-label": accessibleLabel, tabindex: 0, class: {
|
17628
|
+
"ic-toggle-button-group-disabled": disabled,
|
17629
|
+
"ic-toggle-button-group-full-width": fullWidth,
|
17630
|
+
"ic-toggle-button-group-loading": loading,
|
17631
|
+
"ic-toggle-button-group-monochrome": monochrome,
|
17632
|
+
[`ic-theme-${theme}`]: theme !== "inherit",
|
17633
|
+
}, onFocus: this.handleHostFocus }, hAsync("slot", { key: 'bbf0f773b7978915b5421b1962a3391323ee1d3a' })));
|
17738
17634
|
}
|
17739
17635
|
get el() { return getElement(this); }
|
17740
17636
|
static get watchers() { return {
|
@@ -18021,10 +17917,10 @@ class Tooltip {
|
|
18021
17917
|
}
|
18022
17918
|
render() {
|
18023
17919
|
const { label, maxLines, silent, theme } = this;
|
18024
|
-
return (hAsync(Host, { key: '
|
17920
|
+
return (hAsync(Host, { key: '696bf93eebae2c0b15e7762e3393f4c34f3cc4d1', class: {
|
18025
17921
|
"ic-tooltip": true,
|
18026
17922
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
18027
|
-
} }, hAsync("div", { key: '
|
17923
|
+
} }, hAsync("div", { key: '8c5d0e10b0b315464654cac448968ceb38828402', ref: (el) => (this.toolTip = el), role: "tooltip", class: "ic-tooltip-container", "aria-hidden": `${silent}` }, hAsync("ic-typography", { key: '1aa6160a3f9210484fdc525d94cc89830dfe9495', maxLines: maxLines, variant: "caption" }, label), hAsync("div", { key: 'ff3d41306c750c1eefac6697886710eba0b1e1ff', ref: (el) => (this.arrow = el), class: "ic-tooltip-arrow" })), hAsync("slot", { key: '0f57e33dc10713e5549184d5fd22f2965528a827' })));
|
18028
17924
|
}
|
18029
17925
|
get el() { return getElement(this); }
|
18030
17926
|
static get watchers() { return {
|
@@ -18127,22 +18023,43 @@ class TopNavigation {
|
|
18127
18023
|
this.hasSearchSlotContent = isSlotUsed(this.el, "search");
|
18128
18024
|
};
|
18129
18025
|
this.initialiseSearchBar = () => {
|
18130
|
-
if (this.hasSearchSlotContent)
|
18131
|
-
|
18132
|
-
|
18133
|
-
|
18134
|
-
|
18135
|
-
|
18136
|
-
|
18137
|
-
|
18138
|
-
|
18139
|
-
|
18140
|
-
|
18026
|
+
if (!this.hasSearchSlotContent)
|
18027
|
+
return;
|
18028
|
+
const slot = getSlot(this.el, "search");
|
18029
|
+
if ((slot === null || slot === void 0 ? void 0 : slot.tagName) === "IC-SEARCH-BAR") {
|
18030
|
+
this.searchBar = slot;
|
18031
|
+
}
|
18032
|
+
else if ((slot === null || slot === void 0 ? void 0 : slot.tagName) === "FORM") {
|
18033
|
+
this.searchBar = slot.querySelector("ic-search-bar");
|
18034
|
+
}
|
18035
|
+
if (this.searchBar !== null) {
|
18036
|
+
this.searchBar.hideLabel = true;
|
18037
|
+
}
|
18038
|
+
};
|
18039
|
+
this.toggleSearchBar = () => {
|
18040
|
+
var _a;
|
18041
|
+
this.mobileSearchBarVisible = !this.mobileSearchBarVisible;
|
18042
|
+
if (!this.searchBar)
|
18043
|
+
return;
|
18044
|
+
(_a = this.mobileSearchButtonEl) === null || _a === void 0 ? void 0 : _a.setAttribute("aria-label", `${this.mobileSearchBarVisible ? "Hide" : "Show"} search`);
|
18045
|
+
this.hasFullWidthSearchBar = this.mobileSearchBarVisible;
|
18046
|
+
this.searchBar.fullWidth = this.mobileSearchBarVisible;
|
18047
|
+
if (this.mobileSearchBarVisible) {
|
18048
|
+
setTimeout(() => {
|
18049
|
+
var _a;
|
18050
|
+
(_a = this.searchBar) === null || _a === void 0 ? void 0 : _a.focus();
|
18051
|
+
}, 100);
|
18141
18052
|
}
|
18142
18053
|
};
|
18143
18054
|
this.menuButtonClick = () => {
|
18144
18055
|
this.showNavMenu(true);
|
18145
18056
|
};
|
18057
|
+
this.showNavMenu = (show) => {
|
18058
|
+
this.navMenuVisible = show;
|
18059
|
+
(show ? this.icNavigationMenuOpened : this.icNavigationMenuClosed).emit();
|
18060
|
+
document.body.style.height = show ? "100%" : "auto";
|
18061
|
+
document.body.style.overflow = show ? "hidden" : "auto";
|
18062
|
+
};
|
18146
18063
|
this.searchButtonMouseDownHandler = () => {
|
18147
18064
|
this.searchButtonClick = true;
|
18148
18065
|
};
|
@@ -18151,27 +18068,27 @@ class TopNavigation {
|
|
18151
18068
|
this.searchButtonClick = false;
|
18152
18069
|
};
|
18153
18070
|
this.resizeObserverCallback = (currSize) => {
|
18154
|
-
if (currSize
|
18155
|
-
|
18156
|
-
|
18157
|
-
|
18158
|
-
|
18159
|
-
|
18160
|
-
|
18161
|
-
}
|
18162
|
-
this.icTopNavResized.emit({
|
18163
|
-
size: currSize,
|
18164
|
-
});
|
18165
|
-
if (this.searchBar && document.activeElement === this.searchBar) {
|
18166
|
-
this.searchBar.setAttribute("hidden", "true");
|
18167
|
-
//remove attribute again as this trigger a redraw & applies css
|
18168
|
-
this.searchBar.removeAttribute("hidden");
|
18169
|
-
setTimeout(() => {
|
18170
|
-
var _a;
|
18171
|
-
(_a = this.searchBar) === null || _a === void 0 ? void 0 : _a.focus();
|
18172
|
-
}, 100);
|
18071
|
+
if (currSize === this.deviceSize)
|
18072
|
+
return;
|
18073
|
+
this.deviceSize = currSize;
|
18074
|
+
if (currSize > this.customMobileBreakpoint) {
|
18075
|
+
this.showNavMenu(false);
|
18076
|
+
if (this.mobileSearchBarVisible) {
|
18077
|
+
this.toggleSearchBar();
|
18173
18078
|
}
|
18174
18079
|
}
|
18080
|
+
this.icTopNavResized.emit({
|
18081
|
+
size: currSize,
|
18082
|
+
});
|
18083
|
+
if (this.searchBar && document.activeElement === this.searchBar) {
|
18084
|
+
this.searchBar.setAttribute("hidden", "true");
|
18085
|
+
//remove attribute again as this trigger a redraw & applies css
|
18086
|
+
this.searchBar.removeAttribute("hidden");
|
18087
|
+
setTimeout(() => {
|
18088
|
+
var _a;
|
18089
|
+
(_a = this.searchBar) === null || _a === void 0 ? void 0 : _a.focus();
|
18090
|
+
}, 100);
|
18091
|
+
}
|
18175
18092
|
};
|
18176
18093
|
this.runResizeObserver = () => {
|
18177
18094
|
this.resizeObserver = new ResizeObserver(() => {
|
@@ -18196,16 +18113,17 @@ class TopNavigation {
|
|
18196
18113
|
}
|
18197
18114
|
componentDidLoad() {
|
18198
18115
|
checkResizeObserver(this.runResizeObserver);
|
18199
|
-
!isSlotUsed(this.el, "app-title")
|
18116
|
+
if (!isSlotUsed(this.el, "app-title")) {
|
18200
18117
|
onComponentRequiredPropUndefined([{ prop: this.appTitle, propName: "app-title" }], "Top Navigation");
|
18118
|
+
}
|
18201
18119
|
}
|
18202
18120
|
componentWillRender() {
|
18203
18121
|
this.checkSlots();
|
18204
18122
|
}
|
18205
18123
|
navBarMenuCloseHandler() {
|
18206
|
-
var _a
|
18124
|
+
var _a;
|
18207
18125
|
this.showNavMenu(false);
|
18208
|
-
(
|
18126
|
+
(_a = this.menuButtonEl) === null || _a === void 0 ? void 0 : _a.setFocus();
|
18209
18127
|
}
|
18210
18128
|
searchInputBlurHandler({ detail, }) {
|
18211
18129
|
if (detail !== null) {
|
@@ -18222,58 +18140,38 @@ class TopNavigation {
|
|
18222
18140
|
brandChangeHandler({ detail }) {
|
18223
18141
|
this.foregroundColor = detail.mode;
|
18224
18142
|
}
|
18225
|
-
toggleSearchBar() {
|
18226
|
-
var _a;
|
18227
|
-
this.mobileSearchBarVisible = !this.mobileSearchBarVisible;
|
18228
|
-
if (this.searchBar !== null) {
|
18229
|
-
(_a = this.mobileSearchButtonEl) === null || _a === void 0 ? void 0 : _a.setAttribute("aria-label", `${this.mobileSearchBarVisible ? "Hide" : "Show"} search`);
|
18230
|
-
this.hasFullWidthSearchBar = this.mobileSearchBarVisible;
|
18231
|
-
this.searchBar.fullWidth = this.mobileSearchBarVisible;
|
18232
|
-
if (this.mobileSearchBarVisible) {
|
18233
|
-
setTimeout(() => {
|
18234
|
-
var _a;
|
18235
|
-
(_a = this.searchBar) === null || _a === void 0 ? void 0 : _a.focus();
|
18236
|
-
}, 100);
|
18237
|
-
}
|
18238
|
-
}
|
18239
|
-
}
|
18240
|
-
showNavMenu(show) {
|
18241
|
-
this.navMenuVisible = show;
|
18242
|
-
(show ? this.icNavigationMenuOpened : this.icNavigationMenuClosed).emit();
|
18243
|
-
document.body.style.height = show ? "100%" : "auto";
|
18244
|
-
document.body.style.overflow = show ? "hidden" : "auto";
|
18245
|
-
}
|
18246
18143
|
render() {
|
18247
18144
|
const { appTitle, contentAligned, customMobileBreakpoint, deviceSize, el, foregroundColor, hasAppIcon, hasFullWidthSearchBar, hasIconButtons, hasNavigation, hasSearchSlotContent, href, inline, menuButtonClick, mobileSearchBarVisible, navMenuVisible, searchButtonClickHandler, searchButtonMouseDownHandler, shortAppTitle, status, version, theme, } = this;
|
18248
18145
|
const hasStatus = status !== "";
|
18249
18146
|
const hasVersion = version !== "";
|
18250
18147
|
const hasMenuContent = hasNavigation || hasIconButtons || hasStatus || hasVersion;
|
18251
|
-
const
|
18148
|
+
const isSmallDeviceSize = deviceSize <= DEVICE_SIZES.S;
|
18149
|
+
const searchButtonSize = isSmallDeviceSize ? "medium" : "large";
|
18252
18150
|
const hasTitle = appTitle !== "" && isPropDefined(appTitle);
|
18253
18151
|
const overMobileBreakpoint = deviceSize <= customMobileBreakpoint;
|
18254
18152
|
const appTitleVariant = overMobileBreakpoint
|
18255
|
-
?
|
18153
|
+
? isSmallDeviceSize
|
18256
18154
|
? "subtitle-small"
|
18257
18155
|
: "h4"
|
18258
18156
|
: "h3";
|
18259
18157
|
const mobileSearchButtonTitle = `${mobileSearchBarVisible ? "Hide" : "Show"} search`;
|
18260
|
-
const menuSize =
|
18158
|
+
const menuSize = isSmallDeviceSize ? "small" : "medium";
|
18261
18159
|
const shortAppTitleSlot = isSlotUsed(el, "short-app-title");
|
18262
18160
|
const hasAppTitleSlot = isSlotUsed(el, "app-title");
|
18263
18161
|
const Component = hasAppTitleSlot ? "div" : "a";
|
18264
18162
|
const attrs = Component == "a" && {
|
18265
18163
|
href: href,
|
18266
18164
|
};
|
18267
|
-
return (hAsync(Host, { key: '
|
18165
|
+
return (hAsync(Host, { key: '109a8d5b8745b485182a193c3f4929a7b01db39a', class: {
|
18268
18166
|
"fullwidth-searchbar": hasFullWidthSearchBar,
|
18269
18167
|
"mobile-mode": overMobileBreakpoint,
|
18270
18168
|
[IcBrandForegroundEnum.Dark]: foregroundColor === IcBrandForegroundEnum.Dark,
|
18271
18169
|
[`ic-theme-${theme}`]: theme !== "inherit",
|
18272
|
-
} }, hAsync("div", { key: '
|
18170
|
+
} }, hAsync("div", { key: '4ed96db767e6c034003f84053651fe68396799c7', class: "top-navigation" }, hAsync("ic-section-container", { key: '44ac38abd7935fe8feed493a1f1550fccc3c5535', aligned: contentAligned, "full-height": true }, hAsync("header", { key: 'b5468dc9e39a3f45e857464179d3bb9f6ea15707', role: "banner" }, hAsync("div", { key: '856acd47849f1621f800385e630cd9d045535ef0', class: "top-panel-container" }, hAsync("div", { key: '0ac5b5c3313230a12f75b99531b6db5280f54729', class: "app-details-container" }, (hasTitle || hasAppTitleSlot) && (hAsync(Component, Object.assign({ key: 'c27a485d2d304ea74edd37e30dfc013c7f42d1f6', class: "title-link" }, attrs), hasAppIcon && (hAsync("div", { key: '18e1af273850b3174fdc3c2ac3b7cd1e51d27dc8', class: "app-icon-container" }, hAsync("slot", { key: '98ff1d08d3cd6a0332c42f8c08d2e04897da1014', name: "app-icon" }))), isSmallDeviceSize &&
|
18273
18171
|
(!isEmptyString(shortAppTitle) || shortAppTitleSlot) ? (hAsync("ic-typography", { variant: "subtitle-small", "aria-label": (!hasAppTitleSlot || !shortAppTitleSlot) &&
|
18274
|
-
`${appTitle} (${shortAppTitle})` }, hAsync("h1", null, shortAppTitleSlot ? (hAsync("slot", { name: "short-app-title" })) : (shortAppTitle)))) : (hAsync("ic-typography", { variant: appTitleVariant }, hAsync("h1", { class: "title-wrap" }, hasAppTitleSlot ? (hAsync("slot", { name: "app-title" })) : (appTitle)))))), hasStatus && (hAsync("div", { key: '
|
18275
|
-
|
18276
|
-
} }, hasIconButtons && (hAsync("div", { key: '
|
18172
|
+
`${appTitle} (${shortAppTitle})` }, hAsync("h1", null, shortAppTitleSlot ? (hAsync("slot", { name: "short-app-title" })) : (shortAppTitle)))) : (hAsync("ic-typography", { variant: appTitleVariant }, hAsync("h1", { class: "title-wrap" }, hasAppTitleSlot ? (hAsync("slot", { name: "app-title" })) : (appTitle)))))), hasStatus && (hAsync("div", { key: '6cb297d4f6942bb1a277c8ce7476e861d97c8443', class: "app-status" }, hAsync("ic-typography", { key: 'df12aa96dbce804e3bf0241f68a93b2027667f65', "aria-label": "app tag", variant: "label-uppercase", class: "app-status-text" }, status))), hasVersion && (hAsync("div", { key: '6312913ba6a1da16d992e225b1c2c81a9ef08e86', class: "app-version" }, hAsync("ic-typography", { key: 'e1885cd980327cac6254860daeb80e3bf3b71b71', variant: "label", class: "app-version-text", "aria-label": "app version" }, version)))), (hasSearchSlotContent || hasMenuContent) && (hAsync("div", { key: '227e6a17a7f8f353aac7c7fc684adef110387e12', class: "search-menu-container" }, hAsync("div", { key: 'c61983790f01a2f4cccde572ccae52d598f2ef8f', class: "search-actions-container" }, !overMobileBreakpoint ? (hAsync(Fragment, null, hAsync("slot", { name: "search" }), hasIconButtons && (hAsync("div", { class: "icon-buttons-container" }, hAsync("slot", { name: "buttons" }))))) : (hAsync(Fragment, null, hasSearchSlotContent && (hAsync("ic-button", { id: "search-toggle-button", ref: (el) => (this.mobileSearchButtonEl = el), onMouseDown: searchButtonMouseDownHandler, variant: "icon-tertiary", monochrome: true, size: searchButtonSize, "aria-label": mobileSearchButtonTitle, theme: foregroundColor, onClick: searchButtonClickHandler }, hAsync("slot", { name: "toggle-icon" }, hAsync("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "#ffffff" }, hAsync("path", { d: "M0 0h24v24H0V0z", fill: "none" }), hAsync("path", { d: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" }))))), hasMenuContent && (hAsync("div", { class: "menu-button-container" }, hAsync("span", { id: "navigation-landmark-button-text", class: "navigation-landmark-button-text", "aria-hidden": "true" }, "Main navigation button"), hAsync("nav", { "aria-labelledby": "navigation-landmark-button-text", "aria-hidden": `${navMenuVisible}` }, hAsync("ic-button", { id: "menu-button", ref: (el) => (this.menuButtonEl = el), theme: foregroundColor, variant: "secondary", monochrome: true, "aria-expanded": "false", "aria-haspopup": "true", "aria-label": `Open ${hasNavigation ? "navigation" : "app"} menu`, size: menuSize, onClick: menuButtonClick }, "Menu", hAsync("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#ffffff", slot: "left-icon" }, hAsync("path", { d: "M0 0h24v24H0V0z", fill: "none" }), hAsync("path", { d: "M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" })))))))))))), mobileSearchBarVisible && (hAsync("div", { key: '151189b97bf2f3d25a492b94d18abbcdf75fecfe', class: "search-bar-container" }, hAsync("slot", { key: 'e2cce191292a452cd262225cc37a7740a3062e27', name: "search" }))), hasNavigation && !overMobileBreakpoint && (hAsync("div", { key: '276e4e02593c11acf3b9d6d3e9fa180d1a931638', class: "navigation-tabs" }, hAsync("span", { key: '36300650d07526bc75fb99461c8749a12d08bfe1', id: "navigation-landmark-text", class: "navigation-landmark-text", "aria-hidden": "true" }, "Main pages"), hAsync("nav", { key: '0f8c7ac61bb6bf1007f29a79759faaa4700b1d90', "aria-labelledby": "navigation-landmark-text", class: "nav-panel-container" }, hAsync("ic-horizontal-scroll", { key: '35f848caea4ea1dd4acf40fb745c8c21e3527a1c', monochrome: true, appearance: foregroundColor }, hAsync("ul", { key: 'e3258950c9a102ab131421f43c6c255a25a92b86', class: "navigation-item-list", tabindex: "-1" }, hAsync("slot", { key: '47b7b95636042b538630b97a124420a1fc27c948', name: "navigation" }))))))))), navMenuVisible && (hAsync("ic-navigation-menu", { key: '3882936269a606b370eb187404194be1add62dd5', version: version, status: status, class: {
|
18173
|
+
inline,
|
18174
|
+
} }, hasIconButtons && (hAsync("div", { key: '0de3827a70e0d7b3148148b89a36a98693883770', class: "menu-buttons-slot", slot: "buttons" }, hAsync("slot", { key: 'a4a175ccfa0aa523fda4ce61d389175c40f75be0', name: "buttons" }))), hAsync("ul", { key: 'c601f64f4e48c2cb197793d440fdac7d2dc08261', slot: "navigation" }, hAsync("slot", { key: 'af85842692b892b7614fafff255c2c107a5bfdc9', name: "navigation" }))))));
|
18277
18175
|
}
|
18278
18176
|
get el() { return getElement(this); }
|
18279
18177
|
static get watchers() { return {
|
@@ -18476,7 +18374,7 @@ class Typography {
|
|
18476
18374
|
render() {
|
18477
18375
|
var _a, _b;
|
18478
18376
|
const { variant, applyVerticalMargins, maxLines, truncated, expanded, strikethrough, underline, italic, bold, theme, } = this;
|
18479
|
-
return (hAsync(Host, { key: '
|
18377
|
+
return (hAsync(Host, { key: '5cc23b5c8822124b4963df5c55094a3408cbb813', class: {
|
18480
18378
|
[`ic-typography-${variant}`]: true,
|
18481
18379
|
[`ic-typography-vertical-margins-${variant}`]: !!applyVerticalMargins,
|
18482
18380
|
["ic-typography-bold"]: !!bold,
|
@@ -18489,7 +18387,7 @@ class Typography {
|
|
18489
18387
|
((_b = (_a = this.el.getRootNode()) === null || _a === void 0 ? void 0 : _a.host) === null || _b === void 0 ? void 0 : _b.tagName) ===
|
18490
18388
|
"IC-TOOLTIP") &&
|
18491
18389
|
maxLines &&
|
18492
|
-
maxLines > 0 ? (hAsync("div", { class: "trunc-wrapper", ref: (el) => (this.truncWrapperEl = el) }, hAsync("slot", null))) : (hAsync("slot", null)), variant === "body" && maxLines && maxLines > 0 && truncated && (hAsync("button", { key: '
|
18390
|
+
maxLines > 0 ? (hAsync("div", { class: "trunc-wrapper", ref: (el) => (this.truncWrapperEl = el) }, hAsync("slot", null))) : (hAsync("slot", null)), variant === "body" && maxLines && maxLines > 0 && truncated && (hAsync("button", { key: '93e4f11420b64377f5fa5639bd8d7963c6191942', class: { "trunc-btn": true, focus: this.truncButtonFocussed }, onFocus: this.truncButtonFocus, onBlur: this.truncButtonBlur, onMouseDown: this.truncButtonFocusFromMouse, onClick: this.toggleExpanded }, expanded ? "See less" : "See more"))));
|
18493
18391
|
}
|
18494
18392
|
get el() { return getElement(this); }
|
18495
18393
|
static get watchers() { return {
|