"use client";

import { Quantum } from "ldrs/react";
import "ldrs/react/Quantum.css";
import { cn } from "@/lib/utils";

// Indicateur unique de « ça travaille » (règle du 2026-09-01) : un seul spinner dans toute
// l'application, une seule couleur, prise du token `--color-spinner` de `globals.css`.
// Aucun écran ne redéfinit l'animation ni le hex.
//
// `ldrs/react` rend de simples `<div>` stylés par une feuille CSS — pas de custom element,
// pas de `window` au montage : le composant traverse le rendu serveur sans précaution
// particulière. Le `"use client"` est là parce qu'il est toujours utilisé dans des îlots
// interactifs (suivi de job, envoi de fichier, bouton en attente), pas par contrainte du
// paquet.

/** Trois tailles, et pas une de plus — 45 px est le défaut de `ldrs`, gardé tel quel. */
const SIZES = { sm: 18, md: 28, lg: 45 } as const;

export type SpinnerSize = keyof typeof SIZES;

type SpinnerProps = {
  size?: SpinnerSize;
  /** Tours par seconde de l'orbite ; défaut `ldrs`, conservé pour toute l'application. */
  speed?: number;
  className?: string;
  /**
   * Annonce lue par les lecteurs d'écran. Sans elle, le spinner est purement décoratif
   * (`aria-hidden`) — le cas des toasts et des boutons, dont le texte dit déjà l'attente et
   * qui annonceraient sinon deux fois la même chose.
   */
  label?: string;
  /** Convention `base-nova` : place le spinner comme une icône de bouton, pas comme un bloc. */
  "data-icon"?: "inline-start" | "inline-end";
};

export function Spinner({
  size = "lg",
  speed = 1.75,
  className,
  label,
  "data-icon": dataIcon,
}: SpinnerProps) {
  return (
    <span
      role={label === undefined ? undefined : "status"}
      aria-hidden={label === undefined ? true : undefined}
      data-icon={dataIcon}
      className={cn("inline-flex shrink-0 items-center justify-center", className)}
    >
      <Quantum size={SIZES[size]} speed={speed} color="var(--color-spinner)" />
      {label === undefined ? null : <span className="sr-only">{label}</span>}
    </span>
  );
}