npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

@heroui/codemod

v1.3.0

Published

HeroUI Codemod provides transformations to help migrate your codebase from NextUI to HeroUI

Readme

The CLI provides a comprehensive suite of tools to migrate your codebase from NextUI to HeroUI.

Quick Start

Note: The heroui CLI requires Node.js 18.17.x or later

Note: If running in monorepo, you need to run the command in the root of your monorepo

You can start using @heroui/codemod in one of the following ways:

Npx

npx @heroui/codemod@latest

Global Installation

npm install -g @heroui/codemod

Usage

Usage: @heroui/codemod [command]

A CLI tool for migrating your codebase to heroui

Arguments:
  codemod                Specify which codemod to run
                         Codemods: import-heroui, package-json-package-name, heroui-provider, tailwindcss-heroui, css-variables, npmrc

Options:
  -v, --version          Output the current version
  -d, --debug            Enable debug mode
  -h, --help             Display help for command
  -f, --format           Format the affected files with Prettier

Commands:
  migrate [projectPath] Migrate your codebase to use heroui

Codemod Arguments

import-heroui

Updates all import statements from @nextui-org/* packages to their @heroui/* equivalents.

heroui-codemod import-heroui

Example:

  1. import { Button } from "@nextui-org/button" to import { Button } from "@heroui/button"

package-json-package-name

Updates all package names in package.json from @nextui-org/* to @heroui/*.

heroui-codemod package-json-package-name

Example:

  1. @nextui-org/button: x.xx.xxx to @heroui/button: x.xx.xxx

heroui-provider

Migrate NextUIProvider to HeroProvider.

heroui-codemod heroui-provider

Example:

  1. import { NextUIProvider } from "@nextui-org/react" to import { HeroProvider } from "@heroui/react"

  2. <NextUIProvider>...</NextUIProvider> to <HeroProvider>...</HeroProvider>

tailwindcss-heroui

Migrate all the tailwind.config.(j|t)s file to use the @heroui package.

heroui-codemod tailwindcss-heroui

Example:

  1. const {nextui} = require('@nextui-org/theme') to const {heroui} = require('@heroui/theme')

  2. plugins: [nextui({...})] to plugins: [heroui({...})]

  3. content: ['./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}'] to content: ['./node_modules/@heroui/theme/dist/**/*.{js,ts,jsx,tsx}']

  4. var(--nextui-primary-500) to var(--heroui-primary-500)

css-variables

Migrate all the css variables in the file starting with --nextui- to --heroui-.

heroui-codemod css-variables

Example:

  1. className="text-[var(--nextui-primary-500)]" to className="text-[var(--heroui-primary-500)]"

npmrc (Pnpm only)

Migrate the .npmrc file to use the @heroui package.

heroui-codemod npmrc

Example:

  1. public-hoist-pattern[]=*@nextui-org/theme* to public-hoist-pattern[]=*@heroui/theme*

Migrate Command

Migrate your entire codebase from NextUI to heroui. You can choose which codemods to run during the migration process.

heroui-codemod migrate [projectPath] [--format]

Example:

heroui-codemod migrate ./my-nextui-app

Output:

heroui Codemod v0.0.1

┌   Starting to migrate nextui to heroui
│
◇  1. Migrating "package.json"
│
◇  Do you want to migrate package.json?
│  Yes
│
◇  Migrated package.json
│
◇  2. Migrating import "nextui" to "heroui"
│
◇  Do you want to migrate import nextui to heroui?
│  Yes
│
◇  Migrated import nextui to heroui
│
◇  3. Migrating "NextUIProvider" to "HeroUIProvider"
│
◇  Do you want to migrate NextUIProvider to HeroUIProvider?
│  Yes
│
◇  Migrated NextUIProvider to HeroUIProvider
│
◇  4. Migrating "tailwindcss"
│
◇  Do you want to migrate tailwindcss?
│  Yes
│
◇  Migrated tailwindcss
│
◇  5. Migrating "css variables"
│
◇  Do you want to migrate css variables?
│  Yes
│
◇  Migrated css variables
│
◇  6. Migrating "npmrc" (Pnpm only)
│
◇  Do you want to migrate npmrc (Pnpm only) ?
│  Yes
│
◇  Migrated npmrc
│
└  ✅ Migration completed!

Community

We're excited to see the community adopt NextUI CLI, raise issues, and provide feedback. Whether it's a feature request, bug report, or a project to showcase, please get involved!

Contributing

Contributions are always welcome!

See CONTRIBUTING.md for ways to get started.

Please adhere to this project's CODE_OF_CONDUCT.

License

MIT