UNPKG

@wix/design-system

Version:

@wix/design-system

140 lines (139 loc) 5.54 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); exports.__esModule = true; exports["default"] = void 0; var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")); var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn")); var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf")); var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits")); var _react = _interopRequireDefault(require("react")); var _escapeRegExp = _interopRequireDefault(require("lodash/escapeRegExp")); var _HighlighterSt = require("./Highlighter.st.css.js"); var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/Highlighter/HighlightedItem.jsx"; function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); } function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } var HighlightedItem = /*#__PURE__*/function (_React$PureComponent) { function HighlightedItem() { (0, _classCallCheck2["default"])(this, HighlightedItem); return _callSuper(this, HighlightedItem, arguments); } (0, _inherits2["default"])(HighlightedItem, _React$PureComponent); return (0, _createClass2["default"])(HighlightedItem, [{ key: "renderElement", value: function renderElement() { var _this$props = this.props, children = _this$props.children, match = _this$props.match; if (match) { var matchRegExp = this.getMatchRegExp(); return this.highlightChildren(children, matchRegExp); } return children; } }, { key: "getMatchRegExp", value: function getMatchRegExp() { var _this$props2 = this.props, match = _this$props2.match, caseSensitive = _this$props2.caseSensitive; return new RegExp((0, _escapeRegExp["default"])(match), caseSensitive ? '' : 'i'); } }, { key: "getMatchBoundaries", value: function getMatchBoundaries(subject, matchRegExp) { var matches = matchRegExp.exec(subject); if (matches) { return { first: matches.index, last: matches.index + matches[0].length }; } } }, { key: "getMatchReactKey", value: function getMatchReactKey(index) { return "match-index-".concat(index); } }, { key: "highlightChildren", value: function highlightChildren(children, matchRegExp) { var processedChildren = []; var matchIndex = 0; while (children) { if (!matchRegExp.test(children)) { processedChildren.push(this.renderPlain(children, this.getMatchReactKey(matchIndex++))); return processedChildren; } var boundaries = this.getMatchBoundaries(children, matchRegExp); var nonMatch = children.slice(0, boundaries.first); if (nonMatch) { processedChildren.push(this.renderPlain(nonMatch, this.getMatchReactKey(matchIndex++))); } var match = children.slice(boundaries.first, boundaries.last); if (match) { processedChildren.push(this.renderHighlight(match, this.getMatchReactKey(matchIndex++))); } children = children.slice(boundaries.last); } return processedChildren; } }, { key: "renderPlain", value: function renderPlain(plainString, key) { return /*#__PURE__*/_react["default"].createElement("span", { key: key, __self: this, __source: { fileName: _jsxFileName, lineNumber: 74, columnNumber: 12 } }, plainString); } }, { key: "renderHighlight", value: function renderHighlight(matchString, key) { var _this$props$emphasize = this.props.emphasize, emphasize = _this$props$emphasize === void 0 ? 'text' : _this$props$emphasize; if (emphasize === 'background') { return /*#__PURE__*/_react["default"].createElement("span", { key: key, className: (0, _HighlighterSt.st)(_HighlighterSt.classes.root, { emphasize: emphasize }), __self: this, __source: { fileName: _jsxFileName, lineNumber: 81, columnNumber: 9 } }, matchString); } return /*#__PURE__*/_react["default"].createElement("strong", { key: key, __self: this, __source: { fileName: _jsxFileName, lineNumber: 92, columnNumber: 12 } }, matchString); } }, { key: "render", value: function render() { var dataHook = this.props.dataHook; return /*#__PURE__*/_react["default"].createElement("span", { "data-hook": dataHook, __self: this, __source: { fileName: _jsxFileName, lineNumber: 97, columnNumber: 12 } }, this.renderElement()); } }]); }(_react["default"].PureComponent); var _default = exports["default"] = HighlightedItem;