@dnb/eufemia/components/filter/FilterHighlighting.js

DNB Eufemia Design System UI Library

"use client";

import { useContext, useMemo } from 'react';
import { useSharedState } from "../../shared/helpers/useSharedState.js";
import { FilterContext, FilterConnectedIdContext } from "./FilterContext.js";
import { jsx as _jsx } from "react/jsx-runtime";
function FilterHighlighting({
  children,
  connectedTo
}) {
  var _ref, _ref2, _data$search;
  const context = useContext(FilterContext);
  const connectedId = useContext(FilterConnectedIdContext);
  const resolvedId = (_ref = connectedTo !== null && connectedTo !== void 0 ? connectedTo : connectedId) !== null && _ref !== void 0 ? _ref : context?.id;
  const {
    data
  } = useSharedState(resolvedId);
  const search = (_ref2 = (_data$search = data?.search) !== null && _data$search !== void 0 ? _data$search : context?.state?.search) !== null && _ref2 !== void 0 ? _ref2 : '';
  return useMemo(() => highlightText(children, search), [children, search]);
}
function highlightText(text, search) {
  if (!search || !text) {
    return text;
  }
  const escaped = search.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
  const regex = new RegExp(`(${escaped})`, 'gi');
  const parts = text.split(regex);
  if (parts.length === 1) {
    return text;
  }
  return parts.map((part, index) => {
    if (regex.test(part)) {
      regex.lastIndex = 0;
      return _jsx("mark", {
        className: "dnb-filter__highlighting",
        children: part
      }, index);
    }
    return part;
  });
}
export default FilterHighlighting;
//# sourceMappingURL=FilterHighlighting.js.map