@omegagrid/editor 0.6.28 → 0.6.30

package/dist/ui/editors/styleEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styleEditor.js","sourceRoot":"","sources":["../../../src/ui/editors/styleEditor.ts"],"names":[],"mappings":"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"}

package/dist/ui/editors/themeEditor.d.ts

@@ -0,0 +1,24 @@
+import { TableTheme } from '@omegagrid/grid';
+import { OmegaComponent, SortableList } from '@omegagrid/core';
+import { TabContainer } from '@omegagrid/tabs';
+type ThemeItemType = 'rows' | 'columns' | 'cells';
+export declare class ThemeEditor extends OmegaComponent {
+    static styles: import("lit").CSSResultGroup[];
+    theme: TableTheme;
+    tabContainer: TabContainer;
+    private lists;
+    private listItems;
+    willUpdate(props: Map<string, unknown>): void;
+    updated(props: Map<string, unknown>): void;
+    createItemEditor: (type: ThemeItemType) => (div: HTMLDivElement, index: number) => void;
+    updateList(type: ThemeItemType): void;
+    moveItemUp(index: number, type: ThemeItemType): void;
+    moveItemDown(index: number, type: ThemeItemType): void;
+    moveItem(fromIndex: number, toIndex: number, type: ThemeItemType): void;
+    deleteItem(index: number, type: ThemeItemType): void;
+    addItem(type: ThemeItemType): void;
+    createComponent: (id: ThemeItemType) => SortableList;
+    render: () => import("lit-html").TemplateResult<1>;
+}
+export {};
+//# sourceMappingURL=themeEditor.d.ts.map

package/dist/ui/editors/themeEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeEditor.d.ts","sourceRoot":"","sources":["../../../src/ui/editors/themeEditor.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,OAAO,EAAsB,cAAc,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAGnF,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,KAAK,aAAa,GAAG,MAAM,GAAC,SAAS,GAAC,OAAO,CAAC;AAE9C,qBACa,WAAY,SAAQ,cAAc;IAE9C,MAAM,CAAC,MAAM,iCAIV;IAGH,KAAK,EAAE,UAAU,CAAC;IAGlB,YAAY,EAAE,YAAY,CAAC;IAE3B,OAAO,CAAC,KAAK,CAA+C;IAC5D,OAAO,CAAC,SAAS,CAAoD;IAErE,UAAU,CAAC,KAAK,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAQtC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAInC,gBAAgB,SAAU,aAAa,WAAW,cAAc,SAAS,MAAM,UAe9E;IAED,UAAU,CAAC,IAAI,EAAE,aAAa;IAM9B,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,aAAa;IAK7C,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,aAAa;IAK/C,QAAQ,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,aAAa;IAQhE,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,aAAa;IAQ7C,OAAO,CAAC,IAAI,EAAE,aAAa;IAQ3B,eAAe,OAAQ,aAAa,kBAgBnC;IAED,MAAM,6CAuBJ;CAEF"}

package/dist/ui/editors/themeEditor.js

@@ -0,0 +1,138 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { customElement, property, query } from 'lit/decorators.js';
+import { css, html } from 'lit';
+import { dom, OmegaComponent } from '@omegagrid/core';
+import { msg } from '@omegagrid/localize';
+let ThemeEditor = class ThemeEditor extends OmegaComponent {
+    constructor() {
+        super(...arguments);
+        this.createItemEditor = (type) => (div, index) => {
+            this.listItems = this.listItems || {};
+            this.listItems[type] = this.listItems[type] || [];
+            let editor = this.listItems[type][index] ? this.listItems[type][index] : null;
+            if (!editor) {
+                editor = dom.createElement('og-editor-themeitem', {
+                    index: index,
+                    themeItem: this.theme[type][index],
+                    itemType: type,
+                    editor: this
+                });
+                this.listItems[type][index] = editor;
+            }
+            dom.empty(div);
+            div.appendChild(editor);
+        };
+        this.createComponent = (id) => {
+            this.lists = this.lists || {};
+            if (this.lists[id])
+                return this.lists[id];
+            const list = dom.createElement('og-sortablelist');
+            list.style.height = '100%';
+            list.style.overflow = 'hidden';
+            list.scrollbarPadding = true;
+            list.disabledSelect = true;
+            list.customHandle = true;
+            list.dynamicItemHeight = true;
+            list.nativeHeight = true;
+            list.size = this.theme && this.theme[id] ? this.theme[id].length : 0;
+            list.itemRenderer = this.createItemEditor(id);
+            list.addEventListener('list.sort', (e) => this.moveItem(e.fromIndex, e.toIndex, id));
+            this.lists[id] = list;
+            return list;
+        };
+        this.render = () => html `
+		<div style="display: flex; flex-direction: column; height: 100%">
+			<div style="flex: 1; overflow: hidden">
+				<og-tabcontainer 
+					fixed
+					style="height: 100%"
+					.createComponent="${this.createComponent}"
+					.items="${[
+            { id: 'rows', title: msg('Rows') },
+            { id: 'columns', title: msg('Columns') },
+            { id: 'cells', title: msg('Cells') }
+        ]}">
+				</og-tabcontainer>
+			</div>
+			
+			<div style="flex: 0; padding-top: 5px">
+				<og-button
+					@click="${() => this.addItem(this.tabContainer.selectedId)}"
+					icon="plus"
+					style="width: 100%">
+				</og-button>
+			</div>
+		</div>
+	`;
+    }
+    willUpdate(props) {
+        this.theme = this.theme || { name: '' };
+        if (props.has('theme')) {
+            this.listItems = {};
+            this.lists = {};
+        }
+    }
+    updated(props) {
+        if (props.has('theme'))
+            this.tabContainer?.refresh();
+    }
+    updateList(type) {
+        this.listItems[type] = [];
+        this.lists[type].size = this.theme[type].length;
+        this.lists[type].renderItems(true);
+    }
+    moveItemUp(index, type) {
+        if (index === 0)
+            return;
+        this.moveItem(index, index - 1, type);
+    }
+    moveItemDown(index, type) {
+        if (index >= this.listItems[type].length - 1)
+            return;
+        this.moveItem(index, index + 1, type);
+    }
+    moveItem(fromIndex, toIndex, type) {
+        const items = this.theme[type];
+        if (!this.theme[type])
+            return;
+        const item = items.splice(fromIndex, 1)[0];
+        items.splice(toIndex, 0, item);
+        this.updateList(type);
+    }
+    deleteItem(index, type) {
+        const items = this.theme[type];
+        if (!this.theme[type])
+            return;
+        items.splice(index, 1);
+        this.theme[type] = items;
+        this.updateList(type);
+    }
+    addItem(type) {
+        const items = this.theme[type] ?? [];
+        items.push({});
+        this.theme[type] = items;
+        this.updateList(type);
+        this.lists[type].scrollToIndex(items.length - 1);
+    }
+};
+ThemeEditor.styles = [OmegaComponent.styles, css `
+		:host {
+			overflow: hidden;
+		}
+	`];
+__decorate([
+    property({ type: Object })
+], ThemeEditor.prototype, "theme", void 0);
+__decorate([
+    query('og-tabcontainer')
+], ThemeEditor.prototype, "tabContainer", void 0);
+ThemeEditor = __decorate([
+    customElement('og-editor-theme')
+], ThemeEditor);
+export { ThemeEditor };
+//# sourceMappingURL=themeEditor.js.map

package/dist/ui/editors/themeEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeEditor.js","sourceRoot":"","sources":["../../../src/ui/editors/themeEditor.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,GAAG,EAAiB,cAAc,EAAgB,MAAM,iBAAiB,CAAC;AACnF,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAOnC,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,cAAc;IAAxC;;QA6BN,qBAAgB,GAAG,CAAC,IAAmB,EAAE,EAAE,CAAC,CAAC,GAAmB,EAAE,KAAa,EAAE,EAAE;YAClF,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC;YACtC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAClD,IAAI,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;YAC9E,IAAI,CAAC,MAAM,EAAE,CAAC;gBACb,MAAM,GAAG,GAAG,CAAC,aAAa,CAAkB,qBAAqB,EAAE;oBAClE,KAAK,EAAE,KAAK;oBACZ,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC;oBAClC,QAAQ,EAAE,IAAI;oBACd,MAAM,EAAE,IAAI;iBACZ,CAAC,CAAC;gBACH,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,MAAM,CAAC;YACtC,CAAC;YACD,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YACf,GAAG,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;QACzB,CAAC,CAAA;QA0CD,oBAAe,GAAG,CAAC,EAAiB,EAAE,EAAE;YACvC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC;YAC9B,IAAI,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;gBAAE,OAAO,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;YAC1C,MAAM,IAAI,GAAG,GAAG,CAAC,aAAa,CAAe,iBAAiB,CAAC,CAAC;YAChE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;YAC3B,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;YAC/B,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;YAC7B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;YAC3B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YACzB,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;YAC9B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YACzB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;YACrE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC;YAC9C,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,CAAC,CAAgB,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,CAAC;YACpG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC;YACtB,OAAO,IAAI,CAAC;QACb,CAAC,CAAA;QAED,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;;;;;yBAMK,IAAI,CAAC,eAAe;eAC9B;YACT,EAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,EAAC;YAChC,EAAC,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,CAAC,SAAS,CAAC,EAAC;YACtC,EAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,EAAC;SAClC;;;;;;eAMS,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,UAA2B,CAAC;;;;;;EAM9E,CAAC;IAEH,CAAC;IAhHA,UAAU,CAAC,KAA2B;QACrC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,EAAC,IAAI,EAAE,EAAE,EAAC,CAAC;QACtC,IAAI,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;YACxB,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;YACpB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QACjB,CAAC;IACF,CAAC;IAED,OAAO,CAAC,KAA2B;QAClC,IAAI,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;YAAE,IAAI,CAAC,YAAY,EAAE,OAAO,EAAE,CAAC;IACtD,CAAC;IAmBD,UAAU,CAAC,IAAmB;QAC7B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC;QAC1B,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC;QAChD,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;IACpC,CAAC;IAED,UAAU,CAAC,KAAa,EAAE,IAAmB;QAC5C,IAAI,KAAK,KAAK,CAAC;YAAE,OAAO;QACxB,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,KAAK,GAAG,CAAC,EAAE,IAAI,CAAC,CAAC;IACvC,CAAC;IAED,YAAY,CAAC,KAAa,EAAE,IAAmB;QAC9C,IAAI,KAAK,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC;YAAE,OAAO;QACrD,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,KAAK,GAAG,CAAC,EAAE,IAAI,CAAC,CAAC;IACvC,CAAC;IAED,QAAQ,CAAC,SAAiB,EAAE,OAAe,EAAE,IAAmB;QAC/D,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAC/B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;YAAE,OAAO;QAC9B,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC3C,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI,CAAC,CAAC;QAC/B,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC;IAED,UAAU,CAAC,KAAa,EAAE,IAAmB;QAC5C,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAC/B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;YAAE,OAAO;QAC9B,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QACvB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC;QACzB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC;IAED,OAAO,CAAC,IAAmB;QAC1B,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;QACrC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACf,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC;QACzB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QACtB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;IAClD,CAAC;;AAlFM,kBAAM,GAAG,CAAC,cAAc,CAAC,MAAM,EAAE,GAAG,CAAA;;;;EAI1C,CAAC,AAJW,CAIV;AAGH;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;0CACP;AAGlB;IADC,KAAK,CAAC,iBAAiB,CAAC;iDACE;AAZf,WAAW;IADvB,aAAa,CAAC,iBAAiB,CAAC;GACpB,WAAW,CAiIvB"}

package/dist/ui/editors/themeItemEditor.d.ts

@@ -0,0 +1,22 @@
+import { ConditionalFormatType, Style, ThemeColumnItem, ThemeRowItem } from '@omegagrid/grid';
+import { events, OmegaComponent } from '@omegagrid/core';
+import { RuleEditor } from './ruleEditor';
+import { StyleEditor } from './styleEditor';
+import { ThemeEditor } from './themeEditor';
+type ThemeItemType = 'rows' | 'columns' | 'cells';
+export declare class ThemeItemEditor extends OmegaComponent {
+    index: number;
+    themeItem: ThemeColumnItem & ThemeRowItem;
+    itemType: ThemeItemType;
+    editor: ThemeEditor;
+    moveHandle: HTMLElement;
+    ruleEditor: RuleEditor;
+    styleEditor: StyleEditor;
+    static styles: import("lit").CSSResultGroup[];
+    willUpdate(): void;
+    updateRuleType(type: ConditionalFormatType): void;
+    _onStyleChange: (e: events.ChangeEvent<Style>) => void;
+    render: () => import("lit-html").TemplateResult<1>;
+}
+export {};
+//# sourceMappingURL=themeItemEditor.d.ts.map

package/dist/ui/editors/themeItemEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeItemEditor.d.ts","sourceRoot":"","sources":["../../../src/ui/editors/themeItemEditor.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,KAAK,EAAE,eAAe,EAAa,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAEzG,OAAO,EAAE,MAAM,EAAY,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEnE,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;AAU9C,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,iCA6CV;IAEH,UAAU;IAKV,cAAc,CAAC,IAAI,EAAE,qBAAqB;IAS1C,cAAc,MAAO,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,UAE7C;IAED,MAAM,6CAsEJ;CACF"}

package/dist/ui/editors/themeItemEditor.js

@@ -0,0 +1,181 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { customElement, property, query } from 'lit/decorators.js';
+import { css, html } from 'lit';
+import { OmegaComponent } from '@omegagrid/core';
+import { msg } from '@omegagrid/localize';
+const ruleTypes = [
+    { key: null, value: 'Static style' },
+    { key: 'formula', value: 'Formula' },
+    { key: 'scale', value: 'Scale' },
+    { key: 'bar', value: 'Data Bar' },
+    { key: 'icon', value: 'Icon Set' },
+];
+let ThemeItemEditor = class ThemeItemEditor extends OmegaComponent {
+    constructor() {
+        super(...arguments);
+        this._onStyleChange = (e) => {
+            this.themeItem.style = e.value;
+        };
+        this.render = () => html `
+		<div class="header">
+			<div style="flex: 1" class="move-handle">${msg('Rule')} #${this.index + 1}</div>
+
+			<div>
+				<og-dropdown-menu
+					noCaret
+					dynamicWidth
+					alignment="right"
+					color="transparent"
+					.items="${[{
+                key: 'moveUp',
+                value: msg('Move up'),
+                icon: 'arrow-up',
+                exec: () => this.editor.moveItemUp(this.index, this.itemType)
+            }, {
+                key: 'moveDown',
+                value: msg('Move down'),
+                icon: 'arrow-down',
+                exec: () => this.editor.moveItemDown(this.index, this.itemType)
+            }, {
+                key: 'delete',
+                value: msg('Delete'),
+                icon: 'trash',
+                color: 'red',
+                exec: () => this.editor.deleteItem(this.index, this.itemType)
+            }]}">
+					<div slot="label"><og-icon icon="ellipsis"></og-icon></div>
+				</og-dropdown-menu>
+			</div>
+		</div>
+
+		${this.itemType != 'cells' ? html `
+			<div class="row">${msg('Conditions')}</div>
+
+			<div class="row">
+				<label>${msg('Level')}</label>
+				<og-numericinput buttons min="0" .value="${this.themeItem?.level}"></og-numericinput>
+				<label>${msg('Index')}</label>
+				<og-numericinput buttons min="0" .value="${this.themeItem?.index}"></og-numericinput>
+			</div>
+
+			<div class="row">
+				<label>${msg('Name')}</label>
+				<og-input></og-input>
+			</div>
+		` : ''}
+
+		<div class="row">${msg('Style definition')}</div>
+
+		<div class="row">
+			<og-dropdown-list
+				.value = "${this.themeItem?.type ?? null}"
+				.items="${ruleTypes}"
+				@change="${(e) => this.updateRuleType(e.value)}">
+			</og-dropdown-list>
+		</div>
+
+		<div>
+			${this.themeItem?.type ? html `
+				<og-editor-ruleeditor 
+					.format="${this.themeItem}">
+				</og-editor-ruleeditor>
+			` : html `
+				<og-editor-styleeditor 
+					@change="${this._onStyleChange}"
+					.data="${this.themeItem.style}">
+				</og-editor-styleeditor>
+			`}
+		</div>
+	`;
+    }
+    willUpdate() {
+        this.themeItem = this.themeItem || {};
+        this.updateRuleType(this.themeItem.type);
+    }
+    updateRuleType(type) {
+        this.themeItem.type = type;
+        if (type)
+            delete this.themeItem.style;
+        else
+            this.themeItem.style = this.themeItem.style || {};
+        this.requestUpdate();
+        this.ruleEditor?.requestUpdate();
+    }
+};
+ThemeItemEditor.styles = [OmegaComponent.styles, css `
+		:host {
+			line-height: 22px;
+		}
+
+		.row {
+			display: flex;
+			flex-direction: row;
+			margin: 2px 0;
+			align-items: center;
+		}
+
+		label {
+			flex: 0 60px;
+			text-align: right;
+			margin-right: 10px;
+		}
+
+		og-dropdown-list, og-dropdown-menu, og-editor-ruleeditor {
+			line-height: 16px;
+		}
+
+		og-numericinput, og-input {
+			flex: 1;
+			display: block;
+			width: 100%;
+			line-height: 20px;
+			text-align: center;
+		}
+
+		.move-handle {
+			cursor: move;
+		}
+
+		og-dropdown-list {
+			flex: 1;
+		}
+
+		.header {
+			padding-left: 5px;
+			border-top: 1px solid var(--og-border-color);
+			border-bottom: 1px solid var(--og-border-color);
+			display: flex;
+			flex-direction: row;
+		}
+	`];
+__decorate([
+    property({ type: Number })
+], ThemeItemEditor.prototype, "index", void 0);
+__decorate([
+    property({ type: Object })
+], ThemeItemEditor.prototype, "themeItem", void 0);
+__decorate([
+    property({ type: String })
+], ThemeItemEditor.prototype, "itemType", void 0);
+__decorate([
+    property({ type: Object })
+], ThemeItemEditor.prototype, "editor", void 0);
+__decorate([
+    query('.move-handle')
+], ThemeItemEditor.prototype, "moveHandle", void 0);
+__decorate([
+    query('og-editor-ruleeditor')
+], ThemeItemEditor.prototype, "ruleEditor", void 0);
+__decorate([
+    query('og-editor-styleeditor')
+], ThemeItemEditor.prototype, "styleEditor", void 0);
+ThemeItemEditor = __decorate([
+    customElement('og-editor-themeitem')
+], ThemeItemEditor);
+export { ThemeItemEditor };
+//# sourceMappingURL=themeItemEditor.js.map

package/dist/ui/editors/themeItemEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeItemEditor.js","sourceRoot":"","sources":["../../../src/ui/editors/themeItemEditor.ts"],"names":[],"mappings":"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"}

package/dist/ui/forms/ruleForm.d.ts

@@ -1,28 +1,13 @@
-import { DropdownColorPicker, DropdownList, Input, MenuItem, events } from '@omegagrid/core';
+import { Input } from '@omegagrid/core';
 import { ConditionalFormat, GridModel } from '@omegagrid/grid';
 import { LitElement } from 'lit';
-import { StyleForm } from './styleForm';
-import { RuleThreshold } from './ruleFormThreshold';
 export declare class RuleForm extends LitElement {
     static styles: import("lit").CSSResult[];
     model: GridModel;
     format: ConditionalFormat;
     rangesInput: Input;
     conditionInput: Input;
-    cminInput: DropdownColorPicker;
-    cmidInput: DropdownColorPicker;
-    cmaxInput: DropdownColorPicker;
-    colorInput: DropdownColorPicker;
-    iconList: DropdownList;
-    styleForm: StyleForm;
-    thresholds: NodeListOf<RuleThreshold>;
-    _onStyleChange(e: events.ChangeEvent, format: ConditionalFormat): void;
     updateFormat(): void;
-    renderFormulaForm: () => import("lit-html").TemplateResult<1>;
-    renderScaleForm: () => import("lit-html").TemplateResult<1>;
-    renderBarForm: () => import("lit-html").TemplateResult<1>;
-    iconItemRenderer: (div: HTMLDivElement, index: number, item: MenuItem) => import("lit-html").TemplateResult<1>;
-    renderIconForm: () => import("lit-html").TemplateResult<1>;
     render: () => import("lit-html").TemplateResult<1>;
 }
 //# sourceMappingURL=ruleForm.d.ts.map

package/dist/ui/forms/ruleForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ruleForm.d.ts","sourceRoot":"","sources":["../../../src/ui/forms/ruleForm.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,KAAK,EAAE,QAAQ,EAAU,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAErG,OAAO,EAAa,iBAAiB,EAA6B,SAAS,EAAY,MAAM,iBAAiB,CAAC;AAC/G,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAKvC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD,qBACa,QAAS,SAAQ,UAAU;IAEvC,MAAM,CAAC,MAAM,4BAAW;IAGxB,KAAK,EAAE,SAAS,CAAC;IAGjB,MAAM,EAAE,iBAAiB,CAAC;IAG1B,WAAW,EAAE,KAAK,CAAC;IAGnB,cAAc,EAAE,KAAK,CAAC;IAGtB,SAAS,EAAE,mBAAmB,CAAC;IAG/B,SAAS,EAAE,mBAAmB,CAAC;IAG/B,SAAS,EAAE,mBAAmB,CAAC;IAG/B,UAAU,EAAE,mBAAmB,CAAC;IAGhC,QAAQ,EAAE,YAAY,CAAC;IAGvB,SAAS,EAAE,SAAS,CAAC;IAGrB,UAAU,EAAE,UAAU,CAAC,aAAa,CAAC,CAAC;IAEtC,cAAc,CAAC,CAAC,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,EAAE,iBAAiB;IAI/D,YAAY;IA4CZ,iBAAiB,6CAqBf;IAEF,eAAe,6CAwBb;IAEF,aAAa,6CAUX;IAEF,gBAAgB,QAAS,cAAc,SAAS,MAAM,QAAQ,QAAQ,0CAMpE;IAEF,cAAc,6CA2BZ;IAEF,MAAM,6CAkBG;CACT"}
+{"version":3,"file":"ruleForm.d.ts","sourceRoot":"","sources":["../../../src/ui/forms/ruleForm.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAExC,OAAO,EAAa,iBAAiB,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAIvC,qBACa,QAAS,SAAQ,UAAU;IAEvC,MAAM,CAAC,MAAM,4BAAW;IAGxB,KAAK,EAAE,SAAS,CAAC;IAGjB,MAAM,EAAE,iBAAiB,CAAC;IAG1B,WAAW,EAAE,KAAK,CAAC;IAGnB,cAAc,EAAE,KAAK,CAAC;IAEtB,YAAY;IAMZ,MAAM,6CAaG;CACT"}

package/dist/ui/forms/ruleForm.js

@@ -4,110 +4,14 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { colors } from '@omegagrid/core';
-import { customElement, property, query, queryAll } from 'lit/decorators.js';
-import { CellRange, iconSets } from '@omegagrid/grid';
+import { customElement, property, query } from 'lit/decorators.js';
+import { CellRange } from '@omegagrid/grid';
 import { html, LitElement } from 'lit';
 import { style } from './ruleForm.style';
 import { msg } from '@omegagrid/localize';
-import { choose } from 'lit/directives/choose.js';
-import { map } from 'lit/directives/map.js';
 let RuleForm = class RuleForm extends LitElement {
     constructor() {
         super(...arguments);
-        this.renderFormulaForm = () => html `
-		<div class="row">${msg('Condition')}</div>
-
-		<div class="row">
-			<og-input
-				id="condition"
-				.value="${this.format.condition || ''}"
-				style="width: 100%"
-				@change="${() => this.updateFormat()}">
-			</og-input>
-		</div>
-
-		<div class="row">${msg('Style')}</div>
-
-		<div class="row">
-			<og-editor-form-style
-				id="style"
-				.data="${this.format.style || {}}"
-				@change="${() => this.updateFormat()}">
-			</og-editor-form-style>
-		</div>
-	`;
-        this.renderScaleForm = () => html `
-		<div class="row">${msg('Colors')}</div>
-		<div class="row" style="display: flex; gap: 4px;">
-			<og-dropdown-colorpicker
-				id="cmin"
-				style="flex: 1"
-				.value="${colors.css(this.format.cmin?.color)}"
-				@change="${() => this.updateFormat()}">
-			</og-dropdown-colorpicker>
-
-			<og-dropdown-colorpicker
-				id="cmid"
-				style="flex: 1"
-				.value="${colors.css(this.format.cmid?.color)}"
-				@change="${() => this.updateFormat()}">
-			</og-dropdown-colorpicker>
-
-			<og-dropdown-colorpicker
-				id="cmax"
-				style="flex: 1"
-				.value="${colors.css(this.format.cmax?.color)}"
-				@change="${() => this.updateFormat()}">
-			</og-dropdown-colorpicker>
-		</div>
-	`;
-        this.renderBarForm = () => html `
-		<div class="row">${msg('Color')}</div>
-		<div class="row" style="display: flex; gap: 4px;">
-			<og-dropdown-colorpicker
-				id="color"
-				style="flex: 1"
-				.value="${colors.css(this.format.color)}"
-				@change="${() => this.updateFormat()}">
-			</og-dropdown-colorpicker>
-		</div>
-	`;
-        this.iconItemRenderer = (div, index, item) => html `
-		<div style="padding-left: 5px">
-			${map(iconSets.get(item.key), icon => html `
-				<og-icon .icon="${icon}"></og-icon>
-			`)}&nbsp;(${item.key})
-		</div>
-	`;
-        this.renderIconForm = () => html `
-		<div class="row">${msg('Icons')}</div>
-		<div class="row" style="display: flex; gap: 4px;">
-			<og-dropdown-list
-				id="icons"
-				style="flex: 1"
-				.items="${Array.from(iconSets.entries()).map(item => ({
-            key: item[0],
-            value: item[0],
-            renderer: this.iconItemRenderer
-        }))}"
-				.value="${this.format.v}"
-				@change="${() => this.updateFormat()}">
-			</og-dropdown-list>
-		</div>
-		${this.format.v && iconSets.has(this.format.v) ? html `
-			<div class="row">${msg('Thresholds')}</div>
-			<div style="display: flex; flex-direction: column; gap: 2px; margin-top: 2px">
-				${map(iconSets.get(this.format.v), (_icon, i) => html `
-					<og-editor-rule-threshold
-						.value="${this.format?.thresh[i]}" 
-						?first="${i == 0}"
-						@change="${() => this.updateFormat()}">
-					</og-editor-rule-threshold>
-				`)}
-			</div>
-		` : ''}
-	`;
         this.render = () => this.format ? html `
 		<div class="row">${msg('Range')}</div>
 
@@ -120,70 +24,16 @@ let RuleForm = class RuleForm extends LitElement {
 			</og-input>
 		</div>
 
-		${choose(this.format.type, [
-            ['formula', this.renderFormulaForm],
-            ['scale', this.renderScaleForm],
-            ['bar', this.renderBarForm],
-            ['icon', this.renderIconForm],
-        ])}
+		<og-editor-ruleeditor .format="${this.format}"></og-editor-ruleeditor>
 	` : null;
     }
-    _onStyleChange(e, format) {
-        format.style = this.model.styles.add(e.value);
-    }
     updateFormat() {
         if (!this.format)
             return;
-        let update = false;
-        if (this.conditionInput)
-            this.format.condition = this.conditionInput.value;
-        else
-            this.format.condition = null;
         if (this.rangesInput)
             this.format.ranges = CellRange.fromA1s(this.rangesInput.value);
         else
             this.format.ranges = null;
-        if (this.styleForm)
-            this.format.style = this.styleForm.data;
-        else
-            this.format.style = null;
-        if (this.cminInput) {
-            this.format.cmin = this.format.cmin ?? {};
-            this.format.cmin.t = 'min';
-            this.format.cmin.color = colors.plainHex(this.cminInput.value);
-        }
-        else
-            this.format.cmin = null;
-        if (this.cmidInput) {
-            this.format.cmid = this.format.cmid ?? {};
-            this.format.cmid.color = colors.plainHex(this.cmidInput.value);
-        }
-        else
-            this.format.cmid = null;
-        if (this.cmaxInput) {
-            this.format.cmax = this.format.cmax ?? {};
-            this.format.cmax.t = 'max';
-            this.format.cmax.color = colors.plainHex(this.cmaxInput.value);
-        }
-        else
-            this.format.cmax = null;
-        if (this.colorInput)
-            this.format.color = colors.plainHex(this.colorInput.value);
-        else
-            this.format.color = null;
-        if (this.iconList) {
-            if (this.format.v != this.iconList.value)
-                update = true;
-            this.format.v = this.iconList.value;
-        }
-        else
-            this.format.v = null;
-        if (this.thresholds)
-            this.format.thresh = Array.from(this.thresholds).map(t => t.value);
-        else
-            this.format.thresh = null;
-        if (update)
-            this.requestUpdate();
     }
 };
 RuleForm.styles = [style];
@@ -199,27 +49,6 @@ __decorate([
 __decorate([
     query('og-input#condition')
 ], RuleForm.prototype, "conditionInput", void 0);
-__decorate([
-    query('og-dropdown-colorpicker#cmin')
-], RuleForm.prototype, "cminInput", void 0);
-__decorate([
-    query('og-dropdown-colorpicker#cmid')
-], RuleForm.prototype, "cmidInput", void 0);
-__decorate([
-    query('og-dropdown-colorpicker#cmax')
-], RuleForm.prototype, "cmaxInput", void 0);
-__decorate([
-    query('og-dropdown-colorpicker#color')
-], RuleForm.prototype, "colorInput", void 0);
-__decorate([
-    query('og-dropdown-list#icons')
-], RuleForm.prototype, "iconList", void 0);
-__decorate([
-    query('og-editor-form-style#style')
-], RuleForm.prototype, "styleForm", void 0);
-__decorate([
-    queryAll('og-editor-rule-threshold')
-], RuleForm.prototype, "thresholds", void 0);
 RuleForm = __decorate([
     customElement('og-editor-form-rule')
 ], RuleForm);