@sis-cc/dotstatsuite-visions 12.5.0 → 12.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -22,6 +22,8 @@ import { defaultLabelAccessor } from './utils';
22
22
  var useStyles = makeStyles(function (theme) {
23
23
  return {
24
24
  table: {
25
+ outline: '1px solid transparent',
26
+ transform: 'translateZ(0)',
25
27
  borderCollapse: 'separate',
26
28
  borderLeft: 'thin solid ' + theme.palette.grey[500],
27
29
  borderTop: 'thin solid ' + theme.palette.grey[500],
@@ -42,7 +42,8 @@ var Item = function Item(_ref) {
42
42
  _ref$depth = _ref.depth,
43
43
  depth = _ref$depth === undefined ? 0 : _ref$depth,
44
44
  eventsListeners = _ref.eventsListeners,
45
- expanded = _ref.expanded;
45
+ expanded = _ref.expanded,
46
+ highlightedLabel = _ref.highlightedLabel;
46
47
 
47
48
  var _useKeyboardEscapeHan = useKeyboardEscapeHandler(),
48
49
  open = _useKeyboardEscapeHan.open,
@@ -50,6 +51,7 @@ var Item = function Item(_ref) {
50
51
 
51
52
  var padding = depth * 30 + (depth > 0 && !hasChildrenOnLevel ? 30 : 0) + (!hasChild && hasChildrenOnLevel ? 30 : 0);
52
53
 
54
+ var formattedLabel = highlightedLabel ? React.createElement('div', { dangerouslySetInnerHTML: { __html: highlightedLabel } }) : label;
53
55
  return React.createElement(
54
56
  ListItem,
55
57
  {
@@ -151,7 +153,7 @@ var Item = function Item(_ref) {
151
153
  variant: 'body2',
152
154
  className: cx(classes.label, (_cx5 = {}, _cx5[classes.disabledLabel] = isGreyed, _cx5[classes.tooltipNotice] = !R.isEmpty(description), _cx5))
153
155
  },
154
- label
156
+ formattedLabel
155
157
  )
156
158
  ),
157
159
  R.not(R.isNil(count)) && React.createElement(
@@ -193,7 +195,8 @@ Item.propTypes = process.env.NODE_ENV !== "production" ? {
193
195
  depth: PropTypes.number,
194
196
  eventsListeners: PropTypes.object,
195
197
  isGreyed: PropTypes.bool,
196
- expanded: PropTypes.bool
198
+ expanded: PropTypes.bool,
199
+ highlightedLabel: PropTypes.string
197
200
  } : {};
198
201
 
199
202
  export default Item;
@@ -29,31 +29,47 @@ export var spotlightFilter = function spotlightFilter(term) {
29
29
  }
30
30
  return acc;
31
31
  };
32
+ var matchRegExp = function matchRegExp(str) {
33
+ return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
34
+ };
35
+
36
+ // Highlight matching terms in the label
37
+ var highlightLabel = function highlightLabel(label) {
38
+ var regex = new RegExp('(' + matchRegExp(term) + ')', 'gi');
39
+ return label.replace(regex, function (match) {
40
+ return '<span style=background-color:yellow;border-bottom:2px solid #8CC841>' + match + '</span>';
41
+ });
42
+ };
32
43
 
33
44
  var recurse = function recurse(item) {
34
- var isValidItem = R.includes(R.toLower(term), R.toLower(labelRenderer(item)));
45
+ var label = labelRenderer(item);
46
+ var isValidItem = R.includes(R.toLower(term), R.toLower(label));
35
47
 
36
48
  var result = [];
37
49
 
38
50
  if (isValidItem) {
51
+ var highlightedLabel = highlightLabel(label);
52
+ console.log(highlightedLabel);
39
53
  var parents = findParents(item);
40
- result = [].concat(parents, [item]);
54
+ result = [].concat(parents, [_extends({}, item, { highlightedLabel: highlightedLabel })]);
55
+
41
56
  if (displayChildren) {
42
57
  var children = getDescendants(R.prop('id', item), groupedItemsByParentId);
43
- return [].concat(parents, [item], children);
58
+ return [].concat(parents, [_extends({}, item, { highlightedLabel: highlightedLabel })], children);
44
59
  }
45
60
  }
61
+
46
62
  if (R.has(getHierarchicalId(item), groupedItemsByParentId)) {
47
63
  var childItems = groupedItemsByParentId[getHierarchicalId(item)] || [];
48
64
  var matchingChildren = R.chain(recurse, childItems);
49
65
 
50
66
  // res with any matching children
51
- return R.uniq([].concat(result, matchingChildren));
67
+ return R.uniqBy(R.prop('id'), [].concat(result, matchingChildren));
52
68
  }
53
69
  return result;
54
70
  };
55
71
 
56
- return R.uniq(R.chain(recurse, groupedItemsByParentId['#ROOT'] || []));
72
+ return R.uniqBy(R.prop('id'))(R.chain(recurse, groupedItemsByParentId['#ROOT'] || []));
57
73
  };
58
74
  };
59
75
 
@@ -58,6 +58,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
58
58
  var useStyles = (0, _makeStyles2.default)(function (theme) {
59
59
  return {
60
60
  table: {
61
+ outline: '1px solid transparent',
62
+ transform: 'translateZ(0)',
61
63
  borderCollapse: 'separate',
62
64
  borderLeft: 'thin solid ' + theme.palette.grey[500],
63
65
  borderTop: 'thin solid ' + theme.palette.grey[500],
@@ -85,7 +85,8 @@ var Item = function Item(_ref) {
85
85
  _ref$depth = _ref.depth,
86
86
  depth = _ref$depth === undefined ? 0 : _ref$depth,
87
87
  eventsListeners = _ref.eventsListeners,
88
- expanded = _ref.expanded;
88
+ expanded = _ref.expanded,
89
+ highlightedLabel = _ref.highlightedLabel;
89
90
 
90
91
  var _useKeyboardEscapeHan = (0, _useKeybordEscapeHandler2.default)(),
91
92
  open = _useKeyboardEscapeHan.open,
@@ -93,6 +94,7 @@ var Item = function Item(_ref) {
93
94
 
94
95
  var padding = depth * 30 + (depth > 0 && !hasChildrenOnLevel ? 30 : 0) + (!hasChild && hasChildrenOnLevel ? 30 : 0);
95
96
 
97
+ var formattedLabel = highlightedLabel ? _react2.default.createElement('div', { dangerouslySetInnerHTML: { __html: highlightedLabel } }) : label;
96
98
  return _react2.default.createElement(
97
99
  _ListItem2.default,
98
100
  {
@@ -194,7 +196,7 @@ var Item = function Item(_ref) {
194
196
  variant: 'body2',
195
197
  className: (0, _classnames2.default)(classes.label, (_cx5 = {}, _cx5[classes.disabledLabel] = isGreyed, _cx5[classes.tooltipNotice] = !R.isEmpty(description), _cx5))
196
198
  },
197
- label
199
+ formattedLabel
198
200
  )
199
201
  ),
200
202
  R.not(R.isNil(count)) && _react2.default.createElement(
@@ -236,7 +238,8 @@ Item.propTypes = process.env.NODE_ENV !== "production" ? {
236
238
  depth: _propTypes2.default.number,
237
239
  eventsListeners: _propTypes2.default.object,
238
240
  isGreyed: _propTypes2.default.bool,
239
- expanded: _propTypes2.default.bool
241
+ expanded: _propTypes2.default.bool,
242
+ highlightedLabel: _propTypes2.default.string
240
243
  } : {};
241
244
 
242
245
  exports.default = Item;
@@ -3,7 +3,8 @@
3
3
  exports.__esModule = true;
4
4
  exports.withSpotlight = exports.spotlightFilter = undefined;
5
5
 
6
- var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
6
+ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; /* eslint react/prop-types: 0 */
7
+
7
8
 
8
9
  var _ramda = require('ramda');
9
10
 
@@ -19,8 +20,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
19
20
 
20
21
  function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
21
22
 
22
- function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } /* eslint react/prop-types: 0 */
23
-
23
+ function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
24
24
 
25
25
  var spotlightFilter = exports.spotlightFilter = function spotlightFilter(term) {
26
26
  var labelRenderer = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : R.prop('label');
@@ -44,31 +44,47 @@ var spotlightFilter = exports.spotlightFilter = function spotlightFilter(term) {
44
44
  }
45
45
  return acc;
46
46
  };
47
+ var matchRegExp = function matchRegExp(str) {
48
+ return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
49
+ };
50
+
51
+ // Highlight matching terms in the label
52
+ var highlightLabel = function highlightLabel(label) {
53
+ var regex = new RegExp('(' + matchRegExp(term) + ')', 'gi');
54
+ return label.replace(regex, function (match) {
55
+ return '<span style=background-color:yellow;border-bottom:2px solid #8CC841>' + match + '</span>';
56
+ });
57
+ };
47
58
 
48
59
  var recurse = function recurse(item) {
49
- var isValidItem = R.includes(R.toLower(term), R.toLower(labelRenderer(item)));
60
+ var label = labelRenderer(item);
61
+ var isValidItem = R.includes(R.toLower(term), R.toLower(label));
50
62
 
51
63
  var result = [];
52
64
 
53
65
  if (isValidItem) {
66
+ var highlightedLabel = highlightLabel(label);
67
+ console.log(highlightedLabel);
54
68
  var parents = findParents(item);
55
- result = [].concat(parents, [item]);
69
+ result = [].concat(parents, [_extends({}, item, { highlightedLabel: highlightedLabel })]);
70
+
56
71
  if (displayChildren) {
57
72
  var children = (0, _utils.getDescendants)(R.prop('id', item), groupedItemsByParentId);
58
- return [].concat(parents, [item], children);
73
+ return [].concat(parents, [_extends({}, item, { highlightedLabel: highlightedLabel })], children);
59
74
  }
60
75
  }
76
+
61
77
  if (R.has((0, _utils.getHierarchicalId)(item), groupedItemsByParentId)) {
62
78
  var childItems = groupedItemsByParentId[(0, _utils.getHierarchicalId)(item)] || [];
63
79
  var matchingChildren = R.chain(recurse, childItems);
64
80
 
65
81
  // res with any matching children
66
- return R.uniq([].concat(result, matchingChildren));
82
+ return R.uniqBy(R.prop('id'), [].concat(result, matchingChildren));
67
83
  }
68
84
  return result;
69
85
  };
70
86
 
71
- return R.uniq(R.chain(recurse, groupedItemsByParentId['#ROOT'] || []));
87
+ return R.uniqBy(R.prop('id'))(R.chain(recurse, groupedItemsByParentId['#ROOT'] || []));
72
88
  };
73
89
  };
74
90
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sis-cc/dotstatsuite-visions",
3
- "version": "12.5.0",
3
+ "version": "12.7.0",
4
4
  "description": "Library of visual components",
5
5
  "author": "OECD",
6
6
  "homepage": "https://visions-qa.siscc.org/#o",
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @sis-cc/dotstatsuite-visions v12.5.0 - https://visions-qa.siscc.org/#o
2
+ * @sis-cc/dotstatsuite-visions v12.7.0 - https://visions-qa.siscc.org/#o
3
3
  * MIT Licensed
4
4
  */
5
5
  (function webpackUniversalModuleDefinition(root, factory) {
@@ -9187,7 +9187,7 @@ if (true) {
9187
9187
  /* 166 */
9188
9188
  /***/ (function(module) {
9189
9189
 
9190
- module.exports = {"name":"@sis-cc/dotstatsuite-visions","version":"12.5.0","description":"Library of visual components","author":"OECD","homepage":"https://visions-qa.siscc.org/#o","license":"MIT","repository":"https://gitlab.com/sis-cc/.stat-suite/dotstatsuite-visions","main":"lib/index.js","module":"es/index.js","engines":{"node":">=14"},"files":["css","es","lib","umd"],"scripts":{"build":"nwb build-react-component --copy-files --no-demo && node scripts/doc && nwb build-demo","build:dev":"nwb build-react-component --copy-files --no-demo","clean":"nwb clean-module && nwb clean-demo","prepublishOnly":"npm run build","start":"nwb serve-react-demo","test":"jest","test:watch":"jest --watch --no-cache","lint":"eslint src/ --color","precommit":"lint-staged"},"dependencies":{"@emotion/react":"^11.13.0","@emotion/styled":"^11.13.0","@hello-pangea/dnd":"^16.6.0","@mui/icons-material":"^5.16.5","@mui/material":"^5.16.5","@mui/styles":"^5.16.5","@react-hook/size":"^2.1.1","classnames":"^2.2.6","cross-env":"^7.0.3","date-fns":"^1.30.1","isemail":"^3.2.0","numeral":"^2.0.6","prop-types":"^15.7.2","ramda":"^0.27.0","react-draggable":"^4.4.5","react-error-boundary":"^4.0.10","react-virtualized":"^9.21.2"},"peerDependencies":{"@mui/icons-material":"^5.16.5","@mui/material":"^5.16.5","react":"^18","react-dom":"^18"},"devDependencies":{"@babel/eslint-parser":"^7.5.4","@babel/plugin-syntax-dynamic-import":"^7.2.0","@cfaester/enzyme-adapter-react-18":"^0.7.0","@mui/icons-material":"^5.16.5","@mui/material":"^5.16.5","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^14.0.0","babel-jest":"^24.8.0","babel-preset-react-app":"^9.0.0","dox":"^0.9.0","eslint":"^8.39.0","eslint-plugin-import":"^2.27.5","eslint-plugin-jsx-a11y":"^6.7.1","eslint-plugin-prettier":"^4.2.1","eslint-plugin-react":"^7.32.2","eslint-plugin-react-hooks":"^4.6.0","husky":"^2.7.0","identity-obj-proxy":"^3.0.0","jest":"^24.8.0","jss":"^10.10.0","jss-rtl":"^0.2.3","lint-staged":"^8.2.1","mutationobserver-shim":"^0.3.7","nwb":"0.23.0","prettier":"^2.8.8","pretty-quick":"^3.1.3","react":"^18","react-a11y":"^1.1.0","react-dom":"^18","react-helmet":"^5.2.1","react-scrollable-anchor":"^0.6.1","react-syntax-highlighter":"^10.2.1","sanitize-html":"2.7.0","webpack":"^5.68.0","webpack-cli":"^4.9.2","webpack-dev-server":"^4.7.4"},"jest":{"verbose":true,"coverageDirectory":"coverage","collectCoverageFrom":["src/**/*.{js,jsx,ts,tsx}","!src/ScopeList/*.{js,jsx,ts,tsx}","!src/**/*.d.ts"],"setupFilesAfterEnv":["<rootDir>/tests/setup.js"],"testMatch":["**/tests/**/*.{spec,test}.{js,jsx,ts,tsx}","!**/tests/ScopeList.test.js"],"testEnvironment":"jsdom","transform":{"^.+\\.(js|jsx|ts|tsx)$":"<rootDir>/node_modules/babel-jest"},"transformIgnorePatterns":["[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$","^.+\\.module\\.(css|sass|scss)$"],"modulePaths":[],"moduleNameMapper":{"^react-native$":"react-native-web","^.+\\.module\\.(css|sass|scss)$":"identity-obj-proxy","\\.(jpg|jpeg|png)$":"identity-obj-proxy"},"moduleFileExtensions":["web.js","js","web.ts","ts","web.tsx","tsx","json","web.jsx","jsx","node"]},"babel":{"presets":["react-app"],"plugins":["@babel/plugin-syntax-dynamic-import"]},"eslintConfig":{"env":{"browser":true,"jest":true,"node":true,"es6":true},"extends":["eslint:recommended","plugin:react/recommended","plugin:jsx-a11y/recommended"],"parser":"@babel/eslint-parser","parserOptions":{"babelOptions":{"presets":[["babel-preset-react-app",false],"babel-preset-react-app/test"]},"ecmaFeatures":{"experimentalObjectRestSpread":true,"jsx":true},"sourceType":"module"},"plugins":["prettier","react","import","react-hooks","jsx-a11y"],"rules":{"no-console":"warn","no-unused-vars":"error","react/display-name":"off","react-hooks/rules-of-hooks":"error","react-hooks/exhaustive-deps":"warn","no-use-before-define":"error"}},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"husky":{"hooks":{"pre-commit":"lint-staged"}},"lint-staged":{"src/**/*.{js,css}":["prettier --write","git add","yarn lint"]},"prettier":{"endOfLine":"lf","useTabs":false,"printWidth":100,"tabWidth":2,"singleQuote":true,"trailingComma":"all","bracketSameLine":false,"bracketSpacing":true,"parser":"babel","semi":true,"arrowParens":"avoid"}};
9190
+ module.exports = {"name":"@sis-cc/dotstatsuite-visions","version":"12.7.0","description":"Library of visual components","author":"OECD","homepage":"https://visions-qa.siscc.org/#o","license":"MIT","repository":"https://gitlab.com/sis-cc/.stat-suite/dotstatsuite-visions","main":"lib/index.js","module":"es/index.js","engines":{"node":">=14"},"files":["css","es","lib","umd"],"scripts":{"build":"nwb build-react-component --copy-files --no-demo && node scripts/doc && nwb build-demo","build:dev":"nwb build-react-component --copy-files --no-demo","clean":"nwb clean-module && nwb clean-demo","prepublishOnly":"npm run build","start":"nwb serve-react-demo","test":"jest","test:watch":"jest --watch --no-cache","lint":"eslint src/ --color","precommit":"lint-staged"},"dependencies":{"@emotion/react":"^11.13.0","@emotion/styled":"^11.13.0","@hello-pangea/dnd":"^16.6.0","@mui/icons-material":"^5.16.5","@mui/material":"^5.16.5","@mui/styles":"^5.16.5","@react-hook/size":"^2.1.1","classnames":"^2.2.6","cross-env":"^7.0.3","date-fns":"^1.30.1","isemail":"^3.2.0","numeral":"^2.0.6","prop-types":"^15.7.2","ramda":"^0.27.0","react-draggable":"^4.4.5","react-error-boundary":"^4.0.10","react-virtualized":"^9.21.2"},"peerDependencies":{"@mui/icons-material":"^5.16.5","@mui/material":"^5.16.5","react":"^18","react-dom":"^18"},"devDependencies":{"@babel/eslint-parser":"^7.5.4","@babel/plugin-syntax-dynamic-import":"^7.2.0","@cfaester/enzyme-adapter-react-18":"^0.7.0","@mui/icons-material":"^5.16.5","@mui/material":"^5.16.5","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^14.0.0","babel-jest":"^24.8.0","babel-preset-react-app":"^9.0.0","dox":"^0.9.0","eslint":"^8.39.0","eslint-plugin-import":"^2.27.5","eslint-plugin-jsx-a11y":"^6.7.1","eslint-plugin-prettier":"^4.2.1","eslint-plugin-react":"^7.32.2","eslint-plugin-react-hooks":"^4.6.0","husky":"^2.7.0","identity-obj-proxy":"^3.0.0","jest":"^24.8.0","jss":"^10.10.0","jss-rtl":"^0.2.3","lint-staged":"^8.2.1","mutationobserver-shim":"^0.3.7","nwb":"0.23.0","prettier":"^2.8.8","pretty-quick":"^3.1.3","react":"^18","react-a11y":"^1.1.0","react-dom":"^18","react-helmet":"^5.2.1","react-scrollable-anchor":"^0.6.1","react-syntax-highlighter":"^10.2.1","sanitize-html":"2.7.0","webpack":"^5.68.0","webpack-cli":"^4.9.2","webpack-dev-server":"^4.7.4"},"jest":{"verbose":true,"coverageDirectory":"coverage","collectCoverageFrom":["src/**/*.{js,jsx,ts,tsx}","!src/ScopeList/*.{js,jsx,ts,tsx}","!src/**/*.d.ts"],"setupFilesAfterEnv":["<rootDir>/tests/setup.js"],"testMatch":["**/tests/**/*.{spec,test}.{js,jsx,ts,tsx}","!**/tests/ScopeList.test.js"],"testEnvironment":"jsdom","transform":{"^.+\\.(js|jsx|ts|tsx)$":"<rootDir>/node_modules/babel-jest"},"transformIgnorePatterns":["[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$","^.+\\.module\\.(css|sass|scss)$"],"modulePaths":[],"moduleNameMapper":{"^react-native$":"react-native-web","^.+\\.module\\.(css|sass|scss)$":"identity-obj-proxy","\\.(jpg|jpeg|png)$":"identity-obj-proxy"},"moduleFileExtensions":["web.js","js","web.ts","ts","web.tsx","tsx","json","web.jsx","jsx","node"]},"babel":{"presets":["react-app"],"plugins":["@babel/plugin-syntax-dynamic-import"]},"eslintConfig":{"env":{"browser":true,"jest":true,"node":true,"es6":true},"extends":["eslint:recommended","plugin:react/recommended","plugin:jsx-a11y/recommended"],"parser":"@babel/eslint-parser","parserOptions":{"babelOptions":{"presets":[["babel-preset-react-app",false],"babel-preset-react-app/test"]},"ecmaFeatures":{"experimentalObjectRestSpread":true,"jsx":true},"sourceType":"module"},"plugins":["prettier","react","import","react-hooks","jsx-a11y"],"rules":{"no-console":"warn","no-unused-vars":"error","react/display-name":"off","react-hooks/rules-of-hooks":"error","react-hooks/exhaustive-deps":"warn","no-use-before-define":"error"}},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"husky":{"hooks":{"pre-commit":"lint-staged"}},"lint-staged":{"src/**/*.{js,css}":["prettier --write","git add","yarn lint"]},"prettier":{"endOfLine":"lf","useTabs":false,"printWidth":100,"tabWidth":2,"singleQuote":true,"trailingComma":"all","bracketSameLine":false,"bracketSpacing":true,"parser":"babel","semi":true,"arrowParens":"avoid"}};
9191
9191
 
9192
9192
  /***/ }),
9193
9193
  /* 167 */
@@ -64668,6 +64668,8 @@ var TableHtml5_extends = Object.assign || function (target) { for (var i = 1; i
64668
64668
  var TableHtml5_useStyles = makeStyles(function (theme) {
64669
64669
  return {
64670
64670
  table: {
64671
+ outline: '1px solid transparent',
64672
+ transform: 'translateZ(0)',
64671
64673
  borderCollapse: 'separate',
64672
64674
  borderLeft: 'thin solid ' + theme.palette.grey[500],
64673
64675
  borderTop: 'thin solid ' + theme.palette.grey[500],
@@ -79542,7 +79544,8 @@ var VirtualizedTree_Item_Item = function Item(_ref) {
79542
79544
  _ref$depth = _ref.depth,
79543
79545
  depth = _ref$depth === undefined ? 0 : _ref$depth,
79544
79546
  eventsListeners = _ref.eventsListeners,
79545
- expanded = _ref.expanded;
79547
+ expanded = _ref.expanded,
79548
+ highlightedLabel = _ref.highlightedLabel;
79546
79549
 
79547
79550
  var _useKeyboardEscapeHan = useKeybordEscapeHandler(),
79548
79551
  open = _useKeyboardEscapeHan.open,
@@ -79550,6 +79553,7 @@ var VirtualizedTree_Item_Item = function Item(_ref) {
79550
79553
 
79551
79554
  var padding = depth * 30 + (depth > 0 && !hasChildrenOnLevel ? 30 : 0) + (!hasChild && hasChildrenOnLevel ? 30 : 0);
79552
79555
 
79556
+ var formattedLabel = highlightedLabel ? react_default.a.createElement('div', { dangerouslySetInnerHTML: { __html: highlightedLabel } }) : label;
79553
79557
  return react_default.a.createElement(
79554
79558
  material_ListItem_ListItem,
79555
79559
  {
@@ -79651,7 +79655,7 @@ var VirtualizedTree_Item_Item = function Item(_ref) {
79651
79655
  variant: 'body2',
79652
79656
  className: classnames_default()(classes.label, (_cx5 = {}, _cx5[classes.disabledLabel] = isGreyed, _cx5[classes.tooltipNotice] = !es_isEmpty(description), _cx5))
79653
79657
  },
79654
- label
79658
+ formattedLabel
79655
79659
  )
79656
79660
  ),
79657
79661
  es_not(es_isNil(count)) && react_default.a.createElement(
@@ -79693,7 +79697,8 @@ VirtualizedTree_Item_Item.propTypes = {
79693
79697
  depth: prop_types_default.a.number,
79694
79698
  eventsListeners: prop_types_default.a.object,
79695
79699
  isGreyed: prop_types_default.a.bool,
79696
- expanded: prop_types_default.a.bool
79700
+ expanded: prop_types_default.a.bool,
79701
+ highlightedLabel: prop_types_default.a.string
79697
79702
  };
79698
79703
 
79699
79704
  /* harmony default export */ var VirtualizedTree_Item = (VirtualizedTree_Item_Item);
@@ -80769,31 +80774,47 @@ var withSpotlight_spotlightFilter = function spotlightFilter(term) {
80769
80774
  }
80770
80775
  return acc;
80771
80776
  };
80777
+ var matchRegExp = function matchRegExp(str) {
80778
+ return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
80779
+ };
80780
+
80781
+ // Highlight matching terms in the label
80782
+ var highlightLabel = function highlightLabel(label) {
80783
+ var regex = new RegExp('(' + matchRegExp(term) + ')', 'gi');
80784
+ return label.replace(regex, function (match) {
80785
+ return '<span style=background-color:yellow;border-bottom:2px solid #8CC841>' + match + '</span>';
80786
+ });
80787
+ };
80772
80788
 
80773
80789
  var recurse = function recurse(item) {
80774
- var isValidItem = es_includes(es_toLower(term), es_toLower(labelRenderer(item)));
80790
+ var label = labelRenderer(item);
80791
+ var isValidItem = es_includes(es_toLower(term), es_toLower(label));
80775
80792
 
80776
80793
  var result = [];
80777
80794
 
80778
80795
  if (isValidItem) {
80796
+ var highlightedLabel = highlightLabel(label);
80797
+ console.log(highlightedLabel);
80779
80798
  var parents = findParents(item);
80780
- result = [].concat(parents, [item]);
80799
+ result = [].concat(parents, [withSpotlight_extends({}, item, { highlightedLabel: highlightedLabel })]);
80800
+
80781
80801
  if (displayChildren) {
80782
80802
  var children = utils_getDescendants(es_prop('id', item), groupedItemsByParentId);
80783
- return [].concat(parents, [item], children);
80803
+ return [].concat(parents, [withSpotlight_extends({}, item, { highlightedLabel: highlightedLabel })], children);
80784
80804
  }
80785
80805
  }
80806
+
80786
80807
  if (es_has(utils_getHierarchicalId(item), groupedItemsByParentId)) {
80787
80808
  var childItems = groupedItemsByParentId[utils_getHierarchicalId(item)] || [];
80788
80809
  var matchingChildren = es_chain(recurse, childItems);
80789
80810
 
80790
80811
  // res with any matching children
80791
- return es_uniq([].concat(result, matchingChildren));
80812
+ return es_uniqBy(es_prop('id'), [].concat(result, matchingChildren));
80792
80813
  }
80793
80814
  return result;
80794
80815
  };
80795
80816
 
80796
- return es_uniq(es_chain(recurse, groupedItemsByParentId['#ROOT'] || []));
80817
+ return es_uniqBy(es_prop('id'))(es_chain(recurse, groupedItemsByParentId['#ROOT'] || []));
80797
80818
  };
80798
80819
  };
80799
80820