@awsui/components-react/select/parts/virtual-list.js

AWS UI is a collection of [React](https://reactjs.org/) components that help create intuitive, responsive, and accessible user experiences for web applications. It is developed by Amazon Web Services (AWS). This work is available under the terms of the [A

import { __assign } from "tslib";
import OptionsList from '../../internal/components/options-list';
import React, { forwardRef, useCallback, useImperativeHandle, useMemo } from 'react';
import { renderOptions } from '../utils/render-options';
import { useVirtual } from 'react-virtual';
import { useContainerQuery } from '../../internal/hooks/container-queries';
var VirtualList = function (_a, ref) {
    var menuProps = _a.menuProps, getOptionProps = _a.getOptionProps, filteredOptions = _a.filteredOptions, filteringValue = _a.filteringValue, isKeyboard = _a.isKeyboard, dropdownStatus = _a.dropdownStatus, checkboxes = _a.checkboxes;
    var menuRef = menuProps.ref;
    var _b = useContainerQuery(function (rect) { return rect.width; }, []), width = _b[0], strutRef = _b[1];
    useImperativeHandle(strutRef, function () { return menuProps.ref.current; });
    var _c = useVirtual({
        size: filteredOptions.length,
        parentRef: menuRef,
        estimateSize: useCallback(function () { return 31; }, [width]),
        overscan: 5
    }), virtualItems = _c.virtualItems, totalSize = _c.totalSize, scrollToIndex = _c.scrollToIndex;
    useImperativeHandle(ref, function () { return function (index) {
        if (isKeyboard) {
            scrollToIndex(index);
        }
    }; }, [isKeyboard, scrollToIndex]);
    var filteredOptionsSlice = virtualItems.map(function (_a) {
        var index = _a.index;
        return filteredOptions[index];
    });
    var finalOptions = useMemo(function () {
        return renderOptions(filteredOptionsSlice, getOptionProps, filteringValue, isKeyboard, checkboxes, virtualItems);
    }, [filteredOptionsSlice, getOptionProps, filteringValue, isKeyboard, checkboxes, virtualItems]);
    return (React.createElement(OptionsList, __assign({}, menuProps),
        React.createElement("div", { "aria-hidden": "true", key: "total-size", style: {
                height: totalSize + "px",
                width: '100%',
                position: 'relative'
            } }),
        finalOptions,
        dropdownStatus));
};
export default forwardRef(VirtualList);