Features Reference¶

SciFlow ships 15 pluggable features. Each feature is a self-contained module that registers commands, keyboard shortcuts, ProseMirror plugins, and/or schema extensions. Features can be enabled or disabled at runtime via configureFeatures().

Default feature set

When no features property is set on <sciflow-editor>, the component loads: citation, cross-reference, footnote, hyperlink, mark-formatting, paragraph, heading, figure, table, math, and blockquote.

Text Formatting¶

Mark Formatting¶

Toggles inline text styles.

Command	Description
`toggleBold()`	Toggle strong mark
`toggleItalic()`	Toggle emphasis mark
`toggleSuperscript()`	Toggle ^superscript^ mark
`toggleSubscript()`	Toggle ~subscript~ mark

Marks used: strong, em, sup, sub

Hyperlink¶

Applies an anchor mark to text, creating a clickable link.

Command	Description
`insertHyperlink()`	Toggle anchor mark on current selection

When activated, an empty href is set so the selection editor opens for the user to fill in the URL. If the mark is already active and no text is selected, the mark is removed.

Mark used: anchor — attrs: href, title, id

Block Content¶

Paragraph¶

The basic block text element. No commands — paragraphs are the default block type.

Node: paragraph — attrs: id

Heading¶

Manages section headings at levels 1–6.

Command	Description
`toggleHeading(level)`	Toggle heading at given level (converts to paragraph if already at that level)
`setHeading(level)`	Set heading to a specific level
`setParagraph()`	Convert heading back to paragraph

Input rules (Markdown-style):

Typed prefix	Result
`#`	Heading level 1
`##`	Heading level 2
`###`	Heading level 3
`####`	Heading level 4
`#####`	Heading level 5
`######`	Heading level 6

Node: heading — attrs: id, level (1–6), role, type, numbering, placement, data

Blockquote¶

Wraps block content in a quotation container.

Command	Description
`toggleBlockquote()`	Wrap selection in blockquote, or lift out if already inside one

Node: blockquote — attrs: id, lang

List¶

Manages bullet and ordered lists with nesting.

Command	Description
`toggleBulletList()`	Wrap/unwrap as bullet list
`toggleOrderedList()`	Wrap/unwrap as ordered list
`sinkListItem()`	Indent (nest) list item
`liftListItem()`	Outdent (unnest) list item

Input rules:

Typed prefix	Result
`-`, `+`, `*`	Bullet list
`1.` (any digit)	Ordered list

Nodes: bullet_list, ordered_list, list_item

Inline Content¶

Citation¶

Inserts inline citations that reference bibliography entries. Supports drag-and-drop from a reference list, citation merging, and source editing via the selection editor.

Command	Description
`insertCitation(options)`	Insert a citation at the cursor
`addReference(reference)`	Add a reference to the snapshot's reference list
`updateCitationNode(position, options)`	Update citation attributes and content

Keyboard shortcuts:

Key	Action
Backspace	Select or delete citation as a unit
Delete	Select or delete citation as a unit

Plugins: Click handler (select on click), drag-and-drop handler, paste handler.

Node: citation — attrs: id, source (encoded reference IDs), style (e.g. 'apa')

Drag MIME type: application/x-sciflow-reference

Cross-Reference¶

Creates internal links to headings and figures within the document. Validates that the target ID exists before insertion.

Command	Description
`insertCrossReference(options)`	Insert a cross-reference link
`updateCrossReferenceNode(position, options)`	Update cross-reference attributes/content
`collectCrossReferenceTargetIds(doc)`	Collect all valid target IDs (headings and figures)

Plugins: Click handler, drag-and-drop handler (from outline), paste handler.

Node: link — attrs: id, type: 'xref', href (starts with #), reference-format

Drag MIME type: application/x-sciflow-cross-reference

Footnote¶

Inserts inline footnote markers with associated text content.

Command	Description
`insertFootnote(options?)`	Insert a footnote at the cursor

Node: footnote — content: text*, attrs: id, type

Rendered as: <span class="sciflow-footnote"><sup class="sciflow-footnote-marker"/><span class="sciflow-footnote-body"/></span>

Math¶

Inserts LaTeX math expressions rendered via MathJax 4 to SVG.

Command	Description
`insertMath(options?)`	Insert a math node at the cursor

Keyboard shortcuts:

Key	Action
`Mod-m`	Wrap current selection in math node

Input rules:

Typed prefix	Result
`$$` (space)	Empty display math
`$$...$$`	Wrapped display math

Node: math — attrs: tex (LaTeX source), style ('inline' or 'display'), label

MathJax required

Add <script defer src="https://cdn.jsdelivr.net/npm/mathjax@4/tex-svg.js"></script> to your page for equation rendering. Without it, math nodes show a placeholder but save/load correctly.

Media¶

Figure¶

Inserts images and media with captions. Handles file uploads and image preview URLs. Tables and code blocks are also wrapped in figure nodes.

Command	Description
`insertFigure(options)`	Insert a figure with a specified `src`
`insertFigureInteractive()`	Open a file picker and insert the selected figure

Node: figure — content: (table | code_block)? caption

Key attrs: id, src, alt, type, orientation (portrait/landscape), scale-width (0–1), float placement attrs (float-placement, float-reference, float-defer-page, float-modifier)

Caption: caption node containing an optional label and paragraph content.

See Figure File API for upload integration.

Table¶

Inserts and edits data tables. Tables are wrapped in figure nodes with captions. Supports cell selection, merging, splitting, alignment, and resizable columns.

Command	Description
`insertNativeTableFigure(opts?)`	Create a table (default: 3 cols, 2 rows, header row)
`addColumnBefore()`	Insert column before selection
`addColumnAfter()`	Insert column after selection
`addRowBefore()`	Insert row above selection
`addRowAfter()`	Insert row below selection
`deleteColumn()`	Delete selected column
`deleteRow()`	Delete selected row
`mergeCells()`	Merge selected cells
`splitCell()`	Split a merged cell
`toggleHeaderRow()`	Toggle header styling on first row
`toggleHeaderColumn()`	Toggle header styling on first column
`goToNextCell()`	Move focus to next cell
`deleteTable()`	Delete the entire table
`setCellAttr(name, value)`	Set an attribute on selected cells
`alignLeft()` / `alignRight()` / `alignCenter()` / `alignJustify()`	Set paragraph alignment in cells

Keyboard shortcuts:

Key	Action
Tab	Move to next cell
Shift-Tab	Move to previous cell

Plugins: Column resizing (min width 80px), table editing, cell paragraph enforcement.

Nodes: table, table_row, table_cell, table_header

Table cells allow rich content: (paragraph | ordered_list | bullet_list | figure | blockquote)*

Options: InsertTableOptions — cols (default 3), rows (default 2), hasHeaderRow (default true)

Behavioral Features¶

Copy-Paste¶

Sanitizes pasted content. No commands or keyboard shortcuts — operates via a ProseMirror plugin that intercepts paste events.

Sanitization rules:

Removes inline style attributes
Regenerates node IDs to avoid duplicates
Auto-wraps pasted tables in figure nodes with captions
Converts plain-text URLs to hyperlinks
Normalizes heading levels on paste

Annotation¶

Provides inline and block-level annotation marks for external comment/highlight systems. The editor handles visual representation; annotation lifecycle is managed externally.

No commands — annotations are applied via transaction metadata:

const tr = view.state.tr;
tr.setMeta(annotationKey, newAnnotations);
view.dispatch(tr);

Mark: annotation — attrs: annotationId, annotationType Node: annotationBlock — content: block, attrs: annotationId, annotationType

Plugin: createAnnotationPlugin(initialAnnotations) manages annotation state.