feat(dees-editor): integrate Monaco version management and update CDN references

This commit is contained in:
2025-09-18 13:39:59 +00:00
parent b47c2053b5
commit b46fe8fe93
6 changed files with 54 additions and 5 deletions

View File

@@ -10,7 +10,8 @@
"test": "tstest test/ --web --verbose --timeout 30 --logfile",
"build": "tsbuild tsfolders --allowimplicitany && tsbundle element --production --bundler esbuild",
"watch": "tswatch element",
"buildDocs": "tsdoc"
"buildDocs": "tsdoc",
"postinstall": "node scripts/update-monaco-version.cjs"
},
"author": "Lossless GmbH",
"license": "MIT",

Binary file not shown.

View File

@@ -0,0 +1,44 @@
#!/usr/bin/env node
const fs = require('fs');
const path = require('path');
const projectRoot = path.resolve(__dirname, '..');
function resolveMonacoPackageJson() {
try {
const resolvedPath = require.resolve('monaco-editor/package.json', {
paths: [projectRoot],
});
return resolvedPath;
} catch (error) {
console.error('[dees-editor] Unable to resolve monaco-editor/package.json');
throw error;
}
}
function getMonacoVersion() {
const monacoPackagePath = resolveMonacoPackageJson();
const monacoPackage = require(monacoPackagePath);
if (!monacoPackage.version) {
throw new Error('[dees-editor] monaco-editor/package.json does not expose a version field');
}
return monacoPackage.version;
}
function writeVersionModule(version) {
const targetDir = path.join(projectRoot, 'ts_web', 'elements', 'dees-editor');
fs.mkdirSync(targetDir, { recursive: true });
const targetFile = path.join(targetDir, 'version.ts');
const fileContent = `// Auto-generated by scripts/update-monaco-version.cjs\nexport const MONACO_VERSION = '${version}';\n`;
fs.writeFileSync(targetFile, fileContent, 'utf8');
console.log(`[dees-editor] Wrote ${path.relative(projectRoot, targetFile)} with monaco-editor@${version}`);
}
try {
const version = getMonacoVersion();
writeVersionModule(version);
} catch (error) {
console.error('[dees-editor] Failed to update Monaco version module.');
console.error(error instanceof Error ? error.message : error);
process.exitCode = 1;
}

View File

@@ -8,6 +8,7 @@ import {
cssManager,
} from '@design.estate/dees-element';
import * as domtools from '@design.estate/dees-domtools';
import { MONACO_VERSION } from './version.js';
import type * as monaco from 'monaco-editor';
@@ -80,10 +81,11 @@ export class DeesEditor extends DeesElement {
): Promise<void> {
super.firstUpdated(_changedProperties);
const container = this.shadowRoot.getElementById('container');
const monacoCdnBase = `https://cdn.jsdelivr.net/npm/monaco-editor@${MONACO_VERSION}`;
if (!DeesEditor.monacoDeferred) {
DeesEditor.monacoDeferred = domtools.plugins.smartpromise.defer();
const scriptUrl = `https://cdn.jsdelivr.net/npm/monaco-editor/min/vs/loader.js`;
const scriptUrl = `${monacoCdnBase}/min/vs/loader.js`;
const script = document.createElement('script');
script.src = scriptUrl;
script.onload = () => {
@@ -94,7 +96,7 @@ export class DeesEditor extends DeesElement {
await DeesEditor.monacoDeferred.promise;
(window as any).require.config({
paths: { vs: 'https://cdn.jsdelivr.net/npm/monaco-editor/min/vs' },
paths: { vs: `${monacoCdnBase}/min/vs` },
});
(window as any).require(['vs/editor/editor.main'], async () => {
const editor = ((window as any).monaco.editor as typeof monaco.editor).create(container, {
@@ -109,7 +111,7 @@ export class DeesEditor extends DeesElement {
this.editorDeferred.resolve(editor);
});
const css = await (
await fetch('https://cdn.jsdelivr.net/npm/monaco-editor/min/vs/editor/editor.main.css')
await fetch(`${monacoCdnBase}/min/vs/editor/editor.main.css`)
).text();
const styleElement = document.createElement('style');
styleElement.textContent = css;

View File

@@ -0,0 +1,2 @@
// Auto-generated by scripts/update-monaco-version.cjs
export const MONACO_VERSION = '0.52.2';

View File

@@ -19,7 +19,7 @@ export * from './dees-contextmenu.js';
export * from './dees-dataview-codebox.js';
export * from './dees-dataview-statusobject.js';
export * from './dees-dashboardgrid/index.js';
export * from './dees-editor.js';
export * from './dees-editor/dees-editor.js';
export * from './dees-editor-markdown.js';
export * from './dees-editor-markdownoutlet.js';
export * from './dees-form-submit.js';