@grafana/scenes 5.7.4 → 5.7.5--canary.858.10369282107.0

package/dist/index.js

@@ -41,19 +41,19 @@ var uFuzzy__default = /*#__PURE__*/_interopDefaultLegacy(uFuzzy);
 var ReactGridLayout__default = /*#__PURE__*/_interopDefaultLegacy(ReactGridLayout);
 var AutoSizer__default = /*#__PURE__*/_interopDefaultLegacy(AutoSizer);
 
-var __defProp$K = Object.defineProperty;
-var __getOwnPropSymbols$K = Object.getOwnPropertySymbols;
-var __hasOwnProp$K = Object.prototype.hasOwnProperty;
-var __propIsEnum$K = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$K = (obj, key, value) => key in obj ? __defProp$K(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$K = (a, b) => {
+var __defProp$L = Object.defineProperty;
+var __getOwnPropSymbols$L = Object.getOwnPropertySymbols;
+var __hasOwnProp$L = Object.prototype.hasOwnProperty;
+var __propIsEnum$L = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$L = (obj, key, value) => key in obj ? __defProp$L(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$L = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$K.call(b, prop))
-      __defNormalProp$K(a, prop, b[prop]);
-  if (__getOwnPropSymbols$K)
-    for (var prop of __getOwnPropSymbols$K(b)) {
-      if (__propIsEnum$K.call(b, prop))
-        __defNormalProp$K(a, prop, b[prop]);
+    if (__hasOwnProp$L.call(b, prop))
+      __defNormalProp$L(a, prop, b[prop]);
+  if (__getOwnPropSymbols$L)
+    for (var prop of __getOwnPropSymbols$L(b)) {
+      if (__propIsEnum$L.call(b, prop))
+        __defNormalProp$L(a, prop, b[prop]);
     }
   return a;
 };
@@ -62,7 +62,7 @@ function useAppQueryParams() {
   return runtime.locationSearchToObject(location.search || "");
 }
 function getUrlWithAppState(path, preserveParams) {
-  const paramsCopy = __spreadValues$K({}, runtime.locationService.getSearchObject());
+  const paramsCopy = __spreadValues$L({}, runtime.locationService.getSearchObject());
   if (preserveParams) {
     for (const key of Object.keys(paramsCopy)) {
       if (!preserveParams.includes(key)) {
@@ -76,31 +76,31 @@ function renderSceneComponentWithRouteProps(sceneObject, routeProps) {
   return React__default["default"].createElement(sceneObject.Component, { model: sceneObject, routeProps });
 }
 
-var __defProp$J = Object.defineProperty;
-var __defProps$t = Object.defineProperties;
-var __getOwnPropDescs$t = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$J = Object.getOwnPropertySymbols;
-var __hasOwnProp$J = Object.prototype.hasOwnProperty;
-var __propIsEnum$J = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$J = (obj, key, value) => key in obj ? __defProp$J(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$J = (a, b) => {
+var __defProp$K = Object.defineProperty;
+var __defProps$u = Object.defineProperties;
+var __getOwnPropDescs$u = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$K = Object.getOwnPropertySymbols;
+var __hasOwnProp$K = Object.prototype.hasOwnProperty;
+var __propIsEnum$K = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$K = (obj, key, value) => key in obj ? __defProp$K(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$K = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$J.call(b, prop))
-      __defNormalProp$J(a, prop, b[prop]);
-  if (__getOwnPropSymbols$J)
-    for (var prop of __getOwnPropSymbols$J(b)) {
-      if (__propIsEnum$J.call(b, prop))
-        __defNormalProp$J(a, prop, b[prop]);
+    if (__hasOwnProp$K.call(b, prop))
+      __defNormalProp$K(a, prop, b[prop]);
+  if (__getOwnPropSymbols$K)
+    for (var prop of __getOwnPropSymbols$K(b)) {
+      if (__propIsEnum$K.call(b, prop))
+        __defNormalProp$K(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$t = (a, b) => __defProps$t(a, __getOwnPropDescs$t(b));
+var __spreadProps$u = (a, b) => __defProps$u(a, __getOwnPropDescs$u(b));
 const runtimePanelPlugins = /* @__PURE__ */ new Map();
 function registerRuntimePanelPlugin({ pluginId, plugin }) {
   if (runtimePanelPlugins.has(pluginId)) {
     throw new Error(`A runtime panel plugin with id ${pluginId} has already been registered`);
   }
-  plugin.meta = __spreadProps$t(__spreadValues$J({}, plugin.meta), {
+  plugin.meta = __spreadProps$u(__spreadValues$K({}, plugin.meta), {
     id: pluginId,
     name: pluginId,
     module: "runtime plugin",
@@ -128,33 +128,33 @@ function loadPanelPluginSync(pluginId) {
   return (_a = getPanelPluginFromCache(pluginId)) != null ? _a : runtimePanelPlugins.get(pluginId);
 }
 
-var __defProp$I = Object.defineProperty;
-var __defProps$s = Object.defineProperties;
-var __getOwnPropDescs$s = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$I = Object.getOwnPropertySymbols;
-var __hasOwnProp$I = Object.prototype.hasOwnProperty;
-var __propIsEnum$I = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$I = (obj, key, value) => key in obj ? __defProp$I(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$I = (a, b) => {
+var __defProp$J = Object.defineProperty;
+var __defProps$t = Object.defineProperties;
+var __getOwnPropDescs$t = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$J = Object.getOwnPropertySymbols;
+var __hasOwnProp$J = Object.prototype.hasOwnProperty;
+var __propIsEnum$J = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$J = (obj, key, value) => key in obj ? __defProp$J(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$J = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$I.call(b, prop))
-      __defNormalProp$I(a, prop, b[prop]);
-  if (__getOwnPropSymbols$I)
-    for (var prop of __getOwnPropSymbols$I(b)) {
-      if (__propIsEnum$I.call(b, prop))
-        __defNormalProp$I(a, prop, b[prop]);
+    if (__hasOwnProp$J.call(b, prop))
+      __defNormalProp$J(a, prop, b[prop]);
+  if (__getOwnPropSymbols$J)
+    for (var prop of __getOwnPropSymbols$J(b)) {
+      if (__propIsEnum$J.call(b, prop))
+        __defNormalProp$J(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$s = (a, b) => __defProps$s(a, __getOwnPropDescs$s(b));
+var __spreadProps$t = (a, b) => __defProps$t(a, __getOwnPropDescs$t(b));
 var __objRest$4 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$I.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$J.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$I)
-    for (var prop of __getOwnPropSymbols$I(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$I.call(source, prop))
+  if (source != null && __getOwnPropSymbols$J)
+    for (var prop of __getOwnPropSymbols$J(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$J.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -172,7 +172,7 @@ function SceneComponentWrapperWithoutMemo(_a) {
   if (!model.isActive) {
     return null;
   }
-  return /* @__PURE__ */ React__default["default"].createElement(Component, __spreadProps$s(__spreadValues$I({}, otherProps), {
+  return /* @__PURE__ */ React__default["default"].createElement(Component, __spreadProps$t(__spreadValues$J({}, otherProps), {
     model
   }));
 }
@@ -188,49 +188,49 @@ class UserActionEvent extends data.BusEventWithPayload {
 }
 UserActionEvent.type = "scene-object-user-action";
 
-var __accessCheck$3 = (obj, member, msg) => {
+var __accessCheck$4 = (obj, member, msg) => {
   if (!member.has(obj))
     throw TypeError("Cannot " + msg);
 };
-var __privateGet$3 = (obj, member, getter) => {
-  __accessCheck$3(obj, member, "read from private field");
+var __privateGet$4 = (obj, member, getter) => {
+  __accessCheck$4(obj, member, "read from private field");
   return getter ? getter.call(obj) : member.get(obj);
 };
-var __privateAdd$3 = (obj, member, value) => {
+var __privateAdd$4 = (obj, member, value) => {
   if (member.has(obj))
     throw TypeError("Cannot add the same private member more than once");
   member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 };
-var __privateSet$2 = (obj, member, value, setter) => {
-  __accessCheck$3(obj, member, "write to private field");
+var __privateSet$4 = (obj, member, value, setter) => {
+  __accessCheck$4(obj, member, "write to private field");
   setter ? setter.call(obj, value) : member.set(obj, value);
   return value;
 };
 var _ref;
 class SceneObjectRef {
   constructor(ref) {
-    __privateAdd$3(this, _ref, void 0);
-    __privateSet$2(this, _ref, ref);
+    __privateAdd$4(this, _ref, void 0);
+    __privateSet$4(this, _ref, ref);
   }
   resolve() {
-    return __privateGet$3(this, _ref);
+    return __privateGet$4(this, _ref);
   }
 }
 _ref = new WeakMap();
 
-var __defProp$H = Object.defineProperty;
-var __getOwnPropSymbols$H = Object.getOwnPropertySymbols;
-var __hasOwnProp$H = Object.prototype.hasOwnProperty;
-var __propIsEnum$H = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$H = (obj, key, value) => key in obj ? __defProp$H(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$H = (a, b) => {
+var __defProp$I = Object.defineProperty;
+var __getOwnPropSymbols$I = Object.getOwnPropertySymbols;
+var __hasOwnProp$I = Object.prototype.hasOwnProperty;
+var __propIsEnum$I = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$I = (obj, key, value) => key in obj ? __defProp$I(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$I = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$H.call(b, prop))
-      __defNormalProp$H(a, prop, b[prop]);
-  if (__getOwnPropSymbols$H)
-    for (var prop of __getOwnPropSymbols$H(b)) {
-      if (__propIsEnum$H.call(b, prop))
-        __defNormalProp$H(a, prop, b[prop]);
+    if (__hasOwnProp$I.call(b, prop))
+      __defNormalProp$I(a, prop, b[prop]);
+  if (__getOwnPropSymbols$I)
+    for (var prop of __getOwnPropSymbols$I(b)) {
+      if (__propIsEnum$I.call(b, prop))
+        __defNormalProp$I(a, prop, b[prop]);
     }
   return a;
 };
@@ -290,7 +290,7 @@ class SceneObjectBase {
   }
   setState(update) {
     const prevState = this._state;
-    const newState = __spreadValues$H(__spreadValues$H({}, this._state), update);
+    const newState = __spreadValues$I(__spreadValues$I({}, this._state), update);
     this._state = Object.freeze(newState);
     this._setParent(update);
     this._handleActivationOfChangedStateProps(prevState, newState);
@@ -486,19 +486,19 @@ function forEachChild(state, callback) {
   }
 }
 
-var __defProp$G = Object.defineProperty;
-var __getOwnPropSymbols$G = Object.getOwnPropertySymbols;
-var __hasOwnProp$G = Object.prototype.hasOwnProperty;
-var __propIsEnum$G = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$G = (obj, key, value) => key in obj ? __defProp$G(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$G = (a, b) => {
+var __defProp$H = Object.defineProperty;
+var __getOwnPropSymbols$H = Object.getOwnPropertySymbols;
+var __hasOwnProp$H = Object.prototype.hasOwnProperty;
+var __propIsEnum$H = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$H = (obj, key, value) => key in obj ? __defProp$H(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$H = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$G.call(b, prop))
-      __defNormalProp$G(a, prop, b[prop]);
-  if (__getOwnPropSymbols$G)
-    for (var prop of __getOwnPropSymbols$G(b)) {
-      if (__propIsEnum$G.call(b, prop))
-        __defNormalProp$G(a, prop, b[prop]);
+    if (__hasOwnProp$H.call(b, prop))
+      __defNormalProp$H(a, prop, b[prop]);
+  if (__getOwnPropSymbols$H)
+    for (var prop of __getOwnPropSymbols$H(b)) {
+      if (__propIsEnum$H.call(b, prop))
+        __defNormalProp$H(a, prop, b[prop]);
     }
   return a;
 };
@@ -507,7 +507,7 @@ function cloneSceneObject(sceneObject, withState) {
   return new sceneObject.constructor(clonedState);
 }
 function cloneSceneObjectState(sceneState, withState) {
-  const clonedState = __spreadValues$G({}, sceneState);
+  const clonedState = __spreadValues$H({}, sceneState);
   for (const key in clonedState) {
     const propValue = clonedState[key];
     if (propValue instanceof SceneObjectBase) {
@@ -604,6 +604,302 @@ function lookupVariable(name, sceneObject) {
   return null;
 }
 
+function writeSceneLog(logger, message, ...rest) {
+  let loggingEnabled = false;
+  if (typeof window !== "undefined") {
+    loggingEnabled = localStorage.getItem("grafana.debug.scenes") === "true";
+  }
+  if (loggingEnabled) {
+    console.log(`${logger}: `, message, ...rest);
+  }
+}
+
+var __accessCheck$3 = (obj, member, msg) => {
+  if (!member.has(obj))
+    throw TypeError("Cannot " + msg);
+};
+var __privateGet$3 = (obj, member, getter) => {
+  __accessCheck$3(obj, member, "read from private field");
+  return getter ? getter.call(obj) : member.get(obj);
+};
+var __privateAdd$3 = (obj, member, value) => {
+  if (member.has(obj))
+    throw TypeError("Cannot add the same private member more than once");
+  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+};
+var __privateSet$3 = (obj, member, value, setter) => {
+  __accessCheck$3(obj, member, "write to private field");
+  setter ? setter.call(obj, value) : member.set(obj, value);
+  return value;
+};
+var _profileInProgress, _profileStartTs, _trailAnimationFrameId, _recordedTrailingSpans;
+const POST_STORM_WINDOW = 2e3;
+const SPAN_THRESHOLD = 30;
+class SceneRenderProfiler {
+  constructor(queryController) {
+    this.queryController = queryController;
+    __privateAdd$3(this, _profileInProgress, null);
+    __privateAdd$3(this, _profileStartTs, null);
+    __privateAdd$3(this, _trailAnimationFrameId, null);
+    __privateAdd$3(this, _recordedTrailingSpans, []);
+    this.lastFrameTime = 0;
+    this.measureTrailingFrames = (measurementStartTs, lastFrameTime, profileStartTs) => {
+      const currentFrameTime = performance.now();
+      const frameLength = currentFrameTime - lastFrameTime;
+      __privateGet$3(this, _recordedTrailingSpans).push(frameLength);
+      if (currentFrameTime - measurementStartTs < POST_STORM_WINDOW) {
+        __privateSet$3(this, _trailAnimationFrameId, requestAnimationFrame(
+          () => this.measureTrailingFrames(measurementStartTs, currentFrameTime, profileStartTs)
+        ));
+      } else {
+        const slowFrames = processRecordedSpans(__privateGet$3(this, _recordedTrailingSpans));
+        const slowFramesTime = slowFrames.reduce((acc, val) => acc + val, 0);
+        writeSceneLog(
+          this.constructor.name,
+          "Profile tail recorded, slow frames duration:",
+          slowFramesTime,
+          slowFrames,
+          __privateGet$3(this, _profileInProgress)
+        );
+        __privateSet$3(this, _recordedTrailingSpans, []);
+        const n = performance.now();
+        const profileDuration = measurementStartTs - profileStartTs;
+        writeSceneLog(
+          this.constructor.name,
+          "Stoped recording, total measured time (network included):",
+          profileDuration + slowFramesTime
+        );
+        __privateSet$3(this, _trailAnimationFrameId, null);
+        performance.measure("DashboardInteraction tail", {
+          start: measurementStartTs,
+          end: measurementStartTs + n
+        });
+        const profileEndTs = profileStartTs + profileDuration + slowFramesTime;
+        performance.measure("DashboardInteraction", {
+          start: profileStartTs,
+          end: profileEndTs
+        });
+        const networkDuration = captureNetwork(profileStartTs, profileEndTs);
+        if (this.queryController.state.onProfileComplete) {
+          this.queryController.state.onProfileComplete({
+            origin: __privateGet$3(this, _profileInProgress).origin,
+            crumbs: __privateGet$3(this, _profileInProgress).crumbs,
+            duration: profileDuration + slowFramesTime,
+            networkDuration
+          });
+        }
+        if (window.__runs) {
+          window.__runs += `${Date.now()}, ${profileDuration + slowFramesTime}
+`;
+        } else {
+          window.__runs = `${Date.now()}, ${profileDuration + slowFramesTime}
+`;
+        }
+      }
+    };
+  }
+  startProfile(name) {
+    if (__privateGet$3(this, _trailAnimationFrameId)) {
+      cancelAnimationFrame(__privateGet$3(this, _trailAnimationFrameId));
+      __privateSet$3(this, _trailAnimationFrameId, null);
+      writeSceneLog(this.constructor.name, "New profile: Stopped recording frames");
+    }
+    __privateSet$3(this, _profileInProgress, { origin: name, crumbs: [] });
+    __privateSet$3(this, _profileStartTs, performance.now());
+    writeSceneLog(this.constructor.name, "Profile started:", __privateGet$3(this, _profileInProgress), __privateGet$3(this, _profileStartTs));
+  }
+  recordProfileTail(measurementStartTime, profileStartTs) {
+    __privateSet$3(this, _trailAnimationFrameId, requestAnimationFrame(
+      () => this.measureTrailingFrames(measurementStartTime, measurementStartTime, profileStartTs)
+    ));
+  }
+  tryCompletingProfile() {
+    writeSceneLog(this.constructor.name, "Trying to complete profile", __privateGet$3(this, _profileInProgress));
+    if (this.queryController.runningQueriesCount() === 0 && __privateGet$3(this, _profileInProgress)) {
+      writeSceneLog(this.constructor.name, "All queries completed, stopping profile");
+      this.recordProfileTail(performance.now(), __privateGet$3(this, _profileStartTs));
+    }
+  }
+  isTailRecording() {
+    return Boolean(__privateGet$3(this, _trailAnimationFrameId));
+  }
+  cancelTailRecording() {
+    if (__privateGet$3(this, _trailAnimationFrameId)) {
+      cancelAnimationFrame(__privateGet$3(this, _trailAnimationFrameId));
+      __privateSet$3(this, _trailAnimationFrameId, null);
+      writeSceneLog(this.constructor.name, "Cancelled recording frames, new profile started");
+    }
+  }
+  addCrumb(crumb) {
+    if (__privateGet$3(this, _profileInProgress)) {
+      __privateGet$3(this, _profileInProgress).crumbs.push(crumb);
+    }
+  }
+}
+_profileInProgress = new WeakMap();
+_profileStartTs = new WeakMap();
+_trailAnimationFrameId = new WeakMap();
+_recordedTrailingSpans = new WeakMap();
+function processRecordedSpans(spans) {
+  for (let i = spans.length - 1; i >= 0; i--) {
+    if (spans[i] > SPAN_THRESHOLD) {
+      return spans.slice(0, i + 1);
+    }
+  }
+  return [spans[0]];
+}
+function captureNetwork(startTs, endTs) {
+  const entries = performance.getEntriesByType("resource");
+  performance.clearResourceTimings();
+  const networkEntries = entries.filter((entry) => entry.startTime >= startTs && entry.startTime <= endTs);
+  for (const entry of networkEntries) {
+    performance.measure("Network entry " + entry.name, {
+      start: entry.startTime,
+      end: entry.responseEnd
+    });
+  }
+  return calculateNetworkTime(networkEntries);
+}
+function calculateNetworkTime(requests) {
+  if (requests.length === 0) {
+    return 0;
+  }
+  requests.sort((a, b) => a.startTime - b.startTime);
+  let totalNetworkTime = 0;
+  let currentStart = requests[0].startTime;
+  let currentEnd = requests[0].responseEnd;
+  for (let i = 1; i < requests.length; i++) {
+    if (requests[i].startTime <= currentEnd) {
+      currentEnd = Math.max(currentEnd, requests[i].responseEnd);
+    } else {
+      totalNetworkTime += currentEnd - currentStart;
+      currentStart = requests[i].startTime;
+      currentEnd = requests[i].responseEnd;
+    }
+  }
+  totalNetworkTime += currentEnd - currentStart;
+  return totalNetworkTime;
+}
+
+var __defProp$G = Object.defineProperty;
+var __defProps$s = Object.defineProperties;
+var __getOwnPropDescs$s = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$G = Object.getOwnPropertySymbols;
+var __hasOwnProp$G = Object.prototype.hasOwnProperty;
+var __propIsEnum$G = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$G = (obj, key, value) => key in obj ? __defProp$G(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$G = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$G.call(b, prop))
+      __defNormalProp$G(a, prop, b[prop]);
+  if (__getOwnPropSymbols$G)
+    for (var prop of __getOwnPropSymbols$G(b)) {
+      if (__propIsEnum$G.call(b, prop))
+        __defNormalProp$G(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$s = (a, b) => __defProps$s(a, __getOwnPropDescs$s(b));
+var __accessCheck$2 = (obj, member, msg) => {
+  if (!member.has(obj))
+    throw TypeError("Cannot " + msg);
+};
+var __privateGet$2 = (obj, member, getter) => {
+  __accessCheck$2(obj, member, "read from private field");
+  return getter ? getter.call(obj) : member.get(obj);
+};
+var __privateAdd$2 = (obj, member, value) => {
+  if (member.has(obj))
+    throw TypeError("Cannot add the same private member more than once");
+  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+};
+var __privateSet$2 = (obj, member, value, setter) => {
+  __accessCheck$2(obj, member, "write to private field");
+  setter ? setter.call(obj, value) : member.set(obj, value);
+  return value;
+};
+var _running, _tryCompleteProfileFrameId;
+function isQueryController(s) {
+  return "isQueryController" in s;
+}
+class SceneQueryController extends SceneObjectBase {
+  constructor(state = {}) {
+    super(__spreadProps$s(__spreadValues$G({}, state), { isRunning: false }));
+    this.isQueryController = true;
+    this.profiler = new SceneRenderProfiler(this);
+    __privateAdd$2(this, _running, /* @__PURE__ */ new Set());
+    __privateAdd$2(this, _tryCompleteProfileFrameId, null);
+    this.runningQueriesCount = () => {
+      return __privateGet$2(this, _running).size;
+    };
+    this.addActivationHandler(() => {
+      return () => __privateGet$2(this, _running).clear();
+    });
+  }
+  startProfile(source) {
+    this.profiler.startProfile(source.constructor.name);
+  }
+  queryStarted(entry) {
+    __privateGet$2(this, _running).add(entry);
+    this.changeRunningQueryCount(1, entry);
+    if (!this.state.isRunning) {
+      this.setState({ isRunning: true });
+    }
+  }
+  queryCompleted(entry) {
+    if (!__privateGet$2(this, _running).has(entry)) {
+      return;
+    }
+    __privateGet$2(this, _running).delete(entry);
+    this.changeRunningQueryCount(-1);
+    if (__privateGet$2(this, _running).size === 0) {
+      this.setState({ isRunning: false });
+    }
+  }
+  changeRunningQueryCount(dir, entry) {
+    var _a;
+    window.__grafanaRunningQueryCount = ((_a = window.__grafanaRunningQueryCount) != null ? _a : 0) + dir;
+    if (dir === 1) {
+      if (entry) {
+        this.profiler.addCrumb(entry.origin.constructor.name);
+      }
+      if (this.profiler.isTailRecording()) {
+        writeSceneLog(this.constructor.name, "New query started, cancelling tail recording");
+        this.profiler.cancelTailRecording();
+      }
+    }
+    if (__privateGet$2(this, _tryCompleteProfileFrameId)) {
+      cancelAnimationFrame(__privateGet$2(this, _tryCompleteProfileFrameId));
+    }
+    __privateSet$2(this, _tryCompleteProfileFrameId, requestAnimationFrame(() => {
+      this.profiler.tryCompletingProfile();
+    }));
+  }
+  cancelAll() {
+    var _a;
+    for (const entry of __privateGet$2(this, _running).values()) {
+      (_a = entry.cancel) == null ? void 0 : _a.call(entry);
+    }
+  }
+}
+_running = new WeakMap();
+_tryCompleteProfileFrameId = new WeakMap();
+
+function getQueryController(sceneObject) {
+  let parent = sceneObject;
+  while (parent) {
+    if (parent.state.$behaviors) {
+      for (const behavior of parent.state.$behaviors) {
+        if (isQueryController(behavior)) {
+          return behavior;
+        }
+      }
+    }
+    parent = parent.parent;
+  }
+  return void 0;
+}
+
 var __defProp$F = Object.defineProperty;
 var __getOwnPropSymbols$F = Object.getOwnPropertySymbols;
 var __hasOwnProp$F = Object.prototype.hasOwnProperty;
@@ -760,6 +1056,8 @@ class SceneTimeRange extends SceneObjectBase {
         this.state.UNSAFE_nowDelay
       );
       if (update.from !== this.state.from || update.to !== this.state.to) {
+        const queryController = getQueryController(this);
+        queryController == null ? void 0 : queryController.startProfile(this);
         this.setState(update);
       }
     };
@@ -1782,72 +2080,6 @@ function isDataLayer(obj) {
   return "isDataLayer" in obj;
 }
 
-var __accessCheck$2 = (obj, member, msg) => {
-  if (!member.has(obj))
-    throw TypeError("Cannot " + msg);
-};
-var __privateGet$2 = (obj, member, getter) => {
-  __accessCheck$2(obj, member, "read from private field");
-  return getter ? getter.call(obj) : member.get(obj);
-};
-var __privateAdd$2 = (obj, member, value) => {
-  if (member.has(obj))
-    throw TypeError("Cannot add the same private member more than once");
-  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-};
-var _running;
-function isQueryController(s) {
-  return "isQueryController" in s;
-}
-class SceneQueryController extends SceneObjectBase {
-  constructor() {
-    super({ isRunning: false });
-    this.isQueryController = true;
-    __privateAdd$2(this, _running, /* @__PURE__ */ new Set());
-    this.addActivationHandler(() => {
-      return () => __privateGet$2(this, _running).clear();
-    });
-  }
-  queryStarted(entry) {
-    __privateGet$2(this, _running).add(entry);
-    this.changeRunningQueryCount(1);
-    if (!this.state.isRunning) {
-      this.setState({ isRunning: true });
-    }
-  }
-  queryCompleted(entry) {
-    if (!__privateGet$2(this, _running).has(entry)) {
-      return;
-    }
-    __privateGet$2(this, _running).delete(entry);
-    this.changeRunningQueryCount(-1);
-    if (__privateGet$2(this, _running).size === 0) {
-      this.setState({ isRunning: false });
-    }
-  }
-  changeRunningQueryCount(dir) {
-    var _a;
-    window.__grafanaRunningQueryCount = ((_a = window.__grafanaRunningQueryCount) != null ? _a : 0) + dir;
-  }
-  cancelAll() {
-    var _a;
-    for (const entry of __privateGet$2(this, _running).values()) {
-      (_a = entry.cancel) == null ? void 0 : _a.call(entry);
-    }
-  }
-}
-_running = new WeakMap();
-
-function writeSceneLog(logger, message, ...rest) {
-  let loggingEnabled = false;
-  if (typeof window !== "undefined") {
-    loggingEnabled = localStorage.getItem("grafana.debug.scenes") === "true";
-  }
-  if (loggingEnabled) {
-    console.log(`${logger}: `, message, ...rest);
-  }
-}
-
 async function getDataSource(datasource, scopedVars) {
   if (datasource == null ? void 0 : datasource.uid) {
     const runtimeDataSource = runtimeDataSources.get(datasource.uid);
@@ -2515,6 +2747,7 @@ function VariableValueSelect({ model }) {
   const [inputValue, setInputValue] = React.useState("");
   const [hasCustomValue, setHasCustomValue] = React.useState(false);
   const selectValue = toSelectableValue$2(value, String(text));
+  const queryController = sceneGraph.getQueryController(model);
   const optionSearcher = React.useMemo(() => getOptionSearcher(options, includeAll), [options, includeAll]);
   const onInputChange = (value2, { action }) => {
     if (action === "input-change") {
@@ -2554,6 +2787,7 @@ function VariableValueSelect({ model }) {
     "data-testid": e2eSelectors.selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownValueLinkTexts(`${value}`),
     onChange: (newValue) => {
       model.changeValueTo(newValue.value, newValue.label);
+      queryController == null ? void 0 : queryController.startProfile(model);
       if (hasCustomValue !== newValue.__isNew__) {
         setHasCustomValue(newValue.__isNew__);
       }
@@ -2565,6 +2799,7 @@ function VariableValueSelectMulti({ model }) {
   const arrayValue = React.useMemo(() => lodash.isArray(value) ? value : [value], [value]);
   const [uncommittedValue, setUncommittedValue] = React.useState(arrayValue);
   const [inputValue, setInputValue] = React.useState("");
+  const queryController = sceneGraph.getQueryController(model);
   const optionSearcher = React.useMemo(() => getOptionSearcher(options, includeAll), [options, includeAll]);
   React.useEffect(() => {
     setUncommittedValue(arrayValue);
@@ -2605,6 +2840,7 @@ function VariableValueSelectMulti({ model }) {
     onInputChange,
     onBlur: () => {
       model.changeValueTo(uncommittedValue);
+      queryController == null ? void 0 : queryController.startProfile(model);
     },
     filterOption: filterNoOp$2,
     "data-testid": e2eSelectors.selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownValueLinkTexts(`${uncommittedValue}`),
@@ -4979,20 +5215,6 @@ function getAncestor(sceneObject, ancestorType) {
   }
   return parent;
 }
-function getQueryController(sceneObject) {
-  let parent = sceneObject;
-  while (parent) {
-    if (parent.state.$behaviors) {
-      for (const behavior of parent.state.$behaviors) {
-        if (isQueryController(behavior)) {
-          return behavior;
-        }
-      }
-    }
-    parent = parent.parent;
-  }
-  return void 0;
-}
 
 const sceneGraph = {
   getVariables,
@@ -9277,6 +9499,7 @@ class SceneRefreshPicker extends SceneObjectBase {
     this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: ["refresh"] });
     this.onRefresh = () => {
       const queryController = sceneGraph.getQueryController(this);
+      queryController == null ? void 0 : queryController.startProfile(this);
       if (queryController == null ? void 0 : queryController.state.isRunning) {
         queryController.cancelAll();
         return;
@@ -9367,12 +9590,6 @@ function SceneRefreshPickerRenderer({ model }) {
   let text = refresh === ((_a = ui.RefreshPicker.autoOption) == null ? void 0 : _a.value) ? autoValue : withText ? "Refresh" : void 0;
   let tooltip;
   let width;
-  if (isRunning) {
-    tooltip = "Cancel all queries";
-    if (withText) {
-      text = "Cancel";
-    }
-  }
   if (withText) {
     width = "96px";
   }
@@ -9383,7 +9600,9 @@ function SceneRefreshPickerRenderer({ model }) {
     tooltip,
     width,
     text,
-    onRefresh: model.onRefresh,
+    onRefresh: () => {
+      model.onRefresh();
+    },
     primary,
     onIntervalChanged: model.onIntervalChanged,
     isLoading: isRunning,