@bundle-stats/ui 3.2.2-beta.0 → 3.2.4-alpha.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.
Files changed (99) hide show
  1. package/CHANGELOG.md +26 -1
  2. package/lib/app/app.js +1 -1
  3. package/lib/app/app.stories.js +2 -2
  4. package/lib/components/browsertime-table/browsertime-table.js +1 -1
  5. package/lib/components/browsertime-table/browsertime-table.stories.js +1 -1
  6. package/lib/components/bundle-assets/bundle-assets.js +12 -10
  7. package/lib/components/bundle-assets/bundle-assets.module.css +5 -0
  8. package/lib/components/bundle-assets/bundle-assets.utils.js +2 -2
  9. package/lib/components/bundle-assets/index.js +3 -3
  10. package/lib/components/bundle-assets-totals-chart-bars/bundle-assets-totals-chart-bars.js +1 -1
  11. package/lib/components/bundle-assets-totals-table/bundle-assets-totals-table.js +1 -1
  12. package/lib/components/bundle-modules/bundle-modules.js +37 -66
  13. package/lib/components/bundle-modules/bundle-modules.module.css +0 -4
  14. package/lib/components/bundle-modules/bundle-modules.utils.js +2 -2
  15. package/lib/components/bundle-modules/index.js +3 -3
  16. package/lib/components/bundle-packages/bundle-packages.js +30 -25
  17. package/lib/components/bundle-packages/bundle-packages.module.css +37 -20
  18. package/lib/components/bundle-packages/bundle-packages.utils.js +2 -2
  19. package/lib/components/bundle-packages/index.js +1 -1
  20. package/lib/components/lighthouse-table/lighthouse-table.js +1 -1
  21. package/lib/components/metrics-table/metrics-table.js +1 -1
  22. package/lib/components/metrics-table-search/metrics-table-search.js +1 -1
  23. package/lib/components/metrics-table-search/metrics-table-search.stories.js +1 -1
  24. package/lib/components/metrics-table-title/metrics-table-title.js +7 -3
  25. package/lib/components/summary-item/summary-item.js +16 -18
  26. package/lib/components/total-size-type-title/total-size-type-title.js +7 -3
  27. package/lib/constants.js +2 -2
  28. package/lib/hooks/search-params.js +2 -2
  29. package/lib/query-state.js +1 -1
  30. package/lib/stories/wrapper.js +2 -2
  31. package/lib/ui/dropdown/dropdown.js +15 -19
  32. package/lib/ui/filters/filters.container.js +5 -5
  33. package/lib/ui/filters/filters.js +5 -7
  34. package/lib/ui/filters/filters.stories.js +3 -3
  35. package/lib/ui/horizontal-bar-chart/horizontal-bar-chart.js +3 -3
  36. package/lib/ui/hover-card/hover-card.js +65 -0
  37. package/lib/ui/hover-card/hover-card.module.css +29 -0
  38. package/lib/ui/hover-card/hover-card.stories.js +26 -0
  39. package/lib/ui/{popover → hover-card}/index.js +4 -4
  40. package/lib/ui/icon/icon.module.css +1 -0
  41. package/lib/ui/index.js +8 -8
  42. package/lib/ui/panels/panels.js +2 -2
  43. package/lib/ui/sort-dropdown/sort-dropdown.js +2 -5
  44. package/lib/ui/tabs/tabs.js +2 -2
  45. package/lib/ui/tooltip/tooltip.js +22 -14
  46. package/lib/ui/tooltip/tooltip.module.css +5 -3
  47. package/lib/utils.js +2 -2
  48. package/lib-esm/components/bundle-assets/bundle-assets.js +9 -7
  49. package/lib-esm/components/bundle-assets/bundle-assets.module.css +5 -0
  50. package/lib-esm/components/bundle-modules/bundle-modules.js +17 -29
  51. package/lib-esm/components/bundle-modules/bundle-modules.module.css +0 -4
  52. package/lib-esm/components/bundle-packages/bundle-packages.js +28 -23
  53. package/lib-esm/components/bundle-packages/bundle-packages.module.css +37 -20
  54. package/lib-esm/components/metrics-table-title/metrics-table-title.js +6 -3
  55. package/lib-esm/components/summary-item/summary-item.js +15 -18
  56. package/lib-esm/components/total-size-type-title/total-size-type-title.js +6 -3
  57. package/lib-esm/ui/dropdown/dropdown.js +9 -19
  58. package/lib-esm/ui/filters/filters.container.js +39 -41
  59. package/lib-esm/ui/filters/filters.js +3 -5
  60. package/lib-esm/ui/hover-card/hover-card.js +45 -0
  61. package/lib-esm/ui/hover-card/hover-card.module.css +29 -0
  62. package/lib-esm/ui/hover-card/hover-card.stories.js +9 -0
  63. package/lib-esm/ui/hover-card/index.js +1 -0
  64. package/lib-esm/ui/icon/icon.module.css +1 -0
  65. package/lib-esm/ui/index.js +1 -1
  66. package/lib-esm/ui/sort-dropdown/sort-dropdown.js +2 -5
  67. package/lib-esm/ui/tooltip/tooltip.js +15 -14
  68. package/lib-esm/ui/tooltip/tooltip.module.css +5 -3
  69. package/package.json +33 -30
  70. package/src/components/bundle-assets/bundle-assets.jsx +51 -42
  71. package/src/components/bundle-assets/bundle-assets.module.css +5 -0
  72. package/src/components/bundle-modules/bundle-modules.jsx +28 -31
  73. package/src/components/bundle-modules/bundle-modules.module.css +0 -4
  74. package/src/components/bundle-packages/bundle-packages.jsx +31 -25
  75. package/src/components/bundle-packages/bundle-packages.module.css +37 -20
  76. package/src/components/metrics-table-options/metrics-table-options.jsx +1 -1
  77. package/src/components/metrics-table-title/metrics-table-title.jsx +4 -3
  78. package/src/components/summary-item/summary-item.jsx +21 -26
  79. package/src/components/total-size-type-title/total-size-type-title.jsx +6 -9
  80. package/src/ui/dropdown/dropdown.jsx +14 -18
  81. package/src/ui/filters/filters.jsx +30 -39
  82. package/src/ui/hover-card/hover-card.jsx +42 -0
  83. package/src/ui/hover-card/hover-card.module.css +29 -0
  84. package/src/ui/hover-card/index.js +1 -0
  85. package/src/ui/icon/icon.module.css +1 -0
  86. package/src/ui/index.js +1 -1
  87. package/src/ui/sort-dropdown/sort-dropdown.jsx +9 -11
  88. package/src/ui/tooltip/tooltip.jsx +20 -27
  89. package/src/ui/tooltip/tooltip.module.css +5 -3
  90. package/lib/ui/popover/popover.js +0 -92
  91. package/lib/ui/popover/popover.module.css +0 -66
  92. package/lib/ui/popover/popover.stories.js +0 -26
  93. package/lib-esm/ui/popover/index.js +0 -1
  94. package/lib-esm/ui/popover/popover.js +0 -71
  95. package/lib-esm/ui/popover/popover.module.css +0 -66
  96. package/lib-esm/ui/popover/popover.stories.js +0 -14
  97. package/src/ui/popover/index.js +0 -1
  98. package/src/ui/popover/popover.jsx +0 -79
  99. package/src/ui/popover/popover.module.css +0 -66
package/CHANGELOG.md CHANGED
@@ -3,7 +3,32 @@
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.2-beta.0](https://github.com/relative-ci/bundle-stats/compare/v3.2.1...v3.2.2-beta.0) (2021-12-08)
6
+ ## [3.2.4-alpha.0](https://github.com/relative-ci/bundle-stats/compare/v3.2.3...v3.2.4-alpha.0) (2022-01-13)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **ui:** Icon - center by default ([889753c](https://github.com/relative-ci/bundle-stats/commit/889753c0feb236130a2707fbc352310ef07c7740))
12
+ * **ui:** Remove popover component ([e07d7a9](https://github.com/relative-ci/bundle-stats/commit/e07d7a91640f67b4f99320e1af92f1092a6e610d))
13
+
14
+
15
+ ### Features
16
+
17
+ * **ui:** Add hover card ([e27169e](https://github.com/relative-ci/bundle-stats/commit/e27169e4dd1e313f6903bd70f5ffc1e1cc147f9a))
18
+
19
+
20
+
21
+
22
+
23
+ ## [3.2.3](https://github.com/relative-ci/bundle-stats/compare/v3.2.2...v3.2.3) (2022-01-10)
24
+
25
+ **Note:** Version bump only for package @bundle-stats/ui
26
+
27
+
28
+
29
+
30
+
31
+ ## [3.2.2](https://github.com/relative-ci/bundle-stats/compare/v3.2.1...v3.2.2) (2021-12-08)
7
32
 
8
33
 
9
34
  ### Bug Fixes
package/lib/app/app.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
4
 
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
@@ -26,9 +26,9 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
26
26
 
27
27
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
28
28
 
29
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
29
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
30
30
 
31
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
31
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
32
32
 
33
33
  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; }
34
34
 
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
4
 
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
4
 
5
5
  var _react = _interopRequireDefault(require("react"));
6
6
 
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
4
 
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
@@ -29,7 +29,7 @@ var _icon = require("../../ui/icon");
29
29
 
30
30
  var _fileName = require("../../ui/file-name");
31
31
 
32
- var _popover = require("../../ui/popover");
32
+ var _hoverCard = require("../../ui/hover-card");
33
33
 
34
34
  var _tooltip = require("../../ui/tooltip");
35
35
 
@@ -63,9 +63,9 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
63
63
 
64
64
  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); }
65
65
 
66
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
66
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
67
67
 
68
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
68
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
69
69
 
70
70
  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; }
71
71
 
@@ -137,11 +137,11 @@ var getRenderRowHeader = function getRenderRowHeader(_ref6) {
137
137
  isChunk = item.isChunk,
138
138
  isEntry = item.isEntry,
139
139
  isInitial = item.isInitial;
140
- return /*#__PURE__*/_react["default"].createElement(_popover.Popover, {
141
- label: /*#__PURE__*/_react["default"].createElement(_fileName.FileName, {
142
- name: label
143
- }),
144
- icon: /*#__PURE__*/_react["default"].createElement("div", {
140
+ return /*#__PURE__*/_react["default"].createElement(_hoverCard.HoverCard, {
141
+ label: /*#__PURE__*/_react["default"].createElement(_flexStack.FlexStack, {
142
+ space: "xxxsmall",
143
+ className: _bundleAssetsModule["default"].assetName
144
+ }, /*#__PURE__*/_react["default"].createElement("div", {
145
145
  className: _bundleAssetsModule["default"].assetInfoFlags
146
146
  }, isNotPredictive && /*#__PURE__*/_react["default"].createElement(_tooltip.Tooltip, {
147
147
  className: _bundleAssetsModule["default"].notPredictive,
@@ -160,7 +160,9 @@ var getRenderRowHeader = function getRenderRowHeader(_ref6) {
160
160
  }, "e"), isInitial && /*#__PURE__*/_react["default"].createElement("span", {
161
161
  title: "Initial",
162
162
  className: _bundleAssetsModule["default"].flagInitial
163
- }, "i"))
163
+ }, "i")), /*#__PURE__*/_react["default"].createElement(_fileName.FileName, {
164
+ name: label
165
+ }))
164
166
  }, /*#__PURE__*/_react["default"].createElement(_assetInfo.AssetInfo, {
165
167
  className: _bundleAssetsModule["default"].assetInfo,
166
168
  item: item,
@@ -8,6 +8,11 @@
8
8
  margin-right: -1px; /** collapse border */
9
9
  }
10
10
 
11
+ .assetName {
12
+ display: inline-flex;
13
+ align-items: center;
14
+ }
15
+
11
16
  .notPredictive {
12
17
  margin-right: var(--space-xxsmall);
13
18
  display: inline-block;
@@ -13,9 +13,9 @@ var _bundleAssets = require("./bundle-assets.constants");
13
13
 
14
14
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
15
15
 
16
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
16
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
17
17
 
18
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
18
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
19
19
 
20
20
  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; }
21
21
 
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
4
 
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
@@ -39,9 +39,9 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
39
39
 
40
40
  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); }
41
41
 
42
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
42
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
43
43
 
44
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
44
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
45
45
 
46
46
  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; }
47
47
 
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
4
 
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
4
 
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
4
 
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
@@ -35,7 +35,7 @@ var _fileName = require("../../ui/file-name");
35
35
 
36
36
  var _filters = require("../../ui/filters");
37
37
 
38
- var _popover = require("../../ui/popover");
38
+ var _hoverCard = require("../../ui/hover-card");
39
39
 
40
40
  var _sortDropdown = require("../../ui/sort-dropdown");
41
41
 
@@ -61,24 +61,12 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
61
61
 
62
62
  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); }
63
63
 
64
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
64
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
65
65
 
66
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
66
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
67
67
 
68
68
  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; }
69
69
 
70
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
71
-
72
- 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."); }
73
-
74
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
75
-
76
- 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; }
77
-
78
- function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
79
-
80
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
81
-
82
70
  var RowHeader = function RowHeader(_ref) {
83
71
  var row = _ref.row,
84
72
  chunks = _ref.chunks,
@@ -86,35 +74,18 @@ var RowHeader = function RowHeader(_ref) {
86
74
  CustomComponentLink = _ref.CustomComponentLink;
87
75
  var chunkIds = (0, _map2["default"])(chunks, 'id');
88
76
 
89
- var _useState = (0, _react.useState)(false),
90
- _useState2 = _slicedToArray(_useState, 2),
91
- showPopopver = _useState2[0],
92
- setPopover = _useState2[1];
93
-
94
- var handleOnMouseEnter = (0, _react.useCallback)(function () {
95
- return setPopover(true);
96
- }, [showPopopver]);
97
-
98
77
  var content = /*#__PURE__*/_react["default"].createElement(_fileName.FileName, {
99
78
  name: row.label
100
79
  });
101
80
 
102
- return /*#__PURE__*/_react["default"].createElement("div", {
103
- onMouseEnter: handleOnMouseEnter
104
- }, !showPopopver ? content : /*#__PURE__*/_react["default"].createElement(_popover.Popover, {
105
- ariaLabel: "View module info",
81
+ return /*#__PURE__*/_react["default"].createElement(_hoverCard.HoverCard, {
106
82
  label: content
107
- }, function (_ref2) {
108
- var popoverToggle = _ref2.popoverToggle;
109
- return /*#__PURE__*/_react["default"].createElement(_moduleInfo.ModuleInfo, {
110
- className: _bundleModulesModule["default"].namePopover,
111
- item: row,
112
- chunks: chunks,
113
- chunkIds: chunkIds,
114
- labels: labels,
115
- customComponentLink: CustomComponentLink,
116
- onClick: popoverToggle
117
- });
83
+ }, /*#__PURE__*/_react["default"].createElement(_moduleInfo.ModuleInfo, {
84
+ item: row,
85
+ chunks: chunks,
86
+ chunkIds: chunkIds,
87
+ labels: labels,
88
+ customComponentLink: CustomComponentLink
118
89
  }));
119
90
  };
120
91
 
@@ -133,10 +104,10 @@ RowHeader.defaultProps = {
133
104
  chunks: []
134
105
  };
135
106
 
136
- var getRenderRowHeader = function getRenderRowHeader(_ref3) {
137
- var labels = _ref3.labels,
138
- chunks = _ref3.chunks,
139
- CustomComponentLink = _ref3.CustomComponentLink;
107
+ var getRenderRowHeader = function getRenderRowHeader(_ref2) {
108
+ var labels = _ref2.labels,
109
+ chunks = _ref2.chunks,
110
+ CustomComponentLink = _ref2.CustomComponentLink;
140
111
  return function (row) {
141
112
  return /*#__PURE__*/_react["default"].createElement(RowHeader, {
142
113
  row: row,
@@ -147,25 +118,25 @@ var getRenderRowHeader = function getRenderRowHeader(_ref3) {
147
118
  };
148
119
  };
149
120
 
150
- var BundleModules = function BundleModules(_ref4) {
121
+ var BundleModules = function BundleModules(_ref3) {
151
122
  var _MODULE_SOURCE_TYPE, _objectSpread2;
152
123
 
153
- var className = _ref4.className,
154
- jobs = _ref4.jobs,
155
- items = _ref4.items,
156
- chunks = _ref4.chunks,
157
- totalRowCount = _ref4.totalRowCount,
158
- updateFilters = _ref4.updateFilters,
159
- resetFilters = _ref4.resetFilters,
160
- resetAllFilters = _ref4.resetAllFilters,
161
- filters = _ref4.filters,
162
- sortFields = _ref4.sortFields,
163
- sort = _ref4.sort,
164
- updateSort = _ref4.updateSort,
165
- search = _ref4.search,
166
- updateSearch = _ref4.updateSearch,
167
- hasActiveFilters = _ref4.hasActiveFilters,
168
- CustomComponentLink = _ref4.customComponentLink;
124
+ var className = _ref3.className,
125
+ jobs = _ref3.jobs,
126
+ items = _ref3.items,
127
+ chunks = _ref3.chunks,
128
+ totalRowCount = _ref3.totalRowCount,
129
+ updateFilters = _ref3.updateFilters,
130
+ resetFilters = _ref3.resetFilters,
131
+ resetAllFilters = _ref3.resetAllFilters,
132
+ filters = _ref3.filters,
133
+ sortFields = _ref3.sortFields,
134
+ sort = _ref3.sort,
135
+ updateSort = _ref3.updateSort,
136
+ search = _ref3.search,
137
+ updateSearch = _ref3.updateSearch,
138
+ hasActiveFilters = _ref3.hasActiveFilters,
139
+ CustomComponentLink = _ref3.customComponentLink;
169
140
  var rootClassName = (0, _classnames["default"])(_bundleModulesModule["default"].root, className);
170
141
  var labels = (0, _react.useMemo)(function () {
171
142
  return (0, _map2["default"])(jobs, 'label');
@@ -199,9 +170,9 @@ var BundleModules = function BundleModules(_ref4) {
199
170
  defaultValue: (0, _get2["default"])(filters, "".concat(_utils.MODULE_SOURCE_TYPE, ".").concat(_utils.MODULE_FILTERS.THIRD_PARTY), true)
200
171
  }), _MODULE_SOURCE_TYPE)), _objectSpread2), !(0, _isEmpty2["default"])(chunks) && _defineProperty({}, _utils.MODULE_CHUNK, _objectSpread({
201
172
  label: 'Chunk'
202
- }, chunks.reduce(function (chunkFilters, _ref5) {
203
- var id = _ref5.id,
204
- name = _ref5.name;
173
+ }, chunks.reduce(function (chunkFilters, _ref4) {
174
+ var id = _ref4.id,
175
+ name = _ref4.name;
205
176
  return _objectSpread(_objectSpread({}, chunkFilters), {}, _defineProperty({}, id, {
206
177
  label: name,
207
178
  defaultValue: (0, _get2["default"])(filters, "".concat(_utils.MODULE_CHUNK, ".").concat(id), true)
@@ -219,8 +190,8 @@ var BundleModules = function BundleModules(_ref4) {
219
190
  className: rootClassName
220
191
  }, /*#__PURE__*/_react["default"].createElement(_toolbar.Toolbar, {
221
192
  className: _bundleModulesModule["default"].toolbar,
222
- renderActions: function renderActions(_ref7) {
223
- var actionClassName = _ref7.actionClassName;
193
+ renderActions: function renderActions(_ref6) {
194
+ var actionClassName = _ref6.actionClassName;
224
195
  return /*#__PURE__*/_react["default"].createElement(_flexStack.FlexStack, {
225
196
  space: "xxsmall",
226
197
  className: (0, _classnames["default"])(_bundleModulesModule["default"].dropdown, actionClassName)
@@ -11,7 +11,3 @@
11
11
  max-width: 240px;
12
12
  margin-right: -1px; /** collapse border */
13
13
  }
14
-
15
- .namePopover {
16
- min-width: 280px;
17
- }
@@ -41,9 +41,9 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
41
41
 
42
42
  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; }
43
43
 
44
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
44
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
45
45
 
46
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
46
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
47
47
 
48
48
  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; }
49
49
 
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
4
 
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
@@ -41,9 +41,9 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
41
41
 
42
42
  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); }
43
43
 
44
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
44
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
45
45
 
46
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
46
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
47
47
 
48
48
  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; }
49
49
 
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
4
 
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
@@ -27,7 +27,7 @@ var _emptySet = require("../../ui/empty-set");
27
27
 
28
28
  var _filters = require("../../ui/filters");
29
29
 
30
- var _popover = require("../../ui/popover");
30
+ var _hoverCard = require("../../ui/hover-card");
31
31
 
32
32
  var _sortDropdown = require("../../ui/sort-dropdown");
33
33
 
@@ -69,7 +69,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
69
69
 
70
70
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
71
71
 
72
- var PackagePopoverContent = function PackagePopoverContent(_ref) {
72
+ var PackageCard = function PackageCard(_ref) {
73
73
  var name = _ref.name,
74
74
  fullName = _ref.fullName,
75
75
  path = _ref.path,
@@ -84,46 +84,46 @@ var PackagePopoverContent = function PackagePopoverContent(_ref) {
84
84
 
85
85
  return /*#__PURE__*/_react["default"].createElement(_stack.Stack, {
86
86
  space: "xxsmall",
87
- className: _bundlePackagesModule["default"].packagePopover
87
+ className: _bundlePackagesModule["default"].packageCard
88
88
  }, /*#__PURE__*/_react["default"].createElement(_stack.Stack, {
89
89
  space: "xxxsmall"
90
90
  }, /*#__PURE__*/_react["default"].createElement("h3", {
91
- className: _bundlePackagesModule["default"].packagePopoverTitle
91
+ className: _bundlePackagesModule["default"].packageCardTitle
92
92
  }, normalizedName, packageId && /*#__PURE__*/_react["default"].createElement("span", {
93
- className: _bundlePackagesModule["default"].packagePopoverTitleIndex
93
+ className: _bundlePackagesModule["default"].packageCardTitleIndex
94
94
  }, "".concat(_utils.PACKAGE_ID_SEPARATOR).concat(packageId))), /*#__PURE__*/_react["default"].createElement("p", {
95
- className: _bundlePackagesModule["default"].packagePopoverPath
95
+ className: _bundlePackagesModule["default"].packageCardPath
96
96
  }, /*#__PURE__*/_react["default"].createElement(_fileName.FileName, {
97
- className: _bundlePackagesModule["default"].packagePopoverPathValue,
97
+ className: _bundlePackagesModule["default"].packageCardPathValue,
98
98
  name: normalizedPackagePath
99
99
  }))), /*#__PURE__*/_react["default"].createElement("ul", {
100
- className: _bundlePackagesModule["default"].packagePopoverList
100
+ className: _bundlePackagesModule["default"].packageCardList
101
101
  }, /*#__PURE__*/_react["default"].createElement("li", {
102
- className: _bundlePackagesModule["default"].packagePopoverItem
102
+ className: _bundlePackagesModule["default"].packageCardItem
103
103
  }, /*#__PURE__*/_react["default"].createElement("a", {
104
104
  href: "https://www.npmjs.com/package/".concat(normalizedName),
105
105
  target: "_blank",
106
106
  rel: "noreferrer"
107
107
  }, "npmjs.com")), /*#__PURE__*/_react["default"].createElement("li", {
108
- className: _bundlePackagesModule["default"].packagePopoverItem
108
+ className: _bundlePackagesModule["default"].packageCardItem
109
109
  }, /*#__PURE__*/_react["default"].createElement("a", {
110
110
  href: "https://bundlephobia.com/result?p=".concat(normalizedName),
111
111
  target: "_blank",
112
112
  rel: "noreferrer"
113
113
  }, "bundlephobia.com"))), /*#__PURE__*/_react["default"].createElement(_stack.Stack, {
114
114
  space: "xxxsmall",
115
- className: _bundlePackagesModule["default"].packagePopover.actions
115
+ className: _bundlePackagesModule["default"].packageCardActions
116
116
  }, duplicate && /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(CustomComponentLink, (0, _utils.getBundlePackagesByNameComponentLink)(normalizedName), "View all duplicate instances")), /*#__PURE__*/_react["default"].createElement(CustomComponentLink, (0, _utils.getBundleModulesBySearch)(normalizedPackagePath), "Search modules by package path")));
117
117
  };
118
118
 
119
- PackagePopoverContent.propTypes = {
119
+ PackageCard.propTypes = {
120
120
  name: _propTypes["default"].string.isRequired,
121
121
  path: _propTypes["default"].string,
122
122
  fullName: _propTypes["default"].string.isRequired,
123
123
  duplicate: _propTypes["default"].bool.isRequired,
124
124
  CustomComponentLink: _propTypes["default"].elementType.isRequired
125
125
  };
126
- PackagePopoverContent.defaultProps = {
126
+ PackageCard.defaultProps = {
127
127
  path: ''
128
128
  };
129
129
 
@@ -135,20 +135,25 @@ var PackageRowHeader = function PackageRowHeader(_ref2) {
135
135
  var _ref3 = item.runs[0] || {},
136
136
  path = _ref3.path;
137
137
 
138
- return /*#__PURE__*/_react["default"].createElement("span", {
138
+ return /*#__PURE__*/_react["default"].createElement(_flexStack.FlexStack, {
139
+ space: "xxxsmall",
139
140
  className: _bundlePackagesModule["default"].packageNames
140
141
  }, packageNames.map(function (packageName, index) {
141
- // Render duplicate flag only for the last entry
142
- var duplicateFlag = index === packageNames.length - 1 && item.duplicate && /*#__PURE__*/_react["default"].createElement("span", {
143
- className: _bundlePackagesModule["default"].duplicate,
142
+ var label = /*#__PURE__*/_react["default"].createElement(_flexStack.FlexStack, {
143
+ space: "xxxsmall",
144
+ className: _bundlePackagesModule["default"].packageNameLabel
145
+ }, index === packageNames.length - 1 && item.duplicate && /*#__PURE__*/_react["default"].createElement("span", {
146
+ className: _bundlePackagesModule["default"].packageNameDuplicate,
144
147
  title: "Duplicate package"
145
- }, "D");
146
-
147
- return /*#__PURE__*/_react["default"].createElement(_popover.Popover, {
148
- className: _bundlePackagesModule["default"].packageName,
149
- icon: duplicateFlag,
150
- label: packageName
151
- }, /*#__PURE__*/_react["default"].createElement(PackagePopoverContent, {
148
+ }, "D"), /*#__PURE__*/_react["default"].createElement("span", {
149
+ className: _bundlePackagesModule["default"].packageNameText
150
+ }, packageName));
151
+
152
+ return /*#__PURE__*/_react["default"].createElement(_hoverCard.HoverCard, {
153
+ label: label,
154
+ key: packageName,
155
+ className: _bundlePackagesModule["default"].packageName
156
+ }, /*#__PURE__*/_react["default"].createElement(PackageCard, {
152
157
  name: packageName,
153
158
  path: path,
154
159
  fullName: item.label,