@ukic/web-components 3.0.0-alpha.4 → 3.0.0-alpha.5
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/core.cjs.js +1 -1
- package/dist/cjs/{helpers-69219f14.js → helpers-529aaa3a.js} +5 -4
- package/dist/cjs/helpers-529aaa3a.js.map +1 -0
- package/dist/cjs/ic-accordion-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-accordion.cjs.entry.js +1 -1
- package/dist/cjs/ic-alert.cjs.entry.js +3 -3
- package/dist/cjs/ic-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-back-to-top.cjs.entry.js +8 -5
- package/dist/cjs/ic-back-to-top.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-badge.cjs.entry.js +2 -2
- package/dist/cjs/ic-badge.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-breadcrumb-group.cjs.entry.js +43 -20
- package/dist/cjs/ic-breadcrumb-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-breadcrumb.cjs.entry.js +2 -2
- package/dist/cjs/ic-breadcrumb.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-button_3.cjs.entry.js +11 -13
- package/dist/cjs/ic-button_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-card-vertical.cjs.entry.js +7 -6
- package/dist/cjs/ic-card-vertical.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-checkbox-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/ic-chip.cjs.entry.js +1 -1
- package/dist/cjs/ic-data-row.cjs.entry.js +1 -1
- package/dist/cjs/ic-dialog.cjs.entry.js +2 -2
- package/dist/cjs/ic-dialog.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-divider.cjs.entry.js +1 -1
- package/dist/cjs/ic-empty-state.cjs.entry.js +1 -1
- package/dist/cjs/ic-footer-link-group.cjs.entry.js +3 -3
- package/dist/cjs/ic-footer-link-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-footer-link.cjs.entry.js +1 -1
- package/dist/cjs/ic-footer.cjs.entry.js +1 -1
- package/dist/cjs/ic-hero.cjs.entry.js +2 -2
- package/dist/cjs/ic-hero.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-horizontal-scroll.cjs.entry.js +12 -5
- package/dist/cjs/ic-horizontal-scroll.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js +11 -23
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-input-label_2.cjs.entry.js +21 -25
- package/dist/cjs/ic-input-label_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-link.cjs.entry.js +3 -8
- 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-menu-item.cjs.entry.js +10 -9
- package/dist/cjs/ic-menu-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-button.cjs.entry.js +7 -3
- package/dist/cjs/ic-navigation-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-group.cjs.entry.js +4 -2
- package/dist/cjs/ic-navigation-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-item.cjs.entry.js +29 -4
- package/dist/cjs/ic-navigation-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-menu.cjs.entry.js +5 -4
- package/dist/cjs/ic-navigation-menu.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-page-header.cjs.entry.js +5 -3
- package/dist/cjs/ic-page-header.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-pagination-item.cjs.entry.js +1 -1
- package/dist/cjs/ic-pagination.cjs.entry.js +5 -23
- package/dist/cjs/ic-pagination.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-popover-menu.cjs.entry.js +6 -6
- package/dist/cjs/ic-popover-menu.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-radio-option.cjs.entry.js +1 -1
- package/dist/cjs/ic-search-bar.cjs.entry.js +4 -4
- package/dist/cjs/ic-search-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-select.cjs.entry.js +10 -12
- package/dist/cjs/ic-select.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-side-navigation.cjs.entry.js +11 -7
- package/dist/cjs/ic-side-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-status-tag.cjs.entry.js +5 -4
- package/dist/cjs/ic-status-tag.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-step.cjs.entry.js +1 -1
- package/dist/cjs/ic-stepper.cjs.entry.js +1 -1
- package/dist/cjs/ic-switch.cjs.entry.js +2 -2
- package/dist/cjs/ic-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tab-group.cjs.entry.js +3 -19
- package/dist/cjs/ic-tab-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tab-panel.cjs.entry.js +1 -1
- package/dist/cjs/ic-tab.cjs.entry.js +1 -1
- package/dist/cjs/ic-text-field.cjs.entry.js +18 -15
- 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.cjs.entry.js +1 -1
- package/dist/cjs/ic-toggle-button-group.cjs.entry.js +28 -4
- package/dist/cjs/ic-toggle-button-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-toggle-button.cjs.entry.js +9 -6
- package/dist/cjs/ic-toggle-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-top-navigation.cjs.entry.js +6 -4
- 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/ic-typography.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/ic-alert/ic-alert.css +7 -1
- package/dist/collection/components/ic-alert/ic-alert.js +1 -1
- package/dist/collection/components/ic-alert/ic-alert.js.map +1 -1
- package/dist/collection/components/ic-alert/test/basic/ic-alert.spec.js +1 -1
- package/dist/collection/components/ic-alert/test/basic/ic-alert.spec.js.map +1 -1
- package/dist/collection/components/ic-back-to-top/ic-back-to-top.css +5 -2
- package/dist/collection/components/ic-back-to-top/ic-back-to-top.js +31 -4
- package/dist/collection/components/ic-back-to-top/ic-back-to-top.js.map +1 -1
- package/dist/collection/components/ic-back-to-top/test/basic/ic-back-to-top.spec.js +14 -0
- package/dist/collection/components/ic-back-to-top/test/basic/ic-back-to-top.spec.js.map +1 -1
- package/dist/collection/components/ic-badge/ic-badge.css +3 -3
- package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.css +4 -7
- package/dist/collection/components/ic-breadcrumb-group/ic-breadcrumb-group.js +44 -19
- package/dist/collection/components/ic-breadcrumb-group/ic-breadcrumb-group.js.map +1 -1
- package/dist/collection/components/ic-button/ic-button.css +658 -421
- package/dist/collection/components/ic-button/ic-button.js +51 -35
- package/dist/collection/components/ic-button/ic-button.js.map +1 -1
- package/dist/collection/components/ic-button/test/basic/ic-button.spec.js +3 -3
- package/dist/collection/components/ic-button/test/basic/ic-button.spec.js.map +1 -1
- package/dist/collection/components/ic-card-vertical/ic-card-vertical.css +18 -18
- package/dist/collection/components/ic-card-vertical/ic-card-vertical.js +7 -6
- package/dist/collection/components/ic-card-vertical/ic-card-vertical.js.map +1 -1
- package/dist/collection/components/ic-dialog/ic-dialog.css +1 -1
- package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.css +4 -0
- package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.js +1 -1
- package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.js.map +1 -1
- package/dist/collection/components/ic-hero/ic-hero.css +7 -7
- package/dist/collection/components/ic-horizontal-scroll/ic-horizontal-scroll.css +0 -4
- package/dist/collection/components/ic-horizontal-scroll/ic-horizontal-scroll.js +59 -4
- package/dist/collection/components/ic-horizontal-scroll/ic-horizontal-scroll.js.map +1 -1
- package/dist/collection/components/ic-horizontal-scroll/test/basic/ic-horizontal-scroll.spec.js +43 -0
- package/dist/collection/components/ic-horizontal-scroll/test/basic/ic-horizontal-scroll.spec.js.map +1 -1
- package/dist/collection/components/ic-input-component-container/ic-input-component-container.css +38 -17
- package/dist/collection/components/ic-input-component-container/ic-input-component-container.js +8 -38
- package/dist/collection/components/ic-input-component-container/ic-input-component-container.js.map +1 -1
- package/dist/collection/components/ic-input-label/ic-input-label.css +6 -19
- package/dist/collection/components/ic-input-label/ic-input-label.js +11 -33
- package/dist/collection/components/ic-input-label/ic-input-label.js.map +1 -1
- package/dist/collection/components/ic-input-validation/ic-input-validation.css +9 -4
- package/dist/collection/components/ic-input-validation/ic-input-validation.js +7 -7
- package/dist/collection/components/ic-input-validation/ic-input-validation.js.map +1 -1
- package/dist/collection/components/ic-link/ic-link.css +0 -24
- package/dist/collection/components/ic-link/ic-link.js +3 -8
- package/dist/collection/components/ic-link/ic-link.js.map +1 -1
- package/dist/collection/components/ic-link/test/basic/ic-link.spec.js +2 -2
- package/dist/collection/components/ic-link/test/basic/ic-link.spec.js.map +1 -1
- package/dist/collection/components/ic-menu/ic-menu.css +31 -19
- package/dist/collection/components/ic-menu-item/ic-menu-item.js +48 -15
- package/dist/collection/components/ic-menu-item/ic-menu-item.js.map +1 -1
- package/dist/collection/components/ic-menu-item/test/basic/ic-menu-item.spec.js +1 -1
- package/dist/collection/components/ic-menu-item/test/basic/ic-menu-item.spec.js.map +1 -1
- package/dist/collection/components/ic-navigation-button/ic-navigation-button.css +14 -0
- package/dist/collection/components/ic-navigation-button/ic-navigation-button.js +29 -1
- package/dist/collection/components/ic-navigation-button/ic-navigation-button.js.map +1 -1
- package/dist/collection/components/ic-navigation-button/test/basic/ic-navigation-button.spec.js +1 -1
- package/dist/collection/components/ic-navigation-button/test/basic/ic-navigation-button.spec.js.map +1 -1
- package/dist/collection/components/ic-navigation-group/ic-navigation-group.css +13 -8
- package/dist/collection/components/ic-navigation-group/ic-navigation-group.js +26 -0
- 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 +20 -18
- package/dist/collection/components/ic-navigation-item/ic-navigation-item.js +52 -3
- package/dist/collection/components/ic-navigation-item/ic-navigation-item.js.map +1 -1
- package/dist/collection/components/ic-navigation-menu/ic-navigation-menu.css +9 -6
- package/dist/collection/components/ic-navigation-menu/ic-navigation-menu.js +27 -2
- package/dist/collection/components/ic-navigation-menu/ic-navigation-menu.js.map +1 -1
- package/dist/collection/components/ic-page-header/ic-page-header.css +2 -1
- package/dist/collection/components/ic-page-header/ic-page-header.js +27 -1
- package/dist/collection/components/ic-page-header/ic-page-header.js.map +1 -1
- package/dist/collection/components/ic-pagination/ic-pagination.js +4 -22
- package/dist/collection/components/ic-pagination/ic-pagination.js.map +1 -1
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.js +22 -9
- package/dist/collection/components/ic-popover-menu/ic-popover-menu.js.map +1 -1
- package/dist/collection/components/ic-search-bar/ic-search-bar.css +3 -1
- package/dist/collection/components/ic-search-bar/ic-search-bar.js +2 -3
- package/dist/collection/components/ic-search-bar/ic-search-bar.js.map +1 -1
- package/dist/collection/components/ic-select/ic-select.css +49 -36
- package/dist/collection/components/ic-select/ic-select.js +34 -12
- package/dist/collection/components/ic-select/ic-select.js.map +1 -1
- package/dist/collection/components/ic-side-navigation/ic-side-navigation.css +48 -31
- package/dist/collection/components/ic-side-navigation/ic-side-navigation.js +9 -5
- package/dist/collection/components/ic-side-navigation/ic-side-navigation.js.map +1 -1
- package/dist/collection/components/ic-side-navigation/test/basic/ic-side-navigation.spec.js +3 -3
- package/dist/collection/components/ic-side-navigation/test/basic/ic-side-navigation.spec.js.map +1 -1
- package/dist/collection/components/ic-status-tag/ic-status-tag.css +5 -5
- package/dist/collection/components/ic-status-tag/ic-status-tag.js +21 -2
- package/dist/collection/components/ic-status-tag/ic-status-tag.js.map +1 -1
- package/dist/collection/components/ic-status-tag/test/basic/ic-status-tag.spec.js +15 -32
- package/dist/collection/components/ic-status-tag/test/basic/ic-status-tag.spec.js.map +1 -1
- package/dist/collection/components/ic-switch/ic-switch.css +3 -0
- package/dist/collection/components/ic-tab-group/ic-tab-group.css +8 -0
- package/dist/collection/components/ic-tab-group/ic-tab-group.js +1 -17
- package/dist/collection/components/ic-tab-group/ic-tab-group.js.map +1 -1
- package/dist/collection/components/ic-text-field/ic-text-field.css +60 -9
- package/dist/collection/components/ic-text-field/ic-text-field.js +40 -13
- package/dist/collection/components/ic-text-field/ic-text-field.js.map +1 -1
- package/dist/collection/components/ic-text-field/test/basic/ic-text-field.textarea.spec.js +2 -2
- package/dist/collection/components/ic-text-field/test/basic/ic-text-field.textarea.spec.js.map +1 -1
- package/dist/collection/components/ic-toggle-button/ic-toggle-button.css +189 -54
- package/dist/collection/components/ic-toggle-button/ic-toggle-button.js +53 -32
- 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.css +23 -16
- package/dist/collection/components/ic-toggle-button-group/ic-toggle-button-group.js +76 -27
- package/dist/collection/components/ic-toggle-button-group/ic-toggle-button-group.js.map +1 -1
- package/dist/collection/components/ic-toggle-button-group/test/ic-toggle-button-group.spec.js +17 -0
- package/dist/collection/components/ic-toggle-button-group/test/ic-toggle-button-group.spec.js.map +1 -1
- package/dist/collection/components/ic-top-navigation/ic-top-navigation.css +41 -17
- package/dist/collection/components/ic-top-navigation/ic-top-navigation.js +28 -2
- package/dist/collection/components/ic-top-navigation/ic-top-navigation.js.map +1 -1
- package/dist/collection/components/ic-typography/ic-typography.css +4 -6
- package/dist/collection/utils/helpers.js +4 -3
- package/dist/collection/utils/helpers.js.map +1 -1
- package/dist/components/helpers.js +5 -4
- package/dist/components/helpers.js.map +1 -1
- package/dist/components/ic-alert.js +2 -2
- package/dist/components/ic-alert.js.map +1 -1
- package/dist/components/ic-back-to-top.js +9 -5
- package/dist/components/ic-back-to-top.js.map +1 -1
- package/dist/components/ic-badge.js +1 -1
- package/dist/components/ic-badge.js.map +1 -1
- package/dist/components/ic-breadcrumb-group.js +43 -19
- package/dist/components/ic-breadcrumb-group.js.map +1 -1
- package/dist/components/ic-breadcrumb2.js +1 -1
- package/dist/components/ic-breadcrumb2.js.map +1 -1
- package/dist/components/ic-button2.js +12 -13
- package/dist/components/ic-button2.js.map +1 -1
- package/dist/components/ic-card-vertical.js +8 -7
- package/dist/components/ic-card-vertical.js.map +1 -1
- package/dist/components/ic-dialog.js +1 -1
- package/dist/components/ic-dialog.js.map +1 -1
- package/dist/components/ic-footer-link-group.js +2 -2
- package/dist/components/ic-footer-link-group.js.map +1 -1
- package/dist/components/ic-hero.js +1 -1
- package/dist/components/ic-hero.js.map +1 -1
- package/dist/components/ic-horizontal-scroll2.js +13 -4
- package/dist/components/ic-horizontal-scroll2.js.map +1 -1
- package/dist/components/ic-input-component-container2.js +9 -22
- package/dist/components/ic-input-component-container2.js.map +1 -1
- package/dist/components/ic-input-label2.js +12 -17
- package/dist/components/ic-input-label2.js.map +1 -1
- package/dist/components/ic-input-validation2.js +8 -8
- package/dist/components/ic-input-validation2.js.map +1 -1
- package/dist/components/ic-link2.js +4 -9
- package/dist/components/ic-link2.js.map +1 -1
- package/dist/components/ic-menu-item2.js +11 -10
- package/dist/components/ic-menu-item2.js.map +1 -1
- package/dist/components/ic-menu2.js +1 -1
- package/dist/components/ic-menu2.js.map +1 -1
- package/dist/components/ic-navigation-button.js +7 -2
- package/dist/components/ic-navigation-button.js.map +1 -1
- package/dist/components/ic-navigation-group.js +4 -1
- package/dist/components/ic-navigation-group.js.map +1 -1
- package/dist/components/ic-navigation-item.js +30 -4
- package/dist/components/ic-navigation-item.js.map +1 -1
- package/dist/components/ic-navigation-menu2.js +6 -4
- package/dist/components/ic-navigation-menu2.js.map +1 -1
- package/dist/components/ic-page-header.js +5 -2
- package/dist/components/ic-page-header.js.map +1 -1
- package/dist/components/ic-pagination-item2.js +1 -1
- package/dist/components/ic-pagination.js +4 -22
- package/dist/components/ic-pagination.js.map +1 -1
- package/dist/components/ic-popover-menu.js +5 -5
- package/dist/components/ic-popover-menu.js.map +1 -1
- package/dist/components/ic-search-bar.js +4 -4
- package/dist/components/ic-search-bar.js.map +1 -1
- package/dist/components/ic-select.js +11 -12
- package/dist/components/ic-select.js.map +1 -1
- package/dist/components/ic-side-navigation.js +11 -7
- package/dist/components/ic-side-navigation.js.map +1 -1
- package/dist/components/ic-status-tag.js +5 -3
- package/dist/components/ic-status-tag.js.map +1 -1
- package/dist/components/ic-switch.js +1 -1
- package/dist/components/ic-switch.js.map +1 -1
- package/dist/components/ic-tab-group.js +2 -18
- package/dist/components/ic-tab-group.js.map +1 -1
- package/dist/components/ic-text-field2.js +19 -15
- package/dist/components/ic-text-field2.js.map +1 -1
- package/dist/components/ic-toast.js +1 -1
- package/dist/components/ic-toggle-button-group.js +35 -6
- package/dist/components/ic-toggle-button-group.js.map +1 -1
- package/dist/components/ic-toggle-button.js +11 -7
- package/dist/components/ic-toggle-button.js.map +1 -1
- package/dist/components/ic-top-navigation.js +7 -4
- package/dist/components/ic-top-navigation.js.map +1 -1
- package/dist/components/ic-typography2.js +1 -1
- package/dist/components/ic-typography2.js.map +1 -1
- package/dist/core/core.css +844 -88
- package/dist/core/core.esm.js +1 -1
- package/dist/core/core.esm.js.map +1 -1
- package/dist/core/{p-29767574.entry.js → p-03dc6b93.entry.js} +2 -2
- package/dist/core/p-04339c98.entry.js +2 -0
- package/dist/core/p-04339c98.entry.js.map +1 -0
- package/dist/core/p-0aec7fab.entry.js +2 -0
- package/dist/core/p-0aec7fab.entry.js.map +1 -0
- package/dist/core/{p-37dea10d.entry.js → p-0cef50b7.entry.js} +2 -2
- package/dist/core/{p-4a3b1f06.entry.js → p-12f72d83.entry.js} +2 -2
- package/dist/core/p-12f72d83.entry.js.map +1 -0
- package/dist/core/{p-f5b2b26d.entry.js → p-15fd6539.entry.js} +2 -2
- package/dist/core/p-175baf98.entry.js +2 -0
- package/dist/core/p-175baf98.entry.js.map +1 -0
- package/dist/core/{p-806a0fab.entry.js → p-2223c7ee.entry.js} +2 -2
- package/dist/core/p-274b1ed7.entry.js +2 -0
- package/dist/core/p-274b1ed7.entry.js.map +1 -0
- package/dist/core/p-2a300ec7.entry.js +2 -0
- package/dist/core/p-2a300ec7.entry.js.map +1 -0
- package/dist/core/{p-f0ae2b99.entry.js → p-303307bb.entry.js} +2 -2
- package/dist/core/p-3317f083.entry.js +2 -0
- package/dist/core/p-3317f083.entry.js.map +1 -0
- package/dist/core/p-35bd9d76.entry.js +2 -0
- package/dist/core/p-35bd9d76.entry.js.map +1 -0
- package/dist/core/p-36f4e0bd.entry.js +2 -0
- package/dist/core/p-36f4e0bd.entry.js.map +1 -0
- package/dist/core/p-3a4000d8.entry.js +2 -0
- package/dist/core/p-3a4000d8.entry.js.map +1 -0
- package/dist/core/{p-5cd016e1.entry.js → p-48463a79.entry.js} +2 -2
- package/dist/core/p-48463a79.entry.js.map +1 -0
- package/dist/core/{p-d4a83e25.entry.js → p-4fea4610.entry.js} +2 -2
- package/dist/core/{p-2ef46ead.entry.js → p-60d458e5.entry.js} +2 -2
- package/dist/core/{p-690c5e80.entry.js → p-685d6aa9.entry.js} +2 -2
- package/dist/core/p-6bb3ef22.entry.js +2 -0
- package/dist/core/p-6bb3ef22.entry.js.map +1 -0
- package/dist/core/{p-2140431c.entry.js → p-6cb1f1da.entry.js} +2 -2
- package/dist/core/{p-c9cf932c.entry.js → p-78f46cf8.entry.js} +2 -2
- package/dist/core/p-78f46cf8.entry.js.map +1 -0
- package/dist/core/p-79c132e3.entry.js +2 -0
- package/dist/core/p-79c132e3.entry.js.map +1 -0
- package/dist/core/p-7cba80ac.entry.js +2 -0
- package/dist/core/p-7cba80ac.entry.js.map +1 -0
- package/dist/core/p-81f80487.entry.js +2 -0
- package/dist/core/p-81f80487.entry.js.map +1 -0
- package/dist/core/p-85be0268.entry.js +2 -0
- package/dist/core/p-85be0268.entry.js.map +1 -0
- package/dist/core/p-85d33e38.entry.js +2 -0
- package/dist/core/p-85d33e38.entry.js.map +1 -0
- package/dist/core/{p-d93bac01.entry.js → p-88810080.entry.js} +2 -2
- package/dist/core/p-88810080.entry.js.map +1 -0
- package/dist/core/p-97e8246c.entry.js +2 -0
- package/dist/core/p-97e8246c.entry.js.map +1 -0
- package/dist/core/p-98816f52.entry.js +2 -0
- package/dist/core/p-98816f52.entry.js.map +1 -0
- package/dist/core/{p-bbeb03ef.entry.js → p-a01841e2.entry.js} +2 -2
- package/dist/core/p-a6be333f.entry.js +2 -0
- package/dist/core/p-a6be333f.entry.js.map +1 -0
- package/dist/core/p-a91b0212.entry.js +2 -0
- package/dist/core/p-a91b0212.entry.js.map +1 -0
- package/dist/core/p-ae42affc.entry.js +2 -0
- package/dist/core/p-ae42affc.entry.js.map +1 -0
- package/dist/core/{p-a9341313.entry.js → p-b06939fa.entry.js} +2 -2
- package/dist/core/{p-95f603dd.entry.js → p-ba37e169.entry.js} +2 -2
- package/dist/core/p-ba55afea.entry.js +2 -0
- package/dist/core/p-ba55afea.entry.js.map +1 -0
- package/dist/core/p-bbd2febe.entry.js +2 -0
- package/dist/core/p-bbd2febe.entry.js.map +1 -0
- package/dist/core/p-c0d5043e.entry.js +2 -0
- package/dist/core/p-c0d5043e.entry.js.map +1 -0
- package/dist/core/p-c43d676b.entry.js +2 -0
- package/dist/core/p-c43d676b.entry.js.map +1 -0
- package/dist/core/p-c4f32f77.entry.js +2 -0
- package/dist/core/p-c4f32f77.entry.js.map +1 -0
- package/dist/core/{p-7bff1e96.entry.js → p-c563d479.entry.js} +2 -2
- package/dist/core/{p-922984cb.entry.js → p-c5d3c71e.entry.js} +2 -2
- package/dist/core/{p-cedc375e.entry.js → p-c7e01fcd.entry.js} +2 -2
- package/dist/core/p-c82240b7.entry.js +2 -0
- package/dist/core/p-c82240b7.entry.js.map +1 -0
- package/dist/core/{p-7b35de65.entry.js → p-cdbc3414.entry.js} +2 -2
- package/dist/core/{p-705eb610.entry.js → p-d3263ed9.entry.js} +2 -2
- package/dist/core/{p-fdd0b732.entry.js → p-d43e0f4b.entry.js} +2 -2
- package/dist/core/{p-ef78bebc.entry.js → p-d987bdc0.entry.js} +2 -2
- package/dist/core/p-d987bdc0.entry.js.map +1 -0
- package/dist/core/p-e107f362.entry.js +2 -0
- package/dist/core/p-e107f362.entry.js.map +1 -0
- package/dist/core/{p-ee6dd94c.entry.js → p-ec097c1f.entry.js} +2 -2
- package/dist/core/{p-428f95f8.entry.js → p-f069f50e.entry.js} +2 -2
- package/dist/core/p-f069f50e.entry.js.map +1 -0
- package/dist/core/{p-acbd15ab.entry.js → p-f580f0ce.entry.js} +2 -2
- package/dist/core/{p-b7eb8ef9.js → p-f99576e0.js} +2 -2
- package/dist/core/p-f99576e0.js.map +1 -0
- package/dist/esm/core.js +1 -1
- package/dist/esm/{helpers-e8797e8d.js → helpers-7bf8c67f.js} +6 -5
- package/dist/esm/helpers-7bf8c67f.js.map +1 -0
- package/dist/esm/ic-accordion-group.entry.js +1 -1
- package/dist/esm/ic-accordion.entry.js +1 -1
- package/dist/esm/ic-alert.entry.js +3 -3
- package/dist/esm/ic-alert.entry.js.map +1 -1
- package/dist/esm/ic-back-to-top.entry.js +9 -6
- package/dist/esm/ic-back-to-top.entry.js.map +1 -1
- package/dist/esm/ic-badge.entry.js +2 -2
- package/dist/esm/ic-badge.entry.js.map +1 -1
- package/dist/esm/ic-breadcrumb-group.entry.js +43 -20
- package/dist/esm/ic-breadcrumb-group.entry.js.map +1 -1
- package/dist/esm/ic-breadcrumb.entry.js +2 -2
- package/dist/esm/ic-breadcrumb.entry.js.map +1 -1
- package/dist/esm/ic-button_3.entry.js +11 -13
- package/dist/esm/ic-button_3.entry.js.map +1 -1
- package/dist/esm/ic-card-vertical.entry.js +7 -6
- package/dist/esm/ic-card-vertical.entry.js.map +1 -1
- package/dist/esm/ic-checkbox-group.entry.js +1 -1
- package/dist/esm/ic-checkbox.entry.js +1 -1
- package/dist/esm/ic-chip.entry.js +1 -1
- package/dist/esm/ic-data-row.entry.js +1 -1
- package/dist/esm/ic-dialog.entry.js +2 -2
- package/dist/esm/ic-dialog.entry.js.map +1 -1
- package/dist/esm/ic-divider.entry.js +1 -1
- package/dist/esm/ic-empty-state.entry.js +1 -1
- package/dist/esm/ic-footer-link-group.entry.js +3 -3
- package/dist/esm/ic-footer-link-group.entry.js.map +1 -1
- package/dist/esm/ic-footer-link.entry.js +1 -1
- package/dist/esm/ic-footer.entry.js +1 -1
- package/dist/esm/ic-hero.entry.js +2 -2
- package/dist/esm/ic-hero.entry.js.map +1 -1
- package/dist/esm/ic-horizontal-scroll.entry.js +12 -5
- package/dist/esm/ic-horizontal-scroll.entry.js.map +1 -1
- package/dist/esm/ic-input-component-container_3.entry.js +11 -23
- package/dist/esm/ic-input-component-container_3.entry.js.map +1 -1
- package/dist/esm/ic-input-label_2.entry.js +21 -25
- package/dist/esm/ic-input-label_2.entry.js.map +1 -1
- package/dist/esm/ic-link.entry.js +3 -8
- package/dist/esm/ic-link.entry.js.map +1 -1
- package/dist/esm/ic-menu-group.entry.js +1 -1
- package/dist/esm/ic-menu-item.entry.js +10 -9
- package/dist/esm/ic-menu-item.entry.js.map +1 -1
- package/dist/esm/ic-navigation-button.entry.js +7 -3
- package/dist/esm/ic-navigation-button.entry.js.map +1 -1
- package/dist/esm/ic-navigation-group.entry.js +4 -2
- package/dist/esm/ic-navigation-group.entry.js.map +1 -1
- package/dist/esm/ic-navigation-item.entry.js +29 -4
- package/dist/esm/ic-navigation-item.entry.js.map +1 -1
- package/dist/esm/ic-navigation-menu.entry.js +5 -4
- package/dist/esm/ic-navigation-menu.entry.js.map +1 -1
- package/dist/esm/ic-page-header.entry.js +5 -3
- package/dist/esm/ic-page-header.entry.js.map +1 -1
- package/dist/esm/ic-pagination-item.entry.js +1 -1
- package/dist/esm/ic-pagination.entry.js +5 -23
- package/dist/esm/ic-pagination.entry.js.map +1 -1
- package/dist/esm/ic-popover-menu.entry.js +6 -6
- package/dist/esm/ic-popover-menu.entry.js.map +1 -1
- package/dist/esm/ic-radio-group.entry.js +1 -1
- package/dist/esm/ic-radio-option.entry.js +1 -1
- package/dist/esm/ic-search-bar.entry.js +4 -4
- package/dist/esm/ic-search-bar.entry.js.map +1 -1
- package/dist/esm/ic-select.entry.js +10 -12
- package/dist/esm/ic-select.entry.js.map +1 -1
- package/dist/esm/ic-side-navigation.entry.js +11 -7
- package/dist/esm/ic-side-navigation.entry.js.map +1 -1
- package/dist/esm/ic-status-tag.entry.js +5 -4
- package/dist/esm/ic-status-tag.entry.js.map +1 -1
- package/dist/esm/ic-step.entry.js +1 -1
- package/dist/esm/ic-stepper.entry.js +1 -1
- package/dist/esm/ic-switch.entry.js +2 -2
- package/dist/esm/ic-switch.entry.js.map +1 -1
- package/dist/esm/ic-tab-group.entry.js +3 -19
- package/dist/esm/ic-tab-group.entry.js.map +1 -1
- package/dist/esm/ic-tab-panel.entry.js +1 -1
- package/dist/esm/ic-tab.entry.js +1 -1
- package/dist/esm/ic-text-field.entry.js +18 -15
- 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.entry.js +1 -1
- package/dist/esm/ic-toggle-button-group.entry.js +28 -4
- package/dist/esm/ic-toggle-button-group.entry.js.map +1 -1
- package/dist/esm/ic-toggle-button.entry.js +9 -6
- package/dist/esm/ic-toggle-button.entry.js.map +1 -1
- package/dist/esm/ic-top-navigation.entry.js +6 -4
- package/dist/esm/ic-top-navigation.entry.js.map +1 -1
- package/dist/esm/ic-typography.entry.js +2 -2
- package/dist/esm/ic-typography.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/ic-back-to-top/ic-back-to-top.d.ts +5 -0
- package/dist/types/components/ic-breadcrumb-group/ic-breadcrumb-group.d.ts +1 -0
- package/dist/types/components/ic-button/ic-button.d.ts +9 -5
- package/dist/types/components/ic-card-vertical/ic-card-vertical.d.ts +2 -2
- package/dist/types/components/ic-horizontal-scroll/ic-horizontal-scroll.d.ts +7 -1
- package/dist/types/components/ic-input-component-container/ic-input-component-container.d.ts +0 -4
- package/dist/types/components/ic-input-label/ic-input-label.d.ts +0 -4
- package/dist/types/components/ic-menu-item/ic-menu-item.d.ts +10 -4
- package/dist/types/components/ic-navigation-button/ic-navigation-button.d.ts +5 -1
- package/dist/types/components/ic-navigation-group/ic-navigation-group.d.ts +5 -1
- package/dist/types/components/ic-navigation-item/ic-navigation-item.d.ts +7 -1
- package/dist/types/components/ic-navigation-menu/ic-navigation-menu.d.ts +5 -0
- package/dist/types/components/ic-page-header/ic-page-header.d.ts +5 -1
- package/dist/types/components/ic-pagination/ic-pagination.d.ts +0 -4
- package/dist/types/components/ic-popover-menu/ic-popover-menu.d.ts +3 -6
- package/dist/types/components/ic-select/ic-select.d.ts +6 -2
- package/dist/types/components/ic-status-tag/ic-status-tag.d.ts +4 -0
- package/dist/types/components/ic-tab-group/ic-tab-group.d.ts +0 -4
- package/dist/types/components/ic-text-field/ic-text-field.d.ts +5 -1
- package/dist/types/components/ic-toggle-button/ic-toggle-button.d.ts +9 -5
- package/dist/types/components/ic-toggle-button-group/ic-toggle-button-group.d.ts +12 -5
- package/dist/types/components/ic-top-navigation/ic-top-navigation.d.ts +5 -1
- package/dist/types/components.d.ts +152 -48
- package/hydrate/index.js +297 -236
- package/package.json +2 -2
- package/vscode-data.json +201 -70
- package/dist/cjs/helpers-69219f14.js.map +0 -1
- package/dist/core/p-13d5875c.entry.js +0 -2
- package/dist/core/p-13d5875c.entry.js.map +0 -1
- package/dist/core/p-19872973.entry.js +0 -2
- package/dist/core/p-19872973.entry.js.map +0 -1
- package/dist/core/p-2e909738.entry.js +0 -2
- package/dist/core/p-2e909738.entry.js.map +0 -1
- package/dist/core/p-2eae9b27.entry.js +0 -2
- package/dist/core/p-2eae9b27.entry.js.map +0 -1
- package/dist/core/p-3d9726a3.entry.js +0 -2
- package/dist/core/p-3d9726a3.entry.js.map +0 -1
- package/dist/core/p-428f95f8.entry.js.map +0 -1
- package/dist/core/p-4973c563.entry.js +0 -2
- package/dist/core/p-4973c563.entry.js.map +0 -1
- package/dist/core/p-4a3b1f06.entry.js.map +0 -1
- package/dist/core/p-5cd016e1.entry.js.map +0 -1
- package/dist/core/p-5ef8e106.entry.js +0 -2
- package/dist/core/p-5ef8e106.entry.js.map +0 -1
- package/dist/core/p-5f4a6555.entry.js +0 -2
- package/dist/core/p-5f4a6555.entry.js.map +0 -1
- package/dist/core/p-605c0c92.entry.js +0 -2
- package/dist/core/p-605c0c92.entry.js.map +0 -1
- package/dist/core/p-655a9e0f.entry.js +0 -2
- package/dist/core/p-655a9e0f.entry.js.map +0 -1
- package/dist/core/p-65a16de9.entry.js +0 -2
- package/dist/core/p-65a16de9.entry.js.map +0 -1
- package/dist/core/p-76263187.entry.js +0 -2
- package/dist/core/p-76263187.entry.js.map +0 -1
- package/dist/core/p-78c1f1cc.entry.js +0 -2
- package/dist/core/p-78c1f1cc.entry.js.map +0 -1
- package/dist/core/p-79d0be03.entry.js +0 -2
- package/dist/core/p-79d0be03.entry.js.map +0 -1
- package/dist/core/p-85173458.entry.js +0 -2
- package/dist/core/p-85173458.entry.js.map +0 -1
- package/dist/core/p-979c2792.entry.js +0 -2
- package/dist/core/p-979c2792.entry.js.map +0 -1
- package/dist/core/p-97fb2bdf.entry.js +0 -2
- package/dist/core/p-97fb2bdf.entry.js.map +0 -1
- package/dist/core/p-9ec7f96c.entry.js +0 -2
- package/dist/core/p-9ec7f96c.entry.js.map +0 -1
- package/dist/core/p-9fa93dfe.entry.js +0 -2
- package/dist/core/p-9fa93dfe.entry.js.map +0 -1
- package/dist/core/p-ae0775aa.entry.js +0 -2
- package/dist/core/p-ae0775aa.entry.js.map +0 -1
- package/dist/core/p-b7eb8ef9.js.map +0 -1
- package/dist/core/p-ba6ecc15.entry.js +0 -2
- package/dist/core/p-ba6ecc15.entry.js.map +0 -1
- package/dist/core/p-c0fc3d02.entry.js +0 -2
- package/dist/core/p-c0fc3d02.entry.js.map +0 -1
- package/dist/core/p-c396bd4d.entry.js +0 -2
- package/dist/core/p-c396bd4d.entry.js.map +0 -1
- package/dist/core/p-c9cf932c.entry.js.map +0 -1
- package/dist/core/p-d93bac01.entry.js.map +0 -1
- package/dist/core/p-eb3b4935.entry.js +0 -2
- package/dist/core/p-eb3b4935.entry.js.map +0 -1
- package/dist/core/p-ebafab37.entry.js +0 -2
- package/dist/core/p-ebafab37.entry.js.map +0 -1
- package/dist/core/p-ef78bebc.entry.js.map +0 -1
- package/dist/core/p-f24984c5.entry.js +0 -2
- package/dist/core/p-f24984c5.entry.js.map +0 -1
- package/dist/core/p-f71c00ce.entry.js +0 -2
- package/dist/core/p-f71c00ce.entry.js.map +0 -1
- package/dist/esm/helpers-e8797e8d.js.map +0 -1
- /package/dist/core/{p-29767574.entry.js.map → p-03dc6b93.entry.js.map} +0 -0
- /package/dist/core/{p-37dea10d.entry.js.map → p-0cef50b7.entry.js.map} +0 -0
- /package/dist/core/{p-f5b2b26d.entry.js.map → p-15fd6539.entry.js.map} +0 -0
- /package/dist/core/{p-806a0fab.entry.js.map → p-2223c7ee.entry.js.map} +0 -0
- /package/dist/core/{p-f0ae2b99.entry.js.map → p-303307bb.entry.js.map} +0 -0
- /package/dist/core/{p-d4a83e25.entry.js.map → p-4fea4610.entry.js.map} +0 -0
- /package/dist/core/{p-2ef46ead.entry.js.map → p-60d458e5.entry.js.map} +0 -0
- /package/dist/core/{p-690c5e80.entry.js.map → p-685d6aa9.entry.js.map} +0 -0
- /package/dist/core/{p-2140431c.entry.js.map → p-6cb1f1da.entry.js.map} +0 -0
- /package/dist/core/{p-bbeb03ef.entry.js.map → p-a01841e2.entry.js.map} +0 -0
- /package/dist/core/{p-a9341313.entry.js.map → p-b06939fa.entry.js.map} +0 -0
- /package/dist/core/{p-95f603dd.entry.js.map → p-ba37e169.entry.js.map} +0 -0
- /package/dist/core/{p-7bff1e96.entry.js.map → p-c563d479.entry.js.map} +0 -0
- /package/dist/core/{p-922984cb.entry.js.map → p-c5d3c71e.entry.js.map} +0 -0
- /package/dist/core/{p-cedc375e.entry.js.map → p-c7e01fcd.entry.js.map} +0 -0
- /package/dist/core/{p-7b35de65.entry.js.map → p-cdbc3414.entry.js.map} +0 -0
- /package/dist/core/{p-705eb610.entry.js.map → p-d3263ed9.entry.js.map} +0 -0
- /package/dist/core/{p-fdd0b732.entry.js.map → p-d43e0f4b.entry.js.map} +0 -0
- /package/dist/core/{p-ee6dd94c.entry.js.map → p-ec097c1f.entry.js.map} +0 -0
- /package/dist/core/{p-acbd15ab.entry.js.map → p-f580f0ce.entry.js.map} +0 -0
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icPaginationCss","Pagination","this","handleClickFirst","currentPage","icPageChange","emit","value","handleClickPrevious","handleClickNext","handleClickLast","pages","handleButtonAppearance","monochrome","theme","window","matchMedia","matches","firstButton","h","id","appearance","onClick","class","disabled","variant","innerHTML","paginationFirstLast","previousButton","paginationNextPrevious","nextButton","lastButton","renderStartEllipsis","type","renderEndEllipsis","renderStartItems","startItems","map","page","selected","renderEndItems","endItems","renderMiddleItems","midItems","defaultPage","watchAdjacentPageCountHandler","adjacentPageCount","watchBoundaryPageCountHandler","boundaryPageCount","watchNumberPagesHandler","watchPageChangeHandler","watchTypeHandler","startEllipsis","endEllipsis","startItemCount","endStart","midStart","midEnd","i","push","numItems","componentWillLoad","removeDisabledFalse","el","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","paginationItemClickHandler","ev","detail","setCurrentPage","console","error","render","hideCurrentPage","hideFirstAndLastPageButton","label","Host","role"],"sources":["src/components/ic-pagination/ic-pagination.css?tag=ic-pagination&encapsulation=shadow","src/components/ic-pagination/ic-pagination.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n box-sizing: border-box;\n width: 100%;\n display: flex;\n justify-content: center;\n}\n\nnav {\n width: 100%;\n display: flex;\n flex-flow: row wrap;\n justify-content: flex-start;\n align-items: center;\n}\n\nic-button {\n cursor: pointer;\n}\n\nic-button.next-previous {\n --icon-width: var(--ic-space-xs);\n --icon-height: calc(var(--ic-space-xs) + var(--ic-space-xxxs));\n\n padding: 0 var(--ic-space-xxs) 0 var(--ic-space-xxxs);\n}\n\nic-button.first-last {\n --icon-width: calc(var(--ic-space-sm) + var(--ic-space-xxxs));\n --icon-height: calc(var(--ic-space-xs) + var(--ic-space-xxxs));\n}\n\nic-button.first-last::part(button),\nic-button.next-previous::part(button) {\n color: var(--ic-pagination-chevron);\n}\n\n:host(.ic-pagination-monochrome) ic-button.first-last::part(button),\n:host(.ic-pagination-monochrome) ic-button.next-previous::part(button) {\n color: var(--ic-pagination-chevron-monochrome);\n}\n\nic-button.ic-button-disabled.first-last::part(button),\nic-button.ic-button-disabled.next-previous::part(button) {\n color: var(--ic-pagination-chevron-disabled);\n}\n\n.disabled {\n color: var(--ic-architectural-200);\n pointer-events: none;\n cursor: none;\n user-select: none;\n}\n\n.hide-current-page {\n display: none;\n}\n\n.sr-only {\n position: absolute;\n left: -9999px;\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n h,\n Listen,\n State,\n Watch,\n Event,\n EventEmitter,\n Method,\n} from \"@stencil/core\";\nimport paginationNextPrevious from \"../../assets/pagination-next-previous.svg\";\nimport paginationFirstLast from \"../../assets/pagination-first-last.svg\";\nimport { IcThemeMode } from \"../../utils/types\";\nimport { IcPaginationTypes, IcChangeEventDetail } from \"./ic-pagination.types\";\nimport {\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-pagination\",\n styleUrl: \"ic-pagination.css\",\n shadow: true,\n})\nexport class Pagination {\n @Element() el: HTMLIcPaginationElement;\n\n @State() endEllipsis: boolean = false;\n @State() endItems: number[] = [];\n @State() midItems: number[] = [];\n @State() startEllipsis: boolean = false;\n @State() startItems: number[] = [];\n\n /**\n * The number of pages displayed adjacent to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2.\n */\n @Prop({ mutable: true }) adjacentPageCount: number = 1;\n\n @Watch(\"adjacentPageCount\")\n watchAdjacentPageCountHandler(): void {\n if (this.adjacentPageCount > 2) {\n this.adjacentPageCount = 2;\n }\n }\n\n /**\n * The number of pages displayed as boundary items to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2.\n */\n @Prop({ mutable: true }) boundaryPageCount: number = 1;\n\n @Watch(\"boundaryPageCount\")\n watchBoundaryPageCountHandler(): void {\n if (this.boundaryPageCount > 2) {\n this.boundaryPageCount = 2;\n }\n }\n\n /**\n * The default page to display.\n */\n @Prop() defaultPage: number = 1;\n\n /**\n * If `true`, the pagination will not allow interaction.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * If `true`, the current page of the simple pagination will not be displayed.\n */\n @Prop() hideCurrentPage: boolean = false;\n\n /**\n * If `true`, the first and last page buttons will not be displayed.\n */\n @Prop() hideFirstAndLastPageButton: boolean = false;\n\n /**\n * The label for the pagination item (applicable when simple pagination is being used).\n */\n @Prop() label: string = \"Page\";\n\n /**\n * If `true`, the pagination will display as black in the light theme, and white in dark theme.\n */\n @Prop() monochrome?: boolean = false;\n\n /**\n * The total number of pages.\n */\n @Prop() pages!: number;\n\n @Watch(\"pages\")\n watchNumberPagesHandler(): void {\n this.watchPageChangeHandler();\n }\n\n /**\n * 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.\n */\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /**\n * The type of pagination to be used.\n */\n @Prop() type: IcPaginationTypes = \"simple\";\n\n @Watch(\"type\")\n watchTypeHandler(): void {\n this.watchPageChangeHandler();\n }\n\n /**\n * The current page displayed by the pagination.\n */\n @Prop({ mutable: true }) currentPage: number = this.defaultPage;\n\n @Watch(\"currentPage\")\n watchPageChangeHandler(): void {\n if (this.type === \"simple\") {\n return;\n }\n\n this.startEllipsis = false;\n this.endEllipsis = false;\n this.startItems = [];\n this.endItems = [];\n this.midItems = [];\n\n const startItems = [];\n let startItemCount = 0;\n const endItems = [];\n let endStart = this.pages;\n const midItems = [];\n let midStart;\n let midEnd;\n let startEllipsis = false;\n let endEllipsis = false;\n\n if (\n this.pages <=\n this.boundaryPageCount * 2 + this.adjacentPageCount * 2 + 3\n ) {\n this.startEllipsis = false;\n this.endEllipsis = false;\n for (let i = 1; i <= this.pages; i++) {\n startItems.push(i);\n }\n this.startItems = startItems;\n return;\n }\n\n startItemCount = this.boundaryPageCount === 0 ? 1 : this.boundaryPageCount;\n endStart =\n this.boundaryPageCount === 0\n ? this.pages\n : this.pages - this.boundaryPageCount + 1;\n\n if (\n this.currentPage <=\n this.adjacentPageCount + this.boundaryPageCount + 2\n ) {\n startEllipsis = false;\n endEllipsis = true;\n\n let numItems = 2 * this.adjacentPageCount + 1;\n if (this.boundaryPageCount === 0) {\n numItems--;\n }\n midStart = startItemCount + 1;\n midEnd = midStart + numItems;\n } else {\n startEllipsis = true;\n if (\n this.currentPage >\n this.pages - (this.adjacentPageCount + this.boundaryPageCount + 2)\n ) {\n let numItems = 2 * this.adjacentPageCount + 1;\n if (this.boundaryPageCount === 0) {\n numItems--;\n }\n midEnd =\n this.boundaryPageCount === 0\n ? this.pages - 1\n : this.pages - this.boundaryPageCount;\n midStart = midEnd - numItems;\n } else {\n endEllipsis = true;\n midStart = this.currentPage - this.adjacentPageCount;\n midEnd = this.currentPage + this.adjacentPageCount;\n }\n }\n\n //create array of start items\n if (\n this.boundaryPageCount > 0 ||\n (this.boundaryPageCount === 0 && startEllipsis === false)\n ) {\n for (let i = 1; i <= startItemCount; i++) {\n startItems.push(i);\n }\n }\n\n //create array of end items\n if (\n this.boundaryPageCount > 0 ||\n (this.boundaryPageCount === 0 && endEllipsis === false)\n ) {\n for (let i = endStart; i <= this.pages; i++) {\n endItems.push(i);\n }\n }\n\n //create array of mid items\n for (let i = midStart; i <= midEnd; i++) {\n midItems.push(i);\n }\n\n this.startEllipsis = startEllipsis;\n this.endEllipsis = endEllipsis;\n this.startItems = startItems;\n this.endItems = endItems;\n this.midItems = midItems;\n }\n\n /**\n * Emitted when a page is selected.\n */\n @Event() icPageChange: EventEmitter<IcChangeEventDetail>;\n\n componentWillLoad(): void {\n this.watchPageChangeHandler();\n this.watchBoundaryPageCountHandler();\n this.watchAdjacentPageCountHandler();\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.pages, propName: \"pages\" }],\n \"Pagination\"\n );\n }\n\n @Listen(\"paginationItemClick\")\n paginationItemClickHandler(ev: CustomEvent): void {\n const page = ev.detail.page;\n this.currentPage = page;\n this.icPageChange.emit({ value: this.currentPage });\n }\n\n /**\n * Sets the currently displayed page.\n * @param {number} page The page number to set as the current page\n */\n @Method()\n async setCurrentPage(page: number): Promise<void> {\n if (typeof page === \"number\" && page > 0 && page <= this.pages) {\n this.currentPage = page;\n } else {\n console.error(\n \"Current page must be a number greater than zero but less than or equal to the total number of pages\"\n );\n }\n }\n\n private handleClickFirst = () => {\n this.currentPage = 1;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n private handleClickPrevious = (): void => {\n this.currentPage--;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n private handleClickNext = (): void => {\n this.currentPage++;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n private handleClickLast = (): void => {\n this.currentPage = this.pages;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n /**\n * Temporary function to handle button appearance until other dark mode work is completed.\n */\n private handleButtonAppearance = () => {\n if (this.monochrome) {\n if (\n this.theme === \"dark\" ||\n (this.theme === \"inherit\" &&\n window.matchMedia(\"(prefers-color-scheme: dark)\").matches)\n ) {\n return \"light\";\n } else {\n return \"dark\";\n }\n } else {\n return \"default\";\n }\n };\n\n // button rendering abstracted from component render methods for clarity\n private firstButton = () => {\n return (\n <ic-button\n id=\"first-page-button\"\n aria-label=\"Go to first page\"\n appearance={this.handleButtonAppearance()}\n onClick={this.handleClickFirst}\n class=\"page-button first-last\"\n disabled={this.currentPage === 1 || this.disabled}\n variant=\"icon\"\n innerHTML={paginationFirstLast}\n />\n );\n };\n\n private previousButton = () => {\n return (\n <ic-button\n id=\"previous-page-button\"\n aria-label=\"Go to previous page\"\n appearance={this.handleButtonAppearance()}\n onClick={this.handleClickPrevious}\n class=\"page-button next-previous flip\"\n disabled={this.currentPage === 1 || this.disabled}\n variant=\"icon\"\n innerHTML={paginationNextPrevious}\n />\n );\n };\n\n private nextButton = () => {\n return (\n <ic-button\n id=\"next-page-button\"\n aria-label=\"Go to next page\"\n appearance={this.handleButtonAppearance()}\n onClick={this.handleClickNext}\n class=\"page-button next-previous\"\n disabled={this.currentPage === this.pages || this.disabled}\n variant=\"icon\"\n innerHTML={paginationNextPrevious}\n />\n );\n };\n\n private lastButton = () => {\n return (\n <ic-button\n id=\"last-page-button\"\n aria-label=\"Go to last page\"\n appearance={this.handleButtonAppearance()}\n onClick={this.handleClickLast}\n class=\"page-button first-last flip\"\n disabled={this.currentPage === this.pages || this.disabled}\n variant=\"icon\"\n innerHTML={paginationFirstLast}\n />\n );\n };\n\n private renderStartEllipsis = () => {\n return (\n <ic-pagination-item\n theme={this.theme}\n monochrome={this.monochrome}\n type=\"ellipsis\"\n id=\"start-ellipsis\"\n disabled={this.disabled}\n />\n );\n };\n\n private renderEndEllipsis = () => {\n return (\n <ic-pagination-item\n theme={this.theme}\n monochrome={this.monochrome}\n type=\"ellipsis\"\n id=\"end-ellipsis\"\n disabled={this.disabled}\n />\n );\n };\n\n private renderStartItems = () => {\n return this.startItems.map((page: number) => {\n return (\n <ic-pagination-item\n theme={this.theme}\n monochrome={this.monochrome}\n selected={page === this.currentPage}\n id={`pagination-item-${page}`}\n type=\"page\"\n page={page}\n disabled={this.disabled}\n />\n );\n });\n };\n\n private renderEndItems = () => {\n return this.endItems.map((page: number) => {\n return (\n <ic-pagination-item\n theme={this.theme}\n monochrome={this.monochrome}\n selected={page === this.currentPage}\n id={`pagination-item-${page}`}\n type=\"page\"\n page={page}\n disabled={this.disabled}\n />\n );\n });\n };\n\n private renderMiddleItems = () => {\n return this.midItems.map((page: number) => {\n return (\n <ic-pagination-item\n theme={this.theme}\n monochrome={this.monochrome}\n selected={page === this.currentPage}\n id={`pagination-item-${page}`}\n type=\"page\"\n page={page}\n disabled={this.disabled}\n />\n );\n });\n };\n\n render() {\n const {\n type,\n currentPage,\n hideCurrentPage,\n disabled,\n hideFirstAndLastPageButton,\n label,\n theme,\n monochrome,\n } = this;\n\n return (\n <Host\n class={{\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n [\"ic-pagination-monochrome\"]: monochrome,\n }}\n >\n {type === \"simple\" && (\n <nav\n class={{\n [\"disabled\"]: disabled,\n }}\n role=\"navigation\"\n aria-label=\"Pagination Navigation\"\n >\n {hideFirstAndLastPageButton ? null : this.firstButton()}\n {this.previousButton()}\n <ic-pagination-item\n theme={this.theme}\n monochrome={this.monochrome}\n type=\"simple-current\"\n page={currentPage}\n label={label}\n class={{ [\"hide-current-page\"]: hideCurrentPage }}\n disabled={disabled}\n />\n {this.nextButton()}\n {hideFirstAndLastPageButton ? null : this.lastButton()}\n </nav>\n )}\n {type === \"complex\" && (\n <nav\n class={{\n [\"disabled\"]: disabled,\n }}\n role=\"navigation\"\n aria-label=\"Pagination Navigation\"\n >\n {hideFirstAndLastPageButton ? null : this.firstButton()}\n {this.previousButton()}\n {this.renderStartItems()}\n {this.startEllipsis && this.renderStartEllipsis()}\n {this.renderMiddleItems()}\n {this.endEllipsis && this.renderEndEllipsis()}\n {this.renderEndItems()}\n {this.nextButton()}\n {hideFirstAndLastPageButton ? null : this.lastButton()}\n </nav>\n )}\n {type === \"complex\" && (\n <span class=\"sr-only\" aria-live=\"polite\">\n Page {this.currentPage}\n </span>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as e,c as t,f as i,h as a,H as r,g as n}from"./p-6b5e91e2.js";import{c as o}from"./p-f074ef5b.js";import{c as s,i as l,V as c,I as d}from"./p-b7eb8ef9.js";const u='/*! 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:3.5rem;border-radius:var(--ic-border-radius);position:relative;display:flex;align-items:center}.container-neutral{background-color:var(--ic-alert-background-neutral)}.container-info{background-color:var(--ic-alert-background-info)}.container-warning{background-color:var(--ic-alert-background-warning)}.container-error{background-color:var(--ic-alert-background-error)}.container-success{background-color:var(--ic-alert-background-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)}}';const p=class{constructor(a){e(this,a);this.icDismiss=t(this,"icDismiss",7);this.hostMutationObserver=null;this.dismissAction=()=>{this.icDismiss.emit()};this.hostMutationCallback=e=>{if(e.some((({type:e,addedNodes:t,removedNodes:i})=>e==="childList"?s(t,i,"action"):false))){i(this)}};this.alertTitleWrap=false;this.visible=true;this.announced=true;this.dismissible=false;this.heading="";this.message=undefined;this.showDefaultIcon=true;this.theme="inherit";this.titleAbove=false;this.variant="neutral"}disconnectedCallback(){var e;(e=this.hostMutationObserver)===null||e===void 0?void 0:e.disconnect()}componentDidLoad(){this.alertTitleShouldWrap();this.hostMutationObserver=new MutationObserver(this.hostMutationCallback);this.hostMutationObserver.observe(this.el,{childList:true})}handleClick(){this.visible=!this.visible}alertTitleShouldWrap(){var e;const t=(e=this.el.shadowRoot.querySelector(".alert-title"))===null||e===void 0?void 0:e.clientHeight;if(t>24)this.alertTitleWrap=true}render(){const{variant:e,heading:t,message:i,titleAbove:n,dismissible:s,announced:u,visible:p,showDefaultIcon:h,theme:m}=this;return p&&a(r,{role:u?"alert":null,class:{[d.Dark]:true,[`ic-theme-${m}`]:m!=="inherit"}},a("div",{class:{["container"]:true,[`container-${e}`]:true}},a("div",{class:"alert-icon-container"},a("div",{class:{["divider"]:true,[`divider-${e}`]:true}}),e==="neutral"?l(this.el,"neutral-icon")?a("div",{class:"alert-icon svg-container icon-neutral"},a("slot",{name:"neutral-icon"})):h?a("span",{class:{["alert-icon"]:true,["svg-container"]:true,[`icon-${e}`]:true},innerHTML:c[e].icon}):a("div",{class:"icon-placeholder"}):a("span",{class:{["alert-icon"]:true,["svg-container"]:true,[`icon-${e}`]:true},innerHTML:c[e].icon})),a("div",{class:"alert-content"},a("div",{class:{["alert-message"]:true,["alert-message-title-above"]:n||this.alertTitleWrap}},t&&a("ic-typography",{class:{["alert-title"]:true,["alert-title-above"]:n||this.alertTitleWrap},variant:"subtitle-large"},a("p",null,t)),a("slot",{name:"message"},a("ic-typography",{variant:"body"},i))),l(this.el,"action")&&a("div",{class:"alert-action-container"},a("slot",{name:"action"}))),a("div",{class:"dismiss-icon-container"},s&&a("ic-button",{class:{["svg-container"]:true,["dismiss-icon"]:true},innerHTML:o,onClick:this.dismissAction,variant:"icon",title:"dismiss"}))))}get el(){return n(this)}};p.style=u;export{p as ic_alert};
|
2
|
-
//# sourceMappingURL=p-2e909738.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icAlertCss","Alert","this","hostMutationObserver","dismissAction","icDismiss","emit","hostMutationCallback","mutationList","some","type","addedNodes","removedNodes","checkSlotInChildMutations","forceUpdate","disconnectedCallback","_a","disconnect","componentDidLoad","alertTitleShouldWrap","MutationObserver","observe","el","childList","handleClick","visible","titleHeight","shadowRoot","querySelector","clientHeight","alertTitleWrap","render","variant","heading","message","titleAbove","dismissible","announced","showDefaultIcon","theme","h","Host","role","class","IcThemeForegroundEnum","Dark","isSlotUsed","name","innerHTML","VARIANT_ICONS","icon","closeIcon","onClick","title"],"sources":["src/components/ic-alert/ic-alert.css?tag=ic-alert&encapsulation=shadow","src/components/ic-alert/ic-alert.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: block;\n}\n\n:host ::slotted(ic-typography) {\n --ic-typography-color: var(--ic-alert-description);\n}\n\n.container {\n min-height: 3.5rem;\n border-radius: var(--ic-border-radius);\n position: relative;\n display: flex;\n align-items: center;\n}\n\n.container-neutral {\n background-color: var(--ic-alert-background-neutral);\n}\n\n.container-info {\n background-color: var(--ic-alert-background-info);\n}\n\n.container-warning {\n background-color: var(--ic-alert-background-warning);\n}\n\n.container-error {\n background-color: var(--ic-alert-background-error);\n}\n\n.container-success {\n background-color: var(--ic-alert-background-success);\n}\n\n.alert-icon-container {\n height: 100%;\n display: flex;\n align-items: center;\n}\n\n.divider {\n height: 100%;\n width: var(--ic-space-xs);\n border-radius: var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);\n position: absolute;\n}\n\n.divider-neutral {\n background-color: var(--ic-alert-status-type-neutral);\n}\n\n.divider-info {\n background-color: var(--ic-alert-status-type-info);\n}\n\n.divider-warning {\n background-color: var(--ic-alert-status-type-warning);\n}\n\n.divider-error {\n background-color: var(--ic-alert-status-type-error);\n}\n\n.divider-success {\n background-color: var(--ic-alert-status-type-success);\n}\n\n.alert-icon {\n height: var(--ic-space-lg);\n width: 1.375rem;\n margin-left: 1.125rem;\n}\n\n.icon-placeholder {\n margin-left: var(--ic-space-xs);\n}\n\n.alert-icon > svg {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n display: inline-block;\n}\n\n/* required for Gatsby as prop does not seem to work when set to false */\n:host([showdefaulticon=\"false\"]) .icon-neutral {\n visibility: hidden;\n width: 0;\n margin-left: 0.625rem;\n}\n\n.icon-neutral > svg,\n::slotted(svg) {\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n display: inline-block;\n fill: var(--ic-alert-icon-neutral);\n}\n\n:host([variant=\"info\"]) .alert-icon svg {\n fill: var(--ic-alert-icon-info);\n}\n\n:host([variant=\"warning\"]) .alert-icon svg {\n fill: var(--ic-alert-icon-warning);\n}\n\n:host([variant=\"error\"]) .alert-icon svg {\n fill: var(--ic-alert-icon-error);\n}\n\n:host([variant=\"success\"]) .alert-icon svg {\n fill: var(--ic-alert-icon-success);\n}\n\n.alert-content {\n display: flex;\n align-items: center;\n margin-left: 0.625rem;\n width: 100%;\n}\n\n.alert-message {\n display: flex;\n align-items: center;\n padding: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n flex: 1;\n --ic-typography-color: var(--ic-alert-description);\n}\n\n.alert-message-title-above {\n display: inline;\n}\n\n.alert-title {\n margin-right: var(--ic-space-xs);\n --ic-typography-color: var(--ic-alert-title);\n}\n\n.alert-title-above {\n white-space: normal;\n}\n\n.alert-action-container {\n margin-right: var(--ic-space-xs);\n display: flex;\n align-items: center;\n}\n\n.dismiss-icon {\n margin-right: var(--ic-space-xxxs);\n margin-left: -0.375rem;\n padding: 0.375rem;\n border: none;\n border-radius: 50%;\n background-color: inherit;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.dismiss-icon > svg {\n color: var(--ic-alert-icon-dismissible);\n}\n\n.dismiss-icon:hover {\n cursor: pointer;\n}\n\n@media (max-width: 628px) {\n .alert-content {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n }\n\n .alert-message {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n }\n\n .alert-title {\n white-space: normal;\n }\n\n .alert-action-container {\n margin-bottom: var(--ic-space-xs);\n }\n}\n\n@media (forced-colors: active) {\n .container {\n border: var(--ic-border-hc);\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n State,\n Listen,\n Prop,\n h,\n forceUpdate,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport { isSlotUsed, checkSlotInChildMutations } from \"../../utils/helpers\";\nimport {\n IcThemeForegroundEnum,\n IcStatusVariants,\n IcThemeMode,\n} from \"../../utils/types\";\nimport { VARIANT_ICONS } from \"../../utils/constants\";\n\n/**\n * @slot message - Content is placed to the right of the title.\n * @slot action - Content is placed to the right of the message.\n * @slot neutral-icon - A custom neutral icon is placed to the left of the title. This will override the default icon if used.\n */\n@Component({\n tag: \"ic-alert\",\n styleUrl: \"ic-alert.css\",\n shadow: true,\n})\nexport class Alert {\n private hostMutationObserver: MutationObserver = null;\n\n @Element() el: HTMLIcAlertElement;\n\n @State() alertTitleWrap: boolean = false;\n @State() visible: boolean = true;\n\n /**\n * If `true`, the alert will have the 'alert' ARIA role and will be announced to screen readers.\n */\n @Prop() announced?: boolean = true;\n\n /**\n * If `true`, the alert will have a close icon at the end to dismiss it.\n */\n @Prop() dismissible?: boolean = false;\n\n /**\n * The optional title to display at the start of the alert.\n */\n @Prop() heading?: string = \"\";\n\n /**\n * The main body message of the alert.\n */\n @Prop() message?: string;\n\n /**\n * If `true`, the default icon for the neutral variant will appear on the left of the alert.\n */\n @Prop() showDefaultIcon: boolean = true;\n\n /**\n * 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.\n */\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /**\n * If `true`, the title and message will appear above and below instead of inline.\n */\n @Prop() titleAbove?: boolean = false;\n\n /**\n * The variant of the alert which will be rendered.\n */\n @Prop() variant?: IcStatusVariants = \"neutral\";\n\n /**\n * Is emitted when the user dismisses the alert.\n */\n @Event() icDismiss: EventEmitter<void>;\n\n disconnectedCallback(): void {\n this.hostMutationObserver?.disconnect();\n }\n\n componentDidLoad(): void {\n this.alertTitleShouldWrap();\n\n this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n\n @Listen(\"icDismiss\", { capture: true })\n handleClick(): void {\n this.visible = !this.visible;\n }\n\n private dismissAction = (): void => {\n this.icDismiss.emit();\n };\n\n private alertTitleShouldWrap() {\n const titleHeight =\n this.el.shadowRoot.querySelector(\".alert-title\")?.clientHeight;\n if (titleHeight > 24) this.alertTitleWrap = true;\n }\n\n private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n if (\n mutationList.some(({ type, addedNodes, removedNodes }) =>\n type === \"childList\"\n ? checkSlotInChildMutations(addedNodes, removedNodes, \"action\")\n : false\n )\n ) {\n forceUpdate(this);\n }\n };\n\n render() {\n const {\n variant,\n heading,\n message,\n titleAbove,\n dismissible,\n announced,\n visible,\n showDefaultIcon,\n theme,\n } = this;\n\n return (\n visible && (\n <Host\n role={announced ? \"alert\" : null}\n class={{\n [IcThemeForegroundEnum.Dark]: true,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n <div\n class={{\n [\"container\"]: true,\n [`container-${variant}`]: true,\n }}\n >\n <div class=\"alert-icon-container\">\n <div\n class={{\n [\"divider\"]: true,\n [`divider-${variant}`]: true,\n }}\n ></div>\n {variant === \"neutral\" ? (\n isSlotUsed(this.el, \"neutral-icon\") ? (\n <div class=\"alert-icon svg-container icon-neutral\">\n <slot name=\"neutral-icon\"></slot>\n </div>\n ) : showDefaultIcon ? (\n <span\n class={{\n [\"alert-icon\"]: true,\n [\"svg-container\"]: true,\n [`icon-${variant}`]: true,\n }}\n innerHTML={VARIANT_ICONS[variant].icon}\n ></span>\n ) : (\n <div class=\"icon-placeholder\"></div>\n )\n ) : (\n <span\n class={{\n [\"alert-icon\"]: true,\n [\"svg-container\"]: true,\n [`icon-${variant}`]: true,\n }}\n innerHTML={VARIANT_ICONS[variant].icon}\n ></span>\n )}\n </div>\n <div class=\"alert-content\">\n <div\n class={{\n [\"alert-message\"]: true,\n [\"alert-message-title-above\"]:\n titleAbove || this.alertTitleWrap,\n }}\n >\n {heading && (\n <ic-typography\n class={{\n [\"alert-title\"]: true,\n [\"alert-title-above\"]: titleAbove || this.alertTitleWrap,\n }}\n variant=\"subtitle-large\"\n >\n <p>{heading}</p>\n </ic-typography>\n )}\n <slot name=\"message\">\n <ic-typography variant=\"body\">{message}</ic-typography>\n </slot>\n </div>\n {isSlotUsed(this.el, \"action\") && (\n <div class=\"alert-action-container\">\n <slot name=\"action\" />\n </div>\n )}\n </div>\n <div class=\"dismiss-icon-container\">\n {dismissible && (\n <ic-button\n class={{\n [\"svg-container\"]: true,\n [\"dismiss-icon\"]: true,\n }}\n innerHTML={closeIcon}\n onClick={this.dismissAction}\n variant=\"icon\"\n title=\"dismiss\"\n ></ic-button>\n )}\n </div>\n </div>\n </Host>\n )\n );\n }\n}\n"],"mappings":"oKAAA,MAAMA,EAAa,uvK,MC+BNC,EAAK,M,8DACRC,KAAAC,qBAAyC,KAsEzCD,KAAAE,cAAgB,KACtBF,KAAKG,UAAUC,MAAM,EASfJ,KAAAK,qBAAwBC,IAC9B,GACEA,EAAaC,MAAK,EAAGC,OAAMC,aAAYC,kBACrCF,IAAS,YACLG,EAA0BF,EAAYC,EAAc,UACpD,QAEN,CACAE,EAAYZ,K,uBApFmB,M,aACP,K,eAKE,K,iBAKE,M,aAKL,G,4CAUQ,K,WAKL,U,gBAKC,M,aAKM,S,CAOrC,oBAAAa,G,OACEC,EAAAd,KAAKC,wBAAoB,MAAAa,SAAA,SAAAA,EAAEC,Y,CAG7B,gBAAAC,GACEhB,KAAKiB,uBAELjB,KAAKC,qBAAuB,IAAIiB,iBAAiBlB,KAAKK,sBACtDL,KAAKC,qBAAqBkB,QAAQnB,KAAKoB,GAAI,CACzCC,UAAW,M,CAKf,WAAAC,GACEtB,KAAKuB,SAAWvB,KAAKuB,O,CAOf,oBAAAN,G,MACN,MAAMO,GACJV,EAAAd,KAAKoB,GAAGK,WAAWC,cAAc,mBAAe,MAAAZ,SAAA,SAAAA,EAAEa,aACpD,GAAIH,EAAc,GAAIxB,KAAK4B,eAAiB,I,CAe9C,MAAAC,GACE,MAAMC,QACJA,EAAOC,QACPA,EAAOC,QACPA,EAAOC,WACPA,EAAUC,YACVA,EAAWC,UACXA,EAASZ,QACTA,EAAOa,gBACPA,EAAeC,MACfA,GACErC,KAEJ,OACEuB,GACEe,EAACC,EAAI,CACHC,KAAML,EAAY,QAAU,KAC5BM,MAAO,CACL,CAACC,EAAsBC,MAAO,KAC9B,CAAC,YAAYN,KAAUA,IAAU,YAGnCC,EAAA,OACEG,MAAO,CACL,CAAC,aAAc,KACf,CAAC,aAAaX,KAAY,OAG5BQ,EAAA,OAAKG,MAAM,wBACTH,EAAA,OACEG,MAAO,CACL,CAAC,WAAY,KACb,CAAC,WAAWX,KAAY,QAG3BA,IAAY,UACXc,EAAW5C,KAAKoB,GAAI,gBAClBkB,EAAA,OAAKG,MAAM,yCACTH,EAAA,QAAMO,KAAK,kBAEXT,EACFE,EAAA,QACEG,MAAO,CACL,CAAC,cAAe,KAChB,CAAC,iBAAkB,KACnB,CAAC,QAAQX,KAAY,MAEvBgB,UAAWC,EAAcjB,GAASkB,OAGpCV,EAAA,OAAKG,MAAM,qBAGbH,EAAA,QACEG,MAAO,CACL,CAAC,cAAe,KAChB,CAAC,iBAAkB,KACnB,CAAC,QAAQX,KAAY,MAEvBgB,UAAWC,EAAcjB,GAASkB,QAIxCV,EAAA,OAAKG,MAAM,iBACTH,EAAA,OACEG,MAAO,CACL,CAAC,iBAAkB,KACnB,CAAC,6BACCR,GAAcjC,KAAK4B,iBAGtBG,GACCO,EAAA,iBACEG,MAAO,CACL,CAAC,eAAgB,KACjB,CAAC,qBAAsBR,GAAcjC,KAAK4B,gBAE5CE,QAAQ,kBAERQ,EAAA,SAAIP,IAGRO,EAAA,QAAMO,KAAK,WACTP,EAAA,iBAAeR,QAAQ,QAAQE,KAGlCY,EAAW5C,KAAKoB,GAAI,WACnBkB,EAAA,OAAKG,MAAM,0BACTH,EAAA,QAAMO,KAAK,aAIjBP,EAAA,OAAKG,MAAM,0BACRP,GACCI,EAAA,aACEG,MAAO,CACL,CAAC,iBAAkB,KACnB,CAAC,gBAAiB,MAEpBK,UAAWG,EACXC,QAASlD,KAAKE,cACd4B,QAAQ,OACRqB,MAAM,c"}
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as i,c as t,f as s,h as e,H as h,g as a}from"./p-6b5e91e2.js";import{c as l,B as o,z as n,C as r,k as c,v as d,r as u,j as p,a as f,l as b,n as v,p as m,E as g,I as x,w,F as y}from"./p-b7eb8ef9.js";const k=`<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">\n<path d="M7 9.5L12 14.5L17 9.5H7Z" fill="currentColor" />\n</svg>\n`;const z=`<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">\n<path d="M12.6666 4.27334L11.7266 3.33334L7.99998 7.06001L4.27331 3.33334L3.33331 4.27334L7.05998 8.00001L3.33331 11.7267L4.27331 12.6667L7.99998 8.94001L11.7266 12.6667L12.6666 11.7267L8.93998 8.00001L12.6666 4.27334Z" fill="currentColor" />\n</svg>\n`;const L='/*! 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;position:relative;--ic-input-label-helpertext-padding:var(--ic-space-xxs);--menu-max-height:100px}:host(.ic-select-full-width){width:100%}ic-input-component-container:hover{--border-color:var(--ic-action-dark-hover)}ic-input-component-container:active{--border-color:var(--ic-action-dark-pressed);color:var(--ic-action-dark-pressed)}ic-input-component-container.menu-open{--border-color:var(--ic-architectural-400);color:var(--ic-action-dark)}ic-input-validation .status-icon,ic-input-validation .statustext{visibility:visible}ic-input-validation.menu-open .status-icon,ic-input-validation.menu-open .statustext{visibility:hidden;transition:visibility 0s}ic-input-label{margin-bottom:var(--ic-space-xs) !important}select{border:0;border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);color:var(--ic-color-text-primary);line-height:1.5rem;letter-spacing:0.005rem;width:100%;height:100%;padding-left:0.375rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-repeat:no-repeat;background-position:right 0.375rem center;background-image:url("data:image/svg+xml;utf8,<svg fill=\'black\' height=\'24\' viewBox=\'0 0 24 24\' width=\'24\' xmlns=\'http://www.w3.org/2000/svg\'><path d=\'M7 10l5 5 5-5z\'/><path d=\'M0 0h24v24H0z\' fill=\'none\'/></svg>")}select option,.select-option-selected{color:var(--ic-color-text-primary)}select:disabled{color:var(--ic-architectural-200);background-image:url("data:image/svg+xml;utf8,<svg fill=\'grey\' height=\'24\' viewBox=\'0 0 24 24\' width=\'24\' xmlns=\'http://www.w3.org/2000/svg\'><path d=\'M7 10l5 5 5-5z\'/><path d=\'M0 0h24v24H0z\' fill=\'none\'/></svg>")}select:focus{border:0;outline:0}select:not([disabled]){cursor:pointer}.select-container{width:100%;display:flex;align-items:center;position:relative}.select-input{width:100%;height:100%;padding:0 0.375rem;display:flex;cursor:pointer;align-items:center;justify-content:space-between;background:none;border:none}.select-input:focus{outline:var(--ic-hc-focus-outline)}:host(:not(.ic-select-disabled)) ic-input-component-container:hover .select-input{background-color:var(--ic-architectural-white)}.select-input[disabled]{pointer-events:none}:host(.ic-select-searchable) .select-input{cursor:auto}.select-input.with-clear-button{padding-right:0}.value-text{max-width:calc(100% - (var(--ic-space-lg) + var(--ic-space-xxs)));box-sizing:border-box;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-bottom:0 !important}.value-text.with-clear-button{padding-right:calc(var(--ic-space-xl) + var(--ic-space-xs))}.searchable-select-container{align-items:center;display:flex;width:100%;position:relative}.expand-icon{height:var(--ic-space-lg);padding-left:var(--ic-space-xxs);color:var(--ic-action-dark)}.expand-icon>svg{display:inline-block;width:var(--ic-space-lg);height:var(--ic-space-lg)}:host(.ic-select-disabled) .expand-icon,:host(.ic-select-disabled) .expand-icon>svg>path{color:var(--ic-architectural-200)}:host(.ic-select-searchable) .expand-icon{padding-left:0;height:2.25rem}:host(.ic-select-searchable) .expand-icon>svg{height:2.25rem;padding:0 calc(var(--ic-space-xxxs) + var(--ic-space-xxs)) 0\n var(--ic-space-xxs)}:host(.ic-select-searchable:not(.ic-select-disabled)) .expand-icon>svg{cursor:pointer}.expand-icon-open{color:var(--ic-action-dark)}.expand-icon-open,:host(.ic-select-searchable) .expand-icon-open{transform:rotateX(180deg)}:host(.ic-select-disabled) .value-text,.placeholder{color:var(--ic-color-text-tertiary)}.select-input-end{display:flex;align-items:center}.clear-button-container{display:flex;align-items:center}.divider{width:var(--ic-space-1px);background-color:var(--ic-architectural-400);margin:var(--ic-space-xxs) 0;border-radius:var(--ic-space-1px);height:var(--ic-space-lg)}:host(.ic-select-small) .divider{height:var(--ic-space-md)}:host(.ic-select-large) .divider{height:var(--ic-space-xl)}.clear-button{position:absolute;right:calc(var(--ic-space-xl) + var(--ic-space-xxs) - var(--ic-space-1px));border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n border-radius var(--ic-easing-transition)}.clear-button:focus{background-color:var(--ic-color-focus-inner);box-shadow:inset 0 0 0 0.125rem var(--ic-color-focus-outer);border-radius:0.25rem}.clear-button:focus *{fill:white}.clear-button.searchable{position:static}.searchable-select-results-status,.multi-select-selected-count{border:0;clip:rect(0, 0, 0, 0, 0);height:var(--ic-space-1px);overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:var(--ic-space-1px)}::slotted([slot="icon"]){fill:var(--ic-color-text-tertiary)}.has-value ::slotted([slot="icon"]){fill:var(--ic-color-text-primary)}.readonly ::slotted([slot="icon"]){padding:0.375rem;margin-bottom:0.75rem}@media (forced-colors: active){.has-value ::slotted([slot="icon"]){fill:currentcolor}}';let C=0;const M=[...w,"tabindex","title"];const T=class{constructor(e){i(this,e);this.icBlur=t(this,"icBlur",7);this.icChange=t(this,"icChange",7);this.icClear=t(this,"icClear",7);this.icClose=t(this,"icClose",7);this.icFocus=t(this,"icFocus",7);this.icInput=t(this,"icInput",7);this.icOpen=t(this,"icOpen",7);this.icOptionSelect=t(this,"icOptionSelect",7);this.icOptionDeselect=t(this,"icOptionDeselect",7);this.icRetryLoad=t(this,"icRetryLoad",7);this.hasSetDefaultValue=false;this.inheritedAttributes={};this.initialOptionsEmpty=false;this.inputId=`ic-select-input-${C++}`;this.menuId=`${this.inputId}-menu`;this.searchableMenuItemSelected=false;this.ungroupedOptions=[];this.hostMutationObserver=null;this.hostMutationCallback=i=>{let t=false;i.forEach((({attributeName:i,type:s,addedNodes:e,removedNodes:h})=>{if(M.includes(i)){this.inheritedAttributes[i]=this.el.getAttribute(i);t=true}else if(s==="childList"){t=l(e,h,"icon")}}));if(t){s(this)}};this.handleRetry=i=>{var t;if(i.detail.keyPressed)(t=this.searchableSelectElement)===null||t===void 0?void 0:t.focus();this.blurredBecauseButtonPressed=true;this.retryButtonClick=true;this.hasSetDefaultValue=true;this.icRetryLoad.emit({value:this.hiddenInputValue})};this.emitIcChange=i=>{if(!this.searchable){if(this.multiple&&!Array.isArray(i)&&i!==null){this.handleMultipleSelectChange(i)}else{this.value=i}}clearTimeout(this.debounceIcChange);this.debounceIcChange=window.setTimeout((()=>{const t=this.multiple?this.value:i;this.icChange.emit({value:t})}),this.currDebounce)};this.emitImmediateIcChange=i=>{this.value=i;clearTimeout(this.debounceIcChange);this.icChange.emit({value:i})};this.deduplicateOptions=i=>{const t=[];const s=[];let e;i.forEach((i=>{if(i.children){e=[];i.children.forEach((i=>{if(t.includes(i.value)){console.warn(`ic-select with label ${this.label} was populated with duplicate option (value: ${i.value}) which has been removed.`)}else{t.push(i.value);e.push(i)}}));const h=Object.assign(Object.assign({},i),{children:e});s.push(h)}else{if(t.includes(i.value)){console.warn(`ic-select with label ${this.label} was populated with duplicate option (value: ${i.value}) which has been removed.`)}else{t.push(i.value);s.push(i)}}}));return s};this.setOptionsValuesFromLabels=()=>{var i;if(((i=this.options)===null||i===void 0?void 0:i.length)>0&&this.options.map){this.options.map((i=>{if(!i.value){i.value=i.label}}))}};this.setUngroupedOptions=i=>{this.ungroupedOptions=i.detail.options};this.setTextColor=()=>{if(this.nativeSelectElement.selectedIndex===0){this.nativeSelectElement.className="placeholder"}else{this.nativeSelectElement.className="select-option-selected"}};this.setMenuChange=i=>{if(this.open!==i){this.open=i}};this.getLabelFromValue=i=>o(i,this.uniqueOptions);this.getMultipleOptionsString=i=>{const t=i===null||i===void 0?void 0:i.map((i=>this.getLabelFromValue(i)));return t===null||t===void 0?void 0:t.join(", ")};this.getFilteredChildMenuOptions=i=>{let t=i.children;if(this.searchable){t=n(i.children,this.includeDescriptionsInSearch,this.searchableSelectInputValue,this.searchMatchPosition)}else{t=n(i.children,false,this.pressedCharacters,"start")}const s=Object.assign({},i);s.children=t;return s};this.getValueSortedByOptions=i=>{const t=i;const s=this.ungroupedOptions.map((i=>i.value));t.sort(((i,t)=>s.indexOf(i)-s.indexOf(t)));return t};this.handleNativeSelectChange=()=>{this.icOptionSelect.emit({value:this.nativeSelectElement.value});this.emitImmediateIcChange(this.nativeSelectElement.value);this.setTextColor()};this.handleCustomSelectChange=i=>{var t;const s=i.detail.value;if(this.searchable&&i.detail.label===this.emptyOptionListText){this.searchableSelectElement.focus();return}if(this.searchable){this.value=s;this.searchableMenuItemSelected=true;if(this.value===this.currValue){this.searchableSelectInputValue=this.getLabelFromValue(this.value)}this.inputValueToFilter=null;this.hiddenInputValue=this.getValueFromLabel(this.searchableSelectInputValue)}if(this.multiple&&((t=this.value)===null||t===void 0?void 0:t.includes(s))){this.icOptionDeselect.emit({value:s})}else{this.icOptionSelect.emit({value:s})}this.ariaActiveDescendant=i.detail.optionId;this.emitIcChange(s)};this.handleMultipleSelectChange=i=>{if(this.value){let t=this.value.slice();if(this.value.includes(i)){const s=t.indexOf(i);t.splice(s,1)}else{t.push(i);t=this.getValueSortedByOptions(t)}this.value=t.length===0?null:t}else{const t=[];t.push(i);this.value=t}};this.handleSelectAllChange=i=>{const t=i.detail.select;const s=this.ungroupedOptions.filter((i=>!i.disabled));const e=s.map((i=>i.value));let h;if(t){let i;if(this.value){i=e.filter((i=>this.value&&!this.value.includes(i)))}else{i=e}i.forEach((i=>this.icOptionSelect.emit({value:i})));h=e}else{this.value.forEach((i=>this.icOptionDeselect.emit({value:i})));h=null}this.emitIcChange(h)};this.handleMenuChange=i=>{this.open=i.detail.open;this.pressedCharacters="";this.searchable&&this.handleFocusIndicatorDisplay()};this.handleMenuKeyPress=i=>{i.cancelBubble=true;if(!this.multiple){this.handleCharacterKeyDown(i.detail.key)}};this.handleFocusIndicatorDisplay=()=>{const i=this.el.shadowRoot.querySelector(".focus-indicator");if(this.open){i.classList.add("focus-indicator-enabled")}else{i.classList.remove("focus-indicator-enabled")}};this.handleMouseDown=i=>{if(!this.open){i.preventDefault()}};this.isExternalFiltering=()=>this.searchable&&this.disableAutoFiltering;this.handleClick=i=>{var t;if(!this.open){if(this.isExternalFiltering()){this.menu.options=this.filteredOptions}else if(!this.hasTimedOut&&!this.loading&&!((t=this.noOptions)===null||t===void 0?void 0:t.length)&&(!this.searchable||this.searchableMenuItemSelected)){this.noOptions=null;this.menu.options=this.uniqueOptions}}if(i.detail!==0){this.menu.handleClickOpen()}};this.handleExpandIconMouseDown=i=>{if(!this.disabled){i.preventDefault();this.searchableSelectElement.focus();this.handleClick(i)}};this.handleClear=i=>{i.stopPropagation();this.hasTimedOut=false;clearTimeout(this.timeoutTimer);this.noOptions=null;this.emitImmediateIcChange(null);this.icClear.emit();if(this.searchable){this.searchableSelectElement.value=null;this.searchableSelectInputValue=null;this.filteredOptions=this.uniqueOptions;this.hiddenInputValue=null;this.searchableSelectElement.focus()}else{this.customSelectElement.focus()}};this.handleCharacterKeyDown=i=>{if(this.open&&i===" "&&this.pressedCharacters.length===0&&!this.hasTimedOut&&!this.loading){this.setMenuChange(false)}if(i.length===1&&!this.searchable){window.clearTimeout(this.characterKeyPressTimer);this.characterKeyPressTimer=window.setTimeout((()=>this.pressedCharacters=""),1e3);if(!(i===" "&&!this.pressedCharacters)){this.pressedCharacters+=i;this.handleFilter();if(!this.noOptions){this.emitImmediateIcChange(this.filteredOptions[0].value)}}}else{this.pressedCharacters=""}};this.handleNativeSelectKeyDown=i=>{if(i.key!=="Escape"&&i.key!=="Tab"||this.open){i.cancelBubble=true}this.handleCharacterKeyDown(i.key)};this.handleKeyDown=i=>{if(i.key!=="Escape"&&i.key!=="Tab"||this.open){i.cancelBubble=true}const t=i.key==="ArrowDown"||i.key==="ArrowUp";if(!this.open){if(this.isExternalFiltering()&&(i.key==="Enter"||t)){this.menu.options=this.filteredOptions}else{if(!this.hasTimedOut){this.noOptions=null;this.menu.options=this.uniqueOptions}}}if(this.open&&i.key==="Enter"){this.setMenuChange(false)}else{if(!(t&&this.noOptions!==null)){if(!(i.key===" "&&this.pressedCharacters.length>0)){this.menu.handleKeyboardOpen(i)}if(!this.multiple){this.handleCharacterKeyDown(i.key)}}}};this.handleClearButtonFocus=()=>{this.clearButtonFocused=true};this.handleClearButtonBlur=i=>{var t;const s=(t=this.menu)===null||t===void 0?void 0:t.querySelector("#retry-button");if(!(this.searchableSelectElement&&i.relatedTarget===this.searchableSelectElement)&&!(s&&i.relatedTarget===s)){this.setMenuChange(false);this.handleFocusIndicatorDisplay()}this.clearButtonFocused=false};this.handleFilter=()=>{var i;const t=this.deduplicateOptions(this.searchable?[...this.uniqueOptions]:this.ungroupedOptions);let s=false;let e=[];t.map((i=>{if(i.children)s=true}));let h;if(this.searchable){h=n(t,this.includeDescriptionsInSearch,this.inputValueToFilter,this.searchMatchPosition);this.searchableMenuItemSelected=false}else{h=n(t,false,this.pressedCharacters,"start")}if(!s&&((i=h[0])===null||i===void 0?void 0:i.label)!==this.emptyOptionListText){e=h}else if(s){t.map((i=>{if(this.includeGroupTitlesInSearch){if(h.indexOf(i)!==-1){e.push(i)}else{e.push(this.getFilteredChildMenuOptions(i))}}else{e.push(this.getFilteredChildMenuOptions(i))}}))}let a=false;if(s){a=true;e.map((i=>{if(i.children.length>0){a=false}}))}if(e.length>0&&!a){this.noOptions=null;this.filteredOptions=e}else{this.noOptions=[{label:this.emptyOptionListText,value:""}];this.filteredOptions=this.noOptions}};this.triggerLoading=()=>{this.hasTimedOut=false;this.noOptions=[{label:this.loadingLabel,value:"",loading:true}];if(this.filteredOptions!==this.noOptions&&this.searchable){this.filteredOptions=this.noOptions}else if(this.uniqueOptions!==this.noOptions&&!this.searchable){this.uniqueOptions=this.noOptions}if(this.timeout){this.timeoutTimer=window.setTimeout((()=>{this.loading=false;this.hasTimedOut=true;this.noOptions=[{label:this.loadingErrorLabel,value:"",timedOut:true}];this.filteredOptions=this.noOptions;if(!this.searchable)this.uniqueOptions=this.noOptions}),this.timeout)}};this.getValueFromLabel=i=>{var t;return(t=this.uniqueOptions.find((t=>t.label===i)))===null||t===void 0?void 0:t.value};this.handleSearchableSelectInput=i=>{this.searchableSelectInputValue=i.target.value;this.icInput.emit({value:this.searchableSelectInputValue});this.emitIcChange(this.searchableSelectInputValue);this.hiddenInputValue=this.searchableSelectInputValue;this.inputValueToFilter=this.searchableSelectInputValue;this.setMenuChange(true);if(!this.disableAutoFiltering){this.handleFilter();this.debounceAriaLiveUpdate()}};this.updateSearchableSelectResultAriaLive=()=>{const i=this.el.shadowRoot.querySelector(".searchable-select-results-status");if(i){if(this.noOptions!==null){i.innerText=this.emptyOptionListText}else{i.innerText=""}}};this.updateMultiSelectedCountAriaLive=()=>{var i;const t=this.el.shadowRoot.querySelector(".multi-select-selected-count");const s=`${(i=this.currValue)===null||i===void 0?void 0:i.length} of ${r(this.options)} selected`;if(t&&t.innerText!==s){t.innerText=s}};this.getDefaultValue=i=>this.getLabelFromValue(i)||i||null;this.setDefaultValue=()=>{if(!this.hasSetDefaultValue&&this.currValue){this.searchableSelectInputValue=this.searchable&&this.getDefaultValue(this.currValue);this.initialValue=this.currValue;this.hasSetDefaultValue=true}};this.onFocus=()=>{this.icFocus.emit()};this.onBlur=({relatedTarget:i})=>{var t;const s=i;if(s!==null&&(s.tagName==="UL"&&s.className.includes("menu")||s.tagName==="LI"&&s.className.includes("option"))){return}const e=(t=this.menu)===null||t===void 0?void 0:t.querySelector("#retry-button");const h=this.searchable&&!!this.menu&&s!==this.menu&&!Array.from(this.menu.querySelectorAll("[role='option']")).includes(s)&&!(this.clearButton&&s===this.clearButton)&&!(e&&s===e);if(h){if(!this.retryButtonClick){this.setMenuChange(false)}this.handleFocusIndicatorDisplay()}this.retryButtonClick=false;this.icBlur.emit()};this.onTimeoutBlur=i=>{if(i.detail.ev.relatedTarget!==this.searchableSelectElement&&!this.blurredBecauseButtonPressed){this.setMenuChange(false);this.handleFocusIndicatorDisplay();this.icBlur.emit()}this.blurredBecauseButtonPressed=false};this.handleFormReset=()=>{this.value=this.initialValue;if(this.searchable){this.searchableSelectInputValue=this.getDefaultValue(this.value);this.hiddenInputValue=this.value}};this.ariaActiveDescendant=undefined;this.clearButtonFocused=false;this.debounceIcChange=undefined;this.hiddenInputValue=undefined;this.noOptions=null;this.open=false;this.pressedCharacters="";this.searchableSelectInputValue=null;this.disabled=false;this.disableAutoFiltering=false;this.emptyOptionListText="No results found";this.form=undefined;this.fullWidth=false;this.helperText="";this.hideLabel=false;this.includeDescriptionsInSearch=false;this.includeGroupTitlesInSearch=false;this.label=undefined;this.loadingErrorLabel="Loading Error";this.loadingLabel="Loading...";this.multiple=false;this.name=this.inputId;this.placeholder="Select an option";this.readonly=false;this.required=false;this.searchable=false;this.searchMatchPosition="anywhere";this.selectOnEnter=false;this.showClearButton=false;this.size="medium";this.timeout=undefined;this.validationStatus="";this.validationText="";this.loading=false;this.options=[];this.filteredOptions=this.options;this.uniqueOptions=this.options;this.debounce=0;this.currDebounce=this.debounce;this.value=undefined;this.initialValue=this.value;this.inputValueToFilter=this.value;this.currValue=this.value}loadingHandler(i){i&&this.triggerLoading()}watchOptionsHandler(){var i;if(!this.hasTimedOut&&this.options!==this.noOptions){this.loading=false;clearTimeout(this.timeoutTimer);if(this.isExternalFiltering()){if(((i=this.options)===null||i===void 0?void 0:i.length)>0){this.setOptionsValuesFromLabels();this.noOptions=null;this.uniqueOptions=this.deduplicateOptions(this.options);this.filteredOptions=this.uniqueOptions}else{this.noOptions=[{label:this.emptyOptionListText,value:""}];this.uniqueOptions=this.noOptions;this.filteredOptions=this.noOptions}this.updateSearchableSelectResultAriaLive();this.setDefaultValue()}else{this.setOptionsValuesFromLabels();this.uniqueOptions=this.deduplicateOptions(this.options);this.filteredOptions=this.uniqueOptions;if(this.initialOptionsEmpty){this.setDefaultValue();this.initialOptionsEmpty=false}}}else{if(!this.searchable){this.options=this.noOptions}}}debounceChangedHandler(i){this.updateOnChangeDebounce(i)}valueChangedHandler(){if(this.value!==this.currValue){if(this.value&&this.multiple){this.currValue=this.getValueSortedByOptions(this.value);this.updateMultiSelectedCountAriaLive()}else{this.currValue=this.value}}if(this.searchable){this.searchableSelectInputValue=this.getLabelFromValue(this.currValue)||this.currValue}}openChangedHandler(){this.open?this.icOpen.emit():this.icClose.emit()}disconnectedCallback(){var i;c(this.el,this.handleFormReset);(i=this.hostMutationObserver)===null||i===void 0?void 0:i.disconnect()}componentWillLoad(){var i;this.inheritedAttributes=d(this.el,M);u(this.disabled,this.el);this.setOptionsValuesFromLabels();p(this.el,this.handleFormReset);if(!((i=this.options)===null||i===void 0?void 0:i.length)){this.initialOptionsEmpty=true;this.noOptions=[{label:this.emptyOptionListText,value:""}];this.uniqueOptions=this.noOptions;this.filteredOptions=this.noOptions}else{this.setDefaultValue();this.uniqueOptions=this.deduplicateOptions(this.options)}}componentDidLoad(){f([{prop:this.label,propName:"label"}],"Select");if(this.loading){this.triggerLoading()}this.hiddenInputValue=this.searchable&&this.currValue;this.hostMutationObserver=new MutationObserver(this.hostMutationCallback);this.hostMutationObserver.observe(this.el,{attributes:true,childList:true})}componentDidRender(){if(this.nativeSelectElement&&!this.disabled){this.setTextColor()}}async setFocus(){if(this.nativeSelectElement){this.nativeSelectElement.focus()}else if(this.customSelectElement){this.customSelectElement.focus()}else if(this.searchableSelectElement){this.searchableSelectElement.focus()}}updateOnChangeDebounce(i){if(this.currDebounce!==i){this.currDebounce=i}}debounceAriaLiveUpdate(){clearTimeout(this.debounceAria);window.setTimeout((()=>{this.updateSearchableSelectResultAriaLive()}),800)}render(){const{size:i,disabled:t,fullWidth:s,helperText:a,hideLabel:l,label:o,menuId:n,multiple:c,name:d,options:u,placeholder:p,readonly:f,required:w,searchable:L,showClearButton:C,validationStatus:M,validationText:T,currValue:$}=this;b(true,this.el,d,this.searchable?this.hiddenInputValue:$,t);const H=`${M===y.Error}`;const O=v(this.inputId,a!=="",m(this.validationStatus,this.disabled)).trim();let B=!!this.el.querySelector(`[slot="icon"]`);if(B&&(t||f&&!this.value)){B=false}const j=`${$===null||$===void 0?void 0:$.length} of ${r(this.options)} selected`;return e(h,{class:{["ic-select-disabled"]:t,["ic-select-searchable"]:L,[`ic-select-${i}`]:i!=="medium",["ic-select-full-width"]:s},onBlur:this.onBlur},e("ic-input-container",{readonly:f},!l&&e("ic-input-label",{for:this.inputId,label:o,helperText:a,required:w,disabled:t,readonly:f}),e("ic-input-component-container",{ref:i=>this.anchorEl=i,class:{"menu-open":this.open},size:i,fullWidth:s,disabled:t,readonly:f,validationStatus:M},B&&e("span",{slot:"left-icon",class:{["readonly"]:f,["has-value"]:!!this.value}},e("slot",{name:"icon"})),f?e("ic-typography",null,e("p",null,c?this.getMultipleOptionsString($):this.getLabelFromValue($))):g()&&!c?e("select",Object.assign({ref:i=>this.nativeSelectElement=i,disabled:t,onChange:this.handleNativeSelectChange,required:w,id:this.inputId,"aria-label":o,"aria-describedby":O,"aria-invalid":H,onBlur:this.onBlur,onFocus:this.onFocus,onKeyDown:this.handleNativeSelectKeyDown,form:this.form},this.inheritedAttributes),e("option",{value:"",selected:true,disabled:!C},p),u.map((i=>{if(i.children){return e("optgroup",{label:i.label},i.children.map((i=>e("option",{value:i.value,disabled:i.disabled,selected:i.value===$},i.label))))}else{return e("option",{value:i.value,disabled:i.disabled,selected:i.value===$},i.label)}}))):L?e("div",{class:"searchable-select-container"},e("input",{class:{"select-input":true,"with-clear-button":!!this.searchableSelectInputValue},role:"combobox",autocomplete:"off","aria-label":o,"aria-describedby":O,"aria-activedescendant":this.ariaActiveDescendant,"aria-autocomplete":"list","aria-expanded":`${this.open}`,"aria-invalid":H,"aria-required":`${w}`,"aria-controls":n,ref:i=>this.searchableSelectElement=i,id:this.inputId,value:this.searchableSelectInputValue,placeholder:p,disabled:t,onInput:this.handleSearchableSelectInput,onClick:this.handleClick,onKeyDown:this.handleKeyDown,onFocus:this.onFocus,onBlur:this.onBlur,form:this.form}),this.searchableSelectInputValue&&(C||L)&&e("div",{class:"clear-button-container"},e("ic-button",{id:"clear-button",ref:i=>this.clearButton=i,"aria-label":this.searchableSelectInputValue&&$===null?"Clear input":"Clear selection",class:"clear-button",innerHTML:z,onClick:this.handleClear,onFocus:this.handleClearButtonFocus,onBlur:this.handleClearButtonBlur,size:i,variant:"icon",appearance:this.clearButtonFocused?x.Light:x.Dark}),e("div",{class:"divider"})),e("span",{onMouseDown:this.handleExpandIconMouseDown,class:{"expand-icon":true,"expand-icon-open":this.open},innerHTML:k,"aria-hidden":"true"}),e("div",{"aria-live":"polite",role:"status",class:"searchable-select-results-status"})):e("div",{class:"select-container"},e("button",{class:"select-input",ref:i=>this.customSelectElement=i,id:this.inputId,"aria-label":`${o}, ${(c&&$?`${j}, ${this.getMultipleOptionsString($)}`:this.getLabelFromValue($))||p}${w?", required":""}`,"aria-describedby":O,"aria-invalid":H,"aria-haspopup":"listbox","aria-expanded":this.open?"true":"false","aria-owns":n,"aria-controls":n,disabled:t,onBlur:this.onBlur,onFocus:this.onFocus,onClick:this.handleClick,onMouseDown:this.handleMouseDown,onKeyDown:this.handleKeyDown},e("ic-typography",{variant:"body",class:{"value-text":true,"with-clear-button":$&&C,placeholder:!this.value||c&&this.value.length<1}},(c?this.getMultipleOptionsString($):this.getLabelFromValue($))||p),e("div",{class:"select-input-end"},$&&C&&e("div",{class:"divider"}),e("span",{class:{"expand-icon":true,"expand-icon-open":this.open},innerHTML:k,"aria-hidden":"true"}))),$&&C&&e("ic-button",{id:"clear-button","aria-label":"Clear selection",class:"clear-button",innerHTML:z,onClick:this.handleClear,onFocus:this.handleClearButtonFocus,onBlur:this.handleClearButtonBlur,size:i,variant:"icon",appearance:this.clearButtonFocused?x.Light:x.Dark}))),(!g()||c)&&e("ic-menu",{class:{"no-results":this.loading||this.hasTimedOut||this.noOptions!==null&&this.noOptions[0]&&this.noOptions[0].label===this.emptyOptionListText},ref:i=>this.menu=i,inputEl:L?this.searchableSelectElement:this.customSelectElement,inputLabel:o,anchorEl:this.anchorEl,size:i,menuId:n,open:this.open,options:L?this.filteredOptions:this.uniqueOptions,value:c?$:$,fullWidth:s,selectOnEnter:this.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:this.searchable||c||this.selectOnEnter?"manual":"automatic",closeOnSelect:!c}),this.multiple&&e("div",{"aria-live":"polite",role:"status",class:"multi-select-selected-count"}),m(this.validationStatus,this.disabled)&&e("ic-input-validation",{class:{"menu-open":this.open},ariaLiveMode:"polite",status:M,message:T,for:this.inputId})))}static get delegatesFocus(){return true}get el(){return a(this)}static get watchers(){return{loading:["loadingHandler"],options:["watchOptionsHandler"],debounce:["debounceChangedHandler"],value:["valueChangedHandler"],open:["openChangedHandler"]}}};T.style=L;export{T as ic_select};
|
2
|
-
//# sourceMappingURL=p-2eae9b27.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icSelectCss","inputIds","MUTABLE_ATTRIBUTES","IC_INHERITED_ARIA","Select","this","hasSetDefaultValue","inheritedAttributes","initialOptionsEmpty","inputId","menuId","searchableMenuItemSelected","ungroupedOptions","hostMutationObserver","hostMutationCallback","mutationList","forceComponentUpdate","forEach","attributeName","type","addedNodes","removedNodes","includes","el","getAttribute","checkSlotInChildMutations","forceUpdate","handleRetry","ev","detail","keyPressed","_a","searchableSelectElement","focus","blurredBecauseButtonPressed","retryButtonClick","icRetryLoad","emit","value","hiddenInputValue","emitIcChange","searchable","multiple","Array","isArray","handleMultipleSelectChange","clearTimeout","debounceIcChange","window","setTimeout","valueToEmit","icChange","currDebounce","emitImmediateIcChange","deduplicateOptions","options","uniqueValues","dedupedOptions","dedupedChildren","option","children","child","console","warn","label","push","modifiedParent","Object","assign","setOptionsValuesFromLabels","length","map","setUngroupedOptions","event","setTextColor","nativeSelectElement","selectedIndex","className","setMenuChange","open","getLabelFromValue","uniqueOptions","getMultipleOptionsString","selectedValues","selectedLabels","join","getFilteredChildMenuOptions","getFilteredMenuOptions","includeDescriptionsInSearch","searchableSelectInputValue","searchMatchPosition","pressedCharacters","newOption","getValueSortedByOptions","valueArray","valuesFromAllOptions","sort","a","b","indexOf","handleNativeSelectChange","icOptionSelect","handleCustomSelectChange","emptyOptionListText","currValue","inputValueToFilter","getValueFromLabel","icOptionDeselect","ariaActiveDescendant","optionId","slice","valueIndex","splice","handleSelectAllChange","selectAllOptions","select","allEnabledOptions","filter","disabled","allValues","newValue","unselectedValues","handleMenuChange","handleFocusIndicatorDisplay","handleMenuKeyPress","cancelBubble","handleCharacterKeyDown","key","focusIndicator","shadowRoot","querySelector","classList","add","remove","handleMouseDown","preventDefault","isExternalFiltering","disableAutoFiltering","handleClick","menu","filteredOptions","hasTimedOut","loading","noOptions","handleClickOpen","handleExpandIconMouseDown","handleClear","stopPropagation","timeoutTimer","icClear","customSelectElement","characterKeyPressTimer","handleFilter","handleNativeSelectKeyDown","handleKeyDown","isArrowKey","handleKeyboardOpen","handleClearButtonFocus","clearButtonFocused","handleClearButtonBlur","retryButton","relatedTarget","isGrouped","newFilteredOptions","menuOptionsFiltered","includeGroupTitlesInSearch","noChildOptionsWhenFiltered","triggerLoading","loadingLabel","timeout","loadingErrorLabel","timedOut","find","handleSearchableSelectInput","target","icInput","debounceAriaLiveUpdate","updateSearchableSelectResultAriaLive","searchableSelectResultsStatusEl","innerText","updateMultiSelectedCountAriaLive","multiSelectSelectedCountEl","selectedCount","getOptionsWithoutGroupTitlesCount","getDefaultValue","setDefaultValue","initialValue","onFocus","icFocus","onBlur","tagName","isSearchableAndNoFocusedInternalElements","from","querySelectorAll","clearButton","icBlur","onTimeoutBlur","handleFormReset","debounce","loadingHandler","watchOptionsHandler","debounceChangedHandler","updateOnChangeDebounce","valueChangedHandler","openChangedHandler","icOpen","icClose","disconnectedCallback","removeFormResetListener","disconnect","componentWillLoad","inheritAttributes","removeDisabledFalse","addFormResetListener","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","MutationObserver","observe","attributes","childList","componentDidRender","setFocus","debounceAria","render","size","fullWidth","helperText","hideLabel","name","placeholder","readonly","required","showClearButton","validationStatus","validationText","renderHiddenInput","invalid","IcInformationStatus","Error","describedBy","getInputDescribedByText","hasValidationStatus","trim","showLeftIcon","optionsSelectedCount","h","Host","class","for","ref","anchorEl","slot","isMobileOrTablet","onChange","id","onKeyDown","form","selected","role","autocomplete","onInput","onClick","innerHTML","Clear","variant","appearance","IcThemeForegroundEnum","Light","Dark","onMouseDown","Expand","inputEl","inputLabel","selectOnEnter","onMenuStateChange","onMenuOptionSelect","onMenuOptionSelectAll","onMenuKeyPress","onUngroupedOptionsSet","onRetryButtonClicked","parentEl","activationType","closeOnSelect","ariaLiveMode","status","message"],"sources":["src/components/ic-select/ic-select.css?tag=ic-select&encapsulation=shadow","src/components/ic-select/ic-select.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --input-width: Width of the input field\n * @prop --menu-width: Width of the dropdown menu\n * @prop --ic-z-index-menu: z-index of select menu\n */\n\n:host {\n display: block;\n position: relative;\n\n --ic-input-label-helpertext-padding: var(--ic-space-xxs);\n --menu-max-height: 100px;\n}\n\n:host(.ic-select-full-width) {\n width: 100%;\n}\n\nic-input-component-container:hover {\n --border-color: var(--ic-action-dark-hover);\n}\n\nic-input-component-container:active {\n --border-color: var(--ic-action-dark-pressed);\n\n color: var(--ic-action-dark-pressed);\n}\n\nic-input-component-container.menu-open {\n --border-color: var(--ic-architectural-400);\n\n color: var(--ic-action-dark);\n}\n\nic-input-validation .status-icon,\nic-input-validation .statustext {\n visibility: visible;\n}\n\nic-input-validation.menu-open .status-icon,\nic-input-validation.menu-open .statustext {\n visibility: hidden;\n transition: visibility 0s;\n}\n\nic-input-label {\n margin-bottom: var(--ic-space-xs) !important;\n}\n\nselect {\n border: 0;\n border-radius: var(--ic-border-radius);\n background-color: var(--ic-architectural-white);\n color: var(--ic-color-text-primary);\n line-height: 1.5rem;\n letter-spacing: 0.005rem;\n width: 100%;\n height: 100%;\n padding-left: 0.375rem;\n appearance: none;\n background-repeat: no-repeat;\n background-position: right 0.375rem center;\n background-image: url(\"data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>\");\n}\n\nselect option,\n.select-option-selected {\n color: var(--ic-color-text-primary);\n}\n\nselect:disabled {\n color: var(--ic-architectural-200);\n background-image: url(\"data:image/svg+xml;utf8,<svg fill='grey' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>\");\n}\n\nselect:focus {\n border: 0;\n outline: 0;\n}\n\nselect:not([disabled]) {\n cursor: pointer;\n}\n\n.select-container {\n width: 100%;\n display: flex;\n align-items: center;\n position: relative;\n}\n\n.select-input {\n width: 100%;\n height: 100%;\n padding: 0 0.375rem;\n display: flex;\n cursor: pointer;\n align-items: center;\n justify-content: space-between;\n background: none;\n border: none;\n}\n\n.select-input:focus {\n outline: var(--ic-hc-focus-outline);\n}\n\n:host(:not(.ic-select-disabled))\n ic-input-component-container:hover\n .select-input {\n background-color: var(--ic-architectural-white);\n}\n\n.select-input[disabled] {\n pointer-events: none;\n}\n\n:host(.ic-select-searchable) .select-input {\n cursor: auto;\n}\n\n.select-input.with-clear-button {\n padding-right: 0;\n}\n\n.value-text {\n max-width: calc(100% - (var(--ic-space-lg) + var(--ic-space-xxs)));\n box-sizing: border-box;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n margin-bottom: 0 !important;\n}\n\n.value-text.with-clear-button {\n padding-right: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n.searchable-select-container {\n align-items: center;\n display: flex;\n width: 100%;\n position: relative;\n}\n\n.expand-icon {\n height: var(--ic-space-lg);\n padding-left: var(--ic-space-xxs);\n color: var(--ic-action-dark);\n}\n\n.expand-icon > svg {\n display: inline-block;\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n:host(.ic-select-disabled) .expand-icon,\n:host(.ic-select-disabled) .expand-icon > svg > path {\n color: var(--ic-architectural-200);\n}\n\n:host(.ic-select-searchable) .expand-icon {\n padding-left: 0;\n height: 2.25rem;\n}\n\n:host(.ic-select-searchable) .expand-icon > svg {\n height: 2.25rem;\n padding: 0 calc(var(--ic-space-xxxs) + var(--ic-space-xxs)) 0\n var(--ic-space-xxs);\n}\n\n:host(.ic-select-searchable:not(.ic-select-disabled)) .expand-icon > svg {\n cursor: pointer;\n}\n\n.expand-icon-open {\n color: var(--ic-action-dark);\n}\n\n.expand-icon-open,\n:host(.ic-select-searchable) .expand-icon-open {\n transform: rotateX(180deg);\n}\n\n:host(.ic-select-disabled) .value-text,\n.placeholder {\n color: var(--ic-color-text-tertiary);\n}\n\n.select-input-end {\n display: flex;\n align-items: center;\n}\n\n.clear-button-container {\n display: flex;\n align-items: center;\n}\n\n.divider {\n width: var(--ic-space-1px);\n background-color: var(--ic-architectural-400);\n margin: var(--ic-space-xxs) 0;\n border-radius: var(--ic-space-1px);\n height: var(--ic-space-lg);\n}\n\n:host(.ic-select-small) .divider {\n height: var(--ic-space-md);\n}\n\n:host(.ic-select-large) .divider {\n height: var(--ic-space-xl);\n}\n\n.clear-button {\n position: absolute;\n right: calc(var(--ic-space-xl) + var(--ic-space-xxs) - var(--ic-space-1px));\n border-radius: var(--ic-border-radius);\n transition: box-shadow var(--ic-easing-transition),\n border-radius var(--ic-easing-transition);\n}\n\n.clear-button:focus {\n background-color: var(--ic-color-focus-inner);\n box-shadow: inset 0 0 0 0.125rem var(--ic-color-focus-outer);\n border-radius: 0.25rem;\n}\n\n.clear-button:focus * {\n fill: white;\n}\n\n.clear-button.searchable {\n position: static;\n}\n\n.searchable-select-results-status,\n.multi-select-selected-count {\n border: 0;\n clip: rect(0, 0, 0, 0, 0);\n height: var(--ic-space-1px);\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: var(--ic-space-1px);\n}\n\n::slotted([slot=\"icon\"]) {\n fill: var(--ic-color-text-tertiary);\n}\n\n.has-value ::slotted([slot=\"icon\"]) {\n fill: var(--ic-color-text-primary);\n}\n\n.readonly ::slotted([slot=\"icon\"]) {\n padding: 0.375rem;\n margin-bottom: 0.75rem;\n}\n\n@media (forced-colors: active) {\n .has-value ::slotted([slot=\"icon\"]) {\n fill: currentcolor;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Method,\n Prop,\n h,\n State,\n Watch,\n forceUpdate,\n} from \"@stencil/core\";\n\nimport {\n getInputDescribedByText,\n getLabelFromValue,\n hasValidationStatus,\n inheritAttributes,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n isMobileOrTablet,\n getFilteredMenuOptions,\n getOptionsWithoutGroupTitlesCount,\n addFormResetListener,\n removeFormResetListener,\n removeDisabledFalse,\n checkSlotInChildMutations,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n IcInformationStatus,\n IcInformationStatusOrEmpty,\n IcMenuOption,\n IcSearchMatchPositions,\n IcThemeForegroundEnum,\n IcValueEventDetail,\n IcSizes,\n} from \"../../utils/types\";\nimport Expand from \"./assets/Expand.svg\";\nimport Clear from \"./assets/Clear.svg\";\nimport { IcOptionSelectEventDetail } from \"../ic-menu/ic-menu.types\";\n\nlet inputIds = 0;\nconst MUTABLE_ATTRIBUTES = [...IC_INHERITED_ARIA, \"tabindex\", \"title\"];\n\n/**\n * @slot icon - Content will be placed to the left of the select text input.\n */\n@Component({\n tag: \"ic-select\",\n styleUrl: \"ic-select.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Select {\n private anchorEl: HTMLElement;\n private blurredBecauseButtonPressed: boolean;\n private characterKeyPressTimer: number;\n private clearButton: HTMLIcButtonElement;\n private customSelectElement: HTMLButtonElement;\n private debounceAria: number;\n private hasSetDefaultValue = false;\n private hasTimedOut: boolean;\n private inheritedAttributes: { [k: string]: string } = {};\n private initialOptionsEmpty = false;\n private inputId = `ic-select-input-${inputIds++}`;\n private menu: HTMLIcMenuElement;\n private menuId = `${this.inputId}-menu`;\n private nativeSelectElement: HTMLSelectElement;\n private retryButtonClick: boolean;\n private searchableMenuItemSelected: boolean = false;\n private searchableSelectElement: HTMLInputElement;\n private timeoutTimer: number;\n private ungroupedOptions: IcMenuOption[] = [];\n private hostMutationObserver: MutationObserver = null;\n\n @Element() el!: HTMLIcSelectElement;\n\n @State() ariaActiveDescendant: string;\n @State() clearButtonFocused: boolean = false;\n @State() debounceIcChange: number;\n @State() hiddenInputValue: string;\n @State() noOptions: IcMenuOption[] = null;\n @State() open: boolean = false;\n @State() pressedCharacters: string = \"\";\n @State() searchableSelectInputValue: string = null;\n\n /**\n * If `true`, the disabled state will be set.\n */\n @Prop({ reflect: true }) disabled?: boolean = false;\n\n /**\n * If `true`, the built in filtering will be disabled for a searchable variant. For example, if options will already be filtered from external source.\n */\n @Prop() disableAutoFiltering?: boolean = false;\n\n /**\n * The text displayed when there are no options in the option list.\n */\n @Prop() emptyOptionListText = \"No results found\";\n\n /**\n * The <form> element to associate the select with.\n */\n @Prop() form?: string;\n\n /**\n * If `true`, the select will fill the width of the container.\n */\n @Prop() fullWidth: boolean = false;\n\n /**\n * The helper text that will be displayed for additional field guidance.\n */\n @Prop() helperText?: string = \"\";\n\n /**\n * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n */\n @Prop() hideLabel?: boolean = false;\n\n /**\n * If `true`, descriptions of options will be included when filtering options in a searchable select. Only applies to built in filtering.\n */\n @Prop() includeDescriptionsInSearch?: boolean = false;\n\n /**\n * If `true`, group titles of grouped options will be included when filtering options in a searchable select. Only applies to built in filtering.\n */\n @Prop() includeGroupTitlesInSearch?: boolean = false;\n\n /**\n * The label for the select.\n */\n @Prop() label!: string;\n\n /**\n * The message displayed when external loading times out.\n */\n @Prop() loadingErrorLabel?: string = \"Loading Error\";\n\n /**\n * The message displayed whilst the options are being loaded externally.\n */\n @Prop() loadingLabel?: string = \"Loading...\";\n\n /**\n * If `true`, multiple options can be selected.\n */\n @Prop() multiple?: boolean = false;\n\n /**\n * The name of the control, which is submitted with the form data.\n */\n @Prop() name?: string = this.inputId;\n\n /**\n * The placeholder value to be displayed.\n */\n @Prop() placeholder?: string = \"Select an option\";\n\n /**\n * If `true`, the readonly state will be set.\n */\n @Prop() readonly?: boolean = false;\n\n /**\n * If `true`, the select will require a value.\n */\n @Prop() required?: boolean = false;\n\n /**\n * If `true`, a searchable variant of the select will be displayed which can be typed in to filter options.\n */\n @Prop() searchable?: boolean = false;\n\n /**\n * Whether the search string of the searchable select should match the start of or anywhere in the options. Only applies to built in filtering.\n */\n @Prop() searchMatchPosition?: IcSearchMatchPositions = \"anywhere\";\n\n /**\n * If `true`, the icOptionSelect event will be fired on enter instead of ArrowUp and ArrowDown on the single select.\n */\n @Prop() selectOnEnter?: boolean = false;\n\n /**\n * If `true`, a button which clears the select input when clicked will be displayed. The button will always appear on the searchable select.\n */\n @Prop() showClearButton?: boolean = false;\n\n /**\n * The size of the select.\n */\n @Prop() size?: IcSizes = \"medium\";\n\n /**\n * If using external filtering, set a timeout for when loading takes too long.\n */\n @Prop() timeout?: number;\n\n /**\n * The validation status - e.g. 'error' | 'warning' | 'success'.\n */\n @Prop() validationStatus?: IcInformationStatusOrEmpty = \"\";\n\n /**\n * The text to display as the validation message.\n */\n @Prop() validationText?: string = \"\";\n\n /**\n * If `true`, the loading state will be triggered when fetching options asynchronously.\n */\n @Prop({ mutable: true }) loading?: boolean = false;\n\n @Watch(\"loading\")\n loadingHandler(newValue: boolean): void {\n newValue && this.triggerLoading();\n }\n\n /**\n * The possible selection options.\n */\n @Prop() options?: IcMenuOption[] = [];\n @State() filteredOptions: IcMenuOption[] = this.options;\n @State() uniqueOptions: IcMenuOption[] = this.options;\n\n @Watch(\"options\")\n watchOptionsHandler(): void {\n if (!this.hasTimedOut && this.options !== this.noOptions) {\n this.loading = false;\n clearTimeout(this.timeoutTimer);\n if (this.isExternalFiltering()) {\n // When searchable select\n if (this.options?.length > 0) {\n this.setOptionsValuesFromLabels();\n this.noOptions = null;\n this.uniqueOptions = this.deduplicateOptions(this.options);\n this.filteredOptions = this.uniqueOptions;\n } else {\n this.noOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n this.uniqueOptions = this.noOptions;\n this.filteredOptions = this.noOptions;\n }\n this.updateSearchableSelectResultAriaLive();\n this.setDefaultValue();\n } else {\n this.setOptionsValuesFromLabels();\n this.uniqueOptions = this.deduplicateOptions(this.options);\n this.filteredOptions = this.uniqueOptions;\n if (this.initialOptionsEmpty) {\n this.setDefaultValue();\n this.initialOptionsEmpty = false;\n }\n }\n } else {\n if (!this.searchable) {\n this.options = this.noOptions;\n }\n }\n }\n\n /**\n * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n */\n @Prop() debounce?: number = 0;\n @State() currDebounce = this.debounce;\n\n @Watch(\"debounce\")\n debounceChangedHandler(newValue: number): void {\n this.updateOnChangeDebounce(newValue);\n }\n\n /**\n * The value of the select, reflected by the value of the currently selected option.\n * For the searchable variant, the value is also reflected by the user input.\n * For the multi-select variant, the value must be an array of option values.\n */\n @Prop({ mutable: true }) value?: string | string[];\n @State() initialValue = this.value;\n @State() inputValueToFilter = this.value as string;\n @State() currValue = this.value;\n\n @Watch(\"value\")\n valueChangedHandler(): void {\n if (this.value !== this.currValue) {\n if (this.value && this.multiple) {\n this.currValue = this.getValueSortedByOptions(this.value as string[]);\n this.updateMultiSelectedCountAriaLive();\n } else {\n this.currValue = this.value;\n }\n }\n\n if (this.searchable) {\n this.searchableSelectInputValue =\n this.getLabelFromValue(this.currValue as string) ||\n (this.currValue as string);\n }\n }\n\n @Watch(\"open\")\n openChangedHandler(): void {\n this.open ? this.icOpen.emit() : this.icClose.emit();\n }\n\n /**\n * Emitted when the select loses focus.\n */\n @Event() icBlur: EventEmitter<void>;\n\n /**\n * Emitted when the value changes.\n */\n @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n /**\n * Emitted when the clear button is clicked.\n */\n @Event() icClear: EventEmitter<void>;\n\n /**\n * Emitted when the select options menu is closed.\n */\n @Event() icClose: EventEmitter<void>;\n\n /**\n * Emitted when the select gains focus.\n */\n @Event() icFocus: EventEmitter<void>;\n\n /**\n * Emitted when a keyboard input occurred.\n */\n @Event() icInput: EventEmitter<IcValueEventDetail>;\n\n /**\n * Emitted when the select options menu is opened.\n */\n @Event() icOpen: EventEmitter<void>;\n\n /**\n * Emitted when an option is selected.\n * Selecting an option will also trigger an `icChange/onIcChange` due to the value being updated.\n */\n @Event() icOptionSelect: EventEmitter<IcOptionSelectEventDetail>;\n\n /**\n * Emitted when `multiple` is `true` and an option is deselected.\n */\n @Event() icOptionDeselect: EventEmitter<IcOptionSelectEventDetail>;\n\n /**\n * Emitted when the 'retry loading' button is clicked for a searchable variant.\n */\n @Event() icRetryLoad: EventEmitter<IcValueEventDetail>;\n\n disconnectedCallback(): void {\n removeFormResetListener(this.el, this.handleFormReset);\n this.hostMutationObserver?.disconnect();\n }\n\n componentWillLoad(): void {\n this.inheritedAttributes = inheritAttributes(this.el, MUTABLE_ATTRIBUTES);\n\n removeDisabledFalse(this.disabled, this.el);\n\n this.setOptionsValuesFromLabels();\n\n addFormResetListener(this.el, this.handleFormReset);\n\n if (!this.options?.length) {\n this.initialOptionsEmpty = true;\n this.noOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n this.uniqueOptions = this.noOptions;\n this.filteredOptions = this.noOptions;\n } else {\n this.setDefaultValue();\n this.uniqueOptions = this.deduplicateOptions(this.options);\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Select\"\n );\n\n if (this.loading) {\n this.triggerLoading();\n }\n\n this.hiddenInputValue = this.searchable && (this.currValue as string);\n\n this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n this.hostMutationObserver.observe(this.el, {\n attributes: true,\n childList: true,\n });\n }\n\n componentDidRender(): void {\n if (this.nativeSelectElement && !this.disabled) {\n this.setTextColor();\n }\n }\n\n /**\n * Sets focus on the input box.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.nativeSelectElement) {\n this.nativeSelectElement.focus();\n } else if (this.customSelectElement) {\n this.customSelectElement.focus();\n } else if (this.searchableSelectElement) {\n this.searchableSelectElement.focus();\n }\n }\n\n // triggered when attributes of host element change\n private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n let forceComponentUpdate = false;\n mutationList.forEach(\n ({ attributeName, type, addedNodes, removedNodes }) => {\n if (MUTABLE_ATTRIBUTES.includes(attributeName)) {\n this.inheritedAttributes[attributeName] =\n this.el.getAttribute(attributeName);\n forceComponentUpdate = true;\n } else if (type === \"childList\") {\n forceComponentUpdate = checkSlotInChildMutations(\n addedNodes,\n removedNodes,\n \"icon\"\n );\n }\n }\n );\n if (forceComponentUpdate) {\n forceUpdate(this);\n }\n };\n\n private handleRetry = (ev: CustomEvent<IcValueEventDetail>) => {\n if (ev.detail.keyPressed) this.searchableSelectElement?.focus();\n this.blurredBecauseButtonPressed = true;\n this.retryButtonClick = true;\n this.hasSetDefaultValue = true;\n this.icRetryLoad.emit({ value: this.hiddenInputValue });\n };\n\n private updateOnChangeDebounce(newValue: number) {\n if (this.currDebounce !== newValue) {\n this.currDebounce = newValue;\n }\n }\n\n private emitIcChange = (value: string | string[] | null) => {\n if (!this.searchable) {\n // If \"Select all\" button clicked, replace value with new value (array of all option values)\n if (this.multiple && !Array.isArray(value) && value !== null) {\n this.handleMultipleSelectChange(value as string);\n } else {\n this.value = value;\n }\n }\n\n clearTimeout(this.debounceIcChange);\n this.debounceIcChange = window.setTimeout(() => {\n const valueToEmit = this.multiple ? this.value : value;\n this.icChange.emit({ value: valueToEmit });\n }, this.currDebounce);\n };\n\n private emitImmediateIcChange = (value: string) => {\n this.value = value;\n clearTimeout(this.debounceIcChange);\n this.icChange.emit({ value });\n };\n\n /**\n * Processes the provided array of IcMenuOptions, removing duplicates and reporting them with a console.warn\n * @param options array of IcMenuOptions\n * @returns a new options object, with all entries possessing a duplicate 'value' field removed\n */\n private deduplicateOptions = (options: IcMenuOption[]): IcMenuOption[] => {\n const uniqueValues: string[] = [];\n const dedupedOptions: IcMenuOption[] = [];\n let dedupedChildren: IcMenuOption[];\n\n options.forEach((option: IcMenuOption) => {\n if (option.children) {\n //If an option has children, we will loop through them\n dedupedChildren = [];\n option.children.forEach((child) => {\n if (uniqueValues.includes(child.value)) {\n console.warn(\n `ic-select with label ${this.label} was populated with duplicate option (value: ${child.value}) which has been removed.`\n );\n } else {\n uniqueValues.push(child.value);\n dedupedChildren.push(child);\n }\n });\n // construct a modified option, inserting the deduplicated children alongside the original information\n const modifiedParent: IcMenuOption = {\n ...option,\n children: dedupedChildren,\n };\n dedupedOptions.push(modifiedParent);\n } else {\n // If an option does not have children, assess to see if it's value has been included already\n if (uniqueValues.includes(option.value)) {\n console.warn(\n `ic-select with label ${this.label} was populated with duplicate option (value: ${option.value}) which has been removed.`\n );\n } else {\n uniqueValues.push(option.value);\n dedupedOptions.push(option);\n }\n }\n });\n return dedupedOptions;\n };\n\n /**\n * Loop through options array and for all options with no value, infer it from the label\n */\n private setOptionsValuesFromLabels = (): void => {\n if (this.options?.length > 0 && this.options.map) {\n this.options.map((option) => {\n if (!option.value) {\n option.value = option.label;\n }\n });\n }\n };\n\n private setUngroupedOptions = (event: CustomEvent): void => {\n this.ungroupedOptions = event.detail.options;\n };\n\n private setTextColor = (): void => {\n if (this.nativeSelectElement.selectedIndex === 0) {\n this.nativeSelectElement.className = \"placeholder\";\n } else {\n this.nativeSelectElement.className = \"select-option-selected\";\n }\n };\n\n private setMenuChange = (open: boolean) => {\n if (this.open !== open) {\n this.open = open;\n }\n };\n\n private getLabelFromValue = (value: string): string | undefined => {\n return getLabelFromValue(value, this.uniqueOptions);\n };\n\n private getMultipleOptionsString = (selectedValues: string[]) => {\n const selectedLabels = selectedValues?.map((value) =>\n this.getLabelFromValue(value)\n );\n return selectedLabels?.join(\", \");\n };\n\n private getFilteredChildMenuOptions = (option: IcMenuOption) => {\n let children = option.children;\n\n if (this.searchable) {\n children = getFilteredMenuOptions(\n option.children,\n this.includeDescriptionsInSearch,\n this.searchableSelectInputValue,\n this.searchMatchPosition\n );\n } else {\n children = getFilteredMenuOptions(\n option.children,\n false,\n this.pressedCharacters,\n \"start\"\n );\n }\n\n const newOption = { ...option };\n newOption.children = children;\n return newOption;\n };\n\n // (For multi-select) get value array, i.e. selected option values, in order they appear in option list\n private getValueSortedByOptions = (value: string[]) => {\n const valueArray = value;\n const valuesFromAllOptions = this.ungroupedOptions.map(\n (option) => option.value\n );\n\n valueArray.sort(\n (a, b) =>\n valuesFromAllOptions.indexOf(a) - valuesFromAllOptions.indexOf(b)\n );\n\n return valueArray;\n };\n\n private handleNativeSelectChange = (): void => {\n this.icOptionSelect.emit({ value: this.nativeSelectElement.value });\n this.emitImmediateIcChange(this.nativeSelectElement.value);\n this.setTextColor();\n };\n\n // Handle option select for when a custom input box and menu is rendered\n // (rather than native <select> - rendered when viewed on a mobile / tablet screen)\n private handleCustomSelectChange = (event: CustomEvent): void => {\n const value = event.detail.value;\n\n if (this.searchable && event.detail.label === this.emptyOptionListText) {\n this.searchableSelectElement.focus();\n return;\n }\n\n if (this.searchable) {\n this.value = value;\n this.searchableMenuItemSelected = true;\n\n // After editing the input, if selecting the same option as before, set the input value to label again\n if (this.value === this.currValue) {\n this.searchableSelectInputValue = this.getLabelFromValue(\n this.value as string\n );\n }\n\n this.inputValueToFilter = null;\n this.hiddenInputValue = this.getValueFromLabel(\n this.searchableSelectInputValue\n );\n }\n\n if (this.multiple && this.value?.includes(value)) {\n this.icOptionDeselect.emit({ value });\n } else {\n this.icOptionSelect.emit({ value });\n }\n\n this.ariaActiveDescendant = event.detail.optionId;\n this.emitIcChange(value);\n };\n\n // Update selected options - adds / removes them, in order of option list\n // Create new array if value prop is undefined\n private handleMultipleSelectChange = (value: string) => {\n if (this.value) {\n let valueArray = (this.value as string[]).slice();\n\n if (this.value.includes(value)) {\n const valueIndex = valueArray.indexOf(value);\n valueArray.splice(valueIndex, 1);\n } else {\n valueArray.push(value);\n valueArray = this.getValueSortedByOptions(valueArray);\n }\n\n this.value = valueArray.length === 0 ? null : valueArray;\n } else {\n const valueArray = [];\n valueArray.push(value);\n this.value = valueArray;\n }\n };\n\n private handleSelectAllChange = (event: CustomEvent) => {\n const selectAllOptions = event.detail.select;\n const allEnabledOptions = this.ungroupedOptions.filter(\n (option) => !option.disabled\n );\n const allValues = allEnabledOptions.map((option) => option.value);\n let newValue: string[];\n\n if (selectAllOptions) {\n let unselectedValues;\n\n // Only emit icOptionSelect for all values that are newly selected\n if (this.value) {\n unselectedValues = allValues.filter(\n (value) => this.value && !(this.value as string[]).includes(value)\n );\n } else {\n unselectedValues = allValues;\n }\n\n unselectedValues.forEach((value) => this.icOptionSelect.emit({ value }));\n newValue = allValues;\n } else {\n // Only emit icOptionDeselect for values that were selected\n (this.value as string[]).forEach((value) =>\n this.icOptionDeselect.emit({ value })\n );\n newValue = null;\n }\n\n this.emitIcChange(newValue);\n };\n\n private handleMenuChange = (event: CustomEvent): void => {\n this.open = event.detail.open;\n this.pressedCharacters = \"\";\n\n this.searchable && this.handleFocusIndicatorDisplay();\n };\n\n // clears the debounce delay when navigating the menu with arrow keys etc\n // to prevent delay in change event, which should only occur when typing in input\n private handleMenuKeyPress = (ev: CustomEvent): void => {\n ev.cancelBubble = true;\n if (!this.multiple) {\n this.handleCharacterKeyDown(ev.detail.key);\n }\n };\n\n private handleFocusIndicatorDisplay = () => {\n const focusIndicator = this.el.shadowRoot.querySelector(\".focus-indicator\");\n\n if (this.open) {\n focusIndicator.classList.add(\"focus-indicator-enabled\");\n } else {\n focusIndicator.classList.remove(\"focus-indicator-enabled\");\n }\n };\n\n private handleMouseDown = (event: Event): void => {\n if (!this.open) {\n event.preventDefault();\n }\n };\n\n private isExternalFiltering = (): boolean =>\n this.searchable && this.disableAutoFiltering;\n\n private handleClick = (event: MouseEvent): void => {\n if (!this.open) {\n if (this.isExternalFiltering()) {\n this.menu.options = this.filteredOptions;\n } else if (\n !this.hasTimedOut &&\n !this.loading &&\n !this.noOptions?.length &&\n (!this.searchable || this.searchableMenuItemSelected)\n ) {\n this.noOptions = null;\n this.menu.options = this.uniqueOptions;\n }\n }\n\n if (event.detail !== 0) {\n this.menu.handleClickOpen();\n }\n };\n\n private handleExpandIconMouseDown = (event: MouseEvent) => {\n if (!this.disabled) {\n event.preventDefault();\n this.searchableSelectElement.focus();\n this.handleClick(event);\n }\n };\n\n private handleClear = (event: Event): void => {\n event.stopPropagation();\n this.hasTimedOut = false;\n clearTimeout(this.timeoutTimer);\n this.noOptions = null;\n this.emitImmediateIcChange(null);\n this.icClear.emit();\n\n if (this.searchable) {\n this.searchableSelectElement.value = null;\n this.searchableSelectInputValue = null;\n this.filteredOptions = this.uniqueOptions;\n this.hiddenInputValue = null;\n this.searchableSelectElement.focus();\n } else {\n this.customSelectElement.focus();\n }\n };\n\n private handleCharacterKeyDown = (key: string) => {\n // Only close menu when space is pressed if not being used alongside character keys to quickly select options\n if (\n this.open &&\n key === \" \" &&\n this.pressedCharacters.length === 0 &&\n !this.hasTimedOut &&\n !this.loading\n ) {\n this.setMenuChange(false);\n }\n\n if (key.length === 1 && !this.searchable) {\n window.clearTimeout(this.characterKeyPressTimer);\n this.characterKeyPressTimer = window.setTimeout(\n () => (this.pressedCharacters = \"\"),\n 1000\n );\n\n if (!(key === \" \" && !this.pressedCharacters)) {\n this.pressedCharacters += key;\n this.handleFilter();\n\n if (!this.noOptions) {\n this.emitImmediateIcChange(this.filteredOptions[0].value);\n }\n }\n } else {\n this.pressedCharacters = \"\";\n }\n };\n\n private handleNativeSelectKeyDown = (event: KeyboardEvent) => {\n if ((event.key !== \"Escape\" && event.key !== \"Tab\") || this.open) {\n event.cancelBubble = true;\n }\n this.handleCharacterKeyDown(event.key);\n };\n\n private handleKeyDown = (event: KeyboardEvent): void => {\n if ((event.key !== \"Escape\" && event.key !== \"Tab\") || this.open) {\n event.cancelBubble = true;\n }\n const isArrowKey = event.key === \"ArrowDown\" || event.key === \"ArrowUp\";\n\n if (!this.open) {\n if (this.isExternalFiltering() && (event.key === \"Enter\" || isArrowKey)) {\n this.menu.options = this.filteredOptions;\n } else {\n if (!this.hasTimedOut) {\n this.noOptions = null;\n this.menu.options = this.uniqueOptions;\n }\n }\n }\n\n if (this.open && event.key === \"Enter\") {\n this.setMenuChange(false);\n } else {\n if (!(isArrowKey && this.noOptions !== null)) {\n if (!(event.key === \" \" && this.pressedCharacters.length > 0)) {\n // Keyboard events get passed onto ic-menu\n this.menu.handleKeyboardOpen(event);\n }\n if (!this.multiple) {\n this.handleCharacterKeyDown(event.key);\n }\n }\n }\n };\n\n private handleClearButtonFocus = (): void => {\n this.clearButtonFocused = true;\n };\n\n private handleClearButtonBlur = (ev: FocusEvent): void => {\n const retryButton = this.menu?.querySelector(\"#retry-button\");\n if (\n !(\n this.searchableSelectElement &&\n ev.relatedTarget === this.searchableSelectElement\n ) &&\n !(retryButton && ev.relatedTarget === retryButton)\n ) {\n this.setMenuChange(false);\n this.handleFocusIndicatorDisplay();\n }\n this.clearButtonFocused = false;\n };\n\n private handleFilter = (): void => {\n const options = this.deduplicateOptions(\n this.searchable ? [...this.uniqueOptions] : this.ungroupedOptions\n );\n\n let isGrouped = false;\n let newFilteredOptions: IcMenuOption[] = [];\n\n options.map((option) => {\n if (option.children) isGrouped = true;\n });\n\n let menuOptionsFiltered: IcMenuOption[];\n\n if (this.searchable) {\n menuOptionsFiltered = getFilteredMenuOptions(\n options,\n this.includeDescriptionsInSearch,\n this.inputValueToFilter,\n this.searchMatchPosition\n );\n this.searchableMenuItemSelected = false;\n } else {\n menuOptionsFiltered = getFilteredMenuOptions(\n options,\n false,\n this.pressedCharacters,\n \"start\"\n );\n }\n\n if (\n !isGrouped &&\n menuOptionsFiltered[0]?.label !== this.emptyOptionListText\n ) {\n newFilteredOptions = menuOptionsFiltered;\n } else if (isGrouped) {\n options.map((option) => {\n if (this.includeGroupTitlesInSearch) {\n if (menuOptionsFiltered.indexOf(option) !== -1) {\n newFilteredOptions.push(option);\n } else {\n newFilteredOptions.push(this.getFilteredChildMenuOptions(option));\n }\n } else {\n newFilteredOptions.push(this.getFilteredChildMenuOptions(option));\n }\n });\n }\n\n let noChildOptionsWhenFiltered = false;\n\n if (isGrouped) {\n noChildOptionsWhenFiltered = true;\n newFilteredOptions.map((option) => {\n if (option.children.length > 0) {\n noChildOptionsWhenFiltered = false;\n }\n });\n }\n\n if (newFilteredOptions.length > 0 && !noChildOptionsWhenFiltered) {\n this.noOptions = null;\n this.filteredOptions = newFilteredOptions;\n } else {\n this.noOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n this.filteredOptions = this.noOptions;\n }\n };\n\n /**\n * Put the select component into loading state.\n * Replace options with the loading message. If timeout is enabled, set the timeout and once passed, replace options with the loading error message\n */\n private triggerLoading = () => {\n this.hasTimedOut = false;\n this.noOptions = [{ label: this.loadingLabel, value: \"\", loading: true }];\n if (this.filteredOptions !== this.noOptions && this.searchable) {\n this.filteredOptions = this.noOptions;\n } else if (this.uniqueOptions !== this.noOptions && !this.searchable) {\n this.uniqueOptions = this.noOptions;\n }\n if (this.timeout) {\n this.timeoutTimer = window.setTimeout(() => {\n this.loading = false;\n this.hasTimedOut = true;\n this.noOptions = [\n { label: this.loadingErrorLabel, value: \"\", timedOut: true },\n ];\n this.filteredOptions = this.noOptions;\n if (!this.searchable) this.uniqueOptions = this.noOptions;\n }, this.timeout);\n }\n };\n\n private getValueFromLabel = (label: string): string | undefined => {\n return this.uniqueOptions.find((option) => option.label === label)?.value;\n };\n\n private handleSearchableSelectInput = (event: Event): void => {\n this.searchableSelectInputValue = (event.target as HTMLInputElement).value;\n this.icInput.emit({ value: this.searchableSelectInputValue });\n this.emitIcChange(this.searchableSelectInputValue);\n\n this.hiddenInputValue = this.searchableSelectInputValue;\n this.inputValueToFilter = this.searchableSelectInputValue;\n this.setMenuChange(true);\n\n if (!this.disableAutoFiltering) {\n this.handleFilter();\n this.debounceAriaLiveUpdate();\n }\n };\n\n private updateSearchableSelectResultAriaLive = (): void => {\n const searchableSelectResultsStatusEl = this.el.shadowRoot.querySelector(\n \".searchable-select-results-status\"\n ) as HTMLDivElement;\n\n if (searchableSelectResultsStatusEl) {\n if (this.noOptions !== null) {\n searchableSelectResultsStatusEl.innerText = this.emptyOptionListText;\n } else {\n searchableSelectResultsStatusEl.innerText = \"\";\n }\n }\n };\n\n private debounceAriaLiveUpdate() {\n clearTimeout(this.debounceAria);\n\n window.setTimeout(() => {\n this.updateSearchableSelectResultAriaLive();\n }, 800);\n }\n\n private updateMultiSelectedCountAriaLive = (): void => {\n const multiSelectSelectedCountEl = this.el.shadowRoot.querySelector(\n \".multi-select-selected-count\"\n ) as HTMLDivElement;\n\n const selectedCount = `${\n this.currValue?.length\n } of ${getOptionsWithoutGroupTitlesCount(this.options)} selected`;\n\n if (\n multiSelectSelectedCountEl &&\n multiSelectSelectedCountEl.innerText !== selectedCount\n ) {\n multiSelectSelectedCountEl.innerText = selectedCount;\n }\n };\n\n private getDefaultValue = (value: string): string | null =>\n this.getLabelFromValue(value) || value || null;\n\n private setDefaultValue = (): void => {\n if (!this.hasSetDefaultValue && this.currValue) {\n this.searchableSelectInputValue =\n this.searchable && this.getDefaultValue(this.currValue as string);\n\n this.initialValue = this.currValue;\n this.hasSetDefaultValue = true;\n }\n };\n\n private onFocus = (): void => {\n this.icFocus.emit();\n };\n\n private onBlur = ({ relatedTarget }: FocusEvent): void => {\n const target = relatedTarget as HTMLElement;\n if (\n target !== null &&\n ((target.tagName === \"UL\" && target.className.includes(\"menu\")) ||\n (target.tagName === \"LI\" && target.className.includes(\"option\")))\n ) {\n return;\n }\n\n const retryButton = this.menu?.querySelector(\"#retry-button\");\n const isSearchableAndNoFocusedInternalElements =\n this.searchable &&\n !!this.menu &&\n target !== this.menu &&\n !Array.from(this.menu.querySelectorAll(\"[role='option']\")).includes(\n target\n ) &&\n !(this.clearButton && target === this.clearButton) &&\n !(retryButton && target === retryButton);\n\n if (isSearchableAndNoFocusedInternalElements) {\n if (!this.retryButtonClick) {\n this.setMenuChange(false);\n }\n this.handleFocusIndicatorDisplay();\n }\n\n this.retryButtonClick = false;\n this.icBlur.emit();\n };\n\n private onTimeoutBlur = (ev: CustomEvent) => {\n if (\n (ev.detail.ev as FocusEvent).relatedTarget !==\n this.searchableSelectElement &&\n !this.blurredBecauseButtonPressed\n ) {\n this.setMenuChange(false);\n this.handleFocusIndicatorDisplay();\n this.icBlur.emit();\n }\n this.blurredBecauseButtonPressed = false;\n };\n\n private handleFormReset = (): void => {\n this.value = this.initialValue;\n if (this.searchable) {\n this.searchableSelectInputValue = this.getDefaultValue(\n this.value as string\n );\n this.hiddenInputValue = this.value as string;\n }\n };\n\n render() {\n const {\n size,\n disabled,\n fullWidth,\n helperText,\n hideLabel,\n label,\n menuId,\n multiple,\n name,\n options,\n placeholder,\n readonly,\n required,\n searchable,\n showClearButton,\n validationStatus,\n validationText,\n currValue,\n } = this;\n\n // HTML inputs only accept 'string' for their value\n // Does not cause errors when it is a multi-select - sets value correctly, to a comma-separated string\n renderHiddenInput(\n true,\n this.el,\n name,\n this.searchable ? this.hiddenInputValue : (currValue as string),\n disabled\n );\n\n const invalid = `${validationStatus === IcInformationStatus.Error}`;\n\n const describedBy = getInputDescribedByText(\n this.inputId,\n helperText !== \"\",\n hasValidationStatus(this.validationStatus, this.disabled)\n ).trim();\n\n let showLeftIcon = !!this.el.querySelector(`[slot=\"icon\"]`);\n if (showLeftIcon && (disabled || (readonly && !this.value))) {\n showLeftIcon = false;\n }\n\n const optionsSelectedCount = `${\n currValue?.length\n } of ${getOptionsWithoutGroupTitlesCount(this.options)} selected`;\n\n return (\n <Host\n class={{\n [\"ic-select-disabled\"]: disabled,\n [\"ic-select-searchable\"]: searchable,\n [`ic-select-${size}`]: size !== \"medium\",\n [\"ic-select-full-width\"]: fullWidth,\n }}\n onBlur={this.onBlur}\n >\n <ic-input-container readonly={readonly}>\n {!hideLabel && (\n <ic-input-label\n for={this.inputId}\n label={label}\n helperText={helperText}\n required={required}\n disabled={disabled}\n readonly={readonly}\n ></ic-input-label>\n )}\n <ic-input-component-container\n ref={(el: HTMLElement) => (this.anchorEl = el)}\n class={{ \"menu-open\": this.open }}\n size={size}\n fullWidth={fullWidth}\n disabled={disabled}\n readonly={readonly}\n validationStatus={validationStatus}\n >\n {showLeftIcon && (\n <span\n slot=\"left-icon\"\n class={{\n [\"readonly\"]: readonly,\n [\"has-value\"]: !!this.value,\n }}\n >\n <slot name=\"icon\" />\n </span>\n )}\n {readonly ? (\n <ic-typography>\n <p>\n {multiple\n ? this.getMultipleOptionsString(currValue as string[])\n : this.getLabelFromValue(currValue as string)}\n </p>\n </ic-typography>\n ) : isMobileOrTablet() && !multiple ? (\n <select\n ref={(el) => (this.nativeSelectElement = el)}\n disabled={disabled}\n onChange={this.handleNativeSelectChange}\n required={required}\n id={this.inputId}\n aria-label={label}\n aria-describedby={describedBy}\n aria-invalid={invalid}\n onBlur={this.onBlur}\n onFocus={this.onFocus}\n onKeyDown={this.handleNativeSelectKeyDown}\n form={this.form}\n {...this.inheritedAttributes}\n >\n <option value=\"\" selected disabled={!showClearButton}>\n {placeholder}\n </option>\n {options.map((option) => {\n if (option.children) {\n return (\n <optgroup label={option.label}>\n {option.children.map((option) => (\n <option\n value={option.value}\n disabled={option.disabled}\n selected={option.value === currValue}\n >\n {option.label}\n </option>\n ))}\n </optgroup>\n );\n } else {\n return (\n <option\n value={option.value}\n disabled={option.disabled}\n selected={option.value === currValue}\n >\n {option.label}\n </option>\n );\n }\n })}\n </select>\n ) : searchable ? (\n <div class=\"searchable-select-container\">\n <input\n class={{\n \"select-input\": true,\n \"with-clear-button\": !!this.searchableSelectInputValue,\n }}\n role=\"combobox\"\n autocomplete=\"off\"\n aria-label={label}\n aria-describedby={describedBy}\n aria-activedescendant={this.ariaActiveDescendant}\n aria-autocomplete=\"list\"\n aria-expanded={`${this.open}`}\n aria-invalid={invalid}\n aria-required={`${required}`}\n aria-controls={menuId}\n ref={(el) => (this.searchableSelectElement = el)}\n id={this.inputId}\n value={this.searchableSelectInputValue}\n placeholder={placeholder}\n disabled={disabled}\n onInput={this.handleSearchableSelectInput}\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n form={this.form}\n ></input>\n {this.searchableSelectInputValue &&\n (showClearButton || searchable) && (\n <div class=\"clear-button-container\">\n <ic-button\n id=\"clear-button\"\n ref={(el: HTMLIcButtonElement) =>\n (this.clearButton = el)\n }\n aria-label={\n this.searchableSelectInputValue && currValue === null\n ? \"Clear input\"\n : \"Clear selection\"\n }\n class=\"clear-button\"\n innerHTML={Clear}\n onClick={this.handleClear}\n onFocus={this.handleClearButtonFocus}\n onBlur={this.handleClearButtonBlur}\n size={size}\n variant=\"icon\"\n appearance={\n this.clearButtonFocused\n ? IcThemeForegroundEnum.Light\n : IcThemeForegroundEnum.Dark\n }\n ></ic-button>\n <div class=\"divider\"></div>\n </div>\n )}\n <span\n onMouseDown={this.handleExpandIconMouseDown}\n class={{\n \"expand-icon\": true,\n \"expand-icon-open\": this.open,\n }}\n innerHTML={Expand}\n aria-hidden=\"true\"\n />\n <div\n aria-live=\"polite\"\n role=\"status\"\n class=\"searchable-select-results-status\"\n ></div>\n </div>\n ) : (\n <div class=\"select-container\">\n <button\n class=\"select-input\"\n ref={(el) => (this.customSelectElement = el)}\n id={this.inputId}\n aria-label={`${label}, ${\n (multiple && currValue\n ? `${optionsSelectedCount}, ${this.getMultipleOptionsString(\n currValue as string[]\n )}`\n : this.getLabelFromValue(currValue as string)) ||\n placeholder\n }${required ? \", required\" : \"\"}`}\n aria-describedby={describedBy}\n aria-invalid={invalid}\n aria-haspopup=\"listbox\"\n aria-expanded={this.open ? \"true\" : \"false\"}\n aria-owns={menuId}\n aria-controls={menuId}\n disabled={disabled}\n onBlur={this.onBlur}\n onFocus={this.onFocus}\n onClick={this.handleClick}\n onMouseDown={this.handleMouseDown}\n onKeyDown={this.handleKeyDown}\n >\n <ic-typography\n variant=\"body\"\n class={{\n \"value-text\": true,\n \"with-clear-button\": currValue && showClearButton,\n placeholder:\n !this.value || (multiple && this.value.length < 1),\n }}\n >\n {(multiple\n ? this.getMultipleOptionsString(currValue as string[])\n : this.getLabelFromValue(currValue as string)) ||\n placeholder}\n </ic-typography>\n <div class=\"select-input-end\">\n {currValue && showClearButton && (\n <div class=\"divider\"></div>\n )}\n <span\n class={{\n \"expand-icon\": true,\n \"expand-icon-open\": this.open,\n }}\n innerHTML={Expand}\n aria-hidden=\"true\"\n />\n </div>\n </button>\n {currValue && showClearButton && (\n <ic-button\n id=\"clear-button\"\n aria-label=\"Clear selection\"\n class=\"clear-button\"\n innerHTML={Clear}\n onClick={this.handleClear}\n onFocus={this.handleClearButtonFocus}\n onBlur={this.handleClearButtonBlur}\n size={size}\n variant=\"icon\"\n appearance={\n this.clearButtonFocused\n ? IcThemeForegroundEnum.Light\n : IcThemeForegroundEnum.Dark\n }\n ></ic-button>\n )}\n </div>\n )}\n </ic-input-component-container>\n {(!isMobileOrTablet() || multiple) && (\n <ic-menu\n class={{\n \"no-results\":\n this.loading ||\n this.hasTimedOut ||\n (this.noOptions !== null &&\n this.noOptions[0] &&\n this.noOptions[0].label === this.emptyOptionListText),\n }}\n ref={(el: HTMLIcMenuElement) => (this.menu = el)}\n inputEl={\n searchable\n ? this.searchableSelectElement\n : this.customSelectElement\n }\n inputLabel={label}\n anchorEl={this.anchorEl}\n size={size}\n menuId={menuId}\n open={this.open}\n options={searchable ? this.filteredOptions : this.uniqueOptions}\n value={multiple ? (currValue as string[]) : (currValue as string)}\n fullWidth={fullWidth}\n selectOnEnter={this.selectOnEnter}\n onMenuStateChange={this.handleMenuChange}\n onMenuOptionSelect={this.handleCustomSelectChange}\n onMenuOptionSelectAll={this.handleSelectAllChange}\n onMenuKeyPress={this.handleMenuKeyPress}\n onUngroupedOptionsSet={this.setUngroupedOptions}\n onRetryButtonClicked={this.handleRetry}\n parentEl={this.el}\n onTimeoutBlur={this.onTimeoutBlur}\n activationType={\n this.searchable || multiple || this.selectOnEnter\n ? \"manual\"\n : \"automatic\"\n }\n closeOnSelect={!multiple}\n ></ic-menu>\n )}\n {this.multiple && (\n <div\n aria-live=\"polite\"\n role=\"status\"\n class=\"multi-select-selected-count\"\n ></div>\n )}\n {hasValidationStatus(this.validationStatus, this.disabled) && (\n <ic-input-validation\n class={{ \"menu-open\": this.open }}\n ariaLiveMode=\"polite\"\n status={validationStatus}\n message={validationText}\n for={this.inputId}\n ></ic-input-validation>\n )}\n </ic-input-container>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as e,h as r,H as c,g as o}from"./p-6b5e91e2.js";import{C as i}from"./p-3b185c32.js";import{i as t,d as a}from"./p-b7eb8ef9.js";const s=`<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z" fill="currentColor"/>\n</svg>\n`;const n=':host{display:block;margin:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0}:host .breadcrumb{display:flex;align-items:center;white-space:nowrap;gap:var(--ic-space-xs);min-height:var(--ic-space-lg)}:host .chevron{width:var(--ic-space-lg);height:var(--ic-space-lg)}:host .chevron svg{color:var(--ic-breadcrumb-icon-chevron)}:host(.ic-breadcrumb-monochrome) .chevron svg{color:var(--ic-breadcrumb-icon-chevron-monochrome)}:host(:first-child) .chevron{display:none}.back-icon svg{color:var(--ic-breadcrumb-page-icon)}:host(.ic-breadcrumb-monochrome) .back-icon svg{color:var(--ic-breadcrumb-page-icon-monochrome)}:host(.ic-breadcrumb-back){display:flex;align-items:center}:host(.ic-breadcrumb-back) .chevron{display:none}ic-link{--breadcrumb-link-display:inline-flex;--breadcrumb-link-align-items:center;--breadcrumb-link-gap:var(--ic-space-xs)}:host([aria-current="page"]) .current-page-container{display:flex;align-items:center;gap:var(--ic-space-xs);color:var(--ic-breadcrumb-text)}:host([aria-current="page"].ic-breadcrumb-monochrome) .current-page-container{color:var(--ic-breadcrumb-text-monochrome)}:host(.collapsed-breadcrumb-wrapper){margin-right:var(--ic-space-xs) !important;display:flex;align-items:center;gap:var(--ic-space-xs)}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb){border:none;background-color:transparent;color:var(--ic-color-hyperlink-default);text-decoration:underline;font-weight:var(--ic-font-weight-bold);cursor:pointer}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus){outline:var(--ic-hc-focus-outline);border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none}.hide,:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide){display:none}@media (forced-colors: active){.back-icon svg{color:currentcolor}}@supports (text-underline-offset: 25%){ic-link{--breadcrumb-link-display:flex}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus){text-decoration-line:underline;text-decoration-thickness:25%;text-underline-offset:25%;border-bottom:0 !important;margin-bottom:0 !important}}';const l=class{constructor(c){e(this,c);this.renderDefaultBreadcrumb=(e,c,o,i)=>{const n=c!==null&&a(c)&&c!=="";if(e&&n){return r("span",{class:{"current-page-container":e}},t(this.el,"icon")&&r("slot",{name:"icon"}),c)}return r("ic-link",{theme:this.theme,monochrome:this.monochrome,href:i,class:"breadcrumb-link","aria-describedby":this.showBackIcon&&o&&o},this.showBackIcon&&r("div",{class:"back-icon",innerHTML:s}),t(this.el,"icon")&&r("slot",{name:"icon"}),c)};this.setSlottedCurrentPageClass=()=>{const e=this.el.querySelector("ic-link");const r="current-page";if(e){e.classList.remove(r);if(this.current){const c=e.classList.contains(r);if(!c){e.classList.add("breadcrumb-link",r)}}}};this.current=false;this.href=undefined;this.monochrome=false;this.pageTitle=undefined;this.showBackIcon=false;this.theme="inherit"}componentWillRender(){this.setSlottedCurrentPageClass()}async setFocus(){if(this.el.shadowRoot.querySelector("ic-link")){this.el.shadowRoot.querySelector("ic-link").focus()}}render(){const{current:e,href:o,pageTitle:t}=this;const s=`${t&&t.toLowerCase().replace(" ","-")}-describedby`;const n=t!==null&&a(t)&&t!=="";const l=o!==null&&a(o)&&o!=="";return r(c,{class:{"ic-breadcrumb-back":this.showBackIcon,[`ic-theme-${this.theme}`]:this.theme!=="inherit","ic-breadcrumb-monochrome":this.monochrome},"aria-current":e&&"page",role:"listitem"},r("div",{class:"breadcrumb"},r("span",{innerHTML:i,class:"chevron","aria-hidden":"true"}),this.showBackIcon&&s&&r("span",{id:s,class:"hide"},`Back to ${t}`),n&&l?this.renderDefaultBreadcrumb(e,t,s,o):r("slot",null)))}static get delegatesFocus(){return true}get el(){return o(this)}};l.style=n;export{l as ic_breadcrumb};
|
2
|
-
//# sourceMappingURL=p-3d9726a3.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icBreadcrumbCss","Breadcrumb","this","renderDefaultBreadcrumb","current","pageTitle","describedById","href","hasPageTitle","isPropDefined","h","class","isSlotUsed","el","name","theme","monochrome","showBackIcon","innerHTML","backIcon","setSlottedCurrentPageClass","icLink","querySelector","currentPage","classList","remove","hasCurrentPageClass","contains","add","componentWillRender","setFocus","shadowRoot","focus","render","toLowerCase","replace","hasHref","Host","role","chevronIcon","id"],"sources":["src/components/ic-breadcrumb/ic-breadcrumb.css?tag=ic-breadcrumb&encapsulation=shadow","src/components/ic-breadcrumb/ic-breadcrumb.tsx"],"sourcesContent":[":host {\n display: block;\n margin: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n}\n\n:host .breadcrumb {\n display: flex;\n align-items: center;\n white-space: nowrap;\n gap: var(--ic-space-xs);\n min-height: var(--ic-space-lg);\n}\n\n:host .chevron {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n:host .chevron svg {\n color: var(--ic-breadcrumb-icon-chevron);\n}\n\n:host(.ic-breadcrumb-monochrome) .chevron svg {\n color: var(--ic-breadcrumb-icon-chevron-monochrome);\n}\n\n:host(:first-child) .chevron {\n display: none;\n}\n\n.back-icon svg {\n color: var(--ic-breadcrumb-page-icon);\n}\n\n:host(.ic-breadcrumb-monochrome) .back-icon svg {\n color: var(--ic-breadcrumb-page-icon-monochrome);\n}\n\n:host(.ic-breadcrumb-back) {\n display: flex;\n align-items: center;\n}\n\n:host(.ic-breadcrumb-back) .chevron {\n display: none;\n}\n\nic-link {\n --breadcrumb-link-display: inline-flex;\n --breadcrumb-link-align-items: center;\n --breadcrumb-link-gap: var(--ic-space-xs);\n}\n\n:host([aria-current=\"page\"]) .current-page-container {\n display: flex;\n align-items: center;\n gap: var(--ic-space-xs);\n color: var(--ic-breadcrumb-text);\n}\n\n:host([aria-current=\"page\"].ic-breadcrumb-monochrome) .current-page-container {\n color: var(--ic-breadcrumb-text-monochrome);\n}\n\n:host(.collapsed-breadcrumb-wrapper) {\n margin-right: var(--ic-space-xs) !important;\n display: flex;\n align-items: center;\n gap: var(--ic-space-xs);\n}\n\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb) {\n border: none;\n background-color: transparent;\n color: var(--ic-color-hyperlink-default);\n text-decoration: underline;\n font-weight: var(--ic-font-weight-bold);\n cursor: pointer;\n}\n\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {\n outline: var(--ic-hc-focus-outline);\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n}\n\n.hide,\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide) {\n display: none;\n}\n\n@media (forced-colors: active) {\n .back-icon svg {\n color: currentcolor;\n }\n}\n\n@supports (text-underline-offset: 25%) {\n ic-link {\n --breadcrumb-link-display: flex;\n }\n\n :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {\n text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n border-bottom: 0 !important;\n margin-bottom: 0 !important;\n }\n}\n","import { Component, Host, Prop, h, Element, Method } from \"@stencil/core\";\nimport { IcBreadcrumbDefault } from \"./ic-breadcrumb.types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport backIcon from \"../../assets/back-icon.svg\";\nimport { isPropDefined, isSlotUsed } from \"../../utils/helpers\";\nimport { IcThemeMode } from \"../../utils/types\";\n\n/**\n * @slot icon - Content will be rendered to the left of the breadcrumb page title.\n */\n@Component({\n tag: \"ic-breadcrumb\",\n styleUrl: \"ic-breadcrumb.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Breadcrumb {\n @Element() el: HTMLIcBreadcrumbElement;\n\n /**\n * If `true`, aria-current will be set on the breadcrumb.\n */\n @Prop() current?: boolean = false;\n\n /**\n * The URL that the breadcrumb link points to.\n */\n @Prop() href?: string;\n\n /**\n * @internal If `true`, the breadcrumb will display as black in the light theme, and white in the dark theme.\n */\n @Prop() monochrome?: boolean = false;\n\n /**\n * The title of the breadcrumb.\n */\n @Prop() pageTitle!: string;\n\n /**\n * @internal If `true`, back icon will be displayed.\n */\n @Prop({ reflect: true }) showBackIcon: boolean = false;\n\n /**\n * @internal 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.\n */\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n componentWillRender(): void {\n this.setSlottedCurrentPageClass();\n }\n\n /**\n * Sets focus on the breadcrumb.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.el.shadowRoot.querySelector(\"ic-link\")) {\n this.el.shadowRoot.querySelector(\"ic-link\").focus();\n }\n }\n\n private renderDefaultBreadcrumb = (\n current: boolean,\n pageTitle: string,\n describedById: string,\n href: string\n ): IcBreadcrumbDefault => {\n const hasPageTitle =\n pageTitle !== null && isPropDefined(pageTitle) && pageTitle !== \"\";\n\n if (current && hasPageTitle) {\n return (\n <span\n class={{\n \"current-page-container\": current,\n }}\n >\n {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n {pageTitle}\n </span>\n );\n }\n\n return (\n <ic-link\n theme={this.theme}\n monochrome={this.monochrome}\n href={href}\n class=\"breadcrumb-link\"\n aria-describedby={this.showBackIcon && describedById && describedById}\n >\n {this.showBackIcon && (\n <div class=\"back-icon\" innerHTML={backIcon}></div>\n )}\n {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n {pageTitle}\n </ic-link>\n );\n };\n\n private setSlottedCurrentPageClass = () => {\n const icLink = this.el.querySelector(\"ic-link\");\n const currentPage = \"current-page\";\n if (icLink) {\n icLink.classList.remove(currentPage);\n if (this.current) {\n const hasCurrentPageClass = icLink.classList.contains(currentPage);\n if (!hasCurrentPageClass) {\n icLink.classList.add(\"breadcrumb-link\", currentPage);\n }\n }\n }\n };\n\n render() {\n const { current, href, pageTitle } = this;\n const describedById = `${\n pageTitle && pageTitle.toLowerCase().replace(\" \", \"-\")\n }-describedby`;\n\n const hasPageTitle =\n pageTitle !== null && isPropDefined(pageTitle) && pageTitle !== \"\";\n const hasHref = href !== null && isPropDefined(href) && href !== \"\";\n\n return (\n <Host\n class={{\n \"ic-breadcrumb-back\": this.showBackIcon,\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n \"ic-breadcrumb-monochrome\": this.monochrome,\n }}\n aria-current={current && \"page\"}\n role=\"listitem\"\n >\n <div class=\"breadcrumb\">\n <span innerHTML={chevronIcon} class=\"chevron\" aria-hidden=\"true\" />\n {this.showBackIcon && describedById && (\n <span\n id={describedById}\n class=\"hide\"\n >{`Back to ${pageTitle}`}</span>\n )}\n {hasPageTitle && hasHref ? (\n this.renderDefaultBreadcrumb(\n current,\n pageTitle,\n describedById,\n href\n )\n ) : (\n <slot />\n )}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"wUAAA,MAAMA,EAAkB,kuE,MCkBXC,EAAU,M,yBA+CbC,KAAAC,wBAA0B,CAChCC,EACAC,EACAC,EACAC,KAEA,MAAMC,EACJH,IAAc,MAAQI,EAAcJ,IAAcA,IAAc,GAElE,GAAID,GAAWI,EAAc,CAC3B,OACEE,EAAA,QACEC,MAAO,CACL,yBAA0BP,IAG3BQ,EAAWV,KAAKW,GAAI,SAAWH,EAAA,QAAMI,KAAK,SAC1CT,E,CAKP,OACEK,EAAA,WACEK,MAAOb,KAAKa,MACZC,WAAYd,KAAKc,WACjBT,KAAMA,EACNI,MAAM,kBAAiB,mBACLT,KAAKe,cAAgBX,GAAiBA,GAEvDJ,KAAKe,cACJP,EAAA,OAAKC,MAAM,YAAYO,UAAWC,IAEnCP,EAAWV,KAAKW,GAAI,SAAWH,EAAA,QAAMI,KAAK,SAC1CT,EACO,EAINH,KAAAkB,2BAA6B,KACnC,MAAMC,EAASnB,KAAKW,GAAGS,cAAc,WACrC,MAAMC,EAAc,eACpB,GAAIF,EAAQ,CACVA,EAAOG,UAAUC,OAAOF,GACxB,GAAIrB,KAAKE,QAAS,CAChB,MAAMsB,EAAsBL,EAAOG,UAAUG,SAASJ,GACtD,IAAKG,EAAqB,CACxBL,EAAOG,UAAUI,IAAI,kBAAmBL,E,kBAxFpB,M,oCAUG,M,2CAUkB,M,WAKnB,S,CAE9B,mBAAAM,GACE3B,KAAKkB,4B,CAOP,cAAMU,GACJ,GAAI5B,KAAKW,GAAGkB,WAAWT,cAAc,WAAY,CAC/CpB,KAAKW,GAAGkB,WAAWT,cAAc,WAAWU,O,EAyDhD,MAAAC,GACE,MAAM7B,QAAEA,EAAOG,KAAEA,EAAIF,UAAEA,GAAcH,KACrC,MAAMI,EAAgB,GACpBD,GAAaA,EAAU6B,cAAcC,QAAQ,IAAK,mBAGpD,MAAM3B,EACJH,IAAc,MAAQI,EAAcJ,IAAcA,IAAc,GAClE,MAAM+B,EAAU7B,IAAS,MAAQE,EAAcF,IAASA,IAAS,GAEjE,OACEG,EAAC2B,EAAI,CACH1B,MAAO,CACL,qBAAsBT,KAAKe,aAC3B,CAAC,YAAYf,KAAKa,SAAUb,KAAKa,QAAU,UAC3C,2BAA4Bb,KAAKc,YAClC,eACaZ,GAAW,OACzBkC,KAAK,YAEL5B,EAAA,OAAKC,MAAM,cACTD,EAAA,QAAMQ,UAAWqB,EAAa5B,MAAM,UAAS,cAAa,SACzDT,KAAKe,cAAgBX,GACpBI,EAAA,QACE8B,GAAIlC,EACJK,MAAM,QACN,WAAWN,KAEdG,GAAgB4B,EACflC,KAAKC,wBACHC,EACAC,EACAC,EACAC,GAGFG,EAAA,c"}
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icPopoverMenuCss","PopoverMenu","this","ARIA_LABEL","popoverMenuEls","setButtonFocus","_a","currentFocus","focus","findAnchorEl","anchor","anchorElement","submenuId","undefined","console","error","document","querySelector","indexOf","isNotPopoverMenuEl","ev","id","tagName","target","getNextItemToSelect","currentItem","movingDown","numButtons","length","nextItem","addMenuItems","elements","i","el","push","groupSlotWrapper","shadowRoot","menuGroupElements","getSlotElements","getMenuAriaLabel","ariaLabel","getAttribute","isPropDefined","submenuLevel","parentLabel","handleBackButtonClick","parentPopover","openFromChild","open","initPopperJS","popperInstance","createPopper","anchorEl","placement","modifiers","name","options","offset","fallbackPlacements","rootBoundary","watchOpenHandler","some","menuItem","unshift","backButton","setTimeout","destroy","disconnectedCallback","componentDidLoad","slotWrapper","popoverMenuElements","componentWillRender","componentDidRender","handleMenuItemClick","detail","hasSubMenu","label","closeMenu","handleSubmenuChange","childEl","submenuTriggerFor","openFromParent","handleClick","handleKeyDown","key","preventDefault","blur","openingFromChild","openingFromParent","setFocusToAnchor","icPopoverClosed","emit","render","h","Host","class","theme","menu","tabindex","role","ref","onClick","slot","viewBox","fill","xmlns","d","variant"],"sources":["src/components/ic-popover-menu/ic-popover-menu.css?tag=ic-popover-menu&encapsulation=shadow","src/components/ic-popover-menu/ic-popover-menu.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n* @prop --ic-z-index-popover: z-index of popover menu. \n* @prop --max-height: Maximum height of the popover menu.\n* @prop --popover-width: Default width of the popover menu.\n*/\n\n@media (prefers-reduced-motion: no-preference) {\n :host .opening-from-parent {\n animation: slide-in var(--ic-transition-duration-slow) ease-in-out;\n }\n\n :host .opening-from-child {\n animation: slide-out var(--ic-transition-duration-slow) ease-in-out;\n }\n}\n\n:host {\n border-radius: var(--ic-border-radius);\n color: var(--ic-popover-nav-text);\n\n --ic-typography-color: var(--ic-popover-nav-text);\n\n position: relative;\n z-index: var(--ic-z-index-popover);\n box-sizing: border-box;\n box-shadow: var(--ic-elevation-overlay);\n display: none;\n}\n\n:host(.on-dialog) {\n inset: auto !important;\n}\n\n:host(.on-dialog-fix-translate) {\n transform: translate(0, var(--ic-space-xs)) !important;\n}\n\n:host(.on-dialog-translate-y) {\n transform: translate(0, calc(-1 * var(--translate-y))) !important;\n}\n\n.menu {\n border: var(--ic-border-default);\n border-color: var(--ic-popover-border);\n border-radius: var(--ic-border-radius);\n background-color: var(--ic-popover-background);\n visibility: hidden;\n height: 0;\n}\n\n.button {\n text-decoration: none;\n list-style-type: none;\n}\n\n:host(:focus-within) {\n box-shadow: var(--ic-border-focus);\n}\n\n.menu:focus-visible {\n outline: none;\n}\n\n:host(.ic-popover-menu-open) {\n display: block;\n min-width: calc(20rem - var(--ic-space-xl));\n width: var(--popover-width, 20rem);\n max-width: calc(100vw - var(--ic-space-xl));\n}\n\n:host(.ic-popover-menu-open) .menu {\n visibility: visible;\n height: fit-content;\n max-height: var(--max-height, fit-content);\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n.parent-label {\n --ic-typography-color: var(--ic-popover-parent-label);\n\n margin: var(--ic-space-xs) var(--ic-space-xs) 0;\n}\n\n@keyframes slide-in {\n from {\n opacity: 0;\n transform: translateX(10rem);\n }\n\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes slide-out {\n from {\n opacity: 0;\n transform: translateX(-10rem);\n }\n\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n","import {\n Component,\n Element,\n Host,\n h,\n Prop,\n Listen,\n Watch,\n State,\n Method,\n Event,\n EventEmitter,\n} from \"@stencil/core\";\nimport { getSlotElements, isPropDefined } from \"../../utils/helpers\";\nimport { createPopper, Instance as PopperInstance } from \"@popperjs/core\";\nimport { IcThemeMode } from \"../../utils/types\";\n\n@Component({\n tag: \"ic-popover-menu\",\n styleUrl: \"ic-popover-menu.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class PopoverMenu {\n private anchorEl: HTMLElement;\n private ARIA_LABEL: string = \"aria-label\";\n private backButton: HTMLIcMenuItemElement;\n private currentFocus: number;\n private popoverMenuEls: HTMLIcMenuItemElement[] = [];\n private popperInstance: PopperInstance;\n\n @Element() el: HTMLIcPopoverMenuElement;\n\n @State() openingFromChild: boolean = false;\n @State() openingFromParent: boolean = false;\n\n /**\n * The ID of the element the popover menu will anchor itself to. This is required unless the popover is a submenu.\n */\n @Prop() anchor: string;\n\n /**\n * @internal The parent popover menu of a child popover menu.\n */\n @Prop() parentLabel?: string;\n\n /**\n * @internal The parent popover menu of a child popover menu.\n */\n @Prop() parentPopover?: HTMLIcPopoverMenuElement;\n\n /**\n * The unique identifier for a popover submenu.\n */\n @Prop() submenuId?: string;\n\n /**\n * @internal The level of menu being displayed.\n */\n @Prop() submenuLevel: number = 1;\n\n /**\n * 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.\n */\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /**\n * If `true`, the popover menu will be displayed.\n */\n @Prop({ reflect: true, mutable: true }) open: boolean = undefined;\n\n @Watch(\"open\")\n watchOpenHandler(): void {\n if (this.open) {\n if (\n this.parentPopover !== undefined &&\n !this.popoverMenuEls.some((menuItem) => menuItem.id)\n ) {\n this.popoverMenuEls.unshift(this.backButton);\n }\n\n this.currentFocus = 0;\n // Needed so that anchorEl isn't always focused\n setTimeout(this.setButtonFocus, 50);\n } else if (this.popperInstance) {\n this.popperInstance.destroy();\n this.popperInstance = null;\n }\n }\n\n /**\n * Emitted when the popover menu is closed.\n */\n @Event() icPopoverClosed: EventEmitter<void>;\n\n disconnectedCallback(): void {\n if (this.popperInstance) {\n this.popperInstance.destroy();\n this.popperInstance = null;\n }\n }\n\n componentDidLoad(): void {\n const slotWrapper = this.el.shadowRoot.querySelector(\"ul.button\");\n const popoverMenuElements = getSlotElements(slotWrapper);\n\n if (popoverMenuElements !== null) {\n this.addMenuItems(popoverMenuElements);\n }\n\n if (\n this.submenuId === undefined &&\n this.el.getAttribute(this.ARIA_LABEL) === null\n ) {\n console.error(\n `No aria-label specified for popover menu component - aria-label required`\n );\n }\n }\n\n componentWillRender(): void {\n this.anchorEl = this.findAnchorEl(this.anchor);\n }\n\n componentDidRender(): void {\n if (this.open && !this.popperInstance) {\n this.initPopperJS();\n }\n }\n\n @Listen(\"handleMenuItemClick\")\n handleMenuItemClick(\n ev: CustomEvent<{\n label: string;\n hasSubMenu: boolean;\n }>\n ): void {\n if (!ev.detail.hasSubMenu && ev.detail.label !== \"Back\") {\n this.closeMenu();\n }\n }\n\n // This is listening for the event emitted when a menu item is acting as a trigger button\n @Listen(\"triggerPopoverMenuInstance\", { capture: true })\n handleSubmenuChange(ev: Event): void {\n // Finds the trigger menu item that has emitted the event\n const target = ev.target as HTMLIcMenuItemElement;\n this.open = false;\n\n // Find the popover menu that the menu item triggers (i.e. submenu-trigger-for === submenu-id).\n const childEl = document.querySelector(\n `ic-popover-menu[submenu-id=${target.submenuTriggerFor}]`\n ) as HTMLIcPopoverMenuElement;\n // Set the parent popover menu of the submenu and open the submenu\n childEl.parentPopover = this.el;\n childEl.anchor = this.anchor;\n childEl.ariaLabel = this.el.getAttribute(this.ARIA_LABEL);\n childEl.openFromParent();\n childEl.submenuLevel = this.submenuLevel + 1;\n // Set the label in the submenu using the label of the menu item that has emitted the event\n childEl.parentLabel = target.label;\n }\n\n @Listen(\"click\", { target: \"document\" })\n handleClick(ev: Event): void {\n if (this.open && this.isNotPopoverMenuEl(ev)) {\n // If menu is open and the next click on the document is not a popover El, close the popover\n this.closeMenu();\n }\n }\n\n // Manages the keyboard navigation in the popover menu\n @Listen(\"keydown\", {})\n handleKeyDown(ev: KeyboardEvent): void {\n switch (ev.key) {\n case \"ArrowDown\":\n case \"ArrowUp\":\n ev.preventDefault();\n this.currentFocus = this.getNextItemToSelect(\n this.currentFocus,\n ev.key === \"ArrowDown\"\n );\n this.setButtonFocus();\n break;\n case \"Home\":\n //Sets home focus as first element, or back button\n this.currentFocus = 0;\n this.setButtonFocus();\n break;\n case \"End\":\n //Sets end focus as last element\n this.currentFocus = this.popoverMenuEls.length - 1;\n this.setButtonFocus();\n break;\n case \"Escape\":\n case \"Tab\":\n ev.preventDefault();\n if (this.open) {\n this.closeMenu(true);\n this.el.blur();\n }\n break;\n }\n }\n\n /**\n * @internal Opens the menu from the child menu.\n */\n @Method()\n async openFromChild(): Promise<void> {\n this.open = true;\n this.openingFromChild = true;\n\n setTimeout(() => (this.openingFromChild = false), 1000);\n }\n\n /**\n * @internal Opens the menu from the parent menu.\n */\n @Method()\n async openFromParent(): Promise<void> {\n this.open = true;\n this.openingFromParent = true;\n\n setTimeout(() => (this.openingFromParent = false), 1000);\n }\n\n private setButtonFocus = () => {\n this.popoverMenuEls[this.currentFocus]?.focus();\n };\n\n // Checks that the popover menu has an anchor\n private findAnchorEl = (anchor: string): HTMLElement => {\n let anchorElement: HTMLElement = null;\n if (!anchor) {\n this.submenuId === undefined &&\n console.error(\"No anchor specified for popover component\");\n } else {\n anchorElement = document.querySelector(\n anchor.indexOf(\"#\") === 0 ? anchor : \"#\" + anchor\n );\n if (anchorElement === null) {\n console.error(`Popover anchor element '${anchor}' not found`);\n }\n }\n return anchorElement;\n };\n\n private isNotPopoverMenuEl = (ev: Event) => {\n const { id, tagName } = ev.target as HTMLElement;\n return (\n id !== this.anchor &&\n tagName !== \"IC-MENU-ITEM\" &&\n tagName !== \"IC-MENU-GROUP\" &&\n tagName !== \"IC-POPOVER-MENU\"\n );\n };\n\n /**\n * @internal Close the menu, emit icPopoverClosed of the root popover\n * @param setFocusToAnchor when true return focus to anchor element when menu is closed\n */\n @Method()\n async closeMenu(setFocusToAnchor = false): Promise<void> {\n this.open = false;\n if (this.parentPopover) {\n this.parentPopover.closeMenu(setFocusToAnchor);\n } else {\n if (setFocusToAnchor) {\n this.anchorEl?.focus();\n }\n this.icPopoverClosed.emit();\n }\n }\n\n private getNextItemToSelect = (\n currentItem: number,\n movingDown: boolean\n ): number => {\n const numButtons = this.popoverMenuEls.length - 1;\n\n if (currentItem < 1) {\n currentItem = 0;\n }\n\n let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n\n // Check if wrap around necessary\n if (nextItem < 0) {\n nextItem = numButtons;\n } else if (nextItem > numButtons) {\n nextItem = 0;\n }\n\n return nextItem;\n };\n\n private addMenuItems = (elements: Element[] | NodeListOf<ChildNode>) => {\n for (let i = 0; i < elements.length; i++) {\n const el = elements[i] as HTMLIcMenuItemElement;\n if (el.tagName === \"IC-MENU-ITEM\") {\n this.popoverMenuEls.push(el);\n } else if (el.tagName === \"IC-MENU-GROUP\") {\n const groupSlotWrapper = el.shadowRoot.querySelector(\n \".menu-items-wrapper\"\n );\n const menuGroupElements = getSlotElements(groupSlotWrapper);\n\n this.addMenuItems(menuGroupElements);\n }\n }\n };\n\n private getMenuAriaLabel = (): string => {\n const ariaLabel = this.el.getAttribute(this.ARIA_LABEL);\n\n if (isPropDefined(this.submenuId)) {\n return `${ariaLabel}, within nested level ${this.submenuLevel} ${this.parentLabel} submenu,`;\n } else {\n return ariaLabel;\n }\n };\n\n private handleBackButtonClick = (): void => {\n this.parentPopover.openFromChild();\n this.open = false;\n };\n\n private initPopperJS = () => {\n this.popperInstance = createPopper(this.anchorEl, this.el, {\n placement: \"bottom-start\",\n modifiers: [\n {\n name: \"offset\",\n options: {\n offset: [0, 4],\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top-start\", \"top-end\", \"bottom-end\"],\n rootBoundary: \"viewport\",\n },\n },\n ],\n });\n };\n\n render() {\n return (\n <Host\n class={{\n [\"ic-popover-menu-open\"]: this.open,\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n }}\n >\n <div\n id={\n this.parentPopover === undefined\n ? `ic-popover-submenu-${this.submenuId}`\n : \"\"\n }\n class={{\n menu: true,\n }}\n tabindex={open ? \"0\" : \"-1\"}\n >\n <span\n class={{\n \"opening-from-parent\": this.openingFromParent,\n \"opening-from-child\": this.openingFromChild,\n }}\n >\n {isPropDefined(this.submenuId) && (\n <span>\n <span role=\"menu\">\n <ic-menu-item\n class=\"ic-popover-submenu-back-button\"\n ref={(el) => (this.backButton = el)}\n label=\"Back\"\n onClick={this.handleBackButtonClick}\n id={`ic-popover-submenu-back-button-${this.submenuLevel}`}\n >\n <svg\n slot=\"icon\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"submenu-back-icon\"\n >\n <path\n d=\"M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-menu-item>\n </span>\n <ic-typography variant=\"subtitle-small\" class=\"parent-label\">\n {this.parentLabel}\n </ic-typography>\n </span>\n )}\n <ul class=\"button\" aria-label={this.getMenuAriaLabel()} role=\"menu\">\n <slot></slot>\n </ul>\n </span>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
@@ -1,2 +0,0 @@
|
|
1
|
-
import{r as t,h as i,H as a,g as e}from"./p-6b5e91e2.js";import{a as r,T as l,U as s,F as n,X as o,Y as c,Q as p}from"./p-b7eb8ef9.js";const h="ic-input-label{margin-bottom:var(--ic-space-xs);--ic-typography-color:var(\n --ic-input-label-text-color,\n var(--ic-color-text-primary)\n )}ic-input-label.with-helper{margin-bottom:var(--ic-space-xxxs)}ic-input-label.ic-input-label-readonly{--ic-typography-color:var(--ic-color-text-tertiary)}ic-input-label .helpertext{margin-top:var(--ic-space-xxxs);padding-bottom:var(--ic-input-label-helpertext-padding, 0);--ic-typography-color:var(\n --ic-input-label-helper-text-color,\n var(--ic-color-text-secondary)\n )}ic-input-label .helpertext-normal{--ic-typography-color:var(\n --ic-input-label-helper-text-color,\n var(--ic-color-text-secondary)\n )}ic-input-label .helpertext-readonly{--ic-typography-color:var(--ic-color-text-tertiary)}ic-input-label .readonly-label{--ic-typography-color:var(--ic-color-text-secondary)}ic-input-label .error-label{--ic-typography-color:var(--ic-status-error-default)}ic-input-label .dark{--ic-typography-color:var(--ic-architectural-white)}";const d=class{constructor(i){t(this,i);this.appearance="default";this.disabled=false;this.for=undefined;this.helperText="";this.hideLabel=false;this.label=undefined;this.readonly=false;this.required=false;this.status="";this.useLabelTag=true}componentDidLoad(){r([{prop:this.label,propName:"label"}],"Input Label")}render(){const{disabled:t,readonly:e,label:r,required:s,helperText:n,status:o,hideLabel:c,appearance:p,useLabelTag:h}=this;const d=s?r+" *":r;const u=e||!h?`${d}`:i("label",{htmlFor:this.for},d);const v=l(this.for);return i(a,{class:{["ic-input-label-disabled"]:t,["ic-input-label-readonly"]:e,["with-helper"]:n!==""}},!c&&i("ic-typography",{variant:"label",class:{["readonly-label"]:e,["error-label"]:o==="error"&&!(e||t),["dark"]:p==="dark"}},u),n!==""&&i("ic-typography",{variant:"caption",class:{["helpertext"]:true,["helpertext-normal"]:!t&&!e,["helpertext-readonly"]:e}},i("span",{id:v},n)))}};d.style=h;const u="ic-input-validation{width:var(--input-width, 20rem);margin-top:var(--ic-space-xs);display:flex}ic-input-validation.ic-input-validation-full-width{width:100%}ic-input-validation span.status-icon{padding-right:var(--ic-space-xxs)}ic-input-validation span.status-icon>svg{height:1.25rem;width:1.25rem}ic-input-validation span.icon-success>svg{fill:var(--ic-status-success-default)}ic-input-validation span.icon-error>svg{fill:var(--ic-input-validation-error, var(--ic-status-error-default))}ic-input-validation span.icon-warning>svg{fill:var(--ic-status-warning-default)}ic-input-validation .statustext{flex-grow:1;color:var(\n --ic-input-validation-status-text-color,\n var(--ic-typography-color)\n )}";const v={[n.Warning]:o,[n.Error]:c,[n.Success]:p};const y=class{constructor(i){t(this,i);this.ariaLiveMode="polite";this.for=undefined;this.fullWidth=false;this.message=undefined;this.status=""}componentDidLoad(){r([{prop:this.message,propName:"message"}],"Input Validation")}render(){const t=this.status!==""?v[this.status]:"";const e=s(this.for);return i(a,{class:{[`ic-input-validation-${this.status}`]:this.status!=="",["ic-input-validation-full-width"]:this.fullWidth}},t!==""&&i("span",{class:{["status-icon"]:true,[`icon-${this.status}`]:true},innerHTML:t}),i("ic-typography",{variant:"caption",class:"statustext"},i("span",{"aria-live":this.ariaLiveMode,id:e},this.message)),i("slot",{name:"validation-message-adornment"}))}get el(){return e(this)}};y.style=u;export{d as ic_input_label,y as ic_input_validation};
|
2
|
-
//# sourceMappingURL=p-4973c563.entry.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icInputLabelCss","InputLabel","componentDidLoad","onComponentRequiredPropUndefined","prop","this","label","propName","render","disabled","readonly","required","helperText","status","hideLabel","appearance","useLabelTag","labelText","labelContent","h","htmlFor","for","id","getInputHelperTextID","Host","class","variant","icInputValidationCss","icon","IcInformationStatus","Warning","warningIcon","Error","errorIcon","Success","successIcon","InputValidation","message","displayIcon","getInputValidationTextID","fullWidth","innerHTML","ariaLiveMode","name"],"sources":["src/components/ic-input-label/ic-input-label.css?tag=ic-input-label","src/components/ic-input-label/ic-input-label.tsx","src/components/ic-input-validation/ic-input-validation.css?tag=ic-input-validation","src/components/ic-input-validation/ic-input-validation.tsx"],"sourcesContent":["ic-input-label {\n margin-bottom: var(--ic-space-xs);\n --ic-typography-color: var(\n --ic-input-label-text-color,\n var(--ic-color-text-primary)\n );\n}\n\nic-input-label.with-helper {\n margin-bottom: var(--ic-space-xxxs);\n}\n\nic-input-label.ic-input-label-readonly {\n --ic-typography-color: var(--ic-color-text-tertiary);\n}\n\nic-input-label .helpertext {\n margin-top: var(--ic-space-xxxs);\n padding-bottom: var(--ic-input-label-helpertext-padding, 0);\n --ic-typography-color: var(\n --ic-input-label-helper-text-color,\n var(--ic-color-text-secondary)\n );\n}\n\nic-input-label .helpertext-normal {\n --ic-typography-color: var(\n --ic-input-label-helper-text-color,\n var(--ic-color-text-secondary)\n );\n}\n\nic-input-label .helpertext-readonly {\n --ic-typography-color: var(--ic-color-text-tertiary);\n}\n\nic-input-label .readonly-label {\n --ic-typography-color: var(--ic-color-text-secondary);\n}\n\nic-input-label .error-label {\n --ic-typography-color: var(--ic-status-error-default);\n}\n\nic-input-label .dark {\n --ic-typography-color: var(--ic-architectural-white);\n}\n\n/* Add back in after storybook has the `color-scheme: light dark` code */\n\n/* @media (prefers-color-scheme: dark) and (not (forced-colors: active)) {\n ic-input-label,\n ic-input-label .helpertext-normal,\n ic-input-label .readonly-label,\n ic-input-label .helpertext-readonly {\n color: var(--ic-architectural-white);\n }\n} */\n","import { Component, Host, Prop, h } from \"@stencil/core\";\n\nimport {\n getInputHelperTextID,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-input-label\",\n styleUrl: \"./ic-input-label.css\",\n})\nexport class InputLabel {\n /**\n * The appearance of the input label.\n */\n @Prop() appearance?: \"dark\" | \"default\" = \"default\";\n\n /**\n * If `true`, the disabled state will be set.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * The ID of the form element the label is bound to.\n */\n @Prop() for: string;\n\n /**\n * The helper text that will be displayed.\n */\n @Prop() helperText: string = \"\";\n\n /**\n * The label will be visually hidden.\n */\n @Prop() hideLabel: boolean = false;\n\n /**\n * The text content of the label.\n */\n @Prop() label!: string;\n\n /**\n * If `true`, the readonly state will be set.\n */\n @Prop() readonly: boolean = false;\n\n /**\n * If `true`, the input label will require a value.\n */\n @Prop() required: boolean = false;\n\n /**\n * The status of the label - e.g. 'error'.\n */\n @Prop() status: \"error\" | \"\" = \"\";\n\n /**\n * @internal If `true`, wraps label text in label tag\n */\n @Prop() useLabelTag: boolean = true;\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Input Label\"\n );\n }\n\n render() {\n const {\n disabled,\n readonly,\n label,\n required,\n helperText,\n status,\n hideLabel,\n appearance,\n useLabelTag,\n } = this;\n const labelText = required ? label + \" *\" : label;\n const labelContent =\n readonly || !useLabelTag ? (\n `${labelText}`\n ) : (\n <label htmlFor={this.for}>{labelText}</label>\n );\n\n const id = getInputHelperTextID(this.for);\n\n return (\n <Host\n class={{\n [\"ic-input-label-disabled\"]: disabled,\n [\"ic-input-label-readonly\"]: readonly,\n [\"with-helper\"]: helperText !== \"\",\n }}\n >\n {!hideLabel && (\n <ic-typography\n variant=\"label\"\n class={{\n [\"readonly-label\"]: readonly,\n [\"error-label\"]: status === \"error\" && !(readonly || disabled),\n [\"dark\"]: appearance === \"dark\",\n }}\n >\n {labelContent}\n </ic-typography>\n )}\n\n {helperText !== \"\" && (\n <ic-typography\n variant=\"caption\"\n class={{\n [\"helpertext\"]: true,\n [\"helpertext-normal\"]: !disabled && !readonly,\n [\"helpertext-readonly\"]: readonly,\n }}\n >\n <span id={id}>{helperText}</span>\n </ic-typography>\n )}\n </Host>\n );\n }\n}\n","ic-input-validation {\n width: var(--input-width, 20rem);\n margin-top: var(--ic-space-xs);\n display: flex;\n}\n\nic-input-validation.ic-input-validation-full-width {\n width: 100%;\n}\n\nic-input-validation span.status-icon {\n padding-right: var(--ic-space-xxs);\n}\n\nic-input-validation span.status-icon > svg {\n height: 1.25rem;\n width: 1.25rem;\n}\n\nic-input-validation span.icon-success > svg {\n fill: var(--ic-status-success-default);\n}\n\nic-input-validation span.icon-error > svg {\n fill: var(--ic-input-validation-error, var(--ic-status-error-default));\n}\n\nic-input-validation span.icon-warning > svg {\n fill: var(--ic-status-warning-default);\n}\n\nic-input-validation .statustext {\n flex-grow: 1;\n color: var(\n --ic-input-validation-status-text-color,\n var(--ic-typography-color)\n );\n}\n","import { Element, Component, Host, Prop, h } from \"@stencil/core\";\n\nimport {\n IcInformationStatus,\n IcInformationStatusOrEmpty,\n} from \"../../utils/types\";\nimport errorIcon from \"../../assets/error-icon.svg\";\nimport successIcon from \"../../assets/success-icon.svg\";\nimport warningIcon from \"../../assets/warning-icon.svg\";\n\nimport {\n getInputValidationTextID,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcAriaLiveModeVariants } from \"./ic-input-validation.types\";\n\nconst icon = {\n [IcInformationStatus.Warning]: warningIcon,\n [IcInformationStatus.Error]: errorIcon,\n [IcInformationStatus.Success]: successIcon,\n};\n\n/**\n * @slot validation-message-adornment - Content will be placed to the right of the validation message.\n */\n@Component({\n tag: \"ic-input-validation\",\n styleUrl: \"ic-input-validation.css\",\n})\nexport class InputValidation {\n @Element() el: HTMLIcInputValidationElement;\n\n /**\n * The ARIA live mode to apply to the message.\n */\n @Prop() ariaLiveMode: IcAriaLiveModeVariants = \"polite\";\n\n /**\n * The ID of the form element the validation is bound to.\n */\n @Prop() for: string;\n\n /**\n * If `true`, the input validation will fill the width of the container.\n */\n @Prop() fullWidth: boolean = false;\n\n /**\n * The validation message to display.\n */\n @Prop() message!: string;\n\n /**\n * The status of the validation - e.g. 'error' | 'warning' | 'success'.\n */\n @Prop() status: IcInformationStatusOrEmpty = \"\";\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.message, propName: \"message\" }],\n \"Input Validation\"\n );\n }\n\n render() {\n const displayIcon = this.status !== \"\" ? icon[this.status] : \"\";\n const id = getInputValidationTextID(this.for);\n return (\n <Host\n class={{\n [`ic-input-validation-${this.status}`]: this.status !== \"\",\n [\"ic-input-validation-full-width\"]: this.fullWidth,\n }}\n >\n {displayIcon !== \"\" && (\n <span\n class={{\n [\"status-icon\"]: true,\n [`icon-${this.status}`]: true,\n }}\n innerHTML={displayIcon}\n />\n )}\n\n <ic-typography variant=\"caption\" class=\"statustext\">\n <span aria-live={this.ariaLiveMode} id={id}>\n {this.message}\n </span>\n </ic-typography>\n\n <slot name=\"validation-message-adornment\"></slot>\n </Host>\n );\n }\n}\n"],"mappings":"uIAAA,MAAMA,EAAkB,w+B,MCWXC,EAAU,M,yCAIqB,U,cAKd,M,mCAUC,G,eAKA,M,mCAUD,M,cAKA,M,YAKG,G,iBAKA,I,CAE/B,gBAAAC,GACEC,EACE,CAAC,CAAEC,KAAMC,KAAKC,MAAOC,SAAU,UAC/B,c,CAIJ,MAAAC,GACE,MAAMC,SACJA,EAAQC,SACRA,EAAQJ,MACRA,EAAKK,SACLA,EAAQC,WACRA,EAAUC,OACVA,EAAMC,UACNA,EAASC,WACTA,EAAUC,YACVA,GACEX,KACJ,MAAMY,EAAYN,EAAWL,EAAQ,KAAOA,EAC5C,MAAMY,EACJR,IAAaM,EAAW,GACnBC,IAEHE,EAAA,SAAOC,QAASf,KAAKgB,KAAMJ,GAG/B,MAAMK,EAAKC,EAAqBlB,KAAKgB,KAErC,OACEF,EAACK,EAAI,CACHC,MAAO,CACL,CAAC,2BAA4BhB,EAC7B,CAAC,2BAA4BC,EAC7B,CAAC,eAAgBE,IAAe,MAGhCE,GACAK,EAAA,iBACEO,QAAQ,QACRD,MAAO,CACL,CAAC,kBAAmBf,EACpB,CAAC,eAAgBG,IAAW,WAAaH,GAAYD,GACrD,CAAC,QAASM,IAAe,SAG1BG,GAIJN,IAAe,IACdO,EAAA,iBACEO,QAAQ,UACRD,MAAO,CACL,CAAC,cAAe,KAChB,CAAC,sBAAuBhB,IAAaC,EACrC,CAAC,uBAAwBA,IAG3BS,EAAA,QAAMG,GAAIA,GAAKV,I,aCzH3B,MAAMe,EAAuB,qsBCgB7B,MAAMC,EAAO,CACX,CAACC,EAAoBC,SAAUC,EAC/B,CAACF,EAAoBG,OAAQC,EAC7B,CAACJ,EAAoBK,SAAUC,G,MAUpBC,EAAe,M,2CAMqB,S,kCAUlB,M,mCAUgB,E,CAE7C,gBAAAlC,GACEC,EACE,CAAC,CAAEC,KAAMC,KAAKgC,QAAS9B,SAAU,YACjC,mB,CAIJ,MAAAC,GACE,MAAM8B,EAAcjC,KAAKQ,SAAW,GAAKe,EAAKvB,KAAKQ,QAAU,GAC7D,MAAMS,EAAKiB,EAAyBlC,KAAKgB,KACzC,OACEF,EAACK,EAAI,CACHC,MAAO,CACL,CAAC,uBAAuBpB,KAAKQ,UAAWR,KAAKQ,SAAW,GACxD,CAAC,kCAAmCR,KAAKmC,YAG1CF,IAAgB,IACfnB,EAAA,QACEM,MAAO,CACL,CAAC,eAAgB,KACjB,CAAC,QAAQpB,KAAKQ,UAAW,MAE3B4B,UAAWH,IAIfnB,EAAA,iBAAeO,QAAQ,UAAUD,MAAM,cACrCN,EAAA,oBAAiBd,KAAKqC,aAAcpB,GAAIA,GACrCjB,KAAKgC,UAIVlB,EAAA,QAAMwB,KAAK,iC"}
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"names":["icTypographyCss","Typography","this","focusBtnFromKeyboard","inAGGrid","lastMarkerTop","lastWidth","resizeObserver","truncatedHeight","toggleExpanded","ev","stopPropagation","expanded","typographyTruncationExpandToggle","emit","typographyEl","el","checkMarkerPosition","elTop","markerTop","truncated","getElementTop","getClientRects","top","runResizeObserver","ResizeObserver","clearTimeout","resizeInterval","window","setTimeout","resizeObserverCallback","observe","truncWrapperEl","clientWidth","checkMaxLines","clientHeight","marker","truncButtonFocus","truncButtonFocussed","truncButtonBlur","truncButtonFocusFromMouse","watchExpandedHandler","setAttribute","maxLines","disconnectedCallback","disconnect","resetTruncation","removeAttribute","componentDidLoad","variant","_b","_a","getRootNode","host","tagName","document","createElement","style","visibility","appendChild","checkResizeObserver","componentWillRender","isElInAGGrid","height","numLines","Math","floor","setShowHideExpanded","render","applyVerticalMargins","strikethrough","underline","italic","bold","theme","h","Host","class","ref","focus","onFocus","onBlur","onMouseDown","onClick"],"sources":["src/components/ic-typography/ic-typography.css?tag=ic-typography&encapsulation=shadow","src/components/ic-typography/ic-typography.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: block;\n position: relative;\n color: var(--ic-typography-color, var(--ic-color-text-primary));\n}\n\n:host(.ic-typography-vertical-margins-h1) {\n margin: 0 0 var(--ic-space-xl);\n}\n\n:host(.ic-typography-vertical-margins-h2) {\n margin: var(--ic-space-xxl) 0 var(--ic-space-lg);\n}\n\n:host(.ic-typography-vertical-margins-h3) {\n margin: var(--ic-space-xl) 0 var(--ic-space-md);\n}\n\n:host(.ic-typography-vertical-margins-h4) {\n margin: var(--ic-space-lg) 0 var(--ic-space-md);\n}\n\n:host(.ic-typography-vertical-margins-subtitle-large),\n:host(.ic-typography-vertical-margins-subtitle-small),\n:host(.ic-typography-vertical-margins-body),\n:host(.ic-typography-vertical-margins-code-large),\n:host(.ic-typography-vertical-margins-code-small),\n:host(.ic-typography-vertical-margins-code-extra-small) {\n margin: 0 0 var(--ic-space-md);\n}\n\n:host(.ic-typography-vertical-margins-caption),\n:host(.ic-typography-vertical-margins-caption-uppercase) {\n margin: 0 0 var(--ic-space-xs);\n}\n\n:host(.ic-typography-vertical-margins-h2:first-child),\n:host(.ic-typography-vertical-margins-h3:first-child),\n:host(.ic-typography-vertical-margins-h4:first-child) {\n margin-top: 0;\n}\n\n:host(.ic-typography-h1) {\n font: var(--ic-font-h1) !important;\n}\n\n:host(.ic-typography-h2) {\n font: var(--ic-font-h2);\n letter-spacing: var(--ic-font-letter-spacing-0pt0025);\n}\n\n:host(.ic-typography-h3) {\n font: var(--ic-font-h3);\n}\n\n:host(.ic-typography-h4) {\n font: var(--ic-font-h4);\n letter-spacing: var(--ic-font-letter-spacing-0pt0015);\n}\n\n:host(.ic-typography-subtitle-large) {\n font: var(--ic-font-subtitle-large);\n letter-spacing: var(--ic-font-letter-spacing-0pt0015);\n}\n\n:host(.ic-typography-subtitle-small) {\n font: var(--ic-font-subtitle-small);\n letter-spacing: var(--ic-font-letter-spacing-0pt0015);\n}\n\n:host(.ic-typography-body) {\n font: var(--ic-font-body);\n letter-spacing: var(--ic-font-letter-spacing-0pt005);\n}\n\n:host(.ic-typography-caption) {\n font: var(--ic-font-caption);\n letter-spacing: var(--ic-font-letter-spacing-0pt0025);\n}\n\n:host(.ic-typography-caption-uppercase) {\n font: var(--ic-font-caption);\n letter-spacing: var(--ic-font-letter-spacing-0pt0025);\n text-transform: uppercase;\n}\n\n:host(.ic-typography-label) {\n font: var(--ic-font-label);\n letter-spacing: var(--ic-font-letter-spacing-0pt025);\n}\n\n:host(.ic-typography-label-uppercase) {\n font: var(--ic-font-label);\n letter-spacing: var(--ic-font-letter-spacing-0pt025);\n text-transform: uppercase;\n}\n\n:host(.ic-typography-code-large) {\n font: var(--ic-font-code-large);\n letter-spacing: var(--ic-font-letter-spacing-0pt025);\n}\n\n:host(.ic-typography-code-small) {\n font: var(--ic-font-code-small);\n letter-spacing: var(--ic-font-letter-spacing-0pt005);\n}\n\n:host(.ic-typography-code-extra-small) {\n font: var(--ic-font-code-extra-small);\n letter-spacing: var(--ic-font-letter-spacing-0pt025);\n}\n\n:host(.ic-typography-badge) {\n font: var(--ic-font-badge);\n letter-spacing: var(--ic-font-letter-spacing-0pt0025);\n}\n\n:host(.ic-typography-badge-small) {\n font: var(--ic-font-badge-small);\n letter-spacing: var(--ic-font-letter-spacing-0pt0025);\n}\n\n:host(.ic-typography-no-wrap) {\n white-space: nowrap;\n}\n\n:host ::slotted(h1),\n:host ::slotted(h2),\n:host ::slotted(h3),\n:host ::slotted(h4),\n:host ::slotted(h5),\n:host ::slotted(h6),\n:host ::slotted(p),\n:host ::slotted(label) {\n font: inherit;\n letter-spacing: inherit;\n}\n\n.trunc-wrapper {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n line-clamp: var(--truncation-max-lines, initial);\n -webkit-line-clamp: var(--truncation-max-lines, initial);\n overflow: hidden;\n padding-right: var(--ellipsis-padding-right, 0);\n}\n\n.trunc-btn {\n border: none;\n background: none;\n padding: 0;\n color: var(--ic-color-text-primary);\n text-decoration: underline;\n font-weight: var(--ic-font-weight-bold);\n transition: var(--ic-easing-transition-fast);\n}\n\n.trunc-btn:hover,\n.trunc-btn.focus {\n outline: none;\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n cursor: pointer;\n}\n\n:host(.ic-typography-strikethrough) {\n text-decoration: line-through;\n}\n\n:host(.ic-typography-underline) {\n text-decoration: underline;\n}\n\n:host(.ic-typography-underline.ic-typography-strikethrough) {\n text-decoration: line-through underline;\n}\n\n:host(.ic-typography-italic) {\n font-style: italic !important;\n}\n\n:host(.ic-typography-bold) {\n font-weight: var(--ic-font-weight-bold);\n}\n\n:host(.ic-theme-dark),\n:host(.ic-theme-light) {\n --ic-typography-color: var(--ic-color-text-primary);\n}\n\n:host(.in-ag-grid),\n:host(.in-ag-grid) ::slotted(*) {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n@supports (text-underline-offset: 25%) {\n .trunc-btn:hover,\n .trunc-btn.focus {\n text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n border-bottom: 0 !important;\n margin-bottom: 0 !important;\n }\n}\n\n/* Add back in after storybook has the `color-scheme: light dark` code */\n\n/* @media (prefers-color-scheme: dark) and (not (forced-colors: active)) {\n :host,\n .trunc-btn {\n color: var(--ic-architectural-white);\n }\n} */\n","import {\n Component,\n Prop,\n h,\n Element,\n Host,\n State,\n Watch,\n Method,\n Event,\n EventEmitter,\n} from \"@stencil/core\";\n\nimport { IcTypographyVariants, IcThemeMode } from \"../../utils/types\";\nimport { checkResizeObserver, isElInAGGrid } from \"../../utils/helpers\";\n\n@Component({\n styleUrl: \"ic-typography.css\",\n tag: \"ic-typography\",\n shadow: true,\n})\nexport class Typography {\n private focusBtnFromKeyboard: boolean = true;\n private inAGGrid: boolean = false;\n private lastMarkerTop: number = 0;\n private lastWidth: number = 0;\n private marker: HTMLElement;\n private resizeInterval: number;\n private resizeObserver: ResizeObserver = null;\n private truncatedHeight: number = 0;\n private truncWrapperEl: Element;\n\n @Element() el: HTMLIcTypographyElement;\n\n @State() truncated: boolean = false;\n @State() truncButtonFocussed: boolean = false;\n\n /**\n * If `true`, appropriate top and bottom margins will be applied to the typography.\n */\n @Prop() applyVerticalMargins?: boolean = false;\n\n /**\n * If `true`, the typography will have a bold font weight.\n * Note: This will have no impact on variants that already use an equivalent or higher font weight (h1, h2, and subtitle-large).\n */\n @Prop() bold?: boolean = false;\n\n /**\n * If `true`, the typography will have an italic font style.\n */\n @Prop() italic?: boolean = false;\n\n /**\n * The number of lines to display before truncating the text, only used for the 'body' variant.\n */\n @Prop({ mutable: true }) maxLines?: number;\n\n /**\n * If `true`, the typography will have a line through it.\n */\n @Prop() strikethrough?: boolean = false;\n\n /**\n * Sets the text color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n */\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /**\n * If `true`, the typography will have a line under it.\n */\n @Prop() underline?: boolean = false;\n\n /**\n * The ICDS typography style to use.\n */\n @Prop() variant?: IcTypographyVariants = \"body\";\n\n /**\n * @internal Emits and event when the typography truncation button has been clicked.\n */\n @Event() typographyTruncationExpandToggle: EventEmitter<{\n expanded: boolean;\n typographyEl: HTMLIcTypographyElement;\n }>;\n\n @State() expanded: boolean = false;\n\n @Watch(\"expanded\")\n watchExpandedHandler(): void {\n this.el.setAttribute(\n \"style\",\n `--truncation-max-lines: ${this.expanded ? \"initial\" : this.maxLines}`\n );\n }\n\n disconnectedCallback(): void {\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n }\n /**\n * @internal This is used by data table to remove all truncation in certain events\n */\n @Method()\n async resetTruncation() {\n if (this.truncated) {\n this.truncated = false;\n this.maxLines = 0;\n this.el.removeAttribute(\"max-lines\");\n this.expanded = false;\n this.el.removeAttribute(\"style\");\n }\n }\n\n componentDidLoad(): void {\n if (\n (this.variant === \"body\" ||\n (this.el.getRootNode() as ShadowRoot)?.host?.tagName ===\n \"IC-TOOLTIP\") &&\n this.maxLines > 0\n ) {\n const marker = document.createElement(\"span\");\n marker.style.visibility = \"hidden\";\n this.el.appendChild(marker);\n this.marker = marker;\n this.lastWidth = this.el.clientWidth;\n this.checkMaxLines(this.el.clientHeight);\n checkResizeObserver(this.runResizeObserver);\n }\n }\n\n componentWillRender(): void {\n if (isElInAGGrid(this.el)) {\n this.inAGGrid = true;\n }\n }\n\n private toggleExpanded = (ev: Event) => {\n ev.stopPropagation();\n\n this.expanded = !this.expanded;\n this.typographyTruncationExpandToggle.emit({\n expanded: this.expanded,\n typographyEl: this.el,\n });\n };\n\n /**\n * @internal This checks if the number of lines of text exceeds the maxLines prop. If so, set the line clamp CSS to the max lines\n * @param height - text container height\n */\n\n @Method()\n async checkMaxLines(height: number) {\n //24 is the height of a single line\n const numLines = Math.floor(height / 24);\n if (numLines > this.maxLines) {\n this.el.setAttribute(\"style\", `--truncation-max-lines: ${this.maxLines}`);\n this.truncatedHeight = this.el.clientHeight;\n this.truncated = true;\n }\n }\n\n /**\n * @internal This method makes it possible to set the expanded status of truncated text outside of ic-typography component\n */\n @Method()\n async setShowHideExpanded(expanded: boolean) {\n this.expanded = expanded;\n }\n\n private checkMarkerPosition = (elTop: number, markerTop: number) => {\n if (markerTop - elTop < this.truncatedHeight) {\n this.truncated = false;\n this.expanded = false;\n } else {\n this.truncated = true;\n }\n };\n\n private getElementTop = (el: HTMLElement) => {\n return el.getClientRects && el.getClientRects()[0]\n ? el.getClientRects()[0].top\n : 0;\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n clearTimeout(this.resizeInterval);\n this.resizeInterval = window.setTimeout(this.resizeObserverCallback, 50);\n });\n this.resizeObserver.observe(this.truncWrapperEl);\n };\n\n private resizeObserverCallback = () => {\n if (this.lastWidth === this.el.clientWidth) {\n return;\n }\n\n if (this.truncatedHeight === 0) {\n this.checkMaxLines(this.el.clientHeight);\n return;\n }\n\n const markerTop = this.getElementTop(this.marker);\n if (markerTop === this.lastMarkerTop) {\n return;\n }\n\n this.checkMarkerPosition(this.getElementTop(this.el), markerTop);\n this.lastMarkerTop = markerTop;\n this.lastWidth = this.el.clientWidth;\n };\n\n private truncButtonFocus = (): void => {\n if (this.focusBtnFromKeyboard) {\n this.truncButtonFocussed = true;\n }\n };\n\n private truncButtonBlur = (): void => {\n this.focusBtnFromKeyboard = true;\n this.truncButtonFocussed = false;\n };\n\n private truncButtonFocusFromMouse = (): void => {\n this.focusBtnFromKeyboard = false;\n };\n\n render() {\n const {\n variant,\n applyVerticalMargins,\n maxLines,\n truncated,\n expanded,\n strikethrough,\n underline,\n italic,\n bold,\n theme,\n } = this;\n\n return (\n <Host\n class={{\n [`ic-typography-${variant}`]: true,\n [`ic-typography-vertical-margins-${variant}`]: applyVerticalMargins,\n [\"ic-typography-bold\"]: bold,\n [\"ic-typography-italic\"]: italic,\n [\"ic-typography-strikethrough\"]: strikethrough,\n [\"ic-typography-underline\"]: underline,\n [\"in-ag-grid\"]: this.inAGGrid,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n {(variant === \"body\" ||\n (this.el.getRootNode() as ShadowRoot)?.host?.tagName ===\n \"IC-TOOLTIP\") &&\n maxLines > 0 ? (\n <div class=\"trunc-wrapper\" ref={(el) => (this.truncWrapperEl = el)}>\n <slot />\n </div>\n ) : (\n <slot />\n )}\n {variant === \"body\" && maxLines > 0 && truncated && (\n <button\n class={{ \"trunc-btn\": true, focus: this.truncButtonFocussed }}\n onFocus={this.truncButtonFocus}\n onBlur={this.truncButtonBlur}\n onMouseDown={this.truncButtonFocusFromMouse}\n onClick={this.toggleExpanded}\n >\n {expanded ? \"See less\" : \"See more\"}\n </button>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|