@splunk/react-ui 4.23.0 → 4.25.0

package/types/src/ComboBox/ComboBox.d.ts

@@ -111,6 +111,12 @@ interface ComboBoxPropsBase {
     size?: 'small' | 'medium' | 'large';
     /** The value of the input. Only applicable in controlled mode. */
     value?: string;
+    /**
+     * @private Experimental. Use a virtualized `ResultsMenu` variant which will only render at most
+     * `virtualization * 3` options in the DOM at any given time, and will have a type of infinite scroll behavior.
+     * @throws if `virtualization` is defined but less than 2
+     */
+    virtualization?: number;
 }
 declare const defaultProps: Required<Pick<ComboBoxPropsBase, 'animateLoading' | 'controlledFilter' | 'defaultPlacement' | 'disabled' | 'error' | 'inline' | 'isLoadingOptions' | 'menuStyle' | 'placeholder' | 'size'>>;
 interface ComboBoxPropsBaseControlled extends ComboBoxPropsBase {

package/types/src/JSONTree/JSONTree.d.ts

@@ -58,8 +58,9 @@ interface JSONTreePropsBase {
      */
     overflow?: 'wrap' | 'scroll';
     /**
-     * If set to `true`, using `shift + click` or `shift + enter` will expand or collapse all descendant nodes
-     * of the tree at once.
+     * If set to `true`, using `shift + click` or `shift + enter` will expand all descendant nodes
+     * of the tree at once. A tooltip is added to the expand all / collapse all button to indicate that this feature
+     * is enabled.
      */
     expandChildrenOnShiftKey?: boolean;
 }

package/types/src/Menu/Menu.d.ts

@@ -4,6 +4,11 @@ import Divider from './Divider';
 import Heading from './Heading';
 import Item, { ItemWithoutTheme } from './Item';
 import { ClassComponentProps } from '../utils/types';
+declare type HandlerData = {
+    itemRefs: React.RefObject<React.ReactNode>[];
+    focusedItemKey: number;
+};
+declare type NavigationKeyPressHandler = (e: React.KeyboardEvent<HTMLDivElement>, data: HandlerData) => [React.RefObject<React.ReactNode> | number, boolean];
 interface MenuPropsBase {
     /**
      * Must be `Menu.Item`, `Menu.Heading`, or `Menu.Divider`.
@@ -18,6 +23,14 @@ interface MenuPropsBase {
      * A React ref which is set to the DOM element when the component mounts and null when it unmounts.
      */
     elementRef?: React.Ref<HTMLDivElement>;
+    /** @private callback to override the default behavior when pressing the Down arrow/cursor key */
+    onDownKeyPress?: NavigationKeyPressHandler;
+    /** @private callback to override the default behavior when pressing the End key */
+    onEndKeyPress?: NavigationKeyPressHandler;
+    /** @private callback to override the default behavior when pressing the Home key */
+    onHomeKeyPress?: NavigationKeyPressHandler;
+    /** @private callback to override the default behavior when pressing the Home key */
+    onUpKeyPress?: NavigationKeyPressHandler;
     /**
      * Keeps focus within the `Menu` while navigating by keyboard. Tabbing from the last item
      * returns the user to the first item. If not set, this defaults to `true` unless it's inside a
@@ -32,7 +45,7 @@ interface MenuPropsBase {
 }
 declare const defaultProps: Required<Pick<MenuPropsBase, 'stopScrollPropagation'>>;
 declare type MenuProps = ClassComponentProps<MenuPropsBase, typeof defaultProps, 'div'>;
-declare function Menu({ children, controlledExternally, elementRef, retainFocus: retainFocusProp, stopScrollPropagation, ...otherProps }: MenuProps): JSX.Element;
+declare function Menu({ children, controlledExternally, elementRef, onDownKeyPress, onEndKeyPress, onHomeKeyPress, onUpKeyPress, retainFocus: retainFocusProp, stopScrollPropagation, ...otherProps }: MenuProps): JSX.Element;
 declare namespace Menu {
     var propTypes: React.WeakValidationMap<ClassComponentProps<MenuPropsBase, Required<Pick<MenuPropsBase, "stopScrollPropagation">>, "div", never>>;
     var defaultProps: Required<Pick<MenuPropsBase, "stopScrollPropagation">>;

package/types/src/Modal/Header.d.ts

@@ -20,12 +20,10 @@ interface HeaderPropsBase {
     title?: string;
     /**
      * Used as the subheading. Only shown if `title` is also present.
-     * @includeTheme prisma
      */
     subtitle?: React.ReactNode;
     /**
      * The icon to show before the title.
-     * @includeTheme prisma
      */
     icon?: React.ReactNode;
 }

package/types/src/Modal/Modal.d.ts

@@ -23,6 +23,10 @@ interface ModalPropsBase {
      * Show dividers between header, body and footer.
      */
     divider?: 'header' | 'footer' | 'both' | 'none';
+    /**
+     * A React ref which is set to the DOM element when the component mounts and null when it unmounts.
+     */
+    elementRef?: React.Ref<HTMLDivElement>;
     /**
      * Allows focus to be set to a component other than the default.
      * Supports `first` (first focusable element in the modal), `container` (focus the modal itself), or a ref.
@@ -49,6 +53,7 @@ declare class Modal extends Component<ModalProps> {
     private initialFocusTimeoutId;
     private initialFocus;
     private headerTitleId;
+    private headerSubtitleId;
     static propTypes: React.WeakValidationMap<ClassComponentProps<ModalPropsBase, Required<Pick<ModalPropsBase, "open" | "divider" | "initialFocus">>, "div", never>>;
     static defaultProps: Required<Pick<ModalPropsBase, "open" | "divider" | "initialFocus">>;
     static Header: typeof Header;
@@ -63,6 +68,8 @@ declare class Modal extends Component<ModalProps> {
     private handleModalMount;
     private handleModalKeyDown;
     private handleRequestClose;
+    private getProviderValue;
+    private getModalStyles;
     private renderModal;
     render(): JSX.Element;
 }

package/types/src/Modal/ModalContext.d.ts

@@ -2,6 +2,7 @@
 export interface ModalContext {
     divider?: 'header' | 'footer' | 'both' | 'none';
     titleId?: string;
+    subtitleId?: string;
 }
 export declare const ModalContext: import("react").Context<ModalContext>;
 export default ModalContext;

package/types/src/Multiselect/Compact.d.ts

@@ -139,6 +139,12 @@ interface CompactPropsBase {
      * toggle.
      */
     values?: (string | number | boolean)[];
+    /**
+     * @private Experimental. Use a virtualized `ResultsMenu` variant which will only render at most
+     * `virtualization * 3` options in the DOM at any given time, and will have a type of infinite scroll behavior.
+     * @throws if `virtualization` is defined but less than 2
+     */
+    virtualization?: number;
     /** @private */
     toggle?: SelectBaseProps['toggle'];
 }

package/types/src/Multiselect/Multiselect.d.ts

@@ -164,6 +164,13 @@ interface MultiselectPropsBase {
      * toggle.
      */
     values?: (string | number | boolean)[];
+    /**
+     * @private Experimental. Use a virtualized `ResultsMenu` variant which will only render at most
+     * `virtualization * 3` options in the DOM at any given time, and will have a type of infinite scroll behavior.
+     * This feature is only available in the `compact` variant
+     * @throws if `virtualization` is defined but less than 2
+     */
+    virtualization?: number;
 }
 declare const defaultProps: Required<Pick<MultiselectPropsBase, 'allowNewValues' | 'animateLoading' | 'compact' | 'defaultPlacement' | 'disabled' | 'inline' | 'isLoadingOptions' | 'menuStyle' | 'noOptionsMessage' | 'placeholder' | 'repositionMode' | 'tabConfirmsNewValue' | 'useClickawayOverlay'>>;
 interface MultiselectPropsBaseControlled extends MultiselectPropsBase {

package/types/src/RadioList/RadioList.d.ts

@@ -13,47 +13,47 @@ interface RadioListPropsBase {
      * `children` should be `RadioList.Option`s.
      */
     children?: React.ReactNode;
-    disabled?: boolean;
-    /** The name is returned with onChange events, which can be used to identify the
-     * control when multiple controls share an onChange callback.
-     * A randomly generated name is used if one is not provided. */
-    name?: string;
-    /** Changes the layout of the RadioList. */
-    direction?: 'column' | 'row';
-    /**
-     * Highlight the field as having an error. The buttons and labels will turn red.
-     */
-    error?: boolean;
-    /** The current selected value.  Setting this value makes the property controlled. A
-     * callback is required.
-     */
-    value?: RadioListValueTypes;
     /**
      * Set this property instead of value to make value uncontrolled.
      */
     defaultValue?: RadioListValueTypes;
+    /**
+     * When placed in a ControlGroup, this is automatically set to the ControlGroup's help component.
+     * @private
+     */
+    describedBy?: string;
+    /** Changes the layout of the RadioList. */
+    direction?: 'column' | 'row';
+    disabled?: boolean;
     /**
      * A React ref which is set to the DOM element when the component mounts and null when it unmounts.
      */
     elementRef?: React.Ref<HTMLDivElement>;
     /**
-     * A callback to receive the change events.
-     * If value is set, this callback is required. This must set the value prop to retain the
-     * change.
+     * Highlight the field as having an error. The buttons and labels will turn red.
      */
-    onChange?: RadioListChangeHandler;
-    /** @private. */
-    required?: boolean;
+    error?: boolean;
     /**
      * When placed in a ControlGroup, this is automatically set to the ControlGroup's label.
      * @private
      */
     labelledBy?: string;
+    /** The name is returned with onChange events, which can be used to identify the
+     * control when multiple controls share an onChange callback.
+     * A randomly generated name is used if one is not provided. */
+    name?: string;
     /**
-     * When placed in a ControlGroup, this is automatically set to the ControlGroup's help component.
-     * @private
+     * A callback to receive the change events.
+     * If value is set, this callback is required. This must set the value prop to retain the
+     * change.
      */
-    describedBy?: string;
+    onChange?: RadioListChangeHandler;
+    /** @private. */
+    required?: boolean;
+    /** The current selected value.  Setting this value makes the property controlled. A
+     * callback is required.
+     */
+    value?: RadioListValueTypes;
 }
 interface RadioListPropsBaseControlled extends RadioListPropsBase {
     value: RadioListValueTypes;
@@ -69,19 +69,19 @@ declare type RadioListProps = ComponentProps<RadioListPropsBaseControlled | Radi
 declare function RadioList({ children, defaultValue: defaultValueProp, describedBy, direction, disabled, error, labelledBy, name: nameProp, onChange, required, value: valueProp, ...otherProps }: RadioListProps): JSX.Element;
 declare namespace RadioList {
     var propTypes: {
-        direction: PropTypes.Requireable<string>;
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         defaultValue: PropTypes.Requireable<any>;
+        describedBy: PropTypes.Requireable<string>;
+        direction: PropTypes.Requireable<string>;
         disabled: PropTypes.Requireable<boolean>;
         elementRef: PropTypes.Requireable<object>;
         error: PropTypes.Requireable<boolean>;
+        labelledBy: PropTypes.Requireable<string>;
         name: PropTypes.Requireable<string>;
         onChange: PropTypes.Requireable<(...args: any[]) => any>;
         /** @private. */
         required: PropTypes.Requireable<boolean>;
         value: PropTypes.Requireable<any>;
-        labelledBy: PropTypes.Requireable<string>;
-        describedBy: PropTypes.Requireable<string>;
     };
     var Option: typeof import("./Option").default;
 }

package/types/src/RadioList/RadioListContext.d.ts

@@ -1,11 +1,12 @@
 /// <reference types="react" />
 import { RadioListChangeHandler, RadioListValueTypes } from './RadioList';
 export interface RadioListContext {
-    value?: RadioListValueTypes;
-    onChange?: RadioListChangeHandler;
-    name?: string;
-    error?: boolean;
     disabled?: boolean;
+    error?: boolean;
+    name?: string;
+    onChange?: RadioListChangeHandler;
+    required?: boolean;
+    value?: RadioListValueTypes;
 }
 export declare const RadioListContext: import("react").Context<RadioListContext>;
 export default RadioListContext;

package/types/src/ResultsMenu/ResultsMenu.d.ts

@@ -1,21 +1,47 @@
 import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { ClassComponentProps } from '../utils/types';
 declare type ResultsMenuScrollBottomHandler = (event: React.UIEvent<HTMLDivElement> | null) => void;
+declare type HandlerData = {
+    itemRefs: React.RefObject<React.ReactNode>[];
+    focusedItemKey: number;
+};
+declare type NavigationKeyPressHandler = (e: React.KeyboardEvent<HTMLDivElement>, data: HandlerData) => [React.RefObject<React.ReactNode> | number, boolean];
 interface ResultsMenuPropsBase {
+    /**
+     * Whether or not to show the wait spinner when loading. It's recommended to set this to
+     * `true` when loading may take more than one second.
+     */
     animateLoading?: boolean;
     children?: React.ReactNode;
     /**
      * @private If set, the menu will never take focus and the active menu item will not have a focus-like appearance.
      */
     controlledExternally?: boolean;
+    /**
+     * `childrenStart` are nearest the toggle, so they are not necessarily on top.
+     * This is extendable to add `childrenTop`, `childrenEnd`, and `childrenBottom` in the
+     * future.
+     */
     childrenStart?: React.ReactNode;
     /**
      * A React ref which is set to the DOM element when the component mounts and null when it unmounts.
      */
     elementRef?: React.Ref<HTMLDivElement>;
+    /**
+     * Whether or not to show the loading message and/or wait spinner. It's not recommended to
+     * pass old children when loading new children. The loading animation will show below any
+     * children, so therefore it may be necessary to scroll to see the animation.
+     */
     isLoading?: boolean;
     loadingMessage?: React.ReactNode;
     noOptionsMessage?: React.ReactNode;
+    /** @private callback to override the default behavior when pressing the Down arrow/cursor key */
+    onDownKeyPress?: NavigationKeyPressHandler;
+    /** @private callback to override the default behavior when pressing the End key */
+    onEndKeyPress?: NavigationKeyPressHandler;
+    /** @private callback to override the default behavior when pressing the Home key */
+    onHomeKeyPress?: NavigationKeyPressHandler;
     onScroll?: React.UIEventHandler<Element>;
     /**
      * A callback function for loading additional list items.
@@ -25,9 +51,34 @@ interface ResultsMenuPropsBase {
      * This should be set this to `null` when all items are loaded.
      */
     onScrollBottom?: ResultsMenuScrollBottomHandler;
+    /** @private callback to override the default behavior when pressing the Home key */
+    onUpKeyPress?: NavigationKeyPressHandler;
     placement?: string;
     footerMessage?: React.ReactNode;
 }
+declare const propTypes: {
+    animateLoading: PropTypes.Requireable<boolean>;
+    children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    /** @private */
+    controlledExternally: PropTypes.Requireable<boolean>;
+    childrenStart: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    elementRef: PropTypes.Requireable<object>;
+    footerMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    isLoading: PropTypes.Requireable<boolean>;
+    loadingMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    noOptionsMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    /** @private */
+    onDownKeyPress: PropTypes.Requireable<(...args: any[]) => any>;
+    /** @private */
+    onEndKeyPress: PropTypes.Requireable<(...args: any[]) => any>;
+    /** @private */
+    onHomeKeyPress: PropTypes.Requireable<(...args: any[]) => any>;
+    onScroll: PropTypes.Requireable<(...args: any[]) => any>;
+    onScrollBottom: PropTypes.Requireable<(...args: any[]) => any>;
+    /** @private */
+    onUpKeyPress: PropTypes.Requireable<(...args: any[]) => any>;
+    placement: PropTypes.Requireable<string>;
+};
 declare const defaultProps: Required<Pick<ResultsMenuPropsBase, 'animateLoading' | 'isLoading' | 'loadingMessage' | 'noOptionsMessage'>>;
 declare type ResultsMenuProps = ClassComponentProps<ResultsMenuPropsBase, typeof defaultProps, 'div'>;
 interface ResultsMenuState {
@@ -58,4 +109,5 @@ declare class ResultsMenu extends Component<ResultsMenuProps, ResultsMenuState>
     render(): JSX.Element;
 }
 export default ResultsMenu;
-export { ResultsMenuScrollBottomHandler };
+export { propTypes };
+export type { NavigationKeyPressHandler, ResultsMenuScrollBottomHandler, ResultsMenuPropsBase };

package/types/src/ResultsMenu/VirtualizedResultsMenu/VirtualizedItem.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface VirtualizedItemPropsBase {
+    children: React.ReactNode;
+    onMount: (element: HTMLElement) => void;
+    onUnmount: (element: HTMLElement) => void;
+}
+/** @private Used by `VirtualizedResultsMenu` */
+declare const VirtualizedItem: React.ForwardRefExoticComponent<VirtualizedItemPropsBase & Pick<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> | React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "slot" | "style" | "title" | "onChange" | "onPause" | "className" | "color" | "id" | "lang" | "type" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is"> & React.RefAttributes<unknown>>;
+export { VirtualizedItem };

package/types/src/ResultsMenu/VirtualizedResultsMenu/VirtualizedResultsMenu.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { ResultsMenuPropsBase } from '../ResultsMenu';
+import type { ClassComponentProps } from '../../utils/types';
+interface VirtualizedResultsMenuPropsBase extends Omit<ResultsMenuPropsBase, 'onDownKeyPress' | 'onEndKeyPress' | 'onHomeKeyPress' | 'onUpKeyPress'> {
+    virtualization: number;
+}
+declare const defaultProps: Required<Pick<VirtualizedResultsMenuPropsBase, 'virtualization'>>;
+declare type VirtualizedResultsMenuProps = ClassComponentProps<VirtualizedResultsMenuPropsBase, typeof defaultProps, 'div'>;
+/**
+ * A wrapper for `ResultsMenu` which virtualizes the `children`. The received `children` array will be split into **"panes"** each with `virtualization` entries
+ * and, at any given time, 3 or fewer of these panes will be rendered in the DOM.
+ *
+ * Given the children `[1, 2, 3, 4, 5, 6, 7, 8, 9]` and `virtualization=4`, then at first only elements `[1, 2, 3, 4, 5, 6, 7, 8]` will be added to the DOM.
+ * Once either child `6` or `8` intersect the `Menu` rendered by `ResultsMenu` the next pane of children will also be included and, if needed, the oldest pane
+ * will be removed.
+ *
+ * In effect this means the menu will show the "central" content at pane index _`n`_, a previous-content-buffer comprised of pane index _`n - 1`_,
+ * and an upcoming-content-buffer comprised of pane index _`n + 1`_.
+ *
+ * An `IntersectionObserver` will observe the first node in the _`n - 1`_ pane, the last node in the _`n + 1`_ pane, and the central node in both _`n ± 1`_ panes
+ * for intersections with the rendered `Menu` and trigger a *pane change* upon that intersection. As such, in SSR or other environments which don't support `IntersectionObserver`
+ * this component should not be used and will be replaced by the barrel file with a vanilla `ResultsMenu`.
+ *
+ * @throws in `__DEV__` when `virtualization` is too small as compared to the menu height (`virtualization` must be greater than the number of visible items in the rendered menu)
+ * @throws in `__DEV__` when `virtualization` is less than or equal to 1 (`virtualization` must be ≥ 2)
+ * @throws in `__DEV__` when `virtualization` is changed during the lifecycle of the `VirtualizedResultsMenu` component
+ */
+declare function VirtualizedResultsMenu({ virtualization: virtualizationProp, elementRef: elementRefProp, children, ...props }: VirtualizedResultsMenuProps): JSX.Element;
+declare namespace VirtualizedResultsMenu {
+    var propTypes: React.WeakValidationMap<VirtualizedResultsMenuPropsBase>;
+    var defaultProps: Required<Pick<VirtualizedResultsMenuPropsBase, "virtualization">>;
+}
+export { VirtualizedResultsMenu };

package/types/src/ResultsMenu/VirtualizedResultsMenu/groupChildren.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Given component children, restructure them into an array of arrays, each of length `groupSize`.
+ *
+ * The last array is not guaranteed to be full, it will have a length in the range `[1, groupSize]`
+ *
+ * @example
+ * ```js
+ * groupChildren([1, 2, 3, 4, 5, 6, 7], 2);
+ * // > [[1, 2], [3, 4], [5, 6], [7]]
+ * ```
+ * @param {Array} children One node, or an array of nodes, to be divided into groups
+ * @param {number} groupSize The size of each group to be created
+ * @returns A 2d array where each inner-array is a group of size `groupSize` of children
+ * and the order of the `children` received equals the order of the flattened result
+ */
+export declare const groupChildren: (children: React.ReactNode | React.ReactNode[], groupSize: number) => React.ReactNode[][];

package/types/src/ResultsMenu/VirtualizedResultsMenu/index.d.ts

@@ -0,0 +1,3 @@
+import { VirtualizedResultsMenu } from './VirtualizedResultsMenu';
+declare const _default: typeof VirtualizedResultsMenu;
+export default _default;

package/types/src/ResultsMenu/VirtualizedResultsMenu/injectVirtualizedItem.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+declare type AdditionalTracking = {
+    trackFirstElement?: boolean;
+    trackLastElement?: boolean;
+};
+declare type ObserveLifecycleFn = (element: HTMLElement | null) => void;
+/**
+ * Find the index of an array element which is nearest to targetIndex and is a Menu.Item component
+ * @param {Array} elements An array to search
+ * @param {Number} targetIndex The target index. This is the ideal value to return.
+ * @returns The index in the array of the nearest `Menu.Item` component to `targetIndex`, or -1 if no element is a `Menu.Item` component
+ */
+export declare const findClosestMenuItem: (elements: React.ReactNode[], targetIndex: number) => number;
+/**
+ * @private Keep the injection of `VirtualizedItem` DRY. Will always replace the middle-most non-divider/heading
+ * with a VirtualizedItem instance.
+ * - If `trackFirstElement` the **FIRST** non-divider/heading item will also be replaced.
+ * - If `trackLastElement` the **LAST** non-divider/heading item will also be replaced.
+ */
+export declare const injectVirtualizedItem: (elements: React.ReactNode[] | undefined, onMount: ObserveLifecycleFn, onUnmount: ObserveLifecycleFn, { trackFirstElement, trackLastElement }?: AdditionalTracking) => React.ReactNode[];
+export {};

package/types/src/ResultsMenu/index.d.ts

@@ -1,2 +1,3 @@
 export { default } from './ResultsMenu';
-export * from './ResultsMenu';
+export { default as VirtualizedResultsMenu } from './VirtualizedResultsMenu';
+export type { ResultsMenuScrollBottomHandler } from './ResultsMenu';

package/types/src/Select/Select.d.ts

@@ -161,6 +161,8 @@ interface SelectPropsBase {
      * toggle.
      */
     value?: string | number | boolean;
+    /** @private. */
+    virtualization?: number;
     /** @private */
     toggle?: SelectBaseProps['toggle'];
 }

package/types/src/Select/SelectBase.d.ts

@@ -175,6 +175,12 @@ interface SelectBasePropsBase {
      * toggle.
      */
     values?: (string | number | boolean)[];
+    /**
+     * @private Experimental. Use a virtualized `ResultsMenu` variant which will only render at most
+     * `virtualization * 3` options in the DOM at any given time, and will have a type of infinite scroll behavior.
+     * @throws if `virtualization` is defined but less than 2
+     */
+    virtualization?: number;
     /**
      * @private
      *

package/types/src/Tree/Tree.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { ComponentProps } from '../utils/types';
+import TreeItem from './TreeItem';
+declare type RemoveNodeHandler = (id: string) => void;
+declare type SetNodeHandler = (id: string, path?: string) => void;
+interface TreePropsBase {
+    /** Should contain TreeItems, can also include other elements to display in between tree items. */
+    children?: React.ReactNode;
+    /** Removes default indent from list styles if set to false. */
+    defaultIndent?: boolean;
+}
+declare type TreeProps = ComponentProps<TreePropsBase, 'ul'>;
+declare function Tree({ children, defaultIndent, ...otherProps }: TreeProps): JSX.Element;
+declare namespace Tree {
+    var propTypes: {
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        defaultIndent: PropTypes.Requireable<boolean>;
+    };
+    var TreeItem: typeof import("./TreeItem").default;
+}
+export default Tree;
+export { TreeItem };
+export { RemoveNodeHandler, SetNodeHandler };

package/types/src/Tree/TreeContext.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { RemoveNodeHandler, SetNodeHandler } from './Tree';
+import { TreeItemKeyDownHandler } from './TreeItem';
+export interface TreeContext {
+    defaultIndent?: boolean;
+    onItemKeyDown?: TreeItemKeyDownHandler;
+    removeNode?: RemoveNodeHandler;
+    setNode?: SetNodeHandler;
+    focusedItemId?: string;
+    itemPaths?: Map<string, string | undefined>;
+}
+export declare const TreeContext: import("react").Context<TreeContext>;
+export default TreeContext;

package/types/src/Tree/TreeItem.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { ComponentProps } from '../utils/types';
+declare type OpenCloseHandler = (isOpen: boolean) => void;
+interface TreeItemPropsBase {
+    /** A unique `id` for this item and used by `Tree` to keep track of the focused item. */
+    id: string;
+    /** Should contain `TreeItems`, can also include other elements to display in between tree items. */
+    children?: React.ReactNode;
+    /** Content to show on the TreeItem. */
+    content?: React.ReactNode;
+    labelledBy?: string;
+    onFocus?: React.FocusEventHandler<HTMLLIElement>;
+    /** Default open state of the ndoe. */
+    open?: boolean;
+}
+declare type TreeItemProps = ComponentProps<TreeItemPropsBase, 'li'>;
+declare type TreeItemKeyDownHandler = (event: React.KeyboardEvent<HTMLLIElement>, id: string, showChildren: boolean | undefined, childrenCleaned: React.ReactElement[] | undefined | null, handleToggle: OpenCloseHandler) => void;
+declare function TreeItem({ id, children, content, labelledBy, onFocus, ...otherProps }: TreeItemProps): JSX.Element;
+declare namespace TreeItem {
+    var propTypes: {
+        id: PropTypes.Requireable<string>;
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        content: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        labelledBy: PropTypes.Requireable<string>;
+        onFocus: PropTypes.Requireable<(...args: any[]) => any>;
+        open: PropTypes.Requireable<boolean>;
+    };
+}
+export default TreeItem;
+export { TreeItemKeyDownHandler };

package/types/src/Tree/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './Tree';
+export * from './Tree';
+export * from './TreeItem';

package/types/src/Tree/treeUtils.d.ts

@@ -0,0 +1,29 @@
+/**
+ * A helper function to get first key in Map that matches given value
+ */
+export declare function getKeyByValue(map: Map<string, string | undefined>, searchValue: string): string | undefined;
+/**
+ * A helper function to get parent path of current item path
+ */
+export declare function getParentPath(currentPath: string): string;
+/**
+ * A helper function to get next path of current item path in same level
+ */
+export declare function getNextPathSameLevel(currentPath: string, currentPathEnd: number): string;
+/**
+ * A helper function to get the last index number of an item path string
+ */
+export declare function getLastPathIndex(path: string): number;
+export declare function getParentTreeItem(itemPathMap: Map<string, string | undefined>, currentId: string): string;
+/**
+ * A helper function for getNextTreeItem
+ */
+export declare function getNextNodeHigherLevel(itemPathMap: Map<string, string | undefined>, currentPath: string): string | undefined;
+export declare function getNextTreeItem(itemPathMap: Map<string, string | undefined>, currentId: string): string;
+/**
+ * A helper function for getPrevTreeItem
+ */
+export declare function getLastInNode(itemPathMap: Map<string, string | undefined>, currItemPath: string): string | undefined;
+export declare function getPrevTreeItem(itemPathMap: Map<string, string | undefined>, currentId: string): string;
+export declare function getFirstTreeItem(itemPathMap: Map<string, string | undefined>): string | undefined;
+export declare function getLastTreeItem(itemPathMap: Map<string, string | undefined>, currItemPath?: string): string | undefined;

package/types/unit-test-setup-testing-library.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/types/src/Modal/docs/examples/prisma/TypicalUsage.d.ts

@@ -1,2 +0,0 @@
-declare function TypicalUsage(): JSX.Element;
-export default TypicalUsage;