@amplifyup/sdk 0.1.37 → 0.1.38

package/dist/react.js

@@ -1995,6 +1995,12 @@ Available Console Commands:
           );
           return;
         }
+        if (event.data?.type === "AMPLIFYUP_PROPS_PATCH") {
+          window.dispatchEvent(
+            new CustomEvent("amplifyup:props-patch", { detail: event.data })
+          );
+          return;
+        }
         if (event.data?.type === "COMPONENT_DELETABLE_STATUS") {
           const { componentId, deletable, nodeId } = event.data;
           const element = document.querySelector(`[data-component-id="${componentId}"]`);
@@ -3011,25 +3017,46 @@ function useLiveComposerProps(layoutNodeId, props) {
     setLive(props);
   }, [props]);
   react.useEffect(() => {
-    const apply = (fieldName, value, nodeId) => {
-      if (!fieldName || typeof fieldName !== "string") return;
+    const matchesNode = (nodeId) => {
       if (nodeId && layoutNodeId && String(nodeId) !== String(layoutNodeId)) {
-        return;
+        return false;
       }
+      return true;
+    };
+    const applyField = (fieldName, value, nodeId) => {
+      if (!fieldName || typeof fieldName !== "string") return;
+      if (!matchesNode(nodeId)) return;
       setLive((prev) => ({ ...prev, [fieldName]: value }));
     };
+    const applyProps = (nextProps, nodeId) => {
+      if (!nextProps || typeof nextProps !== "object" || Array.isArray(nextProps)) {
+        return;
+      }
+      if (!matchesNode(nodeId)) return;
+      setLive(nextProps);
+    };
     const onPatch = (event) => {
       const detail = event.detail || {};
-      apply(detail.fieldName, detail.value, detail.layoutNodeId);
+      applyField(detail.fieldName, detail.value, detail.layoutNodeId);
+    };
+    const onPropsPatch = (event) => {
+      const detail = event.detail || {};
+      applyProps(detail.props, detail.layoutNodeId);
     };
     const onMessage = (event) => {
+      if (event.data?.type === "AMPLIFYUP_PROPS_PATCH") {
+        applyProps(event.data.props, event.data.layoutNodeId);
+        return;
+      }
       if (event.data?.type !== "AMPLIFYUP_FIELD_PATCH") return;
-      apply(event.data.fieldName, event.data.value, event.data.layoutNodeId);
+      applyField(event.data.fieldName, event.data.value, event.data.layoutNodeId);
     };
     window.addEventListener("amplifyup:field-patch", onPatch);
+    window.addEventListener("amplifyup:props-patch", onPropsPatch);
     window.addEventListener("message", onMessage);
     return () => {
       window.removeEventListener("amplifyup:field-patch", onPatch);
+      window.removeEventListener("amplifyup:props-patch", onPropsPatch);
       window.removeEventListener("message", onMessage);
     };
   }, [layoutNodeId]);