modern-monaco 0.2.2 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -249,7 +249,7 @@ lazy({
249
249
  },
250
250
  ],
251
251
  // The CDN for loading language grammars and themes. Default is "https://esm.sh"
252
- tmDownloadCDN: "https://esm.sh",
252
+ cdn: "https://esm.sh",
253
253
  });
254
254
  ```
255
255
 
package/dist/core.mjs CHANGED
@@ -40,16 +40,15 @@ function isObject(v) {
40
40
  }
41
41
 
42
42
  // package.json
43
- var version = "0.2.2";
43
+ var version = "0.3.1";
44
44
 
45
45
  // src/core.ts
46
46
  import { getExtnameFromLanguageId, getLanguageIdFromPath, grammars, initShiki, setDefaultWasmLoader, themes } from "./shiki.mjs";
47
47
  import { initShikiMonacoTokenizer, registerShikiMonacoTokenizer } from "./shiki.mjs";
48
48
  import { render } from "./shiki.mjs";
49
49
  import { getWasmInstance } from "./shiki-wasm.mjs";
50
- import { ErrorNotFound, Workspace } from "./workspace.mjs";
51
- import { debunce, decode, isDigital } from "./util.mjs";
52
- import { init as initLspClient } from "./lsp/client.mjs";
50
+ import { NotFoundError, Workspace } from "./workspace.mjs";
51
+ import { debunce, decode, getCDNUrl, isDigital } from "./util.mjs";
53
52
  var editorProps = [
54
53
  "autoDetectHighContrast",
55
54
  "automaticLayout",
@@ -82,19 +81,18 @@ var editorProps = [
82
81
  "wordWrap"
83
82
  ];
84
83
  var errors = {
85
- NotFound: ErrorNotFound
84
+ NotFound: NotFoundError
86
85
  };
87
- var cdnUrl = `https://esm.sh/modern-monaco@${version}`;
88
86
  var syntaxes = [];
89
87
  var lspProviders = {};
90
- var attr = (el, name) => el.getAttribute(name);
91
- var style = (el, style2) => Object.assign(el.style, style2);
88
+ var getAttr = (el, name) => el.getAttribute(name);
89
+ var setStyle = (el, style) => Object.assign(el.style, style);
92
90
  async function init(options) {
93
91
  const langs = (options?.langs ?? []).concat(syntaxes);
94
- const hightlighter = await initShiki({ ...options, langs });
95
- return loadMonaco(hightlighter, options?.workspace, options?.lsp);
92
+ const shiki = await initShiki({ ...options, langs });
93
+ return loadMonaco(shiki, options?.workspace, options?.lsp, options?.cdn);
96
94
  }
97
- async function lazy(options) {
95
+ function lazy(options) {
98
96
  if (!customElements.get("monaco-editor")) {
99
97
  let monacoPromise = null;
100
98
  customElements.define(
@@ -106,7 +104,7 @@ async function lazy(options) {
106
104
  for (const attrName of this.getAttributeNames()) {
107
105
  const key = editorProps.find((k) => k.toLowerCase() === attrName);
108
106
  if (key) {
109
- let value = attr(this, attrName);
107
+ let value = getAttr(this, attrName);
110
108
  if (value === "") {
111
109
  value = key === "minimap" || key === "stickyScroll" ? { enabled: true } : true;
112
110
  } else {
@@ -170,13 +168,13 @@ async function lazy(options) {
170
168
  }
171
169
  firstEl.remove();
172
170
  }
173
- style(this, { display: "block", position: "relative" });
174
- let widthAttr = attr(this, "width");
175
- let heightAttr = attr(this, "height");
171
+ setStyle(this, { display: "block", position: "relative" });
172
+ let widthAttr = getAttr(this, "width");
173
+ let heightAttr = getAttr(this, "height");
176
174
  if (isDigital(widthAttr) && isDigital(heightAttr)) {
177
175
  const width = Number(widthAttr);
178
176
  const height = Number(heightAttr);
179
- style(this, { width: width + "px", height: height + "px" });
177
+ setStyle(this, { width: width + "px", height: height + "px" });
180
178
  renderOptions.dimension = { width, height };
181
179
  } else {
182
180
  if (isDigital(widthAttr)) {
@@ -190,7 +188,7 @@ async function lazy(options) {
190
188
  }
191
189
  const containerEl = document.createElement("div");
192
190
  containerEl.className = "monaco-editor-container";
193
- style(containerEl, { width: "100%", height: "100%" });
191
+ setStyle(containerEl, { width: "100%", height: "100%" });
194
192
  this.appendChild(containerEl);
195
193
  if (!filename && workspace) {
196
194
  if (workspace.history.state.current) {
@@ -213,14 +211,12 @@ async function lazy(options) {
213
211
  langs.push(lang);
214
212
  }
215
213
  }
216
- if (renderOptions.theme) {
217
- renderOptions.theme = renderOptions.theme.toLowerCase().replace(/ +/g, "-");
214
+ let theme = options?.theme ?? renderOptions.theme;
215
+ if (typeof theme === "string") {
216
+ theme = theme.toLowerCase().replace(/ +/g, "-");
218
217
  }
219
- const highlighter = await initShiki({
220
- ...options,
221
- theme: renderOptions.theme ?? options?.theme,
222
- langs
223
- });
218
+ const highlighter = await initShiki({ ...options, theme, langs });
219
+ renderOptions.theme = highlighter.getLoadedThemes()[0];
224
220
  let prerenderEl;
225
221
  for (const el of this.children) {
226
222
  if (el.className === "monaco-editor-prerender") {
@@ -236,14 +232,14 @@ async function lazy(options) {
236
232
  prerenderEl.className = "monaco-editor-prerender";
237
233
  prerenderEl.innerHTML = render(highlighter, decode(code2), { ...renderOptions, language });
238
234
  } catch (error) {
239
- if (error instanceof ErrorNotFound) {
235
+ if (error instanceof NotFoundError) {
240
236
  } else {
241
237
  throw error;
242
238
  }
243
239
  }
244
240
  }
245
241
  if (prerenderEl) {
246
- style(prerenderEl, { position: "absolute", top: "0", left: "0" });
242
+ setStyle(prerenderEl, { position: "absolute", top: "0", left: "0" });
247
243
  this.appendChild(prerenderEl);
248
244
  if (filename && workspace) {
249
245
  const viewState = await workspace.viewState.get(filename);
@@ -257,7 +253,7 @@ async function lazy(options) {
257
253
  }
258
254
  }
259
255
  {
260
- const monaco = await (monacoPromise ?? (monacoPromise = loadMonaco(highlighter, workspace, options?.lsp)));
256
+ const monaco = await (monacoPromise ?? (monacoPromise = loadMonaco(highlighter, workspace, options?.lsp, options?.cdn)));
261
257
  const editor = monaco.editor.create(containerEl, renderOptions);
262
258
  if (workspace) {
263
259
  const storeViewState = () => {
@@ -285,7 +281,7 @@ async function lazy(options) {
285
281
  model.setValue(code);
286
282
  }
287
283
  } catch (error) {
288
- if (error instanceof ErrorNotFound) {
284
+ if (error instanceof NotFoundError) {
289
285
  if (code) {
290
286
  const dirname = filename.split("/").slice(0, -1).join("/");
291
287
  if (dirname) {
@@ -331,13 +327,13 @@ async function lazy(options) {
331
327
  function hydrate(options) {
332
328
  return lazy(options);
333
329
  }
334
- async function loadMonaco(highlighter, workspace, lsp) {
335
- let importmap = null;
336
- let editorCoreModuleUrl = `${cdnUrl}/es2022/editor-core.mjs`;
337
- let lspModuleUrl = `${cdnUrl}/es2022/lsp.mjs`;
338
- if (importmap = document.querySelector("script[type='importmap']")) {
330
+ async function loadMonaco(highlighter, workspace, lsp, cdn) {
331
+ let editorCoreModuleUrl = getCDNUrl(`/modern-monaco@${version}/dist/editor-core.mjs`, cdn);
332
+ let lspModuleUrl = getCDNUrl(`/modern-monaco@${version}/dist/lsp/index.mjs`, cdn);
333
+ let importmapEl = null;
334
+ if (importmapEl = document.querySelector("script[type='importmap']")) {
339
335
  try {
340
- const { imports = {} } = parseImportMapFromJson(importmap.textContent);
336
+ const { imports = {} } = parseImportMapFromJson(importmapEl.textContent);
341
337
  if (imports["modern-monaco/editor-core"]) {
342
338
  editorCoreModuleUrl = imports["modern-monaco/editor-core"];
343
339
  }
@@ -347,16 +343,13 @@ async function loadMonaco(highlighter, workspace, lsp) {
347
343
  } catch (error) {
348
344
  }
349
345
  }
350
- const builtinLSP = globalThis.MonacoEnvironment?.builtinLSP;
346
+ const useBuiltinLSP = globalThis.MonacoEnvironment?.useBuiltinLSP;
351
347
  const [monaco, { builtinLSPProviders }] = await Promise.all([
352
348
  import(editorCoreModuleUrl),
353
- builtinLSP ? import(lspModuleUrl) : Promise.resolve({ builtinLSPProviders: {} })
349
+ useBuiltinLSP ? import(lspModuleUrl) : Promise.resolve({ builtinLSPProviders: {} })
354
350
  ]);
355
- const lspProviderMap = { ...builtinLSPProviders, ...lspProviders, ...lsp?.providers };
351
+ const allLspProviders = { ...builtinLSPProviders, ...lspProviders, ...lsp?.providers };
356
352
  workspace?.setupMonaco(monaco);
357
- if (Object.keys(lspProviderMap).length > 0) {
358
- initLspClient(monaco);
359
- }
360
353
  if (!document.getElementById("monaco-editor-core-css")) {
361
354
  const styleEl = document.createElement("style");
362
355
  styleEl.id = "monaco-editor-core-css";
@@ -388,7 +381,7 @@ async function loadMonaco(highlighter, workspace, lsp) {
388
381
  await workspace._openTextDocument(resource.toString(), editor, selectionOrPosition);
389
382
  return true;
390
383
  } catch (err) {
391
- if (err instanceof ErrorNotFound) {
384
+ if (err instanceof NotFoundError) {
392
385
  return false;
393
386
  }
394
387
  throw err;
@@ -443,9 +436,9 @@ async function loadMonaco(highlighter, workspace, lsp) {
443
436
  }
444
437
  registerShikiMonacoTokenizer(monaco, highlighter, id);
445
438
  let lspLabel = id;
446
- let lspProvider = lspProviderMap[lspLabel];
439
+ let lspProvider = allLspProviders[lspLabel];
447
440
  if (!lspProvider) {
448
- const alias = Object.entries(lspProviderMap).find(([, lsp2]) => lsp2.aliases?.includes(id));
441
+ const alias = Object.entries(allLspProviders).find(([, lsp2]) => lsp2.aliases?.includes(id));
449
442
  if (alias) {
450
443
  [lspLabel, lspProvider] = alias;
451
444
  }