Initial commit

2026-06-13 14:57:15 +02:00
commit 48ed7fe65e
209 changed files with 49979 additions and 0 deletions
@@ -0,0 +1,51 @@
+import { useEffect } from 'react';
+
+/**
+ * ResultBanner — bannière succès/erreur avec auto-dismiss et × à droite.
+ *
+ * Props:
+ *   result     : { ok: bool, msg: string } | null
+ *   onDismiss  : () => void  — appelé à la fermeture (manuelle ou auto)
+ *   delay      : number      — délai auto-dismiss en ms (défaut 4000)
+ */
+export default function ResultBanner({ result, onDismiss, delay = 4000, style = {} }) {
+  useEffect(() => {
+    if (!result) return;
+    const t = setTimeout(onDismiss, delay);
+    return () => clearTimeout(t);
+  }, [result, delay, onDismiss]);
+
+  if (!result) return null;
+
+  return (
+    <div style={{
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'space-between',
+      padding: '8px 14px',
+      borderRadius: 8,
+      fontSize: 13,
+      background: result.ok ? 'rgba(34,197,94,.1)' : 'rgba(239,68,68,.1)',
+      color: result.ok ? '#16a34a' : '#dc2626',
+      border: `1px solid ${result.ok ? 'rgba(34,197,94,.3)' : 'rgba(239,68,68,.3)'}`,
+      ...style,
+    }}>
+      <span>{result.msg}</span>
+      <button
+        onClick={onDismiss}
+        style={{
+          marginLeft: 16,
+          background: 'none',
+          border: 'none',
+          cursor: 'pointer',
+          color: 'inherit',
+          fontSize: 18,
+          lineHeight: 1,
+          padding: '0 2px',
+          flexShrink: 0,
+        }}
+        aria-label="Fermer"
+      >×</button>
+    </div>
+  );
+}