@atlaskit/renderer 126.7.0 → 126.8.0

package/dist/esm/ui/hooks/useStableScroll.js

@@ -0,0 +1,89 @@
+import { useRef, useCallback } from 'react';
+/**
+ * Hook that provides functionality to wait for layout stability before performing an action.
+ * Uses ResizeObserver to detect when a container has stopped resizing (e.g., images finished loading).
+ */
+export var useStableScroll = function useStableScroll() {
+  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var _options$stabilityWai = options.stabilityWaitTime,
+    stabilityWaitTime = _options$stabilityWai === void 0 ? 200 : _options$stabilityWai,
+    _options$maxStability = options.maxStabilityWaitTime,
+    maxStabilityWaitTime = _options$maxStability === void 0 ? 10000 : _options$maxStability;
+  var stabilityTimeoutRef = useRef(null);
+  var resizeObserverRef = useRef(null);
+  var lastStableTimeRef = useRef(0);
+  var onStableCallbackRef = useRef(null);
+  var cleanup = useCallback(function () {
+    if (stabilityTimeoutRef.current) {
+      clearTimeout(stabilityTimeoutRef.current);
+      stabilityTimeoutRef.current = null;
+    }
+    if (resizeObserverRef.current) {
+      resizeObserverRef.current.disconnect();
+      resizeObserverRef.current = null;
+    }
+    onStableCallbackRef.current = null;
+    lastStableTimeRef.current = 0;
+  }, []);
+  var scheduleStabilityCheck = useCallback(function () {
+    // Clear any existing stability timeout.
+    if (stabilityTimeoutRef.current) {
+      clearTimeout(stabilityTimeoutRef.current);
+      stabilityTimeoutRef.current = null;
+    }
+
+    // Check if we've exceeded the maximum stability wait time.
+    var now = Date.now();
+    if (lastStableTimeRef.current === 0) {
+      lastStableTimeRef.current = now;
+    } else if (now - lastStableTimeRef.current > maxStabilityWaitTime) {
+      // We've waited too long for stability, call the callback now.
+      if (onStableCallbackRef.current) {
+        onStableCallbackRef.current();
+        cleanup();
+      }
+      return;
+    }
+
+    // Set a timeout to call the callback after the stability wait time.
+    stabilityTimeoutRef.current = setTimeout(function () {
+      if (onStableCallbackRef.current) {
+        onStableCallbackRef.current();
+        cleanup();
+      }
+    }, stabilityWaitTime);
+  }, [stabilityWaitTime, maxStabilityWaitTime, cleanup]);
+  var waitForStability = useCallback(function (container, onStable) {
+    // Clean up any existing observer
+    cleanup();
+
+    // Store the callback
+    onStableCallbackRef.current = onStable;
+
+    // Check if ResizeObserver is available
+    if (typeof ResizeObserver === 'undefined') {
+      // Fallback: just call the callback after the stability wait time
+      stabilityTimeoutRef.current = setTimeout(function () {
+        if (onStableCallbackRef.current) {
+          onStableCallbackRef.current();
+          cleanup();
+        }
+      }, stabilityWaitTime);
+      return;
+    }
+
+    // Create a ResizeObserver to monitor the container for size changes.
+    resizeObserverRef.current = new ResizeObserver(function () {
+      // Container size changed, reset stability timer.
+      scheduleStabilityCheck();
+    });
+    resizeObserverRef.current.observe(container);
+
+    // Start the initial stability check
+    scheduleStabilityCheck();
+  }, [stabilityWaitTime, scheduleStabilityCheck, cleanup]);
+  return {
+    waitForStability: waitForStability,
+    cleanup: cleanup
+  };
+};

package/dist/types/analytics/events.d.ts

@@ -3,6 +3,7 @@ import type { AEP } from './enums';
 import type { SortOrder } from '@atlaskit/editor-common/types';
 import type { SEVERITY, UNSUPPORTED_CONTENT_LEVEL_SEVERITY, UnsupportedContentPayload, UnsupportedContentTooltipPayload } from '@atlaskit/editor-common/utils';
 import type { EditorBreakpointKey } from '@atlaskit/editor-common/utils/analytics';
+import type { NestedRendererType } from '../ui/Renderer/types';
 export declare enum PLATFORM {
     NATIVE = "mobileNative",
     HYBRID = "mobileHybrid",
@@ -18,6 +19,7 @@ type RendererStartAEP = AEP<ACTION.STARTED, ACTION_SUBJECT.RENDERER, undefined,
 type RendererRenderedAEP = AEP<ACTION.RENDERED, ACTION_SUBJECT.RENDERER, undefined, {
     distortedDuration: boolean;
     duration: number;
+    nestedRendererType?: NestedRendererType;
     nodes: Record<string, number>;
     platform: PLATFORM.WEB;
     severity?: SEVERITY;
@@ -26,6 +28,7 @@ type RendererRenderedAEP = AEP<ACTION.RENDERED, ACTION_SUBJECT.RENDERER, undefin
 type RendererRenderedSampledAEP = AEP<ACTION.RENDERED_SAMPLED, ACTION_SUBJECT.RENDERER, undefined, {
     distortedDuration: boolean;
     duration: number;
+    nestedRendererType?: NestedRendererType;
     nodes: Record<string, number>;
     platform: PLATFORM.WEB;
     severity?: SEVERITY;

package/dist/types/renderer-context.d.ts

@@ -1,10 +1,11 @@
 import React from 'react';
 import type { FeatureFlags } from '@atlaskit/editor-common/types';
-import type { RendererContentMode } from './ui/Renderer/types';
+import type { RendererContentMode, NestedRendererType } from './ui/Renderer/types';
 export type RendererContextProps = {
     contentMode?: RendererContentMode;
     featureFlags?: FeatureFlags;
     isTopLevelRenderer?: boolean;
+    nestedRendererType?: NestedRendererType;
 };
 export declare const useRendererContext: () => RendererContextProps;
 export declare const RendererContextProvider: React.Provider<{}>;

package/dist/types/ui/Renderer/types.d.ts

@@ -1,5 +1,6 @@
 export type RendererAppearance = 'comment' | 'full-page' | 'full-width' | 'max' | undefined;
 export type RendererContentMode = 'standard' | 'compact' | undefined;
+export type NestedRendererType = 'syncedBlock' | undefined;
 /**
  * DO NOT USE THESE OPTIONS
  * These StickyHeaderConfig_DO_NOT_USE options are being TEMPORARILY added so Confluence can use Sticky Table Headers

package/dist/types/ui/hooks/useScrollToBlock.d.ts

@@ -0,0 +1,23 @@
+import type { DocNode } from '@atlaskit/adf-schema';
+/**
+ * useScrollToBlock - Handler for block link scrolling in the renderer with expand support
+ *
+ * This hook enables scroll-to-block functionality when blocks may be hidden inside collapsed expands.
+ * It searches the ADF document for the target block, identifies any parent expand nodes,
+ * expands them if needed, and waits for layout stability before scrolling to the block.
+ *
+ * This implementation waits for the container to stabilize (no layout shifts) before scrolling,
+ * which prevents issues with images loading, dynamic content, or other async operations that
+ * cause layout changes.
+ *
+ * This hook replaces useScrollToLocalId when the platform_editor_expand_on_scroll_to_block experiment is enabled.
+ *
+ * When platform_editor_expand_on_scroll_to_block experiment is cleaned up:
+ *       - Remove the experiment check
+ *       - Delete the deprecated useScrollToLocalId hook
+ *       - Make this the default scroll-to-block behavior
+ *
+ * @param containerRef - Optional ref to the renderer container (RendererStyleContainer)
+ * @param adfDoc - The ADF document to search for nodes and expand parents
+ */
+export declare const useScrollToBlock: (containerRef?: React.RefObject<HTMLDivElement>, adfDoc?: DocNode) => void;

package/dist/types/ui/hooks/useScrollToLocalId.d.ts

@@ -1 +1,10 @@
+/**
+ * useScrollToLocalId - Handler for block link scrolling in the renderer (traditional pages)
+ *
+ * This hook is deprecated in favor of useScrollToBlock which supports expanding parent nodes.
+ * This hook will be removed when the platform_editor_expand_on_scroll_to_block experiment is cleaned up.
+ *
+ * @param containerRef - Optional ref to the renderer container (RendererStyleContainer).
+ * @param shouldScrollToLocalId - Whether scroll-to-block functionality should be enabled
+ */
 export declare const useScrollToLocalId: (containerRef?: React.RefObject<HTMLDivElement>, shouldScrollToLocalId?: boolean) => void;

package/dist/types/ui/hooks/useStableScroll.d.ts

@@ -0,0 +1,27 @@
+export interface UseStableScrollOptions {
+    /**
+     * Maximum time (in ms) to wait for stability before scrolling anyway
+     * @default 10000
+     */
+    maxStabilityWaitTime?: number;
+    /**
+     * Time to wait (in ms) after the last resize event before considering the layout stable
+     * @default 200
+     */
+    stabilityWaitTime?: number;
+}
+export interface UseStableScrollReturn {
+    /**
+     * Cleans up all timers and observers
+     */
+    cleanup: () => void;
+    /**
+     * Starts monitoring the container for stability and calls the callback when stable
+     */
+    waitForStability: (container: HTMLElement, onStable: () => void) => void;
+}
+/**
+ * Hook that provides functionality to wait for layout stability before performing an action.
+ * Uses ResizeObserver to detect when a container has stopped resizing (e.g., images finished loading).
+ */
+export declare const useStableScroll: (options?: UseStableScrollOptions) => UseStableScrollReturn;

package/dist/types-ts4.5/analytics/events.d.ts

@@ -3,6 +3,7 @@ import type { AEP } from './enums';
 import type { SortOrder } from '@atlaskit/editor-common/types';
 import type { SEVERITY, UNSUPPORTED_CONTENT_LEVEL_SEVERITY, UnsupportedContentPayload, UnsupportedContentTooltipPayload } from '@atlaskit/editor-common/utils';
 import type { EditorBreakpointKey } from '@atlaskit/editor-common/utils/analytics';
+import type { NestedRendererType } from '../ui/Renderer/types';
 export declare enum PLATFORM {
     NATIVE = "mobileNative",
     HYBRID = "mobileHybrid",
@@ -18,6 +19,7 @@ type RendererStartAEP = AEP<ACTION.STARTED, ACTION_SUBJECT.RENDERER, undefined,
 type RendererRenderedAEP = AEP<ACTION.RENDERED, ACTION_SUBJECT.RENDERER, undefined, {
     distortedDuration: boolean;
     duration: number;
+    nestedRendererType?: NestedRendererType;
     nodes: Record<string, number>;
     platform: PLATFORM.WEB;
     severity?: SEVERITY;
@@ -26,6 +28,7 @@ type RendererRenderedAEP = AEP<ACTION.RENDERED, ACTION_SUBJECT.RENDERER, undefin
 type RendererRenderedSampledAEP = AEP<ACTION.RENDERED_SAMPLED, ACTION_SUBJECT.RENDERER, undefined, {
     distortedDuration: boolean;
     duration: number;
+    nestedRendererType?: NestedRendererType;
     nodes: Record<string, number>;
     platform: PLATFORM.WEB;
     severity?: SEVERITY;

package/dist/types-ts4.5/renderer-context.d.ts

@@ -1,10 +1,11 @@
 import React from 'react';
 import type { FeatureFlags } from '@atlaskit/editor-common/types';
-import type { RendererContentMode } from './ui/Renderer/types';
+import type { RendererContentMode, NestedRendererType } from './ui/Renderer/types';
 export type RendererContextProps = {
     contentMode?: RendererContentMode;
     featureFlags?: FeatureFlags;
     isTopLevelRenderer?: boolean;
+    nestedRendererType?: NestedRendererType;
 };
 export declare const useRendererContext: () => RendererContextProps;
 export declare const RendererContextProvider: React.Provider<{}>;

package/dist/types-ts4.5/ui/Renderer/types.d.ts

@@ -1,5 +1,6 @@
 export type RendererAppearance = 'comment' | 'full-page' | 'full-width' | 'max' | undefined;
 export type RendererContentMode = 'standard' | 'compact' | undefined;
+export type NestedRendererType = 'syncedBlock' | undefined;
 /**
  * DO NOT USE THESE OPTIONS
  * These StickyHeaderConfig_DO_NOT_USE options are being TEMPORARILY added so Confluence can use Sticky Table Headers

package/dist/types-ts4.5/ui/hooks/useScrollToBlock.d.ts

@@ -0,0 +1,23 @@
+import type { DocNode } from '@atlaskit/adf-schema';
+/**
+ * useScrollToBlock - Handler for block link scrolling in the renderer with expand support
+ *
+ * This hook enables scroll-to-block functionality when blocks may be hidden inside collapsed expands.
+ * It searches the ADF document for the target block, identifies any parent expand nodes,
+ * expands them if needed, and waits for layout stability before scrolling to the block.
+ *
+ * This implementation waits for the container to stabilize (no layout shifts) before scrolling,
+ * which prevents issues with images loading, dynamic content, or other async operations that
+ * cause layout changes.
+ *
+ * This hook replaces useScrollToLocalId when the platform_editor_expand_on_scroll_to_block experiment is enabled.
+ *
+ * When platform_editor_expand_on_scroll_to_block experiment is cleaned up:
+ *       - Remove the experiment check
+ *       - Delete the deprecated useScrollToLocalId hook
+ *       - Make this the default scroll-to-block behavior
+ *
+ * @param containerRef - Optional ref to the renderer container (RendererStyleContainer)
+ * @param adfDoc - The ADF document to search for nodes and expand parents
+ */
+export declare const useScrollToBlock: (containerRef?: React.RefObject<HTMLDivElement>, adfDoc?: DocNode) => void;

package/dist/types-ts4.5/ui/hooks/useScrollToLocalId.d.ts

@@ -1 +1,10 @@
+/**
+ * useScrollToLocalId - Handler for block link scrolling in the renderer (traditional pages)
+ *
+ * This hook is deprecated in favor of useScrollToBlock which supports expanding parent nodes.
+ * This hook will be removed when the platform_editor_expand_on_scroll_to_block experiment is cleaned up.
+ *
+ * @param containerRef - Optional ref to the renderer container (RendererStyleContainer).
+ * @param shouldScrollToLocalId - Whether scroll-to-block functionality should be enabled
+ */
 export declare const useScrollToLocalId: (containerRef?: React.RefObject<HTMLDivElement>, shouldScrollToLocalId?: boolean) => void;

package/dist/types-ts4.5/ui/hooks/useStableScroll.d.ts

@@ -0,0 +1,27 @@
+export interface UseStableScrollOptions {
+    /**
+     * Maximum time (in ms) to wait for stability before scrolling anyway
+     * @default 10000
+     */
+    maxStabilityWaitTime?: number;
+    /**
+     * Time to wait (in ms) after the last resize event before considering the layout stable
+     * @default 200
+     */
+    stabilityWaitTime?: number;
+}
+export interface UseStableScrollReturn {
+    /**
+     * Cleans up all timers and observers
+     */
+    cleanup: () => void;
+    /**
+     * Starts monitoring the container for stability and calls the callback when stable
+     */
+    waitForStability: (container: HTMLElement, onStable: () => void) => void;
+}
+/**
+ * Hook that provides functionality to wait for layout stability before performing an action.
+ * Uses ResizeObserver to detect when a container has stopped resizing (e.g., images finished loading).
+ */
+export declare const useStableScroll: (options?: UseStableScrollOptions) => UseStableScrollReturn;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "126.7.0",
+	"version": "126.8.0",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -57,7 +57,7 @@
 		"@atlaskit/status": "^3.1.0",
 		"@atlaskit/task-decision": "^19.2.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^20.3.0",
+		"@atlaskit/tmp-editor-statsig": "^21.1.0",
 		"@atlaskit/tokens": "^11.0.0",
 		"@atlaskit/tooltip": "^20.14.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
@@ -249,6 +249,9 @@
 		},
 		"confluence_ttvc_inline_extensions": {
 			"type": "boolean"
+		},
+		"platform_synced_block_patch_1": {
+			"type": "boolean"
 		}
 	}
 }