stream-monaco 0.0.7 → 0.0.9

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.
Files changed (7) hide show
  1. package/README.md +0 -2
  2. package/README.zh-CN.md +0 -17
  3. package/dist/index.cjs +31 -100
  4. package/dist/index.d.cts +1 -9
  5. package/dist/index.d.ts +1 -9
  6. package/dist/index.js +33 -101
  7. package/package.json +17 -19
package/README.md CHANGED
@@ -464,8 +464,6 @@ cleanupEditor()
464
464
  <script type="module" src="/main.ts"></script>
465
465
  ```
466
466
 
467
- The library also exposes `isDark` (a small reactive ref) that follows `<html class="dark">` or the system color-scheme. Theme switching inside the editor is handled automatically.
468
-
469
467
  ### Migration notes
470
468
 
471
469
  - v0.0.34+: Internal reactivity is implemented via a thin adapter over `alien-signals`, removing the hard dependency on Vue. Vue remains fully supported but is optional. No breaking changes to the public API.
package/README.zh-CN.md CHANGED
@@ -20,7 +20,6 @@ IMPORTANT: Since v0.0.32 the library enables a default time-based throttle for `
20
20
 
21
21
  说明：内部响应式基于 `alien-signals` 的轻薄适配层实现，因此核心逻辑不再强依赖 Vue。Vue 仍然完全支持，但被标记为可选的 peer 依赖，使库在非 Vue 环境也可复用核心能力，且对现有 API 无破坏。
22
22
  - 🎨 **Shiki 高亮** - 使用 Shiki 实现高效的语法高亮，支持 TextMate 语法和 VS Code 主题
23
- - 🌓 **主题切换** - 自动监听 isDark 模式变化，智能切换明暗主题
24
23
  - 📝 **流式更新** - 支持流式输入更新，实时响应代码变化
25
24
 
26
25
  - `registerMonacoThemes(themes, languages): Promise<Highlighter>` — 使用 shiki 创建或获取高亮器并把主题注册到 Monaco，返回解析为 shiki highlighter 的 Promise，便于复用（例如渲染页面片段）。
@@ -264,8 +263,6 @@ cleanupEditor()
264
263
  <script type="module" src="/main.ts"></script>
265
264
  ```
266
265
 
267
- 库同时暴露 `isDark`（响应式 ref），会跟随 `<html class="dark">` 或系统颜色偏好，编辑器内部会自动应用主题。
268
-
269
266
  ### React 基础用法
270
267
 
271
268
  ```tsx
@@ -713,20 +710,6 @@ onUnmounted(() => {
713
710
  </script>
714
711
  ```
715
712
 
716
- #### 3. 主题跟随系统
717
-
718
- ```typescript
719
- import { useDark } from '@vueuse/core'
720
-
721
- const isDark = useDark()
722
-
723
- const { createEditor, setTheme } = useMonaco({
724
- themes: ['github-dark', 'github-light'],
725
- })
726
-
727
- // 主题会自动跟随 isDark 状态切换
728
- ```
729
-
730
713
  ### 故障排除
731
714
 
732
715
  #### 1. 打包后编辑器无法显示
package/dist/index.cjs CHANGED
@@ -1928,85 +1928,6 @@ var EditorManager = class {
1928
1928
  }
1929
1929
  };
1930
1930
 
1931
- //#endregion
1932
- //#region src/reactivity.ts
1933
- function ref(initial) {
1934
- const s = (0, alien_signals.signal)(initial);
1935
- return Object.defineProperty({}, "value", {
1936
- get() {
1937
- return s();
1938
- },
1939
- set(v) {
1940
- s(v);
1941
- },
1942
- enumerable: true,
1943
- configurable: false
1944
- });
1945
- }
1946
- function computed(getter) {
1947
- const c = (0, alien_signals.computed)(() => getter());
1948
- return Object.defineProperty({}, "value", {
1949
- get() {
1950
- return c();
1951
- },
1952
- set(_) {},
1953
- enumerable: true,
1954
- configurable: false
1955
- });
1956
- }
1957
- function watch(source, cb, options = {}) {
1958
- let initialized = false;
1959
- let oldVal;
1960
- const stop = (0, alien_signals.effect)(() => {
1961
- const newVal = source();
1962
- if (!initialized) {
1963
- initialized = true;
1964
- if (options.immediate) if (options.flush === "post") queueMicrotask(() => cb(newVal, oldVal));
1965
- else cb(newVal, oldVal);
1966
- } else if (!Object.is(newVal, oldVal)) if (options.flush === "post") queueMicrotask(() => cb(newVal, oldVal));
1967
- else cb(newVal, oldVal);
1968
- oldVal = newVal;
1969
- });
1970
- return stop;
1971
- }
1972
-
1973
- //#endregion
1974
- //#region src/isDark.ts
1975
- const isDark = ref(false);
1976
- function computeIsDark() {
1977
- var _el$classList, _window$matchMedia, _window;
1978
- if (typeof window === "undefined" || typeof document === "undefined") return false;
1979
- const el = document.documentElement;
1980
- const hasClass = ((_el$classList = el.classList) === null || _el$classList === void 0 ? void 0 : _el$classList.contains("dark")) ?? false;
1981
- const mql = (_window$matchMedia = (_window = window).matchMedia) === null || _window$matchMedia === void 0 ? void 0 : _window$matchMedia.call(_window, "(prefers-color-scheme: dark)");
1982
- const prefersDark = !!(mql === null || mql === void 0 ? void 0 : mql.matches);
1983
- return hasClass || prefersDark;
1984
- }
1985
- if (typeof window !== "undefined" && typeof document !== "undefined") {
1986
- var _window$matchMedia2, _window2;
1987
- const el = document.documentElement;
1988
- const mql = (_window$matchMedia2 = (_window2 = window).matchMedia) === null || _window$matchMedia2 === void 0 ? void 0 : _window$matchMedia2.call(_window2, "(prefers-color-scheme: dark)");
1989
- const update = () => {
1990
- isDark.value = computeIsDark();
1991
- };
1992
- update();
1993
- const onMqlChange = () => update();
1994
- if (mql) mql.addEventListener ? mql.addEventListener("change", onMqlChange) : mql.addListener(onMqlChange);
1995
- const mo = new MutationObserver(update);
1996
- mo.observe(el, {
1997
- attributes: true,
1998
- attributeFilter: ["class"]
1999
- });
2000
- const cleanup = () => {
2001
- if (mql) mql.removeEventListener ? mql.removeEventListener("change", onMqlChange) : mql.removeListener(onMqlChange);
2002
- mo.disconnect();
2003
- window.removeEventListener("pagehide", cleanup);
2004
- window.removeEventListener("beforeunload", cleanup);
2005
- };
2006
- window.addEventListener("pagehide", cleanup);
2007
- window.addEventListener("beforeunload", cleanup);
2008
- }
2009
-
2010
1931
  //#endregion
2011
1932
  //#region src/preloadMonacoWorkers.ts
2012
1933
  async function preloadMonacoWorkers() {
@@ -2046,6 +1967,20 @@ async function preloadMonacoWorkers() {
2046
1967
  } catch {}
2047
1968
  }
2048
1969
 
1970
+ //#endregion
1971
+ //#region src/reactivity.ts
1972
+ function computed(getter) {
1973
+ const c = (0, alien_signals.computed)(() => getter());
1974
+ return Object.defineProperty({}, "value", {
1975
+ get() {
1976
+ return c();
1977
+ },
1978
+ set(_) {},
1979
+ enumerable: true,
1980
+ configurable: false
1981
+ });
1982
+ }
1983
+
2049
1984
  //#endregion
2050
1985
  //#region src/utils/arraysEqual.ts
2051
1986
  function arraysEqual(a, b) {
@@ -2148,8 +2083,8 @@ async function registerMonacoThemes(themes, languages$1) {
2148
2083
  const highlighter = await getOrCreateHighlighter(themes, languages$1);
2149
2084
  (0, __shikijs_monaco.shikiToMonaco)(highlighter, monaco_shim_exports);
2150
2085
  themesRegistered = true;
2151
- currentThemes = themes;
2152
- currentLanguages = languages$1;
2086
+ currentThemes = themes.slice();
2087
+ currentLanguages = languages$1.slice();
2153
2088
  return highlighter;
2154
2089
  })();
2155
2090
  setThemeRegisterPromise(p);
@@ -2313,7 +2248,7 @@ function useMonaco(monacoOptions = {}) {
2313
2248
  const appendBuffer = [];
2314
2249
  let appendBufferScheduled = false;
2315
2250
  let lastAppliedTheme = null;
2316
- const currentTheme = computed(() => monacoOptions.theme ?? (isDark.value ? typeof themes[0] === "string" ? themes[0] : themes[0].name : typeof themes[1] === "string" ? themes[1] : themes[1].name));
2251
+ const currentTheme = computed(() => monacoOptions.theme ?? (typeof themes[0] === "string" ? themes[0] : themes[0].name));
2317
2252
  let themeWatcher = null;
2318
2253
  const rafScheduler = createRafScheduler();
2319
2254
  async function setThemeInternal(theme, force = false) {
@@ -2352,6 +2287,12 @@ function useMonaco(monacoOptions = {}) {
2352
2287
  console.warn("onThemeChange callback threw an error:", err);
2353
2288
  }
2354
2289
  }
2290
+ async function ensureThemeRegistered(themeName) {
2291
+ const availableNames = themes.map((t) => typeof t === "string" ? t : t.name);
2292
+ const list = availableNames.includes(themeName) ? themes : themes.concat(themeName);
2293
+ const p = setThemeRegisterPromise(registerMonacoThemes(list, languages$1));
2294
+ if (p) await p;
2295
+ }
2355
2296
  function hasVerticalScrollbar() {
2356
2297
  if (!editorView) return false;
2357
2298
  if (_hasScrollBar) return true;
@@ -2392,19 +2333,17 @@ function useMonaco(monacoOptions = {}) {
2392
2333
  const ds = monacoOptions.onBeforeCreate(monaco_shim_exports);
2393
2334
  if (ds) disposals.push(...ds);
2394
2335
  }
2395
- await setThemeRegisterPromise(registerMonacoThemes(themes, languages$1));
2396
2336
  const initialThemeName = monacoOptions.theme ?? currentTheme.value;
2397
- lastAppliedTheme = initialThemeName;
2337
+ await ensureThemeRegistered(initialThemeName);
2398
2338
  editorMgr = new EditorManager(monacoOptions, maxHeightValue, maxHeightCSS, autoScrollOnUpdate, autoScrollInitial, autoScrollThresholdPx, autoScrollThresholdLines, monacoOptions.revealDebounceMs);
2399
2339
  editorView = await editorMgr.createEditor(container, code, language, initialThemeName);
2340
+ lastAppliedTheme = initialThemeName;
2341
+ if (pendingUpdate && editorMgr) {
2342
+ const { code: queuedCode, lang: queuedLang } = pendingUpdate;
2343
+ pendingUpdate = null;
2344
+ editorMgr.updateCode(queuedCode, queuedLang);
2345
+ }
2400
2346
  if (typeof monacoOptions.onThemeChange === "function") monacoOptions.onThemeChange(initialThemeName);
2401
- if (!monacoOptions.theme) themeWatcher = watch(() => isDark.value, () => {
2402
- const t = currentTheme.value;
2403
- if (t !== lastAppliedTheme) setThemeInternal(t);
2404
- }, {
2405
- flush: "post",
2406
- immediate: true
2407
- });
2408
2347
  if (editorView) lastKnownCode = editorView.getValue();
2409
2348
  return editorView;
2410
2349
  }
@@ -2426,8 +2365,8 @@ function useMonaco(monacoOptions = {}) {
2426
2365
  const ds = monacoOptions.onBeforeCreate(monaco_shim_exports);
2427
2366
  if (ds) disposals.push(...ds);
2428
2367
  }
2429
- await setThemeRegisterPromise(registerMonacoThemes(themes, languages$1));
2430
2368
  const initialThemeName = monacoOptions.theme ?? currentTheme.value;
2369
+ await ensureThemeRegistered(initialThemeName);
2431
2370
  try {
2432
2371
  monaco_shim_exports.editor.setTheme(initialThemeName);
2433
2372
  lastAppliedTheme = initialThemeName;
@@ -2435,13 +2374,6 @@ function useMonaco(monacoOptions = {}) {
2435
2374
  diffMgr = new DiffEditorManager(monacoOptions, maxHeightValue, maxHeightCSS, autoScrollOnUpdate, autoScrollInitial, autoScrollThresholdPx, autoScrollThresholdLines, diffAutoScroll, monacoOptions.revealDebounceMs);
2436
2375
  diffEditorView = await diffMgr.createDiffEditor(container, originalCode, modifiedCode, language, initialThemeName);
2437
2376
  if (typeof monacoOptions.onThemeChange === "function") monacoOptions.onThemeChange(initialThemeName);
2438
- if (!monacoOptions.theme) themeWatcher = watch(() => isDark.value, () => {
2439
- const t = currentTheme.value;
2440
- if (t !== lastAppliedTheme) setThemeInternal(t);
2441
- }, {
2442
- flush: "post",
2443
- immediate: true
2444
- });
2445
2377
  const models = diffMgr.getDiffModels();
2446
2378
  originalModel = models.original;
2447
2379
  modifiedModel = models.modified;
@@ -2778,7 +2710,6 @@ exports.clearHighlighterCache = clearHighlighterCache;
2778
2710
  exports.defaultRevealDebounceMs = defaultRevealDebounceMs;
2779
2711
  exports.detectLanguage = detectLanguage;
2780
2712
  exports.getOrCreateHighlighter = getOrCreateHighlighter;
2781
- exports.isDark = isDark;
2782
2713
  exports.preloadMonacoWorkers = preloadMonacoWorkers;
2783
2714
  exports.registerMonacoThemes = registerMonacoThemes;
2784
2715
  exports.useMonaco = useMonaco;
package/dist/index.d.cts CHANGED
@@ -126,14 +126,6 @@ declare function detectLanguage(code: string, additionalLanguages?: LanguageDefi
126
126
  //#endregion
127
127
  //#region src/constant.d.ts
128
128
  declare const defaultRevealDebounceMs = 75;
129
- //#endregion
130
- //#region src/reactivity.d.ts
131
- interface Ref<T> {
132
- value: T;
133
- }
134
- //#endregion
135
- //#region src/isDark.d.ts
136
- declare const isDark: Ref<boolean>;
137
129
  declare namespace monaco_shim_d_exports {
138
130
  export { monaco as default };
139
131
  }
@@ -285,4 +277,4 @@ declare function useMonaco(monacoOptions?: MonacoOptions): {
285
277
  } | null;
286
278
  };
287
279
  //#endregion
288
- export { MonacoDiffEditorInstance, MonacoEditorInstance, MonacoLanguage, MonacoOptions, MonacoTheme, RevealStrategy, ShikiHighlighter, clearHighlighterCache, defaultRevealDebounceMs, detectLanguage, getOrCreateHighlighter, isDark, preloadMonacoWorkers, registerMonacoThemes, useMonaco };
280
+ export { MonacoDiffEditorInstance, MonacoEditorInstance, MonacoLanguage, MonacoOptions, MonacoTheme, RevealStrategy, ShikiHighlighter, clearHighlighterCache, defaultRevealDebounceMs, detectLanguage, getOrCreateHighlighter, preloadMonacoWorkers, registerMonacoThemes, useMonaco };
package/dist/index.d.ts CHANGED
@@ -125,14 +125,6 @@ declare function detectLanguage(code: string, additionalLanguages?: LanguageDefi
125
125
  //#endregion
126
126
  //#region src/constant.d.ts
127
127
  declare const defaultRevealDebounceMs = 75;
128
- //#endregion
129
- //#region src/reactivity.d.ts
130
- interface Ref<T> {
131
- value: T;
132
- }
133
- //#endregion
134
- //#region src/isDark.d.ts
135
- declare const isDark: Ref<boolean>;
136
128
  declare namespace monaco_shim_d_exports {
137
129
  export { monaco as default };
138
130
  }
@@ -284,4 +276,4 @@ declare function useMonaco(monacoOptions?: MonacoOptions): {
284
276
  } | null;
285
277
  };
286
278
  //#endregion
287
- export { MonacoDiffEditorInstance, MonacoEditorInstance, MonacoLanguage, MonacoOptions, MonacoTheme, RevealStrategy, ShikiHighlighter, clearHighlighterCache, defaultRevealDebounceMs, detectLanguage, getOrCreateHighlighter, isDark, preloadMonacoWorkers, registerMonacoThemes, useMonaco };
279
+ export { MonacoDiffEditorInstance, MonacoEditorInstance, MonacoLanguage, MonacoOptions, MonacoTheme, RevealStrategy, ShikiHighlighter, clearHighlighterCache, defaultRevealDebounceMs, detectLanguage, getOrCreateHighlighter, preloadMonacoWorkers, registerMonacoThemes, useMonaco };
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { __export, __reExport } from "./chunk-CHLpw0oG.js";
2
2
  import * as _monaco from "monaco-editor";
3
- import { computed, effect, signal } from "alien-signals";
3
+ import { computed } from "alien-signals";
4
4
  import { shikiToMonaco } from "@shikijs/monaco";
5
5
  import { createHighlighter } from "shiki";
6
6
 
@@ -1900,85 +1900,6 @@ var EditorManager = class {
1900
1900
  }
1901
1901
  };
1902
1902
 
1903
- //#endregion
1904
- //#region src/reactivity.ts
1905
- function ref(initial) {
1906
- const s = signal(initial);
1907
- return Object.defineProperty({}, "value", {
1908
- get() {
1909
- return s();
1910
- },
1911
- set(v) {
1912
- s(v);
1913
- },
1914
- enumerable: true,
1915
- configurable: false
1916
- });
1917
- }
1918
- function computed$1(getter) {
1919
- const c = computed(() => getter());
1920
- return Object.defineProperty({}, "value", {
1921
- get() {
1922
- return c();
1923
- },
1924
- set(_) {},
1925
- enumerable: true,
1926
- configurable: false
1927
- });
1928
- }
1929
- function watch(source, cb, options = {}) {
1930
- let initialized = false;
1931
- let oldVal;
1932
- const stop = effect(() => {
1933
- const newVal = source();
1934
- if (!initialized) {
1935
- initialized = true;
1936
- if (options.immediate) if (options.flush === "post") queueMicrotask(() => cb(newVal, oldVal));
1937
- else cb(newVal, oldVal);
1938
- } else if (!Object.is(newVal, oldVal)) if (options.flush === "post") queueMicrotask(() => cb(newVal, oldVal));
1939
- else cb(newVal, oldVal);
1940
- oldVal = newVal;
1941
- });
1942
- return stop;
1943
- }
1944
-
1945
- //#endregion
1946
- //#region src/isDark.ts
1947
- const isDark = ref(false);
1948
- function computeIsDark() {
1949
- var _el$classList, _window$matchMedia, _window;
1950
- if (typeof window === "undefined" || typeof document === "undefined") return false;
1951
- const el = document.documentElement;
1952
- const hasClass = ((_el$classList = el.classList) === null || _el$classList === void 0 ? void 0 : _el$classList.contains("dark")) ?? false;
1953
- const mql = (_window$matchMedia = (_window = window).matchMedia) === null || _window$matchMedia === void 0 ? void 0 : _window$matchMedia.call(_window, "(prefers-color-scheme: dark)");
1954
- const prefersDark = !!(mql === null || mql === void 0 ? void 0 : mql.matches);
1955
- return hasClass || prefersDark;
1956
- }
1957
- if (typeof window !== "undefined" && typeof document !== "undefined") {
1958
- var _window$matchMedia2, _window2;
1959
- const el = document.documentElement;
1960
- const mql = (_window$matchMedia2 = (_window2 = window).matchMedia) === null || _window$matchMedia2 === void 0 ? void 0 : _window$matchMedia2.call(_window2, "(prefers-color-scheme: dark)");
1961
- const update = () => {
1962
- isDark.value = computeIsDark();
1963
- };
1964
- update();
1965
- const onMqlChange = () => update();
1966
- if (mql) mql.addEventListener ? mql.addEventListener("change", onMqlChange) : mql.addListener(onMqlChange);
1967
- const mo = new MutationObserver(update);
1968
- mo.observe(el, {
1969
- attributes: true,
1970
- attributeFilter: ["class"]
1971
- });
1972
- const cleanup = () => {
1973
- if (mql) mql.removeEventListener ? mql.removeEventListener("change", onMqlChange) : mql.removeListener(onMqlChange);
1974
- mo.disconnect();
1975
- window.removeEventListener("pagehide", cleanup);
1976
- window.removeEventListener("beforeunload", cleanup);
1977
- };
1978
- window.addEventListener("pagehide", cleanup);
1979
- window.addEventListener("beforeunload", cleanup);
1980
- }
1981
-
1982
1903
  //#endregion
1983
1904
  //#region src/preloadMonacoWorkers.ts
1984
1905
  async function preloadMonacoWorkers() {
@@ -2018,6 +1939,20 @@ async function preloadMonacoWorkers() {
2018
1939
  } catch {}
2019
1940
  }
2020
1941
 
1942
+ //#endregion
1943
+ //#region src/reactivity.ts
1944
+ function computed$1(getter) {
1945
+ const c = computed(() => getter());
1946
+ return Object.defineProperty({}, "value", {
1947
+ get() {
1948
+ return c();
1949
+ },
1950
+ set(_) {},
1951
+ enumerable: true,
1952
+ configurable: false
1953
+ });
1954
+ }
1955
+
2021
1956
  //#endregion
2022
1957
  //#region src/utils/arraysEqual.ts
2023
1958
  function arraysEqual(a, b) {
@@ -2120,8 +2055,8 @@ async function registerMonacoThemes(themes, languages$1) {
2120
2055
  const highlighter = await getOrCreateHighlighter(themes, languages$1);
2121
2056
  shikiToMonaco(highlighter, monaco_shim_exports);
2122
2057
  themesRegistered = true;
2123
- currentThemes = themes;
2124
- currentLanguages = languages$1;
2058
+ currentThemes = themes.slice();
2059
+ currentLanguages = languages$1.slice();
2125
2060
  return highlighter;
2126
2061
  })();
2127
2062
  setThemeRegisterPromise(p);
@@ -2285,7 +2220,7 @@ function useMonaco(monacoOptions = {}) {
2285
2220
  const appendBuffer = [];
2286
2221
  let appendBufferScheduled = false;
2287
2222
  let lastAppliedTheme = null;
2288
- const currentTheme = computed$1(() => monacoOptions.theme ?? (isDark.value ? typeof themes[0] === "string" ? themes[0] : themes[0].name : typeof themes[1] === "string" ? themes[1] : themes[1].name));
2223
+ const currentTheme = computed$1(() => monacoOptions.theme ?? (typeof themes[0] === "string" ? themes[0] : themes[0].name));
2289
2224
  let themeWatcher = null;
2290
2225
  const rafScheduler = createRafScheduler();
2291
2226
  async function setThemeInternal(theme, force = false) {
@@ -2324,6 +2259,12 @@ function useMonaco(monacoOptions = {}) {
2324
2259
  console.warn("onThemeChange callback threw an error:", err);
2325
2260
  }
2326
2261
  }
2262
+ async function ensureThemeRegistered(themeName) {
2263
+ const availableNames = themes.map((t) => typeof t === "string" ? t : t.name);
2264
+ const list = availableNames.includes(themeName) ? themes : themes.concat(themeName);
2265
+ const p = setThemeRegisterPromise(registerMonacoThemes(list, languages$1));
2266
+ if (p) await p;
2267
+ }
2327
2268
  function hasVerticalScrollbar() {
2328
2269
  if (!editorView) return false;
2329
2270
  if (_hasScrollBar) return true;
@@ -2364,19 +2305,17 @@ function useMonaco(monacoOptions = {}) {
2364
2305
  const ds = monacoOptions.onBeforeCreate(monaco_shim_exports);
2365
2306
  if (ds) disposals.push(...ds);
2366
2307
  }
2367
- await setThemeRegisterPromise(registerMonacoThemes(themes, languages$1));
2368
2308
  const initialThemeName = monacoOptions.theme ?? currentTheme.value;
2369
- lastAppliedTheme = initialThemeName;
2309
+ await ensureThemeRegistered(initialThemeName);
2370
2310
  editorMgr = new EditorManager(monacoOptions, maxHeightValue, maxHeightCSS, autoScrollOnUpdate, autoScrollInitial, autoScrollThresholdPx, autoScrollThresholdLines, monacoOptions.revealDebounceMs);
2371
2311
  editorView = await editorMgr.createEditor(container, code, language, initialThemeName);
2312
+ lastAppliedTheme = initialThemeName;
2313
+ if (pendingUpdate && editorMgr) {
2314
+ const { code: queuedCode, lang: queuedLang } = pendingUpdate;
2315
+ pendingUpdate = null;
2316
+ editorMgr.updateCode(queuedCode, queuedLang);
2317
+ }
2372
2318
  if (typeof monacoOptions.onThemeChange === "function") monacoOptions.onThemeChange(initialThemeName);
2373
- if (!monacoOptions.theme) themeWatcher = watch(() => isDark.value, () => {
2374
- const t = currentTheme.value;
2375
- if (t !== lastAppliedTheme) setThemeInternal(t);
2376
- }, {
2377
- flush: "post",
2378
- immediate: true
2379
- });
2380
2319
  if (editorView) lastKnownCode = editorView.getValue();
2381
2320
  return editorView;
2382
2321
  }
@@ -2398,8 +2337,8 @@ function useMonaco(monacoOptions = {}) {
2398
2337
  const ds = monacoOptions.onBeforeCreate(monaco_shim_exports);
2399
2338
  if (ds) disposals.push(...ds);
2400
2339
  }
2401
- await setThemeRegisterPromise(registerMonacoThemes(themes, languages$1));
2402
2340
  const initialThemeName = monacoOptions.theme ?? currentTheme.value;
2341
+ await ensureThemeRegistered(initialThemeName);
2403
2342
  try {
2404
2343
  monaco_shim_exports.editor.setTheme(initialThemeName);
2405
2344
  lastAppliedTheme = initialThemeName;
@@ -2407,13 +2346,6 @@ function useMonaco(monacoOptions = {}) {
2407
2346
  diffMgr = new DiffEditorManager(monacoOptions, maxHeightValue, maxHeightCSS, autoScrollOnUpdate, autoScrollInitial, autoScrollThresholdPx, autoScrollThresholdLines, diffAutoScroll, monacoOptions.revealDebounceMs);
2408
2347
  diffEditorView = await diffMgr.createDiffEditor(container, originalCode, modifiedCode, language, initialThemeName);
2409
2348
  if (typeof monacoOptions.onThemeChange === "function") monacoOptions.onThemeChange(initialThemeName);
2410
- if (!monacoOptions.theme) themeWatcher = watch(() => isDark.value, () => {
2411
- const t = currentTheme.value;
2412
- if (t !== lastAppliedTheme) setThemeInternal(t);
2413
- }, {
2414
- flush: "post",
2415
- immediate: true
2416
- });
2417
2349
  const models = diffMgr.getDiffModels();
2418
2350
  originalModel = models.original;
2419
2351
  modifiedModel = models.modified;
@@ -2745,4 +2677,4 @@ function useMonaco(monacoOptions = {}) {
2745
2677
  }
2746
2678
 
2747
2679
  //#endregion
2748
- export { RevealStrategy, clearHighlighterCache, defaultRevealDebounceMs, detectLanguage, getOrCreateHighlighter, isDark, preloadMonacoWorkers, registerMonacoThemes, useMonaco };
2680
+ export { RevealStrategy, clearHighlighterCache, defaultRevealDebounceMs, detectLanguage, getOrCreateHighlighter, preloadMonacoWorkers, registerMonacoThemes, useMonaco };
package/package.json CHANGED
@@ -1,8 +1,7 @@
1
1
  {
2
2
  "name": "stream-monaco",
3
3
  "type": "module",
4
- "version": "0.0.7",
5
- "packageManager": "pnpm@10.23.0",
4
+ "version": "0.0.9",
6
5
  "description": "A framework-agnostic library for integrating Monaco Editor with Shiki highlighting, optimized for streaming updates.",
7
6
  "author": "Simon He",
8
7
  "license": "MIT",
@@ -54,27 +53,13 @@
54
53
  "files": [
55
54
  "dist"
56
55
  ],
57
- "scripts": {
58
- "build": "tsdown",
59
- "dev": "npm run build -- --watch src",
60
- "format": "prettier --write --cache .",
61
- "lint": "eslint . --cache",
62
- "lint:fix": "pnpm run lint --fix",
63
- "prepublishOnly": "nr build",
64
- "release": "bumpp && npm publish",
65
- "start": "esno src/index.ts",
66
- "bench": "node scripts/stream-benchmark.mjs",
67
- "bench:playwright": "node scripts/playwright-bench.mjs",
68
- "test": "vitest",
69
- "typecheck": "tsc --noEmit"
70
- },
71
56
  "peerDependencies": {
72
57
  "monaco-editor": "^0.52.2"
73
58
  },
74
59
  "dependencies": {
75
- "@shikijs/monaco": "^3.15.0",
60
+ "@shikijs/monaco": "^3.19.0",
76
61
  "alien-signals": "^2.0.8",
77
- "shiki": "^3.15.0"
62
+ "shiki": "^3.19.0"
78
63
  },
79
64
  "devDependencies": {
80
65
  "@antfu/eslint-config": "^5.4.1",
@@ -96,5 +81,18 @@
96
81
  "prettier --write --cache --ignore-unknown"
97
82
  ],
98
83
  "*.{vue,js,ts,jsx,tsx,md,json}": "eslint --fix"
84
+ },
85
+ "scripts": {
86
+ "build": "tsdown",
87
+ "dev": "npm run build -- --watch src",
88
+ "format": "prettier --write --cache .",
89
+ "lint": "eslint . --cache",
90
+ "lint:fix": "pnpm run lint --fix",
91
+ "release": "bumpp && npm publish",
92
+ "start": "esno src/index.ts",
93
+ "bench": "node scripts/stream-benchmark.mjs",
94
+ "bench:playwright": "node scripts/playwright-bench.mjs",
95
+ "test": "vitest",
96
+ "typecheck": "tsc --noEmit"
99
97
  }
100
- }
98
+ }