virtual-list icon indicating copy to clipboard operation
virtual-list copied to clipboard

Warning: Seems `scrollTo` with `rc-virtual-list` reach the max limitation

Open evgeniyworkbel opened this issue 1 year ago • 2 comments

image

evgeniyworkbel avatar Feb 25 '24 17:02 evgeniyworkbel

Could you provide a reproduction and submit the issue to antd repo?

yoyo837 avatar Feb 26 '24 02:02 yoyo837

@yoyo837, I’m getting the same error when trying to change the value in a select that has a long list of options

import React, { forwardRef, useCallback, useState } from 'react';

import AntAutocomplete, { type AutoCompleteProps } from 'antd/lib/auto-complete';
import type { DefaultOptionType, RefSelectProps, BaseOptionType } from 'antd/lib/select';

import { ArrowDownLongIcon } from '@/components/icons/system/arrow/arrow-down-long';
import { capitalizeFirstLetter } from '@/utils/string';

type Props = AutoCompleteProps & {
    // Делаем первую букву заглавной на onBlur
    capitalize?: boolean;
};

const syntheticEvent = <T extends React.SyntheticEvent<HTMLInputElement>>(event: T, value: string): T => ({
    ...event,
    target: {
        ...event.target,
        value
    },
    currentTarget: {
        ...event.currentTarget,
        value
    }
});

const Autocomplete: React.ForwardRefRenderFunction<RefSelectProps, Props> = ({
    style,
    capitalize,
    onChange,
    onBlur,
    value: propValue,
    ...props
}, ref) => {
    const [inputValue, setInputValue] = useState<string | undefined>(propValue);

    const handleInputChange = useCallback((value: string) => {
        setInputValue(value);
        onChange?.(value);
    }, [onChange, setInputValue]);

    const handleBlur = useCallback((event: React.FocusEvent<HTMLInputElement>) => {
        let processedValue = inputValue || '';

        onBlur?.(syntheticEvent(event, processedValue));

        if (capitalize && inputValue) {
            processedValue = capitalizeFirstLetter(inputValue);
            setInputValue(processedValue);
        }

    }, [capitalize, inputValue, onBlur, setInputValue]);

    return (
        <AntAutocomplete
            suffixIcon={<ArrowDownLongIcon />}
            ref={ref}
            style={{
                minWidth: '120px',
                ...style
            }}
            allowClear={true}
            notFoundContent={null}
            value={inputValue}
            onChange={handleInputChange}
            onBlur={handleBlur}
            {...props}
        />
    );
};

const AutocompleteWithRef = forwardRef(Autocomplete);

export { AutocompleteWithRef as Autocomplete };

export type {
    Props as AutocompleteProps,
    DefaultOptionType
};
            "values": [
                "Абхазия",
                "Австралия",
                "Австрия",
                "Азербайджан",
                "Албания",
                "Алжир",
                "Ангола",
                "Андорра",
                "Антигуа и Барбуда",
                "Аргентина",
                "Армения",
                "Афганистан",
                "Багамские Острова",
                "Бангладеш",
                "Барбадос",
                "Бахрейн",
                "Беларусь",
                "Белиз",
                "Бельгия",
                "Бенин",
                "Болгария",
                "Боливия",
                "Босния и Герцеговина",
                "Ботсвана",
                "Бразилия",
                "Бруней",
                "Буркина-Фасо",
                "Бурунди",
                "Бутан",
                "Вануату",
                "Ватикан",
                "Великобритания",
                "Венгрия",
                "Венесуэла",
                "Восточный Тимор",
                "Вьетнам",
                "Габон",
                "Гаити",
                "Гайана",
                "Гамбия",
                "Гана",
                "Гватемала",
                "Гвинея",
                "Гвинея-Бисау",
                "Германия",
                "Гондурас",
                "Гренада",
                "Греция",
                "Грузия",
                "Дания",
                "Джибути",
                "Доминика",
                "Доминиканская Республика",
                "Египет",
                "Замбия",
                "Зимбабве",
                "Израиль",
                "Индия",
                "Индонезия",
                "Иордания",
                "Ирак",
                "Иран",
                "Ирландия",
                "Исландия",
                "Испания",
                "Италия",
                "Йемен",
                "Кабо-Верде",
                "Казахстан",
                "Камбоджа",
                "Камерун",
                "Канада",
                "Катар",
                "Кения",
                "Кипр",
                "Киргизия",
                "Кирибати",
                "Китай",
                "Китайская Республика (Тайвань)",
                "Колумбия",
                "Коморы",
                "Конго",
                "Коста-Рика",
                "Кот-д’Ивуар",
                "Куба",
                "Кувейт",
                "Лаос",
                "Латвия",
                "Лесото",
                "Либерия",
                "Ливан",
                "Ливия",
                "Литва",
                "Лихтенштейн",
                "Люксембург",
                "Маврикий",
                "Мавритания",
                "Мадагаскар",
                "Малави",
                "Малайзия",
                "Мали",
                "Мальдивы",
                "Мальта",
                "Марокко",
                "Маршалловы Острова",
                "Мексика",
                "Микронезия",
                "Мозамбик",
                "Молдова",
                "Монако",
                "Монголия",
                "Мьянма",
                "Намибия",
                "Науру",
                "Непал",
                "Нигер",
                "Нигерия",
                "Нидерланды",
                "Никарагуа",
                "Новая Зеландия",
                "Норвегия",
                "Объединённые Арабские Эмираты",
                "Оман",
                "Палестина",
                "Пакистан",
                "Палау",
                "Панама",
                "Папуа — Новая Гвинея",
                "Парагвай",
                "Перу",
                "Польша",
                "Португалия",
                "Республика Конго",
                "Республика Косово",
                "Республика Корея",
                "Россия",
                "Руанда",
                "Румыния",
                "Сальвадор",
                "Самоа",
                "Сан-Марино",
                "САДР",
                "Саудовская Аравия",
                "Северная Македония",
                "Сенегал",
                "Сент-Винсент и Гренадины",
                "Сент-Китс и Невис",
                "Сент-Люсия",
                "Сербия",
                "Сингапур",
                "Сирия",
                "Словакия",
                "Словения",
                "США",
                "Соломоновы Острова",
                "Сомали",
                "Сомалиленд",
                "Судан",
                "Суринам",
                "Сьерра-Леоне",
                "Таджикистан",
                "Таиланд",
                "Танзания",
                "Того",
                "Тонга",
                "Тринидад и Тобаго",
                "Тувалу",
                "Тунис",
                "Туркмения",
                "Турция",
                "Уганда",
                "Узбекистан",
                "Украина",
                "Уругвай",
                "Фиджи",
                "Филиппины",
                "Финляндия",
                "Франция",
                "Хорватия",
                "ЦАР",
                "Чад",
                "Черногория",
                "Чехия",
                "Чили",
                "Швейцария",
                "Швеция",
                "Шри-Ланка",
                "Южная Осетия",
                "Южный Судан",
                "Ямайка",
                "Япония"
            ]

monolithed avatar Apr 18 '25 11:04 monolithed