@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
package/dist/form.esm.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { useRandomId, useOnMount, warnAboutMissingStyles } from '@entur/utils';
|
|
2
2
|
import { Tooltip } from '@entur/tooltip';
|
|
3
3
|
import classNames from 'classnames';
|
|
4
|
-
import
|
|
5
|
-
import
|
|
4
|
+
import * as React from 'react';
|
|
5
|
+
import React__default from 'react';
|
|
6
|
+
import { ValidationExclamationIcon, ValidationErrorIcon, ValidationCheckIcon, QuestionIcon, CheckIcon, CloseSmallIcon, TrainIcon, BusIcon, ScooterIcon, BicycleIcon, FerryIcon, TramIcon, PlaneIcon, SubwayIcon } from '@entur/icons';
|
|
6
7
|
import { SubLabel, Paragraph, Label } from '@entur/typography';
|
|
7
8
|
import { colors } from '@entur/tokens';
|
|
8
9
|
|
|
@@ -39,6 +40,8 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
39
40
|
return target;
|
|
40
41
|
}
|
|
41
42
|
|
|
43
|
+
var _excluded$f = ["children", "hideIcon", "variant", "className"];
|
|
44
|
+
|
|
42
45
|
var AlertIcon = function AlertIcon(_ref) {
|
|
43
46
|
var variant = _ref.variant;
|
|
44
47
|
var iconClass = "eds-feedback-text__icon eds-feedback-text__icon--" + variant;
|
|
@@ -73,9 +76,9 @@ var FeedbackText = function FeedbackText(_ref2) {
|
|
|
73
76
|
hideIcon = _ref2$hideIcon === void 0 ? false : _ref2$hideIcon,
|
|
74
77
|
variant = _ref2.variant,
|
|
75
78
|
className = _ref2.className,
|
|
76
|
-
rest = _objectWithoutPropertiesLoose(_ref2,
|
|
79
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded$f);
|
|
77
80
|
|
|
78
|
-
return React__default.createElement(SubLabel,
|
|
81
|
+
return React__default.createElement(SubLabel, _extends({
|
|
79
82
|
className: classNames('eds-feedback-text', {
|
|
80
83
|
'eds-feedback-text--info': variant === 'info'
|
|
81
84
|
}, className)
|
|
@@ -86,7 +89,7 @@ var FeedbackText = function FeedbackText(_ref2) {
|
|
|
86
89
|
}, children));
|
|
87
90
|
};
|
|
88
91
|
|
|
89
|
-
var InputGroupContext = /*#__PURE__*/createContext({
|
|
92
|
+
var InputGroupContext = /*#__PURE__*/React.createContext({
|
|
90
93
|
isFilled: false,
|
|
91
94
|
setFilled: function setFilled() {
|
|
92
95
|
return null;
|
|
@@ -95,11 +98,11 @@ var InputGroupContext = /*#__PURE__*/createContext({
|
|
|
95
98
|
var InputGroupContextProvider = function InputGroupContextProvider(_ref) {
|
|
96
99
|
var children = _ref.children;
|
|
97
100
|
|
|
98
|
-
var _React$useState = useState(false),
|
|
101
|
+
var _React$useState = React.useState(false),
|
|
99
102
|
filled = _React$useState[0],
|
|
100
103
|
setFilled = _React$useState[1];
|
|
101
104
|
|
|
102
|
-
return createElement(InputGroupContext.Provider, {
|
|
105
|
+
return React.createElement(InputGroupContext.Provider, {
|
|
103
106
|
value: {
|
|
104
107
|
isFilled: filled,
|
|
105
108
|
setFilled: setFilled
|
|
@@ -107,22 +110,23 @@ var InputGroupContextProvider = function InputGroupContextProvider(_ref) {
|
|
|
107
110
|
}, children);
|
|
108
111
|
};
|
|
109
112
|
var useInputGroupContext = function useInputGroupContext() {
|
|
110
|
-
return useContext(InputGroupContext);
|
|
113
|
+
return React.useContext(InputGroupContext);
|
|
111
114
|
};
|
|
112
115
|
|
|
116
|
+
var _excluded$e = ["label", "required", "labelId", "staticAnimation"];
|
|
113
117
|
var InputGroupLabel = function InputGroupLabel(_ref) {
|
|
114
118
|
var label = _ref.label,
|
|
115
119
|
required = _ref.required,
|
|
116
120
|
labelId = _ref.labelId,
|
|
117
121
|
_ref$staticAnimation = _ref.staticAnimation,
|
|
118
122
|
staticAnimation = _ref$staticAnimation === void 0 ? false : _ref$staticAnimation,
|
|
119
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
123
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$e);
|
|
120
124
|
|
|
121
125
|
var _useInputGroupContext = useInputGroupContext(),
|
|
122
126
|
isFilled = _useInputGroupContext.isFilled;
|
|
123
127
|
|
|
124
128
|
var filler = staticAnimation || isFilled;
|
|
125
|
-
return React__default.createElement("label",
|
|
129
|
+
return React__default.createElement("label", _extends({
|
|
126
130
|
className: classNames(rest.className, {
|
|
127
131
|
'eds-input-group-label-wrapper--filled': filler
|
|
128
132
|
}),
|
|
@@ -148,6 +152,7 @@ var useVariant = function useVariant() {
|
|
|
148
152
|
return context;
|
|
149
153
|
};
|
|
150
154
|
|
|
155
|
+
var _excluded$d = ["children", "className", "dark", "disabled", "readOnly", "variant", "prepend", "append", "size", "isFilled", "label", "required", "labelTooltip", "feedback", "labelId", "labelProps", "style", "disableLabelAnimation"];
|
|
151
156
|
var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
152
157
|
var children = _ref.children,
|
|
153
158
|
className = _ref.className,
|
|
@@ -172,11 +177,11 @@ var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
172
177
|
style = _ref.style,
|
|
173
178
|
_ref$disableLabelAnim = _ref.disableLabelAnimation,
|
|
174
179
|
disableLabelAnimation = _ref$disableLabelAnim === void 0 ? false : _ref$disableLabelAnim,
|
|
175
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
180
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
|
|
176
181
|
|
|
177
182
|
var contextVariant = useVariant();
|
|
178
183
|
var currentVariant = variant || contextVariant;
|
|
179
|
-
return React__default.createElement(InputGroupContextProvider, null, React__default.createElement("div",
|
|
184
|
+
return React__default.createElement(InputGroupContextProvider, null, React__default.createElement("div", _extends({
|
|
180
185
|
className: classNames('eds-form-control-wrapper', className, "eds-form-control-wrapper--size-" + size, {
|
|
181
186
|
'eds-form-control-wrapper--success': currentVariant === 'success',
|
|
182
187
|
'eds-form-control-wrapper--error': currentVariant === 'error',
|
|
@@ -189,7 +194,7 @@ var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
189
194
|
style: style
|
|
190
195
|
}, rest), prepend && React__default.createElement("div", {
|
|
191
196
|
className: "eds-form-control__prepend"
|
|
192
|
-
}, prepend), React__default.createElement(InputGroupLabel,
|
|
197
|
+
}, prepend), React__default.createElement(InputGroupLabel, _extends({
|
|
193
198
|
label: label,
|
|
194
199
|
required: required,
|
|
195
200
|
labelId: labelId,
|
|
@@ -208,6 +213,7 @@ var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
208
213
|
}, feedback));
|
|
209
214
|
});
|
|
210
215
|
|
|
216
|
+
var _excluded$c = ["checked", "className", "children", "style", "disabled", "reduceClickArea"];
|
|
211
217
|
var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
212
218
|
var checked = _ref.checked,
|
|
213
219
|
className = _ref.className,
|
|
@@ -216,7 +222,7 @@ var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
216
222
|
_ref$disabled = _ref.disabled,
|
|
217
223
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
218
224
|
reduceClickArea = _ref.reduceClickArea,
|
|
219
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
225
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$c);
|
|
220
226
|
|
|
221
227
|
// Trick to allow using a ref locally, while still allowing for ref forwarding
|
|
222
228
|
// Read more at https://reactjs.org/docs/hooks-reference.html#useimperativehandle
|
|
@@ -238,7 +244,7 @@ var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
238
244
|
'eds-checkbox__container--reduced-click-area': reduceClickArea
|
|
239
245
|
}),
|
|
240
246
|
style: style
|
|
241
|
-
}, React__default.createElement("input",
|
|
247
|
+
}, React__default.createElement("input", _extends({
|
|
242
248
|
type: "checkbox",
|
|
243
249
|
ref: innerRef,
|
|
244
250
|
checked: isControlled ? checked === true : undefined,
|
|
@@ -278,13 +284,14 @@ var CheckboxIcon = function CheckboxIcon(_ref2) {
|
|
|
278
284
|
}));
|
|
279
285
|
};
|
|
280
286
|
|
|
287
|
+
var _excluded$b = ["children", "className", "label"];
|
|
281
288
|
var Fieldset = function Fieldset(_ref) {
|
|
282
289
|
var children = _ref.children,
|
|
283
290
|
className = _ref.className,
|
|
284
291
|
label = _ref.label,
|
|
285
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
292
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$b);
|
|
286
293
|
|
|
287
|
-
return React__default.createElement("fieldset",
|
|
294
|
+
return React__default.createElement("fieldset", _extends({
|
|
288
295
|
className: classNames('eds-fieldset', className)
|
|
289
296
|
}, rest), label && React__default.createElement(Label, {
|
|
290
297
|
as: "legend",
|
|
@@ -304,12 +311,13 @@ var useRadioGroupContext = function useRadioGroupContext() {
|
|
|
304
311
|
return context;
|
|
305
312
|
};
|
|
306
313
|
|
|
314
|
+
var _excluded$a = ["className", "children", "value", "disabled"];
|
|
307
315
|
var Radio = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
308
316
|
var className = _ref.className,
|
|
309
317
|
children = _ref.children,
|
|
310
318
|
value = _ref.value,
|
|
311
319
|
disabled = _ref.disabled,
|
|
312
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
320
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$a);
|
|
313
321
|
|
|
314
322
|
var classList = classNames(className, 'eds-form-component--radio__radio', {
|
|
315
323
|
'eds-form-component--radio__radio--disabled': disabled
|
|
@@ -322,7 +330,7 @@ var Radio = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
322
330
|
|
|
323
331
|
return React__default.createElement("label", {
|
|
324
332
|
className: "eds-form-component--radio__container"
|
|
325
|
-
}, React__default.createElement("input",
|
|
333
|
+
}, React__default.createElement("input", _extends({
|
|
326
334
|
type: "radio",
|
|
327
335
|
name: name,
|
|
328
336
|
ref: ref,
|
|
@@ -341,13 +349,14 @@ var Radio = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
341
349
|
}, children));
|
|
342
350
|
});
|
|
343
351
|
|
|
352
|
+
var _excluded$9 = ["name", "value", "children", "onChange", "label"];
|
|
344
353
|
var RadioGroup = function RadioGroup(_ref) {
|
|
345
354
|
var name = _ref.name,
|
|
346
355
|
value = _ref.value,
|
|
347
356
|
children = _ref.children,
|
|
348
357
|
onChange = _ref.onChange,
|
|
349
358
|
label = _ref.label,
|
|
350
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
359
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$9);
|
|
351
360
|
|
|
352
361
|
var contextValue = React__default.useMemo(function () {
|
|
353
362
|
return {
|
|
@@ -358,11 +367,12 @@ var RadioGroup = function RadioGroup(_ref) {
|
|
|
358
367
|
}, [name, value, onChange]);
|
|
359
368
|
return React__default.createElement(RadioGroupContextProvider, {
|
|
360
369
|
value: contextValue
|
|
361
|
-
}, label ? React__default.createElement(Fieldset,
|
|
370
|
+
}, label ? React__default.createElement(Fieldset, _extends({
|
|
362
371
|
label: label
|
|
363
372
|
}, rest), children) : children);
|
|
364
373
|
};
|
|
365
374
|
|
|
375
|
+
var _excluded$8 = ["className", "children", "value", "title", "secondaryLabel", "size", "hideCheckbox", "style", "id", "disabled"];
|
|
366
376
|
var RadioPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
367
377
|
var className = _ref.className,
|
|
368
378
|
children = _ref.children,
|
|
@@ -377,7 +387,7 @@ var RadioPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
377
387
|
id = _ref.id,
|
|
378
388
|
_ref$disabled = _ref.disabled,
|
|
379
389
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
380
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
390
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
|
|
381
391
|
|
|
382
392
|
var classList = classNames(className, 'eds-radio-panel__container', "eds-radio-panel--" + size, {
|
|
383
393
|
'eds-radio-panel--disabled': disabled
|
|
@@ -393,7 +403,7 @@ var RadioPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
393
403
|
return React__default.createElement("label", {
|
|
394
404
|
className: "eds-radio-panel__wrapper",
|
|
395
405
|
htmlFor: radioPanelId
|
|
396
|
-
}, React__default.createElement("input",
|
|
406
|
+
}, React__default.createElement("input", _extends({
|
|
397
407
|
type: "radio",
|
|
398
408
|
name: name,
|
|
399
409
|
ref: ref,
|
|
@@ -431,24 +441,33 @@ var RadioPanelCheck = function RadioPanelCheck() {
|
|
|
431
441
|
}));
|
|
432
442
|
};
|
|
433
443
|
|
|
444
|
+
var _excluded$7 = ["className", "children", "labelPlacement", "icon", "hideIcon", "color", "contrastColor", "size"];
|
|
434
445
|
var Switch = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
435
446
|
var className = _ref.className,
|
|
436
447
|
children = _ref.children,
|
|
437
448
|
_ref$labelPlacement = _ref.labelPlacement,
|
|
438
449
|
labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
|
|
439
450
|
icon = _ref.icon,
|
|
451
|
+
_ref$hideIcon = _ref.hideIcon,
|
|
452
|
+
hideIcon = _ref$hideIcon === void 0 ? false : _ref$hideIcon,
|
|
440
453
|
_ref$color = _ref.color,
|
|
441
454
|
color = _ref$color === void 0 ? colors.validation.mintContrast : _ref$color,
|
|
442
455
|
contrastColor = _ref.contrastColor,
|
|
443
456
|
_ref$size = _ref.size,
|
|
444
457
|
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
445
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
458
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$7);
|
|
446
459
|
|
|
447
460
|
var chosenContrastColor = contrastColor && contrastColor || color;
|
|
461
|
+
|
|
462
|
+
var displayedIcon = function displayedIcon() {
|
|
463
|
+
if (icon) return icon;
|
|
464
|
+
return rest.checked ? React__default.createElement(CheckIcon, null) : React__default.createElement(CloseSmallIcon, null);
|
|
465
|
+
};
|
|
466
|
+
|
|
448
467
|
return React__default.createElement("label", {
|
|
449
468
|
className: classNames('eds-switch', "eds-switch--" + labelPlacement, className),
|
|
450
469
|
style: _extends({}, rest.style)
|
|
451
|
-
}, React__default.createElement("input",
|
|
470
|
+
}, React__default.createElement("input", _extends({
|
|
452
471
|
type: "checkbox",
|
|
453
472
|
ref: ref
|
|
454
473
|
}, rest)), React__default.createElement("span", {
|
|
@@ -459,11 +478,12 @@ var Switch = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
459
478
|
}
|
|
460
479
|
}, React__default.createElement("span", {
|
|
461
480
|
className: "eds-switch__circle"
|
|
462
|
-
},
|
|
481
|
+
}, !hideIcon && displayedIcon())), children && React__default.createElement("span", {
|
|
463
482
|
className: classNames('eds-switch__label', "eds-switch__label--" + size + "--" + labelPlacement)
|
|
464
483
|
}, children));
|
|
465
484
|
});
|
|
466
485
|
|
|
486
|
+
var _excluded$6 = ["className", "children", "labelPlacement", "transport", "size"];
|
|
467
487
|
var TravelSwitch = function TravelSwitch(_ref) {
|
|
468
488
|
var className = _ref.className,
|
|
469
489
|
children = _ref.children,
|
|
@@ -471,14 +491,14 @@ var TravelSwitch = function TravelSwitch(_ref) {
|
|
|
471
491
|
labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
|
|
472
492
|
transport = _ref.transport,
|
|
473
493
|
size = _ref.size,
|
|
474
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
494
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
475
495
|
|
|
476
496
|
var _modeCalc = modeCalc(transport),
|
|
477
497
|
color = _modeCalc.color,
|
|
478
498
|
contrast = _modeCalc.contrast,
|
|
479
499
|
Icon = _modeCalc.Icon;
|
|
480
500
|
|
|
481
|
-
return React__default.createElement(Switch,
|
|
501
|
+
return React__default.createElement(Switch, _extends({
|
|
482
502
|
className: className,
|
|
483
503
|
labelPlacement: labelPlacement,
|
|
484
504
|
color: color,
|
|
@@ -583,6 +603,8 @@ function isFilled(obj, SSR) {
|
|
|
583
603
|
return obj && (hasValue(obj.value) && obj.value !== '' || SSR && hasValue(obj.defaultValue) && obj.defaultValue !== '');
|
|
584
604
|
}
|
|
585
605
|
|
|
606
|
+
var _excluded$5 = ["variant", "disabled", "readOnly", "className", "style", "label", "feedback", "labelTooltip", "onChange", "disableLabelAnimation"],
|
|
607
|
+
_excluded2$1 = ["readOnly", "disabled", "onChange", "value"];
|
|
586
608
|
var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
587
609
|
var variant = _ref.variant,
|
|
588
610
|
_ref$disabled = _ref.disabled,
|
|
@@ -596,7 +618,7 @@ var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
596
618
|
labelTooltip = _ref.labelTooltip,
|
|
597
619
|
onChange = _ref.onChange,
|
|
598
620
|
disableLabelAnimation = _ref.disableLabelAnimation,
|
|
599
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
621
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
600
622
|
|
|
601
623
|
var textAreaId = useRandomId('eds-textarea');
|
|
602
624
|
return React__default.createElement(BaseFormControl, {
|
|
@@ -613,7 +635,7 @@ var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
613
635
|
className: 'eds-textarea__label'
|
|
614
636
|
},
|
|
615
637
|
disableLabelAnimation: disableLabelAnimation
|
|
616
|
-
}, React__default.createElement(TextAreaBase,
|
|
638
|
+
}, React__default.createElement(TextAreaBase, _extends({
|
|
617
639
|
readOnly: readOnly,
|
|
618
640
|
disabled: disabled,
|
|
619
641
|
ref: ref,
|
|
@@ -626,7 +648,7 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
|
|
|
626
648
|
disabled = _ref2.disabled,
|
|
627
649
|
onChange = _ref2.onChange,
|
|
628
650
|
value = _ref2.value,
|
|
629
|
-
rest = _objectWithoutPropertiesLoose(_ref2,
|
|
651
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
|
|
630
652
|
|
|
631
653
|
var _useInputGroupContext = useInputGroupContext(),
|
|
632
654
|
isInputFilled = _useInputGroupContext.isFilled,
|
|
@@ -655,7 +677,7 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
|
|
|
655
677
|
}
|
|
656
678
|
};
|
|
657
679
|
|
|
658
|
-
return React__default.createElement("textarea",
|
|
680
|
+
return React__default.createElement("textarea", _extends({
|
|
659
681
|
className: "eds-form-control eds-textarea",
|
|
660
682
|
ref: ref,
|
|
661
683
|
readOnly: readOnly,
|
|
@@ -665,6 +687,9 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
|
|
|
665
687
|
}, rest));
|
|
666
688
|
});
|
|
667
689
|
|
|
690
|
+
var _excluded$4 = ["prepend", "append", "variant", "disabled", "readOnly", "className", "style", "size", "label", "required", "labelTooltip", "feedback", "onChange", "disableLabelAnimation", "labelProps", "clearable", "onClear", "value"],
|
|
691
|
+
_excluded2 = ["disabled", "readOnly", "placeholder", "onChange", "value", "variant"],
|
|
692
|
+
_excluded3 = ["onClear"];
|
|
668
693
|
var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
669
694
|
var prepend = _ref.prepend,
|
|
670
695
|
append = _ref.append,
|
|
@@ -688,7 +713,7 @@ var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
688
713
|
clearable = _ref$clearable === void 0 ? false : _ref$clearable,
|
|
689
714
|
onClear = _ref.onClear,
|
|
690
715
|
value = _ref.value,
|
|
691
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
716
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
692
717
|
|
|
693
718
|
var textFieldId = labelProps && labelProps.id ? labelProps.id : useRandomId('eds-textfield');
|
|
694
719
|
return React__default.createElement(BaseFormControl, {
|
|
@@ -709,7 +734,7 @@ var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
709
734
|
feedback: feedback,
|
|
710
735
|
disableLabelAnimation: disableLabelAnimation,
|
|
711
736
|
labelProps: labelProps
|
|
712
|
-
}, React__default.createElement(TextFieldBase,
|
|
737
|
+
}, React__default.createElement(TextFieldBase, _extends({
|
|
713
738
|
disabled: disabled,
|
|
714
739
|
readOnly: readOnly,
|
|
715
740
|
ref: ref,
|
|
@@ -725,7 +750,7 @@ var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forw
|
|
|
725
750
|
onChange = _ref2.onChange,
|
|
726
751
|
value = _ref2.value,
|
|
727
752
|
variant = _ref2.variant,
|
|
728
|
-
rest = _objectWithoutPropertiesLoose(_ref2,
|
|
753
|
+
rest = _objectWithoutPropertiesLoose(_ref2, _excluded2);
|
|
729
754
|
|
|
730
755
|
var contextVariant = useVariant();
|
|
731
756
|
var currentVariant = variant || contextVariant;
|
|
@@ -757,7 +782,7 @@ var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forw
|
|
|
757
782
|
}
|
|
758
783
|
};
|
|
759
784
|
|
|
760
|
-
return React__default.createElement("input",
|
|
785
|
+
return React__default.createElement("input", _extends({
|
|
761
786
|
"aria-invalid": currentVariant === 'error',
|
|
762
787
|
className: "eds-form-control",
|
|
763
788
|
disabled: disabled,
|
|
@@ -771,7 +796,7 @@ var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forw
|
|
|
771
796
|
|
|
772
797
|
var ClearButton = function ClearButton(_ref3) {
|
|
773
798
|
var onClear = _ref3.onClear,
|
|
774
|
-
props = _objectWithoutPropertiesLoose(_ref3,
|
|
799
|
+
props = _objectWithoutPropertiesLoose(_ref3, _excluded3);
|
|
775
800
|
|
|
776
801
|
var _useInputGroupContext2 = useInputGroupContext(),
|
|
777
802
|
hasValue = _useInputGroupContext2.isFilled,
|
|
@@ -781,7 +806,7 @@ var ClearButton = function ClearButton(_ref3) {
|
|
|
781
806
|
className: "eds-textfield__clear-button-wrapper"
|
|
782
807
|
}, hasValue && React__default.createElement("div", {
|
|
783
808
|
className: "eds-textfield__divider"
|
|
784
|
-
}), hasValue && React__default.createElement("button",
|
|
809
|
+
}), hasValue && React__default.createElement("button", _extends({
|
|
785
810
|
className: "eds-textfield__clear-button",
|
|
786
811
|
type: "button",
|
|
787
812
|
tabIndex: -1,
|
|
@@ -792,6 +817,7 @@ var ClearButton = function ClearButton(_ref3) {
|
|
|
792
817
|
}, props), React__default.createElement(CloseSmallIcon, null)));
|
|
793
818
|
};
|
|
794
819
|
|
|
820
|
+
var _excluded$3 = ["name", "onChange", "selectedValue", "multiple", "size"];
|
|
795
821
|
var SegmentedContext = /*#__PURE__*/React__default.createContext(null);
|
|
796
822
|
var SegmentedProvider = function SegmentedProvider(_ref) {
|
|
797
823
|
var name = _ref.name,
|
|
@@ -800,7 +826,7 @@ var SegmentedProvider = function SegmentedProvider(_ref) {
|
|
|
800
826
|
selectedValue = _ref.selectedValue,
|
|
801
827
|
multiple = _ref.multiple,
|
|
802
828
|
size = _ref.size,
|
|
803
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
829
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
804
830
|
|
|
805
831
|
var generatedName = useRandomId('eds-segmented-control');
|
|
806
832
|
var contextValue = React__default.useMemo(function () {
|
|
@@ -812,7 +838,7 @@ var SegmentedProvider = function SegmentedProvider(_ref) {
|
|
|
812
838
|
size: size
|
|
813
839
|
};
|
|
814
840
|
}, [generatedName, multiple, name, onChange, selectedValue, size]);
|
|
815
|
-
return React__default.createElement(SegmentedContext.Provider,
|
|
841
|
+
return React__default.createElement(SegmentedContext.Provider, _extends({
|
|
816
842
|
value: contextValue
|
|
817
843
|
}, rest));
|
|
818
844
|
};
|
|
@@ -826,6 +852,7 @@ var useSegmentedContext = function useSegmentedContext() {
|
|
|
826
852
|
return context;
|
|
827
853
|
};
|
|
828
854
|
|
|
855
|
+
var _excluded$2 = ["children", "className", "style", "value", "name", "onChange"];
|
|
829
856
|
var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
830
857
|
var children = _ref.children,
|
|
831
858
|
className = _ref.className,
|
|
@@ -834,7 +861,7 @@ var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
834
861
|
name = _ref.name,
|
|
835
862
|
_ref$onChange = _ref.onChange,
|
|
836
863
|
onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
|
|
837
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
864
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
838
865
|
|
|
839
866
|
var _useSegmentedContext = useSegmentedContext(),
|
|
840
867
|
commonName = _useSegmentedContext.name,
|
|
@@ -862,7 +889,7 @@ var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
862
889
|
'eds-segmented-choide--large': size === 'large'
|
|
863
890
|
}),
|
|
864
891
|
style: style
|
|
865
|
-
}, React__default.createElement("input",
|
|
892
|
+
}, React__default.createElement("input", _extends({
|
|
866
893
|
type: multiple ? 'checkbox' : 'radio',
|
|
867
894
|
name: name || commonName,
|
|
868
895
|
checked: isChecked,
|
|
@@ -876,6 +903,7 @@ var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
|
876
903
|
}, children));
|
|
877
904
|
});
|
|
878
905
|
|
|
906
|
+
var _excluded$1 = ["children", "label", "name", "onChange", "selectedValue", "size", "className"];
|
|
879
907
|
var SegmentedControl = function SegmentedControl(_ref) {
|
|
880
908
|
var children = _ref.children,
|
|
881
909
|
label = _ref.label,
|
|
@@ -885,7 +913,7 @@ var SegmentedControl = function SegmentedControl(_ref) {
|
|
|
885
913
|
_ref$size = _ref.size,
|
|
886
914
|
size = _ref$size === void 0 ? 'medium' : _ref$size,
|
|
887
915
|
className = _ref.className,
|
|
888
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
916
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
889
917
|
|
|
890
918
|
return React__default.createElement(SegmentedProvider, {
|
|
891
919
|
name: name,
|
|
@@ -895,11 +923,12 @@ var SegmentedControl = function SegmentedControl(_ref) {
|
|
|
895
923
|
size: size
|
|
896
924
|
}, React__default.createElement(Label, {
|
|
897
925
|
as: "div"
|
|
898
|
-
}, label), React__default.createElement("div",
|
|
926
|
+
}, label), React__default.createElement("div", _extends({
|
|
899
927
|
className: classNames('eds-segmented-control', className)
|
|
900
928
|
}, rest), children));
|
|
901
929
|
};
|
|
902
930
|
|
|
931
|
+
var _excluded = ["children", "label", "name", "onChange", "selectedValue"];
|
|
903
932
|
/**This component is not used by anyone, and is therefore deprecated
|
|
904
933
|
* @deprecated
|
|
905
934
|
*/
|
|
@@ -910,7 +939,7 @@ var MultipleSegmentedControl = function MultipleSegmentedControl(_ref) {
|
|
|
910
939
|
name = _ref.name,
|
|
911
940
|
onChange = _ref.onChange,
|
|
912
941
|
selectedValue = _ref.selectedValue,
|
|
913
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
942
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
914
943
|
|
|
915
944
|
return React__default.createElement(SegmentedProvider, {
|
|
916
945
|
name: name,
|
|
@@ -920,7 +949,7 @@ var MultipleSegmentedControl = function MultipleSegmentedControl(_ref) {
|
|
|
920
949
|
size: "medium"
|
|
921
950
|
}, React__default.createElement(Label, {
|
|
922
951
|
as: "div"
|
|
923
|
-
}, label), React__default.createElement("div",
|
|
952
|
+
}, label), React__default.createElement("div", _extends({
|
|
924
953
|
className: "eds-segmented-control"
|
|
925
954
|
}, rest), children));
|
|
926
955
|
};
|