نصب

مراحل ساده برای نصب و راه‌اندازی فارسی یو آی در پروژه

پیش‌نیازها

  • Node.js نسخه 18 یا بالاتر
  • پروژه Next.js با App Router
  • Tailwind CSS v4

۱. نصب وابستگی‌ها

npm install @radix-ui/react-slot class-variance-authority clsx tailwind-merge

۲. پیکربندی فونت Vazirmatn

فایل app/layout.tsx را به شکل زیر ویرایش کنید:

import { Vazirmatn } from "next/font/google"

const vazirmatn = Vazirmatn({ subsets: ["arabic"] })

export default function RootLayout({ children }) {
  return (
    <html lang="fa" dir="rtl">
      <body className={vazirmatn.className}>
        {children}
      </body>
    </html>
  )
}

۳. افزودن تابع cn

فایل lib/utils.ts را ایجاد کنید:

import { clsx, type ClassValue } from "clsx"
import { twMerge } from "tailwind-merge"

export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
}

۴. کپی کامپوننت‌ها

کامپوننت‌های مورد نیاز را از بخش مستندات کپی کرده و در پوشه components/ui قرار دهید.