@entur/form 5.2.1 → 5.3.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/CHANGELOG.md +14 -0
- package/dist/Checkbox.d.ts +1 -1
- package/dist/RadioPanel.d.ts +1 -1
- package/dist/Switch.d.ts +19 -11
- package/dist/TextArea.d.ts +1 -1
- package/dist/TextField.d.ts +2 -2
- package/dist/form.cjs.development.js +187 -138
- package/dist/form.cjs.development.js.map +1 -1
- package/dist/form.cjs.production.min.js +1 -1
- package/dist/form.cjs.production.min.js.map +1 -1
- package/dist/form.esm.js +75 -46
- package/dist/form.esm.js.map +1 -1
- package/dist/segmented-control/SegmentedChoice.d.ts +1 -1
- package/dist/styles.css +199 -199
- package/dist/utils.d.ts +1 -1
- package/package.json +11 -11
|
@@ -2,17 +2,38 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
6
|
-
|
|
7
5
|
var utils = require('@entur/utils');
|
|
8
6
|
var tooltip = require('@entur/tooltip');
|
|
9
|
-
var classNames =
|
|
7
|
+
var classNames = require('classnames');
|
|
10
8
|
var React = require('react');
|
|
11
|
-
var React__default = _interopDefault(React);
|
|
12
9
|
var icons = require('@entur/icons');
|
|
13
10
|
var typography = require('@entur/typography');
|
|
14
11
|
var tokens = require('@entur/tokens');
|
|
15
12
|
|
|
13
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
14
|
+
|
|
15
|
+
function _interopNamespace(e) {
|
|
16
|
+
if (e && e.__esModule) return e;
|
|
17
|
+
var n = Object.create(null);
|
|
18
|
+
if (e) {
|
|
19
|
+
Object.keys(e).forEach(function (k) {
|
|
20
|
+
if (k !== 'default') {
|
|
21
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
22
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
23
|
+
enumerable: true,
|
|
24
|
+
get: function () { return e[k]; }
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
n["default"] = e;
|
|
30
|
+
return n;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
34
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
35
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
36
|
+
|
|
16
37
|
function _extends() {
|
|
17
38
|
_extends = Object.assign || function (target) {
|
|
18
39
|
for (var i = 1; i < arguments.length; i++) {
|
|
@@ -46,18 +67,20 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
46
67
|
return target;
|
|
47
68
|
}
|
|
48
69
|
|
|
70
|
+
var _excluded$f = ["children", "hideIcon", "variant", "className"];
|
|
71
|
+
|
|
49
72
|
var AlertIcon = function AlertIcon(_ref) {
|
|
50
73
|
var variant = _ref.variant;
|
|
51
74
|
var iconClass = "eds-feedback-text__icon eds-feedback-text__icon--" + variant;
|
|
52
75
|
|
|
53
76
|
switch (variant) {
|
|
54
77
|
case 'success':
|
|
55
|
-
return React__default.createElement(icons.ValidationCheckIcon, {
|
|
78
|
+
return React__default["default"].createElement(icons.ValidationCheckIcon, {
|
|
56
79
|
className: iconClass
|
|
57
80
|
});
|
|
58
81
|
|
|
59
82
|
case 'error':
|
|
60
|
-
return React__default.createElement(icons.ValidationErrorIcon, {
|
|
83
|
+
return React__default["default"].createElement(icons.ValidationErrorIcon, {
|
|
61
84
|
className: iconClass
|
|
62
85
|
});
|
|
63
86
|
|
|
@@ -65,7 +88,7 @@ var AlertIcon = function AlertIcon(_ref) {
|
|
|
65
88
|
return null;
|
|
66
89
|
|
|
67
90
|
case 'warning':
|
|
68
|
-
return React__default.createElement(icons.ValidationExclamationIcon, {
|
|
91
|
+
return React__default["default"].createElement(icons.ValidationExclamationIcon, {
|
|
69
92
|
className: iconClass
|
|
70
93
|
});
|
|
71
94
|
|
|
@@ -80,20 +103,20 @@ var FeedbackText = function FeedbackText(_ref2) {
|
|
|
80
103
|
hideIcon = _ref2$hideIcon === void 0 ? false : _ref2$hideIcon,
|
|
81
104
|
variant = _ref2.variant,
|
|
82
105
|
className = _ref2.className,
|
|
83
|
-
rest = _objectWithoutPropertiesLoose(_ref2,
|
|
106
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded$f);
|
|
84
107
|
|
|
85
|
-
return React__default.createElement(typography.SubLabel,
|
|
86
|
-
className:
|
|
108
|
+
return React__default["default"].createElement(typography.SubLabel, _extends({
|
|
109
|
+
className: classNames__default["default"]('eds-feedback-text', {
|
|
87
110
|
'eds-feedback-text--info': variant === 'info'
|
|
88
111
|
}, className)
|
|
89
|
-
}, rest), !hideIcon && React__default.createElement(AlertIcon, {
|
|
112
|
+
}, rest), !hideIcon && React__default["default"].createElement(AlertIcon, {
|
|
90
113
|
variant: variant
|
|
91
|
-
}), React__default.createElement("span", {
|
|
114
|
+
}), React__default["default"].createElement("span", {
|
|
92
115
|
className: "eds-feedback-text__text"
|
|
93
116
|
}, children));
|
|
94
117
|
};
|
|
95
118
|
|
|
96
|
-
var InputGroupContext = /*#__PURE__*/
|
|
119
|
+
var InputGroupContext = /*#__PURE__*/React__namespace.createContext({
|
|
97
120
|
isFilled: false,
|
|
98
121
|
setFilled: function setFilled() {
|
|
99
122
|
return null;
|
|
@@ -102,11 +125,11 @@ var InputGroupContext = /*#__PURE__*/React.createContext({
|
|
|
102
125
|
var InputGroupContextProvider = function InputGroupContextProvider(_ref) {
|
|
103
126
|
var children = _ref.children;
|
|
104
127
|
|
|
105
|
-
var _React$useState =
|
|
128
|
+
var _React$useState = React__namespace.useState(false),
|
|
106
129
|
filled = _React$useState[0],
|
|
107
130
|
setFilled = _React$useState[1];
|
|
108
131
|
|
|
109
|
-
return
|
|
132
|
+
return React__namespace.createElement(InputGroupContext.Provider, {
|
|
110
133
|
value: {
|
|
111
134
|
isFilled: filled,
|
|
112
135
|
setFilled: setFilled
|
|
@@ -114,48 +137,50 @@ var InputGroupContextProvider = function InputGroupContextProvider(_ref) {
|
|
|
114
137
|
}, children);
|
|
115
138
|
};
|
|
116
139
|
var useInputGroupContext = function useInputGroupContext() {
|
|
117
|
-
return
|
|
140
|
+
return React__namespace.useContext(InputGroupContext);
|
|
118
141
|
};
|
|
119
142
|
|
|
143
|
+
var _excluded$e = ["label", "required", "labelId", "staticAnimation"];
|
|
120
144
|
var InputGroupLabel = function InputGroupLabel(_ref) {
|
|
121
145
|
var label = _ref.label,
|
|
122
146
|
required = _ref.required,
|
|
123
147
|
labelId = _ref.labelId,
|
|
124
148
|
_ref$staticAnimation = _ref.staticAnimation,
|
|
125
149
|
staticAnimation = _ref$staticAnimation === void 0 ? false : _ref$staticAnimation,
|
|
126
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
150
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$e);
|
|
127
151
|
|
|
128
152
|
var _useInputGroupContext = useInputGroupContext(),
|
|
129
153
|
isFilled = _useInputGroupContext.isFilled;
|
|
130
154
|
|
|
131
155
|
var filler = staticAnimation || isFilled;
|
|
132
|
-
return React__default.createElement("label",
|
|
133
|
-
className:
|
|
156
|
+
return React__default["default"].createElement("label", _extends({
|
|
157
|
+
className: classNames__default["default"](rest.className, {
|
|
134
158
|
'eds-input-group-label-wrapper--filled': filler
|
|
135
159
|
}),
|
|
136
160
|
id: labelId
|
|
137
|
-
}, rest), React__default.createElement("span", {
|
|
138
|
-
className:
|
|
161
|
+
}, rest), React__default["default"].createElement("span", {
|
|
162
|
+
className: classNames__default["default"]('eds-input-group__label', {
|
|
139
163
|
'eds-input-group__label--filled': filler
|
|
140
164
|
})
|
|
141
|
-
}, label, " ", required && React__default.createElement("span", null, "*")));
|
|
165
|
+
}, label, " ", required && React__default["default"].createElement("span", null, "*")));
|
|
142
166
|
};
|
|
143
167
|
|
|
144
|
-
var VariantContext = /*#__PURE__*/React__default.createContext(null);
|
|
168
|
+
var VariantContext = /*#__PURE__*/React__default["default"].createContext(null);
|
|
145
169
|
var VariantProvider = function VariantProvider(_ref) {
|
|
146
170
|
var children = _ref.children,
|
|
147
171
|
_ref$variant = _ref.variant,
|
|
148
172
|
variant = _ref$variant === void 0 ? null : _ref$variant;
|
|
149
|
-
return React__default.createElement(VariantContext.Provider, {
|
|
173
|
+
return React__default["default"].createElement(VariantContext.Provider, {
|
|
150
174
|
value: variant
|
|
151
175
|
}, children);
|
|
152
176
|
};
|
|
153
177
|
var useVariant = function useVariant() {
|
|
154
|
-
var context = React__default.useContext(VariantContext);
|
|
178
|
+
var context = React__default["default"].useContext(VariantContext);
|
|
155
179
|
return context;
|
|
156
180
|
};
|
|
157
181
|
|
|
158
|
-
var
|
|
182
|
+
var _excluded$d = ["children", "className", "dark", "disabled", "readOnly", "variant", "prepend", "append", "size", "isFilled", "label", "required", "labelTooltip", "feedback", "labelId", "labelProps", "style", "disableLabelAnimation"];
|
|
183
|
+
var BaseFormControl = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
159
184
|
var children = _ref.children,
|
|
160
185
|
className = _ref.className,
|
|
161
186
|
_ref$dark = _ref.dark,
|
|
@@ -179,12 +204,12 @@ var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
179
204
|
style = _ref.style,
|
|
180
205
|
_ref$disableLabelAnim = _ref.disableLabelAnimation,
|
|
181
206
|
disableLabelAnimation = _ref$disableLabelAnim === void 0 ? false : _ref$disableLabelAnim,
|
|
182
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
207
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
|
|
183
208
|
|
|
184
209
|
var contextVariant = useVariant();
|
|
185
210
|
var currentVariant = variant || contextVariant;
|
|
186
|
-
return React__default.createElement(InputGroupContextProvider, null, React__default.createElement("div",
|
|
187
|
-
className:
|
|
211
|
+
return React__default["default"].createElement(InputGroupContextProvider, null, React__default["default"].createElement("div", _extends({
|
|
212
|
+
className: classNames__default["default"]('eds-form-control-wrapper', className, "eds-form-control-wrapper--size-" + size, {
|
|
188
213
|
'eds-form-control-wrapper--success': currentVariant === 'success',
|
|
189
214
|
'eds-form-control-wrapper--error': currentVariant === 'error',
|
|
190
215
|
'eds-form-control-wrapper--dark': dark,
|
|
@@ -194,28 +219,29 @@ var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
194
219
|
}),
|
|
195
220
|
ref: ref,
|
|
196
221
|
style: style
|
|
197
|
-
}, rest), prepend && React__default.createElement("div", {
|
|
222
|
+
}, rest), prepend && React__default["default"].createElement("div", {
|
|
198
223
|
className: "eds-form-control__prepend"
|
|
199
|
-
}, prepend), React__default.createElement(InputGroupLabel,
|
|
224
|
+
}, prepend), React__default["default"].createElement(InputGroupLabel, _extends({
|
|
200
225
|
label: label,
|
|
201
226
|
required: required,
|
|
202
227
|
labelId: labelId,
|
|
203
228
|
staticAnimation: disableLabelAnimation
|
|
204
|
-
}, labelProps)), children, append && React__default.createElement("div", {
|
|
229
|
+
}, labelProps)), children, append && React__default["default"].createElement("div", {
|
|
205
230
|
className: "eds-form-control__append"
|
|
206
|
-
}, append), labelTooltip && React__default.createElement("div", {
|
|
231
|
+
}, append), labelTooltip && React__default["default"].createElement("div", {
|
|
207
232
|
className: "eds-form-control__append eds-form-control__append--tooltip"
|
|
208
|
-
}, React__default.createElement(tooltip.Tooltip, {
|
|
233
|
+
}, React__default["default"].createElement(tooltip.Tooltip, {
|
|
209
234
|
content: labelTooltip,
|
|
210
235
|
placement: "right"
|
|
211
|
-
}, React__default.createElement("span", {
|
|
236
|
+
}, React__default["default"].createElement("span", {
|
|
212
237
|
className: "eds-input-group__label-tooltip-icon"
|
|
213
|
-
}, React__default.createElement(icons.QuestionIcon, null))))), feedback && currentVariant && React__default.createElement(FeedbackText, {
|
|
238
|
+
}, React__default["default"].createElement(icons.QuestionIcon, null))))), feedback && currentVariant && React__default["default"].createElement(FeedbackText, {
|
|
214
239
|
variant: currentVariant
|
|
215
240
|
}, feedback));
|
|
216
241
|
});
|
|
217
242
|
|
|
218
|
-
var
|
|
243
|
+
var _excluded$c = ["checked", "className", "children", "style", "disabled", "reduceClickArea"];
|
|
244
|
+
var Checkbox = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
219
245
|
var checked = _ref.checked,
|
|
220
246
|
className = _ref.className,
|
|
221
247
|
children = _ref.children,
|
|
@@ -223,41 +249,41 @@ var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
223
249
|
_ref$disabled = _ref.disabled,
|
|
224
250
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
225
251
|
reduceClickArea = _ref.reduceClickArea,
|
|
226
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
252
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$c);
|
|
227
253
|
|
|
228
254
|
// Trick to allow using a ref locally, while still allowing for ref forwarding
|
|
229
255
|
// Read more at https://reactjs.org/docs/hooks-reference.html#useimperativehandle
|
|
230
|
-
var innerRef = React__default.useRef(null); //eslint-disable-next-line
|
|
256
|
+
var innerRef = React__default["default"].useRef(null); //eslint-disable-next-line
|
|
231
257
|
|
|
232
|
-
React__default.useImperativeHandle(ref, function () {
|
|
258
|
+
React__default["default"].useImperativeHandle(ref, function () {
|
|
233
259
|
return innerRef.current;
|
|
234
260
|
});
|
|
235
261
|
var isIndeterminate = checked === 'indeterminate';
|
|
236
262
|
var isControlled = checked !== undefined;
|
|
237
|
-
React__default.useEffect(function () {
|
|
263
|
+
React__default["default"].useEffect(function () {
|
|
238
264
|
if (innerRef && innerRef.current) {
|
|
239
265
|
innerRef.current.indeterminate = isIndeterminate;
|
|
240
266
|
}
|
|
241
267
|
}, [isIndeterminate]);
|
|
242
|
-
return React__default.createElement("label", {
|
|
243
|
-
className:
|
|
268
|
+
return React__default["default"].createElement("label", {
|
|
269
|
+
className: classNames__default["default"]('eds-checkbox__container', className, {
|
|
244
270
|
'eds-checkbox--disabled': disabled,
|
|
245
271
|
'eds-checkbox__container--reduced-click-area': reduceClickArea
|
|
246
272
|
}),
|
|
247
273
|
style: style
|
|
248
|
-
}, React__default.createElement("input",
|
|
274
|
+
}, React__default["default"].createElement("input", _extends({
|
|
249
275
|
type: "checkbox",
|
|
250
276
|
ref: innerRef,
|
|
251
277
|
checked: isControlled ? checked === true : undefined,
|
|
252
278
|
disabled: disabled
|
|
253
|
-
}, rest)), React__default.createElement("span", {
|
|
254
|
-
className:
|
|
279
|
+
}, rest)), React__default["default"].createElement("span", {
|
|
280
|
+
className: classNames__default["default"]('eds-checkbox__icon', {
|
|
255
281
|
'eds-checkbox__icon--disabled': disabled,
|
|
256
282
|
'eds-checkbox__icon--reduced-click-area': reduceClickArea
|
|
257
283
|
})
|
|
258
|
-
}, React__default.createElement(CheckboxIcon, {
|
|
284
|
+
}, React__default["default"].createElement(CheckboxIcon, {
|
|
259
285
|
indeterminate: isIndeterminate
|
|
260
|
-
})), children && React__default.createElement(typography.Paragraph, {
|
|
286
|
+
})), children && React__default["default"].createElement(typography.Paragraph, {
|
|
261
287
|
className: "eds-checkbox__label",
|
|
262
288
|
margin: "none",
|
|
263
289
|
as: "span"
|
|
@@ -267,42 +293,43 @@ var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
267
293
|
var CheckboxIcon = function CheckboxIcon(_ref2) {
|
|
268
294
|
var _ref2$indeterminate = _ref2.indeterminate,
|
|
269
295
|
indeterminate = _ref2$indeterminate === void 0 ? false : _ref2$indeterminate;
|
|
270
|
-
return React__default.createElement("svg", {
|
|
296
|
+
return React__default["default"].createElement("svg", {
|
|
271
297
|
className: "eds-checkbox-icon",
|
|
272
298
|
width: "11px",
|
|
273
299
|
height: "9px",
|
|
274
300
|
viewBox: "6 11 37 33"
|
|
275
|
-
}, indeterminate ? React__default.createElement("rect", {
|
|
301
|
+
}, indeterminate ? React__default["default"].createElement("rect", {
|
|
276
302
|
x: "10",
|
|
277
303
|
y: "25",
|
|
278
304
|
width: "28",
|
|
279
305
|
height: "5",
|
|
280
306
|
fill: "white"
|
|
281
|
-
}) : React__default.createElement("path", {
|
|
307
|
+
}) : React__default["default"].createElement("path", {
|
|
282
308
|
className: "eds-checkbox-icon__path",
|
|
283
309
|
d: "M14.1 27.2l7.1 7.2 14.6-14.8",
|
|
284
310
|
fill: "none"
|
|
285
311
|
}));
|
|
286
312
|
};
|
|
287
313
|
|
|
314
|
+
var _excluded$b = ["children", "className", "label"];
|
|
288
315
|
var Fieldset = function Fieldset(_ref) {
|
|
289
316
|
var children = _ref.children,
|
|
290
317
|
className = _ref.className,
|
|
291
318
|
label = _ref.label,
|
|
292
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
319
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$b);
|
|
293
320
|
|
|
294
|
-
return React__default.createElement("fieldset",
|
|
295
|
-
className:
|
|
296
|
-
}, rest), label && React__default.createElement(typography.Label, {
|
|
321
|
+
return React__default["default"].createElement("fieldset", _extends({
|
|
322
|
+
className: classNames__default["default"]('eds-fieldset', className)
|
|
323
|
+
}, rest), label && React__default["default"].createElement(typography.Label, {
|
|
297
324
|
as: "legend",
|
|
298
325
|
className: "eds-legend"
|
|
299
326
|
}, label), children);
|
|
300
327
|
};
|
|
301
328
|
|
|
302
|
-
var RadioGroupContext = /*#__PURE__*/React__default.createContext(null);
|
|
329
|
+
var RadioGroupContext = /*#__PURE__*/React__default["default"].createContext(null);
|
|
303
330
|
var RadioGroupContextProvider = RadioGroupContext.Provider;
|
|
304
331
|
var useRadioGroupContext = function useRadioGroupContext() {
|
|
305
|
-
var context = React__default.useContext(RadioGroupContext);
|
|
332
|
+
var context = React__default["default"].useContext(RadioGroupContext);
|
|
306
333
|
|
|
307
334
|
if (!context) {
|
|
308
335
|
throw new Error('You need to wrap your RadioButtons in a RadioGroup component');
|
|
@@ -311,14 +338,15 @@ var useRadioGroupContext = function useRadioGroupContext() {
|
|
|
311
338
|
return context;
|
|
312
339
|
};
|
|
313
340
|
|
|
314
|
-
var
|
|
341
|
+
var _excluded$a = ["className", "children", "value", "disabled"];
|
|
342
|
+
var Radio = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
315
343
|
var className = _ref.className,
|
|
316
344
|
children = _ref.children,
|
|
317
345
|
value = _ref.value,
|
|
318
346
|
disabled = _ref.disabled,
|
|
319
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
347
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$a);
|
|
320
348
|
|
|
321
|
-
var classList =
|
|
349
|
+
var classList = classNames__default["default"](className, 'eds-form-component--radio__radio', {
|
|
322
350
|
'eds-form-component--radio__radio--disabled': disabled
|
|
323
351
|
});
|
|
324
352
|
|
|
@@ -327,9 +355,9 @@ var Radio = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
327
355
|
selectedValue = _useRadioGroupContext.value,
|
|
328
356
|
onChange = _useRadioGroupContext.onChange;
|
|
329
357
|
|
|
330
|
-
return React__default.createElement("label", {
|
|
358
|
+
return React__default["default"].createElement("label", {
|
|
331
359
|
className: "eds-form-component--radio__container"
|
|
332
|
-
}, React__default.createElement("input",
|
|
360
|
+
}, React__default["default"].createElement("input", _extends({
|
|
333
361
|
type: "radio",
|
|
334
362
|
name: name,
|
|
335
363
|
ref: ref,
|
|
@@ -337,40 +365,42 @@ var Radio = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
337
365
|
checked: selectedValue === value,
|
|
338
366
|
onChange: onChange,
|
|
339
367
|
disabled: disabled
|
|
340
|
-
}, rest)), React__default.createElement("span", {
|
|
368
|
+
}, rest)), React__default["default"].createElement("span", {
|
|
341
369
|
className: classList
|
|
342
|
-
}, React__default.createElement("span", {
|
|
370
|
+
}, React__default["default"].createElement("span", {
|
|
343
371
|
className: "eds-form-component--radio__circle"
|
|
344
|
-
})), children && React__default.createElement(typography.Paragraph, {
|
|
372
|
+
})), children && React__default["default"].createElement(typography.Paragraph, {
|
|
345
373
|
margin: "none",
|
|
346
374
|
as: "span",
|
|
347
375
|
className: "eds-form-component--radio__label"
|
|
348
376
|
}, children));
|
|
349
377
|
});
|
|
350
378
|
|
|
379
|
+
var _excluded$9 = ["name", "value", "children", "onChange", "label"];
|
|
351
380
|
var RadioGroup = function RadioGroup(_ref) {
|
|
352
381
|
var name = _ref.name,
|
|
353
382
|
value = _ref.value,
|
|
354
383
|
children = _ref.children,
|
|
355
384
|
onChange = _ref.onChange,
|
|
356
385
|
label = _ref.label,
|
|
357
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
386
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$9);
|
|
358
387
|
|
|
359
|
-
var contextValue = React__default.useMemo(function () {
|
|
388
|
+
var contextValue = React__default["default"].useMemo(function () {
|
|
360
389
|
return {
|
|
361
390
|
name: name,
|
|
362
391
|
value: value,
|
|
363
392
|
onChange: onChange
|
|
364
393
|
};
|
|
365
394
|
}, [name, value, onChange]);
|
|
366
|
-
return React__default.createElement(RadioGroupContextProvider, {
|
|
395
|
+
return React__default["default"].createElement(RadioGroupContextProvider, {
|
|
367
396
|
value: contextValue
|
|
368
|
-
}, label ? React__default.createElement(Fieldset,
|
|
397
|
+
}, label ? React__default["default"].createElement(Fieldset, _extends({
|
|
369
398
|
label: label
|
|
370
399
|
}, rest), children) : children);
|
|
371
400
|
};
|
|
372
401
|
|
|
373
|
-
var
|
|
402
|
+
var _excluded$8 = ["className", "children", "value", "title", "secondaryLabel", "size", "hideCheckbox", "style", "id", "disabled"];
|
|
403
|
+
var RadioPanel = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
374
404
|
var className = _ref.className,
|
|
375
405
|
children = _ref.children,
|
|
376
406
|
value = _ref.value,
|
|
@@ -384,9 +414,9 @@ var RadioPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
384
414
|
id = _ref.id,
|
|
385
415
|
_ref$disabled = _ref.disabled,
|
|
386
416
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
387
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
417
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
|
|
388
418
|
|
|
389
|
-
var classList =
|
|
419
|
+
var classList = classNames__default["default"](className, 'eds-radio-panel__container', "eds-radio-panel--" + size, {
|
|
390
420
|
'eds-radio-panel--disabled': disabled
|
|
391
421
|
});
|
|
392
422
|
|
|
@@ -397,10 +427,10 @@ var RadioPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
397
427
|
|
|
398
428
|
var randomId = utils.useRandomId('eds-radiopanel');
|
|
399
429
|
var radioPanelId = id || randomId;
|
|
400
|
-
return React__default.createElement("label", {
|
|
430
|
+
return React__default["default"].createElement("label", {
|
|
401
431
|
className: "eds-radio-panel__wrapper",
|
|
402
432
|
htmlFor: radioPanelId
|
|
403
|
-
}, React__default.createElement("input",
|
|
433
|
+
}, React__default["default"].createElement("input", _extends({
|
|
404
434
|
type: "radio",
|
|
405
435
|
name: name,
|
|
406
436
|
ref: ref,
|
|
@@ -409,68 +439,78 @@ var RadioPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
409
439
|
onChange: onChange,
|
|
410
440
|
id: radioPanelId,
|
|
411
441
|
disabled: disabled
|
|
412
|
-
}, rest)), React__default.createElement("div", {
|
|
442
|
+
}, rest)), React__default["default"].createElement("div", {
|
|
413
443
|
className: classList,
|
|
414
444
|
style: style
|
|
415
|
-
}, React__default.createElement("div", {
|
|
445
|
+
}, React__default["default"].createElement("div", {
|
|
416
446
|
className: "eds-radio-panel__title-wrapper"
|
|
417
|
-
}, React__default.createElement("div", {
|
|
447
|
+
}, React__default["default"].createElement("div", {
|
|
418
448
|
className: "eds-radio-panel__title"
|
|
419
|
-
}, title), React__default.createElement("div", {
|
|
449
|
+
}, title), React__default["default"].createElement("div", {
|
|
420
450
|
className: "eds-radio-panel__label"
|
|
421
|
-
}, secondaryLabel && React__default.createElement("span", null, secondaryLabel), !(disabled || hideCheckbox) && React__default.createElement("span", {
|
|
451
|
+
}, secondaryLabel && React__default["default"].createElement("span", null, secondaryLabel), !(disabled || hideCheckbox) && React__default["default"].createElement("span", {
|
|
422
452
|
className: "eds-radio-panel__check"
|
|
423
|
-
}, React__default.createElement(RadioPanelCheck, null)))), children && React__default.createElement("div", {
|
|
453
|
+
}, React__default["default"].createElement(RadioPanelCheck, null)))), children && React__default["default"].createElement("div", {
|
|
424
454
|
className: "eds-radio-panel__additional-content"
|
|
425
455
|
}, children)));
|
|
426
456
|
});
|
|
427
457
|
|
|
428
458
|
var RadioPanelCheck = function RadioPanelCheck() {
|
|
429
|
-
return React__default.createElement("svg", {
|
|
459
|
+
return React__default["default"].createElement("svg", {
|
|
430
460
|
className: "eds-checkbox-icon",
|
|
431
461
|
width: "22px",
|
|
432
462
|
height: "16px",
|
|
433
463
|
viewBox: "6 11 37 33"
|
|
434
|
-
}, React__default.createElement("path", {
|
|
464
|
+
}, React__default["default"].createElement("path", {
|
|
435
465
|
className: "eds-checkbox-icon__path",
|
|
436
466
|
d: "M14.1 27.2l7.1 7.2 14.6-14.8",
|
|
437
467
|
fill: "none"
|
|
438
468
|
}));
|
|
439
469
|
};
|
|
440
470
|
|
|
441
|
-
var
|
|
471
|
+
var _excluded$7 = ["className", "children", "labelPlacement", "icon", "hideIcon", "color", "contrastColor", "size"];
|
|
472
|
+
var Switch = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
442
473
|
var className = _ref.className,
|
|
443
474
|
children = _ref.children,
|
|
444
475
|
_ref$labelPlacement = _ref.labelPlacement,
|
|
445
476
|
labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
|
|
446
477
|
icon = _ref.icon,
|
|
478
|
+
_ref$hideIcon = _ref.hideIcon,
|
|
479
|
+
hideIcon = _ref$hideIcon === void 0 ? false : _ref$hideIcon,
|
|
447
480
|
_ref$color = _ref.color,
|
|
448
481
|
color = _ref$color === void 0 ? tokens.colors.validation.mintContrast : _ref$color,
|
|
449
482
|
contrastColor = _ref.contrastColor,
|
|
450
483
|
_ref$size = _ref.size,
|
|
451
484
|
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
452
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
485
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$7);
|
|
453
486
|
|
|
454
487
|
var chosenContrastColor = contrastColor && contrastColor || color;
|
|
455
|
-
|
|
456
|
-
|
|
488
|
+
|
|
489
|
+
var displayedIcon = function displayedIcon() {
|
|
490
|
+
if (icon) return icon;
|
|
491
|
+
return rest.checked ? React__default["default"].createElement(icons.CheckIcon, null) : React__default["default"].createElement(icons.CloseSmallIcon, null);
|
|
492
|
+
};
|
|
493
|
+
|
|
494
|
+
return React__default["default"].createElement("label", {
|
|
495
|
+
className: classNames__default["default"]('eds-switch', "eds-switch--" + labelPlacement, className),
|
|
457
496
|
style: _extends({}, rest.style)
|
|
458
|
-
}, React__default.createElement("input",
|
|
497
|
+
}, React__default["default"].createElement("input", _extends({
|
|
459
498
|
type: "checkbox",
|
|
460
499
|
ref: ref
|
|
461
|
-
}, rest)), React__default.createElement("span", {
|
|
462
|
-
className:
|
|
500
|
+
}, rest)), React__default["default"].createElement("span", {
|
|
501
|
+
className: classNames__default["default"]('eds-switch__switch', "eds-switch__switch--" + size),
|
|
463
502
|
style: {
|
|
464
503
|
'--eds-switch-color': color,
|
|
465
504
|
'--eds-switch-contrast-color': chosenContrastColor
|
|
466
505
|
}
|
|
467
|
-
}, React__default.createElement("span", {
|
|
506
|
+
}, React__default["default"].createElement("span", {
|
|
468
507
|
className: "eds-switch__circle"
|
|
469
|
-
},
|
|
470
|
-
className:
|
|
508
|
+
}, !hideIcon && displayedIcon())), children && React__default["default"].createElement("span", {
|
|
509
|
+
className: classNames__default["default"]('eds-switch__label', "eds-switch__label--" + size + "--" + labelPlacement)
|
|
471
510
|
}, children));
|
|
472
511
|
});
|
|
473
512
|
|
|
513
|
+
var _excluded$6 = ["className", "children", "labelPlacement", "transport", "size"];
|
|
474
514
|
var TravelSwitch = function TravelSwitch(_ref) {
|
|
475
515
|
var className = _ref.className,
|
|
476
516
|
children = _ref.children,
|
|
@@ -478,19 +518,19 @@ var TravelSwitch = function TravelSwitch(_ref) {
|
|
|
478
518
|
labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
|
|
479
519
|
transport = _ref.transport,
|
|
480
520
|
size = _ref.size,
|
|
481
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
521
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
482
522
|
|
|
483
523
|
var _modeCalc = modeCalc(transport),
|
|
484
524
|
color = _modeCalc.color,
|
|
485
525
|
contrast = _modeCalc.contrast,
|
|
486
526
|
Icon = _modeCalc.Icon;
|
|
487
527
|
|
|
488
|
-
return React__default.createElement(Switch,
|
|
528
|
+
return React__default["default"].createElement(Switch, _extends({
|
|
489
529
|
className: className,
|
|
490
530
|
labelPlacement: labelPlacement,
|
|
491
531
|
color: color,
|
|
492
532
|
contrastColor: contrast,
|
|
493
|
-
icon: React__default.createElement(Icon, null),
|
|
533
|
+
icon: React__default["default"].createElement(Icon, null),
|
|
494
534
|
size: size
|
|
495
535
|
}, rest), children);
|
|
496
536
|
};
|
|
@@ -590,7 +630,9 @@ function isFilled(obj, SSR) {
|
|
|
590
630
|
return obj && (hasValue(obj.value) && obj.value !== '' || SSR && hasValue(obj.defaultValue) && obj.defaultValue !== '');
|
|
591
631
|
}
|
|
592
632
|
|
|
593
|
-
var
|
|
633
|
+
var _excluded$5 = ["variant", "disabled", "readOnly", "className", "style", "label", "feedback", "labelTooltip", "onChange", "disableLabelAnimation"],
|
|
634
|
+
_excluded2$1 = ["readOnly", "disabled", "onChange", "value"];
|
|
635
|
+
var TextArea = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
594
636
|
var variant = _ref.variant,
|
|
595
637
|
_ref$disabled = _ref.disabled,
|
|
596
638
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
@@ -603,10 +645,10 @@ var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
603
645
|
labelTooltip = _ref.labelTooltip,
|
|
604
646
|
onChange = _ref.onChange,
|
|
605
647
|
disableLabelAnimation = _ref.disableLabelAnimation,
|
|
606
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
648
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
607
649
|
|
|
608
650
|
var textAreaId = utils.useRandomId('eds-textarea');
|
|
609
|
-
return React__default.createElement(BaseFormControl, {
|
|
651
|
+
return React__default["default"].createElement(BaseFormControl, {
|
|
610
652
|
className: className,
|
|
611
653
|
disabled: disabled,
|
|
612
654
|
readOnly: readOnly,
|
|
@@ -620,7 +662,7 @@ var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
620
662
|
className: 'eds-textarea__label'
|
|
621
663
|
},
|
|
622
664
|
disableLabelAnimation: disableLabelAnimation
|
|
623
|
-
}, React__default.createElement(TextAreaBase,
|
|
665
|
+
}, React__default["default"].createElement(TextAreaBase, _extends({
|
|
624
666
|
readOnly: readOnly,
|
|
625
667
|
disabled: disabled,
|
|
626
668
|
ref: ref,
|
|
@@ -628,12 +670,12 @@ var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
628
670
|
onChange: onChange
|
|
629
671
|
}, rest)));
|
|
630
672
|
});
|
|
631
|
-
var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
|
|
673
|
+
var TextAreaBase = /*#__PURE__*/React__default["default"].forwardRef(function (_ref2, ref) {
|
|
632
674
|
var readOnly = _ref2.readOnly,
|
|
633
675
|
disabled = _ref2.disabled,
|
|
634
676
|
onChange = _ref2.onChange,
|
|
635
677
|
value = _ref2.value,
|
|
636
|
-
rest = _objectWithoutPropertiesLoose(_ref2,
|
|
678
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
|
|
637
679
|
|
|
638
680
|
var _useInputGroupContext = useInputGroupContext(),
|
|
639
681
|
isInputFilled = _useInputGroupContext.isFilled,
|
|
@@ -644,7 +686,7 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
|
|
|
644
686
|
setFiller && !isInputFilled && setFiller(true);
|
|
645
687
|
}
|
|
646
688
|
});
|
|
647
|
-
React__default.useEffect(function () {
|
|
689
|
+
React__default["default"].useEffect(function () {
|
|
648
690
|
if (value && setFiller && !isInputFilled) {
|
|
649
691
|
setFiller(true);
|
|
650
692
|
}
|
|
@@ -662,7 +704,7 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
|
|
|
662
704
|
}
|
|
663
705
|
};
|
|
664
706
|
|
|
665
|
-
return React__default.createElement("textarea",
|
|
707
|
+
return React__default["default"].createElement("textarea", _extends({
|
|
666
708
|
className: "eds-form-control eds-textarea",
|
|
667
709
|
ref: ref,
|
|
668
710
|
readOnly: readOnly,
|
|
@@ -672,7 +714,10 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
|
|
|
672
714
|
}, rest));
|
|
673
715
|
});
|
|
674
716
|
|
|
675
|
-
var
|
|
717
|
+
var _excluded$4 = ["prepend", "append", "variant", "disabled", "readOnly", "className", "style", "size", "label", "required", "labelTooltip", "feedback", "onChange", "disableLabelAnimation", "labelProps", "clearable", "onClear", "value"],
|
|
718
|
+
_excluded2 = ["disabled", "readOnly", "placeholder", "onChange", "value", "variant"],
|
|
719
|
+
_excluded3 = ["onClear"];
|
|
720
|
+
var TextField = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
676
721
|
var prepend = _ref.prepend,
|
|
677
722
|
append = _ref.append,
|
|
678
723
|
variant = _ref.variant,
|
|
@@ -695,15 +740,15 @@ var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
695
740
|
clearable = _ref$clearable === void 0 ? false : _ref$clearable,
|
|
696
741
|
onClear = _ref.onClear,
|
|
697
742
|
value = _ref.value,
|
|
698
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
743
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
699
744
|
|
|
700
745
|
var textFieldId = labelProps && labelProps.id ? labelProps.id : utils.useRandomId('eds-textfield');
|
|
701
|
-
return React__default.createElement(BaseFormControl, {
|
|
746
|
+
return React__default["default"].createElement(BaseFormControl, {
|
|
702
747
|
disabled: disabled,
|
|
703
748
|
readOnly: readOnly,
|
|
704
749
|
variant: variant,
|
|
705
750
|
prepend: prepend,
|
|
706
|
-
append: clearable && onClear ? React__default.createElement(ClearButton, {
|
|
751
|
+
append: clearable && onClear ? React__default["default"].createElement(ClearButton, {
|
|
707
752
|
onClear: onClear
|
|
708
753
|
}) : append,
|
|
709
754
|
className: className,
|
|
@@ -716,7 +761,7 @@ var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
716
761
|
feedback: feedback,
|
|
717
762
|
disableLabelAnimation: disableLabelAnimation,
|
|
718
763
|
labelProps: labelProps
|
|
719
|
-
}, React__default.createElement(TextFieldBase,
|
|
764
|
+
}, React__default["default"].createElement(TextFieldBase, _extends({
|
|
720
765
|
disabled: disabled,
|
|
721
766
|
readOnly: readOnly,
|
|
722
767
|
ref: ref,
|
|
@@ -725,14 +770,14 @@ var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
725
770
|
value: value
|
|
726
771
|
}, rest)));
|
|
727
772
|
});
|
|
728
|
-
var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forwardRef) {
|
|
773
|
+
var TextFieldBase = /*#__PURE__*/React__default["default"].forwardRef(function (_ref2, forwardRef) {
|
|
729
774
|
var disabled = _ref2.disabled,
|
|
730
775
|
readOnly = _ref2.readOnly,
|
|
731
776
|
placeholder = _ref2.placeholder,
|
|
732
777
|
onChange = _ref2.onChange,
|
|
733
778
|
value = _ref2.value,
|
|
734
779
|
variant = _ref2.variant,
|
|
735
|
-
rest = _objectWithoutPropertiesLoose(_ref2,
|
|
780
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded2);
|
|
736
781
|
|
|
737
782
|
var contextVariant = useVariant();
|
|
738
783
|
var currentVariant = variant || contextVariant;
|
|
@@ -746,7 +791,7 @@ var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forw
|
|
|
746
791
|
setFiller && !isInputFilled && setFiller(true);
|
|
747
792
|
}
|
|
748
793
|
});
|
|
749
|
-
React__default.useEffect(function () {
|
|
794
|
+
React__default["default"].useEffect(function () {
|
|
750
795
|
if (value && setFiller && !isInputFilled) {
|
|
751
796
|
setFiller(true);
|
|
752
797
|
}
|
|
@@ -764,7 +809,7 @@ var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forw
|
|
|
764
809
|
}
|
|
765
810
|
};
|
|
766
811
|
|
|
767
|
-
return React__default.createElement("input",
|
|
812
|
+
return React__default["default"].createElement("input", _extends({
|
|
768
813
|
"aria-invalid": currentVariant === 'error',
|
|
769
814
|
className: "eds-form-control",
|
|
770
815
|
disabled: disabled,
|
|
@@ -778,17 +823,17 @@ var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forw
|
|
|
778
823
|
|
|
779
824
|
var ClearButton = function ClearButton(_ref3) {
|
|
780
825
|
var onClear = _ref3.onClear,
|
|
781
|
-
props = _objectWithoutPropertiesLoose(_ref3,
|
|
826
|
+
props = _objectWithoutPropertiesLoose(_ref3, _excluded3);
|
|
782
827
|
|
|
783
828
|
var _useInputGroupContext2 = useInputGroupContext(),
|
|
784
829
|
hasValue = _useInputGroupContext2.isFilled,
|
|
785
830
|
setFilled = _useInputGroupContext2.setFilled;
|
|
786
831
|
|
|
787
|
-
return React__default.createElement("div", {
|
|
832
|
+
return React__default["default"].createElement("div", {
|
|
788
833
|
className: "eds-textfield__clear-button-wrapper"
|
|
789
|
-
}, hasValue && React__default.createElement("div", {
|
|
834
|
+
}, hasValue && React__default["default"].createElement("div", {
|
|
790
835
|
className: "eds-textfield__divider"
|
|
791
|
-
}), hasValue && React__default.createElement("button",
|
|
836
|
+
}), hasValue && React__default["default"].createElement("button", _extends({
|
|
792
837
|
className: "eds-textfield__clear-button",
|
|
793
838
|
type: "button",
|
|
794
839
|
tabIndex: -1,
|
|
@@ -796,10 +841,11 @@ var ClearButton = function ClearButton(_ref3) {
|
|
|
796
841
|
setFilled(false);
|
|
797
842
|
onClear();
|
|
798
843
|
}
|
|
799
|
-
}, props), React__default.createElement(icons.CloseSmallIcon, null)));
|
|
844
|
+
}, props), React__default["default"].createElement(icons.CloseSmallIcon, null)));
|
|
800
845
|
};
|
|
801
846
|
|
|
802
|
-
var
|
|
847
|
+
var _excluded$3 = ["name", "onChange", "selectedValue", "multiple", "size"];
|
|
848
|
+
var SegmentedContext = /*#__PURE__*/React__default["default"].createContext(null);
|
|
803
849
|
var SegmentedProvider = function SegmentedProvider(_ref) {
|
|
804
850
|
var name = _ref.name,
|
|
805
851
|
_ref$onChange = _ref.onChange,
|
|
@@ -807,10 +853,10 @@ var SegmentedProvider = function SegmentedProvider(_ref) {
|
|
|
807
853
|
selectedValue = _ref.selectedValue,
|
|
808
854
|
multiple = _ref.multiple,
|
|
809
855
|
size = _ref.size,
|
|
810
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
856
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
811
857
|
|
|
812
858
|
var generatedName = utils.useRandomId('eds-segmented-control');
|
|
813
|
-
var contextValue = React__default.useMemo(function () {
|
|
859
|
+
var contextValue = React__default["default"].useMemo(function () {
|
|
814
860
|
return {
|
|
815
861
|
name: name || generatedName,
|
|
816
862
|
onChange: onChange,
|
|
@@ -819,12 +865,12 @@ var SegmentedProvider = function SegmentedProvider(_ref) {
|
|
|
819
865
|
size: size
|
|
820
866
|
};
|
|
821
867
|
}, [generatedName, multiple, name, onChange, selectedValue, size]);
|
|
822
|
-
return React__default.createElement(SegmentedContext.Provider,
|
|
868
|
+
return React__default["default"].createElement(SegmentedContext.Provider, _extends({
|
|
823
869
|
value: contextValue
|
|
824
870
|
}, rest));
|
|
825
871
|
};
|
|
826
872
|
var useSegmentedContext = function useSegmentedContext() {
|
|
827
|
-
var context = React__default.useContext(SegmentedContext);
|
|
873
|
+
var context = React__default["default"].useContext(SegmentedContext);
|
|
828
874
|
|
|
829
875
|
if (!context) {
|
|
830
876
|
throw new Error('You need to wrap your SegmentedChoice in either SegmentedControl or MultipleSegmentedControl');
|
|
@@ -833,7 +879,8 @@ var useSegmentedContext = function useSegmentedContext() {
|
|
|
833
879
|
return context;
|
|
834
880
|
};
|
|
835
881
|
|
|
836
|
-
var
|
|
882
|
+
var _excluded$2 = ["children", "className", "style", "value", "name", "onChange"];
|
|
883
|
+
var SegmentedChoice = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
837
884
|
var children = _ref.children,
|
|
838
885
|
className = _ref.className,
|
|
839
886
|
style = _ref.style,
|
|
@@ -841,7 +888,7 @@ var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
841
888
|
name = _ref.name,
|
|
842
889
|
_ref$onChange = _ref.onChange,
|
|
843
890
|
onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
|
|
844
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
891
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
845
892
|
|
|
846
893
|
var _useSegmentedContext = useSegmentedContext(),
|
|
847
894
|
commonName = _useSegmentedContext.name,
|
|
@@ -864,25 +911,26 @@ var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
864
911
|
}
|
|
865
912
|
};
|
|
866
913
|
|
|
867
|
-
return React__default.createElement("label", {
|
|
868
|
-
className:
|
|
914
|
+
return React__default["default"].createElement("label", {
|
|
915
|
+
className: classNames__default["default"]('eds-segmented-choice', className, {
|
|
869
916
|
'eds-segmented-choide--large': size === 'large'
|
|
870
917
|
}),
|
|
871
918
|
style: style
|
|
872
|
-
}, React__default.createElement("input",
|
|
919
|
+
}, React__default["default"].createElement("input", _extends({
|
|
873
920
|
type: multiple ? 'checkbox' : 'radio',
|
|
874
921
|
name: name || commonName,
|
|
875
922
|
checked: isChecked,
|
|
876
923
|
value: value,
|
|
877
924
|
onChange: handleChange,
|
|
878
925
|
ref: ref
|
|
879
|
-
}, rest)), React__default.createElement("div", {
|
|
880
|
-
className:
|
|
926
|
+
}, rest)), React__default["default"].createElement("div", {
|
|
927
|
+
className: classNames__default["default"]('eds-base-segmented', {
|
|
881
928
|
'eds-base-segmented--large': size === 'large'
|
|
882
929
|
})
|
|
883
930
|
}, children));
|
|
884
931
|
});
|
|
885
932
|
|
|
933
|
+
var _excluded$1 = ["children", "label", "name", "onChange", "selectedValue", "size", "className"];
|
|
886
934
|
var SegmentedControl = function SegmentedControl(_ref) {
|
|
887
935
|
var children = _ref.children,
|
|
888
936
|
label = _ref.label,
|
|
@@ -892,21 +940,22 @@ var SegmentedControl = function SegmentedControl(_ref) {
|
|
|
892
940
|
_ref$size = _ref.size,
|
|
893
941
|
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
894
942
|
className = _ref.className,
|
|
895
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
943
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
896
944
|
|
|
897
|
-
return React__default.createElement(SegmentedProvider, {
|
|
945
|
+
return React__default["default"].createElement(SegmentedProvider, {
|
|
898
946
|
name: name,
|
|
899
947
|
selectedValue: selectedValue,
|
|
900
948
|
onChange: onChange,
|
|
901
949
|
multiple: false,
|
|
902
950
|
size: size
|
|
903
|
-
}, React__default.createElement(typography.Label, {
|
|
951
|
+
}, React__default["default"].createElement(typography.Label, {
|
|
904
952
|
as: "div"
|
|
905
|
-
}, label), React__default.createElement("div",
|
|
906
|
-
className:
|
|
953
|
+
}, label), React__default["default"].createElement("div", _extends({
|
|
954
|
+
className: classNames__default["default"]('eds-segmented-control', className)
|
|
907
955
|
}, rest), children));
|
|
908
956
|
};
|
|
909
957
|
|
|
958
|
+
var _excluded = ["children", "label", "name", "onChange", "selectedValue"];
|
|
910
959
|
/**This component is not used by anyone, and is therefore deprecated
|
|
911
960
|
* @deprecated
|
|
912
961
|
*/
|
|
@@ -917,17 +966,17 @@ var MultipleSegmentedControl = function MultipleSegmentedControl(_ref) {
|
|
|
917
966
|
name = _ref.name,
|
|
918
967
|
onChange = _ref.onChange,
|
|
919
968
|
selectedValue = _ref.selectedValue,
|
|
920
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
969
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
921
970
|
|
|
922
|
-
return React__default.createElement(SegmentedProvider, {
|
|
971
|
+
return React__default["default"].createElement(SegmentedProvider, {
|
|
923
972
|
name: name,
|
|
924
973
|
selectedValue: selectedValue,
|
|
925
974
|
onChange: onChange,
|
|
926
975
|
multiple: true,
|
|
927
976
|
size: "medium"
|
|
928
|
-
}, React__default.createElement(typography.Label, {
|
|
977
|
+
}, React__default["default"].createElement(typography.Label, {
|
|
929
978
|
as: "div"
|
|
930
|
-
}, label), React__default.createElement("div",
|
|
979
|
+
}, label), React__default["default"].createElement("div", _extends({
|
|
931
980
|
className: "eds-segmented-control"
|
|
932
981
|
}, rest), children));
|
|
933
982
|
};
|