ggaction 0.0.13 → 0.0.15

package/src/actions/boxPlots/options.js

@@ -7,6 +7,14 @@ import {
   validateUnitInterval
 } from "../../core/validation.js";
 import { validatePointShape } from "../../grammar/pointShapes.js";
+import {
+  requestedRectStyleDetails,
+  RECT_STYLE_PROPERTIES
+} from "../../grammar/roundedRect.js";
+import {
+  requestedStrokeDetails,
+  STROKE_STYLE_PROPERTIES
+} from "../../grammar/strokeStyle.js";
 import { DEFAULT_COLORS } from "../../theme/defaults.js";
 import { normalizeGuides } from "../charts/shared.js";
 
@@ -45,24 +53,30 @@ function plainOptions(value, keys, label, operation = "createBoxPlot") {
   return value;
 }
 
-function resolveAppearance(value, defaults, label, operation) {
+function resolveAppearance(value, defaults, label, operation, details) {
   const options = plainOptions(
     value,
-    Object.keys(defaults),
+    [
+      ...Object.keys(defaults),
+      ...(details === requestedRectStyleDetails
+        ? RECT_STYLE_PROPERTIES
+        : STROKE_STYLE_PROPERTIES)
+    ],
     label,
     operation
   );
-  return Object.freeze(Object.fromEntries(
-    Object.entries(defaults).map(([key, fallback]) => [
-      key,
-      options[key] === undefined
-        ? fallback
-        : APPEARANCE_VALIDATORS[key](
-            options[key],
-            `createBoxPlot ${label}.${key}`
-          )
-    ])
-  ));
+  return Object.freeze({
+    ...Object.fromEntries(Object.entries(defaults).map(([key, fallback]) => [
+        key,
+        options[key] === undefined
+          ? fallback
+          : APPEARANCE_VALIDATORS[key](
+              options[key],
+              `${operation} ${label}.${key}`
+            )
+      ])),
+    ...details(options, `${operation} ${label}`)
+  });
 }
 
 export function resolveBoxPosition(value, label, operation = "createBoxPlot") {
@@ -122,13 +136,31 @@ export function resolveBoxWidth(value, operation = "createBoxPlot") {
 }
 
 export function resolveBoxAppearance(value, operation = "createBoxPlot") {
-  return resolveAppearance(value, DEFAULT_BOX, "box", operation);
+  return resolveAppearance(
+    value,
+    DEFAULT_BOX,
+    "box",
+    operation,
+    requestedRectStyleDetails
+  );
 }
 
 export function resolveBoxMedianAppearance(value, operation = "createBoxPlot") {
-  return resolveAppearance(value, DEFAULT_MEDIAN, "median", operation);
+  return resolveAppearance(
+    value,
+    DEFAULT_MEDIAN,
+    "median",
+    operation,
+    requestedStrokeDetails
+  );
 }
 
 export function resolveBoxOutlierAppearance(value, operation = "createBoxPlot") {
-  return resolveAppearance(value, DEFAULT_OUTLIER, "outlier", operation);
+  return resolveAppearance(
+    value,
+    DEFAULT_OUTLIER,
+    "outlier",
+    operation,
+    requestedStrokeDetails
+  );
 }

package/src/actions/categoryOrder/index.js

@@ -8,7 +8,10 @@ import {
   applyMaterializationPlan,
   planScaleGuideRematerialization
 } from "../../materialization/dependencies.js";
-import { getMarkMaterializationStep } from "../../materialization/marks/index.js";
+import {
+  getMarkMaterializationStep,
+  getSourceDependentMarkSteps
+} from "../../materialization/marks/index.js";
 import { buildMaterializationPlan } from "../../materialization/planner.js";
 import {
   CATEGORY_ORDER_CHANNELS,
@@ -56,14 +59,22 @@ function resolveAssignment(program, args, operation, { activeOnly = false } = {}
 
 function rematerializeAssignment(program, scaleId) {
   const consumers = findScaleConsumers(program, scaleId);
+  const directMarks = consumers.map(consumer =>
+    getMarkMaterializationStep(program, consumer.layer)
+  );
   return applyMaterializationPlan(program, buildMaterializationPlan({
     scales: [{
       op: "rematerializeScale",
       args: { id: scaleId, guides: false, marks: false }
     }],
-    marks: consumers.map(consumer =>
-      getMarkMaterializationStep(program, consumer.layer)
-    ),
+    marks: [
+      ...directMarks,
+      ...directMarks.flatMap(step =>
+        step === undefined
+          ? []
+          : getSourceDependentMarkSteps(program, step.args.id)
+      )
+    ],
     guides: planScaleGuideRematerialization(program, scaleId)
   }));
 }

package/src/actions/charts/area.js

@@ -1,4 +1,5 @@
 import { action } from "../../core/action.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import { normalizeGroupFields } from "../../grammar/pathSeries.js";
 import { normalizeAreaBound, validateAreaEndpointPair } from "../../grammar/areaEndpoints.js";
 import {
@@ -31,7 +32,10 @@ export const createAreaPlot = action({ op: OPERATION, description: "Create a sim
   const upper = ranged ? measurement.upper : { datum: args.baseline ?? 0 };
   validateAreaEndpointPair(normalizeAreaBound(lower), normalizeAreaBound(upper));
   const groupBy = args.groupBy === undefined ? undefined : normalizeGroupFields(args.groupBy);
-  const area = omitUndefinedOptions(normalizeAppearance(args.area, ["fill", "opacity", "stroke", "strokeWidth", "curve"], `${OPERATION} area`));
+  const area = omitUndefinedOptions(normalizeAppearance(args.area, [
+    "fill", "opacity", "stroke", "strokeWidth", "curve",
+    ...STROKE_STYLE_PROPERTIES
+  ], `${OPERATION} area`));
   const color = args.color === undefined ? undefined : normalizeCategoricalColor(args.color, `${OPERATION} color`);
   if (color !== undefined && area.fill !== undefined) throw new Error("createAreaPlot area.fill cannot be combined with color.");
   const guides = normalizeCategoricalGuides(args.guides, OPERATION, color);

package/src/actions/charts/bar.js

@@ -1,5 +1,6 @@
 import { action } from "../../core/action.js";
 import { isBarCategoryEncoding } from "../../grammar/bars/policy.js";
+import { RECT_STYLE_PROPERTIES } from "../../grammar/roundedRect.js";
 import {
   applyFacadeGuides,
   inferFacadeFieldType,
@@ -19,7 +20,7 @@ const OPTIONS = Object.freeze([
   "id", "data", "coordinate", "x", "y", "color", "width", "bar", "guides"
 ]);
 const BAR_OPTIONS = Object.freeze([
-  "fill", "opacity", "stroke", "strokeWidth"
+  "fill", "opacity", "stroke", "strokeWidth", ...RECT_STYLE_PROPERTIES
 ]);
 
 export const createBarPlot = action(

package/src/actions/charts/density.js

@@ -1,4 +1,5 @@
 import { action } from "../../core/action.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import { validateNonEmptyString, validateOptionObject } from "../../core/validation.js";
 import {
   applyFacadeGuides, normalizeAppearance, normalizeCategoricalColor, normalizeCategoricalGuides,
@@ -7,8 +8,11 @@ import {
 
 const OPERATION = "createDensityPlot";
 const OPTIONS = ["id", "data", "coordinate", "field", "groupBy", "bandwidth", "extent", "steps",
-  "kernel", "normalization", "as", "densityChannel", "valueScale", "densityScale", "color", "area", "guides"];
-const AREA_OPTIONS = ["fill", "opacity", "stroke", "strokeWidth", "curve"];
+  "kernel", "normalization", "weight", "as", "densityChannel", "valueScale", "densityScale", "color", "area", "guides"];
+const AREA_OPTIONS = [
+  "fill", "opacity", "stroke", "strokeWidth", "curve",
+  ...STROKE_STYLE_PROPERTIES
+];
 
 export const createDensityPlot = action({
   op: OPERATION, description: "Create a baseline kernel-density area plot with optional explicit groups."

package/src/actions/charts/ecdf.js

@@ -2,6 +2,7 @@ import { action } from "../../core/action.js";
 import { validateUserId } from "../../core/identifiers.js";
 import { validateNonEmptyString, validateOptionObject } from "../../core/validation.js";
 import { normalizeGroupFields } from "../../grammar/pathSeries.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import {
   applyFacadeGuides,
   normalizeAppearance,
@@ -20,7 +21,9 @@ const OPTIONS = Object.freeze([
 const EDIT_OPTIONS = Object.freeze([
   "target", "data", "coordinate", "field", "groupBy", "weight", "missing", "as", "color"
 ]);
-const LINE_OPTIONS = Object.freeze(["strokeWidth", "stroke", "opacity"]);
+const LINE_OPTIONS = Object.freeze([
+  "strokeWidth", "stroke", "opacity", ...STROKE_STYLE_PROPERTIES
+]);
 const LABEL_OPTIONS = Object.freeze([
   "field", "value", "content", "normalizeBy", "format", "layout", "fill",
   "opacity", "fontSize", "fontFamily", "fontWeight", "align", "baseline",

package/src/actions/charts/endpoints.js

@@ -1,4 +1,5 @@
 import { action } from "../../core/action.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import { isPlainObject } from "../../core/immutable.js";
 import { validateUserId } from "../../core/identifiers.js";
 import { isNominalValue } from "../../grammar/scales/fields.js";
@@ -31,9 +32,12 @@ const DUMBBELL_OPTIONS = Object.freeze([
 const CATEGORY_OPTIONS = Object.freeze(["field", "fieldType", "scale"]);
 const VALUE_OPTIONS = Object.freeze(["field", "fieldType", "scale"]);
 const POINT_OPTIONS = Object.freeze([
-  "shape", "fill", "opacity", "stroke", "strokeWidth", "radius"
+  "shape", "fill", "opacity", "stroke", "strokeWidth", "radius",
+  ...STROKE_STYLE_PROPERTIES
+]);
+const RULE_OPTIONS = Object.freeze([
+  "stroke", "strokeWidth", "strokeDash", "opacity", ...STROKE_STYLE_PROPERTIES
 ]);
-const RULE_OPTIONS = Object.freeze(["stroke", "strokeWidth", "strokeDash", "opacity"]);
 const LABEL_OPTIONS = Object.freeze([
   "endpoint", "field", "value", "content", "normalizeBy", "format", "layout",
   "fill", "opacity", "fontSize", "fontFamily", "fontWeight", "align", "baseline",
@@ -210,6 +214,24 @@ function normalizeLabels(value, operation, allowEndpoint) {
   return { ...value };
 }
 
+function normalizeDumbbellGuides(value, orientation, operation) {
+  const guides = normalizeGuides(value, operation);
+  if (guides === false || guides.axes === false) return guides;
+  const channel = orientation === "horizontal" ? "x" : "y";
+  const axes = guides.axes ?? {};
+  const axis = axes[channel];
+  if (axis === false || isPlainObject(axis) && Object.hasOwn(axis, "title")) {
+    return guides;
+  }
+  return {
+    ...guides,
+    axes: {
+      ...axes,
+      [channel]: { ...(axis ?? {}), title: false }
+    }
+  };
+}
+
 function labelOptions(labels, defaultField) {
   const { endpoint: _endpoint, ...options } = labels;
   const hasContent = ["field", "value", "content"].some(key => Object.hasOwn(options, key));
@@ -325,7 +347,7 @@ export const createDumbbellPlot = action(
     const startPoint = normalizePoint(args.startPoint, operation, "startPoint");
     const endPoint = normalizePoint(args.endPoint, operation, "endPoint");
     const connector = normalizeRule(args.connector, operation, "connector");
-    const guides = normalizeGuides(args.guides, operation);
+    const guides = normalizeDumbbellGuides(args.guides, orientation, operation);
     const labels = normalizeLabels(args.labels, operation, true);
     const sharedScale = start.scale ?? end.scale;
     const prepared = prepareData(this, {

package/src/actions/charts/heatmap.js

@@ -5,6 +5,7 @@ import {
   validateOptionObject
 } from "../../core/validation.js";
 import { requireDataset } from "../../selectors/datasets.js";
+import { RECT_STYLE_PROPERTIES } from "../../grammar/roundedRect.js";
 import {
   applyFacadeGuides,
   normalizeAppearance,
@@ -22,7 +23,7 @@ const OPTIONS = [
   "id", "data", "coordinate", "x", "y", "bin", "color", "rect", "guides"
 ];
 const RECT_OPTIONS = [
-  "opacity", "stroke", "strokeWidth"
+  "opacity", "stroke", "strokeWidth", ...RECT_STYLE_PROPERTIES
 ];
 const BIN_OPTIONS = [
   "bins", "extent", "includeEmpty"

package/src/actions/charts/histogram.js

@@ -1,5 +1,6 @@
 import { action } from "../../core/action.js";
 import { validateNonEmptyString } from "../../core/validation.js";
+import { RECT_STYLE_PROPERTIES } from "../../grammar/roundedRect.js";
 import {
   applyFacadeGuides,
   normalizeAppearance,
@@ -13,13 +14,13 @@ import {
 
 const OPTIONS = Object.freeze([
   "id", "data", "coordinate", "field", "maxBins", "binStep",
-  "binBoundaries", "stack", "xScale", "yScale", "color", "bar", "guides"
+  "binBoundaries", "stack", "xScale", "yScale", "weight", "color", "bar", "guides"
 ]);
 const BAR_OPTIONS = Object.freeze([
-  "fill", "opacity", "stroke", "strokeWidth"
+  "fill", "opacity", "stroke", "strokeWidth", ...RECT_STYLE_PROPERTIES
 ]);
 const HISTOGRAM_OPTIONS = Object.freeze([
-  "maxBins", "binStep", "binBoundaries", "stack", "xScale", "yScale"
+  "maxBins", "binStep", "binBoundaries", "stack", "xScale", "yScale", "weight"
 ]);
 
 export const createHistogram = action(

package/src/actions/charts/horizon.js

@@ -1,4 +1,5 @@
 import { action } from "../../core/action.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import { validateNonEmptyString, validateOptionObject, validateUnitInterval } from "../../core/validation.js";
 import {
   applyFacadeGuides, normalizeAppearance, normalizeFieldEncoding, normalizeGuides,
@@ -51,7 +52,8 @@ export const createHorizonPlot = action({
   const { id: requestedId, data: requestedData, coordinate, x: requestedX, y: requestedY,
     area: requestedArea, guides: requestedGuides, ...horizon } = omitUndefinedOptions(args);
   const { opacity, ...area } = omitUndefinedOptions(normalizeAppearance(requestedArea,
-    ["opacity", "stroke", "strokeWidth", "curve"], `${OPERATION} area`));
+    ["opacity", "stroke", "strokeWidth", "curve", ...STROKE_STYLE_PROPERTIES],
+    `${OPERATION} area`));
   for (const [key, value] of Object.entries({ ...horizon, ...area })) {
     if (value === null) throw new TypeError(`${OPERATION} ${key} cannot be null.`);
   }

package/src/actions/charts/interval-regression.js

@@ -1,6 +1,7 @@
 import { action } from "../../core/action.js";
 import { validateNonNegativeFinite } from "../../core/validation.js";
 import { findDataset } from "../../selectors/datasets.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import {
   applyFacadeGuides,
   normalizeAppearance,
@@ -18,10 +19,12 @@ const INTERVAL_OPTIONS = Object.freeze([
   "color", "point", "errorBar", "guides"
 ]);
 const POINT_OPTIONS = Object.freeze([
-  "shape", "fill", "opacity", "stroke", "strokeWidth", "radius"
+  "shape", "fill", "opacity", "stroke", "strokeWidth", "radius",
+  ...STROKE_STYLE_PROPERTIES
 ]);
 const ERROR_BAR_OPTIONS = Object.freeze([
-  "caps", "capSize", "stroke", "strokeWidth", "strokeDash", "opacity"
+  "caps", "capSize", "stroke", "strokeWidth", "strokeDash", "opacity",
+  ...STROKE_STYLE_PROPERTIES
 ]);
 
 function intervalChannel(value, operation, channel, id) {

package/src/actions/charts/line.js

@@ -1,5 +1,6 @@
 import { action } from "../../core/action.js";
 import { normalizeGroupFields } from "../../grammar/pathSeries.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import {
   applyFacadeGuides,
   normalizeAppearance,
@@ -19,7 +20,8 @@ const OPTIONS = Object.freeze([
   "strokeDash", "line", "guides"
 ]);
 const LINE_OPTIONS = Object.freeze([
-  "strokeWidth", "curve", "stroke", "opacity", "closed"
+  "strokeWidth", "curve", "stroke", "opacity", "closed",
+  ...STROKE_STYLE_PROPERTIES
 ]);
 
 export const createLinePlot = action(

package/src/actions/charts/parallel.js

@@ -1,5 +1,6 @@
 import { action } from "../../core/action.js";
 import { resolveParallelCoordinate } from "../coordinates/parallel.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import {
   applyFacadeGuides,
   normalizeAppearance,
@@ -17,7 +18,8 @@ const OPTIONS = Object.freeze([
   "color", "strokeDash", "line", "guides"
 ]);
 const LINE_OPTIONS = Object.freeze([
-  "strokeWidth", "stroke", "opacity", "curve", "closed"
+  "strokeWidth", "stroke", "opacity", "curve", "closed",
+  ...STROKE_STYLE_PROPERTIES
 ]);
 
 function scopeParallelGuides(guides, coordinate) {
@@ -105,6 +107,10 @@ export const createParallelCoordinates = action(
     if (strokeDash !== undefined) {
       next = next.encodeStrokeDash(targetArgs(strokeDash, id));
     }
-    return applyFacadeGuides(next, guides, id);
+    next = applyFacadeGuides(next, guides, id);
+    return next._withMarkConfig(id, {
+      ...next.markConfigs[id],
+      compositionRole: "parallel"
+    });
   }
 );

package/src/actions/charts/pie.js

@@ -1,4 +1,5 @@
 import { action } from "../../core/action.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import {
   applyFacadeGuides, normalizeAppearance, normalizeCategoricalColor, normalizeCategoricalGuides,
   normalizeArcCategory, normalizeCategoryAggregate, omitUndefinedOptions,
@@ -7,7 +8,10 @@ import {
 
 const OPERATION = "createPiePlot";
 const OPTIONS = ["id", "data", "coordinate", "category", "value", "aggregate", "color", "arc", "guides"];
-const ARC_OPTIONS = ["innerRadius", "padAngle", "fill", "opacity", "stroke", "strokeWidth"];
+const ARC_OPTIONS = [
+  "innerRadius", "padAngle", "fill", "opacity", "stroke", "strokeWidth",
+  ...STROKE_STYLE_PROPERTIES
+];
 function guideOptions(value, color) {
   const guides = normalizeCategoricalGuides(value, OPERATION, color);
   if (guides === false) return false;
@@ -40,5 +44,9 @@ export const createPiePlot = action({
     ...(aggregate === "sum" ? { weight: args.value } : {})
   });
   if (color !== undefined) next = next.encodeColor({ ...color, target: id });
-  return applyFacadeGuides(next, guides, id, args.guides ?? {});
+  next = applyFacadeGuides(next, guides, id, args.guides ?? {});
+  return next._withMarkConfig(id, {
+    ...next.markConfigs[id],
+    compositionRole: "pie"
+  });
 });

package/src/actions/charts/polar.js

@@ -2,6 +2,7 @@ import { action } from "../../core/action.js";
 import { validateNonNegativeFinite, validateOptionObject } from
   "../../core/validation.js";
 import { normalizeGroupFields } from "../../grammar/pathSeries.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import {
   applyFacadeGuides,
   normalizeAppearance,
@@ -20,10 +21,12 @@ const POSITION_OPTIONS = Object.freeze([
   "field", "fieldType", "temporalUnit", "scale"
 ]);
 const POINT_OPTIONS = Object.freeze([
-  "shape", "fill", "opacity", "stroke", "strokeWidth", "radius"
+  "shape", "fill", "opacity", "stroke", "strokeWidth", "radius",
+  ...STROKE_STYLE_PROPERTIES
 ]);
 const LINE_OPTIONS = Object.freeze([
-  "strokeWidth", "curve", "stroke", "opacity", "closed"
+  "strokeWidth", "curve", "stroke", "opacity", "closed",
+  ...STROKE_STYLE_PROPERTIES
 ]);
 
 function position(value, operation, channel) {
@@ -78,7 +81,11 @@ export const createPolarScatterPlot = action(
     if (color !== undefined) next = next.encodeColor(targetArgs(color, id));
     if (size !== undefined) next = next.encodeSize(targetArgs(size, id));
     if (shape !== undefined) next = next.encodeShape(targetArgs(shape, id));
-    return applyFacadeGuides(next, guides, id);
+    next = applyFacadeGuides(next, guides, id);
+    return next._withMarkConfig(id, {
+      ...next.markConfigs[id],
+      compositionRole: "polar-point"
+    });
   }
 );
 
@@ -118,6 +125,10 @@ export const createPolarLinePlot = action(
     if (groupBy !== undefined) next = next.encodeGroup({ target: id, fields: groupBy });
     if (color !== undefined) next = next.encodeColor(targetArgs(color, id));
     if (strokeDash !== undefined) next = next.encodeStrokeDash(targetArgs(strokeDash, id));
-    return applyFacadeGuides(next, guides, id);
+    next = applyFacadeGuides(next, guides, id);
+    return next._withMarkConfig(id, {
+      ...next.markConfigs[id],
+      compositionRole: "polar-line"
+    });
   }
 );

package/src/actions/charts/radar.js

@@ -1,4 +1,5 @@
 import { action } from "../../core/action.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import { isPlainObject } from "../../core/immutable.js";
 import { validateNonEmptyString, validateOptionObject } from
   "../../core/validation.js";
@@ -31,7 +32,8 @@ const CATEGORY_SCALE_OPTIONS = Object.freeze([
 const WIDE_OPTIONS = Object.freeze(["fields", "as"]);
 const WIDE_AS_OPTIONS = Object.freeze(["key", "value"]);
 const LINE_OPTIONS = Object.freeze([
-  "strokeWidth", "curve", "stroke", "opacity", "closed"
+  "strokeWidth", "curve", "stroke", "opacity", "closed",
+  ...STROKE_STYLE_PROPERTIES
 ]);
 
 function normalizeCategory(value, operation) {
@@ -283,7 +285,7 @@ export const createRadarPlot = action(
     }
 
     category = scaleWithOrder(category, order, operation);
-    return next.createPolarLinePlot({
+    next = next.createPolarLinePlot({
       id,
       data,
       ...(args.coordinate === undefined ? {} : { coordinate: args.coordinate }),
@@ -295,5 +297,9 @@ export const createRadarPlot = action(
       line: { ...line, closed: true },
       guides
     });
+    return next._withMarkConfig(id, {
+      ...next.markConfigs[id],
+      compositionRole: "radar"
+    });
   }
 );

package/src/actions/charts/radial.js

@@ -1,4 +1,5 @@
 import { action } from "../../core/action.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import {
   applyFacadeGuides, normalizeAppearance, normalizeArcCategory, normalizeCategoryAggregate,
   normalizeCategoricalColor, normalizeCategoricalGuides, omitUndefinedOptions,
@@ -6,7 +7,10 @@ import {
 } from "./shared.js";
 
 const OPTIONS = ["id", "data", "coordinate", "category", "value", "aggregate", "radiusScale", "color", "arc", "guides"];
-const ARC_OPTIONS = ["innerRadius", "padAngle", "fill", "opacity", "stroke", "strokeWidth"];
+const ARC_OPTIONS = [
+  "innerRadius", "padAngle", "fill", "opacity", "stroke", "strokeWidth",
+  ...STROKE_STYLE_PROPERTIES
+];
 const RADIUS_OPTIONS = ["id", "type", "domain", "range", "zero", "nice", "reverse", "clamp"];
 
 function createMeasuredPlot(program, args, { operation, defaultId, mapping }) {
@@ -31,7 +35,11 @@ function createMeasuredPlot(program, args, { operation, defaultId, mapping }) {
     ...(aggregate === "sum" ? { field: args.value } : {}),
     ...(radiusScale === undefined ? {} : { scale: radiusScale }) });
   if (color !== undefined) next = next.encodeColor({ ...color, target: id });
-  return applyFacadeGuides(next, guides, id, args.guides ?? {});
+  next = applyFacadeGuides(next, guides, id, args.guides ?? {});
+  return next._withMarkConfig(id, {
+    ...next.markConfigs[id],
+    compositionRole: "rose"
+  });
 }
 
 export const createRosePlot = action({ op: "createRosePlot", description: "Create equal-angle sectors with area proportional to category count or sum." }, function (args = {}) {

package/src/actions/charts/rug-strip.js

@@ -1,4 +1,5 @@
 import { action } from "../../core/action.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import { isPlainObject } from "../../core/immutable.js";
 import { validateNonEmptyString, validateNonNegativeFinite, validateOptionObject } from
   "../../core/validation.js";
@@ -19,12 +20,15 @@ import {
 
 const RUG_OPTIONS = Object.freeze(["id", "data", "coordinate", "x", "y", "edge", "tick", "guides"]);
 const MEASURE_OPTIONS = Object.freeze(["field", "fieldType", "temporalUnit", "scale"]);
-const TICK_OPTIONS = Object.freeze(["length", "stroke", "strokeWidth", "opacity"]);
+const TICK_OPTIONS = Object.freeze([
+  "length", "stroke", "strokeWidth", "opacity", ...STROKE_STYLE_PROPERTIES
+]);
 const STRIP_OPTIONS = Object.freeze([
   "id", "data", "coordinate", "x", "y", "color", "size", "shape", "point", "jitter", "guides"
 ]);
 const POINT_OPTIONS = Object.freeze([
-  "radius", "shape", "fill", "opacity", "stroke", "strokeWidth"
+  "radius", "shape", "fill", "opacity", "stroke", "strokeWidth",
+  ...STROKE_STYLE_PROPERTIES
 ]);
 const JITTER_OPTIONS = Object.freeze(["maxOffset", "seed", "key"]);
 

package/src/actions/charts/scatter.js

@@ -1,5 +1,6 @@
 import { action } from "../../core/action.js";
 import { validateNonNegativeFinite } from "../../core/validation.js";
+import { STROKE_STYLE_PROPERTIES } from "../../grammar/strokeStyle.js";
 import {
   applyFacadeGuides,
   normalizeAppearance,
@@ -18,7 +19,8 @@ const OPTIONS = Object.freeze([
   "point", "guides"
 ]);
 const POINT_OPTIONS = Object.freeze([
-  "shape", "fill", "opacity", "stroke", "strokeWidth", "radius"
+  "shape", "fill", "opacity", "stroke", "strokeWidth", "radius",
+  ...STROKE_STYLE_PROPERTIES
 ]);
 
 export const createScatterPlot = action(

package/src/actions/composition/actions.js

@@ -12,6 +12,7 @@ import { namespaceGraphicSnapshot } from "../../materialization/compositionSnaps
 import { materializeCompositionGraphics } from
   "../../materialization/composition.js";
 import { materializeFacetGraphics } from "../../materialization/facets.js";
+import { replayInheritedThemeFrames } from "../theme/composition.js";
 
 const CONCAT_OPTIONS = Object.freeze([
   "id", "programs", "gap", "align", "padding"
@@ -245,10 +246,14 @@ const replaceCompositionChild = action(
     if (!(args.program instanceof CoreChartProgram)) {
       throw new TypeError("replaceCompositionChild program must be a ChartProgram.");
     }
-    childDescriptor({ id: target, program: args.program });
+    const replacement = replayInheritedThemeFrames(
+      args.program,
+      this.materializationConfigs.theme
+    );
+    childDescriptor({ id: target, program: replacement });
     const children = freezeOwned({
       ...this.children,
-      [target]: args.program
+      [target]: replacement
     });
     return applyCompositionState(this, {
       children,
@@ -283,7 +288,11 @@ const insertCompositionChild = action(
     if (args.before !== undefined && args.after !== undefined) {
       throw new Error("insertCompositionChild before and after are mutually exclusive.");
     }
-    childDescriptor({ id, program: args.program });
+    const inserted = replayInheritedThemeFrames(
+      args.program,
+      this.materializationConfigs.theme
+    );
+    childDescriptor({ id, program: inserted });
     const order = [...this.compositionSpec.children];
     if (args.before !== undefined || args.after !== undefined) {
       const property = args.before !== undefined ? "before" : "after";
@@ -295,7 +304,7 @@ const insertCompositionChild = action(
       order.push(id);
     }
     return applyCompositionState(this, {
-      children: freezeOwned({ ...this.children, [id]: args.program }),
+      children: freezeOwned({ ...this.children, [id]: inserted }),
       compositionSpec: { ...this.compositionSpec, children: order }
     }, [id]);
   }

package/src/actions/coordinates/actions.js

@@ -81,6 +81,6 @@ export const createCoordinate = action(
   }
 );
 
-export function registerCoordinateActions(ProgramClass) {
+export function registerBasicCoordinateActions(ProgramClass) {
   ProgramClass.prototype.createCoordinate = createCoordinate;
 }