@grafana/scenes 6.25.0 → 6.26.1--canary.1173.15996524097.0

package/dist/index.js

@@ -8378,6 +8378,253 @@ const createProperty = (color) => {
   };
 };
 
+class SceneDataLayerSetBase extends SceneObjectBase {
+  constructor() {
+    super(...arguments);
+    /** Mark it as a data layer */
+    this.isDataLayer = true;
+    /**
+     * Subject to emit results to.
+     */
+    this._results = new rxjs.ReplaySubject(1);
+    this._dataLayersMerger = new DataLayersMerger();
+  }
+  subscribeToAllLayers(layers) {
+    if (layers.length > 0) {
+      this.querySub = this._dataLayersMerger.getMergedStream(layers).subscribe(this._onLayerUpdateReceived.bind(this));
+    } else {
+      this._results.next({ origin: this, data: emptyPanelData });
+      this.setStateHelper({ data: emptyPanelData });
+    }
+  }
+  _onLayerUpdateReceived(results) {
+    var _a;
+    let series = [];
+    for (const result of results) {
+      if ((_a = result.data) == null ? void 0 : _a.series) {
+        series = series.concat(result.data.series);
+      }
+    }
+    const combinedData = { ...emptyPanelData, series };
+    this._results.next({ origin: this, data: combinedData });
+    this.setStateHelper({ data: combinedData });
+  }
+  getResultsStream() {
+    return this._results;
+  }
+  cancelQuery() {
+    var _a;
+    (_a = this.querySub) == null ? void 0 : _a.unsubscribe();
+  }
+  /**
+   * This helper function is to counter the contravariance of setState
+   */
+  setStateHelper(state) {
+    setBaseClassState(this, state);
+  }
+}
+class SceneDataLayerSet extends SceneDataLayerSetBase {
+  constructor(state) {
+    var _a, _b;
+    super({
+      name: (_a = state.name) != null ? _a : "Data layers",
+      layers: (_b = state.layers) != null ? _b : []
+    });
+    this.addActivationHandler(() => this._onActivate());
+  }
+  _onActivate() {
+    this._subs.add(
+      this.subscribeToState((newState, oldState) => {
+        var _a;
+        if (newState.layers !== oldState.layers) {
+          (_a = this.querySub) == null ? void 0 : _a.unsubscribe();
+          this.subscribeToAllLayers(newState.layers);
+        }
+      })
+    );
+    this.subscribeToAllLayers(this.state.layers);
+    return () => {
+      var _a;
+      (_a = this.querySub) == null ? void 0 : _a.unsubscribe();
+    };
+  }
+}
+SceneDataLayerSet.Component = ({ model }) => {
+  const { layers } = model.useState();
+  return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, layers.map((layer) => /* @__PURE__ */ React__default.default.createElement(layer.Component, { model: layer, key: layer.state.key })));
+};
+
+class SceneDataTransformer extends SceneObjectBase {
+  constructor(state) {
+    super(state);
+    this._results = new rxjs.ReplaySubject(1);
+    /**
+     * Scan transformations for variable usage and re-process transforms when a variable values change
+     */
+    this._variableDependency = new VariableDependencyConfig(
+      this,
+      {
+        statePaths: ["transformations"],
+        onReferencedVariableValueChanged: () => this.reprocessTransformations()
+      }
+    );
+    this.addActivationHandler(() => this.activationHandler());
+  }
+  activationHandler() {
+    const sourceData = this.getSourceData();
+    this._subs.add(sourceData.subscribeToState((state) => this.transform(state.data)));
+    if (sourceData.state.data) {
+      this.transform(sourceData.state.data);
+    }
+    return () => {
+      if (this._transformSub) {
+        this._transformSub.unsubscribe();
+      }
+    };
+  }
+  getSourceData() {
+    if (this.state.$data) {
+      if (this.state.$data instanceof SceneDataLayerSet) {
+        throw new Error("SceneDataLayerSet can not be used as data provider for SceneDataTransformer.");
+      }
+      return this.state.$data;
+    }
+    if (!this.parent || !this.parent.parent) {
+      throw new Error("SceneDataTransformer must either have $data set on it or have a parent.parent with $data");
+    }
+    return sceneGraph.getData(this.parent.parent);
+  }
+  setContainerWidth(width) {
+    if (this.state.$data && this.state.$data.setContainerWidth) {
+      this.state.$data.setContainerWidth(width);
+    }
+  }
+  isDataReadyToDisplay() {
+    const dataObject = this.getSourceData();
+    if (dataObject.isDataReadyToDisplay) {
+      return dataObject.isDataReadyToDisplay();
+    }
+    return true;
+  }
+  reprocessTransformations() {
+    this.transform(this.getSourceData().state.data, true);
+  }
+  cancelQuery() {
+    var _a, _b;
+    (_b = (_a = this.getSourceData()).cancelQuery) == null ? void 0 : _b.call(_a);
+  }
+  getResultsStream() {
+    return this._results;
+  }
+  clone(withState) {
+    const clone = super.clone(withState);
+    if (this._prevDataFromSource) {
+      clone["_prevDataFromSource"] = this._prevDataFromSource;
+    }
+    return clone;
+  }
+  haveAlreadyTransformedData(data) {
+    if (!this._prevDataFromSource) {
+      return false;
+    }
+    if (data === this._prevDataFromSource) {
+      return true;
+    }
+    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: { ...this.state.data, state: data.state } });
+      }
+      return true;
+    }
+    return false;
+  }
+  transform(data$1, force = false) {
+    var _a;
+    if (this.state.transformations.length === 0 || !data$1) {
+      this._prevDataFromSource = data$1;
+      this.setState({ data: data$1 });
+      if (data$1) {
+        this._results.next({ origin: this, data: data$1 });
+      }
+      return;
+    }
+    if (!force && this.haveAlreadyTransformedData(data$1)) {
+      return;
+    }
+    let interpolatedTransformations = this._interpolateVariablesInTransformationConfigs(data$1);
+    const seriesTransformations = interpolatedTransformations.filter((transformation) => {
+      if ("options" in transformation || "topic" in transformation) {
+        return transformation.topic == null || transformation.topic === data.DataTopic.Series;
+      }
+      return true;
+    }).map((transformation) => "operator" in transformation ? transformation.operator : transformation);
+    const annotationsTransformations = interpolatedTransformations.filter((transformation) => {
+      if ("options" in transformation || "topic" in transformation) {
+        return transformation.topic === data.DataTopic.Annotations;
+      }
+      return false;
+    }).map((transformation) => "operator" in transformation ? transformation.operator : transformation);
+    if (this._transformSub) {
+      this._transformSub.unsubscribe();
+    }
+    const ctx = {
+      interpolate: (value) => {
+        var _a2;
+        return sceneGraph.interpolate(this, value, (_a2 = data$1.request) == null ? void 0 : _a2.scopedVars);
+      }
+    };
+    let streams = [data.transformDataFrame(seriesTransformations, data$1.series, ctx)];
+    if (data$1.annotations && data$1.annotations.length > 0 && annotationsTransformations.length > 0) {
+      streams.push(data.transformDataFrame(annotationsTransformations, (_a = data$1.annotations) != null ? _a : []));
+    }
+    this._transformSub = rxjs.forkJoin(streams).pipe(
+      rxjs.map((values) => {
+        const transformedSeries = values[0];
+        const transformedAnnotations = values[1];
+        return {
+          ...data$1,
+          series: transformedSeries,
+          annotations: transformedAnnotations != null ? transformedAnnotations : data$1.annotations
+        };
+      }),
+      rxjs.catchError((err) => {
+        var _a2;
+        console.error("Error transforming data: ", err);
+        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 = {
+          ...data$1,
+          state: data.LoadingState.Error,
+          // Combine transformation error with upstream errors
+          errors: [...sourceErr, transformationError]
+        };
+        return rxjs.of(result);
+      })
+    ).subscribe((transformedData) => {
+      this.setState({ data: transformedData });
+      this._results.next({ origin: this, data: transformedData });
+      this._prevDataFromSource = data$1;
+    });
+  }
+  _interpolateVariablesInTransformationConfigs(data) {
+    var _a;
+    const transformations = this.state.transformations;
+    if (this._variableDependency.getNames().size === 0) {
+      return transformations;
+    }
+    const onlyObjects = transformations.every((t) => typeof t === "object");
+    if (onlyObjects) {
+      return JSON.parse(sceneGraph.interpolate(this, JSON.stringify(transformations), (_a = data.request) == null ? void 0 : _a.scopedVars));
+    }
+    return transformations.map((t) => {
+      var _a2;
+      return typeof t === "object" ? JSON.parse(sceneGraph.interpolate(this, JSON.stringify(t), (_a2 = data.request) == null ? void 0 : _a2.scopedVars)) : t;
+    });
+  }
+}
+
 class VizPanel extends SceneObjectBase {
   constructor(state) {
     var _a;
@@ -8616,6 +8863,17 @@ class VizPanel extends SceneObjectBase {
     if (plugin.onPanelMigration && currentVersion !== pluginVersion && !isAfterPluginChange) {
       panel.options = await plugin.onPanelMigration(panel);
     }
+    let $data = this.state.$data;
+    if (panel.transformations && $data) {
+      if ($data instanceof SceneDataTransformer) {
+        $data.setState({ transformations: panel.transformations });
+      } else if ($data instanceof SceneQueryRunner) {
+        $data = new SceneDataTransformer({
+          transformations: panel.transformations,
+          $data
+        });
+      }
+    }
     const withDefaults = data.getPanelOptionsWithDefaults({
       plugin,
       currentOptions: panel.options,
@@ -8624,6 +8882,7 @@ class VizPanel extends SceneObjectBase {
     });
     this._plugin = plugin;
     this.setState({
+      $data,
       options: withDefaults.options,
       fieldConfig: withDefaults.fieldConfig,
       pluginVersion: currentVersion,
@@ -9520,253 +9779,6 @@ class DataProviderProxy extends SceneObjectBase {
   }
 }
 
-class SceneDataLayerSetBase extends SceneObjectBase {
-  constructor() {
-    super(...arguments);
-    /** Mark it as a data layer */
-    this.isDataLayer = true;
-    /**
-     * Subject to emit results to.
-     */
-    this._results = new rxjs.ReplaySubject(1);
-    this._dataLayersMerger = new DataLayersMerger();
-  }
-  subscribeToAllLayers(layers) {
-    if (layers.length > 0) {
-      this.querySub = this._dataLayersMerger.getMergedStream(layers).subscribe(this._onLayerUpdateReceived.bind(this));
-    } else {
-      this._results.next({ origin: this, data: emptyPanelData });
-      this.setStateHelper({ data: emptyPanelData });
-    }
-  }
-  _onLayerUpdateReceived(results) {
-    var _a;
-    let series = [];
-    for (const result of results) {
-      if ((_a = result.data) == null ? void 0 : _a.series) {
-        series = series.concat(result.data.series);
-      }
-    }
-    const combinedData = { ...emptyPanelData, series };
-    this._results.next({ origin: this, data: combinedData });
-    this.setStateHelper({ data: combinedData });
-  }
-  getResultsStream() {
-    return this._results;
-  }
-  cancelQuery() {
-    var _a;
-    (_a = this.querySub) == null ? void 0 : _a.unsubscribe();
-  }
-  /**
-   * This helper function is to counter the contravariance of setState
-   */
-  setStateHelper(state) {
-    setBaseClassState(this, state);
-  }
-}
-class SceneDataLayerSet extends SceneDataLayerSetBase {
-  constructor(state) {
-    var _a, _b;
-    super({
-      name: (_a = state.name) != null ? _a : "Data layers",
-      layers: (_b = state.layers) != null ? _b : []
-    });
-    this.addActivationHandler(() => this._onActivate());
-  }
-  _onActivate() {
-    this._subs.add(
-      this.subscribeToState((newState, oldState) => {
-        var _a;
-        if (newState.layers !== oldState.layers) {
-          (_a = this.querySub) == null ? void 0 : _a.unsubscribe();
-          this.subscribeToAllLayers(newState.layers);
-        }
-      })
-    );
-    this.subscribeToAllLayers(this.state.layers);
-    return () => {
-      var _a;
-      (_a = this.querySub) == null ? void 0 : _a.unsubscribe();
-    };
-  }
-}
-SceneDataLayerSet.Component = ({ model }) => {
-  const { layers } = model.useState();
-  return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, layers.map((layer) => /* @__PURE__ */ React__default.default.createElement(layer.Component, { model: layer, key: layer.state.key })));
-};
-
-class SceneDataTransformer extends SceneObjectBase {
-  constructor(state) {
-    super(state);
-    this._results = new rxjs.ReplaySubject(1);
-    /**
-     * Scan transformations for variable usage and re-process transforms when a variable values change
-     */
-    this._variableDependency = new VariableDependencyConfig(
-      this,
-      {
-        statePaths: ["transformations"],
-        onReferencedVariableValueChanged: () => this.reprocessTransformations()
-      }
-    );
-    this.addActivationHandler(() => this.activationHandler());
-  }
-  activationHandler() {
-    const sourceData = this.getSourceData();
-    this._subs.add(sourceData.subscribeToState((state) => this.transform(state.data)));
-    if (sourceData.state.data) {
-      this.transform(sourceData.state.data);
-    }
-    return () => {
-      if (this._transformSub) {
-        this._transformSub.unsubscribe();
-      }
-    };
-  }
-  getSourceData() {
-    if (this.state.$data) {
-      if (this.state.$data instanceof SceneDataLayerSet) {
-        throw new Error("SceneDataLayerSet can not be used as data provider for SceneDataTransformer.");
-      }
-      return this.state.$data;
-    }
-    if (!this.parent || !this.parent.parent) {
-      throw new Error("SceneDataTransformer must either have $data set on it or have a parent.parent with $data");
-    }
-    return sceneGraph.getData(this.parent.parent);
-  }
-  setContainerWidth(width) {
-    if (this.state.$data && this.state.$data.setContainerWidth) {
-      this.state.$data.setContainerWidth(width);
-    }
-  }
-  isDataReadyToDisplay() {
-    const dataObject = this.getSourceData();
-    if (dataObject.isDataReadyToDisplay) {
-      return dataObject.isDataReadyToDisplay();
-    }
-    return true;
-  }
-  reprocessTransformations() {
-    this.transform(this.getSourceData().state.data, true);
-  }
-  cancelQuery() {
-    var _a, _b;
-    (_b = (_a = this.getSourceData()).cancelQuery) == null ? void 0 : _b.call(_a);
-  }
-  getResultsStream() {
-    return this._results;
-  }
-  clone(withState) {
-    const clone = super.clone(withState);
-    if (this._prevDataFromSource) {
-      clone["_prevDataFromSource"] = this._prevDataFromSource;
-    }
-    return clone;
-  }
-  haveAlreadyTransformedData(data) {
-    if (!this._prevDataFromSource) {
-      return false;
-    }
-    if (data === this._prevDataFromSource) {
-      return true;
-    }
-    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: { ...this.state.data, state: data.state } });
-      }
-      return true;
-    }
-    return false;
-  }
-  transform(data$1, force = false) {
-    var _a;
-    if (this.state.transformations.length === 0 || !data$1) {
-      this._prevDataFromSource = data$1;
-      this.setState({ data: data$1 });
-      if (data$1) {
-        this._results.next({ origin: this, data: data$1 });
-      }
-      return;
-    }
-    if (!force && this.haveAlreadyTransformedData(data$1)) {
-      return;
-    }
-    let interpolatedTransformations = this._interpolateVariablesInTransformationConfigs(data$1);
-    const seriesTransformations = interpolatedTransformations.filter((transformation) => {
-      if ("options" in transformation || "topic" in transformation) {
-        return transformation.topic == null || transformation.topic === data.DataTopic.Series;
-      }
-      return true;
-    }).map((transformation) => "operator" in transformation ? transformation.operator : transformation);
-    const annotationsTransformations = interpolatedTransformations.filter((transformation) => {
-      if ("options" in transformation || "topic" in transformation) {
-        return transformation.topic === data.DataTopic.Annotations;
-      }
-      return false;
-    }).map((transformation) => "operator" in transformation ? transformation.operator : transformation);
-    if (this._transformSub) {
-      this._transformSub.unsubscribe();
-    }
-    const ctx = {
-      interpolate: (value) => {
-        var _a2;
-        return sceneGraph.interpolate(this, value, (_a2 = data$1.request) == null ? void 0 : _a2.scopedVars);
-      }
-    };
-    let streams = [data.transformDataFrame(seriesTransformations, data$1.series, ctx)];
-    if (data$1.annotations && data$1.annotations.length > 0 && annotationsTransformations.length > 0) {
-      streams.push(data.transformDataFrame(annotationsTransformations, (_a = data$1.annotations) != null ? _a : []));
-    }
-    this._transformSub = rxjs.forkJoin(streams).pipe(
-      rxjs.map((values) => {
-        const transformedSeries = values[0];
-        const transformedAnnotations = values[1];
-        return {
-          ...data$1,
-          series: transformedSeries,
-          annotations: transformedAnnotations != null ? transformedAnnotations : data$1.annotations
-        };
-      }),
-      rxjs.catchError((err) => {
-        var _a2;
-        console.error("Error transforming data: ", err);
-        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 = {
-          ...data$1,
-          state: data.LoadingState.Error,
-          // Combine transformation error with upstream errors
-          errors: [...sourceErr, transformationError]
-        };
-        return rxjs.of(result);
-      })
-    ).subscribe((transformedData) => {
-      this.setState({ data: transformedData });
-      this._results.next({ origin: this, data: transformedData });
-      this._prevDataFromSource = data$1;
-    });
-  }
-  _interpolateVariablesInTransformationConfigs(data) {
-    var _a;
-    const transformations = this.state.transformations;
-    if (this._variableDependency.getNames().size === 0) {
-      return transformations;
-    }
-    const onlyObjects = transformations.every((t) => typeof t === "object");
-    if (onlyObjects) {
-      return JSON.parse(sceneGraph.interpolate(this, JSON.stringify(transformations), (_a = data.request) == null ? void 0 : _a.scopedVars));
-    }
-    return transformations.map((t) => {
-      var _a2;
-      return typeof t === "object" ? JSON.parse(sceneGraph.interpolate(this, JSON.stringify(t), (_a2 = data.request) == null ? void 0 : _a2.scopedVars)) : t;
-    });
-  }
-}
-
 class VariableValueSelectors extends SceneObjectBase {
 }
 VariableValueSelectors.Component = VariableValueSelectorsRenderer;
@@ -12093,7 +12105,7 @@ const PREVIOUS_PERIOD_COMPARE_OPTION = {
   value: PREVIOUS_PERIOD_VALUE
 };
 const NO_COMPARE_OPTION = {
-  label: "No comparison",
+  label: "None",
   value: NO_PERIOD_VALUE
 };
 const DEFAULT_COMPARE_OPTIONS = [
@@ -12248,7 +12260,7 @@ const timeShiftAlignmentProcessor = (primary, secondary) => {
 function SceneTimeRangeCompareRenderer({ model }) {
   var _a;
   const styles = ui.useStyles2(getStyles$4);
-  const { compareWith, compareOptions } = model.useState();
+  const { compareWith, compareOptions, hideCheckbox } = 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);
@@ -12261,7 +12273,13 @@ function SceneTimeRangeCompareRenderer({ model }) {
       model.onCompareWithChanged(previousValue.value);
     }
   };
-  return /* @__PURE__ */ React__default.default.createElement(ui.ButtonGroup, null, /* @__PURE__ */ React__default.default.createElement(
+  const selectValue = hideCheckbox && !compareWith ? NO_COMPARE_OPTION : value;
+  const showSelect = hideCheckbox || enabled;
+  const displayValue = hideCheckbox && selectValue ? {
+    ...selectValue,
+    label: `Comparison: ${selectValue.label}`
+  } : selectValue;
+  return /* @__PURE__ */ React__default.default.createElement(ui.ButtonGroup, null, !hideCheckbox && /* @__PURE__ */ React__default.default.createElement(
     ui.ToolbarButton,
     {
       variant: "canvas",
@@ -12277,11 +12295,11 @@ function SceneTimeRangeCompareRenderer({ model }) {
     },
     /* @__PURE__ */ React__default.default.createElement(ui.Checkbox, { label: " ", value: enabled, onClick }),
     /* @__PURE__ */ React__default.default.createElement(i18n.Trans, { i18nKey: "grafana-scenes.components.scene-time-range-compare-renderer.button-label" }, "Comparison")
-  ), enabled ? /* @__PURE__ */ React__default.default.createElement(
+  ), showSelect ? /* @__PURE__ */ React__default.default.createElement(
     ui.ButtonSelect,
     {
       variant: "canvas",
-      value,
+      value: displayValue,
       options: compareOptions,
       onChange: (v) => {
         model.onCompareWithChanged(v.value);