@pingux/astro 2.0.0-alpha.1 → 2.0.0-alpha.4

package/lib/cjs/hooks/useField/useField.js

@@ -1,59 +1,33 @@
 "use strict";
 
 var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
-
 var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
-
 var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
-
 var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
 var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
-
 var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
-
 var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
-
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
-
 var _react = require("react");
-
-var _omit = _interopRequireDefault(require("lodash/omit"));
-
-var _noop = _interopRequireDefault(require("lodash/noop"));
-
 var _reactAria = require("react-aria");
-
 var _interactions = require("@react-aria/interactions");
-
-var _ariaAttributes = require("../../utils/devUtils/props/ariaAttributes");
-
-var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
-
-var _hooks = require("../../hooks");
-
+var _noop = _interopRequireDefault(require("lodash/noop"));
+var _omit = _interopRequireDefault(require("lodash/omit"));
 var _constants = require("../../components/Label/constants");
-
+var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
+var _ariaAttributes = require("../../utils/devUtils/props/ariaAttributes");
+var _ = require("..");
 var _excluded = ["autocomplete", "autoComplete", "autoCorrect", "children", "className", "containerProps", "controlProps", "defaultText", "defaultValue", "direction", "disabledKeys", "hasAutoFocus", "hasNoStatusIndicator", "helperText", "hintText", "id", "isDefaultSelected", "isDisabled", "isIndeterminate", "isReadOnly", "isRequired", "isRestrictiveMultivalues", "isSelected", "label", "labelMode", "labelProps", "maxLength", "name", "onBlur", "onChange", "onClear", "onFocus", "onFocusChange", "onLoadMore", "onOpenChange", "onSelectionChange", "placeholder", "role", "selectedKey", "spellCheck", "status", "statusClasses", "type", "value", "wrapperProps"];
-
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 /**
  * Generates the necessary props to be used in field components.
  * @param {{}} props Props for the field
@@ -62,164 +36,150 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 var useField = function useField() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var autocomplete = props.autocomplete,
-      autoComplete = props.autoComplete,
-      autoCorrect = props.autoCorrect,
-      children = props.children,
-      className = props.className,
-      _props$containerProps = props.containerProps,
-      containerProps = _props$containerProps === void 0 ? {} : _props$containerProps,
-      _props$controlProps = props.controlProps,
-      controlProps = _props$controlProps === void 0 ? {} : _props$controlProps,
-      defaultText = props.defaultText,
-      defaultValue = props.defaultValue,
-      direction = props.direction,
-      disabledKeys = props.disabledKeys,
-      hasAutoFocus = props.hasAutoFocus,
-      hasNoStatusIndicator = props.hasNoStatusIndicator,
-      helperText = props.helperText,
-      hintText = props.hintText,
-      id = props.id,
-      isDefaultSelected = props.isDefaultSelected,
-      isDisabled = props.isDisabled,
-      isIndeterminate = props.isIndeterminate,
-      isReadOnly = props.isReadOnly,
-      isRequired = props.isRequired,
-      isRestrictiveMultivalues = props.isRestrictiveMultivalues,
-      isSelected = props.isSelected,
-      label = props.label,
-      labelMode = props.labelMode,
-      _props$labelProps = props.labelProps,
-      labelProps = _props$labelProps === void 0 ? {} : _props$labelProps,
-      maxLength = props.maxLength,
-      name = props.name,
-      onBlur = props.onBlur,
-      _props$onChange = props.onChange,
-      onChange = _props$onChange === void 0 ? _noop["default"] : _props$onChange,
-      onClear = props.onClear,
-      onFocus = props.onFocus,
-      onFocusChange = props.onFocusChange,
-      onLoadMore = props.onLoadMore,
-      onOpenChange = props.onOpenChange,
-      onSelectionChange = props.onSelectionChange,
-      placeholder = props.placeholder,
-      role = props.role,
-      selectedKey = props.selectedKey,
-      spellCheck = props.spellCheck,
-      _props$status = props.status,
-      status = _props$status === void 0 ? _statuses["default"].DEFAULT : _props$status,
-      statusClasses = props.statusClasses,
-      type = props.type,
-      value = props.value,
-      wrapperProps = props.wrapperProps,
-      others = (0, _objectWithoutProperties2["default"])(props, _excluded); // 0 could be a valid input for fields, but null, undefined, and '' are not
-
+    autoComplete = props.autoComplete,
+    autoCorrect = props.autoCorrect,
+    children = props.children,
+    className = props.className,
+    _props$containerProps = props.containerProps,
+    containerProps = _props$containerProps === void 0 ? {} : _props$containerProps,
+    _props$controlProps = props.controlProps,
+    controlProps = _props$controlProps === void 0 ? {} : _props$controlProps,
+    defaultText = props.defaultText,
+    defaultValue = props.defaultValue,
+    direction = props.direction,
+    disabledKeys = props.disabledKeys,
+    hasAutoFocus = props.hasAutoFocus,
+    hasNoStatusIndicator = props.hasNoStatusIndicator,
+    helperText = props.helperText,
+    hintText = props.hintText,
+    id = props.id,
+    isDefaultSelected = props.isDefaultSelected,
+    isDisabled = props.isDisabled,
+    isIndeterminate = props.isIndeterminate,
+    isReadOnly = props.isReadOnly,
+    isRequired = props.isRequired,
+    isRestrictiveMultivalues = props.isRestrictiveMultivalues,
+    isSelected = props.isSelected,
+    label = props.label,
+    labelMode = props.labelMode,
+    _props$labelProps = props.labelProps,
+    labelProps = _props$labelProps === void 0 ? {} : _props$labelProps,
+    maxLength = props.maxLength,
+    name = props.name,
+    onBlur = props.onBlur,
+    _props$onChange = props.onChange,
+    onChange = _props$onChange === void 0 ? _noop["default"] : _props$onChange,
+    onClear = props.onClear,
+    onFocus = props.onFocus,
+    onFocusChange = props.onFocusChange,
+    onLoadMore = props.onLoadMore,
+    onOpenChange = props.onOpenChange,
+    onSelectionChange = props.onSelectionChange,
+    placeholder = props.placeholder,
+    role = props.role,
+    selectedKey = props.selectedKey,
+    spellCheck = props.spellCheck,
+    _props$status = props.status,
+    status = _props$status === void 0 ? _statuses["default"].DEFAULT : _props$status,
+    statusClasses = props.statusClasses,
+    type = props.type,
+    value = props.value,
+    wrapperProps = props.wrapperProps,
+    others = (0, _objectWithoutProperties2["default"])(props, _excluded);
+
+  // 0 could be a valid input for fields, but null, undefined, and '' are not
   var _useState = (0, _react.useState)(!!value || value === 0),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      hasValue = _useState2[0],
-      setHasValue = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    hasValue = _useState2[0],
+    setHasValue = _useState2[1];
   var _useState3 = (0, _react.useState)(false),
-      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-      hasFocusWithin = _useState4[0],
-      setFocusWithin = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    hasFocusWithin = _useState4[0],
+    setFocusWithin = _useState4[1];
   (0, _react.useEffect)(function () {
     if (!!defaultValue || defaultValue === 0 || !!value || value === 0 || !!placeholder || placeholder === 0) {
       setHasValue(true);
     } else {
       setHasValue(false);
     }
-  }, [defaultValue, value, placeholder]); // Capture value changes so we can apply the has-value class to the container
+  }, [defaultValue, value, placeholder]);
 
+  // Capture value changes so we can apply the has-value class to the container
   var fieldOnChange = function fieldOnChange(e) {
     var _e$target;
-
     var eventValue = e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value;
-
     if (!!eventValue || eventValue === 0 || !!placeholder || placeholder === 0) {
       setHasValue(true);
     } else {
       setHasValue(false);
-    } // adding this function resolves the error brought up in UIP-5116
-
-
+    }
+    // adding this function resolves the error brought up in UIP-5116
     if (e.persist) {
       e.persist();
-    } // Make sure to call the original onChange event
-
-
+    }
+    // Make sure to call the original onChange event
     return onChange(e);
   };
-
   var _useLabel = (0, _reactAria.useLabel)(_objectSpread(_objectSpread({}, props), controlProps)),
-      raLabelProps = _useLabel.labelProps,
-      raFieldProps = _useLabel.fieldProps;
-
+    raLabelProps = _useLabel.labelProps,
+    raFieldProps = _useLabel.fieldProps;
   var _useFocusRing = (0, _reactAria.useFocusRing)(),
-      isFocusVisible = _useFocusRing.isFocusVisible,
-      focusProps = _useFocusRing.focusProps;
-
-  var _useStatusClasses = (0, _hooks.useStatusClasses)(className, _objectSpread(_objectSpread((0, _defineProperty2["default"])({
-    'field-control__wrapper': true,
-    // generates 'field-control__wrapper' class
-    hasNoStatusIndicator: hasNoStatusIndicator,
-    isFocused: isFocusVisible,
-    isDisabled: isDisabled,
-    isReadOnly: isReadOnly
-  }, "is-".concat(status), true), statusClasses), wrapperProps === null || wrapperProps === void 0 ? void 0 : wrapperProps.statusClasses)),
-      wrapperClasses = _useStatusClasses.classNames;
-
-  var _useStatusClasses2 = (0, _hooks.useStatusClasses)(className, _objectSpread(_objectSpread((0, _defineProperty2["default"])({
-    'field-control__input': true,
-    // generates 'field-control__input' class
-    hasNoStatusIndicator: hasNoStatusIndicator,
-    isFocused: isFocusVisible,
-    isDisabled: isDisabled,
-    isReadOnly: isReadOnly
-  }, "is-".concat(status), true), statusClasses), controlProps === null || controlProps === void 0 ? void 0 : controlProps.statusClasses)),
-      inputClasses = _useStatusClasses2.classNames;
-
-  var _useStatusClasses3 = (0, _hooks.useStatusClasses)(className, _objectSpread(_objectSpread((0, _defineProperty2["default"])({
-    'field-label': true,
-    hasNoStatusIndicator: hasNoStatusIndicator,
-    isFocused: isFocusVisible,
-    isDisabled: isDisabled,
-    isReadOnly: isReadOnly
-  }, "is-".concat(status), true), statusClasses), labelProps === null || labelProps === void 0 ? void 0 : labelProps.statusClasses)),
-      labelClasses = _useStatusClasses3.classNames;
-
+    isFocusVisible = _useFocusRing.isFocusVisible,
+    focusProps = _useFocusRing.focusProps;
+  var _useStatusClasses = (0, _.useStatusClasses)(className, _objectSpread(_objectSpread((0, _defineProperty2["default"])({
+      'field-control__wrapper': true,
+      // generates 'field-control__wrapper' class
+      hasNoStatusIndicator: hasNoStatusIndicator,
+      isFocused: isFocusVisible,
+      isDisabled: isDisabled,
+      isReadOnly: isReadOnly
+    }, "is-".concat(status), true), statusClasses), wrapperProps === null || wrapperProps === void 0 ? void 0 : wrapperProps.statusClasses)),
+    wrapperClasses = _useStatusClasses.classNames;
+  var _useStatusClasses2 = (0, _.useStatusClasses)(className, _objectSpread(_objectSpread((0, _defineProperty2["default"])({
+      'field-control__input': true,
+      // generates 'field-control__input' class
+      hasNoStatusIndicator: hasNoStatusIndicator,
+      isFocused: isFocusVisible,
+      isDisabled: isDisabled,
+      isReadOnly: isReadOnly
+    }, "is-".concat(status), true), statusClasses), controlProps === null || controlProps === void 0 ? void 0 : controlProps.statusClasses)),
+    inputClasses = _useStatusClasses2.classNames;
+  var _useStatusClasses3 = (0, _.useStatusClasses)(className, _objectSpread(_objectSpread((0, _defineProperty2["default"])({
+      'field-label': true,
+      hasNoStatusIndicator: hasNoStatusIndicator,
+      isFocused: isFocusVisible,
+      isDisabled: isDisabled,
+      isReadOnly: isReadOnly
+    }, "is-".concat(status), true), statusClasses), labelProps === null || labelProps === void 0 ? void 0 : labelProps.statusClasses)),
+    labelClasses = _useStatusClasses3.classNames;
   var _getAriaAttributeProp = (0, _ariaAttributes.getAriaAttributeProps)(others),
-      ariaProps = _getAriaAttributeProp.ariaProps,
-      nonAriaProps = _getAriaAttributeProp.nonAriaProps; // Handle focus within and value state for the container. These are needed for float labels.
-
+    ariaProps = _getAriaAttributeProp.ariaProps,
+    nonAriaProps = _getAriaAttributeProp.nonAriaProps;
 
+  // Handle focus within and value state for the container. These are needed for float labels.
   var _useFocusWithin = (0, _interactions.useFocusWithin)({
-    onFocusWithinChange: setFocusWithin
-  }),
-      focusWithinProps = _useFocusWithin.focusWithinProps;
-
+      onFocusWithinChange: setFocusWithin
+    }),
+    focusWithinProps = _useFocusWithin.focusWithinProps;
   var isFloatLabel = labelMode === _constants.modes.FLOAT || (labelProps === null || labelProps === void 0 ? void 0 : labelProps.labelMode) === _constants.modes.FLOAT;
   var isLeftLabel = labelMode === _constants.modes.LEFT || (labelProps === null || labelProps === void 0 ? void 0 : labelProps.labelMode) === _constants.modes.LEFT;
   var isFloatLabelActive = isFloatLabel && (hasValue || (containerProps === null || containerProps === void 0 ? void 0 : containerProps.isFloatLabelActive));
-
-  var _useStatusClasses4 = (0, _hooks.useStatusClasses)(containerProps === null || containerProps === void 0 ? void 0 : containerProps.className, _objectSpread(_objectSpread({
-    'field-container': true,
-    // generates 'field-container' class
-    hasValue: hasValue,
-    hasFocusWithin: hasFocusWithin,
-    isLeftLabel: isLeftLabel,
-    isFloatLabel: isFloatLabel,
-    isFloatLabelActive: isFloatLabelActive
-  }, statusClasses), containerProps === null || containerProps === void 0 ? void 0 : containerProps.statusClasses)),
-      containerClasses = _useStatusClasses4.classNames;
-
+  var _useStatusClasses4 = (0, _.useStatusClasses)(containerProps === null || containerProps === void 0 ? void 0 : containerProps.className, _objectSpread(_objectSpread({
+      'field-container': true,
+      // generates 'field-container' class
+      hasValue: hasValue,
+      hasFocusWithin: hasFocusWithin,
+      isLeftLabel: isLeftLabel,
+      isFloatLabel: isFloatLabel,
+      isFloatLabelActive: isFloatLabelActive
+    }, statusClasses), containerProps === null || containerProps === void 0 ? void 0 : containerProps.statusClasses)),
+    containerClasses = _useStatusClasses4.classNames;
   var fieldContainerProps = _objectSpread(_objectSpread(_objectSpread({}, nonAriaProps), (0, _reactAria.mergeProps)(containerProps, focusWithinProps)), {}, {
     className: containerClasses,
     sx: _objectSpread({
       position: 'relative'
     }, containerProps === null || containerProps === void 0 ? void 0 : containerProps.sx)
   });
-
   var fieldControlInputProps = _objectSpread(_objectSpread(_objectSpread({
     autoComplete: autocomplete || autoComplete,
     autoCorrect: autoCorrect,
@@ -245,7 +205,6 @@ var useField = function useField() {
     onBlur: onBlur,
     onFocus: onFocus
   }, (0, _omit["default"])(controlProps, 'data-testid'), focusProps));
-
   var fieldLabelProps = _objectSpread(_objectSpread({
     children: label,
     className: labelClasses,
@@ -253,11 +212,9 @@ var useField = function useField() {
     isRequired: isRequired,
     mode: labelMode
   }, raLabelProps), labelProps);
-
   var fieldControlWrapperProps = _objectSpread({
     className: wrapperClasses
   }, wrapperProps);
-
   return {
     fieldContainerProps: fieldContainerProps,
     fieldControlInputProps: fieldControlInputProps,
@@ -265,6 +222,5 @@ var useField = function useField() {
     fieldLabelProps: fieldLabelProps
   };
 };
-
 var _default = useField;
 exports["default"] = _default;

package/lib/cjs/hooks/useField/useField.test.js

@@ -1,39 +1,22 @@
 "use strict";
 
 var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
-
 var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
-
 var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
-
 var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
 var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
-
 var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
-
 var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
-
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-
 var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
-
 var _reactHooks = require("@testing-library/react-hooks");
-
-var _useField = _interopRequireDefault(require("./useField"));
-
-var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
-
 var _constants = require("../../components/Label/constants");
-
+var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
+var _useField = _interopRequireDefault(require("./useField"));
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context3, _context4; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context3 = ownKeys(Object(source), !0)).call(_context3, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context4 = ownKeys(Object(source))).call(_context4, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 var defaultProps = {
   autoComplete: 'off',
   className: 'test',
@@ -85,17 +68,15 @@ test('default useField', function () {
 });
 test('should return props objects for field components', function () {
   var _context, _context2;
-
   var _renderHook = (0, _reactHooks.renderHook)(function () {
-    return (0, _useField["default"])(defaultProps);
-  }),
-      result = _renderHook.result;
-
+      return (0, _useField["default"])(defaultProps);
+    }),
+    result = _renderHook.result;
   var _result$current = result.current,
-      fieldContainerProps = _result$current.fieldContainerProps,
-      fieldControlInputProps = _result$current.fieldControlInputProps,
-      fieldControlWrapperProps = _result$current.fieldControlWrapperProps,
-      fieldLabelProps = _result$current.fieldLabelProps;
+    fieldContainerProps = _result$current.fieldContainerProps,
+    fieldControlInputProps = _result$current.fieldControlInputProps,
+    fieldControlWrapperProps = _result$current.fieldControlWrapperProps,
+    fieldLabelProps = _result$current.fieldLabelProps;
   expect(fieldContainerProps).toEqual({
     className: 'field-container has-value is-tested is-container',
     id: defaultProps.containerProps.id,
@@ -160,14 +141,11 @@ test('should support autocomplete additionally', function () {
   var newProps = _objectSpread(_objectSpread({}, defaultProps), {}, {
     autocomplete: 'new-password'
   });
-
   delete newProps.autoComplete;
-
   var _renderHook2 = (0, _reactHooks.renderHook)(function () {
-    return (0, _useField["default"])(newProps);
-  }),
-      result = _renderHook2.result;
-
+      return (0, _useField["default"])(newProps);
+    }),
+    result = _renderHook2.result;
   var fieldControlInputProps = result.current.fieldControlInputProps;
   expect(fieldControlInputProps).toMatchObject({
     autoComplete: 'new-password'
@@ -175,23 +153,24 @@ test('should support autocomplete additionally', function () {
 });
 test('should return isFloatLabelActive class for container', function () {
   var _renderHook3 = (0, _reactHooks.renderHook)(function (initialProps) {
-    return (0, _useField["default"])(_objectSpread(_objectSpread({}, initialProps), {}, {
-      placeholder: null
-    }));
-  }, {
-    initialProps: defaultProps
-  }),
-      result = _renderHook3.result,
-      rerender = _renderHook3.rerender; // Does not have the class if the label mode is not set to float
-
-
-  expect(result.current.fieldContainerProps.className).not.toContain('is-float-label-active'); // Has the class if the value is valid and label mode is float
+      return (0, _useField["default"])(_objectSpread(_objectSpread({}, initialProps), {}, {
+        placeholder: null
+      }));
+    }, {
+      initialProps: defaultProps
+    }),
+    result = _renderHook3.result,
+    rerender = _renderHook3.rerender;
+  // Does not have the class if the label mode is not set to float
+  expect(result.current.fieldContainerProps.className).not.toContain('is-float-label-active');
 
+  // Has the class if the value is valid and label mode is float
   rerender(_objectSpread(_objectSpread({}, defaultProps), {}, {
     labelMode: _constants.modes.FLOAT
   }));
-  expect(result.current.fieldContainerProps.className).toContain('is-float-label-active'); // Does not have the class if the value is invalid
+  expect(result.current.fieldContainerProps.className).toContain('is-float-label-active');
 
+  // Does not have the class if the value is invalid
   (0, _reactHooks.act)(function () {
     return result.current.fieldControlInputProps.onChange({
       target: {
@@ -199,13 +178,15 @@ test('should return isFloatLabelActive class for container', function () {
       }
     });
   });
-  expect(result.current.fieldContainerProps.className).not.toContain('is-float-label-active'); // Has the class if the container has focus within it
+  expect(result.current.fieldContainerProps.className).not.toContain('is-float-label-active');
 
+  // Has the class if the container has focus within it
   (0, _reactHooks.act)(function () {
     return result.current.fieldContainerProps.onFocus({});
   });
-  expect(result.current.fieldContainerProps.className).toContain('is-float-label'); // Does not have the class if the container loses focus within it
+  expect(result.current.fieldContainerProps.className).toContain('is-float-label');
 
+  // Does not have the class if the container loses focus within it
   (0, _reactHooks.act)(function () {
     return result.current.fieldContainerProps.onBlur({
       currentTarget: {
@@ -213,8 +194,9 @@ test('should return isFloatLabelActive class for container', function () {
       }
     });
   });
-  expect(result.current.fieldContainerProps.className).not.toContain('is-float-label-active'); // Has the class if the mode is float and the isFloatLabelActive containerProp is passed in
+  expect(result.current.fieldContainerProps.className).not.toContain('is-float-label-active');
 
+  // Has the class if the mode is float and the isFloatLabelActive containerProp is passed in
   rerender(_objectSpread(_objectSpread({}, defaultProps), {}, {
     labelMode: _constants.modes.FLOAT,
     containerProps: {
@@ -225,16 +207,16 @@ test('should return isFloatLabelActive class for container', function () {
 });
 test('should return isLeftLabel class for container', function () {
   var _renderHook4 = (0, _reactHooks.renderHook)(function (initialProps) {
-    return (0, _useField["default"])(initialProps);
-  }, {
-    initialProps: defaultProps
-  }),
-      result = _renderHook4.result,
-      rerender = _renderHook4.rerender; // Does not have the class if the label mode is not set to left
-
-
-  expect(result.current.fieldContainerProps.className).not.toContain('is-left-label'); // Has the class if the value is valid and label mode is left
+      return (0, _useField["default"])(initialProps);
+    }, {
+      initialProps: defaultProps
+    }),
+    result = _renderHook4.result,
+    rerender = _renderHook4.rerender;
+  // Does not have the class if the label mode is not set to left
+  expect(result.current.fieldContainerProps.className).not.toContain('is-left-label');
 
+  // Has the class if the value is valid and label mode is left
   rerender(_objectSpread(_objectSpread({}, defaultProps), {}, {
     labelMode: _constants.modes.LEFT
   }));
@@ -243,20 +225,19 @@ test('should return isLeftLabel class for container', function () {
 test('should return hasValue class for container when onChange updates internal state', function () {
   var onChange = jest.fn();
   var numCalls = 0;
-
   var _renderHook5 = (0, _reactHooks.renderHook)(function () {
-    return (0, _useField["default"])(_objectSpread(_objectSpread({}, defaultProps), {}, {
-      defaultValue: null,
-      placeholder: null,
-      onChange: onChange,
-      value: ''
-    }));
-  }),
-      result = _renderHook5.result; // Empty string is not a valid value
-
-
-  expect(result.current.fieldContainerProps.className).not.toContain('has-value'); // 0 should be a valid value
+      return (0, _useField["default"])(_objectSpread(_objectSpread({}, defaultProps), {}, {
+        defaultValue: null,
+        placeholder: null,
+        onChange: onChange,
+        value: ''
+      }));
+    }),
+    result = _renderHook5.result;
+  // Empty string is not a valid value
+  expect(result.current.fieldContainerProps.className).not.toContain('has-value');
 
+  // 0 should be a valid value
   (0, _reactHooks.act)(function () {
     return result.current.fieldControlInputProps.onChange({
       target: {
@@ -265,8 +246,9 @@ test('should return hasValue class for container when onChange updates internal
     });
   });
   expect(result.current.fieldContainerProps.className).toContain('has-value');
-  numCalls += 1; // undefined is not a valid value
+  numCalls += 1;
 
+  // undefined is not a valid value
   (0, _reactHooks.act)(function () {
     return result.current.fieldControlInputProps.onChange({
       target: {
@@ -275,8 +257,9 @@ test('should return hasValue class for container when onChange updates internal
     });
   });
   expect(result.current.fieldContainerProps.className).not.toContain('has-value');
-  numCalls += 1; // a non-empty string is a valid value
+  numCalls += 1;
 
+  // a non-empty string is a valid value
   (0, _reactHooks.act)(function () {
     return result.current.fieldControlInputProps.onChange({
       target: {
@@ -285,8 +268,9 @@ test('should return hasValue class for container when onChange updates internal
     });
   });
   expect(result.current.fieldContainerProps.className).toContain('has-value');
-  numCalls += 1; // the original onChange should be called each time
+  numCalls += 1;
 
+  // the original onChange should be called each time
   expect(numCalls).toBeGreaterThan(0);
   expect(onChange).toHaveBeenCalledTimes(numCalls);
 });

package/lib/cjs/hooks/useImageUploadState/index.js

@@ -1,18 +1,14 @@
 "use strict";
 
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 _Object$defineProperty(exports, "useImageUploadState", {
   enumerable: true,
   get: function get() {
     return _useImageUploadState["default"];
   }
 });
-
 var _useImageUploadState = _interopRequireDefault(require("./useImageUploadState"));