Julius UI

Julius UI is a modern, lightweight React component library built with Tailwind CSS and TypeScript — designed to accelerate development with beautiful, flexible UI components.

✨ Features

• 🧩 Pre-built components: Button, Input, Textarea, Select, Checkbox, Card, etc.
• 🎨 Tailwind-powered styling with built-in variant support
• ⚙️ Fully typed with TypeScript
• 🤝 Works seamlessly with react-hook-form
• 🔧 Easy to extend and customize

📦 Installation

Install the package via NPM:

npm install julius-ui
# or
yarn add julius-ui

If using locally via monorepo:

npm install ../julius-ui

📚 Usage

import React from "react";
import { Card, Input, Button } from "julius-ui";

function ExampleForm() {
  return (
    <Card className="max-w-md mx-auto p-4" variant="outlined">
      <Input placeholder="Your Name" variant="default" />
      <Button variant="primary">Submit</Button>
    </Card>
  );
}

🧪 Components

| Component | Description | Variants | |----------|-------------------------|---------------------------------------| | Button | Basic and styled button | primary, secondary, ghost, outline | | Input | Form input field | default, outline, etc. | | Textarea | Multiline input | default, outline, etc. | | Select | Dropdown select | default | | Checkbox | Checkbox input | default | | Card | Wrapper container | elevated, outlined, ghost |

All components accept className and ref.

🛠 Development

Clone and build locally:

git clone https://github.com/your-username/julius-ui.git
cd julius-ui
npm install
npm run build

Link locally:

npm link
# in your Next.js project
npm link julius-ui

🚀 Publish

To release a new version:

npm version patch|minor|major
npm publish

Ensure you're logged in:

npm login

📄 License

MIT — © Julius Legaspi