@parca/profile 0.19.140 → 0.19.143

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 (182) hide show
  1. package/CHANGELOG.md +9 -1
  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 +94 -68
  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.d.ts.map +1 -1
  28. package/dist/ProfileExplorer/ProfileExplorerCompare.js +240 -45
  29. package/dist/ProfileExplorer/ProfileExplorerSingle.js +98 -11
  30. package/dist/ProfileExplorer/index.js +183 -32
  31. package/dist/ProfileFlameChart/SamplesStrips/SamplesGraph/index.js +333 -148
  32. package/dist/ProfileFlameChart/SamplesStrips/SamplesStrips.stories.js +69 -35
  33. package/dist/ProfileFlameChart/SamplesStrips/index.js +645 -134
  34. package/dist/ProfileFlameChart/SamplesStrips/labelSetUtils.js +114 -55
  35. package/dist/ProfileFlameChart/index.js +260 -126
  36. package/dist/ProfileFlameGraph/FlameGraphArrow/ContextMenu.js +283 -85
  37. package/dist/ProfileFlameGraph/FlameGraphArrow/ContextMenuWrapper.js +56 -20
  38. package/dist/ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.js +211 -140
  39. package/dist/ProfileFlameGraph/FlameGraphArrow/MemoizedTooltip.js +133 -38
  40. package/dist/ProfileFlameGraph/FlameGraphArrow/MiniMap.js +261 -216
  41. package/dist/ProfileFlameGraph/FlameGraphArrow/TextWithEllipsis.d.ts.map +1 -1
  42. package/dist/ProfileFlameGraph/FlameGraphArrow/TextWithEllipsis.js +71 -45
  43. package/dist/ProfileFlameGraph/FlameGraphArrow/TooltipContext.d.ts.map +1 -1
  44. package/dist/ProfileFlameGraph/FlameGraphArrow/TooltipContext.js +58 -28
  45. package/dist/ProfileFlameGraph/FlameGraphArrow/ZoomControls.d.ts.map +1 -1
  46. package/dist/ProfileFlameGraph/FlameGraphArrow/ZoomControls.js +59 -8
  47. package/dist/ProfileFlameGraph/FlameGraphArrow/index.js +396 -179
  48. package/dist/ProfileFlameGraph/FlameGraphArrow/useBatchedRendering.d.ts.map +1 -1
  49. package/dist/ProfileFlameGraph/FlameGraphArrow/useBatchedRendering.js +68 -50
  50. package/dist/ProfileFlameGraph/FlameGraphArrow/useMappingList.js +62 -38
  51. package/dist/ProfileFlameGraph/FlameGraphArrow/useNodeColor.js +14 -6
  52. package/dist/ProfileFlameGraph/FlameGraphArrow/useScrollViewport.js +124 -82
  53. package/dist/ProfileFlameGraph/FlameGraphArrow/useVisibleNodes.js +160 -98
  54. package/dist/ProfileFlameGraph/FlameGraphArrow/useZoom.js +232 -112
  55. package/dist/ProfileFlameGraph/FlameGraphArrow/utils.js +137 -114
  56. package/dist/ProfileFlameGraph/benchmarks/benchdata/populateData.js +85 -0
  57. package/dist/ProfileFlameGraph/index.js +322 -147
  58. package/dist/ProfileMetricsGraph/hooks/useQueryRange.js +140 -32
  59. package/dist/ProfileMetricsGraph/index.js +515 -256
  60. package/dist/ProfileSelector/CompareButton.js +132 -12
  61. package/dist/ProfileSelector/MetricsGraphSection.js +228 -63
  62. package/dist/ProfileSelector/index.d.ts +1 -1
  63. package/dist/ProfileSelector/index.d.ts.map +1 -1
  64. package/dist/ProfileSelector/index.js +734 -142
  65. package/dist/ProfileSelector/useAutoQuerySelector.d.ts +1 -3
  66. package/dist/ProfileSelector/useAutoQuerySelector.d.ts.map +1 -1
  67. package/dist/ProfileSelector/useAutoQuerySelector.js +280 -132
  68. package/dist/ProfileSource.js +230 -163
  69. package/dist/ProfileTypeSelector/index.js +214 -125
  70. package/dist/ProfileView/components/ActionButtons/GroupByDropdown.js +50 -4
  71. package/dist/ProfileView/components/ActionButtons/SortByDropdown.js +137 -32
  72. package/dist/ProfileView/components/ColorStackLegend.js +182 -54
  73. package/dist/ProfileView/components/DashboardItems/index.js +87 -28
  74. package/dist/ProfileView/components/DashboardLayout/index.js +108 -16
  75. package/dist/ProfileView/components/DiffLegend.js +172 -29
  76. package/dist/ProfileView/components/GroupByLabelsDropdown/index.js +199 -55
  77. package/dist/ProfileView/components/InvertCallStack/index.js +97 -9
  78. package/dist/ProfileView/components/ProfileFilters/filterPresets.js +260 -315
  79. package/dist/ProfileView/components/ProfileFilters/index.js +518 -215
  80. package/dist/ProfileView/components/ProfileFilters/useProfileFilters.js +370 -306
  81. package/dist/ProfileView/components/ProfileFilters/useProfileFiltersUrlState.js +191 -118
  82. package/dist/ProfileView/components/ProfileHeader/index.js +105 -11
  83. package/dist/ProfileView/components/ShareButton/ResultBox.js +119 -16
  84. package/dist/ProfileView/components/ShareButton/index.js +352 -62
  85. package/dist/ProfileView/components/Toolbars/MultiLevelDropdown.d.ts.map +1 -1
  86. package/dist/ProfileView/components/Toolbars/MultiLevelDropdown.js +664 -192
  87. package/dist/ProfileView/components/Toolbars/SwitchMenuItem.js +94 -7
  88. package/dist/ProfileView/components/Toolbars/TableColumnsDropdown.js +196 -155
  89. package/dist/ProfileView/components/Toolbars/index.js +441 -21
  90. package/dist/ProfileView/components/ViewSelector/Dropdown.js +233 -22
  91. package/dist/ProfileView/components/ViewSelector/index.js +186 -82
  92. package/dist/ProfileView/components/VisualizationContainer/index.d.ts.map +1 -1
  93. package/dist/ProfileView/components/VisualizationContainer/index.js +52 -7
  94. package/dist/ProfileView/components/VisualizationPanel.js +185 -8
  95. package/dist/ProfileView/context/DashboardContext.js +74 -26
  96. package/dist/ProfileView/context/ProfileViewContext.js +56 -15
  97. package/dist/ProfileView/hooks/useAutoSelectDimension.js +71 -41
  98. package/dist/ProfileView/hooks/useProfileMetadata.js +50 -18
  99. package/dist/ProfileView/hooks/useResetFlameGraphState.js +31 -10
  100. package/dist/ProfileView/hooks/useResetStateOnProfileTypeChange.js +71 -27
  101. package/dist/ProfileView/hooks/useResetStateOnSeriesChange.js +53 -17
  102. package/dist/ProfileView/hooks/useVisualizationState.js +229 -69
  103. package/dist/ProfileView/index.js +383 -45
  104. package/dist/ProfileView/types/visualization.js +1 -13
  105. package/dist/ProfileView/utils/colorUtils.js +8 -7
  106. package/dist/ProfileViewWithData.js +319 -225
  107. package/dist/QueryControls/index.js +418 -47
  108. package/dist/Sandwich/components/CalleesSection.js +54 -4
  109. package/dist/Sandwich/components/CallersSection.js +97 -27
  110. package/dist/Sandwich/components/TableSection.js +77 -4
  111. package/dist/Sandwich/index.js +125 -12
  112. package/dist/Sandwich/utils/processRowData.js +48 -39
  113. package/dist/SelectWithRefresh/index.js +102 -28
  114. package/dist/SimpleMatchers/Select.js +520 -187
  115. package/dist/SimpleMatchers/index.js +590 -288
  116. package/dist/SourceView/Highlighter.js +230 -70
  117. package/dist/SourceView/LineNo.js +72 -17
  118. package/dist/SourceView/index.js +177 -101
  119. package/dist/SourceView/lang-detector/ext-to-lang.json +798 -798
  120. package/dist/SourceView/lang-detector/index.js +28 -14
  121. package/dist/SourceView/useSelectedLineRange.js +72 -20
  122. package/dist/Table/ColorCell.js +42 -1
  123. package/dist/Table/ColumnsVisibility.js +114 -6
  124. package/dist/Table/MoreDropdown.js +107 -21
  125. package/dist/Table/TableContextMenu.js +144 -134
  126. package/dist/Table/TableContextMenuWrapper.js +59 -14
  127. package/dist/Table/hooks/useColorManagement.js +58 -16
  128. package/dist/Table/hooks/useTableConfiguration.d.ts.map +1 -1
  129. package/dist/Table/hooks/useTableConfiguration.js +323 -167
  130. package/dist/Table/index.js +217 -123
  131. package/dist/Table/utils/functions.js +169 -144
  132. package/dist/Table/utils/topAndBottomExpandedRowModel.js +69 -52
  133. package/dist/TimelineGuide/index.js +209 -16
  134. package/dist/TopTable/benchmarks/benchdata/populateData.js +91 -0
  135. package/dist/TopTable/index.js +325 -121
  136. package/dist/contexts/LabelsQueryProvider.js +94 -32
  137. package/dist/contexts/UnifiedLabelsContext.js +114 -49
  138. package/dist/contexts/utils.js +37 -15
  139. package/dist/hooks/urlParsers.js +27 -15
  140. package/dist/hooks/useColorBy.js +47 -10
  141. package/dist/hooks/useCompareModeMeta.js +112 -62
  142. package/dist/hooks/useDashboardItems.js +52 -11
  143. package/dist/hooks/useLabels.js +295 -52
  144. package/dist/hooks/useQueryState.d.ts +1 -1
  145. package/dist/hooks/useQueryState.d.ts.map +1 -1
  146. package/dist/hooks/useQueryState.js +375 -329
  147. package/dist/index.js +11 -6
  148. package/dist/testdata/fg-diff.json +3750 -0
  149. package/dist/testdata/fg-simple.json +1879 -0
  150. package/dist/testdata/link_data.json +56 -0
  151. package/dist/testdata/tabular.json +30 -0
  152. package/dist/testdata/test_flamegraph.json +26846 -0
  153. package/dist/testdata/test_graph.json +53 -0
  154. package/dist/useDelayedLoader.js +32 -18
  155. package/dist/useGrpcQuery/index.js +71 -11
  156. package/dist/useHasProfileData.js +90 -12
  157. package/dist/useQuery.js +205 -64
  158. package/dist/useSumBy.d.ts.map +1 -1
  159. package/dist/useSumBy.js +294 -138
  160. package/dist/utils.js +62 -30
  161. package/package.json +9 -9
  162. package/src/GraphTooltipArrow/index.tsx +3 -0
  163. package/src/MatchersInput/SuggestionsList.test.tsx +70 -0
  164. package/src/MatchersInput/SuggestionsList.tsx +11 -10
  165. package/src/MatchersInput/index.tsx +1 -1
  166. package/src/MetricsGraph/MetricsTooltip/index.tsx +22 -34
  167. package/src/PreSelectedMatchers/index.tsx +3 -0
  168. package/src/ProfileExplorer/ProfileExplorerCompare.tsx +9 -2
  169. package/src/ProfileFlameGraph/FlameGraphArrow/TextWithEllipsis.tsx +3 -0
  170. package/src/ProfileFlameGraph/FlameGraphArrow/TooltipContext.tsx +3 -0
  171. package/src/ProfileFlameGraph/FlameGraphArrow/ZoomControls.tsx +3 -0
  172. package/src/ProfileFlameGraph/FlameGraphArrow/useBatchedRendering.ts +3 -0
  173. package/src/ProfileSelector/index.tsx +31 -9
  174. package/src/ProfileSelector/useAutoQuerySelector.ts +64 -42
  175. package/src/ProfileView/components/Toolbars/MultiLevelDropdown.tsx +3 -0
  176. package/src/ProfileView/components/VisualizationContainer/index.tsx +3 -0
  177. package/src/Table/hooks/useTableConfiguration.tsx +7 -13
  178. package/src/hooks/useQueryState.ts +18 -3
  179. package/src/useDelayedLoader.ts +10 -10
  180. package/src/useSumBy.ts +12 -18
  181. package/dist/ProfileView/components/ProfileFilters/useProfileFiltersUrlState.test.js +0 -455
  182. package/dist/hooks/useQueryState.test.js +0 -868
@@ -1,4 +1,3 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
1
  // Copyright 2022 The Parca Authors
3
2
  // Licensed under the Apache License, Version 2.0 (the "License");
4
3
  // you may not use this file except in compliance with the License.
@@ -11,31 +10,62 @@ import { jsx as _jsx } from "react/jsx-runtime";
11
10
  // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
11
  // See the License for the specific language governing permissions and
13
12
  // limitations under the License.
14
- import { createContext, useCallback, useContext, useMemo, useRef } from 'react';
15
- const TooltipContext = createContext(null);
16
- export const useTooltipContext = () => {
17
- const context = useContext(TooltipContext);
18
- if (context === undefined || context === null) {
19
- throw new Error('useTooltipContext must be used within TooltipProvider');
20
- }
21
- return context;
22
- };
23
- export const TooltipProvider = ({ children, table, total, totalUnfiltered, profileType, unit, compareAbsolute, onTooltipUpdate, tooltipId = 'default', }) => {
24
- const tooltipStateRef = useRef({ row: null, x: 0, y: 0 });
25
- const updateTooltip = useCallback((row, x = 0, y = 0) => {
26
- tooltipStateRef.current = { row, x, y };
27
- onTooltipUpdate?.(tooltipStateRef.current);
28
- }, [onTooltipUpdate]);
29
- const value = useMemo(() => ({
30
- table,
31
- total,
32
- totalUnfiltered,
33
- profileType,
34
- unit,
35
- compareAbsolute,
36
- updateTooltip,
37
- tooltipState: tooltipStateRef.current,
38
- tooltipId,
39
- }), [table, total, totalUnfiltered, profileType, unit, compareAbsolute, updateTooltip, tooltipId]);
40
- return _jsx(TooltipContext.Provider, { value: value, children: children });
13
+
14
+ /* eslint-disable react-hooks/refs */
15
+
16
+ import React, { createContext, useCallback, useContext, useMemo, useRef } from 'react';
17
+ import { jsx as _jsx } from "react/jsx-runtime";
18
+ var TooltipContext = /*#__PURE__*/createContext(null);
19
+ export var useTooltipContext = function useTooltipContext() {
20
+ var context = useContext(TooltipContext);
21
+ if (context === undefined || context === null) {
22
+ throw new Error("useTooltipContext must be used within TooltipProvider");
23
+ }
24
+ return context;
41
25
  };
26
+ export var TooltipProvider = function TooltipProvider(_ref) {
27
+ 'use no memo';
28
+
29
+ var children = _ref.children,
30
+ table = _ref.table,
31
+ total = _ref.total,
32
+ totalUnfiltered = _ref.totalUnfiltered,
33
+ profileType = _ref.profileType,
34
+ unit = _ref.unit,
35
+ compareAbsolute = _ref.compareAbsolute,
36
+ onTooltipUpdate = _ref.onTooltipUpdate,
37
+ _ref$tooltipId = _ref.tooltipId,
38
+ tooltipId = _ref$tooltipId === void 0 ? 'default' : _ref$tooltipId;
39
+ var tooltipStateRef = useRef({
40
+ row: null,
41
+ x: 0,
42
+ y: 0
43
+ });
44
+ var updateTooltip = useCallback(function (row) {
45
+ var x = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
46
+ var y = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
47
+ tooltipStateRef.current = {
48
+ row: row,
49
+ x: x,
50
+ y: y
51
+ };
52
+ onTooltipUpdate === null || onTooltipUpdate === void 0 || onTooltipUpdate(tooltipStateRef.current);
53
+ }, [onTooltipUpdate]);
54
+ var value = useMemo(function () {
55
+ return {
56
+ table: table,
57
+ total: total,
58
+ totalUnfiltered: totalUnfiltered,
59
+ profileType: profileType,
60
+ unit: unit,
61
+ compareAbsolute: compareAbsolute,
62
+ updateTooltip: updateTooltip,
63
+ tooltipState: tooltipStateRef.current,
64
+ tooltipId: tooltipId
65
+ };
66
+ }, [table, total, totalUnfiltered, profileType, unit, compareAbsolute, updateTooltip, tooltipId]);
67
+ return /*#__PURE__*/_jsx(TooltipContext.Provider, {
68
+ value: value,
69
+ children: children
70
+ });
71
+ };
@@ -1 +1 @@
1
- {"version":3,"file":"ZoomControls.d.ts","sourceRoot":"","sources":["../../../src/ProfileFlameGraph/FlameGraphArrow/ZoomControls.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,UAAU,iBAAiB;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CACpD;AAED,eAAO,MAAM,YAAY,GAAI,uDAM1B,iBAAiB,KAAG,KAAK,CAAC,GAAG,CAAC,OAkChC,CAAC"}
1
+ {"version":3,"file":"ZoomControls.d.ts","sourceRoot":"","sources":["../../../src/ProfileFlameGraph/FlameGraphArrow/ZoomControls.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,UAAU,iBAAiB;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CACpD;AAED,eAAO,MAAM,YAAY,GAAI,uDAM1B,iBAAiB,KAAG,KAAK,CAAC,GAAG,CAAC,OAmChC,CAAC"}
@@ -1,11 +1,62 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
1
+ // Copyright 2022 The Parca Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+
14
+ /* eslint-disable react-hooks/refs */
15
+
16
+ import React from 'react';
2
17
  import { Icon } from '@iconify/react';
3
18
  import { createPortal } from 'react-dom';
4
19
  import { MAX_ZOOM } from './useZoom';
5
- export const ZoomControls = ({ zoomLevel, zoomIn, zoomOut, resetZoom, portalRef, }) => {
6
- const controls = (_jsxs("div", { className: "flex items-center gap-1 rounded-md border border-gray-200 bg-white/90 px-1 py-0.5 shadow-sm backdrop-blur-sm dark:border-gray-600 dark:bg-gray-800/90", children: [_jsx("button", { onClick: zoomOut, disabled: zoomLevel <= 1, className: "rounded p-1 text-gray-600 hover:bg-gray-100 disabled:opacity-30 dark:text-gray-300 dark:hover:bg-gray-700", title: "Zoom out", children: _jsx(Icon, { icon: "mdi:minus", width: 16, height: 16 }) }), _jsxs("button", { onClick: resetZoom, className: "min-w-[3rem] px-1 text-center text-xs text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-700 rounded", title: "Reset zoom", children: [Math.round(zoomLevel * 100), "%"] }), _jsx("button", { onClick: zoomIn, disabled: zoomLevel >= MAX_ZOOM, className: "rounded p-1 text-gray-600 hover:bg-gray-100 disabled:opacity-30 dark:text-gray-300 dark:hover:bg-gray-700", title: "Zoom in", children: _jsx(Icon, { icon: "mdi:plus", width: 16, height: 16 }) })] }));
7
- if (portalRef?.current != null) {
8
- return createPortal(controls, portalRef.current);
9
- }
10
- return controls;
11
- };
20
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
21
+ export var ZoomControls = function ZoomControls(_ref) {
22
+ 'use no memo';
23
+
24
+ var zoomLevel = _ref.zoomLevel,
25
+ zoomIn = _ref.zoomIn,
26
+ zoomOut = _ref.zoomOut,
27
+ resetZoom = _ref.resetZoom,
28
+ portalRef = _ref.portalRef;
29
+ var controls = /*#__PURE__*/_jsxs("div", {
30
+ className: "flex items-center gap-1 rounded-md border border-gray-200 bg-white/90 px-1 py-0.5 shadow-sm backdrop-blur-sm dark:border-gray-600 dark:bg-gray-800/90",
31
+ children: [/*#__PURE__*/_jsx("button", {
32
+ onClick: zoomOut,
33
+ disabled: zoomLevel <= 1,
34
+ className: "rounded p-1 text-gray-600 hover:bg-gray-100 disabled:opacity-30 dark:text-gray-300 dark:hover:bg-gray-700",
35
+ title: "Zoom out",
36
+ children: /*#__PURE__*/_jsx(Icon, {
37
+ icon: "mdi:minus",
38
+ width: 16,
39
+ height: 16
40
+ })
41
+ }), /*#__PURE__*/_jsxs("button", {
42
+ onClick: resetZoom,
43
+ className: "min-w-[3rem] px-1 text-center text-xs text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-700 rounded",
44
+ title: "Reset zoom",
45
+ children: [Math.round(zoomLevel * 100), "%"]
46
+ }), /*#__PURE__*/_jsx("button", {
47
+ onClick: zoomIn,
48
+ disabled: zoomLevel >= MAX_ZOOM,
49
+ className: "rounded p-1 text-gray-600 hover:bg-gray-100 disabled:opacity-30 dark:text-gray-300 dark:hover:bg-gray-700",
50
+ title: "Zoom in",
51
+ children: /*#__PURE__*/_jsx(Icon, {
52
+ icon: "mdi:plus",
53
+ width: 16,
54
+ height: 16
55
+ })
56
+ })]
57
+ });
58
+ if ((portalRef === null || portalRef === void 0 ? void 0 : portalRef.current) != null) {
59
+ return /*#__PURE__*/createPortal(controls, portalRef.current);
60
+ }
61
+ return controls;
62
+ };