@pingux/astro 2.5.6-alpha.1 → 2.5.7-alpha.0

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.5.6](https://gitlab.corp.pingidentity.com/ux/pingux/compare/@pingux/astro@2.5.5...@pingux/astro@2.5.6) (2023-06-22)
+
+**Note:** Version bump only for package @pingux/astro
+
+
+
+
+
 ## [2.5.5](https://gitlab.corp.pingidentity.com/ux/pingux/compare/@pingux/astro@2.5.4...@pingux/astro@2.5.5) (2023-06-20)
 
 

package/lib/cjs/components/ArrayField/ArrayField.js

@@ -38,10 +38,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "functi
 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 = _filterInstanceProperty2(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context3, _context4; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context3 = ownKeys(Object(source), !0)).call(_context3, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context4 = ownKeys(Object(source))).call(_context4, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-/**
- * Displays array collections providing useful functions and
- * optimizations for arrays.
- */
 var ArrayField = function ArrayField(props) {
   var _context2;
   var addButtonLabel = props.addButtonLabel,

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

@@ -22,8 +22,10 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/he
 var _react = _interopRequireDefault(require("react"));
 var _reactAria = require("react-aria");
 var _uuid = require("uuid");
+var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/storybookDocsLayout"));
 var _index = require("../../index");
 var _ariaAttributes = require("../../utils/docUtils/ariaAttributes");
+var _ArrayField = _interopRequireDefault(require("./ArrayField.mdx"));
 var _react2 = require("@emotion/react");
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty2(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) { (0, _defineProperty2["default"])(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; }
@@ -35,6 +37,9 @@ var _default = {
       argTypesRegex: '^on.*'
     },
     docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_ArrayField["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
       source: {
         type: 'code'
       }

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

@@ -33,12 +33,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "functi
 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.
- *
- * Utilizes [useCheckbox](https://react-spectrum.adobe.com/react-aria/useCheckbox.html) from React Aria and
- * [useToggleState](https://react-spectrum.adobe.com/react-stately/useToggleState.html) from React Stately.
- */
 var CheckboxField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var label = props.label,
     _props$controlProps = props.controlProps,

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

@@ -20,10 +20,12 @@ var _every = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stab
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
+var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/storybookDocsLayout"));
 var _index = require("../../index");
 var _ariaAttributes = require("../../utils/docUtils/ariaAttributes");
 var _fieldAttributes = require("../../utils/docUtils/fieldAttributes");
 var _statusProp = require("../../utils/docUtils/statusProp");
+var _CheckboxField = _interopRequireDefault(require("./CheckboxField.mdx"));
 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; }
@@ -34,6 +36,9 @@ var _default = {
   component: _index.CheckboxField,
   parameters: {
     docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_CheckboxField["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
       source: {
         type: 'code'
       }

package/lib/cjs/components/ColorField/ColorField.js

@@ -36,15 +36,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "functi
 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 _context5, _context6; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context5 = ownKeys(Object(source), !0)).call(_context5, function (key) { (0, _defineProperty2["default"])(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; }
-/**
- * The Color Field component allows the user to pick a color and displays the chosen color.
- *
- * Utilizes [useColorField](https://react-spectrum.adobe.com/react-aria/useColorField.html) from React Aria and
- * [useColorFieldState](https://react-spectrum.adobe.com/react-stately/useColorFieldState.html) from React Stately.
- *
- * Using [React Color](https://casesandberg.github.io/react-color/) as a color picker.
- */
-
 var ColorField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _context;
   var align = props.align,

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

@@ -20,10 +20,12 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/e
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
+var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/storybookDocsLayout"));
 var _index = require("../../index");
 var _ariaAttributes = require("../../utils/docUtils/ariaAttributes");
 var _fieldAttributes = require("../../utils/docUtils/fieldAttributes");
 var _statusProp = require("../../utils/docUtils/statusProp");
+var _ColorField = _interopRequireDefault(require("./ColorField.mdx"));
 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; }
@@ -34,6 +36,9 @@ var _default = {
   component: _index.ColorField,
   parameters: {
     docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_ColorField["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
       source: {
         type: 'code'
       }

package/lib/cjs/components/ComboBoxField/ComboBoxField.js

@@ -44,15 +44,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "functi
 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 _context2, _context3; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context2 = ownKeys(Object(source), !0)).call(_context2, function (key) { (0, _defineProperty2["default"])(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; }
-/**
- * Combines an input with a listbox for a filterable dropdown list.
- *
- * Utilizes [useComboBox](https://react-spectrum.adobe.com/react-aria/useComboBox.html) from React
- * Aria and [useComboBoxState](https://react-spectrum.adobe.com/react-stately/useComboBoxState.html)
- * from React Stately.
- *
- * Props not specified are passed along to the underlying `TextField` component.
- */
 var ComboBoxField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var hasAutoFocus = props.hasAutoFocus,
     hasAddOption = props.hasAddOption,

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

@@ -36,9 +36,11 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactStately = require("react-stately");
 var _i18n = require("@react-aria/i18n");
 var _addonActions = require("@storybook/addon-actions");
+var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/storybookDocsLayout"));
 var _index = require("../../index");
 var _loadingStates = _interopRequireDefault(require("../../utils/devUtils/constants/loadingStates"));
 var _ariaAttributes = require("../../utils/docUtils/ariaAttributes");
+var _ComboBoxField = _interopRequireDefault(require("./ComboBoxField.mdx"));
 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; }
@@ -145,6 +147,9 @@ var _default = {
   component: _index.ComboBoxField,
   parameters: {
     docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_ComboBoxField["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
       source: {
         type: 'code'
       }

package/lib/cjs/components/FileInputField/FileInputField.js

@@ -45,13 +45,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "functi
 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 = _filterInstanceProperty2(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) { (0, _defineProperty2["default"])(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; }
-/**
- * The FileInputField component allows users to upload one or more files by
- * clicking the button or via drag and drop.
- *
- * We utilize [react-dropzone](https://react-dropzone.js.org/) for the drag and drop functionality.
- * */
-
 var FileInputField = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var defaultButtonText = _ref.defaultButtonText,
     defaultFileList = _ref.defaultFileList,

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

@@ -20,11 +20,13 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/e
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _uuid = require("uuid");
+var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/storybookDocsLayout"));
 var _index = require("../../index");
 var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
 var _ariaAttributes = require("../../utils/docUtils/ariaAttributes");
 var _fieldAttributes = require("../../utils/docUtils/fieldAttributes");
 var _statusProp = require("../../utils/docUtils/statusProp");
+var _FileInputField = _interopRequireDefault(require("./FileInputField.mdx"));
 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; }
@@ -35,6 +37,9 @@ var _default = {
   component: _index.FileInputField,
   parameters: {
     docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_FileInputField["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/ArrayField/ArrayField.js

@@ -25,11 +25,6 @@ import statuses from '../../utils/devUtils/constants/statuses';
 import isValidPositiveInt from '../../utils/devUtils/props/isValidPositiveInt';
 import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/docUtils/ariaAttributes';
 import { statusPropTypes } from '../../utils/docUtils/statusProp';
-
-/**
- * Displays array collections providing useful functions and
- * optimizations for arrays.
- */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var ArrayField = function ArrayField(props) {
   var _context2;

package/lib/components/ArrayField/ArrayField.stories.js

@@ -16,8 +16,10 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import React from 'react';
 import { OverlayProvider } from 'react-aria';
 import { v4 as uuid } from 'uuid';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { ArrayField, ArrayFieldDeleteButton, Item, SelectField, TextField } from '../../index';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
+import ArrayFieldReadme from './ArrayField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/ArrayField',
@@ -27,6 +29,9 @@ export default {
       argTypesRegex: '^on.*'
     },
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(ArrayFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/CheckboxField/CheckboxField.js

@@ -21,13 +21,6 @@ import { useField, usePropWarning } from '../../hooks';
 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.
- *
- * Utilizes [useCheckbox](https://react-spectrum.adobe.com/react-aria/useCheckbox.html) from React Aria and
- * [useToggleState](https://react-spectrum.adobe.com/react-stately/useToggleState.html) from React Stately.
- */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var CheckboxField = /*#__PURE__*/forwardRef(function (props, ref) {
   var label = props.label,

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

@@ -13,16 +13,21 @@ import _everyInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instan
 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 DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { Box, CheckboxField, Link, Text } from '../../index';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusArgTypes } from '../../utils/docUtils/statusProp';
+import CheckboxFieldReadme from './CheckboxField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/CheckboxField',
   component: CheckboxField,
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(CheckboxFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/ColorField/ColorField.js

@@ -24,15 +24,6 @@ import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/
 import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusPropTypes } from '../../utils/docUtils/statusProp';
 import PopoverContainer from '../PopoverContainer';
-
-/**
- * The Color Field component allows the user to pick a color and displays the chosen color.
- *
- * Utilizes [useColorField](https://react-spectrum.adobe.com/react-aria/useColorField.html) from React Aria and
- * [useColorFieldState](https://react-spectrum.adobe.com/react-stately/useColorFieldState.html) from React Stately.
- *
- * Using [React Color](https://casesandberg.github.io/react-color/) as a color picker.
- */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var ColorField = /*#__PURE__*/forwardRef(function (props, ref) {
   var _context;

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

@@ -13,16 +13,21 @@ import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/insta
 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 _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 DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { ColorField, OverlayProvider } from '../../index';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusArgTypes } from '../../utils/docUtils/statusProp';
+import ColorFieldReadme from './ColorField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/ColorField',
   component: ColorField,
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(ColorFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/ComboBoxField/ComboBoxField.js

@@ -32,16 +32,6 @@ import ComboBoxInput from '../ComboBox';
 import ListBox from '../ListBox';
 import PopoverContainer from '../PopoverContainer';
 import ScrollBox from '../ScrollBox';
-
-/**
- * Combines an input with a listbox for a filterable dropdown list.
- *
- * Utilizes [useComboBox](https://react-spectrum.adobe.com/react-aria/useComboBox.html) from React
- * Aria and [useComboBoxState](https://react-spectrum.adobe.com/react-stately/useComboBoxState.html)
- * from React Stately.
- *
- * Props not specified are passed along to the underlying `TextField` component.
- */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var ComboBoxField = /*#__PURE__*/forwardRef(function (props, ref) {
   var hasAutoFocus = props.hasAutoFocus,

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

@@ -29,9 +29,11 @@ import React, { useState } from 'react';
 import { useAsyncList } from 'react-stately';
 import { useFilter } from '@react-aria/i18n';
 import { action } from '@storybook/addon-actions';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { ComboBoxField, Item, OverlayProvider, Section } from '../../index';
 import loadingStates from '../../utils/devUtils/constants/loadingStates';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
+import ComboBoxFieldReadme from './ComboBoxField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var items = [{
   name: 'Aardvark',
@@ -133,6 +135,9 @@ export default {
   component: ComboBoxField,
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(ComboBoxFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/FileInputField/FileInputField.js

@@ -32,13 +32,6 @@ import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAtt
 import { statusDefaultProp, statusPropTypes } from '../../utils/docUtils/statusProp';
 import FileItem from './FileItem';
 import FileSelect from './FileSelect';
-
-/**
- * The FileInputField component allows users to upload one or more files by
- * clicking the button or via drag and drop.
- *
- * We utilize [react-dropzone](https://react-dropzone.js.org/) for the drag and drop functionality.
- * */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var FileInputField = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var defaultButtonText = _ref.defaultButtonText,

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

@@ -13,17 +13,22 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (
 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, { useState } from 'react';
 import { v4 as uuidv4 } from 'uuid';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { Box, FileInputField } 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';
+import FileInputFieldReadme from './FileInputField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/FileInputField',
   component: FileInputField,
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(FileInputFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.5.6-alpha.1",
+  "version": "2.5.7-alpha.0",
   "description": "PingUX themeable React component library",
   "repository": {
     "type": "git",