zidanecode/CodeHighlightProvider
import { … } from 'zidane-ui'ui/src/code/CodeHighlightProvider.tsx
Components#
CodeHighlightProviderComponent#
Sets the highlighter and the code theme of every code block below.
function CodeHighlightProvider(props: CodeHighlightProviderProps): ElementParameters
| Name | Type | Description |
|---|---|---|
| props | CodeHighlightProviderProps |
Returns
ElementProps
| Name | Type | Description |
|---|---|---|
| children | ReactNode | The code blocks that read it. |
| highlighter? | CodeHighlighter | The highlighter (its cache and worker). Default: the enclosing one, or a main-thread highlighter. |
| theme? | string | A bundled code theme id. Default: the enclosing one, or the document's appearance's GitHub theme. |
Functions#
useCodeHighlightFunction#
Returns the highlighter and the code theme in effect for a code block.
function useCodeHighlight(): { highlighter: CodeHighlighter; theme: string }Returns
{ highlighter: CodeHighlighter; theme: string }useDocumentAppearanceFunction#
The document's appearance: the .light class on <html>, else dark.
function useDocumentAppearance(watch?: boolean): AppearanceParameters
| Name | Type | Default | Description |
|---|---|---|---|
| watch? | boolean | true | Follow class changes. Off when the caller has its own theme and only needs a value. |
Returns
Interfaces#
CodeHighlightProviderPropsInterface#
Props of CodeHighlightProvider.
interface CodeHighlightProviderPropsProperties
| Name | Type | Description |
|---|---|---|
| children | ReactNode | The code blocks that read it. |
| highlighter? | CodeHighlighter | The highlighter (its cache and worker). Default: the enclosing one, or a main-thread highlighter. |
| theme? | string | A bundled code theme id. Default: the enclosing one, or the document's appearance's GitHub theme. |