@grafana/scenes 6.0.0--canary.979.12373078054.0 → 6.0.0--canary.979.12745482012.0

package/dist/index.js

@@ -41,19 +41,19 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var uFuzzy__default = /*#__PURE__*/_interopDefaultLegacy(uFuzzy);
 var ReactGridLayout__default = /*#__PURE__*/_interopDefaultLegacy(ReactGridLayout);
 
-var __defProp$Q = Object.defineProperty;
-var __getOwnPropSymbols$Q = Object.getOwnPropertySymbols;
-var __hasOwnProp$Q = Object.prototype.hasOwnProperty;
-var __propIsEnum$Q = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$Q = (obj, key, value) => key in obj ? __defProp$Q(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$Q = (a, b) => {
+var __defProp$R = Object.defineProperty;
+var __getOwnPropSymbols$R = Object.getOwnPropertySymbols;
+var __hasOwnProp$R = Object.prototype.hasOwnProperty;
+var __propIsEnum$R = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$R = (obj, key, value) => key in obj ? __defProp$R(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$R = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$Q.call(b, prop))
-      __defNormalProp$Q(a, prop, b[prop]);
-  if (__getOwnPropSymbols$Q)
-    for (var prop of __getOwnPropSymbols$Q(b)) {
-      if (__propIsEnum$Q.call(b, prop))
-        __defNormalProp$Q(a, prop, b[prop]);
+    if (__hasOwnProp$R.call(b, prop))
+      __defNormalProp$R(a, prop, b[prop]);
+  if (__getOwnPropSymbols$R)
+    for (var prop of __getOwnPropSymbols$R(b)) {
+      if (__propIsEnum$R.call(b, prop))
+        __defNormalProp$R(a, prop, b[prop]);
     }
   return a;
 };
@@ -62,7 +62,7 @@ function useAppQueryParams() {
   return runtime.locationSearchToObject(location.search || "");
 }
 function getUrlWithAppState(path, searchObject, preserveParams) {
-  const paramsCopy = __spreadValues$Q({}, searchObject);
+  const paramsCopy = __spreadValues$R({}, searchObject);
   if (preserveParams) {
     for (const key of Object.keys(paramsCopy)) {
       if (!preserveParams.includes(key)) {
@@ -92,31 +92,31 @@ function useSceneRouteMatch(path) {
   return match;
 }
 
-var __defProp$P = Object.defineProperty;
-var __defProps$x = Object.defineProperties;
-var __getOwnPropDescs$x = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$P = Object.getOwnPropertySymbols;
-var __hasOwnProp$P = Object.prototype.hasOwnProperty;
-var __propIsEnum$P = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$P = (obj, key, value) => key in obj ? __defProp$P(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$P = (a, b) => {
+var __defProp$Q = Object.defineProperty;
+var __defProps$y = Object.defineProperties;
+var __getOwnPropDescs$y = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$Q = Object.getOwnPropertySymbols;
+var __hasOwnProp$Q = Object.prototype.hasOwnProperty;
+var __propIsEnum$Q = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$Q = (obj, key, value) => key in obj ? __defProp$Q(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$Q = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$P.call(b, prop))
-      __defNormalProp$P(a, prop, b[prop]);
-  if (__getOwnPropSymbols$P)
-    for (var prop of __getOwnPropSymbols$P(b)) {
-      if (__propIsEnum$P.call(b, prop))
-        __defNormalProp$P(a, prop, b[prop]);
+    if (__hasOwnProp$Q.call(b, prop))
+      __defNormalProp$Q(a, prop, b[prop]);
+  if (__getOwnPropSymbols$Q)
+    for (var prop of __getOwnPropSymbols$Q(b)) {
+      if (__propIsEnum$Q.call(b, prop))
+        __defNormalProp$Q(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$x = (a, b) => __defProps$x(a, __getOwnPropDescs$x(b));
+var __spreadProps$y = (a, b) => __defProps$y(a, __getOwnPropDescs$y(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$x(__spreadValues$P({}, plugin.meta), {
+  plugin.meta = __spreadProps$y(__spreadValues$Q({}, plugin.meta), {
     id: pluginId,
     name: pluginId,
     module: "runtime plugin",
@@ -144,33 +144,33 @@ function loadPanelPluginSync(pluginId) {
   return (_a = getPanelPluginFromCache(pluginId)) != null ? _a : runtimePanelPlugins.get(pluginId);
 }
 
-var __defProp$O = Object.defineProperty;
-var __defProps$w = Object.defineProperties;
-var __getOwnPropDescs$w = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$O = Object.getOwnPropertySymbols;
-var __hasOwnProp$O = Object.prototype.hasOwnProperty;
-var __propIsEnum$O = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$O = (obj, key, value) => key in obj ? __defProp$O(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$O = (a, b) => {
+var __defProp$P = Object.defineProperty;
+var __defProps$x = Object.defineProperties;
+var __getOwnPropDescs$x = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$P = Object.getOwnPropertySymbols;
+var __hasOwnProp$P = Object.prototype.hasOwnProperty;
+var __propIsEnum$P = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$P = (obj, key, value) => key in obj ? __defProp$P(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$P = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$O.call(b, prop))
-      __defNormalProp$O(a, prop, b[prop]);
-  if (__getOwnPropSymbols$O)
-    for (var prop of __getOwnPropSymbols$O(b)) {
-      if (__propIsEnum$O.call(b, prop))
-        __defNormalProp$O(a, prop, b[prop]);
+    if (__hasOwnProp$P.call(b, prop))
+      __defNormalProp$P(a, prop, b[prop]);
+  if (__getOwnPropSymbols$P)
+    for (var prop of __getOwnPropSymbols$P(b)) {
+      if (__propIsEnum$P.call(b, prop))
+        __defNormalProp$P(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$w = (a, b) => __defProps$w(a, __getOwnPropDescs$w(b));
+var __spreadProps$x = (a, b) => __defProps$x(a, __getOwnPropDescs$x(b));
 var __objRest$5 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$O.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$P.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$O)
-    for (var prop of __getOwnPropSymbols$O(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$O.call(source, prop))
+  if (source != null && __getOwnPropSymbols$P)
+    for (var prop of __getOwnPropSymbols$P(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$P.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -188,7 +188,7 @@ function SceneComponentWrapperWithoutMemo(_a) {
   if (!model.isActive && !model.renderBeforeActivation) {
     return null;
   }
-  return /* @__PURE__ */ React__default["default"].createElement(Component, __spreadProps$w(__spreadValues$O({}, otherProps), {
+  return /* @__PURE__ */ React__default["default"].createElement(Component, __spreadProps$x(__spreadValues$P({}, otherProps), {
     model
   }));
 }
@@ -204,49 +204,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$N = Object.defineProperty;
-var __getOwnPropSymbols$N = Object.getOwnPropertySymbols;
-var __hasOwnProp$N = Object.prototype.hasOwnProperty;
-var __propIsEnum$N = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$N = (obj, key, value) => key in obj ? __defProp$N(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$N = (a, b) => {
+var __defProp$O = Object.defineProperty;
+var __getOwnPropSymbols$O = Object.getOwnPropertySymbols;
+var __hasOwnProp$O = Object.prototype.hasOwnProperty;
+var __propIsEnum$O = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$O = (obj, key, value) => key in obj ? __defProp$O(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$O = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$N.call(b, prop))
-      __defNormalProp$N(a, prop, b[prop]);
-  if (__getOwnPropSymbols$N)
-    for (var prop of __getOwnPropSymbols$N(b)) {
-      if (__propIsEnum$N.call(b, prop))
-        __defNormalProp$N(a, prop, b[prop]);
+    if (__hasOwnProp$O.call(b, prop))
+      __defNormalProp$O(a, prop, b[prop]);
+  if (__getOwnPropSymbols$O)
+    for (var prop of __getOwnPropSymbols$O(b)) {
+      if (__propIsEnum$O.call(b, prop))
+        __defNormalProp$O(a, prop, b[prop]);
     }
   return a;
 };
@@ -313,7 +313,7 @@ class SceneObjectBase {
   }
   setState(update) {
     const prevState = this._state;
-    const newState = __spreadValues$N(__spreadValues$N({}, this._state), update);
+    const newState = __spreadValues$O(__spreadValues$O({}, this._state), update);
     this._state = Object.freeze(newState);
     this._setParent(update);
     this._handleActivationOfChangedStateProps(prevState, newState);
@@ -509,19 +509,19 @@ function forEachChild(state, callback) {
   }
 }
 
-var __defProp$M = Object.defineProperty;
-var __getOwnPropSymbols$M = Object.getOwnPropertySymbols;
-var __hasOwnProp$M = Object.prototype.hasOwnProperty;
-var __propIsEnum$M = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$M = (obj, key, value) => key in obj ? __defProp$M(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$M = (a, b) => {
+var __defProp$N = Object.defineProperty;
+var __getOwnPropSymbols$N = Object.getOwnPropertySymbols;
+var __hasOwnProp$N = Object.prototype.hasOwnProperty;
+var __propIsEnum$N = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$N = (obj, key, value) => key in obj ? __defProp$N(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$N = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$M.call(b, prop))
-      __defNormalProp$M(a, prop, b[prop]);
-  if (__getOwnPropSymbols$M)
-    for (var prop of __getOwnPropSymbols$M(b)) {
-      if (__propIsEnum$M.call(b, prop))
-        __defNormalProp$M(a, prop, b[prop]);
+    if (__hasOwnProp$N.call(b, prop))
+      __defNormalProp$N(a, prop, b[prop]);
+  if (__getOwnPropSymbols$N)
+    for (var prop of __getOwnPropSymbols$N(b)) {
+      if (__propIsEnum$N.call(b, prop))
+        __defNormalProp$N(a, prop, b[prop]);
     }
   return a;
 };
@@ -530,7 +530,7 @@ function cloneSceneObject(sceneObject, withState) {
   return new sceneObject.constructor(clonedState);
 }
 function cloneSceneObjectState(sceneState, withState) {
-  const clonedState = __spreadValues$M({}, sceneState);
+  const clonedState = __spreadValues$N({}, sceneState);
   Object.assign(clonedState, withState);
   for (const key in clonedState) {
     if (withState && withState[key] !== void 0) {
@@ -631,6 +631,305 @@ 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 profileDuration = measurementStartTs - profileStartTs;
+        writeSceneLog(
+          this.constructor.name,
+          "Stoped recording, total measured time (network included):",
+          profileDuration + slowFramesTime
+        );
+        __privateSet$3(this, _trailAnimationFrameId, null);
+        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,
+            jsHeapSizeLimit: performance.memory ? performance.memory.jsHeapSizeLimit : 0,
+            usedJSHeapSize: performance.memory ? performance.memory.usedJSHeapSize : 0,
+            totalJSHeapSize: performance.memory ? performance.memory.totalJSHeapSize : 0
+          });
+        }
+        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$M = Object.defineProperty;
+var __defProps$w = Object.defineProperties;
+var __getOwnPropDescs$w = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$M = Object.getOwnPropertySymbols;
+var __hasOwnProp$M = Object.prototype.hasOwnProperty;
+var __propIsEnum$M = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$M = (obj, key, value) => key in obj ? __defProp$M(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$M = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$M.call(b, prop))
+      __defNormalProp$M(a, prop, b[prop]);
+  if (__getOwnPropSymbols$M)
+    for (var prop of __getOwnPropSymbols$M(b)) {
+      if (__propIsEnum$M.call(b, prop))
+        __defNormalProp$M(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$w = (a, b) => __defProps$w(a, __getOwnPropDescs$w(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$w(__spreadValues$M({}, 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) {
+    if (!this.state.enableProfiling) {
+      return;
+    }
+    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 && this.state.enableProfiling) {
+      if (entry) {
+        this.profiler.addCrumb(`${entry.origin.constructor.name}/${entry.type}`);
+      }
+      if (this.profiler.isTailRecording()) {
+        writeSceneLog(this.constructor.name, "New query started, cancelling tail recording");
+        this.profiler.cancelTailRecording();
+      }
+    }
+    if (this.state.enableProfiling) {
+      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$L = Object.defineProperty;
 var __getOwnPropSymbols$L = Object.getOwnPropertySymbols;
 var __hasOwnProp$L = Object.prototype.hasOwnProperty;
@@ -732,9 +1031,12 @@ function parseUrlParam(value) {
   return null;
 }
 
-function evaluateTimeRange(from, to, timeZone, fiscalYearStartMonth, delay) {
+function evaluateTimeRange(from, to, timeZone, fiscalYearStartMonth, delay, weekStart) {
   const hasDelay = delay && to === "now";
   const now = Date.now();
+  if (weekStart) {
+    setWeekStartIfDifferent(weekStart);
+  }
   const parseOrToDateTime = (val, options) => {
     if (data.dateMath.toDateTime) {
       return data.dateMath.toDateTime(val, options);
@@ -761,6 +1063,13 @@ function evaluateTimeRange(from, to, timeZone, fiscalYearStartMonth, delay) {
     }
   };
 }
+let prevWeekStart;
+function setWeekStartIfDifferent(weekStart) {
+  if (weekStart !== prevWeekStart) {
+    prevWeekStart = weekStart;
+    data.setWeekStart(weekStart);
+  }
+}
 
 function isValid$1(value, roundUp, timeZone) {
   if (data.isDateTime(value)) {
@@ -800,7 +1109,8 @@ class SceneTimeRange extends SceneObjectBase {
       to,
       timeZone || data.getTimeZone(),
       state.fiscalYearStartMonth,
-      state.UNSAFE_nowDelay
+      state.UNSAFE_nowDelay,
+      state.weekStart
     );
     const refreshOnActivate = (_a = state.refreshOnActivate) != null ? _a : { percent: 10 };
     super(__spreadValues$K({ from, to, timeZone, value, refreshOnActivate }, state));
@@ -822,9 +1132,12 @@ class SceneTimeRange extends SceneObjectBase {
         update.to,
         this.getTimeZone(),
         this.state.fiscalYearStartMonth,
-        this.state.UNSAFE_nowDelay
+        this.state.UNSAFE_nowDelay,
+        this.state.weekStart
       );
       if (update.from !== this.state.from || update.to !== this.state.to) {
+        const queryController = getQueryController(this);
+        queryController == null ? void 0 : queryController.startProfile(this);
         this._urlSync.performBrowserHistoryAction(() => {
           this.setState(update);
         });
@@ -836,15 +1149,7 @@ class SceneTimeRange extends SceneObjectBase {
       });
     };
     this.onRefresh = () => {
-      this.setState({
-        value: evaluateTimeRange(
-          this.state.from,
-          this.state.to,
-          this.getTimeZone(),
-          this.state.fiscalYearStartMonth,
-          this.state.UNSAFE_nowDelay
-        )
-      });
+      this.refreshRange(0);
       this.publishEvent(new runtime.RefreshEvent(), true);
     };
     this.addActivationHandler(this._onActivate.bind(this));
@@ -856,23 +1161,12 @@ class SceneTimeRange extends SceneObjectBase {
         this._subs.add(
           timeZoneSource.subscribeToState((n, p) => {
             if (n.timeZone !== void 0 && n.timeZone !== p.timeZone) {
-              this.setState({
-                value: evaluateTimeRange(
-                  this.state.from,
-                  this.state.to,
-                  timeZoneSource.getTimeZone(),
-                  this.state.fiscalYearStartMonth,
-                  this.state.UNSAFE_nowDelay
-                )
-              });
+              this.refreshRange(0);
             }
           })
         );
       }
     }
-    if (this.state.weekStart) {
-      data.setWeekStart(this.state.weekStart);
-    }
     if (data.rangeUtil.isRelativeTimeRange(this.state.value.raw)) {
       this.refreshIfStale();
     }
@@ -917,13 +1211,12 @@ class SceneTimeRange extends SceneObjectBase {
       this.state.to,
       (_a = this.state.timeZone) != null ? _a : data.getTimeZone(),
       this.state.fiscalYearStartMonth,
-      this.state.UNSAFE_nowDelay
+      this.state.UNSAFE_nowDelay,
+      this.state.weekStart
     );
     const diff = value.to.diff(this.state.value.to, "milliseconds");
     if (diff >= refreshAfterMs) {
-      this.setState({
-        value
-      });
+      this.setState({ value });
     }
   }
   calculatePercentOfInterval(percent) {
@@ -982,7 +1275,8 @@ class SceneTimeRange extends SceneObjectBase {
       (_b = update.to) != null ? _b : this.state.to,
       (_c = update.timeZone) != null ? _c : this.getTimeZone(),
       this.state.fiscalYearStartMonth,
-      this.state.UNSAFE_nowDelay
+      this.state.UNSAFE_nowDelay,
+      this.state.weekStart
     );
     return this.setState(update);
   }
@@ -1647,12 +1941,12 @@ class MultiValueVariable extends SceneObjectBase {
   setStateHelper(state) {
     setBaseClassState(this, state);
   }
-  getOptionsForSelect() {
+  getOptionsForSelect(includeCurrentValue = true) {
     let options = this.state.options;
     if (this.state.includeAll) {
       options = [{ value: ALL_VARIABLE_VALUE, label: ALL_VARIABLE_TEXT }, ...options];
     }
-    if (!Array.isArray(this.state.value)) {
+    if (includeCurrentValue && !Array.isArray(this.state.value)) {
       const current = options.find((x) => x.value === this.state.value);
       if (!current) {
         options = [{ value: this.state.value, label: String(this.state.text) }, ...options];
@@ -2179,70 +2473,55 @@ 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);
+function registerQueryWithController(entry) {
+  return (queryStream) => {
+    const queryControler = sceneGraph.getQueryController(entry.origin);
+    if (!queryControler) {
+      return queryStream;
     }
-  }
+    return new rxjs.Observable((observer) => {
+      if (!entry.cancel) {
+        entry.cancel = () => observer.complete();
+      }
+      queryControler.queryStarted(entry);
+      let markedAsCompleted = false;
+      const sub = queryStream.subscribe({
+        next: (v) => {
+          if (!markedAsCompleted && v.state !== schema.LoadingState.Loading) {
+            markedAsCompleted = true;
+            queryControler.queryCompleted(entry);
+          }
+          observer.next(v);
+        },
+        error: (e) => observer.error(e),
+        complete: () => {
+          observer.complete();
+        }
+      });
+      return () => {
+        sub.unsubscribe();
+        if (!markedAsCompleted) {
+          queryControler.queryCompleted(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);
-  }
+function wrapPromiseInStateObservable(promise) {
+  return new rxjs.Observable((observer) => {
+    observer.next({ state: schema.LoadingState.Loading });
+    const promiseObservable = rxjs.from(promise);
+    promiseObservable.pipe(
+      rxjs.map(() => ({ state: schema.LoadingState.Done })),
+      rxjs.catchError(() => {
+        observer.next({ state: schema.LoadingState.Error });
+        return [];
+      })
+    ).subscribe({
+      next: (result) => observer.next(result),
+      complete: () => observer.complete()
+    });
+  });
 }
 
 async function getDataSource(datasource, scopedVars) {
@@ -2255,7 +2534,21 @@ async function getDataSource(datasource, scopedVars) {
   if (datasource && datasource.query) {
     return datasource;
   }
-  return await runtime.getDataSourceSrv().get(datasource, scopedVars);
+  const dsPromise = runtime.getDataSourceSrv().get(datasource, scopedVars);
+  if (scopedVars.__sceneObject && scopedVars.__sceneObject.value.valueOf()) {
+    const queryControler = sceneGraph.getQueryController(scopedVars.__sceneObject.value.valueOf());
+    if (queryControler && queryControler.state.enableProfiling) {
+      wrapPromiseInStateObservable(dsPromise).pipe(
+        registerQueryWithController({
+          type: "plugin",
+          origin: scopedVars.__sceneObject.value.valueOf()
+        })
+      ).subscribe(() => {
+      });
+    }
+  }
+  const result = await dsPromise;
+  return result;
 }
 
 class VariableValueRecorder {
@@ -2497,53 +2790,18 @@ function patchGetAdhocFilters(filterVar) {
 function findActiveAdHocFilterVariableByUid(dsUid) {
   var _a;
   for (const filter of allActiveFilterSets.values()) {
-    if (((_a = filter.state.datasource) == null ? void 0 : _a.uid) === dsUid) {
+    if (interpolate(filter, (_a = filter.state.datasource) == null ? void 0 : _a.uid) === dsUid) {
       return filter;
     }
   }
   return void 0;
 }
 
-function registerQueryWithController(entry) {
-  return (queryStream) => {
-    const queryControler = sceneGraph.getQueryController(entry.origin);
-    if (!queryControler) {
-      return queryStream;
-    }
-    return new rxjs.Observable((observer) => {
-      if (!entry.cancel) {
-        entry.cancel = () => observer.complete();
-      }
-      queryControler.queryStarted(entry);
-      let markedAsCompleted = false;
-      const sub = queryStream.subscribe({
-        next: (v) => {
-          if (!markedAsCompleted && v.state !== schema.LoadingState.Loading) {
-            markedAsCompleted = true;
-            queryControler.queryCompleted(entry);
-          }
-          observer.next(v);
-        },
-        error: (e) => observer.error(e),
-        complete: () => {
-          observer.complete();
-        }
-      });
-      return () => {
-        sub.unsubscribe();
-        if (!markedAsCompleted) {
-          queryControler.queryCompleted(entry);
-        }
-      };
-    });
-  };
-}
-
 const allActiveGroupByVariables = /* @__PURE__ */ new Set();
 function findActiveGroupByVariablesByUid(dsUid) {
   var _a;
   for (const groupByVariable of allActiveGroupByVariables.values()) {
-    if (((_a = groupByVariable.state.datasource) == null ? void 0 : _a.uid) === dsUid) {
+    if (interpolate(groupByVariable, (_a = groupByVariable.state.datasource) == null ? void 0 : _a.uid) === dsUid) {
       return groupByVariable;
     }
   }
@@ -2613,6 +2871,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") {
@@ -2652,6 +2911,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__);
       }
@@ -2672,6 +2932,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);
@@ -2717,6 +2978,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}`),
@@ -2978,10 +3240,12 @@ class GroupByVariable extends MultiValueVariable {
       }
       return keys;
     };
-    this.addActivationHandler(() => {
-      allActiveGroupByVariables.add(this);
-      return () => allActiveGroupByVariables.delete(this);
-    });
+    if (this.state.applyMode === "auto") {
+      this.addActivationHandler(() => {
+        allActiveGroupByVariables.add(this);
+        return () => allActiveGroupByVariables.delete(this);
+      });
+    }
   }
   validateAndUpdate() {
     return this.getValueOptions({}).pipe(
@@ -3643,7 +3907,7 @@ class AdHocFiltersVariableUrlSyncHandler {
     if (filters.length === 0) {
       return { [this.getKey()]: [""] };
     }
-    const value = filters.filter(isFilterComplete).map((filter) => toArray(filter).map(escapeUrlPipeDelimiters).join("|"));
+    const value = filters.filter(isFilterComplete).filter((filter) => !filter.hidden).map((filter) => toArray(filter).map(escapeUrlPipeDelimiters).join("|"));
     return { [this.getKey()]: value };
   }
   updateFromUrl(values) {
@@ -3846,13 +4110,20 @@ const VIRTUAL_LIST_OVERSCAN = 5;
 const VIRTUAL_LIST_ITEM_HEIGHT = 38;
 const VIRTUAL_LIST_ITEM_HEIGHT_WITH_DESCRIPTION = 60;
 const ERROR_STATE_DROPDOWN_WIDTH = 366;
-function fuzzySearchOptions(options) {
+const REGEXP_NON_ASCII = /[^ -~]/m;
+function searchOptions(options) {
   const haystack = options.map((o) => {
     var _a;
     return (_a = o.label) != null ? _a : o.value;
   });
   const fuzzySearch = getFuzzySearcher(haystack);
   return (search, filterInputType) => {
+    if (REGEXP_NON_ASCII.test(search)) {
+      return options.filter((o) => {
+        var _a, _b;
+        return ((_a = o.label) == null ? void 0 : _a.includes(search)) || ((_b = o.value) == null ? void 0 : _b.includes(search)) || false;
+      });
+    }
     if (filterInputType === "operator" && search !== "") {
       search = `"${search}"`;
     }
@@ -4192,7 +4463,7 @@ const AdHocCombobox = React.forwardRef(function AdHocCombobox2({ filter, model,
   const listRef = React.useRef([]);
   const disabledIndicesRef = React.useRef([]);
   const filterInputTypeRef = React.useRef(!isAlwaysWip ? "value" : "key");
-  const optionsSearcher = React.useMemo(() => fuzzySearchOptions(options), [options]);
+  const optionsSearcher = React.useMemo(() => searchOptions(options), [options]);
   const isLastFilter = React.useMemo(() => {
     if (isAlwaysWip) {
       return false;
@@ -5089,6 +5360,21 @@ class AdHocFiltersVariable extends SceneObjectBase {
       this.publishEvent(new SceneVariableValueChangedEvent(this), true);
     }
   }
+  updateFilters(filters, options) {
+    let filterExpressionChanged = false;
+    let filterExpression = void 0;
+    if (filters && filters !== this.state.filters) {
+      filterExpression = renderExpression(this.state.expressionBuilder, filters);
+      filterExpressionChanged = filterExpression !== this.state.filterExpression;
+    }
+    super.setState({
+      filters,
+      filterExpression
+    });
+    if (filterExpressionChanged && (options == null ? void 0 : options.skipPublish) !== true || (options == null ? void 0 : options.forcePublish)) {
+      this.publishEvent(new SceneVariableValueChangedEvent(this), true);
+    }
+  }
   getValue() {
     return this.state.filterExpression;
   }
@@ -5234,7 +5520,7 @@ function AdHocFiltersVariableRenderer({ model }) {
   }
   return /* @__PURE__ */ React__default["default"].createElement("div", {
     className: styles.wrapper
-  }, filters.map((filter, index) => /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, {
+  }, filters.filter((filter) => !filter.hidden).map((filter, index) => /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, {
     key: index
   }, /* @__PURE__ */ React__default["default"].createElement(AdHocFilterRenderer, {
     filter,
@@ -5349,7 +5635,7 @@ class SceneQueryRunner extends SceneObjectBase {
     this._results = new rxjs.ReplaySubject(1);
     this._scopedVars = { __sceneObject: wrapInSafeSerializableSceneObject(this) };
     this._variableDependency = new VariableDependencyConfig(this, {
-      statePaths: ["queries", "datasource"],
+      statePaths: ["queries", "datasource", "minInterval"],
       onVariableUpdateCompleted: this.onVariableUpdatesCompleted.bind(this),
       onAnyVariableChanged: this.onAnyVariableChanged.bind(this)
     });
@@ -5586,7 +5872,7 @@ class SceneQueryRunner extends SceneObjectBase {
     try {
       const datasource = (_c = this.state.datasource) != null ? _c : findFirstDatasource(queries);
       const ds = await getDataSource(datasource, this._scopedVars);
-      this.findAndSubscribeToAdHocFilters(datasource == null ? void 0 : datasource.uid);
+      this.findAndSubscribeToAdHocFilters(ds.uid);
       const runRequest = runtime.getRunRequest();
       const { primary, secondaries, processors } = this.prepareRequests(timeRange, ds);
       writeSceneLog("SceneQueryRunner", "Starting runRequest", this.state.key);
@@ -5715,13 +6001,13 @@ class SceneQueryRunner extends SceneObjectBase {
     });
     return Array.from(found.values());
   }
-  findAndSubscribeToAdHocFilters(uid) {
-    const filtersVar = findActiveAdHocFilterVariableByUid(uid);
+  findAndSubscribeToAdHocFilters(interpolatedUid) {
+    const filtersVar = findActiveAdHocFilterVariableByUid(interpolatedUid);
     if (this._adhocFiltersVar !== filtersVar) {
       this._adhocFiltersVar = filtersVar;
       this._updateExplicitVariableDependencies();
     }
-    const groupByVar = findActiveGroupByVariablesByUid(uid);
+    const groupByVar = findActiveGroupByVariablesByUid(interpolatedUid);
     if (this._groupByVar !== groupByVar) {
       this._groupByVar = groupByVar;
       this._updateExplicitVariableDependencies();
@@ -5815,13 +6101,16 @@ function escapeLokiRegexp(value) {
   return value.replace(RE2_METACHARACTERS, "\\$&");
 }
 function getQueriesForVariables(sourceObject) {
+  var _a;
   const runners = sceneGraph.findAllObjects(
     sourceObject.getRoot(),
     (o) => o instanceof SceneQueryRunner
   );
+  const interpolatedDsUuid = sceneGraph.interpolate(sourceObject, (_a = sourceObject.state.datasource) == null ? void 0 : _a.uid);
   const applicableRunners = filterOutInactiveRunnerDuplicates(runners).filter((r) => {
-    var _a, _b;
-    return ((_a = r.state.datasource) == null ? void 0 : _a.uid) === ((_b = sourceObject.state.datasource) == null ? void 0 : _b.uid);
+    var _a2;
+    const interpolatedQueryDsUuid = sceneGraph.interpolate(sourceObject, (_a2 = r.state.datasource) == null ? void 0 : _a2.uid);
+    return interpolatedQueryDsUuid === interpolatedDsUuid;
   });
   if (applicableRunners.length === 0) {
     return [];
@@ -6121,6 +6410,12 @@ const hasCustomVariableSupport = (datasource) => {
   const variableSupport = datasource.variables;
   return "query" in variableSupport && "editor" in variableSupport && Boolean(variableSupport.query) && Boolean(variableSupport.editor);
 };
+const hasDataSourceVariableSupport = (datasource) => {
+  if (!datasource.variables) {
+    return false;
+  }
+  return datasource.variables.getType() === data.VariableSupportType.Datasource;
+};
 
 var __defProp$w = Object.defineProperty;
 var __defProps$k = Object.defineProperties;
@@ -6216,6 +6511,29 @@ class CustomQueryRunner {
     return this._runRequest(this.datasource, request, this.datasource.variables.query.bind(this.datasource.variables));
   }
 }
+const variableDummyRefId = "variable-query";
+class DatasourceQueryRunner {
+  constructor(datasource, _runRequest = runtime.getRunRequest()) {
+    this.datasource = datasource;
+    this._runRequest = _runRequest;
+  }
+  getTarget(variable) {
+    var _a;
+    if (hasDataSourceVariableSupport(this.datasource)) {
+      if (typeof variable.state.query === "string") {
+        return variable.state.query;
+      }
+      return __spreadProps$k(__spreadValues$w({}, variable.state.query), { refId: (_a = variable.state.query.refId) != null ? _a : variableDummyRefId });
+    }
+    throw new Error("Couldn't create a target with supplied arguments.");
+  }
+  runRequest(_, request) {
+    if (!hasDataSourceVariableSupport(this.datasource)) {
+      return getEmptyMetricFindValueObservable();
+    }
+    return this._runRequest(this.datasource, request, this.datasource.query);
+  }
+}
 function getEmptyMetricFindValueObservable() {
   return rxjs.of({ state: data.LoadingState.Done, series: [], timeRange: data.getDefaultTimeRange() });
 }
@@ -6229,6 +6547,9 @@ function createQueryVariableRunnerFactory(datasource) {
   if (hasCustomVariableSupport(datasource)) {
     return new CustomQueryRunner(datasource);
   }
+  if (hasDataSourceVariableSupport(datasource)) {
+    return new DatasourceQueryRunner(datasource);
+  }
   throw new Error(`Couldn't create a query runner for datasource ${datasource.type}`);
 }
 let createQueryVariableRunner = createQueryVariableRunnerFactory;
@@ -6305,28 +6626,6 @@ const sortVariableValues = (options, sortOrder) => {
   if (sortOrder === data.VariableSort.disabled) {
     return options;
   }
-  const sortByNumeric = (opt) => {
-    if (!opt.text) {
-      return -1;
-    }
-    const matches = opt.text.match(/.*?(\d+).*/);
-    if (!matches || matches.length < 2) {
-      return -1;
-    } else {
-      return parseInt(matches[1], 10);
-    }
-  };
-  const sortByNaturalSort = (options2) => {
-    return options2.sort((a, b) => {
-      if (!a.text) {
-        return -1;
-      }
-      if (!b.text) {
-        return 1;
-      }
-      return a.text.localeCompare(b.text, void 0, { numeric: true });
-    });
-  };
   switch (sortOrder) {
     case data.VariableSort.alphabeticalAsc:
       options = lodash.sortBy(options, "label");
@@ -6362,6 +6661,23 @@ const sortVariableValues = (options, sortOrder) => {
   }
   return options;
 };
+function sortByNumeric(opt) {
+  if (!opt.label) {
+    return -1;
+  }
+  const matches = opt.label.match(/.*?(\d+).*/);
+  if (!matches || matches.length < 2) {
+    return -1;
+  } else {
+    return parseInt(matches[1], 10);
+  }
+}
+const collator = new Intl.Collator(void 0, { sensitivity: "accent", numeric: true });
+function sortByNaturalSort(options) {
+  return options.slice().sort((a, b) => {
+    return collator.compare(a.label, b.label);
+  });
+}
 
 function toMetricFindValues() {
   return (source) => source.pipe(
@@ -6717,30 +7033,6 @@ function findDescendents(scene, descendentType) {
   const targetScenes = findAllObjects(scene, isDescendentType);
   return targetScenes.filter(isDescendentType);
 }
-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;
-}
-function getUrlSyncManager(sceneObject) {
-  let parent = sceneObject;
-  while (parent) {
-    if ("urlSyncManager" in parent.state) {
-      return parent.state.urlSyncManager;
-    }
-    parent = parent.parent;
-  }
-  return void 0;
-}
 
 const sceneGraph = {
   getVariables,
@@ -6756,9 +7048,8 @@ const sceneGraph = {
   findObject,
   findAllObjects,
   getAncestor,
-  findDescendents,
   getQueryController,
-  getUrlSyncManager
+  findDescendents
 };
 
 class UniqueUrlKeyMapper {
@@ -7580,7 +7871,8 @@ class VizPanel extends SceneObjectBase {
           sceneTimeRange.state.to,
           sceneTimeRange.getTimeZone(),
           sceneTimeRange.state.fiscalYearStartMonth,
-          sceneTimeRange.state.UNSAFE_nowDelay
+          sceneTimeRange.state.UNSAFE_nowDelay,
+          sceneTimeRange.state.weekStart
         );
       }
       const plugin = this.getPlugin();
@@ -7727,7 +8019,13 @@ class VizPanel extends SceneObjectBase {
     } else {
       const { importPanelPlugin } = runtime.getPluginImportUtils();
       try {
-        const result = await importPanelPlugin(pluginId);
+        const panelPromise = importPanelPlugin(pluginId);
+        const queryControler = sceneGraph.getQueryController(this);
+        if (queryControler && queryControler.state.enableProfiling) {
+          wrapPromiseInStateObservable(panelPromise).pipe(registerQueryWithController({ type: "plugin", origin: this })).subscribe(() => {
+          });
+        }
+        const result = await panelPromise;
         this._pluginLoaded(result, overwriteOptions, overwriteFieldConfig, isAfterPluginChange);
       } catch (err) {
         this._pluginLoaded(getPanelPluginNotFound(pluginId));
@@ -8691,7 +8989,8 @@ class SceneTimeZoneOverride extends SceneTimeRangeTransformerBase {
         timeRange.to,
         this.state.timeZone,
         timeRange.fiscalYearStartMonth,
-        timeRange.UNSAFE_nowDelay
+        timeRange.UNSAFE_nowDelay,
+        timeRange.weekStart
       )
     }));
   }
@@ -8699,14 +8998,16 @@ class SceneTimeZoneOverride extends SceneTimeRangeTransformerBase {
     return this.state.timeZone;
   }
   onTimeZoneChange(timeZone) {
+    const parentTimeRange = this.getAncestorTimeRange();
     this.setState({
       timeZone,
       value: evaluateTimeRange(
-        this.state.from,
-        this.state.to,
-        this.state.timeZone,
-        this.getAncestorTimeRange().state.fiscalYearStartMonth,
-        this.state.UNSAFE_nowDelay
+        parentTimeRange.state.from,
+        parentTimeRange.state.to,
+        timeZone,
+        parentTimeRange.state.fiscalYearStartMonth,
+        parentTimeRange.state.UNSAFE_nowDelay,
+        parentTimeRange.state.weekStart
       )
     });
   }
@@ -11313,6 +11614,7 @@ class SceneRefreshPicker extends SceneObjectBase {
     this._autoRefreshBlocked = false;
     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;
@@ -11368,6 +11670,8 @@ class SceneRefreshPicker extends SceneObjectBase {
       }
       this._intervalTimer = setInterval(() => {
         if (this.isTabVisible()) {
+          const queryController = sceneGraph.getQueryController(this);
+          queryController == null ? void 0 : queryController.startProfile(this);
           timeRange.onRefresh();
         } else {
           this._autoRefreshBlocked = true;
@@ -11441,7 +11745,9 @@ function SceneRefreshPickerRenderer({ model }) {
     tooltip,
     width,
     text,
-    onRefresh: model.onRefresh,
+    onRefresh: () => {
+      model.onRefresh();
+    },
     primary,
     onIntervalChanged: model.onIntervalChanged,
     isLoading: isRunning,