@grafana/scenes 6.39.4--canary.1271.18383171846.0 → 6.39.5--canary.1266.18407595746.0

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# v6.39.4 (Fri Oct 10 2025)
+
+#### 🐛 Bug Fix
+
+- CustomVariable: Expose query parsing mechanism [#1269](https://github.com/grafana/scenes/pull/1269) ([@bfmatei](https://github.com/bfmatei))
+
+#### Authors: 1
+
+- Bogdan Matei ([@bfmatei](https://github.com/bfmatei))
+
+---
+
 # v6.39.3 (Thu Oct 09 2025)
 
 #### 🐛 Bug Fix

package/dist/esm/querying/SceneDataTransformer.js

@@ -112,19 +112,25 @@ class SceneDataTransformer extends SceneObjectBase {
     if (!force && this.haveAlreadyTransformedData(data)) {
       return;
     }
-    let interpolatedTransformations = this._interpolateVariablesInTransformationConfigs(data);
-    const seriesTransformations = interpolatedTransformations.filter((transformation) => {
-      if ("options" in transformation || "topic" in transformation) {
-        return transformation.topic == null || transformation.topic === DataTopic.Series;
+    const interpolatedTransformations = this._interpolateVariablesInTransformationConfigs(data);
+    const seriesTransformations = this._filterAndPrepareTransformationsByTopic(
+      interpolatedTransformations,
+      (transformation) => {
+        if ("options" in transformation || "topic" in transformation) {
+          return transformation.topic == null || transformation.topic === DataTopic.Series;
+        }
+        return true;
       }
-      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 === DataTopic.Annotations;
+    );
+    const annotationsTransformations = this._filterAndPrepareTransformationsByTopic(
+      interpolatedTransformations,
+      (transformation) => {
+        if ("options" in transformation || "topic" in transformation) {
+          return transformation.topic === DataTopic.Annotations;
+        }
+        return false;
       }
-      return false;
-    }).map((transformation) => "operator" in transformation ? transformation.operator : transformation);
+    );
     if (this._transformSub) {
       this._transformSub.unsubscribe();
     }
@@ -134,13 +140,11 @@ class SceneDataTransformer extends SceneObjectBase {
         return sceneGraph.interpolate(this, value, { ...(_a2 = data.request) == null ? void 0 : _a2.scopedVars, ...scopedVars });
       }
     };
-    let streams = [transformDataFrame(seriesTransformations, data.series, ctx)];
-    if (data.annotations && data.annotations.length > 0 && annotationsTransformations.length > 0) {
-      streams.push(transformDataFrame(annotationsTransformations, (_a = data.annotations) != null ? _a : []));
-    }
+    const seriesStream = transformDataFrame(seriesTransformations, data.series, ctx);
+    const annotationsStream = transformDataFrame(annotationsTransformations, (_a = data.annotations) != null ? _a : []);
     let series = [];
     let annotations = [];
-    this._transformSub = forkJoin(streams).pipe(
+    this._transformSub = forkJoin([seriesStream, annotationsStream]).pipe(
       map((results) => {
         results.forEach((frames) => {
           var _a2;
@@ -189,6 +193,9 @@ class SceneDataTransformer extends SceneObjectBase {
       return typeof t === "object" ? JSON.parse(sceneGraph.interpolate(this, JSON.stringify(t), (_a2 = data.request) == null ? void 0 : _a2.scopedVars)) : t;
     });
   }
+  _filterAndPrepareTransformationsByTopic(interpolatedTransformations, transformationFilter) {
+    return interpolatedTransformations.filter(transformationFilter).map((transformation) => "operator" in transformation ? transformation.operator : transformation);
+  }
 }
 
 export { SceneDataTransformer };

package/dist/esm/querying/SceneDataTransformer.js.map

@@ -1 +1 @@
-{"version":3,"file":"SceneDataTransformer.js","sources":["../../../src/querying/SceneDataTransformer.ts"],"sourcesContent":["import {\n  DataFrame,\n  DataTopic,\n  DataTransformerConfig,\n  LoadingState,\n  PanelData,\n  ScopedVars,\n  transformDataFrame,\n} from '@grafana/data';\nimport { toDataQueryError } from '@grafana/runtime';\nimport { catchError, forkJoin, map, of, ReplaySubject, Unsubscribable } from 'rxjs';\nimport { sceneGraph } from '../core/sceneGraph';\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { CustomTransformerDefinition, SceneDataProvider, SceneDataProviderResult, SceneDataState } from '../core/types';\nimport { VariableDependencyConfig } from '../variables/VariableDependencyConfig';\nimport { SceneDataLayerSet } from './SceneDataLayerSet';\n\nexport interface SceneDataTransformerState extends SceneDataState {\n  /**\n   * Array of standard transformation configs and custom transform operators\n   */\n  transformations: Array<DataTransformerConfig | CustomTransformerDefinition>;\n}\n\n/**\n * You can use this as a $data object. It can either transform an inner $data DataProvider or if that is not set it will\n * subscribe to a DataProvider higher up in the scene graph and transform its data.\n *\n * The transformations array supports custom (runtime defined) transformation as well as declarative core transformations.\n * You can manually re-process the transformations by calling reprocessTransformations(). This is useful if you have\n * transformations that depend on other scene object states.\n */\nexport class SceneDataTransformer extends SceneObjectBase<SceneDataTransformerState> implements SceneDataProvider {\n  private _transformSub?: Unsubscribable;\n  private _results = new ReplaySubject<SceneDataProviderResult>(1);\n  private _prevDataFromSource?: PanelData;\n\n  /**\n   * Scan transformations for variable usage and re-process transforms when a variable values change\n   */\n  protected _variableDependency: VariableDependencyConfig<SceneDataTransformerState> = new VariableDependencyConfig(\n    this,\n    {\n      statePaths: ['transformations'],\n      onReferencedVariableValueChanged: () => this.reprocessTransformations(),\n    }\n  );\n\n  public constructor(state: SceneDataTransformerState) {\n    super(state);\n\n    this.addActivationHandler(() => this.activationHandler());\n  }\n\n  private activationHandler() {\n    const sourceData = this.getSourceData();\n\n    this._subs.add(sourceData.subscribeToState((state) => this.transform(state.data)));\n\n    if (sourceData.state.data) {\n      this.transform(sourceData.state.data);\n    }\n\n    return () => {\n      if (this._transformSub) {\n        this._transformSub.unsubscribe();\n      }\n    };\n  }\n\n  private getSourceData(): SceneDataProvider {\n    if (this.state.$data) {\n      if (this.state.$data instanceof SceneDataLayerSet) {\n        throw new Error('SceneDataLayerSet can not be used as data provider for SceneDataTransformer.');\n      }\n      return this.state.$data;\n    }\n\n    if (!this.parent || !this.parent.parent) {\n      throw new Error('SceneDataTransformer must either have $data set on it or have a parent.parent with $data');\n    }\n\n    return sceneGraph.getData(this.parent.parent);\n  }\n\n  public setContainerWidth(width: number) {\n    if (this.state.$data && this.state.$data.setContainerWidth) {\n      this.state.$data.setContainerWidth(width);\n    }\n  }\n\n  public isDataReadyToDisplay() {\n    const dataObject = this.getSourceData();\n    if (dataObject.isDataReadyToDisplay) {\n      return dataObject.isDataReadyToDisplay();\n    }\n\n    return true;\n  }\n\n  public reprocessTransformations() {\n    this.transform(this.getSourceData().state.data, true);\n  }\n\n  public cancelQuery() {\n    this.getSourceData().cancelQuery?.();\n  }\n\n  public getResultsStream() {\n    return this._results;\n  }\n\n  public clone(withState?: Partial<SceneDataTransformerState>) {\n    const clone = super.clone(withState);\n\n    if (this._prevDataFromSource) {\n      clone['_prevDataFromSource'] = this._prevDataFromSource;\n    }\n\n    return clone;\n  }\n\n  public isInViewChanged(isInView: boolean) {\n    this.state.$data?.isInViewChanged?.(isInView);\n  }\n\n  public bypassIsInViewChanged(bypassIsInView: boolean) {\n    this.state.$data?.bypassIsInViewChanged?.(bypassIsInView);\n  }\n\n  private haveAlreadyTransformedData(data: PanelData) {\n    if (!this._prevDataFromSource) {\n      return false;\n    }\n\n    if (data === this._prevDataFromSource) {\n      return true;\n    }\n\n    const { series, annotations } = this._prevDataFromSource;\n\n    if (data.series === series && data.annotations === annotations) {\n      if (this.state.data && data.state !== this.state.data.state) {\n        this.setState({ data: { ...this.state.data, state: data.state } });\n      }\n      return true;\n    }\n\n    return false;\n  }\n\n  private transform(data: PanelData | undefined, force = false) {\n    if (this.state.transformations.length === 0 || !data) {\n      this._prevDataFromSource = data;\n      this.setState({ data });\n\n      if (data) {\n        this._results.next({ origin: this, data });\n      }\n      return;\n    }\n\n    // Skip transform step if we have already transformed this data\n    if (!force && this.haveAlreadyTransformedData(data)) {\n      return;\n    }\n\n    let interpolatedTransformations = this._interpolateVariablesInTransformationConfigs(data);\n\n    const seriesTransformations = interpolatedTransformations\n      .filter((transformation) => {\n        if ('options' in transformation || 'topic' in transformation) {\n          return transformation.topic == null || transformation.topic === DataTopic.Series;\n        }\n\n        return true;\n      })\n      .map((transformation) => ('operator' in transformation ? transformation.operator : transformation));\n\n    const annotationsTransformations = interpolatedTransformations\n      .filter((transformation) => {\n        if ('options' in transformation || 'topic' in transformation) {\n          return transformation.topic === DataTopic.Annotations;\n        }\n\n        return false;\n      })\n      .map((transformation) => ('operator' in transformation ? transformation.operator : transformation));\n\n    if (this._transformSub) {\n      this._transformSub.unsubscribe();\n    }\n\n    const ctx = {\n      interpolate: (value: string, scopedVars?: ScopedVars) => {\n        return sceneGraph.interpolate(this, value, { ...data.request?.scopedVars, ...scopedVars });\n      },\n    };\n\n    let streams = [transformDataFrame(seriesTransformations, data.series, ctx)];\n\n    if (data.annotations && data.annotations.length > 0 && annotationsTransformations.length > 0) {\n      streams.push(transformDataFrame(annotationsTransformations, data.annotations ?? []));\n    }\n\n    let series: DataFrame[] = [];\n    let annotations: DataFrame[] = [];\n\n    this._transformSub = forkJoin(streams)\n      .pipe(\n        map((results) => {\n          // this strategy allows transformations to take in series frames and produce anno frames\n          // we look at each transformation's result and put it in the correct place\n          results.forEach((frames) => {\n            for (const frame of frames) {\n              if (frame.meta?.dataTopic === DataTopic.Annotations) {\n                annotations.push(frame);\n              } else {\n                series.push(frame);\n              }\n            }\n          });\n\n          return { ...data, series, annotations };\n        }),\n        catchError((err) => {\n          console.error('Error transforming data: ', err);\n          const sourceErr = this.getSourceData().state.data?.errors || [];\n\n          const transformationError = toDataQueryError(err);\n          transformationError.message = `Error transforming data: ${transformationError.message}`;\n\n          const result: PanelData = {\n            ...data,\n            state: LoadingState.Error,\n            // Combine transformation error with upstream errors\n            errors: [...sourceErr, transformationError],\n          };\n\n          return of(result);\n        })\n      )\n      .subscribe((transformedData) => {\n        this.setState({ data: transformedData });\n        this._results.next({ origin: this, data: transformedData });\n        this._prevDataFromSource = data;\n      });\n  }\n\n  private _interpolateVariablesInTransformationConfigs(\n    data: PanelData\n  ): Array<DataTransformerConfig | CustomTransformerDefinition> {\n    const transformations = this.state.transformations;\n\n    if (this._variableDependency.getNames().size === 0) {\n      return transformations;\n    }\n\n    const onlyObjects = transformations.every((t) => typeof t === 'object');\n\n    // If all transformations are config object we can interpolate them all at once\n    if (onlyObjects) {\n      return JSON.parse(sceneGraph.interpolate(this, JSON.stringify(transformations), data.request?.scopedVars));\n    }\n\n    return transformations.map((t) => {\n      return typeof t === 'object'\n        ? JSON.parse(sceneGraph.interpolate(this, JSON.stringify(t), data.request?.scopedVars))\n        : t;\n    });\n  }\n}\n"],"names":["_a"],"mappings":"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"}
+{"version":3,"file":"SceneDataTransformer.js","sources":["../../../src/querying/SceneDataTransformer.ts"],"sourcesContent":["import {\n  CustomTransformOperator,\n  DataFrame,\n  DataTopic,\n  DataTransformerConfig,\n  LoadingState,\n  PanelData,\n  ScopedVars,\n  transformDataFrame,\n} from '@grafana/data';\nimport { toDataQueryError } from '@grafana/runtime';\nimport { catchError, forkJoin, map, of, ReplaySubject, Unsubscribable } from 'rxjs';\nimport { sceneGraph } from '../core/sceneGraph';\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { CustomTransformerDefinition, SceneDataProvider, SceneDataProviderResult, SceneDataState } from '../core/types';\nimport { VariableDependencyConfig } from '../variables/VariableDependencyConfig';\nimport { SceneDataLayerSet } from './SceneDataLayerSet';\n\nexport interface SceneDataTransformerState extends SceneDataState {\n  /**\n   * Array of standard transformation configs and custom transform operators\n   */\n  transformations: Array<DataTransformerConfig | CustomTransformerDefinition>;\n}\n\n/**\n * You can use this as a $data object. It can either transform an inner $data DataProvider or if that is not set it will\n * subscribe to a DataProvider higher up in the scene graph and transform its data.\n *\n * The transformations array supports custom (runtime defined) transformation as well as declarative core transformations.\n * You can manually re-process the transformations by calling reprocessTransformations(). This is useful if you have\n * transformations that depend on other scene object states.\n */\nexport class SceneDataTransformer extends SceneObjectBase<SceneDataTransformerState> implements SceneDataProvider {\n  private _transformSub?: Unsubscribable;\n  private _results = new ReplaySubject<SceneDataProviderResult>(1);\n  private _prevDataFromSource?: PanelData;\n\n  /**\n   * Scan transformations for variable usage and re-process transforms when a variable values change\n   */\n  protected _variableDependency: VariableDependencyConfig<SceneDataTransformerState> = new VariableDependencyConfig(\n    this,\n    {\n      statePaths: ['transformations'],\n      onReferencedVariableValueChanged: () => this.reprocessTransformations(),\n    }\n  );\n\n  public constructor(state: SceneDataTransformerState) {\n    super(state);\n\n    this.addActivationHandler(() => this.activationHandler());\n  }\n\n  private activationHandler() {\n    const sourceData = this.getSourceData();\n\n    this._subs.add(sourceData.subscribeToState((state) => this.transform(state.data)));\n\n    if (sourceData.state.data) {\n      this.transform(sourceData.state.data);\n    }\n\n    return () => {\n      if (this._transformSub) {\n        this._transformSub.unsubscribe();\n      }\n    };\n  }\n\n  private getSourceData(): SceneDataProvider {\n    if (this.state.$data) {\n      if (this.state.$data instanceof SceneDataLayerSet) {\n        throw new Error('SceneDataLayerSet can not be used as data provider for SceneDataTransformer.');\n      }\n      return this.state.$data;\n    }\n\n    if (!this.parent || !this.parent.parent) {\n      throw new Error('SceneDataTransformer must either have $data set on it or have a parent.parent with $data');\n    }\n\n    return sceneGraph.getData(this.parent.parent);\n  }\n\n  public setContainerWidth(width: number) {\n    if (this.state.$data && this.state.$data.setContainerWidth) {\n      this.state.$data.setContainerWidth(width);\n    }\n  }\n\n  public isDataReadyToDisplay() {\n    const dataObject = this.getSourceData();\n    if (dataObject.isDataReadyToDisplay) {\n      return dataObject.isDataReadyToDisplay();\n    }\n\n    return true;\n  }\n\n  public reprocessTransformations() {\n    this.transform(this.getSourceData().state.data, true);\n  }\n\n  public cancelQuery() {\n    this.getSourceData().cancelQuery?.();\n  }\n\n  public getResultsStream() {\n    return this._results;\n  }\n\n  public clone(withState?: Partial<SceneDataTransformerState>) {\n    const clone = super.clone(withState);\n\n    if (this._prevDataFromSource) {\n      clone['_prevDataFromSource'] = this._prevDataFromSource;\n    }\n\n    return clone;\n  }\n\n  public isInViewChanged(isInView: boolean) {\n    this.state.$data?.isInViewChanged?.(isInView);\n  }\n\n  public bypassIsInViewChanged(bypassIsInView: boolean) {\n    this.state.$data?.bypassIsInViewChanged?.(bypassIsInView);\n  }\n\n  private haveAlreadyTransformedData(data: PanelData) {\n    if (!this._prevDataFromSource) {\n      return false;\n    }\n\n    if (data === this._prevDataFromSource) {\n      return true;\n    }\n\n    const { series, annotations } = this._prevDataFromSource;\n\n    if (data.series === series && data.annotations === annotations) {\n      if (this.state.data && data.state !== this.state.data.state) {\n        this.setState({ data: { ...this.state.data, state: data.state } });\n      }\n      return true;\n    }\n\n    return false;\n  }\n\n  private transform(data: PanelData | undefined, force = false) {\n    if (this.state.transformations.length === 0 || !data) {\n      this._prevDataFromSource = data;\n      this.setState({ data });\n\n      if (data) {\n        this._results.next({ origin: this, data });\n      }\n      return;\n    }\n\n    // Skip transform step if we have already transformed this data\n    if (!force && this.haveAlreadyTransformedData(data)) {\n      return;\n    }\n\n    const interpolatedTransformations = this._interpolateVariablesInTransformationConfigs(data);\n\n    const seriesTransformations = this._filterAndPrepareTransformationsByTopic(\n      interpolatedTransformations,\n      (transformation) => {\n        if ('options' in transformation || 'topic' in transformation) {\n          return transformation.topic == null || transformation.topic === DataTopic.Series;\n        }\n        return true;\n      }\n    );\n    const annotationsTransformations = this._filterAndPrepareTransformationsByTopic(\n      interpolatedTransformations,\n      (transformation) => {\n        if ('options' in transformation || 'topic' in transformation) {\n          return transformation.topic === DataTopic.Annotations;\n        }\n        return false;\n      }\n    );\n\n    if (this._transformSub) {\n      this._transformSub.unsubscribe();\n    }\n\n    const ctx = {\n      interpolate: (value: string, scopedVars?: ScopedVars) => {\n        return sceneGraph.interpolate(this, value, { ...data.request?.scopedVars, ...scopedVars });\n      },\n    };\n\n    const seriesStream = transformDataFrame(seriesTransformations, data.series, ctx);\n    const annotationsStream = transformDataFrame(annotationsTransformations, data.annotations ?? []);\n\n    let series: DataFrame[] = [];\n    let annotations: DataFrame[] = [];\n\n    this._transformSub = forkJoin([seriesStream, annotationsStream])\n      .pipe(\n        map((results) => {\n          // this strategy allows transformations to take in series frames and produce anno frames\n          // we look at each transformation's result and put it in the correct place\n          results.forEach((frames) => {\n            for (const frame of frames) {\n              if (frame.meta?.dataTopic === DataTopic.Annotations) {\n                annotations.push(frame);\n              } else {\n                series.push(frame);\n              }\n            }\n          });\n\n          return { ...data, series, annotations };\n        }),\n        catchError((err) => {\n          console.error('Error transforming data: ', err);\n          const sourceErr = this.getSourceData().state.data?.errors || [];\n\n          const transformationError = toDataQueryError(err);\n          transformationError.message = `Error transforming data: ${transformationError.message}`;\n\n          const result: PanelData = {\n            ...data,\n            state: LoadingState.Error,\n            // Combine transformation error with upstream errors\n            errors: [...sourceErr, transformationError],\n          };\n\n          return of(result);\n        })\n      )\n      .subscribe((transformedData) => {\n        this.setState({ data: transformedData });\n        this._results.next({ origin: this, data: transformedData });\n        this._prevDataFromSource = data;\n      });\n  }\n\n  private _interpolateVariablesInTransformationConfigs(\n    data: PanelData\n  ): Array<DataTransformerConfig | CustomTransformerDefinition> {\n    const transformations = this.state.transformations;\n\n    if (this._variableDependency.getNames().size === 0) {\n      return transformations;\n    }\n\n    const onlyObjects = transformations.every((t) => typeof t === 'object');\n\n    // If all transformations are config object we can interpolate them all at once\n    if (onlyObjects) {\n      return JSON.parse(sceneGraph.interpolate(this, JSON.stringify(transformations), data.request?.scopedVars));\n    }\n\n    return transformations.map((t) => {\n      return typeof t === 'object'\n        ? JSON.parse(sceneGraph.interpolate(this, JSON.stringify(t), data.request?.scopedVars))\n        : t;\n    });\n  }\n\n  private _filterAndPrepareTransformationsByTopic(\n    interpolatedTransformations: Array<DataTransformerConfig<any> | CustomTransformerDefinition>,\n    transformationFilter: (transformation: DataTransformerConfig<any> | CustomTransformerDefinition) => boolean\n  ): Array<DataTransformerConfig<any> | CustomTransformOperator> {\n    return interpolatedTransformations\n      .filter(transformationFilter)\n      .map((transformation) => ('operator' in transformation ? transformation.operator : transformation));\n  }\n}\n"],"names":["_a"],"mappings":"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"}

package/dist/esm/variables/adhoc/AdHocFilterBuilder.js

@@ -1,12 +1,10 @@
 import { t } from '@grafana/i18n';
 import React from 'react';
 import { AdHocFilterRenderer } from './AdHocFilterRenderer.js';
-import { useStyles2, Button } from '@grafana/ui';
-import { css } from '@emotion/css';
+import { Button } from '@grafana/ui';
 
 function AdHocFilterBuilder({ model, addFilterButtonText }) {
   const { _wip } = model.useState();
-  const styles = useStyles2(getStyles);
   if (!_wip) {
     return /* @__PURE__ */ React.createElement(
       Button,
@@ -16,22 +14,13 @@ function AdHocFilterBuilder({ model, addFilterButtonText }) {
         title: t("grafana-scenes.variables.ad-hoc-filter-builder.title-add-filter", "Add filter"),
         "aria-label": t("grafana-scenes.variables.ad-hoc-filter-builder.aria-label-add-filter", "Add filter"),
         "data-testid": `AdHocFilter-add`,
-        onClick: () => model._addWip(),
-        className: styles.addButton
+        onClick: () => model._addWip()
       },
       addFilterButtonText
     );
   }
   return /* @__PURE__ */ React.createElement(AdHocFilterRenderer, { filter: _wip, model });
 }
-const getStyles = (theme) => ({
-  addButton: css({
-    "&:first-child": {
-      borderBottomLeftRadius: 0,
-      borderTopLeftRadius: 0
-    }
-  })
-});
 
 export { AdHocFilterBuilder };
 //# sourceMappingURL=AdHocFilterBuilder.js.map

package/dist/esm/variables/adhoc/AdHocFilterBuilder.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdHocFilterBuilder.js","sources":["../../../../src/variables/adhoc/AdHocFilterBuilder.tsx"],"sourcesContent":["import { t } from '@grafana/i18n';\nimport React from 'react';\n\nimport { AdHocFilterRenderer } from './AdHocFilterRenderer';\nimport { AdHocFiltersVariable } from './AdHocFiltersVariable';\nimport { Button, useStyles2 } from '@grafana/ui';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { css } from '@emotion/css';\n\ninterface Props {\n  model: AdHocFiltersVariable;\n  addFilterButtonText?: string;\n}\n\nexport function AdHocFilterBuilder({ model, addFilterButtonText }: Props) {\n  const { _wip } = model.useState();\n  const styles = useStyles2(getStyles);\n\n  if (!_wip) {\n    return (\n      <Button\n        variant=\"secondary\"\n        icon=\"plus\"\n        title={t('grafana-scenes.variables.ad-hoc-filter-builder.title-add-filter', 'Add filter')}\n        aria-label={t('grafana-scenes.variables.ad-hoc-filter-builder.aria-label-add-filter', 'Add filter')}\n        data-testid={`AdHocFilter-add`}\n        onClick={() => model._addWip()}\n        className={styles.addButton}\n      >\n        {addFilterButtonText}\n      </Button>\n    );\n  }\n\n  return <AdHocFilterRenderer filter={_wip} model={model} />;\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  addButton: css({\n    '&:first-child': {\n      borderBottomLeftRadius: 0,\n      borderTopLeftRadius: 0,\n    },\n  }),\n});\n"],"names":[],"mappings":";;;;;;AAcO,SAAS,kBAAmB,CAAA,EAAE,KAAO,EAAA,mBAAA,EAA8B,EAAA;AACxE,EAAA,MAAM,EAAE,IAAA,EAAS,GAAA,KAAA,CAAM,QAAS,EAAA;AAChC,EAAM,MAAA,MAAA,GAAS,WAAW,SAAS,CAAA;AAEnC,EAAA,IAAI,CAAC,IAAM,EAAA;AACT,IACE,uBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,IAAK,EAAA,MAAA;AAAA,QACL,KAAA,EAAO,CAAE,CAAA,iEAAA,EAAmE,YAAY,CAAA;AAAA,QACxF,YAAA,EAAY,CAAE,CAAA,sEAAA,EAAwE,YAAY,CAAA;AAAA,QAClG,aAAa,EAAA,CAAA,eAAA,CAAA;AAAA,QACb,OAAA,EAAS,MAAM,KAAA,CAAM,OAAQ,EAAA;AAAA,QAC7B,WAAW,MAAO,CAAA;AAAA,OAAA;AAAA,MAEjB;AAAA,KACH;AAAA;AAIJ,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,EAAoB,MAAQ,EAAA,IAAA,EAAM,KAAc,EAAA,CAAA;AAC1D;AAEA,MAAM,SAAA,GAAY,CAAC,KAA0B,MAAA;AAAA,EAC3C,WAAW,GAAI,CAAA;AAAA,IACb,eAAiB,EAAA;AAAA,MACf,sBAAwB,EAAA,CAAA;AAAA,MACxB,mBAAqB,EAAA;AAAA;AACvB,GACD;AACH,CAAA,CAAA;;;;"}
+{"version":3,"file":"AdHocFilterBuilder.js","sources":["../../../../src/variables/adhoc/AdHocFilterBuilder.tsx"],"sourcesContent":["import { t } from '@grafana/i18n';\nimport React from 'react';\n\nimport { AdHocFilterRenderer } from './AdHocFilterRenderer';\nimport { AdHocFiltersVariable } from './AdHocFiltersVariable';\nimport { Button } from '@grafana/ui';\n\ninterface Props {\n  model: AdHocFiltersVariable;\n  addFilterButtonText?: string;\n}\n\nexport function AdHocFilterBuilder({ model, addFilterButtonText }: Props) {\n  const { _wip } = model.useState();\n\n  if (!_wip) {\n    return (\n      <Button\n        variant=\"secondary\"\n        icon=\"plus\"\n        title={t('grafana-scenes.variables.ad-hoc-filter-builder.title-add-filter', 'Add filter')}\n        aria-label={t('grafana-scenes.variables.ad-hoc-filter-builder.aria-label-add-filter', 'Add filter')}\n        data-testid={`AdHocFilter-add`}\n        onClick={() => model._addWip()}\n      >\n        {addFilterButtonText}\n      </Button>\n    );\n  }\n\n  return <AdHocFilterRenderer filter={_wip} model={model} />;\n}\n"],"names":[],"mappings":";;;;;AAYO,SAAS,kBAAmB,CAAA,EAAE,KAAO,EAAA,mBAAA,EAA8B,EAAA;AACxE,EAAA,MAAM,EAAE,IAAA,EAAS,GAAA,KAAA,CAAM,QAAS,EAAA;AAEhC,EAAA,IAAI,CAAC,IAAM,EAAA;AACT,IACE,uBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,IAAK,EAAA,MAAA;AAAA,QACL,KAAA,EAAO,CAAE,CAAA,iEAAA,EAAmE,YAAY,CAAA;AAAA,QACxF,YAAA,EAAY,CAAE,CAAA,sEAAA,EAAwE,YAAY,CAAA;AAAA,QAClG,aAAa,EAAA,CAAA,eAAA,CAAA;AAAA,QACb,OAAA,EAAS,MAAM,KAAA,CAAM,OAAQ;AAAA,OAAA;AAAA,MAE5B;AAAA,KACH;AAAA;AAIJ,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,EAAoB,MAAQ,EAAA,IAAA,EAAM,KAAc,EAAA,CAAA;AAC1D;;;;"}

package/dist/esm/variables/adhoc/AdHocFilterRenderer.js

@@ -250,12 +250,6 @@ const getStyles = (theme) => ({
   }),
   wrapper: css({
     display: "flex",
-    "&:first-child": {
-      "> :first-child": {
-        borderBottomLeftRadius: 0,
-        borderTopLeftRadius: 0
-      }
-    },
     "> *": {
       "&:not(:first-child)": {
         // Negative margin hides the double-border on adjacent selects

package/dist/esm/variables/adhoc/AdHocFilterRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdHocFilterRenderer.js","sources":["../../../../src/variables/adhoc/AdHocFilterRenderer.tsx"],"sourcesContent":["import { t } from '@grafana/i18n';\nimport React, { useMemo, useState } from 'react';\n\nimport { AdHocFiltersVariable, AdHocFilterWithLabels, isMultiValueOperator, OPERATORS } from './AdHocFiltersVariable';\nimport { GrafanaTheme2, SelectableValue } from '@grafana/data';\nimport { Button, Field, InputActionMeta, Select, useStyles2 } from '@grafana/ui';\nimport { css, cx } from '@emotion/css';\nimport { ControlsLabel } from '../../utils/ControlsLabel';\nimport { getAdhocOptionSearcher } from './getAdhocOptionSearcher';\nimport { handleOptionGroups } from '../utils';\nimport { OptionWithCheckbox } from '../components/VariableValueSelect';\n\ninterface Props {\n  filter: AdHocFilterWithLabels;\n  model: AdHocFiltersVariable;\n}\n\nfunction keyLabelToOption(key: string, label?: string): SelectableValue | null {\n  return key !== ''\n    ? {\n        value: key,\n        label: label || key,\n      }\n    : null;\n}\n\nconst filterNoOp = () => true;\n\nexport function AdHocFilterRenderer({ filter, model }: Props) {\n  const styles = useStyles2(getStyles);\n\n  const [keys, setKeys] = useState<SelectableValue[]>([]);\n  const [values, setValues] = useState<SelectableValue[]>([]);\n  const [isKeysLoading, setIsKeysLoading] = useState(false);\n  const [isValuesLoading, setIsValuesLoading] = useState(false);\n  const [isKeysOpen, setIsKeysOpen] = useState(false);\n  const [isValuesOpen, setIsValuesOpen] = useState(false);\n  const [isOperatorOpen, setIsOperatorOpen] = useState(false);\n  const [valueInputValue, setValueInputValue] = useState('');\n  const [valueHasCustomValue, setValueHasCustomValue] = useState(false);\n  // To not trigger queries on every selection we store this state locally here and only update the variable onBlur\n  const [uncommittedValue, setUncommittedValue] = useState<SelectableValue>(\n    filter.values ? filter.values.map((value, index) => keyLabelToOption(value, filter.valueLabels?.[index])) : []\n  );\n  const isMultiValue = isMultiValueOperator(filter.operator);\n\n  const keyValue = keyLabelToOption(filter.key, filter.keyLabel);\n  const valueValue = keyLabelToOption(filter.value, filter.valueLabels?.[0]);\n\n  const optionSearcher = useMemo(() => getAdhocOptionSearcher(values), [values]);\n  const onAddCustomValue = model.state.onAddCustomValue;\n\n  const onValueInputChange = (value: string, { action }: InputActionMeta) => {\n    if (action === 'input-change') {\n      setValueInputValue(value);\n    }\n    return value;\n  };\n\n  const onOperatorChange = (v: SelectableValue) => {\n    const existingOperator = filter.operator;\n    const newOperator = v.value;\n\n    const update: Partial<AdHocFilterWithLabels> = { operator: newOperator };\n    // clear value if operator has changed from multi to single\n    if (isMultiValueOperator(existingOperator) && !isMultiValueOperator(newOperator)) {\n      update.value = '';\n      update.valueLabels = [''];\n      update.values = undefined;\n      setUncommittedValue([]);\n      // set values if operator has changed from single to multi\n    } else if (!isMultiValueOperator(existingOperator) && isMultiValueOperator(newOperator) && filter.value) {\n      update.values = [filter.value];\n      setUncommittedValue([\n        {\n          value: filter.value,\n          label: filter.valueLabels?.[0] ?? filter.value,\n        },\n      ]);\n    }\n    model._updateFilter(filter, update);\n  };\n\n  const filteredValueOptions = useMemo(\n    () => handleOptionGroups(optionSearcher(valueInputValue)),\n    [optionSearcher, valueInputValue]\n  );\n\n  const multiValueProps = {\n    isMulti: true,\n    value: uncommittedValue,\n    components: {\n      Option: OptionWithCheckbox,\n    },\n    hideSelectedOptions: false,\n    closeMenuOnSelect: false,\n    openMenuOnFocus: false,\n    onChange: (v: SelectableValue) => {\n      setUncommittedValue(v);\n      // clear input value when creating a new custom multi value\n      if (v.some((value: SelectableValue) => value.__isNew__)) {\n        setValueInputValue('');\n      }\n    },\n    onBlur: () => {\n      model._updateFilter(filter, {\n        value: uncommittedValue[0]?.value ?? '',\n        // TODO remove expect-error when we're on the latest version of @grafana/data\n        values: uncommittedValue.map((option: SelectableValue<string>) => option.value),\n        valueLabels: uncommittedValue.map((option: SelectableValue<string>) => option.label),\n      });\n    },\n  };\n\n  const operatorDefinition = OPERATORS.find((op) => filter.operator === op.value);\n\n  const valueSelect = (\n    <Select\n      virtualized\n      allowCustomValue={model.state.allowCustomValue ?? true}\n      createOptionPosition={operatorDefinition?.isRegex ? 'first' : 'last'}\n      isValidNewOption={(inputValue) => inputValue.trim().length > 0}\n      allowCreateWhileLoading\n      formatCreateLabel={(inputValue) => `Use custom value: ${inputValue}`}\n      disabled={model.state.readOnly}\n      className={cx(styles.value, isValuesOpen ? styles.widthWhenOpen : undefined)}\n      width=\"auto\"\n      value={valueValue}\n      filterOption={filterNoOp}\n      placeholder={t(\n        'grafana-scenes.variables.ad-hoc-filter-renderer.value-select.placeholder-select-value',\n        'Select value'\n      )}\n      options={filteredValueOptions}\n      inputValue={valueInputValue}\n      onInputChange={onValueInputChange}\n      onChange={(v) => {\n        if (onAddCustomValue && v.__isNew__) {\n          model._updateFilter(filter, onAddCustomValue(v, filter));\n        } else {\n          model._updateFilter(filter, {\n            value: v.value,\n            valueLabels: v.label ? [v.label] : [v.value],\n          });\n        }\n\n        if (valueHasCustomValue !== v.__isNew__) {\n          setValueHasCustomValue(v.__isNew__);\n        }\n      }}\n      // there's a bug in react-select where the menu doesn't recalculate its position when the options are loaded asynchronously\n      // see https://github.com/grafana/grafana/issues/63558\n      // instead, we explicitly control the menu visibility and prevent showing it until the options have fully loaded\n      isOpen={isValuesOpen && !isValuesLoading}\n      isLoading={isValuesLoading}\n      openMenuOnFocus={true}\n      onOpenMenu={async () => {\n        setIsValuesLoading(true);\n        setIsValuesOpen(true);\n        const values = await model._getValuesFor(filter);\n        setIsValuesLoading(false);\n        setValues(values);\n        if (valueHasCustomValue) {\n          setValueInputValue(valueValue?.label ?? '');\n        }\n      }}\n      onCloseMenu={() => {\n        setIsValuesOpen(false);\n        setValueInputValue('');\n      }}\n      {...(isMultiValue && multiValueProps)}\n    />\n  );\n\n  const keySelect = (\n    <Select\n      // By changing the key, we reset the Select component,\n      // to ensure that the loaded values are shown after they are loaded\n      key={`${isValuesLoading ? 'loading' : 'loaded'}`}\n      disabled={model.state.readOnly}\n      className={cx(styles.key, isKeysOpen ? styles.widthWhenOpen : undefined)}\n      width=\"auto\"\n      allowCustomValue={model.state.allowCustomValue ?? true}\n      createOptionPosition={operatorDefinition?.isRegex ? 'first' : 'last'}\n      value={keyValue}\n      placeholder={t(\n        'grafana-scenes.variables.ad-hoc-filter-renderer.key-select.placeholder-select-label',\n        'Select label'\n      )}\n      options={handleOptionGroups(keys)}\n      onChange={(v) => {\n        model._updateFilter(filter, {\n          key: v.value,\n          keyLabel: v.label,\n          // clear value if key has changed\n          value: '',\n          valueLabels: [''],\n          values: undefined,\n        });\n        setUncommittedValue([]);\n      }}\n      autoFocus={filter.key === ''}\n      // there's a bug in react-select where the menu doesn't recalculate its position when the options are loaded asynchronously\n      // see https://github.com/grafana/grafana/issues/63558\n      // instead, we explicitly control the menu visibility and prevent showing it until the options have fully loaded\n      isOpen={isKeysOpen && !isKeysLoading}\n      isLoading={isKeysLoading}\n      onOpenMenu={async () => {\n        setIsKeysOpen(true);\n        setIsKeysLoading(true);\n        const keys = await model._getKeys(filter.key);\n        setIsKeysLoading(false);\n        setKeys(keys);\n      }}\n      onCloseMenu={() => {\n        setIsKeysOpen(false);\n      }}\n      onBlur={() => {\n        if (filter.key === '') {\n          model._removeFilter(filter);\n        }\n      }}\n      openMenuOnFocus={true}\n    />\n  );\n\n  const operatorSelect = (\n    <Select\n      className={cx(styles.operator, {\n        [styles.widthWhenOpen]: isOperatorOpen,\n      })}\n      value={filter.operator}\n      disabled={model.state.readOnly}\n      options={model._getOperators()}\n      onChange={onOperatorChange}\n      onOpenMenu={() => {\n        setIsOperatorOpen(true);\n      }}\n      onCloseMenu={() => {\n        setIsOperatorOpen(false);\n      }}\n    />\n  );\n\n  if (model.state.layout === 'vertical') {\n    if (filter.key) {\n      const label = (\n        <ControlsLabel layout=\"vertical\" label={filter.key ?? ''} onRemove={() => model._removeFilter(filter)} />\n      );\n\n      return (\n        <Field label={label} data-testid={`AdHocFilter-${filter.key}`} className={styles.field}>\n          <div className={styles.wrapper}>\n            {operatorSelect}\n            {valueSelect}\n          </div>\n        </Field>\n      );\n    } else {\n      return (\n        <Field\n          label={t('grafana-scenes.variables.ad-hoc-filter-renderer.label-select-label', 'Select label')}\n          data-testid={`AdHocFilter-${filter.key}`}\n          className={styles.field}\n        >\n          {keySelect}\n        </Field>\n      );\n    }\n  }\n\n  return (\n    <div className={styles.wrapper} data-testid={`AdHocFilter-${filter.key}`}>\n      {keySelect}\n      {operatorSelect}\n      {valueSelect}\n      <Button\n        variant=\"secondary\"\n        aria-label={t('grafana-scenes.variables.ad-hoc-filter-renderer.aria-label-remove-filter', 'Remove filter')}\n        title={t('grafana-scenes.variables.ad-hoc-filter-renderer.title-remove-filter', 'Remove filter')}\n        className={styles.removeButton}\n        icon=\"times\"\n        data-testid={`AdHocFilter-remove-${filter.key ?? ''}`}\n        onClick={() => model._removeFilter(filter)}\n      />\n    </div>\n  );\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  field: css({\n    marginBottom: 0,\n  }),\n  wrapper: css({\n    display: 'flex',\n    '&:first-child': {\n      '> :first-child': {\n        borderBottomLeftRadius: 0,\n        borderTopLeftRadius: 0,\n      },\n    },\n    '> *': {\n      '&:not(:first-child)': {\n        // Negative margin hides the double-border on adjacent selects\n        marginLeft: -1,\n      },\n\n      '&:first-child': {\n        borderTopRightRadius: 0,\n        borderBottomRightRadius: 0,\n      },\n\n      '&:last-child': {\n        borderTopLeftRadius: 0,\n        borderBottomLeftRadius: 0,\n      },\n\n      '&:not(:first-child):not(:last-child)': {\n        borderRadius: 0,\n      },\n\n      // Fix focus state zIndex issues\n      position: 'relative',\n      zIndex: 0,\n\n      // Adjacent borders are overlapping, so raise children up when hovering etc\n      // so all that child's borders are visible.\n      '&:hover': {\n        zIndex: 1,\n      },\n\n      '&:focus-within': {\n        zIndex: 2,\n      },\n    },\n  }),\n  widthWhenOpen: css({\n    minWidth: theme.spacing(16),\n  }),\n  value: css({\n    flexBasis: 'content',\n    flexShrink: 1,\n    minWidth: '90px',\n  }),\n  key: css({\n    flexBasis: 'content',\n    minWidth: '90px',\n    flexShrink: 1,\n  }),\n  operator: css({\n    flexShrink: 0,\n    flexBasis: 'content',\n  }),\n  removeButton: css({\n    paddingLeft: theme.spacing(3 / 2),\n    paddingRight: theme.spacing(3 / 2),\n    borderLeft: 'none',\n    width: theme.spacing(3),\n    marginRight: theme.spacing(1),\n    boxSizing: 'border-box',\n    // To not have button background and last select border intersect\n    position: 'relative',\n    left: '1px',\n  }),\n});\n"],"names":["_a","_b","values","keys"],"mappings":"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"}
+{"version":3,"file":"AdHocFilterRenderer.js","sources":["../../../../src/variables/adhoc/AdHocFilterRenderer.tsx"],"sourcesContent":["import { t } from '@grafana/i18n';\nimport React, { useMemo, useState } from 'react';\n\nimport { AdHocFiltersVariable, AdHocFilterWithLabels, isMultiValueOperator, OPERATORS } from './AdHocFiltersVariable';\nimport { GrafanaTheme2, SelectableValue } from '@grafana/data';\nimport { Button, Field, InputActionMeta, Select, useStyles2 } from '@grafana/ui';\nimport { css, cx } from '@emotion/css';\nimport { ControlsLabel } from '../../utils/ControlsLabel';\nimport { getAdhocOptionSearcher } from './getAdhocOptionSearcher';\nimport { handleOptionGroups } from '../utils';\nimport { OptionWithCheckbox } from '../components/VariableValueSelect';\n\ninterface Props {\n  filter: AdHocFilterWithLabels;\n  model: AdHocFiltersVariable;\n}\n\nfunction keyLabelToOption(key: string, label?: string): SelectableValue | null {\n  return key !== ''\n    ? {\n        value: key,\n        label: label || key,\n      }\n    : null;\n}\n\nconst filterNoOp = () => true;\n\nexport function AdHocFilterRenderer({ filter, model }: Props) {\n  const styles = useStyles2(getStyles);\n\n  const [keys, setKeys] = useState<SelectableValue[]>([]);\n  const [values, setValues] = useState<SelectableValue[]>([]);\n  const [isKeysLoading, setIsKeysLoading] = useState(false);\n  const [isValuesLoading, setIsValuesLoading] = useState(false);\n  const [isKeysOpen, setIsKeysOpen] = useState(false);\n  const [isValuesOpen, setIsValuesOpen] = useState(false);\n  const [isOperatorOpen, setIsOperatorOpen] = useState(false);\n  const [valueInputValue, setValueInputValue] = useState('');\n  const [valueHasCustomValue, setValueHasCustomValue] = useState(false);\n  // To not trigger queries on every selection we store this state locally here and only update the variable onBlur\n  const [uncommittedValue, setUncommittedValue] = useState<SelectableValue>(\n    filter.values ? filter.values.map((value, index) => keyLabelToOption(value, filter.valueLabels?.[index])) : []\n  );\n  const isMultiValue = isMultiValueOperator(filter.operator);\n\n  const keyValue = keyLabelToOption(filter.key, filter.keyLabel);\n  const valueValue = keyLabelToOption(filter.value, filter.valueLabels?.[0]);\n\n  const optionSearcher = useMemo(() => getAdhocOptionSearcher(values), [values]);\n  const onAddCustomValue = model.state.onAddCustomValue;\n\n  const onValueInputChange = (value: string, { action }: InputActionMeta) => {\n    if (action === 'input-change') {\n      setValueInputValue(value);\n    }\n    return value;\n  };\n\n  const onOperatorChange = (v: SelectableValue) => {\n    const existingOperator = filter.operator;\n    const newOperator = v.value;\n\n    const update: Partial<AdHocFilterWithLabels> = { operator: newOperator };\n    // clear value if operator has changed from multi to single\n    if (isMultiValueOperator(existingOperator) && !isMultiValueOperator(newOperator)) {\n      update.value = '';\n      update.valueLabels = [''];\n      update.values = undefined;\n      setUncommittedValue([]);\n      // set values if operator has changed from single to multi\n    } else if (!isMultiValueOperator(existingOperator) && isMultiValueOperator(newOperator) && filter.value) {\n      update.values = [filter.value];\n      setUncommittedValue([\n        {\n          value: filter.value,\n          label: filter.valueLabels?.[0] ?? filter.value,\n        },\n      ]);\n    }\n    model._updateFilter(filter, update);\n  };\n\n  const filteredValueOptions = useMemo(\n    () => handleOptionGroups(optionSearcher(valueInputValue)),\n    [optionSearcher, valueInputValue]\n  );\n\n  const multiValueProps = {\n    isMulti: true,\n    value: uncommittedValue,\n    components: {\n      Option: OptionWithCheckbox,\n    },\n    hideSelectedOptions: false,\n    closeMenuOnSelect: false,\n    openMenuOnFocus: false,\n    onChange: (v: SelectableValue) => {\n      setUncommittedValue(v);\n      // clear input value when creating a new custom multi value\n      if (v.some((value: SelectableValue) => value.__isNew__)) {\n        setValueInputValue('');\n      }\n    },\n    onBlur: () => {\n      model._updateFilter(filter, {\n        value: uncommittedValue[0]?.value ?? '',\n        // TODO remove expect-error when we're on the latest version of @grafana/data\n        values: uncommittedValue.map((option: SelectableValue<string>) => option.value),\n        valueLabels: uncommittedValue.map((option: SelectableValue<string>) => option.label),\n      });\n    },\n  };\n\n  const operatorDefinition = OPERATORS.find((op) => filter.operator === op.value);\n\n  const valueSelect = (\n    <Select\n      virtualized\n      allowCustomValue={model.state.allowCustomValue ?? true}\n      createOptionPosition={operatorDefinition?.isRegex ? 'first' : 'last'}\n      isValidNewOption={(inputValue) => inputValue.trim().length > 0}\n      allowCreateWhileLoading\n      formatCreateLabel={(inputValue) => `Use custom value: ${inputValue}`}\n      disabled={model.state.readOnly}\n      className={cx(styles.value, isValuesOpen ? styles.widthWhenOpen : undefined)}\n      width=\"auto\"\n      value={valueValue}\n      filterOption={filterNoOp}\n      placeholder={t(\n        'grafana-scenes.variables.ad-hoc-filter-renderer.value-select.placeholder-select-value',\n        'Select value'\n      )}\n      options={filteredValueOptions}\n      inputValue={valueInputValue}\n      onInputChange={onValueInputChange}\n      onChange={(v) => {\n        if (onAddCustomValue && v.__isNew__) {\n          model._updateFilter(filter, onAddCustomValue(v, filter));\n        } else {\n          model._updateFilter(filter, {\n            value: v.value,\n            valueLabels: v.label ? [v.label] : [v.value],\n          });\n        }\n\n        if (valueHasCustomValue !== v.__isNew__) {\n          setValueHasCustomValue(v.__isNew__);\n        }\n      }}\n      // there's a bug in react-select where the menu doesn't recalculate its position when the options are loaded asynchronously\n      // see https://github.com/grafana/grafana/issues/63558\n      // instead, we explicitly control the menu visibility and prevent showing it until the options have fully loaded\n      isOpen={isValuesOpen && !isValuesLoading}\n      isLoading={isValuesLoading}\n      openMenuOnFocus={true}\n      onOpenMenu={async () => {\n        setIsValuesLoading(true);\n        setIsValuesOpen(true);\n        const values = await model._getValuesFor(filter);\n        setIsValuesLoading(false);\n        setValues(values);\n        if (valueHasCustomValue) {\n          setValueInputValue(valueValue?.label ?? '');\n        }\n      }}\n      onCloseMenu={() => {\n        setIsValuesOpen(false);\n        setValueInputValue('');\n      }}\n      {...(isMultiValue && multiValueProps)}\n    />\n  );\n\n  const keySelect = (\n    <Select\n      // By changing the key, we reset the Select component,\n      // to ensure that the loaded values are shown after they are loaded\n      key={`${isValuesLoading ? 'loading' : 'loaded'}`}\n      disabled={model.state.readOnly}\n      className={cx(styles.key, isKeysOpen ? styles.widthWhenOpen : undefined)}\n      width=\"auto\"\n      allowCustomValue={model.state.allowCustomValue ?? true}\n      createOptionPosition={operatorDefinition?.isRegex ? 'first' : 'last'}\n      value={keyValue}\n      placeholder={t(\n        'grafana-scenes.variables.ad-hoc-filter-renderer.key-select.placeholder-select-label',\n        'Select label'\n      )}\n      options={handleOptionGroups(keys)}\n      onChange={(v) => {\n        model._updateFilter(filter, {\n          key: v.value,\n          keyLabel: v.label,\n          // clear value if key has changed\n          value: '',\n          valueLabels: [''],\n          values: undefined,\n        });\n        setUncommittedValue([]);\n      }}\n      autoFocus={filter.key === ''}\n      // there's a bug in react-select where the menu doesn't recalculate its position when the options are loaded asynchronously\n      // see https://github.com/grafana/grafana/issues/63558\n      // instead, we explicitly control the menu visibility and prevent showing it until the options have fully loaded\n      isOpen={isKeysOpen && !isKeysLoading}\n      isLoading={isKeysLoading}\n      onOpenMenu={async () => {\n        setIsKeysOpen(true);\n        setIsKeysLoading(true);\n        const keys = await model._getKeys(filter.key);\n        setIsKeysLoading(false);\n        setKeys(keys);\n      }}\n      onCloseMenu={() => {\n        setIsKeysOpen(false);\n      }}\n      onBlur={() => {\n        if (filter.key === '') {\n          model._removeFilter(filter);\n        }\n      }}\n      openMenuOnFocus={true}\n    />\n  );\n\n  const operatorSelect = (\n    <Select\n      className={cx(styles.operator, {\n        [styles.widthWhenOpen]: isOperatorOpen,\n      })}\n      value={filter.operator}\n      disabled={model.state.readOnly}\n      options={model._getOperators()}\n      onChange={onOperatorChange}\n      onOpenMenu={() => {\n        setIsOperatorOpen(true);\n      }}\n      onCloseMenu={() => {\n        setIsOperatorOpen(false);\n      }}\n    />\n  );\n\n  if (model.state.layout === 'vertical') {\n    if (filter.key) {\n      const label = (\n        <ControlsLabel layout=\"vertical\" label={filter.key ?? ''} onRemove={() => model._removeFilter(filter)} />\n      );\n\n      return (\n        <Field label={label} data-testid={`AdHocFilter-${filter.key}`} className={styles.field}>\n          <div className={styles.wrapper}>\n            {operatorSelect}\n            {valueSelect}\n          </div>\n        </Field>\n      );\n    } else {\n      return (\n        <Field\n          label={t('grafana-scenes.variables.ad-hoc-filter-renderer.label-select-label', 'Select label')}\n          data-testid={`AdHocFilter-${filter.key}`}\n          className={styles.field}\n        >\n          {keySelect}\n        </Field>\n      );\n    }\n  }\n\n  return (\n    <div className={styles.wrapper} data-testid={`AdHocFilter-${filter.key}`}>\n      {keySelect}\n      {operatorSelect}\n      {valueSelect}\n      <Button\n        variant=\"secondary\"\n        aria-label={t('grafana-scenes.variables.ad-hoc-filter-renderer.aria-label-remove-filter', 'Remove filter')}\n        title={t('grafana-scenes.variables.ad-hoc-filter-renderer.title-remove-filter', 'Remove filter')}\n        className={styles.removeButton}\n        icon=\"times\"\n        data-testid={`AdHocFilter-remove-${filter.key ?? ''}`}\n        onClick={() => model._removeFilter(filter)}\n      />\n    </div>\n  );\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  field: css({\n    marginBottom: 0,\n  }),\n  wrapper: css({\n    display: 'flex',\n    '> *': {\n      '&:not(:first-child)': {\n        // Negative margin hides the double-border on adjacent selects\n        marginLeft: -1,\n      },\n\n      '&:first-child': {\n        borderTopRightRadius: 0,\n        borderBottomRightRadius: 0,\n      },\n\n      '&:last-child': {\n        borderTopLeftRadius: 0,\n        borderBottomLeftRadius: 0,\n      },\n\n      '&:not(:first-child):not(:last-child)': {\n        borderRadius: 0,\n      },\n\n      // Fix focus state zIndex issues\n      position: 'relative',\n      zIndex: 0,\n\n      // Adjacent borders are overlapping, so raise children up when hovering etc\n      // so all that child's borders are visible.\n      '&:hover': {\n        zIndex: 1,\n      },\n\n      '&:focus-within': {\n        zIndex: 2,\n      },\n    },\n  }),\n  widthWhenOpen: css({\n    minWidth: theme.spacing(16),\n  }),\n  value: css({\n    flexBasis: 'content',\n    flexShrink: 1,\n    minWidth: '90px',\n  }),\n  key: css({\n    flexBasis: 'content',\n    minWidth: '90px',\n    flexShrink: 1,\n  }),\n  operator: css({\n    flexShrink: 0,\n    flexBasis: 'content',\n  }),\n  removeButton: css({\n    paddingLeft: theme.spacing(3 / 2),\n    paddingRight: theme.spacing(3 / 2),\n    borderLeft: 'none',\n    width: theme.spacing(3),\n    marginRight: theme.spacing(1),\n    boxSizing: 'border-box',\n    // To not have button background and last select border intersect\n    position: 'relative',\n    left: '1px',\n  }),\n});\n"],"names":["_a","_b","values","keys"],"mappings":"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"}

package/dist/esm/variables/variants/CustomVariable.js

@@ -20,11 +20,13 @@ class CustomVariable extends MultiValueVariable {
       statePaths: ["query"]
     });
   }
-  getValueOptions(args) {
+  // We expose this publicly as we also need it outside the variable
+  // The interpolate flag is needed since we don't always want to get the interpolated options
+  transformCsvStringToOptions(str, interpolate = true) {
     var _a;
-    const interpolated = sceneGraph.interpolate(this, this.state.query);
-    const match = (_a = interpolated.match(/(?:\\,|[^,])+/g)) != null ? _a : [];
-    const options = match.map((text) => {
+    str = interpolate ? sceneGraph.interpolate(this, str) : str;
+    const match = (_a = str.match(/(?:\\,|[^,])+/g)) != null ? _a : [];
+    return match.map((text) => {
       var _a2;
       text = text.replace(/\\,/g, ",");
       const textMatch = (_a2 = /^\s*(.+)\s:\s(.+)$/g.exec(text)) != null ? _a2 : [];
@@ -35,6 +37,9 @@ class CustomVariable extends MultiValueVariable {
         return { label: text.trim(), value: text.trim() };
       }
     });
+  }
+  getValueOptions(args) {
+    const options = this.transformCsvStringToOptions(this.state.query);
     if (!options.length) {
       this.skipNextValidation = true;
     }

package/dist/esm/variables/variants/CustomVariable.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomVariable.js","sources":["../../../../src/variables/variants/CustomVariable.tsx"],"sourcesContent":["import { Observable, of } from 'rxjs';\n\nimport { SceneComponentProps } from '../../core/types';\nimport { VariableDependencyConfig } from '../VariableDependencyConfig';\nimport { MultiOrSingleValueSelect } from '../components/VariableValueSelect';\nimport { VariableValueOption } from '../types';\n\nimport { MultiValueVariable, MultiValueVariableState, VariableGetOptionsArgs } from './MultiValueVariable';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport React from 'react';\n\nexport interface CustomVariableState extends MultiValueVariableState {\n  query: string;\n}\n\nexport class CustomVariable extends MultiValueVariable<CustomVariableState> {\n  protected _variableDependency = new VariableDependencyConfig(this, {\n    statePaths: ['query'],\n  });\n\n  public constructor(initialState: Partial<CustomVariableState>) {\n    super({\n      type: 'custom',\n      query: '',\n      value: '',\n      text: '',\n      options: [],\n      name: '',\n      ...initialState,\n    });\n  }\n\n  public getValueOptions(args: VariableGetOptionsArgs): Observable<VariableValueOption[]> {\n    const interpolated = sceneGraph.interpolate(this, this.state.query);\n    const match = interpolated.match(/(?:\\\\,|[^,])+/g) ?? [];\n\n    const options = match.map((text) => {\n      text = text.replace(/\\\\,/g, ',');\n      const textMatch = /^\\s*(.+)\\s:\\s(.+)$/g.exec(text) ?? [];\n      if (textMatch.length === 3) {\n        const [, key, value] = textMatch;\n        return { label: key.trim(), value: value.trim() };\n      } else {\n        return { label: text.trim(), value: text.trim() };\n      }\n    });\n\n    if (!options.length) {\n      this.skipNextValidation = true;\n    }\n\n    return of(options);\n  }\n\n  public static Component = ({ model }: SceneComponentProps<MultiValueVariable>) => {\n    return <MultiOrSingleValueSelect model={model} />;\n  };\n}\n"],"names":["_a"],"mappings":";;;;;;;AAeO,MAAM,uBAAuB,kBAAwC,CAAA;AAAA,EAKnE,YAAY,YAA4C,EAAA;AAC7D,IAAM,KAAA,CAAA;AAAA,MACJ,IAAM,EAAA,QAAA;AAAA,MACN,KAAO,EAAA,EAAA;AAAA,MACP,KAAO,EAAA,EAAA;AAAA,MACP,IAAM,EAAA,EAAA;AAAA,MACN,SAAS,EAAC;AAAA,MACV,IAAM,EAAA,EAAA;AAAA,MACN,GAAG;AAAA,KACJ,CAAA;AAbH,IAAU,IAAA,CAAA,mBAAA,GAAsB,IAAI,wBAAA,CAAyB,IAAM,EAAA;AAAA,MACjE,UAAA,EAAY,CAAC,OAAO;AAAA,KACrB,CAAA;AAAA;AAYD,EAEO,gBAAgB,IAAiE,EAAA;AAhC1F,IAAA,IAAA,EAAA;AAiCI,IAAA,MAAM,eAAe,UAAW,CAAA,WAAA,CAAY,IAAM,EAAA,IAAA,CAAK,MAAM,KAAK,CAAA;AAClE,IAAA,MAAM,SAAQ,EAAa,GAAA,YAAA,CAAA,KAAA,CAAM,gBAAgB,CAAA,KAAnC,YAAwC,EAAC;AAEvD,IAAA,MAAM,OAAU,GAAA,KAAA,CAAM,GAAI,CAAA,CAAC,IAAS,KAAA;AApCxC,MAAAA,IAAAA,GAAAA;AAqCM,MAAO,IAAA,GAAA,IAAA,CAAK,OAAQ,CAAA,MAAA,EAAQ,GAAG,CAAA;AAC/B,MAAM,MAAA,SAAA,GAAA,CAAYA,MAAA,qBAAsB,CAAA,IAAA,CAAK,IAAI,CAA/B,KAAA,IAAA,GAAAA,MAAoC,EAAC;AACvD,MAAI,IAAA,SAAA,CAAU,WAAW,CAAG,EAAA;AAC1B,QAAA,MAAM,GAAG,GAAK,EAAA,KAAK,CAAI,GAAA,SAAA;AACvB,QAAO,OAAA,EAAE,OAAO,GAAI,CAAA,IAAA,IAAQ,KAAO,EAAA,KAAA,CAAM,MAAO,EAAA;AAAA,OAC3C,MAAA;AACL,QAAO,OAAA,EAAE,OAAO,IAAK,CAAA,IAAA,IAAQ,KAAO,EAAA,IAAA,CAAK,MAAO,EAAA;AAAA;AAClD,KACD,CAAA;AAED,IAAI,IAAA,CAAC,QAAQ,MAAQ,EAAA;AACnB,MAAA,IAAA,CAAK,kBAAqB,GAAA,IAAA;AAAA;AAG5B,IAAA,OAAO,GAAG,OAAO,CAAA;AAAA;AAMrB;AA1Ca,cAAA,CAuCG,SAAY,GAAA,CAAC,EAAE,KAAA,EAAqD,KAAA;AAChF,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,4BAAyB,KAAc,EAAA,CAAA;AACjD,CAAA;;;;"}
+{"version":3,"file":"CustomVariable.js","sources":["../../../../src/variables/variants/CustomVariable.tsx"],"sourcesContent":["import { Observable, of } from 'rxjs';\n\nimport { SceneComponentProps } from '../../core/types';\nimport { VariableDependencyConfig } from '../VariableDependencyConfig';\nimport { MultiOrSingleValueSelect } from '../components/VariableValueSelect';\nimport { VariableValueOption } from '../types';\n\nimport { MultiValueVariable, MultiValueVariableState, VariableGetOptionsArgs } from './MultiValueVariable';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport React from 'react';\n\nexport interface CustomVariableState extends MultiValueVariableState {\n  query: string;\n}\n\nexport class CustomVariable extends MultiValueVariable<CustomVariableState> {\n  protected _variableDependency = new VariableDependencyConfig(this, {\n    statePaths: ['query'],\n  });\n\n  public constructor(initialState: Partial<CustomVariableState>) {\n    super({\n      type: 'custom',\n      query: '',\n      value: '',\n      text: '',\n      options: [],\n      name: '',\n      ...initialState,\n    });\n  }\n\n  // We expose this publicly as we also need it outside the variable\n  // The interpolate flag is needed since we don't always want to get the interpolated options\n  public transformCsvStringToOptions(str: string, interpolate = true): VariableValueOption[] {\n    str = interpolate ? sceneGraph.interpolate(this, str) : str;\n    const match = str.match(/(?:\\\\,|[^,])+/g) ?? [];\n\n    return match.map((text) => {\n      text = text.replace(/\\\\,/g, ',');\n      const textMatch = /^\\s*(.+)\\s:\\s(.+)$/g.exec(text) ?? [];\n      if (textMatch.length === 3) {\n        const [, key, value] = textMatch;\n        return { label: key.trim(), value: value.trim() };\n      } else {\n        return { label: text.trim(), value: text.trim() };\n      }\n    });\n  }\n\n  public getValueOptions(args: VariableGetOptionsArgs): Observable<VariableValueOption[]> {\n    const options = this.transformCsvStringToOptions(this.state.query);\n\n    if (!options.length) {\n      this.skipNextValidation = true;\n    }\n\n    return of(options);\n  }\n\n  public static Component = ({ model }: SceneComponentProps<MultiValueVariable>) => {\n    return <MultiOrSingleValueSelect model={model} />;\n  };\n}\n"],"names":["_a"],"mappings":";;;;;;;AAeO,MAAM,uBAAuB,kBAAwC,CAAA;AAAA,EAKnE,YAAY,YAA4C,EAAA;AAC7D,IAAM,KAAA,CAAA;AAAA,MACJ,IAAM,EAAA,QAAA;AAAA,MACN,KAAO,EAAA,EAAA;AAAA,MACP,KAAO,EAAA,EAAA;AAAA,MACP,IAAM,EAAA,EAAA;AAAA,MACN,SAAS,EAAC;AAAA,MACV,IAAM,EAAA,EAAA;AAAA,MACN,GAAG;AAAA,KACJ,CAAA;AAbH,IAAU,IAAA,CAAA,mBAAA,GAAsB,IAAI,wBAAA,CAAyB,IAAM,EAAA;AAAA,MACjE,UAAA,EAAY,CAAC,OAAO;AAAA,KACrB,CAAA;AAAA;AAYD;AAAA;AAAA,EAIO,2BAAA,CAA4B,GAAa,EAAA,WAAA,GAAc,IAA6B,EAAA;AAlC7F,IAAA,IAAA,EAAA;AAmCI,IAAA,GAAA,GAAM,WAAc,GAAA,UAAA,CAAW,WAAY,CAAA,IAAA,EAAM,GAAG,CAAI,GAAA,GAAA;AACxD,IAAA,MAAM,SAAQ,EAAI,GAAA,GAAA,CAAA,KAAA,CAAM,gBAAgB,CAAA,KAA1B,YAA+B,EAAC;AAE9C,IAAO,OAAA,KAAA,CAAM,GAAI,CAAA,CAAC,IAAS,KAAA;AAtC/B,MAAAA,IAAAA,GAAAA;AAuCM,MAAO,IAAA,GAAA,IAAA,CAAK,OAAQ,CAAA,MAAA,EAAQ,GAAG,CAAA;AAC/B,MAAM,MAAA,SAAA,GAAA,CAAYA,MAAA,qBAAsB,CAAA,IAAA,CAAK,IAAI,CAA/B,KAAA,IAAA,GAAAA,MAAoC,EAAC;AACvD,MAAI,IAAA,SAAA,CAAU,WAAW,CAAG,EAAA;AAC1B,QAAA,MAAM,GAAG,GAAK,EAAA,KAAK,CAAI,GAAA,SAAA;AACvB,QAAO,OAAA,EAAE,OAAO,GAAI,CAAA,IAAA,IAAQ,KAAO,EAAA,KAAA,CAAM,MAAO,EAAA;AAAA,OAC3C,MAAA;AACL,QAAO,OAAA,EAAE,OAAO,IAAK,CAAA,IAAA,IAAQ,KAAO,EAAA,IAAA,CAAK,MAAO,EAAA;AAAA;AAClD,KACD,CAAA;AAAA;AACH,EAEO,gBAAgB,IAAiE,EAAA;AACtF,IAAA,MAAM,OAAU,GAAA,IAAA,CAAK,2BAA4B,CAAA,IAAA,CAAK,MAAM,KAAK,CAAA;AAEjE,IAAI,IAAA,CAAC,QAAQ,MAAQ,EAAA;AACnB,MAAA,IAAA,CAAK,kBAAqB,GAAA,IAAA;AAAA;AAG5B,IAAA,OAAO,GAAG,OAAO,CAAA;AAAA;AAMrB;AAhDa,cAAA,CA6CG,SAAY,GAAA,CAAC,EAAE,KAAA,EAAqD,KAAA;AAChF,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,4BAAyB,KAAc,EAAA,CAAA;AACjD,CAAA;;;;"}

package/dist/index.d.ts

@@ -1124,6 +1124,7 @@ interface CustomVariableState extends MultiValueVariableState {
 declare class CustomVariable extends MultiValueVariable<CustomVariableState> {
     protected _variableDependency: VariableDependencyConfig<CustomVariableState>;
     constructor(initialState: Partial<CustomVariableState>);
+    transformCsvStringToOptions(str: string, interpolate?: boolean): VariableValueOption[];
     getValueOptions(args: VariableGetOptionsArgs): Observable<VariableValueOption[]>;
     static Component: ({ model }: SceneComponentProps<MultiValueVariable>) => React__default.JSX.Element;
 }
@@ -2019,6 +2020,7 @@ declare class SceneDataTransformer extends SceneObjectBase<SceneDataTransformerS
     private haveAlreadyTransformedData;
     private transform;
     private _interpolateVariablesInTransformationConfigs;
+    private _filterAndPrepareTransformationsByTopic;
 }
 
 /**

package/dist/index.js

@@ -3603,7 +3603,7 @@ function wrapInSafeSerializableSceneObject(sceneObject) {
 function DefaultGroupByCustomIndicatorContainer(props) {
   const { model } = props;
   const theme = ui.useTheme2();
-  const styles = getStyles$j(theme);
+  const styles = getStyles$i(theme);
   const inputStyles = ui.getInputStyles({ theme, invalid: false });
   const value = lodash.isArray(model.state.value) ? model.state.value : model.state.value ? [model.state.value] : [];
   let buttons = [];
@@ -3685,7 +3685,7 @@ function DefaultGroupByCustomIndicatorContainer(props) {
     buttons
   );
 }
-const getStyles$j = (theme) => ({
+const getStyles$i = (theme) => ({
   clearIcon: css.css({
     color: theme.colors.action.disabledText,
     cursor: "pointer",
@@ -4206,7 +4206,7 @@ function LoadingIndicator(props) {
 }
 
 function ControlsLabel(props) {
-  const styles = ui.useStyles2(getStyles$i);
+  const styles = ui.useStyles2(getStyles$h);
   const theme = ui.useTheme2();
   const isVertical = props.layout === "vertical";
   const loadingIndicator = Boolean(props.isLoading) ? /* @__PURE__ */ React__default.default.createElement(
@@ -4253,7 +4253,7 @@ function ControlsLabel(props) {
   }
   return labelElement;
 }
-const getStyles$i = (theme) => ({
+const getStyles$h = (theme) => ({
   horizontalLabel: css.css({
     background: theme.isDark ? theme.colors.background.primary : theme.colors.background.secondary,
     display: `flex`,
@@ -4306,7 +4306,7 @@ function keyLabelToOption(key, label) {
 const filterNoOp = () => true;
 function AdHocFilterRenderer({ filter, model }) {
   var _a, _b, _c, _d, _e;
-  const styles = ui.useStyles2(getStyles$h);
+  const styles = ui.useStyles2(getStyles$g);
   const [keys, setKeys] = React.useState([]);
   const [values, setValues] = React.useState([]);
   const [isKeysLoading, setIsKeysLoading] = React.useState(false);
@@ -4533,18 +4533,12 @@ function AdHocFilterRenderer({ filter, model }) {
     }
   ));
 }
-const getStyles$h = (theme) => ({
+const getStyles$g = (theme) => ({
   field: css.css({
     marginBottom: 0
   }),
   wrapper: css.css({
     display: "flex",
-    "&:first-child": {
-      "> :first-child": {
-        borderBottomLeftRadius: 0,
-        borderTopLeftRadius: 0
-      }
-    },
     "> *": {
       "&:not(:first-child)": {
         // Negative margin hides the double-border on adjacent selects
@@ -4606,7 +4600,6 @@ const getStyles$h = (theme) => ({
 
 function AdHocFilterBuilder({ model, addFilterButtonText }) {
   const { _wip } = model.useState();
-  const styles = ui.useStyles2(getStyles$g);
   if (!_wip) {
     return /* @__PURE__ */ React__default.default.createElement(
       ui.Button,
@@ -4616,22 +4609,13 @@ function AdHocFilterBuilder({ model, addFilterButtonText }) {
         title: i18n.t("grafana-scenes.variables.ad-hoc-filter-builder.title-add-filter", "Add filter"),
         "aria-label": i18n.t("grafana-scenes.variables.ad-hoc-filter-builder.aria-label-add-filter", "Add filter"),
         "data-testid": `AdHocFilter-add`,
-        onClick: () => model._addWip(),
-        className: styles.addButton
+        onClick: () => model._addWip()
       },
       addFilterButtonText
     );
   }
   return /* @__PURE__ */ React__default.default.createElement(AdHocFilterRenderer, { filter: _wip, model });
 }
-const getStyles$g = (theme) => ({
-  addButton: css.css({
-    "&:first-child": {
-      borderBottomLeftRadius: 0,
-      borderTopLeftRadius: 0
-    }
-  })
-});
 
 class AdHocFiltersVariableUrlSyncHandler {
   constructor(_variable) {
@@ -9465,19 +9449,25 @@ class SceneDataTransformer extends SceneObjectBase {
     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;
+    const interpolatedTransformations = this._interpolateVariablesInTransformationConfigs(data$1);
+    const seriesTransformations = this._filterAndPrepareTransformationsByTopic(
+      interpolatedTransformations,
+      (transformation) => {
+        if ("options" in transformation || "topic" in transformation) {
+          return transformation.topic == null || transformation.topic === data.DataTopic.Series;
+        }
+        return true;
       }
-      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;
+    );
+    const annotationsTransformations = this._filterAndPrepareTransformationsByTopic(
+      interpolatedTransformations,
+      (transformation) => {
+        if ("options" in transformation || "topic" in transformation) {
+          return transformation.topic === data.DataTopic.Annotations;
+        }
+        return false;
       }
-      return false;
-    }).map((transformation) => "operator" in transformation ? transformation.operator : transformation);
+    );
     if (this._transformSub) {
       this._transformSub.unsubscribe();
     }
@@ -9487,13 +9477,11 @@ class SceneDataTransformer extends SceneObjectBase {
         return sceneGraph.interpolate(this, value, { ...(_a2 = data$1.request) == null ? void 0 : _a2.scopedVars, ...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 : []));
-    }
+    const seriesStream = data.transformDataFrame(seriesTransformations, data$1.series, ctx);
+    const annotationsStream = data.transformDataFrame(annotationsTransformations, (_a = data$1.annotations) != null ? _a : []);
     let series = [];
     let annotations = [];
-    this._transformSub = rxjs.forkJoin(streams).pipe(
+    this._transformSub = rxjs.forkJoin([seriesStream, annotationsStream]).pipe(
       rxjs.map((results) => {
         results.forEach((frames) => {
           var _a2;
@@ -9542,6 +9530,9 @@ class SceneDataTransformer extends SceneObjectBase {
       return typeof t === "object" ? JSON.parse(sceneGraph.interpolate(this, JSON.stringify(t), (_a2 = data.request) == null ? void 0 : _a2.scopedVars)) : t;
     });
   }
+  _filterAndPrepareTransformationsByTopic(interpolatedTransformations, transformationFilter) {
+    return interpolatedTransformations.filter(transformationFilter).map((transformation) => "operator" in transformation ? transformation.operator : transformation);
+  }
 }
 
 class VizPanel extends SceneObjectBase {
@@ -11129,11 +11120,13 @@ class CustomVariable extends MultiValueVariable {
       statePaths: ["query"]
     });
   }
-  getValueOptions(args) {
+  // We expose this publicly as we also need it outside the variable
+  // The interpolate flag is needed since we don't always want to get the interpolated options
+  transformCsvStringToOptions(str, interpolate = true) {
     var _a;
-    const interpolated = sceneGraph.interpolate(this, this.state.query);
-    const match = (_a = interpolated.match(/(?:\\,|[^,])+/g)) != null ? _a : [];
-    const options = match.map((text) => {
+    str = interpolate ? sceneGraph.interpolate(this, str) : str;
+    const match = (_a = str.match(/(?:\\,|[^,])+/g)) != null ? _a : [];
+    return match.map((text) => {
       var _a2;
       text = text.replace(/\\,/g, ",");
       const textMatch = (_a2 = /^\s*(.+)\s:\s(.+)$/g.exec(text)) != null ? _a2 : [];
@@ -11144,6 +11137,9 @@ class CustomVariable extends MultiValueVariable {
         return { label: text.trim(), value: text.trim() };
       }
     });
+  }
+  getValueOptions(args) {
+    const options = this.transformCsvStringToOptions(this.state.query);
     if (!options.length) {
       this.skipNextValidation = true;
     }