@aglyn/aglyn-node-renderer 1.0.0-beta.224 → 1.0.0-beta.225

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aglyn/aglyn-node-renderer",
-  "version": "1.0.0-beta.224",
+  "version": "1.0.0-beta.225",
   "license": "Apache-2.0",
   "homepage": "https://aglyn.com",
   "repository": {
@@ -24,12 +24,12 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@aglyn/aglyn": "1.0.0-beta.224",
-    "@aglyn/shared-data-types": "1.0.0-beta.224",
-    "@aglyn/shared-ui-jsx": "1.0.0-beta.224",
-    "@aglyn/shared-ui-theme": "1.0.0-beta.224",
-    "@aglyn/shared-util-tools": "1.0.0-beta.224",
-    "@aglyn/shared-util-vendor": "1.0.0-beta.224",
+    "@aglyn/aglyn": "1.0.0-beta.225",
+    "@aglyn/shared-data-types": "1.0.0-beta.225",
+    "@aglyn/shared-ui-jsx": "1.0.0-beta.225",
+    "@aglyn/shared-ui-theme": "1.0.0-beta.225",
+    "@aglyn/shared-util-tools": "1.0.0-beta.225",
+    "@aglyn/shared-util-vendor": "1.0.0-beta.225",
     "mobx-react-lite": "^5.1.0",
     "react-is": "^19.3.0"
   },

package/src/lib/components/deferred-hydration.d.ts

@@ -0,0 +1,107 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type * as Aglyn from '@aglyn/aglyn';
+/**
+ * Static subtrees of a published page skip hydration until the visitor
+ * nears them (AGL-3581).
+ *
+ * ## What it does
+ *
+ * A published page arrives as complete server HTML, and before this every
+ * node of it hydrated at once: on `aglyn.com/` that was ~600 elements and the
+ * largest single long task of the load. Most of them are copy, images and
+ * layout — nothing a visitor operates — so hydrating them buys nothing until
+ * the visitor reaches them.
+ *
+ * While the page hydrates, a static subtree that is not near the viewport
+ * renders its root element with `dangerouslySetInnerHTML` in place of its
+ * children. React hydrates that root and treats its contents as markup it
+ * does not own, so the server's HTML stays exactly as it is — painted,
+ * selectable, links working natively — and none of it costs hydration. When
+ * the subtree comes within {@link NEAR_VIEWPORT_PX} of the viewport the
+ * children render, and React builds them on the client in place of the held
+ * markup: the same HTML, now live.
+ *
+ * ## Why not a Suspense boundary
+ *
+ * A boundary that suspends during hydration would keep the server HTML and
+ * hydrate it in place, which is the textbook mechanism. React 19.2's server
+ * renderer outlines every boundary over 500 bytes once the shell passes its
+ * progressive chunk size (12.8 KB, not configurable through Next): each one
+ * ships in a hidden `<div>` revealed by an inline script on a later animation
+ * frame. That is content missing from first paint, a layout shift when it
+ * appears, nothing at all in a background tab, and markup a non-rendering
+ * crawler reads as hidden. A held root changes nothing in the server HTML.
+ *
+ * ## Which subtrees
+ *
+ * Every component in the subtree declares `flags.lazyHydration` — nothing in
+ * it responds to the visitor before hydration beyond what HTML does on its
+ * own — so the safe answer is the default: an element without the flag keeps
+ * its whole ancestry hydrating now. The subtree's ROOT also declares
+ * `flags.childrenInRoot`, the contract that lets it take
+ * `dangerouslySetInnerHTML` instead of its children.
+ *
+ * A subtree near the viewport at hydration is not held, and its children
+ * hydrate normally — each of them then decides for itself. So a page-wide
+ * static wrapper does not hold the whole page: it hydrates, and the sections
+ * inside it that are further down are what wait.
+ *
+ * ## Only during hydration
+ *
+ * The decision is taken once, when the leaf first renders, and only if that
+ * render is part of the tree's first commit (see `treeHydrated`). A subtree
+ * mounted by a client-side navigation renders at once and can never be left
+ * empty.
+ *
+ * ## Interaction before release
+ *
+ * Nothing is released on a press: that would replace the element under the
+ * visitor's finger between `pointerdown` and `click`, and the click would be
+ * lost. The held HTML already does what a static element does — a link
+ * navigates, text selects, focus moves.
+ *
+ * ## Fails open
+ *
+ * If the leaf's element is not in the document, or the browser has no
+ * `IntersectionObserver`, nothing is held: the worst case is the old
+ * behavior.
+ */
+/** How far outside the viewport a held subtree renders, in pixels. */
+export declare const NEAR_VIEWPORT_PX = 600;
+/** The empty markup a held root is given, and React leaves alone. */
+export declare const HELD_SERVER_HTML: Readonly<{
+    __html: "";
+}>;
+/** Called by `TreeRoot` once its first commit has landed. */
+export declare function markTreeHydrated(): void;
+/**
+ * Should this leaf render its root with {@link HELD_SERVER_HTML} instead of
+ * its children? True only from a hydration render of an `eligible` leaf that
+ * is far from the viewport, until it comes near.
+ */
+export declare function useHeldServerHtml(eligible: boolean, nodeId: string): boolean;
+/**
+ * Is every node in this subtree a component that declared `lazyHydration`?
+ * Cached per node OBJECT: a published page's tree does not change under it,
+ * and the editor, whose tree does, never turns deferral on.
+ */
+export declare function isLazyHydrationSubtree(node: Aglyn.NodeSchema<any>): boolean;
+/** May this node hold its server HTML: a static subtree under a plain root? */
+export declare function mayHoldServerHtml(node: Aglyn.NodeSchema<any> | undefined): boolean;
+/** Test seam: forget every hold, and that the tree ever hydrated. */
+export declare function resetDeferredHydrationForTests(): void;

package/src/lib/components/deferred-hydration.js

@@ -0,0 +1,225 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ // Type-only, for the reason in `stem.tsx`.
+import { components } from "@aglyn/aglyn/aglyn";
+import { FEATURE_FLAG } from "@aglyn/aglyn/foundation/constants/shared";
+import { isNamespacedComponentId } from "@aglyn/aglyn/plugin-manager/plugin-contributions";
+import { useCallback, useState, useSyncExternalStore } from "react";
+/**
+ * Static subtrees of a published page skip hydration until the visitor
+ * nears them (AGL-3581).
+ *
+ * ## What it does
+ *
+ * A published page arrives as complete server HTML, and before this every
+ * node of it hydrated at once: on `aglyn.com/` that was ~600 elements and the
+ * largest single long task of the load. Most of them are copy, images and
+ * layout — nothing a visitor operates — so hydrating them buys nothing until
+ * the visitor reaches them.
+ *
+ * While the page hydrates, a static subtree that is not near the viewport
+ * renders its root element with `dangerouslySetInnerHTML` in place of its
+ * children. React hydrates that root and treats its contents as markup it
+ * does not own, so the server's HTML stays exactly as it is — painted,
+ * selectable, links working natively — and none of it costs hydration. When
+ * the subtree comes within {@link NEAR_VIEWPORT_PX} of the viewport the
+ * children render, and React builds them on the client in place of the held
+ * markup: the same HTML, now live.
+ *
+ * ## Why not a Suspense boundary
+ *
+ * A boundary that suspends during hydration would keep the server HTML and
+ * hydrate it in place, which is the textbook mechanism. React 19.2's server
+ * renderer outlines every boundary over 500 bytes once the shell passes its
+ * progressive chunk size (12.8 KB, not configurable through Next): each one
+ * ships in a hidden `<div>` revealed by an inline script on a later animation
+ * frame. That is content missing from first paint, a layout shift when it
+ * appears, nothing at all in a background tab, and markup a non-rendering
+ * crawler reads as hidden. A held root changes nothing in the server HTML.
+ *
+ * ## Which subtrees
+ *
+ * Every component in the subtree declares `flags.lazyHydration` — nothing in
+ * it responds to the visitor before hydration beyond what HTML does on its
+ * own — so the safe answer is the default: an element without the flag keeps
+ * its whole ancestry hydrating now. The subtree's ROOT also declares
+ * `flags.childrenInRoot`, the contract that lets it take
+ * `dangerouslySetInnerHTML` instead of its children.
+ *
+ * A subtree near the viewport at hydration is not held, and its children
+ * hydrate normally — each of them then decides for itself. So a page-wide
+ * static wrapper does not hold the whole page: it hydrates, and the sections
+ * inside it that are further down are what wait.
+ *
+ * ## Only during hydration
+ *
+ * The decision is taken once, when the leaf first renders, and only if that
+ * render is part of the tree's first commit (see `treeHydrated`). A subtree
+ * mounted by a client-side navigation renders at once and can never be left
+ * empty.
+ *
+ * ## Interaction before release
+ *
+ * Nothing is released on a press: that would replace the element under the
+ * visitor's finger between `pointerdown` and `click`, and the click would be
+ * lost. The held HTML already does what a static element does — a link
+ * navigates, text selects, focus moves.
+ *
+ * ## Fails open
+ *
+ * If the leaf's element is not in the document, or the browser has no
+ * `IntersectionObserver`, nothing is held: the worst case is the old
+ * behavior.
+ */ /** How far outside the viewport a held subtree renders, in pixels. */ export const NEAR_VIEWPORT_PX = 600;
+const LEAF_ATTRIBUTE = 'data-aglyn';
+const LEAF_PREFIX = 'leaf:';
+/** The empty markup a held root is given, and React leaves alone. */ export const HELD_SERVER_HTML = Object.freeze({
+    __html: ''
+});
+const holds = new Map();
+let observer = null;
+function release(nodeId) {
+    const hold = holds.get(nodeId);
+    if (!hold || hold.released) return;
+    hold.released = true;
+    for (const listener of [
+        ...hold.listeners
+    ])listener();
+}
+function nearViewportObserver() {
+    if (observer) return observer;
+    if (typeof IntersectionObserver !== 'function') return null;
+    observer = new IntersectionObserver((entries)=>{
+        for (const entry of entries){
+            var _entry_target_getAttribute;
+            if (!entry.isIntersecting) continue;
+            observer == null ? void 0 : observer.unobserve(entry.target);
+            const value = (_entry_target_getAttribute = entry.target.getAttribute(LEAF_ATTRIBUTE)) != null ? _entry_target_getAttribute : '';
+            release(value.slice(LEAF_PREFIX.length));
+        }
+    }, {
+        rootMargin: `${NEAR_VIEWPORT_PX}px 0px`
+    });
+    return observer;
+}
+function findLeafElement(nodeId) {
+    try {
+        // A quoted attribute value needs only its quote and backslash escaped.
+        const value = `${LEAF_PREFIX}${nodeId}`.replace(/["\\]/g, '\\$&');
+        return document.querySelector(`[${LEAF_ATTRIBUTE}="${value}"]`);
+    } catch (unused) {
+        return null;
+    }
+}
+function nearViewport(element) {
+    const { top, bottom } = element.getBoundingClientRect();
+    return bottom >= -NEAR_VIEWPORT_PX && top <= window.innerHeight + NEAR_VIEWPORT_PX;
+}
+/**
+ * Hold this node's server HTML? Idempotent per node, because React may run a
+ * render's state initializer more than once before it commits.
+ */ function holdIfFar(nodeId) {
+    const existing = holds.get(nodeId);
+    if (existing) return !existing.released;
+    const element = findLeafElement(nodeId);
+    const io = element ? nearViewportObserver() : null;
+    if (!element || !io || nearViewport(element)) return false;
+    holds.set(nodeId, {
+        released: false,
+        listeners: new Set()
+    });
+    io.observe(element);
+    return true;
+}
+/**
+ * Has the published tree committed its first render? Until it has, every
+ * leaf rendering on the client is hydrating. Set from `TreeRoot`'s effect,
+ * which runs after the whole first commit — so it is false for every leaf of
+ * the hydration and true for anything a later navigation mounts.
+ *
+ * A module flag rather than `useSyncExternalStore`'s server snapshot: a store
+ * whose client and server snapshots differ makes React re-render every
+ * component reading it right after hydration, which here would be every leaf
+ * on the page — the work this module exists to avoid.
+ */ let treeHydrated = false;
+/** Called by `TreeRoot` once its first commit has landed. */ export function markTreeHydrated() {
+    treeHydrated = true;
+}
+/**
+ * Should this leaf render its root with {@link HELD_SERVER_HTML} instead of
+ * its children? True only from a hydration render of an `eligible` leaf that
+ * is far from the viewport, until it comes near.
+ */ export function useHeldServerHtml(eligible, nodeId) {
+    const [held] = useState(()=>eligible && !treeHydrated && typeof document !== 'undefined' && holdIfFar(nodeId));
+    const subscribe = useCallback((listener)=>{
+        const hold = holds.get(nodeId);
+        if (!hold) return ()=>undefined;
+        hold.listeners.add(listener);
+        return ()=>{
+            hold.listeners.delete(listener);
+        };
+    }, [
+        nodeId
+    ]);
+    // Both snapshots read `false` for a leaf that holds nothing, so no leaf is
+    // re-rendered for having read this store.
+    const released = useSyncExternalStore(subscribe, ()=>{
+        var _ref;
+        var _holds_get;
+        return (_ref = (_holds_get = holds.get(nodeId)) == null ? void 0 : _holds_get.released) != null ? _ref : false;
+    }, ()=>false);
+    return held && !released;
+}
+const staticSubtrees = new WeakMap();
+function declares(componentId, flag) {
+    var _ref;
+    var _components_getSchema_flags, _components_getSchema;
+    if (!componentId || isNamespacedComponentId(componentId)) return false;
+    const value = (_ref = (_components_getSchema = components.getSchema(componentId)) == null ? void 0 : (_components_getSchema_flags = _components_getSchema.flags) == null ? void 0 : _components_getSchema_flags[flag]) != null ? _ref : 0;
+    return Boolean(value & FEATURE_FLAG.ENABLED);
+}
+/**
+ * Is every node in this subtree a component that declared `lazyHydration`?
+ * Cached per node OBJECT: a published page's tree does not change under it,
+ * and the editor, whose tree does, never turns deferral on.
+ */ export function isLazyHydrationSubtree(node) {
+    const cached = staticSubtrees.get(node);
+    if (cached !== undefined) return cached;
+    let answer = declares(node.componentId, 'lazyHydration');
+    if (answer) {
+        var _node_children;
+        for (const child of (_node_children = node.children) != null ? _node_children : []){
+            if (!child || !isLazyHydrationSubtree(child)) {
+                answer = false;
+                break;
+            }
+        }
+    }
+    staticSubtrees.set(node, answer);
+    return answer;
+}
+/** May this node hold its server HTML: a static subtree under a plain root? */ export function mayHoldServerHtml(node) {
+    var _node_children;
+    return Boolean((node == null ? void 0 : (_node_children = node.children) == null ? void 0 : _node_children.length) && declares(node.componentId, 'childrenInRoot') && isLazyHydrationSubtree(node));
+}
+/** Test seam: forget every hold, and that the tree ever hydrated. */ export function resetDeferredHydrationForTests() {
+    treeHydrated = false;
+    holds.clear();
+    observer == null ? void 0 : observer.disconnect();
+    observer = null;
+}
+
+//# sourceMappingURL=deferred-hydration.js.map

package/src/lib/components/deferred-hydration.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../libs/aglyn-node-renderer/src/lib/components/deferred-hydration.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// Type-only, for the reason in `stem.tsx`.\nimport type * as Aglyn from '@aglyn/aglyn'\nimport { components } from '@aglyn/aglyn/aglyn'\nimport { FEATURE_FLAG } from '@aglyn/aglyn/foundation/constants/shared'\nimport { isNamespacedComponentId } from '@aglyn/aglyn/plugin-manager/plugin-contributions'\nimport { useCallback, useState, useSyncExternalStore } from 'react'\n\n/**\n * Static subtrees of a published page skip hydration until the visitor\n * nears them (AGL-3581).\n *\n * ## What it does\n *\n * A published page arrives as complete server HTML, and before this every\n * node of it hydrated at once: on `aglyn.com/` that was ~600 elements and the\n * largest single long task of the load. Most of them are copy, images and\n * layout — nothing a visitor operates — so hydrating them buys nothing until\n * the visitor reaches them.\n *\n * While the page hydrates, a static subtree that is not near the viewport\n * renders its root element with `dangerouslySetInnerHTML` in place of its\n * children. React hydrates that root and treats its contents as markup it\n * does not own, so the server's HTML stays exactly as it is — painted,\n * selectable, links working natively — and none of it costs hydration. When\n * the subtree comes within {@link NEAR_VIEWPORT_PX} of the viewport the\n * children render, and React builds them on the client in place of the held\n * markup: the same HTML, now live.\n *\n * ## Why not a Suspense boundary\n *\n * A boundary that suspends during hydration would keep the server HTML and\n * hydrate it in place, which is the textbook mechanism. React 19.2's server\n * renderer outlines every boundary over 500 bytes once the shell passes its\n * progressive chunk size (12.8 KB, not configurable through Next): each one\n * ships in a hidden `<div>` revealed by an inline script on a later animation\n * frame. That is content missing from first paint, a layout shift when it\n * appears, nothing at all in a background tab, and markup a non-rendering\n * crawler reads as hidden. A held root changes nothing in the server HTML.\n *\n * ## Which subtrees\n *\n * Every component in the subtree declares `flags.lazyHydration` — nothing in\n * it responds to the visitor before hydration beyond what HTML does on its\n * own — so the safe answer is the default: an element without the flag keeps\n * its whole ancestry hydrating now. The subtree's ROOT also declares\n * `flags.childrenInRoot`, the contract that lets it take\n * `dangerouslySetInnerHTML` instead of its children.\n *\n * A subtree near the viewport at hydration is not held, and its children\n * hydrate normally — each of them then decides for itself. So a page-wide\n * static wrapper does not hold the whole page: it hydrates, and the sections\n * inside it that are further down are what wait.\n *\n * ## Only during hydration\n *\n * The decision is taken once, when the leaf first renders, and only if that\n * render is part of the tree's first commit (see `treeHydrated`). A subtree\n * mounted by a client-side navigation renders at once and can never be left\n * empty.\n *\n * ## Interaction before release\n *\n * Nothing is released on a press: that would replace the element under the\n * visitor's finger between `pointerdown` and `click`, and the click would be\n * lost. The held HTML already does what a static element does — a link\n * navigates, text selects, focus moves.\n *\n * ## Fails open\n *\n * If the leaf's element is not in the document, or the browser has no\n * `IntersectionObserver`, nothing is held: the worst case is the old\n * behavior.\n */\n\n/** How far outside the viewport a held subtree renders, in pixels. */\nexport const NEAR_VIEWPORT_PX = 600\n\nconst LEAF_ATTRIBUTE = 'data-aglyn'\nconst LEAF_PREFIX = 'leaf:'\n\n/** The empty markup a held root is given, and React leaves alone. */\nexport const HELD_SERVER_HTML = Object.freeze({ __html: '' })\n\ninterface Hold {\n  released: boolean\n  readonly listeners: Set<() => void>\n}\n\nconst holds = new Map<string, Hold>()\nlet observer: IntersectionObserver | null = null\n\nfunction release(nodeId: string): void {\n  const hold = holds.get(nodeId)\n  if (!hold || hold.released) return\n  hold.released = true\n  for (const listener of [...hold.listeners]) listener()\n}\n\nfunction nearViewportObserver(): IntersectionObserver | null {\n  if (observer) return observer\n  if (typeof IntersectionObserver !== 'function') return null\n  observer = new IntersectionObserver(\n    (entries) => {\n      for (const entry of entries) {\n        if (!entry.isIntersecting) continue\n        observer?.unobserve(entry.target)\n        const value = entry.target.getAttribute(LEAF_ATTRIBUTE) ?? ''\n        release(value.slice(LEAF_PREFIX.length))\n      }\n    },\n    { rootMargin: `${NEAR_VIEWPORT_PX}px 0px` },\n  )\n  return observer\n}\n\nfunction findLeafElement(nodeId: string): Element | null {\n  try {\n    // A quoted attribute value needs only its quote and backslash escaped.\n    const value = `${LEAF_PREFIX}${nodeId}`.replace(/[\"\\\\]/g, '\\\\$&')\n    return document.querySelector(`[${LEAF_ATTRIBUTE}=\"${value}\"]`)\n  } catch {\n    return null\n  }\n}\n\nfunction nearViewport(element: Element): boolean {\n  const { top, bottom } = element.getBoundingClientRect()\n  return (\n    bottom >= -NEAR_VIEWPORT_PX && top <= window.innerHeight + NEAR_VIEWPORT_PX\n  )\n}\n\n/**\n * Hold this node's server HTML? Idempotent per node, because React may run a\n * render's state initializer more than once before it commits.\n */\nfunction holdIfFar(nodeId: string): boolean {\n  const existing = holds.get(nodeId)\n  if (existing) return !existing.released\n  const element = findLeafElement(nodeId)\n  const io = element ? nearViewportObserver() : null\n  if (!element || !io || nearViewport(element)) return false\n  holds.set(nodeId, { released: false, listeners: new Set() })\n  io.observe(element)\n  return true\n}\n\n/**\n * Has the published tree committed its first render? Until it has, every\n * leaf rendering on the client is hydrating. Set from `TreeRoot`'s effect,\n * which runs after the whole first commit — so it is false for every leaf of\n * the hydration and true for anything a later navigation mounts.\n *\n * A module flag rather than `useSyncExternalStore`'s server snapshot: a store\n * whose client and server snapshots differ makes React re-render every\n * component reading it right after hydration, which here would be every leaf\n * on the page — the work this module exists to avoid.\n */\nlet treeHydrated = false\n\n/** Called by `TreeRoot` once its first commit has landed. */\nexport function markTreeHydrated(): void {\n  treeHydrated = true\n}\n\n/**\n * Should this leaf render its root with {@link HELD_SERVER_HTML} instead of\n * its children? True only from a hydration render of an `eligible` leaf that\n * is far from the viewport, until it comes near.\n */\nexport function useHeldServerHtml(eligible: boolean, nodeId: string): boolean {\n  const [held] = useState(\n    () =>\n      eligible &&\n      !treeHydrated &&\n      typeof document !== 'undefined' &&\n      holdIfFar(nodeId),\n  )\n  const subscribe = useCallback(\n    (listener: () => void) => {\n      const hold = holds.get(nodeId)\n      if (!hold) return () => undefined\n      hold.listeners.add(listener)\n      return () => {\n        hold.listeners.delete(listener)\n      }\n    },\n    [nodeId],\n  )\n  // Both snapshots read `false` for a leaf that holds nothing, so no leaf is\n  // re-rendered for having read this store.\n  const released = useSyncExternalStore(\n    subscribe,\n    () => holds.get(nodeId)?.released ?? false,\n    () => false,\n  )\n  return held && !released\n}\n\nconst staticSubtrees = new WeakMap<object, boolean>()\n\nfunction declares(\n  componentId: string | undefined,\n  flag: 'lazyHydration' | 'childrenInRoot',\n): boolean {\n  if (!componentId || isNamespacedComponentId(componentId)) return false\n  const value = components.getSchema(componentId)?.flags?.[flag] ?? 0\n  return Boolean(value & FEATURE_FLAG.ENABLED)\n}\n\n/**\n * Is every node in this subtree a component that declared `lazyHydration`?\n * Cached per node OBJECT: a published page's tree does not change under it,\n * and the editor, whose tree does, never turns deferral on.\n */\nexport function isLazyHydrationSubtree(node: Aglyn.NodeSchema<any>): boolean {\n  const cached = staticSubtrees.get(node)\n  if (cached !== undefined) return cached\n  let answer = declares(node.componentId, 'lazyHydration')\n  if (answer) {\n    for (const child of (node.children ?? []) as Aglyn.NodeSchema<any>[]) {\n      if (!child || !isLazyHydrationSubtree(child)) {\n        answer = false\n        break\n      }\n    }\n  }\n  staticSubtrees.set(node, answer)\n  return answer\n}\n\n/** May this node hold its server HTML: a static subtree under a plain root? */\nexport function mayHoldServerHtml(\n  node: Aglyn.NodeSchema<any> | undefined,\n): boolean {\n  return Boolean(\n    node?.children?.length &&\n      declares(node.componentId, 'childrenInRoot') &&\n      isLazyHydrationSubtree(node),\n  )\n}\n\n/** Test seam: forget every hold, and that the tree ever hydrated. */\nexport function resetDeferredHydrationForTests(): void {\n  treeHydrated = false\n  holds.clear()\n  observer?.disconnect()\n  observer = null\n}\n"],"names":["components","FEATURE_FLAG","isNamespacedComponentId","useCallback","useState","useSyncExternalStore","NEAR_VIEWPORT_PX","LEAF_ATTRIBUTE","LEAF_PREFIX","HELD_SERVER_HTML","Object","freeze","__html","holds","Map","observer","release","nodeId","hold","get","released","listener","listeners","nearViewportObserver","IntersectionObserver","entries","entry","isIntersecting","unobserve","target","value","getAttribute","slice","length","rootMargin","findLeafElement","replace","document","querySelector","nearViewport","element","top","bottom","getBoundingClientRect","window","innerHeight","holdIfFar","existing","io","set","Set","observe","treeHydrated","markTreeHydrated","useHeldServerHtml","eligible","held","subscribe","undefined","add","delete","staticSubtrees","WeakMap","declares","componentId","flag","getSchema","flags","Boolean","ENABLED","isLazyHydrationSubtree","node","cached","answer","child","children","mayHoldServerHtml","resetDeferredHydrationForTests","clear","disconnect"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GAED,2CAA2C;AAE3C,SAASA,UAAU,QAAQ,qBAAoB;AAC/C,SAASC,YAAY,QAAQ,2CAA0C;AACvE,SAASC,uBAAuB,QAAQ,mDAAkD;AAC1F,SAASC,WAAW,EAAEC,QAAQ,EAAEC,oBAAoB,QAAQ,QAAO;AAEnE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiEC,GAED,oEAAoE,GACpE,OAAO,MAAMC,mBAAmB,IAAG;AAEnC,MAAMC,iBAAiB;AACvB,MAAMC,cAAc;AAEpB,mEAAmE,GACnE,OAAO,MAAMC,mBAAmBC,OAAOC,MAAM,CAAC;IAAEC,QAAQ;AAAG,GAAE;AAO7D,MAAMC,QAAQ,IAAIC;AAClB,IAAIC,WAAwC;AAE5C,SAASC,QAAQC,MAAc;IAC7B,MAAMC,OAAOL,MAAMM,GAAG,CAACF;IACvB,IAAI,CAACC,QAAQA,KAAKE,QAAQ,EAAE;IAC5BF,KAAKE,QAAQ,GAAG;IAChB,KAAK,MAAMC,YAAY;WAAIH,KAAKI,SAAS;KAAC,CAAED;AAC9C;AAEA,SAASE;IACP,IAAIR,UAAU,OAAOA;IACrB,IAAI,OAAOS,yBAAyB,YAAY,OAAO;IACvDT,WAAW,IAAIS,qBACb,CAACC;QACC,KAAK,MAAMC,SAASD,QAAS;gBAGbC;YAFd,IAAI,CAACA,MAAMC,cAAc,EAAE;YAC3BZ,4BAAAA,SAAUa,SAAS,CAACF,MAAMG,MAAM;YAChC,MAAMC,SAAQJ,6BAAAA,MAAMG,MAAM,CAACE,YAAY,CAACxB,2BAA1BmB,6BAA6C;YAC3DV,QAAQc,MAAME,KAAK,CAACxB,YAAYyB,MAAM;QACxC;IACF,GACA;QAAEC,YAAY,GAAG5B,iBAAiB,MAAM,CAAC;IAAC;IAE5C,OAAOS;AACT;AAEA,SAASoB,gBAAgBlB,MAAc;IACrC,IAAI;QACF,uEAAuE;QACvE,MAAMa,QAAQ,GAAGtB,cAAcS,QAAQ,CAACmB,OAAO,CAAC,UAAU;QAC1D,OAAOC,SAASC,aAAa,CAAC,CAAC,CAAC,EAAE/B,eAAe,EAAE,EAAEuB,MAAM,EAAE,CAAC;IAChE,EAAE,eAAM;QACN,OAAO;IACT;AACF;AAEA,SAASS,aAAaC,OAAgB;IACpC,MAAM,EAAEC,GAAG,EAAEC,MAAM,EAAE,GAAGF,QAAQG,qBAAqB;IACrD,OACED,UAAU,CAACpC,oBAAoBmC,OAAOG,OAAOC,WAAW,GAAGvC;AAE/D;AAEA;;;CAGC,GACD,SAASwC,UAAU7B,MAAc;IAC/B,MAAM8B,WAAWlC,MAAMM,GAAG,CAACF;IAC3B,IAAI8B,UAAU,OAAO,CAACA,SAAS3B,QAAQ;IACvC,MAAMoB,UAAUL,gBAAgBlB;IAChC,MAAM+B,KAAKR,UAAUjB,yBAAyB;IAC9C,IAAI,CAACiB,WAAW,CAACQ,MAAMT,aAAaC,UAAU,OAAO;IACrD3B,MAAMoC,GAAG,CAAChC,QAAQ;QAAEG,UAAU;QAAOE,WAAW,IAAI4B;IAAM;IAC1DF,GAAGG,OAAO,CAACX;IACX,OAAO;AACT;AAEA;;;;;;;;;;CAUC,GACD,IAAIY,eAAe;AAEnB,2DAA2D,GAC3D,OAAO,SAASC;IACdD,eAAe;AACjB;AAEA;;;;CAIC,GACD,OAAO,SAASE,kBAAkBC,QAAiB,EAAEtC,MAAc;IACjE,MAAM,CAACuC,KAAK,GAAGpD,SACb,IACEmD,YACA,CAACH,gBACD,OAAOf,aAAa,eACpBS,UAAU7B;IAEd,MAAMwC,YAAYtD,YAChB,CAACkB;QACC,MAAMH,OAAOL,MAAMM,GAAG,CAACF;QACvB,IAAI,CAACC,MAAM,OAAO,IAAMwC;QACxBxC,KAAKI,SAAS,CAACqC,GAAG,CAACtC;QACnB,OAAO;YACLH,KAAKI,SAAS,CAACsC,MAAM,CAACvC;QACxB;IACF,GACA;QAACJ;KAAO;IAEV,2EAA2E;IAC3E,0CAA0C;IAC1C,MAAMG,WAAWf,qBACfoD,WACA;;YAAM5C;wBAAAA,aAAAA,MAAMM,GAAG,CAACF,4BAAVJ,WAAmBO,QAAQ,mBAAI;OACrC,IAAM;IAER,OAAOoC,QAAQ,CAACpC;AAClB;AAEA,MAAMyC,iBAAiB,IAAIC;AAE3B,SAASC,SACPC,WAA+B,EAC/BC,IAAwC;;QAG1BjE,6BAAAA;IADd,IAAI,CAACgE,eAAe9D,wBAAwB8D,cAAc,OAAO;IACjE,MAAMlC,iBAAQ9B,wBAAAA,WAAWkE,SAAS,CAACF,kCAArBhE,8BAAAA,sBAAmCmE,KAAK,qBAAxCnE,2BAA0C,CAACiE,KAAK,mBAAI;IAClE,OAAOG,QAAQtC,QAAQ7B,aAAaoE,OAAO;AAC7C;AAEA;;;;CAIC,GACD,OAAO,SAASC,uBAAuBC,IAA2B;IAChE,MAAMC,SAASX,eAAe1C,GAAG,CAACoD;IAClC,IAAIC,WAAWd,WAAW,OAAOc;IACjC,IAAIC,SAASV,SAASQ,KAAKP,WAAW,EAAE;IACxC,IAAIS,QAAQ;YACWF;QAArB,KAAK,MAAMG,UAAUH,iBAAAA,KAAKI,QAAQ,YAAbJ,iBAAiB,EAAE,CAA8B;YACpE,IAAI,CAACG,SAAS,CAACJ,uBAAuBI,QAAQ;gBAC5CD,SAAS;gBACT;YACF;QACF;IACF;IACAZ,eAAeZ,GAAG,CAACsB,MAAME;IACzB,OAAOA;AACT;AAEA,6EAA6E,GAC7E,OAAO,SAASG,kBACdL,IAAuC;QAGrCA;IADF,OAAOH,QACLG,CAAAA,yBAAAA,iBAAAA,KAAMI,QAAQ,qBAAdJ,eAAgBtC,MAAM,KACpB8B,SAASQ,KAAKP,WAAW,EAAE,qBAC3BM,uBAAuBC;AAE7B;AAEA,mEAAmE,GACnE,OAAO,SAASM;IACdzB,eAAe;IACfvC,MAAMiE,KAAK;IACX/D,4BAAAA,SAAUgE,UAAU;IACpBhE,WAAW;AACb"}

package/src/lib/components/leaf.js

@@ -46,10 +46,18 @@ import { isValidElementType } from "react-is";
 import RendererComponents from "../contexts/renderer-components.js";
 import { LeafSxTransformContext } from "../contexts/leaf-sx-transform.js";
 import { RealmBoundaryContext } from "../contexts/realm-boundary.js";
+import { DeferredHydrationContext } from "../contexts/deferred-hydration.js";
+import { HELD_SERVER_HTML, mayHoldServerHtml, useHeldServerHtml } from "./deferred-hydration.js";
 import { resolvePaletteVarsSx, resolveSchemeSx } from "../utils/scheme-sx.js";
 const DefaultComponent = styled('div')({});
+/** Leaf props with any `children` a resolved prop carried, for a held root. */ function withoutChildren(props) {
+    const { children: _children } = props, rest = _object_without_properties_loose(props, [
+        "children"
+    ]);
+    return rest;
+}
 export const Leaf = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
-    var _ref, _ref1, _ref2, _ref3, _ref4, _ref5;
+    var _ref, _ref1, _ref2, _ref3, _ref4, _ref5, _ref6;
     var _schema_flags, _theme_palette, _forcedTheme_palette, _schema_flags1;
     const { children, node, sx, className, style } = props, rest = _object_without_properties_loose(props, [
         "children",
@@ -68,7 +76,7 @@ export const Leaf = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
     // purpose (the author has to see and select the part a page will hide),
     // and there the raw `hideIf` would spread onto the element as an
     // unknown `hideif` DOM attribute.
-    const _ref6 = (_ref = (_ref1 = node == null ? void 0 : node.resolvedProps) != null ? _ref1 : node == null ? void 0 : node.props) != null ? _ref : {}, { sx: propsSx, className: propsClassName, style: propsStyle, [NODE_HIDE_IF_PROP]: _hideIf, [NODE_HIDE_UNLESS_PROP]: _hideUnless, // Element animation (AGL-2486): the reserved animation props come
+    const _ref7 = (_ref = (_ref1 = node == null ? void 0 : node.resolvedProps) != null ? _ref1 : node == null ? void 0 : node.props) != null ? _ref : {}, { sx: propsSx, className: propsClassName, style: propsStyle, [NODE_HIDE_IF_PROP]: _hideIf, [NODE_HIDE_UNLESS_PROP]: _hideUnless, // Element animation (AGL-2486): the reserved animation props come
     // out here for the same reason the visibility directives above do —
     // they are directives to the RENDERER, and spreading them onto the
     // element would land `aglynanimation="slide-up"` as an unknown DOM
@@ -78,7 +86,7 @@ export const Leaf = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
     // shape.
     [NODE_ANIMATION_PROP]: _animation, [NODE_ANIMATION_TRIGGER_PROP]: _animationTrigger, [NODE_ANIMATION_DURATION_PROP]: _animationDuration, [NODE_ANIMATION_DELAY_PROP]: _animationDelay, [NODE_ANIMATION_REPEAT_PROP]: _animationRepeat, [NODE_ANIMATION_EASE_PROP]: _animationEase, [NODE_ANIMATION_STAGGER_PROP]: _animationStagger, [NODE_ANIMATION_STAGGER_STEP_PROP]: _animationStaggerStep, // A pinned color scheme (AGL-3284) is a directive to the renderer, like
     // the two groups above: consumed below, never handed to the component.
-    [NODE_COLOR_SCHEME_PROP]: _colorScheme } = _ref6, resolvedProps = _object_without_properties_loose(_ref6, [
+    [NODE_COLOR_SCHEME_PROP]: _colorScheme } = _ref7, resolvedProps = _object_without_properties_loose(_ref7, [
         "sx",
         "className",
         "style",
@@ -175,6 +183,12 @@ export const Leaf = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
     const pinnedScheme = resolveElementColorScheme(_colorScheme);
     const schemeThemes = useSiteSchemeThemes();
     const forcedTheme = pinnedScheme && pinnedScheme !== activeScheme && schemeThemes ? schemeThemes(pinnedScheme) : undefined;
+    // A static subtree far from the viewport keeps its server HTML through
+    // hydration and renders when the visitor nears it (AGL-3581). Only on a
+    // tree that asked for it — the published page — and decided once, on the
+    // leaf's first render. See `deferred-hydration.tsx`.
+    const deferHydration = useContext(DeferredHydrationContext);
+    const holdServerHtml = useHeldServerHtml(deferHydration && !offForSite && mayHoldServerHtml(node), (_ref3 = node == null ? void 0 : node.$id) != null ? _ref3 : '');
     // Each realm element hydrates in a boundary of its own (AGL-3390), so one
     // waiting for its bundle holds only itself. Rendered on the server too:
     // the browser's tree has to have the same boundary to hydrate into.
@@ -276,9 +290,13 @@ export const Leaf = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
     // React child per node child. The default single `<Branch>` element reads
     // as ONE child to `Children.toArray`, so the first slot swallowed the
     // whole subtree and every later slot got nothing.
-    const positional = Boolean(((_ref3 = schema == null ? void 0 : (_schema_flags1 = schema.flags) == null ? void 0 : _schema_flags1.positionalChildren) != null ? _ref3 : 0) & FEATURE_FLAG.ENABLED);
-    const childNodes = positional ? (_ref4 = node == null ? void 0 : node.children) != null ? _ref4 : [] : null;
-    const element = selfClosing ? /*#__PURE__*/ _jsx(Component, _extends({}, leafProps)) : positional ? /*#__PURE__*/ _jsx(RendererComponents.Consumer, {
+    const positional = Boolean(((_ref4 = schema == null ? void 0 : (_schema_flags1 = schema.flags) == null ? void 0 : _schema_flags1.positionalChildren) != null ? _ref4 : 0) & FEATURE_FLAG.ENABLED);
+    const childNodes = positional ? (_ref5 = node == null ? void 0 : node.children) != null ? _ref5 : [] : null;
+    const element = holdServerHtml ? // The root hydrates; its contents stay the server's until released.
+    /*#__PURE__*/ _jsx(Component, _extends({}, withoutChildren(leafProps), {
+        dangerouslySetInnerHTML: HELD_SERVER_HTML,
+        suppressHydrationWarning: true
+    })) : selfClosing ? /*#__PURE__*/ _jsx(Component, _extends({}, leafProps)) : positional ? /*#__PURE__*/ _jsx(RendererComponents.Consumer, {
         children: ({ StemComponent })=>/*#__PURE__*/ _jsxs(Component, _extends({}, leafProps, {
                 children: [
                     childNodes.map((child, key)=>{
@@ -301,7 +319,7 @@ export const Leaf = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
         ]
     }));
     return /*#__PURE__*/ _jsx(NodeIdentityContext.Provider, {
-        value: (_ref5 = node == null ? void 0 : node.$id) != null ? _ref5 : '',
+        value: (_ref6 = node == null ? void 0 : node.$id) != null ? _ref6 : '',
         children: element
     });
 }));

package/src/lib/components/leaf.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../libs/aglyn-node-renderer/src/lib/components/leaf.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2023 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// Type-only, with every value this file reads named below (AGL-2486's rule,\n// applied to the render path's hottest file): a VALUE namespace import of the\n// core barrel is opaque to a bundler — it cannot know which exports are read,\n// so every module the barrel reaches is pinned into the published page's first\n// load.\nimport type * as Aglyn from '@aglyn/aglyn'\nimport { components } from '@aglyn/aglyn/aglyn'\nimport { sanitizeAuthorSx } from '@aglyn/aglyn/app-utils/author-css'\nimport { pinRampedTypographySx } from '@aglyn/aglyn/app-utils/responsive-typography-sx'\nimport {\n  NODE_HIDE_IF_PROP,\n  NODE_HIDE_UNLESS_PROP,\n} from '@aglyn/aglyn/app-utils/reusable-component-keys'\nimport {\n  NODE_ANIMATION_DELAY_PROP,\n  NODE_ANIMATION_DURATION_PROP,\n  NODE_ANIMATION_EASE_PROP,\n  NODE_ANIMATION_PROP,\n  NODE_ANIMATION_REPEAT_PROP,\n  NODE_ANIMATION_STAGGER_PROP,\n  NODE_ANIMATION_STAGGER_STEP_PROP,\n  NODE_ANIMATION_TRIGGER_PROP,\n  resolveElementAnimation,\n} from '@aglyn/aglyn/app-utils/element-animation'\nimport {\n  EnabledPluginsContext,\n  isSwitchedOffForRenderedSite,\n} from '@aglyn/aglyn/app-utils/enabled-plugins-context'\nimport { NodeIdentityContext } from '@aglyn/aglyn/app-utils/node-identity'\nimport {\n  NODE_COLOR_SCHEME_PROP,\n  resolveElementColorScheme,\n} from '@aglyn/aglyn/app-utils/element-color-scheme'\nimport { FEATURE_FLAG } from '@aglyn/aglyn/foundation/constants/shared'\n// Deep import, NOT the barrel: `@aglyn/shared-ui-jsx`'s index re-exports the\n// Pages Router hooks (`next/router`), the inline SVG icon set and the whole\n// ~12,000-module MDI catalog, none of which a rendered node needs. This file\n// is on every published page, so the barrel's reach is that page's reach.\nimport { AglynText } from '@aglyn/shared-ui-jsx/components/aglyn-text'\nimport {\n  styled,\n  ThemeProvider,\n  useSiteSchemeThemes,\n  useTheme,\n} from '@aglyn/shared-ui-theme'\nimport { mergeSxProps } from '@aglyn/shared-ui-theme'\nimport { observer } from 'mobx-react-lite'\nimport { isNamespacedComponentId } from '@aglyn/aglyn/plugin-manager/plugin-contributions'\nimport { RealmElementsContext } from '@aglyn/aglyn/app-utils/realm-elements-context'\nimport {\n  forwardRef,\n  type HTMLAttributes,\n  Suspense,\n  use,\n  useContext,\n} from 'react'\nimport { isValidElementType } from 'react-is'\nimport RendererComponents from '../contexts/renderer-components'\nimport { LeafSxTransformContext } from '../contexts/leaf-sx-transform'\nimport { RealmBoundaryContext } from '../contexts/realm-boundary'\nimport { resolvePaletteVarsSx, resolveSchemeSx } from '../utils/scheme-sx'\n\nconst DefaultComponent = styled('div')({})\n\nexport interface LeafProps extends HTMLAttributes<any> {\n  children?: any\n  node: Aglyn.NodeSchema\n  sx?: JSX.SxProps\n}\n\nexport const Leaf = observer(\n  forwardRef<any, LeafProps>((props, ref) => {\n    const { children, node, sx, className, style, ...rest } = props\n\n    // Pull sx/className/style out of the node's props so the spreads below\n    // can never clobber the merged values composed explicitly afterwards\n    // (AGL-569: `props.sx` used to overwrite the node-level sx entirely).\n    //\n    // The visibility directives (AGL-1314) come out here too. The compose\n    // step consumes and strips them, so a rendered page never carries one —\n    // but the component EDITOR renders definition nodes ungrafted, on\n    // purpose (the author has to see and select the part a page will hide),\n    // and there the raw `hideIf` would spread onto the element as an\n    // unknown `hideif` DOM attribute.\n    const {\n      sx: propsSx,\n      className: propsClassName,\n      style: propsStyle,\n      [NODE_HIDE_IF_PROP]: _hideIf,\n      [NODE_HIDE_UNLESS_PROP]: _hideUnless,\n      // Element animation (AGL-2486): the reserved animation props come\n      // out here for the same reason the visibility directives above do —\n      // they are directives to the RENDERER, and spreading them onto the\n      // element would land `aglynanimation=\"slide-up\"` as an unknown DOM\n      // attribute. Destructured rather than `delete`d after the fact so the\n      // `none` case is stripped too (it resolves to no animation, but it is\n      // still a prop an author saved) and so the props object keeps one\n      // shape.\n      [NODE_ANIMATION_PROP]: _animation,\n      [NODE_ANIMATION_TRIGGER_PROP]: _animationTrigger,\n      [NODE_ANIMATION_DURATION_PROP]: _animationDuration,\n      [NODE_ANIMATION_DELAY_PROP]: _animationDelay,\n      [NODE_ANIMATION_REPEAT_PROP]: _animationRepeat,\n      [NODE_ANIMATION_EASE_PROP]: _animationEase,\n      [NODE_ANIMATION_STAGGER_PROP]: _animationStagger,\n      [NODE_ANIMATION_STAGGER_STEP_PROP]: _animationStaggerStep,\n      // A pinned color scheme (AGL-3284) is a directive to the renderer, like\n      // the two groups above: consumed below, never handed to the component.\n      [NODE_COLOR_SCHEME_PROP]: _colorScheme,\n      ...resolvedProps\n    } = (node?.resolvedProps ?? node?.props ?? {}) as Record<string, any>\n\n    // Resolves to a class, a `data-` attribute and two custom properties; the\n    // keyframes themselves live in the tenant's stylesheet, so this costs no\n    // JS on any surface. The besigner canvas never ships that stylesheet\n    // (same posture as the AGL-562 hidden class), so an author sees the\n    // element in its normal, selectable, un-animated state while editing.\n    const animation = resolveElementAnimation({\n      [NODE_ANIMATION_PROP]: _animation,\n      [NODE_ANIMATION_TRIGGER_PROP]: _animationTrigger,\n      [NODE_ANIMATION_DURATION_PROP]: _animationDuration,\n      [NODE_ANIMATION_DELAY_PROP]: _animationDelay,\n      [NODE_ANIMATION_REPEAT_PROP]: _animationRepeat,\n      [NODE_ANIMATION_EASE_PROP]: _animationEase,\n      [NODE_ANIMATION_STAGGER_PROP]: _animationStagger,\n      [NODE_ANIMATION_STAGGER_STEP_PROP]: _animationStaggerStep,\n    })\n    // A component whose first-party plugin does not run on the rendered site\n    // is drawn exactly as an unregistered one is (AGL-3033): the registry is\n    // process-global and outlives the site that loaded the bundle, and the\n    // site's own browser never loads it. Its schema goes with it, so the\n    // void-element and positional flags cannot tell the server a different\n    // story from the client either.\n    const enabledPlugins = useContext(EnabledPluginsContext)\n    const registeredSchema = components.getSchema(node?.componentId)\n    const offForSite = isSwitchedOffForRenderedSite(\n      registeredSchema?.pluginId,\n      enabledPlugins,\n    )\n    const Factory = offForSite ? undefined : components.getFactory(node?.componentId)\n    // A signed marketplace plugin's element (AGL-3390) renders on the server,\n    // and the browser registers its component a moment later. Inside the\n    // element's own boundary (below) it waits for that load rather than\n    // hydrating the server's HTML as an unregistered element, which would\n    // not match it.\n    const realmElement = isNamespacedComponentId(node?.componentId)\n    const realmBoundary = useContext(RealmBoundaryContext)\n    const realmLoadFor = useContext(RealmElementsContext)\n    if (realmElement && realmBoundary === node?.$id && !Factory && !offForSite) {\n      const loading = realmLoadFor?.(node.componentId)\n      if (loading) use(loading)\n    }\n    const Component = isValidElementType(Factory) ? Factory : DefaultComponent\n\n    // Self-closing components (AGL-579): a component whose schema flags it\n    // selfClosing renders a void DOM element (e.g. Image -> <img>), and React\n    // throws during SSR when ANY children value reaches one — even the empty\n    // `[undefined, false]` the JSX below always produces. Rendering the whole\n    // page 500s off one image node (blog covers, AGL-579), so honor the flag\n    // here: no JSX children, and strip a stray `children` prop too.\n    const schema = offForSite ? undefined : registeredSchema\n    const selfClosing = Boolean(\n      (schema?.flags?.selfClosing ?? 0) & FEATURE_FLAG.ENABLED,\n    )\n    if (selfClosing) delete resolvedProps['children']\n\n    const textContent = selfClosing ? null : resolvedProps?.['children']\n\n    const mergedClassName =\n      [propsClassName, node?.className, className, animation?.className]\n        .filter(Boolean)\n        .join(' ') || undefined\n    // The animation's custom properties go in FIRST so an author who typed\n    // `--aglyn-anim-duration` into the Custom CSS tab still wins.\n    const mergedStyle =\n      animation || propsStyle || style\n        ? { ...animation?.style, ...propsStyle, ...style }\n        : undefined\n\n    // Canvas-only hook (AGL-581): the besigner provides a transform that\n    // re-targets viewport media queries at the artboard device width.\n    // Undefined everywhere else, keeping the tenant path unchanged.\n    const transformSx = useContext(LeafSxTransformContext)\n    // Scheme-scoped styles (AGL-588): sites swap a single-mode theme for\n    // light/dark (tenant HostThemeProvider, canvas useAglynSiteTheme), so\n    // '@scheme dark' sx slices resolve here against the ACTIVE theme's\n    // palette mode — the one signal that is correct in both places.\n    const theme = useTheme() as {\n      palette?: { mode?: string } & Record<string, unknown>\n    } | null\n    const activeScheme = theme?.palette?.mode === 'dark' ? 'dark' : 'light'\n    // \"Always light\" / \"Always dark\" (AGL-3284). When the pinned scheme is not\n    // the active one, the element re-renders itself under the site's theme\n    // for that scheme, so its OWN sx — not only its descendants' — resolves\n    // palette tokens and `@scheme dark` slices for the pinned scheme. The\n    // inner render then sees the pinned scheme as active and takes the plain\n    // path; the mode check below is what guarantees that, because a site with\n    // one theme for both schemes (a single `fallback`) hands back a theme\n    // whose mode never changes, and re-wrapping it would never terminate.\n    // No provider (an email render, a bare test) means nothing to force.\n    // Every hook above runs on both paths, so the early return keeps the\n    // hook order stable when an author flips the setting.\n    const pinnedScheme = resolveElementColorScheme(_colorScheme)\n    const schemeThemes = useSiteSchemeThemes()\n    const forcedTheme =\n      pinnedScheme && pinnedScheme !== activeScheme && schemeThemes\n        ? schemeThemes(pinnedScheme)\n        : undefined\n    // Each realm element hydrates in a boundary of its own (AGL-3390), so one\n    // waiting for its bundle holds only itself. Rendered on the server too:\n    // the browser's tree has to have the same boundary to hydrate into.\n    if (realmElement && realmBoundary !== node?.$id) {\n      return (\n        <Suspense fallback={null}>\n          <RealmBoundaryContext.Provider value={node?.$id}>\n            <Leaf {...props} ref={ref} />\n          </RealmBoundaryContext.Provider>\n        </Suspense>\n      )\n    }\n    if (forcedTheme && forcedTheme.palette?.mode === pinnedScheme) {\n      return (\n        <ThemeProvider theme={forcedTheme}>\n          <Leaf {...props} ref={ref} />\n        </ThemeProvider>\n      )\n    }\n    // MUI array composition: later entries win on key conflicts, so the\n    // node-level sx (Styles panel output) overrides props.sx.\n    //\n    // Palette token references (AGL-1331): the Background Fill field\n    // persists a token-bound gradient stop as\n    // `var(--mui-palette-primary-main, #00B0FF)`, because `backgroundImage`\n    // is NOT one of the sx keys MUI resolves against the palette. They are\n    // substituted here, against the site theme, so the canvas cannot pick\n    // up the console's `--mui-palette-*` and the tenant (whose theme has no\n    // CSS variables at all) still tracks palette changes. Values carrying\n    // no reference come back by identity.\n    // Author CSS (AGL-1725): `node.sx` is the Styles panel's output, and it\n    // is free text — `backgroundImage` is a first-class field and the Custom\n    // CSS tab is free-solo, so any property and any value can be typed. On a\n    // published site that lands in the visitor's document as a real `url()`,\n    // which no input validator and no lint rule can see. Scrubbed HERE, at\n    // the last point before the merge, so it also catches values already\n    // stored; `sx` and `props.sx` are OUR components' own styles and are\n    // deliberately left alone. The scrub is scheme-only and returns its\n    // input by identity when nothing is refused, so the overwhelmingly\n    // common case (no `url()` at all) costs one walk and no new object.\n    // Responsive type ramp: LAST of the three sx passes, and it has to be —\n    // it moves a scalar `fontSize` into the `xs` slice so the author's\n    // explicit size sorts after the variant's `responsiveFontSizes` at-rules,\n    // and the scheme pass above is what collapses a dark-scheme slice down\n    // into that same top level. Running it earlier would leave a dark\n    // override's font size unpinned.\n    //\n    // A pinned element paints its scheme's page background and text color\n    // (AGL-3284), UNDER every other style so an author's own background wins.\n    // Without it an \"Always dark\" band with no background of its own is\n    // light text on the light page behind it, and text that sets no color\n    // inherits the page's dark body color. `color-scheme` makes the browser's\n    // own controls and scrollbars inside the band match. Only a pinned\n    // element carries this, so an unpinned one renders exactly as before —\n    // and so does a pinned one on a surface with no site themes to pin to.\n    const authorSx = sanitizeAuthorSx(node?.sx)\n    const composedSx = pinRampedTypographySx(\n      resolvePaletteVarsSx(\n        resolveSchemeSx(\n          pinnedScheme && schemeThemes\n            ? mergeSxProps(\n                {\n                  colorScheme: pinnedScheme,\n                  color: 'text.primary',\n                  bgcolor: 'background.default',\n                } as any,\n                sx as any,\n                propsSx as any,\n                authorSx as any,\n              )\n            : mergeSxProps(sx as any, propsSx as any, authorSx as any),\n          activeScheme,\n        ),\n        theme?.palette,\n      ),\n    )\n    /**\n     * Author visibility — the eye on the hierarchy row.\n     *\n     * LAST, and deliberately so. It has to override the element's own\n     * display, not replace it: an author who hides a Stack laid out with\n     * `display: flex` gets that flex back the moment they show it again,\n     * because the stored style was never touched. Writing `display: none`\n     * into `node.sx` would have destroyed the value it overwrote, and there\n     * would be nothing left to restore.\n     *\n     * The same rule on both surfaces. A hidden element is absent from the\n     * published page and from the canvas — \"hidden\" that still renders in the\n     * editor is a preview of a page nobody will ever see.\n     */\n    const mergedSx = node?.hidden\n      ? mergeSxProps(composedSx as any, { display: 'none' } as any)\n      : composedSx\n\n    // Shared leaf attributes; self-closing components must receive NO\n    // children at all (AGL-579) — a separate element expression keeps the\n    // childless case genuinely childless instead of `[undefined, false]`.\n    const leafProps = {\n      ref,\n      'data-aglyn': `leaf:${node?.$id}`,\n      // Before the spreads: the animation trigger/repeat attributes are ours,\n      // but an element that genuinely declared one of these should win.\n      ...animation?.attributes,\n      ...resolvedProps,\n      ...rest,\n      className: mergedClassName,\n      style: mergedStyle,\n      sx: transformSx\n        ? (transformSx(mergedSx, node?.$id) as typeof mergedSx)\n        : mergedSx,\n    }\n\n    // Node identity (AGL-659): components get their node id through a\n    // context rather than a prop, so a block can look up the server-seeded\n    // slice of `pageData` that belongs to IT — two grids on one page have\n    // different queries and must not share a seed. Nothing is added to any\n    // component's props, so no unknown attribute reaches the DOM.\n    // Positional children (AGL-1237): a component that splits its children\n    // by index — MUI's Accordion is `[summary, ...rest]` — must receive one\n    // React child per node child. The default single `<Branch>` element reads\n    // as ONE child to `Children.toArray`, so the first slot swallowed the\n    // whole subtree and every later slot got nothing.\n    const positional = Boolean(\n      (schema?.flags?.positionalChildren ?? 0) & FEATURE_FLAG.ENABLED,\n    )\n    const childNodes = positional ? (node?.children ?? []) : null\n\n    const element = selfClosing ? (\n      <Component {...leafProps} />\n    ) : positional ? (\n      <RendererComponents.Consumer>\n        {({ StemComponent }) => (\n          <Component {...leafProps}>\n            {childNodes!.map((child: any, key: number) => (\n              <StemComponent key={child?.$id ?? key} node={child} />\n            ))}\n            {textContent != null && (\n              <AglynText>{textContent as any}</AglynText>\n            )}\n          </Component>\n        )}\n      </RendererComponents.Consumer>\n    ) : (\n      <Component {...leafProps}>\n        {children}\n\n        {textContent != null && (\n          <AglynText>{textContent as any}</AglynText>\n        )}\n      </Component>\n    )\n\n    return (\n      <NodeIdentityContext.Provider value={node?.$id ?? ''}>\n        {element}\n      </NodeIdentityContext.Provider>\n    )\n  }),\n)\nLeaf.displayName = 'Leaf'\nLeaf['aglyn'] = true\n\nexport default Leaf\n"],"names":["components","sanitizeAuthorSx","pinRampedTypographySx","NODE_HIDE_IF_PROP","NODE_HIDE_UNLESS_PROP","NODE_ANIMATION_DELAY_PROP","NODE_ANIMATION_DURATION_PROP","NODE_ANIMATION_EASE_PROP","NODE_ANIMATION_PROP","NODE_ANIMATION_REPEAT_PROP","NODE_ANIMATION_STAGGER_PROP","NODE_ANIMATION_STAGGER_STEP_PROP","NODE_ANIMATION_TRIGGER_PROP","resolveElementAnimation","EnabledPluginsContext","isSwitchedOffForRenderedSite","NodeIdentityContext","NODE_COLOR_SCHEME_PROP","resolveElementColorScheme","FEATURE_FLAG","AglynText","styled","ThemeProvider","useSiteSchemeThemes","useTheme","mergeSxProps","observer","isNamespacedComponentId","RealmElementsContext","forwardRef","Suspense","use","useContext","isValidElementType","RendererComponents","LeafSxTransformContext","RealmBoundaryContext","resolvePaletteVarsSx","resolveSchemeSx","DefaultComponent","Leaf","props","ref","node","schema","theme","forcedTheme","children","sx","className","style","rest","resolvedProps","propsSx","propsClassName","propsStyle","_hideIf","_hideUnless","_animation","_animationTrigger","_animationDuration","_animationDelay","_animationRepeat","_animationEase","_animationStagger","_animationStaggerStep","_colorScheme","animation","enabledPlugins","registeredSchema","getSchema","componentId","offForSite","pluginId","Factory","undefined","getFactory","realmElement","realmBoundary","realmLoadFor","$id","loading","Component","selfClosing","Boolean","flags","ENABLED","textContent","mergedClassName","filter","join","mergedStyle","transformSx","activeScheme","palette","mode","pinnedScheme","schemeThemes","fallback","Provider","value","authorSx","composedSx","colorScheme","color","bgcolor","mergedSx","hidden","display","leafProps","attributes","positional","positionalChildren","childNodes","element","Consumer","StemComponent","map","child","key","displayName"],"mappings":"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"}
+{"version":3,"sources":["../../../../../../libs/aglyn-node-renderer/src/lib/components/leaf.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2023 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// Type-only, with every value this file reads named below (AGL-2486's rule,\n// applied to the render path's hottest file): a VALUE namespace import of the\n// core barrel is opaque to a bundler — it cannot know which exports are read,\n// so every module the barrel reaches is pinned into the published page's first\n// load.\nimport type * as Aglyn from '@aglyn/aglyn'\nimport { components } from '@aglyn/aglyn/aglyn'\nimport { sanitizeAuthorSx } from '@aglyn/aglyn/app-utils/author-css'\nimport { pinRampedTypographySx } from '@aglyn/aglyn/app-utils/responsive-typography-sx'\nimport {\n  NODE_HIDE_IF_PROP,\n  NODE_HIDE_UNLESS_PROP,\n} from '@aglyn/aglyn/app-utils/reusable-component-keys'\nimport {\n  NODE_ANIMATION_DELAY_PROP,\n  NODE_ANIMATION_DURATION_PROP,\n  NODE_ANIMATION_EASE_PROP,\n  NODE_ANIMATION_PROP,\n  NODE_ANIMATION_REPEAT_PROP,\n  NODE_ANIMATION_STAGGER_PROP,\n  NODE_ANIMATION_STAGGER_STEP_PROP,\n  NODE_ANIMATION_TRIGGER_PROP,\n  resolveElementAnimation,\n} from '@aglyn/aglyn/app-utils/element-animation'\nimport {\n  EnabledPluginsContext,\n  isSwitchedOffForRenderedSite,\n} from '@aglyn/aglyn/app-utils/enabled-plugins-context'\nimport { NodeIdentityContext } from '@aglyn/aglyn/app-utils/node-identity'\nimport {\n  NODE_COLOR_SCHEME_PROP,\n  resolveElementColorScheme,\n} from '@aglyn/aglyn/app-utils/element-color-scheme'\nimport { FEATURE_FLAG } from '@aglyn/aglyn/foundation/constants/shared'\n// Deep import, NOT the barrel: `@aglyn/shared-ui-jsx`'s index re-exports the\n// Pages Router hooks (`next/router`), the inline SVG icon set and the whole\n// ~12,000-module MDI catalog, none of which a rendered node needs. This file\n// is on every published page, so the barrel's reach is that page's reach.\nimport { AglynText } from '@aglyn/shared-ui-jsx/components/aglyn-text'\nimport {\n  styled,\n  ThemeProvider,\n  useSiteSchemeThemes,\n  useTheme,\n} from '@aglyn/shared-ui-theme'\nimport { mergeSxProps } from '@aglyn/shared-ui-theme'\nimport { observer } from 'mobx-react-lite'\nimport { isNamespacedComponentId } from '@aglyn/aglyn/plugin-manager/plugin-contributions'\nimport { RealmElementsContext } from '@aglyn/aglyn/app-utils/realm-elements-context'\nimport {\n  forwardRef,\n  type HTMLAttributes,\n  Suspense,\n  use,\n  useContext,\n} from 'react'\nimport { isValidElementType } from 'react-is'\nimport RendererComponents from '../contexts/renderer-components'\nimport { LeafSxTransformContext } from '../contexts/leaf-sx-transform'\nimport { RealmBoundaryContext } from '../contexts/realm-boundary'\nimport { DeferredHydrationContext } from '../contexts/deferred-hydration'\nimport {\n  HELD_SERVER_HTML,\n  mayHoldServerHtml,\n  useHeldServerHtml,\n} from './deferred-hydration'\nimport { resolvePaletteVarsSx, resolveSchemeSx } from '../utils/scheme-sx'\n\nconst DefaultComponent = styled('div')({})\n\n/** Leaf props with any `children` a resolved prop carried, for a held root. */\nfunction withoutChildren<T extends Record<string, unknown>>(\n  props: T,\n): Omit<T, 'children'> {\n  const { children: _children, ...rest } = props\n  return rest\n}\n\nexport interface LeafProps extends HTMLAttributes<any> {\n  children?: any\n  node: Aglyn.NodeSchema\n  sx?: JSX.SxProps\n}\n\nexport const Leaf = observer(\n  forwardRef<any, LeafProps>((props, ref) => {\n    const { children, node, sx, className, style, ...rest } = props\n\n    // Pull sx/className/style out of the node's props so the spreads below\n    // can never clobber the merged values composed explicitly afterwards\n    // (AGL-569: `props.sx` used to overwrite the node-level sx entirely).\n    //\n    // The visibility directives (AGL-1314) come out here too. The compose\n    // step consumes and strips them, so a rendered page never carries one —\n    // but the component EDITOR renders definition nodes ungrafted, on\n    // purpose (the author has to see and select the part a page will hide),\n    // and there the raw `hideIf` would spread onto the element as an\n    // unknown `hideif` DOM attribute.\n    const {\n      sx: propsSx,\n      className: propsClassName,\n      style: propsStyle,\n      [NODE_HIDE_IF_PROP]: _hideIf,\n      [NODE_HIDE_UNLESS_PROP]: _hideUnless,\n      // Element animation (AGL-2486): the reserved animation props come\n      // out here for the same reason the visibility directives above do —\n      // they are directives to the RENDERER, and spreading them onto the\n      // element would land `aglynanimation=\"slide-up\"` as an unknown DOM\n      // attribute. Destructured rather than `delete`d after the fact so the\n      // `none` case is stripped too (it resolves to no animation, but it is\n      // still a prop an author saved) and so the props object keeps one\n      // shape.\n      [NODE_ANIMATION_PROP]: _animation,\n      [NODE_ANIMATION_TRIGGER_PROP]: _animationTrigger,\n      [NODE_ANIMATION_DURATION_PROP]: _animationDuration,\n      [NODE_ANIMATION_DELAY_PROP]: _animationDelay,\n      [NODE_ANIMATION_REPEAT_PROP]: _animationRepeat,\n      [NODE_ANIMATION_EASE_PROP]: _animationEase,\n      [NODE_ANIMATION_STAGGER_PROP]: _animationStagger,\n      [NODE_ANIMATION_STAGGER_STEP_PROP]: _animationStaggerStep,\n      // A pinned color scheme (AGL-3284) is a directive to the renderer, like\n      // the two groups above: consumed below, never handed to the component.\n      [NODE_COLOR_SCHEME_PROP]: _colorScheme,\n      ...resolvedProps\n    } = (node?.resolvedProps ?? node?.props ?? {}) as Record<string, any>\n\n    // Resolves to a class, a `data-` attribute and two custom properties; the\n    // keyframes themselves live in the tenant's stylesheet, so this costs no\n    // JS on any surface. The besigner canvas never ships that stylesheet\n    // (same posture as the AGL-562 hidden class), so an author sees the\n    // element in its normal, selectable, un-animated state while editing.\n    const animation = resolveElementAnimation({\n      [NODE_ANIMATION_PROP]: _animation,\n      [NODE_ANIMATION_TRIGGER_PROP]: _animationTrigger,\n      [NODE_ANIMATION_DURATION_PROP]: _animationDuration,\n      [NODE_ANIMATION_DELAY_PROP]: _animationDelay,\n      [NODE_ANIMATION_REPEAT_PROP]: _animationRepeat,\n      [NODE_ANIMATION_EASE_PROP]: _animationEase,\n      [NODE_ANIMATION_STAGGER_PROP]: _animationStagger,\n      [NODE_ANIMATION_STAGGER_STEP_PROP]: _animationStaggerStep,\n    })\n    // A component whose first-party plugin does not run on the rendered site\n    // is drawn exactly as an unregistered one is (AGL-3033): the registry is\n    // process-global and outlives the site that loaded the bundle, and the\n    // site's own browser never loads it. Its schema goes with it, so the\n    // void-element and positional flags cannot tell the server a different\n    // story from the client either.\n    const enabledPlugins = useContext(EnabledPluginsContext)\n    const registeredSchema = components.getSchema(node?.componentId)\n    const offForSite = isSwitchedOffForRenderedSite(\n      registeredSchema?.pluginId,\n      enabledPlugins,\n    )\n    const Factory = offForSite ? undefined : components.getFactory(node?.componentId)\n    // A signed marketplace plugin's element (AGL-3390) renders on the server,\n    // and the browser registers its component a moment later. Inside the\n    // element's own boundary (below) it waits for that load rather than\n    // hydrating the server's HTML as an unregistered element, which would\n    // not match it.\n    const realmElement = isNamespacedComponentId(node?.componentId)\n    const realmBoundary = useContext(RealmBoundaryContext)\n    const realmLoadFor = useContext(RealmElementsContext)\n    if (realmElement && realmBoundary === node?.$id && !Factory && !offForSite) {\n      const loading = realmLoadFor?.(node.componentId)\n      if (loading) use(loading)\n    }\n    const Component = isValidElementType(Factory) ? Factory : DefaultComponent\n\n    // Self-closing components (AGL-579): a component whose schema flags it\n    // selfClosing renders a void DOM element (e.g. Image -> <img>), and React\n    // throws during SSR when ANY children value reaches one — even the empty\n    // `[undefined, false]` the JSX below always produces. Rendering the whole\n    // page 500s off one image node (blog covers, AGL-579), so honor the flag\n    // here: no JSX children, and strip a stray `children` prop too.\n    const schema = offForSite ? undefined : registeredSchema\n    const selfClosing = Boolean(\n      (schema?.flags?.selfClosing ?? 0) & FEATURE_FLAG.ENABLED,\n    )\n    if (selfClosing) delete resolvedProps['children']\n\n    const textContent = selfClosing ? null : resolvedProps?.['children']\n\n    const mergedClassName =\n      [propsClassName, node?.className, className, animation?.className]\n        .filter(Boolean)\n        .join(' ') || undefined\n    // The animation's custom properties go in FIRST so an author who typed\n    // `--aglyn-anim-duration` into the Custom CSS tab still wins.\n    const mergedStyle =\n      animation || propsStyle || style\n        ? { ...animation?.style, ...propsStyle, ...style }\n        : undefined\n\n    // Canvas-only hook (AGL-581): the besigner provides a transform that\n    // re-targets viewport media queries at the artboard device width.\n    // Undefined everywhere else, keeping the tenant path unchanged.\n    const transformSx = useContext(LeafSxTransformContext)\n    // Scheme-scoped styles (AGL-588): sites swap a single-mode theme for\n    // light/dark (tenant HostThemeProvider, canvas useAglynSiteTheme), so\n    // '@scheme dark' sx slices resolve here against the ACTIVE theme's\n    // palette mode — the one signal that is correct in both places.\n    const theme = useTheme() as {\n      palette?: { mode?: string } & Record<string, unknown>\n    } | null\n    const activeScheme = theme?.palette?.mode === 'dark' ? 'dark' : 'light'\n    // \"Always light\" / \"Always dark\" (AGL-3284). When the pinned scheme is not\n    // the active one, the element re-renders itself under the site's theme\n    // for that scheme, so its OWN sx — not only its descendants' — resolves\n    // palette tokens and `@scheme dark` slices for the pinned scheme. The\n    // inner render then sees the pinned scheme as active and takes the plain\n    // path; the mode check below is what guarantees that, because a site with\n    // one theme for both schemes (a single `fallback`) hands back a theme\n    // whose mode never changes, and re-wrapping it would never terminate.\n    // No provider (an email render, a bare test) means nothing to force.\n    // Every hook above runs on both paths, so the early return keeps the\n    // hook order stable when an author flips the setting.\n    const pinnedScheme = resolveElementColorScheme(_colorScheme)\n    const schemeThemes = useSiteSchemeThemes()\n    const forcedTheme =\n      pinnedScheme && pinnedScheme !== activeScheme && schemeThemes\n        ? schemeThemes(pinnedScheme)\n        : undefined\n    // A static subtree far from the viewport keeps its server HTML through\n    // hydration and renders when the visitor nears it (AGL-3581). Only on a\n    // tree that asked for it — the published page — and decided once, on the\n    // leaf's first render. See `deferred-hydration.tsx`.\n    const deferHydration = useContext(DeferredHydrationContext)\n    const holdServerHtml = useHeldServerHtml(\n      deferHydration && !offForSite && mayHoldServerHtml(node),\n      node?.$id ?? '',\n    )\n    // Each realm element hydrates in a boundary of its own (AGL-3390), so one\n    // waiting for its bundle holds only itself. Rendered on the server too:\n    // the browser's tree has to have the same boundary to hydrate into.\n    if (realmElement && realmBoundary !== node?.$id) {\n      return (\n        <Suspense fallback={null}>\n          <RealmBoundaryContext.Provider value={node?.$id}>\n            <Leaf {...props} ref={ref} />\n          </RealmBoundaryContext.Provider>\n        </Suspense>\n      )\n    }\n    if (forcedTheme && forcedTheme.palette?.mode === pinnedScheme) {\n      return (\n        <ThemeProvider theme={forcedTheme}>\n          <Leaf {...props} ref={ref} />\n        </ThemeProvider>\n      )\n    }\n    // MUI array composition: later entries win on key conflicts, so the\n    // node-level sx (Styles panel output) overrides props.sx.\n    //\n    // Palette token references (AGL-1331): the Background Fill field\n    // persists a token-bound gradient stop as\n    // `var(--mui-palette-primary-main, #00B0FF)`, because `backgroundImage`\n    // is NOT one of the sx keys MUI resolves against the palette. They are\n    // substituted here, against the site theme, so the canvas cannot pick\n    // up the console's `--mui-palette-*` and the tenant (whose theme has no\n    // CSS variables at all) still tracks palette changes. Values carrying\n    // no reference come back by identity.\n    // Author CSS (AGL-1725): `node.sx` is the Styles panel's output, and it\n    // is free text — `backgroundImage` is a first-class field and the Custom\n    // CSS tab is free-solo, so any property and any value can be typed. On a\n    // published site that lands in the visitor's document as a real `url()`,\n    // which no input validator and no lint rule can see. Scrubbed HERE, at\n    // the last point before the merge, so it also catches values already\n    // stored; `sx` and `props.sx` are OUR components' own styles and are\n    // deliberately left alone. The scrub is scheme-only and returns its\n    // input by identity when nothing is refused, so the overwhelmingly\n    // common case (no `url()` at all) costs one walk and no new object.\n    // Responsive type ramp: LAST of the three sx passes, and it has to be —\n    // it moves a scalar `fontSize` into the `xs` slice so the author's\n    // explicit size sorts after the variant's `responsiveFontSizes` at-rules,\n    // and the scheme pass above is what collapses a dark-scheme slice down\n    // into that same top level. Running it earlier would leave a dark\n    // override's font size unpinned.\n    //\n    // A pinned element paints its scheme's page background and text color\n    // (AGL-3284), UNDER every other style so an author's own background wins.\n    // Without it an \"Always dark\" band with no background of its own is\n    // light text on the light page behind it, and text that sets no color\n    // inherits the page's dark body color. `color-scheme` makes the browser's\n    // own controls and scrollbars inside the band match. Only a pinned\n    // element carries this, so an unpinned one renders exactly as before —\n    // and so does a pinned one on a surface with no site themes to pin to.\n    const authorSx = sanitizeAuthorSx(node?.sx)\n    const composedSx = pinRampedTypographySx(\n      resolvePaletteVarsSx(\n        resolveSchemeSx(\n          pinnedScheme && schemeThemes\n            ? mergeSxProps(\n                {\n                  colorScheme: pinnedScheme,\n                  color: 'text.primary',\n                  bgcolor: 'background.default',\n                } as any,\n                sx as any,\n                propsSx as any,\n                authorSx as any,\n              )\n            : mergeSxProps(sx as any, propsSx as any, authorSx as any),\n          activeScheme,\n        ),\n        theme?.palette,\n      ),\n    )\n    /**\n     * Author visibility — the eye on the hierarchy row.\n     *\n     * LAST, and deliberately so. It has to override the element's own\n     * display, not replace it: an author who hides a Stack laid out with\n     * `display: flex` gets that flex back the moment they show it again,\n     * because the stored style was never touched. Writing `display: none`\n     * into `node.sx` would have destroyed the value it overwrote, and there\n     * would be nothing left to restore.\n     *\n     * The same rule on both surfaces. A hidden element is absent from the\n     * published page and from the canvas — \"hidden\" that still renders in the\n     * editor is a preview of a page nobody will ever see.\n     */\n    const mergedSx = node?.hidden\n      ? mergeSxProps(composedSx as any, { display: 'none' } as any)\n      : composedSx\n\n    // Shared leaf attributes; self-closing components must receive NO\n    // children at all (AGL-579) — a separate element expression keeps the\n    // childless case genuinely childless instead of `[undefined, false]`.\n    const leafProps = {\n      ref,\n      'data-aglyn': `leaf:${node?.$id}`,\n      // Before the spreads: the animation trigger/repeat attributes are ours,\n      // but an element that genuinely declared one of these should win.\n      ...animation?.attributes,\n      ...resolvedProps,\n      ...rest,\n      className: mergedClassName,\n      style: mergedStyle,\n      sx: transformSx\n        ? (transformSx(mergedSx, node?.$id) as typeof mergedSx)\n        : mergedSx,\n    }\n\n    // Node identity (AGL-659): components get their node id through a\n    // context rather than a prop, so a block can look up the server-seeded\n    // slice of `pageData` that belongs to IT — two grids on one page have\n    // different queries and must not share a seed. Nothing is added to any\n    // component's props, so no unknown attribute reaches the DOM.\n    // Positional children (AGL-1237): a component that splits its children\n    // by index — MUI's Accordion is `[summary, ...rest]` — must receive one\n    // React child per node child. The default single `<Branch>` element reads\n    // as ONE child to `Children.toArray`, so the first slot swallowed the\n    // whole subtree and every later slot got nothing.\n    const positional = Boolean(\n      (schema?.flags?.positionalChildren ?? 0) & FEATURE_FLAG.ENABLED,\n    )\n    const childNodes = positional ? (node?.children ?? []) : null\n\n    const element = holdServerHtml ? (\n      // The root hydrates; its contents stay the server's until released.\n      <Component\n        {...withoutChildren(leafProps)}\n        dangerouslySetInnerHTML={HELD_SERVER_HTML}\n        suppressHydrationWarning\n      />\n    ) : selfClosing ? (\n      <Component {...leafProps} />\n    ) : positional ? (\n      <RendererComponents.Consumer>\n        {({ StemComponent }) => (\n          <Component {...leafProps}>\n            {childNodes!.map((child: any, key: number) => (\n              <StemComponent key={child?.$id ?? key} node={child} />\n            ))}\n            {textContent != null && (\n              <AglynText>{textContent as any}</AglynText>\n            )}\n          </Component>\n        )}\n      </RendererComponents.Consumer>\n    ) : (\n      <Component {...leafProps}>\n        {children}\n\n        {textContent != null && (\n          <AglynText>{textContent as any}</AglynText>\n        )}\n      </Component>\n    )\n\n    return (\n      <NodeIdentityContext.Provider value={node?.$id ?? ''}>\n        {element}\n      </NodeIdentityContext.Provider>\n    )\n  }),\n)\nLeaf.displayName = 'Leaf'\nLeaf['aglyn'] = true\n\nexport default Leaf\n"],"names":["components","sanitizeAuthorSx","pinRampedTypographySx","NODE_HIDE_IF_PROP","NODE_HIDE_UNLESS_PROP","NODE_ANIMATION_DELAY_PROP","NODE_ANIMATION_DURATION_PROP","NODE_ANIMATION_EASE_PROP","NODE_ANIMATION_PROP","NODE_ANIMATION_REPEAT_PROP","NODE_ANIMATION_STAGGER_PROP","NODE_ANIMATION_STAGGER_STEP_PROP","NODE_ANIMATION_TRIGGER_PROP","resolveElementAnimation","EnabledPluginsContext","isSwitchedOffForRenderedSite","NodeIdentityContext","NODE_COLOR_SCHEME_PROP","resolveElementColorScheme","FEATURE_FLAG","AglynText","styled","ThemeProvider","useSiteSchemeThemes","useTheme","mergeSxProps","observer","isNamespacedComponentId","RealmElementsContext","forwardRef","Suspense","use","useContext","isValidElementType","RendererComponents","LeafSxTransformContext","RealmBoundaryContext","DeferredHydrationContext","HELD_SERVER_HTML","mayHoldServerHtml","useHeldServerHtml","resolvePaletteVarsSx","resolveSchemeSx","DefaultComponent","withoutChildren","props","children","_children","rest","Leaf","ref","node","schema","theme","forcedTheme","sx","className","style","resolvedProps","propsSx","propsClassName","propsStyle","_hideIf","_hideUnless","_animation","_animationTrigger","_animationDuration","_animationDelay","_animationRepeat","_animationEase","_animationStagger","_animationStaggerStep","_colorScheme","animation","enabledPlugins","registeredSchema","getSchema","componentId","offForSite","pluginId","Factory","undefined","getFactory","realmElement","realmBoundary","realmLoadFor","$id","loading","Component","selfClosing","Boolean","flags","ENABLED","textContent","mergedClassName","filter","join","mergedStyle","transformSx","activeScheme","palette","mode","pinnedScheme","schemeThemes","deferHydration","holdServerHtml","fallback","Provider","value","authorSx","composedSx","colorScheme","color","bgcolor","mergedSx","hidden","display","leafProps","attributes","positional","positionalChildren","childNodes","element","dangerouslySetInnerHTML","suppressHydrationWarning","Consumer","StemComponent","map","child","key","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GAED,4EAA4E;AAC5E,8EAA8E;AAC9E,8EAA8E;AAC9E,+EAA+E;AAC/E,QAAQ;;;;;AAER,SAASA,UAAU,QAAQ,qBAAoB;AAC/C,SAASC,gBAAgB,QAAQ,oCAAmC;AACpE,SAASC,qBAAqB,QAAQ,kDAAiD;AACvF,SACEC,iBAAiB,EACjBC,qBAAqB,QAChB,iDAAgD;AACvD,SACEC,yBAAyB,EACzBC,4BAA4B,EAC5BC,wBAAwB,EACxBC,mBAAmB,EACnBC,0BAA0B,EAC1BC,2BAA2B,EAC3BC,gCAAgC,EAChCC,2BAA2B,EAC3BC,uBAAuB,QAClB,2CAA0C;AACjD,SACEC,qBAAqB,EACrBC,4BAA4B,QACvB,iDAAgD;AACvD,SAASC,mBAAmB,QAAQ,uCAAsC;AAC1E,SACEC,sBAAsB,EACtBC,yBAAyB,QACpB,8CAA6C;AACpD,SAASC,YAAY,QAAQ,2CAA0C;AACvE,6EAA6E;AAC7E,4EAA4E;AAC5E,6EAA6E;AAC7E,0EAA0E;AAC1E,SAASC,SAAS,QAAQ,6CAA4C;AACtE,SACEC,MAAM,EACNC,aAAa,EACbC,mBAAmB,EACnBC,QAAQ,QACH,yBAAwB;AAC/B,SAASC,YAAY,QAAQ,yBAAwB;AACrD,SAASC,QAAQ,QAAQ,kBAAiB;AAC1C,SAASC,uBAAuB,QAAQ,mDAAkD;AAC1F,SAASC,oBAAoB,QAAQ,gDAA+C;AACpF,SACEC,UAAU,EAEVC,QAAQ,EACRC,GAAG,EACHC,UAAU,QACL,QAAO;AACd,SAASC,kBAAkB,QAAQ,WAAU;AAC7C,OAAOC,wBAAwB,qCAAiC;AAChE,SAASC,sBAAsB,QAAQ,mCAA+B;AACtE,SAASC,oBAAoB,QAAQ,gCAA4B;AACjE,SAASC,wBAAwB,QAAQ,oCAAgC;AACzE,SACEC,gBAAgB,EAChBC,iBAAiB,EACjBC,iBAAiB,QACZ,0BAAsB;AAC7B,SAASC,oBAAoB,EAAEC,eAAe,QAAQ,wBAAoB;AAE1E,MAAMC,mBAAmBtB,OAAO,OAAO,CAAC;AAExC,6EAA6E,GAC7E,SAASuB,gBACPC,KAAQ;IAER,MAAM,EAAEC,UAAUC,SAAS,EAAW,GAAGF,OAATG,wCAASH;;;IACzC,OAAOG;AACT;AAQA,OAAO,MAAMC,OAAOvB,uBAClBG,WAA2B,CAACgB,OAAOK;QAuC5BC;QAoDFC,eA4BkBC,gBAuCFC,sBA+GhBF;IA5QH,MAAM,EAAEN,QAAQ,EAAEK,IAAI,EAAEI,EAAE,EAAEC,SAAS,EAAEC,KAAK,EAAW,GAAGZ,OAATG,wCAASH;;;;;;;IAE1D,uEAAuE;IACvE,qEAAqE;IACrE,sEAAsE;IACtE,EAAE;IACF,sEAAsE;IACtE,wEAAwE;IACxE,kEAAkE;IAClE,wEAAwE;IACxE,iEAAiE;IACjE,kCAAkC;IAClC,eA0BKM,gBAAAA,wBAAAA,KAAMO,aAAa,oBAAIP,wBAAAA,KAAMN,KAAK,YAAlCM,OAAsC,CAAC,GA1BtC,EACJI,IAAII,OAAO,EACXH,WAAWI,cAAc,EACzBH,OAAOI,UAAU,EACjB,CAAC1D,kBAAkB,EAAE2D,OAAO,EAC5B,CAAC1D,sBAAsB,EAAE2D,WAAW,EACpC,kEAAkE;IAClE,oEAAoE;IACpE,mEAAmE;IACnE,mEAAmE;IACnE,sEAAsE;IACtE,sEAAsE;IACtE,kEAAkE;IAClE,SAAS;IACT,CAACvD,oBAAoB,EAAEwD,UAAU,EACjC,CAACpD,4BAA4B,EAAEqD,iBAAiB,EAChD,CAAC3D,6BAA6B,EAAE4D,kBAAkB,EAClD,CAAC7D,0BAA0B,EAAE8D,eAAe,EAC5C,CAAC1D,2BAA2B,EAAE2D,gBAAgB,EAC9C,CAAC7D,yBAAyB,EAAE8D,cAAc,EAC1C,CAAC3D,4BAA4B,EAAE4D,iBAAiB,EAChD,CAAC3D,iCAAiC,EAAE4D,qBAAqB,EACzD,wEAAwE;IACxE,uEAAuE;IACvE,CAACtD,uBAAuB,EAAEuD,YAAY,EAEvC,UADId;;;;QArBFvD;QACAC;QASAI;QACAI;QACAN;QACAD;QACAI;QACAF;QACAG;QACAC;QAGAM;;IAIH,0EAA0E;IAC1E,yEAAyE;IACzE,qEAAqE;IACrE,oEAAoE;IACpE,sEAAsE;IACtE,MAAMwD,YAAY5D,wBAAwB;QACxC,CAACL,oBAAoB,EAAEwD;QACvB,CAACpD,4BAA4B,EAAEqD;QAC/B,CAAC3D,6BAA6B,EAAE4D;QAChC,CAAC7D,0BAA0B,EAAE8D;QAC7B,CAAC1D,2BAA2B,EAAE2D;QAC9B,CAAC7D,yBAAyB,EAAE8D;QAC5B,CAAC3D,4BAA4B,EAAE4D;QAC/B,CAAC3D,iCAAiC,EAAE4D;IACtC;IACA,yEAAyE;IACzE,yEAAyE;IACzE,uEAAuE;IACvE,qEAAqE;IACrE,uEAAuE;IACvE,gCAAgC;IAChC,MAAMG,iBAAiB1C,WAAWlB;IAClC,MAAM6D,mBAAmB3E,WAAW4E,SAAS,CAACzB,wBAAAA,KAAM0B,WAAW;IAC/D,MAAMC,aAAa/D,6BACjB4D,oCAAAA,iBAAkBI,QAAQ,EAC1BL;IAEF,MAAMM,UAAUF,aAAaG,YAAYjF,WAAWkF,UAAU,CAAC/B,wBAAAA,KAAM0B,WAAW;IAChF,0EAA0E;IAC1E,qEAAqE;IACrE,oEAAoE;IACpE,sEAAsE;IACtE,gBAAgB;IAChB,MAAMM,eAAexD,wBAAwBwB,wBAAAA,KAAM0B,WAAW;IAC9D,MAAMO,gBAAgBpD,WAAWI;IACjC,MAAMiD,eAAerD,WAAWJ;IAChC,IAAIuD,gBAAgBC,mBAAkBjC,wBAAAA,KAAMmC,GAAG,KAAI,CAACN,WAAW,CAACF,YAAY;QAC1E,MAAMS,UAAUF,gCAAAA,aAAelC,KAAK0B,WAAW;QAC/C,IAAIU,SAASxD,IAAIwD;IACnB;IACA,MAAMC,YAAYvD,mBAAmB+C,WAAWA,UAAUrC;IAE1D,uEAAuE;IACvE,0EAA0E;IAC1E,yEAAyE;IACzE,0EAA0E;IAC1E,yEAAyE;IACzE,gEAAgE;IAChE,MAAMS,SAAS0B,aAAaG,YAAYN;IACxC,MAAMc,cAAcC,QAClB,UAACtC,2BAAAA,gBAAAA,OAAQuC,KAAK,qBAAbvC,cAAeqC,WAAW,oBAAI,KAAKtE,aAAayE,OAAO;IAE1D,IAAIH,aAAa,OAAO/B,aAAa,CAAC,WAAW;IAEjD,MAAMmC,cAAcJ,cAAc,OAAO/B,iCAAAA,aAAe,CAAC,WAAW;IAEpE,MAAMoC,kBACJ;QAAClC;QAAgBT,wBAAAA,KAAMK,SAAS;QAAEA;QAAWiB,6BAAAA,UAAWjB,SAAS;KAAC,CAC/DuC,MAAM,CAACL,SACPM,IAAI,CAAC,QAAQf;IAClB,uEAAuE;IACvE,8DAA8D;IAC9D,MAAMgB,cACJxB,aAAaZ,cAAcJ,QACvB,aAAKgB,6BAAAA,UAAWhB,KAAK,EAAKI,YAAeJ,SACzCwB;IAEN,qEAAqE;IACrE,kEAAkE;IAClE,gEAAgE;IAChE,MAAMiB,cAAclE,WAAWG;IAC/B,qEAAqE;IACrE,sEAAsE;IACtE,mEAAmE;IACnE,gEAAgE;IAChE,MAAMkB,QAAQ7B;IAGd,MAAM2E,eAAe9C,CAAAA,0BAAAA,iBAAAA,MAAO+C,OAAO,qBAAd/C,eAAgBgD,IAAI,MAAK,SAAS,SAAS;IAChE,2EAA2E;IAC3E,uEAAuE;IACvE,wEAAwE;IACxE,sEAAsE;IACtE,yEAAyE;IACzE,0EAA0E;IAC1E,sEAAsE;IACtE,sEAAsE;IACtE,qEAAqE;IACrE,qEAAqE;IACrE,sDAAsD;IACtD,MAAMC,eAAepF,0BAA0BsD;IAC/C,MAAM+B,eAAehF;IACrB,MAAM+B,cACJgD,gBAAgBA,iBAAiBH,gBAAgBI,eAC7CA,aAAaD,gBACbrB;IACN,uEAAuE;IACvE,wEAAwE;IACxE,yEAAyE;IACzE,qDAAqD;IACrD,MAAMuB,iBAAiBxE,WAAWK;IAClC,MAAMoE,iBAAiBjE,kBACrBgE,kBAAkB,CAAC1B,cAAcvC,kBAAkBY,gBACnDA,wBAAAA,KAAMmC,GAAG,oBAAI;IAEf,0EAA0E;IAC1E,wEAAwE;IACxE,oEAAoE;IACpE,IAAIH,gBAAgBC,mBAAkBjC,wBAAAA,KAAMmC,GAAG,GAAE;QAC/C,qBACE,KAACxD;YAAS4E,UAAU;sBAClB,cAAA,KAACtE,qBAAqBuE,QAAQ;gBAACC,KAAK,EAAEzD,wBAAAA,KAAMmC,GAAG;0BAC7C,cAAA,KAACrC,mBAASJ;oBAAOK,KAAKA;;;;IAI9B;IACA,IAAII,eAAeA,EAAAA,uBAAAA,YAAY8C,OAAO,qBAAnB9C,qBAAqB+C,IAAI,MAAKC,cAAc;QAC7D,qBACE,KAAChF;YAAc+B,OAAOC;sBACpB,cAAA,KAACL,mBAASJ;gBAAOK,KAAKA;;;IAG5B;IACA,oEAAoE;IACpE,0DAA0D;IAC1D,EAAE;IACF,iEAAiE;IACjE,0CAA0C;IAC1C,wEAAwE;IACxE,uEAAuE;IACvE,sEAAsE;IACtE,wEAAwE;IACxE,sEAAsE;IACtE,sCAAsC;IACtC,wEAAwE;IACxE,yEAAyE;IACzE,yEAAyE;IACzE,yEAAyE;IACzE,uEAAuE;IACvE,qEAAqE;IACrE,qEAAqE;IACrE,oEAAoE;IACpE,mEAAmE;IACnE,oEAAoE;IACpE,wEAAwE;IACxE,mEAAmE;IACnE,0EAA0E;IAC1E,uEAAuE;IACvE,kEAAkE;IAClE,iCAAiC;IACjC,EAAE;IACF,sEAAsE;IACtE,0EAA0E;IAC1E,oEAAoE;IACpE,sEAAsE;IACtE,0EAA0E;IAC1E,mEAAmE;IACnE,uEAAuE;IACvE,uEAAuE;IACvE,MAAM2D,WAAW5G,iBAAiBkD,wBAAAA,KAAMI,EAAE;IAC1C,MAAMuD,aAAa5G,sBACjBuC,qBACEC,gBACE4D,gBAAgBC,eACZ9E,aACE;QACEsF,aAAaT;QACbU,OAAO;QACPC,SAAS;IACX,GACA1D,IACAI,SACAkD,YAEFpF,aAAa8B,IAAWI,SAAgBkD,WAC5CV,eAEF9C,yBAAAA,MAAO+C,OAAO;IAGlB;;;;;;;;;;;;;KAaC,GACD,MAAMc,WAAW/D,CAAAA,wBAAAA,KAAMgE,MAAM,IACzB1F,aAAaqF,YAAmB;QAAEM,SAAS;IAAO,KAClDN;IAEJ,kEAAkE;IAClE,sEAAsE;IACtE,sEAAsE;IACtE,MAAMO,YAAY;QAChBnE;QACA,cAAc,CAAC,KAAK,EAAEC,wBAAAA,KAAMmC,GAAG,EAAE;OAG9Bb,6BAAAA,UAAW6C,UAAU,EACrB5D,eACAV;QACHQ,WAAWsC;QACXrC,OAAOwC;QACP1C,IAAI2C,cACCA,YAAYgB,UAAU/D,wBAAAA,KAAMmC,GAAG,IAChC4B;;IAGN,kEAAkE;IAClE,uEAAuE;IACvE,sEAAsE;IACtE,uEAAuE;IACvE,8DAA8D;IAC9D,uEAAuE;IACvE,wEAAwE;IACxE,0EAA0E;IAC1E,sEAAsE;IACtE,kDAAkD;IAClD,MAAMK,aAAa7B,QACjB,UAACtC,2BAAAA,iBAAAA,OAAQuC,KAAK,qBAAbvC,eAAeoE,kBAAkB,oBAAI,KAAKrG,aAAayE,OAAO;IAEjE,MAAM6B,aAAaF,sBAAcpE,wBAAAA,KAAML,QAAQ,oBAAI,EAAE,GAAI;IAEzD,MAAM4E,UAAUjB,iBACd,oEAAoE;kBACpE,KAACjB,wBACK5C,gBAAgByE;QACpBM,yBAAyBrF;QACzBsF,wBAAwB;UAExBnC,4BACF,KAACD,wBAAc6B,cACbE,2BACF,KAACrF,mBAAmB2F,QAAQ;kBACzB,CAAC,EAAEC,aAAa,EAAE,iBACjB,MAACtC,wBAAc6B;;oBACZI,WAAYM,GAAG,CAAC,CAACC,OAAYC;;6CAC5B,KAACH;4BAAsC3E,MAAM6E;mCAAzBA,yBAAAA,MAAO1C,GAAG,mBAAI2C;;oBAEnCpC,eAAe,sBACd,KAACzE;kCAAWyE;;;;uBAMpB,MAACL,wBAAc6B;;YACZvE;YAEA+C,eAAe,sBACd,KAACzE;0BAAWyE;;;;IAKlB,qBACE,KAAC7E,oBAAoB2F,QAAQ;QAACC,KAAK,WAAEzD,wBAAAA,KAAMmC,GAAG,oBAAI;kBAC/CoC;;AAGP,IACD;AACDzE,KAAKiF,WAAW,GAAG;AACnBjF,IAAI,CAAC,QAAQ,GAAG;AAEhB,eAAeA,KAAI"}

package/src/lib/components/tree-root.d.ts

@@ -18,6 +18,12 @@ import type * as Aglyn from '@aglyn/aglyn';
 import { type RenderComponentsContext } from '../contexts/renderer-components';
 export interface TreeRootProps extends Partial<RenderComponentsContext> {
     node: Aglyn.NodeSchema;
+    /**
+     * Keep static subtrees' server HTML through hydration and render them
+     * when the visitor nears them (AGL-3581). Only for a tree that arrived as
+     * server HTML — the published page. See `deferred-hydration.tsx`.
+     */
+    deferHydration?: boolean;
 }
 export declare const TreeRoot: import("react").ForwardRefExoticComponent<TreeRootProps & import("react").RefAttributes<any>> & import("react").NamedExoticComponent<TreeRootProps & import("react").RefAttributes<any>> & {
     readonly type: import("react").ForwardRefExoticComponent<TreeRootProps & import("react").RefAttributes<any>>;

package/src/lib/components/tree-root.js

@@ -19,14 +19,16 @@
 // is pinned into the published page's first load.
 import { jsx as _jsx } from "react/jsx-runtime";
 import { observer } from "mobx-react-lite";
-import { forwardRef, useMemo } from "react";
+import { forwardRef, useEffect, useMemo } from "react";
+import { DeferredHydrationContext } from "../contexts/deferred-hydration.js";
 import RendererComponents from "../contexts/renderer-components.js";
 import Branch from "./branch.js";
+import { markTreeHydrated } from "./deferred-hydration.js";
 import Leaf from "./leaf.js";
 import Stem from "./stem.js";
 import Trunk from "./trunk.js";
 export const TreeRoot = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
-    const { node, TrunkComponent, StemComponent, BranchComponent, LeafComponent } = props;
+    const { node, TrunkComponent, StemComponent, BranchComponent, LeafComponent, deferHydration } = props;
     const Components = useMemo(()=>({
             TrunkComponent: TrunkComponent != null ? TrunkComponent : Trunk,
             StemComponent: StemComponent != null ? StemComponent : Stem,
@@ -38,11 +40,21 @@ export const TreeRoot = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
         BranchComponent,
         LeafComponent
     ]);
-    return /*#__PURE__*/ _jsx(RendererComponents.Provider, {
-        value: Components,
-        children: /*#__PURE__*/ _jsx(Components.TrunkComponent, {
-            ref: ref,
-            node: node
+    // After the first commit — which is the hydration — no leaf mounting
+    // later may hold server HTML it never had (AGL-3581).
+    useEffect(()=>{
+        if (deferHydration) markTreeHydrated();
+    }, [
+        deferHydration
+    ]);
+    return /*#__PURE__*/ _jsx(DeferredHydrationContext.Provider, {
+        value: Boolean(deferHydration),
+        children: /*#__PURE__*/ _jsx(RendererComponents.Provider, {
+            value: Components,
+            children: /*#__PURE__*/ _jsx(Components.TrunkComponent, {
+                ref: ref,
+                node: node
+            })
         })
     });
 }));

package/src/lib/components/tree-root.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../libs/aglyn-node-renderer/src/lib/components/tree-root.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2023 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// Type-only: this file names `Aglyn.NodeSchema` and nothing else, and a\n// VALUE namespace import of the core barrel is opaque to a bundler — it\n// cannot know which exports are read, so every module the barrel reaches\n// is pinned into the published page's first load.\nimport type * as Aglyn from '@aglyn/aglyn'\nimport { observer } from 'mobx-react-lite'\nimport { forwardRef, useMemo } from 'react'\nimport RendererComponents, {\n  type RenderComponentsContext,\n} from '../contexts/renderer-components'\nimport Branch from './branch'\nimport Leaf from './leaf'\nimport Stem from './stem'\nimport Trunk from './trunk'\n\nexport interface TreeRootProps extends Partial<RenderComponentsContext> {\n  node: Aglyn.NodeSchema\n}\n\nexport const TreeRoot = observer(\n  forwardRef<any, TreeRootProps>((props, ref) => {\n    const {\n      node,\n      TrunkComponent,\n      StemComponent,\n      BranchComponent,\n      LeafComponent,\n    } = props\n\n    const Components = useMemo<RenderComponentsContext>(\n      () => ({\n        TrunkComponent: (TrunkComponent ?? Trunk) as RenderComponentsContext['TrunkComponent'],\n        StemComponent: (StemComponent ?? Stem) as RenderComponentsContext['StemComponent'],\n        BranchComponent: (BranchComponent ?? Branch) as RenderComponentsContext['BranchComponent'],\n        LeafComponent: (LeafComponent ?? Leaf) as RenderComponentsContext['LeafComponent'],\n      }),\n      [TrunkComponent, StemComponent, BranchComponent, LeafComponent],\n    )\n\n    return (\n      <RendererComponents.Provider value={Components}>\n        <Components.TrunkComponent ref={ref} node={node} />\n      </RendererComponents.Provider>\n    )\n  }),\n)\nTreeRoot.displayName = 'TreeRoot'\nTreeRoot['aglyn'] = true\n\nexport default TreeRoot\n"],"names":["observer","forwardRef","useMemo","RendererComponents","Branch","Leaf","Stem","Trunk","TreeRoot","props","ref","node","TrunkComponent","StemComponent","BranchComponent","LeafComponent","Components","Provider","value","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GAED,wEAAwE;AACxE,wEAAwE;AACxE,yEAAyE;AACzE,kDAAkD;;AAElD,SAASA,QAAQ,QAAQ,kBAAiB;AAC1C,SAASC,UAAU,EAAEC,OAAO,QAAQ,QAAO;AAC3C,OAAOC,wBAEA,qCAAiC;AACxC,OAAOC,YAAY,cAAU;AAC7B,OAAOC,UAAU,YAAQ;AACzB,OAAOC,UAAU,YAAQ;AACzB,OAAOC,WAAW,aAAS;AAM3B,OAAO,MAAMC,WAAWR,uBACtBC,WAA+B,CAACQ,OAAOC;IACrC,MAAM,EACJC,IAAI,EACJC,cAAc,EACdC,aAAa,EACbC,eAAe,EACfC,aAAa,EACd,GAAGN;IAEJ,MAAMO,aAAad,QACjB,IAAO,CAAA;YACLU,cAAc,EAAGA,yBAAAA,iBAAkBL;YACnCM,aAAa,EAAGA,wBAAAA,gBAAiBP;YACjCQ,eAAe,EAAGA,0BAAAA,kBAAmBV;YACrCW,aAAa,EAAGA,wBAAAA,gBAAiBV;QACnC,CAAA,GACA;QAACO;QAAgBC;QAAeC;QAAiBC;KAAc;IAGjE,qBACE,KAACZ,mBAAmBc,QAAQ;QAACC,OAAOF;kBAClC,cAAA,KAACA,WAAWJ,cAAc;YAACF,KAAKA;YAAKC,MAAMA;;;AAGjD,IACD;AACDH,SAASW,WAAW,GAAG;AACvBX,QAAQ,CAAC,QAAQ,GAAG;AAEpB,eAAeA,SAAQ"}
+{"version":3,"sources":["../../../../../../libs/aglyn-node-renderer/src/lib/components/tree-root.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2023 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// Type-only: this file names `Aglyn.NodeSchema` and nothing else, and a\n// VALUE namespace import of the core barrel is opaque to a bundler — it\n// cannot know which exports are read, so every module the barrel reaches\n// is pinned into the published page's first load.\nimport type * as Aglyn from '@aglyn/aglyn'\nimport { observer } from 'mobx-react-lite'\nimport { forwardRef, useEffect, useMemo } from 'react'\nimport { DeferredHydrationContext } from '../contexts/deferred-hydration'\nimport RendererComponents, {\n  type RenderComponentsContext,\n} from '../contexts/renderer-components'\nimport Branch from './branch'\nimport { markTreeHydrated } from './deferred-hydration'\nimport Leaf from './leaf'\nimport Stem from './stem'\nimport Trunk from './trunk'\n\nexport interface TreeRootProps extends Partial<RenderComponentsContext> {\n  node: Aglyn.NodeSchema\n  /**\n   * Keep static subtrees' server HTML through hydration and render them\n   * when the visitor nears them (AGL-3581). Only for a tree that arrived as\n   * server HTML — the published page. See `deferred-hydration.tsx`.\n   */\n  deferHydration?: boolean\n}\n\nexport const TreeRoot = observer(\n  forwardRef<any, TreeRootProps>((props, ref) => {\n    const {\n      node,\n      TrunkComponent,\n      StemComponent,\n      BranchComponent,\n      LeafComponent,\n      deferHydration,\n    } = props\n\n    const Components = useMemo<RenderComponentsContext>(\n      () => ({\n        TrunkComponent: (TrunkComponent ?? Trunk) as RenderComponentsContext['TrunkComponent'],\n        StemComponent: (StemComponent ?? Stem) as RenderComponentsContext['StemComponent'],\n        BranchComponent: (BranchComponent ?? Branch) as RenderComponentsContext['BranchComponent'],\n        LeafComponent: (LeafComponent ?? Leaf) as RenderComponentsContext['LeafComponent'],\n      }),\n      [TrunkComponent, StemComponent, BranchComponent, LeafComponent],\n    )\n\n    // After the first commit — which is the hydration — no leaf mounting\n    // later may hold server HTML it never had (AGL-3581).\n    useEffect(() => {\n      if (deferHydration) markTreeHydrated()\n    }, [deferHydration])\n\n    return (\n      <DeferredHydrationContext.Provider value={Boolean(deferHydration)}>\n        <RendererComponents.Provider value={Components}>\n          <Components.TrunkComponent ref={ref} node={node} />\n        </RendererComponents.Provider>\n      </DeferredHydrationContext.Provider>\n    )\n  }),\n)\nTreeRoot.displayName = 'TreeRoot'\nTreeRoot['aglyn'] = true\n\nexport default TreeRoot\n"],"names":["observer","forwardRef","useEffect","useMemo","DeferredHydrationContext","RendererComponents","Branch","markTreeHydrated","Leaf","Stem","Trunk","TreeRoot","props","ref","node","TrunkComponent","StemComponent","BranchComponent","LeafComponent","deferHydration","Components","Provider","value","Boolean","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GAED,wEAAwE;AACxE,wEAAwE;AACxE,yEAAyE;AACzE,kDAAkD;;AAElD,SAASA,QAAQ,QAAQ,kBAAiB;AAC1C,SAASC,UAAU,EAAEC,SAAS,EAAEC,OAAO,QAAQ,QAAO;AACtD,SAASC,wBAAwB,QAAQ,oCAAgC;AACzE,OAAOC,wBAEA,qCAAiC;AACxC,OAAOC,YAAY,cAAU;AAC7B,SAASC,gBAAgB,QAAQ,0BAAsB;AACvD,OAAOC,UAAU,YAAQ;AACzB,OAAOC,UAAU,YAAQ;AACzB,OAAOC,WAAW,aAAS;AAY3B,OAAO,MAAMC,WAAWX,uBACtBC,WAA+B,CAACW,OAAOC;IACrC,MAAM,EACJC,IAAI,EACJC,cAAc,EACdC,aAAa,EACbC,eAAe,EACfC,aAAa,EACbC,cAAc,EACf,GAAGP;IAEJ,MAAMQ,aAAajB,QACjB,IAAO,CAAA;YACLY,cAAc,EAAGA,yBAAAA,iBAAkBL;YACnCM,aAAa,EAAGA,wBAAAA,gBAAiBP;YACjCQ,eAAe,EAAGA,0BAAAA,kBAAmBX;YACrCY,aAAa,EAAGA,wBAAAA,gBAAiBV;QACnC,CAAA,GACA;QAACO;QAAgBC;QAAeC;QAAiBC;KAAc;IAGjE,qEAAqE;IACrE,sDAAsD;IACtDhB,UAAU;QACR,IAAIiB,gBAAgBZ;IACtB,GAAG;QAACY;KAAe;IAEnB,qBACE,KAACf,yBAAyBiB,QAAQ;QAACC,OAAOC,QAAQJ;kBAChD,cAAA,KAACd,mBAAmBgB,QAAQ;YAACC,OAAOF;sBAClC,cAAA,KAACA,WAAWL,cAAc;gBAACF,KAAKA;gBAAKC,MAAMA;;;;AAInD,IACD;AACDH,SAASa,WAAW,GAAG;AACvBb,QAAQ,CAAC,QAAQ,GAAG;AAEpB,eAAeA,SAAQ"}

package/src/lib/contexts/deferred-hydration.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Whether this tree may hold static subtrees' server HTML through hydration
+ * (AGL-3581). See `deferred-hydration.tsx`.
+ *
+ * Off by default, which is every surface that renders a tree it did not
+ * receive as server HTML — the Besigner canvas, the console previews — and
+ * for which "keep the server HTML" means nothing. The published tenant page
+ * turns it on through `TreeRoot`'s `deferHydration`.
+ */
+export declare const DeferredHydrationContext: import("react").Context<boolean>;

package/src/lib/contexts/deferred-hydration.js

@@ -0,0 +1,28 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ import { createContext } from "react";
+/**
+ * Whether this tree may hold static subtrees' server HTML through hydration
+ * (AGL-3581). See `deferred-hydration.tsx`.
+ *
+ * Off by default, which is every surface that renders a tree it did not
+ * receive as server HTML — the Besigner canvas, the console previews — and
+ * for which "keep the server HTML" means nothing. The published tenant page
+ * turns it on through `TreeRoot`'s `deferHydration`.
+ */ export const DeferredHydrationContext = createContext(false);
+DeferredHydrationContext.displayName = 'DeferredHydrationContext';
+
+//# sourceMappingURL=deferred-hydration.js.map

package/src/lib/contexts/deferred-hydration.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../libs/aglyn-node-renderer/src/lib/contexts/deferred-hydration.ts"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { createContext } from 'react'\n\n/**\n * Whether this tree may hold static subtrees' server HTML through hydration\n * (AGL-3581). See `deferred-hydration.tsx`.\n *\n * Off by default, which is every surface that renders a tree it did not\n * receive as server HTML — the Besigner canvas, the console previews — and\n * for which \"keep the server HTML\" means nothing. The published tenant page\n * turns it on through `TreeRoot`'s `deferHydration`.\n */\nexport const DeferredHydrationContext = createContext(false)\nDeferredHydrationContext.displayName = 'DeferredHydrationContext'\n"],"names":["createContext","DeferredHydrationContext","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GACD,SAASA,aAAa,QAAQ,QAAO;AAErC;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2BD,cAAc,OAAM;AAC5DC,yBAAyBC,WAAW,GAAG"}