@pingux/astro 2.57.0 → 2.58.0

package/lib/cjs/components/Tabs/Tabs.js

@@ -26,14 +26,13 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-c
 var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
 var _reactStately = require("react-stately");
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _hooks = require("../../hooks");
 var _orientation = _interopRequireDefault(require("../../utils/devUtils/constants/orientation"));
 var _Box = _interopRequireDefault(require("../Box"));
 var _Tab = require("../Tab");
 var _react2 = require("@emotion/react");
 var _excluded = ["state"],
-  _excluded2 = ["children", "isDisabled", "items", "onSelectionChange", "orientation", "mode", "tabListProps", "tabPanelProps"];
+  _excluded2 = ["isDisabled", "items", "onSelectionChange", "orientation", "mode", "tabListProps", "tabPanelProps"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty2(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -43,23 +42,19 @@ exports.TabsContext = TabsContext;
 var TabPanel = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var state = _ref.state,
     props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
-  var tabPanelRef = (0, _react.useRef)();
   var children = props.children,
     tabPanelProps = props.tabPanelProps;
-  /* istanbul ignore next */
-  (0, _react.useImperativeHandle)(ref, function () {
-    return tabPanelRef.current;
-  });
-  var _useTabPanel = (0, _reactAria.useTabPanel)(props, state, tabPanelRef),
-    raTabPanelProps = _useTabPanel.tabPanelProps;
+  var tabPanelRef = (0, _hooks.useLocalOrForwardRef)(ref);
+  var _ref2 = (0, _reactAria.useTabPanel)(props, state, tabPanelRef),
+    raTabPanelProps = _ref2.tabPanelProps;
   return (0, _react2.jsx)(_Box["default"], (0, _extends2["default"])({}, tabPanelProps, raTabPanelProps, {
-    ref: tabPanelRef
+    ref: tabPanelRef,
+    role: "tabpanel"
   }), children);
 });
 var Tabs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _context4, _context5, _state$selectedItem, _state$selectedItem2, _state$selectedItem3;
-  var children = props.children,
-    isDisabled = props.isDisabled,
+  var isDisabled = props.isDisabled,
     items = props.items,
     onSelectionChange = props.onSelectionChange,
     orientation = props.orientation,
@@ -67,14 +62,10 @@ var Tabs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     tabListProps = props.tabListProps,
     tabPanelProps = props.tabPanelProps,
     others = (0, _objectWithoutProperties2["default"])(props, _excluded2);
-  var tabListRef = (0, _react.useRef)();
   (0, _hooks.usePropWarning)(props, 'disabled', 'isDisabled');
-  /* istanbul ignore next */
-  (0, _react.useImperativeHandle)(ref, function () {
-    return tabListRef.current;
-  });
+  var tabListRef = (0, _hooks.useLocalOrForwardRef)(ref);
   var allItems = [];
-  if (mode === 'list') {
+  if (mode === 'list' && items) {
     (0, _forEach["default"])(items).call(items, function (item) {
       var _context;
       allItems = (0, _concat["default"])(_context = []).call(_context, allItems, [item]);
@@ -94,7 +85,8 @@ var Tabs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     items: mode === 'list' ? allItems : items
   }));
   var _useTabList = (0, _reactAria.useTabList)(props, state, tabListRef),
-    raTabListProps = _useTabList.tabListProps;
+    raTabListProps = _useTabList.tabListProps; //= useTabList(props, state, tabListRef);
+
   return (0, _react2.jsx)(TabsContext.Provider, {
     value: state
   }, (0, _react2.jsx)(_Box["default"], others, (0, _react2.jsx)(_Box["default"], (0, _extends2["default"])({
@@ -102,19 +94,20 @@ var Tabs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     gap: "25px",
     isRow: orientation === _orientation["default"].HORIZONTAL
   }, tabListProps, raTabListProps, {
-    ref: tabListRef
+    ref: tabListRef,
+    role: "tablist"
   }), (0, _map["default"])(_context4 = (0, _filter["default"])(_context5 = (0, _from["default"])(state.collection)).call(_context5, function (item) {
-    var _item$value;
-    return !(item !== null && item !== void 0 && (_item$value = item.value) !== null && _item$value !== void 0 && _item$value.isListItem);
-  })).call(_context4, function (item) {
     var _item$props;
+    return !(item !== null && item !== void 0 && (_item$props = item.props) !== null && _item$props !== void 0 && _item$props.isListItem);
+  })).call(_context4, function (item) {
+    var _item$props2;
     return (0, _react2.jsx)(_Tab.CollectionTab, {
       key: item.key,
       item: item,
       isDisabled: isDisabled,
       orientation: orientation,
       mode: mode,
-      slots: item === null || item === void 0 || (_item$props = item.props) === null || _item$props === void 0 ? void 0 : _item$props.slots
+      slots: item === null || item === void 0 || (_item$props2 = item.props) === null || _item$props2 === void 0 ? void 0 : _item$props2.slots
     });
   })), (0, _react2.jsx)(TabPanel, {
     key: (_state$selectedItem = state.selectedItem) === null || _state$selectedItem === void 0 ? void 0 : _state$selectedItem.key,
@@ -122,43 +115,12 @@ var Tabs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     tabPanelProps: tabPanelProps
   }, ((_state$selectedItem2 = state.selectedItem) === null || _state$selectedItem2 === void 0 ? void 0 : _state$selectedItem2.props.children) || ((_state$selectedItem3 = state.selectedItem) === null || _state$selectedItem3 === void 0 ? void 0 : _state$selectedItem3.props.content))));
 });
-Tabs.propTypes = {
-  /** The default tab key to be selected. (uncontrolled) */
-  defaultSelectedKey: _propTypes["default"].string,
-  /** Array of keys to disable within the tab list. */
-  disabledKeys: _propTypes["default"].arrayOf(_propTypes["default"].string),
-  /** The tab key that is currently selected. (controlled) */
-  selectedKey: _propTypes["default"].string,
-  /** Determines the arrangement of the tablist. */
-  orientation: _propTypes["default"].oneOf(['horizontal', 'vertical']),
-  /** Determines the behavior model for the tabs. */
-  mode: _propTypes["default"].oneOf(['default', 'tooltip', 'list']),
-  /**
-   * *For performance reasons, use this prop instead of Array.map when iteratively rendering Items*.
-   * For use with [dynamic collections](https://react-spectrum.adobe.com/react-stately/collections.html#dynamic-collections).
-  */
-  items: _propTypes["default"].arrayOf(_propTypes["default"].shape({})),
-  /** Whether the entire tablist is disabled. */
-  isDisabled: _propTypes["default"].bool,
-  /** Handler that is called when the selected tab has changed. */
-  onSelectionChange: _propTypes["default"].func,
-  /** A props object that is subsequently spread into the rendered tablist. */
-  tabListProps: _propTypes["default"].shape({}),
-  /** Props object that is spread directly into all of the tab panel wrapper elements. */
-  tabPanelProps: _propTypes["default"].shape({}),
-  /** Whether tabs are activated automatically on focus or manually¸ */
-  keyboardActivation: _propTypes["default"].oneOf(['automatic', 'manual'])
-};
 Tabs.defaultProps = {
   isDisabled: false,
   orientation: 'horizontal',
   mode: 'default',
   keyboardActivation: 'manual'
 };
-TabPanel.propTypes = {
-  state: _propTypes["default"].shape({}),
-  tabPanelProps: _propTypes["default"].shape({})
-};
 Tabs.displayName = 'Tabs';
 var _default = Tabs;
 exports["default"] = _default;

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

@@ -0,0 +1,14 @@
+import { StoryFn } from '@storybook/react';
+import { TabsProps } 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 Uncontrolled: StoryFn<TabsProps>;
+export declare const Controlled: StoryFn;
+export declare const WithTooltips: StoryFn;
+export declare const Centered: StoryFn;
+export declare const DisabledSingleTab: StoryFn;
+export declare const DisabledAllTabs: StoryFn;
+export declare const CustomTabLine: StoryFn;
+export declare const TabPanelProps: StoryFn;
+export declare const ContentSlots: StoryFn;
+export declare const WithList: StoryFn;

package/lib/cjs/components/Tabs/Tabs.style.d.ts

@@ -0,0 +1,52 @@
+export declare const tab: {
+    pt: number;
+    cursor: string;
+    alignItems: string;
+    display: string;
+    outline: string;
+    transform: string;
+    '&.is-focused': {
+        '& > span': {
+            boxShadow: string;
+            outline: string;
+            outlineColor: string;
+            outlineOffset: string;
+        };
+    };
+    '&.is-disabled': {
+        cursor: string;
+    };
+    '&.is-selected.is-vertical': {
+        bg: string;
+    };
+    '& > svg': {
+        flexShrink: number;
+    };
+};
+export declare const tabLine: {
+    height: string;
+    width: string;
+    bg: string;
+    flexShrink: number;
+};
+export declare const tabPanel: {
+    outline: string;
+};
+export declare const tabs: {
+    borderBottomWidth: number;
+    borderBottomStyle: string;
+    borderBottomColor: string;
+    mb: string;
+};
+export declare const menuTab: {
+    color: string;
+    alignItems: string;
+    '&.is-selected *, &.is-hovered *': {
+        color: string;
+    };
+    '& + *:not(div:first-of-type)': {
+        ml: string;
+    };
+    all: string;
+    display: string;
+};

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

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

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

@@ -38,17 +38,21 @@ emotionCache.compat = true;
 var testId = 'testId';
 var defaultTabs = [{
   name: 'Tab 1',
-  children: 'Tab 1 body'
+  children: 'Tab 1 body',
+  props: {}
 }, {
   name: 'Tab 2',
-  children: 'Tab 2 body'
+  children: 'Tab 2 body',
+  props: {}
 }, {
   name: 'Tab 3',
-  children: 'Tab 3 body'
+  children: 'Tab 3 body',
+  props: {}
 }];
 var tabsWithList = [{
   name: 'Tab 1',
-  children: 'Tab 1 body'
+  children: 'Tab 1 body',
+  props: {}
 }, {
   name: 'Tab 2',
   list: [{
@@ -61,7 +65,8 @@ var tabsWithList = [{
     name: 'Tab 2 list',
     children: 'Tab 2 from list',
     role: 'menuitemradio'
-  }]
+  }],
+  props: {}
 }];
 var defaultProps = {
   'data-testid': testId,
@@ -78,8 +83,8 @@ var getComponent = function getComponent() {
     value: emotionCache
   }, (0, _react2.jsx)(_Tabs["default"], (0, _extends2["default"])({}, defaultProps, props), (0, _map["default"])(tabs).call(tabs, function (_ref2) {
     var name = _ref2.name,
-      tabProps = _ref2.props,
-      children = _ref2.children;
+      children = _ref2.children,
+      tabProps = _ref2.props;
     return (0, _react2.jsx)(_Tab["default"], (0, _extends2["default"])({
       key: name,
       title: name
@@ -115,7 +120,10 @@ var getTabs = function getTabs() {
 var testTabPanel = function testTabPanel(expectedTabIndex) {
   return (0, _forEach["default"])(defaultTabs).call(defaultTabs, function (_ref4, index) {
     var children = _ref4.children;
-    return index === expectedTabIndex ? expect(_testWrapper.screen.queryByText(children)).toBeInTheDocument() : expect(_testWrapper.screen.queryByText(children)).not.toBeInTheDocument();
+    if (typeof children === 'string') {
+      return index === expectedTabIndex ? expect(_testWrapper.screen.queryByText(children)).toBeInTheDocument() : expect(_testWrapper.screen.queryByText(children)).not.toBeInTheDocument();
+    }
+    return null;
   });
 };
 var testSingleTab = function testSingleTab(tabs, tab, thisTest) {
@@ -265,9 +273,11 @@ test('disabled all tabs', function () {
 
   // Tabs cannot be DOM disabled so must check visuals
   (0, _forEach["default"])(defaultTabs).call(defaultTabs, function (tab) {
-    var tabText = _testWrapper.screen.getByText(tab.name);
-    var parentElement = tabText.parentElement;
-    expect(parentElement).toHaveClass('is-disabled');
+    if (tab.name) {
+      var tabText = _testWrapper.screen.getByText(tab.name);
+      var parentElement = tabText.parentElement;
+      expect(parentElement).toHaveClass('is-disabled');
+    }
   });
   expect(tabLine).not.toBeInTheDocument();
 
@@ -414,7 +424,7 @@ test('tabs without selected keys show null tab panel content', function () {
   getComponent({
     defaultSelectedKey: undefined
   });
-  expect(_testWrapper.screen.queryByRole('tabpanel')).not.toHaveTextContent();
+  expect(_testWrapper.screen.queryByRole('tabpanel')).not.toHaveTextContent('');
 });
 test('hover tab style', function () {
   getComponent();
@@ -469,17 +479,21 @@ test('will render tab with list if provided', /*#__PURE__*/(0, _asyncToGenerator
         });
         testTabPanel(0);
         _getTabs12 = getTabs(), menuBtn = _getTabs12.tab1.parentElement;
-        _userEvent["default"].click(menuBtn);
+        if (menuBtn) _userEvent["default"].click(menuBtn);
         expect(_testWrapper.screen.queryByRole('menu')).toBeInTheDocument();
         testTabPanel(0);
         menuItems = _testWrapper.screen.queryAllByRole('menuitemradio');
-        expect(menuItems).toHaveLength(tabsWithList[1].list.length);
+        if (tabsWithList[1].list) {
+          expect(menuItems).toHaveLength(tabsWithList[1].list.length);
+        }
         expect(menuItems[0]).not.toHaveFocus();
         _userEvent["default"].click(menuItems[0]);
-        firstListItemContent = tabsWithList[1].list[0].children;
-        expect(_testWrapper.screen.queryByRole('tabpanel')).toHaveTextContent(firstListItemContent);
+        if (tabsWithList[1].list) {
+          firstListItemContent = tabsWithList[1].list[0].children;
+          expect(_testWrapper.screen.queryByRole('tabpanel')).toHaveTextContent(firstListItemContent);
+        }
         expect(_testWrapper.screen.queryByRole('menu')).not.toBeInTheDocument();
-      case 13:
+      case 12:
       case "end":
         return _context2.stop();
     }
@@ -511,13 +525,17 @@ test('tab list is accessible via keyboard', function () {
   expect(_testWrapper.screen.queryByRole('menu')).toBeInTheDocument();
   testTabPanel(0);
   var menuItems = _testWrapper.screen.queryAllByRole('menuitemradio');
-  expect(menuItems).toHaveLength(tabsWithList[1].list.length);
+  if (tabsWithList[1].list) {
+    expect(menuItems).toHaveLength(tabsWithList[1].list.length);
+  }
   expect(menuItems[0]).toHaveFocus();
   _testWrapper.fireEvent.keyDown(menuItems[0], {
     key: 'Enter',
     code: 'Enter'
   });
-  var firstListItemContent = tabsWithList[1].list[0].children;
-  expect(_testWrapper.screen.queryByRole('tabpanel')).toHaveTextContent(firstListItemContent);
+  if (tabsWithList[1].list) {
+    var firstListItemContent = tabsWithList[1].list[0].children;
+    expect(_testWrapper.screen.queryByRole('tabpanel')).toHaveTextContent(firstListItemContent);
+  }
   expect(_testWrapper.screen.queryByRole('menu')).not.toBeInTheDocument();
 });

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

@@ -0,0 +1,2 @@
+export { default } from './Tabs';
+export * from './Tabs';

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

@@ -34,6 +34,8 @@ export * from './rockerButtonGroup';
 export * from './scrollBox';
 export * from './separator';
 export * from './shared';
+export * from './tab';
 export * from './table';
+export * from './tabs';
 export * from './text';
 export * from './tooltipTrigger';

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, _context31, _context32, _context33, _context34, _context35, _context36, _context37, _context38, _context39;
+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, _context32, _context33, _context34, _context35, _context36, _context37, _context38, _context39, _context40, _context41;
 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");
@@ -403,8 +403,19 @@ _forEachInstanceProperty(_context36 = _Object$keys(_shared)).call(_context36, fu
     }
   });
 });
+var _tab = require("./tab");
+_forEachInstanceProperty(_context37 = _Object$keys(_tab)).call(_context37, function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _tab[key]) return;
+  _Object$defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _tab[key];
+    }
+  });
+});
 var _table = require("./table");
-_forEachInstanceProperty(_context37 = _Object$keys(_table)).call(_context37, function (key) {
+_forEachInstanceProperty(_context38 = _Object$keys(_table)).call(_context38, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _table[key]) return;
   _Object$defineProperty(exports, key, {
@@ -414,8 +425,19 @@ _forEachInstanceProperty(_context37 = _Object$keys(_table)).call(_context37, fun
     }
   });
 });
+var _tabs = require("./tabs");
+_forEachInstanceProperty(_context39 = _Object$keys(_tabs)).call(_context39, function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _tabs[key]) return;
+  _Object$defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _tabs[key];
+    }
+  });
+});
 var _text = require("./text");
-_forEachInstanceProperty(_context38 = _Object$keys(_text)).call(_context38, function (key) {
+_forEachInstanceProperty(_context40 = _Object$keys(_text)).call(_context40, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _text[key]) return;
   _Object$defineProperty(exports, key, {
@@ -426,7 +448,7 @@ _forEachInstanceProperty(_context38 = _Object$keys(_text)).call(_context38, func
   });
 });
 var _tooltipTrigger = require("./tooltipTrigger");
-_forEachInstanceProperty(_context39 = _Object$keys(_tooltipTrigger)).call(_context39, function (key) {
+_forEachInstanceProperty(_context41 = _Object$keys(_tooltipTrigger)).call(_context41, 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/item.d.ts

@@ -1,4 +1,4 @@
-import { ElementType, Key } from 'react';
+import { ElementType, Key, ReactNode } from 'react';
 import type { ItemProps } from '@react-types/shared';
 import { IconTypeExtended } from './icon';
 import { DOMAttributes, StyleProps } from './shared';
@@ -8,13 +8,15 @@ export interface Status {
 declare module '@react-types/shared' {
     interface ItemProps<T> extends StyleProps, DOMAttributes {
         /** The rendered label for the item. */
-        label?: string | React.ReactNode;
+        label?: string | ReactNode;
         /** Props for the accordion item content element. */
         regionProps?: StyleProps;
         /** Props for the accordion item content element. */
         containerProps?: StyleProps;
         /** Props for the accordion item button element. */
         buttonProps?: StyleProps;
+        /** Props for the tab line element. */
+        tabLineProps?: StyleProps;
         /** Whether the item has a separator */
         isSeparator?: boolean;
         /** Whether the item is pressed */
@@ -30,7 +32,9 @@ declare module '@react-types/shared' {
         /** Key for the item. */
         key?: Key;
         slots?: {
-            postHeading: React.ReactNode;
+            postHeading?: ReactNode;
+            afterTab?: ReactNode;
+            beforeTab?: ReactNode;
         };
         icon?: IconTypeExtended;
         /** isCurrent for the Breadcrumbs item. */

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

@@ -0,0 +1,32 @@
+import { ElementType, ReactNode } from 'react';
+import { ThemeUICSSProperties } from 'theme-ui';
+import { TestingAttributes } from './shared/test';
+import { DOMAttributes, OrientationProps, StyleProps } from './shared';
+export interface TabProps extends StyleProps, DOMAttributes, OrientationProps, TestingAttributes {
+    isDisabled?: boolean;
+    item: {
+        key: string | number;
+        props?: {
+            icon: ElementType | ReactNode;
+            isDisabled: boolean;
+            textValue: string;
+            tabLineProps?: ThemeUICSSProperties;
+            tabLabelProps: object;
+            content: object;
+            titleAttr: string;
+            title: string;
+            separator: Element | boolean;
+            list: object[];
+        };
+        rendered?: string | ReactNode;
+    };
+    mode?: 'default' | 'tooltip' | 'list';
+    tooltipTriggerProps?: object;
+    title?: string;
+    textValue?: string;
+    tabLineProps?: object;
+    slots?: {
+        beforeTab?: ReactNode;
+        afterTab?: ReactNode;
+    };
+}

package/lib/cjs/types/tab.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/cjs/types/tabs.d.ts

@@ -0,0 +1,51 @@
+import { Dispatch, ReactNode, SetStateAction } from 'react';
+import { AriaTabListProps } from '@react-aria/tabs';
+import { TabListState } from '@react-stately/tabs';
+import type { CollectionChildren } from '@react-types/shared';
+import { TestingAttributes } from './shared/test';
+import { DOMAttributes, OrientationProps, StyleProps } from './shared';
+export interface TabsProps extends StyleProps, TestingAttributes, OrientationProps {
+    /** The default tab key to be selected. (uncontrolled) */
+    defaultSelectedKey?: string;
+    /** Array of keys to disable within the tab list. */
+    disabledKeys?: string[];
+    /** The tab key that is currently selected. (controlled) */
+    selectedKey?: string;
+    /** Determines the behavior model for the tabs. */
+    mode?: 'default' | 'tooltip' | 'list';
+    /**
+     * *For performance reasons, use this prop instead of Array.map when iteratively rendering Items*.
+     * For use with [dynamic collections](https://react-spectrum.adobe.com/react-stately/collections.html#dynamic-collections).
+    */
+    items?: Array<TabListItemProps>;
+    /** Whether the entire tablist is disabled. */
+    isDisabled?: boolean;
+    /** Handler that is called when the selected tab has changed. */
+    onSelectionChange?: Dispatch<SetStateAction<string | undefined>>;
+    /** A props object that is subsequently spread into the rendered tablist. */
+    tabListProps?: object;
+    /** Props object that is spread directly into all of the tab panel wrapper elements. */
+    tabPanelProps?: object;
+    /** Whether tabs are activated automatically on focus or manually¸ */
+    keyboardActivation?: 'automatic' | 'manual';
+    children?: CollectionChildren<object>;
+}
+export interface AriaTabListOptions<T> extends Omit<AriaTabListProps<T>, 'children'> {
+    children: CollectionChildren<T>;
+}
+export interface TabPanelProps extends StyleProps, DOMAttributes {
+    state?: TabListState<object>;
+    tabPanelProps?: object;
+    children?: ReactNode | string;
+}
+export interface TabListItemProps {
+    name?: string;
+    children?: ReactNode | string;
+    list?: Array<{
+        key?: string | number;
+        name: string;
+        children: string;
+        role?: string;
+    }>;
+    props?: object;
+}

package/lib/cjs/types/tabs.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

@@ -17,8 +17,8 @@ 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 { ListLayout } from 'listbox-layout';
+import { Virtualizer, VirtualizerItem } from 'listbox-virtualizer';
 import { useLocalOrForwardRef } from '../../hooks';
 import Loader from '../Loader';
 import { Option } from './index';

package/lib/components/MultivaluesField/MultivaluesField.js

@@ -243,17 +243,17 @@ var MultivaluesField = /*#__PURE__*/forwardRef(function (props, ref) {
               selectionManager.toggleSelection(selectionManager.focusedKey);
               setFilterString('');
             }
-          } else if (hasCustomValue && filteredItems.length === 1) {
-            selectTheOnlyFilteredItem();
-          } else if (!hasCustomValue) {
-            setFilterString('');
-            close();
-          } else if (hasCustomValue) {
+          } else if (hasCustomValue && !selectionManager.focusedKey) {
             var _key = e.target.value;
             if (_key === '') {
               return;
             }
             addNewBadgeFromInput(e.target.value);
+          } else if (hasCustomValue && filteredItems.length === 1) {
+            selectTheOnlyFilteredItem();
+          } else if (!hasCustomValue) {
+            setFilterString('');
+            close();
           }
           break;
         }

package/lib/components/MultivaluesField/MultivaluesField.test.js

@@ -700,6 +700,36 @@ test('should clear the input text onBlur and enter when a single filter result i
   });
   expect(input).toHaveValue('');
 });
+test('in non-restrictive mode the partial string values should be accepted', function () {
+  var itemsWithDuplicatePartialString = [{
+    id: 1,
+    name: 'echo:read',
+    key: 'echo:read'
+  }, {
+    id: 2,
+    name: 'echo:write',
+    key: 'echo:write'
+  }, {
+    id: 3,
+    name: 'echo:delete',
+    key: 'echo:delete'
+  }];
+  getComponent({
+    mode: 'non-restrictive',
+    items: itemsWithDuplicatePartialString
+  });
+  var input = screen.getByRole('combobox');
+  expect(input).toHaveValue('');
+  var value = 'echo:r';
+  userEvent.type(input, value);
+  userEvent.type(input, '{enter}');
+  expect(input).toHaveValue('');
+  expect(screen.queryByText(value)).toBeInTheDocument();
+  userEvent.type(input, value);
+  userEvent.type(input, '{enter}');
+  expect(input).not.toHaveValue('');
+  expect(input).toHaveValue(value);
+});
 
 // Needs to be added to each components test file
 universalComponentTests({