ExampleCard
A card showing code and its output, useful for documentation pages.
Note: This component is only supported as a React Server Component, meaning it can not be re-rendered on the client.
Props
The same as Joy UI's Card component, as well as:
children
: The output content to display in the card.expandContent
: Whether to expand the output content to the card border by default. Defaults tofalse
.code
: The code to display.language
: The language of the code. Defaults to no syntax highlighting.codeBlockProps
: Optional additional props to pass to the CodeBlock component.
Examples
Different code & output
The code and output don't need to align; in fact, quite often they don't!