@grafana/scenes 4.27.0--canary.766.9369774725.0 → 4.27.0--canary.776.9400928706.0

package/dist/index.js

@@ -11,8 +11,8 @@ var uuid = require('uuid');
 var lodash = require('lodash');
 var schema = require('@grafana/schema');
 var ui = require('@grafana/ui');
-var css = require('@emotion/css');
 var e2eSelectors = require('@grafana/e2e-selectors');
+var css = require('@emotion/css');
 var uFuzzy = require('@leeoniya/ufuzzy');
 var reactUse = require('react-use');
 var operators = require('rxjs/operators');
@@ -77,8 +77,8 @@ function renderSceneComponentWithRouteProps(sceneObject, routeProps) {
 }
 
 var __defProp$J = Object.defineProperty;
-var __defProps$s = Object.defineProperties;
-var __getOwnPropDescs$s = Object.getOwnPropertyDescriptors;
+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;
@@ -94,13 +94,13 @@ var __spreadValues$J = (a, b) => {
     }
   return a;
 };
-var __spreadProps$s = (a, b) => __defProps$s(a, __getOwnPropDescs$s(b));
+var __spreadProps$t = (a, b) => __defProps$t(a, __getOwnPropDescs$t(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$s(__spreadValues$J({}, plugin.meta), {
+  plugin.meta = __spreadProps$t(__spreadValues$J({}, plugin.meta), {
     id: pluginId,
     name: pluginId,
     module: "runtime plugin",
@@ -129,8 +129,8 @@ function loadPanelPluginSync(pluginId) {
 }
 
 var __defProp$I = Object.defineProperty;
-var __defProps$r = Object.defineProperties;
-var __getOwnPropDescs$r = Object.getOwnPropertyDescriptors;
+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;
@@ -146,7 +146,7 @@ var __spreadValues$I = (a, b) => {
     }
   return a;
 };
-var __spreadProps$r = (a, b) => __defProps$r(a, __getOwnPropDescs$r(b));
+var __spreadProps$s = (a, b) => __defProps$s(a, __getOwnPropDescs$s(b));
 var __objRest$4 = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -172,7 +172,7 @@ function SceneComponentWrapperWithoutMemo(_a) {
   if (!model.isActive) {
     return null;
   }
-  return /* @__PURE__ */ React__default["default"].createElement(Component, __spreadProps$r(__spreadValues$I({}, otherProps), {
+  return /* @__PURE__ */ React__default["default"].createElement(Component, __spreadProps$s(__spreadValues$I({}, otherProps), {
     model
   }));
 }
@@ -1347,7 +1347,7 @@ function sceneInterpolator(sceneObject, target, scopedVars, format, interpolatio
       }
       return match;
     }
-    const value = formatValue(variable, variable.getValue(fieldPath), fmt);
+    const value = formatValue(sceneObject, variable, variable.getValue(fieldPath), fmt);
     if (interpolations) {
       interpolations.push({ match, variableName, fieldPath, format: fmt, value, found: value !== match });
     }
@@ -1368,12 +1368,12 @@ function lookupFormatVariable(name, match, scopedVars, sceneObject) {
   }
   return null;
 }
-function formatValue(variable, value, formatNameOrFn) {
+function formatValue(context, variable, value, formatNameOrFn) {
   if (value === null || value === void 0) {
     return "";
   }
   if (isCustomVariableValue(value)) {
-    return value.formatter(formatNameOrFn);
+    return sceneInterpolator(context, value.formatter(formatNameOrFn));
   }
   if (!Array.isArray(value) && typeof value === "object") {
     value = `${value}`;
@@ -1749,8 +1749,8 @@ function collectAllVariables(sceneObject, record = {}) {
 }
 
 var __defProp$D = Object.defineProperty;
-var __defProps$q = Object.defineProperties;
-var __getOwnPropDescs$q = Object.getOwnPropertyDescriptors;
+var __defProps$r = Object.defineProperties;
+var __getOwnPropDescs$r = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$D = Object.getOwnPropertySymbols;
 var __hasOwnProp$D = Object.prototype.hasOwnProperty;
 var __propIsEnum$D = Object.prototype.propertyIsEnumerable;
@@ -1766,7 +1766,7 @@ var __spreadValues$D = (a, b) => {
     }
   return a;
 };
-var __spreadProps$q = (a, b) => __defProps$q(a, __getOwnPropDescs$q(b));
+var __spreadProps$r = (a, b) => __defProps$r(a, __getOwnPropDescs$r(b));
 function getTemplateProxyForField(field, frame, frames) {
   return new Proxy(
     {},
@@ -1782,7 +1782,7 @@ function getTemplateProxyForField(field, frame, frames) {
           if (!field.labels) {
             return "";
           }
-          return __spreadProps$q(__spreadValues$D({}, field.labels), {
+          return __spreadProps$r(__spreadValues$D({}, field.labels), {
             __values: Object.values(field.labels).sort().join(", "),
             toString: () => {
               return data.formatLabels(field.labels, "", true);
@@ -2071,7 +2071,11 @@ async function getDataSource(datasource, scopedVars) {
 }
 
 function writeSceneLog(logger, message, ...rest) {
-  if (window.grafanaSceneLogging) {
+  let loggingEnabled = false;
+  if (typeof window !== "undefined") {
+    loggingEnabled = localStorage.getItem("grafana.debug.scenes") === "true";
+  }
+  if (loggingEnabled) {
     console.log(`${logger}: `, message, ...rest);
   }
 }
@@ -2255,7 +2259,13 @@ class VariableValueRecorder {
   }
 }
 
+function isExtraQueryProvider(obj) {
+  return typeof obj === "object" && "getExtraQueries" in obj;
+}
+
 var __defProp$C = Object.defineProperty;
+var __defProps$q = Object.defineProperties;
+var __getOwnPropDescs$q = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols$C = Object.getOwnPropertySymbols;
 var __hasOwnProp$C = Object.prototype.hasOwnProperty;
 var __propIsEnum$C = Object.prototype.propertyIsEnumerable;
@@ -2271,166 +2281,29 @@ var __spreadValues$C = (a, b) => {
     }
   return a;
 };
-const PREVIOUS_PERIOD_VALUE = "__previousPeriod";
-const NO_PERIOD_VALUE = "__noPeriod";
-const PREVIOUS_PERIOD_COMPARE_OPTION = {
-  label: "Previous period",
-  value: PREVIOUS_PERIOD_VALUE
-};
-const NO_COMPARE_OPTION = {
-  label: "No comparison",
-  value: NO_PERIOD_VALUE
-};
-const DEFAULT_COMPARE_OPTIONS = [
-  { label: "Day before", value: "24h" },
-  { label: "Week before", value: "1w" },
-  { label: "Month before", value: "1M" }
-];
-class SceneTimeRangeCompare extends SceneObjectBase {
-  constructor(state) {
-    super(__spreadValues$C({ compareOptions: DEFAULT_COMPARE_OPTIONS }, state));
-    this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: ["compareWith"] });
-    this._onActivate = () => {
-      const sceneTimeRange = sceneGraph.getTimeRange(this);
-      this.setState({ compareOptions: this.getCompareOptions(sceneTimeRange.state.value) });
-      this._subs.add(
-        sceneTimeRange.subscribeToState((timeRange) => {
-          const compareOptions = this.getCompareOptions(timeRange.value);
-          const stateUpdate = { compareOptions };
-          if (Boolean(this.state.compareWith) && !compareOptions.find(({ value }) => value === this.state.compareWith)) {
-            stateUpdate.compareWith = PREVIOUS_PERIOD_VALUE;
-          }
-          this.setState(stateUpdate);
-        })
-      );
-    };
-    this.getCompareOptions = (timeRange) => {
-      const diffDays = Math.ceil(timeRange.to.diff(timeRange.from));
-      const matchIndex = DEFAULT_COMPARE_OPTIONS.findIndex(({ value }) => {
-        const intervalInMs = data.rangeUtil.intervalToMs(value);
-        return intervalInMs >= diffDays;
+var __spreadProps$q = (a, b) => __defProps$q(a, __getOwnPropDescs$q(b));
+const passthroughProcessor = (_, secondary) => rxjs.of(secondary);
+const extraQueryProcessingOperator = (processors) => (data) => {
+  return data.pipe(
+    rxjs.mergeMap(([primary, ...secondaries]) => {
+      const processedSecondaries = secondaries.flatMap((s) => {
+        var _a, _b;
+        return (_b = (_a = processors.get(s.request.requestId)) == null ? void 0 : _a(primary, s)) != null ? _b : rxjs.of(s);
+      });
+      return rxjs.forkJoin([rxjs.of(primary), ...processedSecondaries]);
+    }),
+    rxjs.map(([primary, ...processedSecondaries]) => {
+      var _a;
+      return __spreadProps$q(__spreadValues$C({}, primary), {
+        series: [...primary.series, ...processedSecondaries.flatMap((s) => s.series)],
+        annotations: [...(_a = primary.annotations) != null ? _a : [], ...processedSecondaries.flatMap((s) => {
+          var _a2;
+          return (_a2 = s.annotations) != null ? _a2 : [];
+        })]
       });
-      return [
-        NO_COMPARE_OPTION,
-        PREVIOUS_PERIOD_COMPARE_OPTION,
-        ...DEFAULT_COMPARE_OPTIONS.slice(matchIndex).map(({ label, value }) => ({ label, value }))
-      ];
-    };
-    this.onCompareWithChanged = (compareWith) => {
-      if (compareWith === NO_PERIOD_VALUE) {
-        this.onClearCompare();
-      } else {
-        this.setState({ compareWith });
-      }
-    };
-    this.onClearCompare = () => {
-      this.setState({ compareWith: void 0 });
-    };
-    this.addActivationHandler(this._onActivate);
-  }
-  getCompareTimeRange(timeRange) {
-    let compareFrom;
-    let compareTo;
-    if (this.state.compareWith) {
-      if (this.state.compareWith === PREVIOUS_PERIOD_VALUE) {
-        const diffMs = timeRange.to.diff(timeRange.from);
-        compareFrom = data.dateTime(timeRange.from).subtract(diffMs);
-        compareTo = data.dateTime(timeRange.to).subtract(diffMs);
-      } else {
-        compareFrom = data.dateTime(timeRange.from).subtract(data.rangeUtil.intervalToMs(this.state.compareWith));
-        compareTo = data.dateTime(timeRange.to).subtract(data.rangeUtil.intervalToMs(this.state.compareWith));
-      }
-      return {
-        from: compareFrom,
-        to: compareTo,
-        raw: {
-          from: compareFrom,
-          to: compareTo
-        }
-      };
-    }
-    return void 0;
-  }
-  getUrlState() {
-    return {
-      compareWith: this.state.compareWith
-    };
-  }
-  updateFromUrl(values) {
-    if (!values.compareWith) {
-      return;
-    }
-    const compareWith = parseUrlParam(values.compareWith);
-    if (compareWith) {
-      const compareOptions = this.getCompareOptions(sceneGraph.getTimeRange(this).state.value);
-      if (compareOptions.find(({ value }) => value === compareWith)) {
-        this.setState({
-          compareWith
-        });
-      } else {
-        this.setState({
-          compareWith: "__previousPeriod"
-        });
-      }
-    }
-  }
-}
-SceneTimeRangeCompare.Component = SceneTimeRangeCompareRenderer;
-function SceneTimeRangeCompareRenderer({ model }) {
-  var _a;
-  const styles = ui.useStyles2(getStyles$9);
-  const { compareWith, compareOptions } = model.useState();
-  const [previousCompare, setPreviousCompare] = React__default["default"].useState(compareWith);
-  const previousValue = (_a = compareOptions.find(({ value: value2 }) => value2 === previousCompare)) != null ? _a : PREVIOUS_PERIOD_COMPARE_OPTION;
-  const value = compareOptions.find(({ value: value2 }) => value2 === compareWith);
-  const enabled = Boolean(value);
-  const onClick = () => {
-    if (enabled) {
-      setPreviousCompare(compareWith);
-      model.onClearCompare();
-    } else if (!enabled) {
-      model.onCompareWithChanged(previousValue.value);
-    }
-  };
-  return /* @__PURE__ */ React__default["default"].createElement(ui.ButtonGroup, null, /* @__PURE__ */ React__default["default"].createElement(ui.ToolbarButton, {
-    variant: "canvas",
-    tooltip: "Enable time frame comparison",
-    onClick: (e) => {
-      e.stopPropagation();
-      e.preventDefault();
-      onClick();
-    }
-  }, /* @__PURE__ */ React__default["default"].createElement(ui.Checkbox, {
-    label: " ",
-    value: enabled,
-    onClick
-  }), "Comparison"), enabled ? /* @__PURE__ */ React__default["default"].createElement(ui.ButtonSelect, {
-    variant: "canvas",
-    value,
-    options: compareOptions,
-    onChange: (v) => {
-      model.onCompareWithChanged(v.value);
-    }
-  }) : /* @__PURE__ */ React__default["default"].createElement(ui.ToolbarButton, {
-    className: styles.previewButton,
-    disabled: true,
-    variant: "canvas",
-    isOpen: false
-  }, previousValue.label));
-}
-function getStyles$9(theme) {
-  return {
-    previewButton: css.css({
-      "&:disabled": {
-        border: `1px solid ${theme.colors.secondary.border}`,
-        color: theme.colors.text.disabled,
-        opacity: 1
-      }
     })
-  };
-}
-
-const getCompareSeriesRefId = (refId) => `${refId}-compare`;
+  );
+};
 
 var __defProp$B = Object.defineProperty;
 var __defProps$p = Object.defineProperties;
@@ -2451,59 +2324,6 @@ var __spreadValues$B = (a, b) => {
   return a;
 };
 var __spreadProps$p = (a, b) => __defProps$p(a, __getOwnPropDescs$p(b));
-function timeShiftQueryResponseOperator(data$1) {
-  return data$1.pipe(
-    rxjs.map(([p, s]) => {
-      const diff = s.timeRange.from.diff(p.timeRange.from);
-      s.series.forEach((series) => {
-        series.refId = getCompareSeriesRefId(series.refId || "");
-        series.meta = __spreadProps$p(__spreadValues$B({}, series.meta), {
-          timeCompare: {
-            diffMs: diff,
-            isTimeShiftQuery: true
-          }
-        });
-        series.fields.forEach((field) => {
-          if (field.type === data.FieldType.time) {
-            field.values = field.values.map((v) => {
-              return diff < 0 ? v - diff : v + diff;
-            });
-          }
-          field.config = __spreadProps$p(__spreadValues$B({}, field.config), {
-            color: {
-              mode: "fixed",
-              fixedColor: runtime.config.theme.palette.gray60
-            }
-          });
-          return field;
-        });
-      });
-      return __spreadProps$p(__spreadValues$B({}, p), {
-        series: [...p.series, ...s.series]
-      });
-    })
-  );
-}
-
-var __defProp$A = Object.defineProperty;
-var __defProps$o = Object.defineProperties;
-var __getOwnPropDescs$o = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$A = Object.getOwnPropertySymbols;
-var __hasOwnProp$A = Object.prototype.hasOwnProperty;
-var __propIsEnum$A = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$A = (obj, key, value) => key in obj ? __defProp$A(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$A = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$A.call(b, prop))
-      __defNormalProp$A(a, prop, b[prop]);
-  if (__getOwnPropSymbols$A)
-    for (var prop of __getOwnPropSymbols$A(b)) {
-      if (__propIsEnum$A.call(b, prop))
-        __defNormalProp$A(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$o = (a, b) => __defProps$o(a, __getOwnPropDescs$o(b));
 function filterAnnotations(data, filters) {
   var _a;
   if (!Array.isArray(data) || data.length === 0) {
@@ -2554,11 +2374,11 @@ function filterAnnotations(data, filters) {
           continue;
         }
       }
-      fields.push(__spreadProps$o(__spreadValues$A({}, field), {
+      fields.push(__spreadProps$p(__spreadValues$B({}, field), {
         values: buffer
       }));
     }
-    processed.push(__spreadProps$o(__spreadValues$A({}, frame), {
+    processed.push(__spreadProps$p(__spreadValues$B({}, frame), {
       fields,
       length: frameLength
     }));
@@ -2945,13 +2765,20 @@ class CustomAllValue {
   }
 }
 
-function getOptionSearcher(options, includeAll, limit = 1e4) {
+function getOptionSearcher(options, includeAll, value, text) {
   const ufuzzy = new uFuzzy__default["default"]();
   let allOptions = options;
   const haystack = [];
+  const limit = 1e4;
   if (includeAll) {
     allOptions = [{ value: ALL_VARIABLE_VALUE, label: ALL_VARIABLE_TEXT }, ...allOptions];
   }
+  if (!Array.isArray(value)) {
+    const current = options.find((x) => x.value === value);
+    if (!current) {
+      allOptions = [{ value, label: String(text) }, ...allOptions];
+    }
+  }
   return (search) => {
     if (search === "") {
       if (allOptions.length > limit) {
@@ -2983,33 +2810,33 @@ function getOptionSearcher(options, includeAll, limit = 1e4) {
   };
 }
 
-var __defProp$z = Object.defineProperty;
-var __defProps$n = Object.defineProperties;
-var __getOwnPropDescs$n = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$z = Object.getOwnPropertySymbols;
-var __hasOwnProp$z = Object.prototype.hasOwnProperty;
-var __propIsEnum$z = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$z = (obj, key, value) => key in obj ? __defProp$z(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$z = (a, b) => {
+var __defProp$A = Object.defineProperty;
+var __defProps$o = Object.defineProperties;
+var __getOwnPropDescs$o = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$A = Object.getOwnPropertySymbols;
+var __hasOwnProp$A = Object.prototype.hasOwnProperty;
+var __propIsEnum$A = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$A = (obj, key, value) => key in obj ? __defProp$A(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$A = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$z.call(b, prop))
-      __defNormalProp$z(a, prop, b[prop]);
-  if (__getOwnPropSymbols$z)
-    for (var prop of __getOwnPropSymbols$z(b)) {
-      if (__propIsEnum$z.call(b, prop))
-        __defNormalProp$z(a, prop, b[prop]);
+    if (__hasOwnProp$A.call(b, prop))
+      __defNormalProp$A(a, prop, b[prop]);
+  if (__getOwnPropSymbols$A)
+    for (var prop of __getOwnPropSymbols$A(b)) {
+      if (__propIsEnum$A.call(b, prop))
+        __defNormalProp$A(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$n = (a, b) => __defProps$n(a, __getOwnPropDescs$n(b));
+var __spreadProps$o = (a, b) => __defProps$o(a, __getOwnPropDescs$o(b));
 var __objRest$3 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$z.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$A.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$z)
-    for (var prop of __getOwnPropSymbols$z(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$z.call(source, prop))
+  if (source != null && __getOwnPropSymbols$A)
+    for (var prop of __getOwnPropSymbols$A(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$A.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -3020,8 +2847,8 @@ function VariableValueSelect({ model }) {
   const [inputValue, setInputValue] = React.useState("");
   const [hasCustomValue, setHasCustomValue] = React.useState(false);
   const optionSearcher = React.useMemo(
-    () => getOptionSearcher(options, includeAll),
-    [options, includeAll]
+    () => getOptionSearcher(options, includeAll, value, text),
+    [options, includeAll, value, text]
   );
   const onInputChange = (value2, { action }) => {
     if (action === "input-change") {
@@ -3044,7 +2871,6 @@ function VariableValueSelect({ model }) {
   };
   return /* @__PURE__ */ React__default["default"].createElement(ui.Select, {
     id: key,
-    isValidNewOption: (inputValue2) => inputValue2.trim().length > 0,
     placeholder: "Select value",
     width: "auto",
     value,
@@ -3067,13 +2893,13 @@ function VariableValueSelect({ model }) {
   });
 }
 function VariableValueSelectMulti({ model }) {
-  const { value, options, key, maxVisibleValues, noValueOnClear, includeAll } = model.useState();
+  const { value, text, options, key, maxVisibleValues, noValueOnClear, includeAll } = model.useState();
   const arrayValue = React.useMemo(() => lodash.isArray(value) ? value : [value], [value]);
   const [uncommittedValue, setUncommittedValue] = React.useState(arrayValue);
   const [inputValue, setInputValue] = React.useState("");
   const optionSearcher = React.useMemo(
-    () => getOptionSearcher(options, includeAll),
-    [options, includeAll]
+    () => getOptionSearcher(options, includeAll, value, text),
+    [options, includeAll, value, text]
   );
   React.useEffect(() => {
     setUncommittedValue(arrayValue);
@@ -3133,25 +2959,26 @@ const OptionWithCheckbox = ({
   isSelected,
   renderOptionLabel
 }) => {
+  var _b;
   const _a = innerProps, rest = __objRest$3(_a, ["onMouseMove", "onMouseOver"]);
   const theme = ui.useTheme2();
   const selectStyles = ui.getSelectStyles(theme);
   const optionStyles = ui.useStyles2(getOptionStyles);
-  return /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$n(__spreadValues$z({
+  return /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$o(__spreadValues$A({
     ref: innerRef,
     className: css.cx(selectStyles.option, isFocused && selectStyles.optionFocused)
   }, rest), {
-    "aria-label": "Select option",
-    "data-testid": e2eSelectors.selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownOptionTexts(
-      data.label || String(data.value)
-    ),
+    "data-testid": e2eSelectors.selectors.components.Select.option,
     title: data.title
   }), /* @__PURE__ */ React__default["default"].createElement("div", {
     className: optionStyles.checkbox
   }, /* @__PURE__ */ React__default["default"].createElement(ui.Checkbox, {
     value: isSelected
   })), /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: selectStyles.optionBody
+    className: selectStyles.optionBody,
+    "data-testid": e2eSelectors.selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownOptionTexts(
+      (_b = data.label) != null ? _b : String(data.value)
+    )
   }, /* @__PURE__ */ React__default["default"].createElement("span", null, children)));
 };
 OptionWithCheckbox.displayName = "SelectMenuOptions";
@@ -3231,28 +3058,28 @@ function fromUrlValues(urlValues) {
   );
 }
 
-var __defProp$y = Object.defineProperty;
-var __defProps$m = Object.defineProperties;
-var __getOwnPropDescs$m = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$y = Object.getOwnPropertySymbols;
-var __hasOwnProp$y = Object.prototype.hasOwnProperty;
-var __propIsEnum$y = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$y = (obj, key, value) => key in obj ? __defProp$y(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$y = (a, b) => {
+var __defProp$z = Object.defineProperty;
+var __defProps$n = Object.defineProperties;
+var __getOwnPropDescs$n = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$z = Object.getOwnPropertySymbols;
+var __hasOwnProp$z = Object.prototype.hasOwnProperty;
+var __propIsEnum$z = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$z = (obj, key, value) => key in obj ? __defProp$z(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$z = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$y.call(b, prop))
-      __defNormalProp$y(a, prop, b[prop]);
-  if (__getOwnPropSymbols$y)
-    for (var prop of __getOwnPropSymbols$y(b)) {
-      if (__propIsEnum$y.call(b, prop))
-        __defNormalProp$y(a, prop, b[prop]);
+    if (__hasOwnProp$z.call(b, prop))
+      __defNormalProp$z(a, prop, b[prop]);
+  if (__getOwnPropSymbols$z)
+    for (var prop of __getOwnPropSymbols$z(b)) {
+      if (__propIsEnum$z.call(b, prop))
+        __defNormalProp$z(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$m = (a, b) => __defProps$m(a, __getOwnPropDescs$m(b));
+var __spreadProps$n = (a, b) => __defProps$n(a, __getOwnPropDescs$n(b));
 class GroupByVariable extends MultiValueVariable {
   constructor(initialState) {
-    super(__spreadProps$m(__spreadValues$y({
+    super(__spreadProps$n(__spreadValues$z({
       isMulti: true,
       name: "",
       value: [],
@@ -3370,8 +3197,8 @@ function GroupByVariableRenderer({ model }) {
   const [inputValue, setInputValue] = React.useState("");
   const [uncommittedValue, setUncommittedValue] = React.useState(values);
   const optionSearcher = React.useMemo(
-    () => getOptionSearcher(options, includeAll),
-    [options, includeAll]
+    () => getOptionSearcher(options, includeAll, value, text),
+    [options, includeAll, value, text]
   );
   React.useEffect(() => {
     setUncommittedValue(values);
@@ -3451,7 +3278,7 @@ function LoadingIndicator(props) {
 }
 
 function ControlsLabel(props) {
-  const styles = ui.useStyles2(getStyles$8);
+  const styles = ui.useStyles2(getStyles$9);
   const theme = ui.useTheme2();
   const isVertical = props.layout === "vertical";
   const loadingIndicator = Boolean(props.isLoading) ? /* @__PURE__ */ React__default["default"].createElement("div", {
@@ -3514,7 +3341,7 @@ function ControlsLabel(props) {
   }
   return labelElement;
 }
-const getStyles$8 = (theme) => ({
+const getStyles$9 = (theme) => ({
   horizontalLabel: css.css({
     background: theme.isDark ? theme.colors.background.primary : theme.colors.background.secondary,
     display: `flex`,
@@ -3549,13 +3376,6 @@ const getStyles$8 = (theme) => ({
   })
 });
 
-function selectableValueToVariableValueOption(value) {
-  var _a;
-  return {
-    label: (_a = value.label) != null ? _a : String(value.value),
-    value: value.value
-  };
-}
 function keyLabelToOption(key, label) {
   return key !== "" ? {
     value: key,
@@ -3564,30 +3384,16 @@ function keyLabelToOption(key, label) {
 }
 function AdHocFilterRenderer({ filter, model }) {
   var _a, _b;
-  const styles = ui.useStyles2(getStyles$7);
+  const styles = ui.useStyles2(getStyles$8);
   const [keys, setKeys] = React.useState([]);
   const [values, setValues] = React.useState([]);
   const [isKeysLoading, setIsKeysLoading] = React.useState(false);
   const [isValuesLoading, setIsValuesLoading] = React.useState(false);
   const [isKeysOpen, setIsKeysOpen] = React.useState(false);
   const [isValuesOpen, setIsValuesOpen] = React.useState(false);
-  const [valueInputValue, setValueInputValue] = React.useState("");
-  const [valueHasCustomValue, setValueHasCustomValue] = React.useState(false);
   const keyValue = keyLabelToOption(filter.key, filter.keyLabel);
   const valueValue = keyLabelToOption(filter.value, filter.valueLabel);
-  const optionSearcher = React.useMemo(
-    () => getOptionSearcher(values.map(selectableValueToVariableValueOption), void 0, 1e3),
-    [values]
-  );
-  const onValueInputChange = (value, { action }) => {
-    if (action === "input-change") {
-      setValueInputValue(value);
-    }
-    return value;
-  };
-  const filteredValueOptions = optionSearcher(valueInputValue);
   const valueSelect = /* @__PURE__ */ React__default["default"].createElement(ui.Select, {
-    virtualized: true,
     allowCustomValue: true,
     isValidNewOption: (inputValue) => inputValue.trim().length > 0,
     allowCreateWhileLoading: true,
@@ -3597,33 +3403,21 @@ function AdHocFilterRenderer({ filter, model }) {
     width: "auto",
     value: valueValue,
     placeholder: "Select value",
-    options: filteredValueOptions,
-    inputValue: valueInputValue,
-    onInputChange: onValueInputChange,
-    onChange: (v) => {
-      model._updateFilter(filter, "value", v);
-      if (valueHasCustomValue !== v.__isNew__) {
-        setValueHasCustomValue(v.__isNew__);
-      }
-    },
+    options: values,
+    onChange: (v) => model._updateFilter(filter, "value", v),
     isOpen: isValuesOpen && !isValuesLoading,
     isLoading: isValuesLoading,
     autoFocus: filter.key !== "" && filter.value === "",
     openMenuOnFocus: true,
     onOpenMenu: async () => {
-      var _a2;
       setIsValuesLoading(true);
       setIsValuesOpen(true);
       const values2 = await model._getValuesFor(filter);
       setIsValuesLoading(false);
       setValues(values2);
-      if (valueHasCustomValue) {
-        setValueInputValue((_a2 = valueValue == null ? void 0 : valueValue.label) != null ? _a2 : "");
-      }
     },
     onCloseMenu: () => {
       setIsValuesOpen(false);
-      setValueInputValue("");
     }
   });
   const keySelect = /* @__PURE__ */ React__default["default"].createElement(ui.Select, {
@@ -3695,7 +3489,7 @@ function AdHocFilterRenderer({ filter, model }) {
     onClick: () => model._removeFilter(filter)
   }));
 }
-const getStyles$7 = (theme) => ({
+const getStyles$8 = (theme) => ({
   field: css.css({
     marginBottom: 0
   }),
@@ -3833,29 +3627,29 @@ function isFilter(filter) {
   return filter !== null && typeof filter.key === "string" && typeof filter.value === "string";
 }
 
-var __defProp$x = Object.defineProperty;
-var __defProps$l = Object.defineProperties;
-var __getOwnPropDescs$l = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$x = Object.getOwnPropertySymbols;
-var __hasOwnProp$x = Object.prototype.hasOwnProperty;
-var __propIsEnum$x = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$x = (obj, key, value) => key in obj ? __defProp$x(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$x = (a, b) => {
+var __defProp$y = Object.defineProperty;
+var __defProps$m = Object.defineProperties;
+var __getOwnPropDescs$m = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$y = Object.getOwnPropertySymbols;
+var __hasOwnProp$y = Object.prototype.hasOwnProperty;
+var __propIsEnum$y = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$y = (obj, key, value) => key in obj ? __defProp$y(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$y = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$x.call(b, prop))
-      __defNormalProp$x(a, prop, b[prop]);
-  if (__getOwnPropSymbols$x)
-    for (var prop of __getOwnPropSymbols$x(b)) {
-      if (__propIsEnum$x.call(b, prop))
-        __defNormalProp$x(a, prop, b[prop]);
+    if (__hasOwnProp$y.call(b, prop))
+      __defNormalProp$y(a, prop, b[prop]);
+  if (__getOwnPropSymbols$y)
+    for (var prop of __getOwnPropSymbols$y(b)) {
+      if (__propIsEnum$y.call(b, prop))
+        __defNormalProp$y(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$l = (a, b) => __defProps$l(a, __getOwnPropDescs$l(b));
+var __spreadProps$m = (a, b) => __defProps$m(a, __getOwnPropDescs$m(b));
 class AdHocFiltersVariable extends SceneObjectBase {
   constructor(state) {
     var _a, _b;
-    super(__spreadValues$x({
+    super(__spreadValues$y({
       type: "adhoc",
       name: (_a = state.name) != null ? _a : "Filters",
       filters: [],
@@ -3892,15 +3686,15 @@ class AdHocFiltersVariable extends SceneObjectBase {
     const propLabelKey = `${prop}Label`;
     if (filter === _wip) {
       if (prop === "value") {
-        this.setState({ filters: [...filters, __spreadProps$l(__spreadValues$x({}, _wip), { [prop]: value, [propLabelKey]: label })], _wip: void 0 });
+        this.setState({ filters: [...filters, __spreadProps$m(__spreadValues$y({}, _wip), { [prop]: value, [propLabelKey]: label })], _wip: void 0 });
       } else {
-        this.setState({ _wip: __spreadProps$l(__spreadValues$x({}, filter), { [prop]: value, [propLabelKey]: label }) });
+        this.setState({ _wip: __spreadProps$m(__spreadValues$y({}, filter), { [prop]: value, [propLabelKey]: label }) });
       }
       return;
     }
     const updatedFilters = this.state.filters.map((f) => {
       if (f === filter) {
-        const updatedFilter = __spreadProps$l(__spreadValues$x({}, f), { [prop]: value, [propLabelKey]: label });
+        const updatedFilter = __spreadProps$m(__spreadValues$y({}, f), { [prop]: value, [propLabelKey]: label });
         if (prop === "key" && filter[prop] !== value) {
           updatedFilter.value = "";
           updatedFilter.valueLabel = "";
@@ -3981,7 +3775,7 @@ function renderExpression(builder, filters) {
 }
 function AdHocFiltersVariableRenderer({ model }) {
   const { filters, readOnly, addFilterButtonText } = model.useState();
-  const styles = ui.useStyles2(getStyles$6);
+  const styles = ui.useStyles2(getStyles$7);
   return /* @__PURE__ */ React__default["default"].createElement("div", {
     className: styles.wrapper
   }, filters.map((filter, index) => /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, {
@@ -3995,7 +3789,7 @@ function AdHocFiltersVariableRenderer({ model }) {
     addFilterButtonText
   }));
 }
-const getStyles$6 = (theme) => ({
+const getStyles$7 = (theme) => ({
   wrapper: css.css({
     display: "flex",
     flexWrap: "wrap",
@@ -4079,25 +3873,25 @@ function areDifferentLayers(a, b) {
   return false;
 }
 
-var __defProp$w = Object.defineProperty;
-var __defProps$k = Object.defineProperties;
-var __getOwnPropDescs$k = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$w = Object.getOwnPropertySymbols;
-var __hasOwnProp$w = Object.prototype.hasOwnProperty;
-var __propIsEnum$w = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$w = (obj, key, value) => key in obj ? __defProp$w(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$w = (a, b) => {
+var __defProp$x = Object.defineProperty;
+var __defProps$l = Object.defineProperties;
+var __getOwnPropDescs$l = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$x = Object.getOwnPropertySymbols;
+var __hasOwnProp$x = Object.prototype.hasOwnProperty;
+var __propIsEnum$x = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$x = (obj, key, value) => key in obj ? __defProp$x(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$x = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$w.call(b, prop))
-      __defNormalProp$w(a, prop, b[prop]);
-  if (__getOwnPropSymbols$w)
-    for (var prop of __getOwnPropSymbols$w(b)) {
-      if (__propIsEnum$w.call(b, prop))
-        __defNormalProp$w(a, prop, b[prop]);
+    if (__hasOwnProp$x.call(b, prop))
+      __defNormalProp$x(a, prop, b[prop]);
+  if (__getOwnPropSymbols$x)
+    for (var prop of __getOwnPropSymbols$x(b)) {
+      if (__propIsEnum$x.call(b, prop))
+        __defNormalProp$x(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$k = (a, b) => __defProps$k(a, __getOwnPropDescs$k(b));
+var __spreadProps$l = (a, b) => __defProps$l(a, __getOwnPropDescs$l(b));
 let counter$1 = 100;
 function getNextRequestId$1() {
   return "SQR" + counter$1++;
@@ -4114,70 +3908,6 @@ class SceneQueryRunner extends SceneObjectBase {
       onVariableUpdateCompleted: this.onVariableUpdatesCompleted.bind(this),
       onAnyVariableChanged: this.onAnyVariableChanged.bind(this)
     });
-    this.prepareRequests = (timeRange, ds) => {
-      const comparer = this.getTimeCompare();
-      const { minInterval, queries } = this.state;
-      let secondaryRequest;
-      let request = __spreadValues$w({
-        app: "scenes",
-        requestId: getNextRequestId$1(),
-        timezone: timeRange.getTimeZone(),
-        panelId: 1,
-        range: timeRange.state.value,
-        interval: "1s",
-        intervalMs: 1e3,
-        targets: lodash.cloneDeep(queries),
-        maxDataPoints: this.getMaxDataPoints(),
-        scopedVars: this._scopedVars,
-        startTime: Date.now(),
-        liveStreaming: this.state.liveStreaming,
-        rangeRaw: {
-          from: timeRange.state.from,
-          to: timeRange.state.to
-        },
-        cacheTimeout: this.state.cacheTimeout,
-        queryCachingTTL: this.state.queryCachingTTL
-      }, getEnrichedDataRequest(this));
-      if (this._adhocFiltersVar) {
-        request.filters = this._adhocFiltersVar.state.filters.filter(isFilterComplete);
-      }
-      if (this._groupByVar) {
-        request.groupByKeys = this._groupByVar.state.value;
-      }
-      request.targets = request.targets.map((query) => {
-        var _a;
-        if (!query.datasource || query.datasource.uid !== ds.uid && !((_a = ds.meta) == null ? void 0 : _a.mixed) && runtime.isExpressionReference && !runtime.isExpressionReference(query.datasource)) {
-          query.datasource = ds.getRef();
-        }
-        return query;
-      });
-      const lowerIntervalLimit = minInterval ? minInterval : ds.interval;
-      const norm = data.rangeUtil.calculateInterval(timeRange.state.value, request.maxDataPoints, lowerIntervalLimit);
-      request.scopedVars = Object.assign({}, request.scopedVars, {
-        __interval: { text: norm.interval, value: norm.interval },
-        __interval_ms: { text: norm.intervalMs.toString(), value: norm.intervalMs }
-      });
-      request.interval = norm.interval;
-      request.intervalMs = norm.intervalMs;
-      const primaryTimeRange = timeRange.state.value;
-      if (comparer) {
-        const secondaryTimeRange = comparer.getCompareTimeRange(primaryTimeRange);
-        if (secondaryTimeRange) {
-          const secondaryTargets = request.targets.filter((query) => query.timeRangeCompare !== false);
-          if (secondaryTargets.length) {
-            secondaryRequest = __spreadProps$k(__spreadValues$w({}, request), {
-              targets: secondaryTargets,
-              range: secondaryTimeRange,
-              requestId: getNextRequestId$1()
-            });
-          }
-          request = __spreadProps$k(__spreadValues$w({}, request), {
-            range: primaryTimeRange
-          });
-        }
-      }
-      return [request, secondaryRequest];
-    };
     this.onDataReceived = (data$1) => {
       const preProcessedData = data.preProcessPanelData(data$1, this.state.data);
       this._resultAnnotations = data$1.annotations;
@@ -4196,11 +3926,11 @@ class SceneQueryRunner extends SceneObjectBase {
   }
   _onActivate() {
     const timeRange = sceneGraph.getTimeRange(this);
-    const comparer = this.getTimeCompare();
-    if (comparer) {
+    const providers = this.getClosestExtraQueryProviders();
+    for (const provider of providers) {
       this._subs.add(
-        comparer.subscribeToState((n, p) => {
-          if (n.compareWith !== p.compareWith) {
+        provider.subscribeToState((n, p) => {
+          if (provider.shouldRerun(p, n)) {
             this.runQueries();
           }
         })
@@ -4259,9 +3989,9 @@ class SceneQueryRunner extends SceneObjectBase {
       return;
     }
     this._layerAnnotations = annotations;
-    const baseStateUpdate = this.state.data ? this.state.data : __spreadProps$k(__spreadValues$w({}, emptyPanelData), { timeRange: timeRange.state.value });
+    const baseStateUpdate = this.state.data ? this.state.data : __spreadProps$l(__spreadValues$x({}, emptyPanelData), { timeRange: timeRange.state.value });
     this.setState({
-      data: __spreadProps$k(__spreadValues$w({}, baseStateUpdate), {
+      data: __spreadProps$l(__spreadValues$x({}, baseStateUpdate), {
         annotations: [...(_d = this._resultAnnotations) != null ? _d : [], ...annotations],
         alertState: alertState != null ? alertState : (_e = this.state.data) == null ? void 0 : _e.alertState
       })
@@ -4380,7 +4110,7 @@ class SceneQueryRunner extends SceneObjectBase {
       this._dataLayersSub = void 0;
     }
     this.setState({
-      data: __spreadProps$k(__spreadValues$w({}, this.state.data), { state: schema.LoadingState.Done })
+      data: __spreadProps$l(__spreadValues$x({}, this.state.data), { state: schema.LoadingState.Done })
     });
   }
   async runWithTimeRange(timeRange) {
@@ -4394,6 +4124,7 @@ class SceneQueryRunner extends SceneObjectBase {
     (_a = this._querySub) == null ? void 0 : _a.unsubscribe();
     if (this._variableDependency.hasDependencyInLoadingState()) {
       writeSceneLog("SceneQueryRunner", "Variable dependency is in loading state, skipping query execution");
+      this.setState({ data: __spreadProps$l(__spreadValues$x({}, this.state.data), { state: schema.LoadingState.Loading }) });
       return;
     }
     const { queries } = this.state;
@@ -4406,16 +4137,18 @@ class SceneQueryRunner extends SceneObjectBase {
       const ds = await getDataSource(datasource, this._scopedVars);
       this.findAndSubscribeToAdHocFilters(datasource == null ? void 0 : datasource.uid);
       const runRequest = runtime.getRunRequest();
-      const [request, secondaryRequest] = this.prepareRequests(timeRange, ds);
+      const { primary, secondaries, processors } = this.prepareRequests(timeRange, ds);
       writeSceneLog("SceneQueryRunner", "Starting runRequest", this.state.key);
-      let stream = runRequest(ds, request);
-      if (secondaryRequest) {
-        stream = rxjs.forkJoin([stream, runRequest(ds, secondaryRequest)]).pipe(timeShiftQueryResponseOperator);
+      let stream = runRequest(ds, primary);
+      if (secondaries.length > 0) {
+        const secondaryStreams = secondaries.map((r) => runRequest(ds, r));
+        const op = extraQueryProcessingOperator(processors);
+        stream = rxjs.forkJoin([stream, ...secondaryStreams]).pipe(op);
       }
       stream = stream.pipe(
         registerQueryWithController({
           type: "data",
-          request,
+          request: primary,
           origin: this,
           cancel: () => this.cancelQuery()
         })
@@ -4423,7 +4156,7 @@ class SceneQueryRunner extends SceneObjectBase {
       this._querySub = stream.subscribe(this.onDataReceived);
     } catch (err) {
       console.error("PanelQueryRunner Error", err);
-      this.onDataReceived(__spreadProps$k(__spreadValues$w(__spreadValues$w({}, emptyPanelData), this.state.data), {
+      this.onDataReceived(__spreadProps$l(__spreadValues$x(__spreadValues$x({}, emptyPanelData), this.state.data), {
         state: schema.LoadingState.Error,
         errors: [runtime.toDataQueryError(err)]
       }));
@@ -4433,16 +4166,72 @@ class SceneQueryRunner extends SceneObjectBase {
     var _a;
     const clone = super.clone(withState);
     if (this._resultAnnotations) {
-      clone["_resultAnnotations"] = this._resultAnnotations.map((frame) => __spreadValues$w({}, frame));
+      clone["_resultAnnotations"] = this._resultAnnotations.map((frame) => __spreadValues$x({}, frame));
     }
     if (this._layerAnnotations) {
-      clone["_layerAnnotations"] = this._layerAnnotations.map((frame) => __spreadValues$w({}, frame));
+      clone["_layerAnnotations"] = this._layerAnnotations.map((frame) => __spreadValues$x({}, frame));
     }
     clone["_variableValueRecorder"] = this._variableValueRecorder.cloneAndRecordCurrentValuesForSceneObject(this);
     clone["_containerWidth"] = this._containerWidth;
     clone["_results"].next({ origin: this, data: (_a = this.state.data) != null ? _a : emptyPanelData });
     return clone;
   }
+  prepareRequests(timeRange, ds) {
+    var _a;
+    const { minInterval, queries } = this.state;
+    let request = __spreadValues$x({
+      app: "scenes",
+      requestId: getNextRequestId$1(),
+      timezone: timeRange.getTimeZone(),
+      range: timeRange.state.value,
+      interval: "1s",
+      intervalMs: 1e3,
+      targets: lodash.cloneDeep(queries),
+      maxDataPoints: this.getMaxDataPoints(),
+      scopedVars: this._scopedVars,
+      startTime: Date.now(),
+      liveStreaming: this.state.liveStreaming,
+      rangeRaw: {
+        from: timeRange.state.from,
+        to: timeRange.state.to
+      },
+      cacheTimeout: this.state.cacheTimeout,
+      queryCachingTTL: this.state.queryCachingTTL
+    }, getEnrichedDataRequest(this));
+    if (this._adhocFiltersVar) {
+      request.filters = this._adhocFiltersVar.state.filters.filter(isFilterComplete);
+    }
+    if (this._groupByVar) {
+      request.groupByKeys = this._groupByVar.state.value;
+    }
+    request.targets = request.targets.map((query) => {
+      var _a2;
+      if (!query.datasource || query.datasource.uid !== ds.uid && !((_a2 = ds.meta) == null ? void 0 : _a2.mixed) && runtime.isExpressionReference && !runtime.isExpressionReference(query.datasource)) {
+        query.datasource = ds.getRef();
+      }
+      return query;
+    });
+    const lowerIntervalLimit = minInterval ? minInterval : ds.interval;
+    const norm = data.rangeUtil.calculateInterval(timeRange.state.value, request.maxDataPoints, lowerIntervalLimit);
+    request.scopedVars = Object.assign({}, request.scopedVars, {
+      __interval: { text: norm.interval, value: norm.interval },
+      __interval_ms: { text: norm.intervalMs.toString(), value: norm.intervalMs }
+    });
+    request.interval = norm.interval;
+    request.intervalMs = norm.intervalMs;
+    const primaryTimeRange = timeRange.state.value;
+    let secondaryRequests = [];
+    let secondaryProcessors = /* @__PURE__ */ new Map();
+    for (const provider of (_a = this.getClosestExtraQueryProviders()) != null ? _a : []) {
+      for (const { req, processor } of provider.getExtraQueries(request)) {
+        const requestId = getNextRequestId$1();
+        secondaryRequests.push(__spreadProps$l(__spreadValues$x({}, req), { requestId }));
+        secondaryProcessors.set(requestId, processor != null ? processor : passthroughProcessor);
+      }
+    }
+    request.range = primaryTimeRange;
+    return { primary: request, secondaries: secondaryRequests, processors: secondaryProcessors };
+  }
   _combineDataLayers(data) {
     if (this._layerAnnotations && this._layerAnnotations.length > 0) {
       data.annotations = (data.annotations || []).concat(this._layerAnnotations);
@@ -4457,22 +4246,23 @@ class SceneQueryRunner extends SceneObjectBase {
       this.setState({ data: emptyPanelData });
     }
   }
-  getTimeCompare() {
+  getClosestExtraQueryProviders() {
+    const found = /* @__PURE__ */ new Map();
     if (!this.parent) {
-      return null;
+      return [];
     }
-    return getClosest(this.parent, (s) => {
-      let found = null;
-      if (s instanceof SceneTimeRangeCompare) {
-        return s;
+    getClosest(this.parent, (s) => {
+      if (isExtraQueryProvider(s) && !found.has(s.constructor)) {
+        found.set(s.constructor, s);
       }
       s.forEachChild((child) => {
-        if (child instanceof SceneTimeRangeCompare) {
-          found = child;
+        if (isExtraQueryProvider(child) && !found.has(child.constructor)) {
+          found.set(child.constructor, child);
         }
       });
-      return found;
+      return null;
     });
+    return Array.from(found.values());
   }
   findAndSubscribeToAdHocFilters(uid) {
     const filtersVar = findActiveAdHocFilterVariableByUid(uid);
@@ -4671,28 +4461,28 @@ class ActWhenVariableChanged extends SceneObjectBase {
   }
 }
 
-var __defProp$v = Object.defineProperty;
-var __defProps$j = Object.defineProperties;
-var __getOwnPropDescs$j = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$v = Object.getOwnPropertySymbols;
-var __hasOwnProp$v = Object.prototype.hasOwnProperty;
-var __propIsEnum$v = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$v = (obj, key, value) => key in obj ? __defProp$v(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$v = (a, b) => {
+var __defProp$w = Object.defineProperty;
+var __defProps$k = Object.defineProperties;
+var __getOwnPropDescs$k = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$w = Object.getOwnPropertySymbols;
+var __hasOwnProp$w = Object.prototype.hasOwnProperty;
+var __propIsEnum$w = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$w = (obj, key, value) => key in obj ? __defProp$w(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$w = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$v.call(b, prop))
-      __defNormalProp$v(a, prop, b[prop]);
-  if (__getOwnPropSymbols$v)
-    for (var prop of __getOwnPropSymbols$v(b)) {
-      if (__propIsEnum$v.call(b, prop))
-        __defNormalProp$v(a, prop, b[prop]);
+    if (__hasOwnProp$w.call(b, prop))
+      __defNormalProp$w(a, prop, b[prop]);
+  if (__getOwnPropSymbols$w)
+    for (var prop of __getOwnPropSymbols$w(b)) {
+      if (__propIsEnum$w.call(b, prop))
+        __defNormalProp$w(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$j = (a, b) => __defProps$j(a, __getOwnPropDescs$j(b));
+var __spreadProps$k = (a, b) => __defProps$k(a, __getOwnPropDescs$k(b));
 class CursorSync extends SceneObjectBase {
   constructor(state) {
-    super(__spreadProps$j(__spreadValues$v({}, state), {
+    super(__spreadProps$k(__spreadValues$w({}, state), {
       sync: state.sync || schema.DashboardCursorSync.Off
     }));
     this.getEventsBus = (panel) => {
@@ -4956,25 +4746,25 @@ const getAlertStateStyles = (theme) => {
   };
 };
 
-var __defProp$u = Object.defineProperty;
-var __defProps$i = Object.defineProperties;
-var __getOwnPropDescs$i = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$u = Object.getOwnPropertySymbols;
-var __hasOwnProp$u = Object.prototype.hasOwnProperty;
-var __propIsEnum$u = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$u = (obj, key, value) => key in obj ? __defProp$u(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$u = (a, b) => {
+var __defProp$v = Object.defineProperty;
+var __defProps$j = Object.defineProperties;
+var __getOwnPropDescs$j = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$v = Object.getOwnPropertySymbols;
+var __hasOwnProp$v = Object.prototype.hasOwnProperty;
+var __propIsEnum$v = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$v = (obj, key, value) => key in obj ? __defProp$v(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$v = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$u.call(b, prop))
-      __defNormalProp$u(a, prop, b[prop]);
-  if (__getOwnPropSymbols$u)
-    for (var prop of __getOwnPropSymbols$u(b)) {
-      if (__propIsEnum$u.call(b, prop))
-        __defNormalProp$u(a, prop, b[prop]);
+    if (__hasOwnProp$v.call(b, prop))
+      __defNormalProp$v(a, prop, b[prop]);
+  if (__getOwnPropSymbols$v)
+    for (var prop of __getOwnPropSymbols$v(b)) {
+      if (__propIsEnum$v.call(b, prop))
+        __defNormalProp$v(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$i = (a, b) => __defProps$i(a, __getOwnPropDescs$i(b));
+var __spreadProps$j = (a, b) => __defProps$j(a, __getOwnPropDescs$j(b));
 const displayOverrideRef = "hideSeriesFrom";
 const isHideSeriesOverride = data.isSystemOverrideWithRef(displayOverrideRef);
 function seriesVisibilityConfigFactory(label, mode, fieldConfig, data) {
@@ -4984,13 +4774,13 @@ function seriesVisibilityConfigFactory(label, mode, fieldConfig, data) {
   if (currentIndex < 0) {
     if (mode === ui.SeriesVisibilityChangeMode.ToggleSelection) {
       const override3 = createOverride$1([displayName, ...getNamesOfHiddenFields(overrides, data)]);
-      return __spreadProps$i(__spreadValues$u({}, fieldConfig), {
+      return __spreadProps$j(__spreadValues$v({}, fieldConfig), {
         overrides: [...fieldConfig.overrides, override3]
       });
     }
     const displayNames = getDisplayNames(data, displayName);
     const override2 = createOverride$1(displayNames);
-    return __spreadProps$i(__spreadValues$u({}, fieldConfig), {
+    return __spreadProps$j(__spreadValues$v({}, fieldConfig), {
       overrides: [...fieldConfig.overrides, override2]
     });
   }
@@ -5003,22 +4793,22 @@ function seriesVisibilityConfigFactory(label, mode, fieldConfig, data) {
       existing = existing.filter((el) => nameOfHiddenFields.indexOf(el) < 0);
     }
     if (existing[0] === displayName && existing.length === 1) {
-      return __spreadProps$i(__spreadValues$u({}, fieldConfig), {
+      return __spreadProps$j(__spreadValues$v({}, fieldConfig), {
         overrides: overridesCopy
       });
     }
     const override2 = createOverride$1([displayName, ...nameOfHiddenFields]);
-    return __spreadProps$i(__spreadValues$u({}, fieldConfig), {
+    return __spreadProps$j(__spreadValues$v({}, fieldConfig), {
       overrides: [...overridesCopy, override2]
     });
   }
   const override = createExtendedOverride(current, displayName);
   if (allFieldsAreExcluded(override, data)) {
-    return __spreadProps$i(__spreadValues$u({}, fieldConfig), {
+    return __spreadProps$j(__spreadValues$v({}, fieldConfig), {
       overrides: overridesCopy
     });
   }
-  return __spreadProps$i(__spreadValues$u({}, fieldConfig), {
+  return __spreadProps$j(__spreadValues$v({}, fieldConfig), {
     overrides: [...overridesCopy, override]
   });
 }
@@ -5043,7 +4833,7 @@ function createOverride$1(names, mode = data.ByNamesMatcherMode.exclude, propert
       }
     },
     properties: [
-      __spreadProps$i(__spreadValues$u({}, property), {
+      __spreadProps$j(__spreadValues$v({}, property), {
         value: {
           viz: true,
           legend: false,
@@ -5115,32 +4905,32 @@ const getNamesOfHiddenFields = (overrides, data$1) => {
   return names;
 };
 
-var __defProp$t = Object.defineProperty;
-var __defProps$h = Object.defineProperties;
-var __getOwnPropDescs$h = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$t = Object.getOwnPropertySymbols;
-var __hasOwnProp$t = Object.prototype.hasOwnProperty;
-var __propIsEnum$t = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$t = (obj, key, value) => key in obj ? __defProp$t(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$t = (a, b) => {
+var __defProp$u = Object.defineProperty;
+var __defProps$i = Object.defineProperties;
+var __getOwnPropDescs$i = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$u = Object.getOwnPropertySymbols;
+var __hasOwnProp$u = Object.prototype.hasOwnProperty;
+var __propIsEnum$u = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$u = (obj, key, value) => key in obj ? __defProp$u(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$u = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$t.call(b, prop))
-      __defNormalProp$t(a, prop, b[prop]);
-  if (__getOwnPropSymbols$t)
-    for (var prop of __getOwnPropSymbols$t(b)) {
-      if (__propIsEnum$t.call(b, prop))
-        __defNormalProp$t(a, prop, b[prop]);
+    if (__hasOwnProp$u.call(b, prop))
+      __defNormalProp$u(a, prop, b[prop]);
+  if (__getOwnPropSymbols$u)
+    for (var prop of __getOwnPropSymbols$u(b)) {
+      if (__propIsEnum$u.call(b, prop))
+        __defNormalProp$u(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$h = (a, b) => __defProps$h(a, __getOwnPropDescs$h(b));
+var __spreadProps$i = (a, b) => __defProps$i(a, __getOwnPropDescs$i(b));
 const changeSeriesColorConfigFactory = (label, color, fieldConfig) => {
   const { overrides } = fieldConfig;
   const currentIndex = fieldConfig.overrides.findIndex((override) => {
     return override.matcher.id === data.FieldMatcherID.byName && override.matcher.options === label;
   });
   if (currentIndex < 0) {
-    return __spreadProps$h(__spreadValues$t({}, fieldConfig), {
+    return __spreadProps$i(__spreadValues$u({}, fieldConfig), {
       overrides: [...fieldConfig.overrides, createOverride(label, color)]
     });
   }
@@ -5148,19 +4938,19 @@ const changeSeriesColorConfigFactory = (label, color, fieldConfig) => {
   const existing = overridesCopy[currentIndex];
   const propertyIndex = existing.properties.findIndex((p) => p.id === "color");
   if (propertyIndex < 0) {
-    overridesCopy[currentIndex] = __spreadProps$h(__spreadValues$t({}, existing), {
+    overridesCopy[currentIndex] = __spreadProps$i(__spreadValues$u({}, existing), {
       properties: [...existing.properties, createProperty(color)]
     });
-    return __spreadProps$h(__spreadValues$t({}, fieldConfig), {
+    return __spreadProps$i(__spreadValues$u({}, fieldConfig), {
       overrides: overridesCopy
     });
   }
   const propertiesCopy = Array.from(existing.properties);
   propertiesCopy[propertyIndex] = createProperty(color);
-  overridesCopy[currentIndex] = __spreadProps$h(__spreadValues$t({}, existing), {
+  overridesCopy[currentIndex] = __spreadProps$i(__spreadValues$u({}, existing), {
     properties: propertiesCopy
   });
-  return __spreadProps$h(__spreadValues$t({}, fieldConfig), {
+  return __spreadProps$i(__spreadValues$u({}, fieldConfig), {
     overrides: overridesCopy
   });
 };
@@ -5183,29 +4973,29 @@ const createProperty = (color) => {
   };
 };
 
-var __defProp$s = Object.defineProperty;
-var __defProps$g = Object.defineProperties;
-var __getOwnPropDescs$g = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$s = Object.getOwnPropertySymbols;
-var __hasOwnProp$s = Object.prototype.hasOwnProperty;
-var __propIsEnum$s = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$s = (obj, key, value) => key in obj ? __defProp$s(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$s = (a, b) => {
+var __defProp$t = Object.defineProperty;
+var __defProps$h = Object.defineProperties;
+var __getOwnPropDescs$h = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$t = Object.getOwnPropertySymbols;
+var __hasOwnProp$t = Object.prototype.hasOwnProperty;
+var __propIsEnum$t = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$t = (obj, key, value) => key in obj ? __defProp$t(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$t = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$s.call(b, prop))
-      __defNormalProp$s(a, prop, b[prop]);
-  if (__getOwnPropSymbols$s)
-    for (var prop of __getOwnPropSymbols$s(b)) {
-      if (__propIsEnum$s.call(b, prop))
-        __defNormalProp$s(a, prop, b[prop]);
+    if (__hasOwnProp$t.call(b, prop))
+      __defNormalProp$t(a, prop, b[prop]);
+  if (__getOwnPropSymbols$t)
+    for (var prop of __getOwnPropSymbols$t(b)) {
+      if (__propIsEnum$t.call(b, prop))
+        __defNormalProp$t(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$g = (a, b) => __defProps$g(a, __getOwnPropDescs$g(b));
+var __spreadProps$h = (a, b) => __defProps$h(a, __getOwnPropDescs$h(b));
 class VizPanel extends SceneObjectBase {
   constructor(state) {
     var _a;
-    super(__spreadValues$s({
+    super(__spreadValues$t({
       options: {},
       fieldConfig: { defaults: {}, overrides: [] },
       title: "Title",
@@ -5318,7 +5108,7 @@ class VizPanel extends SceneObjectBase {
     };
     this._onInstanceStateChange = (state) => {
       if (this._panelContext) {
-        this._panelContext = __spreadProps$g(__spreadValues$s({}, this._panelContext), {
+        this._panelContext = __spreadProps$h(__spreadValues$t({}, this._panelContext), {
           instanceState: state
         });
       }
@@ -5342,8 +5132,8 @@ class VizPanel extends SceneObjectBase {
         sortBy = sortKey;
       }
       this.onOptionsChange(
-        __spreadProps$g(__spreadValues$s({}, this.state.options), {
-          legend: __spreadProps$g(__spreadValues$s({}, legendOptions), { sortBy, sortDesc })
+        __spreadProps$h(__spreadValues$t({}, this.state.options), {
+          legend: __spreadProps$h(__spreadValues$t({}, legendOptions), { sortBy, sortDesc })
         }),
         true
       );
@@ -5427,6 +5217,9 @@ class VizPanel extends SceneObjectBase {
     (_a = this._panelContext) != null ? _a : this._panelContext = this.buildPanelContext();
     return this._panelContext;
   }
+  clearFieldConfigCache() {
+    this._dataWithFieldConfig = void 0;
+  }
   applyFieldConfig(rawData) {
     var _a, _b, _c, _d;
     const plugin = this._plugin;
@@ -5450,7 +5243,7 @@ class VizPanel extends SceneObjectBase {
     if (!data.compareArrayValues(newFrames, prevFrames, data.compareDataFrameStructures)) {
       this._structureRev++;
     }
-    this._dataWithFieldConfig = __spreadProps$g(__spreadValues$s({}, rawData), {
+    this._dataWithFieldConfig = __spreadProps$h(__spreadValues$t({}, rawData), {
       structureRev: this._structureRev,
       series: newFrames
     });
@@ -5593,25 +5386,25 @@ function getMessageFromError(err) {
   return JSON.stringify(err);
 }
 
-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) => {
+var __defProp$s = Object.defineProperty;
+var __getOwnPropSymbols$s = Object.getOwnPropertySymbols;
+var __hasOwnProp$s = Object.prototype.hasOwnProperty;
+var __propIsEnum$s = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$s = (obj, key, value) => key in obj ? __defProp$s(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$s = (a, b) => {
   for (var prop in b || (b = {}))
-    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]);
+    if (__hasOwnProp$s.call(b, prop))
+      __defNormalProp$s(a, prop, b[prop]);
+  if (__getOwnPropSymbols$s)
+    for (var prop of __getOwnPropSymbols$s(b)) {
+      if (__propIsEnum$s.call(b, prop))
+        __defNormalProp$s(a, prop, b[prop]);
     }
   return a;
 };
 class SceneDataLayerBase extends SceneObjectBase {
   constructor(initialState, variableDependencyStatePaths = []) {
-    super(__spreadValues$r({
+    super(__spreadValues$s({
       isEnabled: true
     }, initialState));
     this._results = new rxjs.ReplaySubject(1);
@@ -5733,33 +5526,33 @@ function DataLayerControlSwitch({ layer }) {
 }
 const containerStyle$1 = css.css({ display: "flex" });
 
-var __defProp$q = Object.defineProperty;
-var __defProps$f = Object.defineProperties;
-var __getOwnPropDescs$f = 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) => {
+var __defProp$r = Object.defineProperty;
+var __defProps$g = Object.defineProperties;
+var __getOwnPropDescs$g = Object.getOwnPropertyDescriptors;
+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;
 };
-var __spreadProps$f = (a, b) => __defProps$f(a, __getOwnPropDescs$f(b));
+var __spreadProps$g = (a, b) => __defProps$g(a, __getOwnPropDescs$g(b));
 var __objRest$2 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$q.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$r.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$q)
-    for (var prop of __getOwnPropSymbols$q(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$q.call(source, prop))
+  if (source != null && __getOwnPropSymbols$r)
+    for (var prop of __getOwnPropSymbols$r(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$r.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -5768,7 +5561,7 @@ const standardAnnotationSupport = {
   prepareAnnotation: (json) => {
     if (lodash.isString(json == null ? void 0 : json.query)) {
       const _a = json, { query } = _a, rest = __objRest$2(_a, ["query"]);
-      return __spreadProps$f(__spreadValues$q({}, rest), {
+      return __spreadProps$g(__spreadValues$r({}, rest), {
         target: {
           refId: "annotation_query",
           query
@@ -5936,25 +5729,25 @@ function shouldUseLegacyRunner(datasource) {
   return !datasource.annotations || legacyRunner.includes(type);
 }
 
-var __defProp$p = Object.defineProperty;
-var __defProps$e = Object.defineProperties;
-var __getOwnPropDescs$e = 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$f = Object.defineProperties;
+var __getOwnPropDescs$f = 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$e = (a, b) => __defProps$e(a, __getOwnPropDescs$e(b));
+var __spreadProps$f = (a, b) => __defProps$f(a, __getOwnPropDescs$f(b));
 let counter = 100;
 function getNextRequestId() {
   return "AQ" + counter++;
@@ -5977,8 +5770,8 @@ function executeAnnotationQuery(datasource, timeRange, query, layer) {
       }))
     );
   }
-  const processor = __spreadValues$p(__spreadValues$p({}, standardAnnotationSupport), datasource.annotations);
-  const annotationWithDefaults = __spreadValues$p(__spreadValues$p({}, (_a = processor.getDefaultQuery) == null ? void 0 : _a.call(processor)), query);
+  const processor = __spreadValues$q(__spreadValues$q({}, standardAnnotationSupport), datasource.annotations);
+  const annotationWithDefaults = __spreadValues$q(__spreadValues$q({}, (_a = processor.getDefaultQuery) == null ? void 0 : _a.call(processor)), query);
   const annotation = processor.prepareAnnotation(annotationWithDefaults);
   if (!annotation) {
     return rxjs.of({
@@ -6001,7 +5794,7 @@ function executeAnnotationQuery(datasource, timeRange, query, layer) {
     __annotation: { text: annotation.name, value: annotation },
     __sceneObject: { text: "__sceneObject", value: layer }
   };
-  const queryRequest = __spreadValues$p(__spreadProps$e(__spreadValues$p({
+  const queryRequest = __spreadValues$q(__spreadProps$f(__spreadValues$q({
     startTime: Date.now(),
     requestId: getNextRequestId(),
     range: timeRange.state.value,
@@ -6011,7 +5804,7 @@ function executeAnnotationQuery(datasource, timeRange, query, layer) {
     app: data.CoreApp.Dashboard,
     timezone: timeRange.getTimeZone(),
     targets: [
-      __spreadProps$e(__spreadValues$p({}, processedQuery), {
+      __spreadProps$f(__spreadValues$q({}, processedQuery), {
         refId: "Anno"
       })
     ]
@@ -6029,7 +5822,7 @@ function executeAnnotationQuery(datasource, timeRange, query, layer) {
       data$1.forEach((frame) => {
         var _a2;
         if (!((_a2 = frame.meta) == null ? void 0 : _a2.dataTopic)) {
-          frame.meta = __spreadProps$e(__spreadValues$p({}, frame.meta || {}), { dataTopic: data.DataTopic.Annotations });
+          frame.meta = __spreadProps$f(__spreadValues$q({}, frame.meta || {}), { dataTopic: data.DataTopic.Annotations });
         }
       });
       return processor.processEvents(annotation, data$1).pipe(
@@ -6044,19 +5837,19 @@ function executeAnnotationQuery(datasource, timeRange, query, layer) {
   );
 }
 
-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) => {
+var __defProp$p = Object.defineProperty;
+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;
 };
@@ -6067,7 +5860,7 @@ function postProcessQueryResult(annotation, results) {
   }
   const processed = results.map((item) => {
     var _a;
-    const processedItem = __spreadValues$o({}, item);
+    const processedItem = __spreadValues$p({}, item);
     processedItem.source = annotation;
     processedItem.color = runtime.config.theme2.visualization.getColorByName(annotation.iconColor);
     processedItem.type = annotation.name;
@@ -6116,29 +5909,29 @@ function isPanelAlert(event) {
   return event.eventType === "panel-alert";
 }
 
-var __defProp$n = Object.defineProperty;
-var __defProps$d = Object.defineProperties;
-var __getOwnPropDescs$d = Object.getOwnPropertyDescriptors;
-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 __defProps$e = Object.defineProperties;
+var __getOwnPropDescs$e = 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) => {
   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;
 };
-var __spreadProps$d = (a, b) => __defProps$d(a, __getOwnPropDescs$d(b));
+var __spreadProps$e = (a, b) => __defProps$e(a, __getOwnPropDescs$e(b));
 class AnnotationsDataLayer extends SceneDataLayerBase {
   constructor(initialState) {
     super(
-      __spreadValues$n({
+      __spreadValues$o({
         isEnabled: true
       }, initialState),
       ["query"]
@@ -6186,7 +5979,7 @@ class AnnotationsDataLayer extends SceneDataLayerBase {
         this.publishResults(stateUpdate);
       });
     } catch (e) {
-      this.publishResults(__spreadProps$d(__spreadValues$n({}, emptyPanelData), {
+      this.publishResults(__spreadProps$e(__spreadValues$o({}, emptyPanelData), {
         state: schema.LoadingState.Error,
         errors: [
           {
@@ -6203,9 +5996,9 @@ class AnnotationsDataLayer extends SceneDataLayerBase {
   processEvents(query, events) {
     let processedEvents = postProcessQueryResult(query, events.events || []);
     processedEvents = dedupAnnotations(processedEvents);
-    const stateUpdate = __spreadProps$d(__spreadValues$n({}, emptyPanelData), { state: events.state });
+    const stateUpdate = __spreadProps$e(__spreadValues$o({}, emptyPanelData), { state: events.state });
     const df = data.arrayToDataFrame(processedEvents);
-    df.meta = __spreadProps$d(__spreadValues$n({}, df.meta), {
+    df.meta = __spreadProps$e(__spreadValues$o({}, df.meta), {
       dataTopic: data.DataTopic.Annotations
     });
     stateUpdate.series = [df];
@@ -6258,28 +6051,28 @@ class SceneTimeRangeTransformerBase extends SceneObjectBase {
   }
 }
 
-var __defProp$m = Object.defineProperty;
-var __defProps$c = Object.defineProperties;
-var __getOwnPropDescs$c = 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) => {
+var __defProp$n = Object.defineProperty;
+var __defProps$d = Object.defineProperties;
+var __getOwnPropDescs$d = Object.getOwnPropertyDescriptors;
+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;
 };
-var __spreadProps$c = (a, b) => __defProps$c(a, __getOwnPropDescs$c(b));
+var __spreadProps$d = (a, b) => __defProps$d(a, __getOwnPropDescs$d(b));
 class SceneTimeZoneOverride extends SceneTimeRangeTransformerBase {
   constructor(state) {
-    super(__spreadProps$c(__spreadValues$m({}, state), {
+    super(__spreadProps$d(__spreadValues$n({}, state), {
       timeZone: state.timeZone,
       from: "now-6h",
       to: "now",
@@ -6287,7 +6080,7 @@ class SceneTimeZoneOverride extends SceneTimeRangeTransformerBase {
     }));
   }
   ancestorTimeRangeChanged(timeRange) {
-    this.setState(__spreadProps$c(__spreadValues$m({}, timeRange), {
+    this.setState(__spreadProps$d(__spreadValues$n({}, timeRange), {
       timeZone: this.state.timeZone,
       value: evaluateTimeRange(
         timeRange.from,
@@ -6315,25 +6108,25 @@ class SceneTimeZoneOverride extends SceneTimeRangeTransformerBase {
   }
 }
 
-var __defProp$l = Object.defineProperty;
-var __defProps$b = Object.defineProperties;
-var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
-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) => {
+var __defProp$m = Object.defineProperty;
+var __defProps$c = Object.defineProperties;
+var __getOwnPropDescs$c = 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$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]);
+    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$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
+var __spreadProps$c = (a, b) => __defProps$c(a, __getOwnPropDescs$c(b));
 class SceneDataLayerSetBase extends SceneObjectBase {
   constructor() {
     super(...arguments);
@@ -6357,7 +6150,7 @@ class SceneDataLayerSetBase extends SceneObjectBase {
         series = series.concat(result.data.series);
       }
     }
-    const combinedData = __spreadProps$b(__spreadValues$l({}, emptyPanelData), { series });
+    const combinedData = __spreadProps$c(__spreadValues$m({}, emptyPanelData), { series });
     this._results.next({ origin: this, data: combinedData });
     this.setStateHelper({ data: combinedData });
   }
@@ -6406,25 +6199,25 @@ SceneDataLayerSet.Component = ({ model }) => {
   })));
 };
 
-var __defProp$k = Object.defineProperty;
-var __defProps$a = Object.defineProperties;
-var __getOwnPropDescs$a = 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) => {
+var __defProp$l = Object.defineProperty;
+var __defProps$b = Object.defineProperties;
+var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
+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;
 };
-var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
+var __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
 class SceneDataTransformer extends SceneObjectBase {
   constructor(state) {
     super(state);
@@ -6501,7 +6294,7 @@ class SceneDataTransformer extends SceneObjectBase {
     const { series, annotations } = this._prevDataFromSource;
     if (data.series === series && data.annotations === annotations) {
       if (this.state.data && data.state !== this.state.data.state) {
-        this.setState({ data: __spreadProps$a(__spreadValues$k({}, this.state.data), { state: data.state }) });
+        this.setState({ data: __spreadProps$b(__spreadValues$l({}, this.state.data), { state: data.state }) });
       }
       return true;
     }
@@ -6549,7 +6342,7 @@ class SceneDataTransformer extends SceneObjectBase {
       rxjs.map((values) => {
         const transformedSeries = values[0];
         const transformedAnnotations = values[1];
-        return __spreadProps$a(__spreadValues$k({}, data$1), {
+        return __spreadProps$b(__spreadValues$l({}, data$1), {
           series: transformedSeries,
           annotations: transformedAnnotations != null ? transformedAnnotations : data$1.annotations
         });
@@ -6560,7 +6353,7 @@ class SceneDataTransformer extends SceneObjectBase {
         const sourceErr = ((_a2 = this.getSourceData().state.data) == null ? void 0 : _a2.errors) || [];
         const transformationError = runtime.toDataQueryError(err);
         transformationError.message = `Error transforming data: ${transformationError.message}`;
-        const result = __spreadProps$a(__spreadValues$k({}, data$1), {
+        const result = __spreadProps$b(__spreadValues$l({}, data$1), {
           state: data.LoadingState.Error,
           errors: [...sourceErr, transformationError]
         });
@@ -6893,28 +6686,28 @@ class SceneVariableSetVariableDependencyHandler {
   }
 }
 
-var __defProp$j = Object.defineProperty;
-var __defProps$9 = Object.defineProperties;
-var __getOwnPropDescs$9 = 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$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]);
+var __defProp$k = Object.defineProperty;
+var __defProps$a = Object.defineProperties;
+var __getOwnPropDescs$a = 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$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$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
+var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
 class ConstantVariable extends SceneObjectBase {
   constructor(initialState) {
-    super(__spreadProps$9(__spreadValues$j({
+    super(__spreadProps$a(__spreadValues$k({
       type: "constant",
       value: "",
       name: ""
@@ -6927,25 +6720,25 @@ class ConstantVariable extends SceneObjectBase {
   }
 }
 
-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) => {
+var __defProp$j = Object.defineProperty;
+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;
 };
 class CustomVariable extends MultiValueVariable {
   constructor(initialState) {
-    super(__spreadValues$i({
+    super(__spreadValues$j({
       type: "custom",
       query: "",
       value: "",
@@ -6979,25 +6772,25 @@ CustomVariable.Component = ({ model }) => {
   return renderSelectForVariable(model);
 };
 
-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;
 };
 class DataSourceVariable extends MultiValueVariable {
   constructor(initialState) {
-    super(__spreadValues$h({
+    super(__spreadValues$i({
       type: "datasource",
       value: "",
       text: "",
@@ -7081,25 +6874,25 @@ const hasCustomVariableSupport = (datasource) => {
   return "query" in variableSupport && "editor" in variableSupport && Boolean(variableSupport.query) && Boolean(variableSupport.editor);
 };
 
-var __defProp$g = Object.defineProperty;
-var __defProps$8 = Object.defineProperties;
-var __getOwnPropDescs$8 = 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) => {
+var __defProp$h = Object.defineProperty;
+var __defProps$9 = Object.defineProperties;
+var __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors;
+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;
 };
-var __spreadProps$8 = (a, b) => __defProps$8(a, __getOwnPropDescs$8(b));
+var __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
 class StandardQueryRunner {
   constructor(datasource, _runRequest = runtime.getRunRequest()) {
     this.datasource = datasource;
@@ -7136,7 +6929,7 @@ class LegacyQueryRunner {
       return getEmptyMetricFindValueObservable();
     }
     return rxjs.from(
-      this.datasource.metricFindQuery(variable.state.query, __spreadProps$8(__spreadValues$g({}, request), {
+      this.datasource.metricFindQuery(variable.state.query, __spreadProps$9(__spreadValues$h({}, request), {
         variable: {
           name: variable.state.name,
           type: variable.state.type
@@ -7198,7 +6991,7 @@ function ensureVariableQueryModelIsADataQuery(variable) {
     return { query, refId: `variable-${variable.state.name}` };
   }
   if (query.refId == null) {
-    return __spreadProps$8(__spreadValues$g({}, query), { refId: `variable-${variable.state.name}` });
+    return __spreadProps$9(__spreadValues$h({}, query), { refId: `variable-${variable.state.name}` });
   }
   return variable.state.query;
 }
@@ -7413,25 +7206,25 @@ function areMetricFindValues(data$1) {
   return false;
 }
 
-var __defProp$f = Object.defineProperty;
-var __getOwnPropSymbols$f = Object.getOwnPropertySymbols;
-var __hasOwnProp$f = Object.prototype.hasOwnProperty;
-var __propIsEnum$f = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$f = (a, b) => {
+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) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$f.call(b, prop))
-      __defNormalProp$f(a, prop, b[prop]);
-  if (__getOwnPropSymbols$f)
-    for (var prop of __getOwnPropSymbols$f(b)) {
-      if (__propIsEnum$f.call(b, prop))
-        __defNormalProp$f(a, prop, b[prop]);
+    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;
 };
 class QueryVariable extends MultiValueVariable {
   constructor(initialState) {
-    super(__spreadValues$f({
+    super(__spreadValues$g({
       type: "query",
       name: "",
       value: "",
@@ -7584,25 +7377,25 @@ function queryMetricTree(query) {
   return queryTree(children, query.split("."), 0);
 }
 
-var __defProp$e = Object.defineProperty;
-var __getOwnPropSymbols$e = Object.getOwnPropertySymbols;
-var __hasOwnProp$e = Object.prototype.hasOwnProperty;
-var __propIsEnum$e = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$e = (a, b) => {
+var __defProp$f = Object.defineProperty;
+var __getOwnPropSymbols$f = Object.getOwnPropertySymbols;
+var __hasOwnProp$f = Object.prototype.hasOwnProperty;
+var __propIsEnum$f = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$f = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$e.call(b, prop))
-      __defNormalProp$e(a, prop, b[prop]);
-  if (__getOwnPropSymbols$e)
-    for (var prop of __getOwnPropSymbols$e(b)) {
-      if (__propIsEnum$e.call(b, prop))
-        __defNormalProp$e(a, prop, b[prop]);
+    if (__hasOwnProp$f.call(b, prop))
+      __defNormalProp$f(a, prop, b[prop]);
+  if (__getOwnPropSymbols$f)
+    for (var prop of __getOwnPropSymbols$f(b)) {
+      if (__propIsEnum$f.call(b, prop))
+        __defNormalProp$f(a, prop, b[prop]);
     }
   return a;
 };
 class TestVariable extends MultiValueVariable {
   constructor(initialState, isLazy = false) {
-    super(__spreadValues$e({
+    super(__spreadValues$f({
       type: "custom",
       name: "Test",
       value: "Value",
@@ -7711,25 +7504,25 @@ function VariableValueInput({ model }) {
   });
 }
 
-var __defProp$d = Object.defineProperty;
-var __getOwnPropSymbols$d = Object.getOwnPropertySymbols;
-var __hasOwnProp$d = Object.prototype.hasOwnProperty;
-var __propIsEnum$d = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$d = (a, b) => {
+var __defProp$e = Object.defineProperty;
+var __getOwnPropSymbols$e = Object.getOwnPropertySymbols;
+var __hasOwnProp$e = Object.prototype.hasOwnProperty;
+var __propIsEnum$e = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$e = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$d.call(b, prop))
-      __defNormalProp$d(a, prop, b[prop]);
-  if (__getOwnPropSymbols$d)
-    for (var prop of __getOwnPropSymbols$d(b)) {
-      if (__propIsEnum$d.call(b, prop))
-        __defNormalProp$d(a, prop, b[prop]);
+    if (__hasOwnProp$e.call(b, prop))
+      __defNormalProp$e(a, prop, b[prop]);
+  if (__getOwnPropSymbols$e)
+    for (var prop of __getOwnPropSymbols$e(b)) {
+      if (__propIsEnum$e.call(b, prop))
+        __defNormalProp$e(a, prop, b[prop]);
     }
   return a;
 };
 class TextBoxVariable extends SceneObjectBase {
   constructor(initialState) {
-    super(__spreadValues$d({
+    super(__spreadValues$e({
       type: "textbox",
       value: "",
       name: ""
@@ -7766,28 +7559,28 @@ TextBoxVariable.Component = ({ model }) => {
   });
 };
 
-var __defProp$c = Object.defineProperty;
-var __defProps$7 = Object.defineProperties;
-var __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
-var __hasOwnProp$c = Object.prototype.hasOwnProperty;
-var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$c = (a, b) => {
+var __defProp$d = Object.defineProperty;
+var __defProps$8 = Object.defineProperties;
+var __getOwnPropDescs$8 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$d = Object.getOwnPropertySymbols;
+var __hasOwnProp$d = Object.prototype.hasOwnProperty;
+var __propIsEnum$d = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$d = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$c.call(b, prop))
-      __defNormalProp$c(a, prop, b[prop]);
-  if (__getOwnPropSymbols$c)
-    for (var prop of __getOwnPropSymbols$c(b)) {
-      if (__propIsEnum$c.call(b, prop))
-        __defNormalProp$c(a, prop, b[prop]);
+    if (__hasOwnProp$d.call(b, prop))
+      __defNormalProp$d(a, prop, b[prop]);
+  if (__getOwnPropSymbols$d)
+    for (var prop of __getOwnPropSymbols$d(b)) {
+      if (__propIsEnum$d.call(b, prop))
+        __defNormalProp$d(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$7 = (a, b) => __defProps$7(a, __getOwnPropDescs$7(b));
+var __spreadProps$8 = (a, b) => __defProps$8(a, __getOwnPropDescs$8(b));
 class LocalValueVariable extends SceneObjectBase {
   constructor(initialState) {
-    super(__spreadProps$7(__spreadValues$c({
+    super(__spreadProps$8(__spreadValues$d({
       type: "system",
       value: "",
       text: "",
@@ -7819,25 +7612,25 @@ class LocalValueVariable extends SceneObjectBase {
   }
 }
 
-var __defProp$b = Object.defineProperty;
-var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
-var __hasOwnProp$b = Object.prototype.hasOwnProperty;
-var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$b = (a, b) => {
+var __defProp$c = Object.defineProperty;
+var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
+var __hasOwnProp$c = Object.prototype.hasOwnProperty;
+var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$c = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$b.call(b, prop))
-      __defNormalProp$b(a, prop, b[prop]);
-  if (__getOwnPropSymbols$b)
-    for (var prop of __getOwnPropSymbols$b(b)) {
-      if (__propIsEnum$b.call(b, prop))
-        __defNormalProp$b(a, prop, b[prop]);
+    if (__hasOwnProp$c.call(b, prop))
+      __defNormalProp$c(a, prop, b[prop]);
+  if (__getOwnPropSymbols$c)
+    for (var prop of __getOwnPropSymbols$c(b)) {
+      if (__propIsEnum$c.call(b, prop))
+        __defNormalProp$c(a, prop, b[prop]);
     }
   return a;
 };
 class IntervalVariable extends SceneObjectBase {
   constructor(initialState) {
-    super(__spreadValues$b({
+    super(__spreadValues$c({
       type: "interval",
       value: "",
       intervals: ["1m", "10m", "30m", "1h", "6h", "12h", "1d", "7d", "14d", "30d"],
@@ -8045,7 +7838,7 @@ class EmbeddedScene extends SceneObjectBase {
 EmbeddedScene.Component = EmbeddedSceneRenderer;
 function EmbeddedSceneRenderer({ model }) {
   const { body, controls } = model.useState();
-  const styles = ui.useStyles2(getStyles$5);
+  const styles = ui.useStyles2(getStyles$6);
   return /* @__PURE__ */ React__default["default"].createElement("div", {
     className: styles.container
   }, controls && /* @__PURE__ */ React__default["default"].createElement("div", {
@@ -8059,7 +7852,7 @@ function EmbeddedSceneRenderer({ model }) {
     model: body
   })));
 }
-const getStyles$5 = (theme) => {
+const getStyles$6 = (theme) => {
   return {
     container: css.css({
       flexGrow: 1,
@@ -8162,30 +7955,30 @@ function isSceneGridLayout(child) {
   return child instanceof SceneGridLayout;
 }
 
-var __defProp$a = Object.defineProperty;
-var __getOwnPropSymbols$a = Object.getOwnPropertySymbols;
-var __hasOwnProp$a = Object.prototype.hasOwnProperty;
-var __propIsEnum$a = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$a = (a, b) => {
+var __defProp$b = Object.defineProperty;
+var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
+var __hasOwnProp$b = Object.prototype.hasOwnProperty;
+var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$b = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$a.call(b, prop))
-      __defNormalProp$a(a, prop, b[prop]);
-  if (__getOwnPropSymbols$a)
-    for (var prop of __getOwnPropSymbols$a(b)) {
-      if (__propIsEnum$a.call(b, prop))
-        __defNormalProp$a(a, prop, b[prop]);
+    if (__hasOwnProp$b.call(b, prop))
+      __defNormalProp$b(a, prop, b[prop]);
+  if (__getOwnPropSymbols$b)
+    for (var prop of __getOwnPropSymbols$b(b)) {
+      if (__propIsEnum$b.call(b, prop))
+        __defNormalProp$b(a, prop, b[prop]);
     }
   return a;
 };
 var __objRest$1 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$a.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$b.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$a)
-    for (var prop of __getOwnPropSymbols$a(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$a.call(source, prop))
+  if (source != null && __getOwnPropSymbols$b)
+    for (var prop of __getOwnPropSymbols$b(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$b.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -8225,7 +8018,7 @@ const LazyLoader = React__default["default"].forwardRef(
         }
       };
     });
-    return /* @__PURE__ */ React__default["default"].createElement("div", __spreadValues$a({
+    return /* @__PURE__ */ React__default["default"].createElement("div", __spreadValues$b({
       id,
       ref: innerRef
     }, rest), loaded && (typeof children === "function" ? children({ isInView }) : children));
@@ -8243,33 +8036,33 @@ LazyLoader.observer = new IntersectionObserver(
   { rootMargin: "100px" }
 );
 
-var __defProp$9 = Object.defineProperty;
-var __defProps$6 = Object.defineProperties;
-var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
-var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
-var __propIsEnum$9 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$9 = (a, b) => {
+var __defProp$a = Object.defineProperty;
+var __defProps$7 = Object.defineProperties;
+var __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$a = Object.getOwnPropertySymbols;
+var __hasOwnProp$a = Object.prototype.hasOwnProperty;
+var __propIsEnum$a = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$a = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$9.call(b, prop))
-      __defNormalProp$9(a, prop, b[prop]);
-  if (__getOwnPropSymbols$9)
-    for (var prop of __getOwnPropSymbols$9(b)) {
-      if (__propIsEnum$9.call(b, prop))
-        __defNormalProp$9(a, prop, b[prop]);
+    if (__hasOwnProp$a.call(b, prop))
+      __defNormalProp$a(a, prop, b[prop]);
+  if (__getOwnPropSymbols$a)
+    for (var prop of __getOwnPropSymbols$a(b)) {
+      if (__propIsEnum$a.call(b, prop))
+        __defNormalProp$a(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
+var __spreadProps$7 = (a, b) => __defProps$7(a, __getOwnPropDescs$7(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$9.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$a.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$9)
-    for (var prop of __getOwnPropSymbols$9(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$9.call(source, prop))
+  if (source != null && __getOwnPropSymbols$a)
+    for (var prop of __getOwnPropSymbols$a(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$a.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -8328,7 +8121,7 @@ const GridItemWrapper = React__default["default"].forwardRef((props, ref) => {
     key: sceneChild.state.key
   });
   if (isLazy) {
-    return /* @__PURE__ */ React__default["default"].createElement(LazyLoader, __spreadProps$6(__spreadValues$9({}, divProps), {
+    return /* @__PURE__ */ React__default["default"].createElement(LazyLoader, __spreadProps$7(__spreadValues$a({}, divProps), {
       key: sceneChild.state.key,
       "data-griditem-key": sceneChild.state.key,
       className: css.cx(className, props.className),
@@ -8336,7 +8129,7 @@ const GridItemWrapper = React__default["default"].forwardRef((props, ref) => {
       ref
     }), innerContent, children);
   }
-  return /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$6(__spreadValues$9({}, divProps), {
+  return /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$7(__spreadValues$a({}, divProps), {
     ref,
     key: sceneChild.state.key,
     "data-griditem-key": sceneChild.state.key,
@@ -8366,7 +8159,7 @@ function updateAnimationClass(ref, isDraggable, retry) {
 const ResizeHandle = React__default["default"].forwardRef((_a, ref) => {
   var _b = _a, divProps = __objRest(_b, ["handleAxis"]);
   const customCssClass = ui.useStyles2(getResizeHandleStyles);
-  return /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$6(__spreadValues$9({
+  return /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$7(__spreadValues$a({
     ref
   }, divProps), {
     className: `${customCssClass} scene-resize-handle`
@@ -8406,60 +8199,60 @@ function getResizeHandleStyles(theme) {
   });
 }
 
-var __defProp$8 = Object.defineProperty;
-var __defProps$5 = Object.defineProperties;
-var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
-var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
-var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$8 = (a, b) => {
+var __defProp$9 = Object.defineProperty;
+var __defProps$6 = Object.defineProperties;
+var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
+var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
+var __propIsEnum$9 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$9 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$8.call(b, prop))
-      __defNormalProp$8(a, prop, b[prop]);
-  if (__getOwnPropSymbols$8)
-    for (var prop of __getOwnPropSymbols$8(b)) {
-      if (__propIsEnum$8.call(b, prop))
-        __defNormalProp$8(a, prop, b[prop]);
+    if (__hasOwnProp$9.call(b, prop))
+      __defNormalProp$9(a, prop, b[prop]);
+  if (__getOwnPropSymbols$9)
+    for (var prop of __getOwnPropSymbols$9(b)) {
+      if (__propIsEnum$9.call(b, prop))
+        __defNormalProp$9(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
+var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
 function fitPanelsInHeight(cells, height) {
   const visibleHeight = height - GRID_CELL_VMARGIN * 4;
   const currentGridHeight = Math.max(...cells.map((cell) => cell.h + cell.y));
   const visibleGridHeight = Math.floor(visibleHeight / (GRID_CELL_HEIGHT + GRID_CELL_VMARGIN));
   const scaleFactor = currentGridHeight / visibleGridHeight;
   return cells.map((cell) => {
-    return __spreadProps$5(__spreadValues$8({}, cell), {
+    return __spreadProps$6(__spreadValues$9({}, cell), {
       y: Math.round(cell.y / scaleFactor) || 0,
       h: Math.round(cell.h / scaleFactor) || 1
     });
   });
 }
 
-var __defProp$7 = Object.defineProperty;
-var __defProps$4 = Object.defineProperties;
-var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
-var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
-var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$7 = (a, b) => {
+var __defProp$8 = Object.defineProperty;
+var __defProps$5 = Object.defineProperties;
+var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
+var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
+var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$8 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$7.call(b, prop))
-      __defNormalProp$7(a, prop, b[prop]);
-  if (__getOwnPropSymbols$7)
-    for (var prop of __getOwnPropSymbols$7(b)) {
-      if (__propIsEnum$7.call(b, prop))
-        __defNormalProp$7(a, prop, b[prop]);
+    if (__hasOwnProp$8.call(b, prop))
+      __defNormalProp$8(a, prop, b[prop]);
+  if (__getOwnPropSymbols$8)
+    for (var prop of __getOwnPropSymbols$8(b)) {
+      if (__propIsEnum$8.call(b, prop))
+        __defNormalProp$8(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
+var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
 const _SceneGridLayout = class extends SceneObjectBase {
   constructor(state) {
-    super(__spreadProps$4(__spreadValues$7({}, state), {
+    super(__spreadProps$5(__spreadValues$8({}, state), {
       children: sortChildrenByPosition(state.children)
     }));
     this._skipOnLayoutChange = false;
@@ -8483,7 +8276,7 @@ const _SceneGridLayout = class extends SceneObjectBase {
           height: item.h
         };
         if (!isItemSizeEqual(child.state, nextSize)) {
-          child.setState(__spreadValues$7({}, nextSize));
+          child.setState(__spreadValues$8({}, nextSize));
         }
       }
       this.setState({ children: sortChildrenByPosition(this.state.children) });
@@ -8557,7 +8350,7 @@ const _SceneGridLayout = class extends SceneObjectBase {
     const yDiff = firstPanelYPos - (rowY + 1);
     let yMax = rowY;
     for (const panel of rowChildren) {
-      const newSize = __spreadValues$7({}, panel.state);
+      const newSize = __spreadValues$8({}, panel.state);
       newSize.y = (_b = newSize.y) != null ? _b : rowY;
       newSize.y -= yDiff;
       if (newSize.y !== panel.state.y) {
@@ -8684,7 +8477,7 @@ const _SceneGridLayout = class extends SceneObjectBase {
     }
     if (width < 768) {
       this._skipOnLayoutChange = true;
-      return cells.map((cell) => __spreadProps$4(__spreadValues$7({}, cell), { w: 24 }));
+      return cells.map((cell) => __spreadProps$5(__spreadValues$8({}, cell), { w: 24 }));
     }
     this._skipOnLayoutChange = false;
     return cells;
@@ -8709,28 +8502,28 @@ function sortGridLayout(layout) {
   return [...layout].sort((a, b) => a.y - b.y || a.x - b.x);
 }
 
-var __defProp$6 = Object.defineProperty;
-var __defProps$3 = Object.defineProperties;
-var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
-var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
-var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$6 = (a, b) => {
+var __defProp$7 = Object.defineProperty;
+var __defProps$4 = Object.defineProperties;
+var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
+var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
+var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$7 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$6.call(b, prop))
-      __defNormalProp$6(a, prop, b[prop]);
-  if (__getOwnPropSymbols$6)
-    for (var prop of __getOwnPropSymbols$6(b)) {
-      if (__propIsEnum$6.call(b, prop))
-        __defNormalProp$6(a, prop, b[prop]);
+    if (__hasOwnProp$7.call(b, prop))
+      __defNormalProp$7(a, prop, b[prop]);
+  if (__getOwnPropSymbols$7)
+    for (var prop of __getOwnPropSymbols$7(b)) {
+      if (__propIsEnum$7.call(b, prop))
+        __defNormalProp$7(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
+var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
 class SceneGridRow extends SceneObjectBase {
   constructor(state) {
-    super(__spreadProps$3(__spreadValues$6({
+    super(__spreadProps$4(__spreadValues$7({
       children: state.children || [],
       isCollapsible: state.isCollapsible || true,
       title: state.title || ""
@@ -8895,7 +8688,7 @@ NestedScene.Component = NestedSceneRenderer;
 function NestedSceneRenderer({ model }) {
   const { title, isCollapsed, canCollapse, canRemove, body, controls } = model.useState();
   const gridRow = ui.useStyles2(getSceneGridRowStyles);
-  const styles = ui.useStyles2(getStyles$4);
+  const styles = ui.useStyles2(getStyles$5);
   const toolbarControls = (controls != null ? controls : []).map((action) => /* @__PURE__ */ React__default["default"].createElement(action.Component, {
     key: action.state.key,
     model: action
@@ -8930,7 +8723,7 @@ function NestedSceneRenderer({ model }) {
     model: body
   }));
 }
-const getStyles$4 = (theme) => ({
+const getStyles$5 = (theme) => ({
   wrapper: css.css({
     display: "flex",
     flexDirection: "column",
@@ -9097,30 +8890,30 @@ function getShiftedTimeRange(dir, timeRange, upperLimit) {
   };
 }
 
-var __defProp$5 = Object.defineProperty;
-var __defProps$2 = Object.defineProperties;
-var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
-var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
-var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$5 = (a, b) => {
+var __defProp$6 = Object.defineProperty;
+var __defProps$3 = Object.defineProperties;
+var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
+var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
+var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$6 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$5.call(b, prop))
-      __defNormalProp$5(a, prop, b[prop]);
-  if (__getOwnPropSymbols$5)
-    for (var prop of __getOwnPropSymbols$5(b)) {
-      if (__propIsEnum$5.call(b, prop))
-        __defNormalProp$5(a, prop, b[prop]);
+    if (__hasOwnProp$6.call(b, prop))
+      __defNormalProp$6(a, prop, b[prop]);
+  if (__getOwnPropSymbols$6)
+    for (var prop of __getOwnPropSymbols$6(b)) {
+      if (__propIsEnum$6.call(b, prop))
+        __defNormalProp$6(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
+var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
 const DEFAULT_INTERVALS = ["5s", "10s", "30s", "1m", "5m", "15m", "30m", "1h", "2h", "1d"];
 class SceneRefreshPicker extends SceneObjectBase {
   constructor(state) {
     var _a, _b, _c;
-    super(__spreadProps$2(__spreadValues$5({
+    super(__spreadProps$3(__spreadValues$6({
       refresh: ""
     }, state), {
       autoValue: void 0,
@@ -9201,55 +8994,283 @@ class SceneRefreshPicker extends SceneObjectBase {
   }
   getUrlState() {
     return {
-      refresh: this.state.refresh
+      refresh: this.state.refresh
+    };
+  }
+  updateFromUrl(values) {
+    const refresh = values.refresh;
+    if (refresh && typeof refresh === "string") {
+      this.setState({
+        refresh
+      });
+    }
+  }
+}
+SceneRefreshPicker.Component = SceneRefreshPickerRenderer;
+function SceneRefreshPickerRenderer({ model }) {
+  var _a;
+  const { refresh, intervals, autoEnabled, autoValue, isOnCanvas, primary, withText } = model.useState();
+  const isRunning = useQueryControllerState(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";
+  }
+  return /* @__PURE__ */ React__default["default"].createElement(ui.RefreshPicker, {
+    showAutoInterval: autoEnabled,
+    value: refresh,
+    intervals,
+    tooltip,
+    width,
+    text,
+    onRefresh: model.onRefresh,
+    primary,
+    onIntervalChanged: model.onIntervalChanged,
+    isLoading: isRunning,
+    isOnCanvas: isOnCanvas != null ? isOnCanvas : true
+  });
+}
+function useQueryControllerState(model) {
+  const queryController = sceneGraph.getQueryController(model);
+  if (!queryController) {
+    return false;
+  }
+  return queryController.useState().isRunning;
+}
+
+const getCompareSeriesRefId = (refId) => `${refId}-compare`;
+
+var __defProp$5 = Object.defineProperty;
+var __defProps$2 = Object.defineProperties;
+var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
+var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
+var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$5 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$5.call(b, prop))
+      __defNormalProp$5(a, prop, b[prop]);
+  if (__getOwnPropSymbols$5)
+    for (var prop of __getOwnPropSymbols$5(b)) {
+      if (__propIsEnum$5.call(b, prop))
+        __defNormalProp$5(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
+const PREVIOUS_PERIOD_VALUE = "__previousPeriod";
+const NO_PERIOD_VALUE = "__noPeriod";
+const PREVIOUS_PERIOD_COMPARE_OPTION = {
+  label: "Previous period",
+  value: PREVIOUS_PERIOD_VALUE
+};
+const NO_COMPARE_OPTION = {
+  label: "No comparison",
+  value: NO_PERIOD_VALUE
+};
+const DEFAULT_COMPARE_OPTIONS = [
+  { label: "Day before", value: "24h" },
+  { label: "Week before", value: "1w" },
+  { label: "Month before", value: "1M" }
+];
+class SceneTimeRangeCompare extends SceneObjectBase {
+  constructor(state) {
+    super(__spreadValues$5({ compareOptions: DEFAULT_COMPARE_OPTIONS }, state));
+    this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: ["compareWith"] });
+    this._onActivate = () => {
+      const sceneTimeRange = sceneGraph.getTimeRange(this);
+      this.setState({ compareOptions: this.getCompareOptions(sceneTimeRange.state.value) });
+      this._subs.add(
+        sceneTimeRange.subscribeToState((timeRange) => {
+          const compareOptions = this.getCompareOptions(timeRange.value);
+          const stateUpdate = { compareOptions };
+          if (Boolean(this.state.compareWith) && !compareOptions.find(({ value }) => value === this.state.compareWith)) {
+            stateUpdate.compareWith = PREVIOUS_PERIOD_VALUE;
+          }
+          this.setState(stateUpdate);
+        })
+      );
+    };
+    this.getCompareOptions = (timeRange) => {
+      const diffDays = Math.ceil(timeRange.to.diff(timeRange.from));
+      const matchIndex = DEFAULT_COMPARE_OPTIONS.findIndex(({ value }) => {
+        const intervalInMs = data.rangeUtil.intervalToMs(value);
+        return intervalInMs >= diffDays;
+      });
+      return [
+        NO_COMPARE_OPTION,
+        PREVIOUS_PERIOD_COMPARE_OPTION,
+        ...DEFAULT_COMPARE_OPTIONS.slice(matchIndex).map(({ label, value }) => ({ label, value }))
+      ];
+    };
+    this.onCompareWithChanged = (compareWith) => {
+      if (compareWith === NO_PERIOD_VALUE) {
+        this.onClearCompare();
+      } else {
+        this.setState({ compareWith });
+      }
+    };
+    this.onClearCompare = () => {
+      this.setState({ compareWith: void 0 });
+    };
+    this.addActivationHandler(this._onActivate);
+  }
+  getExtraQueries(request) {
+    const extraQueries = [];
+    const compareRange = this.getCompareTimeRange(request.range);
+    if (!compareRange) {
+      return extraQueries;
+    }
+    const targets = request.targets.filter((query) => query.timeRangeCompare !== false);
+    if (targets.length) {
+      extraQueries.push({
+        req: __spreadProps$2(__spreadValues$5({}, request), {
+          targets,
+          range: compareRange
+        }),
+        processor: timeShiftAlignmentProcessor
+      });
+    }
+    return extraQueries;
+  }
+  shouldRerun(prev, next) {
+    return prev.compareWith !== next.compareWith;
+  }
+  getCompareTimeRange(timeRange) {
+    let compareFrom;
+    let compareTo;
+    if (this.state.compareWith) {
+      if (this.state.compareWith === PREVIOUS_PERIOD_VALUE) {
+        const diffMs = timeRange.to.diff(timeRange.from);
+        compareFrom = data.dateTime(timeRange.from).subtract(diffMs);
+        compareTo = data.dateTime(timeRange.to).subtract(diffMs);
+      } else {
+        compareFrom = data.dateTime(timeRange.from).subtract(data.rangeUtil.intervalToMs(this.state.compareWith));
+        compareTo = data.dateTime(timeRange.to).subtract(data.rangeUtil.intervalToMs(this.state.compareWith));
+      }
+      return {
+        from: compareFrom,
+        to: compareTo,
+        raw: {
+          from: compareFrom,
+          to: compareTo
+        }
+      };
+    }
+    return void 0;
+  }
+  getUrlState() {
+    return {
+      compareWith: this.state.compareWith
     };
   }
   updateFromUrl(values) {
-    const refresh = values.refresh;
-    if (refresh && typeof refresh === "string") {
-      this.setState({
-        refresh
-      });
+    if (!values.compareWith) {
+      return;
+    }
+    const compareWith = parseUrlParam(values.compareWith);
+    if (compareWith) {
+      const compareOptions = this.getCompareOptions(sceneGraph.getTimeRange(this).state.value);
+      if (compareOptions.find(({ value }) => value === compareWith)) {
+        this.setState({
+          compareWith
+        });
+      } else {
+        this.setState({
+          compareWith: "__previousPeriod"
+        });
+      }
     }
   }
 }
-SceneRefreshPicker.Component = SceneRefreshPickerRenderer;
-function SceneRefreshPickerRenderer({ model }) {
+SceneTimeRangeCompare.Component = SceneTimeRangeCompareRenderer;
+const timeShiftAlignmentProcessor = (primary, secondary) => {
+  const diff = secondary.timeRange.from.diff(primary.timeRange.from);
+  secondary.series.forEach((series) => {
+    series.refId = getCompareSeriesRefId(series.refId || "");
+    series.meta = __spreadProps$2(__spreadValues$5({}, series.meta), {
+      timeCompare: {
+        diffMs: diff,
+        isTimeShiftQuery: true
+      }
+    });
+    series.fields.forEach((field) => {
+      if (field.type === data.FieldType.time) {
+        field.values = field.values.map((v) => {
+          return diff < 0 ? v - diff : v + diff;
+        });
+      }
+      field.config = __spreadProps$2(__spreadValues$5({}, field.config), {
+        color: {
+          mode: "fixed",
+          fixedColor: runtime.config.theme.palette.gray60
+        }
+      });
+      return field;
+    });
+  });
+  return rxjs.of(secondary);
+};
+function SceneTimeRangeCompareRenderer({ model }) {
   var _a;
-  const { refresh, intervals, autoEnabled, autoValue, isOnCanvas, primary, withText } = model.useState();
-  const isRunning = useQueryControllerState(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";
+  const styles = ui.useStyles2(getStyles$4);
+  const { compareWith, compareOptions } = model.useState();
+  const [previousCompare, setPreviousCompare] = React__default["default"].useState(compareWith);
+  const previousValue = (_a = compareOptions.find(({ value: value2 }) => value2 === previousCompare)) != null ? _a : PREVIOUS_PERIOD_COMPARE_OPTION;
+  const value = compareOptions.find(({ value: value2 }) => value2 === compareWith);
+  const enabled = Boolean(value);
+  const onClick = () => {
+    if (enabled) {
+      setPreviousCompare(compareWith);
+      model.onClearCompare();
+    } else if (!enabled) {
+      model.onCompareWithChanged(previousValue.value);
     }
-  }
-  if (withText) {
-    width = "96px";
-  }
-  return /* @__PURE__ */ React__default["default"].createElement(ui.RefreshPicker, {
-    showAutoInterval: autoEnabled,
-    value: refresh,
-    intervals,
-    tooltip,
-    width,
-    text,
-    onRefresh: model.onRefresh,
-    primary,
-    onIntervalChanged: model.onIntervalChanged,
-    isLoading: isRunning,
-    isOnCanvas: isOnCanvas != null ? isOnCanvas : true
-  });
+  };
+  return /* @__PURE__ */ React__default["default"].createElement(ui.ButtonGroup, null, /* @__PURE__ */ React__default["default"].createElement(ui.ToolbarButton, {
+    variant: "canvas",
+    tooltip: "Enable time frame comparison",
+    onClick: (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+      onClick();
+    }
+  }, /* @__PURE__ */ React__default["default"].createElement(ui.Checkbox, {
+    label: " ",
+    value: enabled,
+    onClick
+  }), "Comparison"), enabled ? /* @__PURE__ */ React__default["default"].createElement(ui.ButtonSelect, {
+    variant: "canvas",
+    value,
+    options: compareOptions,
+    onChange: (v) => {
+      model.onCompareWithChanged(v.value);
+    }
+  }) : /* @__PURE__ */ React__default["default"].createElement(ui.ToolbarButton, {
+    className: styles.previewButton,
+    disabled: true,
+    variant: "canvas",
+    isOpen: false
+  }, previousValue.label));
 }
-function useQueryControllerState(model) {
-  const queryController = sceneGraph.getQueryController(model);
-  if (!queryController) {
-    return false;
-  }
-  return queryController.useState().isRunning;
+function getStyles$4(theme) {
+  return {
+    previewButton: css.css({
+      "&:disabled": {
+        border: `1px solid ${theme.colors.secondary.border}`,
+        color: theme.colors.text.disabled,
+        opacity: 1
+      }
+    })
+  };
 }
 
 class SceneByFrameRepeater extends SceneObjectBase {
@@ -11116,6 +11137,174 @@ const PanelBuilders = {
   }
 };
 
+class VizConfigBuilder {
+  constructor(pluginId, pluginVersion, defaultOptions, defaultFieldConfig) {
+    this._pluginId = pluginId;
+    this._pluginVersion = pluginVersion;
+    this._fieldConfigBuilder = new FieldConfigBuilder(defaultFieldConfig);
+    this._panelOptionsBuilder = new PanelOptionsBuilder(defaultOptions);
+  }
+  setColor(color) {
+    this._fieldConfigBuilder.setColor(color);
+    return this;
+  }
+  setDecimals(decimals) {
+    this._fieldConfigBuilder.setDecimals(decimals);
+    return this;
+  }
+  setDisplayName(displayName) {
+    this._fieldConfigBuilder.setDisplayName(displayName);
+    return this;
+  }
+  setFilterable(filterable) {
+    this._fieldConfigBuilder.setFilterable(filterable);
+    return this;
+  }
+  setLinks(links) {
+    this._fieldConfigBuilder.setLinks(links);
+    return this;
+  }
+  setMappings(mappings) {
+    this._fieldConfigBuilder.setMappings(mappings);
+    return this;
+  }
+  setMax(max) {
+    this._fieldConfigBuilder.setMax(max);
+    return this;
+  }
+  setMin(min) {
+    this._fieldConfigBuilder.setMin(min);
+    return this;
+  }
+  setNoValue(noValue) {
+    this._fieldConfigBuilder.setNoValue(noValue);
+    return this;
+  }
+  setThresholds(thresholds) {
+    this._fieldConfigBuilder.setThresholds(thresholds);
+    return this;
+  }
+  setUnit(unit) {
+    this._fieldConfigBuilder.setUnit(unit);
+    return this;
+  }
+  setCustomFieldConfig(id, value) {
+    this._fieldConfigBuilder.setCustomFieldConfig(id, value);
+    return this;
+  }
+  setOverrides(builder) {
+    this._fieldConfigBuilder.setOverrides(builder);
+    return this;
+  }
+  setOption(id, value) {
+    this._panelOptionsBuilder.setOption(id, value);
+    return this;
+  }
+  build() {
+    return {
+      pluginId: this._pluginId,
+      pluginVersion: this._pluginVersion,
+      options: this._panelOptionsBuilder.build(),
+      fieldConfig: this._fieldConfigBuilder.build()
+    };
+  }
+}
+
+const VizConfigBuilders = {
+  barchart() {
+    return new VizConfigBuilder(
+      "barchart",
+      "10.0.0",
+      () => BarChartPanelCfg_types_gen.defaultOptions,
+      () => BarChartPanelCfg_types_gen.defaultFieldConfig
+    );
+  },
+  bargauge() {
+    return new VizConfigBuilder("bargauge", "10.0.0", () => BarGaugePanelCfg_types_gen.defaultOptions);
+  },
+  datagrid() {
+    return new VizConfigBuilder("datagrid", "10.0.0", () => DatagridPanelCfg_types_gen.defaultOptions);
+  },
+  flamegraph() {
+    return new VizConfigBuilder("flamegraph", "10.0.0");
+  },
+  gauge() {
+    return new VizConfigBuilder("gauge", "10.0.0", () => GaugePanelCfg_types_gen.defaultOptions);
+  },
+  geomap() {
+    return new VizConfigBuilder("geomap", "10.0.0", () => GeomapPanelCfg_types_gen.defaultOptions);
+  },
+  heatmap() {
+    return new VizConfigBuilder("heatmap", "10.0.0", () => HeatmapPanelCfg_types_gen.defaultOptions);
+  },
+  histogram() {
+    return new VizConfigBuilder(
+      "histogram",
+      "10.0.0",
+      () => HistogramPanelCfg_types_gen.defaultOptions,
+      () => HistogramPanelCfg_types_gen.defaultFieldConfig
+    );
+  },
+  logs() {
+    return new VizConfigBuilder("logs", "10.0.0");
+  },
+  news() {
+    return new VizConfigBuilder("news", "10.0.0", () => NewsPanelCfg_types_gen.defaultOptions);
+  },
+  nodegraph() {
+    return new VizConfigBuilder("nodeGraph", "10.0.0");
+  },
+  piechart() {
+    return new VizConfigBuilder(
+      "piechart",
+      "10.0.0",
+      () => PieChartPanelCfg_types_gen.defaultOptions
+    );
+  },
+  stat() {
+    return new VizConfigBuilder("stat", "10.0.0", () => StatPanelCfg_types_gen.defaultOptions);
+  },
+  statetimeline() {
+    return new VizConfigBuilder(
+      "state-timeline",
+      "10.0.0",
+      () => StateTimelinePanelCfg_types_gen.defaultOptions,
+      () => StateTimelinePanelCfg_types_gen.defaultFieldConfig
+    );
+  },
+  statushistory() {
+    return new VizConfigBuilder(
+      "status-history",
+      "10.0.0",
+      () => StatusHistoryPanelCfg_types_gen.defaultOptions,
+      () => StatusHistoryPanelCfg_types_gen.defaultFieldConfig
+    );
+  },
+  table() {
+    return new VizConfigBuilder("table", "10.0.0", () => TablePanelCfg_types_gen.defaultOptions);
+  },
+  text() {
+    return new VizConfigBuilder("text", "10.0.0", () => TextPanelCfg_types_gen.defaultOptions);
+  },
+  timeseries() {
+    return new VizConfigBuilder("timeseries", "10.0.0");
+  },
+  trend() {
+    return new VizConfigBuilder("trend", "10.0.0");
+  },
+  traces() {
+    return new VizConfigBuilder("traces", "10.0.0");
+  },
+  xychart() {
+    return new VizConfigBuilder(
+      "xychart",
+      "10.0.0",
+      () => XYChartPanelCfg_types_gen.defaultOptions,
+      () => XYChartPanelCfg_types_gen.defaultFieldConfig
+    );
+  }
+};
+
 const sceneUtils = {
   getUrlWithAppState,
   registerRuntimePanelPlugin,
@@ -11140,6 +11329,7 @@ exports.ConstantVariable = ConstantVariable;
 exports.CustomVariable = CustomVariable;
 exports.DataSourceVariable = DataSourceVariable;
 exports.EmbeddedScene = EmbeddedScene;
+exports.FieldConfigBuilder = FieldConfigBuilder;
 exports.FieldConfigBuilders = FieldConfigBuilders;
 exports.FieldConfigOverridesBuilder = FieldConfigOverridesBuilder;
 exports.GroupByVariable = GroupByVariable;
@@ -11194,7 +11384,10 @@ exports.UrlSyncManager = UrlSyncManager;
 exports.UserActionEvent = UserActionEvent;
 exports.VariableDependencyConfig = VariableDependencyConfig;
 exports.VariableValueControl = VariableValueControl;
+exports.VariableValueSelectWrapper = VariableValueSelectWrapper;
 exports.VariableValueSelectors = VariableValueSelectors;
+exports.VizConfigBuilder = VizConfigBuilder;
+exports.VizConfigBuilders = VizConfigBuilders;
 exports.VizPanel = VizPanel;
 exports.VizPanelBuilder = VizPanelBuilder;
 exports.VizPanelMenu = VizPanelMenu;