renderRichText

Renders inline content, text runs, bound expressions and micronodes, as React nodes styled by the package's ine-rt-* classes.

@internote/canvas-sdk/reactFunction
On this page
import { renderRichText } from '@internote/canvas-sdk/react';

A string is returned as is. It renders bold, italic, code, highlight, link in a new tab, latex with KaTeX showing the source on a parse error, symbol, the colour names, and the six text functions; a bound expression renders as its live value. A cue.highlight marks its words for a moment against options.animation, and without it renders them plain. footnote, cite and internote go to the host's renderers in options when given, and to a plain fallback otherwise. An unknown micronode renders its body; a list or a block break renders nothing. For a label on an SVG surface, RichLabel sets the same vocabulary anchored at a point.

#Signature

(nodes: RichTextNode[] | string, options?: RenderOptions): React.ReactNode

#Parameters

nodes
The inline content, or a plain string.
options
Where the text is shown, and the host's renderers.

#Example

<p>{renderRichText(question.prompt, { context: 'canvas' })}</p>

Declared in packages/canvas-sdk/src/content/renderRichText.tsx:86.

Last updated