@entur/form 5.4.10 → 5.4.11
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/dist/form.cjs.development.js +196 -274
- package/dist/form.cjs.development.js.map +1 -1
- package/dist/form.cjs.production.min.js.map +1 -1
- package/dist/form.esm.js +196 -274
- package/dist/form.esm.js.map +1 -1
- package/dist/styles.css +174 -207
- package/package.json +18 -11
- package/CHANGELOG.md +0 -816
package/dist/form.esm.js
CHANGED
|
@@ -11,73 +11,59 @@ function _extends() {
|
|
|
11
11
|
_extends = Object.assign || function (target) {
|
|
12
12
|
for (var i = 1; i < arguments.length; i++) {
|
|
13
13
|
var source = arguments[i];
|
|
14
|
-
|
|
15
14
|
for (var key in source) {
|
|
16
15
|
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
17
16
|
target[key] = source[key];
|
|
18
17
|
}
|
|
19
18
|
}
|
|
20
19
|
}
|
|
21
|
-
|
|
22
20
|
return target;
|
|
23
21
|
};
|
|
24
|
-
|
|
25
22
|
return _extends.apply(this, arguments);
|
|
26
23
|
}
|
|
27
|
-
|
|
28
24
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
29
25
|
if (source == null) return {};
|
|
30
26
|
var target = {};
|
|
31
27
|
var sourceKeys = Object.keys(source);
|
|
32
28
|
var key, i;
|
|
33
|
-
|
|
34
29
|
for (i = 0; i < sourceKeys.length; i++) {
|
|
35
30
|
key = sourceKeys[i];
|
|
36
31
|
if (excluded.indexOf(key) >= 0) continue;
|
|
37
32
|
target[key] = source[key];
|
|
38
33
|
}
|
|
39
|
-
|
|
40
34
|
return target;
|
|
41
35
|
}
|
|
42
36
|
|
|
43
37
|
var _excluded$f = ["children", "hideIcon", "variant", "className"];
|
|
44
|
-
|
|
45
38
|
var AlertIcon = function AlertIcon(_ref) {
|
|
46
39
|
var variant = _ref.variant;
|
|
47
40
|
var iconClass = "eds-feedback-text__icon eds-feedback-text__icon--" + variant;
|
|
48
|
-
|
|
49
41
|
switch (variant) {
|
|
50
42
|
case 'success':
|
|
51
43
|
return React__default.createElement(ValidationCheckIcon, {
|
|
52
44
|
className: iconClass
|
|
53
45
|
});
|
|
54
|
-
|
|
55
46
|
case 'error':
|
|
56
47
|
return React__default.createElement(ValidationErrorIcon, {
|
|
57
48
|
className: iconClass
|
|
58
49
|
});
|
|
59
|
-
|
|
60
50
|
case 'info':
|
|
61
51
|
return null;
|
|
62
|
-
|
|
63
52
|
case 'warning':
|
|
64
53
|
return React__default.createElement(ValidationExclamationIcon, {
|
|
65
54
|
className: iconClass
|
|
66
55
|
});
|
|
67
|
-
|
|
68
56
|
default:
|
|
69
57
|
return null;
|
|
70
58
|
}
|
|
71
59
|
};
|
|
72
|
-
|
|
73
60
|
var FeedbackText = function FeedbackText(_ref2) {
|
|
74
61
|
var children = _ref2.children,
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
62
|
+
_ref2$hideIcon = _ref2.hideIcon,
|
|
63
|
+
hideIcon = _ref2$hideIcon === void 0 ? false : _ref2$hideIcon,
|
|
64
|
+
variant = _ref2.variant,
|
|
65
|
+
className = _ref2.className,
|
|
66
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded$f);
|
|
81
67
|
return React__default.createElement(SubLabel, _extends({
|
|
82
68
|
className: classNames('eds-feedback-text', {
|
|
83
69
|
'eds-feedback-text--info': variant === 'info'
|
|
@@ -97,11 +83,9 @@ var InputGroupContext = /*#__PURE__*/React.createContext({
|
|
|
97
83
|
});
|
|
98
84
|
var InputGroupContextProvider = function InputGroupContextProvider(_ref) {
|
|
99
85
|
var children = _ref.children;
|
|
100
|
-
|
|
101
86
|
var _React$useState = React.useState(false),
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
87
|
+
filled = _React$useState[0],
|
|
88
|
+
setFilled = _React$useState[1];
|
|
105
89
|
return React.createElement(InputGroupContext.Provider, {
|
|
106
90
|
value: {
|
|
107
91
|
isFilled: filled,
|
|
@@ -116,15 +100,13 @@ var useInputGroupContext = function useInputGroupContext() {
|
|
|
116
100
|
var _excluded$e = ["label", "required", "labelId", "staticAnimation"];
|
|
117
101
|
var InputGroupLabel = function InputGroupLabel(_ref) {
|
|
118
102
|
var label = _ref.label,
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
103
|
+
required = _ref.required,
|
|
104
|
+
labelId = _ref.labelId,
|
|
105
|
+
_ref$staticAnimation = _ref.staticAnimation,
|
|
106
|
+
staticAnimation = _ref$staticAnimation === void 0 ? false : _ref$staticAnimation,
|
|
107
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$e);
|
|
125
108
|
var _useInputGroupContext = useInputGroupContext(),
|
|
126
|
-
|
|
127
|
-
|
|
109
|
+
isFilled = _useInputGroupContext.isFilled;
|
|
128
110
|
var filler = staticAnimation || isFilled;
|
|
129
111
|
return React__default.createElement("label", _extends({
|
|
130
112
|
className: classNames(rest.className, {
|
|
@@ -141,8 +123,8 @@ var InputGroupLabel = function InputGroupLabel(_ref) {
|
|
|
141
123
|
var VariantContext = /*#__PURE__*/React__default.createContext(null);
|
|
142
124
|
var VariantProvider = function VariantProvider(_ref) {
|
|
143
125
|
var children = _ref.children,
|
|
144
|
-
|
|
145
|
-
|
|
126
|
+
_ref$variant = _ref.variant,
|
|
127
|
+
variant = _ref$variant === void 0 ? null : _ref$variant;
|
|
146
128
|
return React__default.createElement(VariantContext.Provider, {
|
|
147
129
|
value: variant
|
|
148
130
|
}, children);
|
|
@@ -155,32 +137,31 @@ var useVariant = function useVariant() {
|
|
|
155
137
|
var _excluded$d = ["children", "className", "dark", "disabled", "readOnly", "variant", "prepend", "append", "size", "isFilled", "label", "required", "labelTooltip", "feedback", "labelId", "labelProps", "style", "disableLabelAnimation", "ariaAlertOnFeedback"];
|
|
156
138
|
var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
157
139
|
var children = _ref.children,
|
|
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
|
-
|
|
140
|
+
className = _ref.className,
|
|
141
|
+
_ref$dark = _ref.dark,
|
|
142
|
+
dark = _ref$dark === void 0 ? false : _ref$dark,
|
|
143
|
+
_ref$disabled = _ref.disabled,
|
|
144
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
145
|
+
_ref$readOnly = _ref.readOnly,
|
|
146
|
+
readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
|
|
147
|
+
variant = _ref.variant,
|
|
148
|
+
prepend = _ref.prepend,
|
|
149
|
+
append = _ref.append,
|
|
150
|
+
_ref$size = _ref.size,
|
|
151
|
+
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
152
|
+
isFilled = _ref.isFilled,
|
|
153
|
+
label = _ref.label,
|
|
154
|
+
required = _ref.required,
|
|
155
|
+
labelTooltip = _ref.labelTooltip,
|
|
156
|
+
feedback = _ref.feedback,
|
|
157
|
+
labelId = _ref.labelId,
|
|
158
|
+
labelProps = _ref.labelProps,
|
|
159
|
+
style = _ref.style,
|
|
160
|
+
_ref$disableLabelAnim = _ref.disableLabelAnimation,
|
|
161
|
+
disableLabelAnimation = _ref$disableLabelAnim === void 0 ? false : _ref$disableLabelAnim,
|
|
162
|
+
_ref$ariaAlertOnFeedb = _ref.ariaAlertOnFeedback,
|
|
163
|
+
ariaAlertOnFeedback = _ref$ariaAlertOnFeedb === void 0 ? false : _ref$ariaAlertOnFeedb,
|
|
164
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
|
|
184
165
|
var contextVariant = useVariant();
|
|
185
166
|
var currentVariant = variant || contextVariant;
|
|
186
167
|
return React__default.createElement(InputGroupContextProvider, null, React__default.createElement("div", _extends({
|
|
@@ -219,18 +200,17 @@ var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
219
200
|
var _excluded$c = ["checked", "className", "children", "style", "disabled", "reduceClickArea"];
|
|
220
201
|
var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
221
202
|
var checked = _ref.checked,
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
203
|
+
className = _ref.className,
|
|
204
|
+
children = _ref.children,
|
|
205
|
+
style = _ref.style,
|
|
206
|
+
_ref$disabled = _ref.disabled,
|
|
207
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
208
|
+
reduceClickArea = _ref.reduceClickArea,
|
|
209
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$c);
|
|
230
210
|
// Trick to allow using a ref locally, while still allowing for ref forwarding
|
|
231
211
|
// Read more at https://reactjs.org/docs/hooks-reference.html#useimperativehandle
|
|
232
|
-
var innerRef = React__default.useRef(null);
|
|
233
|
-
|
|
212
|
+
var innerRef = React__default.useRef(null);
|
|
213
|
+
//eslint-disable-next-line
|
|
234
214
|
React__default.useImperativeHandle(ref, function () {
|
|
235
215
|
return innerRef.current;
|
|
236
216
|
});
|
|
@@ -265,10 +245,9 @@ var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
265
245
|
as: "span"
|
|
266
246
|
}, children));
|
|
267
247
|
});
|
|
268
|
-
|
|
269
248
|
var CheckboxIcon = function CheckboxIcon(_ref2) {
|
|
270
249
|
var _ref2$indeterminate = _ref2.indeterminate,
|
|
271
|
-
|
|
250
|
+
indeterminate = _ref2$indeterminate === void 0 ? false : _ref2$indeterminate;
|
|
272
251
|
return React__default.createElement("svg", {
|
|
273
252
|
className: "eds-checkbox-icon",
|
|
274
253
|
width: "11px",
|
|
@@ -290,10 +269,9 @@ var CheckboxIcon = function CheckboxIcon(_ref2) {
|
|
|
290
269
|
var _excluded$b = ["children", "className", "label"];
|
|
291
270
|
var Fieldset = function Fieldset(_ref) {
|
|
292
271
|
var children = _ref.children,
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
272
|
+
className = _ref.className,
|
|
273
|
+
label = _ref.label,
|
|
274
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$b);
|
|
297
275
|
return React__default.createElement("fieldset", _extends({
|
|
298
276
|
className: classNames('eds-fieldset', className)
|
|
299
277
|
}, rest), label && React__default.createElement(Label, {
|
|
@@ -306,31 +284,26 @@ var RadioGroupContext = /*#__PURE__*/React__default.createContext(null);
|
|
|
306
284
|
var RadioGroupContextProvider = RadioGroupContext.Provider;
|
|
307
285
|
var useRadioGroupContext = function useRadioGroupContext() {
|
|
308
286
|
var context = React__default.useContext(RadioGroupContext);
|
|
309
|
-
|
|
310
287
|
if (!context) {
|
|
311
288
|
throw new Error('You need to wrap your RadioButtons in a RadioGroup component');
|
|
312
289
|
}
|
|
313
|
-
|
|
314
290
|
return context;
|
|
315
291
|
};
|
|
316
292
|
|
|
317
293
|
var _excluded$a = ["className", "children", "value", "disabled"];
|
|
318
294
|
var Radio = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
319
295
|
var className = _ref.className,
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
296
|
+
children = _ref.children,
|
|
297
|
+
value = _ref.value,
|
|
298
|
+
disabled = _ref.disabled,
|
|
299
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$a);
|
|
325
300
|
var classList = classNames(className, 'eds-form-component--radio__radio', {
|
|
326
301
|
'eds-form-component--radio__radio--disabled': disabled
|
|
327
302
|
});
|
|
328
|
-
|
|
329
303
|
var _useRadioGroupContext = useRadioGroupContext(),
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
304
|
+
name = _useRadioGroupContext.name,
|
|
305
|
+
selectedValue = _useRadioGroupContext.value,
|
|
306
|
+
onChange = _useRadioGroupContext.onChange;
|
|
334
307
|
return React__default.createElement("label", {
|
|
335
308
|
className: "eds-form-component--radio__container"
|
|
336
309
|
}, React__default.createElement("input", _extends({
|
|
@@ -355,12 +328,11 @@ var Radio = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
355
328
|
var _excluded$9 = ["name", "value", "children", "onChange", "label"];
|
|
356
329
|
var RadioGroup = function RadioGroup(_ref) {
|
|
357
330
|
var name = _ref.name,
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
331
|
+
value = _ref.value,
|
|
332
|
+
children = _ref.children,
|
|
333
|
+
onChange = _ref.onChange,
|
|
334
|
+
label = _ref.label,
|
|
335
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$9);
|
|
364
336
|
var contextValue = React__default.useMemo(function () {
|
|
365
337
|
return {
|
|
366
338
|
name: name,
|
|
@@ -378,29 +350,26 @@ var RadioGroup = function RadioGroup(_ref) {
|
|
|
378
350
|
var _excluded$8 = ["className", "children", "value", "title", "secondaryLabel", "size", "hideCheckbox", "style", "id", "disabled"];
|
|
379
351
|
var RadioPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
380
352
|
var className = _ref.className,
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
353
|
+
children = _ref.children,
|
|
354
|
+
value = _ref.value,
|
|
355
|
+
title = _ref.title,
|
|
356
|
+
secondaryLabel = _ref.secondaryLabel,
|
|
357
|
+
_ref$size = _ref.size,
|
|
358
|
+
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
359
|
+
_ref$hideCheckbox = _ref.hideCheckbox,
|
|
360
|
+
hideCheckbox = _ref$hideCheckbox === void 0 ? false : _ref$hideCheckbox,
|
|
361
|
+
style = _ref.style,
|
|
362
|
+
id = _ref.id,
|
|
363
|
+
_ref$disabled = _ref.disabled,
|
|
364
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
365
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
|
|
395
366
|
var classList = classNames(className, 'eds-radio-panel__container', "eds-radio-panel--" + size, {
|
|
396
367
|
'eds-radio-panel--disabled': disabled
|
|
397
368
|
});
|
|
398
|
-
|
|
399
369
|
var _useRadioGroupContext = useRadioGroupContext(),
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
370
|
+
name = _useRadioGroupContext.name,
|
|
371
|
+
selectedValue = _useRadioGroupContext.value,
|
|
372
|
+
onChange = _useRadioGroupContext.onChange;
|
|
404
373
|
var randomId = useRandomId('eds-radiopanel');
|
|
405
374
|
var radioPanelId = id || randomId;
|
|
406
375
|
return React__default.createElement("label", {
|
|
@@ -430,7 +399,6 @@ var RadioPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
430
399
|
className: "eds-radio-panel__additional-content"
|
|
431
400
|
}, children)));
|
|
432
401
|
});
|
|
433
|
-
|
|
434
402
|
var RadioPanelCheck = function RadioPanelCheck() {
|
|
435
403
|
return React__default.createElement("svg", {
|
|
436
404
|
className: "eds-checkbox-icon",
|
|
@@ -447,26 +415,23 @@ var RadioPanelCheck = function RadioPanelCheck() {
|
|
|
447
415
|
var _excluded$7 = ["className", "children", "labelPlacement", "icon", "hideIcon", "color", "contrastColor", "size"];
|
|
448
416
|
var Switch = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
449
417
|
var className = _ref.className,
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
418
|
+
children = _ref.children,
|
|
419
|
+
_ref$labelPlacement = _ref.labelPlacement,
|
|
420
|
+
labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
|
|
421
|
+
icon = _ref.icon,
|
|
422
|
+
_ref$hideIcon = _ref.hideIcon,
|
|
423
|
+
hideIcon = _ref$hideIcon === void 0 ? false : _ref$hideIcon,
|
|
424
|
+
_ref$color = _ref.color,
|
|
425
|
+
color = _ref$color === void 0 ? colors.validation.mintContrast : _ref$color,
|
|
426
|
+
contrastColor = _ref.contrastColor,
|
|
427
|
+
_ref$size = _ref.size,
|
|
428
|
+
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
429
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$7);
|
|
463
430
|
var chosenContrastColor = contrastColor && contrastColor || color;
|
|
464
|
-
|
|
465
431
|
var displayedIcon = function displayedIcon() {
|
|
466
432
|
if (icon) return icon;
|
|
467
433
|
return rest.checked ? React__default.createElement(CheckIcon, null) : React__default.createElement(CloseSmallIcon, null);
|
|
468
434
|
};
|
|
469
|
-
|
|
470
435
|
return React__default.createElement("label", {
|
|
471
436
|
className: classNames('eds-switch', "eds-switch--" + labelPlacement, className),
|
|
472
437
|
style: _extends({}, rest.style)
|
|
@@ -489,18 +454,16 @@ var Switch = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
489
454
|
var _excluded$6 = ["className", "children", "labelPlacement", "transport", "size"];
|
|
490
455
|
var TravelSwitch = function TravelSwitch(_ref) {
|
|
491
456
|
var className = _ref.className,
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
457
|
+
children = _ref.children,
|
|
458
|
+
_ref$labelPlacement = _ref.labelPlacement,
|
|
459
|
+
labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
|
|
460
|
+
transport = _ref.transport,
|
|
461
|
+
size = _ref.size,
|
|
462
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
499
463
|
var _modeCalc = modeCalc(transport),
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
464
|
+
color = _modeCalc.color,
|
|
465
|
+
contrast = _modeCalc.contrast,
|
|
466
|
+
Icon = _modeCalc.Icon;
|
|
504
467
|
return React__default.createElement(Switch, _extends({
|
|
505
468
|
className: className,
|
|
506
469
|
labelPlacement: labelPlacement,
|
|
@@ -510,7 +473,6 @@ var TravelSwitch = function TravelSwitch(_ref) {
|
|
|
510
473
|
size: size
|
|
511
474
|
}, rest), children);
|
|
512
475
|
};
|
|
513
|
-
|
|
514
476
|
function modeCalc(mode) {
|
|
515
477
|
switch (mode) {
|
|
516
478
|
case 'bus':
|
|
@@ -519,70 +481,60 @@ function modeCalc(mode) {
|
|
|
519
481
|
color: colors.transport["default"].bus,
|
|
520
482
|
contrast: colors.transport.contrast.bus
|
|
521
483
|
};
|
|
522
|
-
|
|
523
484
|
case 'metro':
|
|
524
485
|
return {
|
|
525
486
|
Icon: SubwayIcon,
|
|
526
487
|
color: colors.transport["default"].metro,
|
|
527
488
|
contrast: colors.transport.contrast.metro
|
|
528
489
|
};
|
|
529
|
-
|
|
530
490
|
case 'air':
|
|
531
491
|
return {
|
|
532
492
|
Icon: PlaneIcon,
|
|
533
493
|
color: colors.transport["default"].plane,
|
|
534
494
|
contrast: colors.transport.contrast.plane
|
|
535
495
|
};
|
|
536
|
-
|
|
537
496
|
case 'tram':
|
|
538
497
|
return {
|
|
539
498
|
Icon: TramIcon,
|
|
540
499
|
color: colors.transport["default"].tram,
|
|
541
500
|
contrast: colors.transport.contrast.tram
|
|
542
501
|
};
|
|
543
|
-
|
|
544
502
|
case 'rail':
|
|
545
503
|
return {
|
|
546
504
|
Icon: TrainIcon,
|
|
547
505
|
color: colors.transport["default"].train,
|
|
548
506
|
contrast: colors.transport.contrast.train
|
|
549
507
|
};
|
|
550
|
-
|
|
551
508
|
case 'water':
|
|
552
509
|
return {
|
|
553
510
|
Icon: FerryIcon,
|
|
554
511
|
color: colors.transport["default"].ferry,
|
|
555
512
|
contrast: colors.transport.contrast.ferry
|
|
556
513
|
};
|
|
557
|
-
|
|
558
514
|
case 'bike':
|
|
559
515
|
return {
|
|
560
516
|
Icon: BicycleIcon,
|
|
561
517
|
color: colors.transport["default"].mobility,
|
|
562
518
|
contrast: colors.transport.contrast.mobility
|
|
563
519
|
};
|
|
564
|
-
|
|
565
520
|
case 'scooter':
|
|
566
521
|
return {
|
|
567
522
|
Icon: ScooterIcon,
|
|
568
523
|
color: colors.transport["default"].mobility,
|
|
569
524
|
contrast: colors.transport.contrast.mobility
|
|
570
525
|
};
|
|
571
|
-
|
|
572
526
|
case 'airportLinkBus':
|
|
573
527
|
return {
|
|
574
528
|
Icon: BusIcon,
|
|
575
529
|
color: colors.transport["default"].plane,
|
|
576
530
|
contrast: colors.transport.contrast.plane
|
|
577
531
|
};
|
|
578
|
-
|
|
579
532
|
case 'airportLinkRail':
|
|
580
533
|
return {
|
|
581
534
|
Icon: TrainIcon,
|
|
582
535
|
color: colors.transport["default"].plane,
|
|
583
536
|
contrast: colors.transport.contrast.plane
|
|
584
537
|
};
|
|
585
|
-
|
|
586
538
|
default:
|
|
587
539
|
throw Error('Please select a transport for the TravelSwitch.');
|
|
588
540
|
}
|
|
@@ -591,7 +543,8 @@ function modeCalc(mode) {
|
|
|
591
543
|
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types -- disabled during Yarn upgrade
|
|
592
544
|
function hasValue(value) {
|
|
593
545
|
return value != null && !(Array.isArray(value) && value.length === 0);
|
|
594
|
-
}
|
|
546
|
+
}
|
|
547
|
+
// Determine if field is empty or filled.
|
|
595
548
|
// Response determines if label is presented above field or as placeholder.
|
|
596
549
|
//
|
|
597
550
|
// @param obj
|
|
@@ -599,32 +552,29 @@ function hasValue(value) {
|
|
|
599
552
|
// @returns {boolean} False when not present or empty string.
|
|
600
553
|
// True when any number or string with length.
|
|
601
554
|
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types -- disabled during Yarn upgrade
|
|
602
|
-
|
|
603
555
|
function isFilled(obj, SSR) {
|
|
604
556
|
if (SSR === void 0) {
|
|
605
557
|
SSR = false;
|
|
606
558
|
}
|
|
607
|
-
|
|
608
559
|
return obj && (hasValue(obj.value) && obj.value !== '' || SSR && hasValue(obj.defaultValue) && obj.defaultValue !== '');
|
|
609
560
|
}
|
|
610
561
|
|
|
611
562
|
var _excluded$5 = ["variant", "disabled", "readOnly", "className", "style", "label", "feedback", "labelTooltip", "onChange", "disableLabelAnimation"],
|
|
612
|
-
|
|
563
|
+
_excluded2$1 = ["readOnly", "disabled", "onChange", "value", "variant"];
|
|
613
564
|
var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
614
565
|
var variant = _ref.variant,
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
566
|
+
_ref$disabled = _ref.disabled,
|
|
567
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
568
|
+
_ref$readOnly = _ref.readOnly,
|
|
569
|
+
readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
|
|
570
|
+
className = _ref.className,
|
|
571
|
+
style = _ref.style,
|
|
572
|
+
label = _ref.label,
|
|
573
|
+
feedback = _ref.feedback,
|
|
574
|
+
labelTooltip = _ref.labelTooltip,
|
|
575
|
+
onChange = _ref.onChange,
|
|
576
|
+
disableLabelAnimation = _ref.disableLabelAnimation,
|
|
577
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
628
578
|
var textAreaId = useRandomId('eds-textarea');
|
|
629
579
|
return React__default.createElement(BaseFormControl, {
|
|
630
580
|
className: className,
|
|
@@ -651,19 +601,16 @@ var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
651
601
|
});
|
|
652
602
|
var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
|
|
653
603
|
var readOnly = _ref2.readOnly,
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
604
|
+
disabled = _ref2.disabled,
|
|
605
|
+
onChange = _ref2.onChange,
|
|
606
|
+
value = _ref2.value,
|
|
607
|
+
variant = _ref2.variant,
|
|
608
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
|
|
660
609
|
var contextVariant = useVariant();
|
|
661
610
|
var currentVariant = variant || contextVariant;
|
|
662
|
-
|
|
663
611
|
var _useInputGroupContext = useInputGroupContext(),
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
612
|
+
isInputFilled = _useInputGroupContext.isFilled,
|
|
613
|
+
setFiller = _useInputGroupContext.setFilled;
|
|
667
614
|
useOnMount(function () {
|
|
668
615
|
if (value || rest.defaultValue) {
|
|
669
616
|
setFiller && !isInputFilled && setFiller(true);
|
|
@@ -674,19 +621,16 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
|
|
|
674
621
|
setFiller(true);
|
|
675
622
|
}
|
|
676
623
|
}, [value, setFiller, isInputFilled]);
|
|
677
|
-
|
|
678
624
|
var handleChange = function handleChange(event) {
|
|
679
625
|
if (isFilled(event.target)) {
|
|
680
626
|
setFiller && !isInputFilled && setFiller(true);
|
|
681
627
|
} else {
|
|
682
628
|
setFiller && isInputFilled && setFiller(false);
|
|
683
629
|
}
|
|
684
|
-
|
|
685
630
|
if (onChange) {
|
|
686
631
|
onChange(event);
|
|
687
632
|
}
|
|
688
633
|
};
|
|
689
|
-
|
|
690
634
|
return React__default.createElement("textarea", _extends({
|
|
691
635
|
className: "eds-form-control eds-textarea",
|
|
692
636
|
ref: ref,
|
|
@@ -699,35 +643,34 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
|
|
|
699
643
|
});
|
|
700
644
|
|
|
701
645
|
var _excluded$4 = ["prepend", "append", "variant", "disabled", "readOnly", "className", "style", "size", "label", "required", "labelTooltip", "feedback", "onChange", "disableLabelAnimation", "labelProps", "clearable", "onClear", "value", "ariaAlertOnFeedback"],
|
|
702
|
-
|
|
703
|
-
|
|
646
|
+
_excluded2 = ["disabled", "readOnly", "placeholder", "onChange", "value", "variant"],
|
|
647
|
+
_excluded3 = ["onClear"];
|
|
704
648
|
var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
705
649
|
var prepend = _ref.prepend,
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
|
|
650
|
+
append = _ref.append,
|
|
651
|
+
variant = _ref.variant,
|
|
652
|
+
_ref$disabled = _ref.disabled,
|
|
653
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
654
|
+
_ref$readOnly = _ref.readOnly,
|
|
655
|
+
readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
|
|
656
|
+
className = _ref.className,
|
|
657
|
+
style = _ref.style,
|
|
658
|
+
_ref$size = _ref.size,
|
|
659
|
+
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
660
|
+
label = _ref.label,
|
|
661
|
+
required = _ref.required,
|
|
662
|
+
labelTooltip = _ref.labelTooltip,
|
|
663
|
+
feedback = _ref.feedback,
|
|
664
|
+
onChange = _ref.onChange,
|
|
665
|
+
disableLabelAnimation = _ref.disableLabelAnimation,
|
|
666
|
+
labelProps = _ref.labelProps,
|
|
667
|
+
_ref$clearable = _ref.clearable,
|
|
668
|
+
clearable = _ref$clearable === void 0 ? false : _ref$clearable,
|
|
669
|
+
onClear = _ref.onClear,
|
|
670
|
+
value = _ref.value,
|
|
671
|
+
_ref$ariaAlertOnFeedb = _ref.ariaAlertOnFeedback,
|
|
672
|
+
ariaAlertOnFeedback = _ref$ariaAlertOnFeedb === void 0 ? false : _ref$ariaAlertOnFeedb,
|
|
673
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
731
674
|
var randomId = useRandomId('eds-textfield');
|
|
732
675
|
var textFieldId = labelProps && labelProps.id ? labelProps.id : randomId;
|
|
733
676
|
return React__default.createElement(BaseFormControl, {
|
|
@@ -761,20 +704,17 @@ var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
761
704
|
});
|
|
762
705
|
var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forwardRef) {
|
|
763
706
|
var disabled = _ref2.disabled,
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
707
|
+
readOnly = _ref2.readOnly,
|
|
708
|
+
placeholder = _ref2.placeholder,
|
|
709
|
+
onChange = _ref2.onChange,
|
|
710
|
+
value = _ref2.value,
|
|
711
|
+
variant = _ref2.variant,
|
|
712
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded2);
|
|
771
713
|
var contextVariant = useVariant();
|
|
772
714
|
var currentVariant = variant || contextVariant;
|
|
773
|
-
|
|
774
715
|
var _useInputGroupContext = useInputGroupContext(),
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
716
|
+
isInputFilled = _useInputGroupContext.isFilled,
|
|
717
|
+
setFiller = _useInputGroupContext.setFilled;
|
|
778
718
|
useOnMount(function () {
|
|
779
719
|
if (value || rest.defaultValue) {
|
|
780
720
|
setFiller && !isInputFilled && setFiller(true);
|
|
@@ -785,19 +725,16 @@ var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forw
|
|
|
785
725
|
setFiller(true);
|
|
786
726
|
}
|
|
787
727
|
}, [value, setFiller, isInputFilled]);
|
|
788
|
-
|
|
789
728
|
var handleChange = function handleChange(event) {
|
|
790
729
|
if (isFilled(event.target)) {
|
|
791
730
|
setFiller && !isInputFilled && setFiller(true);
|
|
792
731
|
} else {
|
|
793
732
|
setFiller && isInputFilled && setFiller(false);
|
|
794
733
|
}
|
|
795
|
-
|
|
796
734
|
if (onChange) {
|
|
797
735
|
onChange(event);
|
|
798
736
|
}
|
|
799
737
|
};
|
|
800
|
-
|
|
801
738
|
return React__default.createElement("input", _extends({
|
|
802
739
|
"aria-invalid": currentVariant === 'error',
|
|
803
740
|
className: "eds-form-control",
|
|
@@ -809,15 +746,12 @@ var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forw
|
|
|
809
746
|
value: value
|
|
810
747
|
}, rest));
|
|
811
748
|
});
|
|
812
|
-
|
|
813
749
|
var ClearButton = function ClearButton(_ref3) {
|
|
814
750
|
var onClear = _ref3.onClear,
|
|
815
|
-
|
|
816
|
-
|
|
751
|
+
props = _objectWithoutPropertiesLoose(_ref3, _excluded3);
|
|
817
752
|
var _useInputGroupContext2 = useInputGroupContext(),
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
753
|
+
hasValue = _useInputGroupContext2.isFilled,
|
|
754
|
+
setFilled = _useInputGroupContext2.setFilled;
|
|
821
755
|
return React__default.createElement("div", {
|
|
822
756
|
className: "eds-textfield__clear-button-wrapper"
|
|
823
757
|
}, hasValue && React__default.createElement("div", {
|
|
@@ -837,15 +771,14 @@ var _excluded$3 = ["name", "onChange", "selectedValue", "multiple", "size"];
|
|
|
837
771
|
var SegmentedContext = /*#__PURE__*/React__default.createContext(null);
|
|
838
772
|
var SegmentedProvider = function SegmentedProvider(_ref) {
|
|
839
773
|
var name = _ref.name,
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
774
|
+
_ref$onChange = _ref.onChange,
|
|
775
|
+
onChange = _ref$onChange === void 0 ? function () {
|
|
776
|
+
return undefined;
|
|
777
|
+
} : _ref$onChange,
|
|
778
|
+
selectedValue = _ref.selectedValue,
|
|
779
|
+
multiple = _ref.multiple,
|
|
780
|
+
size = _ref.size,
|
|
781
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
849
782
|
var generatedName = useRandomId('eds-segmented-control');
|
|
850
783
|
var contextValue = React__default.useMemo(function () {
|
|
851
784
|
return {
|
|
@@ -862,48 +795,40 @@ var SegmentedProvider = function SegmentedProvider(_ref) {
|
|
|
862
795
|
};
|
|
863
796
|
var useSegmentedContext = function useSegmentedContext() {
|
|
864
797
|
var context = React__default.useContext(SegmentedContext);
|
|
865
|
-
|
|
866
798
|
if (!context) {
|
|
867
799
|
throw new Error('You need to wrap your SegmentedChoice in either SegmentedControl or MultipleSegmentedControl');
|
|
868
800
|
}
|
|
869
|
-
|
|
870
801
|
return context;
|
|
871
802
|
};
|
|
872
803
|
|
|
873
804
|
var _excluded$2 = ["children", "className", "style", "value", "name", "onChange"];
|
|
874
805
|
var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
875
806
|
var children = _ref.children,
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
|
|
881
|
-
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
807
|
+
className = _ref.className,
|
|
808
|
+
style = _ref.style,
|
|
809
|
+
value = _ref.value,
|
|
810
|
+
name = _ref.name,
|
|
811
|
+
_ref$onChange = _ref.onChange,
|
|
812
|
+
onChange = _ref$onChange === void 0 ? function () {
|
|
813
|
+
return undefined;
|
|
814
|
+
} : _ref$onChange,
|
|
815
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
886
816
|
var _useSegmentedContext = useSegmentedContext(),
|
|
887
|
-
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
817
|
+
commonName = _useSegmentedContext.name,
|
|
818
|
+
selectedValue = _useSegmentedContext.selectedValue,
|
|
819
|
+
commonOnChange = _useSegmentedContext.onChange,
|
|
820
|
+
multiple = _useSegmentedContext.multiple,
|
|
821
|
+
size = _useSegmentedContext.size;
|
|
893
822
|
var isChecked = multiple ? selectedValue[value] : selectedValue === value;
|
|
894
|
-
|
|
895
823
|
var handleChange = function handleChange(e) {
|
|
896
824
|
onChange(e);
|
|
897
|
-
|
|
898
825
|
if (multiple) {
|
|
899
826
|
var _extends2;
|
|
900
|
-
|
|
901
827
|
commonOnChange(_extends({}, selectedValue, (_extends2 = {}, _extends2[value] = e.target.checked, _extends2)));
|
|
902
828
|
} else if (e.target.checked) {
|
|
903
829
|
commonOnChange(value);
|
|
904
830
|
}
|
|
905
831
|
};
|
|
906
|
-
|
|
907
832
|
return React__default.createElement("label", {
|
|
908
833
|
className: classNames('eds-segmented-choice', className, {
|
|
909
834
|
'eds-segmented-choide--large': size === 'large'
|
|
@@ -926,15 +851,14 @@ var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
926
851
|
var _excluded$1 = ["children", "label", "name", "onChange", "selectedValue", "size", "className"];
|
|
927
852
|
var SegmentedControl = function SegmentedControl(_ref) {
|
|
928
853
|
var children = _ref.children,
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
854
|
+
label = _ref.label,
|
|
855
|
+
name = _ref.name,
|
|
856
|
+
onChange = _ref.onChange,
|
|
857
|
+
selectedValue = _ref.selectedValue,
|
|
858
|
+
_ref$size = _ref.size,
|
|
859
|
+
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
860
|
+
className = _ref.className,
|
|
861
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
938
862
|
return React__default.createElement(SegmentedProvider, {
|
|
939
863
|
name: name,
|
|
940
864
|
selectedValue: selectedValue,
|
|
@@ -952,15 +876,13 @@ var _excluded = ["children", "label", "name", "onChange", "selectedValue"];
|
|
|
952
876
|
/**This component is not used by anyone, and is therefore deprecated
|
|
953
877
|
* @deprecated
|
|
954
878
|
*/
|
|
955
|
-
|
|
956
879
|
var MultipleSegmentedControl = function MultipleSegmentedControl(_ref) {
|
|
957
880
|
var children = _ref.children,
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
|
|
962
|
-
|
|
963
|
-
|
|
881
|
+
label = _ref.label,
|
|
882
|
+
name = _ref.name,
|
|
883
|
+
onChange = _ref.onChange,
|
|
884
|
+
selectedValue = _ref.selectedValue,
|
|
885
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
964
886
|
return React__default.createElement(SegmentedProvider, {
|
|
965
887
|
name: name,
|
|
966
888
|
selectedValue: selectedValue,
|