import { MultiSelectCheckbox, } from '@wix/design-system';
import React from 'react';
import { observer } from 'mobx-react-lite';
import { useWindowFlipPopoverProps } from '../../utils/useWindowFlipPopoverProps';
import { useDropdownTranslationContext } from '../../providers';
function _MultiSelectCheckboxFilterBase(props) {
    const { filter, dropdownSelect, options, placeholder, popoverProps, ...rest } = props;
    const { select: { selectedKeys }, } = dropdownSelect;
    const { translate } = useDropdownTranslationContext();
    const { windowFlipPopoverProps, inputRef } = useWindowFlipPopoverProps({
        popoverProps,
    });
    return (React.createElement(MultiSelectCheckbox, { inputRef: (ref) => {
            inputRef.current = ref;
        }, dataHook: `collection-filter-${filter.name}`, border: "round", textOverflow: "ellipsis", options: options, placeholder: placeholder ?? translate('placeholder'), selectedOptions: selectedKeys, popoverProps: windowFlipPopoverProps, ...rest }));
}
export const MultiSelectCheckboxFilterBase = observer(_MultiSelectCheckboxFilterBase);
//# sourceMappingURL=MultiSelectCheckboxFilterBase.js.map