@carbon/react 1.78.0 → 1.78.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/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +883 -883
- package/es/components/Accordion/AccordionItem.js +2 -2
- package/es/components/Button/Button.d.ts +2 -3
- package/es/components/Button/Button.js +1 -2
- package/es/components/Button/ButtonBase.js +1 -1
- package/es/components/ChatButton/ChatButton.d.ts +2 -3
- package/es/components/ChatButton/ChatButton.js +1 -2
- package/es/components/ComboBox/ComboBox.js +34 -24
- package/es/components/ComposedModal/ComposedModal.js +65 -51
- package/es/components/ContainedList/ContainedListItem/ContainedListItem.d.ts +2 -2
- package/es/components/ContainedList/ContainedListItem/ContainedListItem.js +1 -1
- package/es/components/ContentSwitcher/ContentSwitcher.js +3 -3
- package/es/components/DataTable/TableBatchAction.d.ts +3 -3
- package/es/components/DataTable/TableBatchAction.js +1 -1
- package/es/components/DataTable/TableContainer.d.ts +1 -1
- package/es/components/DataTable/TableContainer.js +3 -3
- package/es/components/DataTable/TableExpandHeader.d.ts +6 -5
- package/es/components/DataTable/TableToolbarMenu.d.ts +2 -2
- package/es/components/DataTable/TableToolbarMenu.js +1 -1
- package/es/components/DatePicker/DatePicker.js +2 -2
- package/es/components/DatePicker/plugins/fixEventsPlugin.js +1 -1
- package/es/components/Dialog/index.d.ts +42 -4
- package/es/components/Dialog/index.js +177 -0
- package/es/components/ExpandableSearch/ExpandableSearch.js +2 -2
- package/es/components/FeatureFlags/index.d.ts +3 -1
- package/es/components/FeatureFlags/index.js +3 -0
- package/es/components/FileUploader/FileUploader.d.ts +1 -1
- package/es/components/FileUploader/FileUploader.js +2 -2
- package/es/components/FileUploader/FileUploaderButton.js +2 -2
- package/es/components/FileUploader/FileUploaderDropContainer.d.ts +1 -1
- package/es/components/FileUploader/FileUploaderDropContainer.js +6 -4
- package/es/components/FileUploader/FileUploaderItem.d.ts +1 -1
- package/es/components/FileUploader/FileUploaderItem.js +2 -2
- package/es/components/Grid/CSSGrid.js +18 -14
- package/es/components/Grid/FlexGrid.js +7 -6
- package/es/components/Grid/GridTypes.d.ts +5 -3
- package/es/components/IconButton/index.js +3 -3
- package/es/components/Layer/index.d.ts +4 -6
- package/es/components/Layer/index.js +5 -6
- package/es/components/Link/Link.d.ts +2 -3
- package/es/components/Link/Link.js +1 -2
- package/es/components/ListBox/ListBoxMenuItem.d.ts +3 -3
- package/es/components/ListBox/ListBoxMenuItem.js +37 -15
- package/es/components/Menu/Menu.js +2 -2
- package/es/components/Menu/MenuItem.d.ts +2 -2
- package/es/components/Menu/MenuItem.js +3 -3
- package/es/components/Modal/Modal.js +121 -49
- package/es/components/ModalWrapper/ModalWrapper.js +1 -1
- package/es/components/MultiSelect/FilterableMultiSelect.js +3 -3
- package/es/components/MultiSelect/MultiSelect.js +2 -2
- package/es/components/Notification/Notification.d.ts +5 -13
- package/es/components/Notification/Notification.js +3 -4
- package/es/components/OverflowMenu/OverflowMenu.d.ts +4 -8
- package/es/components/OverflowMenu/OverflowMenu.js +3 -3
- package/es/components/OverflowMenu/next/index.d.ts +2 -2
- package/es/components/OverflowMenu/next/index.js +1 -1
- package/es/components/OverflowMenuItem/OverflowMenuItem.js +2 -2
- package/es/components/ProgressIndicator/ProgressIndicator.js +2 -2
- package/es/components/RadioTile/RadioTile.js +2 -2
- package/es/components/Search/Search.d.ts +2 -3
- package/es/components/Search/Search.js +4 -6
- package/es/components/Slider/Slider.d.ts +16 -15
- package/es/components/Slider/Slider.js +22 -22
- package/es/components/Tabs/Tabs.d.ts +3 -6
- package/es/components/Tabs/Tabs.js +8 -9
- package/es/components/Tag/DismissibleTag.d.ts +3 -5
- package/es/components/Tag/DismissibleTag.js +1 -2
- package/es/components/Tag/OperationalTag.d.ts +2 -3
- package/es/components/Tag/OperationalTag.js +1 -2
- package/es/components/Tag/SelectableTag.d.ts +3 -5
- package/es/components/Tag/SelectableTag.js +1 -2
- package/es/components/Tag/Tag.d.ts +2 -3
- package/es/components/Tag/Tag.js +1 -2
- package/es/components/Tile/Tile.d.ts +3 -5
- package/es/components/Tile/Tile.js +8 -6
- package/es/components/Toggletip/index.js +2 -2
- package/es/components/Tooltip/DefinitionTooltip.js +2 -2
- package/es/components/Tooltip/Tooltip.d.ts +1 -1
- package/es/components/Tooltip/Tooltip.js +2 -2
- package/es/components/TreeView/TreeNode.d.ts +3 -5
- package/es/components/TreeView/TreeNode.js +3 -4
- package/es/components/TreeView/TreeView.js +2 -2
- package/es/components/UIShell/HeaderContainer.js +2 -2
- package/es/components/UIShell/HeaderMenu.js +2 -2
- package/es/components/UIShell/HeaderPanel.js +2 -2
- package/es/components/UIShell/SideNav.d.ts +1 -1
- package/es/components/UIShell/SideNav.js +2 -2
- package/es/components/UIShell/SideNavHeader.d.ts +2 -3
- package/es/components/UIShell/SideNavHeader.js +1 -2
- package/es/components/UIShell/SideNavLink.d.ts +2 -2
- package/es/components/UIShell/SideNavLink.js +1 -1
- package/es/components/UIShell/SideNavMenu.d.ts +2 -2
- package/es/components/UIShell/SideNavMenu.js +3 -3
- package/es/components/UIShell/SwitcherItem.js +2 -2
- package/es/internal/FloatingMenu.js +4 -4
- package/es/internal/OptimizedResize.d.ts +18 -0
- package/es/internal/OptimizedResize.js +21 -24
- package/es/internal/keyboard/index.d.ts +9 -0
- package/es/internal/keyboard/keys.d.ts +23 -0
- package/es/internal/keyboard/keys.js +2 -2
- package/es/internal/keyboard/match.d.ts +26 -0
- package/es/internal/keyboard/match.js +17 -41
- package/es/internal/keyboard/navigation.d.ts +37 -0
- package/es/internal/keyboard/navigation.js +15 -27
- package/es/internal/useMergedRefs.js +3 -0
- package/lib/components/Accordion/AccordionItem.js +2 -2
- package/lib/components/Button/Button.d.ts +2 -3
- package/lib/components/Button/Button.js +1 -2
- package/lib/components/Button/ButtonBase.js +1 -1
- package/lib/components/ChatButton/ChatButton.d.ts +2 -3
- package/lib/components/ChatButton/ChatButton.js +1 -2
- package/lib/components/ComboBox/ComboBox.js +34 -24
- package/lib/components/ComposedModal/ComposedModal.js +64 -50
- package/lib/components/ContainedList/ContainedListItem/ContainedListItem.d.ts +2 -2
- package/lib/components/ContainedList/ContainedListItem/ContainedListItem.js +1 -1
- package/lib/components/ContentSwitcher/ContentSwitcher.js +3 -3
- package/lib/components/DataTable/TableBatchAction.d.ts +3 -3
- package/lib/components/DataTable/TableBatchAction.js +1 -1
- package/lib/components/DataTable/TableContainer.d.ts +1 -1
- package/lib/components/DataTable/TableContainer.js +3 -3
- package/lib/components/DataTable/TableExpandHeader.d.ts +6 -5
- package/lib/components/DataTable/TableToolbarMenu.d.ts +2 -2
- package/lib/components/DataTable/TableToolbarMenu.js +1 -1
- package/lib/components/DatePicker/DatePicker.js +2 -2
- package/lib/components/DatePicker/plugins/fixEventsPlugin.js +1 -1
- package/lib/components/Dialog/index.d.ts +42 -4
- package/lib/components/Dialog/index.js +190 -0
- package/lib/components/ExpandableSearch/ExpandableSearch.js +2 -2
- package/lib/components/FeatureFlags/index.d.ts +3 -1
- package/lib/components/FeatureFlags/index.js +3 -0
- package/lib/components/FileUploader/FileUploader.d.ts +1 -1
- package/lib/components/FileUploader/FileUploader.js +2 -2
- package/lib/components/FileUploader/FileUploaderButton.js +2 -2
- package/lib/components/FileUploader/FileUploaderDropContainer.d.ts +1 -1
- package/lib/components/FileUploader/FileUploaderDropContainer.js +6 -4
- package/lib/components/FileUploader/FileUploaderItem.d.ts +1 -1
- package/lib/components/FileUploader/FileUploaderItem.js +2 -2
- package/lib/components/Grid/CSSGrid.js +18 -14
- package/lib/components/Grid/FlexGrid.js +7 -6
- package/lib/components/Grid/GridTypes.d.ts +5 -3
- package/lib/components/IconButton/index.js +3 -3
- package/lib/components/Layer/index.d.ts +4 -6
- package/lib/components/Layer/index.js +5 -6
- package/lib/components/Link/Link.d.ts +2 -3
- package/lib/components/Link/Link.js +1 -2
- package/lib/components/ListBox/ListBoxMenuItem.d.ts +3 -3
- package/lib/components/ListBox/ListBoxMenuItem.js +36 -14
- package/lib/components/Menu/Menu.js +2 -2
- package/lib/components/Menu/MenuItem.d.ts +2 -2
- package/lib/components/Menu/MenuItem.js +3 -3
- package/lib/components/Modal/Modal.js +123 -51
- package/lib/components/ModalWrapper/ModalWrapper.js +1 -1
- package/lib/components/MultiSelect/FilterableMultiSelect.js +3 -3
- package/lib/components/MultiSelect/MultiSelect.js +2 -2
- package/lib/components/Notification/Notification.d.ts +5 -13
- package/lib/components/Notification/Notification.js +3 -4
- package/lib/components/OverflowMenu/OverflowMenu.d.ts +4 -8
- package/lib/components/OverflowMenu/OverflowMenu.js +3 -3
- package/lib/components/OverflowMenu/next/index.d.ts +2 -2
- package/lib/components/OverflowMenu/next/index.js +1 -1
- package/lib/components/OverflowMenuItem/OverflowMenuItem.js +2 -2
- package/lib/components/ProgressIndicator/ProgressIndicator.js +2 -2
- package/lib/components/RadioTile/RadioTile.js +2 -2
- package/lib/components/Search/Search.d.ts +2 -3
- package/lib/components/Search/Search.js +4 -6
- package/lib/components/Slider/Slider.d.ts +16 -15
- package/lib/components/Slider/Slider.js +22 -22
- package/lib/components/Tabs/Tabs.d.ts +3 -6
- package/lib/components/Tabs/Tabs.js +8 -9
- package/lib/components/Tag/DismissibleTag.d.ts +3 -5
- package/lib/components/Tag/DismissibleTag.js +1 -2
- package/lib/components/Tag/OperationalTag.d.ts +2 -3
- package/lib/components/Tag/OperationalTag.js +1 -2
- package/lib/components/Tag/SelectableTag.d.ts +3 -5
- package/lib/components/Tag/SelectableTag.js +1 -2
- package/lib/components/Tag/Tag.d.ts +2 -3
- package/lib/components/Tag/Tag.js +1 -2
- package/lib/components/Tile/Tile.d.ts +3 -5
- package/lib/components/Tile/Tile.js +8 -6
- package/lib/components/Toggletip/index.js +2 -2
- package/lib/components/Tooltip/DefinitionTooltip.js +2 -2
- package/lib/components/Tooltip/Tooltip.d.ts +1 -1
- package/lib/components/Tooltip/Tooltip.js +2 -2
- package/lib/components/TreeView/TreeNode.d.ts +3 -5
- package/lib/components/TreeView/TreeNode.js +3 -4
- package/lib/components/TreeView/TreeView.js +2 -2
- package/lib/components/UIShell/HeaderContainer.js +2 -2
- package/lib/components/UIShell/HeaderMenu.js +2 -2
- package/lib/components/UIShell/HeaderPanel.js +2 -2
- package/lib/components/UIShell/SideNav.d.ts +1 -1
- package/lib/components/UIShell/SideNav.js +2 -2
- package/lib/components/UIShell/SideNavHeader.d.ts +2 -3
- package/lib/components/UIShell/SideNavHeader.js +1 -2
- package/lib/components/UIShell/SideNavLink.d.ts +2 -2
- package/lib/components/UIShell/SideNavLink.js +1 -1
- package/lib/components/UIShell/SideNavMenu.d.ts +2 -2
- package/lib/components/UIShell/SideNavMenu.js +3 -3
- package/lib/components/UIShell/SwitcherItem.js +2 -2
- package/lib/internal/FloatingMenu.js +5 -5
- package/lib/internal/OptimizedResize.d.ts +18 -0
- package/lib/internal/OptimizedResize.js +21 -24
- package/lib/internal/keyboard/index.d.ts +9 -0
- package/lib/internal/keyboard/keys.d.ts +23 -0
- package/lib/internal/keyboard/keys.js +2 -2
- package/lib/internal/keyboard/match.d.ts +26 -0
- package/lib/internal/keyboard/match.js +17 -41
- package/lib/internal/keyboard/navigation.d.ts +37 -0
- package/lib/internal/keyboard/navigation.js +15 -27
- package/lib/internal/useMergedRefs.js +3 -0
- package/package.json +6 -6
- package/scss/components/dialog/_dialog.scss +9 -0
- package/scss/components/dialog/_index.scss +9 -0
- package/telemetry.yml +1 -0
- package/es/components/Modal/next/index.d.ts +0 -171
- package/es/internal/focus/index.js +0 -15
- package/lib/components/Modal/next/index.d.ts +0 -171
- package/lib/internal/focus/index.js +0 -19
|
@@ -14,12 +14,12 @@ var iconsReact = require('@carbon/icons-react');
|
|
|
14
14
|
var cx = require('classnames');
|
|
15
15
|
var React = require('react');
|
|
16
16
|
var PropTypes = require('prop-types');
|
|
17
|
+
var keys = require('../../internal/keyboard/keys.js');
|
|
18
|
+
var match = require('../../internal/keyboard/match.js');
|
|
17
19
|
var AriaPropTypes = require('../../prop-types/AriaPropTypes.js');
|
|
18
20
|
var usePrefix = require('../../internal/usePrefix.js');
|
|
19
21
|
var deprecate = require('../../prop-types/deprecate.js');
|
|
20
22
|
var events = require('../../tools/events.js');
|
|
21
|
-
var match = require('../../internal/keyboard/match.js');
|
|
22
|
-
var keys = require('../../internal/keyboard/keys.js');
|
|
23
23
|
|
|
24
24
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
25
25
|
|
|
@@ -14,10 +14,10 @@ var cx = require('classnames');
|
|
|
14
14
|
var PropTypes = require('prop-types');
|
|
15
15
|
var React = require('react');
|
|
16
16
|
var usePrefix = require('../../internal/usePrefix.js');
|
|
17
|
+
var keys = require('../../internal/keyboard/keys.js');
|
|
18
|
+
var match = require('../../internal/keyboard/match.js');
|
|
17
19
|
var useEvent = require('../../internal/useEvent.js');
|
|
18
20
|
var useMergedRefs = require('../../internal/useMergedRefs.js');
|
|
19
|
-
var match = require('../../internal/keyboard/match.js');
|
|
20
|
-
var keys = require('../../internal/keyboard/keys.js');
|
|
21
21
|
|
|
22
22
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
23
23
|
|
|
@@ -16,13 +16,13 @@ var PropTypes = require('prop-types');
|
|
|
16
16
|
var AriaPropTypes = require('../../prop-types/AriaPropTypes.js');
|
|
17
17
|
var _utils = require('./_utils.js');
|
|
18
18
|
var usePrefix = require('../../internal/usePrefix.js');
|
|
19
|
+
var keys = require('../../internal/keyboard/keys.js');
|
|
20
|
+
var match = require('../../internal/keyboard/match.js');
|
|
19
21
|
var useMergedRefs = require('../../internal/useMergedRefs.js');
|
|
20
22
|
var useEvent = require('../../internal/useEvent.js');
|
|
21
23
|
var useDelayedState = require('../../internal/useDelayedState.js');
|
|
22
24
|
var layout = require('@carbon/layout');
|
|
23
25
|
var useMatchMedia = require('../../internal/useMatchMedia.js');
|
|
24
|
-
var match = require('../../internal/keyboard/match.js');
|
|
25
|
-
var keys = require('../../internal/keyboard/keys.js');
|
|
26
26
|
|
|
27
27
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
28
28
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Copyright IBM Corp. 2016,
|
|
2
|
+
* Copyright IBM Corp. 2016, 2025
|
|
3
3
|
*
|
|
4
4
|
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
@@ -20,8 +20,7 @@ export interface SideNavHeaderProps {
|
|
|
20
20
|
*/
|
|
21
21
|
isSideNavExpanded?: boolean;
|
|
22
22
|
/**
|
|
23
|
-
*
|
|
24
|
-
* a React class.
|
|
23
|
+
* A component used to render an icon.
|
|
25
24
|
*/
|
|
26
25
|
renderIcon: React.ComponentType;
|
|
27
26
|
}
|
|
@@ -49,8 +49,7 @@ SideNavHeader.propTypes = {
|
|
|
49
49
|
*/
|
|
50
50
|
isSideNavExpanded: PropTypes__default["default"].bool,
|
|
51
51
|
/**
|
|
52
|
-
*
|
|
53
|
-
* a React class.
|
|
52
|
+
* A component used to render an icon.
|
|
54
53
|
*/
|
|
55
54
|
// @ts-expect-error - PropTypes are unable to cover this case.
|
|
56
55
|
renderIcon: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].object]).isRequired
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Copyright IBM Corp. 2016,
|
|
2
|
+
* Copyright IBM Corp. 2016, 2025
|
|
3
3
|
*
|
|
4
4
|
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
@@ -37,7 +37,7 @@ export type SideNavLinkProps<E extends ElementType> = LinkProps<E> & {
|
|
|
37
37
|
*/
|
|
38
38
|
large?: boolean;
|
|
39
39
|
/**
|
|
40
|
-
*
|
|
40
|
+
* A component used to render an icon.
|
|
41
41
|
*/
|
|
42
42
|
renderIcon?: ComponentType;
|
|
43
43
|
/**
|
|
@@ -79,7 +79,7 @@ SideNavLink.propTypes = {
|
|
|
79
79
|
*/
|
|
80
80
|
large: PropTypes__default["default"].bool,
|
|
81
81
|
/**
|
|
82
|
-
*
|
|
82
|
+
* A component used to render an icon.
|
|
83
83
|
*/
|
|
84
84
|
// @ts-expect-error - PropTypes are unable to cover this case.
|
|
85
85
|
renderIcon: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].object]),
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Copyright IBM Corp. 2016,
|
|
2
|
+
* Copyright IBM Corp. 2016, 2025
|
|
3
3
|
*
|
|
4
4
|
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
@@ -27,7 +27,7 @@ export interface SideNavMenuProps {
|
|
|
27
27
|
*/
|
|
28
28
|
large?: boolean;
|
|
29
29
|
/**
|
|
30
|
-
* A
|
|
30
|
+
* A component used to render an icon.
|
|
31
31
|
*/
|
|
32
32
|
renderIcon?: React.ComponentType;
|
|
33
33
|
/**
|
|
@@ -14,10 +14,10 @@ var cx = require('classnames');
|
|
|
14
14
|
var PropTypes = require('prop-types');
|
|
15
15
|
var React = require('react');
|
|
16
16
|
var SideNavIcon = require('./SideNavIcon.js');
|
|
17
|
+
var keys = require('../../internal/keyboard/keys.js');
|
|
18
|
+
var match = require('../../internal/keyboard/match.js');
|
|
17
19
|
var usePrefix = require('../../internal/usePrefix.js');
|
|
18
20
|
var SideNav = require('./SideNav.js');
|
|
19
|
-
var match = require('../../internal/keyboard/match.js');
|
|
20
|
-
var keys = require('../../internal/keyboard/keys.js');
|
|
21
21
|
|
|
22
22
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
23
23
|
|
|
@@ -120,7 +120,7 @@ SideNavMenu.propTypes = {
|
|
|
120
120
|
*/
|
|
121
121
|
large: PropTypes__default["default"].bool,
|
|
122
122
|
/**
|
|
123
|
-
*
|
|
123
|
+
* A component used to render an icon.
|
|
124
124
|
*/
|
|
125
125
|
// @ts-expect-error - PropTypes are unable to cover this case.
|
|
126
126
|
renderIcon: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].object]),
|
|
@@ -15,9 +15,9 @@ var cx = require('classnames');
|
|
|
15
15
|
var PropTypes = require('prop-types');
|
|
16
16
|
var Link = require('./Link.js');
|
|
17
17
|
var usePrefix = require('../../internal/usePrefix.js');
|
|
18
|
-
var AriaPropTypes = require('../../prop-types/AriaPropTypes.js');
|
|
19
|
-
var match = require('../../internal/keyboard/match.js');
|
|
20
18
|
var keys = require('../../internal/keyboard/keys.js');
|
|
19
|
+
var match = require('../../internal/keyboard/match.js');
|
|
20
|
+
var AriaPropTypes = require('../../prop-types/AriaPropTypes.js');
|
|
21
21
|
|
|
22
22
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
23
23
|
|
|
@@ -13,13 +13,13 @@ var React = require('react');
|
|
|
13
13
|
var FeatureFlags = require('@carbon/feature-flags');
|
|
14
14
|
var ReactDOM = require('react-dom');
|
|
15
15
|
var window = require('window-or-global');
|
|
16
|
-
var
|
|
16
|
+
var keys = require('./keyboard/keys.js');
|
|
17
|
+
var match = require('./keyboard/match.js');
|
|
17
18
|
var navigation = require('./keyboard/navigation.js');
|
|
19
|
+
var OptimizedResize = require('./OptimizedResize.js');
|
|
18
20
|
var usePrefix = require('./usePrefix.js');
|
|
19
21
|
var warning = require('./warning.js');
|
|
20
22
|
var wrapFocus = require('./wrapFocus.js');
|
|
21
|
-
var match = require('./keyboard/match.js');
|
|
22
|
-
var keys = require('./keyboard/keys.js');
|
|
23
23
|
|
|
24
24
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
25
25
|
|
|
@@ -230,11 +230,11 @@ const FloatingMenu = _ref2 => {
|
|
|
230
230
|
|
|
231
231
|
// Attach a resize listener.
|
|
232
232
|
React.useEffect(() => {
|
|
233
|
-
const resizeHandler = OptimizedResize
|
|
233
|
+
const resizeHandler = OptimizedResize.OptimizedResize.add(() => {
|
|
234
234
|
updateMenuPosition();
|
|
235
235
|
});
|
|
236
236
|
return () => {
|
|
237
|
-
resizeHandler.
|
|
237
|
+
resizeHandler.remove();
|
|
238
238
|
};
|
|
239
239
|
}, [triggerRef, menuOffset, menuDirection, flipped, target, updateOrientation]);
|
|
240
240
|
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2025
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
/**
|
|
8
|
+
* A callback function to be executed on `resize`.
|
|
9
|
+
*/
|
|
10
|
+
type Callback = () => void;
|
|
11
|
+
export declare const OptimizedResize: {
|
|
12
|
+
/** Adds a callback function to be executed on window `resize`. */
|
|
13
|
+
add: (callback: Callback) => {
|
|
14
|
+
/** Removes the callback. */
|
|
15
|
+
remove: () => void;
|
|
16
|
+
};
|
|
17
|
+
};
|
|
18
|
+
export {};
|
|
@@ -16,44 +16,42 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
16
16
|
var window__default = /*#__PURE__*/_interopDefaultLegacy(window);
|
|
17
17
|
|
|
18
18
|
// mdn resize function
|
|
19
|
-
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* A callback function to be executed on `resize`.
|
|
22
|
+
*/
|
|
23
|
+
|
|
24
|
+
const OptimizedResize = (() => {
|
|
20
25
|
const callbacks = [];
|
|
21
26
|
let running = false;
|
|
22
|
-
|
|
23
|
-
// run the actual callbacks
|
|
24
|
-
function runCallbacks() {
|
|
27
|
+
const runCallbacks = () => {
|
|
25
28
|
callbacks.forEach(callback => {
|
|
26
29
|
callback();
|
|
27
30
|
});
|
|
28
31
|
running = false;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
// fired on resize event
|
|
32
|
-
function resize() {
|
|
32
|
+
};
|
|
33
|
+
const handleResize = () => {
|
|
33
34
|
if (!running) {
|
|
34
35
|
running = true;
|
|
35
36
|
window__default["default"].requestAnimationFrame(runCallbacks);
|
|
36
37
|
}
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
const index = callbacks.indexOf(callback);
|
|
43
|
-
if (index < 0) {
|
|
44
|
-
callbacks.push(callback);
|
|
45
|
-
}
|
|
38
|
+
};
|
|
39
|
+
const addCallback = callback => {
|
|
40
|
+
const index = callbacks.indexOf(callback);
|
|
41
|
+
if (index < 0) {
|
|
42
|
+
callbacks.push(callback);
|
|
46
43
|
}
|
|
47
|
-
}
|
|
44
|
+
};
|
|
48
45
|
return {
|
|
49
|
-
|
|
46
|
+
/** Adds a callback function to be executed on window `resize`. */
|
|
50
47
|
add: callback => {
|
|
51
48
|
if (!callbacks.length) {
|
|
52
|
-
window__default["default"].addEventListener('resize',
|
|
49
|
+
window__default["default"].addEventListener('resize', handleResize);
|
|
53
50
|
}
|
|
54
51
|
addCallback(callback);
|
|
55
52
|
return {
|
|
56
|
-
|
|
53
|
+
/** Removes the callback. */
|
|
54
|
+
remove: () => {
|
|
57
55
|
const index = callbacks.indexOf(callback);
|
|
58
56
|
if (index >= 0) {
|
|
59
57
|
callbacks.splice(index, 1);
|
|
@@ -62,7 +60,6 @@ const OptimizedResize = function optimizedResize() {
|
|
|
62
60
|
};
|
|
63
61
|
}
|
|
64
62
|
};
|
|
65
|
-
}();
|
|
66
|
-
var OptimizedResize$1 = OptimizedResize;
|
|
63
|
+
})();
|
|
67
64
|
|
|
68
|
-
exports
|
|
65
|
+
exports.OptimizedResize = OptimizedResize;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2025
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
export * as keys from './keys';
|
|
8
|
+
export * from './match';
|
|
9
|
+
export * from './navigation';
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2025
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
import { KeyboardEvent } from 'react';
|
|
8
|
+
export type Key = Pick<KeyboardEvent, 'which' | 'keyCode' | 'code'> & {
|
|
9
|
+
key?: string | string[];
|
|
10
|
+
};
|
|
11
|
+
export declare const Tab: Key;
|
|
12
|
+
export declare const Enter: Key;
|
|
13
|
+
export declare const Escape: Key;
|
|
14
|
+
export declare const Space: Key;
|
|
15
|
+
export declare const PageUp: Key;
|
|
16
|
+
export declare const PageDown: Key;
|
|
17
|
+
export declare const End: Key;
|
|
18
|
+
export declare const Home: Key;
|
|
19
|
+
export declare const ArrowLeft: Key;
|
|
20
|
+
export declare const ArrowUp: Key;
|
|
21
|
+
export declare const ArrowRight: Key;
|
|
22
|
+
export declare const ArrowDown: Key;
|
|
23
|
+
export declare const Delete: Key;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2025
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
import type { KeyboardEvent as ReactKeyboardEvent } from 'react';
|
|
8
|
+
import type { Key } from './keys';
|
|
9
|
+
/**
|
|
10
|
+
* Check to see if at least one key code matches the key code of the
|
|
11
|
+
* given event.
|
|
12
|
+
*
|
|
13
|
+
* @param event - The event to test.
|
|
14
|
+
* @param keysToMatch - An array of key definitions to match against.
|
|
15
|
+
* @returns `true` if one of the keys matches.
|
|
16
|
+
*/
|
|
17
|
+
export declare const matches: (event: ReactKeyboardEvent | KeyboardEvent, keysToMatch: Key[]) => boolean;
|
|
18
|
+
/**
|
|
19
|
+
* Check to see if the given key matches the corresponding keyboard event. Also
|
|
20
|
+
* supports passing in the value directly if you can't use the given event.
|
|
21
|
+
*
|
|
22
|
+
* @param eventOrCode - A `KeyboardEvent`, a number, or a string value.
|
|
23
|
+
* @param keyObj - An object with key properties to match against.
|
|
24
|
+
* @returns `true` if the event or code matches the key definition.
|
|
25
|
+
*/
|
|
26
|
+
export declare const match: (eventOrCode: ReactKeyboardEvent | KeyboardEvent | number | string, { key, which, keyCode, code }: Key) => boolean;
|
|
@@ -9,65 +9,38 @@
|
|
|
9
9
|
|
|
10
10
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
11
11
|
|
|
12
|
-
/**
|
|
13
|
-
* @typedef Key
|
|
14
|
-
* @property key {Array<string>|string}
|
|
15
|
-
* @property which {number}
|
|
16
|
-
* @property keyCode {number}
|
|
17
|
-
*/
|
|
18
|
-
|
|
19
12
|
/**
|
|
20
13
|
* Check to see if at least one key code matches the key code of the
|
|
21
14
|
* given event.
|
|
22
15
|
*
|
|
23
|
-
* @
|
|
24
|
-
*
|
|
25
|
-
*
|
|
26
|
-
*
|
|
27
|
-
* function handleOnKeyDown(event) {
|
|
28
|
-
* if (matches(event, [keys.Enter, keys.Space]) {
|
|
29
|
-
* // ...
|
|
30
|
-
* }
|
|
31
|
-
* }
|
|
32
|
-
*
|
|
33
|
-
* @param {Event|React.SyntheticEvent} event
|
|
34
|
-
* @param {Array<Key>} keysToMatch
|
|
35
|
-
* @returns {boolean}
|
|
16
|
+
* @param event - The event to test.
|
|
17
|
+
* @param keysToMatch - An array of key definitions to match against.
|
|
18
|
+
* @returns `true` if one of the keys matches.
|
|
36
19
|
*/
|
|
37
|
-
|
|
20
|
+
const matches = (event, keysToMatch) => {
|
|
38
21
|
for (let i = 0; i < keysToMatch.length; i++) {
|
|
39
22
|
if (match(event, keysToMatch[i])) {
|
|
40
23
|
return true;
|
|
41
24
|
}
|
|
42
25
|
}
|
|
43
26
|
return false;
|
|
44
|
-
}
|
|
27
|
+
};
|
|
45
28
|
|
|
46
29
|
/**
|
|
47
30
|
* Check to see if the given key matches the corresponding keyboard event. Also
|
|
48
|
-
* supports passing in the value directly if you can't
|
|
49
|
-
*
|
|
50
|
-
* @example
|
|
51
|
-
* import * as keys from '../keys';
|
|
52
|
-
* import { matches } from '../match';
|
|
53
|
-
*
|
|
54
|
-
* function handleOnKeyDown(event) {
|
|
55
|
-
* if (match(event, keys.Enter) {
|
|
56
|
-
* // ...
|
|
57
|
-
* }
|
|
58
|
-
* }
|
|
31
|
+
* supports passing in the value directly if you can't use the given event.
|
|
59
32
|
*
|
|
60
|
-
* @param
|
|
61
|
-
* @param
|
|
62
|
-
* @returns
|
|
33
|
+
* @param eventOrCode - A `KeyboardEvent`, a number, or a string value.
|
|
34
|
+
* @param keyObj - An object with key properties to match against.
|
|
35
|
+
* @returns `true` if the event or code matches the key definition.
|
|
63
36
|
*/
|
|
64
|
-
|
|
37
|
+
const match = (eventOrCode, _ref) => {
|
|
65
38
|
let {
|
|
66
39
|
key,
|
|
67
40
|
which,
|
|
68
41
|
keyCode,
|
|
69
42
|
code
|
|
70
|
-
} =
|
|
43
|
+
} = _ref;
|
|
71
44
|
if (typeof eventOrCode === 'string') {
|
|
72
45
|
return eventOrCode === key;
|
|
73
46
|
}
|
|
@@ -75,10 +48,13 @@ function match(eventOrCode) {
|
|
|
75
48
|
return eventOrCode === which || eventOrCode === keyCode;
|
|
76
49
|
}
|
|
77
50
|
if (eventOrCode.key && Array.isArray(key)) {
|
|
78
|
-
return key.
|
|
51
|
+
return key.includes(eventOrCode.key);
|
|
79
52
|
}
|
|
80
|
-
return eventOrCode.key === key ||
|
|
81
|
-
|
|
53
|
+
return eventOrCode.key === key ||
|
|
54
|
+
// TODO: When can these checks for deprecated properties be deleted?
|
|
55
|
+
// Presumably, the `Key` type should also be pruned of these properties.
|
|
56
|
+
eventOrCode.which === which || eventOrCode.keyCode === keyCode || eventOrCode.code === code;
|
|
57
|
+
};
|
|
82
58
|
|
|
83
59
|
exports.match = match;
|
|
84
60
|
exports.matches = matches;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2025
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
import { KeyboardEvent } from 'react';
|
|
8
|
+
/**
|
|
9
|
+
* A "ring buffer" function that takes an array and, depending on an ArrowRight
|
|
10
|
+
* or ArrowLeft key input, loops from last index to first or first index to last.
|
|
11
|
+
*
|
|
12
|
+
* @param key - the left or right arrow key (KeyboardEvent, number, or string)
|
|
13
|
+
* @param index - the current index in the array
|
|
14
|
+
* @param arrayLength - the total length of the array
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* getNextIndex(keyCodes.RIGHT, 0, 4)
|
|
18
|
+
*/
|
|
19
|
+
export declare const getNextIndex: (key: KeyboardEvent | number | string, index: number, arrayLength: number) => number | undefined;
|
|
20
|
+
/**
|
|
21
|
+
* A flag `node.compareDocumentPosition(target)` returns that indicates
|
|
22
|
+
* `target` is located earlier than `node` in the document or `target` contains `node`.
|
|
23
|
+
*/
|
|
24
|
+
export declare const DOCUMENT_POSITION_BROAD_PRECEDING: number;
|
|
25
|
+
/**
|
|
26
|
+
* A flag `node.compareDocumentPosition(target)` returns that indicates
|
|
27
|
+
* `target` is located later than `node` in the document or `node` contains `target`.
|
|
28
|
+
*/
|
|
29
|
+
export declare const DOCUMENT_POSITION_BROAD_FOLLOWING: number;
|
|
30
|
+
/**
|
|
31
|
+
* CSS selector that selects major nodes that are sequentially focusable.
|
|
32
|
+
*/
|
|
33
|
+
export declare const selectorTabbable = "\n a[href], area[href], input:not([disabled]):not([tabindex='-1']),\n button:not([disabled]):not([tabindex='-1']),select:not([disabled]):not([tabindex='-1']),\n textarea:not([disabled]):not([tabindex='-1']),\n iframe, object, embed, *[tabindex]:not([tabindex='-1']):not([disabled]), *[contenteditable=true]\n";
|
|
34
|
+
/**
|
|
35
|
+
* CSS selector that selects major nodes that are click focusable.
|
|
36
|
+
*/
|
|
37
|
+
export declare const selectorFocusable = "\n a[href], area[href], input:not([disabled]),\n button:not([disabled]),select:not([disabled]),\n textarea:not([disabled]),\n iframe, object, embed, *[tabindex]:not([disabled]), *[contenteditable=true]\n";
|
|
@@ -13,21 +13,16 @@ var keys = require('./keys.js');
|
|
|
13
13
|
var match = require('./match.js');
|
|
14
14
|
|
|
15
15
|
/**
|
|
16
|
-
*
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* A "ring buffer" function that takes an array and depending on an ArrowRight
|
|
21
|
-
* or ArrowLeft key input loops from last index to first or first index to last.
|
|
16
|
+
* A "ring buffer" function that takes an array and, depending on an ArrowRight
|
|
17
|
+
* or ArrowLeft key input, loops from last index to first or first index to last.
|
|
22
18
|
*
|
|
23
|
-
* @param
|
|
24
|
-
* @param
|
|
25
|
-
* @param
|
|
19
|
+
* @param key - the left or right arrow key (KeyboardEvent, number, or string)
|
|
20
|
+
* @param index - the current index in the array
|
|
21
|
+
* @param arrayLength - the total length of the array
|
|
26
22
|
*
|
|
27
23
|
* @example
|
|
28
|
-
*
|
|
24
|
+
* getNextIndex(keyCodes.RIGHT, 0, 4)
|
|
29
25
|
*/
|
|
30
|
-
|
|
31
26
|
const getNextIndex = (key, index, arrayLength) => {
|
|
32
27
|
if (match.match(key, keys.ArrowRight)) {
|
|
33
28
|
return (index + 1) % arrayLength;
|
|
@@ -35,30 +30,23 @@ const getNextIndex = (key, index, arrayLength) => {
|
|
|
35
30
|
if (match.match(key, keys.ArrowLeft)) {
|
|
36
31
|
return (index + arrayLength - 1) % arrayLength;
|
|
37
32
|
}
|
|
33
|
+
return;
|
|
38
34
|
};
|
|
39
35
|
|
|
40
36
|
/**
|
|
41
|
-
* A flag `node.compareDocumentPosition(target)` returns
|
|
42
|
-
*
|
|
37
|
+
* A flag `node.compareDocumentPosition(target)` returns that indicates
|
|
38
|
+
* `target` is located earlier than `node` in the document or `target` contains `node`.
|
|
43
39
|
*/
|
|
44
|
-
const DOCUMENT_POSITION_BROAD_PRECEDING =
|
|
45
|
-
// Checks `typeof Node` for `react-docgen`
|
|
46
|
-
typeof Node !== 'undefined' &&
|
|
47
|
-
// eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope
|
|
48
|
-
Node.DOCUMENT_POSITION_PRECEDING | Node.DOCUMENT_POSITION_CONTAINS;
|
|
40
|
+
const DOCUMENT_POSITION_BROAD_PRECEDING = typeof Node !== 'undefined' ? Node.DOCUMENT_POSITION_PRECEDING | Node.DOCUMENT_POSITION_CONTAINS : 0;
|
|
49
41
|
|
|
50
42
|
/**
|
|
51
|
-
* A flag `node.compareDocumentPosition(target)` returns
|
|
52
|
-
*
|
|
43
|
+
* A flag `node.compareDocumentPosition(target)` returns that indicates
|
|
44
|
+
* `target` is located later than `node` in the document or `node` contains `target`.
|
|
53
45
|
*/
|
|
54
|
-
const DOCUMENT_POSITION_BROAD_FOLLOWING =
|
|
55
|
-
// Checks `typeof Node` for `react-docgen`
|
|
56
|
-
typeof Node !== 'undefined' &&
|
|
57
|
-
// eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope
|
|
58
|
-
Node.DOCUMENT_POSITION_FOLLOWING | Node.DOCUMENT_POSITION_CONTAINED_BY;
|
|
46
|
+
const DOCUMENT_POSITION_BROAD_FOLLOWING = typeof Node !== 'undefined' ? Node.DOCUMENT_POSITION_FOLLOWING | Node.DOCUMENT_POSITION_CONTAINED_BY : 0;
|
|
59
47
|
|
|
60
48
|
/**
|
|
61
|
-
* CSS selector that selects major nodes that are
|
|
49
|
+
* CSS selector that selects major nodes that are sequentially focusable.
|
|
62
50
|
*/
|
|
63
51
|
const selectorTabbable = `
|
|
64
52
|
a[href], area[href], input:not([disabled]):not([tabindex='-1']),
|
|
@@ -68,7 +56,7 @@ const selectorTabbable = `
|
|
|
68
56
|
`;
|
|
69
57
|
|
|
70
58
|
/**
|
|
71
|
-
* CSS selector that selects major nodes that are click focusable
|
|
59
|
+
* CSS selector that selects major nodes that are click focusable.
|
|
72
60
|
*/
|
|
73
61
|
const selectorFocusable = `
|
|
74
62
|
a[href], area[href], input:not([disabled]),
|
|
@@ -11,6 +11,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
11
11
|
|
|
12
12
|
var React = require('react');
|
|
13
13
|
|
|
14
|
+
// TODO: Investigate updating this hook based on the following code from
|
|
15
|
+
// https://github.com/carbon-design-system/carbon/pull/18611:
|
|
16
|
+
// https://github.com/adamalston/carbon/blob/dd403b6b10de3d8a6ccd8d2e21174c908c1e890a/packages/react/src/components/ListBox/ListBoxMenuItem.tsx#L23-L46
|
|
14
17
|
/**
|
|
15
18
|
* Combine multiple refs into a single ref. This use useful when you have two
|
|
16
19
|
* refs from both `React.forwardRef` and `useRef` that you would like to add to
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@carbon/react",
|
|
3
3
|
"description": "React components for the Carbon Design System",
|
|
4
|
-
"version": "1.78.
|
|
4
|
+
"version": "1.78.1",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "lib/index.js",
|
|
7
7
|
"types": "lib/index.d.ts",
|
|
@@ -51,10 +51,10 @@
|
|
|
51
51
|
},
|
|
52
52
|
"dependencies": {
|
|
53
53
|
"@babel/runtime": "^7.24.7",
|
|
54
|
-
"@carbon/feature-flags": "^0.24.
|
|
54
|
+
"@carbon/feature-flags": "^0.24.1",
|
|
55
55
|
"@carbon/icons-react": "^11.57.0",
|
|
56
|
-
"@carbon/layout": "^11.30.
|
|
57
|
-
"@carbon/styles": "^1.77.
|
|
56
|
+
"@carbon/layout": "^11.30.1",
|
|
57
|
+
"@carbon/styles": "^1.77.1",
|
|
58
58
|
"@floating-ui/react": "^0.27.4",
|
|
59
59
|
"@ibm/telemetry-js": "^1.5.0",
|
|
60
60
|
"classnames": "2.5.1",
|
|
@@ -79,7 +79,7 @@
|
|
|
79
79
|
"@babel/preset-react": "^7.24.7",
|
|
80
80
|
"@babel/preset-typescript": "^7.24.7",
|
|
81
81
|
"@carbon/test-utils": "^10.35.0",
|
|
82
|
-
"@carbon/themes": "^11.48.
|
|
82
|
+
"@carbon/themes": "^11.48.1",
|
|
83
83
|
"@figma/code-connect": "^1.2.4",
|
|
84
84
|
"@rollup/plugin-babel": "^6.0.0",
|
|
85
85
|
"@rollup/plugin-commonjs": "^28.0.0",
|
|
@@ -146,5 +146,5 @@
|
|
|
146
146
|
"**/*.scss",
|
|
147
147
|
"**/*.css"
|
|
148
148
|
],
|
|
149
|
-
"gitHead": "
|
|
149
|
+
"gitHead": "538413f7766dea6ef4bc4eb5e752b0119779f10a"
|
|
150
150
|
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
// Code generated by @carbon/react. DO NOT EDIT.
|
|
2
|
+
//
|
|
3
|
+
// Copyright IBM Corp. 2018, 2025
|
|
4
|
+
//
|
|
5
|
+
// This source code is licensed under the Apache-2.0 license found in the
|
|
6
|
+
// LICENSE file in the root directory of this source tree.
|
|
7
|
+
//
|
|
8
|
+
|
|
9
|
+
@forward '@carbon/styles/scss/components/dialog/dialog';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
// Code generated by @carbon/react. DO NOT EDIT.
|
|
2
|
+
//
|
|
3
|
+
// Copyright IBM Corp. 2018, 2025
|
|
4
|
+
//
|
|
5
|
+
// This source code is licensed under the Apache-2.0 license found in the
|
|
6
|
+
// LICENSE file in the root directory of this source tree.
|
|
7
|
+
//
|
|
8
|
+
|
|
9
|
+
@forward '@carbon/styles/scss/components/dialog';
|