@entur/form 5.4.11 → 5.4.13

package/dist/form.esm.js

@@ -11,59 +11,73 @@ function _extends() {
   _extends = Object.assign || function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
+
       for (var key in source) {
         if (Object.prototype.hasOwnProperty.call(source, key)) {
           target[key] = source[key];
         }
       }
     }
+
     return target;
   };
+
   return _extends.apply(this, arguments);
 }
+
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null) return {};
   var target = {};
   var sourceKeys = Object.keys(source);
   var key, i;
+
   for (i = 0; i < sourceKeys.length; i++) {
     key = sourceKeys[i];
     if (excluded.indexOf(key) >= 0) continue;
     target[key] = source[key];
   }
+
   return target;
 }
 
 var _excluded$f = ["children", "hideIcon", "variant", "className"];
+
 var AlertIcon = function AlertIcon(_ref) {
   var variant = _ref.variant;
   var iconClass = "eds-feedback-text__icon eds-feedback-text__icon--" + variant;
+
   switch (variant) {
     case 'success':
       return React__default.createElement(ValidationCheckIcon, {
         className: iconClass
       });
+
     case 'error':
       return React__default.createElement(ValidationErrorIcon, {
         className: iconClass
       });
+
     case 'info':
       return null;
+
     case 'warning':
       return React__default.createElement(ValidationExclamationIcon, {
         className: iconClass
       });
+
     default:
       return null;
   }
 };
+
 var FeedbackText = function FeedbackText(_ref2) {
   var children = _ref2.children,
-    _ref2$hideIcon = _ref2.hideIcon,
-    hideIcon = _ref2$hideIcon === void 0 ? false : _ref2$hideIcon,
-    variant = _ref2.variant,
-    className = _ref2.className,
-    rest = _objectWithoutPropertiesLoose(_ref2, _excluded$f);
+      _ref2$hideIcon = _ref2.hideIcon,
+      hideIcon = _ref2$hideIcon === void 0 ? false : _ref2$hideIcon,
+      variant = _ref2.variant,
+      className = _ref2.className,
+      rest = _objectWithoutPropertiesLoose(_ref2, _excluded$f);
+
   return React__default.createElement(SubLabel, _extends({
     className: classNames('eds-feedback-text', {
       'eds-feedback-text--info': variant === 'info'
@@ -83,9 +97,11 @@ var InputGroupContext = /*#__PURE__*/React.createContext({
 });
 var InputGroupContextProvider = function InputGroupContextProvider(_ref) {
   var children = _ref.children;
+
   var _React$useState = React.useState(false),
-    filled = _React$useState[0],
-    setFilled = _React$useState[1];
+      filled = _React$useState[0],
+      setFilled = _React$useState[1];
+
   return React.createElement(InputGroupContext.Provider, {
     value: {
       isFilled: filled,
@@ -100,13 +116,15 @@ var useInputGroupContext = function useInputGroupContext() {
 var _excluded$e = ["label", "required", "labelId", "staticAnimation"];
 var InputGroupLabel = function InputGroupLabel(_ref) {
   var label = _ref.label,
-    required = _ref.required,
-    labelId = _ref.labelId,
-    _ref$staticAnimation = _ref.staticAnimation,
-    staticAnimation = _ref$staticAnimation === void 0 ? false : _ref$staticAnimation,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$e);
+      required = _ref.required,
+      labelId = _ref.labelId,
+      _ref$staticAnimation = _ref.staticAnimation,
+      staticAnimation = _ref$staticAnimation === void 0 ? false : _ref$staticAnimation,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$e);
+
   var _useInputGroupContext = useInputGroupContext(),
-    isFilled = _useInputGroupContext.isFilled;
+      isFilled = _useInputGroupContext.isFilled;
+
   var filler = staticAnimation || isFilled;
   return React__default.createElement("label", _extends({
     className: classNames(rest.className, {
@@ -123,8 +141,8 @@ var InputGroupLabel = function InputGroupLabel(_ref) {
 var VariantContext = /*#__PURE__*/React__default.createContext(null);
 var VariantProvider = function VariantProvider(_ref) {
   var children = _ref.children,
-    _ref$variant = _ref.variant,
-    variant = _ref$variant === void 0 ? null : _ref$variant;
+      _ref$variant = _ref.variant,
+      variant = _ref$variant === void 0 ? null : _ref$variant;
   return React__default.createElement(VariantContext.Provider, {
     value: variant
   }, children);
@@ -137,31 +155,32 @@ var useVariant = function useVariant() {
 var _excluded$d = ["children", "className", "dark", "disabled", "readOnly", "variant", "prepend", "append", "size", "isFilled", "label", "required", "labelTooltip", "feedback", "labelId", "labelProps", "style", "disableLabelAnimation", "ariaAlertOnFeedback"];
 var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var children = _ref.children,
-    className = _ref.className,
-    _ref$dark = _ref.dark,
-    dark = _ref$dark === void 0 ? false : _ref$dark,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$readOnly = _ref.readOnly,
-    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
-    variant = _ref.variant,
-    prepend = _ref.prepend,
-    append = _ref.append,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'medium' : _ref$size,
-    isFilled = _ref.isFilled,
-    label = _ref.label,
-    required = _ref.required,
-    labelTooltip = _ref.labelTooltip,
-    feedback = _ref.feedback,
-    labelId = _ref.labelId,
-    labelProps = _ref.labelProps,
-    style = _ref.style,
-    _ref$disableLabelAnim = _ref.disableLabelAnimation,
-    disableLabelAnimation = _ref$disableLabelAnim === void 0 ? false : _ref$disableLabelAnim,
-    _ref$ariaAlertOnFeedb = _ref.ariaAlertOnFeedback,
-    ariaAlertOnFeedback = _ref$ariaAlertOnFeedb === void 0 ? false : _ref$ariaAlertOnFeedb,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
+      className = _ref.className,
+      _ref$dark = _ref.dark,
+      dark = _ref$dark === void 0 ? false : _ref$dark,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
+      variant = _ref.variant,
+      prepend = _ref.prepend,
+      append = _ref.append,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'medium' : _ref$size,
+      isFilled = _ref.isFilled,
+      label = _ref.label,
+      required = _ref.required,
+      labelTooltip = _ref.labelTooltip,
+      feedback = _ref.feedback,
+      labelId = _ref.labelId,
+      labelProps = _ref.labelProps,
+      style = _ref.style,
+      _ref$disableLabelAnim = _ref.disableLabelAnimation,
+      disableLabelAnimation = _ref$disableLabelAnim === void 0 ? false : _ref$disableLabelAnim,
+      _ref$ariaAlertOnFeedb = _ref.ariaAlertOnFeedback,
+      ariaAlertOnFeedback = _ref$ariaAlertOnFeedb === void 0 ? false : _ref$ariaAlertOnFeedb,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
+
   var contextVariant = useVariant();
   var currentVariant = variant || contextVariant;
   return React__default.createElement(InputGroupContextProvider, null, React__default.createElement("div", _extends({
@@ -200,17 +219,18 @@ var BaseFormControl = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
 var _excluded$c = ["checked", "className", "children", "style", "disabled", "reduceClickArea"];
 var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var checked = _ref.checked,
-    className = _ref.className,
-    children = _ref.children,
-    style = _ref.style,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    reduceClickArea = _ref.reduceClickArea,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$c);
+      className = _ref.className,
+      children = _ref.children,
+      style = _ref.style,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      reduceClickArea = _ref.reduceClickArea,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$c);
+
   // Trick to allow using a ref locally, while still allowing for ref forwarding
   // Read more at https://reactjs.org/docs/hooks-reference.html#useimperativehandle
-  var innerRef = React__default.useRef(null);
-  //eslint-disable-next-line
+  var innerRef = React__default.useRef(null); //eslint-disable-next-line
+
   React__default.useImperativeHandle(ref, function () {
     return innerRef.current;
   });
@@ -245,9 +265,10 @@ var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     as: "span"
   }, children));
 });
+
 var CheckboxIcon = function CheckboxIcon(_ref2) {
   var _ref2$indeterminate = _ref2.indeterminate,
-    indeterminate = _ref2$indeterminate === void 0 ? false : _ref2$indeterminate;
+      indeterminate = _ref2$indeterminate === void 0 ? false : _ref2$indeterminate;
   return React__default.createElement("svg", {
     className: "eds-checkbox-icon",
     width: "11px",
@@ -269,9 +290,10 @@ var CheckboxIcon = function CheckboxIcon(_ref2) {
 var _excluded$b = ["children", "className", "label"];
 var Fieldset = function Fieldset(_ref) {
   var children = _ref.children,
-    className = _ref.className,
-    label = _ref.label,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$b);
+      className = _ref.className,
+      label = _ref.label,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$b);
+
   return React__default.createElement("fieldset", _extends({
     className: classNames('eds-fieldset', className)
   }, rest), label && React__default.createElement(Label, {
@@ -284,26 +306,31 @@ var RadioGroupContext = /*#__PURE__*/React__default.createContext(null);
 var RadioGroupContextProvider = RadioGroupContext.Provider;
 var useRadioGroupContext = function useRadioGroupContext() {
   var context = React__default.useContext(RadioGroupContext);
+
   if (!context) {
     throw new Error('You need to wrap your RadioButtons in a RadioGroup component');
   }
+
   return context;
 };
 
 var _excluded$a = ["className", "children", "value", "disabled"];
 var Radio = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var className = _ref.className,
-    children = _ref.children,
-    value = _ref.value,
-    disabled = _ref.disabled,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$a);
+      children = _ref.children,
+      value = _ref.value,
+      disabled = _ref.disabled,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$a);
+
   var classList = classNames(className, 'eds-form-component--radio__radio', {
     'eds-form-component--radio__radio--disabled': disabled
   });
+
   var _useRadioGroupContext = useRadioGroupContext(),
-    name = _useRadioGroupContext.name,
-    selectedValue = _useRadioGroupContext.value,
-    onChange = _useRadioGroupContext.onChange;
+      name = _useRadioGroupContext.name,
+      selectedValue = _useRadioGroupContext.value,
+      onChange = _useRadioGroupContext.onChange;
+
   return React__default.createElement("label", {
     className: "eds-form-component--radio__container"
   }, React__default.createElement("input", _extends({
@@ -328,11 +355,12 @@ var Radio = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
 var _excluded$9 = ["name", "value", "children", "onChange", "label"];
 var RadioGroup = function RadioGroup(_ref) {
   var name = _ref.name,
-    value = _ref.value,
-    children = _ref.children,
-    onChange = _ref.onChange,
-    label = _ref.label,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$9);
+      value = _ref.value,
+      children = _ref.children,
+      onChange = _ref.onChange,
+      label = _ref.label,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$9);
+
   var contextValue = React__default.useMemo(function () {
     return {
       name: name,
@@ -350,26 +378,29 @@ var RadioGroup = function RadioGroup(_ref) {
 var _excluded$8 = ["className", "children", "value", "title", "secondaryLabel", "size", "hideCheckbox", "style", "id", "disabled"];
 var RadioPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var className = _ref.className,
-    children = _ref.children,
-    value = _ref.value,
-    title = _ref.title,
-    secondaryLabel = _ref.secondaryLabel,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'medium' : _ref$size,
-    _ref$hideCheckbox = _ref.hideCheckbox,
-    hideCheckbox = _ref$hideCheckbox === void 0 ? false : _ref$hideCheckbox,
-    style = _ref.style,
-    id = _ref.id,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
+      children = _ref.children,
+      value = _ref.value,
+      title = _ref.title,
+      secondaryLabel = _ref.secondaryLabel,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'medium' : _ref$size,
+      _ref$hideCheckbox = _ref.hideCheckbox,
+      hideCheckbox = _ref$hideCheckbox === void 0 ? false : _ref$hideCheckbox,
+      style = _ref.style,
+      id = _ref.id,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
+
   var classList = classNames(className, 'eds-radio-panel__container', "eds-radio-panel--" + size, {
     'eds-radio-panel--disabled': disabled
   });
+
   var _useRadioGroupContext = useRadioGroupContext(),
-    name = _useRadioGroupContext.name,
-    selectedValue = _useRadioGroupContext.value,
-    onChange = _useRadioGroupContext.onChange;
+      name = _useRadioGroupContext.name,
+      selectedValue = _useRadioGroupContext.value,
+      onChange = _useRadioGroupContext.onChange;
+
   var randomId = useRandomId('eds-radiopanel');
   var radioPanelId = id || randomId;
   return React__default.createElement("label", {
@@ -399,6 +430,7 @@ var RadioPanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     className: "eds-radio-panel__additional-content"
   }, children)));
 });
+
 var RadioPanelCheck = function RadioPanelCheck() {
   return React__default.createElement("svg", {
     className: "eds-checkbox-icon",
@@ -415,23 +447,26 @@ var RadioPanelCheck = function RadioPanelCheck() {
 var _excluded$7 = ["className", "children", "labelPlacement", "icon", "hideIcon", "color", "contrastColor", "size"];
 var Switch = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var className = _ref.className,
-    children = _ref.children,
-    _ref$labelPlacement = _ref.labelPlacement,
-    labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
-    icon = _ref.icon,
-    _ref$hideIcon = _ref.hideIcon,
-    hideIcon = _ref$hideIcon === void 0 ? false : _ref$hideIcon,
-    _ref$color = _ref.color,
-    color = _ref$color === void 0 ? colors.validation.mintContrast : _ref$color,
-    contrastColor = _ref.contrastColor,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'medium' : _ref$size,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$7);
+      children = _ref.children,
+      _ref$labelPlacement = _ref.labelPlacement,
+      labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
+      icon = _ref.icon,
+      _ref$hideIcon = _ref.hideIcon,
+      hideIcon = _ref$hideIcon === void 0 ? false : _ref$hideIcon,
+      _ref$color = _ref.color,
+      color = _ref$color === void 0 ? colors.validation.mintContrast : _ref$color,
+      contrastColor = _ref.contrastColor,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'medium' : _ref$size,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$7);
+
   var chosenContrastColor = contrastColor && contrastColor || color;
+
   var displayedIcon = function displayedIcon() {
     if (icon) return icon;
     return rest.checked ? React__default.createElement(CheckIcon, null) : React__default.createElement(CloseSmallIcon, null);
   };
+
   return React__default.createElement("label", {
     className: classNames('eds-switch', "eds-switch--" + labelPlacement, className),
     style: _extends({}, rest.style)
@@ -454,16 +489,18 @@ var Switch = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
 var _excluded$6 = ["className", "children", "labelPlacement", "transport", "size"];
 var TravelSwitch = function TravelSwitch(_ref) {
   var className = _ref.className,
-    children = _ref.children,
-    _ref$labelPlacement = _ref.labelPlacement,
-    labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
-    transport = _ref.transport,
-    size = _ref.size,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
+      children = _ref.children,
+      _ref$labelPlacement = _ref.labelPlacement,
+      labelPlacement = _ref$labelPlacement === void 0 ? 'right' : _ref$labelPlacement,
+      transport = _ref.transport,
+      size = _ref.size,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
+
   var _modeCalc = modeCalc(transport),
-    color = _modeCalc.color,
-    contrast = _modeCalc.contrast,
-    Icon = _modeCalc.Icon;
+      color = _modeCalc.color,
+      contrast = _modeCalc.contrast,
+      Icon = _modeCalc.Icon;
+
   return React__default.createElement(Switch, _extends({
     className: className,
     labelPlacement: labelPlacement,
@@ -473,6 +510,7 @@ var TravelSwitch = function TravelSwitch(_ref) {
     size: size
   }, rest), children);
 };
+
 function modeCalc(mode) {
   switch (mode) {
     case 'bus':
@@ -481,60 +519,70 @@ function modeCalc(mode) {
         color: colors.transport["default"].bus,
         contrast: colors.transport.contrast.bus
       };
+
     case 'metro':
       return {
         Icon: SubwayIcon,
         color: colors.transport["default"].metro,
         contrast: colors.transport.contrast.metro
       };
+
     case 'air':
       return {
         Icon: PlaneIcon,
         color: colors.transport["default"].plane,
         contrast: colors.transport.contrast.plane
       };
+
     case 'tram':
       return {
         Icon: TramIcon,
         color: colors.transport["default"].tram,
         contrast: colors.transport.contrast.tram
       };
+
     case 'rail':
       return {
         Icon: TrainIcon,
         color: colors.transport["default"].train,
         contrast: colors.transport.contrast.train
       };
+
     case 'water':
       return {
         Icon: FerryIcon,
         color: colors.transport["default"].ferry,
         contrast: colors.transport.contrast.ferry
       };
+
     case 'bike':
       return {
         Icon: BicycleIcon,
         color: colors.transport["default"].mobility,
         contrast: colors.transport.contrast.mobility
       };
+
     case 'scooter':
       return {
         Icon: ScooterIcon,
         color: colors.transport["default"].mobility,
         contrast: colors.transport.contrast.mobility
       };
+
     case 'airportLinkBus':
       return {
         Icon: BusIcon,
         color: colors.transport["default"].plane,
         contrast: colors.transport.contrast.plane
       };
+
     case 'airportLinkRail':
       return {
         Icon: TrainIcon,
         color: colors.transport["default"].plane,
         contrast: colors.transport.contrast.plane
       };
+
     default:
       throw Error('Please select a transport for the TravelSwitch.');
   }
@@ -543,8 +591,7 @@ function modeCalc(mode) {
 // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types -- disabled during Yarn upgrade
 function hasValue(value) {
   return value != null && !(Array.isArray(value) && value.length === 0);
-}
-// Determine if field is empty or filled.
+} // Determine if field is empty or filled.
 // Response determines if label is presented above field or as placeholder.
 //
 // @param obj
@@ -552,29 +599,32 @@ function hasValue(value) {
 // @returns {boolean} False when not present or empty string.
 //                    True when any number or string with length.
 // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types -- disabled during Yarn upgrade
+
 function isFilled(obj, SSR) {
   if (SSR === void 0) {
     SSR = false;
   }
+
   return obj && (hasValue(obj.value) && obj.value !== '' || SSR && hasValue(obj.defaultValue) && obj.defaultValue !== '');
 }
 
 var _excluded$5 = ["variant", "disabled", "readOnly", "className", "style", "label", "feedback", "labelTooltip", "onChange", "disableLabelAnimation"],
-  _excluded2$1 = ["readOnly", "disabled", "onChange", "value", "variant"];
+    _excluded2$1 = ["readOnly", "disabled", "onChange", "value", "variant"];
 var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var variant = _ref.variant,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$readOnly = _ref.readOnly,
-    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
-    className = _ref.className,
-    style = _ref.style,
-    label = _ref.label,
-    feedback = _ref.feedback,
-    labelTooltip = _ref.labelTooltip,
-    onChange = _ref.onChange,
-    disableLabelAnimation = _ref.disableLabelAnimation,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
+      className = _ref.className,
+      style = _ref.style,
+      label = _ref.label,
+      feedback = _ref.feedback,
+      labelTooltip = _ref.labelTooltip,
+      onChange = _ref.onChange,
+      disableLabelAnimation = _ref.disableLabelAnimation,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
+
   var textAreaId = useRandomId('eds-textarea');
   return React__default.createElement(BaseFormControl, {
     className: className,
@@ -601,16 +651,19 @@ var TextArea = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
 });
 var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
   var readOnly = _ref2.readOnly,
-    disabled = _ref2.disabled,
-    onChange = _ref2.onChange,
-    value = _ref2.value,
-    variant = _ref2.variant,
-    rest = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
+      disabled = _ref2.disabled,
+      onChange = _ref2.onChange,
+      value = _ref2.value,
+      variant = _ref2.variant,
+      rest = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
+
   var contextVariant = useVariant();
   var currentVariant = variant || contextVariant;
+
   var _useInputGroupContext = useInputGroupContext(),
-    isInputFilled = _useInputGroupContext.isFilled,
-    setFiller = _useInputGroupContext.setFilled;
+      isInputFilled = _useInputGroupContext.isFilled,
+      setFiller = _useInputGroupContext.setFilled;
+
   useOnMount(function () {
     if (value || rest.defaultValue) {
       setFiller && !isInputFilled && setFiller(true);
@@ -621,16 +674,19 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
       setFiller(true);
     }
   }, [value, setFiller, isInputFilled]);
+
   var handleChange = function handleChange(event) {
     if (isFilled(event.target)) {
       setFiller && !isInputFilled && setFiller(true);
     } else {
       setFiller && isInputFilled && setFiller(false);
     }
+
     if (onChange) {
       onChange(event);
     }
   };
+
   return React__default.createElement("textarea", _extends({
     className: "eds-form-control eds-textarea",
     ref: ref,
@@ -643,34 +699,35 @@ var TextAreaBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref)
 });
 
 var _excluded$4 = ["prepend", "append", "variant", "disabled", "readOnly", "className", "style", "size", "label", "required", "labelTooltip", "feedback", "onChange", "disableLabelAnimation", "labelProps", "clearable", "onClear", "value", "ariaAlertOnFeedback"],
-  _excluded2 = ["disabled", "readOnly", "placeholder", "onChange", "value", "variant"],
-  _excluded3 = ["onClear"];
+    _excluded2 = ["disabled", "readOnly", "placeholder", "onChange", "value", "variant"],
+    _excluded3 = ["onClear"];
 var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var prepend = _ref.prepend,
-    append = _ref.append,
-    variant = _ref.variant,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$readOnly = _ref.readOnly,
-    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
-    className = _ref.className,
-    style = _ref.style,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'medium' : _ref$size,
-    label = _ref.label,
-    required = _ref.required,
-    labelTooltip = _ref.labelTooltip,
-    feedback = _ref.feedback,
-    onChange = _ref.onChange,
-    disableLabelAnimation = _ref.disableLabelAnimation,
-    labelProps = _ref.labelProps,
-    _ref$clearable = _ref.clearable,
-    clearable = _ref$clearable === void 0 ? false : _ref$clearable,
-    onClear = _ref.onClear,
-    value = _ref.value,
-    _ref$ariaAlertOnFeedb = _ref.ariaAlertOnFeedback,
-    ariaAlertOnFeedback = _ref$ariaAlertOnFeedb === void 0 ? false : _ref$ariaAlertOnFeedb,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
+      append = _ref.append,
+      variant = _ref.variant,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$readOnly = _ref.readOnly,
+      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
+      className = _ref.className,
+      style = _ref.style,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'medium' : _ref$size,
+      label = _ref.label,
+      required = _ref.required,
+      labelTooltip = _ref.labelTooltip,
+      feedback = _ref.feedback,
+      onChange = _ref.onChange,
+      disableLabelAnimation = _ref.disableLabelAnimation,
+      labelProps = _ref.labelProps,
+      _ref$clearable = _ref.clearable,
+      clearable = _ref$clearable === void 0 ? false : _ref$clearable,
+      onClear = _ref.onClear,
+      value = _ref.value,
+      _ref$ariaAlertOnFeedb = _ref.ariaAlertOnFeedback,
+      ariaAlertOnFeedback = _ref$ariaAlertOnFeedb === void 0 ? false : _ref$ariaAlertOnFeedb,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
+
   var randomId = useRandomId('eds-textfield');
   var textFieldId = labelProps && labelProps.id ? labelProps.id : randomId;
   return React__default.createElement(BaseFormControl, {
@@ -704,17 +761,20 @@ var TextField = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
 });
 var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forwardRef) {
   var disabled = _ref2.disabled,
-    readOnly = _ref2.readOnly,
-    placeholder = _ref2.placeholder,
-    onChange = _ref2.onChange,
-    value = _ref2.value,
-    variant = _ref2.variant,
-    rest = _objectWithoutPropertiesLoose(_ref2, _excluded2);
+      readOnly = _ref2.readOnly,
+      placeholder = _ref2.placeholder,
+      onChange = _ref2.onChange,
+      value = _ref2.value,
+      variant = _ref2.variant,
+      rest = _objectWithoutPropertiesLoose(_ref2, _excluded2);
+
   var contextVariant = useVariant();
   var currentVariant = variant || contextVariant;
+
   var _useInputGroupContext = useInputGroupContext(),
-    isInputFilled = _useInputGroupContext.isFilled,
-    setFiller = _useInputGroupContext.setFilled;
+      isInputFilled = _useInputGroupContext.isFilled,
+      setFiller = _useInputGroupContext.setFilled;
+
   useOnMount(function () {
     if (value || rest.defaultValue) {
       setFiller && !isInputFilled && setFiller(true);
@@ -725,16 +785,19 @@ var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forw
       setFiller(true);
     }
   }, [value, setFiller, isInputFilled]);
+
   var handleChange = function handleChange(event) {
     if (isFilled(event.target)) {
       setFiller && !isInputFilled && setFiller(true);
     } else {
       setFiller && isInputFilled && setFiller(false);
     }
+
     if (onChange) {
       onChange(event);
     }
   };
+
   return React__default.createElement("input", _extends({
     "aria-invalid": currentVariant === 'error',
     className: "eds-form-control",
@@ -746,12 +809,15 @@ var TextFieldBase = /*#__PURE__*/React__default.forwardRef(function (_ref2, forw
     value: value
   }, rest));
 });
+
 var ClearButton = function ClearButton(_ref3) {
   var onClear = _ref3.onClear,
-    props = _objectWithoutPropertiesLoose(_ref3, _excluded3);
+      props = _objectWithoutPropertiesLoose(_ref3, _excluded3);
+
   var _useInputGroupContext2 = useInputGroupContext(),
-    hasValue = _useInputGroupContext2.isFilled,
-    setFilled = _useInputGroupContext2.setFilled;
+      hasValue = _useInputGroupContext2.isFilled,
+      setFilled = _useInputGroupContext2.setFilled;
+
   return React__default.createElement("div", {
     className: "eds-textfield__clear-button-wrapper"
   }, hasValue && React__default.createElement("div", {
@@ -771,14 +837,15 @@ var _excluded$3 = ["name", "onChange", "selectedValue", "multiple", "size"];
 var SegmentedContext = /*#__PURE__*/React__default.createContext(null);
 var SegmentedProvider = function SegmentedProvider(_ref) {
   var name = _ref.name,
-    _ref$onChange = _ref.onChange,
-    onChange = _ref$onChange === void 0 ? function () {
-      return undefined;
-    } : _ref$onChange,
-    selectedValue = _ref.selectedValue,
-    multiple = _ref.multiple,
-    size = _ref.size,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
+      _ref$onChange = _ref.onChange,
+      onChange = _ref$onChange === void 0 ? function () {
+    return undefined;
+  } : _ref$onChange,
+      selectedValue = _ref.selectedValue,
+      multiple = _ref.multiple,
+      size = _ref.size,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
+
   var generatedName = useRandomId('eds-segmented-control');
   var contextValue = React__default.useMemo(function () {
     return {
@@ -795,40 +862,48 @@ var SegmentedProvider = function SegmentedProvider(_ref) {
 };
 var useSegmentedContext = function useSegmentedContext() {
   var context = React__default.useContext(SegmentedContext);
+
   if (!context) {
     throw new Error('You need to wrap your SegmentedChoice in either SegmentedControl or MultipleSegmentedControl');
   }
+
   return context;
 };
 
 var _excluded$2 = ["children", "className", "style", "value", "name", "onChange"];
 var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var children = _ref.children,
-    className = _ref.className,
-    style = _ref.style,
-    value = _ref.value,
-    name = _ref.name,
-    _ref$onChange = _ref.onChange,
-    onChange = _ref$onChange === void 0 ? function () {
-      return undefined;
-    } : _ref$onChange,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
+      className = _ref.className,
+      style = _ref.style,
+      value = _ref.value,
+      name = _ref.name,
+      _ref$onChange = _ref.onChange,
+      onChange = _ref$onChange === void 0 ? function () {
+    return undefined;
+  } : _ref$onChange,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
+
   var _useSegmentedContext = useSegmentedContext(),
-    commonName = _useSegmentedContext.name,
-    selectedValue = _useSegmentedContext.selectedValue,
-    commonOnChange = _useSegmentedContext.onChange,
-    multiple = _useSegmentedContext.multiple,
-    size = _useSegmentedContext.size;
+      commonName = _useSegmentedContext.name,
+      selectedValue = _useSegmentedContext.selectedValue,
+      commonOnChange = _useSegmentedContext.onChange,
+      multiple = _useSegmentedContext.multiple,
+      size = _useSegmentedContext.size;
+
   var isChecked = multiple ? selectedValue[value] : selectedValue === value;
+
   var handleChange = function handleChange(e) {
     onChange(e);
+
     if (multiple) {
       var _extends2;
+
       commonOnChange(_extends({}, selectedValue, (_extends2 = {}, _extends2[value] = e.target.checked, _extends2)));
     } else if (e.target.checked) {
       commonOnChange(value);
     }
   };
+
   return React__default.createElement("label", {
     className: classNames('eds-segmented-choice', className, {
       'eds-segmented-choide--large': size === 'large'
@@ -851,14 +926,15 @@ var SegmentedChoice = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
 var _excluded$1 = ["children", "label", "name", "onChange", "selectedValue", "size", "className"];
 var SegmentedControl = function SegmentedControl(_ref) {
   var children = _ref.children,
-    label = _ref.label,
-    name = _ref.name,
-    onChange = _ref.onChange,
-    selectedValue = _ref.selectedValue,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'medium' : _ref$size,
-    className = _ref.className,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+      label = _ref.label,
+      name = _ref.name,
+      onChange = _ref.onChange,
+      selectedValue = _ref.selectedValue,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'medium' : _ref$size,
+      className = _ref.className,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+
   return React__default.createElement(SegmentedProvider, {
     name: name,
     selectedValue: selectedValue,
@@ -876,13 +952,15 @@ var _excluded = ["children", "label", "name", "onChange", "selectedValue"];
 /**This component is not used by anyone, and is therefore deprecated
  * @deprecated
  */
+
 var MultipleSegmentedControl = function MultipleSegmentedControl(_ref) {
   var children = _ref.children,
-    label = _ref.label,
-    name = _ref.name,
-    onChange = _ref.onChange,
-    selectedValue = _ref.selectedValue,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+      label = _ref.label,
+      name = _ref.name,
+      onChange = _ref.onChange,
+      selectedValue = _ref.selectedValue,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+
   return React__default.createElement(SegmentedProvider, {
     name: name,
     selectedValue: selectedValue,