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

package/lib/cjs/components/Checkbox/Checkbox.test.js

@@ -1,23 +1,17 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 var _react = _interopRequireDefault(require("react"));
-
 var _react2 = require("@testing-library/react");
-
-var _Checkbox = _interopRequireDefault(require("./Checkbox"));
-
 var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
-
+var _Checkbox = _interopRequireDefault(require("./Checkbox"));
 var _react3 = require("@emotion/react");
-
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return (0, _react2.render)((0, _react3.jsx)(_Checkbox["default"], props));
-}; // Need to be added to each test file to test accessibility using axe.
-
+};
 
+// Need to be added to each test file to test accessibility using axe.
 (0, _testAxe["default"])(getComponent, {
   // Checkbox with label provided by CheckboxField
   rules: {
@@ -28,11 +22,9 @@ var getComponent = function getComponent() {
 });
 test('default checkbox', function () {
   getComponent();
-
   var input = _react2.screen.getByRole('checkbox');
-
   expect(input).toBeInstanceOf(HTMLInputElement);
-  expect(input).toBeInTheDocument(); // Should be visually hidden
-
+  expect(input).toBeInTheDocument();
+  // Should be visually hidden
   expect(input).not.toBeVisible();
 });

package/lib/cjs/components/Checkbox/CheckboxBase.js

@@ -1,37 +1,22 @@
 "use strict";
 
 var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
 var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _react = _interopRequireWildcard(require("react"));
-
-var _themeUi = require("theme-ui");
-
 var _visuallyHidden = require("@react-aria/visually-hidden");
-
+var _themeUi = require("theme-ui");
 var _Box = _interopRequireDefault(require("../Box"));
-
 var _react2 = require("@emotion/react");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 /**
  * Checkbox component from Theme UI, renders a visually hidden input + svg icons for the
  * checked and unchecked states.
@@ -45,7 +30,6 @@ var DefaultCheckbox = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
     }
   }, props));
 });
-
 var IndeterminateCheckboxIcon = function IndeterminateCheckboxIcon(props) {
   return (0, _react2.jsx)("svg", (0, _extends2["default"])({
     width: "24",
@@ -69,12 +53,11 @@ var IndeterminateCheckboxIcon = function IndeterminateCheckboxIcon(props) {
     fill: "white"
   }));
 };
+
 /**
  * Renders a visually hidden default checkbox since the Theme UI checkbox does not support
  * indeterminism. This allows us to have the necessary ARIA attributes and visual presentation.
  */
-
-
 var IndeterminateCheckbox = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   /* eslint-disable no-param-reassign */
   if (ref !== null && ref !== void 0 && ref.current) ref.current.indeterminate = true;

package/lib/cjs/components/Checkbox/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, "default", {
   enumerable: true,
   get: function get() {
     return _Checkbox["default"];
   }
 });
-
 var _Checkbox = _interopRequireDefault(require("./Checkbox"));

package/lib/cjs/components/CheckboxField/CheckboxField.js

@@ -1,71 +1,39 @@
 "use strict";
 
 var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
 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 _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = void 0;
-
 var _values = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/values"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _reactAria = require("react-aria");
-
 var _reactStately = require("react-stately");
-
 var _interactions = require("@react-aria/interactions");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _uuid = require("uuid");
-
-var _ = require("../../");
-
-var _ariaAttributes = require("../../utils/devUtils/props/ariaAttributes");
-
-var _fieldAttributes = require("../../utils/devUtils/props/fieldAttributes");
-
+var _ = require("../..");
 var _hooks = require("../../hooks");
-
 var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
-
+var _ariaAttributes = require("../../utils/devUtils/props/ariaAttributes");
+var _fieldAttributes = require("../../utils/devUtils/props/fieldAttributes");
 var _react2 = require("@emotion/react");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 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; }
-
 /**
  * Combines a checkbox, label, and helper text for a complete, form-ready solution.
  *
@@ -74,28 +42,24 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
  */
 var CheckboxField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var label = props.label,
-      _props$controlProps = props.controlProps,
-      controlProps = _props$controlProps === void 0 ? {} : _props$controlProps,
-      hasAutoFocus = props.hasAutoFocus,
-      helperText = props.helperText,
-      isDefaultSelected = props.isDefaultSelected,
-      isIndeterminate = props.isIndeterminate,
-      status = props.status;
-
+    _props$controlProps = props.controlProps,
+    controlProps = _props$controlProps === void 0 ? {} : _props$controlProps,
+    hasAutoFocus = props.hasAutoFocus,
+    helperText = props.helperText,
+    isDefaultSelected = props.isDefaultSelected,
+    isIndeterminate = props.isIndeterminate,
+    status = props.status;
   var checkboxProps = _objectSpread(_objectSpread({
     children: label,
     autoFocus: hasAutoFocus || controlProps.hasAutoFocus,
     defaultSelected: isDefaultSelected || controlProps.isDefaultSelected
   }, props), controlProps);
-
   var _usePress = (0, _interactions.usePress)(props),
-      containerPressProps = _usePress.pressProps;
-
+    containerPressProps = _usePress.pressProps;
   var state = (0, _reactStately.useToggleState)(checkboxProps);
   var checkboxRef = (0, _react.useRef)();
   (0, _hooks.usePropWarning)(props, 'disabled', 'isDisabled');
   /* istanbul ignore next */
-
   (0, _react.useImperativeHandle)(ref, function () {
     return checkboxRef.current;
   });
@@ -106,20 +70,17 @@ var CheckboxField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       checkboxRef.current.indeterminate = false;
     }
   }, [isIndeterminate]);
-
   var _useCheckbox = (0, _reactAria.useCheckbox)(checkboxProps, state, checkboxRef),
-      inputProps = _useCheckbox.inputProps;
-
+    inputProps = _useCheckbox.inputProps;
   var _useField = (0, _hooks.useField)(_objectSpread(_objectSpread(_objectSpread({}, containerPressProps), props), {}, {
-    statusClasses: {
-      isIndeterminate: isIndeterminate
-    },
-    controlProps: _objectSpread(_objectSpread({}, controlProps), inputProps)
-  })),
-      fieldContainerProps = _useField.fieldContainerProps,
-      fieldControlInputProps = _useField.fieldControlInputProps,
-      fieldLabelProps = _useField.fieldLabelProps;
-
+      statusClasses: {
+        isIndeterminate: isIndeterminate
+      },
+      controlProps: _objectSpread(_objectSpread({}, controlProps), inputProps)
+    })),
+    fieldContainerProps = _useField.fieldContainerProps,
+    fieldControlInputProps = _useField.fieldControlInputProps,
+    fieldLabelProps = _useField.fieldLabelProps;
   var helperTextId = (0, _react.useMemo)(function () {
     return (0, _uuid.v4)();
   }, []);
@@ -139,64 +100,45 @@ var CheckboxField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
 CheckboxField.propTypes = _objectSpread(_objectSpread({
   /** Whether the element should receive focus on render. */
   hasAutoFocus: _propTypes["default"].bool,
-
   /** Text rendered below the input. */
   helperText: _propTypes["default"].node,
-
   /** If present this prop will cause a help hint to render in the label of the field. */
   hintText: _propTypes["default"].string,
-
   /** The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id). */
   id: _propTypes["default"].string,
-
   /** Whether the element should be selected (uncontrolled). */
   isDefaultSelected: _propTypes["default"].bool,
-
   /** Whether the input is disabled. */
   isDisabled: _propTypes["default"].bool,
-
   /**
    * Indeterminism is presentational only. The indeterminate visual representation remains until
    * this prop is set to false regardless of user interaction.
   */
   isIndeterminate: _propTypes["default"].bool,
-
   /** Whether the input can be selected, but not changed by the user. */
   isReadOnly: _propTypes["default"].bool,
-
   /** Whether user input is required on the input before form submission. */
   isRequired: _propTypes["default"].bool,
-
   /** Whether the element should be selected (controlled). */
   isSelected: _propTypes["default"].bool,
-
   /** The rendered label for the field. */
   label: _propTypes["default"].node,
-
   /** The name of the input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname). */
   name: _propTypes["default"].string,
-
   /** Determines the textarea status indicator and helper text styling. */
   status: _propTypes["default"].oneOf((0, _values["default"])(_statuses["default"])),
-
   /** The value of the input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefvalue). */
   value: _propTypes["default"].string,
-
   /** Handler that is called when the element's selection state changes. */
   onChange: _propTypes["default"].func,
-
   /** Handler that is called when the element receives focus. */
   onFocus: _propTypes["default"].func,
-
   /** Handler that is called when the element loses focus. */
   onBlur: _propTypes["default"].func,
-
   /** Handler that is called when the element's focus status changes. */
   onFocusChange: _propTypes["default"].func,
-
   /** Handler that is called when a key is pressed. */
   onKeyDown: _propTypes["default"].func,
-
   /** Handler that is called when a key is released. */
   onKeyUp: _propTypes["default"].func
 }, _ariaAttributes.ariaAttributesBasePropTypes), _fieldAttributes.inputFieldAttributesBasePropTypes);

package/lib/cjs/components/CheckboxField/CheckboxField.stories.js

@@ -1,69 +1,38 @@
 "use strict";
 
 var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
 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 _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = exports.Required = exports.Indeterminate = exports.HelperText = exports.DefaultSelected = exports.Default = exports.Controlled = void 0;
-
 var _values = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/values"));
-
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
-
 var _every = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/every"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-
 var _react = _interopRequireWildcard(require("react"));
-
+var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
 var _ariaAttributes = require("../../utils/devUtils/props/ariaAttributes");
-
 var _fieldAttributes = require("../../utils/devUtils/props/fieldAttributes");
-
-var _CheckboxField = _interopRequireDefault(require("./CheckboxField"));
-
+var _Box = _interopRequireDefault(require("../Box"));
 var _Link = _interopRequireDefault(require("../Link"));
-
 var _Text = _interopRequireDefault(require("../Text"));
-
-var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
-
-var _Box = _interopRequireDefault(require("../Box"));
-
+var _CheckboxField = _interopRequireDefault(require("./CheckboxField"));
 var _react2 = require("@emotion/react");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 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; }
-
 var _default = {
   title: 'Form/CheckboxField',
   component: _CheckboxField["default"],
@@ -115,49 +84,39 @@ var _default = {
   }, _ariaAttributes.ariaAttributeBaseArgTypes), _fieldAttributes.inputFieldAttributeBaseArgTypes)
 };
 exports["default"] = _default;
-
 var Default = function Default(args) {
   return (0, _react2.jsx)(_CheckboxField["default"], args);
 };
-
 exports.Default = Default;
-
 var DefaultSelected = function DefaultSelected() {
   return (0, _react2.jsx)(_CheckboxField["default"], {
     isDefaultSelected: true,
     label: "Click me"
   });
 };
-
 exports.DefaultSelected = DefaultSelected;
-
 var Controlled = function Controlled() {
   var _React$useState = _react["default"].useState(false),
-      _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
-      isSelected = _React$useState2[0],
-      setSelected = _React$useState2[1];
-
+    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+    isSelected = _React$useState2[0],
+    setSelected = _React$useState2[1];
   return (0, _react2.jsx)(_CheckboxField["default"], {
     isSelected: isSelected,
     onChange: setSelected,
     label: "Click me"
   });
 };
-
 exports.Controlled = Controlled;
-
 var Required = function Required() {
   return (0, _react2.jsx)(_CheckboxField["default"], {
     isRequired: true,
-    label: (0, _react2.jsx)(_Text["default"], null, "I agree to the ", (0, _react2.jsx)(_Link["default"], {
+    label: (0, _react2.jsx)(_Text["default"], null, "I agree to the", ' ', (0, _react2.jsx)(_Link["default"], {
       href: "https://pingidentity.com",
       target: "_blank"
     }, "Terms and Conditions"))
   });
 };
-
 exports.Required = Required;
-
 var HelperText = function HelperText() {
   return (0, _react2.jsx)(_CheckboxField["default"], {
     status: "error",
@@ -165,41 +124,37 @@ var HelperText = function HelperText() {
     label: "Click me"
   });
 };
-
 exports.HelperText = HelperText;
-
 var Indeterminate = function Indeterminate() {
   // Whether the parent checkbox is indeterminate (default is true for our example)
   var _useState = (0, _react.useState)(true),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      isIndeterminate = _useState2[0],
-      setIsIndeterminate = _useState2[1]; // Whether the parent checkbox should be checked, this is set independently from indeterminism
-
-
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    isIndeterminate = _useState2[0],
+    setIsIndeterminate = _useState2[1];
+  // Whether the parent checkbox should be checked, this is set independently from indeterminism
   var _useState3 = (0, _react.useState)(false),
-      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-      isCompleted = _useState4[0],
-      setIsCompleted = _useState4[1]; // The state of the sub-checkboxes
-
-
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    isCompleted = _useState4[0],
+    setIsCompleted = _useState4[1];
+  // The state of the sub-checkboxes
   var _useState5 = (0, _react.useState)([{
-    label: 'Apple Chunks',
-    isSelected: true
-  }, {
-    label: 'Blueberries',
-    isSelected: false
-  }, {
-    label: 'Grapes',
-    isSelected: false
-  }, {
-    label: 'Strawberry Slices',
-    isSelected: true
-  }]),
-      _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
-      subCheckboxes = _useState6[0],
-      setSubCheckboxes = _useState6[1]; // Determine which checkbox needs its state updated
-
-
+      label: 'Apple Chunks',
+      isSelected: true
+    }, {
+      label: 'Blueberries',
+      isSelected: false
+    }, {
+      label: 'Grapes',
+      isSelected: false
+    }, {
+      label: 'Strawberry Slices',
+      isSelected: true
+    }]),
+    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+    subCheckboxes = _useState6[0],
+    setSubCheckboxes = _useState6[1];
+
+  // Determine which checkbox needs its state updated
   var handleSubCheckboxChange = function handleSubCheckboxChange(isSelected, changedIndex) {
     var changeAll = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     var newSubCheckboxes = (0, _map["default"])(subCheckboxes).call(subCheckboxes, function (checkbox, index) {
@@ -209,13 +164,12 @@ var Indeterminate = function Indeterminate() {
       return checkbox;
     });
     setSubCheckboxes(newSubCheckboxes);
-  }; // Update all sub-checkbox states when the parent checkbox is pressed
-
+  };
 
+  // Update all sub-checkbox states when the parent checkbox is pressed
   var handleParentCheckboxChange = function handleParentCheckboxChange(isSelected) {
     handleSubCheckboxChange(isSelected, null, true);
   };
-
   (0, _react.useEffect)(function () {
     // Determine if all sub-checkboxes are selected / unselected or if there is a mix
     // and update the parent checkbox
@@ -252,7 +206,6 @@ var Indeterminate = function Indeterminate() {
     });
   })));
 };
-
 exports.Indeterminate = Indeterminate;
 Indeterminate.parameters = {
   docs: {