@pingux/astro 1.1.1-alpha.0 → 1.1.1-alpha.1

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

@@ -1,230 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
-var _regenerator = _interopRequireDefault(require("@babel/runtime-corejs3/regenerator"));
-
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/asyncToGenerator"));
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _jestAxe = require("jest-axe");
-
-var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
-
-var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
-
-var _testWrapper = require("../../utils/testUtils/testWrapper");
-
-var _index = require("../../index");
-
-var _react2 = require("@emotion/react");
-
-var items = [{
-  name: 'a'
-}, {
-  name: 'b'
-}, {
-  name: 'c'
-}];
-var testId = 'test-dropdown';
-var controlTestId = "".concat(testId, "-input");
-var testValue = 'test';
-var defaultProps = {
-  label: 'testLabel',
-  'data-testid': testId,
-  controlProps: {
-    'data-testid': controlTestId
-  },
-  value: testValue,
-  items: items
-};
-
-var getComponent = function getComponent() {
-  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-      _ref$renderFn = _ref.renderFn,
-      renderFn = _ref$renderFn === void 0 ? _testWrapper.render : _ref$renderFn;
-
-  return renderFn((0, _react2.jsx)(_index.LinkSelectField, (0, _extends2["default"])({}, defaultProps, props), function (item) {
-    return (0, _react2.jsx)(_index.Item, {
-      key: item.name
-    }, item.name);
-  }));
-};
-
-var onSelectionChange = jest.fn();
-beforeAll(function () {
-  jest.spyOn(window.HTMLElement.prototype, 'clientWidth', 'get').mockImplementation(function () {
-    return 1000;
-  });
-  jest.spyOn(window.HTMLElement.prototype, 'clientHeight', 'get').mockImplementation(function () {
-    return 1000;
-  });
-  window.HTMLElement.prototype.scrollIntoView = jest.fn();
-  jest.spyOn(window.screen, 'width', 'get').mockImplementation(function () {
-    return 1024;
-  });
-  jest.spyOn(window, 'requestAnimationFrame').mockImplementation(function (cb) {
-    return cb();
-  });
-  jest.useFakeTimers();
-});
-afterEach(function () {
-  jest.clearAllMocks();
-  onSelectionChange.mockClear();
-});
-afterAll(function () {
-  jest.restoreAllMocks();
-});
-test('default select field', function () {
-  getComponent();
-
-  var container = _testWrapper.screen.getByTestId(testId);
-
-  var inputs = _testWrapper.screen.getAllByLabelText(defaultProps.label);
-
-  var hiddenInput = inputs[0];
-  var visibleInput = inputs[1];
-
-  var labels = _testWrapper.screen.getAllByText(defaultProps.label);
-
-  var visibleLabel = labels[0];
-  var hiddenLabel = labels[1];
-  expect(container).toBeInstanceOf(HTMLDivElement);
-  expect(hiddenInput).toBeInstanceOf(HTMLSelectElement);
-  expect(visibleInput).toBeInstanceOf(HTMLButtonElement);
-  expect(hiddenLabel).toBeInstanceOf(HTMLLabelElement);
-  expect(visibleLabel).toBeInstanceOf(HTMLLabelElement);
-  expect(container).toBeInTheDocument();
-  expect(hiddenInput).toBeInTheDocument();
-  expect(visibleInput).toBeInTheDocument();
-  expect(hiddenLabel).toBeInTheDocument();
-  expect(visibleLabel).toBeInTheDocument(); // jest-dom .toBeVisible does not take into account aria-hidden
-
-  /* eslint-disable testing-library/no-node-access */
-
-  expect(hiddenInput.closest('[aria-hidden="true"]')).not.toBeNull();
-  expect(visibleInput.closest('[aria-hidden="true"]')).toBeNull();
-  expect(hiddenLabel.closest('[aria-hidden="true"]')).not.toBeNull();
-  expect(visibleLabel.closest('[aria-hidden="true"]')).toBeNull();
-  /* eslint-enable testing-library/no-node-access */
-});
-test('control props work for visible button control', function () {
-  getComponent();
-
-  var inputs = _testWrapper.screen.getAllByLabelText(defaultProps.label);
-
-  var visibleInput = inputs[1];
-  expect(_testWrapper.screen.getByTestId("".concat(testId, "-input"))).toBe(visibleInput);
-});
-test('should disable the label and control when isDisabled is true', function () {
-  getComponent({
-    isDisabled: true
-  });
-  expect(_testWrapper.screen.getAllByText(defaultProps.label)[0]).toHaveClass('is-disabled');
-  expect(_testWrapper.screen.getByTestId(controlTestId)).toHaveClass('is-disabled');
-});
-test('clicking on the visible button opens the popuplist', function () {
-  getComponent();
-
-  var button = _testWrapper.screen.getByRole('button');
-
-  expect(_testWrapper.screen.queryByRole('listbox')).not.toBeInTheDocument();
-  expect(_testWrapper.screen.queryByRole('option')).not.toBeInTheDocument();
-
-  _userEvent["default"].click(button);
-
-  expect(_testWrapper.screen.queryByRole('listbox')).toBeInTheDocument();
-  expect(_testWrapper.screen.queryAllByRole('option')).toHaveLength(3);
-});
-test('onOpenChange prop for field', function () {
-  var onOpenChange = jest.fn();
-  getComponent({
-    onOpenChange: onOpenChange
-  });
-
-  var button = _testWrapper.screen.getByRole('button');
-
-  expect(onOpenChange).not.toHaveBeenCalled();
-
-  _userEvent["default"].click(button);
-
-  expect(onOpenChange).toHaveBeenNthCalledWith(1, true);
-
-  _userEvent["default"].click(button);
-
-  expect(onOpenChange).toHaveBeenNthCalledWith(2, false);
-});
-test('selectedKey for controlled select field', function () {
-  getComponent({
-    selectedKey: 'b'
-  });
-
-  var button = _testWrapper.screen.getByRole('button');
-
-  expect(button).toHaveTextContent('Select');
-
-  _userEvent["default"].click(button);
-
-  expect(_testWrapper.screen.queryAllByRole('option')[0]).not.toHaveClass('is-selected');
-  expect(_testWrapper.screen.queryAllByRole('option')[1]).toHaveClass('is-selected');
-  expect(_testWrapper.screen.queryAllByRole('option')[2]).not.toHaveClass('is-selected');
-});
-test('select field with helper text', function () {
-  var helperText = 'some text';
-  getComponent({
-    helperText: helperText,
-    status: _statuses["default"].ERROR
-  });
-
-  var fieldHelperText = _testWrapper.screen.getByText(helperText);
-
-  expect(fieldHelperText).toBeInTheDocument();
-  expect(fieldHelperText).toHaveClass("is-".concat(_statuses["default"].ERROR));
-});
-test('displays a loader while loading', function () {
-  var _getComponent = getComponent({
-    items: [],
-    isLoading: true
-  }),
-      rerender = _getComponent.rerender;
-
-  var button = _testWrapper.screen.getByRole('button');
-
-  var loader = (0, _testWrapper.within)(button).getByRole('progressbar');
-  expect(loader).toHaveAttribute('aria-label', 'Loading...');
-  expect(loader).not.toHaveAttribute('aria-valuenow');
-  getComponent({
-    items: []
-  }, {
-    renderFn: rerender
-  });
-  expect(loader).not.toBeInTheDocument();
-});
-test('should have no accessibility violations', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
-  var _getComponent2, container, results;
-
-  return _regenerator["default"].wrap(function _callee$(_context) {
-    while (1) {
-      switch (_context.prev = _context.next) {
-        case 0:
-          jest.useRealTimers();
-          _getComponent2 = getComponent(), container = _getComponent2.container;
-          _context.next = 4;
-          return (0, _jestAxe.axe)(container);
-
-        case 4:
-          results = _context.sent;
-          expect(results).toHaveNoViolations();
-
-        case 6:
-        case "end":
-          return _context.stop();
-      }
-    }
-  }, _callee);
-})));

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

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

package/lib/cjs/components/List/List.js

@@ -1,44 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime-corejs3/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
-_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 _Box = _interopRequireDefault(require("../Box/Box"));
-
-var _hooks = require("../../hooks");
-
-var _react2 = require("@emotion/react");
-
-/**
- * The intended use of List is to hold a collection of <ListItem/> components.
- * Accepts most of the styling props from [styled-system](https://styled-system.com/table).
-*/
-var List = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var children = props.children,
-      others = (0, _objectWithoutProperties2["default"])(props, ["children"]);
-  (0, _hooks.useDeprecationWarning)('The  List component will be deprecated in Astro-UI 2.0.0, use ListView instead.');
-  return (0, _react2.jsx)(_Box["default"], (0, _extends2["default"])({
-    ref: ref,
-    role: "list",
-    as: "ul",
-    pl: "0"
-  }, others), children);
-});
-List.displayName = 'List';
-var _default = List;
-exports["default"] = _default;

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

@@ -1,66 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-
-exports.Default = exports["default"] = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _ = _interopRequireDefault(require("."));
-
-var _ListItem = _interopRequireDefault(require("../ListItem"));
-
-var _Text = _interopRequireDefault(require("../Text"));
-
-var _Separator = _interopRequireDefault(require("../Separator"));
-
-var _withDeprecationWarning = _interopRequireDefault(require("../../utils/devUtils/decorators/withDeprecationWarning"));
-
-var _react2 = require("@emotion/react");
-
-var _default = {
-  title: 'Deprecated/List',
-  component: [_["default"], _ListItem["default"]],
-  decorators: [function (Story, context) {
-    return (0, _withDeprecationWarning["default"])(Story, context, 'The `List` component will be deprecated in Astro-UI 2.0.0, use `ListView` instead.');
-  }]
-};
-exports["default"] = _default;
-
-var Default = function Default() {
-  return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_Text["default"], {
-    variant: "itemTitle",
-    mb: "md",
-    color: "text.secondary"
-  }, "Registration Forms"), (0, _react2.jsx)(_["default"], null, (0, _react2.jsx)(_ListItem["default"], null, (0, _react2.jsx)(_Text["default"], {
-    variant: "itemTitle",
-    alignSelf: "center",
-    mr: "auto"
-  }, "Form 1")), (0, _react2.jsx)(_Separator["default"], {
-    margin: "0"
-  }), (0, _react2.jsx)(_ListItem["default"], {
-    title: "Form 2"
-  }, (0, _react2.jsx)(_Text["default"], {
-    variant: "itemTitle",
-    alignSelf: "center",
-    mr: "auto"
-  }, "Form 2")), (0, _react2.jsx)(_Separator["default"], {
-    margin: "0"
-  }), (0, _react2.jsx)(_ListItem["default"], {
-    title: "Form 3"
-  }, (0, _react2.jsx)(_Text["default"], {
-    variant: "itemTitle",
-    alignSelf: "center",
-    mr: "auto"
-  }, "Form 3")), (0, _react2.jsx)(_Separator["default"], {
-    margin: "0"
-  })));
-};
-
-exports.Default = Default;

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

@@ -1,36 +0,0 @@
-"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 _react2 = require("@testing-library/react");
-
-var _List = _interopRequireDefault(require("./List"));
-
-var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
-
-var _react3 = require("@emotion/react");
-
-var testLabel = 'Test Label';
-var defaultProps = {
-  title: testLabel
-};
-
-var getComponent = function getComponent() {
-  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return (0, _react2.render)((0, _react3.jsx)(_List["default"], (0, _extends2["default"])({}, defaultProps, props)));
-}; // Need to be added to each test file to test accessibility using axe.
-
-
-(0, _testAxe["default"])(getComponent);
-test('renders List component', function () {
-  getComponent();
-
-  var list = _react2.screen.getByRole('list');
-
-  expect(list).toBeInstanceOf(HTMLUListElement);
-  expect(list).toBeInTheDocument();
-});

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

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

package/lib/cjs/components/ListBox/ListBox.js

@@ -1,264 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime-corejs3/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
-var _Object$defineProperty2 = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
-_Object$defineProperty2(exports, "__esModule", {
-  value: true
-});
-
-exports.useListBoxLayout = useListBoxLayout;
-exports["default"] = exports.collectionTypes = void 0;
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/define-property"));
-
-var _defineProperties = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/define-properties"));
-
-var _getOwnPropertyDescriptors = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors"));
-
-var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
-
-var _getOwnPropertyDescriptor = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor"));
-
-var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
-
-var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
-var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
-
-var _find = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/find"));
-
-var _defineProperty3 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _listbox = require("@react-aria/listbox");
-
-var _utils = require("@react-aria/utils");
-
-var _virtualizer = require("@react-aria/virtualizer");
-
-var _i18n = require("@react-aria/i18n");
-
-var _layout = require("@react-stately/layout");
-
-var _ListBoxContext = require("./ListBoxContext");
-
-var _index = require("./index.js");
-
-var _isIterable = require("../../utils/devUtils/props/isIterable");
-
-var _Loader = _interopRequireDefault(require("../Loader"));
-
-var _ListBoxSection = _interopRequireDefault(require("./ListBoxSection"));
-
-var _react2 = require("@emotion/react");
-
-function ownKeys(object, enumerableOnly) { var keys = (0, _keys["default"])(object); if (_getOwnPropertySymbols["default"]) { var symbols = (0, _getOwnPropertySymbols["default"])(object); if (enumerableOnly) symbols = (0, _filter["default"])(symbols).call(symbols, function (sym) { return (0, _getOwnPropertyDescriptor["default"])(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; (0, _forEach["default"])(_context = ownKeys(Object(source), true)).call(_context, function (key) { (0, _defineProperty3["default"])(target, key, source[key]); }); } else if (_getOwnPropertyDescriptors["default"]) { (0, _defineProperties["default"])(target, (0, _getOwnPropertyDescriptors["default"])(source)); } else { var _context2; (0, _forEach["default"])(_context2 = ownKeys(Object(source))).call(_context2, function (key) { (0, _defineProperty2["default"])(target, key, (0, _getOwnPropertyDescriptor["default"])(source, key)); }); } } return target; }
-
-var collectionTypes = {
-  ITEM: 'item',
-  LOADER: 'loader',
-  PLACEHOLDER: 'placeholder'
-};
-exports.collectionTypes = collectionTypes;
-
-function useListBoxLayout(state) {
-  var collator = (0, _i18n.useCollator)({
-    usage: 'search',
-    sensitivity: 'base'
-  });
-  var layout = (0, _react.useMemo)(function () {
-    return new _layout.ListLayout({
-      estimatedRowHeight: 41,
-      estimatedHeadingHeight: 26,
-      padding: 4,
-      loaderHeight: 41,
-      placeholderHeight: 41,
-      collator: collator
-    });
-  }, [collator]);
-  layout.collection = state.collection;
-  layout.disabledKeys = state.disabledKeys;
-  return layout;
-}
-
-var ListBox = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var _state$selectionManag;
-
-  var defaultSelectedKeys = props.defaultSelectedKeys,
-      disabledKeys = props.disabledKeys,
-      hasAutoFocus = props.hasAutoFocus,
-      hasFocusWrap = props.hasFocusWrap,
-      hasNoEmptySelection = props.hasNoEmptySelection,
-      hasVirtualFocus = props.hasVirtualFocus,
-      id = props.id,
-      isLoading = props.isLoading,
-      isFocusedOnHover = props.isFocusedOnHover,
-      isSelectedOnPressUp = props.isSelectedOnPressUp,
-      isVirtualized = props.isVirtualized,
-      items = props.items,
-      keyboardDelegate = props.keyboardDelegate,
-      label = props.label,
-      onLoadMore = props.onLoadMore,
-      onScroll = props.onScroll,
-      onSelectionChange = props.onSelectionChange,
-      renderEmptyState = props.renderEmptyState,
-      selectedKeys = props.selectedKeys,
-      selectionMode = props.selectionMode,
-      state = props.state,
-      ariaLabel = props['aria-label'],
-      ariaLabelledby = props['aria-labelledby'],
-      ariaDescribedby = props['aria-describedby'],
-      ariaDetails = props['aria-details'],
-      others = (0, _objectWithoutProperties2["default"])(props, ["defaultSelectedKeys", "disabledKeys", "hasAutoFocus", "hasFocusWrap", "hasNoEmptySelection", "hasVirtualFocus", "id", "isLoading", "isFocusedOnHover", "isSelectedOnPressUp", "isVirtualized", "items", "keyboardDelegate", "label", "onLoadMore", "onScroll", "onSelectionChange", "renderEmptyState", "selectedKeys", "selectionMode", "state", "aria-label", "aria-labelledby", "aria-describedby", "aria-details"]);
-  var focusStrategy = state.focusStrategy; // Object matching React Aria API with all options
-
-  var listBoxOptions = {
-    autoFocus: hasAutoFocus || focusStrategy,
-    defaultSelectedKeys: defaultSelectedKeys,
-    disabledKeys: disabledKeys,
-    disallowEmptySelection: hasNoEmptySelection,
-    id: id,
-    isLoading: isLoading,
-    isVirtualized: isVirtualized,
-    items: items,
-    keyboardDelegate: keyboardDelegate,
-    label: label,
-    onLoadMore: onLoadMore,
-    onScroll: onScroll,
-    onSelectionChange: onSelectionChange,
-    renderEmptyState: renderEmptyState,
-    selectedKeys: selectedKeys,
-    selectionMode: selectionMode,
-    shouldFocusOnHover: isFocusedOnHover,
-    shouldFocusWrap: hasFocusWrap,
-    shouldSelectOnPressUp: isSelectedOnPressUp,
-    shouldUseVirtualFocus: hasVirtualFocus,
-    'aria-label': ariaLabel,
-    'aria-labelledby': ariaLabelledby,
-    'aria-describedby': ariaDescribedby,
-    'aria-details': ariaDetails
-  };
-  var listBoxRef = (0, _react.useRef)();
-  /* istanbul ignore next */
-
-  (0, _react.useImperativeHandle)(ref, function () {
-    return listBoxRef.current;
-  });
-  var layout = useListBoxLayout(state);
-  layout.isLoading = props.isLoading; // Get props for the listbox
-
-  var _useListBox = (0, _listbox.useListBox)(_objectSpread(_objectSpread({}, listBoxOptions), {}, {
-    keyboardDelegate: layout,
-    isVirtualized: true
-  }), state, listBoxRef),
-      listBoxProps = _useListBox.listBoxProps;
-
-  var renderWrapper = function renderWrapper(parent, reusableView, children, renderChildren) {
-    if (reusableView.viewType === 'section') {
-      return (0, _react2.jsx)(_ListBoxSection["default"], {
-        key: reusableView.key,
-        reusableView: reusableView,
-        header: (0, _find["default"])(children).call(children, function (c) {
-          return c.viewType === 'header';
-        })
-      }, renderChildren((0, _filter["default"])(children).call(children, function (c) {
-        return c.viewType === 'item';
-      })));
-    }
-
-    return (0, _react2.jsx)(_virtualizer.VirtualizerItem, {
-      key: reusableView.key,
-      reusableView: reusableView,
-      parent: parent
-    });
-  };
-
-  return (0, _react2.jsx)(_ListBoxContext.ListBoxContext.Provider, {
-    value: state
-  }, (0, _react2.jsx)(_virtualizer.Virtualizer, (0, _extends2["default"])({}, (0, _utils.mergeProps)(listBoxProps, others), {
-    style: {
-      outline: 'none'
-    },
-    ref: listBoxRef,
-    focusedKey: state === null || state === void 0 ? void 0 : (_state$selectionManag = state.selectionManager) === null || _state$selectionManag === void 0 ? void 0 : _state$selectionManag.focusedKey,
-    sizeToFit: "height",
-    scrollDirection: "vertical",
-    collection: state.collection,
-    renderWrapper: renderWrapper,
-    transitionDuration: 0,
-    layout: layout,
-    isLoading: isLoading,
-    onLoadMore: onLoadMore,
-    shouldUseVirtualFocus: hasVirtualFocus,
-    onScroll: onScroll
-  }), function (type, item) {
-    // Type can be used like so: https://github.com/adobe/react-spectrum/blob/main/packages/%40react-spectrum/listbox/src/ListBoxBase.tsx#L129
-    if (type === collectionTypes.ITEM) {
-      return (0, _react2.jsx)(_index.Option, {
-        key: item.key,
-        item: item,
-        hasVirtualFocus: hasVirtualFocus
-      });
-    } else if (type === collectionTypes.LOADER) {
-      return (0, _react2.jsx)(_Loader["default"], {
-        variant: "loader.withinListbox",
-        "aria-label": "Loading more..."
-      });
-    }
-
-    return null;
-  }));
-});
-ListBox.propTypes = {
-  defaultSelectedKeys: _isIterable.isIterableProp,
-  disabledKeys: _isIterable.isIterableProp,
-  hasAutoFocus: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].string]),
-  hasFocusWrap: _propTypes["default"].bool,
-  hasNoEmptySelection: _propTypes["default"].bool,
-  hasVirtualFocus: _propTypes["default"].bool,
-  id: _propTypes["default"].string,
-  isFocusedOnHover: _propTypes["default"].bool,
-  isLoading: _propTypes["default"].bool,
-  isSelectedOnPressUp: _propTypes["default"].bool,
-  isVirtualized: _propTypes["default"].bool,
-  items: _isIterable.isIterableProp,
-  keyboardDelegate: _propTypes["default"].shape({}),
-  label: _propTypes["default"].node,
-  onLoadMore: _propTypes["default"].func,
-  onScroll: _propTypes["default"].func,
-  onSelectionChange: _propTypes["default"].func,
-  renderEmptyState: _propTypes["default"].node,
-  selectedKeys: _isIterable.isIterableProp,
-  selectionMode: _propTypes["default"].oneOf(['none', 'single', 'multiple']),
-  'aria-label': _propTypes["default"].string,
-  'aria-labelledby': _propTypes["default"].string,
-  'aria-describedby': _propTypes["default"].string,
-  'aria-details': _propTypes["default"].string,
-  state: _propTypes["default"].shape({
-    close: _propTypes["default"].func,
-    collection: _propTypes["default"].shape({}),
-    focusStrategy: _propTypes["default"].string,
-    isOpen: _propTypes["default"].bool,
-    selectionManager: _propTypes["default"].shape({
-      focusedKey: _propTypes["default"].string
-    })
-  })
-};
-ListBox.defaultProps = {
-  state: {}
-};
-var _default = ListBox;
-exports["default"] = _default;