@duffcloudservices/cms 0.3.10 → 0.3.12

package/dist/editor/editorBridge.d.ts

@@ -43,6 +43,14 @@ interface EditorReadyPayload {
     blogTitle: string | null;
     /** Current blog post summary/description text from [data-blog-summary], if present */
     blogSummary: string | null;
+    /** Whether the page has any managed form roots */
+    hasManagedForms: boolean;
+    /** Form IDs for all detected managed-form roots */
+    managedFormIds: string[];
+    /** Whether the page has any [data-dcs-reviews] elements */
+    hasReviews: boolean;
+    /** Keys of all [data-dcs-reviews] elements found on the page */
+    reviewKeys: string[];
 }
 declare function initEditorBridge(): void;
 

package/dist/editor/editorBridge.js

@@ -11,12 +11,16 @@ function postToParent(type, data) {
   globalThis.self.parent.postMessage({ type, data }, "*");
 }
 var TEXT_KEY_SELECTOR = "[data-text-key], [data-dcs-text]";
+var REVIEW_SELECTOR = "[data-dcs-reviews]";
 function getTextKey(el) {
   return el.dataset.dcsText ?? el.dataset.textKey ?? "";
 }
 function textKeySelector(key) {
   return `[data-text-key="${key}"], [data-dcs-text="${key}"]`;
 }
+function reviewSelector(key) {
+  return `[data-dcs-reviews="${key}"]`;
+}
 var editorActive = false;
 var bridgeInitialized = false;
 var activeEditElement = null;
@@ -27,12 +31,16 @@ var arrayEditIconElement = null;
 var arrayEditIconTarget = null;
 var imageEditIconElements = [];
 var imageEditIconTargets = [];
+var reviewEditIconElement = null;
+var reviewEditIconTarget = null;
 var editingEnabled = true;
 var originalTextValues = /* @__PURE__ */ new Map();
 var sectionResizeObserver = null;
 var rediscoveryTimer = null;
 var initializedTextElements = /* @__PURE__ */ new WeakSet();
 var initializedSections = /* @__PURE__ */ new WeakSet();
+var initializedReviewElements = /* @__PURE__ */ new WeakSet();
+var initializedManagedFormElements = /* @__PURE__ */ new WeakSet();
 var blogContentInitialized = false;
 var blogMetadataInitialized = false;
 function scheduleRediscovery() {
@@ -65,6 +73,12 @@ function discoverTextKeys() {
     (el) => getTextKey(el)
   );
 }
+function discoverReviewKeys() {
+  return Array.from(document.querySelectorAll(REVIEW_SELECTOR)).map((el) => el.dataset.dcsReviews ?? "").filter(Boolean);
+}
+function discoverManagedFormIds() {
+  return Array.from(document.querySelectorAll("[data-form-key]")).map((el) => el.dataset.formKey ?? "").filter(Boolean);
+}
 function observeSectionLayout() {
   if (sectionResizeObserver) {
     sectionResizeObserver.disconnect();
@@ -130,6 +144,9 @@ function checkForNavigation() {
   }
   removeEditIcon();
   removeArrayEditIcon();
+  removeReviewEditIcon();
+  blogContentInitialized = false;
+  blogMetadataInitialized = false;
   setTimeout(() => {
     rediscoverAndNotify();
   }, 500);
@@ -145,6 +162,8 @@ function rediscoverAndNotify() {
   activeEditElement = null;
   const sections = discoverSections();
   const textKeys = discoverTextKeys();
+  const reviewKeys = discoverReviewKeys();
+  const managedFormIds = discoverManagedFormIds();
   const contentHeight = measureContentHeight(sections);
   const blogEl = document.querySelector("[data-blog-content]");
   const hasBlogContent = !!blogEl;
@@ -153,7 +172,19 @@ function rediscoverAndNotify() {
   const blogSummaryEl = document.querySelector("[data-blog-summary]");
   const blogTitle = blogTitleEl ? blogTitleEl.textContent?.trim() ?? null : null;
   const blogSummary = blogSummaryEl ? blogSummaryEl.textContent?.trim() ?? null : null;
-  postToParent("dcs:ready", { sections, textKeys, contentHeight, hasBlogContent, blogContentHtml, blogTitle, blogSummary });
+  postToParent("dcs:ready", {
+    sections,
+    textKeys,
+    contentHeight,
+    hasBlogContent,
+    blogContentHtml,
+    blogTitle,
+    blogSummary,
+    hasManagedForms: managedFormIds.length > 0,
+    managedFormIds,
+    hasReviews: reviewKeys.length > 0,
+    reviewKeys
+  });
   if (editorActive) {
     applyEditorToElements();
     if (sectionResizeObserver) {
@@ -194,6 +225,20 @@ function applyEditorToElements() {
       removeArrayEditIcon();
     });
   });
+  const reviewElements = document.querySelectorAll(REVIEW_SELECTOR);
+  reviewElements.forEach((htmlEl) => {
+    if (initializedReviewElements.has(htmlEl)) return;
+    initializedReviewElements.add(htmlEl);
+    htmlEl.addEventListener("mouseenter", () => {
+      if (activeEditElement) return;
+      showReviewEditIcon(htmlEl);
+    });
+    htmlEl.addEventListener("mouseleave", (e) => {
+      const related = e.relatedTarget;
+      if (related && (related.classList?.contains("dcs-review-edit-icon") || related.closest?.(".dcs-review-edit-icon"))) return;
+      removeReviewEditIcon();
+    });
+  });
   const sections = document.querySelectorAll("[data-section]");
   sections.forEach((el) => {
     if (initializedSections.has(el)) return;
@@ -272,6 +317,23 @@ function applyEditorToElements() {
       summaryEl?.classList.add("dcs-blog-metadata");
     }
   }
+  const managedFormElements = document.querySelectorAll("[data-form-key]");
+  managedFormElements.forEach((formEl) => {
+    formEl.classList.add("dcs-managed-form");
+    if (initializedManagedFormElements.has(formEl)) return;
+    initializedManagedFormElements.add(formEl);
+    const openManagedForm = (e) => {
+      if (!editingEnabled) return;
+      e.preventDefault();
+      e.stopPropagation();
+      e.stopImmediatePropagation();
+      postToParent("dcs:managed-form-click", {
+        formId: formEl.dataset.formKey ?? null
+      });
+    };
+    formEl.addEventListener("click", openManagedForm, true);
+    formEl.addEventListener("dblclick", openManagedForm, true);
+  });
 }
 function handleTextKeyDblClick(e) {
   if (!editingEnabled) return;
@@ -446,6 +508,51 @@ function removeArrayEditIcon() {
   }
   arrayEditIconTarget = null;
 }
+function createReviewEditIcon() {
+  const icon = document.createElement("button");
+  icon.className = "dcs-review-edit-icon";
+  icon.setAttribute("type", "button");
+  icon.setAttribute("title", "Edit Reviews");
+  icon.setAttribute("aria-label", "Edit reviews in panel");
+  icon.textContent = "\u2605";
+  icon.addEventListener("click", (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    e.stopImmediatePropagation();
+    if (!reviewEditIconTarget) return;
+    const el = reviewEditIconTarget;
+    const key = el.dataset.dcsReviews ?? "";
+    if (!key) return;
+    const sectionParent = el.closest("[data-section]");
+    const sectionId = sectionParent?.dataset.section ?? null;
+    postToParent("dcs:reviews-click", { key, sectionId });
+    removeReviewEditIcon();
+  }, true);
+  icon.addEventListener("mouseleave", (e) => {
+    const related = e.relatedTarget;
+    if (related && reviewEditIconTarget && (related === reviewEditIconTarget || reviewEditIconTarget.contains(related))) return;
+    removeReviewEditIcon();
+  });
+  return icon;
+}
+function showReviewEditIcon(el) {
+  if (!editingEnabled) return;
+  if (!reviewEditIconElement) {
+    reviewEditIconElement = createReviewEditIcon();
+    document.body.appendChild(reviewEditIconElement);
+  }
+  reviewEditIconTarget = el;
+  const rect = el.getBoundingClientRect();
+  reviewEditIconElement.style.top = `${rect.top + scrollY - 4}px`;
+  reviewEditIconElement.style.left = `${rect.right + scrollX - 28}px`;
+  reviewEditIconElement.style.display = "flex";
+}
+function removeReviewEditIcon() {
+  if (reviewEditIconElement) {
+    reviewEditIconElement.style.display = "none";
+  }
+  reviewEditIconTarget = null;
+}
 function createImageEditIcon(label) {
   const icon = document.createElement("button");
   icon.className = "dcs-image-edit-icon";
@@ -630,6 +737,35 @@ function injectEditorStyles() {
       display: block;
     }
 
+    /* Floating review edit icon button */
+    .dcs-review-edit-icon {
+      position: absolute;
+      z-index: 99999;
+      display: none;
+      align-items: center;
+      justify-content: center;
+      width: 24px;
+      height: 24px;
+      padding: 0;
+      margin: 0;
+      border: 1.5px solid #f59e0b;
+      border-radius: 4px;
+      background: rgb(245 158 11 / 0.1);
+      backdrop-filter: blur(4px);
+      color: #f59e0b;
+      cursor: pointer;
+      pointer-events: auto;
+      transition: background 0.15s, transform 0.1s;
+      box-shadow: 0 1px 3px rgba(0,0,0,0.12);
+      font-size: 14px;
+      line-height: 1;
+    }
+
+    .dcs-review-edit-icon:hover {
+      background: rgb(245 158 11 / 0.25);
+      transform: scale(1.1);
+    }
+
     /* Floating image edit icon button \u2014 green to distinguish from text (blue) and array (violet) */
     .dcs-image-edit-icon {
       position: absolute;
@@ -708,6 +844,42 @@ function injectEditorStyles() {
       opacity: 1;
     }
 
+    /* Managed form area \u2014 click to open the portal Form Manager */
+    [data-form-key].dcs-managed-form {
+      cursor: pointer;
+      border-radius: 12px;
+      position: relative;
+      transition: outline-color 0.2s, background-color 0.2s;
+    }
+
+    [data-form-key].dcs-managed-form:hover {
+      outline: 2px solid hsl(271 91% 65% / 0.65) !important;
+      outline-offset: 10px;
+      background-color: hsl(271 91% 65% / 0.04);
+    }
+
+    [data-form-key].dcs-managed-form::after {
+      content: 'Click to manage form';
+      position: absolute;
+      top: -28px;
+      left: 8px;
+      font-size: 11px;
+      font-weight: 600;
+      color: hsl(271 91% 65%);
+      background: hsl(271 91% 65% / 0.12);
+      border: 1px solid hsl(271 91% 65% / 0.3);
+      padding: 2px 8px;
+      border-radius: 4px;
+      opacity: 0;
+      transition: opacity 0.2s;
+      pointer-events: none;
+      white-space: nowrap;
+    }
+
+    [data-form-key].dcs-managed-form:hover::after {
+      opacity: 1;
+    }
+
     /* Blog metadata (title / summary) \u2014 click to edit */
     .dcs-blog-metadata {
       cursor: pointer;
@@ -767,6 +939,7 @@ function handleMessage(event) {
           }
           removeEditIcon();
           removeArrayEditIcon();
+          removeReviewEditIcon();
           removeAllImageEditIcons();
           document.querySelectorAll(".dcs-editable").forEach((el) => {
             el.classList.remove("dcs-editable");
@@ -783,6 +956,16 @@ function handleMessage(event) {
         }
       }
       break;
+    case "dcs:update-reviews":
+      if (data && typeof data === "object" && "key" in data && "html" in data) {
+        const d = data;
+        const reviewEl = document.querySelector(reviewSelector(d.key));
+        if (reviewEl) {
+          reviewEl.innerHTML = d.html;
+          scheduleRediscovery();
+        }
+      }
+      break;
   }
 }
 function injectEditorHeightFix() {
@@ -818,7 +1001,8 @@ function initEditorBridge() {
       e.preventDefault();
       const target = e.target;
       const sectionEl = target.closest?.("[data-section]");
-      let imgEl = target.tagName === "IMG" ? target : target.closest?.("picture")?.querySelector("img");
+      const formEl = target.closest?.("[data-form-key]");
+      const imgEl = target.tagName === "IMG" ? target : target.closest?.("picture")?.querySelector("img");
       let allImages = [];
       if (sectionEl) {
         allImages = findAllImagesAtPoint(sectionEl, e.clientX, e.clientY);
@@ -832,6 +1016,7 @@ function initEditorBridge() {
         y: e.clientY,
         sectionId: sectionEl?.dataset.section ?? null,
         sectionLabel: sectionEl?.dataset.sectionLabel ?? null,
+        formId: formEl?.dataset.formKey ?? null,
         // Single image context (backward compatible) — topmost image at click point
         imageUrl: topImage?.currentSrc ?? topImage?.src ?? null,
         imageAlt: topImage?.alt ?? null,
@@ -858,6 +1043,8 @@ function initEditorBridge() {
   }
   const sections = discoverSections();
   const textKeys = discoverTextKeys();
+  const reviewKeys = discoverReviewKeys();
+  const managedFormIds = discoverManagedFormIds();
   const contentHeight = measureContentHeight(sections);
   const blogEl = document.querySelector("[data-blog-content]");
   const blogTitleEl = document.querySelector("[data-blog-title]");
@@ -869,7 +1056,11 @@ function initEditorBridge() {
     hasBlogContent: !!blogEl,
     blogContentHtml: blogEl ? blogEl.innerHTML : null,
     blogTitle: blogTitleEl ? blogTitleEl.textContent?.trim() ?? null : null,
-    blogSummary: blogSummaryEl ? blogSummaryEl.textContent?.trim() ?? null : null
+    blogSummary: blogSummaryEl ? blogSummaryEl.textContent?.trim() ?? null : null,
+    hasManagedForms: managedFormIds.length > 0,
+    managedFormIds,
+    hasReviews: reviewKeys.length > 0,
+    reviewKeys
   });
   observeSectionLayout();
 }