DEV Community

Cover image for Continuing PrimeReact v10: Introducing Mantle UI
Sven Jansen
Sven Jansen

Posted on

Continuing PrimeReact v10: Introducing Mantle UI

#react #javascript #webdev #news

When the original PrimeReact repository was archived, many teams using PrimeReact v10 were left with an uncertain path forward.

The existing MIT-licensed code remained available, but active open-source development had effectively stopped. Applications built on PrimeReact v10 still needed bug fixes, accessibility improvements, documentation updates, and compatibility with the evolving React ecosystem.

That is why we started Mantle UI.

What is Mantle UI?

Mantle UI is an independent, community-maintained continuation of the MIT-licensed PrimeReact v10 codebase.

The goal is not to create an unrelated component library from scratch. Mantle UI exists to provide existing PrimeReact v10 users with a practical and sustainable open-source path forward.

The project preserves the familiar APIs, components, theming concepts, and development model while continuing maintenance in the open.

Mantle UI is not affiliated with PrimeTek, PrimeReact, or ngrok.

Why continue PrimeReact v10?

PrimeReact v10 is used in many existing applications. Replacing an entire UI component library is rarely a small task.

Teams may depend on:

  • component APIs and behavior
  • existing themes and styles
  • accessibility behavior
  • custom passthrough configuration
  • application-specific wrappers
  • years of accumulated implementation knowledge

For these projects, migrating to a completely different library can be expensive and risky.

Mantle UI aims to reduce that risk by continuing from the established PrimeReact v10 foundation.

Available on npm

Mantle UI is already published on npm as @mantle-ui/react.

Install it with:

npm install @mantle-ui/react
Enter fullscreen mode Exit fullscreen mode

It is also available through other package managers:

pnpm add @mantle-ui/react
yarn add @mantle-ui/react
bun add @mantle-ui/react
Enter fullscreen mode Exit fullscreen mode

Components can be imported individually:

import { Button } from '@mantle-ui/react/button';

export default function Example() {
    return <Button label="Mantle UI" />;
}
Enter fullscreen mode Exit fullscreen mode

Migrating from PrimeReact

Mantle UI includes a migration CLI that rewrites source imports from primereact to @mantle-ui/react.

After installing Mantle UI, preview the migration first:

npm exec mantleui migrate -- --dry-run
Enter fullscreen mode Exit fullscreen mode

Apply the migration with:

npm exec mantleui migrate
Enter fullscreen mode Exit fullscreen mode

The CLI is also available with pnpm and Yarn:

pnpm exec mantleui migrate
yarn mantleui migrate
Enter fullscreen mode Exit fullscreen mode

It can also be run directly from the published package without installing it first:

npx --package @mantle-ui/react mantleui migrate
Enter fullscreen mode Exit fullscreen mode

The migration updates source imports only. It does not modify package.json or lockfiles.

You should always review the generated changes and test your application before deploying them.

What has been done so far?

Mantle UI has already published multiple releases.

Recent improvements include:

  • improved keyboard navigation in MultiSelect
  • an accessible name for ListBox
  • support for ReactNode tooltip content
  • restored negative input support in InputNumber
  • improved AutoComplete support inside IconField
  • preserved Tailwind classes in passthrough configuration
  • corrected Calendar navigation across overlay rows
  • fixes for documentation examples and API documentation
  • package version metadata for subpackages
  • removal of remaining PrimeReact and PrimeTek branding
  • automated npm publishing and release infrastructure

Several of these changes resolve issues inherited from the PrimeReact v10 backlog.

The project is therefore not only preserving the old codebase. It is actively fixing and improving it.

Current priorities

Our current focus includes:

  • maintaining compatibility for existing PrimeReact v10 users
  • reviewing and resolving inherited issues
  • fixing long-standing bugs
  • improving accessibility
  • keeping the library compatible with the modern React ecosystem
  • improving documentation and migration guidance
  • building a sustainable contributor community

Community-driven development

Mantle UI is developed openly on GitHub.

Users can report bugs, propose improvements, ask questions, and contribute changes. Technical decisions are made in the interest of the project and its community rather than being tied to the roadmap of a single company.

Financial contributions do not provide control over the project roadmap, governance, licensing, or technical direction.

Funding and sustainability

Mantle UI is available through Open Collective and is fiscally hosted by the Open Source Collective.

Funding may support:

  • ongoing development and maintenance
  • bug fixes
  • accessibility improvements
  • documentation
  • infrastructure and hosting
  • contributor work
  • community initiatives

Project contributions and expenses are managed transparently through Open Collective.

Links

We would value your feedback

We are especially interested in hearing from teams that still use PrimeReact v10.

Useful feedback includes:

  • whether the migration CLI works correctly in your project
  • compatibility issues you encounter
  • inherited bugs that are still relevant
  • accessibility problems
  • missing documentation
  • components or workflows that need particular attention

You can try the migration without changing any files:

npx --package @mantle-ui/react mantleui migrate --dry-run
Enter fullscreen mode Exit fullscreen mode

Mantle UI is still at the beginning of its journey, but the foundation is available today, releases are being published, and development is continuing in the open.

Top comments (0)