@grafana/scenes 0.0.8 → 0.0.10
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/dist/esm/components/EmbeddedScene.js +7 -3
- package/dist/esm/components/EmbeddedScene.js.map +1 -1
- package/dist/esm/components/VizPanel/VizPanel.js +4 -12
- package/dist/esm/components/VizPanel/VizPanel.js.map +1 -1
- package/dist/esm/core/sceneGraph.js +3 -3
- package/dist/esm/core/sceneGraph.js.map +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/variables/interpolation/sceneInterpolator.js +1 -5
- package/dist/esm/variables/interpolation/sceneInterpolator.js.map +1 -1
- package/dist/index.d.ts +8 -3
- package/dist/index.js +15 -20
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -5,14 +5,18 @@ import { SceneObjectBase } from '../core/SceneObjectBase.js';
|
|
|
5
5
|
import { UrlSyncManager } from '../services/UrlSyncManager.js';
|
|
6
6
|
|
|
7
7
|
class EmbeddedScene extends SceneObjectBase {
|
|
8
|
-
|
|
9
|
-
super.activate();
|
|
8
|
+
initUrlSync() {
|
|
10
9
|
this.urlSyncManager = new UrlSyncManager(this);
|
|
11
10
|
this.urlSyncManager.initSync();
|
|
12
11
|
}
|
|
12
|
+
activate() {
|
|
13
|
+
super.activate();
|
|
14
|
+
}
|
|
13
15
|
deactivate() {
|
|
14
16
|
super.deactivate();
|
|
15
|
-
this.urlSyncManager
|
|
17
|
+
if (this.urlSyncManager) {
|
|
18
|
+
this.urlSyncManager.cleanUp();
|
|
19
|
+
}
|
|
16
20
|
}
|
|
17
21
|
}
|
|
18
22
|
EmbeddedScene.Component = EmbeddedSceneRenderer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmbeddedScene.js","sources":["../../../src/components/EmbeddedScene.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2 } from '@grafana/ui';\nimport React from 'react';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { SceneComponentProps, SceneObjectStatePlain, SceneObject } from '../core/types';\nimport { UrlSyncManager } from '../services/UrlSyncManager';\n\nexport interface EmbeddedSceneState extends SceneObjectStatePlain {\n /**\n * The main content of the scene (usually a SceneFlexLayout)\n */\n body: SceneObject;\n /**\n * Top row of variable selectors, filters, time pickers and custom actions.\n */\n controls?: SceneObject[];\n}\n\nexport class EmbeddedScene extends SceneObjectBase<EmbeddedSceneState> {\n public static Component = EmbeddedSceneRenderer;\n\n private urlSyncManager?: UrlSyncManager;\n\n public
|
|
1
|
+
{"version":3,"file":"EmbeddedScene.js","sources":["../../../src/components/EmbeddedScene.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2 } from '@grafana/ui';\nimport React from 'react';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { SceneComponentProps, SceneObjectStatePlain, SceneObject } from '../core/types';\nimport { UrlSyncManager } from '../services/UrlSyncManager';\n\nexport interface EmbeddedSceneState extends SceneObjectStatePlain {\n /**\n * The main content of the scene (usually a SceneFlexLayout)\n */\n body: SceneObject;\n /**\n * Top row of variable selectors, filters, time pickers and custom actions.\n */\n controls?: SceneObject[];\n}\n\nexport class EmbeddedScene extends SceneObjectBase<EmbeddedSceneState> {\n public static Component = EmbeddedSceneRenderer;\n\n private urlSyncManager?: UrlSyncManager;\n\n /**\n * initUrlSync should be called before the scene is rendered to ensure that objects are in sync\n * before they get activated. This saves some unnecessary re-renders and makes sure variables\n * queries are issued as needed.\n */\n public initUrlSync() {\n this.urlSyncManager = new UrlSyncManager(this);\n this.urlSyncManager.initSync();\n }\n\n public activate() {\n super.activate();\n }\n\n public deactivate() {\n super.deactivate();\n if (this.urlSyncManager) {\n this.urlSyncManager!.cleanUp();\n }\n }\n}\n\nfunction EmbeddedSceneRenderer({ model }: SceneComponentProps<EmbeddedScene>) {\n const { body, controls } = model.useState();\n const styles = useStyles2(getStyles);\n\n return (\n <div className={styles.container}>\n {controls && (\n <div className={styles.controls}>\n {controls.map((control) => (\n <control.Component key={control.state.key} model={control} />\n ))}\n </div>\n )}\n <div className={styles.body}>\n <body.Component model={body} />\n </div>\n </div>\n );\n}\n\nfunction getStyles(theme: GrafanaTheme2) {\n return {\n container: css({\n flexGrow: 1,\n display: 'flex',\n gap: '8px',\n minHeight: '100%',\n flexDirection: 'column',\n }),\n body: css({\n flexGrow: 1,\n display: 'flex',\n gap: '8px',\n }),\n controls: css({\n display: 'flex',\n gap: theme.spacing(1),\n alignItems: 'center',\n }),\n };\n}\n"],"names":[],"mappings":";;;;;;AAoBO,MAAM,sBAAsB,eAAoC,CAAA;AAAA,EAU9D,WAAc,GAAA;AACnB,IAAK,IAAA,CAAA,cAAA,GAAiB,IAAI,cAAA,CAAe,IAAI,CAAA,CAAA;AAC7C,IAAA,IAAA,CAAK,eAAe,QAAS,EAAA,CAAA;AAAA,GAC/B;AAAA,EAEO,QAAW,GAAA;AAChB,IAAA,KAAA,CAAM,QAAS,EAAA,CAAA;AAAA,GACjB;AAAA,EAEO,UAAa,GAAA;AAClB,IAAA,KAAA,CAAM,UAAW,EAAA,CAAA;AACjB,IAAA,IAAI,KAAK,cAAgB,EAAA;AACvB,MAAA,IAAA,CAAK,eAAgB,OAAQ,EAAA,CAAA;AAAA,KAC/B;AAAA,GACF;AACF,CAAA;AAzBa,aAAA,CACG,SAAY,GAAA,qBAAA,CAAA;AA0B5B,SAAS,qBAAA,CAAsB,EAAE,KAAA,EAA6C,EAAA;AAC5E,EAAA,MAAM,EAAE,IAAA,EAAM,QAAS,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AAC1C,EAAM,MAAA,MAAA,GAAS,WAAW,SAAS,CAAA,CAAA;AAEnC,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,MAAO,CAAA,SAAA;AAAA,GAAA,EACpB,4BACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,MAAO,CAAA,QAAA;AAAA,GAAA,EACpB,SAAS,GAAI,CAAA,CAAC,OACb,qBAAA,KAAA,CAAA,aAAA,CAAC,QAAQ,SAAR,EAAA;AAAA,IAAkB,GAAA,EAAK,QAAQ,KAAM,CAAA,GAAA;AAAA,IAAK,KAAO,EAAA,OAAA;AAAA,GAAS,CAC5D,CACH,CAAA,kBAED,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,MAAO,CAAA,IAAA;AAAA,GACrB,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAK,SAAL,EAAA;AAAA,IAAe,KAAO,EAAA,IAAA;AAAA,GAAM,CAC/B,CACF,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,UAAU,KAAsB,EAAA;AACvC,EAAO,OAAA;AAAA,IACL,WAAW,GAAI,CAAA;AAAA,MACb,QAAU,EAAA,CAAA;AAAA,MACV,OAAS,EAAA,MAAA;AAAA,MACT,GAAK,EAAA,KAAA;AAAA,MACL,SAAW,EAAA,MAAA;AAAA,MACX,aAAe,EAAA,QAAA;AAAA,KAChB,CAAA;AAAA,IACD,MAAM,GAAI,CAAA;AAAA,MACR,QAAU,EAAA,CAAA;AAAA,MACV,OAAS,EAAA,MAAA;AAAA,MACT,GAAK,EAAA,KAAA;AAAA,KACN,CAAA;AAAA,IACD,UAAU,GAAI,CAAA;AAAA,MACZ,OAAS,EAAA,MAAA;AAAA,MACT,GAAA,EAAK,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MACpB,UAAY,EAAA,QAAA;AAAA,KACb,CAAA;AAAA,GACH,CAAA;AACF;;;;"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import { toUtc, getPanelOptionsWithDefaults } from '@grafana/data';
|
|
3
2
|
import { getPluginImportUtils, config } from '@grafana/runtime';
|
|
4
|
-
import { Field, Input } from '@grafana/ui';
|
|
5
3
|
import { SceneObjectBase } from '../../core/SceneObjectBase.js';
|
|
6
4
|
import { sceneGraph } from '../../core/sceneGraph.js';
|
|
7
5
|
import { VizPanelRenderer } from './VizPanelRenderer.js';
|
|
6
|
+
import { VariableDependencyConfig } from '../../variables/VariableDependencyConfig.js';
|
|
8
7
|
|
|
9
8
|
var __defProp = Object.defineProperty;
|
|
10
9
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
@@ -30,6 +29,9 @@ class VizPanel extends SceneObjectBase {
|
|
|
30
29
|
title: "Title",
|
|
31
30
|
pluginId: "timeseries"
|
|
32
31
|
}, state));
|
|
32
|
+
this._variableDependency = new VariableDependencyConfig(this, {
|
|
33
|
+
statePaths: ["title", "options", "fieldConfig"]
|
|
34
|
+
});
|
|
33
35
|
this.onChangeTimeRange = (timeRange) => {
|
|
34
36
|
const sceneTimeRange = sceneGraph.getTimeRange(this);
|
|
35
37
|
sceneTimeRange.onTimeRangeChange({
|
|
@@ -90,16 +92,6 @@ class VizPanel extends SceneObjectBase {
|
|
|
90
92
|
}
|
|
91
93
|
}
|
|
92
94
|
VizPanel.Component = VizPanelRenderer;
|
|
93
|
-
VizPanel.Editor = VizPanelEditor;
|
|
94
|
-
function VizPanelEditor({ model }) {
|
|
95
|
-
const { title } = model.useState();
|
|
96
|
-
return /* @__PURE__ */ React.createElement(Field, {
|
|
97
|
-
label: "Title"
|
|
98
|
-
}, /* @__PURE__ */ React.createElement(Input, {
|
|
99
|
-
defaultValue: title,
|
|
100
|
-
onBlur: (evt) => model.setState({ title: evt.currentTarget.value })
|
|
101
|
-
}));
|
|
102
|
-
}
|
|
103
95
|
|
|
104
96
|
export { VizPanel };
|
|
105
97
|
//# sourceMappingURL=VizPanel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VizPanel.js","sources":["../../../../src/components/VizPanel/VizPanel.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"VizPanel.js","sources":["../../../../src/components/VizPanel/VizPanel.tsx"],"sourcesContent":["import {\n AbsoluteTimeRange,\n FieldConfigSource,\n PanelModel,\n PanelPlugin,\n toUtc,\n getPanelOptionsWithDefaults,\n} from '@grafana/data';\nimport { config, getPluginImportUtils } from '@grafana/runtime';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { DeepPartial, SceneLayoutChildState } from '../../core/types';\n\nimport { VizPanelRenderer } from './VizPanelRenderer';\nimport { VariableDependencyConfig } from '../../variables/VariableDependencyConfig';\n\nexport interface VizPanelState<TOptions = {}, TFieldConfig = {}> extends SceneLayoutChildState {\n title: string;\n pluginId: string;\n options: DeepPartial<TOptions>;\n fieldConfig: FieldConfigSource<DeepPartial<TFieldConfig>>;\n pluginVersion?: string;\n // internal state\n pluginLoadError?: string;\n}\n\nexport class VizPanel<TOptions = {}, TFieldConfig = {}> extends SceneObjectBase<VizPanelState<TOptions, TFieldConfig>> {\n public static Component = VizPanelRenderer;\n\n protected _variableDependency = new VariableDependencyConfig(this, {\n statePaths: ['title', 'options', 'fieldConfig'],\n });\n\n // Not part of state as this is not serializable\n private _plugin?: PanelPlugin;\n\n public constructor(state: Partial<VizPanelState<TOptions, TFieldConfig>>) {\n super({\n options: {},\n fieldConfig: { defaults: {}, overrides: [] },\n title: 'Title',\n pluginId: 'timeseries',\n ...state,\n });\n }\n\n public activate() {\n super.activate();\n const { getPanelPluginFromCache, importPanelPlugin } = getPluginImportUtils();\n const plugin = getPanelPluginFromCache(this.state.pluginId);\n\n if (plugin) {\n this.pluginLoaded(plugin);\n } else {\n importPanelPlugin(this.state.pluginId)\n .then((result) => this.pluginLoaded(result))\n .catch((err: Error) => {\n this.setState({ pluginLoadError: err.message });\n });\n }\n }\n\n private pluginLoaded(plugin: PanelPlugin) {\n const { options, fieldConfig, title, pluginId, pluginVersion } = this.state;\n\n const panel: PanelModel = { title, options, fieldConfig, id: 1, type: pluginId, pluginVersion: pluginVersion };\n const currentVersion = this.getPluginVersion(plugin);\n\n if (plugin.onPanelMigration) {\n if (currentVersion !== this.state.pluginVersion) {\n // These migration handlers also mutate panel.fieldConfig to migrate fieldConfig\n panel.options = plugin.onPanelMigration(panel);\n }\n }\n\n const withDefaults = getPanelOptionsWithDefaults({\n plugin,\n currentOptions: panel.options,\n currentFieldConfig: panel.fieldConfig,\n isAfterPluginChange: false,\n });\n\n this._plugin = plugin;\n this.setState({\n options: withDefaults.options,\n fieldConfig: withDefaults.fieldConfig,\n pluginVersion: currentVersion,\n });\n }\n\n private getPluginVersion(plugin: PanelPlugin): string {\n return plugin && plugin.meta.info.version ? plugin.meta.info.version : config.buildInfo.version;\n }\n\n public getPlugin(): PanelPlugin | undefined {\n return this._plugin;\n }\n\n public onChangeTimeRange = (timeRange: AbsoluteTimeRange) => {\n const sceneTimeRange = sceneGraph.getTimeRange(this);\n sceneTimeRange.onTimeRangeChange({\n raw: {\n from: toUtc(timeRange.from),\n to: toUtc(timeRange.to),\n },\n from: toUtc(timeRange.from),\n to: toUtc(timeRange.to),\n });\n };\n\n public onOptionsChange = (options: TOptions) => {\n this.setState({ options });\n };\n\n public onFieldConfigChange = (fieldConfig: FieldConfigSource<TFieldConfig>) => {\n this.setState({ fieldConfig });\n };\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -50,10 +50,10 @@ function getLayout(scene) {
|
|
|
50
50
|
throw new Error("No layout found in scene tree");
|
|
51
51
|
}
|
|
52
52
|
function interpolate(sceneObject, value, scopedVars, format) {
|
|
53
|
-
if (
|
|
54
|
-
return
|
|
53
|
+
if (value === "" || value == null) {
|
|
54
|
+
return "";
|
|
55
55
|
}
|
|
56
|
-
return sceneInterpolator(sceneObject, value,
|
|
56
|
+
return sceneInterpolator(sceneObject, value, scopedVars, format);
|
|
57
57
|
}
|
|
58
58
|
const sceneGraph = {
|
|
59
59
|
getVariables,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sceneGraph.js","sources":["../../../src/core/sceneGraph.ts"],"sourcesContent":["import { ScopedVars } from '@grafana/data';\nimport { DefaultTimeRange, EmptyDataNode, EmptyVariableSet } from '../variables/interpolation/defaults';\n\nimport { CustomFormatterFn, sceneInterpolator } from '../variables/interpolation/sceneInterpolator';\nimport { SceneVariables } from '../variables/types';\n\nimport { SceneDataState, SceneEditor, SceneLayoutState, SceneObject, SceneTimeRangeLike } from './types';\n\n/**\n * Get the closest node with variables\n */\nexport function getVariables(sceneObject: SceneObject): SceneVariables {\n if (sceneObject.state.$variables) {\n return sceneObject.state.$variables;\n }\n\n if (sceneObject.parent) {\n return getVariables(sceneObject.parent);\n }\n\n return EmptyVariableSet;\n}\n\n/**\n * Will walk up the scene object graph to the closest $data scene object\n */\nexport function getData(sceneObject: SceneObject): SceneObject<SceneDataState> {\n const { $data } = sceneObject.state;\n if ($data) {\n return $data;\n }\n\n if (sceneObject.parent) {\n return getData(sceneObject.parent);\n }\n\n return EmptyDataNode;\n}\n\n/**\n * Will walk up the scene object graph to the closest $timeRange scene object\n */\nexport function getTimeRange(sceneObject: SceneObject): SceneTimeRangeLike {\n const { $timeRange } = sceneObject.state;\n if ($timeRange) {\n return $timeRange;\n }\n\n if (sceneObject.parent) {\n return getTimeRange(sceneObject.parent);\n }\n\n return DefaultTimeRange;\n}\n\n/**\n * Will walk up the scene object graph to the closest $editor scene object\n */\nexport function getSceneEditor(sceneObject: SceneObject): SceneEditor {\n const { $editor } = sceneObject.state;\n if ($editor) {\n return $editor;\n }\n\n if (sceneObject.parent) {\n return getSceneEditor(sceneObject.parent);\n }\n\n throw new Error('No editor found in scene tree');\n}\n\n/**\n * Will walk up the scene object graph to the closest $layout scene object\n */\nexport function getLayout(scene: SceneObject): SceneObject<SceneLayoutState> {\n if (scene.constructor.name === 'SceneFlexLayout' || scene.constructor.name === 'SceneGridLayout') {\n return scene as SceneObject<SceneLayoutState>;\n }\n\n if (scene.parent) {\n return getLayout(scene.parent);\n }\n\n throw new Error('No layout found in scene tree');\n}\n\n/**\n * Interpolates the given string using the current scene object as context. *\n */\nexport function interpolate(\n sceneObject: SceneObject,\n value: string | undefined | null,\n scopedVars?: ScopedVars,\n format?: string | CustomFormatterFn\n): string {\n
|
|
1
|
+
{"version":3,"file":"sceneGraph.js","sources":["../../../src/core/sceneGraph.ts"],"sourcesContent":["import { ScopedVars } from '@grafana/data';\nimport { DefaultTimeRange, EmptyDataNode, EmptyVariableSet } from '../variables/interpolation/defaults';\n\nimport { CustomFormatterFn, sceneInterpolator } from '../variables/interpolation/sceneInterpolator';\nimport { SceneVariables } from '../variables/types';\n\nimport { SceneDataState, SceneEditor, SceneLayoutState, SceneObject, SceneTimeRangeLike } from './types';\n\n/**\n * Get the closest node with variables\n */\nexport function getVariables(sceneObject: SceneObject): SceneVariables {\n if (sceneObject.state.$variables) {\n return sceneObject.state.$variables;\n }\n\n if (sceneObject.parent) {\n return getVariables(sceneObject.parent);\n }\n\n return EmptyVariableSet;\n}\n\n/**\n * Will walk up the scene object graph to the closest $data scene object\n */\nexport function getData(sceneObject: SceneObject): SceneObject<SceneDataState> {\n const { $data } = sceneObject.state;\n if ($data) {\n return $data;\n }\n\n if (sceneObject.parent) {\n return getData(sceneObject.parent);\n }\n\n return EmptyDataNode;\n}\n\n/**\n * Will walk up the scene object graph to the closest $timeRange scene object\n */\nexport function getTimeRange(sceneObject: SceneObject): SceneTimeRangeLike {\n const { $timeRange } = sceneObject.state;\n if ($timeRange) {\n return $timeRange;\n }\n\n if (sceneObject.parent) {\n return getTimeRange(sceneObject.parent);\n }\n\n return DefaultTimeRange;\n}\n\n/**\n * Will walk up the scene object graph to the closest $editor scene object\n */\nexport function getSceneEditor(sceneObject: SceneObject): SceneEditor {\n const { $editor } = sceneObject.state;\n if ($editor) {\n return $editor;\n }\n\n if (sceneObject.parent) {\n return getSceneEditor(sceneObject.parent);\n }\n\n throw new Error('No editor found in scene tree');\n}\n\n/**\n * Will walk up the scene object graph to the closest $layout scene object\n */\nexport function getLayout(scene: SceneObject): SceneObject<SceneLayoutState> {\n if (scene.constructor.name === 'SceneFlexLayout' || scene.constructor.name === 'SceneGridLayout') {\n return scene as SceneObject<SceneLayoutState>;\n }\n\n if (scene.parent) {\n return getLayout(scene.parent);\n }\n\n throw new Error('No layout found in scene tree');\n}\n\n/**\n * Interpolates the given string using the current scene object as context. *\n */\nexport function interpolate(\n sceneObject: SceneObject,\n value: string | undefined | null,\n scopedVars?: ScopedVars,\n format?: string | CustomFormatterFn\n): string {\n if (value === '' || value == null) {\n return '';\n }\n\n return sceneInterpolator(sceneObject, value, scopedVars, format);\n}\n\nexport const sceneGraph = {\n getVariables,\n getData,\n getTimeRange,\n getSceneEditor,\n getLayout,\n interpolate,\n};\n"],"names":[],"mappings":";;;AAWO,SAAS,aAAa,WAA0C,EAAA;AACrE,EAAI,IAAA,WAAA,CAAY,MAAM,UAAY,EAAA;AAChC,IAAA,OAAO,YAAY,KAAM,CAAA,UAAA,CAAA;AAAA,GAC3B;AAEA,EAAA,IAAI,YAAY,MAAQ,EAAA;AACtB,IAAO,OAAA,YAAA,CAAa,YAAY,MAAM,CAAA,CAAA;AAAA,GACxC;AAEA,EAAO,OAAA,gBAAA,CAAA;AACT,CAAA;AAKO,SAAS,QAAQ,WAAuD,EAAA;AAC7E,EAAM,MAAA,EAAE,KAAM,EAAA,GAAI,WAAY,CAAA,KAAA,CAAA;AAC9B,EAAA,IAAI,KAAO,EAAA;AACT,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AAEA,EAAA,IAAI,YAAY,MAAQ,EAAA;AACtB,IAAO,OAAA,OAAA,CAAQ,YAAY,MAAM,CAAA,CAAA;AAAA,GACnC;AAEA,EAAO,OAAA,aAAA,CAAA;AACT,CAAA;AAKO,SAAS,aAAa,WAA8C,EAAA;AACzE,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,WAAY,CAAA,KAAA,CAAA;AACnC,EAAA,IAAI,UAAY,EAAA;AACd,IAAO,OAAA,UAAA,CAAA;AAAA,GACT;AAEA,EAAA,IAAI,YAAY,MAAQ,EAAA;AACtB,IAAO,OAAA,YAAA,CAAa,YAAY,MAAM,CAAA,CAAA;AAAA,GACxC;AAEA,EAAO,OAAA,gBAAA,CAAA;AACT,CAAA;AAKO,SAAS,eAAe,WAAuC,EAAA;AACpE,EAAM,MAAA,EAAE,OAAQ,EAAA,GAAI,WAAY,CAAA,KAAA,CAAA;AAChC,EAAA,IAAI,OAAS,EAAA;AACX,IAAO,OAAA,OAAA,CAAA;AAAA,GACT;AAEA,EAAA,IAAI,YAAY,MAAQ,EAAA;AACtB,IAAO,OAAA,cAAA,CAAe,YAAY,MAAM,CAAA,CAAA;AAAA,GAC1C;AAEA,EAAM,MAAA,IAAI,MAAM,+BAA+B,CAAA,CAAA;AACjD,CAAA;AAKO,SAAS,UAAU,KAAmD,EAAA;AAC3E,EAAA,IAAI,MAAM,WAAY,CAAA,IAAA,KAAS,qBAAqB,KAAM,CAAA,WAAA,CAAY,SAAS,iBAAmB,EAAA;AAChG,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AAEA,EAAA,IAAI,MAAM,MAAQ,EAAA;AAChB,IAAO,OAAA,SAAA,CAAU,MAAM,MAAM,CAAA,CAAA;AAAA,GAC/B;AAEA,EAAM,MAAA,IAAI,MAAM,+BAA+B,CAAA,CAAA;AACjD,CAAA;AAKO,SAAS,WACd,CAAA,WAAA,EACA,KACA,EAAA,UAAA,EACA,MACQ,EAAA;AACR,EAAI,IAAA,KAAA,KAAU,EAAM,IAAA,KAAA,IAAS,IAAM,EAAA;AACjC,IAAO,OAAA,EAAA,CAAA;AAAA,GACT;AAEA,EAAA,OAAO,iBAAkB,CAAA,WAAA,EAAa,KAAO,EAAA,UAAA,EAAY,MAAM,CAAA,CAAA;AACjE,CAAA;AAEO,MAAM,UAAa,GAAA;AAAA,EACxB,YAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,cAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AACF;;;;"}
|
package/dist/esm/index.js
CHANGED
|
@@ -7,9 +7,9 @@ export { SceneDataTransformer } from './core/SceneDataTransformer.js';
|
|
|
7
7
|
export { SceneTimeRange } from './core/SceneTimeRange.js';
|
|
8
8
|
export { SceneQueryRunner } from './querying/SceneQueryRunner.js';
|
|
9
9
|
export { SceneVariableValueChangedEvent } from './variables/types.js';
|
|
10
|
+
export { VariableDependencyConfig } from './variables/VariableDependencyConfig.js';
|
|
10
11
|
export { FormatRegistryID, formatRegistry } from './variables/interpolation/formatRegistry.js';
|
|
11
12
|
import './variables/interpolation/ScopedVarsVariable.js';
|
|
12
|
-
import './variables/interpolation/defaults.js';
|
|
13
13
|
export { VariableValueSelectors } from './variables/components/VariableValueSelectors.js';
|
|
14
14
|
export { SceneVariableSet } from './variables/sets/SceneVariableSet.js';
|
|
15
15
|
export { ConstantVariable } from './variables/variants/ConstantVariable.js';
|
|
@@ -1,15 +1,11 @@
|
|
|
1
1
|
import { getSceneVariableForScopedVar } from './ScopedVarsVariable.js';
|
|
2
2
|
import { FormatRegistryID, formatRegistry } from './formatRegistry.js';
|
|
3
3
|
import { VARIABLE_REGEX } from '../constants.js';
|
|
4
|
-
import { EmptyVariableSet } from './defaults.js';
|
|
5
4
|
|
|
6
|
-
function sceneInterpolator(sceneObject, target,
|
|
5
|
+
function sceneInterpolator(sceneObject, target, scopedVars, format) {
|
|
7
6
|
if (!target) {
|
|
8
7
|
return target != null ? target : "";
|
|
9
8
|
}
|
|
10
|
-
if (getVariables(sceneObject) === EmptyVariableSet) {
|
|
11
|
-
return target;
|
|
12
|
-
}
|
|
13
9
|
VARIABLE_REGEX.lastIndex = 0;
|
|
14
10
|
return target.replace(VARIABLE_REGEX, (match, var1, var2, fmt2, var3, fieldPath, fmt3) => {
|
|
15
11
|
const variableName = var1 || var2 || var3;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sceneInterpolator.js","sources":["../../../../src/variables/interpolation/sceneInterpolator.ts"],"sourcesContent":["import { ScopedVars } from '@grafana/data';\nimport { VariableModel, VariableType } from '@grafana/schema';\n\nimport { SceneObject } from '../../core/types';\nimport {
|
|
1
|
+
{"version":3,"file":"sceneInterpolator.js","sources":["../../../../src/variables/interpolation/sceneInterpolator.ts"],"sourcesContent":["import { ScopedVars } from '@grafana/data';\nimport { VariableModel, VariableType } from '@grafana/schema';\n\nimport { SceneObject } from '../../core/types';\nimport { VariableValue } from '../types';\n\nimport { getSceneVariableForScopedVar } from './ScopedVarsVariable';\nimport { formatRegistry, FormatRegistryID, FormatVariable } from './formatRegistry';\nimport { VARIABLE_REGEX } from '../constants';\n\nexport type CustomFormatterFn = (\n value: unknown,\n legacyVariableModel: Partial<VariableModel>,\n legacyDefaultFormatter?: CustomFormatterFn\n) => string;\n\n/**\n * This function will try to parse and replace any variable expression found in the target string. The sceneObject will be used as the source of variables. It will\n * use the scene graph and walk up the parent tree until it finds the closest variable.\n *\n * ScopedVars should not really be needed much in the new scene architecture as they can be added to the local scene node instead of passed in interpolate function.\n * It is supported here for backward compatibility and some edge cases where adding scoped vars to local scene node is not practical.\n */\nexport function sceneInterpolator(\n sceneObject: SceneObject,\n target: string | undefined | null,\n scopedVars?: ScopedVars,\n format?: string | CustomFormatterFn\n): string {\n if (!target) {\n return target ?? '';\n }\n\n VARIABLE_REGEX.lastIndex = 0;\n\n return target.replace(VARIABLE_REGEX, (match, var1, var2, fmt2, var3, fieldPath, fmt3) => {\n const variableName = var1 || var2 || var3;\n const fmt = fmt2 || fmt3 || format;\n let variable: FormatVariable | undefined | null;\n\n if (scopedVars && scopedVars[variableName]) {\n variable = getSceneVariableForScopedVar(variableName, scopedVars[variableName]);\n } else {\n variable = lookupSceneVariable(variableName, sceneObject);\n }\n\n if (!variable) {\n return match;\n }\n\n return formatValue(variable, variable.getValue(fieldPath), fmt);\n });\n}\n\nfunction lookupSceneVariable(name: string, sceneObject: SceneObject): FormatVariable | null | undefined {\n const variables = sceneObject.state.$variables;\n if (!variables) {\n if (sceneObject.parent) {\n return lookupSceneVariable(name, sceneObject.parent);\n } else {\n return null;\n }\n }\n\n const found = variables.getByName(name);\n if (found) {\n return found;\n } else if (sceneObject.parent) {\n return lookupSceneVariable(name, sceneObject.parent);\n }\n\n return null;\n}\n\nfunction formatValue(\n variable: FormatVariable,\n value: VariableValue | undefined | null,\n formatNameOrFn: string | CustomFormatterFn\n): string {\n if (value === null || value === undefined) {\n return '';\n }\n\n // Special handling for custom values that should not be formatted / escaped\n // This is used by the custom allValue that usually contain wildcards and therefore should not be escaped\n if (typeof value === 'object' && 'isCustomValue' in value && formatNameOrFn !== FormatRegistryID.text) {\n return value.toString();\n }\n\n // if (isAdHoc(variable) && format !== FormatRegistryID.queryParam) {\n // return '';\n // }\n\n // if it's an object transform value to string\n if (!Array.isArray(value) && typeof value === 'object') {\n value = `${value}`;\n }\n\n if (typeof formatNameOrFn === 'function') {\n return formatNameOrFn(value, {\n name: variable.state.name,\n type: variable.state.type as VariableType,\n });\n }\n\n let args: string[] = [];\n\n if (!formatNameOrFn) {\n formatNameOrFn = FormatRegistryID.glob;\n } else {\n // some formats have arguments that come after ':' character\n args = formatNameOrFn.split(':');\n if (args.length > 1) {\n formatNameOrFn = args[0];\n args = args.slice(1);\n } else {\n args = [];\n }\n }\n\n let formatter = formatRegistry.getIfExists(formatNameOrFn);\n\n if (!formatter) {\n console.error(`Variable format ${formatNameOrFn} not found. Using glob format as fallback.`);\n formatter = formatRegistry.get(FormatRegistryID.glob);\n }\n\n return formatter.formatter(value, args, variable);\n}\n"],"names":[],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -636,6 +636,12 @@ interface EmbeddedSceneState extends SceneObjectStatePlain {
|
|
|
636
636
|
declare class EmbeddedScene extends SceneObjectBase<EmbeddedSceneState> {
|
|
637
637
|
static Component: typeof EmbeddedSceneRenderer;
|
|
638
638
|
private urlSyncManager?;
|
|
639
|
+
/**
|
|
640
|
+
* initUrlSync should be called before the scene is rendered to ensure that objects are in sync
|
|
641
|
+
* before they get activated. This saves some unnecessary re-renders and makes sure variables
|
|
642
|
+
* queries are issued as needed.
|
|
643
|
+
*/
|
|
644
|
+
initUrlSync(): void;
|
|
639
645
|
activate(): void;
|
|
640
646
|
deactivate(): void;
|
|
641
647
|
}
|
|
@@ -656,7 +662,7 @@ interface VizPanelState<TOptions = {}, TFieldConfig = {}> extends SceneLayoutChi
|
|
|
656
662
|
}
|
|
657
663
|
declare class VizPanel<TOptions = {}, TFieldConfig = {}> extends SceneObjectBase<VizPanelState<TOptions, TFieldConfig>> {
|
|
658
664
|
static Component: typeof VizPanelRenderer;
|
|
659
|
-
|
|
665
|
+
protected _variableDependency: VariableDependencyConfig<VizPanelState<TOptions, TFieldConfig>>;
|
|
660
666
|
private _plugin?;
|
|
661
667
|
constructor(state: Partial<VizPanelState<TOptions, TFieldConfig>>);
|
|
662
668
|
activate(): void;
|
|
@@ -667,7 +673,6 @@ declare class VizPanel<TOptions = {}, TFieldConfig = {}> extends SceneObjectBase
|
|
|
667
673
|
onOptionsChange: (options: TOptions) => void;
|
|
668
674
|
onFieldConfigChange: (fieldConfig: FieldConfigSource<TFieldConfig>) => void;
|
|
669
675
|
}
|
|
670
|
-
declare function VizPanelEditor({ model }: SceneComponentProps<VizPanel>): JSX.Element;
|
|
671
676
|
|
|
672
677
|
interface NestedSceneState extends SceneLayoutChildState {
|
|
673
678
|
title: string;
|
|
@@ -799,4 +804,4 @@ declare class SceneGridLayout extends SceneObjectBase<SceneGridLayoutState> {
|
|
|
799
804
|
}
|
|
800
805
|
declare function SceneGridLayoutRenderer({ model }: SceneComponentProps<SceneGridLayout>): JSX.Element;
|
|
801
806
|
|
|
802
|
-
export { ConstantVariable, CustomFormatterFn, CustomVariable, DataSourceVariable, DeepPartial, EmbeddedScene, EmbeddedSceneState, FormatRegistryID, FormatVariable, NestedScene, QueryRunnerState, QueryVariable, SceneByFrameRepeater, SceneCanvasText, SceneComponent, SceneComponentProps, SceneControlsSpacer, SceneDataNode, SceneDataState, SceneDataTransformer, SceneEditor, SceneEditorState, SceneFlexLayout, SceneGridLayout, SceneGridRow, SceneLayout, SceneLayoutChild, SceneLayoutChildOptions, SceneLayoutChildState, SceneLayoutState, SceneObject, SceneObjectBase, SceneObjectRef, SceneObjectState, SceneObjectStateChangedEvent, SceneObjectStateChangedPayload, SceneObjectStatePlain, SceneObjectUrlSyncConfig, SceneObjectUrlSyncHandler, SceneObjectUrlValue, SceneObjectUrlValues, SceneObjectWithUrlSync, SceneQueryRunner, SceneTimePicker, SceneTimeRange, SceneTimeRangeLike, SceneTimeRangeState, SceneToolbarButton, SceneToolbarInput, SceneVariable, SceneVariableDependencyConfigLike, SceneVariableSet, SceneVariableSetState, SceneVariableState, SceneVariableValueChangedEvent, SceneVariables, TestVariable, UrlSyncManager, ValidateAndUpdateResult, VariableValue, VariableValueCustom, VariableValueOption, VariableValueSelectors, VariableValueSingle, VizPanel, VizPanelState, formatRegistry, isSceneObject, sceneGraph };
|
|
807
|
+
export { ConstantVariable, CustomFormatterFn, CustomVariable, DataSourceVariable, DeepPartial, EmbeddedScene, EmbeddedSceneState, FormatRegistryID, FormatVariable, NestedScene, QueryRunnerState, QueryVariable, SceneByFrameRepeater, SceneCanvasText, SceneComponent, SceneComponentProps, SceneControlsSpacer, SceneDataNode, SceneDataState, SceneDataTransformer, SceneEditor, SceneEditorState, SceneFlexLayout, SceneGridLayout, SceneGridRow, SceneLayout, SceneLayoutChild, SceneLayoutChildOptions, SceneLayoutChildState, SceneLayoutState, SceneObject, SceneObjectBase, SceneObjectRef, SceneObjectState, SceneObjectStateChangedEvent, SceneObjectStateChangedPayload, SceneObjectStatePlain, SceneObjectUrlSyncConfig, SceneObjectUrlSyncHandler, SceneObjectUrlValue, SceneObjectUrlValues, SceneObjectWithUrlSync, SceneQueryRunner, SceneTimePicker, SceneTimeRange, SceneTimeRangeLike, SceneTimeRangeState, SceneToolbarButton, SceneToolbarInput, SceneVariable, SceneVariableDependencyConfigLike, SceneVariableSet, SceneVariableSetState, SceneVariableState, SceneVariableValueChangedEvent, SceneVariables, TestVariable, UrlSyncManager, ValidateAndUpdateResult, VariableDependencyConfig, VariableValue, VariableValueCustom, VariableValueOption, VariableValueSelectors, VariableValueSingle, VizPanel, VizPanelState, formatRegistry, isSceneObject, sceneGraph };
|
package/dist/index.js
CHANGED
|
@@ -874,13 +874,10 @@ function formatQueryParameter(name, value) {
|
|
|
874
874
|
return `var-${name}=${encodeURIComponentStrict(value)}`;
|
|
875
875
|
}
|
|
876
876
|
|
|
877
|
-
function sceneInterpolator(sceneObject, target,
|
|
877
|
+
function sceneInterpolator(sceneObject, target, scopedVars, format) {
|
|
878
878
|
if (!target) {
|
|
879
879
|
return target != null ? target : "";
|
|
880
880
|
}
|
|
881
|
-
if (getVariables(sceneObject) === EmptyVariableSet) {
|
|
882
|
-
return target;
|
|
883
|
-
}
|
|
884
881
|
VARIABLE_REGEX.lastIndex = 0;
|
|
885
882
|
return target.replace(VARIABLE_REGEX, (match, var1, var2, fmt2, var3, fieldPath, fmt3) => {
|
|
886
883
|
const variableName = var1 || var2 || var3;
|
|
@@ -999,10 +996,10 @@ function getLayout(scene) {
|
|
|
999
996
|
throw new Error("No layout found in scene tree");
|
|
1000
997
|
}
|
|
1001
998
|
function interpolate(sceneObject, value, scopedVars, format) {
|
|
1002
|
-
if (
|
|
1003
|
-
return
|
|
999
|
+
if (value === "" || value == null) {
|
|
1000
|
+
return "";
|
|
1004
1001
|
}
|
|
1005
|
-
return sceneInterpolator(sceneObject, value,
|
|
1002
|
+
return sceneInterpolator(sceneObject, value, scopedVars, format);
|
|
1006
1003
|
}
|
|
1007
1004
|
const sceneGraph = {
|
|
1008
1005
|
getVariables,
|
|
@@ -2375,14 +2372,18 @@ function isUrlValueEqual(currentUrlValue, newUrlValue) {
|
|
|
2375
2372
|
}
|
|
2376
2373
|
|
|
2377
2374
|
class EmbeddedScene extends SceneObjectBase {
|
|
2378
|
-
|
|
2379
|
-
super.activate();
|
|
2375
|
+
initUrlSync() {
|
|
2380
2376
|
this.urlSyncManager = new UrlSyncManager(this);
|
|
2381
2377
|
this.urlSyncManager.initSync();
|
|
2382
2378
|
}
|
|
2379
|
+
activate() {
|
|
2380
|
+
super.activate();
|
|
2381
|
+
}
|
|
2383
2382
|
deactivate() {
|
|
2384
2383
|
super.deactivate();
|
|
2385
|
-
this.urlSyncManager
|
|
2384
|
+
if (this.urlSyncManager) {
|
|
2385
|
+
this.urlSyncManager.cleanUp();
|
|
2386
|
+
}
|
|
2386
2387
|
}
|
|
2387
2388
|
}
|
|
2388
2389
|
EmbeddedScene.Component = EmbeddedSceneRenderer;
|
|
@@ -2526,6 +2527,9 @@ class VizPanel extends SceneObjectBase {
|
|
|
2526
2527
|
title: "Title",
|
|
2527
2528
|
pluginId: "timeseries"
|
|
2528
2529
|
}, state));
|
|
2530
|
+
this._variableDependency = new VariableDependencyConfig(this, {
|
|
2531
|
+
statePaths: ["title", "options", "fieldConfig"]
|
|
2532
|
+
});
|
|
2529
2533
|
this.onChangeTimeRange = (timeRange) => {
|
|
2530
2534
|
const sceneTimeRange = sceneGraph.getTimeRange(this);
|
|
2531
2535
|
sceneTimeRange.onTimeRangeChange({
|
|
@@ -2586,16 +2590,6 @@ class VizPanel extends SceneObjectBase {
|
|
|
2586
2590
|
}
|
|
2587
2591
|
}
|
|
2588
2592
|
VizPanel.Component = VizPanelRenderer;
|
|
2589
|
-
VizPanel.Editor = VizPanelEditor;
|
|
2590
|
-
function VizPanelEditor({ model }) {
|
|
2591
|
-
const { title } = model.useState();
|
|
2592
|
-
return /* @__PURE__ */ React__default["default"].createElement(ui.Field, {
|
|
2593
|
-
label: "Title"
|
|
2594
|
-
}, /* @__PURE__ */ React__default["default"].createElement(ui.Input, {
|
|
2595
|
-
defaultValue: title,
|
|
2596
|
-
onBlur: (evt) => model.setState({ title: evt.currentTarget.value })
|
|
2597
|
-
}));
|
|
2598
|
-
}
|
|
2599
2593
|
|
|
2600
2594
|
var __defProp$2 = Object.defineProperty;
|
|
2601
2595
|
var __defProps$2 = Object.defineProperties;
|
|
@@ -3344,6 +3338,7 @@ exports.SceneVariableSet = SceneVariableSet;
|
|
|
3344
3338
|
exports.SceneVariableValueChangedEvent = SceneVariableValueChangedEvent;
|
|
3345
3339
|
exports.TestVariable = TestVariable;
|
|
3346
3340
|
exports.UrlSyncManager = UrlSyncManager;
|
|
3341
|
+
exports.VariableDependencyConfig = VariableDependencyConfig;
|
|
3347
3342
|
exports.VariableValueSelectors = VariableValueSelectors;
|
|
3348
3343
|
exports.VizPanel = VizPanel;
|
|
3349
3344
|
exports.formatRegistry = formatRegistry;
|