@coldsmirk/inkstone-react 0.8.2

package/dist/index.js

@@ -0,0 +1,515 @@
+import { catppuccinLatte, catppuccinMacchiato } from "@catppuccin/codemirror";
+import { flavors } from "@catppuccin/palette";
+import { indentUnit } from "@codemirror/language";
+import { EditorState, Prec } from "@codemirror/state";
+import { EditorView } from "@codemirror/view";
+import { ControlledEditorHost, codeMirrorLanguages, documentExtensions, loadLanguage, normalizeContext, normalizeContext as normalizeContext$1, searchPhrasesZhCn, searchPhrasesZhCn as searchPhrasesZhCn$1, setMinijinjaContext } from "@coldsmirk/inkstone-codemirror";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { getHighlighter, shikiThemeId } from "@coldsmirk/inkstone-core";
+import { ensureMonacoHost } from "@coldsmirk/inkstone-monaco";
+import { Editor, loader } from "@monaco-editor/react";
+import { shikiToMonaco } from "@shikijs/monaco";
+//#region src/codemirror-editor.tsx
+function toCssSize(value) {
+	if (value === void 0) return;
+	return typeof value === "number" ? `${value}px` : value;
+}
+function alphaOf(color, alphaValue) {
+	return `rgba(${color.rgb.r}, ${color.rgb.g}, ${color.rgb.b}, ${alphaValue})`;
+}
+function completionIconMask(body) {
+	const svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">${body}</svg>`;
+	return `url("data:image/svg+xml,${encodeURIComponent(svg)}")`;
+}
+const COMPLETION_ICON_FALLBACK = completionIconMask("<circle cx=\"8\" cy=\"8\" r=\"2.5\"/>");
+const COMPLETION_ICONS = {
+	keyword: completionIconMask("<path d=\"M5.5 5 2.5 8l3 3\"/><path d=\"m10.5 5 3 3-3 3\"/>"),
+	function: completionIconMask("<path d=\"M10.8 3.4c-2-.4-2.9.7-3.2 2.5L6.4 12c-.3 1.7-1.2 2.2-2.6 1.8\"/><path d=\"M4.6 7.5h5\"/>"),
+	method: completionIconMask("<path d=\"M10.8 3.4c-2-.4-2.9.7-3.2 2.5L6.4 12c-.3 1.7-1.2 2.2-2.6 1.8\"/><path d=\"M4.6 7.5h5\"/>"),
+	variable: completionIconMask("<path d=\"M4 5c2.2 0 5.3 6 8 6\"/><path d=\"M12 5c-2.7 0-5.8 6-8 6\"/>"),
+	constant: completionIconMask("<path d=\"M3.5 5.2h9\"/><path d=\"M6.2 5.2v6.3\"/><path d=\"M10.2 5.2v4.4c0 1.3.6 1.9 1.7 1.9\"/>"),
+	property: completionIconMask("<circle cx=\"4.9\" cy=\"11.1\" r=\"1.8\"/><circle cx=\"11.1\" cy=\"4.9\" r=\"1.8\"/><path d=\"M6.4 9.6l3.2-3.2\"/>"),
+	class: completionIconMask("<rect x=\"3.5\" y=\"3.5\" width=\"9\" height=\"9\" rx=\"2.2\"/>"),
+	interface: completionIconMask("<circle cx=\"8\" cy=\"8\" r=\"4.5\"/>"),
+	type: completionIconMask("<path d=\"M4 4.5h8\"/><path d=\"M8 4.5V12\"/>"),
+	enum: completionIconMask("<path d=\"M6.5 4.5h6\"/><path d=\"M6.5 8h6\"/><path d=\"M6.5 11.5h6\"/><path d=\"M3.4 4.5h.01\"/><path d=\"M3.4 8h.01\"/><path d=\"M3.4 11.5h.01\"/>"),
+	namespace: completionIconMask("<path d=\"M6.2 3.5c-1.3 0-1.9.6-1.9 1.9v1.2c0 .9-.4 1.4-1.3 1.4.9 0 1.3.5 1.3 1.4v1.2c0 1.3.6 1.9 1.9 1.9\"/><path d=\"M9.8 3.5c1.3 0 1.9.6 1.9 1.9v1.2c0 .9.4 1.4 1.3 1.4-.9 0-1.3.5-1.3 1.4v1.2c0 1.3-.6 1.9-1.9 1.9\"/>"),
+	text: completionIconMask("<path d=\"M3.5 5h9\"/><path d=\"M3.5 8h9\"/><path d=\"M3.5 11h5.5\"/>")
+};
+function completionIconRules() {
+	const rules = {};
+	for (const [kind, mask] of Object.entries(COMPLETION_ICONS)) rules[`.cm-completionIcon-${kind}:after`] = {
+		maskImage: mask,
+		WebkitMaskImage: mask
+	};
+	return rules;
+}
+function chromeTheme(dark) {
+	const { colors } = dark ? flavors.macchiato : flavors.latte;
+	const hairline = `1px solid ${alphaOf(colors.overlay0, .35)}`;
+	const frame = {
+		border: hairline,
+		borderRadius: "8px",
+		boxShadow: dark ? "0 8px 24px rgba(0, 0, 0, 0.5)" : "0 8px 24px rgba(0, 0, 0, 0.12)"
+	};
+	return EditorView.theme({
+		"&": { colorScheme: dark ? "dark" : "light" },
+		".cm-tooltip.cm-tooltip-autocomplete": {
+			...frame,
+			"& > ul": {
+				borderRadius: "7px",
+				padding: "4px",
+				maxHeight: "16em"
+			},
+			"& > ul > li": {
+				display: "flex",
+				alignItems: "center",
+				padding: "3px 8px",
+				borderRadius: "5px",
+				lineHeight: "1.45"
+			}
+		},
+		".cm-completionLabel": {
+			minWidth: "0",
+			overflow: "hidden",
+			textOverflow: "ellipsis"
+		},
+		".cm-completionMatchedText": {
+			textDecoration: "none",
+			fontWeight: "600",
+			color: colors.blue.hex
+		},
+		".cm-completionDetail": {
+			marginLeft: "auto",
+			paddingLeft: "12px",
+			fontStyle: "normal",
+			fontSize: "85%",
+			color: colors.overlay1.hex
+		},
+		".cm-completionIcon": {
+			width: "14px",
+			paddingRight: "8px",
+			opacity: "1",
+			color: colors.overlay1.hex
+		},
+		".cm-completionIcon:after": {
+			content: "''",
+			display: "block",
+			width: "12px",
+			height: "12px",
+			backgroundColor: "currentColor",
+			maskImage: COMPLETION_ICON_FALLBACK,
+			WebkitMaskImage: COMPLETION_ICON_FALLBACK,
+			maskRepeat: "no-repeat",
+			WebkitMaskRepeat: "no-repeat",
+			maskPosition: "center",
+			WebkitMaskPosition: "center",
+			maskSize: "contain",
+			WebkitMaskSize: "contain"
+		},
+		...completionIconRules(),
+		".cm-completionIcon-keyword": { color: colors.mauve.hex },
+		".cm-completionIcon-function, .cm-completionIcon-method": { color: colors.blue.hex },
+		".cm-completionIcon-variable": { color: colors.peach.hex },
+		".cm-completionIcon-constant": { color: colors.sky.hex },
+		".cm-completionIcon-property": { color: colors.teal.hex },
+		".cm-completionIcon-namespace": { color: colors.sapphire.hex },
+		".cm-completionIcon-text": { color: colors.overlay1.hex },
+		".cm-completionIcon-class, .cm-completionIcon-type, .cm-completionIcon-interface, .cm-completionIcon-enum": { color: colors.yellow.hex },
+		".cm-tooltip.cm-completionInfo": {
+			...frame,
+			padding: "8px 10px",
+			maxWidth: "26em"
+		},
+		"&.cm-focused": { outline: "none" },
+		".cm-activeLine": { backgroundColor: alphaOf(colors.overlay0, .12) },
+		".cm-activeLineGutter": { backgroundColor: alphaOf(colors.overlay0, .12) },
+		"&.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground": { backgroundColor: alphaOf(colors.blue, dark ? .35 : .25) },
+		".cm-selectionBackground": { backgroundColor: alphaOf(colors.blue, dark ? .2 : .14) },
+		".cm-content ::selection": { backgroundColor: alphaOf(colors.blue, dark ? .35 : .25) },
+		".cm-scroller, .cm-tooltip-autocomplete > ul, .cm-tooltip.cm-completionInfo": {
+			scrollbarWidth: "thin",
+			scrollbarColor: `${alphaOf(colors.overlay0, .55)} transparent`
+		},
+		".cm-panels.cm-panels-top": { borderBottom: hairline },
+		".cm-panels.cm-panels-bottom": { borderTop: hairline },
+		".cm-panel.cm-search, .cm-panel.cm-gotoLine": {
+			position: "relative",
+			display: "flex",
+			flexWrap: "wrap",
+			alignItems: "center",
+			columnGap: "8px",
+			rowGap: "8px",
+			margin: "0",
+			padding: "10px 44px 10px 14px"
+		},
+		".cm-panel.cm-search br": {
+			flexBasis: "100%",
+			height: "0",
+			margin: "0",
+			border: "none"
+		},
+		".cm-panel.cm-search label, .cm-panel.cm-gotoLine label": {
+			display: "inline-flex",
+			alignItems: "center",
+			gap: "6px",
+			margin: "0",
+			fontSize: "12.5px",
+			color: colors.subtext0.hex,
+			cursor: "pointer",
+			userSelect: "none"
+		},
+		".cm-panel.cm-search input[type=checkbox]": {
+			margin: "0",
+			width: "14px",
+			height: "14px",
+			accentColor: colors.blue.hex
+		},
+		".cm-panel.cm-search button[name=close]": {
+			position: "absolute",
+			top: "10px",
+			right: "10px",
+			boxSizing: "border-box",
+			width: "28px",
+			height: "28px",
+			padding: "0",
+			display: "inline-flex",
+			alignItems: "center",
+			justifyContent: "center",
+			fontSize: "16px",
+			lineHeight: "1",
+			color: colors.overlay1.hex,
+			background: "transparent",
+			border: "none",
+			borderRadius: "6px",
+			cursor: "pointer"
+		},
+		".cm-panel.cm-search button[name=close]:hover": {
+			backgroundColor: colors.surface0.hex,
+			color: colors.text.hex
+		},
+		".cm-panel .cm-textfield": {
+			boxSizing: "border-box",
+			height: "28px",
+			width: "240px",
+			maxWidth: "100%",
+			margin: "0",
+			padding: "0 10px",
+			fontSize: "12.5px",
+			color: colors.text.hex,
+			backgroundColor: colors.base.hex,
+			border: hairline,
+			borderRadius: "6px"
+		},
+		".cm-panel .cm-textfield:focus": {
+			outline: "none",
+			borderColor: alphaOf(colors.blue, .6),
+			boxShadow: `0 0 0 2px ${alphaOf(colors.blue, .2)}`
+		},
+		".cm-panel .cm-button": {
+			boxSizing: "border-box",
+			height: "28px",
+			margin: "0",
+			padding: "0 12px",
+			fontSize: "12.5px",
+			color: colors.text.hex,
+			backgroundImage: "none",
+			backgroundColor: colors.surface0.hex,
+			border: hairline,
+			borderRadius: "6px",
+			cursor: "pointer"
+		},
+		".cm-panel .cm-button:hover": { backgroundColor: colors.surface1.hex },
+		".cm-panel .cm-button:active": {
+			backgroundImage: "none",
+			backgroundColor: colors.surface1.hex
+		}
+	}, { dark });
+}
+function defaultThemeExtensions(dark, height, width, fontSize, lineHeight) {
+	const extensions = [Prec.low(chromeTheme(dark)), Prec.low(dark ? catppuccinMacchiato : catppuccinLatte)];
+	const cssHeight = toCssSize(height);
+	const cssWidth = toCssSize(width);
+	if (cssHeight !== void 0 || cssWidth !== void 0 || fontSize !== void 0 || lineHeight !== void 0) {
+		const root = {};
+		if (cssHeight !== void 0) root.height = cssHeight;
+		if (cssWidth !== void 0) root.width = cssWidth;
+		if (fontSize !== void 0) root.fontSize = `${fontSize}px`;
+		const spec = { "&": root };
+		const scroller = {};
+		if (cssHeight !== void 0) scroller.overflow = "auto";
+		if (lineHeight !== void 0) scroller.lineHeight = lineHeight < 8 ? String(lineHeight) : `${lineHeight}px`;
+		if (Object.keys(scroller).length > 0) spec[".cm-scroller"] = scroller;
+		extensions.push(EditorView.theme(spec));
+	}
+	return extensions;
+}
+function CodeMirrorEditor({ value, onChange, language, context, placeholder, lineWrapping = false, showLineNumbers = false, folding = false, spellcheck = false, search = false, extensions, dynamicExtensions, dark = false, locale = "en", height, width, fontSize = 14, lineHeight = 1.6, tabSize, className, onMount, onFocus, onBlur }) {
+	const containerRef = useRef(null);
+	const hostRef = useRef(null);
+	const onChangeRef = useRef(onChange);
+	onChangeRef.current = onChange;
+	const onMountRef = useRef(onMount);
+	onMountRef.current = onMount;
+	const onFocusRef = useRef(onFocus);
+	onFocusRef.current = onFocus;
+	const onBlurRef = useRef(onBlur);
+	onBlurRef.current = onBlur;
+	const lastContextRef = useRef(null);
+	const [languageExtension, setLanguageExtension] = useState([]);
+	useEffect(() => {
+		if (!language) {
+			setLanguageExtension([]);
+			return;
+		}
+		let cancelled = false;
+		loadLanguage(language).then((extension) => {
+			if (!cancelled) setLanguageExtension([extension]);
+		}).catch((error) => {
+			console.error("inkstone: failed to load CodeMirror language", language, error);
+		});
+		return () => {
+			cancelled = true;
+		};
+	}, [language]);
+	const dynamic = useMemo(() => [
+		...defaultThemeExtensions(dark, height, width, fontSize, lineHeight),
+		...tabSize === void 0 ? [] : [EditorState.tabSize.of(tabSize), indentUnit.of(" ".repeat(tabSize))],
+		...locale === "zh-cn" ? [searchPhrasesZhCn$1] : [],
+		...languageExtension,
+		...dynamicExtensions ?? []
+	], [
+		dark,
+		height,
+		width,
+		fontSize,
+		lineHeight,
+		tabSize,
+		locale,
+		languageExtension,
+		dynamicExtensions
+	]);
+	const contextSchema = useMemo(() => context ? normalizeContext$1(context) : null, [context]);
+	useEffect(() => {
+		const container = containerRef.current;
+		if (!container) return;
+		const host = new ControlledEditorHost({
+			parent: container,
+			doc: value,
+			onChange: (next) => onChangeRef.current?.(next),
+			extensions: [
+				...documentExtensions({
+					placeholder,
+					lineWrapping,
+					showLineNumbers,
+					folding,
+					spellcheck,
+					search
+				}),
+				EditorView.updateListener.of((update) => {
+					if (update.focusChanged) if (update.view.hasFocus) onFocusRef.current?.();
+					else onBlurRef.current?.();
+				}),
+				...extensions ?? []
+			],
+			dynamicExtensions: dynamic
+		});
+		hostRef.current = host;
+		onMountRef.current?.(host.view);
+		return () => {
+			host.destroy();
+			hostRef.current = null;
+		};
+	}, []);
+	useEffect(() => {
+		hostRef.current?.setValue(value);
+	}, [value]);
+	useEffect(() => {
+		hostRef.current?.reconfigure(dynamic);
+	}, [dynamic]);
+	useEffect(() => {
+		const host = hostRef.current;
+		if (!host) return;
+		const key = contextSchema ? JSON.stringify(contextSchema) : "";
+		const last = lastContextRef.current;
+		if (last && last.key === key && last.language === languageExtension) return;
+		lastContextRef.current = {
+			key,
+			language: languageExtension
+		};
+		if (key === "" && (!last || last.key === "")) return;
+		host.view.dispatch({ effects: setMinijinjaContext.of(contextSchema) });
+	}, [contextSchema, languageExtension]);
+	return /* @__PURE__ */ jsx("div", {
+		ref: containerRef,
+		className
+	});
+}
+//#endregion
+//#region src/use-shiki-highlighter.ts
+function useShikiHighlighter() {
+	const [state, setState] = useState("loading");
+	const highlighterRef = useRef(null);
+	useEffect(() => {
+		let cancelled = false;
+		getHighlighter().then((highlighter) => {
+			if (cancelled) return;
+			highlighterRef.current = highlighter;
+			setState("ready");
+		}).catch((error) => {
+			console.error("inkstone: shiki highlighter failed to load", error);
+			if (!cancelled) setState("failed");
+		});
+		return () => {
+			cancelled = true;
+		};
+	}, []);
+	return {
+		state,
+		highlighterRef
+	};
+}
+//#endregion
+//#region src/monaco-editor.tsx
+const DEFAULT_MONACO_OPTIONS = {
+	find: { addExtraSpaceOnTop: false },
+	minimap: { enabled: false },
+	fontSize: 14,
+	lineHeight: 1.6,
+	fontFamily: "var(--inkstone-font-family-code, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace)",
+	scrollBeyondLastLine: false,
+	automaticLayout: true,
+	renderLineHighlight: "line",
+	smoothScrolling: true,
+	padding: {
+		top: 12,
+		bottom: 12
+	},
+	fixedOverflowWidgets: true,
+	quickSuggestions: {
+		other: true,
+		comments: false,
+		strings: true
+	},
+	wordBasedSuggestions: "off",
+	tabCompletion: "on",
+	scrollbar: {
+		alwaysConsumeMouseWheel: false,
+		verticalScrollbarSize: 8,
+		horizontalScrollbarSize: 8
+	}
+};
+function documentOptions({ placeholder, lineWrapping, showLineNumbers, folding, disableContextMenu, fontSize, lineHeight, tabSize }) {
+	const resolved = {
+		placeholder,
+		wordWrap: lineWrapping ? "on" : "off",
+		lineNumbers: showLineNumbers ? "on" : "off",
+		folding,
+		contextmenu: !disableContextMenu
+	};
+	if (fontSize !== void 0) resolved.fontSize = fontSize;
+	if (lineHeight !== void 0) resolved.lineHeight = lineHeight;
+	if (tabSize !== void 0) resolved.tabSize = tabSize;
+	return resolved;
+}
+let loaderConfigured = false;
+function configureLoader(monaco) {
+	if (loaderConfigured) return;
+	loaderConfigured = true;
+	loader.config({ monaco });
+}
+const DISABLED_KEYBINDINGS_CONTEXT_KEY = "inkstoneKeybindingsDisabled";
+function disabledKeybindings(monaco, disableFind, disableCommandPalette) {
+	const { KeyCode, KeyMod } = monaco;
+	return [...disableFind ? [
+		KeyMod.CtrlCmd | KeyCode.KeyF,
+		KeyMod.CtrlCmd | KeyCode.KeyH,
+		KeyMod.CtrlCmd | KeyMod.Alt | KeyCode.KeyF
+	] : [], ...disableCommandPalette ? [KeyCode.F1] : []];
+}
+let shikiRegistered = false;
+function registerShikiHighlighting(monaco, highlighter) {
+	if (shikiRegistered) return;
+	shikiRegistered = true;
+	const canonical = new Set(highlighter.getLoadedLanguages().map((id) => highlighter.getLanguage(id).name));
+	const registered = new Set(monaco.languages.getLanguages().map((registeredLanguage) => registeredLanguage.id));
+	for (const lang of canonical) if (!registered.has(lang)) monaco.languages.register({ id: lang });
+	shikiToMonaco(highlighter, monaco);
+}
+function MonacoEditor({ value, onChange, language = "javascript", dark = false, locale, placeholder, lineWrapping = false, showLineNumbers = false, folding = false, disableContextMenu = false, disableFind = false, disableCommandPalette = false, fontSize, lineHeight, tabSize = 2, path, height = "100%", width, className, options, hostOptions, loading = "Loading editor…", failure = "Editor failed to load", beforeMount, onMount, onFocus, onBlur }) {
+	const [hostState, setHostState] = useState("loading");
+	const { state: shikiState, highlighterRef } = useShikiHighlighter();
+	const hostOptionsRef = useRef(hostOptions);
+	const localeRef = useRef(locale);
+	const beforeMountRef = useRef(beforeMount);
+	beforeMountRef.current = beforeMount;
+	const onMountRef = useRef(onMount);
+	onMountRef.current = onMount;
+	const onFocusRef = useRef(onFocus);
+	onFocusRef.current = onFocus;
+	const onBlurRef = useRef(onBlur);
+	onBlurRef.current = onBlur;
+	useEffect(() => {
+		let cancelled = false;
+		ensureMonacoHost({
+			...hostOptionsRef.current,
+			locale: localeRef.current ?? hostOptionsRef.current?.locale
+		}).then((monaco) => {
+			configureLoader(monaco);
+			if (!cancelled) setHostState("ready");
+		}).catch((error) => {
+			console.error("inkstone: monaco host failed to load", error);
+			if (!cancelled) setHostState("failed");
+		});
+		return () => {
+			cancelled = true;
+		};
+	}, []);
+	if (hostState === "failed") return failure;
+	if (hostState === "loading" || shikiState === "loading") return loading;
+	const handleBeforeMount = (monaco) => {
+		const highlighter = highlighterRef.current;
+		if (highlighter) registerShikiHighlighting(monaco, highlighter);
+		beforeMountRef.current?.(monaco);
+	};
+	const handleMount = (editorInstance, monaco) => {
+		const swallowed = disabledKeybindings(monaco, disableFind, disableCommandPalette);
+		if (swallowed.length > 0) {
+			editorInstance.createContextKey(DISABLED_KEYBINDINGS_CONTEXT_KEY, true);
+			for (const keybinding of swallowed) editorInstance.addCommand(keybinding, () => void 0, DISABLED_KEYBINDINGS_CONTEXT_KEY);
+		}
+		editorInstance.onDidFocusEditorText(() => onFocusRef.current?.());
+		editorInstance.onDidBlurEditorText(() => onBlurRef.current?.());
+		onMountRef.current?.(editorInstance, monaco);
+	};
+	return /* @__PURE__ */ jsx(Editor, {
+		beforeMount: handleBeforeMount,
+		className,
+		height,
+		language,
+		loading,
+		path,
+		theme: shikiState === "ready" ? shikiThemeId(dark) : dark ? "vs-dark" : "vs",
+		value,
+		width,
+		options: {
+			...DEFAULT_MONACO_OPTIONS,
+			...documentOptions({
+				placeholder,
+				lineWrapping,
+				showLineNumbers,
+				folding,
+				disableContextMenu,
+				fontSize,
+				lineHeight,
+				tabSize
+			}),
+			...options
+		},
+		onChange: (next) => onChange?.(next ?? ""),
+		onMount: handleMount
+	});
+}
+//#endregion
+export { CodeMirrorEditor, DEFAULT_MONACO_OPTIONS, MonacoEditor, codeMirrorLanguages, normalizeContext, searchPhrasesZhCn, useShikiHighlighter };

package/package.json

@@ -0,0 +1,86 @@
+{
+  "name": "@coldsmirk/inkstone-react",
+  "version": "0.8.2",
+  "description": "Drop-in React code editors: a preconfigured Monaco <MonacoEditor> (offline workers, Shiki catppuccin themes, dark switching, opt-in zh-CN UI) and a controlled CodeMirror 6 <CodeMirrorEditor> (catppuccin themes, dark switching, sizing).",
+  "keywords": [
+    "react",
+    "monaco",
+    "codemirror",
+    "editor",
+    "shiki",
+    "code-editor"
+  ],
+  "homepage": "https://github.com/coldsmirk/inkstone/tree/main/packages/react#readme",
+  "bugs": "https://github.com/coldsmirk/inkstone/issues",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/coldsmirk/inkstone.git",
+    "directory": "packages/react"
+  },
+  "license": "UNLICENSED",
+  "author": {
+    "name": "Venus"
+  },
+  "sideEffects": false,
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    },
+    "./package.json": "./package.json"
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "@catppuccin/codemirror": "^1.0.1",
+    "@catppuccin/palette": "^1.8.0",
+    "@monaco-editor/react": "^4.7.0",
+    "@shikijs/monaco": "^4.3.1",
+    "@coldsmirk/inkstone-codemirror": "^0.8.2",
+    "@coldsmirk/inkstone-core": "^0.8.2",
+    "@coldsmirk/inkstone-monaco": "^0.8.2"
+  },
+  "devDependencies": {
+    "@codemirror/autocomplete": "^6.20.3",
+    "@codemirror/commands": "^6.10.4",
+    "@codemirror/language": "^6.12.3",
+    "@codemirror/search": "^6.6.0",
+    "@codemirror/state": "^6.6.0",
+    "@codemirror/view": "^6.43.0",
+    "monaco-editor": "^0.55.1",
+    "react": "^19.2.7",
+    "react-dom": "^19.2.7"
+  },
+  "peerDependencies": {
+    "@codemirror/autocomplete": "^6.20.3",
+    "@codemirror/commands": "^6.10.4",
+    "@codemirror/language": "^6.12.3",
+    "@codemirror/search": "^6.6.0",
+    "@codemirror/state": "^6.6.0",
+    "@codemirror/view": "^6.43.0",
+    "monaco-editor": "^0.55.1",
+    "react": ">=19"
+  },
+  "engines": {
+    "node": ">=22"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsdown",
+    "clean": "rimraf dist",
+    "typecheck": "tsc --noEmit"
+  }
+}