@acoustte-digital-services/digitalstore-controls-dev 0.8.1-dev.20260320074145 → 0.8.1-dev.20260323045408

package/dist/index.js

@@ -1,3 +1,5 @@
+"use client";
+
 "use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -2535,7 +2537,7 @@ var DataList = (props) => {
 var DataList_default = DataList;
 
 // src/components/pageRenderingEngine/PageBodyRenderer.tsx
-var import_react51 = __toESM(require("react"));
+var import_react52 = __toESM(require("react"));
 
 // src/components/pageRenderingEngine/nodes/ParagraphNode.tsx
 var import_react37 = __toESM(require("react"));
@@ -2944,8 +2946,61 @@ var QuoteNode = (props) => {
 var QuoteNode_default = QuoteNode;
 
 // src/components/pageRenderingEngine/nodes/CodeNode.tsx
-var import_react42 = __toESM(require("react"));
+var import_react43 = __toESM(require("react"));
+
+// src/components/CopyButton.tsx
+var import_react42 = require("react");
 var import_jsx_runtime52 = require("react/jsx-runtime");
+function CopyButton({ text }) {
+  const [copied, setCopied] = (0, import_react42.useState)(false);
+  const timeoutRef = (0, import_react42.useRef)(null);
+  (0, import_react42.useEffect)(() => {
+    return () => {
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+    };
+  }, []);
+  const handleCopy = async () => {
+    try {
+      await navigator.clipboard.writeText(text);
+      setCopied(true);
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+      timeoutRef.current = setTimeout(() => setCopied(false), 2e3);
+    } catch (err) {
+      console.error("Failed to copy: ", err);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+    "button",
+    {
+      onClick: handleCopy,
+      className: "flex gap-1 items-center hover:text-white transition",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+          "svg",
+          {
+            width: "16",
+            height: "16",
+            viewBox: "0 0 24 24",
+            className: "w-4 h-4",
+            fill: "currentColor",
+            children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+              "path",
+              {
+                fillRule: "evenodd",
+                clipRule: "evenodd",
+                d: "M12 4C10.8954 4 10 4.89543 10 6H14C14 4.89543 13.1046 4 12 4ZM8.53513 4C9.22675 2.8044 10.5194 2 12 2C13.4806 2 14.7733 2.8044 15.4649 4H17C18.6569 4 20 5.34315 20 7V19C20 20.6569 18.6569 22 17 22H7C5.34315 22 4 20.6569 4 19V7C4 5.34315 5.34315 4 7 4H8.53513ZM8 6H7C6.44772 6 6 6.44772 6 7V19C6 19.5523 6.44772 20 7 20H17C17.5523 20 18 19.5523 18 19V7C18 6.44772 17.5523 6 17 6H16C16 7.10457 15.1046 8 14 8H10C8.89543 8 8 7.10457 8 6Z"
+              }
+            )
+          }
+        ),
+        copied ? "Copied!" : "Copy code"
+      ]
+    }
+  );
+}
+
+// src/components/pageRenderingEngine/nodes/CodeNode.tsx
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var CodeNode = (props) => {
   const NodeTypes2 = {
     ["text"]: TextNode_default,
@@ -2958,30 +3013,36 @@ var CodeNode = (props) => {
     if (node.type === "link") return node.text || node.url || "";
     return "";
   }).join("") ?? "";
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "code-block", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("code", { className: "block bg-gray-900 text-gray-100 p-4 rounded-b-md text-sm whitespace-pre-wrap", children: props.node.children && props.node.children.map((node, index) => {
-    const SelectedNode = NodeTypes2[node.type];
-    return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_react42.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(SelectedNode, { node, session: props.session, apiBaseUrl: props.apiBaseUrl, routeParameters: props.routeParameters }) }, index);
-  }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "code-block", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex items-center relative text-gray-200 bg-gray-800 px-4 py-2.5 text-xs font-sans justify-between rounded-t-md", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { children: "Code Snippet" }),
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(CopyButton, { text: textContent })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("code", { className: "block bg-gray-900 text-gray-100 p-4 rounded-b-md text-sm whitespace-pre-wrap", children: props.node.children && props.node.children.map((node, index) => {
+      const SelectedNode = NodeTypes2[node.type];
+      return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react43.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(SelectedNode, { node, session: props.session, apiBaseUrl: props.apiBaseUrl, routeParameters: props.routeParameters }) }, index);
+    }) })
+  ] });
 };
 var CodeNode_default = CodeNode;
 
 // src/components/pageRenderingEngine/nodes/HorizontalRuleNode.tsx
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var HorizontalRuleNode = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("hr", {});
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("hr", {});
 };
 var HorizontalRuleNode_default = HorizontalRuleNode;
 
 // src/components/pageRenderingEngine/nodes/LayoutItemNode.tsx
-var import_react48 = __toESM(require("react"));
+var import_react49 = __toESM(require("react"));
 
 // src/components/pageRenderingEngine/nodes/ImageNode.tsx
-var import_react43 = __toESM(require("react"));
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_react44 = __toESM(require("react"));
+var import_jsx_runtime55 = require("react/jsx-runtime");
 var ImageNode = (props) => {
   const { node, apiBaseUrl = "" } = props;
   let imageUrl = node.imageUrl.startsWith("http") ? node.imageUrl : `${apiBaseUrl}/digitalassets/storefront/${node.imageUrl}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react43.default.Fragment, { children: node.width ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { style: { width: node.width }, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react44.default.Fragment, { children: node.width ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { style: { width: node.width }, children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     "img",
     {
       loading: "lazy",
@@ -2991,7 +3052,7 @@ var ImageNode = (props) => {
       height: node.intrinsicHeight,
       alt: node.title
     }
-  ) }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  ) }) : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     "img",
     {
       loading: "lazy",
@@ -3006,8 +3067,8 @@ var ImageNode = (props) => {
 var ImageNode_default = ImageNode;
 
 // src/components/pageRenderingEngine/nodes/WidgetNode.tsx
-var import_react44 = require("react");
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_react45 = require("react");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 var WidgetNode = (props) => {
   const getWidgetParameters = () => {
     const widgetInputParameters = { ...props.routeParameters ?? {} };
@@ -3062,12 +3123,12 @@ var WidgetNode = (props) => {
   const SelectedWidget = props.widgetRegistry?.[props.node.widgetCode];
   if (!SelectedWidget) {
     console.warn("Widget not found:", props.node.widgetCode);
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
       "Widget not found: ",
       props.node.widgetCode
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react44.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "container mt-2", children: "..." }), children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react45.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "container mt-2", children: "..." }), children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     SelectedWidget,
     {
       params: getWidgetParameters(),
@@ -3082,42 +3143,42 @@ var WidgetNode = (props) => {
 var WidgetNode_default = WidgetNode;
 
 // src/components/pageRenderingEngine/nodes/IframeClient.tsx
-var import_react46 = __toESM(require("react"));
+var import_react47 = __toESM(require("react"));
 
 // src/components/IFrameLoaderView.tsx
-var import_react45 = __toESM(require("react"));
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_react46 = __toESM(require("react"));
+var import_jsx_runtime57 = require("react/jsx-runtime");
 var IFrameLoaderView = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_react45.default.Fragment, { children: [
-    props.isDataFound == null && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "mt-4 bg-gray-200 rounded-md p-4 animate-pulse", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex items-center mb-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 h-8 w-8 rounded-full animate-pulse" }),
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "ml-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 h-3 w-16 animate-pulse" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 h-2 w-12 animate-pulse" })
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_react46.default.Fragment, { children: [
+    props.isDataFound == null && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "mt-4 bg-gray-200 rounded-md p-4 animate-pulse", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "flex items-center mb-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 h-8 w-8 rounded-full animate-pulse" }),
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "ml-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 h-3 w-16 animate-pulse" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 h-2 w-12 animate-pulse" })
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "grid grid-cols-3 gap-4 mt-6", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "animate-pulse", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-12 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-24 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-32 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-16 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-28 mb-2" })
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "grid grid-cols-3 gap-4 mt-6", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "animate-pulse", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-12 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-24 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-32 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-16 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-28 mb-2" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "animate-pulse", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-12 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-24 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-32 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-16 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-28 mb-2" })
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "animate-pulse", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-12 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-24 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-32 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-16 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-28 mb-2" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "animate-pulse", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-12 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-24 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-32 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-16 mb-2" }),
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-28 mb-2" })
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "animate-pulse", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-12 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-24 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-32 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-16 mb-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "bg-gray-300 rounded-full h-3 w-28 mb-2" })
         ] })
       ] })
     ] }) }),
@@ -3127,12 +3188,12 @@ var IFrameLoaderView = (props) => {
 var IFrameLoaderView_default = IFrameLoaderView;
 
 // src/components/pageRenderingEngine/nodes/IframeClient.tsx
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 var IframeClient = ({ src }) => {
-  const iframeRef = (0, import_react46.useRef)(null);
-  const [iframeHeight, setIframeHeight] = (0, import_react46.useState)("100%");
-  const [isDataFound, setIsDataFound] = (0, import_react46.useState)(null);
-  (0, import_react46.useEffect)(() => {
+  const iframeRef = (0, import_react47.useRef)(null);
+  const [iframeHeight, setIframeHeight] = (0, import_react47.useState)("100%");
+  const [isDataFound, setIsDataFound] = (0, import_react47.useState)(null);
+  (0, import_react47.useEffect)(() => {
     const handleReceiveMessage = (event) => {
       const eventName = event?.data?.eventName;
       const payload = event?.data?.payload;
@@ -3147,7 +3208,7 @@ var IframeClient = ({ src }) => {
     window.addEventListener("message", handleReceiveMessage);
     return () => window.removeEventListener("message", handleReceiveMessage);
   }, []);
-  (0, import_react46.useEffect)(() => {
+  (0, import_react47.useEffect)(() => {
     const handleResize = () => {
       if (iframeRef.current) {
         iframeRef.current.contentWindow?.postMessage({ eventName: "RESIZE" }, "*");
@@ -3159,7 +3220,7 @@ var IframeClient = ({ src }) => {
   const handleIframeLoad = () => {
     setIsDataFound(true);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_react46.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(IFrameLoaderView_default, { isDataFound, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react47.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(IFrameLoaderView_default, { isDataFound, children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
     "iframe",
     {
       ref: iframeRef,
@@ -3173,7 +3234,7 @@ var IframeClient = ({ src }) => {
 var IframeClient_default = IframeClient;
 
 // src/components/pageRenderingEngine/nodes/EmbedNode.tsx
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 var EmbedNode = (props) => {
   let src;
   if (props.node.provider == "youtube") {
@@ -3183,13 +3244,13 @@ var EmbedNode = (props) => {
   } else {
     src = props.node.embedSrc;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "aspect-video", children: src && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(IframeClient_default, { src }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "aspect-video", children: src && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(IframeClient_default, { src }) });
 };
 var EmbedNode_default = EmbedNode;
 
 // src/components/pageRenderingEngine/nodes/VideoNode.tsx
-var import_react47 = __toESM(require("react"));
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_react48 = __toESM(require("react"));
+var import_jsx_runtime60 = require("react/jsx-runtime");
 var VideoNode = (props) => {
   let src;
   if (props.node.provider == "youtube") {
@@ -3197,12 +3258,12 @@ var VideoNode = (props) => {
   } else if (props.node.provider == "bunny") {
     src = `https://iframe.mediadelivery.net/embed/${props.node.videoId}?autoplay=false&loop=false&muted=false&preload=true&responsive=true`;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_react47.default.Fragment, { children: src && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("iframe", { className: "w-full aspect-video rounded", src, loading: "lazy", allow: "accelerometer;gyroscope;autoplay;encrypted-media;picture-in-picture;", allowFullScreen: true }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react48.default.Fragment, { children: src && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("iframe", { className: "w-full aspect-video rounded", src, loading: "lazy", allow: "accelerometer;gyroscope;autoplay;encrypted-media;picture-in-picture;", allowFullScreen: true }) });
 };
 var VideoNode_default = VideoNode;
 
 // src/components/pageRenderingEngine/nodes/LayoutItemNode.tsx
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 var LayoutItemNode = (props) => {
   const NodeTypes2 = {
     ["paragraph"]: ParagraphNode_default,
@@ -3263,11 +3324,11 @@ var LayoutItemNode = (props) => {
   } else {
     updatedLayout = removeParagraphsAtStartAndEnd(props.node);
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react48.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { className: "layout-item " + cssClasses, style: { ...styles }, children: updatedLayout.children.map((node, index) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_react49.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "layout-item " + cssClasses, style: { ...styles }, children: updatedLayout.children.map((node, index) => {
     {
     }
     const SelectedNode = NodeTypes2[node.type];
-    return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react48.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_react49.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
       SelectedNode,
       {
         node,
@@ -3297,7 +3358,7 @@ var AssetUtility = class {
 var AssetUtility_default = AssetUtility;
 
 // src/components/pageRenderingEngine/nodes/LayoutContainerNode.tsx
-var import_jsx_runtime61 = require("react/jsx-runtime");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 var LayoutContainerNode = (props) => {
   const VERTICAL_ALIGNMENT_CLASSES = {
     start: "items-start",
@@ -3367,7 +3428,7 @@ var LayoutContainerNode = (props) => {
   if (backgroundLayers.length) {
     styles.background = backgroundLayers.join(", ");
   }
-  const renderChildren = () => props.node.children?.map((node, index) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+  const renderChildren = () => props.node.children?.map((node, index) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
     LayoutItemNode_default,
     {
       node,
@@ -3381,8 +3442,8 @@ var LayoutContainerNode = (props) => {
     },
     index
   ));
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_jsx_runtime61.Fragment, { children: [
-    sectionWidth === "mixed" && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: cssClasses, style: styles, children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "container", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_jsx_runtime62.Fragment, { children: [
+    sectionWidth === "mixed" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: cssClasses, style: styles, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "container", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
       "div",
       {
         className: `grid gap-y-4 lg:gap-y-0 ${gridCssClasses} ${addPadding ? "py-8 lg:py-6" : ""}`,
@@ -3390,7 +3451,7 @@ var LayoutContainerNode = (props) => {
         children: renderChildren()
       }
     ) }) }),
-    sectionWidth === "full" && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+    sectionWidth === "full" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
       "div",
       {
         className: `grid gap-y-4 lg:gap-y-0 ${cssClasses} ${gridCssClasses} ${addPadding ? "p-8 lg:p-0" : ""}`,
@@ -3398,7 +3459,7 @@ var LayoutContainerNode = (props) => {
         children: renderChildren()
       }
     ),
-    sectionWidth === "fixed" && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "container", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+    sectionWidth === "fixed" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "container", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
       "div",
       {
         className: `grid gap-y-4 lg:gap-y-0 ${cssClasses} ${gridCssClasses} ${addPadding ? "px-8 py-6 lg:px-6 lg:py-6" : ""}`,
@@ -3411,12 +3472,12 @@ var LayoutContainerNode = (props) => {
 var LayoutContainerNode_default = LayoutContainerNode;
 
 // src/components/pageRenderingEngine/nodes/FormContainerNode.tsx
-var import_react49 = __toESM(require("react"));
+var import_react50 = __toESM(require("react"));
 
 // src/components/pageRenderingEngine/nodes/InputControlNode.tsx
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 var InputControlNode = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
     InputControl_default,
     {
       name: props.node.name,
@@ -3445,19 +3506,19 @@ var InputControlNode = (props) => {
 var InputControlNode_default = InputControlNode;
 
 // src/components/pageRenderingEngine/nodes/FormContainerNode.tsx
-var import_jsx_runtime63 = require("react/jsx-runtime");
+var import_jsx_runtime64 = require("react/jsx-runtime");
 var FormContainerNode = (props) => {
   const NodeTypes2 = {
     ["input-control"]: InputControlNode_default
   };
   const { node } = props;
-  const formRef = (0, import_react49.useRef)(null);
+  const formRef = (0, import_react50.useRef)(null);
   const initialState = {
     inputValues: {},
     lastPropertyChanged: ""
   };
-  const [formState, dispatch] = (0, import_react49.useReducer)(FormReducer_default, initialState);
-  const handleInputChange = (0, import_react49.useCallback)((updatedValues) => {
+  const [formState, dispatch] = (0, import_react50.useReducer)(FormReducer_default, initialState);
+  const handleInputChange = (0, import_react50.useCallback)((updatedValues) => {
     dispatch({ type: FORM_INPUT_UPDATE, name: updatedValues.name, value: updatedValues.value });
   }, [dispatch]);
   const onValidate = async () => {
@@ -3468,7 +3529,7 @@ var FormContainerNode = (props) => {
       return true;
     }
   };
-  (0, import_react49.useEffect)(() => {
+  (0, import_react50.useEffect)(() => {
     const fetchInitialData = async () => {
       if (!props.fetchData || !node.dataFetchApi) return;
       const response = await props.fetchData(
@@ -3485,12 +3546,12 @@ var FormContainerNode = (props) => {
     };
     fetchInitialData();
   }, [props.fetchData, node.dataFetchApi, props.routeParameters]);
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("form", { className: "group space-y-6 pb-6 overflow-y-auto", noValidate: true, ref: formRef, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("form", { className: "group space-y-6 pb-6 overflow-y-auto", noValidate: true, ref: formRef, children: [
     node.children && node.children.map((node2, index) => {
       {
       }
       const SelectedNode = NodeTypes2[node2.type];
-      return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react49.default.Fragment, { children: SelectedNode && node2.type == "input-control" && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_react50.default.Fragment, { children: SelectedNode && node2.type == "input-control" && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
         InputControlNode_default,
         {
           value: formState.inputValues[node2.name],
@@ -3499,15 +3560,15 @@ var FormContainerNode = (props) => {
         }
       ) }, index);
     }),
-    node.children.length == 0 && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "py-0.5 lg:py-1.5" })
+    node.children.length == 0 && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: "py-0.5 lg:py-1.5" })
   ] });
 };
 var FormContainerNode_default = FormContainerNode;
 
 // src/components/pageRenderingEngine/nodes/DivContainer.tsx
-var import_react50 = __toESM(require("react"));
+var import_react51 = __toESM(require("react"));
 var import_link3 = __toESM(require("next/link"));
-var import_jsx_runtime64 = require("react/jsx-runtime");
+var import_jsx_runtime65 = require("react/jsx-runtime");
 var DivContainer = (props) => {
   const { cssProperties: styles, hoverCssProperties: hoverStyles, mobileCssProperties: mobileStyles } = props.node;
   const updatedStyles = convertKeysToCamelCase(styles);
@@ -3626,9 +3687,9 @@ ${mobileCssRules.join("\n")}
     return css2;
   };
   const css = generateCssString(updatedStyle, hoverStyles, mobileStyles);
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(import_react50.default.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("style", { dangerouslySetInnerHTML: { __html: css } }),
-    props.node.href && props.node.href !== "" ? /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_link3.default, { href: props.node.href, className: "block", children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(import_react51.default.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("style", { dangerouslySetInnerHTML: { __html: css } }),
+    props.node.href && props.node.href !== "" ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_link3.default, { href: props.node.href, className: "block", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
       "div",
       {
         id: guid,
@@ -3636,7 +3697,7 @@ ${mobileCssRules.join("\n")}
         className: containerPaddingClass,
         children: props.node.children?.map((node, index) => {
           const SelectedNode = NodeTypes2[node.type];
-          return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_react50.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react51.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
             SelectedNode,
             {
               node,
@@ -3651,9 +3712,9 @@ ${mobileCssRules.join("\n")}
           ) }, index);
         })
       }
-    ) }) : /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { id: guid, style: { ...backgroundStyle }, className: containerPaddingClass, children: props.node.children && props.node.children.map((node, index) => {
+    ) }) : /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { id: guid, style: { ...backgroundStyle }, className: containerPaddingClass, children: props.node.children && props.node.children.map((node, index) => {
       const SelectedNode = NodeTypes2[node.type];
-      return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(import_react50.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react51.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
         SelectedNode,
         {
           node,
@@ -3672,7 +3733,7 @@ ${mobileCssRules.join("\n")}
 var DivContainer_default = DivContainer;
 
 // src/components/pageRenderingEngine/PageBodyRenderer.tsx
-var import_jsx_runtime65 = require("react/jsx-runtime");
+var import_jsx_runtime66 = require("react/jsx-runtime");
 var NodeTypes = {
   ["paragraph"]: ParagraphNode_default,
   ["heading"]: HeadingNode_default,
@@ -3700,11 +3761,11 @@ var PageBodyRenderer = (props) => {
   if (pageBodyTree && pageBodyTree.root) {
     rootNode = pageBodyTree.root;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react51.default.Fragment, { children: rootNode && rootNode?.children?.map((node, index) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react52.default.Fragment, { children: rootNode && rootNode?.children?.map((node, index) => {
     {
     }
     const SelectedNode = NodeTypes[node.type];
-    return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react51.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react51.default.Fragment, { children: node.type == "layout-container" ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react51.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react52.default.Fragment, { children: SelectedNode && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react52.default.Fragment, { children: node.type == "layout-container" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react52.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
       SelectedNode,
       {
         node,
@@ -3717,7 +3778,7 @@ var PageBodyRenderer = (props) => {
         apiBaseUrl: props.apiBaseUrl,
         widgetRegistry: props.widgetRegistry
       }
-    ) }) : /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react51.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+    ) }) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react52.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
       SelectedNode,
       {
         node,
@@ -3742,4 +3803,3 @@ var PageBodyRenderer_default = PageBodyRenderer;
   ViewControl,
   ViewControlTypes
 });
-//# sourceMappingURL=index.js.map