import React, { cloneElement, Fragment } from 'react';
import { TableToolbar } from '@wix/design-system';
import { SearchOrCustomFilter } from './SearchOrCustomFilter';
import { InitialLoadingConditional } from '../InitialLoadingConditional';
import { CollectionToolbarSkeletonItem } from './CollectionToolbarSkeletonItem';
import { useToolbarCollectionContext } from '../ToolbarCollectionContext';
import { observer } from 'mobx-react-lite';
import { useIsMobile } from '../../hooks/useIsMobile';
function _CollectionToolbarActionsToolbarItemsGroup(props) {
    const { state, left, viewsToolbarItem, filtersElement, MoreFiltersButton, multiLevelSorting, customColumns, exportButton, search, showCustomColumnsOnTheLeft, } = props;
    const toolbarState = useToolbarCollectionContext();
    const searchChild = search && (React.createElement(SearchOrCustomFilter, { state: state, search: search }));
    const isMobile = useIsMobile();
    return (React.createElement(Fragment, null,
        (!isMobile || !state._searchExpanded) && (React.createElement(Fragment, null,
            left ? (React.createElement(React.Fragment, null,
                viewsToolbarItem && (React.createElement(InitialLoadingConditional, { state: toolbarState, loadingElement: React.createElement(CollectionToolbarSkeletonItem, { dataHook: "toolbar-views-skeleton", width: "100px" }) }, viewsToolbarItem)),
                filtersElement)) : viewsToolbarItem ? (filtersElement) : undefined,
            MoreFiltersButton && (React.createElement(TableToolbar.Item, null,
                React.createElement(MoreFiltersButton, null))),
            customColumns && showCustomColumnsOnTheLeft && (React.createElement(TableToolbar.Item, null, customColumns)),
            multiLevelSorting && (React.createElement(TableToolbar.Item, null, multiLevelSorting)),
            exportButton && (React.createElement(TableToolbar.Item, null, cloneElement(exportButton, {
                toolbarType: 'default',
            }))),
            customColumns && !showCustomColumnsOnTheLeft && (React.createElement(TableToolbar.Item, null, customColumns)))),
        searchChild));
}
export const CollectionToolbarActionsToolbarItemsGroup = observer(_CollectionToolbarActionsToolbarItemsGroup);
//# sourceMappingURL=CollectionToolbarActionsToolbarItemsGroup.js.map