Oihana Next UI

A modular Next.js UI component library built with React 19, Tailwind CSS v4 and DaisyUI v5.

Features

• ⚛️ React 19 + Next.js 16
• 🎨 Tailwind CSS v4 + DaisyUI v5
• 🌙 Dark mode support (flash-free)
• 📱 PWA ready
• ♿ Accessible components
• 🧩 Composable and themeable

Installation

bun add oihana-next-ui
# or
npm install oihana-next-ui

Requirements

{
  "react":     "^19.0.0",
  "react-dom": "^19.0.0",
  "next":      "^16.0.0"
}

Usage

import Picture   from 'oihana-next-ui/components/images/Picture'
import Button    from 'oihana-next-ui/components/Button'
import useThemes from 'oihana-next-ui/contexts/themes/useThemes'

CSS

Some components require their stylesheet to be imported explicitly :

/* Spinner styles */
@import 'oihana-next-ui/components/spinners/styles/battery.css';

Tailwind CSS v4 plugins

With Tailwind CSS v4, plugins are registered directly in your CSS file :

/* globals.css */
@import 'tailwindcss' ;

/* Oihana background patterns plugin */
@plugin 'oihana-next-ui/themes/plugins/background-patterns/index' ;

/* Oihana pattern craft plugin */
@plugin 'oihana-next-ui/themes/plugins/pattern-craft/index' ;

DaisyUI Catppuccin theme

/* globals.css */
@import 'oihana-next-ui/themes/daisyui/catppuccin.css' ;

Development

Clone the repo and start the demo app :

git clone https://github.com/BcommeBois/oihana-next-ui
cd oihana-next-ui
bun install
bun dev

Open http://localhost:3666 to browse the component demos.

Built with

• Next.js — React framework for production
• React — UI library
• Tailwind CSS — Utility-first CSS framework
• DaisyUI — Component library for Tailwind CSS
• VEGAS Core JS — A set of libraries writing in Javascript and based on the ES6 standard.
• React Icons — Popular icon packs as React components
• Motion — Animation library
• Maskito — Input masking library
• Day.js — Lightweight date library
• Chroma.js — Color manipulation library

Release

The package publishes the raw src/ tree (no build step) — see the files and exports fields in package.json.

Versioning

This project follows Semantic Versioning — MAJOR.MINOR.PATCH (e.g. 1.2.3).

| Type | Command | Example | When to use | |-------|-------------------------|---------------------|-----------------------------------------------| | Patch | bun run release:patch | 0.1.46 → 0.1.47 | Bug fix, small tweak | | Minor | bun run release:minor | 0.1.46 → 0.2.0 | New component or feature, backward compatible | | Major | bun run release:major | 0.1.46 → 1.0.0 | Breaking change |

Prerequisites

• Logged in to npm — npm whoami should print your username (otherwise npm login).
• A git remote named origin-ssh configured (the release script pushes there with --follow-tags).
• A clean working tree, ideally — release:* will otherwise commit any pending change as chore: prepare release before bumping the version.

Patch release walkthrough — e.g. 0.1.46 → 0.1.47

1. Update CHANGELOG.md — add a new section under [Unreleased] with the new version and date :

   ## [0.1.47] — 2026-04-27
   
   **Components**
   - `XYZ` — what changed and why.

2. Run the release script :

   bun run release:patch

   What happens, in order — all of this is automatic :

   1. stage — commits any pending change as chore: prepare release (skipped if the working tree is clean).
   2. npm version patch — bumps 0.1.46 → 0.1.47 in package.json.
   3. version script (auto-run by npm version) :
      • inject-version writes the new version into src/version.js and public/sw.js,
      • generate-exports refreshes the exports field in package.json,
      • then stages src/version.js, public/sw.js and package.json for the version commit.
   4. npm version creates the release commit (0.1.47) and the matching git tag.
   5. postversion script (auto-run by npm version) → release :
      • npm publish --access public publishes to npm,
      • git push origin-ssh --follow-tags pushes the commit and the tag to GitHub.

Manual / pre-release version

Set a specific version manually — version + postversion still run as above :

npm version 1.0.0

Pre-release versions :

npm version prerelease --preid=alpha   # 0.1.46 → 0.1.47-alpha.0
npm version prerelease --preid=beta    # 0.1.46 → 0.1.47-beta.0
npm version prerelease --preid=rc      # 0.1.46 → 0.1.47-rc.0

License

Mozilla Public License 2.0 — © Marc Alcaraz