@jini-ai/admin 0.4.11 → 0.4.13

package/dist/seo/react/pages/SeoPage.js

@@ -1,9 +1,10 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useAnalyzePanel, useSeoDefaults, useSeoTabs, seoTabPanel } from "../hooks/SeoPage.hooks.js";
 import { agentHandle } from "@jini-ai/agentic";
 import { TabBar } from "@jini-ai/ui/tab-strip";
+import { InfoTip, Select } from "@jini-ai/ui/admin-widgets";
 import { useSeoCopy, useSeoOptions } from "../hooks/SeoPorts.hooks.js";
-import { actionLabel, orEmpty } from "../../rules.js";
+import { actionLabel, orEmpty, xIsCustomized, xResolvedValue } from "../../rules.js";
 import { useWiredEntryPicker } from "../hooks/use-entry-picker.hooks.js";
 import { useWiredSeoEntryPanel } from "../hooks/use-seo-entry-panel.hooks.js";
 import { useSeoEntrySection } from "../hooks/use-seo-entry-section.hooks.js";
@@ -29,31 +30,27 @@ import { SitemapModal } from "../components/SitemapModal.js";
  * overrides", which sits INSIDE the "Per-entry SEO" section — keeps its own `<h3>` and is not
  * routed through here.
  */
-function SeoSection({ title, children }) {
-    return (_jsxs("section", { className: "jini-seo-section", children: [_jsx("div", { className: "jini-seo-section-head", children: _jsx("h2", { className: "jini-seo-section-title", children: title }) }), _jsx("div", { className: "jini-seo-section-body", children: children })] }));
+function SeoSection({ title, tip, children }) {
+    return (_jsxs("section", { className: "jini-seo-section", children: [_jsx("div", { className: "jini-seo-section-head", children: _jsxs("h2", { className: "jini-seo-section-title", children: [title, tip ? _jsx(InfoTip, { label: tip }) : null] }) }), _jsx("div", { className: "jini-seo-section-body", children: children })] }));
 }
-/** Dropdown over every post + page, sourced from the already-existing `listPosts`/`listPages`
- * routes — cheapest entry-selection UX available given what's already built (REQ-06). */
+/** Searchable picker over every page + post, sourced from the already-existing `listPosts`/`listPages`
+ * routes (REQ-06). It was a native `<select>`; with a few dozen entries that opened as one tall OS
+ * list with "(published)" after every row (owner, 2026-10-15: "we have a searchable dropdown
+ * right?"). The shared admin-widgets `Select` already types-to-filter and handles the keyboard, so
+ * rows are just grouped Pages/Posts with a pill only for the non-published exceptions
+ * (`entryPickerOptions` in `rules.ts`). */
 function EntryPicker({ locale, entryId, onChange, useEntryPickerHook = useWiredEntryPicker }) {
     const t = useSeoCopy();
-    const { entries, error } = useEntryPickerHook();
+    const { entries, options, error } = useEntryPickerHook();
     if (error)
         return _jsx("div", { className: "jini-notice jini-notice-error", children: error });
     if (!entries)
         return _jsx("div", { className: "jini-notice", children: t({ locale: locale, key: "Loading entries…" }) });
     /* The "Entry" caption is no longer painted (owner, 2026-09-06: "you can actually just get rid of
-       'Entry'") — the placeholder option already says "Choose an entry…", so the visible word was
-       saying it twice, and with no gap between the two it read as one smashed-together control.
-       It stays a REAL label rather than becoming a placeholder-only select: this is the exact
-       `<label class="a11y-label-wrap">` + `.visually-hidden` idiom `styles/editor.css` documents for
-       the four controls a previous accessibility pass found unnamed — including, by name, a
-       `<select>` with no accessible name at all. `display: contents` drops the wrapper's own box, so
-       the select keeps the section body's sizing exactly as if the label were not there.
-       The i18n key is unchanged and still passed through `t`, so nothing dangles. */
-    return (_jsxs("label", { className: "jini-a11y-label-wrap", children: [_jsx("span", { className: "jini-visually-hidden", children: t({ locale: locale, key: "Entry" }) }), _jsxs("select", { className: "jini-select", value: entryId, onChange: (e) => onChange(e.target.value), ...agentHandle({ handle: "seo-entry-picker" }, {
-                    role: "field",
-                    label: "Choose which page or post to edit or analyze SEO for",
-                }), children: [_jsx("option", { value: "", children: t({ locale: locale, key: "Choose an entry…" }) }), entries.map((entry) => (_jsxs("option", { value: entry.id, children: [entry.title, " (", entry.status, ")"] }, entry.id)))] })] }));
+       'Entry'") — the placeholder already says "Choose an entry…", so the visible word was saying it
+       twice. It stays the control's accessible name (now `aria-label` on the combobox trigger) rather
+       than leaving a placeholder-only control with no name at all. The i18n key is unchanged. */
+    return (_jsx("div", { className: "jini-seo-entry-picker", children: _jsx(Select, { value: entryId, onChange: onChange, options: options ?? [], placeholder: t({ locale: locale, key: "Choose an entry…" }), "aria-label": t({ locale: locale, key: "Entry" }), agentHandle: "seo-entry-picker", translate: (key) => t({ locale, key }) }) }));
 }
 /** Read-only score + issues view (REQ-07) — exact field names read off `SeoAnalysis`/`SeoIssue`
  * (`src/seo/types.ts`), not guessed. No state of its own — only the severity sort, which lives in
@@ -61,8 +58,11 @@ function EntryPicker({ locale, entryId, onChange, useEntryPickerHook = useWiredE
 function AnalyzePanel(props) {
     const t = useSeoCopy();
     const { locale } = props;
-    const { sortedIssues } = useAnalyzePanel({ analysis: props.analysis });
-    return (_jsxs("div", { className: "jini-seo-analyze-panel", children: [_jsx("h3", { children: t({ locale: locale, key: "Analysis" }) }), _jsxs("p", { children: [t({ locale: locale, key: "Score:" }), " ", _jsx("strong", { children: props.analysis.score })] }), sortedIssues.length === 0 ? (_jsx("p", { className: "jini-muted-cell", children: t({ locale: locale, key: "No issues." }) })) : (_jsx("ul", { children: sortedIssues.map((issue, i) => (_jsxs("li", { children: [_jsx("span", { className: `jini-status jini-status-${issue.severity === "error" ? "failure" : issue.severity === "warning" ? "unavailable" : "success"}`, children: issue.severity }), " ", _jsx("code", { children: issue.code }), issue.field ? _jsxs("span", { className: "jini-muted-cell", children: [" (", issue.field, ")"] }) : null, " \u2014 ", issue.message] }, `${issue.code}-${i}`))) }))] }));
+    const { sortedIssues, tone } = useAnalyzePanel({ analysis: props.analysis });
+    /* Heading + score pill on one line, issues as a compact list (owner, 2026-10-15: the bare
+       "Score: 100 / No issues." read as unstyled text). The pill reuses the issue pills' status
+       tones, so the score and the issues under it speak one colour language. */
+    return (_jsxs("section", { className: "jini-seo-analyze-panel", "aria-labelledby": "seo-analysis-heading", children: [_jsxs("div", { className: "jini-seo-analyze-head", children: [_jsx("h3", { id: "seo-analysis-heading", children: t({ locale: locale, key: "Analysis" }) }), _jsxs("span", { className: `jini-status jini-status-${tone} jini-seo-score`, children: [t({ locale: locale, key: "Score:" }), " ", _jsx("strong", { children: props.analysis.score })] })] }), sortedIssues.length === 0 ? (_jsx("p", { className: "jini-seo-analyze-empty", children: t({ locale: locale, key: "No issues." }) })) : (_jsx("ul", { className: "jini-seo-issues", children: sortedIssues.map((issue, i) => (_jsxs("li", { className: "jini-seo-issue", children: [_jsx("span", { className: `jini-status jini-status-${issue.severity === "error" ? "failure" : issue.severity === "warning" ? "warning" : "success"}`, children: issue.severity }), _jsxs("span", { className: "jini-seo-issue-text", children: [issue.message, issue.field ? _jsxs("span", { className: "jini-muted-cell", children: [" (", issue.field, ")"] }) : null] })] }, `${issue.code}-${i}`))) }))] }));
 }
 /** Per-entry overrides edit form (REQ-06). Pre-fills from `getSeoEntry`'s resolved meta, but
  * tracks which fields the user actually touched so `putSeoEntry` only ever sends a genuine
@@ -80,14 +80,36 @@ function AnalyzePanel(props) {
 // the ceiling on their own. There is nothing to extract: splitting the eleven fields into their own
 // components would still evaluate the same fallback chains, just spread across more functions, for
 // no complexity benefit and a real loss of "one form, one place to read its fields."
+// 2026-10-15: now 27 — the X fields' placeholders (the live social preview value) add two more
+// flat `??` fallbacks of exactly that kind.
+// 2026-10-20: exemption retired under the ≤10/≤10 bar — the head row, the "Search appearance"
+// group, the "Social preview" group and its X disclosure are now their own components below, each
+// scoring ≤10. The fallback chains themselves are unchanged and still read in form order.
 function SeoEntryPanel({ locale, entryId, useSeoEntryPanelHook = useWiredSeoEntryPanel }) {
     const t = useSeoCopy();
-    const { resolved, analysis, loadError, saving, saveError, notice, fieldValue, setField, save, touched } = useSeoEntryPanelHook({ entryId });
+    const { resolved, analysis, loadError, saving, saveError, notice, fieldValue, setField, save, touched, ogImageInherited = false } = useSeoEntryPanelHook({ entryId });
     if (loadError)
         return _jsx("div", { className: "jini-notice jini-notice-error", children: loadError });
     if (!resolved)
         return _jsx("div", { className: "jini-notice", children: t({ locale: locale, key: "Loading entry SEO…" }) });
-    return (_jsxs("div", { className: "jini-seo-entry-panel", children: [_jsx("h3", { children: t({ locale: locale, key: "Per-entry overrides" }) }), _jsxs("p", { className: "jini-muted-cell", children: [t({ locale: locale, key: "Fields show the currently-effective value (author override, or site default, or derived from the entry). Only fields you change here are saved as overrides." }), " ", t({ locale: locale, key: "Empty a field and save to remove its override — the entry falls back to the site default." })] }), notice ? _jsx("div", { className: "jini-notice", children: notice }) : null, saveError ? (_jsx("div", { className: "jini-notice jini-notice-error", role: "alert", children: saveError })) : null, _jsxs("label", { children: [t({ locale: locale, key: "Title" }), _jsx("input", { className: "jini-input", value: fieldValue("title", resolved.title) ?? "", onChange: (e) => setField("title", e.target.value), ...agentHandle({ handle: "seo-entry-title" }, { role: "field", label: "This entry's SEO title override" }) })] }), _jsxs("label", { children: [t({ locale: locale, key: "Description" }), _jsx("textarea", { className: "jini-textarea", value: fieldValue("description", resolved.description ?? "") ?? "", onChange: (e) => setField("description", e.target.value), ...agentHandle({ handle: "seo-entry-description" }, { role: "field", label: "This entry's SEO description override" }) })] }), _jsxs("label", { children: [t({ locale: locale, key: "Canonical URL" }), _jsx("input", { className: "jini-input", value: fieldValue("canonical", resolved.canonical) ?? "", onChange: (e) => setField("canonical", e.target.value), ...agentHandle({ handle: "seo-entry-canonical" }, { role: "field", label: "This entry's canonical URL override" }) })] }), _jsxs("label", { children: [_jsx("input", { className: "jini-input", type: "checkbox", checked: fieldValue("noindex", resolved.robots.noindex) ?? false, onChange: (e) => setField("noindex", e.target.checked), ...agentHandle({ handle: "seo-entry-noindex" }, { role: "checkbox", label: "Override this entry's robots noindex directive" }) }), t({ locale: locale, key: "Noindex" })] }), _jsxs("label", { children: [_jsx("input", { className: "jini-input", type: "checkbox", checked: fieldValue("nofollow", resolved.robots.nofollow) ?? false, onChange: (e) => setField("nofollow", e.target.checked), ...agentHandle({ handle: "seo-entry-nofollow" }, { role: "checkbox", label: "Override this entry's robots nofollow directive" }) }), t({ locale: locale, key: "Nofollow" })] }), _jsxs("label", { children: [t({ locale: locale, key: "OG title" }), _jsx("input", { className: "jini-input", value: fieldValue("ogTitle", resolved.openGraph.title) ?? "", onChange: (e) => setField("ogTitle", e.target.value), ...agentHandle({ handle: "seo-entry-og-title" }, { role: "field", label: "This entry's Open Graph title override" }) })] }), _jsxs("label", { children: [t({ locale: locale, key: "OG description" }), _jsx("input", { className: "jini-input", value: fieldValue("ogDescription", resolved.openGraph.description ?? "") ?? "", onChange: (e) => setField("ogDescription", e.target.value), ...agentHandle({ handle: "seo-entry-og-description" }, { role: "field", label: "This entry's Open Graph description override" }) })] }), _jsx(MediaRefField, { locale: locale, id: "seo-entry-og-image", label: t({ locale: locale, key: "OG image" }), value: fieldValue("ogImage", resolved.openGraph.imageRef ?? resolved.openGraph.image ?? "") ?? "", onChange: (value) => setField("ogImage", value), agentHandle: "seo-entry-og-image" }), _jsxs("label", { children: [t({ locale: locale, key: "Twitter title" }), _jsx("input", { className: "jini-input", value: fieldValue("twitterTitle", resolved.twitter.title) ?? "", onChange: (e) => setField("twitterTitle", e.target.value), ...agentHandle({ handle: "seo-entry-twitter-title" }, { role: "field", label: "This entry's Twitter card title override" }) })] }), _jsxs("label", { children: [t({ locale: locale, key: "Twitter description" }), _jsx("input", { className: "jini-input", value: fieldValue("twitterDescription", resolved.twitter.description ?? "") ?? "", onChange: (e) => setField("twitterDescription", e.target.value), ...agentHandle({ handle: "seo-entry-twitter-description" }, { role: "field", label: "This entry's Twitter card description override" }) })] }), _jsx(MediaRefField, { locale: locale, id: "seo-entry-twitter-image", label: t({ locale: locale, key: "Twitter image" }), value: fieldValue("twitterImage", resolved.twitter.imageRef ?? resolved.twitter.image ?? "") ?? "", onChange: (value) => setField("twitterImage", value), agentHandle: "seo-entry-twitter-image" }), _jsx("span", { className: "jini-editor-actions", children: _jsx("button", { type: "button", className: "jini-btn jini-btn-secondary", onClick: save, disabled: saving || Object.keys(touched).length === 0, ...agentHandle({ handle: "seo-entry-save-overrides" }, { role: "button", label: "Save this entry's SEO overrides" }), children: saving ? t({ locale: locale, key: "Saving…" }) : t({ locale: locale, key: "Save overrides" }) }) }), analysis ? _jsx(AnalyzePanel, { locale: locale, analysis: analysis }) : null] }));
+    const fields = { locale, t, resolved, fieldValue, setField };
+    return (_jsxs("div", { className: "jini-seo-entry-panel", children: [_jsx(SeoEntryHead, { locale: locale, t: t, saving: saving, touched: touched, save: save }), notice ? _jsx("div", { className: "jini-notice", children: notice }) : null, saveError ? (_jsx("div", { className: "jini-notice jini-notice-error", role: "alert", children: saveError })) : null, _jsx(SeoEntrySearchFields, { ...fields }), _jsx(SeoEntrySocialFields, { ...fields, ogImageInherited: ogImageInherited }), analysis ? _jsx(AnalyzePanel, { locale: locale, analysis: analysis }) : null] }));
+}
+/** Sticky heading row: title, the ⓘ explanation and Save (disabled while saving or with nothing touched). */
+function SeoEntryHead({ locale, t, saving, touched, save }) {
+    return (_jsx(_Fragment, { children: _jsx("div", { className: "jini-seo-entry-head", children: _jsxs("div", { className: "jini-seo-entry-head-bar", children: [_jsx("h3", { children: t({ locale: locale, key: "Per-entry overrides" }) }), _jsx(InfoTip, { label: `${t({ locale: locale, key: "Fields show the currently-effective value (author override, or site default, or derived from the entry). Only fields you change here are saved as overrides." })} ${t({ locale: locale, key: "Empty a field and save to remove its override — the entry falls back to the site default." })}` }), _jsx("span", { className: "jini-seo-entry-head-actions", children: _jsx("button", { type: "button", className: "jini-btn", onClick: save, disabled: saving || Object.keys(touched).length === 0, ...agentHandle({ handle: "seo-entry-save-overrides" }, { role: "button", label: "Save this entry's SEO overrides" }), children: saving ? t({ locale: locale, key: "Saving…" }) : t({ locale: locale, key: "Save overrides" }) }) })] }) }) }));
+}
+/** "Search appearance": title, description, canonical URL and the two robots checkboxes. */
+function SeoEntrySearchFields({ locale, t, resolved, fieldValue, setField }) {
+    return (_jsx(_Fragment, { children: _jsxs("fieldset", { className: "jini-seo-entry-group", children: [_jsx("legend", { children: t({ locale: locale, key: "Search appearance" }) }), _jsxs("label", { children: [t({ locale: locale, key: "Title" }), _jsx("input", { className: "jini-input", value: fieldValue("title", resolved.title) ?? "", onChange: (e) => setField("title", e.target.value), ...agentHandle({ handle: "seo-entry-title" }, { role: "field", label: "This entry's SEO title override" }) })] }), _jsxs("label", { children: [t({ locale: locale, key: "Description" }), _jsx("textarea", { className: "jini-textarea", value: fieldValue("description", resolved.description ?? "") ?? "", onChange: (e) => setField("description", e.target.value), ...agentHandle({ handle: "seo-entry-description" }, { role: "field", label: "This entry's SEO description override" }) })] }), _jsxs("label", { children: [t({ locale: locale, key: "Canonical URL" }), _jsx("input", { className: "jini-input", value: fieldValue("canonical", resolved.canonical) ?? "", onChange: (e) => setField("canonical", e.target.value), ...agentHandle({ handle: "seo-entry-canonical" }, { role: "field", label: "This entry's canonical URL override" }) })] }), _jsxs("div", { className: "jini-seo-entry-checks", children: [_jsxs("label", { children: [_jsx("input", { className: "jini-input", type: "checkbox", checked: fieldValue("noindex", resolved.robots.noindex) ?? false, onChange: (e) => setField("noindex", e.target.checked), ...agentHandle({ handle: "seo-entry-noindex" }, { role: "checkbox", label: "Override this entry's robots noindex directive" }) }), t({ locale: locale, key: "Noindex" })] }), _jsxs("label", { children: [_jsx("input", { className: "jini-input", type: "checkbox", checked: fieldValue("nofollow", resolved.robots.nofollow) ?? false, onChange: (e) => setField("nofollow", e.target.checked), ...agentHandle({ handle: "seo-entry-nofollow" }, { role: "checkbox", label: "Override this entry's robots nofollow directive" }) }), t({ locale: locale, key: "Nofollow" })] })] })] }) }));
+}
+/** "Social preview": the Open Graph fields plus the optional X/Twitter disclosure. */
+function SeoEntrySocialFields({ locale, t, resolved, fieldValue, setField, ogImageInherited }) {
+    return (_jsx(_Fragment, { children: _jsxs("fieldset", { className: "jini-seo-entry-group", children: [_jsxs("legend", { children: [t({ locale: locale, key: "Social preview" }), _jsx(InfoTip, { label: t({ locale: locale, key: "Used by Facebook, LinkedIn, Slack, Discord, iMessage, WhatsApp and X/Twitter" }) })] }), _jsxs("label", { children: [t({ locale: locale, key: "Preview title" }), _jsx("input", { className: "jini-input", value: fieldValue("ogTitle", resolved.openGraph.title) ?? "", onChange: (e) => setField("ogTitle", e.target.value), ...agentHandle({ handle: "seo-entry-og-title" }, { role: "field", label: "This entry's Open Graph title override" }) })] }), _jsxs("label", { children: [t({ locale: locale, key: "Preview description" }), _jsx("input", { className: "jini-input", value: fieldValue("ogDescription", resolved.openGraph.description ?? "") ?? "", onChange: (e) => setField("ogDescription", e.target.value), ...agentHandle({ handle: "seo-entry-og-description" }, { role: "field", label: "This entry's Open Graph description override" }) })] }), _jsx(MediaRefField, { locale: locale, id: "seo-entry-og-image", label: t({ locale: locale, key: "Preview image" }), value: fieldValue("ogImage", resolved.openGraph.imageRef ?? resolved.openGraph.image ?? "") ?? "", onChange: (value) => setField("ogImage", value), inherited: ogImageInherited, agentHandle: "seo-entry-og-image" }), _jsx(SeoEntryXFields, { locale: locale, t: t, resolved: resolved, fieldValue: fieldValue, setField: setField })] }) }));
+}
+/** The X/Twitter disclosure inside "Social preview". */
+function SeoEntryXFields({ locale, t, resolved, fieldValue, setField }) {
+    return (_jsx(_Fragment, { children: _jsxs("details", { className: "jini-seo-x-disclosure", open: xIsCustomized({ meta: resolved }), children: [_jsx("summary", { children: t({ locale: locale, key: "Customize for X/Twitter (optional)" }) }), _jsxs("div", { className: "jini-seo-x-fields", children: [_jsxs("label", { children: [t({ locale: locale, key: "X/Twitter title" }), _jsx("input", { className: "jini-input", value: fieldValue("twitterTitle", xResolvedValue({ key: "twitterTitle", meta: resolved })) ?? "", placeholder: fieldValue("ogTitle", resolved.openGraph.title) ?? "", onChange: (e) => setField("twitterTitle", e.target.value), ...agentHandle({ handle: "seo-entry-twitter-title" }, { role: "field", label: "This entry's Twitter card title override" }) })] }), _jsxs("label", { children: [t({ locale: locale, key: "X/Twitter description" }), _jsx("input", { className: "jini-input", value: fieldValue("twitterDescription", xResolvedValue({ key: "twitterDescription", meta: resolved })) ?? "", placeholder: fieldValue("ogDescription", resolved.openGraph.description ?? "") ?? "", onChange: (e) => setField("twitterDescription", e.target.value), ...agentHandle({ handle: "seo-entry-twitter-description" }, { role: "field", label: "This entry's Twitter card description override" }) })] }), _jsx(MediaRefField, { locale: locale, id: "seo-entry-twitter-image", label: t({ locale: locale, key: "X/Twitter image" }), value: fieldValue("twitterImage", xResolvedValue({ key: "twitterImage", meta: resolved })) ?? "", emptyHint: t({ locale: locale, key: "Same as the preview image" }), onChange: (value) => setField("twitterImage", value), agentHandle: "seo-entry-twitter-image" })] })] }) }));
 }
 /** Section wrapper (REQ-06/07) — entry picker over the per-entry edit + analyze panels. This IS the
  *  "Pages & posts" tab panel; it kept its name and its markup, because nothing about it changed
@@ -99,7 +121,7 @@ function SeoEntryPanel({ locale, entryId, useSeoEntryPanelHook = useWiredSeoEntr
  *  and nothing else — the exact regression `deployment/HistoryTab.tsx`'s own comment records
  *  measuring live on its tab. It is also not a duplicate: the tab reads "Pages & posts" (what you
  *  pick from), the heading reads "Per-entry SEO" (what you are editing). */
-export function SeoEntrySection({ locale, useSeoEntrySectionHook = useSeoEntrySection }, _optional = {}) {
+export function SeoEntrySection({ locale, useSeoEntrySectionHook = useSeoEntrySection }) {
     const t = useSeoCopy();
     const { entryId, setEntryId } = useSeoEntrySectionHook();
     return (_jsx("div", { className: "jini-seo-panel jini-seo-panel--full jini-seo-entry-section", ...agentHandle({ handle: "seo-per-entry" }, {
@@ -126,7 +148,7 @@ export function SeoEntrySection({ locale, useSeoEntrySectionHook = useSeoEntrySe
  * inline `??`/`||` field reads — same fields, same fallbacks, same payload, just not written in the
  * `.tsx`.
  */
-export function SeoDefaultsTab({ controller }, _optional = {}) {
+export function SeoDefaultsTab({ controller }) {
     const t = useSeoCopy();
     const { locale, settings, saving, defaultOgImage, setDefaultOgImage } = controller;
     const { submit } = useSeoDefaults({ save: controller.save });
@@ -139,7 +161,7 @@ export function SeoDefaultsTab({ controller }, _optional = {}) {
                                 }) })] }), _jsxs("div", { className: "jini-field", children: [_jsx("label", { className: "jini-field-label", htmlFor: "seo-default-description", children: t({ locale: locale, key: "Default meta description" }) }), _jsx("textarea", { className: "jini-textarea", id: "seo-default-description", name: "defaultDescription", defaultValue: orEmpty({ value: settings.defaultDescription }), ...agentHandle({ handle: "seo-default-description" }, {
                                     role: "field",
                                     label: "Fallback meta description for pages that set none of their own",
-                                }) })] })] }), _jsxs(SeoSection, { title: t({ locale: locale, key: "Social sharing" }), children: [_jsx(MediaRefField, { locale: locale, id: "seo-default-og-image", name: "defaultOgImage", label: t({ locale: locale, key: "Default Open Graph / Twitter image" }), value: defaultOgImage, onChange: setDefaultOgImage, agentHandle: "seo-default-og-image" }), _jsxs("div", { className: "jini-field", children: [_jsx("label", { className: "jini-field-label", htmlFor: "seo-twitter-site", children: t({ locale: locale, key: "Twitter @site handle" }) }), _jsx("input", { className: "jini-input", id: "seo-twitter-site", name: "twitterSite", defaultValue: orEmpty({ value: settings.twitterSite }), ...agentHandle({ handle: "seo-twitter-site" }, {
+                                }) })] })] }), _jsxs(SeoSection, { title: t({ locale: locale, key: "Social preview" }), tip: t({ locale: locale, key: "Used by Facebook, LinkedIn, Slack, Discord, iMessage, WhatsApp and X/Twitter" }), children: [_jsx(MediaRefField, { locale: locale, id: "seo-default-og-image", name: "defaultOgImage", label: t({ locale: locale, key: "Default preview image" }), value: defaultOgImage, onChange: setDefaultOgImage, agentHandle: "seo-default-og-image" }), _jsxs("div", { className: "jini-field", children: [_jsx("label", { className: "jini-field-label", htmlFor: "seo-twitter-site", children: t({ locale: locale, key: "X/Twitter @handle" }) }), _jsx("input", { className: "jini-input", id: "seo-twitter-site", name: "twitterSite", defaultValue: orEmpty({ value: settings.twitterSite }), ...agentHandle({ handle: "seo-twitter-site" }, {
                                     role: "field",
                                     label: "The site's Twitter @handle, used in Twitter card metadata",
                                 }) })] })] }), _jsxs(SeoSection, { title: t({ locale: locale, key: "Crawling" }), children: [_jsxs("label", { className: "jini-form-checkbox-field", children: [_jsx("input", { className: "jini-input", type: "checkbox", name: "noindex", defaultChecked: settings.defaultRobots.noindex, ...agentHandle({ handle: "seo-default-noindex" }, {
@@ -173,7 +195,7 @@ export function SeoDefaultsTab({ controller }, _optional = {}) {
  * It also has to exist at all — a `role="tab"` button is not in a screen reader's heading list, so
  * a panel with no `<h2>` leaves that reader nothing but the page `H1`.
  */
-export function SeoSitemapTab({ controller }, _optional = {}) {
+export function SeoSitemapTab({ controller }) {
     const t = useSeoCopy();
     const { locale, settings, saving, regenerateSitemap, openSitemapModal } = controller;
     return (_jsx("div", { className: "jini-seo-panel jini-seo-panel--full", ...agentHandle({ handle: "seo-sitemap" }, {
@@ -187,7 +209,7 @@ export function SeoSitemapTab({ controller }, _optional = {}) {
                                 label: "Open a modal showing the sitemap's URLs, or its raw XML",
                             }), children: t({ locale: locale, key: "View sitemap" }) })] })] }) }));
 }
-export function Seo({ tabId, onTabChange, useSeoHook = useWiredSeo } = {}, _optional = {}) {
+export function Seo({ tabId, onTabChange, useSeoHook = useWiredSeo } = {}) {
     const t = useSeoCopy();
     const { headerActions } = useSeoOptions();
     const { changeTab } = useSeoPageActions({ onTabChange });
@@ -208,7 +230,7 @@ export function Seo({ tabId, onTabChange, useSeoHook = useWiredSeo } = {}, _opti
         regenerateSitemap,
         openSitemapModal,
     };
-    return (_jsxs("div", { className: "jini-page jini-seo-page", children: [_jsxs("div", { className: "jini-page-header", children: [_jsxs("div", { className: "jini-page-header-text", children: [_jsx("p", { className: "jini-page-kicker", children: t({ locale: locale, key: "Marketing" }) }), _jsx("h1", { className: "jini-page-title", children: "SEO" }), _jsx("p", { className: "jini-page-description", children: t({ locale: locale, key: "Site-wide defaults for meta titles, descriptions, Open Graph/Twitter cards, and robots directives." }) })] }), _jsx("div", { className: "jini-page-actions", children: headerActions })] }), error ? _jsx("div", { className: "jini-notice jini-notice-error", children: error }) : null, notice ? _jsx("div", { className: "jini-notice", children: notice }) : null, _jsx(TabBar, { ariaLabel: "SEO", tabs: tabs, activeId: activeTabId, onChange: changeTab, containerHandle: "seo-tab-bar" }), seoTabPanel({ activeTabId, controller, components: { SeoDefaultsTab, SeoSitemapTab, SeoEntrySection } }), sitemapModalOpen ? (_jsx(SitemapModal, { locale: locale, sitemapEnabled: settings.sitemapEnabled, regenerating: saving, onRegenerate: regenerateSitemap, onClose: closeSitemapModal })) : null] }));
+    return (_jsxs("div", { className: "jini-page jini-seo-page", children: [_jsxs("div", { className: "jini-page-header", children: [_jsxs("div", { className: "jini-page-header-text", children: [_jsx("p", { className: "jini-page-kicker", children: t({ locale: locale, key: "Marketing" }) }), _jsx("h1", { className: "jini-page-title", children: "SEO" }), _jsx("p", { className: "jini-page-description", children: t({ locale: locale, key: "Site-wide defaults for meta titles, descriptions, social previews, and robots directives." }) })] }), _jsx("div", { className: "jini-page-actions", children: headerActions })] }), error ? _jsx("div", { className: "jini-notice jini-notice-error", children: error }) : null, notice ? _jsx("div", { className: "jini-notice", children: notice }) : null, _jsx(TabBar, { ariaLabel: "SEO", tabs: tabs, activeId: activeTabId, onChange: changeTab, containerHandle: "seo-tab-bar" }), seoTabPanel({ activeTabId, controller, components: { SeoDefaultsTab, SeoSitemapTab, SeoEntrySection } }), sitemapModalOpen ? (_jsx(SitemapModal, { locale: locale, sitemapEnabled: settings.sitemapEnabled, regenerating: saving, onRegenerate: regenerateSitemap, onClose: closeSitemapModal })) : null] }));
 }
 export { Seo as SeoPage };
 export default Seo;

package/dist/seo/rules.d.ts

@@ -1,5 +1,6 @@
 import type { AdminSeoIssue as SeoIssue, AdminSeoSettingsPatch as SeoSettingsPatch } from "../core/ports/seo.js";
 import type { SeoTranslator } from './models.js';
+import type { AdminSeoEntryChoice, AdminSeoMediaSummary, AdminSeoMeta } from '../core/ports/seo.js';
 /**
  * Orders issues error-first, then warning, then info, matching the severities' natural urgency.
  * An unrecognized severity sorts last (falls back to `9`) rather than throwing, since this reads
@@ -37,6 +38,36 @@ export declare function overrideOrClear<V>({ value }: {
 export declare function orEmpty({ value }: {
     value: string | undefined;
 }, _optional?: Record<string, never>): string;
+/** The X (twitter) fields the "Customize for X/Twitter" disclosure holds, each paired with the social
+ *  preview (Open Graph) value it falls back to. */
+export type SeoXFieldKey = 'twitterTitle' | 'twitterDescription' | 'twitterImage';
+/** Whether this entry's X card differs from its social preview in any field — i.e. an X override
+ *  is in effect, so the "Customize for X/Twitter" disclosure opens on load. (2026-10-15, owner: one
+ *  generic social preview, X only as an optional customization.)
+ *  @complexity O(1). */
+export declare function xIsCustomized({ meta }: {
+    meta: AdminSeoMeta;
+}, _optional?: Record<string, never>): boolean;
+/** An X field's untouched box value, handed to `fieldValue` as its resolved value (so a pending
+ *  edit or clear still wins there). An X value equal to the social preview's is inherited, so the
+ *  box stays empty and its placeholder shows the live social value — typing there is what creates
+ *  an X override.
+ *  @complexity O(1). */
+export declare function xResolvedValue({ key, meta }: {
+    key: SeoXFieldKey;
+    meta: AdminSeoMeta;
+}, _optional?: Record<string, never>): string;
+/** The X field an edit to a social preview field should carry along: when X still shows the
+ *  preview's value and has no pending edit of its own, the edit also clears X's stored override so
+ *  X keeps following the preview after save. Without it, an X override saved equal to the preview
+ *  (indistinguishable here, the screen sees only effective values) would silently pin X to the old
+ *  text. Clearing an override that does not exist is a no-op on the server.
+ *  @complexity O(1). */
+export declare function inheritedXFor({ key, meta, touched }: {
+    key: string;
+    meta: AdminSeoMeta;
+    touched: Readonly<Record<string, unknown>>;
+}, _optional?: Record<string, never>): SeoXFieldKey | null;
 /** A pending-action button's label — `react/pages/SeoPage.tsx` uses this for both the save-settings button
  *  ("Saving…"/"Save settings") and the regenerate-sitemap button ("Working…"/"Regenerate
  *  sitemap"), same `pending ? … : …` shape, different copy. Also reused by `SitemapModal.tsx`'s
@@ -85,6 +116,39 @@ export declare function filterSitemapEntries({ entries, query }: {
 export declare function isStoredMediaRef({ value }: {
     value: string;
 }, _optional?: Record<string, never>): boolean;
+/** What an image field shows for its value — the file's name and pixel size — in place of the raw
+ * `{slug}:public` reference or URL (owner, 2026-10-15: a read-only "Selected image" box "looks
+ * useless"). The library row wins when the host can list media; otherwise a readable slug or the
+ * URL's file name stands in, and an opaque id falls back to the translated "Image".
+ * Size prefers the stored dimensions, then the decoded preview's natural size.
+ * @example describeMediaRef({ value: 'sunset:public', media: [{ id: 'a1', slug: 'sunset', title: 'Sunset', width: 1200, height: 630 }] }) // { name: 'Sunset', size: '1200 × 630' }
+ * @complexity O(m) over the media rows; no I/O.
+ */
+export declare function describeMediaRef({ value, media }: {
+    value: string;
+    media?: readonly AdminSeoMediaSummary[] | null | undefined;
+}, { width, height, t, extensionFor }?: {
+    width?: number | undefined;
+    height?: number | undefined;
+    t?: SeoTranslator | undefined;
+    /** `image/png` → `.png`; injected (the host UI kit owns the table) so this file stays pure. */
+    extensionFor?: ((contentType: string) => string) | undefined;
+}): {
+    name: string;
+    size: string | null;
+} | null;
+/** Whether an entry's social preview image comes from content or the site default, with no override
+ * of its own, so the field shows its source muted. "Using site default" is the original copy (owner,
+ * 2026-10-15). A pending edit is the entry's own, and so is a stored override the host flags
+ * (`imageOverridden`) even when it equals the default. A host without that flag can't tell such an
+ * override apart, so it reads as inherited (same image either way). Returns 'content' for an image
+ * the host identifies as content, 'default' for the site default, and false for an own/absent image.
+ * @complexity O(1). */
+export declare function ogImageInherited({ meta, defaultOgImage, touched }: {
+    meta: AdminSeoMeta;
+    defaultOgImage: string | undefined;
+    touched: Readonly<Record<string, unknown>>;
+}, _optional?: Record<string, never>): false | 'default' | 'content';
 /** Builds the `{slug}:public` reference `MediaRefField` writes into the field on selection —
  *  prefers the asset's readable slug over its id (readable-slugs S5b, 2026-09-23), matching
  *  `resolveSeoImageRef`'s own id-or-slug lookup server-side (`findMediaByIdOrSlug`,
@@ -159,4 +223,31 @@ export type SeoTabId = (typeof SEO_TAB_IDS)[number];
 export declare function resolveSeoTabId({ tabId }: {
     tabId?: string | null | undefined;
 }, _optional?: Record<string, never>): SeoTabId;
+/** Colour band for the analysis score pill: the same success/warning/failure tones the issue pills
+ * use, so a 100 reads green and a failing page reads red at a glance.
+ * @example scoreTone({ score: 100 }) // 'success'
+ */
+export declare function scoreTone({ score }: {
+    score: number;
+}, _optional?: Record<string, never>): 'success' | 'warning' | 'failure';
+/** One row of the searchable entry picker: grouped Pages then Posts, status only when not live. */
+export interface SeoEntryPickerOption {
+    value: string;
+    label: string;
+    group: string;
+    badge?: string;
+    detail?: string;
+}
+/**
+ * Picker rows for the Pages & posts tab. Pages lead because they are fewer and are the usual SEO
+ * targets (home, about, pricing); a published entry carries no pill, so only the exceptions
+ * (draft, scheduled, …) draw the eye. An untitled entry stays pickable by its id.
+ * @example entryPickerOptions({ posts, pages }, { t }) // [{ value: 'p1', label: 'About', group: 'Pages' }, …]
+ */
+export declare function entryPickerOptions({ posts, pages }: {
+    posts: readonly AdminSeoEntryChoice[];
+    pages: readonly AdminSeoEntryChoice[];
+}, { t }?: {
+    t?: SeoTranslator | undefined;
+}): SeoEntryPickerOption[];
 //# sourceMappingURL=rules.d.ts.map

package/dist/seo/rules.js

@@ -46,6 +46,43 @@ export function overrideOrClear({ value }, _optional = {}) {
 export function orEmpty({ value }, _optional = {}) {
     return value ?? "";
 }
+/** One entry's effective X value next to its effective social preview value, per field. Images
+ *  compare by source ref (the resolved URL is resized), falling back to the URL for pasted ones. */
+function xAndSocial({ meta }) {
+    return {
+        twitterTitle: [meta.twitter.title, meta.openGraph.title],
+        twitterDescription: [meta.twitter.description, meta.openGraph.description],
+        twitterImage: [meta.twitter.imageRef ?? meta.twitter.image, meta.openGraph.imageRef ?? meta.openGraph.image],
+    };
+}
+/** Whether this entry's X card differs from its social preview in any field — i.e. an X override
+ *  is in effect, so the "Customize for X/Twitter" disclosure opens on load. (2026-10-15, owner: one
+ *  generic social preview, X only as an optional customization.)
+ *  @complexity O(1). */
+export function xIsCustomized({ meta }, _optional = {}) {
+    return Object.values(xAndSocial({ meta })).some(([x, social]) => x !== social);
+}
+/** An X field's untouched box value, handed to `fieldValue` as its resolved value (so a pending
+ *  edit or clear still wins there). An X value equal to the social preview's is inherited, so the
+ *  box stays empty and its placeholder shows the live social value — typing there is what creates
+ *  an X override.
+ *  @complexity O(1). */
+export function xResolvedValue({ key, meta }, _optional = {}) {
+    const [x, social] = xAndSocial({ meta })[key];
+    return x === social ? '' : x ?? '';
+}
+/** The X field an edit to a social preview field should carry along: when X still shows the
+ *  preview's value and has no pending edit of its own, the edit also clears X's stored override so
+ *  X keeps following the preview after save. Without it, an X override saved equal to the preview
+ *  (indistinguishable here, the screen sees only effective values) would silently pin X to the old
+ *  text. Clearing an override that does not exist is a no-op on the server.
+ *  @complexity O(1). */
+export function inheritedXFor({ key, meta, touched }, _optional = {}) {
+    const xKey = { ogTitle: 'twitterTitle', ogDescription: 'twitterDescription', ogImage: 'twitterImage' }[key];
+    if (!xKey || xKey in touched)
+        return null;
+    return xResolvedValue({ key: xKey, meta }) === '' ? xKey : null;
+}
 /** A pending-action button's label — `react/pages/SeoPage.tsx` uses this for both the save-settings button
  *  ("Saving…"/"Save settings") and the regenerate-sitemap button ("Working…"/"Regenerate
  *  sitemap"), same `pending ? … : …` shape, different copy. Also reused by `SitemapModal.tsx`'s
@@ -122,10 +159,84 @@ function parseMediaRefAssetId(ref) {
  * URLs and incomplete input remain editable. @complexity O(n) in value length; no I/O.
  */
 export function isStoredMediaRef({ value }, _optional = {}) {
-    const trimmed = typeof value === "string" ? value.trim() : "";
+    const trimmed = trimmedText(value);
     // A URL typed one character at a time reaches "https:/" before it reaches "https://".
     return !trimmed.includes(":/") && parseMediaRefAssetId(trimmed) !== null;
 }
+/** A field value trimmed, or `""` for a non-string — the `value` props arrive through `??` fallback
+ * chains that do not replace a wrong-typed result, and these rules never throw over one bad value. */
+function trimmedText(value) {
+    return typeof value === 'string' ? value.trim() : '';
+}
+const UUID_PATTERN = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+/** What an image field shows for its value — the file's name and pixel size — in place of the raw
+ * `{slug}:public` reference or URL (owner, 2026-10-15: a read-only "Selected image" box "looks
+ * useless"). The library row wins when the host can list media; otherwise a readable slug or the
+ * URL's file name stands in, and an opaque id falls back to the translated "Image".
+ * Size prefers the stored dimensions, then the decoded preview's natural size.
+ * @example describeMediaRef({ value: 'sunset:public', media: [{ id: 'a1', slug: 'sunset', title: 'Sunset', width: 1200, height: 630 }] }) // { name: 'Sunset', size: '1200 × 630' }
+ * @complexity O(m) over the media rows; no I/O.
+ */
+export function describeMediaRef({ value, media }, { width, height, t = key => key, extensionFor } = {}) {
+    const trimmed = trimmedText(value);
+    if (!trimmed)
+        return null;
+    const key = parseMediaRefAssetId(trimmed);
+    const row = findMediaRow({ key, media });
+    const name = libraryFileName({ row }, { extensionFor }) ?? fallbackMediaName({ key, value: trimmed, t });
+    return { name, size: pixelSize(row?.width ?? width, row?.height ?? height) };
+}
+/** The library row an id-or-slug reference names, when the host could list media at all. */
+function findMediaRow({ key, media }, _optional = {}) {
+    return key ? media?.find(item => item.id === key || item.slug === key) : undefined;
+}
+/** A titled library row's display name with its stored type's extension; `null` for no row or an
+ * untitled one, so the caller's fallback name applies. */
+function libraryFileName({ row }, { extensionFor } = {}) {
+    if (!row?.title)
+        return null;
+    return withExtension({ name: row.title, extension: row.contentType && extensionFor ? extensionFor(row.contentType) : '' });
+}
+/** A library title reads as a file name (owner, 2026-10-15: "it should be testing-page.png or
+ * whatever the extension is"). No original upload name is stored, so the extension comes from the
+ * stored bytes' type; a title that already ends in it is left alone. */
+function withExtension({ name, extension }) {
+    return extension && !name.toLowerCase().endsWith(extension) ? `${name}${extension}` : name;
+}
+/** Whether an entry's social preview image comes from content or the site default, with no override
+ * of its own, so the field shows its source muted. "Using site default" is the original copy (owner,
+ * 2026-10-15). A pending edit is the entry's own, and so is a stored override the host flags
+ * (`imageOverridden`) even when it equals the default. A host without that flag can't tell such an
+ * override apart, so it reads as inherited (same image either way). Returns 'content' for an image
+ * the host identifies as content, 'default' for the site default, and false for an own/absent image.
+ * @complexity O(1). */
+export function ogImageInherited({ meta, defaultOgImage, touched }, _optional = {}) {
+    if ('ogImage' in touched || meta.openGraph.imageOverridden)
+        return false;
+    const image = meta.openGraph.imageRef ?? meta.openGraph.image;
+    if (meta.openGraph.imageSource === 'content' && image)
+        return 'content';
+    return defaultOgImage && image === defaultOgImage ? 'default' : false;
+}
+function fallbackMediaName({ key, value, t }) {
+    if (!key)
+        return urlFileName(value);
+    return UUID_PATTERN.test(key) ? t('Image') : key;
+}
+function pixelSize(width, height) {
+    return width && height ? `${width} × ${height}` : null;
+}
+/** The last path segment of an image URL ("https://cdn.example/a/pic.png" → "pic.png"). */
+function urlFileName(value) {
+    try {
+        const url = new URL(value, 'https://placeholder.invalid');
+        const last = url.pathname.split('/').filter(Boolean).pop();
+        return last ? decodeURIComponent(last) : url.hostname || value;
+    }
+    catch {
+        return value;
+    }
+}
 /** Builds the `{slug}:public` reference `MediaRefField` writes into the field on selection —
  *  prefers the asset's readable slug over its id (readable-slugs S5b, 2026-09-23), matching
  *  `resolveSeoImageRef`'s own id-or-slug lookup server-side (`findMediaByIdOrSlug`,
@@ -154,7 +265,7 @@ export function buildMediaRef({ item }, _optional = {}) {
  * @complexity O(1) — string parsing only, no I/O (the returned URL is a template; the browser
  * performs the actual fetch only once it is used as an `<img src>`). */
 export function resolveMediaRefPreviewUrl({ value, mediaOriginalUrl }, { siteOrigin } = {}) {
-    const trimmed = typeof value === "string" ? value.trim() : "";
+    const trimmed = trimmedText(value);
     if (!trimmed)
         return null;
     if (isAbsoluteMediaRef(trimmed)) {
@@ -185,14 +296,26 @@ function localRenditionAssetKey({ value, siteOrigin }, _optional = {}) {
  * @complexity O(n) in value/error length; fixed-count checks, no I/O.
  */
 export function shareImageWarning({ value, previewUrl, width, height, byteSize, error, previewFailed }, { t = key => key } = {}) {
-    if (typeof value !== 'string' || !value.trim())
+    const blocker = shareImageBlocker({ value, previewUrl, error, previewFailed }, { t });
+    if (blocker !== null)
+        return blocker;
+    const reasons = shareImageShortfalls({ width, height, byteSize }, { t });
+    return reasons.length ? reasons.join(' ') : null;
+}
+/** Why there is nothing to measure: no value, an unparseable one, a metadata error, or a failed
+ * decode — checked in that order. `null` when the image loaded and can be measured. */
+function shareImageBlocker({ value, previewUrl, error, previewFailed }, { t }) {
+    if (!trimmedText(value))
         return t('No share image is selected. Link previews may show no picture.');
     if (!previewUrl)
         return t('The share image reference is invalid. Choose an image or enter an absolute image URL.');
     if (error)
         return error;
-    if (previewFailed)
-        return t('The share image could not be loaded. Choose an available image.');
+    return previewFailed ? t('The share image could not be loaded. Choose an available image.') : null;
+}
+/** Each measured dimension or size below the share-card minimum, as its own sentence. An unknown
+ * measurement (`undefined`, or a `null` byte size) is never reported. */
+function shareImageShortfalls({ width, height, byteSize }, { t }) {
     const reasons = [];
     if (width !== undefined && width < 1200)
         reasons.push(interpolate({ template: t('The share image is only {width} px wide; use an image at least 1200 px wide.', { width }), vars: { width } }));
@@ -200,7 +323,7 @@ export function shareImageWarning({ value, previewUrl, width, height, byteSize,
         reasons.push(interpolate({ template: t('The share image is only {height} px tall; use an image at least 630 px tall.', { height }), vars: { height } }));
     if (byteSize !== undefined && byteSize !== null && byteSize < 5120)
         reasons.push(interpolate({ template: t('The share image is only {byteSize} bytes; use an image of at least 5 KB (5120 bytes).', { byteSize }), vars: { byteSize } }));
-    return reasons.length ? reasons.join(' ') : null;
+    return reasons;
 }
 /** One `FormData` field as a string, with the caller's fallback for an absent field. Its own named
  *  function purely so {@link buildSeoSettingsPatch} below stays readable at a glance: written
@@ -259,4 +382,36 @@ export const SEO_TAB_IDS = ['defaults', 'sitemap', 'entries'];
 export function resolveSeoTabId({ tabId }, _optional = {}) {
     return SEO_TAB_IDS.find(id => id === tabId) ?? 'defaults';
 }
+/** Colour band for the analysis score pill: the same success/warning/failure tones the issue pills
+ * use, so a 100 reads green and a failing page reads red at a glance.
+ * @example scoreTone({ score: 100 }) // 'success'
+ */
+export function scoreTone({ score }, _optional = {}) {
+    if (score >= 80)
+        return 'success';
+    return score >= 50 ? 'warning' : 'failure';
+}
+/**
+ * Picker rows for the Pages & posts tab. Pages lead because they are fewer and are the usual SEO
+ * targets (home, about, pricing); a published entry carries no pill, so only the exceptions
+ * (draft, scheduled, …) draw the eye. An untitled entry stays pickable by its id.
+ * @example entryPickerOptions({ posts, pages }, { t }) // [{ value: 'p1', label: 'About', group: 'Pages' }, …]
+ */
+export function entryPickerOptions({ posts, pages }, { t = key => key } = {}) {
+    // Two entries can share a title ("Landing Page" twice, owner 2026-10-15); both stay listed and
+    // each duplicate shows its slug as muted secondary text so the operator can tell them apart.
+    const rows = (entries, group) => {
+        const labelOf = (entry) => entry.title.trim() || entry.id;
+        const counts = new Map();
+        for (const entry of entries)
+            counts.set(labelOf(entry), (counts.get(labelOf(entry)) ?? 0) + 1);
+        return entries.map((entry) => ({
+            value: entry.id, label: labelOf(entry), group,
+            ...(entry.status && entry.status !== 'published' ? { badge: t(entry.status) } : {}),
+            // Every label was counted above, so its count is at least 1 and "not exactly one" means a duplicate.
+            ...(counts.get(labelOf(entry)) !== 1 ? { detail: entry.slug || entry.id } : {}),
+        }));
+    };
+    return [...rows(pages, t('Pages')), ...rows(posts, t('Posts'))];
+}
 //# sourceMappingURL=rules.js.map

package/dist/seo/seo.module.d.ts

@@ -29,21 +29,24 @@ export declare const seoModule: {
         readonly "Canonical URL": "Canonical URL";
         readonly Noindex: "Noindex";
         readonly Nofollow: "Nofollow";
-        readonly "OG title": "OG title";
-        readonly "OG description": "OG description";
-        readonly "OG image": "OG image";
-        readonly "Twitter title": "Twitter title";
-        readonly "Twitter description": "Twitter description";
-        readonly "Twitter image": "Twitter image";
+        readonly "Preview title": "Preview title";
+        readonly "Preview description": "Preview description";
+        readonly "Preview image": "Preview image";
+        readonly "X/Twitter title": "X/Twitter title";
+        readonly "X/Twitter description": "X/Twitter description";
+        readonly "X/Twitter image": "X/Twitter image";
+        readonly "Customize for X/Twitter (optional)": "Customize for X/Twitter (optional)";
+        readonly "Same as the preview image": "Same as the preview image";
+        readonly "Used by Facebook, LinkedIn, Slack, Discord, iMessage, WhatsApp and X/Twitter": "Used by Facebook, LinkedIn, Slack, Discord, iMessage, WhatsApp and X/Twitter";
         readonly "Saving\u2026": "Saving…";
         readonly "Save overrides": "Save overrides";
         readonly "Per-entry SEO": "Per-entry SEO";
         readonly "Search appearance": "Search appearance";
         readonly "Title template (must contain %s)": "Title template (must contain %s)";
         readonly "Default meta description": "Default meta description";
-        readonly "Social sharing": "Social sharing";
-        readonly "Default Open Graph / Twitter image": "Default Open Graph / Twitter image";
-        readonly "Twitter @site handle": "Twitter @site handle";
+        readonly "Social preview": "Social preview";
+        readonly "Default preview image": "Default preview image";
+        readonly "X/Twitter @handle": "X/Twitter @handle";
         readonly Crawling: "Crawling";
         readonly "Default noindex": "Default noindex";
         readonly "Default nofollow": "Default nofollow";
@@ -56,7 +59,7 @@ export declare const seoModule: {
         readonly "View sitemap": "View sitemap";
         readonly "Loading SEO settings\u2026": "Loading SEO settings…";
         readonly Marketing: "Marketing";
-        readonly "Site-wide defaults for meta titles, descriptions, Open Graph/Twitter cards, and robots directives.": "Site-wide defaults for meta titles, descriptions, Open Graph/Twitter cards, and robots directives.";
+        readonly "Site-wide defaults for meta titles, descriptions, social previews, and robots directives.": "Site-wide defaults for meta titles, descriptions, social previews, and robots directives.";
         readonly "Choose image": "Choose image";
         readonly Remove: "Remove";
         readonly "Sitemap \u00B7 {count} URLs": "Sitemap · {count} URLs";
@@ -84,6 +87,8 @@ export declare const seoModule: {
         readonly "failed to load the sitemap": "failed to load the sitemap";
         readonly "Could not load the sitemap (HTTP {status}).": "Could not load the sitemap (HTTP {status}).";
         readonly "Selected image": "Selected image";
+        readonly "Using site default: {name}": "Using site default: {name}";
+        readonly "Using image from page content: {name}": "Using image from page content: {name}";
     };
     readonly pages: {
         readonly settings: {