@grafana/scenes 6.35.1--canary.1235.17607489973.0 → 6.35.1--canary.1148.17638385485.0

package/dist/esm/behaviors/SceneRenderProfiler.js

@@ -1,5 +1,4 @@
-import { writeSceneLog, writeSceneLogStyled } from '../utils/writeSceneLog.js';
-import { LongFrameDetector } from './LongFrameDetector.js';
+import { writeSceneLog } from '../utils/writeSceneLog.js';
 
 var __typeError = (msg) => {
   throw TypeError(msg);
@@ -8,17 +7,9 @@ var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
-var __privateWrapper = (obj, member, setter, getter) => ({
-  set _(value) {
-    __privateSet(obj, member, value);
-  },
-  get _() {
-    return __privateGet(obj, member, getter);
-  }
-});
-var _profileInProgress, _profileStartTs, _trailAnimationFrameId, _recordedTrailingSpans, _longFrameDetector, _longFramesCount, _longFramesTotalTime, _visibilityChangeHandler;
+var _profileInProgress, _profileStartTs, _trailAnimationFrameId, _recordedTrailingSpans, _visibilityChangeHandler;
 const POST_STORM_WINDOW = 2e3;
-const DEFAULT_LONG_FRAME_THRESHOLD = 30;
+const SPAN_THRESHOLD = 30;
 const TAB_INACTIVE_THRESHOLD = 1e3;
 class SceneRenderProfiler {
   constructor(queryController) {
@@ -28,13 +19,9 @@ class SceneRenderProfiler {
     __privateAdd(this, _trailAnimationFrameId, null);
     // Will keep measured lengths trailing frames
     __privateAdd(this, _recordedTrailingSpans, []);
-    // Long frame tracking
-    __privateAdd(this, _longFrameDetector);
-    __privateAdd(this, _longFramesCount, 0);
-    __privateAdd(this, _longFramesTotalTime, 0);
     __privateAdd(this, _visibilityChangeHandler, null);
     this.measureTrailingFrames = (measurementStartTs, lastFrameTime, profileStartTs) => {
-      var _a, _b, _c, _d;
+      var _a;
       const currentFrameTime = performance.now();
       const frameLength = currentFrameTime - lastFrameTime;
       if (frameLength > TAB_INACTIVE_THRESHOLD) {
@@ -53,60 +40,18 @@ class SceneRenderProfiler {
         const slowFrames = processRecordedSpans(__privateGet(this, _recordedTrailingSpans));
         const slowFramesTime = slowFrames.reduce((acc, val) => acc + val, 0);
         writeSceneLog(
-          "SceneRenderProfiler",
-          `Profile tail recorded - Slow frames: ${slowFramesTime.toFixed(1)}ms (${slowFrames.length} frames)`
+          this.constructor.name,
+          "Profile tail recorded, slow frames duration:",
+          slowFramesTime,
+          slowFrames,
+          __privateGet(this, _profileInProgress)
         );
-        writeSceneLog("", `  \u251C\u2500 Origin: ${((_a = __privateGet(this, _profileInProgress)) == null ? void 0 : _a.origin) || "unknown"}`);
-        writeSceneLog("", `  \u2514\u2500 Crumbs:`, ((_b = __privateGet(this, _profileInProgress)) == null ? void 0 : _b.crumbs) || []);
         __privateSet(this, _recordedTrailingSpans, []);
         const profileDuration = measurementStartTs - profileStartTs;
-        if (typeof performance !== "undefined" && performance.mark) {
-          const profileName = ((_c = __privateGet(this, _profileInProgress)) == null ? void 0 : _c.origin) || "unknown";
-          const totalTime = profileDuration + slowFramesTime;
-          performance.mark(`Dashboard Profile End: ${profileName}`);
-          const startMarkName = `Dashboard Profile Start: ${profileName}`;
-          try {
-            performance.measure(
-              `Dashboard Profile: ${profileName} (${totalTime.toFixed(1)}ms)`,
-              startMarkName,
-              `Dashboard Profile End: ${profileName}`
-            );
-          } catch (e) {
-            performance.mark(`Dashboard Profile Complete: ${profileName} (${totalTime.toFixed(1)}ms)`);
-          }
-          if (slowFrames.length > 0) {
-            const slowFramesMarkName = `Slow Frames Summary: ${slowFrames.length} frames (${slowFramesTime.toFixed(
-              1
-            )}ms)`;
-            performance.mark(slowFramesMarkName);
-            slowFrames.forEach((frameTime, index) => {
-              if (frameTime > 16) {
-                try {
-                  const frameStartTime = __privateGet(this, _profileStartTs) + profileDuration + (index > 0 ? slowFrames.slice(0, index).reduce((sum, t) => sum + t, 0) : 0);
-                  const frameId = `slow-frame-${index}`;
-                  const frameStartMark = `${frameId}-start`;
-                  const frameEndMark = `${frameId}-end`;
-                  performance.mark(frameStartMark, { startTime: frameStartTime });
-                  performance.mark(frameEndMark, { startTime: frameStartTime + frameTime });
-                  performance.measure(`Slow Frame ${index + 1}: ${frameTime.toFixed(1)}ms`, frameStartMark, frameEndMark);
-                } catch (e) {
-                  performance.mark(`Slow Frame ${index + 1}: ${frameTime.toFixed(1)}ms`);
-                }
-              }
-            });
-          }
-        }
-        const completionTimestamp = performance.now();
-        writeSceneLog("SceneRenderProfiler", "Profile completed");
-        writeSceneLog("", `  \u251C\u2500 Timestamp: ${completionTimestamp.toFixed(1)}ms`);
-        writeSceneLog("", `  \u251C\u2500 Total time: ${(profileDuration + slowFramesTime).toFixed(1)}ms`);
-        writeSceneLog("", `  \u251C\u2500 Slow frames: ${slowFramesTime}ms (${slowFrames.length} frames)`);
-        writeSceneLog("", `  \u2514\u2500 Long frames: ${__privateGet(this, _longFramesTotalTime)}ms (${__privateGet(this, _longFramesCount)} frames)`);
-        __privateGet(this, _longFrameDetector).stop();
-        writeSceneLogStyled(
-          "SceneRenderProfiler",
-          `Stopped long frame detection - profile complete at ${completionTimestamp.toFixed(1)}ms`,
-          "color: #00CC00; font-weight: bold;"
+        writeSceneLog(
+          this.constructor.name,
+          "Stoped recording, total measured time (network included):",
+          profileDuration + slowFramesTime
         );
         __privateSet(this, _trailAnimationFrameId, null);
         const profileEndTs = profileStartTs + profileDuration + slowFramesTime;
@@ -118,7 +63,7 @@ class SceneRenderProfiler {
           end: profileEndTs
         });
         const networkDuration = captureNetwork(profileStartTs, profileEndTs);
-        if (((_d = this.queryController) == null ? void 0 : _d.state.onProfileComplete) && __privateGet(this, _profileInProgress)) {
+        if (((_a = this.queryController) == null ? void 0 : _a.state.onProfileComplete) && __privateGet(this, _profileInProgress)) {
           this.queryController.state.onProfileComplete({
             origin: __privateGet(this, _profileInProgress).origin,
             crumbs: __privateGet(this, _profileInProgress).crumbs,
@@ -126,8 +71,6 @@ class SceneRenderProfiler {
             networkDuration,
             startTs: profileStartTs,
             endTs: profileEndTs,
-            longFramesCount: __privateGet(this, _longFramesCount),
-            longFramesTotalTime: __privateGet(this, _longFramesTotalTime),
             // @ts-ignore
             jsHeapSizeLimit: performance.memory ? performance.memory.jsHeapSizeLimit : 0,
             // @ts-ignore
@@ -147,7 +90,6 @@ class SceneRenderProfiler {
         }
       }
     };
-    __privateSet(this, _longFrameDetector, new LongFrameDetector());
     this.setupVisibilityChangeHandler();
   }
   setQueryController(queryController) {
@@ -172,7 +114,6 @@ class SceneRenderProfiler {
       document.removeEventListener("visibilitychange", __privateGet(this, _visibilityChangeHandler));
       __privateSet(this, _visibilityChangeHandler, null);
     }
-    __privateGet(this, _longFrameDetector).stop();
     this.cancelProfile();
   }
   startProfile(name) {
@@ -202,32 +143,14 @@ class SceneRenderProfiler {
    *               - "clean": Started when no profile is currently active
    */
   _startNewProfile(name, force = false) {
-    var _a;
     __privateSet(this, _profileInProgress, { origin: name, crumbs: [] });
     __privateSet(this, _profileStartTs, performance.now());
-    __privateSet(this, _longFramesCount, 0);
-    __privateSet(this, _longFramesTotalTime, 0);
-    if (typeof performance !== "undefined" && performance.mark) {
-      const markName = `Dashboard Profile Start: ${name}`;
-      performance.mark(markName);
-    }
-    writeSceneLogStyled(
+    writeSceneLog(
       "SceneRenderProfiler",
       `Profile started[${force ? "forced" : "clean"}]`,
-      "color: #FFCC00; font-weight: bold;"
+      __privateGet(this, _profileInProgress),
+      __privateGet(this, _profileStartTs)
     );
-    writeSceneLog("", `  \u251C\u2500 Origin: ${((_a = __privateGet(this, _profileInProgress)) == null ? void 0 : _a.origin) || "unknown"}`);
-    writeSceneLog("", `  \u2514\u2500 Timestamp: ${__privateGet(this, _profileStartTs).toFixed(1)}ms`);
-    __privateGet(this, _longFrameDetector).start((event) => {
-      if (!__privateGet(this, _profileInProgress) || !__privateGet(this, _profileStartTs)) {
-        return;
-      }
-      if (event.timestamp < __privateGet(this, _profileStartTs)) {
-        return;
-      }
-      __privateWrapper(this, _longFramesCount)._++;
-      __privateSet(this, _longFramesTotalTime, __privateGet(this, _longFramesTotalTime) + event.duration);
-    });
   }
   recordProfileTail(measurementStartTime, profileStartTs) {
     __privateSet(this, _trailAnimationFrameId, requestAnimationFrame(
@@ -238,7 +161,7 @@ class SceneRenderProfiler {
     var _a;
     writeSceneLog("SceneRenderProfiler", "Trying to complete profile", __privateGet(this, _profileInProgress));
     if (((_a = this.queryController) == null ? void 0 : _a.runningQueriesCount()) === 0 && __privateGet(this, _profileInProgress)) {
-      writeSceneLog("SceneRenderProfiler", "All queries completed, starting tail measurement");
+      writeSceneLog("SceneRenderProfiler", "All queries completed, stopping profile");
       this.recordProfileTail(performance.now(), __privateGet(this, _profileStartTs));
     }
   }
@@ -261,11 +184,7 @@ class SceneRenderProfiler {
         cancelAnimationFrame(__privateGet(this, _trailAnimationFrameId));
         __privateSet(this, _trailAnimationFrameId, null);
       }
-      __privateGet(this, _longFrameDetector).stop();
-      writeSceneLog("SceneRenderProfiler", "Stopped long frame detection - profile cancelled");
       __privateSet(this, _recordedTrailingSpans, []);
-      __privateSet(this, _longFramesCount, 0);
-      __privateSet(this, _longFramesTotalTime, 0);
     }
   }
   addCrumb(crumb) {
@@ -279,13 +198,10 @@ _profileInProgress = new WeakMap();
 _profileStartTs = new WeakMap();
 _trailAnimationFrameId = new WeakMap();
 _recordedTrailingSpans = new WeakMap();
-_longFrameDetector = new WeakMap();
-_longFramesCount = new WeakMap();
-_longFramesTotalTime = new WeakMap();
 _visibilityChangeHandler = new WeakMap();
 function processRecordedSpans(spans) {
   for (let i = spans.length - 1; i >= 0; i--) {
-    if (spans[i] > DEFAULT_LONG_FRAME_THRESHOLD) {
+    if (spans[i] > SPAN_THRESHOLD) {
       return spans.slice(0, i + 1);
     }
   }

package/dist/esm/behaviors/SceneRenderProfiler.js.map

@@ -1 +1 @@
-{"version":3,"file":"SceneRenderProfiler.js","sources":["../../../src/behaviors/SceneRenderProfiler.ts"],"sourcesContent":["import { writeSceneLog, writeSceneLogStyled } from '../utils/writeSceneLog';\nimport { SceneQueryControllerLike, LongFrameEvent } from './types';\nimport { LongFrameDetector } from './LongFrameDetector';\n\nconst POST_STORM_WINDOW = 2000; // Time after last query to observe slow frames\nconst DEFAULT_LONG_FRAME_THRESHOLD = 30; // Threshold for tail recording slow frames\nconst TAB_INACTIVE_THRESHOLD = 1000; // Tab inactive threshold in ms\n\n/**\n * SceneRenderProfiler tracks dashboard interaction performance including:\n * - Total interaction duration\n * - Network time\n * - Long frame detection (50ms threshold) during interaction using LoAF API (default) or manual tracking (fallback)\n * - Slow frame detection (30ms threshold) for tail recording after interaction\n *\n * Long frame detection during interaction:\n * - 50ms threshold aligned with LoAF API default\n * - LoAF API preferred (Chrome 123+) with manual fallback\n * - Provides script attribution when using LoAF API\n *\n * Slow frame detection for tail recording:\n * - 30ms threshold for post-interaction monitoring\n * - Manual frame timing measurement\n * - Captures rendering delays after user interaction completes\n */\n\nexport class SceneRenderProfiler {\n  #profileInProgress: {\n    // Profile origin, i.e. scene refresh picker\n    origin: string;\n    crumbs: string[];\n  } | null = null;\n\n  #profileStartTs: number | null = null;\n  #trailAnimationFrameId: number | null = null;\n\n  // Will keep measured lengths trailing frames\n  #recordedTrailingSpans: number[] = [];\n\n  // Long frame tracking\n  #longFrameDetector: LongFrameDetector;\n  #longFramesCount = 0;\n  #longFramesTotalTime = 0;\n\n  #visibilityChangeHandler: (() => void) | null = null;\n\n  public constructor(private queryController?: SceneQueryControllerLike) {\n    this.#longFrameDetector = new LongFrameDetector();\n    this.setupVisibilityChangeHandler();\n  }\n\n  public setQueryController(queryController: SceneQueryControllerLike) {\n    this.queryController = queryController;\n  }\n\n  private setupVisibilityChangeHandler() {\n    // Ensure event listener is only added once\n    if (this.#visibilityChangeHandler) {\n      return;\n    }\n\n    // Handle tab switching with Page Visibility API\n    this.#visibilityChangeHandler = () => {\n      if (document.hidden && this.#profileInProgress) {\n        writeSceneLog('SceneRenderProfiler', 'Tab became inactive, cancelling profile');\n        this.cancelProfile();\n      }\n    };\n\n    if (typeof document !== 'undefined') {\n      document.addEventListener('visibilitychange', this.#visibilityChangeHandler);\n    }\n  }\n\n  public cleanup() {\n    // Remove event listener to prevent memory leaks\n    if (this.#visibilityChangeHandler && typeof document !== 'undefined') {\n      document.removeEventListener('visibilitychange', this.#visibilityChangeHandler);\n      this.#visibilityChangeHandler = null;\n    }\n\n    // Cleanup long frame tracking\n    this.#longFrameDetector.stop();\n\n    // Cancel any ongoing profiling\n    this.cancelProfile();\n  }\n\n  public startProfile(name: string) {\n    // Only start profile if tab is active. This makes sure we don't start a profile when i.e. someone opens a dashboard in a new tab\n    // and doesn't interact with it.\n    if (document.hidden) {\n      writeSceneLog('SceneRenderProfiler', 'Tab is inactive, skipping profile', name);\n      return;\n    }\n\n    if (this.#profileInProgress) {\n      if (this.#trailAnimationFrameId) {\n        this.cancelProfile();\n        this._startNewProfile(name, true);\n      } else {\n        this.addCrumb(name);\n      }\n    } else {\n      this._startNewProfile(name);\n    }\n  }\n\n  /**\n   * Starts a new profile for performance measurement.\n   *\n   * @param name - The origin/trigger of the profile (e.g., 'time_range_change', 'variable_value_changed')\n   * @param force - Whether this is a \"forced\" profile (true) or \"clean\" profile (false)\n   *               - \"forced\": Started by canceling an existing profile that was recording trailing frames\n   *                           This happens when a new user interaction occurs before the previous one\n   *                           finished measuring its performance impact\n   *               - \"clean\": Started when no profile is currently active\n   */\n  private _startNewProfile(name: string, force = false) {\n    this.#profileInProgress = { origin: name, crumbs: [] };\n    this.#profileStartTs = performance.now();\n    this.#longFramesCount = 0;\n    this.#longFramesTotalTime = 0;\n\n    // Add performance mark for debugging in dev tools\n    if (typeof performance !== 'undefined' && performance.mark) {\n      const markName = `Dashboard Profile Start: ${name}`;\n      performance.mark(markName);\n    }\n\n    // Log profile start in structured format\n    writeSceneLogStyled(\n      'SceneRenderProfiler',\n      `Profile started[${force ? 'forced' : 'clean'}]`,\n      'color: #FFCC00; font-weight: bold;'\n    );\n    writeSceneLog('', `  ├─ Origin: ${this.#profileInProgress?.origin || 'unknown'}`);\n    writeSceneLog('', `  └─ Timestamp: ${this.#profileStartTs.toFixed(1)}ms`);\n\n    // Start long frame detection with callback\n    this.#longFrameDetector.start((event: LongFrameEvent) => {\n      // Only record long frames during active profiling\n      if (!this.#profileInProgress || !this.#profileStartTs) {\n        return;\n      }\n\n      // Only record frames that occur after profile started\n      if (event.timestamp < this.#profileStartTs) {\n        return;\n      }\n\n      this.#longFramesCount++;\n      this.#longFramesTotalTime += event.duration;\n    });\n  }\n\n  private recordProfileTail(measurementStartTime: number, profileStartTs: number) {\n    this.#trailAnimationFrameId = requestAnimationFrame(() =>\n      this.measureTrailingFrames(measurementStartTime, measurementStartTime, profileStartTs)\n    );\n  }\n\n  private measureTrailingFrames = (measurementStartTs: number, lastFrameTime: number, profileStartTs: number) => {\n    const currentFrameTime = performance.now();\n    const frameLength = currentFrameTime - lastFrameTime;\n\n    // Fallback: Detect if tab was inactive (frame longer than reasonable threshold)\n    // This serves as backup to Page Visibility API in case the event wasn't triggered\n    if (frameLength > TAB_INACTIVE_THRESHOLD) {\n      writeSceneLog('SceneRenderProfiler', 'Tab was inactive, cancelling profile measurement');\n      this.cancelProfile();\n      return;\n    }\n\n    this.#recordedTrailingSpans.push(frameLength);\n\n    if (currentFrameTime - measurementStartTs! < POST_STORM_WINDOW) {\n      if (this.#profileInProgress) {\n        this.#trailAnimationFrameId = requestAnimationFrame(() =>\n          this.measureTrailingFrames(measurementStartTs, currentFrameTime, profileStartTs)\n        );\n      }\n    } else {\n      const slowFrames = processRecordedSpans(this.#recordedTrailingSpans);\n      const slowFramesTime = slowFrames.reduce((acc, val) => acc + val, 0);\n\n      // Log tail recording in structured format\n      writeSceneLog(\n        'SceneRenderProfiler',\n        `Profile tail recorded - Slow frames: ${slowFramesTime.toFixed(1)}ms (${slowFrames.length} frames)`\n      );\n      writeSceneLog('', `  ├─ Origin: ${this.#profileInProgress?.origin || 'unknown'}`);\n      writeSceneLog('', `  └─ Crumbs:`, this.#profileInProgress?.crumbs || []);\n\n      this.#recordedTrailingSpans = [];\n\n      const profileDuration = measurementStartTs - profileStartTs;\n\n      // Add performance marks for debugging in dev tools\n      if (typeof performance !== 'undefined' && performance.mark) {\n        const profileName = this.#profileInProgress?.origin || 'unknown';\n        const totalTime = profileDuration + slowFramesTime;\n\n        // Mark profile completion\n        performance.mark(`Dashboard Profile End: ${profileName}`);\n\n        // Add measure from start to end if possible\n        const startMarkName = `Dashboard Profile Start: ${profileName}`;\n        try {\n          performance.measure(\n            `Dashboard Profile: ${profileName} (${totalTime.toFixed(1)}ms)`,\n            startMarkName,\n            `Dashboard Profile End: ${profileName}`\n          );\n        } catch {\n          // Start mark might not exist, create a simple end mark\n          performance.mark(`Dashboard Profile Complete: ${profileName} (${totalTime.toFixed(1)}ms)`);\n        }\n\n        // Add measurements for slow frame details if significant\n        if (slowFrames.length > 0) {\n          const slowFramesMarkName = `Slow Frames Summary: ${slowFrames.length} frames (${slowFramesTime.toFixed(\n            1\n          )}ms)`;\n          performance.mark(slowFramesMarkName);\n\n          // Create individual measurements for each slow frame during tail\n          slowFrames.forEach((frameTime, index) => {\n            if (frameTime > 16) {\n              // Only measure frames slower than 16ms (60fps)\n              try {\n                const frameStartTime =\n                  this.#profileStartTs! +\n                  profileDuration +\n                  (index > 0 ? slowFrames.slice(0, index).reduce((sum, t) => sum + t, 0) : 0);\n                const frameId = `slow-frame-${index}`;\n                const frameStartMark = `${frameId}-start`;\n                const frameEndMark = `${frameId}-end`;\n\n                performance.mark(frameStartMark, { startTime: frameStartTime });\n                performance.mark(frameEndMark, { startTime: frameStartTime + frameTime });\n                performance.measure(`Slow Frame ${index + 1}: ${frameTime.toFixed(1)}ms`, frameStartMark, frameEndMark);\n              } catch {\n                // Fallback if startTime not supported\n                performance.mark(`Slow Frame ${index + 1}: ${frameTime.toFixed(1)}ms`);\n              }\n            }\n          });\n        }\n      }\n\n      // Log performance summary in a structured format\n      const completionTimestamp = performance.now();\n      writeSceneLog('SceneRenderProfiler', 'Profile completed');\n      writeSceneLog('', `  ├─ Timestamp: ${completionTimestamp.toFixed(1)}ms`);\n      writeSceneLog('', `  ├─ Total time: ${(profileDuration + slowFramesTime).toFixed(1)}ms`);\n      writeSceneLog('', `  ├─ Slow frames: ${slowFramesTime}ms (${slowFrames.length} frames)`);\n      writeSceneLog('', `  └─ Long frames: ${this.#longFramesTotalTime}ms (${this.#longFramesCount} frames)`);\n\n      // Stop long frame detection now that the profile is complete\n      this.#longFrameDetector.stop();\n      writeSceneLogStyled(\n        'SceneRenderProfiler',\n        `Stopped long frame detection - profile complete at ${completionTimestamp.toFixed(1)}ms`,\n        'color: #00CC00; font-weight: bold;'\n      );\n\n      this.#trailAnimationFrameId = null;\n\n      const profileEndTs = profileStartTs + profileDuration + slowFramesTime;\n\n      // Guard against race condition where profile might be cancelled during execution\n      if (!this.#profileInProgress) {\n        return;\n      }\n\n      performance.measure(`DashboardInteraction ${this.#profileInProgress.origin}`, {\n        start: profileStartTs,\n        end: profileEndTs,\n      });\n\n      const networkDuration = captureNetwork(profileStartTs, profileEndTs);\n\n      if (this.queryController?.state.onProfileComplete && this.#profileInProgress) {\n        this.queryController.state.onProfileComplete({\n          origin: this.#profileInProgress.origin,\n          crumbs: this.#profileInProgress.crumbs,\n          duration: profileDuration + slowFramesTime,\n          networkDuration,\n          startTs: profileStartTs,\n          endTs: profileEndTs,\n          longFramesCount: this.#longFramesCount,\n          longFramesTotalTime: this.#longFramesTotalTime,\n          // @ts-ignore\n          jsHeapSizeLimit: performance.memory ? performance.memory.jsHeapSizeLimit : 0,\n          // @ts-ignore\n          usedJSHeapSize: performance.memory ? performance.memory.usedJSHeapSize : 0,\n          // @ts-ignore\n          totalJSHeapSize: performance.memory ? performance.memory.totalJSHeapSize : 0,\n        });\n\n        this.#profileInProgress = null;\n        this.#trailAnimationFrameId = null;\n      }\n      // @ts-ignore\n      if (window.__runs) {\n        // @ts-ignore\n        window.__runs += `${Date.now()}, ${profileDuration + slowFramesTime}\\n`;\n      } else {\n        // @ts-ignore\n        window.__runs = `${Date.now()}, ${profileDuration + slowFramesTime}\\n`;\n      }\n    }\n  };\n\n  public tryCompletingProfile() {\n    writeSceneLog('SceneRenderProfiler', 'Trying to complete profile', this.#profileInProgress);\n    if (this.queryController?.runningQueriesCount() === 0 && this.#profileInProgress) {\n      writeSceneLog('SceneRenderProfiler', 'All queries completed, starting tail measurement');\n      // Note: Long frame detector continues running during tail measurement\n      // It will be stopped when the profile completely finishes\n      this.recordProfileTail(performance.now(), this.#profileStartTs!);\n    }\n  }\n\n  public isTailRecording() {\n    return Boolean(this.#trailAnimationFrameId);\n  }\n\n  public cancelTailRecording() {\n    if (this.#trailAnimationFrameId) {\n      cancelAnimationFrame(this.#trailAnimationFrameId);\n      this.#trailAnimationFrameId = null;\n      writeSceneLog('SceneRenderProfiler', 'Cancelled recording frames, new profile started');\n    }\n  }\n\n  // cancel profile\n  public cancelProfile() {\n    if (this.#profileInProgress) {\n      writeSceneLog('SceneRenderProfiler', 'Cancelling profile', this.#profileInProgress);\n      this.#profileInProgress = null;\n      // Cancel any pending animation frame to prevent accessing null profileInProgress\n      if (this.#trailAnimationFrameId) {\n        cancelAnimationFrame(this.#trailAnimationFrameId);\n        this.#trailAnimationFrameId = null;\n      }\n      // Stop long frame tracking\n      this.#longFrameDetector.stop();\n      writeSceneLog('SceneRenderProfiler', 'Stopped long frame detection - profile cancelled');\n      // Reset recorded spans to ensure complete cleanup\n      this.#recordedTrailingSpans = [];\n      this.#longFramesCount = 0;\n      this.#longFramesTotalTime = 0;\n    }\n  }\n\n  public addCrumb(crumb: string) {\n    if (this.#profileInProgress) {\n      writeSceneLog('SceneRenderProfiler', 'Adding crumb:', crumb);\n      this.#profileInProgress.crumbs.push(crumb);\n    }\n  }\n}\n\nexport function processRecordedSpans(spans: number[]) {\n  // identify last span in spans that's bigger than default threshold\n  for (let i = spans.length - 1; i >= 0; i--) {\n    if (spans[i] > DEFAULT_LONG_FRAME_THRESHOLD) {\n      return spans.slice(0, i + 1);\n    }\n  }\n  return [spans[0]];\n}\n\nexport function captureNetwork(startTs: number, endTs: number) {\n  const entries = performance.getEntriesByType('resource') as PerformanceResourceTiming[];\n  performance.clearResourceTimings();\n  // Only include network entries that both started AND ended within the time window\n  const networkEntries = entries.filter(\n    (entry) =>\n      entry.startTime >= startTs &&\n      entry.startTime <= endTs &&\n      entry.responseEnd >= startTs &&\n      entry.responseEnd <= endTs\n  );\n  for (const entry of networkEntries) {\n    performance.measure('Network entry ' + entry.name, {\n      start: entry.startTime,\n      end: entry.responseEnd,\n    });\n  }\n\n  return calculateNetworkTime(networkEntries);\n}\n\n// Will calculate total time spent on Network\nexport function calculateNetworkTime(requests: PerformanceResourceTiming[]): number {\n  if (requests.length === 0) {\n    return 0;\n  }\n\n  // Step 1: Sort the requests by startTs\n  requests.sort((a, b) => a.startTime - b.startTime);\n\n  // Step 2: Initialize variables\n  let totalNetworkTime = 0;\n  let currentStart = requests[0].startTime;\n  let currentEnd = requests[0].responseEnd;\n\n  // Step 3: Iterate through the sorted list and merge overlapping intervals\n  for (let i = 1; i < requests.length; i++) {\n    if (requests[i].startTime <= currentEnd) {\n      // Overlapping intervals, merge them\n      currentEnd = Math.max(currentEnd, requests[i].responseEnd);\n    } else {\n      // Non-overlapping interval, add the duration to total time\n      totalNetworkTime += currentEnd - currentStart;\n\n      // Update current interval\n      currentStart = requests[i].startTime;\n      currentEnd = requests[i].responseEnd;\n    }\n  }\n\n  // Step 4: Add the last interval\n  totalNetworkTime += currentEnd - currentStart;\n\n  return totalNetworkTime;\n}\n\nexport const REFRESH_INTERACTION = 'refresh';\nexport const TIME_RANGE_CHANGE_INTERACTION = 'time_range_change';\nexport const FILTER_ADDED_INTERACTION = 'filter_added';\nexport const FILTER_REMOVED_INTERACTION = 'filter_removed';\nexport const FILTER_CHANGED_INTERACTION = 'filter_changed';\nexport const FILTER_RESTORED_INTERACTION = 'filter_restored';\nexport const VARIABLE_VALUE_CHANGED_INTERACTION = 'variable_value_changed';\nexport const SCOPES_CHANGED_INTERACTION = 'scopes_changed';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SceneRenderProfiler.js","sources":["../../../src/behaviors/SceneRenderProfiler.ts"],"sourcesContent":["import { writeSceneLog } from '../utils/writeSceneLog';\nimport { SceneQueryControllerLike } from './types';\n\nconst POST_STORM_WINDOW = 2000; // Time after last query to observe slow frames\nconst SPAN_THRESHOLD = 30; // Frames longer than this will be considered slow\nconst TAB_INACTIVE_THRESHOLD = 1000; // Tab inactive threshold in ms\n\nexport class SceneRenderProfiler {\n  #profileInProgress: {\n    // Profile origin, i.e. scene refresh picker\n    origin: string;\n    crumbs: string[];\n  } | null = null;\n\n  #profileStartTs: number | null = null;\n  #trailAnimationFrameId: number | null = null;\n\n  // Will keep measured lengths trailing frames\n  #recordedTrailingSpans: number[] = [];\n\n  #visibilityChangeHandler: (() => void) | null = null;\n\n  public constructor(private queryController?: SceneQueryControllerLike) {\n    this.setupVisibilityChangeHandler();\n  }\n\n  public setQueryController(queryController: SceneQueryControllerLike) {\n    this.queryController = queryController;\n  }\n\n  private setupVisibilityChangeHandler() {\n    // Ensure event listener is only added once\n    if (this.#visibilityChangeHandler) {\n      return;\n    }\n\n    // Handle tab switching with Page Visibility API\n    this.#visibilityChangeHandler = () => {\n      if (document.hidden && this.#profileInProgress) {\n        writeSceneLog('SceneRenderProfiler', 'Tab became inactive, cancelling profile');\n        this.cancelProfile();\n      }\n    };\n\n    if (typeof document !== 'undefined') {\n      document.addEventListener('visibilitychange', this.#visibilityChangeHandler);\n    }\n  }\n\n  public cleanup() {\n    // Remove event listener to prevent memory leaks\n    if (this.#visibilityChangeHandler && typeof document !== 'undefined') {\n      document.removeEventListener('visibilitychange', this.#visibilityChangeHandler);\n      this.#visibilityChangeHandler = null;\n    }\n\n    // Cancel any ongoing profiling\n    this.cancelProfile();\n  }\n\n  public startProfile(name: string) {\n    // Only start profile if tab is active. This makes sure we don't start a profile when i.e. someone opens a dashboard in a new tab\n    // and doesn't interact with it.\n    if (document.hidden) {\n      writeSceneLog('SceneRenderProfiler', 'Tab is inactive, skipping profile', name);\n      return;\n    }\n\n    if (this.#profileInProgress) {\n      if (this.#trailAnimationFrameId) {\n        this.cancelProfile();\n        this._startNewProfile(name, true);\n      } else {\n        this.addCrumb(name);\n      }\n    } else {\n      this._startNewProfile(name);\n    }\n  }\n\n  /**\n   * Starts a new profile for performance measurement.\n   *\n   * @param name - The origin/trigger of the profile (e.g., 'time_range_change', 'variable_value_changed')\n   * @param force - Whether this is a \"forced\" profile (true) or \"clean\" profile (false)\n   *               - \"forced\": Started by canceling an existing profile that was recording trailing frames\n   *                           This happens when a new user interaction occurs before the previous one\n   *                           finished measuring its performance impact\n   *               - \"clean\": Started when no profile is currently active\n   */\n  private _startNewProfile(name: string, force = false) {\n    this.#profileInProgress = { origin: name, crumbs: [] };\n    this.#profileStartTs = performance.now();\n    writeSceneLog(\n      'SceneRenderProfiler',\n      `Profile started[${force ? 'forced' : 'clean'}]`,\n      this.#profileInProgress,\n      this.#profileStartTs\n    );\n  }\n\n  private recordProfileTail(measurementStartTime: number, profileStartTs: number) {\n    this.#trailAnimationFrameId = requestAnimationFrame(() =>\n      this.measureTrailingFrames(measurementStartTime, measurementStartTime, profileStartTs)\n    );\n  }\n\n  private measureTrailingFrames = (measurementStartTs: number, lastFrameTime: number, profileStartTs: number) => {\n    const currentFrameTime = performance.now();\n    const frameLength = currentFrameTime - lastFrameTime;\n\n    // Fallback: Detect if tab was inactive (frame longer than reasonable threshold)\n    // This serves as backup to Page Visibility API in case the event wasn't triggered\n    if (frameLength > TAB_INACTIVE_THRESHOLD) {\n      writeSceneLog('SceneRenderProfiler', 'Tab was inactive, cancelling profile measurement');\n      this.cancelProfile();\n      return;\n    }\n\n    this.#recordedTrailingSpans.push(frameLength);\n\n    if (currentFrameTime - measurementStartTs! < POST_STORM_WINDOW) {\n      if (this.#profileInProgress) {\n        this.#trailAnimationFrameId = requestAnimationFrame(() =>\n          this.measureTrailingFrames(measurementStartTs, currentFrameTime, profileStartTs)\n        );\n      }\n    } else {\n      const slowFrames = processRecordedSpans(this.#recordedTrailingSpans);\n      const slowFramesTime = slowFrames.reduce((acc, val) => acc + val, 0);\n\n      writeSceneLog(\n        this.constructor.name,\n        'Profile tail recorded, slow frames duration:',\n        slowFramesTime,\n        slowFrames,\n        this.#profileInProgress\n      );\n\n      this.#recordedTrailingSpans = [];\n\n      const profileDuration = measurementStartTs - profileStartTs;\n\n      writeSceneLog(\n        this.constructor.name,\n        'Stoped recording, total measured time (network included):',\n        profileDuration + slowFramesTime\n      );\n      this.#trailAnimationFrameId = null;\n\n      const profileEndTs = profileStartTs + profileDuration + slowFramesTime;\n\n      // Guard against race condition where profile might be cancelled during execution\n      if (!this.#profileInProgress) {\n        return;\n      }\n\n      performance.measure(`DashboardInteraction ${this.#profileInProgress.origin}`, {\n        start: profileStartTs,\n        end: profileEndTs,\n      });\n\n      const networkDuration = captureNetwork(profileStartTs, profileEndTs);\n\n      if (this.queryController?.state.onProfileComplete && this.#profileInProgress) {\n        this.queryController.state.onProfileComplete({\n          origin: this.#profileInProgress.origin,\n          crumbs: this.#profileInProgress.crumbs,\n          duration: profileDuration + slowFramesTime,\n          networkDuration,\n          startTs: profileStartTs,\n          endTs: profileEndTs,\n          // @ts-ignore\n          jsHeapSizeLimit: performance.memory ? performance.memory.jsHeapSizeLimit : 0,\n          // @ts-ignore\n          usedJSHeapSize: performance.memory ? performance.memory.usedJSHeapSize : 0,\n          // @ts-ignore\n          totalJSHeapSize: performance.memory ? performance.memory.totalJSHeapSize : 0,\n        });\n\n        this.#profileInProgress = null;\n        this.#trailAnimationFrameId = null;\n      }\n      // @ts-ignore\n      if (window.__runs) {\n        // @ts-ignore\n        window.__runs += `${Date.now()}, ${profileDuration + slowFramesTime}\\n`;\n      } else {\n        // @ts-ignore\n        window.__runs = `${Date.now()}, ${profileDuration + slowFramesTime}\\n`;\n      }\n    }\n  };\n\n  public tryCompletingProfile() {\n    writeSceneLog('SceneRenderProfiler', 'Trying to complete profile', this.#profileInProgress);\n    if (this.queryController?.runningQueriesCount() === 0 && this.#profileInProgress) {\n      writeSceneLog('SceneRenderProfiler', 'All queries completed, stopping profile');\n      this.recordProfileTail(performance.now(), this.#profileStartTs!);\n    }\n  }\n\n  public isTailRecording() {\n    return Boolean(this.#trailAnimationFrameId);\n  }\n\n  public cancelTailRecording() {\n    if (this.#trailAnimationFrameId) {\n      cancelAnimationFrame(this.#trailAnimationFrameId);\n      this.#trailAnimationFrameId = null;\n      writeSceneLog('SceneRenderProfiler', 'Cancelled recording frames, new profile started');\n    }\n  }\n\n  // cancel profile\n  public cancelProfile() {\n    if (this.#profileInProgress) {\n      writeSceneLog('SceneRenderProfiler', 'Cancelling profile', this.#profileInProgress);\n      this.#profileInProgress = null;\n      // Cancel any pending animation frame to prevent accessing null profileInProgress\n      if (this.#trailAnimationFrameId) {\n        cancelAnimationFrame(this.#trailAnimationFrameId);\n        this.#trailAnimationFrameId = null;\n      }\n      // Reset recorded spans to ensure complete cleanup\n      this.#recordedTrailingSpans = [];\n    }\n  }\n\n  public addCrumb(crumb: string) {\n    if (this.#profileInProgress) {\n      writeSceneLog('SceneRenderProfiler', 'Adding crumb:', crumb);\n      this.#profileInProgress.crumbs.push(crumb);\n    }\n  }\n}\n\nexport function processRecordedSpans(spans: number[]) {\n  // identify last span in spans that's bigger than SPAN_THRESHOLD\n  for (let i = spans.length - 1; i >= 0; i--) {\n    if (spans[i] > SPAN_THRESHOLD) {\n      return spans.slice(0, i + 1);\n    }\n  }\n  return [spans[0]];\n}\n\nexport function captureNetwork(startTs: number, endTs: number) {\n  const entries = performance.getEntriesByType('resource') as PerformanceResourceTiming[];\n  performance.clearResourceTimings();\n  // Only include network entries that both started AND ended within the time window\n  const networkEntries = entries.filter(\n    (entry) =>\n      entry.startTime >= startTs &&\n      entry.startTime <= endTs &&\n      entry.responseEnd >= startTs &&\n      entry.responseEnd <= endTs\n  );\n  for (const entry of networkEntries) {\n    performance.measure('Network entry ' + entry.name, {\n      start: entry.startTime,\n      end: entry.responseEnd,\n    });\n  }\n\n  return calculateNetworkTime(networkEntries);\n}\n\n// Will calculate total time spent on Network\nexport function calculateNetworkTime(requests: PerformanceResourceTiming[]): number {\n  if (requests.length === 0) {\n    return 0;\n  }\n\n  // Step 1: Sort the requests by startTs\n  requests.sort((a, b) => a.startTime - b.startTime);\n\n  // Step 2: Initialize variables\n  let totalNetworkTime = 0;\n  let currentStart = requests[0].startTime;\n  let currentEnd = requests[0].responseEnd;\n\n  // Step 3: Iterate through the sorted list and merge overlapping intervals\n  for (let i = 1; i < requests.length; i++) {\n    if (requests[i].startTime <= currentEnd) {\n      // Overlapping intervals, merge them\n      currentEnd = Math.max(currentEnd, requests[i].responseEnd);\n    } else {\n      // Non-overlapping interval, add the duration to total time\n      totalNetworkTime += currentEnd - currentStart;\n\n      // Update current interval\n      currentStart = requests[i].startTime;\n      currentEnd = requests[i].responseEnd;\n    }\n  }\n\n  // Step 4: Add the last interval\n  totalNetworkTime += currentEnd - currentStart;\n\n  return totalNetworkTime;\n}\n\nexport const REFRESH_INTERACTION = 'refresh';\nexport const TIME_RANGE_CHANGE_INTERACTION = 'time_range_change';\nexport const FILTER_ADDED_INTERACTION = 'filter_added';\nexport const FILTER_REMOVED_INTERACTION = 'filter_removed';\nexport const FILTER_CHANGED_INTERACTION = 'filter_changed';\nexport const FILTER_RESTORED_INTERACTION = 'filter_restored';\nexport const VARIABLE_VALUE_CHANGED_INTERACTION = 'variable_value_changed';\nexport const SCOPES_CHANGED_INTERACTION = 'scopes_changed';\n"],"names":[],"mappings":"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"}

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

@@ -1,5 +1,5 @@
 import { Trans } from '@grafana/i18n';
-import React, { useMemo, useCallback } from 'react';
+import React, { useMemo, useCallback, useEffect } from 'react';
 import { useMeasure } from 'react-use';
 import { SetPanelAttentionEvent, AlertState, PluginContextProvider } from '@grafana/data';
 import { getAppEvents } from '@grafana/runtime';
@@ -9,6 +9,7 @@ import { isSceneObject } from '../../core/types.js';
 import { css, cx } from '@emotion/css';
 import { debounce } from 'lodash';
 import { VizPanelSeriesLimit } from './VizPanelSeriesLimit.js';
+import { useLazyLoaderIsInView } from '../layout/LazyLoader.js';
 
 function VizPanelRenderer({ model }) {
   var _a;
@@ -52,6 +53,12 @@ function VizPanelRenderer({ model }) {
   const sceneTimeRange = sceneGraph.getTimeRange(model);
   const timeZone = sceneTimeRange.getTimeZone();
   const timeRange = model.getTimeRange(dataWithFieldConfig);
+  const isInView = useLazyLoaderIsInView();
+  useEffect(() => {
+    if (dataObject.isInViewChanged) {
+      dataObject.isInViewChanged(isInView);
+    }
+  }, [isInView, dataObject]);
   const titleInterpolated = model.interpolate(title, void 0, "text");
   const alertStateStyles = useStyles2(getAlertStateStyles);
   if (!plugin) {

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

@@ -1 +1 @@
-{"version":3,"file":"VizPanelRenderer.js","sources":["../../../../src/components/VizPanel/VizPanelRenderer.tsx"],"sourcesContent":["import { Trans } from '@grafana/i18n';\nimport React, { RefCallback, useCallback, useMemo } from 'react';\nimport { useMeasure } from 'react-use';\n\n// @ts-ignore\nimport { AlertState, GrafanaTheme2, PanelData, PluginContextProvider, SetPanelAttentionEvent } from '@grafana/data';\n\nimport { getAppEvents } from '@grafana/runtime';\nimport { PanelChrome, ErrorBoundaryAlert, PanelContextProvider, Tooltip, useStyles2, Icon } from '@grafana/ui';\n\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { isSceneObject, SceneComponentProps, SceneLayout, SceneObject } from '../../core/types';\n\nimport { VizPanel } from './VizPanel';\nimport { css, cx } from '@emotion/css';\nimport { debounce } from 'lodash';\nimport { VizPanelSeriesLimit } from './VizPanelSeriesLimit';\n\nexport function VizPanelRenderer({ model }: SceneComponentProps<VizPanel>) {\n  const {\n    title,\n    options,\n    fieldConfig,\n    _pluginLoadError,\n    displayMode,\n    hoverHeader,\n    showMenuAlways,\n    hoverHeaderOffset,\n    menu,\n    headerActions,\n    titleItems,\n    seriesLimit,\n    seriesLimitShowAll,\n    description,\n    collapsible,\n    collapsed,\n    _renderCounter = 0,\n  } = model.useState();\n  const [ref, { width, height }] = useMeasure();\n  const appEvents = useMemo(() => getAppEvents(), []);\n\n  const setPanelAttention = useCallback(() => {\n    if (model.state.key) {\n      appEvents.publish(new SetPanelAttentionEvent({ panelId: model.getPathId() }));\n    }\n  }, [model, appEvents]);\n\n  const debouncedMouseMove = useMemo(\n    () => debounce(setPanelAttention, 100, { leading: true, trailing: false }),\n    [setPanelAttention]\n  );\n\n  const plugin = model.getPlugin();\n\n  const { dragClass, dragClassCancel } = getDragClasses(model);\n  const dragHooks = getDragHooks(model);\n  const dataObject = sceneGraph.getData(model);\n\n  const rawData = dataObject.useState();\n  const dataWithSeriesLimit = useDataWithSeriesLimit(rawData.data, seriesLimit, seriesLimitShowAll);\n  const dataWithFieldConfig = model.applyFieldConfig(dataWithSeriesLimit);\n  const sceneTimeRange = sceneGraph.getTimeRange(model);\n  const timeZone = sceneTimeRange.getTimeZone();\n  const timeRange = model.getTimeRange(dataWithFieldConfig);\n\n  // Interpolate title\n  const titleInterpolated = model.interpolate(title, undefined, 'text');\n\n  const alertStateStyles = useStyles2(getAlertStateStyles);\n\n  if (!plugin) {\n    return (\n      <div>\n        <Trans i18nKey=\"grafana-scenes.components.viz-panel-renderer.loading-plugin-panel\">\n          Loading plugin panel...\n        </Trans>\n      </div>\n    );\n  }\n\n  if (!plugin.panel) {\n    return (\n      <div>\n        <Trans i18nKey=\"grafana-scenes.components.viz-panel-renderer.panel-plugin-has-no-panel-component\">\n          Panel plugin has no panel component\n        </Trans>\n      </div>\n    );\n  }\n\n  const PanelComponent = plugin.panel;\n\n  // If we have a query runner on our level inform it of the container width (used to set auto max data points)\n  if (dataObject && dataObject.setContainerWidth) {\n    dataObject.setContainerWidth(Math.round(width));\n  }\n\n  let titleItemsElement: React.ReactNode[] = [];\n\n  if (titleItems) {\n    if (Array.isArray(titleItems)) {\n      titleItemsElement = titleItemsElement.concat(\n        titleItems.map((titleItem) => {\n          return <titleItem.Component model={titleItem} key={`${titleItem.state.key}`} />;\n        })\n      );\n    } else if (isSceneObject(titleItems)) {\n      titleItemsElement.push(<titleItems.Component model={titleItems} />);\n    } else {\n      titleItemsElement.push(titleItems);\n    }\n  }\n\n  if (seriesLimit) {\n    titleItemsElement.push(\n      <VizPanelSeriesLimit\n        key=\"series-limit\"\n        data={rawData.data}\n        seriesLimit={seriesLimit}\n        showAll={seriesLimitShowAll}\n        onShowAllSeries={() => model.setState({ seriesLimitShowAll: !seriesLimitShowAll })}\n      />\n    );\n  }\n\n  // If we have local time range show that in panel header\n  if (model.state.$timeRange) {\n    titleItemsElement.push(<model.state.$timeRange.Component model={model.state.$timeRange} key={model.state.key} />);\n  }\n\n  if (dataWithFieldConfig.alertState) {\n    titleItemsElement.push(\n      <Tooltip content={dataWithFieldConfig.alertState.state ?? 'unknown'} key={`alert-states-icon-${model.state.key}`}>\n        <PanelChrome.TitleItem\n          className={cx({\n            [alertStateStyles.ok]: dataWithFieldConfig.alertState.state === AlertState.OK,\n            [alertStateStyles.pending]: dataWithFieldConfig.alertState.state === AlertState.Pending,\n            [alertStateStyles.alerting]: dataWithFieldConfig.alertState.state === AlertState.Alerting,\n          })}\n        >\n          <Icon\n            name={dataWithFieldConfig.alertState.state === 'alerting' ? 'heart-break' : 'heart'}\n            className=\"panel-alert-icon\"\n            size=\"md\"\n          />\n        </PanelChrome.TitleItem>\n      </Tooltip>\n    );\n  }\n\n  let panelMenu;\n  if (menu) {\n    panelMenu = <menu.Component model={menu} />;\n  }\n\n  let actionsElement: React.ReactNode | undefined;\n\n  if (headerActions) {\n    if (Array.isArray(headerActions)) {\n      actionsElement = (\n        <>\n          {headerActions.map((action) => {\n            return <action.Component model={action} key={`${action.state.key}`} />;\n          })}\n        </>\n      );\n    } else if (isSceneObject(headerActions)) {\n      actionsElement = <headerActions.Component model={headerActions} />;\n    } else {\n      actionsElement = headerActions;\n    }\n  }\n\n  // Data is always returned. For non-data panels, empty PanelData is returned.\n  const data = dataWithFieldConfig!;\n\n  const isReadyToRender = dataObject.isDataReadyToDisplay ? dataObject.isDataReadyToDisplay() : true;\n\n  const context = model.getPanelContext();\n  const panelId = model.getLegacyPanelId();\n\n  return (\n    <div className={relativeWrapper}>\n      <div ref={ref as RefCallback<HTMLDivElement>} className={absoluteWrapper} data-viz-panel-key={model.state.key}>\n        {width > 0 && height > 0 && (\n          // @ts-expect-error showMenuAlways remove when updating to @grafana/ui@12 fixed in https://github.com/grafana/grafana/pull/103553\n          <PanelChrome\n            title={titleInterpolated}\n            description={description?.trim() ? model.getDescription : undefined}\n            loadingState={data.state}\n            statusMessage={getChromeStatusMessage(data, _pluginLoadError)}\n            statusMessageOnClick={model.onStatusMessageClick}\n            width={width}\n            height={height}\n            selectionId={model.state.key}\n            displayMode={displayMode}\n            titleItems={titleItemsElement}\n            dragClass={dragClass}\n            actions={actionsElement}\n            dragClassCancel={dragClassCancel}\n            padding={plugin.noPadding ? 'none' : 'md'}\n            menu={panelMenu}\n            onCancelQuery={model.onCancelQuery}\n            onFocus={setPanelAttention}\n            onMouseEnter={setPanelAttention}\n            onMouseMove={debouncedMouseMove}\n            onDragStart={(e: React.PointerEvent) => {\n              dragHooks.onDragStart?.(e, model);\n            }}\n            showMenuAlways={showMenuAlways}\n            {...(collapsible\n              ? {\n                  collapsible: Boolean(collapsible),\n                  collapsed,\n                  onToggleCollapse: model.onToggleCollapse,\n                }\n              : { hoverHeader, hoverHeaderOffset })}\n          >\n            {(innerWidth, innerHeight) => (\n              <>\n                <ErrorBoundaryAlert dependencies={[plugin, data]}>\n                  <PluginContextProvider meta={plugin.meta}>\n                    <PanelContextProvider value={context}>\n                      {isReadyToRender && (\n                        <PanelComponent\n                          id={panelId}\n                          data={data}\n                          title={title}\n                          timeRange={timeRange}\n                          timeZone={timeZone}\n                          options={options}\n                          fieldConfig={fieldConfig}\n                          transparent={displayMode === 'transparent'}\n                          width={innerWidth}\n                          height={innerHeight}\n                          renderCounter={_renderCounter}\n                          replaceVariables={model.interpolate}\n                          onOptionsChange={model.onOptionsChange}\n                          onFieldConfigChange={model.onFieldConfigChange}\n                          onChangeTimeRange={model.onTimeRangeChange}\n                          eventBus={context.eventBus}\n                        />\n                      )}\n                    </PanelContextProvider>\n                  </PluginContextProvider>\n                </ErrorBoundaryAlert>\n              </>\n            )}\n          </PanelChrome>\n        )}\n      </div>\n    </div>\n  );\n}\n\nfunction useDataWithSeriesLimit(data: PanelData | undefined, seriesLimit?: number, showAllSeries?: boolean) {\n  return useMemo(() => {\n    if (!data?.series || !seriesLimit || showAllSeries) {\n      return data;\n    }\n\n    return {\n      ...data,\n      series: data.series.slice(0, seriesLimit),\n    };\n  }, [data, seriesLimit, showAllSeries]);\n}\n\nfunction getDragClasses(panel: VizPanel) {\n  const parentLayout = sceneGraph.getLayout(panel);\n  const isDraggable = parentLayout?.isDraggable();\n\n  if (!parentLayout || !isDraggable || itemDraggingDisabled(panel, parentLayout)) {\n    return { dragClass: '', dragClassCancel: '' };\n  }\n\n  return { dragClass: parentLayout.getDragClass?.(), dragClassCancel: parentLayout?.getDragClassCancel?.() };\n}\n\nfunction getDragHooks(panel: VizPanel) {\n  const parentLayout = sceneGraph.getLayout(panel);\n  return parentLayout?.getDragHooks?.() ?? {};\n}\n\n/**\n * Walks up the parent chain until it hits the layout object, trying to find the closest SceneGridItemLike ancestor.\n * It is not always the direct parent, because the VizPanel can be wrapped in other objects.\n */\nfunction itemDraggingDisabled(item: SceneObject, layout: SceneLayout) {\n  let obj: SceneObject | undefined = item;\n\n  while (obj && obj !== layout) {\n    if ('isDraggable' in obj.state && obj.state.isDraggable === false) {\n      return true;\n    }\n\n    if ('repeatSourceKey' in obj.state && obj.state.repeatSourceKey) {\n      return true;\n    }\n\n    obj = obj.parent;\n  }\n\n  return false;\n}\n\nfunction getChromeStatusMessage(data: PanelData, pluginLoadingError: string | undefined) {\n  if (pluginLoadingError) {\n    return pluginLoadingError;\n  }\n\n  let message = data.error ? data.error.message : undefined;\n\n  // Handling multiple errors with a single string until we integrate VizPanel with inspector\n  if (data.errors) {\n    message = data.errors.map((e) => e.message).join(', ');\n  }\n  return message;\n}\n\nconst relativeWrapper = css({\n  position: 'relative',\n  width: '100%',\n  height: '100%',\n});\n\n/**\n * Sadly this this absolute wrapper is needed for the panel to adopt smaller sizes.\n * The combo of useMeasure and PanelChrome makes the panel take up the width it get's but that makes it impossible to\n * Then adapt to smaller space (say resizing the browser window or undocking menu).\n */\nconst absoluteWrapper = css({\n  position: 'absolute',\n  width: '100%',\n  height: '100%',\n});\n\nconst getAlertStateStyles = (theme: GrafanaTheme2) => {\n  return {\n    ok: css({\n      color: theme.colors.success.text,\n    }),\n    pending: css({\n      color: theme.colors.warning.text,\n    }),\n    alerting: css({\n      color: theme.colors.error.text,\n    }),\n  };\n};\n"],"names":["_a"],"mappings":"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"}
+{"version":3,"file":"VizPanelRenderer.js","sources":["../../../../src/components/VizPanel/VizPanelRenderer.tsx"],"sourcesContent":["import { Trans } from '@grafana/i18n';\nimport React, { RefCallback, useCallback, useEffect, useMemo } from 'react';\nimport { useMeasure } from 'react-use';\n\n// @ts-ignore\nimport { AlertState, GrafanaTheme2, PanelData, PluginContextProvider, SetPanelAttentionEvent } from '@grafana/data';\n\nimport { getAppEvents } from '@grafana/runtime';\nimport { PanelChrome, ErrorBoundaryAlert, PanelContextProvider, Tooltip, useStyles2, Icon } from '@grafana/ui';\n\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { isSceneObject, SceneComponentProps, SceneLayout, SceneObject } from '../../core/types';\n\nimport { VizPanel } from './VizPanel';\nimport { css, cx } from '@emotion/css';\nimport { debounce } from 'lodash';\nimport { VizPanelSeriesLimit } from './VizPanelSeriesLimit';\nimport { useLazyLoaderIsInView } from '../layout/LazyLoader';\n\nexport function VizPanelRenderer({ model }: SceneComponentProps<VizPanel>) {\n  const {\n    title,\n    options,\n    fieldConfig,\n    _pluginLoadError,\n    displayMode,\n    hoverHeader,\n    showMenuAlways,\n    hoverHeaderOffset,\n    menu,\n    headerActions,\n    titleItems,\n    seriesLimit,\n    seriesLimitShowAll,\n    description,\n    collapsible,\n    collapsed,\n    _renderCounter = 0,\n  } = model.useState();\n  const [ref, { width, height }] = useMeasure();\n  const appEvents = useMemo(() => getAppEvents(), []);\n\n  const setPanelAttention = useCallback(() => {\n    if (model.state.key) {\n      appEvents.publish(new SetPanelAttentionEvent({ panelId: model.getPathId() }));\n    }\n  }, [model, appEvents]);\n\n  const debouncedMouseMove = useMemo(\n    () => debounce(setPanelAttention, 100, { leading: true, trailing: false }),\n    [setPanelAttention]\n  );\n\n  const plugin = model.getPlugin();\n\n  const { dragClass, dragClassCancel } = getDragClasses(model);\n  const dragHooks = getDragHooks(model);\n  const dataObject = sceneGraph.getData(model);\n\n  const rawData = dataObject.useState();\n  const dataWithSeriesLimit = useDataWithSeriesLimit(rawData.data, seriesLimit, seriesLimitShowAll);\n  const dataWithFieldConfig = model.applyFieldConfig(dataWithSeriesLimit);\n  const sceneTimeRange = sceneGraph.getTimeRange(model);\n  const timeZone = sceneTimeRange.getTimeZone();\n  const timeRange = model.getTimeRange(dataWithFieldConfig);\n\n  // Switch to manual query execution if the panel it outside viewport\n  const isInView = useLazyLoaderIsInView();\n  useEffect(() => {\n    if (dataObject.isInViewChanged) {\n      dataObject.isInViewChanged(isInView);\n    }\n  }, [isInView, dataObject]);\n\n  // Interpolate title\n  const titleInterpolated = model.interpolate(title, undefined, 'text');\n  const alertStateStyles = useStyles2(getAlertStateStyles);\n\n  if (!plugin) {\n    return (\n      <div>\n        <Trans i18nKey=\"grafana-scenes.components.viz-panel-renderer.loading-plugin-panel\">\n          Loading plugin panel...\n        </Trans>\n      </div>\n    );\n  }\n\n  if (!plugin.panel) {\n    return (\n      <div>\n        <Trans i18nKey=\"grafana-scenes.components.viz-panel-renderer.panel-plugin-has-no-panel-component\">\n          Panel plugin has no panel component\n        </Trans>\n      </div>\n    );\n  }\n\n  const PanelComponent = plugin.panel;\n\n  // If we have a query runner on our level inform it of the container width (used to set auto max data points)\n  if (dataObject && dataObject.setContainerWidth) {\n    dataObject.setContainerWidth(Math.round(width));\n  }\n\n  let titleItemsElement: React.ReactNode[] = [];\n\n  if (titleItems) {\n    if (Array.isArray(titleItems)) {\n      titleItemsElement = titleItemsElement.concat(\n        titleItems.map((titleItem) => {\n          return <titleItem.Component model={titleItem} key={`${titleItem.state.key}`} />;\n        })\n      );\n    } else if (isSceneObject(titleItems)) {\n      titleItemsElement.push(<titleItems.Component model={titleItems} />);\n    } else {\n      titleItemsElement.push(titleItems);\n    }\n  }\n\n  if (seriesLimit) {\n    titleItemsElement.push(\n      <VizPanelSeriesLimit\n        key=\"series-limit\"\n        data={rawData.data}\n        seriesLimit={seriesLimit}\n        showAll={seriesLimitShowAll}\n        onShowAllSeries={() => model.setState({ seriesLimitShowAll: !seriesLimitShowAll })}\n      />\n    );\n  }\n\n  // If we have local time range show that in panel header\n  if (model.state.$timeRange) {\n    titleItemsElement.push(<model.state.$timeRange.Component model={model.state.$timeRange} key={model.state.key} />);\n  }\n\n  if (dataWithFieldConfig.alertState) {\n    titleItemsElement.push(\n      <Tooltip content={dataWithFieldConfig.alertState.state ?? 'unknown'} key={`alert-states-icon-${model.state.key}`}>\n        <PanelChrome.TitleItem\n          className={cx({\n            [alertStateStyles.ok]: dataWithFieldConfig.alertState.state === AlertState.OK,\n            [alertStateStyles.pending]: dataWithFieldConfig.alertState.state === AlertState.Pending,\n            [alertStateStyles.alerting]: dataWithFieldConfig.alertState.state === AlertState.Alerting,\n          })}\n        >\n          <Icon\n            name={dataWithFieldConfig.alertState.state === 'alerting' ? 'heart-break' : 'heart'}\n            className=\"panel-alert-icon\"\n            size=\"md\"\n          />\n        </PanelChrome.TitleItem>\n      </Tooltip>\n    );\n  }\n\n  let panelMenu;\n  if (menu) {\n    panelMenu = <menu.Component model={menu} />;\n  }\n\n  let actionsElement: React.ReactNode | undefined;\n\n  if (headerActions) {\n    if (Array.isArray(headerActions)) {\n      actionsElement = (\n        <>\n          {headerActions.map((action) => {\n            return <action.Component model={action} key={`${action.state.key}`} />;\n          })}\n        </>\n      );\n    } else if (isSceneObject(headerActions)) {\n      actionsElement = <headerActions.Component model={headerActions} />;\n    } else {\n      actionsElement = headerActions;\n    }\n  }\n\n  // Data is always returned. For non-data panels, empty PanelData is returned.\n  const data = dataWithFieldConfig!;\n\n  const isReadyToRender = dataObject.isDataReadyToDisplay ? dataObject.isDataReadyToDisplay() : true;\n\n  const context = model.getPanelContext();\n  const panelId = model.getLegacyPanelId();\n\n  return (\n    <div className={relativeWrapper}>\n      <div ref={ref as RefCallback<HTMLDivElement>} className={absoluteWrapper} data-viz-panel-key={model.state.key}>\n        {width > 0 && height > 0 && (\n          // @ts-expect-error showMenuAlways remove when updating to @grafana/ui@12 fixed in https://github.com/grafana/grafana/pull/103553\n          <PanelChrome\n            title={titleInterpolated}\n            description={description?.trim() ? model.getDescription : undefined}\n            loadingState={data.state}\n            statusMessage={getChromeStatusMessage(data, _pluginLoadError)}\n            statusMessageOnClick={model.onStatusMessageClick}\n            width={width}\n            height={height}\n            selectionId={model.state.key}\n            displayMode={displayMode}\n            titleItems={titleItemsElement}\n            dragClass={dragClass}\n            actions={actionsElement}\n            dragClassCancel={dragClassCancel}\n            padding={plugin.noPadding ? 'none' : 'md'}\n            menu={panelMenu}\n            onCancelQuery={model.onCancelQuery}\n            onFocus={setPanelAttention}\n            onMouseEnter={setPanelAttention}\n            onMouseMove={debouncedMouseMove}\n            onDragStart={(e: React.PointerEvent) => {\n              dragHooks.onDragStart?.(e, model);\n            }}\n            showMenuAlways={showMenuAlways}\n            {...(collapsible\n              ? {\n                  collapsible: Boolean(collapsible),\n                  collapsed,\n                  onToggleCollapse: model.onToggleCollapse,\n                }\n              : { hoverHeader, hoverHeaderOffset })}\n          >\n            {(innerWidth, innerHeight) => (\n              <>\n                <ErrorBoundaryAlert dependencies={[plugin, data]}>\n                  <PluginContextProvider meta={plugin.meta}>\n                    <PanelContextProvider value={context}>\n                      {isReadyToRender && (\n                        <PanelComponent\n                          id={panelId}\n                          data={data}\n                          title={title}\n                          timeRange={timeRange}\n                          timeZone={timeZone}\n                          options={options}\n                          fieldConfig={fieldConfig}\n                          transparent={displayMode === 'transparent'}\n                          width={innerWidth}\n                          height={innerHeight}\n                          renderCounter={_renderCounter}\n                          replaceVariables={model.interpolate}\n                          onOptionsChange={model.onOptionsChange}\n                          onFieldConfigChange={model.onFieldConfigChange}\n                          onChangeTimeRange={model.onTimeRangeChange}\n                          eventBus={context.eventBus}\n                        />\n                      )}\n                    </PanelContextProvider>\n                  </PluginContextProvider>\n                </ErrorBoundaryAlert>\n              </>\n            )}\n          </PanelChrome>\n        )}\n      </div>\n    </div>\n  );\n}\n\nfunction useDataWithSeriesLimit(data: PanelData | undefined, seriesLimit?: number, showAllSeries?: boolean) {\n  return useMemo(() => {\n    if (!data?.series || !seriesLimit || showAllSeries) {\n      return data;\n    }\n\n    return {\n      ...data,\n      series: data.series.slice(0, seriesLimit),\n    };\n  }, [data, seriesLimit, showAllSeries]);\n}\n\nfunction getDragClasses(panel: VizPanel) {\n  const parentLayout = sceneGraph.getLayout(panel);\n  const isDraggable = parentLayout?.isDraggable();\n\n  if (!parentLayout || !isDraggable || itemDraggingDisabled(panel, parentLayout)) {\n    return { dragClass: '', dragClassCancel: '' };\n  }\n\n  return { dragClass: parentLayout.getDragClass?.(), dragClassCancel: parentLayout?.getDragClassCancel?.() };\n}\n\nfunction getDragHooks(panel: VizPanel) {\n  const parentLayout = sceneGraph.getLayout(panel);\n  return parentLayout?.getDragHooks?.() ?? {};\n}\n\n/**\n * Walks up the parent chain until it hits the layout object, trying to find the closest SceneGridItemLike ancestor.\n * It is not always the direct parent, because the VizPanel can be wrapped in other objects.\n */\nfunction itemDraggingDisabled(item: SceneObject, layout: SceneLayout) {\n  let obj: SceneObject | undefined = item;\n\n  while (obj && obj !== layout) {\n    if ('isDraggable' in obj.state && obj.state.isDraggable === false) {\n      return true;\n    }\n\n    if ('repeatSourceKey' in obj.state && obj.state.repeatSourceKey) {\n      return true;\n    }\n\n    obj = obj.parent;\n  }\n\n  return false;\n}\n\nfunction getChromeStatusMessage(data: PanelData, pluginLoadingError: string | undefined) {\n  if (pluginLoadingError) {\n    return pluginLoadingError;\n  }\n\n  let message = data.error ? data.error.message : undefined;\n\n  // Handling multiple errors with a single string until we integrate VizPanel with inspector\n  if (data.errors) {\n    message = data.errors.map((e) => e.message).join(', ');\n  }\n  return message;\n}\n\nconst relativeWrapper = css({\n  position: 'relative',\n  width: '100%',\n  height: '100%',\n});\n\n/**\n * Sadly this this absolute wrapper is needed for the panel to adopt smaller sizes.\n * The combo of useMeasure and PanelChrome makes the panel take up the width it get's but that makes it impossible to\n * Then adapt to smaller space (say resizing the browser window or undocking menu).\n */\nconst absoluteWrapper = css({\n  position: 'absolute',\n  width: '100%',\n  height: '100%',\n});\n\nconst getAlertStateStyles = (theme: GrafanaTheme2) => {\n  return {\n    ok: css({\n      color: theme.colors.success.text,\n    }),\n    pending: css({\n      color: theme.colors.warning.text,\n    }),\n    alerting: css({\n      color: theme.colors.error.text,\n    }),\n  };\n};\n"],"names":["_a"],"mappings":"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"}

package/dist/esm/components/layout/LazyLoader.js

@@ -40,7 +40,7 @@ const LazyLoader = React.forwardRef(
         }
       };
     });
-    return /* @__PURE__ */ React.createElement("div", { id, ref: innerRef, className: `${hideEmpty} ${className}`, ...rest }, !loaded || !isInView ? t("grafana-scenes.components.lazy-loader.placeholder", "\xA0") : children);
+    return /* @__PURE__ */ React.createElement("div", { id, ref: innerRef, className: `${hideEmpty} ${className}`, ...rest }, !loaded || !isInView ? t("grafana-scenes.components.lazy-loader.placeholder", "\xA0") : /* @__PURE__ */ React.createElement(LazyLoaderInViewContext.Provider, { value: isInView }, children));
   }
 );
 function getStyles() {
@@ -65,6 +65,10 @@ LazyLoader.observer = new IntersectionObserver(
   },
   { rootMargin: "100px" }
 );
+const LazyLoaderInViewContext = React.createContext(true);
+function useLazyLoaderIsInView() {
+  return React.useContext(LazyLoaderInViewContext);
+}
 
-export { LazyLoader, useUniqueId };
+export { LazyLoader, LazyLoaderInViewContext, useLazyLoaderIsInView, useUniqueId };
 //# sourceMappingURL=LazyLoader.js.map

package/dist/esm/components/layout/LazyLoader.js.map

@@ -1 +1 @@
-{"version":3,"file":"LazyLoader.js","sources":["../../../../src/components/layout/LazyLoader.tsx"],"sourcesContent":["import React, { ForwardRefExoticComponent, useImperativeHandle, useRef, useState } from 'react';\nimport { useEffectOnce } from 'react-use';\n\nimport { uniqueId } from 'lodash';\nimport { css } from '@emotion/css';\nimport { useStyles2 } from '@grafana/ui';\nimport { t } from '@grafana/i18n';\n\nexport function useUniqueId(): string {\n  const idRefLazy = useRef<string | undefined>(undefined);\n  idRefLazy.current ??= uniqueId();\n  return idRefLazy.current;\n}\n\nexport interface Props extends Omit<React.HTMLProps<HTMLDivElement>, 'onChange' | 'children'> {\n  children: React.ReactNode;\n  key: string;\n  onLoad?: () => void;\n  onChange?: (isInView: boolean) => void;\n}\n\nexport interface LazyLoaderType extends ForwardRefExoticComponent<Props> {\n  addCallback: (id: string, c: (e: IntersectionObserverEntry) => void) => void;\n  callbacks: Record<string, (e: IntersectionObserverEntry) => void>;\n  observer: IntersectionObserver;\n}\n\nexport const LazyLoader: LazyLoaderType = React.forwardRef<HTMLDivElement, Props>(\n  ({ children, onLoad, onChange, className, ...rest }, ref) => {\n    const id = useUniqueId();\n    const { hideEmpty } = useStyles2(getStyles);\n    const [loaded, setLoaded] = useState(false);\n    const [isInView, setIsInView] = useState(false);\n    const innerRef = useRef<HTMLDivElement>(null);\n\n    useImperativeHandle(ref, () => innerRef.current!);\n\n    useEffectOnce(() => {\n      LazyLoader.addCallback(id, (entry) => {\n        if (!loaded && entry.isIntersecting) {\n          setLoaded(true);\n          onLoad?.();\n        }\n\n        setIsInView(entry.isIntersecting);\n        onChange?.(entry.isIntersecting);\n      });\n\n      const wrapperEl = innerRef.current;\n\n      if (wrapperEl) {\n        LazyLoader.observer.observe(wrapperEl);\n      }\n\n      return () => {\n        wrapperEl && LazyLoader.observer.unobserve(wrapperEl);\n        delete LazyLoader.callbacks[id];\n        if (Object.keys(LazyLoader.callbacks).length === 0) {\n          LazyLoader.observer.disconnect();\n        }\n      };\n    });\n\n    // since we will hide empty lazyloaded divs, we need to include a\n    // non-breaking space while the loader has not been loaded. after it has\n    // been loaded, we can remove the non-breaking space and show the children.\n    // If the children render empty, the whole loader will be hidden by css.\n    return (\n      <div id={id} ref={innerRef} className={`${hideEmpty} ${className}`} {...rest}>\n        {!loaded || !isInView ? t('grafana-scenes.components.lazy-loader.placeholder', '\\u00A0') : children}\n      </div>\n    );\n  }\n) as LazyLoaderType;\n\nfunction getStyles() {\n  return {\n    hideEmpty: css({\n      '&:empty': {\n        display: 'none',\n      },\n    }),\n  };\n}\n\nLazyLoader.displayName = 'LazyLoader';\nLazyLoader.callbacks = {} as Record<string, (e: IntersectionObserverEntry) => void>;\nLazyLoader.addCallback = (id: string, c: (e: IntersectionObserverEntry) => void) => (LazyLoader.callbacks[id] = c);\nLazyLoader.observer = new IntersectionObserver(\n  (entries) => {\n    for (const entry of entries) {\n      if (typeof LazyLoader.callbacks[entry.target.id] === 'function') {\n        LazyLoader.callbacks[entry.target.id](entry);\n      }\n    }\n  },\n  { rootMargin: '100px' }\n);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"LazyLoader.js","sources":["../../../../src/components/layout/LazyLoader.tsx"],"sourcesContent":["import React, { ForwardRefExoticComponent, useImperativeHandle, useRef, useState } from 'react';\nimport { useEffectOnce } from 'react-use';\n\nimport { uniqueId } from 'lodash';\nimport { css } from '@emotion/css';\nimport { useStyles2 } from '@grafana/ui';\nimport { t } from '@grafana/i18n';\n\nexport function useUniqueId(): string {\n  const idRefLazy = useRef<string | undefined>(undefined);\n  idRefLazy.current ??= uniqueId();\n  return idRefLazy.current;\n}\n\nexport interface Props extends Omit<React.HTMLProps<HTMLDivElement>, 'onChange' | 'children'> {\n  children: React.ReactNode;\n  key: string;\n  onLoad?: () => void;\n  onChange?: (isInView: boolean) => void;\n}\n\nexport interface LazyLoaderType extends ForwardRefExoticComponent<Props> {\n  addCallback: (id: string, c: (e: IntersectionObserverEntry) => void) => void;\n  callbacks: Record<string, (e: IntersectionObserverEntry) => void>;\n  observer: IntersectionObserver;\n}\n\nexport const LazyLoader: LazyLoaderType = React.forwardRef<HTMLDivElement, Props>(\n  ({ children, onLoad, onChange, className, ...rest }, ref) => {\n    const id = useUniqueId();\n    const { hideEmpty } = useStyles2(getStyles);\n    const [loaded, setLoaded] = useState(false);\n    const [isInView, setIsInView] = useState(false);\n    const innerRef = useRef<HTMLDivElement>(null);\n\n    useImperativeHandle(ref, () => innerRef.current!);\n\n    useEffectOnce(() => {\n      LazyLoader.addCallback(id, (entry) => {\n        if (!loaded && entry.isIntersecting) {\n          setLoaded(true);\n          onLoad?.();\n        }\n\n        setIsInView(entry.isIntersecting);\n        onChange?.(entry.isIntersecting);\n      });\n\n      const wrapperEl = innerRef.current;\n\n      if (wrapperEl) {\n        LazyLoader.observer.observe(wrapperEl);\n      }\n\n      return () => {\n        wrapperEl && LazyLoader.observer.unobserve(wrapperEl);\n        delete LazyLoader.callbacks[id];\n        if (Object.keys(LazyLoader.callbacks).length === 0) {\n          LazyLoader.observer.disconnect();\n        }\n      };\n    });\n\n    // since we will hide empty lazyloaded divs, we need to include a\n    // non-breaking space while the loader has not been loaded. after it has\n    // been loaded, we can remove the non-breaking space and show the children.\n    // If the children render empty, the whole loader will be hidden by css.\n    return (\n      <div id={id} ref={innerRef} className={`${hideEmpty} ${className}`} {...rest}>\n        {!loaded || !isInView ? (\n          t('grafana-scenes.components.lazy-loader.placeholder', '\\u00A0')\n        ) : (\n          <LazyLoaderInViewContext.Provider value={isInView}>{children}</LazyLoaderInViewContext.Provider>\n        )}\n      </div>\n    );\n  }\n) as LazyLoaderType;\n\nfunction getStyles() {\n  return {\n    hideEmpty: css({\n      '&:empty': {\n        display: 'none',\n      },\n    }),\n  };\n}\n\nLazyLoader.displayName = 'LazyLoader';\nLazyLoader.callbacks = {} as Record<string, (e: IntersectionObserverEntry) => void>;\nLazyLoader.addCallback = (id: string, c: (e: IntersectionObserverEntry) => void) => (LazyLoader.callbacks[id] = c);\nLazyLoader.observer = new IntersectionObserver(\n  (entries) => {\n    for (const entry of entries) {\n      if (typeof LazyLoader.callbacks[entry.target.id] === 'function') {\n        LazyLoader.callbacks[entry.target.id](entry);\n      }\n    }\n  },\n  { rootMargin: '100px' }\n);\n\nexport const LazyLoaderInViewContext = React.createContext<boolean>(true);\n\nexport function useLazyLoaderIsInView(): boolean {\n  return React.useContext(LazyLoaderInViewContext);\n}\n"],"names":[],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"types.js","sources":["../../../src/core/types.ts"],"sourcesContent":["import React from 'react';\nimport { MonoTypeOperatorFunction, Observable, Unsubscribable } from 'rxjs';\n\nimport {\n  BusEvent,\n  BusEventHandler,\n  BusEventType,\n  DataFrame,\n  DataQueryRequest,\n  DataSourceGetTagKeysOptions,\n  DataSourceGetTagValuesOptions,\n  DataTransformContext,\n  PanelData,\n  TimeRange,\n} from '@grafana/data';\nimport { DataQuery, DataTopic, TimeZone } from '@grafana/schema';\n\nimport { SceneVariableDependencyConfigLike, SceneVariables } from '../variables/types';\nimport { SceneObjectRef } from './SceneObjectRef';\nimport { VizPanel } from '../components/VizPanel/VizPanel';\nimport { WeekStart } from '@grafana/ui';\n\nexport interface SceneObjectState {\n  key?: string;\n  $timeRange?: SceneTimeRangeLike;\n  $data?: SceneDataProvider;\n  $variables?: SceneVariables;\n  /**\n   * @experimental\n   * Can be used to add extra behaviors to a scene object.\n   * These are activated when the their parent scene object is activated.\n   */\n  $behaviors?: Array<SceneObject | SceneStatelessBehavior>;\n}\n\nexport interface SceneLayoutChildOptions {\n  width?: number | string;\n  height?: number | string;\n  xSizing?: 'fill' | 'content';\n  ySizing?: 'fill' | 'content';\n  x?: number;\n  y?: number;\n  minWidth?: number | string;\n  minHeight?: number | string;\n  isDraggable?: boolean;\n  isResizable?: boolean;\n}\n\nexport interface SceneComponentProps<T> {\n  model: T;\n}\n\nexport type SceneComponent<TModel> = (props: SceneComponentProps<TModel>) => React.ReactElement | null;\n\nexport interface SceneDataState extends SceneObjectState {\n  data?: PanelData;\n}\n\nexport interface SceneObject<TState extends SceneObjectState = SceneObjectState> {\n  /** The current state */\n  readonly state: TState;\n\n  /** True when there is a React component mounted for this Object */\n  readonly isActive: boolean;\n\n  /** Controls if activation blocks rendering */\n  readonly renderBeforeActivation: boolean;\n\n  /** SceneObject parent */\n  readonly parent?: SceneObject;\n\n  /** This abtractions declares what variables the scene object depends on and how to handle when they change value. **/\n  readonly variableDependency?: SceneVariableDependencyConfigLike;\n\n  /** This abstraction declares URL sync dependencies of a scene object. **/\n  readonly urlSync?: SceneObjectUrlSyncHandler;\n\n  /** Subscribe to state changes */\n  subscribeToState(handler: SceneStateChangedHandler<TState>): Unsubscribable;\n\n  /** Subscribe to a scene event */\n  subscribeToEvent<T extends BusEvent>(typeFilter: BusEventType<T>, handler: BusEventHandler<T>): Unsubscribable;\n\n  /** Publish an event and optionally bubble it up the scene */\n  publishEvent(event: BusEvent, bubble?: boolean): void;\n\n  /** Utility hook that wraps useObservable. Used by React components to subscribes to state changes */\n  useState(): TState;\n\n  /** How to modify state */\n  setState(state: Partial<TState>): void;\n\n  /**\n   * Called when the Component is mounted. This will also activate any $data, $variables or $timeRange scene object on this level.\n   * Don't override this in your custom SceneObjects, instead use addActivationHandler from the constructor.\n   **/\n  activate(): CancelActivationHandler;\n\n  /** Get the scene root */\n  getRoot(): SceneObject;\n\n  /** Returns a deep clone this object and all its children */\n  clone(state?: Partial<TState>): this;\n\n  /** A React component to use for rendering the object */\n  Component(props: SceneComponentProps<SceneObject<TState>>): React.ReactElement | null;\n\n  /** Force a re-render, should only be needed when variable values change */\n  forceRender(): void;\n\n  /** Returns a SceneObjectRef that will resolve to this object */\n  getRef(): SceneObjectRef<this>;\n\n  /**\n   * Allows external code to register code that is executed on activate and deactivate. This allow you\n   * to wire up scene objects that need to respond to state changes in other objects from the outside.\n   **/\n  addActivationHandler(handler: SceneActivationHandler): void;\n\n  /**\n   * Loop through state and call callback for each direct child scene object.\n   * Checks 1 level deep properties and arrays. So a scene object hidden in a nested plain object will not be detected.\n   * Return false to exit loop early.\n   */\n  forEachChild(callback: (child: SceneObject) => void): void | false;\n\n  /**\n   * Useful for edge cases when you want to move a scene object to another parent.\n   */\n  clearParent(): void;\n}\n\nexport type SceneActivationHandler = () => SceneDeactivationHandler | void;\nexport type SceneDeactivationHandler = () => void;\n\n/**\n * Function returned by activate() that when called will deactivate the object if it's the last activator\n **/\nexport type CancelActivationHandler = () => void;\n\nexport interface SceneLayoutState extends SceneObjectState {\n  children: SceneObject[];\n}\n\nexport interface SceneLayout<T extends SceneLayoutState = SceneLayoutState> extends SceneObject<T> {\n  isDraggable(): boolean;\n  getDragClass?(): string;\n  getDragClassCancel?(): string;\n  getDragHooks?(): { onDragStart?: (e: React.PointerEvent, panel: VizPanel) => void };\n}\n\nexport interface SceneTimeRangeState extends SceneObjectState {\n  from: string;\n  to: string;\n  fiscalYearStartMonth?: number;\n  value: TimeRange;\n  timeZone?: TimeZone;\n  /** weekStart will change the global date locale so having multiple different weekStart values is not supported  */\n  weekStart?: WeekStart;\n  /**\n   * @internal\n   * To enable feature parity with the old time range picker, not sure if it will be kept.\n   * Override the now time by entering a time delay. Use this option to accommodate known delays in data aggregation to avoid null values.\n   * */\n  UNSAFE_nowDelay?: string;\n\n  refreshOnActivate?: {\n    /**\n     * When set, the time range will invalidate relative ranges after the specified interval has elapsed\n     */\n    afterMs?: number;\n    /**\n     * When set, the time range will invalidate relative ranges after the specified percentage of the current interval has elapsed.\n     * If both invalidate values are set, the smaller value will be used for the given interval.\n     */\n    percent?: number;\n  };\n}\n\nexport interface SceneTimeRangeLike extends SceneObject<SceneTimeRangeState> {\n  onTimeZoneChange(timeZone: TimeZone): void;\n  onTimeRangeChange(timeRange: TimeRange): void;\n  onRefresh(): void;\n  getTimeZone(): TimeZone;\n}\n\nexport function isSceneObject(obj: any): obj is SceneObject {\n  return obj.useState !== undefined;\n}\n\nexport interface SceneObjectWithUrlSync extends SceneObject {\n  getUrlState(): SceneObjectUrlValues;\n  updateFromUrl(values: SceneObjectUrlValues): void;\n}\n\nexport interface SceneObjectUrlSyncHandler {\n  getKeys(): string[];\n  getUrlState(): SceneObjectUrlValues;\n  updateFromUrl(values: SceneObjectUrlValues): void;\n  shouldCreateHistoryStep?(values: SceneObjectUrlValues): boolean;\n  performBrowserHistoryAction?(callback: () => void): void;\n}\n\nexport interface DataRequestEnricher {\n  // Return partial data query request that will be merged with the original request provided by SceneQueryRunner\n  enrichDataRequest(source: SceneObject): Partial<DataQueryRequest> | null;\n}\n\nexport interface FiltersRequestEnricher {\n  // Return partial getTagKeys or getTagValues query request that will be merged with the original request provided by ad hoc or group by variable\n  enrichFiltersRequest(\n    source: SceneObject\n  ): Partial<DataSourceGetTagKeysOptions | DataSourceGetTagValuesOptions> | null;\n}\n\nexport function isDataRequestEnricher(obj: any): obj is DataRequestEnricher {\n  return 'enrichDataRequest' in obj;\n}\n\nexport function isFiltersRequestEnricher(obj: any): obj is FiltersRequestEnricher {\n  return 'enrichFiltersRequest' in obj;\n}\n\nexport type SceneObjectUrlValue = string | string[] | undefined | null;\nexport type SceneObjectUrlValues = Record<string, SceneObjectUrlValue>;\n\nexport type CustomTransformOperator = (context: DataTransformContext) => MonoTypeOperatorFunction<DataFrame[]>;\nexport type CustomTransformerDefinition =\n  | { operator: CustomTransformOperator; topic: DataTopic }\n  | CustomTransformOperator;\nexport type SceneStateChangedHandler<TState> = (newState: TState, prevState: TState) => void;\n\nexport type DeepPartial<T> = {\n  [K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K];\n};\n\nexport interface SceneDataProviderResult {\n  data: PanelData;\n  origin: SceneDataProvider;\n}\n\nexport interface SceneDataProvider<T extends SceneObjectState = SceneDataState> extends SceneObject<T> {\n  setContainerWidth?: (width: number) => void;\n  isDataReadyToDisplay?: () => boolean;\n  cancelQuery?: () => void;\n  getResultsStream(): Observable<SceneDataProviderResult>;\n}\n\nexport interface SceneDataLayerProviderState extends SceneDataState {\n  name: string;\n  description?: string;\n  isEnabled?: boolean;\n  isHidden?: boolean;\n}\n\nexport interface SceneDataLayerProvider extends SceneDataProvider<SceneDataLayerProviderState> {\n  isDataLayer: true;\n}\n\nexport function isDataLayer(obj: SceneObject): obj is SceneDataLayerProvider {\n  return 'isDataLayer' in obj;\n}\n\nexport interface DataLayerFilter {\n  panelId: number;\n}\n\nexport interface SceneStatelessBehavior<T extends SceneObject = any> {\n  (sceneObject: T): CancelActivationHandler | void;\n}\n\nexport type ControlsLayout = 'horizontal' | 'vertical';\n\nexport interface UseStateHookOptions {\n  /**\n   * For some edge cases other scene objects want to subscribe to scene object state for objects\n   * that are not active, or whose main React Component can be un-mounted. Set this to true\n   * to keep the scene object active even if the React component is unmounted.\n   *\n   * Normally you would not need this but this can be useful in some edge cases.\n   *\n   * @experimental\n   */\n  shouldActivateOrKeepAlive?: boolean;\n}\n\nexport interface SceneDataQuery extends DataQuery {\n  [key: string]: any;\n\n  // Opt this query out of time window comparison\n  timeRangeCompare?: boolean;\n}\n\nexport interface SceneUrlSyncOptions {\n  /**\n   * This will update the url to contain all scene url state\n   * when the scene is initialized. Important for browser history \"back\" actions.\n   */\n  updateUrlOnInit?: boolean;\n  /**\n   * This is only supported by some objects if they implement\n   * shouldCreateHistoryStep where they can control what changes\n   * url changes should add a new browser history entry.\n   */\n  createBrowserHistorySteps?: boolean;\n  /**\n   * This will automatically prefix url search parameters when syncing.\n   * Can be used to prevent collisions when multiple Scene apps are embedded in the page.\n   */\n  namespace?: string;\n  /**\n   * When `namespace` is provided, this prevents some url search parameters to be automatically prefixed.\n   * Defaults to the timerange parameters ([\"from\", \"to\", \"timezone\"])\n   */\n  excludeFromNamespace?: string[];\n}\n"],"names":[],"mappings":"AA0LO,SAAS,cAAc,GAA8B,EAAA;AAC1D,EAAA,OAAO,IAAI,QAAa,KAAA,MAAA;AAC1B;AA2BO,SAAS,sBAAsB,GAAsC,EAAA;AAC1E,EAAA,OAAO,mBAAuB,IAAA,GAAA;AAChC;AAEO,SAAS,yBAAyB,GAAyC,EAAA;AAChF,EAAA,OAAO,sBAA0B,IAAA,GAAA;AACnC;AAsCO,SAAS,YAAY,GAAiD,EAAA;AAC3E,EAAA,OAAO,aAAiB,IAAA,GAAA;AAC1B;;;;"}
+{"version":3,"file":"types.js","sources":["../../../src/core/types.ts"],"sourcesContent":["import React from 'react';\nimport { MonoTypeOperatorFunction, Observable, Unsubscribable } from 'rxjs';\n\nimport {\n  BusEvent,\n  BusEventHandler,\n  BusEventType,\n  DataFrame,\n  DataQueryRequest,\n  DataSourceGetTagKeysOptions,\n  DataSourceGetTagValuesOptions,\n  DataTransformContext,\n  PanelData,\n  TimeRange,\n} from '@grafana/data';\nimport { DataQuery, DataTopic, TimeZone } from '@grafana/schema';\n\nimport { SceneVariableDependencyConfigLike, SceneVariables } from '../variables/types';\nimport { SceneObjectRef } from './SceneObjectRef';\nimport { VizPanel } from '../components/VizPanel/VizPanel';\nimport { WeekStart } from '@grafana/ui';\n\nexport interface SceneObjectState {\n  key?: string;\n  $timeRange?: SceneTimeRangeLike;\n  $data?: SceneDataProvider;\n  $variables?: SceneVariables;\n  /**\n   * @experimental\n   * Can be used to add extra behaviors to a scene object.\n   * These are activated when the their parent scene object is activated.\n   */\n  $behaviors?: Array<SceneObject | SceneStatelessBehavior>;\n}\n\nexport interface SceneLayoutChildOptions {\n  width?: number | string;\n  height?: number | string;\n  xSizing?: 'fill' | 'content';\n  ySizing?: 'fill' | 'content';\n  x?: number;\n  y?: number;\n  minWidth?: number | string;\n  minHeight?: number | string;\n  isDraggable?: boolean;\n  isResizable?: boolean;\n}\n\nexport interface SceneComponentProps<T> {\n  model: T;\n}\n\nexport type SceneComponent<TModel> = (props: SceneComponentProps<TModel>) => React.ReactElement | null;\n\nexport interface SceneDataState extends SceneObjectState {\n  data?: PanelData;\n}\n\nexport interface SceneObject<TState extends SceneObjectState = SceneObjectState> {\n  /** The current state */\n  readonly state: TState;\n\n  /** True when there is a React component mounted for this Object */\n  readonly isActive: boolean;\n\n  /** Controls if activation blocks rendering */\n  readonly renderBeforeActivation: boolean;\n\n  /** SceneObject parent */\n  readonly parent?: SceneObject;\n\n  /** This abtractions declares what variables the scene object depends on and how to handle when they change value. **/\n  readonly variableDependency?: SceneVariableDependencyConfigLike;\n\n  /** This abstraction declares URL sync dependencies of a scene object. **/\n  readonly urlSync?: SceneObjectUrlSyncHandler;\n\n  /** Subscribe to state changes */\n  subscribeToState(handler: SceneStateChangedHandler<TState>): Unsubscribable;\n\n  /** Subscribe to a scene event */\n  subscribeToEvent<T extends BusEvent>(typeFilter: BusEventType<T>, handler: BusEventHandler<T>): Unsubscribable;\n\n  /** Publish an event and optionally bubble it up the scene */\n  publishEvent(event: BusEvent, bubble?: boolean): void;\n\n  /** Utility hook that wraps useObservable. Used by React components to subscribes to state changes */\n  useState(): TState;\n\n  /** How to modify state */\n  setState(state: Partial<TState>): void;\n\n  /**\n   * Called when the Component is mounted. This will also activate any $data, $variables or $timeRange scene object on this level.\n   * Don't override this in your custom SceneObjects, instead use addActivationHandler from the constructor.\n   **/\n  activate(): CancelActivationHandler;\n\n  /** Get the scene root */\n  getRoot(): SceneObject;\n\n  /** Returns a deep clone this object and all its children */\n  clone(state?: Partial<TState>): this;\n\n  /** A React component to use for rendering the object */\n  Component(props: SceneComponentProps<SceneObject<TState>>): React.ReactElement | null;\n\n  /** Force a re-render, should only be needed when variable values change */\n  forceRender(): void;\n\n  /** Returns a SceneObjectRef that will resolve to this object */\n  getRef(): SceneObjectRef<this>;\n\n  /**\n   * Allows external code to register code that is executed on activate and deactivate. This allow you\n   * to wire up scene objects that need to respond to state changes in other objects from the outside.\n   **/\n  addActivationHandler(handler: SceneActivationHandler): void;\n\n  /**\n   * Loop through state and call callback for each direct child scene object.\n   * Checks 1 level deep properties and arrays. So a scene object hidden in a nested plain object will not be detected.\n   * Return false to exit loop early.\n   */\n  forEachChild(callback: (child: SceneObject) => void): void | false;\n\n  /**\n   * Useful for edge cases when you want to move a scene object to another parent.\n   */\n  clearParent(): void;\n}\n\nexport type SceneActivationHandler = () => SceneDeactivationHandler | void;\nexport type SceneDeactivationHandler = () => void;\n\n/**\n * Function returned by activate() that when called will deactivate the object if it's the last activator\n **/\nexport type CancelActivationHandler = () => void;\n\nexport interface SceneLayoutState extends SceneObjectState {\n  children: SceneObject[];\n}\n\nexport interface SceneLayout<T extends SceneLayoutState = SceneLayoutState> extends SceneObject<T> {\n  isDraggable(): boolean;\n  getDragClass?(): string;\n  getDragClassCancel?(): string;\n  getDragHooks?(): { onDragStart?: (e: React.PointerEvent, panel: VizPanel) => void };\n}\n\nexport interface SceneTimeRangeState extends SceneObjectState {\n  from: string;\n  to: string;\n  fiscalYearStartMonth?: number;\n  value: TimeRange;\n  timeZone?: TimeZone;\n  /** weekStart will change the global date locale so having multiple different weekStart values is not supported  */\n  weekStart?: WeekStart;\n  /**\n   * @internal\n   * To enable feature parity with the old time range picker, not sure if it will be kept.\n   * Override the now time by entering a time delay. Use this option to accommodate known delays in data aggregation to avoid null values.\n   * */\n  UNSAFE_nowDelay?: string;\n\n  refreshOnActivate?: {\n    /**\n     * When set, the time range will invalidate relative ranges after the specified interval has elapsed\n     */\n    afterMs?: number;\n    /**\n     * When set, the time range will invalidate relative ranges after the specified percentage of the current interval has elapsed.\n     * If both invalidate values are set, the smaller value will be used for the given interval.\n     */\n    percent?: number;\n  };\n}\n\nexport interface SceneTimeRangeLike extends SceneObject<SceneTimeRangeState> {\n  onTimeZoneChange(timeZone: TimeZone): void;\n  onTimeRangeChange(timeRange: TimeRange): void;\n  onRefresh(): void;\n  getTimeZone(): TimeZone;\n}\n\nexport function isSceneObject(obj: any): obj is SceneObject {\n  return obj.useState !== undefined;\n}\n\nexport interface SceneObjectWithUrlSync extends SceneObject {\n  getUrlState(): SceneObjectUrlValues;\n  updateFromUrl(values: SceneObjectUrlValues): void;\n}\n\nexport interface SceneObjectUrlSyncHandler {\n  getKeys(): string[];\n  getUrlState(): SceneObjectUrlValues;\n  updateFromUrl(values: SceneObjectUrlValues): void;\n  shouldCreateHistoryStep?(values: SceneObjectUrlValues): boolean;\n  performBrowserHistoryAction?(callback: () => void): void;\n}\n\nexport interface DataRequestEnricher {\n  // Return partial data query request that will be merged with the original request provided by SceneQueryRunner\n  enrichDataRequest(source: SceneObject): Partial<DataQueryRequest> | null;\n}\n\nexport interface FiltersRequestEnricher {\n  // Return partial getTagKeys or getTagValues query request that will be merged with the original request provided by ad hoc or group by variable\n  enrichFiltersRequest(\n    source: SceneObject\n  ): Partial<DataSourceGetTagKeysOptions | DataSourceGetTagValuesOptions> | null;\n}\n\nexport function isDataRequestEnricher(obj: any): obj is DataRequestEnricher {\n  return 'enrichDataRequest' in obj;\n}\n\nexport function isFiltersRequestEnricher(obj: any): obj is FiltersRequestEnricher {\n  return 'enrichFiltersRequest' in obj;\n}\n\nexport type SceneObjectUrlValue = string | string[] | undefined | null;\nexport type SceneObjectUrlValues = Record<string, SceneObjectUrlValue>;\n\nexport type CustomTransformOperator = (context: DataTransformContext) => MonoTypeOperatorFunction<DataFrame[]>;\nexport type CustomTransformerDefinition =\n  | { operator: CustomTransformOperator; topic: DataTopic }\n  | CustomTransformOperator;\nexport type SceneStateChangedHandler<TState> = (newState: TState, prevState: TState) => void;\n\nexport type DeepPartial<T> = {\n  [K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K];\n};\n\nexport interface SceneDataProviderResult {\n  data: PanelData;\n  origin: SceneDataProvider;\n}\n\nexport interface SceneDataProvider<T extends SceneObjectState = SceneDataState> extends SceneObject<T> {\n  setContainerWidth?: (width: number) => void;\n  isDataReadyToDisplay?: () => boolean;\n  cancelQuery?: () => void;\n  getResultsStream(): Observable<SceneDataProviderResult>;\n  /**\n   * Can be used to disable query execution for scene elements that are out of view\n   */\n  isInViewChanged?(isInView: boolean): void;\n}\n\nexport interface SceneDataLayerProviderState extends SceneDataState {\n  name: string;\n  description?: string;\n  isEnabled?: boolean;\n  isHidden?: boolean;\n}\n\nexport interface SceneDataLayerProvider extends SceneDataProvider<SceneDataLayerProviderState> {\n  isDataLayer: true;\n}\n\nexport function isDataLayer(obj: SceneObject): obj is SceneDataLayerProvider {\n  return 'isDataLayer' in obj;\n}\n\nexport interface DataLayerFilter {\n  panelId: number;\n}\n\nexport interface SceneStatelessBehavior<T extends SceneObject = any> {\n  (sceneObject: T): CancelActivationHandler | void;\n}\n\nexport type ControlsLayout = 'horizontal' | 'vertical';\n\nexport interface UseStateHookOptions {\n  /**\n   * For some edge cases other scene objects want to subscribe to scene object state for objects\n   * that are not active, or whose main React Component can be un-mounted. Set this to true\n   * to keep the scene object active even if the React component is unmounted.\n   *\n   * Normally you would not need this but this can be useful in some edge cases.\n   *\n   * @experimental\n   */\n  shouldActivateOrKeepAlive?: boolean;\n}\n\nexport interface SceneDataQuery extends DataQuery {\n  [key: string]: any;\n\n  // Opt this query out of time window comparison\n  timeRangeCompare?: boolean;\n}\n\nexport interface SceneUrlSyncOptions {\n  /**\n   * This will update the url to contain all scene url state\n   * when the scene is initialized. Important for browser history \"back\" actions.\n   */\n  updateUrlOnInit?: boolean;\n  /**\n   * This is only supported by some objects if they implement\n   * shouldCreateHistoryStep where they can control what changes\n   * url changes should add a new browser history entry.\n   */\n  createBrowserHistorySteps?: boolean;\n  /**\n   * This will automatically prefix url search parameters when syncing.\n   * Can be used to prevent collisions when multiple Scene apps are embedded in the page.\n   */\n  namespace?: string;\n  /**\n   * When `namespace` is provided, this prevents some url search parameters to be automatically prefixed.\n   * Defaults to the timerange parameters ([\"from\", \"to\", \"timezone\"])\n   */\n  excludeFromNamespace?: string[];\n}\n"],"names":[],"mappings":"AA0LO,SAAS,cAAc,GAA8B,EAAA;AAC1D,EAAA,OAAO,IAAI,QAAa,KAAA,MAAA;AAC1B;AA2BO,SAAS,sBAAsB,GAAsC,EAAA;AAC1E,EAAA,OAAO,mBAAuB,IAAA,GAAA;AAChC;AAEO,SAAS,yBAAyB,GAAyC,EAAA;AAChF,EAAA,OAAO,sBAA0B,IAAA,GAAA;AACnC;AA0CO,SAAS,YAAY,GAAiD,EAAA;AAC3E,EAAA,OAAO,aAAiB,IAAA,GAAA;AAC1B;;;;"}

package/dist/esm/querying/SceneQueryRunner.js

@@ -52,6 +52,8 @@ class SceneQueryRunner extends SceneObjectBase {
       this.setState({ data: dataWithLayersApplied, _hasFetchedData: hasFetchedData });
       this._results.next({ origin: this, data: dataWithLayersApplied });
     };
+    this._isInView = true;
+    this._queryNotExecutedWhenOutOfView = false;
     this.addActivationHandler(() => this._onActivate());
   }
   getResultsStream() {
@@ -273,6 +275,11 @@ class SceneQueryRunner extends SceneObjectBase {
     if (!this.state.maxDataPoints && this.state.maxDataPointsFromWidth && !this._containerWidth) {
       return;
     }
+    if (this.isQueryModeAuto() && !this._isInView) {
+      this._queryNotExecutedWhenOutOfView = true;
+      return;
+    }
+    this._queryNotExecutedWhenOutOfView = false;
     if (!this._dataLayersSub) {
       this._handleDataLayers();
     }
@@ -436,6 +443,13 @@ class SceneQueryRunner extends SceneObjectBase {
     var _a;
     return ((_a = this.state.runQueriesMode) != null ? _a : "auto") === "auto";
   }
+  isInViewChanged(isInView) {
+    writeSceneLog("SceneQueryRunner", `isInViewChanged: ${isInView}`, this.state.key);
+    this._isInView = isInView;
+    if (isInView && this._queryNotExecutedWhenOutOfView) {
+      this.runQueries();
+    }
+  }
 }
 function findFirstDatasource(targets) {
   var _a, _b;