@ukic/canary-web-components 3.0.0-canary.1 → 3.0.0-canary.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -2
- package/dist/cjs/core.cjs.js +1 -1
- package/dist/cjs/{helpers-6817cfbb.js → helpers-02b23286.js} +65 -155
- package/dist/cjs/helpers-02b23286.js.map +1 -0
- package/dist/cjs/{helpers-33b42cd6.js → helpers-ce248d54.js} +80 -29
- package/dist/cjs/helpers-ce248d54.js.map +1 -0
- package/dist/cjs/ic-accordion-group.cjs.entry.js +10 -10
- package/dist/cjs/ic-accordion-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-accordion.cjs.entry.js +12 -5
- package/dist/cjs/ic-accordion.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-alert.cjs.entry.js +9 -14
- 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 +26 -3
- 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 +47 -3
- package/dist/cjs/ic-breadcrumb.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-button_3.cjs.entry.js +28 -26
- package/dist/cjs/ic-button_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-card-horizontal.cjs.entry.js +33 -35
- package/dist/cjs/ic-card-horizontal.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-card-vertical.cjs.entry.js +48 -47
- package/dist/cjs/ic-card-vertical.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-checkbox-group.cjs.entry.js +21 -6
- package/dist/cjs/ic-checkbox-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-checkbox.cjs.entry.js +10 -4
- package/dist/cjs/ic-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-chip.cjs.entry.js +27 -15
- package/dist/cjs/ic-chip.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-classification-banner.cjs.entry.js +1 -1
- package/dist/cjs/ic-classification-banner.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-data-row.cjs.entry.js +1 -1
- package/dist/cjs/ic-data-table-title-bar.cjs.entry.js +7 -7
- package/dist/cjs/ic-data-table-title-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-data-table.cjs.entry.js +378 -108
- package/dist/cjs/ic-data-table.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-date-input.cjs.entry.js +23 -18
- package/dist/cjs/ic-date-input.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-date-picker.cjs.entry.js +16 -5
- package/dist/cjs/ic-date-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-dialog.cjs.entry.js +13 -5
- package/dist/cjs/ic-dialog.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-divider.cjs.entry.js +73 -9
- package/dist/cjs/ic-divider.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-empty-state_2.cjs.entry.js +101 -43
- package/dist/cjs/ic-empty-state_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-footer-link-group.cjs.entry.js +6 -7
- package/dist/cjs/ic-footer-link-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-footer-link.cjs.entry.js +7 -6
- package/dist/cjs/ic-footer-link.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-footer.cjs.entry.js +24 -14
- package/dist/cjs/ic-footer.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-hero.cjs.entry.js +7 -15
- package/dist/cjs/ic-hero.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-horizontal-scroll.cjs.entry.js +17 -9
- package/dist/cjs/ic-horizontal-scroll.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js +1016 -0
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js.map +1 -0
- package/dist/cjs/ic-input-label_2.cjs.entry.js +82 -0
- package/dist/cjs/ic-input-label_2.cjs.entry.js.map +1 -0
- package/dist/cjs/ic-link.cjs.entry.js +10 -12
- package/dist/cjs/ic-link.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-menu-group.cjs.entry.js +3 -3
- package/dist/cjs/ic-menu-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-menu-item.cjs.entry.js +25 -18
- package/dist/cjs/ic-menu-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-button.cjs.entry.js +11 -8
- package/dist/cjs/ic-navigation-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-group.cjs.entry.js +10 -8
- package/dist/cjs/ic-navigation-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-item.cjs.entry.js +60 -8
- 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 +8 -6
- package/dist/cjs/ic-page-header.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-pagination_4.cjs.entry.js +267 -112
- package/dist/cjs/ic-pagination_4.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-popover-menu.cjs.entry.js +47 -25
- package/dist/cjs/ic-popover-menu.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-radio-group.cjs.entry.js +58 -28
- package/dist/cjs/ic-radio-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-radio-option.cjs.entry.js +42 -22
- package/dist/cjs/ic-radio-option.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-search-bar.cjs.entry.js +54 -56
- package/dist/cjs/ic-search-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-side-navigation.cjs.entry.js +16 -11
- package/dist/cjs/ic-side-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-skeleton.cjs.entry.js +4 -4
- package/dist/cjs/ic-skeleton.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 +4 -5
- package/dist/cjs/ic-step.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-stepper.cjs.entry.js +12 -2
- package/dist/cjs/ic-stepper.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-switch.cjs.entry.js +21 -16
- package/dist/cjs/ic-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tab-context.cjs.entry.js +60 -123
- package/dist/cjs/ic-tab-context.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 +2 -2
- package/dist/cjs/ic-tab-panel.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tab.cjs.entry.js +10 -8
- package/dist/cjs/ic-tab.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-theme.cjs.entry.js +20 -20
- package/dist/cjs/ic-theme.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-toast.cjs.entry.js +4 -4
- package/dist/cjs/ic-toast.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-toggle-button-group.cjs.entry.js +62 -12
- package/dist/cjs/ic-toggle-button-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-toggle-button.cjs.entry.js +64 -9
- package/dist/cjs/ic-toggle-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-top-navigation.cjs.entry.js +13 -7
- package/dist/cjs/ic-top-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tree-item.cjs.entry.js +22 -16
- package/dist/cjs/ic-tree-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tree-view.cjs.entry.js +45 -23
- package/dist/cjs/ic-tree-view.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-typography.cjs.entry.js +5 -3
- package/dist/cjs/ic-typography.cjs.entry.js.map +1 -1
- package/dist/cjs/index-4cf27b16.js +4 -12
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +0 -2
- package/dist/collection/components/ic-card-horizontal/ic-card-horizontal.css +26 -26
- package/dist/collection/components/ic-card-horizontal/ic-card-horizontal.js +63 -38
- package/dist/collection/components/ic-card-horizontal/ic-card-horizontal.js.map +1 -1
- package/dist/collection/components/ic-card-horizontal/test/basic/ic-card-horizontal.spec.js +10 -0
- package/dist/collection/components/ic-card-horizontal/test/basic/ic-card-horizontal.spec.js.map +1 -1
- package/dist/collection/components/ic-data-table/ic-data-table.css +177 -23
- package/dist/collection/components/ic-data-table/ic-data-table.js +480 -127
- package/dist/collection/components/ic-data-table/ic-data-table.js.map +1 -1
- package/dist/collection/components/ic-data-table/ic-data-table.types.js.map +1 -1
- package/dist/collection/components/ic-data-table/story-data.js +425 -7
- package/dist/collection/components/ic-data-table/story-data.js.map +1 -1
- package/dist/collection/components/ic-data-table/test/basic/ic-data-table.spec.js +123 -2
- package/dist/collection/components/ic-data-table/test/basic/ic-data-table.spec.js.map +1 -1
- package/dist/collection/components/ic-data-table-title-bar/ic-data-table-title-bar.css +9 -4
- package/dist/collection/components/ic-data-table-title-bar/ic-data-table-title-bar.js +5 -5
- package/dist/collection/components/ic-data-table-title-bar/ic-data-table-title-bar.js.map +1 -1
- package/dist/collection/components/ic-date-input/ic-date-input.css +74 -9
- package/dist/collection/components/ic-date-input/ic-date-input.js +67 -18
- package/dist/collection/components/ic-date-input/ic-date-input.js.map +1 -1
- package/dist/collection/components/ic-date-picker/ic-date-picker.css +18 -16
- package/dist/collection/components/ic-date-picker/ic-date-picker.js +59 -4
- package/dist/collection/components/ic-date-picker/ic-date-picker.js.map +1 -1
- package/dist/collection/components/ic-pagination-bar/ic-pagination-bar.css +4 -7
- package/dist/collection/components/ic-pagination-bar/ic-pagination-bar.js +213 -46
- package/dist/collection/components/ic-pagination-bar/ic-pagination-bar.js.map +1 -1
- package/dist/collection/components/ic-pagination-bar/ic-pagination-bar.types.js +2 -0
- package/dist/collection/components/ic-pagination-bar/ic-pagination-bar.types.js.map +1 -0
- package/dist/collection/components/ic-pagination-bar/test/basic/ic-pagination-bar.spec.js +20 -2
- package/dist/collection/components/ic-pagination-bar/test/basic/ic-pagination-bar.spec.js.map +1 -1
- package/dist/collection/components/ic-tree-item/ic-tree-item.css +51 -26
- package/dist/collection/components/ic-tree-item/ic-tree-item.js +84 -44
- package/dist/collection/components/ic-tree-item/ic-tree-item.js.map +1 -1
- package/dist/collection/components/ic-tree-item/test/basic/ic-tree-item.spec.js +3 -0
- package/dist/collection/components/ic-tree-item/test/basic/ic-tree-item.spec.js.map +1 -1
- package/dist/collection/components/ic-tree-view/ic-tree-view.css +31 -8
- package/dist/collection/components/ic-tree-view/ic-tree-view.js +117 -37
- package/dist/collection/components/ic-tree-view/ic-tree-view.js.map +1 -1
- package/dist/collection/utils/helpers.js +53 -34
- package/dist/collection/utils/helpers.js.map +1 -1
- package/dist/collection/utils/types.js +6 -6
- package/dist/collection/utils/types.js.map +1 -1
- package/dist/components/helpers.js +73 -26
- package/dist/components/helpers.js.map +1 -1
- package/dist/components/helpers2.js +60 -145
- package/dist/components/helpers2.js.map +1 -1
- package/dist/components/ic-accordion-group.js +11 -11
- package/dist/components/ic-accordion-group.js.map +1 -1
- package/dist/components/ic-accordion.js +14 -6
- package/dist/components/ic-accordion.js.map +1 -1
- package/dist/components/ic-alert.js +12 -16
- 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 +28 -5
- package/dist/components/ic-badge.js.map +1 -1
- package/dist/components/ic-breadcrumb-group.js +44 -20
- package/dist/components/ic-breadcrumb-group.js.map +1 -1
- package/dist/components/ic-breadcrumb2.js +49 -3
- package/dist/components/ic-breadcrumb2.js.map +1 -1
- package/dist/components/ic-button2.js +21 -20
- package/dist/components/ic-button2.js.map +1 -1
- package/dist/components/ic-card-horizontal.js +38 -37
- package/dist/components/ic-card-horizontal.js.map +1 -1
- package/dist/components/ic-card-vertical.js +54 -50
- package/dist/components/ic-card-vertical.js.map +1 -1
- package/dist/components/ic-checkbox-group.js +25 -7
- package/dist/components/ic-checkbox-group.js.map +1 -1
- package/dist/components/ic-checkbox.js +12 -4
- package/dist/components/ic-checkbox.js.map +1 -1
- package/dist/components/ic-chip.js +32 -16
- package/dist/components/ic-chip.js.map +1 -1
- package/dist/components/ic-classification-banner.js +1 -1
- package/dist/components/ic-classification-banner.js.map +1 -1
- package/dist/components/ic-data-row.js +1 -1
- package/dist/components/ic-data-table-title-bar.js +6 -6
- package/dist/components/ic-data-table-title-bar.js.map +1 -1
- package/dist/components/ic-data-table.js +383 -108
- package/dist/components/ic-data-table.js.map +1 -1
- package/dist/components/ic-date-input2.js +26 -18
- package/dist/components/ic-date-input2.js.map +1 -1
- package/dist/components/ic-date-picker.js +19 -5
- package/dist/components/ic-date-picker.js.map +1 -1
- package/dist/components/ic-dialog.js +13 -4
- package/dist/components/ic-dialog.js.map +1 -1
- package/dist/components/ic-divider2.js +89 -12
- package/dist/components/ic-divider2.js.map +1 -1
- package/dist/components/ic-empty-state2.js +10 -17
- package/dist/components/ic-empty-state2.js.map +1 -1
- package/dist/components/ic-footer-link-group.js +7 -8
- package/dist/components/ic-footer-link-group.js.map +1 -1
- package/dist/components/ic-footer-link.js +8 -7
- package/dist/components/ic-footer-link.js.map +1 -1
- package/dist/components/ic-footer.js +25 -15
- package/dist/components/ic-footer.js.map +1 -1
- package/dist/components/ic-hero.js +9 -17
- package/dist/components/ic-hero.js.map +1 -1
- package/dist/components/ic-horizontal-scroll2.js +19 -9
- package/dist/components/ic-horizontal-scroll2.js.map +1 -1
- package/dist/components/ic-input-component-container2.js +23 -32
- package/dist/components/ic-input-component-container2.js.map +1 -1
- package/dist/components/ic-input-label2.js +19 -20
- package/dist/components/ic-input-label2.js.map +1 -1
- package/dist/components/ic-input-validation2.js +9 -9
- package/dist/components/ic-input-validation2.js.map +1 -1
- package/dist/components/ic-link2.js +13 -15
- package/dist/components/ic-link2.js.map +1 -1
- package/dist/components/ic-loading-indicator2.js +11 -9
- package/dist/components/ic-loading-indicator2.js.map +1 -1
- package/dist/components/ic-menu-group.js +2 -2
- package/dist/components/ic-menu-group.js.map +1 -1
- package/dist/components/ic-menu-item2.js +30 -21
- package/dist/components/ic-menu-item2.js.map +1 -1
- package/dist/components/ic-menu2.js +472 -175
- package/dist/components/ic-menu2.js.map +1 -1
- package/dist/components/ic-navigation-button.js +13 -9
- package/dist/components/ic-navigation-button.js.map +1 -1
- package/dist/components/ic-navigation-group.js +12 -9
- package/dist/components/ic-navigation-group.js.map +1 -1
- package/dist/components/ic-navigation-item.js +64 -10
- 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 +9 -6
- package/dist/components/ic-page-header.js.map +1 -1
- package/dist/components/ic-pagination-bar2.js +106 -32
- package/dist/components/ic-pagination-bar2.js.map +1 -1
- package/dist/components/ic-pagination-item2.js +15 -12
- package/dist/components/ic-pagination-item2.js.map +1 -1
- package/dist/components/ic-pagination2.js +25 -15
- package/dist/components/ic-pagination2.js.map +1 -1
- package/dist/components/ic-popover-menu.js +50 -26
- package/dist/components/ic-popover-menu.js.map +1 -1
- package/dist/components/ic-radio-group.js +61 -29
- package/dist/components/ic-radio-group.js.map +1 -1
- package/dist/components/ic-radio-option.js +45 -23
- package/dist/components/ic-radio-option.js.map +1 -1
- package/dist/components/ic-search-bar.js +70 -81
- package/dist/components/ic-search-bar.js.map +1 -1
- package/dist/components/ic-select2.js +196 -67
- package/dist/components/ic-select2.js.map +1 -1
- package/dist/components/ic-side-navigation.js +17 -12
- package/dist/components/ic-side-navigation.js.map +1 -1
- package/dist/components/ic-skeleton.js +5 -5
- package/dist/components/ic-skeleton.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-step.js +4 -4
- package/dist/components/ic-step.js.map +1 -1
- package/dist/components/ic-stepper.js +14 -3
- package/dist/components/ic-stepper.js.map +1 -1
- package/dist/components/ic-switch.js +24 -18
- package/dist/components/ic-switch.js.map +1 -1
- package/dist/components/ic-tab-context.js +60 -123
- package/dist/components/ic-tab-context.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-tab-panel.js +1 -1
- package/dist/components/ic-tab-panel.js.map +1 -1
- package/dist/components/ic-tab.js +10 -8
- package/dist/components/ic-tab.js.map +1 -1
- package/dist/components/ic-text-field2.js +46 -24
- package/dist/components/ic-text-field2.js.map +1 -1
- package/dist/components/ic-theme.js +22 -22
- package/dist/components/ic-theme.js.map +1 -1
- package/dist/components/ic-toast.js +4 -4
- package/dist/components/ic-toast.js.map +1 -1
- package/dist/components/ic-toggle-button-group.js +75 -14
- package/dist/components/ic-toggle-button-group.js.map +1 -1
- package/dist/components/ic-toggle-button.js +76 -17
- package/dist/components/ic-toggle-button.js.map +1 -1
- package/dist/components/ic-tooltip2.js +1 -1
- package/dist/components/ic-tooltip2.js.map +1 -1
- package/dist/components/ic-top-navigation.js +15 -8
- package/dist/components/ic-top-navigation.js.map +1 -1
- package/dist/components/ic-tree-item.js +27 -18
- package/dist/components/ic-tree-item.js.map +1 -1
- package/dist/components/ic-tree-view.js +54 -27
- package/dist/components/ic-tree-view.js.map +1 -1
- package/dist/components/ic-typography2.js +4 -2
- package/dist/components/ic-typography2.js.map +1 -1
- package/dist/core/core.css +1601 -77
- package/dist/core/core.esm.js +1 -1
- package/dist/core/core.esm.js.map +1 -1
- package/dist/core/p-0054bdc2.entry.js +2 -0
- package/dist/core/p-0054bdc2.entry.js.map +1 -0
- package/dist/core/p-01a23e24.entry.js +2 -0
- package/dist/core/p-01a23e24.entry.js.map +1 -0
- package/dist/core/{p-5f5403e2.entry.js → p-01ab3a15.entry.js} +2 -2
- package/dist/core/{p-5f5403e2.entry.js.map → p-01ab3a15.entry.js.map} +1 -1
- package/dist/core/p-063911a8.entry.js +2 -0
- package/dist/core/p-063911a8.entry.js.map +1 -0
- package/dist/core/{p-bf670360.entry.js → p-0c5d45e1.entry.js} +2 -2
- package/dist/core/p-0c5d45e1.entry.js.map +1 -0
- package/dist/core/p-0c9155f4.entry.js +2 -0
- package/dist/core/p-0c9155f4.entry.js.map +1 -0
- package/dist/core/p-14098257.entry.js +2 -0
- package/dist/core/p-14098257.entry.js.map +1 -0
- package/dist/core/p-157b47bc.entry.js +2 -0
- package/dist/core/p-157b47bc.entry.js.map +1 -0
- package/dist/core/{p-266341f5.entry.js → p-15a5cce5.entry.js} +2 -2
- package/dist/core/{p-266341f5.entry.js.map → p-15a5cce5.entry.js.map} +1 -1
- package/dist/core/{p-306def43.entry.js → p-1658e577.entry.js} +2 -2
- package/dist/core/p-1658e577.entry.js.map +1 -0
- package/dist/core/p-2169e75b.entry.js +2 -0
- package/dist/core/p-2169e75b.entry.js.map +1 -0
- package/dist/core/p-26aff39e.entry.js +2 -0
- package/dist/core/p-26aff39e.entry.js.map +1 -0
- package/dist/core/p-27b1223d.entry.js +2 -0
- package/dist/core/p-27b1223d.entry.js.map +1 -0
- package/dist/core/p-32726b89.entry.js +2 -0
- package/dist/core/p-32726b89.entry.js.map +1 -0
- package/dist/core/p-33110185.entry.js +2 -0
- package/dist/core/p-33110185.entry.js.map +1 -0
- package/dist/core/p-3963201d.entry.js +2 -0
- package/dist/core/p-3963201d.entry.js.map +1 -0
- package/dist/core/p-41bfa3e5.entry.js +2 -0
- package/dist/core/p-41bfa3e5.entry.js.map +1 -0
- package/dist/core/p-4347f05c.entry.js +2 -0
- package/dist/core/p-4347f05c.entry.js.map +1 -0
- package/dist/core/{p-d8563643.entry.js → p-45177148.entry.js} +2 -2
- package/dist/core/p-45177148.entry.js.map +1 -0
- package/dist/core/p-47a1ce8d.entry.js +2 -0
- package/dist/core/p-47a1ce8d.entry.js.map +1 -0
- package/dist/core/p-4f96bec1.entry.js +2 -0
- package/dist/core/p-4f96bec1.entry.js.map +1 -0
- package/dist/core/p-51058719.entry.js +2 -0
- package/dist/core/p-51058719.entry.js.map +1 -0
- package/dist/core/p-5193184c.entry.js +2 -0
- package/dist/core/p-5193184c.entry.js.map +1 -0
- package/dist/core/p-51faa4ba.entry.js +2 -0
- package/dist/core/p-51faa4ba.entry.js.map +1 -0
- package/dist/core/p-54dc696e.entry.js +2 -0
- package/dist/core/p-54dc696e.entry.js.map +1 -0
- package/dist/core/p-6188f029.entry.js +2 -0
- package/dist/core/p-6188f029.entry.js.map +1 -0
- package/dist/core/p-6ac8e09b.entry.js +2 -0
- package/dist/core/p-6ac8e09b.entry.js.map +1 -0
- package/dist/core/p-71496305.entry.js +2 -0
- package/dist/core/p-71496305.entry.js.map +1 -0
- package/dist/core/p-77157922.entry.js +2 -0
- package/dist/core/p-77157922.entry.js.map +1 -0
- package/dist/core/p-78ed3070.entry.js +2 -0
- package/dist/core/p-78ed3070.entry.js.map +1 -0
- package/dist/core/p-794ff553.entry.js +2 -0
- package/dist/core/p-794ff553.entry.js.map +1 -0
- package/dist/core/p-82b408ad.entry.js +2 -0
- package/dist/core/p-82b408ad.entry.js.map +1 -0
- package/dist/core/p-88913402.entry.js +2 -0
- package/dist/core/p-88913402.entry.js.map +1 -0
- package/dist/core/p-897fac99.js +2 -0
- package/dist/core/p-897fac99.js.map +1 -0
- package/dist/core/p-8e56516a.entry.js +2 -0
- package/dist/core/p-8e56516a.entry.js.map +1 -0
- package/dist/core/p-8ebd64ae.entry.js +2 -0
- package/dist/core/p-8ebd64ae.entry.js.map +1 -0
- package/dist/core/{p-c21d0db8.entry.js → p-9462f294.entry.js} +2 -2
- package/dist/core/p-9462f294.entry.js.map +1 -0
- package/dist/core/p-94efa0d2.entry.js +2 -0
- package/dist/core/p-94efa0d2.entry.js.map +1 -0
- package/dist/core/p-9a392c41.entry.js +2 -0
- package/dist/core/p-9a392c41.entry.js.map +1 -0
- package/dist/core/p-a04712b9.js +2 -0
- package/dist/core/p-a04712b9.js.map +1 -0
- package/dist/core/p-a1cf5884.entry.js +2 -0
- package/dist/core/p-a1cf5884.entry.js.map +1 -0
- package/dist/core/{p-73b40c79.entry.js → p-a1d5fff2.entry.js} +2 -2
- package/dist/core/p-a1d5fff2.entry.js.map +1 -0
- package/dist/core/p-a69ef3eb.entry.js +2 -0
- package/dist/core/p-a69ef3eb.entry.js.map +1 -0
- package/dist/core/p-abda7e21.entry.js +2 -0
- package/dist/core/p-abda7e21.entry.js.map +1 -0
- package/dist/core/p-abdd8560.entry.js +2 -0
- package/dist/core/p-abdd8560.entry.js.map +1 -0
- package/dist/core/p-ace8126b.entry.js +2 -0
- package/dist/core/p-ace8126b.entry.js.map +1 -0
- package/dist/core/p-b2a6f0dd.entry.js +2 -0
- package/dist/core/p-b2a6f0dd.entry.js.map +1 -0
- package/dist/core/p-b5a5fe39.entry.js +2 -0
- package/dist/core/p-b5a5fe39.entry.js.map +1 -0
- package/dist/core/{p-d03374fc.entry.js → p-b717ae40.entry.js} +2 -2
- package/dist/core/p-b85466a7.entry.js +2 -0
- package/dist/core/p-b85466a7.entry.js.map +1 -0
- package/dist/core/p-bd4401d5.entry.js +2 -0
- package/dist/core/p-bd4401d5.entry.js.map +1 -0
- package/dist/core/p-bd87bf33.entry.js +2 -0
- package/dist/core/p-bd87bf33.entry.js.map +1 -0
- package/dist/core/{p-5f313e1a.entry.js → p-be1ec9aa.entry.js} +2 -2
- package/dist/core/p-be1ec9aa.entry.js.map +1 -0
- package/dist/core/p-c035d7b9.entry.js +2 -0
- package/dist/core/p-c035d7b9.entry.js.map +1 -0
- package/dist/core/p-ce923b92.entry.js +2 -0
- package/dist/core/p-ce923b92.entry.js.map +1 -0
- package/dist/core/p-d2b2b7df.entry.js +2 -0
- package/dist/core/p-d2b2b7df.entry.js.map +1 -0
- package/dist/core/p-e1df1b9a.entry.js +2 -0
- package/dist/core/p-e1df1b9a.entry.js.map +1 -0
- package/dist/core/p-e3e0cf46.entry.js +2 -0
- package/dist/core/p-e3e0cf46.entry.js.map +1 -0
- package/dist/core/p-f3d2af04.entry.js +2 -0
- package/dist/core/p-f3d2af04.entry.js.map +1 -0
- package/dist/core/{p-f1072c28.entry.js → p-f64abdff.entry.js} +2 -2
- package/dist/core/p-f64abdff.entry.js.map +1 -0
- package/dist/core/p-fc155ae2.entry.js +2 -0
- package/dist/core/p-fc155ae2.entry.js.map +1 -0
- package/dist/core/p-ffb11ad1.entry.js +2 -0
- package/dist/core/p-ffb11ad1.entry.js.map +1 -0
- package/dist/esm/core.js +1 -1
- package/dist/esm/{helpers-5bd2012a.js → helpers-0f42cb46.js} +61 -146
- package/dist/esm/helpers-0f42cb46.js.map +1 -0
- package/dist/esm/{helpers-dab8ddfe.js → helpers-56c75bf4.js} +74 -27
- package/dist/esm/helpers-56c75bf4.js.map +1 -0
- package/dist/esm/ic-accordion-group.entry.js +10 -10
- package/dist/esm/ic-accordion-group.entry.js.map +1 -1
- package/dist/esm/ic-accordion.entry.js +12 -5
- package/dist/esm/ic-accordion.entry.js.map +1 -1
- package/dist/esm/ic-alert.entry.js +10 -15
- 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 +26 -3
- 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 +47 -3
- package/dist/esm/ic-breadcrumb.entry.js.map +1 -1
- package/dist/esm/ic-button_3.entry.js +28 -26
- package/dist/esm/ic-button_3.entry.js.map +1 -1
- package/dist/esm/ic-card-horizontal.entry.js +34 -36
- package/dist/esm/ic-card-horizontal.entry.js.map +1 -1
- package/dist/esm/ic-card-vertical.entry.js +49 -48
- package/dist/esm/ic-card-vertical.entry.js.map +1 -1
- package/dist/esm/ic-checkbox-group.entry.js +21 -6
- package/dist/esm/ic-checkbox-group.entry.js.map +1 -1
- package/dist/esm/ic-checkbox.entry.js +10 -4
- package/dist/esm/ic-checkbox.entry.js.map +1 -1
- package/dist/esm/ic-chip.entry.js +28 -16
- package/dist/esm/ic-chip.entry.js.map +1 -1
- package/dist/esm/ic-classification-banner.entry.js +1 -1
- package/dist/esm/ic-classification-banner.entry.js.map +1 -1
- package/dist/esm/ic-data-row.entry.js +1 -1
- package/dist/esm/ic-data-table-title-bar.entry.js +7 -7
- package/dist/esm/ic-data-table-title-bar.entry.js.map +1 -1
- package/dist/esm/ic-data-table.entry.js +378 -108
- package/dist/esm/ic-data-table.entry.js.map +1 -1
- package/dist/esm/ic-date-input.entry.js +23 -18
- package/dist/esm/ic-date-input.entry.js.map +1 -1
- package/dist/esm/ic-date-picker.entry.js +16 -5
- package/dist/esm/ic-date-picker.entry.js.map +1 -1
- package/dist/esm/ic-dialog.entry.js +13 -5
- package/dist/esm/ic-dialog.entry.js.map +1 -1
- package/dist/esm/ic-divider.entry.js +74 -10
- package/dist/esm/ic-divider.entry.js.map +1 -1
- package/dist/esm/ic-empty-state_2.entry.js +102 -44
- package/dist/esm/ic-empty-state_2.entry.js.map +1 -1
- package/dist/esm/ic-footer-link-group.entry.js +6 -7
- package/dist/esm/ic-footer-link-group.entry.js.map +1 -1
- package/dist/esm/ic-footer-link.entry.js +7 -6
- package/dist/esm/ic-footer-link.entry.js.map +1 -1
- package/dist/esm/ic-footer.entry.js +24 -14
- package/dist/esm/ic-footer.entry.js.map +1 -1
- package/dist/esm/ic-hero.entry.js +8 -16
- package/dist/esm/ic-hero.entry.js.map +1 -1
- package/dist/esm/ic-horizontal-scroll.entry.js +17 -9
- package/dist/esm/ic-horizontal-scroll.entry.js.map +1 -1
- package/dist/{collection/components/ic-menu-with-multi/ic-menu.js → esm/ic-input-component-container_3.entry.js} +173 -739
- package/dist/esm/ic-input-component-container_3.entry.js.map +1 -0
- package/dist/esm/ic-input-label_2.entry.js +77 -0
- package/dist/esm/ic-input-label_2.entry.js.map +1 -0
- package/dist/esm/ic-link.entry.js +10 -12
- package/dist/esm/ic-link.entry.js.map +1 -1
- package/dist/esm/ic-menu-group.entry.js +3 -3
- package/dist/esm/ic-menu-group.entry.js.map +1 -1
- package/dist/esm/ic-menu-item.entry.js +25 -18
- package/dist/esm/ic-menu-item.entry.js.map +1 -1
- package/dist/esm/ic-navigation-button.entry.js +11 -8
- package/dist/esm/ic-navigation-button.entry.js.map +1 -1
- package/dist/esm/ic-navigation-group.entry.js +10 -8
- package/dist/esm/ic-navigation-group.entry.js.map +1 -1
- package/dist/esm/ic-navigation-item.entry.js +61 -9
- 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 +8 -6
- package/dist/esm/ic-page-header.entry.js.map +1 -1
- package/dist/esm/ic-pagination_4.entry.js +267 -112
- package/dist/esm/ic-pagination_4.entry.js.map +1 -1
- package/dist/esm/ic-popover-menu.entry.js +47 -25
- package/dist/esm/ic-popover-menu.entry.js.map +1 -1
- package/dist/esm/ic-radio-group.entry.js +58 -28
- package/dist/esm/ic-radio-group.entry.js.map +1 -1
- package/dist/esm/ic-radio-option.entry.js +42 -22
- package/dist/esm/ic-radio-option.entry.js.map +1 -1
- package/dist/esm/ic-search-bar.entry.js +54 -56
- package/dist/esm/ic-search-bar.entry.js.map +1 -1
- package/dist/esm/ic-side-navigation.entry.js +16 -11
- package/dist/esm/ic-side-navigation.entry.js.map +1 -1
- package/dist/esm/ic-skeleton.entry.js +4 -4
- package/dist/esm/ic-skeleton.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 +4 -5
- package/dist/esm/ic-step.entry.js.map +1 -1
- package/dist/esm/ic-stepper.entry.js +12 -2
- package/dist/esm/ic-stepper.entry.js.map +1 -1
- package/dist/esm/ic-switch.entry.js +21 -16
- package/dist/esm/ic-switch.entry.js.map +1 -1
- package/dist/esm/ic-tab-context.entry.js +60 -123
- package/dist/esm/ic-tab-context.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 +2 -2
- package/dist/esm/ic-tab-panel.entry.js.map +1 -1
- package/dist/esm/ic-tab.entry.js +10 -8
- package/dist/esm/ic-tab.entry.js.map +1 -1
- package/dist/esm/ic-theme.entry.js +20 -20
- package/dist/esm/ic-theme.entry.js.map +1 -1
- package/dist/esm/ic-toast.entry.js +4 -4
- package/dist/esm/ic-toast.entry.js.map +1 -1
- package/dist/esm/ic-toggle-button-group.entry.js +62 -12
- package/dist/esm/ic-toggle-button-group.entry.js.map +1 -1
- package/dist/esm/ic-toggle-button.entry.js +64 -9
- package/dist/esm/ic-toggle-button.entry.js.map +1 -1
- package/dist/esm/ic-top-navigation.entry.js +13 -7
- package/dist/esm/ic-top-navigation.entry.js.map +1 -1
- package/dist/esm/ic-tree-item.entry.js +23 -17
- package/dist/esm/ic-tree-item.entry.js.map +1 -1
- package/dist/esm/ic-tree-view.entry.js +46 -24
- package/dist/esm/ic-tree-view.entry.js.map +1 -1
- package/dist/esm/ic-typography.entry.js +5 -3
- package/dist/esm/ic-typography.entry.js.map +1 -1
- package/dist/esm/index-93509377.js +4 -12
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/ic-card-horizontal/ic-card-horizontal.d.ts +8 -4
- package/dist/types/components/ic-data-table/ic-data-table.d.ts +50 -5
- package/dist/types/components/ic-data-table/ic-data-table.types.d.ts +11 -0
- package/dist/types/components/ic-data-table/story-data.d.ts +223 -0
- package/dist/types/components/ic-date-input/ic-date-input.d.ts +10 -1
- package/dist/types/components/ic-date-picker/ic-date-picker.d.ts +10 -1
- package/dist/types/components/ic-pagination-bar/ic-pagination-bar.d.ts +33 -8
- package/dist/types/components/ic-pagination-bar/ic-pagination-bar.types.d.ts +4 -0
- package/dist/types/components/ic-tree-item/ic-tree-item.d.ts +16 -7
- package/dist/types/components/ic-tree-view/ic-tree-view.d.ts +19 -5
- package/dist/types/components.d.ts +189 -488
- package/dist/types/utils/helpers.d.ts +14 -11
- package/dist/types/utils/types.d.ts +17 -12
- package/hydrate/index.js +5118 -7475
- package/package.json +12 -10
- package/dist/cjs/helpers-33b42cd6.js.map +0 -1
- package/dist/cjs/helpers-6817cfbb.js.map +0 -1
- package/dist/cjs/ic-input-component-container_4.cjs.entry.js +0 -156
- package/dist/cjs/ic-input-component-container_4.cjs.entry.js.map +0 -1
- package/dist/cjs/ic-menu-with-multi.cjs.entry.js +0 -2738
- package/dist/cjs/ic-menu-with-multi.cjs.entry.js.map +0 -1
- package/dist/cjs/ic-menu.cjs.entry.js +0 -658
- package/dist/cjs/ic-menu.cjs.entry.js.map +0 -1
- package/dist/cjs/ic-select-with-multi.cjs.entry.js +0 -788
- package/dist/cjs/ic-select-with-multi.cjs.entry.js.map +0 -1
- package/dist/collection/components/ic-menu-with-multi/ic-menu.css +0 -712
- package/dist/collection/components/ic-menu-with-multi/ic-menu.js.map +0 -1
- package/dist/collection/components/ic-menu-with-multi/test/basic/ic-menu.spec.js +0 -1057
- package/dist/collection/components/ic-menu-with-multi/test/basic/ic-menu.spec.js.map +0 -1
- package/dist/collection/components/ic-select-with-multi/assets/Check.svg +0 -3
- package/dist/collection/components/ic-select-with-multi/assets/Clear.svg +0 -3
- package/dist/collection/components/ic-select-with-multi/assets/Expand.svg +0 -3
- package/dist/collection/components/ic-select-with-multi/ic-select.css +0 -695
- package/dist/collection/components/ic-select-with-multi/ic-select.js +0 -1520
- package/dist/collection/components/ic-select-with-multi/ic-select.js.map +0 -1
- package/dist/collection/components/ic-select-with-multi/story-data.js +0 -216
- package/dist/collection/components/ic-select-with-multi/story-data.js.map +0 -1
- package/dist/collection/components/ic-select-with-multi/test/basic/ic-select.spec.js +0 -1518
- package/dist/collection/components/ic-select-with-multi/test/basic/ic-select.spec.js.map +0 -1
- package/dist/components/ic-menu-with-multi.d.ts +0 -11
- package/dist/components/ic-menu-with-multi.js +0 -8
- package/dist/components/ic-menu-with-multi.js.map +0 -1
- package/dist/components/ic-menu3.js +0 -2803
- package/dist/components/ic-menu3.js.map +0 -1
- package/dist/components/ic-select-with-multi.d.ts +0 -11
- package/dist/components/ic-select-with-multi.js +0 -906
- package/dist/components/ic-select-with-multi.js.map +0 -1
- package/dist/core/p-06eeb7f2.entry.js +0 -2
- package/dist/core/p-06eeb7f2.entry.js.map +0 -1
- package/dist/core/p-0922c552.entry.js +0 -2
- package/dist/core/p-0922c552.entry.js.map +0 -1
- package/dist/core/p-0bc0e852.entry.js +0 -2
- package/dist/core/p-0bc0e852.entry.js.map +0 -1
- package/dist/core/p-108a9029.entry.js +0 -2
- package/dist/core/p-108a9029.entry.js.map +0 -1
- package/dist/core/p-13100d3c.entry.js +0 -2
- package/dist/core/p-13100d3c.entry.js.map +0 -1
- package/dist/core/p-1769df1d.entry.js +0 -2
- package/dist/core/p-1769df1d.entry.js.map +0 -1
- package/dist/core/p-202bc922.entry.js +0 -2
- package/dist/core/p-202bc922.entry.js.map +0 -1
- package/dist/core/p-297e99cf.js +0 -2
- package/dist/core/p-297e99cf.js.map +0 -1
- package/dist/core/p-306def43.entry.js.map +0 -1
- package/dist/core/p-30b046b2.entry.js +0 -2
- package/dist/core/p-30b046b2.entry.js.map +0 -1
- package/dist/core/p-3778cc5e.entry.js +0 -2
- package/dist/core/p-3778cc5e.entry.js.map +0 -1
- package/dist/core/p-383a5a76.entry.js +0 -2
- package/dist/core/p-383a5a76.entry.js.map +0 -1
- package/dist/core/p-3a0510e2.entry.js +0 -2
- package/dist/core/p-3a0510e2.entry.js.map +0 -1
- package/dist/core/p-3ace51f5.entry.js +0 -2
- package/dist/core/p-3ace51f5.entry.js.map +0 -1
- package/dist/core/p-3f0391c1.entry.js +0 -2
- package/dist/core/p-3f0391c1.entry.js.map +0 -1
- package/dist/core/p-41fecc61.entry.js +0 -2
- package/dist/core/p-41fecc61.entry.js.map +0 -1
- package/dist/core/p-46cb94a2.entry.js +0 -2
- package/dist/core/p-46cb94a2.entry.js.map +0 -1
- package/dist/core/p-4e67f127.entry.js +0 -2
- package/dist/core/p-4e67f127.entry.js.map +0 -1
- package/dist/core/p-505250cf.entry.js +0 -2
- package/dist/core/p-505250cf.entry.js.map +0 -1
- package/dist/core/p-50e48f4d.entry.js +0 -2
- package/dist/core/p-50e48f4d.entry.js.map +0 -1
- package/dist/core/p-56e7459a.entry.js +0 -2
- package/dist/core/p-56e7459a.entry.js.map +0 -1
- package/dist/core/p-59028160.entry.js +0 -2
- package/dist/core/p-59028160.entry.js.map +0 -1
- package/dist/core/p-5cfb5821.entry.js +0 -2
- package/dist/core/p-5cfb5821.entry.js.map +0 -1
- package/dist/core/p-5e6fd734.entry.js +0 -2
- package/dist/core/p-5e6fd734.entry.js.map +0 -1
- package/dist/core/p-5f313e1a.entry.js.map +0 -1
- package/dist/core/p-710c6a42.entry.js +0 -2
- package/dist/core/p-710c6a42.entry.js.map +0 -1
- package/dist/core/p-73b40c79.entry.js.map +0 -1
- package/dist/core/p-77a32de5.entry.js +0 -2
- package/dist/core/p-77a32de5.entry.js.map +0 -1
- package/dist/core/p-7a9de008.entry.js +0 -2
- package/dist/core/p-7a9de008.entry.js.map +0 -1
- package/dist/core/p-801414e2.entry.js +0 -2
- package/dist/core/p-801414e2.entry.js.map +0 -1
- package/dist/core/p-82ba744d.entry.js +0 -2
- package/dist/core/p-82ba744d.entry.js.map +0 -1
- package/dist/core/p-897b8d16.entry.js +0 -2
- package/dist/core/p-897b8d16.entry.js.map +0 -1
- package/dist/core/p-9397b15b.js +0 -2
- package/dist/core/p-9397b15b.js.map +0 -1
- package/dist/core/p-9af6adb1.entry.js +0 -2
- package/dist/core/p-9af6adb1.entry.js.map +0 -1
- package/dist/core/p-9b54feca.entry.js +0 -2
- package/dist/core/p-9b54feca.entry.js.map +0 -1
- package/dist/core/p-a57cd616.entry.js +0 -2
- package/dist/core/p-a57cd616.entry.js.map +0 -1
- package/dist/core/p-a5eaed1a.entry.js +0 -2
- package/dist/core/p-a5eaed1a.entry.js.map +0 -1
- package/dist/core/p-a78cf2cb.entry.js +0 -2
- package/dist/core/p-a78cf2cb.entry.js.map +0 -1
- package/dist/core/p-a91340b4.entry.js +0 -2
- package/dist/core/p-a91340b4.entry.js.map +0 -1
- package/dist/core/p-aee8d45b.entry.js +0 -2
- package/dist/core/p-aee8d45b.entry.js.map +0 -1
- package/dist/core/p-badd4c8d.entry.js +0 -2
- package/dist/core/p-badd4c8d.entry.js.map +0 -1
- package/dist/core/p-bf670360.entry.js.map +0 -1
- package/dist/core/p-c033e7d6.entry.js +0 -2
- package/dist/core/p-c033e7d6.entry.js.map +0 -1
- package/dist/core/p-c07af2d8.entry.js +0 -2
- package/dist/core/p-c07af2d8.entry.js.map +0 -1
- package/dist/core/p-c21d0db8.entry.js.map +0 -1
- package/dist/core/p-c678f73d.entry.js +0 -2
- package/dist/core/p-c678f73d.entry.js.map +0 -1
- package/dist/core/p-c6ae9bad.entry.js +0 -2
- package/dist/core/p-c6ae9bad.entry.js.map +0 -1
- package/dist/core/p-c6c1e08e.entry.js +0 -2
- package/dist/core/p-c6c1e08e.entry.js.map +0 -1
- package/dist/core/p-cb6cebdd.entry.js +0 -2
- package/dist/core/p-cb6cebdd.entry.js.map +0 -1
- package/dist/core/p-d16f364a.entry.js +0 -2
- package/dist/core/p-d16f364a.entry.js.map +0 -1
- package/dist/core/p-d239c33b.entry.js +0 -2
- package/dist/core/p-d239c33b.entry.js.map +0 -1
- package/dist/core/p-d8563643.entry.js.map +0 -1
- package/dist/core/p-da40757f.entry.js +0 -2
- package/dist/core/p-da40757f.entry.js.map +0 -1
- package/dist/core/p-de052137.entry.js +0 -2
- package/dist/core/p-de052137.entry.js.map +0 -1
- package/dist/core/p-e5d99316.entry.js +0 -2
- package/dist/core/p-e5d99316.entry.js.map +0 -1
- package/dist/core/p-e89bb650.entry.js +0 -2
- package/dist/core/p-e89bb650.entry.js.map +0 -1
- package/dist/core/p-f1072c28.entry.js.map +0 -1
- package/dist/core/p-f37df214.entry.js +0 -2
- package/dist/core/p-f37df214.entry.js.map +0 -1
- package/dist/core/p-f743b0eb.entry.js +0 -2
- package/dist/core/p-f743b0eb.entry.js.map +0 -1
- package/dist/core/p-f98b1afc.entry.js +0 -2
- package/dist/core/p-f98b1afc.entry.js.map +0 -1
- package/dist/core/p-fe13f1ba.entry.js +0 -2
- package/dist/core/p-fe13f1ba.entry.js.map +0 -1
- package/dist/esm/helpers-5bd2012a.js.map +0 -1
- package/dist/esm/helpers-dab8ddfe.js.map +0 -1
- package/dist/esm/ic-input-component-container_4.entry.js +0 -149
- package/dist/esm/ic-input-component-container_4.entry.js.map +0 -1
- package/dist/esm/ic-menu-with-multi.entry.js +0 -2734
- package/dist/esm/ic-menu-with-multi.entry.js.map +0 -1
- package/dist/esm/ic-menu.entry.js +0 -654
- package/dist/esm/ic-menu.entry.js.map +0 -1
- package/dist/esm/ic-select-with-multi.entry.js +0 -784
- package/dist/esm/ic-select-with-multi.entry.js.map +0 -1
- package/dist/types/components/ic-menu-with-multi/ic-menu.d.ts +0 -214
- package/dist/types/components/ic-select-with-multi/ic-select.d.ts +0 -259
- package/dist/types/components/ic-select-with-multi/story-data.d.ts +0 -32
- /package/dist/core/{p-d03374fc.entry.js.map → p-b717ae40.entry.js.map} +0 -0
@@ -0,0 +1,1016 @@
|
|
1
|
+
'use strict';
|
2
|
+
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
4
|
+
|
5
|
+
const index = require('./index-4cf27b16.js');
|
6
|
+
const helpers = require('./helpers-ce248d54.js');
|
7
|
+
const checkIcon = require('./check-icon-dd563898.js');
|
8
|
+
const popper = require('./popper-16968c2e.js');
|
9
|
+
|
10
|
+
const icInputComponentContainerCss = "ic-input-component-container{display:flex;border:var(--ic-border-width) solid\n var(--border-color, var(--ic-architectural-400));border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-slow);height:2.5rem;width:var(--input-width, 20rem);padding:var(--ic-space-1px);background-color:var(--input-bg-color, var(--ic-color-background-primary));box-sizing:border-box;fill:var(--ic-architectural-400);outline:none}ic-input-component-container.ic-input-component-container-full-width{width:100%}ic-input-component-container.ic-input-component-container-disabled,ic-input-component-container.ic-input-component-container-disabled:hover{border:var(--ic-border-width) dashed\n var(--border-color-disabled, var(--ic-color-border-neutral-disabled))}ic-input-component-container.ic-input-component-container-readonly,ic-input-component-container.ic-input-component-container-readonly:hover{border:none;padding:0}ic-input-component-container.ic-input-component-container-error{border:var(--ic-space-xxxs) solid\n var(--border-color-error, var(--ic-color-border-error));padding:0}ic-input-component-container.ic-input-component-container-error:hover{border:var(--ic-space-xxxs) solid\n var(--border-color-error-hover, var(--ic-color-border-error-hover))}ic-input-component-container.ic-input-component-container-error:focus-within{border:var(--ic-space-xxxs) solid\n var(--border-color-error-pressed, var(--ic-color-border-error-pressed))}ic-input-component-container.ic-input-component-container-warning{border:var(--ic-space-xxxs) solid\n var(--border-color-warning, var(--ic-color-border-warning));padding:0}ic-input-component-container.ic-input-component-container-warning:hover{border:var(--ic-space-xxxs) solid\n var(--border-color-warning-hover, var(--ic-color-border-warning-hover))}ic-input-component-container.ic-input-component-container-warning:focus-within{border:var(--ic-space-xxxs) solid\n var(--border-color-warning-pressed, var(--ic-color-border-warning-pressed))}ic-input-component-container.ic-input-component-container-success{border:var(--ic-space-xxxs) solid\n var(--border-color-success, var(--ic-color-border-success));padding:0}ic-input-component-container.ic-input-component-container-success:hover{border:var(--ic-space-xxxs) solid\n var(--border-color-success-hover, var(--ic-color-border-success-hover))}ic-input-component-container.ic-input-component-container-success:focus-within{border:var(--ic-space-xxxs) solid\n var(--border-color-success-pressed, var(--ic-color-border-success-pressed))}ic-input-component-container.ic-input-component-container-small{height:var(--ic-space-xl)}ic-input-component-container.ic-input-component-container-large{height:var(--ic-space-xxl)}ic-input-component-container.ic-input-component-container-multiline{height:auto}ic-input-component-container .icon-container{margin-top:var(--ic-space-xxs);margin-left:0.438rem;display:flex;align-items:center}ic-input-component-container.ic-input-component-container-multiline .icon-container,ic-input-component-container.ic-input-component-container-multiline.ic-input-component-container-small .icon-container{margin-top:0.375rem;display:block}ic-input-component-container.ic-input-component-container-readonly .icon-container{margin-left:-0.313rem}ic-input-component-container.ic-input-component-container-disabled ::-moz-placeholder{display:none}ic-input-component-container.ic-input-component-container-disabled ::placeholder{display:none}ic-input-component-container .inline-success{margin:var(--ic-space-xs) 0.375rem;display:flex;align-items:center}ic-input-component-container .inline-success>svg{fill:var(--ic-input-component-container-success-icon-inline-color);height:1.25rem;width:1.25rem}ic-input-component-container:hover{border:var(--ic-input-component-container-hover-border);border-color:var(--border-color-hover, var(--ic-color-border-neutral-hover));color:var(--ic-action-dark-hover)}ic-input-component-container:focus{border:var(--ic-border-pressed);border-color:var(\n --border-color-pressed,\n var(--ic-color-border-neutral-pressed)\n )}.focus-indicator{display:flex;width:100%;margin:-0.125rem;padding:0.125rem;border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast)}.focus-indicator:focus-within,.focus-indicator-enabled{box-shadow:var(--ic-border-focus)}.focus-indicator.ic-input-component-container-dark:focus-within{box-shadow:var(--ic-border-focus)}@media (forced-colors: active){ic-input-component-container,.focus-indicator{transition:none}ic-input-component-container:focus-within{border:var(--ic-border-width) solid Highlight;outline:0.125rem solid Highlight}ic-input-component-container.ic-input-component-container-disabled,ic-input-component-container.ic-input-component-container-disabled:hover{border:var(--ic-border-width) dashed GrayText}}";
|
11
|
+
|
12
|
+
const InputComponentContainer = class {
|
13
|
+
constructor(hostRef) {
|
14
|
+
index.registerInstance(this, hostRef);
|
15
|
+
this.disabled = false;
|
16
|
+
this.fullWidth = false;
|
17
|
+
this.multiLine = false;
|
18
|
+
this.readonly = false;
|
19
|
+
this.size = "medium";
|
20
|
+
this.validationInline = false;
|
21
|
+
this.validationStatus = "";
|
22
|
+
}
|
23
|
+
watchDisabledHandler() {
|
24
|
+
helpers.removeDisabledFalse(this.disabled, this.el);
|
25
|
+
}
|
26
|
+
componentWillLoad() {
|
27
|
+
helpers.removeDisabledFalse(this.disabled, this.el);
|
28
|
+
}
|
29
|
+
componentDidLoad() {
|
30
|
+
this.hostMutationObserver = new MutationObserver((mutationList) => helpers.renderDynamicChildSlots(mutationList, "left-icon", this));
|
31
|
+
this.hostMutationObserver.observe(this.el, { childList: true });
|
32
|
+
}
|
33
|
+
render() {
|
34
|
+
const { size, validationStatus, disabled, readonly, multiLine, fullWidth, validationInline, } = this;
|
35
|
+
return (index.h(index.Host, { class: {
|
36
|
+
[`ic-input-component-container-${size}`]: true,
|
37
|
+
[`ic-input-component-container-${validationStatus}`]: validationStatus !== "" && !disabled && !readonly,
|
38
|
+
"ic-input-component-container-disabled": disabled,
|
39
|
+
"ic-input-component-container-readonly": readonly,
|
40
|
+
"ic-input-component-container-multiline": multiLine,
|
41
|
+
"ic-input-component-container-full-width": fullWidth,
|
42
|
+
}, "aria-disabled": disabled ? "true" : null }, index.h("div", { class: "focus-indicator" }, helpers.slotHasContent(this.el, "left-icon") && (index.h("div", { class: "icon-container" }, index.h("slot", { name: "left-icon" }))), index.h("slot", null), validationInline &&
|
43
|
+
validationStatus === helpers.IcInformationStatus.Success && (index.h("span", { class: "inline-success", innerHTML: helpers.successIcon })))));
|
44
|
+
}
|
45
|
+
get el() { return index.getElement(this); }
|
46
|
+
static get watchers() { return {
|
47
|
+
"disabled": ["watchDisabledHandler"]
|
48
|
+
}; }
|
49
|
+
};
|
50
|
+
InputComponentContainer.style = icInputComponentContainerCss;
|
51
|
+
|
52
|
+
const icInputContainerCss = "ic-input-container .component-container{display:flex;flex-direction:column}";
|
53
|
+
|
54
|
+
const InputContainer = class {
|
55
|
+
constructor(hostRef) {
|
56
|
+
index.registerInstance(this, hostRef);
|
57
|
+
this.disabled = false;
|
58
|
+
this.readonly = false;
|
59
|
+
}
|
60
|
+
render() {
|
61
|
+
return (index.h(index.Host, null, index.h("div", { class: {
|
62
|
+
["component-container"]: true,
|
63
|
+
["disabled"]: this.disabled,
|
64
|
+
["readonly"]: this.readonly,
|
65
|
+
} }, index.h("slot", null))));
|
66
|
+
}
|
67
|
+
};
|
68
|
+
InputContainer.style = icInputContainerCss;
|
69
|
+
|
70
|
+
const icMenuCss = "html.sc-ic-menu{line-height:1.15;-webkit-text-size-adjust:100%}body.sc-ic-menu{margin:0}main.sc-ic-menu{display:block}h1.sc-ic-menu{font-size:2em;margin:0.67em 0}hr.sc-ic-menu{box-sizing:content-box;height:0;overflow:visible}pre.sc-ic-menu{font-family:monospace, monospace;font-size:1em}a.sc-ic-menu{background-color:transparent}abbr[title].sc-ic-menu{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b.sc-ic-menu,strong.sc-ic-menu{font-weight:bolder}code.sc-ic-menu,kbd.sc-ic-menu,samp.sc-ic-menu{font-family:monospace, monospace;font-size:1em}small.sc-ic-menu{font-size:80%}sub.sc-ic-menu,sup.sc-ic-menu{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub.sc-ic-menu{bottom:-0.25em}sup.sc-ic-menu{top:-0.5em}img.sc-ic-menu{border-style:none}button.sc-ic-menu,input.sc-ic-menu,optgroup.sc-ic-menu,select.sc-ic-menu,textarea.sc-ic-menu{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button.sc-ic-menu,input.sc-ic-menu{overflow:visible}button.sc-ic-menu,select.sc-ic-menu{text-transform:none}button.sc-ic-menu,[type=\"button\"].sc-ic-menu,[type=\"reset\"].sc-ic-menu,[type=\"submit\"].sc-ic-menu{-webkit-appearance:button}button.sc-ic-menu::-moz-focus-inner,[type=\"button\"].sc-ic-menu::-moz-focus-inner,[type=\"reset\"].sc-ic-menu::-moz-focus-inner,[type=\"submit\"].sc-ic-menu::-moz-focus-inner{border-style:none;padding:0}button.sc-ic-menu:-moz-focusring,[type=\"button\"].sc-ic-menu:-moz-focusring,[type=\"reset\"].sc-ic-menu:-moz-focusring,[type=\"submit\"].sc-ic-menu:-moz-focusring{outline:1px dotted ButtonText}fieldset.sc-ic-menu{padding:0.35em 0.75em 0.625em}legend.sc-ic-menu{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress.sc-ic-menu{vertical-align:baseline}textarea.sc-ic-menu{overflow:auto}[type=\"checkbox\"].sc-ic-menu,[type=\"radio\"].sc-ic-menu{box-sizing:border-box;padding:0}[type=\"number\"].sc-ic-menu::-webkit-inner-spin-button,[type=\"number\"].sc-ic-menu::-webkit-outer-spin-button{height:auto}[type=\"search\"].sc-ic-menu{-webkit-appearance:textfield;outline-offset:-2px}[type=\"search\"].sc-ic-menu::-webkit-search-decoration{-webkit-appearance:none}.sc-ic-menu::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details.sc-ic-menu{display:block}summary.sc-ic-menu{display:list-item}template.sc-ic-menu{display:none}[hidden].sc-ic-menu{display:none}html.sc-ic-menu,body.sc-ic-menu,div.sc-ic-menu,span.sc-ic-menu,applet.sc-ic-menu,object.sc-ic-menu,iframe.sc-ic-menu,h1.sc-ic-menu,h2.sc-ic-menu,h3.sc-ic-menu,h4.sc-ic-menu,h5.sc-ic-menu,h6.sc-ic-menu,p.sc-ic-menu,blockquote.sc-ic-menu,pre.sc-ic-menu,a.sc-ic-menu,abbr.sc-ic-menu,acronym.sc-ic-menu,address.sc-ic-menu,big.sc-ic-menu,cite.sc-ic-menu,code.sc-ic-menu,del.sc-ic-menu,dfn.sc-ic-menu,em.sc-ic-menu,img.sc-ic-menu,ins.sc-ic-menu,kbd.sc-ic-menu,q.sc-ic-menu,s.sc-ic-menu,samp.sc-ic-menu,small.sc-ic-menu,strike.sc-ic-menu,strong.sc-ic-menu,sub.sc-ic-menu,sup.sc-ic-menu,tt.sc-ic-menu,var.sc-ic-menu,b.sc-ic-menu,u.sc-ic-menu,i.sc-ic-menu,center.sc-ic-menu,dl.sc-ic-menu,dt.sc-ic-menu,dd.sc-ic-menu,ol.sc-ic-menu,ul.sc-ic-menu,li.sc-ic-menu,fieldset.sc-ic-menu,form.sc-ic-menu,label.sc-ic-menu,legend.sc-ic-menu,table.sc-ic-menu,caption.sc-ic-menu,tbody.sc-ic-menu,tfoot.sc-ic-menu,thead.sc-ic-menu,tr.sc-ic-menu,th.sc-ic-menu,td.sc-ic-menu,article.sc-ic-menu,aside.sc-ic-menu,canvas.sc-ic-menu,details.sc-ic-menu,embed.sc-ic-menu,figure.sc-ic-menu,figcaption.sc-ic-menu,footer.sc-ic-menu,header.sc-ic-menu,hgroup.sc-ic-menu,menu.sc-ic-menu,nav.sc-ic-menu,output.sc-ic-menu,ruby.sc-ic-menu,section.sc-ic-menu,summary.sc-ic-menu,time.sc-ic-menu,mark.sc-ic-menu,audio.sc-ic-menu,video.sc-ic-menu{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){.ic-menu-open.sc-ic-menu-h .menu.sc-ic-menu{transition:max-height var(--ic-transition-duration-slow)}}.sc-ic-menu-h{max-height:0;width:var(--menu-width, var(--input-width, 20rem));color:var(--menu-item-text-color, var(--ic-menu-list-option-text-color));--ic-typography-color:var(\n --menu-item-text-color,\n var(--ic-menu-list-option-text-color)\n );background-color:var(\n --menu-bg-color,\n var(--ic-menu-list-option-background-color)\n );position:relative;z-index:var(--ic-z-index-menu);box-sizing:border-box;box-shadow:var(--ic-elevation-overlay);border-radius:var(--ic-border-radius)}.ic-menu-open.sc-ic-menu-h:not(.ic-menu-no-focus):focus-within{box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline)}.ic-select-select-all-focused.sc-ic-menu-h{box-shadow:var(--ic-elevation-overlay) !important}#retry-button.sc-ic-menu::part(button){height:var(--ic-space-lg)}.small.sc-ic-menu #retry-button.sc-ic-menu::part(button){height:var(--ic-space-md)}.on-dialog.sc-ic-menu-h{inset:auto !important}.menu.sc-ic-menu{text-decoration:none;list-style-type:none;border-radius:1px;background-color:var(\n --menu-bg-color,\n var(--ic-menu-list-option-background-color)\n );visibility:hidden;max-height:0;overflow-y:hidden}.menu.sc-ic-menu:has(+.option-bar).sc-ic-menu{border-radius:0 0 1px 1px}.menu-scroll.sc-ic-menu{overflow-y:auto}.menu.sc-ic-menu:focus-visible{outline:none}.ic-menu-open.sc-ic-menu-h{max-height:none;display:flex;flex-direction:column-reverse;border:var(--ic-border-width) solid\n var(--menu-border-color, var(--ic-menu-border-color));transition:box-shadow var(--ic-easing-transition-fast)}.ic-menu-open.sc-ic-menu-h .menu.sc-ic-menu{visibility:visible;max-height:calc(var(--ic-space-xl) * 10 + var(--ic-space-xxxs))}.ic-menu-open.sc-ic-menu-h .option-bar.sc-ic-menu{visibility:visible}.ic-menu-open.sc-ic-menu-h .select-all-button.sc-ic-menu{display:block}.ic-menu-full-width.sc-ic-menu-h{width:100%}.option.sc-ic-menu{padding:var(--ic-space-xs) calc(var(--ic-space-xs) - var(--ic-space-1px));cursor:pointer;display:flex;align-items:center}.loading-option.sc-ic-menu p.sc-ic-menu{margin-bottom:0 !important}.option.sc-ic-menu:not(.loading-option){justify-content:space-between}.ic-menu-small.sc-ic-menu-h .option.sc-ic-menu{padding:var(--ic-space-xxs) calc(var(--ic-space-xs) - var(--ic-space-1px))}.ic-menu-large.sc-ic-menu-h .option.sc-ic-menu{padding:var(--ic-space-sm) calc(var(--ic-space-xs) - var(--ic-space-1px))}.option.sc-ic-menu:last-child{border-radius:0 0 1px 1px}.sc-ic-menu:not(.menu:has(+.option-bar)).sc-ic-menu .option.sc-ic-menu:first-child{border-radius:1px 1px 0 0}.option.sc-ic-menu:not(.disabled-option):hover{background-color:var(--ic-menu-list-option-hover-background-color)}.option.sc-ic-menu:not(.disabled-option):active{background-color:var(--ic-menu-list-option-pressed-background-color)}.option.sc-ic-menu:focus-visible{outline:var(--ic-hc-focus-outline)}.option.sc-ic-menu:not(.disabled-option) .option-description.sc-ic-menu{--ic-typography-color:var(\n --menu-item-desc-text-color,\n var(--ic-menu-list-option-description-text-color)\n )}.option.sc-ic-menu .option-label.sc-ic-menu{display:flex;flex-direction:row;align-items:top}.option.sc-ic-menu .option-label.sc-ic-menu ic-typography.sc-ic-menu{max-width:100%;word-wrap:break-word}.option.sc-ic-menu .option-element.sc-ic-menu{margin-top:var(--ic-space-xxs)}.option.sc-ic-menu .option-icon.sc-ic-menu{height:var(--ic-space-md);width:var(--ic-space-md);margin-top:var(--ic-space-xxs);margin-right:var(--ic-space-xxxs)}.option-text-container.sc-ic-menu{pointer-events:none;width:100%}.option-text-container.show-check-icon.sc-ic-menu{width:calc(var(--ic-space-lg) * 10 + var(--ic-space-xl))}.option.loading-option.sc-ic-menu .option-text-container.sc-ic-menu{margin-left:calc(var(--ic-space-xs) + var(--ic-space-xxxs));color:var(--ic-menu-loading-list-option-text-color);--ic-typography-color:var(--ic-menu-loading-list-option-text-color)}.error-icon-svg.sc-ic-menu{height:var(--ic-space-md);width:var(--ic-space-md);fill:var(--ic-atoms-status-icon-error);align-self:center;display:flex;margin-right:calc(var(--ic-space-xxs) * 1.2)}.loading-error-info.sc-ic-menu{display:flex}.check-icon.sc-ic-menu{height:var(--ic-space-lg);min-width:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:var(--ic-space-xs);pointer-events:none}.focused-option.sc-ic-menu .check-icon.sc-ic-menu *.sc-ic-menu{fill:currentcolor}.option-group-title.sc-ic-menu{padding:var(--ic-space-lg) calc(var(--ic-space-xs) - var(--ic-space-1px))\n var(--ic-space-xs);--ic-typography-color:var(--ic-menu-option-group-label-text-color)}.ic-menu-small.sc-ic-menu-h .option-group-title.sc-ic-menu{padding:var(--ic-space-sm) calc(var(--ic-space-xs) - var(--ic-space-1px))\n var(--ic-space-xxs)}.last-recommended-option.sc-ic-menu{border-bottom:var(--ic-menu-last-recommended-option-border)}.disabled-option.sc-ic-menu{color:var(--ic-atoms-list-option-text-disabled-light);--ic-typography-color:var(--ic-atoms-list-option-text-disabled-light);cursor:default;pointer-events:none}.focused-option.sc-ic-menu,.focused-option.sc-ic-menu .option-description.sc-ic-menu{background-color:var(--ic-color-focus-inner) !important;color:var(--ic-atoms-list-option-text-focused-light) !important;--ic-typography-color:var(\n --ic-atoms-list-option-text-focused-light\n ) !important}.no-results.sc-ic-menu-h li.sc-ic-menu{cursor:no-drop}.no-results.sc-ic-menu-h li.sc-ic-menu:hover{background-color:transparent}.option-bar.sc-ic-menu{padding:var(--ic-space-xxs) var(--ic-space-xs);display:flex;align-items:center;justify-content:space-between;background-color:var(--ic-menu-option-bar-background-color);visibility:hidden;border-bottom:var(--ic-border-width) solid\n var(--ic-menu-option-bar-divider-color);border-radius:1px 1px 0 0}.option-bar.sc-ic-menu p.sc-ic-menu{margin-bottom:0 !important}.ic-menu-large.sc-ic-menu-h .option-bar.sc-ic-menu{padding:var(--ic-space-xs)}.select-all-button.sc-ic-menu{display:none}.select-all-button.sc-ic-menu:focus{z-index:calc(var(--ic-z-index-menu) + 1)}@media (forced-colors: active){.focused-option.sc-ic-menu:focus{outline:none;border:0.125rem solid transparent}.disabled-option.sc-ic-menu{color:GrayText;--ic-typography-color:GrayText}}";
|
71
|
+
|
72
|
+
const Menu = class {
|
73
|
+
constructor(hostRef) {
|
74
|
+
index.registerInstance(this, hostRef);
|
75
|
+
this.icClear = index.createEvent(this, "icClear", 7);
|
76
|
+
this.menuKeyPress = index.createEvent(this, "menuKeyPress", 7);
|
77
|
+
this.menuOptionId = index.createEvent(this, "menuOptionId", 7);
|
78
|
+
this.menuOptionSelect = index.createEvent(this, "menuOptionSelect", 7);
|
79
|
+
this.menuOptionSelectAll = index.createEvent(this, "menuOptionSelectAll", 7);
|
80
|
+
this.menuStateChange = index.createEvent(this, "menuStateChange", 7);
|
81
|
+
this.retryButtonClicked = index.createEvent(this, "retryButtonClicked", 7);
|
82
|
+
this.timeoutBlur = index.createEvent(this, "timeoutBlur", 7);
|
83
|
+
this.ungroupedOptionsSet = index.createEvent(this, "ungroupedOptionsSet", 7);
|
84
|
+
this.ACTIVE_DESCENDANT = "aria-activedescendant";
|
85
|
+
this.CLEAR_BUTTON_ID = "clear-button";
|
86
|
+
this.SEARCH_BAR_TAG = "IC-SEARCH-BAR";
|
87
|
+
this.disabledOptionSelected = false;
|
88
|
+
this.hasPreviouslyBlurred = false;
|
89
|
+
this.hasTimedOut = false;
|
90
|
+
this.isLoading = false;
|
91
|
+
this.isMultiSelect = false;
|
92
|
+
this.isSearchBar = false;
|
93
|
+
this.isSearchableSelect = false;
|
94
|
+
this.lastOptionSelected = null; // Index of last option selected
|
95
|
+
this.lastOptionFocused = null; // Index of last option focused
|
96
|
+
this.multiOptionClicked = null;
|
97
|
+
this.preventClickOpen = false; // Prevents menu re-opening immediately after it is closed on blur when clicking input.
|
98
|
+
this.preventMenuFocus = false; // (When multiple) ensures focus moves straight to select all button from menu.
|
99
|
+
this.shiftPressed = false;
|
100
|
+
this.ungroupedOptions = [];
|
101
|
+
this.handleClearListener = () => {
|
102
|
+
this.optionHighlighted = "";
|
103
|
+
};
|
104
|
+
this.handleSubmitSearch = () => {
|
105
|
+
const highlightedOptionIndex = this.options.findIndex((option) => option[this.valueField] === this.optionHighlighted);
|
106
|
+
this.setInputValue(highlightedOptionIndex);
|
107
|
+
};
|
108
|
+
this.handleMenuChange = (open, focusInput) => {
|
109
|
+
this.menuStateChange.emit({ open, focusInput });
|
110
|
+
if (!open) {
|
111
|
+
if (focusInput !== false) {
|
112
|
+
this.inputEl.focus();
|
113
|
+
this.preventClickOpen = false;
|
114
|
+
}
|
115
|
+
// Reset optionHighlighted so previously highlighted option doesn't get reselected when Enter pressed
|
116
|
+
if (this.isMultiSelect) {
|
117
|
+
this.optionHighlighted = undefined;
|
118
|
+
this.multiOptionClicked = null;
|
119
|
+
}
|
120
|
+
}
|
121
|
+
};
|
122
|
+
this.setNextOptionValue = (selectedOptionIndex) => {
|
123
|
+
if (this.ungroupedOptions[selectedOptionIndex + 1]) {
|
124
|
+
this.menuOptionSelect.emit({
|
125
|
+
value: this.ungroupedOptions[selectedOptionIndex + 1][this.valueField],
|
126
|
+
optionId: this.getOptionId(this.ungroupedOptions[selectedOptionIndex + 1][this.valueField]),
|
127
|
+
});
|
128
|
+
}
|
129
|
+
else {
|
130
|
+
this.menuOptionSelect.emit({
|
131
|
+
value: this.ungroupedOptions[0][this.valueField],
|
132
|
+
optionId: this.getOptionId(this.ungroupedOptions[0][this.valueField]),
|
133
|
+
});
|
134
|
+
}
|
135
|
+
};
|
136
|
+
this.setPreviousOptionValue = (selectedOptionIndex) => {
|
137
|
+
if (this.ungroupedOptions[selectedOptionIndex - 1]) {
|
138
|
+
this.menuOptionSelect.emit({
|
139
|
+
value: this.ungroupedOptions[selectedOptionIndex - 1][this.valueField],
|
140
|
+
optionId: this.getOptionId(this.ungroupedOptions[selectedOptionIndex - 1][this.valueField]),
|
141
|
+
});
|
142
|
+
}
|
143
|
+
else {
|
144
|
+
this.menuOptionSelect.emit({
|
145
|
+
value: this.ungroupedOptions[this.ungroupedOptions.length - 1][this.valueField],
|
146
|
+
optionId: this.getOptionId(this.ungroupedOptions[this.ungroupedOptions.length - 1][this.valueField]),
|
147
|
+
});
|
148
|
+
}
|
149
|
+
};
|
150
|
+
this.getParentEl = (parent) => {
|
151
|
+
if (parent.tagName === this.SEARCH_BAR_TAG) {
|
152
|
+
this.isSearchBar = true;
|
153
|
+
}
|
154
|
+
else if (parent.tagName === "IC-SELECT") {
|
155
|
+
if (parent.getAttribute("searchable") !== null &&
|
156
|
+
parent.getAttribute("searchable") !== undefined) {
|
157
|
+
this.isSearchableSelect = true;
|
158
|
+
}
|
159
|
+
else if (parent.getAttribute("multiple") !== null &&
|
160
|
+
parent.getAttribute("multiple") !== undefined) {
|
161
|
+
this.isMultiSelect = true;
|
162
|
+
}
|
163
|
+
}
|
164
|
+
};
|
165
|
+
// Open menu when up or down arrow keys are pressed
|
166
|
+
this.arrowBehaviour = (event) => {
|
167
|
+
event.preventDefault();
|
168
|
+
this.handleMenuChange(true);
|
169
|
+
};
|
170
|
+
this.getMenuOptions = () => this.isSearchBar ? this.options : this.ungroupedOptions;
|
171
|
+
// Set option that is focused and so should show focus state
|
172
|
+
this.setHighlightedOption = (highlightedIndex) => {
|
173
|
+
const menuOptions = this.getMenuOptions();
|
174
|
+
menuOptions[highlightedIndex] &&
|
175
|
+
!menuOptions[highlightedIndex].timedOut &&
|
176
|
+
(this.optionHighlighted =
|
177
|
+
menuOptions[highlightedIndex][this.valueField] || undefined);
|
178
|
+
};
|
179
|
+
// Determines keyboard behaviour when selection is automatic
|
180
|
+
// (i.e. you don't have to press Enter select an option - just focus on it)
|
181
|
+
// and menu is closed
|
182
|
+
this.autoSetInputValueKeyboardOpen = (event) => {
|
183
|
+
const selectedOptionIndex = this.ungroupedOptions.findIndex((option) => option[this.valueField] === this.value);
|
184
|
+
this.keyboardNav = false;
|
185
|
+
switch (event.key) {
|
186
|
+
case "ArrowDown":
|
187
|
+
this.keyboardNav = true;
|
188
|
+
this.arrowBehaviour(event);
|
189
|
+
this.setNextOptionValue(selectedOptionIndex);
|
190
|
+
break;
|
191
|
+
case "ArrowUp":
|
192
|
+
this.keyboardNav = true;
|
193
|
+
this.arrowBehaviour(event);
|
194
|
+
this.setPreviousOptionValue(selectedOptionIndex);
|
195
|
+
break;
|
196
|
+
case " ":
|
197
|
+
case "Enter":
|
198
|
+
if (event.target.id !== this.CLEAR_BUTTON_ID) {
|
199
|
+
this.handleMenuChange(true);
|
200
|
+
}
|
201
|
+
break;
|
202
|
+
}
|
203
|
+
};
|
204
|
+
this.selectHighlightedOption = (options, highlightedOptionIndex) => {
|
205
|
+
if (!this.isLoading && !this.hasTimedOut) {
|
206
|
+
this.keyboardNav = true;
|
207
|
+
}
|
208
|
+
const isOpen = this.isSearchBar || this.isSearchableSelect || this.open;
|
209
|
+
if (isOpen) {
|
210
|
+
if (highlightedOptionIndex >= 0) {
|
211
|
+
if (options[highlightedOptionIndex] !== undefined) {
|
212
|
+
if (this.isSearchBar &&
|
213
|
+
options[highlightedOptionIndex].disabled === true) {
|
214
|
+
this.disabledOptionSelected = true;
|
215
|
+
}
|
216
|
+
else {
|
217
|
+
this.setInputValue(highlightedOptionIndex);
|
218
|
+
}
|
219
|
+
}
|
220
|
+
}
|
221
|
+
else {
|
222
|
+
this.setInputValue(highlightedOptionIndex);
|
223
|
+
}
|
224
|
+
}
|
225
|
+
else {
|
226
|
+
this.handleMenuChange(true);
|
227
|
+
}
|
228
|
+
};
|
229
|
+
// Check if option is selected based on the index of the option
|
230
|
+
this.isOptionSelected = (index) => {
|
231
|
+
const menuOptions = this.getMenuOptions();
|
232
|
+
return this.value
|
233
|
+
? this.value.includes(menuOptions[index][this.valueField])
|
234
|
+
: false;
|
235
|
+
};
|
236
|
+
// Deselect currently selected options when shift pressed, but keep certain options selected
|
237
|
+
this.deselectSelectedOptions = (optionsToKeepSelected) => {
|
238
|
+
const menuOptions = this.getMenuOptions();
|
239
|
+
if (this.value) {
|
240
|
+
const selectedOptionIndexes = this.value.map((value) => {
|
241
|
+
return menuOptions.findIndex((option) => option[this.valueField] === value);
|
242
|
+
});
|
243
|
+
// Call setInputValue (which toggles the selected state) on options that need to be deselected
|
244
|
+
selectedOptionIndexes.forEach((index) => !optionsToKeepSelected.includes(index) && this.setInputValue(index));
|
245
|
+
}
|
246
|
+
};
|
247
|
+
// Determines keyboard behaviour when selection is manual (i.e. when you have to press Enter to select an option)
|
248
|
+
this.manualSetInputValueKeyboardOpen = (event) => {
|
249
|
+
const menuOptions = this.getMenuOptions();
|
250
|
+
// For preventing focus disappearing on currently focused option when Shift / Cmd / Ctrl pressed
|
251
|
+
// (i.e. when user is likely in the middle of executing a keyboard combination to select options)
|
252
|
+
const isKeyboardCombination = event.shiftKey || event.metaKey || event.ctrlKey;
|
253
|
+
const highlightedOptionIndex = this.getOptionHighlightedIndex();
|
254
|
+
const clickedMultiOptionIndex = menuOptions.findIndex((option) => option[this.valueField] === this.multiOptionClicked);
|
255
|
+
const getOptionId = (index) => { var _a; return (_a = Array.from(this.host.querySelectorAll("li"))[index]) === null || _a === void 0 ? void 0 : _a.id; };
|
256
|
+
// Space press should be equivalent to Enter when multi-select
|
257
|
+
if (event.key === " " && this.isMultiSelect) {
|
258
|
+
this.handleOptionSelect(event, highlightedOptionIndex);
|
259
|
+
}
|
260
|
+
else {
|
261
|
+
switch (event.key) {
|
262
|
+
case "ArrowDown":
|
263
|
+
this.keyboardNav = true;
|
264
|
+
this.arrowBehaviour(event);
|
265
|
+
if (this.multiOptionClicked) {
|
266
|
+
// Set focus to option last clicked
|
267
|
+
// Prevents it resetting to the top of the menu when user switches to using keyboard
|
268
|
+
this.setHighlightedOption(clickedMultiOptionIndex);
|
269
|
+
this.multiOptionClicked = null;
|
270
|
+
}
|
271
|
+
else {
|
272
|
+
this.handleSingleShiftSelect(event, highlightedOptionIndex, menuOptions);
|
273
|
+
if (highlightedOptionIndex < menuOptions.length - 1) {
|
274
|
+
this.setHighlightedOption(highlightedOptionIndex + 1);
|
275
|
+
this.menuOptionId.emit({
|
276
|
+
optionId: getOptionId(highlightedOptionIndex + 1),
|
277
|
+
});
|
278
|
+
this.handleSingleShiftSelect(event, highlightedOptionIndex + 1, menuOptions);
|
279
|
+
}
|
280
|
+
else {
|
281
|
+
this.setHighlightedOption(0);
|
282
|
+
this.menuOptionId.emit({
|
283
|
+
optionId: getOptionId(0),
|
284
|
+
});
|
285
|
+
this.handleSingleShiftSelect(event, 0, menuOptions);
|
286
|
+
}
|
287
|
+
// Deselect currently selected options if arrow was pressed for first time after shift is held
|
288
|
+
if (this.isMultiSelect && this.shiftPressed) {
|
289
|
+
this.deselectSelectedOptions([
|
290
|
+
highlightedOptionIndex,
|
291
|
+
this.getOptionHighlightedIndex(),
|
292
|
+
]);
|
293
|
+
this.shiftPressed = false;
|
294
|
+
}
|
295
|
+
}
|
296
|
+
this.lastOptionFocused = this.getOptionHighlightedIndex();
|
297
|
+
this.preventIncorrectTabOrder = false;
|
298
|
+
this.focusFromSearchKeypress = false;
|
299
|
+
break;
|
300
|
+
case "ArrowUp":
|
301
|
+
this.keyboardNav = true;
|
302
|
+
this.arrowBehaviour(event);
|
303
|
+
if (this.multiOptionClicked) {
|
304
|
+
// Set focus to option last clicked
|
305
|
+
// Prevents it resetting to the bottom of the menu when user switches to using keyboard
|
306
|
+
this.setHighlightedOption(clickedMultiOptionIndex);
|
307
|
+
this.multiOptionClicked = null;
|
308
|
+
}
|
309
|
+
else {
|
310
|
+
this.handleSingleShiftSelect(event, highlightedOptionIndex, menuOptions);
|
311
|
+
if (highlightedOptionIndex <= 0 ||
|
312
|
+
highlightedOptionIndex > menuOptions.length + 1) {
|
313
|
+
this.setHighlightedOption(menuOptions.length - 1);
|
314
|
+
this.menuOptionId.emit({
|
315
|
+
optionId: getOptionId(menuOptions.length - 1),
|
316
|
+
});
|
317
|
+
this.handleSingleShiftSelect(event, menuOptions.length - 1, menuOptions);
|
318
|
+
}
|
319
|
+
else {
|
320
|
+
this.setHighlightedOption(highlightedOptionIndex - 1);
|
321
|
+
this.menuOptionId.emit({
|
322
|
+
optionId: getOptionId(highlightedOptionIndex - 1),
|
323
|
+
});
|
324
|
+
this.handleSingleShiftSelect(event, highlightedOptionIndex - 1, menuOptions);
|
325
|
+
}
|
326
|
+
// Deselect currently selected options if arrow was pressed for first time after shift is held
|
327
|
+
if (this.isMultiSelect && this.shiftPressed) {
|
328
|
+
this.deselectSelectedOptions([
|
329
|
+
highlightedOptionIndex,
|
330
|
+
this.getOptionHighlightedIndex(),
|
331
|
+
]);
|
332
|
+
this.shiftPressed = false;
|
333
|
+
}
|
334
|
+
}
|
335
|
+
this.lastOptionFocused = this.getOptionHighlightedIndex();
|
336
|
+
this.preventIncorrectTabOrder = false;
|
337
|
+
this.focusFromSearchKeypress = false;
|
338
|
+
break;
|
339
|
+
case "Home": {
|
340
|
+
const startOptionIndex = 0;
|
341
|
+
this.keyboardNav = true;
|
342
|
+
event.preventDefault();
|
343
|
+
this.arrowBehaviour(event);
|
344
|
+
this.setHighlightedOption(startOptionIndex);
|
345
|
+
this.menuOptionId.emit({
|
346
|
+
optionId: getOptionId(startOptionIndex),
|
347
|
+
});
|
348
|
+
if (event.shiftKey && event.ctrlKey) {
|
349
|
+
this.handleMultipleShiftSelect(startOptionIndex);
|
350
|
+
}
|
351
|
+
this.lastOptionFocused = startOptionIndex;
|
352
|
+
this.lastOptionSelected = startOptionIndex;
|
353
|
+
break;
|
354
|
+
}
|
355
|
+
case "End": {
|
356
|
+
const endOptionIndex = menuOptions.length - 1;
|
357
|
+
this.keyboardNav = true;
|
358
|
+
event.preventDefault();
|
359
|
+
this.arrowBehaviour(event);
|
360
|
+
this.setHighlightedOption(endOptionIndex);
|
361
|
+
this.menuOptionId.emit({
|
362
|
+
optionId: getOptionId(endOptionIndex),
|
363
|
+
});
|
364
|
+
if (event.shiftKey && event.ctrlKey) {
|
365
|
+
this.handleMultipleShiftSelect(endOptionIndex);
|
366
|
+
}
|
367
|
+
this.lastOptionFocused = endOptionIndex;
|
368
|
+
this.lastOptionSelected = endOptionIndex;
|
369
|
+
break;
|
370
|
+
}
|
371
|
+
case " ":
|
372
|
+
if (!isKeyboardCombination) {
|
373
|
+
this.keyboardNav = false;
|
374
|
+
}
|
375
|
+
if (this.isSearchBar || this.isSearchableSelect) {
|
376
|
+
break;
|
377
|
+
}
|
378
|
+
else {
|
379
|
+
if (event.target.id !== this.CLEAR_BUTTON_ID) {
|
380
|
+
this.handleMenuChange(true);
|
381
|
+
}
|
382
|
+
}
|
383
|
+
break;
|
384
|
+
case "Enter":
|
385
|
+
event.preventDefault();
|
386
|
+
if (!isKeyboardCombination) {
|
387
|
+
this.keyboardNav = false;
|
388
|
+
}
|
389
|
+
this.handleOptionSelect(event, highlightedOptionIndex);
|
390
|
+
break;
|
391
|
+
case "Escape":
|
392
|
+
if (this.open) {
|
393
|
+
event.stopImmediatePropagation();
|
394
|
+
}
|
395
|
+
this.handleMenuChange(false);
|
396
|
+
this.menuOptionId.emit({ optionId: undefined });
|
397
|
+
break;
|
398
|
+
case "a":
|
399
|
+
// Checks if Cmd (meta) key is pressed if Mac device (while excluding meta key on Windows)
|
400
|
+
// Otherwise, if a different OS, checks Ctrl key
|
401
|
+
if ((helpers.isMacDevice() && event.metaKey) ||
|
402
|
+
(!helpers.isMacDevice() && event.ctrlKey)) {
|
403
|
+
this.emitSelectAllEvents();
|
404
|
+
this.lastOptionFocused = null;
|
405
|
+
this.lastOptionSelected = null;
|
406
|
+
}
|
407
|
+
break;
|
408
|
+
case "Shift":
|
409
|
+
case "Tab":
|
410
|
+
if (event.key === "Shift") {
|
411
|
+
this.shiftPressed = true;
|
412
|
+
}
|
413
|
+
if (this.isSearchBar) {
|
414
|
+
this.keyboardNav = true;
|
415
|
+
}
|
416
|
+
if (this.isMultiSelect) {
|
417
|
+
if (this.open && !event.shiftKey && this.selectAllButton) {
|
418
|
+
event.preventDefault();
|
419
|
+
this.selectAllButton.focus(); // Move focus to select all button instead of focused option
|
420
|
+
this.preventMenuFocus = true;
|
421
|
+
this.preventClickOpen = true;
|
422
|
+
this.optionHighlighted = undefined; // Stop any option focus states showing when focus moved to select all button
|
423
|
+
}
|
424
|
+
}
|
425
|
+
else {
|
426
|
+
this.preventIncorrectTabOrder = true;
|
427
|
+
}
|
428
|
+
break;
|
429
|
+
default:
|
430
|
+
if (!isKeyboardCombination) {
|
431
|
+
this.keyboardNav = false;
|
432
|
+
}
|
433
|
+
this.focusOnSearchOrSelectInput(menuOptions, highlightedOptionIndex);
|
434
|
+
}
|
435
|
+
}
|
436
|
+
};
|
437
|
+
this.setInputValue = (highlightedOptionIndex) => {
|
438
|
+
const menuOptions = this.getMenuOptions();
|
439
|
+
if (menuOptions[highlightedOptionIndex] !== undefined) {
|
440
|
+
this.menuOptionSelect.emit({
|
441
|
+
value: menuOptions[highlightedOptionIndex][this.valueField],
|
442
|
+
});
|
443
|
+
if (this.closeOnSelect) {
|
444
|
+
this.optionHighlighted = undefined;
|
445
|
+
this.menuOptionId.emit({ optionId: undefined });
|
446
|
+
}
|
447
|
+
}
|
448
|
+
if (this.closeOnSelect) {
|
449
|
+
if (!this.hasTimedOut) {
|
450
|
+
this.handleMenuChange(false);
|
451
|
+
}
|
452
|
+
else {
|
453
|
+
this.parentEl.setFocus();
|
454
|
+
}
|
455
|
+
}
|
456
|
+
};
|
457
|
+
this.handleOptionClick = (event) => {
|
458
|
+
const { value, label } = event.target.dataset;
|
459
|
+
if (this.isMultiSelect) {
|
460
|
+
const menuOptions = this.getMenuOptions();
|
461
|
+
const selectedOptionIndex = menuOptions.findIndex((option) => option.value === value);
|
462
|
+
this.handleOptionSelect(event, selectedOptionIndex, true);
|
463
|
+
this.multiOptionClicked = value;
|
464
|
+
}
|
465
|
+
else {
|
466
|
+
this.menuOptionSelect.emit({ value, label });
|
467
|
+
this.handleMenuChange(false);
|
468
|
+
}
|
469
|
+
this.optionHighlighted = undefined;
|
470
|
+
};
|
471
|
+
this.handleRetry = () => {
|
472
|
+
this.retryButtonClicked.emit({ value: this.value });
|
473
|
+
};
|
474
|
+
this.handleRetryKeyDown = (ev) => {
|
475
|
+
if (ev.key === "Enter" || ev.key === " ") {
|
476
|
+
ev.preventDefault();
|
477
|
+
this.retryButtonClicked.emit({ value: this.value, keyPressed: ev.key });
|
478
|
+
}
|
479
|
+
};
|
480
|
+
this.handleBlur = (event) => {
|
481
|
+
if (event.relatedTarget !== this.inputEl) {
|
482
|
+
if (event.relatedTarget === this.selectAllButton) {
|
483
|
+
this.menu.removeAttribute(this.ACTIVE_DESCENDANT);
|
484
|
+
}
|
485
|
+
if (!(this.menu.contains(event.relatedTarget) ||
|
486
|
+
event.relatedTarget === this.selectAllButton)) {
|
487
|
+
this.handleMenuChange(false, this.hasPreviouslyBlurred);
|
488
|
+
this.menu.removeAttribute(this.ACTIVE_DESCENDANT);
|
489
|
+
this.lastOptionFocused = null;
|
490
|
+
this.lastOptionSelected = null;
|
491
|
+
}
|
492
|
+
}
|
493
|
+
else {
|
494
|
+
this.handleMenuChange(false);
|
495
|
+
this.preventClickOpen = true;
|
496
|
+
this.menu.removeAttribute(this.ACTIVE_DESCENDANT);
|
497
|
+
this.lastOptionFocused = null;
|
498
|
+
this.lastOptionSelected = null;
|
499
|
+
}
|
500
|
+
if (!this.isSearchBar)
|
501
|
+
this.hasPreviouslyBlurred = !!event.relatedTarget;
|
502
|
+
};
|
503
|
+
this.handleMouseDown = (event) => {
|
504
|
+
event.preventDefault();
|
505
|
+
};
|
506
|
+
this.handleMenuKeyDown = (event) => {
|
507
|
+
if (this.activationType === "automatic") {
|
508
|
+
this.autoSetValueOnMenuKeyDown(event);
|
509
|
+
}
|
510
|
+
else if (this.activationType === "manual" && !this.isSearchBar) {
|
511
|
+
this.manualSetInputValueKeyboardOpen(event);
|
512
|
+
}
|
513
|
+
};
|
514
|
+
this.handleMenuKeyUp = (event) => {
|
515
|
+
if (event.key === "Tab" && event.shiftKey) {
|
516
|
+
this.preventClickOpen = false;
|
517
|
+
}
|
518
|
+
if (event.key === "Enter" && this.disabledOptionSelected) {
|
519
|
+
this.disabledOptionSelected = false;
|
520
|
+
event.stopImmediatePropagation();
|
521
|
+
}
|
522
|
+
if (event.key === "Shift") {
|
523
|
+
this.shiftPressed = false;
|
524
|
+
}
|
525
|
+
};
|
526
|
+
this.handleSelectAllClick = () => {
|
527
|
+
this.keyboardNav = false;
|
528
|
+
this.menu.focus();
|
529
|
+
this.emitSelectAllEvents();
|
530
|
+
this.lastOptionFocused = null;
|
531
|
+
this.lastOptionSelected = null;
|
532
|
+
};
|
533
|
+
this.handleSelectAllBlur = (event) => {
|
534
|
+
this.host.classList.remove("ic-select-select-all-focused");
|
535
|
+
if (!this.menu.contains(event.relatedTarget)) {
|
536
|
+
this.handleMenuChange(false, false);
|
537
|
+
}
|
538
|
+
};
|
539
|
+
this.handleSelectAllFocus = () => {
|
540
|
+
this.host.classList.add("ic-select-select-all-focused");
|
541
|
+
this.lastOptionFocused = null;
|
542
|
+
this.lastOptionSelected = null;
|
543
|
+
};
|
544
|
+
// Fix for Safari - select all button click was causing menu to close
|
545
|
+
this.handleSelectAllMouseDown = (event) => {
|
546
|
+
event.preventDefault();
|
547
|
+
};
|
548
|
+
// When shift key is being used to select contiguous options one by one on a multi-select
|
549
|
+
// I.e. holding shift and pressing up and down arrow keys
|
550
|
+
this.handleSingleShiftSelect = (event, optionToSelectIndex, options) => {
|
551
|
+
if (this.isMultiSelect &&
|
552
|
+
event.shiftKey &&
|
553
|
+
!this.isOptionSelected(optionToSelectIndex)) {
|
554
|
+
this.selectHighlightedOption(options, optionToSelectIndex);
|
555
|
+
this.lastOptionSelected = optionToSelectIndex;
|
556
|
+
}
|
557
|
+
};
|
558
|
+
// When shift key is being used to select multiple options at once on a multi-select
|
559
|
+
// I.e. holding shift when selecting another option
|
560
|
+
this.handleMultipleShiftSelect = (lastOptionInSelection, useFocusForSelection = false, firstOptionSelected = null) => {
|
561
|
+
this.shiftPressed = false;
|
562
|
+
const firstOptionInSelection = firstOptionSelected === null
|
563
|
+
? this.getFirstOptionInSelection(useFocusForSelection)
|
564
|
+
: firstOptionSelected;
|
565
|
+
if (firstOptionInSelection !== null) {
|
566
|
+
const optionsToSelect = [];
|
567
|
+
if (firstOptionInSelection < lastOptionInSelection) {
|
568
|
+
for (let i = firstOptionInSelection; i < lastOptionInSelection + 1; i++) {
|
569
|
+
optionsToSelect.push(i);
|
570
|
+
}
|
571
|
+
}
|
572
|
+
else {
|
573
|
+
for (let i = firstOptionInSelection; i > lastOptionInSelection - 1; i--) {
|
574
|
+
optionsToSelect.push(i);
|
575
|
+
}
|
576
|
+
}
|
577
|
+
optionsToSelect.forEach((optionIndex) => !this.isOptionSelected(optionIndex) && this.setInputValue(optionIndex));
|
578
|
+
this.deselectSelectedOptions(optionsToSelect);
|
579
|
+
}
|
580
|
+
};
|
581
|
+
this.handleOptionSelect = (event, optionIndex, useFocusForSelection = false) => {
|
582
|
+
const menuOptions = this.getMenuOptions();
|
583
|
+
const firstOptionInSelection = this.getFirstOptionInSelection(useFocusForSelection);
|
584
|
+
if (event.shiftKey && firstOptionInSelection !== null) {
|
585
|
+
this.handleMultipleShiftSelect(optionIndex, useFocusForSelection, firstOptionInSelection);
|
586
|
+
}
|
587
|
+
else {
|
588
|
+
this.selectHighlightedOption(menuOptions, optionIndex);
|
589
|
+
}
|
590
|
+
this.lastOptionFocused = optionIndex;
|
591
|
+
this.lastOptionSelected = optionIndex;
|
592
|
+
};
|
593
|
+
this.getFirstOptionInSelection = (useFocusForSelection) => {
|
594
|
+
return useFocusForSelection && this.lastOptionFocused !== null
|
595
|
+
? this.lastOptionFocused
|
596
|
+
: this.lastOptionSelected !== null
|
597
|
+
? this.lastOptionSelected
|
598
|
+
: null;
|
599
|
+
};
|
600
|
+
this.emitSelectAllEvents = () => {
|
601
|
+
var _a, _b;
|
602
|
+
// Select all if there is either no value or not all options are selected
|
603
|
+
// 'true' means select all, 'false' means clear all
|
604
|
+
this.menuOptionSelectAll.emit({
|
605
|
+
select: !this.value || !(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) === this.ungroupedOptions.length),
|
606
|
+
});
|
607
|
+
// Emit clear event if all options are selected
|
608
|
+
if (((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) === this.ungroupedOptions.length) {
|
609
|
+
this.icClear.emit();
|
610
|
+
}
|
611
|
+
};
|
612
|
+
this.emitMenuKeyPress = (isNavKey, key) => {
|
613
|
+
this.menuKeyPress.emit({ isNavKey: isNavKey, key: key });
|
614
|
+
};
|
615
|
+
// Determines keyboard behaviour when selection is automatic
|
616
|
+
// (i.e. you don't have to press Enter select an option - just focus on it)
|
617
|
+
// and menu is focused
|
618
|
+
this.autoSetValueOnMenuKeyDown = (event) => {
|
619
|
+
event.cancelBubble = true;
|
620
|
+
const selectedOptionIndex = this.ungroupedOptions.findIndex((option) => option[this.valueField] === this.value);
|
621
|
+
const isSearchableSelect = this.inputEl.tagName === "INPUT";
|
622
|
+
this.keyboardNav = false;
|
623
|
+
switch (event.key) {
|
624
|
+
case " ":
|
625
|
+
event.preventDefault();
|
626
|
+
break;
|
627
|
+
case "ArrowUp":
|
628
|
+
if (!this.hasTimedOut) {
|
629
|
+
event.preventDefault();
|
630
|
+
this.setPreviousOptionValue(selectedOptionIndex);
|
631
|
+
this.keyboardNav = true;
|
632
|
+
}
|
633
|
+
break;
|
634
|
+
case "ArrowDown":
|
635
|
+
if (!this.hasTimedOut) {
|
636
|
+
event.preventDefault();
|
637
|
+
this.setNextOptionValue(selectedOptionIndex);
|
638
|
+
this.keyboardNav = true;
|
639
|
+
}
|
640
|
+
break;
|
641
|
+
case "Home":
|
642
|
+
this.menuOptionSelect.emit({
|
643
|
+
value: this.ungroupedOptions[0][this.valueField],
|
644
|
+
});
|
645
|
+
this.keyboardNav = true;
|
646
|
+
break;
|
647
|
+
case "End":
|
648
|
+
this.menuOptionSelect.emit({
|
649
|
+
value: this.ungroupedOptions[this.ungroupedOptions.length - 1][this.valueField],
|
650
|
+
});
|
651
|
+
this.keyboardNav = true;
|
652
|
+
break;
|
653
|
+
case "Enter":
|
654
|
+
!this.hasTimedOut && this.handleMenuChange(false);
|
655
|
+
break;
|
656
|
+
case "Escape":
|
657
|
+
this.handleMenuChange(false);
|
658
|
+
break;
|
659
|
+
case "Backspace":
|
660
|
+
if (isSearchableSelect) {
|
661
|
+
this.inputEl.focus();
|
662
|
+
}
|
663
|
+
break;
|
664
|
+
case "Shift":
|
665
|
+
break;
|
666
|
+
default:
|
667
|
+
if (isSearchableSelect && event.key !== "Tab" && !this.hasTimedOut) {
|
668
|
+
this.inputEl.focus();
|
669
|
+
}
|
670
|
+
if (event.key.length === 1) {
|
671
|
+
this.keyboardNav = true;
|
672
|
+
}
|
673
|
+
break;
|
674
|
+
}
|
675
|
+
this.emitMenuKeyPress(this.keyboardNav, event.key);
|
676
|
+
};
|
677
|
+
this.getOptionId = (value) => {
|
678
|
+
return `${this.menuId}-${value}`;
|
679
|
+
};
|
680
|
+
this.getOptionAriaLabel = (option, parentOption) => {
|
681
|
+
let ariaLabel = option[this.labelField];
|
682
|
+
if (option.description) {
|
683
|
+
ariaLabel = `${ariaLabel}, ${option.description}`;
|
684
|
+
}
|
685
|
+
if (option.element) {
|
686
|
+
ariaLabel = `${ariaLabel}, ${option.element.ariaLabel}`;
|
687
|
+
}
|
688
|
+
if (parentOption) {
|
689
|
+
return `${ariaLabel}, ${parentOption[this.labelField]} group`;
|
690
|
+
}
|
691
|
+
else {
|
692
|
+
return ariaLabel;
|
693
|
+
}
|
694
|
+
};
|
695
|
+
this.getSortedOptions = (options) => {
|
696
|
+
let sorted = [];
|
697
|
+
if (options.sort) {
|
698
|
+
sorted = options.sort((optionA, optionB) => optionA.recommended && !optionB.recommended ? -1 : 0);
|
699
|
+
}
|
700
|
+
return sorted;
|
701
|
+
};
|
702
|
+
this.getOptionHighlightedIndex = () => {
|
703
|
+
const menuOptions = this.getMenuOptions();
|
704
|
+
return menuOptions.findIndex((option) => option[this.valueField] === this.optionHighlighted);
|
705
|
+
};
|
706
|
+
this.isManualMode = this.activationType === "manual";
|
707
|
+
this.scrollToSelected = (menu) => {
|
708
|
+
const selectedOption = this.selectOnEnter
|
709
|
+
? this.host.querySelector(`li[data-value="${this.optionHighlighted}"]`)
|
710
|
+
: menu.querySelector(".option[aria-selected='true']");
|
711
|
+
if (selectedOption) {
|
712
|
+
const elTop = selectedOption.offsetTop + selectedOption.offsetHeight;
|
713
|
+
if (elTop > menu.scrollTop + menu.offsetHeight ||
|
714
|
+
elTop < menu.scrollTop + menu.offsetHeight) {
|
715
|
+
menu.scrollTop = selectedOption.offsetTop;
|
716
|
+
}
|
717
|
+
// 'aria-activedescendant' affects screen reader focus
|
718
|
+
// https://www.w3.org/TR/2017/WD-wai-aria-practices-1.1-20170628/#kbd_focus_activedescendant
|
719
|
+
this.menu.setAttribute(this.ACTIVE_DESCENDANT, selectedOption.id);
|
720
|
+
selectedOption.focus();
|
721
|
+
}
|
722
|
+
};
|
723
|
+
// Set 'ungroupedOptions' variable and emit its value
|
724
|
+
// - this is all the options with disabled options and group titles removed
|
725
|
+
this.loadUngroupedOptions = () => {
|
726
|
+
if (this.options.length > 0 && this.options.map) {
|
727
|
+
this.options.map((option) => {
|
728
|
+
if (option.children) {
|
729
|
+
option.children.map((option) => !option.disabled && this.ungroupedOptions.push(option));
|
730
|
+
}
|
731
|
+
else if (!option.disabled) {
|
732
|
+
this.ungroupedOptions.push(option);
|
733
|
+
}
|
734
|
+
});
|
735
|
+
}
|
736
|
+
this.ungroupedOptions = this.getSortedOptions(this.ungroupedOptions);
|
737
|
+
this.ungroupedOptionsSet.emit({ options: this.ungroupedOptions });
|
738
|
+
};
|
739
|
+
this.setMenuScrollbar = () => {
|
740
|
+
let optionsHeight = 0;
|
741
|
+
this.host
|
742
|
+
.querySelectorAll(".option")
|
743
|
+
.forEach((option) => (optionsHeight += option.clientHeight));
|
744
|
+
if (optionsHeight >= 320) {
|
745
|
+
this.menu.classList.add("menu-scroll");
|
746
|
+
}
|
747
|
+
};
|
748
|
+
this.handleTimeoutBlur = (ev) => {
|
749
|
+
this.timeoutBlur.emit({ ev });
|
750
|
+
};
|
751
|
+
this.optionContent = (option, selected) => {
|
752
|
+
const showCheckIcon = !!option[this.valueField] &&
|
753
|
+
!!this.value &&
|
754
|
+
selected &&
|
755
|
+
this.parentEl.tagName !== this.SEARCH_BAR_TAG;
|
756
|
+
return (index.h(index.Fragment, null, option.loading && index.h("ic-loading-indicator", { size: "icon" }), index.h("div", { class: {
|
757
|
+
"option-text-container": true,
|
758
|
+
"show-check-icon": showCheckIcon,
|
759
|
+
} }, index.h("div", { class: "option-label" }, option.icon && (index.h("div", { class: "option-icon", innerHTML: option.icon, "aria-hidden": "true" })), index.h("ic-typography", { variant: "body", "aria-hidden": "true" }, option[this.labelField])), option.description && (index.h("ic-typography", { id: `${this.getOptionId(option[this.valueField])}-description`, class: "option-description", variant: "caption", "aria-hidden": "true" }, index.h("p", null, option.description))), option.element && (index.h("div", { class: "option-element", innerHTML: option.element.component, "aria-hidden": "true" }))), showCheckIcon && index.h("span", { class: "check-icon", innerHTML: checkIcon.Check })));
|
760
|
+
};
|
761
|
+
this.displayOption = (option, selected, index$1, parentOption) => {
|
762
|
+
const { open, keyboardNav, isManualMode, initialOptionsListRender, optionHighlighted, options, } = this;
|
763
|
+
return (index.h("li", { id: this.getOptionId(option[this.valueField]), class: {
|
764
|
+
option: true,
|
765
|
+
"focused-option": isManualMode
|
766
|
+
? (keyboardNav || initialOptionsListRender) &&
|
767
|
+
option[this.valueField] === optionHighlighted
|
768
|
+
: keyboardNav && selected,
|
769
|
+
"last-recommended-option": option.recommended &&
|
770
|
+
options[index$1 + 1] &&
|
771
|
+
!options[index$1 + 1].recommended,
|
772
|
+
"disabled-option": option.disabled,
|
773
|
+
"loading-option": option.loading,
|
774
|
+
timeout: option.timedOut,
|
775
|
+
}, role: "option", tabindex: open &&
|
776
|
+
(selected || option[this.valueField] === optionHighlighted) &&
|
777
|
+
keyboardNav
|
778
|
+
? "0"
|
779
|
+
: "-1", "aria-label": this.getOptionAriaLabel(option, parentOption), "aria-selected": selected ? "true" : "false", "aria-disabled": option.disabled ? "true" : "false", onClick: !option.timedOut && !option.loading && this.handleOptionClick, onBlur: this.handleBlur, onMouseDown: this.handleMouseDown, "data-value": option[this.valueField], "data-label": option[this.labelField] }, option.timedOut ? (index.h(index.Fragment, null, index.h("div", { class: "loading-error-info" }, index.h("svg", { class: "error-icon-svg", "aria-labelledby": "error-title", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "#000000" }, index.h("title", { id: "error-title" }, "Error"), index.h("g", { id: "close-octagon" }, index.h("path", { id: "Vector", d: "M8.77 3L3.5 8.27V15.73L8.77 21H16.23L21.5 15.73V8.27L16.23 3M8.91 7L12.5 10.59L16.09 7L17.5 8.41L13.91 12L17.5 15.59L16.09 17L12.5 13.41L8.91 17L7.5 15.59L11.09 12L7.5 8.41" }))), index.h("ic-typography", { variant: "label" }, option[this.labelField])), index.h("ic-button", { size: "small", variant: "tertiary", onClick: this.handleRetry, onKeyDown: this.handleRetryKeyDown, onBlur: this.handleTimeoutBlur, id: "retry-button" }, "Retry"))) : (this.optionContent(option, selected))));
|
780
|
+
};
|
781
|
+
this.focusFromSearchKeypress = false;
|
782
|
+
this.initialOptionsListRender = false;
|
783
|
+
this.keyboardNav = false;
|
784
|
+
this.optionHighlighted = undefined;
|
785
|
+
this.preventIncorrectTabOrder = false;
|
786
|
+
this.menuOptions = undefined;
|
787
|
+
this.activationType = "automatic";
|
788
|
+
this.anchorEl = undefined;
|
789
|
+
this.autofocusOnSelected = true;
|
790
|
+
this.closeOnSelect = true;
|
791
|
+
this.fullWidth = false;
|
792
|
+
this.inputEl = undefined;
|
793
|
+
this.inputLabel = undefined;
|
794
|
+
this.labelField = "label";
|
795
|
+
this.menuId = undefined;
|
796
|
+
this.open = undefined;
|
797
|
+
this.parentEl = undefined;
|
798
|
+
this.searchMode = "navigation";
|
799
|
+
this.selectOnEnter = false;
|
800
|
+
this.size = "medium";
|
801
|
+
this.options = undefined;
|
802
|
+
this.value = undefined;
|
803
|
+
this.valueField = "value";
|
804
|
+
}
|
805
|
+
watchOpenHandler() {
|
806
|
+
if (!this.open && this.popperInstance) {
|
807
|
+
this.popperInstance.destroy();
|
808
|
+
this.popperInstance = null;
|
809
|
+
}
|
810
|
+
}
|
811
|
+
watchOptionsHandler(newOptions) {
|
812
|
+
this.hasTimedOut = newOptions.some((opt) => opt.timedOut);
|
813
|
+
this.isLoading = newOptions.some((opt) => opt.loading);
|
814
|
+
this.ungroupedOptions = [];
|
815
|
+
this.loadUngroupedOptions();
|
816
|
+
}
|
817
|
+
connectedCallback() {
|
818
|
+
this.getParentEl(this.parentEl);
|
819
|
+
if (this.isSearchBar) {
|
820
|
+
if (this.searchMode === "navigation")
|
821
|
+
this.setHighlightedOption(0);
|
822
|
+
this.initialOptionsListRender = true;
|
823
|
+
}
|
824
|
+
}
|
825
|
+
disconnectedCallback() {
|
826
|
+
var _a, _b;
|
827
|
+
if (this.popperInstance) {
|
828
|
+
this.popperInstance.destroy();
|
829
|
+
}
|
830
|
+
(_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.removeEventListener("icClear", this.handleClearListener);
|
831
|
+
(_b = this.parentEl) === null || _b === void 0 ? void 0 : _b.removeEventListener("icSubmitSearch", this.handleSubmitSearch);
|
832
|
+
}
|
833
|
+
componentWillLoad() {
|
834
|
+
var _a, _b;
|
835
|
+
this.loadUngroupedOptions();
|
836
|
+
this.parentEl.addEventListener("icClear", this.handleClearListener);
|
837
|
+
this.parentEl.addEventListener("icSubmitSearch", this.handleSubmitSearch);
|
838
|
+
this.hasTimedOut = (_a = this.options) === null || _a === void 0 ? void 0 : _a.some((opt) => opt.timedOut);
|
839
|
+
this.isLoading = (_b = this.options) === null || _b === void 0 ? void 0 : _b.some((opt) => opt.loading);
|
840
|
+
}
|
841
|
+
componentDidLoad() {
|
842
|
+
if (this.isSearchBar &&
|
843
|
+
this.parentEl.disableAutoFiltering) {
|
844
|
+
this.focusFromSearchKeypress = true;
|
845
|
+
}
|
846
|
+
helpers.onComponentRequiredPropUndefined([
|
847
|
+
{ prop: this.open, propName: "open" },
|
848
|
+
{ prop: this.options, propName: "options" },
|
849
|
+
{ prop: this.menuId, propName: "menu-id" },
|
850
|
+
{ prop: this.inputLabel, propName: "input-label" },
|
851
|
+
//NOTE: no check for value, input-el or anchor-el as otherwise get console errors on first load of select component
|
852
|
+
], "Menu");
|
853
|
+
}
|
854
|
+
componentDidUpdate() {
|
855
|
+
const inputValueInOptions = this.options.some((option) => option[this.valueField] === this.value);
|
856
|
+
if (this.open && this.options.length !== 0 && !this.preventMenuFocus) {
|
857
|
+
if (this.value &&
|
858
|
+
this.keyboardNav &&
|
859
|
+
inputValueInOptions &&
|
860
|
+
this.autofocusOnSelected &&
|
861
|
+
!this.isSearchableSelect) {
|
862
|
+
this.scrollToSelected(this.menu);
|
863
|
+
}
|
864
|
+
else if (this.selectOnEnter) {
|
865
|
+
this.menu.focus();
|
866
|
+
}
|
867
|
+
else if (!!this.optionHighlighted &&
|
868
|
+
!this.focusFromSearchKeypress &&
|
869
|
+
!this.preventIncorrectTabOrder) {
|
870
|
+
const highlightedEl = this.host.querySelector(`li[data-value="${this.optionHighlighted}"]`);
|
871
|
+
if (highlightedEl) {
|
872
|
+
this.menu.setAttribute(this.ACTIVE_DESCENDANT, highlightedEl.id);
|
873
|
+
highlightedEl.focus();
|
874
|
+
}
|
875
|
+
}
|
876
|
+
else if (this.inputEl.tagName !== "INPUT") {
|
877
|
+
this.menu.focus();
|
878
|
+
}
|
879
|
+
}
|
880
|
+
if (this.open && !this.value && this.selectOnEnter) {
|
881
|
+
this.scrollToSelected(this.menu);
|
882
|
+
}
|
883
|
+
this.preventMenuFocus = false;
|
884
|
+
}
|
885
|
+
componentDidRender() {
|
886
|
+
if (this.open && !this.popperInstance && this.anchorEl) {
|
887
|
+
this.initPopperJs(this.anchorEl);
|
888
|
+
}
|
889
|
+
if (this.open && !!this.options.length) {
|
890
|
+
this.setMenuScrollbar();
|
891
|
+
}
|
892
|
+
}
|
893
|
+
/**
|
894
|
+
* @internal If menu is opened with the mouse, emit menuStateChange custom event.
|
895
|
+
*/
|
896
|
+
async handleClickOpen() {
|
897
|
+
if (!this.preventClickOpen) {
|
898
|
+
this.menuStateChange.emit({ open: !this.open });
|
899
|
+
this.keyboardNav = false;
|
900
|
+
}
|
901
|
+
this.preventClickOpen = false;
|
902
|
+
}
|
903
|
+
/**
|
904
|
+
* Used alongside activationType
|
905
|
+
* If menu is opened via keyboard navigation (i.e. Enter, ArrowUp or ArrowDown), emit optionSelect custom event.
|
906
|
+
* @param {KeyboardEvent} event The keyboard event which is available when handleKeyboardOpen is invoked.
|
907
|
+
*/
|
908
|
+
async handleKeyboardOpen(event) {
|
909
|
+
if (this.activationType === "automatic") {
|
910
|
+
this.autoSetInputValueKeyboardOpen(event);
|
911
|
+
}
|
912
|
+
else {
|
913
|
+
this.manualSetInputValueKeyboardOpen(event);
|
914
|
+
}
|
915
|
+
}
|
916
|
+
/**
|
917
|
+
* @internal Used to highlight the first option in the menu.
|
918
|
+
*/
|
919
|
+
async handleSetFirstOption() {
|
920
|
+
this.setHighlightedOption(0);
|
921
|
+
}
|
922
|
+
/**
|
923
|
+
* @internal Used to initialize popperJS with an anchor element.
|
924
|
+
* 5/12/2023: Tested with Floating UI, however, discovered inconsistent
|
925
|
+
* boundary behaviour so sticking with PopperJS.
|
926
|
+
*/
|
927
|
+
async initPopperJs(anchor) {
|
928
|
+
// Placements set to "-start" to accommodate for custom menu width - menu should always be aligned to the left
|
929
|
+
this.popperInstance = popper.createPopper(anchor, this.host, {
|
930
|
+
placement: "bottom-start",
|
931
|
+
modifiers: [
|
932
|
+
{
|
933
|
+
name: "offset",
|
934
|
+
options: {
|
935
|
+
offset: [0, 7],
|
936
|
+
},
|
937
|
+
},
|
938
|
+
{
|
939
|
+
name: "flip",
|
940
|
+
options: {
|
941
|
+
fallbackPlacements: ["top-start"],
|
942
|
+
rootBoundary: "viewport",
|
943
|
+
},
|
944
|
+
},
|
945
|
+
],
|
946
|
+
});
|
947
|
+
}
|
948
|
+
focusOnSearchOrSelectInput(menuOptions, highlightedOptionIndex) {
|
949
|
+
if (!menuOptions[highlightedOptionIndex])
|
950
|
+
return;
|
951
|
+
if (this.isSearchBar) {
|
952
|
+
this.parentEl.setFocus();
|
953
|
+
if (this.searchMode === "navigation")
|
954
|
+
this.setHighlightedOption(0);
|
955
|
+
}
|
956
|
+
if (this.isSearchableSelect) {
|
957
|
+
this.parentEl.setFocus();
|
958
|
+
}
|
959
|
+
this.focusFromSearchKeypress = true;
|
960
|
+
}
|
961
|
+
render() {
|
962
|
+
const { inputLabel, options, menuId, value, fullWidth, hasTimedOut, isLoading, size, open, inputEl, keyboardNav, parentEl, SEARCH_BAR_TAG, } = this;
|
963
|
+
const selectAllButtonText = `${(value === null || value === void 0 ? void 0 : value.length) === this.ungroupedOptions.length ? "Clear" : "Select"} all`;
|
964
|
+
const hasNoResults = this.host.classList.contains("no-results");
|
965
|
+
return (index.h(index.Host, { class: {
|
966
|
+
"ic-menu-full-width": fullWidth,
|
967
|
+
"ic-menu-no-focus": ((inputEl === null || inputEl === void 0 ? void 0 : inputEl.tagName) === "INPUT" &&
|
968
|
+
(parentEl === null || parentEl === void 0 ? void 0 : parentEl.tagName) !== SEARCH_BAR_TAG) ||
|
969
|
+
hasTimedOut ||
|
970
|
+
isLoading,
|
971
|
+
[`ic-menu-${size}`]: true,
|
972
|
+
"ic-menu-open": open && options.length !== 0,
|
973
|
+
"ic-menu-multiple": this.isMultiSelect,
|
974
|
+
} }, options.length !== 0 && (index.h("ul", { id: menuId, class: "menu", role: "listbox", "aria-label": `${inputLabel} pop-up`, "aria-multiselectable": this.isMultiSelect ? "true" : "false", tabindex: open &&
|
975
|
+
!keyboardNav &&
|
976
|
+
((inputEl === null || inputEl === void 0 ? void 0 : inputEl.tagName) !== "INPUT" ||
|
977
|
+
(parentEl === null || parentEl === void 0 ? void 0 : parentEl.tagName) === SEARCH_BAR_TAG)
|
978
|
+
? "0"
|
979
|
+
: "-1", ref: (el) => (this.menu = el), onKeyDown: this.handleMenuKeyDown, onKeyUp: this.handleMenuKeyUp, onBlur: this.handleBlur }, this.getSortedOptions(options).map((option, index$1) => {
|
980
|
+
if (option.children) {
|
981
|
+
if (option.children.length > 0) {
|
982
|
+
return (index.h("div", null, index.h("ic-typography", { class: "option-group-title", role: "presentation", variant: "subtitle-small" }, index.h("p", null, option[this.labelField])), option.children.map((childOption) => childOption.label &&
|
983
|
+
this.displayOption(childOption, this.isMultiSelect
|
984
|
+
? value === null || value === void 0 ? void 0 : value.includes(childOption[this.valueField])
|
985
|
+
: childOption[this.valueField] === value, index$1, option))));
|
986
|
+
}
|
987
|
+
else {
|
988
|
+
return null;
|
989
|
+
}
|
990
|
+
}
|
991
|
+
else {
|
992
|
+
// Display option only if it has a label (rather than displaying an empty space)
|
993
|
+
return (option.label &&
|
994
|
+
this.displayOption(option, this.isMultiSelect
|
995
|
+
? value === null || value === void 0 ? void 0 : value.includes(option[this.valueField])
|
996
|
+
: option[this.valueField] === value, index$1));
|
997
|
+
}
|
998
|
+
}))), options.length !== 0 &&
|
999
|
+
this.isMultiSelect &&
|
1000
|
+
!isLoading &&
|
1001
|
+
!hasTimedOut &&
|
1002
|
+
!hasNoResults && (index.h("div", { class: "option-bar" }, index.h("ic-typography", null, index.h("p", null, `${value ? value.length : 0}/${helpers.getOptionsWithoutGroupTitlesCount(this.options)} selected`)), index.h("ic-button", { class: "select-all-button", "aria-label": `${selectAllButtonText} options for ${inputLabel}`, ref: (el) => (this.selectAllButton = el), variant: "tertiary", onClick: this.handleSelectAllClick, onMouseDown: this.handleSelectAllMouseDown, onBlur: this.handleSelectAllBlur, onFocus: this.handleSelectAllFocus, size: size === "small" ? "small" : "medium" }, selectAllButtonText)))));
|
1003
|
+
}
|
1004
|
+
get host() { return index.getElement(this); }
|
1005
|
+
static get watchers() { return {
|
1006
|
+
"open": ["watchOpenHandler"],
|
1007
|
+
"options": ["watchOptionsHandler"]
|
1008
|
+
}; }
|
1009
|
+
};
|
1010
|
+
Menu.style = icMenuCss;
|
1011
|
+
|
1012
|
+
exports.ic_input_component_container = InputComponentContainer;
|
1013
|
+
exports.ic_input_container = InputContainer;
|
1014
|
+
exports.ic_menu = Menu;
|
1015
|
+
|
1016
|
+
//# sourceMappingURL=ic-input-component-container_3.cjs.entry.js.map
|