@grafana/scenes 5.41.3 → 5.42.1--canary.1051.13198431677.0

Sign up to get free protection for your applications and to get access to all the features.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,15 @@
1
+ # v5.42.0 (Thu Feb 06 2025)
2
+
3
+ #### 🚀 Enhancement
4
+
5
+ - Themes: Fixes variable labels to support border radius [#1050](https://github.com/grafana/scenes/pull/1050) ([@torkelo](https://github.com/torkelo))
6
+
7
+ #### Authors: 1
8
+
9
+ - Torkel Ödegaard ([@torkelo](https://github.com/torkelo))
10
+
11
+ ---
12
+
1
13
  # v5.41.3 (Thu Feb 06 2025)
2
14
 
3
15
  #### 🐛 Bug Fix
@@ -120,13 +120,25 @@ class SceneDataTransformer extends SceneObjectBase {
120
120
  if (!force && this.haveAlreadyTransformedData(data)) {
121
121
  return;
122
122
  }
123
- const seriesTransformations = this.state.transformations.filter((transformation) => {
123
+ let interpolatedTransformations = this.state.transformations;
124
+ if (this._variableDependency.getNames().size > 0) {
125
+ interpolatedTransformations = this.state.transformations.map((t) => {
126
+ var _a2;
127
+ if ("options" in t) {
128
+ return __spreadProps(__spreadValues({}, t), {
129
+ options: JSON.parse(sceneGraph.interpolate(this, JSON.stringify(t.options), (_a2 = data.request) == null ? void 0 : _a2.scopedVars))
130
+ });
131
+ }
132
+ return t;
133
+ });
134
+ }
135
+ const seriesTransformations = interpolatedTransformations.filter((transformation) => {
124
136
  if ("options" in transformation || "topic" in transformation) {
125
137
  return transformation.topic == null || transformation.topic === DataTopic.Series;
126
138
  }
127
139
  return true;
128
140
  }).map((transformation) => "operator" in transformation ? transformation.operator : transformation);
129
- const annotationsTransformations = this.state.transformations.filter((transformation) => {
141
+ const annotationsTransformations = interpolatedTransformations.filter((transformation) => {
130
142
  if ("options" in transformation || "topic" in transformation) {
131
143
  return transformation.topic === DataTopic.Annotations;
132
144
  }
@@ -1 +1 @@
1
- {"version":3,"file":"SceneDataTransformer.js","sources":["../../../src/querying/SceneDataTransformer.ts"],"sourcesContent":["import { DataTopic, DataTransformerConfig, LoadingState, PanelData, transformDataFrame } 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 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 seriesTransformations = this.state.transformations\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 = this.state.transformations\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) => {\n return sceneGraph.interpolate(this, value, data.request?.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 this._transformSub = forkJoin(streams)\n .pipe(\n map((values) => {\n const transformedSeries = values[0];\n const transformedAnnotations = values[1];\n\n return {\n ...data,\n series: transformedSeries,\n annotations: transformedAnnotations ?? data.annotations,\n };\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"],"names":["_a"],"mappings":"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"}
1
+ {"version":3,"file":"SceneDataTransformer.js","sources":["../../../src/querying/SceneDataTransformer.ts"],"sourcesContent":["import { DataTopic, DataTransformerConfig, LoadingState, PanelData, transformDataFrame } 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 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.state.transformations;\n\n if (this._variableDependency.getNames().size > 0) {\n interpolatedTransformations = this.state.transformations.map((t) => {\n if ('options' in t) {\n return {\n ...t,\n options: JSON.parse(sceneGraph.interpolate(this, JSON.stringify(t.options), data.request?.scopedVars)),\n };\n }\n\n return t;\n });\n }\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) => {\n return sceneGraph.interpolate(this, value, data.request?.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 this._transformSub = forkJoin(streams)\n .pipe(\n map((values) => {\n const transformedSeries = values[0];\n const transformedAnnotations = values[1];\n\n return {\n ...data,\n series: transformedSeries,\n annotations: transformedAnnotations ?? data.annotations,\n };\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"],"names":["_a"],"mappings":"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"}
@@ -78,7 +78,7 @@ const getStyles = (theme) => ({
78
78
  fontSize: theme.typography.bodySmall.fontSize,
79
79
  height: theme.spacing(theme.components.height.md),
80
80
  lineHeight: theme.spacing(theme.components.height.md),
81
- borderRadius: theme.shape.borderRadius(1),
81
+ borderRadius: `${theme.shape.radius.default} 0 0 ${theme.shape.radius.default}`,
82
82
  border: `1px solid ${theme.components.input.borderColor}`,
83
83
  position: "relative",
84
84
  right: -1,
@@ -1 +1 @@
1
- {"version":3,"file":"ControlsLabel.js","sources":["../../../src/utils/ControlsLabel.tsx"],"sourcesContent":["import React from 'react';\nimport { Icon, IconButton, Tooltip, useStyles2, useTheme2 } from '@grafana/ui';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { GrafanaTheme2, IconName } from '@grafana/data';\nimport { css } from '@emotion/css';\nimport { LoadingIndicator } from './LoadingIndicator';\nimport { ControlsLayout } from '../core/types';\n\ninterface ControlsLabelProps {\n label: string;\n htmlFor?: string;\n description?: string;\n isLoading?: boolean;\n error?: string;\n icon?: IconName;\n layout?: ControlsLayout;\n onCancel?: () => void;\n onRemove?: () => void;\n}\n\nexport function ControlsLabel(props: ControlsLabelProps) {\n const styles = useStyles2(getStyles);\n const theme = useTheme2();\n const isVertical = props.layout === 'vertical';\n\n const loadingIndicator = Boolean(props.isLoading) ? (\n <div\n style={{ marginLeft: theme.spacing(1), marginTop: '-1px' }}\n aria-label={selectors.components.LoadingIndicator.icon}\n >\n <LoadingIndicator\n onCancel={(e) => {\n e.preventDefault();\n e.stopPropagation();\n props.onCancel?.();\n }}\n />\n </div>\n ) : null;\n\n let errorIndicator = null;\n if (props.error) {\n errorIndicator = (\n <Tooltip content={props.error} placement={'bottom'}>\n <Icon className={styles.errorIcon} name=\"exclamation-triangle\" />\n </Tooltip>\n );\n }\n\n let descriptionIndicator = null;\n if (props.description) {\n descriptionIndicator = (\n <Tooltip content={props.description} placement={isVertical ? 'top' : 'bottom'}>\n <Icon className={styles.normalIcon} name=\"info-circle\" />\n </Tooltip>\n );\n }\n\n const testId =\n typeof props.label === 'string' ? selectors.pages.Dashboard.SubMenu.submenuItemLabels(props.label) : '';\n let labelElement: JSX.Element;\n\n // The vertical layout has different css class and order of elements (label always first)\n\n if (isVertical) {\n labelElement = (\n <label className={styles.verticalLabel} data-testid={testId} htmlFor={props.htmlFor}>\n {props.label}\n {descriptionIndicator}\n {errorIndicator}\n {props.icon && <Icon name={props.icon} className={styles.normalIcon} />}\n {loadingIndicator}\n {props.onRemove && (\n <IconButton variant=\"secondary\" size=\"xs\" name=\"times\" onClick={props.onRemove} tooltip={'Remove'} />\n )}\n </label>\n );\n } else {\n labelElement = (\n <label className={styles.horizontalLabel} data-testid={testId} htmlFor={props.htmlFor}>\n {errorIndicator}\n {props.icon && <Icon name={props.icon} className={styles.normalIcon} />}\n {props.label}\n {descriptionIndicator}\n {loadingIndicator}\n </label>\n );\n }\n\n return labelElement;\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n horizontalLabel: css({\n background: theme.isDark ? theme.colors.background.primary : theme.colors.background.secondary,\n display: `flex`,\n alignItems: 'center',\n padding: theme.spacing(0, 1),\n fontWeight: theme.typography.fontWeightMedium,\n fontSize: theme.typography.bodySmall.fontSize,\n height: theme.spacing(theme.components.height.md),\n lineHeight: theme.spacing(theme.components.height.md),\n borderRadius: theme.shape.borderRadius(1),\n border: `1px solid ${theme.components.input.borderColor}`,\n position: 'relative',\n // To make the border line up with the input border\n right: -1,\n whiteSpace: 'nowrap',\n gap: theme.spacing(0.5),\n }),\n verticalLabel: css({\n display: `flex`,\n alignItems: 'center',\n fontWeight: theme.typography.fontWeightMedium,\n fontSize: theme.typography.bodySmall.fontSize,\n lineHeight: theme.typography.bodySmall.lineHeight,\n whiteSpace: 'nowrap',\n marginBottom: theme.spacing(0.5),\n gap: theme.spacing(1),\n }),\n errorIcon: css({\n color: theme.colors.error.text,\n }),\n normalIcon: css({\n color: theme.colors.text.secondary,\n }),\n});\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ControlsLabel.js","sources":["../../../src/utils/ControlsLabel.tsx"],"sourcesContent":["import React from 'react';\nimport { Icon, IconButton, Tooltip, useStyles2, useTheme2 } from '@grafana/ui';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { GrafanaTheme2, IconName } from '@grafana/data';\nimport { css } from '@emotion/css';\nimport { LoadingIndicator } from './LoadingIndicator';\nimport { ControlsLayout } from '../core/types';\n\ninterface ControlsLabelProps {\n label: string;\n htmlFor?: string;\n description?: string;\n isLoading?: boolean;\n error?: string;\n icon?: IconName;\n layout?: ControlsLayout;\n onCancel?: () => void;\n onRemove?: () => void;\n}\n\nexport function ControlsLabel(props: ControlsLabelProps) {\n const styles = useStyles2(getStyles);\n const theme = useTheme2();\n const isVertical = props.layout === 'vertical';\n\n const loadingIndicator = Boolean(props.isLoading) ? (\n <div\n style={{ marginLeft: theme.spacing(1), marginTop: '-1px' }}\n aria-label={selectors.components.LoadingIndicator.icon}\n >\n <LoadingIndicator\n onCancel={(e) => {\n e.preventDefault();\n e.stopPropagation();\n props.onCancel?.();\n }}\n />\n </div>\n ) : null;\n\n let errorIndicator = null;\n if (props.error) {\n errorIndicator = (\n <Tooltip content={props.error} placement={'bottom'}>\n <Icon className={styles.errorIcon} name=\"exclamation-triangle\" />\n </Tooltip>\n );\n }\n\n let descriptionIndicator = null;\n if (props.description) {\n descriptionIndicator = (\n <Tooltip content={props.description} placement={isVertical ? 'top' : 'bottom'}>\n <Icon className={styles.normalIcon} name=\"info-circle\" />\n </Tooltip>\n );\n }\n\n const testId =\n typeof props.label === 'string' ? selectors.pages.Dashboard.SubMenu.submenuItemLabels(props.label) : '';\n let labelElement: JSX.Element;\n\n // The vertical layout has different css class and order of elements (label always first)\n\n if (isVertical) {\n labelElement = (\n <label className={styles.verticalLabel} data-testid={testId} htmlFor={props.htmlFor}>\n {props.label}\n {descriptionIndicator}\n {errorIndicator}\n {props.icon && <Icon name={props.icon} className={styles.normalIcon} />}\n {loadingIndicator}\n {props.onRemove && (\n <IconButton variant=\"secondary\" size=\"xs\" name=\"times\" onClick={props.onRemove} tooltip={'Remove'} />\n )}\n </label>\n );\n } else {\n labelElement = (\n <label className={styles.horizontalLabel} data-testid={testId} htmlFor={props.htmlFor}>\n {errorIndicator}\n {props.icon && <Icon name={props.icon} className={styles.normalIcon} />}\n {props.label}\n {descriptionIndicator}\n {loadingIndicator}\n </label>\n );\n }\n\n return labelElement;\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n horizontalLabel: css({\n background: theme.isDark ? theme.colors.background.primary : theme.colors.background.secondary,\n display: `flex`,\n alignItems: 'center',\n padding: theme.spacing(0, 1),\n fontWeight: theme.typography.fontWeightMedium,\n fontSize: theme.typography.bodySmall.fontSize,\n height: theme.spacing(theme.components.height.md),\n lineHeight: theme.spacing(theme.components.height.md),\n borderRadius: `${theme.shape.radius.default} 0 0 ${theme.shape.radius.default}`,\n border: `1px solid ${theme.components.input.borderColor}`,\n position: 'relative',\n // To make the border line up with the input border\n right: -1,\n whiteSpace: 'nowrap',\n gap: theme.spacing(0.5),\n }),\n verticalLabel: css({\n display: `flex`,\n alignItems: 'center',\n fontWeight: theme.typography.fontWeightMedium,\n fontSize: theme.typography.bodySmall.fontSize,\n lineHeight: theme.typography.bodySmall.lineHeight,\n whiteSpace: 'nowrap',\n marginBottom: theme.spacing(0.5),\n gap: theme.spacing(1),\n }),\n errorIcon: css({\n color: theme.colors.error.text,\n }),\n normalIcon: css({\n color: theme.colors.text.secondary,\n }),\n});\n"],"names":[],"mappings":"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"}
@@ -65,7 +65,13 @@ function VariableLabel({ variable, layout, hideLabel }) {
65
65
  description: (_a = state.description) != null ? _a : void 0
66
66
  });
67
67
  }
68
- const containerStyle = css({ display: "flex" });
68
+ const containerStyle = css({
69
+ display: "flex",
70
+ "> :nth-child(2)": css({
71
+ borderTopLeftRadius: 0,
72
+ borderBottomLeftRadius: 0
73
+ })
74
+ });
69
75
  const verticalContainer = css({ display: "flex", flexDirection: "column" });
70
76
 
71
77
  export { VariableValueSelectWrapper, VariableValueSelectors };
@@ -1 +1 @@
1
- {"version":3,"file":"VariableValueSelectors.js","sources":["../../../../src/variables/components/VariableValueSelectors.tsx"],"sourcesContent":["import React from 'react';\n\nimport { VariableHide } from '@grafana/data';\n\nimport { SceneObjectBase, useSceneObjectState } from '../../core/SceneObjectBase';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { ControlsLayout, SceneComponentProps, SceneObjectState } from '../../core/types';\nimport { SceneVariable, SceneVariableState } from '../types';\nimport { ControlsLabel } from '../../utils/ControlsLabel';\nimport { css } from '@emotion/css';\nimport { selectors } from '@grafana/e2e-selectors';\n\nexport interface VariableValueSelectorsState extends SceneObjectState {\n layout?: ControlsLayout;\n}\n\nexport class VariableValueSelectors extends SceneObjectBase<VariableValueSelectorsState> {\n public static Component = VariableValueSelectorsRenderer;\n}\n\nfunction VariableValueSelectorsRenderer({ model }: SceneComponentProps<VariableValueSelectors>) {\n const variables = sceneGraph.getVariables(model)!.useState();\n\n return (\n <>\n {variables.variables.map((variable) => (\n <VariableValueSelectWrapper key={variable.state.key} variable={variable} layout={model.state.layout} />\n ))}\n </>\n );\n}\n\ninterface VariableSelectProps {\n layout?: ControlsLayout;\n variable: SceneVariable;\n /** To override hide from VariableValueSelectByName */\n showAlways?: boolean;\n /** To provide an option to hide the label in the variable value selector */\n hideLabel?: boolean;\n}\n\nexport function VariableValueSelectWrapper({ variable, layout, showAlways, hideLabel }: VariableSelectProps) {\n const state = useSceneObjectState<SceneVariableState>(variable, { shouldActivateOrKeepAlive: true });\n\n if (state.hide === VariableHide.hideVariable && !showAlways) {\n return null;\n }\n\n if (layout === 'vertical') {\n return (\n <div className={verticalContainer} data-testid={selectors.pages.Dashboard.SubMenu.submenuItem}>\n <VariableLabel variable={variable} layout={layout} hideLabel={hideLabel} />\n <variable.Component model={variable} />\n </div>\n );\n }\n\n return (\n <div className={containerStyle} data-testid={selectors.pages.Dashboard.SubMenu.submenuItem}>\n <VariableLabel variable={variable} hideLabel={hideLabel} />\n <variable.Component model={variable} />\n </div>\n );\n}\n\nfunction VariableLabel({ variable, layout, hideLabel }: VariableSelectProps) {\n const { state } = variable;\n\n if (variable.state.hide === VariableHide.hideLabel || hideLabel) {\n return null;\n }\n\n const elementId = `var-${state.key}`;\n const labelOrName = state.label || state.name;\n\n return (\n <ControlsLabel\n htmlFor={elementId}\n isLoading={state.loading}\n onCancel={() => variable.onCancel?.()}\n label={labelOrName}\n error={state.error}\n layout={layout}\n description={state.description ?? undefined}\n />\n );\n}\n\nconst containerStyle = css({ display: 'flex' });\nconst verticalContainer = css({ display: 'flex', flexDirection: 'column' });\n"],"names":["_a"],"mappings":"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"}
1
+ {"version":3,"file":"VariableValueSelectors.js","sources":["../../../../src/variables/components/VariableValueSelectors.tsx"],"sourcesContent":["import React from 'react';\n\nimport { VariableHide } from '@grafana/data';\n\nimport { SceneObjectBase, useSceneObjectState } from '../../core/SceneObjectBase';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { ControlsLayout, SceneComponentProps, SceneObjectState } from '../../core/types';\nimport { SceneVariable, SceneVariableState } from '../types';\nimport { ControlsLabel } from '../../utils/ControlsLabel';\nimport { css } from '@emotion/css';\nimport { selectors } from '@grafana/e2e-selectors';\n\nexport interface VariableValueSelectorsState extends SceneObjectState {\n layout?: ControlsLayout;\n}\n\nexport class VariableValueSelectors extends SceneObjectBase<VariableValueSelectorsState> {\n public static Component = VariableValueSelectorsRenderer;\n}\n\nfunction VariableValueSelectorsRenderer({ model }: SceneComponentProps<VariableValueSelectors>) {\n const variables = sceneGraph.getVariables(model)!.useState();\n\n return (\n <>\n {variables.variables.map((variable) => (\n <VariableValueSelectWrapper key={variable.state.key} variable={variable} layout={model.state.layout} />\n ))}\n </>\n );\n}\n\ninterface VariableSelectProps {\n layout?: ControlsLayout;\n variable: SceneVariable;\n /** To override hide from VariableValueSelectByName */\n showAlways?: boolean;\n /** To provide an option to hide the label in the variable value selector */\n hideLabel?: boolean;\n}\n\nexport function VariableValueSelectWrapper({ variable, layout, showAlways, hideLabel }: VariableSelectProps) {\n const state = useSceneObjectState<SceneVariableState>(variable, { shouldActivateOrKeepAlive: true });\n\n if (state.hide === VariableHide.hideVariable && !showAlways) {\n return null;\n }\n\n if (layout === 'vertical') {\n return (\n <div className={verticalContainer} data-testid={selectors.pages.Dashboard.SubMenu.submenuItem}>\n <VariableLabel variable={variable} layout={layout} hideLabel={hideLabel} />\n <variable.Component model={variable} />\n </div>\n );\n }\n\n return (\n <div className={containerStyle} data-testid={selectors.pages.Dashboard.SubMenu.submenuItem}>\n <VariableLabel variable={variable} hideLabel={hideLabel} />\n <variable.Component model={variable} />\n </div>\n );\n}\n\nfunction VariableLabel({ variable, layout, hideLabel }: VariableSelectProps) {\n const { state } = variable;\n\n if (variable.state.hide === VariableHide.hideLabel || hideLabel) {\n return null;\n }\n\n const elementId = `var-${state.key}`;\n const labelOrName = state.label || state.name;\n\n return (\n <ControlsLabel\n htmlFor={elementId}\n isLoading={state.loading}\n onCancel={() => variable.onCancel?.()}\n label={labelOrName}\n error={state.error}\n layout={layout}\n description={state.description ?? undefined}\n />\n );\n}\n\nconst containerStyle = css({\n display: 'flex',\n // No border for second element (inputs) as label and input border is shared\n '> :nth-child(2)': css({\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n }),\n});\n\nconst verticalContainer = css({ display: 'flex', flexDirection: 'column' });\n"],"names":["_a"],"mappings":"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"}
package/dist/index.js CHANGED
@@ -3537,7 +3537,7 @@ const getStyles$g = (theme) => ({
3537
3537
  fontSize: theme.typography.bodySmall.fontSize,
3538
3538
  height: theme.spacing(theme.components.height.md),
3539
3539
  lineHeight: theme.spacing(theme.components.height.md),
3540
- borderRadius: theme.shape.borderRadius(1),
3540
+ borderRadius: `${theme.shape.radius.default} 0 0 ${theme.shape.radius.default}`,
3541
3541
  border: `1px solid ${theme.components.input.borderColor}`,
3542
3542
  position: "relative",
3543
3543
  right: -1,
@@ -9288,13 +9288,25 @@ class SceneDataTransformer extends SceneObjectBase {
9288
9288
  if (!force && this.haveAlreadyTransformedData(data$1)) {
9289
9289
  return;
9290
9290
  }
9291
- const seriesTransformations = this.state.transformations.filter((transformation) => {
9291
+ let interpolatedTransformations = this.state.transformations;
9292
+ if (this._variableDependency.getNames().size > 0) {
9293
+ interpolatedTransformations = this.state.transformations.map((t) => {
9294
+ var _a2;
9295
+ if ("options" in t) {
9296
+ return __spreadProps$9(__spreadValues$i({}, t), {
9297
+ options: JSON.parse(sceneGraph.interpolate(this, JSON.stringify(t.options), (_a2 = data$1.request) == null ? void 0 : _a2.scopedVars))
9298
+ });
9299
+ }
9300
+ return t;
9301
+ });
9302
+ }
9303
+ const seriesTransformations = interpolatedTransformations.filter((transformation) => {
9292
9304
  if ("options" in transformation || "topic" in transformation) {
9293
9305
  return transformation.topic == null || transformation.topic === data.DataTopic.Series;
9294
9306
  }
9295
9307
  return true;
9296
9308
  }).map((transformation) => "operator" in transformation ? transformation.operator : transformation);
9297
- const annotationsTransformations = this.state.transformations.filter((transformation) => {
9309
+ const annotationsTransformations = interpolatedTransformations.filter((transformation) => {
9298
9310
  if ("options" in transformation || "topic" in transformation) {
9299
9311
  return transformation.topic === data.DataTopic.Annotations;
9300
9312
  }
@@ -9401,7 +9413,13 @@ function VariableLabel({ variable, layout, hideLabel }) {
9401
9413
  description: (_a = state.description) != null ? _a : void 0
9402
9414
  });
9403
9415
  }
9404
- const containerStyle = css.css({ display: "flex" });
9416
+ const containerStyle = css.css({
9417
+ display: "flex",
9418
+ "> :nth-child(2)": css.css({
9419
+ borderTopLeftRadius: 0,
9420
+ borderBottomLeftRadius: 0
9421
+ })
9422
+ });
9405
9423
  const verticalContainer = css.css({ display: "flex", flexDirection: "column" });
9406
9424
 
9407
9425
  class VariableValueControl extends SceneObjectBase {