@adaptabletools/adaptable 13.0.0-canary.17 → 13.0.0-canary.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/base.css +99 -0
- package/base.css.map +1 -1
- package/bundle.cjs.js +110 -110
- package/index.css +115 -0
- package/index.css.map +1 -1
- package/package.json +1 -1
- package/publishTimestamp.d.ts +1 -1
- package/publishTimestamp.js +1 -1
- package/src/Api/FormatColumnApi.d.ts +37 -29
- package/src/Api/Implementation/FormatColumnApiImpl.d.ts +21 -11
- package/src/Api/Implementation/FormatColumnApiImpl.js +42 -63
- package/src/Strategy/FormatColumnModule.js +2 -12
- package/src/View/AdaptablePopover/index.js +1 -1
- package/src/View/Alert/Wizard/AlertBehaviourWizardSection.js +9 -9
- package/src/View/Alert/Wizard/AlertDisplayWizardSection.js +6 -5
- package/src/View/BulkUpdate/BulkUpdatePopup.js +1 -1
- package/src/View/Components/AdaptableObjectList/AdaptableObjectList.js +1 -1
- package/src/View/Components/AdaptableObjectRow/index.js +1 -6
- package/src/View/Components/Buttons/ButtonInfo.d.ts +1 -3
- package/src/View/Components/Buttons/ButtonInfo.js +3 -5
- package/src/View/Components/EntityRulesEditor/index.js +8 -17
- package/src/View/Components/FilterForm/FilterForm.js +11 -16
- package/src/View/Components/FilterForm/QuickFilterForm.js +7 -13
- package/src/View/Components/NewScopeComponent.js +1 -1
- package/src/View/Components/Panels/PanelWithButton.js +1 -5
- package/src/View/Components/Panels/PanelWithImage.js +1 -5
- package/src/View/Components/Popups/AdaptablePopup/AdaptablePopup.js +2 -2
- package/src/View/Components/Popups/AdaptablePopup/AdaptablePopupDialog.d.ts +1 -0
- package/src/View/Components/Popups/AdaptablePopup/AdaptablePopupDialog.js +3 -16
- package/src/View/Components/Popups/AdaptablePopup/PopupPanel.js +1 -1
- package/src/View/Components/Popups/AdaptablePopupTeamSharing.js +5 -5
- package/src/View/Components/ScopeComponent.js +4 -4
- package/src/View/Components/Selectors/ColumnValueSelector.js +2 -2
- package/src/View/Components/StyleComponent.js +12 -17
- package/src/View/ConditionalStyle/Wizard/ConditionalStyleSettingsWizardSettings.js +1 -1
- package/src/View/DataSet/DataSetSelector.js +1 -1
- package/src/View/Export/ReportExportDropdown.js +1 -1
- package/src/View/Export/Wizard/ReportNameWizardSection.js +10 -11
- package/src/View/FlashingCell/FlashingCellStyle.js +3 -3
- package/src/View/FlashingCell/Wizard/FlashingCellSettingsWizardSection.js +6 -6
- package/src/View/FlashingCell/Wizard/FlashingCellWizard.js +4 -4
- package/src/View/FormatColumn/FormatColumnSummary.js +1 -1
- package/src/View/FormatColumn/Wizard/FormatColumnFormatWizardSection.js +26 -26
- package/src/View/FormatColumn/Wizard/FormatColumnSettingsWizardSection.js +2 -6
- package/src/View/FormatColumn/Wizard/FormatColumnStyleWizardSection.js +1 -1
- package/src/View/FreeTextColumn/Wizard/FreeTextColumnSettingsWizardSection.js +7 -7
- package/src/View/Layout/LayoutRadioSelector.js +1 -1
- package/src/View/Layout/Wizard/Components/ColumnLabels.js +1 -1
- package/src/View/Layout/Wizard/sections/ColumnsSection.js +5 -5
- package/src/View/Layout/Wizard/sections/SettingsSection.js +2 -2
- package/src/View/PlusMinus/Wizard/PlusMinusSettingsWizardSection.js +3 -3
- package/src/View/Query/Wizard/NamedQuerySettingsWizardSection.js +1 -1
- package/src/View/QuickSearch/QuickSearchPopup.js +2 -2
- package/src/View/Schedule/Wizard/ScheduleScheduleWizard.js +5 -5
- package/src/View/Schedule/Wizard/ScheduleSettingsWizard/ScheduleSettingsGlue42.js +1 -1
- package/src/View/Schedule/Wizard/ScheduleSettingsWizard/ScheduleSettingsIPushPull.js +5 -5
- package/src/View/Schedule/Wizard/ScheduleSettingsWizard/ScheduleSettingsOpenFin.js +1 -1
- package/src/View/Schedule/Wizard/ScheduleSettingsWizard/ScheduleSettingsReminder.js +5 -5
- package/src/View/Schedule/Wizard/ScheduleSettingsWizard/ScheduleSettingsReport.js +2 -2
- package/src/View/Shortcut/Wizard/ShortcutSettingsWizard.js +3 -3
- package/src/View/SmartEdit/SmartEditPopup.js +3 -3
- package/src/View/SpecialColumnSettingsWizardStep.js +10 -10
- package/src/View/StateManagement/StateManagementPopup.js +4 -4
- package/src/View/SystemStatus/SystemStatusEntityRow.js +4 -6
- package/src/View/TeamSharing/SharedEntityObjectView.js +1 -1
- package/src/View/TeamSharing/TeamSharingApplyButton.js +1 -1
- package/src/View/Theme/ThemePopup.js +1 -1
- package/src/View/Wizard/OnePageAdaptableWizard.js +1 -2
- package/src/agGrid/Adaptable.d.ts +0 -1
- package/src/agGrid/Adaptable.js +41 -65
- package/src/agGrid/PercentBarRenderer.js +3 -6
- package/src/agGrid/weightedAverage.js +19 -11
- package/src/components/CheckBox/index.js +1 -1
- package/src/components/ExpressionEditor/BaseEditorInput.js +13 -32
- package/src/components/ExpressionEditor/index.js +9 -17
- package/src/components/FormLayout/index.js +1 -1
- package/src/components/StylePreview.js +2 -1
- package/src/metamodel/adaptable.metamodel.js +1 -1
- package/version.d.ts +1 -1
- package/version.js +1 -1
|
@@ -46,19 +46,6 @@ const PopupDialog = (props) => {
|
|
|
46
46
|
};
|
|
47
47
|
const AdaptablePopupDialog = (props) => {
|
|
48
48
|
const { isActionModule, style, friendlyName, baseClassName, className, children, onHide, isWindowModal, modalContainer, } = props;
|
|
49
|
-
const elementRef = React.useMemo(() => {
|
|
50
|
-
if (!modalContainer) {
|
|
51
|
-
return null;
|
|
52
|
-
}
|
|
53
|
-
let ref = null;
|
|
54
|
-
if (typeof modalContainer === 'string') {
|
|
55
|
-
ref = globalThis.document.querySelector(modalContainer);
|
|
56
|
-
}
|
|
57
|
-
else {
|
|
58
|
-
ref = modalContainer;
|
|
59
|
-
}
|
|
60
|
-
return ref;
|
|
61
|
-
}, [modalContainer]);
|
|
62
49
|
if (modalContainer) {
|
|
63
50
|
let ref = null;
|
|
64
51
|
if (typeof modalContainer === 'string') {
|
|
@@ -67,15 +54,15 @@ const AdaptablePopupDialog = (props) => {
|
|
|
67
54
|
else {
|
|
68
55
|
ref = modalContainer;
|
|
69
56
|
}
|
|
70
|
-
return (0, react_dom_1.createPortal)(React.createElement(Dialog_1.default, { modal: false, fixed: false, onDismiss: onHide, className: className }, children), ref);
|
|
57
|
+
return (0, react_dom_1.createPortal)(React.createElement(Dialog_1.default, { "data-name": props.dataName, modal: false, fixed: false, onDismiss: onHide, className: className }, children), ref);
|
|
71
58
|
}
|
|
72
59
|
if (isWindowModal) {
|
|
73
60
|
const settingsPanelOptionsKey = isActionModule ? `action-${friendlyName}` : 'settings';
|
|
74
|
-
return (React.createElement(WindowDialog, { settingsPanelOptionsKey: settingsPanelOptionsKey, isActionModule: isActionModule, onHide: onHide, style: style, baseClassName: baseClassName, className: className }, children));
|
|
61
|
+
return (React.createElement(WindowDialog, { dataName: props.dataName, settingsPanelOptionsKey: settingsPanelOptionsKey, isActionModule: isActionModule, onHide: onHide, style: style, baseClassName: baseClassName, className: className }, children));
|
|
75
62
|
}
|
|
76
63
|
else {
|
|
77
64
|
const modalStyle = Object.assign(Object.assign({}, style), (isActionModule ? { maxWidth: 800, maxHeight: 600 } : { maxWidth: 1200, maxHeight: 1000 }));
|
|
78
|
-
return (React.createElement(PopupDialog, { onHide: onHide, style: modalStyle, className: className }, children));
|
|
65
|
+
return (React.createElement(PopupDialog, { "data-name": props.dataName, onHide: onHide, style: modalStyle, className: className }, children));
|
|
79
66
|
}
|
|
80
67
|
};
|
|
81
68
|
exports.AdaptablePopupDialog = AdaptablePopupDialog;
|
|
@@ -15,7 +15,7 @@ const PopupPanel = (props) => {
|
|
|
15
15
|
React.createElement(rebass_1.Box, { marginRight: 0, "data-name": "space-before" }),
|
|
16
16
|
React.createElement("div", { className: `${baseClassName}__Header__Title` }, props.headerText),
|
|
17
17
|
React.createElement(rebass_1.Box, { marginRight: 2, "data-name": "space-after" }),
|
|
18
|
-
props.infoLink != null && !props.infoLinkDisabled && (React.createElement(ButtonInfo_1.ButtonInfo, { iconSize: 24, onClick: () => window.open(props.infoLink, '_blank' // <- opens the link in a new tab or window.
|
|
18
|
+
props.infoLink != null && !props.infoLinkDisabled && (React.createElement(ButtonInfo_1.ButtonInfo, { tone: "none", variant: "text", iconSize: 24, onClick: () => window.open(props.infoLink, '_blank' // <- opens the link in a new tab or window.
|
|
19
19
|
) }))),
|
|
20
20
|
React.createElement(rebass_1.Box, { style: { flex: 1 } }),
|
|
21
21
|
props.button),
|
|
@@ -34,17 +34,17 @@ const AdaptablePopupTeamSharing = (props) => {
|
|
|
34
34
|
": a \"live\" share that is automatically updated with every local change"))),
|
|
35
35
|
React.createElement(FormLayout_1.default, { padding: 2 },
|
|
36
36
|
React.createElement(FormLayout_1.FormRow, { label: "Name: " },
|
|
37
|
-
React.createElement(Input_1.default, { autoFocus: true, value: config.description, type: "string", width: 300, placeholder: "Enter text", onChange: (e) => setConfig(Object.assign(Object.assign({}, config), { description: e.target.value })) })),
|
|
37
|
+
React.createElement(Input_1.default, { "data-name": "teamsharing-entity-name", autoFocus: true, value: config.description, type: "string", width: 300, placeholder: "Enter text", onChange: (e) => setConfig(Object.assign(Object.assign({}, config), { description: e.target.value })) })),
|
|
38
38
|
React.createElement(FormLayout_1.FormRow, { label: "Share: " },
|
|
39
39
|
React.createElement(rebass_1.Flex, { flexDirection: "row" },
|
|
40
|
-
React.createElement(Radio_1.default, { checked: config.type === 'Snapshot', onChange: () => setConfig(Object.assign(Object.assign({}, config), { type: 'Snapshot' })) }, "Snapshot"),
|
|
40
|
+
React.createElement(Radio_1.default, { "data-name": "teamsharing-entity-type-snapshot", checked: config.type === 'Snapshot', onChange: () => setConfig(Object.assign(Object.assign({}, config), { type: 'Snapshot' })) }, "Snapshot"),
|
|
41
41
|
' ',
|
|
42
|
-
React.createElement(Radio_1.default, { marginLeft: 3, checked: config.type === 'Active', onChange: () => setConfig(Object.assign(Object.assign({}, config), { type: 'Active' })) }, "Active"),
|
|
42
|
+
React.createElement(Radio_1.default, { "data-name": "teamsharing-entity-type-active", marginLeft: 3, checked: config.type === 'Active', onChange: () => setConfig(Object.assign(Object.assign({}, config), { type: 'Active' })) }, "Active"),
|
|
43
43
|
' '))),
|
|
44
44
|
React.createElement(rebass_1.Box, { marginTop: 3 },
|
|
45
45
|
React.createElement(rebass_1.Flex, { padding: 2 },
|
|
46
|
-
React.createElement(SimpleButton_1.default, { tone: "neutral", variant: "raised", onClick: () => onClose()
|
|
46
|
+
React.createElement(SimpleButton_1.default, { "data-name": "cancel", tone: "neutral", variant: "raised", onClick: () => onClose() }, "Cancel"),
|
|
47
47
|
React.createElement("div", { style: { flex: 1 } }),
|
|
48
|
-
React.createElement(SimpleButton_1.default, {
|
|
48
|
+
React.createElement(SimpleButton_1.default, { "data-name": "ok", tone: "accent", variant: "raised", disabled: StringExtensions_1.StringExtensions.IsNullOrEmpty(config.description), onClick: () => onConfirm(config) }, "OK")))))));
|
|
49
49
|
};
|
|
50
50
|
exports.AdaptablePopupTeamSharing = AdaptablePopupTeamSharing;
|
|
@@ -41,22 +41,22 @@ class ScopeComponent extends React.Component {
|
|
|
41
41
|
React.createElement(DualListBoxEditor_1.DualListBoxEditor, { style: { flex: 1, overflow: 'hidden', height: '250px' }, AvailableValues: availableValues, SelectedValues: this.state.selectedColumnValues, HeaderAvailable: "Columns", HeaderSelected: "Columns In Style", onChange: (SelectedValues) => this.onColumnsSelectedChanged(SelectedValues) }))),
|
|
42
42
|
this.state.ScopeChoice == 'DataType' && (React.createElement(Panel_1.default, { "data-name": "datatype-scope", variant: "modern" },
|
|
43
43
|
React.createElement(rebass_1.Flex, { flexDirection: "row" },
|
|
44
|
-
this.state.availableDataTypes.includes('Date') && (React.createElement(CheckBox_1.CheckBox, { "data-name": "scope", checked: this.state.componentScope &&
|
|
44
|
+
this.state.availableDataTypes.includes('Date') && (React.createElement(CheckBox_1.CheckBox, { "data-name": "scope", "data-value": "date", checked: this.state.componentScope &&
|
|
45
45
|
'DataTypes' in this.state.componentScope &&
|
|
46
46
|
this.props.api.scopeApi
|
|
47
47
|
.getDataTypesInScope(this.state.componentScope)
|
|
48
48
|
.includes('Date'), marginLeft: 2, onChange: (checked) => this.onCheckBoxDataTypeChecked(checked, 'Date') }, "Date")),
|
|
49
|
-
this.state.availableDataTypes.includes('Number') && (React.createElement(CheckBox_1.CheckBox, { "data-name": "scope", checked: this.state.componentScope &&
|
|
49
|
+
this.state.availableDataTypes.includes('Number') && (React.createElement(CheckBox_1.CheckBox, { "data-name": "scope", "data-value": "number", checked: this.state.componentScope &&
|
|
50
50
|
'DataTypes' in this.state.componentScope &&
|
|
51
51
|
this.props.api.scopeApi
|
|
52
52
|
.getDataTypesInScope(this.state.componentScope)
|
|
53
53
|
.includes('Number'), marginLeft: 4, onChange: (checked) => this.onCheckBoxDataTypeChecked(checked, 'Number') }, "Number")),
|
|
54
|
-
this.state.availableDataTypes.includes('String') && (React.createElement(CheckBox_1.CheckBox, { "data-name": "scope", checked: this.state.componentScope &&
|
|
54
|
+
this.state.availableDataTypes.includes('String') && (React.createElement(CheckBox_1.CheckBox, { "data-name": "scope", "data-value": "string", checked: this.state.componentScope &&
|
|
55
55
|
'DataTypes' in this.state.componentScope &&
|
|
56
56
|
this.props.api.scopeApi
|
|
57
57
|
.getDataTypesInScope(this.state.componentScope)
|
|
58
58
|
.includes('String'), marginLeft: 4, onChange: (checked) => this.onCheckBoxDataTypeChecked(checked, 'String') }, "String")),
|
|
59
|
-
this.state.availableDataTypes.includes('Boolean') && (React.createElement(CheckBox_1.CheckBox, { "data-name": "scope", checked: this.state.componentScope &&
|
|
59
|
+
this.state.availableDataTypes.includes('Boolean') && (React.createElement(CheckBox_1.CheckBox, { "data-name": "scope", "data-value": "boolean", checked: this.state.componentScope &&
|
|
60
60
|
'DataTypes' in this.state.componentScope &&
|
|
61
61
|
this.props.api.scopeApi
|
|
62
62
|
.getDataTypesInScope(this.state.componentScope)
|
|
@@ -74,8 +74,8 @@ class ColumnValueSelector extends React.Component {
|
|
|
74
74
|
]
|
|
75
75
|
: this.state.distinctColumnValues;
|
|
76
76
|
const dd = (React.createElement("div", null,
|
|
77
|
-
React.createElement(DropdownButton_1.default, { className: className, columns: ['label'], variant: "text", showClearButton: true, onClear: () => this.onSelectedValueChange([]), style: { fontSize: 'small' }, disabled: this.props.disabled, items: items, onExpand: this.handleSelectedValueExpand }, this.props.selectedColumnValue ? this.props.selectedColumnValue : placeholderText)));
|
|
78
|
-
const input = (React.createElement(AdaptableInput_1.default, { type: this.props.selectedColumn
|
|
77
|
+
React.createElement(DropdownButton_1.default, { "data-name": "bulkupdate-value-selector", className: className, columns: ['label'], variant: "text", showClearButton: true, onClear: () => this.onSelectedValueChange([]), style: { fontSize: 'small' }, disabled: this.props.disabled, items: items, onExpand: this.handleSelectedValueExpand }, this.props.selectedColumnValue ? this.props.selectedColumnValue : placeholderText)));
|
|
78
|
+
const input = (React.createElement(AdaptableInput_1.default, { "data-name": "bulkupdate-value-input", type: this.props.selectedColumn
|
|
79
79
|
? UIHelper_1.default.getDescriptionForDataType(this.props.selectedColumn.dataType)
|
|
80
80
|
: 'text', placeholder: this.props.selectedColumn
|
|
81
81
|
? UIHelper_1.default.getPlaceHolderforDataType(this.props.selectedColumn.dataType)
|
|
@@ -25,7 +25,7 @@ class StyleComponent extends React.Component {
|
|
|
25
25
|
};
|
|
26
26
|
}
|
|
27
27
|
render() {
|
|
28
|
-
const Cmp = this.props.headless ?
|
|
28
|
+
const Cmp = this.props.headless ? rebass_1.Box : Panel_1.default;
|
|
29
29
|
const cmpProps = this.props.headless
|
|
30
30
|
? {}
|
|
31
31
|
: {
|
|
@@ -36,15 +36,15 @@ class StyleComponent extends React.Component {
|
|
|
36
36
|
const styleClassNames = this.props.api.userInterfaceApi.getStyleClassNames();
|
|
37
37
|
const colourSpellingVariant = this.props.api.internalApi.getCorrectEnglishVariant('Colour');
|
|
38
38
|
const coloursSpellingVariant = this.props.api.internalApi.getCorrectEnglishVariant('colours');
|
|
39
|
-
return (React.createElement(Cmp, Object.assign({}, cmpProps),
|
|
39
|
+
return (React.createElement(Cmp, Object.assign({}, cmpProps, { className: "ab-StyleComponent" }),
|
|
40
40
|
ArrayExtensions_1.default.IsNotNullOrEmpty(styleClassNames) && (React.createElement(rebass_1.Flex, { flexDirection: "row", padding: 2 },
|
|
41
|
-
React.createElement(Radio_1.default, { value: "Predicate", checked: this.state.ShowClassName, onChange: (checked) => this.onShowClassNameChanged(checked) }, "Use Style Class Name"),
|
|
41
|
+
React.createElement(Radio_1.default, { "data-name": "show-class-name", value: "Predicate", checked: this.state.ShowClassName, onChange: (checked) => this.onShowClassNameChanged(checked) }, "Use Style Class Name"),
|
|
42
42
|
' ',
|
|
43
|
-
React.createElement(Radio_1.default, { marginLeft: 3, value: "Expression", checked: !this.state.ShowClassName, onChange: (checked) => this.onShowClassNameChanged(!checked) }, "Create Style"),
|
|
43
|
+
React.createElement(Radio_1.default, { "data-name": "create-style", marginLeft: 3, value: "Expression", checked: !this.state.ShowClassName, onChange: (checked) => this.onShowClassNameChanged(!checked) }, "Create Style"),
|
|
44
44
|
' ')),
|
|
45
45
|
this.state.ShowClassName ? (React.createElement("div", null,
|
|
46
46
|
React.createElement(HelpBlock_1.default, { fontSize: 2 }, 'Select a CSS Class Name'),
|
|
47
|
-
React.createElement(DropdownButton_1.default, { margin: 3, placeholder: "Select", variant: "outlined", columns: ['label'], tone: "none", disabled: ArrayExtensions_1.default.IsNullOrEmpty(styleClassNames), style: {
|
|
47
|
+
React.createElement(DropdownButton_1.default, { "data-name": "select-class-anme", margin: 3, placeholder: "Select", variant: "outlined", columns: ['label'], tone: "none", disabled: ArrayExtensions_1.default.IsNullOrEmpty(styleClassNames), style: {
|
|
48
48
|
minWidth: '15rem',
|
|
49
49
|
whiteSpace: 'nowrap',
|
|
50
50
|
overflow: 'hidden',
|
|
@@ -64,35 +64,30 @@ class StyleComponent extends React.Component {
|
|
|
64
64
|
coloursSpellingVariant),
|
|
65
65
|
React.createElement(FormLayout_1.default, { columns: [1, 2] },
|
|
66
66
|
React.createElement(FormLayout_1.FormRow, null,
|
|
67
|
-
React.createElement(CheckBox_1.CheckBox, { value: "existing", margin: 1, checked: !!this.state.componentStyle.BackColor, onChange: (checked) => this.onUseBackColorCheckChange(checked) },
|
|
67
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "set-background-color", value: "existing", margin: 1, checked: !!this.state.componentStyle.BackColor, onChange: (checked) => this.onUseBackColorCheckChange(checked) },
|
|
68
68
|
"Set Back ",
|
|
69
69
|
colourSpellingVariant),
|
|
70
70
|
this.state.componentStyle.BackColor != null ? (React.createElement(ColorPicker_1.ColorPicker, { api: this.props.api, value: this.state.componentStyle.BackColor, onChange: (x) => this.onBackColorSelectChange(x) })) : (React.createElement("span", null))),
|
|
71
71
|
React.createElement(FormLayout_1.FormRow, null,
|
|
72
|
-
React.createElement(CheckBox_1.CheckBox, { margin: 1, value: "existing", checked: this.state.componentStyle.ForeColor ? true : false, onChange: (checked) => this.onUseForeColorCheckChange(checked) },
|
|
72
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "set-foreground-color", margin: 1, value: "existing", checked: this.state.componentStyle.ForeColor ? true : false, onChange: (checked) => this.onUseForeColorCheckChange(checked) },
|
|
73
73
|
"Set Fore ",
|
|
74
74
|
colourSpellingVariant),
|
|
75
75
|
this.state.componentStyle.ForeColor != null ? (React.createElement(ColorPicker_1.ColorPicker, { api: this.props.api, value: this.state.componentStyle.ForeColor, onChange: (x) => this.onForeColorSelectChange(x) })) : (React.createElement("span", null))),
|
|
76
76
|
React.createElement(FormLayout_1.FormRow, null,
|
|
77
|
-
React.createElement(CheckBox_1.CheckBox, { margin: 1, value: "existing", checked: this.state.componentStyle.BorderColor ? true : false, onChange: (checked) => this.onUseBorderColorCheckChange(checked) },
|
|
77
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "set-border-color", margin: 1, value: "existing", checked: this.state.componentStyle.BorderColor ? true : false, onChange: (checked) => this.onUseBorderColorCheckChange(checked) },
|
|
78
78
|
"Set Border ",
|
|
79
79
|
colourSpellingVariant),
|
|
80
80
|
this.state.componentStyle.BorderColor != null ? (React.createElement(ColorPicker_1.ColorPicker, { api: this.props.api, value: this.state.componentStyle.BorderColor, onChange: (x) => this.onBorderColorSelectChange(x) })) : (React.createElement("span", null)))),
|
|
81
81
|
React.createElement(HelpBlock_1.default, { fontSize: 2, marginTop: 2, marginBottom: 2 }, "Set the font properties of the Style"),
|
|
82
82
|
React.createElement(FormLayout_1.default, { columns: [1] },
|
|
83
83
|
React.createElement(FormLayout_1.FormRow, null,
|
|
84
|
-
React.createElement(CheckBox_1.CheckBox, { margin: 1, value: Enums_1.FontWeight.Normal.toString(), checked: this.state.componentStyle.FontWeight == Enums_1.FontWeight.Bold, onChange: (checked) => this.onFontWeightChange(checked) }, "Bold")),
|
|
84
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "set-font-weight-bold", margin: 1, value: Enums_1.FontWeight.Normal.toString(), checked: this.state.componentStyle.FontWeight == Enums_1.FontWeight.Bold, onChange: (checked) => this.onFontWeightChange(checked) }, "Bold")),
|
|
85
85
|
React.createElement(FormLayout_1.FormRow, null,
|
|
86
|
-
React.createElement(CheckBox_1.CheckBox, { margin: 1, value: Enums_1.FontStyle.Normal.toString(), checked: this.state.componentStyle.FontStyle == Enums_1.FontStyle.Italic, onChange: (checked) => this.onFontStyleChange(checked) }, "Italic")),
|
|
86
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "set-font-style-italic", margin: 1, value: Enums_1.FontStyle.Normal.toString(), checked: this.state.componentStyle.FontStyle == Enums_1.FontStyle.Italic, onChange: (checked) => this.onFontStyleChange(checked) }, "Italic")),
|
|
87
87
|
React.createElement(FormLayout_1.FormRow, null,
|
|
88
|
-
React.createElement(CheckBox_1.CheckBox, { margin: 1, checked: this.state.componentStyle.FontSize ? true : false, onChange: (checked) => this.onUseFontSizeCheckChange(checked) }, "Set Font Size")),
|
|
88
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "set-font-size", margin: 1, checked: this.state.componentStyle.FontSize ? true : false, onChange: (checked) => this.onUseFontSizeCheckChange(checked) }, "Set Font Size")),
|
|
89
89
|
React.createElement(FormLayout_1.FormRow, null, this.state.componentStyle.FontSize != null && (React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center" },
|
|
90
|
-
React.createElement(DropdownButton_1.default, {
|
|
91
|
-
whiteSpace: 'nowrap',
|
|
92
|
-
overflow: 'hidden',
|
|
93
|
-
textOverflow: 'ellipsis',
|
|
94
|
-
maxWidth: 'inherit',
|
|
95
|
-
}, mr: 1, items: EnumExtensions_1.EnumExtensions.getNames(Enums_1.FontSize).map((enumName) => ({
|
|
90
|
+
React.createElement(DropdownButton_1.default, { mr: 1, items: EnumExtensions_1.EnumExtensions.getNames(Enums_1.FontSize).map((enumName) => ({
|
|
96
91
|
value: enumName,
|
|
97
92
|
label: enumName,
|
|
98
93
|
onClick: () => this.onFontSizeChange(enumName),
|
|
@@ -24,6 +24,6 @@ const ConditionalStyleSettingsWizardSettings = (props) => {
|
|
|
24
24
|
React.createElement(FormLayout_1.default, null,
|
|
25
25
|
React.createElement(FormLayout_1.FormRow, { label: "Include Grouped Rows:" },
|
|
26
26
|
React.createElement(rebass_1.Flex, { alignItems: "center", marginLeft: 2 },
|
|
27
|
-
React.createElement(CheckBox_1.CheckBox, { checked: data.IncludeGroupedRows, onChange: onIncludeGroupedRowsChanged, mr: 2 }))))))));
|
|
27
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "inlcude-grouped-rows", checked: data.IncludeGroupedRows, onChange: onIncludeGroupedRowsChanged, mr: 2 }))))))));
|
|
28
28
|
};
|
|
29
29
|
exports.ConditionalStyleSettingsWizardSettings = ConditionalStyleSettingsWizardSettings;
|
|
@@ -14,6 +14,6 @@ const DataSetSelector = ({ data }) => {
|
|
|
14
14
|
const handleToggle = React.useCallback(() => {
|
|
15
15
|
adaptable.api.dataSetApi.setDataSet(data.name);
|
|
16
16
|
}, [isSelected]);
|
|
17
|
-
return React.createElement(Radio_1.default, {
|
|
17
|
+
return (React.createElement(Radio_1.default, { "data-name": "select-dataset-button", "data-value": data.name, disabled: isDisabled, checked: isSelected, onClick: handleToggle }));
|
|
18
18
|
};
|
|
19
19
|
exports.DataSetSelector = DataSetSelector;
|
|
@@ -32,7 +32,7 @@ const ReportExportDropdown = (props) => {
|
|
|
32
32
|
if ((report === null || report === void 0 ? void 0 : report.Name) === GeneralConstants_1.VISUAL_DATA_REPORT) {
|
|
33
33
|
destinationItems.forEach((item) => (item.disabled = item.label === Enums_1.ExportDestination.Excel ? false : true));
|
|
34
34
|
}
|
|
35
|
-
return (React.createElement(DropdownButton_1.default, { columns: ['label'], tooltip: "Export Report", variant: "text", items: destinationItems },
|
|
35
|
+
return (React.createElement(DropdownButton_1.default, { "data-name": "export-dropdown", columns: ['label'], tooltip: "Export Report", variant: "text", items: destinationItems },
|
|
36
36
|
React.createElement(icons_1.Icon, { name: "export" })));
|
|
37
37
|
};
|
|
38
38
|
exports.ReportExportDropdown = ReportExportDropdown;
|
|
@@ -33,16 +33,15 @@ const ReportNameWizardSection = (props) => {
|
|
|
33
33
|
const { api, data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
|
|
34
34
|
const validCheck = (0, exports.isValidReportName)(data, api);
|
|
35
35
|
const ErrorMessage = validCheck === true ? null : validCheck;
|
|
36
|
-
return (React.createElement(
|
|
37
|
-
React.createElement(
|
|
38
|
-
React.createElement(FormLayout_1.
|
|
39
|
-
React.createElement(
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
React.createElement(
|
|
45
|
-
|
|
46
|
-
ErrorMessage ? React.createElement(ErrorBox_1.default, null, ErrorMessage) : null)))));
|
|
36
|
+
return (React.createElement(rebass_1.Box, null,
|
|
37
|
+
React.createElement(FormLayout_1.default, { columns: [1, 2] },
|
|
38
|
+
React.createElement(FormLayout_1.FormRow, null,
|
|
39
|
+
React.createElement(rebass_1.Text, { marginRight: 2 }, "Name:"),
|
|
40
|
+
React.createElement(Input_1.default, { "data-name": "export-name", width: "100%", type: "text", autoFocus: true, placeholder: "Name", value: data.Name, onChange: (e) => {
|
|
41
|
+
props.onChange(Object.assign(Object.assign({}, data), { Name: e.target.value }));
|
|
42
|
+
} })),
|
|
43
|
+
React.createElement(FormLayout_1.FormRow, null,
|
|
44
|
+
React.createElement(React.Fragment, null),
|
|
45
|
+
ErrorMessage ? React.createElement(ErrorBox_1.default, null, ErrorMessage) : null))));
|
|
47
46
|
};
|
|
48
47
|
exports.ReportNameWizardSection = ReportNameWizardSection;
|
|
@@ -8,13 +8,13 @@ const StylePreview_1 = require("../../components/StylePreview");
|
|
|
8
8
|
const FlashingCellStyle = (props) => {
|
|
9
9
|
const { data } = props, boxProps = tslib_1.__rest(props, ["data"]);
|
|
10
10
|
return (react_1.default.createElement(rebass_1.Flex, Object.assign({ flexDirection: "row" }, boxProps),
|
|
11
|
-
react_1.default.createElement(StylePreview_1.StylePreview, { mr: 1, flex: 1, styleObject: props.data.UpChangeStyle },
|
|
11
|
+
react_1.default.createElement(StylePreview_1.StylePreview, { "data-value": "up-style", mr: 1, flex: 1, styleObject: props.data.UpChangeStyle },
|
|
12
12
|
"Up ",
|
|
13
13
|
!props.data.UpChangeStyle ? ' - no style' : ''),
|
|
14
|
-
react_1.default.createElement(StylePreview_1.StylePreview, { mr: 1, flex: 1, styleObject: props.data.DownChangeStyle },
|
|
14
|
+
react_1.default.createElement(StylePreview_1.StylePreview, { "data-value": "down-style", mr: 1, flex: 1, styleObject: props.data.DownChangeStyle },
|
|
15
15
|
"Down",
|
|
16
16
|
!props.data.DownChangeStyle ? ' - no style' : ''),
|
|
17
|
-
react_1.default.createElement(StylePreview_1.StylePreview, { flex: 1, styleObject: props.data.NeutralChangeStyle },
|
|
17
|
+
react_1.default.createElement(StylePreview_1.StylePreview, { "data-value": "neutral-style", flex: 1, styleObject: props.data.NeutralChangeStyle },
|
|
18
18
|
"Neutral ",
|
|
19
19
|
!props.data.NeutralChangeStyle ? ' - no style' : '')));
|
|
20
20
|
};
|
|
@@ -64,23 +64,23 @@ const FlashingAlertSettingsWizardSection = (props) => {
|
|
|
64
64
|
React.createElement(Tabs_1.Tabs.Content, null,
|
|
65
65
|
React.createElement(FormLayout_1.default, null,
|
|
66
66
|
React.createElement(FormLayout_1.FormRow, { label: "Duration Type" },
|
|
67
|
-
React.createElement(Radio_1.default, { mr: 3, checked: duration == 'always', tabIndex: -1, onChange: () => handleTypeChange('always') }, "Always"),
|
|
68
|
-
React.createElement(Radio_1.default, { checked: duration !== 'always', tabIndex: -1, onChange: () => handleTypeChange('number') }, "Limited (ms)")),
|
|
67
|
+
React.createElement(Radio_1.default, { "data-name": "duration-type-always", mr: 3, checked: duration == 'always', tabIndex: -1, onChange: () => handleTypeChange('always') }, "Always"),
|
|
68
|
+
React.createElement(Radio_1.default, { "data-name": "duration-type-number", checked: duration !== 'always', tabIndex: -1, onChange: () => handleTypeChange('number') }, "Limited (ms)")),
|
|
69
69
|
React.createElement(FormLayout_1.FormRow, { label: "" },
|
|
70
70
|
duration !== 'always' && (React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "baseline" },
|
|
71
71
|
React.createElement(rebass_1.Text, { fontSize: 2, mr: 2 }, "After"),
|
|
72
|
-
React.createElement(Input_1.default, { readOnly: props.readOnly, type: "text", name: "value", ref: inputRef, mt: 2, mr: 1, value: duration, onChange: (event) => {
|
|
72
|
+
React.createElement(Input_1.default, { "data-name": "duration-input", readOnly: props.readOnly, type: "text", name: "value", ref: inputRef, mt: 2, mr: 1, value: duration, onChange: (event) => {
|
|
73
73
|
const value = event.target.value;
|
|
74
74
|
setDuration(isNaN(Number(value)) ? 500 : Number(value));
|
|
75
75
|
} }),
|
|
76
76
|
React.createElement(rebass_1.Text, { fontSize: 2 }, "milliseconds"))),
|
|
77
77
|
duration === 'always' && (React.createElement(rebass_1.Text, { height: 43, fontSize: 3 }, "Persists the flashing style indeterminately - can be removed manually"))),
|
|
78
78
|
React.createElement(FormLayout_1.FormRow, { label: "Flash Target" },
|
|
79
|
-
React.createElement(CheckBox_1.CheckBox, { onChange: (checked) => handleTargetChange('cell', checked), mr: 3, checked: (flashingCell === null || flashingCell === void 0 ? void 0 : flashingCell.FlashTarget) === 'cell' ||
|
|
79
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "flashing-target", onChange: (checked) => handleTargetChange('cell', checked), mr: 3, checked: (flashingCell === null || flashingCell === void 0 ? void 0 : flashingCell.FlashTarget) === 'cell' ||
|
|
80
80
|
((_c = (_b = flashingCell === null || flashingCell === void 0 ? void 0 : flashingCell.FlashTarget) === null || _b === void 0 ? void 0 : _b.includes) === null || _c === void 0 ? void 0 : _c.call(_b, 'cell')), tabIndex: -1 }, "Cell"),
|
|
81
|
-
React.createElement(CheckBox_1.CheckBox, { mr: 3, onChange: (checked) => handleTargetChange('row', checked), checked: (flashingCell === null || flashingCell === void 0 ? void 0 : flashingCell.FlashTarget) === 'row' ||
|
|
81
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "flashing-target-row", mr: 3, onChange: (checked) => handleTargetChange('row', checked), checked: (flashingCell === null || flashingCell === void 0 ? void 0 : flashingCell.FlashTarget) === 'row' ||
|
|
82
82
|
((_e = (_d = flashingCell === null || flashingCell === void 0 ? void 0 : flashingCell.FlashTarget) === null || _d === void 0 ? void 0 : _d.includes) === null || _e === void 0 ? void 0 : _e.call(_d, 'row')), tabIndex: -1 }, "Row"),
|
|
83
|
-
React.createElement(CheckBox_1.CheckBox, { onChange: (checked) => handleTargetChange('aggFuncCell', checked), checked: (flashingCell === null || flashingCell === void 0 ? void 0 : flashingCell.FlashTarget) === 'aggFuncCell' ||
|
|
83
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "flashing-target-aggFuncCell", onChange: (checked) => handleTargetChange('aggFuncCell', checked), checked: (flashingCell === null || flashingCell === void 0 ? void 0 : flashingCell.FlashTarget) === 'aggFuncCell' ||
|
|
84
84
|
((_g = (_f = flashingCell === null || flashingCell === void 0 ? void 0 : flashingCell.FlashTarget) === null || _f === void 0 ? void 0 : _f.includes) === null || _g === void 0 ? void 0 : _g.call(_f, 'aggFuncCell')), tabIndex: -1 }, "Aggregated Function Cell")))))));
|
|
85
85
|
};
|
|
86
86
|
exports.FlashingAlertSettingsWizardSection = FlashingAlertSettingsWizardSection;
|
|
@@ -44,9 +44,6 @@ const FlashingCellWizard = (props) => {
|
|
|
44
44
|
UpChangeStyle: (0, react_1.useCallback)(updateProperty('UpChangeStyle'), []),
|
|
45
45
|
NeutralChangeStyle: (0, react_1.useCallback)(updateProperty('NeutralChangeStyle'), []),
|
|
46
46
|
};
|
|
47
|
-
const flashStyleComponent = (React.createElement(FlashingCellStyleWizardSection_1.FlashingAlertStyleWizardSection, { onStyleChange: (styleName, style) => {
|
|
48
|
-
updateStyles[styleName](style);
|
|
49
|
-
} }));
|
|
50
47
|
const dispatch = (0, react_redux_1.useDispatch)();
|
|
51
48
|
const handleFinish = () => {
|
|
52
49
|
if (props.data) {
|
|
@@ -81,7 +78,10 @@ const FlashingCellWizard = (props) => {
|
|
|
81
78
|
},
|
|
82
79
|
{
|
|
83
80
|
details: 'Choose the Flashing Styles',
|
|
84
|
-
render: () => React.createElement(rebass_1.Box, { padding: 2 },
|
|
81
|
+
render: () => (React.createElement(rebass_1.Box, { padding: 2 },
|
|
82
|
+
React.createElement(FlashingCellStyleWizardSection_1.FlashingAlertStyleWizardSection, { onStyleChange: (styleName, style) => {
|
|
83
|
+
updateStyles[styleName](style);
|
|
84
|
+
} }))),
|
|
85
85
|
renderSummary: FlashingCellStyleWizardSection_1.renderFlashingAlertStyleSummary,
|
|
86
86
|
title: 'Flash Styles',
|
|
87
87
|
},
|
|
@@ -35,7 +35,7 @@ class FormatColumnSummaryComponent extends React.Component {
|
|
|
35
35
|
this.state = UIHelper_1.UIHelper.getEmptyConfigState();
|
|
36
36
|
}
|
|
37
37
|
render() {
|
|
38
|
-
|
|
38
|
+
const [formatColumn] = this.props.api.formatColumnApi.getFormatColumnsForColumn(this.props.summarisedColumn);
|
|
39
39
|
let noFormatColumn = formatColumn == null;
|
|
40
40
|
let formatColumnRow;
|
|
41
41
|
if (noFormatColumn) {
|
|
@@ -100,7 +100,7 @@ exports.getFormatColumnFormatSummaryValue = getFormatColumnFormatSummaryValue;
|
|
|
100
100
|
const renderCustomFormatter = (data, customFormatter, setFormatOption) => {
|
|
101
101
|
var _a, _b, _c;
|
|
102
102
|
return (React.createElement(FormLayout_1.FormRow, { key: customFormatter.id, label: (_a = customFormatter.label) !== null && _a !== void 0 ? _a : customFormatter.id },
|
|
103
|
-
React.createElement(CheckBox_1.CheckBox, { checked: (_c = (_b = data.DisplayFormat.Options.CustomDisplayFormats) === null || _b === void 0 ? void 0 : _b.some) === null || _c === void 0 ? void 0 : _c.call(_b, (item) => item === customFormatter.id), onChange: (checked) => {
|
|
103
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": customFormatter.id, checked: (_c = (_b = data.DisplayFormat.Options.CustomDisplayFormats) === null || _b === void 0 ? void 0 : _b.some) === null || _c === void 0 ? void 0 : _c.call(_b, (item) => item === customFormatter.id), onChange: (checked) => {
|
|
104
104
|
var _a, _b, _c;
|
|
105
105
|
let newCustomFormats = (_c = (_b = (_a = data === null || data === void 0 ? void 0 : data.DisplayFormat) === null || _a === void 0 ? void 0 : _a.Options) === null || _b === void 0 ? void 0 : _b.CustomDisplayFormats) !== null && _c !== void 0 ? _c : [];
|
|
106
106
|
if (checked) {
|
|
@@ -150,7 +150,7 @@ const getFormatDisplayTypeForScope = (scope, api) => {
|
|
|
150
150
|
return undefined;
|
|
151
151
|
};
|
|
152
152
|
exports.getFormatDisplayTypeForScope = getFormatDisplayTypeForScope;
|
|
153
|
-
const renderDateFormat = (data, _onChange, setFormatOption, scopedCustomFormatters
|
|
153
|
+
const renderDateFormat = (data, _onChange, setFormatOption, scopedCustomFormatters) => {
|
|
154
154
|
if (data.DisplayFormat.Formatter !== 'DateFormatter') {
|
|
155
155
|
return null;
|
|
156
156
|
}
|
|
@@ -165,7 +165,7 @@ const renderDateFormat = (data, _onChange, setFormatOption, scopedCustomFormatte
|
|
|
165
165
|
")."),
|
|
166
166
|
React.createElement(FormLayout_1.default, null,
|
|
167
167
|
React.createElement(FormLayout_1.FormRow, { label: "Pattern" },
|
|
168
|
-
React.createElement(Input_1.default, { value: data.DisplayFormat.Options.Pattern, onChange: (e) => setFormatOption('Pattern', e.currentTarget.value), mr: 2 }),
|
|
168
|
+
React.createElement(Input_1.default, { "data-name": "patern", value: data.DisplayFormat.Options.Pattern, onChange: (e) => setFormatOption('Pattern', e.currentTarget.value), mr: 2 }),
|
|
169
169
|
React.createElement("span", null, FormatHelper_1.default.DateFormatter(new Date(), data.DisplayFormat.Options)))))),
|
|
170
170
|
scopedCustomFormatters.length > 0 && (React.createElement(Tabs_1.Tabs, { marginTop: 2, keyboardNavigation: false },
|
|
171
171
|
React.createElement(Tabs_1.Tabs.Tab, null, "Custom Formats"),
|
|
@@ -186,7 +186,7 @@ const renderDateFormat = (data, _onChange, setFormatOption, scopedCustomFormatte
|
|
|
186
186
|
Size: 1,
|
|
187
187
|
},
|
|
188
188
|
{
|
|
189
|
-
Content: (React.createElement(SimpleButton_1.default, { onClick: () => setFormatOption('Pattern', Pattern) }, "Apply")),
|
|
189
|
+
Content: (React.createElement(SimpleButton_1.default, { "data-name": "apply-format-pattern", "data-value": Pattern, onClick: () => setFormatOption('Pattern', Pattern) }, "Apply")),
|
|
190
190
|
Size: 1,
|
|
191
191
|
},
|
|
192
192
|
] })))))));
|
|
@@ -250,16 +250,16 @@ const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatt
|
|
|
250
250
|
React.createElement(rebass_1.Flex, { flexDirection: "row" },
|
|
251
251
|
React.createElement(FormLayout_1.default, { mr: 3 },
|
|
252
252
|
React.createElement(FormLayout_1.FormRow, { label: "Fraction Separator" },
|
|
253
|
-
React.createElement(Input_1.default, { value: data.DisplayFormat.Options.FractionSeparator, onChange: (e) => setFormatOption('FractionSeparator', e.currentTarget.value) })),
|
|
253
|
+
React.createElement(Input_1.default, { "data-name": "fraction-separator", value: data.DisplayFormat.Options.FractionSeparator, onChange: (e) => setFormatOption('FractionSeparator', e.currentTarget.value) })),
|
|
254
254
|
React.createElement(FormLayout_1.FormRow, { label: "Integer Separator" },
|
|
255
|
-
React.createElement(Input_1.default, { value: data.DisplayFormat.Options.IntegerSeparator, onChange: (e) => setFormatOption('IntegerSeparator', e.currentTarget.value) })),
|
|
255
|
+
React.createElement(Input_1.default, { "data-name": "integer-separator", value: data.DisplayFormat.Options.IntegerSeparator, onChange: (e) => setFormatOption('IntegerSeparator', e.currentTarget.value) })),
|
|
256
256
|
React.createElement(FormLayout_1.FormRow, { label: "Prefix" },
|
|
257
|
-
React.createElement(Input_1.default, { value: data.DisplayFormat.Options.Prefix, onChange: (e) => setFormatOption('Prefix', e.currentTarget.value) })),
|
|
257
|
+
React.createElement(Input_1.default, { "data-name": "prefix", value: data.DisplayFormat.Options.Prefix, onChange: (e) => setFormatOption('Prefix', e.currentTarget.value) })),
|
|
258
258
|
React.createElement(FormLayout_1.FormRow, { label: "Suffix" },
|
|
259
|
-
React.createElement(Input_1.default, { value: data.DisplayFormat.Options.Suffix, onChange: (e) => setFormatOption('Suffix', e.currentTarget.value) }))),
|
|
259
|
+
React.createElement(Input_1.default, { "data-name": "suffix", value: data.DisplayFormat.Options.Suffix, onChange: (e) => setFormatOption('Suffix', e.currentTarget.value) }))),
|
|
260
260
|
React.createElement(FormLayout_1.default, null,
|
|
261
261
|
React.createElement(FormLayout_1.FormRow, { label: "Fraction Digits" },
|
|
262
|
-
React.createElement(Input_1.default, { type: "number", min: "0",
|
|
262
|
+
React.createElement(Input_1.default, { "data-name": "fraction-digits", type: "number", min: "0",
|
|
263
263
|
// max="20"
|
|
264
264
|
value: typeof data.DisplayFormat.Options.FractionDigits === 'number'
|
|
265
265
|
? data.DisplayFormat.Options.FractionDigits
|
|
@@ -267,13 +267,13 @@ const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatt
|
|
|
267
267
|
? (0, clamp_1.default)(Number(e.currentTarget.value), 0, 20)
|
|
268
268
|
: undefined) })),
|
|
269
269
|
React.createElement(FormLayout_1.FormRow, { label: "Integer Digits" },
|
|
270
|
-
React.createElement(Input_1.default, { type: "number", min: "0", value: data.DisplayFormat.Options.IntegerDigits, onChange: (e) => setFormatOption('IntegerDigits', Number(e.currentTarget.value)) })),
|
|
270
|
+
React.createElement(Input_1.default, { "data-name": "integer-digits", type: "number", min: "0", value: data.DisplayFormat.Options.IntegerDigits, onChange: (e) => setFormatOption('IntegerDigits', Number(e.currentTarget.value)) })),
|
|
271
271
|
React.createElement(FormLayout_1.FormRow, { label: "Multiplier" },
|
|
272
|
-
React.createElement(Input_1.default, { type: "number", value: data.DisplayFormat.Options.Multiplier, onChange: (e) => setFormatOption('Multiplier', Number(e.currentTarget.value)) })),
|
|
272
|
+
React.createElement(Input_1.default, { "data-name": "multiplier", type: "number", value: data.DisplayFormat.Options.Multiplier, onChange: (e) => setFormatOption('Multiplier', Number(e.currentTarget.value)) })),
|
|
273
273
|
React.createElement(FormLayout_1.FormRow, { label: "Parentheses" },
|
|
274
|
-
React.createElement(CheckBox_1.CheckBox, { checked: data.DisplayFormat.Options.Parentheses, onChange: (checked) => setFormatOption('Parentheses', checked) })),
|
|
274
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "parentheses-checkbox", checked: data.DisplayFormat.Options.Parentheses, onChange: (checked) => setFormatOption('Parentheses', checked) })),
|
|
275
275
|
React.createElement(FormLayout_1.FormRow, { label: "Truncate" },
|
|
276
|
-
React.createElement(CheckBox_1.CheckBox, { checked: data.DisplayFormat.Options.Truncate, onChange: (checked) => setFormatOption('Truncate', checked) })))))),
|
|
276
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "truncate-checkbox", checked: data.DisplayFormat.Options.Truncate, onChange: (checked) => setFormatOption('Truncate', checked) })))))),
|
|
277
277
|
scopedCustomFormatters.length > 0 && (React.createElement(Tabs_1.Tabs, { marginTop: 2, keyboardNavigation: false },
|
|
278
278
|
React.createElement(Tabs_1.Tabs.Tab, null, "Custom Formats"),
|
|
279
279
|
React.createElement(Tabs_1.Tabs.Content, null,
|
|
@@ -286,11 +286,11 @@ const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatt
|
|
|
286
286
|
React.createElement(rebass_1.Flex, { flexDirection: "row" },
|
|
287
287
|
React.createElement(FormLayout_1.default, { margin: 2 },
|
|
288
288
|
React.createElement(FormLayout_1.FormRow, { label: "Show As:" },
|
|
289
|
-
React.createElement(Radio_1.default, { marginLeft: 2, checked: IS_PERCENT, onChange: () => setPercentPreset() }, "Percentage"),
|
|
290
|
-
React.createElement(Radio_1.default, { marginLeft: 3, checked: IS_THOUSAND, onChange: () => setDivideThousandPreset() }, "K (Thousand)"),
|
|
291
|
-
React.createElement(Radio_1.default, { marginLeft: 3, checked: IS_MILLION, onChange: () => setDivideMillionPreset() }, "M (Million)"),
|
|
292
|
-
React.createElement(Radio_1.default, { marginLeft: 3, checked: IS_DOLLAR, onChange: () => setDollarPreset() }, "Dollar"),
|
|
293
|
-
React.createElement(Radio_1.default, { marginLeft: 3, checked: IS_STERLING, onChange: () => setSterlingPreset() }, "Sterling")))))),
|
|
289
|
+
React.createElement(Radio_1.default, { "data-name": "preset-percentage", marginLeft: 2, checked: IS_PERCENT, onChange: () => setPercentPreset() }, "Percentage"),
|
|
290
|
+
React.createElement(Radio_1.default, { "data-name": "preset-thousand", marginLeft: 3, checked: IS_THOUSAND, onChange: () => setDivideThousandPreset() }, "K (Thousand)"),
|
|
291
|
+
React.createElement(Radio_1.default, { "data-name": "preset-million", marginLeft: 3, checked: IS_MILLION, onChange: () => setDivideMillionPreset() }, "M (Million)"),
|
|
292
|
+
React.createElement(Radio_1.default, { "data-name": "preset-dollar", marginLeft: 3, checked: IS_DOLLAR, onChange: () => setDollarPreset() }, "Dollar"),
|
|
293
|
+
React.createElement(Radio_1.default, { "data-name": "preset-sterling", marginLeft: 3, checked: IS_STERLING, onChange: () => setSterlingPreset() }, "Sterling")))))),
|
|
294
294
|
React.createElement(Tabs_1.Tabs, { marginTop: 2, autoFocus: false, keyboardNavigation: false },
|
|
295
295
|
React.createElement(Tabs_1.Tabs.Tab, null, "Examples"),
|
|
296
296
|
React.createElement(Tabs_1.Tabs.Content, null,
|
|
@@ -331,15 +331,15 @@ const renderStringFormat = (data, _onChange, setFormatOption, scopedCustomFormat
|
|
|
331
331
|
React.createElement(rebass_1.Flex, { flexDirection: "column" },
|
|
332
332
|
React.createElement(FormLayout_1.default, { mr: 3 },
|
|
333
333
|
React.createElement(FormLayout_1.FormRow, { label: "Case: " },
|
|
334
|
-
React.createElement(Radio_1.default, { checked: data.DisplayFormat.Options.Case == 'Lower', onChange: (checked) => setFormatOption('Case', 'Lower') }, "Lower"),
|
|
335
|
-
React.createElement(Radio_1.default, { marginLeft: 2, checked: data.DisplayFormat.Options.Case == 'Upper', onChange: (checked) => setFormatOption('Case', 'Upper') }, "Upper"),
|
|
336
|
-
React.createElement(Radio_1.default, { marginLeft: 2, checked: data.DisplayFormat.Options.Case == 'Sentence', onChange: (checked) => setFormatOption('Case', 'Sentence') }, "Sentence"),
|
|
337
|
-
React.createElement(Radio_1.default, { marginLeft: 2, checked: data.DisplayFormat.Options.Case == undefined, onChange: (checked) => setFormatOption('Case', undefined) }, "None"),
|
|
338
|
-
React.createElement(CheckBox_1.CheckBox, { marginLeft: 5, checked: data.DisplayFormat.Options.Trim, onChange: (checked) => setFormatOption('Trim', checked) }, "Trim")),
|
|
334
|
+
React.createElement(Radio_1.default, { "data-name": "case-lower", checked: data.DisplayFormat.Options.Case == 'Lower', onChange: (checked) => setFormatOption('Case', 'Lower') }, "Lower"),
|
|
335
|
+
React.createElement(Radio_1.default, { "data-name": "case-upper", marginLeft: 2, checked: data.DisplayFormat.Options.Case == 'Upper', onChange: (checked) => setFormatOption('Case', 'Upper') }, "Upper"),
|
|
336
|
+
React.createElement(Radio_1.default, { "data-name": "case-sentence", marginLeft: 2, checked: data.DisplayFormat.Options.Case == 'Sentence', onChange: (checked) => setFormatOption('Case', 'Sentence') }, "Sentence"),
|
|
337
|
+
React.createElement(Radio_1.default, { "data-name": "case-none", marginLeft: 2, checked: data.DisplayFormat.Options.Case == undefined, onChange: (checked) => setFormatOption('Case', undefined) }, "None"),
|
|
338
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "trim-checkbox", marginLeft: 5, checked: data.DisplayFormat.Options.Trim, onChange: (checked) => setFormatOption('Trim', checked) }, "Trim")),
|
|
339
339
|
React.createElement(FormLayout_1.FormRow, { label: "Prefix" },
|
|
340
|
-
React.createElement(Input_1.default, { value: data.DisplayFormat.Options.Prefix, onChange: (e) => setFormatOption('Prefix', e.currentTarget.value) })),
|
|
340
|
+
React.createElement(Input_1.default, { "data-name": "prefix", value: data.DisplayFormat.Options.Prefix, onChange: (e) => setFormatOption('Prefix', e.currentTarget.value) })),
|
|
341
341
|
React.createElement(FormLayout_1.FormRow, { label: "Suffix" },
|
|
342
|
-
React.createElement(Input_1.default, { value: data.DisplayFormat.Options.Suffix, onChange: (e) => setFormatOption('Suffix', e.currentTarget.value) })))))),
|
|
342
|
+
React.createElement(Input_1.default, { "data-name": "suffix", value: data.DisplayFormat.Options.Suffix, onChange: (e) => setFormatOption('Suffix', e.currentTarget.value) })))))),
|
|
343
343
|
scopedCustomFormatters.length > 0 && (React.createElement(Tabs_1.Tabs, { marginTop: 2, keyboardNavigation: false },
|
|
344
344
|
React.createElement(Tabs_1.Tabs.Tab, null, "Custom Formats"),
|
|
345
345
|
React.createElement(Tabs_1.Tabs.Content, null,
|
|
@@ -383,7 +383,7 @@ const FormatColumnFormatWizardSection = (props) => {
|
|
|
383
383
|
return renderNumberFormat(data, update, setFormatOption, customScopedFormatters, formatColumnApi);
|
|
384
384
|
}
|
|
385
385
|
if (Type === 'DateFormatter') {
|
|
386
|
-
return renderDateFormat(data, update, setFormatOption, customScopedFormatters
|
|
386
|
+
return renderDateFormat(data, update, setFormatOption, customScopedFormatters);
|
|
387
387
|
}
|
|
388
388
|
if (Type === 'StringFormatter') {
|
|
389
389
|
return renderStringFormat(data, update, setFormatOption, customScopedFormatters, formatColumnApi);
|
|
@@ -40,12 +40,8 @@ const FormatColumnSettingsWizardSection = (props) => {
|
|
|
40
40
|
React.createElement(rebass_1.Flex, { flexDirection: "row" },
|
|
41
41
|
React.createElement(FormLayout_1.default, null,
|
|
42
42
|
React.createElement(FormLayout_1.FormRow, { label: "Cell Alignment" },
|
|
43
|
-
React.createElement(DropdownButton_1.default, { style: {
|
|
43
|
+
React.createElement(DropdownButton_1.default, { "data-name": "cell-alignment-dropdown", style: {
|
|
44
44
|
minWidth: '15rem',
|
|
45
|
-
whiteSpace: 'nowrap',
|
|
46
|
-
overflow: 'hidden',
|
|
47
|
-
textOverflow: 'ellipsis',
|
|
48
|
-
maxWidth: 'inherit',
|
|
49
45
|
}, placeholder: "Select Option", showClearButton: !!data.CellAlignment, onClear: () => onCellAlignmentSelectChanged(null), items: alignmentOptions.map((item) => ({
|
|
50
46
|
value: item.value,
|
|
51
47
|
label: item.label,
|
|
@@ -53,6 +49,6 @@ const FormatColumnSettingsWizardSection = (props) => {
|
|
|
53
49
|
})), columns: ['label'] }, data.CellAlignment ? data.CellAlignment : 'Select Option')),
|
|
54
50
|
React.createElement(FormLayout_1.FormRow, { label: "Include Grouped Rows:" },
|
|
55
51
|
React.createElement(rebass_1.Flex, { alignItems: "center", marginLeft: 2 },
|
|
56
|
-
React.createElement(CheckBox_1.CheckBox, { checked: data.IncludeGroupedRows, onChange: onIncludeGroupedRowsChanged, mr: 2 }))))))));
|
|
52
|
+
React.createElement(CheckBox_1.CheckBox, { "data-name": "include-grouped-rows-checkbox", checked: data.IncludeGroupedRows, onChange: onIncludeGroupedRowsChanged, mr: 2 }))))))));
|
|
57
53
|
};
|
|
58
54
|
exports.FormatColumnSettingsWizardSection = FormatColumnSettingsWizardSection;
|
|
@@ -28,7 +28,7 @@ const renderFormatColumnStyleWizardSummary = (data) => {
|
|
|
28
28
|
};
|
|
29
29
|
exports.renderFormatColumnStyleWizardSummary = renderFormatColumnStyleWizardSummary;
|
|
30
30
|
const renderFormatColumnStyleSummary = (data, api) => {
|
|
31
|
-
return (React.createElement(rebass_1.Text, { padding: 2, style: toStyle(data.Style) }, "Preview result"));
|
|
31
|
+
return (React.createElement(rebass_1.Text, { className: "ab-FormatPreview", padding: 2, style: toStyle(data.Style) }, "Preview result"));
|
|
32
32
|
};
|
|
33
33
|
exports.renderFormatColumnStyleSummary = renderFormatColumnStyleSummary;
|
|
34
34
|
function FormatColumnStyleWizardSection(props) {
|
|
@@ -106,15 +106,15 @@ const FreeTextColumnSettingsWizardSection = (props) => {
|
|
|
106
106
|
return (React.createElement(React.Fragment, null,
|
|
107
107
|
React.createElement(FormLayout_1.default, null,
|
|
108
108
|
React.createElement(FormLayout_1.FormRow, { label: "ColumnId" },
|
|
109
|
-
React.createElement(Input_1.default, { autoFocus: !inEdit, value: data.ColumnId || '', style: { width: '100%', maxWidth: 500 }, disabled: inEdit, type: "text", placeholder: "Enter an id", onChange: (e) => handleColumnIdChange(e) })),
|
|
109
|
+
React.createElement(Input_1.default, { "data-name": "column-id", autoFocus: !inEdit, value: data.ColumnId || '', style: { width: '100%', maxWidth: 500 }, disabled: inEdit, type: "text", placeholder: "Enter an id", onChange: (e) => handleColumnIdChange(e) })),
|
|
110
110
|
React.createElement(FormLayout_1.FormRow, { label: "Column Name" },
|
|
111
|
-
React.createElement(Input_1.default, { autoFocus: inEdit, onFocus: () => {
|
|
111
|
+
React.createElement(Input_1.default, { "data-name": "column-name", autoFocus: inEdit, onFocus: () => {
|
|
112
112
|
setColumnNameFocused(true);
|
|
113
113
|
}, onBlur: () => {
|
|
114
114
|
setColumnNameFocused(false);
|
|
115
115
|
}, value: ColumnNameFocused ? data.FriendlyName || '' : data.FriendlyName || data.ColumnId || '', style: { width: '100%', maxWidth: 500 }, type: "text", placeholder: "Enter a name", onChange: (e) => handleColumnNameChange(e) })),
|
|
116
116
|
React.createElement(FormLayout_1.FormRow, { label: "Type" },
|
|
117
|
-
React.createElement(DropdownButton_1.default, { style: {
|
|
117
|
+
React.createElement(DropdownButton_1.default, { "data-name": "column-type-dropdown", style: {
|
|
118
118
|
width: '300px',
|
|
119
119
|
whiteSpace: 'normal',
|
|
120
120
|
overflow: 'hidden',
|
|
@@ -124,9 +124,9 @@ const FreeTextColumnSettingsWizardSection = (props) => {
|
|
|
124
124
|
label: item.label,
|
|
125
125
|
onClick: () => handleDataTypeChange(item.value),
|
|
126
126
|
})) }, data.DataType ? data.DataType : 'Select Data Type')),
|
|
127
|
-
React.createElement(FormLayout_1.FormRow, { label: "Default Value" }, data.DataType === 'Boolean' ? (React.createElement(CheckBox_1.CheckBox, { checked: !!data.DefaultValue, onChange: (DefaultValue) => {
|
|
127
|
+
React.createElement(FormLayout_1.FormRow, { label: "Default Value" }, data.DataType === 'Boolean' ? (React.createElement(CheckBox_1.CheckBox, { "data-name": "column-default-value-checkbox", checked: !!data.DefaultValue, onChange: (DefaultValue) => {
|
|
128
128
|
props.onChange(Object.assign(Object.assign({}, data), { DefaultValue }));
|
|
129
|
-
} })) : (React.createElement(AdaptableInput_1.default, { value: data.DataType === 'Date' && data.DefaultValue
|
|
129
|
+
} })) : (React.createElement(AdaptableInput_1.default, { "data-name": "column-default-value", value: data.DataType === 'Date' && data.DefaultValue
|
|
130
130
|
? (0, DateHelper_1.parseToISO)(data.DefaultValue, Pattern) || ''
|
|
131
131
|
: data.DefaultValue || '', style: { width: '100%', maxWidth: 500 }, type: data.DataType === 'Number' ? 'number' : data.DataType === 'Date' ? 'date' : 'text', placeholder: "Default Column Value (not required)", onChange: (e) => handleDefaultValueChange(e) }))),
|
|
132
132
|
React.createElement(FormLayout_1.FormRow, { label: "Header Tooltip" },
|
|
@@ -135,8 +135,8 @@ const FreeTextColumnSettingsWizardSection = (props) => {
|
|
|
135
135
|
}) })),
|
|
136
136
|
' ',
|
|
137
137
|
data.DataType == 'String' && (React.createElement(FormLayout_1.FormRow, { label: "Editor Type" },
|
|
138
|
-
React.createElement(Radio_1.default, { value: "Inline", checked: data.TextEditor == 'Inline', onChange: (_, e) => onDynamicSelectChanged(e), marginRight: 2 }, "Inline Editor"),
|
|
139
|
-
React.createElement(Radio_1.default, { value: "Large", checked: data.TextEditor == 'Large', onChange: (_, e) => onDynamicSelectChanged(e) }, "Large Editor")))),
|
|
138
|
+
React.createElement(Radio_1.default, { "data-name": "inline-editor", value: "Inline", checked: data.TextEditor == 'Inline', onChange: (_, e) => onDynamicSelectChanged(e), marginRight: 2 }, "Inline Editor"),
|
|
139
|
+
React.createElement(Radio_1.default, { "data-name": "large-editor", value: "Large", checked: data.TextEditor == 'Large', onChange: (_, e) => onDynamicSelectChanged(e) }, "Large Editor")))),
|
|
140
140
|
ErrorMessage ? (React.createElement(ErrorBox_1.default, { mt: 2, mb: 2 }, ErrorMessage)) : null,
|
|
141
141
|
React.createElement(rebass_1.Box, { mt: 2 },
|
|
142
142
|
React.createElement(SpecialColumnSettingsWizardStep_1.SpecialColumnSettingsWizardStep, { isEditable: true, settings: data.FreeTextColumnSettings, onChange: handleSpecialColumnSettingsChange }))));
|
|
@@ -14,6 +14,6 @@ const LayoutRadioSelector = ({ data }) => {
|
|
|
14
14
|
const handleToggle = React.useCallback(() => {
|
|
15
15
|
adaptable.api.layoutApi.setLayout(data.Name);
|
|
16
16
|
}, [isSelected]);
|
|
17
|
-
return React.createElement(Radio_1.default, {
|
|
17
|
+
return (React.createElement(Radio_1.default, { "data-name": "layout-select-button", "data-value": data.Name, disabled: isDisabled, checked: isSelected, onClick: handleToggle }));
|
|
18
18
|
};
|
|
19
19
|
exports.LayoutRadioSelector = LayoutRadioSelector;
|
|
@@ -19,7 +19,7 @@ const ColumnLabels = (props) => {
|
|
|
19
19
|
const flexProps = {
|
|
20
20
|
[flexDirection === 'row' ? 'alignItems' : 'justifyContent']: 'center',
|
|
21
21
|
};
|
|
22
|
-
return (React.createElement(rebass_1.Flex, Object.assign({ flexDirection: flexDirection }, flexProps, { width: "100%" }),
|
|
22
|
+
return (React.createElement(rebass_1.Flex, Object.assign({ className: "ab-LayoutEditor__Legend", flexDirection: flexDirection }, flexProps, { width: "100%" }),
|
|
23
23
|
showTitle ? (React.createElement(rebass_1.Text, { mr: 2 }, (0, AdaptableContext_1.useAdaptable)().api.internalApi.getCorrectEnglishVariant('Behaviours:'))) : null,
|
|
24
24
|
labels.map((l, index) => {
|
|
25
25
|
const enabled = !!l;
|