@parca/profile 0.19.140 → 0.19.142

package/CHANGELOG.md

@@ -3,7 +3,11 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## 0.19.140 (2026-04-13)
+## [0.19.142](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.141...@parca/profile@0.19.142) (2026-04-13)
+
+**Note:** Version bump only for package @parca/profile
+
+## [0.19.141](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.140...@parca/profile@0.19.141) (2026-04-13)
 
 **Note:** Version bump only for package @parca/profile
 

package/dist/GraphTooltipArrow/Content.js

@@ -1,4 +1,18 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { c as _c } from "react-compiler-runtime";
+// Copyright 2022 The Parca Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import React from 'react';
 import { Icon } from '@iconify/react';
 import { useParcaContext } from '@parca/components';
 import { formatDateTimeDownToMS, getLastItem } from '@parca/utilities';
@@ -6,35 +20,215 @@ import { hexifyAddress, truncateString, truncateStringReverse } from '../utils';
 import { ExpandOnHover } from './ExpandOnHoverValue';
 import { useGraphTooltip } from './useGraphTooltip';
 import { useGraphTooltipMetaInfo } from './useGraphTooltipMetaInfo';
-const NoData = () => {
-    return _jsx("span", { className: "rounded bg-gray-200 px-2 dark:bg-gray-800", children: "Not available" });
-};
-const GraphTooltipArrowContent = ({ table, profileType, unit, total, totalUnfiltered, row, isFixed, compareAbsolute, }) => {
-    const graphTooltipData = useGraphTooltip({
-        table,
-        profileType,
-        unit,
-        total,
-        totalUnfiltered,
-        row,
-        compareAbsolute,
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+var NoData = function NoData() {
+  var $ = _c(1);
+  var t0;
+  if ($[0] === Symbol["for"]("react.memo_cache_sentinel")) {
+    t0 = /*#__PURE__*/_jsx("span", {
+      className: "rounded bg-gray-200 px-2 dark:bg-gray-800",
+      children: "Not available"
     });
-    if (graphTooltipData === null) {
-        return _jsx(_Fragment, {});
-    }
-    const { name, locationAddress, cumulativeText, flatText, diffText, diff, row: rowNumber, } = graphTooltipData;
-    return (_jsx("div", { className: `flex text-sm ${isFixed ? 'w-full' : ''}`, children: _jsx("div", { className: `m-auto w-full ${isFixed ? 'w-full' : ''}`, children: _jsxs("div", { className: "flex w-auto max-w-[600px] min-w-[300px] flex-col justify-start rounded-lg border border-gray-300 bg-gray-50 p-3 shadow-lg dark:border-gray-500 dark:bg-gray-900", children: [_jsx("div", { className: "flex flex-row", children: _jsxs("div", { className: "mx-2", children: [_jsx("div", { className: "flex min-h-10 items-start justify-between gap-4 break-all font-semibold mb-2", children: row === 0 ? (_jsx("p", { children: "root" })) : (_jsx("p", { children: name !== ''
-                                            ? name
-                                            : locationAddress !== 0n
-                                                ? hexifyAddress(locationAddress)
-                                                : 'unknown' })) }), _jsx("table", { className: "my-2 w-full table-fixed pr-0 text-gray-700 dark:text-gray-300", children: _jsxs("tbody", { children: [_jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Cumulative" }), _jsx("td", { className: "w-3/4", children: _jsx("p", { children: cumulativeText }) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4 pt-2", children: "Flat" }), _jsx("td", { className: "w-3/4 pt-2", children: _jsx("p", { children: flatText }) })] }), diff !== 0n && (_jsxs("tr", { children: [_jsx("td", { className: "w-1/4 pt-2", children: "Diff" }), _jsx("td", { className: "w-3/4 pt-2", children: _jsx("p", { children: diffText }) })] })), _jsx(TooltipMetaInfo, { table: table, row: rowNumber })] }) })] }) }), _jsxs("div", { className: "flex w-full items-center gap-1 text-xs text-gray-500", children: [_jsx(Icon, { icon: "iconoir:mouse-button-right" }), _jsx("div", { children: "Right click to show context menu" })] })] }) }) }));
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  return t0;
+};
+var GraphTooltipArrowContent = function GraphTooltipArrowContent(_ref) {
+  var table = _ref.table,
+    profileType = _ref.profileType,
+    unit = _ref.unit,
+    total = _ref.total,
+    totalUnfiltered = _ref.totalUnfiltered,
+    row = _ref.row,
+    isFixed = _ref.isFixed,
+    compareAbsolute = _ref.compareAbsolute;
+  var graphTooltipData = useGraphTooltip({
+    table: table,
+    profileType: profileType,
+    unit: unit,
+    total: total,
+    totalUnfiltered: totalUnfiltered,
+    row: row,
+    compareAbsolute: compareAbsolute
+  });
+  if (graphTooltipData === null) {
+    return /*#__PURE__*/_jsx(_Fragment, {});
+  }
+  var name = graphTooltipData.name,
+    locationAddress = graphTooltipData.locationAddress,
+    cumulativeText = graphTooltipData.cumulativeText,
+    flatText = graphTooltipData.flatText,
+    diffText = graphTooltipData.diffText,
+    diff = graphTooltipData.diff,
+    rowNumber = graphTooltipData.row;
+  return /*#__PURE__*/_jsx("div", {
+    className: "flex text-sm ".concat(isFixed ? 'w-full' : ''),
+    children: /*#__PURE__*/_jsx("div", {
+      className: "m-auto w-full ".concat(isFixed ? 'w-full' : ''),
+      children: /*#__PURE__*/_jsxs("div", {
+        className: "flex w-auto max-w-[600px] min-w-[300px] flex-col justify-start rounded-lg border border-gray-300 bg-gray-50 p-3 shadow-lg dark:border-gray-500 dark:bg-gray-900",
+        children: [/*#__PURE__*/_jsx("div", {
+          className: "flex flex-row",
+          children: /*#__PURE__*/_jsxs("div", {
+            className: "mx-2",
+            children: [/*#__PURE__*/_jsx("div", {
+              className: "flex min-h-10 items-start justify-between gap-4 break-all font-semibold mb-2",
+              children: row === 0 ? /*#__PURE__*/_jsx("p", {
+                children: "root"
+              }) : /*#__PURE__*/_jsx("p", {
+                children: name !== '' ? name : locationAddress !== 0n ? hexifyAddress(locationAddress) : 'unknown'
+              })
+            }), /*#__PURE__*/_jsx("table", {
+              className: "my-2 w-full table-fixed pr-0 text-gray-700 dark:text-gray-300",
+              children: /*#__PURE__*/_jsxs("tbody", {
+                children: [/*#__PURE__*/_jsxs("tr", {
+                  children: [/*#__PURE__*/_jsx("td", {
+                    className: "w-1/4",
+                    children: "Cumulative"
+                  }), /*#__PURE__*/_jsx("td", {
+                    className: "w-3/4",
+                    children: /*#__PURE__*/_jsx("p", {
+                      children: cumulativeText
+                    })
+                  })]
+                }), /*#__PURE__*/_jsxs("tr", {
+                  children: [/*#__PURE__*/_jsx("td", {
+                    className: "w-1/4 pt-2",
+                    children: "Flat"
+                  }), /*#__PURE__*/_jsx("td", {
+                    className: "w-3/4 pt-2",
+                    children: /*#__PURE__*/_jsx("p", {
+                      children: flatText
+                    })
+                  })]
+                }), diff !== 0n && /*#__PURE__*/_jsxs("tr", {
+                  children: [/*#__PURE__*/_jsx("td", {
+                    className: "w-1/4 pt-2",
+                    children: "Diff"
+                  }), /*#__PURE__*/_jsx("td", {
+                    className: "w-3/4 pt-2",
+                    children: /*#__PURE__*/_jsx("p", {
+                      children: diffText
+                    })
+                  })]
+                }), /*#__PURE__*/_jsx(TooltipMetaInfo, {
+                  table: table,
+                  row: rowNumber
+                })]
+              })
+            })]
+          })
+        }), /*#__PURE__*/_jsxs("div", {
+          className: "flex w-full items-center gap-1 text-xs text-gray-500",
+          children: [/*#__PURE__*/_jsx(Icon, {
+            icon: "iconoir:mouse-button-right"
+          }), /*#__PURE__*/_jsx("div", {
+            children: "Right click to show context menu"
+          })]
+        })]
+      })
+    })
+  });
 };
-const TooltipMetaInfo = ({ table, row }) => {
-    const { labelPairs, functionFilename, file, locationAddress, mappingFile, mappingBuildID, inlined, timestamp, } = useGraphTooltipMetaInfo({ table, row });
-    const { timezone } = useParcaContext();
-    const labels = labelPairs.map((l) => (_jsx("span", { className: "mr-3 inline-block rounded-lg bg-gray-200 px-2 py-1 text-xs font-bold text-gray-700 dark:bg-gray-700 dark:text-gray-400", children: `${l[0]}="${l[1]}"` }, l[0])));
-    const isMappingBuildIDAvailable = mappingBuildID !== null && mappingBuildID !== '';
-    const inlinedText = inlined === null ? 'merged' : inlined ? 'yes' : 'no';
-    return (_jsxs(_Fragment, { children: [timestamp != null && timestamp !== 0n && (_jsxs("tr", { children: [_jsx("td", { className: "w-1/4 pt-2", children: "Timestamp" }), _jsx("td", { className: "w-3/4 pt-2 break-all", children: formatDateTimeDownToMS(new Date(Number(timestamp / 1000000n)), timezone) })] })), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "File" }), _jsx("td", { className: "w-3/4 break-all", children: functionFilename === '' ? (_jsx(NoData, {})) : (_jsx("div", { className: "flex gap-4", children: _jsx("div", { className: "whitespace-nowrap text-left", children: _jsx(ExpandOnHover, { value: file, displayValue: truncateStringReverse(file, 50) }) }) })) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Address" }), _jsx("td", { className: "w-3/4 break-all", children: locationAddress === 0n ? _jsx(NoData, {}) : _jsx("div", { children: hexifyAddress(locationAddress) }) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Inlined" }), _jsx("td", { className: "w-3/4 break-all", children: inlinedText })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Binary" }), _jsx("td", { className: "w-3/4 break-all", children: (mappingFile != null ? getLastItem(mappingFile) : null) ?? _jsx(NoData, {}) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Build Id" }), _jsx("td", { className: "w-3/4 break-all", children: isMappingBuildIDAvailable ? _jsx("div", { children: truncateString(mappingBuildID, 28) }) : _jsx(NoData, {}) })] }), labelPairs.length > 0 && (_jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Labels" }), _jsx("td", { className: "w-3/4 break-all", children: labels })] }))] }));
+var TooltipMetaInfo = function TooltipMetaInfo(_ref2) {
+  var _ref3;
+  var table = _ref2.table,
+    row = _ref2.row;
+  var _useGraphTooltipMetaI = useGraphTooltipMetaInfo({
+      table: table,
+      row: row
+    }),
+    labelPairs = _useGraphTooltipMetaI.labelPairs,
+    functionFilename = _useGraphTooltipMetaI.functionFilename,
+    file = _useGraphTooltipMetaI.file,
+    locationAddress = _useGraphTooltipMetaI.locationAddress,
+    mappingFile = _useGraphTooltipMetaI.mappingFile,
+    mappingBuildID = _useGraphTooltipMetaI.mappingBuildID,
+    inlined = _useGraphTooltipMetaI.inlined,
+    timestamp = _useGraphTooltipMetaI.timestamp;
+  var _useParcaContext = useParcaContext(),
+    timezone = _useParcaContext.timezone;
+  var labels = labelPairs.map(function (l) {
+    return /*#__PURE__*/_jsx("span", {
+      className: "mr-3 inline-block rounded-lg bg-gray-200 px-2 py-1 text-xs font-bold text-gray-700 dark:bg-gray-700 dark:text-gray-400",
+      children: "".concat(l[0], "=\"").concat(l[1], "\"")
+    }, l[0]);
+  });
+  var isMappingBuildIDAvailable = mappingBuildID !== null && mappingBuildID !== '';
+  var inlinedText = inlined === null ? 'merged' : inlined ? 'yes' : 'no';
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [timestamp != null && timestamp !== 0n && /*#__PURE__*/_jsxs("tr", {
+      children: [/*#__PURE__*/_jsx("td", {
+        className: "w-1/4 pt-2",
+        children: "Timestamp"
+      }), /*#__PURE__*/_jsx("td", {
+        className: "w-3/4 pt-2 break-all",
+        children: formatDateTimeDownToMS(new Date(Number(timestamp / 1000000n)), timezone)
+      })]
+    }), /*#__PURE__*/_jsxs("tr", {
+      children: [/*#__PURE__*/_jsx("td", {
+        className: "w-1/4",
+        children: "File"
+      }), /*#__PURE__*/_jsx("td", {
+        className: "w-3/4 break-all",
+        children: functionFilename === '' ? /*#__PURE__*/_jsx(NoData, {}) : /*#__PURE__*/_jsx("div", {
+          className: "flex gap-4",
+          children: /*#__PURE__*/_jsx("div", {
+            className: "whitespace-nowrap text-left",
+            children: /*#__PURE__*/_jsx(ExpandOnHover, {
+              value: file,
+              displayValue: truncateStringReverse(file, 50)
+            })
+          })
+        })
+      })]
+    }), /*#__PURE__*/_jsxs("tr", {
+      children: [/*#__PURE__*/_jsx("td", {
+        className: "w-1/4",
+        children: "Address"
+      }), /*#__PURE__*/_jsx("td", {
+        className: "w-3/4 break-all",
+        children: locationAddress === 0n ? /*#__PURE__*/_jsx(NoData, {}) : /*#__PURE__*/_jsx("div", {
+          children: hexifyAddress(locationAddress)
+        })
+      })]
+    }), /*#__PURE__*/_jsxs("tr", {
+      children: [/*#__PURE__*/_jsx("td", {
+        className: "w-1/4",
+        children: "Inlined"
+      }), /*#__PURE__*/_jsx("td", {
+        className: "w-3/4 break-all",
+        children: inlinedText
+      })]
+    }), /*#__PURE__*/_jsxs("tr", {
+      children: [/*#__PURE__*/_jsx("td", {
+        className: "w-1/4",
+        children: "Binary"
+      }), /*#__PURE__*/_jsx("td", {
+        className: "w-3/4 break-all",
+        children: (_ref3 = mappingFile != null ? getLastItem(mappingFile) : null) !== null && _ref3 !== void 0 ? _ref3 : /*#__PURE__*/_jsx(NoData, {})
+      })]
+    }), /*#__PURE__*/_jsxs("tr", {
+      children: [/*#__PURE__*/_jsx("td", {
+        className: "w-1/4",
+        children: "Build Id"
+      }), /*#__PURE__*/_jsx("td", {
+        className: "w-3/4 break-all",
+        children: isMappingBuildIDAvailable ? /*#__PURE__*/_jsx("div", {
+          children: truncateString(mappingBuildID, 28)
+        }) : /*#__PURE__*/_jsx(NoData, {})
+      })]
+    }), labelPairs.length > 0 && /*#__PURE__*/_jsxs("tr", {
+      children: [/*#__PURE__*/_jsx("td", {
+        className: "w-1/4",
+        children: "Labels"
+      }), /*#__PURE__*/_jsx("td", {
+        className: "w-3/4 break-all",
+        children: labels
+      })]
+    })]
+  });
 };
-export default GraphTooltipArrowContent;
+export default GraphTooltipArrowContent;

package/dist/GraphTooltipArrow/DockedGraphTooltip/index.js

@@ -1,4 +1,8 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { c as _c } from "react-compiler-runtime";
 // Copyright 2022 The Parca Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -11,6 +15,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
+
 import { Icon } from '@iconify/react';
 import cx from 'classnames';
 import { useWindowSize } from 'react-use';
@@ -19,38 +24,192 @@ import { getLastItem } from '@parca/utilities';
 import { hexifyAddress, truncateString, truncateStringReverse } from '../../utils';
 import { useGraphTooltip } from '../useGraphTooltip';
 import { useGraphTooltipMetaInfo } from '../useGraphTooltipMetaInfo';
-const InfoSection = ({ title, value, minWidth = '', }) => {
-    return (_jsxs("div", { className: cx('flex shrink-0 flex-col gap-1 p-2', { [minWidth]: minWidth != null }), children: [_jsx("p", { className: "text-sm font-medium leading-5 text-gray-500 dark:text-gray-400", children: title }), _jsx("div", { className: "text-lg font-normal text-gray-900 dark:text-gray-50", children: value })] }));
-};
-const NoData = () => {
-    return _jsx("span", { className: "rounded bg-gray-200 px-2 dark:bg-gray-800", children: "Not available" });
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+var InfoSection = function InfoSection(t0) {
+  var $ = _c(11);
+  var title = t0.title,
+    value = t0.value,
+    t1 = t0.minWidth;
+  var minWidth = t1 === undefined ? "" : t1;
+  var t2 = minWidth != null;
+  var t3;
+  if ($[0] !== minWidth || $[1] !== t2) {
+    t3 = cx("flex shrink-0 flex-col gap-1 p-2", _defineProperty({}, minWidth, t2));
+    $[0] = minWidth;
+    $[1] = t2;
+    $[2] = t3;
+  } else {
+    t3 = $[2];
+  }
+  var t4;
+  if ($[3] !== title) {
+    t4 = /*#__PURE__*/_jsx("p", {
+      className: "text-sm font-medium leading-5 text-gray-500 dark:text-gray-400",
+      children: title
+    });
+    $[3] = title;
+    $[4] = t4;
+  } else {
+    t4 = $[4];
+  }
+  var t5;
+  if ($[5] !== value) {
+    t5 = /*#__PURE__*/_jsx("div", {
+      className: "text-lg font-normal text-gray-900 dark:text-gray-50",
+      children: value
+    });
+    $[5] = value;
+    $[6] = t5;
+  } else {
+    t5 = $[6];
+  }
+  var t6;
+  if ($[7] !== t3 || $[8] !== t4 || $[9] !== t5) {
+    t6 = /*#__PURE__*/_jsxs("div", {
+      className: t3,
+      children: [t4, t5]
+    });
+    $[7] = t3;
+    $[8] = t4;
+    $[9] = t5;
+    $[10] = t6;
+  } else {
+    t6 = $[10];
+  }
+  return t6;
 };
-export const DockedGraphTooltip = ({ table, total, totalUnfiltered, row, profileType, unit, compareAbsolute, }) => {
-    let { width } = useWindowSize();
-    const { profileExplorer } = useParcaContext();
-    const { PaddingX } = profileExplorer ?? { PaddingX: 0 };
-    width = width - PaddingX - 24;
-    const graphTooltipData = useGraphTooltip({
-        table,
-        profileType,
-        unit,
-        total,
-        totalUnfiltered,
-        row,
-        compareAbsolute,
+var NoData = function NoData() {
+  var $ = _c(1);
+  var t0;
+  if ($[0] === Symbol["for"]("react.memo_cache_sentinel")) {
+    t0 = /*#__PURE__*/_jsx("span", {
+      className: "rounded bg-gray-200 px-2 dark:bg-gray-800",
+      children: "Not available"
     });
-    const { labelPairs, functionFilename, file, locationAddress, mappingFile, mappingBuildID, inlined, } = useGraphTooltipMetaInfo({ table, row: row ?? 0 });
-    if (graphTooltipData === null) {
-        return _jsx(_Fragment, {});
-    }
-    const { name, cumulativeText, flatText, diffText, diff } = graphTooltipData;
-    const labels = labelPairs.map((l) => (_jsx("span", { className: "mr-3 inline-block rounded-lg bg-gray-200 px-2 py-1 text-xs font-bold text-gray-700 dark:bg-gray-700 dark:text-gray-400", children: `${l[0]}="${l[1]}"` }, l[0])));
-    const isMappingBuildIDAvailable = mappingBuildID !== null && mappingBuildID !== '';
-    const inlinedText = inlined === null ? 'merged' : inlined ? 'yes' : 'no';
-    const addressText = locationAddress !== 0n ? hexifyAddress(locationAddress) : _jsx(NoData, {});
-    return (_jsxs("div", { className: "fixed bottom-0 z-20 overflow-hidden rounded-t-lg border-l border-r border-t border-gray-400 bg-white bg-opacity-90 px-8 py-3 dark:border-gray-600 dark:bg-black dark:bg-opacity-80", style: { width }, children: [_jsxs("div", { className: "flex flex-col gap-4", children: [_jsx("div", { className: "flex justify-between gap-4", children: row === 0 ? (_jsx("p", { children: "root" })) : (_jsx("p", { children: name !== ''
-                                ? name
-                                : locationAddress !== 0n
-                                    ? hexifyAddress(locationAddress)
-                                    : 'unknown' })) }), _jsxs("div", { className: "flex justify-between gap-3", children: [_jsx(InfoSection, { title: "Cumulative", value: cumulativeText, minWidth: "w-44" }), _jsx(InfoSection, { title: "Flat", value: flatText, minWidth: "w-44" }), diff !== 0n ? _jsx(InfoSection, { title: "Diff", value: diffText, minWidth: "w-44" }) : null, _jsx(InfoSection, { title: "File", value: functionFilename !== '' ? truncateStringReverse(file, 45) : _jsx(NoData, {}), minWidth: 'w-[460px]' }), _jsx(InfoSection, { title: "Address", value: addressText, minWidth: "w-44" }), _jsx(InfoSection, { title: "Inlined", value: inlinedText, minWidth: "w-44" }), _jsx(InfoSection, { title: "Binary", value: (mappingFile != null ? getLastItem(mappingFile) : null) ?? _jsx(NoData, {}), minWidth: "w-44" }), _jsx(InfoSection, { title: "Build ID", value: isMappingBuildIDAvailable ? (_jsx("div", { children: truncateString(mappingBuildID, 28) })) : (_jsx(NoData, {})) })] }), _jsx("div", { children: _jsx("div", { className: "flex h-5 gap-1", children: labels }) })] }), _jsxs("div", { className: "flex w-full items-center gap-1 text-xs text-gray-500", children: [_jsx(Icon, { icon: "iconoir:mouse-button-right" }), _jsx("div", { children: "Right click to show context menu" })] })] }));
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  return t0;
 };
+export var DockedGraphTooltip = function DockedGraphTooltip(_ref) {
+  var _ref3;
+  var table = _ref.table,
+    total = _ref.total,
+    totalUnfiltered = _ref.totalUnfiltered,
+    row = _ref.row,
+    profileType = _ref.profileType,
+    unit = _ref.unit,
+    compareAbsolute = _ref.compareAbsolute;
+  var _useWindowSize = useWindowSize(),
+    width = _useWindowSize.width;
+  var _useParcaContext = useParcaContext(),
+    profileExplorer = _useParcaContext.profileExplorer;
+  var _ref2 = profileExplorer !== null && profileExplorer !== void 0 ? profileExplorer : {
+      PaddingX: 0
+    },
+    PaddingX = _ref2.PaddingX;
+  width = width - PaddingX - 24;
+  var graphTooltipData = useGraphTooltip({
+    table: table,
+    profileType: profileType,
+    unit: unit,
+    total: total,
+    totalUnfiltered: totalUnfiltered,
+    row: row,
+    compareAbsolute: compareAbsolute
+  });
+  var _useGraphTooltipMetaI = useGraphTooltipMetaInfo({
+      table: table,
+      row: row !== null && row !== void 0 ? row : 0
+    }),
+    labelPairs = _useGraphTooltipMetaI.labelPairs,
+    functionFilename = _useGraphTooltipMetaI.functionFilename,
+    file = _useGraphTooltipMetaI.file,
+    locationAddress = _useGraphTooltipMetaI.locationAddress,
+    mappingFile = _useGraphTooltipMetaI.mappingFile,
+    mappingBuildID = _useGraphTooltipMetaI.mappingBuildID,
+    inlined = _useGraphTooltipMetaI.inlined;
+  if (graphTooltipData === null) {
+    return /*#__PURE__*/_jsx(_Fragment, {});
+  }
+  var name = graphTooltipData.name,
+    cumulativeText = graphTooltipData.cumulativeText,
+    flatText = graphTooltipData.flatText,
+    diffText = graphTooltipData.diffText,
+    diff = graphTooltipData.diff;
+  var labels = labelPairs.map(function (l) {
+    return /*#__PURE__*/_jsx("span", {
+      className: "mr-3 inline-block rounded-lg bg-gray-200 px-2 py-1 text-xs font-bold text-gray-700 dark:bg-gray-700 dark:text-gray-400",
+      children: "".concat(l[0], "=\"").concat(l[1], "\"")
+    }, l[0]);
+  });
+  var isMappingBuildIDAvailable = mappingBuildID !== null && mappingBuildID !== '';
+  var inlinedText = inlined === null ? 'merged' : inlined ? 'yes' : 'no';
+  var addressText = locationAddress !== 0n ? hexifyAddress(locationAddress) : /*#__PURE__*/_jsx(NoData, {});
+  return /*#__PURE__*/_jsxs("div", {
+    className: "fixed bottom-0 z-20 overflow-hidden rounded-t-lg border-l border-r border-t border-gray-400 bg-white bg-opacity-90 px-8 py-3 dark:border-gray-600 dark:bg-black dark:bg-opacity-80",
+    style: {
+      width: width
+    },
+    children: [/*#__PURE__*/_jsxs("div", {
+      className: "flex flex-col gap-4",
+      children: [/*#__PURE__*/_jsx("div", {
+        className: "flex justify-between gap-4",
+        children: row === 0 ? /*#__PURE__*/_jsx("p", {
+          children: "root"
+        }) : /*#__PURE__*/_jsx("p", {
+          children: name !== '' ? name : locationAddress !== 0n ? hexifyAddress(locationAddress) : 'unknown'
+        })
+      }), /*#__PURE__*/_jsxs("div", {
+        className: "flex justify-between gap-3",
+        children: [/*#__PURE__*/_jsx(InfoSection, {
+          title: "Cumulative",
+          value: cumulativeText,
+          minWidth: "w-44"
+        }), /*#__PURE__*/_jsx(InfoSection, {
+          title: "Flat",
+          value: flatText,
+          minWidth: "w-44"
+        }), diff !== 0n ? /*#__PURE__*/_jsx(InfoSection, {
+          title: "Diff",
+          value: diffText,
+          minWidth: "w-44"
+        }) : null, /*#__PURE__*/_jsx(InfoSection, {
+          title: "File",
+          value: functionFilename !== '' ? truncateStringReverse(file, 45) : /*#__PURE__*/_jsx(NoData, {}),
+          minWidth: 'w-[460px]'
+        }), /*#__PURE__*/_jsx(InfoSection, {
+          title: "Address",
+          value: addressText,
+          minWidth: "w-44"
+        }), /*#__PURE__*/_jsx(InfoSection, {
+          title: "Inlined",
+          value: inlinedText,
+          minWidth: "w-44"
+        }), /*#__PURE__*/_jsx(InfoSection, {
+          title: "Binary",
+          value: (_ref3 = mappingFile != null ? getLastItem(mappingFile) : null) !== null && _ref3 !== void 0 ? _ref3 : /*#__PURE__*/_jsx(NoData, {}),
+          minWidth: "w-44"
+        }), /*#__PURE__*/_jsx(InfoSection, {
+          title: "Build ID",
+          value: isMappingBuildIDAvailable ? /*#__PURE__*/_jsx("div", {
+            children: truncateString(mappingBuildID, 28)
+          }) : /*#__PURE__*/_jsx(NoData, {})
+        })]
+      }), /*#__PURE__*/_jsx("div", {
+        children: /*#__PURE__*/_jsx("div", {
+          className: "flex h-5 gap-1",
+          children: labels
+        })
+      })]
+    }), /*#__PURE__*/_jsxs("div", {
+      className: "flex w-full items-center gap-1 text-xs text-gray-500",
+      children: [/*#__PURE__*/_jsx(Icon, {
+        icon: "iconoir:mouse-button-right"
+      }), /*#__PURE__*/_jsx("div", {
+        children: "Right click to show context menu"
+      })]
+    })]
+  });
+};

package/dist/GraphTooltipArrow/ExpandOnHoverValue.js

@@ -1,4 +1,54 @@
+import { c as _c } from "react-compiler-runtime"; // Copyright 2022 The Parca Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const ExpandOnHover = ({ value, displayValue }) => {
-    return (_jsxs("div", { className: "group relative w-full", children: [_jsx("div", { className: "w-full overflow-hidden text-ellipsis whitespace-nowrap", children: displayValue ?? value }), _jsx("div", { className: "absolute -inset-2 hidden h-fit max-w-[500px] whitespace-normal break-all rounded bg-gray-50 p-2 shadow-[0_0_10px_2px_rgba(0,0,0,0.3)] group-hover:flex dark:bg-gray-900 z-10", children: value })] }));
-};
+export var ExpandOnHover = function ExpandOnHover(t0) {
+  var $ = _c(7);
+  var value = t0.value,
+    displayValue = t0.displayValue;
+  var t1 = displayValue !== null && displayValue !== void 0 ? displayValue : value;
+  var t2;
+  if ($[0] !== t1) {
+    t2 = /*#__PURE__*/_jsx("div", {
+      className: "w-full overflow-hidden text-ellipsis whitespace-nowrap",
+      children: t1
+    });
+    $[0] = t1;
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  var t3;
+  if ($[2] !== value) {
+    t3 = /*#__PURE__*/_jsx("div", {
+      className: "absolute -inset-2 hidden h-fit max-w-[500px] whitespace-normal break-all rounded bg-gray-50 p-2 shadow-[0_0_10px_2px_rgba(0,0,0,0.3)] group-hover:flex dark:bg-gray-900 z-10",
+      children: value
+    });
+    $[2] = value;
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+  var t4;
+  if ($[4] !== t2 || $[5] !== t3) {
+    t4 = /*#__PURE__*/_jsxs("div", {
+      className: "group relative w-full",
+      children: [t2, t3]
+    });
+    $[4] = t2;
+    $[5] = t3;
+    $[6] = t4;
+  } else {
+    t4 = $[6];
+  }
+  return t4;
+};

package/dist/GraphTooltipArrow/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/GraphTooltipArrow/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAKjD,UAAU,iBAAiB;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,cAAc,EAAE,OAAO,GAAG,IAAI,CAAC;CAChC;AAmBD,QAAA,MAAM,YAAY,GAAI,8BAA4B,iBAAiB,KAAG,KAAK,CAAC,GAAG,CAAC,OAkD/E,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/GraphTooltipArrow/index.tsx"],"names":[],"mappings":"AAeA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAKjD,UAAU,iBAAiB;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,cAAc,EAAE,OAAO,GAAG,IAAI,CAAC;CAChC;AAmBD,QAAA,MAAM,YAAY,GAAI,8BAA4B,iBAAiB,KAAG,KAAK,CAAC,GAAG,CAAC,OAmD/E,CAAC;AAEF,eAAe,YAAY,CAAC"}