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

package/CHANGELOG.md

@@ -1,3 +1,36 @@
+# v4.21.0 (Tue May 14 2024)
+
+#### 🚀 Enhancement
+
+- SceneVariableSet: Do not propagate variable value changes when a local variable has the same name [#729](https://github.com/grafana/scenes/pull/729) ([@torkelo](https://github.com/torkelo))
+
+#### 🐛 Bug Fix
+
+- NestedScene: Don't show `cursor: pointer;` for everything [#735](https://github.com/grafana/scenes/pull/735) ([@ashharrison90](https://github.com/ashharrison90))
+
+#### Authors: 2
+
+- Ashley Harrison ([@ashharrison90](https://github.com/ashharrison90))
+- Torkel Ödegaard ([@torkelo](https://github.com/torkelo))
+
+---
+
+# v4.20.0 (Mon May 13 2024)
+
+#### 🚀 Enhancement
+
+- GroupByVariable: Sync label to URL [#705](https://github.com/grafana/scenes/pull/705) ([@bfmatei](https://github.com/bfmatei))
+- Typescript: Enable strict mode [#728](https://github.com/grafana/scenes/pull/728) ([@torkelo](https://github.com/torkelo))
+- 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))
+
+#### Authors: 3
+
+- Bogdan Matei ([@bfmatei](https://github.com/bfmatei))
+- Ivan Ortega Alba ([@ivanortegaalba](https://github.com/ivanortegaalba))
+- Torkel Ödegaard ([@torkelo](https://github.com/torkelo))
+
+---
+
 # v4.19.0 (Fri May 10 2024)
 
 #### 🚀 Enhancement

package/dist/esm/components/NestedScene.js

@@ -67,8 +67,7 @@ const getStyles = (theme) => ({
     display: "flex",
     flexDirection: "column",
     flexGrow: 1,
-    gap: theme.spacing(1),
-    cursor: "pointer"
+    gap: theme.spacing(1)
   }),
   row: css({
     width: "100%",

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

@@ -1 +1 @@
-{"version":3,"file":"NestedScene.js","sources":["../../../src/components/NestedScene.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport React from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { Icon, ToolbarButton, useStyles2 } from '@grafana/ui';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { SceneObject, SceneComponentProps, SceneLayout, SceneObjectState } from '../core/types';\nimport { getSceneGridRowStyles } from './layout/grid/SceneGridRow';\nimport { sceneGraph } from '../core/sceneGraph';\n\ninterface NestedSceneState extends SceneObjectState {\n  title: string;\n  isCollapsed?: boolean;\n  canCollapse?: boolean;\n  canRemove?: boolean;\n  body: SceneLayout;\n  controls?: SceneObject[];\n}\n\n/**\n * @internal\n * POC status, don't use this yet\n */\nexport class NestedScene extends SceneObjectBase<NestedSceneState> {\n  public static Component = NestedSceneRenderer;\n\n  public onToggle = () => {\n    this.setState({\n      isCollapsed: !this.state.isCollapsed,\n    });\n  };\n\n  /** Removes itself from its parent's children array */\n  public onRemove = () => {\n    const parent = this.parent!;\n\n    if (isSceneLayoutItem(parent)) {\n      parent.setState({\n        body: undefined,\n      });\n    }\n  };\n}\n\nexport function NestedSceneRenderer({ model }: SceneComponentProps<NestedScene>) {\n  const { title, isCollapsed, canCollapse, canRemove, body, controls } = model.useState();\n  const gridRow = useStyles2(getSceneGridRowStyles);\n  const styles = useStyles2(getStyles);\n\n  const toolbarControls = (controls ?? []).map((action) => <action.Component key={action.state.key} model={action} />);\n\n  if (canRemove) {\n    toolbarControls.push(\n      <ToolbarButton\n        icon=\"times\"\n        variant={'default'}\n        onClick={model.onRemove}\n        key=\"remove-button\"\n        aria-label=\"Remove scene\"\n      />\n    );\n  }\n\n  return (\n    <div className={styles.wrapper}>\n      <div className={cx(styles.row, isCollapsed && styles.rowCollapsed)}>\n        <button\n          onClick={model.onToggle}\n          className={gridRow.rowTitleButton}\n          aria-label={isCollapsed ? 'Expand scene' : 'Collapse scene'}\n        >\n          {canCollapse && <Icon name={isCollapsed ? 'angle-right' : 'angle-down'} />}\n          <span className={gridRow.rowTitle} role=\"heading\">\n            {sceneGraph.interpolate(model, title, undefined, 'text')}\n          </span>\n        </button>\n        <div className={styles.actions}>{toolbarControls}</div>\n      </div>\n      {!isCollapsed && <body.Component model={body} />}\n    </div>\n  );\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  wrapper: css({\n    display: 'flex',\n    flexDirection: 'column',\n    flexGrow: 1,\n    gap: theme.spacing(1),\n    cursor: 'pointer',\n  }),\n  row: css({\n    width: '100%',\n    display: 'flex',\n    justifyContent: 'space-between',\n    gap: theme.spacing(1),\n  }),\n  rowCollapsed: css({\n    borderBottom: `1px solid ${theme.colors.border.weak}`,\n    paddingBottom: theme.spacing(1),\n  }),\n  actions: css({\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(1),\n    justifyContent: 'flex-end',\n    flexGrow: 1,\n  }),\n});\n\nfunction isSceneLayoutItem(x: SceneObject): x is SceneObject<SceneObjectState & { body: SceneObject | undefined }> {\n  return 'body' in x.state;\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"NestedScene.js","sources":["../../../src/components/NestedScene.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport React from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { Icon, ToolbarButton, useStyles2 } from '@grafana/ui';\n\nimport { SceneObjectBase } from '../core/SceneObjectBase';\nimport { SceneObject, SceneComponentProps, SceneLayout, SceneObjectState } from '../core/types';\nimport { getSceneGridRowStyles } from './layout/grid/SceneGridRow';\nimport { sceneGraph } from '../core/sceneGraph';\n\ninterface NestedSceneState extends SceneObjectState {\n  title: string;\n  isCollapsed?: boolean;\n  canCollapse?: boolean;\n  canRemove?: boolean;\n  body: SceneLayout;\n  controls?: SceneObject[];\n}\n\n/**\n * @internal\n * POC status, don't use this yet\n */\nexport class NestedScene extends SceneObjectBase<NestedSceneState> {\n  public static Component = NestedSceneRenderer;\n\n  public onToggle = () => {\n    this.setState({\n      isCollapsed: !this.state.isCollapsed,\n    });\n  };\n\n  /** Removes itself from its parent's children array */\n  public onRemove = () => {\n    const parent = this.parent!;\n\n    if (isSceneLayoutItem(parent)) {\n      parent.setState({\n        body: undefined,\n      });\n    }\n  };\n}\n\nexport function NestedSceneRenderer({ model }: SceneComponentProps<NestedScene>) {\n  const { title, isCollapsed, canCollapse, canRemove, body, controls } = model.useState();\n  const gridRow = useStyles2(getSceneGridRowStyles);\n  const styles = useStyles2(getStyles);\n\n  const toolbarControls = (controls ?? []).map((action) => <action.Component key={action.state.key} model={action} />);\n\n  if (canRemove) {\n    toolbarControls.push(\n      <ToolbarButton\n        icon=\"times\"\n        variant={'default'}\n        onClick={model.onRemove}\n        key=\"remove-button\"\n        aria-label=\"Remove scene\"\n      />\n    );\n  }\n\n  return (\n    <div className={styles.wrapper}>\n      <div className={cx(styles.row, isCollapsed && styles.rowCollapsed)}>\n        <button\n          onClick={model.onToggle}\n          className={gridRow.rowTitleButton}\n          aria-label={isCollapsed ? 'Expand scene' : 'Collapse scene'}\n        >\n          {canCollapse && <Icon name={isCollapsed ? 'angle-right' : 'angle-down'} />}\n          <span className={gridRow.rowTitle} role=\"heading\">\n            {sceneGraph.interpolate(model, title, undefined, 'text')}\n          </span>\n        </button>\n        <div className={styles.actions}>{toolbarControls}</div>\n      </div>\n      {!isCollapsed && <body.Component model={body} />}\n    </div>\n  );\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  wrapper: css({\n    display: 'flex',\n    flexDirection: 'column',\n    flexGrow: 1,\n    gap: theme.spacing(1),\n  }),\n  row: css({\n    width: '100%',\n    display: 'flex',\n    justifyContent: 'space-between',\n    gap: theme.spacing(1),\n  }),\n  rowCollapsed: css({\n    borderBottom: `1px solid ${theme.colors.border.weak}`,\n    paddingBottom: theme.spacing(1),\n  }),\n  actions: css({\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(1),\n    justifyContent: 'flex-end',\n    flexGrow: 1,\n  }),\n});\n\nfunction isSceneLayoutItem(x: SceneObject): x is SceneObject<SceneObjectState & { body: SceneObject | undefined }> {\n  return 'body' in x.state;\n}\n"],"names":[],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useRef, useEffect } from 'react';
 import ReactGridLayout from 'react-grid-layout';
 import AutoSizer from 'react-virtualized-auto-sizer';
 import { GRID_CELL_VMARGIN, GRID_COLUMN_COUNT, GRID_CELL_HEIGHT } from './constants.js';
@@ -39,6 +39,10 @@ var __objRest = (source, exclude) => {
 };
 function SceneGridLayoutRenderer({ model }) {
   const { children, isLazy, isDraggable, isResizable } = model.useState();
+  const ref = useRef(null);
+  useEffect(() => {
+    updateAnimationClass(ref, !!isDraggable);
+  }, [isDraggable]);
   validateChildrenSize(children);
   return /* @__PURE__ */ React.createElement(AutoSizer, null, ({ width, height }) => {
     if (width === 0) {
@@ -46,8 +50,9 @@ function SceneGridLayoutRenderer({ model }) {
     }
     const layout = model.buildGridLayout(width, height);
     return /* @__PURE__ */ React.createElement("div", {
+      ref,
       style: { width: `${width}px`, height: "100%", position: "relative", zIndex: 1 },
-      className: cx("react-grid-layout", isDraggable && "react-grid-layout--enable-move-animations")
+      className: "react-grid-layout"
     }, /* @__PURE__ */ React.createElement(ReactGridLayout, {
       width,
       isDraggable: isDraggable && width > 768,
@@ -110,6 +115,17 @@ function validateChildrenSize(children) {
     throw new Error("All children must have a size specified");
   }
 }
+function updateAnimationClass(ref, isDraggable, retry) {
+  if (ref.current) {
+    if (isDraggable) {
+      ref.current.classList.add("react-grid-layout--enable-move-animations");
+    } else {
+      ref.current.classList.remove("react-grid-layout--enable-move-animations");
+    }
+  } else if (!retry) {
+    setTimeout(() => updateAnimationClass(ref, isDraggable, true), 50);
+  }
+}
 const ResizeHandle = React.forwardRef((_a, ref) => {
   var _b = _a, divProps = __objRest(_b, ["handleAxis"]);
   const customCssClass = useStyles2(getResizeHandleStyles);

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

@@ -1 +1 @@
-{"version":3,"file":"SceneGridLayoutRenderer.js","sources":["../../../../../src/components/layout/grid/SceneGridLayoutRenderer.tsx"],"sourcesContent":["import React from 'react';\nimport ReactGridLayout from 'react-grid-layout';\nimport AutoSizer from 'react-virtualized-auto-sizer';\nimport { SceneComponentProps } from '../../../core/types';\nimport { GRID_CELL_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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"}
+{"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":"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"}

package/dist/esm/variables/sets/SceneVariableSet.js

@@ -204,6 +204,12 @@ class SceneVariableSet extends SceneObjectBase {
     if (!sceneObject.isActive) {
       return;
     }
+    if (sceneObject.state.$variables && sceneObject.state.$variables !== this) {
+      const localVar = sceneObject.state.$variables.getByName(variable.state.name);
+      if (localVar) {
+        return;
+      }
+    }
     if (sceneObject.variableDependency) {
       sceneObject.variableDependency.variableUpdateCompleted(variable, hasChanged);
     }

package/dist/esm/variables/sets/SceneVariableSet.js.map

@@ -1 +1 @@
-{"version":3,"file":"SceneVariableSet.js","sources":["../../../../src/variables/sets/SceneVariableSet.ts"],"sourcesContent":["import { VariableRefresh } from '@grafana/data';\nimport { Unsubscribable } from 'rxjs';\nimport { sceneGraph } from '../../core/sceneGraph';\n\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { SceneObject } from '../../core/types';\nimport { writeSceneLog } from '../../utils/writeSceneLog';\nimport {\n  SceneVariable,\n  SceneVariableDependencyConfigLike,\n  SceneVariables,\n  SceneVariableSetState,\n  SceneVariableValueChangedEvent,\n} from '../types';\nimport { VariableValueRecorder } from '../VariableValueRecorder';\n\nexport class SceneVariableSet extends SceneObjectBase<SceneVariableSetState> implements SceneVariables {\n  /** Variables that have changed in since the activation or since the first manual value change */\n  private _variablesThatHaveChanged = new Set<SceneVariable>();\n\n  /** Variables that are scheduled to be validated and updated */\n  private _variablesToUpdate = new Set<SceneVariable>();\n\n  /** Variables currently updating  */\n  private _updating = new Map<SceneVariable, VariableUpdateInProgress>();\n\n  private _variableValueRecorder = new VariableValueRecorder();\n\n  /**\n   * This makes sure SceneVariableSet's higher up in the chain notify us when parent level variables complete update batches.\n   **/\n  protected _variableDependency = new SceneVariableSetVariableDependencyHandler(\n    this._handleParentVariableUpdatesCompleted.bind(this)\n  );\n\n  public getByName(name: string): SceneVariable | undefined {\n    // TODO: Replace with index\n    return this.state.variables.find((x) => x.state.name === name);\n  }\n\n  public constructor(state: SceneVariableSetState) {\n    super(state);\n\n    this.addActivationHandler(this._onActivate);\n  }\n\n  /**\n   * Subscribes to child variable value changes, and starts the variable value validation process\n   */\n  private _onActivate = () => {\n    const timeRange = sceneGraph.getTimeRange(this);\n    // Subscribe to changes to child variables\n    this._subs.add(\n      this.subscribeToEvent(SceneVariableValueChangedEvent, (event) => this._handleVariableValueChanged(event.payload))\n    );\n\n    this._subs.add(\n      timeRange.subscribeToState(() => {\n        this._refreshTimeRangeBasedVariables();\n      })\n    );\n\n    // Subscribe to state changes\n    this._subs.add(this.subscribeToState(this._onStateChanged));\n\n    this._checkForVariablesThatChangedWhileInactive();\n\n    // Add all variables that need updating to queue\n    for (const variable of this.state.variables) {\n      if (this._variableNeedsUpdate(variable)) {\n        this._variablesToUpdate.add(variable);\n      }\n    }\n\n    this._updateNextBatch();\n\n    // Return deactivation handler;\n    return this._onDeactivate;\n  };\n\n  /**\n   * Add all variables that depend on the changed variable to the update queue\n   */\n  private _refreshTimeRangeBasedVariables() {\n    for (const variable of this.state.variables) {\n      if ('refresh' in variable.state && variable.state.refresh === VariableRefresh.onTimeRangeChanged) {\n        this._variablesToUpdate.add(variable);\n      }\n    }\n\n    this._updateNextBatch();\n  }\n\n  /**\n   * Cancel all currently running updates\n   */\n  private _onDeactivate = () => {\n    for (const update of this._updating.values()) {\n      update.subscription?.unsubscribe();\n    }\n\n    // Remember current variable values\n    for (const variable of this.state.variables) {\n      // if the current variable is not in queue to update and validate and not being actively updated then the value is ok\n      if (!this._variablesToUpdate.has(variable) && !this._updating.has(variable)) {\n        this._variableValueRecorder.recordCurrentValue(variable);\n      }\n    }\n\n    this._variablesToUpdate.clear();\n    this._updating.clear();\n  };\n\n  /**\n   * Look for new variables that need to be initialized\n   */\n  private _onStateChanged = (newState: SceneVariableSetState, oldState: SceneVariableSetState) => {\n    const variablesToUpdateCountStart = this._variablesToUpdate.size;\n\n    // Check for removed variables\n    for (const variable of oldState.variables) {\n      if (!newState.variables.includes(variable)) {\n        const updating = this._updating.get(variable);\n        if (updating?.subscription) {\n          updating.subscription.unsubscribe();\n        }\n        this._updating.delete(variable);\n        this._variablesToUpdate.delete(variable);\n      }\n    }\n\n    // Check for new variables\n    for (const variable of newState.variables) {\n      if (!oldState.variables.includes(variable)) {\n        if (this._variableNeedsUpdate(variable)) {\n          this._variablesToUpdate.add(variable);\n        }\n      }\n    }\n\n    // Only start a new batch if there was no batch already running\n    if (variablesToUpdateCountStart === 0 && this._variablesToUpdate.size > 0) {\n      this._updateNextBatch();\n    }\n  };\n\n  /**\n   * If variables changed while in in-active state we don't get any change events, so we need to check for that here.\n   */\n  private _checkForVariablesThatChangedWhileInactive() {\n    if (!this._variableValueRecorder.hasValues()) {\n      return;\n    }\n\n    for (const variable of this.state.variables) {\n      if (this._variableValueRecorder.hasValueChanged(variable)) {\n        writeVariableTraceLog(variable, 'Changed while in-active');\n        this._addDependentVariablesToUpdateQueue(variable);\n      }\n    }\n  }\n\n  private _variableNeedsUpdate(variable: SceneVariable): boolean {\n    if (variable.isLazy) {\n      return false;\n    }\n\n    if (!variable.validateAndUpdate) {\n      return false;\n    }\n\n    // If we have recorded valid value (even if it has changed since we do not need to re-validate this variable)\n    if (this._variableValueRecorder.hasRecordedValue(variable)) {\n      writeVariableTraceLog(variable, 'Skipping updateAndValidate current value valid');\n      return false;\n    }\n\n    return true;\n  }\n\n  /**\n   * This loops through variablesToUpdate and update all that can.\n   * If one has a dependency that is currently in variablesToUpdate it will be skipped for now.\n   */\n  private _updateNextBatch() {\n    for (const variable of this._variablesToUpdate) {\n      if (!variable.validateAndUpdate) {\n        throw new Error('Variable added to variablesToUpdate but does not have validateAndUpdate');\n      }\n\n      // Ignore it if it's already started\n      if (this._updating.has(variable)) {\n        continue;\n      }\n\n      // Wait for variables that has dependencies that also needs updates\n      if (sceneGraph.hasVariableDependencyInLoadingState(variable)) {\n        continue;\n      }\n\n      const variableToUpdate: VariableUpdateInProgress = {\n        variable,\n      };\n\n      this._updating.set(variable, variableToUpdate);\n      writeVariableTraceLog(variable, 'updateAndValidate started');\n\n      variableToUpdate.subscription = variable.validateAndUpdate().subscribe({\n        next: () => this._validateAndUpdateCompleted(variable),\n        complete: () => this._validateAndUpdateCompleted(variable),\n        error: (err) => this._handleVariableError(variable, err),\n      });\n    }\n  }\n\n  /**\n   * A variable has completed its update process. This could mean that variables that depend on it can now be updated in turn.\n   */\n  private _validateAndUpdateCompleted(variable: SceneVariable) {\n    if (!this._updating.has(variable)) {\n      return;\n    }\n\n    const update = this._updating.get(variable);\n    update?.subscription?.unsubscribe();\n\n    this._updating.delete(variable);\n    this._variablesToUpdate.delete(variable);\n\n    writeVariableTraceLog(variable, 'updateAndValidate completed');\n\n    this._notifyDependentSceneObjects(variable);\n    this._updateNextBatch();\n  }\n\n  public cancel(variable: SceneVariable) {\n    const update = this._updating.get(variable);\n    update?.subscription?.unsubscribe();\n\n    this._updating.delete(variable);\n    this._variablesToUpdate.delete(variable);\n  }\n\n  private _handleVariableError(variable: SceneVariable, err: Error) {\n    const update = this._updating.get(variable);\n    update?.subscription?.unsubscribe();\n\n    this._updating.delete(variable);\n    this._variablesToUpdate.delete(variable);\n\n    variable.setState({ loading: false, error: err.message });\n\n    console.error('SceneVariableSet updateAndValidate error', err);\n\n    writeVariableTraceLog(variable, 'updateAndValidate error', err);\n  }\n\n  private _handleVariableValueChanged(variableThatChanged: SceneVariable) {\n    this._variablesThatHaveChanged.add(variableThatChanged);\n    this._addDependentVariablesToUpdateQueue(variableThatChanged);\n\n    // Ignore this change if it is currently updating\n    if (!this._updating.has(variableThatChanged)) {\n      this._updateNextBatch();\n      this._notifyDependentSceneObjects(variableThatChanged);\n    }\n  }\n\n  /**\n   * This is called by any parent level variable set to notify scene that an update batch is completed.\n   * This is the main mechanism lower level variable set's react to changes on higher levels.\n   */\n  private _handleParentVariableUpdatesCompleted(variable: SceneVariable, hasChanged: boolean) {\n    // First loop through changed variables and add any of our variables that depend on the higher level variable to the update queue\n    if (hasChanged) {\n      this._addDependentVariablesToUpdateQueue(variable);\n    }\n\n    // If we have variables to update but none are currently updating kick of a new update batch\n    if (this._variablesToUpdate.size > 0 && this._updating.size === 0) {\n      this._updateNextBatch();\n    }\n  }\n\n  private _addDependentVariablesToUpdateQueue(variableThatChanged: SceneVariable) {\n    for (const otherVariable of this.state.variables) {\n      if (otherVariable.variableDependency) {\n        if (otherVariable.variableDependency.hasDependencyOn(variableThatChanged.state.name)) {\n          writeVariableTraceLog(otherVariable, 'Added to update queue, dependant variable value changed');\n\n          if (this._updating.has(otherVariable) && otherVariable.onCancel) {\n            otherVariable.onCancel();\n          }\n\n          this._variablesToUpdate.add(otherVariable);\n        }\n      }\n    }\n  }\n\n  /**\n   * Walk scene object graph and update all objects that depend on variables that have changed\n   */\n  private _notifyDependentSceneObjects(variable: SceneVariable) {\n    if (!this.parent) {\n      return;\n    }\n\n    this._traverseSceneAndNotify(this.parent, variable, this._variablesThatHaveChanged.has(variable));\n    this._variablesThatHaveChanged.delete(variable);\n  }\n\n  /**\n   * Recursivly walk the full scene object graph and notify all objects with dependencies that include any of changed variables\n   */\n  private _traverseSceneAndNotify(sceneObject: SceneObject, variable: SceneVariable, hasChanged: boolean) {\n    // No need to notify variables under this SceneVariableSet\n    if (this === sceneObject) {\n      return;\n    }\n\n    // Skip non active scene objects\n    if (!sceneObject.isActive) {\n      return;\n    }\n\n    if (sceneObject.variableDependency) {\n      sceneObject.variableDependency.variableUpdateCompleted(variable, hasChanged);\n    }\n\n    sceneObject.forEachChild((child) => this._traverseSceneAndNotify(child, variable, hasChanged));\n  }\n\n  /**\n   * Return true if variable is waiting to update or currently updating.\n   * It also returns true if a dependency of the variable is loading.\n   *\n   * For example if C depends on variable B which depends on variable A and A is loading this returns true for variable C and B.\n   */\n  public isVariableLoadingOrWaitingToUpdate(variable: SceneVariable) {\n    if (variable.isAncestorLoading && variable.isAncestorLoading()) {\n      return true;\n    }\n\n    if (this._variablesToUpdate.has(variable) || this._updating.has(variable)) {\n      return true;\n    }\n\n    // Last scenario is to check the variable's own dependencies as well\n    return sceneGraph.hasVariableDependencyInLoadingState(variable);\n  }\n}\n\nexport interface VariableUpdateInProgress {\n  variable: SceneVariable;\n  subscription?: Unsubscribable;\n}\n\nfunction writeVariableTraceLog(variable: SceneVariable, message: string, err?: Error) {\n  if (err) {\n    writeSceneLog('SceneVariableSet', `Variable[${variable.state.name}]: ${message}`, err);\n  } else {\n    writeSceneLog('SceneVariableSet', `Variable[${variable.state.name}]: ${message}`);\n  }\n}\n\nclass SceneVariableSetVariableDependencyHandler implements SceneVariableDependencyConfigLike {\n  public constructor(private _variableUpdatesCompleted: (variable: SceneVariable, hasChanged: boolean) => void) {}\n\n  private _emptySet = new Set<string>();\n\n  public getNames(): Set<string> {\n    return this._emptySet;\n  }\n\n  public hasDependencyOn(name: string): boolean {\n    return false;\n  }\n\n  public variableUpdateCompleted(variable: SceneVariable, hasChanged: boolean): void {\n    this._variableUpdatesCompleted(variable, hasChanged);\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SceneVariableSet.js","sources":["../../../../src/variables/sets/SceneVariableSet.ts"],"sourcesContent":["import { VariableRefresh } from '@grafana/data';\nimport { Unsubscribable } from 'rxjs';\nimport { sceneGraph } from '../../core/sceneGraph';\n\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { SceneObject } from '../../core/types';\nimport { writeSceneLog } from '../../utils/writeSceneLog';\nimport {\n  SceneVariable,\n  SceneVariableDependencyConfigLike,\n  SceneVariables,\n  SceneVariableSetState,\n  SceneVariableValueChangedEvent,\n} from '../types';\nimport { VariableValueRecorder } from '../VariableValueRecorder';\n\nexport class SceneVariableSet extends SceneObjectBase<SceneVariableSetState> implements SceneVariables {\n  /** Variables that have changed in since the activation or since the first manual value change */\n  private _variablesThatHaveChanged = new Set<SceneVariable>();\n\n  /** Variables that are scheduled to be validated and updated */\n  private _variablesToUpdate = new Set<SceneVariable>();\n\n  /** Variables currently updating  */\n  private _updating = new Map<SceneVariable, VariableUpdateInProgress>();\n\n  private _variableValueRecorder = new VariableValueRecorder();\n\n  /**\n   * This makes sure SceneVariableSet's higher up in the chain notify us when parent level variables complete update batches.\n   **/\n  protected _variableDependency = new SceneVariableSetVariableDependencyHandler(\n    this._handleParentVariableUpdatesCompleted.bind(this)\n  );\n\n  public getByName(name: string): SceneVariable | undefined {\n    // TODO: Replace with index\n    return this.state.variables.find((x) => x.state.name === name);\n  }\n\n  public constructor(state: SceneVariableSetState) {\n    super(state);\n\n    this.addActivationHandler(this._onActivate);\n  }\n\n  /**\n   * Subscribes to child variable value changes, and starts the variable value validation process\n   */\n  private _onActivate = () => {\n    const timeRange = sceneGraph.getTimeRange(this);\n    // Subscribe to changes to child variables\n    this._subs.add(\n      this.subscribeToEvent(SceneVariableValueChangedEvent, (event) => this._handleVariableValueChanged(event.payload))\n    );\n\n    this._subs.add(\n      timeRange.subscribeToState(() => {\n        this._refreshTimeRangeBasedVariables();\n      })\n    );\n\n    // Subscribe to state changes\n    this._subs.add(this.subscribeToState(this._onStateChanged));\n\n    this._checkForVariablesThatChangedWhileInactive();\n\n    // Add all variables that need updating to queue\n    for (const variable of this.state.variables) {\n      if (this._variableNeedsUpdate(variable)) {\n        this._variablesToUpdate.add(variable);\n      }\n    }\n\n    this._updateNextBatch();\n\n    // Return deactivation handler;\n    return this._onDeactivate;\n  };\n\n  /**\n   * Add all variables that depend on the changed variable to the update queue\n   */\n  private _refreshTimeRangeBasedVariables() {\n    for (const variable of this.state.variables) {\n      if ('refresh' in variable.state && variable.state.refresh === VariableRefresh.onTimeRangeChanged) {\n        this._variablesToUpdate.add(variable);\n      }\n    }\n\n    this._updateNextBatch();\n  }\n\n  /**\n   * Cancel all currently running updates\n   */\n  private _onDeactivate = () => {\n    for (const update of this._updating.values()) {\n      update.subscription?.unsubscribe();\n    }\n\n    // Remember current variable values\n    for (const variable of this.state.variables) {\n      // if the current variable is not in queue to update and validate and not being actively updated then the value is ok\n      if (!this._variablesToUpdate.has(variable) && !this._updating.has(variable)) {\n        this._variableValueRecorder.recordCurrentValue(variable);\n      }\n    }\n\n    this._variablesToUpdate.clear();\n    this._updating.clear();\n  };\n\n  /**\n   * Look for new variables that need to be initialized\n   */\n  private _onStateChanged = (newState: SceneVariableSetState, oldState: SceneVariableSetState) => {\n    const variablesToUpdateCountStart = this._variablesToUpdate.size;\n\n    // Check for removed variables\n    for (const variable of oldState.variables) {\n      if (!newState.variables.includes(variable)) {\n        const updating = this._updating.get(variable);\n        if (updating?.subscription) {\n          updating.subscription.unsubscribe();\n        }\n        this._updating.delete(variable);\n        this._variablesToUpdate.delete(variable);\n      }\n    }\n\n    // Check for new variables\n    for (const variable of newState.variables) {\n      if (!oldState.variables.includes(variable)) {\n        if (this._variableNeedsUpdate(variable)) {\n          this._variablesToUpdate.add(variable);\n        }\n      }\n    }\n\n    // Only start a new batch if there was no batch already running\n    if (variablesToUpdateCountStart === 0 && this._variablesToUpdate.size > 0) {\n      this._updateNextBatch();\n    }\n  };\n\n  /**\n   * If variables changed while in in-active state we don't get any change events, so we need to check for that here.\n   */\n  private _checkForVariablesThatChangedWhileInactive() {\n    if (!this._variableValueRecorder.hasValues()) {\n      return;\n    }\n\n    for (const variable of this.state.variables) {\n      if (this._variableValueRecorder.hasValueChanged(variable)) {\n        writeVariableTraceLog(variable, 'Changed while in-active');\n        this._addDependentVariablesToUpdateQueue(variable);\n      }\n    }\n  }\n\n  private _variableNeedsUpdate(variable: SceneVariable): boolean {\n    if (variable.isLazy) {\n      return false;\n    }\n\n    if (!variable.validateAndUpdate) {\n      return false;\n    }\n\n    // If we have recorded valid value (even if it has changed since we do not need to re-validate this variable)\n    if (this._variableValueRecorder.hasRecordedValue(variable)) {\n      writeVariableTraceLog(variable, 'Skipping updateAndValidate current value valid');\n      return false;\n    }\n\n    return true;\n  }\n\n  /**\n   * This loops through variablesToUpdate and update all that can.\n   * If one has a dependency that is currently in variablesToUpdate it will be skipped for now.\n   */\n  private _updateNextBatch() {\n    for (const variable of this._variablesToUpdate) {\n      if (!variable.validateAndUpdate) {\n        throw new Error('Variable added to variablesToUpdate but does not have validateAndUpdate');\n      }\n\n      // Ignore it if it's already started\n      if (this._updating.has(variable)) {\n        continue;\n      }\n\n      // Wait for variables that has dependencies that also needs updates\n      if (sceneGraph.hasVariableDependencyInLoadingState(variable)) {\n        continue;\n      }\n\n      const variableToUpdate: VariableUpdateInProgress = {\n        variable,\n      };\n\n      this._updating.set(variable, variableToUpdate);\n      writeVariableTraceLog(variable, 'updateAndValidate started');\n\n      variableToUpdate.subscription = variable.validateAndUpdate().subscribe({\n        next: () => this._validateAndUpdateCompleted(variable),\n        complete: () => this._validateAndUpdateCompleted(variable),\n        error: (err) => this._handleVariableError(variable, err),\n      });\n    }\n  }\n\n  /**\n   * A variable has completed its update process. This could mean that variables that depend on it can now be updated in turn.\n   */\n  private _validateAndUpdateCompleted(variable: SceneVariable) {\n    if (!this._updating.has(variable)) {\n      return;\n    }\n\n    const update = this._updating.get(variable);\n    update?.subscription?.unsubscribe();\n\n    this._updating.delete(variable);\n    this._variablesToUpdate.delete(variable);\n\n    writeVariableTraceLog(variable, 'updateAndValidate completed');\n\n    this._notifyDependentSceneObjects(variable);\n    this._updateNextBatch();\n  }\n\n  public cancel(variable: SceneVariable) {\n    const update = this._updating.get(variable);\n    update?.subscription?.unsubscribe();\n\n    this._updating.delete(variable);\n    this._variablesToUpdate.delete(variable);\n  }\n\n  private _handleVariableError(variable: SceneVariable, err: Error) {\n    const update = this._updating.get(variable);\n    update?.subscription?.unsubscribe();\n\n    this._updating.delete(variable);\n    this._variablesToUpdate.delete(variable);\n\n    variable.setState({ loading: false, error: err.message });\n\n    console.error('SceneVariableSet updateAndValidate error', err);\n\n    writeVariableTraceLog(variable, 'updateAndValidate error', err);\n  }\n\n  private _handleVariableValueChanged(variableThatChanged: SceneVariable) {\n    this._variablesThatHaveChanged.add(variableThatChanged);\n    this._addDependentVariablesToUpdateQueue(variableThatChanged);\n\n    // Ignore this change if it is currently updating\n    if (!this._updating.has(variableThatChanged)) {\n      this._updateNextBatch();\n      this._notifyDependentSceneObjects(variableThatChanged);\n    }\n  }\n\n  /**\n   * This is called by any parent level variable set to notify scene that an update batch is completed.\n   * This is the main mechanism lower level variable set's react to changes on higher levels.\n   */\n  private _handleParentVariableUpdatesCompleted(variable: SceneVariable, hasChanged: boolean) {\n    // First loop through changed variables and add any of our variables that depend on the higher level variable to the update queue\n    if (hasChanged) {\n      this._addDependentVariablesToUpdateQueue(variable);\n    }\n\n    // If we have variables to update but none are currently updating kick of a new update batch\n    if (this._variablesToUpdate.size > 0 && this._updating.size === 0) {\n      this._updateNextBatch();\n    }\n  }\n\n  private _addDependentVariablesToUpdateQueue(variableThatChanged: SceneVariable) {\n    for (const otherVariable of this.state.variables) {\n      if (otherVariable.variableDependency) {\n        if (otherVariable.variableDependency.hasDependencyOn(variableThatChanged.state.name)) {\n          writeVariableTraceLog(otherVariable, 'Added to update queue, dependant variable value changed');\n\n          if (this._updating.has(otherVariable) && otherVariable.onCancel) {\n            otherVariable.onCancel();\n          }\n\n          this._variablesToUpdate.add(otherVariable);\n        }\n      }\n    }\n  }\n\n  /**\n   * Walk scene object graph and update all objects that depend on variables that have changed\n   */\n  private _notifyDependentSceneObjects(variable: SceneVariable) {\n    if (!this.parent) {\n      return;\n    }\n\n    this._traverseSceneAndNotify(this.parent, variable, this._variablesThatHaveChanged.has(variable));\n    this._variablesThatHaveChanged.delete(variable);\n  }\n\n  /**\n   * Recursivly walk the full scene object graph and notify all objects with dependencies that include any of changed variables\n   */\n  private _traverseSceneAndNotify(sceneObject: SceneObject, variable: SceneVariable, hasChanged: boolean) {\n    // No need to notify variables under this SceneVariableSet\n    if (this === sceneObject) {\n      return;\n    }\n\n    // Skip non active scene objects\n    if (!sceneObject.isActive) {\n      return;\n    }\n\n    // If we find a nested SceneVariableSet that has a variable with the same name we stop the traversal\n    if (sceneObject.state.$variables && sceneObject.state.$variables !== this) {\n      const localVar = sceneObject.state.$variables.getByName(variable.state.name);\n      if (localVar) {\n        return;\n      }\n    }\n\n    if (sceneObject.variableDependency) {\n      sceneObject.variableDependency.variableUpdateCompleted(variable, hasChanged);\n    }\n\n    sceneObject.forEachChild((child) => this._traverseSceneAndNotify(child, variable, hasChanged));\n  }\n\n  /**\n   * Return true if variable is waiting to update or currently updating.\n   * It also returns true if a dependency of the variable is loading.\n   *\n   * For example if C depends on variable B which depends on variable A and A is loading this returns true for variable C and B.\n   */\n  public isVariableLoadingOrWaitingToUpdate(variable: SceneVariable) {\n    if (variable.isAncestorLoading && variable.isAncestorLoading()) {\n      return true;\n    }\n\n    if (this._variablesToUpdate.has(variable) || this._updating.has(variable)) {\n      return true;\n    }\n\n    // Last scenario is to check the variable's own dependencies as well\n    return sceneGraph.hasVariableDependencyInLoadingState(variable);\n  }\n}\n\nexport interface VariableUpdateInProgress {\n  variable: SceneVariable;\n  subscription?: Unsubscribable;\n}\n\nfunction writeVariableTraceLog(variable: SceneVariable, message: string, err?: Error) {\n  if (err) {\n    writeSceneLog('SceneVariableSet', `Variable[${variable.state.name}]: ${message}`, err);\n  } else {\n    writeSceneLog('SceneVariableSet', `Variable[${variable.state.name}]: ${message}`);\n  }\n}\n\nclass SceneVariableSetVariableDependencyHandler implements SceneVariableDependencyConfigLike {\n  public constructor(private _variableUpdatesCompleted: (variable: SceneVariable, hasChanged: boolean) => void) {}\n\n  private _emptySet = new Set<string>();\n\n  public getNames(): Set<string> {\n    return this._emptySet;\n  }\n\n  public hasDependencyOn(name: string): boolean {\n    return false;\n  }\n\n  public variableUpdateCompleted(variable: SceneVariable, hasChanged: boolean): void {\n    this._variableUpdatesCompleted(variable, hasChanged);\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -1131,7 +1131,7 @@ declare class LiveNowTimer extends SceneObjectBase<LiveNowTimerState> {
     private timerId;
     private static REFRESH_RATE;
     constructor({ enabled }: {
-        enabled?: boolean;
+        enabled?: boolean | undefined;
     });
     private _activationHandler;
     enable(): void;
@@ -1226,18 +1226,18 @@ declare class AnnotationsDataLayer extends SceneDataLayerBase<AnnotationsDataLay
     protected processEvents(query: AnnotationQuery, events: AnnotationQueryResults): {
         state: LoadingState;
         series: _grafana_data.DataFrame[];
-        structureRev?: number;
-        annotations?: _grafana_data.DataFrame[];
-        alertState?: _grafana_data.AlertStateInfo;
-        request?: _grafana_data.DataQueryRequest<_grafana_data.DataQuery>;
-        timings?: _grafana_data.DataQueryTimings;
-        errors?: _grafana_data.DataQueryError[];
-        error?: _grafana_data.DataQueryError;
+        structureRev?: number | undefined;
+        annotations?: _grafana_data.DataFrame[] | undefined;
+        alertState?: _grafana_data.AlertStateInfo | undefined;
+        request?: _grafana_data.DataQueryRequest<_grafana_data.DataQuery> | undefined;
+        timings?: _grafana_data.DataQueryTimings | undefined;
+        errors?: _grafana_data.DataQueryError[] | undefined;
+        error?: _grafana_data.DataQueryError | undefined;
         timeRange: _grafana_data.TimeRange;
-        traceIds?: string[];
+        traceIds?: string[] | undefined;
     };
 }
-declare function AnnotationsDataLayerRenderer({ model }: SceneComponentProps<AnnotationsDataLayer>): React__default.JSX.Element;
+declare function AnnotationsDataLayerRenderer({ model }: SceneComponentProps<AnnotationsDataLayer>): React__default.JSX.Element | null;
 
 type index_AnnotationsDataLayer = AnnotationsDataLayer;
 declare const index_AnnotationsDataLayer: typeof AnnotationsDataLayer;
@@ -1344,7 +1344,7 @@ declare class SceneDataLayerControls extends SceneObjectBase<SceneDataLayerContr
     static Component: typeof SceneDataLayerControlsRenderer;
     constructor();
 }
-declare function SceneDataLayerControlsRenderer({ model }: SceneComponentProps<SceneDataLayerControls>): React__default.JSX.Element;
+declare function SceneDataLayerControlsRenderer({ model }: SceneComponentProps<SceneDataLayerControls>): React__default.JSX.Element | null;
 
 interface SceneDataTransformerState extends SceneDataState {
     /**
@@ -1402,7 +1402,7 @@ interface VariableValueControlState extends SceneObjectState {
 declare class VariableValueControl extends SceneObjectBase<VariableValueControlState> {
     static Component: typeof VariableValueControlRenderer;
 }
-declare function VariableValueControlRenderer({ model }: SceneComponentProps<VariableValueControl>): React__default.JSX.Element;
+declare function VariableValueControlRenderer({ model }: SceneComponentProps<VariableValueControl>): React__default.JSX.Element | null;
 
 declare class SceneVariableSet extends SceneObjectBase<SceneVariableSetState> implements SceneVariables {
     /** 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> {
     onMoveBackward: () => void;
     onMoveForward: () => void;
 }
-declare function SceneTimePickerRenderer({ model }: SceneComponentProps<SceneTimePicker>): React__default.JSX.Element;
+declare function SceneTimePickerRenderer({ model }: SceneComponentProps<SceneTimePicker>): React__default.JSX.Element | null;
 
 interface SceneRefreshPickerState extends SceneObjectState {
     refresh: string;
@@ -1835,7 +1835,7 @@ declare class SceneFlexLayout extends SceneObjectBase<SceneFlexLayoutState> impl
     toggleDirection(): void;
     isDraggable(): boolean;
 }
-declare function SceneFlexLayoutRenderer({ model, parentState }: SceneFlexItemRenderProps$1<SceneFlexLayout>): React__default.JSX.Element;
+declare function SceneFlexLayoutRenderer({ model, parentState }: SceneFlexItemRenderProps$1<SceneFlexLayout>): React__default.JSX.Element | null;
 interface SceneFlexItemPlacement {
     wrap?: CSSProperties['flexWrap'];
     direction?: CSSProperties['flexDirection'];
@@ -1867,7 +1867,7 @@ interface SceneFlexItemRenderProps$1<T> extends SceneComponentProps<T> {
 declare class SceneFlexItem extends SceneObjectBase<SceneFlexItemState> {
     static Component: typeof SceneFlexItemRenderer;
 }
-declare function SceneFlexItemRenderer({ model, parentState }: SceneFlexItemRenderProps$1<SceneFlexItem>): React__default.JSX.Element;
+declare function SceneFlexItemRenderer({ model, parentState }: SceneFlexItemRenderProps$1<SceneFlexItem>): React__default.JSX.Element | null;
 
 interface SceneCSSGridLayoutState extends SceneObjectState, SceneCSSGridLayoutOptions {
     children: Array<SceneCSSGridItem | SceneObject>;
@@ -1911,7 +1911,7 @@ declare class SceneCSSGridLayout extends SceneObjectBase<SceneCSSGridLayoutState
     constructor(state: Partial<SceneCSSGridLayoutState>);
     isDraggable(): boolean;
 }
-declare function SceneCSSGridLayoutRenderer({ model }: SceneCSSGridItemRenderProps<SceneCSSGridLayout>): React__default.JSX.Element;
+declare function SceneCSSGridLayoutRenderer({ model }: SceneCSSGridItemRenderProps<SceneCSSGridLayout>): React__default.JSX.Element | null;
 interface SceneCSSGridItemPlacement {
     /**
      * True when the item should rendered but not visible.
@@ -1933,7 +1933,7 @@ interface SceneCSSGridItemRenderProps<T> extends SceneComponentProps<T> {
 declare class SceneCSSGridItem extends SceneObjectBase<SceneCSSGridItemState> {
     static Component: typeof SceneCSSGridItemRenderer;
 }
-declare function SceneCSSGridItemRenderer({ model, parentState }: SceneCSSGridItemRenderProps<SceneCSSGridItem>): React__default.JSX.Element;
+declare function SceneCSSGridItemRenderer({ model, parentState }: SceneCSSGridItemRenderProps<SceneCSSGridItem>): React__default.JSX.Element | null;
 
 declare function SceneGridLayoutRenderer({ model }: SceneComponentProps<SceneGridLayout>): React__default.JSX.Element;
 
@@ -2030,9 +2030,9 @@ interface SceneGridItemState extends SceneGridItemStateLike {
 declare class SceneGridItem extends SceneObjectBase<SceneGridItemState> implements SceneGridItemLike {
     static Component: typeof SceneGridItemRenderer;
 }
-declare function SceneGridItemRenderer({ model }: SceneComponentProps<SceneGridItem>): React__default.JSX.Element;
+declare function SceneGridItemRenderer({ model }: SceneComponentProps<SceneGridItem>): React__default.JSX.Element | null;
 
-declare function SplitLayoutRenderer({ model }: SceneFlexItemRenderProps<SplitLayout>): React__default.JSX.Element;
+declare function SplitLayoutRenderer({ model }: SceneFlexItemRenderProps<SplitLayout>): React__default.JSX.Element | null;
 interface SceneFlexItemRenderProps<T> extends SceneComponentProps<T> {
     parentState?: SceneFlexItemPlacement;
 }
@@ -2150,7 +2150,7 @@ declare class SceneAppPage extends SceneObjectBase<SceneAppPageState> implements
     initializeScene(scene: EmbeddedScene): void;
     getScene(routeMatch: SceneRouteMatch): EmbeddedScene;
     getDrilldownPage(drilldown: SceneAppDrilldownView, routeMatch: SceneRouteMatch<{}>): SceneAppPageLike;
-    enrichDataRequest(source: SceneObject): Partial<_grafana_data.DataQueryRequest<_grafana_data.DataQuery>>;
+    enrichDataRequest(source: SceneObject): Partial<_grafana_data.DataQueryRequest<_grafana_data.DataQuery>> | null;
 }
 interface SceneAppPageRendererProps extends SceneComponentProps<SceneAppPage> {
     routeProps: RouteComponentProps;
@@ -2175,7 +2175,7 @@ interface SceneReactObjectState<TProps = {}> extends SceneObjectState {
  * A utility object that can be used to render any React component or ReactNode
  */
 declare class SceneReactObject<TProps = {}> extends SceneObjectBase<SceneReactObjectState<TProps>> {
-    static Component: ({ model }: SceneComponentProps<SceneReactObject>) => string | number | true | Iterable<React__default.ReactNode> | React__default.JSX.Element;
+    static Component: ({ model }: SceneComponentProps<SceneReactObject>) => string | number | true | Iterable<React__default.ReactNode> | React__default.JSX.Element | null;
 }
 
 type StandardFieldConfigInterface<T, C, Prefix extends string> = {
@@ -2328,7 +2328,7 @@ declare class VizPanelBuilder<TOptions extends {}, TFieldConfig extends {}> impl
 declare class PanelOptionsBuilder<TOptions extends {} = {}> {
     private defaultOptions?;
     private _options;
-    constructor(defaultOptions?: () => Partial<TOptions>);
+    constructor(defaultOptions?: (() => Partial<TOptions>) | undefined);
     private setDefaults;
     /**
      * 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
     private defaultFieldConfig?;
     private _fieldConfig;
     private _overridesBuilder;
-    constructor(defaultFieldConfig?: () => TFieldConfig);
+    constructor(defaultFieldConfig?: (() => TFieldConfig) | undefined);
     private setDefaults;
     /**
      * Set color.

package/dist/index.js

@@ -6604,6 +6604,12 @@ class SceneVariableSet extends SceneObjectBase {
     if (!sceneObject.isActive) {
       return;
     }
+    if (sceneObject.state.$variables && sceneObject.state.$variables !== this) {
+      const localVar = sceneObject.state.$variables.getByName(variable.state.name);
+      if (localVar) {
+        return;
+      }
+    }
     if (sceneObject.variableDependency) {
       sceneObject.variableDependency.variableUpdateCompleted(variable, hasChanged);
     }
@@ -8025,6 +8031,10 @@ var __objRest = (source, exclude) => {
 };
 function SceneGridLayoutRenderer({ model }) {
   const { children, isLazy, isDraggable, isResizable } = model.useState();
+  const ref = React.useRef(null);
+  React.useEffect(() => {
+    updateAnimationClass(ref, !!isDraggable);
+  }, [isDraggable]);
   validateChildrenSize(children);
   return /* @__PURE__ */ React__default["default"].createElement(AutoSizer__default["default"], null, ({ width, height }) => {
     if (width === 0) {
@@ -8032,8 +8042,9 @@ function SceneGridLayoutRenderer({ model }) {
     }
     const layout = model.buildGridLayout(width, height);
     return /* @__PURE__ */ React__default["default"].createElement("div", {
+      ref,
       style: { width: `${width}px`, height: "100%", position: "relative", zIndex: 1 },
-      className: css.cx("react-grid-layout", isDraggable && "react-grid-layout--enable-move-animations")
+      className: "react-grid-layout"
     }, /* @__PURE__ */ React__default["default"].createElement(ReactGridLayout__default["default"], {
       width,
       isDraggable: isDraggable && width > 768,
@@ -8096,6 +8107,17 @@ function validateChildrenSize(children) {
     throw new Error("All children must have a size specified");
   }
 }
+function updateAnimationClass(ref, isDraggable, retry) {
+  if (ref.current) {
+    if (isDraggable) {
+      ref.current.classList.add("react-grid-layout--enable-move-animations");
+    } else {
+      ref.current.classList.remove("react-grid-layout--enable-move-animations");
+    }
+  } else if (!retry) {
+    setTimeout(() => updateAnimationClass(ref, isDraggable, true), 50);
+  }
+}
 const ResizeHandle = React__default["default"].forwardRef((_a, ref) => {
   var _b = _a, divProps = __objRest(_b, ["handleAxis"]);
   const customCssClass = ui.useStyles2(getResizeHandleStyles);
@@ -8654,8 +8676,7 @@ const getStyles$4 = (theme) => ({
     display: "flex",
     flexDirection: "column",
     flexGrow: 1,
-    gap: theme.spacing(1),
-    cursor: "pointer"
+    gap: theme.spacing(1)
   }),
   row: css.css({
     width: "100%",