UNPKG

@adaptabletools/adaptable

Version:

Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements

50 lines (49 loc) 3.04 kB
import * as React from 'react'; import Panel from '../../../../components/Panel'; import { ButtonClose } from '../../Buttons/ButtonClose'; import { ButtonConfigure } from '../../Buttons/ButtonConfigure'; import { ButtonMinimise } from '../../Buttons/ButtonMinimise'; import { Flex } from 'rebass'; import join from '../../../../components/utils/join'; import { ButtonMaximise } from '../../Buttons/ButtonMaximise'; export class PanelToolPanel extends React.Component { render() { const { useDefaultPanelStyle, isMinimised, onMinimiseChanged, headerText, onClose, onConfigure, ...props } = this.props; let header = (React.createElement(React.Fragment, null, !isMinimised ? (React.createElement(ButtonMinimise, { className: "ab-ToolPanelPanel__header-minimise", onClick: () => onMinimiseChanged(), marginRight: 1 })) : (React.createElement(ButtonMaximise, { className: "ab-ToolPanelPanel__header-maximise", onClick: () => onMinimiseChanged(), marginRight: 1 })), React.createElement(Flex, { className: "ab-ToolPanelPanel__header-text", flex: 1, alignItems: "center", marginLeft: 0 }, headerText), onConfigure && (React.createElement(ButtonConfigure, { iconSize: 16, marginLeft: 1, className: "ab-ToolPanelPanel__header-configure-button", tooltip: 'Configure ' + headerText, onClick: () => onConfigure() })), onClose && (React.createElement(ButtonClose, { marginLeft: 0, className: "ab-ToolPanelPanel__header-close-button", tooltip: 'Close ' + headerText, onClick: () => onClose(), disabled: props.disabled })))); return (React.createElement(Panel, { border: "var(--ab-cmp-toolpanelpanel__border)", ...props, className: join('ab-ToolPanelPanel', props.className), header: header, style: { color: 'var(--ab-cmp-toolpanelpanel__color)', fill: 'var(--ab-cmp-toolpanelpanel__fill)', ...props.style, }, headerProps: { ...props.headerProps, alignItems: 'stretch', style: { padding: 'var(--ab-cmp-toolpanelpanel_header__padding)', background: 'var(--ab-cmp-toolpanelpanel_header__background)', color: 'var(--ab-cmp-toolpanelpanel_header__color)', fill: 'var(--ab-cmp-toolpanelpanel_header__fill)', ...(props.headerProps ? props.headerProps.style : null), }, }, bodyProps: { ...props.bodyProps, style: { padding: 'var(--ab-cmp-dashboardpanel_body__padding)', background: 'var(--ab-cmp-dashboardpanel_body__background)', ...(props.bodyProps ? props.bodyProps.style : null), display: 'flex', flexDirection: 'column', }, } })); } } PanelToolPanel.defaultProps = { headerText: '', onClose: null, onConfigure: null, onMinimiseChanged: null, isMinimised: true, };