@omegagrid/editor 0.10.95 → 0.10.96
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/dist/ui/editors/ruleEditor.d.ts.map +1 -1
- package/dist/ui/editors/ruleEditor.js +31 -43
- package/dist/ui/editors/ruleEditor.js.map +1 -1
- package/dist/ui/editors/themeItemEditor.d.ts +1 -0
- package/dist/ui/editors/themeItemEditor.d.ts.map +1 -1
- package/dist/ui/editors/themeItemEditor.js +9 -2
- package/dist/ui/editors/themeItemEditor.js.map +1 -1
- package/package.json +10 -10
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ruleEditor.d.ts","sourceRoot":"","sources":["../../../src/ui/editors/ruleEditor.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,
|
|
1
|
+
{"version":3,"file":"ruleEditor.d.ts","sourceRoot":"","sources":["../../../src/ui/editors/ruleEditor.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAmE,MAAM,iBAAiB,CAAC;AAErH,OAAO,EAAU,mBAAmB,EAAE,YAAY,EAAU,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAErH,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAIpD,qBACa,UAAW,SAAQ,cAAc;IAE7C,MAAM,CAAC,MAAM,iCAEV;IAGH,MAAM,EAAE,iBAAiB,CAAC;IAG1B,WAAW,EAAE,KAAK,CAAC;IAGnB,cAAc,EAAE,KAAK,CAAC;IAGtB,cAAc,EAAE,mBAAmB,CAAC;IAGpC,cAAc,EAAE,mBAAmB,CAAC;IAGpC,cAAc,EAAE,mBAAmB,CAAC;IAGpC,UAAU,EAAE,mBAAmB,CAAC;IAGhC,QAAQ,EAAE,YAAY,CAAC;IAGvB,SAAS,EAAE,SAAS,CAAC;IAGrB,UAAU,EAAE,UAAU,CAAC,aAAa,CAAC,CAAC;IAGtC,IAAI,EAAE,aAAa,CAAC;IAGpB,IAAI,EAAE,aAAa,CAAC;IAGpB,IAAI,EAAE,aAAa,CAAC;IAEpB,YAAY;IAyCZ,iBAAiB,6CAqBf;IAEF,eAAe,6CAwBb;IAEF,aAAa,6CAgCX;IAEF,gBAAgB,GAAI,KAAK,cAAc,EAAE,OAAO,MAAM,EAAE,MAAM,QAAQ,0CAMpE;IAEF,cAAc,6CA8BZ;IAEF,MAAM,6CAKJ;CACF"}
|
|
@@ -143,55 +143,43 @@ let RuleEditor = class RuleEditor extends OmegaComponent {
|
|
|
143
143
|
if (!this.format)
|
|
144
144
|
return;
|
|
145
145
|
let update = false;
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
this.format.cmax.color = colors.plainHex(this.cmaxColorInput.value);
|
|
170
|
-
}
|
|
171
|
-
if (this.colorInput)
|
|
172
|
-
this.format.color = colors.plainHex(this.colorInput.value);
|
|
173
|
-
else
|
|
174
|
-
this.format.color = null;
|
|
146
|
+
// properties the current form does not show are removed - a null would
|
|
147
|
+
// pollute the serialized theme JSON
|
|
148
|
+
const assign = (key, value) => {
|
|
149
|
+
if (value == null)
|
|
150
|
+
delete this.format[key];
|
|
151
|
+
else
|
|
152
|
+
this.format[key] = value;
|
|
153
|
+
};
|
|
154
|
+
assign('condition', this.conditionInput?.value ?? null);
|
|
155
|
+
assign('style', this.styleForm?.data ?? null);
|
|
156
|
+
let cmin = this.cminColorInput ? { t: 'min', color: colors.plainHex(this.cminColorInput.value) } : null;
|
|
157
|
+
let cmid = this.cmidColorInput ? { color: colors.plainHex(this.cmidColorInput.value) } : null;
|
|
158
|
+
let cmax = this.cmaxColorInput ? { t: 'max', color: colors.plainHex(this.cmaxColorInput.value) } : null;
|
|
159
|
+
if (this.cmin)
|
|
160
|
+
cmin = this.cmin.value;
|
|
161
|
+
if (this.cmid)
|
|
162
|
+
cmid = this.cmid.value;
|
|
163
|
+
if (this.cmax)
|
|
164
|
+
cmax = this.cmax.value;
|
|
165
|
+
assign('cmin', cmin);
|
|
166
|
+
assign('cmid', cmid);
|
|
167
|
+
assign('cmax', cmax);
|
|
168
|
+
assign('color', this.colorInput ? colors.plainHex(this.colorInput.value) : null);
|
|
175
169
|
if (this.iconList) {
|
|
176
170
|
if (this.format.v != this.iconList.value)
|
|
177
171
|
update = true;
|
|
178
|
-
|
|
172
|
+
assign('v', this.iconList.value);
|
|
179
173
|
}
|
|
180
|
-
else
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
else
|
|
185
|
-
this.format.thresh = null;
|
|
186
|
-
if (this.cmin)
|
|
187
|
-
this.format.cmin = this.cmin.value;
|
|
188
|
-
if (this.cmid)
|
|
189
|
-
this.format.cmid = this.cmid.value;
|
|
190
|
-
if (this.cmax)
|
|
191
|
-
this.format.cmax = this.cmax.value;
|
|
174
|
+
else {
|
|
175
|
+
assign('v', null);
|
|
176
|
+
}
|
|
177
|
+
assign('thresh', this.thresholds?.length ? Array.from(this.thresholds).map(t => t.value) : null);
|
|
192
178
|
if (update)
|
|
193
179
|
this.requestUpdate();
|
|
194
|
-
|
|
180
|
+
// explicit args shape - the format object would be taken for the args and
|
|
181
|
+
// its 'type' property (formula/scale/...) would become the EVENT type
|
|
182
|
+
this.dispatchEvent(new events.ChangeEvent({ value: this.format }));
|
|
195
183
|
}
|
|
196
184
|
};
|
|
197
185
|
RuleEditor.styles = [OmegaComponent.styles, css `
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ruleEditor.js","sourceRoot":"","sources":["../../../src/ui/editors/ruleEditor.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property, query, queryAll } from 'lit/decorators.js';\nimport { ConditionalFormat, ConditionalFormatIconType, iconSets } from '@omegagrid/grid';\nimport { css, html } from 'lit';\nimport { colors, DropdownColorPicker, DropdownList, events, Input, MenuItem, OmegaComponent } from '@omegagrid/core';\nimport { msg } from '@omegagrid/localize';\nimport { RuleThreshold, StyleForm } from '../forms';\nimport { map } from 'lit-html/directives/map.js';\nimport { choose } from 'lit-html/directives/choose.js';\n\n@customElement('og-editor-ruleeditor')\nexport class RuleEditor extends OmegaComponent {\n\n\tstatic styles = [OmegaComponent.styles, css`\n\n\t`];\n\n\t@property({type: Object})\n\tformat: ConditionalFormat;\n\n\t@query('og-input#ranges')\n\trangesInput: Input;\n\n\t@query('og-input#condition')\n\tconditionInput: Input;\n\n\t@query('og-dropdown-colorpicker#cminColor')\n\tcminColorInput: DropdownColorPicker;\n\n\t@query('og-dropdown-colorpicker#cmidColor')\n\tcmidColorInput: DropdownColorPicker;\n\n\t@query('og-dropdown-colorpicker#cmaxColor')\n\tcmaxColorInput: DropdownColorPicker;\n\n\t@query('og-dropdown-colorpicker#color')\n\tcolorInput: DropdownColorPicker;\n\n\t@query('og-dropdown-list#icons')\n\ticonList: DropdownList;\n\n\t@query('og-editor-styleeditor#style')\n\tstyleForm: StyleForm;\n\n\t@queryAll('og-editor-rule-threshold.threshold')\n\tthresholds: NodeListOf<RuleThreshold>;\n\n\t@query('og-editor-rule-threshold#cmin')\n\tcmin: RuleThreshold;\n\n\t@query('og-editor-rule-threshold#cmid')\n\tcmid: RuleThreshold;\n\n\t@query('og-editor-rule-threshold#cmax')\n\tcmax: RuleThreshold;\n\n\tupdateFormat() {\n\t\tif (!this.format) return;\n\t\tlet update = false;\n\n\t\tthis.format.cmin = null\n\t\tthis.format.cmid = null\n\t\tthis.format.cmax = null\n\n\t\tif (this.conditionInput) this.format.condition = this.conditionInput.value;\n\t\telse this.format.condition = null;\n\n\t\tif (this.styleForm) this.format.style = this.styleForm.data;\n\t\telse this.format.style = null;\n\n\t\tif (this.cminColorInput) {\n\t\t\tthis.format.cmin = this.format.cmin ?? {};\n\t\t\tthis.format.cmin.t = 'min';\n\t\t\tthis.format.cmin.color = colors.plainHex(this.cminColorInput.value);\n\t\t}\n\n\t\tif (this.cmidColorInput) {\n\t\t\tthis.format.cmid = this.format.cmid ?? {};\n\t\t\tthis.format.cmid.color = colors.plainHex(this.cmidColorInput.value);\n\t\t}\n\n\t\tif (this.cmaxColorInput) {\n\t\t\tthis.format.cmax = this.format.cmax ?? {};\n\t\t\tthis.format.cmax.t = 'max';\n\t\t\tthis.format.cmax.color = colors.plainHex(this.cmaxColorInput.value);\n\t\t}\n\n\t\tif (this.colorInput) this.format.color = colors.plainHex(this.colorInput.value);\n\t\telse this.format.color = null;\n\n\t\tif (this.iconList) {\n\t\t\tif (this.format.v != this.iconList.value) update = true;\n\t\t\tthis.format.v = this.iconList.value;\n\t\t} else this.format.v = null;\n\n\t\tif (this.thresholds) this.format.thresh = Array.from(this.thresholds).map(t => t.value);\n\t\telse this.format.thresh = null;\n\n\t\tif (this.cmin) this.format.cmin = this.cmin.value;\n\t\tif (this.cmid) this.format.cmid = this.cmid.value;\n\t\tif (this.cmax) this.format.cmax = this.cmax.value;\n\n\t\tif (update) this.requestUpdate();\n\t\tthis.dispatchEvent(new events.ChangeEvent(this.format));\n\t}\n\n\trenderFormulaForm = () => html`\n\t\t<div class=\"row\">${msg('Condition')}</div>\n\n\t\t<div class=\"row\">\n\t\t\t<og-input\n\t\t\t\tid=\"condition\"\n\t\t\t\t.value=\"${this.format.condition || ''}\"\n\t\t\t\tstyle=\"width: 100%\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-input>\n\t\t</div>\n\n\t\t<div class=\"row\">${msg('Style')}</div>\n\n\t\t<div class=\"row\">\n\t\t\t<og-editor-styleeditor\n\t\t\t\tid=\"style\"\n\t\t\t\t.data=\"${this.format.style || {}}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-editor-styleeditor>\n\t\t</div>\n\t`;\n\n\trenderScaleForm = () => html`\n\t\t<div class=\"row\">${msg('Colors')}</div>\n\t\t<div class=\"row\" style=\"display: flex; gap: 4px;\">\n\t\t\t<og-dropdown-colorpicker\n\t\t\t\tid=\"cminColor\"\n\t\t\t\tstyle=\"flex: 1\"\n\t\t\t\t.value=\"${colors.css(this.format.cmin?.color)}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-dropdown-colorpicker>\n\n\t\t\t<og-dropdown-colorpicker\n\t\t\t\tid=\"cmidColor\"\n\t\t\t\tstyle=\"flex: 1\"\n\t\t\t\t.value=\"${colors.css(this.format.cmid?.color)}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-dropdown-colorpicker>\n\n\t\t\t<og-dropdown-colorpicker\n\t\t\t\tid=\"cmaxColor\"\n\t\t\t\tstyle=\"flex: 1\"\n\t\t\t\t.value=\"${colors.css(this.format.cmax?.color)}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-dropdown-colorpicker>\n\t\t</div>\n\t`;\n\n\trenderBarForm = () => html`\n\t\t<div class=\"row\">${msg('Minimum')}</div>\n\t\t<div class=\"row\">\n\t\t\t<og-editor-rule-threshold\n\t\t\t\tid=\"cmin\"\n\t\t\t\t.value=\"${this.format?.cmin}\"\n\t\t\t\t.allowedTypes=\"${['auto', 'num', 'percent']}\"\n\t\t\t\t?first=\"${false}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-editor-rule-threshold>\n\t\t</div>\n\n\t\t<div class=\"row\">${msg('Maximum')}</div>\n\t\t<div class=\"row\">\n\t\t\t<og-editor-rule-threshold\n\t\t\t\tid=\"cmax\"\n\t\t\t\t.value=\"${this.format?.cmax}\"\n\t\t\t\t.allowedTypes=\"${['auto', 'num', 'percent']}\"\n\t\t\t\t?first=\"${false}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-editor-rule-threshold>\n\t\t</div>\n\n\t\t<div class=\"row\">${msg('Color')}</div>\n\t\t<div class=\"row\" style=\"display: flex; gap: 4px;\">\n\t\t\t<og-dropdown-colorpicker\n\t\t\t\tid=\"color\"\n\t\t\t\tstyle=\"flex: 1\"\n\t\t\t\t.value=\"${colors.css(this.format.color)}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-dropdown-colorpicker>\n\t\t</div>\n\t`;\n\n\ticonItemRenderer = (div: HTMLDivElement, index: number, item: MenuItem) => html`\n\t\t<div style=\"padding-left: 5px\">\n\t\t\t${map(iconSets.get(item.key as ConditionalFormatIconType), icon => html`\n\t\t\t\t<og-icon .icon=\"${icon}\"></og-icon>\n\t\t\t`)} (${item.key})\n\t\t</div>\n\t`;\n\n\trenderIconForm = () => html`\n\t\t<div class=\"row\">${msg('Icons')}</div>\n\t\t<div class=\"row\" style=\"display: flex; gap: 4px;\">\n\t\t\t<og-dropdown-list\n\t\t\t\tid=\"icons\"\n\t\t\t\tstyle=\"flex: 1\"\n\t\t\t\t.items=\"${Array.from(iconSets.entries()).map(item => ({\n\t\t\t\t\tkey: item[0],\n\t\t\t\t\tvalue: item[0],\n\t\t\t\t\trenderer: this.iconItemRenderer\n\t\t\t\t}))}\"\n\t\t\t\t.value=\"${this.format.v as string}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-dropdown-list>\n\t\t</div>\n\n\t\t${this.format.v && iconSets.has(this.format.v as ConditionalFormatIconType) ? html`\n\t\t\t<div class=\"row\">${msg('Thresholds')}</div>\n\t\t\t<div style=\"display: flex; flex-direction: column; gap: 2px; margin-top: 2px\">\n\t\t\t\t${map(iconSets.get(this.format.v as ConditionalFormatIconType), (_icon, i) => html`\n\t\t\t\t\t<og-editor-rule-threshold\n\t\t\t\t\t\tclass=\"threshold\"\n\t\t\t\t\t\t.allowedTypes=\"${['num', 'percent']}\"\n\t\t\t\t\t\t.value=\"${this.format?.thresh[i]}\"\n\t\t\t\t\t\t?first=\"${i == 0}\"\n\t\t\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t\t\t</og-editor-rule-threshold>\n\t\t\t\t`)}\n\t\t\t</div>\n\t\t` : ''}\n\t`;\n\n\trender = () => choose(this.format?.type, [\n\t\t['formula', this.renderFormulaForm],\n\t\t['scale', this.renderScaleForm],\n\t\t['bar', this.renderBarForm],\n\t\t['icon', this.renderIconForm],\n\t])\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ruleEditor.js","sourceRoot":"","sources":["../../../src/ui/editors/ruleEditor.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property, query, queryAll } from 'lit/decorators.js';\nimport { ConditionalFormat, ConditionalFormatIconType, ConditionalFormatThreshold, iconSets } from '@omegagrid/grid';\nimport { css, html } from 'lit';\nimport { colors, DropdownColorPicker, DropdownList, events, Input, MenuItem, OmegaComponent } from '@omegagrid/core';\nimport { msg } from '@omegagrid/localize';\nimport { RuleThreshold, StyleForm } from '../forms';\nimport { map } from 'lit-html/directives/map.js';\nimport { choose } from 'lit-html/directives/choose.js';\n\n@customElement('og-editor-ruleeditor')\nexport class RuleEditor extends OmegaComponent {\n\n\tstatic styles = [OmegaComponent.styles, css`\n\n\t`];\n\n\t@property({type: Object})\n\tformat: ConditionalFormat;\n\n\t@query('og-input#ranges')\n\trangesInput: Input;\n\n\t@query('og-input#condition')\n\tconditionInput: Input;\n\n\t@query('og-dropdown-colorpicker#cminColor')\n\tcminColorInput: DropdownColorPicker;\n\n\t@query('og-dropdown-colorpicker#cmidColor')\n\tcmidColorInput: DropdownColorPicker;\n\n\t@query('og-dropdown-colorpicker#cmaxColor')\n\tcmaxColorInput: DropdownColorPicker;\n\n\t@query('og-dropdown-colorpicker#color')\n\tcolorInput: DropdownColorPicker;\n\n\t@query('og-dropdown-list#icons')\n\ticonList: DropdownList;\n\n\t@query('og-editor-styleeditor#style')\n\tstyleForm: StyleForm;\n\n\t@queryAll('og-editor-rule-threshold.threshold')\n\tthresholds: NodeListOf<RuleThreshold>;\n\n\t@query('og-editor-rule-threshold#cmin')\n\tcmin: RuleThreshold;\n\n\t@query('og-editor-rule-threshold#cmid')\n\tcmid: RuleThreshold;\n\n\t@query('og-editor-rule-threshold#cmax')\n\tcmax: RuleThreshold;\n\n\tupdateFormat() {\n\t\tif (!this.format) return;\n\t\tlet update = false;\n\n\t\t// properties the current form does not show are removed - a null would\n\t\t// pollute the serialized theme JSON\n\t\tconst assign = (key: keyof ConditionalFormat, value: unknown) => {\n\t\t\tif (value == null) delete this.format[key];\n\t\t\telse (this.format as Record<string, unknown>)[key] = value;\n\t\t};\n\n\t\tassign('condition', this.conditionInput?.value ?? null);\n\t\tassign('style', this.styleForm?.data ?? null);\n\n\t\tlet cmin: ConditionalFormatThreshold = this.cminColorInput ? {t: 'min', color: colors.plainHex(this.cminColorInput.value)} : null;\n\t\tlet cmid: ConditionalFormatThreshold = this.cmidColorInput ? {color: colors.plainHex(this.cmidColorInput.value)} : null;\n\t\tlet cmax: ConditionalFormatThreshold = this.cmaxColorInput ? {t: 'max', color: colors.plainHex(this.cmaxColorInput.value)} : null;\n\t\tif (this.cmin) cmin = this.cmin.value;\n\t\tif (this.cmid) cmid = this.cmid.value;\n\t\tif (this.cmax) cmax = this.cmax.value;\n\t\tassign('cmin', cmin);\n\t\tassign('cmid', cmid);\n\t\tassign('cmax', cmax);\n\n\t\tassign('color', this.colorInput ? colors.plainHex(this.colorInput.value) : null);\n\n\t\tif (this.iconList) {\n\t\t\tif (this.format.v != this.iconList.value) update = true;\n\t\t\tassign('v', this.iconList.value);\n\t\t} else {\n\t\t\tassign('v', null);\n\t\t}\n\n\t\tassign('thresh', this.thresholds?.length ? Array.from(this.thresholds).map(t => t.value) : null);\n\n\t\tif (update) this.requestUpdate();\n\t\t// explicit args shape - the format object would be taken for the args and\n\t\t// its 'type' property (formula/scale/...) would become the EVENT type\n\t\tthis.dispatchEvent(new events.ChangeEvent({value: this.format}));\n\t}\n\n\trenderFormulaForm = () => html`\n\t\t<div class=\"row\">${msg('Condition')}</div>\n\n\t\t<div class=\"row\">\n\t\t\t<og-input\n\t\t\t\tid=\"condition\"\n\t\t\t\t.value=\"${this.format.condition || ''}\"\n\t\t\t\tstyle=\"width: 100%\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-input>\n\t\t</div>\n\n\t\t<div class=\"row\">${msg('Style')}</div>\n\n\t\t<div class=\"row\">\n\t\t\t<og-editor-styleeditor\n\t\t\t\tid=\"style\"\n\t\t\t\t.data=\"${this.format.style || {}}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-editor-styleeditor>\n\t\t</div>\n\t`;\n\n\trenderScaleForm = () => html`\n\t\t<div class=\"row\">${msg('Colors')}</div>\n\t\t<div class=\"row\" style=\"display: flex; gap: 4px;\">\n\t\t\t<og-dropdown-colorpicker\n\t\t\t\tid=\"cminColor\"\n\t\t\t\tstyle=\"flex: 1\"\n\t\t\t\t.value=\"${colors.css(this.format.cmin?.color)}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-dropdown-colorpicker>\n\n\t\t\t<og-dropdown-colorpicker\n\t\t\t\tid=\"cmidColor\"\n\t\t\t\tstyle=\"flex: 1\"\n\t\t\t\t.value=\"${colors.css(this.format.cmid?.color)}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-dropdown-colorpicker>\n\n\t\t\t<og-dropdown-colorpicker\n\t\t\t\tid=\"cmaxColor\"\n\t\t\t\tstyle=\"flex: 1\"\n\t\t\t\t.value=\"${colors.css(this.format.cmax?.color)}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-dropdown-colorpicker>\n\t\t</div>\n\t`;\n\n\trenderBarForm = () => html`\n\t\t<div class=\"row\">${msg('Minimum')}</div>\n\t\t<div class=\"row\">\n\t\t\t<og-editor-rule-threshold\n\t\t\t\tid=\"cmin\"\n\t\t\t\t.value=\"${this.format?.cmin}\"\n\t\t\t\t.allowedTypes=\"${['auto', 'num', 'percent']}\"\n\t\t\t\t?first=\"${false}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-editor-rule-threshold>\n\t\t</div>\n\n\t\t<div class=\"row\">${msg('Maximum')}</div>\n\t\t<div class=\"row\">\n\t\t\t<og-editor-rule-threshold\n\t\t\t\tid=\"cmax\"\n\t\t\t\t.value=\"${this.format?.cmax}\"\n\t\t\t\t.allowedTypes=\"${['auto', 'num', 'percent']}\"\n\t\t\t\t?first=\"${false}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-editor-rule-threshold>\n\t\t</div>\n\n\t\t<div class=\"row\">${msg('Color')}</div>\n\t\t<div class=\"row\" style=\"display: flex; gap: 4px;\">\n\t\t\t<og-dropdown-colorpicker\n\t\t\t\tid=\"color\"\n\t\t\t\tstyle=\"flex: 1\"\n\t\t\t\t.value=\"${colors.css(this.format.color)}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-dropdown-colorpicker>\n\t\t</div>\n\t`;\n\n\ticonItemRenderer = (div: HTMLDivElement, index: number, item: MenuItem) => html`\n\t\t<div style=\"padding-left: 5px\">\n\t\t\t${map(iconSets.get(item.key as ConditionalFormatIconType), icon => html`\n\t\t\t\t<og-icon .icon=\"${icon}\"></og-icon>\n\t\t\t`)} (${item.key})\n\t\t</div>\n\t`;\n\n\trenderIconForm = () => html`\n\t\t<div class=\"row\">${msg('Icons')}</div>\n\t\t<div class=\"row\" style=\"display: flex; gap: 4px;\">\n\t\t\t<og-dropdown-list\n\t\t\t\tid=\"icons\"\n\t\t\t\tstyle=\"flex: 1\"\n\t\t\t\t.items=\"${Array.from(iconSets.entries()).map(item => ({\n\t\t\t\t\tkey: item[0],\n\t\t\t\t\tvalue: item[0],\n\t\t\t\t\trenderer: this.iconItemRenderer\n\t\t\t\t}))}\"\n\t\t\t\t.value=\"${this.format.v as string}\"\n\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t</og-dropdown-list>\n\t\t</div>\n\n\t\t${this.format.v && iconSets.has(this.format.v as ConditionalFormatIconType) ? html`\n\t\t\t<div class=\"row\">${msg('Thresholds')}</div>\n\t\t\t<div style=\"display: flex; flex-direction: column; gap: 2px; margin-top: 2px\">\n\t\t\t\t${map(iconSets.get(this.format.v as ConditionalFormatIconType), (_icon, i) => html`\n\t\t\t\t\t<og-editor-rule-threshold\n\t\t\t\t\t\tclass=\"threshold\"\n\t\t\t\t\t\t.allowedTypes=\"${['num', 'percent']}\"\n\t\t\t\t\t\t.value=\"${this.format?.thresh[i]}\"\n\t\t\t\t\t\t?first=\"${i == 0}\"\n\t\t\t\t\t\t@change=\"${() => this.updateFormat()}\">\n\t\t\t\t\t</og-editor-rule-threshold>\n\t\t\t\t`)}\n\t\t\t</div>\n\t\t` : ''}\n\t`;\n\n\trender = () => choose(this.format?.type, [\n\t\t['formula', this.renderFormulaForm],\n\t\t['scale', this.renderScaleForm],\n\t\t['bar', this.renderBarForm],\n\t\t['icon', this.renderIconForm],\n\t])\n}\n"]}
|
|
@@ -14,6 +14,7 @@ export declare class ThemeItemEditor extends OmegaComponent {
|
|
|
14
14
|
styleEditor: StyleEditor;
|
|
15
15
|
static styles: import("lit").CSSResultGroup[];
|
|
16
16
|
willUpdate(): void;
|
|
17
|
+
/** user switched the rule type - drop the properties the new type does not use */
|
|
17
18
|
updateRuleType(type: ConditionalFormatType): void;
|
|
18
19
|
_onStyleChange: (e: events.ChangeEvent<Style>) => void;
|
|
19
20
|
_dispatchChange: () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themeItemEditor.d.ts","sourceRoot":"","sources":["../../../src/ui/editors/themeItemEditor.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,SAAS,EAAc,KAAK,EAAE,eAAe,EAAa,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAEhI,OAAO,EAAE,MAAM,EAAY,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGnE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,KAAK,aAAa,GAAG,MAAM,GAAC,SAAS,GAAC,OAAO,CAAC;AAa9C,qBACa,eAAgB,SAAQ,cAAc;IAGlD,KAAK,EAAE,MAAM,CAAC;IAGd,SAAS,EAAE,eAAe,GAAG,YAAY,CAAC;IAG1C,QAAQ,EAAE,aAAa,CAAC;IAGxB,MAAM,EAAE,WAAW,CAAC;IAGpB,UAAU,EAAE,WAAW,CAAC;IAGxB,UAAU,EAAE,UAAU,CAAC;IAGvB,WAAW,EAAE,WAAW,CAAC;IAEzB,MAAM,CAAC,MAAM,iCAuDV;IAEH,UAAU;
|
|
1
|
+
{"version":3,"file":"themeItemEditor.d.ts","sourceRoot":"","sources":["../../../src/ui/editors/themeItemEditor.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,SAAS,EAAc,KAAK,EAAE,eAAe,EAAa,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAEhI,OAAO,EAAE,MAAM,EAAY,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGnE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,KAAK,aAAa,GAAG,MAAM,GAAC,SAAS,GAAC,OAAO,CAAC;AAa9C,qBACa,eAAgB,SAAQ,cAAc;IAGlD,KAAK,EAAE,MAAM,CAAC;IAGd,SAAS,EAAE,eAAe,GAAG,YAAY,CAAC;IAG1C,QAAQ,EAAE,aAAa,CAAC;IAGxB,MAAM,EAAE,WAAW,CAAC;IAGpB,UAAU,EAAE,WAAW,CAAC;IAGxB,UAAU,EAAE,UAAU,CAAC;IAGvB,WAAW,EAAE,WAAW,CAAC;IAEzB,MAAM,CAAC,MAAM,iCAuDV;IAEH,UAAU;IAQV,kFAAkF;IAClF,cAAc,CAAC,IAAI,EAAE,qBAAqB;IAW1C,cAAc,GAAI,GAAG,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,UAG7C;IAED,eAAe,aAEd;IAED;;;;OAIG;IACH,aAAa,IAAI,SAAS,EAAE;IAW5B,OAAO,CAAC,gBAAgB;IASxB,YAAY,CAAC,QAAQ,EAAE,MAAM;IAI7B,eAAe,CAAC,KAAK,EAAE,MAAM;IAI7B,qFAAqF;IACrF,kBAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM;IAe7C,OAAO,CAAC,oBAAoB;IAK5B,aAAa,GAAI,GAAG,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,UAK7C;IAED,MAAM,6CAkGJ;CACF"}
|
|
@@ -138,11 +138,18 @@ let ThemeItemEditor = class ThemeItemEditor extends OmegaComponent {
|
|
|
138
138
|
}
|
|
139
139
|
willUpdate() {
|
|
140
140
|
this.themeItem = this.themeItem || {};
|
|
141
|
-
|
|
141
|
+
// static and formula rules carry a style - give the editors a stable object
|
|
142
|
+
if ((!this.themeItem.type || this.themeItem.type == 'formula') && !this.themeItem.style) {
|
|
143
|
+
this.themeItem.style = {};
|
|
144
|
+
}
|
|
142
145
|
}
|
|
146
|
+
/** user switched the rule type - drop the properties the new type does not use */
|
|
143
147
|
updateRuleType(type) {
|
|
144
|
-
this.themeItem.type = type;
|
|
145
148
|
if (type)
|
|
149
|
+
this.themeItem.type = type;
|
|
150
|
+
else
|
|
151
|
+
delete this.themeItem.type;
|
|
152
|
+
if (type && type != 'formula')
|
|
146
153
|
delete this.themeItem.style;
|
|
147
154
|
else
|
|
148
155
|
this.themeItem.style = this.themeItem.style || {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themeItemEditor.js","sourceRoot":"","sources":["../../../src/ui/editors/themeItemEditor.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property, query } from 'lit/decorators.js';\nimport { ConditionalFormatType, MatchItem, MatchValue, Style, ThemeColumnItem, ThemeItem, ThemeRowItem } from '@omegagrid/grid';\nimport { css, html } from 'lit';\nimport { events, MenuItem, OmegaComponent } from '@omegagrid/core';\nimport { msg } from '@omegagrid/localize';\nimport { map } from 'lit-html/directives/map.js';\nimport { RuleEditor } from './ruleEditor';\nimport { StyleEditor } from './styleEditor';\nimport { ThemeEditor } from './themeEditor';\n\ntype ThemeItemType = 'rows'|'columns'|'cells';\n\nconst ruleTypes: MenuItem[] = [\n\t{key: null, value: 'Static style'},\n\t{key: 'formula', value: 'Formula'},\n\t{key: 'scale', value: 'Scale'},\n\t{key: 'bar', value: 'Data Bar'},\n\t{key: 'icon', value: 'Icon Set'},\n];\n\n/** node properties offered by the add-condition dropdown */\nconst matchProperties = ['name', 'level', 'index'];\n\n@customElement('og-editor-themeitem')\nexport class ThemeItemEditor extends OmegaComponent {\n\t\n\t@property({type: Number})\n\tindex: number;\n\n\t@property({type: Object})\n\tthemeItem: ThemeColumnItem & ThemeRowItem;\n\n\t@property({type: String})\n\titemType: ThemeItemType;\n\n\t@property({type: Object})\n\teditor: ThemeEditor;\n\n\t@query('.move-handle')\n\tmoveHandle: HTMLElement;\n\n\t@query('og-editor-ruleeditor')\n\truleEditor: RuleEditor;\n\n\t@query('og-editor-styleeditor')\n\tstyleEditor: StyleEditor;\n\n\tstatic styles = [OmegaComponent.styles, css`\n\t\t:host {\n\t\t\tline-height: 22px;\n\t\t}\n\n\t\t.row {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\tmargin: 2px 0;\n\t\t\talign-items: center;\n\t\t}\n\n\t\tlabel {\n\t\t\tflex: 0 60px;\n\t\t\ttext-align: right;\n\t\t\tmargin-right: 10px;\n\t\t}\n\n\t\tog-dropdown-list, og-dropdown-menu, og-editor-ruleeditor {\n\t\t\tline-height: 16px;\n\t\t}\n\n\t\tog-numericinput, og-input {\n\t\t\tflex: 1;\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t\tline-height: 20px;\n\t\t\ttext-align: center;\n\t\t}\n\n\t\t.move-handle {\n\t\t\tcursor: move;\n\t\t}\n\n\t\tog-dropdown-list {\n\t\t\tflex: 1;\n\t\t}\n\n\t\t.header {\n\t\t\tpadding-left: 5px;\n\t\t\tborder-top: 1px solid var(--og-border-color);\n\t\t\tborder-bottom: 1px solid var(--og-border-color);\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t}\n\n\t\t.section {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\talign-items: center;\n\t\t}\n\n\t\t.section > div {\n\t\t\tflex: 1;\n\t\t}\n\t`];\n\n\twillUpdate() {\n\t\tthis.themeItem = this.themeItem || {} as ThemeItem;\n\t\tthis.updateRuleType(this.themeItem.type);\n\t}\n\n\tupdateRuleType(type: ConditionalFormatType) {\n\t\tthis.themeItem.type = type;\n\t\tif (type) delete this.themeItem.style;\n\t\telse this.themeItem.style = this.themeItem.style || {} as Style;\n\n\t\tthis.requestUpdate();\n\t\tthis.ruleEditor?.requestUpdate();\n\t}\n\n\t_onStyleChange = (e: events.ChangeEvent<Style>) => {\n\t\tthis.themeItem.style = e.value;\n\t\tthis._dispatchChange();\n\t}\n\n\t_dispatchChange = () => {\n\t\tthis.editor?.dispatchThemeChange();\n\t}\n\n\t/**\n\t * Conditions of the item as a list of match items. The legacy root matchers\n\t * are shown converted with their original semantics (index wins over level,\n\t * the name filters on top) and become themeItem.matches on the first edit.\n\t */\n\tgetMatchItems(): MatchItem[] {\n\t\tconst item = this.themeItem;\n\t\tif (item.matches) return Array.isArray(item.matches) ? item.matches : [item.matches];\n\n\t\tconst items: MatchItem[] = [];\n\t\tif (item.index > -1) items.push({property: 'index', value: item.index});\n\t\telse if (item.level > -1) items.push({property: 'level', value: item.level});\n\t\tif (item.name) items.push({property: 'name', value: item.name as MatchValue});\n\t\treturn items;\n\t}\n\n\tprivate commitMatchItems(items: MatchItem[]) {\n\t\tthis.themeItem.matches = items;\n\t\tdelete this.themeItem.name;\n\t\tdelete this.themeItem.level;\n\t\tdelete this.themeItem.index;\n\t\tthis._dispatchChange();\n\t\tthis.requestUpdate();\n\t}\n\n\taddCondition(property: string) {\n\t\tthis.commitMatchItems([...this.getMatchItems(), {property, value: property == 'name' ? '' : 0}]);\n\t}\n\n\tremoveCondition(index: number) {\n\t\tthis.commitMatchItems(this.getMatchItems().filter((_, i) => i != index));\n\t}\n\n\t/** comma-separated input = OR of the values; an empty input removes the condition */\n\t_onConditionChange(index: number, raw: string) {\n\t\tconst items = [...this.getMatchItems()];\n\t\tconst property = items[index].property;\n\t\tconst parts = String(raw ?? '').split(',').map(part => part.trim()).filter(part => part !== '');\n\t\tconst values = property == 'name' ? parts : parts.map(Number).filter(value => !isNaN(value));\n\n\t\tif (!values.length) {\n\t\t\tthis.removeCondition(index);\n\t\t\treturn;\n\t\t}\n\n\t\titems[index] = {property, value: values.length == 1 ? values[0] : values};\n\t\tthis.commitMatchItems(items);\n\t}\n\n\tprivate formatConditionValue(value: MatchValue|MatchValue[]): string {\n\t\tconst format = (item: MatchValue) => item instanceof RegExp ? `/${item.source}/` : String(item ?? '');\n\t\treturn Array.isArray(value) ? value.map(format).join(', ') : format(value);\n\t}\n\n\t_onSizeChange = (e: events.ChangeEvent<number>) => {\n\t\tconst key = this.itemType == 'rows' ? 'height' : 'width';\n\t\tif (e.value == null || e.value as unknown === '') delete this.themeItem[key];\n\t\telse this.themeItem[key] = Number(e.value);\n\t\tthis._dispatchChange();\n\t}\n\n\trender = () => html`\n\t\t<div class=\"header\">\n\t\t\t<div style=\"flex: 1\" class=\"move-handle\">${msg('Rule')} #${this.index + 1}</div>\n\n\t\t\t<div>\n\t\t\t\t<og-dropdown-menu\n\t\t\t\t\tnoCaret\n\t\t\t\t\tdynamicWidth\n\t\t\t\t\talignment=\"right\"\n\t\t\t\t\tcolor=\"transparent\"\n\t\t\t\t\t.items=\"${[{\n\t\t\t\t\t\tkey: 'moveUp',\n\t\t\t\t\t\tvalue: msg('Move up'),\n\t\t\t\t\t\ticon: 'arrow-up',\n\t\t\t\t\t\texec: () => this.editor.moveItemUp(this.index, this.itemType)\n\t\t\t\t\t}, {\n\t\t\t\t\t\tkey: 'moveDown',\n\t\t\t\t\t\tvalue: msg('Move down'),\n\t\t\t\t\t\ticon: 'arrow-down',\n\t\t\t\t\t\texec: () => this.editor.moveItemDown(this.index, this.itemType)\n\t\t\t\t\t}, {\n\t\t\t\t\t\tkey: 'delete',\n\t\t\t\t\t\tvalue: msg('Delete'),\n\t\t\t\t\t\ticon: 'trash',\n\t\t\t\t\t\tcolor: 'red',\n\t\t\t\t\t\texec: () => this.editor.deleteItem(this.index, this.itemType)\n\t\t\t\t\t}]}\">\n\t\t\t\t\t<div slot=\"label\"><og-icon icon=\"ellipsis\"></og-icon></div>\n\t\t\t\t</og-dropdown-menu>\n\t\t\t</div>\n\t\t</div>\n\n\t\t${this.itemType != 'cells' ? html`\n\t\t\t<div class=\"row section\">\n\t\t\t\t<div>${msg('Conditions')}</div>\n\t\t\t\t<og-dropdown-menu\n\t\t\t\t\tnoCaret\n\t\t\t\t\tdynamicWidth\n\t\t\t\t\talignment=\"right\"\n\t\t\t\t\tcolor=\"transparent\"\n\t\t\t\t\t.items=\"${matchProperties.map(property => ({\n\t\t\t\t\t\tkey: property,\n\t\t\t\t\t\tvalue: msg(property.charAt(0).toUpperCase() + property.slice(1)),\n\t\t\t\t\t\texec: () => this.addCondition(property)\n\t\t\t\t\t}))}\">\n\t\t\t\t\t<div slot=\"label\"><og-icon icon=\"plus\"></og-icon></div>\n\t\t\t\t</og-dropdown-menu>\n\t\t\t</div>\n\n\t\t\t${map(this.getMatchItems(), (match, i) => html`\n\t\t\t\t<div class=\"row\">\n\t\t\t\t\t<label>${msg(match.property.charAt(0).toUpperCase() + match.property.slice(1))}</label>\n\t\t\t\t\t<og-input\n\t\t\t\t\t\tstyle=\"text-align: left\"\n\t\t\t\t\t\t.value=\"${this.formatConditionValue(match.value)}\"\n\t\t\t\t\t\t@change=\"${(e: events.ChangeEvent<string>) => this._onConditionChange(i, e.value)}\">\n\t\t\t\t\t</og-input>\n\t\t\t\t\t<og-button\n\t\t\t\t\t\ticon=\"trash\"\n\t\t\t\t\t\tcolor=\"transparent\"\n\t\t\t\t\t\tstyle=\"flex: 0 0 20px; color: red\"\n\t\t\t\t\t\t@click=\"${() => this.removeCondition(i)}\">\n\t\t\t\t\t</og-button>\n\t\t\t\t</div>\n\t\t\t`)}\n\n\t\t\t<div class=\"row\">\n\t\t\t\t<label>${msg(this.itemType == 'rows' ? 'Height' : 'Width')}</label>\n\t\t\t\t<og-numericinput buttons min=\"0\"\n\t\t\t\t\t.value=\"${this.itemType == 'rows' ? this.themeItem?.height : this.themeItem?.width}\"\n\t\t\t\t\t@change=\"${this._onSizeChange}\">\n\t\t\t\t</og-numericinput>\n\t\t\t</div>\n\t\t` : ''}\n\n\t\t<div class=\"row\">${msg('Style definition')}</div>\n\n\t\t<div class=\"row\">\n\t\t\t<og-dropdown-list\n\t\t\t\t.value = \"${this.themeItem?.type ?? null}\"\n\t\t\t\t.items=\"${ruleTypes}\"\n\t\t\t\t@change=\"${(e: events.ChangeEvent<ConditionalFormatType>) => { this.updateRuleType(e.value); this._dispatchChange(); }}\">\n\t\t\t</og-dropdown-list>\n\t\t</div>\n\n\t\t<div>\n\t\t\t${this.themeItem?.type ? html`\n\t\t\t\t<og-editor-ruleeditor \n\t\t\t\t\t.format=\"${this.themeItem}\"\n\t\t\t\t\t@change=\"${this._dispatchChange}\">\n\t\t\t\t</og-editor-ruleeditor>\n\t\t\t`: html`\n\t\t\t\t<og-editor-styleeditor \n\t\t\t\t\t@change=\"${this._onStyleChange}\"\n\t\t\t\t\t.data=\"${this.themeItem.style}\">\n\t\t\t\t</og-editor-styleeditor>\n\t\t\t`}\n\t\t</div>\n\t`;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"themeItemEditor.js","sourceRoot":"","sources":["../../../src/ui/editors/themeItemEditor.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property, query } from 'lit/decorators.js';\nimport { ConditionalFormatType, MatchItem, MatchValue, Style, ThemeColumnItem, ThemeItem, ThemeRowItem } from '@omegagrid/grid';\nimport { css, html } from 'lit';\nimport { events, MenuItem, OmegaComponent } from '@omegagrid/core';\nimport { msg } from '@omegagrid/localize';\nimport { map } from 'lit-html/directives/map.js';\nimport { RuleEditor } from './ruleEditor';\nimport { StyleEditor } from './styleEditor';\nimport { ThemeEditor } from './themeEditor';\n\ntype ThemeItemType = 'rows'|'columns'|'cells';\n\nconst ruleTypes: MenuItem[] = [\n\t{key: null, value: 'Static style'},\n\t{key: 'formula', value: 'Formula'},\n\t{key: 'scale', value: 'Scale'},\n\t{key: 'bar', value: 'Data Bar'},\n\t{key: 'icon', value: 'Icon Set'},\n];\n\n/** node properties offered by the add-condition dropdown */\nconst matchProperties = ['name', 'level', 'index'];\n\n@customElement('og-editor-themeitem')\nexport class ThemeItemEditor extends OmegaComponent {\n\t\n\t@property({type: Number})\n\tindex: number;\n\n\t@property({type: Object})\n\tthemeItem: ThemeColumnItem & ThemeRowItem;\n\n\t@property({type: String})\n\titemType: ThemeItemType;\n\n\t@property({type: Object})\n\teditor: ThemeEditor;\n\n\t@query('.move-handle')\n\tmoveHandle: HTMLElement;\n\n\t@query('og-editor-ruleeditor')\n\truleEditor: RuleEditor;\n\n\t@query('og-editor-styleeditor')\n\tstyleEditor: StyleEditor;\n\n\tstatic styles = [OmegaComponent.styles, css`\n\t\t:host {\n\t\t\tline-height: 22px;\n\t\t}\n\n\t\t.row {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\tmargin: 2px 0;\n\t\t\talign-items: center;\n\t\t}\n\n\t\tlabel {\n\t\t\tflex: 0 60px;\n\t\t\ttext-align: right;\n\t\t\tmargin-right: 10px;\n\t\t}\n\n\t\tog-dropdown-list, og-dropdown-menu, og-editor-ruleeditor {\n\t\t\tline-height: 16px;\n\t\t}\n\n\t\tog-numericinput, og-input {\n\t\t\tflex: 1;\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t\tline-height: 20px;\n\t\t\ttext-align: center;\n\t\t}\n\n\t\t.move-handle {\n\t\t\tcursor: move;\n\t\t}\n\n\t\tog-dropdown-list {\n\t\t\tflex: 1;\n\t\t}\n\n\t\t.header {\n\t\t\tpadding-left: 5px;\n\t\t\tborder-top: 1px solid var(--og-border-color);\n\t\t\tborder-bottom: 1px solid var(--og-border-color);\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t}\n\n\t\t.section {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\talign-items: center;\n\t\t}\n\n\t\t.section > div {\n\t\t\tflex: 1;\n\t\t}\n\t`];\n\n\twillUpdate() {\n\t\tthis.themeItem = this.themeItem || {} as ThemeItem;\n\t\t// static and formula rules carry a style - give the editors a stable object\n\t\tif ((!this.themeItem.type || this.themeItem.type == 'formula') && !this.themeItem.style) {\n\t\t\tthis.themeItem.style = {} as Style;\n\t\t}\n\t}\n\n\t/** user switched the rule type - drop the properties the new type does not use */\n\tupdateRuleType(type: ConditionalFormatType) {\n\t\tif (type) this.themeItem.type = type;\n\t\telse delete this.themeItem.type;\n\n\t\tif (type && type != 'formula') delete this.themeItem.style;\n\t\telse this.themeItem.style = this.themeItem.style || {} as Style;\n\n\t\tthis.requestUpdate();\n\t\tthis.ruleEditor?.requestUpdate();\n\t}\n\n\t_onStyleChange = (e: events.ChangeEvent<Style>) => {\n\t\tthis.themeItem.style = e.value;\n\t\tthis._dispatchChange();\n\t}\n\n\t_dispatchChange = () => {\n\t\tthis.editor?.dispatchThemeChange();\n\t}\n\n\t/**\n\t * Conditions of the item as a list of match items. The legacy root matchers\n\t * are shown converted with their original semantics (index wins over level,\n\t * the name filters on top) and become themeItem.matches on the first edit.\n\t */\n\tgetMatchItems(): MatchItem[] {\n\t\tconst item = this.themeItem;\n\t\tif (item.matches) return Array.isArray(item.matches) ? item.matches : [item.matches];\n\n\t\tconst items: MatchItem[] = [];\n\t\tif (item.index > -1) items.push({property: 'index', value: item.index});\n\t\telse if (item.level > -1) items.push({property: 'level', value: item.level});\n\t\tif (item.name) items.push({property: 'name', value: item.name as MatchValue});\n\t\treturn items;\n\t}\n\n\tprivate commitMatchItems(items: MatchItem[]) {\n\t\tthis.themeItem.matches = items;\n\t\tdelete this.themeItem.name;\n\t\tdelete this.themeItem.level;\n\t\tdelete this.themeItem.index;\n\t\tthis._dispatchChange();\n\t\tthis.requestUpdate();\n\t}\n\n\taddCondition(property: string) {\n\t\tthis.commitMatchItems([...this.getMatchItems(), {property, value: property == 'name' ? '' : 0}]);\n\t}\n\n\tremoveCondition(index: number) {\n\t\tthis.commitMatchItems(this.getMatchItems().filter((_, i) => i != index));\n\t}\n\n\t/** comma-separated input = OR of the values; an empty input removes the condition */\n\t_onConditionChange(index: number, raw: string) {\n\t\tconst items = [...this.getMatchItems()];\n\t\tconst property = items[index].property;\n\t\tconst parts = String(raw ?? '').split(',').map(part => part.trim()).filter(part => part !== '');\n\t\tconst values = property == 'name' ? parts : parts.map(Number).filter(value => !isNaN(value));\n\n\t\tif (!values.length) {\n\t\t\tthis.removeCondition(index);\n\t\t\treturn;\n\t\t}\n\n\t\titems[index] = {property, value: values.length == 1 ? values[0] : values};\n\t\tthis.commitMatchItems(items);\n\t}\n\n\tprivate formatConditionValue(value: MatchValue|MatchValue[]): string {\n\t\tconst format = (item: MatchValue) => item instanceof RegExp ? `/${item.source}/` : String(item ?? '');\n\t\treturn Array.isArray(value) ? value.map(format).join(', ') : format(value);\n\t}\n\n\t_onSizeChange = (e: events.ChangeEvent<number>) => {\n\t\tconst key = this.itemType == 'rows' ? 'height' : 'width';\n\t\tif (e.value == null || e.value as unknown === '') delete this.themeItem[key];\n\t\telse this.themeItem[key] = Number(e.value);\n\t\tthis._dispatchChange();\n\t}\n\n\trender = () => html`\n\t\t<div class=\"header\">\n\t\t\t<div style=\"flex: 1\" class=\"move-handle\">${msg('Rule')} #${this.index + 1}</div>\n\n\t\t\t<div>\n\t\t\t\t<og-dropdown-menu\n\t\t\t\t\tnoCaret\n\t\t\t\t\tdynamicWidth\n\t\t\t\t\talignment=\"right\"\n\t\t\t\t\tcolor=\"transparent\"\n\t\t\t\t\t.items=\"${[{\n\t\t\t\t\t\tkey: 'moveUp',\n\t\t\t\t\t\tvalue: msg('Move up'),\n\t\t\t\t\t\ticon: 'arrow-up',\n\t\t\t\t\t\texec: () => this.editor.moveItemUp(this.index, this.itemType)\n\t\t\t\t\t}, {\n\t\t\t\t\t\tkey: 'moveDown',\n\t\t\t\t\t\tvalue: msg('Move down'),\n\t\t\t\t\t\ticon: 'arrow-down',\n\t\t\t\t\t\texec: () => this.editor.moveItemDown(this.index, this.itemType)\n\t\t\t\t\t}, {\n\t\t\t\t\t\tkey: 'delete',\n\t\t\t\t\t\tvalue: msg('Delete'),\n\t\t\t\t\t\ticon: 'trash',\n\t\t\t\t\t\tcolor: 'red',\n\t\t\t\t\t\texec: () => this.editor.deleteItem(this.index, this.itemType)\n\t\t\t\t\t}]}\">\n\t\t\t\t\t<div slot=\"label\"><og-icon icon=\"ellipsis\"></og-icon></div>\n\t\t\t\t</og-dropdown-menu>\n\t\t\t</div>\n\t\t</div>\n\n\t\t${this.itemType != 'cells' ? html`\n\t\t\t<div class=\"row section\">\n\t\t\t\t<div>${msg('Conditions')}</div>\n\t\t\t\t<og-dropdown-menu\n\t\t\t\t\tnoCaret\n\t\t\t\t\tdynamicWidth\n\t\t\t\t\talignment=\"right\"\n\t\t\t\t\tcolor=\"transparent\"\n\t\t\t\t\t.items=\"${matchProperties.map(property => ({\n\t\t\t\t\t\tkey: property,\n\t\t\t\t\t\tvalue: msg(property.charAt(0).toUpperCase() + property.slice(1)),\n\t\t\t\t\t\texec: () => this.addCondition(property)\n\t\t\t\t\t}))}\">\n\t\t\t\t\t<div slot=\"label\"><og-icon icon=\"plus\"></og-icon></div>\n\t\t\t\t</og-dropdown-menu>\n\t\t\t</div>\n\n\t\t\t${map(this.getMatchItems(), (match, i) => html`\n\t\t\t\t<div class=\"row\">\n\t\t\t\t\t<label>${msg(match.property.charAt(0).toUpperCase() + match.property.slice(1))}</label>\n\t\t\t\t\t<og-input\n\t\t\t\t\t\tstyle=\"text-align: left\"\n\t\t\t\t\t\t.value=\"${this.formatConditionValue(match.value)}\"\n\t\t\t\t\t\t@change=\"${(e: events.ChangeEvent<string>) => this._onConditionChange(i, e.value)}\">\n\t\t\t\t\t</og-input>\n\t\t\t\t\t<og-button\n\t\t\t\t\t\ticon=\"trash\"\n\t\t\t\t\t\tcolor=\"transparent\"\n\t\t\t\t\t\tstyle=\"flex: 0 0 20px; color: red\"\n\t\t\t\t\t\t@click=\"${() => this.removeCondition(i)}\">\n\t\t\t\t\t</og-button>\n\t\t\t\t</div>\n\t\t\t`)}\n\n\t\t\t<div class=\"row\">\n\t\t\t\t<label>${msg(this.itemType == 'rows' ? 'Height' : 'Width')}</label>\n\t\t\t\t<og-numericinput buttons min=\"0\"\n\t\t\t\t\t.value=\"${this.itemType == 'rows' ? this.themeItem?.height : this.themeItem?.width}\"\n\t\t\t\t\t@change=\"${this._onSizeChange}\">\n\t\t\t\t</og-numericinput>\n\t\t\t</div>\n\t\t` : ''}\n\n\t\t<div class=\"row\">${msg('Style definition')}</div>\n\n\t\t<div class=\"row\">\n\t\t\t<og-dropdown-list\n\t\t\t\t.value = \"${this.themeItem?.type ?? null}\"\n\t\t\t\t.items=\"${ruleTypes}\"\n\t\t\t\t@change=\"${(e: events.ChangeEvent<ConditionalFormatType>) => { this.updateRuleType(e.value); this._dispatchChange(); }}\">\n\t\t\t</og-dropdown-list>\n\t\t</div>\n\n\t\t<div>\n\t\t\t${this.themeItem?.type ? html`\n\t\t\t\t<og-editor-ruleeditor \n\t\t\t\t\t.format=\"${this.themeItem}\"\n\t\t\t\t\t@change=\"${this._dispatchChange}\">\n\t\t\t\t</og-editor-ruleeditor>\n\t\t\t`: html`\n\t\t\t\t<og-editor-styleeditor \n\t\t\t\t\t@change=\"${this._onStyleChange}\"\n\t\t\t\t\t.data=\"${this.themeItem.style}\">\n\t\t\t\t</og-editor-styleeditor>\n\t\t\t`}\n\t\t</div>\n\t`;\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@omegagrid/editor",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.96",
|
|
4
4
|
"license": "UNLICENSED",
|
|
5
5
|
"description": "Spreadsheet editor",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -27,15 +27,15 @@
|
|
|
27
27
|
"_prepublish": "yarn test && yarn lint"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@omegagrid/commands": "^0.10.
|
|
31
|
-
"@omegagrid/core": "^0.10.
|
|
32
|
-
"@omegagrid/form": "^0.10.
|
|
33
|
-
"@omegagrid/grid": "^0.10.
|
|
34
|
-
"@omegagrid/localize": "^0.10.
|
|
35
|
-
"@omegagrid/statusbar": "^0.10.
|
|
36
|
-
"@omegagrid/tabs": "^0.10.
|
|
37
|
-
"@omegagrid/toolbar": "^0.10.
|
|
38
|
-
"@omegagrid/tree": "^0.10.
|
|
30
|
+
"@omegagrid/commands": "^0.10.96",
|
|
31
|
+
"@omegagrid/core": "^0.10.96",
|
|
32
|
+
"@omegagrid/form": "^0.10.96",
|
|
33
|
+
"@omegagrid/grid": "^0.10.96",
|
|
34
|
+
"@omegagrid/localize": "^0.10.96",
|
|
35
|
+
"@omegagrid/statusbar": "^0.10.96",
|
|
36
|
+
"@omegagrid/tabs": "^0.10.96",
|
|
37
|
+
"@omegagrid/toolbar": "^0.10.96",
|
|
38
|
+
"@omegagrid/tree": "^0.10.96",
|
|
39
39
|
"lit": "^3.1.1",
|
|
40
40
|
"lit-html": "^3.1.1",
|
|
41
41
|
"ts-debounce": "^4.0.0"
|