@govbr-ds/webcomponents 2.5.0 → 2.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cem/custom-elements.json +4228 -996
- package/cem/webcomponents.html-custom-data.json +354 -48
- package/dist/cjs/br-avatar.cjs.entry.js +2 -2
- package/dist/cjs/br-breadcrumb-item.cjs.entry.js +1 -1
- package/dist/cjs/br-breadcrumb.cjs.entry.js +11 -11
- package/dist/cjs/br-button_2.cjs.entry.js +5 -5
- package/dist/cjs/br-card.cjs.entry.js +2 -2
- package/dist/cjs/br-carousel-page.cjs.entry.js +2 -2
- package/dist/cjs/br-carousel.cjs.entry.js +5 -5
- package/dist/cjs/br-checkbox-group.cjs.entry.js +2 -2
- package/dist/cjs/br-checkbox.cjs.entry.js +2 -2
- package/dist/cjs/br-checkgroup.cjs.entry.js +1 -1
- package/dist/cjs/br-collapse_2.cjs.entry.js +8 -8
- package/dist/cjs/br-cookiebar-cookie.cjs.entry.js +2 -2
- package/dist/cjs/br-cookiebar-group.cjs.entry.js +4 -4
- package/dist/cjs/br-cookiebar-header.cjs.entry.js +2 -2
- package/dist/cjs/br-cookiebar-link.cjs.entry.js +3 -3
- package/dist/cjs/br-cookiebar-note-group.cjs.entry.js +3 -3
- package/dist/cjs/br-cookiebar-note.cjs.entry.js +2 -2
- package/dist/cjs/br-cookiebar.cjs.entry.js +5 -5
- package/dist/cjs/br-crumb.cjs.entry.js +1 -1
- package/dist/cjs/br-date-picker_3.cjs.entry.js +14 -14
- package/dist/cjs/br-datetime-picker.cjs.entry.js +6 -23
- package/dist/cjs/br-divider.cjs.entry.js +2 -2
- package/dist/cjs/br-dropdown.cjs.entry.js +677 -0
- package/dist/cjs/br-footer-category.cjs.entry.js +2 -2
- package/dist/cjs/br-footer-item.cjs.entry.js +2 -2
- package/dist/cjs/br-footer-legal.cjs.entry.js +2 -2
- package/dist/cjs/br-footer-logo.cjs.entry.js +2 -2
- package/dist/cjs/br-footer-social.cjs.entry.js +3 -3
- package/dist/cjs/br-footer.cjs.entry.js +2 -2
- package/dist/cjs/br-header-function.cjs.entry.js +2 -2
- package/dist/cjs/br-header-link.cjs.entry.js +2 -2
- package/dist/cjs/br-header-list.cjs.entry.js +4 -4
- package/dist/cjs/br-header-logo.cjs.entry.js +2 -2
- package/dist/cjs/br-header.cjs.entry.js +6 -6
- package/dist/cjs/br-icon.cjs.entry.js +172 -158
- package/dist/cjs/br-input_2.cjs.entry.js +1427 -0
- package/dist/cjs/br-item.cjs.entry.js +2 -2
- package/dist/cjs/br-link.cjs.entry.js +2 -2
- package/dist/cjs/br-magic-button.cjs.entry.js +11 -12
- package/dist/cjs/br-menu-group.cjs.entry.js +2 -2
- package/dist/cjs/br-menu-header.cjs.entry.js +3 -3
- package/dist/cjs/br-menu-info.cjs.entry.js +2 -2
- package/dist/cjs/br-menu-item.cjs.entry.js +3 -3
- package/dist/cjs/br-menu-link.cjs.entry.js +3 -3
- package/dist/cjs/br-menu-list.cjs.entry.js +2 -2
- package/dist/cjs/br-menu-logo.cjs.entry.js +2 -2
- package/dist/cjs/br-menu-social.cjs.entry.js +2 -2
- package/dist/cjs/br-menu.cjs.entry.js +5 -5
- package/dist/cjs/br-modal.cjs.entry.js +2 -2
- package/dist/cjs/br-notification-body.cjs.entry.js +2 -2
- package/dist/cjs/br-notification-header.cjs.entry.js +2 -2
- package/dist/cjs/br-notification-item.cjs.entry.js +2 -2
- package/dist/cjs/br-notification.cjs.entry.js +2 -2
- package/dist/cjs/{br-dropdown_2.cjs.entry.js → br-pagination_2.cjs.entry.js} +812 -557
- package/dist/cjs/br-radio-group.cjs.entry.js +2 -2
- package/dist/cjs/br-radio.cjs.entry.js +2 -2
- package/dist/cjs/br-scrim.cjs.entry.js +2 -2
- package/dist/cjs/br-select-input_3.cjs.entry.js +16 -93
- package/dist/cjs/br-sign-in.cjs.entry.js +3 -3
- package/dist/cjs/br-skip-link-item.cjs.entry.js +1 -1
- package/dist/cjs/br-skip-link.cjs.entry.js +2 -2
- package/dist/cjs/br-skiplink-item.cjs.entry.js +2 -2
- package/dist/cjs/br-slider.cjs.entry.js +3 -3
- package/dist/cjs/br-step_2.cjs.entry.js +3 -3
- package/dist/cjs/br-switch.cjs.entry.js +2 -2
- package/dist/cjs/br-tab-item.cjs.entry.js +3 -3
- package/dist/cjs/br-tab.cjs.entry.js +7 -7
- package/dist/cjs/br-table-action_6.cjs.entry.js +1500 -0
- package/dist/cjs/br-table-body.cjs.entry.js +4 -16
- package/dist/cjs/br-table-header.cjs.entry.js +4 -16
- package/dist/cjs/br-table.cjs.entry.js +2616 -433
- package/dist/cjs/br-tag.cjs.entry.js +4 -4
- package/dist/cjs/br-textarea.cjs.entry.js +3 -3
- package/dist/cjs/br-tooltip.cjs.entry.js +5 -29
- package/dist/cjs/br-upload.cjs.entry.js +4 -4
- package/dist/cjs/br-wizard-panel.cjs.entry.js +3 -3
- package/dist/cjs/br-wizard.cjs.entry.js +3 -3
- package/dist/cjs/helpers-DkkDubv1.js +28 -0
- package/dist/cjs/{icon.utils-DF6kMskA.js → icon.utils-CMs0ukvR.js} +1 -1
- package/dist/cjs/{index-Bc30P_6z.js → index-BP8UIQro.js} +34 -34
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/table.utils-De-9_NgJ.js +749 -0
- package/dist/cjs/webcomponents.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +3 -0
- package/dist/collection/components/avatar/avatar.css +1 -1
- package/dist/collection/components/breadcrumb/breadcrumb.css +1 -1
- package/dist/collection/components/breadcrumb/breadcrumb.js +9 -9
- package/dist/collection/components/button/button.css +1 -1
- package/dist/collection/components/button/button.js +2 -2
- package/dist/collection/components/card/card.css +1 -1
- package/dist/collection/components/carousel/carousel-page/carousel-page.css +1 -1
- package/dist/collection/components/carousel/carousel.css +1 -1
- package/dist/collection/components/carousel/carousel.js +3 -3
- package/dist/collection/components/checkbox/checkbox.css +1 -1
- package/dist/collection/components/checkbox-group/checkbox-group.css +1 -1
- package/dist/collection/components/collapse/collapse.css +1 -1
- package/dist/collection/components/collapse/collapse.js +9 -9
- package/dist/collection/components/cookiebar/cookiebar-cookie/cookiebar-cookie.css +1 -1
- package/dist/collection/components/cookiebar/cookiebar-group/cookiebar-group.css +1 -1
- package/dist/collection/components/cookiebar/cookiebar-group/cookiebar-group.js +2 -2
- package/dist/collection/components/cookiebar/cookiebar-header/cookiebar-header.css +1 -1
- package/dist/collection/components/cookiebar/cookiebar-link/cookiebar-link.css +1 -1
- package/dist/collection/components/cookiebar/cookiebar-link/cookiebar-link.js +1 -1
- package/dist/collection/components/cookiebar/cookiebar-note/cookiebar-note.css +1 -1
- package/dist/collection/components/cookiebar/cookiebar-note-group/cookiebar-note-group.css +1 -1
- package/dist/collection/components/cookiebar/cookiebar-note-group/cookiebar-note-group.js +1 -1
- package/dist/collection/components/cookiebar/cookiebar.css +1 -1
- package/dist/collection/components/cookiebar/cookiebar.js +3 -3
- package/dist/collection/components/datetime-picker/date-picker/date-picker.css +1 -1
- package/dist/collection/components/datetime-picker/date-picker/date-picker.js +4 -4
- package/dist/collection/components/datetime-picker/datetime-input/datetime-input.css +1 -1
- package/dist/collection/components/datetime-picker/datetime-input/datetime-input.js +3 -3
- package/dist/collection/components/datetime-picker/datetime-picker.css +1 -1
- package/dist/collection/components/datetime-picker/datetime-picker.utils.js +6 -6
- package/dist/collection/components/datetime-picker/time-picker/time-picker.css +1 -1
- package/dist/collection/components/datetime-picker/time-picker/time-picker.js +3 -3
- package/dist/collection/components/divider/divider.css +1 -1
- package/dist/collection/components/dropdown/dropdown.css +1 -1
- package/dist/collection/components/dropdown/dropdown.js +6 -8
- package/dist/collection/components/footer/footer-category/footer-category.css +1 -1
- package/dist/collection/components/footer/footer-item/footer-item.css +1 -1
- package/dist/collection/components/footer/footer-legal/footer-legal.css +1 -1
- package/dist/collection/components/footer/footer-logo/footer-logo.css +1 -1
- package/dist/collection/components/footer/footer-social/footer-social.css +1 -1
- package/dist/collection/components/footer/footer-social/footer-social.js +2 -2
- package/dist/collection/components/footer/footer.css +1 -1
- package/dist/collection/components/header/header-function/header-function.css +1 -1
- package/dist/collection/components/header/header-link/header-link.css +1 -1
- package/dist/collection/components/header/header-list/header-list.css +1 -1
- package/dist/collection/components/header/header-list/header-list.js +2 -2
- package/dist/collection/components/header/header-logo/header-logo.css +1 -1
- package/dist/collection/components/header/header.css +1 -1
- package/dist/collection/components/header/header.js +4 -4
- package/dist/collection/components/icon/default-icons-cache.js +159 -146
- package/dist/collection/components/icon/icon.css +1 -1
- package/dist/collection/components/icon/icon.js +17 -13
- package/dist/collection/components/icon/icon.utils.js +1 -1
- package/dist/collection/components/input/input.css +1 -1
- package/dist/collection/components/input/input.js +120 -2
- package/dist/collection/components/item/item.css +1 -1
- package/dist/collection/components/link/link.css +1 -1
- package/dist/collection/components/list/list.css +1 -1
- package/dist/collection/components/loading/loading.css +1 -1
- package/dist/collection/components/magic-button/magic-button.css +1 -1
- package/dist/collection/components/magic-button/magic-button.js +11 -12
- package/dist/collection/components/menu/menu-group/menu-group.css +1 -1
- package/dist/collection/components/menu/menu-header/menu-header.css +1 -1
- package/dist/collection/components/menu/menu-header/menu-header.js +1 -1
- package/dist/collection/components/menu/menu-info/menu-info.css +1 -1
- package/dist/collection/components/menu/menu-item/menu-item.css +1 -1
- package/dist/collection/components/menu/menu-item/menu-item.js +1 -1
- package/dist/collection/components/menu/menu-link/menu-link.css +1 -1
- package/dist/collection/components/menu/menu-link/menu-link.js +1 -1
- package/dist/collection/components/menu/menu-list/menu-list.css +1 -1
- package/dist/collection/components/menu/menu-logo/menu-logo.css +1 -1
- package/dist/collection/components/menu/menu-social/menu-social.css +1 -1
- package/dist/collection/components/menu/menu-social/menu-social.js +1 -1
- package/dist/collection/components/menu/menu.css +1 -1
- package/dist/collection/components/menu/menu.js +3 -3
- package/dist/collection/components/message/message.css +1 -1
- package/dist/collection/components/modal/modal.css +1 -1
- package/dist/collection/components/notification/notification-body/notification-body.css +1 -1
- package/dist/collection/components/notification/notification-header/notification-header.css +1 -1
- package/dist/collection/components/notification/notification-item/notification-item.css +1 -1
- package/dist/collection/components/notification/notification.css +1 -1
- package/dist/collection/components/pagination/pagination.css +1 -1
- package/dist/collection/components/pagination/pagination.js +4 -4
- package/dist/collection/components/radio/radio.css +1 -1
- package/dist/collection/components/radio-group/radio-group.css +1 -1
- package/dist/collection/components/scrim/scrim.css +1 -1
- package/dist/collection/components/select/select-input/select-input.css +1 -1
- package/dist/collection/components/select/select-input/select-input.js +6 -84
- package/dist/collection/components/select/select-list/select-list.css +1 -1
- package/dist/collection/components/select/select-option/select-option.css +1 -1
- package/dist/collection/components/select/select-option/select-option.js +8 -7
- package/dist/collection/components/select/select.css +1 -1
- package/dist/collection/components/select/select.js +22 -6
- package/dist/collection/components/sign-in/sign-in.css +1 -1
- package/dist/collection/components/sign-in/sign-in.js +1 -1
- package/dist/collection/components/skip-link/skip-link-item/skip-link-item.css +1 -1
- package/dist/collection/components/skip-link/skip-link.css +1 -1
- package/dist/collection/components/slider/slider.css +1 -1
- package/dist/collection/components/slider/slider.js +4 -4
- package/dist/collection/components/step/step-item/step-item.css +1 -1
- package/dist/collection/components/step/step.css +1 -1
- package/dist/collection/components/switch/switch.css +1 -1
- package/dist/collection/components/tab/tab-item/tab-item.css +1 -1
- package/dist/collection/components/tab/tab-item/tab-item.js +2 -2
- package/dist/collection/components/tab/tab.css +1 -1
- package/dist/collection/components/tab/tab.js +4 -4
- package/dist/collection/components/table/table-action/table-action.css +1 -0
- package/dist/collection/components/table/table-action/table-action.js +349 -0
- package/dist/collection/components/table/table-bar/table-bar.css +1 -0
- package/dist/collection/components/table/table-bar/table-bar.js +652 -0
- package/dist/collection/components/table/table-body/table-body.css +1 -1
- package/dist/collection/components/table/table-body/table-body.js +12 -17
- package/dist/collection/components/table/table-cell/table-cell.css +1 -1
- package/dist/collection/components/table/table-cell/table-cell.js +556 -83
- package/dist/collection/components/table/table-footer/table-footer.css +1 -0
- package/dist/collection/components/table/table-footer/table-footer.js +233 -0
- package/dist/collection/components/table/table-header/table-header.css +1 -1
- package/dist/collection/components/table/table-header/table-header.js +11 -17
- package/dist/collection/components/table/table-header-cell/table-header-cell.css +1 -1
- package/dist/collection/components/table/table-header-cell/table-header-cell.js +287 -86
- package/dist/collection/components/table/table-row/table-row.css +1 -1
- package/dist/collection/components/table/table-row/table-row.js +312 -57
- package/dist/collection/components/table/table.actions-tooltip.js +33 -0
- package/dist/collection/components/table/{table-constants.js → table.constants.js} +54 -77
- package/dist/collection/components/table/table.css +1 -1
- package/dist/collection/components/table/table.data.js +461 -0
- package/dist/collection/components/table/table.expansion.elements.js +70 -0
- package/dist/collection/components/table/table.expansion.js +179 -0
- package/dist/collection/components/table/table.grouping.js +97 -0
- package/dist/collection/components/table/table.header-height.js +47 -0
- package/dist/collection/components/table/table.js +2499 -618
- package/dist/collection/components/table/table.keyboard.js +340 -0
- package/dist/collection/components/table/table.scroll-shadows.js +36 -0
- package/dist/collection/components/table/table.selection.elements.js +63 -0
- package/dist/collection/components/table/table.selection.js +239 -0
- package/dist/collection/components/table/table.tokens.js +28 -0
- package/dist/collection/components/table/table.types.js +1 -0
- package/dist/collection/components/table/table.utils.js +75 -0
- package/dist/collection/components/table/table.virtual-list.js +342 -0
- package/dist/collection/components/tag/tag.css +1 -1
- package/dist/collection/components/tag/tag.js +2 -2
- package/dist/collection/components/textarea/textarea.css +1 -1
- package/dist/collection/components/textarea/textarea.js +1 -1
- package/dist/collection/components/tooltip/tooltip.css +1 -1
- package/dist/collection/components/tooltip/tooltip.js +3 -27
- package/dist/collection/components/upload/upload.css +1 -1
- package/dist/collection/components/upload/upload.js +2 -2
- package/dist/collection/components/wizard/wizard-panel/wizard-panel.css +1 -1
- package/dist/collection/components/wizard/wizard-panel/wizard-panel.js +1 -1
- package/dist/collection/components/wizard/wizard.css +1 -1
- package/dist/collection/components/wizard/wizard.js +1 -1
- package/dist/collection/pages/scripts/code-editor.js +28 -3
- package/dist/collection/pages/scripts/pageLoader.js +286 -20
- package/dist/collection/pages/scripts/pageloader-preview.js +3 -1
- package/dist/components/br-avatar.js +1 -1
- package/dist/components/br-breadcrumb-item.js +1 -1
- package/dist/components/br-breadcrumb.js +1 -1
- package/dist/components/br-button.js +1 -1
- package/dist/components/br-card.js +1 -1
- package/dist/components/br-carousel-page.js +1 -1
- package/dist/components/br-carousel.js +1 -1
- package/dist/components/br-checkbox-group.js +1 -1
- package/dist/components/br-checkbox.js +1 -1
- package/dist/components/br-checkgroup.js +1 -1
- package/dist/components/br-collapse.js +1 -1
- package/dist/components/br-cookiebar-cookie.js +1 -1
- package/dist/components/br-cookiebar-group.js +1 -1
- package/dist/components/br-cookiebar-header.js +1 -1
- package/dist/components/br-cookiebar-link.js +1 -1
- package/dist/components/br-cookiebar-note-group.js +1 -1
- package/dist/components/br-cookiebar-note.js +1 -1
- package/dist/components/br-cookiebar.js +1 -1
- package/dist/components/br-crumb.js +1 -1
- package/dist/components/br-date-picker.js +1 -1
- package/dist/components/br-datetime-input.js +1 -1
- package/dist/components/br-datetime-picker.js +1 -1
- package/dist/components/br-divider.js +1 -1
- package/dist/components/br-dropdown.js +1 -1
- package/dist/components/br-footer-category.js +1 -1
- package/dist/components/br-footer-item.js +1 -1
- package/dist/components/br-footer-legal.js +1 -1
- package/dist/components/br-footer-logo.js +1 -1
- package/dist/components/br-footer-social.js +1 -1
- package/dist/components/br-footer.js +1 -1
- package/dist/components/br-header-function.js +1 -1
- package/dist/components/br-header-link.js +1 -1
- package/dist/components/br-header-list.js +1 -1
- package/dist/components/br-header-logo.js +1 -1
- package/dist/components/br-header.js +1 -1
- package/dist/components/br-icon.js +1 -1
- package/dist/components/br-input.js +1 -1
- package/dist/components/br-item.js +1 -1
- package/dist/components/br-link.js +1 -1
- package/dist/components/br-list.js +1 -1
- package/dist/components/br-loading.js +1 -1
- package/dist/components/br-magic-button.js +1 -1
- package/dist/components/br-menu-group.js +1 -1
- package/dist/components/br-menu-header.js +1 -1
- package/dist/components/br-menu-info.js +1 -1
- package/dist/components/br-menu-item.js +1 -1
- package/dist/components/br-menu-link.js +1 -1
- package/dist/components/br-menu-list.js +1 -1
- package/dist/components/br-menu-logo.js +1 -1
- package/dist/components/br-menu-social.js +1 -1
- package/dist/components/br-menu.js +1 -1
- package/dist/components/br-message.js +1 -1
- package/dist/components/br-modal.js +1 -1
- package/dist/components/br-notification-body.js +1 -1
- package/dist/components/br-notification-header.js +1 -1
- package/dist/components/br-notification-item.js +1 -1
- package/dist/components/br-notification.js +1 -1
- package/dist/components/br-pagination.js +1 -1
- package/dist/components/br-radio-group.js +1 -1
- package/dist/components/br-radio.js +1 -1
- package/dist/components/br-scrim.js +1 -1
- package/dist/components/br-select-input.js +1 -1
- package/dist/components/br-select-list.js +1 -1
- package/dist/components/br-select-option.js +1 -1
- package/dist/components/br-select.js +1 -1
- package/dist/components/br-sign-in.js +1 -1
- package/dist/components/br-skip-link-item.js +1 -1
- package/dist/components/br-skip-link.js +1 -1
- package/dist/components/br-skiplink-item.js +1 -1
- package/dist/components/br-slider.js +1 -1
- package/dist/components/br-step-item.js +1 -1
- package/dist/components/br-step.js +1 -1
- package/dist/components/br-switch.js +1 -1
- package/dist/components/br-tab-item.js +1 -1
- package/dist/components/br-tab.js +1 -1
- package/dist/components/br-table-action.d.ts +11 -0
- package/dist/components/br-table-action.js +5 -0
- package/dist/components/br-table-bar.d.ts +11 -0
- package/dist/components/br-table-bar.js +5 -0
- package/dist/components/br-table-body.js +1 -1
- package/dist/components/br-table-cell.js +1 -1
- package/dist/components/br-table-footer.d.ts +11 -0
- package/dist/components/br-table-footer.js +5 -0
- package/dist/components/br-table-header-cell.js +1 -1
- package/dist/components/br-table-header.js +1 -1
- package/dist/components/br-table-row.js +1 -1
- package/dist/components/br-table.js +1 -1
- package/dist/components/br-tag.js +1 -1
- package/dist/components/br-textarea.js +1 -1
- package/dist/components/br-time-picker.js +1 -1
- package/dist/components/br-tooltip.js +1 -1
- package/dist/components/br-upload.js +1 -1
- package/dist/components/br-wizard-panel.js +1 -1
- package/dist/components/br-wizard.js +1 -1
- package/dist/components/index.d.ts +6 -0
- package/dist/components/index.js +1 -1
- package/dist/components/p-082jxuTj.js +5 -0
- package/dist/components/p-381n6AwK.js +5 -0
- package/dist/components/{p-CyXVsiz9.js → p-B5_zbRAr.js} +1 -1
- package/dist/components/p-BE1gDPwC.js +5 -0
- package/dist/components/p-BV-c2pxt.js +5 -0
- package/dist/components/p-BfFbYAuJ.js +5 -0
- package/dist/components/{p-DcMjwTqu.js → p-Bi2E_w9Q.js} +1 -1
- package/dist/components/p-Bk8YcMql.js +5 -0
- package/dist/components/p-C3ISxUGw.js +5 -0
- package/dist/components/p-C3J0TVQO.js +5 -0
- package/dist/components/p-C6m13lCc.js +5 -0
- package/dist/components/{p-DBmwzG9E.js → p-CCWJ-H33.js} +1 -1
- package/dist/components/p-CJuHirYK.js +5 -0
- package/dist/components/{p-SWQlgYWR.js → p-CKS7ggLM.js} +1 -1
- package/dist/components/p-COSFBwu9.js +5 -0
- package/dist/components/p-CWPrXYam.js +5 -0
- package/dist/components/p-Ca89D_0s.js +5 -0
- package/dist/components/p-CbN58CFi.js +5 -0
- package/dist/components/p-CjjxTkKb.js +5 -0
- package/dist/components/p-Ck9t4WSb.js +5 -0
- package/dist/components/p-CvfVwD6_.js +5 -0
- package/dist/components/p-D-1sfjhG.js +5 -0
- package/dist/components/p-D-p4vLlP.js +5 -0
- package/dist/components/p-D6DArHGH.js +5 -0
- package/dist/components/p-DD3BItoS.js +5 -0
- package/dist/components/{p-448Z5r2f.js → p-DEIKwFIf.js} +1 -1
- package/dist/components/p-DHHAIESt.js +5 -0
- package/dist/components/{p-Jk_KQE5V.js → p-DMj5iO7_.js} +1 -1
- package/dist/components/p-DUI-S07G.js +5 -0
- package/dist/components/p-D_K9JH6J.js +5 -0
- package/dist/components/p-DiQp2Lap.js +5 -0
- package/dist/components/{p-DJKZ8ktB.js → p-Dvbqhybt.js} +1 -1
- package/dist/components/p-Dy7MSvt-.js +5 -0
- package/dist/components/p-DywTXNHQ.js +5 -0
- package/dist/components/p-Ft_P7Roz.js +5 -0
- package/dist/components/p-KuiFoKDl.js +5 -0
- package/dist/components/p-MiiczSWA.js +5 -0
- package/dist/components/p-Um3K2SHu.js +5 -0
- package/dist/components/p-YxddSP6q.js +5 -0
- package/dist/components/p-Zk91ebVT.js +5 -0
- package/dist/components/p-jv2oG0vH.js +5 -0
- package/dist/components/p-nrG_Gd0c.js +5 -0
- package/dist/components/p-syLEZrcg.js +5 -0
- package/dist/components/{p-jvKQA6x7.js → p-ydfWTgrA.js} +1 -1
- package/dist/esm/br-avatar.entry.js +3 -3
- package/dist/esm/br-breadcrumb-item.entry.js +1 -1
- package/dist/esm/br-breadcrumb.entry.js +12 -12
- package/dist/esm/br-button_2.entry.js +6 -6
- package/dist/esm/br-card.entry.js +2 -2
- package/dist/esm/br-carousel-page.entry.js +2 -2
- package/dist/esm/br-carousel.entry.js +6 -6
- package/dist/esm/br-checkbox-group.entry.js +3 -3
- package/dist/esm/br-checkbox.entry.js +3 -3
- package/dist/esm/br-checkgroup.entry.js +1 -1
- package/dist/esm/br-collapse_2.entry.js +9 -9
- package/dist/esm/br-cookiebar-cookie.entry.js +2 -2
- package/dist/esm/br-cookiebar-group.entry.js +4 -4
- package/dist/esm/br-cookiebar-header.entry.js +2 -2
- package/dist/esm/br-cookiebar-link.entry.js +4 -4
- package/dist/esm/br-cookiebar-note-group.entry.js +3 -3
- package/dist/esm/br-cookiebar-note.entry.js +2 -2
- package/dist/esm/br-cookiebar.entry.js +6 -6
- package/dist/esm/br-crumb.entry.js +1 -1
- package/dist/esm/br-date-picker_3.entry.js +14 -14
- package/dist/esm/br-datetime-picker.entry.js +5 -22
- package/dist/esm/br-divider.entry.js +3 -3
- package/dist/esm/br-dropdown.entry.js +675 -0
- package/dist/esm/br-footer-category.entry.js +2 -2
- package/dist/esm/br-footer-item.entry.js +3 -3
- package/dist/esm/br-footer-legal.entry.js +2 -2
- package/dist/esm/br-footer-logo.entry.js +3 -3
- package/dist/esm/br-footer-social.entry.js +4 -4
- package/dist/esm/br-footer.entry.js +3 -3
- package/dist/esm/br-header-function.entry.js +3 -3
- package/dist/esm/br-header-link.entry.js +3 -3
- package/dist/esm/br-header-list.entry.js +4 -4
- package/dist/esm/br-header-logo.entry.js +3 -3
- package/dist/esm/br-header.entry.js +7 -7
- package/dist/esm/br-icon.entry.js +173 -159
- package/dist/esm/br-input_2.entry.js +1424 -0
- package/dist/esm/br-item.entry.js +3 -3
- package/dist/esm/br-link.entry.js +3 -3
- package/dist/esm/br-magic-button.entry.js +12 -13
- package/dist/esm/br-menu-group.entry.js +2 -2
- package/dist/esm/br-menu-header.entry.js +3 -3
- package/dist/esm/br-menu-info.entry.js +2 -2
- package/dist/esm/br-menu-item.entry.js +4 -4
- package/dist/esm/br-menu-link.entry.js +4 -4
- package/dist/esm/br-menu-list.entry.js +2 -2
- package/dist/esm/br-menu-logo.entry.js +2 -2
- package/dist/esm/br-menu-social.entry.js +3 -3
- package/dist/esm/br-menu.entry.js +6 -6
- package/dist/esm/br-modal.entry.js +3 -3
- package/dist/esm/br-notification-body.entry.js +2 -2
- package/dist/esm/br-notification-header.entry.js +2 -2
- package/dist/esm/br-notification-item.entry.js +3 -3
- package/dist/esm/br-notification.entry.js +3 -3
- package/dist/esm/{br-dropdown_2.entry.js → br-pagination_2.entry.js} +813 -558
- package/dist/esm/br-radio-group.entry.js +3 -3
- package/dist/esm/br-radio.entry.js +3 -3
- package/dist/esm/br-scrim.entry.js +3 -3
- package/dist/esm/br-select-input_3.entry.js +17 -94
- package/dist/esm/br-sign-in.entry.js +4 -4
- package/dist/esm/br-skip-link-item.entry.js +1 -1
- package/dist/esm/br-skip-link.entry.js +3 -3
- package/dist/esm/br-skiplink-item.entry.js +3 -3
- package/dist/esm/br-slider.entry.js +4 -4
- package/dist/esm/br-step_2.entry.js +4 -4
- package/dist/esm/br-switch.entry.js +3 -3
- package/dist/esm/br-tab-item.entry.js +4 -4
- package/dist/esm/br-tab.entry.js +8 -8
- package/dist/esm/br-table-action_6.entry.js +1493 -0
- package/dist/esm/br-table-body.entry.js +4 -16
- package/dist/esm/br-table-header.entry.js +4 -16
- package/dist/esm/br-table.entry.js +2591 -408
- package/dist/esm/br-tag.entry.js +5 -5
- package/dist/esm/br-textarea.entry.js +4 -4
- package/dist/esm/br-tooltip.entry.js +6 -30
- package/dist/esm/br-upload.entry.js +5 -5
- package/dist/esm/br-wizard-panel.entry.js +3 -3
- package/dist/esm/br-wizard.entry.js +4 -4
- package/dist/esm/helpers-BNW9pAhl.js +26 -0
- package/dist/esm/{icon.utils-zlORkiHQ.js → icon.utils-CXDYKUBz.js} +1 -1
- package/dist/esm/{index-ConyRdJe.js → index-CwL52661.js} +34 -35
- package/dist/esm/loader.js +3 -3
- package/dist/esm/{props-D07GjR4_.js → props-BbxNgEcJ.js} +1 -1
- package/dist/esm/table.utils-CtVdlcgI.js +706 -0
- package/dist/esm/webcomponents.js +3 -3
- package/dist/hydrate/index.js +5269 -1302
- package/dist/hydrate/index.mjs +5269 -1302
- package/dist/types/components/collapse/collapse.d.ts +2 -2
- package/dist/types/components/footer/footer-social/footer-social.d.ts +2 -3
- package/dist/types/components/icon/icon.d.ts +6 -6
- package/dist/types/components/icon/icon.utils.d.ts +1 -1
- package/dist/types/components/input/input.d.ts +7 -1
- package/dist/types/components/input/input.types.d.ts +18 -0
- package/dist/types/components/magic-button/magic-button.d.ts +7 -8
- package/dist/types/components/menu/menu-social/menu-social.d.ts +2 -3
- package/dist/types/components/select/select-input/select-input.d.ts +1 -4
- package/dist/types/components/select/select-option/select-option.d.ts +3 -1
- package/dist/types/components/slider/slider.d.ts +4 -4
- package/dist/types/components/tab/tab-item/tab-item.d.ts +2 -2
- package/dist/types/components/tab/tab.d.ts +1 -1
- package/dist/types/components/table/table-action/table-action.d.ts +107 -0
- package/dist/types/components/table/table-bar/table-bar.d.ts +193 -0
- package/dist/types/components/table/table-body/table-body.d.ts +11 -16
- package/dist/types/components/table/table-cell/table-cell.d.ts +178 -38
- package/dist/types/components/table/table-footer/table-footer.d.ts +40 -0
- package/dist/types/components/table/table-footer/table-footer.types.d.ts +12 -0
- package/dist/types/components/table/table-header/table-header.d.ts +10 -16
- package/dist/types/components/table/table-header-cell/table-header-cell.d.ts +102 -53
- package/dist/types/components/table/table-row/table-row.d.ts +88 -29
- package/dist/types/components/table/table.actions-tooltip.d.ts +11 -0
- package/dist/types/components/table/{table-constants.d.ts → table.constants.d.ts} +50 -77
- package/dist/types/components/table/table.d.ts +601 -222
- package/dist/types/components/table/table.data.d.ts +78 -0
- package/dist/types/components/table/table.expansion.d.ts +65 -0
- package/dist/types/components/table/table.expansion.elements.d.ts +30 -0
- package/dist/types/components/table/table.grouping.d.ts +25 -0
- package/dist/types/components/table/table.header-height.d.ts +17 -0
- package/dist/types/components/table/table.keyboard.d.ts +53 -0
- package/dist/types/components/table/table.scroll-shadows.d.ts +11 -0
- package/dist/types/components/table/table.selection.d.ts +84 -0
- package/dist/types/components/table/table.selection.elements.d.ts +42 -0
- package/dist/types/components/table/table.tokens.d.ts +24 -0
- package/dist/types/components/table/table.types.d.ts +199 -0
- package/dist/types/components/table/table.utils.d.ts +52 -0
- package/dist/types/components/table/table.virtual-list.d.ts +96 -0
- package/dist/types/components.d.ts +1401 -279
- package/dist/webcomponents/{p-85c8d060.entry.js → p-07e80bf8.entry.js} +1 -1
- package/dist/webcomponents/p-10d81622.entry.js +5 -0
- package/dist/webcomponents/{p-a9f16a65.entry.js → p-12d5f533.entry.js} +1 -1
- package/dist/webcomponents/p-15699e8a.entry.js +5 -0
- package/dist/webcomponents/{p-bbcde1ea.entry.js → p-15e2f5cc.entry.js} +1 -1
- package/dist/webcomponents/{p-5528b466.entry.js → p-16d27d5c.entry.js} +1 -1
- package/dist/webcomponents/p-18d3fab8.entry.js +5 -0
- package/dist/webcomponents/p-23c916d9.entry.js +5 -0
- package/dist/webcomponents/p-2aee69fd.entry.js +5 -0
- package/dist/webcomponents/p-2d3db296.entry.js +5 -0
- package/dist/webcomponents/p-2ed6afdd.entry.js +5 -0
- package/dist/webcomponents/{p-bbf47e78.entry.js → p-30c865e6.entry.js} +1 -1
- package/dist/webcomponents/p-32afb78c.entry.js +5 -0
- package/dist/webcomponents/p-33d24cbd.entry.js +5 -0
- package/dist/webcomponents/p-35d63edd.entry.js +5 -0
- package/dist/webcomponents/p-3b1ff55e.entry.js +5 -0
- package/dist/webcomponents/p-3c7246cf.entry.js +5 -0
- package/dist/webcomponents/{p-11d4edc5.entry.js → p-407e7b69.entry.js} +1 -1
- package/dist/webcomponents/{p-53550e8c.entry.js → p-41b12e3c.entry.js} +1 -1
- package/dist/webcomponents/p-47adc17f.entry.js +5 -0
- package/dist/webcomponents/{p-21e10074.entry.js → p-48fc8e56.entry.js} +1 -1
- package/dist/webcomponents/p-4a44c8b8.entry.js +5 -0
- package/dist/webcomponents/{p-6d58ab4f.entry.js → p-4b0f3701.entry.js} +1 -1
- package/dist/webcomponents/{p-84dfbfdd.entry.js → p-4b66200c.entry.js} +1 -1
- package/dist/webcomponents/{p-324afbce.entry.js → p-4c0a1c05.entry.js} +1 -1
- package/dist/webcomponents/p-4c72d706.entry.js +5 -0
- package/dist/webcomponents/p-505173e0.entry.js +5 -0
- package/dist/webcomponents/p-50caea68.entry.js +5 -0
- package/dist/webcomponents/p-5419fd2c.entry.js +5 -0
- package/dist/webcomponents/{p-ed3fa8ec.entry.js → p-5693e0e7.entry.js} +1 -1
- package/dist/webcomponents/p-58247764.entry.js +5 -0
- package/dist/webcomponents/{p-3926cc91.entry.js → p-5d0f4851.entry.js} +1 -1
- package/dist/webcomponents/{p-39a7826d.entry.js → p-60c949c8.entry.js} +1 -1
- package/dist/webcomponents/p-61b84035.entry.js +5 -0
- package/dist/webcomponents/{p-e121429a.entry.js → p-62a74e0a.entry.js} +1 -1
- package/dist/webcomponents/p-6450913e.entry.js +5 -0
- package/dist/webcomponents/p-66c8b8d9.entry.js +5 -0
- package/dist/webcomponents/{p-c6f2f17b.entry.js → p-67281ef1.entry.js} +1 -1
- package/dist/webcomponents/{p-087ed5e7.entry.js → p-6e128c7a.entry.js} +1 -1
- package/dist/webcomponents/p-725e92ab.entry.js +5 -0
- package/dist/webcomponents/{p-19b4b1b7.entry.js → p-74726f20.entry.js} +1 -1
- package/dist/webcomponents/{p-975ea5c7.entry.js → p-75bd655b.entry.js} +1 -1
- package/dist/webcomponents/p-7bf78e48.entry.js +5 -0
- package/dist/webcomponents/p-7cc28ecf.entry.js +5 -0
- package/dist/webcomponents/{p-913d6f28.entry.js → p-7ec01a99.entry.js} +1 -1
- package/dist/webcomponents/{p-d205f3fd.entry.js → p-7f17dbca.entry.js} +1 -1
- package/dist/webcomponents/{p-152482f9.entry.js → p-8120f3ce.entry.js} +1 -1
- package/dist/webcomponents/p-8ded7870.entry.js +5 -0
- package/dist/webcomponents/p-9ab989d1.entry.js +5 -0
- package/dist/webcomponents/p-9be642ff.entry.js +5 -0
- package/dist/webcomponents/p-9d41995a.entry.js +5 -0
- package/dist/webcomponents/{p-EbtQZm5s.js → p-CjVabz-h.js} +1 -1
- package/dist/webcomponents/{p-ConyRdJe.js → p-CwL52661.js} +2 -2
- package/dist/webcomponents/p-Zk91ebVT.js +5 -0
- package/dist/webcomponents/p-_BMaB_68.js +5 -0
- package/dist/webcomponents/p-a150b61d.entry.js +5 -0
- package/dist/webcomponents/{p-55e0822d.entry.js → p-a264acf6.entry.js} +1 -1
- package/dist/webcomponents/p-a5616523.entry.js +5 -0
- package/dist/webcomponents/{p-eb5806c7.entry.js → p-ae3dfb9c.entry.js} +1 -1
- package/dist/webcomponents/p-b1aeb805.entry.js +5 -0
- package/dist/webcomponents/p-b8eea3ef.entry.js +5 -0
- package/dist/webcomponents/p-c6952f8d.entry.js +5 -0
- package/dist/webcomponents/p-c743e5c5.entry.js +5 -0
- package/dist/webcomponents/p-d0c659c3.entry.js +5 -0
- package/dist/webcomponents/p-d3dec923.entry.js +5 -0
- package/dist/webcomponents/{p-12dd22af.entry.js → p-d5405bbe.entry.js} +1 -1
- package/dist/webcomponents/{p-c29268b5.entry.js → p-d6d3a552.entry.js} +1 -1
- package/dist/webcomponents/p-dab66328.entry.js +5 -0
- package/dist/webcomponents/{p-cb1e08b1.entry.js → p-db02533d.entry.js} +1 -1
- package/dist/webcomponents/p-dda22999.entry.js +5 -0
- package/dist/webcomponents/p-e2a46f44.entry.js +5 -0
- package/dist/webcomponents/{p-e0ccf189.entry.js → p-e3680ff8.entry.js} +1 -1
- package/dist/webcomponents/p-e5b9652d.entry.js +5 -0
- package/dist/webcomponents/p-e7f02302.entry.js +5 -0
- package/dist/webcomponents/p-f0720e23.entry.js +5 -0
- package/dist/webcomponents/p-f244009d.entry.js +5 -0
- package/dist/webcomponents/p-f32c40ee.entry.js +5 -0
- package/dist/webcomponents/{p-e4b968b5.entry.js → p-f697abbd.entry.js} +1 -1
- package/dist/webcomponents/p-f7ed35ef.entry.js +5 -0
- package/dist/webcomponents/p-f8576e0a.entry.js +5 -0
- package/dist/webcomponents/p-fcc62731.entry.js +5 -0
- package/dist/webcomponents/webcomponents.esm.js +1 -1
- package/package.json +1 -1
- package/dist/cjs/br-input.cjs.entry.js +0 -763
- package/dist/cjs/br-loading.cjs.entry.js +0 -567
- package/dist/cjs/br-pagination.cjs.entry.js +0 -916
- package/dist/cjs/br-table-cell.cjs.entry.js +0 -201
- package/dist/cjs/br-table-header-cell.cjs.entry.js +0 -189
- package/dist/cjs/br-table-row.cjs.entry.js +0 -95
- package/dist/cjs/table-constants-BOPSay0B.js +0 -183
- package/dist/collection/components/table/table-tokens.js +0 -50
- package/dist/collection/components/table/table-utils.js +0 -44
- package/dist/components/p-AhfgJCUp.js +0 -5
- package/dist/components/p-AoNL6BaW.js +0 -5
- package/dist/components/p-B468MCYC.js +0 -5
- package/dist/components/p-B985Ov_x.js +0 -5
- package/dist/components/p-BOWQIHQA.js +0 -5
- package/dist/components/p-BPQrgCRr.js +0 -5
- package/dist/components/p-BwQT0fOJ.js +0 -5
- package/dist/components/p-CAgbUwsx.js +0 -5
- package/dist/components/p-CFXey8i8.js +0 -5
- package/dist/components/p-CW8xwk6J.js +0 -5
- package/dist/components/p-CXMwM9m4.js +0 -5
- package/dist/components/p-CYZVdKeO.js +0 -5
- package/dist/components/p-CeWbZN7V.js +0 -5
- package/dist/components/p-DDe0tQEO.js +0 -5
- package/dist/components/p-DRsZ9GNg.js +0 -5
- package/dist/components/p-DU54cqCf.js +0 -5
- package/dist/components/p-DVJlmlEX.js +0 -5
- package/dist/components/p-Dd1qCWAK.js +0 -5
- package/dist/components/p-DiLI514I.js +0 -5
- package/dist/components/p-DoWy_P8b.js +0 -5
- package/dist/components/p-HbhTnepI.js +0 -5
- package/dist/components/p-Or3FLzbz.js +0 -5
- package/dist/components/p-Zb9nyfTY.js +0 -5
- package/dist/components/p-pQb-3jFY.js +0 -5
- package/dist/components/p-qX6sHxOk.js +0 -5
- package/dist/esm/br-input.entry.js +0 -761
- package/dist/esm/br-loading.entry.js +0 -565
- package/dist/esm/br-pagination.entry.js +0 -914
- package/dist/esm/br-table-cell.entry.js +0 -199
- package/dist/esm/br-table-header-cell.entry.js +0 -187
- package/dist/esm/br-table-row.entry.js +0 -93
- package/dist/esm/table-constants-CXMwM9m4.js +0 -170
- package/dist/types/components/table/table-tokens.d.ts +0 -46
- package/dist/types/components/table/table-types.d.ts +0 -107
- package/dist/types/components/table/table-utils.d.ts +0 -47
- package/dist/webcomponents/p-031a2256.entry.js +0 -5
- package/dist/webcomponents/p-0602e5b1.entry.js +0 -5
- package/dist/webcomponents/p-079d5f69.entry.js +0 -5
- package/dist/webcomponents/p-0d5a9ebf.entry.js +0 -5
- package/dist/webcomponents/p-105b4d06.entry.js +0 -5
- package/dist/webcomponents/p-14aedf0d.entry.js +0 -5
- package/dist/webcomponents/p-1cd1126e.entry.js +0 -5
- package/dist/webcomponents/p-2271ea84.entry.js +0 -5
- package/dist/webcomponents/p-271b1ede.entry.js +0 -5
- package/dist/webcomponents/p-28f732fc.entry.js +0 -5
- package/dist/webcomponents/p-2971d38a.entry.js +0 -5
- package/dist/webcomponents/p-2ac48875.entry.js +0 -5
- package/dist/webcomponents/p-2b1a919c.entry.js +0 -5
- package/dist/webcomponents/p-2da57966.entry.js +0 -5
- package/dist/webcomponents/p-2e81b0b3.entry.js +0 -5
- package/dist/webcomponents/p-2eececed.entry.js +0 -5
- package/dist/webcomponents/p-2f904c4a.entry.js +0 -5
- package/dist/webcomponents/p-32414f1c.entry.js +0 -5
- package/dist/webcomponents/p-32ea6342.entry.js +0 -5
- package/dist/webcomponents/p-330ec8ab.entry.js +0 -5
- package/dist/webcomponents/p-374f83b1.entry.js +0 -5
- package/dist/webcomponents/p-3bcc2c58.entry.js +0 -5
- package/dist/webcomponents/p-3c7ce0e4.entry.js +0 -5
- package/dist/webcomponents/p-467842ca.entry.js +0 -5
- package/dist/webcomponents/p-53e71a8a.entry.js +0 -5
- package/dist/webcomponents/p-58bacbe1.entry.js +0 -5
- package/dist/webcomponents/p-5a5ed7d8.entry.js +0 -5
- package/dist/webcomponents/p-621f0fa8.entry.js +0 -5
- package/dist/webcomponents/p-6514a75d.entry.js +0 -5
- package/dist/webcomponents/p-678b43a6.entry.js +0 -5
- package/dist/webcomponents/p-6b6be415.entry.js +0 -5
- package/dist/webcomponents/p-6ff9b26e.entry.js +0 -5
- package/dist/webcomponents/p-992167bc.entry.js +0 -5
- package/dist/webcomponents/p-CXMwM9m4.js +0 -5
- package/dist/webcomponents/p-a21872bf.entry.js +0 -5
- package/dist/webcomponents/p-b8d4ace3.entry.js +0 -5
- package/dist/webcomponents/p-bf35e506.entry.js +0 -5
- package/dist/webcomponents/p-c09af3cd.entry.js +0 -5
- package/dist/webcomponents/p-c3e61c39.entry.js +0 -5
- package/dist/webcomponents/p-c6b2545a.entry.js +0 -5
- package/dist/webcomponents/p-cae39e13.entry.js +0 -5
- package/dist/webcomponents/p-cb690a87.entry.js +0 -5
- package/dist/webcomponents/p-d0be7243.entry.js +0 -5
- package/dist/webcomponents/p-d191c6e3.entry.js +0 -5
- package/dist/webcomponents/p-d3bd2c40.entry.js +0 -5
- package/dist/webcomponents/p-dbeea64e.entry.js +0 -5
- package/dist/webcomponents/p-df475129.entry.js +0 -5
- package/dist/webcomponents/p-e661c024.entry.js +0 -5
- package/dist/webcomponents/p-e6c6f305.entry.js +0 -5
- package/dist/webcomponents/p-e8291be2.entry.js +0 -5
- package/dist/webcomponents/p-f9084f16.entry.js +0 -5
- package/dist/webcomponents/p-fad3aa61.entry.js +0 -5
- /package/dist/collection/components/table/{table-types.js → table-footer/table-footer.types.js} +0 -0
- /package/dist/webcomponents/{p-zlORkiHQ.js → p-CXDYKUBz.js} +0 -0
|
@@ -2,746 +2,1980 @@
|
|
|
2
2
|
* Construído por SERPRO
|
|
3
3
|
* © https://serpro.gov.br/ - MIT License.
|
|
4
4
|
*/
|
|
5
|
-
import { Host, h } from "@stencil/core";
|
|
6
|
-
import
|
|
5
|
+
import { Fragment, forceUpdate, Host, h, } from "@stencil/core";
|
|
6
|
+
import Helpers from "../../shared/utils/helpers";
|
|
7
7
|
import { findComposedOwner } from "../../shared/utils/ownership";
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
8
|
+
import { COLUMN_WIDTH_MAP, COLUMN_WIDTH_SEMANTICS, TABLE_ALIGNMENT, TABLE_ALIGNMENT_MAP, TABLE_BAR_PADDING_MAP, TABLE_DENSITY, TABLE_DENSITY_MAP, TABLE_DIVIDER_STYLE, TABLE_DIVIDER_STYLE_MAP, TABLE_OVERFLOW, TABLE_OVERFLOW_MAP, TABLE_ROW_EXPANSION, TABLE_SORT_DIRECTION, TABLE_SORT_MODE, TABLE_SORT_STRATEGY, TABLE_TOOLTIP_STATE, } from "./table.constants";
|
|
9
|
+
import { TableDataStore } from "./table.data";
|
|
10
|
+
import { TableExpansionController } from "./table.expansion";
|
|
11
|
+
import { applyTableHeaderLayout, getTableLeafHeaders, getTablePlacements, getTableRowGroups, resolveTableSpan, } from "./table.grouping";
|
|
12
|
+
import { TableKeyboardController } from "./table.keyboard";
|
|
13
|
+
import { TableScrollShadows } from "./table.scroll-shadows";
|
|
14
|
+
import { TableSelectionController } from "./table.selection";
|
|
15
|
+
import { TABLE_TOKENS } from "./table.tokens";
|
|
16
|
+
import { isHydrationClassMutation, positiveFrValidator, positivePxValidator, resolveTableDensityFromElement, resolveTokenValue, } from "./table.utils";
|
|
17
|
+
import { TableVirtualListController } from "./table.virtual-list";
|
|
18
|
+
const MIN_VISIBLE_ROWS = 1;
|
|
19
|
+
const MAX_VISIBLE_ROWS = 50;
|
|
20
|
+
const DEFAULT_VISIBLE_ROWS = 10;
|
|
13
21
|
/**
|
|
14
|
-
*
|
|
22
|
+
* ## Design System
|
|
15
23
|
*
|
|
16
|
-
*
|
|
24
|
+
* Para a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/table?tab=designer).
|
|
17
25
|
*
|
|
18
|
-
*
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
22
|
-
*
|
|
23
|
-
*
|
|
24
|
-
*
|
|
25
|
-
*
|
|
26
|
-
*
|
|
27
|
-
*
|
|
28
|
-
*
|
|
29
|
-
*
|
|
30
|
-
* </br-table-row>
|
|
31
|
-
* </br-table-body>
|
|
32
|
-
* </br-table>
|
|
33
|
-
* ```
|
|
26
|
+
* Apresenta e permite interagir com dados tabulares; não deve ser usada para
|
|
27
|
+
* organizar layout ou conteúdo que não seja tabular. Recebe o cabeçalho e o corpo
|
|
28
|
+
* pelos slots `header` e `body`, compostos por `br-table-header` e
|
|
29
|
+
* `br-table-header-cell`, e por `br-table-body`, `br-table-row` e `br-table-cell`.
|
|
30
|
+
* Orquestra a grade, a acessibilidade, a ordenação, a seleção e a expansão das
|
|
31
|
+
* linhas. A barra de ações é gerenciada pela tabela; `br-table-footer` é
|
|
32
|
+
* renderizado quando a paginação está habilitada. As propriedades de célula
|
|
33
|
+
* seguem, quando aplicável, a precedência: célula, linha, coluna, tabela e valor
|
|
34
|
+
* padrão. Cabeçalhos multinível usam várias linhas em `br-table-header` com
|
|
35
|
+
* `colSpan`/`rowSpan`. Linhas contíguas com `rowGroup` formam unidades de ordenação,
|
|
36
|
+
* paginação e virtualização; a seleção permanece individual. Células com `rowSpan`
|
|
37
|
+
* não atravessam os limites do grupo. Prefira tabelas simples quando possível.
|
|
34
38
|
*
|
|
35
|
-
*
|
|
36
|
-
*
|
|
37
|
-
* -
|
|
38
|
-
*
|
|
39
|
-
* ### Quando evitar
|
|
40
|
-
*
|
|
41
|
-
* - Listas simples de itens lineares: use `br-list`.
|
|
42
|
-
* - Agrupamento de informações de um único registro: use `br-card`.
|
|
43
|
-
*
|
|
44
|
-
* Consulte as [diretrizes de design do GovBR](https://www.gov.br/ds/components/table?tab=designer).
|
|
45
|
-
*
|
|
46
|
-
* @category Dados, Conteúdo
|
|
47
|
-
* @status stable
|
|
48
|
-
* @Slot header: Área para inclusão do subcomponente br-table-header
|
|
49
|
-
* @Slot body: Área para inclusão do subcomponente br-table-body
|
|
39
|
+
* @slot header - Componente `br-table-header` que define as colunas.
|
|
40
|
+
* @slot body - Componente `br-table-body` que contém as linhas de dados.
|
|
41
|
+
* @slot global-actions - Ações aplicadas ao conjunto completo de dados.
|
|
42
|
+
* @slot contextual-actions - Ações aplicadas às linhas selecionadas.
|
|
50
43
|
* @slot loading - Indicador exibido enquanto as linhas são atualizadas.
|
|
51
|
-
*
|
|
52
|
-
* @part container -
|
|
53
|
-
* @part content -
|
|
54
|
-
* @part
|
|
44
|
+
* @part container - Contêiner visual principal.
|
|
45
|
+
* @part scroll-container - Área com rolagem que contém apenas os dados da tabela.
|
|
46
|
+
* @part content - Grid que contém cabeçalho e corpo.
|
|
47
|
+
* @part footer - Contêiner do rodapé, exibido abaixo do corpo da tabela.
|
|
48
|
+
* @part loading - Scrim local e área do painel de carregamento sobre a tabela inteira.
|
|
49
|
+
* @cssprop --br-table-loading-opacity - Opacidade do conteúdo durante o carregamento. Padrão: 0.5.
|
|
50
|
+
* @fires brTableActionClick - Quando uma ação pública é acionada.
|
|
51
|
+
* @fires brTableSelectionChange - Quando o conjunto selecionado muda.
|
|
52
|
+
* @fires brTableRowExpansionChange - Quando uma linha expande ou recolhe.
|
|
53
|
+
* @fires brTableSortRequest - Antes de aplicar uma solicitação de ordenação.
|
|
54
|
+
* @fires brTableSortChange - Quando os critérios de ordenação mudam.
|
|
55
|
+
* @fires brTablePageChange - Quando o consumidor solicita outra página pela paginação do rodapé.
|
|
56
|
+
* @fires brTablePageSizeChange - Quando o consumidor solicita outra quantidade de itens por página.
|
|
57
|
+
* @fires brTableSearch - Quando a busca é enviada ou fechada.
|
|
55
58
|
*/
|
|
56
59
|
export class Table {
|
|
57
60
|
constructor() {
|
|
58
61
|
/**
|
|
59
|
-
*
|
|
62
|
+
* Habilita divisores entre colunas quando `columnDivider` não é informado.
|
|
60
63
|
*
|
|
64
|
+
* @deprecated Use `columnDivider` instead.
|
|
61
65
|
* @default false
|
|
62
|
-
* @deprecated Use `columnDivider`.
|
|
63
66
|
*/
|
|
64
67
|
this.hasColumnDivider = false;
|
|
65
68
|
/**
|
|
66
|
-
*
|
|
69
|
+
* Habilita divisores entre linhas quando `rowDivider` não é informado.
|
|
67
70
|
*
|
|
71
|
+
* @deprecated Use `rowDivider` instead.
|
|
68
72
|
* @default false
|
|
69
|
-
* @deprecated Use `rowDivider`.
|
|
70
73
|
*/
|
|
71
74
|
this.hasRowDivider = false;
|
|
72
75
|
/**
|
|
73
|
-
*
|
|
76
|
+
* Habilita o realce visual das linhas ao passar o ponteiro.
|
|
74
77
|
*
|
|
75
|
-
* @
|
|
76
|
-
|
|
77
|
-
|
|
78
|
+
* @default false
|
|
79
|
+
*/
|
|
80
|
+
this.hasRowHover = false;
|
|
81
|
+
/**
|
|
82
|
+
* Indica que as linhas estão sendo atualizadas pelo consumidor.
|
|
78
83
|
*
|
|
79
|
-
*
|
|
80
|
-
*
|
|
81
|
-
*
|
|
82
|
-
*
|
|
84
|
+
* @remarks Mantém os dados anteriores, reduz sua opacidade e exibe o slot
|
|
85
|
+
* `loading` em um painel central com scrim sobre toda a tabela, incluindo
|
|
86
|
+
* barra de ações e paginação. O scrim fica limitado ao componente.
|
|
87
|
+
* Reflete o atributo `loading` e pode ser alterada diretamente ou pelos métodos
|
|
88
|
+
* `startLoading()` e `stopLoading()`. Não bloqueia o teclado nem gerencia
|
|
89
|
+
* requisições, erros ou substituição dos dados.
|
|
90
|
+
* @default false
|
|
91
|
+
*/
|
|
92
|
+
this.loading = false;
|
|
93
|
+
/**
|
|
94
|
+
* Força a apresentação da barra contextual.
|
|
83
95
|
*
|
|
84
|
-
* @default
|
|
96
|
+
* @default false
|
|
85
97
|
*/
|
|
86
|
-
this.
|
|
98
|
+
this.showContextualBar = false;
|
|
87
99
|
/**
|
|
88
|
-
*
|
|
100
|
+
* Limite usado para decidir quando agrupar ações globais em um menu.
|
|
101
|
+
* Quando o número de ações excede esse valor, as ações são agrupadas no
|
|
102
|
+
* dropdown (atualmente todas são movidas para o menu colapsado).
|
|
89
103
|
*
|
|
90
|
-
* @
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
*
|
|
104
|
+
* @default 4
|
|
105
|
+
*/
|
|
106
|
+
this.headingActionsLimit = 4;
|
|
107
|
+
/**
|
|
108
|
+
* Limite usado para decidir quando agrupar ações contextuais em um menu.
|
|
109
|
+
* Quando o número de ações excede esse valor, as ações são agrupadas no
|
|
110
|
+
* dropdown (atualmente todas são movidas para o menu colapsado).
|
|
95
111
|
*
|
|
96
|
-
* @default
|
|
112
|
+
* @default 4
|
|
97
113
|
*/
|
|
98
|
-
this.
|
|
114
|
+
this.contextualActionsLimit = 4;
|
|
99
115
|
/**
|
|
100
|
-
*
|
|
101
|
-
*
|
|
102
|
-
*
|
|
103
|
-
*
|
|
104
|
-
*
|
|
105
|
-
|
|
116
|
+
* Texto do tooltip do botão de ações agrupadas na barra de título.
|
|
117
|
+
* Quando vazio ou composto apenas por espaços, usa "Mais ações".
|
|
118
|
+
* Não altera o nome acessível do botão nem os rótulos do menu.
|
|
119
|
+
*
|
|
120
|
+
* @default 'Mais ações'
|
|
121
|
+
*/
|
|
122
|
+
this.moreActionsHeadingLabel = 'Mais ações';
|
|
123
|
+
/**
|
|
124
|
+
* Texto do tooltip do botão de ações agrupadas da barra contextual.
|
|
125
|
+
* Quando vazio ou composto apenas por espaços, usa "Mais ações".
|
|
126
|
+
* Não altera o nome acessível do botão nem os rótulos do menu.
|
|
127
|
+
*
|
|
128
|
+
* @default 'Mais ações'
|
|
129
|
+
*/
|
|
130
|
+
this.moreActionsContextualLabel = 'Mais ações';
|
|
131
|
+
/**
|
|
132
|
+
* Limite padrão de ações exibidas em cada célula.
|
|
133
|
+
*
|
|
134
|
+
* @default 4
|
|
135
|
+
*/
|
|
136
|
+
this.cellActionsLimit = 4;
|
|
137
|
+
/**
|
|
138
|
+
* Habilita a coluna de seleção de linhas.
|
|
139
|
+
*
|
|
106
140
|
* @default false
|
|
107
141
|
*/
|
|
108
|
-
this.
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
this.
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
142
|
+
this.hasRowSelection = false;
|
|
143
|
+
/**
|
|
144
|
+
* Habilita a coluna de expansão de linhas.
|
|
145
|
+
*
|
|
146
|
+
* @default false
|
|
147
|
+
*/
|
|
148
|
+
this.hasRowExpansion = false;
|
|
149
|
+
/**
|
|
150
|
+
* Disponibiliza a interface de busca, sem filtrar ou destacar o conteúdo.
|
|
151
|
+
* A aplicação recebe `brTableSearch` e atualiza os dados local ou remotamente.
|
|
152
|
+
*
|
|
153
|
+
* @default false
|
|
154
|
+
*/
|
|
155
|
+
this.hasSearch = false;
|
|
156
|
+
/**
|
|
157
|
+
* Habilita a paginação da tabela, renderizando `br-table-footer` internamente.
|
|
158
|
+
*
|
|
159
|
+
* @remarks A paginação define o subconjunto lógico disponível para a lista
|
|
160
|
+
* virtual. `pageSize` conta linhas independentes ou grupos completos, e
|
|
161
|
+
* `visibleRows` controla quantas delas cabem simultaneamente na viewport.
|
|
162
|
+
* Quando os dados completos ainda não estão disponíveis localmente
|
|
163
|
+
* (paginação por API), informe `totalItems` e forneça o subconjunto
|
|
164
|
+
* correspondente após `brTablePageChange`.
|
|
165
|
+
* @default false
|
|
166
|
+
*/
|
|
167
|
+
this.hasPagination = false;
|
|
168
|
+
/**
|
|
169
|
+
* Página atual exibida pela paginação (1-indexada).
|
|
170
|
+
*
|
|
171
|
+
* @remarks Atualizada internamente quando `TableDataStore` já cobre a
|
|
172
|
+
* página solicitada. Utilize como valor inicial ou para navegar
|
|
173
|
+
* programaticamente para outra página.
|
|
174
|
+
* @default 1
|
|
175
|
+
*/
|
|
176
|
+
this.currentPage = 1;
|
|
177
|
+
/**
|
|
178
|
+
* Opções disponíveis de itens por página no seletor da paginação.
|
|
179
|
+
*
|
|
180
|
+
* @default [10, 20, 30]
|
|
181
|
+
*/
|
|
182
|
+
this.pageSizeOptions = [10, 20, 30];
|
|
183
|
+
/**
|
|
184
|
+
* Define se a tabela aceita uma única coluna ordenada ou múltiplas colunas.
|
|
185
|
+
* No modo `multi`, a prioridade é sempre a ordem visual da esquerda para a direita.
|
|
186
|
+
*
|
|
187
|
+
* @default single
|
|
188
|
+
*/
|
|
189
|
+
this.sortMode = TABLE_SORT_MODE.SINGLE;
|
|
190
|
+
/**
|
|
191
|
+
* Define se a tabela ordena as linhas localmente ou deixa a aplicação aplicar
|
|
192
|
+
* a ordenação solicitada. Em `manual`, a tabela mantém os indicadores e emite
|
|
193
|
+
* `brTableSortChange`, mas não reordena as linhas; use `setData()` para fornecer
|
|
194
|
+
* os resultados customizados ou remotos. Valores não reconhecidos usam a
|
|
195
|
+
* estratégia local.
|
|
196
|
+
*
|
|
197
|
+
* @default local
|
|
198
|
+
*/
|
|
199
|
+
this.sortStrategy = TABLE_SORT_STRATEGY.LOCAL;
|
|
200
|
+
/**
|
|
201
|
+
* Quantidade de linhas de dados visíveis simultaneamente na viewport.
|
|
202
|
+
*
|
|
203
|
+
* @remarks Não limita o conjunto de dados nem realiza paginação. A altura da
|
|
204
|
+
* região de scroll é derivada desta quantidade e da densidade atual. Mesmo
|
|
205
|
+
* com `hasPagination` habilitado, esta propriedade continua definindo
|
|
206
|
+
* apenas a capacidade visual da viewport; `pageSize` define o tamanho lógico
|
|
207
|
+
* da página.
|
|
208
|
+
* @default 10
|
|
209
|
+
*/
|
|
210
|
+
this.visibleRows = 10;
|
|
211
|
+
/** Altura adicional estimada para conteúdo expandido ainda não medido. */
|
|
212
|
+
this.virtualExpandedContentHeight = 240;
|
|
213
|
+
/**
|
|
214
|
+
* Estratégia padrão para conteúdos que excedem a célula.
|
|
215
|
+
*
|
|
216
|
+
* @default wrap
|
|
217
|
+
*/
|
|
218
|
+
this.overflow = TABLE_OVERFLOW.WRAP;
|
|
219
|
+
/**
|
|
220
|
+
* Estado visual padrão dos tooltips.
|
|
221
|
+
*
|
|
222
|
+
* @default info
|
|
223
|
+
*/
|
|
224
|
+
this.tooltipState = TABLE_TOOLTIP_STATE.INFO;
|
|
225
|
+
this.selectedRowsCount = 0;
|
|
226
|
+
this.measuredCollapsedRowHeight = null;
|
|
227
|
+
this.measuredHeaderHeight = null;
|
|
228
|
+
this.hasGlobalActionsContent = false;
|
|
229
|
+
this.hasContextualActionsContent = false;
|
|
230
|
+
this.hasScrollableContent = false;
|
|
231
|
+
this.generatedHeaderPrefix = Helpers.generateUniqueId();
|
|
232
|
+
this.dataStore = new TableDataStore();
|
|
233
|
+
this.isRenderingData = false;
|
|
234
|
+
this.selfMutationDepth = 0;
|
|
235
|
+
this.viewportMeasureFrame = null;
|
|
236
|
+
this.sorting = [];
|
|
237
|
+
this.openDropdowns = new Set();
|
|
238
|
+
this.headerHeights = new Map();
|
|
239
|
+
this.handleViewportScroll = () => {
|
|
240
|
+
for (const dropdown of this.openDropdowns) {
|
|
241
|
+
if (dropdown.isConnected)
|
|
242
|
+
void dropdown.close();
|
|
123
243
|
}
|
|
124
|
-
this.
|
|
244
|
+
this.openDropdowns.clear();
|
|
125
245
|
};
|
|
126
|
-
this.
|
|
127
|
-
if (
|
|
128
|
-
this.
|
|
129
|
-
return;
|
|
246
|
+
this.handleFooterPageChange = (event) => {
|
|
247
|
+
if (this.dataStore.getItemCount() >= this.resolvePaginationTotalItems()) {
|
|
248
|
+
this.currentPage = event.detail.page;
|
|
130
249
|
}
|
|
131
|
-
this.
|
|
250
|
+
this.brTablePageChange.emit(event.detail);
|
|
251
|
+
};
|
|
252
|
+
this.handleFooterPerPageChange = (event) => {
|
|
253
|
+
this.applyFooterPerPageChange(event.detail.perPage);
|
|
132
254
|
};
|
|
133
|
-
this.generatedHeaderPrefix = generateUniqueId();
|
|
134
255
|
/**
|
|
135
|
-
*
|
|
256
|
+
* Ressincroniza todas as estruturas derivadas após uma mudança no conteúdo.
|
|
257
|
+
* A ordem preserva expansão antes de seleção e ambas antes das colunas de dados.
|
|
136
258
|
*/
|
|
137
259
|
this.handleStructureChange = () => {
|
|
138
|
-
this.
|
|
260
|
+
this.syncBarActionsContent();
|
|
261
|
+
this.runWithoutSelfMutations(() => {
|
|
262
|
+
this.syncSelectionStructure();
|
|
263
|
+
this.syncExpansionStructure();
|
|
264
|
+
this.syncRowHoverState();
|
|
265
|
+
this.annotateBoundaries();
|
|
266
|
+
this.updateColumnWidths();
|
|
267
|
+
this.updateAllCellAlignments();
|
|
268
|
+
this.updateAllCellOverflow();
|
|
269
|
+
this.updateActionDensities();
|
|
270
|
+
this.applyAriaMetadata();
|
|
271
|
+
});
|
|
272
|
+
this.updateSelectionCount();
|
|
273
|
+
for (const entry of this.headerHeights.values())
|
|
274
|
+
entry.refresh();
|
|
275
|
+
this.updateHeaderHeight();
|
|
276
|
+
this.virtualList.sync();
|
|
139
277
|
};
|
|
140
278
|
}
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
279
|
+
handleHeaderHeight(event) {
|
|
280
|
+
const { host, height } = event.detail;
|
|
281
|
+
if (host.closest('br-table') !== this.el || !Number.isFinite(height) || height < 0)
|
|
282
|
+
return;
|
|
283
|
+
this.headerHeights.set(host, event.detail);
|
|
284
|
+
this.updateHeaderHeight();
|
|
146
285
|
}
|
|
147
|
-
|
|
148
|
-
|
|
286
|
+
updateHeaderHeight() {
|
|
287
|
+
for (const host of this.headerHeights.keys()) {
|
|
288
|
+
if (host.closest('br-table') !== this.el)
|
|
289
|
+
this.headerHeights.delete(host);
|
|
290
|
+
}
|
|
291
|
+
const multilevelHeader = this.el.querySelector('br-table-header[data-multilevel]');
|
|
292
|
+
const height = multilevelHeader?.getBoundingClientRect().height ??
|
|
293
|
+
Math.max(0, ...Array.from(this.headerHeights.values(), (entry) => entry.height));
|
|
294
|
+
if (height === this.measuredHeaderHeight)
|
|
295
|
+
return;
|
|
296
|
+
this.measuredHeaderHeight = height;
|
|
297
|
+
this.virtualList?.refreshViewport();
|
|
149
298
|
}
|
|
150
|
-
|
|
151
|
-
|
|
299
|
+
handleDropdownOpenChange(event) {
|
|
300
|
+
const dropdown = event.composedPath()[0];
|
|
301
|
+
if (!(dropdown instanceof HTMLElement) || dropdown.localName !== 'br-dropdown')
|
|
302
|
+
return;
|
|
303
|
+
if (findComposedOwner(dropdown, 'br-table') !== this.el)
|
|
304
|
+
return;
|
|
305
|
+
const menu = dropdown;
|
|
306
|
+
if (event.detail.open)
|
|
307
|
+
this.openDropdowns.add(menu);
|
|
308
|
+
else
|
|
309
|
+
this.openDropdowns.delete(menu);
|
|
152
310
|
}
|
|
153
|
-
|
|
154
|
-
|
|
311
|
+
handleCellFocusRegistration(event) {
|
|
312
|
+
if (event.detail.host.closest('br-table') !== this.el)
|
|
313
|
+
return;
|
|
314
|
+
this.keyboard.register(event.detail);
|
|
155
315
|
}
|
|
156
|
-
|
|
157
|
-
|
|
316
|
+
handleGridFocusIn(event) {
|
|
317
|
+
this.keyboard.focusIn(event);
|
|
158
318
|
}
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
*/
|
|
162
|
-
handleTableColumnWidthChange() {
|
|
163
|
-
this.updateColumnWidths();
|
|
319
|
+
handleGridFocusOut(event) {
|
|
320
|
+
this.keyboard.focusOut(event);
|
|
164
321
|
}
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
*/
|
|
168
|
-
handleDensityChange() {
|
|
169
|
-
this.applyDensity();
|
|
322
|
+
handleGridKeyDown(event) {
|
|
323
|
+
this.keyboard.keyDown(event);
|
|
170
324
|
}
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
this.
|
|
325
|
+
applyFooterPerPageChange(perPage) {
|
|
326
|
+
const nextPageSize = Math.max(1, Math.floor(perPage));
|
|
327
|
+
if (nextPageSize === this.resolvePageSize())
|
|
328
|
+
return;
|
|
329
|
+
this.pageSize = nextPageSize;
|
|
330
|
+
this.currentPage = 1;
|
|
331
|
+
this.brTablePageSizeChange.emit({ pageSize: nextPageSize });
|
|
176
332
|
}
|
|
177
333
|
/**
|
|
178
|
-
*
|
|
334
|
+
* Inicializa os controllers antes da primeira renderização completa.
|
|
179
335
|
*/
|
|
180
|
-
|
|
181
|
-
this.
|
|
336
|
+
componentWillLoad() {
|
|
337
|
+
this.keyboard = new TableKeyboardController(this.el, () => this.getKeyboardRows(), (cell) => {
|
|
338
|
+
const row = cell.closest('br-table-row');
|
|
339
|
+
const index = row === null ? -1 : this.getVirtualRows().indexOf(row);
|
|
340
|
+
this.virtualList.revealRow(index >= 0 ? index : null);
|
|
341
|
+
}, () => this.resolveConfiguredVisibleRows());
|
|
342
|
+
this.selection = new TableSelectionController({
|
|
343
|
+
host: this.el,
|
|
344
|
+
idPrefix: this.generatedHeaderPrefix,
|
|
345
|
+
getRows: () => this.dataStore.getRows(),
|
|
346
|
+
onChange: (detail) => {
|
|
347
|
+
this.selectedRowsCount = detail.selectedCount;
|
|
348
|
+
this.brTableSelectionChange.emit(detail);
|
|
349
|
+
},
|
|
350
|
+
});
|
|
351
|
+
this.expansion = new TableExpansionController({
|
|
352
|
+
host: this.el,
|
|
353
|
+
getRows: () => this.dataStore.getRows(),
|
|
354
|
+
onChange: (detail) => {
|
|
355
|
+
const virtualIndex = this.getVirtualRows().indexOf(detail.row);
|
|
356
|
+
if (virtualIndex >= 0)
|
|
357
|
+
this.virtualList?.invalidateRow(virtualIndex);
|
|
358
|
+
this.brTableRowExpansionChange.emit(detail);
|
|
359
|
+
},
|
|
360
|
+
});
|
|
361
|
+
this.virtualList = new TableVirtualListController({
|
|
362
|
+
getRows: () => this.getVirtualRows(),
|
|
363
|
+
getViewport: () => this.el.shadowRoot?.querySelector('.br-table-scroll') ?? null,
|
|
364
|
+
getStickyHeaderHeight: () => this.measuredHeaderHeight ?? 0,
|
|
365
|
+
renderRange: (range) => {
|
|
366
|
+
this.isRenderingData = true;
|
|
367
|
+
const offset = this.resolveVirtualRangeOffset();
|
|
368
|
+
this.runWithoutSelfMutations(() => this.dataStore.renderRange({
|
|
369
|
+
...range,
|
|
370
|
+
start: range.start + offset,
|
|
371
|
+
end: range.end + offset,
|
|
372
|
+
}));
|
|
373
|
+
this.isRenderingData = false;
|
|
374
|
+
},
|
|
375
|
+
visibleRows: () => this.resolveConfiguredVisibleRows(),
|
|
376
|
+
estimatedRowHeight: () => this.resolveVirtualRowHeight(),
|
|
377
|
+
estimatedExpandedHeight: () => this.virtualExpandedContentHeight,
|
|
378
|
+
onAfterRender: () => queueMicrotask(() => this.syncRenderedRange()),
|
|
379
|
+
});
|
|
182
380
|
}
|
|
183
381
|
/**
|
|
184
|
-
*
|
|
382
|
+
* Retoma a coordenação de densidade quando a tabela é reinserida.
|
|
185
383
|
*/
|
|
186
|
-
|
|
187
|
-
this.
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
this.
|
|
191
|
-
|
|
192
|
-
validateTooltipProps() {
|
|
193
|
-
void this.effectiveTooltipState;
|
|
194
|
-
void this.effectiveTooltipMode;
|
|
384
|
+
connectedCallback() {
|
|
385
|
+
if (this.structureObserver === undefined)
|
|
386
|
+
return;
|
|
387
|
+
this.observeStructureChanges();
|
|
388
|
+
this.updateActionDensities();
|
|
389
|
+
this.syncScrollShadows();
|
|
195
390
|
}
|
|
196
391
|
/**
|
|
197
|
-
*
|
|
198
|
-
* Inicializa os tokens visuais após a montagem do componente.
|
|
392
|
+
* Monta a estrutura derivada e registra os listeners de coordenação.
|
|
199
393
|
*/
|
|
200
394
|
componentDidLoad() {
|
|
201
|
-
this.
|
|
395
|
+
this.captureAndRenderInitialData();
|
|
396
|
+
this.syncHeaderSortState();
|
|
397
|
+
this.syncSelectionStructure();
|
|
398
|
+
this.syncExpansionStructure();
|
|
399
|
+
this.syncRowHoverState();
|
|
400
|
+
this.virtualList.connect();
|
|
401
|
+
this.virtualList.reset(false);
|
|
402
|
+
this.syncBarActionsContent();
|
|
403
|
+
this.annotateBoundaries();
|
|
404
|
+
this.registerColumnWidthListener();
|
|
405
|
+
this.registerAlignmentListener();
|
|
406
|
+
this.registerOverflowListener();
|
|
202
407
|
this.applyDensity();
|
|
408
|
+
this.updateActionDensities();
|
|
409
|
+
this.applyExpandedContentHeight();
|
|
203
410
|
this.applyDividers();
|
|
204
|
-
this.
|
|
205
|
-
// garante cálculo inicial após filhos renderizarem
|
|
411
|
+
this.observeStructureChanges();
|
|
206
412
|
queueMicrotask(() => {
|
|
207
413
|
this.updateColumnWidths();
|
|
208
414
|
this.updateAllCellAlignments();
|
|
209
415
|
this.updateAllCellOverflow();
|
|
210
416
|
this.applyAriaMetadata();
|
|
417
|
+
this.updateSelectionCount();
|
|
418
|
+
this.scheduleViewportHeightMeasurement();
|
|
419
|
+
this.updateScrollableContentState();
|
|
211
420
|
});
|
|
212
421
|
}
|
|
213
|
-
|
|
214
|
-
this.el.
|
|
215
|
-
this.el.
|
|
216
|
-
this.
|
|
217
|
-
|
|
218
|
-
disconnectedCallback() {
|
|
219
|
-
this.el.removeEventListener('brColumnWidthChange', this.handleColumnWidthEvent);
|
|
220
|
-
this.el.removeEventListener('brAlignmentChange', this.handleAlignmentEvent);
|
|
221
|
-
this.el.removeEventListener('brOverflowChange', this.handleOverflowEvent);
|
|
222
|
-
if (this.structureRefreshFrame !== null) {
|
|
223
|
-
cancelAnimationFrame(this.structureRefreshFrame);
|
|
224
|
-
this.structureRefreshFrame = null;
|
|
422
|
+
syncScrollShadows() {
|
|
423
|
+
const viewport = this.el.shadowRoot?.querySelector('.br-table-scroll');
|
|
424
|
+
const content = this.el.shadowRoot?.querySelector('.br-table-content');
|
|
425
|
+
if (!this.scrollShadows && viewport && content && viewport.parentElement) {
|
|
426
|
+
this.scrollShadows = new TableScrollShadows(viewport, content, viewport.parentElement);
|
|
225
427
|
}
|
|
428
|
+
this.scrollShadows?.update();
|
|
226
429
|
}
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
this.
|
|
230
|
-
}
|
|
231
|
-
/** Interrompe o estado de carregamento da tabela. */
|
|
232
|
-
async stopLoading() {
|
|
233
|
-
this.loading = false;
|
|
430
|
+
componentDidRender() {
|
|
431
|
+
this.syncScrollShadows();
|
|
432
|
+
this.updateScrollableContentState();
|
|
234
433
|
}
|
|
235
434
|
/**
|
|
236
|
-
*
|
|
435
|
+
* Libera o observer quando a tabela é removida do documento.
|
|
237
436
|
*/
|
|
238
|
-
|
|
239
|
-
this.
|
|
240
|
-
this.
|
|
241
|
-
this.
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
this.
|
|
246
|
-
this.
|
|
247
|
-
|
|
248
|
-
this.
|
|
249
|
-
if (!(column instanceof HTMLElement))
|
|
250
|
-
return;
|
|
251
|
-
const isLastColumn = columnIndex === columnCount - 1;
|
|
252
|
-
column.toggleAttribute('data-last-column', isLastColumn);
|
|
253
|
-
this.columnIndexes.set(column, columnIndex);
|
|
254
|
-
});
|
|
255
|
-
this.rows.forEach((row, rowIndex) => {
|
|
256
|
-
const isLastRow = rowIndex === this.rows.length - 1;
|
|
257
|
-
const rowCells = Array.from(row.querySelectorAll('br-table-cell, br-table-header-cell')).filter((cell) => findComposedOwner(cell, 'br-table-row') === row);
|
|
258
|
-
this.rowCells.set(row, rowCells);
|
|
259
|
-
rowCells.forEach((cell, columnIndex) => {
|
|
260
|
-
if (!(cell instanceof HTMLElement))
|
|
261
|
-
return;
|
|
262
|
-
const isLastColumn = columnIndex === columnCount - 1;
|
|
263
|
-
cell.toggleAttribute('data-last-row', isLastRow);
|
|
264
|
-
cell.toggleAttribute('data-last-column', isLastColumn);
|
|
265
|
-
this.columnIndexes.set(cell, columnIndex);
|
|
266
|
-
});
|
|
267
|
-
});
|
|
268
|
-
this.structureReady = true;
|
|
269
|
-
}
|
|
270
|
-
scheduleStructureRefresh() {
|
|
271
|
-
if (this.structureRefreshFrame !== null)
|
|
272
|
-
return;
|
|
273
|
-
this.structureRefreshFrame = requestAnimationFrame(() => {
|
|
274
|
-
this.structureRefreshFrame = null;
|
|
275
|
-
this.refreshStructure();
|
|
276
|
-
this.updateColumnWidths();
|
|
277
|
-
this.updateAllCellAlignments();
|
|
278
|
-
this.updateAllCellOverflow();
|
|
279
|
-
this.applyAriaMetadata();
|
|
280
|
-
});
|
|
437
|
+
disconnectedCallback() {
|
|
438
|
+
this.scrollShadows?.disconnect();
|
|
439
|
+
this.scrollShadows = undefined;
|
|
440
|
+
this.openDropdowns.clear();
|
|
441
|
+
this.keyboard?.disconnect();
|
|
442
|
+
this.structureObserver?.disconnect();
|
|
443
|
+
this.virtualList?.disconnect();
|
|
444
|
+
this.headerHeights.clear();
|
|
445
|
+
if (this.viewportMeasureFrame !== null)
|
|
446
|
+
cancelAnimationFrame(this.viewportMeasureFrame);
|
|
447
|
+
this.viewportMeasureFrame = null;
|
|
281
448
|
}
|
|
282
449
|
/**
|
|
283
|
-
*
|
|
284
|
-
* @returns void
|
|
450
|
+
* Recalcula o grid quando a largura padrão muda.
|
|
285
451
|
*/
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
if (headers.length === 0)
|
|
289
|
-
return;
|
|
290
|
-
const template = this.buildGridTemplate(headers);
|
|
291
|
-
this.applyGridTemplate(template);
|
|
452
|
+
handleTableColumnWidthChange() {
|
|
453
|
+
this.updateColumnWidths();
|
|
292
454
|
}
|
|
293
455
|
/**
|
|
294
|
-
*
|
|
295
|
-
* @param headers Os elementos de cabeçalho da tabela.
|
|
296
|
-
* @returns Uma string representando o template de grid CSS.
|
|
456
|
+
* Reaplica os tokens e recalcula a virtualização quando a densidade muda.
|
|
297
457
|
*/
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
458
|
+
handleDensityChange() {
|
|
459
|
+
this.invalidateViewportMetrics();
|
|
460
|
+
this.applyDensity();
|
|
461
|
+
this.updateActionDensities();
|
|
462
|
+
this.virtualList?.reset(false);
|
|
463
|
+
this.scheduleViewportHeightMeasurement();
|
|
302
464
|
}
|
|
303
465
|
/**
|
|
304
|
-
*
|
|
466
|
+
* Recalcula a viewport e a janela virtual quando a quantidade visível muda.
|
|
305
467
|
*/
|
|
306
|
-
|
|
307
|
-
|
|
468
|
+
handleVisibleRowsChange() {
|
|
469
|
+
this.syncVisibleRange(false);
|
|
308
470
|
}
|
|
309
|
-
/**
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
* @returns A largura resolvida da coluna.
|
|
314
|
-
*/
|
|
315
|
-
resolveColumnWidth(header, fallback) {
|
|
316
|
-
const headerWidth = header.getAttribute('column-width');
|
|
317
|
-
return this.resolveWidthToken(headerWidth, fallback, header);
|
|
471
|
+
/** Reinicia a janela virtual quando a paginação é alternada. */
|
|
472
|
+
handleHasPaginationChange() {
|
|
473
|
+
this.virtualList.reset(true);
|
|
474
|
+
this.scheduleViewportHeightMeasurement();
|
|
318
475
|
}
|
|
319
|
-
/**
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
* @return void
|
|
324
|
-
*/
|
|
325
|
-
resolveWidthToken(raw, fallback, host) {
|
|
326
|
-
if (raw !== undefined && raw !== '') {
|
|
327
|
-
const isValid = raw in COLUMN_WIDTH_MAP || positivePxValidator(raw) || positiveFrValidator(raw);
|
|
328
|
-
if (!isValid) {
|
|
329
|
-
reportInvalidPropValue(host, 'columnWidth', raw, 'Use `fill`, `content`, uma largura positiva em `px` ou uma fração positiva em `fr`.', `Aplicando fallback ${fallback}.`);
|
|
330
|
-
}
|
|
331
|
-
else {
|
|
332
|
-
clearInvalidPropWarning(host, 'columnWidth');
|
|
333
|
-
}
|
|
334
|
-
}
|
|
335
|
-
return resolveTokenValue(raw ?? undefined, {
|
|
336
|
-
fallback,
|
|
337
|
-
semanticMap: COLUMN_WIDTH_MAP,
|
|
338
|
-
validators: [positivePxValidator, positiveFrValidator],
|
|
339
|
-
});
|
|
476
|
+
/** Reinicia a janela virtual no subconjunto correspondente à página atual. */
|
|
477
|
+
handleCurrentPageChange() {
|
|
478
|
+
if (this.hasPagination)
|
|
479
|
+
this.virtualList.reset(true);
|
|
340
480
|
}
|
|
341
|
-
/**
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
this.
|
|
481
|
+
/** Reinicia a página e a janela virtual quando o tamanho lógico da página muda. */
|
|
482
|
+
handlePageSizeChange() {
|
|
483
|
+
if (!this.hasPagination)
|
|
484
|
+
return;
|
|
485
|
+
this.currentPage = 1;
|
|
486
|
+
this.virtualList.reset(true);
|
|
487
|
+
this.scheduleViewportHeightMeasurement();
|
|
347
488
|
}
|
|
348
|
-
/**
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
cells.forEach((cell) => {
|
|
354
|
-
this.updateAlignmentForCell(cell);
|
|
355
|
-
});
|
|
489
|
+
/** Normaliza a quantidade pública de linhas visíveis para o intervalo suportado. */
|
|
490
|
+
resolveConfiguredVisibleRows() {
|
|
491
|
+
if (!Number.isFinite(this.visibleRows))
|
|
492
|
+
return DEFAULT_VISIBLE_ROWS;
|
|
493
|
+
return Math.min(MAX_VISIBLE_ROWS, Math.max(MIN_VISIBLE_ROWS, Math.floor(this.visibleRows)));
|
|
356
494
|
}
|
|
357
|
-
/**
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
const
|
|
364
|
-
|
|
365
|
-
|
|
495
|
+
/** Quantidade total de itens usada pela paginação, priorizando o valor explícito. */
|
|
496
|
+
resolvePaginationTotalItems() {
|
|
497
|
+
return this.totalItems ?? this.dataStore.getItemCount();
|
|
498
|
+
}
|
|
499
|
+
/** Resolve o tamanho lógico da página sem acoplá-lo à altura da viewport. */
|
|
500
|
+
resolvePageSize() {
|
|
501
|
+
const rawPageSize = this.pageSize ?? this.resolveConfiguredVisibleRows();
|
|
502
|
+
if (!Number.isFinite(rawPageSize))
|
|
503
|
+
return this.resolveConfiguredVisibleRows();
|
|
504
|
+
return Math.max(1, Math.floor(rawPageSize));
|
|
505
|
+
}
|
|
506
|
+
/** Retorna a página normalizada para o total e o tamanho atuais. */
|
|
507
|
+
resolveCurrentPage() {
|
|
508
|
+
if (!this.hasPagination)
|
|
509
|
+
return 1;
|
|
510
|
+
const totalPages = Math.max(1, Math.ceil(this.resolvePaginationTotalItems() / this.resolvePageSize()));
|
|
511
|
+
return Math.min(Math.max(1, Math.floor(this.currentPage || 1)), totalPages);
|
|
366
512
|
}
|
|
367
513
|
/**
|
|
368
|
-
*
|
|
369
|
-
*
|
|
370
|
-
*
|
|
514
|
+
* Retorna o dataset lógico consumido pela lista virtual. Com paginação local,
|
|
515
|
+
* corresponde apenas ao slice da página; com paginação remota, corresponde
|
|
516
|
+
* ao subconjunto atualmente fornecido pelo consumidor.
|
|
371
517
|
*/
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
const
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
// Column (header)
|
|
383
|
-
const columnValue = this.getColumnAlignment(cell, 'horizontal-alignment');
|
|
384
|
-
if (columnValue !== null)
|
|
385
|
-
return this.resolveAlignmentToken(columnValue);
|
|
386
|
-
// Table
|
|
387
|
-
if (this.effectiveHorizontalAlignment !== undefined)
|
|
388
|
-
return this.resolveAlignmentToken(this.effectiveHorizontalAlignment);
|
|
389
|
-
// Fallback
|
|
390
|
-
return TABLE_ALIGNMENT_MAP[TABLE_ALIGNMENT.START];
|
|
518
|
+
getVirtualRows() {
|
|
519
|
+
const rows = this.dataStore.getRowsView();
|
|
520
|
+
if (!this.hasPagination)
|
|
521
|
+
return rows;
|
|
522
|
+
const totalItems = this.resolvePaginationTotalItems();
|
|
523
|
+
if (this.dataStore.getItemCount() < totalItems)
|
|
524
|
+
return rows;
|
|
525
|
+
const pageSize = this.resolvePageSize();
|
|
526
|
+
const range = this.dataStore.getPageRange((this.resolveCurrentPage() - 1) * pageSize, pageSize);
|
|
527
|
+
return this.dataStore.getRowsView(range.start, range.end);
|
|
391
528
|
}
|
|
392
529
|
/**
|
|
393
|
-
*
|
|
394
|
-
*
|
|
395
|
-
*
|
|
530
|
+
* Converte os índices locais da janela virtual para índices do dataset
|
|
531
|
+
* completo quando a paginação é realizada localmente.
|
|
532
|
+
*
|
|
533
|
+
* Na paginação remota, o data store contém somente a página fornecida pelo
|
|
534
|
+
* consumidor, portanto não há offset físico a aplicar ao renderRange.
|
|
396
535
|
*/
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
const
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
return TABLE_ALIGNMENT_MAP[TABLE_ALIGNMENT.START];
|
|
536
|
+
resolveVirtualRangeOffset() {
|
|
537
|
+
if (!this.hasPagination)
|
|
538
|
+
return 0;
|
|
539
|
+
const totalRows = this.dataStore.getItemCount();
|
|
540
|
+
const totalItems = this.resolvePaginationTotalItems();
|
|
541
|
+
if (totalRows < totalItems)
|
|
542
|
+
return 0;
|
|
543
|
+
return this.dataStore.getPageRange((this.resolveCurrentPage() - 1) * this.resolvePageSize(), this.resolvePageSize())
|
|
544
|
+
.start;
|
|
545
|
+
}
|
|
546
|
+
/** Atualiza a janela virtual; a paginação apenas altera seu dataset de entrada. */
|
|
547
|
+
syncVisibleRange(resetScroll) {
|
|
548
|
+
this.virtualList.reset(resetScroll);
|
|
411
549
|
}
|
|
412
550
|
/**
|
|
413
|
-
* Resolve
|
|
414
|
-
*
|
|
415
|
-
* @
|
|
551
|
+
* Resolve a altura-base estimada da linha a partir da densidade atual.
|
|
552
|
+
*
|
|
553
|
+
* @remarks A célula utiliza a densidade como padding vertical. A estimativa
|
|
554
|
+
* soma duas vezes esse padding a uma altura de conteúdo de uma linha (24px).
|
|
555
|
+
* Após a materialização, a lista virtual substitui a estimativa pela altura
|
|
556
|
+
* efetivamente medida.
|
|
416
557
|
*/
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
fallback:
|
|
420
|
-
semanticMap:
|
|
558
|
+
resolveVirtualRowHeight() {
|
|
559
|
+
const density = resolveTokenValue(this.density, {
|
|
560
|
+
fallback: TABLE_DENSITY_MAP[TABLE_DENSITY.MEDIUM],
|
|
561
|
+
semanticMap: TABLE_DENSITY_MAP,
|
|
421
562
|
});
|
|
563
|
+
const verticalPadding = Number.parseFloat(density);
|
|
564
|
+
return 24 + verticalPadding * 2;
|
|
422
565
|
}
|
|
423
566
|
/**
|
|
424
|
-
*
|
|
425
|
-
*
|
|
426
|
-
* @param attribute O atributo de alinhamento a ser obtido ('horizontal-alignment' ou 'vertical-alignment').
|
|
427
|
-
* @returns O valor do atributo de alinhamento da coluna, ou null se não estiver definido.
|
|
567
|
+
* Define a altura da região rolável pelo número de itens lógicos solicitado.
|
|
568
|
+
* Grupos contam como um item, mas reservam a altura de todas as suas linhas.
|
|
428
569
|
*/
|
|
429
|
-
|
|
430
|
-
const
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
const
|
|
434
|
-
const
|
|
435
|
-
|
|
570
|
+
resolveScrollViewportHeight() {
|
|
571
|
+
const estimatedRowHeight = this.resolveVirtualRowHeight();
|
|
572
|
+
const rowHeight = Math.max(this.measuredCollapsedRowHeight ?? 0, estimatedRowHeight);
|
|
573
|
+
const headerHeight = Math.max(this.measuredHeaderHeight ?? 0, rowHeight);
|
|
574
|
+
const rows = this.getVirtualRows();
|
|
575
|
+
const configuredHeightRows = this.heightRows !== undefined && Number.isFinite(this.heightRows)
|
|
576
|
+
? Math.max(1, Math.floor(this.heightRows))
|
|
577
|
+
: this.resolveConfiguredVisibleRows();
|
|
578
|
+
const logicalRows = Math.min(configuredHeightRows, this.dataStore.getItemCount());
|
|
579
|
+
const pageOffset = this.resolveVirtualRangeOffset();
|
|
580
|
+
const physicalRange = this.dataStore.getPageRange(pageOffset, logicalRows);
|
|
581
|
+
const physicalRows = rows.length === 0 ? 0 : Math.min(rows.length, physicalRange.end - pageOffset);
|
|
582
|
+
const dataRowsHeight = physicalRows * rowHeight;
|
|
583
|
+
return `${headerHeight + dataRowsHeight}px`;
|
|
436
584
|
}
|
|
437
585
|
/**
|
|
438
|
-
*
|
|
439
|
-
* @param cell A célula para a qual o índice da coluna deve ser obtido.
|
|
440
|
-
* @returns O índice da coluna correspondente à célula, ou -1 se a célula não estiver dentro de uma linha válida.
|
|
586
|
+
* Reaplica os divisores após qualquer mudança relacionada.
|
|
441
587
|
*/
|
|
442
|
-
|
|
443
|
-
|
|
588
|
+
handleDividerChange() {
|
|
589
|
+
this.applyDividers();
|
|
444
590
|
}
|
|
445
591
|
/**
|
|
446
|
-
*
|
|
447
|
-
* @return Array de larguras de coluna resolvidas.
|
|
592
|
+
* Recalcula os alinhamentos herdados de todas as células.
|
|
448
593
|
*/
|
|
449
|
-
|
|
450
|
-
|
|
594
|
+
handleAlignmentChange() {
|
|
595
|
+
this.updateAllCellAlignments();
|
|
451
596
|
}
|
|
452
597
|
/**
|
|
453
|
-
*
|
|
454
|
-
* @returns Um array contendo todas as células da tabela.
|
|
598
|
+
* Recalcula o overflow herdado de todas as células.
|
|
455
599
|
*/
|
|
456
|
-
|
|
457
|
-
|
|
600
|
+
handleOverflowChange() {
|
|
601
|
+
this.updateAllCellOverflow();
|
|
602
|
+
}
|
|
603
|
+
handleVirtualExpandedContentHeightChange() {
|
|
604
|
+
this.applyExpandedContentHeight();
|
|
605
|
+
this.syncVisibleRange(false);
|
|
458
606
|
}
|
|
459
607
|
/**
|
|
460
|
-
*
|
|
608
|
+
* Sincroniza a estrutura quando a seleção é habilitada ou desabilitada.
|
|
461
609
|
*/
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
});
|
|
470
|
-
headers.forEach((header, headerIndex) => {
|
|
471
|
-
const colIndex = String(headerIndex + 1);
|
|
472
|
-
const headerId = header.id || `${this.generatedHeaderPrefix}-${headerIndex + 1}`;
|
|
473
|
-
header.id = headerId;
|
|
474
|
-
header.setAttribute('aria-colindex', colIndex);
|
|
475
|
-
});
|
|
476
|
-
const bodyCells = this.cells.filter((cell) => cell.tagName === 'BR-TABLE-CELL');
|
|
477
|
-
bodyCells.forEach((cell) => {
|
|
478
|
-
const columnIndex = this.getColumnIndex(cell);
|
|
479
|
-
if (columnIndex === -1)
|
|
480
|
-
return;
|
|
481
|
-
const colIndex = String(columnIndex + 1);
|
|
482
|
-
const header = headers[columnIndex];
|
|
483
|
-
cell.setAttribute('aria-colindex', colIndex);
|
|
484
|
-
if (header !== undefined && header.id !== '') {
|
|
485
|
-
cell.setAttribute('aria-labelledby', header.id);
|
|
486
|
-
}
|
|
487
|
-
});
|
|
610
|
+
handleRowSelectionChange() {
|
|
611
|
+
this.syncSelectionStructure();
|
|
612
|
+
this.handleStructureChange();
|
|
613
|
+
}
|
|
614
|
+
/** Sincroniza a elegibilidade visual de hover das linhas. */
|
|
615
|
+
handleRowHoverChange() {
|
|
616
|
+
this.syncRowHoverState();
|
|
488
617
|
}
|
|
489
618
|
/**
|
|
490
|
-
*
|
|
619
|
+
* Sincroniza a estrutura quando a expansão é habilitada ou desabilitada.
|
|
491
620
|
*/
|
|
492
|
-
|
|
493
|
-
this.
|
|
494
|
-
this.updateOverflowForCell(cell);
|
|
495
|
-
});
|
|
621
|
+
handleRowExpansionChange() {
|
|
622
|
+
this.handleStructureChange();
|
|
496
623
|
}
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
this.
|
|
502
|
-
|
|
624
|
+
/** Normaliza o estado ativo quando o consumidor alterna entre multi e single-sort. */
|
|
625
|
+
handleSortModeChange() {
|
|
626
|
+
if (this.sortMode === TABLE_SORT_MODE.SINGLE && this.sorting.length > 1) {
|
|
627
|
+
const firstCriterion = this.getSortingByColumnOrder()[0];
|
|
628
|
+
this.sorting = firstCriterion === undefined ? [] : [firstCriterion];
|
|
629
|
+
this.applySorting(false);
|
|
503
630
|
}
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
631
|
+
}
|
|
632
|
+
/** Reaplica o estado atual quando a estratégia de ordenação muda. */
|
|
633
|
+
handleSortStrategyChange() {
|
|
634
|
+
if (this.dataStore.getColumns().length === 0)
|
|
508
635
|
return;
|
|
509
|
-
|
|
510
|
-
this.updateAllCellAlignments();
|
|
636
|
+
this.applySorting(false);
|
|
511
637
|
}
|
|
512
|
-
|
|
513
|
-
|
|
638
|
+
/** Consome solicitações emitidas pelo trigger de ordenação do cabeçalho. */
|
|
639
|
+
handleSortRequest(event) {
|
|
640
|
+
const header = event
|
|
641
|
+
.composedPath()
|
|
642
|
+
.find((node) => node instanceof HTMLElement &&
|
|
643
|
+
node.tagName.toLowerCase() === 'br-table-header-cell' &&
|
|
644
|
+
node.hasAttribute('sortable'));
|
|
645
|
+
if (header === undefined || header.closest('br-table') !== this.el)
|
|
514
646
|
return;
|
|
515
|
-
|
|
516
|
-
|
|
647
|
+
const columnIndex = this.dataStore.getColumns().indexOf(header);
|
|
648
|
+
if (columnIndex < 0)
|
|
517
649
|
return;
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
650
|
+
event.stopImmediatePropagation();
|
|
651
|
+
const nextSorting = this.resolveNextSorting(columnIndex);
|
|
652
|
+
const requestEvent = this.brTableSortRequest.emit({
|
|
653
|
+
mode: this.sortMode,
|
|
654
|
+
columnIndex,
|
|
655
|
+
currentSorting: this.getSortingByColumnOrder().map((criterion) => ({ ...criterion })),
|
|
656
|
+
nextSorting: nextSorting.map((criterion) => ({ ...criterion })),
|
|
657
|
+
});
|
|
658
|
+
if (requestEvent.defaultPrevented) {
|
|
523
659
|
return;
|
|
524
660
|
}
|
|
525
|
-
this.
|
|
661
|
+
this.sorting = nextSorting;
|
|
662
|
+
this.applySorting(true);
|
|
526
663
|
}
|
|
527
664
|
/**
|
|
528
|
-
*
|
|
529
|
-
* @param cell A célula para a qual os tokens de overflow devem ser atualizados.
|
|
665
|
+
* Encaminha mudanças dos checkboxes ao controller de seleção.
|
|
530
666
|
*/
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
const config = TABLE_OVERFLOW_MAP[mode];
|
|
534
|
-
cell.style.setProperty(TABLE_TOKENS.CELL_OVERFLOW, config.overflow);
|
|
535
|
-
cell.style.setProperty(TABLE_TOKENS.CELL_TEXT_OVERFLOW, config.textOverflow);
|
|
536
|
-
cell.style.setProperty(TABLE_TOKENS.CELL_WHITE_SPACE, config.whiteSpace);
|
|
537
|
-
// O atributo 'applied-overflow' deve sempre aparecer
|
|
538
|
-
cell.setAttribute('data-applied-overflow', mode);
|
|
667
|
+
handleSelectionCheckboxChange(event) {
|
|
668
|
+
this.selection.handleCheckboxChange(event);
|
|
539
669
|
}
|
|
540
670
|
/**
|
|
541
|
-
*
|
|
542
|
-
* @param cell A célula para a qual o token de overflow deve ser resolvido.
|
|
543
|
-
* @returns O valor do token de overflow resolvido para a célula, determinando o comportamento de overflow a ser aplicado.
|
|
671
|
+
* Consome ações internas de expansão e normaliza as demais ações.
|
|
544
672
|
*/
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
if (value === null) {
|
|
549
|
-
const row = findComposedOwner(cell, 'br-table-row');
|
|
550
|
-
value = row?.getAttribute('overflow') ?? null;
|
|
673
|
+
handleActionClick(event) {
|
|
674
|
+
if (event.target === this.el) {
|
|
675
|
+
return;
|
|
551
676
|
}
|
|
552
|
-
if (
|
|
553
|
-
|
|
677
|
+
if (this.expansion.handleActionClick(event)) {
|
|
678
|
+
event.stopImmediatePropagation();
|
|
679
|
+
event.stopPropagation();
|
|
680
|
+
return;
|
|
554
681
|
}
|
|
555
|
-
|
|
556
|
-
|
|
682
|
+
event.stopImmediatePropagation();
|
|
683
|
+
event.stopPropagation();
|
|
684
|
+
if (event.detail.type !== 'row') {
|
|
685
|
+
this.brTableActionClick.emit(event.detail);
|
|
686
|
+
return;
|
|
557
687
|
}
|
|
558
|
-
|
|
559
|
-
|
|
688
|
+
this.brTableActionClick.emit({
|
|
689
|
+
...event.detail,
|
|
690
|
+
rowIndex: this.resolveActionRowIndex(event),
|
|
691
|
+
});
|
|
692
|
+
}
|
|
693
|
+
/** Resolve o índice da linha associado à ação quando o contexto é `row`. */
|
|
694
|
+
resolveActionRowIndex(event) {
|
|
695
|
+
const row = event
|
|
696
|
+
.composedPath()
|
|
697
|
+
.find((node) => node instanceof HTMLElement && node.tagName.toLowerCase() === 'br-table-row');
|
|
698
|
+
if (row === undefined)
|
|
699
|
+
return undefined;
|
|
700
|
+
const rowIndex = this.getBodyRows().indexOf(row);
|
|
701
|
+
return rowIndex >= 0 ? rowIndex : undefined;
|
|
702
|
+
}
|
|
703
|
+
/** Inicia o estado visual de carregamento sem alterar os dados da tabela. */
|
|
704
|
+
async startLoading() {
|
|
705
|
+
this.loading = true;
|
|
706
|
+
}
|
|
707
|
+
/** Interrompe o estado visual de carregamento sem alterar os dados da tabela. */
|
|
708
|
+
async stopLoading() {
|
|
709
|
+
this.loading = false;
|
|
710
|
+
}
|
|
711
|
+
/**
|
|
712
|
+
* Substitui os dados lógicos da tabela e reconstrói seus subcomponentes.
|
|
713
|
+
*
|
|
714
|
+
* @remarks Esta é a mesma estrutura interna utilizada após a ingestão dos slots.
|
|
715
|
+
* @param data Colunas, linhas e ações que formarão a tabela.
|
|
716
|
+
* @example
|
|
717
|
+
* ```js
|
|
718
|
+
* const table = document.querySelector('br-table');
|
|
719
|
+
* await table.setData({
|
|
720
|
+
* columns: [],
|
|
721
|
+
* headerRows: [
|
|
722
|
+
* [{ content: 'Unidade', rowSpan: 2 }, { content: 'Equipe', colSpan: 2 }],
|
|
723
|
+
* [{ content: 'Nome', sortable: true }, { content: 'Cargo', sortable: true }],
|
|
724
|
+
* ],
|
|
725
|
+
* rows: [
|
|
726
|
+
* { rowGroup: 'brasilia', cells: [
|
|
727
|
+
* { content: 'Brasília', rowSpan: 2, rowHeader: true },
|
|
728
|
+
* { content: 'Ana' }, { content: 'Analista' },
|
|
729
|
+
* ] },
|
|
730
|
+
* { rowGroup: 'brasilia', cells: [{ content: 'Carlos' }, { content: 'Técnico' }] },
|
|
731
|
+
* ],
|
|
732
|
+
* });
|
|
733
|
+
* ```
|
|
734
|
+
*/
|
|
735
|
+
async setData(data) {
|
|
736
|
+
this.invalidateViewportMetrics();
|
|
737
|
+
const previousSorting = this.sorting.map((criterion) => ({ ...criterion }));
|
|
738
|
+
this.isRenderingData = true;
|
|
739
|
+
this.dataStore.replace(data);
|
|
740
|
+
this.dataStore.mount(this.el);
|
|
741
|
+
this.isRenderingData = false;
|
|
742
|
+
await Promise.resolve();
|
|
743
|
+
this.sorting = this.resolvePreservedSorting(previousSorting);
|
|
744
|
+
if (this.sorting.length > 0) {
|
|
745
|
+
this.applySorting(false);
|
|
560
746
|
}
|
|
561
|
-
|
|
747
|
+
else {
|
|
748
|
+
this.syncHeaderSortState();
|
|
749
|
+
this.syncSelectionStructure();
|
|
750
|
+
this.syncExpansionStructure();
|
|
751
|
+
this.syncRowHoverState();
|
|
752
|
+
this.syncVisibleRange(true);
|
|
753
|
+
this.handleStructureChange();
|
|
754
|
+
}
|
|
755
|
+
this.scheduleViewportHeightMeasurement();
|
|
756
|
+
}
|
|
757
|
+
/** Preserva apenas critérios que continuam válidos no novo dataset. */
|
|
758
|
+
resolvePreservedSorting(previousSorting) {
|
|
759
|
+
const columns = this.dataStore.getColumns();
|
|
760
|
+
const validSorting = previousSorting.filter(({ columnIndex }) => {
|
|
761
|
+
if (columnIndex < 0 || columnIndex >= columns.length)
|
|
762
|
+
return false;
|
|
763
|
+
return columns[columnIndex]?.hasAttribute('sortable') === true;
|
|
764
|
+
});
|
|
765
|
+
if (this.sortMode !== TABLE_SORT_MODE.MULTI) {
|
|
766
|
+
const first = validSorting[0];
|
|
767
|
+
return first === undefined ? [] : [first];
|
|
768
|
+
}
|
|
769
|
+
return [...validSorting].sort((a, b) => a.columnIndex - b.columnIndex);
|
|
562
770
|
}
|
|
563
771
|
/**
|
|
564
|
-
*
|
|
565
|
-
* @param cell A célula para a qual o atributo da coluna deve ser obtido.
|
|
566
|
-
* @param attribute O atributo específico a ser obtido da coluna (por exemplo, 'horizontal-alignment' ou 'vertical-alignment').
|
|
567
|
-
* @returns O valor do atributo da coluna correspondente à célula, ou null se não estiver definido.
|
|
772
|
+
* Captura a entrada declarativa inicial e a materializa a partir do modelo virtual.
|
|
568
773
|
*/
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
774
|
+
captureAndRenderInitialData() {
|
|
775
|
+
this.invalidateViewportMetrics();
|
|
776
|
+
this.isRenderingData = true;
|
|
777
|
+
this.dataStore.capture(this.el);
|
|
778
|
+
this.dataStore.mount(this.el);
|
|
779
|
+
this.isRenderingData = false;
|
|
572
780
|
}
|
|
573
781
|
/**
|
|
574
|
-
*
|
|
575
|
-
*
|
|
576
|
-
* @returns
|
|
782
|
+
* Retorna as linhas atualmente selecionadas.
|
|
783
|
+
*
|
|
784
|
+
* @returns Elementos `br-table-row` selecionados no corpo.
|
|
577
785
|
*/
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
if (index === -1)
|
|
581
|
-
return null;
|
|
582
|
-
const headers = this.getHeaderCells();
|
|
583
|
-
return headers[index] ?? null;
|
|
786
|
+
async getSelectedRows() {
|
|
787
|
+
return this.selection.getSelectedRows();
|
|
584
788
|
}
|
|
585
789
|
/**
|
|
586
|
-
*
|
|
790
|
+
* Seleciona todas as linhas elegíveis.
|
|
587
791
|
*/
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
792
|
+
async selectAllRows() {
|
|
793
|
+
this.selection.selectAll(true);
|
|
794
|
+
}
|
|
795
|
+
/**
|
|
796
|
+
* Limpa a seleção de todas as linhas elegíveis.
|
|
797
|
+
*/
|
|
798
|
+
async clearSelection() {
|
|
799
|
+
this.selection.clear();
|
|
800
|
+
}
|
|
801
|
+
/** Retorna o estado atual de ordenação aplicado na tabela. */
|
|
802
|
+
async getSorting() {
|
|
803
|
+
return this.getSortingByColumnOrder().map((criterion) => ({ ...criterion }));
|
|
804
|
+
}
|
|
805
|
+
/**
|
|
806
|
+
* Expande uma linha elegível do corpo.
|
|
807
|
+
*
|
|
808
|
+
* @param rowIndex Índice da linha, começando em zero.
|
|
809
|
+
*/
|
|
810
|
+
async expandRow(rowIndex) {
|
|
811
|
+
const row = this.getBodyRows()[rowIndex];
|
|
812
|
+
if (row !== undefined)
|
|
813
|
+
this.expansion.setExpanded(row, true);
|
|
814
|
+
}
|
|
815
|
+
/**
|
|
816
|
+
* Recolhe uma linha do corpo.
|
|
817
|
+
*
|
|
818
|
+
* @param rowIndex Índice da linha, começando em zero.
|
|
819
|
+
*/
|
|
820
|
+
async collapseRow(rowIndex) {
|
|
821
|
+
const row = this.getBodyRows()[rowIndex];
|
|
822
|
+
if (row !== undefined)
|
|
823
|
+
this.expansion.setExpanded(row, false);
|
|
824
|
+
}
|
|
825
|
+
/**
|
|
826
|
+
* Recolhe todas as linhas que estiverem expandidas.
|
|
827
|
+
*/
|
|
828
|
+
async collapseAllRows() {
|
|
829
|
+
this.expansion.collapseAll();
|
|
830
|
+
}
|
|
831
|
+
/** Resolve o próximo estado de ordenação para a coluna acionada. */
|
|
832
|
+
resolveNextSorting(columnIndex) {
|
|
833
|
+
const current = this.sorting.find((criterion) => criterion.columnIndex === columnIndex);
|
|
834
|
+
const nextDirection = current === undefined
|
|
835
|
+
? TABLE_SORT_DIRECTION.ASC
|
|
836
|
+
: current.direction === TABLE_SORT_DIRECTION.ASC
|
|
837
|
+
? TABLE_SORT_DIRECTION.DESC
|
|
838
|
+
: undefined;
|
|
839
|
+
if (this.sortMode !== TABLE_SORT_MODE.MULTI) {
|
|
840
|
+
return nextDirection === undefined ? [] : [{ columnIndex, direction: nextDirection }];
|
|
841
|
+
}
|
|
842
|
+
const nextSorting = this.sorting.filter((criterion) => criterion.columnIndex !== columnIndex);
|
|
843
|
+
if (nextDirection !== undefined)
|
|
844
|
+
nextSorting.push({ columnIndex, direction: nextDirection });
|
|
845
|
+
return nextSorting.sort((a, b) => a.columnIndex - b.columnIndex);
|
|
846
|
+
}
|
|
847
|
+
/** Mantém a prioridade do multi-sort estritamente da esquerda para a direita. */
|
|
848
|
+
getSortingByColumnOrder() {
|
|
849
|
+
return [...this.sorting].sort((a, b) => a.columnIndex - b.columnIndex);
|
|
850
|
+
}
|
|
851
|
+
/**
|
|
852
|
+
* Aplica a ordenação ao dataset completo e só então reinicia a janela virtual.
|
|
853
|
+
*/
|
|
854
|
+
applySorting(emitChange) {
|
|
855
|
+
this.sorting = this.getSortingByColumnOrder();
|
|
856
|
+
if (this.sortStrategy !== TABLE_SORT_STRATEGY.MANUAL) {
|
|
857
|
+
this.dataStore.sortRows(this.sorting);
|
|
858
|
+
}
|
|
859
|
+
this.syncHeaderSortState();
|
|
860
|
+
this.syncSelectionStructure();
|
|
861
|
+
this.syncExpansionStructure();
|
|
862
|
+
this.syncRowHoverState();
|
|
863
|
+
this.syncVisibleRange(true);
|
|
864
|
+
this.handleStructureChange();
|
|
865
|
+
if (emitChange) {
|
|
866
|
+
this.brTableSortChange.emit({
|
|
867
|
+
mode: this.sortMode,
|
|
868
|
+
sorting: this.sorting.map((criterion) => ({ ...criterion })),
|
|
869
|
+
rows: this.dataStore.getRows(),
|
|
870
|
+
});
|
|
871
|
+
}
|
|
872
|
+
}
|
|
873
|
+
/** Reflete o estado lógico nos cabeçalhos para atualizar ícones e semântica. */
|
|
874
|
+
syncHeaderSortState() {
|
|
875
|
+
this.dataStore.getColumns().forEach((header, columnIndex) => {
|
|
876
|
+
if (!header.hasAttribute('sortable')) {
|
|
877
|
+
header.removeAttribute('sort-direction');
|
|
878
|
+
header.removeAttribute('aria-sort');
|
|
879
|
+
return;
|
|
880
|
+
}
|
|
881
|
+
const criterion = this.sorting.find((entry) => entry.columnIndex === columnIndex);
|
|
882
|
+
if (criterion === undefined) {
|
|
883
|
+
header.removeAttribute('sort-direction');
|
|
884
|
+
header.setAttribute('aria-sort', 'none');
|
|
885
|
+
return;
|
|
886
|
+
}
|
|
887
|
+
header.setAttribute('sort-direction', criterion.direction);
|
|
888
|
+
header.setAttribute('aria-sort', criterion.direction === TABLE_SORT_DIRECTION.ASC ? 'ascending' : 'descending');
|
|
593
889
|
});
|
|
594
|
-
this.el.style.setProperty(TABLE_TOKENS.DENSITY, resolved);
|
|
595
890
|
}
|
|
596
891
|
/**
|
|
597
|
-
*
|
|
598
|
-
* (estilo e fatores de linha/coluna).
|
|
892
|
+
* Observa linhas adicionadas, removidas ou alteradas em tempo de execução.
|
|
599
893
|
*/
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
894
|
+
observeStructureChanges() {
|
|
895
|
+
this.structureObserver?.disconnect();
|
|
896
|
+
this.structureObserver = new MutationObserver((mutations) => this.handleStructureMutations(mutations));
|
|
897
|
+
this.structureObserver.observe(this.el, {
|
|
898
|
+
attributeFilter: [
|
|
899
|
+
'row-group',
|
|
900
|
+
'row-span',
|
|
901
|
+
'col-span',
|
|
902
|
+
'selected',
|
|
903
|
+
'disabled',
|
|
904
|
+
'row-expansion',
|
|
905
|
+
'expanded',
|
|
906
|
+
'virtual-expanded-content-height',
|
|
907
|
+
'aria-label',
|
|
908
|
+
'aria-labelledby',
|
|
909
|
+
'style',
|
|
910
|
+
'class',
|
|
911
|
+
],
|
|
912
|
+
attributes: true,
|
|
913
|
+
attributeOldValue: true,
|
|
914
|
+
childList: true,
|
|
915
|
+
subtree: true,
|
|
604
916
|
});
|
|
605
|
-
const rowFactor = (this.rowDivider ?? this.hasRowDivider) ? '1' : '0';
|
|
606
|
-
const columnFactor = (this.columnDivider ?? this.hasColumnDivider) ? '1' : '0';
|
|
607
|
-
this.el.style.setProperty(TABLE_TOKENS.DIVIDER_STYLE, style);
|
|
608
|
-
this.el.style.setProperty(TABLE_TOKENS.ROW_DIVIDER_FACTOR, rowFactor);
|
|
609
|
-
this.el.style.setProperty(TABLE_TOKENS.COLUMN_DIVIDER_FACTOR, columnFactor);
|
|
610
917
|
}
|
|
611
918
|
/**
|
|
612
|
-
*
|
|
613
|
-
*
|
|
614
|
-
* @returns Um objeto representando as classes CSS a serem aplicadas ao elemento da tabela.
|
|
919
|
+
* Processa mutações externas: estrutura completa quando linhas mudam e somente
|
|
920
|
+
* densidade quando a herança CSS dentro da tabela pode ter mudado.
|
|
615
921
|
*/
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
922
|
+
handleStructureMutations(mutations) {
|
|
923
|
+
if (mutations.some((mutation) => mutation.type === 'attributes' &&
|
|
924
|
+
mutation.target === this.el &&
|
|
925
|
+
(mutation.attributeName === 'aria-label' || mutation.attributeName === 'aria-labelledby'))) {
|
|
926
|
+
forceUpdate(this);
|
|
927
|
+
}
|
|
928
|
+
if (this.isRenderingData)
|
|
929
|
+
return;
|
|
930
|
+
if (mutations.some((mutation) => this.isRelevantStructureMutation(mutation))) {
|
|
931
|
+
this.handleStructureChange();
|
|
932
|
+
}
|
|
933
|
+
else if (mutations.some((mutation) => (mutation.type === 'childList' ||
|
|
934
|
+
mutation.attributeName === 'style' ||
|
|
935
|
+
(mutation.attributeName === 'class' && !isHydrationClassMutation(mutation))) &&
|
|
936
|
+
mutation.target instanceof HTMLElement &&
|
|
937
|
+
mutation.target.closest('br-table') === this.el)) {
|
|
938
|
+
this.updateActionDensities();
|
|
939
|
+
}
|
|
620
940
|
}
|
|
621
941
|
/**
|
|
622
|
-
*
|
|
942
|
+
* Executa escritas internas sem realimentar o observer estrutural.
|
|
623
943
|
*
|
|
624
|
-
* @
|
|
944
|
+
* @remarks Mutações externas já pendentes são preservadas e reprocessadas;
|
|
945
|
+
* somente os registros gerados durante `write` são descartados, pois quem
|
|
946
|
+
* escreve já sincroniza o estado derivado.
|
|
947
|
+
*/
|
|
948
|
+
runWithoutSelfMutations(write) {
|
|
949
|
+
const observer = this.structureObserver;
|
|
950
|
+
if (observer === undefined || this.selfMutationDepth > 0) {
|
|
951
|
+
write();
|
|
952
|
+
return;
|
|
953
|
+
}
|
|
954
|
+
const pending = observer.takeRecords();
|
|
955
|
+
this.selfMutationDepth++;
|
|
956
|
+
try {
|
|
957
|
+
write();
|
|
958
|
+
}
|
|
959
|
+
finally {
|
|
960
|
+
this.selfMutationDepth--;
|
|
961
|
+
observer.takeRecords();
|
|
962
|
+
if (pending.length > 0) {
|
|
963
|
+
queueMicrotask(() => {
|
|
964
|
+
if (this.structureObserver === observer)
|
|
965
|
+
this.handleStructureMutations(pending);
|
|
966
|
+
});
|
|
967
|
+
}
|
|
968
|
+
}
|
|
969
|
+
}
|
|
970
|
+
/**
|
|
971
|
+
* Determina se uma mutação exige sincronização estrutural da tabela.
|
|
972
|
+
*/
|
|
973
|
+
isRelevantStructureMutation(mutation) {
|
|
974
|
+
if (mutation.type === 'attributes') {
|
|
975
|
+
return this.handleRowAttributeMutation(mutation);
|
|
976
|
+
}
|
|
977
|
+
const changedNodes = Array.from(mutation.addedNodes).concat(Array.from(mutation.removedNodes));
|
|
978
|
+
return this.hasRowChangeInNodes(changedNodes);
|
|
979
|
+
}
|
|
980
|
+
/**
|
|
981
|
+
* Processa mutações de atributo aplicadas às linhas.
|
|
982
|
+
*/
|
|
983
|
+
handleGroupingMutation(mutation, target) {
|
|
984
|
+
const current = target.getAttribute(mutation.attributeName ?? '');
|
|
985
|
+
const unchanged = mutation.attributeName === 'row-group'
|
|
986
|
+
? (mutation.oldValue?.trim() || '') === (current?.trim() || '')
|
|
987
|
+
: resolveTableSpan(mutation.oldValue) === resolveTableSpan(current);
|
|
988
|
+
if (unchanged)
|
|
989
|
+
return false;
|
|
990
|
+
this.dataStore.invalidateGroups();
|
|
991
|
+
this.virtualList?.reset(false);
|
|
992
|
+
forceUpdate(this);
|
|
993
|
+
return true;
|
|
994
|
+
}
|
|
995
|
+
handleRowAttributeMutation(mutation) {
|
|
996
|
+
const target = mutation.target;
|
|
997
|
+
if (['row-group', 'row-span', 'col-span'].includes(mutation.attributeName ?? '')) {
|
|
998
|
+
return this.handleGroupingMutation(mutation, target);
|
|
999
|
+
}
|
|
1000
|
+
if (!target.matches('br-table-row'))
|
|
1001
|
+
return false;
|
|
1002
|
+
if (mutation.attributeName === 'style' || mutation.attributeName === 'class')
|
|
1003
|
+
return false;
|
|
1004
|
+
if (mutation.attributeName === 'row-expansion' &&
|
|
1005
|
+
(mutation.oldValue ?? TABLE_ROW_EXPANSION.INHERIT) ===
|
|
1006
|
+
(target.getAttribute('row-expansion') ?? TABLE_ROW_EXPANSION.INHERIT)) {
|
|
1007
|
+
return false;
|
|
1008
|
+
}
|
|
1009
|
+
if (mutation.attributeName === 'expanded' || mutation.attributeName === 'virtual-expanded-content-height') {
|
|
1010
|
+
const logicalIndex = Number(target.getAttribute('data-virtual-index')) - this.resolveVirtualRangeOffset();
|
|
1011
|
+
if (Number.isInteger(logicalIndex) && this.getVirtualRows()[logicalIndex] === target) {
|
|
1012
|
+
this.virtualList.invalidateRow(logicalIndex);
|
|
1013
|
+
}
|
|
1014
|
+
return mutation.attributeName === 'expanded';
|
|
1015
|
+
}
|
|
1016
|
+
return true;
|
|
1017
|
+
}
|
|
1018
|
+
/**
|
|
1019
|
+
* Verifica se os nós alterados impactam linhas da tabela.
|
|
1020
|
+
*/
|
|
1021
|
+
hasRowChangeInNodes(nodes) {
|
|
1022
|
+
return nodes.some((node) => node instanceof HTMLElement && (node.matches('br-table-row') || node.querySelector('br-table-row') !== null));
|
|
1023
|
+
}
|
|
1024
|
+
/**
|
|
1025
|
+
* Detecta a presença de ações atribuídas às barras.
|
|
1026
|
+
*/
|
|
1027
|
+
syncBarActionsContent() {
|
|
1028
|
+
const children = Array.from(this.el.children);
|
|
1029
|
+
this.hasGlobalActionsContent = children.some((child) => child.getAttribute('slot') === 'global-actions');
|
|
1030
|
+
this.hasContextualActionsContent = children.some((child) => child.getAttribute('slot') === 'contextual-actions');
|
|
1031
|
+
}
|
|
1032
|
+
/**
|
|
1033
|
+
* Atualiza o estado reativo usado pela barra contextual.
|
|
1034
|
+
*/
|
|
1035
|
+
updateSelectionCount() {
|
|
1036
|
+
this.selectedRowsCount = this.selection.getSelectedRows().length;
|
|
1037
|
+
}
|
|
1038
|
+
/**
|
|
1039
|
+
* Sincroniza células, checkboxes e estado da seleção.
|
|
1040
|
+
*/
|
|
1041
|
+
syncSelectionStructure() {
|
|
1042
|
+
this.selection.sync(this.hasRowSelection);
|
|
1043
|
+
this.updateSelectionCount();
|
|
1044
|
+
}
|
|
1045
|
+
/**
|
|
1046
|
+
* Sincroniza células, ações e estado da expansão.
|
|
1047
|
+
*/
|
|
1048
|
+
syncExpansionStructure() {
|
|
1049
|
+
this.expansion.sync(this.hasRowExpansion);
|
|
1050
|
+
}
|
|
1051
|
+
/** Aplica às linhas a marca consumida pelo estilo de hover das células. */
|
|
1052
|
+
syncRowHoverState() {
|
|
1053
|
+
this.dataStore.getRows().forEach((row) => {
|
|
1054
|
+
row.toggleAttribute('data-row-hover-enabled', this.hasRowHover);
|
|
1055
|
+
});
|
|
1056
|
+
}
|
|
1057
|
+
/**
|
|
1058
|
+
* Retorna somente as linhas pertencentes ao corpo da tabela.
|
|
625
1059
|
*/
|
|
626
|
-
|
|
627
|
-
return
|
|
1060
|
+
getBodyRows() {
|
|
1061
|
+
return this.dataStore.getRows();
|
|
1062
|
+
}
|
|
1063
|
+
/** Atualiza somente os elementos atualmente materializados pela lista virtual. */
|
|
1064
|
+
syncRenderedRange() {
|
|
1065
|
+
this.runWithoutSelfMutations(() => {
|
|
1066
|
+
this.annotateBoundaries();
|
|
1067
|
+
this.updateAllCellAlignments();
|
|
1068
|
+
this.updateAllCellOverflow();
|
|
1069
|
+
this.updateActionDensities();
|
|
1070
|
+
this.applyAriaMetadata();
|
|
1071
|
+
});
|
|
1072
|
+
this.updateScrollableContentState();
|
|
1073
|
+
}
|
|
1074
|
+
updateActionDensities() {
|
|
1075
|
+
const densities = this.getAllCells().map((cell) => ({
|
|
1076
|
+
cell,
|
|
1077
|
+
density: resolveTableDensityFromElement(cell),
|
|
1078
|
+
}));
|
|
1079
|
+
densities.forEach(({ cell, density }) => {
|
|
1080
|
+
if (cell.getAttribute('action-density') !== density)
|
|
1081
|
+
cell.setAttribute('action-density', density);
|
|
1082
|
+
cell.querySelectorAll('br-table-action').forEach((action) => {
|
|
1083
|
+
if (action.getAttribute('density') !== density)
|
|
1084
|
+
action.setAttribute('density', density);
|
|
1085
|
+
});
|
|
1086
|
+
});
|
|
1087
|
+
}
|
|
1088
|
+
updateScrollableContentState() {
|
|
1089
|
+
const viewport = this.el.shadowRoot?.querySelector('.br-table-scroll');
|
|
1090
|
+
const nextHasScrollableContent = viewport !== null &&
|
|
1091
|
+
viewport !== undefined &&
|
|
1092
|
+
(viewport.scrollHeight > viewport.clientHeight + 1 || viewport.scrollWidth > viewport.clientWidth + 1);
|
|
1093
|
+
if (this.hasScrollableContent !== nextHasScrollableContent) {
|
|
1094
|
+
this.hasScrollableContent = nextHasScrollableContent;
|
|
1095
|
+
}
|
|
628
1096
|
}
|
|
629
1097
|
/**
|
|
630
|
-
*
|
|
1098
|
+
* Mede cabeçalho e uma linha colapsada já renderizada para garantir que
|
|
1099
|
+
* `visibleRows` corresponda à quantidade real de linhas visíveis.
|
|
1100
|
+
* A estimativa baseada em densidade continua sendo usada somente antes da
|
|
1101
|
+
* primeira materialização.
|
|
1102
|
+
*/
|
|
1103
|
+
/**
|
|
1104
|
+
* Invalida as métricas que definem a altura externa da viewport.
|
|
631
1105
|
*
|
|
632
|
-
* @
|
|
1106
|
+
* @remarks A altura não deve ser recalculada durante o scroll, porque
|
|
1107
|
+
* diferentes janelas podem conter linhas com alturas distintas. Recalcular
|
|
1108
|
+
* nesse momento faria o próprio `br-table` crescer ou encolher e deslocaria
|
|
1109
|
+
* elementos externos à tabela.
|
|
633
1110
|
*/
|
|
634
|
-
|
|
635
|
-
|
|
1111
|
+
invalidateViewportMetrics() {
|
|
1112
|
+
this.measuredCollapsedRowHeight = null;
|
|
636
1113
|
}
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
1114
|
+
scheduleViewportHeightMeasurement() {
|
|
1115
|
+
if (this.measuredCollapsedRowHeight !== null && this.measuredHeaderHeight !== null)
|
|
1116
|
+
return;
|
|
1117
|
+
if (this.viewportMeasureFrame !== null)
|
|
1118
|
+
return;
|
|
1119
|
+
this.viewportMeasureFrame = requestAnimationFrame(() => {
|
|
1120
|
+
this.viewportMeasureFrame = null;
|
|
1121
|
+
for (const entry of this.headerHeights.values())
|
|
1122
|
+
entry.refresh();
|
|
1123
|
+
this.updateHeaderHeight();
|
|
1124
|
+
this.applyMeasuredViewportHeight();
|
|
1125
|
+
});
|
|
643
1126
|
}
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
1127
|
+
applyMeasuredViewportHeight() {
|
|
1128
|
+
const viewport = this.el.shadowRoot?.querySelector('.br-table-scroll');
|
|
1129
|
+
if (viewport === null || viewport === undefined)
|
|
1130
|
+
return;
|
|
1131
|
+
const referenceRow = this.dataStore.getRenderedRows().find((row) => !row.hasAttribute('expanded'));
|
|
1132
|
+
const measuredRowHeight = referenceRow === undefined
|
|
1133
|
+
? 0
|
|
1134
|
+
: Math.max(0, ...Array.from(referenceRow.querySelectorAll('br-table-cell'))
|
|
1135
|
+
.filter((cell) => Number(cell.getAttribute('aria-rowspan') ?? 1) <= 1)
|
|
1136
|
+
.map((cell) => cell.shadowRoot?.querySelector('.br-table-cell')?.getBoundingClientRect().height ?? 0));
|
|
1137
|
+
const rowHeight = measuredRowHeight > 0 ? measuredRowHeight : this.resolveVirtualRowHeight();
|
|
1138
|
+
const rowHeightChanged = this.measuredCollapsedRowHeight !== rowHeight;
|
|
1139
|
+
if (rowHeightChanged)
|
|
1140
|
+
this.measuredCollapsedRowHeight = rowHeight;
|
|
1141
|
+
// O JSX usa os valores medidos por meio de resolveScrollViewportHeight().
|
|
1142
|
+
// Mantê-los em @State evita que uma renderização posterior restaure a
|
|
1143
|
+
// estimativa baseada apenas na densidade.
|
|
648
1144
|
}
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
1145
|
+
/**
|
|
1146
|
+
* Marca limites de linha e coluna usados pelos estilos de divisores.
|
|
1147
|
+
*/
|
|
1148
|
+
/** Matriz lógica inclui células mescladas nas posições ocupadas. */
|
|
1149
|
+
getKeyboardRows() {
|
|
1150
|
+
const headerRows = Array.from(this.el.querySelectorAll('br-table-header > br-table-row'));
|
|
1151
|
+
const matrices = [
|
|
1152
|
+
getTablePlacements(headerRows, 'br-table-header-cell'),
|
|
1153
|
+
...getTableRowGroups(this.getVirtualRows()).map((group) => getTablePlacements(group, 'br-table-cell')),
|
|
1154
|
+
];
|
|
1155
|
+
return matrices.flatMap((placements) => {
|
|
1156
|
+
const matrix = [];
|
|
1157
|
+
for (const { cell, row, column, rowSpan, colSpan } of placements) {
|
|
1158
|
+
for (let y = row; y < row + rowSpan; y++) {
|
|
1159
|
+
matrix[y] ?? (matrix[y] = []);
|
|
1160
|
+
for (let x = column; x < column + colSpan; x++)
|
|
1161
|
+
matrix[y][x] = cell;
|
|
1162
|
+
}
|
|
1163
|
+
}
|
|
1164
|
+
return matrix.filter((row) => row.length > 0);
|
|
1165
|
+
});
|
|
1166
|
+
}
|
|
1167
|
+
syncHeaderGrouping() {
|
|
1168
|
+
applyTableHeaderLayout(this.el.querySelector('br-table-header'));
|
|
1169
|
+
}
|
|
1170
|
+
annotateBoundaries() {
|
|
1171
|
+
this.syncHeaderGrouping();
|
|
1172
|
+
const columns = this.getHeaderCells();
|
|
1173
|
+
const columnCount = columns.length;
|
|
1174
|
+
const logicalLastRow = this.dataStore.getRowCount() - 1;
|
|
1175
|
+
columns.forEach((column, columnIndex) => {
|
|
1176
|
+
if (!(column instanceof HTMLElement))
|
|
1177
|
+
return;
|
|
1178
|
+
column.toggleAttribute('data-last-column', columnIndex === columnCount - 1);
|
|
1179
|
+
});
|
|
1180
|
+
this.dataStore.getRenderedRows().forEach((row) => {
|
|
1181
|
+
const logicalIndex = Number(row.getAttribute('data-virtual-index'));
|
|
1182
|
+
const isLastRow = logicalIndex === logicalLastRow;
|
|
1183
|
+
const cells = Array.from(row.querySelectorAll('br-table-cell'));
|
|
1184
|
+
cells.forEach((cell, columnIndex) => {
|
|
1185
|
+
if (!(cell instanceof HTMLElement))
|
|
1186
|
+
return;
|
|
1187
|
+
cell.toggleAttribute('data-last-row', isLastRow);
|
|
1188
|
+
cell.toggleAttribute('data-last-column', columnIndex === columnCount - 1);
|
|
1189
|
+
});
|
|
1190
|
+
});
|
|
1191
|
+
}
|
|
1192
|
+
/**
|
|
1193
|
+
* Registra a coordenação de mudanças de largura emitidas pelas colunas.
|
|
1194
|
+
*/
|
|
1195
|
+
registerColumnWidthListener() {
|
|
1196
|
+
this.el.addEventListener('brColumnWidthChange', () => {
|
|
1197
|
+
this.updateColumnWidths();
|
|
1198
|
+
this.applyAriaMetadata();
|
|
1199
|
+
});
|
|
1200
|
+
}
|
|
1201
|
+
/**
|
|
1202
|
+
* Recalcula e aplica a definição de colunas do grid.
|
|
1203
|
+
*/
|
|
1204
|
+
updateColumnWidths() {
|
|
1205
|
+
const headers = this.getHeaderCells();
|
|
1206
|
+
if (headers.length === 0)
|
|
1207
|
+
return;
|
|
1208
|
+
const template = this.buildGridTemplate(headers);
|
|
1209
|
+
this.applyGridTemplate(template);
|
|
1210
|
+
}
|
|
1211
|
+
/**
|
|
1212
|
+
* Constrói o valor de `grid-template-columns` na ordem dos cabeçalhos.
|
|
1213
|
+
*/
|
|
1214
|
+
buildGridTemplate(headers) {
|
|
1215
|
+
const tableWidth = this.resolveTableColumnWidth();
|
|
1216
|
+
const columnWidths = headers.map((header) => this.resolveColumnWidth(header, tableWidth));
|
|
1217
|
+
return columnWidths.join(' ');
|
|
1218
|
+
}
|
|
1219
|
+
/**
|
|
1220
|
+
* Resolve a largura padrão declarada na tabela.
|
|
1221
|
+
*/
|
|
1222
|
+
resolveTableColumnWidth() {
|
|
1223
|
+
return this.resolveWidthToken(this.columnWidth, COLUMN_WIDTH_MAP[COLUMN_WIDTH_SEMANTICS.FILL]);
|
|
1224
|
+
}
|
|
1225
|
+
/**
|
|
1226
|
+
* Resolve a largura de uma coluna com fallback para a tabela.
|
|
1227
|
+
*/
|
|
1228
|
+
resolveColumnWidth(header, fallback) {
|
|
1229
|
+
const headerWidth = header.getAttribute('column-width');
|
|
1230
|
+
return this.resolveWidthToken(headerWidth, fallback);
|
|
1231
|
+
}
|
|
1232
|
+
/**
|
|
1233
|
+
* Valida e converte larguras semânticas ou valores CSS aceitos.
|
|
1234
|
+
*/
|
|
1235
|
+
resolveWidthToken(raw, fallback) {
|
|
1236
|
+
return resolveTokenValue(raw ?? undefined, {
|
|
1237
|
+
fallback,
|
|
1238
|
+
semanticMap: COLUMN_WIDTH_MAP,
|
|
1239
|
+
validators: [positivePxValidator, positiveFrValidator],
|
|
1240
|
+
});
|
|
1241
|
+
}
|
|
1242
|
+
/**
|
|
1243
|
+
* Publica a definição de colunas por meio do token do grid.
|
|
1244
|
+
*/
|
|
1245
|
+
applyGridTemplate(template) {
|
|
1246
|
+
this.el.style.setProperty(TABLE_TOKENS.COLUMN_WIDTHS, template);
|
|
1247
|
+
}
|
|
1248
|
+
/**
|
|
1249
|
+
* Registra a coordenação de mudanças de alinhamento emitidas pelos filhos.
|
|
1250
|
+
*/
|
|
1251
|
+
registerAlignmentListener() {
|
|
1252
|
+
this.el.addEventListener('brAlignmentChange', () => {
|
|
1253
|
+
this.updateAllCellAlignments();
|
|
1254
|
+
this.applyAriaMetadata();
|
|
1255
|
+
});
|
|
1256
|
+
}
|
|
1257
|
+
/**
|
|
1258
|
+
* Recalcula os alinhamentos efetivos de todas as células.
|
|
1259
|
+
*/
|
|
1260
|
+
updateAllCellAlignments() {
|
|
1261
|
+
const cells = this.getAllCells();
|
|
1262
|
+
cells.forEach((cell) => {
|
|
1263
|
+
this.updateAlignmentForCell(cell);
|
|
1264
|
+
});
|
|
1265
|
+
}
|
|
1266
|
+
/**
|
|
1267
|
+
* Aplica os alinhamentos efetivos como tokens locais da célula.
|
|
1268
|
+
*/
|
|
1269
|
+
updateAlignmentForCell(cell) {
|
|
1270
|
+
const horizontal = this.resolveHorizontalAlignmentForCell(cell);
|
|
1271
|
+
const vertical = this.resolveVerticalAlignmentForCell(cell);
|
|
1272
|
+
cell.style.setProperty(TABLE_TOKENS.HORIZONTAL_ALIGNMENT, horizontal);
|
|
1273
|
+
cell.style.setProperty(TABLE_TOKENS.VERTICAL_ALIGNMENT, vertical);
|
|
1274
|
+
}
|
|
1275
|
+
/**
|
|
1276
|
+
* Resolve o alinhamento horizontal conforme a hierarquia da tabela.
|
|
1277
|
+
*/
|
|
1278
|
+
resolveHorizontalAlignmentForCell(cell) {
|
|
1279
|
+
const cellValue = cell.getAttribute('horizontal-alignment');
|
|
1280
|
+
if (cellValue !== null)
|
|
1281
|
+
return this.resolveAlignmentToken(cellValue);
|
|
1282
|
+
const row = cell.closest('br-table-row');
|
|
1283
|
+
const rowValue = row?.getAttribute('horizontal-alignment');
|
|
1284
|
+
if (rowValue !== null)
|
|
1285
|
+
return this.resolveAlignmentToken(rowValue);
|
|
1286
|
+
const columnValue = this.getColumnAlignment(cell, 'horizontal-alignment');
|
|
1287
|
+
if (columnValue !== null)
|
|
1288
|
+
return this.resolveAlignmentToken(columnValue);
|
|
1289
|
+
if (this.horizontalAlignment !== undefined)
|
|
1290
|
+
return this.resolveAlignmentToken(this.horizontalAlignment);
|
|
1291
|
+
return TABLE_ALIGNMENT_MAP[TABLE_ALIGNMENT.START];
|
|
1292
|
+
}
|
|
1293
|
+
/**
|
|
1294
|
+
* Resolve o alinhamento vertical conforme a hierarquia da tabela.
|
|
1295
|
+
*/
|
|
1296
|
+
resolveVerticalAlignmentForCell(cell) {
|
|
1297
|
+
const cellValue = cell.getAttribute('vertical-alignment');
|
|
1298
|
+
if (cellValue !== null)
|
|
1299
|
+
return this.resolveAlignmentToken(cellValue);
|
|
1300
|
+
const row = cell.closest('br-table-row');
|
|
1301
|
+
const rowValue = row?.getAttribute('vertical-alignment');
|
|
1302
|
+
if (rowValue !== null)
|
|
1303
|
+
return this.resolveAlignmentToken(rowValue);
|
|
1304
|
+
const columnValue = this.getColumnAlignment(cell, 'vertical-alignment');
|
|
1305
|
+
if (columnValue !== null)
|
|
1306
|
+
return this.resolveAlignmentToken(columnValue);
|
|
1307
|
+
if (this.verticalAlignment !== undefined)
|
|
1308
|
+
return this.resolveAlignmentToken(this.verticalAlignment);
|
|
1309
|
+
return TABLE_ALIGNMENT_MAP[TABLE_ALIGNMENT.START];
|
|
1310
|
+
}
|
|
1311
|
+
/**
|
|
1312
|
+
* Converte um alinhamento semântico no valor CSS correspondente.
|
|
1313
|
+
*/
|
|
1314
|
+
resolveAlignmentToken(value) {
|
|
1315
|
+
return resolveTokenValue(value ?? undefined, {
|
|
1316
|
+
fallback: TABLE_ALIGNMENT_MAP[TABLE_ALIGNMENT.START],
|
|
1317
|
+
semanticMap: TABLE_ALIGNMENT_MAP,
|
|
1318
|
+
});
|
|
1319
|
+
}
|
|
1320
|
+
/**
|
|
1321
|
+
* Obtém um atributo herdável no cabeçalho da coluna correspondente.
|
|
1322
|
+
*/
|
|
1323
|
+
getColumnAlignment(cell, attribute) {
|
|
1324
|
+
const columnIndex = this.getColumnIndex(cell);
|
|
1325
|
+
if (columnIndex === -1)
|
|
1326
|
+
return null;
|
|
1327
|
+
const headers = this.getHeaderCells();
|
|
1328
|
+
const header = headers[columnIndex];
|
|
1329
|
+
return header?.getAttribute(attribute) ?? null;
|
|
1330
|
+
}
|
|
1331
|
+
/**
|
|
1332
|
+
* Retorna a posição de uma célula dentro de sua linha.
|
|
1333
|
+
*/
|
|
1334
|
+
getColumnIndex(cell) {
|
|
1335
|
+
const row = cell.closest('br-table-row');
|
|
1336
|
+
if (row === null)
|
|
1337
|
+
return -1;
|
|
1338
|
+
const group = row.parentElement?.hasAttribute('data-table-row-group')
|
|
1339
|
+
? Array.from(row.parentElement.querySelectorAll(':scope > br-table-row'))
|
|
1340
|
+
: [row];
|
|
1341
|
+
return getTablePlacements(group, 'br-table-cell').find((entry) => entry.cell === cell)?.column ?? -1;
|
|
1342
|
+
}
|
|
1343
|
+
/**
|
|
1344
|
+
* Retorna os cabeçalhos na ordem visual do grid.
|
|
1345
|
+
*/
|
|
1346
|
+
getHeaderCells() {
|
|
1347
|
+
return getTableLeafHeaders(Array.from(this.el.querySelectorAll('br-table-header > br-table-row')));
|
|
1348
|
+
}
|
|
1349
|
+
/**
|
|
1350
|
+
* Retorna células de cabeçalho e de dados.
|
|
1351
|
+
*/
|
|
1352
|
+
getAllCells() {
|
|
1353
|
+
return Array.from(this.el.querySelectorAll('br-table-cell, br-table-header-cell'));
|
|
1354
|
+
}
|
|
1355
|
+
/**
|
|
1356
|
+
* Registra a coordenação de mudanças de overflow emitidas pelos filhos.
|
|
1357
|
+
*/
|
|
1358
|
+
registerOverflowListener() {
|
|
1359
|
+
this.el.addEventListener('brOverflowChange', () => {
|
|
1360
|
+
this.updateAllCellOverflow();
|
|
1361
|
+
this.applyAriaMetadata();
|
|
1362
|
+
});
|
|
1363
|
+
}
|
|
1364
|
+
/**
|
|
1365
|
+
* Aplica contagens e índices ARIA à estrutura atual.
|
|
1366
|
+
*/
|
|
1367
|
+
applyAriaMetadata() {
|
|
1368
|
+
this.syncHeaderGrouping();
|
|
1369
|
+
const headerRows = Array.from(this.el.querySelectorAll('br-table-header > br-table-row'));
|
|
1370
|
+
const bodyRows = this.dataStore.getRenderedRows();
|
|
1371
|
+
const tableGrid = this.el.shadowRoot?.querySelector('.br-table-content');
|
|
1372
|
+
const grouped = this.dataStore.getItemCount() !== this.dataStore.getRowCount();
|
|
1373
|
+
const remote = this.hasPagination && this.dataStore.getItemCount() < this.resolvePaginationTotalItems();
|
|
1374
|
+
const logicalRowCount = remote ? this.resolvePaginationTotalItems() : this.dataStore.getRowCount();
|
|
1375
|
+
tableGrid?.setAttribute('aria-colcount', String(this.getHeaderCells().length));
|
|
1376
|
+
tableGrid?.setAttribute('aria-rowcount', grouped && remote ? '-1' : String(logicalRowCount + headerRows.length));
|
|
1377
|
+
headerRows.forEach((row, index) => {
|
|
1378
|
+
row.setAttribute('aria-rowindex', String(index + 1));
|
|
1379
|
+
});
|
|
1380
|
+
const headerPlacements = getTablePlacements(headerRows, 'br-table-header-cell');
|
|
1381
|
+
headerPlacements.forEach(({ cell, column }, index) => {
|
|
1382
|
+
cell.id || (cell.id = `${this.generatedHeaderPrefix}-${index + 1}`);
|
|
1383
|
+
cell.setAttribute('aria-colindex', String(column + 1));
|
|
1384
|
+
});
|
|
1385
|
+
bodyRows.forEach((row) => {
|
|
1386
|
+
const offset = remote && !grouped ? (this.resolveCurrentPage() - 1) * this.resolvePageSize() : 0;
|
|
1387
|
+
const logicalIndex = Number(row.getAttribute('data-virtual-index'));
|
|
1388
|
+
if (grouped && remote)
|
|
1389
|
+
row.removeAttribute('aria-rowindex');
|
|
1390
|
+
else
|
|
1391
|
+
row.setAttribute('aria-rowindex', String(logicalIndex + offset + headerRows.length + 1));
|
|
1392
|
+
});
|
|
1393
|
+
for (const group of getTableRowGroups(bodyRows)) {
|
|
1394
|
+
for (const { cell, column, rowSpan, colSpan } of getTablePlacements(group, 'br-table-cell')) {
|
|
1395
|
+
cell.setAttribute('aria-colindex', String(column + 1));
|
|
1396
|
+
if (rowSpan > 1)
|
|
1397
|
+
cell.setAttribute('aria-rowspan', String(rowSpan));
|
|
1398
|
+
else
|
|
1399
|
+
cell.removeAttribute('aria-rowspan');
|
|
1400
|
+
if (colSpan > 1)
|
|
1401
|
+
cell.setAttribute('aria-colspan', String(colSpan));
|
|
1402
|
+
else
|
|
1403
|
+
cell.removeAttribute('aria-colspan');
|
|
1404
|
+
}
|
|
1405
|
+
}
|
|
1406
|
+
this.keyboard?.sync();
|
|
1407
|
+
}
|
|
1408
|
+
/**
|
|
1409
|
+
* Recalcula o overflow efetivo de todas as células.
|
|
1410
|
+
*/
|
|
1411
|
+
updateAllCellOverflow() {
|
|
1412
|
+
this.getAllCells().forEach((cell) => {
|
|
1413
|
+
this.updateOverflowForCell(cell);
|
|
1414
|
+
});
|
|
1415
|
+
}
|
|
1416
|
+
/**
|
|
1417
|
+
* Aplica a configuração efetiva de overflow como tokens locais.
|
|
1418
|
+
*/
|
|
1419
|
+
updateOverflowForCell(cell) {
|
|
1420
|
+
const mode = this.resolveOverflowForCell(cell);
|
|
1421
|
+
const config = TABLE_OVERFLOW_MAP[mode];
|
|
1422
|
+
cell.style.setProperty(TABLE_TOKENS.CELL_OVERFLOW, config.overflow);
|
|
1423
|
+
cell.style.setProperty(TABLE_TOKENS.CELL_TEXT_OVERFLOW, config.textOverflow);
|
|
1424
|
+
cell.style.setProperty(TABLE_TOKENS.CELL_WHITE_SPACE, config.whiteSpace);
|
|
1425
|
+
cell.setAttribute('data-applied-overflow', mode);
|
|
1426
|
+
}
|
|
1427
|
+
/**
|
|
1428
|
+
* Resolve o overflow conforme célula, linha, coluna e tabela.
|
|
1429
|
+
*/
|
|
1430
|
+
resolveOverflowForCell(cell) {
|
|
1431
|
+
let value = cell.getAttribute('overflow');
|
|
1432
|
+
if (value === null) {
|
|
1433
|
+
const row = cell.closest('br-table-row');
|
|
1434
|
+
value = row?.getAttribute('overflow') ?? null;
|
|
1435
|
+
}
|
|
1436
|
+
if (value === null) {
|
|
1437
|
+
value = this.getColumnAttribute(cell, 'overflow') ?? null;
|
|
1438
|
+
}
|
|
1439
|
+
if (value === null) {
|
|
1440
|
+
value = this.overflow ?? null;
|
|
1441
|
+
}
|
|
1442
|
+
if (value === null) {
|
|
1443
|
+
value = TABLE_OVERFLOW.WRAP;
|
|
1444
|
+
}
|
|
1445
|
+
return value === TABLE_OVERFLOW.TRUNCATE ? TABLE_OVERFLOW.TRUNCATE : TABLE_OVERFLOW.WRAP;
|
|
1446
|
+
}
|
|
1447
|
+
/**
|
|
1448
|
+
* Obtém um atributo no cabeçalho correspondente à célula.
|
|
1449
|
+
*/
|
|
1450
|
+
getColumnAttribute(cell, attribute) {
|
|
1451
|
+
const header = this.getHeaderForCell(cell);
|
|
1452
|
+
return header?.getAttribute(attribute) ?? null;
|
|
1453
|
+
}
|
|
1454
|
+
/**
|
|
1455
|
+
* Localiza o cabeçalho que ocupa a mesma coluna da célula.
|
|
1456
|
+
*/
|
|
1457
|
+
getHeaderForCell(cell) {
|
|
1458
|
+
const index = this.getColumnIndex(cell);
|
|
1459
|
+
if (index === -1)
|
|
1460
|
+
return null;
|
|
1461
|
+
const headers = this.getHeaderCells();
|
|
1462
|
+
return headers[index] ?? null;
|
|
1463
|
+
}
|
|
1464
|
+
/** Publica a altura padrão da área expandida para herança pelas linhas. */
|
|
1465
|
+
applyExpandedContentHeight() {
|
|
1466
|
+
const value = Number.isFinite(this.virtualExpandedContentHeight)
|
|
1467
|
+
? Math.max(1, this.virtualExpandedContentHeight)
|
|
1468
|
+
: 240;
|
|
1469
|
+
this.el.style.setProperty(TABLE_TOKENS.EXPANDED_CONTENT_HEIGHT, `${value}px`);
|
|
1470
|
+
}
|
|
1471
|
+
/**
|
|
1472
|
+
* Converte a densidade semântica em tokens de espaçamento.
|
|
1473
|
+
*/
|
|
1474
|
+
applyDensity() {
|
|
1475
|
+
const resolved = resolveTokenValue(this.density, {
|
|
1476
|
+
fallback: TABLE_DENSITY_MAP[TABLE_DENSITY.MEDIUM],
|
|
1477
|
+
semanticMap: TABLE_DENSITY_MAP,
|
|
1478
|
+
});
|
|
1479
|
+
const resolvedToolbarPadding = resolveTokenValue(this.density, {
|
|
1480
|
+
fallback: TABLE_BAR_PADDING_MAP[TABLE_DENSITY.MEDIUM],
|
|
1481
|
+
semanticMap: TABLE_BAR_PADDING_MAP,
|
|
1482
|
+
});
|
|
1483
|
+
this.el.style.setProperty(TABLE_TOKENS.DENSITY, resolved);
|
|
1484
|
+
this.el.style.setProperty(TABLE_TOKENS.BAR_PADDING, resolvedToolbarPadding);
|
|
1485
|
+
}
|
|
1486
|
+
/**
|
|
1487
|
+
* Aplica estilo e fatores de visibilidade dos divisores.
|
|
1488
|
+
*/
|
|
1489
|
+
applyDividers() {
|
|
1490
|
+
const style = resolveTokenValue(this.dividerStyle, {
|
|
1491
|
+
fallback: TABLE_DIVIDER_STYLE_MAP[TABLE_DIVIDER_STYLE.SOLID],
|
|
1492
|
+
semanticMap: TABLE_DIVIDER_STYLE_MAP,
|
|
1493
|
+
});
|
|
1494
|
+
const rowFactor = (this.rowDivider ?? this.hasRowDivider) ? '1' : '0';
|
|
1495
|
+
const columnFactor = (this.columnDivider ?? this.hasColumnDivider) ? '1' : '0';
|
|
1496
|
+
this.el.style.setProperty(TABLE_TOKENS.DIVIDER_STYLE, style);
|
|
1497
|
+
this.el.style.setProperty(TABLE_TOKENS.ROW_DIVIDER_FACTOR, rowFactor);
|
|
1498
|
+
this.el.style.setProperty(TABLE_TOKENS.COLUMN_DIVIDER_FACTOR, columnFactor);
|
|
1499
|
+
}
|
|
1500
|
+
/**
|
|
1501
|
+
* Renderiza barras, slots e o grid principal.
|
|
1502
|
+
*
|
|
1503
|
+
* @remarks `role="grid"` fica isolado no contêiner que só possui os dois
|
|
1504
|
+
* elementos `role="rowgroup"` como filhos; a barra de ações e o rodapé
|
|
1505
|
+
* ficam fora dessa árvore para não serem contados como filhos inválidos do
|
|
1506
|
+
* papel `grid`. O nome acessível vai como `aria-label` (string), pois um
|
|
1507
|
+
* `aria-labelledby` não resolveria um id do light DOM a partir da shadow tree.
|
|
1508
|
+
*/
|
|
1509
|
+
renderContent(accessibleName) {
|
|
1510
|
+
return (h(Fragment, null, h("br-table-bar", { "prop:density": this.density ?? TABLE_DENSITY.MEDIUM, "prop:heading": this.heading ?? '', "prop:headingActionsLimit": this.headingActionsLimit, "prop:contextualActionsLimit": this.contextualActionsLimit, "prop:hasGlobalActionsContent": this.hasGlobalActionsContent, "prop:hasContextualActionsContent": this.hasContextualActionsContent, "prop:selectedRowsCount": this.selectedRowsCount, "prop:showContextualBar": this.showContextualBar || this.selectedRowsCount > 0, "prop:hasSearch": this.hasSearch, "attr:data-br-table-heading-actions-tooltip-label": this.moreActionsHeadingLabel, "attr:data-br-table-contextual-actions-tooltip-label": this.moreActionsContextualLabel, style: {
|
|
1511
|
+
[TABLE_TOKENS.DENSITY]: resolveTokenValue(this.density, {
|
|
1512
|
+
fallback: TABLE_DENSITY_MAP[TABLE_DENSITY.MEDIUM],
|
|
1513
|
+
semanticMap: TABLE_DENSITY_MAP,
|
|
1514
|
+
}),
|
|
1515
|
+
} }, h("slot", { name: "global-actions", slot: "global-actions" }), h("slot", { name: "contextual-actions", slot: "contextual-actions" })), h("div", { class: { 'br-table-scroll-shell': true, loading: this.loading }, style: {
|
|
1516
|
+
height: this.resolveScrollViewportHeight(),
|
|
1517
|
+
'--table-scroll-header-height': `${this.measuredHeaderHeight ?? 0}px`,
|
|
1518
|
+
} }, h("div", { class: "br-table-scroll", part: "scroll-container", style: { height: this.resolveScrollViewportHeight() }, onScroll: this.handleViewportScroll }, h("div", { class: { 'br-table-content': true, loading: this.loading }, role: "grid", "aria-label": accessibleName, "aria-multiselectable": this.hasRowSelection ? 'true' : null, "aria-busy": this.loading ? 'true' : null, "aria-hidden": this.loading && this.dataStore.getRowCount() === 0 && this.dataStore.getColumns().length === 0
|
|
1519
|
+
? 'true'
|
|
1520
|
+
: null, part: "content" }, h("slot", { name: "header", onSlotchange: this.handleStructureChange }), h("slot", { name: "body", onSlotchange: this.handleStructureChange }))))));
|
|
1521
|
+
}
|
|
1522
|
+
/** Resolve o nome acessível do papel `grid`, sempre como texto plano. */
|
|
1523
|
+
resolveAccessibleGridName() {
|
|
1524
|
+
const explicitLabelledby = this.el.getAttribute('aria-labelledby')?.trim();
|
|
1525
|
+
const root = this.el.getRootNode();
|
|
1526
|
+
if (explicitLabelledby && (root instanceof Document || root instanceof ShadowRoot)) {
|
|
1527
|
+
const referencedText = explicitLabelledby
|
|
1528
|
+
.split(/\s+/)
|
|
1529
|
+
.map((id) => root.getElementById(id)?.textContent?.trim())
|
|
1530
|
+
.filter(Boolean)
|
|
1531
|
+
.join(' ')
|
|
1532
|
+
.replace(/\s+/g, ' ');
|
|
1533
|
+
if (referencedText.length > 0)
|
|
1534
|
+
return referencedText;
|
|
1535
|
+
}
|
|
1536
|
+
const explicitLabel = this.el.getAttribute('aria-label')?.trim();
|
|
1537
|
+
if (explicitLabel)
|
|
1538
|
+
return explicitLabel;
|
|
1539
|
+
return this.heading?.trim() || 'Tabela';
|
|
1540
|
+
}
|
|
1541
|
+
/**
|
|
1542
|
+
* Renderiza o componente com semântica ARIA de grid.
|
|
1543
|
+
*/
|
|
1544
|
+
render() {
|
|
1545
|
+
return (h(Host, { key: 'a8583b9c76f2d800732bae952ec638fb9960ee81', "aria-busy": this.loading ? 'true' : null }, h("div", { key: '22bce3d4db20241d4fb03e792e0b3c5ee2dabcaf', class: "br-table", part: "container" }, this.renderContent(this.resolveAccessibleGridName())), this.hasPagination && (h("br-table-footer", { key: '4bf01e2f882971c10159c5f2a9d7ce78fcd1db9a', part: "footer", "prop:currentPage": this.currentPage, "prop:pageSize": this.resolvePageSize(), pageSizeOptions: this.pageSizeOptions, "prop:totalItems": this.resolvePaginationTotalItems(), "prop:density": this.density ?? 'medium', "attr:has-scroll": this.hasScrollableContent ? '' : null, onBrInternalTableFooterPageChange: this.handleFooterPageChange, onBrInternalTableFooterPerPageChange: this.handleFooterPerPageChange })), this.loading ? (h("div", { part: "loading", role: "status", "aria-live": "polite" }, h("div", { class: "br-table-loading-panel", role: "region", "aria-label": "Carregamento da tabela", tabIndex: 0 }, h("slot", { name: "loading" }, h("br-loading", { density: "medium", label: "Carregando dados", labelPosition: "bottom" }))))) : null));
|
|
1546
|
+
}
|
|
1547
|
+
static get is() { return "br-table"; }
|
|
1548
|
+
static get encapsulation() { return "shadow"; }
|
|
1549
|
+
static get originalStyleUrls() {
|
|
1550
|
+
return {
|
|
1551
|
+
"$": ["table.scss"]
|
|
1552
|
+
};
|
|
1553
|
+
}
|
|
1554
|
+
static get styleUrls() {
|
|
1555
|
+
return {
|
|
1556
|
+
"$": ["table.css"]
|
|
1557
|
+
};
|
|
1558
|
+
}
|
|
1559
|
+
static get properties() {
|
|
1560
|
+
return {
|
|
1561
|
+
"columnWidth": {
|
|
1562
|
+
"type": "string",
|
|
1563
|
+
"mutable": false,
|
|
1564
|
+
"complexType": {
|
|
1565
|
+
"original": "ColumnWidth",
|
|
1566
|
+
"resolved": "\"content\" | \"fill\" | `${number}fr` | `${number}px`",
|
|
1567
|
+
"references": {
|
|
1568
|
+
"ColumnWidth": {
|
|
1569
|
+
"location": "import",
|
|
1570
|
+
"path": "./table.types",
|
|
1571
|
+
"id": "src/components/table/table.types.ts::ColumnWidth",
|
|
1572
|
+
"referenceLocation": "ColumnWidth"
|
|
1573
|
+
}
|
|
1574
|
+
}
|
|
1575
|
+
},
|
|
1576
|
+
"required": false,
|
|
1577
|
+
"optional": true,
|
|
1578
|
+
"docs": {
|
|
1579
|
+
"tags": [{
|
|
1580
|
+
"name": "default",
|
|
1581
|
+
"text": "fill"
|
|
1582
|
+
}],
|
|
1583
|
+
"text": "Largura padr\u00E3o utilizada pelas colunas sem configura\u00E7\u00E3o pr\u00F3pria."
|
|
1584
|
+
},
|
|
1585
|
+
"getter": false,
|
|
1586
|
+
"setter": false,
|
|
1587
|
+
"reflect": true,
|
|
1588
|
+
"attribute": "column-width"
|
|
1589
|
+
},
|
|
1590
|
+
"density": {
|
|
1591
|
+
"type": "string",
|
|
1592
|
+
"mutable": false,
|
|
1593
|
+
"complexType": {
|
|
1594
|
+
"original": "TableDensity",
|
|
1595
|
+
"resolved": "\"large\" | \"medium\" | \"small\"",
|
|
1596
|
+
"references": {
|
|
1597
|
+
"TableDensity": {
|
|
1598
|
+
"location": "import",
|
|
1599
|
+
"path": "./table.types",
|
|
1600
|
+
"id": "src/components/table/table.types.ts::TableDensity",
|
|
1601
|
+
"referenceLocation": "TableDensity"
|
|
1602
|
+
}
|
|
1603
|
+
}
|
|
1604
|
+
},
|
|
1605
|
+
"required": false,
|
|
1606
|
+
"optional": true,
|
|
1607
|
+
"docs": {
|
|
1608
|
+
"tags": [{
|
|
1609
|
+
"name": "remarks",
|
|
1610
|
+
"text": "Quando omitida, a propriedade permanece `undefined` e a densidade\nvisual m\u00E9dia \u00E9 aplicada aos tokens da tabela."
|
|
1611
|
+
}, {
|
|
1612
|
+
"name": "default",
|
|
1613
|
+
"text": "undefined"
|
|
1614
|
+
}],
|
|
1615
|
+
"text": "Densidade visual aplicada aos espa\u00E7amentos da tabela."
|
|
1616
|
+
},
|
|
1617
|
+
"getter": false,
|
|
1618
|
+
"setter": false,
|
|
1619
|
+
"reflect": true,
|
|
1620
|
+
"attribute": "density"
|
|
1621
|
+
},
|
|
1622
|
+
"dividerStyle": {
|
|
1623
|
+
"type": "string",
|
|
1624
|
+
"mutable": false,
|
|
1625
|
+
"complexType": {
|
|
1626
|
+
"original": "TableDividerStyle",
|
|
1627
|
+
"resolved": "\"dashed\" | \"solid\"",
|
|
1628
|
+
"references": {
|
|
1629
|
+
"TableDividerStyle": {
|
|
1630
|
+
"location": "import",
|
|
1631
|
+
"path": "./table.types",
|
|
1632
|
+
"id": "src/components/table/table.types.ts::TableDividerStyle",
|
|
1633
|
+
"referenceLocation": "TableDividerStyle"
|
|
1634
|
+
}
|
|
1635
|
+
}
|
|
1636
|
+
},
|
|
1637
|
+
"required": false,
|
|
1638
|
+
"optional": true,
|
|
1639
|
+
"docs": {
|
|
1640
|
+
"tags": [{
|
|
1641
|
+
"name": "default",
|
|
1642
|
+
"text": "solid"
|
|
1643
|
+
}],
|
|
1644
|
+
"text": "Estilo aplicado aos divisores habilitados."
|
|
1645
|
+
},
|
|
1646
|
+
"getter": false,
|
|
1647
|
+
"setter": false,
|
|
1648
|
+
"reflect": true,
|
|
1649
|
+
"attribute": "divider-style"
|
|
1650
|
+
},
|
|
1651
|
+
"hasColumnDivider": {
|
|
1652
|
+
"type": "boolean",
|
|
1653
|
+
"mutable": false,
|
|
1654
|
+
"complexType": {
|
|
1655
|
+
"original": "boolean",
|
|
1656
|
+
"resolved": "boolean",
|
|
1657
|
+
"references": {}
|
|
1658
|
+
},
|
|
1659
|
+
"required": false,
|
|
1660
|
+
"optional": true,
|
|
1661
|
+
"docs": {
|
|
1662
|
+
"tags": [{
|
|
1663
|
+
"name": "deprecated",
|
|
1664
|
+
"text": "Use `columnDivider` instead."
|
|
1665
|
+
}, {
|
|
1666
|
+
"name": "default",
|
|
1667
|
+
"text": "false"
|
|
1668
|
+
}],
|
|
1669
|
+
"text": "Habilita divisores entre colunas quando `columnDivider` n\u00E3o \u00E9 informado."
|
|
1670
|
+
},
|
|
1671
|
+
"getter": false,
|
|
1672
|
+
"setter": false,
|
|
1673
|
+
"reflect": true,
|
|
1674
|
+
"attribute": "has-column-divider",
|
|
1675
|
+
"defaultValue": "false"
|
|
1676
|
+
},
|
|
1677
|
+
"columnDivider": {
|
|
1678
|
+
"type": "boolean",
|
|
1679
|
+
"mutable": false,
|
|
1680
|
+
"complexType": {
|
|
1681
|
+
"original": "boolean",
|
|
1682
|
+
"resolved": "boolean",
|
|
1683
|
+
"references": {}
|
|
1684
|
+
},
|
|
1685
|
+
"required": false,
|
|
1686
|
+
"optional": true,
|
|
1687
|
+
"docs": {
|
|
1688
|
+
"tags": [{
|
|
1689
|
+
"name": "remarks",
|
|
1690
|
+
"text": "Quando informado, tem preced\u00EAncia sobre `hasColumnDivider`,\ninclusive quando `false`. Na aus\u00EAncia de ambos, os divisores ficam desabilitados."
|
|
1691
|
+
}],
|
|
1692
|
+
"text": "Habilita divisores entre colunas."
|
|
1693
|
+
},
|
|
1694
|
+
"getter": false,
|
|
1695
|
+
"setter": false,
|
|
1696
|
+
"reflect": true,
|
|
1697
|
+
"attribute": "column-divider"
|
|
1698
|
+
},
|
|
1699
|
+
"hasRowDivider": {
|
|
1700
|
+
"type": "boolean",
|
|
1701
|
+
"mutable": false,
|
|
1702
|
+
"complexType": {
|
|
1703
|
+
"original": "boolean",
|
|
1704
|
+
"resolved": "boolean",
|
|
1705
|
+
"references": {}
|
|
1706
|
+
},
|
|
1707
|
+
"required": false,
|
|
1708
|
+
"optional": true,
|
|
1709
|
+
"docs": {
|
|
1710
|
+
"tags": [{
|
|
1711
|
+
"name": "deprecated",
|
|
1712
|
+
"text": "Use `rowDivider` instead."
|
|
1713
|
+
}, {
|
|
1714
|
+
"name": "default",
|
|
1715
|
+
"text": "false"
|
|
1716
|
+
}],
|
|
1717
|
+
"text": "Habilita divisores entre linhas quando `rowDivider` n\u00E3o \u00E9 informado."
|
|
1718
|
+
},
|
|
1719
|
+
"getter": false,
|
|
1720
|
+
"setter": false,
|
|
1721
|
+
"reflect": true,
|
|
1722
|
+
"attribute": "has-row-divider",
|
|
1723
|
+
"defaultValue": "false"
|
|
1724
|
+
},
|
|
1725
|
+
"rowDivider": {
|
|
1726
|
+
"type": "boolean",
|
|
1727
|
+
"mutable": false,
|
|
1728
|
+
"complexType": {
|
|
1729
|
+
"original": "boolean",
|
|
1730
|
+
"resolved": "boolean",
|
|
1731
|
+
"references": {}
|
|
1732
|
+
},
|
|
1733
|
+
"required": false,
|
|
1734
|
+
"optional": true,
|
|
1735
|
+
"docs": {
|
|
1736
|
+
"tags": [{
|
|
1737
|
+
"name": "remarks",
|
|
1738
|
+
"text": "Quando informado, tem preced\u00EAncia sobre `hasRowDivider`,\ninclusive quando `false`. Na aus\u00EAncia de ambos, os divisores ficam desabilitados."
|
|
1739
|
+
}],
|
|
1740
|
+
"text": "Habilita divisores entre linhas."
|
|
1741
|
+
},
|
|
1742
|
+
"getter": false,
|
|
1743
|
+
"setter": false,
|
|
1744
|
+
"reflect": true,
|
|
1745
|
+
"attribute": "row-divider"
|
|
1746
|
+
},
|
|
1747
|
+
"hasRowHover": {
|
|
1748
|
+
"type": "boolean",
|
|
1749
|
+
"mutable": false,
|
|
1750
|
+
"complexType": {
|
|
1751
|
+
"original": "boolean",
|
|
1752
|
+
"resolved": "boolean",
|
|
1753
|
+
"references": {}
|
|
1754
|
+
},
|
|
1755
|
+
"required": false,
|
|
1756
|
+
"optional": false,
|
|
1757
|
+
"docs": {
|
|
1758
|
+
"tags": [{
|
|
1759
|
+
"name": "default",
|
|
1760
|
+
"text": "false"
|
|
1761
|
+
}],
|
|
1762
|
+
"text": "Habilita o realce visual das linhas ao passar o ponteiro."
|
|
1763
|
+
},
|
|
1764
|
+
"getter": false,
|
|
1765
|
+
"setter": false,
|
|
1766
|
+
"reflect": true,
|
|
1767
|
+
"attribute": "has-row-hover",
|
|
1768
|
+
"defaultValue": "false"
|
|
1769
|
+
},
|
|
1770
|
+
"loading": {
|
|
1771
|
+
"type": "boolean",
|
|
1772
|
+
"mutable": true,
|
|
1773
|
+
"complexType": {
|
|
1774
|
+
"original": "boolean",
|
|
1775
|
+
"resolved": "boolean",
|
|
1776
|
+
"references": {}
|
|
1777
|
+
},
|
|
1778
|
+
"required": false,
|
|
1779
|
+
"optional": false,
|
|
1780
|
+
"docs": {
|
|
1781
|
+
"tags": [{
|
|
1782
|
+
"name": "remarks",
|
|
1783
|
+
"text": "Mant\u00E9m os dados anteriores, reduz sua opacidade e exibe o slot\n`loading` em um painel central com scrim sobre toda a tabela, incluindo\nbarra de a\u00E7\u00F5es e pagina\u00E7\u00E3o. O scrim fica limitado ao componente.\nReflete o atributo `loading` e pode ser alterada diretamente ou pelos m\u00E9todos\n`startLoading()` e `stopLoading()`. N\u00E3o bloqueia o teclado nem gerencia\nrequisi\u00E7\u00F5es, erros ou substitui\u00E7\u00E3o dos dados."
|
|
1784
|
+
}, {
|
|
1785
|
+
"name": "default",
|
|
1786
|
+
"text": "false"
|
|
1787
|
+
}],
|
|
1788
|
+
"text": "Indica que as linhas est\u00E3o sendo atualizadas pelo consumidor."
|
|
1789
|
+
},
|
|
1790
|
+
"getter": false,
|
|
1791
|
+
"setter": false,
|
|
1792
|
+
"reflect": true,
|
|
1793
|
+
"attribute": "loading",
|
|
1794
|
+
"defaultValue": "false"
|
|
1795
|
+
},
|
|
1796
|
+
"heading": {
|
|
1797
|
+
"type": "string",
|
|
1798
|
+
"mutable": false,
|
|
1799
|
+
"complexType": {
|
|
1800
|
+
"original": "string",
|
|
1801
|
+
"resolved": "string",
|
|
1802
|
+
"references": {}
|
|
1803
|
+
},
|
|
1804
|
+
"required": false,
|
|
1805
|
+
"optional": true,
|
|
1806
|
+
"docs": {
|
|
1807
|
+
"tags": [{
|
|
1808
|
+
"name": "default",
|
|
1809
|
+
"text": "null"
|
|
1810
|
+
}],
|
|
1811
|
+
"text": "T\u00EDtulo apresentado na barra principal."
|
|
1812
|
+
},
|
|
1813
|
+
"getter": false,
|
|
1814
|
+
"setter": false,
|
|
1815
|
+
"reflect": true,
|
|
1816
|
+
"attribute": "heading"
|
|
1817
|
+
},
|
|
1818
|
+
"showContextualBar": {
|
|
1819
|
+
"type": "boolean",
|
|
1820
|
+
"mutable": false,
|
|
1821
|
+
"complexType": {
|
|
1822
|
+
"original": "boolean",
|
|
1823
|
+
"resolved": "boolean",
|
|
1824
|
+
"references": {}
|
|
1825
|
+
},
|
|
1826
|
+
"required": false,
|
|
1827
|
+
"optional": false,
|
|
1828
|
+
"docs": {
|
|
1829
|
+
"tags": [{
|
|
1830
|
+
"name": "default",
|
|
1831
|
+
"text": "false"
|
|
1832
|
+
}],
|
|
1833
|
+
"text": "For\u00E7a a apresenta\u00E7\u00E3o da barra contextual."
|
|
1834
|
+
},
|
|
1835
|
+
"getter": false,
|
|
1836
|
+
"setter": false,
|
|
1837
|
+
"reflect": true,
|
|
1838
|
+
"attribute": "show-contextual-bar",
|
|
1839
|
+
"defaultValue": "false"
|
|
1840
|
+
},
|
|
1841
|
+
"headingActionsLimit": {
|
|
1842
|
+
"type": "number",
|
|
1843
|
+
"mutable": false,
|
|
1844
|
+
"complexType": {
|
|
1845
|
+
"original": "number",
|
|
1846
|
+
"resolved": "number",
|
|
1847
|
+
"references": {}
|
|
1848
|
+
},
|
|
1849
|
+
"required": false,
|
|
1850
|
+
"optional": false,
|
|
1851
|
+
"docs": {
|
|
1852
|
+
"tags": [{
|
|
1853
|
+
"name": "default",
|
|
1854
|
+
"text": "4"
|
|
1855
|
+
}],
|
|
1856
|
+
"text": "Limite usado para decidir quando agrupar a\u00E7\u00F5es globais em um menu.\nQuando o n\u00FAmero de a\u00E7\u00F5es excede esse valor, as a\u00E7\u00F5es s\u00E3o agrupadas no\ndropdown (atualmente todas s\u00E3o movidas para o menu colapsado)."
|
|
1857
|
+
},
|
|
1858
|
+
"getter": false,
|
|
1859
|
+
"setter": false,
|
|
1860
|
+
"reflect": true,
|
|
1861
|
+
"attribute": "heading-actions-limit",
|
|
1862
|
+
"defaultValue": "4"
|
|
1863
|
+
},
|
|
1864
|
+
"contextualActionsLimit": {
|
|
1865
|
+
"type": "number",
|
|
653
1866
|
"mutable": false,
|
|
654
1867
|
"complexType": {
|
|
655
|
-
"original": "
|
|
656
|
-
"resolved": "
|
|
657
|
-
"references": {
|
|
658
|
-
"ColumnWidth": {
|
|
659
|
-
"location": "import",
|
|
660
|
-
"path": "./table-types",
|
|
661
|
-
"id": "src/components/table/table-types.ts::ColumnWidth",
|
|
662
|
-
"referenceLocation": "ColumnWidth"
|
|
663
|
-
}
|
|
664
|
-
}
|
|
1868
|
+
"original": "number",
|
|
1869
|
+
"resolved": "number",
|
|
1870
|
+
"references": {}
|
|
665
1871
|
},
|
|
666
1872
|
"required": false,
|
|
667
|
-
"optional":
|
|
1873
|
+
"optional": false,
|
|
668
1874
|
"docs": {
|
|
669
1875
|
"tags": [{
|
|
670
|
-
"name": "remarks",
|
|
671
|
-
"text": "Valores aceitos:\n- fill\n- content\n- ${number}px\n- ${number}fr\n\nObserva\u00E7\u00E3o:\n- `columnWidth` n\u00E3o define o comportamento de `overflow`, mas pode interferir na sua percep\u00E7\u00E3o ao alterar o espa\u00E7o dispon\u00EDvel da coluna.\n- `content` (`max-content`) tende a expandir a coluna e reduzir casos vis\u00EDveis de truncagem.\n- `fill` (`1fr`) tende a evidenciar truncagem quando o espa\u00E7o horizontal \u00E9 insuficiente."
|
|
672
|
-
}, {
|
|
673
1876
|
"name": "default",
|
|
674
|
-
"text": "
|
|
675
|
-
}, {
|
|
676
|
-
"name": "example",
|
|
677
|
-
"text": "```html\n<br-table column-width=\"160px\"></br-table>\n```"
|
|
1877
|
+
"text": "4"
|
|
678
1878
|
}],
|
|
679
|
-
"text": "
|
|
1879
|
+
"text": "Limite usado para decidir quando agrupar a\u00E7\u00F5es contextuais em um menu.\nQuando o n\u00FAmero de a\u00E7\u00F5es excede esse valor, as a\u00E7\u00F5es s\u00E3o agrupadas no\ndropdown (atualmente todas s\u00E3o movidas para o menu colapsado)."
|
|
680
1880
|
},
|
|
681
1881
|
"getter": false,
|
|
682
1882
|
"setter": false,
|
|
683
1883
|
"reflect": true,
|
|
684
|
-
"attribute": "
|
|
1884
|
+
"attribute": "contextual-actions-limit",
|
|
1885
|
+
"defaultValue": "4"
|
|
685
1886
|
},
|
|
686
|
-
"
|
|
1887
|
+
"moreActionsHeadingLabel": {
|
|
687
1888
|
"type": "string",
|
|
688
1889
|
"mutable": false,
|
|
689
1890
|
"complexType": {
|
|
690
|
-
"original": "
|
|
691
|
-
"resolved": "
|
|
692
|
-
"references": {
|
|
693
|
-
"TableDensity": {
|
|
694
|
-
"location": "import",
|
|
695
|
-
"path": "./table-types",
|
|
696
|
-
"id": "src/components/table/table-types.ts::TableDensity",
|
|
697
|
-
"referenceLocation": "TableDensity"
|
|
698
|
-
}
|
|
699
|
-
}
|
|
1891
|
+
"original": "string",
|
|
1892
|
+
"resolved": "string",
|
|
1893
|
+
"references": {}
|
|
700
1894
|
},
|
|
701
1895
|
"required": false,
|
|
702
|
-
"optional":
|
|
1896
|
+
"optional": false,
|
|
703
1897
|
"docs": {
|
|
704
|
-
"tags": [
|
|
705
|
-
|
|
1898
|
+
"tags": [{
|
|
1899
|
+
"name": "default",
|
|
1900
|
+
"text": "'Mais a\u00E7\u00F5es'"
|
|
1901
|
+
}],
|
|
1902
|
+
"text": "Texto do tooltip do bot\u00E3o de a\u00E7\u00F5es agrupadas na barra de t\u00EDtulo.\nQuando vazio ou composto apenas por espa\u00E7os, usa \"Mais a\u00E7\u00F5es\".\nN\u00E3o altera o nome acess\u00EDvel do bot\u00E3o nem os r\u00F3tulos do menu."
|
|
706
1903
|
},
|
|
707
1904
|
"getter": false,
|
|
708
1905
|
"setter": false,
|
|
709
|
-
"reflect":
|
|
710
|
-
"attribute": "
|
|
1906
|
+
"reflect": false,
|
|
1907
|
+
"attribute": "more-actions-heading-label",
|
|
1908
|
+
"defaultValue": "'Mais a\u00E7\u00F5es'"
|
|
711
1909
|
},
|
|
712
|
-
"
|
|
1910
|
+
"moreActionsContextualLabel": {
|
|
713
1911
|
"type": "string",
|
|
714
1912
|
"mutable": false,
|
|
715
1913
|
"complexType": {
|
|
716
|
-
"original": "
|
|
717
|
-
"resolved": "
|
|
718
|
-
"references": {
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
1914
|
+
"original": "string",
|
|
1915
|
+
"resolved": "string",
|
|
1916
|
+
"references": {}
|
|
1917
|
+
},
|
|
1918
|
+
"required": false,
|
|
1919
|
+
"optional": false,
|
|
1920
|
+
"docs": {
|
|
1921
|
+
"tags": [{
|
|
1922
|
+
"name": "default",
|
|
1923
|
+
"text": "'Mais a\u00E7\u00F5es'"
|
|
1924
|
+
}],
|
|
1925
|
+
"text": "Texto do tooltip do bot\u00E3o de a\u00E7\u00F5es agrupadas da barra contextual.\nQuando vazio ou composto apenas por espa\u00E7os, usa \"Mais a\u00E7\u00F5es\".\nN\u00E3o altera o nome acess\u00EDvel do bot\u00E3o nem os r\u00F3tulos do menu."
|
|
1926
|
+
},
|
|
1927
|
+
"getter": false,
|
|
1928
|
+
"setter": false,
|
|
1929
|
+
"reflect": false,
|
|
1930
|
+
"attribute": "more-actions-contextual-label",
|
|
1931
|
+
"defaultValue": "'Mais a\u00E7\u00F5es'"
|
|
1932
|
+
},
|
|
1933
|
+
"moreActionsLabel": {
|
|
1934
|
+
"type": "string",
|
|
1935
|
+
"mutable": false,
|
|
1936
|
+
"complexType": {
|
|
1937
|
+
"original": "string",
|
|
1938
|
+
"resolved": "string",
|
|
1939
|
+
"references": {}
|
|
726
1940
|
},
|
|
727
1941
|
"required": false,
|
|
728
1942
|
"optional": true,
|
|
729
1943
|
"docs": {
|
|
730
1944
|
"tags": [{
|
|
731
|
-
"name": "remarks",
|
|
732
|
-
"text": "Valores aceitos:\n- solid\n- dashed"
|
|
733
|
-
}, {
|
|
734
1945
|
"name": "default",
|
|
735
|
-
"text": "
|
|
1946
|
+
"text": "undefined"
|
|
736
1947
|
}],
|
|
737
|
-
"text": "
|
|
1948
|
+
"text": "Texto completo do tooltip dos bot\u00F5es de a\u00E7\u00F5es agrupadas nas c\u00E9lulas.\nQuando informado, prevalece sobre `moreActionsLabel` de cada c\u00E9lula.\nQuando omitido, a c\u00E9lula usa seu valor local ou \"Mais a\u00E7\u00F5es\".\nValores vazios ou compostos apenas por espa\u00E7os usam \"Mais a\u00E7\u00F5es\".\nAceita texto simples por atributo ou propriedade.\nReflete o valor no atributo `more-actions-label` para sincronizar as c\u00E9lulas."
|
|
738
1949
|
},
|
|
739
1950
|
"getter": false,
|
|
740
1951
|
"setter": false,
|
|
741
1952
|
"reflect": true,
|
|
742
|
-
"attribute": "
|
|
1953
|
+
"attribute": "more-actions-label"
|
|
743
1954
|
},
|
|
744
|
-
"
|
|
1955
|
+
"cellActionsLimit": {
|
|
1956
|
+
"type": "number",
|
|
1957
|
+
"mutable": false,
|
|
1958
|
+
"complexType": {
|
|
1959
|
+
"original": "number",
|
|
1960
|
+
"resolved": "number",
|
|
1961
|
+
"references": {}
|
|
1962
|
+
},
|
|
1963
|
+
"required": false,
|
|
1964
|
+
"optional": false,
|
|
1965
|
+
"docs": {
|
|
1966
|
+
"tags": [{
|
|
1967
|
+
"name": "default",
|
|
1968
|
+
"text": "4"
|
|
1969
|
+
}],
|
|
1970
|
+
"text": "Limite padr\u00E3o de a\u00E7\u00F5es exibidas em cada c\u00E9lula."
|
|
1971
|
+
},
|
|
1972
|
+
"getter": false,
|
|
1973
|
+
"setter": false,
|
|
1974
|
+
"reflect": true,
|
|
1975
|
+
"attribute": "cell-actions-limit",
|
|
1976
|
+
"defaultValue": "4"
|
|
1977
|
+
},
|
|
1978
|
+
"hasRowSelection": {
|
|
745
1979
|
"type": "boolean",
|
|
746
1980
|
"mutable": false,
|
|
747
1981
|
"complexType": {
|
|
@@ -750,24 +1984,21 @@ export class Table {
|
|
|
750
1984
|
"references": {}
|
|
751
1985
|
},
|
|
752
1986
|
"required": false,
|
|
753
|
-
"optional":
|
|
1987
|
+
"optional": false,
|
|
754
1988
|
"docs": {
|
|
755
1989
|
"tags": [{
|
|
756
1990
|
"name": "default",
|
|
757
1991
|
"text": "false"
|
|
758
|
-
}, {
|
|
759
|
-
"name": "deprecated",
|
|
760
|
-
"text": "Use `columnDivider`."
|
|
761
1992
|
}],
|
|
762
|
-
"text": "
|
|
1993
|
+
"text": "Habilita a coluna de sele\u00E7\u00E3o de linhas."
|
|
763
1994
|
},
|
|
764
1995
|
"getter": false,
|
|
765
1996
|
"setter": false,
|
|
766
1997
|
"reflect": true,
|
|
767
|
-
"attribute": "has-
|
|
1998
|
+
"attribute": "has-row-selection",
|
|
768
1999
|
"defaultValue": "false"
|
|
769
2000
|
},
|
|
770
|
-
"
|
|
2001
|
+
"hasRowExpansion": {
|
|
771
2002
|
"type": "boolean",
|
|
772
2003
|
"mutable": false,
|
|
773
2004
|
"complexType": {
|
|
@@ -776,17 +2007,21 @@ export class Table {
|
|
|
776
2007
|
"references": {}
|
|
777
2008
|
},
|
|
778
2009
|
"required": false,
|
|
779
|
-
"optional":
|
|
2010
|
+
"optional": false,
|
|
780
2011
|
"docs": {
|
|
781
|
-
"tags": [
|
|
782
|
-
|
|
2012
|
+
"tags": [{
|
|
2013
|
+
"name": "default",
|
|
2014
|
+
"text": "false"
|
|
2015
|
+
}],
|
|
2016
|
+
"text": "Habilita a coluna de expans\u00E3o de linhas."
|
|
783
2017
|
},
|
|
784
2018
|
"getter": false,
|
|
785
2019
|
"setter": false,
|
|
786
2020
|
"reflect": true,
|
|
787
|
-
"attribute": "
|
|
2021
|
+
"attribute": "has-row-expansion",
|
|
2022
|
+
"defaultValue": "false"
|
|
788
2023
|
},
|
|
789
|
-
"
|
|
2024
|
+
"hasSearch": {
|
|
790
2025
|
"type": "boolean",
|
|
791
2026
|
"mutable": false,
|
|
792
2027
|
"complexType": {
|
|
@@ -795,24 +2030,21 @@ export class Table {
|
|
|
795
2030
|
"references": {}
|
|
796
2031
|
},
|
|
797
2032
|
"required": false,
|
|
798
|
-
"optional":
|
|
2033
|
+
"optional": false,
|
|
799
2034
|
"docs": {
|
|
800
2035
|
"tags": [{
|
|
801
2036
|
"name": "default",
|
|
802
2037
|
"text": "false"
|
|
803
|
-
}, {
|
|
804
|
-
"name": "deprecated",
|
|
805
|
-
"text": "Use `rowDivider`."
|
|
806
2038
|
}],
|
|
807
|
-
"text": "
|
|
2039
|
+
"text": "Disponibiliza a interface de busca, sem filtrar ou destacar o conte\u00FAdo.\nA aplica\u00E7\u00E3o recebe `brTableSearch` e atualiza os dados local ou remotamente."
|
|
808
2040
|
},
|
|
809
2041
|
"getter": false,
|
|
810
2042
|
"setter": false,
|
|
811
2043
|
"reflect": true,
|
|
812
|
-
"attribute": "has-
|
|
2044
|
+
"attribute": "has-search",
|
|
813
2045
|
"defaultValue": "false"
|
|
814
2046
|
},
|
|
815
|
-
"
|
|
2047
|
+
"hasPagination": {
|
|
816
2048
|
"type": "boolean",
|
|
817
2049
|
"mutable": false,
|
|
818
2050
|
"complexType": {
|
|
@@ -821,15 +2053,241 @@ export class Table {
|
|
|
821
2053
|
"references": {}
|
|
822
2054
|
},
|
|
823
2055
|
"required": false,
|
|
2056
|
+
"optional": false,
|
|
2057
|
+
"docs": {
|
|
2058
|
+
"tags": [{
|
|
2059
|
+
"name": "remarks",
|
|
2060
|
+
"text": "A pagina\u00E7\u00E3o define o subconjunto l\u00F3gico dispon\u00EDvel para a lista\nvirtual. `pageSize` conta linhas independentes ou grupos completos, e\n`visibleRows` controla quantas delas cabem simultaneamente na viewport.\nQuando os dados completos ainda n\u00E3o est\u00E3o dispon\u00EDveis localmente\n(pagina\u00E7\u00E3o por API), informe `totalItems` e forne\u00E7a o subconjunto\ncorrespondente ap\u00F3s `brTablePageChange`."
|
|
2061
|
+
}, {
|
|
2062
|
+
"name": "default",
|
|
2063
|
+
"text": "false"
|
|
2064
|
+
}],
|
|
2065
|
+
"text": "Habilita a pagina\u00E7\u00E3o da tabela, renderizando `br-table-footer` internamente."
|
|
2066
|
+
},
|
|
2067
|
+
"getter": false,
|
|
2068
|
+
"setter": false,
|
|
2069
|
+
"reflect": true,
|
|
2070
|
+
"attribute": "has-pagination",
|
|
2071
|
+
"defaultValue": "false"
|
|
2072
|
+
},
|
|
2073
|
+
"currentPage": {
|
|
2074
|
+
"type": "number",
|
|
2075
|
+
"mutable": true,
|
|
2076
|
+
"complexType": {
|
|
2077
|
+
"original": "number",
|
|
2078
|
+
"resolved": "number",
|
|
2079
|
+
"references": {}
|
|
2080
|
+
},
|
|
2081
|
+
"required": false,
|
|
2082
|
+
"optional": false,
|
|
2083
|
+
"docs": {
|
|
2084
|
+
"tags": [{
|
|
2085
|
+
"name": "remarks",
|
|
2086
|
+
"text": "Atualizada internamente quando `TableDataStore` j\u00E1 cobre a\np\u00E1gina solicitada. Utilize como valor inicial ou para navegar\nprogramaticamente para outra p\u00E1gina."
|
|
2087
|
+
}, {
|
|
2088
|
+
"name": "default",
|
|
2089
|
+
"text": "1"
|
|
2090
|
+
}],
|
|
2091
|
+
"text": "P\u00E1gina atual exibida pela pagina\u00E7\u00E3o (1-indexada)."
|
|
2092
|
+
},
|
|
2093
|
+
"getter": false,
|
|
2094
|
+
"setter": false,
|
|
2095
|
+
"reflect": true,
|
|
2096
|
+
"attribute": "current-page",
|
|
2097
|
+
"defaultValue": "1"
|
|
2098
|
+
},
|
|
2099
|
+
"pageSize": {
|
|
2100
|
+
"type": "number",
|
|
2101
|
+
"mutable": true,
|
|
2102
|
+
"complexType": {
|
|
2103
|
+
"original": "number",
|
|
2104
|
+
"resolved": "number",
|
|
2105
|
+
"references": {}
|
|
2106
|
+
},
|
|
2107
|
+
"required": false,
|
|
2108
|
+
"optional": true,
|
|
2109
|
+
"docs": {
|
|
2110
|
+
"tags": [{
|
|
2111
|
+
"name": "remarks",
|
|
2112
|
+
"text": "Quando omitida, utiliza `visibleRows` como fallback para manter\ncompatibilidade com a API anterior. Defina um valor maior que\n`visibleRows` para que pagina\u00E7\u00E3o e virtualiza\u00E7\u00E3o operem simultaneamente."
|
|
2113
|
+
}],
|
|
2114
|
+
"text": "Quantidade de itens pertencentes a cada p\u00E1gina (linhas independentes ou grupos completos)."
|
|
2115
|
+
},
|
|
2116
|
+
"getter": false,
|
|
2117
|
+
"setter": false,
|
|
2118
|
+
"reflect": true,
|
|
2119
|
+
"attribute": "page-size"
|
|
2120
|
+
},
|
|
2121
|
+
"pageSizeOptions": {
|
|
2122
|
+
"type": "unknown",
|
|
2123
|
+
"mutable": false,
|
|
2124
|
+
"complexType": {
|
|
2125
|
+
"original": "number[]",
|
|
2126
|
+
"resolved": "number[]",
|
|
2127
|
+
"references": {}
|
|
2128
|
+
},
|
|
2129
|
+
"required": false,
|
|
2130
|
+
"optional": false,
|
|
2131
|
+
"docs": {
|
|
2132
|
+
"tags": [{
|
|
2133
|
+
"name": "default",
|
|
2134
|
+
"text": "[10, 20, 30]"
|
|
2135
|
+
}],
|
|
2136
|
+
"text": "Op\u00E7\u00F5es dispon\u00EDveis de itens por p\u00E1gina no seletor da pagina\u00E7\u00E3o."
|
|
2137
|
+
},
|
|
2138
|
+
"getter": false,
|
|
2139
|
+
"setter": false,
|
|
2140
|
+
"defaultValue": "[10, 20, 30]"
|
|
2141
|
+
},
|
|
2142
|
+
"totalItems": {
|
|
2143
|
+
"type": "number",
|
|
2144
|
+
"mutable": false,
|
|
2145
|
+
"complexType": {
|
|
2146
|
+
"original": "number",
|
|
2147
|
+
"resolved": "number",
|
|
2148
|
+
"references": {}
|
|
2149
|
+
},
|
|
2150
|
+
"required": false,
|
|
2151
|
+
"optional": true,
|
|
2152
|
+
"docs": {
|
|
2153
|
+
"tags": [{
|
|
2154
|
+
"name": "remarks",
|
|
2155
|
+
"text": "Necess\u00E1rio apenas quando `TableDataStore` n\u00E3o cont\u00E9m o conjunto\ncompleto (pagina\u00E7\u00E3o por API). Quando omitido, \u00E9 derivado automaticamente\nda quantidade de linhas independentes e grupos j\u00E1 presentes na tabela."
|
|
2156
|
+
}],
|
|
2157
|
+
"text": "Quantidade total de itens do conjunto de dados."
|
|
2158
|
+
},
|
|
2159
|
+
"getter": false,
|
|
2160
|
+
"setter": false,
|
|
2161
|
+
"reflect": true,
|
|
2162
|
+
"attribute": "total-items"
|
|
2163
|
+
},
|
|
2164
|
+
"sortMode": {
|
|
2165
|
+
"type": "string",
|
|
2166
|
+
"mutable": false,
|
|
2167
|
+
"complexType": {
|
|
2168
|
+
"original": "TableSortMode",
|
|
2169
|
+
"resolved": "\"multi\" | \"single\"",
|
|
2170
|
+
"references": {
|
|
2171
|
+
"TableSortMode": {
|
|
2172
|
+
"location": "import",
|
|
2173
|
+
"path": "./table.types",
|
|
2174
|
+
"id": "src/components/table/table.types.ts::TableSortMode",
|
|
2175
|
+
"referenceLocation": "TableSortMode"
|
|
2176
|
+
}
|
|
2177
|
+
}
|
|
2178
|
+
},
|
|
2179
|
+
"required": false,
|
|
2180
|
+
"optional": false,
|
|
2181
|
+
"docs": {
|
|
2182
|
+
"tags": [{
|
|
2183
|
+
"name": "default",
|
|
2184
|
+
"text": "single"
|
|
2185
|
+
}],
|
|
2186
|
+
"text": "Define se a tabela aceita uma \u00FAnica coluna ordenada ou m\u00FAltiplas colunas.\nNo modo `multi`, a prioridade \u00E9 sempre a ordem visual da esquerda para a direita."
|
|
2187
|
+
},
|
|
2188
|
+
"getter": false,
|
|
2189
|
+
"setter": false,
|
|
2190
|
+
"reflect": true,
|
|
2191
|
+
"attribute": "sort-mode",
|
|
2192
|
+
"defaultValue": "'single'"
|
|
2193
|
+
},
|
|
2194
|
+
"sortStrategy": {
|
|
2195
|
+
"type": "string",
|
|
2196
|
+
"mutable": false,
|
|
2197
|
+
"complexType": {
|
|
2198
|
+
"original": "TableSortStrategy",
|
|
2199
|
+
"resolved": "\"local\" | \"manual\"",
|
|
2200
|
+
"references": {
|
|
2201
|
+
"TableSortStrategy": {
|
|
2202
|
+
"location": "import",
|
|
2203
|
+
"path": "./table.types",
|
|
2204
|
+
"id": "src/components/table/table.types.ts::TableSortStrategy",
|
|
2205
|
+
"referenceLocation": "TableSortStrategy"
|
|
2206
|
+
}
|
|
2207
|
+
}
|
|
2208
|
+
},
|
|
2209
|
+
"required": false,
|
|
2210
|
+
"optional": false,
|
|
2211
|
+
"docs": {
|
|
2212
|
+
"tags": [{
|
|
2213
|
+
"name": "default",
|
|
2214
|
+
"text": "local"
|
|
2215
|
+
}],
|
|
2216
|
+
"text": "Define se a tabela ordena as linhas localmente ou deixa a aplica\u00E7\u00E3o aplicar\na ordena\u00E7\u00E3o solicitada. Em `manual`, a tabela mant\u00E9m os indicadores e emite\n`brTableSortChange`, mas n\u00E3o reordena as linhas; use `setData()` para fornecer\nos resultados customizados ou remotos. Valores n\u00E3o reconhecidos usam a\nestrat\u00E9gia local."
|
|
2217
|
+
},
|
|
2218
|
+
"getter": false,
|
|
2219
|
+
"setter": false,
|
|
2220
|
+
"reflect": true,
|
|
2221
|
+
"attribute": "sort-strategy",
|
|
2222
|
+
"defaultValue": "'local'"
|
|
2223
|
+
},
|
|
2224
|
+
"visibleRows": {
|
|
2225
|
+
"type": "number",
|
|
2226
|
+
"mutable": true,
|
|
2227
|
+
"complexType": {
|
|
2228
|
+
"original": "number",
|
|
2229
|
+
"resolved": "number",
|
|
2230
|
+
"references": {}
|
|
2231
|
+
},
|
|
2232
|
+
"required": false,
|
|
2233
|
+
"optional": false,
|
|
2234
|
+
"docs": {
|
|
2235
|
+
"tags": [{
|
|
2236
|
+
"name": "remarks",
|
|
2237
|
+
"text": "N\u00E3o limita o conjunto de dados nem realiza pagina\u00E7\u00E3o. A altura da\nregi\u00E3o de scroll \u00E9 derivada desta quantidade e da densidade atual. Mesmo\ncom `hasPagination` habilitado, esta propriedade continua definindo\napenas a capacidade visual da viewport; `pageSize` define o tamanho l\u00F3gico\nda p\u00E1gina."
|
|
2238
|
+
}, {
|
|
2239
|
+
"name": "default",
|
|
2240
|
+
"text": "10"
|
|
2241
|
+
}],
|
|
2242
|
+
"text": "Quantidade de linhas de dados vis\u00EDveis simultaneamente na viewport."
|
|
2243
|
+
},
|
|
2244
|
+
"getter": false,
|
|
2245
|
+
"setter": false,
|
|
2246
|
+
"reflect": true,
|
|
2247
|
+
"attribute": "visible-rows",
|
|
2248
|
+
"defaultValue": "10"
|
|
2249
|
+
},
|
|
2250
|
+
"heightRows": {
|
|
2251
|
+
"type": "number",
|
|
2252
|
+
"mutable": false,
|
|
2253
|
+
"complexType": {
|
|
2254
|
+
"original": "number",
|
|
2255
|
+
"resolved": "number",
|
|
2256
|
+
"references": {}
|
|
2257
|
+
},
|
|
2258
|
+
"required": false,
|
|
824
2259
|
"optional": true,
|
|
2260
|
+
"docs": {
|
|
2261
|
+
"tags": [{
|
|
2262
|
+
"name": "default",
|
|
2263
|
+
"text": "visibleRows"
|
|
2264
|
+
}],
|
|
2265
|
+
"text": "Quantidade de itens l\u00F3gicos usada somente para calcular a altura da viewport.\nCada grupo cont\u00EDguo conta como um item; a altura inclui todas as linhas\nf\u00EDsicas que comp\u00F5em os grupos reservados. N\u00E3o altera pagina\u00E7\u00E3o, rolagem ou\nvirtualiza\u00E7\u00E3o. Quando omitida, acompanha `visibleRows`."
|
|
2266
|
+
},
|
|
2267
|
+
"getter": false,
|
|
2268
|
+
"setter": false,
|
|
2269
|
+
"reflect": true,
|
|
2270
|
+
"attribute": "height-rows"
|
|
2271
|
+
},
|
|
2272
|
+
"virtualExpandedContentHeight": {
|
|
2273
|
+
"type": "number",
|
|
2274
|
+
"mutable": false,
|
|
2275
|
+
"complexType": {
|
|
2276
|
+
"original": "number",
|
|
2277
|
+
"resolved": "number",
|
|
2278
|
+
"references": {}
|
|
2279
|
+
},
|
|
2280
|
+
"required": false,
|
|
2281
|
+
"optional": false,
|
|
825
2282
|
"docs": {
|
|
826
2283
|
"tags": [],
|
|
827
|
-
"text": "
|
|
2284
|
+
"text": "Altura adicional estimada para conte\u00FAdo expandido ainda n\u00E3o medido."
|
|
828
2285
|
},
|
|
829
2286
|
"getter": false,
|
|
830
2287
|
"setter": false,
|
|
831
2288
|
"reflect": true,
|
|
832
|
-
"attribute": "
|
|
2289
|
+
"attribute": "virtual-expanded-content-height",
|
|
2290
|
+
"defaultValue": "240"
|
|
833
2291
|
},
|
|
834
2292
|
"horizontalAlignment": {
|
|
835
2293
|
"type": "string",
|
|
@@ -840,8 +2298,8 @@ export class Table {
|
|
|
840
2298
|
"references": {
|
|
841
2299
|
"TableAlignment": {
|
|
842
2300
|
"location": "import",
|
|
843
|
-
"path": "./table
|
|
844
|
-
"id": "src/components/table/table
|
|
2301
|
+
"path": "./table.types",
|
|
2302
|
+
"id": "src/components/table/table.types.ts::TableAlignment",
|
|
845
2303
|
"referenceLocation": "TableAlignment"
|
|
846
2304
|
}
|
|
847
2305
|
}
|
|
@@ -850,13 +2308,10 @@ export class Table {
|
|
|
850
2308
|
"optional": true,
|
|
851
2309
|
"docs": {
|
|
852
2310
|
"tags": [{
|
|
853
|
-
"name": "remarks",
|
|
854
|
-
"text": "Valores aceitos:\n- start\n- center\n- end"
|
|
855
|
-
}, {
|
|
856
2311
|
"name": "default",
|
|
857
2312
|
"text": "start"
|
|
858
2313
|
}],
|
|
859
|
-
"text": "
|
|
2314
|
+
"text": "Alinhamento horizontal padr\u00E3o da tabela."
|
|
860
2315
|
},
|
|
861
2316
|
"getter": false,
|
|
862
2317
|
"setter": false,
|
|
@@ -872,8 +2327,8 @@ export class Table {
|
|
|
872
2327
|
"references": {
|
|
873
2328
|
"TableAlignment": {
|
|
874
2329
|
"location": "import",
|
|
875
|
-
"path": "./table
|
|
876
|
-
"id": "src/components/table/table
|
|
2330
|
+
"path": "./table.types",
|
|
2331
|
+
"id": "src/components/table/table.types.ts::TableAlignment",
|
|
877
2332
|
"referenceLocation": "TableAlignment"
|
|
878
2333
|
}
|
|
879
2334
|
}
|
|
@@ -882,13 +2337,10 @@ export class Table {
|
|
|
882
2337
|
"optional": true,
|
|
883
2338
|
"docs": {
|
|
884
2339
|
"tags": [{
|
|
885
|
-
"name": "remarks",
|
|
886
|
-
"text": "Valores aceitos:\n- start\n- center\n- end"
|
|
887
|
-
}, {
|
|
888
2340
|
"name": "default",
|
|
889
2341
|
"text": "start"
|
|
890
2342
|
}],
|
|
891
|
-
"text": "
|
|
2343
|
+
"text": "Alinhamento vertical padr\u00E3o da tabela."
|
|
892
2344
|
},
|
|
893
2345
|
"getter": false,
|
|
894
2346
|
"setter": false,
|
|
@@ -904,8 +2356,8 @@ export class Table {
|
|
|
904
2356
|
"references": {
|
|
905
2357
|
"TableOverflow": {
|
|
906
2358
|
"location": "import",
|
|
907
|
-
"path": "./table
|
|
908
|
-
"id": "src/components/table/table
|
|
2359
|
+
"path": "./table.types",
|
|
2360
|
+
"id": "src/components/table/table.types.ts::TableOverflow",
|
|
909
2361
|
"referenceLocation": "TableOverflow"
|
|
910
2362
|
}
|
|
911
2363
|
}
|
|
@@ -914,13 +2366,10 @@ export class Table {
|
|
|
914
2366
|
"optional": true,
|
|
915
2367
|
"docs": {
|
|
916
2368
|
"tags": [{
|
|
917
|
-
"name": "remarks",
|
|
918
|
-
"text": "Valores aceitos:\n- truncate\n- wrap\n\nObserva\u00E7\u00E3o:\n- O overflow \u00E9 independente de `columnWidth`.\n- Com `columnWidth=\"content\"`, a coluna tende a crescer com o conte\u00FAdo (`max-content`), o que pode reduzir casos vis\u00EDveis de truncagem.\n- Com `columnWidth=\"fill\"`, a coluna ocupa o espa\u00E7o dispon\u00EDvel (`1fr`), ent\u00E3o a truncagem tende a ficar mais evidente quando n\u00E3o h\u00E1 espa\u00E7o suficiente."
|
|
919
|
-
}, {
|
|
920
2369
|
"name": "default",
|
|
921
2370
|
"text": "wrap"
|
|
922
2371
|
}],
|
|
923
|
-
"text": "
|
|
2372
|
+
"text": "Estrat\u00E9gia padr\u00E3o para conte\u00FAdos que excedem a c\u00E9lula."
|
|
924
2373
|
},
|
|
925
2374
|
"getter": false,
|
|
926
2375
|
"setter": false,
|
|
@@ -937,8 +2386,8 @@ export class Table {
|
|
|
937
2386
|
"references": {
|
|
938
2387
|
"TableTooltipState": {
|
|
939
2388
|
"location": "import",
|
|
940
|
-
"path": "./table
|
|
941
|
-
"id": "src/components/table/table
|
|
2389
|
+
"path": "./table.types",
|
|
2390
|
+
"id": "src/components/table/table.types.ts::TableTooltipState",
|
|
942
2391
|
"referenceLocation": "TableTooltipState"
|
|
943
2392
|
}
|
|
944
2393
|
}
|
|
@@ -947,13 +2396,10 @@ export class Table {
|
|
|
947
2396
|
"optional": true,
|
|
948
2397
|
"docs": {
|
|
949
2398
|
"tags": [{
|
|
950
|
-
"name": "remarks",
|
|
951
|
-
"text": "Valores aceitos:\n- info\n- warning\n- danger\n- success"
|
|
952
|
-
}, {
|
|
953
2399
|
"name": "default",
|
|
954
2400
|
"text": "info"
|
|
955
2401
|
}],
|
|
956
|
-
"text": "
|
|
2402
|
+
"text": "Estado visual padr\u00E3o dos tooltips."
|
|
957
2403
|
},
|
|
958
2404
|
"getter": false,
|
|
959
2405
|
"setter": false,
|
|
@@ -970,8 +2416,8 @@ export class Table {
|
|
|
970
2416
|
"references": {
|
|
971
2417
|
"TableTooltipMode": {
|
|
972
2418
|
"location": "import",
|
|
973
|
-
"path": "./table
|
|
974
|
-
"id": "src/components/table/table
|
|
2419
|
+
"path": "./table.types",
|
|
2420
|
+
"id": "src/components/table/table.types.ts::TableTooltipMode",
|
|
975
2421
|
"referenceLocation": "TableTooltipMode"
|
|
976
2422
|
}
|
|
977
2423
|
}
|
|
@@ -980,9 +2426,6 @@ export class Table {
|
|
|
980
2426
|
"optional": true,
|
|
981
2427
|
"docs": {
|
|
982
2428
|
"tags": [{
|
|
983
|
-
"name": "remarks",
|
|
984
|
-
"text": "Valores aceitos:\n- inherit\n- enabled\n- disabled"
|
|
985
|
-
}, {
|
|
986
2429
|
"name": "default",
|
|
987
2430
|
"text": "disabled (valor efetivo)"
|
|
988
2431
|
}],
|
|
@@ -992,31 +2435,206 @@ export class Table {
|
|
|
992
2435
|
"setter": false,
|
|
993
2436
|
"reflect": true,
|
|
994
2437
|
"attribute": "tooltip-mode"
|
|
995
|
-
}
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
2438
|
+
}
|
|
2439
|
+
};
|
|
2440
|
+
}
|
|
2441
|
+
static get states() {
|
|
2442
|
+
return {
|
|
2443
|
+
"selectedRowsCount": {},
|
|
2444
|
+
"measuredCollapsedRowHeight": {},
|
|
2445
|
+
"measuredHeaderHeight": {},
|
|
2446
|
+
"hasGlobalActionsContent": {},
|
|
2447
|
+
"hasContextualActionsContent": {},
|
|
2448
|
+
"hasScrollableContent": {}
|
|
2449
|
+
};
|
|
2450
|
+
}
|
|
2451
|
+
static get events() {
|
|
2452
|
+
return [{
|
|
2453
|
+
"method": "brTableActionClick",
|
|
2454
|
+
"name": "brTableActionClick",
|
|
2455
|
+
"bubbles": true,
|
|
2456
|
+
"cancelable": true,
|
|
2457
|
+
"composed": true,
|
|
2458
|
+
"docs": {
|
|
2459
|
+
"tags": [{
|
|
2460
|
+
"name": "remarks",
|
|
2461
|
+
"text": "O `detail` utiliza `TableActionClickDetail`."
|
|
2462
|
+
}],
|
|
2463
|
+
"text": "Reemite a\u00E7\u00F5es globais, contextuais e de linha para o consumidor."
|
|
2464
|
+
},
|
|
999
2465
|
"complexType": {
|
|
1000
|
-
"original": "
|
|
1001
|
-
"resolved": "
|
|
1002
|
-
"references": {
|
|
2466
|
+
"original": "TableActionClickDetail",
|
|
2467
|
+
"resolved": "{ type: \"contextual\" | \"row\" | \"global\"; label: string; rowIndex?: number; }",
|
|
2468
|
+
"references": {
|
|
2469
|
+
"TableActionClickDetail": {
|
|
2470
|
+
"location": "import",
|
|
2471
|
+
"path": "./table.types",
|
|
2472
|
+
"id": "src/components/table/table.types.ts::TableActionClickDetail",
|
|
2473
|
+
"referenceLocation": "TableActionClickDetail"
|
|
2474
|
+
}
|
|
2475
|
+
}
|
|
2476
|
+
}
|
|
2477
|
+
}, {
|
|
2478
|
+
"method": "brTableSelectionChange",
|
|
2479
|
+
"name": "brTableSelectionChange",
|
|
2480
|
+
"bubbles": true,
|
|
2481
|
+
"cancelable": true,
|
|
2482
|
+
"composed": true,
|
|
2483
|
+
"docs": {
|
|
2484
|
+
"tags": [{
|
|
2485
|
+
"name": "remarks",
|
|
2486
|
+
"text": "O `detail` utiliza `TableSelectionChangeDetail`."
|
|
2487
|
+
}],
|
|
2488
|
+
"text": "Emitido quando o conjunto de linhas selecionadas muda."
|
|
1003
2489
|
},
|
|
1004
|
-
"
|
|
1005
|
-
|
|
2490
|
+
"complexType": {
|
|
2491
|
+
"original": "TableSelectionChangeDetail",
|
|
2492
|
+
"resolved": "{ selectedRows: HTMLBrTableRowElement[]; selectedIndexes: number[]; selectedCount: number; rowIndex?: number; source: TableSelectionChangeSource; }",
|
|
2493
|
+
"references": {
|
|
2494
|
+
"TableSelectionChangeDetail": {
|
|
2495
|
+
"location": "import",
|
|
2496
|
+
"path": "./table.types",
|
|
2497
|
+
"id": "src/components/table/table.types.ts::TableSelectionChangeDetail",
|
|
2498
|
+
"referenceLocation": "TableSelectionChangeDetail"
|
|
2499
|
+
}
|
|
2500
|
+
}
|
|
2501
|
+
}
|
|
2502
|
+
}, {
|
|
2503
|
+
"method": "brTableRowExpansionChange",
|
|
2504
|
+
"name": "brTableRowExpansionChange",
|
|
2505
|
+
"bubbles": true,
|
|
2506
|
+
"cancelable": true,
|
|
2507
|
+
"composed": true,
|
|
1006
2508
|
"docs": {
|
|
1007
2509
|
"tags": [{
|
|
1008
|
-
"name": "
|
|
1009
|
-
"text": "
|
|
2510
|
+
"name": "remarks",
|
|
2511
|
+
"text": "O `detail` utiliza `TableRowExpansionChangeDetail`."
|
|
1010
2512
|
}],
|
|
1011
|
-
"text": "
|
|
2513
|
+
"text": "Emitido quando uma linha \u00E9 expandida ou recolhida."
|
|
1012
2514
|
},
|
|
1013
|
-
"
|
|
1014
|
-
|
|
1015
|
-
|
|
1016
|
-
|
|
1017
|
-
|
|
1018
|
-
|
|
1019
|
-
|
|
2515
|
+
"complexType": {
|
|
2516
|
+
"original": "TableRowExpansionChangeDetail",
|
|
2517
|
+
"resolved": "{ row: HTMLBrTableRowElement; rowIndex: number; expanded: boolean; source: TableRowExpansionChangeSource; }",
|
|
2518
|
+
"references": {
|
|
2519
|
+
"TableRowExpansionChangeDetail": {
|
|
2520
|
+
"location": "import",
|
|
2521
|
+
"path": "./table.types",
|
|
2522
|
+
"id": "src/components/table/table.types.ts::TableRowExpansionChangeDetail",
|
|
2523
|
+
"referenceLocation": "TableRowExpansionChangeDetail"
|
|
2524
|
+
}
|
|
2525
|
+
}
|
|
2526
|
+
}
|
|
2527
|
+
}, {
|
|
2528
|
+
"method": "brTableSortChange",
|
|
2529
|
+
"name": "brTableSortChange",
|
|
2530
|
+
"bubbles": true,
|
|
2531
|
+
"cancelable": true,
|
|
2532
|
+
"composed": true,
|
|
2533
|
+
"docs": {
|
|
2534
|
+
"tags": [],
|
|
2535
|
+
"text": "Emitido sempre que o conjunto de crit\u00E9rios de ordena\u00E7\u00E3o muda."
|
|
2536
|
+
},
|
|
2537
|
+
"complexType": {
|
|
2538
|
+
"original": "TableSortChangeDetail",
|
|
2539
|
+
"resolved": "{ mode: TableSortMode; sorting: TableSortState[]; rows: HTMLBrTableRowElement[]; }",
|
|
2540
|
+
"references": {
|
|
2541
|
+
"TableSortChangeDetail": {
|
|
2542
|
+
"location": "import",
|
|
2543
|
+
"path": "./table.types",
|
|
2544
|
+
"id": "src/components/table/table.types.ts::TableSortChangeDetail",
|
|
2545
|
+
"referenceLocation": "TableSortChangeDetail"
|
|
2546
|
+
}
|
|
2547
|
+
}
|
|
2548
|
+
}
|
|
2549
|
+
}, {
|
|
2550
|
+
"method": "brTableSortRequest",
|
|
2551
|
+
"name": "brTableSortRequest",
|
|
2552
|
+
"bubbles": true,
|
|
2553
|
+
"cancelable": true,
|
|
2554
|
+
"composed": true,
|
|
2555
|
+
"docs": {
|
|
2556
|
+
"tags": [],
|
|
2557
|
+
"text": "Emitido antes de aplicar uma solicita\u00E7\u00E3o de ordena\u00E7\u00E3o; `preventDefault()` cancela a mudan\u00E7a local."
|
|
2558
|
+
},
|
|
2559
|
+
"complexType": {
|
|
2560
|
+
"original": "TableSortRequestDetail",
|
|
2561
|
+
"resolved": "{ mode: TableSortMode; columnIndex: number; currentSorting: TableSortState[]; nextSorting: TableSortState[]; }",
|
|
2562
|
+
"references": {
|
|
2563
|
+
"TableSortRequestDetail": {
|
|
2564
|
+
"location": "import",
|
|
2565
|
+
"path": "./table.types",
|
|
2566
|
+
"id": "src/components/table/table.types.ts::TableSortRequestDetail",
|
|
2567
|
+
"referenceLocation": "TableSortRequestDetail"
|
|
2568
|
+
}
|
|
2569
|
+
}
|
|
2570
|
+
}
|
|
2571
|
+
}, {
|
|
2572
|
+
"method": "brTablePageChange",
|
|
2573
|
+
"name": "brTablePageChange",
|
|
2574
|
+
"bubbles": true,
|
|
2575
|
+
"cancelable": true,
|
|
2576
|
+
"composed": true,
|
|
2577
|
+
"docs": {
|
|
2578
|
+
"tags": [],
|
|
2579
|
+
"text": "Emitido quando o consumidor solicita outra p\u00E1gina pela pagina\u00E7\u00E3o do rodap\u00E9."
|
|
2580
|
+
},
|
|
2581
|
+
"complexType": {
|
|
2582
|
+
"original": "TablePageChangeDetail",
|
|
2583
|
+
"resolved": "{ page: number; }",
|
|
2584
|
+
"references": {
|
|
2585
|
+
"TablePageChangeDetail": {
|
|
2586
|
+
"location": "import",
|
|
2587
|
+
"path": "./table.types",
|
|
2588
|
+
"id": "src/components/table/table.types.ts::TablePageChangeDetail",
|
|
2589
|
+
"referenceLocation": "TablePageChangeDetail"
|
|
2590
|
+
}
|
|
2591
|
+
}
|
|
2592
|
+
}
|
|
2593
|
+
}, {
|
|
2594
|
+
"method": "brTablePageSizeChange",
|
|
2595
|
+
"name": "brTablePageSizeChange",
|
|
2596
|
+
"bubbles": true,
|
|
2597
|
+
"cancelable": true,
|
|
2598
|
+
"composed": true,
|
|
2599
|
+
"docs": {
|
|
2600
|
+
"tags": [],
|
|
2601
|
+
"text": "Emitido quando o consumidor solicita outra quantidade de itens por p\u00E1gina; atualize `visibleRows` ao tratar."
|
|
2602
|
+
},
|
|
2603
|
+
"complexType": {
|
|
2604
|
+
"original": "TablePageSizeChangeDetail",
|
|
2605
|
+
"resolved": "{ pageSize: number; }",
|
|
2606
|
+
"references": {
|
|
2607
|
+
"TablePageSizeChangeDetail": {
|
|
2608
|
+
"location": "import",
|
|
2609
|
+
"path": "./table.types",
|
|
2610
|
+
"id": "src/components/table/table.types.ts::TablePageSizeChangeDetail",
|
|
2611
|
+
"referenceLocation": "TablePageSizeChangeDetail"
|
|
2612
|
+
}
|
|
2613
|
+
}
|
|
2614
|
+
}
|
|
2615
|
+
}, {
|
|
2616
|
+
"method": "brTableSearch",
|
|
2617
|
+
"name": "brTableSearch",
|
|
2618
|
+
"bubbles": true,
|
|
2619
|
+
"cancelable": true,
|
|
2620
|
+
"composed": true,
|
|
2621
|
+
"docs": {
|
|
2622
|
+
"tags": [],
|
|
2623
|
+
"text": "Evento customizado originado em `br-table-bar` e propagado pela tabela,\nsem reemiss\u00E3o. Envia `{ term }` por Enter ou bot\u00E3o e `{ term: '' }` ao fechar.\nDigita\u00E7\u00E3o, inicializa\u00E7\u00E3o e altera\u00E7\u00F5es program\u00E1ticas n\u00E3o emitem o evento.\nPropaga, atravessa Shadow DOM e \u00E9 cancel\u00E1vel."
|
|
2624
|
+
},
|
|
2625
|
+
"complexType": {
|
|
2626
|
+
"original": "TableSearchDetail",
|
|
2627
|
+
"resolved": "{ term: string; }",
|
|
2628
|
+
"references": {
|
|
2629
|
+
"TableSearchDetail": {
|
|
2630
|
+
"location": "import",
|
|
2631
|
+
"path": "./table.types",
|
|
2632
|
+
"id": "src/components/table/table.types.ts::TableSearchDetail",
|
|
2633
|
+
"referenceLocation": "TableSearchDetail"
|
|
2634
|
+
}
|
|
2635
|
+
}
|
|
2636
|
+
}
|
|
2637
|
+
}];
|
|
1020
2638
|
}
|
|
1021
2639
|
static get methods() {
|
|
1022
2640
|
return {
|
|
@@ -1033,7 +2651,7 @@ export class Table {
|
|
|
1033
2651
|
"return": "Promise<void>"
|
|
1034
2652
|
},
|
|
1035
2653
|
"docs": {
|
|
1036
|
-
"text": "Inicia o estado de carregamento da tabela.",
|
|
2654
|
+
"text": "Inicia o estado visual de carregamento sem alterar os dados da tabela.",
|
|
1037
2655
|
"tags": []
|
|
1038
2656
|
}
|
|
1039
2657
|
},
|
|
@@ -1050,7 +2668,189 @@ export class Table {
|
|
|
1050
2668
|
"return": "Promise<void>"
|
|
1051
2669
|
},
|
|
1052
2670
|
"docs": {
|
|
1053
|
-
"text": "Interrompe o estado de carregamento da tabela.",
|
|
2671
|
+
"text": "Interrompe o estado visual de carregamento sem alterar os dados da tabela.",
|
|
2672
|
+
"tags": []
|
|
2673
|
+
}
|
|
2674
|
+
},
|
|
2675
|
+
"setData": {
|
|
2676
|
+
"complexType": {
|
|
2677
|
+
"signature": "(data: TableData) => Promise<void>",
|
|
2678
|
+
"parameters": [{
|
|
2679
|
+
"name": "data",
|
|
2680
|
+
"type": "{ headerRows?: TableColumnData[][]; columns: TableColumnData[]; rows: TableRowData[]; globalActions?: TableActionData[]; contextualActions?: TableActionData[]; }",
|
|
2681
|
+
"docs": "Colunas, linhas e a\u00E7\u00F5es que formar\u00E3o a tabela."
|
|
2682
|
+
}],
|
|
2683
|
+
"references": {
|
|
2684
|
+
"Promise": {
|
|
2685
|
+
"location": "global",
|
|
2686
|
+
"id": "global::Promise"
|
|
2687
|
+
},
|
|
2688
|
+
"TableData": {
|
|
2689
|
+
"location": "import",
|
|
2690
|
+
"path": "./table.types",
|
|
2691
|
+
"id": "src/components/table/table.types.ts::TableData",
|
|
2692
|
+
"referenceLocation": "TableData"
|
|
2693
|
+
}
|
|
2694
|
+
},
|
|
2695
|
+
"return": "Promise<void>"
|
|
2696
|
+
},
|
|
2697
|
+
"docs": {
|
|
2698
|
+
"text": "Substitui os dados l\u00F3gicos da tabela e reconstr\u00F3i seus subcomponentes.",
|
|
2699
|
+
"tags": [{
|
|
2700
|
+
"name": "remarks",
|
|
2701
|
+
"text": "Esta \u00E9 a mesma estrutura interna utilizada ap\u00F3s a ingest\u00E3o dos slots."
|
|
2702
|
+
}, {
|
|
2703
|
+
"name": "param",
|
|
2704
|
+
"text": "data Colunas, linhas e a\u00E7\u00F5es que formar\u00E3o a tabela."
|
|
2705
|
+
}, {
|
|
2706
|
+
"name": "example",
|
|
2707
|
+
"text": "```js\nconst table = document.querySelector('br-table');\nawait table.setData({\n columns: [],\n headerRows: [\n [{ content: 'Unidade', rowSpan: 2 }, { content: 'Equipe', colSpan: 2 }],\n [{ content: 'Nome', sortable: true }, { content: 'Cargo', sortable: true }],\n ],\n rows: [\n { rowGroup: 'brasilia', cells: [\n { content: 'Bras\u00EDlia', rowSpan: 2, rowHeader: true },\n { content: 'Ana' }, { content: 'Analista' },\n ] },\n { rowGroup: 'brasilia', cells: [{ content: 'Carlos' }, { content: 'T\u00E9cnico' }] },\n ],\n});\n```"
|
|
2708
|
+
}]
|
|
2709
|
+
}
|
|
2710
|
+
},
|
|
2711
|
+
"getSelectedRows": {
|
|
2712
|
+
"complexType": {
|
|
2713
|
+
"signature": "() => Promise<HTMLBrTableRowElement[]>",
|
|
2714
|
+
"parameters": [],
|
|
2715
|
+
"references": {
|
|
2716
|
+
"Promise": {
|
|
2717
|
+
"location": "global",
|
|
2718
|
+
"id": "global::Promise"
|
|
2719
|
+
},
|
|
2720
|
+
"HTMLBrTableRowElement": {
|
|
2721
|
+
"location": "global",
|
|
2722
|
+
"id": "global::HTMLBrTableRowElement"
|
|
2723
|
+
}
|
|
2724
|
+
},
|
|
2725
|
+
"return": "Promise<HTMLBrTableRowElement[]>"
|
|
2726
|
+
},
|
|
2727
|
+
"docs": {
|
|
2728
|
+
"text": "Retorna as linhas atualmente selecionadas.",
|
|
2729
|
+
"tags": [{
|
|
2730
|
+
"name": "returns",
|
|
2731
|
+
"text": "Elementos `br-table-row` selecionados no corpo."
|
|
2732
|
+
}]
|
|
2733
|
+
}
|
|
2734
|
+
},
|
|
2735
|
+
"selectAllRows": {
|
|
2736
|
+
"complexType": {
|
|
2737
|
+
"signature": "() => Promise<void>",
|
|
2738
|
+
"parameters": [],
|
|
2739
|
+
"references": {
|
|
2740
|
+
"Promise": {
|
|
2741
|
+
"location": "global",
|
|
2742
|
+
"id": "global::Promise"
|
|
2743
|
+
}
|
|
2744
|
+
},
|
|
2745
|
+
"return": "Promise<void>"
|
|
2746
|
+
},
|
|
2747
|
+
"docs": {
|
|
2748
|
+
"text": "Seleciona todas as linhas eleg\u00EDveis.",
|
|
2749
|
+
"tags": []
|
|
2750
|
+
}
|
|
2751
|
+
},
|
|
2752
|
+
"clearSelection": {
|
|
2753
|
+
"complexType": {
|
|
2754
|
+
"signature": "() => Promise<void>",
|
|
2755
|
+
"parameters": [],
|
|
2756
|
+
"references": {
|
|
2757
|
+
"Promise": {
|
|
2758
|
+
"location": "global",
|
|
2759
|
+
"id": "global::Promise"
|
|
2760
|
+
}
|
|
2761
|
+
},
|
|
2762
|
+
"return": "Promise<void>"
|
|
2763
|
+
},
|
|
2764
|
+
"docs": {
|
|
2765
|
+
"text": "Limpa a sele\u00E7\u00E3o de todas as linhas eleg\u00EDveis.",
|
|
2766
|
+
"tags": []
|
|
2767
|
+
}
|
|
2768
|
+
},
|
|
2769
|
+
"getSorting": {
|
|
2770
|
+
"complexType": {
|
|
2771
|
+
"signature": "() => Promise<TableSortState[]>",
|
|
2772
|
+
"parameters": [],
|
|
2773
|
+
"references": {
|
|
2774
|
+
"Promise": {
|
|
2775
|
+
"location": "global",
|
|
2776
|
+
"id": "global::Promise"
|
|
2777
|
+
},
|
|
2778
|
+
"TableSortState": {
|
|
2779
|
+
"location": "import",
|
|
2780
|
+
"path": "./table.types",
|
|
2781
|
+
"id": "src/components/table/table.types.ts::TableSortState",
|
|
2782
|
+
"referenceLocation": "TableSortState"
|
|
2783
|
+
}
|
|
2784
|
+
},
|
|
2785
|
+
"return": "Promise<TableSortState[]>"
|
|
2786
|
+
},
|
|
2787
|
+
"docs": {
|
|
2788
|
+
"text": "Retorna o estado atual de ordena\u00E7\u00E3o aplicado na tabela.",
|
|
2789
|
+
"tags": []
|
|
2790
|
+
}
|
|
2791
|
+
},
|
|
2792
|
+
"expandRow": {
|
|
2793
|
+
"complexType": {
|
|
2794
|
+
"signature": "(rowIndex: number) => Promise<void>",
|
|
2795
|
+
"parameters": [{
|
|
2796
|
+
"name": "rowIndex",
|
|
2797
|
+
"type": "number",
|
|
2798
|
+
"docs": "\u00CDndice da linha, come\u00E7ando em zero."
|
|
2799
|
+
}],
|
|
2800
|
+
"references": {
|
|
2801
|
+
"Promise": {
|
|
2802
|
+
"location": "global",
|
|
2803
|
+
"id": "global::Promise"
|
|
2804
|
+
}
|
|
2805
|
+
},
|
|
2806
|
+
"return": "Promise<void>"
|
|
2807
|
+
},
|
|
2808
|
+
"docs": {
|
|
2809
|
+
"text": "Expande uma linha eleg\u00EDvel do corpo.",
|
|
2810
|
+
"tags": [{
|
|
2811
|
+
"name": "param",
|
|
2812
|
+
"text": "rowIndex \u00CDndice da linha, come\u00E7ando em zero."
|
|
2813
|
+
}]
|
|
2814
|
+
}
|
|
2815
|
+
},
|
|
2816
|
+
"collapseRow": {
|
|
2817
|
+
"complexType": {
|
|
2818
|
+
"signature": "(rowIndex: number) => Promise<void>",
|
|
2819
|
+
"parameters": [{
|
|
2820
|
+
"name": "rowIndex",
|
|
2821
|
+
"type": "number",
|
|
2822
|
+
"docs": "\u00CDndice da linha, come\u00E7ando em zero."
|
|
2823
|
+
}],
|
|
2824
|
+
"references": {
|
|
2825
|
+
"Promise": {
|
|
2826
|
+
"location": "global",
|
|
2827
|
+
"id": "global::Promise"
|
|
2828
|
+
}
|
|
2829
|
+
},
|
|
2830
|
+
"return": "Promise<void>"
|
|
2831
|
+
},
|
|
2832
|
+
"docs": {
|
|
2833
|
+
"text": "Recolhe uma linha do corpo.",
|
|
2834
|
+
"tags": [{
|
|
2835
|
+
"name": "param",
|
|
2836
|
+
"text": "rowIndex \u00CDndice da linha, come\u00E7ando em zero."
|
|
2837
|
+
}]
|
|
2838
|
+
}
|
|
2839
|
+
},
|
|
2840
|
+
"collapseAllRows": {
|
|
2841
|
+
"complexType": {
|
|
2842
|
+
"signature": "() => Promise<void>",
|
|
2843
|
+
"parameters": [],
|
|
2844
|
+
"references": {
|
|
2845
|
+
"Promise": {
|
|
2846
|
+
"location": "global",
|
|
2847
|
+
"id": "global::Promise"
|
|
2848
|
+
}
|
|
2849
|
+
},
|
|
2850
|
+
"return": "Promise<void>"
|
|
2851
|
+
},
|
|
2852
|
+
"docs": {
|
|
2853
|
+
"text": "Recolhe todas as linhas que estiverem expandidas.",
|
|
1054
2854
|
"tags": []
|
|
1055
2855
|
}
|
|
1056
2856
|
}
|
|
@@ -1064,6 +2864,18 @@ export class Table {
|
|
|
1064
2864
|
}, {
|
|
1065
2865
|
"propName": "density",
|
|
1066
2866
|
"methodName": "handleDensityChange"
|
|
2867
|
+
}, {
|
|
2868
|
+
"propName": "visibleRows",
|
|
2869
|
+
"methodName": "handleVisibleRowsChange"
|
|
2870
|
+
}, {
|
|
2871
|
+
"propName": "hasPagination",
|
|
2872
|
+
"methodName": "handleHasPaginationChange"
|
|
2873
|
+
}, {
|
|
2874
|
+
"propName": "currentPage",
|
|
2875
|
+
"methodName": "handleCurrentPageChange"
|
|
2876
|
+
}, {
|
|
2877
|
+
"propName": "pageSize",
|
|
2878
|
+
"methodName": "handlePageSizeChange"
|
|
1067
2879
|
}, {
|
|
1068
2880
|
"propName": "hasColumnDivider",
|
|
1069
2881
|
"methodName": "handleDividerChange"
|
|
@@ -1089,11 +2901,80 @@ export class Table {
|
|
|
1089
2901
|
"propName": "overflow",
|
|
1090
2902
|
"methodName": "handleOverflowChange"
|
|
1091
2903
|
}, {
|
|
1092
|
-
"propName": "
|
|
1093
|
-
"methodName": "
|
|
2904
|
+
"propName": "virtualExpandedContentHeight",
|
|
2905
|
+
"methodName": "handleVirtualExpandedContentHeightChange"
|
|
2906
|
+
}, {
|
|
2907
|
+
"propName": "hasRowSelection",
|
|
2908
|
+
"methodName": "handleRowSelectionChange"
|
|
2909
|
+
}, {
|
|
2910
|
+
"propName": "hasRowHover",
|
|
2911
|
+
"methodName": "handleRowHoverChange"
|
|
2912
|
+
}, {
|
|
2913
|
+
"propName": "hasRowExpansion",
|
|
2914
|
+
"methodName": "handleRowExpansionChange"
|
|
2915
|
+
}, {
|
|
2916
|
+
"propName": "sortMode",
|
|
2917
|
+
"methodName": "handleSortModeChange"
|
|
2918
|
+
}, {
|
|
2919
|
+
"propName": "sortStrategy",
|
|
2920
|
+
"methodName": "handleSortStrategyChange"
|
|
2921
|
+
}];
|
|
2922
|
+
}
|
|
2923
|
+
static get listeners() {
|
|
2924
|
+
return [{
|
|
2925
|
+
"name": "brInternalTableHeaderHeight",
|
|
2926
|
+
"method": "handleHeaderHeight",
|
|
2927
|
+
"target": undefined,
|
|
2928
|
+
"capture": false,
|
|
2929
|
+
"passive": false
|
|
2930
|
+
}, {
|
|
2931
|
+
"name": "brDropdownOpenChange",
|
|
2932
|
+
"method": "handleDropdownOpenChange",
|
|
2933
|
+
"target": undefined,
|
|
2934
|
+
"capture": false,
|
|
2935
|
+
"passive": false
|
|
2936
|
+
}, {
|
|
2937
|
+
"name": "brInternalTableCellFocus",
|
|
2938
|
+
"method": "handleCellFocusRegistration",
|
|
2939
|
+
"target": undefined,
|
|
2940
|
+
"capture": false,
|
|
2941
|
+
"passive": false
|
|
2942
|
+
}, {
|
|
2943
|
+
"name": "focusin",
|
|
2944
|
+
"method": "handleGridFocusIn",
|
|
2945
|
+
"target": undefined,
|
|
2946
|
+
"capture": false,
|
|
2947
|
+
"passive": false
|
|
2948
|
+
}, {
|
|
2949
|
+
"name": "focusout",
|
|
2950
|
+
"method": "handleGridFocusOut",
|
|
2951
|
+
"target": undefined,
|
|
2952
|
+
"capture": false,
|
|
2953
|
+
"passive": false
|
|
2954
|
+
}, {
|
|
2955
|
+
"name": "keydown",
|
|
2956
|
+
"method": "handleGridKeyDown",
|
|
2957
|
+
"target": undefined,
|
|
2958
|
+
"capture": false,
|
|
2959
|
+
"passive": false
|
|
2960
|
+
}, {
|
|
2961
|
+
"name": "brInternalTableSortRequest",
|
|
2962
|
+
"method": "handleSortRequest",
|
|
2963
|
+
"target": undefined,
|
|
2964
|
+
"capture": false,
|
|
2965
|
+
"passive": false
|
|
2966
|
+
}, {
|
|
2967
|
+
"name": "checkedChange",
|
|
2968
|
+
"method": "handleSelectionCheckboxChange",
|
|
2969
|
+
"target": undefined,
|
|
2970
|
+
"capture": false,
|
|
2971
|
+
"passive": false
|
|
1094
2972
|
}, {
|
|
1095
|
-
"
|
|
1096
|
-
"
|
|
2973
|
+
"name": "brTableActionClick",
|
|
2974
|
+
"method": "handleActionClick",
|
|
2975
|
+
"target": undefined,
|
|
2976
|
+
"capture": false,
|
|
2977
|
+
"passive": false
|
|
1097
2978
|
}];
|
|
1098
2979
|
}
|
|
1099
2980
|
}
|