@bundle-stats/ui 3.2.1-beta.8 → 3.2.1-beta.9

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.
package/CHANGELOG.md CHANGED
@@ -3,7 +3,7 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
- ## [3.2.1-beta.8](https://github.com/relative-ci/bundle-stats/compare/v3.2.0...v3.2.1-beta.8) (2021-11-22)
6
+ ## [3.2.1-beta.9](https://github.com/relative-ci/bundle-stats/compare/v3.2.0...v3.2.1-beta.9) (2021-11-23)
7
7
 
8
8
 
9
9
  ### Bug Fixes
@@ -22,6 +22,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
22
22
 
23
23
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
24
24
 
25
+ // eslint-disable-next-line import/no-relative-packages
25
26
  var browsertimeFixtures = browsertime.filter(_browsertime2["default"]);
26
27
  var JOBS = (0, _utils.createJobs)([{
27
28
  browsertime: browsertimeFixtures
@@ -59,6 +59,22 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
59
59
 
60
60
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
61
61
 
62
+ var getTooltip = function getTooltip(items, jobs, itemIndex, runIndex) {
63
+ return function () {
64
+ return /*#__PURE__*/_react["default"].createElement(_summaryItem.SummaryItem, {
65
+ className: _bundleAssetsTotalsChartBarsModule["default"].itemTooltip,
66
+ id: (0, _get2["default"])(items, [itemIndex, 'key']),
67
+ data: {
68
+ current: (0, _get2["default"])(items, [itemIndex, 'runs', runIndex, 'value'], 0),
69
+ baseline: (0, _get2["default"])(items, [itemIndex, 'runs', runIndex + 1, 'value'], 0)
70
+ },
71
+ showDelta: runIndex < jobs.length - 1,
72
+ showBaselineValue: runIndex < jobs.length - 1,
73
+ size: "large"
74
+ });
75
+ };
76
+ };
77
+
62
78
  var BundleAssetsTotalsChartBars = function BundleAssetsTotalsChartBars(_ref) {
63
79
  var className = _ref.className,
64
80
  jobs = _ref.jobs,
@@ -88,23 +104,6 @@ var BundleAssetsTotalsChartBars = function BundleAssetsTotalsChartBars(_ref) {
88
104
  var colors = (0, _utils2.getColors)((0, _max2["default"])((0, _map2["default"])(dataGraphs, function (values) {
89
105
  return values.length;
90
106
  })));
91
-
92
- var getTooltip = function getTooltip(itemIndex, runIndex) {
93
- return function () {
94
- return /*#__PURE__*/_react["default"].createElement(_summaryItem.SummaryItem, {
95
- className: _bundleAssetsTotalsChartBarsModule["default"].itemTooltip,
96
- id: (0, _get2["default"])(items, [itemIndex, 'key']),
97
- data: {
98
- current: (0, _get2["default"])(items, [itemIndex, 'runs', runIndex, 'value'], 0),
99
- baseline: (0, _get2["default"])(items, [itemIndex, 'runs', runIndex + 1, 'value'], 0)
100
- },
101
- showDelta: runIndex < jobs.length - 1,
102
- showBaselineValue: runIndex < jobs.length - 1,
103
- size: "large"
104
- });
105
- };
106
- };
107
-
108
107
  return /*#__PURE__*/_react["default"].createElement(_stack.Stack, {
109
108
  className: rootClassName,
110
109
  space: "medium"
@@ -115,7 +114,7 @@ var BundleAssetsTotalsChartBars = function BundleAssetsTotalsChartBars(_ref) {
115
114
  value: value,
116
115
  color: colors[valueIndex],
117
116
  label: labels[valueIndex],
118
- getItemTooltip: getTooltip(valueIndex, runIndex)
117
+ getItemTooltip: getTooltip(items, jobs, valueIndex, runIndex)
119
118
  };
120
119
  });
121
120
  return /*#__PURE__*/_react["default"].createElement("div", {
@@ -42,7 +42,7 @@ var JobMeta = function JobMeta(props) {
42
42
  }, title && /*#__PURE__*/_react["default"].createElement("h2", {
43
43
  className: _jobMetaModule["default"].itemTitle
44
44
  }, title), content.map(function (item) {
45
- return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, item);
45
+ return item;
46
46
  }));
47
47
  }));
48
48
  };
@@ -27,18 +27,12 @@ var _summaryItem = require("../summary-item");
27
27
 
28
28
  var _summaryModule = _interopRequireDefault(require("./summary.module.css"));
29
29
 
30
- var _excluded = ["className"];
30
+ var _excluded = ["className", "metricOptions", "SummaryItemCustomLink"];
31
31
 
32
32
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
33
33
 
34
34
  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
35
35
 
36
- function _extends() { _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; }; return _extends.apply(this, arguments); }
37
-
38
- function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
39
-
40
- function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
41
-
42
36
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
43
37
 
44
38
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -51,49 +45,73 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
51
45
 
52
46
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
53
47
 
54
- var Summary = function Summary(_ref) {
48
+ function _extends() { _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; }; return _extends.apply(this, arguments); }
49
+
50
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
51
+
52
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
53
+
54
+ var CustomSummaryItem = function CustomSummaryItem(_ref) {
55
55
  var className = _ref.className,
56
- size = _ref.size,
57
- keys = _ref.keys,
58
- data = _ref.data,
59
- loading = _ref.loading,
60
- showSummaryItemDelta = _ref.showSummaryItemDelta,
61
- SummaryItemCustomLink = _ref.summaryItemLink;
56
+ metricOptions = _ref.metricOptions,
57
+ SummaryItemCustomLink = _ref.SummaryItemCustomLink,
58
+ props = _objectWithoutProperties(_ref, _excluded);
59
+
60
+ return /*#__PURE__*/_react["default"].createElement(_box.Box, _extends({
61
+ padding: ['xsmall', 'small'],
62
+ className: (0, _classnames["default"])(className, _summaryModule["default"].summaryItemLink)
63
+ }, props, {
64
+ as: SummaryItemCustomLink
65
+ }, metricOptions.link));
66
+ };
67
+
68
+ CustomSummaryItem.propTypes = {
69
+ className: _propTypes["default"].string,
70
+ metricOptions: _propTypes["default"].shape({
71
+ link: _propTypes["default"].any // eslint-disable-line react/forbid-prop-types
72
+
73
+ }).isRequired,
74
+ SummaryItemCustomLink: _propTypes["default"].elementType.isRequired
75
+ };
76
+ CustomSummaryItem.defaultProps = {
77
+ className: ''
78
+ };
79
+
80
+ var Summary = function Summary(_ref2) {
81
+ var className = _ref2.className,
82
+ size = _ref2.size,
83
+ keys = _ref2.keys,
84
+ data = _ref2.data,
85
+ loading = _ref2.loading,
86
+ showSummaryItemDelta = _ref2.showSummaryItemDelta,
87
+ SummaryItemCustomLink = _ref2.summaryItemLink;
62
88
  return /*#__PURE__*/_react["default"].createElement(_box.Box, {
63
89
  outline: true,
64
90
  className: (0, _classnames["default"])(_summaryModule["default"].root, className)
65
91
  }, /*#__PURE__*/_react["default"].createElement(_flexStack.FlexStack, {
66
92
  className: _summaryModule["default"].items
67
- }, Array.from(_utils.METRIC_COMPONENT_LINKS).filter(function (_ref2) {
68
- var _ref3 = _slicedToArray(_ref2, 1),
69
- metricId = _ref3[0];
93
+ }, Array.from(_utils.METRIC_COMPONENT_LINKS).filter(function (_ref3) {
94
+ var _ref4 = _slicedToArray(_ref3, 1),
95
+ metricId = _ref4[0];
70
96
 
71
97
  return keys.includes(metricId);
72
- }).map(function (_ref4) {
73
- var _ref5 = _slicedToArray(_ref4, 2),
74
- metricId = _ref5[0],
75
- metricOptions = _ref5[1];
98
+ }).map(function (_ref5) {
99
+ var _ref6 = _slicedToArray(_ref5, 2),
100
+ metricId = _ref6[0],
101
+ metricOptions = _ref6[1];
76
102
 
77
103
  return /*#__PURE__*/_react["default"].createElement(_summaryItem.SummaryItem, {
78
- as: function as(_ref6) {
79
- var itemClassName = _ref6.className,
80
- itemProps = _objectWithoutProperties(_ref6, _excluded);
81
-
82
- return /*#__PURE__*/_react["default"].createElement(_box.Box, _extends({
83
- padding: ['xsmall', 'small'],
84
- className: (0, _classnames["default"])(itemClassName, _summaryModule["default"].summaryItemLink)
85
- }, itemProps, {
86
- as: SummaryItemCustomLink
87
- }, metricOptions.link));
88
- },
104
+ as: CustomSummaryItem,
105
+ className: _summaryModule["default"].item,
106
+ metricOptions: metricOptions,
107
+ SummaryItemCustomLink: SummaryItemCustomLink,
89
108
  size: size,
90
109
  key: metricId,
91
110
  id: metricId,
92
111
  data: (0, _get2["default"])(data, metricId),
93
112
  loading: loading,
94
113
  showMetricDescription: true,
95
- showDelta: showSummaryItemDelta && metricOptions.showDelta !== false,
96
- className: _summaryModule["default"].item
114
+ showDelta: showSummaryItemDelta && metricOptions.showDelta !== false
97
115
  });
98
116
  })));
99
117
  };
@@ -38,7 +38,7 @@ var ACTION_RESET_ALL = 'RESET_ALL';
38
38
  var ACTION_SET = 'SET';
39
39
 
40
40
  var getSearchPattern = function getSearchPattern(search) {
41
- var searchPattern = new RegExp(/.*/);
41
+ var searchPattern = /.*/;
42
42
 
43
43
  if (!search || !search.trim()) {
44
44
  return searchPattern;
@@ -1,7 +1,8 @@
1
1
  import React from 'react';
2
2
  import { storiesOf } from '@storybook/react';
3
3
  import { createJobs } from '@bundle-stats/utils';
4
- import * as browsertime from '@bundle-stats/utils/lib-esm/browsertime';
4
+ import * as browsertime from '@bundle-stats/utils/lib-esm/browsertime'; // eslint-disable-next-line import/no-relative-packages
5
+
5
6
  import browsertimeSourceFixtures from '../../../../../fixtures/browsertime.json';
6
7
  import { getWrapperDecorator } from '../../stories';
7
8
  import { BrowsertimeTable } from '.';
@@ -17,6 +17,19 @@ import { getColors } from '../../utils';
17
17
  import { Stack } from '../../layout/stack';
18
18
  import { SummaryItem } from '../summary-item';
19
19
  import css from './bundle-assets-totals-chart-bars.module.css';
20
+
21
+ const getTooltip = (items, jobs, itemIndex, runIndex) => () => /*#__PURE__*/React.createElement(SummaryItem, {
22
+ className: css.itemTooltip,
23
+ id: _get(items, [itemIndex, 'key']),
24
+ data: {
25
+ current: _get(items, [itemIndex, 'runs', runIndex, 'value'], 0),
26
+ baseline: _get(items, [itemIndex, 'runs', runIndex + 1, 'value'], 0)
27
+ },
28
+ showDelta: runIndex < jobs.length - 1,
29
+ showBaselineValue: runIndex < jobs.length - 1,
30
+ size: "large"
31
+ });
32
+
20
33
  export const BundleAssetsTotalsChartBars = _ref => {
21
34
  let {
22
35
  className,
@@ -51,19 +64,6 @@ export const BundleAssetsTotalsChartBars = _ref => {
51
64
  }, componentData), label);
52
65
  });
53
66
  const colors = getColors(_max(_map(dataGraphs, values => values.length)));
54
-
55
- const getTooltip = (itemIndex, runIndex) => () => /*#__PURE__*/React.createElement(SummaryItem, {
56
- className: css.itemTooltip,
57
- id: _get(items, [itemIndex, 'key']),
58
- data: {
59
- current: _get(items, [itemIndex, 'runs', runIndex, 'value'], 0),
60
- baseline: _get(items, [itemIndex, 'runs', runIndex + 1, 'value'], 0)
61
- },
62
- showDelta: runIndex < jobs.length - 1,
63
- showBaselineValue: runIndex < jobs.length - 1,
64
- size: "large"
65
- });
66
-
67
67
  return /*#__PURE__*/React.createElement(Stack, {
68
68
  className: rootClassName,
69
69
  space: "medium"
@@ -75,7 +75,7 @@ export const BundleAssetsTotalsChartBars = _ref => {
75
75
  value,
76
76
  color: colors[valueIndex],
77
77
  label: labels[valueIndex],
78
- getItemTooltip: getTooltip(valueIndex, runIndex)
78
+ getItemTooltip: getTooltip(items, jobs, valueIndex, runIndex)
79
79
  }));
80
80
  return /*#__PURE__*/React.createElement("div", {
81
81
  key: internalBuildNumber || runIndex,
@@ -25,7 +25,7 @@ export const JobMeta = props => {
25
25
  key: key
26
26
  }, title && /*#__PURE__*/React.createElement("h2", {
27
27
  className: css.itemTitle
28
- }, title), content.map(item => /*#__PURE__*/React.createElement(React.Fragment, null, item)));
28
+ }, title), content.map(item => item));
29
29
  }));
30
30
  };
31
31
  JobMeta.propTypes = {
@@ -12,7 +12,34 @@ import { FlexStack } from '../../layout/flex-stack';
12
12
  import { ComponentLink } from '../component-link';
13
13
  import { SummaryItem } from '../summary-item';
14
14
  import css from './summary.module.css';
15
- export const Summary = _ref => {
15
+
16
+ const CustomSummaryItem = _ref => {
17
+ let {
18
+ className,
19
+ metricOptions,
20
+ SummaryItemCustomLink,
21
+ ...props
22
+ } = _ref;
23
+ return /*#__PURE__*/React.createElement(Box, _extends({
24
+ padding: ['xsmall', 'small'],
25
+ className: cx(className, css.summaryItemLink)
26
+ }, props, {
27
+ as: SummaryItemCustomLink
28
+ }, metricOptions.link));
29
+ };
30
+
31
+ CustomSummaryItem.propTypes = {
32
+ className: PropTypes.string,
33
+ metricOptions: PropTypes.shape({
34
+ link: PropTypes.any // eslint-disable-line react/forbid-prop-types
35
+
36
+ }).isRequired,
37
+ SummaryItemCustomLink: PropTypes.elementType.isRequired
38
+ };
39
+ CustomSummaryItem.defaultProps = {
40
+ className: ''
41
+ };
42
+ export const Summary = _ref2 => {
16
43
  let {
17
44
  className,
18
45
  size,
@@ -21,38 +48,29 @@ export const Summary = _ref => {
21
48
  loading,
22
49
  showSummaryItemDelta,
23
50
  summaryItemLink: SummaryItemCustomLink
24
- } = _ref;
51
+ } = _ref2;
25
52
  return /*#__PURE__*/React.createElement(Box, {
26
53
  outline: true,
27
54
  className: cx(css.root, className)
28
55
  }, /*#__PURE__*/React.createElement(FlexStack, {
29
56
  className: css.items
30
- }, Array.from(METRIC_COMPONENT_LINKS).filter(_ref2 => {
31
- let [metricId] = _ref2;
57
+ }, Array.from(METRIC_COMPONENT_LINKS).filter(_ref3 => {
58
+ let [metricId] = _ref3;
32
59
  return keys.includes(metricId);
33
- }).map(_ref3 => {
34
- let [metricId, metricOptions] = _ref3;
60
+ }).map(_ref4 => {
61
+ let [metricId, metricOptions] = _ref4;
35
62
  return /*#__PURE__*/React.createElement(SummaryItem, {
36
- as: _ref4 => {
37
- let {
38
- className: itemClassName,
39
- ...itemProps
40
- } = _ref4;
41
- return /*#__PURE__*/React.createElement(Box, _extends({
42
- padding: ['xsmall', 'small'],
43
- className: cx(itemClassName, css.summaryItemLink)
44
- }, itemProps, {
45
- as: SummaryItemCustomLink
46
- }, metricOptions.link));
47
- },
63
+ as: CustomSummaryItem,
64
+ className: css.item,
65
+ metricOptions: metricOptions,
66
+ SummaryItemCustomLink: SummaryItemCustomLink,
48
67
  size: size,
49
68
  key: metricId,
50
69
  id: metricId,
51
70
  data: _get(data, metricId),
52
71
  loading: loading,
53
72
  showMetricDescription: true,
54
- showDelta: showSummaryItemDelta && metricOptions.showDelta !== false,
55
- className: css.item
73
+ showDelta: showSummaryItemDelta && metricOptions.showDelta !== false
56
74
  });
57
75
  })));
58
76
  };
@@ -8,7 +8,7 @@ const ACTION_RESET_ALL = 'RESET_ALL';
8
8
  const ACTION_SET = 'SET';
9
9
 
10
10
  const getSearchPattern = search => {
11
- let searchPattern = new RegExp(/.*/);
11
+ let searchPattern = /.*/;
12
12
 
13
13
  if (!search || !search.trim()) {
14
14
  return searchPattern;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bundle-stats/ui",
3
- "version": "3.2.1-beta.8",
3
+ "version": "3.2.1-beta.9",
4
4
  "description": "UI components for BundleStats projects.",
5
5
  "main": "lib/index.js",
6
6
  "module": "lib-esm/index.js",
@@ -46,8 +46,8 @@
46
46
  "@storybook/addon-postcss": "2.0.0",
47
47
  "@storybook/addon-storyshots": "6.3.12",
48
48
  "@storybook/addons": "6.3.12",
49
- "@storybook/builder-webpack5": "^6.3.12",
50
- "@storybook/manager-webpack5": "^6.3.12",
49
+ "@storybook/builder-webpack5": "6.3.12",
50
+ "@storybook/manager-webpack5": "6.3.12",
51
51
  "@storybook/react": "6.3.12",
52
52
  "babel-core": "7.0.0-bridge.0",
53
53
  "babel-jest": "27.3.1",
@@ -84,11 +84,11 @@
84
84
  "react-router-dom": "^5.3.0"
85
85
  },
86
86
  "dependencies": {
87
- "@bundle-stats/utils": "^3.2.1-beta.8",
87
+ "@bundle-stats/utils": "^3.2.1-beta.9",
88
88
  "date-fns": "^2.6.0",
89
89
  "query-string": "^7.0.0",
90
90
  "reakit": "^1.3.6",
91
91
  "use-query-params": "^1.2.2"
92
92
  },
93
- "gitHead": "46335ff5ced2c000c843d25fe83b040fb3c43477"
93
+ "gitHead": "43b453a608ced66881eeca23c3b6c464b7dcfd8b"
94
94
  }
@@ -13,6 +13,20 @@ import { Stack } from '../../layout/stack';
13
13
  import { SummaryItem } from '../summary-item';
14
14
  import css from './bundle-assets-totals-chart-bars.module.css';
15
15
 
16
+ const getTooltip = (items, jobs, itemIndex, runIndex) => () => (
17
+ <SummaryItem
18
+ className={css.itemTooltip}
19
+ id={get(items, [itemIndex, 'key'])}
20
+ data={{
21
+ current: get(items, [itemIndex, 'runs', runIndex, 'value'], 0),
22
+ baseline: get(items, [itemIndex, 'runs', runIndex + 1, 'value'], 0),
23
+ }}
24
+ showDelta={runIndex < jobs.length - 1}
25
+ showBaselineValue={runIndex < jobs.length - 1}
26
+ size="large"
27
+ />
28
+ );
29
+
16
30
  export const BundleAssetsTotalsChartBars = ({
17
31
  className,
18
32
  jobs,
@@ -43,20 +57,6 @@ export const BundleAssetsTotalsChartBars = ({
43
57
  });
44
58
  const colors = getColors(max(map(dataGraphs, (values) => values.length)));
45
59
 
46
- const getTooltip = (itemIndex, runIndex) => () => (
47
- <SummaryItem
48
- className={css.itemTooltip}
49
- id={get(items, [itemIndex, 'key'])}
50
- data={{
51
- current: get(items, [itemIndex, 'runs', runIndex, 'value'], 0),
52
- baseline: get(items, [itemIndex, 'runs', runIndex + 1, 'value'], 0),
53
- }}
54
- showDelta={runIndex < jobs.length - 1}
55
- showBaselineValue={runIndex < jobs.length - 1}
56
- size="large"
57
- />
58
- );
59
-
60
60
  return (
61
61
  <Stack className={rootClassName} space="medium">
62
62
  {dataGraphs.map((data, runIndex) => {
@@ -66,7 +66,7 @@ export const BundleAssetsTotalsChartBars = ({
66
66
  value,
67
67
  color: colors[valueIndex],
68
68
  label: labels[valueIndex],
69
- getItemTooltip: getTooltip(valueIndex, runIndex),
69
+ getItemTooltip: getTooltip(items, jobs, valueIndex, runIndex),
70
70
  }));
71
71
 
72
72
  return (
@@ -19,9 +19,7 @@ export const JobMeta = (props) => {
19
19
  return (
20
20
  <div className={css.item} key={key}>
21
21
  {title && (<h2 className={css.itemTitle}>{title}</h2>)}
22
- {content.map((item) => (
23
- <>{item}</>
24
- ))}
22
+ {content.map((item) => item)}
25
23
  </div>
26
24
  );
27
25
  })}
@@ -11,6 +11,28 @@ import { ComponentLink } from '../component-link';
11
11
  import { SummaryItem } from '../summary-item';
12
12
  import css from './summary.module.css';
13
13
 
14
+ const CustomSummaryItem = ({ className, metricOptions, SummaryItemCustomLink, ...props }) => (
15
+ <Box
16
+ padding={['xsmall', 'small']}
17
+ className={cx(className, css.summaryItemLink)}
18
+ {...props}
19
+ as={SummaryItemCustomLink}
20
+ {...metricOptions.link}
21
+ />
22
+ );
23
+
24
+ CustomSummaryItem.propTypes = {
25
+ className: PropTypes.string,
26
+ metricOptions: PropTypes.shape({
27
+ link: PropTypes.any, // eslint-disable-line react/forbid-prop-types
28
+ }).isRequired,
29
+ SummaryItemCustomLink: PropTypes.elementType.isRequired,
30
+ };
31
+
32
+ CustomSummaryItem.defaultProps = {
33
+ className: '',
34
+ };
35
+
14
36
  export const Summary = ({
15
37
  className,
16
38
  size,
@@ -25,15 +47,10 @@ export const Summary = ({
25
47
  {Array.from(METRIC_COMPONENT_LINKS).filter(([metricId]) => keys.includes(metricId)).map(
26
48
  ([metricId, metricOptions]) => (
27
49
  <SummaryItem
28
- as={({ className: itemClassName, ...itemProps }) => (
29
- <Box
30
- padding={['xsmall', 'small']}
31
- className={cx(itemClassName, css.summaryItemLink)}
32
- {...itemProps}
33
- as={SummaryItemCustomLink}
34
- {...metricOptions.link}
35
- />
36
- )}
50
+ as={CustomSummaryItem}
51
+ className={css.item}
52
+ metricOptions={metricOptions}
53
+ SummaryItemCustomLink={SummaryItemCustomLink}
37
54
  size={size}
38
55
  key={metricId}
39
56
  id={metricId}
@@ -41,7 +58,6 @@ export const Summary = ({
41
58
  loading={loading}
42
59
  showMetricDescription
43
60
  showDelta={showSummaryItemDelta && metricOptions.showDelta !== false}
44
- className={css.item}
45
61
  />
46
62
  )
47
63
  )}
@@ -8,7 +8,7 @@ const ACTION_RESET_ALL = 'RESET_ALL';
8
8
  const ACTION_SET = 'SET';
9
9
 
10
10
  const getSearchPattern = (search) => {
11
- let searchPattern = new RegExp(/.*/);
11
+ let searchPattern = /.*/;
12
12
 
13
13
  if (!search || !search.trim()) {
14
14
  return searchPattern;