@cardinali-studio/adminkit 1.0.0

package/dist/app/routes/PageEditor.js

@@ -0,0 +1,233 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/* Editor delle pagine.
+ *
+ * Le gallery non sono più presentate come un form di CMS: la pagina è la sua selezione di
+ * fotografie, quindi l'editor mostra direttamente quella selezione. I campi comuni che hanno
+ * senso in qualunque pagina (nome, pubblicazione e menu) vivono invece nella testata.
+ *
+ * Le altre tipologie restano schema-driven: continuano a ricevere automaticamente i campi
+ * dichiarati nello schema, ma senza duplicare quelli già spostati nella testata.
+ */
+import { useEffect, useMemo, useRef, useState } from "react";
+import { DndContext, DragOverlay, KeyboardSensor, PointerSensor, closestCenter, useSensor, useSensors, } from "@dnd-kit/core";
+import { SortableContext, arrayMove, rectSortingStrategy, sortableKeyboardCoordinates, useSortable, } from "@dnd-kit/sortable";
+import { CSS } from "@dnd-kit/utilities";
+import { ProseField, SchemaForm } from "../../form/index.js";
+import { api } from "../../index.js";
+import { site } from "../site.js";
+import { uniqueSlug } from "../lib/slug";
+import { proseStats } from "../lib/text";
+import { Icon } from "../ui/icons";
+import { GallerySectionsEditor } from "./GallerySectionsEditor";
+import { PortfolioWorksEditor } from "./PortfolioWorksEditor";
+import { AboutEditor } from "./AboutEditor";
+import { WorkshopEditionsEditor } from "./WorkshopEditionsEditor";
+export function PageHeader({ page, pages, onChange, seoActive, onSeoToggle, }) {
+    const [titleOpen, setTitleOpen] = useState(false);
+    const [visibilityOpen, setVisibilityOpen] = useState(false);
+    const [title, setTitle] = useState(String(page.title ?? ""));
+    const [slug, setSlug] = useState(page.slug);
+    const visibilityRef = useRef(null);
+    useEffect(() => {
+        if (!titleOpen) {
+            setTitle(String(page.title ?? ""));
+            setSlug(page.slug);
+        }
+    }, [page.slug, page.title, titleOpen]);
+    useEffect(() => {
+        if (!titleOpen && !visibilityOpen)
+            return;
+        const close = (event) => {
+            if (event.key === "Escape") {
+                setTitleOpen(false);
+                setVisibilityOpen(false);
+            }
+        };
+        addEventListener("keydown", close);
+        return () => removeEventListener("keydown", close);
+    }, [titleOpen, visibilityOpen]);
+    useEffect(() => {
+        if (!visibilityOpen)
+            return;
+        const close = (event) => {
+            if (!visibilityRef.current?.contains(event.target))
+                setVisibilityOpen(false);
+        };
+        addEventListener("pointerdown", close);
+        return () => removeEventListener("pointerdown", close);
+    }, [visibilityOpen]);
+    const saveTitle = () => {
+        const nextTitle = title.trim();
+        if (!nextTitle)
+            return;
+        const taken = pages.filter((item) => item.slug !== page.slug).map((item) => item.slug);
+        onChange({
+            ...page,
+            title: nextTitle,
+            slug: uniqueSlug(slug || nextTitle, taken),
+        });
+        setTitleOpen(false);
+    };
+    const online = page.published !== false;
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "pe-head-main", children: [_jsx("button", { type: "button", className: "pe-title", title: "Modifica nome e indirizzo", onClick: () => {
+                            setTitle(String(page.title ?? ""));
+                            setSlug(page.slug);
+                            setVisibilityOpen(false);
+                            setTitleOpen(true);
+                        }, children: String(page.title ?? page.slug) }), _jsxs("button", { type: "button", className: "pe-seo-button" + (seoActive ? " is-active" : ""), "aria-pressed": seoActive, onClick: onSeoToggle, children: [_jsx(Icon.search, {}), "SEO"] }), _jsxs("div", { className: "pe-visibility", ref: visibilityRef, children: [_jsxs("button", { type: "button", className: "pe-status" + (online ? " is-online" : " is-offline"), "aria-haspopup": "menu", "aria-expanded": visibilityOpen, onClick: () => setVisibilityOpen((open) => !open), children: [_jsx("span", { className: "pe-status-dot" }), online ? "Online" : "Offline", _jsx("span", { className: "pe-chevron", "aria-hidden": "true", children: "\u2304" })] }), visibilityOpen && (_jsxs("div", { className: "pe-status-menu", role: "menu", children: [_jsx("span", { className: "pe-status-label", children: "Visibilit\u00E0 della pagina" }), _jsxs("button", { type: "button", className: online ? "is-selected" : "", onClick: () => {
+                                            if (!online)
+                                                onChange({ ...page, published: true });
+                                            setVisibilityOpen(false);
+                                        }, children: [_jsx("span", { className: "pe-radio", children: _jsx("span", {}) }), _jsxs("span", { children: [_jsx("strong", { children: "Online" }), _jsx("small", { children: "La pagina \u00E8 pubblicata e accessibile a tutti." })] })] }), _jsxs("button", { type: "button", className: !online ? "is-selected" : "", onClick: () => {
+                                            if (online)
+                                                onChange({ ...page, published: false });
+                                            setVisibilityOpen(false);
+                                        }, children: [_jsx("span", { className: "pe-radio", children: _jsx("span", {}) }), _jsxs("span", { children: [_jsx("strong", { children: "Offline" }), _jsx("small", { children: "La pagina non \u00E8 visibile sul sito." })] })] })] }))] }), _jsxs("label", { className: "pe-menu-toggle", children: [_jsx("input", { type: "checkbox", checked: !!page.inMenu, onChange: (event) => onChange({ ...page, inMenu: event.target.checked }) }), _jsx("span", { children: "Aggiungi al menu" })] })] }), titleOpen && (_jsx("div", { className: "pe-modal", role: "presentation", onMouseDown: (event) => {
+                    if (event.target === event.currentTarget)
+                        setTitleOpen(false);
+                }, children: _jsxs("div", { className: "pe-modal-card", role: "dialog", "aria-modal": "true", "aria-labelledby": "pe-title-dialog", children: [_jsxs("header", { children: [_jsx("h2", { id: "pe-title-dialog", children: "Modifica pagina" }), _jsx("button", { type: "button", onClick: () => setTitleOpen(false), "aria-label": "Chiudi", children: "\u00D7" })] }), _jsxs("div", { className: "pe-modal-fields", children: [_jsxs("label", { children: [_jsx("span", { children: "Nome pagina" }), _jsx("input", { autoFocus: true, value: title, onChange: (event) => setTitle(event.target.value), onKeyDown: (event) => {
+                                                if (event.key === "Enter")
+                                                    saveTitle();
+                                            } })] }), _jsxs("label", { children: [_jsx("span", { children: "Indirizzo pagina" }), _jsxs("div", { className: "pe-url-input", children: [_jsx("span", { children: "/" }), _jsx("input", { value: slug, onChange: (event) => setSlug(event.target.value) }), _jsx("span", { children: "/" })] }), _jsx("small", { children: "I vecchi collegamenti non funzioneranno pi\u00F9 se cambi l\u2019indirizzo." })] })] }), _jsxs("footer", { children: [_jsx("button", { type: "button", className: "ak-btn", onClick: () => setTitleOpen(false), children: "Annulla" }), _jsx("button", { type: "button", className: "ak-btn ak-btn-primary", disabled: !title.trim(), onClick: saveTitle, children: "Aggiorna" })] })] }) }))] }));
+}
+function imageName(src) {
+    const raw = src.split("?")[0]?.split("/").filter(Boolean).at(-1) || "Immagine";
+    try {
+        return decodeURIComponent(raw).replace(/\.[a-z0-9]+$/i, "").replace(/[-_]+/g, " ");
+    }
+    catch {
+        return raw;
+    }
+}
+function GalleryCard({ item, activeId, overId, activeIndex, overIndex, onReplace, onToggle, onRemove, }) {
+    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({ id: item.src });
+    const isTarget = overId === item.src && activeId !== item.src;
+    const insertAfter = isTarget && activeIndex < overIndex;
+    const insertBefore = isTarget && activeIndex > overIndex;
+    return (_jsxs("figure", { ref: setNodeRef, className: [
+            "pe-photo",
+            item.hidden ? "is-hidden" : "",
+            isDragging ? "is-dragging" : "",
+            insertBefore ? "is-insert-before" : "",
+            insertAfter ? "is-insert-after" : "",
+        ].filter(Boolean).join(" "), style: { transform: CSS.Transform.toString(transform), transition }, children: [_jsxs("div", { className: "pe-photo-frame", ...attributes, ...listeners, children: [_jsx("img", { src: item.src, alt: imageName(item.src), draggable: false }), item.hidden && _jsx("span", { className: "pe-hidden-label", children: "Nascosta" })] }), _jsxs("div", { className: "pe-photo-actions", children: [_jsx("button", { type: "button", onClick: onReplace, title: "Cambia immagine", "aria-label": "Cambia immagine", children: _jsx(Icon.replace, {}) }), _jsx("button", { type: "button", onClick: onToggle, title: item.hidden ? "Rimetti online" : "Nascondi dalla gallery", "aria-label": item.hidden ? "Rimetti online" : "Nascondi dalla gallery", children: item.hidden ? _jsx(Icon.eye, {}) : _jsx(Icon.eyeOff, {}) }), _jsx("button", { type: "button", className: "is-danger", onClick: onRemove, title: "Rimuovi dalla gallery", "aria-label": "Rimuovi dalla gallery", children: _jsx(Icon.trash, {}) })] }), _jsx("figcaption", { title: imageName(item.src), children: imageName(item.src) })] }));
+}
+function GalleryEditor({ value, onChange, pickMediaFiles, }) {
+    const list = Array.isArray(value) ? value : [];
+    const [activeId, setActiveId] = useState(null);
+    const [overId, setOverId] = useState(null);
+    const sensors = useSensors(useSensor(PointerSensor, { activationConstraint: { distance: 6 } }), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }));
+    const activeIndex = activeId ? list.findIndex((item) => item.src === activeId) : -1;
+    const overIndex = overId ? list.findIndex((item) => item.src === overId) : -1;
+    const activeItem = activeIndex >= 0 ? list[activeIndex] : null;
+    const visible = list.filter((item) => !item.hidden).length;
+    const add = async () => {
+        const picked = await pickMediaFiles?.({ multiple: true });
+        if (!picked?.length)
+            return;
+        const have = new Set(list.map((item) => item.src));
+        const additions = picked
+            .filter((file) => !have.has(file.url))
+            .map((file) => ({ src: file.url, w: file.w ?? null, h: file.h ?? null }));
+        if (additions.length)
+            onChange([...list, ...additions]);
+    };
+    const replace = async (index) => {
+        const picked = await pickMediaFiles?.({ multiple: false });
+        const file = picked?.[0];
+        if (!file || file.url === list[index]?.src)
+            return;
+        if (list.some((item, itemIndex) => itemIndex !== index && item.src === file.url)) {
+            alert("Questa foto è già presente nella gallery.");
+            return;
+        }
+        onChange(list.map((item, itemIndex) => itemIndex === index
+            ? { ...item, src: file.url, w: file.w ?? null, h: file.h ?? null }
+            : item));
+    };
+    const finishDrag = ({ active, over }) => {
+        setActiveId(null);
+        setOverId(null);
+        if (!over || active.id === over.id)
+            return;
+        const from = list.findIndex((item) => item.src === active.id);
+        const to = list.findIndex((item) => item.src === over.id);
+        if (from >= 0 && to >= 0)
+            onChange(arrayMove(list, from, to));
+    };
+    return (_jsxs("section", { className: "pe-gallery", "aria-label": "Foto della gallery", children: [_jsxs("div", { className: "pe-gallery-bar", children: [_jsxs("div", { children: [_jsxs("strong", { children: [list.length, " ", list.length === 1 ? "foto" : "foto"] }), _jsx("span", { children: list.length === 0
+                                    ? "Scegli le immagini da mostrare nella pagina."
+                                    : `${visible} online${visible < list.length ? ` · ${list.length - visible} nascoste` : ""}` })] }), _jsxs("button", { type: "button", className: "pe-add", onClick: () => void add(), children: ["Aggiungi foto ", _jsx(Icon.plus, {})] })] }), list.length === 0 ? (_jsxs("button", { type: "button", className: "pe-gallery-empty", onClick: () => void add(), children: [_jsx(Icon.gallery, {}), _jsx("strong", { children: "La gallery \u00E8 vuota" }), _jsx("span", { children: "Aggiungi le prime fotografie" })] })) : (_jsxs(DndContext, { sensors: sensors, collisionDetection: closestCenter, onDragStart: ({ active }) => setActiveId(String(active.id)), onDragOver: ({ over }) => setOverId(over ? String(over.id) : null), onDragCancel: () => { setActiveId(null); setOverId(null); }, onDragEnd: finishDrag, children: [_jsx(SortableContext, { items: list.map((item) => item.src), strategy: rectSortingStrategy, children: _jsx("div", { className: "pe-photo-grid", children: list.map((item, index) => (_jsx(GalleryCard, { item: item, activeId: activeId, overId: overId, activeIndex: activeIndex, overIndex: overIndex, onReplace: () => void replace(index), onToggle: () => onChange(list.map((candidate, itemIndex) => itemIndex === index
+                                    ? { ...candidate, hidden: candidate.hidden ? undefined : true }
+                                    : candidate)), onRemove: () => onChange(list.filter((_, itemIndex) => itemIndex !== index)) }, item.src))) }) }), _jsx(DragOverlay, { children: activeItem && (_jsx("div", { className: "pe-photo-overlay", children: _jsx("img", { src: activeItem.src, alt: "" }) })) })] }))] }));
+}
+export function PageEditor({ page, onChange, onRefresh, pristine, pickMedia, pickMediaFiles, }) {
+    const [bodyState, setBodyState] = useState("idle");
+    const showBody = site().hasBody(page.type);
+    const isGallery = page.type === "gallery";
+    const isPortfolio = page.type === "portfolio";
+    /* APRENDO UNA PAGINA SI RILEGGE DAL REPO, non dal manifest pubblicato. */
+    const [loadedFor, setLoadedFor] = useState(null);
+    useEffect(() => {
+        if (loadedFor === page.slug || !pristine)
+            return;
+        let alive = true;
+        if (showBody)
+            setBodyState("loading");
+        api.pageBody(page.slug)
+            .then((data) => {
+            if (!alive)
+                return;
+            setLoadedFor(page.slug);
+            setBodyState("idle");
+            onRefresh({
+                ...page,
+                ...(data.page ?? {}),
+                slug: page.slug,
+                _orig: page._orig,
+                ...(showBody ? { body: data.body } : {}),
+            });
+        })
+            .catch(() => {
+            if (alive) {
+                setLoadedFor(page.slug);
+                setBodyState("error");
+            }
+        });
+        return () => { alive = false; };
+    }, [page.slug, showBody, pristine, loadedFor]);
+    const commonOmissions = useMemo(() => [
+        "title", "published", "inMenu",
+        "seoTitle", "seoDescription", "ogTitle", "ogDescription", "ogImage",
+    ], []);
+    /* Come la gallery: una pagina portfolio È la sua selezione di lavori, quindi la schermata
+       mostra quella e basta. Il `SchemaForm` generico qui elencava anche «Foto», «Edizioni»,
+       «Ritratto» e «Riconoscimenti» — campi di altri tipi di pagina, che compaiono perché il
+       form disegna tutto ciò che lo schema dichiara e non sa quale tipo si stia modificando.
+       Titolo, visibilità e SEO restano dove sono già: la barra in alto e la scheda SEO. */
+    if (isPortfolio) {
+        return (_jsxs("div", { className: "ed ed-portfolio", children: [bodyState === "error" && (_jsx("p", { className: "pe-load-error", children: "Non sono riuscito ad aggiornare i dati della pagina dal sito." })), _jsx(PortfolioWorksEditor, { value: page.works, onChange: (works) => onChange({ ...page, works }), pickMediaFiles: pickMediaFiles })] }));
+    }
+    /* Stessa ragione delle due qui sopra: la pagina "chi sono" ha un'anatomia sua — biografia,
+       ritratto, riconoscimenti — e il form generico ci metteva accanto «Lavori», «Edizioni» e
+       «Sezioni», cioè i campi delle altre tipologie. Il corpo markdown è la biografia, quindi la
+       textarea in fondo non serve più: sta dentro l'editor, in cima, dov'è il suo posto. */
+    if (page.type === "about") {
+        return (_jsx("div", { className: "ed ed-about", children: _jsx(AboutEditor, { page: page, onChange: onChange, bodyState: bodyState, pickMediaFiles: pickMediaFiles }) }));
+    }
+    /* La pagina workshop: l'introduzione e le edizioni, nell'ordine in cui escono sul sito —
+       l'introduzione apre la colonna dei testi, sopra la prima locandina (WORKSHOP.md). Il corpo
+       markdown è quell'introduzione, quindi non c'è nessuna textarea in fondo: sta in cima, dove
+       la si legge. */
+    if (page.type === "workshop") {
+        return (_jsxs("div", { className: "ed ed-workshop", children: [_jsxs("section", { className: "wsh-intro", "aria-label": "Introduzione", children: [_jsxs("header", { className: "pw-head", children: [_jsxs("div", { children: [_jsx("h3", { children: "Introduzione" }), _jsx("p", { children: "Il testo che apre la pagina, sopra la prima edizione." })] }), _jsx("span", { className: "ed-count", children: bodyState === "loading" ? "Carico…" : proseStats(String(page.body ?? "")) })] }), bodyState === "error" && (_jsx("p", { className: "ak-error", children: "Non sono riuscito a caricare il testo dal sito. Ricarica prima di modificarlo." })), _jsx(ProseField, { className: "pw-field ed-prose", value: typeof page.body === "string" ? page.body : "", placeholder: "Racconta i workshop.\nVai a capo per iniziare un paragrafo nuovo.", onChange: (body) => onChange({ ...page, body }) })] }), _jsx(WorkshopEditionsEditor, { value: page.workshops, onChange: (workshops) => onChange({ ...page, workshops }), pickMediaFiles: pickMediaFiles })] }));
+    }
+    if (isGallery) {
+        /* Le foto si modificano DOVE stanno: dentro il loro blocco, che è anche dove vivono nei dati
+           (`sections[].images`) e dove la griglia esce sul sito. Non c'è più un pannello staccato in
+           fondo — c'era finché le foto stavano in un campo della pagina, e insieme a lui è sparito
+           il caso in cui la stessa griglia si vedeva due volte. */
+        return (_jsxs("div", { className: "ed ed-gallery", children: [bodyState === "error" && (_jsx("p", { className: "pe-load-error", children: "Non sono riuscito ad aggiornare i dati della pagina dal sito." })), _jsx(GallerySectionsEditor, { value: page.sections, onChange: (sections) => onChange({ ...page, sections }), renderGallery: (images, onImages) => (_jsx(GalleryEditor, { value: images, onChange: onImages, pickMediaFiles: pickMediaFiles })), pickMediaFiles: pickMediaFiles })] }));
+    }
+    return (_jsxs("div", { className: "ed", children: [_jsx(SchemaForm, { shape: site().page, value: page, omit: commonOmissions, onChange: (next) => onChange({ ...next, slug: page.slug }), pickMedia: pickMedia, pickMediaFiles: pickMediaFiles }), showBody && (_jsxs("fieldset", { className: "ak-group", children: [_jsx("legend", { className: "ak-legend", children: "testo della pagina" }), bodyState === "loading" && _jsx("p", { className: "ak-hint", children: "Carico\u2026" }), bodyState === "error" && _jsx("p", { className: "ak-error", children: "Non sono riuscito a caricare il testo." }), _jsx("textarea", { className: "ak-input ak-textarea", rows: 12, value: typeof page.body === "string" ? page.body : "", onChange: (event) => onChange({ ...page, body: event.target.value }) })] }))] }));
+}

package/dist/app/routes/PageSeoEditor.d.ts

@@ -0,0 +1,13 @@
+import type { AssetFile } from "../../index.js";
+import type { PageModel } from "../lib/pages";
+import type { SiteSettings } from "../lib/settings";
+export declare function PageSeoEditor({ page, onChange, onRefresh, pristine, pickMediaFiles, siteSettings, }: {
+    page: PageModel;
+    onChange: (next: PageModel) => void;
+    onRefresh: (next: PageModel) => void;
+    pristine: boolean;
+    pickMediaFiles?: (o: {
+        multiple: boolean;
+    }) => Promise<AssetFile[] | null>;
+    siteSettings?: SiteSettings | null;
+}): import("react").JSX.Element;

package/dist/app/routes/PageSeoEditor.js

@@ -0,0 +1,102 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* Vista SEO della singola pagina.
+ *
+ * È una vista dell'editor, non un form separato: modifica lo stesso PageModel e usa lo stesso
+ * «Salva e pubblica». Le anteprime applicano gli stessi ripieghi del partial head.html:
+ * Open Graph -> SEO -> titolo editoriale / descrizione generale.
+ */
+import { useEffect, useState } from "react";
+import { api } from "../../index.js";
+import { Icon } from "../ui/icons";
+import { site } from "../site.js";
+/* ⚠️ Non costanti di modulo: `site()` è disponibile solo dopo `mountAdmin`, e un `const` qui
+ * verrebbe valutato all'import — cioè prima. Si leggono dentro il componente.
+ *
+ * `DEFAULT_DESCRIPTION` era «Luxury Hospitality & Food Photographer | Rome, Italy», cioè la
+ * descrizione di un cliente scritta dentro il motore. Il lucchetto NON l'aveva vista: cerca
+ * nomi, e quella riga non ne conteneva. Ora non serve più un valore di ripiego inventato — se
+ * il sito non ha né descrizione breve né descrizione lunga, l'anteprima mostra la stringa
+ * vuota, che è la verità: manca. */
+function text(value) {
+    return typeof value === "string" ? value : "";
+}
+function automaticImage(page) {
+    const sections = Array.isArray(page.sections) ? page.sections : [];
+    const sectionImage = sections.find((item) => item?.type === "image" && text(item?.image));
+    if (sectionImage)
+        return text(sectionImage.image);
+    // Le foto della gallery stanno DENTRO il loro blocco fra le sezioni, non in un campo della
+    // pagina: stessa catena di head.html, che qui va rispecchiata o l'anteprima mente.
+    const galleryImage = sections
+        .flatMap((item) => (Array.isArray(item?.images) ? item.images : []))
+        .find((item) => item?.hidden !== true && text(item?.src));
+    if (galleryImage)
+        return text(galleryImage.src);
+    const works = Array.isArray(page.works) ? page.works : [];
+    const work = works.find((item) => text(item?.cover));
+    if (work)
+        return text(work.cover);
+    const workshops = Array.isArray(page.workshops) ? page.workshops : [];
+    const workshop = workshops.find((item) => text(item?.image));
+    if (workshop)
+        return text(workshop.image);
+    return text(page.portrait);
+}
+function FieldHelp({ children, }) {
+    return _jsx("p", { className: "seo-help", children: children });
+}
+function Count({ value, recommended, max }) {
+    return (_jsxs("span", { className: "seo-count" + (value.length > recommended ? " is-long" : ""), children: [value.length, "/", max, " caratteri"] }));
+}
+export function PageSeoEditor({ page, onChange, onRefresh, pristine, pickMediaFiles, siteSettings, }) {
+    const [loadedFor, setLoadedFor] = useState(null);
+    const [loadError, setLoadError] = useState(false);
+    /* Arrivando direttamente a /seo la pagina normale non viene montata, quindi la lettura dal
+       repo si fa anche qui: l'anteprima non deve partire dal manifest pubblicato qualche minuto
+       prima. */
+    useEffect(() => {
+        if (loadedFor === page.slug || !pristine)
+            return;
+        let alive = true;
+        api.pageBody(page.slug)
+            .then((data) => {
+            if (!alive)
+                return;
+            setLoadedFor(page.slug);
+            setLoadError(false);
+            onRefresh({
+                ...page,
+                ...(data.page ?? {}),
+                slug: page.slug,
+                _orig: page._orig,
+            });
+        })
+            .catch(() => {
+            if (alive) {
+                setLoadedFor(page.slug);
+                setLoadError(true);
+            }
+        });
+        return () => { alive = false; };
+    }, [page.slug, pristine, loadedFor]);
+    const seoTitle = text(page.seoTitle);
+    const seoDescription = text(page.seoDescription);
+    const ogTitle = text(page.ogTitle);
+    const ogDescription = text(page.ogDescription);
+    const explicitImage = text(page.ogImage);
+    const globalTitle = siteSettings?.siteTitle || site().name;
+    const globalDescription = siteSettings?.shortDescription || siteSettings?.siteDescription || "";
+    const searchTitle = seoTitle || `${text(page.title)} — ${globalTitle}`;
+    const searchDescription = seoDescription || globalDescription;
+    const socialTitle = ogTitle || searchTitle;
+    const socialDescription = ogDescription || searchDescription;
+    const socialImage = explicitImage || automaticImage(page);
+    const pageUrl = `${site().publicBase}/${page.slug}/`;
+    const complete = !!seoTitle.trim() && !!seoDescription.trim() && !!socialImage;
+    const chooseImage = async () => {
+        const selected = await pickMediaFiles?.({ multiple: false });
+        if (selected?.[0])
+            onChange({ ...page, ogImage: selected[0].url });
+    };
+    return (_jsxs("section", { className: "seo-editor", children: [_jsxs("header", { className: "seo-intro", children: [_jsxs("div", { children: [_jsx("span", { className: "seo-kicker", children: "Impostazioni della pagina" }), _jsx("h2", { children: "Ottimizzazione SEO" }), _jsx("p", { children: "Controlla come questa pagina appare nei motori di ricerca e quando viene condivisa." })] }), _jsxs("span", { className: "seo-complete" + (complete ? " is-complete" : ""), children: [_jsx("span", { children: complete ? "✓" : "!" }), complete ? "SEO completa" : "Da completare"] })] }), loadError && (_jsx("p", { className: "pe-load-error", children: "Non sono riuscito ad aggiornare i dati SEO dal sito." })), _jsxs("section", { className: "seo-section", children: [_jsxs("div", { className: "seo-section-heading", children: [_jsx("span", { children: "Motori di ricerca" }), _jsxs("div", { children: [_jsx("h3", { children: "Anteprima del risultato" }), _jsx("p", { children: "Il contenuto si aggiorna mentre scrivi." })] })] }), _jsxs("div", { className: "seo-row seo-preview-row", children: [_jsx("span", { className: "seo-row-label", children: "Anteprima" }), _jsxs("div", { className: "seo-search-preview", "aria-label": "Anteprima del risultato di ricerca", children: [_jsx("span", { className: "seo-search-site", children: globalTitle }), _jsx("span", { className: "seo-search-url", children: pageUrl }), _jsx("strong", { children: searchTitle }), _jsx("p", { children: searchDescription })] }), _jsx(FieldHelp, { children: "\u00C8 una simulazione del risultato. Il motore di ricerca pu\u00F2 adattarne il testo." })] }), _jsxs("div", { className: "seo-row", children: [_jsxs("label", { className: "seo-field", children: [_jsx("span", { children: "Titolo SEO" }), _jsx("input", { value: seoTitle, maxLength: 120, placeholder: `${text(page.title)} — ${globalTitle}`, onChange: (event) => onChange({ ...page, seoTitle: event.target.value }) }), _jsx(Count, { value: seoTitle, recommended: 60, max: 120 })] }), _jsx(FieldHelp, { children: "Un titolo descrittivo e unico. Per una lettura completa nei risultati \u00E8 preferibile restare entro circa 60 caratteri." })] }), _jsxs("div", { className: "seo-row", children: [_jsxs("label", { className: "seo-field", children: [_jsx("span", { children: "Descrizione SEO" }), _jsx("textarea", { rows: 5, value: seoDescription, maxLength: 255, placeholder: "Descrivi il contenuto della pagina e il valore che offre.", onChange: (event) => onChange({ ...page, seoDescription: event.target.value }) }), _jsx(Count, { value: seoDescription, recommended: 160, max: 255 })] }), _jsx(FieldHelp, { children: "Riassumi la pagina con parole naturali e pertinenti. I primi 160 caratteri sono quelli che hanno pi\u00F9 probabilit\u00E0 di essere mostrati per intero." })] })] }), _jsxs("section", { className: "seo-section", children: [_jsxs("div", { className: "seo-section-heading", children: [_jsx("span", { children: "Open Graph" }), _jsxs("div", { children: [_jsx("h3", { children: "Anteprima della condivisione" }), _jsx("p", { children: "Usata da social, chat e applicazioni quando viene condiviso il link." })] })] }), _jsxs("div", { className: "seo-row seo-preview-row", children: [_jsx("span", { className: "seo-row-label", children: "Anteprima" }), _jsxs("article", { className: "seo-og-preview", "aria-label": "Anteprima Open Graph", children: [_jsx("div", { className: "seo-og-image", children: socialImage ? (_jsx("img", { src: socialImage, alt: "" })) : (_jsxs("span", { children: [_jsx(Icon.media, {}), " Nessuna immagine"] })) }), _jsxs("div", { className: "seo-og-copy", children: [_jsx("span", { children: site().publicBase.replace(/^https?:\/\//, "").toUpperCase() }), _jsx("strong", { children: socialTitle }), _jsx("p", { children: socialDescription })] })] }), _jsx(FieldHelp, { children: "L\u2019anteprima usa i campi Open Graph; quelli vuoti ereditano automaticamente i valori SEO." })] }), _jsxs("div", { className: "seo-row", children: [_jsxs("label", { className: "seo-field", children: [_jsx("span", { children: "Titolo Open Graph" }), _jsx("input", { value: ogTitle, maxLength: 120, placeholder: searchTitle, onChange: (event) => onChange({ ...page, ogTitle: event.target.value }) }), _jsx(Count, { value: ogTitle, recommended: 70, max: 120 })] }), _jsx(FieldHelp, { children: "Lascia vuoto per usare il titolo SEO. Puoi renderlo pi\u00F9 editoriale per la condivisione." })] }), _jsxs("div", { className: "seo-row", children: [_jsxs("label", { className: "seo-field", children: [_jsx("span", { children: "Descrizione Open Graph" }), _jsx("textarea", { rows: 4, value: ogDescription, maxLength: 300, placeholder: searchDescription, onChange: (event) => onChange({ ...page, ogDescription: event.target.value }) }), _jsx(Count, { value: ogDescription, recommended: 200, max: 300 })] }), _jsx(FieldHelp, { children: "Lascia vuoto per usare la descrizione SEO. Mantienila breve per evitare tagli nelle card." })] }), _jsxs("div", { className: "seo-row", children: [_jsxs("div", { className: "seo-field", children: [_jsx("span", { children: "Immagine Open Graph" }), _jsxs("div", { className: "seo-image-picker", children: [socialImage ? _jsx("img", { src: socialImage, alt: "" }) : _jsx("div", { children: _jsx(Icon.media, {}) }), _jsxs("div", { children: [_jsx("button", { type: "button", className: "ak-btn", onClick: () => void chooseImage(), children: explicitImage ? "Cambia immagine" : "Scegli immagine" }), explicitImage && (_jsx("button", { type: "button", className: "ak-btn ak-btn-quiet", onClick: () => onChange({ ...page, ogImage: "" }), children: "Usa automatica" })), _jsx("small", { children: explicitImage ? "Immagine personalizzata" : socialImage ? "Prima immagine pubblica della pagina" : "Nessun ripiego disponibile" })] })] })] }), _jsx(FieldHelp, { children: "Una foto orizzontale funziona meglio nelle condivisioni. Se non ne scegli una, viene usata la prima immagine pubblica della pagina." })] })] })] }));
+}

package/dist/app/routes/PagesList.d.ts

@@ -0,0 +1,10 @@
+import type { PageModel } from "../lib/pages";
+export declare function PagesList({ pages, current, onEdit, onChange, onRenamed, }: {
+    pages: PageModel[];
+    current?: string;
+    onEdit: (slug: string) => void;
+    onChange: (next: PageModel[]) => void;
+    /** Una rinomina cambia l'indirizzo: se la pagina è quella aperta nell'editor, la rotta punta
+     *  a uno slug che non esiste più e l'editor resterebbe vuoto. Lo sa solo chi tiene la rotta. */
+    onRenamed?: (from: string, to: string) => void;
+}): import("react").JSX.Element;

package/dist/app/routes/PagesList.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* Elenco delle pagine — la seconda colonna. Due gruppi: quelle nel menu e le altre.
+ *
+ * Da quando vive in una colonna accanto all'editor, la riga INTERA apre la pagina: il bottone
+ * "Modifica" era un bersaglio piccolo dentro una riga che sembrava già cliccabile, e con l'editor
+ * a fianco aprire è il gesto normale, non un'azione da confermare.
+ *
+ * Il riordino usa @dnd-kit invece di portare i gestori HTML5 del vecchio admin: quelli erano il
+ * codice più delicato di app.js (dragover, midpoint del cursore, dataTransfer) e non c'era
+ * niente da conservarci. Qui l'ordine è lo stato, e il peso lo ricalcola `positionWeight`.
+ */
+import { DndContext, closestCenter, PointerSensor, useSensor, useSensors } from "@dnd-kit/core";
+import { restrictToVerticalAxis } from "@dnd-kit/modifiers";
+import { SortableContext, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy, arrayMove } from "@dnd-kit/sortable";
+import { KeyboardSensor } from "@dnd-kit/core";
+import { CSS } from "@dnd-kit/utilities";
+import { RowMenu } from "./PageActions";
+import { uniqueSlug } from "../lib/slug";
+import { Icon } from "../ui/icons";
+const ICONS = {
+    gallery: Icon.gallery, page: Icon.doc, contact: Icon.mail,
+};
+function Row({ p, pages, current, onEdit, onChange, onRemove, onDuplicate }) {
+    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({ id: p.slug });
+    const TypeIcon = ICONS[String(p.type)] ?? Icon.doc;
+    return (_jsxs("li", { ref: setNodeRef, className: "pg-row" + (isDragging ? " is-dragging" : "") + (p.slug === current ? " is-on" : ""), style: { transform: CSS.Transform.toString(transform), transition }, children: [_jsx("button", { className: "pg-handle", ...attributes, ...listeners, title: "Trascina per riordinare", children: _jsx(Icon.grip, {}) }), _jsxs("button", { className: "pg-open", onClick: () => onEdit(p.slug), children: [_jsx("span", { className: "pg-icon", children: _jsx(TypeIcon, {}) }), _jsx("span", { className: "pg-title", children: String(p.title ?? p.slug) }), p.published === false && (_jsx("span", { className: "pg-off", title: "nascosta: non va online", children: _jsx(Icon.eyeOff, {}) }))] }), _jsx(RowMenu, { page: p, pages: pages, onChange: (next) => onChange(p.slug, next), onRemove: onRemove, onDuplicate: onDuplicate })] }));
+}
+function Group({ title, items, all, current, onEdit, onReorder, onChange, onRemove, onDuplicate, }) {
+    const sensors = useSensors(useSensor(PointerSensor, { activationConstraint: { distance: 4 } }), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }));
+    const onDragEnd = (e) => {
+        const { active, over } = e;
+        if (!over || active.id === over.id)
+            return;
+        onReorder(items.findIndex((p) => p.slug === active.id), items.findIndex((p) => p.slug === over.id));
+    };
+    return (_jsxs("section", { className: "pg-group", children: [_jsx("h2", { className: "pg-group-title", children: title }), items.length === 0 && _jsx("p", { className: "pg-empty", children: "nessuna" }), _jsx(DndContext, { sensors: sensors, collisionDetection: closestCenter, modifiers: [restrictToVerticalAxis], onDragEnd: onDragEnd, children: _jsx(SortableContext, { items: items.map((p) => p.slug), strategy: verticalListSortingStrategy, children: _jsx("ul", { className: "pg-list", children: items.map((p) => (_jsx(Row, { p: p, pages: all, current: current, onEdit: onEdit, onChange: onChange, onRemove: () => onRemove(p.slug), onDuplicate: () => onDuplicate(p.slug) }, p.slug))) }) }) })] }));
+}
+export function PagesList({ pages, current, onEdit, onChange, onRenamed, }) {
+    const inMenu = pages.filter((p) => !!p.inMenu);
+    const notInMenu = pages.filter((p) => !p.inMenu);
+    const reorder = (group, from, to) => {
+        const moved = arrayMove(group, from, to);
+        const other = group === inMenu ? notInMenu : inMenu;
+        onChange(group === inMenu ? [...moved, ...other] : [...other, ...moved]);
+    };
+    // Cambiare `inMenu` da qui deve anche spostare la pagina nell'altro gruppo, altrimenti
+    // resterebbe dov'era finché non si ricarica — e il peso, che dipende dal gruppo, sarebbe
+    // calcolato su una posizione che l'utente non vede.
+    //
+    // La pagina da sostituire si cerca con lo slug di PARTENZA (`from`), non con quello della
+    // versione nuova: la rinomina cambia anche lo slug, quindi cercando `next.slug` non trovava
+    // nessuna riga e l'elenco tornava identico — il nome nuovo spariva senza un errore.
+    const replace = (from, next) => {
+        onChange(pages.map((p) => (p.slug === from ? next : p)));
+        if (next.slug !== from)
+            onRenamed?.(from, next.slug);
+    };
+    const remove = (slug) => onChange(pages.filter((p) => p.slug !== slug));
+    const duplicate = (slug) => {
+        const src = pages.find((p) => p.slug === slug);
+        if (!src)
+            return;
+        const copia = {
+            ...structuredClone(src),
+            slug: uniqueSlug(`${src.slug}-copia`, pages.map((p) => p.slug)),
+            title: `${src.title} (copia)`,
+            inMenu: false, // una copia non entra nel menu da sola
+            published: false, // né va online prima che qualcuno l'abbia guardata
+            _orig: null, // pagina nuova: niente da cui conservare
+        };
+        const i = pages.indexOf(src);
+        onChange([...pages.slice(0, i + 1), copia, ...pages.slice(i + 1)]);
+    };
+    const shared = { all: pages, current, onEdit, onChange: replace, onRemove: remove, onDuplicate: duplicate };
+    return (_jsxs("div", { className: "pg", children: [_jsx(Group, { title: "Nel menu", items: inMenu, ...shared, onReorder: (f, t) => reorder(inMenu, f, t) }), _jsx(Group, { title: "Fuori dal menu", items: notInMenu, ...shared, onReorder: (f, t) => reorder(notInMenu, f, t) })] }));
+}

package/dist/app/routes/PortfolioWorksEditor.d.ts

@@ -0,0 +1,12 @@
+import type { AssetFile } from "../../index.js";
+import { normalizeWorks, type Work, type WorkCard, type WorkCardType, type WorkInfo } from "../../normalize.js";
+export type { WorkCardType, WorkInfo, WorkCard, Work };
+export { normalizeWorks };
+type Picker = (o: {
+    multiple: boolean;
+}) => Promise<AssetFile[] | null>;
+export declare function PortfolioWorksEditor({ value, onChange, pickMediaFiles }: {
+    value: unknown;
+    onChange: (next: Work[]) => void;
+    pickMediaFiles?: Picker;
+}): import("react").JSX.Element;