@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
|
@@ -38,73 +38,59 @@ function _extends() {
|
|
|
38
38
|
_extends = Object.assign || function (target) {
|
|
39
39
|
for (var i = 1; i < arguments.length; i++) {
|
|
40
40
|
var source = arguments[i];
|
|
41
|
-
|
|
42
41
|
for (var key in source) {
|
|
43
42
|
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
44
43
|
target[key] = source[key];
|
|
45
44
|
}
|
|
46
45
|
}
|
|
47
46
|
}
|
|
48
|
-
|
|
49
47
|
return target;
|
|
50
48
|
};
|
|
51
|
-
|
|
52
49
|
return _extends.apply(this, arguments);
|
|
53
50
|
}
|
|
54
|
-
|
|
55
51
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
56
52
|
if (source == null) return {};
|
|
57
53
|
var target = {};
|
|
58
54
|
var sourceKeys = Object.keys(source);
|
|
59
55
|
var key, i;
|
|
60
|
-
|
|
61
56
|
for (i = 0; i < sourceKeys.length; i++) {
|
|
62
57
|
key = sourceKeys[i];
|
|
63
58
|
if (excluded.indexOf(key) >= 0) continue;
|
|
64
59
|
target[key] = source[key];
|
|
65
60
|
}
|
|
66
|
-
|
|
67
61
|
return target;
|
|
68
62
|
}
|
|
69
63
|
|
|
70
64
|
var _excluded$f = ["children", "hideIcon", "variant", "className"];
|
|
71
|
-
|
|
72
65
|
var AlertIcon = function AlertIcon(_ref) {
|
|
73
66
|
var variant = _ref.variant;
|
|
74
67
|
var iconClass = "eds-feedback-text__icon eds-feedback-text__icon--" + variant;
|
|
75
|
-
|
|
76
68
|
switch (variant) {
|
|
77
69
|
case 'success':
|
|
78
70
|
return React__default["default"].createElement(icons.ValidationCheckIcon, {
|
|
79
71
|
className: iconClass
|
|
80
72
|
});
|
|
81
|
-
|
|
82
73
|
case 'error':
|
|
83
74
|
return React__default["default"].createElement(icons.ValidationErrorIcon, {
|
|
84
75
|
className: iconClass
|
|
85
76
|
});
|
|
86
|
-
|
|
87
77
|
case 'info':
|
|
88
78
|
return null;
|
|
89
|
-
|
|
90
79
|
case 'warning':
|
|
91
80
|
return React__default["default"].createElement(icons.ValidationExclamationIcon, {
|
|
92
81
|
className: iconClass
|
|
93
82
|
});
|
|
94
|
-
|
|
95
83
|
default:
|
|
96
84
|
return null;
|
|
97
85
|
}
|
|
98
86
|
};
|
|
99
|
-
|
|
100
87
|
var FeedbackText = function FeedbackText(_ref2) {
|
|
101
88
|
var children = _ref2.children,
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
89
|
+
_ref2$hideIcon = _ref2.hideIcon,
|
|
90
|
+
hideIcon = _ref2$hideIcon === void 0 ? false : _ref2$hideIcon,
|
|
91
|
+
variant = _ref2.variant,
|
|
92
|
+
className = _ref2.className,
|
|
93
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded$f);
|
|
108
94
|
return React__default["default"].createElement(typography.SubLabel, _extends({
|
|
109
95
|
className: classNames__default["default"]('eds-feedback-text', {
|
|
110
96
|
'eds-feedback-text--info': variant === 'info'
|
|
@@ -124,11 +110,9 @@ var InputGroupContext = /*#__PURE__*/React__namespace.createContext({
|
|
|
124
110
|
});
|
|
125
111
|
var InputGroupContextProvider = function InputGroupContextProvider(_ref) {
|
|
126
112
|
var children = _ref.children;
|
|
127
|
-
|
|
128
113
|
var _React$useState = React__namespace.useState(false),
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
114
|
+
filled = _React$useState[0],
|
|
115
|
+
setFilled = _React$useState[1];
|
|
132
116
|
return React__namespace.createElement(InputGroupContext.Provider, {
|
|
133
117
|
value: {
|
|
134
118
|
isFilled: filled,
|
|
@@ -143,15 +127,13 @@ var useInputGroupContext = function useInputGroupContext() {
|
|
|
143
127
|
var _excluded$e = ["label", "required", "labelId", "staticAnimation"];
|
|
144
128
|
var InputGroupLabel = function InputGroupLabel(_ref) {
|
|
145
129
|
var label = _ref.label,
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
130
|
+
required = _ref.required,
|
|
131
|
+
labelId = _ref.labelId,
|
|
132
|
+
_ref$staticAnimation = _ref.staticAnimation,
|
|
133
|
+
staticAnimation = _ref$staticAnimation === void 0 ? false : _ref$staticAnimation,
|
|
134
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$e);
|
|
152
135
|
var _useInputGroupContext = useInputGroupContext(),
|
|
153
|
-
|
|
154
|
-
|
|
136
|
+
isFilled = _useInputGroupContext.isFilled;
|
|
155
137
|
var filler = staticAnimation || isFilled;
|
|
156
138
|
return React__default["default"].createElement("label", _extends({
|
|
157
139
|
className: classNames__default["default"](rest.className, {
|
|
@@ -168,8 +150,8 @@ var InputGroupLabel = function InputGroupLabel(_ref) {
|
|
|
168
150
|
var VariantContext = /*#__PURE__*/React__default["default"].createContext(null);
|
|
169
151
|
var VariantProvider = function VariantProvider(_ref) {
|
|
170
152
|
var children = _ref.children,
|
|
171
|
-
|
|
172
|
-
|
|
153
|
+
_ref$variant = _ref.variant,
|
|
154
|
+
variant = _ref$variant === void 0 ? null : _ref$variant;
|
|
173
155
|
return React__default["default"].createElement(VariantContext.Provider, {
|
|
174
156
|
value: variant
|
|
175
157
|
}, children);
|
|
@@ -182,32 +164,31 @@ var useVariant = function useVariant() {
|
|
|
182
164
|
var _excluded$d = ["children", "className", "dark", "disabled", "readOnly", "variant", "prepend", "append", "size", "isFilled", "label", "required", "labelTooltip", "feedback", "labelId", "labelProps", "style", "disableLabelAnimation", "ariaAlertOnFeedback"];
|
|
183
165
|
var BaseFormControl = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
184
166
|
var children = _ref.children,
|
|
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
|
-
|
|
167
|
+
className = _ref.className,
|
|
168
|
+
_ref$dark = _ref.dark,
|
|
169
|
+
dark = _ref$dark === void 0 ? false : _ref$dark,
|
|
170
|
+
_ref$disabled = _ref.disabled,
|
|
171
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
172
|
+
_ref$readOnly = _ref.readOnly,
|
|
173
|
+
readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
|
|
174
|
+
variant = _ref.variant,
|
|
175
|
+
prepend = _ref.prepend,
|
|
176
|
+
append = _ref.append,
|
|
177
|
+
_ref$size = _ref.size,
|
|
178
|
+
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
179
|
+
isFilled = _ref.isFilled,
|
|
180
|
+
label = _ref.label,
|
|
181
|
+
required = _ref.required,
|
|
182
|
+
labelTooltip = _ref.labelTooltip,
|
|
183
|
+
feedback = _ref.feedback,
|
|
184
|
+
labelId = _ref.labelId,
|
|
185
|
+
labelProps = _ref.labelProps,
|
|
186
|
+
style = _ref.style,
|
|
187
|
+
_ref$disableLabelAnim = _ref.disableLabelAnimation,
|
|
188
|
+
disableLabelAnimation = _ref$disableLabelAnim === void 0 ? false : _ref$disableLabelAnim,
|
|
189
|
+
_ref$ariaAlertOnFeedb = _ref.ariaAlertOnFeedback,
|
|
190
|
+
ariaAlertOnFeedback = _ref$ariaAlertOnFeedb === void 0 ? false : _ref$ariaAlertOnFeedb,
|
|
191
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
|
|
211
192
|
var contextVariant = useVariant();
|
|
212
193
|
var currentVariant = variant || contextVariant;
|
|
213
194
|
return React__default["default"].createElement(InputGroupContextProvider, null, React__default["default"].createElement("div", _extends({
|
|
@@ -246,18 +227,17 @@ var BaseFormControl = /*#__PURE__*/React__default["default"].forwardRef(function
|
|
|
246
227
|
var _excluded$c = ["checked", "className", "children", "style", "disabled", "reduceClickArea"];
|
|
247
228
|
var Checkbox = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
248
229
|
var checked = _ref.checked,
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
230
|
+
className = _ref.className,
|
|
231
|
+
children = _ref.children,
|
|
232
|
+
style = _ref.style,
|
|
233
|
+
_ref$disabled = _ref.disabled,
|
|
234
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
235
|
+
reduceClickArea = _ref.reduceClickArea,
|
|
236
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$c);
|
|
257
237
|
// Trick to allow using a ref locally, while still allowing for ref forwarding
|
|
258
238
|
// Read more at https://reactjs.org/docs/hooks-reference.html#useimperativehandle
|
|
259
|
-
var innerRef = React__default["default"].useRef(null);
|
|
260
|
-
|
|
239
|
+
var innerRef = React__default["default"].useRef(null);
|
|
240
|
+
//eslint-disable-next-line
|
|
261
241
|
React__default["default"].useImperativeHandle(ref, function () {
|
|
262
242
|
return innerRef.current;
|
|
263
243
|
});
|
|
@@ -292,10 +272,9 @@ var Checkbox = /*#__PURE__*/React__default["default"].forwardRef(function (_ref,
|
|
|
292
272
|
as: "span"
|
|
293
273
|
}, children));
|
|
294
274
|
});
|
|
295
|
-
|
|
296
275
|
var CheckboxIcon = function CheckboxIcon(_ref2) {
|
|
297
276
|
var _ref2$indeterminate = _ref2.indeterminate,
|
|
298
|
-
|
|
277
|
+
indeterminate = _ref2$indeterminate === void 0 ? false : _ref2$indeterminate;
|
|
299
278
|
return React__default["default"].createElement("svg", {
|
|
300
279
|
className: "eds-checkbox-icon",
|
|
301
280
|
width: "11px",
|
|
@@ -317,10 +296,9 @@ var CheckboxIcon = function CheckboxIcon(_ref2) {
|
|
|
317
296
|
var _excluded$b = ["children", "className", "label"];
|
|
318
297
|
var Fieldset = function Fieldset(_ref) {
|
|
319
298
|
var children = _ref.children,
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
299
|
+
className = _ref.className,
|
|
300
|
+
label = _ref.label,
|
|
301
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$b);
|
|
324
302
|
return React__default["default"].createElement("fieldset", _extends({
|
|
325
303
|
className: classNames__default["default"]('eds-fieldset', className)
|
|
326
304
|
}, rest), label && React__default["default"].createElement(typography.Label, {
|
|
@@ -333,31 +311,26 @@ var RadioGroupContext = /*#__PURE__*/React__default["default"].createContext(nul
|
|
|
333
311
|
var RadioGroupContextProvider = RadioGroupContext.Provider;
|
|
334
312
|
var useRadioGroupContext = function useRadioGroupContext() {
|
|
335
313
|
var context = React__default["default"].useContext(RadioGroupContext);
|
|
336
|
-
|
|
337
314
|
if (!context) {
|
|
338
315
|
throw new Error('You need to wrap your RadioButtons in a RadioGroup component');
|
|
339
316
|
}
|
|
340
|
-
|
|
341
317
|
return context;
|
|
342
318
|
};
|
|
343
319
|
|
|
344
320
|
var _excluded$a = ["className", "children", "value", "disabled"];
|
|
345
321
|
var Radio = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
346
322
|
var className = _ref.className,
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
323
|
+
children = _ref.children,
|
|
324
|
+
value = _ref.value,
|
|
325
|
+
disabled = _ref.disabled,
|
|
326
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$a);
|
|
352
327
|
var classList = classNames__default["default"](className, 'eds-form-component--radio__radio', {
|
|
353
328
|
'eds-form-component--radio__radio--disabled': disabled
|
|
354
329
|
});
|
|
355
|
-
|
|
356
330
|
var _useRadioGroupContext = useRadioGroupContext(),
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
331
|
+
name = _useRadioGroupContext.name,
|
|
332
|
+
selectedValue = _useRadioGroupContext.value,
|
|
333
|
+
onChange = _useRadioGroupContext.onChange;
|
|
361
334
|
return React__default["default"].createElement("label", {
|
|
362
335
|
className: "eds-form-component--radio__container"
|
|
363
336
|
}, React__default["default"].createElement("input", _extends({
|
|
@@ -382,12 +355,11 @@ var Radio = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, re
|
|
|
382
355
|
var _excluded$9 = ["name", "value", "children", "onChange", "label"];
|
|
383
356
|
var RadioGroup = function RadioGroup(_ref) {
|
|
384
357
|
var name = _ref.name,
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
358
|
+
value = _ref.value,
|
|
359
|
+
children = _ref.children,
|
|
360
|
+
onChange = _ref.onChange,
|
|
361
|
+
label = _ref.label,
|
|
362
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$9);
|
|
391
363
|
var contextValue = React__default["default"].useMemo(function () {
|
|
392
364
|
return {
|
|
393
365
|
name: name,
|
|
@@ -405,29 +377,26 @@ var RadioGroup = function RadioGroup(_ref) {
|
|
|
405
377
|
var _excluded$8 = ["className", "children", "value", "title", "secondaryLabel", "size", "hideCheckbox", "style", "id", "disabled"];
|
|
406
378
|
var RadioPanel = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
407
379
|
var className = _ref.className,
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
380
|
+
children = _ref.children,
|
|
381
|
+
value = _ref.value,
|
|
382
|
+
title = _ref.title,
|
|
383
|
+
secondaryLabel = _ref.secondaryLabel,
|
|
384
|
+
_ref$size = _ref.size,
|
|
385
|
+
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
386
|
+
_ref$hideCheckbox = _ref.hideCheckbox,
|
|
387
|
+
hideCheckbox = _ref$hideCheckbox === void 0 ? false : _ref$hideCheckbox,
|
|
388
|
+
style = _ref.style,
|
|
389
|
+
id = _ref.id,
|
|
390
|
+
_ref$disabled = _ref.disabled,
|
|
391
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
392
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
|
|
422
393
|
var classList = classNames__default["default"](className, 'eds-radio-panel__container', "eds-radio-panel--" + size, {
|
|
423
394
|
'eds-radio-panel--disabled': disabled
|
|
424
395
|
});
|
|
425
|
-
|
|
426
396
|
var _useRadioGroupContext = useRadioGroupContext(),
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
397
|
+
name = _useRadioGroupContext.name,
|
|
398
|
+
selectedValue = _useRadioGroupContext.value,
|
|
399
|
+
onChange = _useRadioGroupContext.onChange;
|
|
431
400
|
var randomId = utils.useRandomId('eds-radiopanel');
|
|
432
401
|
var radioPanelId = id || randomId;
|
|
433
402
|
return React__default["default"].createElement("label", {
|
|
@@ -457,7 +426,6 @@ var RadioPanel = /*#__PURE__*/React__default["default"].forwardRef(function (_re
|
|
|
457
426
|
className: "eds-radio-panel__additional-content"
|
|
458
427
|
}, children)));
|
|
459
428
|
});
|
|
460
|
-
|
|
461
429
|
var RadioPanelCheck = function RadioPanelCheck() {
|
|
462
430
|
return React__default["default"].createElement("svg", {
|
|
463
431
|
className: "eds-checkbox-icon",
|
|
@@ -474,26 +442,23 @@ var RadioPanelCheck = function RadioPanelCheck() {
|
|
|
474
442
|
var _excluded$7 = ["className", "children", "labelPlacement", "icon", "hideIcon", "color", "contrastColor", "size"];
|
|
475
443
|
var Switch = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
476
444
|
var className = _ref.className,
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
445
|
+
children = _ref.children,
|
|
446
|
+
_ref$labelPlacement = _ref.labelPlacement,
|
|
447
|
+
labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
|
|
448
|
+
icon = _ref.icon,
|
|
449
|
+
_ref$hideIcon = _ref.hideIcon,
|
|
450
|
+
hideIcon = _ref$hideIcon === void 0 ? false : _ref$hideIcon,
|
|
451
|
+
_ref$color = _ref.color,
|
|
452
|
+
color = _ref$color === void 0 ? tokens.colors.validation.mintContrast : _ref$color,
|
|
453
|
+
contrastColor = _ref.contrastColor,
|
|
454
|
+
_ref$size = _ref.size,
|
|
455
|
+
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
456
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$7);
|
|
490
457
|
var chosenContrastColor = contrastColor && contrastColor || color;
|
|
491
|
-
|
|
492
458
|
var displayedIcon = function displayedIcon() {
|
|
493
459
|
if (icon) return icon;
|
|
494
460
|
return rest.checked ? React__default["default"].createElement(icons.CheckIcon, null) : React__default["default"].createElement(icons.CloseSmallIcon, null);
|
|
495
461
|
};
|
|
496
|
-
|
|
497
462
|
return React__default["default"].createElement("label", {
|
|
498
463
|
className: classNames__default["default"]('eds-switch', "eds-switch--" + labelPlacement, className),
|
|
499
464
|
style: _extends({}, rest.style)
|
|
@@ -516,18 +481,16 @@ var Switch = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, r
|
|
|
516
481
|
var _excluded$6 = ["className", "children", "labelPlacement", "transport", "size"];
|
|
517
482
|
var TravelSwitch = function TravelSwitch(_ref) {
|
|
518
483
|
var className = _ref.className,
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
484
|
+
children = _ref.children,
|
|
485
|
+
_ref$labelPlacement = _ref.labelPlacement,
|
|
486
|
+
labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
|
|
487
|
+
transport = _ref.transport,
|
|
488
|
+
size = _ref.size,
|
|
489
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
526
490
|
var _modeCalc = modeCalc(transport),
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
491
|
+
color = _modeCalc.color,
|
|
492
|
+
contrast = _modeCalc.contrast,
|
|
493
|
+
Icon = _modeCalc.Icon;
|
|
531
494
|
return React__default["default"].createElement(Switch, _extends({
|
|
532
495
|
className: className,
|
|
533
496
|
labelPlacement: labelPlacement,
|
|
@@ -537,7 +500,6 @@ var TravelSwitch = function TravelSwitch(_ref) {
|
|
|
537
500
|
size: size
|
|
538
501
|
}, rest), children);
|
|
539
502
|
};
|
|
540
|
-
|
|
541
503
|
function modeCalc(mode) {
|
|
542
504
|
switch (mode) {
|
|
543
505
|
case 'bus':
|
|
@@ -546,70 +508,60 @@ function modeCalc(mode) {
|
|
|
546
508
|
color: tokens.colors.transport["default"].bus,
|
|
547
509
|
contrast: tokens.colors.transport.contrast.bus
|
|
548
510
|
};
|
|
549
|
-
|
|
550
511
|
case 'metro':
|
|
551
512
|
return {
|
|
552
513
|
Icon: icons.SubwayIcon,
|
|
553
514
|
color: tokens.colors.transport["default"].metro,
|
|
554
515
|
contrast: tokens.colors.transport.contrast.metro
|
|
555
516
|
};
|
|
556
|
-
|
|
557
517
|
case 'air':
|
|
558
518
|
return {
|
|
559
519
|
Icon: icons.PlaneIcon,
|
|
560
520
|
color: tokens.colors.transport["default"].plane,
|
|
561
521
|
contrast: tokens.colors.transport.contrast.plane
|
|
562
522
|
};
|
|
563
|
-
|
|
564
523
|
case 'tram':
|
|
565
524
|
return {
|
|
566
525
|
Icon: icons.TramIcon,
|
|
567
526
|
color: tokens.colors.transport["default"].tram,
|
|
568
527
|
contrast: tokens.colors.transport.contrast.tram
|
|
569
528
|
};
|
|
570
|
-
|
|
571
529
|
case 'rail':
|
|
572
530
|
return {
|
|
573
531
|
Icon: icons.TrainIcon,
|
|
574
532
|
color: tokens.colors.transport["default"].train,
|
|
575
533
|
contrast: tokens.colors.transport.contrast.train
|
|
576
534
|
};
|
|
577
|
-
|
|
578
535
|
case 'water':
|
|
579
536
|
return {
|
|
580
537
|
Icon: icons.FerryIcon,
|
|
581
538
|
color: tokens.colors.transport["default"].ferry,
|
|
582
539
|
contrast: tokens.colors.transport.contrast.ferry
|
|
583
540
|
};
|
|
584
|
-
|
|
585
541
|
case 'bike':
|
|
586
542
|
return {
|
|
587
543
|
Icon: icons.BicycleIcon,
|
|
588
544
|
color: tokens.colors.transport["default"].mobility,
|
|
589
545
|
contrast: tokens.colors.transport.contrast.mobility
|
|
590
546
|
};
|
|
591
|
-
|
|
592
547
|
case 'scooter':
|
|
593
548
|
return {
|
|
594
549
|
Icon: icons.ScooterIcon,
|
|
595
550
|
color: tokens.colors.transport["default"].mobility,
|
|
596
551
|
contrast: tokens.colors.transport.contrast.mobility
|
|
597
552
|
};
|
|
598
|
-
|
|
599
553
|
case 'airportLinkBus':
|
|
600
554
|
return {
|
|
601
555
|
Icon: icons.BusIcon,
|
|
602
556
|
color: tokens.colors.transport["default"].plane,
|
|
603
557
|
contrast: tokens.colors.transport.contrast.plane
|
|
604
558
|
};
|
|
605
|
-
|
|
606
559
|
case 'airportLinkRail':
|
|
607
560
|
return {
|
|
608
561
|
Icon: icons.TrainIcon,
|
|
609
562
|
color: tokens.colors.transport["default"].plane,
|
|
610
563
|
contrast: tokens.colors.transport.contrast.plane
|
|
611
564
|
};
|
|
612
|
-
|
|
613
565
|
default:
|
|
614
566
|
throw Error('Please select a transport for the TravelSwitch.');
|
|
615
567
|
}
|
|
@@ -618,7 +570,8 @@ function modeCalc(mode) {
|
|
|
618
570
|
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types -- disabled during Yarn upgrade
|
|
619
571
|
function hasValue(value) {
|
|
620
572
|
return value != null && !(Array.isArray(value) && value.length === 0);
|
|
621
|
-
}
|
|
573
|
+
}
|
|
574
|
+
// Determine if field is empty or filled.
|
|
622
575
|
// Response determines if label is presented above field or as placeholder.
|
|
623
576
|
//
|
|
624
577
|
// @param obj
|
|
@@ -626,32 +579,29 @@ function hasValue(value) {
|
|
|
626
579
|
// @returns {boolean} False when not present or empty string.
|
|
627
580
|
// True when any number or string with length.
|
|
628
581
|
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types -- disabled during Yarn upgrade
|
|
629
|
-
|
|
630
582
|
function isFilled(obj, SSR) {
|
|
631
583
|
if (SSR === void 0) {
|
|
632
584
|
SSR = false;
|
|
633
585
|
}
|
|
634
|
-
|
|
635
586
|
return obj && (hasValue(obj.value) && obj.value !== '' || SSR && hasValue(obj.defaultValue) && obj.defaultValue !== '');
|
|
636
587
|
}
|
|
637
588
|
|
|
638
589
|
var _excluded$5 = ["variant", "disabled", "readOnly", "className", "style", "label", "feedback", "labelTooltip", "onChange", "disableLabelAnimation"],
|
|
639
|
-
|
|
590
|
+
_excluded2$1 = ["readOnly", "disabled", "onChange", "value", "variant"];
|
|
640
591
|
var TextArea = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
641
592
|
var variant = _ref.variant,
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
593
|
+
_ref$disabled = _ref.disabled,
|
|
594
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
595
|
+
_ref$readOnly = _ref.readOnly,
|
|
596
|
+
readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
|
|
597
|
+
className = _ref.className,
|
|
598
|
+
style = _ref.style,
|
|
599
|
+
label = _ref.label,
|
|
600
|
+
feedback = _ref.feedback,
|
|
601
|
+
labelTooltip = _ref.labelTooltip,
|
|
602
|
+
onChange = _ref.onChange,
|
|
603
|
+
disableLabelAnimation = _ref.disableLabelAnimation,
|
|
604
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
655
605
|
var textAreaId = utils.useRandomId('eds-textarea');
|
|
656
606
|
return React__default["default"].createElement(BaseFormControl, {
|
|
657
607
|
className: className,
|
|
@@ -678,19 +628,16 @@ var TextArea = /*#__PURE__*/React__default["default"].forwardRef(function (_ref,
|
|
|
678
628
|
});
|
|
679
629
|
var TextAreaBase = /*#__PURE__*/React__default["default"].forwardRef(function (_ref2, ref) {
|
|
680
630
|
var readOnly = _ref2.readOnly,
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
631
|
+
disabled = _ref2.disabled,
|
|
632
|
+
onChange = _ref2.onChange,
|
|
633
|
+
value = _ref2.value,
|
|
634
|
+
variant = _ref2.variant,
|
|
635
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
|
|
687
636
|
var contextVariant = useVariant();
|
|
688
637
|
var currentVariant = variant || contextVariant;
|
|
689
|
-
|
|
690
638
|
var _useInputGroupContext = useInputGroupContext(),
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
639
|
+
isInputFilled = _useInputGroupContext.isFilled,
|
|
640
|
+
setFiller = _useInputGroupContext.setFilled;
|
|
694
641
|
utils.useOnMount(function () {
|
|
695
642
|
if (value || rest.defaultValue) {
|
|
696
643
|
setFiller && !isInputFilled && setFiller(true);
|
|
@@ -701,19 +648,16 @@ var TextAreaBase = /*#__PURE__*/React__default["default"].forwardRef(function (_
|
|
|
701
648
|
setFiller(true);
|
|
702
649
|
}
|
|
703
650
|
}, [value, setFiller, isInputFilled]);
|
|
704
|
-
|
|
705
651
|
var handleChange = function handleChange(event) {
|
|
706
652
|
if (isFilled(event.target)) {
|
|
707
653
|
setFiller && !isInputFilled && setFiller(true);
|
|
708
654
|
} else {
|
|
709
655
|
setFiller && isInputFilled && setFiller(false);
|
|
710
656
|
}
|
|
711
|
-
|
|
712
657
|
if (onChange) {
|
|
713
658
|
onChange(event);
|
|
714
659
|
}
|
|
715
660
|
};
|
|
716
|
-
|
|
717
661
|
return React__default["default"].createElement("textarea", _extends({
|
|
718
662
|
className: "eds-form-control eds-textarea",
|
|
719
663
|
ref: ref,
|
|
@@ -726,35 +670,34 @@ var TextAreaBase = /*#__PURE__*/React__default["default"].forwardRef(function (_
|
|
|
726
670
|
});
|
|
727
671
|
|
|
728
672
|
var _excluded$4 = ["prepend", "append", "variant", "disabled", "readOnly", "className", "style", "size", "label", "required", "labelTooltip", "feedback", "onChange", "disableLabelAnimation", "labelProps", "clearable", "onClear", "value", "ariaAlertOnFeedback"],
|
|
729
|
-
|
|
730
|
-
|
|
673
|
+
_excluded2 = ["disabled", "readOnly", "placeholder", "onChange", "value", "variant"],
|
|
674
|
+
_excluded3 = ["onClear"];
|
|
731
675
|
var TextField = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
732
676
|
var prepend = _ref.prepend,
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
677
|
+
append = _ref.append,
|
|
678
|
+
variant = _ref.variant,
|
|
679
|
+
_ref$disabled = _ref.disabled,
|
|
680
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
681
|
+
_ref$readOnly = _ref.readOnly,
|
|
682
|
+
readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
|
|
683
|
+
className = _ref.className,
|
|
684
|
+
style = _ref.style,
|
|
685
|
+
_ref$size = _ref.size,
|
|
686
|
+
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
687
|
+
label = _ref.label,
|
|
688
|
+
required = _ref.required,
|
|
689
|
+
labelTooltip = _ref.labelTooltip,
|
|
690
|
+
feedback = _ref.feedback,
|
|
691
|
+
onChange = _ref.onChange,
|
|
692
|
+
disableLabelAnimation = _ref.disableLabelAnimation,
|
|
693
|
+
labelProps = _ref.labelProps,
|
|
694
|
+
_ref$clearable = _ref.clearable,
|
|
695
|
+
clearable = _ref$clearable === void 0 ? false : _ref$clearable,
|
|
696
|
+
onClear = _ref.onClear,
|
|
697
|
+
value = _ref.value,
|
|
698
|
+
_ref$ariaAlertOnFeedb = _ref.ariaAlertOnFeedback,
|
|
699
|
+
ariaAlertOnFeedback = _ref$ariaAlertOnFeedb === void 0 ? false : _ref$ariaAlertOnFeedb,
|
|
700
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
758
701
|
var randomId = utils.useRandomId('eds-textfield');
|
|
759
702
|
var textFieldId = labelProps && labelProps.id ? labelProps.id : randomId;
|
|
760
703
|
return React__default["default"].createElement(BaseFormControl, {
|
|
@@ -788,20 +731,17 @@ var TextField = /*#__PURE__*/React__default["default"].forwardRef(function (_ref
|
|
|
788
731
|
});
|
|
789
732
|
var TextFieldBase = /*#__PURE__*/React__default["default"].forwardRef(function (_ref2, forwardRef) {
|
|
790
733
|
var disabled = _ref2.disabled,
|
|
791
|
-
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
734
|
+
readOnly = _ref2.readOnly,
|
|
735
|
+
placeholder = _ref2.placeholder,
|
|
736
|
+
onChange = _ref2.onChange,
|
|
737
|
+
value = _ref2.value,
|
|
738
|
+
variant = _ref2.variant,
|
|
739
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded2);
|
|
798
740
|
var contextVariant = useVariant();
|
|
799
741
|
var currentVariant = variant || contextVariant;
|
|
800
|
-
|
|
801
742
|
var _useInputGroupContext = useInputGroupContext(),
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
743
|
+
isInputFilled = _useInputGroupContext.isFilled,
|
|
744
|
+
setFiller = _useInputGroupContext.setFilled;
|
|
805
745
|
utils.useOnMount(function () {
|
|
806
746
|
if (value || rest.defaultValue) {
|
|
807
747
|
setFiller && !isInputFilled && setFiller(true);
|
|
@@ -812,19 +752,16 @@ var TextFieldBase = /*#__PURE__*/React__default["default"].forwardRef(function (
|
|
|
812
752
|
setFiller(true);
|
|
813
753
|
}
|
|
814
754
|
}, [value, setFiller, isInputFilled]);
|
|
815
|
-
|
|
816
755
|
var handleChange = function handleChange(event) {
|
|
817
756
|
if (isFilled(event.target)) {
|
|
818
757
|
setFiller && !isInputFilled && setFiller(true);
|
|
819
758
|
} else {
|
|
820
759
|
setFiller && isInputFilled && setFiller(false);
|
|
821
760
|
}
|
|
822
|
-
|
|
823
761
|
if (onChange) {
|
|
824
762
|
onChange(event);
|
|
825
763
|
}
|
|
826
764
|
};
|
|
827
|
-
|
|
828
765
|
return React__default["default"].createElement("input", _extends({
|
|
829
766
|
"aria-invalid": currentVariant === 'error',
|
|
830
767
|
className: "eds-form-control",
|
|
@@ -836,15 +773,12 @@ var TextFieldBase = /*#__PURE__*/React__default["default"].forwardRef(function (
|
|
|
836
773
|
value: value
|
|
837
774
|
}, rest));
|
|
838
775
|
});
|
|
839
|
-
|
|
840
776
|
var ClearButton = function ClearButton(_ref3) {
|
|
841
777
|
var onClear = _ref3.onClear,
|
|
842
|
-
|
|
843
|
-
|
|
778
|
+
props = _objectWithoutPropertiesLoose(_ref3, _excluded3);
|
|
844
779
|
var _useInputGroupContext2 = useInputGroupContext(),
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
780
|
+
hasValue = _useInputGroupContext2.isFilled,
|
|
781
|
+
setFilled = _useInputGroupContext2.setFilled;
|
|
848
782
|
return React__default["default"].createElement("div", {
|
|
849
783
|
className: "eds-textfield__clear-button-wrapper"
|
|
850
784
|
}, hasValue && React__default["default"].createElement("div", {
|
|
@@ -864,15 +798,14 @@ var _excluded$3 = ["name", "onChange", "selectedValue", "multiple", "size"];
|
|
|
864
798
|
var SegmentedContext = /*#__PURE__*/React__default["default"].createContext(null);
|
|
865
799
|
var SegmentedProvider = function SegmentedProvider(_ref) {
|
|
866
800
|
var name = _ref.name,
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
|
|
872
|
-
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
801
|
+
_ref$onChange = _ref.onChange,
|
|
802
|
+
onChange = _ref$onChange === void 0 ? function () {
|
|
803
|
+
return undefined;
|
|
804
|
+
} : _ref$onChange,
|
|
805
|
+
selectedValue = _ref.selectedValue,
|
|
806
|
+
multiple = _ref.multiple,
|
|
807
|
+
size = _ref.size,
|
|
808
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
876
809
|
var generatedName = utils.useRandomId('eds-segmented-control');
|
|
877
810
|
var contextValue = React__default["default"].useMemo(function () {
|
|
878
811
|
return {
|
|
@@ -889,48 +822,40 @@ var SegmentedProvider = function SegmentedProvider(_ref) {
|
|
|
889
822
|
};
|
|
890
823
|
var useSegmentedContext = function useSegmentedContext() {
|
|
891
824
|
var context = React__default["default"].useContext(SegmentedContext);
|
|
892
|
-
|
|
893
825
|
if (!context) {
|
|
894
826
|
throw new Error('You need to wrap your SegmentedChoice in either SegmentedControl or MultipleSegmentedControl');
|
|
895
827
|
}
|
|
896
|
-
|
|
897
828
|
return context;
|
|
898
829
|
};
|
|
899
830
|
|
|
900
831
|
var _excluded$2 = ["children", "className", "style", "value", "name", "onChange"];
|
|
901
832
|
var SegmentedChoice = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
|
|
902
833
|
var children = _ref.children,
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
834
|
+
className = _ref.className,
|
|
835
|
+
style = _ref.style,
|
|
836
|
+
value = _ref.value,
|
|
837
|
+
name = _ref.name,
|
|
838
|
+
_ref$onChange = _ref.onChange,
|
|
839
|
+
onChange = _ref$onChange === void 0 ? function () {
|
|
840
|
+
return undefined;
|
|
841
|
+
} : _ref$onChange,
|
|
842
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
913
843
|
var _useSegmentedContext = useSegmentedContext(),
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
844
|
+
commonName = _useSegmentedContext.name,
|
|
845
|
+
selectedValue = _useSegmentedContext.selectedValue,
|
|
846
|
+
commonOnChange = _useSegmentedContext.onChange,
|
|
847
|
+
multiple = _useSegmentedContext.multiple,
|
|
848
|
+
size = _useSegmentedContext.size;
|
|
920
849
|
var isChecked = multiple ? selectedValue[value] : selectedValue === value;
|
|
921
|
-
|
|
922
850
|
var handleChange = function handleChange(e) {
|
|
923
851
|
onChange(e);
|
|
924
|
-
|
|
925
852
|
if (multiple) {
|
|
926
853
|
var _extends2;
|
|
927
|
-
|
|
928
854
|
commonOnChange(_extends({}, selectedValue, (_extends2 = {}, _extends2[value] = e.target.checked, _extends2)));
|
|
929
855
|
} else if (e.target.checked) {
|
|
930
856
|
commonOnChange(value);
|
|
931
857
|
}
|
|
932
858
|
};
|
|
933
|
-
|
|
934
859
|
return React__default["default"].createElement("label", {
|
|
935
860
|
className: classNames__default["default"]('eds-segmented-choice', className, {
|
|
936
861
|
'eds-segmented-choide--large': size === 'large'
|
|
@@ -953,15 +878,14 @@ var SegmentedChoice = /*#__PURE__*/React__default["default"].forwardRef(function
|
|
|
953
878
|
var _excluded$1 = ["children", "label", "name", "onChange", "selectedValue", "size", "className"];
|
|
954
879
|
var SegmentedControl = function SegmentedControl(_ref) {
|
|
955
880
|
var children = _ref.children,
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
|
|
962
|
-
|
|
963
|
-
|
|
964
|
-
|
|
881
|
+
label = _ref.label,
|
|
882
|
+
name = _ref.name,
|
|
883
|
+
onChange = _ref.onChange,
|
|
884
|
+
selectedValue = _ref.selectedValue,
|
|
885
|
+
_ref$size = _ref.size,
|
|
886
|
+
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
887
|
+
className = _ref.className,
|
|
888
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
965
889
|
return React__default["default"].createElement(SegmentedProvider, {
|
|
966
890
|
name: name,
|
|
967
891
|
selectedValue: selectedValue,
|
|
@@ -979,15 +903,13 @@ var _excluded = ["children", "label", "name", "onChange", "selectedValue"];
|
|
|
979
903
|
/**This component is not used by anyone, and is therefore deprecated
|
|
980
904
|
* @deprecated
|
|
981
905
|
*/
|
|
982
|
-
|
|
983
906
|
var MultipleSegmentedControl = function MultipleSegmentedControl(_ref) {
|
|
984
907
|
var children = _ref.children,
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
908
|
+
label = _ref.label,
|
|
909
|
+
name = _ref.name,
|
|
910
|
+
onChange = _ref.onChange,
|
|
911
|
+
selectedValue = _ref.selectedValue,
|
|
912
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
991
913
|
return React__default["default"].createElement(SegmentedProvider, {
|
|
992
914
|
name: name,
|
|
993
915
|
selectedValue: selectedValue,
|