@pingux/astro 1.42.2 → 2.0.0-alpha.4

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

@@ -1,58 +1,33 @@
 "use strict";
 
 var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
 var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = exports.InnerPanel = exports.Expandable = exports.Default = exports.CustomWidth = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
-
+var _objectDestructuringEmpty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectDestructuringEmpty"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _react = _interopRequireWildcard(require("react"));
-
-var _collections = require("@react-stately/collections");
-
-var _ArrowTopRightBottomLeftIcon = _interopRequireDefault(require("mdi-react/ArrowTopRightBottomLeftIcon"));
-
 var _ArrowCollapseIcon = _interopRequireDefault(require("mdi-react/ArrowCollapseIcon"));
-
+var _ArrowTopRightBottomLeftIcon = _interopRequireDefault(require("mdi-react/ArrowTopRightBottomLeftIcon"));
+var _ChevronRightIcon = _interopRequireDefault(require("mdi-react/ChevronRightIcon"));
 var _CloseIcon = _interopRequireDefault(require("mdi-react/CloseIcon"));
-
 var _CogIcon = _interopRequireDefault(require("mdi-react/CogIcon"));
-
-var _ChevronRightIcon = _interopRequireDefault(require("mdi-react/ChevronRightIcon"));
-
 var _hooks = require("../../hooks");
-
-var _OverlayPanel = _interopRequireDefault(require("./OverlayPanel"));
-
 var _index = require("../../index");
-
-var _panelSizes = require("../../utils/devUtils/constants/panelSizes");
-
 var _images = require("../../utils/devUtils/constants/images");
-
+var _panelSizes = require("../../utils/devUtils/constants/panelSizes");
 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; }
-
 var _default = {
   title: 'Components/OverlayPanel',
-  component: _OverlayPanel["default"],
+  component: _index.OverlayPanel,
   argTypes: {
     children: {
       description: 'Overlay panel content.',
@@ -78,22 +53,20 @@ var _default = {
   }
 };
 exports["default"] = _default;
-
 var Default = function Default(_ref) {
-  var args = (0, _extends2["default"])({}, _ref);
-
+  var args = (0, _extends2["default"])({}, ((0, _objectDestructuringEmpty2["default"])(_ref), _ref));
   var _useOverlayPanelState = (0, _hooks.useOverlayPanelState)(),
-      state = _useOverlayPanelState.state,
-      onClose = _useOverlayPanelState.onClose;
-
+    state = _useOverlayPanelState.state,
+    onClose = _useOverlayPanelState.onClose;
   var triggerRef = (0, _react.useRef)();
-  return (// Application must be wrapped in an OverlayProvider so that it can be hidden from screen
+  return (
+    // Application must be wrapped in an OverlayProvider so that it can be hidden from screen
     // readers when an overlay is open.
     (0, _react2.jsx)(_index.OverlayProvider, null, (0, _react2.jsx)(_index.Text, null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur."), (0, _react2.jsx)("br", null), (0, _react2.jsx)(_index.Button, {
       ref: triggerRef,
       onPress: state.open,
       "aria-expanded": state.isOpen
-    }, "Open Panel"), state.isOpen && (0, _react2.jsx)(_OverlayPanel["default"], (0, _extends2["default"])({
+    }, "Open Panel"), state.isOpen && (0, _react2.jsx)(_index.OverlayPanel, (0, _extends2["default"])({
       isOpen: state.isOpen,
       state: state
     }, args, {
@@ -108,45 +81,34 @@ var Default = function Default(_ref) {
     }, "Children render here."))))
   );
 };
-
 exports.Default = Default;
-
 var InnerPanel = function InnerPanel(_ref2) {
-  var args = (0, _extends2["default"])({}, _ref2);
-
+  var args = (0, _extends2["default"])({}, ((0, _objectDestructuringEmpty2["default"])(_ref2), _ref2));
   var _useOverlayPanelState2 = (0, _hooks.useOverlayPanelState)(),
-      state = _useOverlayPanelState2.state,
-      onClose = _useOverlayPanelState2.onClose;
-
+    state = _useOverlayPanelState2.state,
+    onClose = _useOverlayPanelState2.onClose;
   var _useOverlayPanelState3 = (0, _hooks.useOverlayPanelState)(),
-      innerState = _useOverlayPanelState3.state,
-      onCloseInner = _useOverlayPanelState3.onClose;
-
+    innerState = _useOverlayPanelState3.state,
+    onCloseInner = _useOverlayPanelState3.onClose;
   var outerTriggerRef = (0, _react.useRef)();
   var innerTriggerRef = (0, _react.useRef)();
-
   var _useState = (0, _react.useState)(false),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      messagesOpen = _useState2[0],
-      setMessagesOpen = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    messagesOpen = _useState2[0],
+    setMessagesOpen = _useState2[1];
   var toggleMessagesOpen = function toggleMessagesOpen() {
     setMessagesOpen(!messagesOpen);
   };
-
   var closeOuterPanel = function closeOuterPanel() {
     if (innerState.isOpen) {
       innerState.close();
     }
-
     onClose(state, outerTriggerRef);
   };
-
   var closeInnerPanel = function closeInnerPanel() {
     onCloseInner(innerState, innerTriggerRef);
   };
-
-  var inner = (0, _react2.jsx)(_react["default"].Fragment, null, innerState.isOpen && (0, _react2.jsx)(_OverlayPanel["default"], (0, _extends2["default"])({
+  var inner = innerState.isOpen && (0, _react2.jsx)(_index.OverlayPanel, (0, _extends2["default"])({
     variant: "overlayPanel.overlayPanelInner" // applies higher z-index
     ,
     isOpen: innerState.isOpen
@@ -157,9 +119,17 @@ var InnerPanel = function InnerPanel(_ref2) {
     onPress: closeInnerPanel
   }, "Close Inner Panel"), (0, _react2.jsx)(_index.Text, {
     pt: "md"
-  }, "Children render here."))));
-  var outer = // should have higher z-index applied
-  (0, _react2.jsx)(_react["default"].Fragment, null, state.isOpen && (0, _react2.jsx)(_OverlayPanel["default"], (0, _extends2["default"])({
+  }, "Children render here.")));
+  var items = [{
+    id: 1,
+    name: 'Form 1'
+  }, {
+    id: 2,
+    name: 'Form 2'
+  }];
+  var outer =
+  // should have higher z-index applied
+  state.isOpen && (0, _react2.jsx)(_index.OverlayPanel, (0, _extends2["default"])({
     isOpen: state.isOpen,
     sx: {
       p: '0px'
@@ -177,28 +147,25 @@ var InnerPanel = function InnerPanel(_ref2) {
   }, "Close Panel"), (0, _react2.jsx)(_index.Text, {
     pt: "md",
     mb: "24px"
-  }, "Children render here."), (0, _react2.jsx)(_index.List, null, (0, _react2.jsx)(_index.ListItem, null, (0, _react2.jsx)(_index.Text, {
-    variant: "itemTitle",
-    alignSelf: "center",
-    mr: "auto"
-  }, "Form 1")), (0, _react2.jsx)(_index.Separator, {
-    margin: "0"
-  }), (0, _react2.jsx)(_index.ListItem, {
-    title: "Form 2"
-  }, (0, _react2.jsx)(_index.Text, {
-    variant: "itemTitle",
-    alignSelf: "center",
-    mr: "auto"
-  }, "Form 2")), (0, _react2.jsx)(_index.Separator, {
-    margin: "0"
-  })), (0, _react2.jsx)("br", null), (0, _react2.jsx)(_index.Button, {
+  }, "Children render here."), (0, _react2.jsx)(_index.ListView, {
+    items: items
+  }, function (item) {
+    return (0, _react2.jsx)(_index.Item, {
+      key: item.id
+    }, (0, _react2.jsx)(_index.Text, {
+      variant: "itemTitle",
+      alignSelf: "center",
+      mr: "auto"
+    }, item.name));
+  }), (0, _react2.jsx)("br", null), (0, _react2.jsx)(_index.Button, {
     onPress: toggleMessagesOpen
   }, "Toggle Messages"), (0, _react2.jsx)("br", null), (0, _react2.jsx)(_index.Button, {
     ref: innerTriggerRef,
     onPress: innerState.open,
     "aria-expanded": innerState.isOpen
-  }, "Open Inner Panel"), inner)));
-  return (// Application must be wrapped in an OverlayProvider so that it can be hidden from screen
+  }, "Open Inner Panel"), inner));
+  return (
+    // Application must be wrapped in an OverlayProvider so that it can be hidden from screen
     // readers when an overlay opens.
     (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_index.OverlayProvider, null, (0, _react2.jsx)(_index.Button, {
       ref: outerTriggerRef,
@@ -209,28 +176,26 @@ var InnerPanel = function InnerPanel(_ref2) {
         zIndex: 11
       },
       onClose: toggleMessagesOpen
-    }, (0, _react2.jsx)(_collections.Item, {
+    }, (0, _react2.jsx)(_index.Item, {
       key: "message2",
       status: "success"
     }, "Z Index higher than inner pannel")))
   );
 };
-
 exports.InnerPanel = InnerPanel;
-
 var CustomWidth = function CustomWidth() {
   var _useOverlayPanelState4 = (0, _hooks.useOverlayPanelState)(),
-      state = _useOverlayPanelState4.state,
-      onClose = _useOverlayPanelState4.onClose;
-
+    state = _useOverlayPanelState4.state,
+    onClose = _useOverlayPanelState4.onClose;
   var triggerRef = (0, _react.useRef)();
-  return (// Application must be wrapped in an OverlayProvider so that it can be hidden from screen
+  return (
+    // Application must be wrapped in an OverlayProvider so that it can be hidden from screen
     // readers when an overlay opens.
     (0, _react2.jsx)(_index.OverlayProvider, null, (0, _react2.jsx)(_index.Text, null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur."), (0, _react2.jsx)("br", null), (0, _react2.jsx)(_index.Button, {
       ref: triggerRef,
       onPress: state.open,
       "aria-expanded": state.isOpen
-    }, "Open Panel"), state.isOpen && (0, _react2.jsx)(_OverlayPanel["default"], {
+    }, "Open Panel"), state.isOpen && (0, _react2.jsx)(_index.OverlayPanel, {
       isOpen: state.isOpen,
       state: state,
       triggerRef: triggerRef,
@@ -247,21 +212,16 @@ var CustomWidth = function CustomWidth() {
     }, "Children render here."))))
   );
 };
-
 exports.CustomWidth = CustomWidth;
-
 var Expandable = function Expandable() {
   var _useOverlayPanelState5 = (0, _hooks.useOverlayPanelState)(),
-      state = _useOverlayPanelState5.state,
-      onClose = _useOverlayPanelState5.onClose;
-
+    state = _useOverlayPanelState5.state,
+    onClose = _useOverlayPanelState5.onClose;
   var triggerRef = (0, _react.useRef)();
-
   var _useState3 = (0, _react.useState)(false),
-      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-      isExpanded = _useState4[0],
-      setIsExpanded = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    isExpanded = _useState4[0],
+    setIsExpanded = _useState4[1];
   var sx = {
     overlayPanel: {
       padding: 0,
@@ -334,11 +294,9 @@ var Expandable = function Expandable() {
     name: 'node 2',
     key: 'node2'
   }];
-
   var onCloseHandler = function onCloseHandler() {
     return onClose(state, triggerRef);
   };
-
   var header = (0, _react2.jsx)(_index.Box, {
     sx: sx.header
   }, (0, _react2.jsx)(_index.Box, {
@@ -381,10 +339,10 @@ var Expandable = function Expandable() {
     sx: sx.header.breadcrumbsContainer
   }, (0, _react2.jsx)(_index.Breadcrumbs, {
     icon: _ChevronRightIcon["default"]
-  }, (0, _react2.jsx)(_collections.Item, {
+  }, (0, _react2.jsx)(_index.Item, {
     key: "home",
     "data-id": "home"
-  }, "Capability"), (0, _react2.jsx)(_collections.Item, {
+  }, "Capability"), (0, _react2.jsx)(_index.Item, {
     key: "editGroups",
     variant: "neutralText",
     "data-id": "editGroups"
@@ -424,7 +382,7 @@ var Expandable = function Expandable() {
       hintText: 'Example Hint'
     }
   }, function (item) {
-    return (0, _react2.jsx)(_collections.Item, {
+    return (0, _react2.jsx)(_index.Item, {
       key: item.key,
       "data-id": item.name
     }, item.name);
@@ -476,13 +434,14 @@ var Expandable = function Expandable() {
     sx: sx.footer.button,
     variant: "text"
   }, "Cancel"));
-  return (// Application must be wrapped in an OverlayProvider so that it can be hidden from screen
+  return (
+    // Application must be wrapped in an OverlayProvider so that it can be hidden from screen
     // readers when an overlay opens.
     (0, _react2.jsx)(_index.OverlayProvider, null, (0, _react2.jsx)(_index.Button, {
       ref: triggerRef,
       onPress: state.open,
       "aria-expanded": state.isOpen
-    }, "Open Panel"), state.isOpen && (0, _react2.jsx)(_OverlayPanel["default"], {
+    }, "Open Panel"), state.isOpen && (0, _react2.jsx)(_index.OverlayPanel, {
       isOpen: state.isOpen,
       state: state,
       triggerRef: triggerRef,
@@ -505,5 +464,4 @@ var Expandable = function Expandable() {
     }, schemaTabContent))), footer))
   );
 };
-
 exports.Expandable = Expandable;

package/lib/cjs/{styles/variants/overlayPanel.js → components/OverlayPanel/OverlayPanel.styles.js}

@@ -1,13 +1,11 @@
 "use strict";
 
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = void 0;
-var overlayPanel = {
+var container = {
   position: 'fixed',
   overflowY: 'scroll',
   zIndex: 10,
@@ -40,7 +38,7 @@ var overlayPanel = {
     right: 0
   }
 };
-var overlayPanelInner = {
+var innerPanel = {
   position: 'absolute',
   zIndex: 9,
   bottom: 0,
@@ -57,7 +55,7 @@ var overlayPanelInner = {
   p: '25px',
   backgroundColor: 'accent.99'
 };
-var overlayPanelBody = {
+var body = {
   display: 'none',
   height: '100%',
   width: '100%',
@@ -66,8 +64,8 @@ var overlayPanelBody = {
   }
 };
 var _default = {
-  overlayPanel: overlayPanel,
-  overlayPanelBody: overlayPanelBody,
-  overlayPanelInner: overlayPanelInner
+  container: container,
+  body: body,
+  innerPanel: innerPanel
 };
 exports["default"] = _default;

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

@@ -1,43 +1,32 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
-
 var _testWrapper = require("../../utils/testUtils/testWrapper");
-
 var _OverlayPanel = _interopRequireDefault(require("./OverlayPanel"));
-
 var _react2 = require("@emotion/react");
-
 var testId = 'test-overlayPanel';
 var defaultProps = {
   'data-testid': testId
 };
-
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return (0, _testWrapper.render)((0, _react2.jsx)(_OverlayPanel["default"], (0, _extends2["default"])({}, defaultProps, props)));
 };
-
 afterEach(function () {
   jest.restoreAllMocks();
-}); // Need to be added to each test file to test accessibility using axe.
+});
 
+// Need to be added to each test file to test accessibility using axe.
 (0, _testAxe["default"])(getComponent);
 test('default overlayPanel', function () {
   getComponent({
     children: (0, _react2.jsx)("div", null, "Test")
   });
-
   var overlayPanel = _testWrapper.screen.getByTestId(testId);
-
   var child = _testWrapper.screen.queryByText('Test');
-
   expect(overlayPanel).toBeInTheDocument();
   expect(child).toBeInTheDocument();
 });
@@ -48,9 +37,7 @@ test('custom overlayPanel gets custom width', function () {
       width: '240px'
     }
   });
-
   var overlayPanel = _testWrapper.screen.getByTestId(testId);
-
   expect(overlayPanel).toBeInTheDocument();
   expect(overlayPanel).toHaveStyleRule('width', '240px');
 });
@@ -60,32 +47,26 @@ test('onClose callback fires when provided', function () {
     onClose: onClose,
     children: (0, _react2.jsx)("div", null, "Test")
   });
-
   var overlayPanel = _testWrapper.screen.getByTestId(testId);
-
   _testWrapper.fireEvent.keyDown(overlayPanel, {
     key: 'Escape',
     code: 'Escape',
     keyCode: 27,
     charCode: 27
   });
-
   _testWrapper.fireEvent.keyUp(overlayPanel, {
     key: 'Escape',
     code: 'Escape',
     keyCode: 27,
     charCode: 27
   });
-
   expect(onClose).toHaveBeenCalled();
 });
 test('custom classname can be passed', function () {
   getComponent({
     className: 'testing-class'
   });
-
   var overlayPanel = _testWrapper.screen.getByTestId(testId);
-
   expect(overlayPanel).toHaveClass('testing-class');
 });
 test('neither callback fires when not provided', function () {
@@ -93,23 +74,19 @@ test('neither callback fires when not provided', function () {
   getComponent({
     children: (0, _react2.jsx)("div", null, "Test")
   });
-
   var overlayPanel = _testWrapper.screen.getByTestId(testId);
-
   _testWrapper.fireEvent.keyDown(overlayPanel, {
     key: 'Escape',
     code: 'Escape',
     keyCode: 27,
     charCode: 27
   });
-
   _testWrapper.fireEvent.keyUp(overlayPanel, {
     key: 'Escape',
     code: 'Escape',
     keyCode: 27,
     charCode: 27
   });
-
   expect(onClose).not.toHaveBeenCalled();
 });
 test('triggerRef.current.focus() fires when provided', function () {
@@ -128,23 +105,19 @@ test('triggerRef.current.focus() fires when provided', function () {
     children: (0, _react2.jsx)("div", null, "Test"),
     triggerRef: triggerRef
   });
-
   var overlayPanel = _testWrapper.screen.getByTestId(testId);
-
   _testWrapper.fireEvent.keyDown(overlayPanel, {
     key: 'Escape',
     code: 'Escape',
     keyCode: 27,
     charCode: 27
   });
-
   _testWrapper.fireEvent.keyUp(overlayPanel, {
     key: 'Escape',
     code: 'Escape',
     keyCode: 27,
     charCode: 27
   });
-
   expect(focusFunction).toHaveBeenCalled();
 });
 test('triggerRef.current.focus() does not fire when key other than esc is pressed', function () {
@@ -163,22 +136,18 @@ test('triggerRef.current.focus() does not fire when key other than esc is presse
     children: (0, _react2.jsx)("div", null, "Test"),
     triggerRef: triggerRef
   });
-
   var overlayPanel = _testWrapper.screen.getByTestId(testId);
-
   _testWrapper.fireEvent.keyDown(overlayPanel, {
     key: 'KeyA',
     code: 'KeyA',
     keyCode: 65,
     charCode: 65
   });
-
   _testWrapper.fireEvent.keyUp(overlayPanel, {
     key: 'KeyA',
     code: 'KeyA',
     keyCode: 65,
     charCode: 65
   });
-
   expect(focusFunction).not.toHaveBeenCalled();
 });

package/lib/cjs/components/OverlayPanel/index.js

@@ -1,18 +1,14 @@
 "use strict";
 
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 _Object$defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
     return _OverlayPanel["default"];
   }
 });
-
 var _OverlayPanel = _interopRequireDefault(require("./OverlayPanel"));

package/lib/cjs/components/PageHeader/PageHeader.js

@@ -1,53 +1,36 @@
 "use strict";
 
 var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
 var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _Text = _interopRequireDefault(require("../Text/Text"));
-
-var _Box = _interopRequireDefault(require("../Box/Box"));
-
 var _hooks = require("../../hooks");
-
+var _Box = _interopRequireDefault(require("../Box/Box"));
+var _Text = _interopRequireDefault(require("../Text/Text"));
 var _react2 = require("@emotion/react");
-
 var _excluded = ["title", "children"];
-
 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; }
-
 /**
  * A `Page Header` is a composed component using text and icon button.
  * The component is separated from the body and appears at the top.
  * For customization,
  * please see [Page Header](./?path=/story/recipes-page-header--default) recipe docs.
  */
+
 var PageHeader = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var title = props.title,
-      children = props.children,
-      others = (0, _objectWithoutProperties2["default"])(props, _excluded);
+    children = props.children,
+    others = (0, _objectWithoutProperties2["default"])(props, _excluded);
   (0, _hooks.useDeprecationWarning)('The Page Header component will be deprecated in Astro-UI 2.0.0. Use Page Header recipe instead.');
   return (0, _react2.jsx)(_Box["default"], (0, _extends2["default"])({
     isRow: true,

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

@@ -1,27 +1,18 @@
 "use strict";
 
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = exports.Default = void 0;
-
+var _objectDestructuringEmpty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectDestructuringEmpty"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _react = _interopRequireDefault(require("react"));
-
-var _PageHeader = _interopRequireDefault(require("../PageHeader/PageHeader"));
-
-var _Button = _interopRequireDefault(require("../Button/Button"));
-
 var _withDeprecationWarning = _interopRequireDefault(require("../../utils/devUtils/decorators/withDeprecationWarning"));
-
+var _Button = _interopRequireDefault(require("../Button/Button"));
+var _PageHeader = _interopRequireDefault(require("./PageHeader"));
 var _react2 = require("@emotion/react");
-
 var _default = {
   title: 'Deprecated/PageHeader',
   component: _PageHeader["default"],
@@ -38,10 +29,8 @@ var _default = {
   }
 };
 exports["default"] = _default;
-
 var Default = function Default(_ref) {
-  var args = (0, _extends2["default"])({}, _ref);
+  var args = (0, _extends2["default"])({}, ((0, _objectDestructuringEmpty2["default"])(_ref), _ref));
   return (0, _react2.jsx)(_PageHeader["default"], args, (0, _react2.jsx)(_Button["default"], null, "Add a Form"));
 };
-
 exports.Default = Default;