@activecollab/components
Version:
ActiveCollab Components
30 lines • 1.48 kB
JavaScript
import React, { Fragment } from "react";
import styled from "styled-components";
const StyledHiglightedText = styled.span.withConfig({
displayName: "useHighlightText__StyledHiglightedText",
componentId: "sc-13agf6o-0"
})(["background-color:var(--color-primary-200);"]);
StyledHiglightedText.displayName = "StyledHiglightedText";
const useHighlightText = function (text, searchBy, matchCase) {
if (matchCase === void 0) {
matchCase = false;
}
let textComparator = text;
let searchByComparator = searchBy;
if (!text) return;
if (!matchCase) {
textComparator = text.toLowerCase();
searchByComparator = searchBy.toLowerCase();
}
if (searchBy && textComparator && textComparator.indexOf(searchByComparator) >= 0) {
const beforeHighlighted = text.substring(0, textComparator.indexOf(searchByComparator));
const highLighted = text.substring(textComparator.indexOf(searchByComparator), textComparator.indexOf(searchByComparator) + searchBy.length);
const afterHighlighted = text.substring(textComparator.indexOf(searchByComparator) + searchBy.length);
return /*#__PURE__*/React.createElement(Fragment, null, beforeHighlighted.replace(/ /g, "\u00a0"), /*#__PURE__*/React.createElement(StyledHiglightedText, {
className: "c-option--text__highlight"
}, highLighted.replace(/ /g, "\u00a0")), afterHighlighted.replace(/ /g, "\u00a0"));
}
return text;
};
export default useHighlightText;
//# sourceMappingURL=useHighlightText.js.map