Skip to content

0.12.0

Choose a tag to compare

@aqkprogrammer aqkprogrammer released this 05 Oct 13:36
· 142 commits to 6103acdb450def330217e2590abec599a041b2f1 since this release

Twenty-four animated components from Animate UI's patterns, 244 in all (up
from 220). Also fixes sheet and drawer dimming their own panel, and
swipe-carousel breaking the other carousels when installed after them.

Added

Twenty-four animated components whose patterns come from Animate UI. All are
original implementations: Animate UI's licence (MIT with the Commons Clause)
does not allow redistribution, so none of its code was used. See
THIRD_PARTY_NOTICES.md. Animate UI items Dowel already covered, such as tabs,
tooltip, accordion and the copy, icon and theme-toggler buttons, were not
added again. All 24 are beta, and all of them stop or settle under reduced
motion.

  • Overlays: alert-dialog (springs up out of a blur, and the destructive
    tone shakes its icon once), hover-card (grows from its trigger with an
    overshoot, and can stagger its contents) and preview-link-card (a link
    whose preview image wipes in from a shimmer; nothing is fetched).
  • Form controls: toggle (squishes when pressed, and its fill pours out
    from the centre), toggle-group (a sliding highlight in single mode,
    per-item springs in multiple mode), flip-button, ripple-button,
    liquid-button (rolling liquid fill with an inverting label) and
    share-button (opens into a staggered row of targets, including copy-link
    and the native share sheet).
  • Data and navigation: file-tree (the full ARIA tree pattern, with
    folders that tilt open, a drawn guide rail and a gliding selection),
    code-tabs (syncKey switches every instance on the page together and
    remembers the choice), pin-list, management-bar (a floating bulk-actions
    toolbar with rolling counts) and radial-nav.
  • Display and feedback: flip-card (leans toward the pointer, lifts as it
    turns, and a sheen sweeps across), radial-intro (avatars spiral out into
    an orbiting ring) and notification-list (a receding deck that springs open
    into a list, with swipe-to-dismiss and an always-available dismiss button).
  • Backgrounds: stars-background, gravity-stars-background,
    fireworks-background and hole-background draw through the
    dither-canvas engine, so they inherit its DPR cap, pause when off-screen
    or in a hidden tab, and take their colours from the theme.
    bubble-background, gradient-background (linear, aurora and mesh) and
    hexagon-background are CSS-first.

Changed

  • Generate and the MCP server find the new components from the words
    people use for them — "file explorer", "link preview", "are you sure",
    "bulk actions", "fireworks", "honeycomb" and others now reach them.
  • The components page features fireworks-background, file-tree and
    flip-card.
  • button, badge, label, avatar, input, separator and
    data-table
    now mark their root with data-slot, like every other
    component. They were the exceptions, so tooling that finds a component's
    parts in rendered markup — the docs site's "Parts" view on block pages —
    could not see them. A data-slot passed by the caller still wins, so
    wrappers such as copy-button keep their own.

Fixed

  • Installing swipe-carousel no longer breaks reviews-carousel and
    invite-carousel.
    All three ship a carousel-controls.tsx, but
    swipe-carousel's was a shorter copy without the rotation control. Files
    install flat, so adding swipe-carousel after either of the others replaced
    the file they import from, and the project stopped type-checking. All three
    now ship the same file, and a registry test fails if two items ever ship
    different files to the same path. If it happened to you, run
    dowel update swipe-carousel.
  • sheet and drawer no longer dim themselves. Each put its overlay on
    --z-overlay (300) and its panel on --z-drawer (200), so the overlay
    painted over the open panel — and over sidebar's mobile panel, which is a
    sheet. The overlay now shares the panel's drawer layer and comes first in
    the portal, so the panel sits above it; a dialog opened from inside a panel
    still dims it from the layer above. If you installed either, run
    dowel update sheet drawer, or change z-[var(--z-overlay)] to
    z-[var(--z-drawer)] on the overlay yourself.