@omegagrid/editor 0.10.2 → 0.10.5

package/dist/ui/toolbar.js

@@ -0,0 +1,356 @@
+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 { actions } from '@omegagrid/core';
+import { CellModel } from '@omegagrid/grid';
+import { LitElement, html } from 'lit';
+import { customElement, property, query } from 'lit/decorators.js';
+import { toolbar1Config, toolbar2Config, toolbar3Config, toolbar4Config } from './toolbar.config';
+import { style } from './toolbar.style';
+import { EditorEvent } from './editor';
+let EditorToolbar = class EditorToolbar extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.toolbar1Config = toolbar1Config;
+        this.toolbar2Config = toolbar2Config;
+        this.toolbar3Config = toolbar3Config;
+        this.toolbar4Config = toolbar4Config;
+        this._borderColor = 'ff0000';
+        this._onGridEdit = (_e) => {
+            this.updateToolbar();
+        };
+        this._onToolbarAction = (e) => {
+            if (!this.grid)
+                return;
+            let { key, value } = e.action;
+            key = key ?? '';
+            let hideSelector = false;
+            let isStyleProperty = false;
+            const isPreview = e.action.type == 'preview';
+            const isPreviewEnd = e.action.type == 'previewEnd';
+            if (key == 'theme') {
+                this.grid.model.applyTheme(this.editor.gridContainer.model.themes.get(value), true);
+                this.grid.refresh();
+                return;
+            }
+            else if (key == 'undo') {
+                this.grid.editing.undo();
+                this.updateToolbar();
+                return;
+            }
+            else if (key == 'redo') {
+                this.grid.editing.redo();
+                this.updateToolbar();
+                return;
+            }
+            else if (key == 'merge') {
+                if (value) {
+                    this.grid.editing.merge();
+                }
+                else {
+                    this.grid.editing.unmerge();
+                }
+            }
+            else if (key == 'wrap') {
+                isStyleProperty = true;
+            }
+            else if (['color', 'fgColor', 'bgColor'].indexOf(key) > -1) {
+                value = value ? value.substring(1) : '';
+                hideSelector = true;
+                isStyleProperty = true;
+            }
+            else if (['bold', 'italic', 'underline'].indexOf(key) > -1) {
+                isStyleProperty = true;
+            }
+            else if (key.startsWith('borderColor')) {
+                this._borderColor = value;
+            }
+            else if (key.startsWith('align')) {
+                isStyleProperty = true;
+            }
+            else if (key.startsWith('border')) {
+                isStyleProperty = true;
+                hideSelector = true;
+            }
+            else if (key == 'sz') {
+                isStyleProperty = true;
+            }
+            if (isPreview || isPreviewEnd) {
+                for (const cell of this.grid.model.getRangeIterator(this.grid.selection.range, isPreview)) {
+                    this.applyProperty(cell, e.action, value, isStyleProperty);
+                }
+            }
+            else {
+                this.gridElements?.forEach(elm => this.applyProperty(elm, e.action, value, isStyleProperty));
+            }
+            if (isPreview && hideSelector) {
+                this.grid.selecting.hideSelector();
+            }
+            else if (isPreviewEnd) {
+                this.grid.selecting.showSelector();
+            }
+            else {
+                this.updateToolbar();
+            }
+            this.grid.rendering.updateCellSelectionRange();
+            this.grid.focus();
+            if (key == 'config') {
+                this.editor.rightSidebarComponent = value ? 'config' : null;
+                this.updateToolbar();
+            }
+            else if (key == 'headers') {
+                this.editor.rightSidebarComponent = value ? 'headers' : null;
+                this.updateToolbar();
+            }
+            else if (key == 'rules') {
+                this.editor.rightSidebarComponent = value ? 'rules' : null;
+                this.updateToolbar();
+            }
+            else if (key == 'sparklines') {
+                this.editor.rightSidebarComponent = value ? 'sparklines' : null;
+                this.updateToolbar();
+            }
+            else if (key == 'names') {
+                this.editor.rightSidebarComponent = value ? 'names' : null;
+                this.updateToolbar();
+            }
+            else if (key == 'themes') {
+                this.editor.rightSidebarComponent = value ? 'themes' : null;
+                this.updateToolbar();
+            }
+            this.dispatchEvent(new actions.ActionEvent('editor.toolbar', e.action));
+        };
+        this.render = () => {
+            const toolbar1Config = this.getToolbar1Config();
+            const toolbar2Config = this.getToolbar2Config();
+            const toolbar3Config = this.getToolbar3Config();
+            const toolbar4Config = this.getToolbar4Config();
+            return html `
+			${toolbar1Config.length > 0 ? html `
+				<og-toolbar
+					id="toolbar1"
+					.items="${toolbar1Config}"
+					.values="${this.getToolbarValues()}"
+					@toolbar.action="${this._onToolbarAction}">
+				</og-toolbar>
+	
+				<div class="spacer">&nbsp;</div>
+			` : ''}
+
+			${toolbar2Config.length > 0 ? html `
+				<og-toolbar
+					id="toolbar2"
+					.items="${toolbar2Config}"
+					.values="${this.getToolbarValues()}"
+					@toolbar.action="${this._onToolbarAction}">
+				</og-toolbar>
+				
+				<div class="spacer">&nbsp;</div>
+			` : ''}
+
+			${toolbar3Config.length > 0 ? html `
+				<og-toolbar
+					id="toolbar3"
+					.items="${toolbar3Config}"
+					.values="${this.getToolbarValues()}"
+					@toolbar.action="${this._onToolbarAction}">
+				</og-toolbar>
+
+				<div class="spacer">&nbsp;</div>
+			` : ''}
+
+			${toolbar4Config.length > 0 ? html `
+				<og-toolbar
+					id="toolbar4"
+					.items="${toolbar4Config}"
+					.values="${this.getToolbarValues()}"
+					@toolbar.action="${this._onToolbarAction}">
+				</og-toolbar>
+			` : ''}
+		`;
+        };
+    }
+    get gridElement() { return this.gridElements?.length > 0 ? this.gridElements[0] : null; }
+    filterToolbarItems(items) {
+        return items.filter(item => {
+            switch (item.id) {
+                case 'undo':
+                case 'redo':
+                    return this.grid?.history;
+                case 'headers':
+                    return this.editor?.options.editing.headers;
+                case 'rules':
+                    return this.editor?.options.editing.conditionalStyles;
+                case 'sparklines':
+                    return this.editor?.options.editing.sparklines;
+                case 'names':
+                    return this.editor?.options.editing.names;
+                case 'theme':
+                case 'themes':
+                    return this.editor?.gridContainer?.model?.themes.size > 0;
+                default:
+                    return true;
+            }
+        });
+    }
+    getToolbar1Config() {
+        toolbar1Config[0].disabled = !this.grid?.history || this.grid.history.stack.length == 0;
+        toolbar1Config[1].disabled = !this.grid?.history || this.grid.history.restack.length == 0;
+        return this.filterToolbarItems(this.toolbar1Config);
+    }
+    getToolbar2Config() {
+        const items = this.filterToolbarItems(this.toolbar2Config);
+        if (items.length > 0) {
+            const themes = this.editor.gridContainer.model.themes;
+            items[0].items = Array.from(themes.values()).map(t => ({ k: t.name, v: t.name }));
+        }
+        return items;
+    }
+    getToolbar3Config() {
+        return this.filterToolbarItems(this.toolbar3Config);
+    }
+    getToolbar4Config() {
+        return this.filterToolbarItems(this.toolbar4Config);
+    }
+    willUpdate(props) {
+        if (props.has('editor')) {
+            props.get('editor')?.removeEventListener('grid.edit', this._onGridEdit);
+            this.editor?.addEventListener('grid.edit', this._onGridEdit);
+        }
+    }
+    firstUpdated() {
+        this.dispatchEvent(new EditorEvent('toolbar.init', { editor: this.editor }));
+    }
+    getToolbarValues() {
+        const values = Object.assign({}, this.gridElement?.composedStyle);
+        if (values.color)
+            values.color = '#' + values.color;
+        if (values.fgColor)
+            values.fgColor = '#' + values.fgColor;
+        if (values.bgColor)
+            values.bgColor = '#' + values.bgColor;
+        if (values.alignment && values.alignment.wrapText)
+            values.wrap = true;
+        if (this.gridElement) {
+            values.type = this.gridElement.type;
+            values.merge = this.gridElement instanceof CellModel ? this.gridElement.merge : false;
+            values.format = this.gridElement.format;
+            values.hyperlink = this.gridElement instanceof CellModel ? this.gridElement.hyperlink : null;
+        }
+        values.config = this.editor?.rightSidebarComponent == 'config';
+        values.headers = this.editor?.rightSidebarComponent == 'headers';
+        values.rules = this.editor?.rightSidebarComponent == 'rules';
+        values.sparklines = this.editor?.rightSidebarComponent == 'sparklines';
+        values.names = this.editor?.rightSidebarComponent == 'names';
+        values.themes = this.editor?.rightSidebarComponent == 'themes';
+        return values;
+    }
+    getCellBorderStyles(element, range, value, borderType) {
+        const color = this._borderColor.length > 6 ? this._borderColor.substring(1) : this._borderColor;
+        const styles = {};
+        if (value.top)
+            value.top.color = color;
+        if (value.right)
+            value.right.color = color;
+        if (value.bottom)
+            value.bottom.color = color;
+        if (value.left)
+            value.left.color = color;
+        styles.bottom = value.bottom && ((element instanceof CellModel && element.r == range.r2) || borderType == 'borderAll') ? value.bottom : null;
+        styles.top = value.top && ((element instanceof CellModel && element.r == range.r1) || borderType == 'borderAll') ? value.top : null;
+        styles.left = value.left && ((element instanceof CellModel && element.c == range.c1) || borderType == 'borderAll') ? value.left : null;
+        styles.right = value.right && ((element instanceof CellModel && element.c == range.c2) || borderType == 'borderAll') ? value.right : null;
+        return styles;
+    }
+    applyProperty(target, action, value, isStyleProperty) {
+        let { key } = action;
+        const isPreview = action.type == 'preview';
+        if (isPreview && target instanceof CellModel)
+            target.invalidateStyle();
+        if (key.startsWith('align')) {
+            value = Object.assign(this.gridElement?.composedStyle?.alignment ?? {}, value);
+            key = 'alignment';
+        }
+        else if (key == 'type') {
+            target.type = value;
+        }
+        else if (key == 'format') {
+            target.format = value;
+        }
+        else if (key == 'hyperlink') {
+            target.hyperlink = value;
+        }
+        else if (key == 'wrap') {
+            value = Object.assign(this.gridElement?.composedStyle?.alignment ?? {}, { wrapText: !!value });
+            key = 'alignment';
+        }
+        if (isStyleProperty) {
+            if (action.type == 'previewEnd') {
+                if (target instanceof CellModel)
+                    target.invalidateStyle();
+            }
+            else if (key.startsWith('border')) {
+                const borderStyles = this.getCellBorderStyles(target, this.grid.selection.range, value, key);
+                if (isPreview) {
+                    if (target instanceof CellModel)
+                        target.previewStyleProperties(borderStyles);
+                }
+                else {
+                    target.setStyleProperties(borderStyles);
+                }
+            }
+            else if (isPreview) {
+                if (target instanceof CellModel)
+                    target.previewStyleProperties({ [key]: value });
+            }
+            else {
+                target.setStyleProperties({ [key]: value });
+            }
+        }
+    }
+    async updateToolbar() {
+        this.requestUpdate();
+    }
+};
+EditorToolbar.styles = [style];
+__decorate([
+    query('#toolbar1')
+], EditorToolbar.prototype, "toolbar1", void 0);
+__decorate([
+    query('#toolbar2')
+], EditorToolbar.prototype, "toolbar2", void 0);
+__decorate([
+    query('#toolbar3')
+], EditorToolbar.prototype, "toolbar3", void 0);
+__decorate([
+    query('#toolbar4')
+], EditorToolbar.prototype, "toolbar4", void 0);
+__decorate([
+    property({ type: Object })
+], EditorToolbar.prototype, "grid", void 0);
+__decorate([
+    property({ type: Object })
+], EditorToolbar.prototype, "editor", void 0);
+__decorate([
+    property({ type: Array })
+], EditorToolbar.prototype, "gridElements", void 0);
+__decorate([
+    property({ type: Array })
+], EditorToolbar.prototype, "toolbar1Config", void 0);
+__decorate([
+    property({ type: Array })
+], EditorToolbar.prototype, "toolbar2Config", void 0);
+__decorate([
+    property({ type: Array })
+], EditorToolbar.prototype, "toolbar3Config", void 0);
+__decorate([
+    property({ type: Array })
+], EditorToolbar.prototype, "toolbar4Config", void 0);
+EditorToolbar = __decorate([
+    customElement('og-editor-toolbar')
+], EditorToolbar);
+export { EditorToolbar };
+//# sourceMappingURL=toolbar.js.map

package/dist/ui/toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbar.js","sourceRoot":"","sources":["../../src/ui/toolbar.ts"],"names":[],"mappings":"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","sourcesContent":["import { actions, UIValueType } from '@omegagrid/core';\nimport { Alignment, Border, CellModel, ElementModel, Grid, GridEditEvent, Style } from '@omegagrid/grid';\nimport { LitElement, html } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { Toolbar, ToolbarItem } from '@omegagrid/toolbar';\nimport { CellRange } from '@omegagrid/grid';\nimport { toolbar1Config, toolbar2Config, toolbar3Config, toolbar4Config } from './toolbar.config';\nimport { style } from './toolbar.style';\nimport { Editor, EditorEvent } from './editor';\n\n@customElement('og-editor-toolbar')\nexport class EditorToolbar extends LitElement {\n\n\tstatic styles = [style];\n\n\t@query('#toolbar1')\n\ttoolbar1: Toolbar;\n\n\t@query('#toolbar2')\n\ttoolbar2: Toolbar;\n\n\t@query('#toolbar3')\n\ttoolbar3: Toolbar;\n\n\t@query('#toolbar4')\n\ttoolbar4: Toolbar;\n\n\t@property({type: Object})\n\tgrid: Grid;\n\n\t@property({type: Object})\n\teditor: Editor;\n\n\t@property({type: Array})\n\tgridElements: ElementModel[];\n\n\t@property({type: Array})\n\ttoolbar1Config = toolbar1Config;\n\n\t@property({type: Array})\n\ttoolbar2Config = toolbar2Config;\n\n\t@property({type: Array})\n\ttoolbar3Config = toolbar3Config;\n\n\t@property({type: Array})\n\ttoolbar4Config = toolbar4Config;\n\n\tget gridElement() { return this.gridElements?.length > 0 ? this.gridElements[0] : null}\n\n\t_borderColor = 'ff0000';\n\n\tfilterToolbarItems(items: ToolbarItem[]) {\n\t\treturn items.filter(item => {\n\t\t\tswitch (item.id) {\n\t\t\t\tcase 'undo':\n\t\t\t\tcase 'redo':\n\t\t\t\t\treturn this.grid?.history;\n\t\t\t\tcase 'headers':\n\t\t\t\t\treturn this.editor?.options.editing.headers;\n\t\t\t\tcase 'rules':\n\t\t\t\t\treturn this.editor?.options.editing.conditionalStyles;\n\t\t\t\tcase 'sparklines':\n\t\t\t\t\treturn this.editor?.options.editing.sparklines;\n\t\t\t\tcase 'names':\n\t\t\t\t\treturn this.editor?.options.editing.names;\n\t\t\t\tcase 'theme':\n\t\t\t\tcase 'themes':\n\t\t\t\t\treturn this.editor?.gridContainer?.model?.themes.size > 0;\n\t\t\t\tdefault:\n\t\t\t\t\treturn true;\n\t\t\t}\n\t\t});\n\t}\n\n\tgetToolbar1Config() {\n\t\ttoolbar1Config[0].disabled = !this.grid?.history || this.grid.history.stack.length == 0;\n\t\ttoolbar1Config[1].disabled = !this.grid?.history || this.grid.history.restack.length == 0;\n\t\treturn this.filterToolbarItems(this.toolbar1Config);\n\t}\n\n\tgetToolbar2Config() {\n\t\tconst items = this.filterToolbarItems(this.toolbar2Config);\n\t\tif (items.length > 0) {\n\t\t\tconst themes = this.editor.gridContainer.model.themes; \n\t\t\titems[0].items = Array.from(themes.values()).map(t => ({k: t.name, v: t.name}));\n\t\t}\n\t\treturn items;\n\t}\n\n\tgetToolbar3Config() {\n\t\treturn this.filterToolbarItems(this.toolbar3Config);\n\t}\n\n\tgetToolbar4Config() {\n\t\treturn this.filterToolbarItems(this.toolbar4Config);\n\t}\n\n\t_onGridEdit = (_e: GridEditEvent) => {\n\t\tthis.updateToolbar();\n\t}\n\n\twillUpdate(props: Map<PropertyKey, unknown>) {\n\t\tif (props.has('editor')) {\n\t\t\t(props.get('editor') as Editor)?.removeEventListener('grid.edit', this._onGridEdit);\n\t\t\tthis.editor?.addEventListener('grid.edit', this._onGridEdit);\n\t\t}\n\t}\n\n\tfirstUpdated() {\n\t\tthis.dispatchEvent(new EditorEvent('toolbar.init', {editor: this.editor}));\n\t}\n\n\tgetToolbarValues() {\n\t\tconst values: Record<string, unknown> = Object.assign({}, this.gridElement?.composedStyle);\n\t\tif (values.color) values.color = '#' + values.color;\n\t\tif (values.fgColor) values.fgColor = '#' + values.fgColor;\n\t\tif (values.bgColor) values.bgColor = '#' + values.bgColor;\n\t\tif (values.alignment && (values.alignment as Alignment).wrapText) values.wrap = true;\n\t\t\n\t\tif (this.gridElement) {\n\t\t\tvalues.type = this.gridElement.type;\n\t\t\tvalues.merge = this.gridElement instanceof CellModel ? this.gridElement.merge : false;\n\t\t\tvalues.format = this.gridElement.format;\n\t\t\tvalues.hyperlink = this.gridElement instanceof CellModel ? (this.gridElement as CellModel).hyperlink : null;\n\t\t}\n\n\t\tvalues.config = this.editor?.rightSidebarComponent == 'config';\n\t\tvalues.headers = this.editor?.rightSidebarComponent == 'headers';\n\t\tvalues.rules = this.editor?.rightSidebarComponent == 'rules';\n\t\tvalues.sparklines = this.editor?.rightSidebarComponent == 'sparklines';\n\t\tvalues.names = this.editor?.rightSidebarComponent == 'names';\n\t\tvalues.themes = this.editor?.rightSidebarComponent == 'themes';\n\t\treturn values;\n\t}\n\n\tgetCellBorderStyles(\n\t\telement: ElementModel,\n\t\trange: CellRange,\n\t\tvalue: {top?: Border, right?: Border, bottom?: Border, left?: Border},\n\t\tborderType: string,\n\t) {\n\t\tconst color = this._borderColor.length > 6 ? this._borderColor.substring(1) : this._borderColor;\n\t\tconst styles: Record<keyof Style, unknown> = {};\n\t\t\n\t\tif (value.top) value.top.color = color;\n\t\tif (value.right) value.right.color = color;\n\t\tif (value.bottom) value.bottom.color = color;\n\t\tif (value.left) value.left.color = color;\n\n\t\tstyles.bottom = value.bottom && ((element instanceof CellModel && element.r == range.r2) || borderType == 'borderAll') ? value.bottom : null\n\t\tstyles.top = value.top && ((element instanceof CellModel && element.r == range.r1) || borderType == 'borderAll') ? value.top : null;\n\t\tstyles.left = value.left && ((element instanceof CellModel && element.c == range.c1) || borderType == 'borderAll') ? value.left : null;\n\t\tstyles.right = value.right && ((element instanceof CellModel && element.c == range.c2) || borderType == 'borderAll') ? value.right : null;\n\t\treturn styles;\n\t}\n\n\tapplyProperty(target: ElementModel, action: actions.Action, value: unknown, isStyleProperty: boolean) {\n\t\tlet { key } = action;\n\t\tconst isPreview = action.type == 'preview';\n\t\tif (isPreview && target instanceof CellModel) target.invalidateStyle();\n\n\t\tif (key.startsWith('align')) {\n\t\t\tvalue = Object.assign(this.gridElement?.composedStyle?.alignment ?? {}, value);\n\t\t\tkey = 'alignment';\n\t\t} else if (key == 'type') {\n\t\t\ttarget.type = value as UIValueType;\n\t\t} else if (key == 'format') {\n\t\t\ttarget.format = value as string;\n\t\t} else if (key == 'hyperlink') {\n\t\t\t(target as CellModel).hyperlink = value as string;\n\t\t} else if (key == 'wrap') {\n\t\t\tvalue = Object.assign(this.gridElement?.composedStyle?.alignment ?? {}, {wrapText: !!value});\n\t\t\tkey = 'alignment';\n\t\t}\n\n\t\tif (isStyleProperty) {\n\t\t\tif (action.type == 'previewEnd') {\n\t\t\t\tif (target instanceof CellModel) target.invalidateStyle();\n\t\t\t} else if (key.startsWith('border')) {\n\t\t\t\tconst borderStyles = this.getCellBorderStyles(target, this.grid.selection.range, value, key);\n\t\t\t\tif (isPreview) {\n\t\t\t\t\tif (target instanceof CellModel) target.previewStyleProperties(borderStyles);\n\t\t\t\t} else {\n\t\t\t\t\ttarget.setStyleProperties(borderStyles);\n\t\t\t\t}\n\t\t\t} else if (isPreview) {\n\t\t\t\tif (target instanceof CellModel) target.previewStyleProperties({[key]: value});\n\t\t\t} else {\n\t\t\t\ttarget.setStyleProperties({[key]: value});\n\t\t\t}\n\t\t}\n\t}\n\n\tasync updateToolbar() {\n\t\tthis.requestUpdate();\n\t}\n\n\t_onToolbarAction = (e: actions.ActionEvent) => {\n\t\tif (!this.grid) return;\n\n\t\tlet { key, value } = e.action;\n\t\tkey = key ?? '';\n\t\tlet hideSelector = false;\n\t\tlet isStyleProperty = false;\n\t\tconst isPreview = e.action.type == 'preview';\n\t\tconst isPreviewEnd = e.action.type == 'previewEnd';\n\n\t\tif (key == 'theme') {\n\t\t\tthis.grid.model.applyTheme(this.editor.gridContainer.model.themes.get(value as string), true);\n\t\t\tthis.grid.refresh();\n\t\t\treturn;\n\t\t} else if (key == 'undo') {\n\t\t\tthis.grid.editing.undo();\n\t\t\tthis.updateToolbar();\n\t\t\treturn;\n\t\t} else if (key == 'redo') {\n\t\t\tthis.grid.editing.redo();\n\t\t\tthis.updateToolbar();\n\t\t\treturn;\n\t\t} else if (key == 'merge') {\n\t\t\tif (value) {\n\t\t\t\tthis.grid.editing.merge();\n\t\t\t} else {\n\t\t\t\tthis.grid.editing.unmerge();\n\t\t\t}\n\t\t} else if (key == 'wrap') {\n\t\t\tisStyleProperty = true;\n\t\t} else if (['color', 'fgColor', 'bgColor'].indexOf(key) > -1) {\n\t\t\tvalue = value ? (value as string).substring(1) : '';\n\t\t\thideSelector = true;\n\t\t\tisStyleProperty = true;\n\t\t} else if (['bold', 'italic', 'underline'].indexOf(key) > -1) {\n\t\t\tisStyleProperty = true;\n\t\t} else if (key.startsWith('borderColor')) {\n\t\t\tthis._borderColor = value as string;\n\t\t} else if (key.startsWith('align')) {\n\t\t\tisStyleProperty = true;\n\t\t} else if (key.startsWith('border')) {\n\t\t\tisStyleProperty = true;\n\t\t\thideSelector = true;\n\t\t} else if (key == 'sz') {\n\t\t\tisStyleProperty = true;\n\t\t}\n\n\t\tif (isPreview || isPreviewEnd) {\n\t\t\tfor (const cell of this.grid.model.getRangeIterator(this.grid.selection.range, isPreview)) {\n\t\t\t\tthis.applyProperty(cell, e.action, value, isStyleProperty);\n\t\t\t}\n\t\t} else {\n\t\t\tthis.gridElements?.forEach(elm => this.applyProperty(elm, e.action, value, isStyleProperty));\n\t\t}\n\n\t\tif (isPreview && hideSelector) {\n\t\t\tthis.grid.selecting.hideSelector();\n\t\t} else if (isPreviewEnd) {\n\t\t\tthis.grid.selecting.showSelector();\n\t\t} else {\n\t\t\tthis.updateToolbar();\n\t\t}\n\t\t\n\t\tthis.grid.rendering.updateCellSelectionRange();\n\t\tthis.grid.focus();\n\n\t\tif (key == 'config') {\n\t\t\tthis.editor.rightSidebarComponent = value ? 'config' : null;\n\t\t\tthis.updateToolbar();\n\t\t} else if (key == 'headers') {\n\t\t\tthis.editor.rightSidebarComponent = value ? 'headers' : null;\n\t\t\tthis.updateToolbar();\n\t\t} else if (key == 'rules') {\n\t\t\tthis.editor.rightSidebarComponent = value ? 'rules' : null;\n\t\t\tthis.updateToolbar();\n\t\t} else if (key == 'sparklines') {\n\t\t\tthis.editor.rightSidebarComponent = value ? 'sparklines' : null;\n\t\t\tthis.updateToolbar();\n\t\t} else if (key == 'names') {\n\t\t\tthis.editor.rightSidebarComponent = value ? 'names' : null;\n\t\t\tthis.updateToolbar();\n\t\t} else if (key == 'themes') {\n\t\t\tthis.editor.rightSidebarComponent = value ? 'themes' : null;\n\t\t\tthis.updateToolbar();\n\t\t}\n\n\t\tthis.dispatchEvent(new actions.ActionEvent('editor.toolbar', e.action));\n\t}\n\n\trender = () => {\n\t\tconst toolbar1Config = this.getToolbar1Config();\n\t\tconst toolbar2Config = this.getToolbar2Config();\n\t\tconst toolbar3Config = this.getToolbar3Config();\n\t\tconst toolbar4Config = this.getToolbar4Config();\n\t\treturn html`\n\t\t\t${toolbar1Config.length > 0 ? html`\n\t\t\t\t<og-toolbar\n\t\t\t\t\tid=\"toolbar1\"\n\t\t\t\t\t.items=\"${toolbar1Config}\"\n\t\t\t\t\t.values=\"${this.getToolbarValues()}\"\n\t\t\t\t\t@toolbar.action=\"${this._onToolbarAction}\">\n\t\t\t\t</og-toolbar>\n\t\n\t\t\t\t<div class=\"spacer\">&nbsp;</div>\n\t\t\t` : ''}\n\n\t\t\t${toolbar2Config.length > 0 ? html`\n\t\t\t\t<og-toolbar\n\t\t\t\t\tid=\"toolbar2\"\n\t\t\t\t\t.items=\"${toolbar2Config}\"\n\t\t\t\t\t.values=\"${this.getToolbarValues()}\"\n\t\t\t\t\t@toolbar.action=\"${this._onToolbarAction}\">\n\t\t\t\t</og-toolbar>\n\t\t\t\t\n\t\t\t\t<div class=\"spacer\">&nbsp;</div>\n\t\t\t` : ''}\n\n\t\t\t${toolbar3Config.length > 0 ? html`\n\t\t\t\t<og-toolbar\n\t\t\t\t\tid=\"toolbar3\"\n\t\t\t\t\t.items=\"${toolbar3Config}\"\n\t\t\t\t\t.values=\"${this.getToolbarValues()}\"\n\t\t\t\t\t@toolbar.action=\"${this._onToolbarAction}\">\n\t\t\t\t</og-toolbar>\n\n\t\t\t\t<div class=\"spacer\">&nbsp;</div>\n\t\t\t` : ''}\n\n\t\t\t${toolbar4Config.length > 0 ? html`\n\t\t\t\t<og-toolbar\n\t\t\t\t\tid=\"toolbar4\"\n\t\t\t\t\t.items=\"${toolbar4Config}\"\n\t\t\t\t\t.values=\"${this.getToolbarValues()}\"\n\t\t\t\t\t@toolbar.action=\"${this._onToolbarAction}\">\n\t\t\t\t</og-toolbar>\n\t\t\t` : ''}\n\t\t`;\n\t}\n\n}"]}

package/dist/ui/toolbar.style.d.ts

@@ -0,0 +1,2 @@
+export declare const style: import("lit").CSSResult;
+//# sourceMappingURL=toolbar.style.d.ts.map

package/dist/ui/toolbar.style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbar.style.d.ts","sourceRoot":"","sources":["../../src/ui/toolbar.style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,KAAK,yBAmBjB,CAAC"}

package/dist/ui/toolbar.style.js

@@ -0,0 +1,22 @@
+import { css } from "lit";
+export const style = css `
+	* {
+		box-sizing: border-box;
+	}
+
+	:host {
+		display: flex;
+		flex-direction: row;
+	}
+
+	og-toolbar {
+		flex: 0;
+	}
+
+	.spacer {
+		flex: 1;
+		width: 10px;
+		background-color: var(--og-background-color-2);
+	}
+`;
+//# sourceMappingURL=toolbar.style.js.map

package/dist/ui/toolbar.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbar.style.js","sourceRoot":"","sources":["../../src/ui/toolbar.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;CAmBvB,CAAC","sourcesContent":["import { css } from \"lit\";\n\nexport const style = css`\n\t* {\n\t\tbox-sizing: border-box;\n\t}\n\n\t:host {\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t}\n\n\tog-toolbar {\n\t\tflex: 0;\n\t}\n\n\t.spacer {\n\t\tflex: 1;\n\t\twidth: 10px;\n\t\tbackground-color: var(--og-background-color-2);\n\t}\n`;"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omegagrid/editor",
-  "version": "0.10.2",
+  "version": "0.10.5",
   "license": "UNLICENSED",
   "description": "Spreadsheet editor",
   "main": "./dist/index.js",
@@ -27,15 +27,15 @@
     "_prepublish": "yarn test && yarn lint"
   },
   "dependencies": {
-    "@omegagrid/commands": "^0.10.2",
-    "@omegagrid/core": "^0.10.2",
-    "@omegagrid/form": "^0.10.2",
-    "@omegagrid/grid": "^0.10.2",
-    "@omegagrid/localize": "^0.10.2",
-    "@omegagrid/statusbar": "^0.10.2",
-    "@omegagrid/tabs": "^0.10.2",
-    "@omegagrid/toolbar": "^0.10.2",
-    "@omegagrid/tree": "^0.10.2",
+    "@omegagrid/commands": "^0.10.5",
+    "@omegagrid/core": "^0.10.5",
+    "@omegagrid/form": "^0.10.5",
+    "@omegagrid/grid": "^0.10.5",
+    "@omegagrid/localize": "^0.10.5",
+    "@omegagrid/statusbar": "^0.10.5",
+    "@omegagrid/tabs": "^0.10.5",
+    "@omegagrid/toolbar": "^0.10.5",
+    "@omegagrid/tree": "^0.10.5",
     "lit": "^3.1.1",
     "lit-html": "^3.1.1",
     "ts-debounce": "^4.0.0"