@bundle-stats/ui 4.22.3 → 4.23.0-beta.2

package/lib-esm/components/metrics-treemap/metrics-treemap.module.css

@@ -20,6 +20,7 @@
  * Tile group
  */
 .tileGroup {
+  border-radius: var(--radius-xsmall);
   position: absolute;
 }
 
@@ -31,6 +32,7 @@
 .tileGroupTitleContent {
   width: 100%;
   padding: var(--space-xxxsmall) 2px var(--space-xxxsmall) var(--space-xxsmall);
+  border-radius: var(--radius-xsmall);
   display: flex;
   align-items: center;
   color: var(--color-text);
@@ -66,12 +68,6 @@
 .tileGroup {
   transition: var(--transition-out);
   transition-property: background-color, outline;
-  border-radius: var(--radius-xsmall);
-}
-
-.tileGroup--minimal,
-.tileGroup--small {
-  border-radius: calc(var(--radius-xsmall) / 2);
 }
 
 .tileGroup--minimal .tileGroupTitle,
@@ -136,9 +132,8 @@
   position: absolute;
   appearance: none;
   border: 0;
-  border-radius: 0;
+  border-radius: var(--radius-xsmall);
   padding: 0;
-  border-radius: calc(var(--radius-xsmall) / 2);
   background: var(--color-background);
   display: flex;
   align-items: center;
@@ -159,6 +154,7 @@
   top: 0;
   width: 100%;
   height: 100%;
+  border-radius: inherit;
   background-color: currentColor;
 }
 
@@ -170,9 +166,10 @@
   display: flex;
   flex-flow: column;
   justify-content: center;
-  padding: var(--space-xxsmall) var(--space-xxsmall);
+  padding: var(--space-xxsmall);
   gap: var(--space-xxxsmall);
   line-height: var(--line-height-heading);
+  cursor: default;
 }
 
 /** Align label to other elements on the first column cells */
@@ -213,7 +210,7 @@
 /** Tile size variation */
 .tileSizeSmall .tileContent {
   padding: var(--space-xxxsmall);
-  font-size: 10px;
+  font-size: var(--size-xsmall);
 }
 
 .tileSizeSmall .tileContentLabel {
@@ -298,11 +295,6 @@
 }
 
 /** tooltip */
-.tileContentTooltipAnchor {
-  width: 100%;
-  height: 100%;
-}
-
 .tooltip {
   z-index: var(--layer-high);
   padding: var(--space-xsmall) var(--space-small);
@@ -326,7 +318,8 @@
   font-size: var(--size-small);
 }
 
-/* prevent tooltip portal wrapper from capturing events */
+/* prevent the tooltip portal wrapper from capturing pointer events - the
+   treemap relies on pointer events reaching the canvas to track the hovered cell */
 div[role='presentation']:has(.tooltip) {
   pointer-events: none;
 }

package/lib-esm/components/metrics-treemap/metrics-treemap.utils.js

@@ -1,5 +1,4 @@
-import { useCallback } from 'react';
-import { useDebounce, useMouseHovered } from 'react-use';
+import { useCallback, useEffect, useRef, useState } from 'react';
 import { useTooltipState } from 'ariakit/tooltip';
 import { DeltaType, } from '@bundle-stats/utils';
 import { NESTED_PADDING_TOP, } from './metrics-treemap.constants';
@@ -99,6 +98,17 @@ export function getTreemapNodesGroupedByPath(items) {
         total,
     };
 }
+export function getTreemapNodesIndex(node, index = new Map()) {
+    index.set(node.id, node);
+    node.children.forEach((childNode) => {
+        if ('children' in childNode) {
+            getTreemapNodesIndex(childNode, index);
+            return;
+        }
+        index.set(childNode.id, childNode);
+    });
+    return index;
+}
 export function resolveGroupDeltaType(metricRunInfo) {
     if (!metricRunInfo) {
         return DeltaType.NO_CHANGE;
@@ -145,24 +155,68 @@ export function resolveTileSizeDisplay(width, height) {
     }
     return 'default';
 }
-export function useTooltipStateWithMouseFollow(options) {
-    const { parentRef, gutter = 16, timeout = 240 } = options;
-    const pointer = useMouseHovered(parentRef, { whenHovered: true });
+export function useTreemapTooltipState(options = {}) {
+    const { gutter = 16, timeout = 240, hideTimeout = timeout } = options;
+    const pointerRef = useRef(null);
+    const frameRef = useRef(0);
+    const hideTimeoutRef = useRef(0);
     const getAnchorRect = useCallback(() => {
-        var _a, _b, _c, _d;
-        if (pointer.docX === 0 && pointer.docY === 0 && pointer.elW === 0 && pointer.elH === 0) {
+        const pointer = pointerRef.current;
+        if (!pointer) {
             return null;
         }
-        const newRect = {
-            x: pointer.docX - ((_b = (_a = document === null || document === void 0 ? void 0 : document.defaultView) === null || _a === void 0 ? void 0 : _a.scrollX) !== null && _b !== void 0 ? _b : 0),
-            y: pointer.docY - ((_d = (_c = document === null || document === void 0 ? void 0 : document.defaultView) === null || _c === void 0 ? void 0 : _c.scrollY) !== null && _d !== void 0 ? _d : 0),
-            w: 1,
-            h: 1,
-        };
-        return newRect;
-    }, [pointer.docX, pointer.docY]);
+        return { x: pointer.x, y: pointer.y, w: 1, h: 1 };
+    }, []);
     const tooltipState = useTooltipState({ gutter, getAnchorRect, timeout });
-    useDebounce(tooltipState.render, 10, [pointer.docX, pointer.docY]);
-    return tooltipState;
+    const { mounted, render, show, hide } = tooltipState;
+    const [hoveredNodeId, setHoveredNodeId] = useState(null);
+    const hoveredNodeIdRef = useRef(null);
+    useEffect(() => () => {
+        cancelAnimationFrame(frameRef.current);
+        window.clearTimeout(hideTimeoutRef.current);
+    }, []);
+    const setPointer = useCallback((x, y) => {
+        pointerRef.current = { x, y };
+        if (!mounted || frameRef.current) {
+            return;
+        }
+        frameRef.current = requestAnimationFrame(() => {
+            frameRef.current = 0;
+            render();
+        });
+    }, [mounted, render]);
+    const commitHoveredNode = useCallback((nodeId) => {
+        hoveredNodeIdRef.current = nodeId;
+        setHoveredNodeId(nodeId);
+        if (nodeId === null) {
+            hide();
+            return;
+        }
+        show();
+    }, [hide, show]);
+    const setHoveredNode = useCallback((nodeId) => {
+        window.clearTimeout(hideTimeoutRef.current);
+        hideTimeoutRef.current = 0;
+        if (nodeId === hoveredNodeIdRef.current) {
+            return;
+        }
+        if (nodeId !== null || !hideTimeout) {
+            commitHoveredNode(nodeId);
+            return;
+        }
+        hideTimeoutRef.current = window.setTimeout(() => {
+            hideTimeoutRef.current = 0;
+            commitHoveredNode(null);
+        }, hideTimeout);
+    }, [commitHoveredNode, hideTimeout]);
+    const clearHoveredNode = useCallback(() => {
+        window.clearTimeout(hideTimeoutRef.current);
+        hideTimeoutRef.current = 0;
+        if (hoveredNodeIdRef.current === null) {
+            return;
+        }
+        commitHoveredNode(null);
+    }, [commitHoveredNode]);
+    return { tooltipState, setPointer, hoveredNodeId, setHoveredNode, clearHoveredNode };
 }
 //# sourceMappingURL=metrics-treemap.utils.js.map

package/lib-esm/components/metrics-treemap/metrics-treemap.utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"metrics-treemap.utils.js","sourceRoot":"","sources":["../../../src/components/metrics-treemap/metrics-treemap.utils.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"metrics-treemap.utils.js","sourceRoot":"","sources":["../../../src/components/metrics-treemap/metrics-treemap.utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EACL,SAAS,GAIV,MAAM,qBAAqB,CAAC;AAE7B,OAAO,EAQL,kBAAkB,GACnB,MAAM,6BAA6B,CAAC;AAErC,MAAM,UAAU,GAAG,QAAQ,CAAC;AAM5B,SAAS,0BAA0B,CAAC,IAAqB;IACvD,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,KAAK,KAAI,CAAC,CAAC,CAAC;IACvD,OAAO,IAAI,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,CAAC;AAC7B,CAAC;AAKD,MAAM,UAAU,eAAe,CAAC,KAA6B;IAC3D,MAAM,YAAY,GAAoB,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACzD,EAAE,EAAE,IAAI,CAAC,GAAG;QACZ,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,KAAK,EAAE,0BAA0B,CAAC,IAAI,CAAC;QACvC,IAAI;KACL,CAAC,CAAC,CAAC;IAEJ,OAAO;QACL,EAAE,EAAE,EAAE;QACN,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,CAAC;QACR,QAAQ,EAAE,YAAY;KACvB,CAAC;AACJ,CAAC;AAED,SAAS,aAAa,CAAC,IAA6B;;IAClD,MAAM,QAAQ,GAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,CAAC;IAC9B,MAAM,OAAO,GAAG,CAAA,MAAA,IAAI,CAAC,CAAC,CAAC,0CAAE,KAAK,KAAI,CAAC,CAAC;IAEpC,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QACpB,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC;IAC1C,CAAC;IAED,OAAO;QACL,OAAO;QACP,QAAQ,EAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAG,QAAQ,GAAG,CAAC,CAAC,0CAAE,KAAK;KACtC,CAAC;AACJ,CAAC;AAKD,SAAS,WAAW,CAClB,KAAuB,EACvB,KAAoB,EACpB,aAAqB,EACrB,OAAiB;;IAEjB,MAAM,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,aAAa,CAAC,CAAC;IAChD,MAAM,CAAC,WAAW,EAAE,GAAG,QAAQ,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;IAG9D,IAAI,CAAC,WAAW,EAAE,CAAC;QACjB,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACpB,OAAO,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC1C,CAAC;IAED,MAAM,eAAe,GAAG,CAAC,GAAG,SAAS,EAAE,WAAW,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAG9D,IAAI,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,KAAK,eAAe,CAAS,CAAC;IAGnF,MAAM,UAAU,GAAG,aAAa,CAAC,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,0CAAE,IAAI,CAAC,CAAC;IACtD,MAAM,WAAW,GAAG,OAAO,UAAU,CAAC,QAAQ,KAAK,WAAW,CAAC;IAG/D,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,UAAU,GAAG;YACX,EAAE,EAAE,eAAe;YACnB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,CAAC;YACR,QAAQ,EAAE,EAAE;YACZ,KAAK,EAAE;gBACL,OAAO,EAAE,CAAC;gBACV,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS;aACtC;SACF,CAAC;QAEF,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACzB,CAAC;IAED,UAAU,CAAC,KAAK,GAAG;QACjB,OAAO,EAAE,CAAC,CAAA,MAAA,UAAU,CAAC,KAAK,0CAAE,OAAO,KAAI,CAAC,CAAC,GAAG,UAAU,CAAC,OAAO;QAC9D,QAAQ,EAAE,WAAW;YACnB,CAAC,CAAC,CAAC,CAAA,MAAA,UAAU,CAAC,KAAK,0CAAE,QAAQ,KAAI,CAAC,CAAC,GAAG,CAAC,UAAU,CAAC,QAAQ,IAAI,CAAC,CAAC;YAChE,CAAC,CAAC,SAAS;KACd,CAAC;IAGF,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC1B,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAClC,OAAO,aAAa,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC1C,CAAC;IAED,OAAO,WAAW,CAAC,UAAU,CAAC,QAAQ,EAAE,KAAK,EAAE,aAAa,GAAG,CAAC,EAAE,OAAO,CAAC,CAAC;AAC7E,CAAC;AAKD,MAAM,UAAU,4BAA4B,CAAC,KAA6B;IACxE,MAAM,SAAS,GAAqB,EAAE,CAAC;IACvC,MAAM,KAAK,GAAc,EAAE,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC;IAE7D,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;QACrB,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAClC,MAAM,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;QACrC,MAAM,QAAQ,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAEpC,MAAM,QAAQ,GAAG;YACf,EAAE,EAAE,IAAI,CAAC,GAAG;YACZ,KAAK,EAAE,QAAQ;YACf,KAAK,EAAE,0BAA0B,CAAC,IAAI,CAAC;YACvC,IAAI;SACL,CAAC;QAEF,MAAM,aAAa,GAAG,WAAW,CAAC,SAAS,EAAE,SAAS,EAAE,CAAC,EAAE,QAAQ,CAAC,CAAC;QAErE,KAAK,CAAC,OAAO,IAAI,aAAa,CAAC,OAAO,CAAC;QACvC,KAAK,CAAC,QAAQ;YACZ,OAAO,aAAa,CAAC,QAAQ,KAAK,WAAW;gBAC3C,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,CAAC,GAAG,aAAa,CAAC,QAAQ;gBAChD,CAAC,CAAC,SAAS,CAAC;IAClB,CAAC,CAAC,CAAC;IAEH,OAAO;QACL,EAAE,EAAE,EAAE;QACN,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,CAAC;QACR,QAAQ,EAAE,SAAS;QACnB,KAAK;KACN,CAAC;AACJ,CAAC;AAMD,MAAM,UAAU,oBAAoB,CAClC,IAAU,EACV,QAA+B,IAAI,GAAG,EAAE;IAExC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC;IAEzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,SAAS,EAAE,EAAE;QAClC,IAAI,UAAU,IAAI,SAAS,EAAE,CAAC;YAC5B,oBAAoB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;YACvC,OAAO;QACT,CAAC;QAED,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,OAAO,KAAK,CAAC;AACf,CAAC;AAED,MAAM,UAAU,qBAAqB,CACnC,aAAqD;IAErD,IAAI,CAAC,aAAa,EAAE,CAAC;QACnB,OAAO,SAAS,CAAC,SAAS,CAAC;IAC7B,CAAC;IAED,MAAM,SAAS,GAAG,cAAc,IAAI,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IAExF,IAAI,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,KAAK,CAAC,UAAU,CAAC,EAAE,CAAC;QACjC,OAAO,SAAS,CAAC,QAAQ,CAAC;IAC5B,CAAC;IAED,IAAI,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,KAAK,CAAC,UAAU,CAAC,EAAE,CAAC;QACjC,OAAO,SAAS,CAAC,QAAQ,CAAC;IAC5B,CAAC;IAED,OAAO,SAAS,CAAC,SAAS,CAAC;AAC7B,CAAC;AAMD,MAAM,WAAW,GAAG,CAAC,CAAC;AACtB,MAAM,cAAc,GAAG,CAAC,CAAC;AACzB,MAAM,YAAY,GAAG,CAAC,CAAC;AACvB,MAAM,aAAa,GAAG,CAAC,CAAC;AACxB,MAAM,WAAW,GAAG,EAAE,CAAC;AACvB,MAAM,iBAAiB,GAAG,IAAI,CAAC;AAE/B,MAAM,UAAU,2BAA2B,CAAC,KAAa,EAAE,MAAc;IACvE,IAAI,MAAM,GAAG,kBAAkB,EAAE,CAAC;QAChC,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,IAAI,KAAK,GAAG,EAAE,EAAE,CAAC;QACf,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,IAAI,MAAM,GAAG,kBAAkB,GAAG,CAAC,EAAE,CAAC;QACpC,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,MAAM,UAAU,sBAAsB,CAAC,KAAa,EAAE,MAAc;IAClE,IAAI,MAAM,GAAG,WAAW,GAAG,cAAc,GAAG,iBAAiB,EAAE,CAAC;QAC9D,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,IAAI,KAAK,GAAG,YAAY,GAAG,aAAa,GAAG,EAAE,EAAE,CAAC;QAC9C,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,IAAI,MAAM,GAAG,WAAW,GAAG,WAAW,GAAG,WAAW,GAAG,CAAC,EAAE,CAAC;QACzD,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,IAAI,KAAK,GAAG,YAAY,GAAG,aAAa,GAAG,EAAE,EAAE,CAAC;QAC9C,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,OAAO,SAAS,CAAC;AACnB,CAAC;AAgCD,MAAM,UAAU,sBAAsB,CAAC,UAAyC,EAAE;IAChF,MAAM,EAAE,MAAM,GAAG,EAAE,EAAE,OAAO,GAAG,GAAG,EAAE,WAAW,GAAG,OAAO,EAAE,GAAG,OAAO,CAAC;IAEtE,MAAM,UAAU,GAAG,MAAM,CAAkC,IAAI,CAAC,CAAC;IACjE,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;IAC3B,MAAM,cAAc,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;IAGjC,MAAM,aAAa,GAAG,WAAW,CAAC,GAAG,EAAE;QACrC,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC;QAGnC,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,OAAO,IAAI,CAAC;QACd,CAAC;QAED,OAAO,EAAE,CAAC,EAAE,OAAO,CAAC,CAAC,EAAE,CAAC,EAAE,OAAO,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;IACpD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,YAAY,GAAG,eAAe,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,OAAO,EAAE,CAAC,CAAC;IACzE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,YAAY,CAAC;IAErD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IACxE,MAAM,gBAAgB,GAAG,MAAM,CAAgB,IAAI,CAAC,CAAC;IAErD,SAAS,CACP,GAAG,EAAE,CAAC,GAAG,EAAE;QACT,oBAAoB,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;QACvC,MAAM,CAAC,YAAY,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;IAC9C,CAAC,EACD,EAAE,CACH,CAAC;IAEF,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,CAAS,EAAE,CAAS,EAAE,EAAE;QACvB,UAAU,CAAC,OAAO,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QAG9B,IAAI,CAAC,OAAO,IAAI,QAAQ,CAAC,OAAO,EAAE,CAAC;YACjC,OAAO;QACT,CAAC;QAED,QAAQ,CAAC,OAAO,GAAG,qBAAqB,CAAC,GAAG,EAAE;YAC5C,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAC;YACrB,MAAM,EAAE,CAAC;QACX,CAAC,CAAC,CAAC;IACL,CAAC,EACD,CAAC,OAAO,EAAE,MAAM,CAAC,CAClB,CAAC;IAEF,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,MAAqB,EAAE,EAAE;QACxB,gBAAgB,CAAC,OAAO,GAAG,MAAM,CAAC;QAClC,gBAAgB,CAAC,MAAM,CAAC,CAAC;QAEzB,IAAI,MAAM,KAAK,IAAI,EAAE,CAAC;YACpB,IAAI,EAAE,CAAC;YACP,OAAO;QACT,CAAC;QAED,IAAI,EAAE,CAAC;IACT,CAAC,EACD,CAAC,IAAI,EAAE,IAAI,CAAC,CACb,CAAC;IAMF,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,MAAqB,EAAE,EAAE;QACxB,MAAM,CAAC,YAAY,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;QAC5C,cAAc,CAAC,OAAO,GAAG,CAAC,CAAC;QAG3B,IAAI,MAAM,KAAK,gBAAgB,CAAC,OAAO,EAAE,CAAC;YACxC,OAAO;QACT,CAAC;QAED,IAAI,MAAM,KAAK,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACpC,iBAAiB,CAAC,MAAM,CAAC,CAAC;YAC1B,OAAO;QACT,CAAC;QAED,cAAc,CAAC,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;YAC9C,cAAc,CAAC,OAAO,GAAG,CAAC,CAAC;YAC3B,iBAAiB,CAAC,IAAI,CAAC,CAAC;QAC1B,CAAC,EAAE,WAAW,CAAC,CAAC;IAClB,CAAC,EACD,CAAC,iBAAiB,EAAE,WAAW,CAAC,CACjC,CAAC;IAMF,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,MAAM,CAAC,YAAY,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;QAC5C,cAAc,CAAC,OAAO,GAAG,CAAC,CAAC;QAE3B,IAAI,gBAAgB,CAAC,OAAO,KAAK,IAAI,EAAE,CAAC;YACtC,OAAO;QACT,CAAC;QAED,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,aAAa,EAAE,cAAc,EAAE,gBAAgB,EAAE,CAAC;AACvF,CAAC"}

package/lib-esm/components/run-info/run-info.js

@@ -17,26 +17,38 @@ const getMetricParams = (value) => {
     }
     return [matches[1], matches[2]];
 };
-export const RunInfo = ({ className = '', title = null, titleHoverCard = null, titleTooltip = null, current = '', baseline = '', delta = '', deltaPercentage = '', deltaType = '', as: Component = 'div', size = 'medium', showBaseline = true, loading = false, enhance = false, ...restProps }) => {
-    const rootClassName = cx(css.root, className, css[size], (delta || deltaPercentage) && css.showDelta);
+const RunInfoTitle = ({ className, title, titleHoverCard, titleTooltip }) => (React.createElement(FlexStack, { space: "xxxsmall", alignItems: "center", as: "h3", className: cx(css.title, className) },
+    React.createElement("span", { className: css.titleText }, title),
+    titleHoverCard && (React.createElement(HoverCard, { label: React.createElement(Icon, { glyph: Icon.ICONS.HELP }), className: cx(css.titleIcon, css.titleHoverCardIcon) }, titleHoverCard)),
+    titleTooltip && (React.createElement(Tooltip, { title: titleTooltip, className: cx(css.titleIcon, css.titleTooltipIcon) },
+        React.createElement(Icon, { glyph: Icon.ICONS.HELP })))));
+const RunInfoContent = ({ className, loading = false, current = '', enhance = false, baseline = '', delta = '', deltaPercentage = '', deltaType = 'NO_CHANGE', showBaseline = true, showDelta = true, }) => {
     const currentValueParams = useMemo(() => {
         if (!enhance || typeof current !== 'string') {
             return [current];
         }
         return getMetricParams(current);
     }, [current, enhance]);
+    const contentClassName = cx(css.content, className);
+    if (loading) {
+        return (React.createElement(Stack, { space: "xxxsmall", className: contentClassName },
+            React.createElement(Skeleton, { className: css.currentMetric }),
+            showBaseline && React.createElement(Skeleton, { className: css.baselineMetric })));
+    }
+    return (React.createElement(Stack, { space: "xxxsmall", className: contentClassName },
+        React.createElement(Metric, { value: currentValueParams[0], unit: currentValueParams[1], inline: true, className: css.currentMetric }, showDelta && (React.createElement("div", { className: css.delta },
+            deltaPercentage && (React.createElement(Delta, { displayValue: deltaPercentage, deltaType: deltaType, className: css.deltaValue })),
+            delta && (React.createElement(Delta, { displayValue: delta, deltaType: deltaType, className: css.deltaValue }))))),
+        showBaseline && (React.createElement(FlexStack, { alignItems: "center", space: "xxxsmall", className: css.baselineMetric },
+            React.createElement("span", { className: css.baselineMetricLabel }, "vs"),
+            React.createElement(Metric, { value: baseline, inline: true, className: css.baselineMetricValue })))));
+};
+export const RunInfo = ({ className = '', title = null, titleHoverCard = null, titleTooltip = null, current = '', baseline = '', delta = '', deltaPercentage = '', deltaType = 'NO_CHANGE', as: Component = 'div', size = 'medium', showBaseline = true, showDelta = true, loading = false, enhance = false, children, ...restProps }) => {
+    const rootClassName = cx(css.root, loading && css.loading, css[size], className);
     return (React.createElement(Component, { className: rootClassName, ...restProps },
-        title && (React.createElement(FlexStack, { space: "xxxsmall", alignItems: "center", as: "h3", className: css.title },
-            React.createElement("span", { className: css.titleText }, title),
-            titleHoverCard && (React.createElement(HoverCard, { label: React.createElement(Icon, { glyph: Icon.ICONS.HELP }), className: cx(css.titleIcon, css.titleHoverCardIcon) }, titleHoverCard)),
-            titleTooltip && (React.createElement(Tooltip, { title: titleTooltip, className: cx(css.titleIcon, css.titleTooltipIcon) },
-                React.createElement(Icon, { glyph: Icon.ICONS.HELP }))))),
-        !loading ? (React.createElement(Stack, { space: "xxxsmall", className: css.info },
-            React.createElement(Metric, { value: currentValueParams[0], unit: currentValueParams[1], inline: true, className: css.currentMetric }, (delta || deltaPercentage) && (React.createElement("span", { className: css.delta },
-                deltaPercentage && (React.createElement(Delta, { displayValue: deltaPercentage, deltaType: deltaType, className: css.deltaValue })),
-                delta && (React.createElement(Delta, { displayValue: delta, deltaType: deltaType, className: css.deltaValue }))))),
-            showBaseline && React.createElement(Metric, { className: css.baselineMetric, value: baseline }))) : (React.createElement(Stack, { space: "xxxsmall", className: css.info },
-            React.createElement(Skeleton, { className: cx(css.currentMetric, css.loading) }),
-            showBaseline && React.createElement(Skeleton, { as: "p", className: cx(css.baselineMetric, css.loading) })))));
+        React.createElement(Stack, { space: "xsmall" },
+            title && (React.createElement(RunInfoTitle, { title: title, titleHoverCard: titleHoverCard, titleTooltip: titleTooltip })),
+            React.createElement(RunInfoContent, { loading: loading, current: current, enhance: enhance, baseline: baseline, delta: delta, deltaPercentage: deltaPercentage, deltaType: deltaType, showBaseline: showBaseline, showDelta: showDelta }),
+            children)));
 };
 //# sourceMappingURL=run-info.js.map

package/lib-esm/components/run-info/run-info.js.map

@@ -1 +1 @@
-{"version":3,"file":"run-info.js","sourceRoot":"","sources":["../../../src/components/run-info/run-info.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"run-info.js","sourceRoot":"","sources":["../../../src/components/run-info/run-info.tsx"],"names":[],"mappings":"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"}

package/lib-esm/components/run-info/run-info.module.css

@@ -1,5 +1,5 @@
 .title {
-  color: var(--color-text-ultra-light);
+  color: var(--color-text-light);
   font-weight: bold;
   font-size: var(--size-xsmall);
   text-transform: uppercase;
@@ -16,14 +16,11 @@
 
 .titleIcon {
   flex: 0 0 var(--space-small);
+  /* compensate for the button icon spacing */
   margin-top: -3px !important;
   margin-bottom: -3px !important;
 }
 
-.title + .info {
-  margin-top: var(--space-xxsmall);
-}
-
 .currentMetric {
   color: var(--color-heading);
   white-space: nowrap;
@@ -32,33 +29,32 @@
   height: var(--line-height-number);
 }
 
-.delta {
-  font-weight: bold;
-}
-
-.deltaValue + .deltaValue::before {
-  margin-left: calc(var(--space-xxxsmall) / 2);
-  margin-right: calc(var(--space-xxxsmall) / 2);
-  content: '/';
-  color: var(--color-text-ultra-light);
-}
-
 .baselineMetric {
   color: var(--color-text-ultra-light);
   font-size: var(--size-small);
+  font-family: var(--font-family-fixed);
+  font-weight: normal;
   line-height: var(--line-height-number);
   height: var(--line-height-number);
 }
 
-/* Loading state */
-.loading.currentMetric {
-  min-width: 0;
-  max-width: 8em;
+.baselineMetricValue {
+  color: var(--color-text-light);
+  line-height: inherit;
 }
 
-.loading.baselineMetric {
-  min-width: 0;
-  max-width: 8em;
+
+.delta {
+  font-weight: bold;
+  font-size: var(--size-small);
+  line-height: var(--line-height-number);
+}
+
+.deltaValue + .deltaValue::before {
+  margin-left: var(--space-xxxsmall);
+  margin-right: var(--space-xxxsmall);
+  content: '/';
+  color: var(--color-outline-dark);
 }
 
 /* Hover state */
@@ -82,15 +78,28 @@
     visibility 0s;
 }
 
-/* Size variation */
-.currentMetric {
-  font-size: var(--size-xxlarge);
+/* Loading state */
+.loading .currentMetric {
+  max-width: 6em;
 }
 
+.loading .baselineMetric {
+  max-width: 6em;
+}
+
+.loading .delta {
+  max-width: 12em;
+}
+
+/* Size variation */
 .small .currentMetric {
   font-size: var(--size-medium);
 }
 
+.currentMetric {
+  font-size: var(--size-xxlarge);
+}
+
 .large .currentMetric {
   font-size: var(--size-xxxlarge);
 }

package/lib-esm/components/summary/summary.js

@@ -2,26 +2,25 @@ import React from 'react';
 import cx from 'classnames';
 import get from 'lodash/get';
 import { METRIC_COMPONENT_LINKS } from '@bundle-stats/utils';
-import { METRICS_WEBPACK_ASSETS, METRICS_WEBPACK_GENERAL, METRICS_WEBPACK_MODULES, METRICS_WEBPACK_PACKAGES, } from '../../constants';
+import { METRICS_GROUP_ASSETS, METRICS_GROUP_MODULES, METRICS_GROUP_PACKAGES, METRICS_WEBPACK_GENERAL, } from '../../constants';
 import { Box } from '../../layout/box';
 import { ComponentLink } from '../component-link';
 import { MetricRunInfo } from '../metric-run-info';
 import css from './summary.module.css';
-const METRICS_WEBPACK_OTHERS = [
-    ...METRICS_WEBPACK_ASSETS,
-    ...METRICS_WEBPACK_MODULES,
-    ...METRICS_WEBPACK_PACKAGES,
-];
+import { Stack } from '../../layout';
 const SummaryItem = (props) => {
     const { className = '', metricId, data, customLink: SummaryItemCustomLink, size, loading, showDelta, showBaseline, } = props;
     const componentLink = METRIC_COMPONENT_LINKS.get(metricId);
     const metricData = get(data, metricId, { current: 0, baseline: 0 });
-    return (React.createElement(Box, { key: metricId, outline: true, outlineHover: true, padding: "small", as: SummaryItemCustomLink, ...componentLink === null || componentLink === void 0 ? void 0 : componentLink.link, className: className },
+    return (React.createElement(SummaryItemCustomLink, { key: metricId, ...componentLink === null || componentLink === void 0 ? void 0 : componentLink.link, className: className },
         React.createElement(MetricRunInfo, { metricId: metricId, current: metricData.current, baseline: metricData.baseline, showDelta: showDelta, showBaseline: showBaseline, size: size, loading: loading })));
 };
 export const Summary = ({ className = '', data = null, loading = false, showSummaryItemDelta = true, showSummaryItemBaseline = true, summaryItemLink = ComponentLink, }) => (React.createElement(Box, { className: cx(css.root, className) },
-    React.createElement("div", { className: css.wrapper },
-        React.createElement("div", { className: css.items }, METRICS_WEBPACK_GENERAL.map((metricId) => (React.createElement(SummaryItem, { key: metricId, className: css.item, metricId: metricId, data: data, size: "large", loading: loading, customLink: summaryItemLink, showDelta: showSummaryItemDelta, showBaseline: showSummaryItemBaseline }))))),
-    React.createElement("div", { className: css.wrapper },
-        React.createElement("div", { className: css.items }, METRICS_WEBPACK_OTHERS.map((metricId) => (React.createElement(SummaryItem, { key: metricId, className: cx(css.item, css.itemSmall), metricId: metricId, data: data, customLink: summaryItemLink, loading: loading, showDelta: showSummaryItemDelta, showBaseline: false })))))));
+    React.createElement("div", { className: css.row },
+        React.createElement(Box, { outline: true, padding: "small", className: css.rowGroup },
+            React.createElement("div", { className: css.items }, METRICS_WEBPACK_GENERAL.map((metricId) => (React.createElement(SummaryItem, { key: metricId, className: css.item, metricId: metricId, data: data, size: "xlarge", loading: loading, customLink: summaryItemLink, showDelta: showSummaryItemDelta, showBaseline: showSummaryItemBaseline })))))),
+    React.createElement("div", { className: css.row }, [METRICS_GROUP_ASSETS, METRICS_GROUP_MODULES, METRICS_GROUP_PACKAGES].map((metricGroup) => (React.createElement(Stack, { className: css.rowGroup, key: metricGroup.title },
+        React.createElement("h3", { className: css.rowGroupTitle }, metricGroup.title),
+        React.createElement(Box, { outline: true, padding: "small" },
+            React.createElement("div", { className: css.items }, metricGroup.metrics.map((metricId) => (React.createElement(SummaryItem, { key: metricId, className: css.item, metricId: metricId, data: data, size: "large", loading: loading, customLink: summaryItemLink, showDelta: showSummaryItemDelta, showBaseline: showSummaryItemBaseline })))))))))));
 //# sourceMappingURL=summary.js.map

package/lib-esm/components/summary/summary.js.map

@@ -1 +1 @@
-{"version":3,"file":"summary.js","sourceRoot":"","sources":["../../../src/components/summary/summary.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"summary.js","sourceRoot":"","sources":["../../../src/components/summary/summary.tsx"],"names":[],"mappings":"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"}

package/lib-esm/components/summary/summary.module.css

@@ -3,29 +3,79 @@
   width: 100%;
 }
 
-.wrapper {
+.row {
   width: 100%;
+  display: flex;
+  align-items: stretch;
+  flex-wrap: wrap;
+  gap: var(--space-small);
+}
+
+.rowGroup {
+  flex: 1 1 auto;
 }
 
-.wrapper + .wrapper {
+.rowGroupTitle {
+  position: absolute;
+  font-size: 0;
+  width: 0;
+  left: -99999px;
+}
+
+.row + .row {
   margin-top: var(--summary-gap);
 }
 
 .items {
   display: flex;
+  align-items: stretch;
   flex-wrap: wrap;
-  width: calc(100% + var(--summary-gap));
-  margin-top: calc(0px - var(--summary-gap));
-  margin-left: calc(0px - var(--summary-gap));
+  gap: var(--space-medium);
 }
 
 .item {
-  margin: var(--summary-gap) 0 0 var(--summary-gap);
-  flex: 1 0 10%; /* force equal sizes */
-  min-width: 12em;
+  flex: 1 1 10%; /* force equal sizes */
+  min-width: 8em;
   text-decoration: none;
+  position: relative;
+  z-index: 0;
 }
 
-.itemSmall {
-  min-width: 8em;
+.item::before {
+  content: "";
+  border-radius: var(--radius-medium);
+  background: var(--color-highlight);
+  display: block;
+  position: absolute;
+  z-index: -1;
+  top: calc(0px - var(--space-xsmall));
+  right: calc(0px - var(--space-xsmall));
+  bottom: calc(0px - var(--space-xsmall));
+  left: calc(0px - var(--space-xsmall));
+  opacity: 0;
+  transition: var(--transition-out);
+}
+
+.item:hover::before {
+  opacity: 1;
+  transition: var(--transition-in);
+}
+
+.item + .item::after {
+  content: "";
+  border-radius: var(--radius-medium);
+  background: var(--color-outline);
+  display: block;
+  width: 1px;
+  position: absolute;
+  left: calc(0px - var(--space-xsmall));
+  top: var(--space-xxsmall);
+  bottom: var(--space-xxsmall);
+  opacity: 1;
+  transition: var(--transition-out);
+}
+
+.item:hover::after,  .item:hover + .item::after {
+  opacity: 0;
+  transition: var(--transition-in);
 }

package/lib-esm/constants.js

@@ -28,6 +28,18 @@ export const METRICS_WEBPACK_MODULES = [
     'webpack.duplicateCode',
 ];
 export const METRICS_WEBPACK_PACKAGES = ['webpack.packageCount', 'webpack.duplicatePackagesCount'];
+export const METRICS_GROUP_ASSETS = {
+    title: 'Assets',
+    metrics: METRICS_WEBPACK_ASSETS,
+};
+export const METRICS_GROUP_MODULES = {
+    title: 'Modules',
+    metrics: METRICS_WEBPACK_MODULES,
+};
+export const METRICS_GROUP_PACKAGES = {
+    title: 'Packages',
+    metrics: METRICS_WEBPACK_PACKAGES,
+};
 export const SORT = {
     ASC: 'asc',
     DESC: 'desc',

package/lib-esm/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAE3D,MAAM,CAAC,MAAM,IAAI,GAAG;IAClB,QAAQ,EAAE,GAAG;IACb,MAAM,EAAE,SAAS;IACjB,OAAO,EAAE,UAAU;IACnB,QAAQ,EAAE,WAAW;CACtB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;IAC1B,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,IAAI,CAAC,QAAQ;IAChC,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,IAAI,CAAC,MAAM;IAC9B,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,OAAO;IAChC,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,QAAQ;CACnC,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,UAAU,CAAC,MAAM,CACzD,CAAC,GAAG,EAAE,QAAQ,EAAE,EAAE,CAAC,CAAC;IAClB,GAAG,GAAG;IACN,CAAC,gCAAgC,QAAQ,EAAE,CAAC,EAAE,QAAQ;CACvD,CAAC,EACF,EAAE,CACH,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,4BAA4B;IAC5B,4BAA4B;IAC5B,6BAA6B;IAC7B,2BAA2B;CAC5B,CAAC;AACF,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,oBAAoB,EAAE,oBAAoB,CAAC,CAAC;AACnF,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,qBAAqB;IACrB,+BAA+B;IAC/B,uBAAuB;CACxB,CAAC;AACF,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,sBAAsB,EAAE,gCAAgC,CAAC,CAAC;AAEnG,MAAM,CAAC,MAAM,IAAI,GAAG;IAClB,GAAG,EAAE,KAAK;IACV,IAAI,EAAE,MAAM;CACJ,CAAC;AAEX,MAAM,CAAN,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC5B,yCAAmB,CAAA;IACnB,qCAAe,CAAA;AACjB,CAAC,EAHW,kBAAkB,KAAlB,kBAAkB,QAG7B;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG,kBAAkB,CAAC,KAAK,CAAC;AAElE,MAAM,CAAN,IAAY,qBAGX;AAHD,WAAY,qBAAqB;IAC/B,0CAAiB,CAAA;IACjB,0CAAiB,CAAA;AACnB,CAAC,EAHW,qBAAqB,KAArB,qBAAqB,QAGhC;AAED,MAAM,CAAC,MAAM,4BAA4B,GAAG,qBAAqB,CAAC,MAAM,CAAC;AAEzE,MAAM,CAAN,IAAY,gBAIX;AAJD,WAAY,gBAAgB;IAC1B,kCAAc,CAAA;IACd,oDAAgC,CAAA;IAChC,4CAAwB,CAAA;AAC1B,CAAC,EAJW,gBAAgB,KAAhB,gBAAgB,QAI3B;AAED,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE;QACvB,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,2CAA2C;KACrD;IACD,CAAC,gBAAgB,CAAC,UAAU,CAAC,EAAE;QAC7B,KAAK,EAAE,YAAY;QACnB,OAAO,EAAE,iDAAiD;KAC3D;IACD,CAAC,gBAAgB,CAAC,cAAc,CAAC,EAAE;QACjC,KAAK,EAAE,gBAAgB;QACvB,OAAO,EAAE,uBAAuB;KACjC;CACF,CAAC"}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"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"}