@witchcraft/editor 0.0.1

package/src/runtime/pm/features/Base/plugins/unfocusedSelectionIndicatorPlugin.ts

@@ -0,0 +1,107 @@
+import { type EditorState, Plugin, PluginKey, type Selection, TextSelection, type Transaction } from "@tiptap/pm/state"
+import { Decoration, DecorationSet, type EditorView } from "@tiptap/pm/view"
+
+export const unfocusedSelectionIndicatorKey = new PluginKey("unfocusedSelectionIndicator")
+/**
+ * Shows a fake selection decoration while the editor is unfocused and restores the previous selection\* when the editor gains focus again. It also prevents initial focus in events from changing the selection (when it's a selection and not a single position).
+ *
+ * So if the user focuses on something like the search bar or the devtools panel, focusing back to the editor doesn't change the selection.
+ *
+ * Focusing other elements inside the editor does not count as blurring the editor.
+ *
+ * The plugin will add three classes to the decorations, the main class to all the nodes, then the start and end classes to the start and end nodes respectively. This is so you can style the selection correctly since everything from the start right up to the end will have a little extra padding to the right. Therefore technically the start class is not needed, but it's there if needed.
+ *
+ * Some css like this is needed to make it work. The tailwind classes already include some `pm-unfocused-selection` and `pm-unfocused-selection-end` utility classes that take care of this. They use the css variable `--pmUnfocusedSelectionColor` to set the color. They look like this:
+ *
+ * ```scss
+ * .pm-unfocused-selection {
+ * 	background-color: var(--pmUnfocusedSelectionColor);
+ * 	box-shadow: 5px 0 0 0 var(--pmUnfocusedSelectionColor);
+ * }
+ * .pm-unfocused-selection-end {
+ * 	box-shadow: none;
+ * }
+ * ```
+ * Note regarding styling:
+ *
+ * It does not seem possible to get the real default color of selections so the best alternative is probably to use a custom selection color for the real selection. But just setting the same color to both won't work. The real selection gets some transparency added automatically so they will look different, plus the text changes color to indicate focus (which we wouldn't really want).
+ *
+ * Other Notes:
+ * - Whenever it restores a selection or the editor loses focus it must dispatch a new transaction which will have the "unfocused-selection" meta if you need to filter it.
+ * - If you want to hide the unfocused selection decorations you can set the
+ *   `hide-unfocused-selection` meta on the transaction.
+ * - If you change the selection while the editor is considered unfocused, the saved selection will be changed to the new selection.
+ */
+export function unfocusedSelectionIndicatorPlugin(
+	{
+		main: mainClass = "pm-unfocused-selection",
+		start: startClass = `${mainClass}-start`,
+		end: endClass = `${mainClass}-end`
+	}: Partial<Record<"main" | "start" | "end", string>> = {}): Plugin {
+	return new Plugin<{
+		decos: DecorationSet
+		savedSel: Selection | undefined
+	}>({
+		key: unfocusedSelectionIndicatorKey,
+		state: {
+			init() {
+				return {
+					decos: DecorationSet.empty,
+					savedSel: undefined
+				}
+			},
+			apply(tr: Transaction, value, _oldState, newState) {
+				const trValue = tr.getMeta(unfocusedSelectionIndicatorKey)
+				if (!trValue) return value
+				const newValue = { ...value, ...trValue }
+				if (!newValue.savedSel) {
+					newValue.decos = DecorationSet.empty
+					return newValue
+				}
+				const { from, to } = newValue.savedSel
+				if (newState.selection.from !== from || newState.selection.to !== to) {
+					newValue.savedSel = newState.selection
+				}
+
+				const hideUnfocusedSelection = from === to || !!tr.getMeta("hide-unfocused-selection")
+				newValue.decos = hideUnfocusedSelection
+					? DecorationSet.empty
+					: DecorationSet.create(tr.doc, [
+							Decoration.inline(from, from + 1, { class: `${mainClass} ${startClass}` }),
+							Decoration.inline(from + 1, to - 1, { class: `${mainClass}` }),
+							Decoration.inline(to - 1, to, { class: `${mainClass} ${endClass}` })
+						])
+
+				return newValue
+			}
+		},
+
+		props: {
+			decorations(state: EditorState) {
+				return this.getState(state)?.decos
+			},
+			handleDOMEvents: {
+				blur(view: EditorView, e: FocusEvent) {
+					if (e.relatedTarget instanceof Node && view.dom.contains(e.relatedTarget)) return
+					const tr = view.state.tr
+					if (!view.state.selection.empty) {
+						tr.setMeta("unfocused-selection", true)
+						tr.setMeta(unfocusedSelectionIndicatorKey, { savedSel: view.state.selection })
+					}
+					view.dispatch(tr)
+				},
+				focusin(view: EditorView) {
+					const savedSel = unfocusedSelectionIndicatorKey.getState(view.state)?.savedSel
+					if (savedSel) {
+						const tr = view.state.tr
+						tr.setMeta("unfocused-selection", true)
+						tr.setMeta(unfocusedSelectionIndicatorKey, { savedSel: undefined })
+						tr.setSelection(TextSelection.create(view.state.doc, savedSel.from, savedSel.to))
+						view.dispatch(tr)
+					}
+				}
+
+			}
+		}
+	})
+}

package/src/runtime/pm/features/Base/types.ts

@@ -0,0 +1,3 @@
+import type { WithOnTriggerByEmbeddedBlockOptions } from "../EmbeddedDocument/types.js"
+
+export interface BaseExtensionOptions extends WithOnTriggerByEmbeddedBlockOptions { }

package/src/runtime/pm/features/BaseShortcuts/BaseShortcuts.ts

@@ -0,0 +1,39 @@
+import { Extension } from "@tiptap/core"
+
+/** Extension for providing only the most basic shortcuts. */
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export const BaseShortcuts = Extension.create({
+	name: "BaseShortcuts",
+	addKeyboardShortcuts() {
+		/* eslint-disable @typescript-eslint/naming-convention */
+		return {
+			Backspace: () => this.editor.commands.backspace(),
+			[`Ctrl-Backspace`]: () => this.editor.commands.deleteItem(),
+			[`Ctrl-z`]: () => this.editor.commands.undo(),
+			[`Ctrl-Shift-z`]: () => this.editor.commands.redo(),
+			[`Ctrl-y`]: () => this.editor.commands.redo(),
+			[`Ctrl-b`]: () => this.editor.commands.toggleBold(),
+			[`Ctrl-i`]: () => this.editor.commands.toggleItalic(),
+			Enter: () => this.editor.commands.enter(),
+			[`Shift-Enter`]: () => this.editor.commands.first(({ commands }) => [
+				() => commands.blockquoteShiftEnter(),
+				() => commands.insertBreak()
+			]),
+			[`Ctrl-.`]: () => this.editor.commands.indentItem(),
+			[`Ctrl-,`]: () => this.editor.commands.unindentItem(),
+			[`Ctrl-Space`]: () => {
+				return this.editor.commands.openItemMenu("item")
+			},
+			Escape: () => this.editor.commands.first(({ commands }) => [
+				() => commands.closeLinkMenu(),
+				() => commands.blur()
+			]),
+			Tab: () => this.editor.commands.codeBlockIndent(),
+			[`Shift-Tab`]: () => this.editor.commands.codeBlockUnindent(),
+			[`Ctrl-k`]: () => this.editor.commands.openLinkMenu(),
+			[`Ctrl-Shift-k`]: () => this.editor.commands.openLinkMenu({ type: "internal" }),
+			[`Ctrl-Alt-k`]: () => this.editor.commands.expandSelectionToLink()
+		}
+	}
+})

package/src/runtime/pm/features/Blockquote/Blockquote.ts

@@ -0,0 +1,75 @@
+import { InputRule, mergeAttributes, Node } from "@tiptap/core"
+import { Blockquote as TiptapBlockquote } from "@tiptap/extension-blockquote"
+import { TextSelection } from "@tiptap/pm/state"
+
+import { blockquoteEnter } from "./commands/blockquoteEnter.js"
+import { blockquoteShiftEnter } from "./commands/blockquoteShiftEnter.js"
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export const Blockquote = TiptapBlockquote.extend({
+	name: "blockquote" satisfies NodeBlockquoteName,
+	content: "paragraph+ cite?",
+	addOptions() {
+		return {
+
+			...(this as any).parent?.(),
+			HTMLAttributes: {
+				class: "border-l-4 border-neutral-400 pl-2 dark:border-neutral-600"
+			}
+		}
+	},
+	addCommands() {
+		return {
+			blockquoteShiftEnter: blockquoteShiftEnter(this.name),
+			blockquoteEnter: blockquoteEnter(this.name)
+		}
+	}
+})
+
+export type NodeBlockquoteName = "blockquote"
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export const Cite = Node.create({
+	name: "cite" satisfies NodeCiteName,
+	content: "inline+",
+	parseHTML() {
+		return [
+			{ tag: "cite" }
+		]
+	},
+
+	// eslint-disable-next-line @typescript-eslint/naming-convention
+	renderHTML({ HTMLAttributes }) {
+		return [
+			"cite",
+			mergeAttributes(HTMLAttributes, {
+				class: "text-neutral-700 dark:text-neutral-400 before:content-['—']"
+			}),
+			0
+		]
+	},
+	addInputRules() {
+		return [
+			// tiptap's nodeInputRule doesn't work well at all for this situation
+			new InputRule({
+				find: /(?:^|\s)---\s?$/,
+				handler: ({ state, range }) => {
+					const { tr } = state
+					const start = range.from
+					const end = range.to
+					const insertionStart = start - 1
+					const $pos = tr.doc.resolve(insertionStart)
+					if ($pos.node().type.name !== "blockquote") {
+						return null
+					}
+					tr.delete(insertionStart, end)
+					tr.insert(insertionStart, this.type.create())
+					tr.setSelection(TextSelection.create(tr.doc, tr.mapping.map(insertionStart)))
+					tr.scrollIntoView()
+					return undefined
+				}
+			})
+		]
+	}
+})
+export type NodeCiteName = "cite"

package/src/runtime/pm/features/Blockquote/commands/blockquoteEnter.ts

@@ -0,0 +1,51 @@
+import { type Command, getNodeType } from "@tiptap/core"
+import type { NodeType } from "@tiptap/pm/model"
+import { TextSelection } from "@tiptap/pm/state"
+
+declare module "@tiptap/core" {
+
+	// eslint-disable-next-line @typescript-eslint/naming-convention
+	interface Commands<ReturnType> {
+		blockquoteEnter: {
+			blockquoteEnter: (pos?: number) => ReturnType
+		}
+	}
+}
+/** Allows blockquotes enter to work if possible, otherwise fallsback to creating and focusing a new node of the given fallback type after the blockquote containing item. */
+export const blockquoteEnter = (
+	blockQuoteTypeOrName: string | NodeType,
+	citationTypeOrName: string | NodeType = "cite",
+	fallbackNodeTypeOrName: string | NodeType = "item"
+) => (pos?: number): Command => ({ tr, dispatch, state }) => {
+	const { $from, $to, empty } = tr.selection
+	const $pos = pos !== undefined ? tr.doc.resolve(pos) : $to
+	const blockquoteType = getNodeType(blockQuoteTypeOrName, state.schema)
+	const citationType = getNodeType(citationTypeOrName, state.schema)
+	const fallbackNodeType = getNodeType(fallbackNodeTypeOrName, state.schema)
+
+	const matchesQuote = $pos.node(-1).type === blockquoteType
+		|| $from.node(-1).type === blockquoteType
+	const matchesCite = $pos.node().type === citationType
+		|| $from.node().type === citationType
+
+	if (matchesQuote || matchesCite) {
+		const node = fallbackNodeType.createAndFill()
+		if (!node) return false
+		if (dispatch) {
+			if (pos === undefined && !empty) {
+				tr.delete($from.pos, $to.pos)
+			}
+			const position = pos ?? $to.pos
+			const $position = tr.doc.resolve(position)
+			const isAtEnd = position === $position.end()
+			if (isAtEnd || matchesCite) {
+				tr.insert(matchesCite ? $position.end() + 1 : position, node)
+				tr.setSelection(TextSelection.near(tr.doc.resolve(tr.mapping.map(matchesCite ? $position.end() + 1 : position + 1)), isAtEnd ? -1 : 1))
+			} else {
+				tr.split(tr.mapping.map(pos ?? $to.pos), 3)
+			}
+		}
+		return true
+	}
+	return false
+}

package/src/runtime/pm/features/Blockquote/commands/blockquoteShiftEnter.ts

@@ -0,0 +1,26 @@
+import { type Command, getNodeType } from "@tiptap/core"
+import type { NodeType } from "@tiptap/pm/model"
+
+declare module "@tiptap/core" {
+
+	// eslint-disable-next-line @typescript-eslint/naming-convention
+	interface Commands<ReturnType> {
+		blockquoteShiftEnter: {
+			blockquoteShiftEnter: () => ReturnType
+		}
+	}
+}
+/** Allows blockquotes to have multiple paragraphs. */
+export const blockquoteShiftEnter = (
+	blockQuoteTypeOrName: string | NodeType
+) => (): Command => ({ tr, dispatch, state }) => {
+	const { $from, $to, from } = tr.selection
+	const blockquoteType = getNodeType(blockQuoteTypeOrName, state.schema)
+	if ($from.node(-1)?.type === blockquoteType || $to.node(-1)?.type === blockquoteType) {
+		if (dispatch) {
+			tr.split(from, 1)
+		}
+		return true
+	}
+	return false
+}

package/src/runtime/pm/features/Blocks/Blocks.ts

@@ -0,0 +1,3 @@
+/* Blocks require two extensions to work.  See them for details. */
+export { Item } from "./Item.js"
+export { List } from "./List.js"

package/src/runtime/pm/features/Blocks/Item.ts

@@ -0,0 +1,176 @@
+import { keys } from "@alanscodelog/utils"
+import { mergeAttributes, Node } from "@tiptap/core"
+import { VueNodeViewRenderer } from "@tiptap/vue-3"
+import { nanoid } from "nanoid"
+
+import { changeItemType } from "./commands/changeItemType.js"
+import { copyOrMoveItem } from "./commands/copyOrMoveItem.js"
+import { deleteItem } from "./commands/deleteItem.js"
+import { indentItem } from "./commands/indentItem.js"
+import { closeItemMenu, openItemMenu, toggleItemMenu } from "./commands/itemMenuCommands.js"
+import { moveItem } from "./commands/moveItem.js"
+import { splitItem } from "./commands/splitItem.js"
+import { unindentItem } from "./commands/unindentItem.js"
+import ItemNodeView from "./components/ItemNodeView.vue"
+import { ensureLastItemIsContentPlugin } from "./plugins/ensureLastItemIsContentPlugin.js"
+import { itemBlockIdPlugin } from "./plugins/itemBlockIdPlugin.js"
+import { itemHasSingularSelectionPlugin } from "./plugins/itemHasSingularSelectionPlugin.js"
+import { itemMenuPlugin } from "./plugins/itemMenuPlugin.js"
+import { statefulStates } from "./states/stateful.js"
+import { itemMenuPluginKey, type ItemNodeOptions } from "./types.js"
+
+declare module "@tiptap/core" {
+	// eslint-disable-next-line @typescript-eslint/naming-convention
+	interface Commands<ReturnType> {
+		item: {
+			deleteItem: (pos?: number) => ReturnType
+		}
+	}
+}
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export const Item = Node.create<ItemNodeOptions>({
+	name: "item" satisfies NodeItemName,
+	content: "block list? | list",
+
+	addOptions() {
+		return {
+			HTMLAttributes: {},
+			states: statefulStates,
+			types: [
+				"none",
+				"ordered",
+				// todo list all list-style-types
+				"unordered",
+				"ordered-upper-roman",
+				"ordered-lower-roman",
+				...keys(statefulStates).map(type => `stateful-${type}`)
+				// "unordered-square",
+			],
+			idLength: 10,
+			allowAnyIdLength: true,
+			ensureLastItemIsParagraph: true
+		}
+	},
+	addAttributes() {
+		return {
+			type: {
+				default: "none"
+			},
+			state: {
+				default: undefined
+			},
+			hideChildren: {
+				default: false
+			},
+			blockId: {
+				default: () => nanoid(this.options.idLength),
+				keepOnSplit: false
+			}
+		}
+	},
+
+	parseHTML() {
+		return [
+			{
+				tag: "li",
+				// totest
+				getAttrs: node => {
+					const blockId = (node as HTMLElement).getAttribute("blockid") ?? nanoid(this.options.idLength)
+					const type = (node as HTMLElement).getAttribute("type")
+					const hideChildren = (node as HTMLElement).getAttribute("hidechildren")
+					const base = { type, hideChildren: hideChildren === "true", blockId }
+					if (type && this.options.types.includes(type)) {
+						if (type.startsWith("stateful")) {
+							const state = (node as HTMLElement).getAttribute("state")
+							const stateTypeEntry = this.options.states[type.slice(9)]
+							if (stateTypeEntry !== undefined) {
+								if (stateTypeEntry.entries.find(entry => entry.value === state) !== undefined) {
+									// todo children
+									return { ...base, state }
+								} else {
+									return { ...base, state: stateTypeEntry.default }
+								}
+							}
+						}
+						return base
+					} else {
+						const role = (node as HTMLElement).getAttribute("role")
+						const ariaChecked = (node as HTMLElement).getAttribute("aria-checked")
+						if (role === "checkbox") {
+							if (ariaChecked === "true") {
+								return { type, state: "checked", blockId }
+							} else {
+								return { type, state: "unchecked", blockId }
+							}
+						}
+					}
+					return type !== undefined ? null : false
+				}
+			},
+			{ tag: "ol > li", attrs: { type: "ordered", blockId: nanoid(this.options.idLength) } },
+			{ tag: "ul > li", attrs: { type: "unordered" }, blockId: nanoid(this.options.idLength) }
+		]
+	},
+
+	// eslint-disable-next-line @typescript-eslint/naming-convention
+	renderHTML({ HTMLAttributes }) {
+		return [
+			"li",
+			mergeAttributes(
+				this.options.HTMLAttributes,
+				HTMLAttributes
+			),
+			0
+		]
+	},
+	addCommands() {
+		return {
+			changeItemType: changeItemType({
+				nodeType: this.name,
+				allowedValues: this.options.types,
+				attributeKey: "type",
+				allowedStates: statefulStates,
+				stateAttributeKey: "state"
+			}),
+			deleteItem: deleteItem(this.name),
+			indentItem: indentItem(this.name, "list"),
+			unindentItem: unindentItem(this.name),
+			copyOrMoveItem: copyOrMoveItem(),
+			moveItem: moveItem(this.name),
+			splitItem: splitItem(this.name),
+			openItemMenu: openItemMenu(this.name),
+			closeItemMenu: closeItemMenu(),
+			toggleItemMenu: toggleItemMenu()
+		}
+	},
+
+	addNodeView() {
+		return VueNodeViewRenderer(ItemNodeView as any)
+	},
+
+	onCreate() {
+		if ("registerMenu" in this.editor.commands) {
+			this.editor.commands.registerMenu({
+				type: "context",
+				closeCommand: "closeItemMenu",
+				name: "itemMenu",
+				pluginKey: itemMenuPluginKey,
+				priority: 100,
+				canShow: (_state, pluginState) => !!pluginState?.opened
+			})
+		}
+	},
+	addProseMirrorPlugins() {
+		const self = this
+		return [
+			ensureLastItemIsContentPlugin("paragraph", this.name, {
+				initialState: this.options.ensureLastItemIsParagraph ?? true
+			}),
+			itemMenuPlugin(),
+			itemBlockIdPlugin(self),
+			itemHasSingularSelectionPlugin()
+		]
+	}
+})
+export type NodeItemName = "item"

package/src/runtime/pm/features/Blocks/List.ts

@@ -0,0 +1,67 @@
+import { mergeAttributes, Node } from "@tiptap/core"
+
+import { setNode } from "./commands/setNode.js"
+import type { ListNodeOptions } from "./types.js"
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export const List = Node.create<ListNodeOptions>({
+	name: "list" satisfies NodeListName,
+	content: "item+",
+	allowGapCursor: true,
+	addOptions() {
+		return { HTMLAttributes: {} }
+	},
+	addAttributes() {
+		return {
+			type: {
+				default: "list"
+			}
+		}
+	},
+
+	addCommands() {
+		return {
+			// override tiptap's setNode
+			setNode: setNode()
+		}
+	},
+	parseHTML() {
+		const getAttrs = (node: HTMLElement): false | { type: string } => {
+			const type = (node as HTMLElement).getAttribute("node-type")
+			if (type === "list") {
+				return { type }
+			} else return false
+		}
+		return [
+			{
+				tag: "ul",
+				getAttrs
+
+			},
+			{
+				tag: "ol",
+				getAttrs
+			}
+		]
+	},
+
+	// eslint-disable-next-line @typescript-eslint/naming-convention
+	renderHTML({ HTMLAttributes, node }) {
+		return [
+			"ul",
+			mergeAttributes(
+				this.options.HTMLAttributes,
+				{
+					"node-type": node.attrs.type,
+					role: "list"
+				},
+				HTMLAttributes,
+				{
+					class: `list flex flex-col gap-1 ${HTMLAttributes?.class ?? this.options.HTMLAttributes?.class ?? ""}`
+				}
+			),
+			0
+		]
+	}
+})
+export type NodeListName = "list"

package/src/runtime/pm/features/Blocks/commands/changeItemType.ts

@@ -0,0 +1,64 @@
+import type { Command } from "@tiptap/core"
+
+import type { CommandAttributeOptions } from "../../../../types/index.js"
+import { findUpwards } from "../../../utils/findUpwards.js"
+import type { StatefulNodeStates } from "../types.js"
+
+declare module "@tiptap/core" {
+	// eslint-disable-next-line @typescript-eslint/naming-convention
+	interface Commands<ReturnType> {
+		changeItemType: {
+			changeItemType: (opts: {
+				type: string
+				state?: string
+			}, pos?: number) => ReturnType
+		}
+	}
+}
+
+export const changeItemType = ({
+	nodeType,
+	allowedValues,
+	allowedStates,
+	stateAttributeKey,
+	attributeKey
+}:
+	CommandAttributeOptions<string> & {
+		allowedStates: StatefulNodeStates
+		stateAttributeKey: string
+	}) =>
+	({
+		type,
+		state: itemState
+	}: {
+		type: string
+		state?: string
+	}, pos?: number): Command =>
+		({ state, tr, dispatch }) => {
+			if (!allowedValues.includes(type)) { return false }
+			const position = pos ?? state.selection.map(tr.doc, tr.mapping).from
+			const $item = findUpwards(tr.doc, position, $pos => {
+				if ($pos.node().type.name === nodeType) {
+					return true
+				}
+				return false
+			})?.$pos
+			if ($item) {
+				const finalPos = $item.pos
+				const node = $item.node()
+				if (dispatch) {
+					tr.setNodeAttribute(finalPos - 1, attributeKey, type)
+					if (type.startsWith("stateful-")) {
+						const statefulType = type.slice(type.indexOf("-") + 1)
+						const stateEntry = allowedStates[statefulType]
+						if (stateEntry !== undefined) {
+							const newState = itemState ?? (node as any).state ?? stateEntry.default
+							tr.setNodeAttribute(finalPos, stateAttributeKey, newState)
+						}
+					}
+				} // else let it silently retain it's state ?
+				return true
+			} else {
+				return false
+			}
+		}

package/src/runtime/pm/features/Blocks/commands/changeTypeAttr.ts

@@ -0,0 +1,47 @@
+import type { Command } from "@tiptap/core"
+
+import type { CommandAttributeOptions } from "../../../../types/index.js"
+import { findUpwards } from "../../../utils/findUpwards.js"
+
+declare module "@tiptap/core" {
+	// eslint-disable-next-line @typescript-eslint/naming-convention
+	interface Commands<ReturnType> {
+		changeTypeAttr: {
+			changeTypeAttr: (opts: {
+				type: string
+			}) => ReturnType
+		}
+	}
+}
+
+export const changeTypeAttr = ({
+	nodeType,
+	allowedValues,
+	attributeKey
+}: CommandAttributeOptions<string>) =>
+	({
+		type
+	}: {
+		type: string
+	},
+	pos?: number): Command =>
+		({ state, tr, dispatch }) => {
+			if (!allowedValues.includes(type)) { return false }
+			const position = pos ?? state.selection.map(tr.doc, tr.mapping).from
+			const $item = findUpwards(tr.doc, position, $pos => {
+				if ($pos.node().type.name === nodeType) {
+					return true
+				}
+				return false
+			})?.$pos
+			if ($item) {
+				if (dispatch) {
+					const finalPos = $item.pos
+					// not sure why the -1 is needed here...
+					tr.setNodeAttribute(finalPos - 1, attributeKey, type)
+				}
+				return true
+			} else {
+				return false
+			}
+		}