diff --git a/README.md b/README.md
index 09a18df..f8d0a1f 100644
--- a/README.md
+++ b/README.md
@@ -12,10 +12,10 @@ This package is a maintained fork of [`suren-atoyan/monaco-react`](https://githu
## Installation
```bash
-yarn add @willbooster/monaco-react monaco-editor
+yarn add @willbooster/monaco-react
```
-`react`, `react-dom`, and `monaco-editor` are peer dependencies. This package supports React 19.x, Node.js 24 or newer, and is tested with Next.js 16.
+`react` and `react-dom` are peer dependencies. This package supports React 19.x, Node.js 24 or newer, and is tested with Next.js 16.
## Usage
@@ -34,13 +34,14 @@ export default function Page() {
## API
```tsx
-import Editor, { DiffEditor, loader, useMonaco } from '@willbooster/monaco-react';
+import Editor, { DiffEditor, loader, shikiToMonaco, useMonaco } from '@willbooster/monaco-react';
```
- `Editor`: Monaco standalone code editor component.
- `DiffEditor`: Monaco standalone diff editor component.
- `useMonaco`: React hook returning the initialized Monaco instance.
- `loader`: the `@willbooster/monaco-loader` instance used by the components.
+- `shikiToMonaco`: Adapter for registering a Shiki highlighter with Monaco.
### Editor
@@ -65,6 +66,18 @@ import Editor, { DiffEditor, loader, useMonaco } from '@willbooster/monaco-react
```
+### Shiki Integration
+
+```tsx
+import Editor, { shikiToMonaco } from '@willbooster/monaco-react';
+
+ {
+ shikiToMonaco(highlighter, monaco);
+ }}
+/>;
+```
+
### Loader Configuration
By default Monaco is loaded from the CDN configured by `@willbooster/monaco-loader`. You can provide your own Monaco instance or loader paths before rendering an editor.
diff --git a/dist/index.cjs b/dist/index.cjs
new file mode 100644
index 0000000..5f28b62
--- /dev/null
+++ b/dist/index.cjs
@@ -0,0 +1,628 @@
+'use client';
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+ for (var name in all)
+ __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+ if (from && typeof from === "object" || typeof from === "function") {
+ for (let key of __getOwnPropNames(from))
+ if (!__hasOwnProp.call(to, key) && key !== except)
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+ }
+ return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+ // If the importer is in node compatibility mode or this is not an ESM
+ // file that has been converted to a CommonJS file using a Babel-
+ // compatible transform (i.e. "__esModule" has not been set), then set
+ // "default" to the CommonJS "module.exports" for node compatibility.
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+ mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+ DiffEditor: () => DiffEditor_default2,
+ Editor: () => Editor_default2,
+ default: () => index_default,
+ loader: () => import_monaco_loader4.default,
+ shikiToMonaco: () => import_monaco.shikiToMonaco,
+ useMonaco: () => useMonaco_default
+});
+module.exports = __toCommonJS(index_exports);
+var import_monaco_loader4 = __toESM(require("@willbooster/monaco-loader"), 1);
+var import_monaco = require("@shikijs/monaco");
+
+// src/DiffEditor/index.ts
+var import_react5 = require("react");
+
+// src/DiffEditor/DiffEditor.tsx
+var import_react4 = require("react");
+var import_monaco_loader = __toESM(require("@willbooster/monaco-loader"), 1);
+
+// src/MonacoContainer/index.ts
+var import_react = require("react");
+
+// src/MonacoContainer/styles.ts
+var styles = {
+ wrapper: {
+ display: "flex",
+ position: "relative",
+ textAlign: "initial"
+ },
+ fullWidth: {
+ width: "100%"
+ },
+ hide: {
+ display: "none"
+ }
+};
+var styles_default = styles;
+
+// src/Loading/styles.ts
+var styles2 = {
+ container: {
+ display: "flex",
+ height: "100%",
+ width: "100%",
+ justifyContent: "center",
+ alignItems: "center"
+ }
+};
+var styles_default2 = styles2;
+
+// src/Loading/Loading.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function Loading({ children }) {
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: styles_default2.container, children });
+}
+var Loading_default = Loading;
+
+// src/Loading/index.ts
+var Loading_default2 = Loading_default;
+
+// src/MonacoContainer/MonacoContainer.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function MonacoContainer({
+ width,
+ height,
+ isEditorReady,
+ loading,
+ _ref,
+ className,
+ wrapperProps
+}) {
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { style: { ...styles_default.wrapper, width, height }, ...wrapperProps, children: [
+ !isEditorReady && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Loading_default2, { children: loading }),
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { ref: _ref, style: { ...styles_default.fullWidth, ...!isEditorReady && styles_default.hide }, className })
+ ] });
+}
+var MonacoContainer_default = MonacoContainer;
+
+// src/MonacoContainer/index.ts
+var MonacoContainer_default2 = (0, import_react.memo)(MonacoContainer_default);
+
+// src/hooks/useMount/index.ts
+var import_react2 = require("react");
+function useMount(effect) {
+ (0, import_react2.useEffect)(effect, []);
+}
+var useMount_default = useMount;
+
+// src/hooks/useUpdate/index.ts
+var import_react3 = require("react");
+function useUpdate(effect, deps, applyChanges = true) {
+ const isInitialMount = (0, import_react3.useRef)(true);
+ (0, import_react3.useEffect)(
+ isInitialMount.current || !applyChanges ? () => {
+ isInitialMount.current = false;
+ } : effect,
+ deps
+ );
+}
+var useUpdate_default = useUpdate;
+
+// src/utils/index.ts
+function noop() {
+}
+function getOrCreateModel(monaco, value, language, path) {
+ return getModel(monaco, path) ?? createModel(monaco, value, language, path);
+}
+function getModel(monaco, path) {
+ return monaco.editor.getModel(createModelUri(monaco, path));
+}
+function createModel(monaco, value, language, path) {
+ return monaco.editor.createModel(value, language, path ? createModelUri(monaco, path) : void 0);
+}
+function createModelUri(monaco, path) {
+ return monaco.Uri.parse(path);
+}
+
+// src/DiffEditor/DiffEditor.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function DiffEditor({
+ original,
+ modified,
+ language,
+ originalLanguage,
+ modifiedLanguage,
+ originalModelPath,
+ modifiedModelPath,
+ keepCurrentOriginalModel = false,
+ keepCurrentModifiedModel = false,
+ theme = "light",
+ loading = "Loading...",
+ options = {},
+ height = "100%",
+ width = "100%",
+ className,
+ wrapperProps = {},
+ beforeMount = noop,
+ onMount = noop
+}) {
+ const [isEditorReady, setIsEditorReady] = (0, import_react4.useState)(false);
+ const [isMonacoMounting, setIsMonacoMounting] = (0, import_react4.useState)(true);
+ const editorRef = (0, import_react4.useRef)(null);
+ const monacoRef = (0, import_react4.useRef)(null);
+ const containerRef = (0, import_react4.useRef)(null);
+ const onMountRef = (0, import_react4.useRef)(onMount);
+ const beforeMountRef = (0, import_react4.useRef)(beforeMount);
+ const preventCreation = (0, import_react4.useRef)(false);
+ useMount_default(() => {
+ const cancelable = import_monaco_loader.default.init();
+ cancelable.then((monaco) => (monacoRef.current = monaco) && setIsMonacoMounting(false)).catch((error) => error?.type !== "cancelation" && console.error("Monaco initialization: error:", error));
+ return () => editorRef.current ? disposeEditor() : cancelable.cancel();
+ });
+ useUpdate_default(
+ () => {
+ if (editorRef.current && monacoRef.current) {
+ const originalEditor = editorRef.current.getOriginalEditor();
+ const model = getOrCreateModel(
+ monacoRef.current,
+ original || "",
+ originalLanguage || language || "text",
+ originalModelPath || ""
+ );
+ if (model !== originalEditor.getModel()) {
+ originalEditor.setModel(model);
+ }
+ }
+ },
+ [originalModelPath],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ if (editorRef.current && monacoRef.current) {
+ const modifiedEditor = editorRef.current.getModifiedEditor();
+ const model = getOrCreateModel(
+ monacoRef.current,
+ modified || "",
+ modifiedLanguage || language || "text",
+ modifiedModelPath || ""
+ );
+ if (model !== modifiedEditor.getModel()) {
+ modifiedEditor.setModel(model);
+ }
+ }
+ },
+ [modifiedModelPath],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ const modifiedEditor = editorRef.current.getModifiedEditor();
+ if (modifiedEditor.getOption(monacoRef.current.editor.EditorOption.readOnly)) {
+ modifiedEditor.setValue(modified || "");
+ } else {
+ if (modified !== modifiedEditor.getValue()) {
+ modifiedEditor.executeEdits("", [
+ {
+ range: modifiedEditor.getModel().getFullModelRange(),
+ text: modified || "",
+ forceMoveMarkers: true
+ }
+ ]);
+ modifiedEditor.pushUndoStop();
+ }
+ }
+ },
+ [modified],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ editorRef.current?.getModel()?.original.setValue(original || "");
+ },
+ [original],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ const { original: original2, modified: modified2 } = editorRef.current.getModel();
+ monacoRef.current.editor.setModelLanguage(original2, originalLanguage || language || "text");
+ monacoRef.current.editor.setModelLanguage(modified2, modifiedLanguage || language || "text");
+ },
+ [language, originalLanguage, modifiedLanguage],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ monacoRef.current?.editor.setTheme(theme);
+ },
+ [theme],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ editorRef.current?.updateOptions(options);
+ },
+ [options],
+ isEditorReady
+ );
+ const setModels = (0, import_react4.useCallback)(() => {
+ if (!monacoRef.current) return;
+ beforeMountRef.current(monacoRef.current);
+ const originalModel = getOrCreateModel(
+ monacoRef.current,
+ original || "",
+ originalLanguage || language || "text",
+ originalModelPath || ""
+ );
+ const modifiedModel = getOrCreateModel(
+ monacoRef.current,
+ modified || "",
+ modifiedLanguage || language || "text",
+ modifiedModelPath || ""
+ );
+ editorRef.current?.setModel({
+ original: originalModel,
+ modified: modifiedModel
+ });
+ }, [language, modified, modifiedLanguage, original, originalLanguage, originalModelPath, modifiedModelPath]);
+ const createEditor = (0, import_react4.useCallback)(() => {
+ if (!preventCreation.current && containerRef.current) {
+ editorRef.current = monacoRef.current.editor.createDiffEditor(containerRef.current, {
+ automaticLayout: true,
+ ...options
+ });
+ setModels();
+ monacoRef.current?.editor.setTheme(theme);
+ setIsEditorReady(true);
+ preventCreation.current = true;
+ }
+ }, [options, theme, setModels]);
+ (0, import_react4.useEffect)(() => {
+ if (isEditorReady) {
+ onMountRef.current(editorRef.current, monacoRef.current);
+ }
+ }, [isEditorReady]);
+ (0, import_react4.useEffect)(() => {
+ if (!isMonacoMounting && !isEditorReady) {
+ createEditor();
+ }
+ }, [isMonacoMounting, isEditorReady, createEditor]);
+ function disposeEditor() {
+ const editor = editorRef.current;
+ const models = editor?.getModel();
+ editor?.setModel(null);
+ editor?.dispose();
+ if (!keepCurrentOriginalModel && !models?.original.isDisposed()) {
+ models?.original?.dispose();
+ }
+ if (!keepCurrentModifiedModel && !models?.modified.isDisposed()) {
+ models?.modified?.dispose();
+ }
+ editorRef.current = null;
+ preventCreation.current = false;
+ setIsEditorReady(false);
+ }
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+ MonacoContainer_default2,
+ {
+ width,
+ height,
+ isEditorReady,
+ loading,
+ _ref: containerRef,
+ className,
+ wrapperProps
+ }
+ );
+}
+var DiffEditor_default = DiffEditor;
+
+// src/DiffEditor/index.ts
+var DiffEditor_default2 = (0, import_react5.memo)(DiffEditor_default);
+
+// src/hooks/useMonaco/index.ts
+var import_react6 = require("react");
+var import_monaco_loader2 = __toESM(require("@willbooster/monaco-loader"), 1);
+function useMonaco() {
+ const [monaco, setMonaco] = (0, import_react6.useState)(import_monaco_loader2.default.__getMonacoInstance());
+ useMount_default(() => {
+ let cancelable;
+ if (!monaco) {
+ cancelable = import_monaco_loader2.default.init();
+ void cancelable.then((monaco2) => {
+ setMonaco(monaco2);
+ return;
+ }).catch((error) => {
+ if (error?.type !== "cancelation") {
+ console.error("Monaco initialization: error:", error);
+ }
+ });
+ }
+ return () => cancelable?.cancel();
+ });
+ return monaco;
+}
+var useMonaco_default = useMonaco;
+
+// src/Editor/index.ts
+var import_react9 = require("react");
+
+// src/Editor/Editor.tsx
+var import_react8 = require("react");
+var import_monaco_loader3 = __toESM(require("@willbooster/monaco-loader"), 1);
+
+// src/hooks/usePrevious/index.ts
+var import_react7 = require("react");
+function usePrevious(value) {
+ const ref = (0, import_react7.useRef)(void 0);
+ (0, import_react7.useEffect)(() => {
+ ref.current = value;
+ }, [value]);
+ return ref.current;
+}
+var usePrevious_default = usePrevious;
+
+// src/Editor/Editor.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var viewStates = /* @__PURE__ */ new Map();
+function Editor({
+ defaultValue,
+ defaultLanguage,
+ defaultPath,
+ value,
+ language,
+ path,
+ /* === */
+ theme = "light",
+ line,
+ loading = "Loading...",
+ options = {},
+ overrideServices = {},
+ saveViewState = true,
+ keepCurrentModel = false,
+ /* === */
+ width = "100%",
+ height = "100%",
+ className,
+ wrapperProps = {},
+ /* === */
+ beforeMount = noop,
+ onMount = noop,
+ onChange,
+ onValidate = noop
+}) {
+ const [isEditorReady, setIsEditorReady] = (0, import_react8.useState)(false);
+ const [isMonacoMounting, setIsMonacoMounting] = (0, import_react8.useState)(true);
+ const monacoRef = (0, import_react8.useRef)(null);
+ const editorRef = (0, import_react8.useRef)(null);
+ const containerRef = (0, import_react8.useRef)(null);
+ const onMountRef = (0, import_react8.useRef)(onMount);
+ const beforeMountRef = (0, import_react8.useRef)(beforeMount);
+ const subscriptionRef = (0, import_react8.useRef)(void 0);
+ const valueRef = (0, import_react8.useRef)(value);
+ const previousPath = usePrevious_default(path);
+ const preventCreation = (0, import_react8.useRef)(false);
+ const preventTriggerChangeEvent = (0, import_react8.useRef)(false);
+ useMount_default(() => {
+ const cancelable = import_monaco_loader3.default.init();
+ cancelable.then((monaco) => (monacoRef.current = monaco) && setIsMonacoMounting(false)).catch((error) => error?.type !== "cancelation" && console.error("Monaco initialization: error:", error));
+ return () => editorRef.current ? disposeEditor() : cancelable.cancel();
+ });
+ useUpdate_default(
+ () => {
+ const model = getOrCreateModel(
+ monacoRef.current,
+ defaultValue || value || "",
+ defaultLanguage || language || "",
+ path || defaultPath || ""
+ );
+ if (model !== editorRef.current?.getModel()) {
+ if (saveViewState) viewStates.set(previousPath, editorRef.current?.saveViewState());
+ editorRef.current?.setModel(model);
+ if (saveViewState) editorRef.current?.restoreViewState(viewStates.get(path));
+ }
+ },
+ [path],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ editorRef.current?.updateOptions(options);
+ },
+ [options],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ if (!editorRef.current || value === void 0) return;
+ if (editorRef.current.getOption(monacoRef.current.editor.EditorOption.readOnly)) {
+ editorRef.current.setValue(value);
+ } else if (value !== editorRef.current.getValue()) {
+ preventTriggerChangeEvent.current = true;
+ editorRef.current.executeEdits("", [
+ {
+ range: editorRef.current.getModel().getFullModelRange(),
+ text: value,
+ forceMoveMarkers: true
+ }
+ ]);
+ editorRef.current.pushUndoStop();
+ preventTriggerChangeEvent.current = false;
+ }
+ },
+ [value],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ const model = editorRef.current?.getModel();
+ if (isEditorReady && model && language) {
+ monacoRef.current?.editor.setModelLanguage(model, language);
+ }
+ },
+ [language, isEditorReady],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ if (line !== void 0) {
+ editorRef.current?.revealLine(line);
+ }
+ },
+ [line],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ monacoRef.current?.editor.setTheme(theme);
+ },
+ [theme],
+ isEditorReady
+ );
+ const createEditor = (0, import_react8.useCallback)(() => {
+ if (!containerRef.current || !monacoRef.current) return;
+ if (!preventCreation.current) {
+ beforeMountRef.current(monacoRef.current);
+ const autoCreatedModelPath = path || defaultPath;
+ const defaultModel = getOrCreateModel(
+ monacoRef.current,
+ value || defaultValue || "",
+ defaultLanguage || language || "",
+ autoCreatedModelPath || ""
+ );
+ const editor = monacoRef.current.editor.create(
+ containerRef.current,
+ {
+ model: defaultModel,
+ automaticLayout: true,
+ ...options
+ },
+ overrideServices
+ );
+ editorRef.current = editor;
+ saveViewState && editor.restoreViewState(viewStates.get(autoCreatedModelPath));
+ monacoRef.current.editor.setTheme(theme);
+ if (line !== void 0) {
+ editor.revealLine(line);
+ }
+ setIsEditorReady(true);
+ preventCreation.current = true;
+ }
+ }, [
+ defaultValue,
+ defaultLanguage,
+ defaultPath,
+ value,
+ language,
+ path,
+ options,
+ overrideServices,
+ saveViewState,
+ theme,
+ line
+ ]);
+ (0, import_react8.useEffect)(() => {
+ if (isEditorReady) {
+ onMountRef.current(editorRef.current, monacoRef.current);
+ }
+ }, [isEditorReady]);
+ (0, import_react8.useEffect)(() => {
+ !isMonacoMounting && !isEditorReady && createEditor();
+ }, [isMonacoMounting, isEditorReady, createEditor]);
+ valueRef.current = value;
+ (0, import_react8.useEffect)(() => {
+ if (isEditorReady && onChange) {
+ subscriptionRef.current?.dispose();
+ subscriptionRef.current = editorRef.current?.onDidChangeModelContent((event) => {
+ if (!preventTriggerChangeEvent.current) {
+ onChange(editorRef.current.getValue(), event);
+ }
+ });
+ }
+ }, [isEditorReady, onChange]);
+ (0, import_react8.useEffect)(() => {
+ if (isEditorReady) {
+ const changeMarkersListener = monacoRef.current.editor.onDidChangeMarkers((uris) => {
+ const editorUri = editorRef.current.getModel()?.uri;
+ if (editorUri) {
+ const currentEditorHasMarkerChanges = uris.find((uri) => uri.path === editorUri.path);
+ if (currentEditorHasMarkerChanges) {
+ const markers = monacoRef.current.editor.getModelMarkers({
+ resource: editorUri
+ });
+ onValidate?.(markers);
+ }
+ }
+ });
+ return () => {
+ changeMarkersListener?.dispose();
+ };
+ }
+ return () => {
+ };
+ }, [isEditorReady, onValidate]);
+ function disposeEditor() {
+ subscriptionRef.current?.dispose();
+ if (keepCurrentModel) {
+ saveViewState && viewStates.set(path, editorRef.current.saveViewState());
+ } else {
+ editorRef.current.getModel()?.dispose();
+ }
+ editorRef.current.dispose();
+ editorRef.current = null;
+ preventCreation.current = false;
+ setIsEditorReady(false);
+ }
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+ MonacoContainer_default2,
+ {
+ width,
+ height,
+ isEditorReady,
+ loading,
+ _ref: containerRef,
+ className,
+ wrapperProps
+ }
+ );
+}
+var Editor_default = Editor;
+
+// src/Editor/index.ts
+var Editor_default2 = (0, import_react9.memo)(Editor_default);
+
+// src/index.ts
+var index_default = Editor_default2;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+ DiffEditor,
+ Editor,
+ loader,
+ shikiToMonaco,
+ useMonaco
+});
+//# sourceMappingURL=index.cjs.map
\ No newline at end of file
diff --git a/dist/index.cjs.map b/dist/index.cjs.map
new file mode 100644
index 0000000..beecb30
--- /dev/null
+++ b/dist/index.cjs.map
@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/DiffEditor/index.ts","../src/DiffEditor/DiffEditor.tsx","../src/MonacoContainer/index.ts","../src/MonacoContainer/styles.ts","../src/Loading/styles.ts","../src/Loading/Loading.tsx","../src/Loading/index.ts","../src/MonacoContainer/MonacoContainer.tsx","../src/hooks/useMount/index.ts","../src/hooks/useUpdate/index.ts","../src/utils/index.ts","../src/hooks/useMonaco/index.ts","../src/Editor/index.ts","../src/Editor/Editor.tsx","../src/hooks/usePrevious/index.ts"],"sourcesContent":["import loader from '@willbooster/monaco-loader';\nexport { loader };\nexport { shikiToMonaco } from '@shikijs/monaco';\n\nimport DiffEditor from './DiffEditor';\nexport * from './DiffEditor/types';\nexport { DiffEditor };\n\nimport useMonaco from './hooks/useMonaco';\nexport { useMonaco };\n\nimport Editor from './Editor';\nexport * from './Editor/types';\nexport { Editor };\nexport default Editor;\n\n// Monaco\nimport type * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js';\nexport type Monaco = typeof monaco;\n\n// Default themes\nexport type Theme = 'vs-dark' | 'light';\n","import { memo } from 'react';\n\nimport DiffEditor from './DiffEditor';\n\nexport * from './types';\n\nexport default memo(DiffEditor);\n","'use client';\n\nimport { useState, useRef, useCallback, useEffect } from 'react';\nimport type { ReactElement } from 'react';\nimport loader from '@willbooster/monaco-loader';\n\nimport MonacoContainer from '../MonacoContainer';\nimport useMount from '../hooks/useMount';\nimport useUpdate from '../hooks/useUpdate';\nimport { noop, getOrCreateModel } from '../utils';\nimport type { DiffEditorProps, MonacoDiffEditor } from './types';\nimport type { Monaco } from '..';\n\nfunction DiffEditor({\n original,\n modified,\n language,\n originalLanguage,\n modifiedLanguage,\n originalModelPath,\n modifiedModelPath,\n keepCurrentOriginalModel = false,\n keepCurrentModifiedModel = false,\n theme = 'light',\n loading = 'Loading...',\n options = {},\n height = '100%',\n width = '100%',\n className,\n wrapperProps = {},\n beforeMount = noop,\n onMount = noop,\n}: DiffEditorProps): ReactElement {\n const [isEditorReady, setIsEditorReady] = useState(false);\n const [isMonacoMounting, setIsMonacoMounting] = useState(true);\n const editorRef = useRef(null);\n const monacoRef = useRef(null);\n const containerRef = useRef(null);\n const onMountRef = useRef(onMount);\n const beforeMountRef = useRef(beforeMount);\n const preventCreation = useRef(false);\n\n useMount(() => {\n const cancelable = loader.init();\n\n cancelable\n .then((monaco) => (monacoRef.current = monaco as Monaco) && setIsMonacoMounting(false))\n .catch((error) => error?.type !== 'cancelation' && console.error('Monaco initialization: error:', error));\n\n return () => (editorRef.current ? disposeEditor() : cancelable.cancel());\n });\n\n useUpdate(\n () => {\n if (editorRef.current && monacoRef.current) {\n const originalEditor = editorRef.current.getOriginalEditor();\n const model = getOrCreateModel(\n monacoRef.current,\n original || '',\n originalLanguage || language || 'text',\n originalModelPath || ''\n );\n\n if (model !== originalEditor.getModel()) {\n originalEditor.setModel(model);\n }\n }\n },\n [originalModelPath],\n isEditorReady\n );\n\n useUpdate(\n () => {\n if (editorRef.current && monacoRef.current) {\n const modifiedEditor = editorRef.current.getModifiedEditor();\n const model = getOrCreateModel(\n monacoRef.current,\n modified || '',\n modifiedLanguage || language || 'text',\n modifiedModelPath || ''\n );\n\n if (model !== modifiedEditor.getModel()) {\n modifiedEditor.setModel(model);\n }\n }\n },\n [modifiedModelPath],\n isEditorReady\n );\n\n useUpdate(\n () => {\n const modifiedEditor = editorRef.current!.getModifiedEditor();\n if (modifiedEditor.getOption(monacoRef.current!.editor.EditorOption.readOnly)) {\n modifiedEditor.setValue(modified || '');\n } else {\n if (modified !== modifiedEditor.getValue()) {\n modifiedEditor.executeEdits('', [\n {\n range: modifiedEditor.getModel()!.getFullModelRange(),\n text: modified || '',\n forceMoveMarkers: true,\n },\n ]);\n\n modifiedEditor.pushUndoStop();\n }\n }\n },\n [modified],\n isEditorReady\n );\n\n useUpdate(\n () => {\n editorRef.current?.getModel()?.original.setValue(original || '');\n },\n [original],\n isEditorReady\n );\n\n useUpdate(\n () => {\n const { original, modified } = editorRef.current!.getModel()!;\n\n monacoRef.current!.editor.setModelLanguage(original, originalLanguage || language || 'text');\n monacoRef.current!.editor.setModelLanguage(modified, modifiedLanguage || language || 'text');\n },\n [language, originalLanguage, modifiedLanguage],\n isEditorReady\n );\n\n useUpdate(\n () => {\n monacoRef.current?.editor.setTheme(theme);\n },\n [theme],\n isEditorReady\n );\n\n useUpdate(\n () => {\n editorRef.current?.updateOptions(options);\n },\n [options],\n isEditorReady\n );\n\n const setModels = useCallback(() => {\n if (!monacoRef.current) return;\n beforeMountRef.current(monacoRef.current);\n const originalModel = getOrCreateModel(\n monacoRef.current,\n original || '',\n originalLanguage || language || 'text',\n originalModelPath || ''\n );\n\n const modifiedModel = getOrCreateModel(\n monacoRef.current,\n modified || '',\n modifiedLanguage || language || 'text',\n modifiedModelPath || ''\n );\n\n editorRef.current?.setModel({\n original: originalModel,\n modified: modifiedModel,\n });\n }, [language, modified, modifiedLanguage, original, originalLanguage, originalModelPath, modifiedModelPath]);\n\n const createEditor = useCallback(() => {\n if (!preventCreation.current && containerRef.current) {\n editorRef.current = monacoRef.current!.editor.createDiffEditor(containerRef.current, {\n automaticLayout: true,\n ...options,\n });\n\n setModels();\n\n monacoRef.current?.editor.setTheme(theme);\n\n setIsEditorReady(true);\n preventCreation.current = true;\n }\n }, [options, theme, setModels]);\n\n useEffect(() => {\n if (isEditorReady) {\n onMountRef.current(editorRef.current!, monacoRef.current!);\n }\n }, [isEditorReady]);\n\n useEffect(() => {\n if (!isMonacoMounting && !isEditorReady) {\n createEditor();\n }\n }, [isMonacoMounting, isEditorReady, createEditor]);\n\n function disposeEditor(): void {\n const editor = editorRef.current;\n const models = editor?.getModel();\n\n // oxlint-disable-next-line unicorn/no-null -- Monaco detaches diff models with null.\n editor?.setModel(null);\n editor?.dispose();\n\n if (!keepCurrentOriginalModel && !models?.original.isDisposed()) {\n models?.original?.dispose();\n }\n\n if (!keepCurrentModifiedModel && !models?.modified.isDisposed()) {\n models?.modified?.dispose();\n }\n\n // oxlint-disable-next-line unicorn/no-null -- React refs use null after unmount.\n editorRef.current = null;\n preventCreation.current = false;\n setIsEditorReady(false);\n }\n\n return (\n \n );\n}\n\nexport default DiffEditor;\n","import { memo } from 'react';\n\nimport MonacoContainer from './MonacoContainer';\n\nexport default memo(MonacoContainer);\n","import type { CSSProperties } from 'react';\n\nconst styles: Record = {\n wrapper: {\n display: 'flex',\n position: 'relative',\n textAlign: 'initial',\n },\n fullWidth: {\n width: '100%',\n },\n hide: {\n display: 'none',\n },\n};\n\nexport default styles;\n","import type { CSSProperties } from 'react';\n\nconst styles: Record = {\n container: {\n display: 'flex',\n height: '100%',\n width: '100%',\n justifyContent: 'center',\n alignItems: 'center',\n },\n};\n\nexport default styles;\n","import type { PropsWithChildren, ReactElement } from 'react';\n\nimport styles from './styles';\n\nfunction Loading({ children }: PropsWithChildren): ReactElement {\n return {children}
;\n}\n\nexport default Loading;\n","import Loading from './Loading';\n\nexport default Loading;\n","import type { ReactElement } from 'react';\n\nimport styles from './styles';\nimport Loading from '../Loading';\nimport type { ContainerProps } from './types';\n\n// ** forwardref render functions do not support proptypes or defaultprops **\n// one of the reasons why we use a separate prop for passing ref instead of using forwardref\n\nfunction MonacoContainer({\n width,\n height,\n isEditorReady,\n loading,\n _ref,\n className,\n wrapperProps,\n}: ContainerProps): ReactElement {\n return (\n \n {!isEditorReady && {loading}}\n \n \n );\n}\n\nexport default MonacoContainer;\n","import { useEffect } from 'react';\nimport type { EffectCallback } from 'react';\n\nfunction useMount(effect: EffectCallback): void {\n useEffect(effect, []);\n}\n\nexport default useMount;\n","import { useEffect, useRef } from 'react';\nimport type { DependencyList, EffectCallback } from 'react';\n\nfunction useUpdate(effect: EffectCallback, deps: DependencyList, applyChanges = true): void {\n const isInitialMount = useRef(true);\n\n useEffect(\n isInitialMount.current || !applyChanges\n ? () => {\n isInitialMount.current = false;\n }\n : effect,\n deps\n );\n}\n\nexport default useUpdate;\n","import type { Monaco } from '..';\nimport type { Uri, editor } from 'monaco-editor/esm/vs/editor/editor.api.js';\n\n/**\n * noop is a helper function that does nothing\n * @returns undefined\n */\nfunction noop(): void {\n /** no-op */\n}\n\n/**\n * getOrCreateModel is a helper function that will return a model if it exists\n * or create a new model if it does not exist.\n * This is useful for when you want to create a model for a file that may or may not exist yet.\n * @param monaco The monaco instance\n * @param value The value of the model\n * @param language The language of the model\n * @param path The path of the model\n * @returns The model that was found or created\n */\nfunction getOrCreateModel(monaco: Monaco, value: string, language: string, path: string): editor.ITextModel {\n return getModel(monaco, path) ?? createModel(monaco, value, language, path);\n}\n\n/**\n * getModel is a helper function that will return a model if it exists\n * or return undefined if it does not exist.\n * @param monaco The monaco instance\n * @param path The path of the model\n * @returns The model that was found or undefined\n */\nfunction getModel(monaco: Monaco, path: string): editor.ITextModel | null {\n return monaco.editor.getModel(createModelUri(monaco, path));\n}\n\n/**\n * createModel is a helper function that will create a new model\n * @param monaco The monaco instance\n * @param value The value of the model\n * @param language The language of the model\n * @param path The path of the model\n * @returns The model that was created\n */\nfunction createModel(monaco: Monaco, value: string, language?: string, path?: string): editor.ITextModel {\n return monaco.editor.createModel(value, language, path ? createModelUri(monaco, path) : undefined);\n}\n\n/**\n * createModelUri is a helper function that will create a new model uri\n * @param monaco The monaco instance\n * @param path The path of the model\n * @returns The model uri that was created\n */\nfunction createModelUri(monaco: Monaco, path: string): Uri {\n return monaco.Uri.parse(path);\n}\n\nexport { noop, getOrCreateModel };\n","import { useState } from 'react';\nimport loader from '@willbooster/monaco-loader';\n\nimport useMount from '../useMount';\nimport type { Monaco } from '../..';\n\nfunction useMonaco(): Monaco | undefined {\n const [monaco, setMonaco] = useState(loader.__getMonacoInstance() as Monaco | undefined);\n\n useMount(() => {\n let cancelable: ReturnType;\n\n if (!monaco) {\n cancelable = loader.init();\n\n void cancelable\n .then((monaco) => {\n setMonaco(monaco as Monaco);\n return;\n })\n .catch((error: unknown) => {\n if ((error as { type?: unknown })?.type !== 'cancelation') {\n console.error('Monaco initialization: error:', error);\n }\n });\n }\n\n return () => cancelable?.cancel();\n });\n\n return monaco;\n}\n\nexport default useMonaco;\n","import { memo } from 'react';\n\nimport Editor from './Editor';\n\nexport * from './types';\n\nexport default memo(Editor);\n","'use client';\n\nimport { useState, useEffect, useRef, useCallback } from 'react';\nimport type { ReactElement } from 'react';\nimport loader from '@willbooster/monaco-loader';\nimport useMount from '../hooks/useMount';\nimport useUpdate from '../hooks/useUpdate';\nimport usePrevious from '../hooks/usePrevious';\nimport type { IDisposable, Uri, editor } from 'monaco-editor/esm/vs/editor/editor.api.js';\nimport { noop, getOrCreateModel } from '../utils';\nimport type { EditorProps } from './types';\nimport type { Monaco } from '..';\nimport MonacoContainer from '../MonacoContainer';\n\nconst viewStates = new Map();\n\nfunction Editor({\n defaultValue,\n defaultLanguage,\n defaultPath,\n value,\n language,\n path,\n /* === */\n theme = 'light',\n line,\n loading = 'Loading...',\n options = {},\n overrideServices = {},\n saveViewState = true,\n keepCurrentModel = false,\n /* === */\n width = '100%',\n height = '100%',\n className,\n wrapperProps = {},\n /* === */\n beforeMount = noop,\n onMount = noop,\n onChange,\n onValidate = noop,\n}: EditorProps): ReactElement {\n const [isEditorReady, setIsEditorReady] = useState(false);\n const [isMonacoMounting, setIsMonacoMounting] = useState(true);\n const monacoRef = useRef(null);\n const editorRef = useRef(null);\n const containerRef = useRef(null);\n const onMountRef = useRef(onMount);\n const beforeMountRef = useRef(beforeMount);\n const subscriptionRef = useRef(undefined);\n const valueRef = useRef(value);\n const previousPath = usePrevious(path);\n const preventCreation = useRef(false);\n const preventTriggerChangeEvent = useRef(false);\n\n useMount(() => {\n const cancelable = loader.init();\n\n cancelable\n .then((monaco) => (monacoRef.current = monaco as Monaco) && setIsMonacoMounting(false))\n .catch((error) => error?.type !== 'cancelation' && console.error('Monaco initialization: error:', error));\n\n return () => (editorRef.current ? disposeEditor() : cancelable.cancel());\n });\n\n useUpdate(\n () => {\n const model = getOrCreateModel(\n monacoRef.current!,\n defaultValue || value || '',\n defaultLanguage || language || '',\n path || defaultPath || ''\n );\n\n if (model !== editorRef.current?.getModel()) {\n if (saveViewState) viewStates.set(previousPath, editorRef.current?.saveViewState());\n editorRef.current?.setModel(model);\n if (saveViewState) editorRef.current?.restoreViewState(viewStates.get(path));\n }\n },\n [path],\n isEditorReady\n );\n\n useUpdate(\n () => {\n editorRef.current?.updateOptions(options);\n },\n [options],\n isEditorReady\n );\n\n useUpdate(\n () => {\n if (!editorRef.current || value === undefined) return;\n if (editorRef.current.getOption(monacoRef.current!.editor.EditorOption.readOnly)) {\n editorRef.current.setValue(value);\n } else if (value !== editorRef.current.getValue()) {\n preventTriggerChangeEvent.current = true;\n editorRef.current.executeEdits('', [\n {\n range: editorRef.current.getModel()!.getFullModelRange(),\n text: value,\n forceMoveMarkers: true,\n },\n ]);\n\n editorRef.current.pushUndoStop();\n preventTriggerChangeEvent.current = false;\n }\n },\n [value],\n isEditorReady\n );\n\n useUpdate(\n () => {\n const model = editorRef.current?.getModel();\n if (isEditorReady && model && language) {\n monacoRef.current?.editor.setModelLanguage(model, language);\n }\n },\n [language, isEditorReady],\n isEditorReady\n );\n\n useUpdate(\n () => {\n // reason for undefined check: https://github.com/suren-atoyan/monaco-react/pull/188\n if (line !== undefined) {\n editorRef.current?.revealLine(line);\n }\n },\n [line],\n isEditorReady\n );\n\n useUpdate(\n () => {\n monacoRef.current?.editor.setTheme(theme);\n },\n [theme],\n isEditorReady\n );\n\n const createEditor = useCallback(() => {\n if (!containerRef.current || !monacoRef.current) return;\n if (!preventCreation.current) {\n beforeMountRef.current(monacoRef.current);\n const autoCreatedModelPath = path || defaultPath;\n\n const defaultModel = getOrCreateModel(\n monacoRef.current,\n value || defaultValue || '',\n defaultLanguage || language || '',\n autoCreatedModelPath || ''\n );\n\n const editor = monacoRef.current.editor.create(\n containerRef.current,\n {\n model: defaultModel,\n automaticLayout: true,\n ...options,\n },\n overrideServices\n );\n editorRef.current = editor;\n\n saveViewState && editor.restoreViewState(viewStates.get(autoCreatedModelPath));\n\n monacoRef.current.editor.setTheme(theme);\n\n if (line !== undefined) {\n editor.revealLine(line);\n }\n\n setIsEditorReady(true);\n preventCreation.current = true;\n }\n }, [\n defaultValue,\n defaultLanguage,\n defaultPath,\n value,\n language,\n path,\n options,\n overrideServices,\n saveViewState,\n theme,\n line,\n ]);\n\n useEffect(() => {\n if (isEditorReady) {\n onMountRef.current(editorRef.current!, monacoRef.current!);\n }\n }, [isEditorReady]);\n\n useEffect(() => {\n !isMonacoMounting && !isEditorReady && createEditor();\n }, [isMonacoMounting, isEditorReady, createEditor]);\n\n // subscription\n // to avoid unnecessary updates (attach - dispose listener) in subscription\n valueRef.current = value;\n\n // onChange\n useEffect(() => {\n if (isEditorReady && onChange) {\n subscriptionRef.current?.dispose();\n subscriptionRef.current = editorRef.current?.onDidChangeModelContent((event) => {\n if (!preventTriggerChangeEvent.current) {\n onChange(editorRef.current!.getValue(), event);\n }\n });\n }\n }, [isEditorReady, onChange]);\n\n // onValidate\n useEffect(() => {\n if (isEditorReady) {\n const changeMarkersListener = monacoRef.current!.editor.onDidChangeMarkers((uris: readonly Uri[]) => {\n const editorUri = editorRef.current!.getModel()?.uri;\n\n if (editorUri) {\n const currentEditorHasMarkerChanges = uris.find((uri: Uri) => uri.path === editorUri.path);\n if (currentEditorHasMarkerChanges) {\n const markers = monacoRef.current!.editor.getModelMarkers({\n resource: editorUri,\n });\n onValidate?.(markers);\n }\n }\n });\n\n return () => {\n changeMarkersListener?.dispose();\n };\n }\n return () => {\n // eslint happy\n };\n }, [isEditorReady, onValidate]);\n\n function disposeEditor(): void {\n subscriptionRef.current?.dispose();\n\n if (keepCurrentModel) {\n saveViewState && viewStates.set(path, editorRef.current!.saveViewState());\n } else {\n editorRef.current!.getModel()?.dispose();\n }\n\n editorRef.current!.dispose();\n\n editorRef.current = null;\n preventCreation.current = false;\n setIsEditorReady(false);\n }\n\n return (\n \n );\n}\n\nexport default Editor;\n","import { useEffect, useRef } from 'react';\n\nfunction usePrevious(value: T): T | undefined {\n const ref = useRef(undefined);\n\n useEffect(() => {\n ref.current = value;\n }, [value]);\n\n return ref.current;\n}\n\nexport default usePrevious;\n"],"mappings":"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","names":["DiffEditor_default","Editor_default","loader","import_monaco_loader","import_react","import_react","styles","styles_default","styles_default","Loading_default","import_jsx_runtime","Loading_default","MonacoContainer_default","import_react","import_react","import_jsx_runtime","loader","original","modified","MonacoContainer_default","DiffEditor_default","import_react","import_monaco_loader","loader","monaco","import_react","import_react","import_monaco_loader","import_react","import_jsx_runtime","loader","MonacoContainer_default","Editor_default","Editor_default"]}
\ No newline at end of file
diff --git a/dist/index.d.cts b/dist/index.d.cts
new file mode 100644
index 0000000..b5e8571
--- /dev/null
+++ b/dist/index.d.cts
@@ -0,0 +1,232 @@
+export { default as loader } from '@willbooster/monaco-loader';
+export { shikiToMonaco } from '@shikijs/monaco';
+import * as react from 'react';
+import { ReactNode, ReactElement } from 'react';
+import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js';
+import { editor } from 'monaco-editor/esm/vs/editor/editor.api.js';
+
+type MonacoDiffEditor = editor.IStandaloneDiffEditor;
+type DiffOnMount = (editor: MonacoDiffEditor, monaco: Monaco) => void;
+type DiffBeforeMount = (monaco: Monaco) => void;
+interface DiffEditorProps {
+ /**
+ * The original source (left one) value
+ */
+ original?: string;
+ /**
+ * The modified source (right one) value
+ */
+ modified?: string;
+ /**
+ * Language for the both models - original and modified
+ */
+ language?: string;
+ /**
+ * This prop gives you the opportunity to specify the language of the
+ * original source separately, otherwise, it will get the value of the language property
+ */
+ originalLanguage?: string;
+ /**
+ * This prop gives you the opportunity to specify the language of the
+ * modified source separately, otherwise, it will get the value of language property
+ */
+ modifiedLanguage?: string;
+ /**
+ * Path for the "original" model
+ * Will be passed as a third argument to `.createModel` method
+ * `monaco.editor.createModel(..., ..., monaco.Uri.parse(originalModelPath))`
+ */
+ originalModelPath?: string;
+ /**
+ * Path for the "modified" model
+ * Will be passed as a third argument to `.createModel` method
+ * `monaco.editor.createModel(..., ..., monaco.Uri.parse(modifiedModelPath))`
+ */
+ modifiedModelPath?: string;
+ /**
+ * Indicator whether to dispose the current original model when the DiffEditor is unmounted or not
+ * @default false
+ */
+ keepCurrentOriginalModel?: boolean;
+ /**
+ * Indicator whether to dispose the current modified model when the DiffEditor is unmounted or not
+ * @default false
+ */
+ keepCurrentModifiedModel?: boolean;
+ /**
+ * The theme for the monaco
+ * Available options "vs-dark" | "light"
+ * Define new themes by `monaco.editor.defineTheme`
+ * @default "light"
+ */
+ theme?: Theme | string;
+ /**
+ * The loading screen before the editor will be mounted
+ * @default "loading..."
+ */
+ loading?: ReactNode;
+ /**
+ * IDiffEditorConstructionOptions
+ */
+ options?: editor.IDiffEditorConstructionOptions;
+ /**
+ * Width of the editor wrapper
+ * @default "100%"
+ */
+ width?: number | string;
+ /**
+ * Height of the editor wrapper
+ * @default "100%"
+ */
+ height?: number | string;
+ /**
+ * Class name for the editor container
+ */
+ className?: string;
+ /**
+ * Props applied to the wrapper element
+ */
+ wrapperProps?: object;
+ /**
+ * Signature: function(monaco: Monaco) => void
+ * An event is emitted before the editor is mounted
+ * It gets the monaco instance as a first argument
+ * Defaults to "noop"
+ */
+ beforeMount?: DiffBeforeMount;
+ /**
+ * Signature: function(editor: monaco.editor.IStandaloneCodeEditor, monaco: Monaco) => void
+ * An event is emitted when the editor is mounted
+ * It gets the editor instance as a first argument and the monaco instance as a second
+ * Defaults to "noop"
+ */
+ onMount?: DiffOnMount;
+}
+
+declare function DiffEditor({ original, modified, language, originalLanguage, modifiedLanguage, originalModelPath, modifiedModelPath, keepCurrentOriginalModel, keepCurrentModifiedModel, theme, loading, options, height, width, className, wrapperProps, beforeMount, onMount, }: DiffEditorProps): ReactElement;
+
+declare const _default$1: react.MemoExoticComponent;
+
+declare function useMonaco(): Monaco | undefined;
+
+type OnMount = (editor: editor.IStandaloneCodeEditor, monaco: Monaco) => void;
+type BeforeMount = (monaco: Monaco) => void;
+type OnChange = (value: string | undefined, ev: editor.IModelContentChangedEvent) => void;
+type OnValidate = (markers: editor.IMarker[]) => void;
+interface EditorProps {
+ /**
+ * Default value of the current model
+ */
+ defaultValue?: string;
+ /**
+ * Default language of the current model
+ */
+ defaultLanguage?: string;
+ /**
+ * Default path of the current model
+ * Will be passed as the third argument to `.createModel` method
+ * `monaco.editor.createModel(..., ..., monaco.Uri.parse(defaultPath))`
+ */
+ defaultPath?: string;
+ /**
+ * Value of the current model
+ */
+ value?: string;
+ /**
+ * Language of the current model
+ */
+ language?: string;
+ /**
+ * Path of the current model
+ * Will be passed as the third argument to `.createModel` method
+ * `monaco.editor.createModel(..., ..., monaco.Uri.parse(defaultPath))`
+ */
+ path?: string;
+ /**
+ * The theme for the monaco
+ * Available options "vs-dark" | "light"
+ * Define new themes by `monaco.editor.defineTheme`
+ * @default "light"
+ */
+ theme?: Theme | string;
+ /**
+ * The line to jump on it
+ */
+ line?: number;
+ /**
+ * The loading screen before the editor will be mounted
+ * @default "Loading..."
+ */
+ loading?: ReactNode;
+ /**
+ * IStandaloneEditorConstructionOptions
+ */
+ options?: editor.IStandaloneEditorConstructionOptions;
+ /**
+ * IEditorOverrideServices
+ */
+ overrideServices?: editor.IEditorOverrideServices;
+ /**
+ * Indicator whether to save the models' view states between model changes or not
+ * Defaults to true
+ */
+ saveViewState?: boolean;
+ /**
+ * Indicator whether to dispose the current model when the Editor is unmounted or not
+ * @default false
+ */
+ keepCurrentModel?: boolean;
+ /**
+ * Width of the editor wrapper
+ * @default "100%"
+ */
+ width?: number | string;
+ /**
+ * Height of the editor wrapper
+ * @default "100%"
+ */
+ height?: number | string;
+ /**
+ * Class name for the editor container
+ */
+ className?: string;
+ /**
+ * Props applied to the wrapper element
+ */
+ wrapperProps?: object;
+ /**
+ * Signature: function(monaco: Monaco) => void
+ * An event is emitted before the editor is mounted
+ * It gets the monaco instance as a first argument
+ * Defaults to "noop"
+ */
+ beforeMount?: BeforeMount;
+ /**
+ * Signature: function(editor: monaco.editor.IStandaloneCodeEditor, monaco: Monaco) => void
+ * An event is emitted when the editor is mounted
+ * It gets the editor instance as a first argument and the monaco instance as a second
+ * Defaults to "noop"
+ */
+ onMount?: OnMount;
+ /**
+ * Signature: function(value: string | undefined, ev: monaco.editor.IModelContentChangedEvent) => void
+ * An event is emitted when the content of the current model is changed
+ */
+ onChange?: OnChange;
+ /**
+ * Signature: function(markers: monaco.editor.IMarker[]) => void
+ * An event is emitted when the content of the current model is changed
+ * and the current model markers are ready
+ * Defaults to "noop"
+ */
+ onValidate?: OnValidate;
+}
+
+declare function Editor({ defaultValue, defaultLanguage, defaultPath, value, language, path, theme, line, loading, options, overrideServices, saveViewState, keepCurrentModel, width, height, className, wrapperProps, beforeMount, onMount, onChange, onValidate, }: EditorProps): ReactElement;
+
+declare const _default: react.MemoExoticComponent;
+
+type Monaco = typeof monaco;
+type Theme = 'vs-dark' | 'light';
+
+export { type BeforeMount, type DiffBeforeMount, _default$1 as DiffEditor, type DiffEditorProps, type DiffOnMount, _default as Editor, type EditorProps, type Monaco, type MonacoDiffEditor, type OnChange, type OnMount, type OnValidate, type Theme, _default as default, useMonaco };
diff --git a/dist/index.d.ts b/dist/index.d.ts
new file mode 100644
index 0000000..b5e8571
--- /dev/null
+++ b/dist/index.d.ts
@@ -0,0 +1,232 @@
+export { default as loader } from '@willbooster/monaco-loader';
+export { shikiToMonaco } from '@shikijs/monaco';
+import * as react from 'react';
+import { ReactNode, ReactElement } from 'react';
+import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js';
+import { editor } from 'monaco-editor/esm/vs/editor/editor.api.js';
+
+type MonacoDiffEditor = editor.IStandaloneDiffEditor;
+type DiffOnMount = (editor: MonacoDiffEditor, monaco: Monaco) => void;
+type DiffBeforeMount = (monaco: Monaco) => void;
+interface DiffEditorProps {
+ /**
+ * The original source (left one) value
+ */
+ original?: string;
+ /**
+ * The modified source (right one) value
+ */
+ modified?: string;
+ /**
+ * Language for the both models - original and modified
+ */
+ language?: string;
+ /**
+ * This prop gives you the opportunity to specify the language of the
+ * original source separately, otherwise, it will get the value of the language property
+ */
+ originalLanguage?: string;
+ /**
+ * This prop gives you the opportunity to specify the language of the
+ * modified source separately, otherwise, it will get the value of language property
+ */
+ modifiedLanguage?: string;
+ /**
+ * Path for the "original" model
+ * Will be passed as a third argument to `.createModel` method
+ * `monaco.editor.createModel(..., ..., monaco.Uri.parse(originalModelPath))`
+ */
+ originalModelPath?: string;
+ /**
+ * Path for the "modified" model
+ * Will be passed as a third argument to `.createModel` method
+ * `monaco.editor.createModel(..., ..., monaco.Uri.parse(modifiedModelPath))`
+ */
+ modifiedModelPath?: string;
+ /**
+ * Indicator whether to dispose the current original model when the DiffEditor is unmounted or not
+ * @default false
+ */
+ keepCurrentOriginalModel?: boolean;
+ /**
+ * Indicator whether to dispose the current modified model when the DiffEditor is unmounted or not
+ * @default false
+ */
+ keepCurrentModifiedModel?: boolean;
+ /**
+ * The theme for the monaco
+ * Available options "vs-dark" | "light"
+ * Define new themes by `monaco.editor.defineTheme`
+ * @default "light"
+ */
+ theme?: Theme | string;
+ /**
+ * The loading screen before the editor will be mounted
+ * @default "loading..."
+ */
+ loading?: ReactNode;
+ /**
+ * IDiffEditorConstructionOptions
+ */
+ options?: editor.IDiffEditorConstructionOptions;
+ /**
+ * Width of the editor wrapper
+ * @default "100%"
+ */
+ width?: number | string;
+ /**
+ * Height of the editor wrapper
+ * @default "100%"
+ */
+ height?: number | string;
+ /**
+ * Class name for the editor container
+ */
+ className?: string;
+ /**
+ * Props applied to the wrapper element
+ */
+ wrapperProps?: object;
+ /**
+ * Signature: function(monaco: Monaco) => void
+ * An event is emitted before the editor is mounted
+ * It gets the monaco instance as a first argument
+ * Defaults to "noop"
+ */
+ beforeMount?: DiffBeforeMount;
+ /**
+ * Signature: function(editor: monaco.editor.IStandaloneCodeEditor, monaco: Monaco) => void
+ * An event is emitted when the editor is mounted
+ * It gets the editor instance as a first argument and the monaco instance as a second
+ * Defaults to "noop"
+ */
+ onMount?: DiffOnMount;
+}
+
+declare function DiffEditor({ original, modified, language, originalLanguage, modifiedLanguage, originalModelPath, modifiedModelPath, keepCurrentOriginalModel, keepCurrentModifiedModel, theme, loading, options, height, width, className, wrapperProps, beforeMount, onMount, }: DiffEditorProps): ReactElement;
+
+declare const _default$1: react.MemoExoticComponent;
+
+declare function useMonaco(): Monaco | undefined;
+
+type OnMount = (editor: editor.IStandaloneCodeEditor, monaco: Monaco) => void;
+type BeforeMount = (monaco: Monaco) => void;
+type OnChange = (value: string | undefined, ev: editor.IModelContentChangedEvent) => void;
+type OnValidate = (markers: editor.IMarker[]) => void;
+interface EditorProps {
+ /**
+ * Default value of the current model
+ */
+ defaultValue?: string;
+ /**
+ * Default language of the current model
+ */
+ defaultLanguage?: string;
+ /**
+ * Default path of the current model
+ * Will be passed as the third argument to `.createModel` method
+ * `monaco.editor.createModel(..., ..., monaco.Uri.parse(defaultPath))`
+ */
+ defaultPath?: string;
+ /**
+ * Value of the current model
+ */
+ value?: string;
+ /**
+ * Language of the current model
+ */
+ language?: string;
+ /**
+ * Path of the current model
+ * Will be passed as the third argument to `.createModel` method
+ * `monaco.editor.createModel(..., ..., monaco.Uri.parse(defaultPath))`
+ */
+ path?: string;
+ /**
+ * The theme for the monaco
+ * Available options "vs-dark" | "light"
+ * Define new themes by `monaco.editor.defineTheme`
+ * @default "light"
+ */
+ theme?: Theme | string;
+ /**
+ * The line to jump on it
+ */
+ line?: number;
+ /**
+ * The loading screen before the editor will be mounted
+ * @default "Loading..."
+ */
+ loading?: ReactNode;
+ /**
+ * IStandaloneEditorConstructionOptions
+ */
+ options?: editor.IStandaloneEditorConstructionOptions;
+ /**
+ * IEditorOverrideServices
+ */
+ overrideServices?: editor.IEditorOverrideServices;
+ /**
+ * Indicator whether to save the models' view states between model changes or not
+ * Defaults to true
+ */
+ saveViewState?: boolean;
+ /**
+ * Indicator whether to dispose the current model when the Editor is unmounted or not
+ * @default false
+ */
+ keepCurrentModel?: boolean;
+ /**
+ * Width of the editor wrapper
+ * @default "100%"
+ */
+ width?: number | string;
+ /**
+ * Height of the editor wrapper
+ * @default "100%"
+ */
+ height?: number | string;
+ /**
+ * Class name for the editor container
+ */
+ className?: string;
+ /**
+ * Props applied to the wrapper element
+ */
+ wrapperProps?: object;
+ /**
+ * Signature: function(monaco: Monaco) => void
+ * An event is emitted before the editor is mounted
+ * It gets the monaco instance as a first argument
+ * Defaults to "noop"
+ */
+ beforeMount?: BeforeMount;
+ /**
+ * Signature: function(editor: monaco.editor.IStandaloneCodeEditor, monaco: Monaco) => void
+ * An event is emitted when the editor is mounted
+ * It gets the editor instance as a first argument and the monaco instance as a second
+ * Defaults to "noop"
+ */
+ onMount?: OnMount;
+ /**
+ * Signature: function(value: string | undefined, ev: monaco.editor.IModelContentChangedEvent) => void
+ * An event is emitted when the content of the current model is changed
+ */
+ onChange?: OnChange;
+ /**
+ * Signature: function(markers: monaco.editor.IMarker[]) => void
+ * An event is emitted when the content of the current model is changed
+ * and the current model markers are ready
+ * Defaults to "noop"
+ */
+ onValidate?: OnValidate;
+}
+
+declare function Editor({ defaultValue, defaultLanguage, defaultPath, value, language, path, theme, line, loading, options, overrideServices, saveViewState, keepCurrentModel, width, height, className, wrapperProps, beforeMount, onMount, onChange, onValidate, }: EditorProps): ReactElement;
+
+declare const _default: react.MemoExoticComponent;
+
+type Monaco = typeof monaco;
+type Theme = 'vs-dark' | 'light';
+
+export { type BeforeMount, type DiffBeforeMount, _default$1 as DiffEditor, type DiffEditorProps, type DiffOnMount, _default as Editor, type EditorProps, type Monaco, type MonacoDiffEditor, type OnChange, type OnMount, type OnValidate, type Theme, _default as default, useMonaco };
diff --git a/dist/index.js b/dist/index.js
new file mode 100644
index 0000000..53d36e4
--- /dev/null
+++ b/dist/index.js
@@ -0,0 +1,590 @@
+'use client';
+
+// src/index.ts
+import loader4 from "@willbooster/monaco-loader";
+import { shikiToMonaco } from "@shikijs/monaco";
+
+// src/DiffEditor/index.ts
+import { memo as memo2 } from "react";
+
+// src/DiffEditor/DiffEditor.tsx
+import { useState, useRef as useRef2, useCallback, useEffect as useEffect3 } from "react";
+import loader from "@willbooster/monaco-loader";
+
+// src/MonacoContainer/index.ts
+import { memo } from "react";
+
+// src/MonacoContainer/styles.ts
+var styles = {
+ wrapper: {
+ display: "flex",
+ position: "relative",
+ textAlign: "initial"
+ },
+ fullWidth: {
+ width: "100%"
+ },
+ hide: {
+ display: "none"
+ }
+};
+var styles_default = styles;
+
+// src/Loading/styles.ts
+var styles2 = {
+ container: {
+ display: "flex",
+ height: "100%",
+ width: "100%",
+ justifyContent: "center",
+ alignItems: "center"
+ }
+};
+var styles_default2 = styles2;
+
+// src/Loading/Loading.tsx
+import { jsx } from "react/jsx-runtime";
+function Loading({ children }) {
+ return /* @__PURE__ */ jsx("div", { style: styles_default2.container, children });
+}
+var Loading_default = Loading;
+
+// src/Loading/index.ts
+var Loading_default2 = Loading_default;
+
+// src/MonacoContainer/MonacoContainer.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+function MonacoContainer({
+ width,
+ height,
+ isEditorReady,
+ loading,
+ _ref,
+ className,
+ wrapperProps
+}) {
+ return /* @__PURE__ */ jsxs("section", { style: { ...styles_default.wrapper, width, height }, ...wrapperProps, children: [
+ !isEditorReady && /* @__PURE__ */ jsx2(Loading_default2, { children: loading }),
+ /* @__PURE__ */ jsx2("div", { ref: _ref, style: { ...styles_default.fullWidth, ...!isEditorReady && styles_default.hide }, className })
+ ] });
+}
+var MonacoContainer_default = MonacoContainer;
+
+// src/MonacoContainer/index.ts
+var MonacoContainer_default2 = memo(MonacoContainer_default);
+
+// src/hooks/useMount/index.ts
+import { useEffect } from "react";
+function useMount(effect) {
+ useEffect(effect, []);
+}
+var useMount_default = useMount;
+
+// src/hooks/useUpdate/index.ts
+import { useEffect as useEffect2, useRef } from "react";
+function useUpdate(effect, deps, applyChanges = true) {
+ const isInitialMount = useRef(true);
+ useEffect2(
+ isInitialMount.current || !applyChanges ? () => {
+ isInitialMount.current = false;
+ } : effect,
+ deps
+ );
+}
+var useUpdate_default = useUpdate;
+
+// src/utils/index.ts
+function noop() {
+}
+function getOrCreateModel(monaco, value, language, path) {
+ return getModel(monaco, path) ?? createModel(monaco, value, language, path);
+}
+function getModel(monaco, path) {
+ return monaco.editor.getModel(createModelUri(monaco, path));
+}
+function createModel(monaco, value, language, path) {
+ return monaco.editor.createModel(value, language, path ? createModelUri(monaco, path) : void 0);
+}
+function createModelUri(monaco, path) {
+ return monaco.Uri.parse(path);
+}
+
+// src/DiffEditor/DiffEditor.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+function DiffEditor({
+ original,
+ modified,
+ language,
+ originalLanguage,
+ modifiedLanguage,
+ originalModelPath,
+ modifiedModelPath,
+ keepCurrentOriginalModel = false,
+ keepCurrentModifiedModel = false,
+ theme = "light",
+ loading = "Loading...",
+ options = {},
+ height = "100%",
+ width = "100%",
+ className,
+ wrapperProps = {},
+ beforeMount = noop,
+ onMount = noop
+}) {
+ const [isEditorReady, setIsEditorReady] = useState(false);
+ const [isMonacoMounting, setIsMonacoMounting] = useState(true);
+ const editorRef = useRef2(null);
+ const monacoRef = useRef2(null);
+ const containerRef = useRef2(null);
+ const onMountRef = useRef2(onMount);
+ const beforeMountRef = useRef2(beforeMount);
+ const preventCreation = useRef2(false);
+ useMount_default(() => {
+ const cancelable = loader.init();
+ cancelable.then((monaco) => (monacoRef.current = monaco) && setIsMonacoMounting(false)).catch((error) => error?.type !== "cancelation" && console.error("Monaco initialization: error:", error));
+ return () => editorRef.current ? disposeEditor() : cancelable.cancel();
+ });
+ useUpdate_default(
+ () => {
+ if (editorRef.current && monacoRef.current) {
+ const originalEditor = editorRef.current.getOriginalEditor();
+ const model = getOrCreateModel(
+ monacoRef.current,
+ original || "",
+ originalLanguage || language || "text",
+ originalModelPath || ""
+ );
+ if (model !== originalEditor.getModel()) {
+ originalEditor.setModel(model);
+ }
+ }
+ },
+ [originalModelPath],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ if (editorRef.current && monacoRef.current) {
+ const modifiedEditor = editorRef.current.getModifiedEditor();
+ const model = getOrCreateModel(
+ monacoRef.current,
+ modified || "",
+ modifiedLanguage || language || "text",
+ modifiedModelPath || ""
+ );
+ if (model !== modifiedEditor.getModel()) {
+ modifiedEditor.setModel(model);
+ }
+ }
+ },
+ [modifiedModelPath],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ const modifiedEditor = editorRef.current.getModifiedEditor();
+ if (modifiedEditor.getOption(monacoRef.current.editor.EditorOption.readOnly)) {
+ modifiedEditor.setValue(modified || "");
+ } else {
+ if (modified !== modifiedEditor.getValue()) {
+ modifiedEditor.executeEdits("", [
+ {
+ range: modifiedEditor.getModel().getFullModelRange(),
+ text: modified || "",
+ forceMoveMarkers: true
+ }
+ ]);
+ modifiedEditor.pushUndoStop();
+ }
+ }
+ },
+ [modified],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ editorRef.current?.getModel()?.original.setValue(original || "");
+ },
+ [original],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ const { original: original2, modified: modified2 } = editorRef.current.getModel();
+ monacoRef.current.editor.setModelLanguage(original2, originalLanguage || language || "text");
+ monacoRef.current.editor.setModelLanguage(modified2, modifiedLanguage || language || "text");
+ },
+ [language, originalLanguage, modifiedLanguage],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ monacoRef.current?.editor.setTheme(theme);
+ },
+ [theme],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ editorRef.current?.updateOptions(options);
+ },
+ [options],
+ isEditorReady
+ );
+ const setModels = useCallback(() => {
+ if (!monacoRef.current) return;
+ beforeMountRef.current(monacoRef.current);
+ const originalModel = getOrCreateModel(
+ monacoRef.current,
+ original || "",
+ originalLanguage || language || "text",
+ originalModelPath || ""
+ );
+ const modifiedModel = getOrCreateModel(
+ monacoRef.current,
+ modified || "",
+ modifiedLanguage || language || "text",
+ modifiedModelPath || ""
+ );
+ editorRef.current?.setModel({
+ original: originalModel,
+ modified: modifiedModel
+ });
+ }, [language, modified, modifiedLanguage, original, originalLanguage, originalModelPath, modifiedModelPath]);
+ const createEditor = useCallback(() => {
+ if (!preventCreation.current && containerRef.current) {
+ editorRef.current = monacoRef.current.editor.createDiffEditor(containerRef.current, {
+ automaticLayout: true,
+ ...options
+ });
+ setModels();
+ monacoRef.current?.editor.setTheme(theme);
+ setIsEditorReady(true);
+ preventCreation.current = true;
+ }
+ }, [options, theme, setModels]);
+ useEffect3(() => {
+ if (isEditorReady) {
+ onMountRef.current(editorRef.current, monacoRef.current);
+ }
+ }, [isEditorReady]);
+ useEffect3(() => {
+ if (!isMonacoMounting && !isEditorReady) {
+ createEditor();
+ }
+ }, [isMonacoMounting, isEditorReady, createEditor]);
+ function disposeEditor() {
+ const editor = editorRef.current;
+ const models = editor?.getModel();
+ editor?.setModel(null);
+ editor?.dispose();
+ if (!keepCurrentOriginalModel && !models?.original.isDisposed()) {
+ models?.original?.dispose();
+ }
+ if (!keepCurrentModifiedModel && !models?.modified.isDisposed()) {
+ models?.modified?.dispose();
+ }
+ editorRef.current = null;
+ preventCreation.current = false;
+ setIsEditorReady(false);
+ }
+ return /* @__PURE__ */ jsx3(
+ MonacoContainer_default2,
+ {
+ width,
+ height,
+ isEditorReady,
+ loading,
+ _ref: containerRef,
+ className,
+ wrapperProps
+ }
+ );
+}
+var DiffEditor_default = DiffEditor;
+
+// src/DiffEditor/index.ts
+var DiffEditor_default2 = memo2(DiffEditor_default);
+
+// src/hooks/useMonaco/index.ts
+import { useState as useState2 } from "react";
+import loader2 from "@willbooster/monaco-loader";
+function useMonaco() {
+ const [monaco, setMonaco] = useState2(loader2.__getMonacoInstance());
+ useMount_default(() => {
+ let cancelable;
+ if (!monaco) {
+ cancelable = loader2.init();
+ void cancelable.then((monaco2) => {
+ setMonaco(monaco2);
+ return;
+ }).catch((error) => {
+ if (error?.type !== "cancelation") {
+ console.error("Monaco initialization: error:", error);
+ }
+ });
+ }
+ return () => cancelable?.cancel();
+ });
+ return monaco;
+}
+var useMonaco_default = useMonaco;
+
+// src/Editor/index.ts
+import { memo as memo3 } from "react";
+
+// src/Editor/Editor.tsx
+import { useState as useState3, useEffect as useEffect5, useRef as useRef4, useCallback as useCallback2 } from "react";
+import loader3 from "@willbooster/monaco-loader";
+
+// src/hooks/usePrevious/index.ts
+import { useEffect as useEffect4, useRef as useRef3 } from "react";
+function usePrevious(value) {
+ const ref = useRef3(void 0);
+ useEffect4(() => {
+ ref.current = value;
+ }, [value]);
+ return ref.current;
+}
+var usePrevious_default = usePrevious;
+
+// src/Editor/Editor.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var viewStates = /* @__PURE__ */ new Map();
+function Editor({
+ defaultValue,
+ defaultLanguage,
+ defaultPath,
+ value,
+ language,
+ path,
+ /* === */
+ theme = "light",
+ line,
+ loading = "Loading...",
+ options = {},
+ overrideServices = {},
+ saveViewState = true,
+ keepCurrentModel = false,
+ /* === */
+ width = "100%",
+ height = "100%",
+ className,
+ wrapperProps = {},
+ /* === */
+ beforeMount = noop,
+ onMount = noop,
+ onChange,
+ onValidate = noop
+}) {
+ const [isEditorReady, setIsEditorReady] = useState3(false);
+ const [isMonacoMounting, setIsMonacoMounting] = useState3(true);
+ const monacoRef = useRef4(null);
+ const editorRef = useRef4(null);
+ const containerRef = useRef4(null);
+ const onMountRef = useRef4(onMount);
+ const beforeMountRef = useRef4(beforeMount);
+ const subscriptionRef = useRef4(void 0);
+ const valueRef = useRef4(value);
+ const previousPath = usePrevious_default(path);
+ const preventCreation = useRef4(false);
+ const preventTriggerChangeEvent = useRef4(false);
+ useMount_default(() => {
+ const cancelable = loader3.init();
+ cancelable.then((monaco) => (monacoRef.current = monaco) && setIsMonacoMounting(false)).catch((error) => error?.type !== "cancelation" && console.error("Monaco initialization: error:", error));
+ return () => editorRef.current ? disposeEditor() : cancelable.cancel();
+ });
+ useUpdate_default(
+ () => {
+ const model = getOrCreateModel(
+ monacoRef.current,
+ defaultValue || value || "",
+ defaultLanguage || language || "",
+ path || defaultPath || ""
+ );
+ if (model !== editorRef.current?.getModel()) {
+ if (saveViewState) viewStates.set(previousPath, editorRef.current?.saveViewState());
+ editorRef.current?.setModel(model);
+ if (saveViewState) editorRef.current?.restoreViewState(viewStates.get(path));
+ }
+ },
+ [path],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ editorRef.current?.updateOptions(options);
+ },
+ [options],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ if (!editorRef.current || value === void 0) return;
+ if (editorRef.current.getOption(monacoRef.current.editor.EditorOption.readOnly)) {
+ editorRef.current.setValue(value);
+ } else if (value !== editorRef.current.getValue()) {
+ preventTriggerChangeEvent.current = true;
+ editorRef.current.executeEdits("", [
+ {
+ range: editorRef.current.getModel().getFullModelRange(),
+ text: value,
+ forceMoveMarkers: true
+ }
+ ]);
+ editorRef.current.pushUndoStop();
+ preventTriggerChangeEvent.current = false;
+ }
+ },
+ [value],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ const model = editorRef.current?.getModel();
+ if (isEditorReady && model && language) {
+ monacoRef.current?.editor.setModelLanguage(model, language);
+ }
+ },
+ [language, isEditorReady],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ if (line !== void 0) {
+ editorRef.current?.revealLine(line);
+ }
+ },
+ [line],
+ isEditorReady
+ );
+ useUpdate_default(
+ () => {
+ monacoRef.current?.editor.setTheme(theme);
+ },
+ [theme],
+ isEditorReady
+ );
+ const createEditor = useCallback2(() => {
+ if (!containerRef.current || !monacoRef.current) return;
+ if (!preventCreation.current) {
+ beforeMountRef.current(monacoRef.current);
+ const autoCreatedModelPath = path || defaultPath;
+ const defaultModel = getOrCreateModel(
+ monacoRef.current,
+ value || defaultValue || "",
+ defaultLanguage || language || "",
+ autoCreatedModelPath || ""
+ );
+ const editor = monacoRef.current.editor.create(
+ containerRef.current,
+ {
+ model: defaultModel,
+ automaticLayout: true,
+ ...options
+ },
+ overrideServices
+ );
+ editorRef.current = editor;
+ saveViewState && editor.restoreViewState(viewStates.get(autoCreatedModelPath));
+ monacoRef.current.editor.setTheme(theme);
+ if (line !== void 0) {
+ editor.revealLine(line);
+ }
+ setIsEditorReady(true);
+ preventCreation.current = true;
+ }
+ }, [
+ defaultValue,
+ defaultLanguage,
+ defaultPath,
+ value,
+ language,
+ path,
+ options,
+ overrideServices,
+ saveViewState,
+ theme,
+ line
+ ]);
+ useEffect5(() => {
+ if (isEditorReady) {
+ onMountRef.current(editorRef.current, monacoRef.current);
+ }
+ }, [isEditorReady]);
+ useEffect5(() => {
+ !isMonacoMounting && !isEditorReady && createEditor();
+ }, [isMonacoMounting, isEditorReady, createEditor]);
+ valueRef.current = value;
+ useEffect5(() => {
+ if (isEditorReady && onChange) {
+ subscriptionRef.current?.dispose();
+ subscriptionRef.current = editorRef.current?.onDidChangeModelContent((event) => {
+ if (!preventTriggerChangeEvent.current) {
+ onChange(editorRef.current.getValue(), event);
+ }
+ });
+ }
+ }, [isEditorReady, onChange]);
+ useEffect5(() => {
+ if (isEditorReady) {
+ const changeMarkersListener = monacoRef.current.editor.onDidChangeMarkers((uris) => {
+ const editorUri = editorRef.current.getModel()?.uri;
+ if (editorUri) {
+ const currentEditorHasMarkerChanges = uris.find((uri) => uri.path === editorUri.path);
+ if (currentEditorHasMarkerChanges) {
+ const markers = monacoRef.current.editor.getModelMarkers({
+ resource: editorUri
+ });
+ onValidate?.(markers);
+ }
+ }
+ });
+ return () => {
+ changeMarkersListener?.dispose();
+ };
+ }
+ return () => {
+ };
+ }, [isEditorReady, onValidate]);
+ function disposeEditor() {
+ subscriptionRef.current?.dispose();
+ if (keepCurrentModel) {
+ saveViewState && viewStates.set(path, editorRef.current.saveViewState());
+ } else {
+ editorRef.current.getModel()?.dispose();
+ }
+ editorRef.current.dispose();
+ editorRef.current = null;
+ preventCreation.current = false;
+ setIsEditorReady(false);
+ }
+ return /* @__PURE__ */ jsx4(
+ MonacoContainer_default2,
+ {
+ width,
+ height,
+ isEditorReady,
+ loading,
+ _ref: containerRef,
+ className,
+ wrapperProps
+ }
+ );
+}
+var Editor_default = Editor;
+
+// src/Editor/index.ts
+var Editor_default2 = memo3(Editor_default);
+
+// src/index.ts
+var index_default = Editor_default2;
+export {
+ DiffEditor_default2 as DiffEditor,
+ Editor_default2 as Editor,
+ index_default as default,
+ loader4 as loader,
+ shikiToMonaco,
+ useMonaco_default as useMonaco
+};
+//# sourceMappingURL=index.js.map
\ No newline at end of file
diff --git a/dist/index.js.map b/dist/index.js.map
new file mode 100644
index 0000000..6b5d5c8
--- /dev/null
+++ b/dist/index.js.map
@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/DiffEditor/index.ts","../src/DiffEditor/DiffEditor.tsx","../src/MonacoContainer/index.ts","../src/MonacoContainer/styles.ts","../src/Loading/styles.ts","../src/Loading/Loading.tsx","../src/Loading/index.ts","../src/MonacoContainer/MonacoContainer.tsx","../src/hooks/useMount/index.ts","../src/hooks/useUpdate/index.ts","../src/utils/index.ts","../src/hooks/useMonaco/index.ts","../src/Editor/index.ts","../src/Editor/Editor.tsx","../src/hooks/usePrevious/index.ts"],"sourcesContent":["import loader from '@willbooster/monaco-loader';\nexport { loader };\nexport { shikiToMonaco } from '@shikijs/monaco';\n\nimport DiffEditor from './DiffEditor';\nexport * from './DiffEditor/types';\nexport { DiffEditor };\n\nimport useMonaco from './hooks/useMonaco';\nexport { useMonaco };\n\nimport Editor from './Editor';\nexport * from './Editor/types';\nexport { Editor };\nexport default Editor;\n\n// Monaco\nimport type * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js';\nexport type Monaco = typeof monaco;\n\n// Default themes\nexport type Theme = 'vs-dark' | 'light';\n","import { memo } from 'react';\n\nimport DiffEditor from './DiffEditor';\n\nexport * from './types';\n\nexport default memo(DiffEditor);\n","'use client';\n\nimport { useState, useRef, useCallback, useEffect } from 'react';\nimport type { ReactElement } from 'react';\nimport loader from '@willbooster/monaco-loader';\n\nimport MonacoContainer from '../MonacoContainer';\nimport useMount from '../hooks/useMount';\nimport useUpdate from '../hooks/useUpdate';\nimport { noop, getOrCreateModel } from '../utils';\nimport type { DiffEditorProps, MonacoDiffEditor } from './types';\nimport type { Monaco } from '..';\n\nfunction DiffEditor({\n original,\n modified,\n language,\n originalLanguage,\n modifiedLanguage,\n originalModelPath,\n modifiedModelPath,\n keepCurrentOriginalModel = false,\n keepCurrentModifiedModel = false,\n theme = 'light',\n loading = 'Loading...',\n options = {},\n height = '100%',\n width = '100%',\n className,\n wrapperProps = {},\n beforeMount = noop,\n onMount = noop,\n}: DiffEditorProps): ReactElement {\n const [isEditorReady, setIsEditorReady] = useState(false);\n const [isMonacoMounting, setIsMonacoMounting] = useState(true);\n const editorRef = useRef(null);\n const monacoRef = useRef(null);\n const containerRef = useRef(null);\n const onMountRef = useRef(onMount);\n const beforeMountRef = useRef(beforeMount);\n const preventCreation = useRef(false);\n\n useMount(() => {\n const cancelable = loader.init();\n\n cancelable\n .then((monaco) => (monacoRef.current = monaco as Monaco) && setIsMonacoMounting(false))\n .catch((error) => error?.type !== 'cancelation' && console.error('Monaco initialization: error:', error));\n\n return () => (editorRef.current ? disposeEditor() : cancelable.cancel());\n });\n\n useUpdate(\n () => {\n if (editorRef.current && monacoRef.current) {\n const originalEditor = editorRef.current.getOriginalEditor();\n const model = getOrCreateModel(\n monacoRef.current,\n original || '',\n originalLanguage || language || 'text',\n originalModelPath || ''\n );\n\n if (model !== originalEditor.getModel()) {\n originalEditor.setModel(model);\n }\n }\n },\n [originalModelPath],\n isEditorReady\n );\n\n useUpdate(\n () => {\n if (editorRef.current && monacoRef.current) {\n const modifiedEditor = editorRef.current.getModifiedEditor();\n const model = getOrCreateModel(\n monacoRef.current,\n modified || '',\n modifiedLanguage || language || 'text',\n modifiedModelPath || ''\n );\n\n if (model !== modifiedEditor.getModel()) {\n modifiedEditor.setModel(model);\n }\n }\n },\n [modifiedModelPath],\n isEditorReady\n );\n\n useUpdate(\n () => {\n const modifiedEditor = editorRef.current!.getModifiedEditor();\n if (modifiedEditor.getOption(monacoRef.current!.editor.EditorOption.readOnly)) {\n modifiedEditor.setValue(modified || '');\n } else {\n if (modified !== modifiedEditor.getValue()) {\n modifiedEditor.executeEdits('', [\n {\n range: modifiedEditor.getModel()!.getFullModelRange(),\n text: modified || '',\n forceMoveMarkers: true,\n },\n ]);\n\n modifiedEditor.pushUndoStop();\n }\n }\n },\n [modified],\n isEditorReady\n );\n\n useUpdate(\n () => {\n editorRef.current?.getModel()?.original.setValue(original || '');\n },\n [original],\n isEditorReady\n );\n\n useUpdate(\n () => {\n const { original, modified } = editorRef.current!.getModel()!;\n\n monacoRef.current!.editor.setModelLanguage(original, originalLanguage || language || 'text');\n monacoRef.current!.editor.setModelLanguage(modified, modifiedLanguage || language || 'text');\n },\n [language, originalLanguage, modifiedLanguage],\n isEditorReady\n );\n\n useUpdate(\n () => {\n monacoRef.current?.editor.setTheme(theme);\n },\n [theme],\n isEditorReady\n );\n\n useUpdate(\n () => {\n editorRef.current?.updateOptions(options);\n },\n [options],\n isEditorReady\n );\n\n const setModels = useCallback(() => {\n if (!monacoRef.current) return;\n beforeMountRef.current(monacoRef.current);\n const originalModel = getOrCreateModel(\n monacoRef.current,\n original || '',\n originalLanguage || language || 'text',\n originalModelPath || ''\n );\n\n const modifiedModel = getOrCreateModel(\n monacoRef.current,\n modified || '',\n modifiedLanguage || language || 'text',\n modifiedModelPath || ''\n );\n\n editorRef.current?.setModel({\n original: originalModel,\n modified: modifiedModel,\n });\n }, [language, modified, modifiedLanguage, original, originalLanguage, originalModelPath, modifiedModelPath]);\n\n const createEditor = useCallback(() => {\n if (!preventCreation.current && containerRef.current) {\n editorRef.current = monacoRef.current!.editor.createDiffEditor(containerRef.current, {\n automaticLayout: true,\n ...options,\n });\n\n setModels();\n\n monacoRef.current?.editor.setTheme(theme);\n\n setIsEditorReady(true);\n preventCreation.current = true;\n }\n }, [options, theme, setModels]);\n\n useEffect(() => {\n if (isEditorReady) {\n onMountRef.current(editorRef.current!, monacoRef.current!);\n }\n }, [isEditorReady]);\n\n useEffect(() => {\n if (!isMonacoMounting && !isEditorReady) {\n createEditor();\n }\n }, [isMonacoMounting, isEditorReady, createEditor]);\n\n function disposeEditor(): void {\n const editor = editorRef.current;\n const models = editor?.getModel();\n\n // oxlint-disable-next-line unicorn/no-null -- Monaco detaches diff models with null.\n editor?.setModel(null);\n editor?.dispose();\n\n if (!keepCurrentOriginalModel && !models?.original.isDisposed()) {\n models?.original?.dispose();\n }\n\n if (!keepCurrentModifiedModel && !models?.modified.isDisposed()) {\n models?.modified?.dispose();\n }\n\n // oxlint-disable-next-line unicorn/no-null -- React refs use null after unmount.\n editorRef.current = null;\n preventCreation.current = false;\n setIsEditorReady(false);\n }\n\n return (\n \n );\n}\n\nexport default DiffEditor;\n","import { memo } from 'react';\n\nimport MonacoContainer from './MonacoContainer';\n\nexport default memo(MonacoContainer);\n","import type { CSSProperties } from 'react';\n\nconst styles: Record = {\n wrapper: {\n display: 'flex',\n position: 'relative',\n textAlign: 'initial',\n },\n fullWidth: {\n width: '100%',\n },\n hide: {\n display: 'none',\n },\n};\n\nexport default styles;\n","import type { CSSProperties } from 'react';\n\nconst styles: Record = {\n container: {\n display: 'flex',\n height: '100%',\n width: '100%',\n justifyContent: 'center',\n alignItems: 'center',\n },\n};\n\nexport default styles;\n","import type { PropsWithChildren, ReactElement } from 'react';\n\nimport styles from './styles';\n\nfunction Loading({ children }: PropsWithChildren): ReactElement {\n return {children}
;\n}\n\nexport default Loading;\n","import Loading from './Loading';\n\nexport default Loading;\n","import type { ReactElement } from 'react';\n\nimport styles from './styles';\nimport Loading from '../Loading';\nimport type { ContainerProps } from './types';\n\n// ** forwardref render functions do not support proptypes or defaultprops **\n// one of the reasons why we use a separate prop for passing ref instead of using forwardref\n\nfunction MonacoContainer({\n width,\n height,\n isEditorReady,\n loading,\n _ref,\n className,\n wrapperProps,\n}: ContainerProps): ReactElement {\n return (\n \n {!isEditorReady && {loading}}\n \n \n );\n}\n\nexport default MonacoContainer;\n","import { useEffect } from 'react';\nimport type { EffectCallback } from 'react';\n\nfunction useMount(effect: EffectCallback): void {\n useEffect(effect, []);\n}\n\nexport default useMount;\n","import { useEffect, useRef } from 'react';\nimport type { DependencyList, EffectCallback } from 'react';\n\nfunction useUpdate(effect: EffectCallback, deps: DependencyList, applyChanges = true): void {\n const isInitialMount = useRef(true);\n\n useEffect(\n isInitialMount.current || !applyChanges\n ? () => {\n isInitialMount.current = false;\n }\n : effect,\n deps\n );\n}\n\nexport default useUpdate;\n","import type { Monaco } from '..';\nimport type { Uri, editor } from 'monaco-editor/esm/vs/editor/editor.api.js';\n\n/**\n * noop is a helper function that does nothing\n * @returns undefined\n */\nfunction noop(): void {\n /** no-op */\n}\n\n/**\n * getOrCreateModel is a helper function that will return a model if it exists\n * or create a new model if it does not exist.\n * This is useful for when you want to create a model for a file that may or may not exist yet.\n * @param monaco The monaco instance\n * @param value The value of the model\n * @param language The language of the model\n * @param path The path of the model\n * @returns The model that was found or created\n */\nfunction getOrCreateModel(monaco: Monaco, value: string, language: string, path: string): editor.ITextModel {\n return getModel(monaco, path) ?? createModel(monaco, value, language, path);\n}\n\n/**\n * getModel is a helper function that will return a model if it exists\n * or return undefined if it does not exist.\n * @param monaco The monaco instance\n * @param path The path of the model\n * @returns The model that was found or undefined\n */\nfunction getModel(monaco: Monaco, path: string): editor.ITextModel | null {\n return monaco.editor.getModel(createModelUri(monaco, path));\n}\n\n/**\n * createModel is a helper function that will create a new model\n * @param monaco The monaco instance\n * @param value The value of the model\n * @param language The language of the model\n * @param path The path of the model\n * @returns The model that was created\n */\nfunction createModel(monaco: Monaco, value: string, language?: string, path?: string): editor.ITextModel {\n return monaco.editor.createModel(value, language, path ? createModelUri(monaco, path) : undefined);\n}\n\n/**\n * createModelUri is a helper function that will create a new model uri\n * @param monaco The monaco instance\n * @param path The path of the model\n * @returns The model uri that was created\n */\nfunction createModelUri(monaco: Monaco, path: string): Uri {\n return monaco.Uri.parse(path);\n}\n\nexport { noop, getOrCreateModel };\n","import { useState } from 'react';\nimport loader from '@willbooster/monaco-loader';\n\nimport useMount from '../useMount';\nimport type { Monaco } from '../..';\n\nfunction useMonaco(): Monaco | undefined {\n const [monaco, setMonaco] = useState(loader.__getMonacoInstance() as Monaco | undefined);\n\n useMount(() => {\n let cancelable: ReturnType;\n\n if (!monaco) {\n cancelable = loader.init();\n\n void cancelable\n .then((monaco) => {\n setMonaco(monaco as Monaco);\n return;\n })\n .catch((error: unknown) => {\n if ((error as { type?: unknown })?.type !== 'cancelation') {\n console.error('Monaco initialization: error:', error);\n }\n });\n }\n\n return () => cancelable?.cancel();\n });\n\n return monaco;\n}\n\nexport default useMonaco;\n","import { memo } from 'react';\n\nimport Editor from './Editor';\n\nexport * from './types';\n\nexport default memo(Editor);\n","'use client';\n\nimport { useState, useEffect, useRef, useCallback } from 'react';\nimport type { ReactElement } from 'react';\nimport loader from '@willbooster/monaco-loader';\nimport useMount from '../hooks/useMount';\nimport useUpdate from '../hooks/useUpdate';\nimport usePrevious from '../hooks/usePrevious';\nimport type { IDisposable, Uri, editor } from 'monaco-editor/esm/vs/editor/editor.api.js';\nimport { noop, getOrCreateModel } from '../utils';\nimport type { EditorProps } from './types';\nimport type { Monaco } from '..';\nimport MonacoContainer from '../MonacoContainer';\n\nconst viewStates = new Map();\n\nfunction Editor({\n defaultValue,\n defaultLanguage,\n defaultPath,\n value,\n language,\n path,\n /* === */\n theme = 'light',\n line,\n loading = 'Loading...',\n options = {},\n overrideServices = {},\n saveViewState = true,\n keepCurrentModel = false,\n /* === */\n width = '100%',\n height = '100%',\n className,\n wrapperProps = {},\n /* === */\n beforeMount = noop,\n onMount = noop,\n onChange,\n onValidate = noop,\n}: EditorProps): ReactElement {\n const [isEditorReady, setIsEditorReady] = useState(false);\n const [isMonacoMounting, setIsMonacoMounting] = useState(true);\n const monacoRef = useRef(null);\n const editorRef = useRef(null);\n const containerRef = useRef(null);\n const onMountRef = useRef(onMount);\n const beforeMountRef = useRef(beforeMount);\n const subscriptionRef = useRef(undefined);\n const valueRef = useRef(value);\n const previousPath = usePrevious(path);\n const preventCreation = useRef(false);\n const preventTriggerChangeEvent = useRef(false);\n\n useMount(() => {\n const cancelable = loader.init();\n\n cancelable\n .then((monaco) => (monacoRef.current = monaco as Monaco) && setIsMonacoMounting(false))\n .catch((error) => error?.type !== 'cancelation' && console.error('Monaco initialization: error:', error));\n\n return () => (editorRef.current ? disposeEditor() : cancelable.cancel());\n });\n\n useUpdate(\n () => {\n const model = getOrCreateModel(\n monacoRef.current!,\n defaultValue || value || '',\n defaultLanguage || language || '',\n path || defaultPath || ''\n );\n\n if (model !== editorRef.current?.getModel()) {\n if (saveViewState) viewStates.set(previousPath, editorRef.current?.saveViewState());\n editorRef.current?.setModel(model);\n if (saveViewState) editorRef.current?.restoreViewState(viewStates.get(path));\n }\n },\n [path],\n isEditorReady\n );\n\n useUpdate(\n () => {\n editorRef.current?.updateOptions(options);\n },\n [options],\n isEditorReady\n );\n\n useUpdate(\n () => {\n if (!editorRef.current || value === undefined) return;\n if (editorRef.current.getOption(monacoRef.current!.editor.EditorOption.readOnly)) {\n editorRef.current.setValue(value);\n } else if (value !== editorRef.current.getValue()) {\n preventTriggerChangeEvent.current = true;\n editorRef.current.executeEdits('', [\n {\n range: editorRef.current.getModel()!.getFullModelRange(),\n text: value,\n forceMoveMarkers: true,\n },\n ]);\n\n editorRef.current.pushUndoStop();\n preventTriggerChangeEvent.current = false;\n }\n },\n [value],\n isEditorReady\n );\n\n useUpdate(\n () => {\n const model = editorRef.current?.getModel();\n if (isEditorReady && model && language) {\n monacoRef.current?.editor.setModelLanguage(model, language);\n }\n },\n [language, isEditorReady],\n isEditorReady\n );\n\n useUpdate(\n () => {\n // reason for undefined check: https://github.com/suren-atoyan/monaco-react/pull/188\n if (line !== undefined) {\n editorRef.current?.revealLine(line);\n }\n },\n [line],\n isEditorReady\n );\n\n useUpdate(\n () => {\n monacoRef.current?.editor.setTheme(theme);\n },\n [theme],\n isEditorReady\n );\n\n const createEditor = useCallback(() => {\n if (!containerRef.current || !monacoRef.current) return;\n if (!preventCreation.current) {\n beforeMountRef.current(monacoRef.current);\n const autoCreatedModelPath = path || defaultPath;\n\n const defaultModel = getOrCreateModel(\n monacoRef.current,\n value || defaultValue || '',\n defaultLanguage || language || '',\n autoCreatedModelPath || ''\n );\n\n const editor = monacoRef.current.editor.create(\n containerRef.current,\n {\n model: defaultModel,\n automaticLayout: true,\n ...options,\n },\n overrideServices\n );\n editorRef.current = editor;\n\n saveViewState && editor.restoreViewState(viewStates.get(autoCreatedModelPath));\n\n monacoRef.current.editor.setTheme(theme);\n\n if (line !== undefined) {\n editor.revealLine(line);\n }\n\n setIsEditorReady(true);\n preventCreation.current = true;\n }\n }, [\n defaultValue,\n defaultLanguage,\n defaultPath,\n value,\n language,\n path,\n options,\n overrideServices,\n saveViewState,\n theme,\n line,\n ]);\n\n useEffect(() => {\n if (isEditorReady) {\n onMountRef.current(editorRef.current!, monacoRef.current!);\n }\n }, [isEditorReady]);\n\n useEffect(() => {\n !isMonacoMounting && !isEditorReady && createEditor();\n }, [isMonacoMounting, isEditorReady, createEditor]);\n\n // subscription\n // to avoid unnecessary updates (attach - dispose listener) in subscription\n valueRef.current = value;\n\n // onChange\n useEffect(() => {\n if (isEditorReady && onChange) {\n subscriptionRef.current?.dispose();\n subscriptionRef.current = editorRef.current?.onDidChangeModelContent((event) => {\n if (!preventTriggerChangeEvent.current) {\n onChange(editorRef.current!.getValue(), event);\n }\n });\n }\n }, [isEditorReady, onChange]);\n\n // onValidate\n useEffect(() => {\n if (isEditorReady) {\n const changeMarkersListener = monacoRef.current!.editor.onDidChangeMarkers((uris: readonly Uri[]) => {\n const editorUri = editorRef.current!.getModel()?.uri;\n\n if (editorUri) {\n const currentEditorHasMarkerChanges = uris.find((uri: Uri) => uri.path === editorUri.path);\n if (currentEditorHasMarkerChanges) {\n const markers = monacoRef.current!.editor.getModelMarkers({\n resource: editorUri,\n });\n onValidate?.(markers);\n }\n }\n });\n\n return () => {\n changeMarkersListener?.dispose();\n };\n }\n return () => {\n // eslint happy\n };\n }, [isEditorReady, onValidate]);\n\n function disposeEditor(): void {\n subscriptionRef.current?.dispose();\n\n if (keepCurrentModel) {\n saveViewState && viewStates.set(path, editorRef.current!.saveViewState());\n } else {\n editorRef.current!.getModel()?.dispose();\n }\n\n editorRef.current!.dispose();\n\n editorRef.current = null;\n preventCreation.current = false;\n setIsEditorReady(false);\n }\n\n return (\n \n );\n}\n\nexport default Editor;\n","import { useEffect, useRef } from 'react';\n\nfunction usePrevious(value: T): T | undefined {\n const ref = useRef(undefined);\n\n useEffect(() => {\n ref.current = value;\n }, [value]);\n\n return ref.current;\n}\n\nexport default usePrevious;\n"],"mappings":"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","names":["loader","memo","useRef","useEffect","styles","styles_default","styles_default","Loading_default","jsx","Loading_default","MonacoContainer_default","useEffect","jsx","useRef","original","modified","useEffect","MonacoContainer_default","DiffEditor_default","memo","useState","loader","useState","loader","monaco","memo","useState","useEffect","useRef","useCallback","loader","useEffect","useRef","jsx","useState","useRef","loader","useCallback","useEffect","MonacoContainer_default","Editor_default","memo","Editor_default"]}
\ No newline at end of file
diff --git a/package.json b/package.json
index df08830..2ec82d3 100644
--- a/package.json
+++ b/package.json
@@ -54,6 +54,7 @@
"typecheck": "tsgo --noEmit"
},
"dependencies": {
+ "@shikijs/monaco": "4.0.2",
"@willbooster/monaco-loader": "1.1.1",
"monaco-editor": "0.55.1"
},
diff --git a/src/index.ts b/src/index.ts
index ca9686e..88b4f09 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,5 +1,6 @@
import loader from '@willbooster/monaco-loader';
export { loader };
+export { shikiToMonaco } from '@shikijs/monaco';
import DiffEditor from './DiffEditor';
export * from './DiffEditor/types';
diff --git a/yarn.lock b/yarn.lock
index 3f550fe..b5c6a37 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1847,6 +1847,58 @@ __metadata:
languageName: node
linkType: hard
+"@shikijs/core@npm:4.0.2":
+ version: 4.0.2
+ resolution: "@shikijs/core@npm:4.0.2"
+ dependencies:
+ "@shikijs/primitive": "npm:4.0.2"
+ "@shikijs/types": "npm:4.0.2"
+ "@shikijs/vscode-textmate": "npm:^10.0.2"
+ "@types/hast": "npm:^3.0.4"
+ hast-util-to-html: "npm:^9.0.5"
+ checksum: 10c0/0a8c56d50b2f67334e5e128b89f1e85844f60ae1dfbd4171e6e92242398678f6eaf91cd02f8418ac4abf4d81774e0ec9a83274a2e3f609c410e577520eadb0f5
+ languageName: node
+ linkType: hard
+
+"@shikijs/monaco@npm:4.0.2":
+ version: 4.0.2
+ resolution: "@shikijs/monaco@npm:4.0.2"
+ dependencies:
+ "@shikijs/core": "npm:4.0.2"
+ "@shikijs/types": "npm:4.0.2"
+ "@shikijs/vscode-textmate": "npm:^10.0.2"
+ checksum: 10c0/4eb4dee68678ed682b9ad196fa1e32b3a52b9165e20678c7b45e448afd1761755623bcc50ac0be0d0c82612c4d398561b389fe4bd6a8400b8b4295fe27ea361d
+ languageName: node
+ linkType: hard
+
+"@shikijs/primitive@npm:4.0.2":
+ version: 4.0.2
+ resolution: "@shikijs/primitive@npm:4.0.2"
+ dependencies:
+ "@shikijs/types": "npm:4.0.2"
+ "@shikijs/vscode-textmate": "npm:^10.0.2"
+ "@types/hast": "npm:^3.0.4"
+ checksum: 10c0/7173967ba705ccf3b72eaff8d7937f914f230446a92fead0341f672dc5f9309906b24728ce5b8d1ef4aae8f64eb12f40ea19b3570d7609cb3b8b45f4c19d2144
+ languageName: node
+ linkType: hard
+
+"@shikijs/types@npm:4.0.2":
+ version: 4.0.2
+ resolution: "@shikijs/types@npm:4.0.2"
+ dependencies:
+ "@shikijs/vscode-textmate": "npm:^10.0.2"
+ "@types/hast": "npm:^3.0.4"
+ checksum: 10c0/9df16cf9988fef0e8ac6e438bc90805ccea707700d169e8e16ab87617d14fb2eeac2a7ead310aa88398c04d1dde95f877c1b695567578e40e6845bce2f65fc73
+ languageName: node
+ linkType: hard
+
+"@shikijs/vscode-textmate@npm:^10.0.2":
+ version: 10.0.2
+ resolution: "@shikijs/vscode-textmate@npm:10.0.2"
+ checksum: 10c0/36b682d691088ec244de292dc8f91b808f95c89466af421cf84cbab92230f03c8348649c14b3251991b10ce632b0c715e416e992dd5f28ff3221dc2693fd9462
+ languageName: node
+ linkType: hard
+
"@sigstore/bundle@npm:^4.0.0":
version: 4.0.0
resolution: "@sigstore/bundle@npm:4.0.0"
@@ -2063,6 +2115,24 @@ __metadata:
languageName: node
linkType: hard
+"@types/hast@npm:^3.0.0, @types/hast@npm:^3.0.4":
+ version: 3.0.4
+ resolution: "@types/hast@npm:3.0.4"
+ dependencies:
+ "@types/unist": "npm:*"
+ checksum: 10c0/3249781a511b38f1d330fd1e3344eed3c4e7ea8eff82e835d35da78e637480d36fad37a78be5a7aed8465d237ad0446abc1150859d0fde395354ea634decf9f7
+ languageName: node
+ linkType: hard
+
+"@types/mdast@npm:^4.0.0":
+ version: 4.0.4
+ resolution: "@types/mdast@npm:4.0.4"
+ dependencies:
+ "@types/unist": "npm:*"
+ checksum: 10c0/84f403dbe582ee508fd9c7643ac781ad8597fcbfc9ccb8d4715a2c92e4545e5772cbd0dbdf18eda65789386d81b009967fdef01b24faf6640f817287f54d9c82
+ languageName: node
+ linkType: hard
+
"@types/node@npm:25.6.0":
version: 25.6.0
resolution: "@types/node@npm:25.6.0"
@@ -2104,6 +2174,13 @@ __metadata:
languageName: node
linkType: hard
+"@types/unist@npm:*, @types/unist@npm:^3.0.0":
+ version: 3.0.3
+ resolution: "@types/unist@npm:3.0.3"
+ checksum: 10c0/2b1e4adcab78388e088fcc3c0ae8700f76619dbcb4741d7d201f87e2cb346bfc29a89003cfea2d76c996e1061452e14fcd737e8b25aacf949c1f2d6b2bc3dd60
+ languageName: node
+ linkType: hard
+
"@typescript/native-preview-darwin-arm64@npm:7.0.0-dev.20260418.1":
version: 7.0.0-dev.20260418.1
resolution: "@typescript/native-preview-darwin-arm64@npm:7.0.0-dev.20260418.1"
@@ -2185,6 +2262,13 @@ __metadata:
languageName: node
linkType: hard
+"@ungap/structured-clone@npm:^1.0.0":
+ version: 1.3.0
+ resolution: "@ungap/structured-clone@npm:1.3.0"
+ checksum: 10c0/0fc3097c2540ada1fc340ee56d58d96b5b536a2a0dab6e3ec17d4bfc8c4c86db345f61a375a8185f9da96f01c69678f836a2b57eeaa9e4b8eeafd26428e57b0a
+ languageName: node
+ linkType: hard
+
"@vitest/expect@npm:4.1.4":
version: 4.1.4
resolution: "@vitest/expect@npm:4.1.4"
@@ -2281,6 +2365,7 @@ __metadata:
resolution: "@willbooster/monaco-react@workspace:."
dependencies:
"@playwright/test": "npm:1.59.1"
+ "@shikijs/monaco": "npm:4.0.2"
"@testing-library/dom": "npm:10.4.1"
"@testing-library/jest-dom": "npm:6.9.1"
"@testing-library/react": "npm:16.3.0"
@@ -2613,6 +2698,13 @@ __metadata:
languageName: node
linkType: hard
+"ccount@npm:^2.0.0":
+ version: 2.0.1
+ resolution: "ccount@npm:2.0.1"
+ checksum: 10c0/3939b1664390174484322bc3f45b798462e6c07ee6384cb3d645e0aa2f318502d174845198c1561930e1d431087f74cf1fe291ae9a4722821a9f4ba67e574350
+ languageName: node
+ linkType: hard
+
"chai@npm:^6.2.2":
version: 6.2.2
resolution: "chai@npm:6.2.2"
@@ -2655,6 +2747,20 @@ __metadata:
languageName: node
linkType: hard
+"character-entities-html4@npm:^2.0.0":
+ version: 2.1.0
+ resolution: "character-entities-html4@npm:2.1.0"
+ checksum: 10c0/fe61b553f083400c20c0b0fd65095df30a0b445d960f3bbf271536ae6c3ba676f39cb7af0b4bf2755812f08ab9b88f2feed68f9aebb73bb153f7a115fe5c6e40
+ languageName: node
+ linkType: hard
+
+"character-entities-legacy@npm:^3.0.0":
+ version: 3.0.0
+ resolution: "character-entities-legacy@npm:3.0.0"
+ checksum: 10c0/ec4b430af873661aa754a896a2b55af089b4e938d3d010fad5219299a6b6d32ab175142699ee250640678cd64bdecd6db3c9af0b8759ab7b155d970d84c4c7d1
+ languageName: node
+ linkType: hard
+
"chokidar@npm:^4.0.3":
version: 4.0.3
resolution: "chokidar@npm:4.0.3"
@@ -2791,6 +2897,13 @@ __metadata:
languageName: node
linkType: hard
+"comma-separated-tokens@npm:^2.0.0":
+ version: 2.0.3
+ resolution: "comma-separated-tokens@npm:2.0.3"
+ checksum: 10c0/91f90f1aae320f1755d6957ef0b864fe4f54737f3313bd95e0802686ee2ca38bff1dd381964d00ae5db42912dd1f4ae5c2709644e82706ffc6f6842a813cdd67
+ languageName: node
+ linkType: hard
+
"commander@npm:^4.0.0":
version: 4.1.1
resolution: "commander@npm:4.1.1"
@@ -3018,7 +3131,7 @@ __metadata:
languageName: node
linkType: hard
-"dequal@npm:^2.0.3":
+"dequal@npm:^2.0.0, dequal@npm:^2.0.3":
version: 2.0.3
resolution: "dequal@npm:2.0.3"
checksum: 10c0/f98860cdf58b64991ae10205137c0e97d384c3a4edc7f807603887b7c4b850af1224a33d88012009f150861cbee4fa2d322c4cc04b9313bee312e47f6ecaa888
@@ -3046,6 +3159,15 @@ __metadata:
languageName: node
linkType: hard
+"devlop@npm:^1.0.0":
+ version: 1.1.0
+ resolution: "devlop@npm:1.1.0"
+ dependencies:
+ dequal: "npm:^2.0.0"
+ checksum: 10c0/e0928ab8f94c59417a2b8389c45c55ce0a02d9ac7fd74ef62d01ba48060129e1d594501b77de01f3eeafc7cb00773819b0df74d96251cf20b31c5b3071f45c0e
+ languageName: node
+ linkType: hard
+
"diff@npm:^8.0.2":
version: 8.0.4
resolution: "diff@npm:8.0.4"
@@ -3632,6 +3754,34 @@ __metadata:
languageName: node
linkType: hard
+"hast-util-to-html@npm:^9.0.5":
+ version: 9.0.5
+ resolution: "hast-util-to-html@npm:9.0.5"
+ dependencies:
+ "@types/hast": "npm:^3.0.0"
+ "@types/unist": "npm:^3.0.0"
+ ccount: "npm:^2.0.0"
+ comma-separated-tokens: "npm:^2.0.0"
+ hast-util-whitespace: "npm:^3.0.0"
+ html-void-elements: "npm:^3.0.0"
+ mdast-util-to-hast: "npm:^13.0.0"
+ property-information: "npm:^7.0.0"
+ space-separated-tokens: "npm:^2.0.0"
+ stringify-entities: "npm:^4.0.0"
+ zwitch: "npm:^2.0.4"
+ checksum: 10c0/b7a08c30bab4371fc9b4a620965c40b270e5ae7a8e94cf885f43b21705179e28c8e43b39c72885d1647965fb3738654e6962eb8b58b0c2a84271655b4d748836
+ languageName: node
+ linkType: hard
+
+"hast-util-whitespace@npm:^3.0.0":
+ version: 3.0.0
+ resolution: "hast-util-whitespace@npm:3.0.0"
+ dependencies:
+ "@types/hast": "npm:^3.0.0"
+ checksum: 10c0/b898bc9fe27884b272580d15260b6bbdabe239973a147e97fa98c45fa0ffec967a481aaa42291ec34fb56530dc2d484d473d7e2bae79f39c83f3762307edfea8
+ languageName: node
+ linkType: hard
+
"highlight.js@npm:^10.7.1":
version: 10.7.3
resolution: "highlight.js@npm:10.7.3"
@@ -3673,6 +3823,13 @@ __metadata:
languageName: node
linkType: hard
+"html-void-elements@npm:^3.0.0":
+ version: 3.0.0
+ resolution: "html-void-elements@npm:3.0.0"
+ checksum: 10c0/a8b9ec5db23b7c8053876dad73a0336183e6162bf6d2677376d8b38d654fdc59ba74fdd12f8812688f7db6fad451210c91b300e472afc0909224e0a44c8610d2
+ languageName: node
+ linkType: hard
+
"http-cache-semantics@npm:^4.1.1":
version: 4.2.0
resolution: "http-cache-semantics@npm:4.2.0"
@@ -4619,6 +4776,23 @@ __metadata:
languageName: node
linkType: hard
+"mdast-util-to-hast@npm:^13.0.0":
+ version: 13.2.1
+ resolution: "mdast-util-to-hast@npm:13.2.1"
+ dependencies:
+ "@types/hast": "npm:^3.0.0"
+ "@types/mdast": "npm:^4.0.0"
+ "@ungap/structured-clone": "npm:^1.0.0"
+ devlop: "npm:^1.0.0"
+ micromark-util-sanitize-uri: "npm:^2.0.0"
+ trim-lines: "npm:^3.0.0"
+ unist-util-position: "npm:^5.0.0"
+ unist-util-visit: "npm:^5.0.0"
+ vfile: "npm:^6.0.0"
+ checksum: 10c0/3eeaf28a5e84e1e08e6d54a1a8a06c0fca88cb5d36f4cf8086f0177248d1ce6e4e751f4ad0da19a3dea1c6ea61bd80784acc3ae021e44ceeb21aa5413a375e43
+ languageName: node
+ linkType: hard
+
"mdn-data@npm:2.27.1":
version: 2.27.1
resolution: "mdn-data@npm:2.27.1"
@@ -4640,6 +4814,48 @@ __metadata:
languageName: node
linkType: hard
+"micromark-util-character@npm:^2.0.0":
+ version: 2.1.1
+ resolution: "micromark-util-character@npm:2.1.1"
+ dependencies:
+ micromark-util-symbol: "npm:^2.0.0"
+ micromark-util-types: "npm:^2.0.0"
+ checksum: 10c0/d3fe7a5e2c4060fc2a076f9ce699c82a2e87190a3946e1e5eea77f563869b504961f5668d9c9c014724db28ac32fa909070ea8b30c3a39bd0483cc6c04cc76a1
+ languageName: node
+ linkType: hard
+
+"micromark-util-encode@npm:^2.0.0":
+ version: 2.0.1
+ resolution: "micromark-util-encode@npm:2.0.1"
+ checksum: 10c0/b2b29f901093845da8a1bf997ea8b7f5e061ffdba85070dfe14b0197c48fda64ffcf82bfe53c90cf9dc185e69eef8c5d41cae3ba918b96bc279326921b59008a
+ languageName: node
+ linkType: hard
+
+"micromark-util-sanitize-uri@npm:^2.0.0":
+ version: 2.0.1
+ resolution: "micromark-util-sanitize-uri@npm:2.0.1"
+ dependencies:
+ micromark-util-character: "npm:^2.0.0"
+ micromark-util-encode: "npm:^2.0.0"
+ micromark-util-symbol: "npm:^2.0.0"
+ checksum: 10c0/60e92166e1870fd4f1961468c2651013ff760617342918e0e0c3c4e872433aa2e60c1e5a672bfe5d89dc98f742d6b33897585cf86ae002cda23e905a3c02527c
+ languageName: node
+ linkType: hard
+
+"micromark-util-symbol@npm:^2.0.0":
+ version: 2.0.1
+ resolution: "micromark-util-symbol@npm:2.0.1"
+ checksum: 10c0/f2d1b207771e573232436618e78c5e46cd4b5c560dd4a6d63863d58018abbf49cb96ec69f7007471e51434c60de3c9268ef2bf46852f26ff4aacd10f9da16fe9
+ languageName: node
+ linkType: hard
+
+"micromark-util-types@npm:^2.0.0":
+ version: 2.0.2
+ resolution: "micromark-util-types@npm:2.0.2"
+ checksum: 10c0/c8c15b96c858db781c4393f55feec10004bf7df95487636c9a9f7209e51002a5cca6a047c5d2a5dc669ff92da20e57aaa881e81a268d9ccadb647f9dce305298
+ languageName: node
+ linkType: hard
+
"micromatch@npm:^4.0.2":
version: 4.0.8
resolution: "micromatch@npm:4.0.8"
@@ -5803,6 +6019,13 @@ __metadata:
languageName: node
linkType: hard
+"property-information@npm:^7.0.0":
+ version: 7.1.0
+ resolution: "property-information@npm:7.1.0"
+ checksum: 10c0/e0fe22cff26103260ad0e82959229106563fa115a54c4d6c183f49d88054e489cc9f23452d3ad584179dc13a8b7b37411a5df873746b5e4086c865874bfa968e
+ languageName: node
+ linkType: hard
+
"proto-list@npm:~1.2.1":
version: 1.2.4
resolution: "proto-list@npm:1.2.4"
@@ -6453,6 +6676,13 @@ __metadata:
languageName: node
linkType: hard
+"space-separated-tokens@npm:^2.0.0":
+ version: 2.0.2
+ resolution: "space-separated-tokens@npm:2.0.2"
+ checksum: 10c0/6173e1d903dca41dcab6a2deed8b4caf61bd13b6d7af8374713500570aa929ff9414ae09a0519f4f8772df993300305a395d4871f35bc4ca72b6db57e1f30af8
+ languageName: node
+ linkType: hard
+
"spawn-error-forwarder@npm:~1.0.0":
version: 1.0.0
resolution: "spawn-error-forwarder@npm:1.0.0"
@@ -6577,6 +6807,16 @@ __metadata:
languageName: node
linkType: hard
+"stringify-entities@npm:^4.0.0":
+ version: 4.0.4
+ resolution: "stringify-entities@npm:4.0.4"
+ dependencies:
+ character-entities-html4: "npm:^2.0.0"
+ character-entities-legacy: "npm:^3.0.0"
+ checksum: 10c0/537c7e656354192406bdd08157d759cd615724e9d0873602d2c9b2f6a5c0a8d0b1d73a0a08677848105c5eebac6db037b57c0b3a4ec86331117fa7319ed50448
+ languageName: node
+ linkType: hard
+
"strip-ansi@npm:^6.0.0, strip-ansi@npm:^6.0.1":
version: 6.0.1
resolution: "strip-ansi@npm:6.0.1"
@@ -6931,6 +7171,13 @@ __metadata:
languageName: node
linkType: hard
+"trim-lines@npm:^3.0.0":
+ version: 3.0.1
+ resolution: "trim-lines@npm:3.0.1"
+ checksum: 10c0/3a1611fa9e52aa56a94c69951a9ea15b8aaad760eaa26c56a65330dc8adf99cb282fc07cc9d94968b7d4d88003beba220a7278bbe2063328eb23fb56f9509e94
+ languageName: node
+ linkType: hard
+
"ts-interface-checker@npm:^0.1.9":
version: 0.1.13
resolution: "ts-interface-checker@npm:0.1.13"
@@ -7129,6 +7376,54 @@ __metadata:
languageName: node
linkType: hard
+"unist-util-is@npm:^6.0.0":
+ version: 6.0.1
+ resolution: "unist-util-is@npm:6.0.1"
+ dependencies:
+ "@types/unist": "npm:^3.0.0"
+ checksum: 10c0/5a487d390193811d37a68264e204dbc7c15c40b8fc29b5515a535d921d071134f571d7b5cbd59bcd58d5ce1c0ab08f20fc4a1f0df2287a249c979267fc32ce06
+ languageName: node
+ linkType: hard
+
+"unist-util-position@npm:^5.0.0":
+ version: 5.0.0
+ resolution: "unist-util-position@npm:5.0.0"
+ dependencies:
+ "@types/unist": "npm:^3.0.0"
+ checksum: 10c0/dde3b31e314c98f12b4dc6402f9722b2bf35e96a4f2d463233dd90d7cde2d4928074a7a11eff0a5eb1f4e200f27fc1557e0a64a7e8e4da6558542f251b1b7400
+ languageName: node
+ linkType: hard
+
+"unist-util-stringify-position@npm:^4.0.0":
+ version: 4.0.0
+ resolution: "unist-util-stringify-position@npm:4.0.0"
+ dependencies:
+ "@types/unist": "npm:^3.0.0"
+ checksum: 10c0/dfe1dbe79ba31f589108cb35e523f14029b6675d741a79dea7e5f3d098785045d556d5650ec6a8338af11e9e78d2a30df12b1ee86529cded1098da3f17ee999e
+ languageName: node
+ linkType: hard
+
+"unist-util-visit-parents@npm:^6.0.0":
+ version: 6.0.2
+ resolution: "unist-util-visit-parents@npm:6.0.2"
+ dependencies:
+ "@types/unist": "npm:^3.0.0"
+ unist-util-is: "npm:^6.0.0"
+ checksum: 10c0/f1e4019dbd930301825895e3737b1ee0cd682f7622ddd915062135cbb39f8c090aaece3a3b5eae1f2ea52ec33f0931abb8f8a8b5c48a511a4203e3d360a8cd49
+ languageName: node
+ linkType: hard
+
+"unist-util-visit@npm:^5.0.0":
+ version: 5.1.0
+ resolution: "unist-util-visit@npm:5.1.0"
+ dependencies:
+ "@types/unist": "npm:^3.0.0"
+ unist-util-is: "npm:^6.0.0"
+ unist-util-visit-parents: "npm:^6.0.0"
+ checksum: 10c0/a56e1bbbf63fcb55abe379e660b9a3367787e8be1e2473bdb7e86cfa6f32b6c1fa0092432d7040b8a30b2fc674bbbe024ffe6d03c3d6bf4839b064f584463a4e
+ languageName: node
+ linkType: hard
+
"universal-user-agent@npm:^7.0.0, universal-user-agent@npm:^7.0.2":
version: 7.0.3
resolution: "universal-user-agent@npm:7.0.3"
@@ -7174,6 +7469,26 @@ __metadata:
languageName: node
linkType: hard
+"vfile-message@npm:^4.0.0":
+ version: 4.0.3
+ resolution: "vfile-message@npm:4.0.3"
+ dependencies:
+ "@types/unist": "npm:^3.0.0"
+ unist-util-stringify-position: "npm:^4.0.0"
+ checksum: 10c0/33d9f219610d27987689bb14fa5573d2daa146941d1a05416dd7702c4215b23f44ed81d059e70d0e4e24f9a57d5f4dc9f18d35a993f04cf9446a7abe6d72d0c0
+ languageName: node
+ linkType: hard
+
+"vfile@npm:^6.0.0":
+ version: 6.0.3
+ resolution: "vfile@npm:6.0.3"
+ dependencies:
+ "@types/unist": "npm:^3.0.0"
+ vfile-message: "npm:^4.0.0"
+ checksum: 10c0/e5d9eb4810623f23758cfc2205323e33552fb5972e5c2e6587babe08fe4d24859866277404fb9e2a20afb71013860d96ec806cb257536ae463c87d70022ab9ef
+ languageName: node
+ linkType: hard
+
"vite@npm:^6.0.0 || ^7.0.0 || ^8.0.0":
version: 8.0.8
resolution: "vite@npm:8.0.8"
@@ -7528,3 +7843,10 @@ __metadata:
checksum: 10c0/b220f30f53ebc2167330c3adc86a3c7f158bcba0236f6c67e25644c3188e2571a6014ffc1321943bb619460259d3d27eb4c9cc58c2d884c1b195805883ec7066
languageName: node
linkType: hard
+
+"zwitch@npm:^2.0.4":
+ version: 2.0.4
+ resolution: "zwitch@npm:2.0.4"
+ checksum: 10c0/3c7830cdd3378667e058ffdb4cf2bb78ac5711214e2725900873accb23f3dfe5f9e7e5a06dcdc5f29605da976fc45c26d9a13ca334d6eea2245a15e77b8fc06e
+ languageName: node
+ linkType: hard