Skip to main content
Version: v2.x

Syntax Highlighter


In this example, we will use the @nlux/highlighter package to add syntax highlighting to code generated by OpenAI and rendered in the conversational UI.

import {useMemo} from 'react';
import {AiChat} from '@nlux/react';
import '@nlux/themes/nova.css';
import {streamAdapter} from './adapter';

import {highlighter} from '@nlux/highlighter';
import '@nlux/highlighter/dark-theme.css';

export default () => {
  const adapter = useMemo(() => streamAdapter, []);
  return (
    <AiChat
      messageOptions={{
        syntaxHighlighter: highlighter
      }}
      adapter={adapter}
      displayOptions={{colorScheme: 'dark'}}
    />
  );
};