@builder.io/sdk-solid 1.0.20 → 1.0.22

package/lib/edge/dev.jsx

@@ -160,7 +160,8 @@ function isIframe() {
 
 // src/functions/is-editing.ts
 function isEditing(search) {
-  return isIframe() && (TARGET === "reactNative" || getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
+  return isIframe() && (TARGET === "reactNative" || // accessing window.location.search is safe here because `isIframe()` is only `true` if we're in a browser.
+  getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
 }
 
 // src/functions/track/helpers.ts
@@ -3678,9 +3679,6 @@ function bindAnimations(animations) {
       case "pageLoad":
         triggerAnimation(animation);
         break;
-      case "hover":
-        bindHoverAnimation(animation);
-        break;
       case "scrollInView":
         bindScrollInViewAnimation(animation);
         break;
@@ -3739,33 +3737,6 @@ function triggerAnimation(animation) {
     });
   });
 }
-function bindHoverAnimation(animation) {
-  const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
-  if (!elements.length) {
-    warnElementNotPresent(animation.elementId || animation.id || "");
-    return;
-  }
-  Array.from(elements).forEach((element) => {
-    augmentAnimation(animation, element);
-    const defaultState = animation.steps[0].styles;
-    const hoverState = animation.steps[1].styles;
-    function attachDefaultState() {
-      assign(element.style, defaultState);
-    }
-    function attachHoverState() {
-      assign(element.style, hoverState);
-    }
-    attachDefaultState();
-    element.addEventListener("mouseenter", attachHoverState);
-    element.addEventListener("mouseleave", attachDefaultState);
-    setTimeout(() => {
-      element.style.transition = `all ${animation.duration}s ${camelCaseToKebabCase(animation.easing)}`;
-      if (animation.delay) {
-        element.style.transitionDelay = animation.delay + "s";
-      }
-    });
-  });
-}
 function bindScrollInViewAnimation(animation) {
   const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
   if (!elements.length) {
@@ -4076,7 +4047,27 @@ function BlockStyles(props) {
         sizesWithUpdatedBreakpoints
       )
     }) : "";
-    return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
+    const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
+    let hoverStylesClass = "";
+    if (hoverAnimation) {
+      const hoverStyles = hoverAnimation.steps?.[1]?.styles || {};
+      hoverStylesClass = createCssClass({
+        className: `${className}:hover`,
+        styles: {
+          ...hoverStyles,
+          transition: `all ${hoverAnimation.duration}s ${camelCaseToKebabCase(
+            hoverAnimation.easing
+          )}`,
+          transitionDelay: hoverAnimation.delay ? `${hoverAnimation.delay}s` : "0s"
+        }
+      }) || "";
+    }
+    return [
+      largeStylesClass,
+      mediumStylesClass,
+      smallStylesClass,
+      hoverStylesClass
+    ].join(" ");
   });
   return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default id="builderio-block" styles={css5()} /></Show2>;
 }
@@ -4355,7 +4346,7 @@ function Block(props) {
     const animations = processedBlock().animations;
     if (animations && blockId) {
       bindAnimations(
-        animations.filter((item) => item.trigger !== "hover").map((animation) => ({
+        animations.map((animation) => ({
           ...animation,
           elementId: blockId
         }))
@@ -6930,14 +6921,12 @@ async function fetchEntries(options) {
 }
 
 // src/functions/is-previewing.ts
-function isPreviewing(search) {
-  if (!isBrowser()) {
-    return false;
-  }
-  const normalizedSearch = getSearchString(search || window.location.search);
-  if (isEditing(normalizedSearch)) {
+function isPreviewing(_search) {
+  const search = _search || (isBrowser() ? window.location.search : void 0);
+  if (!search) {
     return false;
   }
+  const normalizedSearch = getSearchString(search);
   return Boolean(normalizedSearch.indexOf("builder.preview=") !== -1);
 }
 
@@ -7188,7 +7177,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.20";
+var SDK_VERSION = "1.0.22";
 
 // src/functions/register.ts
 var registry = {};
@@ -7580,7 +7569,7 @@ function EnableEditor(props) {
           variationId: variationId !== contentId ? variationId : void 0
         });
       }
-      if (isPreviewing()) {
+      if (isPreviewing() && !isEditing()) {
         const searchParams = new URL(location.href).searchParams;
         const searchParamPreviewModel = searchParams.get("builder.preview");
         const searchParamPreviewId = searchParams.get(

package/lib/edge/index.js

@@ -170,7 +170,8 @@ function isIframe() {
 
 // src/functions/is-editing.ts
 function isEditing(search) {
-  return isIframe() && (TARGET === "reactNative" || getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
+  return isIframe() && (TARGET === "reactNative" || // accessing window.location.search is safe here because `isIframe()` is only `true` if we're in a browser.
+  getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
 }
 
 // src/functions/track/helpers.ts
@@ -3687,9 +3688,6 @@ function bindAnimations(animations) {
       case "pageLoad":
         triggerAnimation(animation);
         break;
-      case "hover":
-        bindHoverAnimation(animation);
-        break;
       case "scrollInView":
         bindScrollInViewAnimation(animation);
         break;
@@ -3747,33 +3745,6 @@ function triggerAnimation(animation) {
     });
   });
 }
-function bindHoverAnimation(animation) {
-  const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
-  if (!elements.length) {
-    warnElementNotPresent(animation.elementId || animation.id || "");
-    return;
-  }
-  Array.from(elements).forEach((element) => {
-    augmentAnimation(animation, element);
-    const defaultState = animation.steps[0].styles;
-    const hoverState = animation.steps[1].styles;
-    function attachDefaultState() {
-      assign(element.style, defaultState);
-    }
-    function attachHoverState() {
-      assign(element.style, hoverState);
-    }
-    attachDefaultState();
-    element.addEventListener("mouseenter", attachHoverState);
-    element.addEventListener("mouseleave", attachDefaultState);
-    setTimeout(() => {
-      element.style.transition = `all ${animation.duration}s ${camelCaseToKebabCase(animation.easing)}`;
-      if (animation.delay) {
-        element.style.transitionDelay = animation.delay + "s";
-      }
-    });
-  });
-}
 function bindScrollInViewAnimation(animation) {
   const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
   if (!elements.length) {
@@ -4081,7 +4052,20 @@ function BlockStyles(props) {
       styles: smallStyles,
       mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
     }) : "";
-    return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
+    const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
+    let hoverStylesClass = "";
+    if (hoverAnimation) {
+      const hoverStyles = hoverAnimation.steps?.[1]?.styles || {};
+      hoverStylesClass = createCssClass({
+        className: `${className}:hover`,
+        styles: {
+          ...hoverStyles,
+          transition: `all ${hoverAnimation.duration}s ${camelCaseToKebabCase(hoverAnimation.easing)}`,
+          transitionDelay: hoverAnimation.delay ? `${hoverAnimation.delay}s` : "0s"
+        }
+      }) || "";
+    }
+    return [largeStylesClass, mediumStylesClass, smallStylesClass, hoverStylesClass].join(" ");
   });
   return createComponent(Show, {
     get when() {
@@ -4413,7 +4397,7 @@ function Block(props) {
     const blockId = processedBlock().id;
     const animations = processedBlock().animations;
     if (animations && blockId) {
-      bindAnimations(animations.filter((item) => item.trigger !== "hover").map((animation) => ({
+      bindAnimations(animations.map((animation) => ({
         ...animation,
         elementId: blockId
       })));
@@ -7333,14 +7317,12 @@ async function fetchEntries(options) {
 }
 
 // src/functions/is-previewing.ts
-function isPreviewing(search) {
-  if (!isBrowser()) {
-    return false;
-  }
-  const normalizedSearch = getSearchString(search || window.location.search);
-  if (isEditing(normalizedSearch)) {
+function isPreviewing(_search) {
+  const search = _search || (isBrowser() ? window.location.search : void 0);
+  if (!search) {
     return false;
   }
+  const normalizedSearch = getSearchString(search);
   return Boolean(normalizedSearch.indexOf("builder.preview=") !== -1);
 }
 
@@ -7588,7 +7570,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.20";
+var SDK_VERSION = "1.0.22";
 
 // src/functions/register.ts
 var registry = {};
@@ -7964,7 +7946,7 @@ function EnableEditor(props) {
           variationId: variationId !== contentId ? variationId : void 0
         });
       }
-      if (isPreviewing()) {
+      if (isPreviewing() && !isEditing()) {
         const searchParams = new URL(location.href).searchParams;
         const searchParamPreviewModel = searchParams.get("builder.preview");
         const searchParamPreviewId = searchParams.get(`builder.preview.${searchParamPreviewModel}`);

package/lib/edge/index.jsx

@@ -159,7 +159,8 @@ function isIframe() {
 
 // src/functions/is-editing.ts
 function isEditing(search) {
-  return isIframe() && (TARGET === "reactNative" || getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
+  return isIframe() && (TARGET === "reactNative" || // accessing window.location.search is safe here because `isIframe()` is only `true` if we're in a browser.
+  getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
 }
 
 // src/functions/track/helpers.ts
@@ -3676,9 +3677,6 @@ function bindAnimations(animations) {
       case "pageLoad":
         triggerAnimation(animation);
         break;
-      case "hover":
-        bindHoverAnimation(animation);
-        break;
       case "scrollInView":
         bindScrollInViewAnimation(animation);
         break;
@@ -3736,33 +3734,6 @@ function triggerAnimation(animation) {
     });
   });
 }
-function bindHoverAnimation(animation) {
-  const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
-  if (!elements.length) {
-    warnElementNotPresent(animation.elementId || animation.id || "");
-    return;
-  }
-  Array.from(elements).forEach((element) => {
-    augmentAnimation(animation, element);
-    const defaultState = animation.steps[0].styles;
-    const hoverState = animation.steps[1].styles;
-    function attachDefaultState() {
-      assign(element.style, defaultState);
-    }
-    function attachHoverState() {
-      assign(element.style, hoverState);
-    }
-    attachDefaultState();
-    element.addEventListener("mouseenter", attachHoverState);
-    element.addEventListener("mouseleave", attachDefaultState);
-    setTimeout(() => {
-      element.style.transition = `all ${animation.duration}s ${camelCaseToKebabCase(animation.easing)}`;
-      if (animation.delay) {
-        element.style.transitionDelay = animation.delay + "s";
-      }
-    });
-  });
-}
 function bindScrollInViewAnimation(animation) {
   const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
   if (!elements.length) {
@@ -4070,7 +4041,27 @@ function BlockStyles(props) {
         sizesWithUpdatedBreakpoints
       )
     }) : "";
-    return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
+    const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
+    let hoverStylesClass = "";
+    if (hoverAnimation) {
+      const hoverStyles = hoverAnimation.steps?.[1]?.styles || {};
+      hoverStylesClass = createCssClass({
+        className: `${className}:hover`,
+        styles: {
+          ...hoverStyles,
+          transition: `all ${hoverAnimation.duration}s ${camelCaseToKebabCase(
+            hoverAnimation.easing
+          )}`,
+          transitionDelay: hoverAnimation.delay ? `${hoverAnimation.delay}s` : "0s"
+        }
+      }) || "";
+    }
+    return [
+      largeStylesClass,
+      mediumStylesClass,
+      smallStylesClass,
+      hoverStylesClass
+    ].join(" ");
   });
   return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default id="builderio-block" styles={css5()} /></Show2>;
 }
@@ -4349,7 +4340,7 @@ function Block(props) {
     const animations = processedBlock().animations;
     if (animations && blockId) {
       bindAnimations(
-        animations.filter((item) => item.trigger !== "hover").map((animation) => ({
+        animations.map((animation) => ({
           ...animation,
           elementId: blockId
         }))
@@ -6918,14 +6909,12 @@ async function fetchEntries(options) {
 }
 
 // src/functions/is-previewing.ts
-function isPreviewing(search) {
-  if (!isBrowser()) {
-    return false;
-  }
-  const normalizedSearch = getSearchString(search || window.location.search);
-  if (isEditing(normalizedSearch)) {
+function isPreviewing(_search) {
+  const search = _search || (isBrowser() ? window.location.search : void 0);
+  if (!search) {
     return false;
   }
+  const normalizedSearch = getSearchString(search);
   return Boolean(normalizedSearch.indexOf("builder.preview=") !== -1);
 }
 
@@ -7173,7 +7162,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.20";
+var SDK_VERSION = "1.0.22";
 
 // src/functions/register.ts
 var registry = {};
@@ -7563,7 +7552,7 @@ function EnableEditor(props) {
           variationId: variationId !== contentId ? variationId : void 0
         });
       }
-      if (isPreviewing()) {
+      if (isPreviewing() && !isEditing()) {
         const searchParams = new URL(location.href).searchParams;
         const searchParamPreviewModel = searchParams.get("builder.preview");
         const searchParamPreviewId = searchParams.get(

package/lib/node/dev.js

@@ -166,7 +166,8 @@ function isIframe() {
 
 // src/functions/is-editing.ts
 function isEditing(search) {
-  return isIframe() && (TARGET === "reactNative" || getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
+  return isIframe() && (TARGET === "reactNative" || // accessing window.location.search is safe here because `isIframe()` is only `true` if we're in a browser.
+  getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
 }
 
 // src/functions/track/helpers.ts
@@ -381,8 +382,28 @@ if (typeof output === 'object' && output !== null) {
 output;
 `;
 };
+var IVM_INSTANCE = null;
+var getIvm = () => {
+  try {
+    if (IVM_INSTANCE)
+      return IVM_INSTANCE;
+    const dynRequiredIvm = safeDynamicRequire("isolated-vm");
+    if (dynRequiredIvm)
+      return dynRequiredIvm;
+  } catch (error2) {
+    logger.error("isolated-vm import error.", error2);
+  }
+  throw new Error(`${MSG_PREFIX}could not import \`isolated-vm\` module for safe script execution on Node server.
+    
+    In certain Node environments, the SDK requires additional initialization steps. This can be achieved by 
+    importing and calling \`initializeNodeRuntime()\` from "@builder.io/sdk-react/node/init". This must be done in
+    a server-only execution path within your application.
+
+    Please see the documentation for more information: https://builder.io/c/docs/integration-tips#enabling-data-bindings-in-node-environments
+    `);
+};
 var getIsolateContext = () => {
-  const ivm = safeDynamicRequire("isolated-vm");
+  const ivm = getIvm();
   const isolate = new ivm.Isolate({
     memoryLimit: 128
   });
@@ -397,7 +418,7 @@ var runInNode = ({
   rootSetState,
   rootState
 }) => {
-  const ivm = safeDynamicRequire("isolated-vm");
+  const ivm = getIvm();
   const state = fastClone({
     ...rootState,
     ...localState
@@ -661,9 +682,6 @@ function bindAnimations(animations) {
       case "pageLoad":
         triggerAnimation(animation);
         break;
-      case "hover":
-        bindHoverAnimation(animation);
-        break;
       case "scrollInView":
         bindScrollInViewAnimation(animation);
         break;
@@ -722,33 +740,6 @@ function triggerAnimation(animation) {
     });
   });
 }
-function bindHoverAnimation(animation) {
-  const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
-  if (!elements.length) {
-    warnElementNotPresent(animation.elementId || animation.id || "");
-    return;
-  }
-  Array.from(elements).forEach((element) => {
-    augmentAnimation(animation, element);
-    const defaultState = animation.steps[0].styles;
-    const hoverState = animation.steps[1].styles;
-    function attachDefaultState() {
-      assign(element.style, defaultState);
-    }
-    function attachHoverState() {
-      assign(element.style, hoverState);
-    }
-    attachDefaultState();
-    element.addEventListener("mouseenter", attachHoverState);
-    element.addEventListener("mouseleave", attachDefaultState);
-    setTimeout(() => {
-      element.style.transition = `all ${animation.duration}s ${camelCaseToKebabCase(animation.easing)}`;
-      if (animation.delay) {
-        element.style.transitionDelay = animation.delay + "s";
-      }
-    });
-  });
-}
 function bindScrollInViewAnimation(animation) {
   const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
   if (!elements.length) {
@@ -1059,7 +1050,20 @@ function BlockStyles(props) {
       styles: smallStyles,
       mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
     }) : "";
-    return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
+    const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
+    let hoverStylesClass = "";
+    if (hoverAnimation) {
+      const hoverStyles = hoverAnimation.steps?.[1]?.styles || {};
+      hoverStylesClass = createCssClass({
+        className: `${className}:hover`,
+        styles: {
+          ...hoverStyles,
+          transition: `all ${hoverAnimation.duration}s ${camelCaseToKebabCase(hoverAnimation.easing)}`,
+          transitionDelay: hoverAnimation.delay ? `${hoverAnimation.delay}s` : "0s"
+        }
+      }) || "";
+    }
+    return [largeStylesClass, mediumStylesClass, smallStylesClass, hoverStylesClass].join(" ");
   });
   return createComponent(Show, {
     get when() {
@@ -1391,7 +1395,7 @@ function Block(props) {
     const blockId = processedBlock().id;
     const animations = processedBlock().animations;
     if (animations && blockId) {
-      bindAnimations(animations.filter((item) => item.trigger !== "hover").map((animation) => ({
+      bindAnimations(animations.map((animation) => ({
         ...animation,
         elementId: blockId
       })));
@@ -4317,14 +4321,12 @@ async function fetchEntries(options) {
 }
 
 // src/functions/is-previewing.ts
-function isPreviewing(search) {
-  if (!isBrowser()) {
-    return false;
-  }
-  const normalizedSearch = getSearchString(search || window.location.search);
-  if (isEditing(normalizedSearch)) {
+function isPreviewing(_search) {
+  const search = _search || (isBrowser() ? window.location.search : void 0);
+  if (!search) {
     return false;
   }
+  const normalizedSearch = getSearchString(search);
   return Boolean(normalizedSearch.indexOf("builder.preview=") !== -1);
 }
 
@@ -4575,7 +4577,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.20";
+var SDK_VERSION = "1.0.22";
 
 // src/functions/register.ts
 var registry = {};
@@ -4953,7 +4955,7 @@ function EnableEditor(props) {
           variationId: variationId !== contentId ? variationId : void 0
         });
       }
-      if (isPreviewing()) {
+      if (isPreviewing() && !isEditing()) {
         const searchParams = new URL(location.href).searchParams;
         const searchParamPreviewModel = searchParams.get("builder.preview");
         const searchParamPreviewId = searchParams.get(`builder.preview.${searchParamPreviewModel}`);