@prosekit/preact 0.5.0 → 0.6.0

package/dist/prosekit-preact-tooltip.js

@@ -14,4 +14,5 @@ const TooltipRoot = createComponent("prosekit-tooltip-root", "TooltipRoot", Obje
 const TooltipTrigger = createComponent("prosekit-tooltip-trigger", "TooltipTrigger", Object.keys(tooltipTriggerProps), Object.keys(tooltipTriggerEvents));
 
 //#endregion
-export { TooltipContent, TooltipRoot, TooltipTrigger };
+export { TooltipContent, TooltipRoot, TooltipTrigger };
+//# sourceMappingURL=prosekit-preact-tooltip.js.map

package/dist/prosekit-preact-tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prosekit-preact-tooltip.js","names":["TooltipContent: ForwardRefExoticComponent<\n  Partial<TooltipContentProps> &\n  RefAttributes<TooltipContentElement> &\n  HTMLAttributes<TooltipContentElement>\n>","TooltipRoot: ForwardRefExoticComponent<\n  Partial<TooltipRootProps> &\n  RefAttributes<TooltipRootElement> &\n  HTMLAttributes<TooltipRootElement>\n>","TooltipTrigger: ForwardRefExoticComponent<\n  Partial<TooltipTriggerProps> &\n  RefAttributes<TooltipTriggerElement> &\n  HTMLAttributes<TooltipTriggerElement>\n>"],"sources":["../src/components/tooltip/tooltip-content.gen.ts","../src/components/tooltip/tooltip-root.gen.ts","../src/components/tooltip/tooltip-trigger.gen.ts"],"sourcesContent":["import {\n  type TooltipContentElement,\n  type TooltipContentProps as Props,\n  type TooltipContentEvents as Events,\n  tooltipContentProps,\n  tooltipContentEvents,\n} from '@prosekit/web/tooltip'\nimport type {\n  ForwardRefExoticComponent,\n  HTMLAttributes,\n  RefAttributes,\n} from 'preact/compat'\n\nimport { createComponent } from '../create-component'\nimport type { CreateProps } from '../create-props'\n\n/**\n * Props for the {@link TooltipContent} component.\n */\nexport interface TooltipContentProps extends Partial<CreateProps<Props, Events>> {}\n \nexport const TooltipContent: ForwardRefExoticComponent<\n  Partial<TooltipContentProps> &\n  RefAttributes<TooltipContentElement> &\n  HTMLAttributes<TooltipContentElement>\n> = createComponent<\n  TooltipContentProps, \n  TooltipContentElement\n>(\n  'prosekit-tooltip-content',\n  'TooltipContent',\n  Object.keys(tooltipContentProps),\n  Object.keys(tooltipContentEvents),\n)\n","import {\n  type TooltipRootElement,\n  type TooltipRootProps as Props,\n  type TooltipRootEvents as Events,\n  tooltipRootProps,\n  tooltipRootEvents,\n} from '@prosekit/web/tooltip'\nimport type {\n  ForwardRefExoticComponent,\n  HTMLAttributes,\n  RefAttributes,\n} from 'preact/compat'\n\nimport { createComponent } from '../create-component'\nimport type { CreateProps } from '../create-props'\n\n/**\n * Props for the {@link TooltipRoot} component.\n */\nexport interface TooltipRootProps extends Partial<CreateProps<Props, Events>> {}\n \nexport const TooltipRoot: ForwardRefExoticComponent<\n  Partial<TooltipRootProps> &\n  RefAttributes<TooltipRootElement> &\n  HTMLAttributes<TooltipRootElement>\n> = createComponent<\n  TooltipRootProps, \n  TooltipRootElement\n>(\n  'prosekit-tooltip-root',\n  'TooltipRoot',\n  Object.keys(tooltipRootProps),\n  Object.keys(tooltipRootEvents),\n)\n","import {\n  type TooltipTriggerElement,\n  type TooltipTriggerProps as Props,\n  type TooltipTriggerEvents as Events,\n  tooltipTriggerProps,\n  tooltipTriggerEvents,\n} from '@prosekit/web/tooltip'\nimport type {\n  ForwardRefExoticComponent,\n  HTMLAttributes,\n  RefAttributes,\n} from 'preact/compat'\n\nimport { createComponent } from '../create-component'\nimport type { CreateProps } from '../create-props'\n\n/**\n * Props for the {@link TooltipTrigger} component.\n */\nexport interface TooltipTriggerProps extends Partial<CreateProps<Props, Events>> {}\n \nexport const TooltipTrigger: ForwardRefExoticComponent<\n  Partial<TooltipTriggerProps> &\n  RefAttributes<TooltipTriggerElement> &\n  HTMLAttributes<TooltipTriggerElement>\n> = createComponent<\n  TooltipTriggerProps, \n  TooltipTriggerElement\n>(\n  'prosekit-tooltip-trigger',\n  'TooltipTrigger',\n  Object.keys(tooltipTriggerProps),\n  Object.keys(tooltipTriggerEvents),\n)\n"],"mappings":";;;;;AAqBA,MAAaA,iBAIT,gBAIF,4BACA,kBACA,OAAO,KAAK,oBAAoB,EAChC,OAAO,KAAK,qBAAqB,CAClC;;;;ACZD,MAAaC,cAIT,gBAIF,yBACA,eACA,OAAO,KAAK,iBAAiB,EAC7B,OAAO,KAAK,kBAAkB,CAC/B;;;;ACZD,MAAaC,iBAIT,gBAIF,4BACA,kBACA,OAAO,KAAK,oBAAoB,EAChC,OAAO,KAAK,qBAAqB,CAClC"}

package/dist/prosekit-preact.d.ts

@@ -1,5 +1,7 @@
+import { MarkViewContext, NodeViewContext } from "@prosemirror-adapter/preact";
 import { ComponentChildren, ComponentType } from "preact";
 import { Editor, Extension, Keymap, Priority } from "@prosekit/core";
+import { CoreMarkViewUserOptions, CoreNodeViewUserOptions } from "@prosemirror-adapter/core";
 import { ProseMirrorNode } from "@prosekit/pm/model";
 import { EditorState } from "@prosekit/pm/state";
 
@@ -9,77 +11,165 @@ interface ProseKitProps {
   children?: ComponentChildren;
 }
 /**
-* The root component for a ProseKit editor.
-*
-* @public
-*/
+ * The root component for a ProseKit editor.
+ *
+ * @public
+ */
 declare const ProseKit: ComponentType<ProseKitProps>;
 //#endregion
+//#region src/extensions/preact-mark-view.d.ts
+/**
+ * @public
+ */
+interface PreactMarkViewProps extends MarkViewContext {}
+/**
+ * @public
+ */
+type PreactMarkViewComponent = ComponentType<PreactMarkViewProps>;
+/**
+ * Options for {@link definePreactMarkView}.
+ *
+ * @public
+ */
+interface PreactMarkViewOptions extends CoreMarkViewUserOptions<PreactMarkViewComponent> {
+  /**
+   * The name of the mark type.
+   */
+  name: string;
+}
+/**
+ * Defines a mark view using a Preact component.
+ *
+ * @public
+ */
+declare function definePreactMarkView(options: PreactMarkViewOptions): Extension;
+//#endregion
+//#region src/extensions/preact-node-view.d.ts
+/**
+ * @public
+ */
+interface PreactNodeViewProps extends NodeViewContext {}
+/**
+ * @public
+ */
+type PreactNodeViewComponent = ComponentType<PreactNodeViewProps>;
+/**
+ * Options for {@link definePreactNodeView}.
+ *
+ * @public
+ */
+interface PreactNodeViewOptions extends CoreNodeViewUserOptions<PreactNodeViewComponent> {
+  /**
+   * The name of the node type.
+   */
+  name: string;
+}
+/**
+ * Defines a node view using a Preact component.
+ *
+ * @public
+ */
+declare function definePreactNodeView(options: PreactNodeViewOptions): Extension;
+//#endregion
 //#region src/hooks/use-extension.d.ts
 interface UseExtensionOptions {
   /**
-  * The editor to add the extension to. If not provided, it will use the
-  * editor from the nearest `ProseKit` component.
-  */
+   * 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.
-  */
+   * Optional priority to add the extension with.
+   */
   priority?: Priority;
 }
 /**
-* Add an extension to the editor.
-*/
-declare function useExtension(extension: Extension | null, options?: UseExtensionOptions): void;
+ * Add an extension to the editor.
+ */
+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.
+ */
+extension: Extension | null, options?: UseExtensionOptions): void;
 //#endregion
 //#region src/hooks/use-doc-change.d.ts
 /**
-* Calls the given handler whenever the editor document changes.
-*
-* @public
-*/
+ * Calls the given handler whenever the editor document changes.
+ *
+ * @public
+ */
 declare function useDocChange(handler: (doc: ProseMirrorNode) => void, options?: UseExtensionOptions): void;
 //#endregion
 //#region src/hooks/use-editor.d.ts
 /**
-* Retrieves the editor instance from the nearest ProseKit component.
-*
-* @public
-*/
+ * Retrieves the editor instance from the nearest ProseKit component.
+ *
+ * @public
+ */
 declare function useEditor<E extends Extension = any>(options?: {
   /**
-  * Whether to update the component when the editor is mounted or editor state
-  * is updated.
-  *
-  * @default false
-  */
+   * Whether to update the component when the editor is mounted or editor state
+   * is updated.
+   *
+   * @default false
+   */
   update?: boolean;
 }): Editor<E>;
 //#endregion
+//#region src/hooks/use-editor-derived-value.d.ts
+interface UseEditorDerivedOptions<E extends Extension = any> {
+  /**
+   * The editor to add the extension to. If not provided, it will use the
+   * editor from the nearest `ProseKit` component.
+   */
+  editor?: Editor<E>;
+}
+/**
+ * A hook that runs a function to derive a value from the editor instance after
+ * editor state changes.
+ *
+ * This is useful when you need to render something based on the editor state,
+ * for example, whether the selected text is wrapped in an italic mark.
+ *
+ * @public
+ */
+declare function useEditorDerivedValue<E extends Extension, Derived>(
+/**
+ * A function that receives the editor instance and returns a derived value.
+ *
+ * It will be called whenever the editor's document state changes, or when it
+ * mounts.
+ *
+ * This function should be memoized.
+ */
+derive: (editor: Editor<E>) => Derived, options?: UseEditorDerivedOptions<E>): Derived;
+//#endregion
 //#region src/hooks/use-keymap.d.ts
 declare function useKeymap(keymap: Keymap, options?: UseExtensionOptions): void;
 //#endregion
 //#region src/hooks/use-state-update.d.ts
 /**
-* Calls the given handler whenever the editor state changes.
-*
-* @public
-*/
+ * Calls the given handler whenever the editor state changes.
+ *
+ * @public
+ */
 declare function useStateUpdate(handler: (state: EditorState) => void, options?: UseExtensionOptions): void;
 //#endregion
 //#region src/types.d.ts
 /**
-* @internal
-*/
+ * @internal
+ */
 type PropsWithClass<P = unknown> = P & {
   class?: string | undefined;
   className?: string | undefined;
 };
 /**
-* @internal
-*/
+ * @internal
+ */
 type PropsWithChildren<P = unknown> = P & {
   children?: ComponentChildren | undefined;
 };
 //#endregion
-export { type PropsWithChildren, type PropsWithClass, ProseKit, type ProseKitProps, type UseExtensionOptions, useDocChange, useEditor, useExtension, useKeymap, useStateUpdate };
+export { type PreactMarkViewComponent, type PreactMarkViewOptions, type PreactMarkViewProps, type PreactNodeViewComponent, type PreactNodeViewOptions, type PreactNodeViewProps, type PropsWithChildren, type PropsWithClass, ProseKit, type ProseKitProps, type UseEditorDerivedOptions, type UseExtensionOptions, definePreactMarkView, definePreactNodeView, useDocChange, useEditor, useEditorDerivedValue, useExtension, useKeymap, useStateUpdate };
+//# sourceMappingURL=prosekit-preact.d.ts.map

package/dist/prosekit-preact.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"prosekit-preact.d.ts","names":[],"sources":["../src/components/prosekit.ts","../src/extensions/preact-mark-view.ts","../src/extensions/preact-node-view.ts","../src/hooks/use-extension.ts","../src/hooks/use-doc-change.ts","../src/hooks/use-editor.ts","../src/hooks/use-editor-derived-value.ts","../src/hooks/use-keymap.ts","../src/hooks/use-state-update.ts","../src/types.ts"],"sourcesContent":[],"mappings":";;;;;;;;UAYiB,aAAA;UACP;aACG;;;;AAFb;;;AAEa,cAQA,QARA,EAQU,aARV,CAQwB,aARxB,CAAA;;;;;;UCWI,mBAAA,SAA4B,iBDb7C;;;;AAE8B,KCgBlB,uBAAA,GAA0B,aDhBR,CCgBsB,mBDhBtB,CAAA;AAQ9B;;;;;UCeiB,qBAAA,SAA8B,wBAAwB;;;AAZvE;EAKY,IAAA,EAAA,MAAA;;;;;;AAwCZ;AAAoC,iBAApB,oBAAA,CAAoB,OAAA,EAAU,qBAAV,CAAA,EAAkC,SAAlC;;;;;;UC7CnB,mBAAA,SAA4B,iBFb7C;;;;AAE8B,KEgBlB,uBAAA,GAA0B,aFhBR,CEgBsB,mBFhBtB,CAAA;AAQ9B;;;;;UEeiB,qBAAA,SAA8B,wBAAwB;;;ADZvE;EAKY,IAAA,EAAA,MAAA;;;;;;AAwCZ;AAAoC,iBCApB,oBAAA,CDAoB,OAAA,ECAU,qBDAV,CAAA,ECAkC,SDAlC;;;UE3DnB,mBAAA;;;;;WAKN;;AHJX;;UACU,CAAA,EGQG,QHRH;;;AASV;;AAAqC,iBGKrB,YAAA;;;;;WAKH,4BACD;;;;;;;;iBCnBI,YAAA,gBACC,oCACL;;;;;;;;iBCII,oBAAoB,wBLgBnC;;AAxBD;;;;;EAUa,MAAA,CAAA,EAAA,OAcZ;CAAA,CAAA,EKRG,MLQH,CKRU,CLQV,CAAA;;;UMvBgB,kCAAkC;;;;;WAKxC,OAAO;;ANNlB;;;;;AAUA;;;;AAAoC,iBMQpB,qBNRoB,CAAA,UMQY,SNRZ,EAAA,OAAA,CAAA;;;;ACGpC;AAKA;;;;MAAmD,EAAA,CAAA,MAAA,EKShC,MLTgC,CKSzB,CLTyB,CAAA,EAAA,GKSlB,OLTkB,EAAA,OAAA,CAAA,EKUvC,uBLVuC,CKUf,CLVe,CAAA,CAAA,EKWhD,OLXgD;;;iBMnBnC,SAAA,SAAkB,kBAAkB;;;;;;;;iBCGpC,cAAA,kBACG,gCACP;;;;;;KCXA,8BAA8B;;;;ATO1C;;;AAEa,KSDD,iBTCC,CAAA,IAAA,OAAA,CAAA,GSDgC,CTChC,GAAA;EAAiB,QAAA,CAAA,ESAjB,iBTAiB,GAAA,SAAA;AAQ9B,CAAA"}

package/dist/prosekit-preact.js

@@ -1,23 +1,10 @@
 import { EditorContextProvider, useEditorContext } from "./editor-context-imq7MdJr.js";
+import { ProsemirrorAdapterProvider, useMarkViewContext, useMarkViewFactory, useNodeViewContext, useNodeViewFactory } from "@prosemirror-adapter/preact";
 import { h } from "preact";
 import { useEffect, useMemo, useReducer } from "preact/hooks";
-import { EditorNotFoundError, ProseKitError, defineDocChangeHandler, defineKeymap, defineMountHandler, defineUpdateHandler, union, withPriority } from "@prosekit/core";
+import { EditorNotFoundError, ProseKitError, defineDocChangeHandler, defineKeymap, defineMarkViewComponent, defineMarkViewFactory, defineMountHandler, defineNodeViewComponent, defineNodeViewFactory, defineUpdateHandler, union, withPriority } from "@prosekit/core";
+import { useSyncExternalStore } from "preact/compat";
 
-//#region src/components/prosekit.ts
-/**
-* The root component for a ProseKit editor.
-*
-* @public
-*/
-const ProseKit = (props) => {
-	const { editor, children } = props;
-	return h(EditorContextProvider, {
-		value: editor,
-		children
-	});
-};
-
-//#endregion
 //#region src/hooks/use-editor-extension.ts
 /**
 * @internal
@@ -50,6 +37,94 @@ function useExtension(extension, options) {
 	useEditorExtension(options?.editor || editorContext, usePriorityExtension(extension, options?.priority));
 }
 
+//#endregion
+//#region src/extensions/preact-mark-view.ts
+function withMarkViewProps(component) {
+	return function MarkViewPropsWrapper() {
+		return h(component, useMarkViewContext());
+	};
+}
+/**
+* @internal
+*/
+const PreactMarkViewConsumer = () => {
+	const markViewFactory = useMarkViewFactory();
+	useExtension(useMemo(() => definePreactMarkViewFactory(markViewFactory), [markViewFactory]));
+	return null;
+};
+/**
+* Defines a mark view using a Preact component.
+*
+* @public
+*/
+function definePreactMarkView(options) {
+	const { name, component,...userOptions } = options;
+	return defineMarkViewComponent({
+		group: "preact",
+		name,
+		args: {
+			...userOptions,
+			component: withMarkViewProps(component)
+		}
+	});
+}
+function definePreactMarkViewFactory(factory) {
+	return defineMarkViewFactory({
+		group: "preact",
+		factory
+	});
+}
+
+//#endregion
+//#region src/extensions/preact-node-view.ts
+function withNodeViewProps(component) {
+	return function NodeViewPropsWrapper() {
+		return h(component, useNodeViewContext());
+	};
+}
+/**
+* @internal
+*/
+const PreactNodeViewConsumer = () => {
+	const nodeViewFactory = useNodeViewFactory();
+	useExtension(useMemo(() => definePreactNodeViewFactory(nodeViewFactory), [nodeViewFactory]));
+	return null;
+};
+/**
+* Defines a node view using a Preact component.
+*
+* @public
+*/
+function definePreactNodeView(options) {
+	const { name, component,...userOptions } = options;
+	return defineNodeViewComponent({
+		group: "preact",
+		name,
+		args: {
+			...userOptions,
+			component: withNodeViewProps(component)
+		}
+	});
+}
+function definePreactNodeViewFactory(factory) {
+	return defineNodeViewFactory({
+		group: "preact",
+		factory
+	});
+}
+
+//#endregion
+//#region src/components/prosekit.ts
+/**
+* The root component for a ProseKit editor.
+*
+* @public
+*/
+const ProseKit = (props) => {
+	const { editor, children } = props;
+	return h(ProsemirrorAdapterProvider, null, h(EditorContextProvider, { value: editor }, h(PreactNodeViewConsumer, null), h(PreactMarkViewConsumer, null), children));
+};
+
 //#endregion
 //#region src/hooks/use-doc-change.ts
 /**
@@ -58,8 +133,7 @@ function useExtension(extension, options) {
 * @public
 */
 function useDocChange(handler, options) {
-	const extension = useMemo(() => defineDocChangeHandler((view) => handler(view.state.doc)), [handler]);
-	useExtension(extension, options);
+	useExtension(useMemo(() => defineDocChangeHandler((view) => handler(view.state.doc)), [handler]), options);
 }
 
 //#endregion
@@ -91,11 +165,51 @@ function useForceUpdate() {
 	return dispatch;
 }
 
+//#endregion
+//#region src/hooks/use-editor-derived-value.ts
+/**
+* A hook that runs a function to derive a value from the editor instance after
+* editor state changes.
+*
+* This is useful when you need to render something based on the editor state,
+* for example, whether the selected text is wrapped in an italic mark.
+*
+* @public
+*/
+function useEditorDerivedValue(derive, options) {
+	const editorContext = useEditorContext();
+	const editor = options?.editor ?? editorContext;
+	if (!editor) throw new EditorNotFoundError();
+	const [subscribe, getSnapshot] = useMemo(() => {
+		return createEditorStore(editor, derive);
+	}, [editor, derive]);
+	return useSyncExternalStore(subscribe, getSnapshot);
+}
+function createEditorStore(editor, derive) {
+	let dirty = true;
+	let derived;
+	const subscribe = (onChange) => {
+		const handleChange = () => {
+			dirty = true;
+			onChange();
+		};
+		const extension = union(defineUpdateHandler(handleChange), defineMountHandler(handleChange));
+		return editor.use(extension);
+	};
+	const getSnapshot = () => {
+		if (dirty) {
+			dirty = false;
+			derived = derive(editor);
+		}
+		return derived;
+	};
+	return [subscribe, getSnapshot];
+}
+
 //#endregion
 //#region src/hooks/use-keymap.ts
 function useKeymap(keymap, options) {
-	const extension = useMemo(() => defineKeymap(keymap), [keymap]);
-	useExtension(extension, options);
+	useExtension(useMemo(() => defineKeymap(keymap), [keymap]), options);
 }
 
 //#endregion
@@ -106,9 +220,9 @@ function useKeymap(keymap, options) {
 * @public
 */
 function useStateUpdate(handler, options) {
-	const extension = useMemo(() => defineUpdateHandler((view) => handler(view.state)), [handler]);
-	useExtension(extension, options);
+	useExtension(useMemo(() => defineUpdateHandler((view) => handler(view.state)), [handler]), options);
 }
 
 //#endregion
-export { ProseKit, useDocChange, useEditor, useExtension, useKeymap, useStateUpdate };
+export { ProseKit, definePreactMarkView, definePreactNodeView, useDocChange, useEditor, useEditorDerivedValue, useExtension, useKeymap, useStateUpdate };
+//# sourceMappingURL=prosekit-preact.js.map

package/dist/prosekit-preact.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prosekit-preact.js","names":["PreactMarkViewConsumer: FunctionComponent","PreactNodeViewConsumer: FunctionComponent","ProseKit: ComponentType<ProseKitProps>","derived: Derived"],"sources":["../src/hooks/use-editor-extension.ts","../src/hooks/use-priority-extension.ts","../src/hooks/use-extension.ts","../src/extensions/preact-mark-view.ts","../src/extensions/preact-node-view.ts","../src/components/prosekit.ts","../src/hooks/use-doc-change.ts","../src/hooks/use-editor.ts","../src/hooks/use-editor-derived-value.ts","../src/hooks/use-keymap.ts","../src/hooks/use-state-update.ts"],"sourcesContent":["import {\n  EditorNotFoundError,\n  type Editor,\n  type Extension,\n} from '@prosekit/core'\nimport { useEffect } from 'preact/hooks'\n\n/**\n * @internal\n */\nexport function useEditorExtension(\n  editor: Editor | null | undefined,\n  extension: Extension | null,\n): void {\n  if (!editor) {\n    throw new EditorNotFoundError()\n  }\n\n  useEffect(() => {\n    if (extension) {\n      return editor.use(extension)\n    }\n  }, [editor, extension])\n}\n","import {\n  withPriority,\n  type Extension,\n  type Priority,\n} from '@prosekit/core'\nimport { useMemo } from 'preact/hooks'\n\n/**\n * @internal\n */\nexport function usePriorityExtension<T extends Extension = Extension>(\n  extension: T | null,\n  priority?: Priority | null,\n): T | null {\n  return useMemo(() => {\n    return extension && priority ? withPriority(extension, priority) : extension\n  }, [extension, priority])\n}\n","import type {\n  Editor,\n  Extension,\n  Priority,\n} from '@prosekit/core'\n\nimport { useEditorContext } from '../contexts/editor-context'\n\nimport { useEditorExtension } from './use-editor-extension'\nimport { usePriorityExtension } from './use-priority-extension'\n\nexport interface UseExtensionOptions {\n  /**\n   * The editor to add the extension to. If not provided, it will use the\n   * editor from the nearest `ProseKit` component.\n   */\n  editor?: Editor\n\n  /**\n   * Optional priority to add the extension with.\n   */\n  priority?: Priority\n}\n\n/**\n * Add an extension to the editor.\n */\nexport function useExtension(\n  /**\n   * The extension to add to the editor. If it changes, the previous\n   * extension will be removed and the new one (if not null) will be added.\n   */\n  extension: Extension | null,\n  options?: UseExtensionOptions,\n): void {\n  const editorContext = useEditorContext()\n  useEditorExtension(\n    options?.editor || editorContext,\n    usePriorityExtension(extension, options?.priority),\n  )\n}\n","import {\n  defineMarkViewComponent,\n  defineMarkViewFactory,\n  type Extension,\n} from '@prosekit/core'\nimport type { MarkViewConstructor } from '@prosekit/pm/view'\nimport type { CoreMarkViewUserOptions } from '@prosemirror-adapter/core'\nimport {\n  useMarkViewContext,\n  useMarkViewFactory,\n  type MarkViewContext,\n  type PreactMarkViewUserOptions,\n} from '@prosemirror-adapter/preact'\nimport {\n  h,\n  type ComponentType,\n  type FunctionComponent,\n} from 'preact'\nimport { useMemo } from 'preact/hooks'\n\nimport { useExtension } from '../hooks/use-extension'\n\n/**\n * @public\n */\nexport interface PreactMarkViewProps extends MarkViewContext {}\n\n/**\n * @public\n */\nexport type PreactMarkViewComponent = ComponentType<PreactMarkViewProps>\n\n/**\n * Options for {@link definePreactMarkView}.\n *\n * @public\n */\nexport interface PreactMarkViewOptions extends CoreMarkViewUserOptions<PreactMarkViewComponent> {\n  /**\n   * The name of the mark type.\n   */\n  name: string\n}\n\nfunction withMarkViewProps(component: PreactMarkViewComponent) {\n  return function MarkViewPropsWrapper() {\n    const props: PreactMarkViewProps = useMarkViewContext()\n    return h(component, props)\n  }\n}\n\n/**\n * @internal\n */\nexport const PreactMarkViewConsumer: FunctionComponent = () => {\n  const markViewFactory = useMarkViewFactory()\n  const extension = useMemo(\n    () => definePreactMarkViewFactory(markViewFactory),\n    [markViewFactory],\n  )\n  useExtension(extension)\n\n  return null\n}\n\n/**\n * Defines a mark view using a Preact component.\n *\n * @public\n */\nexport function definePreactMarkView(options: PreactMarkViewOptions): Extension {\n  const { name, component, ...userOptions } = options\n\n  const args: PreactMarkViewUserOptions = {\n    ...userOptions,\n    component: withMarkViewProps(component),\n  }\n\n  return defineMarkViewComponent<PreactMarkViewUserOptions>({\n    group: 'preact',\n    name,\n    args,\n  })\n}\n\nfunction definePreactMarkViewFactory(\n  factory: (options: PreactMarkViewUserOptions) => MarkViewConstructor,\n) {\n  return defineMarkViewFactory<PreactMarkViewUserOptions>({\n    group: 'preact',\n    factory,\n  })\n}\n","import {\n  defineNodeViewComponent,\n  defineNodeViewFactory,\n  type Extension,\n} from '@prosekit/core'\nimport type { NodeViewConstructor } from '@prosekit/pm/view'\nimport type { CoreNodeViewUserOptions } from '@prosemirror-adapter/core'\nimport {\n  useNodeViewContext,\n  useNodeViewFactory,\n  type NodeViewContext,\n  type PreactNodeViewUserOptions,\n} from '@prosemirror-adapter/preact'\nimport {\n  h,\n  type ComponentType,\n  type FunctionComponent,\n} from 'preact'\nimport { useMemo } from 'preact/hooks'\n\nimport { useExtension } from '../hooks/use-extension'\n\n/**\n * @public\n */\nexport interface PreactNodeViewProps extends NodeViewContext {}\n\n/**\n * @public\n */\nexport type PreactNodeViewComponent = ComponentType<PreactNodeViewProps>\n\n/**\n * Options for {@link definePreactNodeView}.\n *\n * @public\n */\nexport interface PreactNodeViewOptions extends CoreNodeViewUserOptions<PreactNodeViewComponent> {\n  /**\n   * The name of the node type.\n   */\n  name: string\n}\n\nfunction withNodeViewProps(component: PreactNodeViewComponent) {\n  return function NodeViewPropsWrapper() {\n    const props: PreactNodeViewProps = useNodeViewContext()\n    return h(component, props)\n  }\n}\n\n/**\n * @internal\n */\nexport const PreactNodeViewConsumer: FunctionComponent = () => {\n  const nodeViewFactory = useNodeViewFactory()\n  const extension = useMemo(\n    () => definePreactNodeViewFactory(nodeViewFactory),\n    [nodeViewFactory],\n  )\n  useExtension(extension)\n\n  return null\n}\n\n/**\n * Defines a node view using a Preact component.\n *\n * @public\n */\nexport function definePreactNodeView(options: PreactNodeViewOptions): Extension {\n  const { name, component, ...userOptions } = options\n\n  const args: PreactNodeViewUserOptions = {\n    ...userOptions,\n    component: withNodeViewProps(component),\n  }\n\n  return defineNodeViewComponent<PreactNodeViewUserOptions>({\n    group: 'preact',\n    name,\n    args,\n  })\n}\n\nfunction definePreactNodeViewFactory(\n  factory: (options: PreactNodeViewUserOptions) => NodeViewConstructor,\n) {\n  return defineNodeViewFactory<PreactNodeViewUserOptions>({\n    group: 'preact',\n    factory,\n  })\n}\n","import type { Editor } from '@prosekit/core'\nimport { ProsemirrorAdapterProvider } from '@prosemirror-adapter/preact'\nimport {\n  h,\n  type ComponentChildren,\n  type ComponentType,\n} from 'preact'\n\nimport { EditorContextProvider } from '../contexts/editor-context'\nimport { PreactMarkViewConsumer } from '../extensions/preact-mark-view'\nimport { PreactNodeViewConsumer } from '../extensions/preact-node-view'\n\nexport interface ProseKitProps {\n  editor: Editor\n  children?: ComponentChildren\n}\n\n/**\n * The root component for a ProseKit editor.\n *\n * @public\n */\nexport const ProseKit: ComponentType<ProseKitProps> = (props) => {\n  const { editor, children } = props\n\n  return h(\n    ProsemirrorAdapterProvider,\n    null,\n    h(\n      EditorContextProvider,\n      { value: editor },\n      h(PreactNodeViewConsumer, null),\n      h(PreactMarkViewConsumer, null),\n      children,\n    ),\n  )\n}\n","import { defineDocChangeHandler } from '@prosekit/core'\nimport type { ProseMirrorNode } from '@prosekit/pm/model'\nimport { useMemo } from 'preact/hooks'\n\nimport {\n  useExtension,\n  type UseExtensionOptions,\n} from './use-extension'\n\n/**\n * Calls the given handler whenever the editor document changes.\n *\n * @public\n */\nexport function useDocChange(\n  handler: (doc: ProseMirrorNode) => void,\n  options?: UseExtensionOptions,\n): void {\n  const extension = useMemo(\n    () => defineDocChangeHandler((view) => handler(view.state.doc)),\n    [handler],\n  )\n  useExtension(extension, options)\n}\n","import {\n  defineMountHandler,\n  defineUpdateHandler,\n  ProseKitError,\n  union,\n  type Editor,\n  type Extension,\n} from '@prosekit/core'\nimport {\n  useEffect,\n  useReducer,\n} from 'preact/hooks'\n\nimport { useEditorContext } from '../contexts/editor-context'\n\n/**\n * Retrieves the editor instance from the nearest ProseKit component.\n *\n * @public\n */\nexport function useEditor<E extends Extension = any>(options?: {\n  /**\n   * Whether to update the component when the editor is mounted or editor state\n   * is updated.\n   *\n   * @default false\n   */\n  update?: boolean\n}): Editor<E> {\n  const update = options?.update ?? false\n\n  const editor = useEditorContext<E>()\n  if (!editor) {\n    throw new ProseKitError(\n      'useEditor must be used within the ProseKit component',\n    )\n  }\n\n  const forceUpdate = useForceUpdate()\n\n  useEffect(() => {\n    if (update) {\n      const extension = union(\n        defineMountHandler(forceUpdate),\n        defineUpdateHandler(forceUpdate),\n      )\n      return editor.use(extension)\n    }\n  }, [editor, update, forceUpdate])\n\n  return editor\n}\n\nfunction useForceUpdate() {\n  const [, dispatch] = useReducer((x: number) => x + 1, 0)\n  return dispatch\n}\n","import {\n  defineMountHandler,\n  defineUpdateHandler,\n  EditorNotFoundError,\n  union,\n  type Editor,\n  type Extension,\n} from '@prosekit/core'\nimport { useSyncExternalStore } from 'preact/compat'\nimport { useMemo } from 'preact/hooks'\n\nimport { useEditorContext } from '../contexts/editor-context'\n\nexport interface UseEditorDerivedOptions<E extends Extension = any> {\n  /**\n   * The editor to add the extension to. If not provided, it will use the\n   * editor from the nearest `ProseKit` component.\n   */\n  editor?: Editor<E>\n}\n\n/**\n * A hook that runs a function to derive a value from the editor instance after\n * editor state changes.\n *\n * This is useful when you need to render something based on the editor state,\n * for example, whether the selected text is wrapped in an italic mark.\n *\n * @public\n */\nexport function useEditorDerivedValue<E extends Extension, Derived>(\n  /**\n   * A function that receives the editor instance and returns a derived value.\n   *\n   * It will be called whenever the editor's document state changes, or when it\n   * mounts.\n   *\n   * This function should be memoized.\n   */\n  derive: (editor: Editor<E>) => Derived,\n  options?: UseEditorDerivedOptions<E>,\n): Derived {\n  const editorContext = useEditorContext<E>()\n  const editor = options?.editor ?? editorContext\n  if (!editor) {\n    throw new EditorNotFoundError()\n  }\n\n  const [subscribe, getSnapshot] = useMemo(() => {\n    return createEditorStore(editor, derive)\n  }, [editor, derive])\n\n  return useSyncExternalStore(subscribe, getSnapshot)\n}\n\nfunction createEditorStore<Derived, E extends Extension = any>(editor: Editor<E>, derive: (editor: Editor<E>) => Derived) {\n  let dirty = true\n  let derived: Derived\n\n  const subscribe = (onChange: VoidFunction): VoidFunction => {\n    const handleChange = () => {\n      dirty = true\n      onChange()\n    }\n    const extension = union(\n      defineUpdateHandler(handleChange),\n      defineMountHandler(handleChange),\n    )\n    return editor.use(extension)\n  }\n\n  const getSnapshot = () => {\n    if (dirty) {\n      dirty = false\n      derived = derive(editor)\n    }\n    return derived\n  }\n\n  return [subscribe, getSnapshot] as const\n}\n","import {\n  defineKeymap,\n  type Keymap,\n} from '@prosekit/core'\nimport { useMemo } from 'preact/hooks'\n\nimport {\n  useExtension,\n  type UseExtensionOptions,\n} from './use-extension'\n\nexport function useKeymap(keymap: Keymap, options?: UseExtensionOptions): void {\n  const extension = useMemo(() => defineKeymap(keymap), [keymap])\n  useExtension(extension, options)\n}\n","import { defineUpdateHandler } from '@prosekit/core'\nimport type { EditorState } from '@prosekit/pm/state'\nimport { useMemo } from 'preact/hooks'\n\nimport {\n  useExtension,\n  type UseExtensionOptions,\n} from './use-extension'\n\n/**\n * Calls the given handler whenever the editor state changes.\n *\n * @public\n */\nexport function useStateUpdate(\n  handler: (state: EditorState) => void,\n  options?: UseExtensionOptions,\n): void {\n  const extension = useMemo(\n    () => defineUpdateHandler((view) => handler(view.state)),\n    [handler],\n  )\n  useExtension(extension, options)\n}\n"],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@prosekit/preact",
   "type": "module",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "private": false,
   "description": "Preact components and utilities for ProseKit",
   "author": {
@@ -10,14 +10,14 @@
   },
   "license": "MIT",
   "funding": "https://github.com/sponsors/ocavue",
-  "homepage": "https://github.com/ocavue/prosekit#readme",
+  "homepage": "https://github.com/prosekit/prosekit#readme",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/ocavue/prosekit.git",
+    "url": "git+https://github.com/prosekit/prosekit.git",
     "directory": "packages/preact"
   },
   "bugs": {
-    "url": "https://github.com/ocavue/prosekit/issues"
+    "url": "https://github.com/prosekit/prosekit/issues"
   },
   "keywords": [
     "ProseMirror"
@@ -64,12 +64,15 @@
     }
   },
   "files": [
-    "dist"
+    "dist",
+    "src"
   ],
   "dependencies": {
-    "@prosekit/core": "^0.8.3",
-    "@prosekit/web": "^0.7.0",
-    "@prosekit/pm": "^0.1.11"
+    "@prosemirror-adapter/core": "^0.4.5",
+    "@prosemirror-adapter/preact": "^0.4.5",
+    "@prosekit/web": "^0.7.4",
+    "@prosekit/core": "^0.8.4",
+    "@prosekit/pm": "^0.1.12"
   },
   "peerDependencies": {
     "preact": ">= 10.11.0"
@@ -80,10 +83,9 @@
     }
   },
   "devDependencies": {
-    "preact": "^10.27.0",
-    "tsdown": "^0.13.1",
-    "typescript": "~5.8.3",
-    "vitest": "^3.2.4",
+    "preact": "^10.27.2",
+    "tsdown": "^0.15.6",
+    "typescript": "~5.9.2",
     "@prosekit/config-tsdown": "0.0.0",
     "@prosekit/config-vitest": "0.0.0"
   },
@@ -95,12 +97,12 @@
       "prosekit-preact": "./src/index.ts",
       "prosekit-preact-autocomplete": "./src/components/autocomplete/index.gen.ts",
       "prosekit-preact-block-handle": "./src/components/block-handle/index.gen.ts",
+      "prosekit-preact-drop-indicator": "./src/components/drop-indicator/index.gen.ts",
       "prosekit-preact-inline-popover": "./src/components/inline-popover/index.gen.ts",
       "prosekit-preact-popover": "./src/components/popover/index.gen.ts",
       "prosekit-preact-resizable": "./src/components/resizable/index.gen.ts",
       "prosekit-preact-table-handle": "./src/components/table-handle/index.gen.ts",
-      "prosekit-preact-tooltip": "./src/components/tooltip/index.gen.ts",
-      "prosekit-preact-drop-indicator": "./src/components/drop-indicator/index.gen.ts"
+      "prosekit-preact-tooltip": "./src/components/tooltip/index.gen.ts"
     }
   },
   "scripts": {

package/src/components/autocomplete/autocomplete-empty.gen.ts

@@ -0,0 +1,34 @@
+import {
+  type AutocompleteEmptyElement,
+  type AutocompleteEmptyProps as Props,
+  type AutocompleteEmptyEvents as Events,
+  autocompleteEmptyProps,
+  autocompleteEmptyEvents,
+} from '@prosekit/web/autocomplete'
+import type {
+  ForwardRefExoticComponent,
+  HTMLAttributes,
+  RefAttributes,
+} from 'preact/compat'
+
+import { createComponent } from '../create-component'
+import type { CreateProps } from '../create-props'
+
+/**
+ * Props for the {@link AutocompleteEmpty} component.
+ */
+export interface AutocompleteEmptyProps extends Partial<CreateProps<Props, Events>> {}
+ 
+export const AutocompleteEmpty: ForwardRefExoticComponent<
+  Partial<AutocompleteEmptyProps> &
+  RefAttributes<AutocompleteEmptyElement> &
+  HTMLAttributes<AutocompleteEmptyElement>
+> = createComponent<
+  AutocompleteEmptyProps, 
+  AutocompleteEmptyElement
+>(
+  'prosekit-autocomplete-empty',
+  'AutocompleteEmpty',
+  Object.keys(autocompleteEmptyProps),
+  Object.keys(autocompleteEmptyEvents),
+)

package/src/components/autocomplete/autocomplete-item.gen.ts

@@ -0,0 +1,34 @@
+import {
+  type AutocompleteItemElement,
+  type AutocompleteItemProps as Props,
+  type AutocompleteItemEvents as Events,
+  autocompleteItemProps,
+  autocompleteItemEvents,
+} from '@prosekit/web/autocomplete'
+import type {
+  ForwardRefExoticComponent,
+  HTMLAttributes,
+  RefAttributes,
+} from 'preact/compat'
+
+import { createComponent } from '../create-component'
+import type { CreateProps } from '../create-props'
+
+/**
+ * Props for the {@link AutocompleteItem} component.
+ */
+export interface AutocompleteItemProps extends Partial<CreateProps<Props, Events>> {}
+ 
+export const AutocompleteItem: ForwardRefExoticComponent<
+  Partial<AutocompleteItemProps> &
+  RefAttributes<AutocompleteItemElement> &
+  HTMLAttributes<AutocompleteItemElement>
+> = createComponent<
+  AutocompleteItemProps, 
+  AutocompleteItemElement
+>(
+  'prosekit-autocomplete-item',
+  'AutocompleteItem',
+  Object.keys(autocompleteItemProps),
+  Object.keys(autocompleteItemEvents),
+)

package/src/components/autocomplete/autocomplete-list.gen.ts

@@ -0,0 +1,34 @@
+import {
+  type AutocompleteListElement,
+  type AutocompleteListProps as Props,
+  type AutocompleteListEvents as Events,
+  autocompleteListProps,
+  autocompleteListEvents,
+} from '@prosekit/web/autocomplete'
+import type {
+  ForwardRefExoticComponent,
+  HTMLAttributes,
+  RefAttributes,
+} from 'preact/compat'
+
+import { createComponent } from '../create-component'
+import type { CreateProps } from '../create-props'
+
+/**
+ * Props for the {@link AutocompleteList} component.
+ */
+export interface AutocompleteListProps extends Partial<CreateProps<Props, Events>> {}
+ 
+export const AutocompleteList: ForwardRefExoticComponent<
+  Partial<AutocompleteListProps> &
+  RefAttributes<AutocompleteListElement> &
+  HTMLAttributes<AutocompleteListElement>
+> = createComponent<
+  AutocompleteListProps, 
+  AutocompleteListElement
+>(
+  'prosekit-autocomplete-list',
+  'AutocompleteList',
+  Object.keys(autocompleteListProps),
+  Object.keys(autocompleteListEvents),
+)