ggaction 0.0.18 → 0.0.19

package/src/layout/guideCollisions.js

@@ -2,7 +2,15 @@ export function assertGuideCollisionBlocks(blocks) {
   for (let index = 0; index < blocks.length; index += 1) {
     const a = blocks[index];
     for (const b of blocks.slice(index + 1)) {
-      if (a.position !== b.position || a.kind === "axis" && b.kind === "axis") continue;
+      if (a.kind === "axis" && b.kind === "axis") {
+        if (!(a.namedAxis || b.namedAxis) || a.axisId === b.axisId || !a.textBounds || !b.textBounds) continue;
+        if (a.textBounds.some(left => left && b.textBounds.some(right => right &&
+            left.left < right.right && left.right > right.left && left.top < right.bottom && left.bottom > right.top))) {
+          throw new Error(`The ${a.id} and ${b.id} text overlap; independent axes require separate text bounds.`);
+        }
+        continue;
+      }
+      if (a.position !== b.position) continue;
       if (a.bounds.left < b.bounds.right && a.bounds.right > b.bounds.left &&
         a.bounds.top < b.bounds.bottom && a.bounds.bottom > b.bounds.top) {
         throw new Error(`The ${a.position} ${a.id} and ${b.id} overlap; guides require more margin space or different offsets.`);

package/src/layout/legendGroup.js

@@ -1 +1 @@
-import{PLOT_LEGEND_POSITIONS as I}from"./legend.js";import{SIDE_LEGEND_BLOCK_GAP as M,HORIZONTAL_LEGEND_BLOCK_GAP as N}from"./legendLane.js";function H({blocks:g,group:O,plot:e,canvas:L,allowOverflow:l=!1}){if(g.length===0)return[];const{placement:t,blockLayout:f}=O,u=I.includes(t.position),c=["left","right"].includes(t.position),x=f==="column"||f==="wrap"&&c,y=u||c||t.at!==void 0?M:N,_=e.width-(u?t.offset*2:0);let h=0,p=0,w=0;const d=g.map(i=>{const o=i.bounds.right-i.bounds.left,E=i.bounds.bottom-i.bounds.top;if(f==="wrap"&&!x&&!u&&o>_&&!l)throw new Error("Horizontal legend block requires more plot width.");!x&&f==="wrap"&&h>0&&h+o>_&&(h=0,p+=w+y,w=0);const G={id:i.id,x:h,y:p,width:o,height:E};return x?p+=E+y:(h+=o+y,w=Math.max(w,E)),G}),r=Math.max(...d.map(i=>i.x+i.width)),a=Math.max(...d.map(i=>i.y+i.height));if(f==="wrap"&&t.position==="top"){const i=new Map;for(const o of d)i.set(o.y,Math.max(i.get(o.y)??0,o.height));for(const o of d)o.y=a-o.y-i.get(o.y)}let n,s;if(t.at!==void 0)n=e.x+t.at.x,s=e.y+t.at.y;else if(u){if(r+2*t.offset>e.width||a+2*t.offset>e.height)throw new Error("In-plot legend group does not fit the plot inset.");n=t.position.endsWith("left")?e.x+t.offset:e.x+e.width-t.offset-r,s=t.position.startsWith("top")?e.y+t.offset:e.y+e.height-t.offset-a}else c?(n=t.position==="right"?e.x+e.width+t.offset:e.x-t.offset-r,s=e.y):(n=t.align==="left"?e.x:t.align==="right"?e.x+e.width-r:e.x+(e.width-r)/2,s=t.position==="top"?e.y-t.offset-a:e.y+e.height+t.offset);const m={left:n,top:s,right:n+r,bottom:s+a};if(m.left<0||m.top<0||m.right>L.width||m.bottom>L.height)throw new Error("Legend group requires more Canvas space.");return d.map((i,o)=>({id:i.id,dx:n+i.x-g[o].bounds.left,dy:s+i.y-g[o].bounds.top}))}export{H as resolveLegendGroupPlacement};
+import{PLOT_LEGEND_POSITIONS as M}from"./legend.js";import{SIDE_LEGEND_BLOCK_GAP as N,HORIZONTAL_LEGEND_BLOCK_GAP as P}from"./legendLane.js";function A({blocks:g,group:l,plot:e,canvas:L,allowOverflow:O=!1,deferCanvasFit:G=!1}){if(g.length===0)return[];const{placement:t,blockLayout:f}=l,u=M.includes(t.position),c=["left","right"].includes(t.position),x=f==="column"||f==="wrap"&&c,y=u||c||t.at!==void 0?N:P,_=e.width-(u?t.offset*2:0);let h=0,p=0,w=0;const d=g.map(i=>{const o=i.bounds.right-i.bounds.left,E=i.bounds.bottom-i.bounds.top;if(f==="wrap"&&!x&&!u&&o>_&&!O)throw new Error("Horizontal legend block requires more plot width.");!x&&f==="wrap"&&h>0&&h+o>_&&(h=0,p+=w+y,w=0);const I={id:i.id,x:h,y:p,width:o,height:E};return x?p+=E+y:(h+=o+y,w=Math.max(w,E)),I}),r=Math.max(...d.map(i=>i.x+i.width)),a=Math.max(...d.map(i=>i.y+i.height));if(f==="wrap"&&t.position==="top"){const i=new Map;for(const o of d)i.set(o.y,Math.max(i.get(o.y)??0,o.height));for(const o of d)o.y=a-o.y-i.get(o.y)}let n,s;if(t.at!==void 0)n=e.x+t.at.x,s=e.y+t.at.y;else if(u){if(r+2*t.offset>e.width||a+2*t.offset>e.height)throw new Error("In-plot legend group does not fit the plot inset.");n=t.position.endsWith("left")?e.x+t.offset:e.x+e.width-t.offset-r,s=t.position.startsWith("top")?e.y+t.offset:e.y+e.height-t.offset-a}else c?(n=t.position==="right"?e.x+e.width+t.offset:e.x-t.offset-r,s=e.y):(n=t.align==="left"?e.x:t.align==="right"?e.x+e.width-r:e.x+(e.width-r)/2,s=t.position==="top"?e.y-t.offset-a:e.y+e.height+t.offset);const m={left:n,top:s,right:n+r,bottom:s+a};if(!G&&(m.left<0||m.top<0||m.right>L.width||m.bottom>L.height))throw new Error("Legend group requires more Canvas space.");return d.map((i,o)=>({id:i.id,dx:n+i.x-g[o].bounds.left,dy:s+i.y-g[o].bounds.top}))}export{A as resolveLegendGroupPlacement};

package/src/materialization/compositionSnapshot.js

@@ -1,4 +1,6 @@
 import { cloneAndFreeze, freezeOwned, isPlainObject } from "../core/immutable.js";
+import { namespaceGraphicId } from "../selectors/graphicCapacity.js";
+export { namespaceGraphicId } from "../selectors/graphicCapacity.js";
 import {
   requireSingleOrderedGraphicByType,
   walkGraphicTreeEvents
@@ -28,13 +30,6 @@ function validateCanvas(canvas, id) {
   }
 }
 
-export function namespaceGraphicId(namespace, id) {
-  const encode = value => Array.from(value, character =>
-    character.codePointAt(0).toString(16).padStart(6, "0")
-  ).join("");
-  return `g${encode(namespace)}_${id}`;
-}
-
 function rewriteItem(item, namespace) {
   if (!isPlainObject(item) || typeof item.id !== "string" || item.id.length === 0) {
     throw new TypeError("Graphic snapshot items require non-empty string ids.");

package/src/materialization/coordinateBounds.js

@@ -1,3 +1,4 @@
+import { cartesianAxisOwners } from "../selectors/axes.js";
 import { isSourceOwnedText } from "../grammar/text.js";
 import { resolvePolarFrame } from "../grammar/polar.js";
 import { resolveEffectiveBounds } from "../layout/aspect.js";
@@ -203,10 +204,22 @@ export function resolveGuideCoordinateBounds(program, {
   return resolveCoordinateBounds(program, target, { resolvedScales });
 }
 
+// Axis consumers use a displaced frame; marks and grids retain the plot.
+export function resolveCartesianAxisFrameBounds(program, channel, position, scale, axisId = channel) {
+  const plot = resolveGuideCoordinateBounds(program, {
+    coordinate: program.semanticSpec.guides.axis?.[axisId]?.coordinate, scale, channel
+  });
+  if (plot === undefined) return undefined;
+  const offset = program.guideConfigs.axis?.[axisId]?.frame?.offset ?? 0;
+  if (offset === 0) return plot;
+  const shift = ["bottom", "right"].includes(position) ? offset : -offset;
+  return channel === "x" ? { ...plot, y: plot.y + shift } : { ...plot, x: plot.x + shift };
+}
+
 // Cartesian guide bindings are semantic scale consumers without data rows.
 export function axisScaleBindings(program, id) {
-  return Object.entries(program.semanticSpec.guides.axis ?? {}).flatMap(([channel, guide]) =>
-    ["x", "y"].includes(channel) && guide.scale === id && guide.coordinate !== undefined &&
-      program.materializationConfigs?.guides?.axis?.[channel]?.binding?.standalone === true
-      ? [{ channel, coordinate: guide.coordinate }] : []);
+  return cartesianAxisOwners(program).flatMap(owner =>
+    owner.scale === id && owner.coordinate !== undefined &&
+      owner.config?.binding?.standalone === true
+      ? [{ channel: owner.channel, coordinate: owner.coordinate }] : []);
 }

package/src/materialization/facetGuides/edit.js

@@ -0,0 +1,30 @@
+import { prepareSharedFacetLegend } from "./preparation.js";
+import { facetLegendIntent, intrinsicFacetLegendSource, restoreFacetLegendIntent,
+  prepareAuthoredFacetLegend } from "./owner.js";
+
+export function editFacetParentLegend(program, operation, args) {
+  if (program.compositionSpec?.type !== "facet") {
+    throw new Error(`${operation} supports only a unit chart or a facet parent shared legend.`);
+  }
+  const current = program.compositionSpec.facet.guides.legend;
+  if (current === false) throw new Error(`${operation} requires an existing facet parent legend.`);
+  const prepared = current === "shared" ? prepareSharedFacetLegend(program) : prepareAuthoredFacetLegend(program);
+  let source;
+  if (prepared.source !== undefined) {
+    source = restoreFacetLegendIntent(intrinsicFacetLegendSource(program), facetLegendIntent(prepared.source));
+  } else {
+    const entries = prepared.compatibility.entries;
+    if (entries.length !== 1) throw new Error("Facet parent inferred legend requires an unambiguous native owner.");
+    const config = entries[0].config;
+    source = intrinsicFacetLegendSource(program).createLegend({ target: config.target, channels: ["color"],
+      itemGap: 26, titleStyle: { fontSize: 12, fontWeight: 700 },
+      ...(prepared.legend.mark === "point" ? { symbol: { layers: [{ type: "point", size: 5.5, stroke: "#ffffff", strokeWidth: 0.35 }] } } : {}) });
+  }
+  source = source[operation](args);
+  const intent = Object.keys(source.guideConfigs.legend ?? {}).length === 0 ? false : facetLegendIntent(source);
+  const spec = program.compositionSpec;
+  return program._clone({ trace: source.trace, actionStack: source.actionStack, actionSequence: source._actionSequence })
+    ._withCompositionState({ children: program.children,
+      compositionSpec: { ...spec, facet: { ...spec.facet, guides: { ...spec.facet.guides, legend: intent } } } })
+    .materializeComposition();
+}

package/src/materialization/facetGuides/layout.js

@@ -1 +1 @@
-import{PLOT_LEGEND_POSITIONS as B}from"../../layout/legend.js";import{resolveConcreteGraphicBounds as G}from"../../grammar/schemas/graphicBounds.js";import{resolveFacetOuterAxes as I}from"../../grammar/facets/guides.js";import{resolveTextBounds as L,textBoundsIntersect as S}from"../../core/textMetrics.js";import{axisGraphicIds as y}from"../guides/resources.js";import{resolveFacetHeaderItems as F}from"../facetHeaders.js";function p(s,t,e){return{left:s.left+t,right:s.right+t,top:s.top+e,bottom:s.bottom+e}}function P(s,t,e,m){const c=s.materializationConfigs.textMetrics,d=I({placements:t.children}),i=[];for(const n of t.children){const a=s.children[n.id];for(const g of["x","y"])if(!(s.compositionSpec.facet.guides.axes==="outer"&&!d.children[n.id][g]))for(const f of y(g)){if(!/Labels|Title/.test(f)||a.graphicSpec.objects[f]===void 0)continue;const x=G(a.graphicSpec,f,c);x!==void 0&&i.push(p(x,n.x,n.y))}}const{items:h}=F(t,e,m);for(const n of h)n.properties.text!==""&&i.push(L(n.properties,c));return i}function w(s,t,e,m,c){const d=s.right-s.left,i=s.bottom-s.top,h=e==="right"?t.x+t.width+c:e==="left"?t.x-c-d:m==="left"?t.x:m==="right"?t.x+t.width-d:t.x+(t.width-d)/2,n=["left","right"].includes(e)?t.y:e==="top"?t.y-c-i:t.y+t.height+c;return{left:h,right:h+d,top:n,bottom:n+i}}function j(s,{layout:t,plot:e,plots:m,title:c,preparedHeaders:d,prepared:i}){if(i?.mode!=="promoted")return{layout:t,plot:e};const h=i.occupiedGroup;if(h?.placement.at!==void 0||B.includes(h?.placement.position))return{layout:t,plot:e};const n=i.reservation.position,a=i.reservation.align,g=i.kinds.map(r=>i.source.guideConfigs.legend[r]),f=i.reservation.gap,x=h===void 0?g.every(r=>r.inferredOffset===!0):h.inferredOffset===!0;let o=w(i.bounds,e,n,a,f);const v=P(s,t,m,d),b=v.map(r=>n==="right"?r.right-(e.x+e.width):n==="left"?e.x-r.left:n==="top"?e.y-r.top:r.bottom-(e.y+e.height));if(x)o=w(i.bounds,e,n,a,Math.max(f,...b.map(r=>r+f)));else if(v.some(r=>S(o,r)))throw new Error("Facet shared legend overlaps retained axes or headers.");const u=Math.max(0,t.padding.left-o.left),l=Math.max(0,c.height+t.padding.top-o.top),M=t.children.map(r=>({...r,x:r.x+u,y:r.y+l})),O={...e,x:e.x+u,y:e.y+l};return o=p(o,u,l),{plot:O,layout:{...t,children:M,width:Math.ceil(Math.max(t.width+u,o.right+t.padding.right)),height:Math.ceil(Math.max(t.height+l,o.bottom+t.padding.bottom)),legend:{position:n,x:o.left,y:o.top,width:o.right-o.left,height:o.bottom-o.top,translation:{x:o.left-i.bounds.left,y:o.top-i.bounds.top}}}}}export{j as resolvePromotedFacetLegendLayout};
+import{resolveAuthoredFacetLegendLayout as p}from"./ownerLayout.js";import{cartesianAxisOwners as B}from"../../selectors/axes.js";import{PLOT_LEGEND_POSITIONS as F}from"../../layout/legend.js";import{resolveConcreteGraphicBounds as G}from"../../grammar/schemas/graphicBounds.js";import{resolveFacetOuterSides as I}from"../../grammar/facets/guides.js";import{resolveTextBounds as P,textBoundsIntersect as C}from"../../core/textMetrics.js";import{axisGraphicIds as E}from"../guides/resources.js";import{resolveFacetHeaderItems as T}from"../facetHeaders.js";function b(o,t,e){return{left:o.left+t,right:o.right+t,top:o.top+e,bottom:o.bottom+e}}function M(o,t,e,f){const r=o.materializationConfigs.textMetrics,h=I({placements:t.children}),i=[];for(const s of t.children){const m=o.children[s.id];for(const a of B(m))for(const[g,w]of[[2,"labels"],[3,"title"]]){const n=a.config?.[w]?.position;if(o.compositionSpec.facet.guides.axes==="outer"&&!h[n]?.includes(s.id))continue;const u=E(a.channel,a.id)[g];if(m.graphicSpec.objects[u]===void 0)continue;const x=G(m.graphicSpec,u,r);x!==void 0&&i.push(b(x,s.x,s.y))}}const{items:d}=T(t,e,f);for(const s of d)s.properties.text!==""&&i.push(P(s.properties,r));return i}function O(o,t,e,f,r){const h=o.right-o.left,i=o.bottom-o.top,d=e==="right"?t.x+t.width+r:e==="left"?t.x-r-h:f==="left"?t.x:f==="right"?t.x+t.width-h:t.x+(t.width-h)/2,s=["left","right"].includes(e)?t.y:e==="top"?t.y-r-i:t.y+t.height+r;return{left:d,right:d+h,top:s,bottom:s+i}}function q(o,{layout:t,plot:e,plots:f,title:r,preparedHeaders:h,prepared:i}){if(i?.mode==="authored")return p(o,{layout:t,plot:e,title:r,prepared:i,guides:M(o,t,f,h)});if(i?.mode!=="promoted")return{layout:t,plot:e};const d=i.occupiedGroup;if(d?.placement.at!==void 0||F.includes(d?.placement.position))return{layout:t,plot:e};const s=i.reservation.position,m=i.reservation.align,a=i.kinds.map(c=>i.source.guideConfigs.legend[c]),g=i.reservation.gap,w=d===void 0?a.every(c=>c.inferredOffset===!0):d.inferredOffset===!0;let n=O(i.bounds,e,s,m,g);const u=M(o,t,f,h),x=u.map(c=>s==="right"?c.right-(e.x+e.width):s==="left"?e.x-c.left:s==="top"?e.y-c.top:c.bottom-(e.y+e.height));if(w)n=O(i.bounds,e,s,m,Math.max(g,...x.map(c=>c+g)));else if(u.some(c=>C(n,c)))throw new Error("Facet shared legend overlaps retained axes or headers.");const l=Math.max(0,t.padding.left-n.left),v=Math.max(0,r.height+t.padding.top-n.top),L=t.children.map(c=>({...c,x:c.x+l,y:c.y+v})),S={...e,x:e.x+l,y:e.y+v};return n=b(n,l,v),{plot:S,layout:{...t,children:L,width:Math.ceil(Math.max(t.width+l,n.right+t.padding.right)),height:Math.ceil(Math.max(t.height+v,n.bottom+t.padding.bottom)),legend:{position:s,x:n.left,y:n.top,width:n.right-n.left,height:n.bottom-n.top,translation:{x:n.left-i.bounds.left,y:n.top-i.bounds.top}}}}}export{q as resolvePromotedFacetLegendLayout};

package/src/materialization/facetGuides/owner.js

@@ -0,0 +1,125 @@
+import { findLayer } from "../../selectors/layers.js";
+import { isAuthoredFacetLegend } from "../../grammar/facets/legendIntent.js";
+export { isAuthoredFacetLegend };
+import { freezeOwned } from "../../core/immutable.js";
+import { unionConcreteGraphicBounds } from "../../grammar/schemas/graphicBounds.js";
+import { describeLegendBlock } from "../../grammar/legendBlocks.js";
+import { legendResourcePolicy, allLegendGraphicIds } from "../guides/resources.js";
+import { resolveSharedFacetLegends, sameFacetGuideValue } from "../../grammar/facets/guides.js";
+
+export function facetLegendIntent(source) {
+  return freezeOwned({ type: "authored-legend", blocks: Object.fromEntries(
+    Object.entries(source.guideConfigs.legend ?? {}).map(([kind, config]) => [kind, {
+      config,
+      ...(source.semanticSpec.guides.legend?.[legendResourcePolicy(kind).semanticKind] === undefined ? {} : {
+        guide: source.semanticSpec.guides.legend[legendResourcePolicy(kind).semanticKind]
+      })
+    }])
+  ), groups: source.guideConfigs.legendGroups ?? {} });
+}
+
+export function intrinsicFacetLegendSource(program) {
+  const first = program.children[program.compositionSpec.children[0]];
+  let source = new program.constructor({
+    semanticSpec: first.semanticSpec, graphicSpec: first.graphicSpec,
+    resolvedScales: first.resolvedScales, materializationConfigs: first.materializationConfigs,
+    context: { ...first.context, deferGuideLayoutValidation: true, facetLegendIntrinsic: true },
+    trace: program.trace, actionStack: program.actionStack, actionSequence: program._actionSequence
+  });
+  for (const id of allLegendGraphicIds(Object.keys(source.guideConfigs.legend ?? {}))) {
+    if (source.graphicSpec.objects[id] !== undefined) source = source.editGraphics({ target: id, remove: true });
+  }
+  for (const key of Object.keys(source.semanticSpec.guides.legend ?? {})) {
+    source = source.editSemantic({ property: `guide.legend.${key}`, remove: true });
+  }
+  return source._withoutMaterializationConfig(["guides", "legend"])
+    ._withoutMaterializationConfig(["guides", "legendGroups"]);
+}
+
+export function restoreFacetLegendIntent(source, intent) {
+  const scaffolds = [];
+  for (const [kind, { config }] of Object.entries(intent.blocks)) {
+    const descriptor = describeLegendBlock(source, kind, config);
+    const entry = { target: config.target, channels: [...descriptor.channels] };
+    if (descriptor.channels.includes("shape") && descriptor.channels.includes("size")) entry.combine = "size-shape";
+    if (kind === "colorSize") entry.combine = "color-size";
+    if (descriptor.family === "categorical" && config.inferredSymbol === false && entry.combine === undefined) entry.symbol = config.symbol;
+    if (kind === "gradient" && config.representation === "symbols") entry.representation = "symbols";
+    scaffolds.push(entry);
+  }
+  // Build unclipped resources first; each authored block restores its own window below.
+  // A global scaffold option would also reach gradient strips or overwrite sibling windows.
+  for (const args of scaffolds) source = source.createLegend(args);
+  for (const [kind, { config, guide }] of Object.entries(intent.blocks)) {
+    source = source._withLegendConfig(kind, config);
+    const background = legendResourcePolicy(kind).graphicIds.find(id => id.endsWith("Background"));
+    if (config.border === false && source.graphicSpec.objects[background] !== undefined) {
+      source = source.editGraphics({ target: background, remove: true });
+    } else if (config.border !== false && background !== undefined && source.graphicSpec.objects[background] === undefined) {
+      const roots = new Set(legendResourcePolicy(kind).graphicIds);
+      const before = source.graphicSpec.objects.canvas.children.find(id => roots.has(id));
+      source = source.createGraphics({ id: background, type: "rect", parent: "canvas", ...(before === undefined ? {} : { before }) });
+    }
+    if (guide !== undefined) {
+      for (const [property, value] of Object.entries(guide)) {
+        source = source.editSemantic({ property: `guide.legend.${legendResourcePolicy(kind).semanticKind}.${property}`, value });
+      }
+    }
+  }
+  source = source._withMaterializationConfig(["guides", "legendGroups"], intent.groups);
+  return source.rematerializeLegend();
+}
+
+export function prepareAuthoredFacetLegend(program, intent = program.compositionSpec.facet.guides.legend) {
+  let source = intrinsicFacetLegendSource(program);
+  source = isAuthoredFacetLegend(intent) ? restoreFacetLegendIntent(source, intent) : source.createLegend(intent);
+  const kinds = Object.keys(source.guideConfigs.legend ?? {});
+  for (const [kind, config] of Object.entries(source.guideConfigs.legend)) {
+    const descriptor = describeLegendBlock(source, kind, config);
+    const owner = findLayer(source, config.target);
+    for (const channel of descriptor.channels) {
+      if (program.compositionSpec.facet.scales[channel] === "independent") {
+        throw new Error("Facet parent legend requires shared encoded scales.");
+      }
+    }
+    for (const child of Object.values(program.children)) {
+      const candidate = findLayer(child, config.target);
+      if (candidate === undefined || candidate.mark.type !== owner.mark.type ||
+          descriptor.channels.some(channel => !sameFacetGuideValue(candidate.encoding?.[channel], owner.encoding?.[channel])) ||
+          !sameFacetGuideValue(child.markConfigs[config.target], source.markConfigs[config.target])) {
+        throw new Error("Facet parent legend requires compatible source mark bindings and recipes in every child.");
+      }
+    }
+  }
+  const compatibility = resolveSharedFacetLegends(program.compositionSpec.children.map(id => ({
+    id, guideConfigs: source.guideConfigs, resolvedScales: program.children[id].resolvedScales
+  })));
+  const blocks = kinds.map(kind => {
+    const ids = new Set(allLegendGraphicIds([kind]));
+    const roots = source.graphicSpec.objects.canvas.children.filter(id => ids.has(id));
+    const bounds = unionConcreteGraphicBounds(source.graphicSpec, roots, source.materializationConfigs.textMetrics);
+    if (bounds === undefined) throw new Error("Facet parent legend requires measurable block bounds.");
+    return { kind, roots, bounds, config: source.guideConfigs.legend[kind] };
+  });
+  return { mode: "authored", source, kinds, blocks, compatibility,
+    intent: facetLegendIntent(source),
+    roots: blocks.flatMap(block => block.roots),
+    bounds: unionConcreteGraphicBounds(source.graphicSpec, blocks.flatMap(block => block.roots), source.materializationConfigs.textMetrics),
+    reservation: { position: "right", align: "center", gap: 0, width: 0, height: 0 } };
+}
+
+// Theme reconciliation changes the derived native appearance in one transaction.
+// Adopt only that transaction's configs; ordinary layout/data replay reads intent.
+export function synchronizeFacetLegendAppearance(program) {
+  const intent = program.compositionSpec?.type === "facet" ? program.compositionSpec.facet.guides.legend : undefined;
+  if (!isAuthoredFacetLegend(intent)) return program;
+  const blocks = Object.fromEntries(Object.entries(intent.blocks).map(([kind, block]) => {
+    const config = program.guideConfigs.legend?.[kind];
+    if (config === undefined || config.target !== block.config.target) throw new Error("Parent theme reconciliation lost its legend owner.");
+    return [kind, { ...block, config }];
+  }));
+  const spec = program.compositionSpec;
+  return program._withCompositionState({ children: program.children,
+    compositionSpec: { ...spec, facet: { ...spec.facet,
+      guides: { ...spec.facet.guides, legend: { ...intent, blocks, groups: program.guideConfigs.legendGroups ?? {} } } } } });
+}

package/src/materialization/facetGuides/ownerLayout.js

@@ -0,0 +1,71 @@
+import { localLegendPlacement } from "../../grammar/legendGroups.js";
+import { PLOT_LEGEND_POSITIONS } from "../../core/vocabulary.js";
+import { resolveLegendGroupPlacement } from "../../layout/legendGroup.js";
+import { textBoundsIntersect } from "../../core/textMetrics.js";
+
+const shift = (bounds, x, y) => ({ left: bounds.left + x, right: bounds.right + x,
+  top: bounds.top + y, bottom: bounds.bottom + y });
+
+function nativeGroup(blocks) {
+  const config = blocks[0].config;
+  const positions = new Set(blocks.map(block => block.config.position));
+  if (positions.size > 1) throw new Error("Parent legend inherited blocks require one common anchor.");
+  const placement = { position: config.position ?? "right", align: config.align ?? "center",
+    offset: Math.max(...blocks.map(block => block.config.offset ?? 0)) };
+  return { placement, blockLayout: "wrap", inferredOffset: blocks.every(block => block.config.inferredOffset === true) };
+}
+
+export function resolveAuthoredFacetLegendLayout(program, { layout, plot, title, prepared, guides }) {
+  const partitions = [];
+  const targets = [...new Set(prepared.blocks.map(block => block.config.target))];
+  for (const target of targets) {
+    const owned = prepared.blocks.filter(block => block.config.target === target);
+    const inherited = owned.filter(block => localLegendPlacement(block.config) === undefined);
+    if (inherited.length) partitions.push({ blocks: inherited,
+      group: prepared.source.guideConfigs.legendGroups?.[target] ?? nativeGroup(inherited) });
+    for (const block of owned) {
+      const placement = localLegendPlacement(block.config);
+      if (placement !== undefined) partitions.push({ blocks: [block],
+        group: { placement, blockLayout: "column", inferredOffset: placement.inferredOffset } });
+    }
+  }
+  const placements = [];
+  for (const { blocks, group } of partitions) {
+    const position = group.placement.position;
+    const inside = group.placement.at !== undefined || PLOT_LEGEND_POSITIONS.includes(position);
+    let effective = group;
+    if (!inside && group.inferredOffset === true) {
+      const base = group.placement.offset;
+      const distances = guides.map(bound => position === "right" ? bound.right - plot.x - plot.width
+        : position === "left" ? plot.x - bound.left : position === "top" ? plot.y - bound.top
+        : bound.bottom - plot.y - plot.height);
+      effective = { ...group, placement: { ...group.placement, offset: Math.max(base, ...distances.map(value => value + base)) } };
+    }
+    const plans = resolveLegendGroupPlacement({ blocks: blocks.map(block => ({ id: block.kind, bounds: block.bounds })),
+      group: effective, plot, canvas: layout, deferCanvasFit: true });
+    for (const plan of plans) {
+      const block = blocks.find(block => block.kind === plan.id);
+      const bounds = shift(block.bounds, plan.dx, plan.dy);
+      if (inside && (bounds.left < plot.x || bounds.right > plot.x + plot.width ||
+          bounds.top < plot.y || bounds.bottom > plot.y + plot.height)) {
+        throw new Error("Facet parent legend does not fit the final plot union.");
+      }
+      if (guides.some(bound => textBoundsIntersect(bounds, bound))) {
+        throw new Error("Facet parent legend overlaps retained axes or headers.");
+      }
+      if (placements.some(other => textBoundsIntersect(bounds, other.bounds))) {
+        throw new Error("Facet parent legend blocks overlap.");
+      }
+      placements.push({ kind: block.kind, dx: plan.dx, dy: plan.dy, bounds, inside });
+    }
+  }
+  const dx = Math.max(0, ...placements.map(item => layout.padding.left - item.bounds.left));
+  const dy = Math.max(0, ...placements.map(item => title.height + layout.padding.top - item.bounds.top));
+  const moved = placements.map(item => ({ ...item, dx: item.dx + dx, dy: item.dy + dy,
+    bounds: shift(item.bounds, dx, dy) }));
+  return { plot: { ...plot, x: plot.x + dx, y: plot.y + dy },
+    layout: { ...layout, children: layout.children.map(cell => ({ ...cell, x: cell.x + dx, y: cell.y + dy })),
+      width: Math.ceil(Math.max(layout.width + dx, ...moved.map(item => item.bounds.right + layout.padding.right))),
+      height: Math.ceil(Math.max(layout.height + dy, ...moved.map(item => item.bounds.bottom + layout.padding.bottom))),
+      parentLegendPlacements: moved } };
+}

package/src/materialization/facetGuides/placement.js

@@ -1,3 +1,5 @@
+import { translateGraphic } from "../graphicTranslation.js";
+import { cartesianAxisOwners } from "../../selectors/axes.js";
 import { resolveLegendGroupPlacement } from "../../layout/legendGroup.js";
 import { isPlainObject } from "../../core/immutable.js";
 import { resolveConcreteGraphicBounds } from
@@ -118,7 +120,32 @@ function assertSharedLegendFits(program, id, layout, plot, occupiedGroup) {
   return program;
 }
 
-export function applyFacetGuideComposition(program, { layout, plot } = {}) {
+function attachAuthoredParentLegend(program, prepared, layout, synchronizeColorSizeMeaning) {
+  const meaning = prepared.source.semanticSpec.guides.legend?.colorSize;
+  if (meaning !== undefined || program.semanticSpec.guides.legend?.colorSize !== undefined) {
+    program = synchronizeColorSizeMeaning(program, meaning);
+  }
+  const id = `${program.compositionSpec.id}-shared-legend`;
+  let next = program._withoutMaterializationConfig(["guides", "legend"])
+    ._withoutMaterializationConfig(["guides", "legendGroups"]);
+  next = copyLegendConfig(next, prepared.source).createGraphics({ id, type: "canvas", parent: "canvas" });
+  for (const [property, value] of Object.entries({ x: 0, y: 0, width: layout.width, height: layout.height, background: "transparent" })) {
+    next = next.editGraphics({ target: id, property, value });
+  }
+  for (const block of prepared.blocks) {
+    const placement = layout.parentLegendPlacements.find(item => item.kind === block.kind);
+    for (const root of block.roots) {
+      next = attachSnapshotObject(next, prepared.source.graphicSpec, root, id);
+      next = translateGraphic(next, root, placement.dx, placement.dy);
+    }
+  }
+  if (prepared.keepShared === true) return next;
+  const spec = next.compositionSpec;
+  return next._withCompositionState({ children: next.children,
+    compositionSpec: { ...spec, facet: { ...spec.facet, guides: { ...spec.facet.guides, legend: prepared.intent } } } });
+}
+
+export function applyFacetGuideComposition(program, { layout, plot, synchronizeColorSizeMeaning } = {}) {
   if (!isPlainObject(layout) || !Array.isArray(layout.children)) {
     throw new TypeError("Facet guide composition requires a resolved layout.");
   }
@@ -130,8 +157,10 @@ export function applyFacetGuideComposition(program, { layout, plot } = {}) {
     const child = program.children[cell.id];
     return {
       id: cell.id,
-      axes: Object.keys(child.guideConfigs.axis ?? {})
-        .filter(channel => ["x", "y"].includes(channel)),
+      axes: cartesianAxisOwners(child).map(owner => owner.id),
+      axisOwners: cartesianAxisOwners(child).map(owner => ({ id: owner.id, channel: owner.channel,
+        components: Object.fromEntries(["line", "ticks", "labels", "title"].flatMap(component =>
+          owner.config?.[component] === undefined ? [] : [[component, owner.config[component].position]])) })),
       legendKinds: legendKinds(child)
     };
   });
@@ -146,8 +175,15 @@ export function applyFacetGuideComposition(program, { layout, plot } = {}) {
   for (const cell of layout.children) {
     const namespace = `${program.compositionSpec.id}-${cell.id}`;
     const childPlan = ownership.children[cell.id];
-    for (const channel of childPlan.removeAxes) {
-      next = removeNamespacedGraphics(next, namespace, axisGraphicIds(channel));
+    const axisOwners = cartesianAxisOwners(program.children[cell.id]);
+    for (const axisId of childPlan.removeAxes) {
+      const owner = axisOwners.find(owner => owner.id === axisId);
+      next = removeNamespacedGraphics(next, namespace, axisGraphicIds(owner.channel, axisId));
+    }
+    for (const [axisId, components] of Object.entries(childPlan.removeAxisComponents ?? {})) {
+      const owner = axisOwners.find(owner => owner.id === axisId);
+      const ids = axisGraphicIds(owner.channel, axisId);
+      next = removeNamespacedGraphics(next, namespace, components.map(component => ids[["line", "ticks", "labels", "title"].indexOf(component)]));
     }
     if (childPlan.removeLegends.length > 0) {
       next = removeNamespacedGraphics(
@@ -157,7 +193,17 @@ export function applyFacetGuideComposition(program, { layout, plot } = {}) {
       );
     }
   }
-  if (prepared === undefined) return next;
+  if (prepared === undefined) {
+    if (next.semanticSpec.guides.legend?.colorSize !== undefined) {
+      next = synchronizeColorSizeMeaning(next, undefined);
+    }
+    return next._withoutMaterializationConfig(["guides", "legend"])
+      ._withoutMaterializationConfig(["guides", "legendGroups"]);
+  }
+  if (prepared.mode === "authored") {
+    next = attachAuthoredParentLegend(next, prepared, layout, synchronizeColorSizeMeaning);
+    return assertSharedLegendFits(next, `${program.compositionSpec.id}-shared-legend`, layout, plot, {});
+  }
   let id;
   if (prepared.mode === "legacyCategorical") {
     id = `${program.compositionSpec.id}-legend`;

package/src/materialization/facetGuides/preparation.js

@@ -1,3 +1,6 @@
+import { localLegendPosition } from "../../grammar/legendGroups.js";
+import { prepareAuthoredFacetLegend, facetLegendIntent } from "./owner.js";
+import { isPlainObject } from "../../core/immutable.js";
 import { PLOT_LEGEND_POSITIONS } from "../../layout/legend.js";
 import { isContinuousColorScaleType } from "../../grammar/scales/types.js";
 import {
@@ -178,6 +181,7 @@ function promotedLegendPlacement(source, kinds) {
 }
 
 export function prepareSharedFacetLegend(program) {
+  if (isPlainObject(program.compositionSpec.facet.guides.legend)) return prepareAuthoredFacetLegend(program);
   if (program.compositionSpec.facet.guides.legend !== "shared") {
     return undefined;
   }
@@ -190,6 +194,9 @@ export function prepareSharedFacetLegend(program) {
   }
   const source = inferred ? prepareAutoLegendSource(first) : first;
   const kinds = legendKinds(source);
+  if (kinds.some(kind => localLegendPosition(source.guideConfigs.legend[kind]) !== undefined)) {
+    return { ...prepareAuthoredFacetLegend(program, facetLegendIntent(source)), keepShared: true };
+  }
   const compatibility = resolveSharedFacetLegends(
     compatibleLegendChildren(program, source, inferred)
   );

package/src/materialization/facets.js

@@ -1 +1 @@
-import{resolveConcreteGraphicBounds as C}from"../grammar/schemas/graphicBounds.js";import{textBoundsFitCanvas as G,textBoundsIntersect as m,resolveTextBounds as F}from"../core/textMetrics.js";import{axisGraphicIds as k,allLegendGraphicIds as L}from"./guides/resources.js";import{resolveGraphicBounds as u}from"../layout/canvas.js";import{resolvePlacedPlotBounds as j}from"../layout/composition.js";import{alignedTextAnchor as P,buildTitleReadingBlock as z,paintedTitleComponent as T,resolveTitleComponentBounds as B,titleTextProperties as E}from"../layout/title.js";import{resolveFacetLayout as $}from"../layout/facets.js";import{namespaceGraphicId as b,namespaceGraphicSnapshot as M}from"./compositionSnapshot.js";import{prepareSharedFacetLegend as v}from"./facetGuides/index.js";import{resolvePromotedFacetLegendLayout as O}from"./facetGuides/layout.js";import{attachSnapshotObject as H,clearCompositionChildren as I,compositionChildDescriptor as q}from"./composition.js";import{materializeFacetHeaders as A,prepareFacetHeaders as R}from"./facetHeaders.js";const _={top:0,right:0,bottom:0,left:0};function W(e){const n=e.materializationConfigs.facets?.[e.compositionSpec.id];if(n===void 0)throw new Error(`Facet "${e.compositionSpec.id}" requires materialization config.`);return n}function D(e){if(e.semanticSpec.title.text===void 0)return{height:0};const n=e.titleConfig;if(n===void 0)throw new Error("Facet title requires chart title configuration.");if(n.position!=="top")throw new Error("Facet parent title currently supports only top position.");const i=z({text:e.semanticSpec.title.text,subtitle:e.semanticSpec.title.subtitle},n),o=8+n.offset;if(o<0)throw new Error("Facet parent title offset places text outside the Canvas.");return{config:n,block:i,top:o,height:Math.ceil(o+i.height)}}function w(e,n,i,o,l,d,s){if(i.length===0)return e;const r=P(d.x,d.width,e.titleConfig.align)+(e.titleConfig.alongOffset??0),t=T({x:r,y:o.map(h=>s+h),lines:i,textAlign:e.titleConfig.align}),c=B(t,l,e.materializationConfigs.textMetrics);if(!G(c,e.graphicSpec.objects.canvas.properties))throw new Error("Facet parent title places text outside the Canvas.");const a=t.lines.length;let p=e.createGraphics({id:n,type:"text",...a>1?{length:a}:{},parent:"canvas"});for(const[h,f]of Object.entries(E(t,l)))p=p.editGraphics({target:n,property:h,value:f});return p}function N(e,n,i){let o=w(e,"chartTitle",i.block.titleLines,i.block.titleCenters,i.config.titleStyle,n,i.top);return i.block.subtitleLines.length>0&&(o=w(o,"chartSubtitle",i.block.subtitleLines,i.block.subtitleCenters,i.config.subtitleStyle,n,i.top)),o}function Z(e,n){if(e._assertCompositionProgram("resolveFacetProgramLayout"),e.compositionSpec.type!=="facet")throw new Error("resolveFacetProgramLayout requires a facet composition.");n??=v(e);const i=D(e),o=e.compositionSpec,l=R(e,W(e).headers),d=new Map((o.facet.grid?.cells??[]).map(c=>[c.id,c]));let s=$({children:o.children.map((c,a)=>({...q(c,e.children[c]),value:o.facet.values[a],...d.has(c)?{row:d.get(c).row,column:d.get(c).column}:{}})),spacing:o.spacing,plots:o.children.map(c=>({id:c,...u(e.children[c])})),columns:o.columns,gap:o.gap,align:o.align,padding:o.padding,titleHeight:i.height,headerLayout:l.headerLayout,sharedLegend:o.facet.guides.legend==="shared"&&n?.mode!=="promoted",...n===void 0?{}:{sharedLegendGap:n.reservation.gap,sharedLegendWidth:n.reservation.width,sharedLegendHeight:n.reservation.height,sharedLegendPosition:n.reservation.position}});const r=o.children.map(c=>({id:c,...u(e.children[c])}));let t=j({placements:s.children,plots:r});return{layout:s,plot:t}=O(e,{layout:s,plot:t,plots:r,title:i,preparedHeaders:l,prepared:n}),{layout:s,title:i,plot:t,plots:r,preparedHeaders:l}}function J(e,n,i){const o=[],l=n.children.map((s,r)=>({id:s.id,left:s.x+i[r].x,right:s.x+i[r].x+i[r].width,top:s.y+i[r].y,bottom:s.y+i[r].y+i[r].height}));for(const s of n.children){const r=e.children[s.id],t=[...["x","y"].flatMap(k).filter(c=>/Labels|Title/.test(c)),...L(Object.keys(r.guideConfigs.legend??{}))];for(const c of t){const a=b(`${e.compositionSpec.id}-${s.id}`,c);if(e.graphicSpec.objects[a]===void 0)continue;const p=C(e.graphicSpec,a,e.materializationConfigs.textMetrics);p!==void 0&&o.push({owner:s.id,bounds:p})}}const d=e.graphicSpec.objects[`${e.compositionSpec.id}-headers`];for(const s of d?.items??[])s.properties.text!==""&&o.push({owner:"headers",bounds:F(s.properties,e.materializationConfigs.textMetrics)});for(let s=0;s<o.length;s+=1){const r=o[s];if(l.some(t=>t.id!==r.owner&&m(r.bounds,t))||o.slice(0,s).some(t=>t.owner!==r.owner&&m(r.bounds,t.bounds)))throw new Error("Plot spacing gap is too small for the retained facet guides or headers.")}}function se(e){const n=v(e),{layout:i,title:o,plot:l,plots:d,preparedHeaders:s}=Z(e,n),r=e.graphicSpec.objects.canvas?.properties?.background??"white";let t=I(e);t.graphicSpec.objects.canvas===void 0&&(t=t.createGraphics({id:"canvas",type:"canvas"}));for(const[c,a]of Object.entries({width:i.width,height:i.height,background:r}))t=t.editGraphics({target:"canvas",property:c,value:a});for(const c of i.children){const a=e.children[c.id],p=M(a.graphicSpec,{namespace:`${e.compositionSpec.id}-${c.id}`,x:c.x,y:c.y});if(t=H(t,p,p.order[0],"canvas"),i.spacing==="plot"){const h=p.order[0],f=b(`${e.compositionSpec.id}-${c.id}`,"plot-background"),y=u(a),g=t.graphicSpec.objects[h].children?.[0];t=t.editGraphics({target:h,property:"background",value:"transparent"}).createGraphics({id:f,type:"rect",parent:h,...g===void 0?{}:{before:g}});for(const[x,S]of Object.entries({...y,stroke:"none",strokeWidth:0,fill:a.graphicSpec.objects.canvas.properties.background??"transparent"}))t=t.editGraphics({target:f,property:x,value:S})}}return t=A(t,i,d,s),t=t.composeFacetGuides({layout:i,plot:l}),i.spacing==="plot"&&J(t,i,d),o.height>0&&(t=N(t,l,o)),t._withCanvasConfig({margin:_,size:{width:"auto",height:"auto"}})}export{se as materializeFacetGraphics,Z as resolveFacetProgramLayout};
+import{cartesianAxisOwners as C}from"../selectors/axes.js";import{resolveConcreteGraphicBounds as G}from"../grammar/schemas/graphicBounds.js";import{textBoundsFitCanvas as F,textBoundsIntersect as m,resolveTextBounds as k}from"../core/textMetrics.js";import{axisGraphicIds as L,allLegendGraphicIds as j}from"./guides/resources.js";import{resolveGraphicBounds as u}from"../layout/canvas.js";import{resolvePlacedPlotBounds as P}from"../layout/composition.js";import{alignedTextAnchor as z,buildTitleReadingBlock as T,paintedTitleComponent as B,resolveTitleComponentBounds as E,titleTextProperties as O}from"../layout/title.js";import{resolveFacetLayout as $}from"../layout/facets.js";import{namespaceGraphicId as b,namespaceGraphicSnapshot as M}from"./compositionSnapshot.js";import{prepareSharedFacetLegend as v}from"./facetGuides/index.js";import{resolvePromotedFacetLegendLayout as H}from"./facetGuides/layout.js";import{attachSnapshotObject as I,clearCompositionChildren as A,compositionChildDescriptor as q}from"./composition.js";import{materializeFacetHeaders as R,prepareFacetHeaders as _}from"./facetHeaders.js";const W={top:0,right:0,bottom:0,left:0};function D(e){const c=e.materializationConfigs.facets?.[e.compositionSpec.id];if(c===void 0)throw new Error(`Facet "${e.compositionSpec.id}" requires materialization config.`);return c}function N(e){if(e.semanticSpec.title.text===void 0)return{height:0};const c=e.titleConfig;if(c===void 0)throw new Error("Facet title requires chart title configuration.");if(c.position!=="top")throw new Error("Facet parent title currently supports only top position.");const i=T({text:e.semanticSpec.title.text,subtitle:e.semanticSpec.title.subtitle},c),o=8+c.offset;if(o<0)throw new Error("Facet parent title offset places text outside the Canvas.");return{config:c,block:i,top:o,height:Math.ceil(o+i.height)}}function w(e,c,i,o,l,d,s){if(i.length===0)return e;const r=z(d.x,d.width,e.titleConfig.align)+(e.titleConfig.alongOffset??0),t=B({x:r,y:o.map(h=>s+h),lines:i,textAlign:e.titleConfig.align}),n=E(t,l,e.materializationConfigs.textMetrics);if(!F(n,e.graphicSpec.objects.canvas.properties))throw new Error("Facet parent title places text outside the Canvas.");const a=t.lines.length;let p=e.createGraphics({id:c,type:"text",...a>1?{length:a}:{},parent:"canvas"});for(const[h,f]of Object.entries(O(t,l)))p=p.editGraphics({target:c,property:h,value:f});return p}function Z(e,c,i){let o=w(e,"chartTitle",i.block.titleLines,i.block.titleCenters,i.config.titleStyle,c,i.top);return i.block.subtitleLines.length>0&&(o=w(o,"chartSubtitle",i.block.subtitleLines,i.block.subtitleCenters,i.config.subtitleStyle,c,i.top)),o}function J(e,c){if(e._assertCompositionProgram("resolveFacetProgramLayout"),e.compositionSpec.type!=="facet")throw new Error("resolveFacetProgramLayout requires a facet composition.");c??=v(e);const i=N(e),o=e.compositionSpec,l=_(e,D(e).headers),d=new Map((o.facet.grid?.cells??[]).map(n=>[n.id,n]));let s=$({children:o.children.map((n,a)=>({...q(n,e.children[n]),value:o.facet.values[a],...d.has(n)?{row:d.get(n).row,column:d.get(n).column}:{}})),spacing:o.spacing,plots:o.children.map(n=>({id:n,...u(e.children[n])})),columns:o.columns,gap:o.gap,align:o.align,padding:o.padding,titleHeight:i.height,headerLayout:l.headerLayout,sharedLegend:o.facet.guides.legend==="shared"&&c?.mode!=="promoted",...c===void 0?{}:{sharedLegendGap:c.reservation.gap,sharedLegendWidth:c.reservation.width,sharedLegendHeight:c.reservation.height,sharedLegendPosition:c.reservation.position}});const r=o.children.map(n=>({id:n,...u(e.children[n])}));let t=P({placements:s.children,plots:r});return{layout:s,plot:t}=H(e,{layout:s,plot:t,plots:r,title:i,preparedHeaders:l,prepared:c}),{layout:s,title:i,plot:t,plots:r,preparedHeaders:l}}function K(e,c,i){const o=[],l=c.children.map((s,r)=>({id:s.id,left:s.x+i[r].x,right:s.x+i[r].x+i[r].width,top:s.y+i[r].y,bottom:s.y+i[r].y+i[r].height}));for(const s of c.children){const r=e.children[s.id],t=[...C(r).flatMap(n=>L(n.channel,n.id).slice(2)),...j(Object.keys(r.guideConfigs.legend??{}))];for(const n of t){const a=b(`${e.compositionSpec.id}-${s.id}`,n);if(e.graphicSpec.objects[a]===void 0)continue;const p=G(e.graphicSpec,a,e.materializationConfigs.textMetrics);p!==void 0&&o.push({owner:s.id,bounds:p})}}const d=e.graphicSpec.objects[`${e.compositionSpec.id}-headers`];for(const s of d?.items??[])s.properties.text!==""&&o.push({owner:"headers",bounds:k(s.properties,e.materializationConfigs.textMetrics)});for(let s=0;s<o.length;s+=1){const r=o[s];if(l.some(t=>t.id!==r.owner&&m(r.bounds,t))||o.slice(0,s).some(t=>t.owner!==r.owner&&m(r.bounds,t.bounds)))throw new Error("Plot spacing gap is too small for the retained facet guides or headers.")}}function ae(e){const c=v(e),{layout:i,title:o,plot:l,plots:d,preparedHeaders:s}=J(e,c),r=e.graphicSpec.objects.canvas?.properties?.background??"white";let t=A(e);t.graphicSpec.objects.canvas===void 0&&(t=t.createGraphics({id:"canvas",type:"canvas"}));for(const[n,a]of Object.entries({width:i.width,height:i.height,background:r}))t=t.editGraphics({target:"canvas",property:n,value:a});for(const n of i.children){const a=e.children[n.id],p=M(a.graphicSpec,{namespace:`${e.compositionSpec.id}-${n.id}`,x:n.x,y:n.y});if(t=I(t,p,p.order[0],"canvas"),i.spacing==="plot"){const h=p.order[0],f=b(`${e.compositionSpec.id}-${n.id}`,"plot-background"),y=u(a),g=t.graphicSpec.objects[h].children?.[0];t=t.editGraphics({target:h,property:"background",value:"transparent"}).createGraphics({id:f,type:"rect",parent:h,...g===void 0?{}:{before:g}});for(const[x,S]of Object.entries({...y,stroke:"none",strokeWidth:0,fill:a.graphicSpec.objects.canvas.properties.background??"transparent"}))t=t.editGraphics({target:f,property:x,value:S})}}return t=R(t,i,d,s),t=t.composeFacetGuides({layout:i,plot:l}),i.spacing==="plot"&&K(t,i,d),o.height>0&&(t=Z(t,l,o)),t._withCanvasConfig({margin:W,size:{width:"auto",height:"auto"}})}export{ae as materializeFacetGraphics,J as resolveFacetProgramLayout};

package/src/materialization/graphicHierarchy.js

@@ -1,3 +1,5 @@
+import { cartesianAxisOwners } from "../selectors/axes.js";
+import { axisGraphicIds } from "./guides/resources.js";
 import {
   findGraphicParent,
   graphicSiblings
@@ -55,8 +57,10 @@ export function resolveMarkGraphicPlacement(program, { data, markType }) {
     ? dataset.transform[0]
     : undefined;
   if (transform?.type !== "regression") {
+    const named = new Set(cartesianAxisOwners(program).filter(owner => owner.named)
+      .flatMap(owner => axisGraphicIds(owner.channel, owner.id)));
     const axis = program.graphicSpec.objects[PLOT_GRAPHIC_ID]?.children?.find(
-      id => id === "plotBorder" || /^(x|y)Axis/.test(id)
+      id => id === "plotBorder" || /^(x|y)Axis/.test(id) || named.has(id)
     );
     return resolvePlotGraphicPlacement(
       program,

package/src/materialization/graphicTranslation.js

@@ -0,0 +1,73 @@
+function translateCommands(commands, dx, dy) {
+  return commands.map(command => {
+    if (command.op === "Z") return { ...command };
+    const next = {
+      ...command,
+      x: command.x + dx,
+      y: command.y + dy
+    };
+    if (command.op === "C") {
+      next.x1 = command.x1 + dx;
+      next.y1 = command.y1 + dy;
+      next.x2 = command.x2 + dx;
+      next.y2 = command.y2 + dy;
+    }
+    return next;
+  });
+}
+
+export function translatedProperties(type, properties, dx, dy) {
+  const next = { ...properties };
+  if (["circle", "rect", "text", "canvas"].includes(type)) {
+    next.x = (next.x ?? 0) + dx;
+    next.y = (next.y ?? 0) + dy;
+  } else if (type === "line") {
+    next.x1 += dx;
+    next.x2 += dx;
+    next.y1 += dy;
+    next.y2 += dy;
+  } else if (type === "path") {
+    next.commands = translateCommands(next.commands, dx, dy);
+  }
+  return next;
+}
+
+export function translateGraphic(program, id, dx, dy) {
+  const graphic = program.graphicSpec.objects[id];
+  if (dx === 0 && dy === 0) return program;
+  if (graphic.items !== undefined) {
+    let next = program.editGraphics({
+      target: id,
+      property: "items",
+      value: graphic.items.map(item => ({
+        type: item.type ?? graphic.type,
+        properties: translatedProperties(
+          item.type ?? graphic.type,
+          item.properties,
+          dx,
+          dy
+        )
+      }))
+    });
+    if (graphic.type !== "canvas") {
+      for (const child of graphic.children ?? []) next = translateGraphic(next, child, dx, dy);
+    }
+    return next;
+  }
+  let next = program;
+  const properties = translatedProperties(
+    graphic.type,
+    graphic.properties,
+    dx,
+    dy
+  );
+  for (const [property, value] of Object.entries(properties)) {
+    if (value !== graphic.properties[property]) {
+      next = next.editGraphics({ target: id, property, value });
+    }
+  }
+  if (graphic.type !== "canvas") {
+    for (const child of graphic.children ?? []) next = translateGraphic(next, child, dx, dy);
+  }
+  return next;
+}

package/src/materialization/guides/layout.js

@@ -1 +1 @@
-import{needsLegendAxisReflow as c}from"./resources.js";import{getErrorDetails as u}from"../../core/diagnostics.js";import{planCanvasRematerialization as m}from"../layout.js";import{applyMaterializationPlan as p}from"../planner.js";import{assertGuideCollisionBlocks as g}from"../../layout/guideCollisions.js";import{resolveGuideCollisionBlocks as h}from"./resources.js";import{resolveGuideCollisionBlocks as k}from"./resources.js";function C(i,d){if(i.context.deferGuideLayoutValidation===!0)return d(i);const n=i.materializationConfigs.canvas?.plot;let o=i.materializationConfigs.canvas?.margin,e;for(let f=0;;f+=1)try{let t=i._withContext({deferGuideLayoutValidation:!0});f>0&&(t=t.editGraphics({target:"canvas",property:"width",value:n.width+o.left+o.right}).editGraphics({target:"canvas",property:"height",value:n.height+o.top+o.bottom})._withCanvasConfig({...t.materializationConfigs.canvas,margin:o}),t=p(t,m(t))),e=d(t),e.compositionSpec===void 0&&Object.values(e.guideConfigs.legend??{}).some(r=>["left","right"].includes(r.position))&&(e=e.rematerializeSideLegendLane()),e.compositionSpec===void 0&&c(i,e)&&(e=e.rematerializeHorizontalLegendLane()),e.compositionSpec===void 0&&Object.keys(e.guideConfigs.legendGroups??{}).length>0&&(e=e.rematerializeLegendGroups()),n!==void 0&&e.titleConfig!==void 0&&(e=e.rematerializeTitle());break}catch(t){const r=u(t)?.canvasOverflow;if(n===void 0||r===void 0||f>=16)throw t;o=Object.fromEntries(Object.keys(o).map(l=>[l,r[l]>0?Math.ceil((o[l]+r[l])*4)/4:o[l]]))}const{deferGuideLayoutValidation:v,...s}=e.context;Object.hasOwn(i.context,"deferGuideLayoutValidation")&&(s.deferGuideLayoutValidation=i.context.deferGuideLayoutValidation);const a=e._clone({context:s});return g(h(a.graphicSpec,a.guideConfigs,a.titleConfig,a.materializationConfigs.textMetrics)),a}function b(i){return function(d){return C(this,n=>i.call(n,d))}}export{k as resolveGuideCollisionBlocks,C as withGuideLayoutTransaction,b as withGuideLayoutValidation};
+import{resetLegendClipGraphics as u,hasLegendClipGraphics as c}from"../legendClip.js";import{localLegendPosition as g}from"../legendGroups.js";import{needsLegendAxisReflow as m}from"./resources.js";import{getErrorDetails as p}from"../../core/diagnostics.js";import{planCanvasRematerialization as h}from"../layout.js";import{applyMaterializationPlan as C}from"../planner.js";import{assertGuideCollisionBlocks as L}from"../../layout/guideCollisions.js";import{resolveGuideCollisionBlocks as v}from"./resources.js";import{resolveGuideCollisionBlocks as M}from"./resources.js";function G(i,d){if(i.context.deferGuideLayoutValidation===!0)return d(i);const a=i.materializationConfigs.canvas?.plot;let n=i.materializationConfigs.canvas?.margin,e;for(let s=0;;s+=1)try{let t=u(i)._withContext({deferGuideLayoutValidation:!0});s>0&&(t=t.editGraphics({target:"canvas",property:"width",value:a.width+n.left+n.right}).editGraphics({target:"canvas",property:"height",value:a.height+n.top+n.bottom})._withCanvasConfig({...t.materializationConfigs.canvas,margin:n}),t=C(t,h(t))),e=d(t),c(i)&&!c(e)&&Object.values(e.guideConfigs.legend??{}).some(o=>o.clipHeight!==void 0)&&(e=e.rematerializeLegend()),e.compositionSpec===void 0&&Object.values(e.guideConfigs.legend??{}).some(o=>["left","right"].includes(o.position))&&(e=e.rematerializeSideLegendLane()),e.compositionSpec===void 0&&m(i,e)&&(e=e.rematerializeHorizontalLegendLane()),e.compositionSpec===void 0&&(Object.keys(e.guideConfigs.legendGroups??{}).length>0||Object.values(e.guideConfigs.legend??{}).some(o=>g(o)!==void 0))&&(e=e.rematerializeLegendGroups()),a!==void 0&&e.titleConfig!==void 0&&(e=e.rematerializeTitle());break}catch(t){const o=p(t)?.canvasOverflow;if(a===void 0||o===void 0||s>=16)throw t;n=Object.fromEntries(Object.keys(n).map(l=>[l,o[l]>0?Math.ceil((n[l]+o[l])*4)/4:n[l]]))}const{deferGuideLayoutValidation:y,...f}=e.context;Object.hasOwn(i.context,"deferGuideLayoutValidation")&&(f.deferGuideLayoutValidation=i.context.deferGuideLayoutValidation);const r=e._clone({context:f});return L(v(r.graphicSpec,r.guideConfigs,r.titleConfig,r.materializationConfigs.textMetrics)),r}function S(i){return function(d){return G(this,a=>i.call(a,d))}}export{M as resolveGuideCollisionBlocks,G as withGuideLayoutTransaction,S as withGuideLayoutValidation};