@grafana/scenes 6.42.2 → 6.42.3--canary.1295.19058579723.0

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.
@@ -83,6 +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
87
  value: state.value === state.enabledValue,
87
88
  onChange: (event) => {
88
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 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-${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
@@ -11885,6 +11885,7 @@ function SwitchVariableRenderer({ model }) {
11885
11885
  return /* @__PURE__ */ React__default.default.createElement("div", { className: styles.container }, /* @__PURE__ */ React__default.default.createElement(
11886
11886
  ui.Switch,
11887
11887
  {
11888
+ id: `var-${state.key}`,
11888
11889
  value: state.value === state.enabledValue,
11889
11890
  onChange: (event) => {
11890
11891
  model.setValue(event.currentTarget.checked ? state.enabledValue : state.disabledValue);