Skip to content
Byos
ComponentsDocs
XFigma3.4k
Overview
  • Introduction
  • Get Started
  • Styling
  • Registry
  • Roadmap
Components
  • Alert
  • Autocomplete
  • Badge
  • Cascader
  • Code Block
  • Data GridVirtualization and row pinning support added
  • Date Selector
  • Event Calendar
  • File Upload
  • Filters
  • Frame
  • Gantt
  • Icon Stack
  • Icon Tile
  • Kanban
  • Number Field
  • Phone Input
  • Rating
  • Scrollspy
  • Sortable
  • Stepper
  • Timeline
  • Tree

Product

  • Components
  • Docs

Community

  • GitHub
  • X / Twitter
  • Figma

© 2026 Byos. Released under the MIT License.

3.4k

Changelog

Latest updates and announcements.

v2.5.5 - 16 September, 2026.

ReUI follows shadcn onto the cn package, and the Event Calendar and Data Grid each get back an interaction that was unreachable before.

Breaking changes:

  • ReUI items that merge classes now import cn from the instead of your @/lib/utils, following shadcn upstream - .
  • Any item that imports it lists cn in its dependencies, so shadcn add installs the package on the first such install - .
  • Items already installed keep working and your @/lib/utils is untouched - .
  • To drop clsx and tailwind-merge from your own project, run pnpm dlx shadcn@latest migrate cn - .
  • If you had customized cn in @/lib/utils, rebuild it with createCn from cn/config; newly installed items no longer route through that file - .

On This Page

v2.5.5 - 16 September, 2026.v2.5.2 - 1 September, 2026.v2.5.0 - 26 August, 2026.v2.4.0 - 25 August, 2026.v2.3.0 - 19 August, 2026.v2.2.0 - 5 August, 2026.v2.1.8 - 2 August, 2026.v2.1.7 - 29 July, 2026.v2.1.6 - 24 July, 2026.v2.1.5 - 22 July, 2026.v2.0.1 - 17 March, 2026.v1 - Legacy

Fixes & Improvements:

  • EventCalendar: timed views reserve a clickable strip at the end of each day column, so a press beside a full-width block creates a new event instead of doing nothing - Preview.
  • EventCalendar: the strip's width is the --ec-event-gutter custom property, default 0.75rem; set classNames.dayColumn: "[--ec-event-gutter:0px]" to restore edge-to-edge blocks - Docs.
  • DataGridPagination: moved from fixed page blocks to an adaptive window carrying the first and last page, so the last page is always one click away instead of several ellipsis steps - Docs.
  • DataGridPagination: the existing moreLimit prop now counts the buttons in the truncated middle and is rounded down to an odd count with a floor of 3; page buttons carry a per-style min-width so the row keeps a steady width as you page - Docs.
  • Cascader: virtual rows froze at their first window in apps built with React Compiler, which cached the row list against a virtualizer identity that never changes - Preview.
  • Filters: defaultOperator now documents what it does - the operator a rule falls back to when its field changes, not a preselection on create - Docs.
  • Frame: the radius ladder was structurally broken and is now resolved per style - Preview.
  • NumberField: size ladders restored across all 8 styles - .
  • DataGrid: the column resize handle used a non-Tailwind class to suppress text selection during a drag - .
  • Two Button examples imported a hook from a path no installer creates, so they failed to build once installed - .
  • Four example files carried broken class strings and a dead variant - .

v2.5.2 - 1 September, 2026.

New: Data Grid Editing API and Localization.

  • DataGridCellSelection gains apiRef with focusCell(rowId, columnId, { edit }), landing cell focus, DOM focus and aria-activedescendant together on rows still mounting - Docs.
  • Fill handle looks via tableLayout.cellFillHandleVariant: the default solid dot, an Excel-style square, or a Sheets-style hollow ring on the selection corner - Docs.
  • tableClassNames.rowPinned, rowCreate and cellFillHandle override the pinned-row chrome, the add-row affordance and the fill handle - Docs.
  • New getDataGridVisibleSelectedCellCount helper keeps a selection count consistent with the painted range - Docs.
  • The virtual layout renders onRowCreate and appendRow, matching the standard body - Docs.
  • onCellSelectionChange delivers a resolved selection snapshot: the focused cell, every bound, the active bound and the visible cell count - Docs.
  • Per-row editability: cellEdit.editable accepts a function of the row, locking rows across paste, fill, clear and the editors - Docs.
  • New invertDataGridCellsChange helper derives the undo batch from any onCellsChange payload - .
  • The imperative api gains clearSelection and scrollToCell, and the add-row label is localizable via rowCreateLabel - .
  • Copy and cut now work from the keyboard on every platform: Cmd/Ctrl+C and X write through the async clipboard API, since browsers never fire a native copy for a focused grid - .
  • Opt-in single-click editing via tableLayout.cellEditMode: "click"; double-click stays the default - .
  • The selection edge beside a pinned column is painted once, inside the cell, so browser zoom and fractional widths can no longer double it into a 2px blur - .
  • In-cell controls follow the two-step gesture: the first click on an unfocused cell only focuses it, the second activates the select, date or combobox, matching editor cells - .
  • Pinned columns now show the row hover and selected tints, premixed over their opaque background - .
  • Selected rows no longer draw the 2px start bar; the checkbox and row tint carry the state - .
  • i18n on DataGrid replaces every built-in string in one place, menu items and aria labels included, with function labels for interpolated copy - .
  • Opt-in column virtualization for DataGridTableVirtual: only the horizontal window of center columns renders, pinned columns stay mounted, with controlled scrollToColumnIndex - .
  • onCellsCopy reports every clipboard write with the copied grid and a cut flag, for toast confirmations - .
  • tableLayout.cellEditEnterAdvance restores the Sheets move-down; an Enter commit now keeps focus on the edited cell by default - .
  • data-cell-control marks a custom widget whose active surface is wider than its buttons, so a press anywhere on it follows the two-step gesture - .
  • 3 new examples: a localized grid with an EN / DE / JA switch, a 36-column virtualized matrix, and a server side paginated grid with a debounced search and a status filter, taking the Data Grid to 34 examples per base - .
  • Server side pagination is documented end to end: pass the server total twice, as rowCount on useTable for the page buttons and as recordCount on DataGrid for the info text - .

Fixes & Improvements:

  • DataGridCellSelection: Sheets-style chrome, with a lighter tint, a solid perimeter that tracks the drag, an unfilled anchor cell and a dashed fill marquee - Preview.
  • DataGridCellSelection: the perimeter's top line is clamped inside the first row, so a sticky header cannot paint over it - Preview.
  • DataGridCellSelection: the perimeter survives the first and last column and the last row, and the fill handle stays inside the grid - Preview.
  • DataGridCellSelection: the built-in editor sits exactly on the cell, so opening it no longer grows the row by 2px, and it is named after its column - Preview.
  • DataGridCellSelection: copy, cut, clear, paste and fill act only on visible rows, so a page-boundary range cannot write hidden ones - Docs.
  • DataGridCellSelection: a fill across columns runs the target's parse and reports rejections, like a paste - Docs.
  • DataGridCellSelection: Shift and arrows still extend a range after a modifier click on a control cell - Docs.
  • DataGridCellSelection: Escape on an in-cell control returns focus to the grid, and AltGr chords type instead of selecting all - Docs.
  • DataGridTable: columnsResizeMode: "onChange" writes widths to the table element, so a drag costs no React render per move - Docs.
  • DataGridTable: pinned header cells stay put under a sticky header, so the corner no longer scrolls away - .
  • DataGridTable: the resize handle is its own data-slot span, so an end-aligned header cannot swallow the menu click - .
  • DataGridTable: aria-rowcount counts pinned extras and aria-multiselectable follows the selection mode - .
  • DataGridTableVirtual: rows and the header row are memoized, so a scroll frame renders only what enters the window - .
  • DataGrid: meta.autoSize columns reflow with the container down to minSize, and leave a dragged width alone - .
  • DataGrid: onRowCreate hands focus to the grid when a draft replaces it, and its click survives a multi-cell selection - .
  • DataGridPagination: the page-size select no longer clips 3-digit sizes, and page buttons carry accessible names - .
  • DataGridTableRowPin: bottom-pinned rows cast their boundary shadow upward - .
  • Combobox: chips in the spreadsheet editing example are outline badges with an avatar and a remove button - .

v2.5.0 - 26 August, 2026.

New: Data Grid Spreadsheet Editing.

  • Cell range selection with drag, Shift and Ctrl ranges and full keyboard navigation, opt-in via tableLayout.cellSelection - Docs.
  • Clipboard copy, cut and paste with Excel and Google Sheets TSV round-trip, including bulk paste across a range - Docs.
  • Fill handle repeats the selection down or right, with a live drag preview - Preview.
  • One batched onCellsChange write contract plus per-column meta.cellEdit parse, format and clear rules - Docs.
  • Notion-style editing flow: built-in text and textarea cell editors via cellEdit.control, opened by Enter, F2, typing or double-click - Docs.
  • Consumer editors keep the same keystrokes through onCellEditRequest for custom controls like selects - Docs.
  • Full spreadsheet keyboard map: Ctrl+Arrows, Home/End, PageUp/PageDown jumps with Shift extension - Docs.
  • ARIA grid semantics: role, row and column indexes, aria-sort, aria-selected and aria-activedescendant tracking for screen readers - Docs.
  • Optional CRUD affordances: an onRowCreate add-row, getRowStatus row tints and getCellStatus corner marks - Docs.
  • One column can absorb the resize filler strip via meta.fillWidth, keeping the grid full-width - Docs.
  • New DataGridSelectionBar shell for bulk edits over row selection - Docs.
  • Works alongside sorting, pagination, resizable and pinned columns; existing grids render byte-identically with the flag off - Docs.

New Components:

  • New spreadsheet editing example: inline editors, a team member combobox, a date picker, quick add-row and a bulk edit bar, taking the Data Grid to 31 examples per base - Preview.

Fixes & Improvements:

  • DataGridTable: cell borders no longer float against the resize filler strip when cellBorder meets columnsResizable - Preview.
  • DataGridTable: resize handles no longer double the header separators when cellBorder is on - Preview.
  • DataGridTable: end-pinned columns resize from their start edge, indicator on the correct side - Preview.
  • DataGridTable: the viewport no longer draws a browser focus outline during keyboard navigation - Preview.
  • DataGridCellSelection: the focused cell ring is a quiet 1px border-tone outline, and the editor keeps text exactly in place - Preview.

v2.4.0 - 25 August, 2026.

New: Shadcn Code Block.

  • New Code Block primitive: Shiki highlighting, a copy button, wrap and expand controls, and per-line action groups - Docs.
  • Streams as tokens arrive, with a caret, stick-to-bottom, and markdown fence splitting for AI chat - Docs.
  • Diffs from props or real git patches via parseUnifiedDiff, plus indentation-based code folding in any language - Preview.
  • Server rendering with no client bundle, no WebAssembly, and no 'wasm-unsafe-eval' in your CSP - Docs.
  • Theming via github-light / github-dark, any shiki theme, or --code-token-* design tokens - Docs.
  • 27 examples per base, taking the registry to 22 primitives - Preview.

Gantt dependencies and milestones:

  • Finish-to-start dependency arrows drawn from each event's dependencies, off with dependencyLines={false} - Docs.
  • Zero-duration events render as milestone diamonds - Preview.

Fixes & Improvements:

  • Component docs pages paint sooner, and their first preview reserves its height instead of growing from a spinner - Docs.

v2.3.0 - 19 August, 2026.

New component - Cascader:

  • A nested multi-level combobox with drill-down navigation, breadcrumbs, search and custom rows. Three modes from one state machine: drill (default), columns and tree - Docs.
  • Selection is opt-in per level. Pressing a branch NAVIGATES rather than selects until selectable="any", so a parent is never chosen by accident on the way to its children - Docs.
  • Async levels come from getChildren rather than from mutating items, so a lazily loaded tree needs no local copy of the data - Docs.
  • 20 examples across both twins, covering multi-select with a selection cap, indeterminate branches, inline tree expansion, footers and virtualized lists - Preview.

Filters rebuilt:

  • The value is now ONE FilterQuery tree rather than an array of chips. Seed it with createFilterQuery(), read it with flattenFilterConditions, and drive it through query / onQueryChange or uncontrolled defaultQuery - Docs.
  • variant picks the chrome: basic for the chip bar, advanced for the builder panel (advancedMode popover or inline). Both edit the same tree - Docs.
  • The builder edits values in the row itself for text and number, and reserves popovers for lists and ranges - Preview.

Breaking changes:

  • The pre-rewrite Filters props are gone. filters / onChange and createFilter() no longer exist; use query / onQueryChange and createFilterQuery() - Docs.

Fixes & Improvements:

  • Component docs previews now render inside an iframe and mount only when scrolled into view. A page with dozens of live examples used to mount all of them at once, which was the slowest thing about browsing the component pages - Preview.
  • Filters drag and drop keeps the dragged row readable instead of fading it almost to nothing, and the drop indicator lines up with the row it will land beside - Preview.
  • Choosing an attribute in the Filters chip hands off to the condition menu without the field picker flashing behind it, and the value menu now opens aligned to the value segment on the first open - Preview.

v2.2.0 - 5 August, 2026.

Data Grid on TanStack Table v9:

  • The Data Grid now runs on TanStack Table v9. Tables are created with useTable({ features: dataGridFeatures }), so there is no more per-table getCoreRowModel / getSortedRowModel / getFilteredRowModel / getPaginationRowModel wiring - Docs.
  • New public surface on the installed primitive: the ready-made dataGridFeatures bundle, plus the DataGridFeatures, DataGridTableInstance, DataGridColumnMeta and DataGridLayoutProps types - Docs.
  • Installing the Data Grid no longer widens TanStack's ColumnMeta for every other table in your app. The global module augmentation is gone, replaced by a DataGridColumnMeta interface wired through the bundle's columnMeta slot - Docs.
  • The React Compiler opt-out is no longer the default. "use no memo" came out of 78 registry files; the primitive reads state through TanStack's Subscribe instead, and the few examples that still need it each carry a comment saying why - Preview.
  • All 30 Data Grid examples, plus the two Filters examples that drive a grid, were updated for v9 in both the Base UI and Radix twins - .

Breaking changes:

  • The Data Grid now needs @tanstack/react-table v9 in your project. The docs ship a copy-paste migration prompt that walks a coding agent through the whole port - Docs.
  • Column pinning moved from left / right to start / end. That covers initialState.columnPinning, column.pin() and getIsPinned(), and the emitted data-pinned, data-last-col and data-outer-pinned-col attributes. CSS selecting [data-pinned="left"] needs updating to [data-pinned="start"] - Docs.
  • DataGridProps takes a leading TFeatures generic, useDataGrid is generic, and the sub-component prop types are feature-parameterized. VisibilityState is now ColumnVisibilityState - .

Fixes & Improvements:

  • Row drag and drop holds the other rows still instead of sliding them apart, and marks the destination with an indicator bar. New dropIndicator prop, on by default - Preview.
  • The row drag clone is portalled to the document body and measured to the row it was lifted from, so it stays under the pointer inside containers that create a fixed-position containing block - Preview.
  • Columns marked meta.autoSize stay resizable. A width you drag by hand is no longer overwritten by the next viewport measurement - Preview.
  • Column resizing draws a full-height indicator at the pointer, exposed as data-slot="data-grid-table-resize-indicator" for styling - Preview.
  • The Icon Tile corner radius now scales with the tile instead of using one flat value, so the softer styles no longer render their xs and sm sizes as full circles - Preview.

v2.1.8 - 2 August, 2026.

Features:

  • Data Grid tree rows with recursive sub-rows at any depth, and a row expand toggle that supplies per-level indentation - Preview.
  • Tree rows work with every existing Data Grid feature: sorting keeps subtrees attached to their parents, pinned and resizable columns keep the indent intact, and virtualization treats expanded children as ordinary rows - Docs.
  • Cross-parent row drag and drop in tree grids, with drop indicators and depth guides through renderRowDecoration - Docs.
  • 1 new Data Grid tree rows component added - Preview.

v2.1.7 - 29 July, 2026.

Fixes & Improvements:

  • Data Grid component improvements - Preview.
  • Event Calendar component improvements - Preview.
  • Gantt component improvements - Preview.

v2.1.6 - 24 July, 2026.

Features:

  • New Icon Tile component with five surface variants (outline, elevated, soft, solid, frame) - Preview.
  • 16 new Icon Tile components added - Preview.

v2.1.5 - 22 July, 2026.

Features:

  • New Event Calendar component with month, week, day, N-day and agenda views, drag-and-drop scheduling, recurring events, and time zones - Preview.
  • 5 new Event Calendar components added - Preview.
  • New Gantt component with split tree and timeline panes, day to year scales, zoom, drag and resize scheduling, and summary rollups - Preview.
  • 5 new Gantt components added - Preview.
  • 3 new Filters components added - Preview.
  • 1 new Kanban component added - Preview.
  • 1 new Sortable component added - Preview.

Fixes & Improvements:

  • Component category thumbnails no longer stall on a loading spinner when a screenshot is missing.

v2.0.1 - 17 March, 2026.

Features:

  • 20 new Input Group components added - Preview.
  • 10 new Button Group components added - Preview.
  • 5 new Card components added - Preview.
  • 5 new Dropdown Menu components added - Preview.
  • 6 new Data Grid components added - Preview.
  • Data Grid Tanstack Virtualization added - Preview.
  • Data Grid Row Pinning added - Preview.

Fixes & Improvements:

  • Sortable component improvements for Mobile devices - Preview.
  • Kanban component improvements for Mobile devices - Preview.
  • Incorrect Filters component input height in small size.. Preview.

v1 - Legacy

  • Full ReUI v1 changelog - Preview.
cn package
Docs
Docs
Docs
Changelog
Docs
Preview
Preview
Preview
Preview
Docs
Docs
Docs
Docs
Preview
Docs
Preview
Preview
Docs
Docs
Docs
Docs
Docs
Preview
Docs
Preview
Docs
Preview
Docs
Docs
Docs
Docs
Docs
Preview
Preview
Docs