@grafana/scenes 0.0.12 → 0.0.14

package/dist/esm/components/EmbeddedScene.js

@@ -41,7 +41,7 @@ function getStyles(theme) {
     container: css({
       flexGrow: 1,
       display: "flex",
-      gap: "8px",
+      gap: theme.spacing(2),
       minHeight: "100%",
       flexDirection: "column"
     }),
@@ -53,7 +53,8 @@ function getStyles(theme) {
     controls: css({
       display: "flex",
       gap: theme.spacing(1),
-      alignItems: "center"
+      alignItems: "center",
+      flexWrap: "wrap"
     })
   };
 }

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

@@ -1 +1 @@
-{"version":3,"file":"EmbeddedScene.js","sources":["../../../src/components/EmbeddedScene.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2 } from '@grafana/ui';\nimport React from 'react';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { SceneComponentProps, SceneObjectStatePlain, SceneObject } from '../core/types';\nimport { UrlSyncManager } from '../services/UrlSyncManager';\n\nexport interface EmbeddedSceneState extends SceneObjectStatePlain {\n  /**\n   * The main content of the scene (usually a SceneFlexLayout)\n   */\n  body: SceneObject;\n  /**\n   * Top row of variable selectors, filters, time pickers and custom actions.\n   */\n  controls?: SceneObject[];\n}\n\nexport class EmbeddedScene extends SceneObjectBase<EmbeddedSceneState> {\n  public static Component = EmbeddedSceneRenderer;\n\n  private urlSyncManager?: UrlSyncManager;\n\n  /**\n   * initUrlSync should be called before the scene is rendered to ensure that objects are in sync\n   * before they get activated. This saves some unnecessary re-renders and makes sure variables\n   * queries are issued as needed.\n   */\n  public initUrlSync() {\n    this.urlSyncManager = new UrlSyncManager(this);\n    this.urlSyncManager.initSync();\n  }\n\n  public activate() {\n    super.activate();\n  }\n\n  public deactivate() {\n    super.deactivate();\n    if (this.urlSyncManager) {\n      this.urlSyncManager!.cleanUp();\n    }\n  }\n}\n\nfunction EmbeddedSceneRenderer({ model }: SceneComponentProps<EmbeddedScene>) {\n  const { body, controls } = model.useState();\n  const styles = useStyles2(getStyles);\n\n  return (\n    <div className={styles.container}>\n      {controls && (\n        <div className={styles.controls}>\n          {controls.map((control) => (\n            <control.Component key={control.state.key} model={control} />\n          ))}\n        </div>\n      )}\n      <div className={styles.body}>\n        <body.Component model={body} />\n      </div>\n    </div>\n  );\n}\n\nfunction getStyles(theme: GrafanaTheme2) {\n  return {\n    container: css({\n      flexGrow: 1,\n      display: 'flex',\n      gap: '8px',\n      minHeight: '100%',\n      flexDirection: 'column',\n    }),\n    body: css({\n      flexGrow: 1,\n      display: 'flex',\n      gap: '8px',\n    }),\n    controls: css({\n      display: 'flex',\n      gap: theme.spacing(1),\n      alignItems: 'center',\n    }),\n  };\n}\n"],"names":[],"mappings":";;;;;;AAoBO,MAAM,sBAAsB,eAAoC,CAAA;AAAA,EAU9D,WAAc,GAAA;AACnB,IAAK,IAAA,CAAA,cAAA,GAAiB,IAAI,cAAA,CAAe,IAAI,CAAA,CAAA;AAC7C,IAAA,IAAA,CAAK,eAAe,QAAS,EAAA,CAAA;AAAA,GAC/B;AAAA,EAEO,QAAW,GAAA;AAChB,IAAA,KAAA,CAAM,QAAS,EAAA,CAAA;AAAA,GACjB;AAAA,EAEO,UAAa,GAAA;AAClB,IAAA,KAAA,CAAM,UAAW,EAAA,CAAA;AACjB,IAAA,IAAI,KAAK,cAAgB,EAAA;AACvB,MAAA,IAAA,CAAK,eAAgB,OAAQ,EAAA,CAAA;AAAA,KAC/B;AAAA,GACF;AACF,CAAA;AAzBa,aAAA,CACG,SAAY,GAAA,qBAAA,CAAA;AA0B5B,SAAS,qBAAA,CAAsB,EAAE,KAAA,EAA6C,EAAA;AAC5E,EAAA,MAAM,EAAE,IAAA,EAAM,QAAS,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AAC1C,EAAM,MAAA,MAAA,GAAS,WAAW,SAAS,CAAA,CAAA;AAEnC,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,MAAO,CAAA,SAAA;AAAA,GAAA,EACpB,4BACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,MAAO,CAAA,QAAA;AAAA,GAAA,EACpB,SAAS,GAAI,CAAA,CAAC,OACb,qBAAA,KAAA,CAAA,aAAA,CAAC,QAAQ,SAAR,EAAA;AAAA,IAAkB,GAAA,EAAK,QAAQ,KAAM,CAAA,GAAA;AAAA,IAAK,KAAO,EAAA,OAAA;AAAA,GAAS,CAC5D,CACH,CAAA,kBAED,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,MAAO,CAAA,IAAA;AAAA,GACrB,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAK,SAAL,EAAA;AAAA,IAAe,KAAO,EAAA,IAAA;AAAA,GAAM,CAC/B,CACF,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,UAAU,KAAsB,EAAA;AACvC,EAAO,OAAA;AAAA,IACL,WAAW,GAAI,CAAA;AAAA,MACb,QAAU,EAAA,CAAA;AAAA,MACV,OAAS,EAAA,MAAA;AAAA,MACT,GAAK,EAAA,KAAA;AAAA,MACL,SAAW,EAAA,MAAA;AAAA,MACX,aAAe,EAAA,QAAA;AAAA,KAChB,CAAA;AAAA,IACD,MAAM,GAAI,CAAA;AAAA,MACR,QAAU,EAAA,CAAA;AAAA,MACV,OAAS,EAAA,MAAA;AAAA,MACT,GAAK,EAAA,KAAA;AAAA,KACN,CAAA;AAAA,IACD,UAAU,GAAI,CAAA;AAAA,MACZ,OAAS,EAAA,MAAA;AAAA,MACT,GAAA,EAAK,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MACpB,UAAY,EAAA,QAAA;AAAA,KACb,CAAA;AAAA,GACH,CAAA;AACF;;;;"}
+{"version":3,"file":"EmbeddedScene.js","sources":["../../../src/components/EmbeddedScene.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2 } from '@grafana/ui';\nimport React from 'react';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { SceneComponentProps, SceneObjectStatePlain, SceneObject } from '../core/types';\nimport { UrlSyncManager } from '../services/UrlSyncManager';\n\nexport interface EmbeddedSceneState extends SceneObjectStatePlain {\n  /**\n   * The main content of the scene (usually a SceneFlexLayout)\n   */\n  body: SceneObject;\n  /**\n   * Top row of variable selectors, filters, time pickers and custom actions.\n   */\n  controls?: SceneObject[];\n}\n\nexport class EmbeddedScene extends SceneObjectBase<EmbeddedSceneState> {\n  public static Component = EmbeddedSceneRenderer;\n\n  private urlSyncManager?: UrlSyncManager;\n\n  /**\n   * initUrlSync should be called before the scene is rendered to ensure that objects are in sync\n   * before they get activated. This saves some unnecessary re-renders and makes sure variables\n   * queries are issued as needed.\n   */\n  public initUrlSync() {\n    this.urlSyncManager = new UrlSyncManager(this);\n    this.urlSyncManager.initSync();\n  }\n\n  public activate() {\n    super.activate();\n  }\n\n  public deactivate() {\n    super.deactivate();\n    if (this.urlSyncManager) {\n      this.urlSyncManager!.cleanUp();\n    }\n  }\n}\n\nfunction EmbeddedSceneRenderer({ model }: SceneComponentProps<EmbeddedScene>) {\n  const { body, controls } = model.useState();\n  const styles = useStyles2(getStyles);\n\n  return (\n    <div className={styles.container}>\n      {controls && (\n        <div className={styles.controls}>\n          {controls.map((control) => (\n            <control.Component key={control.state.key} model={control} />\n          ))}\n        </div>\n      )}\n      <div className={styles.body}>\n        <body.Component model={body} />\n      </div>\n    </div>\n  );\n}\n\nfunction getStyles(theme: GrafanaTheme2) {\n  return {\n    container: css({\n      flexGrow: 1,\n      display: 'flex',\n      gap: theme.spacing(2),\n      minHeight: '100%',\n      flexDirection: 'column',\n    }),\n    body: css({\n      flexGrow: 1,\n      display: 'flex',\n      gap: '8px',\n    }),\n    controls: css({\n      display: 'flex',\n      gap: theme.spacing(1),\n      alignItems: 'center',\n      flexWrap: 'wrap',\n    }),\n  };\n}\n"],"names":[],"mappings":";;;;;;AAoBO,MAAM,sBAAsB,eAAoC,CAAA;AAAA,EAU9D,WAAc,GAAA;AACnB,IAAK,IAAA,CAAA,cAAA,GAAiB,IAAI,cAAA,CAAe,IAAI,CAAA,CAAA;AAC7C,IAAA,IAAA,CAAK,eAAe,QAAS,EAAA,CAAA;AAAA,GAC/B;AAAA,EAEO,QAAW,GAAA;AAChB,IAAA,KAAA,CAAM,QAAS,EAAA,CAAA;AAAA,GACjB;AAAA,EAEO,UAAa,GAAA;AAClB,IAAA,KAAA,CAAM,UAAW,EAAA,CAAA;AACjB,IAAA,IAAI,KAAK,cAAgB,EAAA;AACvB,MAAA,IAAA,CAAK,eAAgB,OAAQ,EAAA,CAAA;AAAA,KAC/B;AAAA,GACF;AACF,CAAA;AAzBa,aAAA,CACG,SAAY,GAAA,qBAAA,CAAA;AA0B5B,SAAS,qBAAA,CAAsB,EAAE,KAAA,EAA6C,EAAA;AAC5E,EAAA,MAAM,EAAE,IAAA,EAAM,QAAS,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AAC1C,EAAM,MAAA,MAAA,GAAS,WAAW,SAAS,CAAA,CAAA;AAEnC,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,MAAO,CAAA,SAAA;AAAA,GAAA,EACpB,4BACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,MAAO,CAAA,QAAA;AAAA,GAAA,EACpB,SAAS,GAAI,CAAA,CAAC,OACb,qBAAA,KAAA,CAAA,aAAA,CAAC,QAAQ,SAAR,EAAA;AAAA,IAAkB,GAAA,EAAK,QAAQ,KAAM,CAAA,GAAA;AAAA,IAAK,KAAO,EAAA,OAAA;AAAA,GAAS,CAC5D,CACH,CAAA,kBAED,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,MAAO,CAAA,IAAA;AAAA,GACrB,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAK,SAAL,EAAA;AAAA,IAAe,KAAO,EAAA,IAAA;AAAA,GAAM,CAC/B,CACF,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,UAAU,KAAsB,EAAA;AACvC,EAAO,OAAA;AAAA,IACL,WAAW,GAAI,CAAA;AAAA,MACb,QAAU,EAAA,CAAA;AAAA,MACV,OAAS,EAAA,MAAA;AAAA,MACT,GAAA,EAAK,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MACpB,SAAW,EAAA,MAAA;AAAA,MACX,aAAe,EAAA,QAAA;AAAA,KAChB,CAAA;AAAA,IACD,MAAM,GAAI,CAAA;AAAA,MACR,QAAU,EAAA,CAAA;AAAA,MACV,OAAS,EAAA,MAAA;AAAA,MACT,GAAK,EAAA,KAAA;AAAA,KACN,CAAA;AAAA,IACD,UAAU,GAAI,CAAA;AAAA,MACZ,OAAS,EAAA,MAAA;AAAA,MACT,GAAA,EAAK,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MACpB,UAAY,EAAA,QAAA;AAAA,MACZ,QAAU,EAAA,MAAA;AAAA,KACX,CAAA;AAAA,GACH,CAAA;AACF;;;;"}

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

@@ -0,0 +1,164 @@
+import React, { useState, useEffect } from 'react';
+import { Switch, Route, useRouteMatch } from 'react-router-dom';
+import { PluginPage } from '@grafana/runtime';
+import { SceneObjectBase } from '../../core/SceneObjectBase.js';
+import { useAppQueryParams, getLinkUrlWithAppUrlState } from './utils.js';
+
+const sceneCache = /* @__PURE__ */ new Map();
+class SceneApp extends SceneObjectBase {
+}
+SceneApp.Component = ({ model }) => {
+  const { pages } = model.useState();
+  return /* @__PURE__ */ React.createElement(Switch, null, pages.map((page) => /* @__PURE__ */ React.createElement(Route, {
+    key: page.state.url,
+    exact: false,
+    path: page.state.url,
+    render: () => {
+      return page && /* @__PURE__ */ React.createElement(page.Component, {
+        model: page
+      });
+    }
+  })));
+};
+class SceneAppPage extends SceneObjectBase {
+}
+SceneAppPage.Component = SceneAppPageRenderer;
+function SceneAppPageRenderer({ model }) {
+  var _a;
+  const { tabs, drilldowns, url, routePath } = model.state;
+  const routes = [];
+  if (tabs) {
+    for (const page2 of tabs) {
+      routes.push(
+        /* @__PURE__ */ React.createElement(Route, {
+          exact: true,
+          key: page2.state.url,
+          path: (_a = page2.state.routePath) != null ? _a : page2.state.url,
+          render: () => {
+            return /* @__PURE__ */ React.createElement(page2.Component, {
+              model: page2
+            });
+          }
+        })
+      );
+      if (page2.state.drilldowns) {
+        for (const drilldown of page2.state.drilldowns) {
+          routes.push(
+            /* @__PURE__ */ React.createElement(Route, {
+              exact: false,
+              key: drilldown.routePath,
+              path: drilldown.routePath,
+              render: () => {
+                return /* @__PURE__ */ React.createElement(SceneAppDrilldownViewRender, {
+                  drilldown,
+                  parent: page2
+                });
+              }
+            })
+          );
+        }
+      }
+    }
+    return /* @__PURE__ */ React.createElement(Switch, null, routes);
+  }
+  if (drilldowns) {
+    for (const drilldown of drilldowns) {
+      routes.push(
+        /* @__PURE__ */ React.createElement(Route, {
+          key: drilldown.routePath,
+          exact: false,
+          path: drilldown.routePath,
+          render: () => {
+            return /* @__PURE__ */ React.createElement(SceneAppDrilldownViewRender, {
+              drilldown,
+              parent: model
+            });
+          }
+        })
+      );
+    }
+  }
+  let page = /* @__PURE__ */ React.createElement(ScenePageRenderer, {
+    page: model
+  });
+  if (model.parent instanceof SceneAppPage) {
+    page = /* @__PURE__ */ React.createElement(ScenePageRenderer, {
+      page: model.parent,
+      activeTab: model,
+      tabs: model.parent.state.tabs
+    });
+  }
+  return /* @__PURE__ */ React.createElement(Switch, null, /* @__PURE__ */ React.createElement(Route, {
+    key: url,
+    exact: true,
+    path: routePath != null ? routePath : url,
+    render: () => {
+      return page;
+    }
+  }), routes);
+}
+function ScenePageRenderer({ page, tabs, activeTab }) {
+  const [isInitialized, setIsInitialized] = useState(false);
+  const params = useAppQueryParams();
+  const routeMatch = useRouteMatch();
+  let scene = sceneCache.get(routeMatch.url);
+  if (!scene) {
+    scene = activeTab ? activeTab.state.getScene(routeMatch) : page.state.getScene(routeMatch);
+    sceneCache.set(routeMatch.url, scene);
+  }
+  useEffect(() => {
+    if (!isInitialized && scene) {
+      scene.initUrlSync();
+      setIsInitialized(true);
+    }
+  }, [isInitialized, scene]);
+  if (!isInitialized) {
+    return null;
+  }
+  const pageNav = {
+    text: page.state.title,
+    subTitle: page.state.subTitle,
+    url: getLinkUrlWithAppUrlState(page.state.url, params, page.state.preserveUrlKeys),
+    hideFromBreadcrumbs: page.state.hideFromBreadcrumbs,
+    parentItem: getParentBreadcrumbs(page.state.getParentPage ? page.state.getParentPage() : page.parent, params)
+  };
+  if (tabs) {
+    pageNav.children = tabs.map((tab) => {
+      return {
+        text: tab.state.title,
+        active: activeTab === tab,
+        url: getLinkUrlWithAppUrlState(tab.state.url, params, tab.state.preserveUrlKeys),
+        parentItem: pageNav
+      };
+    });
+  }
+  return /* @__PURE__ */ React.createElement(PluginPage, {
+    pageNav
+  }, /* @__PURE__ */ React.createElement(scene.Component, {
+    model: scene
+  }));
+}
+function SceneAppDrilldownViewRender(props) {
+  const routeMatch = useRouteMatch();
+  const scene = props.drilldown.getPage(routeMatch, props.parent);
+  return /* @__PURE__ */ React.createElement(scene.Component, {
+    model: scene
+  });
+}
+function getParentBreadcrumbs(parent, params) {
+  if (parent instanceof SceneAppPage) {
+    return {
+      text: parent.state.title,
+      url: getLinkUrlWithAppUrlState(parent.state.url, params, parent.state.preserveUrlKeys),
+      hideFromBreadcrumbs: parent.state.hideFromBreadcrumbs,
+      parentItem: getParentBreadcrumbs(
+        parent.state.getParentPage ? parent.state.getParentPage() : parent.parent,
+        params
+      )
+    };
+  }
+  return void 0;
+}
+
+export { SceneApp, SceneAppDrilldownViewRender, SceneAppPage };
+//# sourceMappingURL=SceneApp.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SceneApp.js","sources":["../../../../src/components/SceneApp/SceneApp.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Route, Switch, useRouteMatch } from 'react-router-dom';\n\nimport { NavModelItem, UrlQueryMap } from '@grafana/data';\nimport { PluginPage } from '@grafana/runtime';\n\nimport { SceneComponentProps, SceneObject, SceneObjectStatePlain } from '../../core/types';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { getLinkUrlWithAppUrlState, useAppQueryParams } from './utils';\nimport { EmbeddedScene } from '../EmbeddedScene';\n\nconst sceneCache = new Map<string, EmbeddedScene>();\n\nexport interface SceneAppState extends SceneObjectStatePlain {\n  // Array of SceneAppPage objects that are considered app's top level pages\n  pages: SceneAppPage[];\n}\n\nexport interface SceneRouteMatch<Params extends { [K in keyof Params]?: string } = {}> {\n  params: Params;\n  isExact: boolean;\n  path: string;\n  url: string;\n}\n\nexport interface SceneAppRoute {\n  path: string;\n  page?: SceneAppPage;\n  drilldown?: SceneAppDrilldownView;\n}\n\n/**\n * Responsible for top level pages routing\n */\nexport class SceneApp extends SceneObjectBase<SceneAppState> {\n  public static Component = ({ model }: SceneComponentProps<SceneApp>) => {\n    const { pages } = model.useState();\n\n    return (\n      <Switch>\n        {pages.map((page) => (\n          <Route\n            key={page.state.url}\n            exact={false}\n            path={page.state.url}\n            render={() => {\n              return page && <page.Component model={page} />;\n            }}\n          ></Route>\n        ))}\n      </Switch>\n    );\n  };\n}\n\nexport interface SceneAppPageState extends SceneObjectStatePlain {\n  title: string;\n  subTitle?: string;\n  // Use to provide page absolute URL, i.e. /app/overview\n  url: string;\n  // Use to provide parametrized page URL, i.e. /app/overview/:clusterId\n  routePath?: string;\n  // Whether or not page should be visible in the breadcrumbs path\n  hideFromBreadcrumbs?: boolean;\n  // Array of SceneAppPage objects that are used as page tabs displayed on top of the page\n  tabs?: SceneAppPage[];\n  // Function that returns a scene object for the page\n  getScene: (routeMatch: SceneRouteMatch) => EmbeddedScene;\n  // Array of scenes used for drilldown views\n  drilldowns?: SceneAppDrilldownView[];\n  // Function that returns a parent page object, used to create breadcrumbs structure\n  getParentPage?: () => SceneAppPage;\n  // Array of query params that will be preserved in breadcrumb and page tab links, i.e. ['from', 'to', 'var-datacenter',...]\n  preserveUrlKeys?: string[];\n}\n\n/**\n * Responsible for page's drilldown & tabs routing\n */\nexport class SceneAppPage extends SceneObjectBase<SceneAppPageState> {\n  public static Component = SceneAppPageRenderer;\n}\n\nfunction SceneAppPageRenderer({ model }: SceneComponentProps<SceneAppPage>) {\n  const { tabs, drilldowns, url, routePath } = model.state;\n  const routes: React.ReactNode[] = [];\n\n  if (tabs) {\n    for (const page of tabs) {\n      routes.push(\n        <Route\n          exact={true}\n          key={page.state.url}\n          path={page.state.routePath ?? page.state.url}\n          render={() => {\n            return <page.Component model={page} />;\n          }}\n        ></Route>\n      );\n\n      if (page.state.drilldowns) {\n        for (const drilldown of page.state.drilldowns) {\n          routes.push(\n            <Route\n              exact={false}\n              key={drilldown.routePath}\n              path={drilldown.routePath}\n              render={() => {\n                return <SceneAppDrilldownViewRender drilldown={drilldown} parent={page} />;\n              }}\n            ></Route>\n          );\n        }\n      }\n    }\n\n    return <Switch>{routes}</Switch>;\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={() => {\n            return <SceneAppDrilldownViewRender drilldown={drilldown} parent={model} />;\n          }}\n        ></Route>\n      );\n    }\n  }\n\n  let page = <ScenePageRenderer page={model} />;\n\n  // if parent is a SceneAppPage we are a tab\n  if (model.parent instanceof SceneAppPage) {\n    page = <ScenePageRenderer page={model.parent} activeTab={model} tabs={model.parent.state.tabs} />;\n  }\n\n  return (\n    <Switch>\n      {/* page route */}\n      <Route\n        key={url}\n        exact={true}\n        path={routePath ?? url}\n        render={() => {\n          return page;\n        }}\n      ></Route>\n\n      {/* drilldown routes */}\n      {routes}\n    </Switch>\n  );\n}\n\ninterface ScenePageRenderProps {\n  page: SceneAppPage;\n  tabs?: SceneAppPage[];\n  activeTab?: SceneAppPage;\n}\n\nfunction ScenePageRenderer({ page, tabs, activeTab }: ScenePageRenderProps) {\n  /**\n   * We use this flag to make sure the URL sync is enabled before the scene is actually rendered.\n   */\n  const [isInitialized, setIsInitialized] = useState(false);\n  const params = useAppQueryParams();\n  const routeMatch = useRouteMatch();\n\n  let scene = sceneCache.get(routeMatch!.url);\n  if (!scene) {\n    // If we are rendering a tab, we need to get the scene f  rom the tab, otherwise, use page's scene\n    scene = activeTab ? activeTab.state.getScene(routeMatch) : page.state.getScene(routeMatch);\n    sceneCache.set(routeMatch!.url, scene);\n  }\n\n  useEffect(() => {\n    // Before rendering scene components, we are making sure the URL sync is enabled for.\n    if (!isInitialized && scene) {\n      scene.initUrlSync();\n      setIsInitialized(true);\n    }\n  }, [isInitialized, scene]);\n\n  if (!isInitialized) {\n    return null;\n  }\n\n  const pageNav: NavModelItem = {\n    text: page.state.title,\n    subTitle: page.state.subTitle,\n    url: getLinkUrlWithAppUrlState(page.state.url, params, page.state.preserveUrlKeys),\n    hideFromBreadcrumbs: page.state.hideFromBreadcrumbs,\n    parentItem: getParentBreadcrumbs(page.state.getParentPage ? page.state.getParentPage() : page.parent, params),\n  };\n\n  if (tabs) {\n    pageNav.children = tabs.map((tab) => {\n      return {\n        text: tab.state.title,\n        active: activeTab === tab,\n        url: getLinkUrlWithAppUrlState(tab.state.url, params, tab.state.preserveUrlKeys),\n        parentItem: pageNav,\n      };\n    });\n  }\n\n  return (\n    <PluginPage pageNav={pageNav} /*hideFooter={true}*/>\n      <scene.Component model={scene} />\n    </PluginPage>\n  );\n}\n\nexport interface SceneAppDrilldownView {\n  // Use to provide parametrized drilldown URL, i.e. /app/clusters/:clusterId\n  routePath: string;\n  // Function that returns a page object for a given drilldown route match. Use parent to configure drilldown view parent SceneAppPage via getParentPage method.\n  getPage: (routeMatch: SceneRouteMatch<any>, parent: SceneAppPage) => SceneAppPage;\n}\n\nexport function SceneAppDrilldownViewRender(props: { drilldown: SceneAppDrilldownView; parent: SceneAppPage }) {\n  const routeMatch = useRouteMatch();\n  const scene = props.drilldown.getPage(routeMatch, props.parent);\n  return <scene.Component model={scene} />;\n}\n\nfunction getParentBreadcrumbs(parent: SceneObject | undefined, params: UrlQueryMap): NavModelItem | undefined {\n  if (parent instanceof SceneAppPage) {\n    return {\n      text: parent.state.title,\n      url: getLinkUrlWithAppUrlState(parent.state.url, params, parent.state.preserveUrlKeys),\n      hideFromBreadcrumbs: parent.state.hideFromBreadcrumbs,\n      parentItem: getParentBreadcrumbs(\n        parent.state.getParentPage ? parent.state.getParentPage() : parent.parent,\n        params\n      ),\n    };\n  }\n\n  return undefined;\n}\n"],"names":["page"],"mappings":"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"}

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

@@ -0,0 +1,38 @@
+import { useLocation } from 'react-router-dom';
+import { urlUtil } from '@grafana/data';
+import { locationSearchToObject } from '@grafana/runtime';
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+function useAppQueryParams() {
+  const location = useLocation();
+  return locationSearchToObject(location.search || "");
+}
+function getLinkUrlWithAppUrlState(path, params, preserveParams) {
+  const paramsCopy = __spreadValues({}, params);
+  if (preserveParams) {
+    for (const key of Object.keys(paramsCopy)) {
+      if (!preserveParams.includes(key)) {
+        delete paramsCopy[key];
+      }
+    }
+  }
+  return urlUtil.renderUrl(path, paramsCopy);
+}
+
+export { getLinkUrlWithAppUrlState, useAppQueryParams };
+//# sourceMappingURL=utils.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../../../src/components/SceneApp/utils.ts"],"sourcesContent":["import { useLocation } from 'react-router-dom';\n\nimport { UrlQueryMap, urlUtil } from '@grafana/data';\nimport { locationSearchToObject } from '@grafana/runtime';\n\nexport function useAppQueryParams() {\n  const location = useLocation();\n  return locationSearchToObject(location.search || '');\n}\n\nexport function getLinkUrlWithAppUrlState(path: string, params: UrlQueryMap, preserveParams?: string[]): string {\n  // make a copy of params as the renderUrl function mutates the object\n  const paramsCopy = { ...params };\n\n  if (preserveParams) {\n    for (const key of Object.keys(paramsCopy)) {\n      // if param is not in preserveParams, remove it\n      if (!preserveParams.includes(key)) {\n        delete paramsCopy[key];\n      }\n    }\n  }\n\n  return urlUtil.renderUrl(path, paramsCopy);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAKO,SAAS,iBAAoB,GAAA;AAClC,EAAA,MAAM,WAAW,WAAY,EAAA,CAAA;AAC7B,EAAO,OAAA,sBAAA,CAAuB,QAAS,CAAA,MAAA,IAAU,EAAE,CAAA,CAAA;AACrD,CAAA;AAEgB,SAAA,yBAAA,CAA0B,IAAc,EAAA,MAAA,EAAqB,cAAmC,EAAA;AAE9G,EAAA,MAAM,aAAa,cAAK,CAAA,EAAA,EAAA,MAAA,CAAA,CAAA;AAExB,EAAA,IAAI,cAAgB,EAAA;AAClB,IAAA,KAAA,MAAW,GAAO,IAAA,MAAA,CAAO,IAAK,CAAA,UAAU,CAAG,EAAA;AAEzC,MAAA,IAAI,CAAC,cAAA,CAAe,QAAS,CAAA,GAAG,CAAG,EAAA;AACjC,QAAA,OAAO,UAAW,CAAA,GAAA,CAAA,CAAA;AAAA,OACpB;AAAA,KACF;AAAA,GACF;AAEA,EAAO,OAAA,OAAA,CAAQ,SAAU,CAAA,IAAA,EAAM,UAAU,CAAA,CAAA;AAC3C;;;;"}

package/dist/esm/components/SceneTimePicker.js

@@ -33,7 +33,8 @@ function SceneTimePickerRenderer({ model }) {
     }
   }), /* @__PURE__ */ React.createElement(RefreshPicker, {
     onRefresh: timeRange.onRefresh,
-    onIntervalChanged: timeRange.onIntervalChanged
+    onIntervalChanged: () => {
+    }
   }));
 }
 

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

@@ -1 +1 @@
-{"version":3,"file":"SceneTimePicker.js","sources":["../../../src/components/SceneTimePicker.tsx"],"sourcesContent":["import React from 'react';\n\nimport { RefreshPicker, TimeRangePicker, ToolbarButtonRow } from '@grafana/ui';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { sceneGraph } from '../core/sceneGraph';\nimport { SceneComponentProps, SceneObjectStatePlain } from '../core/types';\n\nexport interface SceneTimePickerState extends SceneObjectStatePlain {\n  hidePicker?: boolean;\n  isOnCanvas?: boolean;\n}\n\nexport class SceneTimePicker extends SceneObjectBase<SceneTimePickerState> {\n  public static Component = SceneTimePickerRenderer;\n}\n\nfunction SceneTimePickerRenderer({ model }: SceneComponentProps<SceneTimePicker>) {\n  const { hidePicker, isOnCanvas } = model.useState();\n  const timeRange = sceneGraph.getTimeRange(model);\n  const timeRangeState = timeRange.useState();\n\n  if (hidePicker) {\n    return null;\n  }\n\n  return (\n    <ToolbarButtonRow alignment=\"right\">\n      <TimeRangePicker\n        isOnCanvas={isOnCanvas}\n        value={timeRangeState.value}\n        onChange={timeRange.onTimeRangeChange}\n        timeZone={'browser'}\n        fiscalYearStartMonth={0}\n        onMoveBackward={() => {}}\n        onMoveForward={() => {}}\n        onZoom={() => {}}\n        onChangeTimeZone={() => {}}\n        onChangeFiscalYearStartMonth={() => {}}\n      />\n\n      <RefreshPicker onRefresh={timeRange.onRefresh} onIntervalChanged={timeRange.onIntervalChanged} />\n    </ToolbarButtonRow>\n  );\n}\n"],"names":[],"mappings":";;;;;AAaO,MAAM,wBAAwB,eAAsC,CAAA;AAE3E,CAAA;AAFa,eAAA,CACG,SAAY,GAAA,uBAAA,CAAA;AAG5B,SAAS,uBAAA,CAAwB,EAAE,KAAA,EAA+C,EAAA;AAChF,EAAA,MAAM,EAAE,UAAA,EAAY,UAAW,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AAClD,EAAM,MAAA,SAAA,GAAY,UAAW,CAAA,YAAA,CAAa,KAAK,CAAA,CAAA;AAC/C,EAAM,MAAA,cAAA,GAAiB,UAAU,QAAS,EAAA,CAAA;AAE1C,EAAA,IAAI,UAAY,EAAA;AACd,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,gBAAA,EAAA;AAAA,IAAiB,SAAU,EAAA,OAAA;AAAA,GAAA,kBACzB,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA;AAAA,IACC,UAAA;AAAA,IACA,OAAO,cAAe,CAAA,KAAA;AAAA,IACtB,UAAU,SAAU,CAAA,iBAAA;AAAA,IACpB,QAAU,EAAA,SAAA;AAAA,IACV,oBAAsB,EAAA,CAAA;AAAA,IACtB,gBAAgB,MAAM;AAAA,KAAC;AAAA,IACvB,eAAe,MAAM;AAAA,KAAC;AAAA,IACtB,QAAQ,MAAM;AAAA,KAAC;AAAA,IACf,kBAAkB,MAAM;AAAA,KAAC;AAAA,IACzB,8BAA8B,MAAM;AAAA,KAAC;AAAA,GACvC,mBAEC,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA;AAAA,IAAc,WAAW,SAAU,CAAA,SAAA;AAAA,IAAW,mBAAmB,SAAU,CAAA,iBAAA;AAAA,GAAmB,CACjG,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"SceneTimePicker.js","sources":["../../../src/components/SceneTimePicker.tsx"],"sourcesContent":["import React from 'react';\n\nimport { RefreshPicker, TimeRangePicker, ToolbarButtonRow } from '@grafana/ui';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { sceneGraph } from '../core/sceneGraph';\nimport { SceneComponentProps, SceneObjectStatePlain } from '../core/types';\n\nexport interface SceneTimePickerState extends SceneObjectStatePlain {\n  hidePicker?: boolean;\n  isOnCanvas?: boolean;\n}\n\nexport class SceneTimePicker extends SceneObjectBase<SceneTimePickerState> {\n  public static Component = SceneTimePickerRenderer;\n}\n\nfunction SceneTimePickerRenderer({ model }: SceneComponentProps<SceneTimePicker>) {\n  const { hidePicker, isOnCanvas } = model.useState();\n  const timeRange = sceneGraph.getTimeRange(model);\n  const timeRangeState = timeRange.useState();\n\n  if (hidePicker) {\n    return null;\n  }\n\n  return (\n    <ToolbarButtonRow alignment=\"right\">\n      <TimeRangePicker\n        isOnCanvas={isOnCanvas}\n        value={timeRangeState.value}\n        onChange={timeRange.onTimeRangeChange}\n        timeZone={'browser'}\n        fiscalYearStartMonth={0}\n        onMoveBackward={() => {}}\n        onMoveForward={() => {}}\n        onZoom={() => {}}\n        onChangeTimeZone={() => {}}\n        onChangeFiscalYearStartMonth={() => {}}\n      />\n      <RefreshPicker onRefresh={timeRange.onRefresh} onIntervalChanged={() => {}} />\n    </ToolbarButtonRow>\n  );\n}\n"],"names":[],"mappings":";;;;;AAaO,MAAM,wBAAwB,eAAsC,CAAA;AAE3E,CAAA;AAFa,eAAA,CACG,SAAY,GAAA,uBAAA,CAAA;AAG5B,SAAS,uBAAA,CAAwB,EAAE,KAAA,EAA+C,EAAA;AAChF,EAAA,MAAM,EAAE,UAAA,EAAY,UAAW,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AAClD,EAAM,MAAA,SAAA,GAAY,UAAW,CAAA,YAAA,CAAa,KAAK,CAAA,CAAA;AAC/C,EAAM,MAAA,cAAA,GAAiB,UAAU,QAAS,EAAA,CAAA;AAE1C,EAAA,IAAI,UAAY,EAAA;AACd,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,gBAAA,EAAA;AAAA,IAAiB,SAAU,EAAA,OAAA;AAAA,GAAA,kBACzB,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA;AAAA,IACC,UAAA;AAAA,IACA,OAAO,cAAe,CAAA,KAAA;AAAA,IACtB,UAAU,SAAU,CAAA,iBAAA;AAAA,IACpB,QAAU,EAAA,SAAA;AAAA,IACV,oBAAsB,EAAA,CAAA;AAAA,IACtB,gBAAgB,MAAM;AAAA,KAAC;AAAA,IACvB,eAAe,MAAM;AAAA,KAAC;AAAA,IACtB,QAAQ,MAAM;AAAA,KAAC;AAAA,IACf,kBAAkB,MAAM;AAAA,KAAC;AAAA,IACzB,8BAA8B,MAAM;AAAA,KAAC;AAAA,GACvC,mBACC,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA;AAAA,IAAc,WAAW,SAAU,CAAA,SAAA;AAAA,IAAW,mBAAmB,MAAM;AAAA,KAAC;AAAA,GAAG,CAC9E,CAAA,CAAA;AAEJ;;;;"}

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

@@ -39,6 +39,12 @@ function VizPanelRenderer({ model }) {
   if ($data instanceof SceneQueryRunner) {
     $data.setContainerWidth(width);
   }
+  const titleItems = isDraggable ? [dragHandle] : [];
+  if (model.state.$timeRange) {
+    titleItems.push(/* @__PURE__ */ React.createElement(model.state.$timeRange.Component, {
+      model: model.state.$timeRange
+    }));
+  }
   return /* @__PURE__ */ React.createElement("div", {
     ref,
     style: { position: "absolute", width: "100%", height: "100%" }

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, useMemo } from 'react';\nimport { useMeasure } from 'react-use';\n\nimport { PluginContextProvider, useFieldOverrides, ScopedVars, InterpolateFunction } from '@grafana/data';\nimport { getAppEvents } from '@grafana/runtime';\nimport { PanelChrome, ErrorBoundaryAlert, useTheme2 } from '@grafana/ui';\n\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { SceneComponentProps } from '../../core/types';\nimport { SceneQueryRunner } from '../../querying/SceneQueryRunner';\nimport { SceneDragHandle } from '../SceneDragHandle';\n\nimport { VizPanel } from './VizPanel';\nimport { CustomFormatterFn } from '../../variables/interpolation/sceneInterpolator';\n\nexport function VizPanelRenderer({ model }: SceneComponentProps<VizPanel>) {\n  const theme = useTheme2();\n  const replace = useMemo(\n    () => (value: string, scoped?: ScopedVars, format?: string | CustomFormatterFn) =>\n      sceneGraph.interpolate(model, value, scoped, format),\n    [model]\n  ) as InterpolateFunction;\n  const { title, description, options, fieldConfig, pluginId, pluginLoadError, $data, placement } = model.useState();\n  const [ref, { width, height }] = useMeasure();\n  const plugin = model.getPlugin();\n  const { data } = sceneGraph.getData(model).useState();\n  const parentLayout = sceneGraph.getLayout(model);\n\n  // TODO: this should probably be parentLayout.isDraggingEnabled() ? placement?.isDraggable : false\n  // The current logic is not correct, just because parent layout itself is not draggable does not mean children are not\n  const isDraggable = parentLayout.state.placement?.isDraggable ? placement?.isDraggable : false;\n  const dragHandle = <SceneDragHandle layoutKey={parentLayout.state.key!} />;\n\n  const titleInterpolated = replace(title, undefined, 'text');\n\n  // Not sure we need to subscribe to this state\n  const timeZone = sceneGraph.getTimeRange(model).state.timeZone;\n\n  const dataWithOverrides = useFieldOverrides(plugin, fieldConfig, data, timeZone, theme, replace);\n\n  if (pluginLoadError) {\n    return <div>Failed to load plugin: {pluginLoadError}</div>;\n  }\n\n  if (!plugin || !plugin.hasPluginId(pluginId)) {\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  // Query runner needs to with for auto maxDataPoints\n  if ($data instanceof SceneQueryRunner) {\n    $data.setContainerWidth(width);\n  }\n\n  return (\n    <div ref={ref as RefCallback<HTMLDivElement>} style={{ position: 'absolute', width: '100%', height: '100%' }}>\n      <PanelChrome\n        title={titleInterpolated}\n        description={description ? () => replace(description) : ''}\n        loadingState={dataWithOverrides?.state}\n        statusMessage={dataWithOverrides?.error ? dataWithOverrides.error.message : ''}\n        width={width}\n        height={height}\n        titleItems={isDraggable ? [dragHandle] : []}\n      >\n        {(innerWidth, innerHeight) => (\n          <>\n            {!dataWithOverrides && <div>No data...</div>}\n            {dataWithOverrides && (\n              <ErrorBoundaryAlert dependencies={[plugin, data]}>\n                <PluginContextProvider meta={plugin.meta}>\n                  <PanelComponent\n                    id={1}\n                    data={dataWithOverrides}\n                    title={title}\n                    timeRange={dataWithOverrides.timeRange}\n                    timeZone={timeZone}\n                    options={options}\n                    fieldConfig={fieldConfig}\n                    transparent={false}\n                    width={innerWidth}\n                    height={innerHeight}\n                    renderCounter={0}\n                    replaceVariables={replace}\n                    onOptionsChange={model.onOptionsChange}\n                    onFieldConfigChange={model.onFieldConfigChange}\n                    onChangeTimeRange={model.onChangeTimeRange}\n                    eventBus={getAppEvents()}\n                  />\n                </PluginContextProvider>\n              </ErrorBoundaryAlert>\n            )}\n          </>\n        )}\n      </PanelChrome>\n    </div>\n  );\n}\n\nVizPanelRenderer.displayName = 'ScenePanelRenderer';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"VizPanelRenderer.js","sources":["../../../../src/components/VizPanel/VizPanelRenderer.tsx"],"sourcesContent":["import React, { RefCallback, useMemo } from 'react';\nimport { useMeasure } from 'react-use';\n\nimport { PluginContextProvider, useFieldOverrides, ScopedVars, InterpolateFunction } from '@grafana/data';\nimport { getAppEvents } from '@grafana/runtime';\nimport { PanelChrome, ErrorBoundaryAlert, useTheme2 } from '@grafana/ui';\n\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { SceneComponentProps } from '../../core/types';\nimport { SceneQueryRunner } from '../../querying/SceneQueryRunner';\nimport { SceneDragHandle } from '../SceneDragHandle';\n\nimport { VizPanel } from './VizPanel';\nimport { CustomFormatterFn } from '../../variables/interpolation/sceneInterpolator';\n\nexport function VizPanelRenderer({ model }: SceneComponentProps<VizPanel>) {\n  const theme = useTheme2();\n  const replace = useMemo(\n    () => (value: string, scoped?: ScopedVars, format?: string | CustomFormatterFn) =>\n      sceneGraph.interpolate(model, value, scoped, format),\n    [model]\n  ) as InterpolateFunction;\n  const { title, description, options, fieldConfig, pluginId, pluginLoadError, $data, placement } = model.useState();\n  const [ref, { width, height }] = useMeasure();\n  const plugin = model.getPlugin();\n  const { data } = sceneGraph.getData(model).useState();\n  const parentLayout = sceneGraph.getLayout(model);\n\n  // TODO: this should probably be parentLayout.isDraggingEnabled() ? placement?.isDraggable : false\n  // The current logic is not correct, just because parent layout itself is not draggable does not mean children are not\n  const isDraggable = parentLayout.state.placement?.isDraggable ? placement?.isDraggable : false;\n  const dragHandle = <SceneDragHandle layoutKey={parentLayout.state.key!} />;\n\n  const titleInterpolated = replace(title, undefined, 'text');\n\n  // Not sure we need to subscribe to this state\n  const timeZone = sceneGraph.getTimeRange(model).state.timeZone;\n\n  const dataWithOverrides = useFieldOverrides(plugin, fieldConfig, data, timeZone, theme, replace);\n\n  if (pluginLoadError) {\n    return <div>Failed to load plugin: {pluginLoadError}</div>;\n  }\n\n  if (!plugin || !plugin.hasPluginId(pluginId)) {\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  // Query runner needs to with for auto maxDataPoints\n  if ($data instanceof SceneQueryRunner) {\n    $data.setContainerWidth(width);\n  }\n\n  const titleItems: React.ReactNode[] = isDraggable ? [dragHandle] : [];\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} />);\n  }\n\n  return (\n    <div ref={ref as RefCallback<HTMLDivElement>} style={{ position: 'absolute', width: '100%', height: '100%' }}>\n      <PanelChrome\n        title={titleInterpolated}\n        description={description ? () => replace(description) : ''}\n        loadingState={dataWithOverrides?.state}\n        statusMessage={dataWithOverrides?.error ? dataWithOverrides.error.message : ''}\n        width={width}\n        height={height}\n        titleItems={isDraggable ? [dragHandle] : []}\n      >\n        {(innerWidth, innerHeight) => (\n          <>\n            {!dataWithOverrides && <div>No data...</div>}\n            {dataWithOverrides && (\n              <ErrorBoundaryAlert dependencies={[plugin, data]}>\n                <PluginContextProvider meta={plugin.meta}>\n                  <PanelComponent\n                    id={1}\n                    data={dataWithOverrides}\n                    title={title}\n                    timeRange={dataWithOverrides.timeRange}\n                    timeZone={timeZone}\n                    options={options}\n                    fieldConfig={fieldConfig}\n                    transparent={false}\n                    width={innerWidth}\n                    height={innerHeight}\n                    renderCounter={0}\n                    replaceVariables={replace}\n                    onOptionsChange={model.onOptionsChange}\n                    onFieldConfigChange={model.onFieldConfigChange}\n                    onChangeTimeRange={model.onChangeTimeRange}\n                    eventBus={getAppEvents()}\n                  />\n                </PluginContextProvider>\n              </ErrorBoundaryAlert>\n            )}\n          </>\n        )}\n      </PanelChrome>\n    </div>\n  );\n}\n\nVizPanelRenderer.displayName = 'ScenePanelRenderer';\n"],"names":[],"mappings":"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"}

package/dist/esm/core/SceneObjectBase.js

@@ -95,17 +95,23 @@ class SceneObjectBase {
   }
   activate() {
     this._isActive = true;
-    const { $data, $variables } = this.state;
-    if ($data && !$data.isActive) {
-      $data.activate();
+    const { $data, $variables, $timeRange } = this.state;
+    if ($timeRange && !$timeRange.isActive) {
+      $timeRange.activate();
     }
     if ($variables && !$variables.isActive) {
       $variables.activate();
     }
+    if ($data && !$data.isActive) {
+      $data.activate();
+    }
   }
   deactivate() {
     this._isActive = false;
-    const { $data, $variables } = this.state;
+    const { $data, $variables, $timeRange } = this.state;
+    if ($timeRange && $timeRange.isActive) {
+      $timeRange.deactivate();
+    }
     if ($data && $data.isActive) {
       $data.deactivate();
     }

package/dist/esm/core/SceneObjectBase.js.map

@@ -1 +1 @@
-{"version":3,"file":"SceneObjectBase.js","sources":["../../../src/core/SceneObjectBase.tsx"],"sourcesContent":["import { useEffect } from 'react';\nimport { Observer, Subject, Subscription, Unsubscribable } from 'rxjs';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { BusEvent, BusEventHandler, BusEventType, EventBusSrv } from '@grafana/data';\nimport { SceneObject, SceneComponent, SceneObjectState, SceneObjectUrlSyncHandler } from './types';\nimport { useForceUpdate } from '@grafana/ui';\n\nimport { SceneComponentWrapper } from './SceneComponentWrapper';\nimport { SceneObjectStateChangedEvent } from './events';\nimport { cloneSceneObject, forEachSceneObjectInState } from './utils';\nimport { SceneVariableDependencyConfigLike } from '../variables/types';\n\nexport abstract class SceneObjectBase<TState extends SceneObjectState = SceneObjectState>\n  implements SceneObject<TState>\n{\n  private _isActive = false;\n  private _subject = new Subject<TState>();\n  private _state: TState;\n  private _events = new EventBusSrv();\n\n  /** Incremented in SceneComponentWrapper, useful for tests and rendering optimizations */\n  protected _renderCount = 0;\n  protected _parent?: SceneObject;\n  protected _subs = new Subscription();\n\n  protected _variableDependency: SceneVariableDependencyConfigLike | undefined;\n  protected _urlSync: SceneObjectUrlSyncHandler<TState> | undefined;\n\n  public constructor(state: TState) {\n    if (!state.key) {\n      state.key = uuidv4();\n    }\n\n    this._state = Object.freeze(state);\n    this._subject.next(state);\n    this.setParent();\n  }\n\n  /** Current state */\n  public get state(): TState {\n    return this._state;\n  }\n\n  /** True if currently being active (ie displayed for visual objects) */\n  public get isActive(): boolean {\n    return this._isActive;\n  }\n\n  /** Returns the parent, undefined for root object */\n  public get parent(): SceneObject | undefined {\n    return this._parent;\n  }\n\n  /** Returns variable dependency config */\n  public get variableDependency(): SceneVariableDependencyConfigLike | undefined {\n    return this._variableDependency;\n  }\n\n  /** Returns url sync config */\n  public get urlSync(): SceneObjectUrlSyncHandler<TState> | undefined {\n    return this._urlSync;\n  }\n\n  /**\n   * Used in render functions when rendering a SceneObject.\n   * Wraps the component in an EditWrapper that handles edit mode\n   */\n  public get Component(): SceneComponent<this> {\n    return SceneComponentWrapper;\n  }\n\n  /**\n   * Temporary solution, should be replaced by declarative options\n   */\n  public get Editor(): SceneComponent<this> {\n    return ((this as any).constructor['Editor'] ?? (() => null)) as SceneComponent<this>;\n  }\n\n  private setParent() {\n    forEachSceneObjectInState(this._state, (child) => (child._parent = this));\n  }\n\n  /**\n   * Subscribe to the scene state subject\n   **/\n  public subscribeToState(observerOrNext?: Partial<Observer<TState>>): Subscription {\n    return this._subject.subscribe(observerOrNext);\n  }\n\n  /**\n   * Subscribe to the scene event\n   **/\n  public subscribeToEvent<T extends BusEvent>(eventType: BusEventType<T>, handler: BusEventHandler<T>): Unsubscribable {\n    return this._events.subscribe(eventType, handler);\n  }\n\n  public setState(update: Partial<TState>) {\n    const prevState = this._state;\n    const newState: TState = {\n      ...this._state,\n      ...update,\n    };\n\n    this._state = Object.freeze(newState);\n\n    this.setParent();\n    this._subject.next(newState);\n\n    // Bubble state change event. This is event is subscribed to by UrlSyncManager and UndoManager\n    this.publishEvent(\n      new SceneObjectStateChangedEvent({\n        prevState,\n        newState,\n        partialUpdate: update,\n        changedObject: this,\n      }),\n      true\n    );\n  }\n  /*\n   * Publish an event and optionally bubble it up the scene\n   **/\n  public publishEvent(event: BusEvent, bubble?: boolean) {\n    this._events.publish(event);\n\n    if (bubble && this.parent) {\n      this.parent.publishEvent(event, bubble);\n    }\n  }\n\n  public getRoot(): SceneObject {\n    return !this._parent ? this : this._parent.getRoot();\n  }\n\n  /**\n   * Called by the SceneComponentWrapper when the react component is mounted\n   */\n  public activate() {\n    this._isActive = true;\n\n    const { $data, $variables } = this.state;\n\n    if ($data && !$data.isActive) {\n      $data.activate();\n    }\n\n    if ($variables && !$variables.isActive) {\n      $variables.activate();\n    }\n  }\n\n  /**\n   * Called by the SceneComponentWrapper when the react component is unmounted\n   */\n  public deactivate(): void {\n    this._isActive = false;\n\n    const { $data, $variables } = this.state;\n\n    if ($data && $data.isActive) {\n      $data.deactivate();\n    }\n\n    if ($variables && $variables.isActive) {\n      $variables.deactivate();\n    }\n\n    // Clear subscriptions and listeners\n    this._events.removeAllListeners();\n    this._subs.unsubscribe();\n    this._subs = new Subscription();\n\n    this._subject.complete();\n    this._subject = new Subject<TState>();\n  }\n\n  /**\n   * Utility hook to get and subscribe to state\n   */\n  public useState() {\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    return useSceneObjectState(this);\n  }\n\n  /** Force a re-render, should only be needed when variable values change */\n  public forceRender(): void {\n    this.setState({});\n  }\n\n  /**\n   * Will create new SceneObject with shallow-cloned state, but all state items of type SceneObject are deep cloned\n   */\n  public clone(withState?: Partial<TState>): this {\n    return cloneSceneObject(this, withState);\n  }\n}\n\n/**\n * This hook is always returning model.state instead of a useState that remembers the last state emitted on the subject\n * The reason for this is so that if the model instance change this function will always return the latest state.\n */\nfunction useSceneObjectState<TState extends SceneObjectState>(model: SceneObjectBase<TState>): TState {\n  const forceUpdate = useForceUpdate();\n\n  useEffect(() => {\n    const s = model.subscribeToState({ next: forceUpdate });\n    return () => s.unsubscribe();\n  }, [model, forceUpdate]);\n\n  return model.state;\n}\n"],"names":["uuidv4"],"mappings":"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"}
+{"version":3,"file":"SceneObjectBase.js","sources":["../../../src/core/SceneObjectBase.tsx"],"sourcesContent":["import { useEffect } from 'react';\nimport { Observer, Subject, Subscription, Unsubscribable } from 'rxjs';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { BusEvent, BusEventHandler, BusEventType, EventBusSrv } from '@grafana/data';\nimport { SceneObject, SceneComponent, SceneObjectState, SceneObjectUrlSyncHandler } from './types';\nimport { useForceUpdate } from '@grafana/ui';\n\nimport { SceneComponentWrapper } from './SceneComponentWrapper';\nimport { SceneObjectStateChangedEvent } from './events';\nimport { cloneSceneObject, forEachSceneObjectInState } from './utils';\nimport { SceneVariableDependencyConfigLike } from '../variables/types';\n\nexport abstract class SceneObjectBase<TState extends SceneObjectState = SceneObjectState>\n  implements SceneObject<TState>\n{\n  private _isActive = false;\n  private _subject = new Subject<TState>();\n  private _state: TState;\n  private _events = new EventBusSrv();\n\n  /** Incremented in SceneComponentWrapper, useful for tests and rendering optimizations */\n  protected _renderCount = 0;\n  protected _parent?: SceneObject;\n  protected _subs = new Subscription();\n\n  protected _variableDependency: SceneVariableDependencyConfigLike | undefined;\n  protected _urlSync: SceneObjectUrlSyncHandler<TState> | undefined;\n\n  public constructor(state: TState) {\n    if (!state.key) {\n      state.key = uuidv4();\n    }\n\n    this._state = Object.freeze(state);\n    this._subject.next(state);\n    this.setParent();\n  }\n\n  /** Current state */\n  public get state(): TState {\n    return this._state;\n  }\n\n  /** True if currently being active (ie displayed for visual objects) */\n  public get isActive(): boolean {\n    return this._isActive;\n  }\n\n  /** Returns the parent, undefined for root object */\n  public get parent(): SceneObject | undefined {\n    return this._parent;\n  }\n\n  /** Returns variable dependency config */\n  public get variableDependency(): SceneVariableDependencyConfigLike | undefined {\n    return this._variableDependency;\n  }\n\n  /** Returns url sync config */\n  public get urlSync(): SceneObjectUrlSyncHandler<TState> | undefined {\n    return this._urlSync;\n  }\n\n  /**\n   * Used in render functions when rendering a SceneObject.\n   * Wraps the component in an EditWrapper that handles edit mode\n   */\n  public get Component(): SceneComponent<this> {\n    return SceneComponentWrapper;\n  }\n\n  /**\n   * Temporary solution, should be replaced by declarative options\n   */\n  public get Editor(): SceneComponent<this> {\n    return ((this as any).constructor['Editor'] ?? (() => null)) as SceneComponent<this>;\n  }\n\n  private setParent() {\n    forEachSceneObjectInState(this._state, (child) => (child._parent = this));\n  }\n\n  /**\n   * Subscribe to the scene state subject\n   **/\n  public subscribeToState(observerOrNext?: Partial<Observer<TState>>): Subscription {\n    return this._subject.subscribe(observerOrNext);\n  }\n\n  /**\n   * Subscribe to the scene event\n   **/\n  public subscribeToEvent<T extends BusEvent>(eventType: BusEventType<T>, handler: BusEventHandler<T>): Unsubscribable {\n    return this._events.subscribe(eventType, handler);\n  }\n\n  public setState(update: Partial<TState>) {\n    const prevState = this._state;\n    const newState: TState = {\n      ...this._state,\n      ...update,\n    };\n\n    this._state = Object.freeze(newState);\n\n    this.setParent();\n    this._subject.next(newState);\n\n    // Bubble state change event. This is event is subscribed to by UrlSyncManager and UndoManager\n    this.publishEvent(\n      new SceneObjectStateChangedEvent({\n        prevState,\n        newState,\n        partialUpdate: update,\n        changedObject: this,\n      }),\n      true\n    );\n  }\n  /*\n   * Publish an event and optionally bubble it up the scene\n   **/\n  public publishEvent(event: BusEvent, bubble?: boolean) {\n    this._events.publish(event);\n\n    if (bubble && this.parent) {\n      this.parent.publishEvent(event, bubble);\n    }\n  }\n\n  public getRoot(): SceneObject {\n    return !this._parent ? this : this._parent.getRoot();\n  }\n\n  /**\n   * Called by the SceneComponentWrapper when the react component is mounted\n   */\n  public activate() {\n    this._isActive = true;\n\n    const { $data, $variables, $timeRange } = this.state;\n\n    if ($timeRange && !$timeRange.isActive) {\n      $timeRange.activate();\n    }\n\n    if ($variables && !$variables.isActive) {\n      $variables.activate();\n    }\n\n    if ($data && !$data.isActive) {\n      $data.activate();\n    }\n  }\n\n  /**\n   * Called by the SceneComponentWrapper when the react component is unmounted\n   */\n  public deactivate(): void {\n    this._isActive = false;\n\n    const { $data, $variables, $timeRange } = this.state;\n\n    if ($timeRange && $timeRange.isActive) {\n      $timeRange.deactivate();\n    }\n\n    if ($data && $data.isActive) {\n      $data.deactivate();\n    }\n\n    if ($variables && $variables.isActive) {\n      $variables.deactivate();\n    }\n\n    // Clear subscriptions and listeners\n    this._events.removeAllListeners();\n    this._subs.unsubscribe();\n    this._subs = new Subscription();\n\n    this._subject.complete();\n    this._subject = new Subject<TState>();\n  }\n\n  /**\n   * Utility hook to get and subscribe to state\n   */\n  public useState() {\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    return useSceneObjectState(this);\n  }\n\n  /** Force a re-render, should only be needed when variable values change */\n  public forceRender(): void {\n    this.setState({});\n  }\n\n  /**\n   * Will create new SceneObject with shallow-cloned state, but all state items of type SceneObject are deep cloned\n   */\n  public clone(withState?: Partial<TState>): this {\n    return cloneSceneObject(this, withState);\n  }\n}\n\n/**\n * This hook is always returning model.state instead of a useState that remembers the last state emitted on the subject\n * The reason for this is so that if the model instance change this function will always return the latest state.\n */\nfunction useSceneObjectState<TState extends SceneObjectState>(model: SceneObjectBase<TState>): TState {\n  const forceUpdate = useForceUpdate();\n\n  useEffect(() => {\n    const s = model.subscribeToState({ next: forceUpdate });\n    return () => s.unsubscribe();\n  }, [model, forceUpdate]);\n\n  return model.state;\n}\n"],"names":["uuidv4"],"mappings":"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"}

package/dist/esm/core/SceneTimeRange.js

@@ -45,8 +45,6 @@ class SceneTimeRange extends SceneObjectBase {
     this.onRefresh = () => {
       this.setState({ value: evaluateTimeRange(this.state.from, this.state.to, this.state.timeZone) });
     };
-    this.onIntervalChanged = (_) => {
-    };
   }
   getUrlState(state) {
     return { from: state.from, to: state.to };

package/dist/esm/core/SceneTimeRange.js.map

@@ -1 +1 @@
-{"version":3,"file":"SceneTimeRange.js","sources":["../../../src/core/SceneTimeRange.tsx"],"sourcesContent":["import { dateMath, getTimeZone, TimeRange, TimeZone, toUtc } from '@grafana/data';\n\nimport { SceneObjectUrlSyncConfig } from '../services/SceneObjectUrlSyncConfig';\n\nimport { SceneObjectBase } from './SceneObjectBase';\nimport { SceneTimeRangeLike, SceneTimeRangeState, SceneObjectUrlValues, SceneObjectUrlValue } from './types';\n\nexport class SceneTimeRange extends SceneObjectBase<SceneTimeRangeState> implements SceneTimeRangeLike {\n  protected _urlSync = new SceneObjectUrlSyncConfig(this, { keys: ['from', 'to'] });\n\n  public constructor(state: Partial<SceneTimeRangeState> = {}) {\n    const from = state.from ?? 'now-6h';\n    const to = state.to ?? 'now';\n    const timeZone = state.timeZone ?? getTimeZone();\n    const value = evaluateTimeRange(from, to, timeZone);\n    super({ from, to, timeZone, value, ...state });\n  }\n\n  public onTimeRangeChange = (timeRange: TimeRange) => {\n    const update: Partial<SceneTimeRangeState> = {};\n\n    if (typeof timeRange.raw.from === 'string') {\n      update.from = timeRange.raw.from;\n    } else {\n      update.from = timeRange.raw.from.toISOString();\n    }\n\n    if (typeof timeRange.raw.to === 'string') {\n      update.to = timeRange.raw.to;\n    } else {\n      update.to = timeRange.raw.to.toISOString();\n    }\n\n    update.value = evaluateTimeRange(update.from, update.to, this.state.timeZone);\n    this.setState(update);\n  };\n\n  public onRefresh = () => {\n    this.setState({ value: evaluateTimeRange(this.state.from, this.state.to, this.state.timeZone) });\n  };\n\n  public onIntervalChanged = (_: string) => {};\n\n  public getUrlState(state: SceneTimeRangeState) {\n    return { from: state.from, to: state.to };\n  }\n\n  public updateFromUrl(values: SceneObjectUrlValues) {\n    const update: Partial<SceneTimeRangeState> = {};\n\n    const from = parseUrlParam(values.from);\n    if (from) {\n      update.from = from;\n    }\n\n    const to = parseUrlParam(values.to);\n    if (to) {\n      update.to = to;\n    }\n\n    update.value = evaluateTimeRange(update.from ?? this.state.from, update.to ?? this.state.to, this.state.timeZone);\n    this.setState(update);\n  }\n}\n\nfunction parseUrlParam(value: SceneObjectUrlValue): string | null {\n  if (typeof value !== 'string') {\n    return null;\n  }\n\n  if (value.indexOf('now') !== -1) {\n    return value;\n  }\n\n  if (value.length === 8) {\n    const utcValue = toUtc(value, 'YYYYMMDD');\n    if (utcValue.isValid()) {\n      return utcValue.toISOString();\n    }\n  } else if (value.length === 15) {\n    const utcValue = toUtc(value, 'YYYYMMDDTHHmmss');\n    if (utcValue.isValid()) {\n      return utcValue.toISOString();\n    }\n  } else if (value.length === 24) {\n    const utcValue = toUtc(value);\n    return utcValue.toISOString();\n  }\n\n  const epoch = parseInt(value, 10);\n  if (!isNaN(epoch)) {\n    return toUtc(epoch).toISOString();\n  }\n\n  return null;\n}\n\nfunction evaluateTimeRange(from: string, to: string, timeZone: TimeZone, fiscalYearStartMonth?: number): TimeRange {\n  return {\n    from: dateMath.parse(from, false, timeZone, fiscalYearStartMonth)!,\n    to: dateMath.parse(to, true, timeZone, fiscalYearStartMonth)!,\n    raw: {\n      from: from,\n      to: to,\n    },\n  };\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SceneTimeRange.js","sources":["../../../src/core/SceneTimeRange.tsx"],"sourcesContent":["import { dateMath, getTimeZone, TimeRange, TimeZone, toUtc } from '@grafana/data';\n\nimport { SceneObjectUrlSyncConfig } from '../services/SceneObjectUrlSyncConfig';\n\nimport { SceneObjectBase } from './SceneObjectBase';\nimport { SceneTimeRangeLike, SceneTimeRangeState, SceneObjectUrlValues, SceneObjectUrlValue } from './types';\n\nexport class SceneTimeRange extends SceneObjectBase<SceneTimeRangeState> implements SceneTimeRangeLike {\n  protected _urlSync = new SceneObjectUrlSyncConfig(this, { keys: ['from', 'to'] });\n\n  public constructor(state: Partial<SceneTimeRangeState> = {}) {\n    const from = state.from ?? 'now-6h';\n    const to = state.to ?? 'now';\n    const timeZone = state.timeZone ?? getTimeZone();\n    const value = evaluateTimeRange(from, to, timeZone);\n    super({ from, to, timeZone, value, ...state });\n  }\n\n  public onTimeRangeChange = (timeRange: TimeRange) => {\n    const update: Partial<SceneTimeRangeState> = {};\n\n    if (typeof timeRange.raw.from === 'string') {\n      update.from = timeRange.raw.from;\n    } else {\n      update.from = timeRange.raw.from.toISOString();\n    }\n\n    if (typeof timeRange.raw.to === 'string') {\n      update.to = timeRange.raw.to;\n    } else {\n      update.to = timeRange.raw.to.toISOString();\n    }\n\n    update.value = evaluateTimeRange(update.from, update.to, this.state.timeZone);\n    this.setState(update);\n  };\n\n  public onRefresh = () => {\n    this.setState({ value: evaluateTimeRange(this.state.from, this.state.to, this.state.timeZone) });\n  };\n\n  public getUrlState(state: SceneTimeRangeState) {\n    return { from: state.from, to: state.to };\n  }\n\n  public updateFromUrl(values: SceneObjectUrlValues) {\n    const update: Partial<SceneTimeRangeState> = {};\n\n    const from = parseUrlParam(values.from);\n    if (from) {\n      update.from = from;\n    }\n\n    const to = parseUrlParam(values.to);\n    if (to) {\n      update.to = to;\n    }\n\n    update.value = evaluateTimeRange(update.from ?? this.state.from, update.to ?? this.state.to, this.state.timeZone);\n    this.setState(update);\n  }\n}\n\nfunction parseUrlParam(value: SceneObjectUrlValue): string | null {\n  if (typeof value !== 'string') {\n    return null;\n  }\n\n  if (value.indexOf('now') !== -1) {\n    return value;\n  }\n\n  if (value.length === 8) {\n    const utcValue = toUtc(value, 'YYYYMMDD');\n    if (utcValue.isValid()) {\n      return utcValue.toISOString();\n    }\n  } else if (value.length === 15) {\n    const utcValue = toUtc(value, 'YYYYMMDDTHHmmss');\n    if (utcValue.isValid()) {\n      return utcValue.toISOString();\n    }\n  } else if (value.length === 24) {\n    const utcValue = toUtc(value);\n    return utcValue.toISOString();\n  }\n\n  const epoch = parseInt(value, 10);\n  if (!isNaN(epoch)) {\n    return toUtc(epoch).toISOString();\n  }\n\n  return null;\n}\n\nfunction evaluateTimeRange(from: string, to: string, timeZone: TimeZone, fiscalYearStartMonth?: number): TimeRange {\n  return {\n    from: dateMath.parse(from, false, timeZone, fiscalYearStartMonth)!,\n    to: dateMath.parse(to, true, timeZone, fiscalYearStartMonth)!,\n    raw: {\n      from: from,\n      to: to,\n    },\n  };\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/core/sceneGraph.js

@@ -1,5 +1,6 @@
 import { EmptyVariableSet, EmptyDataNode, DefaultTimeRange } from '../variables/interpolation/defaults.js';
 import { sceneInterpolator } from '../variables/interpolation/sceneInterpolator.js';
+import { lookupVariable } from '../variables/lookupVariable.js';
 
 function getVariables(sceneObject) {
   if (sceneObject.state.$variables) {
@@ -55,14 +56,30 @@ function interpolate(sceneObject, value, scopedVars, format) {
   }
   return sceneInterpolator(sceneObject, value, scopedVars, format);
 }
+function hasVariableDependencyInLoadingState(sceneObject) {
+  if (!sceneObject.variableDependency) {
+    return false;
+  }
+  for (const name of sceneObject.variableDependency.getNames()) {
+    const variable = lookupVariable(name, sceneObject);
+    if (!variable) {
+      continue;
+    }
+    const set = variable.parent;
+    return set.isVariableLoadingOrWaitingToUpdate(variable);
+  }
+  return false;
+}
 const sceneGraph = {
   getVariables,
   getData,
   getTimeRange,
   getSceneEditor,
   getLayout,
-  interpolate
+  interpolate,
+  lookupVariable,
+  hasVariableDependencyInLoadingState
 };
 
-export { getData, getLayout, getSceneEditor, getTimeRange, getVariables, interpolate, sceneGraph };
+export { getData, getLayout, getSceneEditor, getTimeRange, getVariables, hasVariableDependencyInLoadingState, interpolate, sceneGraph };
 //# sourceMappingURL=sceneGraph.js.map

package/dist/esm/core/sceneGraph.js.map

@@ -1 +1 @@
-{"version":3,"file":"sceneGraph.js","sources":["../../../src/core/sceneGraph.ts"],"sourcesContent":["import { ScopedVars } from '@grafana/data';\nimport { DefaultTimeRange, EmptyDataNode, EmptyVariableSet } from '../variables/interpolation/defaults';\n\nimport { CustomFormatterFn, sceneInterpolator } from '../variables/interpolation/sceneInterpolator';\nimport { SceneVariables } from '../variables/types';\n\nimport { SceneDataState, SceneEditor, SceneLayoutState, SceneObject, SceneTimeRangeLike } from './types';\n\n/**\n * Get the closest node with variables\n */\nexport function getVariables(sceneObject: SceneObject): SceneVariables {\n  if (sceneObject.state.$variables) {\n    return sceneObject.state.$variables;\n  }\n\n  if (sceneObject.parent) {\n    return getVariables(sceneObject.parent);\n  }\n\n  return EmptyVariableSet;\n}\n\n/**\n * Will walk up the scene object graph to the closest $data scene object\n */\nexport function getData(sceneObject: SceneObject): SceneObject<SceneDataState> {\n  const { $data } = sceneObject.state;\n  if ($data) {\n    return $data;\n  }\n\n  if (sceneObject.parent) {\n    return getData(sceneObject.parent);\n  }\n\n  return EmptyDataNode;\n}\n\n/**\n * Will walk up the scene object graph to the closest $timeRange scene object\n */\nexport function getTimeRange(sceneObject: SceneObject): SceneTimeRangeLike {\n  const { $timeRange } = sceneObject.state;\n  if ($timeRange) {\n    return $timeRange;\n  }\n\n  if (sceneObject.parent) {\n    return getTimeRange(sceneObject.parent);\n  }\n\n  return DefaultTimeRange;\n}\n\n/**\n * Will walk up the scene object graph to the closest $editor scene object\n */\nexport function getSceneEditor(sceneObject: SceneObject): SceneEditor {\n  const { $editor } = sceneObject.state;\n  if ($editor) {\n    return $editor;\n  }\n\n  if (sceneObject.parent) {\n    return getSceneEditor(sceneObject.parent);\n  }\n\n  throw new Error('No editor found in scene tree');\n}\n\n/**\n * Will walk up the scene object graph to the closest $layout scene object\n */\nexport function getLayout(scene: SceneObject): SceneObject<SceneLayoutState> {\n  if (scene.constructor.name === 'SceneFlexLayout' || scene.constructor.name === 'SceneGridLayout') {\n    return scene as SceneObject<SceneLayoutState>;\n  }\n\n  if (scene.parent) {\n    return getLayout(scene.parent);\n  }\n\n  throw new Error('No layout found in scene tree');\n}\n\n/**\n * Interpolates the given string using the current scene object as context.   *\n */\nexport function interpolate(\n  sceneObject: SceneObject,\n  value: string | undefined | null,\n  scopedVars?: ScopedVars,\n  format?: string | CustomFormatterFn\n): string {\n  if (value === '' || value == null) {\n    return '';\n  }\n\n  return sceneInterpolator(sceneObject, value, scopedVars, format);\n}\n\nexport const sceneGraph = {\n  getVariables,\n  getData,\n  getTimeRange,\n  getSceneEditor,\n  getLayout,\n  interpolate,\n};\n"],"names":[],"mappings":";;;AAWO,SAAS,aAAa,WAA0C,EAAA;AACrE,EAAI,IAAA,WAAA,CAAY,MAAM,UAAY,EAAA;AAChC,IAAA,OAAO,YAAY,KAAM,CAAA,UAAA,CAAA;AAAA,GAC3B;AAEA,EAAA,IAAI,YAAY,MAAQ,EAAA;AACtB,IAAO,OAAA,YAAA,CAAa,YAAY,MAAM,CAAA,CAAA;AAAA,GACxC;AAEA,EAAO,OAAA,gBAAA,CAAA;AACT,CAAA;AAKO,SAAS,QAAQ,WAAuD,EAAA;AAC7E,EAAM,MAAA,EAAE,KAAM,EAAA,GAAI,WAAY,CAAA,KAAA,CAAA;AAC9B,EAAA,IAAI,KAAO,EAAA;AACT,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AAEA,EAAA,IAAI,YAAY,MAAQ,EAAA;AACtB,IAAO,OAAA,OAAA,CAAQ,YAAY,MAAM,CAAA,CAAA;AAAA,GACnC;AAEA,EAAO,OAAA,aAAA,CAAA;AACT,CAAA;AAKO,SAAS,aAAa,WAA8C,EAAA;AACzE,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,WAAY,CAAA,KAAA,CAAA;AACnC,EAAA,IAAI,UAAY,EAAA;AACd,IAAO,OAAA,UAAA,CAAA;AAAA,GACT;AAEA,EAAA,IAAI,YAAY,MAAQ,EAAA;AACtB,IAAO,OAAA,YAAA,CAAa,YAAY,MAAM,CAAA,CAAA;AAAA,GACxC;AAEA,EAAO,OAAA,gBAAA,CAAA;AACT,CAAA;AAKO,SAAS,eAAe,WAAuC,EAAA;AACpE,EAAM,MAAA,EAAE,OAAQ,EAAA,GAAI,WAAY,CAAA,KAAA,CAAA;AAChC,EAAA,IAAI,OAAS,EAAA;AACX,IAAO,OAAA,OAAA,CAAA;AAAA,GACT;AAEA,EAAA,IAAI,YAAY,MAAQ,EAAA;AACtB,IAAO,OAAA,cAAA,CAAe,YAAY,MAAM,CAAA,CAAA;AAAA,GAC1C;AAEA,EAAM,MAAA,IAAI,MAAM,+BAA+B,CAAA,CAAA;AACjD,CAAA;AAKO,SAAS,UAAU,KAAmD,EAAA;AAC3E,EAAA,IAAI,MAAM,WAAY,CAAA,IAAA,KAAS,qBAAqB,KAAM,CAAA,WAAA,CAAY,SAAS,iBAAmB,EAAA;AAChG,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AAEA,EAAA,IAAI,MAAM,MAAQ,EAAA;AAChB,IAAO,OAAA,SAAA,CAAU,MAAM,MAAM,CAAA,CAAA;AAAA,GAC/B;AAEA,EAAM,MAAA,IAAI,MAAM,+BAA+B,CAAA,CAAA;AACjD,CAAA;AAKO,SAAS,WACd,CAAA,WAAA,EACA,KACA,EAAA,UAAA,EACA,MACQ,EAAA;AACR,EAAI,IAAA,KAAA,KAAU,EAAM,IAAA,KAAA,IAAS,IAAM,EAAA;AACjC,IAAO,OAAA,EAAA,CAAA;AAAA,GACT;AAEA,EAAA,OAAO,iBAAkB,CAAA,WAAA,EAAa,KAAO,EAAA,UAAA,EAAY,MAAM,CAAA,CAAA;AACjE,CAAA;AAEO,MAAM,UAAa,GAAA;AAAA,EACxB,YAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,cAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AACF;;;;"}
+{"version":3,"file":"sceneGraph.js","sources":["../../../src/core/sceneGraph.ts"],"sourcesContent":["import { ScopedVars } from '@grafana/data';\nimport { DefaultTimeRange, EmptyDataNode, EmptyVariableSet } from '../variables/interpolation/defaults';\n\nimport { CustomFormatterFn, sceneInterpolator } from '../variables/interpolation/sceneInterpolator';\nimport { SceneVariables } from '../variables/types';\n\nimport { SceneDataState, SceneEditor, SceneLayoutState, SceneObject, SceneTimeRangeLike } from './types';\nimport { lookupVariable } from '../variables/lookupVariable';\n\n/**\n * Get the closest node with variables\n */\nexport function getVariables(sceneObject: SceneObject): SceneVariables {\n  if (sceneObject.state.$variables) {\n    return sceneObject.state.$variables;\n  }\n\n  if (sceneObject.parent) {\n    return getVariables(sceneObject.parent);\n  }\n\n  return EmptyVariableSet;\n}\n\n/**\n * Will walk up the scene object graph to the closest $data scene object\n */\nexport function getData(sceneObject: SceneObject): SceneObject<SceneDataState> {\n  const { $data } = sceneObject.state;\n  if ($data) {\n    return $data;\n  }\n\n  if (sceneObject.parent) {\n    return getData(sceneObject.parent);\n  }\n\n  return EmptyDataNode;\n}\n\n/**\n * Will walk up the scene object graph to the closest $timeRange scene object\n */\nexport function getTimeRange(sceneObject: SceneObject): SceneTimeRangeLike {\n  const { $timeRange } = sceneObject.state;\n  if ($timeRange) {\n    return $timeRange;\n  }\n\n  if (sceneObject.parent) {\n    return getTimeRange(sceneObject.parent);\n  }\n\n  return DefaultTimeRange;\n}\n\n/**\n * Will walk up the scene object graph to the closest $editor scene object\n */\nexport function getSceneEditor(sceneObject: SceneObject): SceneEditor {\n  const { $editor } = sceneObject.state;\n  if ($editor) {\n    return $editor;\n  }\n\n  if (sceneObject.parent) {\n    return getSceneEditor(sceneObject.parent);\n  }\n\n  throw new Error('No editor found in scene tree');\n}\n\n/**\n * Will walk up the scene object graph to the closest $layout scene object\n */\nexport function getLayout(scene: SceneObject): SceneObject<SceneLayoutState> {\n  if (scene.constructor.name === 'SceneFlexLayout' || scene.constructor.name === 'SceneGridLayout') {\n    return scene as SceneObject<SceneLayoutState>;\n  }\n\n  if (scene.parent) {\n    return getLayout(scene.parent);\n  }\n\n  throw new Error('No layout found in scene tree');\n}\n\n/**\n * Interpolates the given string using the current scene object as context.   *\n */\nexport function interpolate(\n  sceneObject: SceneObject,\n  value: string | undefined | null,\n  scopedVars?: ScopedVars,\n  format?: string | CustomFormatterFn\n): string {\n  if (value === '' || value == null) {\n    return '';\n  }\n\n  return sceneInterpolator(sceneObject, value, scopedVars, format);\n}\n\n/**\n * Checks if the variable is currently loading or waiting to update\n */\nexport function hasVariableDependencyInLoadingState(sceneObject: SceneObject) {\n  if (!sceneObject.variableDependency) {\n    return false;\n  }\n\n  for (const name of sceneObject.variableDependency.getNames()) {\n    const variable = lookupVariable(name, sceneObject);\n    if (!variable) {\n      continue;\n    }\n\n    const set = variable.parent as SceneVariables;\n    return set.isVariableLoadingOrWaitingToUpdate(variable);\n  }\n\n  return false;\n}\n\nexport const sceneGraph = {\n  getVariables,\n  getData,\n  getTimeRange,\n  getSceneEditor,\n  getLayout,\n  interpolate,\n  lookupVariable,\n  hasVariableDependencyInLoadingState,\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/core/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sources":["../../../src/core/types.ts"],"sourcesContent":["import React from 'react';\nimport { Observer, Subscription, Unsubscribable } from 'rxjs';\n\nimport { BusEvent, BusEventHandler, BusEventType, PanelData, TimeRange, TimeZone } from '@grafana/data';\n\nimport { SceneVariableDependencyConfigLike, SceneVariables } from '../variables/types';\n\nexport interface SceneObjectStatePlain {\n  key?: string;\n  $timeRange?: SceneTimeRangeLike;\n  $data?: SceneObject<SceneDataState>;\n  $editor?: SceneEditor;\n  $variables?: SceneVariables;\n}\n\nexport interface SceneLayoutChildState extends SceneObjectStatePlain {\n  placement?: SceneLayoutChildOptions;\n}\n\nexport type SceneObjectState = SceneObjectStatePlain | SceneLayoutState | SceneLayoutChildState;\n\nexport interface SceneLayoutChildOptions {\n  width?: number | string;\n  height?: number | string;\n  xSizing?: 'fill' | 'content';\n  ySizing?: 'fill' | 'content';\n  x?: number;\n  y?: number;\n  minWidth?: number | string;\n  minHeight?: number | string;\n  isDraggable?: boolean;\n  isResizable?: boolean;\n}\n\nexport interface SceneComponentProps<T> {\n  model: T;\n  isEditing?: boolean;\n}\n\nexport type SceneComponent<TModel> = React.FunctionComponent<SceneComponentProps<TModel>>;\n\nexport interface SceneDataState extends SceneObjectStatePlain {\n  data?: PanelData;\n}\n\nexport interface SceneObject<TState extends SceneObjectState = SceneObjectState> {\n  /** The current state */\n  readonly state: TState;\n\n  /** True when there is a React component mounted for this Object */\n  readonly isActive: boolean;\n\n  /** SceneObject parent */\n  readonly parent?: SceneObject;\n\n  /** This abtractions declares what variables the scene object depends on and how to handle when they change value. **/\n  readonly variableDependency?: SceneVariableDependencyConfigLike;\n\n  /** This abstraction declares URL sync dependencies of a scene object. **/\n  readonly urlSync?: SceneObjectUrlSyncHandler<TState>;\n\n  /** Subscribe to state changes */\n  subscribeToState(observer?: Partial<Observer<TState>>): Subscription;\n\n  /** Subscribe to a scene event */\n  subscribeToEvent<T extends BusEvent>(typeFilter: BusEventType<T>, handler: BusEventHandler<T>): Unsubscribable;\n\n  /** Publish an event and optionally bubble it up the scene */\n  publishEvent(event: BusEvent, bubble?: boolean): void;\n\n  /** Utility hook that wraps useObservable. Used by React components to subscribes to state changes */\n  useState(): TState;\n\n  /** How to modify state */\n  setState(state: Partial<TState>): void;\n\n  /** Called when the Component is mounted. A place to register event listeners add subscribe to state changes */\n  activate(): void;\n\n  /** Called when component unmounts. Unsubscribe and closes all subscriptions  */\n  deactivate(): void;\n\n  /** Get the scene root */\n  getRoot(): SceneObject;\n\n  /** Returns a deep clone this object and all its children */\n  clone(state?: Partial<TState>): this;\n\n  /** A React component to use for rendering the object */\n  Component(props: SceneComponentProps<SceneObject<TState>>): React.ReactElement | null;\n\n  /** To be replaced by declarative method */\n  Editor(props: SceneComponentProps<SceneObject<TState>>): React.ReactElement | null;\n\n  /** Force a re-render, should only be needed when variable values change */\n  forceRender(): void;\n}\n\nexport type SceneLayoutChild = SceneObject<SceneLayoutChildState | SceneLayoutState>;\n\nexport interface SceneLayoutState extends SceneLayoutChildState {\n  children: SceneLayoutChild[];\n}\n\nexport type SceneLayout<T extends SceneLayoutState = SceneLayoutState> = SceneObject<T>;\n\nexport interface SceneEditorState extends SceneObjectStatePlain {\n  hoverObject?: SceneObjectRef;\n  selectedObject?: SceneObjectRef;\n}\n\nexport interface SceneEditor extends SceneObject<SceneEditorState> {\n  onMouseEnterObject(model: SceneObject): void;\n  onMouseLeaveObject(model: SceneObject): void;\n  onSelectObject(model: SceneObject): void;\n  getEditComponentWrapper(): React.ComponentType<SceneComponentEditWrapperProps>;\n}\n\ninterface SceneComponentEditWrapperProps {\n  editor: SceneEditor;\n  model: SceneObject;\n  children: React.ReactNode;\n}\n\nexport interface SceneTimeRangeState extends SceneObjectStatePlain {\n  from: string;\n  to: string;\n  timeZone: TimeZone;\n  fiscalYearStartMonth?: number;\n  value: TimeRange;\n}\n\nexport interface SceneTimeRangeLike extends SceneObject<SceneTimeRangeState> {\n  onTimeRangeChange(timeRange: TimeRange): void;\n  onIntervalChanged(interval: string): void;\n  onRefresh(): void;\n}\n\nexport interface SceneObjectRef {\n  ref: SceneObject;\n}\n\nexport function isSceneObject(obj: any): obj is SceneObject {\n  return obj.useState !== undefined;\n}\n\nexport interface SceneObjectWithUrlSync<TState> extends SceneObject {\n  getUrlState(state: TState): SceneObjectUrlValues;\n  updateFromUrl(values: SceneObjectUrlValues): void;\n}\n\nexport interface SceneObjectUrlSyncHandler<TState> {\n  getKeys(): string[];\n  getUrlState(state: TState): SceneObjectUrlValues;\n  updateFromUrl(values: SceneObjectUrlValues): void;\n}\n\nexport type SceneObjectUrlValue = string | string[] | undefined | null;\nexport type SceneObjectUrlValues = Record<string, SceneObjectUrlValue>;\n\nexport type DeepPartial<T> = {\n  [K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K];\n};\n"],"names":[],"mappings":"AA8IO,SAAS,cAAc,GAA8B,EAAA;AAC1D,EAAA,OAAO,IAAI,QAAa,KAAA,KAAA,CAAA,CAAA;AAC1B;;;;"}
+{"version":3,"file":"types.js","sources":["../../../src/core/types.ts"],"sourcesContent":["import React from 'react';\nimport { Observer, Subscription, Unsubscribable } from 'rxjs';\n\nimport { BusEvent, BusEventHandler, BusEventType, PanelData, TimeRange, TimeZone } from '@grafana/data';\n\nimport { SceneVariableDependencyConfigLike, SceneVariables } from '../variables/types';\n\nexport interface SceneObjectStatePlain {\n  key?: string;\n  $timeRange?: SceneTimeRangeLike;\n  $data?: SceneObject<SceneDataState>;\n  $editor?: SceneEditor;\n  $variables?: SceneVariables;\n}\n\nexport interface SceneLayoutChildState extends SceneObjectStatePlain {\n  placement?: SceneLayoutChildOptions;\n}\n\nexport type SceneObjectState = SceneObjectStatePlain | SceneLayoutState | SceneLayoutChildState;\n\nexport interface SceneLayoutChildOptions {\n  width?: number | string;\n  height?: number | string;\n  xSizing?: 'fill' | 'content';\n  ySizing?: 'fill' | 'content';\n  x?: number;\n  y?: number;\n  minWidth?: number | string;\n  minHeight?: number | string;\n  isDraggable?: boolean;\n  isResizable?: boolean;\n}\n\nexport interface SceneComponentProps<T> {\n  model: T;\n  isEditing?: boolean;\n}\n\nexport type SceneComponent<TModel> = React.FunctionComponent<SceneComponentProps<TModel>>;\n\nexport interface SceneDataState extends SceneObjectStatePlain {\n  data?: PanelData;\n}\n\nexport interface SceneObject<TState extends SceneObjectState = SceneObjectState> {\n  /** The current state */\n  readonly state: TState;\n\n  /** True when there is a React component mounted for this Object */\n  readonly isActive: boolean;\n\n  /** SceneObject parent */\n  readonly parent?: SceneObject;\n\n  /** This abtractions declares what variables the scene object depends on and how to handle when they change value. **/\n  readonly variableDependency?: SceneVariableDependencyConfigLike;\n\n  /** This abstraction declares URL sync dependencies of a scene object. **/\n  readonly urlSync?: SceneObjectUrlSyncHandler<TState>;\n\n  /** Subscribe to state changes */\n  subscribeToState(observer?: Partial<Observer<TState>>): Subscription;\n\n  /** Subscribe to a scene event */\n  subscribeToEvent<T extends BusEvent>(typeFilter: BusEventType<T>, handler: BusEventHandler<T>): Unsubscribable;\n\n  /** Publish an event and optionally bubble it up the scene */\n  publishEvent(event: BusEvent, bubble?: boolean): void;\n\n  /** Utility hook that wraps useObservable. Used by React components to subscribes to state changes */\n  useState(): TState;\n\n  /** How to modify state */\n  setState(state: Partial<TState>): void;\n\n  /** Called when the Component is mounted. A place to register event listeners add subscribe to state changes */\n  activate(): void;\n\n  /** Called when component unmounts. Unsubscribe and closes all subscriptions  */\n  deactivate(): void;\n\n  /** Get the scene root */\n  getRoot(): SceneObject;\n\n  /** Returns a deep clone this object and all its children */\n  clone(state?: Partial<TState>): this;\n\n  /** A React component to use for rendering the object */\n  Component(props: SceneComponentProps<SceneObject<TState>>): React.ReactElement | null;\n\n  /** To be replaced by declarative method */\n  Editor(props: SceneComponentProps<SceneObject<TState>>): React.ReactElement | null;\n\n  /** Force a re-render, should only be needed when variable values change */\n  forceRender(): void;\n}\n\nexport type SceneLayoutChild = SceneObject<SceneLayoutChildState | SceneLayoutState>;\n\nexport interface SceneLayoutState extends SceneLayoutChildState {\n  children: SceneLayoutChild[];\n}\n\nexport type SceneLayout<T extends SceneLayoutState = SceneLayoutState> = SceneObject<T>;\n\nexport interface SceneEditorState extends SceneObjectStatePlain {\n  hoverObject?: SceneObjectRef;\n  selectedObject?: SceneObjectRef;\n}\n\nexport interface SceneEditor extends SceneObject<SceneEditorState> {\n  onMouseEnterObject(model: SceneObject): void;\n  onMouseLeaveObject(model: SceneObject): void;\n  onSelectObject(model: SceneObject): void;\n  getEditComponentWrapper(): React.ComponentType<SceneComponentEditWrapperProps>;\n}\n\ninterface SceneComponentEditWrapperProps {\n  editor: SceneEditor;\n  model: SceneObject;\n  children: React.ReactNode;\n}\n\nexport interface SceneTimeRangeState extends SceneObjectStatePlain {\n  from: string;\n  to: string;\n  timeZone: TimeZone;\n  fiscalYearStartMonth?: number;\n  value: TimeRange;\n}\n\nexport interface SceneTimeRangeLike extends SceneObject<SceneTimeRangeState> {\n  onTimeRangeChange(timeRange: TimeRange): void;\n  onRefresh(): void;\n}\n\nexport interface SceneObjectRef {\n  ref: SceneObject;\n}\n\nexport function isSceneObject(obj: any): obj is SceneObject {\n  return obj.useState !== undefined;\n}\n\nexport interface SceneObjectWithUrlSync<TState> extends SceneObject {\n  getUrlState(state: TState): SceneObjectUrlValues;\n  updateFromUrl(values: SceneObjectUrlValues): void;\n}\n\nexport interface SceneObjectUrlSyncHandler<TState> {\n  getKeys(): string[];\n  getUrlState(state: TState): SceneObjectUrlValues;\n  updateFromUrl(values: SceneObjectUrlValues): void;\n}\n\nexport type SceneObjectUrlValue = string | string[] | undefined | null;\nexport type SceneObjectUrlValues = Record<string, SceneObjectUrlValue>;\n\nexport type DeepPartial<T> = {\n  [K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K];\n};\n"],"names":[],"mappings":"AA6IO,SAAS,cAAc,GAA8B,EAAA;AAC1D,EAAA,OAAO,IAAI,QAAa,KAAA,KAAA,CAAA,CAAA;AAC1B;;;;"}

package/dist/esm/index.js

@@ -30,4 +30,5 @@ export { SceneControlsSpacer } from './components/SceneControlsSpacer.js';
 export { SceneFlexLayout } from './components/layout/SceneFlexLayout.js';
 export { SceneGridLayout } from './components/layout/SceneGridLayout.js';
 export { SceneGridRow } from './components/layout/SceneGridRow.js';
+export { SceneApp, SceneAppPage } from './components/SceneApp/SceneApp.js';
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}