Bobril component for syntax highlighting of source code. For actual work uses highlight.js.
Updated to use version 11.9.0 of highlight.js.
import * as b from "bobril";
import * as high from "@bobril/highlighter";
import { docco } from "@bobril/highlighter/styles";
b.init(() => <high.Highlighter style={docco}>{`let actual = "code " + "shine";`}</high.Highlighter>);By default only most common languages are registered. If all are needed use this:
import "@bobril/highlighter/allLanguages";language?: string- if not provided then autodetect (slower)style?: HighlightStyle- provide theme to use for stylingshowLineNumbers?: boolean- default istruestartingLineNumber?: number- default is1,NaNis automatically set to1as well.lineStyle?: ((line: number) => b.IBobrilStyles) | undefined- allow styledivfor each linelineContentStyle?: ((line: number) => b.IBobrilStyles) | undefined- allow to styledivof line content without line numberlineNumberStyle?: ((largestLineNumber: number, style: HighlightStyle) => (line: number) => b.IBobrilStyles) | undefined- allows complete override of default line number stylechildren?: string- only one string child is allowed and it must contain code to format
- highlight.js - actual ground work
- lowlight - for Emitter Tree approach
- react-syntax-highlighter - scripts and inspirations in line number styling