@builder.io/sdk-vue 4.0.8 → 4.0.9

package/lib/browser/{awaiter-isRx9Yhd.js → awaiter-NGUZx5Ql.js}

@@ -1,6 +1,6 @@
 import "./style.css";
 import { defineComponent as t, renderSlot as o } from "vue";
-import { e as r } from "./index-3lnsErPD.js";
+import { e as r } from "./index-KjzWfqlO.js";
 const n = t({
   name: "awaiter",
   props: [],

package/lib/browser/{awaiter-OLNb_n6-.cjs → awaiter-QQ0ayrjs.cjs}

@@ -1 +1 @@
-var p=require("./style.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),r=require("./index-4YDWt2GA.cjs"),n=e.defineComponent({name:"awaiter",props:[],mounted(){}});function o(t,a,i,c,u,d){return e.renderSlot(t.$slots,"default")}const s=r._export_sfc(n,[["render",o]]);exports.default=s;
+var p=require("./style.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),r=require("./index-Vp6MzDwO.cjs"),n=e.defineComponent({name:"awaiter",props:[],mounted(){}});function o(t,a,i,c,u,d){return e.renderSlot(t.$slots,"default")}const s=r._export_sfc(n,[["render",o]]);exports.default=s;

package/lib/browser/{block-styles-gW8iE3NH.js → block-styles-1ljGw6Mj.js}

@@ -1,6 +1,6 @@
 import "./style.css";
 import { defineComponent as _, resolveComponent as x, openBlock as T, createBlock as w, createCommentVNode as I } from "vue";
-import { _ as N, T as Q, c as C, g as z, a, b as m, d as A, e as D } from "./index-3lnsErPD.js";
+import { _ as N, T as Q, c as C, g as z, a, b as m, d as A, e as D } from "./index-KjzWfqlO.js";
 const E = _({
   name: "block-styles",
   components: { InlinedStyles: N },

package/lib/browser/{block-styles-6C_KdO7n.cjs → block-styles-brcVdkhf.cjs}

@@ -1 +1 @@
-var _=require("./style.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("vue"),s=require("./index-4YDWt2GA.cjs"),x=a.defineComponent({name:"block-styles",components:{InlinedStyles:s._sfc_main},props:["block","context"],data(){return{TARGET:s.TARGET}},computed:{canShowBlock(){const e=this.block;return s.checkIsDefined(e.hide)?!e.hide:s.checkIsDefined(e.show)?e.show:!0},css(){var S,h,k,C,f;const e=this.block,t=e.responsiveStyles,o=this.context.content,r=s.getSizesForBreakpoints(((S=o==null?void 0:o.meta)==null?void 0:S.breakpoints)||{}),d=!!((k=(h=o==null?void 0:o.meta)==null?void 0:h.breakpoints)!=null&&k.xsmall),i=t==null?void 0:t.large,c=t==null?void 0:t.medium,u=t==null?void 0:t.small,y=t==null?void 0:t.xsmall,n=e.id;if(!n)return"";const b=i?s.createCssClass({className:n,styles:i}):"",g=c?s.createCssClass({className:n,styles:c,mediaQuery:s.getMaxWidthQueryForSize("medium",r)}):"",v=u?s.createCssClass({className:n,styles:u,mediaQuery:s.getMaxWidthQueryForSize("small",r)}):"",B=y&&d?s.createCssClass({className:n,styles:y,mediaQuery:s.getMaxWidthQueryForSize("xsmall",r)}):"",l=e.animations&&e.animations.find(m=>m.trigger==="hover");let p="";if(l){const m=((f=(C=l.steps)==null?void 0:C[1])==null?void 0:f.styles)||{};p=s.createCssClass({className:`${n}:hover`,styles:{...m,transition:`all ${l.duration}s ${s.camelToKebabCase(l.easing)}`,transitionDelay:l.delay?`${l.delay}s`:"0s"}})||""}return[b,g,v,B,p].join(" ")}}});function T(e,t,o,r,d,i){const c=a.resolveComponent("InlinedStyles");return e.TARGET!=="reactNative"&&e.css&&e.canShowBlock?(a.openBlock(),a.createBlock(c,{key:0,id:"builderio-block",styles:e.css,nonce:e.context.nonce},null,8,["styles","nonce"])):a.createCommentVNode("",!0)}const $=s._export_sfc(x,[["render",T]]);exports.default=$;
+var _=require("./style.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("vue"),s=require("./index-Vp6MzDwO.cjs"),x=a.defineComponent({name:"block-styles",components:{InlinedStyles:s._sfc_main},props:["block","context"],data(){return{TARGET:s.TARGET}},computed:{canShowBlock(){const e=this.block;return s.checkIsDefined(e.hide)?!e.hide:s.checkIsDefined(e.show)?e.show:!0},css(){var S,h,k,C,f;const e=this.block,t=e.responsiveStyles,o=this.context.content,r=s.getSizesForBreakpoints(((S=o==null?void 0:o.meta)==null?void 0:S.breakpoints)||{}),d=!!((k=(h=o==null?void 0:o.meta)==null?void 0:h.breakpoints)!=null&&k.xsmall),i=t==null?void 0:t.large,c=t==null?void 0:t.medium,u=t==null?void 0:t.small,y=t==null?void 0:t.xsmall,n=e.id;if(!n)return"";const b=i?s.createCssClass({className:n,styles:i}):"",g=c?s.createCssClass({className:n,styles:c,mediaQuery:s.getMaxWidthQueryForSize("medium",r)}):"",v=u?s.createCssClass({className:n,styles:u,mediaQuery:s.getMaxWidthQueryForSize("small",r)}):"",B=y&&d?s.createCssClass({className:n,styles:y,mediaQuery:s.getMaxWidthQueryForSize("xsmall",r)}):"",l=e.animations&&e.animations.find(m=>m.trigger==="hover");let p="";if(l){const m=((f=(C=l.steps)==null?void 0:C[1])==null?void 0:f.styles)||{};p=s.createCssClass({className:`${n}:hover`,styles:{...m,transition:`all ${l.duration}s ${s.camelToKebabCase(l.easing)}`,transitionDelay:l.delay?`${l.delay}s`:"0s"}})||""}return[b,g,v,B,p].join(" ")}}});function T(e,t,o,r,d,i){const c=a.resolveComponent("InlinedStyles");return e.TARGET!=="reactNative"&&e.css&&e.canShowBlock?(a.openBlock(),a.createBlock(c,{key:0,id:"builderio-block",styles:e.css,nonce:e.context.nonce},null,8,["styles","nonce"])):a.createCommentVNode("",!0)}const $=s._export_sfc(x,[["render",T]]);exports.default=$;

package/lib/browser/{block-wrapper--UA6l0DJ.js → block-wrapper-DtVkLhgy.js}

@@ -1,8 +1,8 @@
 import "./style.css";
 import { defineComponent as o, defineAsyncComponent as r, resolveComponent as n, openBlock as a, createBlock as c, withCtx as i, renderSlot as p } from "vue";
-import { g as s, a as l } from "./get-block-properties-IAHDaK7X.js";
-import { e as m } from "./index-3lnsErPD.js";
-const d = () => import("./index-3lnsErPD.js").then((e) => e.G).then((e) => e.default).catch((e) => {
+import { g as s, a as l } from "./get-block-properties-80VdsSqT.js";
+import { e as m } from "./index-KjzWfqlO.js";
+const d = () => import("./index-KjzWfqlO.js").then((e) => e.G).then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component DynamicRenderer at ../../dynamic-renderer/dynamic-renderer.vue",
     e

package/lib/browser/{block-wrapper-VXy583MG.cjs → block-wrapper-Kqaoo_JN.cjs}

@@ -1 +1 @@
-var k=require("./style.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),o=require("./get-block-properties-MbA9feRS.cjs"),n=require("./index-4YDWt2GA.cjs"),c=()=>Promise.resolve().then(()=>require("./index-4YDWt2GA.cjs")).then(e=>e.dynamicRenderer).then(e=>e.default).catch(e=>{throw console.error("Error while attempting to dynamically import component DynamicRenderer at ../../dynamic-renderer/dynamic-renderer.vue",e),e}),a=t.defineComponent({name:"block-wrapper",components:{DynamicRenderer:t.defineAsyncComponent(c)},props:["Wrapper","block","context"],data(){return{getBlockActions:o.getBlockActions,getBlockProperties:o.getBlockProperties}}});function i(e,l,p,d,m,u){const r=t.resolveComponent("DynamicRenderer");return t.openBlock(),t.createBlock(r,{TagName:e.Wrapper,attributes:e.getBlockProperties({block:e.block,context:e.context}),actionAttributes:e.getBlockActions({block:e.block,rootState:e.context.rootState,rootSetState:e.context.rootSetState,localState:e.context.localState,context:e.context.context,stripPrefix:!0})},{default:t.withCtx(()=>[t.renderSlot(e.$slots,"default")]),_:3},8,["TagName","attributes","actionAttributes"])}const s=n._export_sfc(a,[["render",i]]);exports.default=s;
+var k=require("./style.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),o=require("./get-block-properties-IBTEr28C.cjs"),n=require("./index-Vp6MzDwO.cjs"),c=()=>Promise.resolve().then(()=>require("./index-Vp6MzDwO.cjs")).then(e=>e.dynamicRenderer).then(e=>e.default).catch(e=>{throw console.error("Error while attempting to dynamically import component DynamicRenderer at ../../dynamic-renderer/dynamic-renderer.vue",e),e}),a=t.defineComponent({name:"block-wrapper",components:{DynamicRenderer:t.defineAsyncComponent(c)},props:["Wrapper","block","context"],data(){return{getBlockActions:o.getBlockActions,getBlockProperties:o.getBlockProperties}}});function i(e,l,p,d,m,u){const r=t.resolveComponent("DynamicRenderer");return t.openBlock(),t.createBlock(r,{TagName:e.Wrapper,attributes:e.getBlockProperties({block:e.block,context:e.context}),actionAttributes:e.getBlockActions({block:e.block,rootState:e.context.rootState,rootSetState:e.context.rootSetState,localState:e.context.localState,context:e.context.context,stripPrefix:!0})},{default:t.withCtx(()=>[t.renderSlot(e.$slots,"default")]),_:3},8,["TagName","attributes","actionAttributes"])}const s=n._export_sfc(a,[["render",i]]);exports.default=s;

package/lib/browser/blocks/personalization-container/helpers/inlined-fns.d.ts

@@ -3,6 +3,9 @@
  * They cannot import anything.
  */
 import type { Query, UserAttributes } from '../helpers';
+import { type PersonalizationContainerProps } from '../personalization-container.types';
 export declare function filterWithCustomTargeting(userAttributes: UserAttributes, query: Query[], startDate?: string, endDate?: string): boolean;
-export declare const PERSONALIZATION_SCRIPT = "function getPersonalizedVariant(variants, blockId, locale) {\n  if (!navigator.cookieEnabled) {\n    return;\n  }\n  function getCookie(name) {\n    const nameEQ = name + '=';\n    const ca = document.cookie.split(';');\n    for (let i = 0; i < ca.length; i++) {\n      let c = ca[i];\n      while (c.charAt(0) == ' ') c = c.substring(1, c.length);\n      if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);\n    }\n    return null;\n  }\n  function removeVariants() {\n    variants?.forEach(function (_, index) {\n      document.querySelector('template[data-variant-id=\"' + blockId + '-' + index + '\"]')?.remove();\n    });\n    document.querySelector('script[data-id=\"variants-script-' + blockId + '\"]')?.remove();\n    document.querySelector('style[data-id=\"variants-styles-' + blockId + '\"]')?.remove();\n  }\n  const attributes = JSON.parse(getCookie('builder.userAttributes') || '{}');\n  if (locale) {\n    attributes.locale = locale;\n  }\n  const winningVariantIndex = variants?.findIndex(function (variant) {\n    return filterWithCustomTargeting(attributes, variant.query, variant.startDate, variant.endDate);\n  });\n  const isDebug = location.href.includes('builder.debug=true');\n  if (isDebug) {\n    console.debug('PersonalizationContainer', {\n      attributes,\n      variants,\n      winningVariantIndex\n    });\n  }\n  if (winningVariantIndex !== -1) {\n    const winningVariant = document.querySelector('template[data-variant-id=\"' + blockId + '-' + winningVariantIndex + '\"]');\n    if (winningVariant) {\n      const parentNode = winningVariant.parentNode;\n      if (parentNode) {\n        const newParent = parentNode.cloneNode(false);\n        newParent.appendChild(winningVariant.content.firstChild);\n        newParent.appendChild(winningVariant.content.lastChild);\n        parentNode.parentNode?.replaceChild(newParent, parentNode);\n      }\n      if (isDebug) {\n        console.debug('PersonalizationContainer', 'Winning variant Replaced:', winningVariant);\n      }\n    }\n  } else if (variants && variants.length > 0) {\n    removeVariants();\n  }\n}";
+export declare function updateVisibilityStylesScript(variants: PersonalizationContainerProps['variants'], blockId: string, isHydrationTarget: boolean, locale?: string): void;
+export declare const PERSONALIZATION_SCRIPT = "function getPersonalizedVariant(variants, blockId, isHydrationTarget, locale) {\n  if (!navigator.cookieEnabled) {\n    return;\n  }\n  function getCookie(name) {\n    const nameEQ = name + '=';\n    const ca = document.cookie.split(';');\n    for (let i = 0; i < ca.length; i++) {\n      let c = ca[i];\n      while (c.charAt(0) == ' ') c = c.substring(1, c.length);\n      if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);\n    }\n    return null;\n  }\n  const attributes = JSON.parse(getCookie('builder.userAttributes') || '{}');\n  if (locale) {\n    attributes.locale = locale;\n  }\n  const winningVariantIndex = variants?.findIndex(function (variant) {\n    return window.filterWithCustomTargeting(attributes, variant.query, variant.startDate, variant.endDate);\n  });\n  const parentDiv = document.currentScript?.parentElement;\n  const variantId = parentDiv?.getAttribute('data-variant-id');\n  const isDefaultVariant = variantId === `${blockId}-default`;\n  const isWinningVariant = winningVariantIndex !== -1 && variantId === `${blockId}-${winningVariantIndex}` || winningVariantIndex === -1 && isDefaultVariant;\n  if (isWinningVariant && !isDefaultVariant) {\n    parentDiv?.removeAttribute('hidden');\n    parentDiv?.removeAttribute('aria-hidden');\n  } else if (!isWinningVariant && isDefaultVariant) {\n    parentDiv?.setAttribute('hidden', 'true');\n    parentDiv?.setAttribute('aria-hidden', 'true');\n  }\n  if (isHydrationTarget) {\n    if (!isWinningVariant) {\n      const itsStyleEl = parentDiv?.previousElementSibling;\n      if (itsStyleEl) {\n        itsStyleEl.remove();\n      }\n      parentDiv?.remove();\n    }\n    const thisScript = document.currentScript;\n    if (thisScript) {\n      thisScript.remove();\n    }\n  }\n}";
 export declare const FILTER_WITH_CUSTOM_TARGETING_SCRIPT = "function filterWithCustomTargeting(userAttributes, query, startDate, endDate) {\n  function isString(val) {\n    return typeof val === 'string';\n  }\n  function isNumber(val) {\n    return typeof val === 'number';\n  }\n  function objectMatchesQuery(userattr, query) {\n    const result = (() => {\n      const property = query.property;\n      const operator = query.operator;\n      let testValue = query.value;\n      if (query && query.property === 'urlPath' && query.value && typeof query.value === 'string' && query.value !== '/' && query.value.endsWith('/')) {\n        testValue = query.value.slice(0, -1);\n      }\n      if (!(property && operator)) {\n        return true;\n      }\n      if (Array.isArray(testValue)) {\n        if (operator === 'isNot') {\n          return testValue.every(val => objectMatchesQuery(userattr, {\n            property,\n            operator,\n            value: val\n          }));\n        }\n        return !!testValue.find(val => objectMatchesQuery(userattr, {\n          property,\n          operator,\n          value: val\n        }));\n      }\n      const value = userattr[property];\n      if (Array.isArray(value)) {\n        return value.includes(testValue);\n      }\n      switch (operator) {\n        case 'is':\n          return value === testValue;\n        case 'isNot':\n          return value !== testValue;\n        case 'contains':\n          return (isString(value) || Array.isArray(value)) && value.includes(String(testValue));\n        case 'startsWith':\n          return isString(value) && value.startsWith(String(testValue));\n        case 'endsWith':\n          return isString(value) && value.endsWith(String(testValue));\n        case 'greaterThan':\n          return isNumber(value) && isNumber(testValue) && value > testValue;\n        case 'lessThan':\n          return isNumber(value) && isNumber(testValue) && value < testValue;\n        case 'greaterThanOrEqualTo':\n          return isNumber(value) && isNumber(testValue) && value >= testValue;\n        case 'lessThanOrEqualTo':\n          return isNumber(value) && isNumber(testValue) && value <= testValue;\n        default:\n          return false;\n      }\n    })();\n    return result;\n  }\n  const item = {\n    query,\n    startDate,\n    endDate\n  };\n  const now = userAttributes.date && new Date(userAttributes.date) || new Date();\n  if (item.startDate && new Date(item.startDate) > now) {\n    return false;\n  } else if (item.endDate && new Date(item.endDate) < now) {\n    return false;\n  }\n  if (!item.query || !item.query.length) {\n    return true;\n  }\n  return item.query.every(filter => {\n    return objectMatchesQuery(userAttributes, filter);\n  });\n}";
+export declare const UPDATE_VISIBILITY_STYLES_SCRIPT = "function updateVisibilityStylesScript(variants, blockId, isHydrationTarget, locale) {\n  function getCookie(name) {\n    const nameEQ = name + '=';\n    const ca = document.cookie.split(';');\n    for (let i = 0; i < ca.length; i++) {\n      let c = ca[i];\n      while (c.charAt(0) == ' ') c = c.substring(1, c.length);\n      if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);\n    }\n    return null;\n  }\n  const visibilityStylesEl = document.currentScript?.previousElementSibling;\n  if (!visibilityStylesEl) {\n    return;\n  }\n  if (isHydrationTarget) {\n    visibilityStylesEl.remove();\n    const currentScript = document.currentScript;\n    if (currentScript) {\n      currentScript.remove();\n    }\n  } else {\n    const attributes = JSON.parse(getCookie('builder.userAttributes') || '{}');\n    if (locale) {\n      attributes.locale = locale;\n    }\n    const winningVariantIndex = variants?.findIndex(function (variant) {\n      return window.filterWithCustomTargeting(attributes, variant.query, variant.startDate, variant.endDate);\n    });\n    if (winningVariantIndex !== -1) {\n      let newStyleStr = variants?.map((_, index) => {\n        if (index === winningVariantIndex) return '';\n        return `div[data-variant-id=\"${blockId}-${index}\"] { display: none !important; } `;\n      }).join('') || '';\n      newStyleStr += `div[data-variant-id=\"${blockId}-default\"] { display: none !important; } `;\n      visibilityStylesEl.innerHTML = newStyleStr;\n    }\n  }\n}";

package/lib/browser/blocks/personalization-container/helpers.d.ts

@@ -1,5 +1,7 @@
 import type { BuilderBlock } from '../../types/builder-block';
+import type { Target } from '../../types/targets';
 import type { PersonalizationContainerProps } from './personalization-container.types';
+export declare const DEFAULT_INDEX = "default";
 export type UserAttributes = {
     date?: string | Date;
     urlPath?: string;
@@ -12,6 +14,25 @@ export type Query = {
     operator: QueryOperator;
     value: QueryValue;
 };
+type BlocksToRenderReturnType = {
+    blocks: BuilderBlock[];
+    path: string;
+    index: number | typeof DEFAULT_INDEX;
+};
+/**
+ * SDKs that support Variant Containers
+ */
+export declare const SDKS_SUPPORTING_PERSONALIZATION: Target[];
+/**
+ * After hydration, we reset the tree
+ * These SDKs handle Personalization Container in a special way:
+ * - first, the inlined script will help us add `display: none`, `aria-hidden: true` and `hidden: true` to the non-winning variants
+ * - then, on mount / when the component is hydrated - we reset the tree with only the winning variant and deleting the entire tree
+ *
+ * This helps us to avoid flicker and show the correct / winning variant initially and then once we've hydrated we show the winning variant
+ * and keep a track of the cookies to update to the correct variant dynamically when the cookie updates.
+ */
+export declare const SDKS_REQUIRING_RESET_APPROACH: Target[];
 export declare function checkShouldRenderVariants(variants: PersonalizationContainerProps['variants'], canTrack: boolean): boolean;
 export declare function getBlocksToRender({ variants, previewingIndex, isHydrated, filteredVariants, fallbackBlocks }: {
     variants: PersonalizationContainerProps['variants'];
@@ -19,9 +40,8 @@ export declare function getBlocksToRender({ variants, previewingIndex, isHydrate
     isHydrated: boolean;
     filteredVariants: PersonalizationContainerProps['variants'];
     fallbackBlocks?: BuilderBlock[];
-}): {
-    blocks: BuilderBlock[];
-    path: string | undefined;
-};
+}): BlocksToRenderReturnType;
+export declare const getInitPersonalizationVariantsFnsScriptString: () => string;
 export declare const getPersonalizationScript: (variants: PersonalizationContainerProps['variants'], blockId: string, locale?: string) => string;
+export declare const getUpdateVisibilityStylesScript: (variants: PersonalizationContainerProps['variants'], blockId: string, locale?: string) => string;
 export { filterWithCustomTargeting } from './helpers/inlined-fns';

package/lib/browser/blocks/personalization-container/personalization-container.types.d.ts

@@ -1,5 +1,5 @@
 import type { BuilderBlock } from '../../types/builder-block';
-import type { BuilderDataProps } from '../../types/builder-props';
+import type { BuilderComponentsProp, BuilderDataProps } from '../../types/builder-props';
 import type { Query } from './helpers';
 export type PersonalizationContainerProps = {
     children?: any;
@@ -11,4 +11,4 @@ export type PersonalizationContainerProps = {
         startDate?: string;
         endDate?: string;
     }>;
-} & BuilderDataProps;
+} & BuilderDataProps & BuilderComponentsProp;

package/lib/browser/blocks/personalization-container/personalization-container.vue.d.ts

@@ -1,31 +1,42 @@
 declare const _default: import("vue").DefineComponent<Readonly<{
     builderContext?: any;
     attributes?: any;
+    builderComponents?: any;
     builderBlock?: any;
     variants?: any;
     previewingIndex?: any;
 }>, unknown, {
     userAttributes: any;
     scriptStr: string;
+    updateVisibilityStylesScript: string;
     unsubscribers: never[];
     shouldRenderVariants: boolean;
-    isHydrated: boolean;
+    shouldResetVariants: boolean;
+    TARGET: import("../../types/targets").Target;
+    DEFAULT_INDEX: string;
+    SDKS_REQUIRING_RESET_APPROACH: import("../../types/targets").Target[];
 }, {
+    attrs(): {
+        [x: string]: any;
+    };
     filteredVariants(): any;
     blocksToRender(): {
         blocks: import("../..").BuilderBlock[];
-        path: string | undefined;
+        path: string;
+        index: number | "default";
     };
     hideVariantsStyleString(): any;
 }, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<Readonly<{
     builderContext?: any;
     attributes?: any;
+    builderComponents?: any;
     builderBlock?: any;
     variants?: any;
     previewingIndex?: any;
 }>>>, {
     readonly builderContext?: any;
     readonly attributes?: any;
+    readonly builderComponents?: any;
     readonly builderBlock?: any;
     readonly variants?: any;
     readonly previewingIndex?: any;

package/lib/browser/{component-ref-PKi5zQLG.js → component-ref-8jA-nznS.js}

@@ -1,8 +1,8 @@
 import "./style.css";
 import { defineComponent as u, defineAsyncComponent as g, resolveComponent as k, openBlock as n, createBlock as a, withCtx as l, renderSlot as m, resolveDynamicComponent as h, normalizeProps as f, mergeProps as b, createElementBlock as B, Fragment as W, renderList as $, createCommentVNode as v } from "vue";
-import { e as C, B as y, w as S } from "./index-3lnsErPD.js";
-import { a as w, g as A } from "./get-block-properties-IAHDaK7X.js";
-const R = () => import("./awaiter-isRx9Yhd.js").then((e) => e.default).catch((e) => {
+import { e as C, B as y, w as S } from "./index-KjzWfqlO.js";
+import { a as w, g as A } from "./get-block-properties-80VdsSqT.js";
+const R = () => import("./awaiter-NGUZx5Ql.js").then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component Awaiter at ../../awaiter.vue",
     e

package/lib/browser/{component-ref-BSoLNe8a.cjs → component-ref-mlq-HO5q.cjs}

@@ -1 +1 @@
-var B=require("./style.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),s=require("./index-4YDWt2GA.cjs"),l=require("./get-block-properties-MbA9feRS.cjs"),u=()=>Promise.resolve().then(()=>require("./awaiter-OLNb_n6-.cjs")).then(e=>e.default).catch(e=>{throw console.error("Error while attempting to dynamically import component Awaiter at ../../awaiter.vue",e),e}),k=t.defineComponent({name:"interactive-element",components:{Awaiter:t.defineAsyncComponent(u)},props:["wrapperProps","block","includeBlockProps","context","Wrapper"],data(){return{forceRenderCount:0}},watch:{onUpdateHook0:{handler(){},immediate:!0}},computed:{attributes(){return this.includeBlockProps?{...l.getBlockProperties({block:this.block,context:this.context}),...l.getBlockActions({block:this.block,rootState:this.context.rootState,rootSetState:this.context.rootSetState,localState:this.context.localState,context:this.context.context})}:{}},targetWrapperProps(){return{...this.wrapperProps,...Object.keys(this.attributes).length>0?{attributes:this.attributes}:{}}},onUpdateHook0(){var e,o;return{0:this.wrapperProps,1:(o=(e=this.block)==null?void 0:e.component)==null?void 0:o.options}}}});function h(e,o,a,c,r,i){const n=t.resolveComponent("Awaiter");return e.Wrapper.load?(t.openBlock(),t.createBlock(n,{key:0,load:e.Wrapper.load,fallback:e.Wrapper.fallback,props:e.wrapperProps,attributes:e.attributes},{default:t.withCtx(()=>[t.renderSlot(e.$slots,"default")]),_:3},8,["load","fallback","props","attributes"])):(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.Wrapper),t.normalizeProps(t.mergeProps({key:1},e.targetWrapperProps)),{default:t.withCtx(()=>[t.renderSlot(e.$slots,"default")]),_:3},16))}const m=s._export_sfc(k,[["render",h]]),f=({componentOptions:e,builderBlock:o,context:a,componentRef:c,includeBlockProps:r,isInteractive:i,contextValue:n})=>{const p={...e,...r?{attributes:l.getBlockProperties({block:o,context:n})}:{}};return i?{Wrapper:c,block:o,context:a,wrapperProps:e,includeBlockProps:r}:p},b=t.defineComponent({name:"component-ref",components:{Block:s.Block,InteractiveElement:m},props:["componentOptions","blockChildren","isInteractive","componentRef","builderBlock","context","linkComponent","includeBlockProps","registeredComponents"],data(){return{shouldUpdate:!1,Wrapper:this.isInteractive?s.wrapComponentRef(m):this.componentRef,getWrapperProps:f}},watch:{onUpdateHook0:{handler(){},immediate:!0}},computed:{onUpdateHook0(){return{0:this.componentOptions,1:this.blockChildren}}}});function C(e,o,a,c,r,i){const n=t.resolveComponent("Block");return e.componentRef?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.Wrapper),t.normalizeProps(t.mergeProps({key:0},e.getWrapperProps({componentOptions:e.componentOptions,builderBlock:e.builderBlock,context:e.context,componentRef:e.componentRef,linkComponent:e.linkComponent,includeBlockProps:e.includeBlockProps,isInteractive:e.isInteractive,contextValue:e.context}))),{default:t.withCtx(()=>[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.blockChildren,(p,d)=>(t.openBlock(),t.createBlock(n,{key:p.id,block:p,context:e.context,registeredComponents:e.registeredComponents,linkComponent:e.linkComponent},null,8,["block","context","registeredComponents","linkComponent"]))),128))]),_:1},16)):t.createCommentVNode("",!0)}const P=s._export_sfc(b,[["render",C]]);exports.default=P;
+var B=require("./style.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),s=require("./index-Vp6MzDwO.cjs"),l=require("./get-block-properties-IBTEr28C.cjs"),u=()=>Promise.resolve().then(()=>require("./awaiter-QQ0ayrjs.cjs")).then(e=>e.default).catch(e=>{throw console.error("Error while attempting to dynamically import component Awaiter at ../../awaiter.vue",e),e}),k=t.defineComponent({name:"interactive-element",components:{Awaiter:t.defineAsyncComponent(u)},props:["wrapperProps","block","includeBlockProps","context","Wrapper"],data(){return{forceRenderCount:0}},watch:{onUpdateHook0:{handler(){},immediate:!0}},computed:{attributes(){return this.includeBlockProps?{...l.getBlockProperties({block:this.block,context:this.context}),...l.getBlockActions({block:this.block,rootState:this.context.rootState,rootSetState:this.context.rootSetState,localState:this.context.localState,context:this.context.context})}:{}},targetWrapperProps(){return{...this.wrapperProps,...Object.keys(this.attributes).length>0?{attributes:this.attributes}:{}}},onUpdateHook0(){var e,o;return{0:this.wrapperProps,1:(o=(e=this.block)==null?void 0:e.component)==null?void 0:o.options}}}});function h(e,o,a,c,r,i){const n=t.resolveComponent("Awaiter");return e.Wrapper.load?(t.openBlock(),t.createBlock(n,{key:0,load:e.Wrapper.load,fallback:e.Wrapper.fallback,props:e.wrapperProps,attributes:e.attributes},{default:t.withCtx(()=>[t.renderSlot(e.$slots,"default")]),_:3},8,["load","fallback","props","attributes"])):(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.Wrapper),t.normalizeProps(t.mergeProps({key:1},e.targetWrapperProps)),{default:t.withCtx(()=>[t.renderSlot(e.$slots,"default")]),_:3},16))}const m=s._export_sfc(k,[["render",h]]),f=({componentOptions:e,builderBlock:o,context:a,componentRef:c,includeBlockProps:r,isInteractive:i,contextValue:n})=>{const p={...e,...r?{attributes:l.getBlockProperties({block:o,context:n})}:{}};return i?{Wrapper:c,block:o,context:a,wrapperProps:e,includeBlockProps:r}:p},b=t.defineComponent({name:"component-ref",components:{Block:s.Block,InteractiveElement:m},props:["componentOptions","blockChildren","isInteractive","componentRef","builderBlock","context","linkComponent","includeBlockProps","registeredComponents"],data(){return{shouldUpdate:!1,Wrapper:this.isInteractive?s.wrapComponentRef(m):this.componentRef,getWrapperProps:f}},watch:{onUpdateHook0:{handler(){},immediate:!0}},computed:{onUpdateHook0(){return{0:this.componentOptions,1:this.blockChildren}}}});function C(e,o,a,c,r,i){const n=t.resolveComponent("Block");return e.componentRef?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.Wrapper),t.normalizeProps(t.mergeProps({key:0},e.getWrapperProps({componentOptions:e.componentOptions,builderBlock:e.builderBlock,context:e.context,componentRef:e.componentRef,linkComponent:e.linkComponent,includeBlockProps:e.includeBlockProps,isInteractive:e.isInteractive,contextValue:e.context}))),{default:t.withCtx(()=>[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.blockChildren,(p,d)=>(t.openBlock(),t.createBlock(n,{key:p.id,block:p,context:e.context,registeredComponents:e.registeredComponents,linkComponent:e.linkComponent},null,8,["block","context","registeredComponents","linkComponent"]))),128))]),_:1},16)):t.createCommentVNode("",!0)}const P=s._export_sfc(b,[["render",C]]);exports.default=P;

package/lib/browser/components/blocks/blocks-wrapper.vue.d.ts

@@ -9,7 +9,19 @@ export type BlocksWrapperProps = {
      */
     BlocksWrapper: any;
     /**
-     * Additonal props to pass to `blocksWrapper`. Defaults to `{}`.
+     * Props to be applied to the wrapping element of blocks. Can be set in two ways:
+     * 1. Globally via `<Content blocksWrapperProps={{...}}/>` - applies to all blocks wrappers in the Content
+     * 2. Locally via `<Blocks BlocksWrapperProps={{...}}/>` - applies only to this specific blocks instance and overrides global props
+     *
+     * For merging both global and local props, spread the context props before adding your own:
+     * ```
+     * <Blocks
+     *   BlocksWrapperProps={{
+     *     ...builderContext.BlocksWrapperProps,
+     *     'data-test-id': 'my-test-id'
+     *   }}
+     * />
+     * ```
      */
     BlocksWrapperProps: any;
     children?: any;

package/lib/browser/components/blocks/blocks.types.d.ts

@@ -1,6 +1,6 @@
 import type { BuilderContextInterface, RegisteredComponents } from '../../context/types';
 import type { BlocksWrapperProps } from './blocks-wrapper.vue';
-export type BlocksProps = Partial<Omit<BlocksWrapperProps, 'BlocksWrapper' | 'BlocksWrapperProps' | 'classNameProp'>> & {
+export type BlocksProps = Partial<Omit<BlocksWrapperProps, 'BlocksWrapper' | 'classNameProp'>> & {
     context?: BuilderContextInterface;
     registeredComponents?: RegisteredComponents;
     linkComponent?: any;

package/lib/browser/components/blocks/blocks.vue.d.ts

@@ -3,6 +3,7 @@ declare const _default: import("vue").DefineComponent<Readonly<{
     blocks?: any;
     parent?: any;
     styleProp?: any;
+    BlocksWrapperProps?: any;
     className?: any;
     context?: any;
     linkComponent?: any;
@@ -12,6 +13,7 @@ declare const _default: import("vue").DefineComponent<Readonly<{
     blocks?: any;
     parent?: any;
     styleProp?: any;
+    BlocksWrapperProps?: any;
     className?: any;
     context?: any;
     linkComponent?: any;
@@ -21,6 +23,7 @@ declare const _default: import("vue").DefineComponent<Readonly<{
     readonly blocks?: any;
     readonly parent?: any;
     readonly styleProp?: any;
+    readonly BlocksWrapperProps?: any;
     readonly className?: any;
     readonly context?: any;
     readonly linkComponent?: any;

package/lib/browser/components/content-variants/content-variants.vue.d.ts

@@ -20,6 +20,8 @@ declare const _default: import("vue").DefineComponent<Readonly<{
     isNestedRender?: any;
 }>, unknown, {
     shouldRenderVariants: boolean;
+    SDKS_SUPPORTING_PERSONALIZATION: import("../../types/targets").Target[];
+    getInitPersonalizationVariantsFnsScriptString: () => string;
     TARGET: import("../../types/targets").Target;
     getInitVariantsFnsScriptString: () => string;
     getVariants: (content: import("../../helpers/nullable").Nullable<import("../..").BuilderContent>) => {
@@ -44,9 +46,7 @@ declare const _default: import("vue").DefineComponent<Readonly<{
         meta?: {
             [key: string]: any;
             breakpoints?: import("../../types/typescript").Nullable<import("../../types/builder-content").Breakpoints>;
-        } | undefined; /**
-         * For internal use only. Do not provide this prop.
-         */
+        } | undefined;
     }[];
 }, {
     updateCookieAndStylesScriptStr(): string;

package/lib/browser/constants/sdk-version.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "4.0.8";
+export declare const SDK_VERSION = "4.0.9";

package/lib/browser/{get-block-properties-IAHDaK7X.js → get-block-properties-80VdsSqT.js}

@@ -1,5 +1,5 @@
 import "./style.css";
-import { f as n, T as c, h as i, i as l } from "./index-3lnsErPD.js";
+import { f as n, T as c, h as i, i as l } from "./index-KjzWfqlO.js";
 const f = (e) => `v-on:${e.toLowerCase()}`, p = (e, t) => (r) => n({
   code: e,
   context: t.context,

package/lib/browser/{get-block-properties-MbA9feRS.cjs → get-block-properties-IBTEr28C.cjs}

@@ -1 +1 @@
-var d=require("./style.css");const s=require("./index-4YDWt2GA.cjs"),c=e=>`v-on:${e.toLowerCase()}`,i=(e,t)=>r=>s.evaluate({code:e,context:t.context,localState:t.localState,rootState:t.rootState,rootSetState:t.rootSetState,event:r,isExpression:!1});function l(e){const t={},r=e.block.actions??{};for(const o in r){if(!r.hasOwnProperty(o))continue;const a=r[o];let n=c(o);if(e.stripPrefix)switch(s.TARGET){case"vue":n=n.replace("v-on:","");break;case"svelte":n=n.replace("on:","");break}t[n]=i(a,e)}return t}function u({properties:e}){return e}const p=e=>({href:e.href});function f({block:e,context:t}){var o;const r={...p(e),...e.properties,"builder-id":e.id,style:s.getStyle({block:e,context:t}),[s.getClassPropName()]:[e.id,"builder-block",e.class,(o=e.properties)==null?void 0:o.class].filter(Boolean).join(" ")};return u({properties:r,context:t,block:e})}exports.getBlockActions=l;exports.getBlockProperties=f;
+var d=require("./style.css");const s=require("./index-Vp6MzDwO.cjs"),c=e=>`v-on:${e.toLowerCase()}`,i=(e,t)=>r=>s.evaluate({code:e,context:t.context,localState:t.localState,rootState:t.rootState,rootSetState:t.rootSetState,event:r,isExpression:!1});function l(e){const t={},r=e.block.actions??{};for(const o in r){if(!r.hasOwnProperty(o))continue;const a=r[o];let n=c(o);if(e.stripPrefix)switch(s.TARGET){case"vue":n=n.replace("v-on:","");break;case"svelte":n=n.replace("on:","");break}t[n]=i(a,e)}return t}function u({properties:e}){return e}const p=e=>({href:e.href});function f({block:e,context:t}){var o;const r={...p(e),...e.properties,"builder-id":e.id,style:s.getStyle({block:e,context:t}),[s.getClassPropName()]:[e.id,"builder-block",e.class,(o=e.properties)==null?void 0:o.class].filter(Boolean).join(" ")};return u({properties:r,context:t,block:e})}exports.getBlockActions=l;exports.getBlockProperties=f;