@broberg/cms-inline-edit 0.4.1 → 0.4.3

package/dist/index.cjs

@@ -20,6 +20,9 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  buildConnectUrl: () => buildConnectUrl,
+  disconnect: () => disconnect,
+  getConnectedToken: () => getConnectedToken,
   initInlineEdit: () => initInlineEdit
 });
 module.exports = __toCommonJS(index_exports);
@@ -27,30 +30,78 @@ function resolveOptions(options) {
   return {
     tokenParam: "cms_edit",
     storageKey: "wh-inline-edit-token",
+    connectLabel: "\u{1F512} Log ind for at redigere",
     ...options
   };
 }
-function initInlineEdit(options) {
+async function initInlineEdit(options) {
   if (typeof window === "undefined") return;
   const resolved = resolveOptions(options);
-  const token = bootstrapToken(resolved);
-  if (!token) return;
-  activateEditMode(token, resolved);
+  captureTokenFromUrl(resolved);
+  const enabled = await checkEnabled(resolved);
+  if (!enabled) return;
+  const token = getConnectedToken(options);
+  if (token) {
+    activateEditMode(token, resolved);
+  } else {
+    showConnectPrompt(resolved);
+  }
 }
-function bootstrapToken(options) {
+function getConnectedToken(options) {
+  if (typeof window === "undefined") return null;
+  const resolved = resolveOptions(options);
+  captureTokenFromUrl(resolved);
+  const token = localStorage.getItem(resolved.storageKey);
+  if (!token) return null;
+  if (isExpired(token)) {
+    localStorage.removeItem(resolved.storageKey);
+    return null;
+  }
+  return token;
+}
+function buildConnectUrl(options, returnUrl) {
+  const resolved = resolveOptions(options);
+  return `${resolved.cmsBaseUrl}/admin/inline-edit/connect?site=${encodeURIComponent(resolved.siteId)}&return=${encodeURIComponent(returnUrl)}`;
+}
+function disconnect(options) {
+  if (typeof window === "undefined") return;
+  localStorage.removeItem(resolveOptions(options).storageKey);
+}
+function captureTokenFromUrl(options) {
   const url = new URL(window.location.href);
   const urlToken = url.searchParams.get(options.tokenParam);
-  if (urlToken) {
-    sessionStorage.setItem(options.storageKey, urlToken);
-    url.searchParams.delete(options.tokenParam);
-    window.history.replaceState({}, "", url.toString());
-    return urlToken;
+  if (!urlToken) return;
+  localStorage.setItem(options.storageKey, urlToken);
+  url.searchParams.delete(options.tokenParam);
+  window.history.replaceState({}, "", url.toString());
+}
+async function checkEnabled(options) {
+  try {
+    const res = await fetch(`${options.cmsBaseUrl}/api/inline-edit/status?site=${options.siteId}`);
+    if (!res.ok) return false;
+    const body = await res.json();
+    return body.enabled === true;
+  } catch {
+    return false;
   }
-  return sessionStorage.getItem(options.storageKey);
+}
+function isExpired(token) {
+  const claims = decodeJwtPayload(token);
+  const exp = typeof claims?.exp === "number" ? claims.exp : 0;
+  return exp <= Date.now() / 1e3;
+}
+function showConnectPrompt(options) {
+  const connectUrl = buildConnectUrl(options, window.location.href);
+  const link = document.createElement("a");
+  link.href = connectUrl;
+  link.textContent = options.connectLabel;
+  link.setAttribute("data-cms-inline-edit-connect", "");
+  link.style.cssText = "position:fixed;bottom:16px;left:16px;background:#1c2027;color:#fff;font:600 12px system-ui,sans-serif;padding:8px 14px;border-radius:999px;text-decoration:none;z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);";
+  document.body.appendChild(link);
 }
 function activateEditMode(token, options) {
   injectStyles();
-  showActiveBadge(token);
+  showActiveBadge(token, options);
   const fields = document.querySelectorAll("[data-cms-field]");
   fields.forEach((el) => wireField(el, token, options));
 }
@@ -138,13 +189,24 @@ function showPill(el, state) {
     pill.style.color = "#fff";
   }
 }
-function showActiveBadge(token) {
+function showActiveBadge(token, options) {
   const claims = decodeJwtPayload(token);
   const name = claims?.name || claims?.email || "ukendt";
   const badge = document.createElement("div");
   badge.setAttribute("data-cms-inline-edit-badge", "");
-  badge.textContent = `\u270F\uFE0F Redigerer som ${name}`;
-  badge.style.cssText = "position:fixed;bottom:16px;left:16px;background:#1c2027;color:#fff;font:600 12px system-ui,sans-serif;padding:8px 14px;border-radius:999px;z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);";
+  badge.style.cssText = "position:fixed;bottom:16px;left:16px;display:flex;align-items:center;gap:8px;background:#1c2027;color:#fff;font:600 12px system-ui,sans-serif;padding:8px 14px;border-radius:999px;z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);";
+  const label = document.createElement("span");
+  label.textContent = `\u270F\uFE0F Redigerer som ${name}`;
+  badge.appendChild(label);
+  const disconnectBtn = document.createElement("button");
+  disconnectBtn.type = "button";
+  disconnectBtn.textContent = "Afbryd";
+  disconnectBtn.style.cssText = "background:none;border:none;color:#8ab4ff;font:600 11px system-ui,sans-serif;cursor:pointer;padding:0;text-decoration:underline;";
+  disconnectBtn.addEventListener("click", () => {
+    disconnect(options);
+    window.location.reload();
+  });
+  badge.appendChild(disconnectBtn);
   document.body.appendChild(badge);
 }
 function decodeJwtPayload(token) {
@@ -167,6 +229,9 @@ function injectStyles() {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  buildConnectUrl,
+  disconnect,
+  getConnectedToken,
   initInlineEdit
 });
 //# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * Browser entry — zero dependencies. Activates click-to-edit on any element\n * carrying data-cms-collection/data-cms-slug/data-cms-field (F129's attribute\n * convention), when a valid edit-session token is present.\n */\n\nexport interface InlineEditOptions {\n  /** Base URL of the CMS API, e.g. \"https://webhouse.app\". */\n  cmsBaseUrl: string;\n  /** Site id passed as ?site= on every CMS API call, e.g. \"broberg-ai\". */\n  siteId: string;\n  /** URL query param carrying the short-lived edit-session token. Default \"cms_edit\". */\n  tokenParam?: string;\n  /** sessionStorage key the token is persisted under across page loads. Default \"wh-inline-edit-token\". */\n  storageKey?: string;\n}\n\ninterface ResolvedOptions extends Required<InlineEditOptions> {}\n\nfunction resolveOptions(options: InlineEditOptions): ResolvedOptions {\n  return {\n    tokenParam: \"cms_edit\",\n    storageKey: \"wh-inline-edit-token\",\n    ...options,\n  };\n}\n\nexport function initInlineEdit(options: InlineEditOptions): void {\n  if (typeof window === \"undefined\") return;\n  const resolved = resolveOptions(options);\n  const token = bootstrapToken(resolved);\n  if (!token) return;\n  activateEditMode(token, resolved);\n}\n\nfunction bootstrapToken(options: ResolvedOptions): string | null {\n  const url = new URL(window.location.href);\n  const urlToken = url.searchParams.get(options.tokenParam);\n  if (urlToken) {\n    sessionStorage.setItem(options.storageKey, urlToken);\n    url.searchParams.delete(options.tokenParam);\n    window.history.replaceState({}, \"\", url.toString());\n    return urlToken;\n  }\n  return sessionStorage.getItem(options.storageKey);\n}\n\nfunction activateEditMode(token: string, options: ResolvedOptions): void {\n  injectStyles();\n  showActiveBadge(token);\n\n  const fields = document.querySelectorAll<HTMLElement>(\"[data-cms-field]\");\n  fields.forEach((el) => wireField(el, token, options));\n}\n\nfunction wireField(el: HTMLElement, token: string, options: ResolvedOptions): void {\n  el.addEventListener(\"click\", () => {\n    if (el.getAttribute(\"contenteditable\") === \"true\") return;\n    el.dataset.cmsOriginalValue = el.textContent ?? \"\";\n    el.setAttribute(\"contenteditable\", \"true\");\n    el.focus();\n  });\n\n  el.addEventListener(\"blur\", () => {\n    el.removeAttribute(\"contenteditable\");\n    const original = el.dataset.cmsOriginalValue ?? \"\";\n    const current = el.textContent ?? \"\";\n    if (current.trim() === original.trim()) return;\n    void saveField(el, token, options);\n  });\n\n  el.addEventListener(\"paste\", (e) => {\n    e.preventDefault();\n    const text = e.clipboardData?.getData(\"text/plain\") ?? \"\";\n    document.execCommand(\"insertText\", false, text);\n  });\n\n  el.addEventListener(\"keydown\", (e) => {\n    if (e.key === \"Enter\") {\n      e.preventDefault();\n      el.blur();\n    }\n  });\n}\n\nasync function saveField(el: HTMLElement, token: string, options: ResolvedOptions): Promise<void> {\n  const collection = el.dataset.cmsCollection;\n  const slug = el.dataset.cmsSlug;\n  const field = el.dataset.cmsField;\n  if (!collection || !slug || !field) return;\n  const value = el.textContent?.trim() ?? \"\";\n\n  showPill(el, \"saving\");\n  try {\n    const getRes = await fetch(\n      `${options.cmsBaseUrl}/api/cms/${collection}/${slug}?site=${options.siteId}`,\n      { headers: { Authorization: `Bearer ${token}` } },\n    );\n    if (!getRes.ok) throw new Error(`GET failed: ${getRes.status}`);\n    const doc = (await getRes.json()) as { data?: Record<string, unknown> };\n    const mergedData = { ...doc.data, [field]: value };\n\n    const patchRes = await fetch(\n      `${options.cmsBaseUrl}/api/cms/${collection}/${slug}?site=${options.siteId}`,\n      {\n        method: \"PATCH\",\n        headers: { Authorization: `Bearer ${token}`, \"Content-Type\": \"application/json\" },\n        body: JSON.stringify({ data: mergedData }),\n      },\n    );\n    if (!patchRes.ok) throw new Error(`PATCH failed: ${patchRes.status}`);\n    showPill(el, \"saved\");\n  } catch {\n    showPill(el, \"error\");\n  }\n}\n\nconst pills = new WeakMap<HTMLElement, HTMLElement>();\n\nfunction showPill(el: HTMLElement, state: \"saving\" | \"saved\" | \"error\"): void {\n  let pill = pills.get(el);\n  if (!pill) {\n    pill = document.createElement(\"span\");\n    pill.setAttribute(\"data-cms-inline-edit-pill\", \"\");\n    document.body.appendChild(pill);\n    pills.set(el, pill);\n  }\n  const rect = el.getBoundingClientRect();\n  pill.style.cssText =\n    `position:fixed;top:${rect.top - 26}px;left:${rect.left}px;font:600 11px system-ui,sans-serif;` +\n    `padding:3px 9px;border-radius:5px;z-index:2147483647;pointer-events:none;` +\n    `box-shadow:0 2px 8px rgba(0,0,0,.25);`;\n\n  if (state === \"saving\") {\n    pill.textContent = \"Gemmer…\";\n    pill.style.background = \"#1c2027\";\n    pill.style.color = \"#fff\";\n  } else if (state === \"saved\") {\n    pill.textContent = \"Gemt ✓\";\n    pill.style.background = \"#16a34a\";\n    pill.style.color = \"#fff\";\n    setTimeout(() => {\n      pill?.remove();\n      pills.delete(el);\n    }, 1500);\n  } else {\n    pill.textContent = \"Fejl — prøv igen\";\n    pill.style.background = \"#dc2626\";\n    pill.style.color = \"#fff\";\n  }\n}\n\nfunction showActiveBadge(token: string): void {\n  const claims = decodeJwtPayload(token);\n  const name = (claims?.name as string) || (claims?.email as string) || \"ukendt\";\n  const badge = document.createElement(\"div\");\n  badge.setAttribute(\"data-cms-inline-edit-badge\", \"\");\n  badge.textContent = `✏️ Redigerer som ${name}`;\n  badge.style.cssText =\n    \"position:fixed;bottom:16px;left:16px;background:#1c2027;color:#fff;\" +\n    \"font:600 12px system-ui,sans-serif;padding:8px 14px;border-radius:999px;\" +\n    \"z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);\";\n  document.body.appendChild(badge);\n}\n\n/** Reads JWT claims for DISPLAY ONLY — never used for authorization decisions. */\nfunction decodeJwtPayload(token: string): Record<string, unknown> | null {\n  try {\n    const payload = token.split(\".\")[1];\n    if (!payload) return null;\n    return JSON.parse(atob(payload.replace(/-/g, \"+\").replace(/_/g, \"/\")));\n  } catch {\n    return null;\n  }\n}\n\nfunction injectStyles(): void {\n  const style = document.createElement(\"style\");\n  style.textContent = `\n    [data-cms-field] { outline: 1px dashed transparent; outline-offset: 2px; cursor: text; transition: outline-color .15s; }\n    [data-cms-field]:hover { outline-color: rgba(0,178,255,.5); }\n    [data-cms-field][contenteditable=\"true\"] { outline: 2px solid #00b2ff; outline-offset: 2px; }\n  `;\n  document.head.appendChild(style);\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * Browser entry — zero dependencies. Site-wide: activated once per browser\n * via a \"connect\" link (see docs/features/F157-inline-editing.md), then\n * every page load on the site automatically offers click-to-edit on any\n * element carrying data-cms-collection/data-cms-slug/data-cms-field\n * (F129's attribute convention) — no per-document step.\n */\n\nexport interface InlineEditOptions {\n  /** Base URL of the CMS API, e.g. \"https://webhouse.app\". */\n  cmsBaseUrl: string;\n  /** Site id passed as ?site= on every CMS API call, e.g. \"broberg-ai\". */\n  siteId: string;\n  /** URL query param carrying a freshly-minted token from the connect redirect. Default \"cms_edit\". */\n  tokenParam?: string;\n  /** localStorage key the token is persisted under — survives across sessions/tabs. Default \"wh-inline-edit-token\". */\n  storageKey?: string;\n  /** Label for the \"not connected yet\" prompt. Default \"🔒 Log ind for at redigere\". */\n  connectLabel?: string;\n}\n\ninterface ResolvedOptions extends Required<InlineEditOptions> {}\n\nfunction resolveOptions(options: InlineEditOptions): ResolvedOptions {\n  return {\n    tokenParam: \"cms_edit\",\n    storageKey: \"wh-inline-edit-token\",\n    connectLabel: \"🔒 Log ind for at redigere\",\n    ...options,\n  };\n}\n\nexport async function initInlineEdit(options: InlineEditOptions): Promise<void> {\n  if (typeof window === \"undefined\") return;\n  const resolved = resolveOptions(options);\n\n  captureTokenFromUrl(resolved);\n\n  const enabled = await checkEnabled(resolved);\n  if (!enabled) return;\n\n  const token = getConnectedToken(options);\n  if (token) {\n    activateEditMode(token, resolved);\n  } else {\n    showConnectPrompt(resolved);\n  }\n}\n\n/**\n * A valid (non-expired) token already connected in this browser for this\n * site, or null. Also captures a fresh `?cms_edit=` token from the URL\n * first, so a page can call this directly right after the connect redirect\n * without going through initInlineEdit(). Exposed so a site's own /admin\n * page (or any other tool built on the same connected session) can reuse\n * the same storage/expiry logic instead of re-implementing it.\n */\nexport function getConnectedToken(options: InlineEditOptions): string | null {\n  if (typeof window === \"undefined\") return null;\n  const resolved = resolveOptions(options);\n  captureTokenFromUrl(resolved);\n  const token = localStorage.getItem(resolved.storageKey);\n  if (!token) return null;\n  if (isExpired(token)) {\n    localStorage.removeItem(resolved.storageKey);\n    return null;\n  }\n  return token;\n}\n\n/** The URL that mints a fresh 30-day site-scoped token and redirects back to `returnUrl`. */\nexport function buildConnectUrl(options: InlineEditOptions, returnUrl: string): string {\n  const resolved = resolveOptions(options);\n  return (\n    `${resolved.cmsBaseUrl}/admin/inline-edit/connect?site=${encodeURIComponent(resolved.siteId)}` +\n    `&return=${encodeURIComponent(returnUrl)}`\n  );\n}\n\n/** Clears the connected token in this browser (e.g. a \"log out\" action in a site's own /admin panel). */\nexport function disconnect(options: InlineEditOptions): void {\n  if (typeof window === \"undefined\") return;\n  localStorage.removeItem(resolveOptions(options).storageKey);\n}\n\n/** Captures a token minted by /admin/inline-edit/connect, then strips it from the URL. */\nfunction captureTokenFromUrl(options: ResolvedOptions): void {\n  const url = new URL(window.location.href);\n  const urlToken = url.searchParams.get(options.tokenParam);\n  if (!urlToken) return;\n  localStorage.setItem(options.storageKey, urlToken);\n  url.searchParams.delete(options.tokenParam);\n  window.history.replaceState({}, \"\", url.toString());\n}\n\nasync function checkEnabled(options: ResolvedOptions): Promise<boolean> {\n  try {\n    const res = await fetch(`${options.cmsBaseUrl}/api/inline-edit/status?site=${options.siteId}`);\n    if (!res.ok) return false;\n    const body = (await res.json()) as { enabled?: boolean };\n    return body.enabled === true;\n  } catch {\n    return false;\n  }\n}\n\nfunction isExpired(token: string): boolean {\n  const claims = decodeJwtPayload(token);\n  const exp = typeof claims?.exp === \"number\" ? claims.exp : 0;\n  return exp <= Date.now() / 1000;\n}\n\nfunction showConnectPrompt(options: ResolvedOptions): void {\n  const connectUrl = buildConnectUrl(options, window.location.href);\n\n  const link = document.createElement(\"a\");\n  link.href = connectUrl;\n  link.textContent = options.connectLabel;\n  link.setAttribute(\"data-cms-inline-edit-connect\", \"\");\n  link.style.cssText =\n    \"position:fixed;bottom:16px;left:16px;background:#1c2027;color:#fff;\" +\n    \"font:600 12px system-ui,sans-serif;padding:8px 14px;border-radius:999px;\" +\n    \"text-decoration:none;z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);\";\n  document.body.appendChild(link);\n}\n\nfunction activateEditMode(token: string, options: ResolvedOptions): void {\n  injectStyles();\n  showActiveBadge(token, options);\n\n  const fields = document.querySelectorAll<HTMLElement>(\"[data-cms-field]\");\n  fields.forEach((el) => wireField(el, token, options));\n}\n\nfunction wireField(el: HTMLElement, token: string, options: ResolvedOptions): void {\n  el.addEventListener(\"click\", () => {\n    if (el.getAttribute(\"contenteditable\") === \"true\") return;\n    el.dataset.cmsOriginalValue = el.textContent ?? \"\";\n    el.setAttribute(\"contenteditable\", \"true\");\n    el.focus();\n  });\n\n  el.addEventListener(\"blur\", () => {\n    el.removeAttribute(\"contenteditable\");\n    const original = el.dataset.cmsOriginalValue ?? \"\";\n    const current = el.textContent ?? \"\";\n    if (current.trim() === original.trim()) return;\n    void saveField(el, token, options);\n  });\n\n  el.addEventListener(\"paste\", (e) => {\n    e.preventDefault();\n    const text = e.clipboardData?.getData(\"text/plain\") ?? \"\";\n    document.execCommand(\"insertText\", false, text);\n  });\n\n  el.addEventListener(\"keydown\", (e) => {\n    if (e.key === \"Enter\") {\n      e.preventDefault();\n      el.blur();\n    }\n  });\n}\n\nasync function saveField(el: HTMLElement, token: string, options: ResolvedOptions): Promise<void> {\n  const collection = el.dataset.cmsCollection;\n  const slug = el.dataset.cmsSlug;\n  const field = el.dataset.cmsField;\n  if (!collection || !slug || !field) return;\n  const value = el.textContent?.trim() ?? \"\";\n\n  showPill(el, \"saving\");\n  try {\n    const getRes = await fetch(\n      `${options.cmsBaseUrl}/api/cms/${collection}/${slug}?site=${options.siteId}`,\n      { headers: { Authorization: `Bearer ${token}` } },\n    );\n    if (!getRes.ok) throw new Error(`GET failed: ${getRes.status}`);\n    const doc = (await getRes.json()) as { data?: Record<string, unknown> };\n    const mergedData = { ...doc.data, [field]: value };\n\n    const patchRes = await fetch(\n      `${options.cmsBaseUrl}/api/cms/${collection}/${slug}?site=${options.siteId}`,\n      {\n        method: \"PATCH\",\n        headers: { Authorization: `Bearer ${token}`, \"Content-Type\": \"application/json\" },\n        body: JSON.stringify({ data: mergedData }),\n      },\n    );\n    if (!patchRes.ok) throw new Error(`PATCH failed: ${patchRes.status}`);\n    showPill(el, \"saved\");\n  } catch {\n    showPill(el, \"error\");\n  }\n}\n\nconst pills = new WeakMap<HTMLElement, HTMLElement>();\n\nfunction showPill(el: HTMLElement, state: \"saving\" | \"saved\" | \"error\"): void {\n  let pill = pills.get(el);\n  if (!pill) {\n    pill = document.createElement(\"span\");\n    pill.setAttribute(\"data-cms-inline-edit-pill\", \"\");\n    document.body.appendChild(pill);\n    pills.set(el, pill);\n  }\n  const rect = el.getBoundingClientRect();\n  pill.style.cssText =\n    `position:fixed;top:${rect.top - 26}px;left:${rect.left}px;font:600 11px system-ui,sans-serif;` +\n    `padding:3px 9px;border-radius:5px;z-index:2147483647;pointer-events:none;` +\n    `box-shadow:0 2px 8px rgba(0,0,0,.25);`;\n\n  if (state === \"saving\") {\n    pill.textContent = \"Gemmer…\";\n    pill.style.background = \"#1c2027\";\n    pill.style.color = \"#fff\";\n  } else if (state === \"saved\") {\n    pill.textContent = \"Gemt ✓\";\n    pill.style.background = \"#16a34a\";\n    pill.style.color = \"#fff\";\n    setTimeout(() => {\n      pill?.remove();\n      pills.delete(el);\n    }, 1500);\n  } else {\n    pill.textContent = \"Fejl — prøv igen\";\n    pill.style.background = \"#dc2626\";\n    pill.style.color = \"#fff\";\n  }\n}\n\nfunction showActiveBadge(token: string, options: ResolvedOptions): void {\n  const claims = decodeJwtPayload(token);\n  const name = (claims?.name as string) || (claims?.email as string) || \"ukendt\";\n\n  const badge = document.createElement(\"div\");\n  badge.setAttribute(\"data-cms-inline-edit-badge\", \"\");\n  badge.style.cssText =\n    \"position:fixed;bottom:16px;left:16px;display:flex;align-items:center;gap:8px;\" +\n    \"background:#1c2027;color:#fff;font:600 12px system-ui,sans-serif;padding:8px 14px;\" +\n    \"border-radius:999px;z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);\";\n\n  const label = document.createElement(\"span\");\n  label.textContent = `✏️ Redigerer som ${name}`;\n  badge.appendChild(label);\n\n  const disconnectBtn = document.createElement(\"button\");\n  disconnectBtn.type = \"button\";\n  disconnectBtn.textContent = \"Afbryd\";\n  disconnectBtn.style.cssText =\n    \"background:none;border:none;color:#8ab4ff;font:600 11px system-ui,sans-serif;\" +\n    \"cursor:pointer;padding:0;text-decoration:underline;\";\n  disconnectBtn.addEventListener(\"click\", () => {\n    disconnect(options);\n    window.location.reload();\n  });\n  badge.appendChild(disconnectBtn);\n\n  document.body.appendChild(badge);\n}\n\n/** Reads JWT claims for DISPLAY ONLY — never used for authorization decisions. */\nfunction decodeJwtPayload(token: string): Record<string, unknown> | null {\n  try {\n    const payload = token.split(\".\")[1];\n    if (!payload) return null;\n    return JSON.parse(atob(payload.replace(/-/g, \"+\").replace(/_/g, \"/\")));\n  } catch {\n    return null;\n  }\n}\n\nfunction injectStyles(): void {\n  const style = document.createElement(\"style\");\n  style.textContent = `\n    [data-cms-field] { outline: 1px dashed transparent; outline-offset: 2px; cursor: text; transition: outline-color .15s; }\n    [data-cms-field]:hover { outline-color: rgba(0,178,255,.5); }\n    [data-cms-field][contenteditable=\"true\"] { outline: 2px solid #00b2ff; outline-offset: 2px; }\n  `;\n  document.head.appendChild(style);\n}\n"],"mappings":"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","names":[]}

package/dist/index.d.cts

@@ -1,18 +1,35 @@
 /**
- * Browser entry — zero dependencies. Activates click-to-edit on any element
- * carrying data-cms-collection/data-cms-slug/data-cms-field (F129's attribute
- * convention), when a valid edit-session token is present.
+ * Browser entry — zero dependencies. Site-wide: activated once per browser
+ * via a "connect" link (see docs/features/F157-inline-editing.md), then
+ * every page load on the site automatically offers click-to-edit on any
+ * element carrying data-cms-collection/data-cms-slug/data-cms-field
+ * (F129's attribute convention) — no per-document step.
  */
 interface InlineEditOptions {
     /** Base URL of the CMS API, e.g. "https://webhouse.app". */
     cmsBaseUrl: string;
     /** Site id passed as ?site= on every CMS API call, e.g. "broberg-ai". */
     siteId: string;
-    /** URL query param carrying the short-lived edit-session token. Default "cms_edit". */
+    /** URL query param carrying a freshly-minted token from the connect redirect. Default "cms_edit". */
     tokenParam?: string;
-    /** sessionStorage key the token is persisted under across page loads. Default "wh-inline-edit-token". */
+    /** localStorage key the token is persisted under — survives across sessions/tabs. Default "wh-inline-edit-token". */
     storageKey?: string;
+    /** Label for the "not connected yet" prompt. Default "🔒 Log ind for at redigere". */
+    connectLabel?: string;
 }
-declare function initInlineEdit(options: InlineEditOptions): void;
+declare function initInlineEdit(options: InlineEditOptions): Promise<void>;
+/**
+ * A valid (non-expired) token already connected in this browser for this
+ * site, or null. Also captures a fresh `?cms_edit=` token from the URL
+ * first, so a page can call this directly right after the connect redirect
+ * without going through initInlineEdit(). Exposed so a site's own /admin
+ * page (or any other tool built on the same connected session) can reuse
+ * the same storage/expiry logic instead of re-implementing it.
+ */
+declare function getConnectedToken(options: InlineEditOptions): string | null;
+/** The URL that mints a fresh 30-day site-scoped token and redirects back to `returnUrl`. */
+declare function buildConnectUrl(options: InlineEditOptions, returnUrl: string): string;
+/** Clears the connected token in this browser (e.g. a "log out" action in a site's own /admin panel). */
+declare function disconnect(options: InlineEditOptions): void;
 
-export { type InlineEditOptions, initInlineEdit };
+export { type InlineEditOptions, buildConnectUrl, disconnect, getConnectedToken, initInlineEdit };

package/dist/index.d.ts

@@ -1,18 +1,35 @@
 /**
- * Browser entry — zero dependencies. Activates click-to-edit on any element
- * carrying data-cms-collection/data-cms-slug/data-cms-field (F129's attribute
- * convention), when a valid edit-session token is present.
+ * Browser entry — zero dependencies. Site-wide: activated once per browser
+ * via a "connect" link (see docs/features/F157-inline-editing.md), then
+ * every page load on the site automatically offers click-to-edit on any
+ * element carrying data-cms-collection/data-cms-slug/data-cms-field
+ * (F129's attribute convention) — no per-document step.
  */
 interface InlineEditOptions {
     /** Base URL of the CMS API, e.g. "https://webhouse.app". */
     cmsBaseUrl: string;
     /** Site id passed as ?site= on every CMS API call, e.g. "broberg-ai". */
     siteId: string;
-    /** URL query param carrying the short-lived edit-session token. Default "cms_edit". */
+    /** URL query param carrying a freshly-minted token from the connect redirect. Default "cms_edit". */
     tokenParam?: string;
-    /** sessionStorage key the token is persisted under across page loads. Default "wh-inline-edit-token". */
+    /** localStorage key the token is persisted under — survives across sessions/tabs. Default "wh-inline-edit-token". */
     storageKey?: string;
+    /** Label for the "not connected yet" prompt. Default "🔒 Log ind for at redigere". */
+    connectLabel?: string;
 }
-declare function initInlineEdit(options: InlineEditOptions): void;
+declare function initInlineEdit(options: InlineEditOptions): Promise<void>;
+/**
+ * A valid (non-expired) token already connected in this browser for this
+ * site, or null. Also captures a fresh `?cms_edit=` token from the URL
+ * first, so a page can call this directly right after the connect redirect
+ * without going through initInlineEdit(). Exposed so a site's own /admin
+ * page (or any other tool built on the same connected session) can reuse
+ * the same storage/expiry logic instead of re-implementing it.
+ */
+declare function getConnectedToken(options: InlineEditOptions): string | null;
+/** The URL that mints a fresh 30-day site-scoped token and redirects back to `returnUrl`. */
+declare function buildConnectUrl(options: InlineEditOptions, returnUrl: string): string;
+/** Clears the connected token in this browser (e.g. a "log out" action in a site's own /admin panel). */
+declare function disconnect(options: InlineEditOptions): void;
 
-export { type InlineEditOptions, initInlineEdit };
+export { type InlineEditOptions, buildConnectUrl, disconnect, getConnectedToken, initInlineEdit };

package/dist/index.js

@@ -3,30 +3,78 @@ function resolveOptions(options) {
   return {
     tokenParam: "cms_edit",
     storageKey: "wh-inline-edit-token",
+    connectLabel: "\u{1F512} Log ind for at redigere",
     ...options
   };
 }
-function initInlineEdit(options) {
+async function initInlineEdit(options) {
   if (typeof window === "undefined") return;
   const resolved = resolveOptions(options);
-  const token = bootstrapToken(resolved);
-  if (!token) return;
-  activateEditMode(token, resolved);
+  captureTokenFromUrl(resolved);
+  const enabled = await checkEnabled(resolved);
+  if (!enabled) return;
+  const token = getConnectedToken(options);
+  if (token) {
+    activateEditMode(token, resolved);
+  } else {
+    showConnectPrompt(resolved);
+  }
 }
-function bootstrapToken(options) {
+function getConnectedToken(options) {
+  if (typeof window === "undefined") return null;
+  const resolved = resolveOptions(options);
+  captureTokenFromUrl(resolved);
+  const token = localStorage.getItem(resolved.storageKey);
+  if (!token) return null;
+  if (isExpired(token)) {
+    localStorage.removeItem(resolved.storageKey);
+    return null;
+  }
+  return token;
+}
+function buildConnectUrl(options, returnUrl) {
+  const resolved = resolveOptions(options);
+  return `${resolved.cmsBaseUrl}/admin/inline-edit/connect?site=${encodeURIComponent(resolved.siteId)}&return=${encodeURIComponent(returnUrl)}`;
+}
+function disconnect(options) {
+  if (typeof window === "undefined") return;
+  localStorage.removeItem(resolveOptions(options).storageKey);
+}
+function captureTokenFromUrl(options) {
   const url = new URL(window.location.href);
   const urlToken = url.searchParams.get(options.tokenParam);
-  if (urlToken) {
-    sessionStorage.setItem(options.storageKey, urlToken);
-    url.searchParams.delete(options.tokenParam);
-    window.history.replaceState({}, "", url.toString());
-    return urlToken;
+  if (!urlToken) return;
+  localStorage.setItem(options.storageKey, urlToken);
+  url.searchParams.delete(options.tokenParam);
+  window.history.replaceState({}, "", url.toString());
+}
+async function checkEnabled(options) {
+  try {
+    const res = await fetch(`${options.cmsBaseUrl}/api/inline-edit/status?site=${options.siteId}`);
+    if (!res.ok) return false;
+    const body = await res.json();
+    return body.enabled === true;
+  } catch {
+    return false;
   }
-  return sessionStorage.getItem(options.storageKey);
+}
+function isExpired(token) {
+  const claims = decodeJwtPayload(token);
+  const exp = typeof claims?.exp === "number" ? claims.exp : 0;
+  return exp <= Date.now() / 1e3;
+}
+function showConnectPrompt(options) {
+  const connectUrl = buildConnectUrl(options, window.location.href);
+  const link = document.createElement("a");
+  link.href = connectUrl;
+  link.textContent = options.connectLabel;
+  link.setAttribute("data-cms-inline-edit-connect", "");
+  link.style.cssText = "position:fixed;bottom:16px;left:16px;background:#1c2027;color:#fff;font:600 12px system-ui,sans-serif;padding:8px 14px;border-radius:999px;text-decoration:none;z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);";
+  document.body.appendChild(link);
 }
 function activateEditMode(token, options) {
   injectStyles();
-  showActiveBadge(token);
+  showActiveBadge(token, options);
   const fields = document.querySelectorAll("[data-cms-field]");
   fields.forEach((el) => wireField(el, token, options));
 }
@@ -114,13 +162,24 @@ function showPill(el, state) {
     pill.style.color = "#fff";
   }
 }
-function showActiveBadge(token) {
+function showActiveBadge(token, options) {
   const claims = decodeJwtPayload(token);
   const name = claims?.name || claims?.email || "ukendt";
   const badge = document.createElement("div");
   badge.setAttribute("data-cms-inline-edit-badge", "");
-  badge.textContent = `\u270F\uFE0F Redigerer som ${name}`;
-  badge.style.cssText = "position:fixed;bottom:16px;left:16px;background:#1c2027;color:#fff;font:600 12px system-ui,sans-serif;padding:8px 14px;border-radius:999px;z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);";
+  badge.style.cssText = "position:fixed;bottom:16px;left:16px;display:flex;align-items:center;gap:8px;background:#1c2027;color:#fff;font:600 12px system-ui,sans-serif;padding:8px 14px;border-radius:999px;z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);";
+  const label = document.createElement("span");
+  label.textContent = `\u270F\uFE0F Redigerer som ${name}`;
+  badge.appendChild(label);
+  const disconnectBtn = document.createElement("button");
+  disconnectBtn.type = "button";
+  disconnectBtn.textContent = "Afbryd";
+  disconnectBtn.style.cssText = "background:none;border:none;color:#8ab4ff;font:600 11px system-ui,sans-serif;cursor:pointer;padding:0;text-decoration:underline;";
+  disconnectBtn.addEventListener("click", () => {
+    disconnect(options);
+    window.location.reload();
+  });
+  badge.appendChild(disconnectBtn);
   document.body.appendChild(badge);
 }
 function decodeJwtPayload(token) {
@@ -142,6 +201,9 @@ function injectStyles() {
   document.head.appendChild(style);
 }
 export {
+  buildConnectUrl,
+  disconnect,
+  getConnectedToken,
   initInlineEdit
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * Browser entry — zero dependencies. Activates click-to-edit on any element\n * carrying data-cms-collection/data-cms-slug/data-cms-field (F129's attribute\n * convention), when a valid edit-session token is present.\n */\n\nexport interface InlineEditOptions {\n  /** Base URL of the CMS API, e.g. \"https://webhouse.app\". */\n  cmsBaseUrl: string;\n  /** Site id passed as ?site= on every CMS API call, e.g. \"broberg-ai\". */\n  siteId: string;\n  /** URL query param carrying the short-lived edit-session token. Default \"cms_edit\". */\n  tokenParam?: string;\n  /** sessionStorage key the token is persisted under across page loads. Default \"wh-inline-edit-token\". */\n  storageKey?: string;\n}\n\ninterface ResolvedOptions extends Required<InlineEditOptions> {}\n\nfunction resolveOptions(options: InlineEditOptions): ResolvedOptions {\n  return {\n    tokenParam: \"cms_edit\",\n    storageKey: \"wh-inline-edit-token\",\n    ...options,\n  };\n}\n\nexport function initInlineEdit(options: InlineEditOptions): void {\n  if (typeof window === \"undefined\") return;\n  const resolved = resolveOptions(options);\n  const token = bootstrapToken(resolved);\n  if (!token) return;\n  activateEditMode(token, resolved);\n}\n\nfunction bootstrapToken(options: ResolvedOptions): string | null {\n  const url = new URL(window.location.href);\n  const urlToken = url.searchParams.get(options.tokenParam);\n  if (urlToken) {\n    sessionStorage.setItem(options.storageKey, urlToken);\n    url.searchParams.delete(options.tokenParam);\n    window.history.replaceState({}, \"\", url.toString());\n    return urlToken;\n  }\n  return sessionStorage.getItem(options.storageKey);\n}\n\nfunction activateEditMode(token: string, options: ResolvedOptions): void {\n  injectStyles();\n  showActiveBadge(token);\n\n  const fields = document.querySelectorAll<HTMLElement>(\"[data-cms-field]\");\n  fields.forEach((el) => wireField(el, token, options));\n}\n\nfunction wireField(el: HTMLElement, token: string, options: ResolvedOptions): void {\n  el.addEventListener(\"click\", () => {\n    if (el.getAttribute(\"contenteditable\") === \"true\") return;\n    el.dataset.cmsOriginalValue = el.textContent ?? \"\";\n    el.setAttribute(\"contenteditable\", \"true\");\n    el.focus();\n  });\n\n  el.addEventListener(\"blur\", () => {\n    el.removeAttribute(\"contenteditable\");\n    const original = el.dataset.cmsOriginalValue ?? \"\";\n    const current = el.textContent ?? \"\";\n    if (current.trim() === original.trim()) return;\n    void saveField(el, token, options);\n  });\n\n  el.addEventListener(\"paste\", (e) => {\n    e.preventDefault();\n    const text = e.clipboardData?.getData(\"text/plain\") ?? \"\";\n    document.execCommand(\"insertText\", false, text);\n  });\n\n  el.addEventListener(\"keydown\", (e) => {\n    if (e.key === \"Enter\") {\n      e.preventDefault();\n      el.blur();\n    }\n  });\n}\n\nasync function saveField(el: HTMLElement, token: string, options: ResolvedOptions): Promise<void> {\n  const collection = el.dataset.cmsCollection;\n  const slug = el.dataset.cmsSlug;\n  const field = el.dataset.cmsField;\n  if (!collection || !slug || !field) return;\n  const value = el.textContent?.trim() ?? \"\";\n\n  showPill(el, \"saving\");\n  try {\n    const getRes = await fetch(\n      `${options.cmsBaseUrl}/api/cms/${collection}/${slug}?site=${options.siteId}`,\n      { headers: { Authorization: `Bearer ${token}` } },\n    );\n    if (!getRes.ok) throw new Error(`GET failed: ${getRes.status}`);\n    const doc = (await getRes.json()) as { data?: Record<string, unknown> };\n    const mergedData = { ...doc.data, [field]: value };\n\n    const patchRes = await fetch(\n      `${options.cmsBaseUrl}/api/cms/${collection}/${slug}?site=${options.siteId}`,\n      {\n        method: \"PATCH\",\n        headers: { Authorization: `Bearer ${token}`, \"Content-Type\": \"application/json\" },\n        body: JSON.stringify({ data: mergedData }),\n      },\n    );\n    if (!patchRes.ok) throw new Error(`PATCH failed: ${patchRes.status}`);\n    showPill(el, \"saved\");\n  } catch {\n    showPill(el, \"error\");\n  }\n}\n\nconst pills = new WeakMap<HTMLElement, HTMLElement>();\n\nfunction showPill(el: HTMLElement, state: \"saving\" | \"saved\" | \"error\"): void {\n  let pill = pills.get(el);\n  if (!pill) {\n    pill = document.createElement(\"span\");\n    pill.setAttribute(\"data-cms-inline-edit-pill\", \"\");\n    document.body.appendChild(pill);\n    pills.set(el, pill);\n  }\n  const rect = el.getBoundingClientRect();\n  pill.style.cssText =\n    `position:fixed;top:${rect.top - 26}px;left:${rect.left}px;font:600 11px system-ui,sans-serif;` +\n    `padding:3px 9px;border-radius:5px;z-index:2147483647;pointer-events:none;` +\n    `box-shadow:0 2px 8px rgba(0,0,0,.25);`;\n\n  if (state === \"saving\") {\n    pill.textContent = \"Gemmer…\";\n    pill.style.background = \"#1c2027\";\n    pill.style.color = \"#fff\";\n  } else if (state === \"saved\") {\n    pill.textContent = \"Gemt ✓\";\n    pill.style.background = \"#16a34a\";\n    pill.style.color = \"#fff\";\n    setTimeout(() => {\n      pill?.remove();\n      pills.delete(el);\n    }, 1500);\n  } else {\n    pill.textContent = \"Fejl — prøv igen\";\n    pill.style.background = \"#dc2626\";\n    pill.style.color = \"#fff\";\n  }\n}\n\nfunction showActiveBadge(token: string): void {\n  const claims = decodeJwtPayload(token);\n  const name = (claims?.name as string) || (claims?.email as string) || \"ukendt\";\n  const badge = document.createElement(\"div\");\n  badge.setAttribute(\"data-cms-inline-edit-badge\", \"\");\n  badge.textContent = `✏️ Redigerer som ${name}`;\n  badge.style.cssText =\n    \"position:fixed;bottom:16px;left:16px;background:#1c2027;color:#fff;\" +\n    \"font:600 12px system-ui,sans-serif;padding:8px 14px;border-radius:999px;\" +\n    \"z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);\";\n  document.body.appendChild(badge);\n}\n\n/** Reads JWT claims for DISPLAY ONLY — never used for authorization decisions. */\nfunction decodeJwtPayload(token: string): Record<string, unknown> | null {\n  try {\n    const payload = token.split(\".\")[1];\n    if (!payload) return null;\n    return JSON.parse(atob(payload.replace(/-/g, \"+\").replace(/_/g, \"/\")));\n  } catch {\n    return null;\n  }\n}\n\nfunction injectStyles(): void {\n  const style = document.createElement(\"style\");\n  style.textContent = `\n    [data-cms-field] { outline: 1px dashed transparent; outline-offset: 2px; cursor: text; transition: outline-color .15s; }\n    [data-cms-field]:hover { outline-color: rgba(0,178,255,.5); }\n    [data-cms-field][contenteditable=\"true\"] { outline: 2px solid #00b2ff; outline-offset: 2px; }\n  `;\n  document.head.appendChild(style);\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["/**\n * Browser entry — zero dependencies. Site-wide: activated once per browser\n * via a \"connect\" link (see docs/features/F157-inline-editing.md), then\n * every page load on the site automatically offers click-to-edit on any\n * element carrying data-cms-collection/data-cms-slug/data-cms-field\n * (F129's attribute convention) — no per-document step.\n */\n\nexport interface InlineEditOptions {\n  /** Base URL of the CMS API, e.g. \"https://webhouse.app\". */\n  cmsBaseUrl: string;\n  /** Site id passed as ?site= on every CMS API call, e.g. \"broberg-ai\". */\n  siteId: string;\n  /** URL query param carrying a freshly-minted token from the connect redirect. Default \"cms_edit\". */\n  tokenParam?: string;\n  /** localStorage key the token is persisted under — survives across sessions/tabs. Default \"wh-inline-edit-token\". */\n  storageKey?: string;\n  /** Label for the \"not connected yet\" prompt. Default \"🔒 Log ind for at redigere\". */\n  connectLabel?: string;\n}\n\ninterface ResolvedOptions extends Required<InlineEditOptions> {}\n\nfunction resolveOptions(options: InlineEditOptions): ResolvedOptions {\n  return {\n    tokenParam: \"cms_edit\",\n    storageKey: \"wh-inline-edit-token\",\n    connectLabel: \"🔒 Log ind for at redigere\",\n    ...options,\n  };\n}\n\nexport async function initInlineEdit(options: InlineEditOptions): Promise<void> {\n  if (typeof window === \"undefined\") return;\n  const resolved = resolveOptions(options);\n\n  captureTokenFromUrl(resolved);\n\n  const enabled = await checkEnabled(resolved);\n  if (!enabled) return;\n\n  const token = getConnectedToken(options);\n  if (token) {\n    activateEditMode(token, resolved);\n  } else {\n    showConnectPrompt(resolved);\n  }\n}\n\n/**\n * A valid (non-expired) token already connected in this browser for this\n * site, or null. Also captures a fresh `?cms_edit=` token from the URL\n * first, so a page can call this directly right after the connect redirect\n * without going through initInlineEdit(). Exposed so a site's own /admin\n * page (or any other tool built on the same connected session) can reuse\n * the same storage/expiry logic instead of re-implementing it.\n */\nexport function getConnectedToken(options: InlineEditOptions): string | null {\n  if (typeof window === \"undefined\") return null;\n  const resolved = resolveOptions(options);\n  captureTokenFromUrl(resolved);\n  const token = localStorage.getItem(resolved.storageKey);\n  if (!token) return null;\n  if (isExpired(token)) {\n    localStorage.removeItem(resolved.storageKey);\n    return null;\n  }\n  return token;\n}\n\n/** The URL that mints a fresh 30-day site-scoped token and redirects back to `returnUrl`. */\nexport function buildConnectUrl(options: InlineEditOptions, returnUrl: string): string {\n  const resolved = resolveOptions(options);\n  return (\n    `${resolved.cmsBaseUrl}/admin/inline-edit/connect?site=${encodeURIComponent(resolved.siteId)}` +\n    `&return=${encodeURIComponent(returnUrl)}`\n  );\n}\n\n/** Clears the connected token in this browser (e.g. a \"log out\" action in a site's own /admin panel). */\nexport function disconnect(options: InlineEditOptions): void {\n  if (typeof window === \"undefined\") return;\n  localStorage.removeItem(resolveOptions(options).storageKey);\n}\n\n/** Captures a token minted by /admin/inline-edit/connect, then strips it from the URL. */\nfunction captureTokenFromUrl(options: ResolvedOptions): void {\n  const url = new URL(window.location.href);\n  const urlToken = url.searchParams.get(options.tokenParam);\n  if (!urlToken) return;\n  localStorage.setItem(options.storageKey, urlToken);\n  url.searchParams.delete(options.tokenParam);\n  window.history.replaceState({}, \"\", url.toString());\n}\n\nasync function checkEnabled(options: ResolvedOptions): Promise<boolean> {\n  try {\n    const res = await fetch(`${options.cmsBaseUrl}/api/inline-edit/status?site=${options.siteId}`);\n    if (!res.ok) return false;\n    const body = (await res.json()) as { enabled?: boolean };\n    return body.enabled === true;\n  } catch {\n    return false;\n  }\n}\n\nfunction isExpired(token: string): boolean {\n  const claims = decodeJwtPayload(token);\n  const exp = typeof claims?.exp === \"number\" ? claims.exp : 0;\n  return exp <= Date.now() / 1000;\n}\n\nfunction showConnectPrompt(options: ResolvedOptions): void {\n  const connectUrl = buildConnectUrl(options, window.location.href);\n\n  const link = document.createElement(\"a\");\n  link.href = connectUrl;\n  link.textContent = options.connectLabel;\n  link.setAttribute(\"data-cms-inline-edit-connect\", \"\");\n  link.style.cssText =\n    \"position:fixed;bottom:16px;left:16px;background:#1c2027;color:#fff;\" +\n    \"font:600 12px system-ui,sans-serif;padding:8px 14px;border-radius:999px;\" +\n    \"text-decoration:none;z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);\";\n  document.body.appendChild(link);\n}\n\nfunction activateEditMode(token: string, options: ResolvedOptions): void {\n  injectStyles();\n  showActiveBadge(token, options);\n\n  const fields = document.querySelectorAll<HTMLElement>(\"[data-cms-field]\");\n  fields.forEach((el) => wireField(el, token, options));\n}\n\nfunction wireField(el: HTMLElement, token: string, options: ResolvedOptions): void {\n  el.addEventListener(\"click\", () => {\n    if (el.getAttribute(\"contenteditable\") === \"true\") return;\n    el.dataset.cmsOriginalValue = el.textContent ?? \"\";\n    el.setAttribute(\"contenteditable\", \"true\");\n    el.focus();\n  });\n\n  el.addEventListener(\"blur\", () => {\n    el.removeAttribute(\"contenteditable\");\n    const original = el.dataset.cmsOriginalValue ?? \"\";\n    const current = el.textContent ?? \"\";\n    if (current.trim() === original.trim()) return;\n    void saveField(el, token, options);\n  });\n\n  el.addEventListener(\"paste\", (e) => {\n    e.preventDefault();\n    const text = e.clipboardData?.getData(\"text/plain\") ?? \"\";\n    document.execCommand(\"insertText\", false, text);\n  });\n\n  el.addEventListener(\"keydown\", (e) => {\n    if (e.key === \"Enter\") {\n      e.preventDefault();\n      el.blur();\n    }\n  });\n}\n\nasync function saveField(el: HTMLElement, token: string, options: ResolvedOptions): Promise<void> {\n  const collection = el.dataset.cmsCollection;\n  const slug = el.dataset.cmsSlug;\n  const field = el.dataset.cmsField;\n  if (!collection || !slug || !field) return;\n  const value = el.textContent?.trim() ?? \"\";\n\n  showPill(el, \"saving\");\n  try {\n    const getRes = await fetch(\n      `${options.cmsBaseUrl}/api/cms/${collection}/${slug}?site=${options.siteId}`,\n      { headers: { Authorization: `Bearer ${token}` } },\n    );\n    if (!getRes.ok) throw new Error(`GET failed: ${getRes.status}`);\n    const doc = (await getRes.json()) as { data?: Record<string, unknown> };\n    const mergedData = { ...doc.data, [field]: value };\n\n    const patchRes = await fetch(\n      `${options.cmsBaseUrl}/api/cms/${collection}/${slug}?site=${options.siteId}`,\n      {\n        method: \"PATCH\",\n        headers: { Authorization: `Bearer ${token}`, \"Content-Type\": \"application/json\" },\n        body: JSON.stringify({ data: mergedData }),\n      },\n    );\n    if (!patchRes.ok) throw new Error(`PATCH failed: ${patchRes.status}`);\n    showPill(el, \"saved\");\n  } catch {\n    showPill(el, \"error\");\n  }\n}\n\nconst pills = new WeakMap<HTMLElement, HTMLElement>();\n\nfunction showPill(el: HTMLElement, state: \"saving\" | \"saved\" | \"error\"): void {\n  let pill = pills.get(el);\n  if (!pill) {\n    pill = document.createElement(\"span\");\n    pill.setAttribute(\"data-cms-inline-edit-pill\", \"\");\n    document.body.appendChild(pill);\n    pills.set(el, pill);\n  }\n  const rect = el.getBoundingClientRect();\n  pill.style.cssText =\n    `position:fixed;top:${rect.top - 26}px;left:${rect.left}px;font:600 11px system-ui,sans-serif;` +\n    `padding:3px 9px;border-radius:5px;z-index:2147483647;pointer-events:none;` +\n    `box-shadow:0 2px 8px rgba(0,0,0,.25);`;\n\n  if (state === \"saving\") {\n    pill.textContent = \"Gemmer…\";\n    pill.style.background = \"#1c2027\";\n    pill.style.color = \"#fff\";\n  } else if (state === \"saved\") {\n    pill.textContent = \"Gemt ✓\";\n    pill.style.background = \"#16a34a\";\n    pill.style.color = \"#fff\";\n    setTimeout(() => {\n      pill?.remove();\n      pills.delete(el);\n    }, 1500);\n  } else {\n    pill.textContent = \"Fejl — prøv igen\";\n    pill.style.background = \"#dc2626\";\n    pill.style.color = \"#fff\";\n  }\n}\n\nfunction showActiveBadge(token: string, options: ResolvedOptions): void {\n  const claims = decodeJwtPayload(token);\n  const name = (claims?.name as string) || (claims?.email as string) || \"ukendt\";\n\n  const badge = document.createElement(\"div\");\n  badge.setAttribute(\"data-cms-inline-edit-badge\", \"\");\n  badge.style.cssText =\n    \"position:fixed;bottom:16px;left:16px;display:flex;align-items:center;gap:8px;\" +\n    \"background:#1c2027;color:#fff;font:600 12px system-ui,sans-serif;padding:8px 14px;\" +\n    \"border-radius:999px;z-index:2147483647;box-shadow:0 4px 16px rgba(0,0,0,.3);\";\n\n  const label = document.createElement(\"span\");\n  label.textContent = `✏️ Redigerer som ${name}`;\n  badge.appendChild(label);\n\n  const disconnectBtn = document.createElement(\"button\");\n  disconnectBtn.type = \"button\";\n  disconnectBtn.textContent = \"Afbryd\";\n  disconnectBtn.style.cssText =\n    \"background:none;border:none;color:#8ab4ff;font:600 11px system-ui,sans-serif;\" +\n    \"cursor:pointer;padding:0;text-decoration:underline;\";\n  disconnectBtn.addEventListener(\"click\", () => {\n    disconnect(options);\n    window.location.reload();\n  });\n  badge.appendChild(disconnectBtn);\n\n  document.body.appendChild(badge);\n}\n\n/** Reads JWT claims for DISPLAY ONLY — never used for authorization decisions. */\nfunction decodeJwtPayload(token: string): Record<string, unknown> | null {\n  try {\n    const payload = token.split(\".\")[1];\n    if (!payload) return null;\n    return JSON.parse(atob(payload.replace(/-/g, \"+\").replace(/_/g, \"/\")));\n  } catch {\n    return null;\n  }\n}\n\nfunction injectStyles(): void {\n  const style = document.createElement(\"style\");\n  style.textContent = `\n    [data-cms-field] { outline: 1px dashed transparent; outline-offset: 2px; cursor: text; transition: outline-color .15s; }\n    [data-cms-field]:hover { outline-color: rgba(0,178,255,.5); }\n    [data-cms-field][contenteditable=\"true\"] { outline: 2px solid #00b2ff; outline-offset: 2px; }\n  `;\n  document.head.appendChild(style);\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@broberg/cms-inline-edit",
-  "version": "0.4.1",
+  "version": "0.4.3",
   "description": "Click-to-edit inline editing for live @webhouse/cms-powered sites — copy-owned, framework-agnostic",
   "type": "module",
   "license": "MIT",