@caretcms/core 0.1.0 → 0.1.1

package/static/cms/editor/toolbar.js

@@ -1,3 +1,18 @@
+import { toggleHighlight } from './highlight.js';
+import { buildCmsUrl } from './config.js';
+
+const PREVIEW_COOKIE = 'caret_preview';
+
+function previewActive() {
+  return document.cookie.split('; ').some((c) => c === `${PREVIEW_COOKIE}=1`);
+}
+
+function setPreviewCookie(on) {
+  document.cookie = on
+    ? `${PREVIEW_COOKIE}=1; path=/; SameSite=Lax`
+    : `${PREVIEW_COOKIE}=; path=/; Max-Age=0; SameSite=Lax`;
+}
+
 function getToolbarNavLinks(pagePath) {
   const links = [];
   const headerNav = document.querySelector('#main-header nav');
@@ -39,6 +54,19 @@ function renderToolbar(navLinks) {
       </div>
       ${navLinksHtml ? `<div class="cms-toolbar-nav">${navLinksHtml}</div>` : ''}
       <div class="cms-toolbar-right">
+        <button class="cms-preview-btn" type="button" title="Toggle draft preview — edit without publishing to the live site">
+          <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
+          Preview
+        </button>
+        <button class="cms-publish-btn" type="button" title="Publish your draft changes to the live site" hidden>
+          <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 19V5"/><polyline points="5 12 12 5 19 12"/></svg>
+          Publish
+        </button>
+        <button class="cms-discard-btn" type="button" title="Discard your draft changes" hidden>
+          <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>
+          Discard
+        </button>
+        <div class="cms-toolbar-divider"></div>
         <button type="button" class="cms-studio-btn" title="Toggle Content Studio panel">
           <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><line x1="9" y1="3" x2="9" y2="21"/><line x1="9" y1="9" x2="21" y2="9"/></svg>
           Studio
@@ -81,29 +109,83 @@ export function mountToolbar({ showToast, clearDirty, onLogout }) {
     }
   }
 
-  let highlightActive = false;
   const highlightBtn = toolbar.querySelector('.cms-highlight-btn');
+  highlightBtn?.addEventListener('click', () =>
+    toggleHighlight(highlightBtn, showToast),
+  );
+
+  toolbar.querySelector('.cms-exit-btn')?.addEventListener('click', async () => {
+    clearDirty();
+    await onLogout();
+  });
 
-  highlightBtn?.addEventListener('click', () => {
-    highlightActive = !highlightActive;
-    document.body.classList.toggle('cms-highlight-all', highlightActive);
-    highlightBtn.classList.toggle('cms-highlight-btn-active', highlightActive);
+  // --- Draft preview + publish/discard ---
+  const previewBtn = toolbar.querySelector('.cms-preview-btn');
+  const publishBtn = toolbar.querySelector('.cms-publish-btn');
+  const discardBtn = toolbar.querySelector('.cms-discard-btn');
+  const badgeText = toolbar.querySelector('.cms-toolbar-badge-text');
 
-    const textNode = Array.from(highlightBtn.childNodes).find(
-      (n) => n.nodeType === 3 && n.textContent?.trim(),
+  function reflectPreview() {
+    const on = previewActive();
+    previewBtn?.classList.toggle('cms-preview-btn-active', on);
+    if (publishBtn) publishBtn.hidden = !on;
+    if (discardBtn) discardBtn.hidden = !on;
+    if (badgeText) badgeText.textContent = on ? 'Draft' : 'Editor';
+    const label = previewBtn
+      && Array.from(previewBtn.childNodes).find((n) => n.nodeType === 3 && n.textContent?.trim());
+    if (label) label.textContent = on ? ' Previewing' : ' Preview';
+  }
+  reflectPreview();
+
+  previewBtn?.addEventListener('click', () => {
+    const turningOn = !previewActive();
+    setPreviewCookie(turningOn);
+    showToast(
+      turningOn ? 'Draft preview on — your edits stay unpublished' : 'Draft preview off',
+      'success',
     );
+    // Reload so the server installs (or drops) the per-editor draft overlay.
+    window.location.reload();
+  });
 
-    if (highlightActive) {
-      if (textNode) textNode.textContent = ' Hide All';
-      showToast('Showing all editable regions', 'success');
-    } else {
-      if (textNode) textNode.textContent = ' Show All';
+  async function draftRequest(method, path) {
+    return fetch(buildCmsUrl(path), {
+      method,
+      headers: { 'Content-Type': 'application/json', 'x-caret-request': '1' },
+      credentials: 'same-origin',
+      body: method === 'POST' ? '{}' : undefined,
+    });
+  }
+
+  publishBtn?.addEventListener('click', async () => {
+    if (!window.confirm('Publish all your draft changes to the live site?')) return;
+    setStatus('saving', 'Publishing…');
+    try {
+      const res = await draftRequest('POST', '/publish');
+      if (!res.ok) throw new Error('publish failed');
+      const data = await res.json();
+      const n = Array.isArray(data.published) ? data.published.length : 0;
+      // Drafts are flushed; leave preview so the editor sees the published site.
+      setPreviewCookie(false);
+      showToast(`Published ${n} change(s)`, 'success');
+      window.location.reload();
+    } catch {
+      setStatus('error', 'Publish failed');
+      showToast('Publish failed', 'error');
     }
   });
 
-  toolbar.querySelector('.cms-exit-btn')?.addEventListener('click', async () => {
-    clearDirty();
-    await onLogout();
+  discardBtn?.addEventListener('click', async () => {
+    if (!window.confirm('Discard all your draft changes? This cannot be undone.')) return;
+    try {
+      const res = await draftRequest('DELETE', '/draft');
+      if (!res.ok) throw new Error('discard failed');
+      setPreviewCookie(false);
+      showToast('Draft discarded', 'success');
+      window.location.reload();
+    } catch {
+      showToast('Discard failed', 'error');
+    }
   });
 
   const studioButton = toolbar.querySelector('.cms-studio-btn');

package/static/cms/editor.js

@@ -25,6 +25,8 @@ import { mountSectionControls } from './editor/section-controls.js';
 import { mountContentMap } from './editor/content-map.js';
 import { mountRichToolbar } from './editor/rich-toolbar.js';
 import { mountLinkFollowAffordances } from './editor/link-follow.js';
+import { revealAndFade } from './editor/highlight.js';
+import { hydrateStega } from './editor/stega-hydrate.js';
 
 function redirectToEditorLogin() {
   window.location.href = getEditorLoginUrl(window.location.href);
@@ -36,6 +38,10 @@ function boot() {
     linkPopupEl: null,
   };
 
+  // Promote stega-tagged (loader-fed) content into data-caret bindings before
+  // any scanner runs, so prop/component/loop content is click-to-edit too.
+  hydrateStega();
+
   mountEditorGuards(state);
   mountLinkFollowAffordances();
 
@@ -107,6 +113,15 @@ function boot() {
   });
 
   mountInlineEditors();
+
+  // First load after login: flash every editable region once, then fade out.
+  // The flag is set by the login form just before it redirects here.
+  try {
+    if (sessionStorage.getItem('caret:welcome')) {
+      sessionStorage.removeItem('caret:welcome');
+      revealAndFade(2500);
+    }
+  } catch (e) {}
 }
 
 if (document.readyState === 'loading') {

package/static/cms/signin-hint.css

@@ -0,0 +1,74 @@
+/*
+ * The authenticated empty-state hint: shown by the middleware on a live page
+ * when an editor is signed in but the page has zero `data-caret` bindings — the
+ * silent dead-end this replaces (you land on a normal page with no sign the
+ * editor noticed you). Self-contained and isolated (`all: initial` on the host)
+ * so it can't be restyled by — or restyle — the host page, and so it needs no
+ * inline styles (CSP `style-src 'self'` covers this same-origin file).
+ */
+.caret-signin-hint {
+  all: initial;
+  position: fixed;
+  bottom: 16px;
+  left: 16px;
+  z-index: 2147483000;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  max-width: min(92vw, 400px);
+  padding: 10px 14px;
+  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+  font-size: 13px;
+  line-height: 1.45;
+  color: #e5e7eb;
+  background: #111827;
+  border: 1px solid #374151;
+  border-radius: 10px;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
+}
+
+.caret-signin-hint__dot {
+  flex: 0 0 auto;
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: #34d399;
+  box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.18);
+}
+
+.caret-signin-hint__text {
+  color: inherit;
+  font: inherit;
+}
+
+.caret-signin-hint code {
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 0.92em;
+  color: #f9fafb;
+  background: #1f2937;
+  padding: 1px 5px;
+  border-radius: 5px;
+}
+
+.caret-signin-hint a {
+  color: #93c5fd;
+  font: inherit;
+  text-decoration: underline;
+  white-space: nowrap;
+}
+
+@media (prefers-color-scheme: light) {
+  .caret-signin-hint {
+    color: #1f2937;
+    background: #ffffff;
+    border-color: #e5e7eb;
+  }
+  .caret-signin-hint code {
+    color: #111827;
+    background: #f3f4f6;
+  }
+  .caret-signin-hint a {
+    color: #2563eb;
+  }
+}

package/dist/runtime/schema/template.d.ts

@@ -1,15 +0,0 @@
-/**
- * Build a default entry template from a JSON Schema.
- *
- * Used to seed initial data for new entries in dynamically-created
- * collections. Pure JSON-Schema → value mapping; no validation library
- * (schemas reach core as JSON Schema, e.g. via the caller's own
- * `z.toJSONSchema()`), so core stays Zod-agnostic.
- */
-import type { CollectionSchema } from "../../types.js";
-/**
- * Generate a default template from a JSON Schema.
- * Used to create initial data for new entries in dynamic collections.
- */
-export declare function generateTemplateFromSchema(jsonSchema: CollectionSchema): Record<string, unknown>;
-//# sourceMappingURL=template.d.ts.map

package/dist/runtime/schema/template.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"template.d.ts","sourceRoot":"","sources":["../../../src/runtime/schema/template.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAOvD;;;GAGG;AACH,wBAAgB,0BAA0B,CAAC,UAAU,EAAE,gBAAgB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAsBhG"}

package/dist/runtime/schema/template.js

@@ -1,38 +0,0 @@
-/**
- * Build a default entry template from a JSON Schema.
- *
- * Used to seed initial data for new entries in dynamically-created
- * collections. Pure JSON-Schema → value mapping; no validation library
- * (schemas reach core as JSON Schema, e.g. via the caller's own
- * `z.toJSONSchema()`), so core stays Zod-agnostic.
- */
-/**
- * Generate a default template from a JSON Schema.
- * Used to create initial data for new entries in dynamic collections.
- */
-export function generateTemplateFromSchema(jsonSchema) {
-    const template = {};
-    for (const [key, prop] of Object.entries(jsonSchema.properties)) {
-        const p = prop;
-        if (p.default !== undefined) {
-            template[key] = p.default;
-        }
-        else if (p.type === "string") {
-            template[key] = "";
-        }
-        else if (p.type === "number" || p.type === "integer") {
-            template[key] = 0;
-        }
-        else if (p.type === "boolean") {
-            template[key] = false;
-        }
-        else if (p.type === "array") {
-            template[key] = [];
-        }
-        else if (p.type === "object") {
-            template[key] = {};
-        }
-    }
-    return template;
-}
-//# sourceMappingURL=template.js.map

package/dist/runtime/schema/template.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/runtime/schema/template.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AASH;;;GAGG;AACH,MAAM,UAAU,0BAA0B,CAAC,UAA4B;IACrE,MAAM,QAAQ,GAA4B,EAAE,CAAC;IAE7C,KAAK,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC,UAAU,CAAC,EAAE,CAAC;QAChE,MAAM,CAAC,GAAG,IAA0B,CAAC;QAErC,IAAI,CAAC,CAAC,OAAO,KAAK,SAAS,EAAE,CAAC;YAC5B,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC;QAC5B,CAAC;aAAM,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;YAC/B,QAAQ,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC;QACrB,CAAC;aAAM,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;YACvD,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;QACpB,CAAC;aAAM,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;YAChC,QAAQ,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;QACxB,CAAC;aAAM,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YAC9B,QAAQ,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC;QACrB,CAAC;aAAM,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;YAC/B,QAAQ,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC;QACrB,CAAC;IACH,CAAC;IAED,OAAO,QAAQ,CAAC;AAClB,CAAC"}