Skip to content

Alpha scope

DriftCSS is an early preview. APIs and CSS coverage will change. Stay on the npm alpha tag until 1.0.

Golden path

Using Vite with React + TypeScript. That is the only install this alpha. Other frameworks are coming soon.

Static className strings, static and mixed templates (static segments rewrite; ${x} stays), and static cn() / clsx() arguments (including leftover rewrite).

In scope today

AreaStatus
Vite plugin + React / TSXSupported
Declaration-level atoms (dedupe across components)Supported
Shorthands → longhands, @media / @supports / @containerSupported
Same-element &:hover, &::before / &::afterSupported
NestedDeclarations after a nested rule (still on the parent)Supported
Static cn() / clsx() fold and leftover rewriteSupported
Mixed `a ${x}` — static quasis rewrite, ${x} staysSupported
strict, stats, production purgeSupported
preserveSelectors / noAtomizeSupported
virtual:driftcss/classes typed mapSupported
Vue static class="…" in <template>Exists; not the launch surface

Not yet

AreaNotes
Next.js / SSR / RSCNo parity tests yet
Vue :class / <style> / documented golden pathStatic class= only
Ancestor / theme context (.dark &)Pass-through today
Combinator atoms (& .child)Pass-through
Same-element compound nest (&.active)Whole parent block pass-through (unlike &:hover)
Classes inside @layer / @starting-styleBlock serializes; inner .class is not atomized
VLQ source mapsPlanned (sourceMap is file-level only)
npm latest / 1.0Intentional — stay on alpha

Known limitations

Pass-through and “not atomized” cases are intended current behavior, documented in docs/COVERAGE.md. The coverage matrix marks those as shipped pass-through, not open Gap rows — cargo test -p driftcss-core coverage_known_gaps prints nothing until a case is marked Gap.

Roadmap

Engineering backlog: docs/ROADMAP.md.