Skip to main content
Back to changelog

Carousel, Pagination and standalone themes

vortex v0.9.0: Carousel, Pagination and standalone themes
Back to changelog

Carousel and Pagination join Vortex, fields gain responsive spacing, and theme generation moves to vortex-themes.

New features

  • Added compound Carousel components with responsive item widths and groups, swipe navigation, controls, indicators, thumbnails, autoplay and lazy mounting, plus keyboard navigation, RTL support, reduced-motion handling and slide announcements.
  • Added controlled and uncontrolled Pagination with numbered and compact variants, optional page input, configurable arrow labels and animated selection; invalid page values are normalized and input supports IME composition.
  • Added responsive gap to TextField.Root, TextArea.Root and Slider.Root.
  • Added responsive wrap to TextField.Label, TextArea.Label, Select.Label and Slider.Label, plus responsive marginBottom to Select.Label.
  • Added vertical resizing to TextArea, enabled by default; content-driven resize="auto" remains available.
  • Added controlledTabStop to useRovingFocus; horizontal arrow navigation follows the focused group's text direction, and Tabs preserve the selected tab as the Tab-key entry point.

Bug fixes

  • Fixed horizontal ScrollArea thumb positions, track clicks, dragging and reported scroll progress in RTL layouts.
  • Fixed Drawer handle drags after fast pointer movements or release outside the handle, and clamped dragging at the largest snap point.
  • Fixed ZoomImage gallery slides bleeding through during transitions, preserved transparency for single-image groups and improved initial viewer focus.
  • Fixed Select popup associations with labels and rendered error descriptions, and corrected action menu names, popup roles and trigger semantics.
  • Fixed Switch inputs missing the switch role, preserved accessible names on Floating content and added image semantics to non-interactive icon-only Badge instances.
  • Fixed Toast list semantics inside its named live region and changed the Avatar online indicator to a <span>.
  • Fixed Button icon sizing, square proportions for icon-only buttons and disabled styling on hover and with aria-disabled.
  • Fixed background color utilities using undefined foreground tokens.

Breaking changes

  • Required @vortexlabs/vortex-themes@^0.1.0 as a peer dependency. Install it alongside Vortex; component CSS and PostCSS configuration now resolve theme definitions from this package.
  • Moved theme and token APIs from @vortexlabs/vortex/themes and @vortexlabs/vortex/tokens to @vortexlabs/vortex-themes, including VortexThemeConfig. Move CSS and JSON imports from @vortexlabs/vortex/themes/... to @vortexlabs/vortex-themes/themes/...; the old entry points and bundled theme assets have been removed from Vortex. VortexProvider, ThemeScope and useTheme remain in Vortex.
Before → After
// Before
import { getThemeCSS } from "@vortexlabs/vortex/themes";
import type { VortexThemeConfig } from "@vortexlabs/vortex";
import "@vortexlabs/vortex/themes/vortex/theme.css";

// After
import { getThemeCSS } from "@vortexlabs/vortex-themes";
import type { VortexThemeConfig } from "@vortexlabs/vortex-themes";
import "@vortexlabs/vortex-themes/themes/vortex/theme.css";
  • Replaced the vortex theming command with vortex-themes theming. Update generation scripts and regenerate custom theme CSS with the new generator.
  • Replaced the bright theme with awen and renamed the flare override to astra. Update asset imports and theme selection; optional Inter font CSS is available at @vortexlabs/vortex-themes/themes/awen/fonts.css.
  • Renamed Tabs.Item icon to startIcon and Tabs color="default" to color="neutral". Update these props when upgrading.
  • Added default spacing between parts of TextField.Root, TextArea.Root and Slider.Root. Set gap={0} where an existing layout supplies its own spacing.
  • Changed TextArea to show a vertical resize handle by default. Set resize="none" to retain the previous non-resizable behavior.
  • Changed the Toast region from a list to a <section> containing a list. Update selectors that previously targeted the region as the list.