@meowdown/react 0.9.0 → 0.11.0

package/README.md

@@ -48,6 +48,8 @@ The Markdown editor component. Renders inside a `div.meowdown` wrapper that fill
 - `onImagePaste?: (file: File) => string | undefined | Promise<string | undefined>`: persists a pasted or dropped image file and returns its markdown `src` (or `undefined` to decline), synchronously or as a promise. Pass a stable function. Ignored in source mode.
 - `onImageSaveError?: (error: unknown, file: File) => void`: called when `onImagePaste` throws. Defaults to `console.error`. Ignored in source mode.
 - `embedPaste?: boolean`: auto-embeds a pasted tweet or YouTube link as a rich embed; one undo turns the embed back into the raw link. On by default; set `false` to disable. Only takes effect when `resolveImageUrl` is set, since embeds render through the image pipeline. Ignored in source mode.
+- `bulletAfterHeading?: boolean`: pressing Enter at the end of the document's first heading (the title line) starts a fresh empty bullet on the next line instead of a plain paragraph. Off by default. Ignored in source mode.
+- `blockHandle?: boolean`: shows the per-block gutter handle in the rich modes (a drag grip for reordering blocks and a `+` add button, plus the drop indicator). On by default; set `false` to hide the gutter affordance entirely, e.g. when the host does not want block reordering. Ignored in source mode and when `readOnly` is set.
 - `placeholder?: string | ((state) => string)`: placeholder text shown when the whole document is empty. Pass a stable function. Ignored in source mode.
 - `readOnly?: boolean`: makes the editor read-only, in both the rich and source modes.
 - `spellCheck?: boolean`: toggles the browser's native spell checking in the rich modes. Defaults to the browser's behavior. Ignored in source mode.
@@ -60,6 +62,14 @@ The Markdown editor component. Renders inside a `div.meowdown` wrapper that fill
 
 Re-exported from `@prosekit/react`. Call it from a component passed as `children` to read the live editor instance.
 
+### `useKeymap`
+
+Re-exported from `@prosekit/react`. Registers a keymap on the editor from a `children` component; set its priority with `Priority` from `@meowdown/core`.
+
+### `useExtension`
+
+Re-exported from `@prosekit/react`. Applies an extension to the editor from a `children` component.
+
 ### `EditorHandle`
 
 Imperative handle for the editor, attached via `handleRef`.

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode, Ref } from "react";
 import { ImageOptions, MarkMode, PlaceholderOptions, TypedEditor, WikilinkClickHandler } from "@meowdown/core";
 import { SelectionJSON, SelectionJSON as SelectionJSON$1 } from "@prosekit/core";
-import { useEditor } from "@prosekit/react";
+import { useEditor, useExtension, useKeymap } from "@prosekit/react";
 
 //#region src/components/types.d.ts
 /** A selection to restore: an exact JSON selection, or a document edge. */
@@ -137,6 +137,20 @@ interface EditorProps {
    * the same image pipeline.
    */
   embedPaste?: boolean;
+  /**
+   * Pressing Enter at the end of the document's first heading (the title line)
+   * starts a fresh empty bullet on the next line instead of a plain paragraph.
+   * Off by default. Ignored in source mode.
+   */
+  bulletAfterHeading?: boolean;
+  /**
+   * Shows the per-block gutter handle in the rich modes: a drag grip for
+   * reordering blocks and a "+" add button, plus the drop indicator that
+   * visualizes where a dragged block will land. On by default. Set to `false`
+   * to hide the gutter affordance entirely, e.g. when the host does not want
+   * block reordering. Ignored in source mode and when `readOnly` is set.
+   */
+  blockHandle?: boolean;
   /**
    * Placeholder text shown when the whole document is empty. A function
    * receives the editor state. Pass a stable function. Ignored in source mode.
@@ -169,6 +183,8 @@ declare function MeowdownEditor({
   onImagePaste,
   onImageSaveError,
   embedPaste,
+  bulletAfterHeading,
+  blockHandle,
   placeholder,
   readOnly,
   spellCheck,
@@ -178,4 +194,4 @@ declare function MeowdownEditor({
   children
 }: EditorProps): import("react").JSX.Element;
 //#endregion
-export { type EditorHandle, type EditorMode, type EditorProps, type EditorStateSnapshot, MeowdownEditor, type SelectionHint, type SelectionJSON, type TagItem, type TagSearchHandler, type WikilinkItem, type WikilinkSearchHandler, useEditor };
+export { type EditorHandle, type EditorMode, type EditorProps, type EditorStateSnapshot, MeowdownEditor, type SelectionHint, type SelectionJSON, type TagItem, type TagSearchHandler, type WikilinkItem, type WikilinkSearchHandler, useEditor, useExtension, useKeymap };

package/dist/index.js

@@ -7,10 +7,10 @@ import { Compartment, EditorSelection, EditorState } from "@codemirror/state";
 import { EditorView, keymap } from "@codemirror/view";
 import { clamp } from "@ocavue/utils";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { codeBlockLanguages, defineEditorExtension, defineEmbedPaste, defineImages, defineMarkMode, definePlaceholder, defineReadonly, defineWikilinkClickHandler, docToMarkdown, markdownToDoc } from "@meowdown/core";
+import { codeBlockLanguages, defineBulletAfterHeading, defineEditorExtension, defineEmbedPaste, defineImages, defineMarkMode, definePlaceholder, defineReadonly, defineWikilinkClickHandler, docToMarkdown, markdownToDoc } from "@meowdown/core";
 import { canUseRegexLookbehind, createEditor, defineDocChangeHandler, union } from "@prosekit/core";
 import { Selection, TextSelection } from "@prosekit/pm/state";
-import { ProseKit, defineReactNodeView, useEditor, useEditor as useEditor$1, useEditorDerivedValue, useExtension } from "@prosekit/react";
+import { ProseKit, defineReactNodeView, useEditor, useEditor as useEditor$1, useEditorDerivedValue, useExtension, useExtension as useExtension$1, useKeymap } from "@prosekit/react";
 import { Combobox } from "@base-ui/react/combobox";
 import { BlockHandleAdd, BlockHandleDraggable, BlockHandlePopup, BlockHandlePositioner, BlockHandleRoot } from "@prosekit/react/block-handle";
 import { DropIndicator } from "@prosekit/react/drop-indicator";
@@ -436,20 +436,20 @@ function DropIndicator$1() {
 
 //#endregion
 //#region src/components/editor-extensions.tsx
-function EditorExtensions({ markMode, onDocChange, onWikilinkClick, resolveImageUrl, onImagePaste, onImageSaveError, embedPaste, placeholder, readOnly }) {
-	useExtension(useMemo(() => {
+function EditorExtensions({ markMode, onDocChange, onWikilinkClick, resolveImageUrl, onImagePaste, onImageSaveError, embedPaste, bulletAfterHeading, placeholder, readOnly }) {
+	useExtension$1(useMemo(() => {
 		return defineMarkMode(markMode);
 	}, [markMode]));
-	useExtension(useMemo(() => {
+	useExtension$1(useMemo(() => {
 		return readOnly ? defineReadonly() : null;
 	}, [readOnly]));
-	useExtension(useMemo(() => {
+	useExtension$1(useMemo(() => {
 		return onDocChange ? defineDocChangeHandler(onDocChange) : null;
 	}, [onDocChange]));
-	useExtension(useMemo(() => {
+	useExtension$1(useMemo(() => {
 		return onWikilinkClick ? defineWikilinkClickHandler(onWikilinkClick) : null;
 	}, [onWikilinkClick]));
-	useExtension(useMemo(() => {
+	useExtension$1(useMemo(() => {
 		return resolveImageUrl ? defineImages({
 			resolveImageUrl,
 			onImagePaste,
@@ -460,10 +460,13 @@ function EditorExtensions({ markMode, onDocChange, onWikilinkClick, resolveImage
 		onImagePaste,
 		onImageSaveError
 	]));
-	useExtension(useMemo(() => {
+	useExtension$1(useMemo(() => {
 		return embedPaste && resolveImageUrl ? defineEmbedPaste() : null;
 	}, [embedPaste, resolveImageUrl]));
-	useExtension(useMemo(() => {
+	useExtension$1(useMemo(() => {
+		return bulletAfterHeading ? defineBulletAfterHeading() : null;
+	}, [bulletAfterHeading]));
+	useExtension$1(useMemo(() => {
 		return placeholder ? definePlaceholder({
 			placeholder,
 			strategy: "doc"
@@ -910,7 +913,7 @@ function resolveSelection(doc, selection) {
 		return TextSelection.between(doc.resolve(anchor), doc.resolve(head));
 	}
 }
-function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onTagSearch, onWikilinkSearch, onWikilinkClick, resolveImageUrl, onImagePaste, onImageSaveError, embedPaste, placeholder, readOnly, spellCheck, editorClassName, ref, children }) {
+function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onTagSearch, onWikilinkSearch, onWikilinkClick, resolveImageUrl, onImagePaste, onImageSaveError, embedPaste, bulletAfterHeading, blockHandle = true, placeholder, readOnly, spellCheck, editorClassName, ref, children }) {
 	const [editor] = useState(() => {
 		const editor = createEditor({ extension: union(defineEditorExtension(), defineCodeBlockView()) });
 		if (initialMarkdown) editor.setContent(markdownToDoc(initialMarkdown, editor.nodes));
@@ -989,12 +992,13 @@ function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onTa
 				onImagePaste,
 				onImageSaveError,
 				embedPaste,
+				bulletAfterHeading,
 				placeholder,
 				readOnly
 			}),
-			/* @__PURE__ */ jsx(BlockHandle, {}),
+			blockHandle && !readOnly && /* @__PURE__ */ jsx(BlockHandle, {}),
 			!readOnly && /* @__PURE__ */ jsx(TableHandle, {}),
-			/* @__PURE__ */ jsx(DropIndicator$1, {}),
+			blockHandle && !readOnly && /* @__PURE__ */ jsx(DropIndicator$1, {}),
 			/* @__PURE__ */ jsx(SlashMenu, {}),
 			onTagSearch && /* @__PURE__ */ jsx(TagMenu, { onTagSearch }),
 			onWikilinkSearch && /* @__PURE__ */ jsx(WikilinkMenu, { onWikilinkSearch }),
@@ -1005,7 +1009,7 @@ function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onTa
 
 //#endregion
 //#region src/components/editor.tsx
-function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onTagSearch, onWikilinkSearch, onWikilinkClick, resolveImageUrl, onImagePaste, onImageSaveError, embedPaste = true, placeholder, readOnly, spellCheck, editorClassName, wrapperClassName, handleRef, children }) {
+function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onTagSearch, onWikilinkSearch, onWikilinkClick, resolveImageUrl, onImagePaste, onImageSaveError, embedPaste = true, bulletAfterHeading = false, blockHandle = true, placeholder, readOnly, spellCheck, editorClassName, wrapperClassName, handleRef, children }) {
 	const childRef = useRef(null);
 	useImperativeHandle(handleRef, () => {
 		function getMarkdown() {
@@ -1074,6 +1078,8 @@ function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onTagSea
 			onImagePaste,
 			onImageSaveError,
 			embedPaste,
+			bulletAfterHeading,
+			blockHandle,
 			placeholder,
 			readOnly,
 			spellCheck,
@@ -1084,4 +1090,4 @@ function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onTagSea
 }
 
 //#endregion
-export { MeowdownEditor, useEditor };
+export { MeowdownEditor, useEditor, useExtension, useKeymap };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@meowdown/react",
   "type": "module",
-  "version": "0.9.0",
+  "version": "0.11.0",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -28,7 +28,7 @@
     "@prosekit/pm": "^0.1.18",
     "@prosekit/react": "^0.8.0-beta.2",
     "clsx": "^2.1.1",
-    "@meowdown/core": "0.9.0"
+    "@meowdown/core": "0.11.0"
   },
   "peerDependencies": {
     "react": "^19.0.0",
@@ -48,12 +48,12 @@
     "@tsdown/css": "^0.22.2",
     "@types/react": "^19.2.17",
     "@types/react-dom": "^19.2.3",
-    "@vitest/browser-playwright": "^4.1.8",
+    "@vitest/browser-playwright": "^4.1.9",
     "dedent": "^1.7.2",
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
     "tsdown": "^0.22.2",
-    "vitest": "^4.1.8",
+    "vitest": "^4.1.9",
     "vitest-browser-commands": "^0.2.1",
     "vitest-browser-react": "^2.2.0"
   },