carbon-react 106.6.10 → 107.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm/__internal__/click-away-wrapper/click-away-wrapper.component.d.ts +12 -0
- package/esm/__internal__/click-away-wrapper/click-away-wrapper.component.js +43 -0
- package/esm/__internal__/click-away-wrapper/index.d.ts +2 -0
- package/esm/__internal__/click-away-wrapper/index.js +1 -0
- package/esm/__internal__/focus-trap/focus-trap-utils.js +25 -1
- package/esm/__internal__/focus-trap/focus-trap.component.d.ts +3 -1
- package/esm/__internal__/focus-trap/focus-trap.component.js +44 -12
- package/esm/{components/radio-button → __internal__/radio-button-mapper}/radio-button-mapper.component.d.ts +0 -0
- package/esm/{components/radio-button → __internal__/radio-button-mapper}/radio-button-mapper.component.js +0 -0
- package/esm/components/advanced-color-picker/advanced-color-picker.component.js +5 -5
- package/esm/components/badge/badge.style.d.ts +1 -1
- package/esm/components/button/button.component.d.ts +1 -3
- package/esm/components/button/button.component.js +1 -12
- package/esm/components/button/button.style.d.ts +1 -1
- package/esm/components/button-toggle-group/button-toggle-group.component.js +1 -1
- package/esm/components/confirm/confirm.component.d.ts +1 -5
- package/esm/components/confirm/confirm.component.js +2 -14
- package/esm/components/confirm/confirm.d.ts +0 -2
- package/esm/components/date/date.component.js +19 -20
- package/esm/components/dialog/dialog.component.js +4 -3
- package/esm/components/dialog-full-screen/content.style.js +4 -10
- package/esm/components/dialog-full-screen/dialog-full-screen.component.js +4 -3
- package/esm/components/heading/heading.component.d.ts +27 -52
- package/esm/components/heading/heading.component.js +86 -170
- package/esm/components/heading/heading.d.ts +5 -3
- package/esm/components/i18n-provider/i18n-provider.component.d.ts +0 -9
- package/esm/components/i18n-provider/i18n-provider.component.js +0 -9
- package/esm/components/menu/__internal__/submenu/submenu.component.js +11 -17
- package/esm/components/menu/index.d.ts +0 -1
- package/esm/components/menu/index.js +0 -1
- package/esm/components/menu/menu-full-screen/menu-full-screen.component.js +4 -18
- package/esm/components/menu/menu-full-screen/menu-full-screen.style.js +1 -0
- package/esm/components/menu/menu-item/menu-item.component.js +0 -6
- package/esm/components/multi-action-button/multi-action-button.component.d.ts +1 -1
- package/esm/components/multi-action-button/multi-action-button.component.js +1 -11
- package/esm/components/navigation-bar/navigation-bar.component.d.ts +1 -6
- package/esm/components/navigation-bar/navigation-bar.component.js +1 -15
- package/esm/components/navigation-bar/navigation-bar.style.d.ts +0 -4
- package/esm/components/navigation-bar/navigation-bar.style.js +0 -8
- package/esm/components/popover-container/popover-container.component.js +16 -3
- package/esm/components/radio-button/radio-button-group.component.js +1 -1
- package/esm/components/select/select-list/select-list.component.js +2 -2
- package/esm/components/sidebar/__internal__/sidebar-header/sidebar-header.component.d.ts +3 -1
- package/esm/components/sidebar/__internal__/sidebar-header/sidebar-header.component.js +7 -2
- package/esm/components/sidebar/sidebar.component.js +10 -3
- package/esm/components/simple-color-picker/simple-color-picker.component.js +1 -1
- package/esm/components/split-button/split-button-toggle.style.d.ts +1 -1
- package/esm/components/split-button/split-button.component.d.ts +1 -4
- package/esm/components/split-button/split-button.component.js +3 -16
- package/esm/components/split-button/split-button.d.ts +0 -2
- package/esm/components/tile/tile.component.d.ts +1 -2
- package/esm/components/tile/tile.component.js +1 -13
- package/esm/components/tile/tile.d.ts +0 -2
- package/esm/components/tile-select/tile-select-group.component.js +1 -1
- package/esm/components/toast/toast.component.d.ts +1 -4
- package/esm/components/toast/toast.component.js +1 -13
- package/esm/components/toast/toast.d.ts +0 -2
- package/esm/locales/en-gb.js +0 -9
- package/esm/locales/locale.d.ts +0 -9
- package/esm/locales/pl-pl.js +0 -9
- package/lib/__internal__/click-away-wrapper/click-away-wrapper.component.d.ts +12 -0
- package/lib/__internal__/click-away-wrapper/click-away-wrapper.component.js +59 -0
- package/lib/__internal__/click-away-wrapper/index.d.ts +2 -0
- package/lib/{components/menu/submenu-block → __internal__/click-away-wrapper}/index.js +2 -2
- package/lib/{components/scrollable-list → __internal__/click-away-wrapper}/package.json +1 -1
- package/lib/__internal__/focus-trap/focus-trap-utils.js +25 -1
- package/lib/__internal__/focus-trap/focus-trap.component.d.ts +3 -1
- package/lib/__internal__/focus-trap/focus-trap.component.js +46 -12
- package/lib/{components/radio-button → __internal__/radio-button-mapper}/radio-button-mapper.component.d.ts +0 -0
- package/lib/{components/radio-button → __internal__/radio-button-mapper}/radio-button-mapper.component.js +0 -0
- package/lib/components/advanced-color-picker/advanced-color-picker.component.js +5 -5
- package/lib/components/badge/badge.style.d.ts +1 -1
- package/lib/components/button/button.component.d.ts +1 -3
- package/lib/components/button/button.component.js +1 -14
- package/lib/components/button/button.style.d.ts +1 -1
- package/lib/components/button-toggle-group/button-toggle-group.component.js +1 -1
- package/lib/components/confirm/confirm.component.d.ts +1 -5
- package/lib/components/confirm/confirm.component.js +2 -17
- package/lib/components/confirm/confirm.d.ts +0 -2
- package/lib/components/date/date.component.js +20 -20
- package/lib/components/dialog/dialog.component.js +4 -3
- package/lib/components/dialog-full-screen/content.style.js +4 -10
- package/lib/components/dialog-full-screen/dialog-full-screen.component.js +4 -3
- package/lib/components/heading/heading.component.d.ts +27 -52
- package/lib/components/heading/heading.component.js +86 -170
- package/lib/components/heading/heading.d.ts +5 -3
- package/lib/components/i18n-provider/i18n-provider.component.d.ts +0 -9
- package/lib/components/i18n-provider/i18n-provider.component.js +0 -9
- package/lib/components/menu/__internal__/submenu/submenu.component.js +12 -17
- package/lib/components/menu/index.d.ts +0 -1
- package/lib/components/menu/index.js +0 -8
- package/lib/components/menu/menu-full-screen/menu-full-screen.component.js +3 -17
- package/lib/components/menu/menu-full-screen/menu-full-screen.style.js +1 -0
- package/lib/components/menu/menu-item/menu-item.component.js +0 -7
- package/lib/components/multi-action-button/multi-action-button.component.d.ts +1 -1
- package/lib/components/multi-action-button/multi-action-button.component.js +1 -14
- package/lib/components/navigation-bar/navigation-bar.component.d.ts +1 -6
- package/lib/components/navigation-bar/navigation-bar.component.js +1 -18
- package/lib/components/navigation-bar/navigation-bar.style.d.ts +0 -4
- package/lib/components/navigation-bar/navigation-bar.style.js +0 -8
- package/lib/components/popover-container/popover-container.component.js +17 -3
- package/lib/components/radio-button/radio-button-group.component.js +1 -1
- package/lib/components/select/select-list/select-list.component.js +2 -2
- package/lib/components/sidebar/__internal__/sidebar-header/sidebar-header.component.d.ts +3 -1
- package/lib/components/sidebar/__internal__/sidebar-header/sidebar-header.component.js +7 -2
- package/lib/components/sidebar/sidebar.component.js +11 -3
- package/lib/components/simple-color-picker/simple-color-picker.component.js +1 -1
- package/lib/components/split-button/split-button-toggle.style.d.ts +1 -1
- package/lib/components/split-button/split-button.component.d.ts +1 -4
- package/lib/components/split-button/split-button.component.js +3 -18
- package/lib/components/split-button/split-button.d.ts +0 -2
- package/lib/components/tile/tile.component.d.ts +1 -2
- package/lib/components/tile/tile.component.js +1 -16
- package/lib/components/tile/tile.d.ts +0 -2
- package/lib/components/tile-select/tile-select-group.component.js +1 -1
- package/lib/components/toast/toast.component.d.ts +1 -4
- package/lib/components/toast/toast.component.js +1 -16
- package/lib/components/toast/toast.d.ts +0 -2
- package/lib/locales/en-gb.js +0 -9
- package/lib/locales/locale.d.ts +0 -9
- package/lib/locales/pl-pl.js +0 -9
- package/package.json +1 -1
- package/esm/components/app-wrapper/app-wrapper.component.d.ts +0 -25
- package/esm/components/app-wrapper/app-wrapper.component.js +0 -104
- package/esm/components/app-wrapper/app-wrapper.d.ts +0 -12
- package/esm/components/app-wrapper/app-wrapper.style.d.ts +0 -2
- package/esm/components/app-wrapper/app-wrapper.style.js +0 -17
- package/esm/components/app-wrapper/index.d.ts +0 -1
- package/esm/components/app-wrapper/index.js +0 -1
- package/esm/components/menu/submenu-block/index.d.ts +0 -2
- package/esm/components/menu/submenu-block/index.js +0 -1
- package/esm/components/menu/submenu-block/submenu-block.component.d.ts +0 -12
- package/esm/components/menu/submenu-block/submenu-block.component.js +0 -34
- package/esm/components/menu/submenu-block/submenu-block.d.ts +0 -12
- package/esm/components/menu/submenu-block/submenu-block.style.d.ts +0 -2
- package/esm/components/menu/submenu-block/submenu-block.style.js +0 -16
- package/esm/components/mount-in-app/__spec__.d.ts +0 -1
- package/esm/components/mount-in-app/__spec__.js +0 -47
- package/esm/components/mount-in-app/index.d.ts +0 -1
- package/esm/components/mount-in-app/mount-in-app.d.ts +0 -12
- package/esm/components/mount-in-app/mount-in-app.js +0 -90
- package/esm/components/mount-in-app/package.json +0 -3
- package/esm/components/multi-step-wizard/__spec__.d.ts +0 -1
- package/esm/components/multi-step-wizard/__spec__.js +0 -191
- package/esm/components/multi-step-wizard/multi-step-wizard.d.ts +0 -109
- package/esm/components/multi-step-wizard/multi-step-wizard.js +0 -383
- package/esm/components/multi-step-wizard/multi-step-wizard.style.d.ts +0 -2
- package/esm/components/multi-step-wizard/multi-step-wizard.style.js +0 -10
- package/esm/components/multi-step-wizard/package.json +0 -4
- package/esm/components/multi-step-wizard/step/__spec__.d.ts +0 -1
- package/esm/components/multi-step-wizard/step/__spec__.js +0 -399
- package/esm/components/multi-step-wizard/step/package.json +0 -4
- package/esm/components/multi-step-wizard/step/step.d.ts +0 -166
- package/esm/components/multi-step-wizard/step/step.js +0 -407
- package/esm/components/multi-step-wizard/step/step.style.d.ts +0 -13
- package/esm/components/multi-step-wizard/step/step.style.js +0 -138
- package/esm/components/scrollable-list/as-scrollable-list-item.wrapper.d.ts +0 -2
- package/esm/components/scrollable-list/as-scrollable-list-item.wrapper.js +0 -10
- package/esm/components/scrollable-list/index.d.ts +0 -4
- package/esm/components/scrollable-list/index.js +0 -4
- package/esm/components/scrollable-list/scrollable-list-item.component.d.ts +0 -2
- package/esm/components/scrollable-list/scrollable-list-item.component.js +0 -26
- package/esm/components/scrollable-list/scrollable-list.component.d.ts +0 -52
- package/esm/components/scrollable-list/scrollable-list.component.js +0 -306
- package/esm/components/scrollable-list/scrollable-list.context.d.ts +0 -3
- package/esm/components/scrollable-list/scrollable-list.context.js +0 -2
- package/esm/components/scrollable-list/scrollable-list.style.d.ts +0 -2
- package/esm/components/scrollable-list/scrollable-list.style.js +0 -30
- package/esm/components/scrollable-list/test-utils.d.ts +0 -2
- package/esm/components/scrollable-list/test-utils.js +0 -25
- package/lib/components/app-wrapper/app-wrapper.component.d.ts +0 -25
- package/lib/components/app-wrapper/app-wrapper.component.js +0 -120
- package/lib/components/app-wrapper/app-wrapper.d.ts +0 -12
- package/lib/components/app-wrapper/app-wrapper.style.d.ts +0 -2
- package/lib/components/app-wrapper/app-wrapper.style.js +0 -28
- package/lib/components/app-wrapper/index.d.ts +0 -1
- package/lib/components/app-wrapper/index.js +0 -15
- package/lib/components/app-wrapper/package.json +0 -6
- package/lib/components/menu/submenu-block/index.d.ts +0 -2
- package/lib/components/menu/submenu-block/package.json +0 -6
- package/lib/components/menu/submenu-block/submenu-block.component.d.ts +0 -12
- package/lib/components/menu/submenu-block/submenu-block.component.js +0 -53
- package/lib/components/menu/submenu-block/submenu-block.d.ts +0 -12
- package/lib/components/menu/submenu-block/submenu-block.style.d.ts +0 -2
- package/lib/components/menu/submenu-block/submenu-block.style.js +0 -33
- package/lib/components/mount-in-app/__spec__.d.ts +0 -1
- package/lib/components/mount-in-app/__spec__.js +0 -55
- package/lib/components/mount-in-app/index.d.ts +0 -1
- package/lib/components/mount-in-app/mount-in-app.d.ts +0 -12
- package/lib/components/mount-in-app/mount-in-app.js +0 -105
- package/lib/components/mount-in-app/package.json +0 -3
- package/lib/components/multi-step-wizard/__spec__.d.ts +0 -1
- package/lib/components/multi-step-wizard/__spec__.js +0 -202
- package/lib/components/multi-step-wizard/multi-step-wizard.d.ts +0 -109
- package/lib/components/multi-step-wizard/multi-step-wizard.js +0 -397
- package/lib/components/multi-step-wizard/multi-step-wizard.style.d.ts +0 -2
- package/lib/components/multi-step-wizard/multi-step-wizard.style.js +0 -21
- package/lib/components/multi-step-wizard/package.json +0 -4
- package/lib/components/multi-step-wizard/step/__spec__.d.ts +0 -1
- package/lib/components/multi-step-wizard/step/__spec__.js +0 -409
- package/lib/components/multi-step-wizard/step/package.json +0 -4
- package/lib/components/multi-step-wizard/step/step.d.ts +0 -166
- package/lib/components/multi-step-wizard/step/step.js +0 -421
- package/lib/components/multi-step-wizard/step/step.style.d.ts +0 -13
- package/lib/components/multi-step-wizard/step/step.style.js +0 -162
- package/lib/components/scrollable-list/as-scrollable-list-item.wrapper.d.ts +0 -2
- package/lib/components/scrollable-list/as-scrollable-list-item.wrapper.js +0 -21
- package/lib/components/scrollable-list/index.d.ts +0 -4
- package/lib/components/scrollable-list/index.js +0 -31
- package/lib/components/scrollable-list/scrollable-list-item.component.d.ts +0 -2
- package/lib/components/scrollable-list/scrollable-list-item.component.js +0 -42
- package/lib/components/scrollable-list/scrollable-list.component.d.ts +0 -52
- package/lib/components/scrollable-list/scrollable-list.component.js +0 -328
- package/lib/components/scrollable-list/scrollable-list.context.d.ts +0 -3
- package/lib/components/scrollable-list/scrollable-list.context.js +0 -14
- package/lib/components/scrollable-list/scrollable-list.style.d.ts +0 -2
- package/lib/components/scrollable-list/scrollable-list.style.js +0 -41
- package/lib/components/scrollable-list/test-utils.d.ts +0 -2
- package/lib/components/scrollable-list/test-utils.js +0 -37
|
@@ -21,8 +21,6 @@ var _utils = require("../../style/utils");
|
|
|
21
21
|
|
|
22
22
|
var _focusTrapUtils = require("../../__internal__/focus-trap/focus-trap-utils");
|
|
23
23
|
|
|
24
|
-
var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
|
|
25
|
-
|
|
26
24
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
27
25
|
|
|
28
26
|
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
@@ -31,12 +29,9 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
|
|
|
31
29
|
|
|
32
30
|
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
33
31
|
|
|
34
|
-
let deprecatedWarnTriggered = false;
|
|
35
|
-
|
|
36
32
|
const MultiActionButton = ({
|
|
37
33
|
align = "left",
|
|
38
34
|
disabled,
|
|
39
|
-
as,
|
|
40
35
|
buttonType,
|
|
41
36
|
size,
|
|
42
37
|
children,
|
|
@@ -46,13 +41,6 @@ const MultiActionButton = ({
|
|
|
46
41
|
"data-role": dataRole,
|
|
47
42
|
...rest
|
|
48
43
|
}) => {
|
|
49
|
-
if (!deprecatedWarnTriggered && as) {
|
|
50
|
-
deprecatedWarnTriggered = true;
|
|
51
|
-
|
|
52
|
-
_logger.default.deprecate( // eslint-disable-next-line max-len
|
|
53
|
-
"The `as` prop is deprecated and will soon be removed from the `MultiActionButton` component interface. You should use the `buttonType` prop to achieve the same styling. The following codemod is available to help with updating your code https://github.com/Sage/carbon-codemod/tree/master/transforms/rename-prop");
|
|
54
|
-
}
|
|
55
|
-
|
|
56
44
|
const ref = (0, _react.useRef)(null);
|
|
57
45
|
const buttonRef = (0, _react.useRef)(null);
|
|
58
46
|
const buttonContainer = (0, _react.useRef)(null);
|
|
@@ -211,7 +199,7 @@ const MultiActionButton = ({
|
|
|
211
199
|
onFocus: focusMainButton,
|
|
212
200
|
onBlur: blurMainButton,
|
|
213
201
|
onKeyDown: handleMainButtonKeyDown,
|
|
214
|
-
buttonType
|
|
202
|
+
buttonType,
|
|
215
203
|
size,
|
|
216
204
|
subtext,
|
|
217
205
|
...(!disabled && {
|
|
@@ -306,7 +294,6 @@ MultiActionButton.propTypes = {
|
|
|
306
294
|
"aria-valuemin": _propTypes.default.number,
|
|
307
295
|
"aria-valuenow": _propTypes.default.number,
|
|
308
296
|
"aria-valuetext": _propTypes.default.string,
|
|
309
|
-
"as": _propTypes.default.oneOf(["primary", "secondary"]),
|
|
310
297
|
"autoCapitalize": _propTypes.default.string,
|
|
311
298
|
"autoCorrect": _propTypes.default.string,
|
|
312
299
|
"autoFocus": _propTypes.default.bool,
|
|
@@ -3,7 +3,6 @@ import { PaddingProps, FlexboxProps } from "styled-system";
|
|
|
3
3
|
export declare type Position = "sticky" | "fixed";
|
|
4
4
|
export declare type Orientation = "top" | "bottom";
|
|
5
5
|
export declare type NavigationType = "light" | "dark" | "white" | "black";
|
|
6
|
-
export declare type StickyPosition = "top" | "bottom";
|
|
7
6
|
export interface NavigationBarProps extends PaddingProps, FlexboxProps {
|
|
8
7
|
children?: React.ReactNode;
|
|
9
8
|
ariaLabel?: string;
|
|
@@ -11,10 +10,6 @@ export interface NavigationBarProps extends PaddingProps, FlexboxProps {
|
|
|
11
10
|
navigationType?: NavigationType;
|
|
12
11
|
/** If 'true' the children will not be visible */
|
|
13
12
|
isLoading?: boolean;
|
|
14
|
-
/** Defines the position of sticky navigation bar */
|
|
15
|
-
stickyPosition?: StickyPosition;
|
|
16
|
-
/** Defines the offset of sticky navigation bar */
|
|
17
|
-
stickyOffset?: string;
|
|
18
13
|
/** Defines whether the navigation bar should be positioned fixed or sticky */
|
|
19
14
|
position?: Position;
|
|
20
15
|
/** Defines the offset of navigation bar */
|
|
@@ -22,5 +17,5 @@ export interface NavigationBarProps extends PaddingProps, FlexboxProps {
|
|
|
22
17
|
/** Defines whether the navigation bar should be positioned top or bottom */
|
|
23
18
|
orientation?: Orientation;
|
|
24
19
|
}
|
|
25
|
-
export declare const NavigationBar: ({ navigationType, isLoading, children, ariaLabel,
|
|
20
|
+
export declare const NavigationBar: ({ navigationType, isLoading, children, ariaLabel, position, offset, orientation, ...props }: NavigationBarProps) => JSX.Element;
|
|
26
21
|
export default NavigationBar;
|
|
@@ -11,40 +11,25 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
11
11
|
|
|
12
12
|
var _navigationBar = _interopRequireDefault(require("./navigation-bar.style"));
|
|
13
13
|
|
|
14
|
-
var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
|
|
15
|
-
|
|
16
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
15
|
|
|
18
16
|
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
19
17
|
|
|
20
|
-
let deprecatedWarnTriggered = false;
|
|
21
|
-
|
|
22
18
|
const NavigationBar = ({
|
|
23
19
|
navigationType = "light",
|
|
24
20
|
isLoading = false,
|
|
25
21
|
children,
|
|
26
22
|
ariaLabel,
|
|
27
|
-
stickyOffset = "0",
|
|
28
|
-
stickyPosition,
|
|
29
23
|
position,
|
|
30
24
|
offset = "0",
|
|
31
25
|
orientation,
|
|
32
26
|
...props
|
|
33
27
|
}) => {
|
|
34
|
-
if (!deprecatedWarnTriggered && stickyPosition) {
|
|
35
|
-
deprecatedWarnTriggered = true;
|
|
36
|
-
|
|
37
|
-
_logger.default.deprecate( // eslint-disable-next-line max-len
|
|
38
|
-
"The `stickyPosition` and `stickyOffset` props are deprecated and will soon be removed. You should use the `position`, `offset` and `orientation` props to achieve the same layout. The following codemods are available to help with updating your code: https://github.com/Sage/carbon-codemod/tree/master/transforms/remove-prop and https://github.com/Sage/carbon-codemod/tree/master/transforms/add-prop");
|
|
39
|
-
}
|
|
40
|
-
|
|
41
28
|
return /*#__PURE__*/_react.default.createElement(_navigationBar.default, _extends({
|
|
42
29
|
role: "navigation",
|
|
43
30
|
"aria-label": ariaLabel,
|
|
44
31
|
navigationType: navigationType,
|
|
45
32
|
"data-component": "navigation-bar",
|
|
46
|
-
stickyOffset: stickyOffset,
|
|
47
|
-
stickyPosition: stickyPosition,
|
|
48
33
|
position: position,
|
|
49
34
|
offset: offset,
|
|
50
35
|
orientation: orientation
|
|
@@ -1052,9 +1037,7 @@ NavigationBar.propTypes = {
|
|
|
1052
1037
|
"description": _propTypes.default.string,
|
|
1053
1038
|
"toString": _propTypes.default.func.isRequired,
|
|
1054
1039
|
"valueOf": _propTypes.default.func.isRequired
|
|
1055
|
-
}), _propTypes.default.string])
|
|
1056
|
-
"stickyOffset": _propTypes.default.string,
|
|
1057
|
-
"stickyPosition": _propTypes.default.oneOf(["bottom", "top"])
|
|
1040
|
+
}), _propTypes.default.string])
|
|
1058
1041
|
};
|
|
1059
1042
|
var _default = NavigationBar;
|
|
1060
1043
|
exports.default = _default;
|
|
@@ -3,10 +3,6 @@ import { Position, Orientation, NavigationType } from "./navigation-bar.componen
|
|
|
3
3
|
declare const StyledNavigationBar: import("styled-components").StyledComponent<"nav", any, PaddingProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & FlexboxProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & {
|
|
4
4
|
/** Color scheme of navigation component */
|
|
5
5
|
navigationType?: NavigationType | undefined;
|
|
6
|
-
/** Defines the position of sticky navigation bar */
|
|
7
|
-
stickyPosition?: Orientation | undefined;
|
|
8
|
-
/** Defines the offset of sticky navigation bar */
|
|
9
|
-
stickyOffset?: string | undefined;
|
|
10
6
|
/** Defines whether the navigation bar should be positioned fixed or sticky */
|
|
11
7
|
position?: Position | undefined;
|
|
12
8
|
/** Defines the offset of navigation bar */
|
|
@@ -49,14 +49,6 @@ const StyledNavigationBar = _styledComponents.default.nav`
|
|
|
49
49
|
margin-right: 10px;
|
|
50
50
|
}
|
|
51
51
|
|
|
52
|
-
${({
|
|
53
|
-
stickyPosition,
|
|
54
|
-
stickyOffset
|
|
55
|
-
}) => stickyPosition && (0, _styledComponents.css)`
|
|
56
|
-
position: sticky;
|
|
57
|
-
${stickyPosition}: ${stickyOffset};
|
|
58
|
-
`}
|
|
59
|
-
|
|
60
52
|
${({
|
|
61
53
|
position,
|
|
62
54
|
orientation,
|
|
@@ -21,6 +21,8 @@ var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/gui
|
|
|
21
21
|
|
|
22
22
|
var _utils = require("../../style/utils");
|
|
23
23
|
|
|
24
|
+
var _clickAwayWrapper = _interopRequireDefault(require("../../__internal__/click-away-wrapper"));
|
|
25
|
+
|
|
24
26
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
25
27
|
|
|
26
28
|
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
@@ -49,6 +51,7 @@ const PopoverContainer = ({
|
|
|
49
51
|
}) => {
|
|
50
52
|
const isControlled = open !== undefined;
|
|
51
53
|
const [isOpenInternal, setIsOpenInternal] = (0, _react.useState)(false);
|
|
54
|
+
const ref = (0, _react.useRef)();
|
|
52
55
|
const closeButtonRef = (0, _react.useRef)();
|
|
53
56
|
const openButtonRef = (0, _react.useRef)();
|
|
54
57
|
const guid = (0, _react.useRef)((0, _guid.default)());
|
|
@@ -89,10 +92,21 @@ const PopoverContainer = ({
|
|
|
89
92
|
ref: closeButtonRef,
|
|
90
93
|
ariaLabel: closeButtonAriaLabel
|
|
91
94
|
};
|
|
92
|
-
|
|
95
|
+
|
|
96
|
+
const handleClickAway = e => {
|
|
97
|
+
if (!isControlled) setIsOpenInternal(false);
|
|
98
|
+
if (onClose) onClose(e);
|
|
99
|
+
};
|
|
100
|
+
|
|
101
|
+
return /*#__PURE__*/_react.default.createElement(_clickAwayWrapper.default, {
|
|
102
|
+
targets: [ref],
|
|
103
|
+
handleClickAway: handleClickAway,
|
|
104
|
+
eventTypeId: "mousedown"
|
|
105
|
+
}, /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerWrapperStyle, {
|
|
93
106
|
"data-component": "popover-container",
|
|
94
107
|
role: "region",
|
|
95
|
-
"aria-labelledby": popoverContainerId
|
|
108
|
+
"aria-labelledby": popoverContainerId,
|
|
109
|
+
ref: ref
|
|
96
110
|
}, renderOpenComponent(renderOpenComponentProps), /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.Transition, {
|
|
97
111
|
in: isOpen,
|
|
98
112
|
timeout: {
|
|
@@ -116,7 +130,7 @@ const PopoverContainer = ({
|
|
|
116
130
|
}, (0, _utils.filterStyledSystemPaddingProps)(rest)), /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerHeaderStyle, null, /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerTitleStyle, {
|
|
117
131
|
id: popoverContainerId,
|
|
118
132
|
"data-element": "popover-container-title"
|
|
119
|
-
}, title), renderCloseComponent(renderCloseComponentProps)), children)));
|
|
133
|
+
}, title), renderCloseComponent(renderCloseComponentProps)), children))));
|
|
120
134
|
};
|
|
121
135
|
|
|
122
136
|
PopoverContainer.propTypes = { ...paddingPropTypes,
|
|
@@ -17,7 +17,7 @@ var _fieldset = _interopRequireDefault(require("../../__internal__/fieldset"));
|
|
|
17
17
|
|
|
18
18
|
var _radioButtonGroup = _interopRequireDefault(require("./radio-button-group.style"));
|
|
19
19
|
|
|
20
|
-
var _radioButtonMapper = _interopRequireDefault(require("
|
|
20
|
+
var _radioButtonMapper = _interopRequireDefault(require("../../__internal__/radio-button-mapper/radio-button-mapper.component"));
|
|
21
21
|
|
|
22
22
|
var _useIsAboveBreakpoint = _interopRequireDefault(require("../../hooks/__internal__/useIsAboveBreakpoint"));
|
|
23
23
|
|
|
@@ -258,7 +258,7 @@ const SelectList = /*#__PURE__*/_react.default.forwardRef(({
|
|
|
258
258
|
}
|
|
259
259
|
|
|
260
260
|
setListHeight(`${newHeight}px`);
|
|
261
|
-
}, [children
|
|
261
|
+
}, [children]);
|
|
262
262
|
(0, _react.useEffect)(() => {
|
|
263
263
|
const keyboardEvent = "keydown";
|
|
264
264
|
const listElement = listRef.current;
|
|
@@ -365,7 +365,7 @@ SelectList.propTypes = {
|
|
|
365
365
|
/** The Id of the label */
|
|
366
366
|
labelId: _propTypes.default.string,
|
|
367
367
|
|
|
368
|
-
/** Child components (such as <Option>)
|
|
368
|
+
/** Child components (such as <Option>) */
|
|
369
369
|
children: _propTypes.default.node,
|
|
370
370
|
|
|
371
371
|
/** Boolean to toggle where DatePicker is rendered in relation to the Date Input */
|
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
export default SidebarHeader;
|
|
2
|
-
declare function SidebarHeader({ className, children, ...props }: {
|
|
2
|
+
declare function SidebarHeader({ className, children, id, ...props }: {
|
|
3
3
|
[x: string]: any;
|
|
4
4
|
className: any;
|
|
5
5
|
children: any;
|
|
6
|
+
id: any;
|
|
6
7
|
}): JSX.Element;
|
|
7
8
|
declare namespace SidebarHeader {
|
|
8
9
|
namespace propTypes {
|
|
9
10
|
const children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
10
11
|
const className: PropTypes.Requireable<string>;
|
|
12
|
+
const id: PropTypes.Requireable<string>;
|
|
11
13
|
}
|
|
12
14
|
}
|
|
13
15
|
import PropTypes from "prop-types";
|
|
@@ -20,9 +20,11 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
|
|
|
20
20
|
const SidebarHeader = ({
|
|
21
21
|
className,
|
|
22
22
|
children,
|
|
23
|
+
id,
|
|
23
24
|
...props
|
|
24
25
|
}) => /*#__PURE__*/_react.default.createElement(_sidebarHeader.default, _extends({
|
|
25
|
-
className: className
|
|
26
|
+
className: className,
|
|
27
|
+
id: id
|
|
26
28
|
}, (0, _tags.default)("sidebar-header", props)), children);
|
|
27
29
|
|
|
28
30
|
SidebarHeader.propTypes = {
|
|
@@ -30,7 +32,10 @@ SidebarHeader.propTypes = {
|
|
|
30
32
|
children: _propTypes.default.node,
|
|
31
33
|
|
|
32
34
|
/** A custom class name. */
|
|
33
|
-
className: _propTypes.default.string
|
|
35
|
+
className: _propTypes.default.string,
|
|
36
|
+
|
|
37
|
+
/** A custom id. */
|
|
38
|
+
id: _propTypes.default.string
|
|
34
39
|
};
|
|
35
40
|
var _default = SidebarHeader;
|
|
36
41
|
exports.default = _default;
|
|
@@ -25,6 +25,8 @@ var _box = _interopRequireDefault(require("../box"));
|
|
|
25
25
|
|
|
26
26
|
var _sidebar2 = require("./sidebar.config");
|
|
27
27
|
|
|
28
|
+
var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
|
|
29
|
+
|
|
28
30
|
var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
|
|
29
31
|
|
|
30
32
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -55,6 +57,9 @@ const Sidebar = /*#__PURE__*/_react.default.forwardRef(({
|
|
|
55
57
|
...rest
|
|
56
58
|
}, ref) => {
|
|
57
59
|
const locale = (0, _useLocale.default)();
|
|
60
|
+
const {
|
|
61
|
+
current: titleId
|
|
62
|
+
} = (0, _react.useRef)((0, _guid.default)());
|
|
58
63
|
let sidebarRef = (0, _react.useRef)();
|
|
59
64
|
if (ref) sidebarRef = ref;
|
|
60
65
|
|
|
@@ -79,14 +84,16 @@ const Sidebar = /*#__PURE__*/_react.default.forwardRef(({
|
|
|
79
84
|
"aria-modal": !enableBackgroundUI,
|
|
80
85
|
"aria-describedby": ariaDescribedBy,
|
|
81
86
|
"aria-label": ariaLabel,
|
|
82
|
-
"aria-labelledby": ariaLabelledBy,
|
|
87
|
+
"aria-labelledby": !ariaLabelledBy && !ariaLabel ? titleId : ariaLabelledBy,
|
|
83
88
|
ref: sidebarRef,
|
|
84
89
|
position: position,
|
|
85
90
|
size: size,
|
|
86
91
|
"data-element": "sidebar",
|
|
87
92
|
onCancel: onCancel,
|
|
88
93
|
role: role
|
|
89
|
-
},
|
|
94
|
+
}, header && /*#__PURE__*/_react.default.createElement(_sidebarHeader.default, {
|
|
95
|
+
id: titleId
|
|
96
|
+
}, header), closeIcon(), /*#__PURE__*/_react.default.createElement(_box.default, {
|
|
90
97
|
"data-element": "sidebar-content",
|
|
91
98
|
p: 4,
|
|
92
99
|
pt: "27px",
|
|
@@ -106,7 +113,8 @@ const Sidebar = /*#__PURE__*/_react.default.forwardRef(({
|
|
|
106
113
|
enableBackgroundUI: enableBackgroundUI,
|
|
107
114
|
className: "carbon-sidebar"
|
|
108
115
|
}, componentTags), enableBackgroundUI ? sidebar : /*#__PURE__*/_react.default.createElement(_focusTrap.default, {
|
|
109
|
-
wrapperRef: sidebarRef
|
|
116
|
+
wrapperRef: sidebarRef,
|
|
117
|
+
isOpen: open
|
|
110
118
|
}, sidebar));
|
|
111
119
|
});
|
|
112
120
|
|
|
@@ -19,7 +19,7 @@ var _fieldset = _interopRequireDefault(require("../../__internal__/fieldset"));
|
|
|
19
19
|
|
|
20
20
|
var _simpleColor = _interopRequireDefault(require("./simple-color"));
|
|
21
21
|
|
|
22
|
-
var _radioButtonMapper = _interopRequireDefault(require("
|
|
22
|
+
var _radioButtonMapper = _interopRequireDefault(require("../../__internal__/radio-button-mapper/radio-button-mapper.component"));
|
|
23
23
|
|
|
24
24
|
var _simpleColorPicker = require("./simple-color-picker.style");
|
|
25
25
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export default StyledSplitButtonToggle;
|
|
2
|
-
declare const StyledSplitButtonToggle: import("styled-components").StyledComponent<"button", any, import("styled-system").SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> &
|
|
2
|
+
declare const StyledSplitButtonToggle: import("styled-components").StyledComponent<"button", any, import("styled-system").SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & import("../button").ButtonProps & {
|
|
3
3
|
iconOnly?: boolean | undefined;
|
|
4
4
|
}, never>;
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
export default SplitButton;
|
|
2
|
-
declare function SplitButton({ align,
|
|
2
|
+
declare function SplitButton({ align, buttonType, children, disabled, iconPosition, iconType, onClick, size, subtext, text, "data-element": dataElement, "data-role": dataRole, ...rest }: {
|
|
3
3
|
[x: string]: any;
|
|
4
4
|
align?: string | undefined;
|
|
5
|
-
as: any;
|
|
6
5
|
buttonType?: string | undefined;
|
|
7
6
|
children: any;
|
|
8
7
|
disabled?: boolean | undefined;
|
|
@@ -19,8 +18,6 @@ declare namespace SplitButton {
|
|
|
19
18
|
const propTypes: {
|
|
20
19
|
/** Button type: "primary" | "secondary" */
|
|
21
20
|
buttonType: PropTypes.Requireable<string>;
|
|
22
|
-
/** Button type: "primary" | "secondary" for legacy theme */
|
|
23
|
-
as: PropTypes.Requireable<string>;
|
|
24
21
|
/** The additional button to display. */
|
|
25
22
|
children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
|
|
26
23
|
/** A custom value for the data-element attribute */
|
|
@@ -35,8 +35,6 @@ var _themes = require("../../style/themes");
|
|
|
35
35
|
|
|
36
36
|
var _focusTrapUtils = require("../../__internal__/focus-trap/focus-trap-utils");
|
|
37
37
|
|
|
38
|
-
var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
|
|
39
|
-
|
|
40
38
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
41
39
|
|
|
42
40
|
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
@@ -47,11 +45,9 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
|
|
|
47
45
|
|
|
48
46
|
const marginPropTypes = (0, _utils.filterStyledSystemMarginProps)(_propTypes2.default.space);
|
|
49
47
|
const CONTENT_WIDTH_RATIO = 0.75;
|
|
50
|
-
let deprecatedWarnTriggered = false;
|
|
51
48
|
|
|
52
49
|
const SplitButton = ({
|
|
53
50
|
align = "left",
|
|
54
|
-
as,
|
|
55
51
|
buttonType = "secondary",
|
|
56
52
|
children,
|
|
57
53
|
disabled = false,
|
|
@@ -65,13 +61,6 @@ const SplitButton = ({
|
|
|
65
61
|
"data-role": dataRole,
|
|
66
62
|
...rest
|
|
67
63
|
}) => {
|
|
68
|
-
if (!deprecatedWarnTriggered && as) {
|
|
69
|
-
deprecatedWarnTriggered = true;
|
|
70
|
-
|
|
71
|
-
_logger.default.deprecate( // eslint-disable-next-line max-len
|
|
72
|
-
"The `as` prop is deprecated and will soon be removed from the `SplitButton` component interface. You should use the `buttonType` prop to achieve the same styling. The following codemod is available to help with updating your code https://github.com/Sage/carbon-codemod/tree/master/transforms/rename-prop");
|
|
73
|
-
}
|
|
74
|
-
|
|
75
64
|
const theme = (0, _react.useContext)(_styledComponents.ThemeContext) || _themes.baseTheme;
|
|
76
65
|
|
|
77
66
|
const isToggleButtonFocused = (0, _react.useRef)(false);
|
|
@@ -159,7 +148,6 @@ const SplitButton = ({
|
|
|
159
148
|
onFocus: hideButtons,
|
|
160
149
|
onTouchStart: hideButtons,
|
|
161
150
|
iconPosition,
|
|
162
|
-
as,
|
|
163
151
|
buttonType,
|
|
164
152
|
disabled,
|
|
165
153
|
iconType,
|
|
@@ -180,7 +168,7 @@ const SplitButton = ({
|
|
|
180
168
|
isToggleButtonFocused.current = false;
|
|
181
169
|
},
|
|
182
170
|
onKeyDown: handleToggleButtonKeyDown,
|
|
183
|
-
buttonType
|
|
171
|
+
buttonType,
|
|
184
172
|
size
|
|
185
173
|
};
|
|
186
174
|
|
|
@@ -204,7 +192,7 @@ const SplitButton = ({
|
|
|
204
192
|
primary: theme.colors.white,
|
|
205
193
|
secondary: theme.colors.primary
|
|
206
194
|
};
|
|
207
|
-
return colorsMap[
|
|
195
|
+
return colorsMap[buttonType];
|
|
208
196
|
}
|
|
209
197
|
|
|
210
198
|
function renderMainButton() {
|
|
@@ -315,9 +303,6 @@ SplitButton.propTypes = { ...marginPropTypes,
|
|
|
315
303
|
/** Button type: "primary" | "secondary" */
|
|
316
304
|
buttonType: _propTypes.default.oneOf(["primary", "secondary"]),
|
|
317
305
|
|
|
318
|
-
/** Button type: "primary" | "secondary" for legacy theme */
|
|
319
|
-
as: _propTypes.default.oneOf(["primary", "secondary"]),
|
|
320
|
-
|
|
321
306
|
/** The additional button to display. */
|
|
322
307
|
children: _propTypes.default.node.isRequired,
|
|
323
308
|
|
|
@@ -342,6 +327,6 @@ SplitButton.propTypes = { ...marginPropTypes,
|
|
|
342
327
|
/** Set align of the rendered content */
|
|
343
328
|
align: _propTypes.default.oneOf(["left", "right"])
|
|
344
329
|
};
|
|
345
|
-
SplitButton.safeProps = ["buttonType", "
|
|
330
|
+
SplitButton.safeProps = ["buttonType", "disabled", "size"];
|
|
346
331
|
var _default = SplitButton;
|
|
347
332
|
exports.default = _default;
|
|
@@ -6,8 +6,6 @@ export interface SplitButtonProps
|
|
|
6
6
|
MarginProps {
|
|
7
7
|
/** Set align of the rendered content */
|
|
8
8
|
align?: "left" | "right";
|
|
9
|
-
/** Button type: "primary" | "secondary" for legacy theme */
|
|
10
|
-
as?: "primary" | "secondary";
|
|
11
9
|
/** Button type: "primary" | "secondary" */
|
|
12
10
|
buttonType?: "primary" | "secondary";
|
|
13
11
|
/** The additional button to display. */
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
export default Tile;
|
|
2
|
-
declare function Tile({
|
|
2
|
+
declare function Tile({ variant, p, children, orientation, width, ...props }: {
|
|
3
3
|
[x: string]: any;
|
|
4
|
-
as: any;
|
|
5
4
|
variant?: string | undefined;
|
|
6
5
|
p?: number | undefined;
|
|
7
6
|
children: any;
|
|
@@ -13,16 +13,11 @@ var _propTypes2 = _interopRequireDefault(require("@styled-system/prop-types"));
|
|
|
13
13
|
|
|
14
14
|
var _tileStyle = require("./tile.style.js");
|
|
15
15
|
|
|
16
|
-
var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
|
|
17
|
-
|
|
18
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
17
|
|
|
20
18
|
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
21
19
|
|
|
22
|
-
let deprecatedWarnTriggered = false;
|
|
23
|
-
|
|
24
20
|
const Tile = ({
|
|
25
|
-
as,
|
|
26
21
|
variant = "tile",
|
|
27
22
|
p = 3,
|
|
28
23
|
children,
|
|
@@ -30,13 +25,6 @@ const Tile = ({
|
|
|
30
25
|
width,
|
|
31
26
|
...props
|
|
32
27
|
}) => {
|
|
33
|
-
if (!deprecatedWarnTriggered && as) {
|
|
34
|
-
deprecatedWarnTriggered = true;
|
|
35
|
-
|
|
36
|
-
_logger.default.deprecate( // eslint-disable-next-line max-len
|
|
37
|
-
"The `as` prop is deprecated and will soon be removed from the `Tile` component interface. You should use the `variant` prop to achieve the same styling. The following codemod is available to help with updating your code https://github.com/Sage/carbon-codemod/tree/master/transforms/rename-prop");
|
|
38
|
-
}
|
|
39
|
-
|
|
40
28
|
const isHorizontal = () => orientation === "horizontal";
|
|
41
29
|
|
|
42
30
|
const isVertical = () => orientation === "vertical";
|
|
@@ -66,7 +54,7 @@ const Tile = ({
|
|
|
66
54
|
});
|
|
67
55
|
|
|
68
56
|
return /*#__PURE__*/_react.default.createElement(_tileStyle.StyledTile, _extends({
|
|
69
|
-
tileTheme:
|
|
57
|
+
tileTheme: variant,
|
|
70
58
|
width: width,
|
|
71
59
|
"data-component": "tile",
|
|
72
60
|
isHorizontal: isHorizontal(orientation),
|
|
@@ -78,9 +66,6 @@ Tile.propTypes = {
|
|
|
78
66
|
/** Styled system spacing props */
|
|
79
67
|
..._propTypes2.default.space,
|
|
80
68
|
|
|
81
|
-
/** Sets the theme of the tile - either 'tile' or 'transparent' */
|
|
82
|
-
as: _propTypes.default.oneOf(["tile", "transparent"]),
|
|
83
|
-
|
|
84
69
|
/** Sets the theme of the tile - either 'tile' or 'transparent' */
|
|
85
70
|
variant: _propTypes.default.oneOf(["tile", "transparent"]),
|
|
86
71
|
|
|
@@ -2,8 +2,6 @@ import * as React from "react";
|
|
|
2
2
|
import { SpaceProps } from "styled-system";
|
|
3
3
|
|
|
4
4
|
export interface TileProps extends SpaceProps {
|
|
5
|
-
/** Sets the theme of the tile - either 'tile' or 'transparent' */
|
|
6
|
-
as?: "tile" | "transparent";
|
|
7
5
|
/** Sets the theme of the tile - either 'tile' or 'transparent' */
|
|
8
6
|
variant?: "tile" | "transparent";
|
|
9
7
|
/**
|
|
@@ -15,7 +15,7 @@ var _tags = _interopRequireDefault(require("../../__internal__/utils/helpers/tag
|
|
|
15
15
|
|
|
16
16
|
var _tileSelect = _interopRequireDefault(require("./tile-select.component"));
|
|
17
17
|
|
|
18
|
-
var _radioButtonMapper = _interopRequireDefault(require("
|
|
18
|
+
var _radioButtonMapper = _interopRequireDefault(require("../../__internal__/radio-button-mapper/radio-button-mapper.component"));
|
|
19
19
|
|
|
20
20
|
var _tileSelect2 = require("./tile-select.style");
|
|
21
21
|
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
export default Toast;
|
|
2
|
-
declare function Toast({
|
|
2
|
+
declare function Toast({ children, className, id, isCenter, maxWidth, onDismiss, open, targetPortalId, timeout, variant, ...restProps }: {
|
|
3
3
|
[x: string]: any;
|
|
4
|
-
as: any;
|
|
5
4
|
children: any;
|
|
6
5
|
className: any;
|
|
7
6
|
id: any;
|
|
@@ -17,8 +16,6 @@ declare namespace Toast {
|
|
|
17
16
|
const propTypes: {
|
|
18
17
|
/** Customizes the appearance in the DLS theme */
|
|
19
18
|
variant: PropTypes.Requireable<string>;
|
|
20
|
-
/** Customizes the appearance in a legacy theme through colour (see the 'iconColorSets' for possible values) */
|
|
21
|
-
as: PropTypes.Requireable<string>;
|
|
22
19
|
/** Custom className */
|
|
23
20
|
className: PropTypes.Requireable<string>;
|
|
24
21
|
/** Custom id */
|
|
@@ -27,8 +27,6 @@ var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLoc
|
|
|
27
27
|
|
|
28
28
|
var _useModalManager = _interopRequireDefault(require("../../hooks/__internal__/useModalManager"));
|
|
29
29
|
|
|
30
|
-
var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
|
|
31
|
-
|
|
32
30
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
33
31
|
|
|
34
32
|
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
@@ -37,10 +35,7 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
|
|
|
37
35
|
|
|
38
36
|
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
39
37
|
|
|
40
|
-
let deprecatedWarnTriggered = false;
|
|
41
|
-
|
|
42
38
|
const Toast = ({
|
|
43
|
-
as,
|
|
44
39
|
children,
|
|
45
40
|
className,
|
|
46
41
|
id,
|
|
@@ -53,13 +48,6 @@ const Toast = ({
|
|
|
53
48
|
variant,
|
|
54
49
|
...restProps
|
|
55
50
|
}) => {
|
|
56
|
-
if (!deprecatedWarnTriggered && as) {
|
|
57
|
-
deprecatedWarnTriggered = true;
|
|
58
|
-
|
|
59
|
-
_logger.default.deprecate( // eslint-disable-next-line max-len
|
|
60
|
-
"The `as` prop is deprecated and will soon be removed from the `Toast` component interface. You should use the `variant` prop to achieve the same styling. The following codemod is available to help with updating your code https://github.com/Sage/carbon-codemod/tree/master/transforms/rename-prop");
|
|
61
|
-
}
|
|
62
|
-
|
|
63
51
|
const locale = (0, _useLocale.default)();
|
|
64
52
|
const toastRef = (0, _react.useRef)();
|
|
65
53
|
const timer = (0, _react.useRef)();
|
|
@@ -99,7 +87,7 @@ const Toast = ({
|
|
|
99
87
|
if (!open) return null;
|
|
100
88
|
const toastProps = {
|
|
101
89
|
isCenter,
|
|
102
|
-
variant: variant ||
|
|
90
|
+
variant: variant || "success",
|
|
103
91
|
id,
|
|
104
92
|
maxWidth
|
|
105
93
|
};
|
|
@@ -139,9 +127,6 @@ Toast.propTypes = {
|
|
|
139
127
|
/** Customizes the appearance in the DLS theme */
|
|
140
128
|
variant: _propTypes.default.oneOf(["error", "info", "success", "warning"]),
|
|
141
129
|
|
|
142
|
-
/** Customizes the appearance in a legacy theme through colour (see the 'iconColorSets' for possible values) */
|
|
143
|
-
as: _propTypes.default.oneOf(["error", "info", "success", "warning"]),
|
|
144
|
-
|
|
145
130
|
/** Custom className */
|
|
146
131
|
className: _propTypes.default.string,
|
|
147
132
|
|
|
@@ -7,8 +7,6 @@ export interface ToastPropTypes {
|
|
|
7
7
|
children: React.ReactNode;
|
|
8
8
|
/** Customizes the appearance in the DLS theme */
|
|
9
9
|
variant?: ToastVariants;
|
|
10
|
-
/** Customizes the appearance in a legacy theme through colour (see the 'iconColorSets' for possible values) */
|
|
11
|
-
as?: ToastVariants;
|
|
12
10
|
/** Custom className */
|
|
13
11
|
className?: string;
|
|
14
12
|
/** Custom id */
|
package/lib/locales/en-gb.js
CHANGED
|
@@ -125,15 +125,6 @@ const enGB = {
|
|
|
125
125
|
ariaLabels: {
|
|
126
126
|
close: () => "Close"
|
|
127
127
|
}
|
|
128
|
-
},
|
|
129
|
-
wizards: {
|
|
130
|
-
multiStep: {
|
|
131
|
-
buttons: {
|
|
132
|
-
submit: () => "Submit",
|
|
133
|
-
next: () => "Next",
|
|
134
|
-
back: () => "Back"
|
|
135
|
-
}
|
|
136
|
-
}
|
|
137
128
|
}
|
|
138
129
|
};
|
|
139
130
|
var _default = enGB;
|
package/lib/locales/locale.d.ts
CHANGED