@grafana/scenes 0.0.4 → 0.0.5

package/README.md

@@ -15,6 +15,8 @@
 
 ## Development
 
+### Working with Grafana
+
 @grafana/scenes does not come with dedicated playground yet. It is currently possible to run Scene demos using Grafana. To do that, the following setup is required.
 
 1. Clone @grafana/scenes repository.
@@ -24,3 +26,10 @@
 1. From Grafana directory run `yarn install`.
 1. Start Grafana with `scenes` [feature toggle enabled](https://grafana.com/docs/grafana/latest/setup-grafana/configure-grafana/#feature_toggles)
 1. Navigate to `http://localhost:3000/scenes` to explore demo scenes.
+
+### Working with Grafana app plugin
+
+1. Run `YARN_IGNORE_PATH=1 yarn link` from @grafana/scenes directory.
+1. Run `yarn dev` from @grafana/scenes directory.
+1. Run `yarn link @grafana/scenes` from app plugin directory.
+1. Start app plugin development server.

package/dist/esm/components/SceneByFrameRepeater.js

@@ -0,0 +1,38 @@
+import React from 'react';
+import { LoadingState } from '@grafana/data';
+import { SceneObjectBase } from '../core/SceneObjectBase.js';
+import { sceneGraph } from '../core/sceneGraph.js';
+
+class SceneByFrameRepeater extends SceneObjectBase {
+  activate() {
+    super.activate();
+    this._subs.add(
+      sceneGraph.getData(this).subscribeToState({
+        next: (data) => {
+          var _a;
+          if (((_a = data.data) == null ? void 0 : _a.state) === LoadingState.Done) {
+            this.performRepeat(data.data);
+          }
+        }
+      })
+    );
+  }
+  performRepeat(data) {
+    const newChildren = [];
+    for (let seriesIndex = 0; seriesIndex < data.series.length; seriesIndex++) {
+      const layoutChild = this.state.getLayoutChild(data, data.series[seriesIndex], seriesIndex);
+      newChildren.push(layoutChild);
+    }
+    this.state.body.setState({ children: newChildren });
+  }
+}
+SceneByFrameRepeater.Component = ({ model, isEditing }) => {
+  const { body } = model.useState();
+  return /* @__PURE__ */ React.createElement(body.Component, {
+    model: body,
+    isEditing
+  });
+};
+
+export { SceneByFrameRepeater };
+//# sourceMappingURL=SceneByFrameRepeater.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SceneByFrameRepeater.js","sources":["../../../src/components/SceneByFrameRepeater.tsx"],"sourcesContent":["import React from 'react';\n\nimport { LoadingState, PanelData, DataFrame } from '@grafana/data';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { sceneGraph } from '../core/sceneGraph';\nimport {\n  SceneComponentProps,\n  SceneObject,\n  SceneObjectStatePlain,\n  SceneLayoutState,\n  SceneLayoutChild,\n} from '../core/types';\n\ninterface RepeatOptions extends SceneObjectStatePlain {\n  body: SceneObject<SceneLayoutState>;\n  getLayoutChild(data: PanelData, frame: DataFrame, frameIndex: number): SceneLayoutChild;\n}\n\nexport class SceneByFrameRepeater extends SceneObjectBase<RepeatOptions> {\n  public activate(): void {\n    super.activate();\n\n    this._subs.add(\n      sceneGraph.getData(this).subscribeToState({\n        next: (data) => {\n          if (data.data?.state === LoadingState.Done) {\n            this.performRepeat(data.data);\n          }\n        },\n      })\n    );\n  }\n\n  private performRepeat(data: PanelData) {\n    const newChildren: SceneLayoutChild[] = [];\n\n    for (let seriesIndex = 0; seriesIndex < data.series.length; seriesIndex++) {\n      const layoutChild = this.state.getLayoutChild(data, data.series[seriesIndex], seriesIndex);\n      newChildren.push(layoutChild);\n    }\n\n    this.state.body.setState({ children: newChildren });\n  }\n\n  public static Component = ({ model, isEditing }: SceneComponentProps<SceneByFrameRepeater>) => {\n    const { body } = model.useState();\n    return <body.Component model={body} isEditing={isEditing} />;\n  };\n}\n"],"names":[],"mappings":";;;;;AAmBO,MAAM,6BAA6B,eAA+B,CAAA;AAAA,EAChE,QAAiB,GAAA;AACtB,IAAA,KAAA,CAAM,QAAS,EAAA,CAAA;AAEf,IAAA,IAAA,CAAK,KAAM,CAAA,GAAA;AAAA,MACT,UAAW,CAAA,OAAA,CAAQ,IAAI,CAAA,CAAE,gBAAiB,CAAA;AAAA,QACxC,IAAA,EAAM,CAAC,IAAS,KAAA;AAzBxB,UAAA,IAAA,EAAA,CAAA;AA0BU,UAAA,IAAA,CAAA,CAAI,EAAK,GAAA,IAAA,CAAA,IAAA,KAAL,IAAW,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,MAAU,aAAa,IAAM,EAAA;AAC1C,YAAK,IAAA,CAAA,aAAA,CAAc,KAAK,IAAI,CAAA,CAAA;AAAA,WAC9B;AAAA,SACF;AAAA,OACD,CAAA;AAAA,KACH,CAAA;AAAA,GACF;AAAA,EAEQ,cAAc,IAAiB,EAAA;AACrC,IAAA,MAAM,cAAkC,EAAC,CAAA;AAEzC,IAAA,KAAA,IAAS,cAAc,CAAG,EAAA,WAAA,GAAc,IAAK,CAAA,MAAA,CAAO,QAAQ,WAAe,EAAA,EAAA;AACzE,MAAM,MAAA,WAAA,GAAc,KAAK,KAAM,CAAA,cAAA,CAAe,MAAM,IAAK,CAAA,MAAA,CAAO,cAAc,WAAW,CAAA,CAAA;AACzF,MAAA,WAAA,CAAY,KAAK,WAAW,CAAA,CAAA;AAAA,KAC9B;AAEA,IAAA,IAAA,CAAK,MAAM,IAAK,CAAA,QAAA,CAAS,EAAE,QAAA,EAAU,aAAa,CAAA,CAAA;AAAA,GACpD;AAMF,CAAA;AA9Ba,oBAAA,CA0BG,SAAY,GAAA,CAAC,EAAE,KAAA,EAAO,WAA2D,KAAA;AAC7F,EAAA,MAAM,EAAE,IAAA,EAAS,GAAA,KAAA,CAAM,QAAS,EAAA,CAAA;AAChC,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,KAAK,SAAL,EAAA;AAAA,IAAe,KAAO,EAAA,IAAA;AAAA,IAAM,SAAA;AAAA,GAAsB,CAAA,CAAA;AAC5D,CAAA;;;;"}

package/dist/esm/index.js

@@ -25,7 +25,7 @@ export { NestedScene } from './components/NestedScene.js';
 export { SceneCanvasText } from './components/SceneCanvasText.js';
 export { SceneToolbarButton, SceneToolbarInput } from './components/SceneToolbarButton.js';
 export { SceneTimePicker } from './components/SceneTimePicker.js';
-export { ScenePanelRepeater } from './components/ScenePanelRepeater.js';
+export { SceneByFrameRepeater } from './components/SceneByFrameRepeater.js';
 export { SceneSubMenu } from './components/SceneSubMenu.js';
 export { SceneFlexLayout } from './components/layout/SceneFlexLayout.js';
 export { SceneGridLayout } from './components/layout/SceneGridLayout.js';

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import React from 'react';
 import { Observable, Observer, Subscription, Unsubscribable } from 'rxjs';
-import { BusEventWithPayload, PanelData, BusEvent, BusEventType, BusEventHandler, TimeZone, TimeRange, ScopedVars, DataTransformerConfig, DataSourceRef, DataQuery, Registry, RegistryItem, VariableRefresh, VariableSort, FieldConfigSource, PanelPlugin, AbsoluteTimeRange } from '@grafana/data';
+import { BusEventWithPayload, PanelData, BusEvent, BusEventType, BusEventHandler, TimeZone, TimeRange, ScopedVars, DataTransformerConfig, DataSourceRef, DataQuery, Registry, RegistryItem, VariableRefresh, VariableSort, FieldConfigSource, PanelPlugin, AbsoluteTimeRange, DataFrame } from '@grafana/data';
 import { VariableType, VariableHide, VariableModel } from '@grafana/schema';
 import { IconName } from '@grafana/ui';
 import ReactGridLayout from 'react-grid-layout';
@@ -719,12 +719,13 @@ declare class SceneTimePicker extends SceneObjectBase<SceneTimePickerState> {
 declare function SceneTimePickerRenderer({ model }: SceneComponentProps<SceneTimePicker>): JSX.Element | null;
 
 interface RepeatOptions extends SceneObjectStatePlain {
-    layout: SceneObject<SceneLayoutState>;
+    body: SceneObject<SceneLayoutState>;
+    getLayoutChild(data: PanelData, frame: DataFrame, frameIndex: number): SceneLayoutChild;
 }
-declare class ScenePanelRepeater extends SceneObjectBase<RepeatOptions> {
+declare class SceneByFrameRepeater extends SceneObjectBase<RepeatOptions> {
     activate(): void;
     private performRepeat;
-    static Component: ({ model, isEditing }: SceneComponentProps<ScenePanelRepeater>) => JSX.Element;
+    static Component: ({ model, isEditing }: SceneComponentProps<SceneByFrameRepeater>) => JSX.Element;
 }
 
 interface SceneSubMenuState extends SceneLayoutState {
@@ -793,4 +794,4 @@ declare class SceneGridLayout extends SceneObjectBase<SceneGridLayoutState> {
 }
 declare function SceneGridLayoutRenderer({ model }: SceneComponentProps<SceneGridLayout>): JSX.Element;
 
-export { ConstantVariable, CustomFormatterFn, CustomVariable, DataSourceVariable, DeepPartial, EmbeddedScene, FormatRegistryID, FormatVariable, NestedScene, QueryRunnerState, QueryVariable, SceneCanvasText, SceneComponent, SceneComponentProps, SceneDataNode, SceneDataState, SceneDataTransformer, SceneEditor, SceneEditorState, SceneFlexLayout, SceneGridLayout, SceneGridRow, SceneLayout, SceneLayoutChild, SceneLayoutChildOptions, SceneLayoutChildState, SceneLayoutState, SceneObject, SceneObjectBase, SceneObjectRef, SceneObjectState, SceneObjectStateChangedEvent, SceneObjectStateChangedPayload, SceneObjectStatePlain, SceneObjectUrlSyncConfig, SceneObjectUrlSyncHandler, SceneObjectUrlValue, SceneObjectUrlValues, SceneObjectWithUrlSync, ScenePanelRepeater, SceneQueryRunner, SceneState, SceneSubMenu, SceneTimePicker, SceneTimeRange, SceneTimeRangeLike, SceneTimeRangeState, SceneToolbarButton, SceneToolbarInput, SceneVariable, SceneVariableDependencyConfigLike, SceneVariableSet, SceneVariableSetState, SceneVariableState, SceneVariableValueChangedEvent, SceneVariables, TestVariable, UrlSyncManager, ValidateAndUpdateResult, VariableValue, VariableValueCustom, VariableValueOption, VariableValueSelectors, VariableValueSingle, VizPanel, VizPanelState, formatRegistry, isSceneObject, sceneGraph };
+export { ConstantVariable, CustomFormatterFn, CustomVariable, DataSourceVariable, DeepPartial, EmbeddedScene, FormatRegistryID, FormatVariable, NestedScene, QueryRunnerState, QueryVariable, SceneByFrameRepeater, SceneCanvasText, SceneComponent, SceneComponentProps, SceneDataNode, SceneDataState, SceneDataTransformer, SceneEditor, SceneEditorState, SceneFlexLayout, SceneGridLayout, SceneGridRow, SceneLayout, SceneLayoutChild, SceneLayoutChildOptions, SceneLayoutChildState, SceneLayoutState, SceneObject, SceneObjectBase, SceneObjectRef, SceneObjectState, SceneObjectStateChangedEvent, SceneObjectStateChangedPayload, SceneObjectStatePlain, SceneObjectUrlSyncConfig, SceneObjectUrlSyncHandler, SceneObjectUrlValue, SceneObjectUrlValues, SceneObjectWithUrlSync, SceneQueryRunner, SceneState, SceneSubMenu, SceneTimePicker, SceneTimeRange, SceneTimeRangeLike, SceneTimeRangeState, SceneToolbarButton, SceneToolbarInput, SceneVariable, SceneVariableDependencyConfigLike, SceneVariableSet, SceneVariableSetState, SceneVariableState, SceneVariableValueChangedEvent, SceneVariables, TestVariable, UrlSyncManager, ValidateAndUpdateResult, VariableValue, VariableValueCustom, VariableValueOption, VariableValueSelectors, VariableValueSingle, VizPanel, VizPanelState, formatRegistry, isSceneObject, sceneGraph };