@pingux/astro 2.51.0-alpha.0 → 2.51.0

package/lib/cjs/hooks/useSelectField/useSelectField.d.ts

@@ -3,7 +3,7 @@ import { AriaButtonProps } from 'react-aria';
 import { SelectState } from 'react-stately';
 import { CollectionChildren } from '@react-types/shared';
 import { LabelProps as ThemeUILabelProps } from 'theme-ui';
-import { Axis, BoxProps, FocusableElement, PlacementAxis, ReactRef, StyleProps } from '../../types';
+import { Axis, BoxProps, FocusableElement, ListBoxProps, PlacementAxis, ReactRef, StyleProps } from '../../types';
 import { LabelMode } from '../useColumnStyles/useColumnStyles';
 import { FieldControlInputProps } from '../useField/useField';
 interface UseSelectFieldProps<T> {
@@ -32,7 +32,7 @@ interface UseSelectFieldProps<T> {
     onSelectionChange?: (key: Key) => unknown;
     controlProps?: React.HTMLAttributes<Element>;
     scrollBoxProps?: BoxProps;
-    listBoxProps?: BoxProps;
+    listBoxProps?: ListBoxProps;
     labelProps?: ThemeUILabelProps;
     containerProps?: BoxProps;
     labelMode: LabelMode;

package/lib/cjs/hooks/useSelectField/useSelectField.js

@@ -190,7 +190,7 @@ var useSelectField = function useSelectField(props, ref) {
   }), (0, _react2.jsx)(_ListBox["default"], (0, _extends2["default"])({
     ref: listBoxRef,
     hasNoEmptySelection: true,
-    hasAutoFocus: state.focusStrategy || true,
+    hasAutoFocus: true,
     state: state,
     variant: "listBox.selectField",
     isLoading: isLoadingMore,

package/lib/cjs/types/index.d.ts

@@ -13,6 +13,7 @@ export * from './iconButton';
 export * from './input';
 export * from './item';
 export * from './link';
+export * from './listBox';
 export * from './listItem';
 export * from './loader';
 export * from './menu';

package/lib/cjs/types/index.js

@@ -1,6 +1,6 @@
 "use strict";
 
-var _context, _context2, _context3, _context4, _context5, _context6, _context7, _context8, _context9, _context10, _context11, _context12, _context13, _context14, _context15, _context16, _context17, _context18, _context19, _context20, _context21, _context22, _context23, _context24, _context25, _context26, _context27, _context28, _context29, _context30;
+var _context, _context2, _context3, _context4, _context5, _context6, _context7, _context8, _context9, _context10, _context11, _context12, _context13, _context14, _context15, _context16, _context17, _context18, _context19, _context20, _context21, _context22, _context23, _context24, _context25, _context26, _context27, _context28, _context29, _context30, _context31;
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
 var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
 var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
@@ -172,8 +172,19 @@ _forEachInstanceProperty(_context15 = _Object$keys(_link)).call(_context15, func
     }
   });
 });
+var _listBox = require("./listBox");
+_forEachInstanceProperty(_context16 = _Object$keys(_listBox)).call(_context16, function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _listBox[key]) return;
+  _Object$defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _listBox[key];
+    }
+  });
+});
 var _listItem = require("./listItem");
-_forEachInstanceProperty(_context16 = _Object$keys(_listItem)).call(_context16, function (key) {
+_forEachInstanceProperty(_context17 = _Object$keys(_listItem)).call(_context17, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _listItem[key]) return;
   _Object$defineProperty(exports, key, {
@@ -184,7 +195,7 @@ _forEachInstanceProperty(_context16 = _Object$keys(_listItem)).call(_context16,
   });
 });
 var _loader = require("./loader");
-_forEachInstanceProperty(_context17 = _Object$keys(_loader)).call(_context17, function (key) {
+_forEachInstanceProperty(_context18 = _Object$keys(_loader)).call(_context18, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _loader[key]) return;
   _Object$defineProperty(exports, key, {
@@ -195,7 +206,7 @@ _forEachInstanceProperty(_context17 = _Object$keys(_loader)).call(_context17, fu
   });
 });
 var _menu = require("./menu");
-_forEachInstanceProperty(_context18 = _Object$keys(_menu)).call(_context18, function (key) {
+_forEachInstanceProperty(_context19 = _Object$keys(_menu)).call(_context19, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _menu[key]) return;
   _Object$defineProperty(exports, key, {
@@ -206,7 +217,7 @@ _forEachInstanceProperty(_context18 = _Object$keys(_menu)).call(_context18, func
   });
 });
 var _menuItem = require("./menuItem");
-_forEachInstanceProperty(_context19 = _Object$keys(_menuItem)).call(_context19, function (key) {
+_forEachInstanceProperty(_context20 = _Object$keys(_menuItem)).call(_context20, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _menuItem[key]) return;
   _Object$defineProperty(exports, key, {
@@ -217,7 +228,7 @@ _forEachInstanceProperty(_context19 = _Object$keys(_menuItem)).call(_context19,
   });
 });
 var _overlayPanel = require("./overlayPanel");
-_forEachInstanceProperty(_context20 = _Object$keys(_overlayPanel)).call(_context20, function (key) {
+_forEachInstanceProperty(_context21 = _Object$keys(_overlayPanel)).call(_context21, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _overlayPanel[key]) return;
   _Object$defineProperty(exports, key, {
@@ -228,7 +239,7 @@ _forEachInstanceProperty(_context20 = _Object$keys(_overlayPanel)).call(_context
   });
 });
 var _popoverContainer = require("./popoverContainer");
-_forEachInstanceProperty(_context21 = _Object$keys(_popoverContainer)).call(_context21, function (key) {
+_forEachInstanceProperty(_context22 = _Object$keys(_popoverContainer)).call(_context22, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _popoverContainer[key]) return;
   _Object$defineProperty(exports, key, {
@@ -239,7 +250,7 @@ _forEachInstanceProperty(_context21 = _Object$keys(_popoverContainer)).call(_con
   });
 });
 var _popoverMenu = require("./popoverMenu");
-_forEachInstanceProperty(_context22 = _Object$keys(_popoverMenu)).call(_context22, function (key) {
+_forEachInstanceProperty(_context23 = _Object$keys(_popoverMenu)).call(_context23, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _popoverMenu[key]) return;
   _Object$defineProperty(exports, key, {
@@ -250,7 +261,7 @@ _forEachInstanceProperty(_context22 = _Object$keys(_popoverMenu)).call(_context2
   });
 });
 var _requirementsList = require("./requirementsList");
-_forEachInstanceProperty(_context23 = _Object$keys(_requirementsList)).call(_context23, function (key) {
+_forEachInstanceProperty(_context24 = _Object$keys(_requirementsList)).call(_context24, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _requirementsList[key]) return;
   _Object$defineProperty(exports, key, {
@@ -261,7 +272,7 @@ _forEachInstanceProperty(_context23 = _Object$keys(_requirementsList)).call(_con
   });
 });
 var _rockerButtonGroup = require("./rockerButtonGroup");
-_forEachInstanceProperty(_context24 = _Object$keys(_rockerButtonGroup)).call(_context24, function (key) {
+_forEachInstanceProperty(_context25 = _Object$keys(_rockerButtonGroup)).call(_context25, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _rockerButtonGroup[key]) return;
   _Object$defineProperty(exports, key, {
@@ -272,7 +283,7 @@ _forEachInstanceProperty(_context24 = _Object$keys(_rockerButtonGroup)).call(_co
   });
 });
 var _scrollBox = require("./scrollBox");
-_forEachInstanceProperty(_context25 = _Object$keys(_scrollBox)).call(_context25, function (key) {
+_forEachInstanceProperty(_context26 = _Object$keys(_scrollBox)).call(_context26, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _scrollBox[key]) return;
   _Object$defineProperty(exports, key, {
@@ -283,7 +294,7 @@ _forEachInstanceProperty(_context25 = _Object$keys(_scrollBox)).call(_context25,
   });
 });
 var _separator = require("./separator");
-_forEachInstanceProperty(_context26 = _Object$keys(_separator)).call(_context26, function (key) {
+_forEachInstanceProperty(_context27 = _Object$keys(_separator)).call(_context27, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _separator[key]) return;
   _Object$defineProperty(exports, key, {
@@ -294,7 +305,7 @@ _forEachInstanceProperty(_context26 = _Object$keys(_separator)).call(_context26,
   });
 });
 var _shared = require("./shared");
-_forEachInstanceProperty(_context27 = _Object$keys(_shared)).call(_context27, function (key) {
+_forEachInstanceProperty(_context28 = _Object$keys(_shared)).call(_context28, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _shared[key]) return;
   _Object$defineProperty(exports, key, {
@@ -305,7 +316,7 @@ _forEachInstanceProperty(_context27 = _Object$keys(_shared)).call(_context27, fu
   });
 });
 var _table = require("./table");
-_forEachInstanceProperty(_context28 = _Object$keys(_table)).call(_context28, function (key) {
+_forEachInstanceProperty(_context29 = _Object$keys(_table)).call(_context29, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _table[key]) return;
   _Object$defineProperty(exports, key, {
@@ -316,7 +327,7 @@ _forEachInstanceProperty(_context28 = _Object$keys(_table)).call(_context28, fun
   });
 });
 var _text = require("./text");
-_forEachInstanceProperty(_context29 = _Object$keys(_text)).call(_context29, function (key) {
+_forEachInstanceProperty(_context30 = _Object$keys(_text)).call(_context30, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _text[key]) return;
   _Object$defineProperty(exports, key, {
@@ -327,7 +338,7 @@ _forEachInstanceProperty(_context29 = _Object$keys(_text)).call(_context29, func
   });
 });
 var _tooltipTrigger = require("./tooltipTrigger");
-_forEachInstanceProperty(_context30 = _Object$keys(_tooltipTrigger)).call(_context30, function (key) {
+_forEachInstanceProperty(_context31 = _Object$keys(_tooltipTrigger)).call(_context31, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _tooltipTrigger[key]) return;
   _Object$defineProperty(exports, key, {

package/lib/cjs/types/listBox.d.ts

@@ -0,0 +1,49 @@
+import { Key, ReactNode } from 'react';
+import { ComboBoxState, ListState, Node } from 'react-stately';
+import { AriaListBoxOptions, AriaOptionProps } from '@react-aria/listbox';
+import { VirtualizerItemOptions } from '@react-aria/virtualizer';
+import { ReusableView } from '@react-stately/virtualizer';
+import type { CollectionChildren, FocusStrategy } from '@react-types/shared';
+import { BoxProps } from './box';
+export interface ComboBoxStateType extends ComboBoxState<object> {
+    focusStrategy: FocusStrategy;
+}
+export interface ListStateType extends ListState<object> {
+    focusStrategy: FocusStrategy;
+}
+export type ListBoxStateType = ListStateType | ComboBoxStateType;
+interface ListBoxItemType extends Node<unknown> {
+    key: Key;
+}
+export interface ListBoxProps extends AriaListBoxOptions<object> {
+    hasAutoFocus?: boolean;
+    hasFocusWrap?: boolean;
+    hasNoEmptySelection?: boolean;
+    hasVirtualFocus?: boolean;
+    isLoading?: boolean;
+    isFocusedOnHover?: boolean;
+    isSelectedOnPressUp?: boolean;
+    onLoadMore?: () => void;
+    onScroll?: () => void;
+    state: ListBoxStateType;
+    renderEmptyState?: React.ReactNode;
+    variant?: string;
+    children?: CollectionChildren<object>;
+}
+export interface OptionType {
+    item: ListBoxItemType;
+    hasVirtualFocus?: boolean;
+}
+export interface AriaListBoxOptionsType extends AriaOptionProps {
+    onPressStart: () => void;
+    onPressUp: () => void;
+}
+export interface ListBoxSectionProps extends Omit<VirtualizerItemOptions<object, object>, 'ref'> {
+    children?: ReactNode;
+    header: ReusableView<object, ReactNode>;
+}
+export interface UseListBoxSectionProps {
+    headingProps: BoxProps;
+    groupProps: BoxProps;
+}
+export {};

package/lib/cjs/types/listBox.js

@@ -0,0 +1,6 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/components/ListBox/ListBox.js

@@ -13,16 +13,15 @@ import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instanc
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
 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, { forwardRef, useImperativeHandle, useMemo, useRef } from 'react';
+import React, { forwardRef, useImperativeHandle, useMemo } from 'react';
 import { mergeProps } from 'react-aria';
 import { useCollator } from '@react-aria/i18n';
 import { useListBox } from '@react-aria/listbox';
 import { Virtualizer, VirtualizerItem } from '@react-aria/virtualizer';
 import { ListLayout } from '@react-stately/layout';
-import PropTypes from 'prop-types';
-import { isIterableProp } from '../../utils/devUtils/props/isIterable';
+import { useLocalOrForwardRef } from '../../hooks';
 import Loader from '../Loader';
-import { Option } from './index.js';
+import { Option } from './index';
 import { ListBoxContext } from './ListBoxContext';
 import ListBoxSection from './ListBoxSection';
 import { jsx as ___EmotionJSX } from "@emotion/react";
@@ -78,10 +77,10 @@ var ListBox = /*#__PURE__*/forwardRef(function (props, ref) {
     ariaDescribedby = props['aria-describedby'],
     ariaDetails = props['aria-details'],
     others = _objectWithoutProperties(props, _excluded);
-  var focusStrategy = state.focusStrategy;
+
   // Object matching React Aria API with all options
   var listBoxOptions = {
-    autoFocus: hasAutoFocus || focusStrategy,
+    autoFocus: hasAutoFocus,
     defaultSelectedKeys: defaultSelectedKeys,
     disabledKeys: disabledKeys,
     disallowEmptySelection: hasNoEmptySelection,
@@ -106,13 +105,13 @@ var ListBox = /*#__PURE__*/forwardRef(function (props, ref) {
     'aria-describedby': ariaDescribedby,
     'aria-details': ariaDetails
   };
-  var listBoxRef = useRef();
+  var listBoxRef = useLocalOrForwardRef(null);
   /* istanbul ignore next */
   useImperativeHandle(ref, function () {
     return listBoxRef.current;
   });
   var layout = useListBoxLayout(state);
-  layout.isLoading = props.isLoading;
+  layout.isLoading = props.isLoading ? props.isLoading : false;
 
   // Get props for the listbox
   var _useListBox = useListBox(_objectSpread(_objectSpread({}, listBoxOptions), {}, {
@@ -141,6 +140,7 @@ var ListBox = /*#__PURE__*/forwardRef(function (props, ref) {
   return ___EmotionJSX(ListBoxContext.Provider, {
     value: state
   }, ___EmotionJSX(Virtualizer, _extends({}, mergeProps(listBoxProps, others), {
+    autoFocus: hasAutoFocus,
     style: {
       outline: 'none'
     },
@@ -174,42 +174,4 @@ var ListBox = /*#__PURE__*/forwardRef(function (props, ref) {
     return null;
   }));
 });
-ListBox.propTypes = {
-  defaultSelectedKeys: isIterableProp,
-  disabledKeys: isIterableProp,
-  hasAutoFocus: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-  hasFocusWrap: PropTypes.bool,
-  hasNoEmptySelection: PropTypes.bool,
-  hasVirtualFocus: PropTypes.bool,
-  id: PropTypes.string,
-  isFocusedOnHover: PropTypes.bool,
-  isLoading: PropTypes.bool,
-  isSelectedOnPressUp: PropTypes.bool,
-  isVirtualized: PropTypes.bool,
-  items: isIterableProp,
-  keyboardDelegate: PropTypes.shape({}),
-  label: PropTypes.node,
-  onLoadMore: PropTypes.func,
-  onScroll: PropTypes.func,
-  onSelectionChange: PropTypes.func,
-  renderEmptyState: PropTypes.node,
-  selectedKeys: isIterableProp,
-  selectionMode: PropTypes.oneOf(['none', 'single', 'multiple']),
-  'aria-label': PropTypes.string,
-  'aria-labelledby': PropTypes.string,
-  'aria-describedby': PropTypes.string,
-  'aria-details': PropTypes.string,
-  state: PropTypes.shape({
-    close: PropTypes.func,
-    collection: PropTypes.shape({}),
-    focusStrategy: PropTypes.string,
-    isOpen: PropTypes.bool,
-    selectionManager: PropTypes.shape({
-      focusedKey: PropTypes.string
-    })
-  })
-};
-ListBox.defaultProps = {
-  state: {}
-};
 export default ListBox;

package/lib/components/ListBox/ListBox.test.js

@@ -1,5 +1,5 @@
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import React from 'react';
+import React, { forwardRef } from 'react';
 import { Item, Section } from 'react-stately';
 import { useListState } from '@react-stately/list';
 import { render, screen } from '@testing-library/react';
@@ -37,19 +37,13 @@ var defaultWithSectionsProps = {
   'aria-labelledby': 'label',
   items: itemsWithSections
 };
-var ListBoxWithState = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var state = useListState({
-    props: props
-  });
+var ListBoxWithState = /*#__PURE__*/forwardRef(function (props, ref) {
+  var theseProps = {};
+  var state = useListState(theseProps);
   return ___EmotionJSX(ListBox, _extends({}, props, {
     state: state,
     ref: ref
-  }), function (item) {
-    return ___EmotionJSX(Item, {
-      key: item.name,
-      childItems: item.options
-    }, item.name);
-  });
+  }));
 });
 var ListBoxWithSections = function ListBoxWithSections(props) {
   var state = useListState(props);
@@ -59,24 +53,28 @@ var ListBoxWithSections = function ListBoxWithSections(props) {
 };
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return render(___EmotionJSX(ListBoxWithState, _extends({}, defaultProps, props)));
+  return render(___EmotionJSX(ListBoxWithState, _extends({}, defaultProps, props, {
+    items: items
+  }), function (item) {
+    return ___EmotionJSX(Item, {
+      key: item.name,
+      childItems: item.options
+    }, item.name);
+  }));
 };
 var getSectionsComponent = function getSectionsComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return render(___EmotionJSX(ListBoxWithSections, _extends({}, defaultWithSectionsProps, props), function (section) {
-    return (
-      // eslint-disable-next-line testing-library/no-node-access
-      ___EmotionJSX(Section, {
-        key: section.name,
-        title: section.name,
-        items: section.options
-      }, function (item) {
-        return ___EmotionJSX(Item, {
-          key: item.name,
-          childItems: item.options
-        }, item.name);
-      })
-    );
+    return ___EmotionJSX(Section, {
+      key: section.name,
+      title: section.name,
+      items: section.options
+    }, function (item) {
+      return ___EmotionJSX(Item, {
+        key: item.name,
+        childItems: item.options
+      }, item.name);
+    });
   }));
 };
 var offsetWidth;
@@ -93,9 +91,6 @@ beforeAll(function () {
   scrollHeight = jest.spyOn(window.HTMLElement.prototype, 'scrollHeight', 'get').mockImplementation(function () {
     return 48;
   });
-  jest.spyOn(window, 'requestAnimationFrame').mockImplementation(function (cb) {
-    return cb();
-  });
   jest.useFakeTimers();
 });
 afterEach(function () {

package/lib/components/ListBox/ListBoxContext.js

@@ -1,2 +1,2 @@
 import React from 'react';
-export var ListBoxContext = /*#__PURE__*/React.createContext(null);
+export var ListBoxContext = /*#__PURE__*/React.createContext({});

package/lib/components/ListBox/ListBoxSection.js

@@ -13,13 +13,13 @@ var ListBoxSection = function ListBoxSection(props) {
     reusableView = props.reusableView,
     header = props.header;
   var item = reusableView.content;
-  var _useListBoxSection = useListBoxSection({
+  var _ref = useListBoxSection({
       heading: item.rendered,
       'aria-label': item['aria-label']
     }),
-    headingProps = _useListBoxSection.headingProps,
-    groupProps = _useListBoxSection.groupProps;
-  var headerRef = useRef();
+    headingProps = _ref.headingProps,
+    groupProps = _ref.groupProps;
+  var headerRef = useRef(null);
   useVirtualizerItem({
     reusableView: header,
     ref: headerRef

package/lib/components/ListBox/Option.js

@@ -9,16 +9,15 @@ import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
-var _excluded = ["item", "hasVirtualFocus"];
+var _excluded = ["item", "hasVirtualFocus"],
+  _excluded2 = ["onPressStart", "onPressUp"];
 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, { forwardRef, useContext, useEffect, useImperativeHandle, useRef } from 'react';
 import CircleSmallIcon from '@pingux/mdi-react/CircleSmallIcon';
 import { useOption } from '@react-aria/listbox';
-import PropTypes from 'prop-types';
 import { useMultivaluesContext } from '../../context/MultivaluesContext';
 import { useStatusClasses } from '../../hooks';
-import { isIterableProp } from '../../utils/devUtils/props/isIterable';
 import Box from '../Box';
 import Icon from '../Icon';
 import { ListBoxContext } from './ListBoxContext';
@@ -36,7 +35,7 @@ var Option = /*#__PURE__*/forwardRef(function (props, ref) {
   var isSeparator = itemProps.isSeparator,
     dataId = itemProps['data-id'];
   // Get props for the option element
-  var optionRef = useRef();
+  var optionRef = useRef(null);
   /* istanbul ignore next */
   useImperativeHandle(ref, function () {
     return optionRef.current;
@@ -71,11 +70,13 @@ var Option = /*#__PURE__*/forwardRef(function (props, ref) {
     }
   }, [isFocused, updateActiveDescendant]);
 
-  /* Related to UIP-4992
-   * Need to remove these properties to avoid errors in the console on the external app.
-   * By the way, these properties return "undefined", so it shouldn't create issues */
-  delete optionProps.onPressStart;
-  delete optionProps.onPressUp;
+  // /* Related to UIP-4992
+  //  * Need to remove these properties to avoid errors in the console on the external app.
+  //  * By the way, these properties return "undefined", so it shouldn't create issues */
+  var _ref = optionProps,
+    onPressStart = _ref.onPressStart,
+    onPressUp = _ref.onPressUp,
+    theseOptionProps = _objectWithoutProperties(_ref, _excluded2);
   return ___EmotionJSX(Box, _extends({
     as: "li",
     isRow: true,
@@ -84,7 +85,7 @@ var Option = /*#__PURE__*/forwardRef(function (props, ref) {
     "data-id": dataId,
     className: classNames,
     onPointerOver: setFocusOnHover
-  }, optionProps, others, {
+  }, theseOptionProps, others, {
     "aria-label": ariaLabel
   }), isSelected && ___EmotionJSX(Icon, {
     icon: CircleSmallIcon,
@@ -93,27 +94,4 @@ var Option = /*#__PURE__*/forwardRef(function (props, ref) {
     }
   }), rendered);
 });
-Option.propTypes = {
-  hasVirtualFocus: PropTypes.bool,
-  item: PropTypes.shape({
-    key: PropTypes.string,
-    props: PropTypes.shape({
-      'data-id': PropTypes.string,
-      isSeparator: PropTypes.bool
-    }),
-    rendered: PropTypes.node,
-    'aria-label': PropTypes.string
-  }),
-  state: PropTypes.shape({
-    disabledKeys: isIterableProp,
-    selectionManager: PropTypes.shape({
-      focusedKey: PropTypes.string,
-      isSelected: PropTypes.func
-    })
-  })
-};
-Option.defaultProps = {
-  item: {},
-  state: {}
-};
 export default Option;

package/lib/hooks/useSelectField/useSelectField.js

@@ -181,7 +181,7 @@ var useSelectField = function useSelectField(props, ref) {
   }), ___EmotionJSX(ListBox, _extends({
     ref: listBoxRef,
     hasNoEmptySelection: true,
-    hasAutoFocus: state.focusStrategy || true,
+    hasAutoFocus: true,
     state: state,
     variant: "listBox.selectField",
     isLoading: isLoadingMore,

package/lib/types/index.js

@@ -13,6 +13,7 @@ export * from './iconButton';
 export * from './input';
 export * from './item';
 export * from './link';
+export * from './listBox';
 export * from './listItem';
 export * from './loader';
 export * from './menu';

package/lib/types/listBox.js

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.51.0-alpha.0",
+  "version": "2.51.0",
   "description": "React component library for Ping Identity's design system",
   "repository": {
     "type": "git",