ExtensionsInline syntax
Italic
The italic extension: * syntax, commands, HTML pasting, and Mod-i.
The italic extension renders *italic* and _italic_ as italic text and adds the italic commands.
Setup
Register ItalicExtension to enable italic formatting and its commands. The mount element must
already exist:
import { Editor } from "@inksane/core";
import { ItalicExtension } from "@inksane/core/extensions/italic";
const editor = new Editor({
element: document.getElementById("editor")!,
extensions: [ItalicExtension],
});Italic is also included in BaseKit. Use either the kit or the individual
extension. To turn it off in the kit, pass BaseKit({ italic: false }).
What it adds
- Decorates the
Emphasisnode with.inksane-mark-italicand hides the*markers. - Converts pasted
<em>and<i>elements to*text*. - Registers the commands below and the
Mod-ibinding.
Commands
| Command | Description |
|---|---|
setItalic({ content?, pos? }) | Wraps the range. With content, inserts *content*. At a collapsed cursor it inserts ** and puts the caret inside. |
removeItalic({ pos? }) | Removes the * around the range. |
toggleItalic({ pos? }) | Removes italic when the range is italic, adds it otherwise. |
The extension ignores ranges that are bold. **text** is not converted to italic, so the two
commands do not interfere with each other.
editor.commands.toggleItalic();Keyboard
| Keys | Action |
|---|---|
Mod-i | toggleItalic() on the selection. |
Styling
[data-inksane-editor-content] .inksane-mark-italic {
font-style: italic;
}