@pingux/astro 2.2.0-alpha.3 → 2.2.0-alpha.4

package/lib/components/Callout/Callout.stories.js

@@ -1,21 +1,25 @@
-import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+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 from 'react';
 import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { Callout, Link, Text } from '../../index';
 import statuses from '../../utils/devUtils/constants/statuses';
+import { statusArgTypes } from '../../utils/docUtils/statusProp';
 import CalloutReadme from './Callout.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Components/Callout',
   component: Callout,
-  argTypes: {
-    status: {
-      control: {
-        type: 'select',
-        options: _Object$values(statuses)
-      }
-    }
-  },
+  argTypes: _objectSpread({}, statusArgTypes),
   parameters: {
     docs: {
       source: {

package/lib/components/CheckboxField/CheckboxField.js

@@ -8,7 +8,6 @@ import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/obje
 import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
-import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
 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';
@@ -19,9 +18,9 @@ import PropTypes from 'prop-types';
 import { v4 as uuid } from 'uuid';
 import { Box, Checkbox, FieldHelperText, Label } from '../..';
 import { useField, usePropWarning } from '../../hooks';
-import statuses from '../../utils/devUtils/constants/statuses';
-import { ariaAttributesBasePropTypes } from '../../utils/devUtils/props/ariaAttributes';
-import { inputFieldAttributesBasePropTypes } from '../../utils/devUtils/props/fieldAttributes';
+import { ariaAttributesBasePropTypes } from '../../utils/docUtils/ariaAttributes';
+import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
+import { statusPropTypes } from '../../utils/docUtils/statusProp';
 
 /**
  * Combines a checkbox, label, and helper text for a complete, form-ready solution.
@@ -87,7 +86,7 @@ var CheckboxField = /*#__PURE__*/forwardRef(function (props, ref) {
     id: helperTextId
   }, helperText));
 });
-CheckboxField.propTypes = _objectSpread(_objectSpread({
+CheckboxField.propTypes = _objectSpread(_objectSpread(_objectSpread({
   /** Whether the element should receive focus on render. */
   hasAutoFocus: PropTypes.bool,
   /** Text rendered below the input. */
@@ -115,8 +114,6 @@ CheckboxField.propTypes = _objectSpread(_objectSpread({
   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,
-  /** Determines the textarea status indicator and helper text styling. */
-  status: PropTypes.oneOf(_Object$values(statuses)),
   /** 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. */
@@ -131,6 +128,6 @@ CheckboxField.propTypes = _objectSpread(_objectSpread({
   onKeyDown: PropTypes.func,
   /** Handler that is called when a key is released. */
   onKeyUp: PropTypes.func
-}, ariaAttributesBasePropTypes), inputFieldAttributesBasePropTypes);
+}, statusPropTypes), ariaAttributesBasePropTypes), inputFieldAttributesBasePropTypes);
 CheckboxField.displayName = 'CheckboxField';
 export default CheckboxField;

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

@@ -8,16 +8,15 @@ import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/obje
 import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
 import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
 import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
-import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
 import _everyInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/every";
 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, { useEffect, useState } from 'react';
 import { Box, CheckboxField, Link, Text } from '../../index';
-import statuses from '../../utils/devUtils/constants/statuses';
-import { ariaAttributeBaseArgTypes } from '../../utils/devUtils/props/ariaAttributes';
-import { inputFieldAttributeBaseArgTypes } from '../../utils/devUtils/props/fieldAttributes';
+import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
+import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
+import { statusArgTypes } from '../../utils/docUtils/statusProp';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/CheckboxField',
@@ -29,7 +28,7 @@ export default {
       }
     }
   },
-  argTypes: _objectSpread(_objectSpread({
+  argTypes: _objectSpread(_objectSpread(_objectSpread({
     label: {
       control: {
         type: 'text'
@@ -46,13 +45,6 @@ export default {
         type: 'text'
       }
     },
-    status: {
-      control: {
-        type: 'select',
-        options: _Object$values(statuses)
-      },
-      defaultValue: statuses.DEFAULT
-    },
     name: {},
     id: {
       control: {
@@ -67,7 +59,7 @@ export default {
     isIndeterminate: {},
     isDefaultSelected: {},
     isSelected: {}
-  }, ariaAttributeBaseArgTypes), inputFieldAttributeBaseArgTypes)
+  }, statusArgTypes), ariaAttributeBaseArgTypes), inputFieldAttributeBaseArgTypes)
 };
 export var Default = function Default(args) {
   return ___EmotionJSX(CheckboxField, args);

package/lib/components/ColorField/ColorField.js

@@ -9,7 +9,6 @@ import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
-import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
 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 _context5, _context6; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context5 = ownKeys(Object(source), !0)).call(_context5, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context6 = ownKeys(Object(source))).call(_context6, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { forwardRef, useCallback, useImperativeHandle, useRef } from 'react';
@@ -21,9 +20,9 @@ import { useColorFieldState } from '@react-stately/color';
 import PropTypes from 'prop-types';
 import { Box, Button, FieldHelperText, Input, Label } from '../..';
 import useField from '../../hooks/useField';
-import statuses from '../../utils/devUtils/constants/statuses';
-import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/devUtils/props/ariaAttributes';
-import { inputFieldAttributesBasePropTypes } from '../../utils/devUtils/props/fieldAttributes';
+import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/docUtils/ariaAttributes';
+import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
+import { statusPropTypes } from '../../utils/docUtils/statusProp';
 import PopoverContainer from '../PopoverContainer';
 
 /**
@@ -128,7 +127,7 @@ var ColorField = /*#__PURE__*/forwardRef(function (props, ref) {
     onChange: handleColorChange
   }))));
 });
-ColorField.propTypes = _objectSpread(_objectSpread({
+ColorField.propTypes = _objectSpread(_objectSpread(_objectSpread({
   /** Alignment of the popover menu relative to the trigger. */
   align: PropTypes.oneOf(['start', 'end', 'middle']),
   /** Where the popover menu opens relative to its trigger. */
@@ -142,13 +141,11 @@ ColorField.propTypes = _objectSpread(_objectSpread({
    * (color, event) => void;
    */
   onChange: PropTypes.func,
-  /** Determines the helper text styling. */
-  status: PropTypes.oneOf(_Object$values(statuses)),
   /** Color controls what color is active on the color picker. */
   value: PropTypes.string,
   /** Props object that is spread into the Button element. */
   buttonProps: PropTypes.shape({})
-}, ariaAttributesBasePropTypes), inputFieldAttributesBasePropTypes);
+}, statusPropTypes), ariaAttributesBasePropTypes), inputFieldAttributesBasePropTypes);
 ColorField.defaultProps = {
   align: 'middle',
   direction: 'bottom'

package/lib/components/ColorField/ColorField.stories.js

@@ -14,9 +14,9 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context4, _context5; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context4 = ownKeys(Object(source), !0)).call(_context4, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context5 = ownKeys(Object(source))).call(_context5, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { useCallback, useState } from 'react';
 import { ColorField, OverlayProvider } from '../../index';
-import statuses from '../../utils/devUtils/constants/statuses';
-import { ariaAttributeBaseArgTypes } from '../../utils/devUtils/props/ariaAttributes';
-import { inputFieldAttributeBaseArgTypes } from '../../utils/devUtils/props/fieldAttributes';
+import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
+import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
+import { statusArgTypes } from '../../utils/docUtils/statusProp';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/ColorField',
@@ -28,7 +28,7 @@ export default {
       }
     }
   },
-  argTypes: _objectSpread(_objectSpread({
+  argTypes: _objectSpread(_objectSpread(_objectSpread({
     value: {
       control: {
         type: 'text'
@@ -45,13 +45,6 @@ export default {
         type: 'text'
       }
     },
-    status: {
-      control: {
-        type: 'select',
-        options: statuses
-      },
-      defaultValue: statuses.DEFAULT
-    },
     buttonProps: {
       control: {
         type: 'none'
@@ -68,7 +61,7 @@ export default {
         type: 'none'
       }
     }
-  }, ariaAttributeBaseArgTypes), inputFieldAttributeBaseArgTypes)
+  }, statusArgTypes), ariaAttributeBaseArgTypes), inputFieldAttributeBaseArgTypes)
 };
 export var Default = function Default(args) {
   var _useState = useState('rgba(127, 0, 127, 1)'),

package/lib/components/ComboBox/ComboBoxInput.js

@@ -23,8 +23,8 @@ import PropTypes from 'prop-types';
 import { Box, Button, Icon, Loader, TextField } from '../..';
 import { usePropWarning } from '../../hooks';
 import loadingStates from '../../utils/devUtils/constants/loadingStates';
-import statuses from '../../utils/devUtils/constants/statuses';
-import { ariaAttributesBasePropTypes } from '../../utils/devUtils/props/ariaAttributes';
+import { ariaAttributesBasePropTypes } from '../../utils/docUtils/ariaAttributes';
+import { statusPropTypes } from '../../utils/docUtils/statusProp';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var ComboBoxInput = /*#__PURE__*/forwardRef(function (props, ref) {
   var controlProps = props.controlProps,
@@ -144,7 +144,7 @@ var ComboBoxInput = /*#__PURE__*/forwardRef(function (props, ref) {
     }
   }))));
 });
-ComboBoxInput.propTypes = _objectSpread({
+ComboBoxInput.propTypes = _objectSpread(_objectSpread({
   containerProps: PropTypes.shape({}),
   controlProps: PropTypes.shape({}),
   hasAutoFocus: PropTypes.bool,
@@ -165,10 +165,9 @@ ComboBoxInput.propTypes = _objectSpread({
   onLoadMore: PropTypes.func,
   onOpenChange: PropTypes.func,
   onSelectionChange: PropTypes.func,
-  status: PropTypes.oneOf(_Object$values(statuses)),
   style: PropTypes.shape({}),
   triggerProps: PropTypes.shape({}),
   triggerRef: PropTypes.shape({}),
   wrapperProps: PropTypes.shape({})
-}, ariaAttributesBasePropTypes);
+}, statusPropTypes), ariaAttributesBasePropTypes);
 export default ComboBoxInput;

package/lib/components/ComboBoxField/ComboBoxField.js

@@ -25,8 +25,9 @@ import { useLayoutEffect, useResizeObserver } from '@react-aria/utils';
 import PropTypes from 'prop-types';
 import { usePropWarning } from '../../hooks';
 import loadingStates from '../../utils/devUtils/constants/loadingStates';
-import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/devUtils/props/ariaAttributes';
 import { isIterableProp } from '../../utils/devUtils/props/isIterable';
+import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/docUtils/ariaAttributes';
+import { statusPropTypes } from '../../utils/docUtils/statusProp';
 import ComboBoxInput from '../ComboBox';
 import ListBox from '../ListBox';
 import PopoverContainer from '../PopoverContainer';
@@ -219,7 +220,7 @@ var ComboBoxField = /*#__PURE__*/forwardRef(function (props, ref) {
     "aria-invalid": status === 'error' && true
   })), listBox);
 });
-ComboBoxField.propTypes = _objectSpread({
+ComboBoxField.propTypes = _objectSpread(_objectSpread({
   /* Whether or not adding new options to the list is enabled. */
   hasAddOption: PropTypes.bool,
   /** Whether the ComboBox allows a non-item matching input value to be set. */
@@ -242,8 +243,6 @@ ComboBoxField.propTypes = _objectSpread({
   direction: PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
   /** Text rendered below the input. */
   helperText: PropTypes.node,
-  /** Determines the input status indicator and helper text styling. */
-  status: PropTypes.oneOf(['default', 'success', 'warning', 'error']),
   /** The initial selected key in the collection (uncontrolled). */
   defaultSelectedKey: PropTypes.string,
   /** The currently selected key in the collection (controlled). */
@@ -339,7 +338,7 @@ ComboBoxField.propTypes = _objectSpread({
   controlProps: PropTypes.shape({
     onClick: PropTypes.func
   })
-}, ariaAttributesBasePropTypes);
+}, statusPropTypes), ariaAttributesBasePropTypes);
 ComboBoxField.defaultProps = {
   menuTrigger: 'focus',
   direction: 'bottom',

package/lib/components/ComboBoxField/ComboBoxField.stories.js

@@ -31,7 +31,7 @@ import { useFilter } from '@react-aria/i18n';
 import { action } from '@storybook/addon-actions';
 import { ComboBoxField, Item, OverlayProvider, Section } from '../../index';
 import loadingStates from '../../utils/devUtils/constants/loadingStates';
-import { ariaAttributeBaseArgTypes } from '../../utils/devUtils/props/ariaAttributes';
+import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var items = [{
   name: 'Aardvark',

package/lib/components/DataTable/DataTable.stories.js

@@ -35,7 +35,7 @@ import isChromatic from 'chromatic/isChromatic';
 import ApplicationIcon from 'mdi-react/ApplicationIcon';
 import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { DataTable, DataTableBadge, DataTableBody, DataTableCell, DataTableColumn, DataTableHeader, DataTableMenu, DataTableMultiLine, DataTableRow } from '../../index';
-import { ariaAttributeBaseArgTypes } from '../../utils/devUtils/props/ariaAttributes';
+import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
 import DataTableReadme from './DataTable.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {

package/lib/components/FieldHelperText/FieldHelperText.js

@@ -1,12 +1,21 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
 var _excluded = ["className", "status", "id"];
-import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
+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 } from 'react';
 import PropTypes from 'prop-types';
 import { useStatusClasses } from '../../hooks';
-import statuses from '../../utils/devUtils/constants/statuses';
+import { statusDefaultProp, statusPropTypes } from '../../utils/docUtils/statusProp';
 import Text from '../Text';
 
 /**
@@ -33,14 +42,10 @@ var FieldHelperText = /*#__PURE__*/forwardRef(function (props, ref) {
     className: classNames
   }));
 });
-FieldHelperText.propTypes = {
-  /** Determines the color of the field message. */
-  status: PropTypes.oneOf(_Object$values(statuses)),
+FieldHelperText.propTypes = _objectSpread({
   /** The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id). */
   id: PropTypes.string
-};
-FieldHelperText.defaultProps = {
-  status: statuses.DEFAULT
-};
+}, statusPropTypes);
+FieldHelperText.defaultProps = _objectSpread({}, statusDefaultProp);
 FieldHelperText.displayName = 'FieldHelperText';
 export default FieldHelperText;

package/lib/components/FieldHelperText/FieldHelperText.stories.js

@@ -1,19 +1,22 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+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 from 'react';
 import { FieldHelperText } from '../../index';
-import statuses from '../../utils/devUtils/constants/statuses';
+import { statusArgTypes } from '../../utils/docUtils/statusProp';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/Base Components/FieldHelperText',
   component: FieldHelperText,
-  argTypes: {
-    status: {
-      control: {
-        type: 'select',
-        options: statuses
-      },
-      defaultValue: statuses.DEFAULT
-    }
-  }
+  argTypes: _objectSpread({}, statusArgTypes)
 };
 export var Default = function Default(args) {
   return ___EmotionJSX(FieldHelperText, args, "Look at me!");

package/lib/components/FileInputField/FileInputField.js

@@ -16,7 +16,6 @@ import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance
 import _URL from "@babel/runtime-corejs3/core-js-stable/url";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
-import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
 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 _context2, _context3; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context2 = ownKeys(Object(source), !0)).call(_context2, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context3 = ownKeys(Object(source))).call(_context3, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState } from 'react';
@@ -28,8 +27,9 @@ import { Box, FieldHelperText, Input, Label, Loader } from '../..';
 import useField from '../../hooks/useField';
 import useStatusClasses from '../../hooks/useStatusClasses';
 import statuses from '../../utils/devUtils/constants/statuses';
-import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/devUtils/props/ariaAttributes';
-import { inputFieldAttributesBasePropTypes } from '../../utils/devUtils/props/fieldAttributes';
+import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/docUtils/ariaAttributes';
+import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
+import { statusDefaultProp, statusPropTypes } from '../../utils/docUtils/statusProp';
 import FileItem from './FileItem';
 import FileSelect from './FileSelect';
 
@@ -192,13 +192,11 @@ var FileInputField = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, helperText));
 });
 FileInputField.displayName = 'FileInputField';
-FileInputField.propTypes = _objectSpread(_objectSpread({
+FileInputField.propTypes = _objectSpread(_objectSpread(_objectSpread({
   /** The rendered label for the field. */
   label: PropTypes.node,
   /** Text rendered below the input. */
   helperText: PropTypes.node,
-  /** Determines the component border status color indicator and helper text styling. */
-  status: PropTypes.oneOf(_Object$values(statuses)),
   /** Default button text that will be changed on the file name once file is uploaded */
   defaultButtonText: PropTypes.string,
   /** Defines whether input can accept multiple files or not */
@@ -225,21 +223,19 @@ FileInputField.propTypes = _objectSpread(_objectSpread({
    *
    * }
    * */
-  fileList: PropTypes.arrayOf(PropTypes.shape({
+  fileList: PropTypes.arrayOf(PropTypes.shape(_objectSpread({
     fileObj: PropTypes.shape({}),
     id: PropTypes.string.isRequired,
     name: PropTypes.string.isRequired,
-    downloadLink: PropTypes.string,
-    status: PropTypes.oneOf(_Object$values(statuses))
-  })),
+    downloadLink: PropTypes.string
+  }, statusPropTypes))),
   /** Default array of objects for uploaded files. */
-  defaultFileList: PropTypes.arrayOf(PropTypes.shape({
+  defaultFileList: PropTypes.arrayOf(PropTypes.shape(_objectSpread({
     fileObj: PropTypes.shape({}),
     id: PropTypes.string.isRequired,
     name: PropTypes.string.isRequired,
-    downloadLink: PropTypes.string,
-    status: PropTypes.oneOf(_Object$values(statuses))
-  })),
+    downloadLink: PropTypes.string
+  }, statusPropTypes))),
   /** The handler that is called when the input files is uploaded.
    *
    * `(event, files) => void`
@@ -252,9 +248,8 @@ FileInputField.propTypes = _objectSpread(_objectSpread({
   onRemove: PropTypes.func,
   /** These props will be spread to the field text component. */
   textProps: PropTypes.shape({})
-}, ariaAttributesBasePropTypes), inputFieldAttributesBasePropTypes);
-FileInputField.defaultProps = {
-  defaultButtonText: 'Select a file',
-  status: statuses.DEFAULT
-};
+}, statusPropTypes), ariaAttributesBasePropTypes), inputFieldAttributesBasePropTypes);
+FileInputField.defaultProps = _objectSpread({
+  defaultButtonText: 'Select a file'
+}, statusDefaultProp);
 export default FileInputField;

package/lib/components/FileInputField/FileInputField.stories.js

@@ -15,8 +15,9 @@ import React, { useState } from 'react';
 import { v4 as uuidv4 } from 'uuid';
 import { Box, FileInputField } from '../../index';
 import statuses from '../../utils/devUtils/constants/statuses';
-import { ariaAttributeBaseArgTypes } from '../../utils/devUtils/props/ariaAttributes';
-import { inputFieldAttributeBaseArgTypes } from '../../utils/devUtils/props/fieldAttributes';
+import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
+import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
+import { statusArgTypes } from '../../utils/docUtils/statusProp';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/FileInputField',
@@ -28,7 +29,7 @@ export default {
       }
     }
   },
-  argTypes: _objectSpread(_objectSpread({
+  argTypes: _objectSpread(_objectSpread(_objectSpread({
     label: {
       control: {
         type: 'text'
@@ -40,13 +41,6 @@ export default {
         type: 'text'
       }
     },
-    status: {
-      control: {
-        type: 'select',
-        options: statuses
-      },
-      defaultValue: statuses.DEFAULT
-    },
     defaultButtonText: {
       control: {
         type: 'text'
@@ -82,7 +76,7 @@ export default {
         type: 'none'
       }
     }
-  }, ariaAttributeBaseArgTypes), inputFieldAttributeBaseArgTypes)
+  }, statusArgTypes), ariaAttributeBaseArgTypes), inputFieldAttributeBaseArgTypes)
 };
 var fitContentWidthSx = {
   width: 'fit-content'

package/lib/components/FileInputField/FileItem.js

@@ -1,5 +1,15 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
+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, { useCallback, useRef } from 'react';
 import { useVisuallyHidden } from 'react-aria';
 import DeleteIcon from 'mdi-react/DeleteIcon';
@@ -8,6 +18,7 @@ import InsertDriveFileIcon from 'mdi-react/InsertDriveFileIcon';
 import PropTypes from 'prop-types';
 import { Box, Button, Icon, IconButton, Text } from '../../index';
 import statuses from '../../utils/devUtils/constants/statuses';
+import { statusPropTypes } from '../../utils/docUtils/statusProp';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var FileItem = function FileItem(props) {
   var downloadLink = props.downloadLink,
@@ -85,13 +96,12 @@ var FileItem = function FileItem(props) {
   })));
 };
 export default FileItem;
-FileItem.propTypes = {
+FileItem.propTypes = _objectSpread({
   downloadLink: PropTypes.string,
   handleFileDelete: PropTypes.func,
   id: PropTypes.string,
   isDisabled: PropTypes.bool,
   name: PropTypes.string,
   helperTextId: PropTypes.string,
-  status: PropTypes.oneOf(_Object$values(statuses)),
   textProps: PropTypes.shape({})
-};
+}, statusPropTypes);

package/lib/components/FileInputField/FileSelect.js

@@ -15,7 +15,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Button, Text } from '../..';
-import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/devUtils/props/ariaAttributes';
+import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/docUtils/ariaAttributes';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var FileSelect = function FileSelect(_ref) {
   var buttonText = _ref.buttonText,

package/lib/components/Icon/NoticeIcon.js

@@ -1,17 +1,26 @@
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
+import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
+import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 var _excluded = ["status"];
 var _noticeIcons;
-import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
+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 from 'react';
 import AlertCircleIcon from 'mdi-react/AlertCircleIcon';
 import AlertIcon from 'mdi-react/AlertIcon';
 import CheckCircleIcon from 'mdi-react/CheckCircleIcon';
 import InformationIcon from 'mdi-react/InformationIcon';
-import PropTypes from 'prop-types';
 import { Icon } from '../..';
 import statuses from '../../utils/devUtils/constants/statuses';
+import { statusPropTypes } from '../../utils/docUtils/statusProp';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export var noticeIcons = (_noticeIcons = {}, _defineProperty(_noticeIcons, statuses.DEFAULT, {
   icon: InformationIcon,
@@ -35,6 +44,4 @@ export var NoticeIcon = function NoticeIcon(_ref) {
     icon: noticeIcons[status].icon
   }, others));
 };
-NoticeIcon.propTypes = {
-  status: PropTypes.oneOf(_Object$values(statuses))
-};
+NoticeIcon.propTypes = _objectSpread({}, statusPropTypes);