Ethiopian Date Picker (ShadCN Styled)

A modern, lightweight, and customizable Ethiopian calendar date picker built with React, ShadCN/UI, Tailwind CSS, and kenat.

📅 Supports Ethiopian & Gregorian calendar views
🎨 Beautifully styled using ShadCN components
⚡️ Fast and fully typed with TypeScript
📦 Easy to integrate in any React/Next.js app

✨ Features

• Ethiopian and Gregorian calendar dual display
• Styled with Tailwind + ShadCN
• Easily navigable by month
• Lightweight, dependency-aware
• Simple integration into any React or Nextjs project

📦 Installation

npm install ethiopian-datepicker-shadcn

or

yarn add ethiopian-datepicker-shadcn

🚀 Usage

import React, { useState } from 'react';
import { EthiopianDatePicker } from 'ethiopian-datepicker-shadcn';

function App() {
  const [selectedDate, setSelectedDate] = useState(null);

  return (
    <div className="p-4">
      <EthiopianDatePicker
        value={selectedDate || undefined}
        onChange={(date) => {
          setSelectedDate(date);
          console.log('Selected Ethiopian Date:', date);
        }}
        useGeez={false}
      />
    </div>
  );
}

☝️ Ensure your app is already configured to use Tailwind CSS and ShadCN components.

🧱 Props

| Prop | Type | Description | |------------|-----------|---------------------------------------------| | value | object | Current selected date (Ethiopian or null) | | onChange | function| Callback when a date is selected | | useGeez | boolean | makes the number format in Ge'ez (Amharic) | | includeGregorian | boolean | includes gregorian format |

🖼 Screenshot light mode view

🔧 Tailwind Setup (if not yet installed)

Make sure your project is Tailwind-enabled. If not:

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

Add to your tailwind.config.js:

content: ["./src/**/*.{js,ts,jsx,tsx}"]

Add to index.css:

@tailwind base;
@tailwind components;
@tailwind utilities;

🙏 Credits

• Calendar logic powered by kenat
• UI components by ShadCN UI
• Icons by Lucide

📄 License

MIT License © 2025 Henaorth16