@grafana/scenes 1.14.0 → 1.15.0

package/CHANGELOG.md

@@ -1,3 +1,25 @@
+# v1.15.0 (Tue Oct 10 2023)
+
+#### 🚀 Enhancement
+
+- Markup: element data keys changes [#403](https://github.com/grafana/scenes/pull/403) ([@torkelo](https://github.com/torkelo))
+- QueryVariable: Fix sort default value [#398](https://github.com/grafana/scenes/pull/398) ([@torkelo](https://github.com/torkelo))
+- QueryVariable: Support for queries that contain "$__searchFilter" [#395](https://github.com/grafana/scenes/pull/395) ([@torkelo](https://github.com/torkelo))
+- TextBoxVariable: Fixes and make it auto size [#394](https://github.com/grafana/scenes/pull/394) ([@torkelo](https://github.com/torkelo))
+
+#### 🐛 Bug Fix
+
+- VizPanel: Add support for a custom migration handler [#396](https://github.com/grafana/scenes/pull/396) ([@torkelo](https://github.com/torkelo))
+- SceneAppPage: Fix enrichDataRequest call for drilldown pages [#402](https://github.com/grafana/scenes/pull/402) ([@torkelo](https://github.com/torkelo))
+- ActWhenVariableChanged: Add behavior to onChange callback [#393](https://github.com/grafana/scenes/pull/393) ([@torkelo](https://github.com/torkelo))
+- Variables: Updates the demo scene [#388](https://github.com/grafana/scenes/pull/388) ([@torkelo](https://github.com/torkelo))
+
+#### Authors: 1
+
+- Torkel Ödegaard ([@torkelo](https://github.com/torkelo))
+
+---
+
 # v1.14.0 (Wed Oct 04 2023)
 
 #### 🚀 Enhancement

package/dist/esm/behaviors/ActWhenVariableChanged.js

@@ -18,7 +18,7 @@ class ActWhenVariableChanged extends SceneObjectBase {
           this._runningEffect();
           this._runningEffect = null;
         }
-        const cancellation = effect(variable);
+        const cancellation = effect(variable, this);
         if (cancellation) {
           this._runningEffect = cancellation;
         }

package/dist/esm/behaviors/ActWhenVariableChanged.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActWhenVariableChanged.js","sources":["../../../src/behaviors/ActWhenVariableChanged.ts"],"sourcesContent":["import { SceneObjectBase } from '../core/SceneObjectBase';\nimport { SceneObjectState } from '../core/types';\nimport { SceneVariable } from '../variables/types';\nimport { VariableDependencyConfig } from '../variables/VariableDependencyConfig';\n\ninterface ActWhenVariableChangedState extends SceneObjectState {\n  // The name of the variable to subscribe to changes to.\n  variableName: string;\n  // The handler to run when a variable changes. Return a cancellation function if you do anything async like issue a query.\n  onChange: (variable: SceneVariable) => (() => void) | void;\n}\n\n/**\n * This behavior will run an effect function when specified variables change\n */\n\nexport class ActWhenVariableChanged extends SceneObjectBase<ActWhenVariableChangedState> {\n  private _runningEffect: null | (() => void) = null;\n\n  protected _variableDependency = new VariableDependencyConfig(this, {\n    variableNames: [this.state.variableName],\n    onVariableUpdatesCompleted: this._onVariableChanged.bind(this),\n  });\n\n  private _onVariableChanged(changedVariables: Set<SceneVariable>): void {\n    const effect = this.state.onChange;\n\n    for (const variable of changedVariables) {\n      if (this.state.variableName === variable.state.name) {\n        if (this._runningEffect) {\n          this._runningEffect();\n          this._runningEffect = null;\n        }\n\n        const cancellation = effect(variable);\n        if (cancellation) {\n          this._runningEffect = cancellation;\n        }\n      }\n    }\n  }\n}\n"],"names":[],"mappings":";;;AAgBO,MAAM,+BAA+B,eAA6C,CAAA;AAAA,EAAlF,WAAA,GAAA;AAAA,IAAA,KAAA,CAAA,GAAA,SAAA,CAAA,CAAA;AACL,IAAA,IAAA,CAAQ,cAAsC,GAAA,IAAA,CAAA;AAE9C,IAAU,IAAA,CAAA,mBAAA,GAAsB,IAAI,wBAAA,CAAyB,IAAM,EAAA;AAAA,MACjE,aAAe,EAAA,CAAC,IAAK,CAAA,KAAA,CAAM,YAAY,CAAA;AAAA,MACvC,0BAA4B,EAAA,IAAA,CAAK,kBAAmB,CAAA,IAAA,CAAK,IAAI,CAAA;AAAA,KAC9D,CAAA,CAAA;AAAA,GAAA;AAAA,EAEO,mBAAmB,gBAA4C,EAAA;AACrE,IAAM,MAAA,MAAA,GAAS,KAAK,KAAM,CAAA,QAAA,CAAA;AAE1B,IAAA,KAAA,MAAW,YAAY,gBAAkB,EAAA;AACvC,MAAA,IAAI,IAAK,CAAA,KAAA,CAAM,YAAiB,KAAA,QAAA,CAAS,MAAM,IAAM,EAAA;AACnD,QAAA,IAAI,KAAK,cAAgB,EAAA;AACvB,UAAA,IAAA,CAAK,cAAe,EAAA,CAAA;AACpB,UAAA,IAAA,CAAK,cAAiB,GAAA,IAAA,CAAA;AAAA,SACxB;AAEA,QAAM,MAAA,YAAA,GAAe,OAAO,QAAQ,CAAA,CAAA;AACpC,QAAA,IAAI,YAAc,EAAA;AAChB,UAAA,IAAA,CAAK,cAAiB,GAAA,YAAA,CAAA;AAAA,SACxB;AAAA,OACF;AAAA,KACF;AAAA,GACF;AACF;;;;"}
+{"version":3,"file":"ActWhenVariableChanged.js","sources":["../../../src/behaviors/ActWhenVariableChanged.ts"],"sourcesContent":["import { SceneObjectBase } from '../core/SceneObjectBase';\nimport { SceneObjectState } from '../core/types';\nimport { SceneVariable } from '../variables/types';\nimport { VariableDependencyConfig } from '../variables/VariableDependencyConfig';\n\ninterface ActWhenVariableChangedState extends SceneObjectState {\n  // The name of the variable to subscribe to changes to.\n  variableName: string;\n  /**\n   * The handler to run when a variable changes.\n   * @param variable The variable that changed\n   * @param behavior The behavior instance where this onChange handler added to.\n   *  You can use this to access the parent SceneObject where this behavior exists.\n   *  You can also use this with the sceneGraph util functions to find objects from this scene graph location.\n   * @returns Return a cancellation function if you do anything async like issue a query.\n   */\n  onChange: (variable: SceneVariable, behavior: ActWhenVariableChanged) => (() => void) | void;\n}\n\n/**\n * This behavior will run an effect function when specified variables change\n */\n\nexport class ActWhenVariableChanged extends SceneObjectBase<ActWhenVariableChangedState> {\n  private _runningEffect: null | (() => void) = null;\n\n  protected _variableDependency = new VariableDependencyConfig(this, {\n    variableNames: [this.state.variableName],\n    onVariableUpdatesCompleted: this._onVariableChanged.bind(this),\n  });\n\n  private _onVariableChanged(changedVariables: Set<SceneVariable>): void {\n    const effect = this.state.onChange;\n\n    for (const variable of changedVariables) {\n      if (this.state.variableName === variable.state.name) {\n        if (this._runningEffect) {\n          this._runningEffect();\n          this._runningEffect = null;\n        }\n\n        const cancellation = effect(variable, this);\n        if (cancellation) {\n          this._runningEffect = cancellation;\n        }\n      }\n    }\n  }\n}\n"],"names":[],"mappings":";;;AAuBO,MAAM,+BAA+B,eAA6C,CAAA;AAAA,EAAlF,WAAA,GAAA;AAAA,IAAA,KAAA,CAAA,GAAA,SAAA,CAAA,CAAA;AACL,IAAA,IAAA,CAAQ,cAAsC,GAAA,IAAA,CAAA;AAE9C,IAAU,IAAA,CAAA,mBAAA,GAAsB,IAAI,wBAAA,CAAyB,IAAM,EAAA;AAAA,MACjE,aAAe,EAAA,CAAC,IAAK,CAAA,KAAA,CAAM,YAAY,CAAA;AAAA,MACvC,0BAA4B,EAAA,IAAA,CAAK,kBAAmB,CAAA,IAAA,CAAK,IAAI,CAAA;AAAA,KAC9D,CAAA,CAAA;AAAA,GAAA;AAAA,EAEO,mBAAmB,gBAA4C,EAAA;AACrE,IAAM,MAAA,MAAA,GAAS,KAAK,KAAM,CAAA,QAAA,CAAA;AAE1B,IAAA,KAAA,MAAW,YAAY,gBAAkB,EAAA;AACvC,MAAA,IAAI,IAAK,CAAA,KAAA,CAAM,YAAiB,KAAA,QAAA,CAAS,MAAM,IAAM,EAAA;AACnD,QAAA,IAAI,KAAK,cAAgB,EAAA;AACvB,UAAA,IAAA,CAAK,cAAe,EAAA,CAAA;AACpB,UAAA,IAAA,CAAK,cAAiB,GAAA,IAAA,CAAA;AAAA,SACxB;AAEA,QAAM,MAAA,YAAA,GAAe,MAAO,CAAA,QAAA,EAAU,IAAI,CAAA,CAAA;AAC1C,QAAA,IAAI,YAAc,EAAA;AAChB,UAAA,IAAA,CAAK,cAAiB,GAAA,YAAA,CAAA;AAAA,SACxB;AAAA,OACF;AAAA,KACF;AAAA,GACF;AACF;;;;"}

package/dist/esm/components/SceneApp/SceneAppPage.js

@@ -44,6 +44,9 @@ class SceneAppPage extends SceneObjectBase {
     return page;
   }
   enrichDataRequest(source) {
+    if (this.state.getParentPage) {
+      return this.state.getParentPage().enrichDataRequest(source);
+    }
     if (!this.parent) {
       return null;
     }

package/dist/esm/components/SceneApp/SceneAppPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"SceneAppPage.js","sources":["../../../../src/components/SceneApp/SceneAppPage.tsx"],"sourcesContent":["import React from 'react';\nimport { Route, RouteComponentProps, Switch } from 'react-router-dom';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { SceneComponentProps, SceneObject, isDataRequestEnricher } from '../../core/types';\nimport { getUrlSyncManager } from '../../services/UrlSyncManager';\nimport { EmbeddedScene } from '../EmbeddedScene';\nimport { SceneFlexItem, SceneFlexLayout } from '../layout/SceneFlexLayout';\nimport { SceneReactObject } from '../SceneReactObject';\nimport { SceneAppDrilldownViewRender, SceneAppPageView } from './SceneAppPageView';\nimport { SceneAppDrilldownView, SceneAppPageLike, SceneAppPageState, SceneRouteMatch } from './types';\nimport { renderSceneComponentWithRouteProps } from './utils';\n\n/**\n * Responsible for page's drilldown & tabs routing\n */\nexport class SceneAppPage extends SceneObjectBase<SceneAppPageState> implements SceneAppPageLike {\n  public static Component = SceneAppPageRenderer;\n  private _sceneCache = new Map<string, EmbeddedScene>();\n  private _drilldownCache = new Map<string, SceneAppPageLike>();\n\n  public constructor(state: SceneAppPageState) {\n    super(state);\n\n    this.addActivationHandler(() => {\n      return () => getUrlSyncManager().cleanUp(this);\n    });\n  }\n\n  public initializeScene(scene: EmbeddedScene) {\n    this.setState({ initializedScene: scene });\n    getUrlSyncManager().initSync(this);\n  }\n\n  public getScene(routeMatch: SceneRouteMatch): EmbeddedScene {\n    let scene = this._sceneCache.get(routeMatch.url);\n\n    if (scene) {\n      return scene;\n    }\n\n    if (!this.state.getScene) {\n      throw new Error('Missing getScene on SceneAppPage ' + this.state.title);\n    }\n\n    scene = this.state.getScene(routeMatch);\n    this._sceneCache.set(routeMatch.url, scene);\n\n    return scene;\n  }\n\n  public getDrilldownPage(drilldown: SceneAppDrilldownView, routeMatch: SceneRouteMatch<{}>): SceneAppPageLike {\n    let page = this._drilldownCache.get(routeMatch!.url);\n    if (page) {\n      return page;\n    }\n\n    page = drilldown.getPage(routeMatch, this);\n    this._drilldownCache.set(routeMatch!.url, page);\n\n    return page;\n  }\n\n  public enrichDataRequest(source: SceneObject) {\n    if (!this.parent) {\n      return null;\n    }\n\n    const root = this.getRoot();\n\n    if (isDataRequestEnricher(root)) {\n      return root.enrichDataRequest(source);\n    }\n\n    return null;\n  }\n}\n\nexport interface SceneAppPageRendererProps extends SceneComponentProps<SceneAppPage> {\n  routeProps: RouteComponentProps;\n}\n\nfunction SceneAppPageRenderer({ model, routeProps }: SceneAppPageRendererProps) {\n  const { tabs, drilldowns } = model.useState();\n  const routes: React.ReactNode[] = [];\n\n  if (tabs && tabs.length > 0) {\n    for (let tabIndex = 0; tabIndex < tabs.length; tabIndex++) {\n      const tab = tabs[tabIndex];\n\n      // Add first tab as a default route, this makes it possible for the first tab to render with the url of the parent page\n      if (tabIndex === 0) {\n        routes.push(\n          <Route\n            exact={true}\n            key={model.state.url}\n            path={model.state.routePath ?? model.state.url}\n            render={(props) => renderSceneComponentWithRouteProps(tab, props)}\n          ></Route>\n        );\n      }\n\n      routes.push(\n        <Route\n          exact={true}\n          key={tab.state.url}\n          path={tab.state.routePath ?? tab.state.url}\n          render={(props) => renderSceneComponentWithRouteProps(tab, props)}\n        ></Route>\n      );\n\n      if (tab.state.drilldowns) {\n        for (const drilldown of tab.state.drilldowns) {\n          routes.push(\n            <Route\n              exact={false}\n              key={drilldown.routePath}\n              path={drilldown.routePath}\n              render={(props) => <SceneAppDrilldownViewRender drilldown={drilldown} parent={tab} routeProps={props} />}\n            ></Route>\n          );\n        }\n      }\n    }\n  }\n\n  if (drilldowns) {\n    for (const drilldown of drilldowns) {\n      routes.push(\n        <Route\n          key={drilldown.routePath}\n          exact={false}\n          path={drilldown.routePath}\n          render={(props) => <SceneAppDrilldownViewRender drilldown={drilldown} parent={model} routeProps={props} />}\n        ></Route>\n      );\n    }\n  }\n\n  if (!tabs && isCurrentPageRouteMatch(model, routeProps.match)) {\n    return <SceneAppPageView page={model} routeProps={routeProps} />;\n  }\n\n  routes.push(getFallbackRoute(model, routeProps));\n\n  return <Switch>{routes}</Switch>;\n}\n\nfunction getFallbackRoute(page: SceneAppPage, routeProps: RouteComponentProps) {\n  return (\n    <Route\n      key={'fallback route'}\n      render={(props) => {\n        const fallbackPage = page.state.getFallbackPage?.() ?? getDefaultFallbackPage();\n        return <SceneAppPageView page={fallbackPage} routeProps={routeProps} />;\n      }}\n    ></Route>\n  );\n}\n\nfunction isCurrentPageRouteMatch(page: SceneAppPage, match: SceneRouteMatch) {\n  if (!match.isExact) {\n    return false;\n  }\n\n  // current page matches the route url\n  if (match.url === page.state.url) {\n    return true;\n  }\n\n  // check if we are a tab and the first tab, then we should also render on the parent url\n  if (\n    page.parent instanceof SceneAppPage &&\n    page.parent.state.tabs![0] === page &&\n    page.parent.state.url === match.url\n  ) {\n    return true;\n  }\n\n  return false;\n}\n\nfunction getDefaultFallbackPage() {\n  return new SceneAppPage({\n    url: '',\n    title: 'Not found',\n    subTitle: 'The url did not match any page',\n    getScene: () => {\n      return new EmbeddedScene({\n        body: new SceneFlexLayout({\n          direction: 'column',\n          children: [\n            new SceneFlexItem({\n              body: new SceneReactObject({\n                component: () => {\n                  return (\n                    <div data-testid=\"default-fallback-content\">\n                      If you found your way here using a link then there might be a bug in this application.\n                    </div>\n                  );\n                },\n              }),\n            }),\n          ],\n        }),\n      });\n    },\n  });\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAeO,MAAM,qBAAqB,eAA+D,CAAA;AAAA,EAKxF,YAAY,KAA0B,EAAA;AAC3C,IAAA,KAAA,CAAM,KAAK,CAAA,CAAA;AAJb,IAAQ,IAAA,CAAA,WAAA,uBAAkB,GAA2B,EAAA,CAAA;AACrD,IAAQ,IAAA,CAAA,eAAA,uBAAsB,GAA8B,EAAA,CAAA;AAK1D,IAAA,IAAA,CAAK,qBAAqB,MAAM;AAC9B,MAAA,OAAO,MAAM,iBAAA,EAAoB,CAAA,OAAA,CAAQ,IAAI,CAAA,CAAA;AAAA,KAC9C,CAAA,CAAA;AAAA,GACH;AAAA,EAEO,gBAAgB,KAAsB,EAAA;AAC3C,IAAA,IAAA,CAAK,QAAS,CAAA,EAAE,gBAAkB,EAAA,KAAA,EAAO,CAAA,CAAA;AACzC,IAAkB,iBAAA,EAAA,CAAE,SAAS,IAAI,CAAA,CAAA;AAAA,GACnC;AAAA,EAEO,SAAS,UAA4C,EAAA;AAC1D,IAAA,IAAI,KAAQ,GAAA,IAAA,CAAK,WAAY,CAAA,GAAA,CAAI,WAAW,GAAG,CAAA,CAAA;AAE/C,IAAA,IAAI,KAAO,EAAA;AACT,MAAO,OAAA,KAAA,CAAA;AAAA,KACT;AAEA,IAAI,IAAA,CAAC,IAAK,CAAA,KAAA,CAAM,QAAU,EAAA;AACxB,MAAA,MAAM,IAAI,KAAA,CAAM,mCAAsC,GAAA,IAAA,CAAK,MAAM,KAAK,CAAA,CAAA;AAAA,KACxE;AAEA,IAAQ,KAAA,GAAA,IAAA,CAAK,KAAM,CAAA,QAAA,CAAS,UAAU,CAAA,CAAA;AACtC,IAAA,IAAA,CAAK,WAAY,CAAA,GAAA,CAAI,UAAW,CAAA,GAAA,EAAK,KAAK,CAAA,CAAA;AAE1C,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AAAA,EAEO,gBAAA,CAAiB,WAAkC,UAAmD,EAAA;AAC3G,IAAA,IAAI,IAAO,GAAA,IAAA,CAAK,eAAgB,CAAA,GAAA,CAAI,WAAY,GAAG,CAAA,CAAA;AACnD,IAAA,IAAI,IAAM,EAAA;AACR,MAAO,OAAA,IAAA,CAAA;AAAA,KACT;AAEA,IAAO,IAAA,GAAA,SAAA,CAAU,OAAQ,CAAA,UAAA,EAAY,IAAI,CAAA,CAAA;AACzC,IAAA,IAAA,CAAK,eAAgB,CAAA,GAAA,CAAI,UAAY,CAAA,GAAA,EAAK,IAAI,CAAA,CAAA;AAE9C,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAAA,EAEO,kBAAkB,MAAqB,EAAA;AAC5C,IAAI,IAAA,CAAC,KAAK,MAAQ,EAAA;AAChB,MAAO,OAAA,IAAA,CAAA;AAAA,KACT;AAEA,IAAM,MAAA,IAAA,GAAO,KAAK,OAAQ,EAAA,CAAA;AAE1B,IAAI,IAAA,qBAAA,CAAsB,IAAI,CAAG,EAAA;AAC/B,MAAO,OAAA,IAAA,CAAK,kBAAkB,MAAM,CAAA,CAAA;AAAA,KACtC;AAEA,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AACF,CAAA;AA5Da,YAAA,CACG,SAAY,GAAA,oBAAA,CAAA;AAiE5B,SAAS,oBAAqB,CAAA,EAAE,KAAO,EAAA,UAAA,EAAyC,EAAA;AAjFhF,EAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AAkFE,EAAA,MAAM,EAAE,IAAA,EAAM,UAAW,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AAC5C,EAAA,MAAM,SAA4B,EAAC,CAAA;AAEnC,EAAI,IAAA,IAAA,IAAQ,IAAK,CAAA,MAAA,GAAS,CAAG,EAAA;AAC3B,IAAA,KAAA,IAAS,QAAW,GAAA,CAAA,EAAG,QAAW,GAAA,IAAA,CAAK,QAAQ,QAAY,EAAA,EAAA;AACzD,MAAA,MAAM,MAAM,IAAK,CAAA,QAAA,CAAA,CAAA;AAGjB,MAAA,IAAI,aAAa,CAAG,EAAA;AAClB,QAAO,MAAA,CAAA,IAAA;AAAA,0BACJ,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,YACC,KAAO,EAAA,IAAA;AAAA,YACP,GAAA,EAAK,MAAM,KAAM,CAAA,GAAA;AAAA,YACjB,OAAM,EAAM,GAAA,KAAA,CAAA,KAAA,CAAM,SAAZ,KAAA,IAAA,GAAA,EAAA,GAAyB,MAAM,KAAM,CAAA,GAAA;AAAA,YAC3C,MAAQ,EAAA,CAAC,KAAU,KAAA,kCAAA,CAAmC,KAAK,KAAK,CAAA;AAAA,WACjE,CAAA;AAAA,SACH,CAAA;AAAA,OACF;AAEA,MAAO,MAAA,CAAA,IAAA;AAAA,wBACJ,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,UACC,KAAO,EAAA,IAAA;AAAA,UACP,GAAA,EAAK,IAAI,KAAM,CAAA,GAAA;AAAA,UACf,OAAM,EAAI,GAAA,GAAA,CAAA,KAAA,CAAM,SAAV,KAAA,IAAA,GAAA,EAAA,GAAuB,IAAI,KAAM,CAAA,GAAA;AAAA,UACvC,MAAQ,EAAA,CAAC,KAAU,KAAA,kCAAA,CAAmC,KAAK,KAAK,CAAA;AAAA,SACjE,CAAA;AAAA,OACH,CAAA;AAEA,MAAI,IAAA,GAAA,CAAI,MAAM,UAAY,EAAA;AACxB,QAAW,KAAA,MAAA,SAAA,IAAa,GAAI,CAAA,KAAA,CAAM,UAAY,EAAA;AAC5C,UAAO,MAAA,CAAA,IAAA;AAAA,4BACJ,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,cACC,KAAO,EAAA,KAAA;AAAA,cACP,KAAK,SAAU,CAAA,SAAA;AAAA,cACf,MAAM,SAAU,CAAA,SAAA;AAAA,cAChB,MAAA,EAAQ,CAAC,KAAA,qBAAW,KAAA,CAAA,aAAA,CAAA,2BAAA,EAAA;AAAA,gBAA4B,SAAA;AAAA,gBAAsB,MAAQ,EAAA,GAAA;AAAA,gBAAK,UAAY,EAAA,KAAA;AAAA,eAAO,CAAA;AAAA,aACvG,CAAA;AAAA,WACH,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,GACF;AAEA,EAAA,IAAI,UAAY,EAAA;AACd,IAAA,KAAA,MAAW,aAAa,UAAY,EAAA;AAClC,MAAO,MAAA,CAAA,IAAA;AAAA,wBACJ,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,UACC,KAAK,SAAU,CAAA,SAAA;AAAA,UACf,KAAO,EAAA,KAAA;AAAA,UACP,MAAM,SAAU,CAAA,SAAA;AAAA,UAChB,MAAA,EAAQ,CAAC,KAAA,qBAAW,KAAA,CAAA,aAAA,CAAA,2BAAA,EAAA;AAAA,YAA4B,SAAA;AAAA,YAAsB,MAAQ,EAAA,KAAA;AAAA,YAAO,UAAY,EAAA,KAAA;AAAA,WAAO,CAAA;AAAA,SACzG,CAAA;AAAA,OACH,CAAA;AAAA,KACF;AAAA,GACF;AAEA,EAAA,IAAI,CAAC,IAAQ,IAAA,uBAAA,CAAwB,KAAO,EAAA,UAAA,CAAW,KAAK,CAAG,EAAA;AAC7D,IAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,gBAAA,EAAA;AAAA,MAAiB,IAAM,EAAA,KAAA;AAAA,MAAO,UAAA;AAAA,KAAwB,CAAA,CAAA;AAAA,GAChE;AAEA,EAAA,MAAA,CAAO,IAAK,CAAA,gBAAA,CAAiB,KAAO,EAAA,UAAU,CAAC,CAAA,CAAA;AAE/C,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,cAAQ,MAAO,CAAA,CAAA;AACzB,CAAA;AAEA,SAAS,gBAAA,CAAiB,MAAoB,UAAiC,EAAA;AAC7E,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAK,EAAA,gBAAA;AAAA,IACL,MAAA,EAAQ,CAAC,KAAU,KAAA;AAvJzB,MAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AAwJQ,MAAA,MAAM,YAAe,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAA,CAAK,KAAM,EAAA,eAAA,KAAX,4CAAkC,sBAAuB,EAAA,CAAA;AAC9E,MAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,gBAAA,EAAA;AAAA,QAAiB,IAAM,EAAA,YAAA;AAAA,QAAc,UAAA;AAAA,OAAwB,CAAA,CAAA;AAAA,KACvE;AAAA,GACD,CAAA,CAAA;AAEL,CAAA;AAEA,SAAS,uBAAA,CAAwB,MAAoB,KAAwB,EAAA;AAC3E,EAAI,IAAA,CAAC,MAAM,OAAS,EAAA;AAClB,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AAGA,EAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,IAAK,CAAA,KAAA,CAAM,GAAK,EAAA;AAChC,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAGA,EAAA,IACE,IAAK,CAAA,MAAA,YAAkB,YACvB,IAAA,IAAA,CAAK,OAAO,KAAM,CAAA,IAAA,CAAM,CAAO,CAAA,KAAA,IAAA,IAC/B,IAAK,CAAA,MAAA,CAAO,KAAM,CAAA,GAAA,KAAQ,MAAM,GAChC,EAAA;AACA,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAO,OAAA,KAAA,CAAA;AACT,CAAA;AAEA,SAAS,sBAAyB,GAAA;AAChC,EAAA,OAAO,IAAI,YAAa,CAAA;AAAA,IACtB,GAAK,EAAA,EAAA;AAAA,IACL,KAAO,EAAA,WAAA;AAAA,IACP,QAAU,EAAA,gCAAA;AAAA,IACV,UAAU,MAAM;AACd,MAAA,OAAO,IAAI,aAAc,CAAA;AAAA,QACvB,IAAA,EAAM,IAAI,eAAgB,CAAA;AAAA,UACxB,SAAW,EAAA,QAAA;AAAA,UACX,QAAU,EAAA;AAAA,YACR,IAAI,aAAc,CAAA;AAAA,cAChB,IAAA,EAAM,IAAI,gBAAiB,CAAA;AAAA,gBACzB,WAAW,MAAM;AACf,kBAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,oBAAI,aAAY,EAAA,0BAAA;AAAA,mBAAA,EAA2B,wFAE5C,CAAA,CAAA;AAAA,iBAEJ;AAAA,eACD,CAAA;AAAA,aACF,CAAA;AAAA,WACH;AAAA,SACD,CAAA;AAAA,OACF,CAAA,CAAA;AAAA,KACH;AAAA,GACD,CAAA,CAAA;AACH;;;;"}
+{"version":3,"file":"SceneAppPage.js","sources":["../../../../src/components/SceneApp/SceneAppPage.tsx"],"sourcesContent":["import React from 'react';\nimport { Route, RouteComponentProps, Switch } from 'react-router-dom';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { SceneComponentProps, SceneObject, isDataRequestEnricher } from '../../core/types';\nimport { getUrlSyncManager } from '../../services/UrlSyncManager';\nimport { EmbeddedScene } from '../EmbeddedScene';\nimport { SceneFlexItem, SceneFlexLayout } from '../layout/SceneFlexLayout';\nimport { SceneReactObject } from '../SceneReactObject';\nimport { SceneAppDrilldownViewRender, SceneAppPageView } from './SceneAppPageView';\nimport { SceneAppDrilldownView, SceneAppPageLike, SceneAppPageState, SceneRouteMatch } from './types';\nimport { renderSceneComponentWithRouteProps } from './utils';\n\n/**\n * Responsible for page's drilldown & tabs routing\n */\nexport class SceneAppPage extends SceneObjectBase<SceneAppPageState> implements SceneAppPageLike {\n  public static Component = SceneAppPageRenderer;\n  private _sceneCache = new Map<string, EmbeddedScene>();\n  private _drilldownCache = new Map<string, SceneAppPageLike>();\n\n  public constructor(state: SceneAppPageState) {\n    super(state);\n\n    this.addActivationHandler(() => {\n      return () => getUrlSyncManager().cleanUp(this);\n    });\n  }\n\n  public initializeScene(scene: EmbeddedScene) {\n    this.setState({ initializedScene: scene });\n    getUrlSyncManager().initSync(this);\n  }\n\n  public getScene(routeMatch: SceneRouteMatch): EmbeddedScene {\n    let scene = this._sceneCache.get(routeMatch.url);\n\n    if (scene) {\n      return scene;\n    }\n\n    if (!this.state.getScene) {\n      throw new Error('Missing getScene on SceneAppPage ' + this.state.title);\n    }\n\n    scene = this.state.getScene(routeMatch);\n    this._sceneCache.set(routeMatch.url, scene);\n\n    return scene;\n  }\n\n  public getDrilldownPage(drilldown: SceneAppDrilldownView, routeMatch: SceneRouteMatch<{}>): SceneAppPageLike {\n    let page = this._drilldownCache.get(routeMatch!.url);\n    if (page) {\n      return page;\n    }\n\n    page = drilldown.getPage(routeMatch, this);\n    this._drilldownCache.set(routeMatch!.url, page);\n\n    return page;\n  }\n\n  public enrichDataRequest(source: SceneObject) {\n    if (this.state.getParentPage) {\n      return this.state.getParentPage().enrichDataRequest(source);\n    }\n\n    if (!this.parent) {\n      return null;\n    }\n\n    const root = this.getRoot();\n\n    if (isDataRequestEnricher(root)) {\n      return root.enrichDataRequest(source);\n    }\n\n    return null;\n  }\n}\n\nexport interface SceneAppPageRendererProps extends SceneComponentProps<SceneAppPage> {\n  routeProps: RouteComponentProps;\n}\n\nfunction SceneAppPageRenderer({ model, routeProps }: SceneAppPageRendererProps) {\n  const { tabs, drilldowns } = model.useState();\n  const routes: React.ReactNode[] = [];\n\n  if (tabs && tabs.length > 0) {\n    for (let tabIndex = 0; tabIndex < tabs.length; tabIndex++) {\n      const tab = tabs[tabIndex];\n\n      // Add first tab as a default route, this makes it possible for the first tab to render with the url of the parent page\n      if (tabIndex === 0) {\n        routes.push(\n          <Route\n            exact={true}\n            key={model.state.url}\n            path={model.state.routePath ?? model.state.url}\n            render={(props) => renderSceneComponentWithRouteProps(tab, props)}\n          ></Route>\n        );\n      }\n\n      routes.push(\n        <Route\n          exact={true}\n          key={tab.state.url}\n          path={tab.state.routePath ?? tab.state.url}\n          render={(props) => renderSceneComponentWithRouteProps(tab, props)}\n        ></Route>\n      );\n\n      if (tab.state.drilldowns) {\n        for (const drilldown of tab.state.drilldowns) {\n          routes.push(\n            <Route\n              exact={false}\n              key={drilldown.routePath}\n              path={drilldown.routePath}\n              render={(props) => <SceneAppDrilldownViewRender drilldown={drilldown} parent={tab} routeProps={props} />}\n            ></Route>\n          );\n        }\n      }\n    }\n  }\n\n  if (drilldowns) {\n    for (const drilldown of drilldowns) {\n      routes.push(\n        <Route\n          key={drilldown.routePath}\n          exact={false}\n          path={drilldown.routePath}\n          render={(props) => <SceneAppDrilldownViewRender drilldown={drilldown} parent={model} routeProps={props} />}\n        ></Route>\n      );\n    }\n  }\n\n  if (!tabs && isCurrentPageRouteMatch(model, routeProps.match)) {\n    return <SceneAppPageView page={model} routeProps={routeProps} />;\n  }\n\n  routes.push(getFallbackRoute(model, routeProps));\n\n  return <Switch>{routes}</Switch>;\n}\n\nfunction getFallbackRoute(page: SceneAppPage, routeProps: RouteComponentProps) {\n  return (\n    <Route\n      key={'fallback route'}\n      render={(props) => {\n        const fallbackPage = page.state.getFallbackPage?.() ?? getDefaultFallbackPage();\n        return <SceneAppPageView page={fallbackPage} routeProps={routeProps} />;\n      }}\n    ></Route>\n  );\n}\n\nfunction isCurrentPageRouteMatch(page: SceneAppPage, match: SceneRouteMatch) {\n  if (!match.isExact) {\n    return false;\n  }\n\n  // current page matches the route url\n  if (match.url === page.state.url) {\n    return true;\n  }\n\n  // check if we are a tab and the first tab, then we should also render on the parent url\n  if (\n    page.parent instanceof SceneAppPage &&\n    page.parent.state.tabs![0] === page &&\n    page.parent.state.url === match.url\n  ) {\n    return true;\n  }\n\n  return false;\n}\n\nfunction getDefaultFallbackPage() {\n  return new SceneAppPage({\n    url: '',\n    title: 'Not found',\n    subTitle: 'The url did not match any page',\n    getScene: () => {\n      return new EmbeddedScene({\n        body: new SceneFlexLayout({\n          direction: 'column',\n          children: [\n            new SceneFlexItem({\n              body: new SceneReactObject({\n                component: () => {\n                  return (\n                    <div data-testid=\"default-fallback-content\">\n                      If you found your way here using a link then there might be a bug in this application.\n                    </div>\n                  );\n                },\n              }),\n            }),\n          ],\n        }),\n      });\n    },\n  });\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/components/VizPanel/VizPanel.js

@@ -158,7 +158,7 @@ class VizPanel extends SceneObjectBase {
     }
   }
   async _pluginLoaded(plugin) {
-    const { options, fieldConfig, title, pluginVersion } = this.state;
+    const { options, fieldConfig, title, pluginVersion, _UNSAFE_customMigrationHandler } = this.state;
     const panel = {
       title,
       options,
@@ -168,6 +168,9 @@ class VizPanel extends SceneObjectBase {
       pluginVersion
     };
     const currentVersion = this._getPluginVersion(plugin);
+    if (_UNSAFE_customMigrationHandler) {
+      _UNSAFE_customMigrationHandler(panel, plugin);
+    }
     if (plugin.onPanelMigration) {
       if (currentVersion !== this.state.pluginVersion) {
         panel.options = await plugin.onPanelMigration(panel);

package/dist/esm/components/VizPanel/VizPanel.js.map

@@ -1 +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  ScopedVars,\n  InterpolateFunction,\n  CoreApp,\n  DashboardCursorSync,\n  PanelData,\n  compareArrayValues,\n  compareDataFrameStructures,\n  applyFieldOverrides,\n  PluginType,\n} from '@grafana/data';\nimport { PanelContext, SeriesVisibilityChangeMode, VizLegendOptions } from '@grafana/ui';\nimport { config, getAppEvents, getPluginImportUtils } from '@grafana/runtime';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { DeepPartial, SceneObject, SceneObjectState } from '../../core/types';\n\nimport { VizPanelRenderer } from './VizPanelRenderer';\nimport { VizPanelMenu } from './VizPanelMenu';\nimport { VariableDependencyConfig } from '../../variables/VariableDependencyConfig';\nimport { VariableCustomFormatterFn } from '../../variables/types';\nimport { seriesVisibilityConfigFactory } from './seriesVisibilityConfigFactory';\nimport { emptyPanelData } from '../../core/SceneDataNode';\nimport { changeSeriesColorConfigFactory } from './colorSeriesConfigFactory';\nimport { loadPanelPluginSync } from './registerRuntimePanelPlugin';\nimport { getCursorSyncScope } from '../../behaviors/CursorSync';\nimport { cloneDeep, merge } from 'lodash';\n\nexport interface VizPanelState<TOptions = {}, TFieldConfig = {}> extends SceneObjectState {\n  /**\n   * This is usually a plugin id that references a core plugin or an external plugin. But this can also reference a\n   * runtime registered PanelPlugin registered via function registerScenePanelPlugin.\n   */\n  pluginId: string;\n  title: string;\n  description?: string;\n  options: DeepPartial<TOptions>;\n  fieldConfig: FieldConfigSource<DeepPartial<TFieldConfig>>;\n  pluginVersion?: string;\n  displayMode?: 'default' | 'transparent';\n  hoverHeader?: boolean;\n  menu?: VizPanelMenu;\n  headerActions?: React.ReactNode | SceneObject | SceneObject[];\n  // internal state\n  pluginLoadError?: string;\n  pluginInstanceState?: any;\n}\n\nexport class VizPanel<TOptions = {}, TFieldConfig extends {} = {}> extends SceneObjectBase<\n  VizPanelState<TOptions, TFieldConfig>\n> {\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  private _panelContext?: PanelContext;\n  private _prevData?: PanelData;\n  private _dataWithFieldConfig?: PanelData;\n  private _structureRev: number = 0;\n\n  public constructor(state: Partial<VizPanelState<TOptions, TFieldConfig>>) {\n    super({\n      options: {} as TOptions,\n      fieldConfig: { defaults: {}, overrides: [] },\n      title: 'Title',\n      pluginId: 'timeseries',\n      ...state,\n    });\n\n    this.addActivationHandler(() => {\n      this._onActivate();\n    });\n  }\n\n  private _onActivate() {\n    if (!this._plugin) {\n      this._loadPlugin(this.state.pluginId);\n    }\n\n    this.buildPanelContext();\n  }\n\n  private _loadPlugin(pluginId: string) {\n    const plugin = loadPanelPluginSync(pluginId);\n\n    if (plugin) {\n      this._pluginLoaded(plugin);\n    } else {\n      const { importPanelPlugin } = getPluginImportUtils();\n\n      try {\n        importPanelPlugin(pluginId).then((result) => {\n          return this._pluginLoaded(result);\n        });\n      } catch (err: unknown) {\n        this._pluginLoaded(getPanelPluginNotFound(pluginId));\n        this.setState({ pluginLoadError: (err as Error).message });\n      }\n    }\n  }\n\n  private async _pluginLoaded(plugin: PanelPlugin) {\n    const { options, fieldConfig, title, pluginVersion } = this.state;\n\n    const panel: PanelModel = {\n      title,\n      options,\n      fieldConfig,\n      id: 1,\n      type: plugin.meta.id,\n      pluginVersion: pluginVersion,\n    };\n\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 = await 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\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 getPanelContext(): PanelContext {\n    if (!this._panelContext) {\n      this.buildPanelContext();\n    }\n\n    return this._panelContext!;\n  }\n\n  public onTimeRangeChange = (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 onTitleChange = (title: string) => {\n    this.setState({ title });\n  };\n\n  public onDescriptionChange = (description: string) => {\n    this.setState({ description });\n  };\n\n  public onDisplayModeChange = (displayMode: 'default' | 'transparent') => {\n    this.setState({ displayMode });\n  };\n\n  public onOptionsChange = (optionsUpdate: DeepPartial<TOptions>, replace = false) => {\n    const { fieldConfig, options } = this.state;\n\n    // When replace is true, we want to replace the entire options object. Default will be applied.\n    const nextOptions = replace ? optionsUpdate : merge(cloneDeep(options), optionsUpdate);\n\n    const withDefaults = getPanelOptionsWithDefaults({\n      plugin: this._plugin!,\n      currentOptions: nextOptions,\n      currentFieldConfig: fieldConfig,\n      isAfterPluginChange: false,\n    });\n\n    this.setState({\n      options: withDefaults.options,\n    });\n  };\n\n  public onFieldConfigChange = (fieldConfigUpdate: FieldConfigSource<DeepPartial<TFieldConfig>>, replace?: boolean) => {\n    const { fieldConfig, options } = this.state;\n\n    // When replace is true, we want to replace the entire field config. Default will be applied.\n    const nextFieldConfig = replace ? fieldConfigUpdate : merge(cloneDeep(fieldConfig), fieldConfigUpdate);\n\n    const withDefaults = getPanelOptionsWithDefaults({\n      plugin: this._plugin!,\n      currentOptions: options,\n      currentFieldConfig: nextFieldConfig,\n      isAfterPluginChange: false,\n    });\n\n    this.setState({\n      fieldConfig: withDefaults.fieldConfig,\n    });\n  };\n\n  public interpolate = ((value: string, scoped?: ScopedVars, format?: string | VariableCustomFormatterFn) => {\n    return sceneGraph.interpolate(this, value, scoped, format);\n  }) as InterpolateFunction;\n\n  /**\n   * Called from the react render path to apply the field config to the data provided by the data provider\n   */\n  public applyFieldConfig(rawData?: PanelData): PanelData {\n    const plugin = this._plugin!;\n\n    if (!plugin || plugin.meta.skipDataQuery || !rawData) {\n      // TODO setup time range subscription instead\n      return emptyPanelData;\n    }\n\n    const fieldConfigRegistry = plugin.fieldConfigRegistry;\n    const prevFrames = this._prevData?.series;\n    const newFrames = rawData?.series;\n\n    if (\n      rawData.structureRev == null &&\n      newFrames &&\n      prevFrames &&\n      !compareArrayValues(newFrames, prevFrames, compareDataFrameStructures)\n    ) {\n      this._structureRev++;\n    }\n\n    this._dataWithFieldConfig = {\n      ...rawData,\n      structureRev: this._structureRev,\n      series: applyFieldOverrides({\n        data: newFrames,\n        fieldConfig: this.state.fieldConfig,\n        fieldConfigRegistry,\n        replaceVariables: this.interpolate,\n        theme: config.theme2,\n        timeZone: rawData.request?.timezone,\n      }),\n    };\n\n    return this._dataWithFieldConfig;\n  }\n\n  public onCancelQuery = () => {\n    const data = sceneGraph.getData(this);\n    data.cancelQuery?.();\n  };\n\n  /**\n   * Panel context functions\n   */\n  private _onSeriesColorChange = (label: string, color: string) => {\n    this.onFieldConfigChange(changeSeriesColorConfigFactory(label, color, this.state.fieldConfig));\n  };\n\n  private _onSeriesVisibilityChange = (label: string, mode: SeriesVisibilityChangeMode) => {\n    if (!this._dataWithFieldConfig) {\n      return;\n    }\n\n    this.onFieldConfigChange(\n      seriesVisibilityConfigFactory(label, mode, this.state.fieldConfig, this._dataWithFieldConfig.series)\n    );\n  };\n\n  private _onInstanceStateChange = (state: any) => {\n    this.setState({ pluginInstanceState: state });\n  };\n\n  private _onToggleLegendSort = (sortKey: string) => {\n    const legendOptions: VizLegendOptions = (this.state.options as any).legend;\n\n    // We don't want to do anything when legend options are not available\n    if (!legendOptions) {\n      return;\n    }\n\n    let sortDesc = legendOptions.sortDesc;\n    let sortBy = legendOptions.sortBy;\n    if (sortKey !== sortBy) {\n      sortDesc = undefined;\n    }\n\n    // if already sort ascending, disable sorting\n    if (sortDesc === false) {\n      sortBy = undefined;\n      sortDesc = undefined;\n    } else {\n      sortDesc = !sortDesc;\n      sortBy = sortKey;\n    }\n\n    this.onOptionsChange({\n      ...this.state.options,\n      legend: { ...legendOptions, sortBy, sortDesc },\n    } as TOptions);\n  };\n\n  private buildPanelContext() {\n    const sync = getCursorSyncScope(this);\n\n    this._panelContext = {\n      // @ts-ignore Waits for core release\n      eventsScope: sync ? sync.getEventsScope() : '__global_',\n      eventBus: sync ? sync.getEventsBus(this) : getAppEvents(),\n      app: CoreApp.Unknown, // TODO,\n      sync: () => {\n        if (sync) {\n          return sync.state.sync;\n        }\n        return DashboardCursorSync.Off;\n      }, // TODO\n      onSeriesColorChange: this._onSeriesColorChange,\n      onToggleSeriesVisibility: this._onSeriesVisibilityChange,\n      onToggleLegendSort: this._onToggleLegendSort,\n      onInstanceStateChange: this._onInstanceStateChange,\n      onAnnotationCreate: () => {}, //this.onAnnotationCreate,\n      onAnnotationUpdate: () => {}, //this.onAnnotationUpdate,\n      onAnnotationDelete: () => {}, //this.onAnnotationDelete,\n      canAddAnnotations: () => false, //props.dashboard.canAddAnnotations.bind(props.dashboard),\n      canEditAnnotations: () => false, //props.dashboard.canEditAnnotations.bind(props.dashboard),\n      canDeleteAnnotations: () => false, // props.dashboard.canDeleteAnnotations.bind(props.dashboard),\n    };\n  }\n}\n\nfunction getPanelPluginNotFound(id: string, silent?: boolean): PanelPlugin {\n  const plugin = new PanelPlugin(() => null);\n\n  plugin.meta = {\n    id: id,\n    name: id,\n    sort: 100,\n    type: PluginType.panel,\n    module: '',\n    baseUrl: '',\n    info: {\n      author: {\n        name: '',\n      },\n      description: '',\n      links: [],\n      logos: {\n        large: '',\n        small: 'public/img/grafana_icon.svg',\n      },\n      screenshots: [],\n      updated: '',\n      version: '',\n    },\n  };\n  return plugin;\n}\n"],"names":[],"mappings":"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"}
+{"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  ScopedVars,\n  InterpolateFunction,\n  CoreApp,\n  DashboardCursorSync,\n  PanelData,\n  compareArrayValues,\n  compareDataFrameStructures,\n  applyFieldOverrides,\n  PluginType,\n} from '@grafana/data';\nimport { PanelContext, SeriesVisibilityChangeMode, VizLegendOptions } from '@grafana/ui';\nimport { config, getAppEvents, getPluginImportUtils } from '@grafana/runtime';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { DeepPartial, SceneObject, SceneObjectState } from '../../core/types';\n\nimport { VizPanelRenderer } from './VizPanelRenderer';\nimport { VizPanelMenu } from './VizPanelMenu';\nimport { VariableDependencyConfig } from '../../variables/VariableDependencyConfig';\nimport { VariableCustomFormatterFn } from '../../variables/types';\nimport { seriesVisibilityConfigFactory } from './seriesVisibilityConfigFactory';\nimport { emptyPanelData } from '../../core/SceneDataNode';\nimport { changeSeriesColorConfigFactory } from './colorSeriesConfigFactory';\nimport { loadPanelPluginSync } from './registerRuntimePanelPlugin';\nimport { getCursorSyncScope } from '../../behaviors/CursorSync';\nimport { cloneDeep, merge } from 'lodash';\n\nexport interface VizPanelState<TOptions = {}, TFieldConfig = {}> extends SceneObjectState {\n  /**\n   * This is usually a plugin id that references a core plugin or an external plugin. But this can also reference a\n   * runtime registered PanelPlugin registered via function registerScenePanelPlugin.\n   */\n  pluginId: string;\n  title: string;\n  description?: string;\n  options: DeepPartial<TOptions>;\n  fieldConfig: FieldConfigSource<DeepPartial<TFieldConfig>>;\n  pluginVersion?: string;\n  displayMode?: 'default' | 'transparent';\n  hoverHeader?: boolean;\n  menu?: VizPanelMenu;\n  headerActions?: React.ReactNode | SceneObject | SceneObject[];\n  // internal state\n  pluginLoadError?: string;\n  pluginInstanceState?: any;\n  /**\n   * @internal\n   * Only for use from core to handle migration from old angular panels\n   **/\n  _UNSAFE_customMigrationHandler?: (panel: PanelModel, plugin: PanelPlugin) => void;\n}\n\nexport class VizPanel<TOptions = {}, TFieldConfig extends {} = {}> extends SceneObjectBase<\n  VizPanelState<TOptions, TFieldConfig>\n> {\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  private _panelContext?: PanelContext;\n  private _prevData?: PanelData;\n  private _dataWithFieldConfig?: PanelData;\n  private _structureRev: number = 0;\n\n  public constructor(state: Partial<VizPanelState<TOptions, TFieldConfig>>) {\n    super({\n      options: {} as TOptions,\n      fieldConfig: { defaults: {}, overrides: [] },\n      title: 'Title',\n      pluginId: 'timeseries',\n      ...state,\n    });\n\n    this.addActivationHandler(() => {\n      this._onActivate();\n    });\n  }\n\n  private _onActivate() {\n    if (!this._plugin) {\n      this._loadPlugin(this.state.pluginId);\n    }\n\n    this.buildPanelContext();\n  }\n\n  private _loadPlugin(pluginId: string) {\n    const plugin = loadPanelPluginSync(pluginId);\n\n    if (plugin) {\n      this._pluginLoaded(plugin);\n    } else {\n      const { importPanelPlugin } = getPluginImportUtils();\n\n      try {\n        importPanelPlugin(pluginId).then((result) => {\n          return this._pluginLoaded(result);\n        });\n      } catch (err: unknown) {\n        this._pluginLoaded(getPanelPluginNotFound(pluginId));\n        this.setState({ pluginLoadError: (err as Error).message });\n      }\n    }\n  }\n\n  private async _pluginLoaded(plugin: PanelPlugin) {\n    const { options, fieldConfig, title, pluginVersion, _UNSAFE_customMigrationHandler } = this.state;\n\n    const panel: PanelModel = {\n      title,\n      options,\n      fieldConfig,\n      id: 1,\n      type: plugin.meta.id,\n      pluginVersion: pluginVersion,\n    };\n\n    const currentVersion = this._getPluginVersion(plugin);\n\n    if (_UNSAFE_customMigrationHandler) {\n      _UNSAFE_customMigrationHandler(panel, plugin);\n    }\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 = await 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\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 getPanelContext(): PanelContext {\n    if (!this._panelContext) {\n      this.buildPanelContext();\n    }\n\n    return this._panelContext!;\n  }\n\n  public onTimeRangeChange = (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 onTitleChange = (title: string) => {\n    this.setState({ title });\n  };\n\n  public onDescriptionChange = (description: string) => {\n    this.setState({ description });\n  };\n\n  public onDisplayModeChange = (displayMode: 'default' | 'transparent') => {\n    this.setState({ displayMode });\n  };\n\n  public onOptionsChange = (optionsUpdate: DeepPartial<TOptions>, replace = false) => {\n    const { fieldConfig, options } = this.state;\n\n    // When replace is true, we want to replace the entire options object. Default will be applied.\n    const nextOptions = replace ? optionsUpdate : merge(cloneDeep(options), optionsUpdate);\n\n    const withDefaults = getPanelOptionsWithDefaults({\n      plugin: this._plugin!,\n      currentOptions: nextOptions,\n      currentFieldConfig: fieldConfig,\n      isAfterPluginChange: false,\n    });\n\n    this.setState({\n      options: withDefaults.options,\n    });\n  };\n\n  public onFieldConfigChange = (fieldConfigUpdate: FieldConfigSource<DeepPartial<TFieldConfig>>, replace?: boolean) => {\n    const { fieldConfig, options } = this.state;\n\n    // When replace is true, we want to replace the entire field config. Default will be applied.\n    const nextFieldConfig = replace ? fieldConfigUpdate : merge(cloneDeep(fieldConfig), fieldConfigUpdate);\n\n    const withDefaults = getPanelOptionsWithDefaults({\n      plugin: this._plugin!,\n      currentOptions: options,\n      currentFieldConfig: nextFieldConfig,\n      isAfterPluginChange: false,\n    });\n\n    this.setState({\n      fieldConfig: withDefaults.fieldConfig,\n    });\n  };\n\n  public interpolate = ((value: string, scoped?: ScopedVars, format?: string | VariableCustomFormatterFn) => {\n    return sceneGraph.interpolate(this, value, scoped, format);\n  }) as InterpolateFunction;\n\n  /**\n   * Called from the react render path to apply the field config to the data provided by the data provider\n   */\n  public applyFieldConfig(rawData?: PanelData): PanelData {\n    const plugin = this._plugin!;\n\n    if (!plugin || plugin.meta.skipDataQuery || !rawData) {\n      // TODO setup time range subscription instead\n      return emptyPanelData;\n    }\n\n    const fieldConfigRegistry = plugin.fieldConfigRegistry;\n    const prevFrames = this._prevData?.series;\n    const newFrames = rawData?.series;\n\n    if (\n      rawData.structureRev == null &&\n      newFrames &&\n      prevFrames &&\n      !compareArrayValues(newFrames, prevFrames, compareDataFrameStructures)\n    ) {\n      this._structureRev++;\n    }\n\n    this._dataWithFieldConfig = {\n      ...rawData,\n      structureRev: this._structureRev,\n      series: applyFieldOverrides({\n        data: newFrames,\n        fieldConfig: this.state.fieldConfig,\n        fieldConfigRegistry,\n        replaceVariables: this.interpolate,\n        theme: config.theme2,\n        timeZone: rawData.request?.timezone,\n      }),\n    };\n\n    return this._dataWithFieldConfig;\n  }\n\n  public onCancelQuery = () => {\n    const data = sceneGraph.getData(this);\n    data.cancelQuery?.();\n  };\n\n  /**\n   * Panel context functions\n   */\n  private _onSeriesColorChange = (label: string, color: string) => {\n    this.onFieldConfigChange(changeSeriesColorConfigFactory(label, color, this.state.fieldConfig));\n  };\n\n  private _onSeriesVisibilityChange = (label: string, mode: SeriesVisibilityChangeMode) => {\n    if (!this._dataWithFieldConfig) {\n      return;\n    }\n\n    this.onFieldConfigChange(\n      seriesVisibilityConfigFactory(label, mode, this.state.fieldConfig, this._dataWithFieldConfig.series)\n    );\n  };\n\n  private _onInstanceStateChange = (state: any) => {\n    this.setState({ pluginInstanceState: state });\n  };\n\n  private _onToggleLegendSort = (sortKey: string) => {\n    const legendOptions: VizLegendOptions = (this.state.options as any).legend;\n\n    // We don't want to do anything when legend options are not available\n    if (!legendOptions) {\n      return;\n    }\n\n    let sortDesc = legendOptions.sortDesc;\n    let sortBy = legendOptions.sortBy;\n    if (sortKey !== sortBy) {\n      sortDesc = undefined;\n    }\n\n    // if already sort ascending, disable sorting\n    if (sortDesc === false) {\n      sortBy = undefined;\n      sortDesc = undefined;\n    } else {\n      sortDesc = !sortDesc;\n      sortBy = sortKey;\n    }\n\n    this.onOptionsChange({\n      ...this.state.options,\n      legend: { ...legendOptions, sortBy, sortDesc },\n    } as TOptions);\n  };\n\n  private buildPanelContext() {\n    const sync = getCursorSyncScope(this);\n\n    this._panelContext = {\n      // @ts-ignore Waits for core release\n      eventsScope: sync ? sync.getEventsScope() : '__global_',\n      eventBus: sync ? sync.getEventsBus(this) : getAppEvents(),\n      app: CoreApp.Unknown, // TODO,\n      sync: () => {\n        if (sync) {\n          return sync.state.sync;\n        }\n        return DashboardCursorSync.Off;\n      }, // TODO\n      onSeriesColorChange: this._onSeriesColorChange,\n      onToggleSeriesVisibility: this._onSeriesVisibilityChange,\n      onToggleLegendSort: this._onToggleLegendSort,\n      onInstanceStateChange: this._onInstanceStateChange,\n      onAnnotationCreate: () => {}, //this.onAnnotationCreate,\n      onAnnotationUpdate: () => {}, //this.onAnnotationUpdate,\n      onAnnotationDelete: () => {}, //this.onAnnotationDelete,\n      canAddAnnotations: () => false, //props.dashboard.canAddAnnotations.bind(props.dashboard),\n      canEditAnnotations: () => false, //props.dashboard.canEditAnnotations.bind(props.dashboard),\n      canDeleteAnnotations: () => false, // props.dashboard.canDeleteAnnotations.bind(props.dashboard),\n    };\n  }\n}\n\nfunction getPanelPluginNotFound(id: string, silent?: boolean): PanelPlugin {\n  const plugin = new PanelPlugin(() => null);\n\n  plugin.meta = {\n    id: id,\n    name: id,\n    sort: 100,\n    type: PluginType.panel,\n    module: '',\n    baseUrl: '',\n    info: {\n      author: {\n        name: '',\n      },\n      description: '',\n      links: [],\n      logos: {\n        large: '',\n        small: 'public/img/grafana_icon.svg',\n      },\n      screenshots: [],\n      updated: '',\n      version: '',\n    },\n  };\n  return plugin;\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/components/VizPanel/VizPanelRenderer.js

@@ -5,6 +5,7 @@ import { getAppEvents } from '@grafana/runtime';
 import { PanelChrome, ErrorBoundaryAlert, PanelContextProvider } from '@grafana/ui';
 import { sceneGraph } from '../../core/sceneGraph/index.js';
 import { isSceneObject } from '../../core/types.js';
+import { css } from '@emotion/css';
 
 function VizPanelRenderer({ model }) {
   const {
@@ -71,7 +72,8 @@ function VizPanelRenderer({ model }) {
   const isReadyToRender = dataObject.isDataReadyToDisplay ? dataObject.isDataReadyToDisplay() : true;
   return /* @__PURE__ */ React.createElement("div", {
     ref,
-    style: { position: "absolute", width: "100%", height: "100%" }
+    className: wrapperDivStyles,
+    "data-viz-panel-key": model.state.key
   }, width > 0 && height > 0 && /* @__PURE__ */ React.createElement(PanelChrome, {
     title: titleInterpolated,
     description: description ? () => model.interpolate(description) : "",
@@ -142,6 +144,11 @@ function getChromeStatusMessage(data, pluginLoadingError) {
   }
   return message;
 }
+const wrapperDivStyles = css({
+  position: "absolute",
+  width: "100%",
+  height: "100%"
+});
 
 export { VizPanelRenderer };
 //# sourceMappingURL=VizPanelRenderer.js.map

package/dist/esm/components/VizPanel/VizPanelRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"VizPanelRenderer.js","sources":["../../../../src/components/VizPanel/VizPanelRenderer.tsx"],"sourcesContent":["import React, { RefCallback } from 'react';\nimport { useMeasure } from 'react-use';\n\nimport { PanelData, PluginContextProvider } from '@grafana/data';\nimport { getAppEvents } from '@grafana/runtime';\nimport { PanelChrome, ErrorBoundaryAlert, PanelContextProvider } from '@grafana/ui';\n\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { isSceneObject, SceneComponentProps, SceneLayout, SceneObject } from '../../core/types';\n\nimport { VizPanel } from './VizPanel';\n\nexport function VizPanelRenderer({ model }: SceneComponentProps<VizPanel>) {\n  const {\n    title,\n    description,\n    options,\n    fieldConfig,\n    pluginLoadError,\n    $data,\n    displayMode,\n    hoverHeader,\n    menu,\n    headerActions,\n  } = model.useState();\n  const [ref, { width, height }] = useMeasure();\n  const plugin = model.getPlugin();\n\n  const { dragClass, dragClassCancel } = getDragClasses(model);\n  const dataObject = sceneGraph.getData(model);\n  const rawData = dataObject.useState();\n  const dataWithFieldConfig = model.applyFieldConfig(rawData.data!);\n\n  // Interpolate title\n  const titleInterpolated = model.interpolate(title, undefined, 'text');\n\n  // Not sure we need to subscribe to this state\n  const timeZone = sceneGraph.getTimeRange(model).getTimeZone();\n\n  if (!plugin) {\n    return <div>Loading plugin panel...</div>;\n  }\n\n  if (!plugin.panel) {\n    return <div>Panel plugin has no panel component</div>;\n  }\n\n  const PanelComponent = plugin.panel;\n\n  // If we have a query runner on our level inform it of the container width (used to set auto max data points)\n  if ($data && $data.setContainerWidth) {\n    $data.setContainerWidth(width);\n  }\n\n  const titleItems: React.ReactNode[] = [];\n\n  // If we have local time range show that in panel header\n  if (model.state.$timeRange) {\n    titleItems.push(<model.state.$timeRange.Component model={model.state.$timeRange} key={model.state.key} />);\n  }\n\n  let panelMenu;\n  if (menu) {\n    panelMenu = <menu.Component model={menu} />;\n  }\n\n  let actionsElement: React.ReactNode | undefined;\n\n  if (headerActions) {\n    if (Array.isArray(headerActions)) {\n      actionsElement = (\n        <>\n          {headerActions.map((action) => {\n            return <action.Component model={action} key={`${action.state.key}`} />;\n          })}\n        </>\n      );\n    } else if (isSceneObject(headerActions)) {\n      actionsElement = <headerActions.Component model={headerActions} />;\n    } else {\n      actionsElement = headerActions;\n    }\n  }\n\n  // Data is always returned. For non-data panels, empty PanelData is returned.\n  const data = dataWithFieldConfig!;\n  const isReadyToRender = dataObject.isDataReadyToDisplay ? dataObject.isDataReadyToDisplay() : true;\n\n  return (\n    <div ref={ref as RefCallback<HTMLDivElement>} style={{ position: 'absolute', width: '100%', height: '100%' }}>\n      {width > 0 && height > 0 && (\n        <PanelChrome\n          title={titleInterpolated}\n          description={description ? () => model.interpolate(description) : ''}\n          loadingState={data.state}\n          statusMessage={getChromeStatusMessage(data, pluginLoadError)}\n          width={width}\n          height={height}\n          displayMode={displayMode}\n          hoverHeader={hoverHeader}\n          titleItems={titleItems}\n          dragClass={dragClass}\n          actions={actionsElement}\n          dragClassCancel={dragClassCancel}\n          padding={plugin.noPadding ? 'none' : 'md'}\n          menu={panelMenu}\n          onCancelQuery={model.onCancelQuery}\n        >\n          {(innerWidth, innerHeight) => (\n            <>\n              <ErrorBoundaryAlert dependencies={[plugin, data]}>\n                <PluginContextProvider meta={plugin.meta}>\n                  <PanelContextProvider value={model.getPanelContext()}>\n                    {isReadyToRender && (\n                      <PanelComponent\n                        id={1}\n                        data={data}\n                        title={title}\n                        timeRange={data.timeRange}\n                        timeZone={timeZone}\n                        options={options}\n                        fieldConfig={fieldConfig}\n                        transparent={false}\n                        width={innerWidth}\n                        height={innerHeight}\n                        renderCounter={0}\n                        replaceVariables={model.interpolate}\n                        onOptionsChange={model.onOptionsChange}\n                        onFieldConfigChange={model.onFieldConfigChange}\n                        onChangeTimeRange={model.onTimeRangeChange}\n                        eventBus={getAppEvents()}\n                      />\n                    )}\n                  </PanelContextProvider>\n                </PluginContextProvider>\n              </ErrorBoundaryAlert>\n            </>\n          )}\n        </PanelChrome>\n      )}\n    </div>\n  );\n}\n\nfunction getDragClasses(panel: VizPanel) {\n  const parentLayout = sceneGraph.getLayout(panel);\n  const isDraggable = parentLayout?.isDraggable();\n\n  if (!parentLayout || !isDraggable || itemDraggingDisabled(panel, parentLayout)) {\n    return { dragClass: '', dragClassCancel: '' };\n  }\n\n  return { dragClass: parentLayout.getDragClass?.(), dragClassCancel: parentLayout?.getDragClassCancel?.() };\n}\n\n/**\n * Walks up the parent chain until it hits the layout object, trying to find the closest SceneGridItemLike ancestor.\n * It is not always the direct parent, because the VizPanel can be wrapped in other objects.\n */\nfunction itemDraggingDisabled(item: SceneObject, layout: SceneLayout) {\n  let ancestor = item.parent;\n\n  while (ancestor && ancestor !== layout) {\n    if ('isDraggable' in ancestor.state && ancestor.state.isDraggable === false) {\n      return true;\n    }\n\n    ancestor = ancestor.parent;\n  }\n\n  return false;\n}\n\nfunction getChromeStatusMessage(data: PanelData, pluginLoadingError: string | undefined) {\n  if (pluginLoadingError) {\n    return pluginLoadingError;\n  }\n\n  let message = data.error ? data.error.message : undefined;\n\n  // Handling multiple errors with a single string until we integrate VizPanel with inspector\n  if (data.errors) {\n    message = data.errors.map((e) => e.message).join(', ');\n  }\n  return message;\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"VizPanelRenderer.js","sources":["../../../../src/components/VizPanel/VizPanelRenderer.tsx"],"sourcesContent":["import React, { RefCallback } from 'react';\nimport { useMeasure } from 'react-use';\n\nimport { PanelData, PluginContextProvider } from '@grafana/data';\nimport { getAppEvents } from '@grafana/runtime';\nimport { PanelChrome, ErrorBoundaryAlert, PanelContextProvider } from '@grafana/ui';\n\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { isSceneObject, SceneComponentProps, SceneLayout, SceneObject } from '../../core/types';\n\nimport { VizPanel } from './VizPanel';\nimport { css } from '@emotion/css';\n\nexport function VizPanelRenderer({ model }: SceneComponentProps<VizPanel>) {\n  const {\n    title,\n    description,\n    options,\n    fieldConfig,\n    pluginLoadError,\n    $data,\n    displayMode,\n    hoverHeader,\n    menu,\n    headerActions,\n  } = model.useState();\n  const [ref, { width, height }] = useMeasure();\n  const plugin = model.getPlugin();\n\n  const { dragClass, dragClassCancel } = getDragClasses(model);\n  const dataObject = sceneGraph.getData(model);\n  const rawData = dataObject.useState();\n  const dataWithFieldConfig = model.applyFieldConfig(rawData.data!);\n\n  // Interpolate title\n  const titleInterpolated = model.interpolate(title, undefined, 'text');\n\n  // Not sure we need to subscribe to this state\n  const timeZone = sceneGraph.getTimeRange(model).getTimeZone();\n\n  if (!plugin) {\n    return <div>Loading plugin panel...</div>;\n  }\n\n  if (!plugin.panel) {\n    return <div>Panel plugin has no panel component</div>;\n  }\n\n  const PanelComponent = plugin.panel;\n\n  // If we have a query runner on our level inform it of the container width (used to set auto max data points)\n  if ($data && $data.setContainerWidth) {\n    $data.setContainerWidth(width);\n  }\n\n  const titleItems: React.ReactNode[] = [];\n\n  // If we have local time range show that in panel header\n  if (model.state.$timeRange) {\n    titleItems.push(<model.state.$timeRange.Component model={model.state.$timeRange} key={model.state.key} />);\n  }\n\n  let panelMenu;\n  if (menu) {\n    panelMenu = <menu.Component model={menu} />;\n  }\n\n  let actionsElement: React.ReactNode | undefined;\n\n  if (headerActions) {\n    if (Array.isArray(headerActions)) {\n      actionsElement = (\n        <>\n          {headerActions.map((action) => {\n            return <action.Component model={action} key={`${action.state.key}`} />;\n          })}\n        </>\n      );\n    } else if (isSceneObject(headerActions)) {\n      actionsElement = <headerActions.Component model={headerActions} />;\n    } else {\n      actionsElement = headerActions;\n    }\n  }\n\n  // Data is always returned. For non-data panels, empty PanelData is returned.\n  const data = dataWithFieldConfig!;\n  const isReadyToRender = dataObject.isDataReadyToDisplay ? dataObject.isDataReadyToDisplay() : true;\n\n  return (\n    <div ref={ref as RefCallback<HTMLDivElement>} className={wrapperDivStyles} data-viz-panel-key={model.state.key}>\n      {width > 0 && height > 0 && (\n        <PanelChrome\n          title={titleInterpolated}\n          description={description ? () => model.interpolate(description) : ''}\n          loadingState={data.state}\n          statusMessage={getChromeStatusMessage(data, pluginLoadError)}\n          width={width}\n          height={height}\n          displayMode={displayMode}\n          hoverHeader={hoverHeader}\n          titleItems={titleItems}\n          dragClass={dragClass}\n          actions={actionsElement}\n          dragClassCancel={dragClassCancel}\n          padding={plugin.noPadding ? 'none' : 'md'}\n          menu={panelMenu}\n          onCancelQuery={model.onCancelQuery}\n        >\n          {(innerWidth, innerHeight) => (\n            <>\n              <ErrorBoundaryAlert dependencies={[plugin, data]}>\n                <PluginContextProvider meta={plugin.meta}>\n                  <PanelContextProvider value={model.getPanelContext()}>\n                    {isReadyToRender && (\n                      <PanelComponent\n                        id={1}\n                        data={data}\n                        title={title}\n                        timeRange={data.timeRange}\n                        timeZone={timeZone}\n                        options={options}\n                        fieldConfig={fieldConfig}\n                        transparent={false}\n                        width={innerWidth}\n                        height={innerHeight}\n                        renderCounter={0}\n                        replaceVariables={model.interpolate}\n                        onOptionsChange={model.onOptionsChange}\n                        onFieldConfigChange={model.onFieldConfigChange}\n                        onChangeTimeRange={model.onTimeRangeChange}\n                        eventBus={getAppEvents()}\n                      />\n                    )}\n                  </PanelContextProvider>\n                </PluginContextProvider>\n              </ErrorBoundaryAlert>\n            </>\n          )}\n        </PanelChrome>\n      )}\n    </div>\n  );\n}\n\nfunction getDragClasses(panel: VizPanel) {\n  const parentLayout = sceneGraph.getLayout(panel);\n  const isDraggable = parentLayout?.isDraggable();\n\n  if (!parentLayout || !isDraggable || itemDraggingDisabled(panel, parentLayout)) {\n    return { dragClass: '', dragClassCancel: '' };\n  }\n\n  return { dragClass: parentLayout.getDragClass?.(), dragClassCancel: parentLayout?.getDragClassCancel?.() };\n}\n\n/**\n * Walks up the parent chain until it hits the layout object, trying to find the closest SceneGridItemLike ancestor.\n * It is not always the direct parent, because the VizPanel can be wrapped in other objects.\n */\nfunction itemDraggingDisabled(item: SceneObject, layout: SceneLayout) {\n  let ancestor = item.parent;\n\n  while (ancestor && ancestor !== layout) {\n    if ('isDraggable' in ancestor.state && ancestor.state.isDraggable === false) {\n      return true;\n    }\n\n    ancestor = ancestor.parent;\n  }\n\n  return false;\n}\n\nfunction getChromeStatusMessage(data: PanelData, pluginLoadingError: string | undefined) {\n  if (pluginLoadingError) {\n    return pluginLoadingError;\n  }\n\n  let message = data.error ? data.error.message : undefined;\n\n  // Handling multiple errors with a single string until we integrate VizPanel with inspector\n  if (data.errors) {\n    message = data.errors.map((e) => e.message).join(', ');\n  }\n  return message;\n}\n\nconst wrapperDivStyles = css({\n  position: 'absolute',\n  width: '100%',\n  height: '100%',\n});\n"],"names":[],"mappings":"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"}

package/dist/esm/components/layout/grid/SceneGridLayoutRenderer.js

@@ -38,14 +38,14 @@ function SceneGridLayoutRenderer({ model }) {
       const className = (_a = sceneChild.getClassName) == null ? void 0 : _a.call(sceneChild);
       return isLazy ? /* @__PURE__ */ React.createElement(LazyLoader, {
         key: sceneChild.state.key,
-        "data-panelid": sceneChild.state.key,
+        "data-griditem-key": sceneChild.state.key,
         className
       }, /* @__PURE__ */ React.createElement(sceneChild.Component, {
         model: sceneChild,
         key: sceneChild.state.key
       })) : /* @__PURE__ */ React.createElement("div", {
         key: sceneChild.state.key,
-        "data-panelid": sceneChild.state.key,
+        "data-griditem-key": sceneChild.state.key,
         className
       }, /* @__PURE__ */ React.createElement(sceneChild.Component, {
         model: sceneChild,

package/dist/esm/components/layout/grid/SceneGridLayoutRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"SceneGridLayoutRenderer.js","sources":["../../../../../src/components/layout/grid/SceneGridLayoutRenderer.tsx"],"sourcesContent":["import React from 'react';\nimport ReactGridLayout from 'react-grid-layout';\nimport AutoSizer from 'react-virtualized-auto-sizer';\nimport { SceneComponentProps } from '../../../core/types';\nimport { GRID_CELL_VMARGIN, GRID_COLUMN_COUNT, GRID_CELL_HEIGHT } from './constants';\nimport { LazyLoader } from './LazyLoader';\nimport { SceneGridLayout } from './SceneGridLayout';\nimport { SceneGridItemLike } from './types';\n\nexport function SceneGridLayoutRenderer({ model }: SceneComponentProps<SceneGridLayout>) {\n  const { children, isLazy, isDraggable, isResizable } = model.useState();\n  validateChildrenSize(children);\n\n  return (\n    <AutoSizer disableHeight>\n      {({ width }) => {\n        if (width === 0) {\n          return null;\n        }\n\n        const layout = model.buildGridLayout(width);\n\n        return (\n          /**\n           * The children is using a width of 100% so we need to guarantee that it is wrapped\n           * in an element that has the calculated size given by the AutoSizer. The AutoSizer\n           * has a width of 0 and will let its content overflow its div.\n           */\n          <div style={{ width: `${width}px`, height: '100%' }}>\n            <ReactGridLayout\n              width={width}\n              /**\n                Disable draggable if mobile device, solving an issue with unintentionally\n                moving panels. https://github.com/grafana/grafana/issues/18497\n                theme.breakpoints.md = 769\n               */\n              isDraggable={isDraggable && width > 768}\n              isResizable={isResizable ?? false}\n              containerPadding={[0, 0]}\n              useCSSTransforms={false}\n              margin={[GRID_CELL_VMARGIN, GRID_CELL_VMARGIN]}\n              cols={GRID_COLUMN_COUNT}\n              rowHeight={GRID_CELL_HEIGHT}\n              draggableHandle={`.grid-drag-handle-${model.state.key}`}\n              draggableCancel=\".grid-drag-cancel\"\n              // @ts-ignore: ignoring for now until we make the size type numbers-only\n              layout={layout}\n              onDragStop={model.onDragStop}\n              onResizeStop={model.onResizeStop}\n              onLayoutChange={model.onLayoutChange}\n              isBounded={false}\n            >\n              {layout.map((gridItem) => {\n                const sceneChild = model.getSceneLayoutChild(gridItem.i)!;\n                const className = sceneChild.getClassName?.();\n\n                return isLazy ? (\n                  <LazyLoader key={sceneChild.state.key!} data-panelid={sceneChild.state.key} className={className}>\n                    <sceneChild.Component model={sceneChild} key={sceneChild.state.key} />\n                  </LazyLoader>\n                ) : (\n                  <div key={sceneChild.state.key} data-panelid={sceneChild.state.key} className={className}>\n                    <sceneChild.Component model={sceneChild} key={sceneChild.state.key} />\n                  </div>\n                );\n              })}\n            </ReactGridLayout>\n          </div>\n        );\n      }}\n    </AutoSizer>\n  );\n}\n\nfunction validateChildrenSize(children: SceneGridItemLike[]) {\n  if (\n    children.some(\n      (c) =>\n        c.state.height === undefined ||\n        c.state.width === undefined ||\n        c.state.x === undefined ||\n        c.state.y === undefined\n    )\n  ) {\n    throw new Error('All children must have a size specified');\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SceneGridLayoutRenderer.js","sources":["../../../../../src/components/layout/grid/SceneGridLayoutRenderer.tsx"],"sourcesContent":["import React from 'react';\nimport ReactGridLayout from 'react-grid-layout';\nimport AutoSizer from 'react-virtualized-auto-sizer';\nimport { SceneComponentProps } from '../../../core/types';\nimport { GRID_CELL_VMARGIN, GRID_COLUMN_COUNT, GRID_CELL_HEIGHT } from './constants';\nimport { LazyLoader } from './LazyLoader';\nimport { SceneGridLayout } from './SceneGridLayout';\nimport { SceneGridItemLike } from './types';\n\nexport function SceneGridLayoutRenderer({ model }: SceneComponentProps<SceneGridLayout>) {\n  const { children, isLazy, isDraggable, isResizable } = model.useState();\n  validateChildrenSize(children);\n\n  return (\n    <AutoSizer disableHeight>\n      {({ width }) => {\n        if (width === 0) {\n          return null;\n        }\n\n        const layout = model.buildGridLayout(width);\n\n        return (\n          /**\n           * The children is using a width of 100% so we need to guarantee that it is wrapped\n           * in an element that has the calculated size given by the AutoSizer. The AutoSizer\n           * has a width of 0 and will let its content overflow its div.\n           */\n          <div style={{ width: `${width}px`, height: '100%' }}>\n            <ReactGridLayout\n              width={width}\n              /**\n                Disable draggable if mobile device, solving an issue with unintentionally\n                moving panels. https://github.com/grafana/grafana/issues/18497\n                theme.breakpoints.md = 769\n               */\n              isDraggable={isDraggable && width > 768}\n              isResizable={isResizable ?? false}\n              containerPadding={[0, 0]}\n              useCSSTransforms={false}\n              margin={[GRID_CELL_VMARGIN, GRID_CELL_VMARGIN]}\n              cols={GRID_COLUMN_COUNT}\n              rowHeight={GRID_CELL_HEIGHT}\n              draggableHandle={`.grid-drag-handle-${model.state.key}`}\n              draggableCancel=\".grid-drag-cancel\"\n              // @ts-ignore: ignoring for now until we make the size type numbers-only\n              layout={layout}\n              onDragStop={model.onDragStop}\n              onResizeStop={model.onResizeStop}\n              onLayoutChange={model.onLayoutChange}\n              isBounded={false}\n            >\n              {layout.map((gridItem) => {\n                const sceneChild = model.getSceneLayoutChild(gridItem.i)!;\n                const className = sceneChild.getClassName?.();\n\n                return isLazy ? (\n                  <LazyLoader\n                    key={sceneChild.state.key!}\n                    data-griditem-key={sceneChild.state.key}\n                    className={className}\n                  >\n                    <sceneChild.Component model={sceneChild} key={sceneChild.state.key} />\n                  </LazyLoader>\n                ) : (\n                  <div key={sceneChild.state.key} data-griditem-key={sceneChild.state.key} className={className}>\n                    <sceneChild.Component model={sceneChild} key={sceneChild.state.key} />\n                  </div>\n                );\n              })}\n            </ReactGridLayout>\n          </div>\n        );\n      }}\n    </AutoSizer>\n  );\n}\n\nfunction validateChildrenSize(children: SceneGridItemLike[]) {\n  if (\n    children.some(\n      (c) =>\n        c.state.height === undefined ||\n        c.state.width === undefined ||\n        c.state.x === undefined ||\n        c.state.y === undefined\n    )\n  ) {\n    throw new Error('All children must have a size specified');\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/variables/VariableDependencyConfig.js

@@ -1,4 +1,5 @@
 import { VARIABLE_REGEX } from './constants.js';
+import { safeStringifyValue } from './utils.js';
 
 class VariableDependencyConfig {
   constructor(_sceneObject, _options) {
@@ -93,14 +94,6 @@ class VariableDependencyConfig {
     }
   }
 }
-const safeStringifyValue = (value) => {
-  try {
-    return JSON.stringify(value, null);
-  } catch (error) {
-    console.error(error);
-  }
-  return "";
-};
 
 export { VariableDependencyConfig };
 //# sourceMappingURL=VariableDependencyConfig.js.map

package/dist/esm/variables/VariableDependencyConfig.js.map

@@ -1 +1 @@
-{"version":3,"file":"VariableDependencyConfig.js","sources":["../../../src/variables/VariableDependencyConfig.ts"],"sourcesContent":["import { SceneObject, SceneObjectState } from '../core/types';\nimport { VARIABLE_REGEX } from './constants';\n\nimport { SceneVariable, SceneVariableDependencyConfigLike } from './types';\n\ninterface VariableDependencyConfigOptions<TState extends SceneObjectState> {\n  /**\n   * State paths to scan / extract variable dependencies from. Leave empty to scan all paths.\n   */\n  statePaths?: Array<keyof TState>;\n\n  /**\n   * Explicit list of variable names to depend on. Leave empty to scan state for dependencies.\n   */\n  variableNames?: string[];\n  /**\n   * Optional way to customize how to handle when a dependent variable changes\n   * If not specified the default behavior is to trigger a re-render\n   */\n  onReferencedVariableValueChanged?: () => void;\n\n  /**\n   * Optional way to customize how to handle when the variable system has completed an update\n   */\n  onVariableUpdatesCompleted?: (changedVariables: Set<SceneVariable>, dependencyChanged: boolean) => void;\n}\n\nexport class VariableDependencyConfig<TState extends SceneObjectState> implements SceneVariableDependencyConfigLike {\n  private _state: TState | undefined;\n  private _dependencies = new Set<string>();\n  private _statePaths?: Array<keyof TState>;\n\n  public scanCount = 0;\n\n  public constructor(\n    private _sceneObject: SceneObject<TState>,\n    private _options: VariableDependencyConfigOptions<TState>\n  ) {\n    this._statePaths = _options.statePaths;\n  }\n\n  /**\n   * Used to check for dependency on a specific variable\n   */\n  public hasDependencyOn(name: string): boolean {\n    return this.getNames().has(name);\n  }\n\n  /**\n   * This is called whenever any set of variables have new values. It up to this implementation to check if it's relevant given the current dependencies.\n   */\n  public variableUpdatesCompleted(changedVariables: Set<SceneVariable>) {\n    const deps = this.getNames();\n    let dependencyChanged = false;\n\n    for (const variable of changedVariables) {\n      if (deps.has(variable.state.name)) {\n        dependencyChanged = true;\n        break;\n      }\n    }\n\n    // If custom handler is always called to let the scene object know that SceneVariableSet has completed processing variables\n    if (this._options.onVariableUpdatesCompleted) {\n      this._options.onVariableUpdatesCompleted(changedVariables, dependencyChanged);\n      return;\n    }\n\n    if (dependencyChanged) {\n      if (this._options.onReferencedVariableValueChanged) {\n        this._options.onReferencedVariableValueChanged();\n      } else {\n        this.defaultHandlerReferencedVariableValueChanged();\n      }\n    }\n  }\n\n  /**\n   * Only way to force a re-render is to update state right now\n   */\n  private defaultHandlerReferencedVariableValueChanged = () => {\n    this._sceneObject.forceRender();\n  };\n\n  public getNames(): Set<string> {\n    const prevState = this._state;\n    const newState = (this._state = this._sceneObject.state);\n\n    if (!prevState) {\n      // First time we always scan for dependencies\n      this.scanStateForDependencies(this._state);\n      return this._dependencies;\n    }\n\n    // Second time we only scan if state is a different and if any specific state path has changed\n    if (newState !== prevState) {\n      if (this._statePaths) {\n        for (const path of this._statePaths) {\n          if (newState[path] !== prevState[path]) {\n            this.scanStateForDependencies(newState);\n            break;\n          }\n        }\n      } else {\n        this.scanStateForDependencies(newState);\n      }\n    }\n\n    return this._dependencies;\n  }\n\n  public setPaths(paths: Array<keyof TState>) {\n    this._statePaths = paths;\n  }\n\n  private scanStateForDependencies(state: TState) {\n    this._dependencies.clear();\n    this.scanCount += 1;\n\n    if (this._options.variableNames) {\n      for (const name of this._options.variableNames) {\n        this._dependencies.add(name);\n      }\n    } else {\n      if (this._statePaths) {\n        for (const path of this._statePaths) {\n          const value = state[path];\n          if (value) {\n            this.extractVariablesFrom(value);\n          }\n        }\n      } else {\n        this.extractVariablesFrom(state);\n      }\n    }\n  }\n\n  private extractVariablesFrom(value: unknown) {\n    VARIABLE_REGEX.lastIndex = 0;\n\n    const stringToCheck = typeof value !== 'string' ? safeStringifyValue(value) : value;\n\n    const matches = stringToCheck.matchAll(VARIABLE_REGEX);\n    if (!matches) {\n      return;\n    }\n\n    for (const match of matches) {\n      const [, var1, var2, , var3] = match;\n      const variableName = var1 || var2 || var3;\n      this._dependencies.add(variableName);\n    }\n  }\n}\n\nconst safeStringifyValue = (value: unknown) => {\n  try {\n    return JSON.stringify(value, null);\n  } catch (error) {\n    console.error(error);\n  }\n\n  return '';\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"VariableDependencyConfig.js","sources":["../../../src/variables/VariableDependencyConfig.ts"],"sourcesContent":["import { SceneObject, SceneObjectState } from '../core/types';\nimport { VARIABLE_REGEX } from './constants';\n\nimport { SceneVariable, SceneVariableDependencyConfigLike } from './types';\nimport { safeStringifyValue } from './utils';\n\ninterface VariableDependencyConfigOptions<TState extends SceneObjectState> {\n  /**\n   * State paths to scan / extract variable dependencies from. Leave empty to scan all paths.\n   */\n  statePaths?: Array<keyof TState>;\n\n  /**\n   * Explicit list of variable names to depend on. Leave empty to scan state for dependencies.\n   */\n  variableNames?: string[];\n  /**\n   * Optional way to customize how to handle when a dependent variable changes\n   * If not specified the default behavior is to trigger a re-render\n   */\n  onReferencedVariableValueChanged?: () => void;\n\n  /**\n   * Optional way to customize how to handle when the variable system has completed an update\n   */\n  onVariableUpdatesCompleted?: (changedVariables: Set<SceneVariable>, dependencyChanged: boolean) => void;\n}\n\nexport class VariableDependencyConfig<TState extends SceneObjectState> implements SceneVariableDependencyConfigLike {\n  private _state: TState | undefined;\n  private _dependencies = new Set<string>();\n  private _statePaths?: Array<keyof TState>;\n\n  public scanCount = 0;\n\n  public constructor(\n    private _sceneObject: SceneObject<TState>,\n    private _options: VariableDependencyConfigOptions<TState>\n  ) {\n    this._statePaths = _options.statePaths;\n  }\n\n  /**\n   * Used to check for dependency on a specific variable\n   */\n  public hasDependencyOn(name: string): boolean {\n    return this.getNames().has(name);\n  }\n\n  /**\n   * This is called whenever any set of variables have new values. It up to this implementation to check if it's relevant given the current dependencies.\n   */\n  public variableUpdatesCompleted(changedVariables: Set<SceneVariable>) {\n    const deps = this.getNames();\n    let dependencyChanged = false;\n\n    for (const variable of changedVariables) {\n      if (deps.has(variable.state.name)) {\n        dependencyChanged = true;\n        break;\n      }\n    }\n\n    // If custom handler is always called to let the scene object know that SceneVariableSet has completed processing variables\n    if (this._options.onVariableUpdatesCompleted) {\n      this._options.onVariableUpdatesCompleted(changedVariables, dependencyChanged);\n      return;\n    }\n\n    if (dependencyChanged) {\n      if (this._options.onReferencedVariableValueChanged) {\n        this._options.onReferencedVariableValueChanged();\n      } else {\n        this.defaultHandlerReferencedVariableValueChanged();\n      }\n    }\n  }\n\n  /**\n   * Only way to force a re-render is to update state right now\n   */\n  private defaultHandlerReferencedVariableValueChanged = () => {\n    this._sceneObject.forceRender();\n  };\n\n  public getNames(): Set<string> {\n    const prevState = this._state;\n    const newState = (this._state = this._sceneObject.state);\n\n    if (!prevState) {\n      // First time we always scan for dependencies\n      this.scanStateForDependencies(this._state);\n      return this._dependencies;\n    }\n\n    // Second time we only scan if state is a different and if any specific state path has changed\n    if (newState !== prevState) {\n      if (this._statePaths) {\n        for (const path of this._statePaths) {\n          if (newState[path] !== prevState[path]) {\n            this.scanStateForDependencies(newState);\n            break;\n          }\n        }\n      } else {\n        this.scanStateForDependencies(newState);\n      }\n    }\n\n    return this._dependencies;\n  }\n\n  public setPaths(paths: Array<keyof TState>) {\n    this._statePaths = paths;\n  }\n\n  private scanStateForDependencies(state: TState) {\n    this._dependencies.clear();\n    this.scanCount += 1;\n\n    if (this._options.variableNames) {\n      for (const name of this._options.variableNames) {\n        this._dependencies.add(name);\n      }\n    } else {\n      if (this._statePaths) {\n        for (const path of this._statePaths) {\n          const value = state[path];\n          if (value) {\n            this.extractVariablesFrom(value);\n          }\n        }\n      } else {\n        this.extractVariablesFrom(state);\n      }\n    }\n  }\n\n  private extractVariablesFrom(value: unknown) {\n    VARIABLE_REGEX.lastIndex = 0;\n\n    const stringToCheck = typeof value !== 'string' ? safeStringifyValue(value) : value;\n\n    const matches = stringToCheck.matchAll(VARIABLE_REGEX);\n    if (!matches) {\n      return;\n    }\n\n    for (const match of matches) {\n      const [, var1, var2, , var3] = match;\n      const variableName = var1 || var2 || var3;\n      this._dependencies.add(variableName);\n    }\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/variables/components/VariableValueInput.js

@@ -1,29 +1,30 @@
-import React, { useState, useCallback } from 'react';
-import { Input } from '@grafana/ui';
-import { useDebounce } from 'react-use';
+import React, { useCallback } from 'react';
+import { AutoSizeInput } from '@grafana/ui';
 
 function VariableValueInput({ model }) {
   const { value, key, loading } = model.useState();
-  const [textValue, setTextValue] = useState(value);
-  useDebounce(
-    () => {
-      model.setValue(textValue);
+  const onBlur = useCallback(
+    (e) => {
+      model.setValue(e.currentTarget.value);
     },
-    250,
-    [textValue]
+    [model]
   );
-  const onChange = useCallback(
+  const onKeyDown = useCallback(
     (e) => {
-      setTextValue(e.target.value);
+      if (e.key === "Enter") {
+        model.setValue(e.currentTarget.value);
+      }
     },
-    [setTextValue]
+    [model]
   );
-  return /* @__PURE__ */ React.createElement(Input, {
+  return /* @__PURE__ */ React.createElement(AutoSizeInput, {
     id: key,
-    placeholder: "Enter variable value",
-    value: textValue,
+    placeholder: "Enter value",
+    minWidth: 15,
+    defaultValue: value,
     loading,
-    onChange
+    onBlur,
+    onKeyDown
   });
 }
 

package/dist/esm/variables/components/VariableValueInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"VariableValueInput.js","sources":["../../../../src/variables/components/VariableValueInput.tsx"],"sourcesContent":["import React, { useState, useCallback } from 'react';\n\nimport { Input } from '@grafana/ui';\n\nimport { SceneComponentProps } from '../../core/types';\nimport { TextBoxVariable } from '../variants/TextBoxVariable';\nimport { useDebounce } from 'react-use';\n\nexport function VariableValueInput({ model }: SceneComponentProps<TextBoxVariable>) {\n  const { value, key, loading } = model.useState();\n  const [textValue, setTextValue] = useState(value);\n  useDebounce(\n    () => {\n      model.setValue(textValue);\n    },\n    250,\n    [textValue]\n  );\n\n  const onChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      setTextValue(e.target.value);\n    },\n    [setTextValue]\n  );\n\n  return <Input id={key} placeholder=\"Enter variable value\" value={textValue} loading={loading} onChange={onChange} />;\n}\n"],"names":[],"mappings":";;;;AAQgB,SAAA,kBAAA,CAAmB,EAAE,KAAA,EAA+C,EAAA;AAClF,EAAA,MAAM,EAAE,KAAO,EAAA,GAAA,EAAK,OAAQ,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AAC/C,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAChD,EAAA,WAAA;AAAA,IACE,MAAM;AACJ,MAAA,KAAA,CAAM,SAAS,SAAS,CAAA,CAAA;AAAA,KAC1B;AAAA,IACA,GAAA;AAAA,IACA,CAAC,SAAS,CAAA;AAAA,GACZ,CAAA;AAEA,EAAA,MAAM,QAAW,GAAA,WAAA;AAAA,IACf,CAAC,CAA2C,KAAA;AAC1C,MAAa,YAAA,CAAA,CAAA,CAAE,OAAO,KAAK,CAAA,CAAA;AAAA,KAC7B;AAAA,IACA,CAAC,YAAY,CAAA;AAAA,GACf,CAAA;AAEA,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAM,EAAI,EAAA,GAAA;AAAA,IAAK,WAAY,EAAA,sBAAA;AAAA,IAAuB,KAAO,EAAA,SAAA;AAAA,IAAW,OAAA;AAAA,IAAkB,QAAA;AAAA,GAAoB,CAAA,CAAA;AACpH;;;;"}
+{"version":3,"file":"VariableValueInput.js","sources":["../../../../src/variables/components/VariableValueInput.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport { AutoSizeInput } from '@grafana/ui';\n\nimport { SceneComponentProps } from '../../core/types';\nimport { TextBoxVariable } from '../variants/TextBoxVariable';\n\nexport function VariableValueInput({ model }: SceneComponentProps<TextBoxVariable>) {\n  const { value, key, loading } = model.useState();\n\n  const onBlur = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      model.setValue(e.currentTarget.value);\n    },\n    [model]\n  );\n\n  const onKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>) => {\n      if (e.key === 'Enter') {\n        model.setValue(e.currentTarget.value);\n      }\n    },\n    [model]\n  );\n\n  return (\n    <AutoSizeInput\n      id={key}\n      placeholder=\"Enter value\"\n      minWidth={15}\n      defaultValue={value}\n      loading={loading}\n      onBlur={onBlur}\n      onKeyDown={onKeyDown}\n    />\n  );\n}\n"],"names":[],"mappings":";;;AAOgB,SAAA,kBAAA,CAAmB,EAAE,KAAA,EAA+C,EAAA;AAClF,EAAA,MAAM,EAAE,KAAO,EAAA,GAAA,EAAK,OAAQ,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AAE/C,EAAA,MAAM,MAAS,GAAA,WAAA;AAAA,IACb,CAAC,CAA2C,KAAA;AAC1C,MAAM,KAAA,CAAA,QAAA,CAAS,CAAE,CAAA,aAAA,CAAc,KAAK,CAAA,CAAA;AAAA,KACtC;AAAA,IACA,CAAC,KAAK,CAAA;AAAA,GACR,CAAA;AAEA,EAAA,MAAM,SAAY,GAAA,WAAA;AAAA,IAChB,CAAC,CAA6C,KAAA;AAC5C,MAAI,IAAA,CAAA,CAAE,QAAQ,OAAS,EAAA;AACrB,QAAM,KAAA,CAAA,QAAA,CAAS,CAAE,CAAA,aAAA,CAAc,KAAK,CAAA,CAAA;AAAA,OACtC;AAAA,KACF;AAAA,IACA,CAAC,KAAK,CAAA;AAAA,GACR,CAAA;AAEA,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA;AAAA,IACC,EAAI,EAAA,GAAA;AAAA,IACJ,WAAY,EAAA,aAAA;AAAA,IACZ,QAAU,EAAA,EAAA;AAAA,IACV,YAAc,EAAA,KAAA;AAAA,IACd,OAAA;AAAA,IACA,MAAA;AAAA,IACA,SAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

package/dist/esm/variables/components/VariableValueSelect.js

@@ -4,6 +4,11 @@ import { Select, MultiSelect } from '@grafana/ui';
 
 function VariableValueSelect({ model }) {
   const { value, key } = model.useState();
+  const onInputChange = model.onSearchChange ? (value2, meta) => {
+    if (meta.action === "input-change") {
+      model.onSearchChange(value2);
+    }
+  } : void 0;
   return /* @__PURE__ */ React.createElement(Select, {
     id: key,
     placeholder: "Select value",
@@ -11,6 +16,7 @@ function VariableValueSelect({ model }) {
     value,
     allowCustomValue: true,
     tabSelectsValue: false,
+    onInputChange,
     options: model.getOptionsForSelect(),
     onChange: (newValue) => {
       model.changeValueTo(newValue.value, newValue.label);
@@ -20,6 +26,11 @@ function VariableValueSelect({ model }) {
 function VariableValueSelectMulti({ model }) {
   const { value, key } = model.useState();
   const arrayValue = isArray(value) ? value : [value];
+  const onInputChange = model.onSearchChange ? (value2, meta) => {
+    if (meta.action === "input-change") {
+      model.onSearchChange(value2);
+    }
+  } : void 0;
   return /* @__PURE__ */ React.createElement(MultiSelect, {
     id: key,
     placeholder: "Select value",
@@ -30,8 +41,7 @@ function VariableValueSelectMulti({ model }) {
     options: model.getOptionsForSelect(),
     closeMenuOnSelect: false,
     isClearable: true,
-    onOpenMenu: () => {
-    },
+    onInputChange,
     onChange: (newValue) => {
       model.changeValueTo(
         newValue.map((v) => v.value),

package/dist/esm/variables/components/VariableValueSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"VariableValueSelect.js","sources":["../../../../src/variables/components/VariableValueSelect.tsx"],"sourcesContent":["import { isArray } from 'lodash';\nimport React from 'react';\n\nimport { MultiSelect, Select } from '@grafana/ui';\n\nimport { SceneComponentProps } from '../../core/types';\nimport { MultiValueVariable } from '../variants/MultiValueVariable';\nimport { VariableValue, VariableValueSingle } from '../types';\n\nexport function VariableValueSelect({ model }: SceneComponentProps<MultiValueVariable>) {\n  const { value, key } = model.useState();\n\n  return (\n    <Select<VariableValue>\n      id={key}\n      placeholder=\"Select value\"\n      width=\"auto\"\n      value={value}\n      allowCustomValue\n      tabSelectsValue={false}\n      options={model.getOptionsForSelect()}\n      onChange={(newValue) => {\n        model.changeValueTo(newValue.value!, newValue.label!);\n      }}\n    />\n  );\n}\n\nexport function VariableValueSelectMulti({ model }: SceneComponentProps<MultiValueVariable>) {\n  const { value, key } = model.useState();\n  const arrayValue = isArray(value) ? value : [value];\n\n  return (\n    <MultiSelect<VariableValueSingle>\n      id={key}\n      placeholder=\"Select value\"\n      width=\"auto\"\n      value={arrayValue}\n      tabSelectsValue={false}\n      allowCustomValue\n      options={model.getOptionsForSelect()}\n      closeMenuOnSelect={false}\n      isClearable={true}\n      onOpenMenu={() => {}}\n      onChange={(newValue) => {\n        model.changeValueTo(\n          newValue.map((v) => v.value!),\n          newValue.map((v) => v.label!)\n        );\n      }}\n    />\n  );\n}\n\nexport function renderSelectForVariable(model: MultiValueVariable) {\n  if (model.state.isMulti) {\n    return <VariableValueSelectMulti model={model} />;\n  } else {\n    return <VariableValueSelect model={model} />;\n  }\n}\n"],"names":[],"mappings":";;;;AASgB,SAAA,mBAAA,CAAoB,EAAE,KAAA,EAAkD,EAAA;AACtF,EAAA,MAAM,EAAE,KAAA,EAAO,GAAI,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AAEtC,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACC,EAAI,EAAA,GAAA;AAAA,IACJ,WAAY,EAAA,cAAA;AAAA,IACZ,KAAM,EAAA,MAAA;AAAA,IACN,KAAA;AAAA,IACA,gBAAgB,EAAA,IAAA;AAAA,IAChB,eAAiB,EAAA,KAAA;AAAA,IACjB,OAAA,EAAS,MAAM,mBAAoB,EAAA;AAAA,IACnC,QAAA,EAAU,CAAC,QAAa,KAAA;AACtB,MAAA,KAAA,CAAM,aAAc,CAAA,QAAA,CAAS,KAAQ,EAAA,QAAA,CAAS,KAAM,CAAA,CAAA;AAAA,KACtD;AAAA,GACF,CAAA,CAAA;AAEJ,CAAA;AAEgB,SAAA,wBAAA,CAAyB,EAAE,KAAA,EAAkD,EAAA;AAC3F,EAAA,MAAM,EAAE,KAAA,EAAO,GAAI,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AACtC,EAAA,MAAM,aAAa,OAAQ,CAAA,KAAK,CAAI,GAAA,KAAA,GAAQ,CAAC,KAAK,CAAA,CAAA;AAElD,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA;AAAA,IACC,EAAI,EAAA,GAAA;AAAA,IACJ,WAAY,EAAA,cAAA;AAAA,IACZ,KAAM,EAAA,MAAA;AAAA,IACN,KAAO,EAAA,UAAA;AAAA,IACP,eAAiB,EAAA,KAAA;AAAA,IACjB,gBAAgB,EAAA,IAAA;AAAA,IAChB,OAAA,EAAS,MAAM,mBAAoB,EAAA;AAAA,IACnC,iBAAmB,EAAA,KAAA;AAAA,IACnB,WAAa,EAAA,IAAA;AAAA,IACb,YAAY,MAAM;AAAA,KAAC;AAAA,IACnB,QAAA,EAAU,CAAC,QAAa,KAAA;AACtB,MAAM,KAAA,CAAA,aAAA;AAAA,QACJ,QAAS,CAAA,GAAA,CAAI,CAAC,CAAA,KAAM,EAAE,KAAM,CAAA;AAAA,QAC5B,QAAS,CAAA,GAAA,CAAI,CAAC,CAAA,KAAM,EAAE,KAAM,CAAA;AAAA,OAC9B,CAAA;AAAA,KACF;AAAA,GACF,CAAA,CAAA;AAEJ,CAAA;AAEO,SAAS,wBAAwB,KAA2B,EAAA;AACjE,EAAI,IAAA,KAAA,CAAM,MAAM,OAAS,EAAA;AACvB,IAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,wBAAA,EAAA;AAAA,MAAyB,KAAA;AAAA,KAAc,CAAA,CAAA;AAAA,GAC1C,MAAA;AACL,IAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA;AAAA,MAAoB,KAAA;AAAA,KAAc,CAAA,CAAA;AAAA,GAC5C;AACF;;;;"}
+{"version":3,"file":"VariableValueSelect.js","sources":["../../../../src/variables/components/VariableValueSelect.tsx"],"sourcesContent":["import { isArray } from 'lodash';\nimport React from 'react';\n\nimport { InputActionMeta, MultiSelect, Select } from '@grafana/ui';\n\nimport { SceneComponentProps } from '../../core/types';\nimport { MultiValueVariable } from '../variants/MultiValueVariable';\nimport { VariableValue, VariableValueSingle } from '../types';\n\nexport function VariableValueSelect({ model }: SceneComponentProps<MultiValueVariable>) {\n  const { value, key } = model.useState();\n\n  const onInputChange = model.onSearchChange\n    ? (value: string, meta: InputActionMeta) => {\n        if (meta.action === 'input-change') {\n          model.onSearchChange!(value);\n        }\n      }\n    : undefined;\n\n  return (\n    <Select<VariableValue>\n      id={key}\n      placeholder=\"Select value\"\n      width=\"auto\"\n      value={value}\n      allowCustomValue\n      tabSelectsValue={false}\n      onInputChange={onInputChange}\n      options={model.getOptionsForSelect()}\n      onChange={(newValue) => {\n        model.changeValueTo(newValue.value!, newValue.label!);\n      }}\n    />\n  );\n}\n\nexport function VariableValueSelectMulti({ model }: SceneComponentProps<MultiValueVariable>) {\n  const { value, key } = model.useState();\n  const arrayValue = isArray(value) ? value : [value];\n\n  const onInputChange = model.onSearchChange\n    ? (value: string, meta: InputActionMeta) => {\n        if (meta.action === 'input-change') {\n          model.onSearchChange!(value);\n        }\n      }\n    : undefined;\n\n  return (\n    <MultiSelect<VariableValueSingle>\n      id={key}\n      placeholder=\"Select value\"\n      width=\"auto\"\n      value={arrayValue}\n      tabSelectsValue={false}\n      allowCustomValue\n      options={model.getOptionsForSelect()}\n      closeMenuOnSelect={false}\n      isClearable={true}\n      onInputChange={onInputChange}\n      onChange={(newValue) => {\n        model.changeValueTo(\n          newValue.map((v) => v.value!),\n          newValue.map((v) => v.label!)\n        );\n      }}\n    />\n  );\n}\n\nexport function renderSelectForVariable(model: MultiValueVariable) {\n  if (model.state.isMulti) {\n    return <VariableValueSelectMulti model={model} />;\n  } else {\n    return <VariableValueSelect model={model} />;\n  }\n}\n"],"names":["value"],"mappings":";;;;AASgB,SAAA,mBAAA,CAAoB,EAAE,KAAA,EAAkD,EAAA;AACtF,EAAA,MAAM,EAAE,KAAA,EAAO,GAAI,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AAEtC,EAAA,MAAM,aAAgB,GAAA,KAAA,CAAM,cACxB,GAAA,CAACA,QAAe,IAA0B,KAAA;AACxC,IAAI,IAAA,IAAA,CAAK,WAAW,cAAgB,EAAA;AAClC,MAAA,KAAA,CAAM,eAAgBA,MAAK,CAAA,CAAA;AAAA,KAC7B;AAAA,GAEF,GAAA,KAAA,CAAA,CAAA;AAEJ,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACC,EAAI,EAAA,GAAA;AAAA,IACJ,WAAY,EAAA,cAAA;AAAA,IACZ,KAAM,EAAA,MAAA;AAAA,IACN,KAAA;AAAA,IACA,gBAAgB,EAAA,IAAA;AAAA,IAChB,eAAiB,EAAA,KAAA;AAAA,IACjB,aAAA;AAAA,IACA,OAAA,EAAS,MAAM,mBAAoB,EAAA;AAAA,IACnC,QAAA,EAAU,CAAC,QAAa,KAAA;AACtB,MAAA,KAAA,CAAM,aAAc,CAAA,QAAA,CAAS,KAAQ,EAAA,QAAA,CAAS,KAAM,CAAA,CAAA;AAAA,KACtD;AAAA,GACF,CAAA,CAAA;AAEJ,CAAA;AAEgB,SAAA,wBAAA,CAAyB,EAAE,KAAA,EAAkD,EAAA;AAC3F,EAAA,MAAM,EAAE,KAAA,EAAO,GAAI,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AACtC,EAAA,MAAM,aAAa,OAAQ,CAAA,KAAK,CAAI,GAAA,KAAA,GAAQ,CAAC,KAAK,CAAA,CAAA;AAElD,EAAA,MAAM,aAAgB,GAAA,KAAA,CAAM,cACxB,GAAA,CAACA,QAAe,IAA0B,KAAA;AACxC,IAAI,IAAA,IAAA,CAAK,WAAW,cAAgB,EAAA;AAClC,MAAA,KAAA,CAAM,eAAgBA,MAAK,CAAA,CAAA;AAAA,KAC7B;AAAA,GAEF,GAAA,KAAA,CAAA,CAAA;AAEJ,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA;AAAA,IACC,EAAI,EAAA,GAAA;AAAA,IACJ,WAAY,EAAA,cAAA;AAAA,IACZ,KAAM,EAAA,MAAA;AAAA,IACN,KAAO,EAAA,UAAA;AAAA,IACP,eAAiB,EAAA,KAAA;AAAA,IACjB,gBAAgB,EAAA,IAAA;AAAA,IAChB,OAAA,EAAS,MAAM,mBAAoB,EAAA;AAAA,IACnC,iBAAmB,EAAA,KAAA;AAAA,IACnB,WAAa,EAAA,IAAA;AAAA,IACb,aAAA;AAAA,IACA,QAAA,EAAU,CAAC,QAAa,KAAA;AACtB,MAAM,KAAA,CAAA,aAAA;AAAA,QACJ,QAAS,CAAA,GAAA,CAAI,CAAC,CAAA,KAAM,EAAE,KAAM,CAAA;AAAA,QAC5B,QAAS,CAAA,GAAA,CAAI,CAAC,CAAA,KAAM,EAAE,KAAM,CAAA;AAAA,OAC9B,CAAA;AAAA,KACF;AAAA,GACF,CAAA,CAAA;AAEJ,CAAA;AAEO,SAAS,wBAAwB,KAA2B,EAAA;AACjE,EAAI,IAAA,KAAA,CAAM,MAAM,OAAS,EAAA;AACvB,IAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,wBAAA,EAAA;AAAA,MAAyB,KAAA;AAAA,KAAc,CAAA,CAAA;AAAA,GAC1C,MAAA;AACL,IAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA;AAAA,MAAoB,KAAA;AAAA,KAAc,CAAA,CAAA;AAAA,GAC5C;AACF;;;;"}

package/dist/esm/variables/constants.js

@@ -3,6 +3,7 @@ const ALL_VARIABLE_VALUE = "$__all";
 const AUTO_VARIABLE_TEXT = "Auto";
 const AUTO_VARIABLE_VALUE = "$__auto";
 const VARIABLE_REGEX = /\$(\w+)|\[\[(\w+?)(?::(\w+))?\]\]|\${(\w+)(?:\.([^:^\}]+))?(?::([^\}]+))?}/g;
+const SEARCH_FILTER_VARIABLE = "__searchFilter";
 
-export { ALL_VARIABLE_TEXT, ALL_VARIABLE_VALUE, AUTO_VARIABLE_TEXT, AUTO_VARIABLE_VALUE, VARIABLE_REGEX };
+export { ALL_VARIABLE_TEXT, ALL_VARIABLE_VALUE, AUTO_VARIABLE_TEXT, AUTO_VARIABLE_VALUE, SEARCH_FILTER_VARIABLE, VARIABLE_REGEX };
 //# sourceMappingURL=constants.js.map

package/dist/esm/variables/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../src/variables/constants.ts"],"sourcesContent":["export const ALL_VARIABLE_TEXT = 'All';\nexport const ALL_VARIABLE_VALUE = '$__all';\nexport const NONE_VARIABLE_TEXT = 'None';\nexport const NONE_VARIABLE_VALUE = '';\nexport const AUTO_VARIABLE_TEXT = 'Auto';\nexport const AUTO_VARIABLE_VALUE = '$__auto';\n\n// Grafana core source: https://github.com/grafana/grafana/blob/main/public/app/features/variables/utils.ts#L23\n/*\n * This regex matches 3 types of variable reference with an optional format specifier\n * \\$(\\w+)                          $var1\n * \\[\\[(\\w+?)(?::(\\w+))?\\]\\]        [[var2]] or [[var2:fmt2]]\n * \\${(\\w+)(?::(\\w+))?}             ${var3} or ${var3:fmt3}\n */\nexport const VARIABLE_REGEX = /\\$(\\w+)|\\[\\[(\\w+?)(?::(\\w+))?\\]\\]|\\${(\\w+)(?:\\.([^:^\\}]+))?(?::([^\\}]+))?}/g;\n"],"names":[],"mappings":"AAAO,MAAM,iBAAoB,GAAA,MAAA;AAC1B,MAAM,kBAAqB,GAAA,SAAA;AAG3B,MAAM,kBAAqB,GAAA,OAAA;AAC3B,MAAM,mBAAsB,GAAA,UAAA;AAS5B,MAAM,cAAiB,GAAA;;;;"}
+{"version":3,"file":"constants.js","sources":["../../../src/variables/constants.ts"],"sourcesContent":["export const ALL_VARIABLE_TEXT = 'All';\nexport const ALL_VARIABLE_VALUE = '$__all';\nexport const NONE_VARIABLE_TEXT = 'None';\nexport const NONE_VARIABLE_VALUE = '';\nexport const AUTO_VARIABLE_TEXT = 'Auto';\nexport const AUTO_VARIABLE_VALUE = '$__auto';\n\n// Grafana core source: https://github.com/grafana/grafana/blob/main/public/app/features/variables/utils.ts#L23\n/*\n * This regex matches 3 types of variable reference with an optional format specifier\n * \\$(\\w+)                          $var1\n * \\[\\[(\\w+?)(?::(\\w+))?\\]\\]        [[var2]] or [[var2:fmt2]]\n * \\${(\\w+)(?::(\\w+))?}             ${var3} or ${var3:fmt3}\n */\nexport const VARIABLE_REGEX = /\\$(\\w+)|\\[\\[(\\w+?)(?::(\\w+))?\\]\\]|\\${(\\w+)(?:\\.([^:^\\}]+))?(?::([^\\}]+))?}/g;\nexport const SEARCH_FILTER_VARIABLE = '__searchFilter';\n"],"names":[],"mappings":"AAAO,MAAM,iBAAoB,GAAA,MAAA;AAC1B,MAAM,kBAAqB,GAAA,SAAA;AAG3B,MAAM,kBAAqB,GAAA,OAAA;AAC3B,MAAM,mBAAsB,GAAA,UAAA;AAS5B,MAAM,cAAiB,GAAA,8EAAA;AACvB,MAAM,sBAAyB,GAAA;;;;"}