- Highlight string children with refractor (Prism) when `language` is set, rendered as React token spans; add ini/bash/json/yaml/ts support - Add `theme` prop (auto | light | dark); auto follows the `.dark` class. Palettes are `--twui-code-*` CSS variables (GitHub Light/Dark, all tokens WCAG AA) so custom themes need no component changes - Fix layout: real padding, singleBlock copy button no longer covers the code, clipped rounded corners, wrapperProps.style honoured, long tokens wrap - MDX helpers take `codeTheme` and no longer force a black background - Highlight WireGuard config blocks as ini Co-Authored-By: Claude Opus 5.5 <[email protected]>
33 lines
684 B
TypeScript
33 lines
684 B
TypeScript
import type { RootContent } from "hast";
|
|
|
|
type Props = {
|
|
node: RootContent;
|
|
};
|
|
|
|
/**
|
|
* # Render one node of a refractor hast tree
|
|
*/
|
|
export default function CodeBlockHastNode({ node }: Props) {
|
|
if (node.type === "text") {
|
|
return node.value;
|
|
}
|
|
|
|
if (node.type !== "element") {
|
|
return null;
|
|
}
|
|
|
|
const className = node.properties?.className;
|
|
|
|
return (
|
|
<span
|
|
className={
|
|
Array.isArray(className) ? className.join(" ") : undefined
|
|
}
|
|
>
|
|
{node.children.map((child, index) => (
|
|
<CodeBlockHastNode key={index} node={child} />
|
|
))}
|
|
</span>
|
|
);
|
|
}
|