@adaptabletools/adaptable-cjs
Version:
Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
161 lines (160 loc) • 8.84 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.AlertBehaviourWizardSection = exports.renderAlertBehaviourSummary = exports.renderAlertBehaviourWizardSummary = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const Tabs_1 = require("../../../components/Tabs");
const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
const CheckBox_1 = require("../../../components/CheckBox");
const CodeBlock_1 = require("../../../components/CodeBlock");
const rebass_1 = require("rebass");
const ValueSelector_1 = require("../../Components/ValueSelector");
const StyleComponent_1 = require("../../Components/StyleComponent");
const ObjectFactory_1 = tslib_1.__importDefault(require("../../../Utilities/ObjectFactory"));
const AdaptableContext_1 = require("../../AdaptableContext");
const StylePreview_1 = require("../../../components/StylePreview");
const Panel_1 = tslib_1.__importDefault(require("../../../components/Panel"));
const Select_1 = require("../../../components/Select");
const HighlightStyle = (props) => {
const adaptable = (0, AdaptableContext_1.useAdaptable)();
const options = [
{
label: 'Use Message Type',
onClick: () => {
props.onChange(true);
},
},
{
label: 'Custom Style',
onClick: () => {
const initialStyle = ObjectFactory_1.default.CreateEmptyStyle();
props.onChange(initialStyle);
},
},
];
const options2 = [
{
label: 'Use Message Type',
value: 'system',
},
{
label: 'Custom Style',
value: 'custom',
},
];
return (React.createElement(rebass_1.Box, { "data-name": props.dataName },
React.createElement(rebass_1.Flex, null,
React.createElement(CheckBox_1.CheckBox, { mr: 2, style: { alignItems: 'flex-start' }, checked: Boolean(props.highlight), onChange: (checked) => {
props.onChange(checked);
} }, props.label),
Boolean(props.highlight) && (React.createElement(Select_1.Select, { options: options2, value: typeof props.highlight === 'boolean' ? 'system' : 'custom', onChange: (value) => {
if (value === 'system') {
props.onChange(true);
}
else {
const initialStyle = ObjectFactory_1.default.CreateEmptyStyle();
props.onChange(initialStyle);
}
} }))),
typeof props.highlight === 'object' && (React.createElement(Panel_1.default, { margin: 2 },
React.createElement(rebass_1.Box, { paddingLeft: 3 },
React.createElement(StyleComponent_1.StyleComponent, { headless: true, api: adaptable.api, Style: props.highlight, UpdateStyle: (style) => {
props.onChange(style);
} }))))));
};
const renderAlertBehaviourWizardSummary = (alertDefinition) => {
const { api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
return (0, exports.renderAlertBehaviourSummary)(alertDefinition, api);
};
exports.renderAlertBehaviourWizardSummary = renderAlertBehaviourWizardSummary;
const renderAlertBehaviourSummary = (alert, api, allowWrap = false) => {
const { AlertProperties = {} } = alert;
const values = [
AlertProperties.PreventEdit ? { label: 'Prevent Cell Edit', id: 'preventCellEdit' } : null,
AlertProperties.HighlightCell ? { label: 'Highlight Cell', id: 'highlightCell' } : null,
AlertProperties.HighlightRow ? { label: 'Highlight Row', id: 'highlightRow' } : null,
AlertProperties.JumpToCell ? { label: 'Jump To Cell', id: 'jumptocell' } : null,
AlertProperties.JumpToRow ? { label: 'Jump To Row', id: 'jumptorow' } : null,
AlertProperties.ShowInDiv
? {
label: (React.createElement(React.Fragment, null,
"Show in ",
React.createElement(CodeBlock_1.CodeBlock, { ml: 1, p: 0 }, `<div />`))),
id: 'showInDiv',
}
: null,
AlertProperties.LogToConsole ? { label: 'Log To Console', id: 'logtoconsole' } : null,
].filter(Boolean);
if (!values.length) {
values.push({
label: 'No ' + api.internalApi.getCorrectEnglishVariant('Behaviour') + ' Selected',
id: 'none',
});
}
return (React.createElement(ValueSelector_1.ValueOptionsTags, { allowWrap: allowWrap, options: values, value: values.map((v) => v.id), readOnly: true, toIdentifier: (x) => x.id, toLabel: (x) => {
if (x.id === 'highlightCell' && typeof AlertProperties.HighlightCell === 'object') {
return (React.createElement(StylePreview_1.StylePreview, { padding: 0, mt: 0, styleObject: AlertProperties.HighlightCell }, "Highlight Cell"));
}
if (x.id === 'highlightRow' && typeof AlertProperties.HighlightRow === 'object') {
return (React.createElement(StylePreview_1.StylePreview, { padding: 0, mt: 0, styleObject: AlertProperties.HighlightRow }, "Highlight Row"));
}
return React.createElement(React.Fragment, null, x.label);
} }));
};
exports.renderAlertBehaviourSummary = renderAlertBehaviourSummary;
const AlertBehaviourWizardSection = (props) => {
const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
const { AlertProperties = {} } = data;
const rowRemovedAlert = api.alertApi.internalApi.isAlertDefinitionForRemovedRowChangeEvent(data);
// data change only
const hasPreventCellEdit = props.alertType === 'Validation';
// except row change
const hasHighlightCell = props.alertType !== 'RowChange';
// except row removed
const hasHighlightRow = !rowRemovedAlert;
// except row changed
const hasJumpToCell = props.alertType !== 'RowChange';
// for all
const showInSeparateDiv = true;
// for all
const logToConsole = true;
// except row removed
const hasJumpToRow = !rowRemovedAlert;
const onChange = (AlertProperties) => {
props.onChange({
...data,
AlertProperties: {
...data.AlertProperties,
...AlertProperties,
},
});
};
return (React.createElement(Tabs_1.Tabs, null,
React.createElement(Tabs_1.Tabs.Tab, null, api.internalApi.getCorrectEnglishVariant('Behaviour')),
React.createElement(Tabs_1.Tabs.Content, null,
hasPreventCellEdit && (React.createElement(CheckBox_1.CheckBox, { "data-name": "prevent-cell-edit", style: { alignItems: 'flex-start' }, checked: AlertProperties.PreventEdit, disabled: true },
"Prevent Cell Edit",
React.createElement(rebass_1.Text, { fontSize: 2, mt: 1 }, "(automatically undo data change which triggered Alert)"))),
hasHighlightCell && (React.createElement(HighlightStyle, { dataName: "highlight-cell", highlight: AlertProperties.HighlightCell, label: "Highlight Cell", onChange: (HighlightCell) => {
onChange({ HighlightCell });
} })),
hasHighlightRow && (React.createElement(HighlightStyle, { dataName: "highlight-row", highlight: AlertProperties.HighlightRow, label: "Highlight Row", onChange: (HighlightRow) => {
onChange({ HighlightRow });
} })),
hasJumpToCell && (React.createElement(CheckBox_1.CheckBox, { "data-name": "jump-to-cell", checked: AlertProperties.JumpToCell, onChange: (JumpToCell) => {
onChange({ JumpToCell });
} }, "Jump To Cell")),
hasJumpToRow && (React.createElement(CheckBox_1.CheckBox, { "data-name": "jump-to-row", checked: AlertProperties.JumpToRow, onChange: (JumpToRow) => {
onChange({ JumpToRow });
} }, "Jump To Row")),
showInSeparateDiv && (React.createElement(CheckBox_1.CheckBox, { "data-name": "show-in-div", checked: AlertProperties.ShowInDiv, onChange: (ShowInDiv) => {
onChange({ ShowInDiv });
} },
"Show in separate ",
React.createElement(CodeBlock_1.CodeBlock, null, `<div />`),
" element")),
logToConsole && (React.createElement(CheckBox_1.CheckBox, { "data-name": "log-to-console", checked: AlertProperties.LogToConsole, onChange: (LogToConsole) => {
onChange({ LogToConsole });
} }, "Log To Console")))));
};
exports.AlertBehaviourWizardSection = AlertBehaviourWizardSection;