Project

Changelog

Every release, newest first. This is rendered from CHANGELOG.md in the repository.

Unreleased

0.8.0 - 2026-10-12

Added

  • Four Signature components: PlasmaBall (a plasma globe whose filaments reach for the pointer), ImageSphere (a draggable ball of pictures in plain CSS 3D), InkTrail (a gooey trail that dries away) and WarpField (a starfield that streaks to warp on press).
  • Four more: FlowField (particles riding a wind you can stir), Kaleidoscope (draw and it mirrors into a mandala), PendulumWave (pendulums drifting in and out of step) and RadarSweep (a sweeping beam that lights each contact).

0.7.0 - 2026-10-12

Added

  • 25 new components across every section, not only Signature:
  • Actions: StatusButton (idle, loading, success, error with a gliding width), CopyButton, SplitButton.
  • Forms: AutosizeTextarea with a counter ring, Combobox (type-to-filter select), RangeSlider with an optional histogram.
  • Feedback: ProgressRing (ring and tick-dial variants), Gauge (dial with an overshooting needle), StatusIcon (marks that draw themselves).
  • Data: BarChart (grouped or stacked), DonutChart, Sparkline.
  • Navigation: FloatingNav, Sidebar (collapses to an icon rail), TableOfContents (scroll-spy with a reading rail).
  • Overlays: ContextMenu (with submenus), Lightbox (images grow out of their thumbnails), Tour (spotlight that glides between steps).
  • Footers: FooterGiant (a full-width wordmark that rises in), FooterStatus (live status pill).
  • Text: NeonText, WeightText (variable-font weight follows the pointer), GlitchText, CurveText.
  • Hover: HoverImageList (a picture follows the cursor), HoverGlowGrid (one light across a group of cards).

Changed

  • SplitFlap is redesigned: proper flaps with a hinge, a shadow that moves across the fold, a settling bounce on the final letter, optional clacking sound, three tones (ink, amber, paper), and a single size prop in place of sm | md | lg.

0.6.0 - 2026-10-12

Added

  • Eight more Signature components, each a single file with only the usual peers:
  • SplitFlap: an airport departures board. Every cell is a flap that turns over through the alphabet until it shows the right character.
  • DitherImage: a picture reduced to two colours with ordered dithering, which a lens of full colour dissolves through.
  • Loupe: a magnifying glass that follows the pointer and enlarges any content, including type and whole interfaces.
  • PluckString: a string you pull and release, or sweep across like a harp. It vibrates as standing waves and plays a plucked-string tone.
  • SignaturePad: a signature field with real ink, variable width, smoothing, pen pressure, undo, clear and PNG export.
  • FallingSand: a sand simulation. Pour with the pointer and watch layers pile at the natural angle of repose.
  • Dice: a six-sided die in real 3D that tumbles, bounces and settles on a number, with a ref to roll it.
  • Lanyard: a badge on a woven strap, driven by a rope simulation. Grab it, swing it, let go.

0.5.0 - 2026-10-10

Added

  • Eight more Signature components, each dependency-free apart from the usual peers:
  • VelocityMarquee: a ticker whose speed, direction and lean follow how fast you scroll. Grab it and fling it.
  • SlideToConfirm: the slide-to-unlock control, with a shimmering label, a springing handle and keyboard support.
  • Confetti: a screen-wide burst of tumbling, flipping paper. Fire it from a click or from a ref.
  • PanZoom: an infinite canvas with drag-and-glide, pinch and wheel zoom toward the cursor, double-click and keys.
  • PeelCard: a card whose corner peels back along a real fold, with a lit curl and a cast shadow.
  • Keycap: a keyboard key with real travel that presses itself when its shortcut is typed, with an optional click.
  • ProgressiveBlur: a blur that ramps up toward an edge with no visible seam.
  • ColorPicker: saturation field, hue and opacity strips, hex field and an eyedropper, fully keyboard-driven.

0.4.0 - 2026-10-10

Added

  • Eight more Signature components, each dependency-free:
  • PointerMorph: the iPadOS pointer for the web. A dot that becomes the outline of whatever you hover, and gently pulls it toward you.
  • ParticleText: text made of thousands of particles that scatter from the cursor, spring back, and burst on click.
  • Knob: a rotary dial with ticks. Drag, scroll, arrow keys, double-click to reset.
  • WheelPicker: the iOS wheel with native momentum and snapping, curved in 3D.
  • AuraBorder: a glowing, colour-shifting border for "thinking" states.
  • HoldButton: press and hold to confirm, with a fill, a shake on early release, and keyboard support.
  • CoverFlow: the classic 3D cover browser. Drag, scroll sideways, arrow keys, click.
  • LiquidMetal: a WebGL blob of liquid chrome that chases the pointer.

0.3.1 - 2026-10-10

Fixed

  • ScratchReveal: scratches landed away from the cursor on high-density (2×) displays, and inside CSS-scaled parents. It now works in CSS pixels at any density.
  • LiquidGlass: refraction now only turns on where SVG backdrop filters really run (Chromium). Safari and Firefox get clean frosted glass.
  • AreaChart, SortableList and LiquidSwitch: pointer input is no longer skewed inside CSS-scaled containers.
  • DotGlobe and Waveform no longer depend on CanvasRenderingContext2D.roundRect, which older Safari and Firefox lack.

Changed

  • AiOrb is now a WebGL glass sphere with a flowing interior, a fresnel rim and a halo, falling back to CSS without WebGL.
  • DynamicIsland is always black, like the hardware it imitates.
  • Demos: the island sits in a phone and fits its tile, the glass lens follows the cursor, and the ripple uses a real photo (NASA, public domain).

0.3.0 - 2026-10-09

Changed

  • The CLI is on npm as @agents-npm-packages/vibeui: npx @agents-npm-packages/vibeui add button.
  • The package's runtime dependencies are now only the two the MCP server needs; the website's own (Next, React, Motion) are dev-only, so installing the CLI stays small.
  • Light mode is now monochrome like dark mode: the default accent is the ink, and a single --accent variable still retints everything.
  • Rebuilt the landing page: a one-line animated headline, a live composed interface in the hero, a "ten shelves" section whose previews fit their cards and reveal on scroll, a short agents section, and the source viewer.
  • Gallery tiles now use compact, fixed-width Tile compositions for Actions, Data & surfaces and the weakest tiles in Forms, Feedback and Overlays, so the grid reads evenly. Detail pages keep the full examples.
  • A short last row in each gallery section now ends with a "next shelf" card instead of leaving a gap.

Fixed

  • Command: moving the active item no longer scrolls the whole page, only the list.

Added

  • Eight Signature components, all dependency-free:
  • LiquidGlass: a surface that refracts what is behind it, with chromatic edges and a pointer-tracked rim light (frosted fallback outside Chromium).
  • LiquidSwitch: a toggle with a glass thumb that stretches when held, drags freely and settles with a squish.
  • GooeyMenu: a metaball menu whose actions bud off the button like liquid.
  • DynamicIsland: a pill that morphs between states with a soft overshoot.
  • AiOrb: a living orb for voice and AI, driven by state and an audio level, tinted by --accent.
  • MeshGradient: a flowing WebGL gradient with a static CSS fallback.
  • ScratchReveal: a scratch-off foil over any content.
  • Odometer: mechanical rolling digits with Intl.NumberFormat formatting.
  • Eight more components:
  • DotGlobe: an interactive dotted globe drawn from real coastline data, with drag momentum, hover labels, pulsing markers and animated arcs.
  • RippleImage: an image that ripples like liquid under the pointer (WebGL, with a plain <img> underneath).
  • Waveform: a live audio waveform driven by a level or a Web Audio analyser.
  • AreaChart: a smooth multi-series chart with a crosshair tooltip and arrow-key reading.
  • Heatmap: a contribution-style activity grid with month labels and a legend.
  • SortableList: drag to reorder, with a full keyboard path and screen-reader announcements.
  • Resizable: split panels with accessible, keyboard-friendly dividers.
  • Drawer: a bottom sheet with snap points, rubber-banding and fling-to-dismiss.
  • An animate-eq token (the island's equalizer bars).
  • A social share image and a large Twitter card.
  • BASE_PATH build option: set it (for example /ui) to serve the site under a sub-path of another domain.

0.2.0 - 2026-10-07

A visual and behavioral overhaul of the whole library, a rebuilt website, and a much more detailed documentation set. See the upgrade guide.

Added

  • A new token system in templates/vibeui.css: warm light and dark palettes, an accent, layered shadows, radii, easing, keyframes and the Tailwind dark variant, all in one file.
  • Motion in every component: hover, press and focus feedback, entrance animations, and exit animations for Dialog, Sheet, Popover, DropdownMenu, HoverCard, Toast and Banner.
  • New props and variants: Button accent / danger variants, icon-sm size and loading; Pill accent tone and pulse; Avatar xs / xl sizes and AvatarGroup max; Field error; Tabs line variant; Accordion type and defaultOpen; Stepper horizontal; Meter tone and segments; Marquee reverse and duration; OrbitRing center; CountUp decimals; BlurReveal delay; ListItem leading; Separator animated; Calendar defaultMonth; Sheet bottom and description; Popover side; DropdownMenu icon, shortcut and align; Command icon and autoFocus; Toast tone; SocialLinks youtube and instagram; Checkbox and Radio description.
  • DialogFooter, and ColorSwatch click-to-copy.
  • Generated API reference for every component (api in the registry), produced from the real TypeScript types by scripts/props.mjs.
  • CLI and MCP add copy sibling components a file imports (registryDependencies), and report clsx and tailwind-merge as required peers.
  • A website with a landing page, a searchable /components gallery of live previews, per-component pages with install steps, API tables and source, and fifteen documentation pages.
  • Route transitions, a ⌘K command palette, and a ?theme=light|dark URL override.
  • Repository docs: CHANGELOG.md, SECURITY.md, CODE_OF_CONDUCT.md, THIRD_PARTY_NOTICES.md, issue and pull request templates, and a CI workflow.

Changed

  • Dark mode is monochrome: the accent is the ink itself. Light mode keeps the vermilion accent.
  • Radii are now 8 / 12 / 16 / 22 px and registered with @theme (rounded-sm|md|lg|xl).
  • Checkbox and Radio are native inputs; Dialog and Sheet are portaled, and Dialog traps and restores focus.
  • FlipText is self-contained; RollingText accepts any number of words; BookFlip performs a real page turn; SplitShowcase uses clip-path and pointer events; ScrollStack is pure CSS.
  • /gallery is now /components.
  • Smooth scrolling was removed so Back and Forward restore position instantly.

Fixed

  • Copied components did not animate because keyframes were not in the token file.
  • dark: utilities followed the OS setting instead of the .dark class.
  • vibeui add dialog could leave a broken import by not copying sibling components.
  • Duplicate React keys in Pagination, overlapping Checkbox labels, clipped text effects, an empty HoverSlide, a non-expanding HoverExpand, a clipped Calendar and several effect timings.
  • Lint errors from setState in effects (Typewriter, Calendar, theme provider).

0.1.0 - 2026-10-07

Initial open-source release: about 100 components, a showcase site, the CLI and the MCP server.