fix: Améliorer calculatrice - corriger focus trap et affichage icône

This commit is contained in:
odentas 2025-10-20 13:59:24 +02:00
parent 533fdc29c6
commit ed8bc7c156
3 changed files with 8 additions and 3 deletions

View file

View file

@ -139,6 +139,11 @@ export default function Calculator({ isOpen, onClose, onUseResult }: CalculatorP
if (!isOpen) return;
const handleKeyDown = (e: KeyboardEvent) => {
// Vérifier que le focus est sur la calculatrice ou ses enfants
if (calculatorRef.current && !calculatorRef.current.contains(document.activeElement)) {
return; // Ignorer si le focus n'est pas sur la calculatrice
}
// Empêcher le comportement par défaut pour les touches de la calculatrice
if (['0','1','2','3','4','5','6','7','8','9','+','-','*','/','Enter','Escape','Backspace','Delete','c','C','.'].includes(e.key)) {
e.preventDefault();

View file

@ -1976,12 +1976,12 @@ useEffect(() => {
<button
type="button"
onClick={() => setIsCalculatorOpen(true)}
className="px-3 py-2 rounded-lg border border-slate-200 bg-white hover:bg-slate-50 transition-colors flex items-center justify-center gap-2 text-sm"
className="px-3 py-2 rounded-lg border border-slate-200 bg-white hover:bg-slate-50 transition-colors flex items-center justify-center gap-2 text-sm flex-shrink-0"
title="Ouvrir la calculatrice"
aria-label="Calculatrice"
>
<CalculatorIcon className="w-4 h-4 text-slate-600" />
<span className="text-slate-600">Calculatrice</span>
<CalculatorIcon className="w-4 h-4 text-slate-600 flex-shrink-0" />
<span className="text-slate-600 whitespace-nowrap">Calculatrice</span>
</button>
</div>
<p className="text-[11px] text-slate-500 mt-1">