@parca/profile 0.19.140 → 0.19.143

package/dist/SourceView/Highlighter.js

@@ -1,4 +1,4 @@
-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.
@@ -11,6 +11,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } 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 { useId, useMemo } from 'react';
 import cx from 'classnames';
 import { scaleLinear } from 'd3-scale';
@@ -24,77 +25,236 @@ import { useProfileViewContext } from '../ProfileView/context/ProfileViewContext
 import { LineNo } from './LineNo';
 import { langaugeFromFile } from './lang-detector';
 import useLineRange from './useSelectedLineRange';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 // cannot make this a function on the number as we need the classes to be static for tailwind
-const charsToWidthMap = {
-    1: 'w-3',
-    2: 'w-5',
-    3: 'w-7',
-    4: 'w-9',
-    5: 'w-11',
-    6: 'w-[52px]',
-    7: 'w-[60px]]',
-    8: 'w-[68px]',
-    9: 'w-[76px]',
-    10: 'w-[84px]',
-    11: 'w-[92px]',
-    12: 'w-[100px]',
-    13: 'w-[108px]',
-    14: 'w-[116px]',
-};
-const intensityScale = scaleLinear().domain([0, 99]).range([0.05, 0.75]);
-const LineProfileMetadata = ({ value, total, filtered, }) => {
-    const commonClasses = 'w-[52px] shrink-0';
-    const id = useId();
-    const { profileSource } = useProfileViewContext();
-    if (value === 0n) {
-        return _jsx("div", { className: cx(commonClasses) });
-    }
-    const unfilteredPercent = (Number(value) / Number(total + filtered)) * 100;
-    const filteredPercent = (Number(value) / Number(total)) * 100;
-    const valueWithUnit = valueFormatter(value, profileSource?.ProfileType().periodUnit ?? '', 1, true);
-    return (_jsxs(_Fragment, { children: [_jsx("p", { className: cx('w- flex justify-end overflow-hidden text-ellipsis whitespace-nowrap', commonClasses), style: { backgroundColor: `rgba(236, 151, 6, ${intensityScale(unfilteredPercent)})` }, "data-tooltip-id": id, "data-tooltip-content": `${valueWithUnit} (${unfilteredPercent.toFixed(2)}%${filtered > 0n ? ` / ${filteredPercent.toFixed(2)}%` : ''})`, children: valueWithUnit }), _jsx(Tooltip, { id: id })] }));
+var charsToWidthMap = {
+  1: 'w-3',
+  2: 'w-5',
+  3: 'w-7',
+  4: 'w-9',
+  5: 'w-11',
+  6: 'w-[52px]',
+  7: 'w-[60px]]',
+  8: 'w-[68px]',
+  9: 'w-[76px]',
+  10: 'w-[84px]',
+  11: 'w-[92px]',
+  12: 'w-[100px]',
+  13: 'w-[108px]',
+  14: 'w-[116px]'
 };
-const charsToWidth = (chars) => {
-    return charsToWidthMap[chars];
+var intensityScale = scaleLinear().domain([0, 99]).range([0.05, 0.75]);
+var LineProfileMetadata = function LineProfileMetadata(_ref) {
+  var _profileSource$Profil;
+  var value = _ref.value,
+    total = _ref.total,
+    filtered = _ref.filtered;
+  var commonClasses = 'w-[52px] shrink-0';
+  var id = useId();
+  var _useProfileViewContex = useProfileViewContext(),
+    profileSource = _useProfileViewContex.profileSource;
+  if (value === 0n) {
+    return /*#__PURE__*/_jsx("div", {
+      className: cx(commonClasses)
+    });
+  }
+  var unfilteredPercent = Number(value) / Number(total + filtered) * 100;
+  var filteredPercent = Number(value) / Number(total) * 100;
+  var valueWithUnit = valueFormatter(value, (_profileSource$Profil = profileSource === null || profileSource === void 0 ? void 0 : profileSource.ProfileType().periodUnit) !== null && _profileSource$Profil !== void 0 ? _profileSource$Profil : '', 1, true);
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx("p", {
+      className: cx('w- flex justify-end overflow-hidden text-ellipsis whitespace-nowrap', commonClasses),
+      style: {
+        backgroundColor: "rgba(236, 151, 6, ".concat(intensityScale(unfilteredPercent), ")")
+      },
+      "data-tooltip-id": id,
+      "data-tooltip-content": "".concat(valueWithUnit, " (").concat(unfilteredPercent.toFixed(2), "%").concat(filtered > 0n ? " / ".concat(filteredPercent.toFixed(2), "%") : '', ")"),
+      children: valueWithUnit
+    }), /*#__PURE__*/_jsx(Tooltip, {
+      id: id
+    })]
+  });
 };
-export const profileAwareRenderer = (getLineData, total, filtered, onContextMenu) => {
-    return function ProfileAwareRenderer({ rows, stylesheet, useInlineStyles, }) {
-        const lineNumberWidth = charsToWidth(rows.length.toString().length);
-        const { startLine, endLine, setLineRange } = useLineRange();
-        return (_jsx(_Fragment, { children: rows.map((node, i) => {
-                const lineNumber = node.children[0].children[0].value;
-                const isCurrentLine = lineNumber >= startLine && lineNumber <= endLine;
-                node.children = node.children.slice(1);
-                const data = getLineData(lineNumber);
-                return (_jsxs("div", { className: "flex gap-1", children: [_jsx("div", { className: cx('shrink-0 overflow-hidden border-r border-r-gray-200 text-right dark:border-r-gray-700', lineNumberWidth), children: _jsx(LineNo, { value: lineNumber, isCurrent: isCurrentLine, selectLine: (isShiftDown = false) => {
-                                    if (!isShiftDown) {
-                                        setLineRange(lineNumber, lineNumber);
-                                    }
-                                    if (isShiftDown && startLine != null) {
-                                        if (startLine > lineNumber) {
-                                            setLineRange(lineNumber, startLine);
-                                        }
-                                        else {
-                                            setLineRange(startLine, lineNumber);
-                                        }
-                                    }
-                                } }) }), _jsx(LineProfileMetadata, { value: data?.cumulative ?? 0n, total: total, filtered: filtered }), _jsx(LineProfileMetadata, { value: data?.flat ?? 0n, total: total, filtered: filtered }), _jsx("div", { className: cx('w-full flex-grow-0 border-l border-gray-200 pl-1 dark:border-gray-700', {
-                                'bg-yellow-200 dark:bg-yellow-700': isCurrentLine,
-                            }), onContextMenu: onContextMenu, children: createElement({
-                                key: `source-line-${i}`,
-                                node,
-                                stylesheet,
-                                useInlineStyles,
-                            }) })] }, `${i}`));
-            }) }));
-    };
+var charsToWidth = function charsToWidth(chars) {
+  return charsToWidthMap[chars];
 };
-export const Highlighter = ({ file, content, renderer }) => {
-    const { isDarkMode } = useParcaContext();
-    const language = useMemo(() => langaugeFromFile(file), [file]);
-    return (_jsxs("div", { className: "relative", children: [_jsxs("div", { className: "flex gap-2 text-xs", children: [_jsx("div", { className: cx('text-right', charsToWidth(content
-                            .split(
-                        // prettier-ignore
-                        '\n')
-                            .length.toString().length)), children: "Line" }), _jsxs("div", { className: "flex gap-3", children: [_jsx("div", { children: "Cumulative" }), _jsx("div", { children: "Flat" }), _jsx("div", { children: "Source" })] })] }), _jsx("div", { className: "text-xs overflow-auto", style: { maxHeight: 'calc(100vh - 200px)' }, children: _jsx(SyntaxHighlighter, { language: language, style: isDarkMode ? atomOneDark : atomOneLight, showLineNumbers: true, renderer: renderer, customStyle: { padding: 0 }, children: content }) })] }));
+export var profileAwareRenderer = function profileAwareRenderer(getLineData, total, filtered, onContextMenu) {
+  return function ProfileAwareRenderer(_ref2) {
+    var rows = _ref2.rows,
+      stylesheet = _ref2.stylesheet,
+      useInlineStyles = _ref2.useInlineStyles;
+    var lineNumberWidth = charsToWidth(rows.length.toString().length);
+    var _useLineRange = useLineRange(),
+      startLine = _useLineRange.startLine,
+      endLine = _useLineRange.endLine,
+      setLineRange = _useLineRange.setLineRange;
+    return /*#__PURE__*/_jsx(_Fragment, {
+      children: rows.map(function (node, i) {
+        var _data$cumulative, _data$flat;
+        var lineNumber = node.children[0].children[0].value;
+        var isCurrentLine = lineNumber >= startLine && lineNumber <= endLine;
+        node.children = node.children.slice(1);
+        var data = getLineData(lineNumber);
+        return /*#__PURE__*/_jsxs("div", {
+          className: "flex gap-1",
+          children: [/*#__PURE__*/_jsx("div", {
+            className: cx('shrink-0 overflow-hidden border-r border-r-gray-200 text-right dark:border-r-gray-700', lineNumberWidth),
+            children: /*#__PURE__*/_jsx(LineNo, {
+              value: lineNumber,
+              isCurrent: isCurrentLine,
+              selectLine: function selectLine() {
+                var isShiftDown = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+                if (!isShiftDown) {
+                  setLineRange(lineNumber, lineNumber);
+                }
+                if (isShiftDown && startLine != null) {
+                  if (startLine > lineNumber) {
+                    setLineRange(lineNumber, startLine);
+                  } else {
+                    setLineRange(startLine, lineNumber);
+                  }
+                }
+              }
+            })
+          }), /*#__PURE__*/_jsx(LineProfileMetadata, {
+            value: (_data$cumulative = data === null || data === void 0 ? void 0 : data.cumulative) !== null && _data$cumulative !== void 0 ? _data$cumulative : 0n,
+            total: total,
+            filtered: filtered
+          }), /*#__PURE__*/_jsx(LineProfileMetadata, {
+            value: (_data$flat = data === null || data === void 0 ? void 0 : data.flat) !== null && _data$flat !== void 0 ? _data$flat : 0n,
+            total: total,
+            filtered: filtered
+          }), /*#__PURE__*/_jsx("div", {
+            className: cx('w-full flex-grow-0 border-l border-gray-200 pl-1 dark:border-gray-700', {
+              'bg-yellow-200 dark:bg-yellow-700': isCurrentLine
+            }),
+            onContextMenu: onContextMenu,
+            children: createElement({
+              key: "source-line-".concat(i),
+              node: node,
+              stylesheet: stylesheet,
+              useInlineStyles: useInlineStyles
+            })
+          })]
+        }, "".concat(i));
+      })
+    });
+  };
 };
+export var Highlighter = function Highlighter(t0) {
+  var $ = _c(19);
+  var file = t0.file,
+    content = t0.content,
+    renderer = t0.renderer;
+  var _useParcaContext = useParcaContext(),
+    isDarkMode = _useParcaContext.isDarkMode;
+  var t1;
+  if ($[0] !== file) {
+    t1 = langaugeFromFile(file);
+    $[0] = file;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  var language = t1;
+  var t2;
+  if ($[2] !== content) {
+    t2 = cx("text-right", charsToWidth(content.split("\n").length.toString().length));
+    $[2] = content;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  var t3;
+  if ($[4] !== t2) {
+    t3 = /*#__PURE__*/_jsx("div", {
+      className: t2,
+      children: "Line"
+    });
+    $[4] = t2;
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  var t4;
+  if ($[6] === Symbol["for"]("react.memo_cache_sentinel")) {
+    t4 = /*#__PURE__*/_jsxs("div", {
+      className: "flex gap-3",
+      children: [/*#__PURE__*/_jsx("div", {
+        children: "Cumulative"
+      }), /*#__PURE__*/_jsx("div", {
+        children: "Flat"
+      }), /*#__PURE__*/_jsx("div", {
+        children: "Source"
+      })]
+    });
+    $[6] = t4;
+  } else {
+    t4 = $[6];
+  }
+  var t5;
+  if ($[7] !== t3) {
+    t5 = /*#__PURE__*/_jsxs("div", {
+      className: "flex gap-2 text-xs",
+      children: [t3, t4]
+    });
+    $[7] = t3;
+    $[8] = t5;
+  } else {
+    t5 = $[8];
+  }
+  var t6;
+  if ($[9] === Symbol["for"]("react.memo_cache_sentinel")) {
+    t6 = {
+      maxHeight: "calc(100vh - 200px)"
+    };
+    $[9] = t6;
+  } else {
+    t6 = $[9];
+  }
+  var t7 = isDarkMode ? atomOneDark : atomOneLight;
+  var t8;
+  if ($[10] === Symbol["for"]("react.memo_cache_sentinel")) {
+    t8 = {
+      padding: 0
+    };
+    $[10] = t8;
+  } else {
+    t8 = $[10];
+  }
+  var t9;
+  if ($[11] !== content || $[12] !== language || $[13] !== renderer || $[14] !== t7) {
+    t9 = /*#__PURE__*/_jsx("div", {
+      className: "text-xs overflow-auto",
+      style: t6,
+      children: /*#__PURE__*/_jsx(SyntaxHighlighter, {
+        language: language,
+        style: t7,
+        showLineNumbers: true,
+        renderer: renderer,
+        customStyle: t8,
+        children: content
+      })
+    });
+    $[11] = content;
+    $[12] = language;
+    $[13] = renderer;
+    $[14] = t7;
+    $[15] = t9;
+  } else {
+    t9 = $[15];
+  }
+  var t10;
+  if ($[16] !== t5 || $[17] !== t9) {
+    t10 = /*#__PURE__*/_jsxs("div", {
+      className: "relative",
+      children: [t5, t9]
+    });
+    $[16] = t5;
+    $[17] = t9;
+    $[18] = t10;
+  } else {
+    t10 = $[18];
+  }
+  return t10;
+};

package/dist/SourceView/LineNo.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } 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.
@@ -11,22 +11,77 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // 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 { useEffect, useRef } from 'react';
 import cx from 'classnames';
-export const LineNo = ({ value, isCurrent = false, selectLine }) => {
-    const ref = useRef(null);
-    useEffect(() => {
-        if (isCurrent && ref.current !== null) {
-            const bounds = ref.current.getBoundingClientRect();
-            if (bounds.top > 0 &&
-                bounds.bottom < (window.innerHeight ?? document.documentElement.clientHeight)) {
-                // already in view, so don't make the unnecessary scroll to center it
-                return;
-            }
-            ref.current.scrollIntoView({ behavior: 'smooth', block: 'center' });
+import { jsx as _jsx } from "react/jsx-runtime";
+export var LineNo = function LineNo(t0) {
+  var $ = _c(11);
+  var value = t0.value,
+    t1 = t0.isCurrent,
+    selectLine = t0.selectLine;
+  var isCurrent = t1 === undefined ? false : t1;
+  var ref = useRef(null);
+  var t2;
+  var t3;
+  if ($[0] !== isCurrent) {
+    t2 = function t2() {
+      if (isCurrent && ref.current !== null) {
+        var _window$innerHeight;
+        var bounds = ref.current.getBoundingClientRect();
+        if (bounds.top > 0 && bounds.bottom < ((_window$innerHeight = window.innerHeight) !== null && _window$innerHeight !== void 0 ? _window$innerHeight : document.documentElement.clientHeight)) {
+          return;
         }
-    }, [isCurrent]);
-    return (_jsx("code", { ref: ref, onClick: e => typeof selectLine === 'function' && selectLine(e.shiftKey), className: cx('cursor-pointer px-1 select-none', {
-            'border-l border-l-amber-900 bg-yellow-200 dark:bg-yellow-700': isCurrent,
-        }), children: value.toString() + '\n' }));
-};
+        ref.current.scrollIntoView({
+          behavior: "smooth",
+          block: "center"
+        });
+      }
+    };
+    t3 = [isCurrent];
+    $[0] = isCurrent;
+    $[1] = t2;
+    $[2] = t3;
+  } else {
+    t2 = $[1];
+    t3 = $[2];
+  }
+  useEffect(t2, t3);
+  var t4;
+  if ($[3] !== selectLine) {
+    t4 = function t4(e) {
+      return typeof selectLine === "function" && selectLine(e.shiftKey);
+    };
+    $[3] = selectLine;
+    $[4] = t4;
+  } else {
+    t4 = $[4];
+  }
+  var t5;
+  if ($[5] !== isCurrent) {
+    t5 = cx("cursor-pointer px-1 select-none", {
+      "border-l border-l-amber-900 bg-yellow-200 dark:bg-yellow-700": isCurrent
+    });
+    $[5] = isCurrent;
+    $[6] = t5;
+  } else {
+    t5 = $[6];
+  }
+  var t6 = value.toString() + "\n";
+  var t7;
+  if ($[7] !== t4 || $[8] !== t5 || $[9] !== t6) {
+    t7 = /*#__PURE__*/_jsx("code", {
+      ref: ref,
+      onClick: t4,
+      className: t5,
+      children: t6
+    });
+    $[7] = t4;
+    $[8] = t5;
+    $[9] = t6;
+    $[10] = t7;
+  } else {
+    t7 = $[10];
+  }
+  return t7;
+};