@parca/profile 0.19.140 → 0.19.142

package/dist/ProfileView/components/ViewSelector/Dropdown.js

@@ -1,4 +1,14 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } 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 _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+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."); }
+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; } }
+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; }
+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; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+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,35 +21,236 @@ import { Fragment as _Fragment, jsx as _jsx, 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 { Fragment, useState } from 'react';
 import { Listbox, Transition } from '@headlessui/react';
 import { Icon } from '@iconify/react';
 import cx from 'classnames';
 import { Button, useParcaContext } from '@parca/components';
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function contructItemsFromArray(items) {
-    return items.map(item => ({
-        key: item.key,
-        element: { active: _jsx(_Fragment, { children: item.label }), expanded: _jsx(_Fragment, { children: item.label }) },
-        innerAction: item.innerAction,
-    }));
+  return items.map(function (item) {
+    return {
+      key: item.key,
+      element: {
+        active: /*#__PURE__*/_jsx(_Fragment, {
+          children: item.label
+        }),
+        expanded: /*#__PURE__*/_jsx(_Fragment, {
+          children: item.label
+        })
+      },
+      innerAction: item.innerAction
+    };
+  });
 }
-const Dropdown = ({ items, selectedKey, onSelection, placeholder, width, className = '', loading, primary = false, disabled = false, icon, id, optionsClassName = '', }) => {
-    const selection = items.find(v => v.key === selectedKey) ?? {
-        key: selectedKey,
-        element: { active: _jsx(_Fragment, { children: selectedKey }), expanded: _jsx(_Fragment, { children: selectedKey }) },
+var Dropdown = function Dropdown(t0) {
+  var $ = _c(20);
+  var items = t0.items,
+    selectedKey = t0.selectedKey,
+    onSelection = t0.onSelection,
+    placeholder = t0.placeholder,
+    width = t0.width,
+    t1 = t0.className,
+    loading = t0.loading,
+    t2 = t0.primary,
+    t3 = t0.disabled,
+    icon = t0.icon,
+    id = t0.id,
+    t4 = t0.optionsClassName;
+  var className = t1 === undefined ? "" : t1;
+  var primary = t2 === undefined ? false : t2;
+  var disabled = t3 === undefined ? false : t3;
+  var optionsClassName = t4 === undefined ? "" : t4;
+  var t5;
+  if ($[0] !== items || $[1] !== selectedKey) {
+    var _items$find;
+    t5 = (_items$find = items.find(function (v) {
+      return v.key === selectedKey;
+    })) !== null && _items$find !== void 0 ? _items$find : {
+      key: selectedKey,
+      element: {
+        active: /*#__PURE__*/_jsx(_Fragment, {
+          children: selectedKey
+        }),
+        expanded: /*#__PURE__*/_jsx(_Fragment, {
+          children: selectedKey
+        })
+      }
     };
-    const { loader } = useParcaContext();
-    const styles = 'relative border rounded-md shadow-sm px-4 py-2 text-left cursor-default focus:outline-none focus:ring-1 items-center focus:ring-indigo-500 focus:border-indigo-500 text-sm flex gap-2 flex items-center justify-between';
-    const defaultStyles = 'bg-white dark:bg-gray-900 dark:border-gray-600';
-    const primaryStyles = 'text-gray-100 dark:gray-900 bg-indigo-600 border-indigo-500 font-medium py-2 px-4';
-    return (_jsx(Listbox, { value: selectedKey, onChange: onSelection, children: ({ open }) => (_jsxs("div", { className: "relative", children: [_jsx("div", { id: id, children: _jsxs(Listbox.Button, { className: cx(styles, width !== undefined ? `w-${width}` : 'w-full', disabled ? 'cursor-not-allowed opacity-50 pointer-events-none' : '', primary ? primaryStyles : defaultStyles, { [className]: className.length > 0 }), children: [_jsx("div", { className: cx(icon != null ? '' : 'block overflow-x-hidden text-ellipsis'), children: selection?.key !== '' ? selection.element.active : placeholder }), _jsx("div", { className: cx(icon != null ? '' : 'pointer-events-none text-gray-400'), children: icon ?? _jsx(Icon, { icon: "heroicons:chevron-up-down-20-solid", "aria-hidden": "true" }) })] }) }), _jsx(Transition, { show: open, as: Fragment, leave: "transition ease-in duration-100", leaveFrom: "opacity-100", leaveTo: "opacity-0", children: _jsx(Listbox.Options, { className: cx(optionsClassName, 'absolute w-[246px] right-0 z-50 mt-1 max-h-[50vh] overflow-auto rounded-md bg-gray-50 py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:border-gray-600 dark:bg-gray-900 dark:ring-white dark:ring-opacity-20 sm:text-sm'), children: loading === true ? (_jsx("div", { className: "w-[270px]", children: loader })) : (items.length > 0 &&
-                            items.map(option => _jsx(DropdownOption, { option: option }, option.key))) }) })] })) }));
+    $[0] = items;
+    $[1] = selectedKey;
+    $[2] = t5;
+  } else {
+    t5 = $[2];
+  }
+  var selection = t5;
+  var _useParcaContext = useParcaContext(),
+    loader = _useParcaContext.loader;
+  var t6;
+  if ($[3] !== className || $[4] !== disabled || $[5] !== icon || $[6] !== id || $[7] !== items || $[8] !== loader || $[9] !== loading || $[10] !== optionsClassName || $[11] !== placeholder || $[12] !== primary || $[13] !== selection || $[14] !== width) {
+    t6 = function t6(t7) {
+      var open = t7.open;
+      return /*#__PURE__*/_jsxs("div", {
+        className: "relative",
+        children: [/*#__PURE__*/_jsx("div", {
+          id: id,
+          children: /*#__PURE__*/_jsxs(Listbox.Button, {
+            className: cx("relative border rounded-md shadow-sm px-4 py-2 text-left cursor-default focus:outline-none focus:ring-1 items-center focus:ring-indigo-500 focus:border-indigo-500 text-sm flex gap-2 flex items-center justify-between", width !== undefined ? "w-".concat(width) : "w-full", disabled ? "cursor-not-allowed opacity-50 pointer-events-none" : "", primary ? "text-gray-100 dark:gray-900 bg-indigo-600 border-indigo-500 font-medium py-2 px-4" : "bg-white dark:bg-gray-900 dark:border-gray-600", _defineProperty({}, className, className.length > 0)),
+            children: [/*#__PURE__*/_jsx("div", {
+              className: cx(icon != null ? "" : "block overflow-x-hidden text-ellipsis"),
+              children: (selection === null || selection === void 0 ? void 0 : selection.key) !== "" ? selection.element.active : placeholder
+            }), /*#__PURE__*/_jsx("div", {
+              className: cx(icon != null ? "" : "pointer-events-none text-gray-400"),
+              children: icon !== null && icon !== void 0 ? icon : /*#__PURE__*/_jsx(Icon, {
+                icon: "heroicons:chevron-up-down-20-solid",
+                "aria-hidden": "true"
+              })
+            })]
+          })
+        }), /*#__PURE__*/_jsx(Transition, {
+          show: open,
+          as: Fragment,
+          leave: "transition ease-in duration-100",
+          leaveFrom: "opacity-100",
+          leaveTo: "opacity-0",
+          children: /*#__PURE__*/_jsx(Listbox.Options, {
+            className: cx(optionsClassName, "absolute w-[246px] right-0 z-50 mt-1 max-h-[50vh] overflow-auto rounded-md bg-gray-50 py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:border-gray-600 dark:bg-gray-900 dark:ring-white dark:ring-opacity-20 sm:text-sm"),
+            children: loading === true ? /*#__PURE__*/_jsx("div", {
+              className: "w-[270px]",
+              children: loader
+            }) : items.length > 0 && items.map(_temp)
+          })
+        })]
+      });
+    };
+    $[3] = className;
+    $[4] = disabled;
+    $[5] = icon;
+    $[6] = id;
+    $[7] = items;
+    $[8] = loader;
+    $[9] = loading;
+    $[10] = optionsClassName;
+    $[11] = placeholder;
+    $[12] = primary;
+    $[13] = selection;
+    $[14] = width;
+    $[15] = t6;
+  } else {
+    t6 = $[15];
+  }
+  var t7;
+  if ($[16] !== onSelection || $[17] !== selectedKey || $[18] !== t6) {
+    t7 = /*#__PURE__*/_jsx(Listbox, {
+      value: selectedKey,
+      onChange: onSelection,
+      children: t6
+    });
+    $[16] = onSelection;
+    $[17] = selectedKey;
+    $[18] = t6;
+    $[19] = t7;
+  } else {
+    t7 = $[19];
+  }
+  return t7;
 };
-const DropdownOption = ({ option }) => {
-    const [isMouseOver, setIsMouseOver] = useState(false);
-    return (_jsx(Listbox.Option, { id: option.id ?? `h-select-option-${option.key}`, disabled: option.disabled ?? false, className: ({ active }) => cx(active && 'bg-indigo-600 text-white', 'relative flex cursor-default select-none py-2 px-3'), value: option.key, children: ({ selected, active, disabled }) => (_jsxs("div", { className: "relative flex items-center w-full justify-between", onMouseEnter: () => setIsMouseOver(true), onMouseLeave: () => setIsMouseOver(false), children: [isMouseOver && disabled && option.disabledText != null ? (_jsxs("div", { className: "absolute top-[-60px] text-gray-500 dark:text-gray-400 text-xs bg-white dark:bg-black border rounded p-2 z-100 w-52 text-center", onMouseEnter: () => setIsMouseOver(false), children: [option.disabledText, _jsx("div", { className: "absolute left-1/2 -translate-x-1/2 top-full h-0 w-0 border-l-4 border-r-4 border-t-4 border-l-transparent border-r-transparent" })] })) : null, _jsx("div", { className: "flex items-center", children: _jsx("span", { className: cx(selected ? 'font-semibold' : 'font-normal', disabled && 'opacity-50'), children: option.element.expanded }) }), option.innerAction !== undefined && (_jsxs(Button, { variant: "neutral", className: "p-[6px]", onClick: e => {
-                        e.stopPropagation();
-                        option.innerAction?.onClick();
-                    }, disabled: option.innerAction?.isDisabled, children: [option.innerAction.text, option.innerAction.text === 'Add Panel' && (_jsx(Icon, { icon: "ic:baseline-plus", className: "w-[14px] h-[14px] ml-2" }))] })), selected ? (_jsx("span", { className: cx(active ? 'text-white' : 'text-indigo-600', 'absolute inset-y-0 right-0 flex items-center pr-4'), children: _jsx(Icon, { icon: "heroicons:check-20-solid", "aria-hidden": "true" }) })) : null] })) }, option.key));
+var DropdownOption = function DropdownOption(t0) {
+  var _option$id, _option$disabled;
+  var $ = _c(10);
+  var option = t0.option;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isMouseOver = _useState2[0],
+    setIsMouseOver = _useState2[1];
+  var t1 = (_option$id = option.id) !== null && _option$id !== void 0 ? _option$id : "h-select-option-".concat(option.key);
+  var t2 = (_option$disabled = option.disabled) !== null && _option$disabled !== void 0 ? _option$disabled : false;
+  var t3;
+  if ($[0] !== isMouseOver || $[1] !== option.disabledText || $[2] !== option.element.expanded || $[3] !== option.innerAction) {
+    t3 = function t3(t4) {
+      var _option$innerAction2;
+      var selected = t4.selected,
+        active_0 = t4.active,
+        disabled = t4.disabled;
+      return /*#__PURE__*/_jsxs("div", {
+        className: "relative flex items-center w-full justify-between",
+        onMouseEnter: function onMouseEnter() {
+          return setIsMouseOver(true);
+        },
+        onMouseLeave: function onMouseLeave() {
+          return setIsMouseOver(false);
+        },
+        children: [isMouseOver && disabled && option.disabledText != null ? /*#__PURE__*/_jsxs("div", {
+          className: "absolute top-[-60px] text-gray-500 dark:text-gray-400 text-xs bg-white dark:bg-black border rounded p-2 z-100 w-52 text-center",
+          onMouseEnter: function onMouseEnter() {
+            return setIsMouseOver(false);
+          },
+          children: [option.disabledText, /*#__PURE__*/_jsx("div", {
+            className: "absolute left-1/2 -translate-x-1/2 top-full h-0 w-0 border-l-4 border-r-4 border-t-4 border-l-transparent border-r-transparent"
+          })]
+        }) : null, /*#__PURE__*/_jsx("div", {
+          className: "flex items-center",
+          children: /*#__PURE__*/_jsx("span", {
+            className: cx(selected ? "font-semibold" : "font-normal", disabled && "opacity-50"),
+            children: option.element.expanded
+          })
+        }), option.innerAction !== undefined && /*#__PURE__*/_jsxs(Button, {
+          variant: "neutral",
+          className: "p-[6px]",
+          onClick: function onClick(e) {
+            var _option$innerAction;
+            e.stopPropagation();
+            (_option$innerAction = option.innerAction) === null || _option$innerAction === void 0 || _option$innerAction.onClick();
+          },
+          disabled: (_option$innerAction2 = option.innerAction) === null || _option$innerAction2 === void 0 ? void 0 : _option$innerAction2.isDisabled,
+          children: [option.innerAction.text, option.innerAction.text === "Add Panel" && /*#__PURE__*/_jsx(Icon, {
+            icon: "ic:baseline-plus",
+            className: "w-[14px] h-[14px] ml-2"
+          })]
+        }), selected ? /*#__PURE__*/_jsx("span", {
+          className: cx(active_0 ? "text-white" : "text-indigo-600", "absolute inset-y-0 right-0 flex items-center pr-4"),
+          children: /*#__PURE__*/_jsx(Icon, {
+            icon: "heroicons:check-20-solid",
+            "aria-hidden": "true"
+          })
+        }) : null]
+      });
+    };
+    $[0] = isMouseOver;
+    $[1] = option.disabledText;
+    $[2] = option.element.expanded;
+    $[3] = option.innerAction;
+    $[4] = t3;
+  } else {
+    t3 = $[4];
+  }
+  var t4;
+  if ($[5] !== option.key || $[6] !== t1 || $[7] !== t2 || $[8] !== t3) {
+    t4 = /*#__PURE__*/_jsx(Listbox.Option, {
+      id: t1,
+      disabled: t2,
+      className: _temp2,
+      value: option.key,
+      children: t3
+    }, option.key);
+    $[5] = option.key;
+    $[6] = t1;
+    $[7] = t2;
+    $[8] = t3;
+    $[9] = t4;
+  } else {
+    t4 = $[9];
+  }
+  return t4;
 };
 export default Dropdown;
+function _temp(option) {
+  return /*#__PURE__*/_jsx(DropdownOption, {
+    option: option
+  }, option.key);
+}
+function _temp2(t0) {
+  var active = t0.active;
+  return cx(active && "bg-indigo-600 text-white", "relative flex cursor-default select-none py-2 px-3");
+}

package/dist/ProfileView/components/ViewSelector/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ViewSelector/index.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAKrD,UAAU,KAAK;IACb,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,QAAA,MAAM,YAAY,GAAI,mBAAiB,KAAK,KAAG,GAAG,CAAC,OAoJlD,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ViewSelector/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAGrD,UAAU,KAAK;IACb,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,QAAA,MAAM,YAAY,GAAI,mBAAiB,KAAK,KAAG,GAAG,CAAC,OA+JlD,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/ProfileView/components/ViewSelector/index.js

@@ -1,95 +1,221 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useQueryState } from 'nuqs';
-import { useParcaContext } from '@parca/components';
-import { stringParam } from '../../../hooks/urlParsers';
-import { useDashboardItems } from '../../../hooks/useDashboardItems';
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+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."); }
+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; } }
+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; }
+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; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+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 { useParcaContext, useURLState, useURLStateBatch } from '@parca/components';
 import Dropdown from './Dropdown';
-const ViewSelector = ({ profileSource }) => {
-    const { dashboardItems, setDashboardItems } = useDashboardItems();
-    const [, setSandwichFunctionName] = useQueryState('sandwich_function_name', stringParam);
-    const { enableSourcesView, enableSandwichView } = useParcaContext();
-    const allItems = [
-        {
-            key: 'flamegraph',
-            label: 'Flame Graph',
-            canBeSelected: !dashboardItems.includes('flamegraph'),
-        },
-        { key: 'table', label: 'Table', canBeSelected: !dashboardItems.includes('table') },
-        {
-            key: 'flamechart',
-            label: (_jsxs("span", { className: "relative", children: ["Flame Chart", _jsx("span", { className: "absolute top-[-2px] text-xs lowercase text-red-500", children: "\u00A0alpha" })] })),
-            canBeSelected: !dashboardItems.includes('flamechart') && profileSource?.ProfileType().delta === true,
-            disabledText: !dashboardItems.includes('flamechart') && profileSource?.ProfileType().delta !== true
-                ? 'Flamechart is not available for non-delta profiles'
-                : undefined,
-        },
-    ];
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+var ViewSelector = function ViewSelector(t0) {
+  var $ = _c(21);
+  var profileSource = t0.profileSource;
+  var t1;
+  if ($[0] === Symbol["for"]("react.memo_cache_sentinel")) {
+    t1 = {
+      alwaysReturnArray: true
+    };
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  var _useURLState = useURLState("dashboard_items", t1),
+    _useURLState2 = _slicedToArray(_useURLState, 2),
+    t2 = _useURLState2[0],
+    setDashboardItems = _useURLState2[1];
+  var t3;
+  if ($[1] !== t2) {
+    t3 = t2 === undefined ? ["flamegraph"] : t2;
+    $[1] = t2;
+    $[2] = t3;
+  } else {
+    t3 = $[2];
+  }
+  var dashboardItems = t3;
+  var _useURLState3 = useURLState("sandwich_function_name"),
+    _useURLState4 = _slicedToArray(_useURLState3, 2),
+    setSandwichFunctionName = _useURLState4[1];
+  var _useParcaContext = useParcaContext(),
+    enableSourcesView = _useParcaContext.enableSourcesView,
+    enableSandwichView = _useParcaContext.enableSandwichView;
+  var batchUpdates = useURLStateBatch();
+  var t4;
+  if ($[3] !== dashboardItems) {
+    t4 = dashboardItems.includes("flamegraph");
+    $[3] = dashboardItems;
+    $[4] = t4;
+  } else {
+    t4 = $[4];
+  }
+  var t5 = !t4;
+  var t6;
+  if ($[5] !== batchUpdates || $[6] !== dashboardItems || $[7] !== enableSandwichView || $[8] !== enableSourcesView || $[9] !== profileSource || $[10] !== setDashboardItems || $[11] !== setSandwichFunctionName || $[12] !== t5) {
+    var allItems = [{
+      key: "flamegraph",
+      label: "Flame Graph",
+      canBeSelected: t5
+    }, {
+      key: "table",
+      label: "Table",
+      canBeSelected: !dashboardItems.includes("table")
+    }, {
+      key: "flamechart",
+      label: /*#__PURE__*/_jsxs("span", {
+        className: "relative",
+        children: ["Flame Chart", /*#__PURE__*/_jsx("span", {
+          className: "absolute top-[-2px] text-xs lowercase text-red-500",
+          children: "\xA0alpha"
+        })]
+      }),
+      canBeSelected: !dashboardItems.includes("flamechart") && (profileSource === null || profileSource === void 0 ? void 0 : profileSource.ProfileType().delta) === true,
+      disabledText: !dashboardItems.includes("flamechart") && (profileSource === null || profileSource === void 0 ? void 0 : profileSource.ProfileType().delta) !== true ? "Flamechart is not available for non-delta profiles" : undefined
+    }];
     if (enableSandwichView === true) {
-        allItems.push({
-            key: 'sandwich',
-            label: (_jsxs("span", { className: "relative", children: ["Sandwich", _jsx("span", { className: "absolute top-[-2px] text-xs lowercase text-red-500", children: "\u00A0alpha" })] })),
-            canBeSelected: !dashboardItems.includes('sandwich'),
-        });
+      allItems.push({
+        key: "sandwich",
+        label: /*#__PURE__*/_jsxs("span", {
+          className: "relative",
+          children: ["Sandwich", /*#__PURE__*/_jsx("span", {
+            className: "absolute top-[-2px] text-xs lowercase text-red-500",
+            children: "\xA0alpha"
+          })]
+        }),
+        canBeSelected: !dashboardItems.includes("sandwich")
+      });
     }
     if (enableSourcesView === true) {
-        allItems.push({ key: 'source', label: 'Source', canBeSelected: false });
+      allItems.push({
+        key: "source",
+        label: "Source",
+        canBeSelected: false
+      });
     }
-    const getOption = ({ label, supportingText, }) => {
-        const title = (_jsx("span", { className: "capitalize whitespace-nowrap", children: typeof label === 'string' ? label.replaceAll('-', ' ') : label }));
-        return {
-            active: title,
-            expanded: (_jsxs(_Fragment, { children: [title, supportingText !== null && _jsx("span", { className: "text-xs", children: supportingText })] })),
-        };
-    };
-    const getInnerActionForItem = (item) => {
-        if (dashboardItems.length === 1 && item.key === dashboardItems[0])
-            return undefined;
-        // If we already have 2 panels and this item isn't selected, don't show any action
-        if (dashboardItems.length >= 2 && !dashboardItems.includes(item.key))
-            return undefined;
-        return {
-            text: !item.canBeSelected && item.key === 'source'
-                ? 'Add Panel'
-                : item.canBeSelected
-                    ? 'Add Panel'
-                    : dashboardItems.includes(item.key)
-                        ? 'Close Panel'
-                        : 'Add Panel',
-            onClick: () => {
-                if (item.canBeSelected) {
-                    setDashboardItems([...dashboardItems, item.key]);
-                }
-                else {
-                    const newDashboardItems = dashboardItems.filter(v => v !== item.key);
-                    setDashboardItems(newDashboardItems);
-                    if (item.key === 'sandwich') {
-                        void setSandwichFunctionName(null);
-                    }
-                }
-            },
-            isDisabled: dashboardItems.length === 1 && dashboardItems.includes('sandwich'),
-        };
+    var getOption = _temp;
+    var getInnerActionForItem = function getInnerActionForItem(item) {
+      if (dashboardItems.length === 1 && item.key === dashboardItems[0]) {
+        return;
+      }
+      if (dashboardItems.length >= 2 && !dashboardItems.includes(item.key)) {
+        return;
+      }
+      return {
+        text: !item.canBeSelected && item.key === "source" ? "Add Panel" : item.canBeSelected ? "Add Panel" : dashboardItems.includes(item.key) ? "Close Panel" : "Add Panel",
+        onClick: function onClick() {
+          if (item.canBeSelected) {
+            setDashboardItems([].concat(_toConsumableArray(dashboardItems), [item.key]));
+          } else {
+            var newDashboardItems = dashboardItems.filter(function (v) {
+              return v !== item.key;
+            });
+            if (item.key === "sandwich") {
+              batchUpdates(function () {
+                setDashboardItems(newDashboardItems);
+                setSandwichFunctionName(undefined);
+              });
+            } else {
+              setDashboardItems(newDashboardItems);
+            }
+          }
+        },
+        isDisabled: dashboardItems.length === 1 && dashboardItems.includes("sandwich")
+      };
     };
-    const items = allItems.map(item => ({
-        key: item.key,
-        disabled: !item.canBeSelected,
-        disabledText: item.disabledText,
-        element: getOption(item),
-        innerAction: getInnerActionForItem(item),
-    }));
-    const onSelection = (value) => {
-        const isOnlyChart = dashboardItems.length === 1;
-        if (isOnlyChart && value === 'sandwich') {
-            setDashboardItems([...dashboardItems, value]);
-            return;
-        }
-        if (isOnlyChart) {
-            setDashboardItems([value]);
-            return;
-        }
-        const newDashboardItems = [dashboardItems[0], value];
-        setDashboardItems(newDashboardItems);
+    t6 = allItems.map(function (item_0) {
+      return {
+        key: item_0.key,
+        disabled: !item_0.canBeSelected,
+        disabledText: item_0.disabledText,
+        element: getOption(item_0),
+        innerAction: getInnerActionForItem(item_0)
+      };
+    });
+    $[5] = batchUpdates;
+    $[6] = dashboardItems;
+    $[7] = enableSandwichView;
+    $[8] = enableSourcesView;
+    $[9] = profileSource;
+    $[10] = setDashboardItems;
+    $[11] = setSandwichFunctionName;
+    $[12] = t5;
+    $[13] = t6;
+  } else {
+    t6 = $[13];
+  }
+  var items = t6;
+  var t7;
+  if ($[14] !== dashboardItems || $[15] !== setDashboardItems) {
+    t7 = function t7(value) {
+      var isOnlyChart = dashboardItems.length === 1;
+      if (isOnlyChart && value === "sandwich") {
+        setDashboardItems([].concat(_toConsumableArray(dashboardItems), [value]));
+        return;
+      }
+      if (isOnlyChart) {
+        setDashboardItems([value]);
+        return;
+      }
+      var newDashboardItems_0 = [dashboardItems[0], value];
+      setDashboardItems(newDashboardItems_0);
     };
-    return (_jsx(Dropdown, { className: "h-view-selector", items: items, selectedKey: dashboardItems.length >= 2 ? 'Multiple' : dashboardItems[0], onSelection: onSelection, placeholder: 'Select view type...', id: "h-view-selector", optionsClassName: "min-w-[260px]" }));
+    $[14] = dashboardItems;
+    $[15] = setDashboardItems;
+    $[16] = t7;
+  } else {
+    t7 = $[16];
+  }
+  var onSelection = t7;
+  var t8 = dashboardItems.length >= 2 ? "Multiple" : dashboardItems[0];
+  var t9;
+  if ($[17] !== items || $[18] !== onSelection || $[19] !== t8) {
+    t9 = /*#__PURE__*/_jsx(Dropdown, {
+      className: "h-view-selector",
+      items: items,
+      selectedKey: t8,
+      onSelection: onSelection,
+      placeholder: "Select view type...",
+      id: "h-view-selector",
+      optionsClassName: "min-w-[260px]"
+    });
+    $[17] = items;
+    $[18] = onSelection;
+    $[19] = t8;
+    $[20] = t9;
+  } else {
+    t9 = $[20];
+  }
+  return t9;
 };
 export default ViewSelector;
+function _temp(t0) {
+  var label = t0.label,
+    supportingText = t0.supportingText;
+  var title = /*#__PURE__*/_jsx("span", {
+    className: "capitalize whitespace-nowrap",
+    children: typeof label === "string" ? label.replaceAll("-", " ") : label
+  });
+  return {
+    active: title,
+    expanded: /*#__PURE__*/_jsxs(_Fragment, {
+      children: [title, supportingText !== null && /*#__PURE__*/_jsx("span", {
+        className: "text-xs",
+        children: supportingText
+      })]
+    })
+  };
+}

package/dist/ProfileView/components/VisualizationContainer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/VisualizationContainer/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAGzB,OAAO,KAAK,EAAC,iBAAiB,EAAE,sBAAsB,EAAC,MAAM,qBAAqB,CAAC;AAGnF,OAAO,EAAC,iBAAiB,EAAC,MAAM,2BAA2B,CAAC;AAG5D,UAAU,2BAA2B;IACnC,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,QAAQ,EAAE,sBAAsB,CAAC;IACjC,aAAa,EAAE,iBAAiB,CAAC;IACjC,sBAAsB,EAAE,CAAC,KAAK,EAAE;QAAC,IAAI,EAAE,iBAAiB,CAAC;QAAC,YAAY,EAAE,OAAO,CAAA;KAAC,KAAK,GAAG,CAAC,OAAO,CAAC;IACjG,gBAAgB,EAAE,OAAO,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE;QACb,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;QACnB,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;KACpB,CAAC;CACH;AAED,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,2BAA2B,CAsClE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/VisualizationContainer/index.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAGzB,OAAO,KAAK,EAAC,iBAAiB,EAAE,sBAAsB,EAAC,MAAM,qBAAqB,CAAC;AAGnF,OAAO,EAAC,iBAAiB,EAAC,MAAM,2BAA2B,CAAC;AAG5D,UAAU,2BAA2B;IACnC,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,QAAQ,EAAE,sBAAsB,CAAC;IACjC,aAAa,EAAE,iBAAiB,CAAC;IACjC,sBAAsB,EAAE,CAAC,KAAK,EAAE;QAAC,IAAI,EAAE,iBAAiB,CAAC;QAAC,YAAY,EAAE,OAAO,CAAA;KAAC,KAAK,GAAG,CAAC,OAAO,CAAC;IACjG,gBAAgB,EAAE,OAAO,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE;QACb,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;QACnB,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;KACpB,CAAC;CACH;AAED,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,2BAA2B,CAuClE,CAAC"}