@cardinali-studio/adminkit 2.2.20 → 2.2.22

package/dist/form/media/Lightbox.js

@@ -23,14 +23,21 @@ export function Lightbox({ lib }) {
     const i = lib.viewing;
     const file = i === null ? undefined : lib.shown[i];
     const [info, setInfo] = useState(false);
+    const [altOpen, setAltOpen] = useState(false);
+    const [altDraft, setAltDraft] = useState({ decorative: false, texts: {} });
+    const [altSaved, setAltSaved] = useState(false);
     const [usage, setUsage] = useState(null);
     const [usageError, setUsageError] = useState(false);
+    const altLocales = lib.altLocales ?? ["default"];
+    const defaultAltLocale = lib.defaultAltLocale ?? "default";
     // Tastiera: Esc chiude, le frecce scorrono. Su un visore a schermo intero è il modo in cui
     // ci si aspetta di muoversi, e senza si è costretti a mirare due bottoni piccoli.
     useEffect(() => {
         if (i === null)
             return;
         const on = (e) => {
+            if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement)
+                return;
             if (e.key === "Escape")
                 lib.view(null);
             else if (e.key === "ArrowRight")
@@ -41,6 +48,10 @@ export function Lightbox({ lib }) {
         addEventListener("keydown", on);
         return () => removeEventListener("keydown", on);
     }, [i, lib]);
+    useEffect(() => {
+        setAltDraft(file?.alt ?? { decorative: false, texts: {} });
+        setAltSaved(false);
+    }, [file?.key]);
     // L'uso si richiede per la foto che si sta guardando, non una volta per tutte.
     useEffect(() => {
         setUsage(null);
@@ -62,9 +73,28 @@ export function Lightbox({ lib }) {
     if (i === null || !file)
         return null;
     const folder = lib.prefix.replace(/\/$/, "") || "tutte le foto";
+    const lightboxAlt = file.alt?.decorative
+        ? ""
+        : file.alt?.texts[defaultAltLocale] || file.name;
     return (_jsxs("div", { className: "lb", onClick: (e) => { if (e.target === e.currentTarget)
-            lib.view(null); }, children: [_jsxs("header", { className: "lb-top", children: [_jsxs("button", { className: "lb-btn", onClick: () => lib.view(null), children: ["\u2039 Torna a ", folder] }), _jsxs("div", { className: "lb-id", children: [_jsx("span", { className: "lb-name", children: file.name }), _jsxs("span", { className: "lb-count", children: [i + 1, " / ", lib.shown.length] })] }), _jsxs("div", { className: "lb-tools", children: [_jsx("a", { className: "lb-btn", href: file.url, download: file.name, title: "Scarica", children: _jsx(IcoDown, {}) }), _jsx("button", { className: "lb-btn" + (info ? " is-on" : ""), onClick: () => setInfo((v) => !v), title: "Informazioni", children: _jsx(IcoInfo, {}) }), lib.mode === "manage" && (_jsx("button", { className: "lb-btn", onClick: () => void lib.remove([file.key]), title: "Cestina", children: _jsx(IcoTrash, {}) }))] })] }), _jsxs("div", { className: "lb-stage", onClick: (e) => { if (e.target === e.currentTarget)
-                    lib.view(null); }, children: [_jsx("button", { className: "lb-nav lb-prev", disabled: i === 0, onClick: () => lib.step(-1), "aria-label": "Precedente", children: "\u2039" }), _jsx("img", { className: "lb-img", src: file.url, alt: file.name }), _jsx("button", { className: "lb-nav lb-next", disabled: i === lib.shown.length - 1, onClick: () => lib.step(1), "aria-label": "Successiva", children: "\u203A" })] }), info && (_jsx("aside", { className: "lb-info", children: _jsxs("dl", { children: [_jsx("dt", { children: "File" }), _jsx("dd", { children: file.name }), _jsx("dt", { children: "Cartella" }), _jsx("dd", { children: lib.prefix || "(radice)" }), _jsx("dt", { children: "Dimensioni" }), _jsx("dd", { children: file.w && file.h ? `${file.w} × ${file.h} px` : "—" }), _jsx("dt", { children: "Peso" }), _jsx("dd", { children: fmtSize(file.size) }), _jsx("dt", { children: "Scatto" }), _jsx("dd", { children: fmtDate(file.capturedAt) }), _jsx("dt", { children: "Caricata" }), _jsx("dd", { children: fmtDate(file.uploaded) }), _jsx("dt", { children: "Usata in" }), _jsx("dd", { children: usageError
+            lib.view(null); }, children: [_jsxs("header", { className: "lb-top", children: [_jsxs("button", { className: "lb-btn", onClick: () => lib.view(null), children: ["\u2039 Torna a ", folder] }), _jsxs("div", { className: "lb-id", children: [_jsx("span", { className: "lb-name", children: file.name }), _jsxs("span", { className: "lb-count", children: [i + 1, " / ", lib.shown.length] })] }), _jsxs("div", { className: "lb-tools", children: [_jsx("a", { className: "lb-btn", href: file.url, download: file.name, title: "Scarica", children: _jsx(IcoDown, {}) }), lib.mode === "manage" && (file.type ?? "").startsWith("image/") && (_jsx("button", { className: "lb-btn lb-alt-button" + (altOpen ? " is-on" : ""), onClick: () => { setAltOpen((value) => !value); setInfo(false); lib.clearError(); }, title: "Testo alternativo", children: "ALT" })), _jsx("button", { className: "lb-btn" + (info ? " is-on" : ""), onClick: () => { setInfo((v) => !v); setAltOpen(false); }, title: "Informazioni", children: _jsx(IcoInfo, {}) }), lib.mode === "manage" && (_jsx("button", { className: "lb-btn", onClick: () => void lib.remove([file.key]), title: "Cestina", children: _jsx(IcoTrash, {}) }))] })] }), _jsxs("div", { className: "lb-stage", onClick: (e) => { if (e.target === e.currentTarget)
+                    lib.view(null); }, children: [_jsx("button", { className: "lb-nav lb-prev", disabled: i === 0, onClick: () => lib.step(-1), "aria-label": "Precedente", children: "\u2039" }), _jsx("img", { className: "lb-img", src: file.url, alt: lightboxAlt }), _jsx("button", { className: "lb-nav lb-next", disabled: i === lib.shown.length - 1, onClick: () => lib.step(1), "aria-label": "Successiva", children: "\u203A" })] }), info && (_jsx("aside", { className: "lb-info", children: _jsxs("dl", { children: [_jsx("dt", { children: "File" }), _jsx("dd", { children: file.name }), _jsx("dt", { children: "Cartella" }), _jsx("dd", { children: lib.prefix || "(radice)" }), _jsx("dt", { children: "Dimensioni" }), _jsx("dd", { children: file.w && file.h ? `${file.w} × ${file.h} px` : "—" }), _jsx("dt", { children: "Peso" }), _jsx("dd", { children: fmtSize(file.size) }), _jsx("dt", { children: "Scatto" }), _jsx("dd", { children: fmtDate(file.capturedAt) }), _jsx("dt", { children: "Caricata" }), _jsx("dd", { children: fmtDate(file.uploaded) }), _jsx("dt", { children: "Usata in" }), _jsx("dd", { children: usageError
                                 ? "controllo non disponibile"
-                                : usage === null ? "…" : usage.length ? usage.join(", ") : "nessuna sorgente" })] }) }))] }));
+                                : usage === null ? "…" : usage.length ? usage.join(", ") : "nessuna sorgente" })] }) })), altOpen && lib.mode === "manage" && (_jsxs("aside", { className: "lb-alt", "aria-label": "Testo alternativo dell'immagine", children: [_jsxs("header", { children: [_jsxs("div", { children: [_jsx("strong", { children: "Testo alternativo" }), _jsx("span", { children: "Predefinito per questo file" })] }), _jsx("button", { type: "button", onClick: () => setAltOpen(false), "aria-label": "Chiudi", children: "\u00D7" })] }), _jsxs("label", { className: "lb-alt-decorative", children: [_jsx("input", { type: "checkbox", checked: altDraft.decorative, disabled: lib.mutating, onChange: (event) => {
+                                    setAltSaved(false);
+                                    setAltDraft((current) => ({ ...current, decorative: event.target.checked }));
+                                } }), _jsxs("span", { children: [_jsx("strong", { children: "Immagine decorativa" }), _jsxs("small", { children: ["Non aggiunge informazioni: il sito user\u00E0 ", _jsx("code", { children: "alt=\"\"" }), "."] })] })] }), !altDraft.decorative && (_jsx("div", { className: "lb-alt-fields", children: altLocales.map((locale) => {
+                            const value = altDraft.texts[locale] ?? "";
+                            return (_jsxs("label", { children: [_jsxs("span", { children: [locale === "default" ? "Testo" : `Testo · ${locale.toUpperCase()}`, _jsxs("small", { children: [value.length, " caratteri"] })] }), _jsx("textarea", { rows: 3, value: value, disabled: lib.mutating, placeholder: "Descrivi il significato dell\u2019immagine nel contesto della pagina", onChange: (event) => {
+                                            setAltSaved(false);
+                                            setAltDraft((current) => ({
+                                                ...current,
+                                                texts: { ...current.texts, [locale]: event.target.value },
+                                            }));
+                                        } })] }, locale));
+                        }) })), _jsx("p", { className: "lb-alt-guidance", children: "Scrivi una frase breve e naturale. Evita \u201Cimmagine di\u201D, ripetizioni e liste di parole chiave. Lo stesso file pu\u00F2 essere sovrascritto dal singolo contenuto quando il contesto lo richiede." }), lib.error && _jsx("p", { className: "lb-alt-error", children: lib.error }), altSaved && _jsx("p", { className: "lb-alt-saved", role: "status", children: "Testo alternativo salvato." }), _jsx("footer", { children: _jsx("button", { type: "button", className: "ak-btn ak-btn-primary", disabled: lib.mutating, onClick: async () => {
+                                const saved = await lib.saveAlt(file.key, altDraft);
+                                if (saved)
+                                    setAltSaved(true);
+                            }, children: lib.operationState === "saving_alt" ? "Salvataggio…" : "Salva" }) })] }))] }));
 }

package/dist/form/media/MediaGrid.js

@@ -23,14 +23,14 @@ import { SORT_LABELS } from "./useMediaLibrary.js";
 import { DRAG_TYPE, DRAG_FOLDERS, readDragged, FolderMenu } from "./MediaFolders.js";
 import { Lightbox } from "./Lightbox.js";
 import { UploadDialog } from "./UploadDialog.js";
-import { summarizeMediaSelection } from "./media-model.js";
+import { mediaAltStatus, summarizeMediaSelection } from "./media-model.js";
 const JOURNAL_LABELS = {
     preparing: "Preparo le copie Media.",
-    ready: "Media pronta: pubblica per applicare la modifica.",
+    ready: "Modifica Media pronta per la pubblicazione.",
     blocked_in_use: "Operazione bloccata: una bozza o la versione online usa ancora la sorgente.",
     bound: "Pubblicazione con Media in corso.",
     finalizing: "Pubblicazione riuscita: completo la pulizia Media.",
-    completed_with_warning: "Pubblicato con Media da completare.",
+    completed_with_warning: "Modifica applicata con alcuni Media da completare.",
     failed: "Operazione Media interrotta prima della pubblicazione.",
 };
 /* Scaricare più file significa più download: il browser ne consente una raffica breve dallo
@@ -121,6 +121,7 @@ export function MediaGrid({ lib, notice, onPick, onCancel }) {
     const allOn = lib.allSelected;
     const locked = lib.busy || lib.mutating;
     const selection = summarizeMediaSelection(sel);
+    const altLocales = lib.altLocales ?? ["default"];
     /* `dragDepth` e non un booleano: `dragenter`/`dragleave` scattano anche passando da un figlio
        all'altro, quindi con un booleano la zona si spegne mentre ci si muove sopra. Si conta. */
     const [dragDepth, setDragDepth] = useState(0);
@@ -152,9 +153,11 @@ export function MediaGrid({ lib, notice, onPick, onCancel }) {
                 }, children: [dragDepth > 0 && (_jsx("div", { className: "mg-dropzone", children: manage
                             ? _jsxs("span", { children: ["Rilascia per caricare in ", _jsx("strong", { children: lib.prefix ? lib.labelOf(lib.prefix) : "Senza cartella" })] })
                             : _jsx("span", { children: "Rilascia le immagini \u2014 sceglierai la cartella prima del caricamento" }) })), _jsx("header", { className: "mg-bar", children: sel.size === 0 ? (_jsxs(_Fragment, { children: [(manage || lib.multiple) && (_jsxs("label", { className: "mg-all", children: [_jsx("input", { type: "checkbox", checked: false, disabled: locked || !lib.selectableIds.length, ref: (el) => { if (el)
-                                                el.indeterminate = false; }, onChange: () => lib.setAll(true) }), _jsx("span", { children: "Seleziona tutto" })] })), !manage && (_jsx("button", { className: "ak-btn ak-btn-quiet mg-upload", disabled: locked, onClick: () => lib.openUpload(), children: "Carica nuove foto" })), _jsx("span", { className: "ak-spacer" }), _jsxs("label", { className: "ak-hint", children: ["ordina per", " ", _jsx("select", { className: "mg-sort", value: lib.sortKey, disabled: locked, onChange: (e) => lib.setSort(e.target.value), children: Object.entries(SORT_LABELS).map(([k, l]) => _jsx("option", { value: k, children: l }, k)) }), _jsx("button", { className: "ak-icon", disabled: locked, onClick: lib.flipDir, title: "Inverti l'ordine", children: lib.sortDir === "asc" ? "↑" : "↓" })] })] })) : (_jsxs(_Fragment, { children: [_jsxs("label", { className: "mg-all", children: [_jsx("input", { type: "checkbox", checked: allOn, disabled: locked, ref: (el) => { if (el)
-                                                el.indeterminate = lib.someSelected; }, onChange: () => lib.setAll(!allOn) }), _jsx("span", { children: selection.label })] }), !allOn && lib.selectableIds.length > 0 && (_jsxs("button", { className: "mg-act is-link", disabled: locked, onClick: () => lib.setAll(true), children: ["Seleziona tutti gli elementi (", lib.selectableIds.length, ")"] })), manage && (_jsxs(_Fragment, { children: [lib.selectedFiles.length > 0 && (_jsxs("button", { className: "mg-act", disabled: locked, onClick: () => download(lib.shown.filter((f) => sel.has(f.key)).map((f) => ({ url: f.url, name: f.name }))), children: ["Scarica ", lib.selectedFiles.length, " file"] })), _jsx(MoveMenu, { lib: lib, keys: [...sel] }), _jsx("button", { className: "mg-act is-danger", disabled: locked, onClick: () => void lib.remove([...sel]), children: "Elimina" })] })), _jsx("span", { className: "ak-spacer" }), _jsx("button", { className: "mg-act", disabled: locked, onClick: () => lib.setAll(false), children: "Deseleziona" })] })) }), notice && _jsx("p", { className: "mg-picker-notice", children: notice }), lib.error && _jsx("p", { className: "ak-error", onClick: lib.clearError, children: lib.error }), manage && lib.mediaOperations.length > 0 && (_jsx("section", { className: "mg-journal", "aria-live": "polite", "aria-label": "Stato operazioni Media", children: lib.mediaOperations.map((operation) => (_jsxs("div", { className: `mg-journal-row is-${operation.state}`, children: [_jsx("span", { className: "mg-journal-badge", children: operation.type === "move" ? "Spostamento" : "Eliminazione" }), _jsx("span", { children: JOURNAL_LABELS[operation.state] ?? "Operazione Media in attesa." }), operation.failedEntries > 0 && _jsxs("span", { className: "ak-hint", children: [operation.failedEntries, " file da riprovare"] }), _jsx("span", { className: "ak-spacer" }), operation.state === "completed_with_warning" && operation.releaseId && (_jsx("button", { className: "mg-act", disabled: locked, onClick: () => void lib.resumeMedia(operation), children: "Riprendi" })), ["preparing", "ready", "blocked_in_use", "failed"].includes(operation.state) && !operation.releaseId && (_jsx("button", { className: "mg-act is-danger", disabled: locked, onClick: () => void lib.cancelMedia(operation), children: "Annulla" }))] }, operation.operationId))) })), lib.progress && (_jsxs("p", { className: "mg-progress", children: [lib.progress.verb, " ", lib.progress.done, "/", lib.progress.total, "\u2026 \u2014 non chiudere la pagina"] })), lib.pickUploadJob?.state === "running" && (_jsxs("p", { className: "mg-progress", children: ["Nuove immagini: preparo ", lib.pickUploadJob.conversionDone, "/", lib.pickUploadJob.total, ", carico ", lib.pickUploadJob.uploadDone, "/", lib.pickUploadJob.total, "\u2026"] })), lib.prefix !== "" && (manage || lib.subfolders.length > 0) && (_jsxs("section", { className: "mg-section", children: [_jsxs("div", { className: "mg-section-head", children: [_jsx("h2", { className: "mg-section-title", children: "Cartelle" }), manage && (_jsx("button", { className: "mg-act", disabled: locked, onClick: () => void lib.newFolder(lib.prefix), children: "+ Cartella" }))] }), lib.subfolders.length > 0 && (_jsx("div", { className: "mg", children: lib.subfolders.map((f) => (_jsx(FolderCell, { lib: lib, folder: f, manage: manage, onExternalDrop: () => setDragDepth(0) }, f.prefix))) }))] })), lib.prefix !== "" && (manage || lib.subfolders.length > 0) && lib.shown.length > 0 && (_jsx("h2", { className: "mg-section-title", children: "Foto" })), _jsx("div", { className: "mg", children: lib.shown.map((f, i) => {
+                                                el.indeterminate = false; }, onChange: () => lib.setAll(true) }), _jsx("span", { children: "Seleziona tutto" })] })), !manage && (_jsx("button", { className: "ak-btn ak-btn-quiet mg-upload", disabled: locked, onClick: () => lib.openUpload(), children: "Carica nuove foto" })), _jsx("span", { className: "ak-spacer" }), manage && (_jsxs("label", { className: "ak-hint", children: ["testo alt", " ", _jsxs("select", { className: "mg-sort", value: lib.altFilter, disabled: locked, onChange: (event) => lib.setAltFilter(event.target.value), children: [_jsx("option", { value: "all", children: "tutti" }), _jsx("option", { value: "missing", children: "da completare" }), _jsx("option", { value: "described", children: "completo" }), _jsx("option", { value: "decorative", children: "decorativo" })] })] })), _jsxs("label", { className: "ak-hint", children: ["ordina per", " ", _jsx("select", { className: "mg-sort", value: lib.sortKey, disabled: locked, onChange: (e) => lib.setSort(e.target.value), children: Object.entries(SORT_LABELS).map(([k, l]) => _jsx("option", { value: k, children: l }, k)) }), _jsx("button", { className: "ak-icon", disabled: locked, onClick: lib.flipDir, title: "Inverti l'ordine", children: lib.sortDir === "asc" ? "↑" : "↓" })] })] })) : (_jsxs(_Fragment, { children: [_jsxs("label", { className: "mg-all", children: [_jsx("input", { type: "checkbox", checked: allOn, disabled: locked, ref: (el) => { if (el)
+                                                el.indeterminate = lib.someSelected; }, onChange: () => lib.setAll(!allOn) }), _jsx("span", { children: selection.label })] }), !allOn && lib.selectableIds.length > 0 && (_jsxs("button", { className: "mg-act is-link", disabled: locked, onClick: () => lib.setAll(true), children: ["Seleziona tutti gli elementi (", lib.selectableIds.length, ")"] })), manage && (_jsxs(_Fragment, { children: [lib.selectedFiles.length > 0 && (_jsxs("button", { className: "mg-act", disabled: locked, onClick: () => download(lib.shown.filter((f) => sel.has(f.key)).map((f) => ({ url: f.url, name: f.name }))), children: ["Scarica ", lib.selectedFiles.length, " file"] })), _jsx(MoveMenu, { lib: lib, keys: [...sel] }), _jsx("button", { className: "mg-act is-danger", disabled: locked, onClick: () => void lib.remove([...sel]), children: "Elimina" })] })), _jsx("span", { className: "ak-spacer" }), _jsx("button", { className: "mg-act", disabled: locked, onClick: () => lib.setAll(false), children: "Deseleziona" })] })) }), notice && _jsx("p", { className: "mg-picker-notice", children: notice }), lib.error && _jsx("p", { className: "ak-error", onClick: lib.clearError, children: lib.error }), manage && lib.mediaOperations.length > 0 && (_jsx("section", { className: "mg-journal", "aria-live": "polite", "aria-label": "Stato operazioni Media", children: lib.mediaOperations.map((operation) => (_jsxs("div", { className: `mg-journal-row is-${operation.state}`, children: [_jsx("span", { className: "mg-journal-badge", children: operation.type === "move" ? "Spostamento" : "Eliminazione" }), _jsx("span", { children: JOURNAL_LABELS[operation.state] ?? "Operazione Media in attesa." }), operation.failedEntries > 0 && _jsxs("span", { className: "ak-hint", children: [operation.failedEntries, " file da riprovare"] }), _jsx("span", { className: "ak-spacer" }), operation.state === "ready" && !operation.releaseId && (_jsx("button", { className: "mg-act", disabled: locked, onClick: () => void lib.publishMedia(operation), children: "Riprova pubblicazione" })), operation.state === "completed_with_warning" && (_jsx("button", { className: "mg-act", disabled: locked, onClick: () => void lib.resumeMedia(operation), children: "Riprendi" })), ["preparing", "ready", "blocked_in_use", "failed"].includes(operation.state) && !operation.releaseId && (_jsx("button", { className: "mg-act is-danger", disabled: locked, onClick: () => void lib.cancelMedia(operation), children: "Annulla" }))] }, operation.operationId))) })), lib.progress && (_jsxs("p", { className: "mg-progress", children: [lib.progress.verb, " ", lib.progress.done, "/", lib.progress.total, "\u2026 \u2014 non chiudere la pagina"] })), lib.pickUploadJob?.state === "running" && (_jsxs("p", { className: "mg-progress", children: ["Nuove immagini: preparo ", lib.pickUploadJob.conversionDone, "/", lib.pickUploadJob.total, ", carico ", lib.pickUploadJob.uploadDone, "/", lib.pickUploadJob.total, "\u2026"] })), lib.prefix !== "" && (manage || lib.subfolders.length > 0) && (_jsxs("section", { className: "mg-section", children: [_jsxs("div", { className: "mg-section-head", children: [_jsx("h2", { className: "mg-section-title", children: "Cartelle" }), manage && (_jsx("button", { className: "mg-act", disabled: locked, onClick: () => void lib.newFolder(lib.prefix), children: "+ Cartella" }))] }), lib.subfolders.length > 0 && (_jsx("div", { className: "mg", children: lib.subfolders.map((f) => (_jsx(FolderCell, { lib: lib, folder: f, manage: manage, onExternalDrop: () => setDragDepth(0) }, f.prefix))) }))] })), lib.prefix !== "" && (manage || lib.subfolders.length > 0) && lib.shown.length > 0 && (_jsx("h2", { className: "mg-section-title", children: "Foto" })), _jsx("div", { className: "mg", children: lib.shown.map((f, i) => {
                             const on = sel.has(f.key);
+                            const isImage = (f.type ?? "").startsWith("image/");
+                            const altStatus = isImage ? mediaAltStatus(f, altLocales) : null;
                             return (_jsxs("figure", { className: "mg-item" + (on ? " is-on" : ""), draggable: manage && !locked, onDragStart: (e) => {
                                     if (locked) {
                                         e.preventDefault();
@@ -173,7 +176,7 @@ export function MediaGrid({ lib, notice, onPick, onCancel }) {
                                             (manage ? lib.view(i) : lib.toggle(f.key)); }, children: [_jsx("img", { className: "mg-img", src: f.url, alt: "", loading: "lazy", 
                                                 /* Il rapporto è noto prima che l'immagine arrivi (lo dà l'elenco): la cella
                                                    riserva subito l'ingombro giusto e la griglia non salta mentre si carica. */
-                                                style: { aspectRatio: f.w && f.h ? `${f.w} / ${f.h}` : "3 / 2" } }), _jsx("button", { className: "mg-check", "aria-label": on ? "Deseleziona" : "Seleziona", disabled: locked, onClick: (e) => { e.stopPropagation(); lib.toggle(f.key); }, children: on ? "✓" : "" })] }), _jsx("figcaption", { className: "mg-cap", title: f.name, children: f.name })] }, f.key));
+                                                style: { aspectRatio: f.w && f.h ? `${f.w} / ${f.h}` : "3 / 2" } }), manage && altStatus && (_jsx("span", { className: `mg-alt-badge is-${altStatus}`, children: altStatus === "missing" ? "ALT da completare" : altStatus === "decorative" ? "Decorativa" : "ALT completo" })), _jsx("button", { className: "mg-check", "aria-label": on ? "Deseleziona" : "Seleziona", disabled: locked, onClick: (e) => { e.stopPropagation(); lib.toggle(f.key); }, children: on ? "✓" : "" })] }), _jsx("figcaption", { className: "mg-cap", title: f.name, children: f.name })] }, f.key));
                         }) }), !lib.busy && lib.shown.length === 0 && (_jsx("p", { className: "ak-hint", children: lib.prefix === "" && lib.folders.length
                             ? "Nessuna foto fuori dalle cartelle. Scegline una qui a fianco."
                             : "Nessun file qui." })), lib.mode === "pick" && (_jsxs("footer", { className: "mg-foot", children: [_jsxs("span", { className: "ak-hint", children: [sel.size, " selezionate"] }), _jsx("span", { className: "ak-spacer" }), _jsx("button", { className: "ak-btn ak-btn-quiet", disabled: locked, onClick: () => onCancel?.(), children: "Annulla" }), _jsxs("button", { className: "ak-btn ak-btn-primary", disabled: locked || !sel.size, onClick: () => onPick?.(lib.shown.filter((f) => sel.has(f.key))), children: ["Usa ", sel.size > 0 ? `(${sel.size})` : ""] })] }))] }), _jsx(Lightbox, { lib: lib }), _jsx(UploadDialog, { lib: lib })] }));

package/dist/form/media/media-model.d.ts

@@ -1,5 +1,7 @@
 import type { AssetFile, AssetFolder } from "../../api.js";
 export type MediaSelectionKind = "file" | "folder";
+export type MediaAltStatus = "missing" | "described" | "decorative";
+export declare function mediaAltStatus(file: Pick<AssetFile, "alt">, locales: readonly string[]): MediaAltStatus;
 export interface MediaSelectableItem {
     id: string;
     kind: MediaSelectionKind;

package/dist/form/media/media-model.js

@@ -1,3 +1,11 @@
+export function mediaAltStatus(file, locales) {
+    if (file.alt?.decorative)
+        return "decorative";
+    const texts = file.alt?.texts ?? {};
+    return locales.every((locale) => typeof texts[locale] === "string" && texts[locale].trim())
+        ? "described"
+        : "missing";
+}
 /** L'unico dominio su cui "Seleziona tutto" e la relativa checkbox possono ragionare. */
 export function mediaSelectableItems({ mode, prefix, shown, subfolders, }) {
     const visibleFolders = mode === "manage" && prefix !== ""

package/dist/form/media/useMediaLibrary.d.ts

@@ -1,4 +1,4 @@
-import { api, type AssetFile, type AssetFolder } from "../../api.js";
+import { api, type AssetAltText, type AssetFile, type AssetFolder } from "../../api.js";
 import type { MediaOperationStatus } from "../../media.js";
 import { type MediaUploadJob } from "./media-upload-queue.js";
 /** D1 registra l'intera cancellazione nel preflight: non esistono né il token Git né i
@@ -7,9 +7,12 @@ import { type MediaUploadJob } from "./media-upload-queue.js";
 export declare function deleteMediaKeys(keys: string[], remove: typeof api.remove, onProgress?: (done: number) => void): Promise<{
     done: number;
     refsToken?: string;
+    operationId?: string;
+    requiresPublication?: boolean;
 }>;
-export type MediaOperationState = "idle" | "planning" | "awaiting_confirmation" | "moving" | "deleting" | "renaming" | "creating_folder" | "journal";
+export type MediaOperationState = "idle" | "planning" | "awaiting_confirmation" | "moving" | "deleting" | "renaming" | "creating_folder" | "saving_alt" | "journal";
 export type SortKey = "uploaded" | "capturedAt" | "name" | "size";
+export type AltFilter = "all" | "missing" | "described" | "decorative";
 export declare const SORT_LABELS: Record<SortKey, string>;
 export interface MediaLibrary {
     mode: "manage" | "pick";
@@ -39,6 +42,9 @@ export interface MediaLibrary {
     } | null;
     sortKey: SortKey;
     sortDir: "asc" | "desc";
+    altFilter: AltFilter;
+    altLocales: readonly string[];
+    defaultAltLocale: string;
     uploadDraft: {
         files: File[];
         destination: string | null;
@@ -55,6 +61,7 @@ export interface MediaLibrary {
     setAll(on: boolean): void;
     setSort(k: SortKey): void;
     flipDir(): void;
+    setAltFilter(filter: AltFilter): void;
     /** Accoda lo STESSO lavoro usato da Media. `destination` è esplicita nel picker; in gestione
      * il ripiego resta la cartella aperta, che è il comportamento storico. */
     upload(files: File[] | FileList, destination?: string): Promise<string | null>;
@@ -63,6 +70,7 @@ export interface MediaLibrary {
     setUploadFiles(files: File[] | FileList): void;
     setUploadDestination(destination: string | null): void;
     setAutoWebp(on: boolean): Promise<void>;
+    saveAlt(key: string, alt: AssetAltText): Promise<boolean>;
     view(i: number | null): void;
     step(delta: number): void;
     /** File e cartelle insieme: una cartella si riconosce dalla chiave, che finisce con "/". */
@@ -76,6 +84,7 @@ export interface MediaLibrary {
     /** Cestina la cartella e tutto ciò che contiene. */
     removeFolder(prefix: string): Promise<void>;
     resumeMedia(operation: MediaOperationStatus): Promise<void>;
+    publishMedia(operation: MediaOperationStatus): Promise<void>;
     cancelMedia(operation: MediaOperationStatus): Promise<void>;
     /** Il nome da mostrare per un prefisso: l'etichetta se c'è, altrimenti lo slug. */
     labelOf(prefix: string): string;

package/dist/form/media/useMediaLibrary.js

@@ -11,9 +11,9 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { api, ApiError } from "../../api.js";
 import { storageKey } from "../../config.js";
-import { contentPersistenceMode } from "../../app/site.js";
+import { contentPersistenceMode, site } from "../../app/site.js";
 import { startMediaUpload, useMediaUploadCompletions, useMediaUploads, } from "./media-upload-queue.js";
-import { invalidMediaMoveReason, isValidMediaMoveDestination, mediaFolderSlug, mediaSelectableItems, mediaSelectionState, normalizeMediaSelection, summarizeMediaSelection, tryBeginMediaMutation, } from "./media-model.js";
+import { invalidMediaMoveReason, isValidMediaMoveDestination, mediaFolderSlug, mediaAltStatus, mediaSelectableItems, mediaSelectionState, normalizeMediaSelection, summarizeMediaSelection, tryBeginMediaMutation, } from "./media-model.js";
 import { executeMediaMovePlan, mediaMoveConfirmation, mediaMoveNeedsConfirmation, } from "./media-move.js";
 /* Quanti file per richiesta nelle operazioni lunghe (cestina, sposta). Ogni file costa al
  * server tre operazioni su R2 — legge, riscrive altrove, cancella — su oggetti da qualche MB.
@@ -29,7 +29,11 @@ export async function deleteMediaKeys(keys, remove, onProgress = () => { }) {
     if (preflight.d1 === true) {
         const done = preflight.trashed ?? keys.length;
         onProgress(done);
-        return { done };
+        return {
+            done,
+            operationId: preflight.operationId,
+            requiresPublication: preflight.requiresPublication === true,
+        };
     }
     if (!preflight.refsToken) {
         throw new Error("Il server non ha confermato la verifica dei riferimenti.");
@@ -92,6 +96,9 @@ export function useMediaLibrary({ mode, multiple = true, active = true, remember
     // tutti i giorni non ha motivo di azzerarsi per una riorganizzazione dei sorgenti.
     const [sortKey, setSortKey] = useState(() => localStorage.getItem(storageKey("sortKey")) || "uploaded");
     const [sortDir, setSortDir] = useState(() => localStorage.getItem(storageKey("sortDir")) || "desc");
+    const [altFilter, setAltFilter] = useState("all");
+    const altLocales = site().languages?.available ?? ["default"];
+    const defaultAltLocale = site().languages?.default ?? "default";
     /* I nomi per esteso già visti. Servono al percorso in alto: dentro `food/piatti-2024/`
      * l'elenco delle cartelle non contiene più né l'una né l'altra — `folders` ha il primo livello
      * e `subfolders` i FIGLI di dove sei — quindi senza memoria il percorso mostrerebbe gli slug,
@@ -230,13 +237,16 @@ export function useMediaLibrary({ mode, multiple = true, active = true, remember
         return () => removeEventListener("beforeunload", warn);
     }, [progress]);
     const shown = useMemo(() => {
-        const list = mode === "pick" ? files.filter((f) => (f.type ?? "").startsWith("image/")) : files.slice();
+        let list = mode === "pick" ? files.filter((f) => (f.type ?? "").startsWith("image/")) : files.slice();
+        if (mode === "manage" && altFilter !== "all") {
+            list = list.filter((file) => (file.type ?? "").startsWith("image/") && mediaAltStatus(file, altLocales) === altFilter);
+        }
         const dir = sortDir === "asc" ? 1 : -1;
         return list.sort((a, b) => {
             const x = a[sortKey] ?? "", y = b[sortKey] ?? "";
             return (x < y ? -1 : x > y ? 1 : 0) * dir;
         });
-    }, [files, sortKey, sortDir, mode]);
+    }, [files, sortKey, sortDir, mode, altFilter, altLocales]);
     const selectableItems = useMemo(() => mediaSelectableItems({ mode, prefix, shown, subfolders }), [mode, prefix, shown, subfolders]);
     const selectableIds = useMemo(() => selectableItems.map((item) => item.id), [selectableItems]);
     const selectableIdSet = useMemo(() => new Set(selectableIds), [selectableIds]);
@@ -326,6 +336,29 @@ export function useMediaLibrary({ mode, multiple = true, active = true, remember
             setSettingsBusy(false);
         }
     }, [autoWebp]);
+    const saveAlt = useCallback(async (key, alt) => {
+        if (!beginMutation("saving_alt"))
+            return false;
+        setBusy(true);
+        setError(null);
+        try {
+            const result = await api.saveMediaAlt(key, alt);
+            setFiles((current) => current.map((file) => file.key === key ? { ...file, alt: result.alt } : file));
+            /* Se si sta facendo audit dei mancanti, al salvataggio la foto può uscire dal filtro:
+             * chiudere il visore evita che il suo indice finisca per indicare la foto successiva. */
+            if (altFilter !== "all")
+                setViewing(null);
+            return true;
+        }
+        catch (error) {
+            setError(error instanceof ApiError ? error.message : String(error));
+            return false;
+        }
+        finally {
+            setBusy(false);
+            endMutation();
+        }
+    }, [altFilter, beginMutation, endMutation]);
     const labelOf = useCallback((p) => {
         const f = folders.find((x) => x.prefix === p) ?? subfolders.find((x) => x.prefix === p);
         return f?.label || seenLabels.current[p] || p.replace(/\/$/, "").split("/").pop() || "";
@@ -411,21 +444,17 @@ export function useMediaLibrary({ mode, multiple = true, active = true, remember
                 throw new Error("Prima di eliminare queste foto devi sostituirle nel contenuto:\n"
                     + u.blockers.map((b) => `• ${b.label}: ${b.reason}`).join("\n"));
             }
-            /* LA RIGA IN PIÙ QUANDO LE FOTO SONO IN USO, e non è pignoleria.
-             *
-             * Le foto stanno nel bucket, che è uno solo: non esiste una versione "in bozza" di un
-             * file. Eliminarne una la toglie SUBITO dal sito pubblicato, mentre la ripulitura dei
-             * riferimenti nelle pagine resta sulla bozza finché non si pubblica — quindi per quel
-             * tempo le pagine online chiedono una foto che non c'è più.
-             *
-             * La finestra esisteva anche prima (durava la build, un paio di minuti); ora dura fino
-             * alla pubblicazione, cioè quanto decide chi sta lavorando. Non si aggiunge macchinario
-             * per chiuderla: si dice, e si dice SOLO quando è vero — un avviso che compare sempre
-             * smette di essere letto, e allora non avvisa più di niente. */
+            /* Quando una foto è online la conferma deve descrivere l'intera operazione: Admin
+             * pubblicherà una revisione isolata delle sole pagine coinvolte e toccherà il file
+             * soltanto dopo. Sostituire prima resta la strada raccomandata perché una rimozione
+             * valida per lo schema può comunque cambiare l'impaginazione. */
             const msg = u.count
-                ? `Eliminare ${quante}?\n\nATTENZIONE: ${u.count} di queste foto sono usate in: ${u.pages.join(", ")}.\n`
-                    + `I riferimenti verranno rimossi da quelle sorgenti.\n\n`
-                    + `Le foto spariscono subito dal sito online; le pagine si sistemano quando pubblichi.`
+                ? `Eliminare ${quante}?\n\n${u.count === 1 ? "Una delle immagini è utilizzata" : `${u.count} immagini sono utilizzate`} in:\n`
+                    + u.pages.map((page) => `• ${page}`).join("\n")
+                    + `\n\nAdmin rimuoverà le immagini da queste pagine e pubblicherà automaticamente soltanto questa modifica. `
+                    + `Gallerie, griglie o sezioni potrebbero cambiare impaginazione.\n\n`
+                    + `Ti consigliamo di annullare e sostituire prima le immagini nelle pagine indicate. `
+                    + `Confermando, procederai comunque con la rimozione e la pubblicazione.`
                 : `Eliminare ${quante}?`;
             if (!confirm(`${msg}\n\nLe foto vanno nel cestino e si possono recuperare.`))
                 return;
@@ -435,6 +464,18 @@ export function useMediaLibrary({ mode, multiple = true, active = true, remember
                 const result = await deleteMediaKeys(keys, api.remove, (done) => setProgress({ done, total: keys.length, verb: "Cestino" }));
                 refsToken = result.refsToken;
                 const done = result.done;
+                if (result.operationId && result.requiresPublication) {
+                    setProgress({ done: keys.length, total: keys.length, verb: "Pubblico" });
+                    try {
+                        await api.contentPublishMedia(result.operationId);
+                    }
+                    catch (error) {
+                        const apiError = error;
+                        failure = apiError.code === "deployment_lane_busy" || apiError.code === "release_in_progress"
+                            ? "C'è già una pubblicazione in corso. L'eliminazione è al sicuro: usa «Riprova pubblicazione» quando termina."
+                            : `Eliminazione preparata, ma la pubblicazione non è partita: ${apiError.message}`;
+                    }
+                }
                 if (done < keys.length) {
                     failure = `Cestinate ${done} foto su ${keys.length}: le altre sono ancora lì, riprova.`;
                 }
@@ -641,9 +682,27 @@ export function useMediaLibrary({ mode, multiple = true, active = true, remember
     }, [prefix, load, moveFolder, beginMutation, endMutation]);
     /** Cestina una cartella con tutto quello che contiene. È `remove` con una lista di uno. */
     const removeFolder = useCallback((target) => remove([target]), [remove]);
-    const resumeMedia = useCallback(async (operation) => {
-        if (!operation.releaseId)
+    const publishMedia = useCallback(async (operation) => {
+        if (!beginMutation("journal"))
             return;
+        setBusy(true);
+        setError(null);
+        let failure = null;
+        try {
+            await api.contentPublishMedia(operation.operationId);
+        }
+        catch (e) {
+            failure = e instanceof ApiError ? e.message : String(e);
+        }
+        finally {
+            setBusy(false);
+            await load(prefix);
+            endMutation();
+            if (failure)
+                setError(`Pubblicazione Media non riuscita: ${failure}`);
+        }
+    }, [beginMutation, endMutation, load, prefix]);
+    const resumeMedia = useCallback(async (operation) => {
         if (!beginMutation("journal"))
             return;
         setBusy(true);
@@ -697,7 +756,8 @@ export function useMediaLibrary({ mode, multiple = true, active = true, remember
         mode, multiple, prefix, folders, subfolders, shown, selected, selectableIds,
         selectedFiles: selectionSummary.files, selectedFolders: selectionSummary.folders,
         allSelected, someSelected, busy, mutating, operationState, error, mediaOperations, progress,
-        sortKey, sortDir, uploadDraft, pickUploadJob, viewing, autoWebp, settingsBusy,
+        sortKey, sortDir, altFilter, altLocales, defaultAltLocale,
+        uploadDraft, pickUploadJob, viewing, autoWebp, settingsBusy,
         go: (p) => { if (!mutationRef.current)
             void load(p); },
         reload: () => { if (!mutationRef.current)
@@ -705,6 +765,11 @@ export function useMediaLibrary({ mode, multiple = true, active = true, remember
         toggle, setAll,
         setSort: setSortKey,
         flipDir: () => setSortDir((d) => (d === "asc" ? "desc" : "asc")),
+        setAltFilter: (filter) => {
+            setAltFilter(filter);
+            setSelected(new Set());
+            setViewing(null);
+        },
         upload,
         openUpload: (files = [], destination) => {
             if (mutationRef.current)
@@ -718,12 +783,12 @@ export function useMediaLibrary({ mode, multiple = true, active = true, remember
             setUploadDraft(null); },
         setUploadFiles: (files) => setUploadDraft((draft) => (draft ? { ...draft, files: Array.from(files) } : draft)),
         setUploadDestination: (destination) => setUploadDraft((draft) => (draft ? { ...draft, destination } : draft)),
-        setAutoWebp,
+        setAutoWebp, saveAlt,
         view: setViewing,
         step,
         move,
         canMoveTo: (ids, dest) => !mutationRef.current && isValidMediaMoveDestination(ids, dest),
-        remove, newFolder, renameFolder, removeFolder, resumeMedia, cancelMedia, labelOf,
+        remove, newFolder, renameFolder, removeFolder, resumeMedia, publishMedia, cancelMedia, labelOf,
         clearError: () => setError(null),
     };
 }