Skip to content

P5.2 — Generative typography/motion/radius scale primitives#113

Merged
dbanksdesign merged 1 commit into
mainfrom
p5-2-token-scale
Jul 4, 2026
Merged

P5.2 — Generative typography/motion/radius scale primitives#113
dbanksdesign merged 1 commit into
mainfrom
p5-2-token-scale

Conversation

@dbanksdesign

Copy link
Copy Markdown
Collaborator

Implements P5.2 from IMPROVEMENTS.md per specs/type-motion-radius-scale-generation.md (core-only scope — the design-system wiring lives in var-ui).

What's new

New typestyles/token-scale subpath (packages/typestyles/src/token-scale.ts) with three generic numeric ramp generators, so a theme author writes 2-3 numbers instead of hand-picking a whole ladder:

  • generateGeometricScale({ base, ratio, steps, round? })base * ratio ** offset for each signed integer offset in steps (font-size-style modular ladders). Offset 0 always returns exactly base.
  • generateLinearScale({ base, multiplier, steps, round? })base * step * multiplier for each ordinal in steps (radius-style grid ladders). multiplier: 0 is allowed (all zeros).
  • expandDurationBand({ base, ratio, roundTo? }) — expands one duration anchor into { min, base, max } (min = base * ratio, max = base / ratio), rounded to the nearest 5ms by default so bands look hand-picked instead of computed (no 93.75ms).

Pure numeric outputs, zero naming opinions — no fontSize/radius/fast vocabulary in core. Rounding defaults to whole numbers (Math.round), with round/roundTo overrides. Clear [typestyles]-prefixed errors guard non-finite inputs, ratio <= 0, roundTo <= 0, and non-integer geometric offsets.

Wiring mirrors typestyles/color-scale (P5.1): tsup entry src/token-scale-entry.ts, ESM+CJS exports block, separate subpath with zero impact on the main bundle (bundle-size check still passes: 16794 / 16900 budget). Docs added to api-reference.md and theming-patterns.md alongside the color-scale sections; changeset .changeset/p5-2-token-scale.md (typestyles: minor); P5.2 checked off in IMPROVEMENTS.md.

Test evidence

  • pnpm test (packages/typestyles): 26 files / 381 tests passed (includes new token-scale.test.ts: 23 tests covering deterministic math, rounding defaults + overrides, step ordering, steps=1/empty edge cases, and zero/negative/non-finite guards)
  • pnpm typecheck: pass
  • pnpm build: passdist/token-scale.{js,cjs,d.ts,d.cts} emitted; verified import/require of typestyles/token-scale both resolve and return correct values at runtime
  • pnpm lint: pass (1 pre-existing warning in color-scale.test.ts, none in new code)

🤖 Generated with Claude Code

Add typestyles/token-scale subpath with generateGeometricScale,
generateLinearScale, and expandDurationBand — generic numeric ramp
generators for font-size ladders, radius steps, and duration min/max
bands. Pure numeric outputs with zero naming opinions in core.

Spec: specs/type-motion-radius-scale-generation.md

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@dbanksdesign dbanksdesign merged commit 3459b70 into main Jul 4, 2026
7 checks passed
@dbanksdesign dbanksdesign deleted the p5-2-token-scale branch July 4, 2026 17:10
@github-actions github-actions Bot mentioned this pull request Jul 4, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant