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