📦 Dokumentasi Library Mie Ayam

Selamat datang di dokumentasi Mie Ayam, sebuah UI library React lucu + interaktif dengan nuansa mie ayam 🍜. Library ini dibuat dengan Vite + React + TailwindCSS agar gampang dipakai di project lain.

🚀 Instalasi

Untuk install library ini lewat npm:

npm install mie-ayam

Atau pake yarn:

yarn add mie-ayam

Atau pake pnpm:

pnpm add mie-ayam

⚡ Cara Pakai di Project Lain

1. Pastikan project sudah React + Vite (atau framework lain yang support React).
2. Import komponen dari mie-ayam langsung di file React kamu.

Contoh Pemakaian

import React from 'react'
import { Navbar, Card, Button, Product } from 'mie-ayam'
import 'mie-ayam/dist/style.css' // pastikan style ikut di-import

export default function App() {
  return (
    <div className="min-h-screen bg-amber-50">
      {/* Navbar */}
      <Navbar />

      {/* Card + Button */}
      <div className="flex justify-center items-center py-10">
        <Card>
          <h2 className="text-xl font-bold">🍜 Spesial Mie Ayam</h2>
          <Button onClick={() => alert('Mie Ayam dipesan!')}>Pesan Sekarang</Button>
        </Card>
      </div>

      {/* Product Polosan 4D */}
      <div className="flex justify-center items-center py-20">
        <Product />
      </div>
    </div>
  )
}

🛠️ Komponen yang Tersedia

• Navbar → Navbar polosan aesthetic 🍜
• Card → Kartu interaktif simple
• Button → Tombol lucu ala mie ayam
• Product → Kartu kosong 4D glass (cocok buat showcase produk)

🎯 Tujuan

Library ini dibuat biar developer lain gampang pake tanpa pusing konfigurasi. Tinggal install → import → langsung jalan. Udah include styling interaktif bawaan.

📌 Tips

• Bisa dikombinasiin sama komponen custom lo.
• Semua komponen udah support Tailwind utility classes → gampang di-custom.

🍜 Selamat ngoding, semoga project lo makin gurih kayak mie ayam spesial! ✨