Utilidades para formatear fechas. Se instala en lib/enlolab/.

Componente

registry/lib/utils/format-date.ts

/**
 * Formatea una fecha en formato legible
 * 
 * @param date - La fecha a formatear (Date, string o number)
 * @param locale - El locale a usar (default: 'es-ES')
 * @returns La fecha formateada
 * 
 * @example
 * ```ts
 * formatDate(new Date()) // "15/11/2024"
 * formatDate(new Date(), 'en-US') // "11/15/2024"
 * ```
 */
export function formatDate(
  date: Date | string | number,
  locale: string = 'es-ES'
): string {
  const dateObj = typeof date === 'string' || typeof date === 'number'
    ? new Date(date)
    : date

  return new Intl.DateTimeFormat(locale, {
    year: 'numeric',
    month: '2-digit',
    day: '2-digit',
  }).format(dateObj)
}

/**
 * Formatea una fecha con hora
 * 
 * @param date - La fecha a formatear
 * @param locale - El locale a usar (default: 'es-ES')
 * @returns La fecha y hora formateada
 */
export function formatDateTime(
  date: Date | string | number,
  locale: string = 'es-ES'
): string {
  const dateObj = typeof date === 'string' || typeof date === 'number'
    ? new Date(date)
    : date

  return new Intl.DateTimeFormat(locale, {
    year: 'numeric',
    month: '2-digit',
    day: '2-digit',
    hour: '2-digit',
    minute: '2-digit',
  }).format(dateObj)
}

Instalación

Para instalar este componente, primero configura el registry en tu components.json:

{
  "registries": {
    "@enlolab": {
      "url": "https://ui.enlolab.com/r/{name}.json",
      "headers": {
        "Authorization": "Bearer ${REGISTRY_TOKEN}"
      }
    }
  }
}

Luego instala el componente:

npx shadcn@latest add @enlolab/format-date