@maherunlocker/custom-react-table/dist/esm/Table/SelectComponent.js

dynamic table based on react table v7

import { jsx as _jsx } from "react/jsx-runtime";
import React from 'react';
// import { useTranslation } from 'react-i18next';
import Select from 'react-select';
import NoOptionsMessage from './NoOptionsMessage';
export function SelectComponent({ options, setDesignationFilter, handleSavedFiltersSelect, designationFilter, setAllFilters, }) {
    // const { t } = useTranslation();
    const [selectInputRef, setSelectInputRef] = React.useState(null);
    const onInputChange = (inputValue, { action, prevInputValue }) => {
        switch (action) {
            case 'input-change':
                setDesignationFilter(inputValue);
                return inputValue;
            case 'menu-close':
                return !designationFilter ? designationFilter : inputValue;
            case 'set-value':
                return inputValue;
            case 'input-blur':
                return !designationFilter ? designationFilter : inputValue;
            default:
                return prevInputValue;
        }
    };
    const onChange = (option, { action }) => {
        setDesignationFilter(option ? option.label : '');
        handleSavedFiltersSelect(option);
        if (action === 'clear') {
            setAllFilters([]);
            setDesignationFilter('');
        }
    };
    React.useEffect(() => {
        if (designationFilter === '') {
            selectInputRef === null || selectInputRef === void 0 ? void 0 : selectInputRef.clearValue();
        }
    }, [designationFilter, selectInputRef]);
    return (_jsx(Select, { ref: (ref) => {
            setSelectInputRef(ref);
        }, menuPlacement: "auto", menuPosition: "fixed", isClearable: true, isSearchable: true, onInputChange: onInputChange, name: "savefilterinput", options: options, placeholder: 'Sélectionner / Ajouter', onChange: onChange, components: { NoOptionsMessage } }));
}
//# sourceMappingURL=SelectComponent.js.map