@cloudscape-design/components-themeable 3.0.1137 → 3.0.1139
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/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/internal/generated/custom-css-properties/index.scss +127 -99
- package/lib/internal/scss/progress-bar/styles.scss +39 -25
- package/lib/internal/scss/prompt-input/styles.scss +75 -13
- package/lib/internal/scss/radio-group/analytics-metadata/styles.scss +8 -0
- package/lib/internal/template/alert/actions-wrapper/index.js +3 -3
- package/lib/internal/template/alert/actions-wrapper/index.js.map +1 -1
- package/lib/internal/template/alert/index.js +2 -4
- package/lib/internal/template/alert/index.js.map +1 -1
- package/lib/internal/template/alert/internal.js +8 -10
- package/lib/internal/template/alert/internal.js.map +1 -1
- package/lib/internal/template/alert/style.js +12 -5
- package/lib/internal/template/alert/style.js.map +1 -1
- package/lib/internal/template/alert/styles.css.js +27 -27
- package/lib/internal/template/alert/styles.scoped.css +50 -50
- package/lib/internal/template/alert/styles.selectors.js +27 -27
- package/lib/internal/template/anchor-navigation/anchor-item/index.js +1 -1
- package/lib/internal/template/anchor-navigation/anchor-item/index.js.map +1 -1
- package/lib/internal/template/anchor-navigation/index.js +2 -4
- package/lib/internal/template/anchor-navigation/index.js.map +1 -1
- package/lib/internal/template/anchor-navigation/internal.js +2 -4
- package/lib/internal/template/anchor-navigation/internal.js.map +1 -1
- package/lib/internal/template/annotation-context/annotation/styles.css.js +24 -24
- package/lib/internal/template/annotation-context/annotation/styles.scoped.css +32 -32
- package/lib/internal/template/annotation-context/annotation/styles.selectors.js +24 -24
- package/lib/internal/template/annotation-context/index.js +3 -4
- package/lib/internal/template/annotation-context/index.js.map +1 -1
- package/lib/internal/template/app-layout/classic.js +20 -17
- package/lib/internal/template/app-layout/classic.js.map +1 -1
- package/lib/internal/template/app-layout/defaults.js +8 -3
- package/lib/internal/template/app-layout/defaults.js.map +1 -1
- package/lib/internal/template/app-layout/drawer/resizable-drawer.js +8 -10
- package/lib/internal/template/app-layout/drawer/resizable-drawer.js.map +1 -1
- package/lib/internal/template/app-layout/index.js +24 -21
- package/lib/internal/template/app-layout/index.js.map +1 -1
- package/lib/internal/template/app-layout/internal.js +3 -3
- package/lib/internal/template/app-layout/internal.js.map +1 -1
- package/lib/internal/template/app-layout/notifications/index.js +3 -5
- package/lib/internal/template/app-layout/notifications/index.js.map +1 -1
- package/lib/internal/template/app-layout/notifications/styles.css.js +3 -3
- package/lib/internal/template/app-layout/notifications/styles.scoped.css +7 -7
- package/lib/internal/template/app-layout/notifications/styles.selectors.js +3 -3
- package/lib/internal/template/app-layout/runtime-drawer/index.js +36 -18
- package/lib/internal/template/app-layout/runtime-drawer/index.js.map +1 -1
- package/lib/internal/template/app-layout/split-panel/provider.js +2 -4
- package/lib/internal/template/app-layout/split-panel/provider.js.map +1 -1
- package/lib/internal/template/app-layout/utils/use-app-layout-placement.js +1 -1
- package/lib/internal/template/app-layout/utils/use-app-layout-placement.js.map +1 -1
- package/lib/internal/template/app-layout/utils/use-drawers.js +9 -3
- package/lib/internal/template/app-layout/utils/use-drawers.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh/context.js +28 -11
- package/lib/internal/template/app-layout/visual-refresh/context.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh/drawers.js +3 -1
- package/lib/internal/template/app-layout/visual-refresh/drawers.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh/index.js +1 -1
- package/lib/internal/template/app-layout/visual-refresh/index.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh/layout.js +9 -1
- package/lib/internal/template/app-layout/visual-refresh/layout.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh/main.js +4 -1
- package/lib/internal/template/app-layout/visual-refresh/main.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh/split-panel.js +1 -1
- package/lib/internal/template/app-layout/visual-refresh/split-panel.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh/styles.css.js +86 -86
- package/lib/internal/template/app-layout/visual-refresh/styles.scoped.css +258 -258
- package/lib/internal/template/app-layout/visual-refresh/styles.selectors.js +86 -86
- package/lib/internal/template/app-layout/visual-refresh/trigger-button.js +6 -3
- package/lib/internal/template/app-layout/visual-refresh/trigger-button.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/compute-layout.js +5 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/compute-layout.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-ai-drawer.js +8 -4
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-ai-drawer.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-bottom-drawer.js +9 -6
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-bottom-drawer.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-drawer.js +7 -3
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/global-drawer.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/local-drawer.js +8 -4
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/local-drawer.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.css.js +30 -30
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +87 -87
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +30 -30
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.css.js +4 -4
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.scoped.css +7 -7
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.selectors.js +4 -4
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/index.js +10 -10
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/index.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slots.js +5 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slots.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.css.js +27 -27
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css +54 -54
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.selectors.js +27 -27
- package/lib/internal/template/app-layout/visual-refresh-toolbar/split-panel/index.js +2 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/split-panel/index.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/state/props-merger.js +7 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/state/props-merger.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-ai-drawer.js +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-ai-drawer.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-app-layout.js +19 -12
- package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-app-layout.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-bottom-drawers.js +5 -2
- package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-bottom-drawers.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-skeleton-slots-attributes.js +10 -6
- package/lib/internal/template/app-layout/visual-refresh-toolbar/state/use-skeleton-slots-attributes.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.js +4 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.js +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.js.map +1 -1
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.js +8 -8
- package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/trigger-button/index.js.map +1 -1
- package/lib/internal/template/app-layout-toolbar/index.js +24 -21
- package/lib/internal/template/app-layout-toolbar/index.js.map +1 -1
- package/lib/internal/template/area-chart/chart-container.js +1 -1
- package/lib/internal/template/area-chart/chart-container.js.map +1 -1
- package/lib/internal/template/area-chart/elements/chart-popover.js +1 -1
- package/lib/internal/template/area-chart/elements/chart-popover.js.map +1 -1
- package/lib/internal/template/area-chart/elements/threshold-series.js +1 -1
- package/lib/internal/template/area-chart/elements/threshold-series.js.map +1 -1
- package/lib/internal/template/area-chart/index.js +2 -4
- package/lib/internal/template/area-chart/index.js.map +1 -1
- package/lib/internal/template/area-chart/internal.js +2 -4
- package/lib/internal/template/area-chart/internal.js.map +1 -1
- package/lib/internal/template/area-chart/model/interactions-store.js +39 -9
- package/lib/internal/template/area-chart/model/interactions-store.js.map +1 -1
- package/lib/internal/template/attribute-editor/index.d.ts.map +1 -1
- package/lib/internal/template/attribute-editor/index.js +4 -6
- package/lib/internal/template/attribute-editor/index.js.map +1 -1
- package/lib/internal/template/attribute-editor/interfaces.d.ts +8 -0
- package/lib/internal/template/attribute-editor/interfaces.d.ts.map +1 -1
- package/lib/internal/template/attribute-editor/interfaces.js.map +1 -1
- package/lib/internal/template/attribute-editor/internal.d.ts.map +1 -1
- package/lib/internal/template/attribute-editor/internal.js +14 -10
- package/lib/internal/template/attribute-editor/internal.js.map +1 -1
- package/lib/internal/template/attribute-editor/row.js +1 -1
- package/lib/internal/template/attribute-editor/row.js.map +1 -1
- package/lib/internal/template/attribute-editor/styles.css.js +15 -15
- package/lib/internal/template/attribute-editor/styles.scoped.css +28 -28
- package/lib/internal/template/attribute-editor/styles.selectors.js +15 -15
- package/lib/internal/template/autosuggest/autosuggest-option.js +3 -5
- package/lib/internal/template/autosuggest/autosuggest-option.js.map +1 -1
- package/lib/internal/template/autosuggest/index.js +2 -4
- package/lib/internal/template/autosuggest/index.js.map +1 -1
- package/lib/internal/template/autosuggest/internal.js +10 -5
- package/lib/internal/template/autosuggest/internal.js.map +1 -1
- package/lib/internal/template/autosuggest/options-controller.js +15 -8
- package/lib/internal/template/autosuggest/options-controller.js.map +1 -1
- package/lib/internal/template/autosuggest/plain-list.js +3 -3
- package/lib/internal/template/autosuggest/plain-list.js.map +1 -1
- package/lib/internal/template/autosuggest/virtual-list.js +2 -2
- package/lib/internal/template/autosuggest/virtual-list.js.map +1 -1
- package/lib/internal/template/badge/index.js +2 -4
- package/lib/internal/template/badge/index.js.map +1 -1
- package/lib/internal/template/bar-chart/index.js +2 -4
- package/lib/internal/template/bar-chart/index.js.map +1 -1
- package/lib/internal/template/box/index.js +2 -4
- package/lib/internal/template/box/index.js.map +1 -1
- package/lib/internal/template/box/internal.js +2 -4
- package/lib/internal/template/box/internal.js.map +1 -1
- package/lib/internal/template/breadcrumb-group/all-items-dropdown.js +3 -3
- package/lib/internal/template/breadcrumb-group/all-items-dropdown.js.map +1 -1
- package/lib/internal/template/breadcrumb-group/implementation.js +9 -8
- package/lib/internal/template/breadcrumb-group/implementation.js.map +1 -1
- package/lib/internal/template/breadcrumb-group/index.js +3 -5
- package/lib/internal/template/breadcrumb-group/index.js.map +1 -1
- package/lib/internal/template/breadcrumb-group/item/funnel.js +1 -1
- package/lib/internal/template/breadcrumb-group/item/funnel.js.map +1 -1
- package/lib/internal/template/breadcrumb-group/item/item.js +5 -7
- package/lib/internal/template/breadcrumb-group/item/item.js.map +1 -1
- package/lib/internal/template/breadcrumb-group/item/styles.css.js +7 -7
- package/lib/internal/template/breadcrumb-group/item/styles.scoped.css +28 -28
- package/lib/internal/template/breadcrumb-group/item/styles.selectors.js +7 -7
- package/lib/internal/template/button/icon-helper.js +3 -5
- package/lib/internal/template/button/icon-helper.js.map +1 -1
- package/lib/internal/template/button/index.js +2 -4
- package/lib/internal/template/button/index.js.map +1 -1
- package/lib/internal/template/button/internal.js +31 -14
- package/lib/internal/template/button/internal.js.map +1 -1
- package/lib/internal/template/button/style.js +38 -27
- package/lib/internal/template/button/style.js.map +1 -1
- package/lib/internal/template/button/styles.css.js +22 -22
- package/lib/internal/template/button/styles.scoped.css +256 -256
- package/lib/internal/template/button/styles.selectors.js +22 -22
- package/lib/internal/template/button-dropdown/category-elements/expandable-category-element.js +11 -11
- package/lib/internal/template/button-dropdown/category-elements/expandable-category-element.js.map +1 -1
- package/lib/internal/template/button-dropdown/category-elements/mobile-expandable-category-element.js +12 -12
- package/lib/internal/template/button-dropdown/category-elements/mobile-expandable-category-element.js.map +1 -1
- package/lib/internal/template/button-dropdown/index.js +4 -6
- package/lib/internal/template/button-dropdown/index.js.map +1 -1
- package/lib/internal/template/button-dropdown/internal.js +36 -25
- package/lib/internal/template/button-dropdown/internal.js.map +1 -1
- package/lib/internal/template/button-dropdown/item-element/index.js +25 -17
- package/lib/internal/template/button-dropdown/item-element/index.js.map +1 -1
- package/lib/internal/template/button-dropdown/item-element/styles.css.js +16 -16
- package/lib/internal/template/button-dropdown/item-element/styles.scoped.css +27 -27
- package/lib/internal/template/button-dropdown/item-element/styles.selectors.js +16 -16
- package/lib/internal/template/button-dropdown/tooltip.js +1 -1
- package/lib/internal/template/button-dropdown/tooltip.js.map +1 -1
- package/lib/internal/template/button-dropdown/utils/use-button-dropdown.js +1 -2
- package/lib/internal/template/button-dropdown/utils/use-button-dropdown.js.map +1 -1
- package/lib/internal/template/button-group/index.js +2 -4
- package/lib/internal/template/button-group/index.js.map +1 -1
- package/lib/internal/template/button-group/internal.js +2 -4
- package/lib/internal/template/button-group/internal.js.map +1 -1
- package/lib/internal/template/button-group/item-element.js +4 -4
- package/lib/internal/template/button-group/item-element.js.map +1 -1
- package/lib/internal/template/button-group/menu-dropdown-item.js +1 -1
- package/lib/internal/template/button-group/menu-dropdown-item.js.map +1 -1
- package/lib/internal/template/button-group/style.js +34 -20
- package/lib/internal/template/button-group/style.js.map +1 -1
- package/lib/internal/template/calendar/grid/index.js +2 -3
- package/lib/internal/template/calendar/grid/index.js.map +1 -1
- package/lib/internal/template/calendar/index.js +2 -4
- package/lib/internal/template/calendar/index.js.map +1 -1
- package/lib/internal/template/calendar/internal.js +2 -4
- package/lib/internal/template/calendar/internal.js.map +1 -1
- package/lib/internal/template/cards/index.js +17 -19
- package/lib/internal/template/cards/index.js.map +1 -1
- package/lib/internal/template/checkbox/index.js +2 -4
- package/lib/internal/template/checkbox/index.js.map +1 -1
- package/lib/internal/template/checkbox/internal.js +4 -6
- package/lib/internal/template/checkbox/internal.js.map +1 -1
- package/lib/internal/template/checkbox/styles.css.js +3 -3
- package/lib/internal/template/checkbox/styles.scoped.css +11 -11
- package/lib/internal/template/checkbox/styles.selectors.js +3 -3
- package/lib/internal/template/code-editor/index.js +2 -3
- package/lib/internal/template/code-editor/index.js.map +1 -1
- package/lib/internal/template/code-editor/use-editor.js +4 -1
- package/lib/internal/template/code-editor/use-editor.js.map +1 -1
- package/lib/internal/template/code-editor/util.js +4 -1
- package/lib/internal/template/code-editor/util.js.map +1 -1
- package/lib/internal/template/collection-preferences/content-display/index.js +1 -1
- package/lib/internal/template/collection-preferences/content-display/index.js.map +1 -1
- package/lib/internal/template/collection-preferences/content-display/utils.js +1 -1
- package/lib/internal/template/collection-preferences/content-display/utils.js.map +1 -1
- package/lib/internal/template/collection-preferences/index.js +20 -13
- package/lib/internal/template/collection-preferences/index.js.map +1 -1
- package/lib/internal/template/collection-preferences/utils.js +9 -9
- package/lib/internal/template/collection-preferences/utils.js.map +1 -1
- package/lib/internal/template/collection-preferences/visible-content.js +8 -8
- package/lib/internal/template/collection-preferences/visible-content.js.map +1 -1
- package/lib/internal/template/column-layout/index.js +2 -4
- package/lib/internal/template/column-layout/index.js.map +1 -1
- package/lib/internal/template/column-layout/internal.js +2 -4
- package/lib/internal/template/column-layout/internal.js.map +1 -1
- package/lib/internal/template/container/index.js +2 -4
- package/lib/internal/template/container/index.js.map +1 -1
- package/lib/internal/template/container/internal.js +11 -9
- package/lib/internal/template/container/internal.js.map +1 -1
- package/lib/internal/template/container/style.js +11 -2
- package/lib/internal/template/container/style.js.map +1 -1
- package/lib/internal/template/content-layout/index.js +1 -1
- package/lib/internal/template/content-layout/index.js.map +1 -1
- package/lib/internal/template/content-layout/internal.js +3 -5
- package/lib/internal/template/content-layout/internal.js.map +1 -1
- package/lib/internal/template/content-layout/styles.css.js +14 -14
- package/lib/internal/template/content-layout/styles.scoped.css +27 -27
- package/lib/internal/template/content-layout/styles.selectors.js +14 -14
- package/lib/internal/template/copy-to-clipboard/index.js +2 -4
- package/lib/internal/template/copy-to-clipboard/index.js.map +1 -1
- package/lib/internal/template/copy-to-clipboard/internal.js +2 -4
- package/lib/internal/template/copy-to-clipboard/internal.js.map +1 -1
- package/lib/internal/template/date-input/index.js +1 -1
- package/lib/internal/template/date-input/index.js.map +1 -1
- package/lib/internal/template/date-input/internal.js +6 -8
- package/lib/internal/template/date-input/internal.js.map +1 -1
- package/lib/internal/template/date-picker/index.js +9 -6
- package/lib/internal/template/date-picker/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/grid-cell.js +3 -4
- package/lib/internal/template/date-range-picker/calendar/grids/grid-cell.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/grid.js +8 -8
- package/lib/internal/template/date-range-picker/calendar/grids/grid.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/index.js +2 -2
- package/lib/internal/template/date-range-picker/calendar/grids/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/index.js +5 -2
- package/lib/internal/template/date-range-picker/calendar/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/index.js +8 -6
- package/lib/internal/template/date-range-picker/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/utils.js +8 -2
- package/lib/internal/template/date-range-picker/utils.js.map +1 -1
- package/lib/internal/template/drawer/implementation.js +7 -6
- package/lib/internal/template/drawer/implementation.js.map +1 -1
- package/lib/internal/template/drawer/index.js +1 -1
- package/lib/internal/template/drawer/index.js.map +1 -1
- package/lib/internal/template/expandable-section/expandable-section-container.js +3 -5
- package/lib/internal/template/expandable-section/expandable-section-container.js.map +1 -1
- package/lib/internal/template/expandable-section/expandable-section-header.js +8 -8
- package/lib/internal/template/expandable-section/expandable-section-header.js.map +1 -1
- package/lib/internal/template/expandable-section/index.js +2 -4
- package/lib/internal/template/expandable-section/index.js.map +1 -1
- package/lib/internal/template/expandable-section/internal.js +2 -4
- package/lib/internal/template/expandable-section/internal.js.map +1 -1
- package/lib/internal/template/file-dropzone/index.js +1 -1
- package/lib/internal/template/file-dropzone/index.js.map +1 -1
- package/lib/internal/template/file-dropzone/internal.js +3 -5
- package/lib/internal/template/file-dropzone/internal.js.map +1 -1
- package/lib/internal/template/file-input/index.js +2 -4
- package/lib/internal/template/file-input/index.js.map +1 -1
- package/lib/internal/template/file-input/internal.js +11 -8
- package/lib/internal/template/file-input/internal.js.map +1 -1
- package/lib/internal/template/file-token-group/default-formatters.js +3 -3
- package/lib/internal/template/file-token-group/default-formatters.js.map +1 -1
- package/lib/internal/template/file-token-group/index.js +2 -4
- package/lib/internal/template/file-token-group/index.js.map +1 -1
- package/lib/internal/template/file-token-group/internal.js +2 -4
- package/lib/internal/template/file-token-group/internal.js.map +1 -1
- package/lib/internal/template/file-upload/index.js +2 -4
- package/lib/internal/template/file-upload/index.js.map +1 -1
- package/lib/internal/template/file-upload/internal.js +5 -7
- package/lib/internal/template/file-upload/internal.js.map +1 -1
- package/lib/internal/template/flashbar/collapsible-flashbar.js +33 -23
- package/lib/internal/template/flashbar/collapsible-flashbar.js.map +1 -1
- package/lib/internal/template/flashbar/common.js +1 -3
- package/lib/internal/template/flashbar/common.js.map +1 -1
- package/lib/internal/template/flashbar/flash.js +4 -6
- package/lib/internal/template/flashbar/flash.js.map +1 -1
- package/lib/internal/template/flashbar/implementation.js +2 -2
- package/lib/internal/template/flashbar/implementation.js.map +1 -1
- package/lib/internal/template/flashbar/index.js +1 -1
- package/lib/internal/template/flashbar/index.js.map +1 -1
- package/lib/internal/template/flashbar/non-collapsible-flashbar.js +10 -9
- package/lib/internal/template/flashbar/non-collapsible-flashbar.js.map +1 -1
- package/lib/internal/template/flashbar/style.js +50 -32
- package/lib/internal/template/flashbar/style.js.map +1 -1
- package/lib/internal/template/flashbar/styles.css.js +50 -50
- package/lib/internal/template/flashbar/styles.scoped.css +187 -187
- package/lib/internal/template/flashbar/styles.selectors.js +50 -50
- package/lib/internal/template/flashbar/utils.js +2 -2
- package/lib/internal/template/flashbar/utils.js.map +1 -1
- package/lib/internal/template/form/index.js +4 -7
- package/lib/internal/template/form/index.js.map +1 -1
- package/lib/internal/template/form/internal.js +2 -4
- package/lib/internal/template/form/internal.js.map +1 -1
- package/lib/internal/template/form-field/index.js +7 -9
- package/lib/internal/template/form-field/index.js.map +1 -1
- package/lib/internal/template/form-field/internal.js +6 -5
- package/lib/internal/template/form-field/internal.js.map +1 -1
- package/lib/internal/template/grid/index.js +2 -4
- package/lib/internal/template/grid/index.js.map +1 -1
- package/lib/internal/template/grid/internal.js +2 -4
- package/lib/internal/template/grid/internal.js.map +1 -1
- package/lib/internal/template/header/analytics/use-table-integration.d.ts +2 -1
- package/lib/internal/template/header/analytics/use-table-integration.d.ts.map +1 -1
- package/lib/internal/template/header/analytics/use-table-integration.js +8 -1
- package/lib/internal/template/header/analytics/use-table-integration.js.map +1 -1
- package/lib/internal/template/header/index.js +2 -4
- package/lib/internal/template/header/index.js.map +1 -1
- package/lib/internal/template/header/interfaces.d.ts +2 -2
- package/lib/internal/template/header/interfaces.d.ts.map +1 -1
- package/lib/internal/template/header/interfaces.js.map +1 -1
- package/lib/internal/template/header/internal.js +4 -6
- package/lib/internal/template/header/internal.js.map +1 -1
- package/lib/internal/template/help-panel/implementation.js +7 -6
- package/lib/internal/template/help-panel/implementation.js.map +1 -1
- package/lib/internal/template/help-panel/index.js +1 -1
- package/lib/internal/template/help-panel/index.js.map +1 -1
- package/lib/internal/template/help-panel/styles.css.js +6 -6
- package/lib/internal/template/help-panel/styles.scoped.css +73 -73
- package/lib/internal/template/help-panel/styles.selectors.js +6 -6
- package/lib/internal/template/hotspot/index.js +3 -5
- package/lib/internal/template/hotspot/index.js.map +1 -1
- package/lib/internal/template/icon/index.js +2 -4
- package/lib/internal/template/icon/index.js.map +1 -1
- package/lib/internal/template/icon/internal.js +4 -6
- package/lib/internal/template/icon/internal.js.map +1 -1
- package/lib/internal/template/icon-provider/index.js +1 -1
- package/lib/internal/template/icon-provider/index.js.map +1 -1
- package/lib/internal/template/icon-provider/internal.js +2 -2
- package/lib/internal/template/icon-provider/internal.js.map +1 -1
- package/lib/internal/template/input/index.js +5 -5
- package/lib/internal/template/input/index.js.map +1 -1
- package/lib/internal/template/input/internal.js +10 -12
- package/lib/internal/template/input/internal.js.map +1 -1
- package/lib/internal/template/input/styles.css.js +13 -13
- package/lib/internal/template/input/styles.js +42 -30
- package/lib/internal/template/input/styles.js.map +1 -1
- package/lib/internal/template/input/styles.scoped.css +65 -65
- package/lib/internal/template/input/styles.selectors.js +13 -13
- package/lib/internal/template/internal/analytics/components/analytics-funnel.js +9 -12
- package/lib/internal/template/internal/analytics/components/analytics-funnel.js.map +1 -1
- package/lib/internal/template/internal/analytics/hooks/use-funnel.js +5 -6
- package/lib/internal/template/internal/analytics/hooks/use-funnel.js.map +1 -1
- package/lib/internal/template/internal/animate.js +1 -1
- package/lib/internal/template/internal/animate.js.map +1 -1
- package/lib/internal/template/internal/base-component/index.js +1 -1
- package/lib/internal/template/internal/base-component/index.js.map +1 -1
- package/lib/internal/template/internal/base-component/styles.scoped.css +1 -1
- package/lib/internal/template/internal/components/abstract-switch/index.js +21 -20
- package/lib/internal/template/internal/components/abstract-switch/index.js.map +1 -1
- package/lib/internal/template/internal/components/autosuggest-input/index.js +3 -5
- package/lib/internal/template/internal/components/autosuggest-input/index.js.map +1 -1
- package/lib/internal/template/internal/components/button-trigger/index.js +25 -6
- package/lib/internal/template/internal/components/button-trigger/index.js.map +1 -1
- package/lib/internal/template/internal/components/cartesian-chart/inline-start-labels.js +1 -1
- package/lib/internal/template/internal/components/cartesian-chart/inline-start-labels.js.map +1 -1
- package/lib/internal/template/internal/components/chart-filter/index.js +2 -4
- package/lib/internal/template/internal/components/chart-filter/index.js.map +1 -1
- package/lib/internal/template/internal/components/chart-plot/index.js +2 -2
- package/lib/internal/template/internal/components/chart-plot/index.js.map +1 -1
- package/lib/internal/template/internal/components/chart-popover/index.js +3 -5
- package/lib/internal/template/internal/components/chart-popover/index.js.map +1 -1
- package/lib/internal/template/internal/components/chart-series-details/index.js +2 -4
- package/lib/internal/template/internal/components/chart-series-details/index.js.map +1 -1
- package/lib/internal/template/internal/components/chart-wrapper/index.js +3 -5
- package/lib/internal/template/internal/components/chart-wrapper/index.js.map +1 -1
- package/lib/internal/template/internal/components/checkbox-icon/index.js +5 -7
- package/lib/internal/template/internal/components/checkbox-icon/index.js.map +1 -1
- package/lib/internal/template/internal/components/drag-handle/button.js +5 -5
- package/lib/internal/template/internal/components/drag-handle/button.js.map +1 -1
- package/lib/internal/template/internal/components/drag-handle/hooks/use-drag-handle-interaction-state.js +17 -4
- package/lib/internal/template/internal/components/drag-handle/hooks/use-drag-handle-interaction-state.js.map +1 -1
- package/lib/internal/template/internal/components/drag-handle/index.js +1 -3
- package/lib/internal/template/internal/components/drag-handle/index.js.map +1 -1
- package/lib/internal/template/internal/components/drag-handle-wrapper/styles.css.js +20 -20
- package/lib/internal/template/internal/components/drag-handle-wrapper/styles.scoped.css +48 -48
- package/lib/internal/template/internal/components/drag-handle-wrapper/styles.selectors.js +20 -20
- package/lib/internal/template/internal/components/dropdown/styles.css.js +20 -20
- package/lib/internal/template/internal/components/dropdown/styles.scoped.css +38 -38
- package/lib/internal/template/internal/components/dropdown/styles.selectors.js +20 -20
- package/lib/internal/template/internal/components/masked-input/index.js +12 -8
- package/lib/internal/template/internal/components/masked-input/index.js.map +1 -1
- package/lib/internal/template/internal/components/masked-input/utils/mask-format.js +6 -1
- package/lib/internal/template/internal/components/masked-input/utils/mask-format.js.map +1 -1
- package/lib/internal/template/internal/components/menu-dropdown/index.js +2 -4
- package/lib/internal/template/internal/components/menu-dropdown/index.js.map +1 -1
- package/lib/internal/template/internal/components/option/index.js +6 -8
- package/lib/internal/template/internal/components/option/index.js.map +1 -1
- package/lib/internal/template/internal/components/option/option-parts.js +1 -1
- package/lib/internal/template/internal/components/option/option-parts.js.map +1 -1
- package/lib/internal/template/internal/components/option/utils/flatten-options.js +1 -2
- package/lib/internal/template/internal/components/option/utils/flatten-options.js.map +1 -1
- package/lib/internal/template/internal/components/options-list/index.js +2 -4
- package/lib/internal/template/internal/components/options-list/index.js.map +1 -1
- package/lib/internal/template/internal/components/screenreader-only/index.js +1 -1
- package/lib/internal/template/internal/components/screenreader-only/index.js.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/analytics-metadata/utils.js +1 -3
- package/lib/internal/template/internal/components/selectable-item/analytics-metadata/utils.js.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/index.js +5 -7
- package/lib/internal/template/internal/components/selectable-item/index.js.map +1 -1
- package/lib/internal/template/internal/components/sortable-area/index.js +19 -6
- package/lib/internal/template/internal/components/sortable-area/index.js.map +1 -1
- package/lib/internal/template/internal/components/token-list/styles.css.js +10 -10
- package/lib/internal/template/internal/components/token-list/styles.scoped.css +25 -25
- package/lib/internal/template/internal/components/token-list/styles.selectors.js +10 -10
- package/lib/internal/template/internal/components/token-list/token-limit-toggle.js +1 -1
- package/lib/internal/template/internal/components/token-list/token-limit-toggle.js.map +1 -1
- package/lib/internal/template/internal/components/tooltip/index.js +1 -1
- package/lib/internal/template/internal/components/tooltip/index.js.map +1 -1
- package/lib/internal/template/internal/components/transition/index.js +3 -5
- package/lib/internal/template/internal/components/transition/index.js.map +1 -1
- package/lib/internal/template/internal/environment.js +2 -2
- package/lib/internal/template/internal/environment.json +2 -2
- package/lib/internal/template/internal/generated/custom-css-properties/index.d.ts +28 -0
- package/lib/internal/template/internal/generated/custom-css-properties/index.d.ts.map +1 -1
- package/lib/internal/template/internal/generated/custom-css-properties/index.js +126 -98
- package/lib/internal/template/internal/generated/custom-css-properties/index.js.map +1 -1
- package/lib/internal/template/internal/generated/styles/tokens.d.ts +50 -75
- package/lib/internal/template/internal/generated/styles/tokens.js +50 -75
- package/lib/internal/template/internal/generated/theming/index.cjs +305 -461
- package/lib/internal/template/internal/generated/theming/index.js +305 -461
- package/lib/internal/template/internal/hooks/use-intersection-observer/index.js +1 -1
- package/lib/internal/template/internal/hooks/use-intersection-observer/index.js.map +1 -1
- package/lib/internal/template/internal/hooks/use-performance-marks/index.js +12 -2
- package/lib/internal/template/internal/hooks/use-performance-marks/index.js.map +1 -1
- package/lib/internal/template/internal/hooks/use-virtual/index.js +5 -2
- package/lib/internal/template/internal/hooks/use-virtual/index.js.map +1 -1
- package/lib/internal/template/internal/plugins/controllers/drawers.js +4 -6
- package/lib/internal/template/internal/plugins/controllers/drawers.js.map +1 -1
- package/lib/internal/template/internal/plugins/helpers/use-global-breadcrumbs.js +4 -6
- package/lib/internal/template/internal/plugins/helpers/use-global-breadcrumbs.js.map +1 -1
- package/lib/internal/template/internal/plugins/widget/index.js +1 -1
- package/lib/internal/template/internal/plugins/widget/index.js.map +1 -1
- package/lib/internal/template/internal/utils/with-native-attributes.js +4 -6
- package/lib/internal/template/internal/utils/with-native-attributes.js.map +1 -1
- package/lib/internal/template/internal/widgets/index.js +2 -2
- package/lib/internal/template/internal/widgets/index.js.map +1 -1
- package/lib/internal/template/internal/widgets/loader-mock.js +2 -2
- package/lib/internal/template/internal/widgets/loader-mock.js.map +1 -1
- package/lib/internal/template/key-value-pairs/index.js +2 -4
- package/lib/internal/template/key-value-pairs/index.js.map +1 -1
- package/lib/internal/template/key-value-pairs/internal.js +4 -6
- package/lib/internal/template/key-value-pairs/internal.js.map +1 -1
- package/lib/internal/template/line-chart/index.js +2 -4
- package/lib/internal/template/line-chart/index.js.map +1 -1
- package/lib/internal/template/link/index.js +2 -4
- package/lib/internal/template/link/index.js.map +1 -1
- package/lib/internal/template/link/internal.js +13 -6
- package/lib/internal/template/link/internal.js.map +1 -1
- package/lib/internal/template/link/style.js +12 -9
- package/lib/internal/template/link/style.js.map +1 -1
- package/lib/internal/template/link/styles.css.js +20 -20
- package/lib/internal/template/link/styles.scoped.css +103 -103
- package/lib/internal/template/link/styles.selectors.js +20 -20
- package/lib/internal/template/list/index.js +1 -1
- package/lib/internal/template/list/index.js.map +1 -1
- package/lib/internal/template/list/internal.js +6 -8
- package/lib/internal/template/list/internal.js.map +1 -1
- package/lib/internal/template/live-region/index.js +2 -4
- package/lib/internal/template/live-region/index.js.map +1 -1
- package/lib/internal/template/live-region/internal.js +2 -4
- package/lib/internal/template/live-region/internal.js.map +1 -1
- package/lib/internal/template/mixed-line-bar-chart/bar-series.js +3 -3
- package/lib/internal/template/mixed-line-bar-chart/bar-series.js.map +1 -1
- package/lib/internal/template/mixed-line-bar-chart/chart-container.js +7 -9
- package/lib/internal/template/mixed-line-bar-chart/chart-container.js.map +1 -1
- package/lib/internal/template/mixed-line-bar-chart/chart-popover.js +4 -1
- package/lib/internal/template/mixed-line-bar-chart/chart-popover.js.map +1 -1
- package/lib/internal/template/mixed-line-bar-chart/hooks/use-navigation.js +1 -1
- package/lib/internal/template/mixed-line-bar-chart/hooks/use-navigation.js.map +1 -1
- package/lib/internal/template/mixed-line-bar-chart/index.js +2 -4
- package/lib/internal/template/mixed-line-bar-chart/index.js.map +1 -1
- package/lib/internal/template/mixed-line-bar-chart/internal.js +2 -4
- package/lib/internal/template/mixed-line-bar-chart/internal.js.map +1 -1
- package/lib/internal/template/mixed-line-bar-chart/line-series.js +3 -3
- package/lib/internal/template/mixed-line-bar-chart/line-series.js.map +1 -1
- package/lib/internal/template/modal/index.js +5 -8
- package/lib/internal/template/modal/index.js.map +1 -1
- package/lib/internal/template/modal/internal.js +11 -14
- package/lib/internal/template/modal/internal.js.map +1 -1
- package/lib/internal/template/multiselect/embedded.js +15 -6
- package/lib/internal/template/multiselect/embedded.js.map +1 -1
- package/lib/internal/template/multiselect/index.js +2 -4
- package/lib/internal/template/multiselect/index.js.map +1 -1
- package/lib/internal/template/multiselect/internal.js +13 -12
- package/lib/internal/template/multiselect/internal.js.map +1 -1
- package/lib/internal/template/multiselect/use-multiselect.js +9 -5
- package/lib/internal/template/multiselect/use-multiselect.js.map +1 -1
- package/lib/internal/template/navigable-group/index.js +2 -4
- package/lib/internal/template/navigable-group/index.js.map +1 -1
- package/lib/internal/template/navigable-group/internal.js +2 -4
- package/lib/internal/template/navigable-group/internal.js.map +1 -1
- package/lib/internal/template/pagination/index.js +10 -10
- package/lib/internal/template/pagination/index.js.map +1 -1
- package/lib/internal/template/pagination/internal.js +36 -40
- package/lib/internal/template/pagination/internal.js.map +1 -1
- package/lib/internal/template/pie-chart/index.js +4 -6
- package/lib/internal/template/pie-chart/index.js.map +1 -1
- package/lib/internal/template/pie-chart/labels.js +2 -2
- package/lib/internal/template/pie-chart/labels.js.map +1 -1
- package/lib/internal/template/pie-chart/segments.js +1 -1
- package/lib/internal/template/pie-chart/segments.js.map +1 -1
- package/lib/internal/template/pie-chart/utils.js +17 -5
- package/lib/internal/template/pie-chart/utils.js.map +1 -1
- package/lib/internal/template/popover/body.js +3 -3
- package/lib/internal/template/popover/body.js.map +1 -1
- package/lib/internal/template/popover/container.js +1 -1
- package/lib/internal/template/popover/container.js.map +1 -1
- package/lib/internal/template/popover/index.js +2 -4
- package/lib/internal/template/popover/index.js.map +1 -1
- package/lib/internal/template/popover/internal.js +4 -6
- package/lib/internal/template/popover/internal.js.map +1 -1
- package/lib/internal/template/progress-bar/index.d.ts +1 -1
- package/lib/internal/template/progress-bar/index.d.ts.map +1 -1
- package/lib/internal/template/progress-bar/index.js +3 -5
- package/lib/internal/template/progress-bar/index.js.map +1 -1
- package/lib/internal/template/progress-bar/interfaces.d.ts +19 -0
- package/lib/internal/template/progress-bar/interfaces.d.ts.map +1 -1
- package/lib/internal/template/progress-bar/interfaces.js.map +1 -1
- package/lib/internal/template/progress-bar/internal.d.ts +2 -1
- package/lib/internal/template/progress-bar/internal.d.ts.map +1 -1
- package/lib/internal/template/progress-bar/internal.js +10 -3
- package/lib/internal/template/progress-bar/internal.js.map +1 -1
- package/lib/internal/template/progress-bar/styles.css.js +19 -19
- package/lib/internal/template/progress-bar/styles.d.ts +16 -0
- package/lib/internal/template/progress-bar/styles.d.ts.map +1 -0
- package/lib/internal/template/progress-bar/styles.js +33 -0
- package/lib/internal/template/progress-bar/styles.js.map +1 -0
- package/lib/internal/template/progress-bar/styles.scoped.css +56 -56
- package/lib/internal/template/progress-bar/styles.selectors.js +19 -19
- package/lib/internal/template/prompt-input/index.js +2 -4
- package/lib/internal/template/prompt-input/index.js.map +1 -1
- package/lib/internal/template/prompt-input/interfaces.d.ts +48 -0
- package/lib/internal/template/prompt-input/interfaces.d.ts.map +1 -1
- package/lib/internal/template/prompt-input/interfaces.js.map +1 -1
- package/lib/internal/template/prompt-input/internal.d.ts.map +1 -1
- package/lib/internal/template/prompt-input/internal.js +5 -6
- package/lib/internal/template/prompt-input/internal.js.map +1 -1
- package/lib/internal/template/prompt-input/styles.css.js +17 -17
- package/lib/internal/template/prompt-input/styles.d.ts +5 -0
- package/lib/internal/template/prompt-input/styles.d.ts.map +1 -0
- package/lib/internal/template/prompt-input/styles.js +44 -0
- package/lib/internal/template/prompt-input/styles.js.map +1 -0
- package/lib/internal/template/prompt-input/styles.scoped.css +73 -61
- package/lib/internal/template/prompt-input/styles.selectors.js +17 -17
- package/lib/internal/template/property-filter/controller.js +6 -6
- package/lib/internal/template/property-filter/controller.js.map +1 -1
- package/lib/internal/template/property-filter/filter-options.js +1 -1
- package/lib/internal/template/property-filter/filter-options.js.map +1 -1
- package/lib/internal/template/property-filter/filtering-token/index.js +11 -14
- package/lib/internal/template/property-filter/filtering-token/index.js.map +1 -1
- package/lib/internal/template/property-filter/i18n-utils.js +48 -11
- package/lib/internal/template/property-filter/i18n-utils.js.map +1 -1
- package/lib/internal/template/property-filter/index.js +4 -6
- package/lib/internal/template/property-filter/index.js.map +1 -1
- package/lib/internal/template/property-filter/internal.js +15 -13
- package/lib/internal/template/property-filter/internal.js.map +1 -1
- package/lib/internal/template/property-filter/property-editor.js +1 -1
- package/lib/internal/template/property-filter/property-editor.js.map +1 -1
- package/lib/internal/template/property-filter/property-filter-autosuggest.js +8 -4
- package/lib/internal/template/property-filter/property-filter-autosuggest.js.map +1 -1
- package/lib/internal/template/property-filter/token-editor-inputs.js +10 -9
- package/lib/internal/template/property-filter/token-editor-inputs.js.map +1 -1
- package/lib/internal/template/property-filter/token-editor.js +10 -10
- package/lib/internal/template/property-filter/token-editor.js.map +1 -1
- package/lib/internal/template/property-filter/token.js +8 -8
- package/lib/internal/template/property-filter/token.js.map +1 -1
- package/lib/internal/template/property-filter/use-load-items.js +6 -1
- package/lib/internal/template/property-filter/use-load-items.js.map +1 -1
- package/lib/internal/template/radio-group/analytics-metadata/interfaces.d.ts +1 -0
- package/lib/internal/template/radio-group/analytics-metadata/interfaces.d.ts.map +1 -1
- package/lib/internal/template/radio-group/analytics-metadata/interfaces.js.map +1 -1
- package/lib/internal/template/radio-group/analytics-metadata/styles.css.js +6 -0
- package/lib/internal/template/radio-group/analytics-metadata/styles.scoped.css +7 -0
- package/lib/internal/template/radio-group/analytics-metadata/styles.selectors.js +7 -0
- package/lib/internal/template/radio-group/index.d.ts.map +1 -1
- package/lib/internal/template/radio-group/index.js +10 -8
- package/lib/internal/template/radio-group/index.js.map +1 -1
- package/lib/internal/template/radio-group/internal.d.ts.map +1 -1
- package/lib/internal/template/radio-group/internal.js +11 -12
- package/lib/internal/template/radio-group/internal.js.map +1 -1
- package/lib/internal/template/radio-group/radio-button.js +4 -6
- package/lib/internal/template/radio-group/radio-button.js.map +1 -1
- package/lib/internal/template/radio-group/styles.css.js +10 -10
- package/lib/internal/template/radio-group/styles.scoped.css +22 -22
- package/lib/internal/template/radio-group/styles.selectors.js +10 -10
- package/lib/internal/template/s3-resource-selector/index.js +3 -5
- package/lib/internal/template/s3-resource-selector/index.js.map +1 -1
- package/lib/internal/template/s3-resource-selector/s3-in-context/index.js +1 -1
- package/lib/internal/template/s3-resource-selector/s3-in-context/index.js.map +1 -1
- package/lib/internal/template/s3-resource-selector/s3-in-context/search-input.js +1 -1
- package/lib/internal/template/s3-resource-selector/s3-in-context/search-input.js.map +1 -1
- package/lib/internal/template/s3-resource-selector/s3-modal/basic-table.js +4 -7
- package/lib/internal/template/s3-resource-selector/s3-modal/basic-table.js.map +1 -1
- package/lib/internal/template/s3-resource-selector/s3-modal/buckets-table.js +13 -1
- package/lib/internal/template/s3-resource-selector/s3-modal/buckets-table.js.map +1 -1
- package/lib/internal/template/s3-resource-selector/s3-modal/index.js +4 -1
- package/lib/internal/template/s3-resource-selector/s3-modal/index.js.map +1 -1
- package/lib/internal/template/s3-resource-selector/s3-modal/objects-table.js +14 -2
- package/lib/internal/template/s3-resource-selector/s3-modal/objects-table.js.map +1 -1
- package/lib/internal/template/s3-resource-selector/s3-modal/versions-table.js +13 -1
- package/lib/internal/template/s3-resource-selector/s3-modal/versions-table.js.map +1 -1
- package/lib/internal/template/segmented-control/index.js +1 -1
- package/lib/internal/template/segmented-control/index.js.map +1 -1
- package/lib/internal/template/segmented-control/internal.js +6 -8
- package/lib/internal/template/segmented-control/internal.js.map +1 -1
- package/lib/internal/template/segmented-control/segment.js +1 -1
- package/lib/internal/template/segmented-control/segment.js.map +1 -1
- package/lib/internal/template/select/index.js +2 -4
- package/lib/internal/template/select/index.js.map +1 -1
- package/lib/internal/template/select/internal.js +13 -10
- package/lib/internal/template/select/internal.js.map +1 -1
- package/lib/internal/template/select/parts/filter.js +9 -4
- package/lib/internal/template/select/parts/filter.js.map +1 -1
- package/lib/internal/template/select/parts/item.js +3 -5
- package/lib/internal/template/select/parts/item.js.map +1 -1
- package/lib/internal/template/select/parts/multiselect-item.js +3 -5
- package/lib/internal/template/select/parts/multiselect-item.js.map +1 -1
- package/lib/internal/template/select/parts/plain-list.js +1 -1
- package/lib/internal/template/select/parts/plain-list.js.map +1 -1
- package/lib/internal/template/select/parts/trigger.js +2 -2
- package/lib/internal/template/select/parts/trigger.js.map +1 -1
- package/lib/internal/template/select/parts/virtual-list.js +3 -3
- package/lib/internal/template/select/parts/virtual-list.js.map +1 -1
- package/lib/internal/template/select/utils/get-item-props.js +7 -1
- package/lib/internal/template/select/utils/get-item-props.js.map +1 -1
- package/lib/internal/template/select/utils/render-options.js +1 -1
- package/lib/internal/template/select/utils/render-options.js.map +1 -1
- package/lib/internal/template/side-navigation/implementation.js +2 -4
- package/lib/internal/template/side-navigation/implementation.js.map +1 -1
- package/lib/internal/template/side-navigation/index.js +2 -4
- package/lib/internal/template/side-navigation/index.js.map +1 -1
- package/lib/internal/template/side-navigation/parts.js +4 -4
- package/lib/internal/template/side-navigation/parts.js.map +1 -1
- package/lib/internal/template/slider/index.js +2 -4
- package/lib/internal/template/slider/index.js.map +1 -1
- package/lib/internal/template/slider/internal.js +2 -4
- package/lib/internal/template/slider/internal.js.map +1 -1
- package/lib/internal/template/slider/styles.css.js +26 -26
- package/lib/internal/template/slider/styles.scoped.css +86 -86
- package/lib/internal/template/slider/styles.selectors.js +26 -26
- package/lib/internal/template/slider/tick-marks.js +3 -3
- package/lib/internal/template/slider/tick-marks.js.map +1 -1
- package/lib/internal/template/space-between/index.js +2 -4
- package/lib/internal/template/space-between/index.js.map +1 -1
- package/lib/internal/template/space-between/internal.js +2 -4
- package/lib/internal/template/space-between/internal.js.map +1 -1
- package/lib/internal/template/spinner/index.js +2 -4
- package/lib/internal/template/spinner/index.js.map +1 -1
- package/lib/internal/template/spinner/internal.js +2 -4
- package/lib/internal/template/spinner/internal.js.map +1 -1
- package/lib/internal/template/spinner/styles.css.js +13 -13
- package/lib/internal/template/spinner/styles.scoped.css +39 -39
- package/lib/internal/template/spinner/styles.selectors.js +13 -13
- package/lib/internal/template/split-panel/bottom.js +2 -2
- package/lib/internal/template/split-panel/bottom.js.map +1 -1
- package/lib/internal/template/split-panel/implementation.js +2 -4
- package/lib/internal/template/split-panel/implementation.js.map +1 -1
- package/lib/internal/template/split-panel/index.js +16 -4
- package/lib/internal/template/split-panel/index.js.map +1 -1
- package/lib/internal/template/split-panel/side.js +6 -2
- package/lib/internal/template/split-panel/side.js.map +1 -1
- package/lib/internal/template/status-indicator/index.js +2 -4
- package/lib/internal/template/status-indicator/index.js.map +1 -1
- package/lib/internal/template/status-indicator/internal.js +3 -5
- package/lib/internal/template/status-indicator/internal.js.map +1 -1
- package/lib/internal/template/steps/index.js +2 -4
- package/lib/internal/template/steps/index.js.map +1 -1
- package/lib/internal/template/steps/internal.js +2 -4
- package/lib/internal/template/steps/internal.js.map +1 -1
- package/lib/internal/template/table/body-cell/disabled-inline-editor.js +4 -6
- package/lib/internal/template/table/body-cell/disabled-inline-editor.js.map +1 -1
- package/lib/internal/template/table/body-cell/index.js +9 -11
- package/lib/internal/template/table/body-cell/index.js.map +1 -1
- package/lib/internal/template/table/body-cell/inline-editor.js +18 -21
- package/lib/internal/template/table/body-cell/inline-editor.js.map +1 -1
- package/lib/internal/template/table/body-cell/td-element.js +3 -5
- package/lib/internal/template/table/body-cell/td-element.js.map +1 -1
- package/lib/internal/template/table/expandable-rows/expandable-rows-utils.js +1 -1
- package/lib/internal/template/table/expandable-rows/expandable-rows-utils.js.map +1 -1
- package/lib/internal/template/table/header-cell/index.js +20 -20
- package/lib/internal/template/table/header-cell/index.js.map +1 -1
- package/lib/internal/template/table/header-cell/th-element.js +3 -5
- package/lib/internal/template/table/header-cell/th-element.js.map +1 -1
- package/lib/internal/template/table/index.js +14 -10
- package/lib/internal/template/table/index.js.map +1 -1
- package/lib/internal/template/table/internal.js +47 -34
- package/lib/internal/template/table/internal.js.map +1 -1
- package/lib/internal/template/table/progressive-loading/loader-cell.js +2 -4
- package/lib/internal/template/table/progressive-loading/loader-cell.js.map +1 -1
- package/lib/internal/template/table/selection/selection-cell.js +8 -11
- package/lib/internal/template/table/selection/selection-cell.js.map +1 -1
- package/lib/internal/template/table/selection/selection-control.js +10 -12
- package/lib/internal/template/table/selection/selection-control.js.map +1 -1
- package/lib/internal/template/table/sticky-columns/use-sticky-columns.js +1 -1
- package/lib/internal/template/table/sticky-columns/use-sticky-columns.js.map +1 -1
- package/lib/internal/template/table/sticky-header.js +2 -2
- package/lib/internal/template/table/sticky-header.js.map +1 -1
- package/lib/internal/template/table/thead.js +5 -5
- package/lib/internal/template/table/thead.js.map +1 -1
- package/lib/internal/template/table/use-cell-editing.js +3 -4
- package/lib/internal/template/table/use-cell-editing.js.map +1 -1
- package/lib/internal/template/table/utils.js +1 -1
- package/lib/internal/template/table/utils.js.map +1 -1
- package/lib/internal/template/tabs/index.js +6 -8
- package/lib/internal/template/tabs/index.js.map +1 -1
- package/lib/internal/template/tabs/tab-header-bar.js +12 -5
- package/lib/internal/template/tabs/tab-header-bar.js.map +1 -1
- package/lib/internal/template/tag-editor/index.js +7 -9
- package/lib/internal/template/tag-editor/index.js.map +1 -1
- package/lib/internal/template/tag-editor/styles.css.js +3 -3
- package/lib/internal/template/tag-editor/styles.scoped.css +13 -13
- package/lib/internal/template/tag-editor/styles.selectors.js +3 -3
- package/lib/internal/template/text-content/index.js +2 -4
- package/lib/internal/template/text-content/index.js.map +1 -1
- package/lib/internal/template/text-content/styles.css.js +1 -1
- package/lib/internal/template/text-content/styles.scoped.css +66 -66
- package/lib/internal/template/text-content/styles.selectors.js +1 -1
- package/lib/internal/template/text-filter/index.js +1 -1
- package/lib/internal/template/text-filter/index.js.map +1 -1
- package/lib/internal/template/text-filter/internal.js +2 -4
- package/lib/internal/template/text-filter/internal.js.map +1 -1
- package/lib/internal/template/textarea/index.js +3 -5
- package/lib/internal/template/textarea/index.js.map +1 -1
- package/lib/internal/template/textarea/styles.css.js +5 -5
- package/lib/internal/template/textarea/styles.js +42 -30
- package/lib/internal/template/textarea/styles.js.map +1 -1
- package/lib/internal/template/textarea/styles.scoped.css +41 -41
- package/lib/internal/template/textarea/styles.selectors.js +5 -5
- package/lib/internal/template/tiles/index.js +3 -3
- package/lib/internal/template/tiles/index.js.map +1 -1
- package/lib/internal/template/tiles/internal.js +12 -14
- package/lib/internal/template/tiles/internal.js.map +1 -1
- package/lib/internal/template/tiles/tile.js +3 -5
- package/lib/internal/template/tiles/tile.js.map +1 -1
- package/lib/internal/template/time-input/index.js +2 -4
- package/lib/internal/template/time-input/index.js.map +1 -1
- package/lib/internal/template/time-input/internal.js +2 -4
- package/lib/internal/template/time-input/internal.js.map +1 -1
- package/lib/internal/template/toggle/index.js +1 -1
- package/lib/internal/template/toggle/index.js.map +1 -1
- package/lib/internal/template/toggle/internal.js +5 -7
- package/lib/internal/template/toggle/internal.js.map +1 -1
- package/lib/internal/template/toggle/styles.css.js +10 -10
- package/lib/internal/template/toggle/styles.scoped.css +23 -23
- package/lib/internal/template/toggle/styles.selectors.js +10 -10
- package/lib/internal/template/toggle-button/index.js +2 -4
- package/lib/internal/template/toggle-button/index.js.map +1 -1
- package/lib/internal/template/toggle-button/internal.js +3 -5
- package/lib/internal/template/toggle-button/internal.js.map +1 -1
- package/lib/internal/template/token/dismiss-button.js +2 -2
- package/lib/internal/template/token/dismiss-button.js.map +1 -1
- package/lib/internal/template/token/index.js +1 -1
- package/lib/internal/template/token/index.js.map +1 -1
- package/lib/internal/template/token/internal.js +20 -14
- package/lib/internal/template/token/internal.js.map +1 -1
- package/lib/internal/template/token-group/index.js +2 -4
- package/lib/internal/template/token-group/index.js.map +1 -1
- package/lib/internal/template/token-group/internal.js +6 -8
- package/lib/internal/template/token-group/internal.js.map +1 -1
- package/lib/internal/template/top-navigation/index.js +2 -4
- package/lib/internal/template/top-navigation/index.js.map +1 -1
- package/lib/internal/template/top-navigation/internal.js +2 -4
- package/lib/internal/template/top-navigation/internal.js.map +1 -1
- package/lib/internal/template/top-navigation/parts/overflow-menu/menu-item.js +7 -11
- package/lib/internal/template/top-navigation/parts/overflow-menu/menu-item.js.map +1 -1
- package/lib/internal/template/top-navigation/parts/overflow-menu/views/submenu.js +2 -2
- package/lib/internal/template/top-navigation/parts/overflow-menu/views/submenu.js.map +1 -1
- package/lib/internal/template/top-navigation/parts/overflow-menu/views/utilities.js +1 -1
- package/lib/internal/template/top-navigation/parts/overflow-menu/views/utilities.js.map +1 -1
- package/lib/internal/template/top-navigation/parts/utility.js +1 -1
- package/lib/internal/template/top-navigation/parts/utility.js.map +1 -1
- package/lib/internal/template/tree-view/index.js +1 -1
- package/lib/internal/template/tree-view/index.js.map +1 -1
- package/lib/internal/template/tree-view/internal.js +2 -4
- package/lib/internal/template/tree-view/internal.js.map +1 -1
- package/lib/internal/template/tutorial-panel/components/tutorial-detail-view/task-list.js +1 -1
- package/lib/internal/template/tutorial-panel/components/tutorial-detail-view/task-list.js.map +1 -1
- package/lib/internal/template/tutorial-panel/index.js +2 -4
- package/lib/internal/template/tutorial-panel/index.js.map +1 -1
- package/lib/internal/template/wizard/index.js +2 -4
- package/lib/internal/template/wizard/index.js.map +1 -1
- package/lib/internal/template/wizard/internal.js +23 -10
- package/lib/internal/template/wizard/internal.js.map +1 -1
- package/lib/internal/template/wizard/wizard-actions.js +3 -3
- package/lib/internal/template/wizard/wizard-actions.js.map +1 -1
- package/lib/internal/template/wizard/wizard-form.js +2 -2
- package/lib/internal/template/wizard/wizard-form.js.map +1 -1
- package/lib/internal/template/wizard/wizard-navigation.js +7 -7
- package/lib/internal/template/wizard/wizard-navigation.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { __rest } from "tslib";
|
|
2
1
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
3
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
4
3
|
import React from 'react';
|
|
@@ -17,42 +16,39 @@ const defaultAriaLabels = {
|
|
|
17
16
|
previousPageLabel: '',
|
|
18
17
|
pageLabel: pageNumber => `${pageNumber}`,
|
|
19
18
|
};
|
|
20
|
-
function PageButton(
|
|
21
|
-
var { className, ariaLabel, disabled, pageIndex, isCurrent = false, children, onClick } = _a, rest = __rest(_a, ["className", "ariaLabel", "disabled", "pageIndex", "isCurrent", "children", "onClick"]);
|
|
19
|
+
function PageButton({ className, ariaLabel, disabled, pageIndex, isCurrent = false, children, onClick, ...rest }) {
|
|
22
20
|
function handleClick(event) {
|
|
23
21
|
event.preventDefault();
|
|
24
22
|
onClick(pageIndex);
|
|
25
23
|
}
|
|
26
|
-
return (React.createElement("li",
|
|
27
|
-
React.createElement("button",
|
|
24
|
+
return (React.createElement("li", { className: styles['page-item'], ...copyAnalyticsMetadataAttribute(rest) },
|
|
25
|
+
React.createElement("button", { className: clsx(className, styles.button, disabled && styles['button-disabled'], isCurrent && styles['button-current']), type: "button", "aria-label": ariaLabel, disabled: disabled, onClick: handleClick, "aria-current": isCurrent, ...(disabled
|
|
26
|
+
? {}
|
|
27
|
+
: getAnalyticsMetadataAttribute({
|
|
28
|
+
action: 'click',
|
|
29
|
+
detail: {
|
|
30
|
+
label: { root: 'self' },
|
|
31
|
+
},
|
|
32
|
+
})) }, children)));
|
|
33
|
+
}
|
|
34
|
+
function PageNumber({ pageIndex, ...rest }) {
|
|
35
|
+
return (React.createElement(PageButton, { className: styles['page-number'], pageIndex: pageIndex, ...rest, ...(rest.disabled
|
|
28
36
|
? {}
|
|
29
37
|
: getAnalyticsMetadataAttribute({
|
|
30
|
-
action: 'click',
|
|
31
38
|
detail: {
|
|
32
|
-
|
|
39
|
+
position: `${pageIndex}`,
|
|
33
40
|
},
|
|
34
|
-
}))
|
|
35
|
-
}
|
|
36
|
-
function PageNumber(_a) {
|
|
37
|
-
var { pageIndex } = _a, rest = __rest(_a, ["pageIndex"]);
|
|
38
|
-
return (React.createElement(PageButton, Object.assign({ className: styles['page-number'], pageIndex: pageIndex }, rest, (rest.disabled
|
|
39
|
-
? {}
|
|
40
|
-
: getAnalyticsMetadataAttribute({
|
|
41
|
-
detail: {
|
|
42
|
-
position: `${pageIndex}`,
|
|
43
|
-
},
|
|
44
|
-
}))), pageIndex));
|
|
41
|
+
})) }, pageIndex));
|
|
45
42
|
}
|
|
46
|
-
export default function InternalPagination(
|
|
47
|
-
var _b, _c, _d
|
|
48
|
-
var { openEnd, currentPageIndex, ariaLabels, pagesCount, disabled, onChange, onNextPageClick, onPreviousPageClick, __internalRootRef } = _a, rest = __rest(_a, ["openEnd", "currentPageIndex", "ariaLabels", "pagesCount", "disabled", "onChange", "onNextPageClick", "onPreviousPageClick", "__internalRootRef"]);
|
|
43
|
+
export default function InternalPagination({ openEnd, currentPageIndex, ariaLabels, pagesCount, disabled, onChange, onNextPageClick, onPreviousPageClick, __internalRootRef, ...rest }) {
|
|
44
|
+
var _a, _b, _c, _d;
|
|
49
45
|
const baseProps = getBaseProps(rest);
|
|
50
46
|
const { leftDots, leftIndex, rightIndex, rightDots } = getPaginationState(currentPageIndex, pagesCount, openEnd);
|
|
51
47
|
const i18n = useInternalI18n('pagination');
|
|
52
48
|
const paginationLabel = ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.paginationLabel;
|
|
53
|
-
const nextPageLabel = (
|
|
54
|
-
const previousPageLabel = (
|
|
55
|
-
const pageNumberLabelFn = (
|
|
49
|
+
const nextPageLabel = (_a = i18n('ariaLabels.nextPageLabel', ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.nextPageLabel)) !== null && _a !== void 0 ? _a : defaultAriaLabels.nextPageLabel;
|
|
50
|
+
const previousPageLabel = (_b = i18n('ariaLabels.previousPageLabel', ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.previousPageLabel)) !== null && _b !== void 0 ? _b : defaultAriaLabels.previousPageLabel;
|
|
51
|
+
const pageNumberLabelFn = (_c = i18n('ariaLabels.pageLabel', ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.pageLabel, format => pageNumber => format({ pageNumber }))) !== null && _c !== void 0 ? _c : defaultAriaLabels.pageLabel;
|
|
56
52
|
function handlePrevPageClick(requestedPageIndex) {
|
|
57
53
|
handlePageClick(requestedPageIndex);
|
|
58
54
|
fireNonCancelableEvent(onPreviousPageClick, {
|
|
@@ -73,32 +69,32 @@ export default function InternalPagination(_a) {
|
|
|
73
69
|
const previousButtonDisabled = disabled || currentPageIndex === 1;
|
|
74
70
|
const nextButtonDisabled = disabled || (!openEnd && (pagesCount === 0 || currentPageIndex === pagesCount));
|
|
75
71
|
const tableComponentContext = useTableComponentsContext();
|
|
76
|
-
if ((
|
|
72
|
+
if ((_d = tableComponentContext === null || tableComponentContext === void 0 ? void 0 : tableComponentContext.paginationRef) === null || _d === void 0 ? void 0 : _d.current) {
|
|
77
73
|
tableComponentContext.paginationRef.current.currentPageIndex = currentPageIndex;
|
|
78
74
|
tableComponentContext.paginationRef.current.totalPageCount = pagesCount;
|
|
79
75
|
tableComponentContext.paginationRef.current.openEnd = openEnd;
|
|
80
76
|
}
|
|
81
|
-
return (React.createElement("ul",
|
|
82
|
-
React.createElement(PageButton,
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
77
|
+
return (React.createElement("ul", { "aria-label": paginationLabel, ...baseProps, className: clsx(baseProps.className, styles.root, disabled && styles['root-disabled']), ref: __internalRootRef },
|
|
78
|
+
React.createElement(PageButton, { className: styles.arrow, pageIndex: currentPageIndex - 1, ariaLabel: previousPageLabel !== null && previousPageLabel !== void 0 ? previousPageLabel : defaultAriaLabels.nextPageLabel, disabled: previousButtonDisabled, onClick: handlePrevPageClick, ...(previousButtonDisabled
|
|
79
|
+
? {}
|
|
80
|
+
: getAnalyticsMetadataAttribute({
|
|
81
|
+
detail: {
|
|
82
|
+
position: 'prev',
|
|
83
|
+
},
|
|
84
|
+
})) },
|
|
89
85
|
React.createElement(InternalIcon, { name: "angle-left", variant: disabled ? 'disabled' : 'normal' })),
|
|
90
86
|
React.createElement(PageNumber, { pageIndex: 1, isCurrent: currentPageIndex === 1, disabled: disabled, ariaLabel: pageNumberLabelFn(1), onClick: handlePageClick }),
|
|
91
87
|
leftDots && React.createElement("li", { className: styles.dots }, "..."),
|
|
92
88
|
range(leftIndex, rightIndex).map(pageIndex => (React.createElement(PageNumber, { key: pageIndex, isCurrent: currentPageIndex === pageIndex, pageIndex: pageIndex, disabled: disabled, ariaLabel: pageNumberLabelFn(pageIndex), onClick: handlePageClick }))),
|
|
93
89
|
rightDots && React.createElement("li", { className: styles.dots }, "..."),
|
|
94
90
|
!openEnd && pagesCount > 1 && (React.createElement(PageNumber, { isCurrent: currentPageIndex === pagesCount, pageIndex: pagesCount, disabled: disabled, ariaLabel: pageNumberLabelFn(pagesCount), onClick: handlePageClick })),
|
|
95
|
-
React.createElement(PageButton,
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
91
|
+
React.createElement(PageButton, { className: styles.arrow, pageIndex: currentPageIndex + 1, ariaLabel: nextPageLabel !== null && nextPageLabel !== void 0 ? nextPageLabel : defaultAriaLabels.nextPageLabel, disabled: nextButtonDisabled, onClick: handleNextPageClick, ...(nextButtonDisabled
|
|
92
|
+
? {}
|
|
93
|
+
: getAnalyticsMetadataAttribute({
|
|
94
|
+
detail: {
|
|
95
|
+
position: 'next',
|
|
96
|
+
},
|
|
97
|
+
})) },
|
|
102
98
|
React.createElement(InternalIcon, { name: "angle-right", variant: disabled ? 'disabled' : 'normal' }))));
|
|
103
99
|
}
|
|
104
100
|
//# sourceMappingURL=internal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/pagination/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport {\n copyAnalyticsMetadataAttribute,\n getAnalyticsMetadataAttribute,\n} from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useInternalI18n } from '../i18n/context';\nimport InternalIcon from '../icon/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { useTableComponentsContext } from '../internal/context/table-component-context';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { GeneratedAnalyticsMetadataPaginationClick } from './analytics-metadata/interfaces';\nimport { PaginationProps } from './interfaces';\nimport { getPaginationState, range } from './utils';\n\nimport styles from './styles.css.js';\n\nconst defaultAriaLabels: Required<PaginationProps.Labels> = {\n nextPageLabel: '',\n paginationLabel: '',\n previousPageLabel: '',\n pageLabel: pageNumber => `${pageNumber}`,\n};\n\ninterface PageButtonProps {\n className?: string;\n ariaLabel: string;\n disabled?: boolean;\n pageIndex: number;\n isCurrent?: boolean;\n children?: React.ReactNode;\n onClick: (requestedIndex: number) => void;\n}\n\nfunction PageButton({\n className,\n ariaLabel,\n disabled,\n pageIndex,\n isCurrent = false,\n children,\n onClick,\n ...rest\n}: PageButtonProps) {\n function handleClick(event: React.MouseEvent) {\n event.preventDefault();\n onClick(pageIndex);\n }\n return (\n <li className={styles['page-item']} {...copyAnalyticsMetadataAttribute(rest)}>\n <button\n className={clsx(\n className,\n styles.button,\n disabled && styles['button-disabled'],\n isCurrent && styles['button-current']\n )}\n type=\"button\"\n aria-label={ariaLabel}\n disabled={disabled}\n onClick={handleClick}\n aria-current={isCurrent}\n {...(disabled\n ? {}\n : getAnalyticsMetadataAttribute({\n action: 'click',\n detail: {\n label: { root: 'self' },\n },\n } as GeneratedAnalyticsMetadataPaginationClick))}\n >\n {children}\n </button>\n </li>\n );\n}\n\nfunction PageNumber({ pageIndex, ...rest }: PageButtonProps) {\n return (\n <PageButton\n className={styles['page-number']}\n pageIndex={pageIndex}\n {...rest}\n {...(rest.disabled\n ? {}\n : getAnalyticsMetadataAttribute({\n detail: {\n position: `${pageIndex}`,\n },\n }))}\n >\n {pageIndex}\n </PageButton>\n );\n}\n\ntype InternalPaginationProps = PaginationProps & InternalBaseComponentProps;\nexport default function InternalPagination({\n openEnd,\n currentPageIndex,\n ariaLabels,\n pagesCount,\n disabled,\n onChange,\n onNextPageClick,\n onPreviousPageClick,\n __internalRootRef,\n ...rest\n}: InternalPaginationProps) {\n const baseProps = getBaseProps(rest);\n const { leftDots, leftIndex, rightIndex, rightDots } = getPaginationState(currentPageIndex, pagesCount, openEnd);\n\n const i18n = useInternalI18n('pagination');\n\n const paginationLabel = ariaLabels?.paginationLabel;\n const nextPageLabel = i18n('ariaLabels.nextPageLabel', ariaLabels?.nextPageLabel) ?? defaultAriaLabels.nextPageLabel;\n const previousPageLabel =\n i18n('ariaLabels.previousPageLabel', ariaLabels?.previousPageLabel) ?? defaultAriaLabels.previousPageLabel;\n const pageNumberLabelFn =\n i18n('ariaLabels.pageLabel', ariaLabels?.pageLabel, format => pageNumber => format({ pageNumber })) ??\n defaultAriaLabels.pageLabel;\n\n function handlePrevPageClick(requestedPageIndex: number) {\n handlePageClick(requestedPageIndex);\n fireNonCancelableEvent(onPreviousPageClick, {\n requestedPageAvailable: true,\n requestedPageIndex: requestedPageIndex,\n });\n }\n\n function handleNextPageClick(requestedPageIndex: number) {\n handlePageClick(requestedPageIndex);\n fireNonCancelableEvent(onNextPageClick, {\n requestedPageAvailable: currentPageIndex < pagesCount,\n requestedPageIndex: requestedPageIndex,\n });\n }\n\n function handlePageClick(requestedPageIndex: number) {\n fireNonCancelableEvent(onChange, { currentPageIndex: requestedPageIndex });\n }\n\n const previousButtonDisabled = disabled || currentPageIndex === 1;\n const nextButtonDisabled = disabled || (!openEnd && (pagesCount === 0 || currentPageIndex === pagesCount));\n const tableComponentContext = useTableComponentsContext();\n if (tableComponentContext?.paginationRef?.current) {\n tableComponentContext.paginationRef.current.currentPageIndex = currentPageIndex;\n tableComponentContext.paginationRef.current.totalPageCount = pagesCount;\n tableComponentContext.paginationRef.current.openEnd = openEnd;\n }\n return (\n <ul\n aria-label={paginationLabel}\n {...baseProps}\n className={clsx(baseProps.className, styles.root, disabled && styles['root-disabled'])}\n ref={__internalRootRef}\n >\n <PageButton\n className={styles.arrow}\n pageIndex={currentPageIndex - 1}\n ariaLabel={previousPageLabel ?? defaultAriaLabels.nextPageLabel}\n disabled={previousButtonDisabled}\n onClick={handlePrevPageClick}\n {...(previousButtonDisabled\n ? {}\n : getAnalyticsMetadataAttribute({\n detail: {\n position: 'prev',\n },\n }))}\n >\n <InternalIcon name=\"angle-left\" variant={disabled ? 'disabled' : 'normal'} />\n </PageButton>\n <PageNumber\n pageIndex={1}\n isCurrent={currentPageIndex === 1}\n disabled={disabled}\n ariaLabel={pageNumberLabelFn(1)}\n onClick={handlePageClick}\n />\n {leftDots && <li className={styles.dots}>...</li>}\n {range(leftIndex, rightIndex).map(pageIndex => (\n <PageNumber\n key={pageIndex}\n isCurrent={currentPageIndex === pageIndex}\n pageIndex={pageIndex}\n disabled={disabled}\n ariaLabel={pageNumberLabelFn(pageIndex)}\n onClick={handlePageClick}\n />\n ))}\n {rightDots && <li className={styles.dots}>...</li>}\n {!openEnd && pagesCount > 1 && (\n <PageNumber\n isCurrent={currentPageIndex === pagesCount}\n pageIndex={pagesCount}\n disabled={disabled}\n ariaLabel={pageNumberLabelFn(pagesCount)}\n onClick={handlePageClick}\n />\n )}\n <PageButton\n className={styles.arrow}\n pageIndex={currentPageIndex + 1}\n ariaLabel={nextPageLabel ?? defaultAriaLabels.nextPageLabel}\n disabled={nextButtonDisabled}\n onClick={handleNextPageClick}\n {...(nextButtonDisabled\n ? {}\n : getAnalyticsMetadataAttribute({\n detail: {\n position: 'next',\n },\n }))}\n >\n <InternalIcon name=\"angle-right\" variant={disabled ? 'disabled' : 'normal'} />\n </PageButton>\n </ul>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/pagination/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport {\n copyAnalyticsMetadataAttribute,\n getAnalyticsMetadataAttribute,\n} from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useInternalI18n } from '../i18n/context';\nimport InternalIcon from '../icon/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { useTableComponentsContext } from '../internal/context/table-component-context';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { GeneratedAnalyticsMetadataPaginationClick } from './analytics-metadata/interfaces';\nimport { PaginationProps } from './interfaces';\nimport { getPaginationState, range } from './utils';\n\nimport styles from './styles.css.js';\n\nconst defaultAriaLabels: Required<PaginationProps.Labels> = {\n nextPageLabel: '',\n paginationLabel: '',\n previousPageLabel: '',\n pageLabel: pageNumber => `${pageNumber}`,\n};\n\ninterface PageButtonProps {\n className?: string;\n ariaLabel: string;\n disabled?: boolean;\n pageIndex: number;\n isCurrent?: boolean;\n children?: React.ReactNode;\n onClick: (requestedIndex: number) => void;\n}\n\nfunction PageButton({\n className,\n ariaLabel,\n disabled,\n pageIndex,\n isCurrent = false,\n children,\n onClick,\n ...rest\n}: PageButtonProps) {\n function handleClick(event: React.MouseEvent) {\n event.preventDefault();\n onClick(pageIndex);\n }\n return (\n <li className={styles['page-item']} {...copyAnalyticsMetadataAttribute(rest)}>\n <button\n className={clsx(\n className,\n styles.button,\n disabled && styles['button-disabled'],\n isCurrent && styles['button-current']\n )}\n type=\"button\"\n aria-label={ariaLabel}\n disabled={disabled}\n onClick={handleClick}\n aria-current={isCurrent}\n {...(disabled\n ? {}\n : getAnalyticsMetadataAttribute({\n action: 'click',\n detail: {\n label: { root: 'self' },\n },\n } as GeneratedAnalyticsMetadataPaginationClick))}\n >\n {children}\n </button>\n </li>\n );\n}\n\nfunction PageNumber({ pageIndex, ...rest }: PageButtonProps) {\n return (\n <PageButton\n className={styles['page-number']}\n pageIndex={pageIndex}\n {...rest}\n {...(rest.disabled\n ? {}\n : getAnalyticsMetadataAttribute({\n detail: {\n position: `${pageIndex}`,\n },\n }))}\n >\n {pageIndex}\n </PageButton>\n );\n}\n\ntype InternalPaginationProps = PaginationProps & InternalBaseComponentProps;\nexport default function InternalPagination({\n openEnd,\n currentPageIndex,\n ariaLabels,\n pagesCount,\n disabled,\n onChange,\n onNextPageClick,\n onPreviousPageClick,\n __internalRootRef,\n ...rest\n}: InternalPaginationProps) {\n const baseProps = getBaseProps(rest);\n const { leftDots, leftIndex, rightIndex, rightDots } = getPaginationState(currentPageIndex, pagesCount, openEnd);\n\n const i18n = useInternalI18n('pagination');\n\n const paginationLabel = ariaLabels?.paginationLabel;\n const nextPageLabel = i18n('ariaLabels.nextPageLabel', ariaLabels?.nextPageLabel) ?? defaultAriaLabels.nextPageLabel;\n const previousPageLabel =\n i18n('ariaLabels.previousPageLabel', ariaLabels?.previousPageLabel) ?? defaultAriaLabels.previousPageLabel;\n const pageNumberLabelFn =\n i18n('ariaLabels.pageLabel', ariaLabels?.pageLabel, format => pageNumber => format({ pageNumber })) ??\n defaultAriaLabels.pageLabel;\n\n function handlePrevPageClick(requestedPageIndex: number) {\n handlePageClick(requestedPageIndex);\n fireNonCancelableEvent(onPreviousPageClick, {\n requestedPageAvailable: true,\n requestedPageIndex: requestedPageIndex,\n });\n }\n\n function handleNextPageClick(requestedPageIndex: number) {\n handlePageClick(requestedPageIndex);\n fireNonCancelableEvent(onNextPageClick, {\n requestedPageAvailable: currentPageIndex < pagesCount,\n requestedPageIndex: requestedPageIndex,\n });\n }\n\n function handlePageClick(requestedPageIndex: number) {\n fireNonCancelableEvent(onChange, { currentPageIndex: requestedPageIndex });\n }\n\n const previousButtonDisabled = disabled || currentPageIndex === 1;\n const nextButtonDisabled = disabled || (!openEnd && (pagesCount === 0 || currentPageIndex === pagesCount));\n const tableComponentContext = useTableComponentsContext();\n if (tableComponentContext?.paginationRef?.current) {\n tableComponentContext.paginationRef.current.currentPageIndex = currentPageIndex;\n tableComponentContext.paginationRef.current.totalPageCount = pagesCount;\n tableComponentContext.paginationRef.current.openEnd = openEnd;\n }\n return (\n <ul\n aria-label={paginationLabel}\n {...baseProps}\n className={clsx(baseProps.className, styles.root, disabled && styles['root-disabled'])}\n ref={__internalRootRef}\n >\n <PageButton\n className={styles.arrow}\n pageIndex={currentPageIndex - 1}\n ariaLabel={previousPageLabel ?? defaultAriaLabels.nextPageLabel}\n disabled={previousButtonDisabled}\n onClick={handlePrevPageClick}\n {...(previousButtonDisabled\n ? {}\n : getAnalyticsMetadataAttribute({\n detail: {\n position: 'prev',\n },\n }))}\n >\n <InternalIcon name=\"angle-left\" variant={disabled ? 'disabled' : 'normal'} />\n </PageButton>\n <PageNumber\n pageIndex={1}\n isCurrent={currentPageIndex === 1}\n disabled={disabled}\n ariaLabel={pageNumberLabelFn(1)}\n onClick={handlePageClick}\n />\n {leftDots && <li className={styles.dots}>...</li>}\n {range(leftIndex, rightIndex).map(pageIndex => (\n <PageNumber\n key={pageIndex}\n isCurrent={currentPageIndex === pageIndex}\n pageIndex={pageIndex}\n disabled={disabled}\n ariaLabel={pageNumberLabelFn(pageIndex)}\n onClick={handlePageClick}\n />\n ))}\n {rightDots && <li className={styles.dots}>...</li>}\n {!openEnd && pagesCount > 1 && (\n <PageNumber\n isCurrent={currentPageIndex === pagesCount}\n pageIndex={pagesCount}\n disabled={disabled}\n ariaLabel={pageNumberLabelFn(pagesCount)}\n onClick={handlePageClick}\n />\n )}\n <PageButton\n className={styles.arrow}\n pageIndex={currentPageIndex + 1}\n ariaLabel={nextPageLabel ?? defaultAriaLabels.nextPageLabel}\n disabled={nextButtonDisabled}\n onClick={handleNextPageClick}\n {...(nextButtonDisabled\n ? {}\n : getAnalyticsMetadataAttribute({\n detail: {\n position: 'next',\n },\n }))}\n >\n <InternalIcon name=\"angle-right\" variant={disabled ? 'disabled' : 'normal'} />\n </PageButton>\n </ul>\n );\n}\n"]}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
3
|
'use client';
|
|
4
|
-
import { __rest } from "tslib";
|
|
5
4
|
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
6
5
|
import clsx from 'clsx';
|
|
7
6
|
import { pie } from 'd3-shape';
|
|
@@ -23,8 +22,7 @@ import useContainerWidth from '../internal/utils/use-container-width';
|
|
|
23
22
|
import InternalPieChart from './pie-chart';
|
|
24
23
|
import { getDimensionsBySize } from './utils';
|
|
25
24
|
import styles from './styles.css.js';
|
|
26
|
-
const PieChart = function PieChart(
|
|
27
|
-
var { fitHeight, variant = 'pie', size = 'medium', hideTitles = false, hideDescriptions = false, hideLegend = false, hideFilter = false, statusType = 'finished', data: externalData = [], i18nStrings = {}, highlightedSegment: controlledHighlightedSegment, visibleSegments: controlledVisibleSegments, onHighlightChange: controlledOnHighlightChange, onFilterChange, additionalFilters, legendTitle, detailPopoverSize = 'medium' } = _a, props = __rest(_a, ["fitHeight", "variant", "size", "hideTitles", "hideDescriptions", "hideLegend", "hideFilter", "statusType", "data", "i18nStrings", "highlightedSegment", "visibleSegments", "onHighlightChange", "onFilterChange", "additionalFilters", "legendTitle", "detailPopoverSize"]);
|
|
25
|
+
const PieChart = function PieChart({ fitHeight, variant = 'pie', size = 'medium', hideTitles = false, hideDescriptions = false, hideLegend = false, hideFilter = false, statusType = 'finished', data: externalData = [], i18nStrings = {}, highlightedSegment: controlledHighlightedSegment, visibleSegments: controlledVisibleSegments, onHighlightChange: controlledOnHighlightChange, onFilterChange, additionalFilters, legendTitle, detailPopoverSize = 'medium', ...props }) {
|
|
28
26
|
const { __internalRootRef = null } = useBaseComponent('PieChart', {
|
|
29
27
|
props: {
|
|
30
28
|
fitHeight,
|
|
@@ -111,12 +109,12 @@ const PieChart = function PieChart(_a) {
|
|
|
111
109
|
const defaultDimensions = getDimensionsBySize({ size, hasLabels, visualRefresh: isRefresh });
|
|
112
110
|
const radius = defaultDimensions.outerRadius;
|
|
113
111
|
const height = 2 * (radius + defaultDimensions.padding + (hasLabels ? defaultDimensions.paddingLabels : 0));
|
|
114
|
-
return (React.createElement(ChartWrapper,
|
|
112
|
+
return (React.createElement(ChartWrapper, { ref: mergedRef, fitHeight: !!fitHeight, ...baseProps, className: clsx(baseProps.className, styles.root), contentClassName: clsx(styles.content, styles[`content--${defaultDimensions.size}`], {
|
|
115
113
|
[styles['content--without-labels']]: !hasLabels,
|
|
116
114
|
[styles['content--fit-height']]: fitHeight,
|
|
117
|
-
}), defaultFilter: showFilters && !hideFilter ? (React.createElement(Filter, { series: filterItems, onChange: filterChange, selectedSeries: visibleSegments, i18nStrings: i18nStrings })) : null, additionalFilters: showFilters ? additionalFilters : null, reserveFilterSpace: !!reserveFilterSpace, reserveLegendSpace: !!reserveLegendSpace, chartStatus: React.createElement(ChartStatusContainer, { isEmpty: isEmpty, isNoMatch: isNoMatch, showChart: showChart, statusType: statusType, empty: props.empty, noMatch: props.noMatch, loadingText: props.loadingText, errorText: props.errorText, recoveryText: props.recoveryText, onRecoveryClick: props.onRecoveryClick }), chart: showChart ? (React.createElement(InternalPieChart,
|
|
115
|
+
}), defaultFilter: showFilters && !hideFilter ? (React.createElement(Filter, { series: filterItems, onChange: filterChange, selectedSeries: visibleSegments, i18nStrings: i18nStrings })) : null, additionalFilters: showFilters ? additionalFilters : null, reserveFilterSpace: !!reserveFilterSpace, reserveLegendSpace: !!reserveLegendSpace, chartStatus: React.createElement(ChartStatusContainer, { isEmpty: isEmpty, isNoMatch: isNoMatch, showChart: showChart, statusType: statusType, empty: props.empty, noMatch: props.noMatch, loadingText: props.loadingText, errorText: props.errorText, recoveryText: props.recoveryText, onRecoveryClick: props.onRecoveryClick }), chart: showChart ? (React.createElement(InternalPieChart, { ...props, variant: variant, size: size, height: height, fitHeight: fitHeight, data: externalData, width: containerWidth, hideTitles: hideTitles, hideDescriptions: hideDescriptions, i18nStrings: i18nStrings, onHighlightChange: onHighlightChange, highlightedSegment: highlightedSegment, legendSegment: legendSegment, detailPopoverSize: detailPopoverSize, pieData: pieData, dataSum: dataSum })) : null, legend: !hideLegend &&
|
|
118
116
|
!hasNoData &&
|
|
119
|
-
statusType === 'finished' && (React.createElement(Legend, { series: legendItems, highlightedSeries: legendSegment, legendTitle: legendTitle, ariaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.legendAriaLabel, onHighlightChange: onHighlightChange, plotContainerRef: containerRef })), onBlur: onBlur }))
|
|
117
|
+
statusType === 'finished' && (React.createElement(Legend, { series: legendItems, highlightedSeries: legendSegment, legendTitle: legendTitle, ariaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.legendAriaLabel, onHighlightChange: onHighlightChange, plotContainerRef: containerRef })), onBlur: onBlur }));
|
|
120
118
|
};
|
|
121
119
|
applyDisplayName(PieChart, 'PieChart');
|
|
122
120
|
export default PieChart;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/pie-chart/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { pie } from 'd3-shape';\n\nimport { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';\n\nimport { getBaseProps } from '../internal/base-component';\nimport Filter, { ChartFilterProps } from '../internal/components/chart-filter';\nimport Legend, { ChartLegendProps } from '../internal/components/chart-legend';\nimport ChartSeriesMarker from '../internal/components/chart-series-marker';\nimport ChartStatusContainer, { getChartStatus } from '../internal/components/chart-status-container';\nimport { ChartWrapper } from '../internal/components/chart-wrapper';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport createCategoryColorScale from '../internal/utils/create-category-color-scale';\nimport { nodeBelongs } from '../internal/utils/node-belongs';\nimport useContainerWidth from '../internal/utils/use-container-width';\nimport { PieChartProps } from './interfaces';\nimport InternalPieChart, { InternalChartDatum } from './pie-chart';\nimport { getDimensionsBySize } from './utils';\n\nimport styles from './styles.css.js';\n\nexport { PieChartProps };\n\nconst PieChart = function PieChart<T extends PieChartProps.Datum = PieChartProps.Datum>({\n fitHeight,\n variant = 'pie',\n size = 'medium',\n hideTitles = false,\n hideDescriptions = false,\n hideLegend = false,\n hideFilter = false,\n statusType = 'finished',\n data: externalData = [],\n i18nStrings = {},\n highlightedSegment: controlledHighlightedSegment,\n visibleSegments: controlledVisibleSegments,\n onHighlightChange: controlledOnHighlightChange,\n onFilterChange,\n additionalFilters,\n legendTitle,\n detailPopoverSize = 'medium',\n ...props\n}: PieChartProps<T>) {\n const { __internalRootRef = null } = useBaseComponent('PieChart', {\n props: {\n fitHeight,\n variant,\n size,\n hideTitles,\n hideDescriptions,\n hideLegend,\n hideFilter,\n detailPopoverSize,\n },\n });\n const baseProps = getBaseProps(props);\n const containerRef = useRef<HTMLDivElement>(null);\n const [containerWidth, measureRef] = useContainerWidth();\n\n const data: ReadonlyArray<InternalChartDatum<T>> = useMemo(() => {\n const colors = createCategoryColorScale(externalData, undefined, it => it.color || null);\n\n return externalData.map((datum, i) => ({\n index: i,\n color: colors[i],\n datum,\n }));\n }, [externalData]);\n\n const [highlightedSegment = null, setHighlightedSegment] = useControllable(\n controlledHighlightedSegment,\n controlledOnHighlightChange,\n null,\n {\n componentName: 'PieChart',\n controlledProp: 'highlightedSegment',\n changeHandler: 'onHighlightChange',\n }\n );\n const [legendSegment, setLegendSegment] = useState<null | T>(highlightedSegment);\n useEffect(() => {\n setLegendSegment(controlledHighlightedSegment || null);\n }, [controlledHighlightedSegment]);\n\n const [visibleSegments, setVisibleSegments] = useControllable(\n controlledVisibleSegments,\n onFilterChange,\n externalData,\n {\n componentName: 'PieChart',\n controlledProp: 'visibleSegments',\n changeHandler: 'onFilterChange',\n }\n );\n\n const visibleData = useMemo(\n () => data.filter(d => visibleSegments?.indexOf(d.datum) !== -1),\n [data, visibleSegments]\n );\n\n const filterItems: ChartFilterProps<T>['series'] = data?.map(data => ({\n label: data.datum.title,\n marker: <ChartSeriesMarker color={data.color} type=\"rectangle\" />,\n datum: data.datum,\n }));\n\n const legendItems: ChartLegendProps<T>['series'] = filterItems.filter(d => visibleSegments?.indexOf(d.datum) !== -1);\n\n const filterChange = useCallback(\n (selectedSeries: ReadonlyArray<T>) => {\n setVisibleSegments(selectedSeries);\n fireNonCancelableEvent(onFilterChange, {\n visibleSegments: selectedSeries,\n });\n },\n [setVisibleSegments, onFilterChange]\n );\n\n const onHighlightChange = useCallback(\n (segment: T | null) => {\n setLegendSegment(segment);\n setHighlightedSegment(segment);\n fireNonCancelableEvent(controlledOnHighlightChange, { highlightedSegment: segment });\n },\n [controlledOnHighlightChange, setHighlightedSegment]\n );\n\n const onBlur = (event: React.FocusEvent) => {\n if (event.relatedTarget && !nodeBelongs(containerRef.current, event.relatedTarget)) {\n if (highlightedSegment) {\n onHighlightChange(null);\n }\n setLegendSegment(null);\n }\n };\n\n const mergedRef = useMergeRefs(containerRef, measureRef, __internalRootRef);\n\n const { pieData, dataSum } = useMemo(() => {\n const dataSum = visibleData.reduce((sum, d) => sum + d.datum.value, 0);\n\n const pieFactory = pie<InternalChartDatum<T>>()\n // Minimum 1% segment size\n .value(d => (d.datum.value < dataSum / 100 ? dataSum / 100 : d.datum.value))\n .sort(null);\n\n // Filter out segments with value of zero or below\n const pieData = pieFactory(visibleData.filter(d => d.datum.value > 0));\n\n return { pieData, dataSum };\n }, [visibleData]);\n\n const hasNoData = !externalData || externalData.length === 0;\n const { isEmpty, showChart } = getChartStatus({ externalData: data, visibleData: pieData, statusType });\n // Pie charts have a special condition for empty/noMatch due to how zero-value segments are handled.\n const isNoMatch = isEmpty && visibleData.length !== data.length;\n const showFilters = statusType === 'finished' && !hasNoData && (additionalFilters || !hideFilter);\n const reserveLegendSpace = !showChart && !hideLegend;\n const reserveFilterSpace = statusType !== 'finished' && !isNoMatch && (!hideFilter || additionalFilters);\n const hasLabels = !(hideTitles && hideDescriptions);\n\n const isRefresh = useVisualRefresh();\n const defaultDimensions = getDimensionsBySize({ size, hasLabels, visualRefresh: isRefresh });\n const radius = defaultDimensions.outerRadius;\n const height = 2 * (radius + defaultDimensions.padding + (hasLabels ? defaultDimensions.paddingLabels : 0));\n\n return (\n <ChartWrapper\n ref={mergedRef}\n fitHeight={!!fitHeight}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n contentClassName={clsx(styles.content, styles[`content--${defaultDimensions.size}`], {\n [styles['content--without-labels']]: !hasLabels,\n [styles['content--fit-height']]: fitHeight,\n })}\n defaultFilter={\n showFilters && !hideFilter ? (\n <Filter\n series={filterItems}\n onChange={filterChange}\n selectedSeries={visibleSegments}\n i18nStrings={i18nStrings}\n />\n ) : null\n }\n additionalFilters={showFilters ? additionalFilters : null}\n reserveFilterSpace={!!reserveFilterSpace}\n reserveLegendSpace={!!reserveLegendSpace}\n chartStatus={\n <ChartStatusContainer\n isEmpty={isEmpty}\n isNoMatch={isNoMatch}\n showChart={showChart}\n statusType={statusType}\n empty={props.empty}\n noMatch={props.noMatch}\n loadingText={props.loadingText}\n errorText={props.errorText}\n recoveryText={props.recoveryText}\n onRecoveryClick={props.onRecoveryClick}\n />\n }\n chart={\n showChart ? (\n <InternalPieChart\n {...props}\n variant={variant}\n size={size}\n height={height}\n fitHeight={fitHeight}\n data={externalData}\n width={containerWidth}\n hideTitles={hideTitles}\n hideDescriptions={hideDescriptions}\n i18nStrings={i18nStrings}\n onHighlightChange={onHighlightChange}\n highlightedSegment={highlightedSegment}\n legendSegment={legendSegment}\n detailPopoverSize={detailPopoverSize}\n pieData={pieData}\n dataSum={dataSum}\n />\n ) : null\n }\n legend={\n !hideLegend &&\n !hasNoData &&\n statusType === 'finished' && (\n <Legend<T>\n series={legendItems}\n highlightedSeries={legendSegment}\n legendTitle={legendTitle}\n ariaLabel={i18nStrings?.legendAriaLabel}\n onHighlightChange={onHighlightChange}\n plotContainerRef={containerRef}\n />\n )\n }\n onBlur={onBlur}\n />\n );\n};\n\napplyDisplayName(PieChart, 'PieChart');\nexport default PieChart;\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/pie-chart/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { pie } from 'd3-shape';\n\nimport { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';\n\nimport { getBaseProps } from '../internal/base-component';\nimport Filter, { ChartFilterProps } from '../internal/components/chart-filter';\nimport Legend, { ChartLegendProps } from '../internal/components/chart-legend';\nimport ChartSeriesMarker from '../internal/components/chart-series-marker';\nimport ChartStatusContainer, { getChartStatus } from '../internal/components/chart-status-container';\nimport { ChartWrapper } from '../internal/components/chart-wrapper';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport createCategoryColorScale from '../internal/utils/create-category-color-scale';\nimport { nodeBelongs } from '../internal/utils/node-belongs';\nimport useContainerWidth from '../internal/utils/use-container-width';\nimport { PieChartProps } from './interfaces';\nimport InternalPieChart, { InternalChartDatum } from './pie-chart';\nimport { getDimensionsBySize } from './utils';\n\nimport styles from './styles.css.js';\n\nexport { PieChartProps };\n\nconst PieChart = function PieChart<T extends PieChartProps.Datum = PieChartProps.Datum>({\n fitHeight,\n variant = 'pie',\n size = 'medium',\n hideTitles = false,\n hideDescriptions = false,\n hideLegend = false,\n hideFilter = false,\n statusType = 'finished',\n data: externalData = [],\n i18nStrings = {},\n highlightedSegment: controlledHighlightedSegment,\n visibleSegments: controlledVisibleSegments,\n onHighlightChange: controlledOnHighlightChange,\n onFilterChange,\n additionalFilters,\n legendTitle,\n detailPopoverSize = 'medium',\n ...props\n}: PieChartProps<T>) {\n const { __internalRootRef = null } = useBaseComponent('PieChart', {\n props: {\n fitHeight,\n variant,\n size,\n hideTitles,\n hideDescriptions,\n hideLegend,\n hideFilter,\n detailPopoverSize,\n },\n });\n const baseProps = getBaseProps(props);\n const containerRef = useRef<HTMLDivElement>(null);\n const [containerWidth, measureRef] = useContainerWidth();\n\n const data: ReadonlyArray<InternalChartDatum<T>> = useMemo(() => {\n const colors = createCategoryColorScale(externalData, undefined, it => it.color || null);\n\n return externalData.map((datum, i) => ({\n index: i,\n color: colors[i],\n datum,\n }));\n }, [externalData]);\n\n const [highlightedSegment = null, setHighlightedSegment] = useControllable(\n controlledHighlightedSegment,\n controlledOnHighlightChange,\n null,\n {\n componentName: 'PieChart',\n controlledProp: 'highlightedSegment',\n changeHandler: 'onHighlightChange',\n }\n );\n const [legendSegment, setLegendSegment] = useState<null | T>(highlightedSegment);\n useEffect(() => {\n setLegendSegment(controlledHighlightedSegment || null);\n }, [controlledHighlightedSegment]);\n\n const [visibleSegments, setVisibleSegments] = useControllable(\n controlledVisibleSegments,\n onFilterChange,\n externalData,\n {\n componentName: 'PieChart',\n controlledProp: 'visibleSegments',\n changeHandler: 'onFilterChange',\n }\n );\n\n const visibleData = useMemo(\n () => data.filter(d => visibleSegments?.indexOf(d.datum) !== -1),\n [data, visibleSegments]\n );\n\n const filterItems: ChartFilterProps<T>['series'] = data?.map(data => ({\n label: data.datum.title,\n marker: <ChartSeriesMarker color={data.color} type=\"rectangle\" />,\n datum: data.datum,\n }));\n\n const legendItems: ChartLegendProps<T>['series'] = filterItems.filter(d => visibleSegments?.indexOf(d.datum) !== -1);\n\n const filterChange = useCallback(\n (selectedSeries: ReadonlyArray<T>) => {\n setVisibleSegments(selectedSeries);\n fireNonCancelableEvent(onFilterChange, {\n visibleSegments: selectedSeries,\n });\n },\n [setVisibleSegments, onFilterChange]\n );\n\n const onHighlightChange = useCallback(\n (segment: T | null) => {\n setLegendSegment(segment);\n setHighlightedSegment(segment);\n fireNonCancelableEvent(controlledOnHighlightChange, { highlightedSegment: segment });\n },\n [controlledOnHighlightChange, setHighlightedSegment]\n );\n\n const onBlur = (event: React.FocusEvent) => {\n if (event.relatedTarget && !nodeBelongs(containerRef.current, event.relatedTarget)) {\n if (highlightedSegment) {\n onHighlightChange(null);\n }\n setLegendSegment(null);\n }\n };\n\n const mergedRef = useMergeRefs(containerRef, measureRef, __internalRootRef);\n\n const { pieData, dataSum } = useMemo(() => {\n const dataSum = visibleData.reduce((sum, d) => sum + d.datum.value, 0);\n\n const pieFactory = pie<InternalChartDatum<T>>()\n // Minimum 1% segment size\n .value(d => (d.datum.value < dataSum / 100 ? dataSum / 100 : d.datum.value))\n .sort(null);\n\n // Filter out segments with value of zero or below\n const pieData = pieFactory(visibleData.filter(d => d.datum.value > 0));\n\n return { pieData, dataSum };\n }, [visibleData]);\n\n const hasNoData = !externalData || externalData.length === 0;\n const { isEmpty, showChart } = getChartStatus({ externalData: data, visibleData: pieData, statusType });\n // Pie charts have a special condition for empty/noMatch due to how zero-value segments are handled.\n const isNoMatch = isEmpty && visibleData.length !== data.length;\n const showFilters = statusType === 'finished' && !hasNoData && (additionalFilters || !hideFilter);\n const reserveLegendSpace = !showChart && !hideLegend;\n const reserveFilterSpace = statusType !== 'finished' && !isNoMatch && (!hideFilter || additionalFilters);\n const hasLabels = !(hideTitles && hideDescriptions);\n\n const isRefresh = useVisualRefresh();\n const defaultDimensions = getDimensionsBySize({ size, hasLabels, visualRefresh: isRefresh });\n const radius = defaultDimensions.outerRadius;\n const height = 2 * (radius + defaultDimensions.padding + (hasLabels ? defaultDimensions.paddingLabels : 0));\n\n return (\n <ChartWrapper\n ref={mergedRef}\n fitHeight={!!fitHeight}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n contentClassName={clsx(styles.content, styles[`content--${defaultDimensions.size}`], {\n [styles['content--without-labels']]: !hasLabels,\n [styles['content--fit-height']]: fitHeight,\n })}\n defaultFilter={\n showFilters && !hideFilter ? (\n <Filter\n series={filterItems}\n onChange={filterChange}\n selectedSeries={visibleSegments}\n i18nStrings={i18nStrings}\n />\n ) : null\n }\n additionalFilters={showFilters ? additionalFilters : null}\n reserveFilterSpace={!!reserveFilterSpace}\n reserveLegendSpace={!!reserveLegendSpace}\n chartStatus={\n <ChartStatusContainer\n isEmpty={isEmpty}\n isNoMatch={isNoMatch}\n showChart={showChart}\n statusType={statusType}\n empty={props.empty}\n noMatch={props.noMatch}\n loadingText={props.loadingText}\n errorText={props.errorText}\n recoveryText={props.recoveryText}\n onRecoveryClick={props.onRecoveryClick}\n />\n }\n chart={\n showChart ? (\n <InternalPieChart\n {...props}\n variant={variant}\n size={size}\n height={height}\n fitHeight={fitHeight}\n data={externalData}\n width={containerWidth}\n hideTitles={hideTitles}\n hideDescriptions={hideDescriptions}\n i18nStrings={i18nStrings}\n onHighlightChange={onHighlightChange}\n highlightedSegment={highlightedSegment}\n legendSegment={legendSegment}\n detailPopoverSize={detailPopoverSize}\n pieData={pieData}\n dataSum={dataSum}\n />\n ) : null\n }\n legend={\n !hideLegend &&\n !hasNoData &&\n statusType === 'finished' && (\n <Legend<T>\n series={legendItems}\n highlightedSeries={legendSegment}\n legendTitle={legendTitle}\n ariaLabel={i18nStrings?.legendAriaLabel}\n onHighlightChange={onHighlightChange}\n plotContainerRef={containerRef}\n />\n )\n }\n onBlur={onBlur}\n />\n );\n};\n\napplyDisplayName(PieChart, 'PieChart');\nexport default PieChart;\n"]}
|
|
@@ -32,8 +32,8 @@ export default ({ pieData, dimensions, highlightedSegment, segmentDescription, v
|
|
|
32
32
|
const lineExtension = 0.5 * Math.cos(2 * smartAngle) + 0.5;
|
|
33
33
|
arcMarkerBreak.outerRadius(radius + 20 * lineExtension);
|
|
34
34
|
arcMarkerBreak.innerRadius(radius + 20 * lineExtension);
|
|
35
|
-
const [startX, startY] = arcMarkerStart.centroid(
|
|
36
|
-
const [breakX, breakY] = arcMarkerBreak.centroid(
|
|
35
|
+
const [startX, startY] = arcMarkerStart.centroid({ ...datum, startAngle: smartAngle, endAngle: smartAngle });
|
|
36
|
+
const [breakX, breakY] = arcMarkerBreak.centroid({ ...datum, startAngle: smartAngle, endAngle: smartAngle });
|
|
37
37
|
const rightSide = smartAngle < Math.PI;
|
|
38
38
|
const endX = shouldOptimizeLabels ? breakX + 20 * (rightSide ? 1 : -1) : (radius + 20) * (rightSide ? 1 : -1);
|
|
39
39
|
const textX = endX + 5 * (rightSide ? 1 : -1);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"labels.js","sourceRoot":"","sources":["../../../src/pie-chart/labels.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { arc, PieArcDatum } from 'd3-shape';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { PieChartProps } from './interfaces';\nimport { InternalChartDatum } from './pie-chart';\nimport ResponsiveText from './responsive-text';\nimport { balanceLabelNodes, computeSmartAngle, Dimension } from './utils';\n\nimport styles from './styles.css.js';\n\ninterface LabelsProps<T> {\n pieData: PieArcDatum<InternalChartDatum<T>>[];\n visibleDataSum: number;\n dimensions: Dimension;\n hideTitles: boolean;\n hideDescriptions: boolean;\n highlightedSegment: PieChartProps.Datum | null;\n segmentDescription?: PieChartProps.SegmentDescriptionFunction<T>;\n containerRef: React.RefObject<HTMLDivElement>;\n}\n\ninterface LabelElementProps {\n x: number;\n y: number;\n rightSide: boolean;\n hideTitles: boolean;\n hideDescriptions: boolean;\n title: PieChartProps.Datum['title'];\n description?: string;\n containerBoundaries: null | { left: number; right: number };\n}\n\nfunction LabelElement({\n x,\n y,\n hideTitles,\n hideDescriptions,\n rightSide,\n title,\n description,\n containerBoundaries,\n}: LabelElementProps) {\n return (\n <g className={styles['label-text']} transform=\"\" data-x={x} data-y={y}>\n {!hideTitles && (\n <ResponsiveText x={x} y={y} rightSide={rightSide} containerBoundaries={containerBoundaries}>\n {title}\n </ResponsiveText>\n )}\n {!hideDescriptions && description && (\n <ResponsiveText\n x={x}\n y={y + (hideTitles ? 0 : 18)}\n rightSide={rightSide}\n className={styles.label__description}\n containerBoundaries={containerBoundaries}\n >\n {description}\n </ResponsiveText>\n )}\n </g>\n );\n}\n\nexport default <T extends PieChartProps.Datum>({\n pieData,\n dimensions,\n highlightedSegment,\n segmentDescription,\n visibleDataSum,\n hideTitles,\n hideDescriptions,\n containerRef,\n}: LabelsProps<T>) => {\n const containerBoundaries = useElementBoundaries(containerRef);\n const shouldOptimizeLabels =\n containerBoundaries.right - containerBoundaries.left - (dimensions.outerRadius + dimensions.innerLabelPadding) * 2 <\n 300;\n const markers = useMemo(() => {\n const { outerRadius: radius, innerLabelPadding } = dimensions;\n\n // More arc factories for the label positioning\n const arcMarkerStart = arc<PieArcDatum<any>>()\n .innerRadius(radius - 1)\n .outerRadius(radius - 1);\n\n const arcMarkerBreak = arc<PieArcDatum<any>>()\n .innerRadius(radius + innerLabelPadding)\n .outerRadius(radius + innerLabelPadding);\n\n return pieData.map((datum, i) => {\n const labelDatum = pieData[i];\n const smartAngle = computeSmartAngle(labelDatum.startAngle, labelDatum.endAngle, shouldOptimizeLabels);\n\n // Make the marker line longer if the segment is closer to the top or bottom of the chart\n const lineExtension = 0.5 * Math.cos(2 * smartAngle) + 0.5;\n arcMarkerBreak.outerRadius(radius + 20 * lineExtension);\n arcMarkerBreak.innerRadius(radius + 20 * lineExtension);\n const [startX, startY] = arcMarkerStart.centroid({ ...datum, startAngle: smartAngle, endAngle: smartAngle });\n const [breakX, breakY] = arcMarkerBreak.centroid({ ...datum, startAngle: smartAngle, endAngle: smartAngle });\n\n const rightSide = smartAngle < Math.PI;\n const endX = shouldOptimizeLabels ? breakX + 20 * (rightSide ? 1 : -1) : (radius + 20) * (rightSide ? 1 : -1);\n const textX = endX + 5 * (rightSide ? 1 : -1);\n\n return {\n startX,\n startY,\n breakX,\n breakY,\n endX,\n endY: breakY,\n textX,\n textY: breakY,\n rightSide,\n datum,\n };\n });\n }, [pieData, dimensions, shouldOptimizeLabels]);\n\n const rootRef = useRef<SVGGElement>(null);\n\n useLayoutEffect(() => {\n if (!rootRef.current) {\n return;\n }\n\n // Relax labels that are overlapping\n const labelNodes = rootRef.current.querySelectorAll<SVGGElement>(`.${styles['label-text']}`);\n balanceLabelNodes(labelNodes, markers, false, dimensions.outerRadius + dimensions.innerLabelPadding);\n balanceLabelNodes(labelNodes, markers, true, dimensions.outerRadius + dimensions.innerLabelPadding);\n }, [markers, pieData, dimensions]);\n\n return (\n <g className={styles.markers} aria-hidden=\"true\" ref={rootRef}>\n {markers.map(({ startX, startY, breakX, breakY, endX, endY, textX, textY, rightSide, datum }) => {\n const segment = datum.data.datum;\n const description = segmentDescription?.(segment, visibleDataSum);\n if ((hideTitles && !description) || (hideDescriptions && !segment.title)) {\n return null;\n }\n return (\n <g\n key={datum.data.index}\n className={clsx(styles.label, {\n [styles['label--highlighted']]: highlightedSegment === segment,\n [styles['label--dimmed']]: highlightedSegment !== null && highlightedSegment !== segment,\n [styles['label--align-right']]: !rightSide,\n })}\n >\n <line x1={startX} y1={startY} x2={breakX} y2={breakY} />\n <line x1={breakX} y1={breakY} x2={endX} y2={endY} className={styles['label-line']} />\n <LabelElement\n x={textX}\n y={textY}\n rightSide={rightSide}\n title={segment.title}\n description={description}\n hideTitles={hideTitles}\n hideDescriptions={hideDescriptions}\n containerBoundaries={containerBoundaries}\n />\n </g>\n );\n })}\n </g>\n );\n};\n\nfunction useElementBoundaries(ref: React.RefObject<HTMLElement>): { left: number; right: number } {\n const [state, setState] = useState({ left: 0, right: 0 });\n useResizeObserver(ref, entry => {\n const elementRect = entry.target.getBoundingClientRect();\n setState({ left: elementRect.left, right: elementRect.right });\n });\n return state;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"labels.js","sourceRoot":"","sources":["../../../src/pie-chart/labels.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,GAAG,EAAe,MAAM,UAAU,CAAC;AAE5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAIlF,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAa,MAAM,SAAS,CAAC;AAE1E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAwBrC,SAAS,YAAY,CAAC,EACpB,CAAC,EACD,CAAC,EACD,UAAU,EACV,gBAAgB,EAChB,SAAS,EACT,KAAK,EACL,WAAW,EACX,mBAAmB,GACD;IAClB,OAAO,CACL,2BAAG,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,EAAE,SAAS,EAAC,EAAE,YAAS,CAAC,YAAU,CAAC;QAClE,CAAC,UAAU,IAAI,CACd,oBAAC,cAAc,IAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,mBAAmB,EAAE,mBAAmB,IACvF,KAAK,CACS,CAClB;QACA,CAAC,gBAAgB,IAAI,WAAW,IAAI,CACnC,oBAAC,cAAc,IACb,CAAC,EAAE,CAAC,EACJ,CAAC,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EAC5B,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,MAAM,CAAC,kBAAkB,EACpC,mBAAmB,EAAE,mBAAmB,IAEvC,WAAW,CACG,CAClB,CACC,CACL,CAAC;AACJ,CAAC;AAED,eAAe,CAAgC,EAC7C,OAAO,EACP,UAAU,EACV,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,gBAAgB,EAChB,YAAY,GACG,EAAE,EAAE;IACnB,MAAM,mBAAmB,GAAG,oBAAoB,CAAC,YAAY,CAAC,CAAC;IAC/D,MAAM,oBAAoB,GACxB,mBAAmB,CAAC,KAAK,GAAG,mBAAmB,CAAC,IAAI,GAAG,CAAC,UAAU,CAAC,WAAW,GAAG,UAAU,CAAC,iBAAiB,CAAC,GAAG,CAAC;QAClH,GAAG,CAAC;IACN,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,iBAAiB,EAAE,GAAG,UAAU,CAAC;QAE9D,+CAA+C;QAC/C,MAAM,cAAc,GAAG,GAAG,EAAoB;aAC3C,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC;aACvB,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAE3B,MAAM,cAAc,GAAG,GAAG,EAAoB;aAC3C,WAAW,CAAC,MAAM,GAAG,iBAAiB,CAAC;aACvC,WAAW,CAAC,MAAM,GAAG,iBAAiB,CAAC,CAAC;QAE3C,OAAO,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;YAC9B,MAAM,UAAU,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;YAC9B,MAAM,UAAU,GAAG,iBAAiB,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,QAAQ,EAAE,oBAAoB,CAAC,CAAC;YAEvG,yFAAyF;YACzF,MAAM,aAAa,GAAG,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,GAAG,GAAG,CAAC;YAC3D,cAAc,CAAC,WAAW,CAAC,MAAM,GAAG,EAAE,GAAG,aAAa,CAAC,CAAC;YACxD,cAAc,CAAC,WAAW,CAAC,MAAM,GAAG,EAAE,GAAG,aAAa,CAAC,CAAC;YACxD,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,cAAc,CAAC,QAAQ,CAAC,EAAE,GAAG,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC,CAAC;YAC7G,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,cAAc,CAAC,QAAQ,CAAC,EAAE,GAAG,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC,CAAC;YAE7G,MAAM,SAAS,GAAG,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC;YACvC,MAAM,IAAI,GAAG,oBAAoB,CAAC,CAAC,CAAC,MAAM,GAAG,EAAE,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,EAAE,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC9G,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAE9C,OAAO;gBACL,MAAM;gBACN,MAAM;gBACN,MAAM;gBACN,MAAM;gBACN,IAAI;gBACJ,IAAI,EAAE,MAAM;gBACZ,KAAK;gBACL,KAAK,EAAE,MAAM;gBACb,SAAS;gBACT,KAAK;aACN,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,oBAAoB,CAAC,CAAC,CAAC;IAEhD,MAAM,OAAO,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAE1C,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;YACrB,OAAO;QACT,CAAC;QAED,oCAAoC;QACpC,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,CAAC,gBAAgB,CAAc,IAAI,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;QAC7F,iBAAiB,CAAC,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,WAAW,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;QACrG,iBAAiB,CAAC,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,CAAC,WAAW,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IACtG,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC;IAEnC,OAAO,CACL,2BAAG,SAAS,EAAE,MAAM,CAAC,OAAO,iBAAc,MAAM,EAAC,GAAG,EAAE,OAAO,IAC1D,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE;QAC9F,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC;QACjC,MAAM,WAAW,GAAG,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAG,OAAO,EAAE,cAAc,CAAC,CAAC;QAClE,IAAI,CAAC,UAAU,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,gBAAgB,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;YACzE,OAAO,IAAI,CAAC;QACd,CAAC;QACD,OAAO,CACL,2BACE,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK,EACrB,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE;gBAC5B,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,kBAAkB,KAAK,OAAO;gBAC9D,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,kBAAkB,KAAK,IAAI,IAAI,kBAAkB,KAAK,OAAO;gBACxF,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,CAAC,SAAS;aAC3C,CAAC;YAEF,8BAAM,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,GAAI;YACxD,8BAAM,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,GAAI;YACrF,oBAAC,YAAY,IACX,CAAC,EAAE,KAAK,EACR,CAAC,EAAE,KAAK,EACR,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,OAAO,CAAC,KAAK,EACpB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,gBAAgB,EAAE,gBAAgB,EAClC,mBAAmB,EAAE,mBAAmB,GACxC,CACA,CACL,CAAC;IACJ,CAAC,CAAC,CACA,CACL,CAAC;AACJ,CAAC,CAAC;AAEF,SAAS,oBAAoB,CAAC,GAAiC;IAC7D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;IAC1D,iBAAiB,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE;QAC7B,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,qBAAqB,EAAE,CAAC;QACzD,QAAQ,CAAC,EAAE,IAAI,EAAE,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC;IACjE,CAAC,CAAC,CAAC;IACH,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { arc, PieArcDatum } from 'd3-shape';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { PieChartProps } from './interfaces';\nimport { InternalChartDatum } from './pie-chart';\nimport ResponsiveText from './responsive-text';\nimport { balanceLabelNodes, computeSmartAngle, Dimension } from './utils';\n\nimport styles from './styles.css.js';\n\ninterface LabelsProps<T> {\n pieData: PieArcDatum<InternalChartDatum<T>>[];\n visibleDataSum: number;\n dimensions: Dimension;\n hideTitles: boolean;\n hideDescriptions: boolean;\n highlightedSegment: PieChartProps.Datum | null;\n segmentDescription?: PieChartProps.SegmentDescriptionFunction<T>;\n containerRef: React.RefObject<HTMLDivElement>;\n}\n\ninterface LabelElementProps {\n x: number;\n y: number;\n rightSide: boolean;\n hideTitles: boolean;\n hideDescriptions: boolean;\n title: PieChartProps.Datum['title'];\n description?: string;\n containerBoundaries: null | { left: number; right: number };\n}\n\nfunction LabelElement({\n x,\n y,\n hideTitles,\n hideDescriptions,\n rightSide,\n title,\n description,\n containerBoundaries,\n}: LabelElementProps) {\n return (\n <g className={styles['label-text']} transform=\"\" data-x={x} data-y={y}>\n {!hideTitles && (\n <ResponsiveText x={x} y={y} rightSide={rightSide} containerBoundaries={containerBoundaries}>\n {title}\n </ResponsiveText>\n )}\n {!hideDescriptions && description && (\n <ResponsiveText\n x={x}\n y={y + (hideTitles ? 0 : 18)}\n rightSide={rightSide}\n className={styles.label__description}\n containerBoundaries={containerBoundaries}\n >\n {description}\n </ResponsiveText>\n )}\n </g>\n );\n}\n\nexport default <T extends PieChartProps.Datum>({\n pieData,\n dimensions,\n highlightedSegment,\n segmentDescription,\n visibleDataSum,\n hideTitles,\n hideDescriptions,\n containerRef,\n}: LabelsProps<T>) => {\n const containerBoundaries = useElementBoundaries(containerRef);\n const shouldOptimizeLabels =\n containerBoundaries.right - containerBoundaries.left - (dimensions.outerRadius + dimensions.innerLabelPadding) * 2 <\n 300;\n const markers = useMemo(() => {\n const { outerRadius: radius, innerLabelPadding } = dimensions;\n\n // More arc factories for the label positioning\n const arcMarkerStart = arc<PieArcDatum<any>>()\n .innerRadius(radius - 1)\n .outerRadius(radius - 1);\n\n const arcMarkerBreak = arc<PieArcDatum<any>>()\n .innerRadius(radius + innerLabelPadding)\n .outerRadius(radius + innerLabelPadding);\n\n return pieData.map((datum, i) => {\n const labelDatum = pieData[i];\n const smartAngle = computeSmartAngle(labelDatum.startAngle, labelDatum.endAngle, shouldOptimizeLabels);\n\n // Make the marker line longer if the segment is closer to the top or bottom of the chart\n const lineExtension = 0.5 * Math.cos(2 * smartAngle) + 0.5;\n arcMarkerBreak.outerRadius(radius + 20 * lineExtension);\n arcMarkerBreak.innerRadius(radius + 20 * lineExtension);\n const [startX, startY] = arcMarkerStart.centroid({ ...datum, startAngle: smartAngle, endAngle: smartAngle });\n const [breakX, breakY] = arcMarkerBreak.centroid({ ...datum, startAngle: smartAngle, endAngle: smartAngle });\n\n const rightSide = smartAngle < Math.PI;\n const endX = shouldOptimizeLabels ? breakX + 20 * (rightSide ? 1 : -1) : (radius + 20) * (rightSide ? 1 : -1);\n const textX = endX + 5 * (rightSide ? 1 : -1);\n\n return {\n startX,\n startY,\n breakX,\n breakY,\n endX,\n endY: breakY,\n textX,\n textY: breakY,\n rightSide,\n datum,\n };\n });\n }, [pieData, dimensions, shouldOptimizeLabels]);\n\n const rootRef = useRef<SVGGElement>(null);\n\n useLayoutEffect(() => {\n if (!rootRef.current) {\n return;\n }\n\n // Relax labels that are overlapping\n const labelNodes = rootRef.current.querySelectorAll<SVGGElement>(`.${styles['label-text']}`);\n balanceLabelNodes(labelNodes, markers, false, dimensions.outerRadius + dimensions.innerLabelPadding);\n balanceLabelNodes(labelNodes, markers, true, dimensions.outerRadius + dimensions.innerLabelPadding);\n }, [markers, pieData, dimensions]);\n\n return (\n <g className={styles.markers} aria-hidden=\"true\" ref={rootRef}>\n {markers.map(({ startX, startY, breakX, breakY, endX, endY, textX, textY, rightSide, datum }) => {\n const segment = datum.data.datum;\n const description = segmentDescription?.(segment, visibleDataSum);\n if ((hideTitles && !description) || (hideDescriptions && !segment.title)) {\n return null;\n }\n return (\n <g\n key={datum.data.index}\n className={clsx(styles.label, {\n [styles['label--highlighted']]: highlightedSegment === segment,\n [styles['label--dimmed']]: highlightedSegment !== null && highlightedSegment !== segment,\n [styles['label--align-right']]: !rightSide,\n })}\n >\n <line x1={startX} y1={startY} x2={breakX} y2={breakY} />\n <line x1={breakX} y1={breakY} x2={endX} y2={endY} className={styles['label-line']} />\n <LabelElement\n x={textX}\n y={textY}\n rightSide={rightSide}\n title={segment.title}\n description={description}\n hideTitles={hideTitles}\n hideDescriptions={hideDescriptions}\n containerBoundaries={containerBoundaries}\n />\n </g>\n );\n })}\n </g>\n );\n};\n\nfunction useElementBoundaries(ref: React.RefObject<HTMLElement>): { left: number; right: number } {\n const [state, setState] = useState({ left: 0, right: 0 });\n useResizeObserver(ref, entry => {\n const elementRect = entry.target.getBoundingClientRect();\n setState({ left: elementRect.left, right: elementRect.right });\n });\n return state;\n}\n"]}
|
|
@@ -48,6 +48,6 @@ export default function Segments({ pieData, highlightedSegment, dimensions, vari
|
|
|
48
48
|
React.createElement("path", { d: arcPath, fill: datum.data.color, className: styles.segment__path, "aria-hidden": "true" }),
|
|
49
49
|
React.createElement("path", { d: highlightedPath, fill: datum.data.color, className: clsx(styles.segment__path, styles.segment__highlight), "aria-hidden": "true" })));
|
|
50
50
|
}),
|
|
51
|
-
React.createElement("circle",
|
|
51
|
+
React.createElement("circle", { ...centroid, ref: popoverTrackRef, r: "1", opacity: "0", "aria-hidden": "true" })));
|
|
52
52
|
}
|
|
53
53
|
//# sourceMappingURL=segments.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"segments.js","sourceRoot":"","sources":["../../../src/pie-chart/segments.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"segments.js","sourceRoot":"","sources":["../../../src/pie-chart/segments.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo } from 'react';\nimport clsx from 'clsx';\nimport { arc, PieArcDatum } from 'd3-shape';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { PieChartProps } from './interfaces';\nimport { InternalChartDatum } from './pie-chart';\nimport { Dimension } from './utils';\n\nimport styles from './styles.css.js';\n\ninterface SegmentsProps<T> {\n pieData: Array<PieArcDatum<InternalChartDatum<T>>>;\n highlightedSegment: T | null;\n dimensions: Dimension;\n variant: PieChartProps['variant'];\n focusedSegmentRef: React.RefObject<SVGGElement>;\n popoverTrackRef: React.RefObject<SVGCircleElement>;\n segmentAriaRoleDescription?: string;\n onMouseDown: (datum: InternalChartDatum<T>) => void;\n onMouseOver: (datum: InternalChartDatum<T>) => void;\n onTouchStart: () => void;\n}\n\nexport default function Segments<T extends PieChartProps.Datum>({\n pieData,\n highlightedSegment,\n dimensions,\n variant,\n focusedSegmentRef,\n popoverTrackRef,\n segmentAriaRoleDescription,\n onMouseDown,\n onMouseOver,\n onTouchStart,\n}: SegmentsProps<T>) {\n const i18n = useInternalI18n('pie-chart');\n\n const { arcFactory, highlightedArcFactory } = useMemo(() => {\n const radius = dimensions.outerRadius;\n const innerRadius = variant === 'pie' ? 0 : dimensions.innerRadius;\n const cornerRadius = dimensions.cornerRadius || 0;\n\n const arcFactory = arc<PieArcDatum<InternalChartDatum<any>>>()\n .innerRadius(innerRadius)\n .outerRadius(radius)\n .cornerRadius(cornerRadius);\n\n const highlightedArcFactory = arc<PieArcDatum<InternalChartDatum<any>>>()\n .innerRadius(radius + 4)\n .outerRadius(radius + 6);\n\n return {\n arcFactory,\n highlightedArcFactory,\n };\n }, [dimensions, variant]);\n\n const centroid = useMemo(() => {\n for (const datum of pieData) {\n if (datum.data.datum === highlightedSegment) {\n const [centroidLeft, centroidTop] = arcFactory.centroid(datum);\n return { cx: centroidLeft, cy: centroidTop };\n }\n }\n return null;\n }, [highlightedSegment, pieData, arcFactory]);\n\n return (\n <g>\n {pieData.map(datum => {\n const isHighlighted = highlightedSegment === datum.data.datum;\n const isDimmed = highlightedSegment !== null && !isHighlighted;\n const arcPath = arcFactory(datum) || undefined;\n const highlightedPath = highlightedArcFactory(datum) || undefined;\n return (\n <g\n key={datum.data.index}\n onTouchStart={() => onTouchStart()}\n onMouseDown={e => {\n onMouseDown(datum.data);\n e.preventDefault();\n }}\n onMouseOver={() => onMouseOver(datum.data)}\n className={clsx(styles.segment, {\n [styles['segment--highlighted']]: isHighlighted,\n [styles['segment--dimmed']]: isDimmed,\n })}\n ref={isHighlighted ? focusedSegmentRef : undefined}\n aria-label={`${datum.data.datum.title} (${datum.data.datum.value})`}\n role=\"button\"\n aria-roledescription={i18n('i18nStrings.segmentAriaRoleDescription', segmentAriaRoleDescription)}\n >\n <path d={arcPath} fill={datum.data.color} className={styles.segment__path} aria-hidden=\"true\" />\n <path\n d={highlightedPath}\n fill={datum.data.color}\n className={clsx(styles.segment__path, styles.segment__highlight)}\n aria-hidden=\"true\"\n />\n </g>\n );\n })}\n\n <circle {...centroid} ref={popoverTrackRef} r=\"1\" opacity=\"0\" aria-hidden=\"true\" />\n </g>\n );\n}\n"]}
|
|
@@ -28,9 +28,21 @@ export const dimensionsBySize = {
|
|
|
28
28
|
},
|
|
29
29
|
};
|
|
30
30
|
export const refreshDimensionsBySize = {
|
|
31
|
-
small:
|
|
32
|
-
|
|
33
|
-
|
|
31
|
+
small: {
|
|
32
|
+
...dimensionsBySize.small,
|
|
33
|
+
innerRadius: 38,
|
|
34
|
+
cornerRadius: 3,
|
|
35
|
+
},
|
|
36
|
+
medium: {
|
|
37
|
+
...dimensionsBySize.medium,
|
|
38
|
+
innerRadius: 75,
|
|
39
|
+
cornerRadius: 4,
|
|
40
|
+
},
|
|
41
|
+
large: {
|
|
42
|
+
...dimensionsBySize.large,
|
|
43
|
+
innerRadius: 105,
|
|
44
|
+
cornerRadius: 5,
|
|
45
|
+
},
|
|
34
46
|
};
|
|
35
47
|
/**
|
|
36
48
|
* When `size` is a string ("small", "medium" or "large") the predefined pie chart element dimensions for classic and visual refresh are used.
|
|
@@ -39,7 +51,7 @@ export const refreshDimensionsBySize = {
|
|
|
39
51
|
export function getDimensionsBySize({ size, hasLabels, visualRefresh, }) {
|
|
40
52
|
if (typeof size === 'string') {
|
|
41
53
|
const dimensions = visualRefresh ? refreshDimensionsBySize[size] : dimensionsBySize[size];
|
|
42
|
-
return
|
|
54
|
+
return { ...dimensions, size };
|
|
43
55
|
}
|
|
44
56
|
const sizeSpec = visualRefresh ? refreshDimensionsBySize : dimensionsBySize;
|
|
45
57
|
const getPixelSize = (d) => d.outerRadius * 2 + d.padding * 2 + (hasLabels ? d.paddingLabels : 0) * 2;
|
|
@@ -55,7 +67,7 @@ export function getDimensionsBySize({ size, hasLabels, visualRefresh, }) {
|
|
|
55
67
|
const radiiRatio = sizeSpec[matchedSize].outerRadius / sizeSpec[matchedSize].innerRadius;
|
|
56
68
|
const outerRadius = Math.max(minRadius, (size - 2 * paddingLabels - 2 * padding) / 2);
|
|
57
69
|
const innerRadius = outerRadius / radiiRatio;
|
|
58
|
-
return
|
|
70
|
+
return { ...sizeSpec[matchedSize], outerRadius, innerRadius, size: matchedSize };
|
|
59
71
|
}
|
|
60
72
|
export const defaultDetails = (i18n, i18nStrings) => (datum, dataSum) => [
|
|
61
73
|
{ key: i18n('i18nStrings.detailsValue', i18nStrings.detailsValue) || '', value: datum.value },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/pie-chart/utils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { ComponentFormatFunction } from '../i18n/context';\nimport { PieChartProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport interface Dimension {\n innerRadius: number;\n outerRadius: number;\n padding: number;\n paddingLabels: number;\n innerLabelPadding: number;\n cornerRadius?: number;\n}\n\nconst minRadius = 30;\nconst paddingLabels = 44; // = 2 * (size-lineHeight-body-100)\nconst defaultPadding = 12; // = space-s\nconst smallPadding = 8; // = space-xs\nexport const minLabelLineAngularPadding = Math.PI / 20;\n\nexport const dimensionsBySize: Record<NonNullable<PieChartProps['size']>, Dimension> = {\n small: {\n innerRadius: 33,\n outerRadius: 50,\n innerLabelPadding: smallPadding,\n padding: smallPadding,\n paddingLabels,\n },\n medium: {\n innerRadius: 66,\n outerRadius: 100,\n innerLabelPadding: defaultPadding,\n padding: defaultPadding,\n paddingLabels,\n },\n large: {\n innerRadius: 93,\n outerRadius: 140,\n innerLabelPadding: defaultPadding,\n padding: defaultPadding,\n paddingLabels,\n },\n};\n\nexport const refreshDimensionsBySize: Record<NonNullable<PieChartProps['size']>, Dimension> = {\n small: {\n ...dimensionsBySize.small,\n innerRadius: 38,\n cornerRadius: 3,\n },\n medium: {\n ...dimensionsBySize.medium,\n innerRadius: 75,\n cornerRadius: 4,\n },\n large: {\n ...dimensionsBySize.large,\n innerRadius: 105,\n cornerRadius: 5,\n },\n};\n\n/**\n * When `size` is a string (\"small\", \"medium\" or \"large\") the predefined pie chart element dimensions for classic and visual refresh are used.\n * When `size` is a number the outer and inner radii are computed and the rest of the dimensions are taken from the closest predefined size.\n */\nexport function getDimensionsBySize({\n size,\n hasLabels,\n visualRefresh,\n}: {\n size: NonNullable<PieChartProps['size']> | number;\n hasLabels: boolean;\n visualRefresh?: boolean;\n}): Dimension & { size: NonNullable<PieChartProps['size']> } {\n if (typeof size === 'string') {\n const dimensions = visualRefresh ? refreshDimensionsBySize[size] : dimensionsBySize[size];\n return { ...dimensions, size };\n }\n const sizeSpec = visualRefresh ? refreshDimensionsBySize : dimensionsBySize;\n const getPixelSize = (d: Dimension) => d.outerRadius * 2 + d.padding * 2 + (hasLabels ? d.paddingLabels : 0) * 2;\n\n let matchedSize: NonNullable<PieChartProps['size']> = 'small';\n if (size > getPixelSize(sizeSpec.medium)) {\n matchedSize = 'medium';\n }\n if (size > getPixelSize(sizeSpec.large)) {\n matchedSize = 'large';\n }\n\n const padding = sizeSpec[matchedSize].padding;\n const paddingLabels = hasLabels ? sizeSpec[matchedSize].paddingLabels : 0;\n const radiiRatio = sizeSpec[matchedSize].outerRadius / sizeSpec[matchedSize].innerRadius;\n const outerRadius = Math.max(minRadius, (size - 2 * paddingLabels - 2 * padding) / 2);\n const innerRadius = outerRadius / radiiRatio;\n\n return { ...sizeSpec[matchedSize], outerRadius, innerRadius, size: matchedSize };\n}\n\nexport const defaultDetails =\n (i18n: ComponentFormatFunction<'pie-chart'>, i18nStrings: PieChartProps.I18nStrings) =>\n (datum: PieChartProps.Datum, dataSum: number) => [\n { key: i18n('i18nStrings.detailsValue', i18nStrings.detailsValue) || '', value: datum.value },\n {\n key: i18n('i18nStrings.detailsPercentage', i18nStrings.detailsPercentage) || '',\n value: `${((datum.value * 100) / dataSum).toFixed(0)}%`,\n },\n ];\n\n/**\n * Adjusts the position of the given label nodes to avoid visual overlapping.\n * @param nodes List of label nodes of the entire chart (both left and right side)\n * @param markers Markers array that was calculated in <Labels>, but we just need the `endY` values\n * @param leftSide Boolean flag whether we are processing the left or right side of the chart labels\n */\nexport const balanceLabelNodes = (\n nodes: NodeListOf<SVGGElement>,\n markers: Array<{ endY: number; endX: number }>,\n leftSide: boolean,\n radius: number\n) => {\n const MARGIN = 10;\n\n let previousBBox: { x: number; y: number; height: number } | null = null;\n\n // When traversing the right side of labels, we start at the beginning of the array and go forwards.\n // For the left side, we need to traverse backwards from the end, so that overlapping nodes are pushed down in the right order.\n let i = leftSide ? nodes.length - 1 : 0;\n\n while ((leftSide && i >= 0) || (!leftSide && i < nodes.length)) {\n const node = nodes[i];\n\n const x = parseFloat(node.getAttribute('data-x') || '0');\n const y = parseFloat(node.getAttribute('data-y') || '0');\n const box = {\n x,\n y,\n height: node.getBoundingClientRect().height,\n };\n\n const marker = markers[i];\n\n if (leftSide) {\n i--;\n } else {\n i++;\n }\n\n if (!previousBBox) {\n previousBBox = box;\n node.setAttribute('transform', '');\n continue;\n }\n\n if ((!leftSide && box.x < 0) || (leftSide && box.x >= 0)) {\n // We have reached a label that is on the other side of the chart, so we're done.\n break;\n }\n\n node.setAttribute('transform', '');\n\n // Calculate how much the current node is overlapping with the previous one.\n const yOffset = previousBBox.y + previousBBox.height + MARGIN - box.y;\n\n if (yOffset > 0) {\n const xOffset = computeXOffset(box, yOffset, radius) * (leftSide ? -1 : 1);\n // Move the label down.\n node.setAttribute('transform', `translate(${xOffset} ${yOffset})`);\n\n // Adjust the attached line accordingly.\n const lineNode = node.parentNode?.querySelector(`.${styles['label-line']}`);\n if (lineNode) {\n const { endY, endX } = marker;\n lineNode.setAttribute('y2', '' + (endY + yOffset));\n lineNode.setAttribute('x2', '' + (endX + xOffset));\n }\n\n // Update the position accordingly to inform the next label\n box.y += yOffset;\n box.x += xOffset;\n }\n\n previousBBox = box;\n }\n};\n\nconst squareDistance = (edge: [number, number]): number => Math.pow(edge[0], 2) + Math.pow(edge[1], 2);\n\nconst computeXOffset = (box: { x: number; y: number; height: number }, yOffset: number, radius: number): number => {\n const upperEdge: [number, number] = [box.x, box.y + yOffset];\n const lowerEdge: [number, number] = [box.x, box.y + box.height + yOffset];\n const closestEdge = squareDistance(upperEdge) < squareDistance(lowerEdge) ? upperEdge : lowerEdge;\n\n if (squareDistance(closestEdge) < Math.pow(radius, 2)) {\n return Math.sqrt(Math.pow(radius, 2) - Math.pow(closestEdge[1], 2)) - Math.abs(closestEdge[0]);\n }\n return 0;\n};\n\nexport const computeSmartAngle = (startAngle: number, endAngle: number, optimize = false): number => {\n if (!optimize || endAngle - startAngle < 2 * minLabelLineAngularPadding) {\n return (endAngle + startAngle) / 2;\n }\n const paddedStartAngle = startAngle + minLabelLineAngularPadding;\n const paddedEndAngle = endAngle - minLabelLineAngularPadding;\n if (paddedStartAngle < 0 && paddedEndAngle > 0) {\n return 0;\n }\n if (paddedStartAngle < Math.PI && paddedEndAngle > Math.PI) {\n return Math.PI;\n }\n\n const endAngleMinDistance = Math.min(\n paddedEndAngle,\n Math.abs(Math.PI - paddedEndAngle),\n 2 * Math.PI - paddedEndAngle\n );\n const startAngleMinDistance = Math.min(\n paddedStartAngle,\n Math.abs(Math.PI - paddedStartAngle),\n 2 * Math.PI - paddedStartAngle\n );\n if (endAngleMinDistance < startAngleMinDistance) {\n return paddedEndAngle;\n }\n return paddedStartAngle;\n};\n"]}
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/pie-chart/utils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { ComponentFormatFunction } from '../i18n/context';\nimport { PieChartProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport interface Dimension {\n innerRadius: number;\n outerRadius: number;\n padding: number;\n paddingLabels: number;\n innerLabelPadding: number;\n cornerRadius?: number;\n}\n\nconst minRadius = 30;\nconst paddingLabels = 44; // = 2 * (size-lineHeight-body-100)\nconst defaultPadding = 12; // = space-s\nconst smallPadding = 8; // = space-xs\nexport const minLabelLineAngularPadding = Math.PI / 20;\n\nexport const dimensionsBySize: Record<NonNullable<PieChartProps['size']>, Dimension> = {\n small: {\n innerRadius: 33,\n outerRadius: 50,\n innerLabelPadding: smallPadding,\n padding: smallPadding,\n paddingLabels,\n },\n medium: {\n innerRadius: 66,\n outerRadius: 100,\n innerLabelPadding: defaultPadding,\n padding: defaultPadding,\n paddingLabels,\n },\n large: {\n innerRadius: 93,\n outerRadius: 140,\n innerLabelPadding: defaultPadding,\n padding: defaultPadding,\n paddingLabels,\n },\n};\n\nexport const refreshDimensionsBySize: Record<NonNullable<PieChartProps['size']>, Dimension> = {\n small: {\n ...dimensionsBySize.small,\n innerRadius: 38,\n cornerRadius: 3,\n },\n medium: {\n ...dimensionsBySize.medium,\n innerRadius: 75,\n cornerRadius: 4,\n },\n large: {\n ...dimensionsBySize.large,\n innerRadius: 105,\n cornerRadius: 5,\n },\n};\n\n/**\n * When `size` is a string (\"small\", \"medium\" or \"large\") the predefined pie chart element dimensions for classic and visual refresh are used.\n * When `size` is a number the outer and inner radii are computed and the rest of the dimensions are taken from the closest predefined size.\n */\nexport function getDimensionsBySize({\n size,\n hasLabels,\n visualRefresh,\n}: {\n size: NonNullable<PieChartProps['size']> | number;\n hasLabels: boolean;\n visualRefresh?: boolean;\n}): Dimension & { size: NonNullable<PieChartProps['size']> } {\n if (typeof size === 'string') {\n const dimensions = visualRefresh ? refreshDimensionsBySize[size] : dimensionsBySize[size];\n return { ...dimensions, size };\n }\n const sizeSpec = visualRefresh ? refreshDimensionsBySize : dimensionsBySize;\n const getPixelSize = (d: Dimension) => d.outerRadius * 2 + d.padding * 2 + (hasLabels ? d.paddingLabels : 0) * 2;\n\n let matchedSize: NonNullable<PieChartProps['size']> = 'small';\n if (size > getPixelSize(sizeSpec.medium)) {\n matchedSize = 'medium';\n }\n if (size > getPixelSize(sizeSpec.large)) {\n matchedSize = 'large';\n }\n\n const padding = sizeSpec[matchedSize].padding;\n const paddingLabels = hasLabels ? sizeSpec[matchedSize].paddingLabels : 0;\n const radiiRatio = sizeSpec[matchedSize].outerRadius / sizeSpec[matchedSize].innerRadius;\n const outerRadius = Math.max(minRadius, (size - 2 * paddingLabels - 2 * padding) / 2);\n const innerRadius = outerRadius / radiiRatio;\n\n return { ...sizeSpec[matchedSize], outerRadius, innerRadius, size: matchedSize };\n}\n\nexport const defaultDetails =\n (i18n: ComponentFormatFunction<'pie-chart'>, i18nStrings: PieChartProps.I18nStrings) =>\n (datum: PieChartProps.Datum, dataSum: number) => [\n { key: i18n('i18nStrings.detailsValue', i18nStrings.detailsValue) || '', value: datum.value },\n {\n key: i18n('i18nStrings.detailsPercentage', i18nStrings.detailsPercentage) || '',\n value: `${((datum.value * 100) / dataSum).toFixed(0)}%`,\n },\n ];\n\n/**\n * Adjusts the position of the given label nodes to avoid visual overlapping.\n * @param nodes List of label nodes of the entire chart (both left and right side)\n * @param markers Markers array that was calculated in <Labels>, but we just need the `endY` values\n * @param leftSide Boolean flag whether we are processing the left or right side of the chart labels\n */\nexport const balanceLabelNodes = (\n nodes: NodeListOf<SVGGElement>,\n markers: Array<{ endY: number; endX: number }>,\n leftSide: boolean,\n radius: number\n) => {\n const MARGIN = 10;\n\n let previousBBox: { x: number; y: number; height: number } | null = null;\n\n // When traversing the right side of labels, we start at the beginning of the array and go forwards.\n // For the left side, we need to traverse backwards from the end, so that overlapping nodes are pushed down in the right order.\n let i = leftSide ? nodes.length - 1 : 0;\n\n while ((leftSide && i >= 0) || (!leftSide && i < nodes.length)) {\n const node = nodes[i];\n\n const x = parseFloat(node.getAttribute('data-x') || '0');\n const y = parseFloat(node.getAttribute('data-y') || '0');\n const box = {\n x,\n y,\n height: node.getBoundingClientRect().height,\n };\n\n const marker = markers[i];\n\n if (leftSide) {\n i--;\n } else {\n i++;\n }\n\n if (!previousBBox) {\n previousBBox = box;\n node.setAttribute('transform', '');\n continue;\n }\n\n if ((!leftSide && box.x < 0) || (leftSide && box.x >= 0)) {\n // We have reached a label that is on the other side of the chart, so we're done.\n break;\n }\n\n node.setAttribute('transform', '');\n\n // Calculate how much the current node is overlapping with the previous one.\n const yOffset = previousBBox.y + previousBBox.height + MARGIN - box.y;\n\n if (yOffset > 0) {\n const xOffset = computeXOffset(box, yOffset, radius) * (leftSide ? -1 : 1);\n // Move the label down.\n node.setAttribute('transform', `translate(${xOffset} ${yOffset})`);\n\n // Adjust the attached line accordingly.\n const lineNode = node.parentNode?.querySelector(`.${styles['label-line']}`);\n if (lineNode) {\n const { endY, endX } = marker;\n lineNode.setAttribute('y2', '' + (endY + yOffset));\n lineNode.setAttribute('x2', '' + (endX + xOffset));\n }\n\n // Update the position accordingly to inform the next label\n box.y += yOffset;\n box.x += xOffset;\n }\n\n previousBBox = box;\n }\n};\n\nconst squareDistance = (edge: [number, number]): number => Math.pow(edge[0], 2) + Math.pow(edge[1], 2);\n\nconst computeXOffset = (box: { x: number; y: number; height: number }, yOffset: number, radius: number): number => {\n const upperEdge: [number, number] = [box.x, box.y + yOffset];\n const lowerEdge: [number, number] = [box.x, box.y + box.height + yOffset];\n const closestEdge = squareDistance(upperEdge) < squareDistance(lowerEdge) ? upperEdge : lowerEdge;\n\n if (squareDistance(closestEdge) < Math.pow(radius, 2)) {\n return Math.sqrt(Math.pow(radius, 2) - Math.pow(closestEdge[1], 2)) - Math.abs(closestEdge[0]);\n }\n return 0;\n};\n\nexport const computeSmartAngle = (startAngle: number, endAngle: number, optimize = false): number => {\n if (!optimize || endAngle - startAngle < 2 * minLabelLineAngularPadding) {\n return (endAngle + startAngle) / 2;\n }\n const paddedStartAngle = startAngle + minLabelLineAngularPadding;\n const paddedEndAngle = endAngle - minLabelLineAngularPadding;\n if (paddedStartAngle < 0 && paddedEndAngle > 0) {\n return 0;\n }\n if (paddedStartAngle < Math.PI && paddedEndAngle > Math.PI) {\n return Math.PI;\n }\n\n const endAngleMinDistance = Math.min(\n paddedEndAngle,\n Math.abs(Math.PI - paddedEndAngle),\n 2 * Math.PI - paddedEndAngle\n );\n const startAngleMinDistance = Math.min(\n paddedStartAngle,\n Math.abs(Math.PI - paddedStartAngle),\n 2 * Math.PI - paddedStartAngle\n );\n if (endAngleMinDistance < startAngleMinDistance) {\n return paddedEndAngle;\n }\n return paddedStartAngle;\n};\n"]}
|
|
@@ -30,7 +30,7 @@ export default function PopoverBody({ dismissButton: showDismissButton, dismissA
|
|
|
30
30
|
}
|
|
31
31
|
dismissButtonFocused.current = showDismissButton;
|
|
32
32
|
}, [showDismissButton]);
|
|
33
|
-
const dismissButton = (showDismissButton !== null && showDismissButton !== void 0 ? showDismissButton : null) && (React.createElement("div",
|
|
33
|
+
const dismissButton = (showDismissButton !== null && showDismissButton !== void 0 ? showDismissButton : null) && (React.createElement("div", { className: styles.dismiss, ...(closeAnalyticsAction ? getAnalyticsMetadataAttribute({ action: closeAnalyticsAction }) : {}) },
|
|
34
34
|
React.createElement(InternalButton, { variant: "icon", formAction: "none", iconName: "close", className: styles['dismiss-control'], ariaLabel: i18n('dismissAriaLabel', dismissAriaLabel), onClick: () => onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss(), ref: dismissButtonRef })));
|
|
35
35
|
const isDialog = showDismissButton;
|
|
36
36
|
const shouldTrapFocus = showDismissButton && variant !== 'annotation';
|
|
@@ -40,9 +40,9 @@ export default function PopoverBody({ dismissButton: showDismissButton, dismissA
|
|
|
40
40
|
'aria-labelledby': ariaLabelledby !== null && ariaLabelledby !== void 0 ? ariaLabelledby : (header ? labelledById : undefined),
|
|
41
41
|
}
|
|
42
42
|
: {};
|
|
43
|
-
return (React.createElement("div",
|
|
43
|
+
return (React.createElement("div", { className: clsx(styles.body, styles[`body-variant-${variant}`], className, {
|
|
44
44
|
[styles['body-overflow-visible']]: overflowVisible === 'both',
|
|
45
|
-
}), onKeyDown: onKeyDown
|
|
45
|
+
}), onKeyDown: onKeyDown, ...dialogProps },
|
|
46
46
|
React.createElement(FocusLock, { disabled: !shouldTrapFocus, autoFocus: false },
|
|
47
47
|
header && (React.createElement("div", { className: clsx(styles['header-row'], showDismissButton && styles['has-dismiss']) },
|
|
48
48
|
dismissButton,
|