import { type ComponentType, type ReactElement, type ReactNode } from "react";
/**
 * @since 6.0.0
 */
export interface HighlightTextMatch {
    /**
     * The cleaned query that has diacritics, leading whitespace, and trailing
     * whitespace removed.
     */
    query: string;
    /**
     * The raw query string that was provided.
     */
    rawQuery: string;
    /**
     * The full untouched text content for the HighlightText component.
     */
    rawText: string;
    /**
     * The current index in the {@link rawText} that is being matched against.
     */
    index: number;
    /**
     * The last index the query has been matched.
     */
    lastIndex: number;
}
/**
 * @since 6.0.0
 */
export interface HighlightTextComponentProps {
    /** {@inheritDoc HighlightTextMatch} */
    match: HighlightTextMatch;
    /**
     * The matched content.
     */
    children: string;
}
/**
 * @since 6.0.0
 */
export type HighlightTextComponent = ComponentType<HighlightTextComponentProps>;
/**
 * @since 6.0.0
 */
export interface HighlightTextProps {
    /**
     * This prop can be used to provide a custom highlight behavior. It will be
     * provided the {@link HighlightTextComponentProps}
     *
     * @defaultValue `HighlightTextMark`
     */
    highlight?: HighlightTextComponent;
    /**
     * The query text to highlight in the children. When this is an empty string
     * or whitespace only, nothing will be highlighted.
     */
    query: string;
    /**
     * The content to highlight based on the query text where highlighting only
     * works for text children. The component will attempt to find all child text
     * using the `React.Children` API, but might be inconsistent.
     */
    children: ReactNode;
    /**
     * Set to `true` if only the first match should be highlighted instead of all
     * occurrences.
     *
     * @defaultValue `false`
     */
    firstMatchOnly?: boolean;
}
/**
 * The `HighlightText` component can be used to highlight text matching the
 * provided query ignoring case.
 *
 * @example Simple Example
 * ```tsx
 * import { HighlightText } from "@react-md/core/typography/HighlightText";
 * import { Typography } from "@react-md/core/typography/Typography";
 * import { type ReactElement } from "react";
 *
 * export default function SimpleExample(): ReactElement {
 *   return (
 *     <Typography>
 *       <HighlightText query="lorem ipsum">
 *         Lorem ipsum dolor sit amet, consectetur adipiscing elit. In eget metus
 *         ut mi mattis dapibus. Praesent interdum sapien ut posuere convallis.
 *         Donec et tristique ex. Aliquam erat volutpat. Donec sit amet dui
 *         egestas, tempus quam id, hendrerit risus. Nullam tincidunt quam ut dui
 *         aliquet ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing
 *         elit. Sed rhoncus, purus vitae tincidunt placerat, quam diam lobortis
 *         magna, et aliquam ante diam id nunc. Cras blandit leo eu nisi
 *         elementum, nec gravida ligula pharetra. Etiam molestie luctus orci,
 *         vel hendrerit lacus eleifend ut. Nullam placerat dolor ac mi congue,
 *         non auctor metus consectetur. Ut pretium mollis vulputate.
 *       </HighlightText>
 *     </Typography>
 *   );
 * }
 *
 * ```
 * @see {@link https://react-md.dev/components/highlight-text | HighlightText Demos}
 * @since 6.0.0
 */
export declare function HighlightText(props: Readonly<HighlightTextProps>): ReactElement;
