@pingux/astro 2.67.0-alpha.1 → 2.67.0

package/lib/cjs/types/box.d.ts

@@ -1,6 +1,7 @@
 import { StylePropertyValue } from 'theme-ui';
 import { DOMAttributes, StyleProps } from './shared';
 export interface BoxProps extends StyleProps, DOMAttributes {
+    id?: string;
     /** The background color of the box. */
     bg?: StylePropertyValue<string | undefined>;
     /** When true, display as a row rather than a column. */

package/lib/cjs/types/checkboxField.d.ts

@@ -0,0 +1,7 @@
+import { UseFieldProps } from '../hooks/useField/useField';
+export interface CheckboxFieldProps extends UseFieldProps<HTMLInputElement> {
+    /** Handler that is called when a key is pressed. */
+    onKeyDown?: () => void;
+    /** Handler that is called when a key is released. */
+    onKeyUp?: () => void;
+}

package/lib/cjs/types/checkboxField.js

@@ -0,0 +1,6 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/cjs/types/index.d.ts

@@ -7,6 +7,7 @@ export * from './button';
 export * from './buttonBar';
 export * from './calendar';
 export * from './card';
+export * from './checkboxField';
 export * from './colorField';
 export * from './copyText';
 export * from './dataTable';

package/lib/cjs/types/index.js

@@ -1,6 +1,6 @@
 "use strict";
 
-var _context, _context2, _context3, _context4, _context5, _context6, _context7, _context8, _context9, _context10, _context11, _context12, _context13, _context14, _context15, _context16, _context17, _context18, _context19, _context20, _context21, _context22, _context23, _context24, _context25, _context26, _context27, _context28, _context29, _context30, _context31, _context32, _context33, _context34, _context35, _context36, _context37, _context38, _context39, _context40, _context41, _context42, _context43, _context44, _context45;
+var _context, _context2, _context3, _context4, _context5, _context6, _context7, _context8, _context9, _context10, _context11, _context12, _context13, _context14, _context15, _context16, _context17, _context18, _context19, _context20, _context21, _context22, _context23, _context24, _context25, _context26, _context27, _context28, _context29, _context30, _context31, _context32, _context33, _context34, _context35, _context36, _context37, _context38, _context39, _context40, _context41, _context42, _context43, _context44, _context45, _context46;
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
 var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
 var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
@@ -106,8 +106,19 @@ _forEachInstanceProperty(_context9 = _Object$keys(_card)).call(_context9, functi
     }
   });
 });
+var _checkboxField = require("./checkboxField");
+_forEachInstanceProperty(_context10 = _Object$keys(_checkboxField)).call(_context10, function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _checkboxField[key]) return;
+  _Object$defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _checkboxField[key];
+    }
+  });
+});
 var _colorField = require("./colorField");
-_forEachInstanceProperty(_context10 = _Object$keys(_colorField)).call(_context10, function (key) {
+_forEachInstanceProperty(_context11 = _Object$keys(_colorField)).call(_context11, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _colorField[key]) return;
   _Object$defineProperty(exports, key, {
@@ -118,7 +129,7 @@ _forEachInstanceProperty(_context10 = _Object$keys(_colorField)).call(_context10
   });
 });
 var _copyText = require("./copyText");
-_forEachInstanceProperty(_context11 = _Object$keys(_copyText)).call(_context11, function (key) {
+_forEachInstanceProperty(_context12 = _Object$keys(_copyText)).call(_context12, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _copyText[key]) return;
   _Object$defineProperty(exports, key, {
@@ -129,7 +140,7 @@ _forEachInstanceProperty(_context11 = _Object$keys(_copyText)).call(_context11,
   });
 });
 var _dataTable = require("./dataTable");
-_forEachInstanceProperty(_context12 = _Object$keys(_dataTable)).call(_context12, function (key) {
+_forEachInstanceProperty(_context13 = _Object$keys(_dataTable)).call(_context13, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _dataTable[key]) return;
   _Object$defineProperty(exports, key, {
@@ -140,7 +151,7 @@ _forEachInstanceProperty(_context12 = _Object$keys(_dataTable)).call(_context12,
   });
 });
 var _environmentBreadcrumb = require("./environmentBreadcrumb");
-_forEachInstanceProperty(_context13 = _Object$keys(_environmentBreadcrumb)).call(_context13, function (key) {
+_forEachInstanceProperty(_context14 = _Object$keys(_environmentBreadcrumb)).call(_context14, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _environmentBreadcrumb[key]) return;
   _Object$defineProperty(exports, key, {
@@ -151,7 +162,7 @@ _forEachInstanceProperty(_context13 = _Object$keys(_environmentBreadcrumb)).call
   });
 });
 var _fieldHelperText = require("./fieldHelperText");
-_forEachInstanceProperty(_context14 = _Object$keys(_fieldHelperText)).call(_context14, function (key) {
+_forEachInstanceProperty(_context15 = _Object$keys(_fieldHelperText)).call(_context15, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _fieldHelperText[key]) return;
   _Object$defineProperty(exports, key, {
@@ -162,7 +173,7 @@ _forEachInstanceProperty(_context14 = _Object$keys(_fieldHelperText)).call(_cont
   });
 });
 var _helpHint = require("./helpHint");
-_forEachInstanceProperty(_context15 = _Object$keys(_helpHint)).call(_context15, function (key) {
+_forEachInstanceProperty(_context16 = _Object$keys(_helpHint)).call(_context16, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _helpHint[key]) return;
   _Object$defineProperty(exports, key, {
@@ -173,7 +184,7 @@ _forEachInstanceProperty(_context15 = _Object$keys(_helpHint)).call(_context15,
   });
 });
 var _icon = require("./icon");
-_forEachInstanceProperty(_context16 = _Object$keys(_icon)).call(_context16, function (key) {
+_forEachInstanceProperty(_context17 = _Object$keys(_icon)).call(_context17, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _icon[key]) return;
   _Object$defineProperty(exports, key, {
@@ -184,7 +195,7 @@ _forEachInstanceProperty(_context16 = _Object$keys(_icon)).call(_context16, func
   });
 });
 var _iconBadge = require("./iconBadge");
-_forEachInstanceProperty(_context17 = _Object$keys(_iconBadge)).call(_context17, function (key) {
+_forEachInstanceProperty(_context18 = _Object$keys(_iconBadge)).call(_context18, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _iconBadge[key]) return;
   _Object$defineProperty(exports, key, {
@@ -195,7 +206,7 @@ _forEachInstanceProperty(_context17 = _Object$keys(_iconBadge)).call(_context17,
   });
 });
 var _iconButton = require("./iconButton");
-_forEachInstanceProperty(_context18 = _Object$keys(_iconButton)).call(_context18, function (key) {
+_forEachInstanceProperty(_context19 = _Object$keys(_iconButton)).call(_context19, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _iconButton[key]) return;
   _Object$defineProperty(exports, key, {
@@ -206,7 +217,7 @@ _forEachInstanceProperty(_context18 = _Object$keys(_iconButton)).call(_context18
   });
 });
 var _iconButtonToggle = require("./iconButtonToggle");
-_forEachInstanceProperty(_context19 = _Object$keys(_iconButtonToggle)).call(_context19, function (key) {
+_forEachInstanceProperty(_context20 = _Object$keys(_iconButtonToggle)).call(_context20, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _iconButtonToggle[key]) return;
   _Object$defineProperty(exports, key, {
@@ -217,7 +228,7 @@ _forEachInstanceProperty(_context19 = _Object$keys(_iconButtonToggle)).call(_con
   });
 });
 var _input = require("./input");
-_forEachInstanceProperty(_context20 = _Object$keys(_input)).call(_context20, function (key) {
+_forEachInstanceProperty(_context21 = _Object$keys(_input)).call(_context21, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _input[key]) return;
   _Object$defineProperty(exports, key, {
@@ -228,7 +239,7 @@ _forEachInstanceProperty(_context20 = _Object$keys(_input)).call(_context20, fun
   });
 });
 var _item = require("./item");
-_forEachInstanceProperty(_context21 = _Object$keys(_item)).call(_context21, function (key) {
+_forEachInstanceProperty(_context22 = _Object$keys(_item)).call(_context22, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _item[key]) return;
   _Object$defineProperty(exports, key, {
@@ -239,7 +250,7 @@ _forEachInstanceProperty(_context21 = _Object$keys(_item)).call(_context21, func
   });
 });
 var _label = require("./label");
-_forEachInstanceProperty(_context22 = _Object$keys(_label)).call(_context22, function (key) {
+_forEachInstanceProperty(_context23 = _Object$keys(_label)).call(_context23, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _label[key]) return;
   _Object$defineProperty(exports, key, {
@@ -250,7 +261,7 @@ _forEachInstanceProperty(_context22 = _Object$keys(_label)).call(_context22, fun
   });
 });
 var _link = require("./link");
-_forEachInstanceProperty(_context23 = _Object$keys(_link)).call(_context23, function (key) {
+_forEachInstanceProperty(_context24 = _Object$keys(_link)).call(_context24, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _link[key]) return;
   _Object$defineProperty(exports, key, {
@@ -261,7 +272,7 @@ _forEachInstanceProperty(_context23 = _Object$keys(_link)).call(_context23, func
   });
 });
 var _listBox = require("./listBox");
-_forEachInstanceProperty(_context24 = _Object$keys(_listBox)).call(_context24, function (key) {
+_forEachInstanceProperty(_context25 = _Object$keys(_listBox)).call(_context25, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _listBox[key]) return;
   _Object$defineProperty(exports, key, {
@@ -272,7 +283,7 @@ _forEachInstanceProperty(_context24 = _Object$keys(_listBox)).call(_context24, f
   });
 });
 var _listItem = require("./listItem");
-_forEachInstanceProperty(_context25 = _Object$keys(_listItem)).call(_context25, function (key) {
+_forEachInstanceProperty(_context26 = _Object$keys(_listItem)).call(_context26, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _listItem[key]) return;
   _Object$defineProperty(exports, key, {
@@ -283,7 +294,7 @@ _forEachInstanceProperty(_context25 = _Object$keys(_listItem)).call(_context25,
   });
 });
 var _loader = require("./loader");
-_forEachInstanceProperty(_context26 = _Object$keys(_loader)).call(_context26, function (key) {
+_forEachInstanceProperty(_context27 = _Object$keys(_loader)).call(_context27, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _loader[key]) return;
   _Object$defineProperty(exports, key, {
@@ -294,7 +305,7 @@ _forEachInstanceProperty(_context26 = _Object$keys(_loader)).call(_context26, fu
   });
 });
 var _menu = require("./menu");
-_forEachInstanceProperty(_context27 = _Object$keys(_menu)).call(_context27, function (key) {
+_forEachInstanceProperty(_context28 = _Object$keys(_menu)).call(_context28, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _menu[key]) return;
   _Object$defineProperty(exports, key, {
@@ -305,7 +316,7 @@ _forEachInstanceProperty(_context27 = _Object$keys(_menu)).call(_context27, func
   });
 });
 var _menuItem = require("./menuItem");
-_forEachInstanceProperty(_context28 = _Object$keys(_menuItem)).call(_context28, function (key) {
+_forEachInstanceProperty(_context29 = _Object$keys(_menuItem)).call(_context29, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _menuItem[key]) return;
   _Object$defineProperty(exports, key, {
@@ -316,7 +327,7 @@ _forEachInstanceProperty(_context28 = _Object$keys(_menuItem)).call(_context28,
   });
 });
 var _messages = require("./messages");
-_forEachInstanceProperty(_context29 = _Object$keys(_messages)).call(_context29, function (key) {
+_forEachInstanceProperty(_context30 = _Object$keys(_messages)).call(_context30, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _messages[key]) return;
   _Object$defineProperty(exports, key, {
@@ -327,7 +338,7 @@ _forEachInstanceProperty(_context29 = _Object$keys(_messages)).call(_context29,
   });
 });
 var _Modal = require("./Modal");
-_forEachInstanceProperty(_context30 = _Object$keys(_Modal)).call(_context30, function (key) {
+_forEachInstanceProperty(_context31 = _Object$keys(_Modal)).call(_context31, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _Modal[key]) return;
   _Object$defineProperty(exports, key, {
@@ -338,7 +349,7 @@ _forEachInstanceProperty(_context30 = _Object$keys(_Modal)).call(_context30, fun
   });
 });
 var _navBar = require("./navBar");
-_forEachInstanceProperty(_context31 = _Object$keys(_navBar)).call(_context31, function (key) {
+_forEachInstanceProperty(_context32 = _Object$keys(_navBar)).call(_context32, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _navBar[key]) return;
   _Object$defineProperty(exports, key, {
@@ -349,7 +360,7 @@ _forEachInstanceProperty(_context31 = _Object$keys(_navBar)).call(_context31, fu
   });
 });
 var _overlayPanel = require("./overlayPanel");
-_forEachInstanceProperty(_context32 = _Object$keys(_overlayPanel)).call(_context32, function (key) {
+_forEachInstanceProperty(_context33 = _Object$keys(_overlayPanel)).call(_context33, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _overlayPanel[key]) return;
   _Object$defineProperty(exports, key, {
@@ -360,7 +371,7 @@ _forEachInstanceProperty(_context32 = _Object$keys(_overlayPanel)).call(_context
   });
 });
 var _popoverContainer = require("./popoverContainer");
-_forEachInstanceProperty(_context33 = _Object$keys(_popoverContainer)).call(_context33, function (key) {
+_forEachInstanceProperty(_context34 = _Object$keys(_popoverContainer)).call(_context34, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _popoverContainer[key]) return;
   _Object$defineProperty(exports, key, {
@@ -371,7 +382,7 @@ _forEachInstanceProperty(_context33 = _Object$keys(_popoverContainer)).call(_con
   });
 });
 var _popoverMenu = require("./popoverMenu");
-_forEachInstanceProperty(_context34 = _Object$keys(_popoverMenu)).call(_context34, function (key) {
+_forEachInstanceProperty(_context35 = _Object$keys(_popoverMenu)).call(_context35, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _popoverMenu[key]) return;
   _Object$defineProperty(exports, key, {
@@ -382,7 +393,7 @@ _forEachInstanceProperty(_context34 = _Object$keys(_popoverMenu)).call(_context3
   });
 });
 var _progressBar = require("./progressBar");
-_forEachInstanceProperty(_context35 = _Object$keys(_progressBar)).call(_context35, function (key) {
+_forEachInstanceProperty(_context36 = _Object$keys(_progressBar)).call(_context36, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _progressBar[key]) return;
   _Object$defineProperty(exports, key, {
@@ -393,7 +404,7 @@ _forEachInstanceProperty(_context35 = _Object$keys(_progressBar)).call(_context3
   });
 });
 var _requirementsList = require("./requirementsList");
-_forEachInstanceProperty(_context36 = _Object$keys(_requirementsList)).call(_context36, function (key) {
+_forEachInstanceProperty(_context37 = _Object$keys(_requirementsList)).call(_context37, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _requirementsList[key]) return;
   _Object$defineProperty(exports, key, {
@@ -404,7 +415,7 @@ _forEachInstanceProperty(_context36 = _Object$keys(_requirementsList)).call(_con
   });
 });
 var _rockerButtonGroup = require("./rockerButtonGroup");
-_forEachInstanceProperty(_context37 = _Object$keys(_rockerButtonGroup)).call(_context37, function (key) {
+_forEachInstanceProperty(_context38 = _Object$keys(_rockerButtonGroup)).call(_context38, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _rockerButtonGroup[key]) return;
   _Object$defineProperty(exports, key, {
@@ -415,7 +426,7 @@ _forEachInstanceProperty(_context37 = _Object$keys(_rockerButtonGroup)).call(_co
   });
 });
 var _scrollBox = require("./scrollBox");
-_forEachInstanceProperty(_context38 = _Object$keys(_scrollBox)).call(_context38, function (key) {
+_forEachInstanceProperty(_context39 = _Object$keys(_scrollBox)).call(_context39, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _scrollBox[key]) return;
   _Object$defineProperty(exports, key, {
@@ -426,7 +437,7 @@ _forEachInstanceProperty(_context38 = _Object$keys(_scrollBox)).call(_context38,
   });
 });
 var _separator = require("./separator");
-_forEachInstanceProperty(_context39 = _Object$keys(_separator)).call(_context39, function (key) {
+_forEachInstanceProperty(_context40 = _Object$keys(_separator)).call(_context40, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _separator[key]) return;
   _Object$defineProperty(exports, key, {
@@ -437,7 +448,7 @@ _forEachInstanceProperty(_context39 = _Object$keys(_separator)).call(_context39,
   });
 });
 var _shared = require("./shared");
-_forEachInstanceProperty(_context40 = _Object$keys(_shared)).call(_context40, function (key) {
+_forEachInstanceProperty(_context41 = _Object$keys(_shared)).call(_context41, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _shared[key]) return;
   _Object$defineProperty(exports, key, {
@@ -448,7 +459,7 @@ _forEachInstanceProperty(_context40 = _Object$keys(_shared)).call(_context40, fu
   });
 });
 var _tab = require("./tab");
-_forEachInstanceProperty(_context41 = _Object$keys(_tab)).call(_context41, function (key) {
+_forEachInstanceProperty(_context42 = _Object$keys(_tab)).call(_context42, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _tab[key]) return;
   _Object$defineProperty(exports, key, {
@@ -459,7 +470,7 @@ _forEachInstanceProperty(_context41 = _Object$keys(_tab)).call(_context41, funct
   });
 });
 var _table = require("./table");
-_forEachInstanceProperty(_context42 = _Object$keys(_table)).call(_context42, function (key) {
+_forEachInstanceProperty(_context43 = _Object$keys(_table)).call(_context43, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _table[key]) return;
   _Object$defineProperty(exports, key, {
@@ -470,7 +481,7 @@ _forEachInstanceProperty(_context42 = _Object$keys(_table)).call(_context42, fun
   });
 });
 var _tabs = require("./tabs");
-_forEachInstanceProperty(_context43 = _Object$keys(_tabs)).call(_context43, function (key) {
+_forEachInstanceProperty(_context44 = _Object$keys(_tabs)).call(_context44, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _tabs[key]) return;
   _Object$defineProperty(exports, key, {
@@ -481,7 +492,7 @@ _forEachInstanceProperty(_context43 = _Object$keys(_tabs)).call(_context43, func
   });
 });
 var _text = require("./text");
-_forEachInstanceProperty(_context44 = _Object$keys(_text)).call(_context44, function (key) {
+_forEachInstanceProperty(_context45 = _Object$keys(_text)).call(_context45, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _text[key]) return;
   _Object$defineProperty(exports, key, {
@@ -492,7 +503,7 @@ _forEachInstanceProperty(_context44 = _Object$keys(_text)).call(_context44, func
   });
 });
 var _tooltipTrigger = require("./tooltipTrigger");
-_forEachInstanceProperty(_context45 = _Object$keys(_tooltipTrigger)).call(_context45, function (key) {
+_forEachInstanceProperty(_context46 = _Object$keys(_tooltipTrigger)).call(_context46, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _tooltipTrigger[key]) return;
   _Object$defineProperty(exports, key, {

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

@@ -27,4 +27,11 @@ test('default checkbox', function () {
   expect(input).toBeInTheDocument();
   // Should be visually hidden
   expect(input).not.toBeVisible();
+});
+test('indeterminate checkbox', function () {
+  getComponent({
+    isIndeterminate: true
+  });
+  var input = screen.getByText('Indeterminate Checkbox Icon');
+  expect(input).toBeInTheDocument();
 });

package/lib/components/CheckboxField/CheckboxField.js

@@ -10,18 +10,15 @@ import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 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) { _defineProperty(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; }
-import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
+import React, { forwardRef, useEffect, useMemo } from 'react';
 import { useCheckbox } from 'react-aria';
 import { useToggleState } from 'react-stately';
 import { usePress } from '@react-aria/interactions';
-import PropTypes from 'prop-types';
 import { v4 as uuid } from 'uuid';
 import { Box, Checkbox, FieldHelperText, Label } from '../..';
-import { useField, usePropWarning } from '../../hooks';
+import { useField, useLocalOrForwardRef, usePropWarning } from '../../hooks';
 import { getPendoID } from '../../utils/devUtils/constants/pendoID';
-import { ariaAttributesBasePropTypes } from '../../utils/docUtils/ariaAttributes';
-import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
-import { statusPropTypes } from '../../utils/docUtils/statusProp';
+import statuses from '../../utils/devUtils/constants/statuses';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var displayName = 'CheckboxField';
 var CheckboxField = /*#__PURE__*/forwardRef(function (props, ref) {
@@ -32,19 +29,18 @@ var CheckboxField = /*#__PURE__*/forwardRef(function (props, ref) {
     helperText = props.helperText,
     isDefaultSelected = props.isDefaultSelected,
     isIndeterminate = props.isIndeterminate,
-    status = props.status;
+    _props$status = props.status,
+    status = _props$status === void 0 ? statuses.DEFAULT : _props$status;
   var checkboxProps = _objectSpread(_objectSpread({
     children: label,
     autoFocus: hasAutoFocus || controlProps.hasAutoFocus,
     defaultSelected: isDefaultSelected || controlProps.isDefaultSelected
   }, props), controlProps);
   var state = useToggleState(checkboxProps);
-  var checkboxRef = useRef();
   usePropWarning(props, 'disabled', 'isDisabled');
+
   /* istanbul ignore next */
-  useImperativeHandle(ref, function () {
-    return checkboxRef.current;
-  });
+  var checkboxRef = useLocalOrForwardRef(ref);
   var _usePress = usePress(_objectSpread(_objectSpread({}, props), {}, {
       ref: checkboxRef
     })),
@@ -83,48 +79,5 @@ var CheckboxField = /*#__PURE__*/forwardRef(function (props, ref) {
     id: helperTextId
   }, helperText));
 });
-CheckboxField.propTypes = _objectSpread(_objectSpread(_objectSpread({
-  /** Whether the element should receive focus on render. */
-  hasAutoFocus: PropTypes.bool,
-  /** Text rendered below the input. */
-  helperText: PropTypes.node,
-  /** If present this prop will cause a help hint to render in the label of the field. */
-  hintText: PropTypes.string,
-  /** The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id). */
-  id: PropTypes.string,
-  /** Whether the element should be selected (uncontrolled). */
-  isDefaultSelected: PropTypes.bool,
-  /** Whether the input is disabled. */
-  isDisabled: PropTypes.bool,
-  /**
-   * Indeterminism is presentational only. The indeterminate visual representation remains until
-   * this prop is set to false regardless of user interaction.
-  */
-  isIndeterminate: PropTypes.bool,
-  /** Whether the input can be selected, but not changed by the user. */
-  isReadOnly: PropTypes.bool,
-  /** Whether user input is required on the input before form submission. */
-  isRequired: PropTypes.bool,
-  /** Whether the element should be selected (controlled). */
-  isSelected: PropTypes.bool,
-  /** The rendered label for the field. */
-  label: PropTypes.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.string,
-  /** 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.string,
-  /** Handler that is called when the element's selection state changes. */
-  onChange: PropTypes.func,
-  /** Handler that is called when the element receives focus. */
-  onFocus: PropTypes.func,
-  /** Handler that is called when the element loses focus. */
-  onBlur: PropTypes.func,
-  /** Handler that is called when the element's focus status changes. */
-  onFocusChange: PropTypes.func,
-  /** Handler that is called when a key is pressed. */
-  onKeyDown: PropTypes.func,
-  /** Handler that is called when a key is released. */
-  onKeyUp: PropTypes.func
-}, statusPropTypes), ariaAttributesBasePropTypes), inputFieldAttributesBasePropTypes);
 CheckboxField.displayName = displayName;
 export default CheckboxField;

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

@@ -17,6 +17,7 @@ import MenuDown from '@pingux/mdi-react/MenuDownIcon';
 import MenuRight from '@pingux/mdi-react/MenuRightIcon';
 import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { Badge, Box, CheckboxField, IconButtonToggle, Link, SwitchField, Text } from '../../index';
+import statuses from '../../utils/devUtils/constants/statuses';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusArgTypes } from '../../utils/docUtils/statusProp';
@@ -86,7 +87,9 @@ export var Controlled = function Controlled() {
     setSelected = _React$useState2[1];
   return ___EmotionJSX(CheckboxField, {
     isSelected: isSelected,
-    onChange: setSelected,
+    onChange: function onChange(e) {
+      return setSelected;
+    },
     label: "Click me"
   });
 };
@@ -101,7 +104,7 @@ export var Required = function Required() {
 };
 export var HelperText = function HelperText() {
   return ___EmotionJSX(CheckboxField, {
-    status: "error",
+    status: statuses.ERROR,
     helperText: "Here is some helpful text...",
     label: "Click me"
   });
@@ -188,7 +191,9 @@ export var ExpandableAndToggleableIndeterminate = function ExpandableAndToggleab
   }, ___EmotionJSX(IconButtonToggle, {
     toggledIcon: MenuDown,
     defaultIcon: MenuRight,
-    onToggle: setIsExpanded,
+    onToggle: function onToggle() {
+      return setIsExpanded(!isExpanded);
+    },
     isToggled: isExpanded,
     buttonProps: {
       'aria-label': isExpanded ? 'menu down' : 'menu up',
@@ -204,7 +209,9 @@ export var ExpandableAndToggleableIndeterminate = function ExpandableAndToggleab
     isSelected: isCompleted,
     onChange: handleParentCheckboxChange
   }), ___EmotionJSX(Box, null, ___EmotionJSX(Badge, {
-    ml: "sm",
+    sx: {
+      ml: 'sm'
+    },
     label: subCheckboxes.length,
     variant: "countNeutral"
   }))), ___EmotionJSX(Box, {

package/lib/types/checkboxField.js

@@ -0,0 +1 @@
+export {};

package/lib/types/index.js

@@ -7,6 +7,7 @@ export * from './button';
 export * from './buttonBar';
 export * from './calendar';
 export * from './card';
+export * from './checkboxField';
 export * from './colorField';
 export * from './copyText';
 export * from './dataTable';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.67.0-alpha.1",
+  "version": "2.67.0",
   "description": "React component library for Ping Identity's design system",
   "repository": {
     "type": "git",
@@ -84,9 +84,11 @@
     "@react-stately/selection": "^3.14.2",
     "@react-stately/table": "^3.9.0",
     "@react-stately/tabs": "^3.6.3",
+    "@react-stately/toggle": "^3.7.3",
     "@react-stately/tree": "^3.7.4",
     "@react-stately/virtualizer": "~3.6.5",
     "@react-types/accordion": "^3.0.0-alpha.18",
+    "@react-types/checkbox": "^3.8.0",
     "@react-types/grid": "^3.2.4",
     "@react-types/select": "^3.9.1",
     "@react-types/shared": "^3.22.0",