@ukic/canary-web-components 3.0.0-canary.18 → 3.0.0-canary.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/core.cjs.js +1 -1
- package/dist/cjs/{helpers-6f33d131.js → helpers-a5405964.js} +12 -20
- package/dist/cjs/helpers-a5405964.js.map +1 -0
- package/dist/cjs/ic-accordion.cjs.entry.js +9 -7
- package/dist/cjs/ic-accordion.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-alert.cjs.entry.js +1 -1
- package/dist/cjs/ic-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-breadcrumb-group.cjs.entry.js +2 -2
- package/dist/cjs/ic-breadcrumb-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-breadcrumb.cjs.entry.js +2 -2
- package/dist/cjs/ic-breadcrumb.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-button_3.cjs.entry.js +8 -8
- package/dist/cjs/ic-button_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-card-horizontal.cjs.entry.js +1 -1
- package/dist/cjs/ic-card-vertical.cjs.entry.js +1 -1
- package/dist/cjs/ic-card-vertical.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-checkbox-group.cjs.entry.js +2 -2
- package/dist/cjs/ic-checkbox-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-checkbox_3.cjs.entry.js +20 -37
- package/dist/cjs/ic-checkbox_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-data-list.cjs.entry.js +2 -2
- package/dist/cjs/ic-data-list.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-data-row.cjs.entry.js +2 -2
- package/dist/cjs/ic-data-row.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-data-table-title-bar.cjs.entry.js +1 -1
- package/dist/cjs/ic-data-table.cjs.entry.js +311 -319
- package/dist/cjs/ic-data-table.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-date-input.cjs.entry.js +1 -1
- package/dist/cjs/ic-date-picker.cjs.entry.js +1 -1
- package/dist/cjs/ic-dialog.cjs.entry.js +1 -1
- package/dist/cjs/ic-dialog.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-footer-link.cjs.entry.js +2 -2
- package/dist/cjs/ic-footer-link.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-hero.cjs.entry.js +6 -5
- package/dist/cjs/ic-hero.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-horizontal-scroll.cjs.entry.js +5 -5
- package/dist/cjs/ic-horizontal-scroll.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js +22 -21
- package/dist/cjs/ic-input-component-container_3.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-input-label_2.cjs.entry.js +7 -7
- package/dist/cjs/ic-input-label_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-link.cjs.entry.js +11 -21
- package/dist/cjs/ic-link.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-menu-group.cjs.entry.js +1 -1
- package/dist/cjs/ic-menu-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-group.cjs.entry.js +115 -163
- package/dist/cjs/ic-navigation-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-item.cjs.entry.js +64 -61
- package/dist/cjs/ic-navigation-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-navigation-menu.cjs.entry.js +4 -4
- package/dist/cjs/ic-navigation-menu.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-page-header.cjs.entry.js +6 -6
- package/dist/cjs/ic-page-header.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-pagination_4.cjs.entry.js +160 -231
- package/dist/cjs/ic-pagination_4.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-popover-menu.cjs.entry.js +5 -5
- package/dist/cjs/ic-popover-menu.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-radio-group.cjs.entry.js +4 -4
- package/dist/cjs/ic-radio-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-radio-option.cjs.entry.js +4 -4
- package/dist/cjs/ic-radio-option.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-search-bar.cjs.entry.js +49 -31
- package/dist/cjs/ic-search-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-section-container.cjs.entry.js +2 -2
- package/dist/cjs/ic-section-container.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-side-navigation.cjs.entry.js +23 -4
- package/dist/cjs/ic-side-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-skeleton.cjs.entry.js +2 -2
- package/dist/cjs/ic-skeleton.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-skip-link.cjs.entry.js +2 -2
- package/dist/cjs/ic-skip-link.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-status-tag.cjs.entry.js +2 -2
- package/dist/cjs/ic-status-tag.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-step.cjs.entry.js +13 -13
- package/dist/cjs/ic-step.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-stepper.cjs.entry.js +2 -2
- package/dist/cjs/ic-stepper.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-switch.cjs.entry.js +4 -4
- package/dist/cjs/ic-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tab-context.cjs.entry.js +1 -1
- package/dist/cjs/ic-tab-context.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tab-group.cjs.entry.js +2 -2
- 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-theme.cjs.entry.js +1 -1
- package/dist/cjs/ic-theme.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-toast-region.cjs.entry.js +1 -1
- package/dist/cjs/ic-toast-region.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-toast.cjs.entry.js +3 -3
- package/dist/cjs/ic-toast.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-toggle-button-group.cjs.entry.js +53 -67
- package/dist/cjs/ic-toggle-button-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-toggle-button.cjs.entry.js +61 -63
- package/dist/cjs/ic-toggle-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-top-navigation.cjs.entry.js +64 -62
- package/dist/cjs/ic-top-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ic-tree-item.cjs.entry.js +1 -1
- package/dist/cjs/ic-tree-view.cjs.entry.js +1 -1
- package/dist/cjs/ic-typography.cjs.entry.js +2 -2
- package/dist/cjs/ic-typography.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/ic-data-table/ic-data-table.css +3 -5
- package/dist/collection/components/ic-data-table/ic-data-table.js +310 -318
- package/dist/collection/components/ic-data-table/ic-data-table.js.map +1 -1
- package/dist/collection/components/ic-data-table/story-data.js +1 -0
- package/dist/collection/components/ic-data-table/story-data.js.map +1 -1
- package/dist/collection/components/ic-pagination-bar/ic-pagination-bar.js +30 -22
- package/dist/collection/components/ic-pagination-bar/ic-pagination-bar.js.map +1 -1
- package/dist/collection/utils/helpers.js +23 -51
- package/dist/collection/utils/helpers.js.map +1 -1
- package/dist/collection/utils/types.js.map +1 -1
- package/dist/components/helpers2.js +12 -20
- package/dist/components/helpers2.js.map +1 -1
- package/dist/components/ic-accordion.js +9 -7
- package/dist/components/ic-accordion.js.map +1 -1
- package/dist/components/ic-alert.js +1 -1
- package/dist/components/ic-alert.js.map +1 -1
- package/dist/components/ic-breadcrumb-group.js +2 -2
- package/dist/components/ic-breadcrumb-group.js.map +1 -1
- package/dist/components/ic-breadcrumb2.js +2 -2
- package/dist/components/ic-breadcrumb2.js.map +1 -1
- package/dist/components/ic-button2.js +3 -3
- package/dist/components/ic-button2.js.map +1 -1
- package/dist/components/ic-card-vertical.js +1 -1
- package/dist/components/ic-card-vertical.js.map +1 -1
- package/dist/components/ic-checkbox-group.js +2 -2
- package/dist/components/ic-checkbox-group.js.map +1 -1
- package/dist/components/ic-checkbox2.js +7 -12
- package/dist/components/ic-checkbox2.js.map +1 -1
- package/dist/components/ic-data-list.js +2 -2
- package/dist/components/ic-data-list.js.map +1 -1
- package/dist/components/ic-data-row.js +2 -2
- package/dist/components/ic-data-row.js.map +1 -1
- package/dist/components/ic-data-table.js +311 -319
- package/dist/components/ic-data-table.js.map +1 -1
- package/dist/components/ic-dialog.js +1 -1
- package/dist/components/ic-dialog.js.map +1 -1
- package/dist/components/ic-empty-state2.js +2 -2
- package/dist/components/ic-empty-state2.js.map +1 -1
- package/dist/components/ic-footer-link.js +2 -2
- package/dist/components/ic-footer-link.js.map +1 -1
- package/dist/components/ic-hero.js +6 -5
- package/dist/components/ic-hero.js.map +1 -1
- package/dist/components/ic-horizontal-scroll2.js +5 -5
- package/dist/components/ic-horizontal-scroll2.js.map +1 -1
- package/dist/components/ic-input-component-container2.js +3 -3
- package/dist/components/ic-input-component-container2.js.map +1 -1
- package/dist/components/ic-input-container2.js +2 -2
- package/dist/components/ic-input-container2.js.map +1 -1
- package/dist/components/ic-input-label2.js +4 -4
- package/dist/components/ic-input-label2.js.map +1 -1
- package/dist/components/ic-input-validation2.js +3 -3
- package/dist/components/ic-input-validation2.js.map +1 -1
- package/dist/components/ic-link2.js +12 -24
- package/dist/components/ic-link2.js.map +1 -1
- package/dist/components/ic-loading-indicator2.js +3 -3
- package/dist/components/ic-loading-indicator2.js.map +1 -1
- package/dist/components/ic-menu-group.js +1 -1
- package/dist/components/ic-menu-group.js.map +1 -1
- package/dist/components/ic-menu2.js +17 -16
- package/dist/components/ic-menu2.js.map +1 -1
- package/dist/components/ic-navigation-group.js +115 -163
- package/dist/components/ic-navigation-group.js.map +1 -1
- package/dist/components/ic-navigation-item.js +67 -62
- package/dist/components/ic-navigation-item.js.map +1 -1
- package/dist/components/ic-navigation-menu2.js +4 -4
- package/dist/components/ic-navigation-menu2.js.map +1 -1
- package/dist/components/ic-page-header.js +6 -6
- package/dist/components/ic-page-header.js.map +1 -1
- package/dist/components/ic-pagination-bar2.js +12 -23
- package/dist/components/ic-pagination-bar2.js.map +1 -1
- package/dist/components/ic-pagination-item2.js +1 -1
- package/dist/components/ic-pagination-item2.js.map +1 -1
- package/dist/components/ic-pagination2.js +4 -4
- package/dist/components/ic-pagination2.js.map +1 -1
- package/dist/components/ic-popover-menu.js +5 -5
- package/dist/components/ic-popover-menu.js.map +1 -1
- package/dist/components/ic-radio-group.js +4 -4
- package/dist/components/ic-radio-group.js.map +1 -1
- package/dist/components/ic-radio-option.js +4 -4
- package/dist/components/ic-radio-option.js.map +1 -1
- package/dist/components/ic-search-bar.js +50 -31
- package/dist/components/ic-search-bar.js.map +1 -1
- package/dist/components/ic-section-container2.js +2 -2
- package/dist/components/ic-section-container2.js.map +1 -1
- package/dist/components/ic-select2.js +141 -217
- package/dist/components/ic-select2.js.map +1 -1
- package/dist/components/ic-side-navigation.js +24 -4
- package/dist/components/ic-side-navigation.js.map +1 -1
- package/dist/components/ic-skeleton.js +2 -2
- package/dist/components/ic-skeleton.js.map +1 -1
- package/dist/components/ic-skip-link.js +2 -2
- package/dist/components/ic-skip-link.js.map +1 -1
- package/dist/components/ic-status-tag.js +2 -2
- package/dist/components/ic-status-tag.js.map +1 -1
- package/dist/components/ic-step.js +13 -13
- package/dist/components/ic-step.js.map +1 -1
- package/dist/components/ic-stepper.js +2 -2
- package/dist/components/ic-stepper.js.map +1 -1
- package/dist/components/ic-switch.js +4 -4
- package/dist/components/ic-switch.js.map +1 -1
- package/dist/components/ic-tab-context.js +1 -1
- package/dist/components/ic-tab-context.js.map +1 -1
- package/dist/components/ic-tab-group.js +2 -2
- package/dist/components/ic-tab-group.js.map +1 -1
- package/dist/components/ic-tab-panel.js +2 -2
- package/dist/components/ic-tab-panel.js.map +1 -1
- package/dist/components/ic-text-field2.js +16 -10
- package/dist/components/ic-text-field2.js.map +1 -1
- package/dist/components/ic-theme.js +1 -1
- package/dist/components/ic-theme.js.map +1 -1
- package/dist/components/ic-toast-region.js +1 -1
- package/dist/components/ic-toast-region.js.map +1 -1
- package/dist/components/ic-toast.js +3 -3
- package/dist/components/ic-toast.js.map +1 -1
- package/dist/components/ic-toggle-button-group.js +53 -67
- package/dist/components/ic-toggle-button-group.js.map +1 -1
- package/dist/components/ic-toggle-button.js +61 -63
- package/dist/components/ic-toggle-button.js.map +1 -1
- package/dist/components/ic-tooltip2.js +2 -2
- package/dist/components/ic-tooltip2.js.map +1 -1
- package/dist/components/ic-top-navigation.js +65 -63
- package/dist/components/ic-top-navigation.js.map +1 -1
- package/dist/components/ic-tree-view.js +1 -1
- package/dist/components/ic-typography2.js +2 -2
- package/dist/components/ic-typography2.js.map +1 -1
- package/dist/core/core.esm.js +1 -1
- package/dist/core/core.esm.js.map +1 -1
- package/dist/core/{p-ef07630d.entry.js → p-0c9c6c31.entry.js} +2 -2
- package/dist/core/{p-ef07630d.entry.js.map → p-0c9c6c31.entry.js.map} +1 -1
- package/dist/core/p-0e0e0942.js +2 -0
- package/dist/core/p-0e0e0942.js.map +1 -0
- package/dist/core/{p-824cbf95.entry.js → p-1673d010.entry.js} +2 -2
- package/dist/core/{p-824cbf95.entry.js.map → p-1673d010.entry.js.map} +1 -1
- package/dist/core/{p-e9683f52.entry.js → p-16e78c1d.entry.js} +2 -2
- package/dist/core/p-16e78c1d.entry.js.map +1 -0
- package/dist/core/p-17926ee3.entry.js +2 -0
- package/dist/core/p-17926ee3.entry.js.map +1 -0
- package/dist/core/{p-fbcc2a11.entry.js → p-188ba287.entry.js} +2 -2
- package/dist/core/{p-fbcc2a11.entry.js.map → p-188ba287.entry.js.map} +1 -1
- package/dist/core/{p-bff6fef6.entry.js → p-1f18bbf6.entry.js} +2 -2
- package/dist/core/{p-bff6fef6.entry.js.map → p-1f18bbf6.entry.js.map} +1 -1
- package/dist/core/{p-0e3a62cc.entry.js → p-2667c808.entry.js} +2 -2
- package/dist/core/{p-3800cda8.entry.js → p-28611f52.entry.js} +2 -2
- package/dist/core/p-28611f52.entry.js.map +1 -0
- package/dist/core/{p-fb1fce87.entry.js → p-29a49ea2.entry.js} +2 -2
- package/dist/core/{p-fb1fce87.entry.js.map → p-29a49ea2.entry.js.map} +1 -1
- package/dist/core/{p-bc2ca778.entry.js → p-3cb4ecef.entry.js} +2 -2
- package/dist/core/{p-bc2ca778.entry.js.map → p-3cb4ecef.entry.js.map} +1 -1
- package/dist/core/p-4444e787.entry.js +2 -0
- package/dist/core/{p-cd770df5.entry.js.map → p-4444e787.entry.js.map} +1 -1
- package/dist/core/p-4aaf10a5.entry.js +2 -0
- package/dist/core/p-4aaf10a5.entry.js.map +1 -0
- package/dist/core/{p-e7c00131.entry.js → p-578a02ff.entry.js} +2 -2
- package/dist/core/{p-e7c00131.entry.js.map → p-578a02ff.entry.js.map} +1 -1
- package/dist/core/{p-a054bb1b.entry.js → p-582da938.entry.js} +2 -2
- package/dist/core/{p-a054bb1b.entry.js.map → p-582da938.entry.js.map} +1 -1
- package/dist/core/{p-d328f6fc.entry.js → p-5926c2b2.entry.js} +2 -2
- package/dist/core/{p-d328f6fc.entry.js.map → p-5926c2b2.entry.js.map} +1 -1
- package/dist/core/p-61e78ce0.entry.js +2 -0
- package/dist/core/p-61e78ce0.entry.js.map +1 -0
- package/dist/core/{p-5744b8b3.entry.js → p-6a63a73a.entry.js} +2 -2
- package/dist/core/{p-5744b8b3.entry.js.map → p-6a63a73a.entry.js.map} +1 -1
- package/dist/core/{p-266686d0.entry.js → p-6bfff7ba.entry.js} +2 -2
- package/dist/core/p-6bfff7ba.entry.js.map +1 -0
- package/dist/core/{p-f6141c29.entry.js → p-7c3cd0b8.entry.js} +2 -2
- package/dist/core/p-7e4f5717.entry.js +2 -0
- package/dist/core/p-7e4f5717.entry.js.map +1 -0
- package/dist/core/{p-eb88b348.entry.js → p-7eaa223b.entry.js} +2 -2
- package/dist/core/{p-eb88b348.entry.js.map → p-7eaa223b.entry.js.map} +1 -1
- package/dist/core/{p-09f54ca3.entry.js → p-8112444e.entry.js} +2 -2
- package/dist/core/{p-09f54ca3.entry.js.map → p-8112444e.entry.js.map} +1 -1
- package/dist/core/{p-af1d6e41.entry.js → p-85a17585.entry.js} +2 -2
- package/dist/core/{p-1aed572a.entry.js → p-864e337f.entry.js} +2 -2
- package/dist/core/{p-1aed572a.entry.js.map → p-864e337f.entry.js.map} +1 -1
- package/dist/core/{p-fb8d27fa.entry.js → p-887b1302.entry.js} +2 -2
- package/dist/core/{p-fb8d27fa.entry.js.map → p-887b1302.entry.js.map} +1 -1
- package/dist/core/p-8d2d9e11.entry.js +2 -0
- package/dist/core/p-8d2d9e11.entry.js.map +1 -0
- package/dist/core/p-920f6480.entry.js +2 -0
- package/dist/core/p-920f6480.entry.js.map +1 -0
- package/dist/core/{p-7c096c5e.entry.js → p-9687e929.entry.js} +2 -2
- package/dist/core/{p-7c096c5e.entry.js.map → p-9687e929.entry.js.map} +1 -1
- package/dist/core/{p-33f4abc9.entry.js → p-976f4280.entry.js} +2 -2
- package/dist/core/{p-33f4abc9.entry.js.map → p-976f4280.entry.js.map} +1 -1
- package/dist/core/p-9989ec00.entry.js +2 -0
- package/dist/core/p-9989ec00.entry.js.map +1 -0
- package/dist/core/{p-93e154e0.entry.js → p-9a78f449.entry.js} +2 -2
- package/dist/core/{p-93e154e0.entry.js.map → p-9a78f449.entry.js.map} +1 -1
- package/dist/core/{p-f9a16fa8.entry.js → p-9aecbfe9.entry.js} +2 -2
- package/dist/core/{p-f9a16fa8.entry.js.map → p-9aecbfe9.entry.js.map} +1 -1
- package/dist/core/{p-45f32fea.entry.js → p-a894ddb6.entry.js} +2 -2
- package/dist/core/p-a894ddb6.entry.js.map +1 -0
- package/dist/core/p-abcaf14d.entry.js +2 -0
- package/dist/core/p-abcaf14d.entry.js.map +1 -0
- package/dist/core/p-aeeff0e5.entry.js +2 -0
- package/dist/core/p-aeeff0e5.entry.js.map +1 -0
- package/dist/core/{p-e38b20bf.entry.js → p-b92727c0.entry.js} +2 -2
- package/dist/core/{p-e38b20bf.entry.js.map → p-b92727c0.entry.js.map} +1 -1
- package/dist/core/{p-d3d48548.entry.js → p-ba5e1b21.entry.js} +2 -2
- package/dist/core/{p-d3d48548.entry.js.map → p-ba5e1b21.entry.js.map} +1 -1
- package/dist/core/{p-b9459ba2.entry.js → p-bf3b853e.entry.js} +2 -2
- package/dist/core/{p-b9459ba2.entry.js.map → p-bf3b853e.entry.js.map} +1 -1
- package/dist/core/{p-9882c572.entry.js → p-c3be8a0f.entry.js} +2 -2
- package/dist/core/p-c3be8a0f.entry.js.map +1 -0
- package/dist/core/{p-72c117b6.entry.js → p-c5ffe2cf.entry.js} +2 -2
- package/dist/core/{p-72c117b6.entry.js.map → p-c5ffe2cf.entry.js.map} +1 -1
- package/dist/core/{p-aa83f828.entry.js → p-c8d207e1.entry.js} +2 -2
- package/dist/core/p-ca7e1219.entry.js +2 -0
- package/dist/core/p-ca7e1219.entry.js.map +1 -0
- package/dist/core/p-d0c38d58.entry.js +2 -0
- package/dist/core/p-d0c38d58.entry.js.map +1 -0
- package/dist/core/{p-df88ff5b.entry.js → p-d4903dcd.entry.js} +2 -2
- package/dist/core/{p-df88ff5b.entry.js.map → p-d4903dcd.entry.js.map} +1 -1
- package/dist/core/{p-9ca147f3.entry.js → p-de1e04ac.entry.js} +2 -2
- package/dist/core/{p-9ca147f3.entry.js.map → p-de1e04ac.entry.js.map} +1 -1
- package/dist/core/{p-8b5022bc.entry.js → p-dee21f6d.entry.js} +2 -2
- package/dist/core/{p-8b5022bc.entry.js.map → p-dee21f6d.entry.js.map} +1 -1
- package/dist/core/{p-ad390076.entry.js → p-e003ad46.entry.js} +2 -2
- package/dist/core/{p-ad390076.entry.js.map → p-e003ad46.entry.js.map} +1 -1
- package/dist/core/{p-1be17f22.entry.js → p-e2629bfe.entry.js} +2 -2
- package/dist/core/{p-1be17f22.entry.js.map → p-e2629bfe.entry.js.map} +1 -1
- package/dist/core/p-e38dd019.entry.js +2 -0
- package/dist/core/p-e38dd019.entry.js.map +1 -0
- package/dist/core/{p-84daed4d.entry.js → p-e546d477.entry.js} +2 -2
- package/dist/core/p-e546d477.entry.js.map +1 -0
- package/dist/core/{p-5c363e21.entry.js → p-f9e78341.entry.js} +2 -2
- package/dist/core/{p-0a0b25c5.entry.js → p-fedfd000.entry.js} +2 -2
- package/dist/esm/core.js +1 -1
- package/dist/esm/{helpers-0bb68835.js → helpers-ef2db990.js} +13 -21
- package/dist/esm/helpers-ef2db990.js.map +1 -0
- package/dist/esm/ic-accordion.entry.js +9 -7
- package/dist/esm/ic-accordion.entry.js.map +1 -1
- package/dist/esm/ic-alert.entry.js +1 -1
- package/dist/esm/ic-alert.entry.js.map +1 -1
- package/dist/esm/ic-breadcrumb-group.entry.js +2 -2
- package/dist/esm/ic-breadcrumb-group.entry.js.map +1 -1
- package/dist/esm/ic-breadcrumb.entry.js +2 -2
- package/dist/esm/ic-breadcrumb.entry.js.map +1 -1
- package/dist/esm/ic-button_3.entry.js +8 -8
- package/dist/esm/ic-button_3.entry.js.map +1 -1
- package/dist/esm/ic-card-horizontal.entry.js +1 -1
- package/dist/esm/ic-card-vertical.entry.js +1 -1
- package/dist/esm/ic-card-vertical.entry.js.map +1 -1
- package/dist/esm/ic-checkbox-group.entry.js +2 -2
- package/dist/esm/ic-checkbox-group.entry.js.map +1 -1
- package/dist/esm/ic-checkbox_3.entry.js +20 -37
- package/dist/esm/ic-checkbox_3.entry.js.map +1 -1
- package/dist/esm/ic-data-list.entry.js +2 -2
- package/dist/esm/ic-data-list.entry.js.map +1 -1
- package/dist/esm/ic-data-row.entry.js +2 -2
- package/dist/esm/ic-data-row.entry.js.map +1 -1
- package/dist/esm/ic-data-table-title-bar.entry.js +1 -1
- package/dist/esm/ic-data-table.entry.js +311 -319
- package/dist/esm/ic-data-table.entry.js.map +1 -1
- package/dist/esm/ic-date-input.entry.js +1 -1
- package/dist/esm/ic-date-picker.entry.js +1 -1
- package/dist/esm/ic-dialog.entry.js +1 -1
- package/dist/esm/ic-dialog.entry.js.map +1 -1
- package/dist/esm/ic-footer-link.entry.js +2 -2
- package/dist/esm/ic-footer-link.entry.js.map +1 -1
- package/dist/esm/ic-hero.entry.js +6 -5
- package/dist/esm/ic-hero.entry.js.map +1 -1
- package/dist/esm/ic-horizontal-scroll.entry.js +5 -5
- package/dist/esm/ic-horizontal-scroll.entry.js.map +1 -1
- package/dist/esm/ic-input-component-container_3.entry.js +22 -21
- package/dist/esm/ic-input-component-container_3.entry.js.map +1 -1
- package/dist/esm/ic-input-label_2.entry.js +7 -7
- package/dist/esm/ic-input-label_2.entry.js.map +1 -1
- package/dist/esm/ic-link.entry.js +11 -21
- package/dist/esm/ic-link.entry.js.map +1 -1
- package/dist/esm/ic-menu-group.entry.js +1 -1
- package/dist/esm/ic-menu-group.entry.js.map +1 -1
- package/dist/esm/ic-navigation-group.entry.js +115 -163
- package/dist/esm/ic-navigation-group.entry.js.map +1 -1
- package/dist/esm/ic-navigation-item.entry.js +64 -61
- package/dist/esm/ic-navigation-item.entry.js.map +1 -1
- package/dist/esm/ic-navigation-menu.entry.js +4 -4
- package/dist/esm/ic-navigation-menu.entry.js.map +1 -1
- package/dist/esm/ic-page-header.entry.js +6 -6
- package/dist/esm/ic-page-header.entry.js.map +1 -1
- package/dist/esm/ic-pagination_4.entry.js +161 -232
- package/dist/esm/ic-pagination_4.entry.js.map +1 -1
- package/dist/esm/ic-popover-menu.entry.js +5 -5
- package/dist/esm/ic-popover-menu.entry.js.map +1 -1
- package/dist/esm/ic-radio-group.entry.js +4 -4
- package/dist/esm/ic-radio-group.entry.js.map +1 -1
- package/dist/esm/ic-radio-option.entry.js +4 -4
- package/dist/esm/ic-radio-option.entry.js.map +1 -1
- package/dist/esm/ic-search-bar.entry.js +49 -31
- package/dist/esm/ic-search-bar.entry.js.map +1 -1
- package/dist/esm/ic-section-container.entry.js +2 -2
- package/dist/esm/ic-section-container.entry.js.map +1 -1
- package/dist/esm/ic-side-navigation.entry.js +23 -4
- package/dist/esm/ic-side-navigation.entry.js.map +1 -1
- package/dist/esm/ic-skeleton.entry.js +2 -2
- package/dist/esm/ic-skeleton.entry.js.map +1 -1
- package/dist/esm/ic-skip-link.entry.js +2 -2
- package/dist/esm/ic-skip-link.entry.js.map +1 -1
- package/dist/esm/ic-status-tag.entry.js +2 -2
- package/dist/esm/ic-status-tag.entry.js.map +1 -1
- package/dist/esm/ic-step.entry.js +13 -13
- package/dist/esm/ic-step.entry.js.map +1 -1
- package/dist/esm/ic-stepper.entry.js +2 -2
- package/dist/esm/ic-stepper.entry.js.map +1 -1
- package/dist/esm/ic-switch.entry.js +4 -4
- package/dist/esm/ic-switch.entry.js.map +1 -1
- package/dist/esm/ic-tab-context.entry.js +1 -1
- package/dist/esm/ic-tab-context.entry.js.map +1 -1
- package/dist/esm/ic-tab-group.entry.js +2 -2
- 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-theme.entry.js +1 -1
- package/dist/esm/ic-theme.entry.js.map +1 -1
- package/dist/esm/ic-toast-region.entry.js +1 -1
- package/dist/esm/ic-toast-region.entry.js.map +1 -1
- package/dist/esm/ic-toast.entry.js +3 -3
- package/dist/esm/ic-toast.entry.js.map +1 -1
- package/dist/esm/ic-toggle-button-group.entry.js +53 -67
- package/dist/esm/ic-toggle-button-group.entry.js.map +1 -1
- package/dist/esm/ic-toggle-button.entry.js +61 -63
- package/dist/esm/ic-toggle-button.entry.js.map +1 -1
- package/dist/esm/ic-top-navigation.entry.js +65 -63
- package/dist/esm/ic-top-navigation.entry.js.map +1 -1
- package/dist/esm/ic-tree-item.entry.js +1 -1
- package/dist/esm/ic-tree-view.entry.js +1 -1
- package/dist/esm/ic-typography.entry.js +2 -2
- package/dist/esm/ic-typography.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/ic-data-table/ic-data-table.d.ts +15 -4
- package/dist/types/components/ic-pagination-bar/ic-pagination-bar.d.ts +4 -1
- package/dist/types/components.d.ts +8 -0
- package/dist/types/utils/helpers.d.ts +3 -3
- package/dist/types/utils/types.d.ts +2 -0
- package/hydrate/index.js +1085 -1214
- package/hydrate/index.mjs +1085 -1214
- package/package.json +3 -3
- package/dist/cjs/helpers-6f33d131.js.map +0 -1
- package/dist/core/p-10703715.entry.js +0 -2
- package/dist/core/p-10703715.entry.js.map +0 -1
- package/dist/core/p-266686d0.entry.js.map +0 -1
- package/dist/core/p-3800cda8.entry.js.map +0 -1
- package/dist/core/p-45f32fea.entry.js.map +0 -1
- package/dist/core/p-59bc9fe7.entry.js +0 -2
- package/dist/core/p-59bc9fe7.entry.js.map +0 -1
- package/dist/core/p-6724039c.entry.js +0 -2
- package/dist/core/p-6724039c.entry.js.map +0 -1
- package/dist/core/p-84daed4d.entry.js.map +0 -1
- package/dist/core/p-92a969b3.entry.js +0 -2
- package/dist/core/p-92a969b3.entry.js.map +0 -1
- package/dist/core/p-954959d4.entry.js +0 -2
- package/dist/core/p-954959d4.entry.js.map +0 -1
- package/dist/core/p-95868542.entry.js +0 -2
- package/dist/core/p-95868542.entry.js.map +0 -1
- package/dist/core/p-9882c572.entry.js.map +0 -1
- package/dist/core/p-9918c411.entry.js +0 -2
- package/dist/core/p-9918c411.entry.js.map +0 -1
- package/dist/core/p-ad45f8f8.entry.js +0 -2
- package/dist/core/p-ad45f8f8.entry.js.map +0 -1
- package/dist/core/p-b947e4ff.entry.js +0 -2
- package/dist/core/p-b947e4ff.entry.js.map +0 -1
- package/dist/core/p-c472cb32.entry.js +0 -2
- package/dist/core/p-c472cb32.entry.js.map +0 -1
- package/dist/core/p-cd770df5.entry.js +0 -2
- package/dist/core/p-e9683f52.entry.js.map +0 -1
- package/dist/core/p-ed542433.js +0 -2
- package/dist/core/p-ed542433.js.map +0 -1
- package/dist/core/p-edeb3823.entry.js +0 -2
- package/dist/core/p-edeb3823.entry.js.map +0 -1
- package/dist/core/p-fb8214a9.entry.js +0 -2
- package/dist/core/p-fb8214a9.entry.js.map +0 -1
- package/dist/esm/helpers-0bb68835.js.map +0 -1
- /package/dist/core/{p-0e3a62cc.entry.js.map → p-2667c808.entry.js.map} +0 -0
- /package/dist/core/{p-f6141c29.entry.js.map → p-7c3cd0b8.entry.js.map} +0 -0
- /package/dist/core/{p-af1d6e41.entry.js.map → p-85a17585.entry.js.map} +0 -0
- /package/dist/core/{p-aa83f828.entry.js.map → p-c8d207e1.entry.js.map} +0 -0
- /package/dist/core/{p-5c363e21.entry.js.map → p-f9e78341.entry.js.map} +0 -0
- /package/dist/core/{p-0a0b25c5.entry.js.map → p-fedfd000.entry.js.map} +0 -0
@@ -3,7 +3,7 @@
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
4
4
|
|
5
5
|
const index = require('./index-d337cd8a.js');
|
6
|
-
const helpers = require('./helpers-
|
6
|
+
const helpers = require('./helpers-a5405964.js');
|
7
7
|
|
8
8
|
const unsortedIcon = `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24">
|
9
9
|
<path d="M9 3 5 6.99h3V14h2V6.99h3L9 3zm7 14.01V10h-2v7.01h-3L15 21l4-3.99h-3z"></path>
|
@@ -17,7 +17,7 @@ const descendingIcon = `<svg focusable="false" aria-hidden="true" viewBox="0 0 2
|
|
17
17
|
<path d="M16.01 11H4v2h12.01v3L20 12l-3.99-4z"></path>
|
18
18
|
</svg>`;
|
19
19
|
|
20
|
-
const icDataTableCss = ":host{position:relative;display:inline-flex;max-height:100%;width:var(--table-width, 100%);height:100%;min-width:var(--table-min-width);max-width:var(--table-max-width)}tbody{vertical-align:top}.table-container{position:relative;height:calc(100% - var(--ic-space-xxxs));display:flex;flex-direction:column;width:100%}.cell-container{display:flex;min-height:1.5rem;overflow-y:hidden;height:var(--row-height);--ic-typography-color:var(--ic-data-table-text-default-emphasis)}.truncation-show-hide{display:block}.cell-icon.truncation-show-hide{display:flex}.cell-container:not(.data-type-element,.truncation-show-hide){overflow-x:hidden}ic-loading-indicator{position:sticky;top:20px}.table-row-container{position:relative;height:100%;overflow:auto;transition:var(--ic-easing-transition-fast);overflow-anchor:none}:host([show-pagination=\"true\"]) .table-row-container{height:calc(100% - 3.5625rem)}table{table-layout:var(--table-layout, \"fixed\");border-spacing:0;width:100%;height:var(--table-height, auto)}.table-row-container:focus{outline:none;box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast);z-index:1}:host([embedded=\"true\"]) .table-row-container{border:var(--ic-space-1px) solid var(--ic-data-table-border)}.column-header-inner-container{padding:var(--ic-space-xs);box-sizing:border-box}.column-header-inner-container ic-tooltip{pointer-events:none}.column-header-inner-container ic-tooltip.show-trunc-tooltip{pointer-events:auto}.column-header-inner-container ic-tooltip .column-header-text{--ic-line-clamp:1}.column-header-sticky{position:sticky;top:0;z-index:1}.column-header-overlay{position:sticky;top:0;z-index:1;box-shadow:0 0.375rem var(--ic-space-xs) calc(var(--ic-space-xxs * -1))\n rgb(0 0 0 / 20%)}.row-header-sticky{position:sticky;left:0}.column-header,.table-row{box-sizing:border-box}.table-row-selected{background-color:var(--ic-data-table-cell-background-selected) !important}.table-row:hover{background-color:var(--ic-data-table-cell-background-hover) !important}.table-row-selected:hover{background-color:var(\n --ic-data-table-cell-background-selected-hover\n ) !important}.sort-button{margin-left:auto}.sort-button:hover{background-color:var(--ic-data-table-icon-button-background-hover)}.sort-button:active{background-color:var(--ic-data-table-icon-button-background-pressed)}.sort-button svg{color:var(--ic-data-table-sort-toggle-icon)}.sort-button-unsorted svg{color:var(--ic-data-table-sort-toggle-icon-default)}.table-density-dense .column-header-inner-container,td.table-density-dense{padding:var(--ic-space-xxs) var(--ic-space-xs) !important}.text-dense{font-size:var(--ic-font-size-label)}.table-density-spacious .column-header-inner-container,td.table-density-spacious{padding:0.625rem var(--ic-space-xs) !important}.text-spacious{font-size:1.125rem}.column-header-text{font-weight:var(--ic-font-weight-bold)}.dummy-column-header-text{white-space:nowrap;overflow:hidden;height:0;width:-moz-fit-content;width:fit-content}.row-header,.column-header{text-align:left;padding:var(--ic-space-xs);background-color:var(--ic-data-table-header-background);border-right:var(--ic-space-1px) solid var(--ic-data-table-header-keyline);border-bottom:var(--ic-space-1px) solid var(--ic-data-table-header-keyline);color:var(--ic-data-table-header-text)}.column-header{padding:0;width:var(--column-width);min-width:var(--column-min-width, 4rem);max-width:var(--column-max-width)}.column-header:last-child{border-right:none}.scrollable .column-header:last-child{border-right:var(--ic-space-1px) solid var(--ic-data-table-header-keyline) !important}:host([embedded=\"true\"]) tr:last-child .table-cell,:host([embedded=\"true\"]) tr:last-child .row-header{border-bottom:none}.column-header-alignment-left,.row-header-alignment-left,.cell-alignment-left{text-align:left !important;justify-content:start !important}.column-header-alignment-right,.row-header-alignment-right,.cell-alignment-right{text-align:right !important;justify-content:end !important}.cell-alignment-right.truncation-tooltip ic-tooltip ic-typography{padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}.cell-alignment-right.truncation-show-hide ic-typography{--ellipsis-padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}.column-header-alignment-center,.row-header-alignment-center,.cell-alignment-center{text-align:center !important;justify-content:center !important}.table-row{background-color:var(--ic-data-table-cell-background)}.table-row:nth-child(even){background-color:var(--ic-data-table-cell-background-stripe)}.table-cell{padding:var(--ic-space-xs);border-bottom:solid var(--ic-data-table-cell-keyline) var(--ic-space-1px);overflow:hidden;box-sizing:border-box;max-width:var(--column-max-width);min-width:var(--column-min-width)}.table-cell.with-overflow{overflow:visible}.data-type-string,.data-type-address{text-align:left
|
20
|
+
const icDataTableCss = ":host{position:relative;display:inline-flex;max-height:100%;width:var(--table-width, 100%);height:100%;min-width:var(--table-min-width);max-width:var(--table-max-width)}tbody{vertical-align:top}.table-container{position:relative;height:calc(100% - var(--ic-space-xxxs));display:flex;flex-direction:column;width:100%}.cell-container{display:flex;min-height:1.5rem;overflow-y:hidden;height:var(--row-height);--ic-typography-color:var(--ic-data-table-text-default-emphasis)}.truncation-show-hide{display:block}.cell-icon.truncation-show-hide{display:flex}.cell-container:not(.data-type-element,.truncation-show-hide){overflow-x:hidden}ic-loading-indicator{position:sticky;top:20px}.table-row-container{position:relative;height:100%;overflow:auto;transition:var(--ic-easing-transition-fast);overflow-anchor:none}:host([show-pagination=\"true\"]) .table-row-container{height:calc(100% - 3.5625rem)}table{table-layout:var(--table-layout, \"fixed\");border-spacing:0;width:100%;height:var(--table-height, auto)}.table-row-container:focus{outline:none;box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast);z-index:1}:host([embedded=\"true\"]) .table-row-container{border:var(--ic-space-1px) solid var(--ic-data-table-border)}.column-header-inner-container{padding:var(--ic-space-xs);box-sizing:border-box}.column-header-inner-container ic-tooltip{pointer-events:none}.column-header-inner-container ic-tooltip.show-trunc-tooltip{pointer-events:auto}.column-header-inner-container ic-tooltip .column-header-text{--ic-line-clamp:1}.column-header-sticky{position:sticky;top:0;z-index:1}.column-header-overlay{position:sticky;top:0;z-index:1;box-shadow:0 0.375rem var(--ic-space-xs) calc(var(--ic-space-xxs * -1))\n rgb(0 0 0 / 20%)}.row-header-sticky{position:sticky;left:0}.column-header,.table-row{box-sizing:border-box}.table-row-selected{background-color:var(--ic-data-table-cell-background-selected) !important}.table-row:hover{background-color:var(--ic-data-table-cell-background-hover) !important}.table-row-selected:hover{background-color:var(\n --ic-data-table-cell-background-selected-hover\n ) !important}.sort-button{margin-left:auto}.sort-button:hover{background-color:var(--ic-data-table-icon-button-background-hover)}.sort-button:active{background-color:var(--ic-data-table-icon-button-background-pressed)}.sort-button svg{color:var(--ic-data-table-sort-toggle-icon)}.sort-button-unsorted svg{color:var(--ic-data-table-sort-toggle-icon-default)}.table-density-dense .column-header-inner-container,td.table-density-dense{padding:var(--ic-space-xxs) var(--ic-space-xs) !important}.text-dense{font-size:var(--ic-font-size-label)}.table-density-spacious .column-header-inner-container,td.table-density-spacious{padding:0.625rem var(--ic-space-xs) !important}.text-spacious{font-size:1.125rem}.column-header-text{font-weight:var(--ic-font-weight-bold)}.dummy-column-header-text{white-space:nowrap;overflow:hidden;height:0;width:-moz-fit-content;width:fit-content}.row-header,.column-header{text-align:left;padding:var(--ic-space-xs);background-color:var(--ic-data-table-header-background);border-right:var(--ic-space-1px) solid var(--ic-data-table-header-keyline);border-bottom:var(--ic-space-1px) solid var(--ic-data-table-header-keyline);color:var(--ic-data-table-header-text)}.column-header{padding:0;width:var(--column-width);min-width:var(--column-min-width, 4rem);max-width:var(--column-max-width)}.column-header:last-child{border-right:none}.scrollable .column-header:last-child{border-right:var(--ic-space-1px) solid var(--ic-data-table-header-keyline) !important}:host([embedded=\"true\"]) tr:last-child .table-cell,:host([embedded=\"true\"]) tr:last-child .row-header{border-bottom:none}.column-header-alignment-left,.row-header-alignment-left,.cell-alignment-left{text-align:left !important;justify-content:start !important}.column-header-alignment-right,.row-header-alignment-right,.cell-alignment-right{text-align:right !important;justify-content:end !important}.cell-alignment-right.truncation-tooltip ic-tooltip ic-typography{padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}.cell-alignment-right.truncation-show-hide ic-typography{--ellipsis-padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}.column-header-alignment-center,.row-header-alignment-center,.cell-alignment-center{text-align:center !important;justify-content:center !important}.table-row{background-color:var(--ic-data-table-cell-background)}.table-row:nth-child(even){background-color:var(--ic-data-table-cell-background-stripe)}.table-cell{padding:var(--ic-space-xs);border-bottom:solid var(--ic-data-table-cell-keyline) var(--ic-space-1px);overflow:hidden;box-sizing:border-box;max-width:var(--column-max-width);min-width:var(--column-min-width)}.table-cell.with-overflow{overflow:visible}.data-type-string,.data-type-address{text-align:left}.data-type-number,.data-type-date{text-align:right;justify-content:end}.cell-vertical-align-top{vertical-align:top;align-items:flex-start}.cell-vertical-align-middle{vertical-align:middle;align-items:center}.cell-vertical-align-bottom{vertical-align:bottom;align-items:flex-end}.cell-emphasis-low ic-typography{--ic-typography-color:var(--ic-data-table-text-low-emphasis)}.cell-emphasis-high ic-typography{--ic-typography-color:var(--ic-data-table-text-high-emphasis);font-weight:var(--ic-font-weight-bold)}.pagination-container{background-color:var(--ic-data-table-pagination-bar-background-color);border-top:var(--ic-space-1px) solid\n var(--ic-data-table-pagination-bar-keyline)}.screen-reader-sort-text,.table-caption{position:absolute;left:-100rem}.table-cell,.column-header,.row-header{word-wrap:break-word;white-space:pre-wrap}.loading-empty{padding:var(--ic-space-xl) var(--ic-space-xxl);margin-top:var(--ic-space-xl)}.updating-state{padding:0;border-bottom:var(--ic-space-1px) solid var(--ic-data-table-header-keyline)}.updating-state-headers{border-bottom:none}.loading{position:absolute;left:calc(50% - 5.9741rem);opacity:0;transition:opacity var(--ic-transition-duration-slow);z-index:calc(var(--ic-z-index-dialog) - 1);background-color:var(--ic-data-table-overlay-background);border:var(--ic-space-1px) solid var(--ic-data-table-overlay-border)}.loading.show{opacity:1}.icon,::slotted(svg){height:var(--ic-space-lg);width:var(--ic-space-lg);margin-right:var(--ic-space-xxs)}.column-header .icon>svg,.column-header ::slotted(svg){fill:var(--ic-data-table-icon)}.table-cell .icon>svg,.table-cell ::slotted(svg),.cell-description-icon>svg{fill:var(--ic-data-table-icon-default-emphasis)}.cell-emphasis-high .icon>svg,.cell-emphasis-high ::slotted(svg){fill:var(--ic-data-table-icon-high-emphasis)}.cell-emphasis-low .icon>svg,.cell-emphasis-low ::slotted(svg){fill:var(--ic-data-table-icon-low-emphasis)}.column-header-alignment-right>.icon,.row-header-alignment-right>.icon,.cell-alignment-right>.icon,.column-header-alignment-right>::slotted(svg),.row-header-alignment-right>::slotted(svg),.cell-alignment-right>::slotted(svg){margin-right:auto}.column-header-alignment-center>ic-typography,.column-header-alignment-center>.cell-text-wrapper,.row-header-alignment-right>ic-typography,.row-header-alignment-right>.cell-text-wrapper,.cell-alignment-center>ic-typography,.cell-alignment-center>.cell-text-wrapper{flex:1}.checkbox-cell{--column-width:var(--ic-space-xxl);align-content:center;border-right:none}.table-density-dense.checkbox-cell{--column-width:2.5rem}.checkbox-wrapper{display:flex;justify-content:center}.icon>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}.truncation-tooltip ic-typography{display:-webkit-box;-webkit-line-clamp:var(--ic-line-clamp, 0);-webkit-box-orient:vertical;overflow:hidden}.truncation-tooltip ic-typography,.truncation-show-hide ic-typography{white-space:normal}.ic-tooltip-overflow{overflow:hidden;width:100%}.action-element{display:flex;justify-content:right}.cell-grid-wrapper{display:grid;grid-template-columns:auto auto}.loading-overlay{visibility:hidden;position:absolute;top:0;left:0;width:100%;height:100%;background:var(--ic-data-table-loading-indicator-overlay-background);z-index:calc(var(--ic-z-index-dialog) - 2);opacity:0;transition:opacity var(--ic-transition-duration-slow)}.loading-overlay.show{visibility:visible;opacity:0.6}.sr-only{position:absolute;left:-9999px}@media (prefers-reduced-motion: reduce){.loading-overlay{transition:none}}.cell-text-wrapper{overflow:hidden}.cell-text-wrapper>ic-typography{margin-left:2px}.cell-text-no-wrap{word-wrap:initial}.cell-container-with-description{display:flex;flex-direction:row}.cell-description{display:flex;flex-direction:row;margin-top:var(--ic-space-xxs);word-break:break-all}.cell-description-text{color:var(--ic-data-table-cell-description-text)}.cell-description-icon{padding-right:var(--ic-space-xs)}.cell-description-icon>svg{height:calc(var(--ic-space-lg) - var(--ic-space-xxs));width:calc(var(--ic-space-lg) - var(--ic-space-xxs));display:flex}@media (min-width: 577px){.column-header-inner-container{display:flex;align-items:center}}@media (max-width: 577px){.cell-icon{flex-wrap:wrap}.cell-description-icon{padding-right:0}}@media (forced-colors: active){.icon,::slotted(svg),.cell-description-icon>svg{fill:currentcolor}.sort-button svg{color:currentcolor}.table-row-selected{background-color:Highlight !important}}";
|
21
21
|
const IcDataTableStyle0 = icDataTableCss;
|
22
22
|
|
23
23
|
const DataTable = class {
|
@@ -123,6 +123,7 @@ const DataTable = class {
|
|
123
123
|
pageLabel: "Page",
|
124
124
|
rangeLabelType: "page",
|
125
125
|
selectedItemsPerPage: 10,
|
126
|
+
selectItemsPerPageOnEnter: true,
|
126
127
|
setToFirstPageOnPaginationChange: false,
|
127
128
|
showGoToPageControl: true,
|
128
129
|
showItemsPerPageControl: true,
|
@@ -195,6 +196,176 @@ const DataTable = class {
|
|
195
196
|
};
|
196
197
|
this.getRowHeight = (cellContainer) => parseInt(getComputedStyle(document.documentElement).fontSize) *
|
197
198
|
parseFloat(cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING) || "");
|
199
|
+
this.truncateUpdatedData = () => {
|
200
|
+
if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
201
|
+
this.getTypographyElements().forEach((typographyEl) => {
|
202
|
+
const cellContainer = this.getCellContainer(typographyEl);
|
203
|
+
if (cellContainer) {
|
204
|
+
const truncWrapper = this.getTruncWrapper(typographyEl);
|
205
|
+
if (truncWrapper &&
|
206
|
+
cellContainer.clientHeight - this.DEFAULT_LINE_HEIGHT >=
|
207
|
+
truncWrapper.scrollHeight) {
|
208
|
+
this.resetSingleShowHideTruncation(typographyEl, cellContainer);
|
209
|
+
return;
|
210
|
+
}
|
211
|
+
setTimeout(() => {
|
212
|
+
// slight delay due to data rendering
|
213
|
+
this.addShowHideTruncationIfNeeded(typographyEl, cellContainer);
|
214
|
+
}, 150);
|
215
|
+
}
|
216
|
+
});
|
217
|
+
}
|
218
|
+
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
219
|
+
this.updateTruncationTooltip();
|
220
|
+
}
|
221
|
+
this.dataUpdated = false;
|
222
|
+
};
|
223
|
+
this.truncateTableSorted = () => {
|
224
|
+
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
225
|
+
this.updateTruncationTooltip();
|
226
|
+
}
|
227
|
+
if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
228
|
+
this.getTypographyElements().forEach((typographyEl) => {
|
229
|
+
const cellContainer = this.getCellContainer(typographyEl);
|
230
|
+
if (cellContainer) {
|
231
|
+
if (!cellContainer.classList.contains(this.TEXT_WRAP_STRING)) {
|
232
|
+
this.createShowHideTruncation(typographyEl, cellContainer);
|
233
|
+
}
|
234
|
+
else {
|
235
|
+
typographyEl.resetTruncation().then(() => {
|
236
|
+
cellContainer.removeAttribute("style");
|
237
|
+
});
|
238
|
+
}
|
239
|
+
}
|
240
|
+
});
|
241
|
+
}
|
242
|
+
this.tableSorted = false;
|
243
|
+
};
|
244
|
+
this.truncateRowHeightSet = () => {
|
245
|
+
// This function recalculates the tooltip truncation when the rowHeight has been set.
|
246
|
+
// This is in componentDidUpdate so a setTimeout is not used to wait for the render to be complete
|
247
|
+
this.getTypographyElements().forEach((typographyEl) => {
|
248
|
+
const cellContainer = this.getCellContainer(typographyEl);
|
249
|
+
const tooltipEl = this.getTooltip(typographyEl);
|
250
|
+
if (cellContainer) {
|
251
|
+
if (this.globalRowHeight === "auto") {
|
252
|
+
cellContainer.style.height = "";
|
253
|
+
cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, null);
|
254
|
+
cellContainer.removeAttribute(this.DATA_ROW_HEIGHT_STRING);
|
255
|
+
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
256
|
+
this.removeTooltip(cellContainer, typographyEl, tooltipEl);
|
257
|
+
typographyEl.setAttribute("style", `${this.LINE_CLAMP_CSS_VARIABLE}: 0`);
|
258
|
+
}
|
259
|
+
else if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
260
|
+
this.resetSingleShowHideTruncation(typographyEl, cellContainer);
|
261
|
+
}
|
262
|
+
return;
|
263
|
+
}
|
264
|
+
// If the set row height is bigger than the cell container even
|
265
|
+
// with textWrap, set the row height
|
266
|
+
if (!cellContainer.classList.contains(this.CELL_CONTAINER_WITH_DESCRIPTION_STRING) &&
|
267
|
+
!cellContainer.style.height &&
|
268
|
+
this.getRowHeight(cellContainer) > cellContainer.clientHeight &&
|
269
|
+
!cellContainer.classList.contains(this.TEXT_WRAP_STRING)) {
|
270
|
+
cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
|
271
|
+
}
|
272
|
+
if (this.truncationPattern) {
|
273
|
+
// If the set row height is bigger than the typography truncation wrapper
|
274
|
+
// scroll height, remove see more / see less button
|
275
|
+
if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
276
|
+
const truncWrapper = this.getTruncWrapper(typographyEl);
|
277
|
+
if (this.getShowHideButton(typographyEl) &&
|
278
|
+
truncWrapper &&
|
279
|
+
truncWrapper.scrollHeight <= cellContainer.clientHeight) {
|
280
|
+
this.resetSingleShowHideTruncation(typographyEl, cellContainer);
|
281
|
+
return;
|
282
|
+
}
|
283
|
+
}
|
284
|
+
this.truncate(typographyEl, cellContainer, tooltipEl);
|
285
|
+
}
|
286
|
+
else {
|
287
|
+
this.updateSetRowHeight(typographyEl);
|
288
|
+
}
|
289
|
+
}
|
290
|
+
});
|
291
|
+
this.rowHeightSet = false;
|
292
|
+
};
|
293
|
+
this.truncateItemsPerPageChange = () => {
|
294
|
+
var _a;
|
295
|
+
// Only run truncation on the new rows
|
296
|
+
// when the number of items per page has increased
|
297
|
+
const allRows = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll(".table-row");
|
298
|
+
if (allRows && this.rowsPerPage > this.previousItemsPerPage) {
|
299
|
+
const newRows = Array.from(allRows).slice(this.previousItemsPerPage);
|
300
|
+
newRows.forEach((row) => {
|
301
|
+
row.querySelectorAll("ic-typography").forEach((typographyEl) => {
|
302
|
+
const cellContainer = this.getCellContainer(typographyEl);
|
303
|
+
const tooltipEl = this.getTooltip(typographyEl);
|
304
|
+
if (cellContainer)
|
305
|
+
this.truncate(typographyEl, cellContainer, tooltipEl);
|
306
|
+
});
|
307
|
+
});
|
308
|
+
}
|
309
|
+
this.previousItemsPerPage = this.rowsPerPage;
|
310
|
+
this.itemsPerPageChange = false;
|
311
|
+
};
|
312
|
+
this.truncatePageChange = () => {
|
313
|
+
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
314
|
+
this.updateTruncationTooltip();
|
315
|
+
}
|
316
|
+
if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
317
|
+
// set truncation to see more if opened and next/previous page is pressed
|
318
|
+
this.getTypographyElements().forEach((typographyEl) => {
|
319
|
+
const cellContainer = this.getCellContainer(typographyEl);
|
320
|
+
if (cellContainer &&
|
321
|
+
this.typographyScrollHeightExceedsContainerHeight(typographyEl, cellContainer) &&
|
322
|
+
!this.getShowHideButton(typographyEl)) {
|
323
|
+
this.addShowHideTruncation(cellContainer, typographyEl);
|
324
|
+
}
|
325
|
+
});
|
326
|
+
}
|
327
|
+
this.icPageChangeEvent = false;
|
328
|
+
};
|
329
|
+
this.truncateDensityUpdate = () => {
|
330
|
+
this.getTypographyElements().forEach((typographyEl) => {
|
331
|
+
const cellContainer = this.getCellContainer(typographyEl);
|
332
|
+
const tooltipEl = this.getTooltip(typographyEl);
|
333
|
+
if (cellContainer)
|
334
|
+
this.truncate(typographyEl, cellContainer, tooltipEl);
|
335
|
+
});
|
336
|
+
this.densityUpdate = false;
|
337
|
+
};
|
338
|
+
this.typographyScrollHeightExceedsContainerHeight = (typographyEl, cellContainer) => cellContainer && typographyEl.scrollHeight > cellContainer.clientHeight;
|
339
|
+
this.cellContainerMinusLineHeightIsGreaterThanTruncWrapperScrollHeight = (typographyEl, cellContainer) => {
|
340
|
+
const truncWrapper = this.getTruncWrapper(typographyEl);
|
341
|
+
return (truncWrapper &&
|
342
|
+
cellContainer.clientHeight - this.DEFAULT_LINE_HEIGHT >
|
343
|
+
truncWrapper.scrollHeight);
|
344
|
+
};
|
345
|
+
this.truncatePatternUpdated = () => {
|
346
|
+
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
347
|
+
this.getTypographyElements().forEach((typographyEl) => {
|
348
|
+
const cellContainer = this.getCellContainer(typographyEl);
|
349
|
+
const tooltipEl = this.getTooltip(typographyEl);
|
350
|
+
if (cellContainer &&
|
351
|
+
this.typographyScrollHeightExceedsContainerHeight(typographyEl, cellContainer)) {
|
352
|
+
this.addTooltipTruncation(typographyEl, cellContainer, tooltipEl);
|
353
|
+
}
|
354
|
+
});
|
355
|
+
}
|
356
|
+
else if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
357
|
+
this.getTypographyElements().forEach((typographyEl) => {
|
358
|
+
const cellContainer = this.getCellContainer(typographyEl);
|
359
|
+
if (cellContainer) {
|
360
|
+
if (this.cellContainerMinusLineHeightIsGreaterThanTruncWrapperScrollHeight(typographyEl, cellContainer)) {
|
361
|
+
this.resetSingleShowHideTruncation(typographyEl, cellContainer);
|
362
|
+
return;
|
363
|
+
}
|
364
|
+
this.addShowHideTruncationIfNeeded(typographyEl, cellContainer);
|
365
|
+
}
|
366
|
+
});
|
367
|
+
}
|
368
|
+
};
|
198
369
|
this.updateSetRowHeight = (typographyEl) => {
|
199
370
|
const removeRowHeightVariable = (element) => {
|
200
371
|
const cellContainer = this.getCellContainer(element);
|
@@ -212,28 +383,10 @@ const DataTable = class {
|
|
212
383
|
});
|
213
384
|
}
|
214
385
|
};
|
215
|
-
this.debounceDataTruncation = () => {
|
216
|
-
this.getTypographyElements().forEach((typographyEl) => {
|
217
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
218
|
-
if (cellContainer &&
|
219
|
-
!cellContainer.classList.contains(this.TEXT_WRAP_STRING)) {
|
220
|
-
this.resizeObserver = new ResizeObserver(
|
221
|
-
// This gets triggered twice due to updated data and see more/see less button
|
222
|
-
helpers.dynamicDebounce(() => {
|
223
|
-
this.dataTruncation(typographyEl);
|
224
|
-
if (!this.isNewDebounceDelaySet) {
|
225
|
-
this.debounceDelay = 200;
|
226
|
-
this.isNewDebounceDelaySet = true;
|
227
|
-
}
|
228
|
-
}, () => this.debounceDelay));
|
229
|
-
this.resizeObserver.observe(typographyEl);
|
230
|
-
}
|
231
|
-
});
|
232
|
-
};
|
233
386
|
this.getLines = (height) => Math.floor(height / this.DEFAULT_LINE_HEIGHT);
|
234
387
|
this.truncate = (typographyEl, cellContainer, tooltip) => {
|
235
388
|
var _a;
|
236
|
-
if ((typographyEl
|
389
|
+
if (this.typographyScrollHeightExceedsContainerHeight(typographyEl, cellContainer)) {
|
237
390
|
//24 is the height of a single line
|
238
391
|
if (!typographyEl.closest(this.TEXT_WRAP_CLASS)) {
|
239
392
|
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
@@ -253,52 +406,49 @@ const DataTable = class {
|
|
253
406
|
}
|
254
407
|
if (this.truncationPattern === this.SHOW_HIDE_STRING &&
|
255
408
|
!helpers.isEmptyString(typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.getAttribute("max-lines"))) {
|
256
|
-
this.
|
409
|
+
this.resetSingleShowHideTruncation(typographyEl, cellContainer);
|
257
410
|
}
|
258
411
|
}
|
259
412
|
};
|
260
|
-
this.
|
261
|
-
|
413
|
+
this.addShowHideTruncationIfNeeded = (typographyEl, cellContainer) => {
|
414
|
+
if (this.typographyScrollHeightExceedsContainerHeight(typographyEl, cellContainer)) {
|
415
|
+
this.addShowHideTruncation(cellContainer, typographyEl);
|
416
|
+
return true;
|
417
|
+
}
|
418
|
+
return false;
|
419
|
+
};
|
420
|
+
this.dataTruncation = (typographyEl, cellContainer) => {
|
262
421
|
// Tooltip truncation mentioned in AC. Will need revisiting
|
263
422
|
const tooltip = this.getTooltip(typographyEl);
|
264
|
-
|
265
|
-
if (!cellContainer ||
|
266
|
-
cellContainer.classList.contains("data-type-element") ||
|
423
|
+
if (cellContainer.classList.contains("data-type-element") ||
|
267
424
|
this.dataUpdated) {
|
268
425
|
return;
|
269
426
|
}
|
270
427
|
if (this.truncationPattern === this.SHOW_HIDE_STRING &&
|
271
|
-
(
|
272
|
-
const showHideBtn = typographyEl.shadowRoot.querySelector("button");
|
428
|
+
this.getShowHideButton(typographyEl)) {
|
273
429
|
// If the see more/see less is present and the max lines is equal to the cell container
|
274
430
|
// remove the see more/see less button
|
275
|
-
|
276
|
-
|
277
|
-
|
278
|
-
|
279
|
-
|
280
|
-
this.resetShowHideTruncation(typographyEl);
|
281
|
-
}
|
431
|
+
const truncWrapper = this.getTruncWrapper(typographyEl);
|
432
|
+
if (truncWrapper &&
|
433
|
+
this.getLines(truncWrapper.scrollHeight) ===
|
434
|
+
Number(typographyEl.getAttribute("max-lines"))) {
|
435
|
+
this.resetSingleShowHideTruncation(typographyEl, cellContainer);
|
282
436
|
}
|
283
437
|
}
|
284
438
|
// Deals with setting and resetting row height and re-truncating data
|
285
439
|
if (this.rowHeightSet && this.truncationPattern === this.SHOW_HIDE_STRING) {
|
286
|
-
const truncWrapper = this.getTruncWrapper(typographyEl);
|
287
440
|
// cellContainer.clientHeight - 24 removes the extra line by see more/see less
|
288
|
-
if (
|
289
|
-
|
290
|
-
truncWrapper.scrollHeight) {
|
291
|
-
this.resetShowHideTruncation(typographyEl);
|
441
|
+
if (this.cellContainerMinusLineHeightIsGreaterThanTruncWrapperScrollHeight(typographyEl, cellContainer)) {
|
442
|
+
this.resetSingleShowHideTruncation(typographyEl, cellContainer);
|
292
443
|
return;
|
293
444
|
}
|
294
|
-
if (typographyEl
|
295
|
-
this.addShowHideTruncation(cellContainer, typographyEl);
|
445
|
+
if (this.addShowHideTruncationIfNeeded(typographyEl, cellContainer)) {
|
296
446
|
return;
|
297
447
|
}
|
298
448
|
}
|
299
|
-
if (
|
300
|
-
|
301
|
-
|
449
|
+
if (typographyEl.scrollHeight > 0 &&
|
450
|
+
cellContainer.clientHeight > 0 &&
|
451
|
+
typographyEl.scrollHeight === cellContainer.clientHeight) {
|
302
452
|
if (tooltip) {
|
303
453
|
this.removeTooltip(cellContainer, typographyEl, tooltip);
|
304
454
|
}
|
@@ -307,6 +457,7 @@ const DataTable = class {
|
|
307
457
|
this.truncate(typographyEl, cellContainer, tooltip);
|
308
458
|
};
|
309
459
|
this.getTruncWrapper = (typographyEl) => { var _a; return (_a = typographyEl.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".trunc-wrapper"); };
|
460
|
+
this.getShowHideButton = (typographyEl) => { var _a; return (_a = typographyEl.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("button"); };
|
310
461
|
this.removeTextWrap = () => {
|
311
462
|
this.getTypographyElements().forEach((typographyEl) => {
|
312
463
|
const tableCell = typographyEl.closest("td");
|
@@ -318,6 +469,37 @@ const DataTable = class {
|
|
318
469
|
this.getCellContainer = (typographyEl) => typographyEl.closest(".cell-container");
|
319
470
|
this.deleteTextWrapDataKey = (array) => Array.isArray(array) &&
|
320
471
|
array.forEach((val) => val.textWrap && delete val.textWrap);
|
472
|
+
this.resetSingleShowHideTruncation = (typographyEl, cellContainer) => {
|
473
|
+
const truncWrapper = this.getTruncWrapper(typographyEl);
|
474
|
+
if (!(cellContainer && truncWrapper))
|
475
|
+
return;
|
476
|
+
if (truncWrapper.scrollHeight > cellContainer.clientHeight &&
|
477
|
+
!helpers.isEmptyString(typographyEl.getAttribute("max-lines")) &&
|
478
|
+
Math.floor((cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) / this.DEFAULT_LINE_HEIGHT) !==
|
479
|
+
Number(typographyEl.getAttribute("max-lines"))) {
|
480
|
+
typographyEl.checkMaxLines(truncWrapper.scrollHeight);
|
481
|
+
typographyEl.setAttribute("max-lines", `${Math.floor((cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) / this.DEFAULT_LINE_HEIGHT)}`);
|
482
|
+
typographyEl.setShowHideExpanded(false);
|
483
|
+
cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, null);
|
484
|
+
}
|
485
|
+
else if (!cellContainer.classList.contains(this.CELL_CONTAINER_WITH_DESCRIPTION_STRING)) {
|
486
|
+
typographyEl.resetTruncation().then(() => {
|
487
|
+
if (!typographyEl.closest(this.TEXT_WRAP_CLASS)) {
|
488
|
+
cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
|
489
|
+
}
|
490
|
+
});
|
491
|
+
}
|
492
|
+
};
|
493
|
+
this.resetAllShowHideTruncation = () => {
|
494
|
+
this.getTypographyElements().forEach((typographyEl) => {
|
495
|
+
const cellContainer = this.getCellContainer(typographyEl);
|
496
|
+
typographyEl.resetTruncation().then(() => {
|
497
|
+
if (cellContainer && !typographyEl.closest(this.TEXT_WRAP_CLASS)) {
|
498
|
+
cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
|
499
|
+
}
|
500
|
+
});
|
501
|
+
});
|
502
|
+
};
|
321
503
|
this.startLoadingTimer = () => {
|
322
504
|
this.hasLoadedForOneSecond = false;
|
323
505
|
this.timerStarted = Date.now();
|
@@ -396,31 +578,25 @@ const DataTable = class {
|
|
396
578
|
gridWrapper.style.gridTemplateColumns = `auto calc(${width}px + var(--ic-space-xs))`;
|
397
579
|
});
|
398
580
|
};
|
399
|
-
this.createCellContent = (columnProps, cell, cellSlotName, rowOptions,
|
400
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l
|
581
|
+
this.createCellContent = (columnProps, cell, cellSlotName, rowOptions, hasIcon, cellValue, rowEmphasis, currentRowHeight) => {
|
582
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
401
583
|
return (index.h("div", { innerHTML: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) === "element" &&
|
402
584
|
!helpers.isSlotUsed(this.el, cellSlotName)
|
403
585
|
? cell
|
404
|
-
: undefined, class: Object.assign(Object.assign({ "cell-container": (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element", [`cell-alignment-${((_a = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _a === void 0 ? void 0 : _a.
|
405
|
-
((_b = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _b === void 0 ? void 0 : _b.
|
406
|
-
|
407
|
-
|
408
|
-
!!((_d = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _d === void 0 ? void 0 : _d.vertical) ||
|
409
|
-
!!rowAlignment ||
|
410
|
-
!!this.getCellAlignment(cell, "vertical"), [`cell-alignment-${((_e = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _e === void 0 ? void 0 : _e.horizontal) ||
|
411
|
-
((_f = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _f === void 0 ? void 0 : _f.horizontal) ||
|
412
|
-
this.getCellAlignment(cell, "horizontal")}`]: !!((_g = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _g === void 0 ? void 0 : _g.horizontal) ||
|
413
|
-
!!((_h = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _h === void 0 ? void 0 : _h.horizontal) ||
|
586
|
+
: undefined, class: Object.assign(Object.assign({ "cell-container": (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element", [`cell-alignment-${((_a = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _a === void 0 ? void 0 : _a.horizontal) ||
|
587
|
+
((_b = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _b === void 0 ? void 0 : _b.horizontal) ||
|
588
|
+
this.getCellAlignment(cell, "horizontal")}`]: !!((_c = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _c === void 0 ? void 0 : _c.horizontal) ||
|
589
|
+
!!((_d = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _d === void 0 ? void 0 : _d.horizontal) ||
|
414
590
|
!!this.getCellAlignment(cell, "horizontal"), [`data-type-${columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType}`]: true, [this.TEXT_WRAP_STRING]: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.textWrap) ||
|
415
591
|
(rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.textWrap) ||
|
416
|
-
!!this.getCellOptions(cell, "textWrap"), ["cell-icon"]: hasIcon || !!((
|
592
|
+
!!this.getCellOptions(cell, "textWrap"), ["cell-icon"]: hasIcon || !!((_e = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _e === void 0 ? void 0 : _e.icon), [`cell-emphasis-${(this.isObject(cell) && cellValue("emphasis")) ||
|
417
593
|
(columnProps === null || columnProps === void 0 ? void 0 : columnProps.emphasis) ||
|
418
594
|
rowEmphasis}`]: (this.isObject(cell) && !!cellValue("emphasis")) ||
|
419
595
|
!!(columnProps === null || columnProps === void 0 ? void 0 : columnProps.emphasis) ||
|
420
596
|
!!rowEmphasis }, this.setTruncationClass()), { [this.CELL_CONTAINER_WITH_DESCRIPTION_STRING]: this.isObject(cell) && Object.keys(cell).includes("description") }), style: Object.assign(Object.assign({}, this.getCalculatedRowHeight(columnProps, rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.textWrap, cell, currentRowHeight)), this.getColumnWidth(columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnWidth)), "data-row-height": this.truncationPattern || currentRowHeight
|
421
597
|
? this.setRowHeight(currentRowHeight)
|
422
|
-
: null }, helpers.isSlotUsed(this.el, cellSlotName) ? (index.h("slot", { name: cellSlotName })) : (index.h(index.Fragment, null, helpers.isSlotUsed(this.el, `${cellSlotName}-icon`) ? (index.h("slot", { name: `${cellSlotName}-icon` })) : ((hasIcon || ((
|
423
|
-
(cellValue("icon") || ((
|
598
|
+
: null }, helpers.isSlotUsed(this.el, cellSlotName) ? (index.h("slot", { name: cellSlotName })) : (index.h(index.Fragment, null, helpers.isSlotUsed(this.el, `${cellSlotName}-icon`) ? (index.h("slot", { name: `${cellSlotName}-icon` })) : ((hasIcon || ((_f = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _f === void 0 ? void 0 : _f.onAllCells)) &&
|
599
|
+
(cellValue("icon") || ((_g = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _g === void 0 ? void 0 : _g.icon)) && (index.h("span", { class: "icon", innerHTML: cellValue("icon") || ((_h = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _h === void 0 ? void 0 : _h.icon) }))), (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element" &&
|
424
600
|
!helpers.isSlotUsed(this.el, cellSlotName) && (index.h("div", { class: {
|
425
601
|
"cell-text-wrapper": true,
|
426
602
|
"cell-text-no-wrap": !this.truncationPattern,
|
@@ -435,7 +611,7 @@ const DataTable = class {
|
|
435
611
|
Object.keys(cell).includes("description") && (index.h("div", { class: {
|
436
612
|
["cell-description"]: true,
|
437
613
|
[`data-type-${columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType}`]: true,
|
438
|
-
} }, ((
|
614
|
+
} }, ((_j = cellValue("description")) === null || _j === void 0 ? void 0 : _j.icon) && (index.h("span", { class: "cell-description-icon", innerHTML: cellValue("description").icon })), index.h("ic-typography", { variant: "caption", class: "cell-description-text" }, (_l = (_k = cellValue("description")) === null || _k === void 0 ? void 0 : _k.data) !== null && _l !== void 0 ? _l : cellValue("description"))))))))));
|
439
615
|
};
|
440
616
|
this.createCells = (row, rowIndex) => {
|
441
617
|
var _a;
|
@@ -453,6 +629,7 @@ const DataTable = class {
|
|
453
629
|
? variableRowHeightVal !== "auto" && variableRowHeightVal
|
454
630
|
: this.globalRowHeight !== "auto" && this.globalRowHeight;
|
455
631
|
return this.columns.map((columnName, index$1) => {
|
632
|
+
var _a, _b, _c, _d;
|
456
633
|
const cell = this.getObjectValue(row, columnName["key"]);
|
457
634
|
const columnProps = this.columns[index$1];
|
458
635
|
const cellSlotName = `${columnProps === null || columnProps === void 0 ? void 0 : columnProps.key}-${rowIndex}`;
|
@@ -465,12 +642,19 @@ const DataTable = class {
|
|
465
642
|
["row-header-sticky"]: this.stickyRowHeaders,
|
466
643
|
} }, cellValue("title")));
|
467
644
|
}
|
468
|
-
const CellContent = this.createCellContent(columnProps, cell, cellSlotName, rowOptions,
|
645
|
+
const CellContent = this.createCellContent(columnProps, cell, cellSlotName, rowOptions, hasIcon, cellValue, rowEmphasis, currentRowHeight || undefined);
|
469
646
|
if (rowKeys[index$1] !== "rowOptions") {
|
470
647
|
return (index.h("td", { class: {
|
471
648
|
["table-cell"]: true,
|
472
649
|
[`table-density-${this.density}`]: this.notDefaultDensity(),
|
473
650
|
["with-overflow"]: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) === "element",
|
651
|
+
[`cell-vertical-align-${((_a = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _a === void 0 ? void 0 : _a.vertical) ||
|
652
|
+
((_b = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _b === void 0 ? void 0 : _b.vertical) ||
|
653
|
+
rowAlignment ||
|
654
|
+
this.getCellAlignment(cell, "vertical")}`]: !!((_c = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _c === void 0 ? void 0 : _c.vertical) ||
|
655
|
+
!!((_d = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _d === void 0 ? void 0 : _d.vertical) ||
|
656
|
+
!!rowAlignment ||
|
657
|
+
!!this.getCellAlignment(cell, "vertical"),
|
474
658
|
}, style: Object.assign({}, this.getColumnWidth(columnProps.columnWidth)) }, this.isObject(cell) &&
|
475
659
|
Object.keys(cell).includes("actionElement") ? (index.h("div", { class: "cell-grid-wrapper" }, CellContent, index.h("span", { class: "action-element", innerHTML: cellValue("actionElement"),
|
476
660
|
// eslint-disable-next-line react/jsx-no-bind
|
@@ -657,52 +841,50 @@ const DataTable = class {
|
|
657
841
|
cellContainer.setAttribute(this.DATA_ROW_HEIGHT_STRING, rowHeight.toString());
|
658
842
|
cellContainer.setAttribute("style", `${this.ROW_HEIGHT_CSS_VARIABLE}: ${rowHeight}px`);
|
659
843
|
};
|
844
|
+
this.getDescriptionHeight = (description) => {
|
845
|
+
const descriptionMarginTop = window
|
846
|
+
.getComputedStyle(description)
|
847
|
+
.getPropertyValue("margin-top");
|
848
|
+
return description.clientHeight + parseInt(descriptionMarginTop, 10);
|
849
|
+
};
|
660
850
|
/** Method to update the row heights on cells with descriptions and tooltip truncation */
|
661
851
|
this.updateCellHeightsWithDescriptions = () => {
|
662
852
|
var _a, _b;
|
853
|
+
const isXSDevice = helpers.deviceSizeMatches(helpers.IC_DEVICE_SIZES.XS);
|
663
854
|
(_b = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll(this.CELL_DESCRIPTION_STRING)) === null || _b === void 0 ? void 0 : _b.forEach((description) => {
|
664
855
|
const cellContainer = description.closest(`.${this.CELL_CONTAINER_WITH_DESCRIPTION_STRING}`);
|
665
856
|
const typography = cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.querySelector(this.IC_TYPOGRAPHY_STRING);
|
666
|
-
const descriptionMarginTop = window
|
667
|
-
.getComputedStyle(description)
|
668
|
-
.getPropertyValue("margin-top");
|
669
|
-
const descriptionHeight = description.clientHeight + parseInt(descriptionMarginTop, 10);
|
670
857
|
if (typography &&
|
671
858
|
cellContainer &&
|
672
859
|
this.globalRowHeight &&
|
673
860
|
this.globalRowHeight !== "auto") {
|
861
|
+
const descriptionHeight = this.getDescriptionHeight(description);
|
862
|
+
const descriptionHeightPlusLineHeight = descriptionHeight + this.DEFAULT_LINE_HEIGHT;
|
674
863
|
if (!typography.textContent &&
|
675
|
-
|
864
|
+
descriptionHeightPlusLineHeight > this.globalRowHeight) {
|
676
865
|
this.updateRowHeightForDescriptions(descriptionHeight, cellContainer);
|
677
866
|
}
|
678
867
|
else if (this.truncationPattern === this.TOOLTIP_STRING) {
|
679
|
-
if (
|
680
|
-
this.globalRowHeight) {
|
868
|
+
if (descriptionHeightPlusLineHeight > this.globalRowHeight) {
|
681
869
|
const cellIcon = cellContainer.querySelector(".icon");
|
682
|
-
|
870
|
+
let rowHeight = descriptionHeightPlusLineHeight;
|
871
|
+
if (cellIcon && isXSDevice) {
|
683
872
|
// recalculate descriptionHeight as when a word break occurs this value changes
|
684
873
|
// Additional spacing given for 300-400% zoom
|
685
|
-
|
686
|
-
this.DEFAULT_LINE_HEIGHT +
|
687
|
-
cellIcon.clientHeight, cellContainer);
|
688
|
-
}
|
689
|
-
else {
|
690
|
-
this.updateRowHeightForDescriptions(descriptionHeight + this.DEFAULT_LINE_HEIGHT, cellContainer);
|
874
|
+
rowHeight += cellIcon.clientHeight;
|
691
875
|
}
|
876
|
+
this.updateRowHeightForDescriptions(rowHeight, cellContainer);
|
692
877
|
}
|
693
878
|
this.addLineClampCSS(typography, cellContainer);
|
694
879
|
// Additional case for show/hide truncation for when a description is present, but the text
|
695
880
|
// isn't overflowing the cell to trigger the show more button to appear.
|
696
881
|
}
|
697
882
|
else if (this.truncationPattern === this.SHOW_HIDE_STRING &&
|
698
|
-
|
699
|
-
this.globalRowHeight &&
|
883
|
+
descriptionHeightPlusLineHeight > this.globalRowHeight &&
|
700
884
|
typography.style.getPropertyValue("--truncation-max-lines") !==
|
701
885
|
"initial") {
|
702
|
-
this.updateRowHeightForDescriptions(
|
703
|
-
|
704
|
-
this.createShowHideTruncation(typography, cellContainer, descriptionHeight);
|
705
|
-
}
|
886
|
+
this.updateRowHeightForDescriptions(descriptionHeightPlusLineHeight, cellContainer);
|
887
|
+
this.createShowHideTruncation(typography, cellContainer, descriptionHeight);
|
706
888
|
}
|
707
889
|
}
|
708
890
|
});
|
@@ -753,12 +935,7 @@ const DataTable = class {
|
|
753
935
|
this.fixCellTooltip(slottedEl);
|
754
936
|
});
|
755
937
|
});
|
756
|
-
(_d = (_c = this.el.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelectorAll(".action-element")) === null || _d === void 0 ? void 0 : _d.forEach((actionElementSpan) =>
|
757
|
-
const actionElement = actionElementSpan.firstChild;
|
758
|
-
if (actionElement) {
|
759
|
-
this.fixCellTooltip(actionElement);
|
760
|
-
}
|
761
|
-
});
|
938
|
+
(_d = (_c = this.el.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelectorAll(".action-element")) === null || _d === void 0 ? void 0 : _d.forEach((actionElementSpan) => this.fixCellTooltip(actionElementSpan));
|
762
939
|
};
|
763
940
|
this.handleClick = (event, callback) => callback(event);
|
764
941
|
this.renderTableBody = (loading, data, overlay) => {
|
@@ -858,10 +1035,19 @@ const DataTable = class {
|
|
858
1035
|
const cellContainer = this.getCellContainer(typographyEl);
|
859
1036
|
if (cellContainer &&
|
860
1037
|
!cellContainer.classList.contains(this.TEXT_WRAP_STRING)) {
|
861
|
-
this.dataTruncation(typographyEl);
|
1038
|
+
this.dataTruncation(typographyEl, cellContainer);
|
1039
|
+
this.resizeObserver = new ResizeObserver(
|
1040
|
+
// This gets triggered twice due to updated data and see more/see less button
|
1041
|
+
helpers.dynamicDebounce(() => {
|
1042
|
+
this.dataTruncation(typographyEl, cellContainer);
|
1043
|
+
if (!this.isNewDebounceDelaySet) {
|
1044
|
+
this.debounceDelay = 200;
|
1045
|
+
this.isNewDebounceDelaySet = true;
|
1046
|
+
}
|
1047
|
+
}, () => this.debounceDelay));
|
1048
|
+
this.resizeObserver.observe(typographyEl);
|
862
1049
|
}
|
863
1050
|
});
|
864
|
-
this.debounceDataTruncation();
|
865
1051
|
}
|
866
1052
|
if (this.globalRowHeight !== "auto") {
|
867
1053
|
this.updateSetRowHeight();
|
@@ -873,188 +1059,34 @@ const DataTable = class {
|
|
873
1059
|
// rendered to take into account updated .cell-container/ic-typography box model updates.
|
874
1060
|
if (this.truncationPattern === this.SHOW_HIDE_STRING ||
|
875
1061
|
this.truncationPattern === this.TOOLTIP_STRING) {
|
876
|
-
this.
|
877
|
-
|
878
|
-
}
|
879
|
-
componentDidRender() {
|
880
|
-
this.fixCellTooltips();
|
881
|
-
this.updateCellHeightsWithDescriptions();
|
882
|
-
this.adjustWidthForActionElement();
|
883
|
-
}
|
884
|
-
truncateUpdatedData() {
|
885
|
-
var _a;
|
886
|
-
if (this.dataUpdated) {
|
887
|
-
if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
888
|
-
this.getTypographyElements().forEach((typographyEl) => {
|
889
|
-
const truncWrapper = this.getTruncWrapper(typographyEl);
|
890
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
891
|
-
if (truncWrapper &&
|
892
|
-
cellContainer &&
|
893
|
-
cellContainer.clientHeight - this.DEFAULT_LINE_HEIGHT >=
|
894
|
-
truncWrapper.scrollHeight) {
|
895
|
-
this.resetShowHideTruncation(typographyEl);
|
896
|
-
return;
|
897
|
-
}
|
898
|
-
setTimeout(() => {
|
899
|
-
// slight delay due to data rendering
|
900
|
-
if (cellContainer &&
|
901
|
-
typographyEl.scrollHeight > cellContainer.clientHeight) {
|
902
|
-
this.addShowHideTruncation(cellContainer, typographyEl);
|
903
|
-
}
|
904
|
-
}, 150);
|
905
|
-
});
|
906
|
-
}
|
907
|
-
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
908
|
-
this.updateTruncationTooltip();
|
1062
|
+
if (this.dataUpdated) {
|
1063
|
+
this.truncateUpdatedData();
|
909
1064
|
}
|
910
|
-
this.
|
911
|
-
|
912
|
-
if (this.tableSorted) {
|
913
|
-
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
914
|
-
this.updateTruncationTooltip();
|
915
|
-
}
|
916
|
-
if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
917
|
-
this.getTypographyElements().forEach((typographyEl) => {
|
918
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
919
|
-
if (cellContainer) {
|
920
|
-
if (!cellContainer.classList.contains(this.TEXT_WRAP_STRING)) {
|
921
|
-
this.createShowHideTruncation(typographyEl, cellContainer);
|
922
|
-
}
|
923
|
-
else {
|
924
|
-
typographyEl.resetTruncation().then(() => {
|
925
|
-
cellContainer.removeAttribute("style");
|
926
|
-
});
|
927
|
-
}
|
928
|
-
}
|
929
|
-
});
|
1065
|
+
if (this.tableSorted) {
|
1066
|
+
this.truncateTableSorted();
|
930
1067
|
}
|
931
|
-
this.
|
932
|
-
|
933
|
-
// This function recalculates the tooltip truncation when the rowHeight has been set.
|
934
|
-
// This is in componentDidUpdate so a setTimeout is not used to wait for the render to be complete
|
935
|
-
if (this.rowHeightSet) {
|
936
|
-
this.getTypographyElements().forEach((typographyEl) => {
|
937
|
-
var _a, _b;
|
938
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
939
|
-
const tooltipEl = this.getTooltip(typographyEl);
|
940
|
-
if (cellContainer) {
|
941
|
-
if (this.globalRowHeight === "auto") {
|
942
|
-
cellContainer.style.height = "";
|
943
|
-
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
944
|
-
this.removeTooltip(cellContainer, typographyEl, tooltipEl);
|
945
|
-
typographyEl.setAttribute("style", `${this.LINE_CLAMP_CSS_VARIABLE}: 0`);
|
946
|
-
}
|
947
|
-
else if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
948
|
-
this.resetShowHideTruncation(typographyEl);
|
949
|
-
}
|
950
|
-
return;
|
951
|
-
}
|
952
|
-
// If the set row height is bigger than the cell container even
|
953
|
-
// with textWrap, set the row height
|
954
|
-
if (!cellContainer.classList.contains(this.CELL_CONTAINER_WITH_DESCRIPTION_STRING) &&
|
955
|
-
!((_a = cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.style) === null || _a === void 0 ? void 0 : _a.height) &&
|
956
|
-
this.getRowHeight(cellContainer) > cellContainer.clientHeight &&
|
957
|
-
!cellContainer.classList.contains(this.TEXT_WRAP_STRING)) {
|
958
|
-
cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
|
959
|
-
}
|
960
|
-
if (this.truncationPattern) {
|
961
|
-
// If the set row height is bigger than the typography truncation wrapper
|
962
|
-
// scroll height, remove see more / see less button
|
963
|
-
if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
964
|
-
const truncWrapper = this.getTruncWrapper(typographyEl);
|
965
|
-
const showHideBtn = (_b = typographyEl.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector("button");
|
966
|
-
if (showHideBtn &&
|
967
|
-
truncWrapper &&
|
968
|
-
truncWrapper.scrollHeight <= cellContainer.clientHeight) {
|
969
|
-
this.resetShowHideTruncation(typographyEl);
|
970
|
-
return;
|
971
|
-
}
|
972
|
-
}
|
973
|
-
this.truncate(typographyEl, cellContainer, tooltipEl);
|
974
|
-
}
|
975
|
-
else {
|
976
|
-
this.updateSetRowHeight(typographyEl);
|
977
|
-
}
|
978
|
-
}
|
979
|
-
});
|
980
|
-
this.rowHeightSet = false;
|
981
|
-
}
|
982
|
-
// Only run truncation on the new rows
|
983
|
-
// when the number of items per page has increased
|
984
|
-
if (this.itemsPerPageChange) {
|
985
|
-
const allRows = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll(".table-row");
|
986
|
-
if (allRows && this.rowsPerPage > this.previousItemsPerPage) {
|
987
|
-
const newRows = Array.from(allRows).slice(this.previousItemsPerPage);
|
988
|
-
newRows.forEach((row) => {
|
989
|
-
row.querySelectorAll("ic-typography").forEach((typographyEl) => {
|
990
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
991
|
-
const tooltipEl = this.getTooltip(typographyEl);
|
992
|
-
if (cellContainer)
|
993
|
-
this.truncate(typographyEl, cellContainer, tooltipEl);
|
994
|
-
});
|
995
|
-
});
|
1068
|
+
if (this.rowHeightSet) {
|
1069
|
+
this.truncateRowHeightSet();
|
996
1070
|
}
|
997
|
-
this.
|
998
|
-
|
999
|
-
}
|
1000
|
-
if (!this.initialLoad && this.icPageChangeEvent) {
|
1001
|
-
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
1002
|
-
this.updateTruncationTooltip();
|
1071
|
+
if (this.itemsPerPageChange) {
|
1072
|
+
this.truncateItemsPerPageChange();
|
1003
1073
|
}
|
1004
|
-
|
1005
|
-
|
1006
|
-
this.getTypographyElements().forEach((typographyEl) => {
|
1007
|
-
var _a;
|
1008
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
1009
|
-
const showHideBtn = (_a = typographyEl.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("button");
|
1010
|
-
if (cellContainer &&
|
1011
|
-
(typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.scrollHeight) > cellContainer.clientHeight &&
|
1012
|
-
!showHideBtn) {
|
1013
|
-
this.addShowHideTruncation(cellContainer, typographyEl);
|
1014
|
-
}
|
1015
|
-
});
|
1074
|
+
if (!this.initialLoad && this.icPageChangeEvent) {
|
1075
|
+
this.truncatePageChange();
|
1016
1076
|
}
|
1017
|
-
this.
|
1018
|
-
|
1019
|
-
if (this.densityUpdate) {
|
1020
|
-
this.getTypographyElements().forEach((typographyEl) => {
|
1021
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
1022
|
-
const tooltipEl = this.getTooltip(typographyEl);
|
1023
|
-
if (cellContainer)
|
1024
|
-
this.truncate(typographyEl, cellContainer, tooltipEl);
|
1025
|
-
});
|
1026
|
-
this.densityUpdate = false;
|
1027
|
-
}
|
1028
|
-
if (this.truncationPatternUpdated) {
|
1029
|
-
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
1030
|
-
this.getTypographyElements().forEach((typographyEl) => {
|
1031
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
1032
|
-
const tooltipEl = this.getTooltip(typographyEl);
|
1033
|
-
if (cellContainer &&
|
1034
|
-
typographyEl.scrollHeight > cellContainer.clientHeight) {
|
1035
|
-
this.addTooltipTruncation(typographyEl, cellContainer, tooltipEl);
|
1036
|
-
}
|
1037
|
-
});
|
1077
|
+
if (this.densityUpdate) {
|
1078
|
+
this.truncateDensityUpdate();
|
1038
1079
|
}
|
1039
|
-
|
1040
|
-
this.
|
1041
|
-
const truncWrapper = this.getTruncWrapper(typographyEl);
|
1042
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
1043
|
-
if (cellContainer) {
|
1044
|
-
if (truncWrapper &&
|
1045
|
-
(cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) - this.DEFAULT_LINE_HEIGHT >
|
1046
|
-
truncWrapper.scrollHeight) {
|
1047
|
-
this.resetShowHideTruncation(typographyEl);
|
1048
|
-
return;
|
1049
|
-
}
|
1050
|
-
if ((typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.scrollHeight) > (cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight)) {
|
1051
|
-
this.addShowHideTruncation(cellContainer, typographyEl);
|
1052
|
-
}
|
1053
|
-
}
|
1054
|
-
});
|
1080
|
+
if (this.truncationPatternUpdated) {
|
1081
|
+
this.truncatePatternUpdated();
|
1055
1082
|
}
|
1056
1083
|
}
|
1057
1084
|
}
|
1085
|
+
componentDidRender() {
|
1086
|
+
this.fixCellTooltips();
|
1087
|
+
this.updateCellHeightsWithDescriptions();
|
1088
|
+
this.adjustWidthForActionElement();
|
1089
|
+
}
|
1058
1090
|
createShowHideTruncation(typographyEl, cellContainer, descriptionHeight = 0) {
|
1059
1091
|
typographyEl.checkMaxLines(typographyEl.scrollHeight);
|
1060
1092
|
typographyEl.setAttribute("max-lines", `${this.getLines(cellContainer.clientHeight - descriptionHeight)}`);
|
@@ -1118,18 +1150,17 @@ const DataTable = class {
|
|
1118
1150
|
handleDensityChange(ev) {
|
1119
1151
|
this.density = ev.detail.value;
|
1120
1152
|
}
|
1121
|
-
loadingHandler(
|
1122
|
-
if (newValue)
|
1123
|
-
this.startLoadingTimer();
|
1153
|
+
loadingHandler() {
|
1124
1154
|
if (this.loading) {
|
1155
|
+
this.startLoadingTimer();
|
1125
1156
|
setTimeout(() => {
|
1126
1157
|
this.showLoadingIndicator();
|
1127
1158
|
}, 500);
|
1128
1159
|
}
|
1129
1160
|
}
|
1130
|
-
truncationPatternHandler(
|
1131
|
-
if (
|
1132
|
-
this.
|
1161
|
+
truncationPatternHandler() {
|
1162
|
+
if (this.truncationPattern === this.TOOLTIP_STRING) {
|
1163
|
+
this.resetAllShowHideTruncation();
|
1133
1164
|
this.updateTruncationTooltip(true);
|
1134
1165
|
// Not using debounceDataTruncation here due to resizeObserver not being triggered
|
1135
1166
|
this.getTypographyElements().forEach((typographyEl) => {
|
@@ -1139,25 +1170,20 @@ const DataTable = class {
|
|
1139
1170
|
this.truncate(typographyEl, cellContainer, tooltip);
|
1140
1171
|
});
|
1141
1172
|
}
|
1142
|
-
if (
|
1173
|
+
else if (this.truncationPattern === this.SHOW_HIDE_STRING) {
|
1143
1174
|
// ResizeObserver is trigger here due to the see more/see less links being removed.
|
1144
1175
|
// The resizeObserver will also apply the tooltip where relevant
|
1145
1176
|
this.updateTruncationTooltip(true);
|
1146
1177
|
this.getTypographyElements().forEach((typographyEl) => {
|
1147
|
-
const truncWrapper = this.getTruncWrapper(typographyEl);
|
1148
1178
|
const cellContainer = this.getCellContainer(typographyEl);
|
1149
1179
|
if (cellContainer) {
|
1150
|
-
if (
|
1151
|
-
|
1152
|
-
truncWrapper.scrollHeight) {
|
1153
|
-
this.resetShowHideTruncation(typographyEl);
|
1180
|
+
if (this.cellContainerMinusLineHeightIsGreaterThanTruncWrapperScrollHeight(typographyEl, cellContainer)) {
|
1181
|
+
this.resetSingleShowHideTruncation(typographyEl, cellContainer);
|
1154
1182
|
return;
|
1155
1183
|
}
|
1156
1184
|
setTimeout(() => {
|
1157
1185
|
// slight delay due to data rendering
|
1158
|
-
|
1159
|
-
this.addShowHideTruncation(cellContainer, typographyEl);
|
1160
|
-
}
|
1186
|
+
this.addShowHideTruncationIfNeeded(typographyEl, cellContainer);
|
1161
1187
|
}, 150);
|
1162
1188
|
}
|
1163
1189
|
});
|
@@ -1179,40 +1205,6 @@ const DataTable = class {
|
|
1179
1205
|
async densityHandler() {
|
1180
1206
|
this.densityUpdate = true;
|
1181
1207
|
}
|
1182
|
-
resetShowHideTruncation(typographyEl) {
|
1183
|
-
if (typographyEl) {
|
1184
|
-
const truncWrapper = this.getTruncWrapper(typographyEl);
|
1185
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
1186
|
-
if (!(cellContainer && truncWrapper))
|
1187
|
-
return;
|
1188
|
-
if (truncWrapper.scrollHeight > cellContainer.clientHeight &&
|
1189
|
-
!helpers.isEmptyString(typographyEl.getAttribute("max-lines")) &&
|
1190
|
-
Math.floor((cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) / this.DEFAULT_LINE_HEIGHT) !==
|
1191
|
-
Number(typographyEl.getAttribute("max-lines"))) {
|
1192
|
-
typographyEl.checkMaxLines(truncWrapper.scrollHeight);
|
1193
|
-
typographyEl.setAttribute("max-lines", `${Math.floor((cellContainer === null || cellContainer === void 0 ? void 0 : cellContainer.clientHeight) / this.DEFAULT_LINE_HEIGHT)}`);
|
1194
|
-
typographyEl.setShowHideExpanded(false);
|
1195
|
-
cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, null);
|
1196
|
-
}
|
1197
|
-
else if (!cellContainer.classList.contains(this.CELL_CONTAINER_WITH_DESCRIPTION_STRING)) {
|
1198
|
-
typographyEl.resetTruncation().then(() => {
|
1199
|
-
if (!typographyEl.closest(this.TEXT_WRAP_CLASS)) {
|
1200
|
-
cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
|
1201
|
-
}
|
1202
|
-
});
|
1203
|
-
}
|
1204
|
-
}
|
1205
|
-
else {
|
1206
|
-
this.getTypographyElements().forEach((typographyEl) => {
|
1207
|
-
const cellContainer = this.getCellContainer(typographyEl);
|
1208
|
-
typographyEl.resetTruncation().then(() => {
|
1209
|
-
if (cellContainer && !typographyEl.closest(this.TEXT_WRAP_CLASS)) {
|
1210
|
-
cellContainer.style.setProperty(this.ROW_HEIGHT_CSS_VARIABLE, cellContainer.getAttribute(this.DATA_ROW_HEIGHT_STRING));
|
1211
|
-
}
|
1212
|
-
});
|
1213
|
-
});
|
1214
|
-
}
|
1215
|
-
}
|
1216
1208
|
rowHeightChangeHandler(newValue, oldValue) {
|
1217
1209
|
if (+newValue !== +oldValue) {
|
1218
1210
|
this.deleteTextWrapDataKey(this.data);
|
@@ -1311,22 +1303,22 @@ const DataTable = class {
|
|
1311
1303
|
? "deselect all"
|
1312
1304
|
: "select all remaining"
|
1313
1305
|
: "select all";
|
1314
|
-
return (index.h(index.Host, { key: '
|
1306
|
+
return (index.h(index.Host, { key: '2b548f8d26428034d51e7475883d6e7b407f28ec', style: Object.assign({}, this.setTableDimensions()), class: { [`ic-theme-${theme}`]: theme !== "inherit" } }, index.h("div", { key: '5663c5ce124cf6f67435a8d18ddda4bc63a88e4f', class: "table-container" }, helpers.isSlotUsed(this.el, "title-bar") && index.h("slot", { key: '1ea59340e9633ca9a2f6d9fdba53d734050ddf84', name: "title-bar" }), index.h("div", { key: 'f2aef7502ca0c4124bf70b0fb4173e29b892004b', class: {
|
1315
1307
|
["table-row-container"]: true,
|
1316
1308
|
scrollable,
|
1317
|
-
}, tabIndex: scrollable ? 0 : undefined, onScroll: updateScrollOffset }, index.h("table", { key: '
|
1309
|
+
}, tabIndex: scrollable ? 0 : undefined, onScroll: updateScrollOffset }, index.h("table", { key: '061ab3f20e857b05a4cd668656b0a730f1d0645a', style: {
|
1318
1310
|
"--table-layout": tableLayout,
|
1319
|
-
} }, index.h("caption", { key: '
|
1311
|
+
} }, index.h("caption", { key: '727550fa24947c102cd231b1a4e262ffcba6e3b3', class: "table-caption" }, caption), !hideColumnHeaders && (index.h("thead", { key: 'c07fa1fddf4fa8364c52444a3cc8df0d1bdaabaf', class: {
|
1320
1312
|
["column-header-sticky"]: stickyColumnHeaders,
|
1321
1313
|
["column-header-overlay"]: stickyColumnHeaders && scrollOffset !== 0,
|
1322
|
-
} }, index.h("tr", { key: '
|
1314
|
+
} }, index.h("tr", { key: '01735185f99abdd22a71edcaf944642d6e2c45de' }, rowSelection && data && (index.h("th", { key: '40c7157f3f3e45b6e9a9a0dfc65e2374526e150d', class: {
|
1323
1315
|
"column-header": true,
|
1324
1316
|
"checkbox-cell": true,
|
1325
1317
|
"updating-state-headers": updating && !loading,
|
1326
1318
|
[`table-density-${density}`]: this.notDefaultDensity(),
|
1327
|
-
} }, index.h("div", { key: '
|
1319
|
+
} }, index.h("div", { key: '8d53b98f553294d9b2b9483f4ed001da905fcff4', class: "checkbox-wrapper" }, index.h("ic-checkbox", { key: 'b08cd440baff49256037e3ca3d27059a64c19d98', class: "ic-data-table-checkbox", checked: rowsSelected && allRowsSelected, disabled: updating || loading, hideLabel: true, indeterminate: rowsSelected && !allRowsSelected, label: `${caption} ${headerCheckboxLabelState} rows`, nativeIndeterminateBehaviour: true, onIcCheck: () => selectAllRows(), size: density === "dense" ? "small" : "medium", value: caption })))), createColumnHeaders()))), updating &&
|
1328
1320
|
!loading &&
|
1329
|
-
(hideColumnHeaders ? (index.h("thead", null, createUpdatingIndicator())) : (createUpdatingIndicator())), this.renderTableBody(loading, data, loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.overlay)), this.renderEmptyState(loading, data, loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.overlay)), index.h("div", { key: '
|
1321
|
+
(hideColumnHeaders ? (index.h("thead", null, createUpdatingIndicator())) : (createUpdatingIndicator())), this.renderTableBody(loading, data, loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.overlay)), this.renderEmptyState(loading, data, loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.overlay)), index.h("div", { key: '8ddc07463825ac2c637cf7f413840acc2662d2c2', "aria-live": "assertive", class: "sr-only" }, this.renderAriaLiveLoading()), this.renderLoadingIndicator(loading, loadingOptions), (showPagination || helpers.isSlotUsed(this.el, "pagination-bar")) && (index.h("div", { key: 'd619ff136af4258047c21f7ea83ad8dd9ec77873', class: "pagination-container" }, helpers.isSlotUsed(this.el, "pagination-bar") ? (index.h("slot", { name: "pagination-bar" })) : (index.h("ic-pagination-bar", { alignment: paginationBarOptions.alignment, hideAllFromItemsPerPage: paginationBarOptions.hideAllFromItemsPerPage, hideRangeLabel: paginationBarOptions.hideRangeLabel, itemLabel: paginationBarOptions.itemLabel, itemsPerPageOptions: paginationBarOptions.itemsPerPageOptions, monochrome: paginationBarOptions.monochrome, pageLabel: paginationBarOptions.pageLabel, rangeLabelType: paginationBarOptions.rangeLabelType, selectedItemsPerPage: paginationBarOptions.selectedItemsPerPage, selectItemsPerPageOnEnter: paginationBarOptions.selectItemsPerPageOnEnter, setToFirstPageOnPaginationChange: paginationBarOptions.setToFirstPageOnPaginationChange, showGoToPageControl: paginationBarOptions.showGoToPageControl, showItemsPerPageControl: paginationBarOptions.showItemsPerPageControl, theme: theme, totalItems: (_a = data === null || data === void 0 ? void 0 : data.length) !== null && _a !== void 0 ? _a : 0, type: paginationBarOptions.type })))), sortable && (index.h("div", { key: 'f0a61b27a9e5dda26ed7c7ad0b4b7cadb0d910d7', class: "screen-reader-sort-text", "aria-live": "polite" }, sortedColumnOrder !== "unsorted" && sortedColumn
|
1330
1322
|
? `${((_b = columns.find((col) => col.key === sortedColumn)) === null || _b === void 0 ? void 0 : _b.title) ||
|
1331
1323
|
sortedColumn} sorted ${sortedColumnOrder}`
|
1332
1324
|
: "table unsorted")))));
|