@pingux/astro 2.7.1 → 2.8.0-alpha.1

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

@@ -21,10 +21,10 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-c
 var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
 var _interactions = require("@react-aria/interactions");
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _themeUi = require("theme-ui");
 var _hooks = require("../../hooks");
 var _Loader = _interopRequireDefault(require("../Loader"));
+var _buttonAttributes = require("./buttonAttributes");
 var _react2 = require("@emotion/react");
 var _excluded = ["className", "isDisabled", "isLoading", "onHoverStart", "onHoverChange", "onHoverEnd", "onPress", "onPressStart", "onPressEnd", "onPressChange", "onPressUp", "children", "variant", "tabIndex"];
 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); }
@@ -101,60 +101,7 @@ var Button = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     }
   })));
 });
-Button.propTypes = {
-  /** Defines a string value that labels the current element. */
-  'aria-label': _propTypes["default"].string,
-  /** Whether the button is disabled. */
-  isDisabled: _propTypes["default"].bool,
-  /** Shows loader instead of children */
-  isLoading: _propTypes["default"].bool,
-  /**
-   * Handler that is called when a hover interaction starts.
-   * (e: HoverEvent) => void
-   */
-  onHoverStart: _propTypes["default"].func,
-  /**
-   * Handler that is called when a hover interaction ends.
-   * (e: HoverEvent) => void
-   */
-  onHoverEnd: _propTypes["default"].func,
-  /**
-   * Handler that is called when the hover state changes.
-   * (isHovering: boolean) => void
-   */
-  onHoverChange: _propTypes["default"].func,
-  /**
-   * Handler that is called when the press is released over the target.
-   * (e: PressEvent) => void
-   */
-  onPress: _propTypes["default"].func,
-  /**
-   * Handler that is called when a press interaction starts.
-   * (e: PressEvent) => void
-   */
-  onPressStart: _propTypes["default"].func,
-  /**
-   * Handler that is called when a press interaction ends, either over the target or when the
-   * pointer leaves the target.
-   * (e: PressEvent) => void
-   */
-  onPressEnd: _propTypes["default"].func,
-  /**
-   * Handler that is called when the press state changes.
-   * (isPressed: boolean) => void
-   */
-  onPressChange: _propTypes["default"].func,
-  /**
-   * Handler that is called when a press is released over the target, regardless of whether it
-   * started on the target or not.
-   * (e: PressEvent) => void
-   */
-  onPressUp: _propTypes["default"].func,
-  /** The styling variation of the button. */
-  variant: _propTypes["default"].string,
-  /** The focus variation of the button. */
-  tabIndex: _propTypes["default"].number
-};
+Button.propTypes = _buttonAttributes.buttonPropTypes;
 Button.defaultProps = {
   isDisabled: false,
   variant: 'default'

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

@@ -1,5 +1,12 @@
 "use strict";
 
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
 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", {
@@ -8,6 +15,7 @@ _Object$defineProperty(exports, "__esModule", {
 exports["default"] = exports.TextIconButton = exports.Primary = exports.InlineButton = exports.FilterButton = exports.Disabled = exports.Default = exports.Critical = exports.ColorBlockButton = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _AddCircleIcon = _interopRequireDefault(require("@pingux/mdi-react/AddCircleIcon"));
 var _CreateIcon = _interopRequireDefault(require("@pingux/mdi-react/CreateIcon"));
@@ -16,43 +24,17 @@ var _storybookAddonDesigns = require("storybook-addon-designs");
 var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/storybookDocsLayout"));
 var _index = require("../../index");
 var _figmaLinks = require("../../utils/designUtils/figmaLinks.js");
-var _variants = require("../../utils/devUtils/constants/variants");
 var _Button = _interopRequireDefault(require("./Button.mdx"));
+var _buttonAttributes = require("./buttonAttributes");
 var _react2 = require("@emotion/react");
 var _excluded = ["isConfigured"];
-// removing the iconButton variants from this story.
-var variants = _variants.buttonVariants;
-delete variants.ICON;
-delete variants.ICON_BUTTON;
-delete variants.INVERTED;
-
-// add designer approved variants for devs to use here
-var variantOptions = ['critical', 'default', 'inline', 'inlinePrimary', 'link', 'primary'];
+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; }
 var _default = {
   title: 'Components/Button',
   component: _index.Button,
   decorators: [_storybookAddonDesigns.withDesign],
-  argTypes: {
-    variant: {
-      control: {
-        type: 'select',
-        options: variantOptions
-      },
-      defaultValue: 'default'
-    },
-    children: {
-      description: 'Button text.',
-      defaultValue: 'Button Text',
-      table: {
-        type: {
-          summary: 'string'
-        }
-      },
-      control: {
-        type: 'text'
-      }
-    }
-  },
+  argTypes: _objectSpread({}, _buttonAttributes.buttonArgTypes),
   parameters: {
     docs: {
       source: {

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

@@ -0,0 +1,109 @@
+"use strict";
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+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.buttonPropTypes = exports.buttonArgTypes = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _ariaAttributes = require("../../utils/docUtils/ariaAttributes");
+var _docArgTypes = require("../../utils/docUtils/docArgTypes");
+var _hoverProps = require("../../utils/docUtils/hoverProps");
+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; }
+// add designer approved variants for devs to use here
+var variantOptions = ['critical', 'default', 'inline', 'inlinePrimary', 'link', 'primary'];
+var descriptions = {
+  isDisabled: 'Whether the button is disabled.',
+  isLoading: 'Shows loader instead of children',
+  onHoverStart: 'Handler that is called when a hover interaction starts. (e: HoverEvent) => void',
+  onHoverEnd: 'Handler that is called when the hover state changes. (isHovering: boolean) => void',
+  onHoverChange: 'Handler that is called when the press is released over the target. (e: PressEvent) => void',
+  onPress: 'Handler that is called when the press is released over the target. (e: PressEvent) => void',
+  onPressChange: 'Handler that is called when the press state changes. (isPressed: boolean) => void',
+  onPressEnd: 'Handler that is called when a press interaction ends, either over the target or when the pointer leaves the target. (e: PressEvent) => void',
+  onPressStart: 'Handler that is called when a press interaction starts. (e: PressEvent) => void',
+  onPressUp: 'Handler that is called when a press is released over the target, regardless of whether it started on the target or not. (e: PressEvent) => void',
+  variant: 'The styling variation of the button.',
+  tabIndex: 'The focus variation of button',
+  children: 'Button text.'
+};
+var buttonArgTypes = _objectSpread(_objectSpread({
+  variant: {
+    control: {
+      type: 'select',
+      options: variantOptions
+    },
+    defaultValue: 'default',
+    description: descriptions.variant
+  },
+  children: {
+    defaultValue: 'Button Text',
+    table: {
+      type: {
+        summary: 'string'
+      }
+    },
+    control: {
+      type: 'text'
+    },
+    description: descriptions.children
+  },
+  onPress: _objectSpread({
+    description: descriptions.onPress
+  }, _docArgTypes.funcArg),
+  onPressStart: _objectSpread({
+    description: descriptions.onPressStart
+  }, _docArgTypes.funcArg),
+  onPressEnd: _objectSpread({
+    description: descriptions.onPressEnd
+  }, _docArgTypes.funcArg),
+  onPressChange: _objectSpread({
+    description: descriptions.onPressChange
+  }, _docArgTypes.funcArg),
+  onPressUp: _objectSpread({
+    description: descriptions.onPressUp
+  }, _docArgTypes.funcArg)
+}, _hoverProps.onHoverArgTypes), {}, {
+  isLoading: _objectSpread(_objectSpread({}, _docArgTypes.booleanArg), {}, {
+    description: descriptions.isLoading
+  }),
+  isDisabled: _objectSpread(_objectSpread({}, _docArgTypes.booleanArg), {}, {
+    description: descriptions.isDisabled
+  }),
+  tabIndex: {
+    description: descriptions.tabIndex
+  },
+  'aria-label': {
+    control: {
+      type: 'text'
+    },
+    description: _ariaAttributes.descriptions.ariaLabel
+  }
+});
+exports.buttonArgTypes = buttonArgTypes;
+var buttonPropTypes = {
+  'aria-label': _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  isLoading: _propTypes["default"].bool,
+  onHoverStart: _propTypes["default"].func,
+  onHoverEnd: _propTypes["default"].func,
+  onHoverChange: _propTypes["default"].func,
+  onPress: _propTypes["default"].func,
+  onPressStart: _propTypes["default"].func,
+  onPressEnd: _propTypes["default"].func,
+  onPressChange: _propTypes["default"].func,
+  onPressUp: _propTypes["default"].func,
+  variant: _propTypes["default"].string,
+  tabIndex: _propTypes["default"].number
+};
+exports.buttonPropTypes = buttonPropTypes;

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

@@ -127,7 +127,7 @@ test('should be able to select dates', function () {
   _userEvent["default"].click(dateButtons[4]);
   expect(dateButtons[4]).toHaveClass('is-selected');
 });
-test('should be able to navigate and select shown previous month dates', function () {
+test('should be able to navigate to previous month dates without selection', function () {
   var _context3;
   getComponent({
     defaultValue: '2022-08-10'
@@ -138,10 +138,10 @@ test('should be able to navigate and select shown previous month dates', functio
   var previousDate = disabledGridCells[0];
   expect((0, _testWrapper.within)(previousDate).getByText(31)).toHaveAttribute('aria-label', 'Sunday, July 31, 2022');
   _userEvent["default"].click(previousDate);
-  var selectedDate = _testWrapper.screen.queryByText(31);
-  expect(selectedDate).toHaveAttribute('aria-label', 'Sunday, July 31, 2022 selected');
+  var selectedMonth = _testWrapper.screen.queryByRole('grid');
+  expect(selectedMonth).toHaveAttribute('aria-label', 'July 2022');
 });
-test('should be able to navigate and select shown next month dates', function () {
+test('should be able to navigate to next month dates without selection', function () {
   var _context4;
   getComponent({
     defaultValue: '2022-08-10'
@@ -152,8 +152,8 @@ test('should be able to navigate and select shown next month dates', function ()
   var NextDate = disabledGridCells[34];
   expect((0, _testWrapper.within)(NextDate).getByText(3)).toHaveAttribute('aria-label', 'Saturday, September 3, 2022');
   _userEvent["default"].click(NextDate);
-  var selectedDate = _testWrapper.screen.queryByText(3);
-  expect(selectedDate).toHaveAttribute('aria-label', 'Saturday, September 3, 2022 selected');
+  var selectedMonth = _testWrapper.screen.queryByRole('grid');
+  expect(selectedMonth).toHaveAttribute('aria-label', 'September 2022');
 });
 test('allows users to open calendar item with enter / space key', function () {
   getComponent({

package/lib/cjs/components/Calendar/CalendarCell.js

@@ -50,8 +50,8 @@ var CalendarCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     formattedDate = _useCalendarCell.formattedDate,
     isDisabled = _useCalendarCell.isDisabled;
   var focusPreviousPage = state.focusPreviousPage,
-    setValue = state.setValue,
-    focusNextPage = state.focusNextPage;
+    focusNextPage = state.focusNextPage,
+    setFocused = state.setFocused;
 
   /**
    * Function handles the navigation and adds focus to previous or next month dates
@@ -61,13 +61,13 @@ var CalendarCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var handleDisableClick = (0, _react.useCallback)(function () {
     var _cellRef$current, _cellRef$current2;
     if ((_cellRef$current = cellRef.current) !== null && _cellRef$current !== void 0 && _cellRef$current.hidden && !state.isDisabled && formattedDate > 20) {
+      setFocused(undefined);
       focusPreviousPage();
-      setValue(date);
     } else if ((_cellRef$current2 = cellRef.current) !== null && _cellRef$current2 !== void 0 && _cellRef$current2.hidden && !state.isDisabled && formattedDate < 15) {
+      setFocused(undefined);
       focusNextPage();
-      setValue(date);
     }
-  }, [date, focusNextPage, focusPreviousPage, formattedDate, setValue, state]);
+  }, [date, focusNextPage, focusPreviousPage, formattedDate, state, setFocused]);
   var _useHover = (0, _interactions.useHover)({}),
     hoverProps = _useHover.hoverProps,
     isHovered = _useHover.isHovered;
@@ -116,6 +116,7 @@ CalendarCell.propTypes = {
     focusPreviousPage: _propTypes["default"].func,
     setValue: _propTypes["default"].func,
     focusNextPage: _propTypes["default"].func,
+    setFocused: _propTypes["default"].func,
     setFocusedDate: _propTypes["default"].func,
     isDisabled: _propTypes["default"].bool
   }),

package/lib/cjs/components/IconButton/IconButton.js

@@ -21,11 +21,11 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-c
 var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
 var _interactions = require("@react-aria/interactions");
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _themeUi = require("theme-ui");
 var _BadgeContext = require("../../context/BadgeContext");
 var _hooks = require("../../hooks");
 var _TooltipTrigger = _interopRequireWildcard(require("../TooltipTrigger"));
+var _iconButtonAttributes = require("./iconButtonAttributes");
 var _react2 = require("@emotion/react");
 var _excluded = ["children", "className", "title", "variant", "onPress", "onPressStart", "onPressEnd", "onPressChange", "onPressUp", "isDisabled"];
 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); }
@@ -92,43 +92,7 @@ var IconButton = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   }
   return button;
 });
-IconButton.propTypes = {
-  /** Styling to apply to the IconButton. */
-  variant: _propTypes["default"].string,
-  /** Defines a string value that labels the current element. */
-  'aria-label': _propTypes["default"].string,
-  /** Content will be displayed in a tooltip on hover or focus. */
-  title: _propTypes["default"].string,
-  /**
-   * Handler that is called when the press is released over the target.
-   * (e: PressEvent) => void
-   */
-  onPress: _propTypes["default"].func,
-  /**
-   * Handler that is called when a press interaction starts.
-   * (e: PressEvent) => void
-   */
-  onPressStart: _propTypes["default"].func,
-  /**
-   * Handler that is called when a press interaction ends, either over the target or when the
-   * pointer leaves the target.
-   * (e: PressEvent) => void
-   */
-  onPressEnd: _propTypes["default"].func,
-  /**
-   * Handler that is called when the press state changes.
-   * (isPressed: boolean) => void
-   */
-  onPressChange: _propTypes["default"].func,
-  /**
-   * Handler that is called when a press is released over the target, regardless of whether it
-   * started on the target or not.
-   * (e: PressEvent) => void
-   */
-  onPressUp: _propTypes["default"].func,
-  /** Whether the icon is disabled. */
-  isDisabled: _propTypes["default"].bool
-};
+IconButton.propTypes = _iconButtonAttributes.iconButtonPropTypes;
 IconButton.defaultProps = {
   variant: 'base',
   isDisabled: false

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

@@ -18,6 +18,7 @@ var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/s
 var _index = require("../../index");
 var _figmaLinks = require("../../utils/designUtils/figmaLinks.js");
 var _IconButton = _interopRequireDefault(require("./IconButton.mdx"));
+var _iconButtonAttributes = require("./iconButtonAttributes");
 var _react2 = require("@emotion/react");
 var _default = {
   title: 'Components/IconButton',
@@ -33,40 +34,7 @@ var _default = {
       }
     }
   },
-  argTypes: {
-    icon: {
-      control: {
-        type: 'none'
-      },
-      defaultValue: _CreateIcon["default"],
-      description: 'The icon to render. List of icons at https://materialdesignicons.com/'
-    },
-    title: {
-      control: {
-        type: 'text'
-      }
-    },
-    'aria-label': {
-      control: {
-        type: 'text'
-      }
-    },
-    isDisabled: {},
-    variant: {
-      control: {
-        type: 'select',
-        options: ['base', 'inverted', 'invertedSquare', 'square']
-      },
-      defaultValue: 'base'
-    },
-    size: {
-      control: {
-        type: 'select',
-        options: ['xs', 'sm', 'md']
-      },
-      defaultValue: 'sm'
-    }
-  }
+  argTypes: _iconButtonAttributes.iconButtonArgTypes
 };
 exports["default"] = _default;
 var Default = function Default(args) {

package/lib/cjs/components/IconButton/iconButtonAttributes.js

@@ -0,0 +1,100 @@
+"use strict";
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+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.iconButtonPropTypes = exports.iconButtonArgTypes = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+var _CreateIcon = _interopRequireDefault(require("@pingux/mdi-react/CreateIcon"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _ariaAttributes = require("../../utils/docUtils/ariaAttributes");
+var _docArgTypes = require("../../utils/docUtils/docArgTypes");
+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; }
+var descriptions = {
+  icon: 'The icon to render. List of icons at https://materialdesignicons.com/',
+  isDisabled: 'Whether the icon is disabled.',
+  onPress: 'Handler that is called when the press is released over the target. (e: PressEvent) => void',
+  onPressChange: 'Handler that is called when the press state changes. (isPressed: boolean) => void',
+  onPressEnd: 'Handler that is called when a press interaction ends, either over the target or when the pointer leaves the target. (e: PressEvent) => void',
+  onPressStart: 'Handler that is called when a press interaction starts. (e: PressEvent) => void',
+  onPressUp: 'Handler that is called when a press is released over the target, regardless of whether it started on the target or not. (e: PressEvent) => void',
+  title: 'Content will be displayed in a tooltip on hover or focus.',
+  variant: 'Styling to apply to the IconButton.'
+};
+var iconButtonArgTypes = {
+  icon: {
+    control: {
+      type: 'none'
+    },
+    defaultValue: _CreateIcon["default"],
+    description: descriptions.icon
+  },
+  title: {
+    control: {
+      type: 'text'
+    },
+    description: descriptions.title
+  },
+  'aria-label': {
+    control: {
+      type: 'text'
+    },
+    description: _ariaAttributes.descriptions.ariaLabel
+  },
+  isDisabled: _objectSpread({
+    description: descriptions.isDisabled
+  }, _docArgTypes.booleanArg),
+  variant: {
+    control: {
+      type: 'select',
+      options: ['base', 'inverted', 'invertedSquare', 'square']
+    },
+    defaultValue: 'base',
+    description: descriptions.variant
+  },
+  size: {
+    control: {
+      type: 'select',
+      options: ['xs', 'sm', 'md']
+    },
+    defaultValue: 'sm'
+  },
+  onPress: _objectSpread({
+    description: descriptions.onPress
+  }, _docArgTypes.funcArg),
+  onPressStart: _objectSpread({
+    description: descriptions.onPressStart
+  }, _docArgTypes.funcArg),
+  onPressEnd: _objectSpread({
+    description: descriptions.onPressEnd
+  }, _docArgTypes.funcArg),
+  onPressChange: _objectSpread({
+    description: descriptions.onPressChange
+  }, _docArgTypes.funcArg),
+  onPressUp: _objectSpread({
+    description: descriptions.onPressUp
+  }, _docArgTypes.funcArg)
+};
+exports.iconButtonArgTypes = iconButtonArgTypes;
+var iconButtonPropTypes = {
+  variant: _propTypes["default"].string,
+  'aria-label': _propTypes["default"].string,
+  title: _propTypes["default"].string,
+  onPress: _propTypes["default"].func,
+  onPressStart: _propTypes["default"].func,
+  onPressEnd: _propTypes["default"].func,
+  onPressChange: _propTypes["default"].func,
+  onPressUp: _propTypes["default"].func,
+  isDisabled: _propTypes["default"].bool
+};
+exports.iconButtonPropTypes = iconButtonPropTypes;

package/lib/cjs/components/ListItem/ListItem.js

@@ -45,6 +45,7 @@ var ListItem = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
       onHoverStart: onHoverStart
     }),
     hoverProps = _useHover.hoverProps;
+  (0, _hooks.useDeprecationWarning)('The ListItem will be depreciated in the near future, please use ListViewItem');
   var _useStatusClasses = (0, _hooks.useStatusClasses)(className, {
       isHovered: isHovered,
       isSelected: isSelected

package/lib/cjs/components/ListView/ListView.js

@@ -66,15 +66,6 @@ function useListLayout(state) {
   layout.disabledKeys = state.disabledKeys;
   return layout;
 }
-
-/**
- * NOTE: be careful with putting focusable elements inside ListView.
- * It is using a grid (useList hook) with its own event listeners under the hood.
- * [react-specttrum-github-issue](https://github.com/adobe/react-spectrum/issues/2801)
- * If you decided to add a focusable element inside ListView,
- * you should stop bubbling of a pointerDown event and put a focus on the element.
-*/
-
 var ListView = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var disabledKeys = props.disabledKeys,
     _props$isHoverable = props.isHoverable,