@prosekit/preact 0.2.0 → 0.2.2

package/dist/_tsup-dts-rollup.d.ts

@@ -8,8 +8,8 @@ import type { ComboBoxListProps as ComboBoxListProps_2 } from '@prosekit/lit/com
 import type { ComboBoxProps as ComboBoxProps_2 } from '@prosekit/lit/combo-box';
 import { ComponentChildren } from 'preact';
 import { ComponentType } from 'preact';
-import { Context } from 'preact';
 import { Editor } from '@prosekit/core';
+import type { EditorState } from '@prosekit/pm/state';
 import { Extension } from '@prosekit/core';
 import type { InlinePopoverProps as InlinePopoverProps_2 } from '@prosekit/lit/inline-popover';
 import { Keymap } from '@prosekit/core';
@@ -17,6 +17,7 @@ import { Options } from 'tsup';
 import type { PopoverProps as PopoverProps_2 } from '@prosekit/lit/popover';
 import { PositioningOptions } from '@prosekit/lit/autocomplete-popover';
 import { Priority } from '@prosekit/core';
+import { Provider } from 'preact';
 import type { ResizableHandleProps as ResizableHandleProps_2 } from '@prosekit/lit/resizable-handle';
 import type { ResizableProps as ResizableProps_2 } from '@prosekit/lit/resizable';
 
@@ -76,11 +77,10 @@ export declare const default_alias_1: {
     };
 };
 
-export declare interface EditorContext {
-    editor: Editor;
-}
-
-export declare const editorContext: Context<EditorContext | null>;
+/**
+ * @internal
+ */
+export declare const EditorContextProvider: Provider<Editor<any> | null>;
 
 export declare const InlinePopover: ComponentType<InlinePopoverProps>;
 
@@ -111,6 +111,11 @@ declare type PropsWithClass<P = unknown> = P & {
 export { PropsWithClass }
 export { PropsWithClass as PropsWithClass_alias_1 }
 
+/**
+ * The root component for a ProseKit editor.
+ *
+ * @public
+ */
 declare const ProseKit: ComponentType<ProseKitProps>;
 export { ProseKit }
 export { ProseKit as ProseKit_alias_1 }
@@ -147,22 +152,58 @@ declare function useEditor<E extends Extension = any>(options?: {
 export { useEditor }
 export { useEditor as useEditor_alias_1 }
 
+/**
+ * @internal
+ */
+export declare function useEditorContext<E extends Extension>(): Editor<E> | null;
+
+/**
+ * @internal
+ */
+export declare function useEditorExtension(editor: Editor | null | undefined, extension: Extension | null): void;
+
 /**
  * Add an extension to the editor.
- *
- * It accepts an optional extension. If the extension is changed, the previous
+ */
+declare function useExtension(
+/**
+ * The extension to add to the editor. If it changes, the previous
  * extension will be removed and the new one (if not null) will be added.
  */
-declare function useExtension<T extends Extension = Extension>(extension: T | null): void;
+extension: Extension | null, options?: UseExtensionOptions): void;
 export { useExtension }
 export { useExtension as useExtension_alias_1 }
 
-declare function useKeymap(keymap: Keymap, options?: {
+declare interface UseExtensionOptions {
+    /**
+     * The editor to add the extension to. If not provided, it will use the
+     * editor from the nearest `ProseKit` component.
+     */
+    editor?: Editor;
+    /**
+     * Optional priority to add the extension with.
+     */
     priority?: Priority;
-}): void;
+}
+export { UseExtensionOptions }
+export { UseExtensionOptions as UseExtensionOptions_alias_1 }
+
+declare function useKeymap(keymap: Keymap, options?: UseExtensionOptions): void;
 export { useKeymap }
 export { useKeymap as useKeymap_alias_1 }
 
-export declare function usePriorityExtension<T extends Extension = Extension>(extension: T | null, priority?: Priority | null): void;
+/**
+ * @internal
+ */
+export declare function usePriorityExtension<T extends Extension = Extension>(extension: T | null, priority?: Priority | null): T | null;
+
+/**
+ * Calls the given handler whenever the editor state changes.
+ *
+ * @public
+ */
+declare function useStateUpdate(handler: (state: EditorState) => void, options?: UseExtensionOptions): void;
+export { useStateUpdate }
+export { useStateUpdate as useStateUpdate_alias_1 }
 
 export { }

package/dist/prosekit-preact.d.ts

@@ -2,6 +2,8 @@ export { ProseKit } from './_tsup-dts-rollup';
 export { ProseKitProps } from './_tsup-dts-rollup';
 export { useEditor } from './_tsup-dts-rollup';
 export { useExtension } from './_tsup-dts-rollup';
+export { UseExtensionOptions } from './_tsup-dts-rollup';
 export { useKeymap } from './_tsup-dts-rollup';
+export { useStateUpdate } from './_tsup-dts-rollup';
 export { PropsWithChildren } from './_tsup-dts-rollup';
 export { PropsWithClass } from './_tsup-dts-rollup';

package/dist/prosekit-preact.js

@@ -3,14 +3,18 @@ import { h } from "preact";
 
 // src/contexts/editor-context.ts
 import { createContext } from "preact";
+import { useContext } from "preact/hooks";
 var editorContext = createContext(null);
+function useEditorContext() {
+  return useContext(editorContext);
+}
+var EditorContextProvider = editorContext.Provider;
 
 // src/components/prosekit.ts
 var ProseKit = (props) => {
   const { editor, children } = props;
-  return h(EditorContextProvider, { value: { editor }, children });
+  return h(EditorContextProvider, { value: editor, children });
 };
-var EditorContextProvider = editorContext.Provider;
 
 // src/hooks/use-editor.ts
 import {
@@ -19,17 +23,16 @@ import {
   defineUpdateHandler,
   union
 } from "@prosekit/core";
-import { useContext, useEffect, useReducer } from "preact/hooks";
+import { useEffect, useReducer } from "preact/hooks";
 function useEditor(options) {
   var _a;
   const update = (_a = options == null ? void 0 : options.update) != null ? _a : false;
-  const value = useContext(editorContext);
-  if (!value) {
+  const editor = useEditorContext();
+  if (!editor) {
     throw new ProseKitError(
       "useEditor must be used within the ProseKit component"
     );
   }
-  const editor = value.editor;
   const forceUpdate = useForceUpdate();
   useEffect(() => {
     if (update) {
@@ -49,9 +52,14 @@ function useForceUpdate() {
 
 // src/hooks/use-extension.ts
 import "@prosekit/core";
+
+// src/hooks/use-editor-extension.ts
+import { EditorNotFoundError } from "@prosekit/core";
 import { useEffect as useEffect2 } from "preact/hooks";
-function useExtension(extension) {
-  const editor = useEditor();
+function useEditorExtension(editor, extension) {
+  if (!editor) {
+    throw new EditorNotFoundError();
+  }
   useEffect2(() => {
     if (extension) {
       return editor.use(extension);
@@ -59,28 +67,42 @@ function useExtension(extension) {
   }, [editor, extension]);
 }
 
-// src/hooks/use-keymap.ts
-import { defineKeymap } from "@prosekit/core";
-import { useMemo as useMemo2 } from "preact/hooks";
-
 // src/hooks/use-priority-extension.ts
 import { withPriority } from "@prosekit/core";
 import { useMemo } from "preact/hooks";
 function usePriorityExtension(extension, priority) {
-  const extensionWithPriority = useMemo(() => {
+  return useMemo(() => {
     return extension && priority ? withPriority(extension, priority) : extension;
   }, [extension, priority]);
-  return useExtension(extensionWithPriority);
+}
+
+// src/hooks/use-extension.ts
+function useExtension(extension, options) {
+  const editorContext2 = useEditorContext();
+  useEditorExtension(
+    (options == null ? void 0 : options.editor) || editorContext2,
+    usePriorityExtension(extension, options == null ? void 0 : options.priority)
+  );
 }
 
 // src/hooks/use-keymap.ts
+import { defineKeymap } from "@prosekit/core";
+import { useMemo as useMemo2 } from "preact/hooks";
 function useKeymap(keymap, options) {
   const extension = useMemo2(() => defineKeymap(keymap), [keymap]);
-  usePriorityExtension(extension, options == null ? void 0 : options.priority);
+  return useExtension(extension, options);
+}
+
+// src/hooks/use-state-update.ts
+import { defineUpdateHandler as defineUpdateHandler2 } from "@prosekit/core";
+function useStateUpdate(handler, options) {
+  const extension = defineUpdateHandler2((view) => handler(view.state));
+  return useExtension(extension, options);
 }
 export {
   ProseKit,
   useEditor,
   useExtension,
-  useKeymap
+  useKeymap,
+  useStateUpdate
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@prosekit/preact",
   "type": "module",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "private": false,
   "author": {
     "name": "ocavue",
@@ -95,8 +95,9 @@
     "dist"
   ],
   "dependencies": {
-    "@prosekit/core": "^0.2.5",
-    "@prosekit/lit": "^0.2.0"
+    "@prosekit/core": "^0.2.7",
+    "@prosekit/lit": "^0.2.1",
+    "@prosekit/pm": "^0.1.1"
   },
   "peerDependencies": {
     "preact": ">= 9.0.0"
@@ -111,7 +112,7 @@
     "preact": "^10.19.3",
     "tsup": "^8.0.1",
     "typescript": "^5.3.3",
-    "vitest": "^1.2.0"
+    "vitest": "^1.2.1"
   },
   "scripts": {
     "build:tsup": "tsup",

package/src/index.ts

@@ -1,5 +0,0 @@
-export { ProseKit, type ProseKitProps } from './components/prosekit'
-export { useEditor } from './hooks/use-editor'
-export { useExtension } from './hooks/use-extension'
-export { useKeymap } from './hooks/use-keymap'
-export type { PropsWithChildren, PropsWithClass } from './types'