@grafana/scenes 0.6.0 → 0.7.0

package/dist/esm/querying/SceneQueryRunner.js

@@ -30,8 +30,8 @@ class SceneQueryRunner extends SceneObjectBase {
   _onActivate() {
     const timeRange = sceneGraph.getTimeRange(this);
     this._subs.add(
-      timeRange.subscribeToState((timeRange2) => {
-        this.runWithTimeRange(timeRange2.value);
+      timeRange.subscribeToState(() => {
+        this.runWithTimeRange(timeRange);
       })
     );
     if (this.shouldRunQueriesOnActivate()) {
@@ -89,7 +89,7 @@ class SceneQueryRunner extends SceneObjectBase {
   }
   runQueries() {
     const timeRange = sceneGraph.getTimeRange(this);
-    this.runWithTimeRange(timeRange.state.value);
+    this.runWithTimeRange(timeRange);
   }
   getMaxDataPoints() {
     var _a, _b;
@@ -116,9 +116,9 @@ class SceneQueryRunner extends SceneObjectBase {
     const request = {
       app: CoreApp.Dashboard,
       requestId: getNextRequestId(),
-      timezone: "browser",
+      timezone: timeRange.getTimeZone(),
       panelId: 1,
-      range: timeRange,
+      range: timeRange.state.value,
       interval: "1s",
       intervalMs: 1e3,
       targets: cloneDeep(queries),
@@ -136,7 +136,7 @@ class SceneQueryRunner extends SceneObjectBase {
         return query;
       });
       const lowerIntervalLimit = minInterval ? minInterval : ds.interval;
-      const norm = rangeUtil.calculateInterval(timeRange, request.maxDataPoints, lowerIntervalLimit);
+      const norm = rangeUtil.calculateInterval(timeRange.state.value, request.maxDataPoints, lowerIntervalLimit);
       request.scopedVars = Object.assign({}, request.scopedVars, {
         __interval: { text: norm.interval, value: norm.interval },
         __interval_ms: { text: norm.intervalMs.toString(), value: norm.intervalMs }

package/dist/esm/querying/SceneQueryRunner.js.map

@@ -1 +1 @@
-{"version":3,"file":"SceneQueryRunner.js","sources":["../../../src/querying/SceneQueryRunner.ts"],"sourcesContent":["import { cloneDeep } from 'lodash';\nimport { Unsubscribable } from 'rxjs';\n\nimport { DataQuery, DataSourceRef } from '@grafana/schema';\n\nimport {\n  CoreApp,\n  DataQueryRequest,\n  PanelData,\n  preProcessPanelData,\n  rangeUtil,\n  ScopedVar,\n  TimeRange,\n} from '@grafana/data';\nimport { getRunRequest } from '@grafana/runtime';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { sceneGraph } from '../core/sceneGraph';\nimport { SceneDataProvider, SceneObjectState } from '../core/types';\nimport { getDataSource } from '../utils/getDataSource';\nimport { VariableDependencyConfig } from '../variables/VariableDependencyConfig';\nimport { SceneVariable } from '../variables/types';\nimport { writeSceneLog } from '../utils/writeSceneLog';\nimport { VariableValueRecorder } from '../variables/VariableValueRecorder';\nimport { emptyPanelData } from '../core/SceneDataNode';\n\nlet counter = 100;\n\nexport function getNextRequestId() {\n  return 'SQR' + counter++;\n}\n\nexport interface QueryRunnerState extends SceneObjectState {\n  data?: PanelData;\n  queries: DataQueryExtended[];\n  datasource?: DataSourceRef;\n  minInterval?: string;\n  maxDataPoints?: number;\n  // Non persisted state\n  maxDataPointsFromWidth?: boolean;\n  isWaitingForVariables?: boolean;\n}\n\nexport interface DataQueryExtended extends DataQuery {\n  [key: string]: any;\n}\n\nexport class SceneQueryRunner extends SceneObjectBase<QueryRunnerState> implements SceneDataProvider {\n  private _querySub?: Unsubscribable;\n  private _containerWidth?: number;\n  private _variableValueRecorder = new VariableValueRecorder();\n\n  protected _variableDependency: VariableDependencyConfig<QueryRunnerState> = new VariableDependencyConfig(this, {\n    statePaths: ['queries', 'datasource'],\n    onVariableUpdatesCompleted: (variables, dependencyChanged) =>\n      this.onVariableUpdatesCompleted(variables, dependencyChanged),\n  });\n\n  public constructor(initialState: QueryRunnerState) {\n    super(initialState);\n\n    this.addActivationHandler(() => this._onActivate());\n  }\n\n  private _onActivate() {\n    const timeRange = sceneGraph.getTimeRange(this);\n\n    this._subs.add(\n      timeRange.subscribeToState((timeRange) => {\n        this.runWithTimeRange(timeRange.value);\n      })\n    );\n\n    if (this.shouldRunQueriesOnActivate()) {\n      this.runQueries();\n    }\n\n    return () => this._onDeactivate();\n  }\n\n  /**\n   * Handles some tricky cases where we need to run queries even when they have not changed in case\n   * the query execution on activate was stopped due to VariableSet still not having processed all variables.\n   */\n  private onVariableUpdatesCompleted(_variablesThatHaveChanged: Set<SceneVariable>, dependencyChanged: boolean) {\n    if (this.state.isWaitingForVariables && this.shouldRunQueriesOnActivate()) {\n      this.runQueries();\n      return;\n    }\n\n    if (dependencyChanged) {\n      this.runQueries();\n    }\n  }\n\n  private shouldRunQueriesOnActivate() {\n    // If no maxDataPoints specified we might need to wait for container width to be set from the outside\n    if (!this.state.maxDataPoints && this.state.maxDataPointsFromWidth && !this._containerWidth) {\n      return false;\n    }\n\n    if (this._variableValueRecorder.hasDependenciesChanged(this)) {\n      writeSceneLog(\n        'SceneQueryRunner',\n        'Variable dependency changed while inactive, shouldRunQueriesOnActivate returns true'\n      );\n      return true;\n    }\n\n    // If we already have data, no need\n    // TODO validate that time range is similar and if not we should run queries again\n    if (this.state.data) {\n      return false;\n    }\n\n    return true;\n  }\n\n  private _onDeactivate(): void {\n    if (this._querySub) {\n      this._querySub.unsubscribe();\n      this._querySub = undefined;\n    }\n\n    this._variableValueRecorder.recordCurrentDependencyValuesForSceneObject(this);\n  }\n\n  public setContainerWidth(width: number) {\n    // If we don't have a width we should run queries\n    if (!this._containerWidth && width > 0) {\n      this._containerWidth = width;\n\n      // If we don't have maxDataPoints specifically set and maxDataPointsFromWidth is true\n      if (this.state.maxDataPointsFromWidth && !this.state.maxDataPoints) {\n        // As this is called from render path we need to wait for next tick before running queries\n        setTimeout(() => {\n          if (this.isActive && !this._querySub) {\n            this.runQueries();\n          }\n        }, 0);\n      }\n    } else {\n      // if the updated container width is bigger than 0 let's remember the width until next query issue\n      if (width > 0) {\n        this._containerWidth = width;\n      }\n    }\n  }\n\n  public runQueries() {\n    const timeRange = sceneGraph.getTimeRange(this);\n    this.runWithTimeRange(timeRange.state.value);\n  }\n\n  private getMaxDataPoints() {\n    return this.state.maxDataPoints ?? this._containerWidth ?? 500;\n  }\n\n  private async runWithTimeRange(timeRange: TimeRange) {\n    // Skip executing queries if variable dependency is in loading state\n    if (sceneGraph.hasVariableDependencyInLoadingState(this)) {\n      writeSceneLog('SceneQueryRunner', 'Variable dependency is in loading state, skipping query execution');\n      this.setState({ isWaitingForVariables: true });\n      return;\n    }\n\n    // If we where waiting for variables clear that flag\n    if (this.state.isWaitingForVariables) {\n      this.setState({ isWaitingForVariables: false });\n    }\n\n    const { minInterval, queries } = this.state;\n    const sceneObjectScopedVar: Record<string, ScopedVar<SceneQueryRunner>> = {\n      __sceneObject: { text: '__sceneObject', value: this },\n    };\n\n    // Simple path when no queries exist\n    if (!queries?.length) {\n      this._setNoDataState();\n      return;\n    }\n\n    const request: DataQueryRequest = {\n      app: CoreApp.Dashboard,\n      requestId: getNextRequestId(),\n      timezone: 'browser',\n      panelId: 1,\n      range: timeRange,\n      interval: '1s',\n      intervalMs: 1000,\n      targets: cloneDeep(queries),\n      maxDataPoints: this.getMaxDataPoints(),\n      scopedVars: sceneObjectScopedVar,\n      startTime: Date.now(),\n    };\n\n    try {\n      const datasource = this.state.datasource ?? findFirstDatasource(request.targets);\n      const ds = await getDataSource(datasource, request.scopedVars);\n\n      // Attach the data source name to each query\n      request.targets = request.targets.map((query) => {\n        if (!query.datasource) {\n          query.datasource = ds.getRef();\n        }\n        return query;\n      });\n\n      // TODO interpolate minInterval\n      const lowerIntervalLimit = minInterval ? minInterval : ds.interval;\n      const norm = rangeUtil.calculateInterval(timeRange, request.maxDataPoints!, lowerIntervalLimit);\n\n      // make shallow copy of scoped vars,\n      // and add built in variables interval and interval_ms\n      request.scopedVars = Object.assign({}, request.scopedVars, {\n        __interval: { text: norm.interval, value: norm.interval },\n        __interval_ms: { text: norm.intervalMs.toString(), value: norm.intervalMs },\n      });\n\n      request.interval = norm.interval;\n      request.intervalMs = norm.intervalMs;\n\n      const runRequest = getRunRequest();\n\n      writeSceneLog('SceneQueryRunner', 'Starting runRequest', this.state.key);\n\n      this._querySub = runRequest(ds, request).subscribe(this.onDataReceived);\n    } catch (err) {\n      console.error('PanelQueryRunner Error', err);\n    }\n  }\n\n  private onDataReceived = (data: PanelData) => {\n    const preProcessedData = preProcessPanelData(data, this.state.data);\n    this.setState({ data: preProcessedData });\n  };\n\n  private _setNoDataState() {\n    if (this.state.data !== emptyPanelData) {\n      this.setState({ data: emptyPanelData });\n    }\n  }\n}\n\nexport function findFirstDatasource(targets: DataQuery[]): DataSourceRef | undefined {\n  return targets.find((t) => t.datasource !== null)?.datasource ?? undefined;\n}\n"],"names":["timeRange"],"mappings":"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"}
+{"version":3,"file":"SceneQueryRunner.js","sources":["../../../src/querying/SceneQueryRunner.ts"],"sourcesContent":["import { cloneDeep } from 'lodash';\nimport { Unsubscribable } from 'rxjs';\n\nimport { DataQuery, DataSourceRef } from '@grafana/schema';\n\nimport { CoreApp, DataQueryRequest, PanelData, preProcessPanelData, rangeUtil, ScopedVar } from '@grafana/data';\nimport { getRunRequest } from '@grafana/runtime';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { sceneGraph } from '../core/sceneGraph';\nimport { SceneDataProvider, SceneObjectState, SceneTimeRangeLike } from '../core/types';\nimport { getDataSource } from '../utils/getDataSource';\nimport { VariableDependencyConfig } from '../variables/VariableDependencyConfig';\nimport { SceneVariable } from '../variables/types';\nimport { writeSceneLog } from '../utils/writeSceneLog';\nimport { VariableValueRecorder } from '../variables/VariableValueRecorder';\nimport { emptyPanelData } from '../core/SceneDataNode';\n\nlet counter = 100;\n\nexport function getNextRequestId() {\n  return 'SQR' + counter++;\n}\n\nexport interface QueryRunnerState extends SceneObjectState {\n  data?: PanelData;\n  queries: DataQueryExtended[];\n  datasource?: DataSourceRef;\n  minInterval?: string;\n  maxDataPoints?: number;\n  // Non persisted state\n  maxDataPointsFromWidth?: boolean;\n  isWaitingForVariables?: boolean;\n}\n\nexport interface DataQueryExtended extends DataQuery {\n  [key: string]: any;\n}\n\nexport class SceneQueryRunner extends SceneObjectBase<QueryRunnerState> implements SceneDataProvider {\n  private _querySub?: Unsubscribable;\n  private _containerWidth?: number;\n  private _variableValueRecorder = new VariableValueRecorder();\n\n  protected _variableDependency: VariableDependencyConfig<QueryRunnerState> = new VariableDependencyConfig(this, {\n    statePaths: ['queries', 'datasource'],\n    onVariableUpdatesCompleted: (variables, dependencyChanged) =>\n      this.onVariableUpdatesCompleted(variables, dependencyChanged),\n  });\n\n  public constructor(initialState: QueryRunnerState) {\n    super(initialState);\n\n    this.addActivationHandler(() => this._onActivate());\n  }\n\n  private _onActivate() {\n    const timeRange = sceneGraph.getTimeRange(this);\n\n    this._subs.add(\n      timeRange.subscribeToState(() => {\n        this.runWithTimeRange(timeRange);\n      })\n    );\n\n    if (this.shouldRunQueriesOnActivate()) {\n      this.runQueries();\n    }\n\n    return () => this._onDeactivate();\n  }\n\n  /**\n   * Handles some tricky cases where we need to run queries even when they have not changed in case\n   * the query execution on activate was stopped due to VariableSet still not having processed all variables.\n   */\n  private onVariableUpdatesCompleted(_variablesThatHaveChanged: Set<SceneVariable>, dependencyChanged: boolean) {\n    if (this.state.isWaitingForVariables && this.shouldRunQueriesOnActivate()) {\n      this.runQueries();\n      return;\n    }\n\n    if (dependencyChanged) {\n      this.runQueries();\n    }\n  }\n\n  private shouldRunQueriesOnActivate() {\n    // If no maxDataPoints specified we might need to wait for container width to be set from the outside\n    if (!this.state.maxDataPoints && this.state.maxDataPointsFromWidth && !this._containerWidth) {\n      return false;\n    }\n\n    if (this._variableValueRecorder.hasDependenciesChanged(this)) {\n      writeSceneLog(\n        'SceneQueryRunner',\n        'Variable dependency changed while inactive, shouldRunQueriesOnActivate returns true'\n      );\n      return true;\n    }\n\n    // If we already have data, no need\n    // TODO validate that time range is similar and if not we should run queries again\n    if (this.state.data) {\n      return false;\n    }\n\n    return true;\n  }\n\n  private _onDeactivate(): void {\n    if (this._querySub) {\n      this._querySub.unsubscribe();\n      this._querySub = undefined;\n    }\n\n    this._variableValueRecorder.recordCurrentDependencyValuesForSceneObject(this);\n  }\n\n  public setContainerWidth(width: number) {\n    // If we don't have a width we should run queries\n    if (!this._containerWidth && width > 0) {\n      this._containerWidth = width;\n\n      // If we don't have maxDataPoints specifically set and maxDataPointsFromWidth is true\n      if (this.state.maxDataPointsFromWidth && !this.state.maxDataPoints) {\n        // As this is called from render path we need to wait for next tick before running queries\n        setTimeout(() => {\n          if (this.isActive && !this._querySub) {\n            this.runQueries();\n          }\n        }, 0);\n      }\n    } else {\n      // if the updated container width is bigger than 0 let's remember the width until next query issue\n      if (width > 0) {\n        this._containerWidth = width;\n      }\n    }\n  }\n\n  public runQueries() {\n    const timeRange = sceneGraph.getTimeRange(this);\n    this.runWithTimeRange(timeRange);\n  }\n\n  private getMaxDataPoints() {\n    return this.state.maxDataPoints ?? this._containerWidth ?? 500;\n  }\n\n  private async runWithTimeRange(timeRange: SceneTimeRangeLike) {\n    // Skip executing queries if variable dependency is in loading state\n    if (sceneGraph.hasVariableDependencyInLoadingState(this)) {\n      writeSceneLog('SceneQueryRunner', 'Variable dependency is in loading state, skipping query execution');\n      this.setState({ isWaitingForVariables: true });\n      return;\n    }\n\n    // If we where waiting for variables clear that flag\n    if (this.state.isWaitingForVariables) {\n      this.setState({ isWaitingForVariables: false });\n    }\n\n    const { minInterval, queries } = this.state;\n    const sceneObjectScopedVar: Record<string, ScopedVar<SceneQueryRunner>> = {\n      __sceneObject: { text: '__sceneObject', value: this },\n    };\n\n    // Simple path when no queries exist\n    if (!queries?.length) {\n      this._setNoDataState();\n      return;\n    }\n\n    const request: DataQueryRequest = {\n      app: CoreApp.Dashboard,\n      requestId: getNextRequestId(),\n      timezone: timeRange.getTimeZone(),\n      panelId: 1,\n      range: timeRange.state.value,\n      interval: '1s',\n      intervalMs: 1000,\n      targets: cloneDeep(queries),\n      maxDataPoints: this.getMaxDataPoints(),\n      scopedVars: sceneObjectScopedVar,\n      startTime: Date.now(),\n    };\n\n    try {\n      const datasource = this.state.datasource ?? findFirstDatasource(request.targets);\n      const ds = await getDataSource(datasource, request.scopedVars);\n\n      // Attach the data source name to each query\n      request.targets = request.targets.map((query) => {\n        if (!query.datasource) {\n          query.datasource = ds.getRef();\n        }\n        return query;\n      });\n\n      // TODO interpolate minInterval\n      const lowerIntervalLimit = minInterval ? minInterval : ds.interval;\n      const norm = rangeUtil.calculateInterval(timeRange.state.value, request.maxDataPoints!, lowerIntervalLimit);\n\n      // make shallow copy of scoped vars,\n      // and add built in variables interval and interval_ms\n      request.scopedVars = Object.assign({}, request.scopedVars, {\n        __interval: { text: norm.interval, value: norm.interval },\n        __interval_ms: { text: norm.intervalMs.toString(), value: norm.intervalMs },\n      });\n\n      request.interval = norm.interval;\n      request.intervalMs = norm.intervalMs;\n\n      const runRequest = getRunRequest();\n\n      writeSceneLog('SceneQueryRunner', 'Starting runRequest', this.state.key);\n\n      this._querySub = runRequest(ds, request).subscribe(this.onDataReceived);\n    } catch (err) {\n      console.error('PanelQueryRunner Error', err);\n    }\n  }\n\n  private onDataReceived = (data: PanelData) => {\n    const preProcessedData = preProcessPanelData(data, this.state.data);\n    this.setState({ data: preProcessedData });\n  };\n\n  private _setNoDataState() {\n    if (this.state.data !== emptyPanelData) {\n      this.setState({ data: emptyPanelData });\n    }\n  }\n}\n\nexport function findFirstDatasource(targets: DataQuery[]): DataSourceRef | undefined {\n  return targets.find((t) => t.datasource !== null)?.datasource ?? undefined;\n}\n"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -1,7 +1,7 @@
-import React, { CSSProperties } from 'react';
+import React$1, { CSSProperties } from 'react';
 import { Observable, Unsubscribable, MonoTypeOperatorFunction, Subscription } from 'rxjs';
-import { BusEventWithPayload, PanelData, BusEvent, BusEventType, BusEventHandler, TimeZone, TimeRange, DataTransformContext, DataFrame, ScopedVars, DataTransformerConfig, Registry, RegistryItem, DataSourceRef as DataSourceRef$1, VariableRefresh, VariableSort, PanelMenuItem, FieldConfigSource, PanelPlugin, AbsoluteTimeRange, InterpolateFunction, IconName as IconName$1 } from '@grafana/data';
-import { VariableType, VariableHide, DataSourceRef, DataQuery } from '@grafana/schema';
+import { BusEventWithPayload, PanelData, BusEvent, BusEventType, BusEventHandler, TimeRange, DataTransformContext, DataFrame, ScopedVars, DataTransformerConfig, Registry, RegistryItem, DataSourceRef as DataSourceRef$1, VariableRefresh, VariableSort, PanelMenuItem, FieldConfigSource, PanelPlugin, AbsoluteTimeRange, InterpolateFunction, IconName as IconName$1 } from '@grafana/data';
+import { VariableType, VariableHide, TimeZone, DataSourceRef, DataQuery } from '@grafana/schema';
 import { PanelContext, IconName } from '@grafana/ui';
 import ReactGridLayout from 'react-grid-layout';
 import { RouteComponentProps } from 'react-router-dom';
@@ -116,7 +116,7 @@ interface SceneLayoutChildOptions {
 interface SceneComponentProps<T> {
     model: T;
 }
-type SceneComponent<TModel> = (props: SceneComponentProps<TModel>) => React.ReactElement | null;
+type SceneComponent<TModel> = (props: SceneComponentProps<TModel>) => React$1.ReactElement | null;
 interface SceneDataState extends SceneObjectState {
     data?: PanelData;
 }
@@ -151,7 +151,7 @@ interface SceneObject<TState extends SceneObjectState = SceneObjectState> {
     /** Returns a deep clone this object and all its children */
     clone(state?: Partial<TState>): this;
     /** A React component to use for rendering the object */
-    Component(props: SceneComponentProps<SceneObject<TState>>): React.ReactElement | null;
+    Component(props: SceneComponentProps<SceneObject<TState>>): React$1.ReactElement | null;
     /** Force a re-render, should only be needed when variable values change */
     forceRender(): void;
     /**
@@ -182,13 +182,15 @@ interface SceneLayout<T extends SceneLayoutState = SceneLayoutState> extends Sce
 interface SceneTimeRangeState extends SceneObjectState {
     from: string;
     to: string;
-    timeZone: TimeZone;
     fiscalYearStartMonth?: number;
     value: TimeRange;
+    timeZone?: TimeZone;
 }
 interface SceneTimeRangeLike extends SceneObject<SceneTimeRangeState> {
+    onTimeZoneChange(timeZone: TimeZone): void;
     onTimeRangeChange(timeRange: TimeRange): void;
     onRefresh(): void;
+    getTimeZone(): TimeZone;
 }
 interface SceneObjectRef {
     ref: SceneObject;
@@ -364,7 +366,14 @@ declare class SceneObjectUrlSyncConfig implements SceneObjectUrlSyncHandler {
 declare class SceneTimeRange extends SceneObjectBase<SceneTimeRangeState> implements SceneTimeRangeLike {
     protected _urlSync: SceneObjectUrlSyncConfig;
     constructor(state?: Partial<SceneTimeRangeState>);
+    private _onActivate;
+    /**
+     * Will traverse up the scene graph to find the closest SceneTimeRangeLike with time zone set
+     */
+    private getTimeZoneSource;
+    getTimeZone(): TimeZone;
     onTimeRangeChange: (timeRange: TimeRange) => void;
+    onTimeZoneChange: (timeZone: TimeZone) => void;
     onRefresh: () => void;
     getUrlState(): {
         from: string;
@@ -373,6 +382,19 @@ declare class SceneTimeRange extends SceneObjectBase<SceneTimeRangeState> implem
     updateFromUrl(values: SceneObjectUrlValues): void;
 }
 
+interface SceneTimeZoneOverrideState extends SceneTimeRangeState {
+    timeZone: TimeZone;
+}
+declare class SceneTimeZoneOverride extends SceneObjectBase<SceneTimeZoneOverrideState> implements SceneTimeRangeLike {
+    constructor(state: Omit<SceneTimeZoneOverrideState, 'from' | 'to' | 'value'>);
+    private getTimeRangeObject;
+    private _activationHandler;
+    getTimeZone(): TimeZone;
+    onTimeRangeChange(timeRange: TimeRange): void;
+    onTimeZoneChange(timeZone: string): void;
+    onRefresh(): void;
+}
+
 interface VariableDependencyConfigOptions<TState extends SceneObjectState> {
     /**
      * State paths to scan / extract variable dependencies from. Leave empty to scan all paths.
@@ -755,6 +777,7 @@ interface VizPanelState<TOptions = {}, TFieldConfig = {}> extends SceneObjectSta
     menu?: VizPanelMenu;
     isDraggable?: boolean;
     isResizable?: boolean;
+    headerActions?: React.ReactNode | SceneObject;
     pluginLoadError?: string;
     pluginInstanceState?: any;
 }
@@ -827,6 +850,7 @@ interface SceneCanvasTextState extends SceneObjectState {
     text: string;
     fontSize?: number;
     align?: 'left' | 'center' | 'right';
+    spacing?: number;
 }
 /**
  * Not a really useful component, just an example of how to create one
@@ -886,8 +910,6 @@ interface SceneFlexItemStateLike extends SceneFlexItemPlacement, SceneObjectStat
 interface SceneFlexItemLike extends SceneObject<SceneFlexItemStateLike> {
 }
 interface SceneFlexLayoutState extends SceneObjectState, SceneFlexItemPlacement {
-    direction?: CSSProperties['flexDirection'];
-    wrap?: CSSProperties['flexWrap'];
     children: SceneFlexItemLike[];
 }
 declare class SceneFlexLayout extends SceneObjectBase<SceneFlexLayoutState> implements SceneLayout {
@@ -895,10 +917,10 @@ declare class SceneFlexLayout extends SceneObjectBase<SceneFlexLayoutState> impl
     toggleDirection(): void;
     isDraggable(): boolean;
 }
-declare function SceneFlexLayoutRenderer({ model, parentDirection }: SceneFlexItemRenderProps<SceneFlexLayout>): JSX.Element | null;
+declare function SceneFlexLayoutRenderer({ model, parentState }: SceneFlexItemRenderProps<SceneFlexLayout>): JSX.Element | null;
 interface SceneFlexItemPlacement {
-    flexGrow?: CSSProperties['flexGrow'];
-    alignSelf?: CSSProperties['alignSelf'];
+    wrap?: CSSProperties['flexWrap'];
+    direction?: CSSProperties['flexDirection'];
     width?: CSSProperties['width'];
     height?: CSSProperties['height'];
     minWidth?: CSSProperties['minWidth'];
@@ -912,18 +934,22 @@ interface SceneFlexItemPlacement {
      * Useful for conditional display of layout items
      */
     isHidden?: boolean;
+    /**
+     * Set direction for smaller screens. This defaults to column.
+     * This equals media query theme.breakpoints.down('md')
+     */
+    md?: SceneFlexItemPlacement;
 }
 interface SceneFlexItemState extends SceneFlexItemPlacement, SceneObjectState {
     body: SceneObject | undefined;
-    isHidden?: boolean;
 }
 interface SceneFlexItemRenderProps<T> extends SceneComponentProps<T> {
-    parentDirection?: CSSProperties['flexDirection'];
+    parentState?: SceneFlexItemPlacement;
 }
 declare class SceneFlexItem extends SceneObjectBase<SceneFlexItemState> {
     static Component: typeof SceneFlexItemRenderer;
 }
-declare function SceneFlexItemRenderer({ model, parentDirection }: SceneFlexItemRenderProps<SceneFlexItem>): JSX.Element | null;
+declare function SceneFlexItemRenderer({ model, parentState }: SceneFlexItemRenderProps<SceneFlexItem>): JSX.Element | null;
 
 interface SceneByFrameRepeaterState extends SceneObjectState {
     body: SceneFlexLayout;
@@ -1041,6 +1067,11 @@ interface SceneAppPageState extends SceneObjectState {
     title: string;
     /** Page subTitle */
     subTitle?: string;
+    /**
+     * Customize title rendering.
+     * Please return an unstyled h1 tag here + any additional elements you need.
+     **/
+    renderTitle?: (title: string) => React.ReactNode;
     /** For an image before title */
     titleImg?: string;
     /** For an icon before title */
@@ -1107,7 +1138,7 @@ interface SceneReactObjectState<TProps = {}> extends SceneObjectState {
     /**
      * React component to render
      */
-    component?: React.ComponentType<TProps>;
+    component?: React$1.ComponentType<TProps>;
     /**
      * Props to pass to the component
      */
@@ -1115,7 +1146,7 @@ interface SceneReactObjectState<TProps = {}> extends SceneObjectState {
     /**
      * Alternative to component and props is just to pass a React node
      */
-    reactNode?: React.ReactNode;
+    reactNode?: React$1.ReactNode;
 }
 /**
  * A utility object that can be used to render any React component or ReactNode
@@ -1124,4 +1155,4 @@ declare class SceneReactObject extends SceneObjectBase<SceneReactObjectState> {
     static Component: ({ model }: SceneComponentProps<SceneReactObject>) => {} | null;
 }
 
-export { CancelActivationHandler, ConstantVariable, CustomFormatterVariable, CustomTransformOperator, CustomVariable, CustomVariableValue, DataSourceVariable, DeepPartial, EmbeddedScene, EmbeddedSceneState, FormatVariable, InterpolationFormatParameter, NestedScene, QueryRunnerState, QueryVariable, SceneActivationHandler, SceneApp, SceneAppDrilldownView, SceneAppPage, SceneAppPageLike, SceneAppPageState, SceneAppRoute, SceneByFrameRepeater, SceneCanvasText, SceneComponent, SceneComponentProps, SceneControlsSpacer, SceneDataNode, SceneDataProvider, SceneDataState, SceneDataTransformer, SceneDeactivationHandler, SceneFlexItem, SceneFlexLayout, SceneGridItem, SceneGridLayout, SceneGridRow, SceneLayout, SceneLayoutChildOptions, SceneLayoutState, SceneObject, SceneObjectBase, SceneObjectRef, SceneObjectState, SceneObjectStateChangedEvent, SceneObjectStateChangedPayload, SceneObjectUrlSyncConfig, SceneObjectUrlSyncHandler, SceneObjectUrlValue, SceneObjectUrlValues, SceneObjectWithUrlSync, SceneQueryRunner, SceneReactObject, SceneRefreshPicker, SceneRouteMatch, SceneStateChangedHandler, SceneStatelessBehavior, SceneTimePicker, SceneTimeRange, SceneTimeRangeLike, SceneTimeRangeState, SceneToolbarButton, SceneToolbarInput, SceneVariable, SceneVariableDependencyConfigLike, SceneVariableSet, SceneVariableSetState, SceneVariableState, SceneVariableValueChangedEvent, SceneVariables, TestVariable, TextBoxVariable, UrlSyncManagerLike as UrlSyncManager, ValidateAndUpdateResult, VariableCustomFormatterFn, VariableDependencyConfig, VariableValue, VariableValueOption, VariableValueSelectors, VariableValueSingle, VizPanel, VizPanelMenu, VizPanelState, formatRegistry, getUrlSyncManager, isCustomVariableValue, isSceneObject, registerRuntimePanelPlugin, sceneGraph };
+export { CancelActivationHandler, ConstantVariable, CustomFormatterVariable, CustomTransformOperator, CustomVariable, CustomVariableValue, DataSourceVariable, DeepPartial, EmbeddedScene, EmbeddedSceneState, FormatVariable, InterpolationFormatParameter, NestedScene, QueryRunnerState, QueryVariable, SceneActivationHandler, SceneApp, SceneAppDrilldownView, SceneAppPage, SceneAppPageLike, SceneAppPageState, SceneAppRoute, SceneByFrameRepeater, SceneCanvasText, SceneComponent, SceneComponentProps, SceneControlsSpacer, SceneDataNode, SceneDataProvider, SceneDataState, SceneDataTransformer, SceneDeactivationHandler, SceneFlexItem, SceneFlexItemState, SceneFlexLayout, SceneGridItem, SceneGridLayout, SceneGridRow, SceneLayout, SceneLayoutChildOptions, SceneLayoutState, SceneObject, SceneObjectBase, SceneObjectRef, SceneObjectState, SceneObjectStateChangedEvent, SceneObjectStateChangedPayload, SceneObjectUrlSyncConfig, SceneObjectUrlSyncHandler, SceneObjectUrlValue, SceneObjectUrlValues, SceneObjectWithUrlSync, SceneQueryRunner, SceneReactObject, SceneRefreshPicker, SceneRouteMatch, SceneStateChangedHandler, SceneStatelessBehavior, SceneTimePicker, SceneTimeRange, SceneTimeRangeLike, SceneTimeRangeState, SceneTimeZoneOverride, SceneToolbarButton, SceneToolbarInput, SceneVariable, SceneVariableDependencyConfigLike, SceneVariableSet, SceneVariableSetState, SceneVariableState, SceneVariableValueChangedEvent, SceneVariables, TestVariable, TextBoxVariable, UrlSyncManagerLike as UrlSyncManager, ValidateAndUpdateResult, VariableCustomFormatterFn, VariableDependencyConfig, VariableValue, VariableValueOption, VariableValueSelectors, VariableValueSingle, VizPanel, VizPanelMenu, VizPanelState, formatRegistry, getUrlSyncManager, isCustomVariableValue, isSceneObject, registerRuntimePanelPlugin, sceneGraph };