@omegagrid/code 0.10.2 → 0.10.5

package/dist/components/codeBlock.js

@@ -0,0 +1,211 @@
+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;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m") throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var _CodeBlock_languageAdapter, _CodeBlock_content;
+import { dom, events } from '@omegagrid/core';
+import { LitElement, css, html } from 'lit';
+import { customElement, query, property, state } from 'lit/decorators.js';
+import { TreeAdapter } from '@omegagrid/tree';
+import { getLanguages, validateLanguage } from '../utils';
+class LangTreeAdapter extends TreeAdapter {
+    async getTree() {
+        const languages = await getLanguages();
+        languages.sort();
+        return languages.map(lang => ({
+            k: lang,
+            v: lang,
+        }));
+    }
+    getOptions() {
+        return {
+            search: true,
+            selectMode: 'single',
+            autoClose: true
+        };
+    }
+}
+let CodeBlock = class CodeBlock extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.language = 'typescript';
+        this.dynamicHeight = false;
+        this.maxHeight = 400;
+        this.minHeight = 25;
+        this.disableToolbar = false;
+        this.editing = false;
+        _CodeBlock_languageAdapter.set(this, void 0);
+        _CodeBlock_content.set(this, void 0);
+        this._onChange = (_e) => {
+            this.updateHeight();
+        };
+        this._onLanguageChange = (e) => {
+            this.language = e.node.key;
+            this.dispatchEvent(new events.ChangeEvent({
+                type: 'changeLanguage',
+                value: this.language
+            }));
+        };
+        this.getEditorOptions = () => ({
+            scrollBeyondLastLine: !this.dynamicHeight,
+            ...this.editorOptions
+        });
+        this.render = () => html `
+		${!this.disableToolbar ? html `
+			<div class="toolbar">
+				<og-tree-dropdown 
+					@change="${this._onLanguageChange}"
+					.adapter="${this.languageAdapter}"
+					.value="${[[this.language, 0, 1]]}">
+				</og-tree-dropdown>
+			</div>
+		` : ''}
+
+		${this.editing ? html `
+			<og-code
+				.content="${this.content}"
+				.language="${this.language}"
+				.options="${this.getEditorOptions()}"
+				@code.change="${this._onChange}"
+				@code.ready="${() => this.updateHeight()}"
+				@code.blur="${() => {
+            __classPrivateFieldSet(this, _CodeBlock_content, this.editor.content, "f");
+            this.editing = false;
+        }}">
+			</og-code>
+		` : html `
+			<og-code-view
+				scrollable
+				.content="${this.content}"
+				.language="${this.language}"
+				@click="${() => this.editing = true}">
+			</og-code-view>
+		`}
+	`;
+    }
+    get languageAdapter() {
+        if (!__classPrivateFieldGet(this, _CodeBlock_languageAdapter, "f"))
+            __classPrivateFieldSet(this, _CodeBlock_languageAdapter, new LangTreeAdapter(), "f");
+        return __classPrivateFieldGet(this, _CodeBlock_languageAdapter, "f");
+    }
+    get content() { return this.editor?.content ?? __classPrivateFieldGet(this, _CodeBlock_content, "f"); }
+    set content(value) {
+        __classPrivateFieldSet(this, _CodeBlock_content, value, "f");
+        if (this.editor)
+            this.editor.content = value;
+    }
+    get monacoEditor() { return this.editor?.editor; }
+    get model() { return this.monacoEditor?.getModel(); }
+    updateHeight() {
+        if (!this.dynamicHeight)
+            return;
+        let height = this.editor?.editor?.getScrollHeight();
+        if (height == null)
+            return;
+        height = Math.max(this.minHeight, height);
+        dom.setSize(this.editor, { h: Math.min(this.maxHeight, height) });
+        this.layout();
+    }
+    async willUpdate(changedProps) {
+        if (changedProps.has('language')) {
+            this.language = await validateLanguage(this.language);
+        }
+    }
+    layout() {
+        this.editor?.layout();
+    }
+    focus() {
+        this.editor?.focus();
+    }
+};
+_CodeBlock_languageAdapter = new WeakMap();
+_CodeBlock_content = new WeakMap();
+CodeBlock.styles = css `
+		* {
+			box-sizing: border-box;
+		}
+
+		:host {
+			display: flex;
+			flex-direction: column;
+			width: 100%;
+			height: 100%;
+			position: relative;
+			border-radius: var(--og-base-radius);
+		}
+
+		:host([dynamicHeight]) {
+			display: block;
+			height: auto;
+		}
+
+		og-code {
+			flex: 1;
+			user-select: text;
+			width: 100%;
+			height: 100%;
+		}
+
+		og-code-view {
+			cursor: pointer;
+			height: 100%;
+		}
+
+		.toolbar {
+			flex: 0;
+			height: 28px;
+			display: flex;
+			border-bottom: 1px solid var(--og-border-color);
+			padding: 4px;
+		}
+
+		og-tree-dropdown {
+			width: 150px;
+			height: 20px;
+		}
+	`;
+__decorate([
+    property({ type: String })
+], CodeBlock.prototype, "language", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], CodeBlock.prototype, "dynamicHeight", void 0);
+__decorate([
+    property({ type: Number })
+], CodeBlock.prototype, "maxHeight", void 0);
+__decorate([
+    property({ type: Number })
+], CodeBlock.prototype, "minHeight", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], CodeBlock.prototype, "disableToolbar", void 0);
+__decorate([
+    query('og-code')
+], CodeBlock.prototype, "editor", void 0);
+__decorate([
+    query('og-code-view')
+], CodeBlock.prototype, "view", void 0);
+__decorate([
+    property({ type: Object })
+], CodeBlock.prototype, "editorOptions", void 0);
+__decorate([
+    state()
+], CodeBlock.prototype, "editing", void 0);
+CodeBlock = __decorate([
+    customElement('og-code-block')
+], CodeBlock);
+export { CodeBlock };
+//# sourceMappingURL=codeBlock.js.map

package/dist/components/codeBlock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"codeBlock.js","sourceRoot":"","sources":["../../src/components/codeBlock.ts"],"names":[],"mappings":"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","sourcesContent":["import { Layout, dom, events } from '@omegagrid/core';\nimport { LitElement, css, html } from 'lit';\nimport { customElement, query, property, state } from 'lit/decorators.js';\nimport { Code } from './code';\nimport { CodeEvent } from './shared';\nimport { TreeAdapter, TreeEvent, TreeOptions } from '@omegagrid/tree';\nimport { getLanguages, validateLanguage } from '../utils';\nimport type * as monaco from 'monaco-editor';\nimport { CodeView } from './codeView';\n\nclass LangTreeAdapter extends TreeAdapter {\n\tasync getTree() {\n\t\tconst languages = await getLanguages();\n\t\tlanguages.sort();\n\t\treturn languages.map(lang => ({\n\t\t\tk: lang,\n\t\t\tv: lang,\n\t\t}));\n\t}\n\n\tgetOptions() : TreeOptions {\n\t\treturn {\n\t\t\tsearch: true,\n\t\t\tselectMode: 'single',\n\t\t\tautoClose: true\n\t\t};\n\t}\n}\n\n@customElement('og-code-block')\nexport class CodeBlock extends LitElement implements Layout {\n\n\tstatic styles = css`\n\t\t* {\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t:host {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tposition: relative;\n\t\t\tborder-radius: var(--og-base-radius);\n\t\t}\n\n\t\t:host([dynamicHeight]) {\n\t\t\tdisplay: block;\n\t\t\theight: auto;\n\t\t}\n\n\t\tog-code {\n\t\t\tflex: 1;\n\t\t\tuser-select: text;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t}\n\n\t\tog-code-view {\n\t\t\tcursor: pointer;\n\t\t\theight: 100%;\n\t\t}\n\n\t\t.toolbar {\n\t\t\tflex: 0;\n\t\t\theight: 28px;\n\t\t\tdisplay: flex;\n\t\t\tborder-bottom: 1px solid var(--og-border-color);\n\t\t\tpadding: 4px;\n\t\t}\n\n\t\tog-tree-dropdown {\n\t\t\twidth: 150px;\n\t\t\theight: 20px;\n\t\t}\n\t`;\n\n\t@property({type: String})\n\tlanguage = 'typescript';\n\n\t@property({type: Boolean, reflect: true})\n\tdynamicHeight = false;\n\n\t@property({type: Number})\n\tmaxHeight = 400;\n\n\t@property({type: Number})\n\tminHeight = 25;\n\n\t@property({type: Boolean, reflect: true})\n\tdisableToolbar = false;\n\n\t@query('og-code')\n\teditor: Code;\n\n\t@query('og-code-view')\n\tview: CodeView;\n\n\t@property({type: Object})\n\teditorOptions: monaco.editor.IStandaloneEditorConstructionOptions;\n\n\t@state()\n\tediting = false;\n\n\t#languageAdapter: LangTreeAdapter;\n\tget languageAdapter() {\n\t\tif (!this.#languageAdapter) this.#languageAdapter = new LangTreeAdapter();\n\t\treturn this.#languageAdapter;\n\t}\n\n\t#content: string;\n\tget content() { return this.editor?.content ?? this.#content }\n\tset content(value: string) {\n\t\tthis.#content = value;\n\t\tif (this.editor) this.editor.content = value;\n\t}\n\n\tget monacoEditor() { return this.editor?.editor }\n\tget model() { return this.monacoEditor?.getModel() }\n\t\n\tupdateHeight() {\n\t\tif (!this.dynamicHeight) return;\n\t\tlet height = this.editor?.editor?.getScrollHeight();\n\t\tif (height == null) return;\n\t\theight = Math.max(this.minHeight, height);\n\t\tdom.setSize(this.editor, {h: Math.min(this.maxHeight, height)});\n\t\tthis.layout();\n\t}\n\n\t_onChange = (_e: CodeEvent) => {\n\t\tthis.updateHeight();\n\t};\n\n\tasync willUpdate(changedProps: Map<PropertyKey, unknown>) {\n\t\tif (changedProps.has('language')) {\n\t\t\tthis.language = await validateLanguage(this.language);\n\t\t}\n\t}\n\n\t_onLanguageChange = (e: TreeEvent) => {\n\t\tthis.language = e.node.key;\n\t\tthis.dispatchEvent(new events.ChangeEvent({\n\t\t\ttype: 'changeLanguage', \n\t\t\tvalue: this.language\n\t\t}));\n\t}\n\n\tgetEditorOptions = () => ({\n\t\tscrollBeyondLastLine: !this.dynamicHeight,\n\t\t...this.editorOptions\n\t});\n\n\trender = () => html`\n\t\t${!this.disableToolbar ? html`\n\t\t\t<div class=\"toolbar\">\n\t\t\t\t<og-tree-dropdown \n\t\t\t\t\t@change=\"${this._onLanguageChange}\"\n\t\t\t\t\t.adapter=\"${this.languageAdapter}\"\n\t\t\t\t\t.value=\"${[[this.language, 0, 1]]}\">\n\t\t\t\t</og-tree-dropdown>\n\t\t\t</div>\n\t\t` : ''}\n\n\t\t${this.editing ? html`\n\t\t\t<og-code\n\t\t\t\t.content=\"${this.content}\"\n\t\t\t\t.language=\"${this.language}\"\n\t\t\t\t.options=\"${this.getEditorOptions()}\"\n\t\t\t\t@code.change=\"${this._onChange}\"\n\t\t\t\t@code.ready=\"${() => this.updateHeight()}\"\n\t\t\t\t@code.blur=\"${() => {\n\t\t\t\t\tthis.#content = this.editor.content;\n\t\t\t\t\tthis.editing = false;\n\t\t\t\t}}\">\n\t\t\t</og-code>\n\t\t` : html`\n\t\t\t<og-code-view\n\t\t\t\tscrollable\n\t\t\t\t.content=\"${this.content}\"\n\t\t\t\t.language=\"${this.language}\"\n\t\t\t\t@click=\"${() => this.editing = true}\">\n\t\t\t</og-code-view>\n\t\t`}\n\t`;\n\n\tlayout() {\n\t\tthis.editor?.layout();\n\t}\n\n\tfocus() {\n\t\tthis.editor?.focus();\n\t}\n\n}\n"]}

package/dist/components/codeDiff.d.ts

@@ -0,0 +1,35 @@
+import { Layout } from '@omegagrid/core';
+import { LitElement } from 'lit';
+import type * as monaco from 'monaco-editor';
+export declare class CodeDiffEditor extends LitElement implements Layout {
+    #private;
+    static styles: import("lit").CSSResult;
+    static monaco: typeof monaco;
+    get monaco(): typeof monaco;
+    get editor(): monaco.editor.IStandaloneDiffEditor;
+    get modifiedModel(): monaco.editor.ITextModel;
+    get originalModel(): monaco.editor.ITextModel;
+    get options(): monaco.editor.IStandaloneEditorConstructionOptions;
+    set options(val: monaco.editor.IStandaloneEditorConstructionOptions);
+    get modifiedContent(): string;
+    set modifiedContent(val: string);
+    get originalContent(): string;
+    set originalContent(val: string);
+    get language(): string;
+    set language(val: string);
+    get selectedContent(): string;
+    get container(): HTMLDivElement;
+    get theme(): "vs" | "vs-dark";
+    zIndex: number;
+    getOptions: () => monaco.editor.IStandaloneEditorConstructionOptions;
+    showContainer(): void;
+    hideContainer(): void;
+    initEditor(): Promise<void>;
+    updated(): Promise<void>;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    layout(): void;
+    dispose(): void;
+    focus(): void;
+}
+//# sourceMappingURL=codeDiff.d.ts.map

package/dist/components/codeDiff.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"codeDiff.d.ts","sourceRoot":"","sources":["../../src/components/codeDiff.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,MAAM,EAA2B,MAAM,iBAAiB,CAAC;AACvE,OAAO,EAAE,UAAU,EAAO,MAAM,KAAK,CAAC;AAGtC,OAAO,KAAK,KAAK,MAAM,MAAM,eAAe,CAAC;AAO7C,qBACa,cAAe,SAAQ,UAAW,YAAW,MAAM;;IAE/D,MAAM,CAAC,MAAM,0BAcX;IAEF,MAAM,CAAC,MAAM,EAAE,OAAO,MAAM,CAAC;IAC7B,IAAI,MAAM,kBAAmC;IAQ7C,IAAI,MAAM,wCAA0B;IACpC,IAAI,aAAa,6BAA+C;IAChE,IAAI,aAAa,6BAA+C;IAGhE,IACI,OAAO,IACM,MAAM,CAAC,MAAM,CAAC,oCAAoC,CAD7B;IACtC,IAAI,OAAO,CAAC,GAAG,EAAE,MAAM,CAAC,MAAM,CAAC,oCAAoC,EAGlE;IAGD,IACI,eAAe,IACM,MAAM,CAD4E;IAC3G,IAAI,eAAe,CAAC,GAAG,EAAE,MAAM,EAO9B;IAGD,IACI,eAAe,IACM,MAAM,CAD4E;IAC3G,IAAI,eAAe,CAAC,GAAG,EAAE,MAAM,EAO9B;IAGD,IACI,QAAQ,IACM,MAAM,CADgB;IACxC,IAAI,QAAQ,CAAC,GAAG,EAAE,MAAM,EAQvB;IAED,IAAI,eAAe,WAMlB;IAGD,IAAI,SAAS,mBAER;IAEL,IAAI,KAAK,qBAA+E;IAMxF,MAAM,SAAsB;IAE5B,UAAU,QAAO,MAAM,CAAC,MAAM,CAAC,oCAAoC,CAOhE;IAEH,aAAa;IAMb,aAAa;IAIP,UAAU;IAgDV,OAAO;IAKb,iBAAiB;IAUjB,oBAAoB;IAKpB,MAAM;IAiBN,OAAO;IAQP,KAAK;CAIL"}

package/dist/components/codeDiff.js

@@ -0,0 +1,243 @@
+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;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m") throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var _CodeDiffEditor_preventChangeEvent, _CodeDiffEditor_state, _CodeDiffEditor_selection, _CodeDiffEditor_activeModel, _CodeDiffEditor_editor, _CodeDiffEditor_options, _CodeDiffEditor_modifiedContent, _CodeDiffEditor_originalContent, _CodeDiffEditor_language, _CodeDiffEditor_container, _CodeDiffEditor_onStyleChange;
+var CodeDiffEditor_1;
+import { dom, getThemeManager, events } from '@omegagrid/core';
+import { LitElement, css } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { MonacoLoader } from '../loader';
+import { getDefaultOptions } from '@omegagrid/core';
+import { CodeEvent } from './shared';
+import { Code } from './code';
+const VISIBILITY_THRESHOLD_SIZE = 10; // minimum width/height to show the editor
+let CodeDiffEditor = CodeDiffEditor_1 = class CodeDiffEditor extends LitElement {
+    constructor() {
+        super(...arguments);
+        _CodeDiffEditor_preventChangeEvent.set(this, false);
+        _CodeDiffEditor_state.set(this, 0); // 0: initial, 1: initializing, 2: initialized
+        _CodeDiffEditor_selection.set(this, void 0);
+        _CodeDiffEditor_activeModel.set(this, void 0);
+        _CodeDiffEditor_editor.set(this, void 0);
+        _CodeDiffEditor_options.set(this, void 0);
+        _CodeDiffEditor_modifiedContent.set(this, '');
+        _CodeDiffEditor_originalContent.set(this, '');
+        _CodeDiffEditor_language.set(this, 'typescript');
+        _CodeDiffEditor_container.set(this, void 0);
+        _CodeDiffEditor_onStyleChange.set(this, () => {
+            this.editor.updateOptions({ theme: this.theme });
+        });
+        this.zIndex = Code.defaultZIndex;
+        this.getOptions = () => ({
+            ...this.options,
+            theme: this.theme,
+            fontSize: getDefaultOptions().fontSize,
+            // workaround for caret positioning issue in chrome
+            // https://github.com/microsoft/monaco-editor/issues/3217#issuecomment-1511978166
+            fontLigatures: ''
+        });
+    }
+    get monaco() { return CodeDiffEditor_1.monaco; }
+    get editor() { return __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f"); }
+    get modifiedModel() { return __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f")?.getModel().modified; }
+    get originalModel() { return __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f")?.getModel().original; }
+    get options() { return __classPrivateFieldGet(this, _CodeDiffEditor_options, "f"); }
+    set options(val) {
+        __classPrivateFieldSet(this, _CodeDiffEditor_options, val, "f");
+        __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f")?.updateOptions(val);
+    }
+    get modifiedContent() { return this.modifiedModel ? this.modifiedModel.getValue() : __classPrivateFieldGet(this, _CodeDiffEditor_modifiedContent, "f"); }
+    set modifiedContent(val) {
+        if (this.modifiedModel) {
+            __classPrivateFieldSet(this, _CodeDiffEditor_preventChangeEvent, true, "f");
+            this.modifiedModel.setValue(val);
+        }
+        else {
+            __classPrivateFieldSet(this, _CodeDiffEditor_modifiedContent, val, "f");
+        }
+    }
+    get originalContent() { return this.originalModel ? this.originalModel.getValue() : __classPrivateFieldGet(this, _CodeDiffEditor_originalContent, "f"); }
+    set originalContent(val) {
+        if (this.originalModel) {
+            __classPrivateFieldSet(this, _CodeDiffEditor_preventChangeEvent, true, "f");
+            this.originalModel.setValue(val);
+        }
+        else {
+            __classPrivateFieldSet(this, _CodeDiffEditor_originalContent, val, "f");
+        }
+    }
+    get language() { return __classPrivateFieldGet(this, _CodeDiffEditor_language, "f"); }
+    set language(val) {
+        __classPrivateFieldSet(this, _CodeDiffEditor_language, val, "f");
+        if (__classPrivateFieldGet(this, _CodeDiffEditor_editor, "f")) {
+            MonacoLoader.get().then(monaco => {
+                monaco.editor.setModelLanguage(__classPrivateFieldGet(this, _CodeDiffEditor_editor, "f").getModel().modified, val);
+                monaco.editor.setModelLanguage(__classPrivateFieldGet(this, _CodeDiffEditor_editor, "f").getModel().original, val);
+            });
+        }
+    }
+    get selectedContent() {
+        if (!__classPrivateFieldGet(this, _CodeDiffEditor_editor, "f"))
+            return __classPrivateFieldGet(this, _CodeDiffEditor_originalContent, "f");
+        if (!__classPrivateFieldGet(this, _CodeDiffEditor_activeModel, "f"))
+            return __classPrivateFieldGet(this, _CodeDiffEditor_originalContent, "f");
+        const selectedCodeChunks = __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f").getSelections().map(selection => __classPrivateFieldGet(this, _CodeDiffEditor_activeModel, "f").getValueInRange(selection));
+        const selectedCode = selectedCodeChunks.join("\n").trim();
+        return selectedCode == null || selectedCode == '' ? __classPrivateFieldGet(this, _CodeDiffEditor_activeModel, "f").getValue() : selectedCode;
+    }
+    get container() {
+        return __classPrivateFieldGet(this, _CodeDiffEditor_container, "f") ?? (__classPrivateFieldSet(this, _CodeDiffEditor_container, dom.createElement('div', {
+            style: { zIndex: this.zIndex.toString() }
+        }), "f"));
+    }
+    get theme() { return getThemeManager().activeTheme?.type == 'light' ? 'vs' : 'vs-dark'; }
+    showContainer() {
+        if (this.container.parentElement !== document.body) {
+            document.body.appendChild(this.container);
+        }
+    }
+    hideContainer() {
+        __classPrivateFieldGet(this, _CodeDiffEditor_container, "f")?.remove();
+    }
+    async initEditor() {
+        if (__classPrivateFieldGet(this, _CodeDiffEditor_state, "f") > 0)
+            return;
+        __classPrivateFieldSet(this, _CodeDiffEditor_state, 1, "f");
+        CodeDiffEditor_1.monaco = await MonacoLoader.get();
+        __classPrivateFieldSet(this, _CodeDiffEditor_editor, CodeDiffEditor_1.monaco.editor.createDiffEditor(this.container, this.getOptions()), "f");
+        const language = __classPrivateFieldGet(this, _CodeDiffEditor_language, "f");
+        const originalModel = CodeDiffEditor_1.monaco.editor.createModel(__classPrivateFieldGet(this, _CodeDiffEditor_originalContent, "f"), language);
+        const modifiedModel = CodeDiffEditor_1.monaco.editor.createModel(__classPrivateFieldGet(this, _CodeDiffEditor_modifiedContent, "f"), language);
+        this.editor.setModel({ original: originalModel, modified: modifiedModel });
+        if (__classPrivateFieldGet(this, _CodeDiffEditor_selection, "f"))
+            __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f").setSelection(__classPrivateFieldGet(this, _CodeDiffEditor_selection, "f"));
+        modifiedModel.onDidChangeContent(e => {
+            if (__classPrivateFieldGet(this, _CodeDiffEditor_preventChangeEvent, "f")) {
+                __classPrivateFieldSet(this, _CodeDiffEditor_preventChangeEvent, false, "f");
+                return;
+            }
+            this.dispatchEvent(new CodeEvent('change', { editor: this.editor, changes: e.changes }));
+            this.dispatchEvent(new events.ChangeEvent({ value: this.editor.getModel().modified.getValue() }));
+        });
+        const modifiedEdiitor = __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f").getModifiedEditor();
+        const originalEditor = __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f").getOriginalEditor();
+        modifiedEdiitor.onDidFocusEditorText(() => __classPrivateFieldSet(this, _CodeDiffEditor_activeModel, modifiedEdiitor.getModel(), "f"));
+        originalEditor.onDidFocusEditorText(() => __classPrivateFieldSet(this, _CodeDiffEditor_activeModel, originalEditor.getModel(), "f"));
+        modifiedEdiitor.onKeyDown(e => {
+            this.dispatchEvent(new CodeEvent('keydown', { editor: __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f") }, e.browserEvent));
+        });
+        originalEditor.onKeyDown(e => {
+            this.dispatchEvent(new CodeEvent('keydown', { editor: __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f") }, e.browserEvent));
+        });
+        __classPrivateFieldSet(this, _CodeDiffEditor_preventChangeEvent, false, "f");
+        __classPrivateFieldSet(this, _CodeDiffEditor_state, 2, "f");
+        this.dispatchEvent(new CodeEvent('ready', { editor: __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f") }));
+        __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f").focus();
+        setTimeout(() => {
+            if (__classPrivateFieldGet(this, _CodeDiffEditor_language, "f") != language) {
+                // if the language was changed while the editor was initializing, update the model language
+                CodeDiffEditor_1.monaco.editor.setModelLanguage(__classPrivateFieldGet(this, _CodeDiffEditor_editor, "f").getModel().modified, __classPrivateFieldGet(this, _CodeDiffEditor_language, "f"));
+                CodeDiffEditor_1.monaco.editor.setModelLanguage(__classPrivateFieldGet(this, _CodeDiffEditor_editor, "f").getModel().original, __classPrivateFieldGet(this, _CodeDiffEditor_language, "f"));
+            }
+        }, 100);
+    }
+    async updated() {
+        await this.initEditor();
+        this.layout();
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        getThemeManager().addEventListener('change', __classPrivateFieldGet(this, _CodeDiffEditor_onStyleChange, "f"));
+        if (this.hasUpdated) {
+            this.initEditor();
+            this.layout();
+        }
+    }
+    disconnectedCallback() {
+        getThemeManager().removeEventListener('change', __classPrivateFieldGet(this, _CodeDiffEditor_onStyleChange, "f"));
+        this.hideContainer();
+    }
+    layout() {
+        if (!this.isConnected || this.clientWidth < VISIBILITY_THRESHOLD_SIZE || this.clientHeight < VISIBILITY_THRESHOLD_SIZE) {
+            this.hideContainer();
+            return;
+        }
+        this.showContainer();
+        const offset = dom.getElementOffset(this, document.body);
+        dom.setPosition(this.container, { t: offset.top + 1, l: offset.left + 1 });
+        const w = this.clientWidth - 1;
+        const h = this.clientHeight - 1;
+        dom.setSize(this.container, { w, h });
+        __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f")?.layout({ width: w, height: h });
+    }
+    dispose() {
+        __classPrivateFieldGet(this, _CodeDiffEditor_container, "f")?.remove();
+        __classPrivateFieldSet(this, _CodeDiffEditor_container, null, "f");
+        __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f")?.dispose();
+        __classPrivateFieldSet(this, _CodeDiffEditor_editor, null, "f");
+        __classPrivateFieldSet(this, _CodeDiffEditor_state, 0, "f");
+    }
+    focus() {
+        __classPrivateFieldGet(this, _CodeDiffEditor_editor, "f")?.focus();
+    }
+};
+_CodeDiffEditor_preventChangeEvent = new WeakMap();
+_CodeDiffEditor_state = new WeakMap();
+_CodeDiffEditor_selection = new WeakMap();
+_CodeDiffEditor_activeModel = new WeakMap();
+_CodeDiffEditor_editor = new WeakMap();
+_CodeDiffEditor_options = new WeakMap();
+_CodeDiffEditor_modifiedContent = new WeakMap();
+_CodeDiffEditor_originalContent = new WeakMap();
+_CodeDiffEditor_language = new WeakMap();
+_CodeDiffEditor_container = new WeakMap();
+_CodeDiffEditor_onStyleChange = new WeakMap();
+CodeDiffEditor.styles = css `
+		:host {
+			user-select: text;
+			display: block;
+			width: 100%;
+			height: 100%;
+			position: relative;
+		}
+
+		div, iframe {
+			width: 100%;
+			height: 100%;
+			border: none;
+		}
+	`;
+__decorate([
+    property({ type: Object, noAccessor: true })
+], CodeDiffEditor.prototype, "options", null);
+__decorate([
+    property({ type: String, noAccessor: true })
+], CodeDiffEditor.prototype, "modifiedContent", null);
+__decorate([
+    property({ type: String, noAccessor: true })
+], CodeDiffEditor.prototype, "originalContent", null);
+__decorate([
+    property({ type: String, noAccessor: true })
+], CodeDiffEditor.prototype, "language", null);
+__decorate([
+    property({ type: Number })
+], CodeDiffEditor.prototype, "zIndex", void 0);
+CodeDiffEditor = CodeDiffEditor_1 = __decorate([
+    customElement('og-code-diff')
+], CodeDiffEditor);
+export { CodeDiffEditor };
+//# sourceMappingURL=codeDiff.js.map

package/dist/components/codeDiff.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"codeDiff.js","sourceRoot":"","sources":["../../src/components/codeDiff.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,GAAG,EAAU,eAAe,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAEzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,MAAM,yBAAyB,GAAG,EAAE,CAAC,CAAC,0CAA0C;AAGzE,IAAM,cAAc,sBAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAqBN,6CAAsB,KAAK,EAAC;QAC5B,gCAAgB,CAAC,EAAC,CAAC,8CAA8C;QACjE,4CAA6B;QAC7B,8CAAuC;QAEvC,yCAA6C;QAK7C,0CAA6D;QAQ7D,0CAAmB,EAAE,EAAC;QAYtB,0CAAmB,EAAE,EAAC;QAYtB,mCAAY,YAAY,EAAC;QAqBzB,4CAA2B;QAM3B,wCAAiB,GAAG,EAAE;YACrB,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAA2D,CAAC,CAAC;QAC1G,CAAC,EAAA;QAGD,WAAM,GAAG,IAAI,CAAC,aAAa,CAAC;QAE5B,eAAU,GAAG,GAAuD,EAAE,CAAC,CAAC;YACvE,GAAG,IAAI,CAAC,OAAO;YACf,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,QAAQ,EAAE,iBAAiB,EAAE,CAAC,QAAQ;YACtC,mDAAmD;YACnD,iFAAiF;YACjF,aAAa,EAAE,EAAE;SACjB,CAAC,CAAC;IA6GJ,CAAC;IAlMA,IAAI,MAAM,KAAK,OAAO,gBAAc,CAAC,MAAM,CAAA,CAAC,CAAC;IAQ7C,IAAI,MAAM,KAAK,OAAO,uBAAA,IAAI,8BAAQ,CAAA,CAAC,CAAC;IACpC,IAAI,aAAa,KAAK,OAAO,uBAAA,IAAI,8BAAQ,EAAE,QAAQ,EAAE,CAAC,QAAQ,CAAA,CAAC,CAAC;IAChE,IAAI,aAAa,KAAK,OAAO,uBAAA,IAAI,8BAAQ,EAAE,QAAQ,EAAE,CAAC,QAAQ,CAAA,CAAC,CAAC;IAIhE,IAAI,OAAO,KAAK,OAAO,uBAAA,IAAI,+BAAS,CAAA,CAAC,CAAC;IACtC,IAAI,OAAO,CAAC,GAAuD;QAClE,uBAAA,IAAI,2BAAY,GAAG,MAAA,CAAC;QACpB,uBAAA,IAAI,8BAAQ,EAAE,aAAa,CAAC,GAAG,CAAC,CAAC;IAClC,CAAC;IAID,IAAI,eAAe,KAAK,OAAO,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,uBAAA,IAAI,uCAAiB,CAAA,CAAC,CAAC;IAC3G,IAAI,eAAe,CAAC,GAAW;QAC9B,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YACxB,uBAAA,IAAI,sCAAuB,IAAI,MAAA,CAAC;YAChC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;QAClC,CAAC;aAAM,CAAC;YACP,uBAAA,IAAI,mCAAoB,GAAG,MAAA,CAAC;QAC7B,CAAC;IACF,CAAC;IAID,IAAI,eAAe,KAAK,OAAO,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,uBAAA,IAAI,uCAAiB,CAAA,CAAC,CAAC;IAC3G,IAAI,eAAe,CAAC,GAAW;QAC9B,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YACxB,uBAAA,IAAI,sCAAuB,IAAI,MAAA,CAAC;YAChC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;QAClC,CAAC;aAAM,CAAC;YACP,uBAAA,IAAI,mCAAoB,GAAG,MAAA,CAAC;QAC7B,CAAC;IACF,CAAC;IAID,IAAI,QAAQ,KAAK,OAAO,uBAAA,IAAI,gCAAU,CAAA,CAAC,CAAC;IACxC,IAAI,QAAQ,CAAC,GAAW;QACvB,uBAAA,IAAI,4BAAa,GAAG,MAAA,CAAC;QACrB,IAAI,uBAAA,IAAI,8BAAQ,EAAE,CAAC;YAClB,YAAY,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;gBAChC,MAAM,CAAC,MAAM,CAAC,gBAAgB,CAAC,uBAAA,IAAI,8BAAQ,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;gBACtE,MAAM,CAAC,MAAM,CAAC,gBAAgB,CAAC,uBAAA,IAAI,8BAAQ,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;YACvE,CAAC,CAAC,CAAC;QACJ,CAAC;IACF,CAAC;IAED,IAAI,eAAe;QAClB,IAAI,CAAC,uBAAA,IAAI,8BAAQ;YAAE,OAAO,uBAAA,IAAI,uCAAiB,CAAC;QAChD,IAAI,CAAC,uBAAA,IAAI,mCAAa;YAAE,OAAO,uBAAA,IAAI,uCAAiB,CAAC;QACrD,MAAM,kBAAkB,GAAG,uBAAA,IAAI,8BAAQ,CAAC,aAAa,EAAE,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC,uBAAA,IAAI,mCAAa,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,CAAC;QACvH,MAAM,YAAY,GAAG,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,CAAC;QAC1D,OAAO,YAAY,IAAI,IAAI,IAAI,YAAY,IAAI,EAAE,CAAC,CAAC,CAAC,uBAAA,IAAI,mCAAa,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC;IACjG,CAAC;IAGD,IAAI,SAAS;QAAK,OAAO,uBAAA,IAAI,iCAAW,IAAI,CAAC,uBAAA,IAAI,6BAAc,GAAG,CAAC,aAAa,CAAC,KAAK,EAAE;YACvF,KAAK,EAAE,EAAC,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,EAAC;SACvC,CAAC,MAAA,CAAC,CAAA;IAAC,CAAC;IAEL,IAAI,KAAK,KAAK,OAAO,eAAe,EAAE,CAAC,WAAW,EAAE,IAAI,IAAI,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAA,CAAC,CAAC;IAiBxF,aAAa;QACZ,IAAI,IAAI,CAAC,SAAS,CAAC,aAAa,KAAK,QAAQ,CAAC,IAAI,EAAE,CAAC;YACpD,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC3C,CAAC;IACF,CAAC;IAED,aAAa;QACZ,uBAAA,IAAI,iCAAW,EAAE,MAAM,EAAE,CAAC;IAC3B,CAAC;IAED,KAAK,CAAC,UAAU;QACf,IAAI,uBAAA,IAAI,6BAAO,GAAG,CAAC;YAAE,OAAO;QAC5B,uBAAA,IAAI,yBAAU,CAAC,MAAA,CAAC;QAEhB,gBAAc,CAAC,MAAM,GAAG,MAAM,YAAY,CAAC,GAAG,EAAE,CAAC;QACjD,uBAAA,IAAI,0BAAW,gBAAc,CAAC,MAAM,CAAC,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,MAAA,CAAC;QAEhG,MAAM,QAAQ,GAAG,uBAAA,IAAI,gCAAU,CAAC;QAChC,MAAM,aAAa,GAAG,gBAAc,CAAC,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,uBAAA,IAAI,uCAAiB,EAAE,QAAQ,CAAC,CAAC;QAChG,MAAM,aAAa,GAAG,gBAAc,CAAC,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,uBAAA,IAAI,uCAAiB,EAAE,QAAQ,CAAC,CAAC;QAChG,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAC,QAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,aAAa,EAAC,CAAC,CAAC;QACzE,IAAI,uBAAA,IAAI,iCAAW;YAAE,uBAAA,IAAI,8BAAQ,CAAC,YAAY,CAAC,uBAAA,IAAI,iCAAW,CAAC,CAAC;QAEhE,aAAa,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAAE;YACpC,IAAI,uBAAA,IAAI,0CAAoB,EAAE,CAAC;gBAC9B,uBAAA,IAAI,sCAAuB,KAAK,MAAA,CAAC;gBACjC,OAAM;YACP,CAAC;YACD,IAAI,CAAC,aAAa,CAAC,IAAI,SAAS,CAAC,QAAQ,EAAE,EAAC,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,CAAC,CAAC,OAAO,EAAC,CAAC,CAAC,CAAC;YACvF,IAAI,CAAC,aAAa,CAAC,IAAI,MAAM,CAAC,WAAW,CAAC,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,QAAQ,EAAE,EAAC,CAAC,CAAC,CAAC;QACjG,CAAC,CAAC,CAAC;QAEH,MAAM,eAAe,GAAG,uBAAA,IAAI,8BAAQ,CAAC,iBAAiB,EAAE,CAAC;QACzD,MAAM,cAAc,GAAG,uBAAA,IAAI,8BAAQ,CAAC,iBAAiB,EAAE,CAAC;QACxD,eAAe,CAAC,oBAAoB,CAAC,GAAG,EAAE,CAAC,uBAAA,IAAI,+BAAgB,eAAe,CAAC,QAAQ,EAAE,MAAA,CAAC,CAAC;QAC3F,cAAc,CAAC,oBAAoB,CAAC,GAAG,EAAE,CAAC,uBAAA,IAAI,+BAAgB,cAAc,CAAC,QAAQ,EAAE,MAAA,CAAC,CAAC;QACzF,eAAe,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;YAC7B,IAAI,CAAC,aAAa,CAAC,IAAI,SAAS,CAAC,SAAS,EAAE,EAAC,MAAM,EAAE,uBAAA,IAAI,8BAAQ,EAAC,EAAE,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC;QACtF,CAAC,CAAC,CAAC;QACH,cAAc,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;YAC5B,IAAI,CAAC,aAAa,CAAC,IAAI,SAAS,CAAC,SAAS,EAAE,EAAC,MAAM,EAAE,uBAAA,IAAI,8BAAQ,EAAC,EAAE,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC;QACtF,CAAC,CAAC,CAAC;QAEH,uBAAA,IAAI,sCAAuB,KAAK,MAAA,CAAC;QACjC,uBAAA,IAAI,yBAAU,CAAC,MAAA,CAAC;QAEhB,IAAI,CAAC,aAAa,CAAC,IAAI,SAAS,CAAC,OAAO,EAAE,EAAC,MAAM,EAAE,uBAAA,IAAI,8BAAQ,EAAC,CAAC,CAAC,CAAC;QACnE,uBAAA,IAAI,8BAAQ,CAAC,KAAK,EAAE,CAAC;QAErB,UAAU,CAAC,GAAG,EAAE;YACf,IAAI,uBAAA,IAAI,gCAAU,IAAI,QAAQ,EAAE,CAAC;gBAChC,2FAA2F;gBAC3F,gBAAc,CAAC,MAAM,CAAC,MAAM,CAAC,gBAAgB,CAAC,uBAAA,IAAI,8BAAQ,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,uBAAA,IAAI,gCAAU,CAAC,CAAC;gBAChG,gBAAc,CAAC,MAAM,CAAC,MAAM,CAAC,gBAAgB,CAAC,uBAAA,IAAI,8BAAQ,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,uBAAA,IAAI,gCAAU,CAAC,CAAC;YACjG,CAAC;QACF,CAAC,EAAE,GAAG,CAAC,CAAC;IACT,CAAC;IAED,KAAK,CAAC,OAAO;QACZ,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;QACxB,IAAI,CAAC,MAAM,EAAE,CAAC;IACf,CAAC;IAED,iBAAiB;QAChB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,eAAe,EAAE,CAAC,gBAAgB,CAAC,QAAQ,EAAE,uBAAA,IAAI,qCAAe,CAAC,CAAC;QAElE,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACrB,IAAI,CAAC,UAAU,EAAE,CAAC;YAClB,IAAI,CAAC,MAAM,EAAE,CAAC;QACf,CAAC;IACF,CAAC;IAED,oBAAoB;QACnB,eAAe,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,uBAAA,IAAI,qCAAe,CAAC,CAAC;QACrE,IAAI,CAAC,aAAa,EAAE,CAAC;IACtB,CAAC;IAED,MAAM;QACL,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,WAAW,GAAG,yBAAyB,IAAI,IAAI,CAAC,YAAY,GAAG,yBAAyB,EAAE,CAAC;YACxH,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,OAAO;QACR,CAAC;QAED,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,MAAM,MAAM,GAAG,GAAG,CAAC,gBAAgB,CAAC,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAC;QACzD,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,SAAS,EAAE,EAAC,CAAC,EAAE,MAAM,CAAC,GAAG,GAAG,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,IAAI,GAAG,CAAC,EAAC,CAAC,CAAC;QAEzE,MAAM,CAAC,GAAG,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;QAC/B,MAAM,CAAC,GAAG,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;QAChC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;QAEtC,uBAAA,IAAI,8BAAQ,EAAE,MAAM,CAAC,EAAC,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAC,CAAC,CAAC;IAC7C,CAAC;IAED,OAAO;QACN,uBAAA,IAAI,iCAAW,EAAE,MAAM,EAAE,CAAC;QAC1B,uBAAA,IAAI,6BAAc,IAAI,MAAA,CAAC;QACvB,uBAAA,IAAI,8BAAQ,EAAE,OAAO,EAAE,CAAC;QACxB,uBAAA,IAAI,0BAAW,IAAI,MAAA,CAAC;QACpB,uBAAA,IAAI,yBAAU,CAAC,MAAA,CAAC;IACjB,CAAC;IAED,KAAK;QACJ,uBAAA,IAAI,8BAAQ,EAAE,KAAK,EAAE,CAAC;IACvB,CAAC;;;;;;;;;;;;;AAjNM,qBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;EAclB,AAdY,CAcX;AAiBF;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAC,CAAC;6CACL;AAQtC;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAC,CAAC;qDACgE;AAY3G;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAC,CAAC;qDACgE;AAY3G;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAC,CAAC;8CACH;AA8BxC;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;8CACG;AA/FhB,cAAc;IAD1B,aAAa,CAAC,cAAc,CAAC;GACjB,cAAc,CAqN1B","sourcesContent":["import { dom, Layout, getThemeManager, events } from '@omegagrid/core';\nimport { LitElement, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { MonacoLoader } from '../loader';\nimport type * as monaco from 'monaco-editor';\nimport { getDefaultOptions } from '@omegagrid/core';\nimport { CodeEvent } from './shared';\nimport { Code } from './code';\n\nconst VISIBILITY_THRESHOLD_SIZE = 10; // minimum width/height to show the editor\n\n@customElement('og-code-diff')\nexport class CodeDiffEditor extends LitElement implements Layout {\n\n\tstatic styles = css`\n\t\t:host {\n\t\t\tuser-select: text;\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tposition: relative;\n\t\t}\n\n\t\tdiv, iframe {\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tborder: none;\n\t\t}\n\t`;\n\n\tstatic monaco: typeof monaco;\n\tget monaco() { return CodeDiffEditor.monaco }\n\n\t#preventChangeEvent = false;\n\t#state: 0|1|2 = 0; // 0: initial, 1: initializing, 2: initialized\n\t#selection: monaco.Selection;\n\t#activeModel: monaco.editor.ITextModel;\n\t\n\t#editor: monaco.editor.IStandaloneDiffEditor;\n\tget editor() { return this.#editor }\n\tget modifiedModel() { return this.#editor?.getModel().modified }\n\tget originalModel() { return this.#editor?.getModel().original }\n\n\t#options: monaco.editor.IStandaloneEditorConstructionOptions;\n\t@property({type: Object, noAccessor: true})\n\tget options() { return this.#options }\n\tset options(val: monaco.editor.IStandaloneEditorConstructionOptions) {\n\t\tthis.#options = val;\n\t\tthis.#editor?.updateOptions(val);\n\t}\n\n\t#modifiedContent = '';\n\t@property({type: String, noAccessor: true})\n\tget modifiedContent() { return this.modifiedModel ? this.modifiedModel.getValue() : this.#modifiedContent }\n\tset modifiedContent(val: string) {\n\t\tif (this.modifiedModel) {\n\t\t\tthis.#preventChangeEvent = true;\n\t\t\tthis.modifiedModel.setValue(val);\n\t\t} else {\n\t\t\tthis.#modifiedContent = val;\n\t\t}\n\t}\n\t\n\t#originalContent = '';\n\t@property({type: String, noAccessor: true})\n\tget originalContent() { return this.originalModel ? this.originalModel.getValue() : this.#originalContent }\n\tset originalContent(val: string) {\n\t\tif (this.originalModel) {\n\t\t\tthis.#preventChangeEvent = true;\n\t\t\tthis.originalModel.setValue(val);\n\t\t} else {\n\t\t\tthis.#originalContent = val;\n\t\t}\n\t}\n\n\t#language = 'typescript';\n\t@property({type: String, noAccessor: true})\n\tget language() { return this.#language }\n\tset language(val: string) {\n\t\tthis.#language = val;\n\t\tif (this.#editor) {\n\t\t\tMonacoLoader.get().then(monaco => {\n\t\t\t\tmonaco.editor.setModelLanguage(this.#editor.getModel().modified, val);\n\t\t\t\tmonaco.editor.setModelLanguage(this.#editor.getModel().original, val);\n\t\t\t});\n\t\t}\n\t}\n\n\tget selectedContent() {\n\t\tif (!this.#editor) return this.#originalContent;\n\t\tif (!this.#activeModel) return this.#originalContent;\n\t\tconst selectedCodeChunks = this.#editor.getSelections().map(selection => this.#activeModel.getValueInRange(selection));\n\t\tconst selectedCode = selectedCodeChunks.join(\"\\n\").trim();\n\t\treturn selectedCode == null || selectedCode == '' ? this.#activeModel.getValue() : selectedCode;\n\t}\n\n\t#container: HTMLDivElement;\n\tget container() { return this.#container ?? (this.#container = dom.createElement('div', {\n\t\tstyle: {zIndex: this.zIndex.toString()}\n\t})) }\n\n\tget theme() { return getThemeManager().activeTheme?.type == 'light' ? 'vs' : 'vs-dark' }\n\t#onStyleChange = () => {\n\t\tthis.editor.updateOptions({theme: this.theme} as monaco.editor.IStandaloneDiffEditorConstructionOptions);\n\t}\n\n\t@property({type: Number})\n\tzIndex = Code.defaultZIndex;\n\n\tgetOptions = (): monaco.editor.IStandaloneEditorConstructionOptions => ({\n\t\t...this.options,\n\t\ttheme: this.theme,\n\t\tfontSize: getDefaultOptions().fontSize,\n\t\t// workaround for caret positioning issue in chrome\n\t\t// https://github.com/microsoft/monaco-editor/issues/3217#issuecomment-1511978166\n\t\tfontLigatures: ''\n\t});\n\n\tshowContainer() {\n\t\tif (this.container.parentElement !== document.body) {\n\t\t\tdocument.body.appendChild(this.container);\n\t\t}\n\t}\n\n\thideContainer() {\n\t\tthis.#container?.remove();\n\t}\n\n\tasync initEditor() {\n\t\tif (this.#state > 0) return;\n\t\tthis.#state = 1;\n\t\t\n\t\tCodeDiffEditor.monaco = await MonacoLoader.get();\n\t\tthis.#editor = CodeDiffEditor.monaco.editor.createDiffEditor(this.container, this.getOptions());\n\t\t\n\t\tconst language = this.#language;\n\t\tconst originalModel = CodeDiffEditor.monaco.editor.createModel(this.#originalContent, language);\n\t\tconst modifiedModel = CodeDiffEditor.monaco.editor.createModel(this.#modifiedContent, language);\n\t\tthis.editor.setModel({original: originalModel, modified: modifiedModel});\n\t\tif (this.#selection) this.#editor.setSelection(this.#selection);\n\n\t\tmodifiedModel.onDidChangeContent(e => {\n\t\t\tif (this.#preventChangeEvent) {\n\t\t\t\tthis.#preventChangeEvent = false;\n\t\t\t\treturn\n\t\t\t}\n\t\t\tthis.dispatchEvent(new CodeEvent('change', {editor: this.editor, changes: e.changes}));\n\t\t\tthis.dispatchEvent(new events.ChangeEvent({value: this.editor.getModel().modified.getValue()}));\n\t\t});\n\n\t\tconst modifiedEdiitor = this.#editor.getModifiedEditor();\n\t\tconst originalEditor = this.#editor.getOriginalEditor();\n\t\tmodifiedEdiitor.onDidFocusEditorText(() => this.#activeModel = modifiedEdiitor.getModel());\n\t\toriginalEditor.onDidFocusEditorText(() => this.#activeModel = originalEditor.getModel());\n\t\tmodifiedEdiitor.onKeyDown(e => {\n\t\t\tthis.dispatchEvent(new CodeEvent('keydown', {editor: this.#editor}, e.browserEvent));\n\t\t});\n\t\toriginalEditor.onKeyDown(e => {\n\t\t\tthis.dispatchEvent(new CodeEvent('keydown', {editor: this.#editor}, e.browserEvent));\n\t\t});\n\n\t\tthis.#preventChangeEvent = false;\n\t\tthis.#state = 2;\n\t\t\n\t\tthis.dispatchEvent(new CodeEvent('ready', {editor: this.#editor}));\n\t\tthis.#editor.focus();\n\n\t\tsetTimeout(() => {\n\t\t\tif (this.#language != language) {\n\t\t\t\t// if the language was changed while the editor was initializing, update the model language\n\t\t\t\tCodeDiffEditor.monaco.editor.setModelLanguage(this.#editor.getModel().modified, this.#language);\n\t\t\t\tCodeDiffEditor.monaco.editor.setModelLanguage(this.#editor.getModel().original, this.#language);\n\t\t\t}\n\t\t}, 100);\n\t}\n\n\tasync updated() {\n\t\tawait this.initEditor();\n\t\tthis.layout();\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback();\n\t\tgetThemeManager().addEventListener('change', this.#onStyleChange);\n\n\t\tif (this.hasUpdated) {\n\t\t\tthis.initEditor();\n\t\t\tthis.layout();\n\t\t}\n\t}\n\n\tdisconnectedCallback() {\n\t\tgetThemeManager().removeEventListener('change', this.#onStyleChange);\n\t\tthis.hideContainer();\n\t}\n\n\tlayout() {\n\t\tif (!this.isConnected || this.clientWidth < VISIBILITY_THRESHOLD_SIZE || this.clientHeight < VISIBILITY_THRESHOLD_SIZE) {\n\t\t\tthis.hideContainer();\n\t\t\treturn;\n\t\t}\n\n\t\tthis.showContainer();\n\t\tconst offset = dom.getElementOffset(this, document.body);\n\t\tdom.setPosition(this.container, {t: offset.top + 1, l: offset.left + 1});\n\t\t\n\t\tconst w = this.clientWidth - 1;\n\t\tconst h = this.clientHeight - 1;\n\t\tdom.setSize(this.container, { w, h });\n\n\t\tthis.#editor?.layout({width: w, height: h});\n\t}\n\n\tdispose() {\n\t\tthis.#container?.remove();\n\t\tthis.#container = null;\n\t\tthis.#editor?.dispose();\n\t\tthis.#editor = null;\n\t\tthis.#state = 0;\n\t}\n\n\tfocus() {\n\t\tthis.#editor?.focus();\n\t}\n\n}"]}

package/dist/components/codeView.d.ts

@@ -0,0 +1,19 @@
+import { Alert } from '@omegagrid/core';
+import { LitElement } from 'lit';
+export declare class CodeView extends LitElement {
+    static styles: import("lit").CSSResult[];
+    language: string;
+    scrollable: boolean;
+    content: string;
+    copy: boolean;
+    root: HTMLDivElement;
+    alertCopy: Alert;
+    get theme(): "vs" | "vs-dark";
+    onStyleChange: () => void;
+    updated(): Promise<void>;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    copyContent: () => void;
+    render: () => import("lit-html").TemplateResult<1>;
+}
+//# sourceMappingURL=codeView.d.ts.map

package/dist/components/codeView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"codeView.d.ts","sourceRoot":"","sources":["../../src/components/codeView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAmB,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAOvC,qBACa,QAAS,SAAQ,UAAU;IAEvC,MAAM,CAAC,MAAM,4BAAW;IAGxB,QAAQ,SAAgB;IAGxB,UAAU,UAAS;IAGnB,OAAO,EAAE,MAAM,CAAC;IAGhB,IAAI,UAAS;IAGb,IAAI,EAAE,cAAc,CAAC;IAGrB,SAAS,EAAE,KAAK,CAAC;IAEjB,IAAI,KAAK,qBAA+E;IAExF,aAAa,aAA8B;IAErC,OAAO;IAQb,iBAAiB;IAKjB,oBAAoB;IAIpB,WAAW,aAIV;IAED,MAAM,6CAkBJ;CAEF"}

package/dist/components/codeView.js

@@ -0,0 +1,85 @@
+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 { getThemeManager } from '@omegagrid/core';
+import { LitElement, html } from 'lit';
+import { customElement, query, property } from 'lit/decorators.js';
+import { MonacoLoader } from '../loader';
+import { msg } from '@omegagrid/localize';
+import { style } from './codeView.style';
+import { validateLanguage } from '../utils';
+let CodeView = class CodeView extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.language = 'typescript';
+        this.scrollable = false;
+        this.copy = false;
+        this.onStyleChange = () => this.requestUpdate();
+        this.copyContent = () => {
+            navigator.clipboard.writeText(this.content);
+            this.alertCopy.className = 'fade-out';
+            setTimeout(() => this.alertCopy.className = '', 2000);
+        };
+        this.render = () => html `
+		${this.copy ? html `
+			<og-button
+				id="btnCopy"
+				icon="copy"
+				color="transparent"
+				@click="${this.copyContent}">
+			</og-button>
+			<og-alert type="success" id="alertCopy"><div slot="content">${msg('copied')}</div></og-alert>
+		` : ''}
+		
+		${this.scrollable ? html `
+			<og-container>
+				<div id="root" slot="content"></div>
+			</og-container>
+		` : html `
+			<div id="root" slot="content"></div>
+		`}
+	`;
+    }
+    get theme() { return getThemeManager().activeTheme?.type == 'light' ? 'vs' : 'vs-dark'; }
+    async updated() {
+        this.root.innerHTML = '';
+        this.root.textContent = this.content;
+        const monaco = await MonacoLoader.get();
+        const language = await validateLanguage(this.language);
+        monaco.editor.colorizeElement(this.root, { mimeType: language, theme: this.theme });
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        getThemeManager().addEventListener('change', this.onStyleChange);
+    }
+    disconnectedCallback() {
+        getThemeManager().removeEventListener('change', this.onStyleChange);
+    }
+};
+CodeView.styles = [style];
+__decorate([
+    property({ type: String })
+], CodeView.prototype, "language", void 0);
+__decorate([
+    property({ type: Boolean })
+], CodeView.prototype, "scrollable", void 0);
+__decorate([
+    property({ type: String })
+], CodeView.prototype, "content", void 0);
+__decorate([
+    property({ type: Boolean })
+], CodeView.prototype, "copy", void 0);
+__decorate([
+    query('#root')
+], CodeView.prototype, "root", void 0);
+__decorate([
+    query('#alertCopy')
+], CodeView.prototype, "alertCopy", void 0);
+CodeView = __decorate([
+    customElement('og-code-view')
+], CodeView);
+export { CodeView };
+//# sourceMappingURL=codeView.js.map