@motionscript/code 0.1.0-alpha.5 → 0.1.0-alpha.6

package/src/nodes.ts

@@ -4,15 +4,13 @@ import { Code } from "./node";
  * Every node type this package publishes.
  *
  * A host registers these by handing the array to an engine —
- * `new Engine(platform, { nodes: NODES })` — which reads each class's `@node()`
- * key. The decorator only *declares* that key: nothing is registered by the mere
- * act of importing a module, so a registry holds exactly what its owner asked
- * for and two engines in one process can differ about it.
+ * `new Engine(platform, { nodes: NODES })` — which reads each component's key.
+ * Defining a component only *declares* that key: nothing is registered by
+ * importing a module, so a registry holds exactly what its owner asked for.
  *
- * Listing class **values** is also what survives bundling. This package declares
- * `sideEffects: false`, which licenses a bundler to drop a module nothing
- * imports a value from, and a document names a node type by string — so
- * `import "./node"` for its side effect is exactly what gets shaken out, where an
- * array of bindings is a data dependency that cannot be.
+ * Listing the component **values** is also what survives bundling: this package
+ * declares `sideEffects: false`, and a document names a node type by string, so
+ * an import kept only for its side effect is exactly what gets shaken out.
  */
-export const NODES = [Code];
+// Typed by name, so the declaration names each component rather than spelling out its type through core.
+export const NODES: (typeof Code)[] = [Code];

package/src/render.ts

@@ -70,6 +70,9 @@ export interface DrawCodeState {
     boxW?: number;
 }
 
+/** What a frame is drawn onto: somewhere to draw, and the face's measurements. A render context is one. */
+export type CodeCanvas = Pick<RenderContext2D, "draw" | "measureText">;
+
 /**
  * Draw one frame of a code listing: the settled structure, or — mid
  * structural edit — the two structures it is interpolating between (what
@@ -77,7 +80,7 @@ export interface DrawCodeState {
  * fades/slides in where it lands). Pure over `state`; touches nothing but
  * `draw`.
  */
-export function drawCode(draw: RenderContext2D, state: DrawCodeState): void {
+export function drawCode(draw: CodeCanvas, state: DrawCodeState): void {
     const { tokenLines, metrics, advanceCache, from, to, edit, tokenStates: dim } = state;
 
     const progress = edit ? edit.progress : 1;
@@ -230,7 +233,7 @@ function bandEdges(band: RowBand, state: DrawCodeState, pMove: number): { top: n
  * its rows through a structural edit; between two sets, bands paired by position
  * slide and recolour while an unpaired one fades.
  */
-function drawRowBands(draw: RenderContext2D, state: DrawCodeState, width: number, pMove: number): void {
+function drawRowBands(draw: CodeCanvas, state: DrawCodeState, width: number, pMove: number): void {
     const { rowBands = [], rowsEdit = null } = state;
     const paint = (top: number, bottom: number, color: NormalizedColor, radius: number, opacity: number): void => {
         if (opacity <= 0 || top <= bottom) return;