carbon-react 106.6.3 → 106.6.4

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.
Files changed (27) hide show
  1. package/esm/components/button-bar/button-bar-test.stories.js +122 -0
  2. package/esm/components/button-bar/button-bar.component.d.ts +12 -15
  3. package/esm/components/button-bar/button-bar.component.js +331 -33
  4. package/esm/components/button-bar/button-bar.config.d.ts +2 -2
  5. package/esm/components/button-bar/button-bar.style.d.ts +4 -4
  6. package/esm/components/button-bar/button-bar.style.js +18 -33
  7. package/esm/components/button-bar/index.d.ts +2 -1
  8. package/esm/components/link/link.component.js +1 -5
  9. package/esm/components/menu/__internal__/spec-helper/index.js +2 -1
  10. package/esm/components/menu/__internal__/submenu/submenu.component.js +21 -4
  11. package/esm/components/menu/menu.component.js +2 -1
  12. package/esm/components/menu/scrollable-block/scrollable-block.component.js +4 -2
  13. package/lib/components/button-bar/button-bar-test.stories.js +145 -0
  14. package/lib/components/button-bar/button-bar.component.d.ts +12 -15
  15. package/lib/components/button-bar/button-bar.component.js +336 -35
  16. package/lib/components/button-bar/button-bar.config.d.ts +2 -2
  17. package/lib/components/button-bar/button-bar.style.d.ts +4 -4
  18. package/lib/components/button-bar/button-bar.style.js +18 -35
  19. package/lib/components/button-bar/index.d.ts +2 -1
  20. package/lib/components/link/link.component.js +1 -5
  21. package/lib/components/menu/__internal__/spec-helper/index.js +2 -1
  22. package/lib/components/menu/__internal__/submenu/submenu.component.js +21 -4
  23. package/lib/components/menu/menu.component.js +2 -1
  24. package/lib/components/menu/scrollable-block/scrollable-block.component.js +4 -2
  25. package/package.json +1 -1
  26. package/esm/components/button-bar/button-bar.d.ts +0 -24
  27. package/lib/components/button-bar/button-bar.d.ts +0 -24
@@ -0,0 +1,122 @@
1
+ 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); }
2
+
3
+ import React from "react";
4
+ import { action } from "@storybook/addon-actions";
5
+ import Button from "../button";
6
+ import ButtonBar from ".";
7
+ import IconButton from "../icon-button";
8
+ import Icon from "../icon";
9
+ import { BUTTON_BAR_ICON_POSITIONS, BUTTON_BAR_SIZES } from "./button-bar.config";
10
+ export default {
11
+ title: "Button Bar/Test",
12
+ parameters: {
13
+ info: {
14
+ disable: true
15
+ },
16
+ chromatic: {
17
+ disable: true
18
+ }
19
+ }
20
+ };
21
+ const commonArgTypesButtonBar = {
22
+ size: {
23
+ options: BUTTON_BAR_SIZES,
24
+ control: {
25
+ type: "select"
26
+ }
27
+ },
28
+ iconPosition: {
29
+ options: BUTTON_BAR_ICON_POSITIONS,
30
+ control: {
31
+ type: "select"
32
+ }
33
+ }
34
+ };
35
+ const commonArgsButtonBar = {
36
+ size: "medium",
37
+ fullWidth: false,
38
+ iconPosition: "before"
39
+ };
40
+ export const Default = ({ ...args
41
+ }) => /*#__PURE__*/React.createElement(ButtonBar, _extends({
42
+ onClick: action("click")
43
+ }, args), /*#__PURE__*/React.createElement(Button, {
44
+ iconType: "search"
45
+ }, "Example Button"), /*#__PURE__*/React.createElement(Button, {
46
+ iconType: "pdf"
47
+ }, "Example Button"), /*#__PURE__*/React.createElement(Button, {
48
+ iconType: "csv"
49
+ }, "Example Button"));
50
+ export const Preview = () => {
51
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ButtonBar, {
52
+ ml: 2,
53
+ mt: 2
54
+ }, /*#__PURE__*/React.createElement(IconButton, {
55
+ onAction: () => {}
56
+ }, /*#__PURE__*/React.createElement(Icon, {
57
+ type: "pdf"
58
+ })), /*#__PURE__*/React.createElement(IconButton, {
59
+ onAction: () => {}
60
+ }, /*#__PURE__*/React.createElement(Icon, {
61
+ type: "csv"
62
+ })), /*#__PURE__*/React.createElement(IconButton, {
63
+ onAction: () => {}
64
+ }, /*#__PURE__*/React.createElement(Icon, {
65
+ type: "search"
66
+ }))), BUTTON_BAR_SIZES.map(size => /*#__PURE__*/React.createElement(ButtonBar, {
67
+ key: size,
68
+ size: size,
69
+ ml: 2,
70
+ mt: 2
71
+ }, /*#__PURE__*/React.createElement(Button, {
72
+ iconType: "pdf"
73
+ }), /*#__PURE__*/React.createElement(Button, {
74
+ iconType: "csv"
75
+ }), /*#__PURE__*/React.createElement(Button, {
76
+ iconType: "search"
77
+ }))), BUTTON_BAR_ICON_POSITIONS.map(iconPosition => /*#__PURE__*/React.createElement(React.Fragment, {
78
+ key: iconPosition
79
+ }, BUTTON_BAR_SIZES.map(size => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ButtonBar, {
80
+ key: size + iconPosition,
81
+ iconPosition: iconPosition,
82
+ size: size,
83
+ ml: 2,
84
+ mt: 2
85
+ }, /*#__PURE__*/React.createElement(Button, {
86
+ iconType: "pdf"
87
+ }, iconPosition), /*#__PURE__*/React.createElement(Button, {
88
+ iconType: "csv"
89
+ }, iconPosition), /*#__PURE__*/React.createElement(Button, {
90
+ iconType: "search"
91
+ }, iconPosition)))))), BUTTON_BAR_ICON_POSITIONS.map(iconPosition => /*#__PURE__*/React.createElement(React.Fragment, {
92
+ key: iconPosition
93
+ }, BUTTON_BAR_SIZES.map(size => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ButtonBar, {
94
+ fullWidth: true,
95
+ key: `${size}${iconPosition}fullWidth`,
96
+ iconPosition: iconPosition,
97
+ size: size,
98
+ ml: 2,
99
+ mt: 2
100
+ }, /*#__PURE__*/React.createElement(Button, {
101
+ iconType: "pdf"
102
+ }, iconPosition), /*#__PURE__*/React.createElement(Button, {
103
+ iconType: "csv"
104
+ }, iconPosition), /*#__PURE__*/React.createElement(Button, {
105
+ iconType: "search"
106
+ }, iconPosition)))))));
107
+ };
108
+ Default.story = {
109
+ name: "default",
110
+ args: { ...commonArgsButtonBar
111
+ },
112
+ argTypes: { ...commonArgTypesButtonBar
113
+ }
114
+ };
115
+ Preview.story = {
116
+ name: "visual",
117
+ parameters: {
118
+ chromatic: {
119
+ disable: false
120
+ }
121
+ }
122
+ };
@@ -1,16 +1,13 @@
1
- export default ButtonBar;
2
- declare function ButtonBar({ children, size, iconPosition, buttonType, ...rest }: {
3
- [x: string]: any;
4
- children: any;
5
- size: any;
6
- iconPosition: any;
7
- buttonType: any;
8
- }): JSX.Element;
9
- declare namespace ButtonBar {
10
- const propTypes: any;
11
- namespace defaultProps {
12
- const size: string;
13
- const iconPosition: string;
14
- const fullWidth: boolean;
15
- }
1
+ import React from "react";
2
+ import { SpaceProps } from "styled-system";
3
+ export interface ButtonBarProps extends SpaceProps {
4
+ children: React.ReactNode;
5
+ /** Apply fullWidth style to the button bar */
6
+ fullWidth?: boolean;
7
+ /** Defines an Icon position for buttons: "before" | "after" */
8
+ iconPosition?: "before" | "after";
9
+ /** Assigns a size to the buttons: "small" | "medium" | "large" */
10
+ size?: "small" | "medium" | "large";
16
11
  }
12
+ declare const ButtonBar: ({ children, size, iconPosition, fullWidth, ...rest }: ButtonBarProps) => JSX.Element;
13
+ export default ButtonBar;
@@ -1,19 +1,31 @@
1
1
  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); }
2
2
 
3
- import React from "react";
3
+ import React, { useMemo } from "react";
4
4
  import PropTypes from "prop-types";
5
- import propTypes from "@styled-system/prop-types";
5
+ import invariant from "invariant";
6
6
  import StyledButtonBar from "./button-bar.style";
7
7
  import Button from "../button";
8
8
  import IconButton from "../icon-button";
9
9
 
10
10
  const ButtonBar = ({
11
11
  children,
12
- size,
13
- iconPosition,
14
- buttonType,
12
+ size = "medium",
13
+ iconPosition = "before",
14
+ fullWidth = false,
15
15
  ...rest
16
16
  }) => {
17
+ const hasProperChildren = useMemo(() => {
18
+ const incorrectChild = React.Children.toArray(children).find(child => {
19
+ if (! /*#__PURE__*/React.isValidElement(child)) {
20
+ return true;
21
+ }
22
+
23
+ return child.type !== Button && child.type !== IconButton;
24
+ });
25
+ return !incorrectChild;
26
+ }, [children]);
27
+ invariant(hasProperChildren, "ButtonBar accepts only `Button` or `IconButton` elements.");
28
+
17
29
  const getBtnProps = child => {
18
30
  var _child$props, _child$props2, _child$props2$childre, _child$props2$childre2;
19
31
 
@@ -21,44 +33,330 @@ const ButtonBar = ({
21
33
  buttonType: "secondary",
22
34
  size,
23
35
  iconPosition,
24
- fullWidth: false,
36
+ fullWidth,
25
37
  "aria-label": child.type === IconButton ? ((_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.ariaLabel) || ((_child$props2 = child.props) === null || _child$props2 === void 0 ? void 0 : (_child$props2$childre = _child$props2.children) === null || _child$props2$childre === void 0 ? void 0 : (_child$props2$childre2 = _child$props2$childre.props) === null || _child$props2$childre2 === void 0 ? void 0 : _child$props2$childre2.type) : ""
26
38
  };
27
39
  return btnProps;
28
40
  };
29
41
 
30
42
  return /*#__PURE__*/React.createElement(StyledButtonBar, _extends({}, rest, {
43
+ fullWidth: fullWidth,
31
44
  size: size
32
45
  }), React.Children.map(children, child => /*#__PURE__*/React.createElement(child.type, getBtnProps(child))));
33
46
  };
34
47
 
35
48
  ButtonBar.propTypes = {
36
- /** Assigns a size to the button: "small" | "medium" | "large" */
37
- size: PropTypes.oneOf(["small", "medium", "large"]),
38
-
39
- /** Defines an Icon position related to the children: "before" | "after" */
40
- iconPosition: PropTypes.oneOf(["before", "after"]),
41
-
42
- /** Styled system spacing props */
43
- ...propTypes.space,
44
-
45
- /** Apply fullWidth style to the button bar */
46
- fullWidth: PropTypes.bool,
47
-
48
- /** The Button / IconButton elements the button bar displays */
49
- children: props => {
50
- let error = null;
51
- React.Children.forEach(props.children, child => {
52
- if (child.type !== Button && child.type !== IconButton) {
53
- error = new Error("ButtonBar accepts only `Button` or `IconButton` elements.");
54
- }
55
- });
56
- return error;
57
- }
58
- };
59
- ButtonBar.defaultProps = {
60
- size: "medium",
61
- iconPosition: "before",
62
- fullWidth: false
49
+ "children": PropTypes.node,
50
+ "fullWidth": PropTypes.bool,
51
+ "iconPosition": PropTypes.oneOf(["after", "before"]),
52
+ "m": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
53
+ "__@toStringTag": PropTypes.string.isRequired,
54
+ "description": PropTypes.string,
55
+ "toString": PropTypes.func.isRequired,
56
+ "valueOf": PropTypes.func.isRequired
57
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
58
+ "__@toStringTag": PropTypes.string.isRequired,
59
+ "description": PropTypes.string,
60
+ "toString": PropTypes.func.isRequired,
61
+ "valueOf": PropTypes.func.isRequired
62
+ }), PropTypes.string]),
63
+ "margin": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
64
+ "__@toStringTag": PropTypes.string.isRequired,
65
+ "description": PropTypes.string,
66
+ "toString": PropTypes.func.isRequired,
67
+ "valueOf": PropTypes.func.isRequired
68
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
69
+ "__@toStringTag": PropTypes.string.isRequired,
70
+ "description": PropTypes.string,
71
+ "toString": PropTypes.func.isRequired,
72
+ "valueOf": PropTypes.func.isRequired
73
+ }), PropTypes.string]),
74
+ "marginBottom": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
75
+ "__@toStringTag": PropTypes.string.isRequired,
76
+ "description": PropTypes.string,
77
+ "toString": PropTypes.func.isRequired,
78
+ "valueOf": PropTypes.func.isRequired
79
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
80
+ "__@toStringTag": PropTypes.string.isRequired,
81
+ "description": PropTypes.string,
82
+ "toString": PropTypes.func.isRequired,
83
+ "valueOf": PropTypes.func.isRequired
84
+ }), PropTypes.string]),
85
+ "marginLeft": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
86
+ "__@toStringTag": PropTypes.string.isRequired,
87
+ "description": PropTypes.string,
88
+ "toString": PropTypes.func.isRequired,
89
+ "valueOf": PropTypes.func.isRequired
90
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
91
+ "__@toStringTag": PropTypes.string.isRequired,
92
+ "description": PropTypes.string,
93
+ "toString": PropTypes.func.isRequired,
94
+ "valueOf": PropTypes.func.isRequired
95
+ }), PropTypes.string]),
96
+ "marginRight": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
97
+ "__@toStringTag": PropTypes.string.isRequired,
98
+ "description": PropTypes.string,
99
+ "toString": PropTypes.func.isRequired,
100
+ "valueOf": PropTypes.func.isRequired
101
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
102
+ "__@toStringTag": PropTypes.string.isRequired,
103
+ "description": PropTypes.string,
104
+ "toString": PropTypes.func.isRequired,
105
+ "valueOf": PropTypes.func.isRequired
106
+ }), PropTypes.string]),
107
+ "marginTop": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
108
+ "__@toStringTag": PropTypes.string.isRequired,
109
+ "description": PropTypes.string,
110
+ "toString": PropTypes.func.isRequired,
111
+ "valueOf": PropTypes.func.isRequired
112
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
113
+ "__@toStringTag": PropTypes.string.isRequired,
114
+ "description": PropTypes.string,
115
+ "toString": PropTypes.func.isRequired,
116
+ "valueOf": PropTypes.func.isRequired
117
+ }), PropTypes.string]),
118
+ "marginX": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
119
+ "__@toStringTag": PropTypes.string.isRequired,
120
+ "description": PropTypes.string,
121
+ "toString": PropTypes.func.isRequired,
122
+ "valueOf": PropTypes.func.isRequired
123
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
124
+ "__@toStringTag": PropTypes.string.isRequired,
125
+ "description": PropTypes.string,
126
+ "toString": PropTypes.func.isRequired,
127
+ "valueOf": PropTypes.func.isRequired
128
+ }), PropTypes.string]),
129
+ "marginY": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
130
+ "__@toStringTag": PropTypes.string.isRequired,
131
+ "description": PropTypes.string,
132
+ "toString": PropTypes.func.isRequired,
133
+ "valueOf": PropTypes.func.isRequired
134
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
135
+ "__@toStringTag": PropTypes.string.isRequired,
136
+ "description": PropTypes.string,
137
+ "toString": PropTypes.func.isRequired,
138
+ "valueOf": PropTypes.func.isRequired
139
+ }), PropTypes.string]),
140
+ "mb": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
141
+ "__@toStringTag": PropTypes.string.isRequired,
142
+ "description": PropTypes.string,
143
+ "toString": PropTypes.func.isRequired,
144
+ "valueOf": PropTypes.func.isRequired
145
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
146
+ "__@toStringTag": PropTypes.string.isRequired,
147
+ "description": PropTypes.string,
148
+ "toString": PropTypes.func.isRequired,
149
+ "valueOf": PropTypes.func.isRequired
150
+ }), PropTypes.string]),
151
+ "ml": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
152
+ "__@toStringTag": PropTypes.string.isRequired,
153
+ "description": PropTypes.string,
154
+ "toString": PropTypes.func.isRequired,
155
+ "valueOf": PropTypes.func.isRequired
156
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
157
+ "__@toStringTag": PropTypes.string.isRequired,
158
+ "description": PropTypes.string,
159
+ "toString": PropTypes.func.isRequired,
160
+ "valueOf": PropTypes.func.isRequired
161
+ }), PropTypes.string]),
162
+ "mr": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
163
+ "__@toStringTag": PropTypes.string.isRequired,
164
+ "description": PropTypes.string,
165
+ "toString": PropTypes.func.isRequired,
166
+ "valueOf": PropTypes.func.isRequired
167
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
168
+ "__@toStringTag": PropTypes.string.isRequired,
169
+ "description": PropTypes.string,
170
+ "toString": PropTypes.func.isRequired,
171
+ "valueOf": PropTypes.func.isRequired
172
+ }), PropTypes.string]),
173
+ "mt": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
174
+ "__@toStringTag": PropTypes.string.isRequired,
175
+ "description": PropTypes.string,
176
+ "toString": PropTypes.func.isRequired,
177
+ "valueOf": PropTypes.func.isRequired
178
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
179
+ "__@toStringTag": PropTypes.string.isRequired,
180
+ "description": PropTypes.string,
181
+ "toString": PropTypes.func.isRequired,
182
+ "valueOf": PropTypes.func.isRequired
183
+ }), PropTypes.string]),
184
+ "mx": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
185
+ "__@toStringTag": PropTypes.string.isRequired,
186
+ "description": PropTypes.string,
187
+ "toString": PropTypes.func.isRequired,
188
+ "valueOf": PropTypes.func.isRequired
189
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
190
+ "__@toStringTag": PropTypes.string.isRequired,
191
+ "description": PropTypes.string,
192
+ "toString": PropTypes.func.isRequired,
193
+ "valueOf": PropTypes.func.isRequired
194
+ }), PropTypes.string]),
195
+ "my": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
196
+ "__@toStringTag": PropTypes.string.isRequired,
197
+ "description": PropTypes.string,
198
+ "toString": PropTypes.func.isRequired,
199
+ "valueOf": PropTypes.func.isRequired
200
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
201
+ "__@toStringTag": PropTypes.string.isRequired,
202
+ "description": PropTypes.string,
203
+ "toString": PropTypes.func.isRequired,
204
+ "valueOf": PropTypes.func.isRequired
205
+ }), PropTypes.string]),
206
+ "p": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
207
+ "__@toStringTag": PropTypes.string.isRequired,
208
+ "description": PropTypes.string,
209
+ "toString": PropTypes.func.isRequired,
210
+ "valueOf": PropTypes.func.isRequired
211
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
212
+ "__@toStringTag": PropTypes.string.isRequired,
213
+ "description": PropTypes.string,
214
+ "toString": PropTypes.func.isRequired,
215
+ "valueOf": PropTypes.func.isRequired
216
+ }), PropTypes.string]),
217
+ "padding": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
218
+ "__@toStringTag": PropTypes.string.isRequired,
219
+ "description": PropTypes.string,
220
+ "toString": PropTypes.func.isRequired,
221
+ "valueOf": PropTypes.func.isRequired
222
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
223
+ "__@toStringTag": PropTypes.string.isRequired,
224
+ "description": PropTypes.string,
225
+ "toString": PropTypes.func.isRequired,
226
+ "valueOf": PropTypes.func.isRequired
227
+ }), PropTypes.string]),
228
+ "paddingBottom": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
229
+ "__@toStringTag": PropTypes.string.isRequired,
230
+ "description": PropTypes.string,
231
+ "toString": PropTypes.func.isRequired,
232
+ "valueOf": PropTypes.func.isRequired
233
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
234
+ "__@toStringTag": PropTypes.string.isRequired,
235
+ "description": PropTypes.string,
236
+ "toString": PropTypes.func.isRequired,
237
+ "valueOf": PropTypes.func.isRequired
238
+ }), PropTypes.string]),
239
+ "paddingLeft": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
240
+ "__@toStringTag": PropTypes.string.isRequired,
241
+ "description": PropTypes.string,
242
+ "toString": PropTypes.func.isRequired,
243
+ "valueOf": PropTypes.func.isRequired
244
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
245
+ "__@toStringTag": PropTypes.string.isRequired,
246
+ "description": PropTypes.string,
247
+ "toString": PropTypes.func.isRequired,
248
+ "valueOf": PropTypes.func.isRequired
249
+ }), PropTypes.string]),
250
+ "paddingRight": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
251
+ "__@toStringTag": PropTypes.string.isRequired,
252
+ "description": PropTypes.string,
253
+ "toString": PropTypes.func.isRequired,
254
+ "valueOf": PropTypes.func.isRequired
255
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
256
+ "__@toStringTag": PropTypes.string.isRequired,
257
+ "description": PropTypes.string,
258
+ "toString": PropTypes.func.isRequired,
259
+ "valueOf": PropTypes.func.isRequired
260
+ }), PropTypes.string]),
261
+ "paddingTop": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
262
+ "__@toStringTag": PropTypes.string.isRequired,
263
+ "description": PropTypes.string,
264
+ "toString": PropTypes.func.isRequired,
265
+ "valueOf": PropTypes.func.isRequired
266
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
267
+ "__@toStringTag": PropTypes.string.isRequired,
268
+ "description": PropTypes.string,
269
+ "toString": PropTypes.func.isRequired,
270
+ "valueOf": PropTypes.func.isRequired
271
+ }), PropTypes.string]),
272
+ "paddingX": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
273
+ "__@toStringTag": PropTypes.string.isRequired,
274
+ "description": PropTypes.string,
275
+ "toString": PropTypes.func.isRequired,
276
+ "valueOf": PropTypes.func.isRequired
277
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
278
+ "__@toStringTag": PropTypes.string.isRequired,
279
+ "description": PropTypes.string,
280
+ "toString": PropTypes.func.isRequired,
281
+ "valueOf": PropTypes.func.isRequired
282
+ }), PropTypes.string]),
283
+ "paddingY": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
284
+ "__@toStringTag": PropTypes.string.isRequired,
285
+ "description": PropTypes.string,
286
+ "toString": PropTypes.func.isRequired,
287
+ "valueOf": PropTypes.func.isRequired
288
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
289
+ "__@toStringTag": PropTypes.string.isRequired,
290
+ "description": PropTypes.string,
291
+ "toString": PropTypes.func.isRequired,
292
+ "valueOf": PropTypes.func.isRequired
293
+ }), PropTypes.string]),
294
+ "pb": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
295
+ "__@toStringTag": PropTypes.string.isRequired,
296
+ "description": PropTypes.string,
297
+ "toString": PropTypes.func.isRequired,
298
+ "valueOf": PropTypes.func.isRequired
299
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
300
+ "__@toStringTag": PropTypes.string.isRequired,
301
+ "description": PropTypes.string,
302
+ "toString": PropTypes.func.isRequired,
303
+ "valueOf": PropTypes.func.isRequired
304
+ }), PropTypes.string]),
305
+ "pl": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
306
+ "__@toStringTag": PropTypes.string.isRequired,
307
+ "description": PropTypes.string,
308
+ "toString": PropTypes.func.isRequired,
309
+ "valueOf": PropTypes.func.isRequired
310
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
311
+ "__@toStringTag": PropTypes.string.isRequired,
312
+ "description": PropTypes.string,
313
+ "toString": PropTypes.func.isRequired,
314
+ "valueOf": PropTypes.func.isRequired
315
+ }), PropTypes.string]),
316
+ "pr": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
317
+ "__@toStringTag": PropTypes.string.isRequired,
318
+ "description": PropTypes.string,
319
+ "toString": PropTypes.func.isRequired,
320
+ "valueOf": PropTypes.func.isRequired
321
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
322
+ "__@toStringTag": PropTypes.string.isRequired,
323
+ "description": PropTypes.string,
324
+ "toString": PropTypes.func.isRequired,
325
+ "valueOf": PropTypes.func.isRequired
326
+ }), PropTypes.string]),
327
+ "pt": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
328
+ "__@toStringTag": PropTypes.string.isRequired,
329
+ "description": PropTypes.string,
330
+ "toString": PropTypes.func.isRequired,
331
+ "valueOf": PropTypes.func.isRequired
332
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
333
+ "__@toStringTag": PropTypes.string.isRequired,
334
+ "description": PropTypes.string,
335
+ "toString": PropTypes.func.isRequired,
336
+ "valueOf": PropTypes.func.isRequired
337
+ }), PropTypes.string]),
338
+ "px": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
339
+ "__@toStringTag": PropTypes.string.isRequired,
340
+ "description": PropTypes.string,
341
+ "toString": PropTypes.func.isRequired,
342
+ "valueOf": PropTypes.func.isRequired
343
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
344
+ "__@toStringTag": PropTypes.string.isRequired,
345
+ "description": PropTypes.string,
346
+ "toString": PropTypes.func.isRequired,
347
+ "valueOf": PropTypes.func.isRequired
348
+ }), PropTypes.string]),
349
+ "py": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
350
+ "__@toStringTag": PropTypes.string.isRequired,
351
+ "description": PropTypes.string,
352
+ "toString": PropTypes.func.isRequired,
353
+ "valueOf": PropTypes.func.isRequired
354
+ }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
355
+ "__@toStringTag": PropTypes.string.isRequired,
356
+ "description": PropTypes.string,
357
+ "toString": PropTypes.func.isRequired,
358
+ "valueOf": PropTypes.func.isRequired
359
+ }), PropTypes.string]),
360
+ "size": PropTypes.oneOf(["large", "medium", "small"])
63
361
  };
64
362
  export default ButtonBar;
@@ -1,2 +1,2 @@
1
- export const BUTTON_BAR_SIZES: string[];
2
- export const BUTTON_BAR_ICON_POSITIONS: string[];
1
+ export declare const BUTTON_BAR_SIZES: string[];
2
+ export declare const BUTTON_BAR_ICON_POSITIONS: string[];
@@ -1,4 +1,4 @@
1
- export default ButtonBar;
2
- declare const ButtonBar: import("styled-components").StyledComponent<"div", any, {
3
- size: any;
4
- }, never>;
1
+ import { SpaceProps } from "styled-system";
2
+ import { ButtonBarProps } from "./button-bar.component";
3
+ declare const StyledButtonBar: import("styled-components").StyledComponent<"div", any, SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & Pick<ButtonBarProps, "size" | "fullWidth">, never>;
4
+ export default StyledButtonBar;
@@ -1,32 +1,26 @@
1
1
  import styled, { css } from "styled-components";
2
2
  import { space } from "styled-system";
3
- import PropTypes from "prop-types";
4
- import propTypes from "@styled-system/prop-types";
5
3
  import BaseTheme from "../../style/themes/base";
6
4
  import StyledIcon from "../icon/icon.style";
7
- const ButtonBar = styled.div`
5
+ const StyledButtonBar = styled.div`
8
6
  ${space}
9
- ${stylingForType}
10
- `;
11
7
 
12
- function stylingForType({
8
+ ${({
9
+ fullWidth,
13
10
  size
14
- }) {
15
- return css`
16
- ${({
17
- fullWidth
18
- }) => fullWidth && css`
11
+ }) => css`
12
+ ${fullWidth && css`
13
+ width: 100%;
14
+ display: flex;
15
+ button {
16
+ box-sizing: content-box;
17
+ padding: 0;
19
18
  width: 100%;
20
- display: flex;
21
- button {
22
- box-sizing: content-box;
23
- padding: 0;
24
- width: 100%;
25
- ${size === "small" && "min-height: 28px"}
26
- ${size === "medium" && "min-height: 36px"}
19
+ ${size === "small" && "min-height: 28px"}
20
+ ${size === "medium" && "min-height: 36px"}
27
21
  ${size === "large" && "min-height: 44px"}
28
- }
29
- `}
22
+ }
23
+ `}
30
24
 
31
25
  button {
32
26
  margin: 0;
@@ -57,19 +51,10 @@ function stylingForType({
57
51
  color: var(--colorsActionMajor500);
58
52
  }
59
53
  }
60
- `;
61
- }
62
-
63
- ButtonBar.defaultProps = {
54
+ `}
55
+ `;
56
+ StyledButtonBar.defaultProps = {
64
57
  theme: BaseTheme,
65
58
  size: "medium"
66
59
  };
67
- ButtonBar.propTypes = {
68
- /** Styled system spacing props */
69
- ...propTypes.space,
70
-
71
- /** Assigns a size to the button: "small" | "medium" | "large" */
72
- size: PropTypes.oneOf(["small", "medium", "large"]),
73
- children: PropTypes.node.isRequired
74
- };
75
- export default ButtonBar;
60
+ export default StyledButtonBar;
@@ -1 +1,2 @@
1
- export { default } from "./button-bar";
1
+ export { default } from "./button-bar.component";
2
+ export type { ButtonBarProps } from "./button-bar.component";
@@ -86,11 +86,7 @@ const Link = /*#__PURE__*/React.forwardRef(({
86
86
  type = "button";
87
87
  }
88
88
 
89
- return /*#__PURE__*/React.createElement(type, { ...componentProps,
90
- ...(type === "button" && {
91
- role: "link"
92
- })
93
- }, /*#__PURE__*/React.createElement(React.Fragment, null, renderLinkIcon(), /*#__PURE__*/React.createElement(StyledContent, null, isSkipLink ? l.link.skipLinkLabel() : children), renderLinkIcon("right")));
89
+ return /*#__PURE__*/React.createElement(type, componentProps, /*#__PURE__*/React.createElement(React.Fragment, null, renderLinkIcon(), /*#__PURE__*/React.createElement(StyledContent, null, isSkipLink ? l.link.skipLinkLabel() : children), renderLinkIcon("right")));
94
90
  };
95
91
 
96
92
  return /*#__PURE__*/React.createElement(StyledLink, _extends({
@@ -9,7 +9,8 @@ const events = {
9
9
  };
10
10
 
11
11
  const openSubmenu = wrapper => {
12
- const menuItem = wrapper.find('[data-component="submenu-wrapper"]').find("a");
12
+ const menuWrapper = wrapper.find('[data-component="submenu-wrapper"]');
13
+ const menuItem = menuWrapper.exists("a") ? menuWrapper.find("a") : menuWrapper.find("button");
13
14
  menuItem.getDOMNode().focus();
14
15
  act(() => {
15
16
  wrapper.find(StyledMenuItemWrapper).at(0).props().onKeyDown(events.space);