highlight

function tokenize(code: string, grammar: Grammar): Token[]

Tokenize source code using a grammar definition.

function getPlainText(tokens: Token[]): string

Get the plain text from an array of tokens.

function createRegistry(grammars: Grammar[]): Map<string, Grammar>

Create a grammar registry from an array of grammars.

function renderToHTML(tokens: Token[], options?: RenderOptions): string

Render tokens to an HTML string.

function getThemeStylesheet(theme: Theme | string, classPrefix?: string): string

Generate a complete CSS stylesheet for a theme. Useful for SSR or injecting into <style> tags.

function registerTheme(theme: Theme): void

Register a theme for name-based lookup.

function registerThemes(themes: Theme[]): void

Register multiple themes.

function getTheme(name: string): Theme | undefined

Get a theme by name from the registry.

function resolveTheme(theme: Theme | string): Theme | undefined

Resolve a theme — accepts either a Theme object or a string name. Returns the theme object, or undefined if not found.

function getThemeCSS(theme: Theme, classPrefix?: string): string

Generate CSS string for a theme using CSS custom properties.

function applyTheme(theme: Theme | string, classPrefix?: string): (() => void) | undefined

Apply a theme by injecting a <style> tag into the document. Returns a cleanup function to remove the style element.

function clearDetectCache(): void

Clear the detection cache.

function scoreTokenization(tokens: Token[], codeLength: number): number

Score a tokenization result for how well a grammar matches the code.

function detectLanguage(code: string, grammars: Grammar[], options?: DetectOptions): DetectResult | undefined

Detect the most likely language for a code snippet.

function scan(options: ScanOptions): number

Scan a container for code elements and highlight them.

function observe(options: ScanOptions): () => void

Observe a container for new code elements and highlight them automatically. Uses MutationObserver for dynamic content (SPA routing, lazy loading, etc.).

function autoHighlight(options: ScanOptions): () => void

Auto-highlight: scan and optionally observe for new code blocks. Convenience function combining scan() and observe().

function renderCopyButton(code: string, options?: CopyButtonOptions): string

Render a copy button HTML string. The button stores the code in a `data-code` attribute.

function initCopyButtons(container?: Element | undefined, classPrefix?: string): () => void

Initialize click handlers for all copy buttons within a container. Finds all buttons with the `neo-hl-copy-button` class and wires up click events.

function scan(options: ScanOptions): number

Scan a container for code elements and highlight them.

function observe(options: ScanOptions): () => void

Observe a container for new code elements and highlight them automatically. Uses MutationObserver for dynamic content (SPA routing, lazy loading, etc.).

function autoHighlight(options: ScanOptions): () => void

Auto-highlight: scan and optionally observe for new code blocks. Convenience function combining scan() and observe().

function renderCopyButton(code: string, options?: CopyButtonOptions): string

Render a copy button HTML string. The button stores the code in a `data-code` attribute.

function initCopyButtons(container?: Element | undefined, classPrefix?: string): () => void

Initialize click handlers for all copy buttons within a container. Finds all buttons with the `neo-hl-copy-button` class and wires up click events.

function tokenize(code: string, grammar: Grammar): Token[]

Tokenize source code using a grammar definition.

function getPlainText(tokens: Token[]): string

Get the plain text from an array of tokens.

function createRegistry(grammars: Grammar[]): Map<string, Grammar>

Create a grammar registry from an array of grammars.

function renderToHTML(tokens: Token[], options?: RenderOptions): string

Render tokens to an HTML string.

function getThemeStylesheet(theme: Theme | string, classPrefix?: string): string

Generate a complete CSS stylesheet for a theme. Useful for SSR or injecting into <style> tags.

function registerTheme(theme: Theme): void

Register a theme for name-based lookup.

function registerThemes(themes: Theme[]): void

Register multiple themes.

function getTheme(name: string): Theme | undefined

Get a theme by name from the registry.

function resolveTheme(theme: Theme | string): Theme | undefined

Resolve a theme — accepts either a Theme object or a string name. Returns the theme object, or undefined if not found.

function getThemeCSS(theme: Theme, classPrefix?: string): string

Generate CSS string for a theme using CSS custom properties.

function applyTheme(theme: Theme | string, classPrefix?: string): (() => void) | undefined

Apply a theme by injecting a <style> tag into the document. Returns a cleanup function to remove the style element.

function clearDetectCache(): void

Clear the detection cache.

function scoreTokenization(tokens: Token[], codeLength: number): number

Score a tokenization result for how well a grammar matches the code.

function detectLanguage(code: string, grammars: Grammar[], options?: DetectOptions): DetectResult | undefined

Detect the most likely language for a code snippet.

function Highlight({ children, language, theme: themeProp, showLineNumbers, highlightLines, diffHighlight, copyButton, copyButtonLabel, copyButtonCopiedLabel, onCopy, classPrefix: classPrefixProp, className, style, }: HighlightProps): react_jsx_runtime.JSX.Element

Component-mode syntax highlighter. Usage: ```tsx <Highlight language={javascript} theme="github-dark"> {`const x = 42;`} </Highlight> ```

function AutoHighlight({ children, languages: languagesProp, theme: themeProp, selector, lineNumbers: lineNumbersProp, classPrefix: classPrefixProp, className, style, autoDetect, }: AutoHighlightProps): react_jsx_runtime.JSX.Element

Auto-scan component that highlights all `<code>` elements within its children. Uses MutationObserver to watch for dynamically added content. Usage: ```tsx <AutoHighlight languages={[javascript, python]} theme="github-dark"> <article dangerouslySetInnerHTML={{ __html: markdownHtml }} /> </AutoHighlight> ```

function useHighlight(code: string, language: Grammar, options?: UseHighlightOptions): UseHighlightResult

Hook for syntax highlighting. Returns memoized tokens and HTML string.

function CopyButton({ code, label, copiedLabel, classPrefix, onCopy, className, style, }: CopyButtonProps): react_jsx_runtime.JSX.Element

Copy-to-clipboard button for code blocks. Uses navigator.clipboard.writeText with execCommand fallback. Shows "Copied!" feedback for 2 seconds after click.

function HighlightProvider({ children, theme, languages, classPrefix, lineNumbers, }: HighlightProviderProps): react_jsx_runtime.JSX.Element

function useHighlightContext(): HighlightContextValue

function Highlight({ children, language, theme: themeProp, showLineNumbers, highlightLines, diffHighlight, copyButton, copyButtonLabel, copyButtonCopiedLabel, onCopy, classPrefix: classPrefixProp, className, style, }: HighlightProps): react_jsx_runtime.JSX.Element

Component-mode syntax highlighter. Usage: ```tsx <Highlight language={javascript} theme="github-dark"> {`const x = 42;`} </Highlight> ```

function AutoHighlight({ children, languages: languagesProp, theme: themeProp, selector, lineNumbers: lineNumbersProp, classPrefix: classPrefixProp, className, style, autoDetect, }: AutoHighlightProps): react_jsx_runtime.JSX.Element

Auto-scan component that highlights all `<code>` elements within its children. Uses MutationObserver to watch for dynamically added content. Usage: ```tsx <AutoHighlight languages={[javascript, python]} theme="github-dark"> <article dangerouslySetInnerHTML={{ __html: markdownHtml }} /> </AutoHighlight> ```

function useHighlight(code: string, language: Grammar, options?: UseHighlightOptions): UseHighlightResult

Hook for syntax highlighting. Returns memoized tokens and HTML string.

function CopyButton({ code, label, copiedLabel, classPrefix, onCopy, className, style, }: CopyButtonProps): react_jsx_runtime.JSX.Element

Copy-to-clipboard button for code blocks. Uses navigator.clipboard.writeText with execCommand fallback. Shows "Copied!" feedback for 2 seconds after click.

function HighlightProvider({ children, theme, languages, classPrefix, lineNumbers, }: HighlightProviderProps): react_jsx_runtime.JSX.Element

function useHighlightContext(): HighlightContextValue

function highlight(code: string, language: Grammar, options?: HighlightOptions): string

Highlight source code and return an HTML string.

function autoHighlight(options: ScanOptions): () => void

Auto-highlight: scan the page for code blocks and optionally observe for new ones.

function highlight(code: string, language: Grammar, options?: HighlightOptions): string

Highlight source code and return an HTML string.

function autoHighlight(options: ScanOptions): () => void

Auto-highlight: scan the page for code blocks and optionally observe for new ones.