gatsby-openrpc-theme/dist/src/components/CodeBlock.js

A gatsby theme for generated OpenRPC documentation

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const react_syntax_highlighter_1 = require("react-syntax-highlighter");
const prism_1 = require("react-syntax-highlighter/dist/esm/styles/prism");
const material_1 = require("@mui/material");
const CodeBlock = ({ children, className, darkMode }) => {
    const theme = (0, material_1.useTheme)();
    const language = className ? className.replace(/language-/, '') : 'javascript';
    // Use component's darkMode prop or theme's mode
    const isDarkMode = darkMode !== undefined ? darkMode : theme.palette.mode === 'dark';
    const syntaxTheme = isDarkMode ? prism_1.vscDarkPlus : prism_1.vs;
    return (react_1.default.createElement(material_1.Paper, { elevation: 2, sx: {
            mb: 2,
            overflow: 'hidden',
            bgcolor: isDarkMode ? 'grey.900' : 'grey.50',
        } },
        react_1.default.createElement(react_syntax_highlighter_1.Prism, { language: language, style: syntaxTheme, customStyle: {
                margin: 0,
                padding: theme.spacing(2),
                borderRadius: theme.shape.borderRadius,
                backgroundColor: 'transparent', // Let Paper handle the background
            } }, children)));
};
exports.default = CodeBlock;
//# sourceMappingURL=CodeBlock.js.map