@makeswift/runtime 0.6.5 → 0.6.6

package/dist/index.es.js

@@ -40,7 +40,7 @@ import { useEffect, createContext, useContext, useState, useMemo, useRef, Childr
 import { useSyncExternalStoreWithSelector } from "use-sync-external-store/shim/with-selector";
 import dynamic from "next/dynamic";
 import { g as getPropControllerDescriptors, i as isElementReference, a as getElementSwatchIds, b as getFileIds, d as getTypographyIds, e as getTableIds, f as getPageIds, h as getElementChildren, j as createDocumentReference, M as MakeswiftComponentType, k as getBorderSwatchIds, l as isNonNullable, m as getBoxShadowsSwatchIds, n as getResponsiveColorSwatchIds, o as isPropControllersHandle, p as getComponentPropControllerDescriptors, q as getPropControllers, r as configureStore$1, s as getDocument, t as getElementId, u as getIsPreview, v as getIsInBuilder, w as copyElementTree, x as getReactComponent, y as getBuilderEditMode } from "./constants.es.js";
-import { A as ActionTypes, g as introspectedResourcesFulfilled, h as apiResourceFulfilled, t as typographiesFulfilled, j as registerComponentHandleEffect, k as mountComponentEffect, l as registerComponentEffect, n as registerReactComponentEffect } from "./actions.es.js";
+import { A as ActionTypes, h as introspectedResourcesFulfilled, j as apiResourceFulfilled, t as typographiesFulfilled, k as registerComponentHandleEffect, l as mountComponentEffect, n as registerComponentEffect, o as registerReactComponentEffect } from "./actions.es.js";
 import { cache, cx } from "@emotion/css";
 import { serializeStyles } from "@emotion/serialize";
 import { registerStyles, insertStyles } from "@emotion/utils";
@@ -119,6 +119,7 @@ async function introspect(element, client, store) {
   const tableIds = /* @__PURE__ */ new Set();
   const pageIds = /* @__PURE__ */ new Set();
   const remaining = [element];
+  const seen = /* @__PURE__ */ new Set();
   let current;
   while (current = remaining.pop()) {
     let getResourcesFromElementDescriptors = function(elementDescriptors2, props) {
@@ -130,7 +131,12 @@ async function introspect(element, client, store) {
         getTypographyIds(descriptor, props[propName]).forEach((typographyId) => typographyIds.add(typographyId));
         getTableIds(descriptor, props[propName]).forEach((tableId) => tableIds.add(tableId));
         getPageIds(descriptor, props[propName]).forEach((pageId) => pageIds.add(pageId));
-        getElementChildren(descriptor, props[propName]).forEach((child) => remaining.push(child));
+        getElementChildren(descriptor, props[propName]).forEach((child) => {
+          if (!seen.has(child.key)) {
+            seen.add(child.key);
+            remaining.push(child);
+          }
+        });
         if (descriptor.type === ShapeControlType) {
           const prop = props[propName];
           if (prop == null)
@@ -1081,7 +1087,7 @@ function useCachedSite(siteId) {
   const site = useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot);
   return site;
 }
-const version = "0.6.5";
+const version = "0.6.6";
 class Makeswift {
   constructor(apiKey, { apiOrigin = "https://api.makeswift.com" } = {}) {
     __publicField(this, "apiKey");
@@ -1500,7 +1506,8 @@ Read more about dynamic catch-all routes here: https://nextjs.org/docs/routing/d
         return res.json({
           version,
           previewMode: true,
-          interactionMode: true
+          interactionMode: true,
+          clientSideNavigation: true
         });
       }
       case "revalidate": {
@@ -4024,6 +4031,7 @@ const DocumentContext = createContext(null);
 function useDocumentKey() {
   return useContext(DocumentContext);
 }
+const DocumentCyclesContext = createContext([]);
 function useStore() {
   return useContext(StoreContext);
 }
@@ -4095,20 +4103,32 @@ const ElementReference = memo(forwardRef(function ElementReference2({
   const globalElement = useGlobalElement(elementReference.value);
   const globalElementData = globalElement == null ? void 0 : globalElement.data;
   const elementReferenceDocument = useDocument(elementReference.key);
+  const documentKey = elementReference.key;
+  const documentKeys = useContext(DocumentCyclesContext);
+  const providedDocumentKeys = useMemo(() => [...documentKeys, documentKey], [documentKeys, documentKey]);
   if (globalElementData == null) {
     return /* @__PURE__ */ jsx(FallbackComponent, {
       ref,
       text: "This global component doesn't exist"
     });
   }
-  return elementReferenceDocument != null ? /* @__PURE__ */ jsx(Document, {
-    document: elementReferenceDocument,
-    ref
-  }) : /* @__PURE__ */ jsx(DisableRegisterElement.Provider, {
-    value: true,
-    children: /* @__PURE__ */ jsx(ElementData, {
-      elementData: globalElementData,
+  if (documentKeys.includes(documentKey)) {
+    return /* @__PURE__ */ jsx(FallbackComponent, {
+      ref,
+      text: "This global component contains itself!"
+    });
+  }
+  return /* @__PURE__ */ jsx(DocumentCyclesContext.Provider, {
+    value: providedDocumentKeys,
+    children: elementReferenceDocument != null ? /* @__PURE__ */ jsx(Document, {
+      document: elementReferenceDocument,
       ref
+    }) : /* @__PURE__ */ jsx(DisableRegisterElement.Provider, {
+      value: true,
+      children: /* @__PURE__ */ jsx(ElementData, {
+        elementData: globalElementData,
+        ref
+      })
     })
   });
 }));