@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
43 lines (42 loc) • 1.53 kB
JavaScript
"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