import { Box, IconButton, TextButton } from '@wix/design-system';
import React from 'react';
import { useToolbarCollectionContext } from '../ToolbarCollectionContext';
import { withoutDefaults } from '@wix/bex-core';
import { wixPatternsSectionHeaderPrimaryActionClicked, cairoSectionCtaClicked, } from '@wix/bex-core/bi';
import { ChevronDown, ChevronUp } from '@wix/wix-ui-icons-common';
export const CollectionSectionHeaderActionBar = ({ sectionId, sectionIndex, section, biComponentType, collapsible, onToggleCollapse, }) => {
    const { toolbarBIReporter } = useToolbarCollectionContext();
    const { primaryAction, collapsed } = section;
    const handlePrimaryActionClick = () => {
        toolbarBIReporter.reportBi(wixPatternsSectionHeaderPrimaryActionClicked({
            sectionId,
            cta: primaryAction?.id,
            componentType: biComponentType,
        }));
        primaryAction?.onClick?.();
    };
    const handleCollapseActionClick = () => {
        toolbarBIReporter.reportBi(withoutDefaults(cairoSectionCtaClicked)({
            location: 'Section Toolbar',
            sectionType: 'table',
            ctaName: collapsed ? 'expand' : 'collapse',
            sectionIndex,
        }));
        onToggleCollapse?.(sectionId);
    };
    return (React.createElement(Box, { direction: "horizontal", gap: "SP2", placeItems: "center" },
        primaryAction && (React.createElement(TextButton, { prefixIcon: primaryAction.prefixIcon, dataHook: "collection-section-header-primary-action", onClick: handlePrimaryActionClick, size: "small" }, primaryAction.label)),
        collapsible && (React.createElement(IconButton, { size: "tiny", dataHook: "collection-section-header-collapse-action", skin: "light", priority: "primary", onClick: handleCollapseActionClick }, collapsed ? React.createElement(ChevronDown, null) : React.createElement(ChevronUp, null)))));
};
//# sourceMappingURL=CollectionSectionHeaderActionBar.js.map