@builder.io/sdk-qwik 0.14.5 → 0.14.7

package/lib/edge/index.qwik.cjs

@@ -211,7 +211,7 @@ function flattenState({ rootState, localState, rootSetState }) {
       if (localState && prop in localState)
         return localState[prop];
       const val = target[prop];
-      if (typeof val === "object")
+      if (typeof val === "object" && val !== null)
         return flattenState({
           rootState: val,
           localState: void 0,
@@ -3491,10 +3491,34 @@ const shouldForceBrowserRuntimeInNode = () => {
   return false;
 };
 const chooseBrowserOrServerEval = (args) => build.isBrowser || shouldForceBrowserRuntimeInNode() ? runInBrowser(args) : runInEdge(args);
-function evaluate({ code, context, localState, rootState, rootSetState, event, isExpression = true }) {
+const _EvalCache = class _EvalCache2 {
+  static getCacheKey(args) {
+    return JSON.stringify({
+      ...args,
+      // replace the event with a random number to break cache
+      // thats because we can't serialize the event object due to circular refs in DOM node refs.
+      event: args.event ? Math.random() : void 0
+    });
+  }
+  static getCachedValue(key) {
+    const cachedVal = _EvalCache2.cache.get(key);
+    return cachedVal;
+  }
+  static setCachedValue(key, value) {
+    if (_EvalCache2.cache.size > 20)
+      _EvalCache2.cache.delete(_EvalCache2.cache.keys().next().value);
+    _EvalCache2.cache.set(key, {
+      value
+    });
+  }
+};
+_EvalCache.cacheLimit = 20;
+_EvalCache.cache = /* @__PURE__ */ new Map();
+let EvalCache = _EvalCache;
+function evaluate({ code, context, localState, rootState, rootSetState, event, isExpression = true, enableCache }) {
   if (code === "") {
     logger.warn("Skipping evaluation of empty code block.");
-    return;
+    return void 0;
   }
   const args = {
     code: parseCode(code, {
@@ -3507,8 +3531,19 @@ function evaluate({ code, context, localState, rootState, rootSetState, event, i
     rootState,
     localState
   };
+  if (enableCache) {
+    const cacheKey = EvalCache.getCacheKey(args);
+    const cachedValue = EvalCache.getCachedValue(cacheKey);
+    if (cachedValue)
+      return cachedValue.value;
+  }
   try {
-    return chooseBrowserOrServerEval(args);
+    const newEval = chooseBrowserOrServerEval(args);
+    if (enableCache) {
+      const cacheKey = EvalCache.getCacheKey(args);
+      EvalCache.setCachedValue(cacheKey, newEval);
+    }
+    return newEval;
   } catch (e) {
     logger.error("Failed code evaluation: " + e.message, {
       code
@@ -3540,7 +3575,8 @@ const evaluateBindings = ({ block, context, localState, rootState, rootSetState
       localState,
       rootState,
       rootSetState,
-      context
+      context,
+      enableCache: true
     });
     set(copied, binding, value);
   }
@@ -3754,6 +3790,51 @@ function bindScrollInViewAnimation(animation) {
     immediateOnScroll();
   });
 }
+const camelToKebabCase = (string) => string.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
+const convertStyleMapToCSSArray = (style) => {
+  const cssProps = Object.entries(style).map(([key, value]) => {
+    if (typeof value === "string")
+      return `${camelToKebabCase(key)}: ${value};`;
+    else
+      return void 0;
+  });
+  return cssProps.filter(checkIsDefined);
+};
+const convertStyleMapToCSS = (style) => convertStyleMapToCSSArray(style).join("\n");
+const createCssClass = ({ mediaQuery, className, styles }) => {
+  const cssClass = `.${className} {
+    ${convertStyleMapToCSS(styles)}
+  }`;
+  if (mediaQuery)
+    return `${mediaQuery} {
+      ${cssClass}
+    }`;
+  else
+    return cssClass;
+};
+function transformStyleProperty({ style }) {
+  return style;
+}
+const getStyle = ({ block, context }) => {
+  return mapStyleObjToStrIfNeeded(transformStyleProperty({
+    style: block.style || {},
+    context,
+    block
+  }));
+};
+function mapStyleObjToStrIfNeeded(style) {
+  switch (TARGET) {
+    case "svelte":
+    case "vue":
+    case "solid":
+      return convertStyleMapToCSSArray(style).join(" ");
+    case "qwik":
+    case "reactNative":
+    case "react":
+    case "rsc":
+      return style;
+  }
+}
 const getComponent = ({ block, context, registeredComponents }) => {
   var _a;
   const componentName = (_a = getProcessedBlock({
@@ -3784,7 +3865,8 @@ const getRepeatItemData = ({ block, context }) => {
     localState: context.localState,
     rootState: context.rootState,
     rootSetState: context.rootSetState,
-    context: context.context
+    context: context.context,
+    enableCache: true
   });
   if (!Array.isArray(itemsArray))
     return void 0;
@@ -3848,28 +3930,6 @@ const getSizesForBreakpoints = ({ small, medium }) => {
   };
   return newSizes;
 };
-const camelToKebabCase = (string) => string.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
-const convertStyleMapToCSSArray = (style) => {
-  const cssProps = Object.entries(style).map(([key, value]) => {
-    if (typeof value === "string")
-      return `${camelToKebabCase(key)}: ${value};`;
-    else
-      return void 0;
-  });
-  return cssProps.filter(checkIsDefined);
-};
-const convertStyleMapToCSS = (style) => convertStyleMapToCSSArray(style).join("\n");
-const createCssClass = ({ mediaQuery, className, styles }) => {
-  const cssClass = `.${className} {
-    ${convertStyleMapToCSS(styles)}
-  }`;
-  if (mediaQuery)
-    return `${mediaQuery} {
-      ${cssClass}
-    }`;
-  else
-    return cssClass;
-};
 const InlinedStyles = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
   return /* @__PURE__ */ qwik._jsxQ("style", null, {
     dangerouslySetInnerHTML: qwik._fnSignal((p0) => p0.styles, [
@@ -3968,7 +4028,8 @@ function createEventHandler(value, options) {
       localState: options2.localState,
       rootState: options2.rootState,
       rootSetState: options2.rootSetState,
-      event
+      event,
+      enableCache: true
     });
   }, "createEventHandler_7wCAiJVliNE", [
     options,
@@ -3996,29 +4057,6 @@ function getBlockActions(options) {
   }
   return obj;
 }
-function transformStyleProperty({ style }) {
-  return style;
-}
-const getStyle = ({ block, context }) => {
-  return mapStyleObjToStrIfNeeded(transformStyleProperty({
-    style: block.style || {},
-    context,
-    block
-  }));
-};
-function mapStyleObjToStrIfNeeded(style) {
-  switch (TARGET) {
-    case "svelte":
-    case "vue":
-    case "solid":
-      return convertStyleMapToCSSArray(style).join(" ");
-    case "qwik":
-    case "reactNative":
-    case "react":
-    case "rsc":
-      return style;
-  }
-}
 function transformBlockProperties({ properties }) {
   return properties;
 }
@@ -4198,9 +4236,6 @@ const RepeatedBlock = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inl
 const Block = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
   var _a;
   qwik._jsxBranch();
-  const state = qwik.useStore({
-    childrenContext: props.context
-  });
   const blockComponent = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
     const [props2] = qwik.useLexicalScope();
     return getComponent({
@@ -4273,7 +4308,7 @@ const Block = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
   ]));
   const componentRefProps = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
     var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j;
-    const [blockComponent2, processedBlock2, props2, state2] = qwik.useLexicalScope();
+    const [blockComponent2, processedBlock2, props2] = qwik.useLexicalScope();
     return {
       blockChildren: processedBlock2.value.children ?? [],
       componentRef: (_a2 = blockComponent2.value) == null ? void 0 : _a2.component,
@@ -4287,7 +4322,7 @@ const Block = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
           builderComponents: props2.registeredComponents
         } : {}
       },
-      context: state2.childrenContext,
+      context: props2.context,
       linkComponent: props2.linkComponent,
       registeredComponents: props2.registeredComponents,
       builderBlock: processedBlock2.value,
@@ -4297,8 +4332,7 @@ const Block = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
   }, "Block_component_componentRefProps_useComputed_Ikbl8VO04ho", [
     blockComponent,
     processedBlock,
-    props,
-    state
+    props
   ]));
   qwik.useVisibleTaskQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
     const [processedBlock2] = qwik.useLexicalScope();
@@ -4406,19 +4440,19 @@ const Block = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
             (childrenWithoutParentComponent.value || []).map((child) => {
               return /* @__PURE__ */ qwik._jsxC(Block, {
                 block: child,
-                get context() {
-                  return state.childrenContext;
-                },
                 get registeredComponents() {
                   return props.registeredComponents;
                 },
                 get linkComponent() {
                   return props.linkComponent;
                 },
+                get context() {
+                  return props.context;
+                },
                 [qwik._IMMUTABLE]: {
-                  context: qwik._fnSignal((p0) => p0.childrenContext, [
-                    state
-                  ], "p0.childrenContext"),
+                  context: qwik._fnSignal((p0) => p0.context, [
+                    props
+                  ], "p0.context"),
                   linkComponent: qwik._fnSignal((p0) => p0.linkComponent, [
                     props
                   ], "p0.linkComponent"),
@@ -5012,9 +5046,9 @@ const Image = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
             props
           ], '"builder-image"+(p0.className?" "+p0.className:"")+" img-Image"'),
           loading: "lazy",
-          role: qwik._fnSignal((p0) => p0.altText ? "presentation" : void 0, [
+          role: qwik._fnSignal((p0) => p0.altText ? void 0 : "presentation", [
             props
-          ], 'p0.altText?"presentation":undefined'),
+          ], 'p0.altText?undefined:"presentation"'),
           sizes: qwik._fnSignal((p0) => p0.sizes, [
             props
           ], "p0.sizes"),
@@ -7591,7 +7625,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.5";
+const SDK_VERSION = "0.14.7";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -7840,7 +7874,11 @@ const evaluateJsCode = function evaluateJsCode2(props, state, elementRef) {
       context: props.context || {},
       localState: void 0,
       rootState: props.builderContextSignal.rootState,
-      rootSetState: props.builderContextSignal.rootSetState
+      rootSetState: props.builderContextSignal.rootSetState,
+      /**
+      * We don't want to cache the result of the JS code, since it's arbitrary side effect code.
+      */
+      enableCache: false
     });
 };
 const onClick = function onClick22(props, state, elementRef, event) {
@@ -7862,13 +7900,14 @@ const onClick = function onClick22(props, state, elementRef, event) {
     state.clicked = true;
 };
 const evalExpression = function evalExpression2(props, state, elementRef, expression) {
-  return expression.replace(/{{([^}]+)}}/g, (_match, group) => evaluate({
+  return expression.replace(/{{([^}]+)}}/g, (_match, group) => String(evaluate({
     code: group,
     context: props.context || {},
     localState: void 0,
     rootState: props.builderContextSignal.rootState,
-    rootSetState: props.builderContextSignal.rootSetState
-  }));
+    rootSetState: props.builderContextSignal.rootSetState,
+    enableCache: true
+  })));
 };
 const handleRequest = function handleRequest2(props, state, elementRef, { url, key }) {
   fetch$1(url).then((response) => response.json()).then((json) => {

package/lib/edge/index.qwik.mjs

@@ -209,7 +209,7 @@ function flattenState({ rootState, localState, rootSetState }) {
       if (localState && prop in localState)
         return localState[prop];
       const val = target[prop];
-      if (typeof val === "object")
+      if (typeof val === "object" && val !== null)
         return flattenState({
           rootState: val,
           localState: void 0,
@@ -3489,10 +3489,34 @@ const shouldForceBrowserRuntimeInNode = () => {
   return false;
 };
 const chooseBrowserOrServerEval = (args) => isBrowser$1 || shouldForceBrowserRuntimeInNode() ? runInBrowser(args) : runInEdge(args);
-function evaluate({ code, context, localState, rootState, rootSetState, event, isExpression = true }) {
+const _EvalCache = class _EvalCache2 {
+  static getCacheKey(args) {
+    return JSON.stringify({
+      ...args,
+      // replace the event with a random number to break cache
+      // thats because we can't serialize the event object due to circular refs in DOM node refs.
+      event: args.event ? Math.random() : void 0
+    });
+  }
+  static getCachedValue(key) {
+    const cachedVal = _EvalCache2.cache.get(key);
+    return cachedVal;
+  }
+  static setCachedValue(key, value) {
+    if (_EvalCache2.cache.size > 20)
+      _EvalCache2.cache.delete(_EvalCache2.cache.keys().next().value);
+    _EvalCache2.cache.set(key, {
+      value
+    });
+  }
+};
+_EvalCache.cacheLimit = 20;
+_EvalCache.cache = /* @__PURE__ */ new Map();
+let EvalCache = _EvalCache;
+function evaluate({ code, context, localState, rootState, rootSetState, event, isExpression = true, enableCache }) {
   if (code === "") {
     logger.warn("Skipping evaluation of empty code block.");
-    return;
+    return void 0;
   }
   const args = {
     code: parseCode(code, {
@@ -3505,8 +3529,19 @@ function evaluate({ code, context, localState, rootState, rootSetState, event, i
     rootState,
     localState
   };
+  if (enableCache) {
+    const cacheKey = EvalCache.getCacheKey(args);
+    const cachedValue = EvalCache.getCachedValue(cacheKey);
+    if (cachedValue)
+      return cachedValue.value;
+  }
   try {
-    return chooseBrowserOrServerEval(args);
+    const newEval = chooseBrowserOrServerEval(args);
+    if (enableCache) {
+      const cacheKey = EvalCache.getCacheKey(args);
+      EvalCache.setCachedValue(cacheKey, newEval);
+    }
+    return newEval;
   } catch (e) {
     logger.error("Failed code evaluation: " + e.message, {
       code
@@ -3538,7 +3573,8 @@ const evaluateBindings = ({ block, context, localState, rootState, rootSetState
       localState,
       rootState,
       rootSetState,
-      context
+      context,
+      enableCache: true
     });
     set(copied, binding, value);
   }
@@ -3752,6 +3788,51 @@ function bindScrollInViewAnimation(animation) {
     immediateOnScroll();
   });
 }
+const camelToKebabCase = (string) => string.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
+const convertStyleMapToCSSArray = (style) => {
+  const cssProps = Object.entries(style).map(([key, value]) => {
+    if (typeof value === "string")
+      return `${camelToKebabCase(key)}: ${value};`;
+    else
+      return void 0;
+  });
+  return cssProps.filter(checkIsDefined);
+};
+const convertStyleMapToCSS = (style) => convertStyleMapToCSSArray(style).join("\n");
+const createCssClass = ({ mediaQuery, className, styles }) => {
+  const cssClass = `.${className} {
+    ${convertStyleMapToCSS(styles)}
+  }`;
+  if (mediaQuery)
+    return `${mediaQuery} {
+      ${cssClass}
+    }`;
+  else
+    return cssClass;
+};
+function transformStyleProperty({ style }) {
+  return style;
+}
+const getStyle = ({ block, context }) => {
+  return mapStyleObjToStrIfNeeded(transformStyleProperty({
+    style: block.style || {},
+    context,
+    block
+  }));
+};
+function mapStyleObjToStrIfNeeded(style) {
+  switch (TARGET) {
+    case "svelte":
+    case "vue":
+    case "solid":
+      return convertStyleMapToCSSArray(style).join(" ");
+    case "qwik":
+    case "reactNative":
+    case "react":
+    case "rsc":
+      return style;
+  }
+}
 const getComponent = ({ block, context, registeredComponents }) => {
   var _a;
   const componentName = (_a = getProcessedBlock({
@@ -3782,7 +3863,8 @@ const getRepeatItemData = ({ block, context }) => {
     localState: context.localState,
     rootState: context.rootState,
     rootSetState: context.rootSetState,
-    context: context.context
+    context: context.context,
+    enableCache: true
   });
   if (!Array.isArray(itemsArray))
     return void 0;
@@ -3846,28 +3928,6 @@ const getSizesForBreakpoints = ({ small, medium }) => {
   };
   return newSizes;
 };
-const camelToKebabCase = (string) => string.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
-const convertStyleMapToCSSArray = (style) => {
-  const cssProps = Object.entries(style).map(([key, value]) => {
-    if (typeof value === "string")
-      return `${camelToKebabCase(key)}: ${value};`;
-    else
-      return void 0;
-  });
-  return cssProps.filter(checkIsDefined);
-};
-const convertStyleMapToCSS = (style) => convertStyleMapToCSSArray(style).join("\n");
-const createCssClass = ({ mediaQuery, className, styles }) => {
-  const cssClass = `.${className} {
-    ${convertStyleMapToCSS(styles)}
-  }`;
-  if (mediaQuery)
-    return `${mediaQuery} {
-      ${cssClass}
-    }`;
-  else
-    return cssClass;
-};
 const InlinedStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
   return /* @__PURE__ */ _jsxQ("style", null, {
     dangerouslySetInnerHTML: _fnSignal((p0) => p0.styles, [
@@ -3966,7 +4026,8 @@ function createEventHandler(value, options) {
       localState: options2.localState,
       rootState: options2.rootState,
       rootSetState: options2.rootSetState,
-      event
+      event,
+      enableCache: true
     });
   }, "createEventHandler_7wCAiJVliNE", [
     options,
@@ -3994,29 +4055,6 @@ function getBlockActions(options) {
   }
   return obj;
 }
-function transformStyleProperty({ style }) {
-  return style;
-}
-const getStyle = ({ block, context }) => {
-  return mapStyleObjToStrIfNeeded(transformStyleProperty({
-    style: block.style || {},
-    context,
-    block
-  }));
-};
-function mapStyleObjToStrIfNeeded(style) {
-  switch (TARGET) {
-    case "svelte":
-    case "vue":
-    case "solid":
-      return convertStyleMapToCSSArray(style).join(" ");
-    case "qwik":
-    case "reactNative":
-    case "react":
-    case "rsc":
-      return style;
-  }
-}
 function transformBlockProperties({ properties }) {
   return properties;
 }
@@ -4196,9 +4234,6 @@ const RepeatedBlock = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((p
 const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
   var _a;
   _jsxBranch();
-  const state = useStore({
-    childrenContext: props.context
-  });
   const blockComponent = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
     const [props2] = useLexicalScope();
     return getComponent({
@@ -4271,7 +4306,7 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
   ]));
   const componentRefProps = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
     var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j;
-    const [blockComponent2, processedBlock2, props2, state2] = useLexicalScope();
+    const [blockComponent2, processedBlock2, props2] = useLexicalScope();
     return {
       blockChildren: processedBlock2.value.children ?? [],
       componentRef: (_a2 = blockComponent2.value) == null ? void 0 : _a2.component,
@@ -4285,7 +4320,7 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
           builderComponents: props2.registeredComponents
         } : {}
       },
-      context: state2.childrenContext,
+      context: props2.context,
       linkComponent: props2.linkComponent,
       registeredComponents: props2.registeredComponents,
       builderBlock: processedBlock2.value,
@@ -4295,8 +4330,7 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
   }, "Block_component_componentRefProps_useComputed_Ikbl8VO04ho", [
     blockComponent,
     processedBlock,
-    props,
-    state
+    props
   ]));
   useVisibleTaskQrl(/* @__PURE__ */ inlinedQrl(() => {
     const [processedBlock2] = useLexicalScope();
@@ -4404,19 +4438,19 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
             (childrenWithoutParentComponent.value || []).map((child) => {
               return /* @__PURE__ */ _jsxC(Block, {
                 block: child,
-                get context() {
-                  return state.childrenContext;
-                },
                 get registeredComponents() {
                   return props.registeredComponents;
                 },
                 get linkComponent() {
                   return props.linkComponent;
                 },
+                get context() {
+                  return props.context;
+                },
                 [_IMMUTABLE]: {
-                  context: _fnSignal((p0) => p0.childrenContext, [
-                    state
-                  ], "p0.childrenContext"),
+                  context: _fnSignal((p0) => p0.context, [
+                    props
+                  ], "p0.context"),
                   linkComponent: _fnSignal((p0) => p0.linkComponent, [
                     props
                   ], "p0.linkComponent"),
@@ -5010,9 +5044,9 @@ const Image = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
             props
           ], '"builder-image"+(p0.className?" "+p0.className:"")+" img-Image"'),
           loading: "lazy",
-          role: _fnSignal((p0) => p0.altText ? "presentation" : void 0, [
+          role: _fnSignal((p0) => p0.altText ? void 0 : "presentation", [
             props
-          ], 'p0.altText?"presentation":undefined'),
+          ], 'p0.altText?undefined:"presentation"'),
           sizes: _fnSignal((p0) => p0.sizes, [
             props
           ], "p0.sizes"),
@@ -7589,7 +7623,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.5";
+const SDK_VERSION = "0.14.7";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -7838,7 +7872,11 @@ const evaluateJsCode = function evaluateJsCode2(props, state, elementRef) {
       context: props.context || {},
       localState: void 0,
       rootState: props.builderContextSignal.rootState,
-      rootSetState: props.builderContextSignal.rootSetState
+      rootSetState: props.builderContextSignal.rootSetState,
+      /**
+      * We don't want to cache the result of the JS code, since it's arbitrary side effect code.
+      */
+      enableCache: false
     });
 };
 const onClick = function onClick22(props, state, elementRef, event) {
@@ -7860,13 +7898,14 @@ const onClick = function onClick22(props, state, elementRef, event) {
     state.clicked = true;
 };
 const evalExpression = function evalExpression2(props, state, elementRef, expression) {
-  return expression.replace(/{{([^}]+)}}/g, (_match, group) => evaluate({
+  return expression.replace(/{{([^}]+)}}/g, (_match, group) => String(evaluate({
     code: group,
     context: props.context || {},
     localState: void 0,
     rootState: props.builderContextSignal.rootState,
-    rootSetState: props.builderContextSignal.rootSetState
-  }));
+    rootSetState: props.builderContextSignal.rootSetState,
+    enableCache: true
+  })));
 };
 const handleRequest = function handleRequest2(props, state, elementRef, { url, key }) {
   fetch$1(url).then((response) => response.json()).then((json) => {