draft-components 1.13.0 → 2.0.1
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/css/draft-components.css +553 -558
- package/css/draft-components.dark.css +185 -113
- package/dist/components/alert/alert.d.ts +15 -0
- package/dist/components/alert/alert.js +12 -0
- package/dist/components/alert/index.d.ts +1 -0
- package/dist/components/alert/index.js +1 -0
- package/{types → dist}/components/avatar/avatar.d.ts +8 -7
- package/dist/components/avatar/avatar.js +41 -0
- package/dist/components/avatar/index.d.ts +1 -0
- package/dist/components/avatar/index.js +1 -0
- package/dist/components/avatar-group/avatar-group.js +5 -0
- package/dist/components/avatar-group/index.d.ts +1 -0
- package/dist/components/avatar-group/index.js +1 -0
- package/{esm → dist}/components/badge/badge.js +3 -6
- package/dist/components/badge/index.d.ts +1 -0
- package/dist/components/badge/index.js +1 -0
- package/dist/components/breadcrumbs/breadcrumbs-context.js +13 -0
- package/dist/components/breadcrumbs/breadcrumbs-item.js +16 -0
- package/dist/components/breadcrumbs/breadcrumbs.js +7 -0
- package/dist/components/breadcrumbs/index.d.ts +2 -0
- package/dist/components/breadcrumbs/index.js +2 -0
- package/{types → dist}/components/button/button.d.ts +12 -10
- package/dist/components/button/button.js +22 -0
- package/dist/components/button/icon-button.d.ts +4 -0
- package/dist/components/button/icon-button.js +7 -0
- package/dist/components/button/index.d.ts +2 -0
- package/dist/components/button/index.js +2 -0
- package/dist/components/button-group/button-group.js +5 -0
- package/dist/components/button-group/index.d.ts +1 -0
- package/dist/components/button-group/index.js +1 -0
- package/dist/components/caption/caption.d.ts +10 -0
- package/dist/components/caption/caption.js +10 -0
- package/dist/components/caption/index.d.ts +1 -0
- package/dist/components/caption/index.js +1 -0
- package/dist/components/checkbox/checkbox.js +15 -0
- package/dist/components/checkbox/index.d.ts +1 -0
- package/dist/components/checkbox/index.js +1 -0
- package/dist/components/color-picker/color-picker-button.js +11 -0
- package/{esm → dist}/components/color-picker/color-picker.js +4 -7
- package/dist/components/color-picker/index.d.ts +1 -0
- package/dist/components/color-picker/index.js +1 -0
- package/{esm → dist}/components/date-picker/calendar-day.js +4 -7
- package/{types → dist}/components/date-picker/calendar-grid-head.d.ts +1 -1
- package/dist/components/date-picker/calendar-grid-head.js +11 -0
- package/{types → dist}/components/date-picker/calendar-grid.d.ts +2 -2
- package/{esm → dist}/components/date-picker/calendar-grid.js +7 -10
- package/dist/components/date-picker/calendar-header.js +43 -0
- package/{types → dist}/components/date-picker/calendar.d.ts +3 -3
- package/dist/components/date-picker/calendar.js +19 -0
- package/{esm → dist}/components/date-picker/date-helpers.js +20 -22
- package/{types → dist}/components/date-picker/date-picker.d.ts +2 -2
- package/dist/components/date-picker/date-picker.js +15 -0
- package/{types → dist}/components/date-picker/date-range-picker.d.ts +3 -3
- package/{esm → dist}/components/date-picker/date-range-picker.js +4 -7
- package/{types → dist}/components/date-picker/date-range.d.ts +1 -1
- package/{esm → dist}/components/date-picker/date-range.js +1 -4
- package/dist/components/date-picker/index.d.ts +2 -0
- package/dist/components/date-picker/index.js +2 -0
- package/{types → dist}/components/date-picker/parse-min-max-props.d.ts +1 -1
- package/{esm → dist}/components/date-picker/parse-min-max-props.js +1 -4
- package/{types → dist}/components/date-picker-popover/date-picker-popover.d.ts +2 -2
- package/dist/components/date-picker-popover/date-picker-popover.js +15 -0
- package/dist/components/date-picker-popover/index.d.ts +1 -0
- package/dist/components/date-picker-popover/index.js +1 -0
- package/dist/components/date-range-picker-popover/date-range-picker-popover-footer.js +5 -0
- package/{types → dist}/components/date-range-picker-popover/date-range-picker-popover-presets.d.ts +1 -1
- package/dist/components/date-range-picker-popover/date-range-picker-popover-presets.js +30 -0
- package/{types → dist}/components/date-range-picker-popover/date-range-picker-popover.d.ts +3 -3
- package/{esm → dist}/components/date-range-picker-popover/date-range-picker-popover.js +7 -14
- package/{types → dist}/components/date-range-picker-popover/helpers.d.ts +1 -1
- package/{esm → dist}/components/date-range-picker-popover/helpers.js +1 -3
- package/dist/components/date-range-picker-popover/index.d.ts +2 -0
- package/dist/components/date-range-picker-popover/index.js +2 -0
- package/{types → dist}/components/date-range-picker-popover/types.d.ts +1 -1
- package/dist/components/date-range-picker-popover/types.js +1 -0
- package/{esm → dist}/components/date-range-picker-popover/use-is-compact-view.js +2 -5
- package/dist/components/dialog/dialog-body.js +7 -0
- package/{esm → dist}/components/dialog/dialog-context.js +4 -7
- package/dist/components/dialog/dialog-footer.js +8 -0
- package/dist/components/dialog/dialog-header.js +15 -0
- package/{esm → dist}/components/dialog/dialog.js +9 -15
- package/dist/components/dialog/index.d.ts +4 -0
- package/dist/components/dialog/index.js +4 -0
- package/dist/components/empty-state/empty-state.d.ts +12 -0
- package/dist/components/empty-state/empty-state.js +17 -0
- package/dist/components/empty-state/index.d.ts +1 -0
- package/dist/components/empty-state/index.js +1 -0
- package/{esm → dist}/components/file-picker/file-picker.js +6 -10
- package/dist/components/file-picker/index.d.ts +1 -0
- package/dist/components/file-picker/index.js +1 -0
- package/dist/components/filter-buttons/filter-button.js +6 -0
- package/{esm → dist}/components/filter-buttons/filter-buttons.js +4 -7
- package/dist/components/filter-buttons/index.d.ts +2 -0
- package/dist/components/filter-buttons/index.js +2 -0
- package/{types → dist}/components/filtered-search/filter-item.d.ts +1 -1
- package/dist/components/filtered-search/filter-item.js +17 -0
- package/dist/components/filtered-search/filter-operator-select.js +12 -0
- package/dist/components/filtered-search/filter-token.js +12 -0
- package/dist/components/filtered-search/filter-value-list.js +15 -0
- package/{types → dist}/components/filtered-search/filtered-search.d.ts +1 -1
- package/{esm → dist}/components/filtered-search/filtered-search.js +11 -16
- package/{types → dist}/components/filtered-search/index.d.ts +4 -4
- package/dist/components/filtered-search/index.js +3 -0
- package/dist/components/filtered-search/model/abstract-filter.js +2 -0
- package/{types → dist}/components/filtered-search/model/string-filter.d.ts +2 -2
- package/{esm → dist}/components/filtered-search/model/string-filter.js +1 -4
- package/{types → dist}/components/filtered-search/model/string-set-filter.d.ts +1 -1
- package/{esm → dist}/components/filtered-search/model/string-set-filter.js +1 -4
- package/dist/components/filtered-search/model/validation-result.js +1 -0
- package/dist/components/filtered-search/string-filter-input.js +15 -0
- package/{types → dist}/components/filtered-search/string-filter-item.d.ts +1 -1
- package/{esm → dist}/components/filtered-search/string-filter-item.js +6 -10
- package/{types → dist}/components/filtered-search/string-set-filter-item.d.ts +1 -1
- package/{esm → dist}/components/filtered-search/string-set-filter-item.js +6 -10
- package/{types → dist}/components/filtered-search/types.d.ts +2 -2
- package/dist/components/filtered-search/types.js +1 -0
- package/{esm → dist}/components/filtered-search/use-combobox-ids.js +2 -5
- package/{esm → dist}/components/filtered-search/use-translations.js +4 -7
- package/{types → dist}/components/form-field/form-field.d.ts +7 -3
- package/dist/components/form-field/form-field.js +37 -0
- package/dist/components/form-field/index.d.ts +1 -0
- package/dist/components/form-field/index.js +1 -0
- package/dist/components/hero-icons/24/outline/arrow-small-down-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/outline/arrow-small-down-icon.js +5 -0
- package/dist/components/hero-icons/24/outline/arrow-small-up-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/outline/arrow-small-up-icon.js +5 -0
- package/dist/components/hero-icons/24/outline/arrows-up-down-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/outline/arrows-up-down-icon.js +5 -0
- package/dist/components/hero-icons/24/outline/chevron-left-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/outline/chevron-left-icon.js +5 -0
- package/dist/components/hero-icons/24/outline/chevron-right-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/outline/chevron-right-icon.js +5 -0
- package/dist/components/hero-icons/24/outline/eye-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/outline/eye-icon.js +5 -0
- package/dist/components/hero-icons/24/outline/eye-slash-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/outline/eye-slash-icon.js +5 -0
- package/dist/components/hero-icons/24/outline/magnifying-glass-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/outline/magnifying-glass-icon.js +5 -0
- package/dist/components/hero-icons/24/outline/trash-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/outline/trash-icon.js +5 -0
- package/dist/components/hero-icons/24/outline/x-mark-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/outline/x-mark-icon.js +5 -0
- package/dist/components/hero-icons/24/solid/exclamation-triangle-icon.d.ts +4 -0
- package/dist/components/hero-icons/24/solid/exclamation-triangle-icon.js +5 -0
- package/dist/components/index.d.ts +42 -0
- package/dist/components/index.js +42 -0
- package/dist/components/label/index.d.ts +1 -0
- package/dist/components/label/index.js +1 -0
- package/dist/components/label/label.js +8 -0
- package/dist/components/menu/index.d.ts +3 -0
- package/dist/components/menu/index.js +3 -0
- package/{types → dist}/components/menu/menu-item.d.ts +4 -6
- package/dist/components/menu/menu-item.js +16 -0
- package/dist/components/menu/menu-separator.js +5 -0
- package/{types → dist}/components/menu/menu.d.ts +6 -5
- package/{esm → dist}/components/menu/menu.js +7 -11
- package/dist/components/nav-list/index.d.ts +3 -0
- package/dist/components/nav-list/index.js +3 -0
- package/dist/components/nav-list/nav-list-item.js +15 -0
- package/dist/components/nav-list/nav-list-title.js +5 -0
- package/dist/components/nav-list/nav-list.js +5 -0
- package/dist/components/password-input/index.d.ts +1 -0
- package/dist/components/password-input/index.js +1 -0
- package/dist/components/password-input/password-input.d.ts +9 -0
- package/dist/components/password-input/password-input.js +17 -0
- package/dist/components/popover/index.d.ts +1 -0
- package/dist/components/popover/index.js +1 -0
- package/{types → dist}/components/popover/popover.d.ts +1 -1
- package/{esm → dist}/components/popover/popover.js +8 -11
- package/{esm → dist}/components/popover/use-page-click.js +2 -5
- package/dist/components/portal/index.d.ts +1 -0
- package/dist/components/portal/index.js +1 -0
- package/{esm → dist}/components/portal/portal-context.js +6 -5
- package/{esm → dist}/components/portal/portal.js +1 -4
- package/{types → dist}/components/positioner/calc-position.d.ts +1 -1
- package/{esm → dist}/components/positioner/calc-position.js +2 -4
- package/dist/components/positioner/index.d.ts +1 -0
- package/dist/components/positioner/index.js +1 -0
- package/{types → dist}/components/positioner/positioner.d.ts +1 -1
- package/{esm → dist}/components/positioner/positioner.js +5 -8
- package/dist/components/positioner/types.js +1 -0
- package/dist/components/radio/index.d.ts +1 -0
- package/dist/components/radio/index.js +1 -0
- package/dist/components/radio/radio.js +23 -0
- package/dist/components/segmented-control/index.d.ts +1 -0
- package/dist/components/segmented-control/index.js +1 -0
- package/dist/components/segmented-control/segmented-button.d.ts +11 -0
- package/dist/components/segmented-control/segmented-button.js +10 -0
- package/{types → dist}/components/segmented-control/segmented-control.d.ts +5 -3
- package/dist/components/segmented-control/segmented-control.js +15 -0
- package/dist/components/select/index.d.ts +1 -0
- package/dist/components/select/index.js +1 -0
- package/{types → dist}/components/select/select.d.ts +9 -9
- package/dist/components/select/select.js +34 -0
- package/dist/components/selection-control/index.d.ts +1 -0
- package/dist/components/selection-control/index.js +1 -0
- package/dist/components/selection-control/selection-control.js +15 -0
- package/{types → dist}/components/slide-over/index.d.ts +4 -4
- package/dist/components/slide-over/index.js +3 -0
- package/dist/components/slide-over/slide-over-body.js +5 -0
- package/{types → dist}/components/slide-over/slide-over-context.d.ts +1 -1
- package/dist/components/slide-over/slide-over-context.js +18 -0
- package/dist/components/slide-over/slide-over-header.js +13 -0
- package/{types → dist}/components/slide-over/slide-over.d.ts +3 -3
- package/{esm → dist}/components/slide-over/slide-over.js +7 -12
- package/dist/components/slide-over/types.js +1 -0
- package/dist/components/slider/index.d.ts +2 -0
- package/dist/components/slider/index.js +2 -0
- package/dist/components/slider/slider-tick-marks.js +12 -0
- package/{types → dist}/components/slider/slider.d.ts +1 -1
- package/{esm → dist}/components/slider/slider.js +5 -8
- package/dist/components/spinner/index.d.ts +1 -0
- package/dist/components/spinner/index.js +1 -0
- package/dist/components/spinner/spinner.js +6 -0
- package/dist/components/switch/index.d.ts +1 -0
- package/dist/components/switch/index.js +1 -0
- package/dist/components/switch/switch.js +12 -0
- package/dist/components/table/index.d.ts +7 -0
- package/dist/components/table/index.js +7 -0
- package/dist/components/table/table-body.js +6 -0
- package/dist/components/table/table-cell.js +6 -0
- package/{esm → dist}/components/table/table-container.js +3 -6
- package/{types → dist}/components/table/table-head-cell.d.ts +1 -1
- package/dist/components/table/table-head-cell.js +27 -0
- package/dist/components/table/table-head.js +9 -0
- package/dist/components/table/table-row.js +9 -0
- package/{esm → dist}/components/table/table.js +3 -6
- package/dist/components/tabs/index.d.ts +4 -0
- package/dist/components/tabs/index.js +4 -0
- package/{esm → dist}/components/tabs/tab-list.js +3 -6
- package/{types → dist}/components/tabs/tab-panel.d.ts +1 -1
- package/dist/components/tabs/tab-panel.js +11 -0
- package/dist/components/tabs/tab.js +14 -0
- package/{types → dist}/components/tabs/tabs-context.d.ts +1 -1
- package/{esm → dist}/components/tabs/tabs-context.js +5 -8
- package/{types → dist}/components/tabs/tabs.d.ts +1 -1
- package/dist/components/tabs/tabs.js +6 -0
- package/dist/components/tabs/types.js +1 -0
- package/dist/components/tag/index.d.ts +1 -0
- package/dist/components/tag/index.js +1 -0
- package/dist/components/tag/tag.d.ts +15 -0
- package/dist/components/tag/tag.js +11 -0
- package/dist/components/text-input/index.d.ts +1 -0
- package/dist/components/text-input/index.js +1 -0
- package/{types → dist}/components/text-input/text-input.d.ts +12 -13
- package/dist/components/text-input/text-input.js +42 -0
- package/dist/components/textarea/index.d.ts +1 -0
- package/dist/components/textarea/index.js +1 -0
- package/dist/components/textarea/textarea.d.ts +12 -0
- package/dist/components/textarea/textarea.js +19 -0
- package/dist/components/toast/index.d.ts +2 -0
- package/dist/components/toast/index.js +2 -0
- package/dist/components/toast/toast-button.js +6 -0
- package/dist/components/toast/toast.js +6 -0
- package/dist/components/toaster/index.d.ts +1 -0
- package/dist/components/toaster/index.js +1 -0
- package/{esm → dist}/components/toaster/toaster.js +9 -13
- package/dist/components/tooltip/index.d.ts +1 -0
- package/dist/components/tooltip/index.js +1 -0
- package/{types → dist}/components/tooltip/tooltip.d.ts +1 -1
- package/{esm → dist}/components/tooltip/tooltip.js +8 -11
- package/dist/hooks/index.d.ts +4 -0
- package/dist/hooks/index.js +4 -0
- package/{esm → dist}/hooks/use-disable-body-scroll.js +1 -4
- package/{esm → dist}/hooks/use-esc-key-down.js +2 -5
- package/{esm → dist}/hooks/use-focus-trap.js +1 -4
- package/{esm → dist}/hooks/use-mount-transition.js +2 -5
- package/dist/index.d.ts +3 -0
- package/dist/index.js +3 -0
- package/{esm → dist}/lib/helpers.js +3 -5
- package/dist/lib/index.d.ts +3 -0
- package/dist/lib/index.js +3 -0
- package/{esm → dist}/lib/keyboard-keys.js +1 -3
- package/{esm → dist}/lib/react-helpers.js +6 -9
- package/package.json +41 -55
- package/cjs/components/alert/alert.cjs +0 -19
- package/cjs/components/avatar/avatar.cjs +0 -31
- package/cjs/components/avatar-group/avatar-group.cjs +0 -10
- package/cjs/components/badge/badge.cjs +0 -23
- package/cjs/components/breadcrumbs/breadcrumbs-context.cjs +0 -19
- package/cjs/components/breadcrumbs/breadcrumbs-item.cjs +0 -21
- package/cjs/components/breadcrumbs/breadcrumbs.cjs +0 -12
- package/cjs/components/button/button.cjs +0 -41
- package/cjs/components/button/icon-button.cjs +0 -12
- package/cjs/components/button-group/button-group.cjs +0 -10
- package/cjs/components/caption/caption.cjs +0 -27
- package/cjs/components/caption/icons.cjs +0 -21
- package/cjs/components/checkbox/checkbox.cjs +0 -20
- package/cjs/components/color-picker/color-picker-button.cjs +0 -16
- package/cjs/components/color-picker/color-picker.cjs +0 -24
- package/cjs/components/date-picker/calendar-day.cjs +0 -17
- package/cjs/components/date-picker/calendar-grid-head.cjs +0 -16
- package/cjs/components/date-picker/calendar-grid.cjs +0 -106
- package/cjs/components/date-picker/calendar-header.cjs +0 -48
- package/cjs/components/date-picker/calendar.cjs +0 -24
- package/cjs/components/date-picker/date-helpers.cjs +0 -112
- package/cjs/components/date-picker/date-picker.cjs +0 -20
- package/cjs/components/date-picker/date-range-picker.cjs +0 -61
- package/cjs/components/date-picker/date-range.cjs +0 -28
- package/cjs/components/date-picker/icons.cjs +0 -13
- package/cjs/components/date-picker/parse-min-max-props.cjs +0 -20
- package/cjs/components/date-picker-popover/date-picker-popover.cjs +0 -24
- package/cjs/components/date-range-picker-popover/date-range-picker-popover-footer.cjs +0 -11
- package/cjs/components/date-range-picker-popover/date-range-picker-popover-presets.cjs +0 -35
- package/cjs/components/date-range-picker-popover/date-range-picker-popover.cjs +0 -59
- package/cjs/components/date-range-picker-popover/helpers.cjs +0 -15
- package/cjs/components/date-range-picker-popover/use-is-compact-view.cjs +0 -27
- package/cjs/components/dialog/dialog-body.cjs +0 -12
- package/cjs/components/dialog/dialog-context.cjs +0 -24
- package/cjs/components/dialog/dialog-footer.cjs +0 -13
- package/cjs/components/dialog/dialog-header.cjs +0 -21
- package/cjs/components/dialog/dialog.cjs +0 -50
- package/cjs/components/dialog/x-mark-icon.cjs +0 -9
- package/cjs/components/empty-state/empty-state.cjs +0 -10
- package/cjs/components/file-picker/file-picker.cjs +0 -47
- package/cjs/components/filter-buttons/filter-button.cjs +0 -11
- package/cjs/components/filter-buttons/filter-buttons.cjs +0 -27
- package/cjs/components/filtered-search/filter-item.cjs +0 -23
- package/cjs/components/filtered-search/filter-operator-select.cjs +0 -17
- package/cjs/components/filtered-search/filter-token.cjs +0 -17
- package/cjs/components/filtered-search/filter-value-list.cjs +0 -20
- package/cjs/components/filtered-search/filtered-search.cjs +0 -225
- package/cjs/components/filtered-search/icons.cjs +0 -21
- package/cjs/components/filtered-search/model/abstract-filter.cjs +0 -6
- package/cjs/components/filtered-search/model/string-filter.cjs +0 -46
- package/cjs/components/filtered-search/model/string-set-filter.cjs +0 -44
- package/cjs/components/filtered-search/string-filter-input.cjs +0 -17
- package/cjs/components/filtered-search/string-filter-item.cjs +0 -68
- package/cjs/components/filtered-search/string-set-filter-item.cjs +0 -77
- package/cjs/components/filtered-search/use-combobox-ids.cjs +0 -17
- package/cjs/components/filtered-search/use-translations.cjs +0 -24
- package/cjs/components/form-field/form-field.cjs +0 -26
- package/cjs/components/index.cjs +0 -141
- package/cjs/components/label/label.cjs +0 -13
- package/cjs/components/menu/menu-item.cjs +0 -21
- package/cjs/components/menu/menu-separator.cjs +0 -10
- package/cjs/components/menu/menu.cjs +0 -191
- package/cjs/components/nav-list/nav-list-item.cjs +0 -20
- package/cjs/components/nav-list/nav-list-title.cjs +0 -10
- package/cjs/components/nav-list/nav-list.cjs +0 -10
- package/cjs/components/password-input/icons.cjs +0 -13
- package/cjs/components/password-input/password-input.cjs +0 -30
- package/cjs/components/popover/popover.cjs +0 -96
- package/cjs/components/popover/use-page-click.cjs +0 -51
- package/cjs/components/portal/portal-context.cjs +0 -22
- package/cjs/components/portal/portal.cjs +0 -11
- package/cjs/components/positioner/calc-position.cjs +0 -117
- package/cjs/components/positioner/positioner.cjs +0 -64
- package/cjs/components/radio/radio.cjs +0 -28
- package/cjs/components/segmented-control/segmented-control-button.cjs +0 -15
- package/cjs/components/segmented-control/segmented-control.cjs +0 -48
- package/cjs/components/select/select.cjs +0 -39
- package/cjs/components/selection-control/selection-control.cjs +0 -18
- package/cjs/components/slide-over/slide-over-body.cjs +0 -10
- package/cjs/components/slide-over/slide-over-context.cjs +0 -24
- package/cjs/components/slide-over/slide-over-header.cjs +0 -21
- package/cjs/components/slide-over/slide-over.cjs +0 -113
- package/cjs/components/slider/slider-tick-marks.cjs +0 -17
- package/cjs/components/slider/slider.cjs +0 -41
- package/cjs/components/spinner/spinner.cjs +0 -11
- package/cjs/components/switch/switch.cjs +0 -17
- package/cjs/components/table/icons.cjs +0 -17
- package/cjs/components/table/table-body.cjs +0 -11
- package/cjs/components/table/table-cell.cjs +0 -11
- package/cjs/components/table/table-container.cjs +0 -23
- package/cjs/components/table/table-head-cell.cjs +0 -30
- package/cjs/components/table/table-head.cjs +0 -14
- package/cjs/components/table/table-row.cjs +0 -14
- package/cjs/components/table/table.cjs +0 -16
- package/cjs/components/tabs/tab-list.cjs +0 -67
- package/cjs/components/tabs/tab-panel.cjs +0 -16
- package/cjs/components/tabs/tab.cjs +0 -19
- package/cjs/components/tabs/tabs-context.cjs +0 -31
- package/cjs/components/tabs/tabs.cjs +0 -11
- package/cjs/components/tag/tag.cjs +0 -16
- package/cjs/components/text-input/text-input.cjs +0 -42
- package/cjs/components/textarea/textarea.cjs +0 -40
- package/cjs/components/toast/toast-button.cjs +0 -11
- package/cjs/components/toast/toast.cjs +0 -11
- package/cjs/components/toast/x-mark-icon.cjs +0 -9
- package/cjs/components/toaster/toaster.cjs +0 -115
- package/cjs/components/tooltip/tooltip.cjs +0 -75
- package/cjs/hooks/index.cjs +0 -13
- package/cjs/hooks/use-disable-body-scroll.cjs +0 -37
- package/cjs/hooks/use-esc-key-down.cjs +0 -56
- package/cjs/hooks/use-focus-trap.cjs +0 -89
- package/cjs/hooks/use-mount-transition.cjs +0 -41
- package/cjs/index.cjs +0 -161
- package/cjs/lib/helpers.cjs +0 -25
- package/cjs/lib/index.cjs +0 -17
- package/cjs/lib/keyboard-keys.cjs +0 -19
- package/cjs/lib/react-helpers.cjs +0 -58
- package/esm/components/alert/alert.js +0 -17
- package/esm/components/avatar/avatar.js +0 -29
- package/esm/components/avatar-group/avatar-group.js +0 -8
- package/esm/components/breadcrumbs/breadcrumbs-context.js +0 -16
- package/esm/components/breadcrumbs/breadcrumbs-item.js +0 -19
- package/esm/components/breadcrumbs/breadcrumbs.js +0 -10
- package/esm/components/button/button.js +0 -39
- package/esm/components/button/icon-button.js +0 -10
- package/esm/components/button-group/button-group.js +0 -8
- package/esm/components/caption/caption.js +0 -25
- package/esm/components/caption/icons.js +0 -16
- package/esm/components/checkbox/checkbox.js +0 -18
- package/esm/components/color-picker/color-picker-button.js +0 -14
- package/esm/components/date-picker/calendar-grid-head.js +0 -14
- package/esm/components/date-picker/calendar-header.js +0 -46
- package/esm/components/date-picker/calendar.js +0 -22
- package/esm/components/date-picker/date-picker.js +0 -18
- package/esm/components/date-picker/icons.js +0 -10
- package/esm/components/date-picker-popover/date-picker-popover.js +0 -22
- package/esm/components/date-range-picker-popover/date-range-picker-popover-footer.js +0 -9
- package/esm/components/date-range-picker-popover/date-range-picker-popover-presets.js +0 -33
- package/esm/components/dialog/dialog-body.js +0 -10
- package/esm/components/dialog/dialog-footer.js +0 -11
- package/esm/components/dialog/dialog-header.js +0 -19
- package/esm/components/dialog/x-mark-icon.js +0 -7
- package/esm/components/empty-state/empty-state.js +0 -8
- package/esm/components/filter-buttons/filter-button.js +0 -9
- package/esm/components/filtered-search/filter-item.js +0 -21
- package/esm/components/filtered-search/filter-operator-select.js +0 -15
- package/esm/components/filtered-search/filter-token.js +0 -15
- package/esm/components/filtered-search/filter-value-list.js +0 -18
- package/esm/components/filtered-search/icons.js +0 -16
- package/esm/components/filtered-search/model/abstract-filter.js +0 -4
- package/esm/components/filtered-search/string-filter-input.js +0 -15
- package/esm/components/form-field/form-field.js +0 -24
- package/esm/components/index.js +0 -68
- package/esm/components/label/label.js +0 -11
- package/esm/components/menu/menu-item.js +0 -19
- package/esm/components/menu/menu-separator.js +0 -8
- package/esm/components/nav-list/nav-list-item.js +0 -18
- package/esm/components/nav-list/nav-list-title.js +0 -8
- package/esm/components/nav-list/nav-list.js +0 -8
- package/esm/components/password-input/icons.js +0 -10
- package/esm/components/password-input/password-input.js +0 -28
- package/esm/components/radio/radio.js +0 -26
- package/esm/components/segmented-control/segmented-control-button.js +0 -13
- package/esm/components/segmented-control/segmented-control.js +0 -46
- package/esm/components/select/select.js +0 -37
- package/esm/components/selection-control/selection-control.js +0 -16
- package/esm/components/slide-over/slide-over-body.js +0 -8
- package/esm/components/slide-over/slide-over-context.js +0 -21
- package/esm/components/slide-over/slide-over-header.js +0 -19
- package/esm/components/slider/slider-tick-marks.js +0 -15
- package/esm/components/spinner/spinner.js +0 -9
- package/esm/components/switch/switch.js +0 -15
- package/esm/components/table/icons.js +0 -13
- package/esm/components/table/table-body.js +0 -9
- package/esm/components/table/table-cell.js +0 -9
- package/esm/components/table/table-head-cell.js +0 -28
- package/esm/components/table/table-head.js +0 -12
- package/esm/components/table/table-row.js +0 -12
- package/esm/components/tabs/tab-panel.js +0 -14
- package/esm/components/tabs/tab.js +0 -17
- package/esm/components/tabs/tabs.js +0 -9
- package/esm/components/tag/tag.js +0 -14
- package/esm/components/text-input/text-input.js +0 -40
- package/esm/components/textarea/textarea.js +0 -38
- package/esm/components/toast/toast-button.js +0 -9
- package/esm/components/toast/toast.js +0 -9
- package/esm/components/toast/x-mark-icon.js +0 -7
- package/esm/hooks/index.js +0 -4
- package/esm/index.js +0 -75
- package/esm/lib/index.js +0 -3
- package/types/components/alert/alert.d.ts +0 -12
- package/types/components/alert/index.d.ts +0 -1
- package/types/components/avatar/index.d.ts +0 -1
- package/types/components/avatar-group/index.d.ts +0 -1
- package/types/components/badge/index.d.ts +0 -1
- package/types/components/breadcrumbs/index.d.ts +0 -2
- package/types/components/button/icon-button.d.ts +0 -7
- package/types/components/button/index.d.ts +0 -2
- package/types/components/button-group/index.d.ts +0 -1
- package/types/components/caption/caption.d.ts +0 -7
- package/types/components/caption/icons.d.ts +0 -5
- package/types/components/caption/index.d.ts +0 -1
- package/types/components/checkbox/index.d.ts +0 -1
- package/types/components/color-picker/index.d.ts +0 -1
- package/types/components/date-picker/icons.d.ts +0 -3
- package/types/components/date-picker/index.d.ts +0 -2
- package/types/components/date-picker-popover/index.d.ts +0 -1
- package/types/components/date-range-picker-popover/index.d.ts +0 -2
- package/types/components/dialog/index.d.ts +0 -4
- package/types/components/dialog/x-mark-icon.d.ts +0 -2
- package/types/components/empty-state/empty-state.d.ts +0 -11
- package/types/components/empty-state/index.d.ts +0 -1
- package/types/components/file-picker/index.d.ts +0 -1
- package/types/components/filter-buttons/index.d.ts +0 -2
- package/types/components/filtered-search/icons.d.ts +0 -5
- package/types/components/form-field/index.d.ts +0 -1
- package/types/components/index.d.ts +0 -42
- package/types/components/label/index.d.ts +0 -1
- package/types/components/menu/index.d.ts +0 -3
- package/types/components/nav-list/index.d.ts +0 -3
- package/types/components/password-input/icons.d.ts +0 -3
- package/types/components/password-input/index.d.ts +0 -1
- package/types/components/password-input/password-input.d.ts +0 -10
- package/types/components/popover/index.d.ts +0 -1
- package/types/components/portal/index.d.ts +0 -1
- package/types/components/positioner/index.d.ts +0 -1
- package/types/components/radio/index.d.ts +0 -1
- package/types/components/segmented-control/index.d.ts +0 -1
- package/types/components/segmented-control/segmented-control-button.d.ts +0 -10
- package/types/components/select/index.d.ts +0 -1
- package/types/components/selection-control/index.d.ts +0 -1
- package/types/components/slider/index.d.ts +0 -2
- package/types/components/spinner/index.d.ts +0 -1
- package/types/components/switch/index.d.ts +0 -1
- package/types/components/table/icons.d.ts +0 -4
- package/types/components/table/index.d.ts +0 -7
- package/types/components/tabs/index.d.ts +0 -4
- package/types/components/tag/index.d.ts +0 -1
- package/types/components/tag/tag.d.ts +0 -18
- package/types/components/text-input/index.d.ts +0 -1
- package/types/components/textarea/index.d.ts +0 -1
- package/types/components/textarea/textarea.d.ts +0 -20
- package/types/components/toast/index.d.ts +0 -2
- package/types/components/toast/x-mark-icon.d.ts +0 -2
- package/types/components/toaster/index.d.ts +0 -1
- package/types/components/tooltip/index.d.ts +0 -1
- package/types/hooks/index.d.ts +0 -4
- package/types/index.d.ts +0 -3
- package/types/lib/index.d.ts +0 -3
- /package/{types → dist}/components/avatar-group/avatar-group.d.ts +0 -0
- /package/{types → dist}/components/badge/badge.d.ts +0 -0
- /package/{types → dist}/components/breadcrumbs/breadcrumbs-context.d.ts +0 -0
- /package/{types → dist}/components/breadcrumbs/breadcrumbs-item.d.ts +0 -0
- /package/{types → dist}/components/breadcrumbs/breadcrumbs.d.ts +0 -0
- /package/{types → dist}/components/button-group/button-group.d.ts +0 -0
- /package/{types → dist}/components/checkbox/checkbox.d.ts +0 -0
- /package/{types → dist}/components/color-picker/color-picker-button.d.ts +0 -0
- /package/{types → dist}/components/color-picker/color-picker.d.ts +0 -0
- /package/{types → dist}/components/date-picker/calendar-day.d.ts +0 -0
- /package/{types → dist}/components/date-picker/calendar-header.d.ts +0 -0
- /package/{types → dist}/components/date-picker/date-helpers.d.ts +0 -0
- /package/{types → dist}/components/date-range-picker-popover/date-range-picker-popover-footer.d.ts +0 -0
- /package/{types → dist}/components/date-range-picker-popover/use-is-compact-view.d.ts +0 -0
- /package/{types → dist}/components/dialog/dialog-body.d.ts +0 -0
- /package/{types → dist}/components/dialog/dialog-context.d.ts +0 -0
- /package/{types → dist}/components/dialog/dialog-footer.d.ts +0 -0
- /package/{types → dist}/components/dialog/dialog-header.d.ts +0 -0
- /package/{types → dist}/components/dialog/dialog.d.ts +0 -0
- /package/{types → dist}/components/file-picker/file-picker.d.ts +0 -0
- /package/{types → dist}/components/filter-buttons/filter-button.d.ts +0 -0
- /package/{types → dist}/components/filter-buttons/filter-buttons.d.ts +0 -0
- /package/{types → dist}/components/filtered-search/filter-operator-select.d.ts +0 -0
- /package/{types → dist}/components/filtered-search/filter-token.d.ts +0 -0
- /package/{types → dist}/components/filtered-search/filter-value-list.d.ts +0 -0
- /package/{types → dist}/components/filtered-search/model/abstract-filter.d.ts +0 -0
- /package/{types → dist}/components/filtered-search/model/validation-result.d.ts +0 -0
- /package/{types → dist}/components/filtered-search/string-filter-input.d.ts +0 -0
- /package/{types → dist}/components/filtered-search/use-combobox-ids.d.ts +0 -0
- /package/{types → dist}/components/filtered-search/use-translations.d.ts +0 -0
- /package/{types → dist}/components/label/label.d.ts +0 -0
- /package/{types → dist}/components/menu/menu-separator.d.ts +0 -0
- /package/{types → dist}/components/nav-list/nav-list-item.d.ts +0 -0
- /package/{types → dist}/components/nav-list/nav-list-title.d.ts +0 -0
- /package/{types → dist}/components/nav-list/nav-list.d.ts +0 -0
- /package/{types → dist}/components/popover/use-page-click.d.ts +0 -0
- /package/{types → dist}/components/portal/portal-context.d.ts +0 -0
- /package/{types → dist}/components/portal/portal.d.ts +0 -0
- /package/{types → dist}/components/positioner/types.d.ts +0 -0
- /package/{types → dist}/components/radio/radio.d.ts +0 -0
- /package/{types → dist}/components/selection-control/selection-control.d.ts +0 -0
- /package/{types → dist}/components/slide-over/slide-over-body.d.ts +0 -0
- /package/{types → dist}/components/slide-over/slide-over-header.d.ts +0 -0
- /package/{types → dist}/components/slide-over/types.d.ts +0 -0
- /package/{types → dist}/components/slider/slider-tick-marks.d.ts +0 -0
- /package/{types → dist}/components/spinner/spinner.d.ts +0 -0
- /package/{types → dist}/components/switch/switch.d.ts +0 -0
- /package/{types → dist}/components/table/table-body.d.ts +0 -0
- /package/{types → dist}/components/table/table-cell.d.ts +0 -0
- /package/{types → dist}/components/table/table-container.d.ts +0 -0
- /package/{types → dist}/components/table/table-head.d.ts +0 -0
- /package/{types → dist}/components/table/table-row.d.ts +0 -0
- /package/{types → dist}/components/table/table.d.ts +0 -0
- /package/{types → dist}/components/tabs/tab-list.d.ts +0 -0
- /package/{types → dist}/components/tabs/tab.d.ts +0 -0
- /package/{types → dist}/components/tabs/types.d.ts +0 -0
- /package/{types → dist}/components/toast/toast-button.d.ts +0 -0
- /package/{types → dist}/components/toast/toast.d.ts +0 -0
- /package/{types → dist}/components/toaster/toaster.d.ts +0 -0
- /package/{types → dist}/hooks/use-disable-body-scroll.d.ts +0 -0
- /package/{types → dist}/hooks/use-esc-key-down.d.ts +0 -0
- /package/{types → dist}/hooks/use-focus-trap.d.ts +0 -0
- /package/{types → dist}/hooks/use-mount-transition.d.ts +0 -0
- /package/{types → dist}/lib/helpers.d.ts +0 -0
- /package/{types → dist}/lib/keyboard-keys.d.ts +0 -0
- /package/{types → dist}/lib/react-helpers.d.ts +0 -0
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
6
|
-
|
|
7
|
-
const TableContainer = react.forwardRef(function TableContainer({ border, className, children, ...props }, ref) {
|
|
8
|
-
let modifier = '';
|
|
9
|
-
if (typeof border === 'object' && border != null) {
|
|
10
|
-
modifier = reactHelpers.classNames({
|
|
11
|
-
'dc-table-container_border_top': border.top,
|
|
12
|
-
'dc-table-container_border_right': border.right,
|
|
13
|
-
'dc-table-container_border_bottom': border.bottom,
|
|
14
|
-
'dc-table-container_border_left': border.left,
|
|
15
|
-
});
|
|
16
|
-
}
|
|
17
|
-
else if (border === 'all') {
|
|
18
|
-
modifier = 'dc-table-container_border_all';
|
|
19
|
-
}
|
|
20
|
-
return (jsxRuntime.jsx("div", { ...props, ref: ref, className: reactHelpers.classNames(className, modifier, 'dc-table-container'), children: children }));
|
|
21
|
-
});
|
|
22
|
-
|
|
23
|
-
exports.TableContainer = TableContainer;
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
6
|
-
const icons = require('./icons.cjs');
|
|
7
|
-
|
|
8
|
-
const iconMapping = {
|
|
9
|
-
none: icons.ArrowsUpDown,
|
|
10
|
-
ascending: icons.ArrowSmallUp,
|
|
11
|
-
descending: icons.ArrowSmallDown,
|
|
12
|
-
};
|
|
13
|
-
const stateMapping = {
|
|
14
|
-
none: 'ascending',
|
|
15
|
-
ascending: 'descending',
|
|
16
|
-
descending: 'none',
|
|
17
|
-
};
|
|
18
|
-
const TableHeadCell = react.forwardRef(function TableHeaderCell({ isSortable = false, sort = 'none', className, children, onChangeSort, ...props }, ref) {
|
|
19
|
-
if (isSortable) {
|
|
20
|
-
const Icon = iconMapping[sort];
|
|
21
|
-
children = (jsxRuntime.jsxs("button", { className: "dc-table-cell__sort-btn", type: "button", onClick: () => onChangeSort?.(stateMapping[sort]), children: [children, " ", jsxRuntime.jsx(Icon, { className: "dc-table-cell__sort-icon", "aria-hidden": true, strokeWidth: 2 })] }));
|
|
22
|
-
}
|
|
23
|
-
return (jsxRuntime.jsx("th", { ...props, className: reactHelpers.classNames(className, {
|
|
24
|
-
'dc-table-cell': true,
|
|
25
|
-
'dc-table-cell_head': true,
|
|
26
|
-
'dc-table-cell_sortable': isSortable,
|
|
27
|
-
}), ref: ref, "aria-sort": isSortable ? sort : props['aria-sort'], children: children }));
|
|
28
|
-
});
|
|
29
|
-
|
|
30
|
-
exports.TableHeadCell = TableHeadCell;
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
6
|
-
|
|
7
|
-
const TableHead = react.forwardRef(function TableHead({ className, isTinted = false, ...props }, ref) {
|
|
8
|
-
return (jsxRuntime.jsx("thead", { ...props, ref: ref, className: reactHelpers.classNames(className, {
|
|
9
|
-
'dc-table-head': true,
|
|
10
|
-
'dc-table-head_tinted': isTinted,
|
|
11
|
-
}) }));
|
|
12
|
-
});
|
|
13
|
-
|
|
14
|
-
exports.TableHead = TableHead;
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
6
|
-
|
|
7
|
-
const TableRow = react.forwardRef(function TableRow({ isSelected, className, ...props }, ref) {
|
|
8
|
-
return (jsxRuntime.jsx("tr", { ...props, ref: ref, className: reactHelpers.classNames(className, {
|
|
9
|
-
'dc-table-row': true,
|
|
10
|
-
'dc-table-row_selected': isSelected,
|
|
11
|
-
}) }));
|
|
12
|
-
});
|
|
13
|
-
|
|
14
|
-
exports.TableRow = TableRow;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
6
|
-
|
|
7
|
-
const Table = react.forwardRef(function Table({ cellSize = 'md', isStriped = false, isBordered = false, highlightRowOnHover = false, className, children, ...props }, ref) {
|
|
8
|
-
return (jsxRuntime.jsx("table", { ...props, ref: ref, className: reactHelpers.classNames(className, 'dc-table', {
|
|
9
|
-
[`dc-table_cell_${cellSize}`]: cellSize,
|
|
10
|
-
'dc-table_striped': isStriped,
|
|
11
|
-
'dc-table_bordered': isBordered,
|
|
12
|
-
'dc-table_highlight_row': highlightRowOnHover,
|
|
13
|
-
}), children: children }));
|
|
14
|
-
});
|
|
15
|
-
|
|
16
|
-
exports.Table = Table;
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const keyboardKeys = require('../../lib/keyboard-keys.cjs');
|
|
6
|
-
const helpers = require('../../lib/helpers.cjs');
|
|
7
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
8
|
-
const tabsContext = require('./tabs-context.cjs');
|
|
9
|
-
|
|
10
|
-
function TabList({ className, children, onFocus, onBlur, onKeyDown, ...props }) {
|
|
11
|
-
const ref = react.useRef(null);
|
|
12
|
-
const { selectedTab, setTabListHasFocus } = tabsContext.useTabsContext();
|
|
13
|
-
function handleFocus(event) {
|
|
14
|
-
setTabListHasFocus(true);
|
|
15
|
-
onFocus?.(event);
|
|
16
|
-
}
|
|
17
|
-
function handleBlur(event) {
|
|
18
|
-
setTabListHasFocus(false);
|
|
19
|
-
onBlur?.(event);
|
|
20
|
-
}
|
|
21
|
-
function handleKeyDown(event) {
|
|
22
|
-
const tabList = ref.current;
|
|
23
|
-
helpers.assertIfNullable(tabList, 'ref.current is null or undefined');
|
|
24
|
-
let focusTabIndex = 0;
|
|
25
|
-
const tabs = tabList.querySelectorAll('[role="tab"]');
|
|
26
|
-
for (let index = 0; index < tabs.length; index += 1) {
|
|
27
|
-
const tab = tabs[index];
|
|
28
|
-
if (document.activeElement === tab) {
|
|
29
|
-
focusTabIndex = index;
|
|
30
|
-
break;
|
|
31
|
-
}
|
|
32
|
-
if (tab.name === selectedTab) {
|
|
33
|
-
focusTabIndex = index;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
let index = focusTabIndex;
|
|
37
|
-
if (event.key === keyboardKeys.KeyboardKeys.ArrowRight) {
|
|
38
|
-
index += 1;
|
|
39
|
-
}
|
|
40
|
-
else if (event.key === keyboardKeys.KeyboardKeys.ArrowLeft) {
|
|
41
|
-
index -= 1;
|
|
42
|
-
}
|
|
43
|
-
else if (event.key === keyboardKeys.KeyboardKeys.End) {
|
|
44
|
-
index = tabs.length - 1;
|
|
45
|
-
}
|
|
46
|
-
else if (event.key === keyboardKeys.KeyboardKeys.Home) {
|
|
47
|
-
index = 0;
|
|
48
|
-
}
|
|
49
|
-
if (index < 0) {
|
|
50
|
-
index = tabs.length - 1;
|
|
51
|
-
}
|
|
52
|
-
else if (index >= tabs.length) {
|
|
53
|
-
index = 0;
|
|
54
|
-
}
|
|
55
|
-
if (index !== focusTabIndex) {
|
|
56
|
-
event.preventDefault();
|
|
57
|
-
event.stopPropagation();
|
|
58
|
-
const newFocusTab = tabs[index];
|
|
59
|
-
helpers.assertIfNullable(newFocusTab, `Unable to get tab at index ${index}`);
|
|
60
|
-
reactHelpers.focusElement(newFocusTab);
|
|
61
|
-
}
|
|
62
|
-
onKeyDown?.(event);
|
|
63
|
-
}
|
|
64
|
-
return (jsxRuntime.jsx("div", { ...props, ref: ref, role: "tablist", className: reactHelpers.classNames('dc-tab-list', className), onFocus: handleFocus, onBlur: handleBlur, onKeyDown: handleKeyDown, children: children }));
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
exports.TabList = TabList;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
5
|
-
const tabsContext = require('./tabs-context.cjs');
|
|
6
|
-
|
|
7
|
-
function TabPanel({ tab, id, className, children, 'aria-labelledby': ariaLabelledBy, ...props }) {
|
|
8
|
-
const { selectedTab, getTabProps } = tabsContext.useTabsContext();
|
|
9
|
-
if (selectedTab !== tab) {
|
|
10
|
-
return null;
|
|
11
|
-
}
|
|
12
|
-
const tabProps = getTabProps(tab);
|
|
13
|
-
return (jsxRuntime.jsx("div", { ...props, className: reactHelpers.classNames('dc-tab-panel', className), role: "tabpanel", id: id || tabProps.ariaControls, "aria-labelledby": ariaLabelledBy || tabProps.id, children: children }));
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
exports.TabPanel = TabPanel;
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
5
|
-
const tabsContext = require('./tabs-context.cjs');
|
|
6
|
-
const badge = require('../badge/badge.cjs');
|
|
7
|
-
|
|
8
|
-
function Tab({ id, name, icon, counter, className, children, onClick, 'aria-controls': ariaControls, ...props }) {
|
|
9
|
-
const { getTabProps, selectedTab, setSelectedTab, tabListHasFocus, } = tabsContext.useTabsContext();
|
|
10
|
-
const tabProps = getTabProps(name);
|
|
11
|
-
const selected = name === selectedTab;
|
|
12
|
-
function handleClick(event) {
|
|
13
|
-
setSelectedTab(name);
|
|
14
|
-
onClick?.(event);
|
|
15
|
-
}
|
|
16
|
-
return (jsxRuntime.jsx("button", { ...props, className: reactHelpers.classNames('dc-tab', className), type: "button", role: "tab", name: name, id: id || tabProps.id, "aria-controls": ariaControls || tabProps.ariaControls, "aria-selected": selected, tabIndex: selected && !tabListHasFocus ? 0 : -1, onClick: handleClick, children: jsxRuntime.jsxs("span", { className: "dc-tab__layout", children: [icon != null && (jsxRuntime.jsx("span", { className: "dc-tab__icon", children: icon })), children != null && (jsxRuntime.jsxs("span", { className: "dc-tab__label", children: [children, " "] })), counter != null && counter !== 0 && (jsxRuntime.jsx(badge.Badge, { className: "dc-tab__counter", children: counter }))] }) }));
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
exports.Tab = Tab;
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
|
|
6
|
-
const TabsContext = react.createContext(null);
|
|
7
|
-
function TabsContextProvider({ children, selectedTab, setSelectedTab, }) {
|
|
8
|
-
const [tabListHasFocus, setTabListHasFocus] = react.useState(false);
|
|
9
|
-
const id = react.useId();
|
|
10
|
-
const getTabProps = react.useCallback((tab) => ({
|
|
11
|
-
id: `${id}-tab[${tab}]`,
|
|
12
|
-
ariaControls: `${id}-tabPanel[${tab}]`,
|
|
13
|
-
}), [id]);
|
|
14
|
-
return (jsxRuntime.jsx(TabsContext.Provider, { value: {
|
|
15
|
-
getTabProps,
|
|
16
|
-
selectedTab,
|
|
17
|
-
setSelectedTab,
|
|
18
|
-
tabListHasFocus,
|
|
19
|
-
setTabListHasFocus,
|
|
20
|
-
}, children: children }));
|
|
21
|
-
}
|
|
22
|
-
function useTabsContext() {
|
|
23
|
-
const context = react.useContext(TabsContext);
|
|
24
|
-
if (!context) {
|
|
25
|
-
throw new Error('useTabsContext must be used within TabsContextProvider');
|
|
26
|
-
}
|
|
27
|
-
return context;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
exports.TabsContextProvider = TabsContextProvider;
|
|
31
|
-
exports.useTabsContext = useTabsContext;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
5
|
-
const tabsContext = require('./tabs-context.cjs');
|
|
6
|
-
|
|
7
|
-
function Tabs({ className, children, selectedTab, onSelectTab, ...props }) {
|
|
8
|
-
return (jsxRuntime.jsx(tabsContext.TabsContextProvider, { selectedTab: selectedTab, setSelectedTab: onSelectTab, children: jsxRuntime.jsx("div", { ...props, className: reactHelpers.classNames('dc-tabs', className), children: children }) }));
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
exports.Tabs = Tabs;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
6
|
-
|
|
7
|
-
const Tag = react.forwardRef(function Tag({ isRounded = false, variant = 'tinted', fill = 'gray', size = 'md', className, children, ...props }, ref) {
|
|
8
|
-
return (jsxRuntime.jsx("strong", { ...props, ref: ref, className: reactHelpers.classNames(className, 'dc-tag', {
|
|
9
|
-
[`dc-tag_${variant}`]: variant,
|
|
10
|
-
[`dc-tag_${fill}`]: fill,
|
|
11
|
-
[`dc-tag_${size}`]: size,
|
|
12
|
-
'dc-tag_rounded': isRounded,
|
|
13
|
-
}), children: children }));
|
|
14
|
-
});
|
|
15
|
-
|
|
16
|
-
exports.Tag = Tag;
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
6
|
-
|
|
7
|
-
const TextInput = react.forwardRef(function TextInput({ hasError = false, isBlock = false, type = 'text', size = 'md', leftAddOn, rightAddOn, style, className, disabled, width, htmlSize, onChange, onChangeValue, ...props }, ref) {
|
|
8
|
-
if (leftAddOn) {
|
|
9
|
-
const className = 'dc-text-input__left-addon';
|
|
10
|
-
if (typeof leftAddOn === 'function') {
|
|
11
|
-
leftAddOn = leftAddOn({ className });
|
|
12
|
-
}
|
|
13
|
-
else {
|
|
14
|
-
leftAddOn = jsxRuntime.jsx("div", { className: className, children: leftAddOn });
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
if (rightAddOn) {
|
|
18
|
-
const className = 'dc-text-input__right-addon';
|
|
19
|
-
if (typeof rightAddOn === 'function') {
|
|
20
|
-
rightAddOn = rightAddOn({ className });
|
|
21
|
-
}
|
|
22
|
-
else {
|
|
23
|
-
rightAddOn = jsxRuntime.jsx("div", { className: className, children: rightAddOn });
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
return (jsxRuntime.jsxs("div", { style: style, className: reactHelpers.classNames(className, 'dc-text-input__container', {
|
|
27
|
-
[`dc-text-input__container_${size}`]: size,
|
|
28
|
-
'dc-text-input__container_block': isBlock,
|
|
29
|
-
'dc-text-input__container_disabled': disabled,
|
|
30
|
-
'dc-text-input__container_invalid': hasError,
|
|
31
|
-
'dc-text-input__container_left-addon': leftAddOn,
|
|
32
|
-
'dc-text-input__container_right-addon': rightAddOn,
|
|
33
|
-
}), children: [leftAddOn, jsxRuntime.jsx("input", { ...props, className: reactHelpers.classNames({
|
|
34
|
-
'dc-text-input': true,
|
|
35
|
-
[`dc-text-input_width_${width}`]: width,
|
|
36
|
-
}), ref: ref, type: type, size: htmlSize, disabled: disabled, onChange: (event) => {
|
|
37
|
-
onChange?.(event);
|
|
38
|
-
onChangeValue?.(event.target.value);
|
|
39
|
-
} }), rightAddOn] }));
|
|
40
|
-
});
|
|
41
|
-
|
|
42
|
-
exports.TextInput = TextInput;
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
6
|
-
const caption = require('../caption/caption.cjs');
|
|
7
|
-
|
|
8
|
-
const getCharactersCountMessage = ({ maxCharacters, characterCount, }) => {
|
|
9
|
-
const charsRemaining = maxCharacters - characterCount;
|
|
10
|
-
const characters = (jsxRuntime.jsx("span", { style: { fontVariant: 'tabular-nums' }, children: charsRemaining === 1
|
|
11
|
-
? `${charsRemaining} character`
|
|
12
|
-
: `${charsRemaining} characters` }));
|
|
13
|
-
return jsxRuntime.jsxs(jsxRuntime.Fragment, { children: ["You have ", characters, " remaining"] });
|
|
14
|
-
};
|
|
15
|
-
const Textarea = react.forwardRef(function Textarea({ disabled = false, hasError = false, isBlock = false, showCharacterCount = false, size = 'md', rows = 3, width, style, className, maxLength, onChange, onChangeValue, renderCharacterCount = getCharactersCountMessage, ...props }, ref) {
|
|
16
|
-
const shouldRenderCharacterCount = (showCharacterCount &&
|
|
17
|
-
maxLength != null && maxLength > 0);
|
|
18
|
-
const [characterCount, setCharacterCount] = react.useState(() => {
|
|
19
|
-
const value = props.value || props.defaultValue;
|
|
20
|
-
return typeof value === 'string' ? value.length : 0;
|
|
21
|
-
});
|
|
22
|
-
return (jsxRuntime.jsxs("div", { style: style, className: reactHelpers.classNames(className, 'dc-textarea__container', {
|
|
23
|
-
[`dc-textarea__container_size_${size}`]: size !== undefined,
|
|
24
|
-
'dc-textarea__container_disabled': disabled,
|
|
25
|
-
'dc-textarea__container_has_error': hasError,
|
|
26
|
-
'dc-textarea__container_block': isBlock,
|
|
27
|
-
}), children: [jsxRuntime.jsx("textarea", { ...props, ref: ref, className: reactHelpers.classNames('dc-textarea', {
|
|
28
|
-
[`dc-textarea_width_${width}`]: width !== undefined,
|
|
29
|
-
}), rows: rows, maxLength: maxLength, disabled: disabled, onChange: (event) => {
|
|
30
|
-
const value = event.target.value;
|
|
31
|
-
onChange?.(event);
|
|
32
|
-
onChangeValue?.(value);
|
|
33
|
-
setCharacterCount(value.length);
|
|
34
|
-
} }), shouldRenderCharacterCount && (jsxRuntime.jsx(caption.Caption, { "data-testid": "textarea-character-count", className: "dc-textarea__character-count", children: renderCharacterCount({
|
|
35
|
-
characterCount,
|
|
36
|
-
maxCharacters: maxLength,
|
|
37
|
-
}) }))] }));
|
|
38
|
-
});
|
|
39
|
-
|
|
40
|
-
exports.Textarea = Textarea;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
6
|
-
|
|
7
|
-
const ToastButton = react.forwardRef(function ToastButton({ className, ...props }, ref) {
|
|
8
|
-
return (jsxRuntime.jsx("button", { ...props, ref: ref, className: reactHelpers.classNames(className, 'dc-toast__btn') }));
|
|
9
|
-
});
|
|
10
|
-
|
|
11
|
-
exports.ToastButton = ToastButton;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
5
|
-
const xMarkIcon = require('./x-mark-icon.cjs');
|
|
6
|
-
|
|
7
|
-
function Toast({ icon, message, actions, closeButtonAriaLabel = 'close', onClickCloseButton, children, className, ...props }) {
|
|
8
|
-
return (jsxRuntime.jsxs("section", { ...props, className: reactHelpers.classNames('dc-toast', className), children: [jsxRuntime.jsx("button", { className: "dc-toast__close-btn", "aria-label": closeButtonAriaLabel, onClick: onClickCloseButton, children: jsxRuntime.jsx(xMarkIcon.XMarkIcon, { width: 16, height: 16 }) }), jsxRuntime.jsxs("div", { className: "dc-toast__body", children: [icon && jsxRuntime.jsx("div", { className: "dc-toast__icon", children: icon }), jsxRuntime.jsxs("div", { className: "dc-toast__content", children: [jsxRuntime.jsx("h1", { className: "dc-toast__title", children: children }), message && jsxRuntime.jsx("div", { className: "dc-toast__message", children: message })] })] }), actions && jsxRuntime.jsx("div", { className: "dc-toast__actions", children: actions })] }));
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
exports.Toast = Toast;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
|
|
5
|
-
function XMarkIcon(props) {
|
|
6
|
-
return (jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: 24, height: 24, fill: "none", strokeWidth: 1.5, stroke: "currentColor", ...props, children: jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) }));
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
exports.XMarkIcon = XMarkIcon;
|
|
@@ -1,115 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const helpers = require('../../lib/helpers.cjs');
|
|
6
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
7
|
-
const portal = require('../portal/portal.cjs');
|
|
8
|
-
const toast = require('../toast/toast.cjs');
|
|
9
|
-
const toastButton = require('../toast/toast-button.cjs');
|
|
10
|
-
|
|
11
|
-
const TOAST_SHOW_EVENT = 'toast_show';
|
|
12
|
-
const isToastShowEvent = (event) => (event instanceof CustomEvent && event.type === TOAST_SHOW_EVENT);
|
|
13
|
-
const TOAST_HIDE_EVENT = 'toast_hide';
|
|
14
|
-
const isToastHideEvent = (event) => (event instanceof CustomEvent && event.type === TOAST_HIDE_EVENT);
|
|
15
|
-
class Toaster {
|
|
16
|
-
constructor(params) {
|
|
17
|
-
this._id = 0;
|
|
18
|
-
this.timeoutMs = params?.timeoutMs || 10000;
|
|
19
|
-
this.onShow = params?.onShowToast;
|
|
20
|
-
this.onHide = params?.onHideToast;
|
|
21
|
-
}
|
|
22
|
-
_getNextId() {
|
|
23
|
-
this._id += 1;
|
|
24
|
-
return this._id;
|
|
25
|
-
}
|
|
26
|
-
showToast(toast) {
|
|
27
|
-
const id = this._getNextId();
|
|
28
|
-
const event = new CustomEvent(TOAST_SHOW_EVENT, {
|
|
29
|
-
detail: {
|
|
30
|
-
toaster: this,
|
|
31
|
-
toast: { ...toast, id },
|
|
32
|
-
},
|
|
33
|
-
});
|
|
34
|
-
const timeoutMs = toast.timeoutMs || this.timeoutMs;
|
|
35
|
-
this.onShow?.(event.detail.toast);
|
|
36
|
-
window.dispatchEvent(event);
|
|
37
|
-
window.setTimeout(() => this.hideToast(id), timeoutMs);
|
|
38
|
-
return id;
|
|
39
|
-
}
|
|
40
|
-
hideToast(id) {
|
|
41
|
-
const event = new CustomEvent(TOAST_HIDE_EVENT, {
|
|
42
|
-
detail: {
|
|
43
|
-
toaster: this,
|
|
44
|
-
toastId: id,
|
|
45
|
-
},
|
|
46
|
-
});
|
|
47
|
-
this.onHide?.(id);
|
|
48
|
-
window.dispatchEvent(event);
|
|
49
|
-
}
|
|
50
|
-
render(options) {
|
|
51
|
-
return (jsxRuntime.jsx(ToastsList, { toaster: this, toastGap: options?.toastGap, toastPosition: options?.toastPosition, toastCloseButtonAriaLabel: options?.toastCloseButtonAriaLabel }));
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
function ToastsList({ toaster, toastGap = 12, toastPosition = 'top-center', toastCloseButtonAriaLabel = 'Close', }) {
|
|
55
|
-
const ref = react.useRef(null);
|
|
56
|
-
const [toasts, setToasts] = react.useState([]);
|
|
57
|
-
react.useEffect(() => {
|
|
58
|
-
function handleShowToast(event) {
|
|
59
|
-
if (isToastShowEvent(event)) {
|
|
60
|
-
const detail = event.detail;
|
|
61
|
-
if (detail.toaster === toaster) {
|
|
62
|
-
setToasts((prevToasts) => [detail.toast, ...prevToasts]);
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
function handleCloseToast(event) {
|
|
67
|
-
if (isToastHideEvent(event)) {
|
|
68
|
-
const detail = event.detail;
|
|
69
|
-
if (detail.toaster === toaster) {
|
|
70
|
-
setToasts((prevToasts) => prevToasts.filter((toast) => toast.id !== detail.toastId));
|
|
71
|
-
}
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
window.addEventListener(TOAST_SHOW_EVENT, handleShowToast);
|
|
75
|
-
window.addEventListener(TOAST_HIDE_EVENT, handleCloseToast);
|
|
76
|
-
return () => {
|
|
77
|
-
window.removeEventListener(TOAST_SHOW_EVENT, handleShowToast);
|
|
78
|
-
window.removeEventListener(TOAST_HIDE_EVENT, handleCloseToast);
|
|
79
|
-
};
|
|
80
|
-
}, [toaster]);
|
|
81
|
-
react.useEffect(() => {
|
|
82
|
-
const listEl = ref.current;
|
|
83
|
-
helpers.assertIfNullable(listEl, 'ToastsList ref was not set');
|
|
84
|
-
let offset = 0;
|
|
85
|
-
for (const item of listEl.children) {
|
|
86
|
-
if (item instanceof HTMLLIElement) {
|
|
87
|
-
item.style.transform = `translateY(${offset}px)`;
|
|
88
|
-
const d = item.offsetHeight + toastGap;
|
|
89
|
-
if (toastPosition === 'top-right' ||
|
|
90
|
-
toastPosition === 'top-center' ||
|
|
91
|
-
toastPosition === 'top-left') {
|
|
92
|
-
offset += d;
|
|
93
|
-
}
|
|
94
|
-
else {
|
|
95
|
-
offset -= d;
|
|
96
|
-
}
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
}, [toasts, toastGap, toastPosition]);
|
|
100
|
-
return (jsxRuntime.jsx(portal.Portal, { children: jsxRuntime.jsx("ul", { ref: ref, className: reactHelpers.classNames({
|
|
101
|
-
'dc-toasts-list': true,
|
|
102
|
-
[`dc-toasts-list_${toastPosition}`]: toastPosition,
|
|
103
|
-
}), children: toasts.map((toast$1) => {
|
|
104
|
-
const hideToast = () => toaster.hideToast(toast$1.id);
|
|
105
|
-
const actions = toast$1.actions?.map((action, index) => (jsxRuntime.jsx(toastButton.ToastButton, { onClick: () => {
|
|
106
|
-
action.onClick?.();
|
|
107
|
-
if (action.shouldHideAfterClick ?? true) {
|
|
108
|
-
hideToast();
|
|
109
|
-
}
|
|
110
|
-
}, children: action.content }, index)));
|
|
111
|
-
return (jsxRuntime.jsx("li", { children: jsxRuntime.jsx(toast.Toast, { className: "dc-toasts-list__toast", role: "alert", icon: toast$1.icon, message: toast$1.message, actions: actions, closeButtonAriaLabel: toastCloseButtonAriaLabel, onClickCloseButton: hideToast, children: toast$1.title }) }, toast$1.id));
|
|
112
|
-
}) }) }));
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
exports.Toaster = Toaster;
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
const react = require('react');
|
|
5
|
-
const reactHelpers = require('../../lib/react-helpers.cjs');
|
|
6
|
-
const useMountTransition = require('../../hooks/use-mount-transition.cjs');
|
|
7
|
-
const positioner = require('../positioner/positioner.cjs');
|
|
8
|
-
|
|
9
|
-
function Tooltip({ anchorGap = 8, placement = 'top', alignment = 'center', style, className, htmlContent, content, children, ...props }) {
|
|
10
|
-
const [defaultShow, setDefaultShow] = react.useState(props.defaultIsShown ?? false);
|
|
11
|
-
const defaultId = react.useId();
|
|
12
|
-
const tooltipId = props.id || defaultId;
|
|
13
|
-
const isShown = props.isShown ?? defaultShow;
|
|
14
|
-
const durationMs = 100;
|
|
15
|
-
const { isMounted, className: transitionClass } = useMountTransition.useMountTransition({
|
|
16
|
-
isShown,
|
|
17
|
-
durationMs,
|
|
18
|
-
enterFrom: 'dc-tooltip_hidden',
|
|
19
|
-
enterTo: 'dc-tooltip_visible',
|
|
20
|
-
});
|
|
21
|
-
const { showTooltip, hideTooltip } = react.useMemo(() => ({
|
|
22
|
-
showTooltip: () => setDefaultShow(true),
|
|
23
|
-
hideTooltip: () => setDefaultShow(false),
|
|
24
|
-
}), []);
|
|
25
|
-
const renderAnchor = ({ setRef }) => {
|
|
26
|
-
if (typeof children === 'function') {
|
|
27
|
-
return children({
|
|
28
|
-
ref: setRef,
|
|
29
|
-
}, {
|
|
30
|
-
tooltipId,
|
|
31
|
-
showTooltip,
|
|
32
|
-
hideTooltip,
|
|
33
|
-
isShown: isShown || isMounted,
|
|
34
|
-
});
|
|
35
|
-
}
|
|
36
|
-
if (reactHelpers.isReactElementWithRef(children)) {
|
|
37
|
-
const props = children.props;
|
|
38
|
-
return react.cloneElement(children, {
|
|
39
|
-
'ref': reactHelpers.mergeRefs(setRef, children.ref),
|
|
40
|
-
'onFocus': (event) => {
|
|
41
|
-
showTooltip();
|
|
42
|
-
props.onFocus?.(event);
|
|
43
|
-
},
|
|
44
|
-
'onBlur': (event) => {
|
|
45
|
-
hideTooltip();
|
|
46
|
-
props.onBlur?.(event);
|
|
47
|
-
},
|
|
48
|
-
'onMouseEnter': (event) => {
|
|
49
|
-
showTooltip();
|
|
50
|
-
props.onMouseEnter?.(event);
|
|
51
|
-
},
|
|
52
|
-
'onMouseLeave': (event) => {
|
|
53
|
-
hideTooltip();
|
|
54
|
-
props.onMouseLeave?.(event);
|
|
55
|
-
},
|
|
56
|
-
'aria-describedby': props['aria-describedby'] || tooltipId,
|
|
57
|
-
});
|
|
58
|
-
}
|
|
59
|
-
return children;
|
|
60
|
-
};
|
|
61
|
-
const renderContent = ({ setRef: portalRef, style: portalStyle, }) => {
|
|
62
|
-
if (isShown || isMounted) {
|
|
63
|
-
delete props.defaultIsShown;
|
|
64
|
-
delete props.isShown;
|
|
65
|
-
return (jsxRuntime.jsx("div", { ...props, ref: portalRef, id: tooltipId, style: {
|
|
66
|
-
'--dc-tooltip-transition-duration': `${durationMs}ms`,
|
|
67
|
-
...portalStyle,
|
|
68
|
-
...style,
|
|
69
|
-
}, className: reactHelpers.classNames('dc-tooltip', transitionClass, className), content: htmlContent, role: "tooltip", children: content }));
|
|
70
|
-
}
|
|
71
|
-
};
|
|
72
|
-
return (jsxRuntime.jsx(positioner.Positioner, { placement: placement, alignment: alignment, anchorGap: anchorGap, renderAnchor: renderAnchor, renderContent: renderContent }));
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
exports.Tooltip = Tooltip;
|
package/cjs/hooks/index.cjs
DELETED
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const useDisableBodyScroll = require('./use-disable-body-scroll.cjs');
|
|
4
|
-
const useEscKeyDown = require('./use-esc-key-down.cjs');
|
|
5
|
-
const useFocusTrap = require('./use-focus-trap.cjs');
|
|
6
|
-
const useMountTransition = require('./use-mount-transition.cjs');
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
exports.useDisableBodyScroll = useDisableBodyScroll.useDisableBodyScroll;
|
|
11
|
-
exports.useEscKeyDown = useEscKeyDown.useEscKeyDown;
|
|
12
|
-
exports.useFocusTrap = useFocusTrap.useFocusTrap;
|
|
13
|
-
exports.useMountTransition = useMountTransition.useMountTransition;
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const react = require('react');
|
|
4
|
-
const helpers = require('../lib/helpers.cjs');
|
|
5
|
-
|
|
6
|
-
function useDisableBodyScroll(options = {
|
|
7
|
-
isEnabled: true,
|
|
8
|
-
}) {
|
|
9
|
-
react.useEffect(() => {
|
|
10
|
-
if (options.isEnabled) {
|
|
11
|
-
return disableBodyScroll();
|
|
12
|
-
}
|
|
13
|
-
}, [options.isEnabled]);
|
|
14
|
-
}
|
|
15
|
-
let disableAttempts = 0;
|
|
16
|
-
let initialOverflow = '';
|
|
17
|
-
let initialPaddingRight = '';
|
|
18
|
-
function disableBodyScroll() {
|
|
19
|
-
if (!disableAttempts) {
|
|
20
|
-
const bodyStyle = window.getComputedStyle(document.body);
|
|
21
|
-
const scrollbarWidth = (window.innerWidth - document.documentElement.clientWidth);
|
|
22
|
-
initialOverflow = bodyStyle.overflow;
|
|
23
|
-
initialPaddingRight = bodyStyle.paddingRight;
|
|
24
|
-
document.body.style.overflow = 'hidden';
|
|
25
|
-
document.body.style.paddingRight = `${parseInt(initialPaddingRight, 10) + scrollbarWidth}px`;
|
|
26
|
-
}
|
|
27
|
-
disableAttempts += 1;
|
|
28
|
-
return helpers.once(function enableBodyScroll() {
|
|
29
|
-
disableAttempts -= 1;
|
|
30
|
-
if (!disableAttempts) {
|
|
31
|
-
document.body.style.overflow = initialOverflow;
|
|
32
|
-
document.body.style.paddingRight = initialPaddingRight;
|
|
33
|
-
}
|
|
34
|
-
});
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
exports.useDisableBodyScroll = useDisableBodyScroll;
|