@aglyn/aglyn-node-renderer 1.0.0-beta.143

package/src/lib/components/leaf.js

@@ -0,0 +1,244 @@
+/**
+ * @license
+ * Copyright 2023 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, with every value this file reads named below (AGL-2486's rule,
+// applied to the render path's hottest file): a VALUE namespace import of the
+// core barrel is opaque to a bundler — it cannot know which exports are read,
+// so every module the barrel reaches is pinned into the published page's first
+// load.
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { _ as _object_without_properties_loose } from "@swc/helpers/_/_object_without_properties_loose";
+import { _ as _to_property_key } from "@swc/helpers/_/_to_property_key";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { components } from "@aglyn/aglyn/aglyn";
+import { sanitizeAuthorSx } from "@aglyn/aglyn/app-utils/author-css";
+import { pinRampedTypographySx } from "@aglyn/aglyn/app-utils/responsive-typography-sx";
+import { NODE_HIDE_IF_PROP, NODE_HIDE_UNLESS_PROP } from "@aglyn/aglyn/app-utils/reusable-component-keys";
+import { 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 } from "@aglyn/aglyn/app-utils/element-animation";
+import { EnabledPluginsContext, isSwitchedOffForRenderedSite } from "@aglyn/aglyn/app-utils/enabled-plugins-context";
+import { NodeIdentityContext } from "@aglyn/aglyn/app-utils/node-identity";
+import { FEATURE_FLAG } from "@aglyn/aglyn/foundation/constants/shared";
+// Deep import, NOT the barrel: `@aglyn/shared-ui-jsx`'s index re-exports the
+// Pages Router hooks (`next/router`), the inline SVG icon set and the whole
+// ~12,000-module MDI catalog, none of which a rendered node needs. This file
+// is on every published page, so the barrel's reach is that page's reach.
+import { AglynText } from "@aglyn/shared-ui-jsx/components/aglyn-text";
+import { styled, useTheme } from "@aglyn/shared-ui-theme";
+import { mergeSxProps } from "@aglyn/shared-ui-theme";
+import { observer } from "mobx-react-lite";
+import { forwardRef, useContext } from "react";
+import { isValidElementType } from "react-is";
+import RendererComponents from "../contexts/renderer-components.js";
+import { LeafSxTransformContext } from "../contexts/leaf-sx-transform.js";
+import { resolvePaletteVarsSx, resolveSchemeSx } from "../utils/scheme-sx.js";
+const DefaultComponent = styled('div')({});
+export const Leaf = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
+    var _ref, _ref1, _ref2, _ref3, _ref4, _ref5;
+    var _schema_flags, _theme_palette, _schema_flags1;
+    const { children, node, sx, className, style } = props, rest = _object_without_properties_loose(props, [
+        "children",
+        "node",
+        "sx",
+        "className",
+        "style"
+    ]);
+    // Pull sx/className/style out of the node's props so the spreads below
+    // can never clobber the merged values composed explicitly afterwards
+    // (AGL-569: `props.sx` used to overwrite the node-level sx entirely).
+    //
+    // The visibility directives (AGL-1314) come out here too. The compose
+    // step consumes and strips them, so a rendered page never carries one —
+    // but the component EDITOR renders definition nodes ungrafted, on
+    // 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
+    // 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
+    // attribute. Destructured rather than `delete`d after the fact so the
+    // `none` case is stripped too (it resolves to no animation, but it is
+    // still a prop an author saved) and so the props object keeps one
+    // 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 } = _ref6, resolvedProps = _object_without_properties_loose(_ref6, [
+        "sx",
+        "className",
+        "style",
+        NODE_HIDE_IF_PROP,
+        NODE_HIDE_UNLESS_PROP,
+        NODE_ANIMATION_PROP,
+        NODE_ANIMATION_TRIGGER_PROP,
+        NODE_ANIMATION_DURATION_PROP,
+        NODE_ANIMATION_DELAY_PROP,
+        NODE_ANIMATION_REPEAT_PROP,
+        NODE_ANIMATION_EASE_PROP,
+        NODE_ANIMATION_STAGGER_PROP,
+        NODE_ANIMATION_STAGGER_STEP_PROP
+    ].map(_to_property_key));
+    // Resolves to a class, a `data-` attribute and two custom properties; the
+    // keyframes themselves live in the tenant's stylesheet, so this costs no
+    // JS on any surface. The besigner canvas never ships that stylesheet
+    // (same posture as the AGL-562 hidden class), so an author sees the
+    // element in its normal, selectable, un-animated state while editing.
+    const animation = resolveElementAnimation({
+        [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 component whose first-party plugin does not run on the rendered site
+    // is drawn exactly as an unregistered one is (AGL-3033): the registry is
+    // process-global and outlives the site that loaded the bundle, and the
+    // site's own browser never loads it. Its schema goes with it, so the
+    // void-element and positional flags cannot tell the server a different
+    // story from the client either.
+    const enabledPlugins = useContext(EnabledPluginsContext);
+    const registeredSchema = components.getSchema(node == null ? void 0 : node.componentId);
+    const offForSite = isSwitchedOffForRenderedSite(registeredSchema == null ? void 0 : registeredSchema.pluginId, enabledPlugins);
+    const Factory = offForSite ? undefined : components.getFactory(node == null ? void 0 : node.componentId);
+    const Component = isValidElementType(Factory) ? Factory : DefaultComponent;
+    // Self-closing components (AGL-579): a component whose schema flags it
+    // selfClosing renders a void DOM element (e.g. Image -> <img>), and React
+    // throws during SSR when ANY children value reaches one — even the empty
+    // `[undefined, false]` the JSX below always produces. Rendering the whole
+    // page 500s off one image node (blog covers, AGL-579), so honor the flag
+    // here: no JSX children, and strip a stray `children` prop too.
+    const schema = offForSite ? undefined : registeredSchema;
+    const selfClosing = Boolean(((_ref2 = schema == null ? void 0 : (_schema_flags = schema.flags) == null ? void 0 : _schema_flags.selfClosing) != null ? _ref2 : 0) & FEATURE_FLAG.ENABLED);
+    if (selfClosing) delete resolvedProps['children'];
+    const textContent = selfClosing ? null : resolvedProps == null ? void 0 : resolvedProps['children'];
+    const mergedClassName = [
+        propsClassName,
+        node == null ? void 0 : node.className,
+        className,
+        animation == null ? void 0 : animation.className
+    ].filter(Boolean).join(' ') || undefined;
+    // The animation's custom properties go in FIRST so an author who typed
+    // `--aglyn-anim-duration` into the Custom CSS tab still wins.
+    const mergedStyle = animation || propsStyle || style ? _extends({}, animation == null ? void 0 : animation.style, propsStyle, style) : undefined;
+    // Canvas-only hook (AGL-581): the besigner provides a transform that
+    // re-targets viewport media queries at the artboard device width.
+    // Undefined everywhere else, keeping the tenant path unchanged.
+    const transformSx = useContext(LeafSxTransformContext);
+    // Scheme-scoped styles (AGL-588): sites swap a single-mode theme for
+    // light/dark (tenant HostThemeProvider, canvas useAglynSiteTheme), so
+    // '@scheme dark' sx slices resolve here against the ACTIVE theme's
+    // palette mode — the one signal that is correct in both places.
+    const theme = useTheme();
+    const activeScheme = (theme == null ? void 0 : (_theme_palette = theme.palette) == null ? void 0 : _theme_palette.mode) === 'dark' ? 'dark' : 'light';
+    // MUI array composition: later entries win on key conflicts, so the
+    // node-level sx (Styles panel output) overrides props.sx.
+    //
+    // Palette token references (AGL-1331): the Background Fill field
+    // persists a token-bound gradient stop as
+    // `var(--mui-palette-primary-main, #00B0FF)`, because `backgroundImage`
+    // is NOT one of the sx keys MUI resolves against the palette. They are
+    // substituted here, against the site theme, so the canvas cannot pick
+    // up the console's `--mui-palette-*` and the tenant (whose theme has no
+    // CSS variables at all) still tracks palette changes. Values carrying
+    // no reference come back by identity.
+    // Author CSS (AGL-1725): `node.sx` is the Styles panel's output, and it
+    // is free text — `backgroundImage` is a first-class field and the Custom
+    // CSS tab is free-solo, so any property and any value can be typed. On a
+    // published site that lands in the visitor's document as a real `url()`,
+    // which no input validator and no lint rule can see. Scrubbed HERE, at
+    // the last point before the merge, so it also catches values already
+    // stored; `sx` and `props.sx` are OUR components' own styles and are
+    // deliberately left alone. The scrub is scheme-only and returns its
+    // input by identity when nothing is refused, so the overwhelmingly
+    // common case (no `url()` at all) costs one walk and no new object.
+    // Responsive type ramp: LAST of the three sx passes, and it has to be —
+    // it moves a scalar `fontSize` into the `xs` slice so the author's
+    // explicit size sorts after the variant's `responsiveFontSizes` at-rules,
+    // and the scheme pass above is what collapses a dark-scheme slice down
+    // into that same top level. Running it earlier would leave a dark
+    // override's font size unpinned.
+    const authorSx = sanitizeAuthorSx(node == null ? void 0 : node.sx);
+    const composedSx = pinRampedTypographySx(resolvePaletteVarsSx(resolveSchemeSx(mergeSxProps(sx, propsSx, authorSx), activeScheme), theme == null ? void 0 : theme.palette));
+    /**
+     * Author visibility — the eye on the hierarchy row.
+     *
+     * LAST, and deliberately so. It has to override the element's own
+     * display, not replace it: an author who hides a Stack laid out with
+     * `display: flex` gets that flex back the moment they show it again,
+     * because the stored style was never touched. Writing `display: none`
+     * into `node.sx` would have destroyed the value it overwrote, and there
+     * would be nothing left to restore.
+     *
+     * The same rule on both surfaces. A hidden element is absent from the
+     * published page and from the canvas — "hidden" that still renders in the
+     * editor is a preview of a page nobody will ever see.
+     */ const mergedSx = (node == null ? void 0 : node.hidden) ? mergeSxProps(composedSx, {
+        display: 'none'
+    }) : composedSx;
+    // Shared leaf attributes; self-closing components must receive NO
+    // children at all (AGL-579) — a separate element expression keeps the
+    // childless case genuinely childless instead of `[undefined, false]`.
+    const leafProps = _extends({
+        ref,
+        'data-aglyn': `leaf:${node == null ? void 0 : node.$id}`
+    }, animation == null ? void 0 : animation.attributes, resolvedProps, rest, {
+        className: mergedClassName,
+        style: mergedStyle,
+        sx: transformSx ? transformSx(mergedSx, node == null ? void 0 : node.$id) : mergedSx
+    });
+    // Node identity (AGL-659): components get their node id through a
+    // context rather than a prop, so a block can look up the server-seeded
+    // slice of `pageData` that belongs to IT — two grids on one page have
+    // different queries and must not share a seed. Nothing is added to any
+    // component's props, so no unknown attribute reaches the DOM.
+    // Positional children (AGL-1237): a component that splits its children
+    // by index — MUI's Accordion is `[summary, ...rest]` — must receive one
+    // 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, {
+        children: ({ StemComponent })=>/*#__PURE__*/ _jsxs(Component, _extends({}, leafProps, {
+                children: [
+                    childNodes.map((child, key)=>{
+                        var _ref;
+                        return /*#__PURE__*/ _jsx(StemComponent, {
+                            node: child
+                        }, (_ref = child == null ? void 0 : child.$id) != null ? _ref : key);
+                    }),
+                    textContent != null && /*#__PURE__*/ _jsx(AglynText, {
+                        children: textContent
+                    })
+                ]
+            }))
+    }) : /*#__PURE__*/ _jsxs(Component, _extends({}, leafProps, {
+        children: [
+            children,
+            textContent != null && /*#__PURE__*/ _jsx(AglynText, {
+                children: textContent
+            })
+        ]
+    }));
+    return /*#__PURE__*/ _jsx(NodeIdentityContext.Provider, {
+        value: (_ref5 = node == null ? void 0 : node.$id) != null ? _ref5 : '',
+        children: element
+    });
+}));
+Leaf.displayName = 'Leaf';
+Leaf['aglyn'] = true;
+export default Leaf;
+
+//# sourceMappingURL=leaf.js.map

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

@@ -0,0 +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 { 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 { styled, useTheme } from '@aglyn/shared-ui-theme'\nimport { mergeSxProps } from '@aglyn/shared-ui-theme'\nimport { observer } from 'mobx-react-lite'\nimport { forwardRef, type HTMLAttributes, useContext } from 'react'\nimport { isValidElementType } from 'react-is'\nimport RendererComponents from '../contexts/renderer-components'\nimport { LeafSxTransformContext } from '../contexts/leaf-sx-transform'\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      ...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    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    // 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    const authorSx = sanitizeAuthorSx(node?.sx)\n    const composedSx = pinRampedTypographySx(\n      resolvePaletteVarsSx(\n        resolveSchemeSx(\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","FEATURE_FLAG","AglynText","styled","useTheme","mergeSxProps","observer","forwardRef","useContext","isValidElementType","RendererComponents","LeafSxTransformContext","resolvePaletteVarsSx","resolveSchemeSx","DefaultComponent","Leaf","props","ref","node","schema","theme","children","sx","className","style","rest","resolvedProps","propsSx","propsClassName","propsStyle","_hideIf","_hideUnless","_animation","_animationTrigger","_animationDuration","_animationDelay","_animationRepeat","_animationEase","_animationStagger","_animationStaggerStep","animation","enabledPlugins","registeredSchema","getSchema","componentId","offForSite","pluginId","Factory","undefined","getFactory","Component","selfClosing","Boolean","flags","ENABLED","textContent","mergedClassName","filter","join","mergedStyle","transformSx","activeScheme","palette","mode","authorSx","composedSx","mergedSx","hidden","display","leafProps","$id","attributes","positional","positionalChildren","childNodes","element","Consumer","StemComponent","map","child","key","Provider","value","displayName"],"mappings":"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"}

package/src/lib/components/stem.d.ts

@@ -0,0 +1,22 @@
+/**
+ * @license
+ * Copyright 2023 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';
+export interface StemProps {
+    node: Aglyn.NodeSchema<any>;
+}
+export declare const Stem: import("react").FunctionComponent<StemProps & import("react").RefAttributes<any>>;
+export default Stem;

package/src/lib/components/stem.js

@@ -0,0 +1,53 @@
+/**
+ * @license
+ * Copyright 2023 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: this file names `Aglyn.NodeSchema` and nothing else, and a
+// VALUE namespace import of the core barrel is opaque to a bundler — it
+// cannot know which exports are read, so every module the barrel reaches
+// is pinned into the published page's first load.
+import { jsx as _jsx } from "react/jsx-runtime";
+// Deep import, NOT the barrel — see the note in `leaf.tsx`.
+import { ErrorBoundaryComponent } from "@aglyn/shared-ui-jsx/components/error-boundary.component";
+import { observer } from "mobx-react-lite";
+import { forwardRef } from "react";
+import RendererComponents from "../contexts/renderer-components.js";
+export const Stem = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
+    const { node } = props;
+    if (!node) {
+        console.error(`Error rendering`, node);
+        return /*#__PURE__*/ _jsx("div", {
+            "data-aglyn": "stem:missing"
+        });
+    }
+    return /*#__PURE__*/ _jsx(ErrorBoundaryComponent, {
+        fallback: /*#__PURE__*/ _jsx("div", {
+            "data-aglyn": `stem:error:${node.$id}`
+        }),
+        children: /*#__PURE__*/ _jsx(RendererComponents.Consumer, {
+            children: ({ LeafComponent, BranchComponent })=>/*#__PURE__*/ _jsx(LeafComponent, {
+                    ref: ref,
+                    node: node,
+                    children: /*#__PURE__*/ _jsx(BranchComponent, {
+                        node: node
+                    })
+                })
+        })
+    });
+}));
+Stem.displayName = 'Stem';
+Stem['aglyn'] = true;
+export default Stem;
+
+//# sourceMappingURL=stem.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../libs/aglyn-node-renderer/src/lib/components/stem.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'\n// Deep import, NOT the barrel — see the note in `leaf.tsx`.\nimport { ErrorBoundaryComponent } from '@aglyn/shared-ui-jsx/components/error-boundary.component'\nimport { observer } from 'mobx-react-lite'\nimport { forwardRef } from 'react'\nimport RendererComponents from '../contexts/renderer-components'\n\nexport interface StemProps {\n  node: Aglyn.NodeSchema<any>\n}\n\nexport const Stem = observer(\n  forwardRef<any, StemProps>((props, ref) => {\n    const { node } = props\n\n    if (!node) {\n      console.error(`Error rendering`, node)\n      return <div data-aglyn=\"stem:missing\" />\n    }\n\n    return (\n      <ErrorBoundaryComponent fallback={<div data-aglyn={`stem:error:${node.$id}`} />}>\n        <RendererComponents.Consumer>\n          {({ LeafComponent, BranchComponent }) => (\n            <LeafComponent ref={ref} node={node}>\n              <BranchComponent node={node} />\n            </LeafComponent>\n          )}\n        </RendererComponents.Consumer>\n      </ErrorBoundaryComponent>\n    )\n  }),\n)\nStem.displayName = 'Stem'\nStem['aglyn'] = true\n\nexport default Stem\n"],"names":["ErrorBoundaryComponent","observer","forwardRef","RendererComponents","Stem","props","ref","node","console","error","div","data-aglyn","fallback","$id","Consumer","LeafComponent","BranchComponent","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GAED,wEAAwE;AACxE,wEAAwE;AACxE,yEAAyE;AACzE,kDAAkD;;AAElD,4DAA4D;AAC5D,SAASA,sBAAsB,QAAQ,2DAA0D;AACjG,SAASC,QAAQ,QAAQ,kBAAiB;AAC1C,SAASC,UAAU,QAAQ,QAAO;AAClC,OAAOC,wBAAwB,qCAAiC;AAMhE,OAAO,MAAMC,OAAOH,uBAClBC,WAA2B,CAACG,OAAOC;IACjC,MAAM,EAAEC,IAAI,EAAE,GAAGF;IAEjB,IAAI,CAACE,MAAM;QACTC,QAAQC,KAAK,CAAC,CAAC,eAAe,CAAC,EAAEF;QACjC,qBAAO,KAACG;YAAIC,cAAW;;IACzB;IAEA,qBACE,KAACX;QAAuBY,wBAAU,KAACF;YAAIC,cAAY,CAAC,WAAW,EAAEJ,KAAKM,GAAG,EAAE;;kBACzE,cAAA,KAACV,mBAAmBW,QAAQ;sBACzB,CAAC,EAAEC,aAAa,EAAEC,eAAe,EAAE,iBAClC,KAACD;oBAAcT,KAAKA;oBAAKC,MAAMA;8BAC7B,cAAA,KAACS;wBAAgBT,MAAMA;;;;;AAMnC,IACD;AACDH,KAAKa,WAAW,GAAG;AACnBb,IAAI,CAAC,QAAQ,GAAG;AAEhB,eAAeA,KAAI"}

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

@@ -0,0 +1,23 @@
+/**
+ * @license
+ * Copyright 2023 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';
+import { type RenderComponentsContext } from '../contexts/renderer-components';
+export interface TreeRootProps extends Partial<RenderComponentsContext> {
+    node: Aglyn.NodeSchema;
+}
+export declare const TreeRoot: import("react").FunctionComponent<TreeRootProps & import("react").RefAttributes<any>>;
+export default TreeRoot;

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

@@ -0,0 +1,53 @@
+/**
+ * @license
+ * Copyright 2023 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: this file names `Aglyn.NodeSchema` and nothing else, and a
+// VALUE namespace import of the core barrel is opaque to a bundler — it
+// cannot know which exports are read, so every module the barrel reaches
+// 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 RendererComponents from "../contexts/renderer-components.js";
+import Branch from "./branch.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 Components = useMemo(()=>({
+            TrunkComponent: TrunkComponent != null ? TrunkComponent : Trunk,
+            StemComponent: StemComponent != null ? StemComponent : Stem,
+            BranchComponent: BranchComponent != null ? BranchComponent : Branch,
+            LeafComponent: LeafComponent != null ? LeafComponent : Leaf
+        }), [
+        TrunkComponent,
+        StemComponent,
+        BranchComponent,
+        LeafComponent
+    ]);
+    return /*#__PURE__*/ _jsx(RendererComponents.Provider, {
+        value: Components,
+        children: /*#__PURE__*/ _jsx(Components.TrunkComponent, {
+            ref: ref,
+            node: node
+        })
+    });
+}));
+TreeRoot.displayName = 'TreeRoot';
+TreeRoot['aglyn'] = true;
+export default TreeRoot;
+
+//# sourceMappingURL=tree-root.js.map

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

@@ -0,0 +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"}

package/src/lib/components/trunk.d.ts

@@ -0,0 +1,22 @@
+/**
+ * @license
+ * Copyright 2023 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';
+export interface TrunkProps {
+    node: Aglyn.NodeSchema<any>;
+}
+export declare const Trunk: import("react").FunctionComponent<TrunkProps & import("react").RefAttributes<any>>;
+export default Trunk;

package/src/lib/components/trunk.js

@@ -0,0 +1,37 @@
+/**
+ * @license
+ * Copyright 2023 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: this file names `Aglyn.NodeSchema` and nothing else, and a
+// VALUE namespace import of the core barrel is opaque to a bundler — it
+// cannot know which exports are read, so every module the barrel reaches
+// 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 } from "react";
+import RendererComponents from "../contexts/renderer-components.js";
+export const Trunk = observer(/*#__PURE__*/ forwardRef((props, ref)=>{
+    const { node } = props;
+    return /*#__PURE__*/ _jsx(RendererComponents.Consumer, {
+        children: ({ StemComponent })=>/*#__PURE__*/ _jsx(StemComponent, {
+                ref: ref,
+                node: node
+            })
+    });
+}));
+Trunk.displayName = 'Trunk';
+Trunk['aglyn'] = true;
+export default Trunk;
+
+//# sourceMappingURL=trunk.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../libs/aglyn-node-renderer/src/lib/components/trunk.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 } from 'react'\nimport RendererComponents from '../contexts/renderer-components'\n\nexport interface TrunkProps {\n  node: Aglyn.NodeSchema<any>\n}\n\nexport const Trunk = observer(\n  forwardRef<any, TrunkProps>((props, ref) => {\n    const { node } = props\n\n    return (\n      <RendererComponents.Consumer>\n        {({ StemComponent }) => <StemComponent ref={ref} node={node} />}\n      </RendererComponents.Consumer>\n    )\n  }),\n)\nTrunk.displayName = 'Trunk'\nTrunk['aglyn'] = true\n\nexport default Trunk\n"],"names":["observer","forwardRef","RendererComponents","Trunk","props","ref","node","Consumer","StemComponent","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GAED,wEAAwE;AACxE,wEAAwE;AACxE,yEAAyE;AACzE,kDAAkD;;AAElD,SAASA,QAAQ,QAAQ,kBAAiB;AAC1C,SAASC,UAAU,QAAQ,QAAO;AAClC,OAAOC,wBAAwB,qCAAiC;AAMhE,OAAO,MAAMC,QAAQH,uBACnBC,WAA4B,CAACG,OAAOC;IAClC,MAAM,EAAEC,IAAI,EAAE,GAAGF;IAEjB,qBACE,KAACF,mBAAmBK,QAAQ;kBACzB,CAAC,EAAEC,aAAa,EAAE,iBAAK,KAACA;gBAAcH,KAAKA;gBAAKC,MAAMA;;;AAG7D,IACD;AACDH,MAAMM,WAAW,GAAG;AACpBN,KAAK,CAAC,QAAQ,GAAG;AAEjB,eAAeA,MAAK"}

package/src/lib/contexts/leaf-sx-transform.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @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.
+ */
+/**
+ * Optional transform applied to the fully merged sx of every rendered
+ * Leaf (caller sx + node props.sx + node-level sx) just before it
+ * reaches the element (AGL-581). The besigner canvas provides it while
+ * an artboard device preview is active, re-targeting viewport media
+ * queries (visibility bands, custom width queries) at the simulated
+ * device width. Production tenant rendering never mounts the provider,
+ * so published sites keep real media-query behavior untouched.
+ *
+ * `nodeId` (AGL-2486) lets a transform apply to ONE node rather than the
+ * whole canvas — the interaction-state hold renders only the SELECTED
+ * element as if hovered/pressed/focused, and every other leaf must keep
+ * rendering its resting state. Optional and ignored by the device-width
+ * transform, which is canvas-wide.
+ */
+export type LeafSxTransform = (sx: unknown, nodeId?: string) => unknown;
+export declare const LeafSxTransformContext: import("react").Context<LeafSxTransform>;
+export default LeafSxTransformContext;

package/src/lib/contexts/leaf-sx-transform.js

@@ -0,0 +1,21 @@
+/**
+ * @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";
+export const LeafSxTransformContext = /*#__PURE__*/ createContext(undefined);
+LeafSxTransformContext.displayName = 'LeafSxTransformContext';
+export default LeafSxTransformContext;
+
+//# sourceMappingURL=leaf-sx-transform.js.map

package/src/lib/contexts/leaf-sx-transform.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../libs/aglyn-node-renderer/src/lib/contexts/leaf-sx-transform.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\nimport { createContext } from 'react'\n\n/**\n * Optional transform applied to the fully merged sx of every rendered\n * Leaf (caller sx + node props.sx + node-level sx) just before it\n * reaches the element (AGL-581). The besigner canvas provides it while\n * an artboard device preview is active, re-targeting viewport media\n * queries (visibility bands, custom width queries) at the simulated\n * device width. Production tenant rendering never mounts the provider,\n * so published sites keep real media-query behavior untouched.\n *\n * `nodeId` (AGL-2486) lets a transform apply to ONE node rather than the\n * whole canvas — the interaction-state hold renders only the SELECTED\n * element as if hovered/pressed/focused, and every other leaf must keep\n * rendering its resting state. Optional and ignored by the device-width\n * transform, which is canvas-wide.\n */\nexport type LeafSxTransform = (sx: unknown, nodeId?: string) => unknown\n\nexport const LeafSxTransformContext = createContext<\n  LeafSxTransform | undefined\n>(undefined)\nLeafSxTransformContext.displayName = 'LeafSxTransformContext'\n\nexport default LeafSxTransformContext\n"],"names":["createContext","LeafSxTransformContext","undefined","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GAED,SAASA,aAAa,QAAQ,QAAO;AAmBrC,OAAO,MAAMC,uCAAyBD,cAEpCE,WAAU;AACZD,uBAAuBE,WAAW,GAAG;AAErC,eAAeF,uBAAsB"}