@mantine/code-highlight
Version:
Code highlight with Mantine theme
30 lines (29 loc) • 1.36 kB
TypeScript
import { BoxProps, ElementProps, Factory, MantineColor, MantineRadius, StylesApiProps } from '@mantine/core';
export type InlineCodeHighlightStylesNames = 'inlineCodeHighlight';
export type InlineCodeHighlightCssVariables = {
inlineCodeHighlight: '--ch-background' | '--ch-radius';
};
export interface InlineCodeHighlightProps extends BoxProps, StylesApiProps<InlineCodeHighlightFactory>, ElementProps<'code'> {
/** Code to highlight */
code: string;
/** Language of the code, used to determine syntax highlighting */
language?: string;
/** Controls background color of the code. By default, the value depends on color scheme. */
background?: MantineColor;
/** Key of `theme.radius` or any valid CSS value to set border-radius, `'sm'` by default */
radius?: MantineRadius;
/** Determines whether the code should have a border, `false` by default */
withBorder?: boolean;
}
export type InlineCodeHighlightFactory = Factory<{
props: InlineCodeHighlightProps;
ref: HTMLElement;
stylesNames: InlineCodeHighlightStylesNames;
vars: InlineCodeHighlightCssVariables;
}>;
export declare const InlineCodeHighlight: import("@mantine/core").MantineComponent<{
props: InlineCodeHighlightProps;
ref: HTMLElement;
stylesNames: InlineCodeHighlightStylesNames;
vars: InlineCodeHighlightCssVariables;
}>;