@parca/profile 0.16.183 → 0.16.185

package/dist/ProfileSelector/index.js

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright 2022 The Parca Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
@@ -32,31 +21,30 @@ import MatchersInput from '../MatchersInput/index';
 import ProfileMetricsGraph from '../ProfileMetricsGraph';
 import ProfileTypeSelector from '../ProfileTypeSelector/index';
 import CompareButton from './CompareButton';
-export var useProfileTypes = function (client) {
-    var _a = useState(undefined), result = _a[0], setResult = _a[1];
-    var _b = useState(undefined), error = _b[0], setError = _b[1];
-    var _c = useState(true), loading = _c[0], setLoading = _c[1];
-    var metadata = useGrpcMetadata();
-    useEffect(function () {
+export const useProfileTypes = (client) => {
+    const [result, setResult] = useState(undefined);
+    const [error, setError] = useState(undefined);
+    const [loading, setLoading] = useState(true);
+    const metadata = useGrpcMetadata();
+    useEffect(() => {
         if (!loading) {
             return;
         }
-        var call = client.profileTypes({}, { meta: metadata });
+        const call = client.profileTypes({}, { meta: metadata });
         call.response
-            .then(function (response) { return setResult(response); })
-            .catch(function (error) { return setError(error); })
-            .finally(function () { return setLoading(false); });
+            .then(response => setResult(response))
+            .catch(error => setError(error))
+            .finally(() => setLoading(false));
     }, [client, metadata, loading]);
-    return { loading: loading, data: result, error: error };
+    return { loading, data: result, error };
 };
-var ProfileSelector = function (_a) {
-    var queryClient = _a.queryClient, querySelection = _a.querySelection, selectProfile = _a.selectProfile, selectQuery = _a.selectQuery, closeProfile = _a.closeProfile, enforcedProfileName = _a.enforcedProfileName, profileSelection = _a.profileSelection, comparing = _a.comparing, onCompareProfile = _a.onCompareProfile;
-    var _b = useProfileTypes(queryClient), profileTypesLoading = _b.loading, profileTypesData = _b.data, error = _b.error;
-    var _c = useState(DateTimeRange.fromRangeKey(querySelection.timeSelection)), timeRangeSelection = _c[0], setTimeRangeSelection = _c[1];
-    var _d = useState(querySelection.expression), queryExpressionString = _d[0], setQueryExpressionString = _d[1];
-    useEffect(function () {
+const ProfileSelector = ({ queryClient, querySelection, selectProfile, selectQuery, closeProfile, enforcedProfileName, profileSelection, comparing, onCompareProfile, }) => {
+    const { loading: profileTypesLoading, data: profileTypesData, error, } = useProfileTypes(queryClient);
+    const [timeRangeSelection, setTimeRangeSelection] = useState(DateTimeRange.fromRangeKey(querySelection.timeSelection));
+    const [queryExpressionString, setQueryExpressionString] = useState(querySelection.expression);
+    useEffect(() => {
         if (enforcedProfileName !== '') {
-            var _a = Query.parse(querySelection.expression).setProfileName(enforcedProfileName), q = _a[0], changed = _a[1];
+            const [q, changed] = Query.parse(querySelection.expression).setProfileName(enforcedProfileName);
             if (changed) {
                 setQueryExpressionString(q.toString());
                 return;
@@ -64,89 +52,101 @@ var ProfileSelector = function (_a) {
         }
         setQueryExpressionString(querySelection.expression);
     }, [enforcedProfileName, querySelection.expression]);
-    var enforcedProfileNameQuery = function () {
-        var pq = Query.parse(queryExpressionString);
-        var q = pq.setProfileName(enforcedProfileName)[0];
+    const enforcedProfileNameQuery = () => {
+        const pq = Query.parse(queryExpressionString);
+        const [q] = pq.setProfileName(enforcedProfileName);
         return q;
     };
-    var query = enforcedProfileName !== '' ? enforcedProfileNameQuery() : Query.parse(queryExpressionString);
-    var selectedProfileName = query.profileName();
-    var setNewQueryExpression = function (expr) {
-        var query = enforcedProfileName !== '' ? enforcedProfileNameQuery() : Query.parse(expr);
-        var delta = query.profileType().delta;
-        var from = timeRangeSelection.getFromMs();
-        var to = timeRangeSelection.getToMs();
-        var mergeParams = delta
+    const query = enforcedProfileName !== '' ? enforcedProfileNameQuery() : Query.parse(queryExpressionString);
+    const selectedProfileName = query.profileName();
+    const setNewQueryExpression = (expr) => {
+        const query = enforcedProfileName !== '' ? enforcedProfileNameQuery() : Query.parse(expr);
+        const delta = query.profileType().delta;
+        const from = timeRangeSelection.getFromMs();
+        const to = timeRangeSelection.getToMs();
+        const mergeParams = delta
             ? {
                 mergeFrom: from,
                 mergeTo: to,
             }
             : {};
-        selectQuery(__assign({ expression: expr, from: from, to: to, timeSelection: timeRangeSelection.getRangeKey() }, mergeParams));
+        selectQuery({
+            expression: expr,
+            from,
+            to,
+            timeSelection: timeRangeSelection.getRangeKey(),
+            ...mergeParams,
+        });
     };
-    var setQueryExpression = function () {
+    const setQueryExpression = () => {
         setNewQueryExpression(query.toString());
     };
-    var addLabelMatcher = function (key, value) {
+    const addLabelMatcher = (key, value) => {
         // When a user clicks on a label on the metrics graph tooltip,
         // replace single `\` in the `value` string with doubles `\\` if available.
-        var newValue = value.includes('\\') ? value.replaceAll('\\', '\\\\') : value;
-        var _a = Query.parse(queryExpressionString).setMatcher(key, newValue), newQuery = _a[0], changed = _a[1];
+        const newValue = value.includes('\\') ? value.replaceAll('\\', '\\\\') : value;
+        const [newQuery, changed] = Query.parse(queryExpressionString).setMatcher(key, newValue);
         if (changed) {
             // TODO: Change this to store the query object
             setNewQueryExpression(newQuery.toString());
         }
     };
-    var setMatchersString = function (matchers) {
-        var newExpressionString = "".concat(selectedProfileName, "{").concat(matchers, "}");
+    const setMatchersString = (matchers) => {
+        const newExpressionString = `${selectedProfileName}{${matchers}}`;
         setQueryExpressionString(newExpressionString);
     };
-    var setProfileName = function (profileName) {
+    const setProfileName = (profileName) => {
         if (profileName === undefined) {
             return;
         }
-        var _a = query.setProfileName(profileName), newQuery = _a[0], changed = _a[1];
+        const [newQuery, changed] = query.setProfileName(profileName);
         if (changed) {
-            var q = newQuery.toString();
+            const q = newQuery.toString();
             setQueryExpressionString(q);
         }
     };
-    var handleCompareClick = function () { return onCompareProfile(); };
-    var searchDisabled = queryExpressionString === undefined ||
+    const handleCompareClick = () => onCompareProfile();
+    const searchDisabled = queryExpressionString === undefined ||
         queryExpressionString === '' ||
         queryExpressionString === '{}';
-    var compareDisabled = selectedProfileName === '' || querySelection.expression === undefined;
-    return (_jsxs(Card, __assign({ className: "overflow-visible" }, { children: [_jsxs(Card.Header, __assign({ className: "flex !items-center space-x-2" }, { children: [_jsxs("div", __assign({ className: "flex w-full flex-wrap items-center justify-start space-x-2 space-y-1" }, { children: [_jsx("div", __assign({ className: "ml-2 mt-1" }, { children: _jsx(ProfileTypeSelector, { profileTypesData: profileTypesData, loading: profileTypesLoading, selectedKey: selectedProfileName, onSelection: setProfileName, error: error }) })), _jsx("div", __assign({ className: "w-full flex-1" }, { children: _jsx(MatchersInput, { queryClient: queryClient, setMatchersString: setMatchersString, runQuery: setQueryExpression, currentQuery: query }) })), _jsx(DateTimeRangePicker, { onRangeSelection: setTimeRangeSelection, range: timeRangeSelection }), _jsxs(ButtonGroup, { children: [!searchDisabled && (_jsx(_Fragment, { children: !comparing && (_jsx(CompareButton, { disabled: compareDisabled, onClick: handleCompareClick })) })), _jsx(Button, __assign({ disabled: searchDisabled, onClick: function (e) {
+    const compareDisabled = selectedProfileName === '' || querySelection.expression === undefined;
+    return (_jsxs(Card, { className: "overflow-visible", children: [_jsxs(Card.Header, { className: "flex !items-center space-x-2", children: [_jsxs("div", { className: "flex w-full flex-wrap items-center justify-start space-x-2 space-y-1", children: [_jsx("div", { className: "ml-2 mt-1", children: _jsx(ProfileTypeSelector, { profileTypesData: profileTypesData, loading: profileTypesLoading, selectedKey: selectedProfileName, onSelection: setProfileName, error: error }) }), _jsx("div", { className: "w-full flex-1", children: _jsx(MatchersInput, { queryClient: queryClient, setMatchersString: setMatchersString, runQuery: setQueryExpression, currentQuery: query }) }), _jsx(DateTimeRangePicker, { onRangeSelection: setTimeRangeSelection, range: timeRangeSelection }), _jsxs(ButtonGroup, { children: [!searchDisabled && (_jsx(_Fragment, { children: !comparing && (_jsx(CompareButton, { disabled: compareDisabled, onClick: handleCompareClick })) })), _jsx(Button, { disabled: searchDisabled, onClick: (e) => {
                                             e.preventDefault();
                                             setQueryExpression();
-                                        } }, { children: "Search" }))] })] })), _jsx("div", { children: comparing && _jsx(IconButton, { onClick: function () { return closeProfile(); }, icon: _jsx(CloseIcon, {}) }) })] })), _jsx(Card.Body, { children: querySelection.expression !== undefined &&
+                                        }, children: "Search" })] })] }), _jsx("div", { children: comparing && _jsx(IconButton, { onClick: () => closeProfile(), icon: _jsx(CloseIcon, {}) }) })] }), _jsx(Card.Body, { children: querySelection.expression !== undefined &&
                     querySelection.expression.length > 0 &&
                     querySelection.from !== undefined &&
-                    querySelection.to !== undefined ? (_jsx(ProfileMetricsGraph, { queryClient: queryClient, queryExpression: querySelection.expression, from: querySelection.from, to: querySelection.to, profile: profileSelection, setTimeRange: function (range) {
-                        var from = range.getFromMs();
-                        var to = range.getToMs();
-                        var mergedProfileParams = {};
+                    querySelection.to !== undefined ? (_jsx(ProfileMetricsGraph, { queryClient: queryClient, queryExpression: querySelection.expression, from: querySelection.from, to: querySelection.to, profile: profileSelection, setTimeRange: (range) => {
+                        const from = range.getFromMs();
+                        const to = range.getToMs();
+                        let mergedProfileParams = {};
                         if (query.profileType().delta) {
                             mergedProfileParams = { mergeFrom: from, mergeTo: to };
                         }
                         setTimeRangeSelection(range);
-                        selectQuery(__assign({ expression: queryExpressionString, from: from, to: to, timeSelection: range.getRangeKey() }, mergedProfileParams));
-                    }, addLabelMatcher: addLabelMatcher, onPointClick: function (timestamp, labels, queryExpression) {
+                        selectQuery({
+                            expression: queryExpressionString,
+                            from,
+                            to,
+                            timeSelection: range.getRangeKey(),
+                            ...mergedProfileParams,
+                        });
+                    }, addLabelMatcher: addLabelMatcher, onPointClick: (timestamp, labels, queryExpression) => {
                         // TODO: Pass the query object via click rather than queryExpression
-                        var query = Query.parse(queryExpression);
-                        labels.forEach(function (l) {
-                            var _a = query.setMatcher(l.name, l.value), newQuery = _a[0], updated = _a[1];
+                        let query = Query.parse(queryExpression);
+                        labels.forEach(l => {
+                            const [newQuery, updated] = query.setMatcher(l.name, l.value);
                             if (updated) {
                                 query = newQuery;
                             }
                         });
-                        var stepDuration = getStepDuration(querySelection.from, querySelection.to);
-                        var stepDurationInMilliseconds = getStepDurationInMilliseconds(stepDuration);
-                        var mergeFrom = timestamp;
-                        var mergeTo = query.profileType().delta
+                        const stepDuration = getStepDuration(querySelection.from, querySelection.to);
+                        const stepDurationInMilliseconds = getStepDurationInMilliseconds(stepDuration);
+                        const mergeFrom = timestamp;
+                        const mergeTo = query.profileType().delta
                             ? mergeFrom + stepDurationInMilliseconds
                             : mergeFrom;
                         selectProfile(new MergedProfileSelection(mergeFrom, mergeTo, query));
-                    } })) : (_jsx(_Fragment, { children: profileSelection == null && (_jsx("div", __assign({ className: "my-20 text-center" }, { children: _jsx("p", { children: "Run a query, and the result will be displayed here." }) }))) })) })] })));
+                    } })) : (_jsx(_Fragment, { children: profileSelection == null && (_jsx("div", { className: "my-20 text-center", children: _jsx("p", { children: "Run a query, and the result will be displayed here." }) })) })) })] }));
 };
 export default ProfileSelector;

package/dist/ProfileSource.js

@@ -14,26 +14,23 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { ProfileDiffSelection_Mode, QueryRequest_Mode, QueryRequest_ReportType, Timestamp, } from '@parca/client';
 import { ProfileType, Query } from '@parca/parser';
 import { formatDate } from '@parca/utilities';
-export var timeFormat = "MMM d, 'at' h:mm:s a '(UTC)'";
-export var timeFormatShort = 'MMM d, h:mma';
+export const timeFormat = "MMM d, 'at' h:mm:s a '(UTC)'";
+export const timeFormatShort = 'MMM d, h:mma';
 export function ParamsString(params) {
     return Object.keys(params)
         .map(function (key) {
-        return "".concat(key, "=").concat(params[key]);
+        return `${key}=${params[key]}`;
     })
         .join('&');
 }
 export function SuffixParams(params, suffix) {
-    return Object.fromEntries(Object.entries(params).map(function (_a) {
-        var key = _a[0], value = _a[1];
-        return ["".concat(key).concat(suffix), value];
-    }));
+    return Object.fromEntries(Object.entries(params).map(([key, value]) => [`${key}${suffix}`, value]));
 }
 export function ParseLabels(labels) {
     return labels
-        .filter(function (str) { return str !== ''; })
+        .filter(str => str !== '')
         .map(function (labelString) {
-        var parts = labelString.split('=', 2);
+        const parts = labelString.split('=', 2);
         return { name: parts[0], value: parts[1] };
     });
 }
@@ -44,60 +41,58 @@ export function ProfileSelectionFromParams(expression, from, to, mergeFrom, merg
         mergeTo !== undefined &&
         expression !== undefined) {
         // TODO: Refactor parsing the query and adding matchers
-        var query_1 = Query.parse(expression);
+        let query = Query.parse(expression);
         if (labels !== undefined) {
-            ParseLabels(labels !== null && labels !== void 0 ? labels : ['']).forEach(function (l) {
-                var hasLabels = labels.length > 0 && labels.filter(function (val) { return val !== ''; }).length > 0;
+            ParseLabels(labels ?? ['']).forEach(l => {
+                const hasLabels = labels.length > 0 && labels.filter(val => val !== '').length > 0;
                 if (hasLabels) {
-                    var _a = query_1.setMatcher(l.name, l.value), newQuery = _a[0], changed = _a[1];
+                    const [newQuery, changed] = query.setMatcher(l.name, l.value);
                     if (changed) {
-                        query_1 = newQuery;
+                        query = newQuery;
                     }
                 }
             });
         }
-        return new MergedProfileSelection(parseInt(mergeFrom), parseInt(mergeTo), query_1, filterQuery);
+        return new MergedProfileSelection(parseInt(mergeFrom), parseInt(mergeTo), query, filterQuery);
     }
     return null;
 }
-var MergedProfileSelection = /** @class */ (function () {
-    function MergedProfileSelection(mergeFrom, mergeTo, query, filterQuery) {
+export class MergedProfileSelection {
+    constructor(mergeFrom, mergeTo, query, filterQuery) {
         this.mergeFrom = mergeFrom;
         this.mergeTo = mergeTo;
         this.query = query;
         this.filterQuery = filterQuery;
     }
-    MergedProfileSelection.prototype.ProfileName = function () {
+    ProfileName() {
         return this.query.profileName();
-    };
-    MergedProfileSelection.prototype.HistoryParams = function () {
+    }
+    HistoryParams() {
         return {
             merge_from: this.mergeFrom.toString(),
             merge_to: this.mergeTo.toString(),
             query: this.query,
             profile_name: this.ProfileName(),
-            labels: this.query.matchers.map(function (m) { return "".concat(m.key, "=").concat(encodeURIComponent(m.value)); }),
+            labels: this.query.matchers.map(m => `${m.key}=${encodeURIComponent(m.value)}`),
         };
-    };
-    MergedProfileSelection.prototype.Type = function () {
+    }
+    Type() {
         return 'merge';
-    };
-    MergedProfileSelection.prototype.ProfileSource = function () {
+    }
+    ProfileSource() {
         return new MergedProfileSource(this.mergeFrom, this.mergeTo, this.query, this.filterQuery);
-    };
-    return MergedProfileSelection;
-}());
-export { MergedProfileSelection };
-var ProfileDiffSource = /** @class */ (function () {
-    function ProfileDiffSource(a, b, filterQuery) {
+    }
+}
+export class ProfileDiffSource {
+    constructor(a, b, filterQuery) {
         this.a = a;
         this.b = b;
         this.filterQuery = filterQuery;
     }
-    ProfileDiffSource.prototype.DiffSelection = function () {
+    DiffSelection() {
         throw new Error('Method not implemented.');
-    };
-    ProfileDiffSource.prototype.QueryRequest = function () {
+    }
+    QueryRequest() {
         return {
             options: {
                 oneofKind: 'diff',
@@ -110,27 +105,25 @@ var ProfileDiffSource = /** @class */ (function () {
             mode: QueryRequest_Mode.DIFF,
             filterQuery: this.filterQuery,
         };
-    };
-    ProfileDiffSource.prototype.ProfileType = function () {
+    }
+    ProfileType() {
         return this.a.ProfileType();
-    };
-    ProfileDiffSource.prototype.Describe = function () {
+    }
+    Describe() {
         return (_jsx(_Fragment, { children: _jsx("p", { children: "Browse the comparison" }) }));
-    };
-    ProfileDiffSource.prototype.toString = function () {
-        return "".concat(this.a.toString(), " compared with ").concat(this.b.toString());
-    };
-    return ProfileDiffSource;
-}());
-export { ProfileDiffSource };
-var MergedProfileSource = /** @class */ (function () {
-    function MergedProfileSource(mergeFrom, mergeTo, query, filterQuery) {
+    }
+    toString() {
+        return `${this.a.toString()} compared with ${this.b.toString()}`;
+    }
+}
+export class MergedProfileSource {
+    constructor(mergeFrom, mergeTo, query, filterQuery) {
         this.mergeFrom = mergeFrom;
         this.mergeTo = mergeTo;
         this.query = query;
         this.filterQuery = filterQuery;
     }
-    MergedProfileSource.prototype.DiffSelection = function () {
+    DiffSelection() {
         return {
             options: {
                 oneofKind: 'merge',
@@ -142,8 +135,8 @@ var MergedProfileSource = /** @class */ (function () {
             },
             mode: ProfileDiffSelection_Mode.MERGE,
         };
-    };
-    MergedProfileSource.prototype.QueryRequest = function () {
+    }
+    QueryRequest() {
         return {
             options: {
                 oneofKind: 'merge',
@@ -157,21 +150,19 @@ var MergedProfileSource = /** @class */ (function () {
             mode: QueryRequest_Mode.MERGE,
             filterQuery: this.filterQuery,
         };
-    };
-    MergedProfileSource.prototype.ProfileType = function () {
+    }
+    ProfileType() {
         return ProfileType.fromString(Query.parse(this.query.toString()).profileName());
-    };
-    MergedProfileSource.prototype.Describe = function () {
+    }
+    Describe() {
         return (_jsxs("a", { children: ["Merge of \"", this.query.toString(), "\" from ", formatDate(this.mergeFrom, timeFormat), ' ', "to ", formatDate(this.mergeTo, timeFormat)] }));
-    };
-    MergedProfileSource.prototype.stringMatchers = function () {
+    }
+    stringMatchers() {
         return this.query.matchers
-            .filter(function (m) { return m.key !== '__name__'; })
-            .map(function (m) { return "".concat(m.key, "=").concat(m.value); });
-    };
-    MergedProfileSource.prototype.toString = function () {
-        return "merged profiles of query \"".concat(this.query.toString(), "\" from ").concat(formatDate(this.mergeFrom, timeFormat), " to ").concat(formatDate(this.mergeTo, timeFormat));
-    };
-    return MergedProfileSource;
-}());
-export { MergedProfileSource };
+            .filter((m) => m.key !== '__name__')
+            .map((m) => `${m.key}=${m.value}`);
+    }
+    toString() {
+        return `merged profiles of query "${this.query.toString()}" from ${formatDate(this.mergeFrom, timeFormat)} to ${formatDate(this.mergeTo, timeFormat)}`;
+    }
+}

package/dist/ProfileTypeSelector/index.js

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright 2022 The Parca Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
@@ -24,7 +13,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 // limitations under the License.
 import { useMemo } from 'react';
 import { Select } from '@parca/components';
-export var wellKnownProfiles = {
+export const wellKnownProfiles = {
     'block:contentions:count:contentions:count': {
         name: 'Block Contentions Total',
         help: 'Stack traces that led to blocking on synchronization primitives.',
@@ -91,9 +80,9 @@ export var wellKnownProfiles = {
     },
 };
 function flexibleWellKnownProfileMatching(name) {
-    var prefixExcludedName = name.split(':').slice(1).join(':');
-    var deltaExcludedName = prefixExcludedName.replace(/:delta$/, '');
-    var requiredKey = Object.keys(wellKnownProfiles).find(function (key) {
+    const prefixExcludedName = name.split(':').slice(1).join(':');
+    const deltaExcludedName = prefixExcludedName.replace(/:delta$/, '');
+    const requiredKey = Object.keys(wellKnownProfiles).find(key => {
         if (key.includes(deltaExcludedName)) {
             return true;
         }
@@ -102,39 +91,36 @@ function flexibleWellKnownProfileMatching(name) {
     return requiredKey != null ? wellKnownProfiles[requiredKey] : undefined;
 }
 export function profileSelectElement(name, flexibleKnownProfilesDetection) {
-    var wellKnown = !flexibleKnownProfilesDetection
+    const wellKnown = !flexibleKnownProfilesDetection
         ? wellKnownProfiles[name]
         : flexibleWellKnownProfileMatching(name);
     if (wellKnown === undefined)
         return { active: _jsx(_Fragment, { children: name }), expanded: _jsx(_Fragment, { children: name }) };
-    var title = wellKnown.name.replace(/ /g, '\u00a0');
+    const title = wellKnown.name.replace(/ /g, '\u00a0');
     return {
         active: _jsx(_Fragment, { children: title }),
-        expanded: (_jsxs(_Fragment, { children: [_jsx("span", { children: title }), _jsx("br", {}), _jsx("span", __assign({ className: "text-xs" }, { children: wellKnown.help }))] })),
+        expanded: (_jsxs(_Fragment, { children: [_jsx("span", { children: title }), _jsx("br", {}), _jsx("span", { className: "text-xs", children: wellKnown.help })] })),
     };
 }
-export var normalizeProfileTypesData = function (types) {
+export const normalizeProfileTypesData = (types) => {
     return types
-        .map(function (type) {
-        return "".concat(type.name, ":").concat(type.sampleType, ":").concat(type.sampleUnit, ":").concat(type.periodType, ":").concat(type.periodUnit).concat(type.delta ? ':delta' : '');
-    })
-        .sort(function (a, b) {
+        .map(type => `${type.name}:${type.sampleType}:${type.sampleUnit}:${type.periodType}:${type.periodUnit}${type.delta ? ':delta' : ''}`)
+        .sort((a, b) => {
         return a.localeCompare(b);
     });
 };
-var ProfileTypeSelector = function (_a) {
-    var profileTypesData = _a.profileTypesData, _b = _a.loading, loading = _b === void 0 ? false : _b, error = _a.error, selectedKey = _a.selectedKey, onSelection = _a.onSelection, _c = _a.flexibleKnownProfilesDetection, flexibleKnownProfilesDetection = _c === void 0 ? false : _c;
-    var profileNames = useMemo(function () {
+const ProfileTypeSelector = ({ profileTypesData, loading = false, error, selectedKey, onSelection, flexibleKnownProfilesDetection = false, }) => {
+    const profileNames = useMemo(() => {
         return (error === undefined || error == null) &&
             profileTypesData !== undefined &&
             profileTypesData != null
             ? normalizeProfileTypesData(profileTypesData.types)
             : [];
     }, [profileTypesData, error]);
-    var profileLabels = profileNames.map(function (name) { return ({
+    const profileLabels = profileNames.map(name => ({
         key: name,
         element: profileSelectElement(name, flexibleKnownProfilesDetection),
-    }); });
+    }));
     return (_jsx(Select, { items: profileLabels, selectedKey: selectedKey, onSelection: onSelection, placeholder: "Select profile...", loading: loading }));
 };
 export default ProfileTypeSelector;

package/dist/ProfileView/FilterByFunctionButton.js

@@ -14,14 +14,13 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback, useMemo, useState } from 'react';
 import { Icon } from '@iconify/react';
 import { Input, useURLState } from '@parca/components';
-var FilterByFunctionButton = function (_a) {
-    var navigateTo = _a.navigateTo;
-    var _b = useURLState({ param: 'filter_by_function', navigateTo: navigateTo }), storeValue = _b[0], setStoreValue = _b[1];
-    var _c = useState(storeValue), localValue = _c[0], setLocalValue = _c[1];
-    var isClearAction = useMemo(function () {
+const FilterByFunctionButton = ({ navigateTo, }) => {
+    const [storeValue, setStoreValue] = useURLState({ param: 'filter_by_function', navigateTo });
+    const [localValue, setLocalValue] = useState(storeValue);
+    const isClearAction = useMemo(() => {
         return localValue === storeValue && localValue != null && localValue !== '';
     }, [localValue, storeValue]);
-    var onAction = useCallback(function () {
+    const onAction = useCallback(() => {
         if (isClearAction) {
             setLocalValue('');
             setStoreValue('');
@@ -30,6 +29,6 @@ var FilterByFunctionButton = function (_a) {
             setStoreValue(localValue);
         }
     }, [localValue, isClearAction, setStoreValue]);
-    return (_jsx(Input, { placeholder: "Filter by function", className: "text-sm", onAction: onAction, onChange: function (e) { return setLocalValue(e.target.value); }, value: localValue !== null && localValue !== void 0 ? localValue : '', onBlur: function () { return setLocalValue(storeValue); }, actionIcon: isClearAction ? _jsx(Icon, { icon: "ep:circle-close" }) : _jsx(Icon, { icon: "ep:arrow-right" }) }));
+    return (_jsx(Input, { placeholder: "Filter by function", className: "text-sm", onAction: onAction, onChange: e => setLocalValue(e.target.value), value: localValue ?? '', onBlur: () => setLocalValue(storeValue), actionIcon: isClearAction ? _jsx(Icon, { icon: "ep:circle-close" }) : _jsx(Icon, { icon: "ep:arrow-right" }) }));
 };
 export default FilterByFunctionButton;

package/dist/ProfileView/ViewSelector.js

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright 2022 The Parca Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
@@ -24,14 +13,13 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 // limitations under the License.
 import { Select, useURLState } from '@parca/components';
 import { useUIFeatureFlag } from '@parca/hooks';
-var ViewSelector = function (_a) {
-    var defaultValue = _a.defaultValue, navigateTo = _a.navigateTo, position = _a.position, placeholderText = _a.placeholderText, _b = _a.primary, primary = _b === void 0 ? false : _b, _c = _a.addView, addView = _c === void 0 ? false : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d;
-    var callgraphEnabled = useUIFeatureFlag('callgraph')[0];
-    var _e = useURLState({
+const ViewSelector = ({ defaultValue, navigateTo, position, placeholderText, primary = false, addView = false, disabled = false, }) => {
+    const [callgraphEnabled] = useUIFeatureFlag('callgraph');
+    const [dashboardItems = ['icicle'], setDashboardItems] = useURLState({
         param: 'dashboard_items',
-        navigateTo: navigateTo,
-    }), _f = _e[0], dashboardItems = _f === void 0 ? ['icicle'] : _f, setDashboardItems = _e[1];
-    var allItems = [
+        navigateTo,
+    });
+    const allItems = [
         { key: 'table', canBeSelected: !dashboardItems.includes('table') },
         { key: 'icicle', canBeSelected: !dashboardItems.includes('icicle') },
     ];
@@ -41,39 +29,38 @@ var ViewSelector = function (_a) {
             canBeSelected: !dashboardItems.includes('callgraph'),
         });
     }
-    var getOption = function (_a) {
-        var key = _a.key, supportingText = _a.supportingText;
-        var capitalizeFirstLetter = function (string) {
-            return "".concat(string.charAt(0).toUpperCase()).concat(string.slice(1));
+    const getOption = ({ key, supportingText, }) => {
+        const capitalizeFirstLetter = (string) => {
+            return `${string.charAt(0).toUpperCase()}${string.slice(1)}`;
         };
-        var title = capitalizeFirstLetter(key);
+        const title = capitalizeFirstLetter(key);
         return {
             active: _jsx(_Fragment, { children: title }),
-            expanded: (_jsxs(_Fragment, { children: [_jsx("span", { children: title }), supportingText !== null && _jsx("span", __assign({ className: "text-xs" }, { children: supportingText }))] })),
+            expanded: (_jsxs(_Fragment, { children: [_jsx("span", { children: title }), supportingText !== null && _jsx("span", { className: "text-xs", children: supportingText })] })),
         };
     };
-    var items = allItems.map(function (item) { return ({
+    const items = allItems.map(item => ({
         key: item.key,
         disabled: !item.canBeSelected,
         element: getOption(item),
-    }); });
-    var onSelection = function (value) {
+    }));
+    const onSelection = (value) => {
         if (addView) {
             setDashboardItems([dashboardItems[0], value]);
             return;
         }
-        var isOnlyChart = dashboardItems.length === 1;
+        const isOnlyChart = dashboardItems.length === 1;
         if (isOnlyChart) {
             setDashboardItems([value]);
             return;
         }
         // Note: this will need to be updated if we ever have more more than 2 panels
-        var isFirstChart = position === 0;
-        var newDashboardItems = isFirstChart
+        const isFirstChart = position === 0;
+        const newDashboardItems = isFirstChart
             ? [value, dashboardItems[1]]
             : [dashboardItems[0], value];
         setDashboardItems(newDashboardItems);
     };
-    return (_jsx(Select, { items: items, selectedKey: defaultValue, onSelection: onSelection, placeholder: placeholderText !== null && placeholderText !== void 0 ? placeholderText : 'Select view type...', primary: primary, disabled: disabled }));
+    return (_jsx(Select, { items: items, selectedKey: defaultValue, onSelection: onSelection, placeholder: placeholderText ?? 'Select view type...', primary: primary, disabled: disabled }));
 };
 export default ViewSelector;