import { Button , ButtonGroup } from '@mui/material' ; import ClearAllIcon from '@mui/icons-material/ClearAll' ; import RestoreIcon from '@mui/icons-material/Restore' ; import RestoreFromTrashIcon from '@mui/icons-material/RestoreFromTrash' ; import SaveIcon from '@mui/icons-material/Save' ; import React from 'react' ; export interface TrashBinControlButtonGroupProps extends React . HTMLAttributes < HTMLDivElement > { disableReset ? : boolean ; disableClear ? : boolean ; disableRestore ? : boolean ; disableSave ? : boolean ; showReset ? : boolean ; showClear ? : boolean ; showRestore ? : boolean ; showSave ? : boolean ; onResetClick ? : ( ) => void ; onClearClick ? : ( ) => void ; onRestoreClick ? : ( ) => void ; onSaveClick ? : ( ) => void ; fullWidth ? : boolean ; } param disableReset param disableClear param disableRestore param disableSave param showReset param showClear param showRestore param showSave param onResetClick param onClearClick param onRestoreClick param onSaveClick param fullWidth export const TrashBinControlButtonGroup = React . forwardRef ( function ( props , ref ) : React . ReactElement { const { disableReset , disableClear , disableRestore , disableSave , showReset = true , showClear = true , showRestore = true , showSave = true , onResetClick , onClearClick , onRestoreClick , onSaveClick , fullWidth = true , ... otherProps } = props ; return ( < div { ... otherProps } ref = { ref } > < ButtonGroup fullWidth = { fullWidth } > { showReset && ( < Button id = "reset-button" disabled = { disableReset } onClick = { ( ) => onResetClick && onResetClick ( ) } > < RestoreIcon /> Reset < /Button>)} { showClear && ( < Button id = "clear-button" disabled = { disableClear } onClick = { ( ) => onClearClick && onClearClick ( ) } > < ClearAllIcon /> Clear < /Button>)} { showRestore && ( < Button id = "restore-button" disabled = { disableRestore } onClick = { ( ) => onRestoreClick && onRestoreClick ( ) } > < RestoreFromTrashIcon /> Restore < /Button>)} { showSave && ( < Button id = "save-button" disabled = { disableSave } onClick = { ( ) => onSaveClick && onSaveClick ( ) } > < SaveIcon /> Save < /Button>)} < /ButtonGroup> < /div>); } ) ; export default TrashBinControlButtonGroup ;