@neo4j-ndl/react 4.20.1 → 4.21.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/_common/export-stories-utils.js +1 -1
- package/lib/cjs/_common/export-stories-utils.js.map +1 -1
- package/lib/cjs/_common/utils.js +3 -3
- package/lib/cjs/_common/utils.js.map +1 -1
- package/lib/cjs/_generated/style-rules/color-utils.js +3 -0
- package/lib/cjs/_generated/style-rules/color-utils.js.map +1 -1
- package/lib/cjs/_generated/style-rules/date-utils.js +14 -13
- package/lib/cjs/_generated/style-rules/date-utils.js.map +1 -1
- package/lib/cjs/_generated/style-rules/literal-schemas.js +5 -3
- package/lib/cjs/_generated/style-rules/literal-schemas.js.map +1 -1
- package/lib/cjs/ai/code-preview/CodePreview.js +1 -1
- package/lib/cjs/ai/code-preview/CodePreview.js.map +1 -1
- package/lib/cjs/ai/file-tag/FileTag.js.map +1 -1
- package/lib/cjs/ai/image-tag/ImageTag.js.map +1 -1
- package/lib/cjs/ai/prompt/Prompt.js +10 -10
- package/lib/cjs/ai/prompt/Prompt.js.map +1 -1
- package/lib/cjs/ai/prompt/stories/prompt-advanced.story.js +1 -1
- package/lib/cjs/ai/prompt/stories/prompt-advanced.story.js.map +1 -1
- package/lib/cjs/ai/prompt/stories/prompt-context.story.js +1 -1
- package/lib/cjs/ai/prompt/stories/prompt-context.story.js.map +1 -1
- package/lib/cjs/ai/prompt/stories/prompt-default.story.js +1 -1
- package/lib/cjs/ai/prompt/stories/prompt-default.story.js.map +1 -1
- package/lib/cjs/ai/prompt/stories/prompt-header.story.js +1 -1
- package/lib/cjs/ai/prompt/stories/prompt-header.story.js.map +1 -1
- package/lib/cjs/ai/response/Response.js +4 -4
- package/lib/cjs/ai/response/Response.js.map +1 -1
- package/lib/cjs/ai/response/stories/response-full-example.story.js +1 -1
- package/lib/cjs/ai/response/stories/response-full-example.story.js.map +1 -1
- package/lib/cjs/ai/suggestion/Suggestion.js.map +1 -1
- package/lib/cjs/ai/thinking/thinking-duration-formatter.js +5 -5
- package/lib/cjs/ai/thinking/thinking-duration-formatter.js.map +1 -1
- package/lib/cjs/banner/Banner.js +2 -2
- package/lib/cjs/banner/Banner.js.map +1 -1
- package/lib/cjs/button/ButtonBase.js +4 -4
- package/lib/cjs/button/ButtonBase.js.map +1 -1
- package/lib/cjs/code/Code.js +3 -3
- package/lib/cjs/code/Code.js.map +1 -1
- package/lib/cjs/code-block/CodeBlock.js +2 -2
- package/lib/cjs/code-block/CodeBlock.js.map +1 -1
- package/lib/cjs/color-picker/ColorPicker.js +22 -22
- package/lib/cjs/color-picker/ColorPicker.js.map +1 -1
- package/lib/cjs/color-picker/stories/color-picker-custom-swatches.story.js +20 -20
- package/lib/cjs/color-picker/stories/color-picker-custom-swatches.story.js.map +1 -1
- package/lib/cjs/color-picker/stories/color-picker-default.story.js +4 -4
- package/lib/cjs/color-picker/stories/color-picker-default.story.js.map +1 -1
- package/lib/cjs/color-picker/stories/color-picker-dialog.story.js +4 -4
- package/lib/cjs/color-picker/stories/color-picker-dialog.story.js.map +1 -1
- package/lib/cjs/color-picker/stories/color-picker-without-eyedropper.story.js +4 -4
- package/lib/cjs/color-picker/stories/color-picker-without-eyedropper.story.js.map +1 -1
- package/lib/cjs/combobox/stories/combobox-large-data-set.story.js +1 -1
- package/lib/cjs/combobox/stories/combobox-large-data-set.story.js.map +1 -1
- package/lib/cjs/data-grid/Components.js +20 -20
- package/lib/cjs/data-grid/Components.js.map +1 -1
- package/lib/cjs/data-grid/DataGrid.js +3 -3
- package/lib/cjs/data-grid/DataGrid.js.map +1 -1
- package/lib/cjs/data-grid/data-grid-nav/data-grid-nav.js +55 -54
- package/lib/cjs/data-grid/data-grid-nav/data-grid-nav.js.map +1 -1
- package/lib/cjs/data-grid/data-grid-nav/helpers.js +1 -1
- package/lib/cjs/data-grid/data-grid-nav/helpers.js.map +1 -1
- package/lib/cjs/data-grid/data-grid-nav/index.js +2 -2
- package/lib/cjs/data-grid/data-grid-nav/index.js.map +1 -1
- package/lib/cjs/data-grid/helpers/index.js +42 -40
- package/lib/cjs/data-grid/helpers/index.js.map +1 -1
- package/lib/cjs/data-grid/stories/datagrid-in-dialog.story.js +10 -7
- package/lib/cjs/data-grid/stories/datagrid-in-dialog.story.js.map +1 -1
- package/lib/cjs/data-grid/stories/datagrid-keyboard-navigation.story.js +10 -7
- package/lib/cjs/data-grid/stories/datagrid-keyboard-navigation.story.js.map +1 -1
- package/lib/cjs/data-grid/stories/datagrid-rule-based-styling-datetime.story.js +5 -5
- package/lib/cjs/data-grid/stories/datagrid-rule-based-styling-datetime.story.js.map +1 -1
- package/lib/cjs/data-grid/stories/datagrid-search-and-filters.stories.js +1 -1
- package/lib/cjs/data-grid/stories/datagrid-search-and-filters.stories.js.map +1 -1
- package/lib/cjs/data-grid/stories/datagrid-virtualization.story.js +5 -5
- package/lib/cjs/data-grid/stories/datagrid-virtualization.story.js.map +1 -1
- package/lib/cjs/data-grid/style-rules/evaluate.js +23 -23
- package/lib/cjs/data-grid/style-rules/evaluate.js.map +1 -1
- package/lib/cjs/data-grid/style-rules/types.js +1 -1
- package/lib/cjs/data-grid/style-rules/types.js.map +1 -1
- package/lib/cjs/dialog/Dialog.js +5 -5
- package/lib/cjs/dialog/Dialog.js.map +1 -1
- package/lib/cjs/dialog/dialog-types.js.map +1 -1
- package/lib/cjs/drawer/Drawer.js +5 -5
- package/lib/cjs/drawer/Drawer.js.map +1 -1
- package/lib/cjs/dropdown-button/DropdownButton.js +4 -4
- package/lib/cjs/dropdown-button/DropdownButton.js.map +1 -1
- package/lib/cjs/dropzone/stories/dropzone-full.story.js +1 -1
- package/lib/cjs/dropzone/stories/dropzone-full.story.js.map +1 -1
- package/lib/cjs/flex/stories/flex-default.story.js +1 -1
- package/lib/cjs/flex/stories/flex-default.story.js.map +1 -1
- package/lib/cjs/hooks/index.js +3 -3
- package/lib/cjs/hooks/index.js.map +1 -1
- package/lib/cjs/icon-button-base/IconButtonBase.js +4 -4
- package/lib/cjs/icon-button-base/IconButtonBase.js.map +1 -1
- package/lib/cjs/icons/generated/custom/ScatterPlot.js +30 -0
- package/lib/cjs/icons/generated/custom/ScatterPlot.js.map +1 -0
- package/lib/cjs/icons/generated/custom/index.js +4 -2
- package/lib/cjs/icons/generated/custom/index.js.map +1 -1
- package/lib/cjs/inline-edit/InlineEdit.js +8 -8
- package/lib/cjs/inline-edit/InlineEdit.js.map +1 -1
- package/lib/cjs/kbd/kbd-utils.js +2 -2
- package/lib/cjs/kbd/kbd-utils.js.map +1 -1
- package/lib/cjs/modal/Modal.js +6 -6
- package/lib/cjs/modal/Modal.js.map +1 -1
- package/lib/cjs/next/tree-view/TreeView.js +23 -23
- package/lib/cjs/next/tree-view/TreeView.js.map +1 -1
- package/lib/cjs/next/tree-view/stories/tree-view-lazy.story.js +1 -1
- package/lib/cjs/next/tree-view/stories/tree-view-lazy.story.js.map +1 -1
- package/lib/cjs/next/tree-view/stories/tree-view-multi.story.js +6 -6
- package/lib/cjs/next/tree-view/stories/tree-view-multi.story.js.map +1 -1
- package/lib/cjs/popover/Popover.js.map +1 -1
- package/lib/cjs/popover/stories/popover-custom-offset.story.js +3 -3
- package/lib/cjs/popover/stories/popover-custom-offset.story.js.map +1 -1
- package/lib/cjs/popover/use-popover.js +2 -0
- package/lib/cjs/popover/use-popover.js.map +1 -1
- package/lib/cjs/segmented-control/SegmentedControl.js.map +1 -1
- package/lib/cjs/select/Overrides.js +30 -30
- package/lib/cjs/select/Overrides.js.map +1 -1
- package/lib/cjs/select-icon-button/SelectIconButton.js +4 -4
- package/lib/cjs/select-icon-button/SelectIconButton.js.map +1 -1
- package/lib/cjs/selectable-tag/stories/selectable-tag-sizes.story.js +1 -1
- package/lib/cjs/selectable-tag/stories/selectable-tag-sizes.story.js.map +1 -1
- package/lib/cjs/side-navigation/SideNavigation.js +9 -9
- package/lib/cjs/side-navigation/SideNavigation.js.map +1 -1
- package/lib/cjs/slider/Slider.js +1 -1
- package/lib/cjs/slider/Slider.js.map +1 -1
- package/lib/cjs/slider/stories/slider-single-controlled.story.js +2 -2
- package/lib/cjs/slider/stories/slider-single-controlled.story.js.map +1 -1
- package/lib/cjs/spotlight/Spotlight.js +6 -6
- package/lib/cjs/spotlight/Spotlight.js.map +1 -1
- package/lib/cjs/spotlight/SpotlightProvider.js +6 -6
- package/lib/cjs/spotlight/SpotlightProvider.js.map +1 -1
- package/lib/cjs/spotlight/SpotlightTarget.js +18 -16
- package/lib/cjs/spotlight/SpotlightTarget.js.map +1 -1
- package/lib/cjs/status-indicator/StatusIndicator.js +4 -2
- package/lib/cjs/status-indicator/StatusIndicator.js.map +1 -1
- package/lib/cjs/tabs/Tabs.js +3 -3
- package/lib/cjs/tabs/Tabs.js.map +1 -1
- package/lib/cjs/tabs/use-tabs-scroll-overflow.js +2 -2
- package/lib/cjs/tabs/use-tabs-scroll-overflow.js.map +1 -1
- package/lib/cjs/text-input/stories/text-input-full.story.js +1 -1
- package/lib/cjs/text-input/stories/text-input-full.story.js.map +1 -1
- package/lib/cjs/text-input/stories/text-input-with-icons.story.js +1 -1
- package/lib/cjs/text-input/stories/text-input-with-icons.story.js.map +1 -1
- package/lib/cjs/theme/agnostic.js +4 -4
- package/lib/cjs/theme/agnostic.js.map +1 -1
- package/lib/cjs/time-picker/TimePicker.js +24 -24
- package/lib/cjs/time-picker/TimePicker.js.map +1 -1
- package/lib/cjs/time-picker/generate-time-options.js +3 -3
- package/lib/cjs/time-picker/generate-time-options.js.map +1 -1
- package/lib/cjs/timezone-picker/TimeZonePicker.js +44 -44
- package/lib/cjs/timezone-picker/TimeZonePicker.js.map +1 -1
- package/lib/cjs/timezone-picker/generate-timezone-options.js +5 -5
- package/lib/cjs/timezone-picker/generate-timezone-options.js.map +1 -1
- package/lib/cjs/toast/ToastControlled.js +1 -1
- package/lib/cjs/toast/ToastControlled.js.map +1 -1
- package/lib/cjs/tooltip/use-tooltip.js +8 -1
- package/lib/cjs/tooltip/use-tooltip.js.map +1 -1
- package/lib/cjs/tree-view/TreeItemWrapper.js +8 -8
- package/lib/cjs/tree-view/TreeItemWrapper.js.map +1 -1
- package/lib/cjs/tree-view/TreeView.js +6 -2
- package/lib/cjs/tree-view/TreeView.js.map +1 -1
- package/lib/cjs/tree-view/TreeViewTextItem.js +17 -17
- package/lib/cjs/tree-view/TreeViewTextItem.js.map +1 -1
- package/lib/cjs/tree-view/tree-view-keyboard-coordinates.js +2 -0
- package/lib/cjs/tree-view/tree-view-keyboard-coordinates.js.map +1 -1
- package/lib/cjs/tree-view/tree-view-utils.js +12 -12
- package/lib/cjs/tree-view/tree-view-utils.js.map +1 -1
- package/lib/esm/_common/export-stories-utils.js +1 -1
- package/lib/esm/_common/export-stories-utils.js.map +1 -1
- package/lib/esm/_common/utils.js +3 -3
- package/lib/esm/_common/utils.js.map +1 -1
- package/lib/esm/_generated/style-rules/color-utils.js +3 -0
- package/lib/esm/_generated/style-rules/color-utils.js.map +1 -1
- package/lib/esm/_generated/style-rules/date-utils.js +14 -13
- package/lib/esm/_generated/style-rules/date-utils.js.map +1 -1
- package/lib/esm/_generated/style-rules/literal-schemas.js +5 -3
- package/lib/esm/_generated/style-rules/literal-schemas.js.map +1 -1
- package/lib/esm/ai/code-preview/CodePreview.js +1 -1
- package/lib/esm/ai/code-preview/CodePreview.js.map +1 -1
- package/lib/esm/ai/file-tag/FileTag.js.map +1 -1
- package/lib/esm/ai/image-tag/ImageTag.js.map +1 -1
- package/lib/esm/ai/prompt/Prompt.js +10 -10
- package/lib/esm/ai/prompt/Prompt.js.map +1 -1
- package/lib/esm/ai/prompt/stories/prompt-advanced.story.js +1 -1
- package/lib/esm/ai/prompt/stories/prompt-advanced.story.js.map +1 -1
- package/lib/esm/ai/prompt/stories/prompt-context.story.js +1 -1
- package/lib/esm/ai/prompt/stories/prompt-context.story.js.map +1 -1
- package/lib/esm/ai/prompt/stories/prompt-default.story.js +1 -1
- package/lib/esm/ai/prompt/stories/prompt-default.story.js.map +1 -1
- package/lib/esm/ai/prompt/stories/prompt-header.story.js +1 -1
- package/lib/esm/ai/prompt/stories/prompt-header.story.js.map +1 -1
- package/lib/esm/ai/response/Response.js +4 -4
- package/lib/esm/ai/response/Response.js.map +1 -1
- package/lib/esm/ai/response/stories/response-full-example.story.js +1 -1
- package/lib/esm/ai/response/stories/response-full-example.story.js.map +1 -1
- package/lib/esm/ai/suggestion/Suggestion.js.map +1 -1
- package/lib/esm/ai/thinking/thinking-duration-formatter.js +5 -5
- package/lib/esm/ai/thinking/thinking-duration-formatter.js.map +1 -1
- package/lib/esm/banner/Banner.js +2 -2
- package/lib/esm/banner/Banner.js.map +1 -1
- package/lib/esm/button/ButtonBase.js +4 -4
- package/lib/esm/button/ButtonBase.js.map +1 -1
- package/lib/esm/code/Code.js +3 -3
- package/lib/esm/code/Code.js.map +1 -1
- package/lib/esm/code-block/CodeBlock.js +2 -2
- package/lib/esm/code-block/CodeBlock.js.map +1 -1
- package/lib/esm/color-picker/ColorPicker.js +22 -22
- package/lib/esm/color-picker/ColorPicker.js.map +1 -1
- package/lib/esm/color-picker/stories/color-picker-custom-swatches.story.js +20 -20
- package/lib/esm/color-picker/stories/color-picker-custom-swatches.story.js.map +1 -1
- package/lib/esm/color-picker/stories/color-picker-default.story.js +4 -4
- package/lib/esm/color-picker/stories/color-picker-default.story.js.map +1 -1
- package/lib/esm/color-picker/stories/color-picker-dialog.story.js +4 -4
- package/lib/esm/color-picker/stories/color-picker-dialog.story.js.map +1 -1
- package/lib/esm/color-picker/stories/color-picker-without-eyedropper.story.js +4 -4
- package/lib/esm/color-picker/stories/color-picker-without-eyedropper.story.js.map +1 -1
- package/lib/esm/combobox/stories/combobox-large-data-set.story.js +1 -1
- package/lib/esm/combobox/stories/combobox-large-data-set.story.js.map +1 -1
- package/lib/esm/data-grid/Components.js +20 -20
- package/lib/esm/data-grid/Components.js.map +1 -1
- package/lib/esm/data-grid/DataGrid.js +3 -3
- package/lib/esm/data-grid/DataGrid.js.map +1 -1
- package/lib/esm/data-grid/data-grid-nav/data-grid-nav.js +55 -54
- package/lib/esm/data-grid/data-grid-nav/data-grid-nav.js.map +1 -1
- package/lib/esm/data-grid/data-grid-nav/helpers.js +1 -1
- package/lib/esm/data-grid/data-grid-nav/helpers.js.map +1 -1
- package/lib/esm/data-grid/data-grid-nav/index.js +2 -2
- package/lib/esm/data-grid/data-grid-nav/index.js.map +1 -1
- package/lib/esm/data-grid/helpers/index.js +42 -40
- package/lib/esm/data-grid/helpers/index.js.map +1 -1
- package/lib/esm/data-grid/stories/datagrid-in-dialog.story.js +10 -7
- package/lib/esm/data-grid/stories/datagrid-in-dialog.story.js.map +1 -1
- package/lib/esm/data-grid/stories/datagrid-keyboard-navigation.story.js +10 -7
- package/lib/esm/data-grid/stories/datagrid-keyboard-navigation.story.js.map +1 -1
- package/lib/esm/data-grid/stories/datagrid-rule-based-styling-datetime.story.js +5 -5
- package/lib/esm/data-grid/stories/datagrid-rule-based-styling-datetime.story.js.map +1 -1
- package/lib/esm/data-grid/stories/datagrid-search-and-filters.stories.js +1 -1
- package/lib/esm/data-grid/stories/datagrid-search-and-filters.stories.js.map +1 -1
- package/lib/esm/data-grid/stories/datagrid-virtualization.story.js +5 -5
- package/lib/esm/data-grid/stories/datagrid-virtualization.story.js.map +1 -1
- package/lib/esm/data-grid/style-rules/evaluate.js +23 -23
- package/lib/esm/data-grid/style-rules/evaluate.js.map +1 -1
- package/lib/esm/data-grid/style-rules/types.js +1 -1
- package/lib/esm/data-grid/style-rules/types.js.map +1 -1
- package/lib/esm/dialog/Dialog.js +5 -5
- package/lib/esm/dialog/Dialog.js.map +1 -1
- package/lib/esm/dialog/dialog-types.js.map +1 -1
- package/lib/esm/drawer/Drawer.js +5 -5
- package/lib/esm/drawer/Drawer.js.map +1 -1
- package/lib/esm/dropdown-button/DropdownButton.js +4 -4
- package/lib/esm/dropdown-button/DropdownButton.js.map +1 -1
- package/lib/esm/dropzone/stories/dropzone-full.story.js +1 -1
- package/lib/esm/dropzone/stories/dropzone-full.story.js.map +1 -1
- package/lib/esm/flex/stories/flex-default.story.js +1 -1
- package/lib/esm/flex/stories/flex-default.story.js.map +1 -1
- package/lib/esm/hooks/index.js +3 -3
- package/lib/esm/hooks/index.js.map +1 -1
- package/lib/esm/icon-button-base/IconButtonBase.js +4 -4
- package/lib/esm/icon-button-base/IconButtonBase.js.map +1 -1
- package/lib/esm/icons/generated/custom/ScatterPlot.js +28 -0
- package/lib/esm/icons/generated/custom/ScatterPlot.js.map +1 -0
- package/lib/esm/icons/generated/custom/index.js +1 -0
- package/lib/esm/icons/generated/custom/index.js.map +1 -1
- package/lib/esm/inline-edit/InlineEdit.js +8 -8
- package/lib/esm/inline-edit/InlineEdit.js.map +1 -1
- package/lib/esm/kbd/kbd-utils.js +2 -2
- package/lib/esm/kbd/kbd-utils.js.map +1 -1
- package/lib/esm/modal/Modal.js +6 -6
- package/lib/esm/modal/Modal.js.map +1 -1
- package/lib/esm/next/tree-view/TreeView.js +23 -23
- package/lib/esm/next/tree-view/TreeView.js.map +1 -1
- package/lib/esm/next/tree-view/stories/tree-view-lazy.story.js +1 -1
- package/lib/esm/next/tree-view/stories/tree-view-lazy.story.js.map +1 -1
- package/lib/esm/next/tree-view/stories/tree-view-multi.story.js +6 -6
- package/lib/esm/next/tree-view/stories/tree-view-multi.story.js.map +1 -1
- package/lib/esm/popover/Popover.js.map +1 -1
- package/lib/esm/popover/stories/popover-custom-offset.story.js +3 -3
- package/lib/esm/popover/stories/popover-custom-offset.story.js.map +1 -1
- package/lib/esm/popover/use-popover.js +2 -0
- package/lib/esm/popover/use-popover.js.map +1 -1
- package/lib/esm/segmented-control/SegmentedControl.js.map +1 -1
- package/lib/esm/select/Overrides.js +30 -30
- package/lib/esm/select/Overrides.js.map +1 -1
- package/lib/esm/select-icon-button/SelectIconButton.js +4 -4
- package/lib/esm/select-icon-button/SelectIconButton.js.map +1 -1
- package/lib/esm/selectable-tag/stories/selectable-tag-sizes.story.js +1 -1
- package/lib/esm/selectable-tag/stories/selectable-tag-sizes.story.js.map +1 -1
- package/lib/esm/side-navigation/SideNavigation.js +9 -9
- package/lib/esm/side-navigation/SideNavigation.js.map +1 -1
- package/lib/esm/slider/Slider.js +1 -1
- package/lib/esm/slider/Slider.js.map +1 -1
- package/lib/esm/slider/stories/slider-single-controlled.story.js +2 -2
- package/lib/esm/slider/stories/slider-single-controlled.story.js.map +1 -1
- package/lib/esm/spotlight/Spotlight.js +6 -6
- package/lib/esm/spotlight/Spotlight.js.map +1 -1
- package/lib/esm/spotlight/SpotlightProvider.js +6 -6
- package/lib/esm/spotlight/SpotlightProvider.js.map +1 -1
- package/lib/esm/spotlight/SpotlightTarget.js +18 -16
- package/lib/esm/spotlight/SpotlightTarget.js.map +1 -1
- package/lib/esm/status-indicator/StatusIndicator.js +4 -2
- package/lib/esm/status-indicator/StatusIndicator.js.map +1 -1
- package/lib/esm/tabs/Tabs.js +3 -3
- package/lib/esm/tabs/Tabs.js.map +1 -1
- package/lib/esm/tabs/use-tabs-scroll-overflow.js +2 -2
- package/lib/esm/tabs/use-tabs-scroll-overflow.js.map +1 -1
- package/lib/esm/text-input/stories/text-input-full.story.js +1 -1
- package/lib/esm/text-input/stories/text-input-full.story.js.map +1 -1
- package/lib/esm/text-input/stories/text-input-with-icons.story.js +1 -1
- package/lib/esm/text-input/stories/text-input-with-icons.story.js.map +1 -1
- package/lib/esm/theme/agnostic.js +3 -3
- package/lib/esm/theme/agnostic.js.map +1 -1
- package/lib/esm/time-picker/TimePicker.js +24 -24
- package/lib/esm/time-picker/TimePicker.js.map +1 -1
- package/lib/esm/time-picker/generate-time-options.js +3 -3
- package/lib/esm/time-picker/generate-time-options.js.map +1 -1
- package/lib/esm/timezone-picker/TimeZonePicker.js +44 -44
- package/lib/esm/timezone-picker/TimeZonePicker.js.map +1 -1
- package/lib/esm/timezone-picker/generate-timezone-options.js +5 -5
- package/lib/esm/timezone-picker/generate-timezone-options.js.map +1 -1
- package/lib/esm/toast/ToastControlled.js +1 -1
- package/lib/esm/toast/ToastControlled.js.map +1 -1
- package/lib/esm/tooltip/use-tooltip.js +8 -1
- package/lib/esm/tooltip/use-tooltip.js.map +1 -1
- package/lib/esm/tree-view/TreeItemWrapper.js +8 -8
- package/lib/esm/tree-view/TreeItemWrapper.js.map +1 -1
- package/lib/esm/tree-view/TreeView.js +6 -2
- package/lib/esm/tree-view/TreeView.js.map +1 -1
- package/lib/esm/tree-view/TreeViewTextItem.js +17 -17
- package/lib/esm/tree-view/TreeViewTextItem.js.map +1 -1
- package/lib/esm/tree-view/tree-view-keyboard-coordinates.js +2 -0
- package/lib/esm/tree-view/tree-view-keyboard-coordinates.js.map +1 -1
- package/lib/esm/tree-view/tree-view-utils.js +12 -12
- package/lib/esm/tree-view/tree-view-utils.js.map +1 -1
- package/lib/types/_common/export-stories-utils.d.ts +1 -1
- package/lib/types/_common/utils.d.ts +3 -3
- package/lib/types/_generated/style-rules/color-utils.d.ts.map +1 -1
- package/lib/types/_generated/style-rules/date-utils.d.ts +3 -3
- package/lib/types/_generated/style-rules/date-utils.d.ts.map +1 -1
- package/lib/types/_generated/style-rules/literal-schemas.d.ts.map +1 -1
- package/lib/types/ai/code-preview/CodePreview.d.ts +1 -1
- package/lib/types/ai/file-tag/FileTag.d.ts +1 -1
- package/lib/types/ai/file-tag/FileTag.d.ts.map +1 -1
- package/lib/types/ai/image-tag/ImageTag.d.ts +1 -1
- package/lib/types/ai/image-tag/ImageTag.d.ts.map +1 -1
- package/lib/types/ai/prompt/Prompt.d.ts +3 -3
- package/lib/types/ai/prompt/Prompt.d.ts.map +1 -1
- package/lib/types/ai/suggestion/Suggestion.d.ts +1 -1
- package/lib/types/ai/suggestion/Suggestion.d.ts.map +1 -1
- package/lib/types/ai/thinking/thinking-duration-formatter.d.ts +5 -5
- package/lib/types/banner/Banner.d.ts +1 -1
- package/lib/types/banner/Banner.d.ts.map +1 -1
- package/lib/types/button/ButtonBase.d.ts +2 -2
- package/lib/types/button/ButtonBase.d.ts.map +1 -1
- package/lib/types/code/Code.d.ts +1 -1
- package/lib/types/code/Code.d.ts.map +1 -1
- package/lib/types/data-grid/Components.d.ts +2 -2
- package/lib/types/data-grid/Components.d.ts.map +1 -1
- package/lib/types/data-grid/DataGrid.d.ts +2 -2
- package/lib/types/data-grid/data-grid-nav/data-grid-nav.d.ts +4 -4
- package/lib/types/data-grid/data-grid-nav/data-grid-nav.d.ts.map +1 -1
- package/lib/types/data-grid/data-grid-nav/helpers.d.ts +1 -1
- package/lib/types/data-grid/data-grid-nav/index.d.ts +1 -1
- package/lib/types/data-grid/data-grid-nav/index.d.ts.map +1 -1
- package/lib/types/data-grid/helpers/index.d.ts +5 -5
- package/lib/types/data-grid/helpers/index.d.ts.map +1 -1
- package/lib/types/data-grid/stories/datagrid-in-dialog.story.d.ts.map +1 -1
- package/lib/types/data-grid/stories/datagrid-keyboard-navigation.story.d.ts.map +1 -1
- package/lib/types/data-grid/stories/datagrid-pinned-columns.stories.d.ts +2 -2
- package/lib/types/data-grid/stories/datagrid-search-and-filters.stories.d.ts +2 -2
- package/lib/types/data-grid/stories/datagrid-virtualization.story.d.ts.map +1 -1
- package/lib/types/data-grid/style-rules/evaluate.d.ts +1 -1
- package/lib/types/dialog/Dialog.d.ts.map +1 -1
- package/lib/types/dialog/dialog-types.d.ts +1 -1
- package/lib/types/dialog/dialog-types.d.ts.map +1 -1
- package/lib/types/drawer/Drawer.d.ts +1 -1
- package/lib/types/drawer/Drawer.d.ts.map +1 -1
- package/lib/types/dropdown-button/DropdownButton.d.ts +1 -1
- package/lib/types/dropdown-button/DropdownButton.d.ts.map +1 -1
- package/lib/types/hooks/index.d.ts +3 -3
- package/lib/types/icon-button-base/IconButtonBase.d.ts +1 -1
- package/lib/types/icon-button-base/IconButtonBase.d.ts.map +1 -1
- package/lib/types/icons/generated/custom/ScatterPlot.d.ts +29 -0
- package/lib/types/icons/generated/custom/ScatterPlot.d.ts.map +1 -0
- package/lib/types/icons/generated/custom/index.d.ts +1 -0
- package/lib/types/icons/generated/custom/index.d.ts.map +1 -1
- package/lib/types/modal/Modal.d.ts +1 -1
- package/lib/types/modal/Modal.d.ts.map +1 -1
- package/lib/types/popover/Popover.d.ts.map +1 -1
- package/lib/types/popover/use-popover.d.ts.map +1 -1
- package/lib/types/segmented-control/SegmentedControl.d.ts +1 -1
- package/lib/types/segmented-control/SegmentedControl.d.ts.map +1 -1
- package/lib/types/select/Overrides.d.ts.map +1 -1
- package/lib/types/select-icon-button/SelectIconButton.d.ts +1 -1
- package/lib/types/select-icon-button/SelectIconButton.d.ts.map +1 -1
- package/lib/types/selectable-tag/stories/selectable-tag-sizes.story.d.ts.map +1 -1
- package/lib/types/spotlight/SpotlightProvider.d.ts.map +1 -1
- package/lib/types/spotlight/SpotlightTarget.d.ts +4 -3
- package/lib/types/spotlight/SpotlightTarget.d.ts.map +1 -1
- package/lib/types/status-indicator/StatusIndicator.d.ts.map +1 -1
- package/lib/types/tabs/Tabs.d.ts +1 -1
- package/lib/types/tabs/Tabs.d.ts.map +1 -1
- package/lib/types/theme/agnostic.d.ts +2 -2
- package/lib/types/theme/agnostic.d.ts.map +1 -1
- package/lib/types/tooltip/use-tooltip.d.ts.map +1 -1
- package/lib/types/tree-view/TreeView.d.ts.map +1 -1
- package/lib/types/tree-view/TreeViewTextItem.d.ts.map +1 -1
- package/lib/types/tree-view/tree-view-keyboard-coordinates.d.ts.map +1 -1
- package/lib/types/tree-view/tree-view-utils.d.ts +12 -12
- package/lib/types/tree-view/tree-view-utils.d.ts.map +1 -1
- package/package.json +5 -3
- package/skills/ndl-react/components/ai/file-tag.md +1 -1
- package/skills/ndl-react/components/ai/image-tag.md +1 -1
- package/skills/ndl-react/components/ai/prompt.md +10 -10
- package/skills/ndl-react/components/ai/response.md +1 -1
- package/skills/ndl-react/components/ai/suggestion.md +1 -1
- package/skills/ndl-react/components/banner.md +1 -1
- package/skills/ndl-react/components/clean-icon-button.md +1 -1
- package/skills/ndl-react/components/code.md +1 -1
- package/skills/ndl-react/components/combobox.md +1 -1
- package/skills/ndl-react/components/data-grid.md +35 -28
- package/skills/ndl-react/components/dialog.md +1 -1
- package/skills/ndl-react/components/drawer.md +1 -1
- package/skills/ndl-react/components/dropdown-button.md +1 -1
- package/skills/ndl-react/components/dropzone.md +1 -1
- package/skills/ndl-react/components/filled-button.md +2 -2
- package/skills/ndl-react/components/flex.md +2 -2
- package/skills/ndl-react/components/icon-button.md +1 -1
- package/skills/ndl-react/components/modal.md +1 -1
- package/skills/ndl-react/components/next/tree-view.md +8 -8
- package/skills/ndl-react/components/outlined-button.md +2 -2
- package/skills/ndl-react/components/popover.md +3 -3
- package/skills/ndl-react/components/segmented-control.md +1 -1
- package/skills/ndl-react/components/select-icon-button.md +1 -1
- package/skills/ndl-react/components/selectable-tag.md +10 -4
- package/skills/ndl-react/components/slider.md +2 -2
- package/skills/ndl-react/components/tabs.md +1 -1
- package/skills/ndl-react/components/text-button.md +2 -2
- package/skills/ndl-react/components/text-input.md +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/dialog/Dialog.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport React, { useEffect, useId, useState } from 'react';\n\nimport {\n type CommonProps,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { type ButtonBase } from '../button';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { FilledButton } from '../filled-button';\nimport { ExclamationCircleIconOutline } from '../icons/generated/heroIcons/ExclamationCircleIconOutline';\nimport { ExclamationTriangleIconOutline } from '../icons/generated/heroIcons/ExclamationTriangleIconOutline';\nimport { InformationCircleIconOutline } from '../icons/generated/heroIcons/InformationCircleIconOutline';\nimport { XMarkIconOutline } from '../icons/generated/heroIcons/XMarkIconOutline';\nimport { Modal, ModalCloseReason } from '../modal';\nimport { OutlinedButton } from '../outlined-button';\nimport { TextButton } from '../text-button';\nimport { Typography } from '../typography';\nimport { DialogContext, useDialogContext } from './dialog-context';\nimport {\n type DialogActionsProps,\n DialogCloseReason,\n type DialogContentProps,\n type DialogDescriptionProps,\n type DialogHeaderProps,\n type DialogImageProps,\n type DialogProps,\n type DialogSubtitleProps,\n} from './dialog-types';\n\nconst convertCloseReason = (reason: ModalCloseReason): DialogCloseReason => {\n const dialogReason = reason as unknown as DialogCloseReason;\n if (Object.values(DialogCloseReason).includes(dialogReason)) {\n return dialogReason;\n }\n\n throw new Error(`Unknown reason '${reason}' received from popup`);\n};\n/* Stroke width on regular icons is 1.5px */\nconst typeIcons: Record<\n NonNullable<React.ComponentProps<typeof Dialog>['variant']>,\n React.ReactNode\n> = {\n danger: (\n <ExclamationCircleIconOutline\n htmlAttributes={{\n 'aria-hidden': undefined,\n 'aria-label': 'Danger',\n strokeWidth: 3,\n }}\n />\n ),\n info: (\n <InformationCircleIconOutline\n htmlAttributes={{\n 'aria-hidden': undefined,\n 'aria-label': 'Information',\n strokeWidth: 3,\n }}\n />\n ),\n warning: (\n <ExclamationTriangleIconOutline\n htmlAttributes={{\n 'aria-hidden': undefined,\n 'aria-label': 'Warning',\n strokeWidth: 3,\n }}\n />\n ),\n};\n\nconst DialogComponent = ({\n isOpen,\n onClose,\n children,\n variant,\n size,\n container,\n rootProps,\n hasDisabledCloseButton = false,\n htmlAttributes,\n className,\n style,\n ref,\n ...restProps\n}: CommonProps<'div', DialogProps>) => {\n const generatedDescriptionId = useId();\n const generatedHeaderId = useId();\n const [descriptionId, setDescriptionId] = useState<string | undefined>(\n generatedDescriptionId,\n );\n const [headerId, setHeaderId] = useState<string | undefined>(\n generatedHeaderId,\n );\n\n const handleCloseClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n e.preventDefault();\n onClose?.(e, DialogCloseReason.CLOSE_BUTTON_CLICK);\n };\n\n const handleClose = (\n e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>,\n reason?: ModalCloseReason,\n ) => {\n // Dialog should not be closed when backdrop is clicked\n if (reason === ModalCloseReason.BACKDROP_CLICK) {\n return;\n }\n\n onClose?.(e, reason !== undefined ? convertCloseReason(reason) : undefined);\n };\n\n const hasHeaderChild = React.useMemo(() => {\n const childrenArray = React.Children.toArray(children);\n return childrenArray.some(\n (child) => React.isValidElement(child) && child.type === Header,\n );\n }, [children]);\n\n const hasDescriptionChild = React.useMemo(() => {\n const childrenArray = React.Children.toArray(children);\n return childrenArray.some(\n (child) => React.isValidElement(child) && child.type === Description,\n );\n }, [children]);\n\n const ariaLabelledBy =\n htmlAttributes?.['aria-labelledby'] ??\n (hasHeaderChild ? headerId : undefined);\n\n const ariaDescribedBy =\n htmlAttributes?.['aria-describedby'] ??\n (hasDescriptionChild ? descriptionId : undefined);\n\n const dialogRole =\n variant === 'warning' || variant === 'danger' ? 'alertdialog' : 'dialog';\n\n if (!isOpen) {\n return null;\n }\n\n if (htmlAttributes?.['aria-label'] === undefined && !ariaLabelledBy) {\n console.warn(\n 'The Dialog is missing aria-label and Header. Please add one of them for accessibility.',\n );\n }\n\n const classes = classNames('ndl-dialog', className, {\n 'ndl-with-close-button': !hasDisabledCloseButton,\n 'ndl-with-icon': !!variant,\n });\n\n return (\n <Modal\n isOpen={isOpen}\n onClose={handleClose}\n container={container}\n rootProps={rootProps}\n size={size}\n htmlAttributes={{\n ...htmlAttributes,\n 'aria-describedby': ariaDescribedBy,\n 'aria-labelledby': ariaLabelledBy,\n role: dialogRole,\n }}\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n >\n <DialogContext.Provider\n value={{\n descriptionId,\n headerId,\n setDescriptionId,\n setHeaderId,\n variant,\n }}\n >\n {!hasDisabledCloseButton && (\n <CleanIconButton\n size=\"medium\"\n className=\"ndl-dialog-close\"\n onClick={handleCloseClick}\n description={null}\n htmlAttributes={{\n 'aria-label': 'Close',\n // TODO v5: remove data-testid\n 'data-testid': 'ndl-dialog-close',\n }}\n >\n <XMarkIconOutline />\n </CleanIconButton>\n )}\n <div className=\"ndl-dialog-content-wrapper\">\n {variant && (\n <div\n className={`ndl-dialog-type-icon ndl-${variant}`}\n // TODO v5: remove data-testid\n data-testid=\"ndl-dialog-type-icon\"\n >\n {typeIcons[variant]}\n </div>\n )}\n <div className=\"n-flex n-flex-col n-flex-1 n-w-full\">{children}</div>\n </div>\n </DialogContext.Provider>\n </Modal>\n );\n};\n\nconst Actions = <T extends React.ElementType = 'div'>({\n as,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, DialogActionsProps>) => {\n const { variant } = useDialogContext();\n const classes = classNames('ndl-dialog-actions', className);\n const Component: React.ElementType = as ?? 'div';\n\n let childrenToRender = children;\n\n // For danger dialogs, we want to convert primary buttons to danger buttons by default\n if (variant === 'danger') {\n childrenToRender = React.Children.map(children, (element) => {\n if (!React.isValidElement(element)) {\n return;\n }\n if (\n element.type === OutlinedButton ||\n element.type === FilledButton ||\n element.type === TextButton\n ) {\n const buttonElement = element as React.ReactElement<\n React.ComponentProps<typeof ButtonBase>\n >;\n\n if (\n buttonElement.props.variant === 'primary' ||\n buttonElement.props.variant === undefined\n ) {\n return React.cloneElement(buttonElement, {\n ...buttonElement.props,\n variant: 'danger',\n });\n }\n }\n return element;\n });\n }\n\n return (\n <Component\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {childrenToRender}\n </Component>\n );\n};\n\nconst Header = <T extends React.ElementType = 'span'>({\n as,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, DialogHeaderProps>) => {\n const { headerId, setHeaderId } = useDialogContext();\n const classes = classNames('ndl-dialog-header', className);\n const Component: React.ElementType = as ?? 'span';\n\n useEffect(() => {\n if (Boolean(htmlAttributes?.id) === true) {\n setHeaderId?.(htmlAttributes?.id);\n }\n }, [htmlAttributes?.id, setHeaderId]);\n\n return (\n <Typography\n as={Component}\n className={classes}\n ref={ref}\n style={style}\n variant=\"title-2\"\n {...restProps}\n htmlAttributes={{ ...htmlAttributes, id: headerId }}\n >\n {children}\n </Typography>\n );\n};\n\nconst Subtitle = <T extends React.ElementType = 'div'>({\n as,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, DialogSubtitleProps>) => {\n const classes = classNames('ndl-dialog-subtitle', className);\n const Component: React.ElementType = as ?? 'div';\n\n return (\n <Component\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Component>\n );\n};\n\nconst Description = <T extends React.ElementType = 'div'>({\n as,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, DialogDescriptionProps>) => {\n const { descriptionId, setDescriptionId } = useDialogContext();\n const classes = classNames('ndl-dialog-description', className);\n const Component: React.ElementType = as ?? 'div';\n\n useEffect(() => {\n if (Boolean(htmlAttributes?.id) === true) {\n setDescriptionId?.(htmlAttributes?.id);\n }\n }, [htmlAttributes?.id, setDescriptionId]);\n\n return (\n <Component\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n id={descriptionId}\n >\n {children}\n </Component>\n );\n};\n\nconst Content = <T extends React.ElementType = 'div'>({\n as,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, DialogContentProps>) => {\n const classes = classNames('ndl-dialog-content', className);\n const Component: React.ElementType = as ?? 'div';\n\n return (\n <Component\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Component>\n );\n};\n\nconst Image = ({\n src,\n alt,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'img', DialogImageProps>) => {\n const classes = classNames('ndl-dialog-image', className);\n\n return (\n <img\n src={src}\n alt={alt}\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n />\n );\n};\n\nconst Dialog = Object.assign(DialogComponent, {\n Actions,\n Content,\n Description,\n Header,\n Image,\n Subtitle,\n});\n\nexport { Dialog };\n"]}
|
|
1
|
+
{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/dialog/Dialog.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport React, { useEffect, useId, useState } from 'react';\n\nimport {\n type CommonProps,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { type ButtonBase } from '../button';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { FilledButton } from '../filled-button';\nimport { ExclamationCircleIconOutline } from '../icons/generated/heroIcons/ExclamationCircleIconOutline';\nimport { ExclamationTriangleIconOutline } from '../icons/generated/heroIcons/ExclamationTriangleIconOutline';\nimport { InformationCircleIconOutline } from '../icons/generated/heroIcons/InformationCircleIconOutline';\nimport { XMarkIconOutline } from '../icons/generated/heroIcons/XMarkIconOutline';\nimport { Modal, ModalCloseReason } from '../modal';\nimport { OutlinedButton } from '../outlined-button';\nimport { TextButton } from '../text-button';\nimport { Typography } from '../typography';\nimport { DialogContext, useDialogContext } from './dialog-context';\nimport {\n type DialogActionsProps,\n DialogCloseReason,\n type DialogContentProps,\n type DialogDescriptionProps,\n type DialogHeaderProps,\n type DialogImageProps,\n type DialogProps,\n type DialogSubtitleProps,\n} from './dialog-types';\n\nconst convertCloseReason = (reason: ModalCloseReason): DialogCloseReason => {\n const dialogReason = reason as unknown as DialogCloseReason;\n if (Object.values(DialogCloseReason).includes(dialogReason)) {\n return dialogReason;\n }\n\n throw new Error(`Unknown reason '${reason}' received from popup`);\n};\n/* Stroke width on regular icons is 1.5px */\nconst typeIcons: Record<\n NonNullable<React.ComponentProps<typeof Dialog>['variant']>,\n React.ReactNode\n> = {\n danger: (\n <ExclamationCircleIconOutline\n htmlAttributes={{\n 'aria-hidden': undefined,\n 'aria-label': 'Danger',\n strokeWidth: 3,\n }}\n />\n ),\n info: (\n <InformationCircleIconOutline\n htmlAttributes={{\n 'aria-hidden': undefined,\n 'aria-label': 'Information',\n strokeWidth: 3,\n }}\n />\n ),\n warning: (\n <ExclamationTriangleIconOutline\n htmlAttributes={{\n 'aria-hidden': undefined,\n 'aria-label': 'Warning',\n strokeWidth: 3,\n }}\n />\n ),\n};\n\nconst DialogComponent = ({\n isOpen,\n onClose,\n children,\n variant,\n size,\n container,\n rootProps,\n hasDisabledCloseButton = false,\n htmlAttributes,\n className,\n style,\n ref,\n ...restProps\n}: CommonProps<'div', DialogProps>) => {\n const generatedDescriptionId = useId();\n const generatedHeaderId = useId();\n const [descriptionId, setDescriptionId] = useState<string | undefined>(\n generatedDescriptionId,\n );\n const [headerId, setHeaderId] = useState<string | undefined>(\n generatedHeaderId,\n );\n\n const handleCloseClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault();\n onClose?.(event, DialogCloseReason.CLOSE_BUTTON_CLICK);\n };\n\n const handleClose = (\n event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>,\n reason?: ModalCloseReason,\n ) => {\n // Dialog should not be closed when backdrop is clicked\n if (reason === ModalCloseReason.BACKDROP_CLICK) {\n return;\n }\n\n onClose?.(\n event,\n reason !== undefined ? convertCloseReason(reason) : undefined,\n );\n };\n\n const hasHeaderChild = React.useMemo(() => {\n const childrenArray = React.Children.toArray(children);\n return childrenArray.some(\n (child) => React.isValidElement(child) && child.type === Header,\n );\n }, [children]);\n\n const hasDescriptionChild = React.useMemo(() => {\n const childrenArray = React.Children.toArray(children);\n return childrenArray.some(\n (child) => React.isValidElement(child) && child.type === Description,\n );\n }, [children]);\n\n const ariaLabelledBy =\n htmlAttributes?.['aria-labelledby'] ??\n (hasHeaderChild ? headerId : undefined);\n\n const ariaDescribedBy =\n htmlAttributes?.['aria-describedby'] ??\n (hasDescriptionChild ? descriptionId : undefined);\n\n const dialogRole =\n variant === 'warning' || variant === 'danger' ? 'alertdialog' : 'dialog';\n\n if (!isOpen) {\n return null;\n }\n\n if (htmlAttributes?.['aria-label'] === undefined && !ariaLabelledBy) {\n console.warn(\n 'The Dialog is missing aria-label and Header. Please add one of them for accessibility.',\n );\n }\n\n const classes = classNames('ndl-dialog', className, {\n 'ndl-with-close-button': !hasDisabledCloseButton,\n 'ndl-with-icon': !!variant,\n });\n\n return (\n <Modal\n isOpen={isOpen}\n onClose={handleClose}\n container={container}\n rootProps={rootProps}\n size={size}\n htmlAttributes={{\n ...htmlAttributes,\n 'aria-describedby': ariaDescribedBy,\n 'aria-labelledby': ariaLabelledBy,\n role: dialogRole,\n }}\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n >\n <DialogContext.Provider\n value={{\n descriptionId,\n headerId,\n setDescriptionId,\n setHeaderId,\n variant,\n }}\n >\n {!hasDisabledCloseButton && (\n <CleanIconButton\n size=\"medium\"\n className=\"ndl-dialog-close\"\n onClick={handleCloseClick}\n description={null}\n htmlAttributes={{\n 'aria-label': 'Close',\n // TODO v5: remove data-testid\n 'data-testid': 'ndl-dialog-close',\n }}\n >\n <XMarkIconOutline />\n </CleanIconButton>\n )}\n <div className=\"ndl-dialog-content-wrapper\">\n {variant && (\n <div\n className={`ndl-dialog-type-icon ndl-${variant}`}\n // TODO v5: remove data-testid\n data-testid=\"ndl-dialog-type-icon\"\n >\n {typeIcons[variant]}\n </div>\n )}\n <div className=\"n-flex n-flex-col n-flex-1 n-w-full\">{children}</div>\n </div>\n </DialogContext.Provider>\n </Modal>\n );\n};\n\nconst Actions = <T extends React.ElementType = 'div'>({\n as,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, DialogActionsProps>) => {\n const { variant } = useDialogContext();\n const classes = classNames('ndl-dialog-actions', className);\n const Component: React.ElementType = as ?? 'div';\n\n let childrenToRender = children;\n\n // For danger dialogs, we want to convert primary buttons to danger buttons by default\n if (variant === 'danger') {\n childrenToRender = React.Children.map(children, (element) => {\n if (!React.isValidElement(element)) {\n return;\n }\n if (\n element.type === OutlinedButton ||\n element.type === FilledButton ||\n element.type === TextButton\n ) {\n const buttonElement = element as React.ReactElement<\n React.ComponentProps<typeof ButtonBase>\n >;\n\n if (\n buttonElement.props.variant === 'primary' ||\n buttonElement.props.variant === undefined\n ) {\n return React.cloneElement(buttonElement, {\n ...buttonElement.props,\n variant: 'danger',\n });\n }\n }\n return element;\n });\n }\n\n return (\n <Component\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {childrenToRender}\n </Component>\n );\n};\n\nconst Header = <T extends React.ElementType = 'span'>({\n as,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, DialogHeaderProps>) => {\n const { headerId, setHeaderId } = useDialogContext();\n const classes = classNames('ndl-dialog-header', className);\n const Component: React.ElementType = as ?? 'span';\n\n useEffect(() => {\n if (Boolean(htmlAttributes?.id) === true) {\n setHeaderId?.(htmlAttributes?.id);\n }\n }, [htmlAttributes?.id, setHeaderId]);\n\n return (\n <Typography\n as={Component}\n className={classes}\n ref={ref}\n style={style}\n variant=\"title-2\"\n {...restProps}\n htmlAttributes={{ ...htmlAttributes, id: headerId }}\n >\n {children}\n </Typography>\n );\n};\n\nconst Subtitle = <T extends React.ElementType = 'div'>({\n as,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, DialogSubtitleProps>) => {\n const classes = classNames('ndl-dialog-subtitle', className);\n const Component: React.ElementType = as ?? 'div';\n\n return (\n <Component\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Component>\n );\n};\n\nconst Description = <T extends React.ElementType = 'div'>({\n as,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, DialogDescriptionProps>) => {\n const { descriptionId, setDescriptionId } = useDialogContext();\n const classes = classNames('ndl-dialog-description', className);\n const Component: React.ElementType = as ?? 'div';\n\n useEffect(() => {\n if (Boolean(htmlAttributes?.id) === true) {\n setDescriptionId?.(htmlAttributes?.id);\n }\n }, [htmlAttributes?.id, setDescriptionId]);\n\n return (\n <Component\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n id={descriptionId}\n >\n {children}\n </Component>\n );\n};\n\nconst Content = <T extends React.ElementType = 'div'>({\n as,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, DialogContentProps>) => {\n const classes = classNames('ndl-dialog-content', className);\n const Component: React.ElementType = as ?? 'div';\n\n return (\n <Component\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Component>\n );\n};\n\nconst Image = ({\n src,\n alt,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'img', DialogImageProps>) => {\n const classes = classNames('ndl-dialog-image', className);\n\n return (\n <img\n src={src}\n alt={alt}\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n />\n );\n};\n\nconst Dialog = Object.assign(DialogComponent, {\n Actions,\n Content,\n Description,\n Header,\n Image,\n Subtitle,\n});\n\nexport { Dialog };\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog-types.js","sourceRoot":"","sources":["../../../src/dialog/dialog-types.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AASH,iCAAiC;AACjC,IAAY,iBAGX;AAHD,WAAY,iBAAiB;IAC3B,sDAAiC,CAAA;IACjC,4DAAuC,CAAA;AACzC,CAAC,EAHW,iBAAiB,iCAAjB,iBAAiB,QAG5B","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport type { ModalProps } from '../modal';\n\nexport interface DialogBaseProps {\n /** The content to display within the dialog component. */\n children?: React.ReactNode;\n}\n\n// Should extend ModalCloseReason\nexport enum DialogCloseReason {\n ESCAPE_KEY_DOWN = 'escapeKeyDown',\n CLOSE_BUTTON_CLICK = 'closeButtonClick',\n}\n\nexport interface DialogProps extends Omit<ModalProps, 'onClose'> {\n /** Controls whether the dialog is open or closed. */\n isOpen: boolean;\n /** Type of dialog, which determines the icon and styling. */\n variant?: 'info' | 'warning' | 'danger';\n /** Whether to disable the close button in the top-right corner. */\n hasDisabledCloseButton?: boolean;\n /** Callback function called when the dialog is closed. */\n onClose?: (\n
|
|
1
|
+
{"version":3,"file":"dialog-types.js","sourceRoot":"","sources":["../../../src/dialog/dialog-types.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AASH,iCAAiC;AACjC,IAAY,iBAGX;AAHD,WAAY,iBAAiB;IAC3B,sDAAiC,CAAA;IACjC,4DAAuC,CAAA;AACzC,CAAC,EAHW,iBAAiB,iCAAjB,iBAAiB,QAG5B","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport type { ModalProps } from '../modal';\n\nexport interface DialogBaseProps {\n /** The content to display within the dialog component. */\n children?: React.ReactNode;\n}\n\n// Should extend ModalCloseReason\nexport enum DialogCloseReason {\n ESCAPE_KEY_DOWN = 'escapeKeyDown',\n CLOSE_BUTTON_CLICK = 'closeButtonClick',\n}\n\nexport interface DialogProps extends Omit<ModalProps, 'onClose'> {\n /** Controls whether the dialog is open or closed. */\n isOpen: boolean;\n /** Type of dialog, which determines the icon and styling. */\n variant?: 'info' | 'warning' | 'danger';\n /** Whether to disable the close button in the top-right corner. */\n hasDisabledCloseButton?: boolean;\n /** Callback function called when the dialog is closed. */\n onClose?: (\n event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>,\n reason?: DialogCloseReason,\n ) => void;\n}\n\nexport interface DialogContextType {\n descriptionId?: string;\n headerId?: string;\n setDescriptionId?: (id: string) => void;\n setHeaderId?: (id: string) => void;\n variant?: DialogProps['variant'];\n}\n\nexport type DialogActionsProps = DialogBaseProps;\n\nexport type DialogHeaderProps = DialogBaseProps;\n\nexport type DialogSubtitleProps = DialogBaseProps;\n\nexport type DialogDescriptionProps = DialogBaseProps;\n\nexport type DialogContentProps = DialogBaseProps;\n\nexport type DialogImageProps = {\n /** Source URL of the image */\n src: string;\n /** Alternative text for the image */\n alt: string;\n};\n"]}
|
package/lib/cjs/drawer/Drawer.js
CHANGED
|
@@ -68,15 +68,15 @@ function parsePercentage(value, referenceWidth) {
|
|
|
68
68
|
return Number.isNaN(percent) ? undefined : (percent / 100) * referenceWidth;
|
|
69
69
|
}
|
|
70
70
|
function DrawerResizeHandle({ handleSide, onResizeBy, valueMax, valueMin, valueNow, }) {
|
|
71
|
-
const handleKeyDown = (0, react_2.useCallback)((
|
|
72
|
-
const isArrowKey =
|
|
71
|
+
const handleKeyDown = (0, react_2.useCallback)((event) => {
|
|
72
|
+
const isArrowKey = event.key === 'ArrowLeft' || event.key === 'ArrowRight';
|
|
73
73
|
if (isArrowKey) {
|
|
74
|
-
|
|
74
|
+
event.preventDefault();
|
|
75
75
|
const delta = handleSide === 'right'
|
|
76
|
-
?
|
|
76
|
+
? event.key === 'ArrowRight'
|
|
77
77
|
? KEYBOARD_RESIZE_STEP_PX
|
|
78
78
|
: -KEYBOARD_RESIZE_STEP_PX
|
|
79
|
-
:
|
|
79
|
+
: event.key === 'ArrowLeft'
|
|
80
80
|
? KEYBOARD_RESIZE_STEP_PX
|
|
81
81
|
: -KEYBOARD_RESIZE_STEP_PX;
|
|
82
82
|
onResizeBy(delta);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/drawer/Drawer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,8CAS4B;AAC5B,4DAAoC;AACpC,+CAA8D;AAE9D,iCAOe;AAMf,4CAAwD;AACxD,4DAAuD;AACvD,0DAAsD;AACtD,oFAAiF;AACjF,8CAA2C;AAwF3C,MAAM,uBAAuB,GAAG,EAAE,CAAC;AAEnC,SAAS,cAAc,CACrB,KAAkC;IAElC,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;QACxB,OAAO,SAAS,CAAC;IACnB,CAAC;IACD,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;QAC9B,OAAO,KAAK,CAAC;IACf,CAAC;IACD,IAAI,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;QACnC,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC;IACD,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,SAAS,eAAe,CACtB,KAAkC,EAClC,cAAkC;IAElC,IACE,OAAO,KAAK,KAAK,QAAQ;QACzB,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC;QACpB,cAAc,KAAK,SAAS,EAC5B,CAAC;QACD,OAAO,SAAS,CAAC;IACnB,CAAC;IACD,MAAM,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;IAClC,OAAO,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,GAAG,CAAC,GAAG,cAAc,CAAC;AAC9E,CAAC;AAgBD,SAAS,kBAAkB,CAAC,EAC1B,UAAU,EACV,UAAU,EACV,QAAQ,EACR,QAAQ,EACR,QAAQ,GACgB;IACxB,MAAM,aAAa,GAAG,IAAA,mBAAW,EAC/B,CAAC,CAAsC,EAAE,EAAE;QACzC,MAAM,UAAU,GAAG,CAAC,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,CAAC,GAAG,KAAK,YAAY,CAAC;QACnE,IAAI,UAAU,EAAE,CAAC;YACf,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,MAAM,KAAK,GACT,UAAU,KAAK,OAAO;gBACpB,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,YAAY;oBACtB,CAAC,CAAC,uBAAuB;oBACzB,CAAC,CAAC,CAAC,uBAAuB;gBAC5B,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,WAAW;oBACrB,CAAC,CAAC,uBAAuB;oBACzB,CAAC,CAAC,CAAC,uBAAuB,CAAC;YACjC,UAAU,CAAC,KAAK,CAAC,CAAC;QACpB,CAAC;IACH,CAAC,EACD,CAAC,UAAU,EAAE,UAAU,CAAC,CACzB,CAAC;IAEF,OAAO;IACL,iIAAiI;IACjI,8CACc,4CAA4C,UAAU,GAAG,sBACpD,UAAU,mBACZ,QAAQ,mBACR,QAAQ,mBACR,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,CAAC,oBACZ,gBAAgB,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,CAAC,IAAI,EACjD,SAAS,EAAC,0BAA0B,wBAChB,UAAU,EAC9B,SAAS,EAAE,aAAa,EACxB,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE;QACxC,kHAAkH;QAClH,QAAQ,EAAE,CAAC,GACX,CACH,CAAC;AACJ,CAAC;AAED,MAAM,eAAe,GAAG,SAAS,eAAe,CAE9C,EAoBuC;;QApBvC,EACA,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,UAAU,EACV,gBAAgB,EAChB,QAAQ,GAAG,MAAM,EACjB,IAAI,GAAG,SAAS,EAChB,YAAY,GAAG,KAAK,EACpB,eAAe,EACf,WAAW,GAAG,IAAI,EAClB,UAAU,GAAG,KAAK,EAClB,WAAW,GAAG,EAAE,EAChB,aAAa,GAAG,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,EAC/C,mBAAmB,GAAG,KAAK,EAC3B,SAAS,EACT,cAAc,EACd,KAAK,EACL,GAAG,EACH,EAAE,OAEqC,EADpC,SAAS,cAnBZ,2PAoBD,CADa;IAEZ,MAAM,YAAY,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAC;IACpD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,IAAA,gBAAQ,EAAS,CAAC,CAAC,CAAC;IAE1D,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,SAAS,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC;QAC3D,IAAA,4BAAoB,EAClB,wFAAwF,CACzF,CAAC;IACJ,CAAC;IAED,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,IAAA,mBAAW,EAAC;QACpC,YAAY,EAAE,gBAAgB;QAC9B,IAAI,EAAE,UAAU;KACjB,CAAC,CAAC;IAEH,gGAAgG;IAChG,MAAM,gBAAgB,GACpB,IAAI,KAAK,OAAO;QAChB,CAAC,IAAI,KAAK,SAAS,IAAI,CAAC,UAAU,IAAI,UAAU,CAAC;QACjD,CAAC,IAAI,KAAK,SAAS,IAAI,UAAU,CAAC,CAAC;IAErC,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,OAAO,EAAE;QAClC,OAAO,EAAE,gBAAgB;QACzB,SAAS,EAAE,aAAa,IAAI,IAAI,KAAK,MAAM;QAC3C,YAAY,EAAE,mBAAmB,IAAI,IAAI,KAAK,MAAM;KACrD,CAAC,CAAC;IACH,MAAM,IAAI,GAAG,IAAA,eAAO,EAAC,OAAO,EAAE;QAC5B,OAAO,EAAE,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,SAAS;QAC/C,IAAI,EAAE,QAAQ;KACf,CAAC,CAAC;IACH,MAAM,EAAE,gBAAgB,EAAE,GAAG,IAAA,uBAAe,EAAC,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC;IAE9D,MAAM,kBAAkB,GAAG,IAAA,oBAAY,EAAC,CAAC,YAAY,EAAE,GAAG,CAAC,CAAC,CAAC;IAE7D,MAAM,cAAc,GAAG,IAAA,mBAAW,EAChC,CAAC,KAAa,EAAE,EAAE;;QAChB,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC;YAC1B,OAAO;QACT,CAAC;QACD,MAAM,OAAO,GAAG,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC;QAC1C,MAAM,WAAW,GACf,MAAA,MAAA,YAAY,CAAC,OAAO,CAAC,SAAS,0CAAE,aAAa,0CAAE,WAAW,CAAC;QAC7D,MAAM,GAAG,GACP,MAAA,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,mCACzC,eAAe,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,EAAE,WAAW,CAAC,CAAC;QAC1D,MAAM,GAAG,GACP,MAAA,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,mCACzC,eAAe,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,EAAE,WAAW,CAAC,CAAC;QAC1D,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CACvB,GAAG,aAAH,GAAG,cAAH,GAAG,GAAI,CAAC,EACR,IAAI,CAAC,GAAG,CAAC,GAAG,aAAH,GAAG,cAAH,GAAG,GAAI,MAAM,CAAC,iBAAiB,EAAE,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC,CACjE,CAAC;QACF,YAAY,CAAC,OAAO,CAAC,UAAU,CAAC;YAC9B,MAAM,EAAE,MAAM;YACd,KAAK,EAAE,QAAQ;SAChB,CAAC,CAAC;QACH,cAAc,CAAC,QAAQ,CAAC,CAAC;IAC3B,CAAC,EACD,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,EAAE,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,CACvD,CAAC;IAEF,MAAM,YAAY,GAAG,IAAA,mBAAW,EAC9B,CACE,KAA8B,EAC9B,SAAiE,EACjE,UAAuB,EACvB,KAAwC,EACxC,EAAE;;QACF,cAAc,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC;QACvC,MAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,gEAAG,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC;IACnE,CAAC,EACD,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,YAAY,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC;YAC3C,OAAO;QACT,CAAC;QACD,MAAM,KAAK,GAAG,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;QAC9C,IAAI,KAAK,GAAG,CAAC,EAAE,CAAC;YACd,cAAc,CAAC,KAAK,CAAC,CAAC;QACxB,CAAC;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,YAAY,EAAE,SAAS,EAAE;QAClD,qBAAqB,EAAE,UAAU;QACjC,iBAAiB,EAAE,QAAQ,KAAK,MAAM;QACtC,kBAAkB,EAAE,IAAI,KAAK,OAAO;QACpC,oBAAoB,EAAE,IAAI,KAAK,SAAS;QACxC,qBAAqB,EAAE,UAAU,IAAI,IAAI,KAAK,SAAS;QACvD,iBAAiB,EAAE,IAAI,KAAK,MAAM;QAClC,kBAAkB,EAAE,QAAQ,KAAK,OAAO;KACzC,CAAC,CAAC;IAEH,MAAM,sBAAsB,GAAG,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC;IAC5E,MAAM,SAAS,GAAG,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,KAAK,CAAC;IAE9B,MAAM,WAAW,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QACnC,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAG,KAAK,CAAC,CAAC;IAC5B,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,MAAM,WAAW,GAAG,IAAA,eAAO,EACzB,GAAG,EAAE,CACH,WAAW,IAAI,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CAChC,uBAAC,mCAAe,IACd,SAAS,EAAC,yBAAyB,EACnC,OAAO,EAAE,WAAW,EACpB,WAAW,EAAE,IAAI,EACjB,IAAI,EAAC,QAAQ,EACb,cAAc,EAAE;YACd,YAAY,EAAE,OAAO;SACtB,YAED,uBAAC,mCAAgB,KAAG,GACJ,CACnB,CAAC,CAAC,CAAC,IAAI,EACV,CAAC,WAAW,EAAE,WAAW,EAAE,IAAI,CAAC,CACjC,CAAC;IAEF,MAAM,gBAAgB,GAAG,CACvB,wBAAC,wBAAS,kBACR,EAAE,EAAE,SAAS,EACb,WAAW,EAAE;YACX,MAAM,EAAE,MAAM;YACd,KAAK,EAAE,MAAM;SACd,IACG,eAAe,IACnB,SAAS,EAAE,OAAO,EAClB,KAAK,gCACH,QAAQ,EAAE,sBAAsB,IAC7B,KAAK,GACL,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,KAAK,GAE3B,iBAAiB,EAAE,IAAI,EACvB,MAAM,EAAE,MAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,MAAM,mCAAI,QAAQ,EAC3C,YAAY,kCAIP,CAAC,QAAQ,KAAK,MAAM,IAAI,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,CAAC,GACrD,CAAC,QAAQ,KAAK,OAAO,IAAI,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,CAAC,GAEzD,MAAM,EAAE;YACN,MAAM,EAAE,KAAK;YACb,UAAU,EAAE,KAAK;YACjB,WAAW,EAAE,KAAK;YAClB,IAAI,EAAE,QAAQ,KAAK,OAAO;YAC1B,KAAK,EAAE,QAAQ,KAAK,MAAM;YAC1B,GAAG,EAAE,KAAK;YACV,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,KAAK;SAChB,EACD,eAAe,EACb,QAAQ,KAAK,MAAM;YACjB,CAAC,CAAC;gBACE,KAAK,EAAE,CACL,uBAAC,kBAAkB,IACjB,UAAU,EAAC,OAAO,EAClB,UAAU,EAAE,cAAc,EAC1B,QAAQ,EAAE,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,EACnD,QAAQ,EAAE,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,EACnD,QAAQ,EAAE,WAAW,GACrB,CACH;aACF;YACH,CAAC,CAAC;gBACE,IAAI,EAAE,CACJ,uBAAC,kBAAkB,IACjB,UAAU,EAAC,MAAM,EACjB,UAAU,EAAE,cAAc,EAC1B,QAAQ,EAAE,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,EACnD,QAAQ,EAAE,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,EACnD,QAAQ,EAAE,WAAW,GACrB,CACH;aACF,EAEP,QAAQ,EAAE,YAAY,EACtB,GAAG,EAAE,kBAAkB,IACnB,SAAS,EACT,cAAc,eAEjB,WAAW,EACX,QAAQ,KACC,CACb,CAAC;IAEF,MAAM,cAAc,GAAG,CACrB,wBAAC,SAAS,kBACR,SAAS,EAAE,IAAA,oBAAU,EAAC,OAAO,CAAC,EAC9B,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,IACJ,SAAS,EACT,cAAc,eAEjB,WAAW,EACX,QAAQ,KACC,CACb,CAAC;IAEF,4BAA4B;IAC5B,MAAM,OAAO,GAAG,YAAY,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,cAAc,CAAC;IAEjE,4EAA4E;IAE5E,qBAAqB;IACrB,IAAI,IAAI,KAAK,OAAO,IAAI,UAAU,EAAE,CAAC;QACnC,OAAO,CACL,wBAAC,sBAAc,oBAAK,WAAW,eAC7B,uBAAC,uBAAe,IACd,SAAS,EAAC,yBAAyB,EACnC,UAAU,EAAE,IAAI,GAChB,EACF,uBAAC,4BAAoB,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,YACpE,8CACE,GAAG,EAAE,IAAI,CAAC,WAAW,IACjB,gBAAgB,EAAE,kBACV,SAAS,gBACV,MAAM,YAEhB,OAAO,IACJ,GACe,KACR,CAClB,CAAC;IACJ,CAAC;IAED,IAAI,IAAI,KAAK,SAAS,IAAI,UAAU,EAAE,CAAC;QACrC,OAAO,CACL,uBAAC,kCAAe,IACd,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,CAAC,YAAY,EAAE,EAAE,CAAC,CACtB,uBAAC,sBAAc,kBAAC,gBAAgB,EAAE,IAAI,IAAM,WAAW,cACpD,YAAY,IACE,CAClB,YAED,uBAAC,4BAAoB,IACnB,QAAQ,EAAE,CAAC,UAAU,EACrB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,EACX,WAAW,EAAE,IAAI,YAEjB,8CACE,GAAG,EAAE,IAAI,CAAC,WAAW,IACjB,gBAAgB,EAAE,kBACV,SAAS,gBACV,MAAM,YAEhB,OAAO,IACJ,GACe,GACP,CACnB,CAAC;IACJ,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,eAAe,CAAC,WAAW,GAAG,QAAQ,CAAC;AASvC,MAAM,YAAY,GAAG,CAAC,EAKF,EAAE,EAAE;QALF,EACpB,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,cAAc,OAEI,EADf,SAAS,cAJQ,2CAKrB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC;IAE3D,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE,CAAC;QACjE,OAAO,CACL,uBAAC,uBAAU,kBACT,SAAS,EAAE,OAAO,EAClB,OAAO,EAAC,SAAS,IACb,SAAS,EACT,cAAc,cAEjB,QAAQ,IACE,CACd,CAAC;IACJ,CAAC;IAED,OAAO,CACL,8CAAK,SAAS,EAAE,OAAO,IAAM,SAAS,EAAM,cAAc,cACvD,QAAQ,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAQF,MAAM,aAAa,GAAG,CAAC,EAKF,EAAE,EAAE;QALF,EACrB,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,cAAc,OAEK,EADhB,SAAS,cAJS,2CAKtB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,oBAAoB,EAAE,SAAS,CAAC,CAAC;IAE5D,OAAO,CACL,8CAAK,SAAS,EAAE,OAAO,IAAM,SAAS,EAAM,cAAc,cACvD,QAAQ,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAQF,MAAM,UAAU,GAAG,CAAC,EAKF,EAAE,EAAE;QALF,EAClB,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,cAAc,OAEE,EADb,SAAS,cAJM,2CAKnB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,iBAAiB,EAAE,SAAS,CAAC,CAAC;IAEzD,OAAO,CACL,gCAAK,SAAS,EAAC,yBAAyB,YACtC,8CAAK,SAAS,EAAE,OAAO,IAAM,SAAS,EAAM,cAAc,cACvD,QAAQ,IACL,GACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE;IAC5C,OAAO,EAAE,aAAa;IACtB,IAAI,EAAE,UAAU;IAChB,MAAM,EAAE,YAAY;CACrB,CAAC,CAAC;AAEM,wBAAM","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport {\n FloatingFocusManager,\n FloatingOverlay,\n FloatingPortal,\n useDismiss,\n useFloating,\n useInteractions,\n useMergeRefs,\n useRole,\n} from '@floating-ui/react';\nimport classNames from 'classnames';\nimport { Resizable, type ResizableProps } from 're-resizable';\nimport type React from 'react';\nimport {\n type ComponentProps,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport {\n type HtmlAttributes,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { XMarkIconOutline } from '../icons/generated/heroIcons/XMarkIconOutline';\nimport { Typography } from '../typography';\n\ntype DrawerPosition = 'left' | 'right';\n\ntype DrawerType = 'overlay' | 'push' | 'modal';\n\n/**\n * @remarks\n * Where `ResizableProps` is the props for the `re-resizable` library. For more information, see the [re-resizable documentation](https://github.com/bokuweb/re-resizable).\n *\n * @remarks\n * Where `FloatingPortalProps` is the props for the `@floating-ui/react` library. For more information, see the [FloatingPortal documentation](https://floating-ui.com/docs/floatingportal).\n */\ntype DrawerProps = {\n /** Controls whether the drawer is open (expanded) or closed (collapsed). */\n isExpanded: boolean;\n\n /** Callback fired when the drawer's expanded state changes (close button, Escape, click outside, or programmatic change). */\n onExpandedChange?: (expanded: boolean) => void;\n\n /** Position where the drawer appears on screen. By default, it appears from the left. */\n position?: DrawerPosition;\n\n /** How the drawer affects the layout of sibling content. By default, it overlays content. */\n type?: DrawerType;\n\n /** Enables horizontal resizing of the drawer, by default it is not resizable. */\n isResizeable?: boolean;\n\n /** To use this prop the isResizeable prop must be set to true. For overriding the third party library props: https://github.com/bokuweb/re-resizable\n * The property enable has default values set for bottom, bottomLeft etc based on the position prop.\n */\n resizeableProps?: ResizableProps;\n\n /** Whether a close button (X) is displayed in the drawer. */\n isCloseable?: boolean;\n\n /** Whether to portal the content. Only applies when type is \"overlay\". Type \"modal\" is always portaled.*/\n isPortaled?: boolean;\n\n // TODO v5: this should maybe be default on portaled in the future. also, rename prop.\n /**\n * Whether pressing Escape closes the drawer. Should be set to true for overlay drawers.\n * - When type is \"modal\", this defaults to true.\n * - When type is \"overlay\", this defaults to false.\n * - When type is \"push\", no effect.\n */\n // eslint-disable-next-line @typescript-eslint/naming-convention\n closeOnEscape?: boolean;\n\n // TODO v5: this should maybe be default on overlay in the future. also, rename prop.\n /**\n * When type is \"overlay\", whether clicking outside the drawer closes it. Should be set to true for overlay drawers.\n * - When type is \"overlay\" or \"modal\", this defaults to false.\n * - When type is \"push\", no effect.\n */\n // eslint-disable-next-line @typescript-eslint/naming-convention\n closeOnClickOutside?: boolean;\n\n // TODO v5: remove this prop. unless something changes.\n /**\n * @deprecated overlay are now focus trapped by default, this prop has no effect anymore.\n */\n // eslint-disable-next-line @typescript-eslint/naming-convention\n closeOnFocusOut?: boolean;\n\n /** The content to display within the drawer. */\n children: React.ReactNode;\n\n /**\n * Props to pass to the portal from @floating-ui/react FloatingPortal\n * Only applies when type is \"overlay\" and isPortaled is true, or if type is \"modal\".\n * @see https://floating-ui.com/docs/floatingportal\n */\n portalProps?: ComponentProps<typeof FloatingPortal>;\n} & (\n | {\n type: 'modal';\n /** The aria-label to apply to the drawer. Required for accessibility when type is \"modal\" or \"overlay\".*/\n ariaLabel: string;\n }\n | {\n type?: 'push' | 'overlay';\n // TODO v5: aria label should be required when type is \"overlay\" too.\n ariaLabel?: string;\n }\n);\n\nconst KEYBOARD_RESIZE_STEP_PX = 16;\n\nfunction parsePixelSize(\n value: string | number | undefined,\n): number | undefined {\n if (value === undefined) {\n return undefined;\n }\n if (typeof value === 'number') {\n return value;\n }\n if (/^\\d+(\\.\\d+)?px$/i.test(value)) {\n return parseFloat(value);\n }\n return undefined;\n}\n\nfunction parsePercentage(\n value: string | number | undefined,\n referenceWidth: number | undefined,\n): number | undefined {\n if (\n typeof value !== 'string' ||\n !value.endsWith('%') ||\n referenceWidth === undefined\n ) {\n return undefined;\n }\n const percent = parseFloat(value);\n return Number.isNaN(percent) ? undefined : (percent / 100) * referenceWidth;\n}\n\ntype DrawerResizeHandleProps = {\n /** Which edge this handle resizes (right = drawer’s right edge, left = drawer’s left edge). */\n handleSide: 'left' | 'right';\n /** Called with a pixel delta to apply to the drawer width (positive = wider). */\n onResizeBy: (delta: number) => void;\n onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;\n /** Current width in pixels (for aria-valuenow). */\n valueNow?: number;\n /** Minimum width in pixels (for aria-valuemin). */\n valueMin?: number;\n /** Maximum width in pixels (for aria-valuemax). */\n valueMax?: number;\n};\n\nfunction DrawerResizeHandle({\n handleSide,\n onResizeBy,\n valueMax,\n valueMin,\n valueNow,\n}: DrawerResizeHandleProps) {\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLDivElement>) => {\n const isArrowKey = e.key === 'ArrowLeft' || e.key === 'ArrowRight';\n if (isArrowKey) {\n e.preventDefault();\n const delta =\n handleSide === 'right'\n ? e.key === 'ArrowRight'\n ? KEYBOARD_RESIZE_STEP_PX\n : -KEYBOARD_RESIZE_STEP_PX\n : e.key === 'ArrowLeft'\n ? KEYBOARD_RESIZE_STEP_PX\n : -KEYBOARD_RESIZE_STEP_PX;\n onResizeBy(delta);\n }\n },\n [handleSide, onResizeBy],\n );\n\n return (\n /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- Resize handle is focusable for keyboard resize. */\n <div\n aria-label={`Resize drawer with arrow keys. Handle on ${handleSide}.`}\n aria-orientation=\"vertical\"\n aria-valuemax={valueMax}\n aria-valuemin={valueMin}\n aria-valuenow={valueNow ?? 0}\n aria-valuetext={`drawer width ${valueNow ?? 0}px`}\n className=\"ndl-drawer-resize-handle\"\n data-drawer-handle={handleSide}\n onKeyDown={handleKeyDown}\n role=\"separator\"\n style={{ height: '100%', width: '100%' }}\n // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex -- Resize handle is focusable for keyboard resize.\n tabIndex={0}\n />\n );\n}\n\nconst DrawerComponent = function DrawerComponent<\n T extends React.ElementType = 'div',\n>({\n children,\n className = '',\n isExpanded,\n onExpandedChange,\n position = 'left',\n type = 'overlay',\n isResizeable = false,\n resizeableProps,\n isCloseable = true,\n isPortaled = false,\n portalProps = {},\n closeOnEscape = type === 'modal' ? true : false,\n closeOnClickOutside = false,\n ariaLabel,\n htmlAttributes,\n style,\n ref,\n as,\n ...restProps\n}: PolymorphicCommonProps<T, DrawerProps>) {\n const resizableRef = useRef<Resizable | null>(null);\n const [resizeWidth, setResizeWidth] = useState<number>(0);\n\n if ((type === 'modal' || type === 'overlay') && !ariaLabel) {\n needleWarningMessage(\n 'A Drawer should have an aria-label when type is \"modal\" or \"overlay\" to be accessible.',\n );\n }\n\n const { refs, context } = useFloating({\n onOpenChange: onExpandedChange,\n open: isExpanded,\n });\n\n /** Dismiss (escape + click outside) applies to portaled overlay and to non-portaled overlay. */\n const shouldUseDismiss =\n type === 'modal' ||\n (type === 'overlay' && !isPortaled && isExpanded) ||\n (type === 'overlay' && isPortaled);\n\n const dismiss = useDismiss(context, {\n enabled: shouldUseDismiss,\n escapeKey: closeOnEscape && type !== 'push',\n outsidePress: closeOnClickOutside && type !== 'push',\n });\n const role = useRole(context, {\n enabled: type === 'modal' || type === 'overlay',\n role: 'dialog',\n });\n const { getFloatingProps } = useInteractions([dismiss, role]);\n\n const resizableMergedRef = useMergeRefs([resizableRef, ref]);\n\n const handleResizeBy = useCallback(\n (delta: number) => {\n if (!resizableRef.current) {\n return;\n }\n const current = resizableRef.current.size;\n const parentWidth =\n resizableRef.current.resizable?.parentElement?.offsetWidth;\n const min =\n parsePixelSize(resizeableProps?.minWidth) ??\n parsePercentage(resizeableProps?.minWidth, parentWidth);\n const max =\n parsePixelSize(resizeableProps?.maxWidth) ??\n parsePercentage(resizeableProps?.maxWidth, parentWidth);\n const newWidth = Math.max(\n min ?? 0,\n Math.min(max ?? Number.POSITIVE_INFINITY, current.width + delta),\n );\n resizableRef.current.updateSize({\n height: '100%',\n width: newWidth,\n });\n setResizeWidth(newWidth);\n },\n [resizeableProps?.minWidth, resizeableProps?.maxWidth],\n );\n\n const handleResize = useCallback(\n (\n event: MouseEvent | TouchEvent,\n direction: Parameters<NonNullable<ResizableProps['onResize']>>[1],\n elementRef: HTMLElement,\n delta: { width: number; height: number },\n ) => {\n setResizeWidth(elementRef.offsetWidth);\n resizeableProps?.onResize?.(event, direction, elementRef, delta);\n },\n [resizeableProps],\n );\n\n useEffect(() => {\n if (!isResizeable || !resizableRef.current) {\n return;\n }\n const width = resizableRef.current.size.width;\n if (width > 0) {\n setResizeWidth(width);\n }\n }, [isResizeable]);\n\n const classes = classNames('ndl-drawer', className, {\n 'ndl-drawer-expanded': isExpanded,\n 'ndl-drawer-left': position === 'left',\n 'ndl-drawer-modal': type === 'modal',\n 'ndl-drawer-overlay': type === 'overlay',\n 'ndl-drawer-portaled': isPortaled && type === 'overlay',\n 'ndl-drawer-push': type === 'push',\n 'ndl-drawer-right': position === 'right',\n });\n\n const resizableStylePosition = type === 'overlay' ? 'absolute' : 'relative';\n const Component = as ?? 'div';\n\n const handleClose = useCallback(() => {\n onExpandedChange?.(false);\n }, [onExpandedChange]);\n\n const closeButton = useMemo(\n () =>\n isCloseable || type === 'modal' ? (\n <CleanIconButton\n className=\"ndl-drawer-close-button\"\n onClick={handleClose}\n description={null}\n size=\"medium\"\n htmlAttributes={{\n 'aria-label': 'Close',\n }}\n >\n <XMarkIconOutline />\n </CleanIconButton>\n ) : null,\n [handleClose, isCloseable, type],\n );\n\n const resizableContent = (\n <Resizable\n as={Component}\n defaultSize={{\n height: '100%',\n width: 'auto',\n }}\n {...resizeableProps}\n className={classes}\n style={{\n position: resizableStylePosition,\n ...style,\n ...resizeableProps?.style,\n }}\n boundsByDirection={true}\n bounds={resizeableProps?.bounds ?? 'parent'}\n handleStyles={{\n /*\n * Small offset so the handle is easier to hit when the drawer content is scrollable.\n */\n ...(position === 'left' && { right: { right: '-8px' } }),\n ...(position === 'right' && { left: { left: '-8px' } }),\n }}\n enable={{\n bottom: false,\n bottomLeft: false,\n bottomRight: false,\n left: position === 'right',\n right: position === 'left',\n top: false,\n topLeft: false,\n topRight: false,\n }}\n handleComponent={\n position === 'left'\n ? {\n right: (\n <DrawerResizeHandle\n handleSide=\"right\"\n onResizeBy={handleResizeBy}\n valueMax={parsePixelSize(resizeableProps?.maxWidth)}\n valueMin={parsePixelSize(resizeableProps?.minWidth)}\n valueNow={resizeWidth}\n />\n ),\n }\n : {\n left: (\n <DrawerResizeHandle\n handleSide=\"left\"\n onResizeBy={handleResizeBy}\n valueMax={parsePixelSize(resizeableProps?.maxWidth)}\n valueMin={parsePixelSize(resizeableProps?.minWidth)}\n valueNow={resizeWidth}\n />\n ),\n }\n }\n onResize={handleResize}\n ref={resizableMergedRef}\n {...restProps}\n {...htmlAttributes}\n >\n {closeButton}\n {children}\n </Resizable>\n );\n\n const regularContent = (\n <Component\n className={classNames(classes)}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {closeButton}\n {children}\n </Component>\n );\n\n /** what content to render*/\n const content = isResizeable ? resizableContent : regularContent;\n\n // const floatingRefs = useMergeRefs([refs.setFloating, refs.setReference]);\n\n /** modal behavior */\n if (type === 'modal' && isExpanded) {\n return (\n <FloatingPortal {...portalProps}>\n <FloatingOverlay\n className=\"ndl-drawer-overlay-root\"\n lockScroll={true}\n />\n <FloatingFocusManager context={context} modal={true} returnFocus={true}>\n <div\n ref={refs.setFloating}\n {...getFloatingProps()}\n aria-label={ariaLabel}\n aria-modal=\"true\"\n >\n {content}\n </div>\n </FloatingFocusManager>\n </FloatingPortal>\n );\n }\n\n if (type === 'overlay' && isExpanded) {\n return (\n <ConditionalWrap\n shouldWrap={isPortaled}\n wrap={(wrapChildren) => (\n <FloatingPortal preserveTabOrder={true} {...portalProps}>\n {wrapChildren}\n </FloatingPortal>\n )}\n >\n <FloatingFocusManager\n disabled={!isExpanded}\n context={context}\n modal={true}\n returnFocus={true}\n >\n <div\n ref={refs.setFloating}\n {...getFloatingProps()}\n aria-label={ariaLabel}\n aria-modal=\"true\"\n >\n {content}\n </div>\n </FloatingFocusManager>\n </ConditionalWrap>\n );\n }\n\n return content;\n};\n\nDrawerComponent.displayName = 'Drawer';\n\ntype DrawerHeaderProps = {\n children: React.ReactNode;\n className?: string;\n // TODO v5: fix the typing on the Drawer subcomponents to use the common props type. Also, this is not an h5 haha. Should be polymorphic I guess, maybe default to h2 as we've recommended.\n htmlAttributes?: HtmlAttributes<'h5'>;\n};\n\nconst DrawerHeader = ({\n children,\n className = '',\n htmlAttributes,\n ...restProps\n}: DrawerHeaderProps) => {\n const classes = classNames('ndl-drawer-header', className);\n\n if (typeof children === 'string' || typeof children === 'number') {\n return (\n <Typography\n className={classes}\n variant=\"title-3\"\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Typography>\n );\n }\n\n return (\n <div className={classes} {...restProps} {...htmlAttributes}>\n {children}\n </div>\n );\n};\n\ntype DrawerActionsProps = {\n children: React.ReactNode;\n className?: string;\n htmlAttributes?: HtmlAttributes<'div'>;\n};\n\nconst DrawerActions = ({\n children,\n className = '',\n htmlAttributes,\n ...restProps\n}: DrawerActionsProps) => {\n const classes = classNames('ndl-drawer-actions', className);\n\n return (\n <div className={classes} {...restProps} {...htmlAttributes}>\n {children}\n </div>\n );\n};\n\ntype DrawerBodyProps = {\n children: React.ReactNode;\n className?: string;\n htmlAttributes?: HtmlAttributes<'div'>;\n};\n\nconst DrawerBody = ({\n children,\n className = '',\n htmlAttributes,\n ...restProps\n}: DrawerBodyProps) => {\n const classes = classNames('ndl-drawer-body', className);\n\n return (\n <div className=\"ndl-drawer-body-wrapper\">\n <div className={classes} {...restProps} {...htmlAttributes}>\n {children}\n </div>\n </div>\n );\n};\n\nconst Drawer = Object.assign(DrawerComponent, {\n Actions: DrawerActions,\n Body: DrawerBody,\n Header: DrawerHeader,\n});\n\nexport { Drawer };\n"]}
|
|
1
|
+
{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/drawer/Drawer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,8CAS4B;AAC5B,4DAAoC;AACpC,+CAA8D;AAE9D,iCAOe;AAMf,4CAAwD;AACxD,4DAAuD;AACvD,0DAAsD;AACtD,oFAAiF;AACjF,8CAA2C;AAwF3C,MAAM,uBAAuB,GAAG,EAAE,CAAC;AAEnC,SAAS,cAAc,CACrB,KAAkC;IAElC,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;QACxB,OAAO,SAAS,CAAC;IACnB,CAAC;IACD,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;QAC9B,OAAO,KAAK,CAAC;IACf,CAAC;IACD,IAAI,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;QACnC,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC;IACD,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,SAAS,eAAe,CACtB,KAAkC,EAClC,cAAkC;IAElC,IACE,OAAO,KAAK,KAAK,QAAQ;QACzB,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC;QACpB,cAAc,KAAK,SAAS,EAC5B,CAAC;QACD,OAAO,SAAS,CAAC;IACnB,CAAC;IACD,MAAM,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;IAClC,OAAO,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,GAAG,CAAC,GAAG,cAAc,CAAC;AAC9E,CAAC;AAgBD,SAAS,kBAAkB,CAAC,EAC1B,UAAU,EACV,UAAU,EACV,QAAQ,EACR,QAAQ,EACR,QAAQ,GACgB;IACxB,MAAM,aAAa,GAAG,IAAA,mBAAW,EAC/B,CAAC,KAA0C,EAAE,EAAE;QAC7C,MAAM,UAAU,GACd,KAAK,CAAC,GAAG,KAAK,WAAW,IAAI,KAAK,CAAC,GAAG,KAAK,YAAY,CAAC;QAC1D,IAAI,UAAU,EAAE,CAAC;YACf,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,MAAM,KAAK,GACT,UAAU,KAAK,OAAO;gBACpB,CAAC,CAAC,KAAK,CAAC,GAAG,KAAK,YAAY;oBAC1B,CAAC,CAAC,uBAAuB;oBACzB,CAAC,CAAC,CAAC,uBAAuB;gBAC5B,CAAC,CAAC,KAAK,CAAC,GAAG,KAAK,WAAW;oBACzB,CAAC,CAAC,uBAAuB;oBACzB,CAAC,CAAC,CAAC,uBAAuB,CAAC;YACjC,UAAU,CAAC,KAAK,CAAC,CAAC;QACpB,CAAC;IACH,CAAC,EACD,CAAC,UAAU,EAAE,UAAU,CAAC,CACzB,CAAC;IAEF,OAAO;IACL,iIAAiI;IACjI,8CACc,4CAA4C,UAAU,GAAG,sBACpD,UAAU,mBACZ,QAAQ,mBACR,QAAQ,mBACR,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,CAAC,oBACZ,gBAAgB,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,CAAC,IAAI,EACjD,SAAS,EAAC,0BAA0B,wBAChB,UAAU,EAC9B,SAAS,EAAE,aAAa,EACxB,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE;QACxC,kHAAkH;QAClH,QAAQ,EAAE,CAAC,GACX,CACH,CAAC;AACJ,CAAC;AAED,MAAM,eAAe,GAAG,SAAS,eAAe,CAE9C,EAoBuC;;QApBvC,EACA,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,UAAU,EACV,gBAAgB,EAChB,QAAQ,GAAG,MAAM,EACjB,IAAI,GAAG,SAAS,EAChB,YAAY,GAAG,KAAK,EACpB,eAAe,EACf,WAAW,GAAG,IAAI,EAClB,UAAU,GAAG,KAAK,EAClB,WAAW,GAAG,EAAE,EAChB,aAAa,GAAG,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,EAC/C,mBAAmB,GAAG,KAAK,EAC3B,SAAS,EACT,cAAc,EACd,KAAK,EACL,GAAG,EACH,EAAE,OAEqC,EADpC,SAAS,cAnBZ,2PAoBD,CADa;IAEZ,MAAM,YAAY,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAC;IACpD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,IAAA,gBAAQ,EAAS,CAAC,CAAC,CAAC;IAE1D,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,SAAS,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC;QAC3D,IAAA,4BAAoB,EAClB,wFAAwF,CACzF,CAAC;IACJ,CAAC;IAED,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,IAAA,mBAAW,EAAC;QACpC,YAAY,EAAE,gBAAgB;QAC9B,IAAI,EAAE,UAAU;KACjB,CAAC,CAAC;IAEH,gGAAgG;IAChG,MAAM,gBAAgB,GACpB,IAAI,KAAK,OAAO;QAChB,CAAC,IAAI,KAAK,SAAS,IAAI,CAAC,UAAU,IAAI,UAAU,CAAC;QACjD,CAAC,IAAI,KAAK,SAAS,IAAI,UAAU,CAAC,CAAC;IAErC,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,OAAO,EAAE;QAClC,OAAO,EAAE,gBAAgB;QACzB,SAAS,EAAE,aAAa,IAAI,IAAI,KAAK,MAAM;QAC3C,YAAY,EAAE,mBAAmB,IAAI,IAAI,KAAK,MAAM;KACrD,CAAC,CAAC;IACH,MAAM,IAAI,GAAG,IAAA,eAAO,EAAC,OAAO,EAAE;QAC5B,OAAO,EAAE,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,SAAS;QAC/C,IAAI,EAAE,QAAQ;KACf,CAAC,CAAC;IACH,MAAM,EAAE,gBAAgB,EAAE,GAAG,IAAA,uBAAe,EAAC,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC;IAE9D,MAAM,kBAAkB,GAAG,IAAA,oBAAY,EAAC,CAAC,YAAY,EAAE,GAAG,CAAC,CAAC,CAAC;IAE7D,MAAM,cAAc,GAAG,IAAA,mBAAW,EAChC,CAAC,KAAa,EAAE,EAAE;;QAChB,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC;YAC1B,OAAO;QACT,CAAC;QACD,MAAM,OAAO,GAAG,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC;QAC1C,MAAM,WAAW,GACf,MAAA,MAAA,YAAY,CAAC,OAAO,CAAC,SAAS,0CAAE,aAAa,0CAAE,WAAW,CAAC;QAC7D,MAAM,GAAG,GACP,MAAA,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,mCACzC,eAAe,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,EAAE,WAAW,CAAC,CAAC;QAC1D,MAAM,GAAG,GACP,MAAA,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,mCACzC,eAAe,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,EAAE,WAAW,CAAC,CAAC;QAC1D,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CACvB,GAAG,aAAH,GAAG,cAAH,GAAG,GAAI,CAAC,EACR,IAAI,CAAC,GAAG,CAAC,GAAG,aAAH,GAAG,cAAH,GAAG,GAAI,MAAM,CAAC,iBAAiB,EAAE,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC,CACjE,CAAC;QACF,YAAY,CAAC,OAAO,CAAC,UAAU,CAAC;YAC9B,MAAM,EAAE,MAAM;YACd,KAAK,EAAE,QAAQ;SAChB,CAAC,CAAC;QACH,cAAc,CAAC,QAAQ,CAAC,CAAC;IAC3B,CAAC,EACD,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,EAAE,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,CACvD,CAAC;IAEF,MAAM,YAAY,GAAG,IAAA,mBAAW,EAC9B,CACE,KAA8B,EAC9B,SAAiE,EACjE,UAAuB,EACvB,KAAwC,EACxC,EAAE;;QACF,cAAc,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC;QACvC,MAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,gEAAG,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC;IACnE,CAAC,EACD,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,YAAY,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC;YAC3C,OAAO;QACT,CAAC;QACD,MAAM,KAAK,GAAG,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;QAC9C,IAAI,KAAK,GAAG,CAAC,EAAE,CAAC;YACd,cAAc,CAAC,KAAK,CAAC,CAAC;QACxB,CAAC;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,YAAY,EAAE,SAAS,EAAE;QAClD,qBAAqB,EAAE,UAAU;QACjC,iBAAiB,EAAE,QAAQ,KAAK,MAAM;QACtC,kBAAkB,EAAE,IAAI,KAAK,OAAO;QACpC,oBAAoB,EAAE,IAAI,KAAK,SAAS;QACxC,qBAAqB,EAAE,UAAU,IAAI,IAAI,KAAK,SAAS;QACvD,iBAAiB,EAAE,IAAI,KAAK,MAAM;QAClC,kBAAkB,EAAE,QAAQ,KAAK,OAAO;KACzC,CAAC,CAAC;IAEH,MAAM,sBAAsB,GAAG,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC;IAC5E,MAAM,SAAS,GAAG,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,KAAK,CAAC;IAE9B,MAAM,WAAW,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QACnC,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAG,KAAK,CAAC,CAAC;IAC5B,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,MAAM,WAAW,GAAG,IAAA,eAAO,EACzB,GAAG,EAAE,CACH,WAAW,IAAI,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CAChC,uBAAC,mCAAe,IACd,SAAS,EAAC,yBAAyB,EACnC,OAAO,EAAE,WAAW,EACpB,WAAW,EAAE,IAAI,EACjB,IAAI,EAAC,QAAQ,EACb,cAAc,EAAE;YACd,YAAY,EAAE,OAAO;SACtB,YAED,uBAAC,mCAAgB,KAAG,GACJ,CACnB,CAAC,CAAC,CAAC,IAAI,EACV,CAAC,WAAW,EAAE,WAAW,EAAE,IAAI,CAAC,CACjC,CAAC;IAEF,MAAM,gBAAgB,GAAG,CACvB,wBAAC,wBAAS,kBACR,EAAE,EAAE,SAAS,EACb,WAAW,EAAE;YACX,MAAM,EAAE,MAAM;YACd,KAAK,EAAE,MAAM;SACd,IACG,eAAe,IACnB,SAAS,EAAE,OAAO,EAClB,KAAK,gCACH,QAAQ,EAAE,sBAAsB,IAC7B,KAAK,GACL,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,KAAK,GAE3B,iBAAiB,EAAE,IAAI,EACvB,MAAM,EAAE,MAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,MAAM,mCAAI,QAAQ,EAC3C,YAAY,kCAIP,CAAC,QAAQ,KAAK,MAAM,IAAI,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,CAAC,GACrD,CAAC,QAAQ,KAAK,OAAO,IAAI,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,CAAC,GAEzD,MAAM,EAAE;YACN,MAAM,EAAE,KAAK;YACb,UAAU,EAAE,KAAK;YACjB,WAAW,EAAE,KAAK;YAClB,IAAI,EAAE,QAAQ,KAAK,OAAO;YAC1B,KAAK,EAAE,QAAQ,KAAK,MAAM;YAC1B,GAAG,EAAE,KAAK;YACV,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,KAAK;SAChB,EACD,eAAe,EACb,QAAQ,KAAK,MAAM;YACjB,CAAC,CAAC;gBACE,KAAK,EAAE,CACL,uBAAC,kBAAkB,IACjB,UAAU,EAAC,OAAO,EAClB,UAAU,EAAE,cAAc,EAC1B,QAAQ,EAAE,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,EACnD,QAAQ,EAAE,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,EACnD,QAAQ,EAAE,WAAW,GACrB,CACH;aACF;YACH,CAAC,CAAC;gBACE,IAAI,EAAE,CACJ,uBAAC,kBAAkB,IACjB,UAAU,EAAC,MAAM,EACjB,UAAU,EAAE,cAAc,EAC1B,QAAQ,EAAE,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,EACnD,QAAQ,EAAE,cAAc,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,CAAC,EACnD,QAAQ,EAAE,WAAW,GACrB,CACH;aACF,EAEP,QAAQ,EAAE,YAAY,EACtB,GAAG,EAAE,kBAAkB,IACnB,SAAS,EACT,cAAc,eAEjB,WAAW,EACX,QAAQ,KACC,CACb,CAAC;IAEF,MAAM,cAAc,GAAG,CACrB,wBAAC,SAAS,kBACR,SAAS,EAAE,IAAA,oBAAU,EAAC,OAAO,CAAC,EAC9B,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,IACJ,SAAS,EACT,cAAc,eAEjB,WAAW,EACX,QAAQ,KACC,CACb,CAAC;IAEF,4BAA4B;IAC5B,MAAM,OAAO,GAAG,YAAY,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,cAAc,CAAC;IAEjE,4EAA4E;IAE5E,qBAAqB;IACrB,IAAI,IAAI,KAAK,OAAO,IAAI,UAAU,EAAE,CAAC;QACnC,OAAO,CACL,wBAAC,sBAAc,oBAAK,WAAW,eAC7B,uBAAC,uBAAe,IACd,SAAS,EAAC,yBAAyB,EACnC,UAAU,EAAE,IAAI,GAChB,EACF,uBAAC,4BAAoB,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,YACpE,8CACE,GAAG,EAAE,IAAI,CAAC,WAAW,IACjB,gBAAgB,EAAE,kBACV,SAAS,gBACV,MAAM,YAEhB,OAAO,IACJ,GACe,KACR,CAClB,CAAC;IACJ,CAAC;IAED,IAAI,IAAI,KAAK,SAAS,IAAI,UAAU,EAAE,CAAC;QACrC,OAAO,CACL,uBAAC,kCAAe,IACd,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,CAAC,YAAY,EAAE,EAAE,CAAC,CACtB,uBAAC,sBAAc,kBAAC,gBAAgB,EAAE,IAAI,IAAM,WAAW,cACpD,YAAY,IACE,CAClB,YAED,uBAAC,4BAAoB,IACnB,QAAQ,EAAE,CAAC,UAAU,EACrB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,EACX,WAAW,EAAE,IAAI,YAEjB,8CACE,GAAG,EAAE,IAAI,CAAC,WAAW,IACjB,gBAAgB,EAAE,kBACV,SAAS,gBACV,MAAM,YAEhB,OAAO,IACJ,GACe,GACP,CACnB,CAAC;IACJ,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,eAAe,CAAC,WAAW,GAAG,QAAQ,CAAC;AASvC,MAAM,YAAY,GAAG,CAAC,EAKF,EAAE,EAAE;QALF,EACpB,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,cAAc,OAEI,EADf,SAAS,cAJQ,2CAKrB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC;IAE3D,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE,CAAC;QACjE,OAAO,CACL,uBAAC,uBAAU,kBACT,SAAS,EAAE,OAAO,EAClB,OAAO,EAAC,SAAS,IACb,SAAS,EACT,cAAc,cAEjB,QAAQ,IACE,CACd,CAAC;IACJ,CAAC;IAED,OAAO,CACL,8CAAK,SAAS,EAAE,OAAO,IAAM,SAAS,EAAM,cAAc,cACvD,QAAQ,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAQF,MAAM,aAAa,GAAG,CAAC,EAKF,EAAE,EAAE;QALF,EACrB,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,cAAc,OAEK,EADhB,SAAS,cAJS,2CAKtB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,oBAAoB,EAAE,SAAS,CAAC,CAAC;IAE5D,OAAO,CACL,8CAAK,SAAS,EAAE,OAAO,IAAM,SAAS,EAAM,cAAc,cACvD,QAAQ,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAQF,MAAM,UAAU,GAAG,CAAC,EAKF,EAAE,EAAE;QALF,EAClB,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,cAAc,OAEE,EADb,SAAS,cAJM,2CAKnB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,iBAAiB,EAAE,SAAS,CAAC,CAAC;IAEzD,OAAO,CACL,gCAAK,SAAS,EAAC,yBAAyB,YACtC,8CAAK,SAAS,EAAE,OAAO,IAAM,SAAS,EAAM,cAAc,cACvD,QAAQ,IACL,GACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE;IAC5C,OAAO,EAAE,aAAa;IACtB,IAAI,EAAE,UAAU;IAChB,MAAM,EAAE,YAAY;CACrB,CAAC,CAAC;AAEM,wBAAM","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport {\n FloatingFocusManager,\n FloatingOverlay,\n FloatingPortal,\n useDismiss,\n useFloating,\n useInteractions,\n useMergeRefs,\n useRole,\n} from '@floating-ui/react';\nimport classNames from 'classnames';\nimport { Resizable, type ResizableProps } from 're-resizable';\nimport type React from 'react';\nimport {\n type ComponentProps,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport {\n type HtmlAttributes,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { XMarkIconOutline } from '../icons/generated/heroIcons/XMarkIconOutline';\nimport { Typography } from '../typography';\n\ntype DrawerPosition = 'left' | 'right';\n\ntype DrawerType = 'overlay' | 'push' | 'modal';\n\n/**\n * @remarks\n * Where `ResizableProps` is the props for the `re-resizable` library. For more information, see the [re-resizable documentation](https://github.com/bokuweb/re-resizable).\n *\n * @remarks\n * Where `FloatingPortalProps` is the props for the `@floating-ui/react` library. For more information, see the [FloatingPortal documentation](https://floating-ui.com/docs/floatingportal).\n */\ntype DrawerProps = {\n /** Controls whether the drawer is open (expanded) or closed (collapsed). */\n isExpanded: boolean;\n\n /** Callback fired when the drawer's expanded state changes (close button, Escape, click outside, or programmatic change). */\n onExpandedChange?: (expanded: boolean) => void;\n\n /** Position where the drawer appears on screen. By default, it appears from the left. */\n position?: DrawerPosition;\n\n /** How the drawer affects the layout of sibling content. By default, it overlays content. */\n type?: DrawerType;\n\n /** Enables horizontal resizing of the drawer, by default it is not resizable. */\n isResizeable?: boolean;\n\n /** To use this prop the isResizeable prop must be set to true. For overriding the third party library props: https://github.com/bokuweb/re-resizable\n * The property enable has default values set for bottom, bottomLeft etc based on the position prop.\n */\n resizeableProps?: ResizableProps;\n\n /** Whether a close button (X) is displayed in the drawer. */\n isCloseable?: boolean;\n\n /** Whether to portal the content. Only applies when type is \"overlay\". Type \"modal\" is always portaled.*/\n isPortaled?: boolean;\n\n // TODO v5: this should maybe be default on portaled in the future. also, rename prop.\n /**\n * Whether pressing Escape closes the drawer. Should be set to true for overlay drawers.\n * - When type is \"modal\", this defaults to true.\n * - When type is \"overlay\", this defaults to false.\n * - When type is \"push\", no effect.\n */\n // eslint-disable-next-line @typescript-eslint/naming-convention\n closeOnEscape?: boolean;\n\n // TODO v5: this should maybe be default on overlay in the future. also, rename prop.\n /**\n * When type is \"overlay\", whether clicking outside the drawer closes it. Should be set to true for overlay drawers.\n * - When type is \"overlay\" or \"modal\", this defaults to false.\n * - When type is \"push\", no effect.\n */\n // eslint-disable-next-line @typescript-eslint/naming-convention\n closeOnClickOutside?: boolean;\n\n // TODO v5: remove this prop. unless something changes.\n /**\n * @deprecated overlay are now focus trapped by default, this prop has no effect anymore.\n */\n // eslint-disable-next-line @typescript-eslint/naming-convention\n closeOnFocusOut?: boolean;\n\n /** The content to display within the drawer. */\n children: React.ReactNode;\n\n /**\n * Props to pass to the portal from `@floating-ui/react` FloatingPortal\n * Only applies when type is \"overlay\" and isPortaled is true, or if type is \"modal\".\n * @see https://floating-ui.com/docs/floatingportal\n */\n portalProps?: ComponentProps<typeof FloatingPortal>;\n} & (\n | {\n type: 'modal';\n /** The aria-label to apply to the drawer. Required for accessibility when type is \"modal\" or \"overlay\".*/\n ariaLabel: string;\n }\n | {\n type?: 'push' | 'overlay';\n // TODO v5: aria label should be required when type is \"overlay\" too.\n ariaLabel?: string;\n }\n);\n\nconst KEYBOARD_RESIZE_STEP_PX = 16;\n\nfunction parsePixelSize(\n value: string | number | undefined,\n): number | undefined {\n if (value === undefined) {\n return undefined;\n }\n if (typeof value === 'number') {\n return value;\n }\n if (/^\\d+(\\.\\d+)?px$/i.test(value)) {\n return parseFloat(value);\n }\n return undefined;\n}\n\nfunction parsePercentage(\n value: string | number | undefined,\n referenceWidth: number | undefined,\n): number | undefined {\n if (\n typeof value !== 'string' ||\n !value.endsWith('%') ||\n referenceWidth === undefined\n ) {\n return undefined;\n }\n const percent = parseFloat(value);\n return Number.isNaN(percent) ? undefined : (percent / 100) * referenceWidth;\n}\n\ntype DrawerResizeHandleProps = {\n /** Which edge this handle resizes (right = drawer’s right edge, left = drawer’s left edge). */\n handleSide: 'left' | 'right';\n /** Called with a pixel delta to apply to the drawer width (positive = wider). */\n onResizeBy: (delta: number) => void;\n onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;\n /** Current width in pixels (for aria-valuenow). */\n valueNow?: number;\n /** Minimum width in pixels (for aria-valuemin). */\n valueMin?: number;\n /** Maximum width in pixels (for aria-valuemax). */\n valueMax?: number;\n};\n\nfunction DrawerResizeHandle({\n handleSide,\n onResizeBy,\n valueMax,\n valueMin,\n valueNow,\n}: DrawerResizeHandleProps) {\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLDivElement>) => {\n const isArrowKey =\n event.key === 'ArrowLeft' || event.key === 'ArrowRight';\n if (isArrowKey) {\n event.preventDefault();\n const delta =\n handleSide === 'right'\n ? event.key === 'ArrowRight'\n ? KEYBOARD_RESIZE_STEP_PX\n : -KEYBOARD_RESIZE_STEP_PX\n : event.key === 'ArrowLeft'\n ? KEYBOARD_RESIZE_STEP_PX\n : -KEYBOARD_RESIZE_STEP_PX;\n onResizeBy(delta);\n }\n },\n [handleSide, onResizeBy],\n );\n\n return (\n /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- Resize handle is focusable for keyboard resize. */\n <div\n aria-label={`Resize drawer with arrow keys. Handle on ${handleSide}.`}\n aria-orientation=\"vertical\"\n aria-valuemax={valueMax}\n aria-valuemin={valueMin}\n aria-valuenow={valueNow ?? 0}\n aria-valuetext={`drawer width ${valueNow ?? 0}px`}\n className=\"ndl-drawer-resize-handle\"\n data-drawer-handle={handleSide}\n onKeyDown={handleKeyDown}\n role=\"separator\"\n style={{ height: '100%', width: '100%' }}\n // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex -- Resize handle is focusable for keyboard resize.\n tabIndex={0}\n />\n );\n}\n\nconst DrawerComponent = function DrawerComponent<\n T extends React.ElementType = 'div',\n>({\n children,\n className = '',\n isExpanded,\n onExpandedChange,\n position = 'left',\n type = 'overlay',\n isResizeable = false,\n resizeableProps,\n isCloseable = true,\n isPortaled = false,\n portalProps = {},\n closeOnEscape = type === 'modal' ? true : false,\n closeOnClickOutside = false,\n ariaLabel,\n htmlAttributes,\n style,\n ref,\n as,\n ...restProps\n}: PolymorphicCommonProps<T, DrawerProps>) {\n const resizableRef = useRef<Resizable | null>(null);\n const [resizeWidth, setResizeWidth] = useState<number>(0);\n\n if ((type === 'modal' || type === 'overlay') && !ariaLabel) {\n needleWarningMessage(\n 'A Drawer should have an aria-label when type is \"modal\" or \"overlay\" to be accessible.',\n );\n }\n\n const { refs, context } = useFloating({\n onOpenChange: onExpandedChange,\n open: isExpanded,\n });\n\n /** Dismiss (escape + click outside) applies to portaled overlay and to non-portaled overlay. */\n const shouldUseDismiss =\n type === 'modal' ||\n (type === 'overlay' && !isPortaled && isExpanded) ||\n (type === 'overlay' && isPortaled);\n\n const dismiss = useDismiss(context, {\n enabled: shouldUseDismiss,\n escapeKey: closeOnEscape && type !== 'push',\n outsidePress: closeOnClickOutside && type !== 'push',\n });\n const role = useRole(context, {\n enabled: type === 'modal' || type === 'overlay',\n role: 'dialog',\n });\n const { getFloatingProps } = useInteractions([dismiss, role]);\n\n const resizableMergedRef = useMergeRefs([resizableRef, ref]);\n\n const handleResizeBy = useCallback(\n (delta: number) => {\n if (!resizableRef.current) {\n return;\n }\n const current = resizableRef.current.size;\n const parentWidth =\n resizableRef.current.resizable?.parentElement?.offsetWidth;\n const min =\n parsePixelSize(resizeableProps?.minWidth) ??\n parsePercentage(resizeableProps?.minWidth, parentWidth);\n const max =\n parsePixelSize(resizeableProps?.maxWidth) ??\n parsePercentage(resizeableProps?.maxWidth, parentWidth);\n const newWidth = Math.max(\n min ?? 0,\n Math.min(max ?? Number.POSITIVE_INFINITY, current.width + delta),\n );\n resizableRef.current.updateSize({\n height: '100%',\n width: newWidth,\n });\n setResizeWidth(newWidth);\n },\n [resizeableProps?.minWidth, resizeableProps?.maxWidth],\n );\n\n const handleResize = useCallback(\n (\n event: MouseEvent | TouchEvent,\n direction: Parameters<NonNullable<ResizableProps['onResize']>>[1],\n elementRef: HTMLElement,\n delta: { width: number; height: number },\n ) => {\n setResizeWidth(elementRef.offsetWidth);\n resizeableProps?.onResize?.(event, direction, elementRef, delta);\n },\n [resizeableProps],\n );\n\n useEffect(() => {\n if (!isResizeable || !resizableRef.current) {\n return;\n }\n const width = resizableRef.current.size.width;\n if (width > 0) {\n setResizeWidth(width);\n }\n }, [isResizeable]);\n\n const classes = classNames('ndl-drawer', className, {\n 'ndl-drawer-expanded': isExpanded,\n 'ndl-drawer-left': position === 'left',\n 'ndl-drawer-modal': type === 'modal',\n 'ndl-drawer-overlay': type === 'overlay',\n 'ndl-drawer-portaled': isPortaled && type === 'overlay',\n 'ndl-drawer-push': type === 'push',\n 'ndl-drawer-right': position === 'right',\n });\n\n const resizableStylePosition = type === 'overlay' ? 'absolute' : 'relative';\n const Component = as ?? 'div';\n\n const handleClose = useCallback(() => {\n onExpandedChange?.(false);\n }, [onExpandedChange]);\n\n const closeButton = useMemo(\n () =>\n isCloseable || type === 'modal' ? (\n <CleanIconButton\n className=\"ndl-drawer-close-button\"\n onClick={handleClose}\n description={null}\n size=\"medium\"\n htmlAttributes={{\n 'aria-label': 'Close',\n }}\n >\n <XMarkIconOutline />\n </CleanIconButton>\n ) : null,\n [handleClose, isCloseable, type],\n );\n\n const resizableContent = (\n <Resizable\n as={Component}\n defaultSize={{\n height: '100%',\n width: 'auto',\n }}\n {...resizeableProps}\n className={classes}\n style={{\n position: resizableStylePosition,\n ...style,\n ...resizeableProps?.style,\n }}\n boundsByDirection={true}\n bounds={resizeableProps?.bounds ?? 'parent'}\n handleStyles={{\n /*\n * Small offset so the handle is easier to hit when the drawer content is scrollable.\n */\n ...(position === 'left' && { right: { right: '-8px' } }),\n ...(position === 'right' && { left: { left: '-8px' } }),\n }}\n enable={{\n bottom: false,\n bottomLeft: false,\n bottomRight: false,\n left: position === 'right',\n right: position === 'left',\n top: false,\n topLeft: false,\n topRight: false,\n }}\n handleComponent={\n position === 'left'\n ? {\n right: (\n <DrawerResizeHandle\n handleSide=\"right\"\n onResizeBy={handleResizeBy}\n valueMax={parsePixelSize(resizeableProps?.maxWidth)}\n valueMin={parsePixelSize(resizeableProps?.minWidth)}\n valueNow={resizeWidth}\n />\n ),\n }\n : {\n left: (\n <DrawerResizeHandle\n handleSide=\"left\"\n onResizeBy={handleResizeBy}\n valueMax={parsePixelSize(resizeableProps?.maxWidth)}\n valueMin={parsePixelSize(resizeableProps?.minWidth)}\n valueNow={resizeWidth}\n />\n ),\n }\n }\n onResize={handleResize}\n ref={resizableMergedRef}\n {...restProps}\n {...htmlAttributes}\n >\n {closeButton}\n {children}\n </Resizable>\n );\n\n const regularContent = (\n <Component\n className={classNames(classes)}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {closeButton}\n {children}\n </Component>\n );\n\n /** what content to render*/\n const content = isResizeable ? resizableContent : regularContent;\n\n // const floatingRefs = useMergeRefs([refs.setFloating, refs.setReference]);\n\n /** modal behavior */\n if (type === 'modal' && isExpanded) {\n return (\n <FloatingPortal {...portalProps}>\n <FloatingOverlay\n className=\"ndl-drawer-overlay-root\"\n lockScroll={true}\n />\n <FloatingFocusManager context={context} modal={true} returnFocus={true}>\n <div\n ref={refs.setFloating}\n {...getFloatingProps()}\n aria-label={ariaLabel}\n aria-modal=\"true\"\n >\n {content}\n </div>\n </FloatingFocusManager>\n </FloatingPortal>\n );\n }\n\n if (type === 'overlay' && isExpanded) {\n return (\n <ConditionalWrap\n shouldWrap={isPortaled}\n wrap={(wrapChildren) => (\n <FloatingPortal preserveTabOrder={true} {...portalProps}>\n {wrapChildren}\n </FloatingPortal>\n )}\n >\n <FloatingFocusManager\n disabled={!isExpanded}\n context={context}\n modal={true}\n returnFocus={true}\n >\n <div\n ref={refs.setFloating}\n {...getFloatingProps()}\n aria-label={ariaLabel}\n aria-modal=\"true\"\n >\n {content}\n </div>\n </FloatingFocusManager>\n </ConditionalWrap>\n );\n }\n\n return content;\n};\n\nDrawerComponent.displayName = 'Drawer';\n\ntype DrawerHeaderProps = {\n children: React.ReactNode;\n className?: string;\n // TODO v5: fix the typing on the Drawer subcomponents to use the common props type. Also, this is not an h5 haha. Should be polymorphic I guess, maybe default to h2 as we've recommended.\n htmlAttributes?: HtmlAttributes<'h5'>;\n};\n\nconst DrawerHeader = ({\n children,\n className = '',\n htmlAttributes,\n ...restProps\n}: DrawerHeaderProps) => {\n const classes = classNames('ndl-drawer-header', className);\n\n if (typeof children === 'string' || typeof children === 'number') {\n return (\n <Typography\n className={classes}\n variant=\"title-3\"\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Typography>\n );\n }\n\n return (\n <div className={classes} {...restProps} {...htmlAttributes}>\n {children}\n </div>\n );\n};\n\ntype DrawerActionsProps = {\n children: React.ReactNode;\n className?: string;\n htmlAttributes?: HtmlAttributes<'div'>;\n};\n\nconst DrawerActions = ({\n children,\n className = '',\n htmlAttributes,\n ...restProps\n}: DrawerActionsProps) => {\n const classes = classNames('ndl-drawer-actions', className);\n\n return (\n <div className={classes} {...restProps} {...htmlAttributes}>\n {children}\n </div>\n );\n};\n\ntype DrawerBodyProps = {\n children: React.ReactNode;\n className?: string;\n htmlAttributes?: HtmlAttributes<'div'>;\n};\n\nconst DrawerBody = ({\n children,\n className = '',\n htmlAttributes,\n ...restProps\n}: DrawerBodyProps) => {\n const classes = classNames('ndl-drawer-body', className);\n\n return (\n <div className=\"ndl-drawer-body-wrapper\">\n <div className={classes} {...restProps} {...htmlAttributes}>\n {children}\n </div>\n </div>\n );\n};\n\nconst Drawer = Object.assign(DrawerComponent, {\n Actions: DrawerActions,\n Body: DrawerBody,\n Header: DrawerHeader,\n});\n\nexport { Drawer };\n"]}
|
|
@@ -59,15 +59,15 @@ const DropdownButton = function DropdownButton(_a) {
|
|
|
59
59
|
'ndl-small': size === 'small',
|
|
60
60
|
});
|
|
61
61
|
const isInteractable = !isDisabled && !isLoading;
|
|
62
|
-
const handleClick = (
|
|
62
|
+
const handleClick = (event) => {
|
|
63
63
|
// If the button is disabled or loading, we don't want to call the onClick handler. The loading is only aria-disabled, so we need this.
|
|
64
64
|
if (!isInteractable) {
|
|
65
|
-
|
|
66
|
-
|
|
65
|
+
event.preventDefault();
|
|
66
|
+
event.stopPropagation();
|
|
67
67
|
return;
|
|
68
68
|
}
|
|
69
69
|
if (onClick) {
|
|
70
|
-
onClick(
|
|
70
|
+
onClick(event);
|
|
71
71
|
}
|
|
72
72
|
};
|
|
73
73
|
return ((0, jsx_runtime_1.jsx)(Component, Object.assign({ className: classes, disabled: isDisabled, "aria-disabled": !isInteractable, onClick: handleClick, "aria-expanded": isOpen, ref: ref, style: style }, restProps, htmlAttributes, { children: (0, jsx_runtime_1.jsxs)("div", { className: "ndl-dropdown-btn-inner", children: [(0, jsx_runtime_1.jsxs)("div", { className: "ndl-dropdown-btn-leading-wrapper", children: [leadingElement, (0, jsx_runtime_1.jsx)("span", { className: "ndl-dropdown-btn-content", children: children })] }), (0, jsx_runtime_1.jsx)(ChevronDownIconOutline_1.ChevronDownIconOutline, { className: (0, classnames_1.default)('ndl-dropdown-button-icon', {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownButton.js","sourceRoot":"","sources":["../../../src/dropdown-button/DropdownButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4DAAoC;AAGpC,4DAAyD;AAEzD,gGAA6F;AAqC7F;;;;;;GAMG;AAEI,MAAM,cAAc,GAAG,SAAS,cAAc,CAEnD,EAgB+C;QAhB/C,EACA,EAAE,EACF,QAAQ,EACR,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,cAAc,EACd,MAAM,GAAG,KAAK,EACd,OAAO,EACP,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,EACH,SAAS,GAAG,KAAK,EACjB,cAAc,GAAG,SAAS,OAEqB,EAD5C,SAAS,cAfZ,2KAgBD,CADa;IAEZ,MAAM,SAAS,GAAsB,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,QAAQ,CAAC;IACpD,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,kBAAkB,EAAE,SAAS,EAAE;QACxD,cAAc,EAAE,UAAU;QAC1B,kBAAkB,EAAE,UAAU;QAC9B,WAAW,EAAE,IAAI,KAAK,OAAO;QAC7B,aAAa,EAAE,SAAS;QACxB,YAAY,EAAE,IAAI,KAAK,QAAQ;QAC/B,UAAU,EAAE,MAAM;QAClB,WAAW,EAAE,IAAI,KAAK,OAAO;KAC9B,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,CAAC,UAAU,IAAI,CAAC,SAAS,CAAC;IAEjD,MAAM,WAAW,GAAG,
|
|
1
|
+
{"version":3,"file":"DropdownButton.js","sourceRoot":"","sources":["../../../src/dropdown-button/DropdownButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4DAAoC;AAGpC,4DAAyD;AAEzD,gGAA6F;AAqC7F;;;;;;GAMG;AAEI,MAAM,cAAc,GAAG,SAAS,cAAc,CAEnD,EAgB+C;QAhB/C,EACA,EAAE,EACF,QAAQ,EACR,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,cAAc,EACd,MAAM,GAAG,KAAK,EACd,OAAO,EACP,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,EACH,SAAS,GAAG,KAAK,EACjB,cAAc,GAAG,SAAS,OAEqB,EAD5C,SAAS,cAfZ,2KAgBD,CADa;IAEZ,MAAM,SAAS,GAAsB,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,QAAQ,CAAC;IACpD,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,kBAAkB,EAAE,SAAS,EAAE;QACxD,cAAc,EAAE,UAAU;QAC1B,kBAAkB,EAAE,UAAU;QAC9B,WAAW,EAAE,IAAI,KAAK,OAAO;QAC7B,aAAa,EAAE,SAAS;QACxB,YAAY,EAAE,IAAI,KAAK,QAAQ;QAC/B,UAAU,EAAE,MAAM;QAClB,WAAW,EAAE,IAAI,KAAK,OAAO;KAC9B,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,CAAC,UAAU,IAAI,CAAC,SAAS,CAAC;IAEjD,MAAM,WAAW,GAAG,CAClB,KAAsD,EACtD,EAAE;QACF,uIAAuI;QACvI,IAAI,CAAC,cAAc,EAAE,CAAC;YACpB,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,OAAO;QACT,CAAC;QAED,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,uBAAC,SAAS,kBACR,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,UAAU,mBACL,CAAC,cAAc,EAC9B,OAAO,EAAE,WAAW,mBACL,MAAM,EACrB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,cAElB,iCAAK,SAAS,EAAC,wBAAwB,aACrC,iCAAK,SAAS,EAAC,kCAAkC,aAC9C,cAAc,EACf,iCAAM,SAAS,EAAC,0BAA0B,YAAE,QAAQ,GAAQ,IACxD,EAEN,uBAAC,+CAAsB,IACrB,SAAS,EAAE,IAAA,oBAAU,EAAC,0BAA0B,EAAE;wBAChD,+BAA+B,EAAE,MAAM;qBACxC,CAAC,GACF,EACD,SAAS,IAAI,CACZ,uBAAC,6BAAa,IAAC,cAAc,EAAE,cAAc,EAAE,IAAI,EAAE,IAAI,GAAI,CAC9D,IACG,IACI,CACb,CAAC;AACJ,CAAC,CAAC;AA5EW,QAAA,cAAc,kBA4EzB","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\n\nimport { ButtonSpinner } from '../_common/ButtonSpinner';\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { ChevronDownIconOutline } from '../icons/generated/heroIcons/ChevronDownIconOutline';\n\n/**\n *\n *\n * Types\n *\n *\n */\n\n/**\n * @remarks\n * Make sure to set `isOpen` to the corresponding state of the Menu that is being opened by the DropdownButton. That makes sure proper styling and aria attributes are applied to reflect the state.\n */\ntype DropdownButtonProps = {\n /** Content displayed in the button */\n children?: React.ReactNode;\n /** Size of button */\n size?: 'small' | 'medium' | 'large';\n /** Whether the button is in floating state */\n isFloating?: boolean;\n /** Whether the button is in disabled state */\n isDisabled?: boolean;\n /** Element that is shown before the button content */\n leadingElement?: React.ReactNode;\n /** If the dropdown is activated */\n isOpen?: boolean;\n /** Callback function to be called when the button is clicked */\n onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n /** Additional classnames */\n className?: string;\n /** If the button is loading. Will display a loading spinner*/\n isLoading?: boolean;\n /** Accessible message for screen readers when the button is in a loading state */\n loadingMessage?: string;\n};\n\n/**\n *\n *\n * DropdownButton Component\n *\n *\n */\n\nexport const DropdownButton = function DropdownButton<\n T extends React.ElementType = 'button',\n>({\n as,\n children,\n size = 'medium',\n isDisabled = false,\n isFloating = false,\n leadingElement,\n isOpen = false,\n onClick,\n className,\n style,\n htmlAttributes,\n ref,\n isLoading = false,\n loadingMessage = 'Loading',\n ...restProps\n}: PolymorphicCommonProps<T, DropdownButtonProps>) {\n const Component: React.ElementType = as ?? 'button';\n const classes = classNames('ndl-dropdown-btn', className, {\n 'ndl-disabled': isDisabled,\n 'ndl-floating-btn': isFloating,\n 'ndl-large': size === 'large',\n 'ndl-loading': isLoading,\n 'ndl-medium': size === 'medium',\n 'ndl-open': isOpen,\n 'ndl-small': size === 'small',\n });\n\n const isInteractable = !isDisabled && !isLoading;\n\n const handleClick = (\n event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n ) => {\n // If the button is disabled or loading, we don't want to call the onClick handler. The loading is only aria-disabled, so we need this.\n if (!isInteractable) {\n event.preventDefault();\n event.stopPropagation();\n return;\n }\n\n if (onClick) {\n onClick(event);\n }\n };\n\n return (\n <Component\n className={classes}\n disabled={isDisabled}\n aria-disabled={!isInteractable}\n onClick={handleClick}\n aria-expanded={isOpen}\n ref={ref}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n <div className=\"ndl-dropdown-btn-inner\">\n <div className=\"ndl-dropdown-btn-leading-wrapper\">\n {leadingElement}\n <span className=\"ndl-dropdown-btn-content\">{children}</span>\n </div>\n\n <ChevronDownIconOutline\n className={classNames('ndl-dropdown-button-icon', {\n 'ndl-dropdown-button-icon-open': isOpen,\n })}\n />\n {isLoading && (\n <ButtonSpinner loadingMessage={loadingMessage} size={size} />\n )}\n </div>\n </Component>\n );\n};\n"]}
|
|
@@ -75,7 +75,7 @@ const Component = () => {
|
|
|
75
75
|
}
|
|
76
76
|
}, [simulateUpload]);
|
|
77
77
|
const handleDropRejected = (0, react_2.useCallback)((rejectedFiles) => {
|
|
78
|
-
const errors = rejectedFiles.map((file) => `${file.file.name}: ${file.errors.map((
|
|
78
|
+
const errors = rejectedFiles.map((file) => `${file.file.name}: ${file.errors.map((error) => error.message).join(', ')}`);
|
|
79
79
|
setUploadData((prev) => (Object.assign(Object.assign({}, prev), { state: UploadState.Error, errors })));
|
|
80
80
|
}, []);
|
|
81
81
|
const handleError = (0, react_2.useCallback)((error) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropzone-full.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-full.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { XMarkIcon } from '@heroicons/react/24/solid';\nimport { Dropzone, FilledButton, Typography } from '@neo4j-ndl/react';\nimport { useCallback, useState } from 'react';\nimport {\n type DropEvent,\n type DropzoneOptions,\n type FileRejection,\n} from 'react-dropzone';\n\n// Configuration constants\nconst CONFIG = {\n MAX_FILES: 3,\n MAX_FILE_SIZE: 5 * 1024 * 1024, // 5MB\n PROGRESS_INCREMENT: 5,\n UPDATE_INTERVAL: 100,\n ACCEPTED_EXTENSIONS: ['.txt', '.json'] as string[],\n} as const;\n\nenum UploadState {\n Idle = 'idle',\n Uploading = 'uploading',\n Success = 'success',\n Error = 'error',\n}\n\ninterface UploadData {\n state: UploadState;\n progress: number;\n files: File[];\n errors: string[];\n}\n\nconst Component = () => {\n const [uploadData, setUploadData] = useState<UploadData>({\n errors: [],\n files: [],\n progress: 0,\n state: UploadState.Idle,\n });\n\n const resetUpload = useCallback(() => {\n setUploadData({\n errors: [],\n files: [],\n progress: 0,\n state: UploadState.Idle,\n });\n }, []);\n\n const simulateUpload = useCallback((files: File[]) => {\n setUploadData((prev) => ({\n ...prev,\n state: UploadState.Uploading,\n files,\n progress: 0,\n }));\n\n const interval = setInterval(() => {\n setUploadData((prev) => {\n const newProgress = prev.progress + CONFIG.PROGRESS_INCREMENT;\n if (newProgress >= 100) {\n clearInterval(interval);\n setTimeout(\n () =>\n setUploadData((current) => ({\n ...current,\n state: UploadState.Success,\n })),\n 500,\n );\n return { ...prev, progress: 100 };\n }\n return { ...prev, progress: newProgress };\n });\n }, CONFIG.UPDATE_INTERVAL);\n }, []);\n\n const handleDrop: DropzoneOptions['onDrop'] = useCallback(\n (\n acceptedFiles: File[],\n rejectedFiles: FileRejection[],\n event: DropEvent,\n ) => {\n console.info('Drop event:', { acceptedFiles, event, rejectedFiles });\n\n if (acceptedFiles.length > 0) {\n simulateUpload(acceptedFiles);\n }\n },\n [simulateUpload],\n );\n\n const handleDropRejected: DropzoneOptions['onDropRejected'] = useCallback(\n (rejectedFiles: FileRejection[]) => {\n const errors = rejectedFiles.map(\n (file) =>\n `${file.file.name}: ${file.errors.map((e) => e.message).join(', ')}`,\n );\n setUploadData((prev) => ({ ...prev, state: UploadState.Error, errors }));\n },\n [],\n );\n\n const handleError = useCallback((error: Error) => {\n console.error('Dropzone error:', error);\n setUploadData((prev) => ({\n ...prev,\n state: UploadState.Error,\n errors: [error.message],\n }));\n }, []);\n\n const renderStatusContent = () => {\n const { state, progress, files, errors } = uploadData;\n\n switch (state) {\n case UploadState.Uploading:\n return (\n <Dropzone.LoadingProgressBar\n progressBarPrecentage={Math.round(progress)}\n />\n );\n\n case UploadState.Success:\n return (\n <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n <Typography\n variant=\"title-4\"\n className=\"n-text-success-text n-font-semibold\"\n >\n Upload Complete!\n </Typography>\n <Typography\n variant=\"body-small\"\n className=\"n-text-neutral-text-weak\"\n >\n Successfully uploaded: {files.map((file) => file.name).join(', ')}\n </Typography>\n <FilledButton onClick={resetUpload}>Upload More Files</FilledButton>\n </div>\n );\n\n case UploadState.Error:\n return (\n <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n <XMarkIcon className=\"n-w-token-32 n-h-token-32 n-text-danger-text\" />\n <div className=\"n-flex n-flex-col n-gap-y-token-2\">\n {errors.map((message, index) => (\n <Typography\n key={index}\n variant=\"label\"\n className=\"n-text-danger-text n-font-semibold\"\n htmlAttributes={{ role: 'alert' }}\n >\n {message}\n </Typography>\n ))}\n </div>\n <FilledButton onClick={resetUpload}>Try Again</FilledButton>\n </div>\n );\n\n default:\n return undefined;\n }\n };\n\n return (\n <Dropzone\n dropZoneOptions={{\n disabled: uploadData.state === UploadState.Uploading,\n maxFiles: CONFIG.MAX_FILES,\n maxSize: CONFIG.MAX_FILE_SIZE,\n multiple: true,\n onDrop: handleDrop,\n onDropRejected: handleDropRejected,\n onError: handleError,\n }}\n supportedFilesDescription={\n <div className=\"n-text-center n-flex n-flex-col n-gap-y-token-2\">\n <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n Supports: Text files (.txt, .json) only\n </Typography>\n <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n Max {CONFIG.MAX_FILES} files •{' '}\n {CONFIG.MAX_FILE_SIZE / (1024 * 1024)}MB per file\n </Typography>\n </div>\n }\n acceptedFileExtensions={CONFIG.ACCEPTED_EXTENSIONS}\n loadingElement={renderStatusContent()}\n rejectedText=\"Error: Please make sure to only upload .json or .txt files\"\n heading=\"Drag & Drop your files\"\n />\n );\n};\n\nexport default Component;\n"]}
|
|
1
|
+
{"version":3,"file":"dropzone-full.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-full.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { XMarkIcon } from '@heroicons/react/24/solid';\nimport { Dropzone, FilledButton, Typography } from '@neo4j-ndl/react';\nimport { useCallback, useState } from 'react';\nimport {\n type DropEvent,\n type DropzoneOptions,\n type FileRejection,\n} from 'react-dropzone';\n\n// Configuration constants\nconst CONFIG = {\n MAX_FILES: 3,\n MAX_FILE_SIZE: 5 * 1024 * 1024, // 5MB\n PROGRESS_INCREMENT: 5,\n UPDATE_INTERVAL: 100,\n ACCEPTED_EXTENSIONS: ['.txt', '.json'] as string[],\n} as const;\n\nenum UploadState {\n Idle = 'idle',\n Uploading = 'uploading',\n Success = 'success',\n Error = 'error',\n}\n\ninterface UploadData {\n state: UploadState;\n progress: number;\n files: File[];\n errors: string[];\n}\n\nconst Component = () => {\n const [uploadData, setUploadData] = useState<UploadData>({\n errors: [],\n files: [],\n progress: 0,\n state: UploadState.Idle,\n });\n\n const resetUpload = useCallback(() => {\n setUploadData({\n errors: [],\n files: [],\n progress: 0,\n state: UploadState.Idle,\n });\n }, []);\n\n const simulateUpload = useCallback((files: File[]) => {\n setUploadData((prev) => ({\n ...prev,\n state: UploadState.Uploading,\n files,\n progress: 0,\n }));\n\n const interval = setInterval(() => {\n setUploadData((prev) => {\n const newProgress = prev.progress + CONFIG.PROGRESS_INCREMENT;\n if (newProgress >= 100) {\n clearInterval(interval);\n setTimeout(\n () =>\n setUploadData((current) => ({\n ...current,\n state: UploadState.Success,\n })),\n 500,\n );\n return { ...prev, progress: 100 };\n }\n return { ...prev, progress: newProgress };\n });\n }, CONFIG.UPDATE_INTERVAL);\n }, []);\n\n const handleDrop: DropzoneOptions['onDrop'] = useCallback(\n (\n acceptedFiles: File[],\n rejectedFiles: FileRejection[],\n event: DropEvent,\n ) => {\n console.info('Drop event:', { acceptedFiles, event, rejectedFiles });\n\n if (acceptedFiles.length > 0) {\n simulateUpload(acceptedFiles);\n }\n },\n [simulateUpload],\n );\n\n const handleDropRejected: DropzoneOptions['onDropRejected'] = useCallback(\n (rejectedFiles: FileRejection[]) => {\n const errors = rejectedFiles.map(\n (file) =>\n `${file.file.name}: ${file.errors.map((error) => error.message).join(', ')}`,\n );\n setUploadData((prev) => ({ ...prev, state: UploadState.Error, errors }));\n },\n [],\n );\n\n const handleError = useCallback((error: Error) => {\n console.error('Dropzone error:', error);\n setUploadData((prev) => ({\n ...prev,\n state: UploadState.Error,\n errors: [error.message],\n }));\n }, []);\n\n const renderStatusContent = () => {\n const { state, progress, files, errors } = uploadData;\n\n switch (state) {\n case UploadState.Uploading:\n return (\n <Dropzone.LoadingProgressBar\n progressBarPrecentage={Math.round(progress)}\n />\n );\n\n case UploadState.Success:\n return (\n <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n <Typography\n variant=\"title-4\"\n className=\"n-text-success-text n-font-semibold\"\n >\n Upload Complete!\n </Typography>\n <Typography\n variant=\"body-small\"\n className=\"n-text-neutral-text-weak\"\n >\n Successfully uploaded: {files.map((file) => file.name).join(', ')}\n </Typography>\n <FilledButton onClick={resetUpload}>Upload More Files</FilledButton>\n </div>\n );\n\n case UploadState.Error:\n return (\n <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n <XMarkIcon className=\"n-w-token-32 n-h-token-32 n-text-danger-text\" />\n <div className=\"n-flex n-flex-col n-gap-y-token-2\">\n {errors.map((message, index) => (\n <Typography\n key={index}\n variant=\"label\"\n className=\"n-text-danger-text n-font-semibold\"\n htmlAttributes={{ role: 'alert' }}\n >\n {message}\n </Typography>\n ))}\n </div>\n <FilledButton onClick={resetUpload}>Try Again</FilledButton>\n </div>\n );\n\n default:\n return undefined;\n }\n };\n\n return (\n <Dropzone\n dropZoneOptions={{\n disabled: uploadData.state === UploadState.Uploading,\n maxFiles: CONFIG.MAX_FILES,\n maxSize: CONFIG.MAX_FILE_SIZE,\n multiple: true,\n onDrop: handleDrop,\n onDropRejected: handleDropRejected,\n onError: handleError,\n }}\n supportedFilesDescription={\n <div className=\"n-text-center n-flex n-flex-col n-gap-y-token-2\">\n <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n Supports: Text files (.txt, .json) only\n </Typography>\n <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n Max {CONFIG.MAX_FILES} files •{' '}\n {CONFIG.MAX_FILE_SIZE / (1024 * 1024)}MB per file\n </Typography>\n </div>\n }\n acceptedFileExtensions={CONFIG.ACCEPTED_EXTENSIONS}\n loadingElement={renderStatusContent()}\n rejectedText=\"Error: Please make sure to only upload .json or .txt files\"\n heading=\"Drag & Drop your files\"\n />\n );\n};\n\nexport default Component;\n"]}
|
|
@@ -52,6 +52,6 @@ const TiledTransparentBackground = {
|
|
|
52
52
|
backgroundSize: '20px 20px',
|
|
53
53
|
border: '1px solid var(--theme-color-neutral-border-weak)',
|
|
54
54
|
};
|
|
55
|
-
const component = () => ((0, jsx_runtime_1.jsx)(react_1.Flex, { style: Object.assign(Object.assign({}, TiledTransparentBackground), { borderRadius: base_1.tokens.borderRadius['xl'], padding: base_1.tokens.space['12'] }), children: Array.from({ length: 3 }).map((
|
|
55
|
+
const component = () => ((0, jsx_runtime_1.jsx)(react_1.Flex, { style: Object.assign(Object.assign({}, TiledTransparentBackground), { borderRadius: base_1.tokens.borderRadius['xl'], padding: base_1.tokens.space['12'] }), children: Array.from({ length: 3 }).map((_unused, index) => ((0, jsx_runtime_1.jsx)(react_1.Box, { borderRadius: "xl", style: { height: '80px', minWidth: '240px' }, className: "n-bg-primary-bg-weak n-border n-border-primary-border-strong" }, `box-${index}`))) }));
|
|
56
56
|
exports.default = component;
|
|
57
57
|
//# sourceMappingURL=flex-default.story.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flex-default.story.js","sourceRoot":"","sources":["../../../../src/flex/stories/flex-default.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,0CAAyC;AACzC,4CAA6C;AAE7C,MAAM,KAAK,GAAG;;;;;;;;;;;;;;;;;;;;;CAqBb,CAAC;AAEF,MAAM,0BAA0B,GAAwB;IACtD,eAAe,EAAE,OAAO;IACxB,eAAe,EAAE,KAAK;IACtB,kBAAkB,EAAE,yCAAyC;IAC7D,cAAc,EAAE,WAAW;IAC3B,MAAM,EAAE,kDAAkD;CAC3D,CAAC;AAEF,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,CACtB,uBAAC,YAAI,IACH,KAAK,kCACA,0BAA0B,KAC7B,YAAY,EAAE,aAAM,CAAC,YAAY,CAAC,IAAI,CAAC,EACvC,OAAO,EAAE,aAAM,CAAC,KAAK,CAAC,IAAI,CAAC,eAG5B,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"flex-default.story.js","sourceRoot":"","sources":["../../../../src/flex/stories/flex-default.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,0CAAyC;AACzC,4CAA6C;AAE7C,MAAM,KAAK,GAAG;;;;;;;;;;;;;;;;;;;;;CAqBb,CAAC;AAEF,MAAM,0BAA0B,GAAwB;IACtD,eAAe,EAAE,OAAO;IACxB,eAAe,EAAE,KAAK;IACtB,kBAAkB,EAAE,yCAAyC;IAC7D,cAAc,EAAE,WAAW;IAC3B,MAAM,EAAE,kDAAkD;CAC3D,CAAC;AAEF,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,CACtB,uBAAC,YAAI,IACH,KAAK,kCACA,0BAA0B,KAC7B,YAAY,EAAE,aAAM,CAAC,YAAY,CAAC,IAAI,CAAC,EACvC,OAAO,EAAE,aAAM,CAAC,KAAK,CAAC,IAAI,CAAC,eAG5B,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE,CAAC,CACjD,uBAAC,WAAG,IAEF,YAAY,EAAC,IAAI,EACjB,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,EAC5C,SAAS,EAAC,8DAA8D,IAHnE,OAAO,KAAK,EAAE,CAId,CACR,CAAC,GACG,CACR,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { tokens } from '@neo4j-ndl/base';\nimport { Box, Flex } from '@neo4j-ndl/react';\n\nconst Tiles = `\n linear-gradient(\n 45deg,\n var(--theme-color-neutral-bg-strong) 25%,\n transparent 25%\n ),\n linear-gradient(\n 135deg,\n var(--theme-color-neutral-bg-strong) 25%,\n transparent 25%\n ),\n linear-gradient(\n 45deg,\n transparent 75%,\n var(--theme-color-neutral-bg-strong) 75%\n ),\n linear-gradient(\n 135deg,\n transparent 75%,\n var(--theme-color-neutral-bg-strong) 75%\n )\n`;\n\nconst TiledTransparentBackground: React.CSSProperties = {\n backgroundColor: 'white',\n backgroundImage: Tiles,\n backgroundPosition: '0px 0px, 10px 0px, 10px -10px, 0px 10px',\n backgroundSize: '20px 20px',\n border: '1px solid var(--theme-color-neutral-border-weak)',\n};\n\nconst component = () => (\n <Flex\n style={{\n ...TiledTransparentBackground,\n borderRadius: tokens.borderRadius['xl'],\n padding: tokens.space['12'],\n }}\n >\n {Array.from({ length: 3 }).map((_unused, index) => (\n <Box\n key={`box-${index}`}\n borderRadius=\"xl\"\n style={{ height: '80px', minWidth: '240px' }}\n className=\"n-bg-primary-bg-weak n-border n-border-primary-border-strong\"\n ></Box>\n ))}\n </Flex>\n);\n\nexport default component;\n"]}
|
package/lib/cjs/hooks/index.js
CHANGED
|
@@ -113,10 +113,10 @@ function useRenderCount() {
|
|
|
113
113
|
*
|
|
114
114
|
* if there are state variables include them as well:
|
|
115
115
|
*
|
|
116
|
-
* useRenderDebugger('MyComponent', { ...props, stateVar1, stateVar2 })
|
|
116
|
+
* `useRenderDebugger('MyComponent', { ...props, stateVar1, stateVar2 });`
|
|
117
117
|
*
|
|
118
|
-
* @param componentName Name of the component to debug
|
|
119
|
-
* @param propsAndStates
|
|
118
|
+
* @param componentName - Name of the component to debug
|
|
119
|
+
* @param propsAndStates - An object containing all props and states variables of the component
|
|
120
120
|
*/
|
|
121
121
|
const useRenderDebugger = (componentName, propsAndStates) => {
|
|
122
122
|
const prev = (0, react_1.useRef)(propsAndStates);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/hooks/index.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { useEffect, useRef } from 'react';\n\nexport {\n useDebounceValue,\n useWindowSize,\n useOnClickOutside,\n useInterval,\n useMediaQuery,\n useCopyToClipboard,\n useScrollLock,\n useEventListener,\n useResizeObserver,\n} from 'usehooks-ts';\nimport { useDebounceCallback } from './use-debounce-callback';\nexport { useDebounceCallback };\n\n/**\n * Below are hooks that cannot be found in `usehooks-ts`\n * but are used in some projects.\n * 1. usePrevious\n * 2. useEffectDebugger\n * 3. useRenderCount\n */\n\n/**\n * The `usePrevious` hook tracks a variable's previous value in a functional component,\n * useful for comparing current and past values to trigger actions or render changes.\n */\nexport function usePrevious<T>(value: T): T | null {\n // The ref object is a generic container whose current property is mutable\n // and can hold any value, similar to an instance property on a class\n\n const ref = useRef<T>(null);\n // Store current value in ref\n useEffect(() => {\n ref.current = value;\n }, [value]); // Only re-run if value changes\n // Return previous value (happens before update in useEffect above)\n return ref.current;\n}\n\n/**\n * The `useEffectDebugger` hook is a wrapper around the `useEffect` hook\n * that logs the dependencies of the effect when they change.\n *\n * Uses the `usePrevious` hook.\n *\n * Source: https://stackoverflow.com/a/59843241/3247715\n */\nexport function useEffectDebugger(\n effectHook: React.EffectCallback,\n dependencies: unknown[],\n dependencyNames: string[] = [],\n) {\n const previousDeps = usePrevious(dependencies);\n\n // oxlint-disable-next-line @typescript-eslint/no-explicit-any\n const changedDeps: any = dependencies.reduce((accum, dependency, index) => {\n if (previousDeps === undefined) {\n return accum;\n }\n if (previousDeps === null) {\n return accum;\n }\n if (dependency !== previousDeps[index]) {\n const keyName = dependencyNames[index] || index;\n return {\n // oxlint-disable-next-line @typescript-eslint/no-explicit-any\n ...(accum as any),\n [keyName]: {\n after: dependency,\n before: previousDeps[index],\n },\n };\n }\n\n return accum;\n }, {});\n\n if (Object.keys(changedDeps).length) {\n console.info('[use-effect-debugger] ', changedDeps);\n }\n\n useEffect(() => {\n return effectHook();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, dependencies);\n}\n\n/**\n * The `useRenderCount` hook returns the number of times a component has rendered.\n */\nexport function useRenderCount() {\n const count = useRef(0);\n\n count.current++;\n\n return count.current;\n}\n\n/**\n * The `useRenderDebugger` outputs to console what props or states are causing a render (or re-render) of a component\n * if all relevant props and states variables are passed to the hook.\n * For debugging purposes only.\n *\n * Howto use:\n * Place the hook at the top of the component you want to debug and call it like this:\n * useRenderDebugger('MyComponent', props);\n *\n * if there are state variables include them as well:\n *\n * useRenderDebugger('MyComponent', { ...props, stateVar1, stateVar2 })
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/hooks/index.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { useEffect, useRef } from 'react';\n\nexport {\n useDebounceValue,\n useWindowSize,\n useOnClickOutside,\n useInterval,\n useMediaQuery,\n useCopyToClipboard,\n useScrollLock,\n useEventListener,\n useResizeObserver,\n} from 'usehooks-ts';\nimport { useDebounceCallback } from './use-debounce-callback';\nexport { useDebounceCallback };\n\n/**\n * Below are hooks that cannot be found in `usehooks-ts`\n * but are used in some projects.\n * 1. usePrevious\n * 2. useEffectDebugger\n * 3. useRenderCount\n */\n\n/**\n * The `usePrevious` hook tracks a variable's previous value in a functional component,\n * useful for comparing current and past values to trigger actions or render changes.\n */\nexport function usePrevious<T>(value: T): T | null {\n // The ref object is a generic container whose current property is mutable\n // and can hold any value, similar to an instance property on a class\n\n const ref = useRef<T>(null);\n // Store current value in ref\n useEffect(() => {\n ref.current = value;\n }, [value]); // Only re-run if value changes\n // Return previous value (happens before update in useEffect above)\n return ref.current;\n}\n\n/**\n * The `useEffectDebugger` hook is a wrapper around the `useEffect` hook\n * that logs the dependencies of the effect when they change.\n *\n * Uses the `usePrevious` hook.\n *\n * Source: https://stackoverflow.com/a/59843241/3247715\n */\nexport function useEffectDebugger(\n effectHook: React.EffectCallback,\n dependencies: unknown[],\n dependencyNames: string[] = [],\n) {\n const previousDeps = usePrevious(dependencies);\n\n // oxlint-disable-next-line @typescript-eslint/no-explicit-any\n const changedDeps: any = dependencies.reduce((accum, dependency, index) => {\n if (previousDeps === undefined) {\n return accum;\n }\n if (previousDeps === null) {\n return accum;\n }\n if (dependency !== previousDeps[index]) {\n const keyName = dependencyNames[index] || index;\n return {\n // oxlint-disable-next-line @typescript-eslint/no-explicit-any\n ...(accum as any),\n [keyName]: {\n after: dependency,\n before: previousDeps[index],\n },\n };\n }\n\n return accum;\n }, {});\n\n if (Object.keys(changedDeps).length) {\n console.info('[use-effect-debugger] ', changedDeps);\n }\n\n useEffect(() => {\n return effectHook();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, dependencies);\n}\n\n/**\n * The `useRenderCount` hook returns the number of times a component has rendered.\n */\nexport function useRenderCount() {\n const count = useRef(0);\n\n count.current++;\n\n return count.current;\n}\n\n/**\n * The `useRenderDebugger` outputs to console what props or states are causing a render (or re-render) of a component\n * if all relevant props and states variables are passed to the hook.\n * For debugging purposes only.\n *\n * Howto use:\n * Place the hook at the top of the component you want to debug and call it like this:\n * useRenderDebugger('MyComponent', props);\n *\n * if there are state variables include them as well:\n *\n * `useRenderDebugger('MyComponent', { ...props, stateVar1, stateVar2 });`\n *\n * @param componentName - Name of the component to debug\n * @param propsAndStates - An object containing all props and states variables of the component\n */\nexport const useRenderDebugger = (\n componentName: string,\n propsAndStates: Record<string, unknown>,\n) => {\n const prev = useRef(propsAndStates);\n\n useEffect(() => {\n const changedPropsOrState: Record<string, { old: unknown; new: unknown }> =\n {};\n\n Object.entries(propsAndStates).forEach(\n ([key, newValue]: [string, unknown]) => {\n if (prev.current[key] !== newValue) {\n changedPropsOrState[key] = {\n new: newValue,\n old: prev.current[key],\n };\n }\n },\n {},\n );\n\n if (Object.keys(changedPropsOrState).length > 0) {\n console.debug(\n `[${componentName}] Re-rendered due to:`,\n changedPropsOrState,\n );\n }\n\n prev.current = propsAndStates;\n });\n};\n"]}
|
|
@@ -104,18 +104,18 @@ const IconButtonBase = (_a) => {
|
|
|
104
104
|
if (!description && !(htmlAttributes === null || htmlAttributes === void 0 ? void 0 : htmlAttributes['aria-label'])) {
|
|
105
105
|
(0, utils_1.needleWarningMessage)('Icon buttons do not have text, be sure to include a description or an aria-label for screen readers link: https://dequeuniversity.com/rules/axe/4.4/button-name?application=axeAPI');
|
|
106
106
|
}
|
|
107
|
-
const handleClick = (
|
|
107
|
+
const handleClick = (event) => {
|
|
108
108
|
if (!isInteractable) {
|
|
109
109
|
// By default, a <button /> element with disabled set to true will not get its
|
|
110
110
|
// on click handler called. To support the same behavior on <a /> tags we
|
|
111
111
|
// swallow the event here when disabled, since the <a /> tag with disabled set to
|
|
112
112
|
// true will have its onClick handler called
|
|
113
|
-
|
|
114
|
-
|
|
113
|
+
event.preventDefault();
|
|
114
|
+
event.stopPropagation();
|
|
115
115
|
return;
|
|
116
116
|
}
|
|
117
117
|
if (onClick) {
|
|
118
|
-
onClick(
|
|
118
|
+
onClick(event);
|
|
119
119
|
}
|
|
120
120
|
};
|
|
121
121
|
const tooltipContent = react_1.default.useMemo(() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonBase.js","sourceRoot":"","sources":["../../../src/icon-button-base/IconButtonBase.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4DAAoC;AACpC,+CAAqC;AAErC,4DAAyD;AAKzD,4CAAwD;AAExD,gCAA6B;AAC7B,wCAAqC;AAoD9B,MAAM,cAAc,GAAG,CAAyC,EAsBtB,EAAE,EAAE;;QAtBkB,EACrE,QAAQ,EACR,EAAE,EACF,iBAAiB,GAAG,SAAS,EAC7B,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,KAAK;IAClB,4FAA4F;IAC5F,QAAQ,GAAG,SAAS,EACpB,WAAW,EACX,mBAAmB,EACnB,YAAY,EACZ,SAAS,EACT,KAAK,EACL,OAAO,GAAG,SAAS,EACnB,cAAc,EACd,OAAO,EACP,GAAG;IACH,oIAAoI;IACpI,cAAc,GAAG,iBAAiB,OAEa,EAD5C,SAAS,cArByD,iPAsBtE,CADa;IAEZ,MAAM,SAAS,GAAsB,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,QAAQ,CAAC;IACpD,MAAM,SAAS,GAAG,IAAA,aAAK,GAAE,CAAC;IAE1B,MAAM,cAAc,GAAG,CAAC,UAAU,IAAI,CAAC,SAAS,CAAC;IAEjD,MAAM,OAAO,GAAG,iBAAiB,KAAK,OAAO,CAAC;IAC9C,MAAM,QAAQ,GAAG,OAAO,KAAK,QAAQ,CAAC;IAEtC,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,cAAc,EAAE,SAAS,EAAE;QACpD,YAAY,EAAE,OAAO,CAAC,QAAQ,CAAC;QAC/B,WAAW,EAAE,OAAO;QACpB,YAAY,EAAE,QAAQ;QACtB,cAAc,EAAE,UAAU;QAC1B,cAAc,EAAE,UAAU;QAC1B,WAAW,EAAE,IAAI,KAAK,OAAO;QAC7B,aAAa,EAAE,SAAS;QACxB,YAAY,EAAE,IAAI,KAAK,QAAQ;QAC/B,WAAW,EAAE,IAAI,KAAK,OAAO;KAC9B,CAAC,CAAC;IAEH,IAAI,OAAO,IAAI,UAAU,EAAE,CAAC;QAC1B,MAAM,IAAI,KAAK,CACb,uFAAuF,CACxF,CAAC;IACJ,CAAC;IAED,IAAI,CAAC,WAAW,IAAI,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAG,YAAY,CAAC,CAAA,EAAE,CAAC;QACpD,IAAA,4BAAoB,EAClB,oLAAoL,CACrL,CAAC;IACJ,CAAC;IAED,MAAM,WAAW,GAAG,
|
|
1
|
+
{"version":3,"file":"IconButtonBase.js","sourceRoot":"","sources":["../../../src/icon-button-base/IconButtonBase.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport React, { useId } from 'react';\n\nimport { ButtonSpinner } from '../_common/ButtonSpinner';\nimport {\n type PolymorphicCommonProps,\n type TooltipObjectProps,\n} from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport { type ButtonSizes } from '../button';\nimport { Kbd } from '../kbd';\nimport { Tooltip } from '../tooltip';\n\n/**\n *\n *\n * Types\n *\n *\n */\n\nexport type IconButtonBaseProps = {\n children?: React.ReactNode;\n\n /** If the icon button is in disabled state */\n isDisabled?: boolean;\n\n /** If the button is doing something Async, it will display a loading spinner */\n isLoading?: boolean;\n\n /** Size of button */\n size?: ButtonSizes;\n\n /** If the button is in floating state */\n isFloating?: boolean;\n\n /** Active - used for open context menus for example */\n isActive?: boolean;\n\n /** A string that will be shown as a tooltip when hovering over the button it also acts as an aria-label- {@link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label} */\n description: string | null;\n\n /** The Kbd components that will be displayed in the tooltip after the description text, this does not include the keyboard shortcut functionality this only displays the Kbd components. */\n descriptionKbdProps?: React.ComponentProps<typeof Kbd>;\n\n /** Variant of the button */\n variant?: 'neutral' | 'danger';\n\n /** Variant of the button */\n iconButtonVariant?: 'default' | 'clean';\n\n /**\n * Props for the tooltip component.\n */\n tooltipProps?: TooltipObjectProps;\n\n /** Click handler */\n onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n\n /** Accessible message for screen readers when the button is in a loading state */\n loadingMessage?: string;\n};\n\nexport const IconButtonBase = <T extends React.ElementType = 'button'>({\n children,\n as,\n iconButtonVariant = 'default',\n isLoading = false,\n isDisabled = false,\n size = 'medium',\n isFloating = false,\n // Does not have a default value to avoid setting aria-pressed to true if not explicitly set\n isActive = undefined,\n description,\n descriptionKbdProps,\n tooltipProps,\n className,\n style,\n variant = 'neutral',\n htmlAttributes,\n onClick,\n ref,\n // TODO v5: maybe update default message to 'Loading'. This value is for backward compatibility with loading spinners old aria-label\n loadingMessage = 'Loading content',\n ...restProps\n}: PolymorphicCommonProps<T, IconButtonBaseProps>) => {\n const Component: React.ElementType = as ?? 'button';\n const loadingId = useId();\n\n const isInteractable = !isDisabled && !isLoading;\n\n const isClean = iconButtonVariant === 'clean';\n const isDanger = variant === 'danger';\n\n const classes = classNames('ndl-icon-btn', className, {\n 'ndl-active': Boolean(isActive),\n 'ndl-clean': isClean,\n 'ndl-danger': isDanger,\n 'ndl-disabled': isDisabled,\n 'ndl-floating': isFloating,\n 'ndl-large': size === 'large',\n 'ndl-loading': isLoading,\n 'ndl-medium': size === 'medium',\n 'ndl-small': size === 'small',\n });\n\n if (isClean && isFloating) {\n throw new Error(\n 'BaseIconButton: Cannot use isFloating and iconButtonVariant=\"clean\" at the same time.',\n );\n }\n\n if (!description && !htmlAttributes?.['aria-label']) {\n needleWarningMessage(\n 'Icon buttons do not have text, be sure to include a description or an aria-label for screen readers link: https://dequeuniversity.com/rules/axe/4.4/button-name?application=axeAPI',\n );\n }\n\n const handleClick = (\n event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n ) => {\n if (!isInteractable) {\n // By default, a <button /> element with disabled set to true will not get its\n // on click handler called. To support the same behavior on <a /> tags we\n // swallow the event here when disabled, since the <a /> tag with disabled set to\n // true will have its onClick handler called\n event.preventDefault();\n event.stopPropagation();\n return;\n }\n\n if (onClick) {\n onClick(event);\n }\n };\n\n const tooltipContent = React.useMemo(() => {\n const descriptionContent = description ?? tooltipProps?.content?.children;\n return (\n <>\n {descriptionContent}\n {descriptionKbdProps && <Kbd {...descriptionKbdProps} />}\n </>\n );\n }, [description, descriptionKbdProps, tooltipProps?.content?.children]);\n\n return (\n <Tooltip\n hoverDelay={{\n close: 0,\n open: 500,\n }}\n isDisabled={description === null || isDisabled}\n type=\"simple\"\n {...tooltipProps?.root}\n >\n <Tooltip.Trigger {...tooltipProps?.trigger} hasButtonWrapper>\n <Component\n type=\"button\"\n onClick={handleClick}\n disabled={isDisabled}\n aria-disabled={!isInteractable}\n aria-label={description}\n aria-pressed={isActive}\n className={classes}\n style={style}\n ref={ref}\n aria-describedby={isLoading ? loadingId : undefined}\n {...restProps}\n {...htmlAttributes}\n >\n <div className=\"ndl-icon-btn-inner\">\n {isLoading ? (\n <ButtonSpinner\n loadingMessage={loadingMessage}\n size=\"small\"\n htmlAttributes={{ id: loadingId }}\n />\n ) : (\n <div className=\"ndl-icon\">{children}</div>\n )}\n </div>\n </Component>\n </Tooltip.Trigger>\n <Tooltip.Content {...tooltipProps?.content}>\n {tooltipContent}\n </Tooltip.Content>\n </Tooltip>\n );\n};\n"]}
|