@motionscript/grids 0.1.0-alpha.7 → 0.1.0-alpha.9

package/src/kit/slots/slot.ts

@@ -1,82 +1,82 @@
-import type { Size2D } from "@motionscript/sdk"
-
-/**
- * One place in an arrangement, in the grid's own frame: centred on it, y-up,
- * `depth` toward the viewer.
- *
- * Pure data, and the whole of what an arrangement produces — which is what lets
- * a morph blend any two of them item by item, whatever shapes they came from.
- */
-export interface Slot {
-  x: number
-  y: number
-  depth: number
-  /** Degrees clockwise. */
-  rotation: number
-  /** Tilt, degrees, as a node's own `rotationX`/`rotationY`. */
-  rotationX: number
-  rotationY: number
-  scale: number
-  opacity: number
-  meta: SlotMeta
-}
-
-/** What kind of place a slot is — the orderings a stagger can follow. */
-export type SlotMeta =
-  | { kind: "rectangular"; row: number; column: number }
-  /** Degrees clockwise from the arrangement's first slot. */
-  | { kind: "radial"; angle: number }
-  /** `0..1` along the part of the path in use. */
-  | { kind: "path"; t: number }
-  /** `depth` is `-1` at the back of the sphere and `1` at the front. */
-  | { kind: "sphere"; lat: number; lon: number; depth: number }
-
-/** What an arrangement is laid out for. */
-export interface SlotInput {
-  count: number
-  /** Each item's measured size, in item order. */
-  sizes: readonly Size2D[]
-  /** The grid's content box. */
-  box: Size2D
-  /** Clip seconds, for arrangements that move on their own. */
-  time: number
-}
-
-export function slot(x: number, y: number, meta: SlotMeta): Slot {
-  return { x, y, depth: 0, rotation: 0, rotationX: 0, rotationY: 0, scale: 1, opacity: 1, meta }
-}
-
-/** `a` toward `b`. The meta switches halfway, since an ordering cannot be half one thing. */
-export function blendSlot(a: Slot, b: Slot, t: number): Slot {
-  if (t <= 0) return a
-  if (t >= 1) return b
-  const mix = (p: number, q: number) => p + (q - p) * t
-  return {
-    x: mix(a.x, b.x),
-    y: mix(a.y, b.y),
-    depth: mix(a.depth, b.depth),
-    rotation: mix(a.rotation, b.rotation),
-    rotationX: mix(a.rotationX, b.rotationX),
-    rotationY: mix(a.rotationY, b.rotationY),
-    scale: mix(a.scale, b.scale),
-    opacity: mix(a.opacity, b.opacity),
-    meta: t < 0.5 ? a.meta : b.meta,
-  }
-}
-
-/** Push `s` away from (or pull it toward) the grid's centre. */
-export function spreadSlot(s: Slot, spread: number): Slot {
-  if (spread === 1) return s
-  return { ...s, x: s.x * spread, y: s.y * spread, depth: s.depth * spread }
-}
-
-/** Largest width and height among `sizes`. */
-export function largest(sizes: readonly Size2D[]): Size2D {
-  let width = 0
-  let height = 0
-  for (const size of sizes) {
-    if (size.width > width) width = size.width
-    if (size.height > height) height = size.height
-  }
-  return { width, height }
-}
+import type { Size2D } from "@motionscript/sdk"
+
+/**
+ * One place in an arrangement, in the grid's own frame: centred on it, y-up,
+ * `depth` toward the viewer.
+ *
+ * Pure data, and the whole of what an arrangement produces — which is what lets
+ * a morph blend any two of them item by item, whatever shapes they came from.
+ */
+export interface Slot {
+  x: number
+  y: number
+  depth: number
+  /** Degrees clockwise. */
+  rotation: number
+  /** Tilt, degrees, as a node's own `rotationX`/`rotationY`. */
+  rotationX: number
+  rotationY: number
+  scale: number
+  opacity: number
+  meta: SlotMeta
+}
+
+/** What kind of place a slot is — the orderings a stagger can follow. */
+export type SlotMeta =
+  | { kind: "rectangular"; row: number; column: number }
+  /** Degrees clockwise from the arrangement's first slot. */
+  | { kind: "radial"; angle: number }
+  /** `0..1` along the part of the path in use. */
+  | { kind: "path"; t: number }
+  /** `depth` is `-1` at the back of the sphere and `1` at the front. */
+  | { kind: "sphere"; lat: number; lon: number; depth: number }
+
+/** What an arrangement is laid out for. */
+export interface SlotInput {
+  count: number
+  /** Each item's measured size, in item order. */
+  sizes: readonly Size2D[]
+  /** The grid's content box. */
+  box: Size2D
+  /** Clip seconds, for arrangements that move on their own. */
+  time: number
+}
+
+export function slot(x: number, y: number, meta: SlotMeta): Slot {
+  return { x, y, depth: 0, rotation: 0, rotationX: 0, rotationY: 0, scale: 1, opacity: 1, meta }
+}
+
+/** `a` toward `b`. The meta switches halfway, since an ordering cannot be half one thing. */
+export function blendSlot(a: Slot, b: Slot, t: number): Slot {
+  if (t <= 0) return a
+  if (t >= 1) return b
+  const mix = (p: number, q: number) => p + (q - p) * t
+  return {
+    x: mix(a.x, b.x),
+    y: mix(a.y, b.y),
+    depth: mix(a.depth, b.depth),
+    rotation: mix(a.rotation, b.rotation),
+    rotationX: mix(a.rotationX, b.rotationX),
+    rotationY: mix(a.rotationY, b.rotationY),
+    scale: mix(a.scale, b.scale),
+    opacity: mix(a.opacity, b.opacity),
+    meta: t < 0.5 ? a.meta : b.meta,
+  }
+}
+
+/** Push `s` away from (or pull it toward) the grid's centre. */
+export function spreadSlot(s: Slot, spread: number): Slot {
+  if (spread === 1) return s
+  return { ...s, x: s.x * spread, y: s.y * spread, depth: s.depth * spread }
+}
+
+/** Largest width and height among `sizes`. */
+export function largest(sizes: readonly Size2D[]): Size2D {
+  let width = 0
+  let height = 0
+  for (const size of sizes) {
+    if (size.width > width) width = size.width
+    if (size.height > height) height = size.height
+  }
+  return { width, height }
+}

package/src/kit/slots/sphere.ts

@@ -1,94 +1,94 @@
-import { slot, type Slot, type SlotInput } from "./slot"
-
-/** `outward` lays each item on the sphere's surface; `billboard` keeps every item facing the viewer. */
-export const SPHERE_FACINGS = ["outward", "billboard"] as const
-export type SphereFacing = (typeof SPHERE_FACINGS)[number]
-
-export const SPHERE_AXES = ["x", "y", "z"] as const
-export type SphereAxis = (typeof SPHERE_AXES)[number]
-
-export interface SphereArrangement {
-  kind: "sphere"
-  radius: number
-  /** Turn about the vertical axis, degrees — positive carries the front to the right. */
-  yaw: number
-  /** Turn about the horizontal axis, degrees — positive brings the top toward the viewer. */
-  pitch: number
-  /** Turn about the view axis, degrees clockwise. */
-  roll: number
-  facing: SphereFacing
-  /** The camera's distance from the sphere's centre plane, px — smaller is more dramatic. */
-  focalLength: number
-  /** How much the back half fades, `0..1`. */
-  depthFade: number
-  /** Hide the items whose faces point away from the viewer. */
-  cullBackfaces: boolean
-  /** Degrees per second of yaw the sphere turns on its own. */
-  spinSpeed: number
-}
-
-const GOLDEN_ANGLE = Math.PI * (3 - Math.sqrt(5))
-const DEG = 180 / Math.PI
-
-/** Point `k` of `count` on the unit sphere — a Fibonacci lattice, as even as `count` points get. */
-export function fibonacciPoint(k: number, count: number): [number, number, number] {
-  if (count <= 1) return [0, 0, 1]
-  const y = 1 - (2 * (k + 0.5)) / count
-  const r = Math.sqrt(Math.max(0, 1 - y * y))
-  const theta = k * GOLDEN_ANGLE
-  return [Math.cos(theta) * r, y, Math.sin(theta) * r]
-}
-
-/** `p` turned by yaw, then pitch, then roll — y-up, z toward the viewer. */
-export function orient(p: readonly [number, number, number], yaw: number, pitch: number, roll: number): [number, number, number] {
-  const [x0, y0, z0] = p
-  const ya = yaw / DEG, pa = pitch / DEG, ra = roll / DEG
-  const x1 = x0 * Math.cos(ya) + z0 * Math.sin(ya)
-  const z1 = -x0 * Math.sin(ya) + z0 * Math.cos(ya)
-  const y2 = y0 * Math.cos(pa) - z1 * Math.sin(pa)
-  const z2 = y0 * Math.sin(pa) + z1 * Math.cos(pa)
-  return [x1 * Math.cos(ra) + y2 * Math.sin(ra), -x1 * Math.sin(ra) + y2 * Math.cos(ra), z2]
-}
-
-export function sphereSlots(arrangement: SphereArrangement, input: SlotInput): Slot[] {
-  const { count } = input
-  const radius = arrangement.radius
-  const yaw = arrangement.yaw + arrangement.spinSpeed * input.time
-  const outward = arrangement.facing === "outward"
-  const slots: Slot[] = []
-  for (let k = 0; k < count; k++) {
-    const q = fibonacciPoint(k, count)
-    const [nx, ny, nz] = orient(q, yaw, arrangement.pitch, arrangement.roll)
-    const s = slot(nx * radius, ny * radius, {
-      kind: "sphere",
-      lat: Math.asin(Math.max(-1, Math.min(1, q[1]))) * DEG,
-      lon: Math.atan2(q[2], q[0]) * DEG,
-      depth: nz,
-    })
-    s.depth = nz * radius
-    if (outward) {
-      // The tilt whose `Rx · Ry` turns a face's normal onto the surface normal.
-      s.rotationY = Math.asin(Math.max(-1, Math.min(1, nx))) * DEG
-      s.rotationX = Math.atan2(ny, nz) * DEG
-    }
-    s.opacity = 1 - arrangement.depthFade * (1 - (nz + 1) / 2)
-    if (outward && arrangement.cullBackfaces && facesAway(s, [nx, ny, nz], arrangement.focalLength)) s.opacity = 0
-    slots.push(s)
-  }
-  return slots
-}
-
-/** Whether an outward face at `s` shows its back to a viewer `focal` px in front of the centre. */
-function facesAway(s: Slot, normal: readonly [number, number, number], focal: number): boolean {
-  if (focal <= 0) return normal[2] < 0
-  return normal[0] * -s.x + normal[1] * -s.y + normal[2] * (focal - s.depth) < 0
-}
-
-/** The yaw and pitch that bring point `index` of `count` round to face the viewer. */
-export function sphereFaceForward(count: number, index: number): { yaw: number; pitch: number } {
-  const [x, y, z] = fibonacciPoint(index, count)
-  return {
-    yaw: -Math.atan2(x, z) * DEG,
-    pitch: Math.atan2(y, Math.hypot(x, z)) * DEG,
-  }
-}
+import { slot, type Slot, type SlotInput } from "./slot"
+
+/** `outward` lays each item on the sphere's surface; `billboard` keeps every item facing the viewer. */
+export const SPHERE_FACINGS = ["outward", "billboard"] as const
+export type SphereFacing = (typeof SPHERE_FACINGS)[number]
+
+export const SPHERE_AXES = ["x", "y", "z"] as const
+export type SphereAxis = (typeof SPHERE_AXES)[number]
+
+export interface SphereArrangement {
+  kind: "sphere"
+  radius: number
+  /** Turn about the vertical axis, degrees — positive carries the front to the right. */
+  yaw: number
+  /** Turn about the horizontal axis, degrees — positive brings the top toward the viewer. */
+  pitch: number
+  /** Turn about the view axis, degrees clockwise. */
+  roll: number
+  facing: SphereFacing
+  /** The camera's distance from the sphere's centre plane, px — smaller is more dramatic. */
+  focalLength: number
+  /** How much the back half fades, `0..1`. */
+  depthFade: number
+  /** Hide the items whose faces point away from the viewer. */
+  cullBackfaces: boolean
+  /** Degrees per second of yaw the sphere turns on its own. */
+  spinSpeed: number
+}
+
+const GOLDEN_ANGLE = Math.PI * (3 - Math.sqrt(5))
+const DEG = 180 / Math.PI
+
+/** Point `k` of `count` on the unit sphere — a Fibonacci lattice, as even as `count` points get. */
+export function fibonacciPoint(k: number, count: number): [number, number, number] {
+  if (count <= 1) return [0, 0, 1]
+  const y = 1 - (2 * (k + 0.5)) / count
+  const r = Math.sqrt(Math.max(0, 1 - y * y))
+  const theta = k * GOLDEN_ANGLE
+  return [Math.cos(theta) * r, y, Math.sin(theta) * r]
+}
+
+/** `p` turned by yaw, then pitch, then roll — y-up, z toward the viewer. */
+export function orient(p: readonly [number, number, number], yaw: number, pitch: number, roll: number): [number, number, number] {
+  const [x0, y0, z0] = p
+  const ya = yaw / DEG, pa = pitch / DEG, ra = roll / DEG
+  const x1 = x0 * Math.cos(ya) + z0 * Math.sin(ya)
+  const z1 = -x0 * Math.sin(ya) + z0 * Math.cos(ya)
+  const y2 = y0 * Math.cos(pa) - z1 * Math.sin(pa)
+  const z2 = y0 * Math.sin(pa) + z1 * Math.cos(pa)
+  return [x1 * Math.cos(ra) + y2 * Math.sin(ra), -x1 * Math.sin(ra) + y2 * Math.cos(ra), z2]
+}
+
+export function sphereSlots(arrangement: SphereArrangement, input: SlotInput): Slot[] {
+  const { count } = input
+  const radius = arrangement.radius
+  const yaw = arrangement.yaw + arrangement.spinSpeed * input.time
+  const outward = arrangement.facing === "outward"
+  const slots: Slot[] = []
+  for (let k = 0; k < count; k++) {
+    const q = fibonacciPoint(k, count)
+    const [nx, ny, nz] = orient(q, yaw, arrangement.pitch, arrangement.roll)
+    const s = slot(nx * radius, ny * radius, {
+      kind: "sphere",
+      lat: Math.asin(Math.max(-1, Math.min(1, q[1]))) * DEG,
+      lon: Math.atan2(q[2], q[0]) * DEG,
+      depth: nz,
+    })
+    s.depth = nz * radius
+    if (outward) {
+      // The tilt whose `Rx · Ry` turns a face's normal onto the surface normal.
+      s.rotationY = Math.asin(Math.max(-1, Math.min(1, nx))) * DEG
+      s.rotationX = Math.atan2(ny, nz) * DEG
+    }
+    s.opacity = 1 - arrangement.depthFade * (1 - (nz + 1) / 2)
+    if (outward && arrangement.cullBackfaces && facesAway(s, [nx, ny, nz], arrangement.focalLength)) s.opacity = 0
+    slots.push(s)
+  }
+  return slots
+}
+
+/** Whether an outward face at `s` shows its back to a viewer `focal` px in front of the centre. */
+function facesAway(s: Slot, normal: readonly [number, number, number], focal: number): boolean {
+  if (focal <= 0) return normal[2] < 0
+  return normal[0] * -s.x + normal[1] * -s.y + normal[2] * (focal - s.depth) < 0
+}
+
+/** The yaw and pitch that bring point `index` of `count` round to face the viewer. */
+export function sphereFaceForward(count: number, index: number): { yaw: number; pitch: number } {
+  const [x, y, z] = fibonacciPoint(index, count)
+  return {
+    yaw: -Math.atan2(x, z) * DEG,
+    pitch: Math.atan2(y, Math.hypot(x, z)) * DEG,
+  }
+}

package/src/kit/stagger.ts

@@ -1,96 +1,96 @@
-import { shuffled } from "./random"
-import type { Slot } from "./slots"
-
-/**
- * The order a per-item effect sweeps through a grid's items. The first five
- * work on any grid; the rest follow one arrangement's own geometry — rows and
- * columns of a rectangular grid (or top-to-bottom and left-to-right of any
- * other), the way round a ring, the way along a path, front to back of a sphere
- * — and fall back to item order where the grid has no such thing.
- */
-export const STAGGER_ORDERS = [
-  "index",
-  "reverse",
-  "random",
-  "centerOut",
-  "edgesIn",
-  "row",
-  "column",
-  "angle",
-  "path",
-  "depth",
-] as const
-export type StaggerOrder = (typeof STAGGER_ORDERS)[number]
-
-/** The most of a command's length the offsets may take; the rest is each item's own motion. */
-const MAX_STAGGER = 0.95
-
-/**
- * Each item's start, `0..1`, as a share of the stagger: `0` goes first, `1`
- * last, and items that tie go together — a ring revealed `centerOut` from its
- * centre appears all at once, which is what that means.
- */
-export function staggerRanks(order: StaggerOrder, slots: readonly Slot[], seed: number): number[] {
-  const n = slots.length
-  const keys = keysOf(order, slots, seed)
-  let min = Infinity
-  let max = -Infinity
-  for (const key of keys) {
-    if (key < min) min = key
-    if (key > max) max = key
-  }
-  const range = max - min
-  if (!(range > 1e-9)) return new Array<number>(n).fill(0)
-  return keys.map((key) => (key - min) / range)
-}
-
-/**
- * Item progress at command time `t`: each item runs over the same length of
- * time, starting `rank · stagger` in. The stagger lives inside the command's
- * duration, so a one-second reveal takes one second for four items or four
- * hundred.
- */
-export function staggerProgress(rank: number, t: number, stagger: number): number {
-  const s = Math.max(0, Math.min(MAX_STAGGER, stagger))
-  const p = s === 0 ? t : (t - rank * s) / (1 - s)
-  return p < 0 ? 0 : p > 1 ? 1 : p
-}
-
-function keysOf(order: StaggerOrder, slots: readonly Slot[], seed: number): number[] {
-  switch (order) {
-    case "reverse":
-      return slots.map((_, i) => -i)
-    case "random": {
-      const sequence = shuffled(slots.map((_, i) => i), seed)
-      const keys = new Array<number>(slots.length)
-      sequence.forEach((item, rank) => {
-        keys[item] = rank
-      })
-      return keys
-    }
-    case "centerOut":
-      return slots.map((s) => Math.round(Math.hypot(s.x, s.y, s.depth) * 1000) / 1000)
-    case "edgesIn":
-      return slots.map((s) => -Math.round(Math.hypot(s.x, s.y, s.depth) * 1000) / 1000)
-    case "row":
-      return slots.map((s) => (s.meta.kind === "rectangular" ? s.meta.row : -Math.round(s.y)))
-    case "column":
-      return slots.map((s) => (s.meta.kind === "rectangular" ? s.meta.column : Math.round(s.x)))
-    case "angle":
-      return slots.map((s, i) =>
-        s.meta.kind === "radial" ? s.meta.angle : s.meta.kind === "rectangular" || s.meta.kind === "sphere" ? clockAngle(s) : i
-      )
-    case "path":
-      return slots.map((s, i) => (s.meta.kind === "path" ? s.meta.t : i))
-    case "depth":
-      return slots.map((s, i) => (s.meta.kind === "sphere" ? -s.meta.depth : i))
-    default:
-      return slots.map((_, i) => i)
-  }
-}
-
-/** Degrees clockwise from twelve o'clock to where `s` sits. */
-function clockAngle(s: Slot): number {
-  const angle = (Math.atan2(s.x, s.y) * 180) / Math.PI
-  return angle < 0 ? angle + 360 : angle
-}
+import { shuffled } from "./random"
+import type { Slot } from "./slots"
+
+/**
+ * The order a per-item effect sweeps through a grid's items. The first five
+ * work on any grid; the rest follow one arrangement's own geometry — rows and
+ * columns of a rectangular grid (or top-to-bottom and left-to-right of any
+ * other), the way round a ring, the way along a path, front to back of a sphere
+ * — and fall back to item order where the grid has no such thing.
+ */
+export const STAGGER_ORDERS = [
+  "index",
+  "reverse",
+  "random",
+  "centerOut",
+  "edgesIn",
+  "row",
+  "column",
+  "angle",
+  "path",
+  "depth",
+] as const
+export type StaggerOrder = (typeof STAGGER_ORDERS)[number]
+
+/** The most of a command's length the offsets may take; the rest is each item's own motion. */
+const MAX_STAGGER = 0.95
+
+/**
+ * Each item's start, `0..1`, as a share of the stagger: `0` goes first, `1`
+ * last, and items that tie go together — a ring revealed `centerOut` from its
+ * centre appears all at once, which is what that means.
+ */
+export function staggerRanks(order: StaggerOrder, slots: readonly Slot[], seed: number): number[] {
+  const n = slots.length
+  const keys = keysOf(order, slots, seed)
+  let min = Infinity
+  let max = -Infinity
+  for (const key of keys) {
+    if (key < min) min = key
+    if (key > max) max = key
+  }
+  const range = max - min
+  if (!(range > 1e-9)) return new Array<number>(n).fill(0)
+  return keys.map((key) => (key - min) / range)
+}
+
+/**
+ * Item progress at command time `t`: each item runs over the same length of
+ * time, starting `rank · stagger` in. The stagger lives inside the command's
+ * duration, so a one-second reveal takes one second for four items or four
+ * hundred.
+ */
+export function staggerProgress(rank: number, t: number, stagger: number): number {
+  const s = Math.max(0, Math.min(MAX_STAGGER, stagger))
+  const p = s === 0 ? t : (t - rank * s) / (1 - s)
+  return p < 0 ? 0 : p > 1 ? 1 : p
+}
+
+function keysOf(order: StaggerOrder, slots: readonly Slot[], seed: number): number[] {
+  switch (order) {
+    case "reverse":
+      return slots.map((_, i) => -i)
+    case "random": {
+      const sequence = shuffled(slots.map((_, i) => i), seed)
+      const keys = new Array<number>(slots.length)
+      sequence.forEach((item, rank) => {
+        keys[item] = rank
+      })
+      return keys
+    }
+    case "centerOut":
+      return slots.map((s) => Math.round(Math.hypot(s.x, s.y, s.depth) * 1000) / 1000)
+    case "edgesIn":
+      return slots.map((s) => -Math.round(Math.hypot(s.x, s.y, s.depth) * 1000) / 1000)
+    case "row":
+      return slots.map((s) => (s.meta.kind === "rectangular" ? s.meta.row : -Math.round(s.y)))
+    case "column":
+      return slots.map((s) => (s.meta.kind === "rectangular" ? s.meta.column : Math.round(s.x)))
+    case "angle":
+      return slots.map((s, i) =>
+        s.meta.kind === "radial" ? s.meta.angle : s.meta.kind === "rectangular" || s.meta.kind === "sphere" ? clockAngle(s) : i
+      )
+    case "path":
+      return slots.map((s, i) => (s.meta.kind === "path" ? s.meta.t : i))
+    case "depth":
+      return slots.map((s, i) => (s.meta.kind === "sphere" ? -s.meta.depth : i))
+    default:
+      return slots.map((_, i) => i)
+  }
+}
+
+/** Degrees clockwise from twelve o'clock to where `s` sits. */
+function clockAngle(s: Slot): number {
+  const angle = (Math.atan2(s.x, s.y) * 180) / Math.PI
+  return angle < 0 ? angle + 360 : angle
+}

package/src/nodes.ts

@@ -1,30 +1,30 @@
-import { PathGrid } from "./path-grid"
-import { RadialGrid } from "./radial-grid"
-import { RectangularGrid } from "./rectangular-grid"
-import { SphereGrid } from "./sphere-grid"
-
-/**
- * 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 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 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.
- */
-// Typed by name, so the declaration names each component rather than spelling out its type through core.
-type KitNode =
-  | typeof RectangularGrid
-  | typeof RadialGrid
-  | typeof PathGrid
-  | typeof SphereGrid
-
-export const NODES: KitNode[] = [
-  RectangularGrid,
-  RadialGrid,
-  PathGrid,
-  SphereGrid,
-]
+import { PathGrid } from "./path-grid"
+import { RadialGrid } from "./radial-grid"
+import { RectangularGrid } from "./rectangular-grid"
+import { SphereGrid } from "./sphere-grid"
+
+/**
+ * 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 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 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.
+ */
+// Typed by name, so the declaration names each component rather than spelling out its type through core.
+type KitNode =
+  | typeof RectangularGrid
+  | typeof RadialGrid
+  | typeof PathGrid
+  | typeof SphereGrid
+
+export const NODES: KitNode[] = [
+  RectangularGrid,
+  RadialGrid,
+  PathGrid,
+  SphereGrid,
+]

package/src/path-grid/index.ts

@@ -1 +1 @@
-export * from "./path-grid"
+export * from "./path-grid"