@meowdown/react 0.10.0 → 0.11.1

package/README.md

@@ -62,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. */
@@ -194,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

@@ -10,7 +10,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 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";
@@ -437,19 +437,19 @@ function DropIndicator$1() {
 //#endregion
 //#region src/components/editor-extensions.tsx
 function EditorExtensions({ markMode, onDocChange, onWikilinkClick, resolveImageUrl, onImagePaste, onImageSaveError, embedPaste, bulletAfterHeading, placeholder, readOnly }) {
-	useExtension(useMemo(() => {
+	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,13 +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(useMemo(() => {
+	useExtension$1(useMemo(() => {
 		return placeholder ? definePlaceholder({
 			placeholder,
 			strategy: "doc"
@@ -480,6 +480,7 @@ function EditorExtensions({ markMode, onDocChange, onWikilinkClick, resolveImage
 var autocomplete_menu_module_default = {
 	"Detail": "meow_Detail_Dqll0G",
 	"Item": "meow_Item_Dqll0G",
+	"Label": "meow_Label_Dqll0G",
 	"Popup": "meow_Popup_Dqll0G",
 	"Positioner": "meow_Positioner_Dqll0G"
 };
@@ -826,7 +827,10 @@ function TagMenu({ onTagSearch }) {
 						editor.commands.insertText({ text: `#${item.tag} ` });
 						item.onSelect?.();
 					},
-					children: [/* @__PURE__ */ jsx("span", { children: item.label ?? `#${item.tag}` }), item.detail ? /* @__PURE__ */ jsx("span", {
+					children: [/* @__PURE__ */ jsx("span", {
+						className: autocomplete_menu_module_default.Label,
+						children: item.label ?? `#${item.tag}`
+					}), item.detail ? /* @__PURE__ */ jsx("span", {
 						className: autocomplete_menu_module_default.Detail,
 						children: item.detail
 					}) : null]
@@ -886,7 +890,10 @@ function WikilinkMenu({ onWikilinkSearch }) {
 						editor.commands.insertText({ text: `[[${item.target}]]` });
 						item.onSelect?.();
 					},
-					children: [/* @__PURE__ */ jsx("span", { children: item.label ?? item.target }), item.detail ? /* @__PURE__ */ jsx("span", {
+					children: [/* @__PURE__ */ jsx("span", {
+						className: autocomplete_menu_module_default.Label,
+						children: item.label ?? item.target
+					}), item.detail ? /* @__PURE__ */ jsx("span", {
 						className: autocomplete_menu_module_default.Detail,
 						children: item.detail
 					}) : null]
@@ -1090,4 +1097,4 @@ function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onTagSea
 }
 
 //#endregion
-export { MeowdownEditor, useEditor };
+export { MeowdownEditor, useEditor, useExtension, useKeymap };

package/dist/style.css

@@ -264,7 +264,7 @@
 }
 .meow_Positioner_Dqll0G {
   z-index: 50;
-  width: min-content;
+  width: min(24rem, 100vw - 1rem);
   height: min-content;
   display: block;
   overflow: visible;
@@ -279,11 +279,13 @@
   background: light-dark(#fff, #18181b);
   border-radius: .75rem;
   flex-direction: column;
-  min-width: 15rem;
+  width: 100%;
+  min-width: min(15rem, 100%);
+  max-width: 100%;
   max-height: 25rem;
   padding: .25rem;
   display: flex;
-  overflow-y: auto;
+  overflow: hidden auto;
   box-shadow: 0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;
 }
 
@@ -297,6 +299,7 @@
   justify-content: space-between;
   align-items: center;
   gap: 1.5rem;
+  min-width: 0;
   padding: .375rem .75rem;
   scroll-margin: .25rem;
   font-size: .875rem;
@@ -318,10 +321,19 @@
   }
 }
 
+.meow_Label_Dqll0G {
+  text-overflow: ellipsis;
+  min-width: 0;
+  overflow: hidden;
+}
+
 .meow_Detail_Dqll0G {
+  text-overflow: ellipsis;
+  max-width: 40%;
   color: var(--meowdown-muted);
   flex-shrink: 0;
   font-size: .8125rem;
+  overflow: hidden;
 }
 .meow_Positioner_hpZLgq, .meow_MenuPositioner_hpZLgq {
   z-index: 50;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@meowdown/react",
   "type": "module",
-  "version": "0.10.0",
+  "version": "0.11.1",
   "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.10.0"
+    "@meowdown/core": "0.11.1"
   },
   "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"
   },