@prosekit/preact 0.2.0 → 0.2.2

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.
@@ -8,8 +8,8 @@ import type { ComboBoxListProps as ComboBoxListProps_2 } from '@prosekit/lit/com
8
8
  import type { ComboBoxProps as ComboBoxProps_2 } from '@prosekit/lit/combo-box';
9
9
  import { ComponentChildren } from 'preact';
10
10
  import { ComponentType } from 'preact';
11
- import { Context } from 'preact';
12
11
  import { Editor } from '@prosekit/core';
12
+ import type { EditorState } from '@prosekit/pm/state';
13
13
  import { Extension } from '@prosekit/core';
14
14
  import type { InlinePopoverProps as InlinePopoverProps_2 } from '@prosekit/lit/inline-popover';
15
15
  import { Keymap } from '@prosekit/core';
@@ -17,6 +17,7 @@ import { Options } from 'tsup';
17
17
  import type { PopoverProps as PopoverProps_2 } from '@prosekit/lit/popover';
18
18
  import { PositioningOptions } from '@prosekit/lit/autocomplete-popover';
19
19
  import { Priority } from '@prosekit/core';
20
+ import { Provider } from 'preact';
20
21
  import type { ResizableHandleProps as ResizableHandleProps_2 } from '@prosekit/lit/resizable-handle';
21
22
  import type { ResizableProps as ResizableProps_2 } from '@prosekit/lit/resizable';
22
23
 
@@ -76,11 +77,10 @@ export declare const default_alias_1: {
76
77
  };
77
78
  };
78
79
 
79
- export declare interface EditorContext {
80
- editor: Editor;
81
- }
82
-
83
- export declare const editorContext: Context<EditorContext | null>;
80
+ /**
81
+ * @internal
82
+ */
83
+ export declare const EditorContextProvider: Provider<Editor<any> | null>;
84
84
 
85
85
  export declare const InlinePopover: ComponentType<InlinePopoverProps>;
86
86
 
@@ -111,6 +111,11 @@ declare type PropsWithClass<P = unknown> = P & {
111
111
  export { PropsWithClass }
112
112
  export { PropsWithClass as PropsWithClass_alias_1 }
113
113
 
114
+ /**
115
+ * The root component for a ProseKit editor.
116
+ *
117
+ * @public
118
+ */
114
119
  declare const ProseKit: ComponentType<ProseKitProps>;
115
120
  export { ProseKit }
116
121
  export { ProseKit as ProseKit_alias_1 }
@@ -147,22 +152,58 @@ declare function useEditor<E extends Extension = any>(options?: {
147
152
  export { useEditor }
148
153
  export { useEditor as useEditor_alias_1 }
149
154
 
155
+ /**
156
+ * @internal
157
+ */
158
+ export declare function useEditorContext<E extends Extension>(): Editor<E> | null;
159
+
160
+ /**
161
+ * @internal
162
+ */
163
+ export declare function useEditorExtension(editor: Editor | null | undefined, extension: Extension | null): void;
164
+
150
165
  /**
151
166
  * Add an extension to the editor.
152
- *
153
- * It accepts an optional extension. If the extension is changed, the previous
167
+ */
168
+ declare function useExtension(
169
+ /**
170
+ * The extension to add to the editor. If it changes, the previous
154
171
  * extension will be removed and the new one (if not null) will be added.
155
172
  */
156
- declare function useExtension<T extends Extension = Extension>(extension: T | null): void;
173
+ extension: Extension | null, options?: UseExtensionOptions): void;
157
174
  export { useExtension }
158
175
  export { useExtension as useExtension_alias_1 }
159
176
 
160
- declare function useKeymap(keymap: Keymap, options?: {
177
+ declare interface UseExtensionOptions {
178
+ /**
179
+ * The editor to add the extension to. If not provided, it will use the
180
+ * editor from the nearest `ProseKit` component.
181
+ */
182
+ editor?: Editor;
183
+ /**
184
+ * Optional priority to add the extension with.
185
+ */
161
186
  priority?: Priority;
162
- }): void;
187
+ }
188
+ export { UseExtensionOptions }
189
+ export { UseExtensionOptions as UseExtensionOptions_alias_1 }
190
+
191
+ declare function useKeymap(keymap: Keymap, options?: UseExtensionOptions): void;
163
192
  export { useKeymap }
164
193
  export { useKeymap as useKeymap_alias_1 }
165
194
 
166
- export declare function usePriorityExtension<T extends Extension = Extension>(extension: T | null, priority?: Priority | null): void;
195
+ /**
196
+ * @internal
197
+ */
198
+ export declare function usePriorityExtension<T extends Extension = Extension>(extension: T | null, priority?: Priority | null): T | null;
199
+
200
+ /**
201
+ * Calls the given handler whenever the editor state changes.
202
+ *
203
+ * @public
204
+ */
205
+ declare function useStateUpdate(handler: (state: EditorState) => void, options?: UseExtensionOptions): void;
206
+ export { useStateUpdate }
207
+ export { useStateUpdate as useStateUpdate_alias_1 }
167
208
 
168
209
  export { }
@@ -2,6 +2,8 @@ export { ProseKit } from './_tsup-dts-rollup';
2
2
  export { ProseKitProps } from './_tsup-dts-rollup';
3
3
  export { useEditor } from './_tsup-dts-rollup';
4
4
  export { useExtension } from './_tsup-dts-rollup';
5
+ export { UseExtensionOptions } from './_tsup-dts-rollup';
5
6
  export { useKeymap } from './_tsup-dts-rollup';
7
+ export { useStateUpdate } from './_tsup-dts-rollup';
6
8
  export { PropsWithChildren } from './_tsup-dts-rollup';
7
9
  export { PropsWithClass } from './_tsup-dts-rollup';
@@ -3,14 +3,18 @@ import { h } from "preact";
3
3
 
4
4
  // src/contexts/editor-context.ts
5
5
  import { createContext } from "preact";
6
+ import { useContext } from "preact/hooks";
6
7
  var editorContext = createContext(null);
8
+ function useEditorContext() {
9
+ return useContext(editorContext);
10
+ }
11
+ var EditorContextProvider = editorContext.Provider;
7
12
 
8
13
  // src/components/prosekit.ts
9
14
  var ProseKit = (props) => {
10
15
  const { editor, children } = props;
11
- return h(EditorContextProvider, { value: { editor }, children });
16
+ return h(EditorContextProvider, { value: editor, children });
12
17
  };
13
- var EditorContextProvider = editorContext.Provider;
14
18
 
15
19
  // src/hooks/use-editor.ts
16
20
  import {
@@ -19,17 +23,16 @@ import {
19
23
  defineUpdateHandler,
20
24
  union
21
25
  } from "@prosekit/core";
22
- import { useContext, useEffect, useReducer } from "preact/hooks";
26
+ import { useEffect, useReducer } from "preact/hooks";
23
27
  function useEditor(options) {
24
28
  var _a;
25
29
  const update = (_a = options == null ? void 0 : options.update) != null ? _a : false;
26
- const value = useContext(editorContext);
27
- if (!value) {
30
+ const editor = useEditorContext();
31
+ if (!editor) {
28
32
  throw new ProseKitError(
29
33
  "useEditor must be used within the ProseKit component"
30
34
  );
31
35
  }
32
- const editor = value.editor;
33
36
  const forceUpdate = useForceUpdate();
34
37
  useEffect(() => {
35
38
  if (update) {
@@ -49,9 +52,14 @@ function useForceUpdate() {
49
52
 
50
53
  // src/hooks/use-extension.ts
51
54
  import "@prosekit/core";
55
+
56
+ // src/hooks/use-editor-extension.ts
57
+ import { EditorNotFoundError } from "@prosekit/core";
52
58
  import { useEffect as useEffect2 } from "preact/hooks";
53
- function useExtension(extension) {
54
- const editor = useEditor();
59
+ function useEditorExtension(editor, extension) {
60
+ if (!editor) {
61
+ throw new EditorNotFoundError();
62
+ }
55
63
  useEffect2(() => {
56
64
  if (extension) {
57
65
  return editor.use(extension);
@@ -59,28 +67,42 @@ function useExtension(extension) {
59
67
  }, [editor, extension]);
60
68
  }
61
69
 
62
- // src/hooks/use-keymap.ts
63
- import { defineKeymap } from "@prosekit/core";
64
- import { useMemo as useMemo2 } from "preact/hooks";
65
-
66
70
  // src/hooks/use-priority-extension.ts
67
71
  import { withPriority } from "@prosekit/core";
68
72
  import { useMemo } from "preact/hooks";
69
73
  function usePriorityExtension(extension, priority) {
70
- const extensionWithPriority = useMemo(() => {
74
+ return useMemo(() => {
71
75
  return extension && priority ? withPriority(extension, priority) : extension;
72
76
  }, [extension, priority]);
73
- return useExtension(extensionWithPriority);
77
+ }
78
+
79
+ // src/hooks/use-extension.ts
80
+ function useExtension(extension, options) {
81
+ const editorContext2 = useEditorContext();
82
+ useEditorExtension(
83
+ (options == null ? void 0 : options.editor) || editorContext2,
84
+ usePriorityExtension(extension, options == null ? void 0 : options.priority)
85
+ );
74
86
  }
75
87
 
76
88
  // src/hooks/use-keymap.ts
89
+ import { defineKeymap } from "@prosekit/core";
90
+ import { useMemo as useMemo2 } from "preact/hooks";
77
91
  function useKeymap(keymap, options) {
78
92
  const extension = useMemo2(() => defineKeymap(keymap), [keymap]);
79
- usePriorityExtension(extension, options == null ? void 0 : options.priority);
93
+ return useExtension(extension, options);
94
+ }
95
+
96
+ // src/hooks/use-state-update.ts
97
+ import { defineUpdateHandler as defineUpdateHandler2 } from "@prosekit/core";
98
+ function useStateUpdate(handler, options) {
99
+ const extension = defineUpdateHandler2((view) => handler(view.state));
100
+ return useExtension(extension, options);
80
101
  }
81
102
  export {
82
103
  ProseKit,
83
104
  useEditor,
84
105
  useExtension,
85
- useKeymap
106
+ useKeymap,
107
+ useStateUpdate
86
108
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@prosekit/preact",
3
3
  "type": "module",
4
- "version": "0.2.0",
4
+ "version": "0.2.2",
5
5
  "private": false,
6
6
  "author": {
7
7
  "name": "ocavue",
@@ -95,8 +95,9 @@
95
95
  "dist"
96
96
  ],
97
97
  "dependencies": {
98
- "@prosekit/core": "^0.2.5",
99
- "@prosekit/lit": "^0.2.0"
98
+ "@prosekit/core": "^0.2.7",
99
+ "@prosekit/lit": "^0.2.1",
100
+ "@prosekit/pm": "^0.1.1"
100
101
  },
101
102
  "peerDependencies": {
102
103
  "preact": ">= 9.0.0"
@@ -111,7 +112,7 @@
111
112
  "preact": "^10.19.3",
112
113
  "tsup": "^8.0.1",
113
114
  "typescript": "^5.3.3",
114
- "vitest": "^1.2.0"
115
+ "vitest": "^1.2.1"
115
116
  },
116
117
  "scripts": {
117
118
  "build:tsup": "tsup",
package/src/index.ts DELETED
@@ -1,5 +0,0 @@
1
- export { ProseKit, type ProseKitProps } from './components/prosekit'
2
- export { useEditor } from './hooks/use-editor'
3
- export { useExtension } from './hooks/use-extension'
4
- export { useKeymap } from './hooks/use-keymap'
5
- export type { PropsWithChildren, PropsWithClass } from './types'