import * as React from 'react';
import { useOnePageAdaptableWizardContext } from '../../Wizard/OnePageAdaptableWizard';
import { Tabs } from '../../../components/Tabs';
import { Flex } from 'rebass';
import { TypeRadio } from '../../Wizard/TypeRadio';
export const renderFormatColumnTargetSummary = (data) => {
    if (!data.Target || data.Target === 'cell') {
        return 'Column Cells';
    }
    if (data.Target === 'columnHeader') {
        return 'Column Header';
    }
};
export const FormatColumnTargetWizardSection = (props) => {
    const { data, api } = useOnePageAdaptableWizardContext();
    const currentTarget = data.Target ? data.Target : 'cell';
    const handleTargetChange = (target) => {
        // Update the formatColumn object
        props.onChange({
            ...data,
            Target: target,
        });
    };
    return (React.createElement(React.Fragment, null,
        React.createElement(Tabs, { mb: 3 },
            React.createElement(Tabs.Tab, null, "Target"),
            React.createElement(Tabs.Content, null,
                React.createElement(Flex, { flexDirection: "column" },
                    React.createElement(TypeRadio, { "data-name": "target-column-cell", text: 'Column Cells', description: "Column Cells are styled and formatted", checked: currentTarget === 'cell', onClick: () => handleTargetChange('cell') }),
                    React.createElement(TypeRadio, { "data-name": "target-column-header", text: 'Column Header', description: "The Column Header is styled (Note: Conditions are not available for Column Headers)", checked: currentTarget === 'columnHeader', onClick: () => handleTargetChange('columnHeader') }))))));
};
