carbon-react 115.0.1 → 116.0.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__/radio-button-mapper/radio-button-mapper.component.d.ts +1 -1
- 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 +13 -3
- package/esm/components/pages/pages.component.d.ts +0 -2
- package/esm/components/pages/pages.component.js +0 -1
- package/esm/components/split-button/split-button.component.js +2 -2
- package/esm/components/tile-select/__internal__/accordion/accordion.component.d.ts +10 -0
- package/esm/components/tile-select/__internal__/accordion/accordion.component.js +317 -9
- package/esm/components/tile-select/__internal__/accordion/accordion.style.d.ts +3 -0
- package/esm/components/tile-select/__internal__/accordion/index.d.ts +1 -0
- package/esm/components/tile-select/index.d.ts +4 -2
- package/esm/components/tile-select/index.js +2 -2
- package/esm/components/tile-select/tile-select-group.component.d.ts +25 -0
- package/esm/components/tile-select/tile-select-group.component.js +184 -59
- package/esm/components/tile-select/tile-select.component.d.ts +58 -0
- package/esm/components/tile-select/tile-select.component.js +192 -100
- package/esm/components/tile-select/tile-select.style.d.ts +36 -0
- package/lib/__internal__/radio-button-mapper/radio-button-mapper.component.d.ts +1 -1
- 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 +13 -3
- package/lib/components/pages/pages.component.d.ts +0 -2
- package/lib/components/pages/pages.component.js +0 -1
- package/lib/components/split-button/split-button.component.js +2 -2
- package/lib/components/tile-select/__internal__/accordion/accordion.component.d.ts +10 -0
- package/lib/components/tile-select/__internal__/accordion/accordion.component.js +316 -8
- package/lib/components/tile-select/__internal__/accordion/accordion.style.d.ts +3 -0
- package/lib/components/tile-select/__internal__/accordion/index.d.ts +1 -0
- package/lib/components/tile-select/index.d.ts +4 -2
- package/lib/components/tile-select/index.js +4 -4
- package/lib/components/tile-select/tile-select-group.component.d.ts +25 -0
- package/lib/components/tile-select/tile-select-group.component.js +188 -68
- package/lib/components/tile-select/tile-select.component.d.ts +58 -0
- package/lib/components/tile-select/tile-select.component.js +192 -105
- package/lib/components/tile-select/tile-select.style.d.ts +36 -0
- package/package.json +1 -1
- package/esm/components/tile-select/__internal__/accordion/accordion.d.ts +0 -13
- package/esm/components/tile-select/tile-select-group.d.ts +0 -27
- package/esm/components/tile-select/tile-select.d.ts +0 -51
- package/lib/components/tile-select/__internal__/accordion/accordion.d.ts +0 -13
- package/lib/components/tile-select/tile-select-group.d.ts +0 -27
- package/lib/components/tile-select/tile-select.d.ts +0 -51
|
@@ -2,37 +2,31 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
|
|
|
2
2
|
|
|
3
3
|
import React, { useState, useEffect, useRef } from "react";
|
|
4
4
|
import PropTypes from "prop-types";
|
|
5
|
-
import styledSystemPropTypes from "@styled-system/prop-types";
|
|
6
5
|
import tagComponent from "../../__internal__/utils/helpers/tags/tags";
|
|
7
6
|
import useLocale from "../../hooks/__internal__/useLocale";
|
|
8
7
|
import createGuid from "../../__internal__/utils/helpers/guid";
|
|
9
8
|
import Button from "../button";
|
|
10
9
|
import Box from "../box";
|
|
11
10
|
import Accordion from "./__internal__/accordion";
|
|
12
|
-
import Logger from "../../__internal__/utils/logger";
|
|
13
11
|
import { StyledTileSelectContainer, StyledTileSelect, StyledTileSelectInput, StyledTitleContainer, StyledTitle, StyledSubtitle, StyledAdornment, StyledDescription, StyledDeselectWrapper, StyledFooterWrapper, StyledFocusWrapper, StyledAccordionFooterWrapper } from "./tile-select.style";
|
|
14
12
|
import { filterStyledSystemMarginProps } from "../../style/utils";
|
|
15
|
-
const marginPropTypes = filterStyledSystemMarginProps(styledSystemPropTypes.space);
|
|
16
13
|
|
|
17
|
-
const checkPropTypeIsNode = prop => typeof prop !== "string"
|
|
18
|
-
as: "div"
|
|
19
|
-
};
|
|
14
|
+
const checkPropTypeIsNode = prop => typeof prop !== "string";
|
|
20
15
|
|
|
21
|
-
let deprecateInputRefWarnTriggered = false;
|
|
22
16
|
const TileSelect = /*#__PURE__*/React.forwardRef(({
|
|
23
17
|
onChange,
|
|
24
18
|
onBlur,
|
|
25
19
|
onFocus,
|
|
26
20
|
value,
|
|
27
21
|
name,
|
|
28
|
-
checked,
|
|
22
|
+
checked = false,
|
|
29
23
|
className,
|
|
30
24
|
disabled,
|
|
31
25
|
title,
|
|
32
26
|
subtitle,
|
|
33
27
|
description,
|
|
34
28
|
titleAdornment,
|
|
35
|
-
type,
|
|
29
|
+
type = "checkbox",
|
|
36
30
|
id,
|
|
37
31
|
customActionButton,
|
|
38
32
|
actionButtonAdornment,
|
|
@@ -42,13 +36,12 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
42
36
|
accordionContent,
|
|
43
37
|
accordionControl,
|
|
44
38
|
accordionExpanded,
|
|
45
|
-
inputRef,
|
|
46
39
|
...rest
|
|
47
40
|
}, ref) => {
|
|
48
41
|
const l = useLocale();
|
|
49
42
|
const [hasFocus, setHasFocus] = useState(false);
|
|
50
43
|
|
|
51
|
-
const handleDeselect = () => onChange({
|
|
44
|
+
const handleDeselect = () => onChange === null || onChange === void 0 ? void 0 : onChange({
|
|
52
45
|
target: { ...(name && {
|
|
53
46
|
name
|
|
54
47
|
}),
|
|
@@ -60,11 +53,6 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
60
53
|
}
|
|
61
54
|
});
|
|
62
55
|
|
|
63
|
-
if (!deprecateInputRefWarnTriggered && inputRef) {
|
|
64
|
-
deprecateInputRefWarnTriggered = true;
|
|
65
|
-
Logger.deprecate("The `inputRef` prop in `TileSelect` component is deprecated and will soon be removed. Please use `ref` instead.");
|
|
66
|
-
}
|
|
67
|
-
|
|
68
56
|
const renderActionButton = () => /*#__PURE__*/React.createElement(StyledDeselectWrapper, {
|
|
69
57
|
hasActionAdornment: !!actionButtonAdornment
|
|
70
58
|
}, customActionButton && customActionButton(handleDeselect), !customActionButton && checked && /*#__PURE__*/React.createElement(Button, {
|
|
@@ -93,15 +81,11 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
93
81
|
onChange: onChange,
|
|
94
82
|
onBlur: ev => {
|
|
95
83
|
setHasFocus(false);
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
if (onBlur) onBlur(ev);
|
|
84
|
+
onBlur === null || onBlur === void 0 ? void 0 : onBlur(ev);
|
|
99
85
|
},
|
|
100
86
|
onFocus: ev => {
|
|
101
87
|
setHasFocus(true);
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
if (onFocus) onFocus(ev);
|
|
88
|
+
onFocus === null || onFocus === void 0 ? void 0 : onFocus(ev);
|
|
105
89
|
},
|
|
106
90
|
checked: checked,
|
|
107
91
|
name: name,
|
|
@@ -110,7 +94,6 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
110
94
|
disabled: disabled,
|
|
111
95
|
"aria-checked": checked,
|
|
112
96
|
id: id,
|
|
113
|
-
inputRef: inputRef,
|
|
114
97
|
ref: ref
|
|
115
98
|
}, rest)), /*#__PURE__*/React.createElement(StyledTileSelect, {
|
|
116
99
|
disabled: disabled,
|
|
@@ -120,10 +103,16 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
120
103
|
justifyContent: "space-between",
|
|
121
104
|
flexDirection: "row-reverse"
|
|
122
105
|
}, (customActionButton || checked) && renderActionButton(), /*#__PURE__*/React.createElement(Box, {
|
|
123
|
-
flexGrow:
|
|
124
|
-
}, /*#__PURE__*/React.createElement(StyledTitleContainer, null, title && /*#__PURE__*/React.createElement(StyledTitle,
|
|
106
|
+
flexGrow: 1
|
|
107
|
+
}, /*#__PURE__*/React.createElement(StyledTitleContainer, null, title && /*#__PURE__*/React.createElement(StyledTitle, {
|
|
108
|
+
as: checkPropTypeIsNode(title) ? "div" : undefined
|
|
109
|
+
}, title), subtitle && /*#__PURE__*/React.createElement(StyledSubtitle, {
|
|
110
|
+
as: checkPropTypeIsNode(subtitle) ? "div" : undefined
|
|
111
|
+
}, subtitle), titleAdornment && /*#__PURE__*/React.createElement(StyledAdornment, {
|
|
125
112
|
hasAdditionalInformation: !!additionalInformation
|
|
126
|
-
}, titleAdornment)), additionalInformation && /*#__PURE__*/React.createElement("div", null, additionalInformation), /*#__PURE__*/React.createElement(StyledDescription,
|
|
113
|
+
}, titleAdornment)), additionalInformation && /*#__PURE__*/React.createElement("div", null, additionalInformation), /*#__PURE__*/React.createElement(StyledDescription, {
|
|
114
|
+
as: checkPropTypeIsNode(description) ? "div" : undefined
|
|
115
|
+
}, description), footer && /*#__PURE__*/React.createElement(StyledFooterWrapper, null, footer), accordionContent && accordionControl && /*#__PURE__*/React.createElement(StyledAccordionFooterWrapper, {
|
|
127
116
|
accordionExpanded: accordionExpanded
|
|
128
117
|
}, accordionControl(controlId, contentId))), prefixAdornment && /*#__PURE__*/React.createElement(Box, {
|
|
129
118
|
"data-element": "prefix-adornment",
|
|
@@ -135,80 +124,183 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
135
124
|
expanded: accordionExpanded
|
|
136
125
|
}, accordionContent)));
|
|
137
126
|
});
|
|
138
|
-
TileSelect.
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
127
|
+
TileSelect.propTypes = {
|
|
128
|
+
"accordionContent": PropTypes.node,
|
|
129
|
+
"accordionControl": PropTypes.func,
|
|
130
|
+
"accordionExpanded": PropTypes.bool,
|
|
131
|
+
"actionButtonAdornment": PropTypes.node,
|
|
132
|
+
"additionalInformation": PropTypes.node,
|
|
133
|
+
"checked": PropTypes.bool,
|
|
134
|
+
"className": PropTypes.string,
|
|
135
|
+
"customActionButton": PropTypes.func,
|
|
136
|
+
"description": PropTypes.node,
|
|
137
|
+
"disabled": PropTypes.bool,
|
|
138
|
+
"footer": PropTypes.node,
|
|
139
|
+
"id": PropTypes.string,
|
|
140
|
+
"m": 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
|
+
"margin": 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
|
+
"marginBottom": 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
|
+
"marginLeft": 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
|
+
"marginRight": 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
|
+
"marginTop": 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
|
+
"marginX": 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
|
+
"marginY": 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
|
+
"mb": 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
|
+
"ml": 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
|
+
"mr": 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
|
+
"mt": 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
|
+
"mx": 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
|
+
"my": 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
|
+
"name": PropTypes.string,
|
|
295
|
+
"onBlur": PropTypes.func,
|
|
296
|
+
"onChange": PropTypes.func,
|
|
297
|
+
"onFocus": PropTypes.func,
|
|
298
|
+
"prefixAdornment": PropTypes.node,
|
|
299
|
+
"subtitle": PropTypes.node,
|
|
300
|
+
"title": PropTypes.node,
|
|
301
|
+
"titleAdornment": PropTypes.node,
|
|
302
|
+
"type": PropTypes.oneOf(["checkbox", "radio"]),
|
|
303
|
+
"value": PropTypes.string
|
|
212
304
|
};
|
|
213
305
|
TileSelect.displayName = "TileSelect";
|
|
214
306
|
export default TileSelect;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
declare const StyledTitle: import("styled-components").StyledComponent<"h3", any, {}, never>;
|
|
3
|
+
declare const StyledSubtitle: import("styled-components").StyledComponent<"h4", any, {}, never>;
|
|
4
|
+
declare const StyledAdornment: import("styled-components").StyledComponent<"div", any, {
|
|
5
|
+
hasAdditionalInformation: boolean;
|
|
6
|
+
}, never>;
|
|
7
|
+
declare const StyledDescription: import("styled-components").StyledComponent<"p", any, {}, never>;
|
|
8
|
+
declare const StyledTileSelect: import("styled-components").StyledComponent<"div", any, {
|
|
9
|
+
checked?: boolean | undefined;
|
|
10
|
+
disabled?: boolean | undefined;
|
|
11
|
+
}, never>;
|
|
12
|
+
declare const StyledFocusWrapper: import("styled-components").StyledComponent<"div", any, {
|
|
13
|
+
checked?: boolean | undefined;
|
|
14
|
+
hasFocus: boolean;
|
|
15
|
+
}, never>;
|
|
16
|
+
declare const StyledTileSelectContainer: import("styled-components").StyledComponent<"div", any, {
|
|
17
|
+
checked?: boolean | undefined;
|
|
18
|
+
disabled?: boolean | undefined;
|
|
19
|
+
}, never>;
|
|
20
|
+
declare const StyledFooterWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
21
|
+
declare const StyledAccordionFooterWrapper: import("styled-components").StyledComponent<"div", any, {
|
|
22
|
+
accordionExpanded?: boolean | undefined;
|
|
23
|
+
}, never>;
|
|
24
|
+
declare const StyledTileSelectInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../../__internal__/input").InputProps & import("react").RefAttributes<HTMLInputElement | HTMLTextAreaElement>>, any, {}, never>;
|
|
25
|
+
declare const StyledTitleContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
26
|
+
declare const StyledDeselectWrapper: import("styled-components").StyledComponent<"div", any, {
|
|
27
|
+
hasActionAdornment: boolean;
|
|
28
|
+
}, never>;
|
|
29
|
+
declare const StyledTileSelectFieldset: import("styled-components").StyledComponent<{
|
|
30
|
+
({ children, inline, legend, ...rest }: import("../fieldset").FieldsetProps): JSX.Element;
|
|
31
|
+
displayName: string;
|
|
32
|
+
}, any, {
|
|
33
|
+
multiSelect: boolean;
|
|
34
|
+
}, never>;
|
|
35
|
+
declare const StyledGroupDescription: import("styled-components").StyledComponent<"p", any, {}, never>;
|
|
36
|
+
export { StyledTileSelectFieldset, StyledGroupDescription, StyledTileSelectContainer, StyledTileSelect, StyledTileSelectInput, StyledTitleContainer, StyledTitle, StyledSubtitle, StyledAdornment, StyledDescription, StyledDeselectWrapper, StyledFooterWrapper, StyledFocusWrapper, StyledAccordionFooterWrapper, };
|
|
@@ -15,7 +15,7 @@ export interface RadioButtonMapperProps extends InputEvents {
|
|
|
15
15
|
/** Specifies the name prop to be applied to each button in the group */
|
|
16
16
|
name: string;
|
|
17
17
|
/** Value of the selected RadioButton */
|
|
18
|
-
value?: string;
|
|
18
|
+
value?: string | null;
|
|
19
19
|
}
|
|
20
20
|
export interface MappedChildProps {
|
|
21
21
|
defaultChecked?: boolean;
|
|
@@ -7,5 +7,5 @@ export interface MultiActionButtonProps extends WidthProps, Omit<SplitButtonProp
|
|
|
7
7
|
/** Second text child, renders under main text, only when size is "large" */
|
|
8
8
|
subtext?: string;
|
|
9
9
|
}
|
|
10
|
-
export declare const MultiActionButton: ({ align, disabled, buttonType, size, children, text, subtext, width, "data-element": dataElement, "data-role": dataRole, ...rest }: MultiActionButtonProps) => JSX.Element;
|
|
10
|
+
export declare const MultiActionButton: ({ align, disabled, buttonType, size, children, text, subtext, width, onClick, "data-element": dataElement, "data-role": dataRole, ...rest }: MultiActionButtonProps) => JSX.Element;
|
|
11
11
|
export default MultiActionButton;
|
|
@@ -40,6 +40,7 @@ const MultiActionButton = ({
|
|
|
40
40
|
text,
|
|
41
41
|
subtext,
|
|
42
42
|
width,
|
|
43
|
+
onClick,
|
|
43
44
|
"data-element": dataElement,
|
|
44
45
|
"data-role": dataRole,
|
|
45
46
|
...rest
|
|
@@ -106,11 +107,23 @@ const MultiActionButton = ({
|
|
|
106
107
|
}
|
|
107
108
|
};
|
|
108
109
|
|
|
110
|
+
const handleInsideClick = (0, _useClickAwayListener.default)(hideButtons);
|
|
111
|
+
|
|
112
|
+
const handleClick = ev => {
|
|
113
|
+
showButtons();
|
|
114
|
+
handleInsideClick();
|
|
115
|
+
|
|
116
|
+
if (onClick) {
|
|
117
|
+
onClick(ev);
|
|
118
|
+
}
|
|
119
|
+
};
|
|
120
|
+
|
|
109
121
|
const mainButtonProps = {
|
|
110
122
|
disabled,
|
|
111
123
|
displayed: showAdditionalButtons,
|
|
112
124
|
onTouchStart: showButtons,
|
|
113
125
|
onKeyDown: handleMainButtonKeyDown,
|
|
126
|
+
onClick: handleClick,
|
|
114
127
|
buttonType,
|
|
115
128
|
size,
|
|
116
129
|
subtext,
|
|
@@ -133,16 +146,13 @@ const MultiActionButton = ({
|
|
|
133
146
|
onKeyDown: handleKeyDown
|
|
134
147
|
}, childrenWithProps()));
|
|
135
148
|
|
|
136
|
-
const handleClick = (0, _useClickAwayListener.default)(hideButtons);
|
|
137
149
|
const hideButtonsIfTriggerNotFocused = (0, _react.useCallback)(() => {
|
|
138
150
|
if (buttonRef.current === document.activeElement) return;
|
|
139
151
|
setShowAdditionalButtons(false);
|
|
140
152
|
}, []);
|
|
141
153
|
const marginProps = (0, _utils.filterStyledSystemMarginProps)(rest);
|
|
142
154
|
return /*#__PURE__*/_react.default.createElement(_multiActionButton.StyledMultiActionButton, _extends({
|
|
143
|
-
"aria-haspopup": "true",
|
|
144
155
|
onMouseLeave: hideButtonsIfTriggerNotFocused,
|
|
145
|
-
onClick: handleClick,
|
|
146
156
|
ref: ref,
|
|
147
157
|
"data-component": "multi-action-button",
|
|
148
158
|
"data-element": dataElement,
|
|
@@ -2,8 +2,6 @@ import React from "react";
|
|
|
2
2
|
import Page from "./page";
|
|
3
3
|
import { ThemeObject } from "../../style/themes/base";
|
|
4
4
|
export interface PagesProps {
|
|
5
|
-
/** [legacy] Custom className */
|
|
6
|
-
className?: string;
|
|
7
5
|
/** The selected tab on page load */
|
|
8
6
|
initialpageIndex?: number | string;
|
|
9
7
|
/** The current page's index */
|
|
@@ -113,7 +113,6 @@ const Pages = ({
|
|
|
113
113
|
|
|
114
114
|
Pages.propTypes = {
|
|
115
115
|
"children": _propTypes.default.node,
|
|
116
|
-
"className": _propTypes.default.string,
|
|
117
116
|
"initialpageIndex": _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
|
|
118
117
|
"pageIndex": _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
|
|
119
118
|
"theme": _propTypes.default.shape({
|
|
@@ -124,7 +124,8 @@ const SplitButton = ({
|
|
|
124
124
|
buttonType,
|
|
125
125
|
size,
|
|
126
126
|
...(!disabled && {
|
|
127
|
-
onMouseEnter: showButtons
|
|
127
|
+
onMouseEnter: showButtons,
|
|
128
|
+
onClick: showButtons
|
|
128
129
|
})
|
|
129
130
|
};
|
|
130
131
|
|
|
@@ -204,7 +205,6 @@ const SplitButton = ({
|
|
|
204
205
|
const handleClick = (0, _useClickAwayListener.default)(hideButtons);
|
|
205
206
|
const marginProps = (0, _utils.filterStyledSystemMarginProps)(rest);
|
|
206
207
|
return /*#__PURE__*/_react.default.createElement(_splitButton.default, _extends({
|
|
207
|
-
"aria-haspopup": "true",
|
|
208
208
|
onMouseLeave: hideButtonsIfTriggerNotFocused,
|
|
209
209
|
onClick: handleClick,
|
|
210
210
|
ref: splitButtonNode
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { SpaceProps } from "styled-system";
|
|
3
|
+
export interface AccordionProps extends SpaceProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
expanded?: boolean;
|
|
6
|
+
contentId?: string;
|
|
7
|
+
controlId?: string;
|
|
8
|
+
}
|
|
9
|
+
declare const Accordion: ({ children, expanded, contentId, controlId, }: AccordionProps) => JSX.Element;
|
|
10
|
+
export default Accordion;
|