@pingux/astro 2.8.2-alpha.2 → 2.8.2-alpha.4

package/lib/cjs/components/ImageUploadField/ImageUploadField.js

@@ -33,9 +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; }
-/**
- * The Image Upload Field component gives users the ability to upload a file (image by default).
- */
 var ImageUploadField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var isLoading = props.isLoading,
     loaderSize = props.loaderSize,

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

@@ -28,10 +28,12 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime-corejs3/
 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 _ImageUploadField = _interopRequireDefault(require("./ImageUploadField.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; }
@@ -43,6 +45,9 @@ var _default = {
   component: _index.ImageUploadField,
   parameters: {
     docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_ImageUploadField["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
       source: {
         type: 'code'
       }

package/lib/cjs/components/LinkSelectField/LinkSelectField.js

@@ -35,13 +35,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; }
-/**
- * Select field (dropdown) that does not rely on native browser or mobile implementations.
- *
- * Utilizes [useSelect](https://react-spectrum.adobe.com/react-aria/useSelect.html) from React Aria
- * and [useSelectState](https://react-spectrum.adobe.com/react-stately/useSelectState.html) from
- * React Stately.
- */
 var LinkSelectField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var placeholder = props.placeholder,
     isDisabled = props.isDisabled,

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

@@ -33,10 +33,12 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/he
 var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
 var _reactStately = require("react-stately");
+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 _LinkSelectField = _interopRequireDefault(require("./LinkSelectField.mdx"));
 var _react2 = require("@emotion/react");
 var _context, _context2;
 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); }
@@ -49,6 +51,9 @@ var _default = {
   component: _index.LinkSelectField,
   parameters: {
     docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_LinkSelectField["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
       source: {
         type: 'code'
       }

package/lib/cjs/components/MultivaluesField/MultivaluesField.js

@@ -49,15 +49,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 _context11, _context12; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context11 = ownKeys(Object(source), !0)).call(_context11, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context12 = ownKeys(Object(source))).call(_context12, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-/**
- * Complex control that lets you choose several tags from the dropdown list.
- * Or to add your own values in non-restrictive mode.
- *
- * Combines an input with a Listbox for a filterable dropdown list.
- *
- * Utilizes [useListState](https://react-spectrum.adobe.com/react-stately/useListState.html) from React
- * Stately.
- */
 var MultivaluesField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _context8, _listBoxRef$current;
   var defaultSelectedKeys = props.defaultSelectedKeys,

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

@@ -19,10 +19,12 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/hel
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 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 _MultivaluesField = _interopRequireDefault(require("./MultivaluesField.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; }
@@ -74,6 +76,9 @@ var _default = {
   }, _statusProp.statusArgTypes), _ariaAttributes.ariaAttributeBaseArgTypes), _fieldAttributes.inputFieldAttributeBaseArgTypes),
   parameters: {
     docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_MultivaluesField["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
       source: {
         type: 'code'
       }

package/lib/cjs/components/NumberField/NumberField.js

@@ -38,15 +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 = _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; }
-/**
- * Number fields allow users to enter a number, and increment or
- * decrement the value using stepper buttons.
- *
- * Utilizes [useNumberField](https://react-spectrum.adobe.com/react-aria/useNumberField.html) from React Aria
- * and [useNumberFieldState](https://react-spectrum.adobe.com/react-stately/useNumberFieldState.html) from
- * React Stately.
- */
-
 var NumberField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var helperText = props.helperText,
     status = props.status,

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

@@ -18,10 +18,12 @@ exports["default"] = exports.WithHelperText = exports.Units = exports.StepValues
 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 _NumberField = _interopRequireDefault(require("./NumberField.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; }
@@ -32,6 +34,9 @@ var _default = {
   component: _index.NumberField,
   parameters: {
     docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_NumberField["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
       source: {
         type: 'code'
       }

package/lib/cjs/components/PasswordField/PasswordField.js

@@ -44,10 +44,6 @@ var ARIA_LABELS_FOR_SHOW_PASSWORD_TOGGLE = {
   HIDE: 'hide password',
   SHOW: 'show password'
 };
-
-/**
-  * Combines a text input, label, IconButton and helper text for a complete, form-ready solution.
- */
 var PasswordField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var helperText = props.helperText,
     isVisibleProp = props.isVisible,

package/lib/cjs/components/PasswordField/PasswordField.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 _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
+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 _PasswordField = _interopRequireDefault(require("./PasswordField.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.PasswordField,
   parameters: {
     docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_PasswordField["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
       source: {
         type: 'code'
       }

package/lib/cjs/experimental/SaveBar/SaveBar.stories.js

@@ -9,27 +9,26 @@ exports["default"] = exports.WithRefreshButton = exports.WithChildren = exports.
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/storybookDocsLayout"));
-var _index = require("../../index");
-var _SaveBar = _interopRequireDefault(require("./SaveBar"));
-var _SaveBar2 = _interopRequireDefault(require("./SaveBar.mdx"));
+var _ = require("../..");
+var _SaveBar = _interopRequireDefault(require("./SaveBar.mdx"));
 var _react2 = require("@emotion/react");
 var _default = {
   title: 'Experimental/SaveBar',
-  component: _SaveBar["default"],
+  component: _.SaveBar,
   parameters: {
     docs: {
       source: {
         type: 'code'
       },
       page: function page() {
-        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_SaveBar2["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_SaveBar["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
       }
     }
   }
 };
 exports["default"] = _default;
 var Default = function Default(args) {
-  return (0, _react2.jsx)(_SaveBar["default"], (0, _extends2["default"])({
+  return (0, _react2.jsx)(_.SaveBar, (0, _extends2["default"])({
     saveButtonProps: {
       key: 'save button',
       text: 'Save',
@@ -48,7 +47,7 @@ var Default = function Default(args) {
 };
 exports.Default = Default;
 var WithRefreshButton = function WithRefreshButton(args) {
-  return (0, _react2.jsx)(_SaveBar["default"], (0, _extends2["default"])({
+  return (0, _react2.jsx)(_.SaveBar, (0, _extends2["default"])({
     saveButtonProps: {
       key: 'save button',
       text: 'Save',
@@ -74,7 +73,7 @@ var WithRefreshButton = function WithRefreshButton(args) {
 };
 exports.WithRefreshButton = WithRefreshButton;
 var JustifiedRight = function JustifiedRight() {
-  return (0, _react2.jsx)(_SaveBar["default"], {
+  return (0, _react2.jsx)(_.SaveBar, {
     saveButtonProps: {
       key: 'next button',
       text: 'Next',
@@ -94,7 +93,7 @@ var JustifiedRight = function JustifiedRight() {
 };
 exports.JustifiedRight = JustifiedRight;
 var WithChildren = function WithChildren(args) {
-  return (0, _react2.jsx)(_SaveBar["default"], args, (0, _react2.jsx)(_index.Button, null, "Custom Button!"), (0, _react2.jsx)(_index.Button, {
+  return (0, _react2.jsx)(_.SaveBar, args, (0, _react2.jsx)(_.Button, null, "Custom Button!"), (0, _react2.jsx)(_.Button, {
     variant: "link"
   }, "Custom Link!"));
 };

package/lib/cjs/experimental/SaveBar/SaveBar.test.js

@@ -3,9 +3,9 @@
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
 var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
 var _testWrapper = require("../../utils/testUtils/testWrapper");
-var _ = _interopRequireDefault(require("."));
 var _react2 = require("@emotion/react");
 var testId = 'test-SaveBar';
 var saveButtonProps = {
@@ -36,15 +36,15 @@ var defaultProps = {
 };
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return (0, _testWrapper.render)((0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, defaultProps, props)));
+  return (0, _testWrapper.render)((0, _react2.jsx)(_.SaveBar, (0, _extends2["default"])({}, defaultProps, props)));
 };
 var getComponentCustomChildren = function getComponentCustomChildren() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return (0, _testWrapper.render)((0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, defaultProps, props), (0, _react2.jsx)("button", null, "custom text"), (0, _react2.jsx)("button", null, "Also custom text")));
+  return (0, _testWrapper.render)((0, _react2.jsx)(_.SaveBar, (0, _extends2["default"])({}, defaultProps, props), (0, _react2.jsx)("button", null, "custom text"), (0, _react2.jsx)("button", null, "Also custom text")));
 };
 var getComponentTextChildren = function getComponentTextChildren() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return (0, _testWrapper.render)((0, _react2.jsx)(_["default"], props, "custom text"));
+  return (0, _testWrapper.render)((0, _react2.jsx)(_.SaveBar, props, "custom text"));
 };
 (0, _testAxe["default"])(getComponent);
 afterEach(function () {

package/lib/cjs/index.js

@@ -112,7 +112,8 @@ var _exportNames = {
   ListViewItemEditButton: true,
   ListViewItemMenu: true,
   ListViewItemSwitchField: true,
-  ListViewItem: true
+  ListViewItem: true,
+  SaveBar: true
 };
 _Object$defineProperty(exports, "AccordionGridGroup", {
   enumerable: true,
@@ -564,6 +565,12 @@ _Object$defineProperty(exports, "RockerButtonGroup", {
     return _RockerButtonGroup["default"];
   }
 });
+_Object$defineProperty(exports, "SaveBar", {
+  enumerable: true,
+  get: function get() {
+    return _SaveBar["default"];
+  }
+});
 _Object$defineProperty(exports, "ScrollBox", {
   enumerable: true,
   get: function get() {
@@ -1602,5 +1609,6 @@ var _ListViewItemEditButton = _interopRequireDefault(require("./experimental/Lis
 var _ListViewItemMenu = _interopRequireDefault(require("./experimental/ListViewItem/controls/ListViewItemMenu"));
 var _ListViewItemSwitchField = _interopRequireDefault(require("./experimental/ListViewItem/controls/ListViewItemSwitchField"));
 var _ListViewItem = _interopRequireDefault(require("./experimental/ListViewItem/ListViewItem"));
+var _SaveBar = _interopRequireDefault(require("./experimental/SaveBar/SaveBar"));
 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; }

package/lib/components/ImageUploadField/ImageUploadField.js

@@ -21,10 +21,6 @@ import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAtt
 import { statusPropTypes } from '../../utils/docUtils/statusProp';
 import ImagePreviewButton from './ImagePreviewButton';
 import ImageUploadFieldBase from './ImageUploadFieldBase';
-
-/**
- * The Image Upload Field component gives users the ability to upload a file (image by default).
- */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var ImageUploadField = /*#__PURE__*/forwardRef(function (props, ref) {
   var isLoading = props.isLoading,

package/lib/components/ImageUploadField/ImageUploadField.stories.js

@@ -22,16 +22,21 @@ import _setTimeout from "@babel/runtime-corejs3/core-js-stable/set-timeout";
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context3, _context4; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context3 = ownKeys(Object(source), !0)).call(_context3, function (key) { _defineProperty(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; }
 import React, { useRef, useState } from 'react';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { Image, ImageUploadField, OverlayProvider } from '../../index';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusArgTypes } from '../../utils/docUtils/statusProp';
+import ImageUploadFieldReadme from './ImageUploadField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/ImageUploadField',
   component: ImageUploadField,
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(ImageUploadFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/LinkSelectField/LinkSelectField.js

@@ -23,14 +23,6 @@ import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/
 import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusDefaultProp, statusPropTypes } from '../../utils/docUtils/statusProp';
 import SelectFieldBase from '../SelectFieldBase';
-
-/**
- * Select field (dropdown) that does not rely on native browser or mobile implementations.
- *
- * Utilizes [useSelect](https://react-spectrum.adobe.com/react-aria/useSelect.html) from React Aria
- * and [useSelectState](https://react-spectrum.adobe.com/react-stately/useSelectState.html) from
- * React Stately.
- */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var LinkSelectField = /*#__PURE__*/forwardRef(function (props, ref) {
   var placeholder = props.placeholder,

package/lib/components/LinkSelectField/LinkSelectField.stories.js

@@ -28,16 +28,21 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import React, { useState } from 'react';
 import { OverlayProvider } from 'react-aria';
 import { useAsyncList } from 'react-stately';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { Box, Item, LinkSelectField, Separator } from '../../index';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusArgTypes } from '../../utils/docUtils/statusProp';
+import LinkSelectFieldReadme from './LinkSelectField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/LinkSelectField',
   component: LinkSelectField,
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(LinkSelectFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/MultivaluesField/MultivaluesField.js

@@ -36,16 +36,6 @@ import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/
 import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusDefaultProp, statusPropTypes } from '../../utils/docUtils/statusProp';
 import ListBox from '../ListBox';
-
-/**
- * Complex control that lets you choose several tags from the dropdown list.
- * Or to add your own values in non-restrictive mode.
- *
- * Combines an input with a Listbox for a filterable dropdown list.
- *
- * Utilizes [useListState](https://react-spectrum.adobe.com/react-stately/useListState.html) from React
- * Stately.
- */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var MultivaluesField = /*#__PURE__*/forwardRef(function (props, ref) {
   var _context8, _listBoxRef$current;

package/lib/components/MultivaluesField/MultivaluesField.stories.js

@@ -12,10 +12,12 @@ 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, { useState } from 'react';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { Box, Icon, Item, MultivaluesField, OverlayProvider } from '../../index';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusArgTypes } from '../../utils/docUtils/statusProp';
+import MultivaluesFieldReadme from './MultivaluesField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/MultivaluesField',
@@ -63,6 +65,9 @@ export default {
   }, statusArgTypes), ariaAttributeBaseArgTypes), inputFieldAttributeBaseArgTypes),
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(MultivaluesFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/NumberField/NumberField.js

@@ -26,15 +26,6 @@ import useHiddenNumberFieldValue from '../../hooks/useHiddenNumberFieldValue';
 import { ariaAttributesBasePropTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusPropTypes } from '../../utils/docUtils/statusProp';
-
-/**
- * Number fields allow users to enter a number, and increment or
- * decrement the value using stepper buttons.
- *
- * Utilizes [useNumberField](https://react-spectrum.adobe.com/react-aria/useNumberField.html) from React Aria
- * and [useNumberFieldState](https://react-spectrum.adobe.com/react-stately/useNumberFieldState.html) from
- * React Stately.
- */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var NumberField = /*#__PURE__*/forwardRef(function (props, ref) {
   var helperText = props.helperText,

package/lib/components/NumberField/NumberField.stories.js

@@ -11,16 +11,21 @@ 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, { useState } from 'react';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { NumberField } from '../../index';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusArgTypes } from '../../utils/docUtils/statusProp';
+import NumberFieldReadme from './NumberField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/NumberField',
   component: NumberField,
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(NumberFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/PasswordField/PasswordField.js

@@ -32,10 +32,6 @@ var ARIA_LABELS_FOR_SHOW_PASSWORD_TOGGLE = {
   HIDE: 'hide password',
   SHOW: 'show password'
 };
-
-/**
-  * Combines a text input, label, IconButton and helper text for a complete, form-ready solution.
- */
 var PasswordField = /*#__PURE__*/forwardRef(function (props, ref) {
   var helperText = props.helperText,
     isVisibleProp = props.isVisible,

package/lib/components/PasswordField/PasswordField.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 isEmpty from 'lodash/isEmpty';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { PasswordField } 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 PasswordFieldReadme from './PasswordField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/PasswordField',
   component: PasswordField,
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(PasswordFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/experimental/SaveBar/SaveBar.stories.js

@@ -1,8 +1,7 @@
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import React from 'react';
 import DocsLayout from '../../../.storybook/storybookDocsLayout';
-import { Button } from '../../index';
-import SaveBar from './SaveBar';
+import { Button, SaveBar } from '../..';
 import SaveBarReadme from './SaveBar.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {

package/lib/experimental/SaveBar/SaveBar.test.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import React from 'react';
+import { SaveBar } from '../..';
 import axeTest from '../../utils/testUtils/testAxe';
 import { render, screen } from '../../utils/testUtils/testWrapper';
-import SaveBar from '.';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var testId = 'test-SaveBar';
 var saveButtonProps = {

package/lib/index.js

@@ -170,4 +170,5 @@ export { TableBody as DataTableBody, Cell as DataTableCell, Column as DataTableC
 export { default as ListViewItemEditButton } from './experimental/ListViewItem/controls/ListViewItemEditButton';
 export { default as ListViewItemMenu } from './experimental/ListViewItem/controls/ListViewItemMenu';
 export { default as ListViewItemSwitchField } from './experimental/ListViewItem/controls/ListViewItemSwitchField';
-export { default as ListViewItem } from './experimental/ListViewItem/ListViewItem';
+export { default as ListViewItem } from './experimental/ListViewItem/ListViewItem';
+export { default as SaveBar } from './experimental/SaveBar/SaveBar';

package/package.json

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