layercake

Installation
SKILL.md

Layer Cake Skill

Layer Cake is a foundational visualization framework for Svelte that handles the mathematics of coordinate systems and scales while remaining completely agnostic about visual presentation.

Core Philosophy

Layer Cake follows a "bring your own components" approach. The framework establishes context through reactive Svelte stores, making D3 scales (linear, time, ordinal, log, threshold) and calculated dimensions available to child components via Svelte's context API. Developers build visualization components that consume these stores rather than managing transforms themselves.

Primary Components

LayerCake: The root wrapper establishing context, calculating scales from data extents, managing responsive dimensions, and providing stores for x/y/r scales to children.

Svg, Canvas, Html: Layout containers for different rendering contexts. All coexist in the same coordinate system, allowing hybrid rendering (SVG axes + Canvas marks + HTML tooltips).

Custom Components: Build components that consume stores (xScale$, yScale$, etc.) from context and render visual elements.

Core Concepts

Scales and Dimensions

Related skills

More from linehaul-ai/linehaulai-claude-marketplace

Installs
9
GitHub Stars
4
First Seen
Jan 24, 2026