ggaction 0.0.17 → 0.0.18

package/src/materialization/facets.js

@@ -1,185 +1 @@
-import { resolveGraphicBounds } from "../layout/canvas.js";
-import { resolvePlacedPlotBounds } from "../layout/composition.js";
-import {
-  alignedTextAnchor,
-  buildTitleReadingBlock
-} from "../layout/title.js";
-import { resolveFacetLayout } from "../layout/facets.js";
-import { namespaceGraphicSnapshot } from "./compositionSnapshot.js";
-import { prepareSharedFacetLegend } from "./facetGuides/index.js";
-import {
-  attachSnapshotObject,
-  clearCompositionChildren,
-  compositionChildDescriptor
-} from "./composition.js";
-import {
-  materializeFacetHeaders,
-  prepareFacetHeaders
-} from "./facetHeaders.js";
-
-const ZERO_MARGIN = { top: 0, right: 0, bottom: 0, left: 0 };
-
-function facetConfig(program) {
-  const config = program.materializationConfigs.facets?.[program.compositionSpec.id];
-  if (config === undefined) {
-    throw new Error(`Facet "${program.compositionSpec.id}" requires materialization config.`);
-  }
-  return config;
-}
-
-function titleLayout(program) {
-  if (program.semanticSpec.title.text === undefined) {
-    return { height: 0 };
-  }
-  const config = program.titleConfig;
-  if (config === undefined) {
-    throw new Error("Facet title requires chart title configuration.");
-  }
-  if (config.position !== "top") {
-    throw new Error("Facet parent title currently supports only top position.");
-  }
-  const block = buildTitleReadingBlock({
-    text: program.semanticSpec.title.text,
-    subtitle: program.semanticSpec.title.subtitle
-  }, config);
-  const top = 8 + config.offset;
-  if (top < 0) {
-    throw new Error("Facet parent title offset places text outside the Canvas.");
-  }
-  return { config, block, top, height: Math.ceil(top + block.height) };
-}
-
-function materializeTitleComponent(program, id, lines, centers, style, plot, top) {
-  if (lines.length === 0) return program;
-  const x = alignedTextAnchor(plot.x, plot.width, program.titleConfig.align);
-  const count = lines.length;
-  let next = program.createGraphics({
-    id,
-    type: "text",
-    ...(count > 1 ? { length: count } : {}),
-    parent: "canvas"
-  });
-  for (const [property, value] of Object.entries({
-    x,
-    y: count === 1 ? top + centers[0] : centers.map(center => top + center),
-    text: count === 1 ? lines[0] : lines,
-    fill: style.color,
-    fontSize: style.fontSize,
-    fontFamily: style.fontFamily,
-    fontWeight: style.fontWeight,
-    textAlign: program.titleConfig.align,
-    textBaseline: "middle"
-  })) {
-    next = next.editGraphics({ target: id, property, value });
-  }
-  return next;
-}
-
-function materializeTitle(program, plot, title) {
-  let next = materializeTitleComponent(
-    program,
-    "chartTitle",
-    title.block.titleLines,
-    title.block.titleCenters,
-    title.config.titleStyle,
-    plot,
-    title.top
-  );
-  if (title.block.subtitleLines.length > 0) {
-    next = materializeTitleComponent(
-      next,
-      "chartSubtitle",
-      title.block.subtitleLines,
-      title.block.subtitleCenters,
-      title.config.subtitleStyle,
-      plot,
-      title.top
-    );
-  }
-  return next;
-}
-
-export function resolveFacetProgramLayout(program, preparedLegend) {
-  program._assertCompositionProgram("resolveFacetProgramLayout");
-  if (program.compositionSpec.type !== "facet") {
-    throw new Error("resolveFacetProgramLayout requires a facet composition.");
-  }
-  const title = titleLayout(program);
-  const spec = program.compositionSpec;
-  const preparedHeaders = prepareFacetHeaders(
-    program,
-    facetConfig(program).headers
-  );
-  const gridCells = new Map(
-    (spec.facet.grid?.cells ?? []).map(cell => [cell.id, cell])
-  );
-  const layout = resolveFacetLayout({
-    children: spec.children.map((id, index) => ({
-      ...compositionChildDescriptor(id, program.children[id]),
-      value: spec.facet.values[index],
-      ...(gridCells.has(id) ? {
-        row: gridCells.get(id).row,
-        column: gridCells.get(id).column
-      } : {})
-    })),
-    columns: spec.columns,
-    gap: spec.gap,
-    align: spec.align,
-    padding: spec.padding,
-    titleHeight: title.height,
-    headerLayout: preparedHeaders.headerLayout,
-    sharedLegend: spec.facet.guides.legend === "shared",
-    ...(preparedLegend === undefined ? {} : {
-      sharedLegendGap: preparedLegend.reservation.gap,
-      sharedLegendWidth: preparedLegend.reservation.width,
-      sharedLegendHeight: preparedLegend.reservation.height,
-      sharedLegendPosition: preparedLegend.reservation.position
-    })
-  });
-  const plots = spec.children.map(id => ({
-    id,
-    ...resolveGraphicBounds(program.children[id])
-  }));
-  const plot = resolvePlacedPlotBounds({
-    placements: layout.children,
-    plots
-  });
-  return { layout, title, plot, plots, preparedHeaders };
-}
-
-export function materializeFacetGraphics(program) {
-  const preparedLegend = prepareSharedFacetLegend(program);
-  const { layout, title, plot, plots, preparedHeaders } = resolveFacetProgramLayout(
-    program,
-    preparedLegend
-  );
-  const background = program.graphicSpec.objects.canvas?.properties
-    ?.background ?? "white";
-  let next = clearCompositionChildren(program);
-  if (next.graphicSpec.objects.canvas === undefined) {
-    next = next.createGraphics({ id: "canvas", type: "canvas" });
-  }
-  for (const [property, value] of Object.entries({
-    width: layout.width,
-    height: layout.height,
-    background
-  })) {
-    next = next.editGraphics({ target: "canvas", property, value });
-  }
-  for (const placement of layout.children) {
-    const child = program.children[placement.id];
-    const snapshot = namespaceGraphicSnapshot(child.graphicSpec, {
-      namespace: `${program.compositionSpec.id}-${placement.id}`,
-      x: placement.x,
-      y: placement.y
-    });
-    next = attachSnapshotObject(next, snapshot, snapshot.order[0], "canvas");
-  }
-  next = materializeFacetHeaders(next, layout, plots, preparedHeaders);
-  next = next.composeFacetGuides({ layout, plot });
-  if (title.height > 0) next = materializeTitle(next, plot, title);
-  return next._withCanvasConfig({
-    margin: ZERO_MARGIN,
-    size: { width: "auto", height: "auto" }
-  });
-}
+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};

package/src/materialization/graphicHierarchy.js

@@ -56,7 +56,7 @@ export function resolveMarkGraphicPlacement(program, { data, markType }) {
     : undefined;
   if (transform?.type !== "regression") {
     const axis = program.graphicSpec.objects[PLOT_GRAPHIC_ID]?.children?.find(
-      id => /^(x|y)Axis/.test(id)
+      id => id === "plotBorder" || /^(x|y)Axis/.test(id)
     );
     return resolvePlotGraphicPlacement(
       program,

package/src/materialization/guides/layout.js

@@ -1,57 +1 @@
-import { assertGuideCollisionBlocks } from "../../layout/guideCollisions.js";
-import { unionConcreteGraphicBounds } from "../../grammar/schemas/graphicBounds.js";
-import { axisGraphicIds, legendResourcePolicies } from "./resources.js";
-
-// Only domain-owned guides participate. Extension primitives may deliberately
-// overlap, and a combined categorical/size legend is one occupied group.
-export function resolveGuideCollisionBlocks(graphicSpec, guideConfigs, titleConfig, profile) {
-  const blocks = [];
-  const append = (id, kind, position, ids) => {
-    if (position === undefined) return;
-    const existing = ids.filter(id => graphicSpec.objects[id] !== undefined);
-    const bounds = unionConcreteGraphicBounds(graphicSpec, existing, profile);
-    if (bounds !== undefined) blocks.push({ id, kind, position, bounds });
-  };
-  append("chart title", "title", titleConfig?.position, ["chartTitle", "chartSubtitle"]);
-  for (const channel of ["x", "y"]) {
-    for (const id of axisGraphicIds(channel)) {
-      const component = id.slice(`${channel}Axis`.length).toLowerCase();
-      append(`${channel}-axis ${component}`, "axis", guideConfigs.axis?.[channel]?.[component]?.position, [id]);
-    }
-  }
-  const policies = legendResourcePolicies();
-  const configs = guideConfigs.legend ?? {};
-  const categorical = policies.find(policy => policy.family === "categorical" && configs[policy.kind] !== undefined);
-  const combined = categorical !== undefined && configs.size !== undefined &&
-    configs[categorical.kind].target === configs.size.target;
-  for (const policy of policies) {
-    const config = configs[policy.kind];
-    if (config === undefined || combined && policy.kind === "size") continue;
-    const ids = combined && policy === categorical
-      ? [...policy.graphicIds, ...policies.find(item => item.kind === "size").graphicIds]
-      : policy.graphicIds;
-    append(`${policy.kind}${combined && policy === categorical ? "+size" : ""} legend`, "legend", config.position, ids);
-  }
-  return blocks;
-}
-
-
-// Defer cross-guide checks while sibling materializers still carry old
-// coordinates. The scope is transient and never survives a returned program.
-export function withGuideLayoutTransaction(program, apply) {
-  if (program.context.deferGuideLayoutValidation === true) return apply(program);
-  const result = apply(program._withContext({ deferGuideLayoutValidation: true }));
-  const { deferGuideLayoutValidation: _deferred, ...context } = result.context;
-  if (Object.hasOwn(program.context, "deferGuideLayoutValidation")) {
-    context.deferGuideLayoutValidation = program.context.deferGuideLayoutValidation;
-  }
-  const next = result._clone({ context });
-  assertGuideCollisionBlocks(resolveGuideCollisionBlocks(next.graphicSpec, next.guideConfigs, next.titleConfig, next.materializationConfigs.textMetrics));
-  return next;
-}
-
-export function withGuideLayoutValidation(implementation) {
-  return function (args) {
-    return withGuideLayoutTransaction(this, program => implementation.call(program, args));
-  };
-}
+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};

package/src/materialization/guides/resources.js

@@ -1,123 +1 @@
-const AXIS_COMPONENTS = Object.freeze(["Line", "Ticks", "Labels", "Title"]);
-
-const CATEGORICAL_COMPONENTS = Object.freeze([
-  "Symbols", "SymbolLines", "SymbolPoints", "SymbolSwatches",
-  "Labels", "Title", "Background"
-]);
-
-const LEGEND_RESOURCE_POLICIES = Object.freeze({
-  series: Object.freeze({
-    semanticKind: "series",
-    family: "categorical",
-    rematerializeOp: undefined,
-    graphicIds: Object.freeze(CATEGORICAL_COMPONENTS.map(
-      component => `seriesLegend${component}`
-    ))
-  }),
-  color: Object.freeze({
-    semanticKind: "color",
-    family: "categorical",
-    rematerializeOp: undefined,
-    graphicIds: Object.freeze(CATEGORICAL_COMPONENTS.map(
-      component => `colorLegend${component}`
-    ))
-  }),
-  stroke: Object.freeze({
-    semanticKind: "stroke",
-    family: "categorical",
-    rematerializeOp: undefined,
-    graphicIds: Object.freeze(CATEGORICAL_COMPONENTS.map(
-      component => `strokeLegend${component}`
-    ))
-  }),
-  size: Object.freeze({
-    semanticKind: "size",
-    family: "size",
-    rematerializeOp: "rematerializeSizeLegend",
-    graphicIds: Object.freeze([
-      "sizeLegendBackground", "sizeLegendSymbols", "sizeLegendLabels", "sizeLegendTitle"
-    ])
-  }),
-  gradient: Object.freeze({
-    semanticKind: "color",
-    family: "continuous",
-    rematerializeOp: "rematerializeGradientLegend",
-    graphicIds: Object.freeze([
-      "colorGradientBackground", "colorGradientStrips", "colorGradientTicks",
-      "colorGradientLabels", "colorGradientTitle"
-    ])
-  }),
-  interval: Object.freeze({
-    semanticKind: "color",
-    family: "interval",
-    rematerializeOp: "rematerializeIntervalLegend",
-    graphicIds: Object.freeze([
-      "colorLegendBackground", "colorLegendSymbols", "colorLegendLabels",
-      "colorLegendTitle"
-    ])
-  }),
-  strokeGradient: Object.freeze({
-    semanticKind: "stroke",
-    family: "continuous",
-    rematerializeOp: "rematerializeStrokeGradientLegend",
-    graphicIds: Object.freeze([
-      "strokeGradientBackground", "strokeGradientStrips", "strokeGradientTicks",
-      "strokeGradientLabels", "strokeGradientTitle"
-    ])
-  }),
-  strokeInterval: Object.freeze({
-    semanticKind: "stroke",
-    family: "interval",
-    rematerializeOp: "rematerializeStrokeIntervalLegend",
-    graphicIds: Object.freeze([
-      "strokeIntervalBackground", "strokeIntervalSymbols",
-      "strokeIntervalLabels", "strokeIntervalTitle"
-    ])
-  }),
-  opacity: Object.freeze({
-    semanticKind: "opacity",
-    family: "continuous",
-    rematerializeOp: "rematerializeOpacityLegend",
-    graphicIds: Object.freeze([
-      "opacityLegendBackground", "opacityLegendSymbols", "opacityLegendLabels",
-      "opacityLegendTitle"
-    ])
-  }),
-  strokeWidth: Object.freeze({
-    semanticKind: "strokeWidth",
-    family: "strokeWidth",
-    rematerializeOp: "rematerializeStrokeWidthLegend",
-    graphicIds: Object.freeze([
-      "strokeWidthLegendBackground", "strokeWidthLegendSymbols", "strokeWidthLegendLabels",
-      "strokeWidthLegendTitle"
-    ])
-  })
-});
-
-export function axisGraphicIds(channel) {
-  const prefix = channel === "radius" ? "radial" : channel;
-  return AXIS_COMPONENTS.map(component => `${prefix}Axis${component}`);
-}
-
-export function legendGraphicIds(kind) {
-  return legendResourcePolicy(kind).graphicIds;
-}
-
-export function legendResourcePolicy(kind) {
-  const policy = LEGEND_RESOURCE_POLICIES[kind];
-  if (policy === undefined) {
-    throw new Error(`Unknown legend graphic kind "${kind}".`);
-  }
-  return policy;
-}
-
-export function legendResourcePolicies() {
-  return Object.entries(LEGEND_RESOURCE_POLICIES).map(([kind, policy]) => ({
-    kind,
-    ...policy
-  }));
-}
-
-export function allLegendGraphicIds(kinds) {
-  return [...new Set(kinds.flatMap(legendGraphicIds))];
-}
+import{unionConcreteGraphicBounds as h}from"../../grammar/schemas/graphicBounds.js";function z(e,t,o,n){const r=[],s=(i,a,c,f)=>{if(c===void 0)return;const k=f.filter(L=>e.objects[L]!==void 0),b=h(e,k,n);b!==void 0&&r.push({id:i,kind:a,position:c,bounds:b})};s("chart title","title",o?.position,["chartTitle","chartSubtitle"]);for(const i of["x","y"])for(const a of I(i)){const c=a.slice(`${i}Axis`.length).toLowerCase();s(`${i}-axis ${c}`,"axis",t.axis?.[i]?.[c]?.position,[a])}const l=S(),d=t.legend??{},p=l.find(i=>i.family==="categorical"&&d[i.kind]!==void 0),g=p!==void 0&&d.size!==void 0&&d[p.kind].target===d.size.target&&(d.size.inheritPosition!==!1||d[p.kind].position===d.size.position),m=t.legendGroups??{};for(const[i,a]of Object.entries(m)){const c=l.filter(f=>d[f.kind]?.target===i).flatMap(f=>f.graphicIds);s(`${i} legend group`,"legend",a.placement.position??"free",c)}for(const i of l){const a=d[i.kind];if(m[a?.target]!==void 0||a===void 0||g&&i.kind==="size")continue;const c=g&&i===p?[...i.graphicIds,...l.find(f=>f.kind==="size").graphicIds]:i.graphicIds;s(`${i.kind}${g&&i===p?"+size":""} legend`,"legend",a.position,c)}return r}const y=Object.freeze(["Line","Ticks","Labels","Title"]),u=Object.freeze(["Symbols","SymbolLines","SymbolPoints","SymbolSwatches","Labels","Title","Background"]),O=Object.freeze({series:Object.freeze({semanticKind:"series",family:"categorical",rematerializeOp:void 0,graphicIds:Object.freeze(u.map(e=>`seriesLegend${e}`))}),color:Object.freeze({semanticKind:"color",family:"categorical",rematerializeOp:void 0,graphicIds:Object.freeze(u.map(e=>`colorLegend${e}`))}),stroke:Object.freeze({semanticKind:"stroke",family:"categorical",rematerializeOp:void 0,graphicIds:Object.freeze(u.map(e=>`strokeLegend${e}`))}),size:Object.freeze({semanticKind:"size",family:"size",rematerializeOp:"rematerializeSizeLegend",graphicIds:Object.freeze(["sizeLegendBackground","sizeLegendSymbols","sizeLegendLabels","sizeLegendTitle"])}),gradient:Object.freeze({semanticKind:"color",family:"continuous",rematerializeOp:"rematerializeGradientLegend",graphicIds:Object.freeze(["colorGradientBackground","colorGradientStrips","colorGradientTicks","colorGradientSymbols","colorGradientLabels","colorGradientTitle"])}),interval:Object.freeze({semanticKind:"color",family:"interval",rematerializeOp:"rematerializeIntervalLegend",graphicIds:Object.freeze(["colorLegendBackground","colorLegendSymbols","colorLegendLabels","colorLegendTitle"])}),strokeGradient:Object.freeze({semanticKind:"stroke",family:"continuous",rematerializeOp:"rematerializeStrokeGradientLegend",graphicIds:Object.freeze(["strokeGradientBackground","strokeGradientStrips","strokeGradientTicks","strokeGradientLabels","strokeGradientTitle"])}),strokeInterval:Object.freeze({semanticKind:"stroke",family:"interval",rematerializeOp:"rematerializeStrokeIntervalLegend",graphicIds:Object.freeze(["strokeIntervalBackground","strokeIntervalSymbols","strokeIntervalLabels","strokeIntervalTitle"])}),opacity:Object.freeze({semanticKind:"opacity",family:"continuous",rematerializeOp:"rematerializeOpacityLegend",graphicIds:Object.freeze(["opacityLegendBackground","opacityLegendSymbols","opacityLegendLabels","opacityLegendTitle"])}),strokeWidth:Object.freeze({semanticKind:"strokeWidth",family:"strokeWidth",rematerializeOp:"rematerializeStrokeWidthLegend",graphicIds:Object.freeze(["strokeWidthLegendBackground","strokeWidthLegendSymbols","strokeWidthLegendLabels","strokeWidthLegendTitle"])})});function I(e){const t=e==="radius"?"radial":e;return y.map(o=>`${t}Axis${o}`)}function j(e){return x(e).graphicIds}function x(e){const t=O[e];if(t===void 0)throw new Error(`Unknown legend graphic kind "${e}".`);return t}function S(){return Object.entries(O).map(([e,t])=>({kind:e,...t}))}function v(e){return[...new Set(e.flatMap(j))]}function C(e,t,o){if(t.inferredOffset!==!0||!["top","bottom"].includes(t.position)||t.layout==="legacy-bottom")return t.offset;const n=z(e.graphicSpec,e.guideConfigs,void 0,e.materializationConfigs.textMetrics).filter(s=>s.kind==="axis"&&s.position===t.position),r=t.position==="bottom"?Math.max(0,...n.map(s=>s.bounds.bottom-o.y-o.height)):Math.max(0,...n.map(s=>o.y-s.bounds.top));return t.offset+r}function G(e,t,o){if(t!=="size"||o.inheritPosition===!1)return o;const n=["series","color","stroke"].map(r=>e.guideConfigs.legend?.[r]).find(r=>r?.target===o.target);return n===void 0?o:{...o,position:n.position,offset:n.offset,inferredOffset:n.inferredOffset}}function $(e,t){return[e,t].some(n=>Object.entries(n.guideConfigs.legend??{}).some(([r,s])=>{const l=G(n,r,s);return l.inferredOffset===!0&&["top","bottom"].includes(l.position)&&l.layout!=="legacy-bottom"})||Object.values(n.guideConfigs.legendGroups??{}).some(r=>r.inferredOffset===!0&&["top","bottom"].includes(r.placement.position)))&&[e,t].some(n=>z(n.graphicSpec,n.guideConfigs,void 0,n.materializationConfigs.textMetrics).some(r=>r.kind==="axis"&&["top","bottom"].includes(r.position)))}export{v as allLegendGraphicIds,I as axisGraphicIds,G as effectiveLegendOffsetConfig,j as legendGraphicIds,S as legendResourcePolicies,x as legendResourcePolicy,$ as needsLegendAxisReflow,z as resolveGuideCollisionBlocks,C as resolveLegendAxisOffset};

package/src/materialization/layout.js

@@ -1,4 +1,57 @@
+import { canDeferScaleConsumerApplication, getLayerScaleIds, getMarkMaterializationStep } from "./marks/index.js";
+import { buildMaterializationPlan } from "./planner.js";
+import { hasMaterializedLegend } from "./legends.js";
+import { needsCanvasScaleRematerialization, planScaleGuideRematerialization } from "./scaleGuideDependencies.js";
+
+export function planCanvasRematerialization(program) {
+  const marks = [];
+  for (const layer of program.semanticSpec.layers) {
+    const step = getMarkMaterializationStep(program, layer);
+    if (step !== undefined) marks.push(step);
+  }
+  const deferredMarkIds = new Set(
+    marks
+      .map(step => step.args.id)
+  );
+  const scales = [];
+  for (const scale of program.semanticSpec.scales) {
+    if (needsCanvasScaleRematerialization(program, scale)) {
+      const deferredConsumers = program.semanticSpec.layers.filter(layer =>
+        canDeferScaleConsumerApplication(layer) &&
+        getLayerScaleIds(layer).includes(scale.id)
+      );
+      const canDeferMarks = deferredConsumers.length === 0 ||
+        deferredConsumers.every(layer => deferredMarkIds.has(layer.id));
+      scales.push({
+        op: "rematerializeScale",
+        args: {
+          id: scale.id,
+          guides: false,
+          ...(canDeferMarks ? { marks: false } : {})
+        }
+      });
+    }
+  }
+  const guides = program.semanticSpec.scales.flatMap(scale =>
+    needsCanvasScaleRematerialization(program, scale)
+      ? planScaleGuideRematerialization(program, scale.id)
+      : []
+  );
+  if (hasMaterializedLegend(program)) {
+    guides.push({ op: "rematerializeLegend" });
+  }
+  const layout = planLayoutRematerialization(program);
+  return buildMaterializationPlan({ scales, marks, guides, layout });
+}
+
+
 const LAYOUT_CONSUMER_POLICIES = Object.freeze([
+  Object.freeze({
+    applies(program) {
+      return program.compositionSpec === undefined && program.materializationConfigs?.canvas?.plotBorder !== undefined;
+    },
+    step: Object.freeze({ op: "rematerializePlotBorder" })
+  }),
   Object.freeze({
     applies(program) {
       return program.semanticSpec.title.text !== undefined &&

package/src/materialization/legendGroups.js

@@ -0,0 +1 @@
+import{PLOT_LEGEND_POSITIONS as u}from"../layout/legend.js";function p(r,t){return r.guideConfigs.legendGroups?.[t]}function c(r,t){const n=p(r,t.target);if(n===void 0)return t;const o=n.placement.position,e=u.includes(o),i=e?t.direction==="horizontal"?"top":"right":o??(u.includes(t.position)?t.direction==="horizontal"?"top":"right":t.position??"right");return{...t,position:i,offset:0,align:"left",groupIntrinsic:!0,...e?{groupCorner:!0}:{},...i==="right"?{align:"center"}:{}}}export{c as intrinsicLegendConfig,p as legendGroup};

package/src/materialization/legendText.js

@@ -0,0 +1 @@
+import{materializeTextLines as o}from"./textLines.js";import{resolveLegendTitleText as l}from"../layout/legendText.js";function m(e,i,t,n){const{lines:r}=l(t,n,e.materializationConfigs.textMetrics);return o(e,i,r)}export{m as materializeLegendTitleLines};

package/src/materialization/legends.js

@@ -2,7 +2,7 @@ import { findLayer } from "../selectors/layers.js";
 import { LEGEND_CONFIG_KINDS } from "../core/vocabulary.js";
 
 export function isOpacityLegendLayer(layer) {
-  return ["point", "line"].includes(layer.mark?.type) &&
+  return ["point", "line", "bar"].includes(layer.mark?.type) &&
     layer.encoding?.opacity?.scale !== undefined;
 }
 

package/src/materialization/marks/capabilities.js

@@ -60,10 +60,10 @@ export function canMaterializeLine(program, layer) {
     layer.mark?.type === "line" &&
     hasCartesianPositionScales(layer) &&
     ((isAggregate(layer.encoding.y.aggregate) &&
-      (layer.encoding.x.fieldType === "temporal" ||
+      (["temporal", "nominal", "ordinal"].includes(layer.encoding.x.fieldType) ||
         (layer.encoding.x.fieldType === "quantitative" &&
           layer.encoding.x.bin !== undefined))) ||
-      (layer.encoding.x.fieldType === "quantitative" &&
+      (["quantitative", "nominal", "ordinal"].includes(layer.encoding.x.fieldType) &&
         layer.encoding.y.fieldType === "quantitative") ||
       ((interval || layer.encoding.y.aggregate === undefined) &&
         ["quantitative", "temporal"].includes(layer.encoding.x.fieldType) &&
@@ -114,15 +114,14 @@ export function canMaterializeArc(_program, layer) {
   }
   if (layer.encoding.theta.fieldType === "quantitative") {
     return (
-      layer.encoding.theta.aggregate === undefined &&
-      layer.encoding?.radius === undefined
+      layer.encoding.theta.aggregate === undefined
     );
   }
   if (!["nominal", "ordinal"].includes(layer.encoding.theta.fieldType)) {
     return false;
   }
   if (["count", "sum"].includes(layer.encoding.theta.aggregate)) {
-    return layer.encoding?.radius === undefined;
+    return true;
   }
   return (
     layer.encoding.theta.aggregate === undefined &&
@@ -136,7 +135,7 @@ export function canMaterializeBar(program, layer) {
     return false;
   }
   const grain = resolveBarGrain(layer);
-  if (![BAR_GRAINS.histogram, BAR_GRAINS.aggregate, BAR_GRAINS.ranged].includes(grain)) {
+  if (![BAR_GRAINS.histogram, BAR_GRAINS.aggregate, BAR_GRAINS.ranged, BAR_GRAINS.centered].includes(grain)) {
     return false;
   }
   if (

package/src/materialization/rect.js

@@ -144,7 +144,7 @@ export function resolveRectRows(program, layer, dataset) {
 }
 
 export function resolveRectGraphicItems(program, layer, dataset) {
-  const radius = program.markConfigs[layer.id]?.cornerRadius ?? 0;
+  const radius = program.markConfigs[layer.id] ?? {};
   return resolveRectRows(program, layer, dataset).map(item =>
     materializeRectItem(item.properties, radius)
   );

package/src/materialization/scaleGuideDependencies.js

@@ -64,7 +64,7 @@ export function needsCanvasScaleRematerialization(program, scale) {
       usesRadialScale(program, scale.id) ||
       semanticGuideUsesScale(program, scale.id)) &&
     (program.resolvedScales[scale.id] !== undefined || scale.radialMapping !== undefined) &&
-    usesPositionalScale(program, scale.id)
+    (usesPositionalScale(program, scale.id) || semanticGuideUsesScale(program, scale.id))
   );
 }
 

package/src/materialization/scales/map.js

@@ -20,6 +20,9 @@ export function mapScaleConsumerValues(values, resolvedScale, channel) {
       resolvedScale.domain,
       resolvedScale.range,
       {
+        type: resolvedScale.type,
+        base: resolvedScale.base,
+        constant: resolvedScale.constant,
         interpolation: resolvedScale.interpolate,
         midpoint: resolvedScale.midpoint,
         clamp: resolvedScale.clamp ?? false,

package/src/materialization/scales/policies/arc.js

@@ -1,3 +1,4 @@
+import { resolveArcInnerRadius } from "../../../grammar/arcs.js";
 import { validateMeasuredRadiusScale } from "../../../grammar/scales/radial.js";
 export function resolveArcAutoPositionRange({
   consumers,
@@ -15,16 +16,16 @@ export function resolveArcAutoPositionRange({
     return range;
   }
   if (channel === "radius") {
-    const ratios = consumers.map(
-      consumer => markConfigs[consumer.layer.id]?.innerRadius ?? 0
-    );
-    if (new Set(ratios).size !== 1) {
+    const outer = Math.max(...range);
+    const inner = consumers.map(consumer => resolveArcInnerRadius(
+      markConfigs[consumer.layer.id]?.innerRadius ?? 0, outer
+    ));
+    if (new Set(inner).size !== 1) {
       throw new Error(
         `Shared arc radius scale "${scale.id}" requires one innerRadius policy.`
       );
     }
-    const outer = Math.max(...range);
-    return [outer * ratios[0], outer];
+    return [inner[0], outer];
   }
   if (
     channel === "theta" &&
@@ -67,7 +68,7 @@ export function validateMeasuredRadiusConsumers({ scale, domain, range, consumer
     const config = markConfigs[layer.id] ?? {};
     if ((config.padAngle ?? 0) !== 0) throw new Error("Measured Arc requires padAngle 0.");
     if (scale.range !== "auto" && config.innerRadiusExplicit === true &&
-      Math.abs(config.innerRadius - range[0] / range[1]) > Number.EPSILON * 8) {
+      Math.abs(resolveArcInnerRadius(config.innerRadius, range[1]) / range[1] - range[0] / range[1]) > Number.EPSILON * 8) {
       throw new Error("Measured Arc innerRadius must agree with its explicit radius range.");
     }
   }

package/src/materialization/scales/policies/bar.js

@@ -7,14 +7,19 @@ import {
   interpolateNumber,
   inverseLerp
 } from "../../../grammar/numeric.js";
-export function resolveTemporalBarBand(valuesByConsumer, domain, range) {
+export function resolveTemporalBarBand(valuesByConsumer, domain, range, markConfigs = {}, preserveRange = false) {
   const temporalBars = valuesByConsumer.filter(({ consumer }) => {
     const channels = resolveBarChannels(consumer.layer);
-    return resolveBarGrain(consumer.layer) === BAR_GRAINS.aggregate &&
+    return [BAR_GRAINS.aggregate, BAR_GRAINS.ranged].includes(resolveBarGrain(consumer.layer)) &&
       channels?.category === consumer.channel &&
       consumer.encoding.fieldType === "temporal";
   });
   if (temporalBars.length === 0) return undefined;
+  const intervalBars = temporalBars.filter(({consumer}) => markConfigs[consumer.layer.id]?.barWidth?.interval !== undefined);
+  if (intervalBars.length > 0) {
+    if (intervalBars.length !== temporalBars.length) throw new Error("Temporal interval and centered bar widths cannot share a position scale.");
+    return undefined;
+  }
   const temporalFields = new Set(
     temporalBars.map(({ consumer }) => consumer.encoding.field)
   );
@@ -31,6 +36,11 @@ export function resolveTemporalBarBand(valuesByConsumer, domain, range) {
       "A temporal bar position scale requires compatible bar, line, rule, or text consumers of one field."
     );
   }
+  // Explicit pixel widths do not need an inferred half-slot inset. Keep one
+  // common range when a shared scale also has band-width bar consumers.
+  preserveRange ||= temporalBars.every(({ consumer }) =>
+    markConfigs[consumer.layer.id]?.barWidth?.pixels !== undefined
+  );
   const values = temporalBars.flatMap(item => item.values);
   const ordered = [...new Set(values)].sort((left, right) => left - right);
   if (ordered.length < 2) {
@@ -59,7 +69,7 @@ export function resolveTemporalBarBand(valuesByConsumer, domain, range) {
       interpolateNumber(range[0], range[1], bandwidthFraction) - range[0]
     )
     : directBandwidth;
-  const resolvedRange = stable
+  const resolvedRange = preserveRange ? [...range] : stable
     ? [
         interpolateNumber(range[0], range[1], bandwidthFraction / 2),
         interpolateNumber(range[0], range[1], 1 - bandwidthFraction / 2)
@@ -79,10 +89,12 @@ export function resolveTemporalBarBand(valuesByConsumer, domain, range) {
   });
   let bandwidth = Infinity;
   for (let index = 1; index < positions.length; index += 1) {
-    bandwidth = Math.min(
-      bandwidth,
-      Math.abs(positions[index] - positions[index - 1])
-    );
+    const gap = Math.abs(positions[index] - positions[index - 1]);
+    // Keep a finite conservative slot when an explicitly requested span itself
+    // exceeds the representable difference of two finite endpoints.
+    bandwidth = Math.min(bandwidth,
+      preserveRange && !Number.isFinite(gap) ? estimatedBandwidth : gap);
+
   }
   if (![estimatedBandwidth, bandwidth, ...resolvedRange].every(Number.isFinite)) {
     throw new RangeError("Temporal bar position exceeds the finite numeric range.");