@grafana/scenes 4.20.0--canary.705.9031064372.0 → 4.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/esm/components/layout/grid/SceneGridLayoutRenderer.js +18 -2
  3. package/dist/esm/components/layout/grid/SceneGridLayoutRenderer.js.map +1 -1
  4. package/dist/index.d.ts +23 -23
  5. package/dist/index.js +17 -1
  6. package/dist/index.js.map +1 -1
  7. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,3 +1,19 @@
1
+ # v4.20.0 (Mon May 13 2024)
2
+
3
+ #### 🚀 Enhancement
4
+
5
+ - GroupByVariable: Sync label to URL [#705](https://github.com/grafana/scenes/pull/705) ([@bfmatei](https://github.com/bfmatei))
6
+ - Typescript: Enable strict mode [#728](https://github.com/grafana/scenes/pull/728) ([@torkelo](https://github.com/torkelo))
7
+ - SceneGridLayout: Prevent panels from moving on mount [#733](https://github.com/grafana/scenes/pull/733) ([@torkelo](https://github.com/torkelo) [@ivanortegaalba](https://github.com/ivanortegaalba))
8
+
9
+ #### Authors: 3
10
+
11
+ - Bogdan Matei ([@bfmatei](https://github.com/bfmatei))
12
+ - Ivan Ortega Alba ([@ivanortegaalba](https://github.com/ivanortegaalba))
13
+ - Torkel Ödegaard ([@torkelo](https://github.com/torkelo))
14
+
15
+ ---
16
+
1
17
  # v4.19.0 (Fri May 10 2024)
2
18
 
3
19
  #### 🚀 Enhancement
package/dist/esm/components/layout/grid/SceneGridLayoutRenderer.js CHANGED
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { useRef, useEffect } from 'react';
2
2
  import ReactGridLayout from 'react-grid-layout';
3
3
  import AutoSizer from 'react-virtualized-auto-sizer';
4
4
  import { GRID_CELL_VMARGIN, GRID_COLUMN_COUNT, GRID_CELL_HEIGHT } from './constants.js';
@@ -39,6 +39,10 @@ var __objRest = (source, exclude) => {
39
39
  };
40
40
  function SceneGridLayoutRenderer({ model }) {
41
41
  const { children, isLazy, isDraggable, isResizable } = model.useState();
42
+ const ref = useRef(null);
43
+ useEffect(() => {
44
+ updateAnimationClass(ref, !!isDraggable);
45
+ }, [isDraggable]);
42
46
  validateChildrenSize(children);
43
47
  return /* @__PURE__ */ React.createElement(AutoSizer, null, ({ width, height }) => {
44
48
  if (width === 0) {
@@ -46,8 +50,9 @@ function SceneGridLayoutRenderer({ model }) {
46
50
  }
47
51
  const layout = model.buildGridLayout(width, height);
48
52
  return /* @__PURE__ */ React.createElement("div", {
53
+ ref,
49
54
  style: { width: `${width}px`, height: "100%", position: "relative", zIndex: 1 },
50
- className: cx("react-grid-layout", isDraggable && "react-grid-layout--enable-move-animations")
55
+ className: "react-grid-layout"
51
56
  }, /* @__PURE__ */ React.createElement(ReactGridLayout, {
52
57
  width,
53
58
  isDraggable: isDraggable && width > 768,
@@ -110,6 +115,17 @@ function validateChildrenSize(children) {
110
115
  throw new Error("All children must have a size specified");
111
116
  }
112
117
  }
118
+ function updateAnimationClass(ref, isDraggable, retry) {
119
+ if (ref.current) {
120
+ if (isDraggable) {
121
+ ref.current.classList.add("react-grid-layout--enable-move-animations");
122
+ } else {
123
+ ref.current.classList.remove("react-grid-layout--enable-move-animations");
124
+ }
125
+ } else if (!retry) {
126
+ setTimeout(() => updateAnimationClass(ref, isDraggable, true), 50);
127
+ }
128
+ }
113
129
  const ResizeHandle = React.forwardRef((_a, ref) => {
114
130
  var _b = _a, divProps = __objRest(_b, ["handleAxis"]);
115
131
  const customCssClass = useStyles2(getResizeHandleStyles);
package/dist/esm/components/layout/grid/SceneGridLayoutRenderer.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SceneGridLayoutRenderer.js","sources":["../../../../../src/components/layout/grid/SceneGridLayoutRenderer.tsx"],"sourcesContent":["import React from 'react';\nimport ReactGridLayout from 'react-grid-layout';\nimport AutoSizer from 'react-virtualized-auto-sizer';\nimport { SceneComponentProps } from '../../../core/types';\nimport { GRID_CELL_HEIGHT, GRID_CELL_VMARGIN, GRID_COLUMN_COUNT } from './constants';\nimport { LazyLoader } from '../LazyLoader';\nimport { SceneGridLayout } from './SceneGridLayout';\nimport { SceneGridItemLike } from './types';\nimport { useStyles2 } from '@grafana/ui';\nimport { css, cx } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\n\nexport function SceneGridLayoutRenderer({ model }: SceneComponentProps<SceneGridLayout>) {\n const { children, isLazy, isDraggable, isResizable } = model.useState();\n\n validateChildrenSize(children);\n\n return (\n <AutoSizer>\n {({ width, height }) => {\n if (width === 0) {\n return null;\n }\n\n const layout = model.buildGridLayout(width, height);\n\n return (\n /**\n * The children is using a width of 100% so we need to guarantee that it is wrapped\n * in an element that has the calculated size given by the AutoSizer. The AutoSizer\n * has a width of 0 and will let its content overflow its div.\n */\n <div\n style={{ width: `${width}px`, height: '100%', position: 'relative', zIndex: 1 }}\n className={cx('react-grid-layout', isDraggable && 'react-grid-layout--enable-move-animations')}\n >\n <ReactGridLayout\n width={width}\n /**\n Disable draggable if mobile device, solving an issue with unintentionally\n moving panels. https://github.com/grafana/grafana/issues/18497\n theme.breakpoints.md = 769\n */\n isDraggable={isDraggable && width > 768}\n isResizable={isResizable ?? false}\n containerPadding={[0, 0]}\n useCSSTransforms={true}\n margin={[GRID_CELL_VMARGIN, GRID_CELL_VMARGIN]}\n cols={GRID_COLUMN_COUNT}\n rowHeight={GRID_CELL_HEIGHT}\n draggableHandle={`.grid-drag-handle-${model.state.key}`}\n draggableCancel=\".grid-drag-cancel\"\n layout={layout}\n onDragStart={model.onDragStart}\n onDragStop={model.onDragStop}\n onResizeStop={model.onResizeStop}\n onLayoutChange={model.onLayoutChange}\n isBounded={false}\n resizeHandle={<ResizeHandle />}\n >\n {layout.map((gridItem, index) => (\n <GridItemWrapper\n key={gridItem.i}\n grid={model}\n layoutItem={gridItem}\n index={index}\n isLazy={isLazy}\n totalCount={layout.length}\n />\n ))}\n </ReactGridLayout>\n </div>\n );\n }}\n </AutoSizer>\n );\n}\n\ninterface GridItemWrapperProps extends React.HTMLAttributes<HTMLDivElement> {\n grid: SceneGridLayout;\n layoutItem: ReactGridLayout.Layout;\n index: number;\n totalCount: number;\n isLazy?: boolean;\n}\n\nconst GridItemWrapper = React.forwardRef<HTMLDivElement, GridItemWrapperProps>((props, ref) => {\n const { grid, layoutItem, index, totalCount, isLazy, style, onLoad, onChange, children, ...divProps } = props;\n const sceneChild = grid.getSceneLayoutChild(layoutItem.i)!;\n const className = sceneChild.getClassName?.();\n\n const innerContent = <sceneChild.Component model={sceneChild} key={sceneChild.state.key} />;\n\n if (isLazy) {\n return (\n <LazyLoader\n {...divProps}\n key={sceneChild.state.key!}\n data-griditem-key={sceneChild.state.key}\n className={cx(className, props.className)}\n style={style}\n ref={ref}\n >\n {innerContent}\n {children}\n </LazyLoader>\n );\n }\n\n return (\n <div\n {...divProps}\n ref={ref}\n key={sceneChild.state.key}\n data-griditem-key={sceneChild.state.key}\n className={cx(className, props.className)}\n style={style}\n >\n {innerContent}\n {children}\n </div>\n );\n});\n\nGridItemWrapper.displayName = 'GridItemWrapper';\n\nfunction validateChildrenSize(children: SceneGridItemLike[]) {\n if (\n children.some(\n (c) =>\n c.state.height === undefined ||\n c.state.width === undefined ||\n c.state.x === undefined ||\n c.state.y === undefined\n )\n ) {\n throw new Error('All children must have a size specified');\n }\n}\n\ninterface ResizeHandleProps extends React.HTMLAttributes<HTMLDivElement> {\n handleAxis?: string;\n}\n\nconst ResizeHandle = React.forwardRef<HTMLDivElement, ResizeHandleProps>(({ handleAxis, ...divProps }, ref) => {\n const customCssClass = useStyles2(getResizeHandleStyles);\n\n return (\n <div ref={ref} {...divProps} className={`${customCssClass} scene-resize-handle`}>\n <svg width=\"16px\" height=\"16px\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M21 15L15 21M21 8L8 21\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n </div>\n );\n});\n\nResizeHandle.displayName = 'ResizeHandle';\n\nfunction getResizeHandleStyles(theme: GrafanaTheme2) {\n return css({\n position: 'absolute',\n bottom: 0,\n right: 0,\n zIndex: 999,\n padding: theme.spacing(1.5, 0, 0, 1.5),\n color: theme.colors.border.strong,\n cursor: 'se-resize',\n '&:hover': {\n color: theme.colors.text.link,\n },\n svg: {\n display: 'block',\n },\n '.react-resizable-hide &': {\n display: 'none',\n },\n });\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"SceneGridLayoutRenderer.js","sources":["../../../../../src/components/layout/grid/SceneGridLayoutRenderer.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport ReactGridLayout from 'react-grid-layout';\nimport AutoSizer from 'react-virtualized-auto-sizer';\nimport { SceneComponentProps } from '../../../core/types';\nimport { GRID_CELL_HEIGHT, GRID_CELL_VMARGIN, GRID_COLUMN_COUNT } from './constants';\nimport { LazyLoader } from '../LazyLoader';\nimport { SceneGridLayout } from './SceneGridLayout';\nimport { SceneGridItemLike } from './types';\nimport { useStyles2 } from '@grafana/ui';\nimport { css, cx } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\n\nexport function SceneGridLayoutRenderer({ model }: SceneComponentProps<SceneGridLayout>) {\n const { children, isLazy, isDraggable, isResizable } = model.useState();\n const ref = useRef<HTMLDivElement | null>(null);\n\n /**\n * The class that enables drag animations needs to be added after mount otherwise panels move on mount to their set positions which is annoying\n */\n useEffect(() => {\n updateAnimationClass(ref, !!isDraggable);\n }, [isDraggable]);\n\n validateChildrenSize(children);\n\n return (\n <AutoSizer>\n {({ width, height }) => {\n if (width === 0) {\n return null;\n }\n\n const layout = model.buildGridLayout(width, height);\n\n return (\n /**\n * The children is using a width of 100% so we need to guarantee that it is wrapped\n * in an element that has the calculated size given by the AutoSizer. The AutoSizer\n * has a width of 0 and will let its content overflow its div.\n */\n <div\n ref={ref}\n style={{ width: `${width}px`, height: '100%', position: 'relative', zIndex: 1 }}\n className=\"react-grid-layout\"\n >\n <ReactGridLayout\n width={width}\n /**\n Disable draggable if mobile device, solving an issue with unintentionally\n moving panels. https://github.com/grafana/grafana/issues/18497\n theme.breakpoints.md = 769\n */\n isDraggable={isDraggable && width > 768}\n isResizable={isResizable ?? false}\n containerPadding={[0, 0]}\n useCSSTransforms={true}\n margin={[GRID_CELL_VMARGIN, GRID_CELL_VMARGIN]}\n cols={GRID_COLUMN_COUNT}\n rowHeight={GRID_CELL_HEIGHT}\n draggableHandle={`.grid-drag-handle-${model.state.key}`}\n draggableCancel=\".grid-drag-cancel\"\n layout={layout}\n onDragStart={model.onDragStart}\n onDragStop={model.onDragStop}\n onResizeStop={model.onResizeStop}\n onLayoutChange={model.onLayoutChange}\n isBounded={false}\n resizeHandle={<ResizeHandle />}\n >\n {layout.map((gridItem, index) => (\n <GridItemWrapper\n key={gridItem.i}\n grid={model}\n layoutItem={gridItem}\n index={index}\n isLazy={isLazy}\n totalCount={layout.length}\n />\n ))}\n </ReactGridLayout>\n </div>\n );\n }}\n </AutoSizer>\n );\n}\n\ninterface GridItemWrapperProps extends React.HTMLAttributes<HTMLDivElement> {\n grid: SceneGridLayout;\n layoutItem: ReactGridLayout.Layout;\n index: number;\n totalCount: number;\n isLazy?: boolean;\n}\n\nconst GridItemWrapper = React.forwardRef<HTMLDivElement, GridItemWrapperProps>((props, ref) => {\n const { grid, layoutItem, index, totalCount, isLazy, style, onLoad, onChange, children, ...divProps } = props;\n const sceneChild = grid.getSceneLayoutChild(layoutItem.i)!;\n const className = sceneChild.getClassName?.();\n\n const innerContent = <sceneChild.Component model={sceneChild} key={sceneChild.state.key} />;\n\n if (isLazy) {\n return (\n <LazyLoader\n {...divProps}\n key={sceneChild.state.key!}\n data-griditem-key={sceneChild.state.key}\n className={cx(className, props.className)}\n style={style}\n ref={ref}\n >\n {innerContent}\n {children}\n </LazyLoader>\n );\n }\n\n return (\n <div\n {...divProps}\n ref={ref}\n key={sceneChild.state.key}\n data-griditem-key={sceneChild.state.key}\n className={cx(className, props.className)}\n style={style}\n >\n {innerContent}\n {children}\n </div>\n );\n});\n\nGridItemWrapper.displayName = 'GridItemWrapper';\n\nfunction validateChildrenSize(children: SceneGridItemLike[]) {\n if (\n children.some(\n (c) =>\n c.state.height === undefined ||\n c.state.width === undefined ||\n c.state.x === undefined ||\n c.state.y === undefined\n )\n ) {\n throw new Error('All children must have a size specified');\n }\n}\n\nfunction updateAnimationClass(\n ref: React.MutableRefObject<HTMLDivElement | null>,\n isDraggable: boolean,\n retry?: boolean\n) {\n if (ref.current) {\n if (isDraggable) {\n ref.current.classList.add('react-grid-layout--enable-move-animations');\n } else {\n ref.current.classList.remove('react-grid-layout--enable-move-animations');\n }\n } else if (!retry) {\n setTimeout(() => updateAnimationClass(ref, isDraggable, true), 50);\n }\n}\n\ninterface ResizeHandleProps extends React.HTMLAttributes<HTMLDivElement> {\n handleAxis?: string;\n}\n\nconst ResizeHandle = React.forwardRef<HTMLDivElement, ResizeHandleProps>(({ handleAxis, ...divProps }, ref) => {\n const customCssClass = useStyles2(getResizeHandleStyles);\n\n return (\n <div ref={ref} {...divProps} className={`${customCssClass} scene-resize-handle`}>\n <svg width=\"16px\" height=\"16px\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M21 15L15 21M21 8L8 21\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n </div>\n );\n});\n\nResizeHandle.displayName = 'ResizeHandle';\n\nfunction getResizeHandleStyles(theme: GrafanaTheme2) {\n return css({\n position: 'absolute',\n bottom: 0,\n right: 0,\n zIndex: 999,\n padding: theme.spacing(1.5, 0, 0, 1.5),\n color: theme.colors.border.strong,\n cursor: 'se-resize',\n '&:hover': {\n color: theme.colors.text.link,\n },\n svg: {\n display: 'block',\n },\n '.react-resizable-hide &': {\n display: 'none',\n },\n });\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYgB,SAAA,uBAAA,CAAwB,EAAE,KAAA,EAA+C,EAAA;AACvF,EAAA,MAAM,EAAE,QAAU,EAAA,MAAA,EAAQ,aAAa,WAAY,EAAA,GAAI,MAAM,QAAS,EAAA,CAAA;AACtE,EAAM,MAAA,GAAA,GAAM,OAA8B,IAAI,CAAA,CAAA;AAK9C,EAAA,SAAA,CAAU,MAAM;AACd,IAAqB,oBAAA,CAAA,GAAA,EAAK,CAAC,CAAC,WAAW,CAAA,CAAA;AAAA,GACzC,EAAG,CAAC,WAAW,CAAC,CAAA,CAAA;AAEhB,EAAA,oBAAA,CAAqB,QAAQ,CAAA,CAAA;AAE7B,EAAA,2CACG,SACE,EAAA,IAAA,EAAA,CAAC,EAAE,KAAA,EAAO,QAAa,KAAA;AACtB,IAAA,IAAI,UAAU,CAAG,EAAA;AACf,MAAO,OAAA,IAAA,CAAA;AAAA,KACT;AAEA,IAAA,MAAM,MAAS,GAAA,KAAA,CAAM,eAAgB,CAAA,KAAA,EAAO,MAAM,CAAA,CAAA;AAElD,IAAA,uBAMG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,KAAA,EAAO,EAAE,KAAA,EAAO,CAAG,EAAA,KAAA,CAAA,EAAA,CAAA,EAAW,QAAQ,MAAQ,EAAA,QAAA,EAAU,UAAY,EAAA,MAAA,EAAQ,CAAE,EAAA;AAAA,MAC9E,SAAU,EAAA,mBAAA;AAAA,KAAA,kBAET,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA;AAAA,MACC,KAAA;AAAA,MAMA,WAAA,EAAa,eAAe,KAAQ,GAAA,GAAA;AAAA,MACpC,aAAa,WAAe,IAAA,IAAA,GAAA,WAAA,GAAA,KAAA;AAAA,MAC5B,gBAAA,EAAkB,CAAC,CAAA,EAAG,CAAC,CAAA;AAAA,MACvB,gBAAkB,EAAA,IAAA;AAAA,MAClB,MAAA,EAAQ,CAAC,iBAAA,EAAmB,iBAAiB,CAAA;AAAA,MAC7C,IAAM,EAAA,iBAAA;AAAA,MACN,SAAW,EAAA,gBAAA;AAAA,MACX,eAAA,EAAiB,CAAqB,kBAAA,EAAA,KAAA,CAAM,KAAM,CAAA,GAAA,CAAA,CAAA;AAAA,MAClD,eAAgB,EAAA,mBAAA;AAAA,MAChB,MAAA;AAAA,MACA,aAAa,KAAM,CAAA,WAAA;AAAA,MACnB,YAAY,KAAM,CAAA,UAAA;AAAA,MAClB,cAAc,KAAM,CAAA,YAAA;AAAA,MACpB,gBAAgB,KAAM,CAAA,cAAA;AAAA,MACtB,SAAW,EAAA,KAAA;AAAA,MACX,YAAA,sCAAe,YAAa,EAAA,IAAA,CAAA;AAAA,KAAA,EAE3B,MAAO,CAAA,GAAA,CAAI,CAAC,QAAA,EAAU,0BACpB,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA;AAAA,MACC,KAAK,QAAS,CAAA,CAAA;AAAA,MACd,IAAM,EAAA,KAAA;AAAA,MACN,UAAY,EAAA,QAAA;AAAA,MACZ,KAAA;AAAA,MACA,MAAA;AAAA,MACA,YAAY,MAAO,CAAA,MAAA;AAAA,KACrB,CACD,CACH,CACF,CAAA,CAAA;AAAA,GAGN,CAAA,CAAA;AAEJ,CAAA;AAUA,MAAM,eAAkB,GAAA,KAAA,CAAM,UAAiD,CAAA,CAAC,OAAO,GAAQ,KAAA;AA/F/F,EAAA,IAAA,EAAA,CAAA;AAgGE,EAAwG,MAAA,EAAA,GAAA,KAAA,EAAhG,QAAM,UAAY,EAAA,KAAA,EAAO,YAAY,MAAQ,EAAA,KAAA,EAAO,MAAQ,EAAA,QAAA,EAAU,QAhGhF,EAAA,GAgG0G,IAAb,QAAa,GAAA,SAAA,CAAA,EAAA,EAAb,CAAnF,MAAM,EAAA,YAAA,EAAY,SAAO,YAAY,EAAA,QAAA,EAAQ,OAAO,EAAA,QAAA,EAAQ,UAAU,EAAA,UAAA,CAAA,CAAA,CAAA;AAC9E,EAAA,MAAM,UAAa,GAAA,IAAA,CAAK,mBAAoB,CAAA,UAAA,CAAW,CAAC,CAAA,CAAA;AACxD,EAAM,MAAA,SAAA,GAAA,CAAY,gBAAW,YAAX,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,UAAA,CAAA,CAAA;AAElB,EAAM,MAAA,YAAA,mBAAgB,KAAA,CAAA,aAAA,CAAA,UAAA,CAAW,SAAX,EAAA;AAAA,IAAqB,KAAO,EAAA,UAAA;AAAA,IAAY,GAAA,EAAK,WAAW,KAAM,CAAA,GAAA;AAAA,GAAK,CAAA,CAAA;AAEzF,EAAA,IAAI,MAAQ,EAAA;AACV,IACE,uBAAA,KAAA,CAAA,aAAA,CAAC,6CACK,QADL,CAAA,EAAA;AAAA,MAEC,GAAA,EAAK,WAAW,KAAM,CAAA,GAAA;AAAA,MACtB,mBAAA,EAAmB,WAAW,KAAM,CAAA,GAAA;AAAA,MACpC,SAAW,EAAA,EAAA,CAAG,SAAW,EAAA,KAAA,CAAM,SAAS,CAAA;AAAA,MACxC,KAAA;AAAA,MACA,GAAA;AAAA,KAAA,CAAA,EAEC,cACA,QACH,CAAA,CAAA;AAAA,GAEJ;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,wCACK,QADL,CAAA,EAAA;AAAA,IAEC,GAAA;AAAA,IACA,GAAA,EAAK,WAAW,KAAM,CAAA,GAAA;AAAA,IACtB,mBAAA,EAAmB,WAAW,KAAM,CAAA,GAAA;AAAA,IACpC,SAAW,EAAA,EAAA,CAAG,SAAW,EAAA,KAAA,CAAM,SAAS,CAAA;AAAA,IACxC,KAAA;AAAA,GAAA,CAAA,EAEC,cACA,QACH,CAAA,CAAA;AAEJ,CAAC,CAAA,CAAA;AAED,eAAA,CAAgB,WAAc,GAAA,iBAAA,CAAA;AAE9B,SAAS,qBAAqB,QAA+B,EAAA;AAC3D,EAAA,IACE,QAAS,CAAA,IAAA;AAAA,IACP,CAAC,CACC,KAAA,CAAA,CAAE,KAAM,CAAA,MAAA,KAAW,UACnB,CAAE,CAAA,KAAA,CAAM,KAAU,KAAA,KAAA,CAAA,IAClB,EAAE,KAAM,CAAA,CAAA,KAAM,KACd,CAAA,IAAA,CAAA,CAAE,MAAM,CAAM,KAAA,KAAA,CAAA;AAAA,GAElB,EAAA;AACA,IAAM,MAAA,IAAI,MAAM,yCAAyC,CAAA,CAAA;AAAA,GAC3D;AACF,CAAA;AAEA,SAAS,oBAAA,CACP,GACA,EAAA,WAAA,EACA,KACA,EAAA;AACA,EAAA,IAAI,IAAI,OAAS,EAAA;AACf,IAAA,IAAI,WAAa,EAAA;AACf,MAAI,GAAA,CAAA,OAAA,CAAQ,SAAU,CAAA,GAAA,CAAI,2CAA2C,CAAA,CAAA;AAAA,KAChE,MAAA;AACL,MAAI,GAAA,CAAA,OAAA,CAAQ,SAAU,CAAA,MAAA,CAAO,2CAA2C,CAAA,CAAA;AAAA,KAC1E;AAAA,GACF,MAAA,IAAW,CAAC,KAAO,EAAA;AACjB,IAAA,UAAA,CAAW,MAAM,oBAAqB,CAAA,GAAA,EAAK,WAAa,EAAA,IAAI,GAAG,EAAE,CAAA,CAAA;AAAA,GACnE;AACF,CAAA;AAMA,MAAM,YAAe,GAAA,KAAA,CAAM,UAA8C,CAAA,CAAC,IAA6B,GAAQ,KAAA;AAArC,EAAA,IAAA,EAAA,GAAA,EAAA,CAAA,CAAiB,QAAA,GAAA,SAAA,CAAjB,IAAiB,CAAf,YAAA,CAAA,EAAA;AAC1E,EAAM,MAAA,cAAA,GAAiB,WAAW,qBAAqB,CAAA,CAAA;AAEvD,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,aAAA,CAAA,cAAA,CAAA;AAAA,IAAI,GAAA;AAAA,GAAA,EAAc,QAAlB,CAAA,EAAA;AAAA,IAA4B,WAAW,CAAG,EAAA,cAAA,CAAA,oBAAA,CAAA;AAAA,GAAA,CAAA,kBACxC,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,KAAM,EAAA,MAAA;AAAA,IAAO,MAAO,EAAA,MAAA;AAAA,IAAO,OAAQ,EAAA,WAAA;AAAA,IAAY,IAAK,EAAA,MAAA;AAAA,IAAO,KAAM,EAAA,4BAAA;AAAA,GAAA,kBACnE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACC,CAAE,EAAA,wBAAA;AAAA,IACF,MAAO,EAAA,cAAA;AAAA,IACP,WAAY,EAAA,GAAA;AAAA,IACZ,aAAc,EAAA,OAAA;AAAA,IACd,cAAe,EAAA,OAAA;AAAA,GACjB,CACF,CACF,CAAA,CAAA;AAEJ,CAAC,CAAA,CAAA;AAED,YAAA,CAAa,WAAc,GAAA,cAAA,CAAA;AAE3B,SAAS,sBAAsB,KAAsB,EAAA;AACnD,EAAA,OAAO,GAAI,CAAA;AAAA,IACT,QAAU,EAAA,UAAA;AAAA,IACV,MAAQ,EAAA,CAAA;AAAA,IACR,KAAO,EAAA,CAAA;AAAA,IACP,MAAQ,EAAA,GAAA;AAAA,IACR,SAAS,KAAM,CAAA,OAAA,CAAQ,GAAK,EAAA,CAAA,EAAG,GAAG,GAAG,CAAA;AAAA,IACrC,KAAA,EAAO,KAAM,CAAA,MAAA,CAAO,MAAO,CAAA,MAAA;AAAA,IAC3B,MAAQ,EAAA,WAAA;AAAA,IACR,SAAW,EAAA;AAAA,MACT,KAAA,EAAO,KAAM,CAAA,MAAA,CAAO,IAAK,CAAA,IAAA;AAAA,KAC3B;AAAA,IACA,GAAK,EAAA;AAAA,MACH,OAAS,EAAA,OAAA;AAAA,KACX;AAAA,IACA,yBAA2B,EAAA;AAAA,MACzB,OAAS,EAAA,MAAA;AAAA,KACX;AAAA,GACD,CAAA,CAAA;AACH;;;;"}
package/dist/index.d.ts CHANGED
@@ -1131,7 +1131,7 @@ declare class LiveNowTimer extends SceneObjectBase<LiveNowTimerState> {
1131
1131
  private timerId;
1132
1132
  private static REFRESH_RATE;
1133
1133
  constructor({ enabled }: {
1134
- enabled?: boolean;
1134
+ enabled?: boolean | undefined;
1135
1135
  });
1136
1136
  private _activationHandler;
1137
1137
  enable(): void;
@@ -1226,18 +1226,18 @@ declare class AnnotationsDataLayer extends SceneDataLayerBase<AnnotationsDataLay
1226
1226
  protected processEvents(query: AnnotationQuery, events: AnnotationQueryResults): {
1227
1227
  state: LoadingState;
1228
1228
  series: _grafana_data.DataFrame[];
1229
- structureRev?: number;
1230
- annotations?: _grafana_data.DataFrame[];
1231
- alertState?: _grafana_data.AlertStateInfo;
1232
- request?: _grafana_data.DataQueryRequest<_grafana_data.DataQuery>;
1233
- timings?: _grafana_data.DataQueryTimings;
1234
- errors?: _grafana_data.DataQueryError[];
1235
- error?: _grafana_data.DataQueryError;
1229
+ structureRev?: number | undefined;
1230
+ annotations?: _grafana_data.DataFrame[] | undefined;
1231
+ alertState?: _grafana_data.AlertStateInfo | undefined;
1232
+ request?: _grafana_data.DataQueryRequest<_grafana_data.DataQuery> | undefined;
1233
+ timings?: _grafana_data.DataQueryTimings | undefined;
1234
+ errors?: _grafana_data.DataQueryError[] | undefined;
1235
+ error?: _grafana_data.DataQueryError | undefined;
1236
1236
  timeRange: _grafana_data.TimeRange;
1237
- traceIds?: string[];
1237
+ traceIds?: string[] | undefined;
1238
1238
  };
1239
1239
  }
1240
- declare function AnnotationsDataLayerRenderer({ model }: SceneComponentProps<AnnotationsDataLayer>): React__default.JSX.Element;
1240
+ declare function AnnotationsDataLayerRenderer({ model }: SceneComponentProps<AnnotationsDataLayer>): React__default.JSX.Element | null;
1241
1241
 
1242
1242
  type index_AnnotationsDataLayer = AnnotationsDataLayer;
1243
1243
  declare const index_AnnotationsDataLayer: typeof AnnotationsDataLayer;
@@ -1344,7 +1344,7 @@ declare class SceneDataLayerControls extends SceneObjectBase<SceneDataLayerContr
1344
1344
  static Component: typeof SceneDataLayerControlsRenderer;
1345
1345
  constructor();
1346
1346
  }
1347
- declare function SceneDataLayerControlsRenderer({ model }: SceneComponentProps<SceneDataLayerControls>): React__default.JSX.Element;
1347
+ declare function SceneDataLayerControlsRenderer({ model }: SceneComponentProps<SceneDataLayerControls>): React__default.JSX.Element | null;
1348
1348
 
1349
1349
  interface SceneDataTransformerState extends SceneDataState {
1350
1350
  /**
@@ -1402,7 +1402,7 @@ interface VariableValueControlState extends SceneObjectState {
1402
1402
  declare class VariableValueControl extends SceneObjectBase<VariableValueControlState> {
1403
1403
  static Component: typeof VariableValueControlRenderer;
1404
1404
  }
1405
- declare function VariableValueControlRenderer({ model }: SceneComponentProps<VariableValueControl>): React__default.JSX.Element;
1405
+ declare function VariableValueControlRenderer({ model }: SceneComponentProps<VariableValueControl>): React__default.JSX.Element | null;
1406
1406
 
1407
1407
  declare class SceneVariableSet extends SceneObjectBase<SceneVariableSetState> implements SceneVariables {
1408
1408
  /** Variables that have changed in since the activation or since the first manual value change */
@@ -1738,7 +1738,7 @@ declare class SceneTimePicker extends SceneObjectBase<SceneTimePickerState> {
1738
1738
  onMoveBackward: () => void;
1739
1739
  onMoveForward: () => void;
1740
1740
  }
1741
- declare function SceneTimePickerRenderer({ model }: SceneComponentProps<SceneTimePicker>): React__default.JSX.Element;
1741
+ declare function SceneTimePickerRenderer({ model }: SceneComponentProps<SceneTimePicker>): React__default.JSX.Element | null;
1742
1742
 
1743
1743
  interface SceneRefreshPickerState extends SceneObjectState {
1744
1744
  refresh: string;
@@ -1835,7 +1835,7 @@ declare class SceneFlexLayout extends SceneObjectBase<SceneFlexLayoutState> impl
1835
1835
  toggleDirection(): void;
1836
1836
  isDraggable(): boolean;
1837
1837
  }
1838
- declare function SceneFlexLayoutRenderer({ model, parentState }: SceneFlexItemRenderProps$1<SceneFlexLayout>): React__default.JSX.Element;
1838
+ declare function SceneFlexLayoutRenderer({ model, parentState }: SceneFlexItemRenderProps$1<SceneFlexLayout>): React__default.JSX.Element | null;
1839
1839
  interface SceneFlexItemPlacement {
1840
1840
  wrap?: CSSProperties['flexWrap'];
1841
1841
  direction?: CSSProperties['flexDirection'];
@@ -1867,7 +1867,7 @@ interface SceneFlexItemRenderProps$1<T> extends SceneComponentProps<T> {
1867
1867
  declare class SceneFlexItem extends SceneObjectBase<SceneFlexItemState> {
1868
1868
  static Component: typeof SceneFlexItemRenderer;
1869
1869
  }
1870
- declare function SceneFlexItemRenderer({ model, parentState }: SceneFlexItemRenderProps$1<SceneFlexItem>): React__default.JSX.Element;
1870
+ declare function SceneFlexItemRenderer({ model, parentState }: SceneFlexItemRenderProps$1<SceneFlexItem>): React__default.JSX.Element | null;
1871
1871
 
1872
1872
  interface SceneCSSGridLayoutState extends SceneObjectState, SceneCSSGridLayoutOptions {
1873
1873
  children: Array<SceneCSSGridItem | SceneObject>;
@@ -1911,7 +1911,7 @@ declare class SceneCSSGridLayout extends SceneObjectBase<SceneCSSGridLayoutState
1911
1911
  constructor(state: Partial<SceneCSSGridLayoutState>);
1912
1912
  isDraggable(): boolean;
1913
1913
  }
1914
- declare function SceneCSSGridLayoutRenderer({ model }: SceneCSSGridItemRenderProps<SceneCSSGridLayout>): React__default.JSX.Element;
1914
+ declare function SceneCSSGridLayoutRenderer({ model }: SceneCSSGridItemRenderProps<SceneCSSGridLayout>): React__default.JSX.Element | null;
1915
1915
  interface SceneCSSGridItemPlacement {
1916
1916
  /**
1917
1917
  * True when the item should rendered but not visible.
@@ -1933,7 +1933,7 @@ interface SceneCSSGridItemRenderProps<T> extends SceneComponentProps<T> {
1933
1933
  declare class SceneCSSGridItem extends SceneObjectBase<SceneCSSGridItemState> {
1934
1934
  static Component: typeof SceneCSSGridItemRenderer;
1935
1935
  }
1936
- declare function SceneCSSGridItemRenderer({ model, parentState }: SceneCSSGridItemRenderProps<SceneCSSGridItem>): React__default.JSX.Element;
1936
+ declare function SceneCSSGridItemRenderer({ model, parentState }: SceneCSSGridItemRenderProps<SceneCSSGridItem>): React__default.JSX.Element | null;
1937
1937
 
1938
1938
  declare function SceneGridLayoutRenderer({ model }: SceneComponentProps<SceneGridLayout>): React__default.JSX.Element;
1939
1939
 
@@ -2030,9 +2030,9 @@ interface SceneGridItemState extends SceneGridItemStateLike {
2030
2030
  declare class SceneGridItem extends SceneObjectBase<SceneGridItemState> implements SceneGridItemLike {
2031
2031
  static Component: typeof SceneGridItemRenderer;
2032
2032
  }
2033
- declare function SceneGridItemRenderer({ model }: SceneComponentProps<SceneGridItem>): React__default.JSX.Element;
2033
+ declare function SceneGridItemRenderer({ model }: SceneComponentProps<SceneGridItem>): React__default.JSX.Element | null;
2034
2034
 
2035
- declare function SplitLayoutRenderer({ model }: SceneFlexItemRenderProps<SplitLayout>): React__default.JSX.Element;
2035
+ declare function SplitLayoutRenderer({ model }: SceneFlexItemRenderProps<SplitLayout>): React__default.JSX.Element | null;
2036
2036
  interface SceneFlexItemRenderProps<T> extends SceneComponentProps<T> {
2037
2037
  parentState?: SceneFlexItemPlacement;
2038
2038
  }
@@ -2150,7 +2150,7 @@ declare class SceneAppPage extends SceneObjectBase<SceneAppPageState> implements
2150
2150
  initializeScene(scene: EmbeddedScene): void;
2151
2151
  getScene(routeMatch: SceneRouteMatch): EmbeddedScene;
2152
2152
  getDrilldownPage(drilldown: SceneAppDrilldownView, routeMatch: SceneRouteMatch<{}>): SceneAppPageLike;
2153
- enrichDataRequest(source: SceneObject): Partial<_grafana_data.DataQueryRequest<_grafana_data.DataQuery>>;
2153
+ enrichDataRequest(source: SceneObject): Partial<_grafana_data.DataQueryRequest<_grafana_data.DataQuery>> | null;
2154
2154
  }
2155
2155
  interface SceneAppPageRendererProps extends SceneComponentProps<SceneAppPage> {
2156
2156
  routeProps: RouteComponentProps;
@@ -2175,7 +2175,7 @@ interface SceneReactObjectState<TProps = {}> extends SceneObjectState {
2175
2175
  * A utility object that can be used to render any React component or ReactNode
2176
2176
  */
2177
2177
  declare class SceneReactObject<TProps = {}> extends SceneObjectBase<SceneReactObjectState<TProps>> {
2178
- static Component: ({ model }: SceneComponentProps<SceneReactObject>) => string | number | true | Iterable<React__default.ReactNode> | React__default.JSX.Element;
2178
+ static Component: ({ model }: SceneComponentProps<SceneReactObject>) => string | number | true | Iterable<React__default.ReactNode> | React__default.JSX.Element | null;
2179
2179
  }
2180
2180
 
2181
2181
  type StandardFieldConfigInterface<T, C, Prefix extends string> = {
@@ -2328,7 +2328,7 @@ declare class VizPanelBuilder<TOptions extends {}, TFieldConfig extends {}> impl
2328
2328
  declare class PanelOptionsBuilder<TOptions extends {} = {}> {
2329
2329
  private defaultOptions?;
2330
2330
  private _options;
2331
- constructor(defaultOptions?: () => Partial<TOptions>);
2331
+ constructor(defaultOptions?: (() => Partial<TOptions>) | undefined);
2332
2332
  private setDefaults;
2333
2333
  /**
2334
2334
  * Set an individual panel option. This will merge the value with the existing options.
@@ -2365,7 +2365,7 @@ declare class FieldConfigBuilder<TFieldConfig extends {}> implements StandardFie
2365
2365
  private defaultFieldConfig?;
2366
2366
  private _fieldConfig;
2367
2367
  private _overridesBuilder;
2368
- constructor(defaultFieldConfig?: () => TFieldConfig);
2368
+ constructor(defaultFieldConfig?: (() => TFieldConfig) | undefined);
2369
2369
  private setDefaults;
2370
2370
  /**
2371
2371
  * Set color.
package/dist/index.js CHANGED
@@ -8025,6 +8025,10 @@ var __objRest = (source, exclude) => {
8025
8025
  };
8026
8026
  function SceneGridLayoutRenderer({ model }) {
8027
8027
  const { children, isLazy, isDraggable, isResizable } = model.useState();
8028
+ const ref = React.useRef(null);
8029
+ React.useEffect(() => {
8030
+ updateAnimationClass(ref, !!isDraggable);
8031
+ }, [isDraggable]);
8028
8032
  validateChildrenSize(children);
8029
8033
  return /* @__PURE__ */ React__default["default"].createElement(AutoSizer__default["default"], null, ({ width, height }) => {
8030
8034
  if (width === 0) {
@@ -8032,8 +8036,9 @@ function SceneGridLayoutRenderer({ model }) {
8032
8036
  }
8033
8037
  const layout = model.buildGridLayout(width, height);
8034
8038
  return /* @__PURE__ */ React__default["default"].createElement("div", {
8039
+ ref,
8035
8040
  style: { width: `${width}px`, height: "100%", position: "relative", zIndex: 1 },
8036
- className: css.cx("react-grid-layout", isDraggable && "react-grid-layout--enable-move-animations")
8041
+ className: "react-grid-layout"
8037
8042
  }, /* @__PURE__ */ React__default["default"].createElement(ReactGridLayout__default["default"], {
8038
8043
  width,
8039
8044
  isDraggable: isDraggable && width > 768,
@@ -8096,6 +8101,17 @@ function validateChildrenSize(children) {
8096
8101
  throw new Error("All children must have a size specified");
8097
8102
  }
8098
8103
  }
8104
+ function updateAnimationClass(ref, isDraggable, retry) {
8105
+ if (ref.current) {
8106
+ if (isDraggable) {
8107
+ ref.current.classList.add("react-grid-layout--enable-move-animations");
8108
+ } else {
8109
+ ref.current.classList.remove("react-grid-layout--enable-move-animations");
8110
+ }
8111
+ } else if (!retry) {
8112
+ setTimeout(() => updateAnimationClass(ref, isDraggable, true), 50);
8113
+ }
8114
+ }
8099
8115
  const ResizeHandle = React__default["default"].forwardRef((_a, ref) => {
8100
8116
  var _b = _a, divProps = __objRest(_b, ["handleAxis"]);
8101
8117
  const customCssClass = ui.useStyles2(getResizeHandleStyles);