A CodeMirror extension that leverages AI to perform localized text modifications and continuations.

Demo

• Guide AI to edit your content
• Customizable LLM invocation
• Customizable styles
• Shortcut key triggered

• Auto-completion
• Grammar and spelling correction
• Tone adjustment
• Text length adjustment
• Answer questions based on the context

npm i @yuri2/codemirror-ai-enhancer

import "@yuri2/codemirror-ai-enhancer/styles.css";
import CodeMirror from "@uiw/react-codemirror";
import { aiEnhancer } from "@yuri2/codemirror-ai-enhancer";
import { aiEnhancerConfig } from "./aiEnhancerConfig";

export default function MyCodemirror() {
  return <CodeMirror extensions={[aiEnhancer(aiEnhancerConfig)]} />;
}

See aiEnhancerConfig.ts for more details.

import "@yuri2/codemirror-ai-enhancer/styles.css";

Or, you can customize the styles by yourself.

.cm-enhancer-inline-suggestion {
  opacity: 0.5;
}
.cm-enhancer-inline-answer {
  opacity: 0.5;
}
.cm-enhancer-composer-command input,
.cm-enhancer-assistant-command input {
  outline: none;
  background-color: transparent;
  opacity: 0.5;
  width: 100%;
}

In one terminal, build the library itself by running:

cd packages/codemirror-ai-enhancer
npm ci
npm run build

In another terminal, run the demo website:

cd website
npm ci
npm run dev

• Removed unnecessary dependencies(React 18) in the library.
• Applied patch to fix the "react2shell" vulnerablility in the demo website.
• Some other minor changes in the demo website.

• Ensure that the extension prevents MOD + J/K/L from propagating.

• Initial release

Inspired by codemirror-copilot.

MIT