Repository navigation
Added
-
shader-background(experimental): a full-bleed WebGL scene behind
content. One engine draws fourteen procedural presets:dunes,hills,
storm-sea,meadow,petals,glass-wave,liquid-metal,silk,
mesh-gradient,topography,particle-ocean,nebula,warpand
helix.colorsre-dresses any scene with theme tokens or CSS colours, and
attach="viewport"pins it behind a whole page without clipping sticky
headers. It stops drawing off-screen and in hidden tabs, shows one still frame
under reduced motion, and falls back to a CSS gradient in the same palette
without WebGL or after a lost context. -
aurora-background,border-beamandcosmic-background. -
Docs:
/docs/backgroundsshows every background in the library live,
with category filters and, for each one, a prompt for a coding agent that is
generated from the same catalogue as the card. -
Docs: manual install tabs on component and block pages, next to the CLI
command. -
Controls on every component page. A Controls toggle beside the live
example sets its props in place and shows the tag as set; the Playground link
carries those props with it. -
Playground links hold the whole configuration: component, example, theme,
mode, radius and every changed prop. Values read from a link are checked
against the control that would have set them — an unknown option is dropped
and a number is clamped to its range. -
Registry: a
controlon each prop (select, boolean, number, text or
colour), derived from the prop's type with its default, and refined by a new
optionalcontrolsfield inmeta.tsfor what a type cannot say (a number's
range). The MCP server'sget_componentshows number ranges. -
Registry:
capabilities.tier—css,motion,canvasorwebgl, the
heaviest technique an item uses counting what it installs with it. Optional in
the schema, so registries built before it still parse. -
carousel: scroll-snap carousel with previous/next, dots, keyboard
steps in reading direction, several items per view and a vertical layout.
Rotation is opt-in and pauses on hover, focus, off-screen and in hidden tabs. -
comparison-slider: two versions of one thing with a draggable,
keyboard-operable divider. -
color-picker: saturation square, hue and alpha, hex/rgb/oklch,
swatches, eyedropper and a live WCAG contrast reading. -
resizable: panels with window-splitter handles, limits and collapsible
panels. -
password-strength: a strength meter and rule checklist for a password
field. -
Hooks in the registry:
use-reduced-motionanduse-in-viewinstall
into the project's hooks folder (dowel add use-in-view), and are exported
from@dowel-ui/reactand@dowel-ui/react/hooks/*. -
pattern-background,interactive-grid,light-beamsand
flow-field: a CSS pattern backdrop (dots, grid, lines, stripes, checker,
grain), a pointer-lit canvas grid with ripples, CSS rays of light, and
particles on a moving current. All four are on/docs/backgrounds, in a new
"Patterns & grids" filter. -
Docs: background pages link to the gallery ("14 looks in Backgrounds"),
deep-linked to the look, and component pages say how a component draws when
it is more than CSS ("Draws on a canvas", "Renders with WebGL"). -
Scroll effects:
scroll-reveal(seven effects, staggered children, and
content that is never hidden unless it will be revealed),parallax,
stacking-cardsandhorizontal-scroll(pinned, driven by the page's own
scroll, a plain scroller without JavaScript or under reduced motion). -
Cursor effects:
image-trailandcursor-spotlight, scoped to their
box, leaving the system cursor alone, and off for touch and reduced motion. -
Text effects:
gradient-text,highlight-text,letter-swapand
proximity-text— each keeps the text as real, readable text. -
Buttons:
effect-buttongains aglitcheffect;Buttongains
press="depth", raised on an edge it sinks into;confetti-buttonbursts
confetti from itself, andburstConfetti()from anywhere. -
Layout:
glow-cardgainsvariant="spotlight", andbento-gridlays out
tiles of mixed sizes. -
Navigation:
navbar(static, sticky or hide-on-scroll — never hidden
while it holds focus — with a mobile menu and a skip link),
navigation-menu(links and mega menus) andbottom-nav(a phone tab bar
with spoken badges). -
AI:
voice-inputrecords, shows level and time, transcribes where the
browser can, and explains a blocked or missing microphone;
audio-visualizerdraws a stream or a level as bars, a wave or an orb;
workflow-graphlays out a pipeline in layers, each step stating its
status;model-comparisoncompares models in a table that marks the best
of each row in words. -
Blocks:
changelog,contact,careers,integrations,api-keys
(each new key shown once, revoking confirmed),site-header(desktop menus
and the mobile list from one list of links), and two heroes over the new
backgrounds,hero-light-beamsandhero-flow-field. Search finds them by
everyday words — "release notes", "jobs", "mega menu", "api keys". -
3D:
cubeturns to show one face at a time — a carousel to assistive
technology, by buttons, arrow keys or drag;image-ringstands images on a
slowly turning ring you can drag;device-mockupdraws a phone, tablet,
laptop or browser around a screenshot or live UI, with an optional tilt. -
WebGL:
globedraws a dotted globe with places and the routes between
them in raw WebGL, listing them for screen readers and falling back to SVG;
model-viewershows a glTF/GLB model people can turn, behind a poster.
threeis an optional peer used only bymodel-viewer, which is not in
the main entry: import it from@dowel-ui/react/model-viewer. -
Visual regression tests.
packages/visual-testsscreenshots every
Storybook story and compares it with the same story on the base branch, in a
new CI workflow. No baseline images are committed: the job builds Storybook
for both commits and captures the baseline from the base build each time. A
pull request that changes how a story looks fails unless it carries the
visual-changelabel. Seedocs/testing/visual-regression.md. It runs
alongsidepackages/browser-tests, which keeps committed baselines for a
curated set of stories. -
A live agent demo, at
/agent-demo. A model operates a small deals page
through the tools the page registers withagent-surface, and the visitor
can take the page back by touching it, hand it back with a note, approve or
decline the one action that cannot be undone, and undo the rest. The model
runs through one narrow endpoint that is off untilANTHROPIC_API_KEYis
set; without it the page plays a scripted run through the same surface. See
RELEASING.mdfor the configuration and what bounds the cost.
Changed
- Registry items can name dev dependencies. An item whose npm dependency
ships no type declarations lists them indevDependencies, anddowel add
installs them with-D, so the project still type-checks — the install
check caughtmodel-viewerfailing without@types/three. The field is
optional: older registries parse, and an older CLI ignores it (and leaves
the types to be installed by hand).dowel doctor, the MCP server and the
docs' manual install steps list them too. - The install check runs in CI.
pnpm install-checkinstalls every
registry item into a new Next.js app with this checkout's CLI and builds it,
on pull requests that touch the library and nightly against the newest
Next.js. - Releases publish from a tag. Pushing
vX.Y.Zruns a workflow that
refuses to continue until the live registry serves that version, publishes
to npm with trusted publishing, and opens the GitHub release from this
file. SeeRELEASING.md. audit:installed-importsfails when two items ship different files under
one name, the cause of the carousel bug fixed in 0.12.0.blast-radiussays a single kind of change plainly: "2 emails will be
created." where it said "2 emails will change: 2 created."
Fixed
Three things the demo showed within minutes of being used by hand, none of
which a unit test could see.
-
agent-surface: the click that takes control is no longer lost. Ticking
a box or typing in a field while the agent held the page took control and
threw the tick or the character away. Control changed in the event's capture
phase, React rendered before the control's ownonChangewas worked out,
and a controlled input was put back to its old value. The agent is still
refused from the instant of the click, and the change now reaches React in
the bubble phase, with the person's handler. jsdom cannot show this, so it
is checked in a browser (agent-surface.browser.spec.ts, run by a job in the
Browserworkflow). -
agent-surface,agent-approvals: a question is withdrawn when the
person takes over. An approval stayed on screen after a take-over, though
approving it could only be refused. The call now ends at once, told that the
person holds the page, andagent-approvalsmoves on to the next request.
The same happens when the caller aborts. -
agent-replayno longer takes the page from the agent. Stepping through
a replay inside a surface counted as taking over. Like the ledger, it is
marked as the agent's own interface. -
Props tables were missing props a component removes from its element with
Omitand then declares itself (BorderBeam'scolor, for one): 120 across
the library, now listed. -
matrix-orbcould run its springs backwards for one frame: the first
frame's clock and the next frame's timestamp can disagree, and the negative
step was not clamped. This also made two of its tests fail intermittently. -
Background performance:
gravity-stars-backgroundfinds its links with
a spatial hash into reused buffers instead of comparing every pair and
allocating each frame;fireworks-backgroundno longer allocates per frame;
bubble-backgroundandgradient-backgroundpause their animation
off-screen. -
The MCP server's
search_componentscategory hint now lists every category,
effectsincluded.