@parca/profile 0.19.139 → 0.19.142

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 (170) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/GraphTooltipArrow/Content.js +224 -30
  3. package/dist/GraphTooltipArrow/DockedGraphTooltip/index.js +192 -33
  4. package/dist/GraphTooltipArrow/ExpandOnHoverValue.js +53 -3
  5. package/dist/GraphTooltipArrow/index.d.ts.map +1 -1
  6. package/dist/GraphTooltipArrow/index.js +86 -56
  7. package/dist/GraphTooltipArrow/useGraphTooltip/index.js +37 -37
  8. package/dist/GraphTooltipArrow/useGraphTooltipMetaInfo/index.js +103 -73
  9. package/dist/MatchersInput/SuggestionItem.js +91 -12
  10. package/dist/MatchersInput/SuggestionsList.d.ts +2 -1
  11. package/dist/MatchersInput/SuggestionsList.d.ts.map +1 -1
  12. package/dist/MatchersInput/SuggestionsList.js +371 -157
  13. package/dist/MatchersInput/SuggestionsList.test.d.ts +2 -0
  14. package/dist/MatchersInput/SuggestionsList.test.d.ts.map +1 -0
  15. package/dist/MatchersInput/index.js +308 -115
  16. package/dist/MetricsCircle/index.js +39 -3
  17. package/dist/MetricsGraph/MetricsContextMenu/index.js +119 -19
  18. package/dist/MetricsGraph/MetricsInfoPanel/index.js +81 -20
  19. package/dist/MetricsGraph/MetricsTooltip/index.d.ts.map +1 -1
  20. package/dist/MetricsGraph/MetricsTooltip/index.js +107 -74
  21. package/dist/MetricsGraph/index.js +552 -203
  22. package/dist/MetricsGraph/useMetricsGraphDimensions.js +46 -25
  23. package/dist/MetricsGraph/utils/colorMapping.js +24 -17
  24. package/dist/MetricsSeries/index.js +70 -7
  25. package/dist/PreSelectedMatchers/index.d.ts.map +1 -1
  26. package/dist/PreSelectedMatchers/index.js +249 -102
  27. package/dist/ProfileExplorer/ProfileExplorerCompare.js +240 -49
  28. package/dist/ProfileExplorer/ProfileExplorerSingle.js +98 -11
  29. package/dist/ProfileExplorer/index.js +183 -32
  30. package/dist/ProfileFlameChart/SamplesStrips/SamplesGraph/index.js +333 -148
  31. package/dist/ProfileFlameChart/SamplesStrips/SamplesStrips.stories.js +69 -35
  32. package/dist/ProfileFlameChart/SamplesStrips/index.js +645 -134
  33. package/dist/ProfileFlameChart/SamplesStrips/labelSetUtils.js +114 -55
  34. package/dist/ProfileFlameChart/index.js +266 -134
  35. package/dist/ProfileFlameGraph/FlameGraphArrow/ContextMenu.js +287 -88
  36. package/dist/ProfileFlameGraph/FlameGraphArrow/ContextMenuWrapper.js +56 -20
  37. package/dist/ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.js +211 -140
  38. package/dist/ProfileFlameGraph/FlameGraphArrow/MemoizedTooltip.js +133 -38
  39. package/dist/ProfileFlameGraph/FlameGraphArrow/MiniMap.js +261 -216
  40. package/dist/ProfileFlameGraph/FlameGraphArrow/TextWithEllipsis.d.ts.map +1 -1
  41. package/dist/ProfileFlameGraph/FlameGraphArrow/TextWithEllipsis.js +71 -45
  42. package/dist/ProfileFlameGraph/FlameGraphArrow/TooltipContext.d.ts.map +1 -1
  43. package/dist/ProfileFlameGraph/FlameGraphArrow/TooltipContext.js +58 -28
  44. package/dist/ProfileFlameGraph/FlameGraphArrow/ZoomControls.d.ts.map +1 -1
  45. package/dist/ProfileFlameGraph/FlameGraphArrow/ZoomControls.js +59 -8
  46. package/dist/ProfileFlameGraph/FlameGraphArrow/index.js +396 -179
  47. package/dist/ProfileFlameGraph/FlameGraphArrow/useBatchedRendering.d.ts.map +1 -1
  48. package/dist/ProfileFlameGraph/FlameGraphArrow/useBatchedRendering.js +68 -50
  49. package/dist/ProfileFlameGraph/FlameGraphArrow/useMappingList.js +62 -38
  50. package/dist/ProfileFlameGraph/FlameGraphArrow/useNodeColor.js +14 -6
  51. package/dist/ProfileFlameGraph/FlameGraphArrow/useScrollViewport.js +124 -82
  52. package/dist/ProfileFlameGraph/FlameGraphArrow/useVisibleNodes.js +160 -98
  53. package/dist/ProfileFlameGraph/FlameGraphArrow/useZoom.js +232 -112
  54. package/dist/ProfileFlameGraph/FlameGraphArrow/utils.js +137 -114
  55. package/dist/ProfileFlameGraph/benchmarks/benchdata/populateData.js +85 -0
  56. package/dist/ProfileFlameGraph/index.js +324 -148
  57. package/dist/ProfileMetricsGraph/hooks/useQueryRange.js +140 -32
  58. package/dist/ProfileMetricsGraph/index.js +518 -259
  59. package/dist/ProfileSelector/CompareButton.js +132 -12
  60. package/dist/ProfileSelector/MetricsGraphSection.js +234 -67
  61. package/dist/ProfileSelector/index.d.ts.map +1 -1
  62. package/dist/ProfileSelector/index.js +730 -142
  63. package/dist/ProfileSelector/useAutoQuerySelector.js +249 -130
  64. package/dist/ProfileSource.js +230 -163
  65. package/dist/ProfileTypeSelector/index.js +214 -125
  66. package/dist/ProfileView/components/ActionButtons/GroupByDropdown.js +50 -4
  67. package/dist/ProfileView/components/ActionButtons/SortByDropdown.js +139 -33
  68. package/dist/ProfileView/components/ColorStackLegend.js +184 -55
  69. package/dist/ProfileView/components/DashboardItems/index.js +87 -28
  70. package/dist/ProfileView/components/DashboardLayout/index.js +108 -16
  71. package/dist/ProfileView/components/DiffLegend.js +172 -29
  72. package/dist/ProfileView/components/GroupByLabelsDropdown/index.js +199 -55
  73. package/dist/ProfileView/components/InvertCallStack/index.js +99 -10
  74. package/dist/ProfileView/components/ProfileFilters/filterPresets.js +260 -315
  75. package/dist/ProfileView/components/ProfileFilters/index.js +518 -215
  76. package/dist/ProfileView/components/ProfileFilters/useProfileFilters.js +370 -306
  77. package/dist/ProfileView/components/ProfileFilters/useProfileFiltersUrlState.js +188 -120
  78. package/dist/ProfileView/components/ProfileHeader/index.js +105 -11
  79. package/dist/ProfileView/components/ShareButton/ResultBox.js +119 -16
  80. package/dist/ProfileView/components/ShareButton/index.js +352 -62
  81. package/dist/ProfileView/components/Toolbars/MultiLevelDropdown.d.ts.map +1 -1
  82. package/dist/ProfileView/components/Toolbars/MultiLevelDropdown.js +675 -195
  83. package/dist/ProfileView/components/Toolbars/SwitchMenuItem.js +94 -7
  84. package/dist/ProfileView/components/Toolbars/TableColumnsDropdown.js +198 -157
  85. package/dist/ProfileView/components/Toolbars/index.js +441 -21
  86. package/dist/ProfileView/components/ViewSelector/Dropdown.js +233 -22
  87. package/dist/ProfileView/components/ViewSelector/index.js +211 -91
  88. package/dist/ProfileView/components/VisualizationContainer/index.d.ts.map +1 -1
  89. package/dist/ProfileView/components/VisualizationContainer/index.js +52 -7
  90. package/dist/ProfileView/components/VisualizationPanel.js +185 -8
  91. package/dist/ProfileView/context/DashboardContext.js +84 -28
  92. package/dist/ProfileView/context/ProfileViewContext.js +56 -15
  93. package/dist/ProfileView/hooks/useAutoSelectDimension.js +71 -41
  94. package/dist/ProfileView/hooks/useProfileMetadata.js +50 -18
  95. package/dist/ProfileView/hooks/useResetFlameGraphState.js +31 -10
  96. package/dist/ProfileView/hooks/useResetStateOnProfileTypeChange.js +72 -29
  97. package/dist/ProfileView/hooks/useResetStateOnSeriesChange.js +39 -13
  98. package/dist/ProfileView/hooks/useVisualizationState.js +262 -87
  99. package/dist/ProfileView/index.js +383 -45
  100. package/dist/ProfileView/types/visualization.js +1 -13
  101. package/dist/ProfileView/utils/colorUtils.js +8 -7
  102. package/dist/ProfileViewWithData.js +332 -237
  103. package/dist/QueryControls/index.js +418 -47
  104. package/dist/Sandwich/components/CalleesSection.js +54 -4
  105. package/dist/Sandwich/components/CallersSection.js +97 -27
  106. package/dist/Sandwich/components/TableSection.js +77 -4
  107. package/dist/Sandwich/index.js +125 -12
  108. package/dist/Sandwich/utils/processRowData.js +48 -39
  109. package/dist/SelectWithRefresh/index.js +102 -28
  110. package/dist/SimpleMatchers/Select.js +520 -187
  111. package/dist/SimpleMatchers/index.js +590 -288
  112. package/dist/SourceView/Highlighter.js +230 -70
  113. package/dist/SourceView/LineNo.js +72 -17
  114. package/dist/SourceView/index.js +177 -101
  115. package/dist/SourceView/lang-detector/ext-to-lang.json +798 -798
  116. package/dist/SourceView/lang-detector/index.js +28 -14
  117. package/dist/SourceView/useSelectedLineRange.js +97 -16
  118. package/dist/Table/ColorCell.js +42 -1
  119. package/dist/Table/ColumnsVisibility.js +114 -6
  120. package/dist/Table/MoreDropdown.js +121 -27
  121. package/dist/Table/TableContextMenu.js +150 -139
  122. package/dist/Table/TableContextMenuWrapper.js +59 -14
  123. package/dist/Table/hooks/useColorManagement.js +58 -16
  124. package/dist/Table/hooks/useTableConfiguration.d.ts.map +1 -1
  125. package/dist/Table/hooks/useTableConfiguration.js +331 -168
  126. package/dist/Table/index.js +222 -126
  127. package/dist/Table/utils/functions.js +169 -144
  128. package/dist/Table/utils/topAndBottomExpandedRowModel.js +69 -52
  129. package/dist/TimelineGuide/index.js +209 -16
  130. package/dist/TopTable/benchmarks/benchdata/populateData.js +91 -0
  131. package/dist/TopTable/index.js +340 -122
  132. package/dist/contexts/LabelsQueryProvider.js +94 -32
  133. package/dist/contexts/UnifiedLabelsContext.js +114 -49
  134. package/dist/contexts/utils.js +37 -15
  135. package/dist/hooks/useCompareModeMeta.js +157 -94
  136. package/dist/hooks/useLabels.js +295 -52
  137. package/dist/hooks/useQueryState.js +371 -330
  138. package/dist/index.js +21 -16
  139. package/dist/testdata/fg-diff.json +3750 -0
  140. package/dist/testdata/fg-simple.json +1879 -0
  141. package/dist/testdata/link_data.json +56 -0
  142. package/dist/testdata/tabular.json +30 -0
  143. package/dist/testdata/test_flamegraph.json +26846 -0
  144. package/dist/testdata/test_graph.json +53 -0
  145. package/dist/useDelayedLoader.js +32 -18
  146. package/dist/useGrpcQuery/index.js +71 -11
  147. package/dist/useHasProfileData.js +90 -12
  148. package/dist/useQuery.js +205 -64
  149. package/dist/useSumBy.d.ts.map +1 -1
  150. package/dist/useSumBy.js +294 -138
  151. package/dist/utils.js +62 -30
  152. package/package.json +9 -9
  153. package/src/GraphTooltipArrow/index.tsx +3 -0
  154. package/src/MatchersInput/SuggestionsList.test.tsx +70 -0
  155. package/src/MatchersInput/SuggestionsList.tsx +11 -10
  156. package/src/MatchersInput/index.tsx +1 -1
  157. package/src/MetricsGraph/MetricsTooltip/index.tsx +22 -34
  158. package/src/PreSelectedMatchers/index.tsx +3 -0
  159. package/src/ProfileFlameGraph/FlameGraphArrow/TextWithEllipsis.tsx +3 -0
  160. package/src/ProfileFlameGraph/FlameGraphArrow/TooltipContext.tsx +3 -0
  161. package/src/ProfileFlameGraph/FlameGraphArrow/ZoomControls.tsx +3 -0
  162. package/src/ProfileFlameGraph/FlameGraphArrow/useBatchedRendering.ts +3 -0
  163. package/src/ProfileSelector/index.tsx +30 -7
  164. package/src/ProfileView/components/Toolbars/MultiLevelDropdown.tsx +3 -0
  165. package/src/ProfileView/components/VisualizationContainer/index.tsx +3 -0
  166. package/src/Table/hooks/useTableConfiguration.tsx +7 -13
  167. package/src/useDelayedLoader.ts +10 -10
  168. package/src/useSumBy.ts +12 -18
  169. package/dist/ProfileView/components/ProfileFilters/useProfileFiltersUrlState.test.js +0 -541
  170. package/dist/hooks/useQueryState.test.js +0 -984
@@ -1,3 +1,9 @@
1
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
2
+ 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."); }
3
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
4
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
1
7
  // Copyright 2022 The Parca Authors
2
8
  // Licensed under the Apache License, Version 2.0 (the "License");
3
9
  // you may not use this file except in compliance with the License.
@@ -10,56 +16,68 @@
10
16
  // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
17
  // See the License for the specific language governing permissions and
12
18
  // limitations under the License.
19
+
20
+ /* eslint-disable react-hooks/set-state-in-effect */
21
+
13
22
  import { useEffect, useRef, useState } from 'react';
14
23
  // useBatchedRendering - Helps in incrementally rendering items in batches to avoid UI blocking.
15
- export const useBatchedRendering = (items, options = {}) => {
16
- const { batchSize = 500, batchDelay = 0 } = options;
17
- const [renderedCount, setRenderedCount] = useState(0);
18
- const itemsRef = useRef(items);
19
- const rafRef = useRef(null);
20
- const timeoutRef = useRef(null);
21
- useEffect(() => {
22
- if (itemsRef.current !== items) {
23
- itemsRef.current = items;
24
- setRenderedCount(prev => {
25
- if (items.length === 0)
26
- return 0;
27
- // If new items were added (scrolling down), keep current progress
28
- if (items.length > prev)
29
- return prev;
30
- // If items reduced, cap to new length
31
- return Math.min(prev, items.length);
32
- });
33
- }
34
- }, [items]);
35
- // Progressively render more items
36
- useEffect(() => {
37
- if (renderedCount === items.length) {
38
- return;
39
- }
40
- const scheduleNextBatch = () => {
41
- const incrementState = () => {
42
- setRenderedCount(prev => Math.min(prev + batchSize, items.length));
43
- };
44
- if (batchDelay > 0) {
45
- timeoutRef.current = setTimeout(incrementState, batchDelay);
46
- }
47
- else {
48
- rafRef.current = requestAnimationFrame(incrementState);
49
- }
50
- };
51
- scheduleNextBatch();
52
- return () => {
53
- if (rafRef.current !== null) {
54
- cancelAnimationFrame(rafRef.current);
55
- }
56
- if (timeoutRef.current !== null) {
57
- clearTimeout(timeoutRef.current);
58
- }
59
- };
60
- }, [renderedCount, items.length, batchSize, batchDelay]);
61
- return {
62
- items: items.slice(0, renderedCount),
63
- isComplete: renderedCount === items.length,
24
+ export var useBatchedRendering = function useBatchedRendering(items) {
25
+ 'use no memo';
26
+
27
+ var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
28
+ var _options$batchSize = options.batchSize,
29
+ batchSize = _options$batchSize === void 0 ? 500 : _options$batchSize,
30
+ _options$batchDelay = options.batchDelay,
31
+ batchDelay = _options$batchDelay === void 0 ? 0 : _options$batchDelay;
32
+ var _useState = useState(0),
33
+ _useState2 = _slicedToArray(_useState, 2),
34
+ renderedCount = _useState2[0],
35
+ setRenderedCount = _useState2[1];
36
+ var itemsRef = useRef(items);
37
+ var rafRef = useRef(null);
38
+ var timeoutRef = useRef(null);
39
+ useEffect(function () {
40
+ if (itemsRef.current !== items) {
41
+ itemsRef.current = items;
42
+ setRenderedCount(function (prev) {
43
+ if (items.length === 0) return 0;
44
+ // If new items were added (scrolling down), keep current progress
45
+ if (items.length > prev) return prev;
46
+ // If items reduced, cap to new length
47
+ return Math.min(prev, items.length);
48
+ });
49
+ }
50
+ }, [items]);
51
+
52
+ // Progressively render more items
53
+ useEffect(function () {
54
+ if (renderedCount === items.length) {
55
+ return;
56
+ }
57
+ var scheduleNextBatch = function scheduleNextBatch() {
58
+ var incrementState = function incrementState() {
59
+ setRenderedCount(function (prev_0) {
60
+ return Math.min(prev_0 + batchSize, items.length);
61
+ });
62
+ };
63
+ if (batchDelay > 0) {
64
+ timeoutRef.current = setTimeout(incrementState, batchDelay);
65
+ } else {
66
+ rafRef.current = requestAnimationFrame(incrementState);
67
+ }
64
68
  };
65
- };
69
+ scheduleNextBatch();
70
+ return function () {
71
+ if (rafRef.current !== null) {
72
+ cancelAnimationFrame(rafRef.current);
73
+ }
74
+ if (timeoutRef.current !== null) {
75
+ clearTimeout(timeoutRef.current);
76
+ }
77
+ };
78
+ }, [renderedCount, items.length, batchSize, batchDelay]);
79
+ return {
80
+ items: items.slice(0, renderedCount),
81
+ isComplete: renderedCount === items.length
82
+ };
83
+ };
@@ -1,3 +1,4 @@
1
+ import { c as _c } from "react-compiler-runtime";
1
2
  // Copyright 2022 The Parca Authors
2
3
  // Licensed under the Apache License, Version 2.0 (the "License");
3
4
  // you may not use this file except in compliance with the License.
@@ -10,49 +11,72 @@
10
11
  // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
12
  // See the License for the specific language governing permissions and
12
13
  // limitations under the License.
14
+
13
15
  import { useMemo } from 'react';
14
16
  import { getLastItem } from '@parca/utilities';
15
17
  import { FIELD_FUNCTION_FILE_NAME } from './index';
16
18
  import { arrowToString } from './utils';
17
- const useMappingList = (mappings) => {
18
- const mappingsList = useMemo(() => {
19
- if (mappings === undefined) {
20
- return [];
21
- }
22
- const list = mappings
23
- ?.map(mapping => {
24
- return getLastItem(mapping);
25
- })
26
- .flat() ?? [];
27
- // We add a EVERYTHING ELSE mapping to the list.
28
- list.push('');
29
- // We sort the mappings alphabetically to make sure that the order is always the same.
30
- list.sort((a, b) => a.localeCompare(b));
31
- return list;
32
- }, [mappings]);
33
- return mappingsList;
34
- };
35
- export const useFilenamesList = (table) => {
36
- if (table === null) {
37
- return [];
38
- }
39
- const filenamesColumn = table.getChild(FIELD_FUNCTION_FILE_NAME);
40
- if (filenamesColumn === null) {
41
- return [];
19
+ var useMappingList = function useMappingList(mappings) {
20
+ var $ = _c(3);
21
+ var t0;
22
+ bb0: {
23
+ if (mappings === undefined) {
24
+ var t1;
25
+ if ($[0] === Symbol["for"]("react.memo_cache_sentinel")) {
26
+ t1 = [];
27
+ $[0] = t1;
28
+ } else {
29
+ t1 = $[0];
30
+ }
31
+ t0 = t1;
32
+ break bb0;
42
33
  }
43
- // Access dictionary directly instead of iterating all rows
44
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
45
- const dictionary = filenamesColumn.data[0]?.dictionary;
46
- if (dictionary == null) {
47
- return [''];
34
+ var list;
35
+ if ($[1] !== mappings) {
36
+ var _mappings$map$flat;
37
+ list = (_mappings$map$flat = mappings === null || mappings === void 0 ? void 0 : mappings.map(_temp).flat()) !== null && _mappings$map$flat !== void 0 ? _mappings$map$flat : [];
38
+ list.push("");
39
+ list.sort(_temp2);
40
+ $[1] = mappings;
41
+ $[2] = list;
42
+ } else {
43
+ list = $[2];
48
44
  }
49
- const filenames = Array.from(dictionary.toArray())
50
- .map(value => {
51
- const fn = arrowToString(value);
52
- return fn != null ? getLastItem(fn) ?? '' : '';
53
- })
54
- .concat('') // Add empty string for "Everything else"
55
- .sort((a, b) => a.localeCompare(b));
56
- return filenames;
45
+ t0 = list;
46
+ }
47
+ var mappingsList = t0;
48
+ return mappingsList;
49
+ };
50
+ export var useFilenamesList = function useFilenamesList(table) {
51
+ var _filenamesColumn$data;
52
+ if (table === null) {
53
+ return [];
54
+ }
55
+ var filenamesColumn = table.getChild(FIELD_FUNCTION_FILE_NAME);
56
+ if (filenamesColumn === null) {
57
+ return [];
58
+ }
59
+
60
+ // Access dictionary directly instead of iterating all rows
61
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
62
+ var dictionary = (_filenamesColumn$data = filenamesColumn.data[0]) === null || _filenamesColumn$data === void 0 ? void 0 : _filenamesColumn$data.dictionary;
63
+ if (dictionary == null) {
64
+ return [''];
65
+ }
66
+ var filenames = Array.from(dictionary.toArray()).map(function (value) {
67
+ var _getLastItem;
68
+ var fn = arrowToString(value);
69
+ return fn != null ? (_getLastItem = getLastItem(fn)) !== null && _getLastItem !== void 0 ? _getLastItem : '' : '';
70
+ }).concat('') // Add empty string for "Everything else"
71
+ .sort(function (a, b) {
72
+ return a.localeCompare(b);
73
+ });
74
+ return filenames;
57
75
  };
58
76
  export default useMappingList;
77
+ function _temp(mapping) {
78
+ return getLastItem(mapping);
79
+ }
80
+ function _temp2(a, b) {
81
+ return a.localeCompare(b);
82
+ }
@@ -10,12 +10,20 @@
10
10
  // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
11
  // See the License for the specific language governing permissions and
12
12
  // limitations under the License.
13
+
13
14
  import { EVERYTHING_ELSE } from '@parca/store';
14
15
  import { diffColor, getLastItem } from '@parca/utilities';
15
- const useNodeColor = ({ isDarkMode, compareMode, cumulative, diff, colorsMap, colorAttribute, }) => {
16
- if (compareMode) {
17
- return diffColor(diff ?? 0n, cumulative, isDarkMode);
18
- }
19
- return colorsMap[getLastItem(colorAttribute ?? '') ?? EVERYTHING_ELSE];
16
+ var useNodeColor = function useNodeColor(_ref) {
17
+ var _getLastItem;
18
+ var isDarkMode = _ref.isDarkMode,
19
+ compareMode = _ref.compareMode,
20
+ cumulative = _ref.cumulative,
21
+ diff = _ref.diff,
22
+ colorsMap = _ref.colorsMap,
23
+ colorAttribute = _ref.colorAttribute;
24
+ if (compareMode) {
25
+ return diffColor(diff !== null && diff !== void 0 ? diff : 0n, cumulative, isDarkMode);
26
+ }
27
+ return colorsMap[(_getLastItem = getLastItem(colorAttribute !== null && colorAttribute !== void 0 ? colorAttribute : '')) !== null && _getLastItem !== void 0 ? _getLastItem : EVERYTHING_ELSE];
20
28
  };
21
- export default useNodeColor;
29
+ export default useNodeColor;
@@ -1,3 +1,10 @@
1
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
2
+ 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."); }
3
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
4
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
7
+ import { c as _c } from "react-compiler-runtime";
1
8
  // Copyright 2022 The Parca Authors
2
9
  // Licensed under the Apache License, Version 2.0 (the "License");
3
10
  // you may not use this file except in compliance with the License.
@@ -10,91 +17,126 @@
10
17
  // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
18
  // See the License for the specific language governing permissions and
12
19
  // limitations under the License.
20
+
13
21
  import { useCallback, useEffect, useRef, useState } from 'react';
14
22
  // Find the scrollable ancestor (the element with overflow: auto/scroll)
15
- const findScrollableParent = (element) => {
16
- if (element === null)
17
- return undefined;
18
- let current = element.parentElement;
19
- while (current !== null) {
20
- const style = window.getComputedStyle(current);
21
- const overflowY = style.overflowY;
22
- if (overflowY === 'auto' || overflowY === 'scroll') {
23
- return current;
24
- }
25
- current = current.parentElement;
23
+ var findScrollableParent = function findScrollableParent(element) {
24
+ if (element === null) return undefined;
25
+ var current = element.parentElement;
26
+ while (current !== null) {
27
+ var style = window.getComputedStyle(current);
28
+ var overflowY = style.overflowY;
29
+ if (overflowY === 'auto' || overflowY === 'scroll') {
30
+ return current;
26
31
  }
27
- return undefined;
32
+ current = current.parentElement;
33
+ }
34
+ return undefined;
28
35
  };
29
- export const useScrollViewport = (containerRef) => {
30
- const [viewport, setViewport] = useState({
31
- scrollTop: 0,
32
- scrollLeft: 0,
33
- containerHeight: 0,
34
- containerWidth: 0,
35
- });
36
- const throttleRef = useRef(null);
37
- const updateViewport = useCallback(() => {
38
- if (containerRef.current !== null) {
39
- const container = containerRef.current;
40
- const rect = container.getBoundingClientRect();
41
- // Restrict container height to the visible portion on screen
42
- // This handles cases where the container is partially off-screen
43
- // We only want to consider the visible part for culling calculations
44
- const containerTop = rect.top;
45
- const containerBottom = rect.bottom;
46
- const viewportTop = 0;
47
- const viewportBottom = window.innerHeight;
48
- const visibleTop = Math.max(containerTop, viewportTop);
49
- const visibleBottom = Math.min(containerBottom, viewportBottom);
50
- const visibleHeight = Math.max(0, visibleBottom - visibleTop);
51
- const scrollOffset = Math.max(0, viewportTop - containerTop);
52
- const newViewport = {
53
- scrollTop: scrollOffset,
54
- scrollLeft: container.scrollLeft,
55
- containerHeight: visibleHeight, // Only the visible portion
56
- containerWidth: container.clientWidth,
57
- };
58
- setViewport(newViewport);
59
- }
60
- }, [containerRef]);
61
- // Throttling Strategy:
62
- // Use requestAnimationFrame to throttle scroll events to 60fps max
63
- // This ensures smooth performance while preventing excessive re-renders
64
- const throttledUpdateViewport = useCallback(() => {
36
+ export var useScrollViewport = function useScrollViewport(containerRef) {
37
+ var $ = _c(10);
38
+ var t0;
39
+ if ($[0] === Symbol["for"]("react.memo_cache_sentinel")) {
40
+ t0 = {
41
+ scrollTop: 0,
42
+ scrollLeft: 0,
43
+ containerHeight: 0,
44
+ containerWidth: 0
45
+ };
46
+ $[0] = t0;
47
+ } else {
48
+ t0 = $[0];
49
+ }
50
+ var _useState = useState(t0),
51
+ _useState2 = _slicedToArray(_useState, 2),
52
+ viewport = _useState2[0],
53
+ setViewport = _useState2[1];
54
+ var throttleRef = useRef(null);
55
+ var t1;
56
+ if ($[1] !== containerRef) {
57
+ t1 = function t1() {
58
+ if (containerRef.current !== null) {
59
+ var container = containerRef.current;
60
+ var rect = container.getBoundingClientRect();
61
+ var containerTop = rect.top;
62
+ var containerBottom = rect.bottom;
63
+ var viewportBottom = window.innerHeight;
64
+ var visibleTop = Math.max(containerTop, 0);
65
+ var visibleBottom = Math.min(containerBottom, viewportBottom);
66
+ var visibleHeight = Math.max(0, visibleBottom - visibleTop);
67
+ var scrollOffset = Math.max(0, 0 - containerTop);
68
+ var newViewport = {
69
+ scrollTop: scrollOffset,
70
+ scrollLeft: container.scrollLeft,
71
+ containerHeight: visibleHeight,
72
+ containerWidth: container.clientWidth
73
+ };
74
+ setViewport(newViewport);
75
+ }
76
+ };
77
+ $[1] = containerRef;
78
+ $[2] = t1;
79
+ } else {
80
+ t1 = $[2];
81
+ }
82
+ var updateViewport = t1;
83
+ var t2;
84
+ if ($[3] !== updateViewport) {
85
+ t2 = function t2() {
86
+ if (throttleRef.current !== null) {
87
+ cancelAnimationFrame(throttleRef.current);
88
+ }
89
+ throttleRef.current = requestAnimationFrame(updateViewport);
90
+ };
91
+ $[3] = updateViewport;
92
+ $[4] = t2;
93
+ } else {
94
+ t2 = $[4];
95
+ }
96
+ var throttledUpdateViewport = t2;
97
+ var t3;
98
+ var t4;
99
+ if ($[5] !== containerRef || $[6] !== throttledUpdateViewport || $[7] !== updateViewport) {
100
+ t3 = function t3() {
101
+ var container_0 = containerRef.current;
102
+ if (container_0 === null) {
103
+ return;
104
+ }
105
+ var scrollableParent = findScrollableParent(container_0);
106
+ var resizeObserver = new ResizeObserver(function () {
107
+ throttledUpdateViewport();
108
+ });
109
+ scrollableParent === null || scrollableParent === void 0 || scrollableParent.addEventListener("scroll", throttledUpdateViewport, {
110
+ passive: true
111
+ });
112
+ container_0.addEventListener("scroll", throttledUpdateViewport, {
113
+ passive: true
114
+ });
115
+ window.addEventListener("scroll", throttledUpdateViewport, {
116
+ passive: true
117
+ });
118
+ resizeObserver.observe(container_0);
119
+ updateViewport();
120
+ return function () {
121
+ scrollableParent === null || scrollableParent === void 0 || scrollableParent.removeEventListener("scroll", throttledUpdateViewport);
122
+ container_0.removeEventListener("scroll", throttledUpdateViewport);
123
+ window.removeEventListener("scroll", throttledUpdateViewport);
124
+ resizeObserver.disconnect();
65
125
  if (throttleRef.current !== null) {
66
- cancelAnimationFrame(throttleRef.current);
126
+ cancelAnimationFrame(throttleRef.current);
67
127
  }
68
- throttleRef.current = requestAnimationFrame(updateViewport);
69
- }, [updateViewport]);
70
- useEffect(() => {
71
- const container = containerRef.current;
72
- if (container === null)
73
- return;
74
- const scrollableParent = findScrollableParent(container);
75
- // ResizeObserver Strategy:
76
- // Monitor container size changes (window resize, layout shifts)
77
- // to update viewport dimensions for accurate culling calculations
78
- const resizeObserver = new ResizeObserver(() => {
79
- throttledUpdateViewport();
80
- });
81
- // Listen to scroll on the actual scrollable parent
82
- scrollableParent?.addEventListener('scroll', throttledUpdateViewport, { passive: true });
83
- container.addEventListener('scroll', throttledUpdateViewport, { passive: true });
84
- window.addEventListener('scroll', throttledUpdateViewport, { passive: true });
85
- resizeObserver.observe(container);
86
- // Initialize viewport state on mount
87
- updateViewport();
88
- return () => {
89
- // Cleanup: Remove event listeners and cancel pending animations
90
- scrollableParent?.removeEventListener('scroll', throttledUpdateViewport);
91
- container.removeEventListener('scroll', throttledUpdateViewport);
92
- window.removeEventListener('scroll', throttledUpdateViewport);
93
- resizeObserver.disconnect();
94
- if (throttleRef.current !== null) {
95
- cancelAnimationFrame(throttleRef.current);
96
- }
97
- };
98
- }, [containerRef, throttledUpdateViewport, updateViewport]);
99
- return viewport;
100
- };
128
+ };
129
+ };
130
+ t4 = [containerRef, throttledUpdateViewport, updateViewport];
131
+ $[5] = containerRef;
132
+ $[6] = throttledUpdateViewport;
133
+ $[7] = updateViewport;
134
+ $[8] = t3;
135
+ $[9] = t4;
136
+ } else {
137
+ t3 = $[8];
138
+ t4 = $[9];
139
+ }
140
+ useEffect(t3, t4);
141
+ return viewport;
142
+ };