frontend-auto-cms 1.0.3 → 1.0.4

package/dist/runtime/dashboard.js

@@ -1,19 +1,19 @@
-const fe = "cms-export.patch.json", pe = "frontend-auto-cms::content", Z = "frontend-auto-cms::locales";
-function Q(e) {
-  localStorage.setItem(pe, JSON.stringify(e));
+const ge = "cms-export.patch.json", be = "frontend-auto-cms::content", ee = "frontend-auto-cms::locales";
+function te(e) {
+  localStorage.setItem(be, JSON.stringify(e));
 }
-function ee() {
+function ae() {
   try {
-    const e = localStorage.getItem(Z);
+    const e = localStorage.getItem(ee);
     return e ? JSON.parse(e) : {};
   } catch {
     return {};
   }
 }
 function A(e) {
-  localStorage.setItem(Z, JSON.stringify(e));
+  localStorage.setItem(ee, JSON.stringify(e));
 }
-async function ge() {
+async function me() {
   try {
     const e = await fetch("/cms-locales.json", { cache: "no-store" });
     if (!e.ok)
@@ -24,9 +24,9 @@ async function ge() {
     return {};
   }
 }
-function be(e) {
-  const t = new Blob([JSON.stringify(e, null, 2)], { type: "application/json" }), a = URL.createObjectURL(t), r = document.createElement("a");
-  r.href = a, r.download = fe, r.click(), URL.revokeObjectURL(a);
+function ye(e) {
+  const t = new Blob([JSON.stringify(e, null, 2)], { type: "application/json" }), a = URL.createObjectURL(t), o = document.createElement("a");
+  o.href = a, o.download = ge, o.click(), URL.revokeObjectURL(a);
 }
 function E(e) {
   return e.replace(/[^\w]+/g, "_").replace(/^_+|_+$/g, "").toLowerCase();
@@ -38,26 +38,26 @@ function k(e) {
   const a = (e.getAttribute("class") ?? "").split(/\s+/).filter(Boolean)[0];
   return a ? `${e.tagName.toLowerCase()}.${a}` : e.tagName.toLowerCase();
 }
-function te(e) {
+function ne(e) {
   return ["SCRIPT", "STYLE", "NOSCRIPT", "IFRAME"].includes(e.tagName);
 }
-function z(e) {
+function N(e) {
   return (e ?? "").replace(/\s+/g, " ").trim();
 }
-function me(e, t, a) {
-  const r = t.parentElement;
-  if (!r || te(r))
+function xe(e, t, a) {
+  const o = t.parentElement;
+  if (!o || ne(o))
     return null;
-  if (Array.from(r.childNodes).filter(
-    (s) => s.nodeType === Node.TEXT_NODE && z(s.nodeValue).length > 0
-  ).length === 1 && r.children.length === 0)
-    return r.setAttribute("data-cms-key", a), r;
-  const o = e.createElement("span");
-  return o.textContent = t.nodeValue ?? "", o.setAttribute("data-cms-key", a), t.parentNode?.replaceChild(o, t), o;
-}
-function N(e = document, t) {
+  if (Array.from(o.childNodes).filter(
+    (s) => s.nodeType === Node.TEXT_NODE && N(s.nodeValue).length > 0
+  ).length === 1 && o.children.length === 0)
+    return o.setAttribute("data-cms-key", a), o;
+  const r = e.createElement("span");
+  return r.textContent = t.nodeValue ?? "", r.setAttribute("data-cms-key", a), t.parentNode?.replaceChild(r, t), r;
+}
+function T(e = document, t) {
   const a = [];
-  let r = 0, n = 0, o = 0, s = 0;
+  let o = 0, n = 0, r = 0, s = 0;
   const l = t ?? e.location?.pathname ?? location.pathname, c = e.body;
   if (!c)
     return {
@@ -67,28 +67,28 @@ function N(e = document, t) {
     };
   const f = e.createTreeWalker(c, NodeFilter.SHOW_ELEMENT | NodeFilter.SHOW_TEXT);
   for (; f.nextNode(); ) {
-    const u = f.currentNode;
-    if (u.nodeType === Node.TEXT_NODE) {
-      const b = u, m = z(b.nodeValue);
+    const d = f.currentNode;
+    if (d.nodeType === Node.TEXT_NODE) {
+      const b = d, m = N(b.nodeValue);
       if (m.length < 2)
         continue;
-      r += 1;
-      const U = `${E(l || "index")}.text.${r}`, C = me(e, b, U);
-      if (!C)
+      o += 1;
+      const G = `${E(l || "index")}.text.${o}`, O = xe(e, b, G);
+      if (!O)
         continue;
       a.push({
-        id: `dom_txt_${r}`,
-        key: U,
+        id: `dom_txt_${o}`,
+        key: G,
         type: "text",
-        label: k(C),
+        label: k(O),
         value: m,
-        selector: k(C),
+        selector: k(O),
         sourceRefs: [{ file: l, original: m }]
       });
       continue;
     }
-    const i = u;
-    if (te(i))
+    const i = d;
+    if (ne(i))
       continue;
     const p = i.tagName.toLowerCase();
     if (p === "img" || p === "video") {
@@ -109,12 +109,12 @@ function N(e = document, t) {
       }
     }
     if (["section", "ul", "ol"].includes(p) || i.hasAttribute("data-repeatable")) {
-      const b = Array.from(i.children).map((m) => z(m.textContent)).filter(Boolean);
+      const b = Array.from(i.children).map((m) => N(m.textContent)).filter(Boolean);
       if (b.length >= 2) {
-        o += 1;
-        const m = `${E(l || "index")}.section.${o}`;
+        r += 1;
+        const m = `${E(l || "index")}.section.${r}`;
         i.setAttribute("data-cms-key", m), a.push({
-          id: `dom_sec_${o}`,
+          id: `dom_sec_${r}`,
           key: m,
           type: "section",
           label: k(i),
@@ -150,7 +150,7 @@ function N(e = document, t) {
     nodes: a
   };
 }
-function ae(e, t = document) {
+function oe(e, t = document) {
   if (!e.key)
     return;
   const a = t.querySelector(`[data-cms-key="${CSS.escape(e.key)}"]`);
@@ -160,16 +160,16 @@ function ae(e, t = document) {
     else if (e.type === "image" || e.type === "video")
       a.src = e.value, e.attrs?.alt != null && a.setAttribute("alt", e.attrs.alt);
     else if (e.type === "property" && e.attrs)
-      Object.entries(e.attrs).forEach(([r, n]) => a.setAttribute(r, n));
+      Object.entries(e.attrs).forEach(([o, n]) => a.setAttribute(o, n));
     else if (e.type === "section" && e.sectionItems) {
-      const r = Array.from(a.children);
-      e.sectionItems.forEach((n, o) => {
-        r[o] && (r[o].textContent = n);
+      const o = Array.from(a.children);
+      e.sectionItems.forEach((n, r) => {
+        o[r] && (o[r].textContent = n);
       });
     }
   }
 }
-const B = [
+const P = [
   { code: "af", label: "Afrikaans", nllb: "afr_Latn" },
   { code: "ar", label: "Arabic", nllb: "arb_Arab" },
   { code: "az", label: "Azerbaijani", nllb: "azj_Latn" },
@@ -234,51 +234,51 @@ const B = [
   { code: "uz", label: "Uzbek", nllb: "uzn_Latn" },
   { code: "vi", label: "Vietnamese", nllb: "vie_Latn" },
   { code: "zh", label: "Chinese (Simplified)", nllb: "zho_Hans" }
-], G = Object.fromEntries(
-  B.map((e) => [e.nllb.slice(0, 3).toLowerCase(), e.code])
-), xe = "https://api.mymemory.translated.net/get";
-function K(e) {
+], K = Object.fromEntries(
+  P.map((e) => [e.nllb.slice(0, 3).toLowerCase(), e.code])
+), he = "https://api.mymemory.translated.net/get";
+function J(e) {
   const t = e.trim().toLowerCase().split(/[-_]/)[0];
   if (/^[a-z]{2}$/i.test(t))
     return t;
-  if (/^[a-z]{3}$/i.test(t) && G[t])
-    return G[t];
+  if (/^[a-z]{3}$/i.test(t) && K[t])
+    return K[t];
   throw new Error(`Unsupported language code "${e}" for MyMemory translation.`);
 }
-async function ye(e, t, a) {
+async function ke(e, t, a) {
   if (!e.trim())
     return e;
-  const r = new URLSearchParams({
+  const o = new URLSearchParams({
     q: e,
     langpair: `${t}|${a}`
-  }), n = await fetch(`${xe}?${r.toString()}`, { method: "GET" });
+  }), n = await fetch(`${he}?${o.toString()}`, { method: "GET" });
   if (!n.ok)
     throw new Error(`MyMemory request failed (${n.status})`);
-  const o = await n.json();
-  if (o.responseStatus && o.responseStatus !== 200)
-    throw new Error(`MyMemory translation failed with status ${o.responseStatus}`);
-  const s = o.responseData?.translatedText;
+  const r = await n.json();
+  if (r.responseStatus && r.responseStatus !== 200)
+    throw new Error(`MyMemory translation failed with status ${r.responseStatus}`);
+  const s = r.responseData?.translatedText;
   return typeof s == "string" && s.trim() ? s : e;
 }
-async function he(e, t, a = "en", r) {
-  const n = K(a), o = K(t), s = /* @__PURE__ */ new Map(), l = {}, c = Object.entries(e), f = c.length;
-  let u = 0;
+async function ve(e, t, a = "en", o) {
+  const n = J(a), r = J(t), s = /* @__PURE__ */ new Map(), l = {}, c = Object.entries(e), f = c.length;
+  let d = 0;
   for (const [i, p] of c) {
     if (s.has(p)) {
-      l[i] = s.get(p), u += 1, r?.(u, f);
+      l[i] = s.get(p), d += 1, o?.(d, f);
       continue;
     }
     try {
-      const g = await ye(p, n, o);
+      const g = await ke(p, n, r);
       s.set(p, g), l[i] = g;
     } catch {
       l[i] = p;
     }
-    u += 1, r?.(u, f);
+    d += 1, o?.(d, f);
   }
   return l;
 }
-async function ke(e, t, a) {
+async function we(e, t, a) {
   return (await fetch(
     `https://gitlab.com/api/v4/projects/${encodeURIComponent(e.repository)}/repository/files/${encodeURIComponent(a)}?ref=${encodeURIComponent(e.branch)}`,
     {
@@ -287,7 +287,7 @@ async function ke(e, t, a) {
     }
   )).ok;
 }
-async function ve() {
+async function Le() {
   try {
     const e = await fetch("/cms-hosting.json", { cache: "no-store" });
     if (!e.ok)
@@ -298,20 +298,20 @@ async function ve() {
     return null;
   }
 }
-async function O(e, t, a, r, n) {
-  const o = `https://api.github.com/repos/${e.repository}/contents/${encodeURIComponent(a).replace(/%2F/g, "/")}`;
+async function j(e, t, a, o, n) {
+  const r = `https://api.github.com/repos/${e.repository}/contents/${encodeURIComponent(a).replace(/%2F/g, "/")}`;
   let s;
-  const l = await fetch(`${o}?ref=${encodeURIComponent(e.branch)}`, {
+  const l = await fetch(`${r}?ref=${encodeURIComponent(e.branch)}`, {
     headers: { Authorization: `Bearer ${t}` }
   });
   l.ok && (s = (await l.json()).sha);
   const c = {
     message: n,
-    content: btoa(unescape(encodeURIComponent(r))),
+    content: btoa(unescape(encodeURIComponent(o))),
     branch: e.branch,
     sha: s
   };
-  if (!(await fetch(o, {
+  if (!(await fetch(r, {
     method: "PUT",
     headers: {
       Authorization: `Bearer ${t}`,
@@ -321,24 +321,24 @@ async function O(e, t, a, r, n) {
   })).ok)
     throw new Error(`GitHub publish failed for ${a}`);
 }
-async function we(e, t, a) {
-  const r = `chore(cms): publish content updates ${(/* @__PURE__ */ new Date()).toISOString()}`;
-  if (await O(e, t, "cms-content.json", JSON.stringify(a.content, null, 2), r), a.locales)
-    for (const [n, o] of Object.entries(a.locales))
-      await O(e, t, `locales/${n}.json`, JSON.stringify(o, null, 2), r);
-  await O(e, t, "cms-export.patch.json", JSON.stringify(a, null, 2), r);
-}
-async function Le(e, t, a) {
-  const r = [
+async function $e(e, t, a) {
+  const o = `chore(cms): publish content updates ${(/* @__PURE__ */ new Date()).toISOString()}`;
+  if (await j(e, t, "cms-content.json", JSON.stringify(a.content, null, 2), o), a.locales)
+    for (const [n, r] of Object.entries(a.locales))
+      await j(e, t, `locales/${n}.json`, JSON.stringify(r, null, 2), o);
+  await j(e, t, "cms-export.patch.json", JSON.stringify(a, null, 2), o);
+}
+async function Se(e, t, a) {
+  const o = [
     { filePath: "cms-content.json", content: JSON.stringify(a.content, null, 2) },
     { filePath: "cms-export.patch.json", content: JSON.stringify(a, null, 2) }
   ];
   if (a.locales)
     for (const [s, l] of Object.entries(a.locales))
-      r.push({ filePath: `locales/${s}.json`, content: JSON.stringify(l, null, 2) });
+      o.push({ filePath: `locales/${s}.json`, content: JSON.stringify(l, null, 2) });
   const n = [];
-  for (const s of r) {
-    const l = await ke(e, t, s.filePath);
+  for (const s of o) {
+    const l = await we(e, t, s.filePath);
     n.push({
       action: l ? "update" : "create",
       file_path: s.filePath,
@@ -359,12 +359,12 @@ async function Le(e, t, a) {
   })).ok)
     throw new Error("GitLab publish failed.");
 }
-async function $e(e, t, a) {
-  return !a || !t.trim() ? !1 : a.provider === "github" ? (await we(a, t.trim(), e), !0) : a.provider === "gitlab" ? (await Le(a, t.trim(), e), !0) : !1;
+async function Ee(e, t, a) {
+  return !a || !t.trim() ? !1 : a.provider === "github" ? (await $e(a, t.trim(), e), !0) : a.provider === "gitlab" ? (await Se(a, t.trim(), e), !0) : !1;
 }
-const J = "facms-auth-modal", M = "facms-auth-missing", F = "facms-token-modal", Y = "facms-language-modal", Se = "frontend-auto-cms::theme", ne = "frontend-auto-cms::main-language", oe = "frontend-auto-cms::language-labels";
-let P = !1, v = null, V = !1, h = null, d = "dark";
-function re() {
+const F = "facms-auth-modal", M = "facms-auth-missing", Y = "facms-token-modal", W = "facms-language-modal", _e = "frontend-auto-cms::theme", re = "frontend-auto-cms::main-language", se = "frontend-auto-cms::language-labels";
+let R = !1, v = null, V = !1, h = null, u = "dark";
+function ie() {
   if (document.getElementById("facms-dashboard-css"))
     return;
   const e = document.createElement("style");
@@ -603,24 +603,24 @@ function re() {
     }
   `, document.head.appendChild(e);
 }
-function se(e) {
-  d = e;
+function le(e) {
+  u = e;
   const t = e === "dark";
-  document.documentElement.classList.toggle("dark", t), document.body.classList.toggle("dark", t), document.documentElement.style.background = t ? "#020617" : "#f1f5f9", document.body.style.background = t ? "#020617" : "#f1f5f9", document.documentElement.setAttribute("data-facms-theme", e), document.getElementById("facms-app")?.classList.toggle("dark", t), localStorage.setItem(Se, e);
-  const r = document.getElementById("facms-theme-toggle");
-  r && (r.textContent = e === "dark" ? "Switch to light" : "Switch to dark");
+  document.documentElement.classList.toggle("dark", t), document.body.classList.toggle("dark", t), document.documentElement.style.background = t ? "#020617" : "#f1f5f9", document.body.style.background = t ? "#020617" : "#f1f5f9", document.documentElement.setAttribute("data-facms-theme", e), document.getElementById("facms-app")?.classList.toggle("dark", t), localStorage.setItem(_e, e);
+  const o = document.getElementById("facms-theme-toggle");
+  o && (o.textContent = e === "dark" ? "Switch to light" : "Switch to dark");
 }
-function le() {
-  d = "dark", se("dark");
+function ce() {
+  u = "dark", le("dark");
 }
-function Ee(e) {
+function Ae(e) {
   return Array.from(new Uint8Array(e)).map((t) => t.toString(16).padStart(2, "0")).join("");
 }
-async function _e(e) {
+async function Te(e) {
   const t = new TextEncoder().encode(e), a = await crypto.subtle.digest("SHA-256", t);
-  return Ee(a);
+  return Ae(a);
 }
-async function ie() {
+async function de() {
   if (h)
     return h;
   try {
@@ -638,7 +638,7 @@ async function ie() {
   }
   return h = { dashboardPath: "/dashboard", pages: ["/"], showFloatingButton: !1, autoTranslateEnabled: !0 }, h;
 }
-async function R() {
+async function D() {
   if (!V) {
     V = !0;
     try {
@@ -651,11 +651,11 @@ async function R() {
     }
   }
 }
-async function Ae(e) {
+async function Ie(e) {
   const t = e.trim();
-  return !t || (await R(), !v) ? !1 : await _e(`${v.salt}:${t}`) === v.passcodeHash;
+  return !t || (await D(), !v) ? !1 : await Te(`${v.salt}:${t}`) === v.passcodeHash;
 }
-function Te() {
+function Ce() {
   let e = document.getElementById(M);
   e || (e = document.createElement("div"), e.id = M, e.style.position = "fixed", e.style.inset = "0", e.style.zIndex = "2147483647", e.style.background = "rgba(2, 6, 23, 0.88)", e.style.display = "grid", e.style.placeItems = "center", e.innerHTML = `
     <div style="width:min(560px,92vw);background:#0f172a;color:#e2e8f0;border:1px solid #334155;border-radius:16px;padding:16px;box-shadow:0 20px 55px rgba(2,6,23,.45);font-family:Inter,system-ui,sans-serif;">
@@ -665,134 +665,134 @@ function Te() {
     </div>
   `, document.body.appendChild(e));
 }
-function Ie() {
+function Oe() {
   document.getElementById(M)?.remove();
 }
-async function ce() {
-  return await R(), v ? (Ie(), !0) : (Te(), !1);
+async function ue() {
+  return await D(), v ? (Oe(), !0) : (Ce(), !1);
 }
-function de(e) {
-  const t = document.getElementById(J);
+function fe(e) {
+  const t = document.getElementById(F);
   if (t) {
     t.style.display = "grid";
     return;
   }
   const a = document.createElement("div");
-  a.id = J, a.style.position = "fixed", a.style.inset = "0", a.style.zIndex = "2147483647", a.style.background = "rgba(2, 6, 23, 0.45)", a.style.display = "grid", a.style.placeItems = "center", a.innerHTML = `
-    <div style="width: min(420px, 92vw); background: ${d === "dark" ? "#0f172a" : "#ffffff"}; color: ${d === "dark" ? "#e2e8f0" : "#0f172a"}; border: 1px solid ${d === "dark" ? "#334155" : "#e2e8f0"}; border-radius: 16px; padding: 16px; box-shadow: 0 20px 55px rgba(2,6,23,0.45); font-family: Inter, system-ui, sans-serif;">
+  a.id = F, a.style.position = "fixed", a.style.inset = "0", a.style.zIndex = "2147483647", a.style.background = "rgba(2, 6, 23, 0.45)", a.style.display = "grid", a.style.placeItems = "center", a.innerHTML = `
+    <div style="width: min(420px, 92vw); background: ${u === "dark" ? "#0f172a" : "#ffffff"}; color: ${u === "dark" ? "#e2e8f0" : "#0f172a"}; border: 1px solid ${u === "dark" ? "#334155" : "#e2e8f0"}; border-radius: 16px; padding: 16px; box-shadow: 0 20px 55px rgba(2,6,23,0.45); font-family: Inter, system-ui, sans-serif;">
       <h3 style="margin: 0 0 6px 0; font-size: 20px; line-height: 1.2; font-weight: 700;">Unlock CMS</h3>
-      <p style="margin: 0 0 12px 0; font-size: 12px; color: ${d === "dark" ? "#94a3b8" : "#475569"};">Enter your passcode to edit content.</p>
-      <input id="facms-passcode-input" type="password" style="width: 100%; border: 1px solid ${d === "dark" ? "#475569" : "#cbd5e1"}; background: ${d === "dark" ? "#1e293b" : "#ffffff"}; color: ${d === "dark" ? "#f1f5f9" : "#0f172a"}; border-radius: 10px; padding: 10px 12px; font-size: 14px; box-sizing: border-box;" placeholder="Enter passcode" />
+      <p style="margin: 0 0 12px 0; font-size: 12px; color: ${u === "dark" ? "#94a3b8" : "#475569"};">Enter your passcode to edit content.</p>
+      <input id="facms-passcode-input" type="password" style="width: 100%; border: 1px solid ${u === "dark" ? "#475569" : "#cbd5e1"}; background: ${u === "dark" ? "#1e293b" : "#ffffff"}; color: ${u === "dark" ? "#f1f5f9" : "#0f172a"}; border-radius: 10px; padding: 10px 12px; font-size: 14px; box-sizing: border-box;" placeholder="Enter passcode" />
       <p id="facms-passcode-error" style="display:none; margin: 8px 0 0 0; font-size: 12px; color: #ef4444;">Incorrect passcode.</p>
       <div style="margin-top: 14px; display: flex; gap: 8px; justify-content: flex-end;">
-        <button id="facms-passcode-cancel" style="border: 1px solid ${d === "dark" ? "#475569" : "#cbd5e1"}; background: ${d === "dark" ? "#1e293b" : "#f1f5f9"}; color: ${d === "dark" ? "#e2e8f0" : "#334155"}; border-radius: 10px; padding: 8px 12px; font-size: 13px; cursor: pointer;">Cancel</button>
+        <button id="facms-passcode-cancel" style="border: 1px solid ${u === "dark" ? "#475569" : "#cbd5e1"}; background: ${u === "dark" ? "#1e293b" : "#f1f5f9"}; color: ${u === "dark" ? "#e2e8f0" : "#334155"}; border-radius: 10px; padding: 8px 12px; font-size: 13px; cursor: pointer;">Cancel</button>
         <button id="facms-passcode-submit" style="border: 1px solid #4f46e5; background: #4f46e5; color: white; border-radius: 10px; padding: 8px 12px; font-size: 13px; cursor: pointer;">Open CMS</button>
       </div>
     </div>
   `;
-  const r = a.querySelector("#facms-passcode-input"), n = a.querySelector("#facms-passcode-error"), o = () => a.style.display = "none", s = async () => {
-    if (await R(), !v) {
+  const o = a.querySelector("#facms-passcode-input"), n = a.querySelector("#facms-passcode-error"), r = () => a.style.display = "none", s = async () => {
+    if (await D(), !v) {
       n && (n.textContent = "CMS auth is not configured. Run setup to generate runtime auth files.", n.style.display = "block");
       return;
     }
-    if (!await Ae(r?.value ?? "")) {
+    if (!await Ie(o?.value ?? "")) {
       n && (n.textContent = "Incorrect passcode.", n.style.display = "block");
       return;
     }
-    n && (n.style.display = "none"), P = !0, o(), e();
+    n && (n.style.display = "none"), R = !0, r(), e();
   };
-  a.querySelector("#facms-passcode-cancel")?.addEventListener("click", o), a.querySelector("#facms-passcode-submit")?.addEventListener("click", s), r?.addEventListener("keydown", (l) => l.key === "Enter" && void s()), document.body.appendChild(a), r?.focus();
+  a.querySelector("#facms-passcode-cancel")?.addEventListener("click", r), a.querySelector("#facms-passcode-submit")?.addEventListener("click", s), o?.addEventListener("keydown", (l) => l.key === "Enter" && void s()), document.body.appendChild(a), o?.focus();
 }
-function Ce(e, t) {
-  const a = document.getElementById(F);
+function je(e, t) {
+  const a = document.getElementById(Y);
   a && a.remove();
-  const r = document.createElement("div");
-  r.id = F, r.style.position = "fixed", r.style.inset = "0", r.style.zIndex = "2147483647", r.style.background = "rgba(2, 6, 23, 0.45)", r.style.display = "grid", r.style.placeItems = "center", r.innerHTML = `
-    <div style="width: min(520px, 92vw); background: ${d === "dark" ? "#0f172a" : "#ffffff"}; color: ${d === "dark" ? "#e2e8f0" : "#0f172a"}; border: 1px solid ${d === "dark" ? "#334155" : "#e2e8f0"}; border-radius: 16px; padding: 16px; box-shadow: 0 20px 55px rgba(2,6,23,0.45); font-family: Inter, system-ui, sans-serif;">
+  const o = document.createElement("div");
+  o.id = Y, o.style.position = "fixed", o.style.inset = "0", o.style.zIndex = "2147483647", o.style.background = "rgba(2, 6, 23, 0.45)", o.style.display = "grid", o.style.placeItems = "center", o.innerHTML = `
+    <div style="width: min(520px, 92vw); background: ${u === "dark" ? "#0f172a" : "#ffffff"}; color: ${u === "dark" ? "#e2e8f0" : "#0f172a"}; border: 1px solid ${u === "dark" ? "#334155" : "#e2e8f0"}; border-radius: 16px; padding: 16px; box-shadow: 0 20px 55px rgba(2,6,23,0.45); font-family: Inter, system-ui, sans-serif;">
       <h3 style="margin: 0 0 6px 0; font-size: 20px; line-height: 1.2; font-weight: 700;">Publish token required</h3>
-      <p style="margin: 0 0 12px 0; font-size: 12px; color: ${d === "dark" ? "#94a3b8" : "#475569"};">Enter your ${e} token for this publish only. It is not stored.</p>
-      <input id="facms-token-input" type="password" style="width: 100%; border: 1px solid ${d === "dark" ? "#475569" : "#cbd5e1"}; background: ${d === "dark" ? "#1e293b" : "#ffffff"}; color: ${d === "dark" ? "#f1f5f9" : "#0f172a"}; border-radius: 10px; padding: 10px 12px; font-size: 14px; box-sizing: border-box;" placeholder="Token" />
+      <p style="margin: 0 0 12px 0; font-size: 12px; color: ${u === "dark" ? "#94a3b8" : "#475569"};">Enter your ${e} token for this publish only. It is not stored.</p>
+      <input id="facms-token-input" type="password" style="width: 100%; border: 1px solid ${u === "dark" ? "#475569" : "#cbd5e1"}; background: ${u === "dark" ? "#1e293b" : "#ffffff"}; color: ${u === "dark" ? "#f1f5f9" : "#0f172a"}; border-radius: 10px; padding: 10px 12px; font-size: 14px; box-sizing: border-box;" placeholder="Token" />
       <p id="facms-token-error" style="display:none; margin: 8px 0 0 0; font-size: 12px; color: #ef4444;">Token is required.</p>
       <div style="margin-top: 14px; display: flex; gap: 8px; justify-content: flex-end;">
-        <button id="facms-token-cancel" style="border: 1px solid ${d === "dark" ? "#475569" : "#cbd5e1"}; background: ${d === "dark" ? "#1e293b" : "#f1f5f9"}; color: ${d === "dark" ? "#e2e8f0" : "#334155"}; border-radius: 10px; padding: 8px 12px; font-size: 13px; cursor: pointer;">Cancel</button>
+        <button id="facms-token-cancel" style="border: 1px solid ${u === "dark" ? "#475569" : "#cbd5e1"}; background: ${u === "dark" ? "#1e293b" : "#f1f5f9"}; color: ${u === "dark" ? "#e2e8f0" : "#334155"}; border-radius: 10px; padding: 8px 12px; font-size: 13px; cursor: pointer;">Cancel</button>
         <button id="facms-token-submit" style="border: 1px solid #4f46e5; background: #4f46e5; color: white; border-radius: 10px; padding: 8px 12px; font-size: 13px; cursor: pointer;">Publish</button>
       </div>
     </div>
   `;
-  const n = r.querySelector("#facms-token-input"), o = r.querySelector("#facms-token-error"), s = () => r.style.display = "none", l = () => {
+  const n = o.querySelector("#facms-token-input"), r = o.querySelector("#facms-token-error"), s = () => o.style.display = "none", l = () => {
     const c = (n?.value ?? "").trim();
     if (!c) {
-      o && (o.style.display = "block");
+      r && (r.style.display = "block");
       return;
     }
-    o && (o.style.display = "none"), s(), t(c);
+    r && (r.style.display = "none"), s(), t(c);
   };
-  r.querySelector("#facms-token-cancel")?.addEventListener("click", s), r.querySelector("#facms-token-submit")?.addEventListener("click", l), n?.addEventListener("keydown", (c) => c.key === "Enter" && l()), document.body.appendChild(r), n?.focus();
+  o.querySelector("#facms-token-cancel")?.addEventListener("click", s), o.querySelector("#facms-token-submit")?.addEventListener("click", l), n?.addEventListener("keydown", (c) => c.key === "Enter" && l()), document.body.appendChild(o), n?.focus();
 }
-function Oe(e, t, a) {
-  const r = document.getElementById(Y);
-  r && r.remove();
+function ze(e, t, a) {
+  const o = document.getElementById(W);
+  o && o.remove();
   const n = document.createElement("div");
-  n.id = Y, n.style.position = "fixed", n.style.inset = "0", n.style.zIndex = "2147483647", n.style.background = "rgba(2, 6, 23, 0.45)", n.style.display = "grid", n.style.placeItems = "center", n.innerHTML = `
-    <div style="width: min(520px, 92vw); background: ${d === "dark" ? "#0f172a" : "#ffffff"}; color: ${d === "dark" ? "#e2e8f0" : "#0f172a"}; border: 1px solid ${d === "dark" ? "#334155" : "#e2e8f0"}; border-radius: 16px; padding: 16px; box-shadow: 0 20px 55px rgba(2,6,23,0.45); font-family: Inter, system-ui, sans-serif;">
+  n.id = W, n.style.position = "fixed", n.style.inset = "0", n.style.zIndex = "2147483647", n.style.background = "rgba(2, 6, 23, 0.45)", n.style.display = "grid", n.style.placeItems = "center", n.innerHTML = `
+    <div style="width: min(520px, 92vw); background: ${u === "dark" ? "#0f172a" : "#ffffff"}; color: ${u === "dark" ? "#e2e8f0" : "#0f172a"}; border: 1px solid ${u === "dark" ? "#334155" : "#e2e8f0"}; border-radius: 16px; padding: 16px; box-shadow: 0 20px 55px rgba(2,6,23,0.45); font-family: Inter, system-ui, sans-serif;">
       <h3 style="margin: 0 0 6px 0; font-size: 20px; line-height: 1.2; font-weight: 700;">Add translation</h3>
-      <p style="margin: 0 0 8px 0; font-size: 12px; color: ${d === "dark" ? "#94a3b8" : "#475569"};">Pick a supported language or define a custom one for manual translation.</p>
-      <select id="facms-language-select" style="width: 100%; border: 1px solid ${d === "dark" ? "#475569" : "#cbd5e1"}; background: ${d === "dark" ? "#1e293b" : "#ffffff"}; color: ${d === "dark" ? "#f1f5f9" : "#0f172a"}; border-radius: 10px; padding: 10px 12px; font-size: 14px; box-sizing: border-box; margin-bottom: 8px;">
+      <p style="margin: 0 0 8px 0; font-size: 12px; color: ${u === "dark" ? "#94a3b8" : "#475569"};">Pick a supported language or define a custom one for manual translation.</p>
+      <select id="facms-language-select" style="width: 100%; border: 1px solid ${u === "dark" ? "#475569" : "#cbd5e1"}; background: ${u === "dark" ? "#1e293b" : "#ffffff"}; color: ${u === "dark" ? "#f1f5f9" : "#0f172a"}; border-radius: 10px; padding: 10px 12px; font-size: 14px; box-sizing: border-box; margin-bottom: 8px;">
         <option value="">Select supported language</option>
-        ${B.filter((u) => !e.includes(u.code)).map((u) => `<option value="${u.code}">${u.label} (${u.code})</option>`).join("")}
+        ${P.filter((d) => !e.includes(d.code)).map((d) => `<option value="${d.code}">${d.label} (${d.code})</option>`).join("")}
         <option value="__custom__">Custom language (manual)</option>
       </select>
-      <input id="facms-language-name" type="text" placeholder="Custom language name (e.g. Klingon)" style="width: 100%; border: 1px solid ${d === "dark" ? "#475569" : "#cbd5e1"}; background: ${d === "dark" ? "#1e293b" : "#ffffff"}; color: ${d === "dark" ? "#f1f5f9" : "#0f172a"}; border-radius: 10px; padding: 10px 12px; font-size: 14px; box-sizing: border-box; margin-bottom: 8px; display:none;" />
-      <input id="facms-language-input" type="text" placeholder="Custom language code (e.g. tlh)" style="width: 100%; border: 1px solid ${d === "dark" ? "#475569" : "#cbd5e1"}; background: ${d === "dark" ? "#1e293b" : "#ffffff"}; color: ${d === "dark" ? "#f1f5f9" : "#0f172a"}; border-radius: 10px; padding: 10px 12px; font-size: 14px; box-sizing: border-box; display:none;" />
+      <input id="facms-language-name" type="text" placeholder="Custom language name (e.g. Klingon)" style="width: 100%; border: 1px solid ${u === "dark" ? "#475569" : "#cbd5e1"}; background: ${u === "dark" ? "#1e293b" : "#ffffff"}; color: ${u === "dark" ? "#f1f5f9" : "#0f172a"}; border-radius: 10px; padding: 10px 12px; font-size: 14px; box-sizing: border-box; margin-bottom: 8px; display:none;" />
+      <input id="facms-language-input" type="text" placeholder="Custom language code (e.g. tlh)" style="width: 100%; border: 1px solid ${u === "dark" ? "#475569" : "#cbd5e1"}; background: ${u === "dark" ? "#1e293b" : "#ffffff"}; color: ${u === "dark" ? "#f1f5f9" : "#0f172a"}; border-radius: 10px; padding: 10px 12px; font-size: 14px; box-sizing: border-box; display:none;" />
       <p id="facms-language-error" style="display:none; margin: 8px 0 0 0; font-size: 12px; color: #ef4444;">Enter a valid language code.</p>
       <div style="margin-top: 14px; display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap;">
-        <button id="facms-language-cancel" style="border: 1px solid ${d === "dark" ? "#475569" : "#cbd5e1"}; background: ${d === "dark" ? "#1e293b" : "#f1f5f9"}; color: ${d === "dark" ? "#e2e8f0" : "#334155"}; border-radius: 10px; padding: 8px 12px; font-size: 13px; cursor: pointer;">Cancel</button>
+        <button id="facms-language-cancel" style="border: 1px solid ${u === "dark" ? "#475569" : "#cbd5e1"}; background: ${u === "dark" ? "#1e293b" : "#f1f5f9"}; color: ${u === "dark" ? "#e2e8f0" : "#334155"}; border-radius: 10px; padding: 8px 12px; font-size: 13px; cursor: pointer;">Cancel</button>
         <button id="facms-language-manual" style="border: 1px solid #334155; background: #334155; color: white; border-radius: 10px; padding: 8px 12px; font-size: 13px; cursor: pointer;">Add manual</button>
         ${t ? '<button id="facms-language-autofill" style="border: 1px solid #4f46e5; background: #4f46e5; color: white; border-radius: 10px; padding: 8px 12px; font-size: 13px; cursor: pointer;">Add & Auto-fill</button>' : ""}
       </div>
     </div>
   `;
-  const o = () => n.style.display = "none";
-  n.querySelector("#facms-language-cancel")?.addEventListener("click", o);
+  const r = () => n.style.display = "none";
+  n.querySelector("#facms-language-cancel")?.addEventListener("click", r);
   const s = n.querySelector("#facms-language-select"), l = n.querySelector("#facms-language-input"), c = n.querySelector("#facms-language-name");
   s?.addEventListener("change", () => {
-    const u = s.value === "__custom__";
-    l && (l.style.display = u ? "block" : "none"), c && (c.style.display = u ? "block" : "none");
+    const d = s.value === "__custom__";
+    l && (l.style.display = d ? "block" : "none"), c && (c.style.display = d ? "block" : "none");
   });
-  const f = (u) => {
+  const f = (d) => {
     const i = n.querySelector("#facms-language-error");
     let p = "";
     const g = s?.value ?? "";
-    let y = "";
-    if (g && g !== "__custom__" ? (p = T(g), y = $(p)) : (p = T(l?.value ?? ""), y = (c?.value ?? "").trim()), !p || !/^[a-z]{2,3}([_-][a-z0-9]{2,8})?$|^[a-z]{3}_[A-Za-z]+$/i.test(p)) {
+    let x = "";
+    if (g && g !== "__custom__" ? (p = I(g), x = $(p)) : (p = I(l?.value ?? ""), x = (c?.value ?? "").trim()), !p || !/^[a-z]{2,3}([_-][a-z0-9]{2,8})?$|^[a-z]{3}_[A-Za-z]+$/i.test(p)) {
       i && (i.textContent = "Enter a valid language code.", i.style.display = "block");
       return;
     }
-    if (y || (y = $(p)), e.includes(p)) {
+    if (x || (x = $(p)), e.includes(p)) {
       i && (i.textContent = `Language "${p}" already exists.`, i.style.display = "block");
       return;
     }
-    i && (i.style.display = "none"), o(), a(`${p}::${y}`, u);
+    i && (i.style.display = "none"), r(), a(`${p}::${x}`, d);
   };
   n.querySelector("#facms-language-manual")?.addEventListener("click", () => f("manual")), t && n.querySelector("#facms-language-autofill")?.addEventListener("click", () => f("auto")), document.body.appendChild(n);
 }
-function j(e, t) {
+function z(e, t) {
   if (t === void 0) {
     console.info(`[frontend-auto-cms:dashboard] ${e}`);
     return;
   }
   console.info(`[frontend-auto-cms:dashboard] ${e}`, t);
 }
-function T(e) {
+function I(e) {
   return e.trim().toLowerCase();
 }
 function $(e) {
-  const t = T(e), a = B.find((r) => r.code === t);
+  const t = I(e), a = P.find((o) => o.code === t);
   return a ? a.label : t.toUpperCase();
 }
-function je() {
+function Ne() {
   try {
-    const e = localStorage.getItem(oe);
+    const e = localStorage.getItem(se);
     if (!e)
       return {};
     const t = JSON.parse(e);
@@ -801,59 +801,59 @@ function je() {
     return {};
   }
 }
-function D(e) {
-  localStorage.setItem(oe, JSON.stringify(e));
+function q(e) {
+  localStorage.setItem(se, JSON.stringify(e));
 }
-function I(e) {
-  const t = localStorage.getItem(ne);
+function C(e) {
+  const t = localStorage.getItem(re);
   return t && e[t] ? t : e.en ? "en" : Object.keys(e)[0] ?? "en";
 }
-function W(e) {
-  localStorage.setItem(ne, e);
+function X(e) {
+  localStorage.setItem(re, e);
 }
-function x(e) {
+function y(e) {
   return e.replace(/[&<>'"]/g, (t) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", "'": "&#39;", '"': "&quot;" })[t]);
 }
 function _(e, t = 72) {
   const a = e.replace(/\s+/g, " ").trim();
   return a.length <= t ? a : `${a.slice(0, t)}...`;
 }
-function ze(e) {
+function Me(e) {
   return e.type === "section" ? _((e.sectionItems ?? []).join(" | ")) : e.type === "property" ? _(JSON.stringify(e.attrs ?? {})) : _(e.value);
 }
-function Ne(e) {
+function Be(e) {
   const t = [];
-  return e.forEach((a, r) => {
-    const n = (a.selector ?? "").trim(), o = t[t.length - 1];
-    if (!!(o && n && o.selector === n) && o) {
-      o.items.push({ node: a, index: r });
+  return e.forEach((a, o) => {
+    const n = (a.selector ?? "").trim(), r = t[t.length - 1];
+    if (!!(r && n && r.selector === n) && r) {
+      r.items.push({ node: a, index: o });
       return;
     }
     t.push({
-      key: n || `group_${r}`,
+      key: n || `group_${o}`,
       selector: n,
-      items: [{ node: a, index: r }]
+      items: [{ node: a, index: o }]
     });
   }), t;
 }
-function Me(e) {
+function Pe(e) {
   const t = (a) => {
     if (Array.isArray(a))
       return a.map(t);
     if (a && typeof a == "object") {
-      const r = Object.entries(a).sort(([n], [o]) => n.localeCompare(o));
-      return Object.fromEntries(r.map(([n, o]) => [n, t(o)]));
+      const o = Object.entries(a).sort(([n], [r]) => n.localeCompare(r));
+      return Object.fromEntries(o.map(([n, r]) => [n, t(r)]));
     }
     return a;
   };
   return JSON.stringify(t(e));
 }
-async function Be(e) {
+async function Re(e) {
   const t = new TextEncoder().encode(e), a = await crypto.subtle.digest("SHA-256", t);
-  return Array.from(new Uint8Array(a)).map((r) => r.toString(16).padStart(2, "0")).join("");
+  return Array.from(new Uint8Array(a)).map((o) => o.toString(16).padStart(2, "0")).join("");
 }
-async function Pe(e, t, a) {
-  const r = e.nodes.flatMap(
+async function De(e, t, a) {
+  const o = e.nodes.flatMap(
     (s) => s.sourceRefs.map((l) => ({
       file: l.file,
       find: l.original,
@@ -863,122 +863,128 @@ async function Pe(e, t, a) {
   ), n = {
     generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
     content: { ...e, updatedAt: (/* @__PURE__ */ new Date()).toISOString() },
-    operations: r,
+    operations: o,
     locales: t
-  }, o = await Be(Me(n));
+  }, r = await Re(Pe(n));
   return {
     ...n,
     integrity: {
       algorithm: "sha256",
-      value: o
+      value: r
     }
   };
 }
-function Re(e, t) {
-  const a = `${e.type.toUpperCase()} • ${x(e.label || e.selector || "")}`, r = `<div class="text-xs text-slate-500 dark:text-slate-400 mb-2">#${t + 1} ${a}</div>`;
+function qe(e, t) {
+  const a = `${e.type.toUpperCase()} • ${y(e.label || e.selector || "")}`, o = `<div class="text-xs text-slate-500 dark:text-slate-400 mb-2">#${t + 1} ${a}</div>`;
   if (e.type === "text")
-    return `<div class="rounded-lg p-2 bg-slate-50/60 dark:bg-slate-900/40">${r}<textarea data-cms-id="${e.id}" data-cms-field="value" class="w-full border border-slate-300 dark:border-slate-800 bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 rounded-lg p-2 text-sm h-24 focus:outline-none focus:ring-2 focus:ring-indigo-500/40">${x(e.value)}</textarea></div>`;
+    return `<div class="rounded-lg p-2 bg-slate-50/60 dark:bg-slate-900/40">${o}<textarea data-cms-id="${e.id}" data-cms-field="value" class="w-full border border-slate-300 dark:border-slate-800 bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 rounded-lg p-2 text-sm h-24 focus:outline-none focus:ring-2 focus:ring-indigo-500/40">${y(e.value)}</textarea></div>`;
   if (e.type === "image" || e.type === "video")
-    return `<div class="rounded-lg p-2 bg-slate-50/60 dark:bg-slate-900/40">${r}<label class="text-xs text-slate-500 dark:text-slate-400">Source URL</label><input data-cms-id="${e.id}" data-cms-field="value" value="${x(e.value)}" class="w-full border border-slate-300 dark:border-slate-800 bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 rounded-lg p-2 text-sm mb-2 focus:outline-none focus:ring-2 focus:ring-indigo-500/40" /><label class="text-xs text-slate-500 dark:text-slate-400">Alt text</label><input data-cms-id="${e.id}" data-cms-field="alt" value="${x(e.attrs?.alt ?? "")}" class="w-full border border-slate-300 dark:border-slate-800 bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 rounded-lg p-2 text-sm focus:outline-none focus:ring-2 focus:ring-indigo-500/40" /></div>`;
+    return `<div class="rounded-lg p-2 bg-slate-50/60 dark:bg-slate-900/40">${o}<label class="text-xs text-slate-500 dark:text-slate-400">Source URL</label><input data-cms-id="${e.id}" data-cms-field="value" value="${y(e.value)}" class="w-full border border-slate-300 dark:border-slate-800 bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 rounded-lg p-2 text-sm mb-2 focus:outline-none focus:ring-2 focus:ring-indigo-500/40" /><label class="text-xs text-slate-500 dark:text-slate-400">Alt text</label><input data-cms-id="${e.id}" data-cms-field="alt" value="${y(e.attrs?.alt ?? "")}" class="w-full border border-slate-300 dark:border-slate-800 bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 rounded-lg p-2 text-sm focus:outline-none focus:ring-2 focus:ring-indigo-500/40" /></div>`;
   if (e.type === "section") {
     const n = (e.sectionItems ?? []).join(`
 `);
-    return `<div class="rounded-lg p-2 bg-slate-50/60 dark:bg-slate-900/40">${r}<textarea data-cms-id="${e.id}" data-cms-field="sectionItems" class="w-full border border-slate-300 dark:border-slate-800 bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 rounded-lg p-2 text-sm h-28 focus:outline-none focus:ring-2 focus:ring-indigo-500/40">${x(n)}</textarea></div>`;
+    return `<div class="rounded-lg p-2 bg-slate-50/60 dark:bg-slate-900/40">${o}<textarea data-cms-id="${e.id}" data-cms-field="sectionItems" class="w-full border border-slate-300 dark:border-slate-800 bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 rounded-lg p-2 text-sm h-28 focus:outline-none focus:ring-2 focus:ring-indigo-500/40">${y(n)}</textarea></div>`;
   }
-  return `<div class="rounded-lg p-2 bg-slate-50/60 dark:bg-slate-900/40">${r}<textarea data-cms-id="${e.id}" data-cms-field="attrs" class="w-full border border-slate-300 dark:border-slate-800 bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 rounded-lg p-2 text-xs h-28 focus:outline-none focus:ring-2 focus:ring-indigo-500/40">${x(JSON.stringify(e.attrs ?? {}, null, 2))}</textarea></div>`;
+  return `<div class="rounded-lg p-2 bg-slate-50/60 dark:bg-slate-900/40">${o}<textarea data-cms-id="${e.id}" data-cms-field="attrs" class="w-full border border-slate-300 dark:border-slate-800 bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 rounded-lg p-2 text-xs h-28 focus:outline-none focus:ring-2 focus:ring-indigo-500/40">${y(JSON.stringify(e.attrs ?? {}, null, 2))}</textarea></div>`;
 }
-function S(e, t, a, r) {
+function S(e, t, a, o) {
   e.nodes.forEach((n) => {
-    n.type === "text" && (n.value = t[n.key] ?? r[n.key] ?? n.value, ae(n, a));
+    n.type === "text" && (n.value = t[n.key] ?? o[n.key] ?? n.value, oe(n, a));
   });
 }
-function De(e, t) {
+function He(e, t) {
   e.activeLanguage = t;
   const a = e.locales[t] ?? e.locales[e.mainLanguage] ?? e.baseTextByKey;
   S(e.content, a, e.workingDocument, e.baseTextByKey);
 }
-function qe(e, t) {
+function Ue(e, t) {
   const a = e.querySelector("#facms-language-tabs");
   if (!a)
     return;
-  const r = Object.keys(t.locales);
-  a.innerHTML = r.map((n) => {
-    const o = n === t.activeLanguage, s = n === t.mainLanguage, l = t.languageLabels[n] ?? $(n);
-    return `<div class="inline-flex items-center rounded-lg overflow-hidden border ${o ? "border-indigo-500" : "border-slate-200 dark:border-slate-700"}">
-        <button data-lang="${n}" class="px-2.5 py-1.5 text-xs ${o ? "bg-indigo-600 text-white" : "bg-slate-100 dark:bg-slate-800 text-slate-700 dark:text-slate-200"}">${x(l)}</button>
-        ${s ? `<span class="px-2 py-1.5 text-[10px] font-semibold ${o ? "bg-indigo-700 text-indigo-100" : "bg-emerald-600 text-white"}">MAIN</span>` : `<button data-main-lang="${n}" title="Set as main language" class="px-2 py-1.5 text-xs ${o ? "bg-indigo-700 text-indigo-100 hover:bg-indigo-800" : "bg-emerald-600 text-white hover:bg-emerald-500"}">★</button>`}
-        <button data-remove-lang="${n}" title="Remove language" class="px-2 py-1.5 text-xs ${o ? "bg-indigo-700 text-indigo-100 hover:bg-indigo-800" : "bg-slate-200 dark:bg-slate-700 text-slate-700 dark:text-slate-200 hover:bg-slate-300 dark:hover:bg-slate-600"}">×</button>
+  const o = Object.keys(t.locales);
+  a.innerHTML = o.map((n) => {
+    const r = n === t.activeLanguage, s = n === t.mainLanguage, l = t.languageLabels[n] ?? $(n);
+    return `<div class="inline-flex items-center rounded-lg overflow-hidden border ${r ? "border-indigo-500" : "border-slate-200 dark:border-slate-700"}">
+        <button data-lang="${n}" class="px-2.5 py-1.5 text-xs ${r ? "bg-indigo-600 text-white" : "bg-slate-100 dark:bg-slate-800 text-slate-700 dark:text-slate-200"}">${y(l)}</button>
+        ${s ? `<span class="px-2 py-1.5 text-[10px] font-semibold ${r ? "bg-indigo-700 text-indigo-100" : "bg-emerald-600 text-white"}">MAIN</span>` : `<button data-main-lang="${n}" title="Set as main language" class="px-2 py-1.5 text-xs ${r ? "bg-indigo-700 text-indigo-100 hover:bg-indigo-800" : "bg-emerald-600 text-white hover:bg-emerald-500"}">★</button>`}
+        <button data-remove-lang="${n}" title="Remove language" class="px-2 py-1.5 text-xs ${r ? "bg-indigo-700 text-indigo-100 hover:bg-indigo-800" : "bg-slate-200 dark:bg-slate-700 text-slate-700 dark:text-slate-200 hover:bg-slate-300 dark:hover:bg-slate-600"}">×</button>
       </div>`;
   }).join(""), a.querySelectorAll("[data-lang]").forEach((n) => {
     n.addEventListener("click", () => {
-      const o = n.dataset.lang;
-      o && (De(t, o), L(e, t));
+      const r = n.dataset.lang;
+      r && (He(t, r), L(e, t));
     });
   }), a.querySelectorAll("[data-main-lang]").forEach((n) => {
-    n.addEventListener("click", (o) => {
-      o.stopPropagation();
+    n.addEventListener("click", (r) => {
+      r.stopPropagation();
       const s = n.dataset.mainLang;
-      !s || !t.locales[s] || (t.mainLanguage = s, W(s), t.baseTextByKey = { ...t.locales[s] }, L(e, t));
+      !s || !t.locales[s] || (t.mainLanguage = s, X(s), t.baseTextByKey = { ...t.locales[s] }, L(e, t));
     });
   }), a.querySelectorAll("[data-remove-lang]").forEach((n) => {
-    n.addEventListener("click", (o) => {
-      o.stopPropagation();
+    n.addEventListener("click", (r) => {
+      r.stopPropagation();
       const s = n.dataset.removeLang;
       if (s) {
         if (Object.keys(t.locales).length <= 1) {
           alert("You must keep at least one language.");
           return;
         }
-        delete t.locales[s], delete t.languageLabels[s], D(t.languageLabels), A(t.locales), t.mainLanguage === s && (t.mainLanguage = I(t.locales), W(t.mainLanguage), t.baseTextByKey = { ...t.locales[t.mainLanguage] ?? {} }), t.activeLanguage === s && (t.activeLanguage = q(t.locales, t.mainLanguage)), ue(t), L(e, t);
+        delete t.locales[s], delete t.languageLabels[s], q(t.languageLabels), A(t.locales), t.mainLanguage === s && (t.mainLanguage = C(t.locales), X(t.mainLanguage), t.baseTextByKey = { ...t.locales[t.mainLanguage] ?? {} }), t.activeLanguage === s && (t.activeLanguage = H(t.locales, t.mainLanguage)), pe(t), L(e, t);
       }
     });
   });
 }
-function He(e, t) {
+function Ge(e, t) {
   e.querySelectorAll("[data-cms-id]").forEach((a) => {
-    const r = a.dataset.cmsId, n = a.dataset.cmsField;
-    !r || !n || a.addEventListener("input", () => {
-      const o = t.content.nodes.find((s) => s.id === r);
-      if (o) {
+    const o = a.dataset.cmsId, n = a.dataset.cmsField;
+    !o || !n || a.addEventListener("input", () => {
+      const r = t.content.nodes.find((s) => s.id === o);
+      if (r) {
         if (n === "value")
-          o.value = a.value, o.type === "text" && (t.activeLanguage === t.mainLanguage ? (t.baseTextByKey[o.key] = a.value, t.locales[t.mainLanguage] = { ...t.locales[t.mainLanguage] ?? {}, [o.key]: a.value }) : t.locales[t.activeLanguage] = {
+          r.value = a.value, r.type === "text" && (t.activeLanguage === t.mainLanguage ? (t.baseTextByKey[r.key] = a.value, t.locales[t.mainLanguage] = { ...t.locales[t.mainLanguage] ?? {}, [r.key]: a.value }) : t.locales[t.activeLanguage] = {
             ...t.locales[t.activeLanguage] ?? {},
-            [o.key]: a.value
+            [r.key]: a.value
           }, A(t.locales));
-        else if (n === "alt") o.attrs = { ...o.attrs ?? {}, alt: a.value };
-        else if (n === "sectionItems") o.sectionItems = a.value.split(`
+        else if (n === "alt") r.attrs = { ...r.attrs ?? {}, alt: a.value };
+        else if (n === "sectionItems") r.sectionItems = a.value.split(`
 `).map((s) => s.trim()).filter(Boolean);
         else if (n === "attrs")
           try {
-            o.attrs = JSON.parse(a.value);
+            r.attrs = JSON.parse(a.value);
           } catch {
             return;
           }
-        ae(o, t.workingDocument), Q(t.content);
+        oe(r, t.workingDocument), te(t.content);
       }
     });
   });
 }
 function w(e, t, a) {
-  const r = e.querySelector("#facms-i18n-status"), n = e.querySelector("#facms-translate-loader"), o = e.querySelector("#facms-add-language"), s = document.getElementById("facms-global-loader"), l = document.getElementById("facms-global-loader-label");
-  r && (r.textContent = t), n && (n.style.display = a ? "inline-flex" : "none"), o && (o.disabled = a), s && (s.style.display = a ? "flex" : "none"), l && (l.textContent = a ? t : "Translating");
+  const o = e.querySelector("#facms-i18n-status"), n = e.querySelector("#facms-translate-loader"), r = e.querySelector("#facms-add-language");
+  B(a, t), o && (o.textContent = t), n && (n.style.display = a ? "inline-flex" : "none"), r && (r.disabled = a);
+}
+function B(e, t) {
+  const a = document.getElementById("facms-global-loader"), o = document.getElementById("facms-global-loader-label");
+  a && (a.style.display = e ? "flex" : "none"), o && (o.textContent = e ? t : "Loading");
 }
 function L(e, t) {
-  const r = Ne(t.content.nodes).map((n) => {
-    const o = n.items[0], s = n.items[n.items.length - 1], l = o.index === s.index ? `#${o.index + 1}` : `#${o.index + 1} - #${s.index + 1}`, c = n.items.map((i) => ze(i.node)).filter(Boolean).join(" • "), f = n.items.length > 1 ? `${l} ${x(n.selector || "Grouped fields")} (${n.items.length} fields)` : `${l} ${x(o.node.type.toUpperCase())} • ${x(o.node.label || o.node.selector || "")}`, u = n.items.map((i) => Re(i.node, i.index)).join("");
+  const a = Be(t.content.nodes), o = a.length ? a.map((n) => {
+    const r = n.items[0], s = n.items[n.items.length - 1], l = r.index === s.index ? `#${r.index + 1}` : `#${r.index + 1} - #${s.index + 1}`, c = n.items.map((i) => Me(i.node)).filter(Boolean).join(" • "), f = n.items.length > 1 ? `${l} ${y(n.selector || "Grouped fields")} (${n.items.length} fields)` : `${l} ${y(r.node.type.toUpperCase())} • ${y(r.node.label || r.node.selector || "")}`, d = n.items.map((i) => qe(i.node, i.index)).join("");
     return `
         <details class="rounded-xl p-2 border border-slate-200 dark:border-transparent bg-white dark:bg-slate-900/60 shadow-sm">
           <summary class="list-none cursor-pointer flex items-center justify-between gap-2 p-3 rounded-lg bg-slate-50 dark:bg-slate-800/70 border border-slate-200 dark:border-slate-800">
             <div class="min-w-0">
               <div class="text-xs text-slate-500 dark:text-slate-400">${f}</div>
-              <div class="text-sm text-slate-700 dark:text-slate-300 truncate">${x(_(c || "No preview"))}</div>
+              <div class="text-sm text-slate-700 dark:text-slate-300 truncate">${y(_(c || "No preview"))}</div>
             </div>
             <span class="text-xs text-indigo-600 dark:text-indigo-400">Expand</span>
           </summary>
-          <div class="pt-3 px-2 pb-2 space-y-2">${u}</div>
+          <div class="pt-3 px-2 pb-2 space-y-2">${d}</div>
         </details>
       `;
-  }).join("");
+  }).join("") : `<div class="rounded-xl p-3 border border-slate-700 bg-slate-900/70 text-slate-300 text-sm">
+         No editable elements detected yet on this route. This page may still be rendering client-side content. Wait a moment, then switch routes and come back.
+       </div>`;
   e.innerHTML = `
     <div class="p-4 space-y-3">
       <p class="text-xs text-slate-500 dark:text-slate-400 mb-2">All editable elements are shown in page order.</p>
@@ -986,7 +992,7 @@ function L(e, t) {
         <div id="facms-language-tabs" class="flex flex-wrap gap-2"></div>
         <button id="facms-add-language" class="px-2.5 py-1.5 rounded-lg text-xs border border-indigo-500 text-indigo-600 dark:text-indigo-300 dark:border-indigo-400 hover:bg-indigo-50 dark:hover:bg-indigo-900/30">+ Add translation</button>
       </div>
-      <div class="space-y-3">${r}</div>
+      <div class="space-y-3">${o}</div>
       <div class="mt-4 flex flex-wrap gap-2">
         <button id="facms-save" class="px-3 py-2 bg-emerald-600 text-white rounded-lg text-sm hover:bg-emerald-500 shadow">Save + Publish</button>
       </div>
@@ -995,17 +1001,17 @@ function L(e, t) {
         <p id="facms-i18n-status" class="text-xs text-slate-500 dark:text-slate-400"></p>
       </div>
     </div>
-  `, qe(e, t), e.querySelector("#facms-save")?.addEventListener("click", async () => {
-    const n = await Pe(t.content, t.locales, t.baseTextByKey), o = await ve();
-    if (!o || o.provider === "none") {
-      be(n), alert("Patch downloaded. Configure hosting in setup for one-click publish.");
+  `, Ue(e, t), e.querySelector("#facms-save")?.addEventListener("click", async () => {
+    const n = await De(t.content, t.locales, t.baseTextByKey), r = await Le();
+    if (!r || r.provider === "none") {
+      ye(n), alert("Patch downloaded. Configure hosting in setup for one-click publish.");
       return;
     }
-    const s = o.provider;
-    Ce(s, async (l) => {
+    const s = r.provider;
+    je(s, async (l) => {
       let c = !1;
       try {
-        c = await $e(n, l, o);
+        c = await Ee(n, l, r);
       } catch {
         c = !1;
       }
@@ -1016,92 +1022,105 @@ function L(e, t) {
       alert("Changes published successfully.");
     });
   }), e.querySelector("#facms-add-language")?.addEventListener("click", () => {
-    Oe(Object.keys(t.locales), h?.autoTranslateEnabled ?? !0, async (n, o) => {
-      const [s, l] = n.split("::"), c = T(s ?? ""), f = (l ?? "").trim() || $(c);
+    ze(Object.keys(t.locales), h?.autoTranslateEnabled ?? !0, async (n, r) => {
+      const [s, l] = n.split("::"), c = I(s ?? ""), f = (l ?? "").trim() || $(c);
       if (!c)
         return;
-      const u = performance.now(), i = t.locales[t.mainLanguage] ?? t.baseTextByKey, p = { ...i };
-      if (j("Add language requested", {
+      const d = performance.now(), i = t.locales[t.mainLanguage] ?? t.baseTextByKey, p = { ...i };
+      if (z("Add language requested", {
         lang: c,
-        mode: o,
+        mode: r,
         sourceKeys: Object.keys(i).length,
         browserLanguage: navigator.language,
         browserLanguages: navigator.languages
-      }), t.locales[c] = p, t.languageLabels[c] = f, D(t.languageLabels), t.activeLanguage = c, A(t.locales), S(t.content, t.locales[c], t.workingDocument, t.baseTextByKey), L(e, t), j("Manual language tab created", { lang: c }), w(e, `Added ${f} tab prefilled with source text for manual translation.`, !1), o !== "auto" || !(h?.autoTranslateEnabled ?? !0)) {
-        o === "auto" && !(h?.autoTranslateEnabled ?? !0) && w(e, `Privacy mode is on. Added ${f} tab for manual translation only.`, !1);
+      }), t.locales[c] = p, t.languageLabels[c] = f, q(t.languageLabels), t.activeLanguage = c, A(t.locales), S(t.content, t.locales[c], t.workingDocument, t.baseTextByKey), L(e, t), z("Manual language tab created", { lang: c }), w(e, `Added ${f} tab prefilled with source text for manual translation.`, !1), r !== "auto" || !(h?.autoTranslateEnabled ?? !0)) {
+        r === "auto" && !(h?.autoTranslateEnabled ?? !0) && w(e, `Privacy mode is on. Added ${f} tab for manual translation only.`, !1);
         return;
       }
       try {
         const g = Object.keys(i).length;
         w(e, `Auto-filling ${f} translation... (0/${g})`, !0);
-        const y = await he(i, c, t.mainLanguage, (H, b) => {
-          w(e, `Auto-filling ${f} translation... (${H}/${b})`, !0);
+        const x = await ve(i, c, t.mainLanguage, (U, b) => {
+          w(e, `Auto-filling ${f} translation... (${U}/${b})`, !0);
         });
-        t.locales[c] = y, A(t.locales), t.activeLanguage = c, S(t.content, y, t.workingDocument, t.baseTextByKey), L(e, t), j("Automatic translation succeeded", {
+        t.locales[c] = x, A(t.locales), t.activeLanguage = c, S(t.content, x, t.workingDocument, t.baseTextByKey), L(e, t), z("Automatic translation succeeded", {
           lang: c,
-          translatedKeys: Object.keys(y).length,
-          ms: Math.round(performance.now() - u)
+          translatedKeys: Object.keys(x).length,
+          ms: Math.round(performance.now() - d)
         }), w(e, `Added ${f} with auto-filled translation. Review and edit as needed.`, !1);
       } catch (g) {
         console.error("[frontend-auto-cms:dashboard] Automatic translation failed", {
           lang: c,
           message: g instanceof Error ? g.message : String(g),
           stack: g instanceof Error ? g.stack : void 0,
-          ms: Math.round(performance.now() - u)
+          ms: Math.round(performance.now() - d)
         }), w(e, `Auto-fill failed. ${f} stays prefilled with source text for manual editing.`, !1);
       }
     });
-  }), He(e, t);
+  }), Ge(e, t);
 }
-function q(e, t) {
-  const a = Object.keys(e), r = t && e[t] ? t : I(e), n = [...navigator.languages ?? [], navigator.language].map((o) => o.toLowerCase().split("-")[0]);
-  for (const o of n)
-    if (a.includes(o))
-      return o;
-  return a.includes(r) ? r : a[0] ?? "en";
+function H(e, t) {
+  const a = Object.keys(e), o = t && e[t] ? t : C(e), n = [...navigator.languages ?? [], navigator.language].map((r) => r.toLowerCase().split("-")[0]);
+  for (const r of n)
+    if (a.includes(r))
+      return r;
+  return a.includes(o) ? o : a[0] ?? "en";
 }
-function ue(e) {
+function pe(e) {
   const t = e.locales[e.activeLanguage] ?? e.locales.en ?? e.baseTextByKey;
   S(e.content, t, e.workingDocument, e.baseTextByKey);
 }
-function Ue(e, t, a) {
-  const r = ee(), n = {
+function Ke(e) {
+  return new Promise((t) => window.setTimeout(t, e));
+}
+async function Z(e, t) {
+  const a = [0, 120, 280, 600, 1100, 1800, 2600];
+  let o = T(e, t);
+  if (o.nodes.length > 0)
+    return o;
+  for (const n of a.slice(1))
+    if (await Ke(n), o = T(e, t), o.nodes.length > 0)
+      return o;
+  return o;
+}
+function Je(e, t, a) {
+  const o = ae(), n = {
     ...a,
-    ...r
-  }, o = je(), s = Object.fromEntries(e.nodes.filter((i) => i.type === "text").map((i) => [i.key, i.value])), l = I(n), c = {
+    ...o
+  }, r = Ne(), s = Object.fromEntries(e.nodes.filter((i) => i.type === "text").map((i) => [i.key, i.value])), l = C(n), c = {
     ...n,
     [l]: { ...n[l] ?? {}, ...s }
   };
   !c.en && l === "en" && (c.en = Object.assign({}, c.en ?? {}, s));
-  const f = q(c, l), u = { ...o };
+  const f = H(c, l), d = { ...r };
   return Object.keys(c).forEach((i) => {
-    u[i] || (u[i] = $(i));
-  }), D(u), {
+    d[i] || (d[i] = $(i));
+  }), q(d), {
     content: e,
     locales: c,
     workingDocument: t,
     baseTextByKey: c[l] ?? s,
     activeLanguage: f,
     mainLanguage: l,
-    languageLabels: u
+    languageLabels: d
   };
 }
-function Ge() {
-  const e = ee();
+function Fe() {
+  const e = ae();
   if (!Object.keys(e).length)
     return;
-  const t = q(e, I(e));
+  const t = H(e, C(e));
   if (!t || t === "en")
     return;
-  const a = N(document, location.pathname), r = e[t];
-  if (!r)
+  const a = T(document, location.pathname), o = e[t];
+  if (!o)
     return;
-  const n = Object.fromEntries(a.nodes.filter((o) => o.type === "text").map((o) => [o.key, o.value]));
-  S(a, r, document, n);
+  const n = Object.fromEntries(a.nodes.filter((r) => r.type === "text").map((r) => [r.key, r.value]));
+  S(a, o, document, n);
 }
-function Ke(e) {
+function Ye(e) {
   const t = e.pages.length ? e.pages : ["/"];
-  document.documentElement.style.margin = "0", document.documentElement.style.padding = "0", document.documentElement.style.background = d === "dark" ? "#020617" : "#f1f5f9", document.body.style.margin = "0", document.body.style.padding = "0", document.body.style.background = d === "dark" ? "#020617" : "#f1f5f9", document.body.innerHTML = `
+  document.documentElement.style.margin = "0", document.documentElement.style.padding = "0", document.documentElement.style.background = u === "dark" ? "#020617" : "#f1f5f9", document.body.style.margin = "0", document.body.style.padding = "0", document.body.style.background = u === "dark" ? "#020617" : "#f1f5f9", document.body.innerHTML = `
     <div id="facms-app" class="h-screen w-screen grid grid-cols-1 lg:grid-cols-[760px_1fr] bg-slate-100 dark:bg-slate-950 text-slate-900 dark:text-slate-100">
       <div class="border-r border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 overflow-hidden grid grid-rows-[auto_1fr]">
         <div class="p-4 border-b border-slate-200 dark:border-slate-800 flex items-start justify-between gap-3">
@@ -1129,61 +1148,67 @@ function Ke(e) {
       </div>
     </div>
   `;
-  const a = document.getElementById("facms-route-preview"), r = document.getElementById("facms-route-editor"), n = document.getElementById("facms-page-tabs"), o = /* @__PURE__ */ new Map();
+  const a = document.getElementById("facms-route-preview"), o = document.getElementById("facms-route-editor"), n = document.getElementById("facms-page-tabs"), r = /* @__PURE__ */ new Map();
   let s = t[0], l = {};
   const c = () => {
     n.innerHTML = t.map(
-      (f) => `<button data-page="${f}" class="w-full text-left px-3 py-2 rounded-lg text-sm border ${f === s ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-100 border-slate-200 dark:bg-slate-800 dark:border-slate-700 text-slate-700 dark:text-slate-200 hover:bg-slate-200 dark:hover:bg-slate-700"}">${x(f)}</button>`
+      (f) => `<button data-page="${f}" class="w-full text-left px-3 py-2 rounded-lg text-sm border ${f === s ? "bg-indigo-600 border-indigo-500 text-white" : "bg-slate-100 border-slate-200 dark:bg-slate-800 dark:border-slate-700 text-slate-700 dark:text-slate-200 hover:bg-slate-200 dark:hover:bg-slate-700"}">${y(f)}</button>`
     ).join(""), n.querySelectorAll("[data-page]").forEach((f) => {
       f.addEventListener("click", () => {
         s = f.dataset.page || "/", c(), a.src = s;
       });
     });
   };
-  se(d), a.addEventListener("load", () => {
+  le(u), a.addEventListener("load", async () => {
     const f = a.contentDocument;
-    if (!f) return;
-    let u = o.get(s);
-    if (u) {
-      u.workingDocument = f;
-      const i = N(f, s);
-      i.nodes.length && !u.content.nodes.length && (u.content = i);
-    } else {
-      const i = N(f, s);
-      u = Ue(i, f, l), o.set(s, u);
+    if (f) {
+      B(!0, `Scanning page content for ${s}...`);
+      try {
+        let d = r.get(s);
+        if (d) {
+          d.workingDocument = f;
+          const i = d.content.nodes.length ? T(f, s) : await Z(f, s);
+          i.nodes.length && !d.content.nodes.length && (d.content = i);
+        } else {
+          const i = await Z(f, s);
+          d = Je(i, f, l), r.set(s, d);
+        }
+        pe(d), te(d.content), L(o, d);
+      } finally {
+        B(!1, "Loading");
+      }
     }
-    ue(u), Q(u.content), L(r, u);
-  }), c(), ge().then((f) => {
+  }), c(), me().then((f) => {
     l = f, a.src = s;
   });
 }
-async function X() {
-  if (re(), le(), !await ce())
+async function Q() {
+  if (ie(), ce(), !await ue())
     return;
-  const e = await ie(), t = () => Ke(e);
-  if (!P) {
-    de(t);
+  const e = await de(), t = () => Ye(e);
+  if (!R) {
+    fe(t);
     return;
   }
   t();
 }
-async function Je() {
-  const e = await ie(), a = new URLSearchParams(location.search).get("__facms") === "1";
+async function We() {
+  const e = await de(), a = new URLSearchParams(location.search).get("__facms") === "1";
   if (location.pathname !== e.dashboardPath && !a) {
-    Ge();
+    Fe();
     return;
   }
-  if (re(), le(), !!await ce()) {
-    if (!P) {
-      de(() => {
-        X();
+  if (ie(), ce(), !!await ue()) {
+    if (!R) {
+      fe(() => {
+        Q();
       });
       return;
     }
-    X();
+    Q();
   }
 }
 export {
-  X as launchDashboard,
-  Je as registerCmsLauncher
+  Q as launchDashboard,
+  We as registerCmsLauncher
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "frontend-auto-cms",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "Turn any frontend into an editable mini-CMS with one import.",
   "type": "module",
   "license": "MIT",