import { observer } from 'mobx-react-lite';
import React from 'react';
import { ContentFilter } from '@wix/wix-ui-icons-common';
import { CounterBadgeButton } from '../CounterBadgeButton';
import { useToolbarCollectionContext } from '../ToolbarCollectionContext';
import { ResponsiveButton } from '../ResponsiveButton/ResponsiveButton';
const _MoreFiltersCTA = () => {
    const state = useToolbarCollectionContext();
    const { toolbar: { responsive }, container: { translate: t }, toolbarFiltersState, } = state;
    return (React.createElement(CounterBadgeButton, { dataHook: "more-filters-button-counter", count: state.collection.query.nonPersistentCustomFiltersCount },
        React.createElement(ResponsiveButton, { ref: toolbarFiltersState?.moreFiltersButtonRef, state: responsive.filters, shouldShrink: false, key: "more-filters-button", dataHook: "more-filters-button", icon: React.createElement(ContentFilter, null), onClick: toolbarFiltersState?.onFiltersButtonClick }, t('cairo.toolbar.moreFiltersButton', { defaultValue: '' }))));
};
export const MoreFiltersCTA = observer(_MoreFiltersCTA);
//# sourceMappingURL=MoreFiltersCTA.js.map