@portabletext/plugin-markdown-shortcuts 8.0.21 → 8.0.23

package/README.md

@@ -1,6 +1,14 @@
 # `@portabletext/plugin-markdown-shortcuts`
 
-> ⬇️ Adds helpful Markdown shortcuts to the editor
+> Add helpful Markdown shortcuts to the editor
+
+## Installation
+
+```sh
+npm install @portabletext/plugin-markdown-shortcuts
+```
+
+## Usage
 
 Import the `MarkdownShortcutsPlugin` React component and place it inside the `EditorProvider` and tell it about your schema:
 
@@ -14,7 +22,7 @@ import {MarkdownShortcutsPlugin} from '@portabletext/plugin-markdown-shortcuts'
 
 const schemaDefinition = defineSchema({
   blockObjects: [{name: 'break'}],
-  annotations: [{name: 'link', fields: [{name: 'href', type: 'string'}]}]
+  annotations: [{name: 'link', fields: [{name: 'href', type: 'string'}]}],
   decorators: [
     {name: 'em'},
     {name: 'code'},
@@ -43,35 +51,36 @@ function App() {
     >
       <PortableTextEditable />
       <MarkdownShortcutsPlugin
-        boldDecorator={({schema}) =>
-          schema.decorators.find((d) => d.name === 'strong')?.name
+        boldDecorator={({context}) =>
+          context.schema.decorators.find((d) => d.name === 'strong')?.name
         }
-        codeDecorator={({schema}) =>
-          schema.decorators.find((d) => d.name === 'code')?.name
+        codeDecorator={({context}) =>
+          context.schema.decorators.find((d) => d.name === 'code')?.name
         }
-        italicDecorator={({schema}) =>
-          schema.decorators.find((d) => d.name === 'em')?.name
+        italicDecorator={({context}) =>
+          context.schema.decorators.find((d) => d.name === 'em')?.name
         }
-        strikeThroughDecorator={({schema}) =>
-          schema.decorators.find((d) => d.name === 'strike-through')?.name
+        strikeThroughDecorator={({context}) =>
+          context.schema.decorators.find((d) => d.name === 'strike-through')
+            ?.name
         }
-        defaultStyle={({schema}) =>
-          schema.styles.find((s) => s.name === 'normal')?.name
+        defaultStyle={({context}) =>
+          context.schema.styles.find((s) => s.name === 'normal')?.name
         }
-        headingStyle={({schema, level}) =>
-          schema.styles.find((s) => s.name === `h${level}`)?.name
+        headingStyle={({context, props}) =>
+          context.schema.styles.find((s) => s.name === `h${props.level}`)?.name
         }
-        blockquoteStyle={({schema}) =>
-          schema.styles.find((s) => s.name === 'blockquote')?.name
+        blockquoteStyle={({context}) =>
+          context.schema.styles.find((s) => s.name === 'blockquote')?.name
         }
-        orderedList={({schema}) =>
-          schema.lists.find((s) => s.name === 'number')?.name
+        orderedList={({context}) =>
+          context.schema.lists.find((s) => s.name === 'number')?.name
         }
-        unorderedList={({schema}) =>
-          schema.lists.find((s) => s.name === 'bullet')?.name
+        unorderedList={({context}) =>
+          context.schema.lists.find((s) => s.name === 'bullet')?.name
         }
-        horizontalRuleObject={({schema}) => {
-          const schemaType = schema.blockObjects.find(
+        horizontalRuleObject={({context}) => {
+          const schemaType = context.schema.blockObjects.find(
             (object) => object.name === 'break',
           )
 
@@ -81,8 +90,8 @@ function App() {
 
           return {_type: schemaType.name}
         }}
-        linkObject={({schema, href}) => {
-          const schemaType = schema.annotations.find(
+        linkObject={({context, props}) => {
+          const schemaType = context.schema.annotations.find(
             (annotation) => annotation.name === 'link',
           )
           const hrefField = schemaType?.fields.find(
@@ -95,7 +104,7 @@ function App() {
 
           return {
             _type: schemaType.name,
-            [hrefField.name]: href,
+            [hrefField.name]: props.href,
           }
         }}
       />
@@ -103,3 +112,22 @@ function App() {
   )
 }
 ```
+
+## Why look up the type in the schema?
+
+Each callback returns the type name as found in `context.schema` (for
+example `context.schema.decorators.find((d) => d.name === 'strong')?.name`)
+instead of a hardcoded `'strong'`. That lookup is what makes the plugin
+schema-aware: when the schema does not define the type, the lookup returns
+`undefined` and the shortcut is skipped, so the plugin never inserts a
+decorator, style, or object the schema does not declare. Hardcoding the
+string would fire the shortcut regardless and produce content the schema
+forbids.
+
+The same gating follows [containers](../schema/README.md#containers-and-sub-schemas),
+because `context.schema` is the schema resolved at the caret, not always the
+top-level one. Inside a code block whose sub-schema declares no decorators, a
+`boldDecorator` that looks up `strong` returns `undefined`, so the shortcut
+is skipped there too. Point each callback at `context.schema` rather than
+capturing the top-level schema and the shortcuts stay correct at every
+nesting level.

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@portabletext/plugin-markdown-shortcuts",
-  "version": "8.0.21",
-  "description": "Adds helpful Markdown shortcuts to the editor",
+  "version": "8.0.23",
+  "description": "Add helpful Markdown shortcuts to the editor",
   "keywords": [
     "portabletext",
     "plugin",
@@ -32,28 +32,28 @@
     "dist"
   ],
   "dependencies": {
-    "@portabletext/plugin-character-pair-decorator": "^8.0.21",
-    "@portabletext/plugin-input-rule": "^5.0.21"
+    "@portabletext/plugin-character-pair-decorator": "^8.0.23",
+    "@portabletext/plugin-input-rule": "^5.0.23"
   },
   "devDependencies": {
     "@sanity/tsconfig": "^2.1.0",
-    "@types/react": "^19.2.14",
+    "@types/react": "^19.2.17",
     "@vitejs/plugin-react": "^5.2.0",
-    "@vitest/browser": "^4.1.8",
-    "@vitest/browser-playwright": "^4.1.8",
+    "@vitest/browser": "^4.1.9",
+    "@vitest/browser-playwright": "^4.1.9",
     "babel-plugin-react-compiler": "^1.0.0",
     "eslint": "^9.39.1",
     "eslint-plugin-react-hooks": "^7.1.1",
-    "react": "^19.2.5",
+    "react": "^19.2.7",
     "typescript": "5.9.3",
     "typescript-eslint": "^8.48.0",
-    "vitest": "^4.1.8",
-    "@portabletext/editor": "^7.6.2",
-    "racejar": "2.0.8"
+    "vitest": "^4.1.9",
+    "@portabletext/editor": "^7.8.0",
+    "racejar": "2.0.9"
   },
   "peerDependencies": {
     "react": "^19.2",
-    "@portabletext/editor": "^7.6.2"
+    "@portabletext/editor": "^7.8.0"
   },
   "engines": {
     "node": ">=20.19 <22 || >=22.12"