v3.0.3

April 17, 2026

Patch release: React Aria Components 1.17 with 90% fewer dependencies, expandable Table rows, Apache 2.0 license, the useTheme hook for Vite and CRA apps, a DOM polymorphic utility for render-prop element swaps, and bug fixes.

Installation

Update to the latest version:

npm i @heroui/styles@latest @heroui/react@latest

pnpm add @heroui/styles@latest @heroui/react@latest

yarn add @heroui/styles@latest @heroui/react@latest

bun add @heroui/styles@latest @heroui/react@latest

Using AI assistants? Simply prompt "Hey Cursor, update HeroUI to the latest version" and your AI assistant will automatically compare versions and apply the necessary changes. Learn more about the HeroUI MCP Server.

What's New

React Aria Components 1.17

This release upgrades React Aria Components to v1.17.0. The highlight: dependency consolidation drops 90% of RAC's transitive dependencies, resulting in faster installs and builds. See the full RAC 1.17 release notes for details.

Expandable Table rows

Table now supports expandable rows for tree-style data. Set a treeColumn and render a chevron in those cells to expand and collapse child rows — perfect for file browsers, nested categories, and hierarchical data.

Name	Type	Date Modified
Documents	Directory	10/20/2025
Project	Directory	8/2/2025
Photos	Directory	2/3/2026

"use client";

import type {Selection} from "@heroui/react";

import {Button, Table, cn} from "@heroui/react";

useTheme hook

For plain React with Vite or Create React App (no Next.js theme provider), import useTheme from @heroui/react. It accepts any theme name ("light", "dark", "brutalism-light", etc.). Pass "system" to follow the OS preference. It persists the value in localStorage, and sets both data-theme and class on <html> to the resolved theme name.

"use client";

import { Button, useTheme } from "@heroui/react";

export function ThemeSwitch() {
  const { theme, setTheme } = useTheme("light");

  return (
    <div className="flex gap-2">
      <Button onPress={() => setTheme("light")}>
        Light
      </Button>
      <Button onPress={() => setTheme("dark")}>
        Dark
      </Button>
      <Button onPress={() => setTheme("system")}>
        System
      </Button>
      <Button onPress={() => setTheme("brutalism-light")}>
        Brutalism Light
      </Button>
      <span className="text-sm opacity-70">Current: {theme}</span>
    </div>
  );
}

DOM polymorphic utility

The DOM polymorphic helper lets lightweight components that are not built on React Aria primitives change their host element through a render prop.

Example: rendering a Card component as <button />

<Card<"button"> render={(props) => <button {...props} />} />

License change

HeroUI is now licensed under the Apache License 2.0, replacing the previous MIT license. Apache 2.0 provides the same permissive freedoms while adding an explicit patent grant for additional legal protection. No action is required from existing users.