Bold

The bold extension renders **bold** and __bold__ as bold text and adds the bold commands.

SetupCopy Anchor Link

Import BoldExtension and register it with the editor. This example mounts into an existing element with the ID editor:

import { Editor } from "@inksane/core";
import { BoldExtension } from "@inksane/core/extensions/bold";

const editor = new Editor({
  element: document.getElementById("editor")!,
  extensions: [BoldExtension],
});

BaseKit already includes bold. If you use the kit, no separate registration is needed. Disable bold with BaseKit({ bold: false }).

What it addsCopy Anchor Link

• Decorates the StrongEmphasis node with .inksane-mark-bold and hides the ** markers.
• Converts pasted <strong> and <b> elements to **text**.
• Registers the commands below and the Mod-b binding.

CommandsCopy Anchor Link

setBold returns false when the range is already bold, and removeBold returns false when it is not, so a toggle never nests markers.

editor.commands.setBold({ content: "new" });

editor.commands.toggleBold();

editor
  .chain()
  .setBold({ pos: { from: 0, to: 5 } })
  .focus()
  .run();

KeyboardCopy Anchor Link

StylingCopy Anchor Link

[data-inksane-editor-content] .inksane-mark-bold {
  font-weight: bold;
}