ggaction 0.0.3 → 0.0.4

package/CHANGELOG.md

@@ -4,6 +4,30 @@ All notable changes to `ggaction` are recorded in this file.
 
 ## Unreleased
 
+## [0.0.4] - 2026-07-19
+
+### Changed
+
+- Transferred the canonical repository to the `ggaction` organization and moved public documentation to
+  `https://ggaction.github.io/ggaction/`.
+- Made public documentation deployment release-scoped so ordinary `main` pushes continue to verify docs without
+  changing the published site.
+- Refactored source ownership and materialization boundaries while preserving the public API, stored specifications,
+  trace hierarchy, and rendered output.
+
+### Fixed
+
+- Normalized numeric Canvas font weights before rendering so valid intermediate values such as `650` retain normal
+  text geometry in both Browser Canvas and Node PNG output.
+- Applied right categorical legend offsets from the plot boundary consistently during creation and focused layout
+  edits, including labels, titles, and optional backgrounds.
+- Accepted `count` on sequential palette descriptors as a concrete gradient-stop count, consistently across
+  top-level palette shorthands, nested ranges, encodings, direct scales, and scale edits.
+- Preserved concrete `ChartProgram` subclasses in the TypeScript signature of wrapped extension actions and added
+  a strict NodeNext declaration-merging authoring pattern.
+- Routed every selective `llms.txt` target to a deployed HTML page, stabilized action fragments, and made built-site
+  checks validate both HTTP targets and DOM IDs.
+
 ## [0.0.3] - 2026-07-19
 
 ### Added
@@ -58,6 +82,7 @@ All notable changes to `ggaction` are recorded in this file.
 - Cartesian charts are the complete current path. Polar semantic tokens exist only where explicitly documented and do
   not imply complete polar rendering.
 
-[0.0.3]: https://github.com/hj-n/ggaction/releases/tag/v0.0.3
-[0.0.2]: https://github.com/hj-n/ggaction/releases/tag/v0.0.2
-[0.0.1]: https://github.com/hj-n/ggaction/releases/tag/v0.0.1
+[0.0.4]: https://github.com/ggaction/ggaction/releases/tag/v0.0.4
+[0.0.3]: https://github.com/ggaction/ggaction/releases/tag/v0.0.3
+[0.0.2]: https://github.com/ggaction/ggaction/releases/tag/v0.0.2
+[0.0.1]: https://github.com/ggaction/ggaction/releases/tag/v0.0.1

package/README.md

@@ -1,119 +1,131 @@
 # ggaction
 
-`ggaction` is a JavaScript library for building charts through immutable,
-traceable actions.
+[![npm version](https://img.shields.io/npm/v/ggaction.svg)](https://www.npmjs.com/package/ggaction) [![license](https://img.shields.io/npm/l/ggaction.svg)](./LICENSE) [![documentation](https://img.shields.io/badge/docs-ggaction.github.io-2563eb)](https://ggaction.github.io/ggaction/)
+
+### A grammar for how charts are made.
+
+Most visualization grammars describe a finished chart. **ggaction** represents chart authoring itself as an immutable, traceable sequence of graphical actions.
+
+Build, inspect, select, and revise charts one meaningful action at a time.
+
+<p align="left">
+  <img src="./docs/assets/images/readme-authoring-sequence.gif" width="960" height="540" loading="eager" alt="A ggaction program progressively creates a scatterplot, adds grouped regression fits and confidence bands, highlights the Japan group across chart layers, and finishes with an R-squared annotation.">
+</p>
+
+Every frame is rendered from an immutable `ChartProgram`. The final R² label is a custom traceable action composed from ggaction's public extension primitives.
+
+```bash
+npm install ggaction
+```
+
+## A grammar of graphical action
+
+Actions are verbs:
+
+`create · transform · encode · edit · select · compose`
+
+Chart resources are nouns:
+
+`data · marks · scales · coordinates · guides`
+
+A `ChartProgram` is the immutable sentence they produce.
+
+The following fragment assumes `cars` is an array of row objects:
+
+```javascript
+import { chart } from "ggaction";
+
+const program = chart()
+  .createCanvas()
+  .createData({ values: cars })
+  .createPointMark({ id: "points" })
+  .encodeX({ field: "Displacement" })
+  .encodeY({ field: "Acceleration" })
+  .encodeColor({ field: "Origin" })
+  .createRegression()
+  .createGuides();
+```
+
+## Why actions?
+
+- **Progressive** — build and revise a chart one meaningful operation at a time.
+- **Traceable** — retain high-level actions and the wrapped actions they invoke.
+- **Materialized** — actions create concrete backend-neutral graphics; rendering does not perform hidden semantic compilation.
+
+## Quick start
+
+```bash
+npm install ggaction
+```
 
 ```javascript
 import { chart, render } from "ggaction";
 
-const cars = [
-  { horsepower: 88, mpg: 27, origin: "USA" },
-  { horsepower: 70, mpg: 36, origin: "Japan" },
-  { horsepower: 110, mpg: 24, origin: "Europe" }
+const observations = [
+  { displacement: 97, acceleration: 14.5, origin: "Japan" },
+  { displacement: 140, acceleration: 15.5, origin: "USA" },
+  { displacement: 86, acceleration: 16.4, origin: "Japan" }
 ];
 
 const program = chart()
   .createCanvas({
     width: 640,
     height: 400,
-    margin: { top: 30, right: 30, bottom: 60, left: 70 }
+    margin: { top: 30, right: 130, bottom: 60, left: 70 }
   })
-  .createData({ values: cars })
+  .createData({ values: observations })
   .createPointMark()
-  .encodeX({ field: "horsepower" })
-  .encodeY({ field: "mpg" })
+  .encodeX({ field: "displacement" })
+  .encodeY({ field: "acceleration" })
   .encodeColor({ field: "origin" })
-  .encodeRadius({ value: 3 })
-  .createGuides({
-    axes: {
-      x: { title: { text: "Horsepower" } },
-      y: { title: { text: "Miles per Gallon" } }
-    }
-  });
-
-render(program, document.querySelector("#chart").getContext("2d"));
+  .encodeRadius({ value: 4 })
+  .createGuides();
+
+const context = document.querySelector("#chart").getContext("2d");
+render(program, context);
 ```
 
-The renderer reads only fully materialized, backend-neutral graphics. Semantic
-state is never automatically compiled during rendering.
+For the advanced version, follow the [regression recipe](https://ggaction.github.io/ggaction/recipes/regression-scatterplot/) or open the [runnable example](./examples/cars-regression-scatterplot/).
 
-> **Status:** `0.0.3` is the current experimental public release. APIs may change
-> before `1.0.0`; changes are recorded in the [changelog](./CHANGELOG.md).
+## What it supports
 
-## Install
+- Cartesian and polar charts
+- Statistical layers and intervals
+- Faceting and program composition
+- Mark selection and coordinated highlighting
+- Browser Canvas and Node PNG output
+- TypeScript declarations and traceable extension actions
 
-```bash
-npm install ggaction
-```
+See the current [supported features](https://ggaction.github.io/ggaction/supported-features/), [tutorials and examples](https://ggaction.github.io/ggaction/tutorials/), and [action reference](https://ggaction.github.io/ggaction/reference/actions/) for exact coverage. Runnable programs are collected in [`examples/`](./examples/README.md).
+
+## Package entries
 
-The package is ESM-only and supports Node.js 20 or later. The default `ggaction`
-entry works with modern browser build tools and Canvas. `ggaction/png` is
-Node-only and uses a native Canvas dependency.
+The package is ESM-only and requires Node.js 20 or later.
 
 | Entry | Purpose |
 | --- | --- |
 | `ggaction` | Create chart programs and render them to Browser Canvas |
-| `ggaction/extension` | Author wrapped actions and use public low-level primitives |
+| `ggaction/extension` | Author wrapped actions with public low-level primitives |
 | `ggaction/png` | Render a completed program to a PNG file in Node.js |
 
-All three entries include TypeScript declarations. See [Getting
-Started](https://hyeonword.com/ggaction/getting-started/) for a complete browser
-setup and [Rendering](https://hyeonword.com/ggaction/api/rendering/) for Node PNG
-output.
+All entries include TypeScript declarations. The default entry is browser-safe; the PNG adapter is Node-only.
 
 ## Documentation
 
-- [npm package](https://www.npmjs.com/package/ggaction)
-- [Getting started](https://hyeonword.com/ggaction/getting-started/)
-- [Cars scatterplot tutorial](https://hyeonword.com/ggaction/tutorials/scatterplot/)
-- [Cars line chart tutorial](https://hyeonword.com/ggaction/tutorials/line-chart/)
-- [Cars histogram tutorial](https://hyeonword.com/ggaction/tutorials/histogram/)
-- [Bar chart tutorial](https://hyeonword.com/ggaction/tutorials/grouped-bar/)
-- [Regression scatterplot tutorial](https://hyeonword.com/ggaction/tutorials/regression-scatterplot/)
-- [Density area chart tutorial](https://hyeonword.com/ggaction/tutorials/density-area/)
-- [Error-bar chart tutorial](https://hyeonword.com/ggaction/tutorials/error-bar/)
-- [Error-band chart tutorial](https://hyeonword.com/ggaction/tutorials/error-band/)
-- [Mark selection and highlighting tutorial](https://hyeonword.com/ggaction/tutorials/mark-selection/)
-- [Box-plot API](https://hyeonword.com/ggaction/api/box-plots/)
-- [Chart concepts](https://hyeonword.com/ggaction/concepts/chart-program/)
-- [Complete action reference](https://hyeonword.com/ggaction/reference/actions/)
-- [Supported features](https://hyeonword.com/ggaction/supported-features/)
-- [Documentation index](https://hyeonword.com/ggaction/)
-
-The runnable [cars scatterplot](https://github.com/hj-n/ggaction/tree/main/examples/cars-scatterplot/),
-[aggregate line chart](https://github.com/hj-n/ggaction/tree/main/examples/cars-line-chart/), and
-[stacked histogram](https://github.com/hj-n/ggaction/tree/main/examples/cars-histogram/) use `data/cars.json`. The
-[regression scatterplot](https://github.com/hj-n/ggaction/tree/main/examples/cars-regression-scatterplot/) also uses the
-cars data and layers grouped fits with confidence bands. The [grouped bar
-chart](https://github.com/hj-n/ggaction/tree/main/examples/jobs-grouped-bar/) uses `data/jobs.json`. The [density area
-chart](https://github.com/hj-n/ggaction/tree/main/examples/cars-density-area/) derives grouped Acceleration
-distributions from the cars data. The [error-bar chart](https://github.com/hj-n/ggaction/tree/main/examples/cars-error-bar/)
-summarizes mean Acceleration with 95% confidence intervals. The
-[error-band chart](https://github.com/hj-n/ggaction/tree/main/examples/gapminder-error-band/) summarizes grouped
-confidence intervals as closed area paths over time.
-The [box plot](https://github.com/hj-n/ggaction/tree/main/examples/cars-box-plot/) supports vertical or horizontal
-Tukey/min–max ranges, configurable factor and component appearance, and
-optional outlier rendering from categorical and quantitative field pairs.
-The [mark-selection example](https://github.com/hj-n/ggaction/tree/main/examples/mark-selection/) compares grouped point,
-complete stacked-bar, and line-series highlighting through one selector grammar.
-The [program-composition example](https://github.com/hj-n/ggaction/tree/main/examples/program-composition/) combines
-complete child programs, edits their inferred layout, and replaces one stable slot.
-The [facet example](https://github.com/hj-n/ggaction/tree/main/examples/cars-origin-scatterplot-facet/)
-repeats one chart with `.facet({ field: "Origin" })`, channel-level shared or
-independent scales, per-cell or occupied-outer axes, and an optional compatible
-parent-owned legend. Regression, density, interval, and box-derived data are
-recomputed independently inside each cell.
-Complete Cartesian and Polar programs can be nested with `hconcat` and
-`vconcat`; the [cross-feature dashboard](https://github.com/hj-n/ggaction/tree/main/examples/cross-feature-dashboard/)
-shows a Polar child replacement beside a Cartesian facet. Polar sources cannot
-currently be faceted and fail before partial child state is created.
-Completed programs can also be exported through
-[`ggaction/png`](https://hyeonword.com/ggaction/api/rendering/#png-output).
-
-## Development
+- [Getting Started](https://ggaction.github.io/ggaction/getting-started/)
+- [Tutorials and Examples](https://ggaction.github.io/ggaction/tutorials/)
+- [Action Reference](https://ggaction.github.io/ggaction/reference/actions/)
+- [Concepts](https://ggaction.github.io/ggaction/concepts/chart-program/)
+- [Supported Features](https://ggaction.github.io/ggaction/supported-features/)
+
+## Status and development
+
+> **Status:** `0.0.4` is the current experimental public release. APIs may change before `1.0.0`; changes are recorded in the [changelog](./CHANGELOG.md).
 
 ```bash
 npm install
+npm run assets:readme
 npm test
 npm run test:render
+npm run test:docs
 ```

package/package.json

@@ -1,16 +1,16 @@
 {
   "name": "ggaction",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "Build charts through immutable, traceable graphical actions.",
   "license": "MIT",
   "author": "Hyeon Jeon",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/hj-n/ggaction.git"
+    "url": "git+https://github.com/ggaction/ggaction.git"
   },
-  "homepage": "https://hyeonword.com/ggaction/",
+  "homepage": "https://ggaction.github.io/ggaction/",
   "bugs": {
-    "url": "https://github.com/hj-n/ggaction/issues"
+    "url": "https://github.com/ggaction/ggaction/issues"
   },
   "keywords": [
     "visualization",
@@ -55,13 +55,16 @@
     "test:docs:browser": "node scripts/test-built-docs.js _site",
     "test:coverage": "node scripts/run-tests.js coverage",
     "test:render": "node test/support/artifacts.js && node scripts/run-tests.js render && node scripts/generate-roadmap-gallery.js && node scripts/test-roadmap-gallery.js",
+    "assets:readme": "node scripts/generate-readme-demo.js",
     "artifacts:gallery": "node scripts/generate-roadmap-gallery.js",
     "artifacts:gallery:test": "node scripts/test-roadmap-gallery.js",
     "docs:images": "node scripts/generate-doc-images.js",
     "docs:llms": "node scripts/generate-llm-docs.js",
+    "docs:capabilities": "node scripts/generate-doc-capabilities.js",
+    "docs:capabilities:check": "node scripts/generate-doc-capabilities.js --check",
     "docs:signatures": "node scripts/generate-doc-signatures.js",
     "docs:signatures:check": "node scripts/generate-doc-signatures.js --check",
-    "docs:generate": "npm run docs:signatures && npm run docs:images && npm run docs:llms",
+    "docs:generate": "npm run docs:signatures && npm run docs:capabilities && npm run docs:images && npm run docs:llms",
     "docs:build": "bundle exec jekyll build --source docs --destination _site --baseurl /ggaction",
     "docs:verify": "npm run docs:generate && npm run test:docs && npm run docs:build && npm run test:docs:built && npm run test:docs:browser",
     "contracts:catalog": "node scripts/generate-action-catalog.js",
@@ -84,7 +87,9 @@
   },
   "devDependencies": {
     "es-module-lexer": "^1.7.0",
+    "gifenc": "^1.0.3",
     "playwright": "^1.61.1",
-    "typescript": "^7.0.2"
+    "typescript": "^7.0.2",
+    "vite": "^6.4.3"
   }
 }

package/src/actions/data/regression.js

@@ -4,7 +4,7 @@ import { validateKeys } from "../../core/validation.js";
 import {
   deriveRegression,
   normalizeRegressionParameters
-} from "../../grammar/regression.js";
+} from "../../grammar/regression/index.js";
 import { MATERIALIZE_OPTIONS, requireDerivedDataset } from "./shared.js";
 
 const OPTIONS = Object.freeze([

package/src/actions/encodings/appearance.js

@@ -4,7 +4,7 @@ import {
   readQuantitativeField,
   readScaleField,
   validateOpacityValue
-} from "../../grammar/scales.js";
+} from "../../grammar/scales/index.js";
 import {
   resolveAppearanceScaleDefinition,
   resolveOpacityScaleDefinition

package/src/actions/encodings/color/continuous.js

@@ -0,0 +1,137 @@
+import {
+  readQuantitativeField,
+  readScaleField,
+  readTemporalField
+} from "../../../grammar/scales/index.js";
+import {
+  BAR_GRAINS,
+  resolveBarChannels,
+  resolveBarGrain
+} from "../../../grammar/bars/policy.js";
+import {
+  validateAggregate,
+  validateAggregateFieldType,
+  validateAggregateFieldValues
+} from "../../../grammar/aggregate.js";
+import {
+  resolveQuantitativeColorScaleDefinition
+} from "../../scales/definitions.js";
+import {
+  resolveReassignmentScaleOptions,
+  resolveTarget
+} from "../shared.js";
+import { applyMaterializationPlan } from "../../../materialization/dependencies.js";
+import {
+  planEncodingRematerialization
+} from "../../../materialization/encodings.js";
+import {
+  assertNoConstantColor,
+  resolveColorScaleOptions
+} from "./policy.js";
+
+export function encodeContinuousColor(program, args) {
+  if (!["quantitative", "temporal"].includes(args.fieldType)) {
+    throw new Error(`Unsupported color field type "${args.fieldType}".`);
+  }
+  if (args.layout !== undefined) {
+    throw new Error("Continuous color does not support layout.");
+  }
+  const { id: target, dataset, layer } = resolveTarget(
+    program,
+    args.target,
+    ["point", "bar", "rect"],
+    "continuous color mark"
+  );
+  assertNoConstantColor(program, layer);
+  const requestedScale = resolveReassignmentScaleOptions(
+    layer.encoding?.color,
+    resolveColorScaleOptions(args)
+  );
+  const scale = resolveQuantitativeColorScaleDefinition(
+    program,
+    args.fieldType,
+    requestedScale
+  );
+  if (Object.hasOwn(scale, "unknown") && layer.mark.type !== "point") {
+    throw new Error(
+      "Continuous color scale unknown currently requires a row-owned point mark."
+    );
+  }
+  if (
+    layer.mark.type === "bar" &&
+    ["nominal", "ordinal"].includes(layer.encoding?.color?.fieldType)
+  ) {
+    throw new Error(
+      "Continuous bar color cannot replace an existing nominal color layout."
+    );
+  }
+  let aggregate;
+  if (["point", "rect"].includes(layer.mark.type)) {
+    if (args.aggregate !== undefined) {
+      throw new Error(`${layer.mark.type} continuous color does not support aggregate.`);
+    }
+  } else {
+    if (args.fieldType !== "quantitative") {
+      throw new Error("Aggregate bar color currently requires a quantitative field.");
+    }
+    if (resolveBarGrain(layer) !== BAR_GRAINS.aggregate) {
+      throw new Error(
+        "Continuous bar color requires a complete categorical aggregate bar."
+      );
+    }
+    const channels = resolveBarChannels(layer);
+    const measure = layer.encoding?.[channels.measure];
+    aggregate = args.aggregate ?? (
+      measure?.field === args.field ? measure.aggregate : undefined
+    );
+    if (aggregate === undefined) {
+      throw new Error(
+        "Continuous bar color requires aggregate when its field differs from the measure field."
+      );
+    }
+    aggregate = validateAggregate(aggregate);
+    validateAggregateFieldType(aggregate, args.fieldType);
+    validateAggregateFieldValues(dataset.values, args.field, args.fieldType);
+  }
+  if (layer.mark.type === "rect") {
+    readScaleField(dataset.values, args.field, args.fieldType, {
+      allowUnknown: true
+    });
+  } else if (Object.hasOwn(scale, "unknown")) {
+    readScaleField(dataset.values, args.field, args.fieldType, {
+      allowUnknown: true
+    });
+  } else if (args.fieldType === "temporal") {
+    readTemporalField(dataset.values, args.field);
+  } else {
+    readQuantitativeField(dataset.values, args.field);
+  }
+  const next = program
+    .editSemantic({
+      property: `layer[${target}].encoding.color.field`,
+      value: args.field
+    })
+    .editSemantic({
+      property: `layer[${target}].encoding.color.fieldType`,
+      value: args.fieldType
+    })
+    .editSemantic({
+      property: `layer[${target}].encoding.color.scale`,
+      value: scale.id
+    });
+  const encoded = aggregate === undefined
+    ? next
+    : next.editSemantic({
+        property: `layer[${target}].encoding.color.aggregate`,
+        value: aggregate
+      });
+  const scaled = encoded.setQuantitativeColorScale(scale);
+  return applyMaterializationPlan(
+    scaled,
+    planEncodingRematerialization(scaled, {
+      target,
+      channel: "color",
+      scale: scale.id
+    })
+  );
+}

package/src/actions/encodings/color/index.js

@@ -0,0 +1,151 @@
+import { action } from "../../../core/action.js";
+import {
+  readNominalField,
+  readScaleField,
+  validateCategoricalFieldType
+} from "../../../grammar/scales/index.js";
+import {
+  resolveBarGrain
+} from "../../../grammar/bars/policy.js";
+import { resolveColorScaleDefinition } from "../../scales/definitions.js";
+import {
+  applyEncodingScale,
+  resolveReassignmentScaleOptions,
+  resolveTarget,
+  validateLineSeriesCompatibility,
+  validateOptions
+} from "../shared.js";
+import { applyMaterializationPlan } from "../../../materialization/dependencies.js";
+import {
+  planEncodingRematerialization
+} from "../../../materialization/encodings.js";
+import { encodeContinuousColor } from "./continuous.js";
+import {
+  applyColorLayoutCompanion,
+  preSynchronizeGroupedOffset
+} from "./layout.js";
+import {
+  assertNoConstantColor,
+  COLOR_ENCODING_OPTIONS,
+  resolveColorLayout,
+  resolveColorScaleOptions
+} from "./policy.js";
+
+const encodeColor = action(
+  {
+    op: "encodeColor",
+    description: "Encode a field as graphical color."
+  },
+  function (args = {}) {
+    validateOptions(args, COLOR_ENCODING_OPTIONS, "encodeColor");
+    const requestedFieldType = args.fieldType ?? "nominal";
+    if (!["nominal", "ordinal"].includes(requestedFieldType)) {
+      return encodeContinuousColor(this, {
+        ...args,
+        fieldType: requestedFieldType
+      });
+    }
+    if (args.aggregate !== undefined) {
+      throw new Error("Categorical color does not support aggregate.");
+    }
+    const fieldType = validateCategoricalFieldType(requestedFieldType);
+    const { id: target, dataset, layer } = resolveTarget(
+      this,
+      args.target,
+      ["point", "line", "bar", "area", "arc", "rect"],
+      "color mark"
+    );
+    assertNoConstantColor(this, layer);
+    if (
+      layer.mark.type === "area" &&
+      (layer.encoding?.group?.field === undefined ||
+        layer.encoding.group.field !== args.field)
+    ) {
+      throw new Error(
+        "Area color encoding must match an existing group encoding."
+      );
+    }
+    validateLineSeriesCompatibility(layer, "color", args.field);
+
+    const barGrain = resolveBarGrain(layer);
+    if (layer.mark.type === "bar" && barGrain === undefined) {
+      throw new Error(
+        "Bar color encoding requires a complete histogram encoding or a complete ordinal aggregate encoding."
+      );
+    }
+    const layout = resolveColorLayout(layer, args.layout, barGrain);
+    const requestedScale = resolveReassignmentScaleOptions(
+      layer.encoding?.color,
+      resolveColorScaleOptions(args)
+    );
+    const scale = resolveColorScaleDefinition(this, requestedScale);
+    if (Object.hasOwn(scale, "unknown") && layer.mark.type !== "point") {
+      throw new Error(
+        "Categorical color scale unknown currently requires a row-owned point mark."
+      );
+    }
+    if (layer.mark.type === "rect") {
+      readScaleField(dataset.values, args.field, fieldType, {
+        allowUnknown: true
+      });
+    } else if (Object.hasOwn(scale, "unknown")) {
+      readScaleField(dataset.values, args.field, fieldType, {
+        allowUnknown: true
+      });
+    } else {
+      readNominalField(dataset.values, args.field);
+    }
+
+    let next = this
+      .editSemantic({
+        property: `layer[${target}].encoding.color.field`,
+        value: args.field
+      })
+      .editSemantic({
+        property: `layer[${target}].encoding.color.fieldType`,
+        value: fieldType
+      })
+      .editSemantic({
+        property: `layer[${target}].encoding.color.scale`,
+        value: scale.id
+      });
+    if (layout !== undefined) {
+      next = next.editSemantic({
+        property: `layer[${target}].encoding.color.layout`,
+        value: layout
+      });
+    }
+    next = preSynchronizeGroupedOffset(next, {
+      target,
+      layer,
+      layout,
+      field: args.field,
+      fieldType,
+      scale,
+      requestedScale
+    });
+    next = applyEncodingScale(next, scale, requestedScale, {
+      reassignment: layer.encoding?.color?.scale === scale.id
+    });
+    next = applyColorLayoutCompanion(next, {
+      target,
+      layer,
+      layout,
+      scale,
+      field: args.field
+    });
+
+    return applyMaterializationPlan(
+      next,
+      planEncodingRematerialization(next, {
+        target,
+        channel: "color",
+        scale: scale.id
+      })
+    );
+  }
+);
+
+export function registerColorEncodingAction(ProgramClass) {
+  ProgramClass.prototype.encodeColor = encodeColor;
+}