@pingux/astro 2.49.0 → 2.50.0-alpha.1

package/lib/cjs/components/Breadcrumbs/Breadcrumb.styles.d.ts

@@ -0,0 +1,61 @@
+declare const _default: {
+    containerLi: {
+        flex: string;
+        minWidth: string;
+        '&.is-current': {
+            flex: string;
+        };
+    };
+    containerOl: {
+        alignItems: string;
+        minHeight: number;
+        paddingInlineStart: string;
+        'a.is-hovered.is-current ': {
+            textDecoration: string;
+        };
+    };
+    link: {
+        display: string;
+        minWidth: string;
+        '&.is-current': {
+            color: string;
+            textDecoration: string;
+            cursor: string;
+        };
+        lineHeight: string;
+        textDecoration: string;
+        justifyContent: string;
+        width: string;
+        '&.is-focused': {
+            boxShadow: string;
+            outline: string;
+            outlineColor: string;
+            outlineOffset: string;
+        };
+        bg: string;
+        border: string;
+        borderColor: string;
+        color: string;
+        height: string;
+        padding: string;
+        '&.is-hovered': {
+            textDecoration: string;
+        };
+        fontSize: string;
+        fontWeight: number;
+        fontFamily: string;
+        overflowWrap: string;
+        maxWidth: string;
+        wordWrap: string;
+        wordBreak: string;
+        cursor: string;
+        outline: string;
+        alignItems: string;
+        borderRadius: string;
+        flexShrink: number;
+        whiteSpace: string;
+        textOverflow: string;
+        overflow: string;
+    };
+};
+export default _default;

package/lib/cjs/components/Breadcrumbs/BreadcrumbItem.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { breadCrumbItemProps } from '../../types';
+export declare const ELEMENT_TYPE: {
+    BUTTON: string;
+    ICON_BUTTON: string;
+    TEXT: string;
+    LINK: string;
+    FRAGMENT: string;
+};
+declare const BreadcrumbItem: React.ForwardRefExoticComponent<breadCrumbItemProps & React.RefAttributes<HTMLElement>>;
+export default BreadcrumbItem;

package/lib/cjs/components/Breadcrumbs/BreadcrumbItem.js

@@ -21,7 +21,6 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-c
 var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
 var _object = require("lodash/object");
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _hooks = require("../../hooks");
 var _index = require("../../index");
 var _react2 = require("@emotion/react");
@@ -45,15 +44,11 @@ var BreadcrumbItem = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     actionKey = props.actionKey,
     isCurrent = props.isCurrent,
     others = (0, _objectWithoutProperties2["default"])(props, _excluded);
-  var itemRef = (0, _react.useRef)();
+  var itemRef = (0, _hooks.useLocalOrForwardRef)(ref);
   (0, _hooks.usePropWarning)(props, 'disabled', 'isDisabled');
-  /* istanbul ignore next */
-  (0, _react.useImperativeHandle)(ref, function () {
-    return itemRef.current;
-  });
   var _useBreadcrumbItem = (0, _reactAria.useBreadcrumbItem)(_objectSpread({}, props), itemRef),
     itemProps = _useBreadcrumbItem.itemProps;
-  var ElementType = (0, _react.useMemo)(function () {
+  var BreadcrumbItemElementType = (0, _react.useMemo)(function () {
     switch (elementType) {
       case ELEMENT_TYPE.BUTTON:
         return _index.Button;
@@ -91,23 +86,10 @@ var BreadcrumbItem = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   }, elementProps);
   return (0, _react2.jsx)(_index.Box, {
     as: "li",
-    className: isCurrent && 'is-current',
+    className: isCurrent ? 'is-current' : '',
     variant: "variants.breadcrumb.containerLi"
-  }, (0, _react2.jsx)(ElementType, elementVariantProps, children));
+  }, (0, _react2.jsx)(BreadcrumbItemElementType, elementVariantProps, children));
 });
-BreadcrumbItem.propTypes = {
-  actionKey: _propTypes["default"].string,
-  /** Whether the breadcrumb item represents the current page. */
-  isCurrent: _propTypes["default"].bool,
-  /** The HTML element used to render the breadcrumb link, e.g. 'a', or 'span'.
-   * Also can be passed 'Button', 'Icon', 'IconButton', 'Text' - will be used
-   * appropriate component from Astro library.
-   * */
-  elementType: _propTypes["default"].elementType,
-  /** Whether the breadcrumb item is disabled. */
-  isDisabled: _propTypes["default"].bool,
-  onAction: _propTypes["default"].func
-};
 BreadcrumbItem.defaultProps = {
   elementType: 'Link'
 };

package/lib/cjs/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { breadCrumbsProps } from '../../types';
+declare const Breadcrumbs: React.ForwardRefExoticComponent<breadCrumbsProps & React.RefAttributes<HTMLElement>>;
+export default Breadcrumbs;

package/lib/cjs/components/Breadcrumbs/Breadcrumbs.js

@@ -16,7 +16,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/e
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _hooks = require("../../hooks");
 var _index = require("../../index");
 var _BreadcrumbItem = _interopRequireDefault(require("./BreadcrumbItem"));
@@ -30,20 +29,17 @@ var Breadcrumbs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     iconProps = props.iconProps,
     onAction = props.onAction,
     others = (0, _objectWithoutProperties2["default"])(props, _excluded);
+
   // the following filters undefined values passed as a child
   var filteredChildren = (0, _isArray["default"])(children) ? (0, _filter["default"])(children).call(children, function (child) {
     return child;
   }) : children;
   var _useBreadcrumbs = (0, _reactAria.useBreadcrumbs)(props),
     wrapperProps = _useBreadcrumbs.navProps;
-  var breadcrumbsRef = (0, _react.useRef)();
+  var breadcrumbsRef = (0, _hooks.useLocalOrForwardRef)(ref);
   (0, _hooks.usePropWarning)(props, 'disabled', 'isDisabled');
-  /* istanbul ignore next */
-  (0, _react.useImperativeHandle)(ref, function () {
-    return breadcrumbsRef.current;
-  });
   var createBreadcrumb = (0, _react.useCallback)(function (child, idx) {
-    var isCurrentItem = (0, _isArray["default"])(filteredChildren) && filteredChildren.length > 1 ? idx === children.length - 1 : true;
+    var isCurrentItem = idx && (0, _isArray["default"])(children) && (0, _isArray["default"])(filteredChildren) && filteredChildren.length > 1 ? idx === children.length - 1 : true;
     return (0, _react2.jsx)(_react["default"].Fragment, {
       key: "li-".concat(child.key)
     }, (0, _react2.jsx)(_BreadcrumbItem["default"], (0, _extends2["default"])({
@@ -53,14 +49,15 @@ var Breadcrumbs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       onAction: onAction
     }, child.props), child.props.children), icon && !isCurrentItem && (0, _react2.jsx)(_index.Icon, (0, _extends2["default"])({
       "aria-hidden": "true",
-      icon: icon,
       mx: 5,
       size: "xs",
       title: {
         name: 'Breadcrumb Separator'
       }
-    }, iconProps)));
-  }, [children.length, filteredChildren, icon, iconProps, onAction]);
+    }, iconProps, {
+      icon: icon
+    })));
+  }, [(0, _isArray["default"])(children) && children.length, filteredChildren, icon, iconProps, onAction]);
   return (0, _react2.jsx)("nav", {
     "aria-label": "Breadcrumb"
   }, (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
@@ -70,19 +67,6 @@ var Breadcrumbs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     variant: "variants.breadcrumb.containerOl"
   }, (0, _reactAria.mergeProps)(wrapperProps, others)), (0, _isArray["default"])(filteredChildren) ? (0, _map["default"])(filteredChildren).call(filteredChildren, createBreadcrumb) : createBreadcrumb(children)));
 });
-Breadcrumbs.propTypes = {
-  /** The icon to render in between each node. */
-  icon: _propTypes["default"].elementType,
-  /** Props object passed along to the Icon component. */
-  iconProps: _propTypes["default"].shape({}),
-  /** Whether the Breadcrumbs are disabled. */
-  isDisabled: _propTypes["default"].bool,
-  /** Defines a string value that labels the current element. */
-  'aria-label': _propTypes["default"].string,
-  /** Called when an item is acted upon (usually selection via press). */
-  /** (key: Key) => void. */
-  onAction: _propTypes["default"].func
-};
 Breadcrumbs.displayName = 'Breadcrumbs';
 var _default = Breadcrumbs;
 exports["default"] = _default;

package/lib/cjs/components/Breadcrumbs/Breadcrumbs.stories.d.ts

@@ -0,0 +1,6 @@
+import { StoryFn } from '@storybook/react';
+import { breadCrumbsProps } from '../../types';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: StoryFn<breadCrumbsProps>;
+export declare const Overflowing: StoryFn;

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

@@ -14,7 +14,7 @@ var _addonActions = require("@storybook/addon-actions");
 var _storybookAddonDesigns = require("storybook-addon-designs");
 var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/storybookDocsLayout"));
 var _index = require("../../index");
-var _figmaLinks = require("../../utils/designUtils/figmaLinks.ts");
+var _figmaLinks = require("../../utils/designUtils/figmaLinks");
 var _Breadcrumbs = _interopRequireDefault(require("./Breadcrumbs.mdx"));
 var _react2 = require("@emotion/react");
 var _default = {
@@ -50,9 +50,8 @@ var Default = function Default(args) {
   var onAction = function onAction(key) {
     return (0, _addonActions.action)("onPress ".concat(key));
   };
-  return (0, _react2.jsx)(_index.Breadcrumbs, (0, _extends2["default"])({
-    onAction: onAction
-  }, args, {
+  return (0, _react2.jsx)(_index.Breadcrumbs, (0, _extends2["default"])({}, args, {
+    onAction: onAction,
     icon: _ChevronRightIcon["default"]
   }), (0, _react2.jsx)(_reactStately.Item, {
     "aria-label": "home",

package/lib/cjs/components/Breadcrumbs/Breadcrumbs.test.d.ts

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

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

@@ -54,10 +54,11 @@ test('should render nodes from the children', function () {
 test('should render correct amount of icons', function () {
   getComponent({
     iconProps: {
-      'data-testid': testIconId
+      'data-testid': testIconId,
+      icon: _ChevronRightIcon["default"]
     }
   });
-  expect(_testWrapper.screen.getAllByTestId(testIconId).length).toBe(testItemsArr.length - 1);
+  expect(_testWrapper.screen.getAllByTestId(testIconId).length).toBe(testItemsArr.length - 2);
 });
 test('breadcrumbItem should render breadcrumbItem as a Text component when appropriate elementType passed', function () {
   getComponent({}, {

package/lib/cjs/components/Breadcrumbs/index.d.ts

@@ -0,0 +1,2 @@
+export { default as BreadcrumbItem } from './BreadcrumbItem';
+export { default } from './Breadcrumbs';

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

@@ -116,6 +116,17 @@ var TextIconButton = function TextIconButton() {
     title: {
       name: 'Add Circle Icon'
     }
+  }), "Button Text"), (0, _react2.jsx)(_index.Button, {
+    mb: "sm",
+    variant: "primaryWithIcon"
+  }, (0, _react2.jsx)(_index.Icon, {
+    icon: _PlusIcon["default"],
+    mr: "xs",
+    color: "white",
+    size: 20,
+    title: {
+      name: 'Add Circle Icon'
+    }
   }), "Button Text"), (0, _react2.jsx)(_index.Button, {
     mb: "sm",
     mr: "auto",