@builder.io/sdk-qwik 0.14.15 → 0.14.16

package/lib/browser/index.qwik.cjs

@@ -124,7 +124,8 @@ function isIframe() {
   return isBrowser() && window.self !== window.top;
 }
 function isEditing(search) {
-  return isIframe() && getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1;
+  return isIframe() && // 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;
 }
 const getLocation = () => {
   if (isBrowser()) {
@@ -417,9 +418,6 @@ function bindAnimations(animations) {
       case "pageLoad":
         triggerAnimation(animation);
         break;
-      case "hover":
-        bindHoverAnimation(animation);
-        break;
       case "scrollInView":
         bindScrollInViewAnimation(animation);
         break;
@@ -475,32 +473,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) {
@@ -730,7 +702,7 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
     props
   ]));
   const css = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
-    var _a;
+    var _a, _b, _c;
     const [props2] = qwik.useLexicalScope();
     const processedBlock = getProcessedBlock({
       block: props2.block,
@@ -763,10 +735,24 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
       styles: smallStyles,
       mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
     }) : "";
+    const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
+    let hoverStylesClass = "";
+    if (hoverAnimation) {
+      const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.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
+      smallStylesClass,
+      hoverStylesClass
     ].join(" ");
   }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
     props
@@ -1110,7 +1096,7 @@ const Block = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
     const blockId = processedBlock2.value.id;
     const animations = processedBlock2.value.animations;
     if (animations && blockId)
-      bindAnimations(animations.filter((item) => item.trigger !== "hover").map((animation) => ({
+      bindAnimations(animations.map((animation) => ({
         ...animation,
         elementId: blockId
       })));
@@ -4188,12 +4174,11 @@ async function fetchEntries(options) {
     return null;
   }
 }
-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);
 }
 function uuidv4() {
@@ -4399,7 +4384,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.14.15";
+const SDK_VERSION = "0.14.16";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -4789,7 +4774,7 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
           variationId: variationId !== contentId ? variationId : void 0
         });
       }
-      if (isPreviewing()) {
+      if (isPreviewing() && !isEditing()) {
         if (element)
           element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
       }

package/lib/browser/index.qwik.mjs

@@ -122,7 +122,8 @@ function isIframe() {
   return isBrowser() && window.self !== window.top;
 }
 function isEditing(search) {
-  return isIframe() && getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1;
+  return isIframe() && // 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;
 }
 const getLocation = () => {
   if (isBrowser()) {
@@ -415,9 +416,6 @@ function bindAnimations(animations) {
       case "pageLoad":
         triggerAnimation(animation);
         break;
-      case "hover":
-        bindHoverAnimation(animation);
-        break;
       case "scrollInView":
         bindScrollInViewAnimation(animation);
         break;
@@ -473,32 +471,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) {
@@ -728,7 +700,7 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
     props
   ]));
   const css = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
-    var _a;
+    var _a, _b, _c;
     const [props2] = useLexicalScope();
     const processedBlock = getProcessedBlock({
       block: props2.block,
@@ -761,10 +733,24 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
       styles: smallStyles,
       mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
     }) : "";
+    const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
+    let hoverStylesClass = "";
+    if (hoverAnimation) {
+      const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.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
+      smallStylesClass,
+      hoverStylesClass
     ].join(" ");
   }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
     props
@@ -1108,7 +1094,7 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
     const blockId = processedBlock2.value.id;
     const animations = processedBlock2.value.animations;
     if (animations && blockId)
-      bindAnimations(animations.filter((item) => item.trigger !== "hover").map((animation) => ({
+      bindAnimations(animations.map((animation) => ({
         ...animation,
         elementId: blockId
       })));
@@ -4186,12 +4172,11 @@ async function fetchEntries(options) {
     return null;
   }
 }
-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);
 }
 function uuidv4() {
@@ -4397,7 +4382,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.14.15";
+const SDK_VERSION = "0.14.16";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -4787,7 +4772,7 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
           variationId: variationId !== contentId ? variationId : void 0
         });
       }
-      if (isPreviewing()) {
+      if (isPreviewing() && !isEditing()) {
         if (element)
           element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
       }

package/lib/edge/index.qwik.cjs

@@ -124,7 +124,8 @@ function isIframe() {
   return isBrowser() && window.self !== window.top;
 }
 function isEditing(search) {
-  return isIframe() && getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1;
+  return isIframe() && // 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;
 }
 const getLocation = () => {
   if (isBrowser()) {
@@ -3648,9 +3649,6 @@ function bindAnimations(animations) {
       case "pageLoad":
         triggerAnimation(animation);
         break;
-      case "hover":
-        bindHoverAnimation(animation);
-        break;
       case "scrollInView":
         bindScrollInViewAnimation(animation);
         break;
@@ -3706,32 +3704,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) {
@@ -3961,7 +3933,7 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
     props
   ]));
   const css = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
-    var _a;
+    var _a, _b, _c;
     const [props2] = qwik.useLexicalScope();
     const processedBlock = getProcessedBlock({
       block: props2.block,
@@ -3994,10 +3966,24 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
       styles: smallStyles,
       mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
     }) : "";
+    const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
+    let hoverStylesClass = "";
+    if (hoverAnimation) {
+      const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.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
+      smallStylesClass,
+      hoverStylesClass
     ].join(" ");
   }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
     props
@@ -4341,7 +4327,7 @@ const Block = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
     const blockId = processedBlock2.value.id;
     const animations = processedBlock2.value.animations;
     if (animations && blockId)
-      bindAnimations(animations.filter((item) => item.trigger !== "hover").map((animation) => ({
+      bindAnimations(animations.map((animation) => ({
         ...animation,
         elementId: blockId
       })));
@@ -7419,12 +7405,11 @@ async function fetchEntries(options) {
     return null;
   }
 }
-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);
 }
 function uuidv4() {
@@ -7630,7 +7615,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.14.15";
+const SDK_VERSION = "0.14.16";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -8020,7 +8005,7 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
           variationId: variationId !== contentId ? variationId : void 0
         });
       }
-      if (isPreviewing()) {
+      if (isPreviewing() && !isEditing()) {
         if (element)
           element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
       }

package/lib/edge/index.qwik.mjs

@@ -122,7 +122,8 @@ function isIframe() {
   return isBrowser() && window.self !== window.top;
 }
 function isEditing(search) {
-  return isIframe() && getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1;
+  return isIframe() && // 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;
 }
 const getLocation = () => {
   if (isBrowser()) {
@@ -3646,9 +3647,6 @@ function bindAnimations(animations) {
       case "pageLoad":
         triggerAnimation(animation);
         break;
-      case "hover":
-        bindHoverAnimation(animation);
-        break;
       case "scrollInView":
         bindScrollInViewAnimation(animation);
         break;
@@ -3704,32 +3702,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) {
@@ -3959,7 +3931,7 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
     props
   ]));
   const css = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
-    var _a;
+    var _a, _b, _c;
     const [props2] = useLexicalScope();
     const processedBlock = getProcessedBlock({
       block: props2.block,
@@ -3992,10 +3964,24 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
       styles: smallStyles,
       mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
     }) : "";
+    const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
+    let hoverStylesClass = "";
+    if (hoverAnimation) {
+      const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.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
+      smallStylesClass,
+      hoverStylesClass
     ].join(" ");
   }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
     props
@@ -4339,7 +4325,7 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
     const blockId = processedBlock2.value.id;
     const animations = processedBlock2.value.animations;
     if (animations && blockId)
-      bindAnimations(animations.filter((item) => item.trigger !== "hover").map((animation) => ({
+      bindAnimations(animations.map((animation) => ({
         ...animation,
         elementId: blockId
       })));
@@ -7417,12 +7403,11 @@ async function fetchEntries(options) {
     return null;
   }
 }
-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);
 }
 function uuidv4() {
@@ -7628,7 +7613,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.14.15";
+const SDK_VERSION = "0.14.16";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -8018,7 +8003,7 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
           variationId: variationId !== contentId ? variationId : void 0
         });
       }
-      if (isPreviewing()) {
+      if (isPreviewing() && !isEditing()) {
         if (element)
           element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
       }

package/lib/node/index.qwik.cjs

@@ -126,7 +126,8 @@ function isIframe() {
   return isBrowser() && window.self !== window.top;
 }
 function isEditing(search) {
-  return isIframe() && getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1;
+  return isIframe() && // 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;
 }
 const getLocation = () => {
   if (isBrowser()) {
@@ -539,9 +540,6 @@ function bindAnimations(animations) {
       case "pageLoad":
         triggerAnimation(animation);
         break;
-      case "hover":
-        bindHoverAnimation(animation);
-        break;
       case "scrollInView":
         bindScrollInViewAnimation(animation);
         break;
@@ -597,32 +595,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) {
@@ -852,7 +824,7 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
     props
   ]));
   const css = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
-    var _a;
+    var _a, _b, _c;
     const [props2] = qwik.useLexicalScope();
     const processedBlock = getProcessedBlock({
       block: props2.block,
@@ -885,10 +857,24 @@ const BlockStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlin
       styles: smallStyles,
       mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
     }) : "";
+    const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
+    let hoverStylesClass = "";
+    if (hoverAnimation) {
+      const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.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
+      smallStylesClass,
+      hoverStylesClass
     ].join(" ");
   }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
     props
@@ -1232,7 +1218,7 @@ const Block = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
     const blockId = processedBlock2.value.id;
     const animations = processedBlock2.value.animations;
     if (animations && blockId)
-      bindAnimations(animations.filter((item) => item.trigger !== "hover").map((animation) => ({
+      bindAnimations(animations.map((animation) => ({
         ...animation,
         elementId: blockId
       })));
@@ -4310,12 +4296,11 @@ async function fetchEntries(options) {
     return null;
   }
 }
-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);
 }
 function uuidv4() {
@@ -4521,7 +4506,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.14.15";
+const SDK_VERSION = "0.14.16";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -4911,7 +4896,7 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
           variationId: variationId !== contentId ? variationId : void 0
         });
       }
-      if (isPreviewing()) {
+      if (isPreviewing() && !isEditing()) {
         if (element)
           element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
       }

package/lib/node/index.qwik.mjs

@@ -124,7 +124,8 @@ function isIframe() {
   return isBrowser() && window.self !== window.top;
 }
 function isEditing(search) {
-  return isIframe() && getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1;
+  return isIframe() && // 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;
 }
 const getLocation = () => {
   if (isBrowser()) {
@@ -537,9 +538,6 @@ function bindAnimations(animations) {
       case "pageLoad":
         triggerAnimation(animation);
         break;
-      case "hover":
-        bindHoverAnimation(animation);
-        break;
       case "scrollInView":
         bindScrollInViewAnimation(animation);
         break;
@@ -595,32 +593,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) {
@@ -850,7 +822,7 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
     props
   ]));
   const css = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
-    var _a;
+    var _a, _b, _c;
     const [props2] = useLexicalScope();
     const processedBlock = getProcessedBlock({
       block: props2.block,
@@ -883,10 +855,24 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
       styles: smallStyles,
       mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
     }) : "";
+    const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
+    let hoverStylesClass = "";
+    if (hoverAnimation) {
+      const hoverStyles = ((_c = (_b = hoverAnimation.steps) == null ? void 0 : _b[1]) == null ? void 0 : _c.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
+      smallStylesClass,
+      hoverStylesClass
     ].join(" ");
   }, "BlockStyles_component_css_useComputed_b9Ru8qTcNik", [
     props
@@ -1230,7 +1216,7 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
     const blockId = processedBlock2.value.id;
     const animations = processedBlock2.value.animations;
     if (animations && blockId)
-      bindAnimations(animations.filter((item) => item.trigger !== "hover").map((animation) => ({
+      bindAnimations(animations.map((animation) => ({
         ...animation,
         elementId: blockId
       })));
@@ -4308,12 +4294,11 @@ async function fetchEntries(options) {
     return null;
   }
 }
-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);
 }
 function uuidv4() {
@@ -4519,7 +4504,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.14.15";
+const SDK_VERSION = "0.14.16";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -4909,7 +4894,7 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
           variationId: variationId !== contentId ? variationId : void 0
         });
       }
-      if (isPreviewing()) {
+      if (isPreviewing() && !isEditing()) {
         if (element)
           element.dispatchEvent(new CustomEvent("initpreviewingbldr"));
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@builder.io/sdk-qwik",
-  "version": "0.14.15",
+  "version": "0.14.16",
   "homepage": "https://github.com/BuilderIO/builder/tree/main/packages/sdks/output/qwik",
   "repository": {
     "type": "git",

package/types/src/components/block/animator.d.ts

@@ -1,5 +1,5 @@
 import type { BuilderAnimation } from '../../types/builder-block';
+export declare const camelCaseToKebabCase: (str?: string) => string;
 export declare function bindAnimations(animations: BuilderAnimation[]): void;
 export declare function triggerAnimation(animation: BuilderAnimation): void;
-export declare function bindHoverAnimation(animation: BuilderAnimation): void;
 export declare function bindScrollInViewAnimation(animation: BuilderAnimation): void;

package/types/src/constants/sdk-version.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "0.14.15";
+export declare const SDK_VERSION = "0.14.16";

package/types/src/functions/is-previewing.d.ts

@@ -1,2 +1,2 @@
 import type { Search } from '../helpers/search/search';
-export declare function isPreviewing(search?: Search): boolean;
+export declare function isPreviewing(_search?: Search): boolean;