@wakastellar/ui 4.0.0-dev.0 → 4.0.1

package/src/components/DataTable/formatters/index.ts

@@ -1,335 +0,0 @@
-/**
- * Formatters utilitaires pour le DataTable
- * @module formatters
- */
-
-import { format as formatDate, parseISO, isValid, type Locale } from "date-fns"
-import { fr, enUS } from "date-fns/locale"
-
-// Map des locales date-fns
-const localeMap: Record<string, Locale> = {
-  fr: fr,
-  "fr-FR": fr,
-  en: enUS,
-  "en-US": enUS,
-  "en-GB": enUS,
-}
-
-/**
- * Récupère la locale date-fns à partir d'un code locale
- */
-function getDateFnsLocale(locale?: string): Locale {
-  if (!locale) return fr
-  return localeMap[locale] || fr
-}
-
-/**
- * Parse une valeur en Date
- */
-function parseToDate(value: unknown): Date | null {
-  if (!value) return null
-  if (value instanceof Date) return isValid(value) ? value : null
-  if (typeof value === "string") {
-    // Try ISO format first
-    const isoDate = parseISO(value)
-    if (isValid(isoDate)) return isoDate
-    // Try native Date parsing
-    const nativeDate = new Date(value)
-    if (isValid(nativeDate)) return nativeDate
-  }
-  if (typeof value === "number") {
-    const date = new Date(value)
-    if (isValid(date)) return date
-  }
-  return null
-}
-
-/**
- * Formate une date
- * @param value - Valeur à formater (Date, string ISO, timestamp)
- * @param formatStr - Format de sortie (default: 'PP' = 16 déc. 2025)
- * @param locale - Locale (default: 'fr')
- * @returns Date formatée ou chaîne vide
- * @example formatters.date(new Date(), 'PP', 'fr') // "16 déc. 2025"
- */
-export function date(
-  value: unknown,
-  formatStr = "PP",
-  locale?: string
-): string {
-  const d = parseToDate(value)
-  if (!d) return ""
-  try {
-    return formatDate(d, formatStr, { locale: getDateFnsLocale(locale) })
-  } catch {
-    return ""
-  }
-}
-
-/**
- * Formate une date avec heure
- * @param value - Valeur à formater
- * @param formatStr - Format de sortie (default: 'PPpp')
- * @param locale - Locale
- * @returns Date/heure formatée
- * @example formatters.datetime(new Date()) // "16 déc. 2025, 14:30"
- */
-export function datetime(
-  value: unknown,
-  formatStr = "PPpp",
-  locale?: string
-): string {
-  return date(value, formatStr, locale)
-}
-
-/**
- * Formate une heure
- * @param value - Valeur à formater
- * @param formatStr - Format de sortie (default: 'HH:mm')
- * @param locale - Locale
- * @returns Heure formatée
- * @example formatters.time(new Date()) // "14:30"
- */
-export function time(
-  value: unknown,
-  formatStr = "HH:mm",
-  locale?: string
-): string {
-  return date(value, formatStr, locale)
-}
-
-/**
- * Formate une valeur monétaire
- * @param value - Valeur numérique
- * @param currencyCode - Code devise (default: 'EUR')
- * @param locale - Locale (default: 'fr-FR')
- * @param options - Options Intl.NumberFormat additionnelles
- * @returns Valeur formatée
- * @example formatters.currency(1234.56, 'EUR', 'fr-FR') // "1 234,56 €"
- */
-export function currency(
-  value: unknown,
-  currencyCode = "EUR",
-  locale = "fr-FR",
-  options?: Partial<Intl.NumberFormatOptions>
-): string {
-  if (value == null || value === "") return ""
-  const num = typeof value === "number" ? value : parseFloat(String(value))
-  if (isNaN(num)) return ""
-
-  try {
-    return new Intl.NumberFormat(locale, {
-      style: "currency",
-      currency: currencyCode,
-      ...options,
-    }).format(num)
-  } catch {
-    return String(num)
-  }
-}
-
-/**
- * Formate un pourcentage
- * @param value - Valeur (0-100 ou 0-1)
- * @param decimals - Nombre de décimales (default: 0)
- * @param isDecimal - Si true, value est entre 0 et 1
- * @returns Pourcentage formaté
- * @example formatters.percentage(42.5) // "42.5%"
- * @example formatters.percentage(0.425, 1, true) // "42.5%"
- */
-export function percentage(
-  value: unknown,
-  decimals = 0,
-  isDecimal = false
-): string {
-  if (value == null || value === "") return ""
-  const num = typeof value === "number" ? value : parseFloat(String(value))
-  if (isNaN(num)) return ""
-
-  const pct = isDecimal ? num * 100 : num
-  return `${pct.toFixed(decimals)}%`
-}
-
-/**
- * Formate un nombre
- * @param value - Valeur numérique
- * @param locale - Locale (default: 'fr-FR')
- * @param options - Options Intl.NumberFormat
- * @returns Nombre formaté
- * @example formatters.number(1234567.89, 'fr-FR') // "1 234 567,89"
- */
-export function number(
-  value: unknown,
-  locale = "fr-FR",
-  options?: Intl.NumberFormatOptions
-): string {
-  if (value == null || value === "") return ""
-  const num = typeof value === "number" ? value : parseFloat(String(value))
-  if (isNaN(num)) return ""
-
-  try {
-    return new Intl.NumberFormat(locale, options).format(num)
-  } catch {
-    return String(num)
-  }
-}
-
-/**
- * Formate un numéro de téléphone
- * @param value - Numéro de téléphone
- * @param countryCode - Code pays (default: 'FR')
- * @returns Numéro formaté
- * @example formatters.phone('+33612345678') // "+33 6 12 34 56 78"
- * @example formatters.phone('0612345678', 'FR') // "06 12 34 56 78"
- */
-export function phone(value: unknown, countryCode = "FR"): string {
-  if (!value) return ""
-  const str = String(value).replace(/\s/g, "")
-
-  // Format français
-  if (countryCode === "FR" || str.startsWith("+33")) {
-    // Normaliser le numéro
-    let normalized = str
-    if (str.startsWith("+33")) {
-      normalized = "0" + str.slice(3)
-    } else if (str.startsWith("33")) {
-      normalized = "0" + str.slice(2)
-    }
-
-    // Formater en groupes de 2
-    if (normalized.length === 10) {
-      return normalized.replace(/(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})/, "$1 $2 $3 $4 $5")
-    }
-
-    // Avec indicatif international
-    if (str.startsWith("+33") && str.length === 12) {
-      return str.replace(/(\+33)(\d)(\d{2})(\d{2})(\d{2})(\d{2})/, "$1 $2 $3 $4 $5 $6")
-    }
-  }
-
-  // Format US
-  if (countryCode === "US" || str.startsWith("+1")) {
-    let normalized = str
-    if (str.startsWith("+1")) {
-      normalized = str.slice(2)
-    }
-    if (normalized.length === 10) {
-      return normalized.replace(/(\d{3})(\d{3})(\d{4})/, "($1) $2-$3")
-    }
-  }
-
-  // Format par défaut : groupes de 2-3
-  if (str.length >= 8) {
-    return str.match(/.{1,3}/g)?.join(" ") || str
-  }
-
-  return str
-}
-
-/**
- * Formate une taille en bytes
- * @param value - Taille en bytes
- * @param decimals - Nombre de décimales (default: 2)
- * @returns Taille formatée (KB, MB, GB, etc.)
- * @example formatters.bytes(1048576) // "1 MB"
- * @example formatters.bytes(1536, 1) // "1.5 KB"
- */
-export function bytes(value: unknown, decimals = 2): string {
-  if (value == null || value === "") return ""
-  const num = typeof value === "number" ? value : parseFloat(String(value))
-  if (isNaN(num)) return ""
-  if (num === 0) return "0 Bytes"
-
-  const k = 1024
-  const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"]
-  const i = Math.floor(Math.log(num) / Math.log(k))
-  const size = sizes[Math.min(i, sizes.length - 1)]
-
-  return `${parseFloat((num / Math.pow(k, i)).toFixed(decimals))} ${size}`
-}
-
-/**
- * Formate un texte tronqué
- * @param value - Texte
- * @param maxLength - Longueur max (default: 50)
- * @param suffix - Suffixe de troncature (default: '...')
- * @returns Texte tronqué
- */
-export function truncate(
-  value: unknown,
-  maxLength = 50,
-  suffix = "..."
-): string {
-  if (!value) return ""
-  const str = String(value)
-  if (str.length <= maxLength) return str
-  return str.slice(0, maxLength - suffix.length) + suffix
-}
-
-/**
- * Récupère les initiales d'un nom
- * @param value - Nom complet
- * @param maxInitials - Nombre max d'initiales (default: 2)
- * @returns Initiales
- * @example formatters.initials("Jean Dupont") // "JD"
- */
-export function initials(value: unknown, maxInitials = 2): string {
-  if (!value) return ""
-  const str = String(value).trim()
-  const words = str.split(/\s+/)
-  return words
-    .slice(0, maxInitials)
-    .map((word) => word.charAt(0).toUpperCase())
-    .join("")
-}
-
-/**
- * Formate un booléen
- * @param value - Valeur booléenne
- * @param trueLabel - Label pour true (default: 'Oui')
- * @param falseLabel - Label pour false (default: 'Non')
- * @returns Label correspondant
- */
-export function boolean(
-  value: unknown,
-  trueLabel = "Oui",
-  falseLabel = "Non"
-): string {
-  if (value == null) return ""
-  return value ? trueLabel : falseLabel
-}
-
-/**
- * Formate du JSON
- * @param value - Valeur à sérialiser
- * @param indent - Indentation (default: 2)
- * @returns JSON formaté
- */
-export function json(value: unknown, indent = 2): string {
-  if (value == null) return ""
-  try {
-    return JSON.stringify(value, null, indent)
-  } catch {
-    return String(value)
-  }
-}
-
-/**
- * Objet contenant tous les formatters
- */
-export const formatters = {
-  date,
-  datetime,
-  time,
-  currency,
-  percentage,
-  number,
-  phone,
-  bytes,
-  truncate,
-  initials,
-  boolean,
-  json,
-}
-
-export default formatters

package/src/components/DataTable/hooks/__tests__/useDataTableEdit.test.ts

@@ -1,239 +0,0 @@
-import { renderHook, act } from "@testing-library/react"
-import { describe, it, expect, vi, beforeEach } from "vitest"
-import { useDataTableEdit } from "../useDataTableEdit"
-import { createTable } from "@tanstack/react-table"
-
-// Mock des données de test
-interface TestData {
-  id: string
-  name: string
-  email: string
-  age: number
-}
-
-const testData: TestData[] = [
-  { id: "1", name: "John Doe", email: "john@example.com", age: 30 },
-  { id: "2", name: "Jane Smith", email: "jane@example.com", age: 25 },
-]
-
-const testColumns = [
-  { accessorKey: "id", header: "ID" },
-  { accessorKey: "name", header: "Name" },
-  { accessorKey: "email", header: "Email" },
-  { accessorKey: "age", header: "Age" },
-]
-
-describe("useDataTableEdit", () => {
-  let table: any
-
-  beforeEach(() => {
-    table = createTable({
-      data: testData,
-      columns: testColumns,
-    })
-  })
-
-  it("should initialize with no editing state", () => {
-    const { result } = renderHook(() => useDataTableEdit(table))
-
-    const [editState] = result.current
-
-    expect(editState.editingRowId).toBeNull()
-    expect(editState.editedData).toEqual({})
-    expect(editState.hasChanges).toBe(false)
-    expect(editState.isDirty).toBe(false)
-  })
-
-  it("should start editing when startEdit is called", () => {
-    const { result } = renderHook(() => useDataTableEdit(table))
-
-    act(() => {
-      const [, actions] = result.current
-      actions.startEdit("1", testData[0])
-    })
-
-    const [editState] = result.current
-
-    expect(editState.editingRowId).toBe("1")
-    expect(editState.editedData).toEqual(testData[0])
-    expect(editState.hasChanges).toBe(false)
-    expect(editState.isDirty).toBe(false)
-  })
-
-  it("should update field when updateField is called", () => {
-    const { result } = renderHook(() => useDataTableEdit(table))
-
-    act(() => {
-      const [, actions] = result.current
-      actions.startEdit("1", testData[0])
-    })
-
-    act(() => {
-      const [, actions] = result.current
-      actions.updateField("name", "John Updated")
-    })
-
-    const [editState] = result.current
-
-    expect(editState.editedData.name).toBe("John Updated")
-    expect(editState.hasChanges).toBe(true)
-    expect(editState.isDirty).toBe(true)
-  })
-
-  it("should cancel editing when cancelEdit is called", () => {
-    const mockOnCancel = vi.fn()
-    const { result } = renderHook(() => 
-      useDataTableEdit(table, { onCancel: mockOnCancel })
-    )
-
-    act(() => {
-      const [, actions] = result.current
-      actions.startEdit("1", testData[0])
-      actions.updateField("name", "John Updated")
-    })
-
-    act(() => {
-      const [, actions] = result.current
-      actions.cancelEdit()
-    })
-
-    const [editState] = result.current
-
-    expect(editState.editingRowId).toBeNull()
-    expect(editState.editedData).toEqual({})
-    expect(mockOnCancel).toHaveBeenCalledWith("1", testData[0])
-  })
-
-  it("should save editing when saveEdit is called", async () => {
-    const mockOnSave = vi.fn().mockResolvedValue(undefined)
-    const { result } = renderHook(() => 
-      useDataTableEdit(table, { onSave: mockOnSave })
-    )
-
-    act(() => {
-      const [, actions] = result.current
-      actions.startEdit("1", testData[0])
-      actions.updateField("name", "John Updated")
-    })
-
-    await act(async () => {
-      const [, actions] = result.current
-      await actions.saveEdit()
-    })
-
-    expect(mockOnSave).toHaveBeenCalledWith("1", { ...testData[0], name: "John Updated" })
-
-    const [editState] = result.current
-    expect(editState.editingRowId).toBeNull()
-    expect(editState.editedData).toEqual({})
-  })
-
-  it("should handle validation errors", () => {
-    const validateField = vi.fn((field, value) => {
-      if (field === "email" && !value.includes("@")) {
-        return "Invalid email"
-      }
-      return null
-    })
-
-    const { result } = renderHook(() => 
-      useDataTableEdit(table, { validateField })
-    )
-
-    act(() => {
-      const [, actions] = result.current
-      actions.startEdit("1", testData[0])
-    })
-
-    act(() => {
-      const [, actions] = result.current
-      actions.updateField("email", "invalid-email")
-    })
-
-    // La validation serait gérée dans le composant DataTableEditCell
-    expect(validateField).toHaveBeenCalledWith("email", "invalid-email")
-  })
-
-  it("should reset edit when resetEdit is called", () => {
-    const { result } = renderHook(() => useDataTableEdit(table))
-
-    act(() => {
-      const [, actions] = result.current
-      actions.startEdit("1", testData[0])
-      actions.updateField("name", "John Updated")
-    })
-
-    act(() => {
-      const [, actions] = result.current
-      actions.resetEdit()
-    })
-
-    const [editState] = result.current
-
-    expect(editState.editedData).toEqual(testData[0])
-    expect(editState.hasChanges).toBe(false)
-  })
-
-  it("should handle auto-save when enabled", async () => {
-    const mockOnSave = vi.fn().mockResolvedValue(undefined)
-    const { result } = renderHook(() => 
-      useDataTableEdit(table, { 
-        onSave: mockOnSave,
-        autoSave: true,
-        autoSaveDelay: 100
-      })
-    )
-
-    act(() => {
-      const [, actions] = result.current
-      actions.startEdit("1", testData[0])
-      actions.updateField("name", "John Updated")
-    })
-
-    // Attendre l'auto-save
-    await act(async () => {
-      await new Promise(resolve => setTimeout(resolve, 150))
-    })
-
-    expect(mockOnSave).toHaveBeenCalled()
-  })
-
-  it("should not save when there are validation errors", async () => {
-    const mockOnSave = vi.fn()
-    const validateField = vi.fn((field, value) => {
-      if (field === "email" && !value.includes("@")) {
-        return "Invalid email"
-      }
-      return null
-    })
-
-    const { result } = renderHook(() => 
-      useDataTableEdit(table, { 
-        onSave: mockOnSave,
-        validateField
-      })
-    )
-
-    act(() => {
-      const [, actions] = result.current
-      actions.startEdit("1", testData[0])
-    })
-
-    // Simuler une erreur de validation
-    act(() => {
-      const [, actions] = result.current
-      actions.updateField("email", "invalid-email")
-    })
-
-    await act(async () => {
-      const [, actions] = result.current
-      try {
-        await actions.saveEdit()
-      } catch (error) {
-        expect(error).toBeDefined()
-      }
-    })
-
-    expect(mockOnSave).not.toHaveBeenCalled()
-  })
-})