UNPKG

@mantine/core

Version:

React components library focused on usability, accessibility and developer experience

47 lines (46 loc) 2.03 kB
import { MantineColor, MantineTheme, PolymorphicFactory } from '../../core'; import { TextProps, TextStylesNames, TextVariant } from '../Text'; export interface HighlightProps extends Omit<TextProps, 'color'> { /** Substring or an array of substrings to highlight in `children` */ highlight: string | string[]; /** Key of `theme.colors` or any valid CSS color, passed to `Mark` component `color` prop, `yellow` by default */ color?: MantineColor | string; /** Styles applied to `mark` elements */ highlightStyles?: React.CSSProperties | ((theme: MantineTheme) => React.CSSProperties); /** String parts of which must be highlighted */ children: string; } export type HighlightFactory = PolymorphicFactory<{ props: HighlightProps; defaultRef: HTMLDivElement; defaultComponent: 'div'; stylesNames: TextStylesNames; variant: TextVariant; }>; export declare const Highlight: (<C = "div">(props: import("../../core").PolymorphicComponentProps<C, HighlightProps>) => React.ReactElement) & Omit<import("react").FunctionComponent<(HighlightProps & { component?: any; } & Omit<Omit<any, "ref">, "component" | keyof HighlightProps> & { ref?: any; renderRoot?: (props: any) => any; }) | (HighlightProps & { component: React.ElementType; renderRoot?: (props: Record<string, any>) => any; })>, never> & import("../../core/factory/factory").ThemeExtend<{ props: HighlightProps; defaultRef: HTMLDivElement; defaultComponent: "div"; stylesNames: TextStylesNames; variant: TextVariant; }> & import("../../core/factory/factory").ComponentClasses<{ props: HighlightProps; defaultRef: HTMLDivElement; defaultComponent: "div"; stylesNames: TextStylesNames; variant: TextVariant; }> & import("../../core/factory/polymorphic-factory").PolymorphicComponentWithProps<{ props: HighlightProps; defaultRef: HTMLDivElement; defaultComponent: "div"; stylesNames: TextStylesNames; variant: TextVariant; }> & Record<string, never>;