mirror of
https://github.com/gristlabs/grist-core.git
synced 2024-10-19 16:52:29 +00:00
ec157dc469
Summary: Adds initial implementation of dark mode. Preferences for dark mode are available on the account settings page. Dark mode is currently a beta feature as there are still some small bugs to squash and a few remaining UI elements to style. Test Plan: Browser tests. Reviewers: jarek Reviewed By: jarek Subscribers: paulfitz, jarek Differential Revision: https://phab.getgrist.com/D3587
54 lines
1.9 KiB
TypeScript
54 lines
1.9 KiB
TypeScript
/**
|
|
* FormulaTransform extends ColumnTransform, creating the transform dom in the field config tab
|
|
* used to transform a column of data using a formula. Allows the user to easily and quickly clean
|
|
* data or change data to a more useful form.
|
|
*/
|
|
|
|
// Client libraries
|
|
import * as AceEditor from 'app/client/components/AceEditor';
|
|
import {ColumnTransform} from 'app/client/components/ColumnTransform';
|
|
import {GristDoc} from 'app/client/components/GristDoc';
|
|
import {cssButtonRow} from 'app/client/ui/RightPanelStyles';
|
|
import {basicButton, primaryButton} from 'app/client/ui2018/buttons';
|
|
import {testId} from 'app/client/ui2018/cssVars';
|
|
import {FieldBuilder} from 'app/client/widgets/FieldBuilder';
|
|
import {dom} from 'grainjs';
|
|
|
|
/**
|
|
* Creates an instance of FormulaTransform for a single field. Extends ColumnTransform.
|
|
*/
|
|
export class FormulaTransform extends ColumnTransform {
|
|
constructor(gristDoc: GristDoc, fieldBuilder: FieldBuilder) {
|
|
super(gristDoc, fieldBuilder);
|
|
}
|
|
|
|
/**
|
|
* Build the transform menu for a formula transform
|
|
*/
|
|
public buildDom() {
|
|
this.editor = this.autoDispose(AceEditor.create({
|
|
gristDoc: this.gristDoc,
|
|
observable: this.transformColumn.formula,
|
|
}));
|
|
return [
|
|
dom('div.transform_menu',
|
|
dom('div.transform_editor',
|
|
this.buildEditorDom(this.getIdentityFormula()),
|
|
testId("formula-transform-top")
|
|
)
|
|
),
|
|
cssButtonRow(
|
|
basicButton(dom.on('click', () => this.cancel()),
|
|
'Cancel', testId("formula-transform-cancel")),
|
|
basicButton(dom.on('click', () => this.editor.writeObservable()),
|
|
'Preview',
|
|
dom.cls('disabled', this.formulaUpToDate),
|
|
{ title: 'Update formula (Shift+Enter)' },
|
|
testId("formula-transform-update")),
|
|
primaryButton(dom.on('click', () => this.execute()),
|
|
'Apply', testId("formula-transform-apply"))
|
|
),
|
|
];
|
|
}
|
|
}
|