import { jsx } from "react/jsx-runtime";
import "react";
import "clsx";
import { useProps } from "../../core/MantineProvider/use-props/use-props.mjs";
import { polymorphicFactory } from "../../core/factory/polymorphic-factory.mjs";
import { Mark } from "../Mark/Mark.mjs";
import { Text } from "../Text/Text.mjs";
import { highlighter } from "./highlighter/highlighter.mjs";
const defaultProps = {};
const Highlight = polymorphicFactory((props, ref) => {
  const { unstyled, children, highlight, highlightStyles, color, ...others } = useProps(
    "Highlight",
    defaultProps,
    props
  );
  const highlightChunks = highlighter(children, highlight);
  return /* @__PURE__ */ jsx(Text, { unstyled, ref, ...others, __staticSelector: "Highlight", children: highlightChunks.map(
    ({ chunk, highlighted }, i) => highlighted ? /* @__PURE__ */ jsx(
      Mark,
      {
        unstyled,
        color,
        style: highlightStyles,
        "data-highlight": chunk,
        children: chunk
      },
      i
    ) : /* @__PURE__ */ jsx("span", { children: chunk }, i)
  ) });
});
Highlight.classes = Text.classes;
Highlight.displayName = "@mantine/core/Highlight";
export {
  Highlight
};
