- Add clsx, tailwind-merge, class-variance-authority dependencies - Add Radix UI primitives (dialog, dropdown-menu, label, select, tabs, toast, slot) - Add lucide-react for icons - Create components.json for shadcn/ui configuration - Create lib/utils.ts with cn(), formatCurrency(), formatDate(), formatTime() - Create Button component with variants (default, destructive, outline, secondary, ghost, link, accent) - Create Input component with focus ring styling - Create Card components (Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
46 lines
1.1 KiB
TypeScript
46 lines
1.1 KiB
TypeScript
import { clsx, type ClassValue } from "clsx";
|
|
import { twMerge } from "tailwind-merge";
|
|
|
|
/**
|
|
* Merge Tailwind CSS classes with proper precedence
|
|
*/
|
|
export function cn(...inputs: ClassValue[]) {
|
|
return twMerge(clsx(inputs));
|
|
}
|
|
|
|
/**
|
|
* Format a number as Mexican peso currency
|
|
*/
|
|
export function formatCurrency(amount: number): string {
|
|
return new Intl.NumberFormat("es-MX", {
|
|
style: "currency",
|
|
currency: "MXN",
|
|
minimumFractionDigits: 0,
|
|
maximumFractionDigits: 2,
|
|
}).format(amount);
|
|
}
|
|
|
|
/**
|
|
* Format a date in Spanish format (e.g., "15 de enero de 2024")
|
|
*/
|
|
export function formatDate(date: Date | string): string {
|
|
const dateObj = typeof date === "string" ? new Date(date) : date;
|
|
return new Intl.DateTimeFormat("es-MX", {
|
|
day: "numeric",
|
|
month: "long",
|
|
year: "numeric",
|
|
}).format(dateObj);
|
|
}
|
|
|
|
/**
|
|
* Format time in 12-hour format with AM/PM
|
|
*/
|
|
export function formatTime(date: Date | string): string {
|
|
const dateObj = typeof date === "string" ? new Date(date) : date;
|
|
return new Intl.DateTimeFormat("es-MX", {
|
|
hour: "numeric",
|
|
minute: "2-digit",
|
|
hour12: true,
|
|
}).format(dateObj);
|
|
}
|