UNPKG

@adaptabletools/adaptable

Version:

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

45 lines (44 loc) 2.77 kB
import * as React from 'react'; import { Box, Text } from 'rebass'; import { useOnePageAdaptableWizardContext } from '../../Wizard/OnePageAdaptableWizard'; import { Tabs } from '../../../components/Tabs'; import { StyleComponent } from '../../Components/StyleComponent'; import { StylePreview } from '../../../components/StylePreview'; const changeStyle = (React.createElement(Text, { fontSize: 2, style: { display: 'inline-block' } }, "Change style")); export const FlashingAlertStyleWizardSection = (props) => { let { data: flashingAlert, api } = useOnePageAdaptableWizardContext(); flashingAlert = flashingAlert ?? props.flashingAlert; return (React.createElement(React.Fragment, null, React.createElement(Tabs, { defaultValue: "up" }, React.createElement(Tabs.Tab, { value: "up" }, "Up ", changeStyle), React.createElement(Tabs.Content, { value: "up" }, React.createElement(StyleComponent, { headless: true, api: api, Style: flashingAlert.UpChangeStyle ?? {}, UpdateStyle: (style) => props.onStyleChange('UpChangeStyle', style) })), React.createElement(Tabs.Tab, { value: "down" }, "Down ", changeStyle), React.createElement(Tabs.Content, { value: "down" }, React.createElement(StyleComponent, { headless: true, api: api, Style: flashingAlert.DownChangeStyle ?? {}, UpdateStyle: (style) => props.onStyleChange('DownChangeStyle', style) })), React.createElement(Tabs.Tab, { value: "neutral" }, "Neutral ", changeStyle), React.createElement(Tabs.Content, { value: "neutral" }, React.createElement(StyleComponent, { headless: true, api: api, Style: flashingAlert.NeutralChangeStyle ?? {}, UpdateStyle: (style) => props.onStyleChange('NeutralChangeStyle', style) }))))); }; export const FlashingCellStyle = (props) => { const { data, ...boxProps } = props; return (React.createElement(Box, { ...boxProps }, React.createElement(StylePreview, { styleObject: props.data.UpChangeStyle }, "Up change style ", !props.data.UpChangeStyle ? ' - no style' : ''), React.createElement(StylePreview, { mt: 2, styleObject: props.data.DownChangeStyle }, "Down change style ", !props.data.DownChangeStyle ? ' - no style' : ''), React.createElement(StylePreview, { mt: 2, styleObject: props.data.NeutralChangeStyle }, "Neutral change style ", !props.data.NeutralChangeStyle ? ' - no style' : ''))); }; export const renderFlashingAlertStyleSummary = (flashingAlert) => { return React.createElement(FlashingCellStyle, { data: flashingAlert }); };