import React from 'react';
import { makeStyles, Typography, Tabs, Tab, InputAdornment, lighten } from '@material-ui/core';
import { AmbientTextField } from '../../../inputs/textField/AmbientTextField';
import { SearchIcon, CombineIcon, ExportIcon, DownloadIcon, BlockedIcon, SaveIcon, DeleteIcon, ClearIcon } from '@fluentui/react-icons';
import { AmbientTokenButton } from '../../../inputs/buttons/AmbientTokenButton';
import PropTypes from 'prop-types';
// import {PAHExport} from './PAHExport'
const useStyles = makeStyles((theme) => ({
    root: {
        display: 'flex',
        flexDirection: 'row',
        padding: theme.spacing(0.5),
        background: (props) => props.background
            ? props.background
            : lighten(theme.palette.secondary.light, 0.9)
    },
    label: {
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'flex-end'
    },
    title: {
        flex: 1,
        display: 'flex',
        alignItems: 'center',
        marginLeft: (props) => (props.title ? theme.spacing(2) : 0)
    },
    // @todo: switch to Fluent tabs and remove this style
    tabRoot: {
        minWidth: 0,
        textTransform: 'none'
    },
    controls: {
        display: 'flex',
        alignItems: 'center',
        gridGap: theme.spacing(2),
        gap: theme.spacing(2),
        marginRight: theme.spacing(2)
    },
    icon: {
        background: theme.palette.common.white,
        padding: theme.spacing(1),
        color: theme.palette.secondary.main
    }
}));
/** @deprecated Use the new grid. */
export const GridActionBar = (props) => {
    const classes = useStyles(props);
    const { children, onChange, handleChange, value, exportCSV, exportExcel, exportPDF, fitClick, expandClick, clearClick, exportClick, saveGridConfig, deleteGridConfig, clearGridConfig, title, hideFitGrid = false, hideExpandGrid = false, hideExportGrid = false, hideRemoveFilters = false, hideFilterTab = false, hideGroupTab = false, hideColumnTab = false, hideSearchBar = false } = props;
    const gridControlsExport = (React.createElement("div", null));
    return (React.createElement("div", { className: classes.root }, React.createElement("div", { className: classes.title }, title && (React.createElement(Typography, { variant: "h6", style: {
            overflow: 'hidden',
            whiteSpace: 'nowrap',
            textOverflow: 'ellipsis'
        } }, ' ', title, ' ')), !hideSearchBar && (React.createElement("div", { style: {
            flex: 1,
            marginLeft: 16,
            marginRight: 16,
            marginTop: -16
        } }, React.createElement(AmbientTextField, { title: title, onChange: onChange, InputProps: {
            type: 'search',
            startAdornment: (React.createElement(InputAdornment, { position: "start" }, React.createElement(SearchIcon, null)))
        } })))), React.createElement("div", null, " ", gridControlsExport), React.createElement("div", { className: classes.controls }, saveGridConfig && (React.createElement(AmbientTokenButton, { iconClassName: classes.icon, icon: SaveIcon, tooltip: "Save Grid Configuration", ariaLabel: "Save Grid Configuration", onClick: saveGridConfig })), deleteGridConfig && (React.createElement(AmbientTokenButton, { iconClassName: classes.icon, icon: DeleteIcon, tooltip: "Delete Grid Configuration", ariaLabel: "Delete Grid Configuration", onClick: deleteGridConfig })), clearGridConfig && (React.createElement(AmbientTokenButton, { iconClassName: classes.icon, icon: ClearIcon, tooltip: "Clear Grid Configuration", ariaLabel: "Clear Grid Configuration", onClick: clearGridConfig })), !hideFitGrid && (React.createElement(AmbientTokenButton, { iconClassName: classes.icon, icon: CombineIcon, tooltip: "Fit Grid", ariaLabel: "Fit Grid", onClick: fitClick })), !hideExpandGrid && (React.createElement(AmbientTokenButton, { iconClassName: classes.icon, icon: ExportIcon, tooltip: "Expand Grid", ariaLabel: "Expand Grid", onClick: expandClick })), !hideExportGrid && (React.createElement(AmbientTokenButton, { iconClassName: classes.icon, icon: DownloadIcon, tooltip: "Export Grid", ariaLabel: "Export Grid", onClick: exportClick })), !hideRemoveFilters && (React.createElement(AmbientTokenButton, { iconClassName: classes.icon, icon: BlockedIcon, tooltip: "Remove Filters", ariaLabel: "Remove Filters", onClick: clearClick }))), React.createElement(Tabs, { value: value, onChange: handleChange, "aria-label": "basic tabs example" }, !hideFilterTab && (React.createElement(Tab, { label: "Filter", classes: { root: classes.tabRoot } })), !hideGroupTab && (React.createElement(Tab, { label: "Group", classes: { root: classes.tabRoot } })), !hideColumnTab && (React.createElement(Tab, { label: "Column", classes: { root: classes.tabRoot } }))), children));
};
GridActionBar.propTypes = {
    /**
     * Title of the action bar
     */
    title: PropTypes.string,
    /**
     * Child content to add within action bar
     */
    children: PropTypes.node,
    /**
     * Handle change function for quick search
     */
    handleChange: PropTypes.func,
    /**
     * Passes the tab value of the action bar
     */
    value: PropTypes.number,
    /**
     * Passes click event to function for fit to grid
     */
    fitClick: PropTypes.func,
    /**
     * Passes click event to function for fit to grid
     */
    expandClick: PropTypes.func,
    /**
     * Passes click event to function for expanding grid
     */
    clearClick: PropTypes.func,
    /**
     * Passes click event to function for exporting grid
     */
    exportClick: PropTypes.func
};
//# sourceMappingURL=GridActionBar.js.map