@skaldapp/milkdown-copilot 1.0.5 → 1.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +60 -64
  2. package/package.json +6 -6
package/README.md CHANGED
@@ -7,17 +7,17 @@
7
7
 
8
8
  ## Description
9
9
 
10
- `@skaldapp/milkdown-copilot` is a Milkdown plugin that provides AI-powered code completion suggestions directly within your Markdown editor. It integrates with Mistral AI's Codestral model to offer intelligent, context-aware completions as you type.
10
+ `@skaldapp/milkdown-copilot` is a Milkdown plugin that provides AI-powered code completion suggestions directly within your Markdown editor. It integrates with any OpenAI-compatible provider to offer intelligent, context-aware completions as you type.
11
11
 
12
12
  ## Features
13
13
 
14
- - 🤖 **AI-Powered Completions**: Get intelligent code suggestions powered by Mistral AI's Codestral model
15
- - ⚡ **Debounced Requests**: Automatic debouncing (1 second) to optimize API calls and performance
16
- - 📝 **Markdown Support**: Seamlessly works with Markdown syntax and Milkdown's editor state
17
- - 🎯 **Context-Aware**: Analyzes text before and after cursor for relevant completions
18
- - 🔌 **Easy Integration**: Simple plugin setup with Milkdown's plugin system
19
- - 💡 **Tab to Accept**: Press `Tab` to accept completion suggestions
20
- - 🔄 **Reactive**: Automatically updates suggestions based on editor changes
14
+ - 🤖 **AI-Powered Completions**: Get intelligent code suggestions powered by any OpenAI-compatible AI provider.
15
+ - ⚡ **Debounced Requests**: Automatic debouncing (1 second) to optimize API calls and performance.
16
+ - 📝 **Markdown Support**: Seamlessly works with Markdown syntax and Milkdown's editor state.
17
+ - 🎯 **Context-Aware**: Analyzes text before and after cursor for relevant completions.
18
+ - 🔌 **Easy Integration**: Simple plugin setup with Milkdown's plugin system.
19
+ - 💡 **Tab to Accept**: Press `Tab` to accept completion suggestions.
20
+ - 🔄 **Reactive**: Automatically updates suggestions based on editor changes.
21
21
 
22
22
  ## Installation
23
23
 
@@ -29,27 +29,31 @@ npm install @skaldapp/milkdown-copilot
29
29
 
30
30
  - Node.js >= 18
31
31
  - Milkdown >= 7.19.2
32
- - A valid Mistral AI API key
32
+ - A valid API key and Base URL for an OpenAI-compatible provider.
33
33
 
34
34
  ## Usage
35
35
 
36
36
  ### Basic Setup
37
37
 
38
38
  ```typescript
39
- import { Editor, rootCtx } from "@milkdown/kit/core";
39
+ import { Editor } from "@milkdown/kit/core";
40
40
  import {
41
41
  copilotPlugin,
42
42
  apiKeySlice,
43
+ baseURLSlice,
44
+ modelSlice,
43
45
  filenameSlice,
44
46
  } from "@skaldapp/milkdown-copilot";
45
47
 
46
48
  // Create Milkdown editor with copilot plugin
47
49
  const editor = new Editor()
48
50
  .config((ctx) => {
49
- ctx.set(apiKeySlice, "your-mistral-ai-api-key");
51
+ ctx.set(apiKeySlice, "your-api-key");
52
+ ctx.set(baseURLSlice, "https://api.your-provider.com/v1");
53
+ ctx.set(modelSlice, "your-model-name"); // e.g., "codestral", "gpt-4", "llama3"
50
54
  ctx.set(filenameSlice, "example.md");
51
55
  })
52
- .create();
56
+ .use(copilotPlugin);
53
57
 
54
58
  // Mount to DOM
55
59
  editor.mount(document.querySelector("#editor"));
@@ -57,42 +61,41 @@ editor.mount(document.querySelector("#editor"));
57
61
 
58
62
  ### Configuration Options
59
63
 
60
- The plugin uses two separate context slices for configuration:
64
+ The plugin uses context slices for configuration. You must provide the API key, base URL, and model name for the plugin to initialize.
61
65
 
62
- | Slice | Type | Description |
63
- | --------------- | -------- | ----------------------------------------------------- |
64
- | `apiKeySlice` | `string` | Your Mistral AI API key for authentication |
65
- | `filenameSlice` | `string` | Current filename (used for context-aware completions) |
66
+ | Slice | Type | Description |
67
+ | --------------- | -------- | ------------------------------------------------------------------------------------ |
68
+ | `apiKeySlice` | `string` | Your API key for authentication. |
69
+ | `baseURLSlice` | `string` | The base URL of your OpenAI-compatible provider (e.g., `https://api.openai.com/v1`). |
70
+ | `modelSlice` | `string` | The model ID to use for completions (e.g., `codestral`, `gpt-3.5-turbo`). |
71
+ | `endpointSlice` | `string` | _(Optional)_ The specific endpoint path. Defaults to `completions`. |
72
+ | `filenameSlice` | `string` | Current filename (used for context-aware completions). |
66
73
 
67
74
  ### Default Settings
68
75
 
69
- The plugin comes with sensible defaults:
76
+ The plugin comes with sensible defaults for the completion request parameters:
70
77
 
71
- | Setting | Value | Description |
72
- | ---------------- | ---------------------------------- | --------------------------------------- |
73
- | **Model** | `codestral` | Mistral's code-focused model |
74
- | **Provider** | `mistral` | AI provider |
75
- | **Language** | `markdown` | Target language for completions |
76
- | **Debounce** | `1000ms` | Delay before sending completion request |
77
- | **Technologies** | `['vue', 'tailwindcss', 'comark']` | Technology stack context |
78
+ | Setting | Value | Description |
79
+ | ---------------- | ---------------------------------- | -------------------------------------------- |
80
+ | **Model** | _Configurable_ | Set via `modelSlice`. |
81
+ | **Provider** | _Any_ | Any OpenAI-compatible API endpoint. |
82
+ | **Language** | `markdown` | Target language context for completions. |
83
+ | **Debounce** | `1000ms` | Delay before sending completion request. |
84
+ | **Technologies** | `['vue', 'tailwindcss', 'comark']` | Technology stack context provided to the AI. |
78
85
 
79
86
  ## How It Works
80
87
 
81
88
  1. **Trigger**: Completions are triggered on:
82
89
  - Single character input
83
90
  - Pressing `Enter` key
84
-
85
91
  2. **Context Collection**: The plugin gathers:
86
92
  - Text before cursor (serialized to Markdown)
87
93
  - Text after cursor (serialized to Markdown)
88
94
  - Current cursor position
89
95
  - Filename and language context
90
-
91
- 3. **AI Request**: Sends context to Mistral AI's Codestral model via `monacopilot`
92
-
93
- 4. **Display**: Completions appear as inline decorations (widgets) in a `<pre>` element
94
-
95
- 5. **Accept**: Press `Tab` to insert the completion at cursor position
96
+ 3. **AI Request**: Sends context via a standard HTTP POST request to the configured OpenAI-compatible provider endpoint.
97
+ 4. **Display**: Completions appear as inline decorations (widgets) in a `<pre>` element.
98
+ 5. **Accept**: Press `Tab` to insert the completion at cursor position.
96
99
 
97
100
  ### Trigger Conditions
98
101
 
@@ -111,22 +114,18 @@ The plugin comes with sensible defaults:
111
114
 
112
115
  The main Milkdown plugin array that provides AI completion functionality. It consists of:
113
116
 
114
- 1. A setup function that injects the required context slices
115
- 2. A ProseMirror plugin that handles completions
117
+ - A setup function that injects the required context slices.
118
+ - A ProseMirror plugin that handles completions, state management, and DOM events.
116
119
 
117
- #### `apiKeySlice`
120
+ #### Context Slices
118
121
 
119
- A Milkdown context slice for storing the API key:
122
+ Milkdown context slices for storing configuration:
120
123
 
121
124
  ```typescript
122
125
  export const apiKeySlice = createSlice("", "apiKey");
123
- ```
124
-
125
- #### `filenameSlice`
126
-
127
- A Milkdown context slice for storing the current filename:
128
-
129
- ```typescript
126
+ export const baseURLSlice = createSlice("", "baseURL");
127
+ export const modelSlice = createSlice("", "model");
128
+ export const endpointSlice = createSlice("", "endpoint");
130
129
  export const filenameSlice = createSlice("", "filename");
131
130
  ```
132
131
 
@@ -134,20 +133,21 @@ export const filenameSlice = createSlice("", "filename");
134
133
 
135
134
  The plugin uses a ProseMirror `Plugin` with:
136
135
 
137
- - **State**: Manages completion message and decoration set
136
+ - **State**: Manages completion message and decoration set.
138
137
  - **Props**:
139
- - `decorations`: Renders completion hints as widgets
140
- - `handleKeyDown`: Intercepts keyboard events for triggers
141
- - **Debouncing**: 1 second delay to prevent excessive API calls
138
+ - `decorations`: Renders completion hints as widgets.
139
+ - `handleKeyDown`: Intercepts keyboard events for triggers and acceptance.
140
+ - `handleDOMEvents`: Clears state on mouse interactions.
141
+ - **Debouncing**: 1-second delay to prevent excessive API calls.
142
142
 
143
143
  ## Dependencies
144
144
 
145
- | Package | Version | Purpose |
146
- | --------------- | ------- | ---------------------------- |
147
- | `@milkdown/ctx` | ^7.19.2 | Context management |
148
- | `@milkdown/kit` | ^7.19.2 | Core Milkdown editor |
149
- | `monacopilot` | ^1.2.12 | AI completion client |
150
- | `quasar` | ^2.19.1 | Utility functions (debounce) |
145
+ | Package | Version | Purpose |
146
+ | --------------- | ------- | ------------------------------- |
147
+ | `@milkdown/ctx` | ^7.19.2 | Context management |
148
+ | `@milkdown/kit` | ^7.19.2 | Core Milkdown editor |
149
+ | `monacopilot` | ^1.2.12 | AI completion client structures |
150
+ | `quasar` | ^2.19.1 | Utility functions (debounce) |
151
151
 
152
152
  ## Development
153
153
 
@@ -171,7 +171,7 @@ npm run lint
171
171
 
172
172
  ### Project Structure
173
173
 
174
- ```
174
+ ```text
175
175
  milkdown-copilot/
176
176
  ├── src/
177
177
  │ └── index.ts # Main plugin implementation
@@ -201,14 +201,15 @@ This project is licensed under the [AGPL-3.0-only License](LICENSE).
201
201
 
202
202
  ## Author
203
203
 
204
- **Jerry Bruwes**
205
- Email: [jbruwes@gmail.com](mailto:jbruwes@gmail.com)
206
- GitHub: [jbruwes](https://github.com/jbruwes)
204
+ **Jerry Bruwes**
205
+
206
+ - Email: [jbruwes@gmail.com](mailto:jbruwes@gmail.com)
207
+ - GitHub: [jbruwes](https://github.com/jbruwes)
207
208
 
208
209
  ## Repository
209
210
 
210
- - **GitHub**: [https://github.com/skaldapp/milkdown-copilot](https://github.com/skaldapp/milkdown-copilot)
211
- - **npm**: [https://www.npmjs.com/package/@skaldapp/milkdown-copilot](https://www.npmjs.com/package/@skaldapp/milkdown-copilot)
211
+ - GitHub: [https://github.com/skaldapp/milkdown-copilot](https://github.com/skaldapp/milkdown-copilot)
212
+ - npm: [https://www.npmjs.com/package/@skaldapp/milkdown-copilot](https://www.npmjs.com/package/@skaldapp/milkdown-copilot)
212
213
 
213
214
  ## Issues & Contributions
214
215
 
@@ -219,9 +220,4 @@ GitHub: [jbruwes](https://github.com/jbruwes)
219
220
 
220
221
  - [Milkdown](https://milkdown.dev/) - A plugin-driven Markdown editor
221
222
  - [MonacoPilot](https://www.npmjs.com/package/monacopilot) - AI completion library
222
- - [Mistral AI](https://mistral.ai/) - AI models provider
223
223
  - [ProseMirror](https://prosemirror.net/) - Underlying editor framework
224
-
225
- ---
226
-
227
- Made with ❤️ by Jerry Bruwes
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://www.schemastore.org/package",
3
3
  "name": "@skaldapp/milkdown-copilot",
4
- "version": "1.0.5",
4
+ "version": "1.0.6",
5
5
  "description": "A Milkdown plugin that provides AI-powered code completions using Mistral AI’s Codestral model with debounced requests and tab-to-accept functionality.",
6
6
  "keywords": [
7
7
  "milkdown",
@@ -37,16 +37,16 @@
37
37
  },
38
38
  "prettier": "@skaldapp/configs/prettierrc",
39
39
  "dependencies": {
40
- "@milkdown/ctx": "^7.21.1",
41
- "@milkdown/kit": "^7.21.1",
40
+ "@milkdown/ctx": "^7.21.2",
41
+ "@milkdown/kit": "^7.21.2",
42
42
  "@monacopilot/core": "^1.2.12",
43
43
  "monacopilot": "^1.2.12",
44
44
  "quasar": "^2.19.3"
45
45
  },
46
46
  "devDependencies": {
47
- "@skaldapp/configs": "^1.4.0",
48
- "@skaldapp/shared": "^1.2.84",
49
- "@types/node": "^25.9.1",
47
+ "@skaldapp/configs": "^1.4.3",
48
+ "@skaldapp/shared": "^1.2.85",
49
+ "@types/node": "^25.9.2",
50
50
  "eslint": "^10.4.1"
51
51
  }
52
52
  }