@grafana/scenes 6.52.1--canary.1323.20597071326.0 → 6.52.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,17 @@
|
|
|
1
|
+
# v6.52.1 (Tue Jan 06 2026)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- Variables: Fix text formatter for variables with multi-props [#1323](https://github.com/grafana/scenes/pull/1323) ([@grafakus](https://github.com/grafakus))
|
|
6
|
+
- DD: Change Switch variable ID to not overlap with the dashboard control label [#1324](https://github.com/grafana/scenes/pull/1324) ([@idastambuk](https://github.com/idastambuk))
|
|
7
|
+
|
|
8
|
+
#### Authors: 2
|
|
9
|
+
|
|
10
|
+
- Ida Štambuk ([@idastambuk](https://github.com/idastambuk))
|
|
11
|
+
- Marc M. ([@grafakus](https://github.com/grafakus))
|
|
12
|
+
|
|
13
|
+
---
|
|
14
|
+
|
|
1
15
|
# v6.52.0 (Thu Dec 18 2025)
|
|
2
16
|
|
|
3
17
|
#### 🚀 Enhancement
|
|
@@ -83,7 +83,7 @@ function SwitchVariableRenderer({ model }) {
|
|
|
83
83
|
return /* @__PURE__ */ React.createElement("div", { className: styles.container }, /* @__PURE__ */ React.createElement(
|
|
84
84
|
Switch,
|
|
85
85
|
{
|
|
86
|
-
id: `var-${state.key}`,
|
|
86
|
+
id: `var-switch-${state.key}`,
|
|
87
87
|
value: state.value === state.enabledValue,
|
|
88
88
|
onChange: (event) => {
|
|
89
89
|
model.setValue(event.currentTarget.checked ? state.enabledValue : state.disabledValue);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SwitchVariable.js","sources":["../../../../../../../src/variables/variants/SwitchVariable.tsx"],"sourcesContent":["import React from 'react';\nimport { Observable, of } from 'rxjs';\nimport { Switch, useStyles2 } from '@grafana/ui';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { css } from '@emotion/css';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { SceneComponentProps, SceneObjectUrlValues } from '../../core/types';\nimport { SceneObjectUrlSyncConfig } from '../../services/SceneObjectUrlSyncConfig';\nimport {\n SceneVariable,\n SceneVariableState,\n SceneVariableValueChangedEvent,\n ValidateAndUpdateResult,\n VariableValue,\n} from '../types';\n\nexport interface SwitchVariableState extends SceneVariableState {\n value: string;\n enabledValue: string;\n disabledValue: string;\n}\n\nexport class SwitchVariable extends SceneObjectBase<SwitchVariableState> implements SceneVariable<SwitchVariableState> {\n public static Component = SwitchVariableRenderer;\n private _prevValue: VariableValue = '';\n\n public constructor(initialState: Partial<SwitchVariableState>) {\n super({\n // TODO: remove this once switch is in the schema @leventebalogh\n // @ts-expect-error - switch is a valid variable type, but not in the schema yet\n type: 'switch',\n value: 'false',\n enabledValue: 'true',\n disabledValue: 'false',\n name: '',\n ...initialState,\n });\n\n this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: () => this.getKeys() });\n }\n\n /**\n * This function is called on when SceneVariableSet is activated or when a dependency changes.\n */\n public validateAndUpdate(): Observable<ValidateAndUpdateResult> {\n const newValue = this.getValue();\n\n if (this._prevValue !== newValue) {\n this._prevValue = newValue;\n this.publishEvent(new SceneVariableValueChangedEvent(this), true);\n }\n\n return of({});\n }\n\n public setValue(newValue: string): void {\n // Ignore if there's no change\n if (this.getValue() === newValue) {\n return;\n }\n\n if ([this.state.enabledValue, this.state.disabledValue].includes(newValue)) {\n this.setState({ value: newValue });\n this.publishEvent(new SceneVariableValueChangedEvent(this), true);\n } else {\n console.error(\n `Invalid value for switch variable: \"${newValue}\". Valid values are: \"${this.state.enabledValue}\" and \"${this.state.disabledValue}\".`\n );\n }\n }\n\n public getValue(): VariableValue {\n return this.state.value;\n }\n\n public isEnabled(): boolean {\n return this.state.value === this.state.enabledValue;\n }\n\n public isDisabled(): boolean {\n return this.state.value === this.state.disabledValue;\n }\n\n private getKey(): string {\n return `var-${this.state.name}`;\n }\n\n public getKeys(): string[] {\n if (this.state.skipUrlSync) {\n return [];\n }\n\n return [this.getKey()];\n }\n\n public getUrlState(): SceneObjectUrlValues {\n if (this.state.skipUrlSync) {\n return {};\n }\n\n return { [this.getKey()]: this.state.value };\n }\n\n public updateFromUrl(values: SceneObjectUrlValues): void {\n const val = values[this.getKey()];\n\n if (typeof val === 'string') {\n this.setValue(val);\n }\n }\n}\n\nfunction SwitchVariableRenderer({ model }: SceneComponentProps<SwitchVariable>) {\n const state = model.useState();\n const styles = useStyles2(getStyles);\n\n return (\n <div className={styles.container}>\n <Switch\n id={`var-${state.key}`}\n value={state.value === state.enabledValue}\n onChange={(event) => {\n model.setValue(event!.currentTarget.checked ? state.enabledValue : state.disabledValue);\n }}\n />\n </div>\n );\n}\n\nfunction getStyles(theme: GrafanaTheme2) {\n return {\n container: css({\n display: 'flex',\n alignItems: 'center',\n padding: theme.spacing(0, 1),\n height: theme.spacing(theme.components.height.md),\n borderRadius: theme.shape.radius.default,\n border: `1px solid ${theme.components.input.borderColor}`,\n background: theme.colors.background.primary,\n }),\n };\n}\n"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"SwitchVariable.js","sources":["../../../../../../../src/variables/variants/SwitchVariable.tsx"],"sourcesContent":["import React from 'react';\nimport { Observable, of } from 'rxjs';\nimport { Switch, useStyles2 } from '@grafana/ui';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { css } from '@emotion/css';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { SceneComponentProps, SceneObjectUrlValues } from '../../core/types';\nimport { SceneObjectUrlSyncConfig } from '../../services/SceneObjectUrlSyncConfig';\nimport {\n SceneVariable,\n SceneVariableState,\n SceneVariableValueChangedEvent,\n ValidateAndUpdateResult,\n VariableValue,\n} from '../types';\n\nexport interface SwitchVariableState extends SceneVariableState {\n value: string;\n enabledValue: string;\n disabledValue: string;\n}\n\nexport class SwitchVariable extends SceneObjectBase<SwitchVariableState> implements SceneVariable<SwitchVariableState> {\n public static Component = SwitchVariableRenderer;\n private _prevValue: VariableValue = '';\n\n public constructor(initialState: Partial<SwitchVariableState>) {\n super({\n // TODO: remove this once switch is in the schema @leventebalogh\n // @ts-expect-error - switch is a valid variable type, but not in the schema yet\n type: 'switch',\n value: 'false',\n enabledValue: 'true',\n disabledValue: 'false',\n name: '',\n ...initialState,\n });\n\n this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: () => this.getKeys() });\n }\n\n /**\n * This function is called on when SceneVariableSet is activated or when a dependency changes.\n */\n public validateAndUpdate(): Observable<ValidateAndUpdateResult> {\n const newValue = this.getValue();\n\n if (this._prevValue !== newValue) {\n this._prevValue = newValue;\n this.publishEvent(new SceneVariableValueChangedEvent(this), true);\n }\n\n return of({});\n }\n\n public setValue(newValue: string): void {\n // Ignore if there's no change\n if (this.getValue() === newValue) {\n return;\n }\n\n if ([this.state.enabledValue, this.state.disabledValue].includes(newValue)) {\n this.setState({ value: newValue });\n this.publishEvent(new SceneVariableValueChangedEvent(this), true);\n } else {\n console.error(\n `Invalid value for switch variable: \"${newValue}\". Valid values are: \"${this.state.enabledValue}\" and \"${this.state.disabledValue}\".`\n );\n }\n }\n\n public getValue(): VariableValue {\n return this.state.value;\n }\n\n public isEnabled(): boolean {\n return this.state.value === this.state.enabledValue;\n }\n\n public isDisabled(): boolean {\n return this.state.value === this.state.disabledValue;\n }\n\n private getKey(): string {\n return `var-${this.state.name}`;\n }\n\n public getKeys(): string[] {\n if (this.state.skipUrlSync) {\n return [];\n }\n\n return [this.getKey()];\n }\n\n public getUrlState(): SceneObjectUrlValues {\n if (this.state.skipUrlSync) {\n return {};\n }\n\n return { [this.getKey()]: this.state.value };\n }\n\n public updateFromUrl(values: SceneObjectUrlValues): void {\n const val = values[this.getKey()];\n\n if (typeof val === 'string') {\n this.setValue(val);\n }\n }\n}\n\nfunction SwitchVariableRenderer({ model }: SceneComponentProps<SwitchVariable>) {\n const state = model.useState();\n const styles = useStyles2(getStyles);\n\n return (\n <div className={styles.container}>\n <Switch\n id={`var-switch-${state.key}`}\n value={state.value === state.enabledValue}\n onChange={(event) => {\n model.setValue(event!.currentTarget.checked ? state.enabledValue : state.disabledValue);\n }}\n />\n </div>\n );\n}\n\nfunction getStyles(theme: GrafanaTheme2) {\n return {\n container: css({\n display: 'flex',\n alignItems: 'center',\n padding: theme.spacing(0, 1),\n height: theme.spacing(theme.components.height.md),\n borderRadius: theme.shape.radius.default,\n border: `1px solid ${theme.components.input.borderColor}`,\n background: theme.colors.background.primary,\n }),\n };\n}\n"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -12790,7 +12790,7 @@ function SwitchVariableRenderer({ model }) {
|
|
|
12790
12790
|
return /* @__PURE__ */ React__default.default.createElement("div", { className: styles.container }, /* @__PURE__ */ React__default.default.createElement(
|
|
12791
12791
|
ui.Switch,
|
|
12792
12792
|
{
|
|
12793
|
-
id: `var-${state.key}`,
|
|
12793
|
+
id: `var-switch-${state.key}`,
|
|
12794
12794
|
value: state.value === state.enabledValue,
|
|
12795
12795
|
onChange: (event) => {
|
|
12796
12796
|
model.setValue(event.currentTarget.checked ? state.enabledValue : state.disabledValue);
|