react-markdown-code-highlighter
Version:
`react-markdown-code-highlighter` is a flexible [React](https://react.dev) component for rendering Markdown with syntax-highlighted code blocks using [highlight.js](https://highlightjs.org/). It is designed for use in chat systems and AI assistants like C
11 lines • 991 B
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React, { useState, useMemo } from 'react';
// Example ThemeContext, replace with your actual context import if different
const ThemeContext = React.createContext('light');
const BlockWrap = ({ children, language, theme }) => {
const [isDark, setIsDark] = useState('dark' == theme);
const blockClass = useMemo(() => `md-code-block ${isDark ? 'md-code-block-dark' : 'md-code-block-light'}`, [isDark]);
return (_jsxs("div", { className: blockClass, children: [_jsx("div", { className: "md-code-block-banner-wrap", children: _jsx("div", { className: "md-code-block-banner md-code-block-banner-lite", children: _jsx("div", { className: "md-code-block-banner-content", children: _jsx("div", { className: "md-code-block-language", children: language }) }) }) }), _jsx("div", { className: "md-code-block-content", children: children })] }));
};
export default React.memo(BlockWrap);
//# sourceMappingURL=index.js.map