@builder.io/sdk-react-native 3.0.0 → 3.0.2

package/lib/node/typescript/functions/traverse.d.ts

@@ -0,0 +1,35 @@
+type TraverseCallback = (value: any, update: (newValue: any) => void) => void;
+/**
+ * Recursively traverses an object or array, invoking a callback on each value.
+ *
+ * @param {any} obj - The object or array to traverse. Can also handle primitives, null, or undefined.
+ * @param {TraverseCallback} callback - The function to invoke on each value. Receives the current value
+ * and an `update` function to modify the value in its parent container.
+ * @param {any} [parent=null] - The parent object or array of the current value. Used internally.
+ * @param {any} [key=null] - The key or index of the current value in its parent. Used internally.
+ * @param {WeakSet} [visited=new WeakSet()] - Tracks visited objects to handle circular references. Used internally.
+ *
+ * @example
+ * // Example: Doubling all numbers in an object
+ * const obj = { a: 1, b: [2, 3, { c: 4 }] };
+ * traverse(obj, (value, update) => {
+ *   if (typeof value === 'number') {
+ *     update(value * 2);
+ *   }
+ * });
+ * console.log(obj); // { a: 2, b: [4, 6, { c: 8 }] }
+ *
+ * @example
+ * // Example: Handling circular references
+ * const obj = { a: 1 };
+ * obj.self = obj;
+ * traverse(obj, (value, update) => {
+ *   if (typeof value === 'number') {
+ *     update(value * 2);
+ *   }
+ * });
+ * console.log(obj.a); // 2
+ */
+export declare function traverse(obj: any, callback: TraverseCallback, parent?: any, key?: any, visited?: WeakSet<object>): void;
+export {};
+//# sourceMappingURL=traverse.d.ts.map

package/lib/node/typescript/functions/traverse.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"traverse.d.ts","sourceRoot":"","sources":["../../../../src/functions/traverse.ts"],"names":[],"mappings":"AAAA,KAAK,gBAAgB,GAAG,CAAC,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,QAAQ,EAAE,GAAG,KAAK,IAAI,KAAK,IAAI,CAAC;AAE9E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,wBAAgB,QAAQ,CAAC,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,GAAE,GAAU,EAAE,GAAG,GAAE,GAAU,EAAE,OAAO,kBAAgB,GAAG,IAAI,CA8BjI"}

package/lib/node/typescript/helpers/flatten.d.ts

@@ -14,4 +14,10 @@ export declare function flatten<T extends Record<string, any>>(object: T, path?:
 export declare function flattenMongoQuery(obj: any, _current?: any, _res?: any): {
     [key: string]: string;
 };
+/**
+ * Unflatten a flat object with dot-separated keys back into a nested object.
+ *
+ * { 'foo.bar': 'baz' } -> { foo: { bar: 'baz' }}
+ */
+export declare function unflatten(obj: any): any;
 //# sourceMappingURL=flatten.d.ts.map

package/lib/node/typescript/helpers/flatten.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flatten.d.ts","sourceRoot":"","sources":["../../../../src/helpers/flatten.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,GAAE,MAAM,GAAG,IAAW,EAAE,SAAS,SAAM,GAAG,CAAC,CAahH;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,GAAG,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,IAAI,GAAE,GAAQ,GAAG;IAC3E,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,CAWA"}
+{"version":3,"file":"flatten.d.ts","sourceRoot":"","sources":["../../../../src/helpers/flatten.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,GAAE,MAAM,GAAG,IAAW,EAAE,SAAS,SAAM,GAAG,CAAC,CAahH;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,GAAG,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,IAAI,GAAE,GAAQ,GAAG;IAC3E,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,CAWA;AAED;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,GAAG,EAAE,GAAG,GAAG,GAAG,CAgBvC"}

package/lib/node/typescript/server-index.d.ts

@@ -15,7 +15,7 @@ export type { ContentVariantsPrps as ContentProps } from './components/content-v
 /**
  * General Builder types
  */
-export type { RegisteredComponent } from './context/types';
+export type { BuilderContextInterface, RegisteredComponent, RegisteredComponents } from './context/types';
 export type { BuilderBlock } from './types/builder-block';
 export type { BuilderContent } from './types/builder-content';
 export type { ComponentInfo } from './types/components';

package/lib/node/typescript/server-index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"server-index.d.ts","sourceRoot":"","sources":["../../../src/server-index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC;AAE5C;;GAEG;AACH,YAAY,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAChE,YAAY,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,YAAY,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACtE,YAAY,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAC7D,YAAY,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AACnE,YAAY,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAChE,YAAY,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAC1D,YAAY,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAC7D,YAAY,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AACpE,YAAY,EAAE,mBAAmB,IAAI,YAAY,EAAE,MAAM,sDAAsD,CAAC;AAEhH;;GAEG;AACH,YAAY,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAC3D,YAAY,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAC1D,YAAY,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAC9D,YAAY,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAExD;;GAEG;AACH,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,8BAA8B,EAAE,MAAM,gCAAgC,CAAC;AAChF,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAChD,YAAY,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,YAAY,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,sBAAsB,EAAE,MAAM,6CAA6C,CAAC;AACrF,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE;;GAEG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnG,YAAY,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAA"}
+{"version":3,"file":"server-index.d.ts","sourceRoot":"","sources":["../../../src/server-index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC;AAE5C;;GAEG;AACH,YAAY,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAChE,YAAY,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,YAAY,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACtE,YAAY,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAC7D,YAAY,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AACnE,YAAY,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAChE,YAAY,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAC1D,YAAY,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAC7D,YAAY,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AACpE,YAAY,EAAE,mBAAmB,IAAI,YAAY,EAAE,MAAM,sDAAsD,CAAC;AAEhH;;GAEG;AACH,YAAY,EAAE,uBAAuB,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAC1G,YAAY,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAC1D,YAAY,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAC9D,YAAY,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAExD;;GAEG;AACH,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,8BAA8B,EAAE,MAAM,gCAAgC,CAAC;AAChF,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAChD,YAAY,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,YAAY,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,sBAAsB,EAAE,MAAM,6CAA6C,CAAC;AACrF,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE;;GAEG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnG,YAAY,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAA"}

package/lib/node/typescript/types/components.d.ts

@@ -146,6 +146,9 @@ export interface ComponentInfo {
          */
         builderLinkComponent?: boolean;
     };
+    meta?: {
+        [key: string]: any;
+    };
 }
 type Permission = 'read' | 'publish' | 'editCode' | 'editDesigns' | 'admin' | 'create';
 export {};

package/lib/node/typescript/types/components.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../../src/types/components.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAChD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AACrC,MAAM,WAAW,aAAa;IAC5B;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;IACjB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,IAAI,CAAC,EAAE,SAAS,GAAG,cAAc,GAAG,OAAO,GAAG,KAAK,CAAC;IACpD,aAAa,CAAC,EAAE;QACd,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;IACF;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,eAAe,CAAC,EAAE,cAAc,EAAE,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IAEnC,KAAK,CAAC,EAAE;QACN,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;KAClC,CAAC;IACF;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAElB;;OAEG;IACH,iBAAiB,CAAC,EAAE;QAClB,+FAA+F;QAC/F,OAAO,EAAE,MAAM,CAAC;QAChB,mEAAmE;QACnE,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB;;;;;;;;;WASG;QACH,KAAK,CAAC,EAAE,GAAG,CAAC;KACb,CAAC;IAEF;;OAEG;IACH,cAAc,CAAC,EAAE;QACf,2GAA2G;QAC3G,OAAO,EAAE,MAAM,CAAC;QAChB,uFAAuF;QACvF,SAAS,CAAC,EAAE,MAAM,CAAC;QAEnB;;;;;;;;;WASG;QACH,KAAK,CAAC,EAAE,GAAG,CAAC;KACb,CAAC;IACF,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAGxC,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,yBAAyB,CAAC,EAAE;QAC1B;;;;WAIG;QACH,YAAY,CAAC,EAAE,OAAO,CAAC;QAEvB;;;;;;WAMG;QACH,cAAc,CAAC,EAAE,OAAO,CAAC;QAEzB;;;;WAIG;QACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;QAE5B;;;;WAIG;QACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;KAChC,CAAC;CACH;AACD,KAAK,UAAU,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,aAAa,GAAG,OAAO,GAAG,QAAQ,CAAA"}
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../../src/types/components.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAChD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AACrC,MAAM,WAAW,aAAa;IAC5B;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;IACjB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,IAAI,CAAC,EAAE,SAAS,GAAG,cAAc,GAAG,OAAO,GAAG,KAAK,CAAC;IACpD,aAAa,CAAC,EAAE;QACd,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;IACF;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,eAAe,CAAC,EAAE,cAAc,EAAE,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IAEnC,KAAK,CAAC,EAAE;QACN,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;KAClC,CAAC;IACF;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAElB;;OAEG;IACH,iBAAiB,CAAC,EAAE;QAClB,+FAA+F;QAC/F,OAAO,EAAE,MAAM,CAAC;QAChB,mEAAmE;QACnE,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB;;;;;;;;;WASG;QACH,KAAK,CAAC,EAAE,GAAG,CAAC;KACb,CAAC;IAEF;;OAEG;IACH,cAAc,CAAC,EAAE;QACf,2GAA2G;QAC3G,OAAO,EAAE,MAAM,CAAC;QAChB,uFAAuF;QACvF,SAAS,CAAC,EAAE,MAAM,CAAC;QAEnB;;;;;;;;;WASG;QACH,KAAK,CAAC,EAAE,GAAG,CAAC;KACb,CAAC;IACF,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAGxC,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,yBAAyB,CAAC,EAAE;QAC1B;;;;WAIG;QACH,YAAY,CAAC,EAAE,OAAO,CAAC;QAEvB;;;;;;WAMG;QACH,cAAc,CAAC,EAAE,OAAO,CAAC;QAEzB;;;;WAIG;QACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;QAE5B;;;;WAIG;QACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;KAChC,CAAC;IACF,IAAI,CAAC,EAAE;QACL,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;KACpB,CAAC;CACH;AACD,KAAK,UAAU,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,aAAa,GAAG,OAAO,GAAG,QAAQ,CAAA"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@builder.io/sdk-react-native",
   "description": "Builder.io SDK for React Native",
-  "version": "3.0.0",
+  "version": "3.0.2",
   "homepage": "https://github.com/BuilderIO/builder/tree/main/packages/sdks/output/react-native",
   "repository": {
     "type": "git",

package/src/blocks/image/component-info.ts

@@ -1,3 +1,4 @@
+import { IMAGE_FILE_TYPES } from '../../constants/file-types';
 import type { ComponentInfo } from '../../types/components';
 export const componentInfo: ComponentInfo = {
   name: 'Image',
@@ -14,7 +15,7 @@ export const componentInfo: ComponentInfo = {
     name: 'image',
     type: 'file',
     bubble: true,
-    allowedFileTypes: ['jpeg', 'jpg', 'png', 'svg', 'webp'],
+    allowedFileTypes: IMAGE_FILE_TYPES,
     required: true,
     defaultValue: 'https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a',
     onChange: (options: Map<string, any>): void | Promise<void> => {

package/src/blocks/img/component-info.ts

@@ -1,3 +1,4 @@
+import { IMAGE_FILE_TYPES } from '../../constants/file-types';
 import type { ComponentInfo } from '../../types/components';
 export const componentInfo: ComponentInfo = {
   // friendlyName?
@@ -8,7 +9,7 @@ export const componentInfo: ComponentInfo = {
     name: 'image',
     bubble: true,
     type: 'file',
-    allowedFileTypes: ['jpeg', 'jpg', 'png', 'svg', 'gif', 'webp'],
+    allowedFileTypes: IMAGE_FILE_TYPES,
     required: true
   }],
   noWrap: true,

package/src/blocks/text/text.tsx

@@ -1,8 +1,7 @@
+import { RenderHTML } from '@builder.io/react-native-render-html';
 import * as React from 'react';
 import { useWindowDimensions } from 'react-native';
-import { RenderHTML } from '@builder.io/react-native-render-html';
 import BuilderContext from '../../context/builder.context';
-import { evaluate } from '../../functions/evaluate/index';
 
 /**
  * @typedef {{}} BuilderBlock
@@ -90,38 +89,17 @@ function getCss(block, inheritedStyles) {
 /**
  *
  * @param {{ text: string; builderBlock: BuilderBlock, builderContext: BuilderContext}} props
- * @returns 
+ * @returns
  */
 export default function Text(props) {
   const { width } = useWindowDimensions();
   const context = React.useContext(BuilderContext);
-  const {
-    context: contextContext,
-    localState,
-    rootState,
-    rootSetState,
-  } = context;
-
-  const processedText = String(props.text?.toString() || '').replace(
-        /{{([^}]+)}}/g, 
-        (match, group) => evaluate({
-          code: group,
-          context: contextContext,
-          localState,
-          rootState,
-          rootSetState,
-          
-        }).toString()
-      );
 
   return (
     <RenderHTML
       contentWidth={width}
       source={{
-        html: `<div style="${getCss(
-          props.builderBlock,
-          context.inheritedStyles
-        )}">${processedText}</div>`,
+        html: `<div style="${getCss(props.builderBlock, context.inheritedStyles)}">${props.text?.toString() || ''}</div>`,
       }}
     />
   );

package/src/blocks/video/component-info.ts

@@ -1,3 +1,4 @@
+import { IMAGE_FILE_TYPES, VIDEO_FILE_TYPES } from '../../constants/file-types';
 import type { ComponentInfo } from '../../types/components';
 export const componentInfo: ComponentInfo = {
   name: 'Video',
@@ -10,14 +11,14 @@ export const componentInfo: ComponentInfo = {
   inputs: [{
     name: 'video',
     type: 'file',
-    allowedFileTypes: ['mp4'],
+    allowedFileTypes: VIDEO_FILE_TYPES,
     bubble: true,
     defaultValue: 'https://cdn.builder.io/o/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fd27731a526464deba0016216f5f9e570%2Fcompressed?apiKey=YJIGb4i01jvw0SRdL5Bt&token=d27731a526464deba0016216f5f9e570&alt=media&optimized=true',
     required: true
   }, {
     name: 'posterImage',
     type: 'file',
-    allowedFileTypes: ['jpeg', 'png'],
+    allowedFileTypes: IMAGE_FILE_TYPES,
     helperText: 'Image to show before the video plays'
   }, {
     name: 'autoPlay',

package/src/components/block/block.helpers.ts

@@ -4,19 +4,26 @@ import { extractTextStyles } from '../../functions/extract-text-styles';
 import { getStyle } from '../../functions/get-style';
 import type { BuilderBlock } from '../../types/builder-block';
 import type { RepeatData } from './types';
+const checkIsComponentRestricted = (component: RegisteredComponent | null | undefined, model: string) => {
+  if (!component) return true;
+  if (!model) return false;
+  return component.models && component.models.length > 0 && !component.models.includes(model);
+};
 export const getComponent = ({
   block,
-  registeredComponents
+  registeredComponents,
+  model
 }: {
   block: BuilderBlock;
   registeredComponents: RegisteredComponents;
+  model: string;
 }) => {
   const componentName = block.component?.name;
   if (!componentName) {
     return null;
   }
   const ref = registeredComponents[componentName];
-  if (!ref) {
+  if (!ref || checkIsComponentRestricted(ref, model)) {
     // TODO: Public doc page with more info about this message
     console.warn(`
       Could not find a registered component named "${componentName}". 
@@ -93,10 +100,15 @@ export const provideLinkComponent = (block: RegisteredComponent | null | undefin
   };
   return {};
 };
-export const provideRegisteredComponents = (block: RegisteredComponent | null | undefined, registeredComponents: RegisteredComponents) => {
-  if (block?.shouldReceiveBuilderProps?.builderComponents) return {
-    builderComponents: registeredComponents
-  };
+export const provideRegisteredComponents = (block: RegisteredComponent | null | undefined, registeredComponents: RegisteredComponents, model: string) => {
+  if (block?.shouldReceiveBuilderProps?.builderComponents) {
+    const filteredRegisteredComponents = Object.fromEntries(Object.entries(registeredComponents).filter(([_, component]) => {
+      return !checkIsComponentRestricted(component, model);
+    }));
+    return {
+      builderComponents: filteredRegisteredComponents
+    };
+  }
   return {};
 };
 export const provideBuilderBlock = (block: RegisteredComponent | null | undefined, builderBlock: BuilderBlock) => {

package/src/components/block/block.tsx

@@ -72,7 +72,6 @@ function Block(props: BlockProps) {
           rootState: props.context.rootState,
           rootSetState: props.context.rootSetState,
           context: props.context.context,
-          shouldEvaluateBindings: true,
         });
     _processedBlock.value = blockToUse;
     _processedBlock.update = false;
@@ -83,6 +82,7 @@ function Block(props: BlockProps) {
     return getComponent({
       block: processedBlock(),
       registeredComponents: props.registeredComponents,
+      model: props.context.model,
     });
   }
 
@@ -128,13 +128,14 @@ function Block(props: BlockProps) {
       blockChildren: processedBlock().children ?? [],
       componentRef: blockComponent?.()?.component,
       componentOptions: {
-        ...getBlockComponentOptions(processedBlock()),
+        ...getBlockComponentOptions(processedBlock(), props.context),
         ...provideBuilderBlock(blockComponent(), processedBlock()),
         ...provideBuilderContext(blockComponent(), props.context),
         ...provideLinkComponent(blockComponent(), props.linkComponent),
         ...provideRegisteredComponents(
           blockComponent(),
-          props.registeredComponents
+          props.registeredComponents,
+          props.context.model
         ),
       },
       context: {

package/src/components/content/components/enable-editor.helpers.ts

@@ -0,0 +1,18 @@
+import { TARGET } from '../../../constants/target';
+import { isEditing } from '../../../functions/is-editing';
+import { isPreviewing } from '../../../functions/is-previewing';
+import type { Target } from '../../../types/targets';
+
+/**
+ * SDKS that use the elementRef approach to enable visual editing.
+ * We don't need to render the div for other SDKs as they attach event listeners to the window.
+ */
+export const SDKS_USING_ELEMENT_REF_APPROACH = (['svelte', 'qwik', 'vue'] as Target[]);
+
+/**
+ * We need to attach this div only when content exists or isPreviewing/isEditing even when content is null,
+ * as we need to set the elementRef and allow previewing and visual editing
+ */
+export const needsElementRefDivForEditing = () => {
+  return SDKS_USING_ELEMENT_REF_APPROACH.includes(TARGET) && (isEditing() || isPreviewing());
+}

package/src/components/content/components/enable-editor.tsx

@@ -55,6 +55,7 @@ import type {
   BuilderComponentStateChange,
   ContentProps,
 } from "../content.types";
+import { needsElementRefDivForEditing } from "./enable-editor.helpers";
 import { getWrapperClassName } from "./styles.helpers";
 
 function EnableEditor(props: BuilderEditorProps) {
@@ -249,8 +250,14 @@ function EnableEditor(props: BuilderEditorProps) {
     Object.values<ComponentInfo>(
       props.builderContextSignal.componentInfos
     ).forEach((registeredComponent) => {
-      const message = createRegisterComponentMessage(registeredComponent);
-      window.parent?.postMessage(message, "*");
+      if (
+        !props.model ||
+        !registeredComponent.models?.length ||
+        registeredComponent.models.includes(props.model)
+      ) {
+        const message = createRegisterComponentMessage(registeredComponent);
+        window.parent?.postMessage(message, "*");
+      }
     });
     window.addEventListener(
       "builder:component:stateChangeListenerActivated",
@@ -275,14 +282,23 @@ function EnableEditor(props: BuilderEditorProps) {
      * TO-DO: should we only update the state when there is a change?
      **/
     if (
-      searchParamPreviewModel === props.model &&
-      previewApiKey === props.apiKey &&
-      (!props.content || searchParamPreviewId === props.content.id)
+      searchParamPreviewModel === "BUILDER_STUDIO" ||
+      (searchParamPreviewModel === props.model &&
+        previewApiKey === props.apiKey &&
+        (!props.content || searchParamPreviewId === props.content.id))
     ) {
       fetchOneEntry({
-        model: props.model,
+        model: props.model || "",
         apiKey: props.apiKey,
         apiVersion: props.builderContextSignal.apiVersion,
+        ...(searchParamPreviewModel === "BUILDER_STUDIO" &&
+        props.context?.symbolId
+          ? {
+              query: {
+                id: props.context.symbolId,
+              },
+            }
+          : {}),
       }).then((content) => {
         if (content) {
           mergeNewContent(content);
@@ -323,8 +339,14 @@ function EnableEditor(props: BuilderEditorProps) {
         Object.values<ComponentInfo>(
           props.builderContextSignal.componentInfos
         ).forEach((registeredComponent) => {
-          const message = createRegisterComponentMessage(registeredComponent);
-          window.parent?.postMessage(message, "*");
+          if (
+            !props.model ||
+            !registeredComponent.models?.length ||
+            registeredComponent.models.includes(props.model)
+          ) {
+            const message = createRegisterComponentMessage(registeredComponent);
+            window.parent?.postMessage(message, "*");
+          }
         });
         window.addEventListener(
           "builder:component:stateChangeListenerActivated",
@@ -369,14 +391,23 @@ function EnableEditor(props: BuilderEditorProps) {
          * TO-DO: should we only update the state when there is a change?
          **/
         if (
-          searchParamPreviewModel === props.model &&
-          previewApiKey === props.apiKey &&
-          (!props.content || searchParamPreviewId === props.content.id)
+          searchParamPreviewModel === "BUILDER_STUDIO" ||
+          (searchParamPreviewModel === props.model &&
+            previewApiKey === props.apiKey &&
+            (!props.content || searchParamPreviewId === props.content.id))
         ) {
           fetchOneEntry({
-            model: props.model,
+            model: props.model || "",
             apiKey: props.apiKey,
             apiVersion: props.builderContextSignal.apiVersion,
+            ...(searchParamPreviewModel === "BUILDER_STUDIO" &&
+            props.context?.symbolId
+              ? {
+                  query: {
+                    id: props.context.symbolId,
+                  },
+                }
+              : {}),
           }).then((content) => {
             if (content) {
               mergeNewContent(content);
@@ -422,13 +453,20 @@ function EnableEditor(props: BuilderEditorProps) {
 
   return (
     <builderContext.Provider value={props.builderContextSignal}>
-      {props.builderContextSignal.content ? (
+      {props.builderContextSignal.content || needsElementRefDivForEditing() ? (
         <ContentWrapper
           {...{}}
           ref={elementRef}
           onClick={(event) => onClick(event)}
           builder-content-id={props.builderContextSignal.content?.id}
           builder-model={props.model}
+          style={{
+            display:
+              !props.builderContextSignal.content &&
+              needsElementRefDivForEditing()
+                ? "none"
+                : undefined,
+          }}
           {...{
             // currently, we can't set the actual ID here. // we don't need it right now, we just need to identify content divs for testing.
             dataSet: {

package/src/components/content/content.tsx

@@ -59,11 +59,7 @@ function ContentComponent(props: ContentProps) {
   const [registeredComponents, setRegisteredComponents] = useState(() =>
     [
       ...getDefaultRegisteredComponents(),
-      ...(props.customComponents?.filter(({ models }) => {
-        if (!models?.length) return true;
-        if (!props.model) return true;
-        return models.includes(props.model);
-      }) || []),
+      ...(props.customComponents || []),
     ].reduce<RegisteredComponents>(
       (acc, { component, ...info }) => ({
         ...acc,
@@ -96,11 +92,7 @@ function ContentComponent(props: ContentProps) {
       apiVersion: props.apiVersion,
       componentInfos: [
         ...getDefaultRegisteredComponents(),
-        ...(props.customComponents?.filter(({ models }) => {
-          if (!models?.length) return true;
-          if (!props.model) return true;
-          return models.includes(props.model);
-        }) || []),
+        ...(props.customComponents || []),
       ].reduce<Dictionary<ComponentInfo>>(
         (acc, { component: _, ...info }) => ({
           ...acc,
@@ -112,6 +104,7 @@ function ContentComponent(props: ContentProps) {
       BlocksWrapper: props.blocksWrapper || ScrollView,
       BlocksWrapperProps: props.blocksWrapperProps || {},
       nonce: props.nonce || "",
+      model: props.model || "",
     }));
 
   const hasInitialized = useRef(false);

package/src/constants/file-types.ts

@@ -0,0 +1,2 @@
+export const IMAGE_FILE_TYPES = ['jpeg', 'jpg', 'png', 'svg', 'webp', 'gif', 'jfif', 'pjpeg', 'pjp', 'apng', 'avif', 'tif', 'tiff', 'heif', 'bmp', 'eps', 'raw', 'cr2', 'nef', 'orf', 'sr2', 'psd', 'heic', 'dib', 'ai'];
+export const VIDEO_FILE_TYPES = ['mp4', 'webm', 'mkv', 'flv', 'vob', 'ogv', 'ogg', 'drc', 'gif', 'gifv', 'mng', 'avi', 'mov', 'qt', 'mts', 'm2ts', 'ts', 'wmv', 'yuv', 'rm', 'rmvb', 'viv', 'asf', 'amv', 'm4p', 'mpeg', 'mpe', 'm2v', 'm4v', 'svi', '3gp', '3g2', 'mxf', 'roq', 'nsv', 'f4v', 'f4p', 'f4a', 'f4b']

package/src/constants/sdk-version.ts

@@ -1 +1 @@
-export const SDK_VERSION = "3.0.0"
+export const SDK_VERSION = "3.0.2"

package/src/context/builder.context.ts

@@ -13,4 +13,5 @@ export default createContext<any>({
   BlocksWrapper: "div",
   BlocksWrapperProps: {},
   nonce: "",
+  model: "",
 });

package/src/context/types.ts

@@ -37,5 +37,6 @@ export interface BuilderContextInterface extends Pick<BlocksWrapperProps, 'Block
   // Used to recursively store all CSS coming from a parent that would apply to a Text block
   inheritedStyles: Record<string, unknown>;
   nonce: string;
+  model: string;
   canTrack?: boolean;
 }

package/src/functions/evaluate/edge-runtime/edge-runtime.ts

@@ -1,4 +1,3 @@
-import { logger } from '../../../helpers/logger';
 import type { ExecutorArgs } from '../helpers';
 import { flattenState, getFunctionArguments } from '../helpers';
 import Interpreter from './acorn-interpreter';
@@ -95,10 +94,7 @@ export const runInEdge = ({
     return `var ${key} = ${jsonValName} === undefined ? undefined : JSON.parse(${jsonValName});`;
   }).join('\n');
   const cleanedCode = processCode(code);
-  if (cleanedCode === '') {
-    logger.warn('Skipping evaluation of empty code block.');
-    return;
-  }
+  if (cleanedCode === '') return;
   const transformed = `
 function theFunction() {
   ${prependedCode}

package/src/functions/extract-localized-values.ts

@@ -0,0 +1,38 @@
+import type { BuilderBlock } from '../types/builder-block';
+import { traverse } from './traverse';
+function isLocalizedField(value: any) {
+  return value && typeof value === 'object' && value['@type'] === '@builder.io/core:LocalizedValue';
+}
+function containsLocalizedValues(data: Record<string, any>) {
+  if (!data || !Object.getOwnPropertyNames(data).length) {
+    return false;
+  }
+  let hasLocalizedValues = false;
+  traverse(data, value => {
+    if (isLocalizedField(value)) {
+      hasLocalizedValues = true;
+      return;
+    }
+  });
+  return hasLocalizedValues;
+}
+function extractLocalizedValues(data: Record<string, any>, locale: string) {
+  if (!data || !Object.getOwnPropertyNames(data).length) {
+    return {};
+  }
+  traverse(data, (value, update) => {
+    if (isLocalizedField(value)) {
+      update(value[locale] ?? undefined);
+    }
+  });
+  return data;
+}
+export function resolveLocalizedValues(block: BuilderBlock, locale: string | undefined) {
+  if (block.component?.options && containsLocalizedValues(block.component?.options)) {
+    if (!locale) {
+      console.warn('[Builder.io] In order to use localized fields in Builder, you must pass a locale prop to the BuilderComponent or to options object while fetching the content to resolve localized fields. Learn more: https://www.builder.io/c/docs/localization-inline#targeting-and-inline-localization');
+    }
+    block.component.options = extractLocalizedValues(block.component.options, locale ?? 'Default');
+  }
+  return block;
+}

package/src/functions/get-block-component-options.ts

@@ -1,7 +1,24 @@
+import type { BuilderContextInterface } from '../context/types';
 import type { BuilderBlock } from '../types/builder-block';
-export function getBlockComponentOptions(block: BuilderBlock) {
+import { evaluate } from './evaluate/evaluate';
+export function getBlockComponentOptions(block: BuilderBlock, context: Pick<BuilderContextInterface, 'localState' | 'context' | 'rootState' | 'rootSetState'>) {
   return {
     ...block.component?.options,
-    ...(block as any).options
+    ...(block as any).options,
+    ...evaluateTextComponentTextOption(block, context)
   };
+}
+const evaluateTextComponentTextOption = (block: BuilderBlock, context: Pick<BuilderContextInterface, 'localState' | 'context' | 'rootState' | 'rootSetState'>) => {
+  if (block.component?.name === 'Text' && block.component.options?.text && typeof block.component.options.text === 'string') {
+    return {
+      ...block.component.options,
+      text: block.component.options.text.replace(/{{([^}]+)}}/g, (_match: string, group: string) => (evaluate({
+        code: group,
+        context,
+        localState: context.localState,
+        rootState: context.rootState,
+        rootSetState: context.rootSetState
+      }) as string))
+    };
+  }
 }

package/src/functions/get-content/generate-content-url.ts

@@ -1,7 +1,8 @@
-import { flatten, flattenMongoQuery } from '../../helpers/flatten';
+import { flatten, flattenMongoQuery, unflatten } from '../../helpers/flatten';
 import { normalizeSearchParams } from '../../helpers/search/search';
 import { DEFAULT_API_VERSION } from '../../types/api-version';
 import { getBuilderSearchParamsFromWindow } from '../get-builder-search-params/index';
+import { isBrowser } from '../is-browser';
 import type { GetContentOptions } from './types';
 const isPositiveNumber = (thing: unknown) => typeof thing === 'number' && !isNaN(thing) && thing >= 0;
 export const generateContentUrl = (options: GetContentOptions): URL => {
@@ -39,7 +40,7 @@ export const generateContentUrl = (options: GetContentOptions): URL => {
   url.searchParams.set('noTraverse', String(noTraverse));
   url.searchParams.set('includeRefs', String(true));
   const finalLocale = locale || userAttributes?.locale;
-  let finalUserAttributes = userAttributes;
+  let finalUserAttributes: Record<string, any> = userAttributes || {};
   if (finalLocale) {
     url.searchParams.set('locale', finalLocale);
     finalUserAttributes = {
@@ -79,11 +80,15 @@ export const generateContentUrl = (options: GetContentOptions): URL => {
     ...getBuilderSearchParamsFromWindow(),
     ...normalizeSearchParams(options.options || {})
   };
+  finalUserAttributes = {
+    ...finalUserAttributes,
+    ...getUserAttributesAsJSON(queryOptions)
+  };
   const flattened = flatten(queryOptions);
   for (const key in flattened) {
     url.searchParams.set(key, String(flattened[key]));
   }
-  if (finalUserAttributes) {
+  if (Object.keys(finalUserAttributes).length > 0) {
     url.searchParams.set('userAttributes', JSON.stringify(finalUserAttributes));
   }
   if (query) {
@@ -95,4 +100,26 @@ export const generateContentUrl = (options: GetContentOptions): URL => {
     }
   }
   return url;
+};
+const getUserAttributesFromQueryOptions = (queryOptions: any) => {
+  const newUserAttributes: any = {};
+  for (const key in queryOptions) {
+    if (key.startsWith('userAttributes.')) {
+      newUserAttributes[key] = queryOptions[key];
+      delete queryOptions[key];
+    }
+  }
+  return newUserAttributes;
+};
+const getUserAttributesAsJSON = (queryOptions: any) => {
+  if (isBrowser() && queryOptions['preview'] === 'BUILDER_STUDIO') {
+    queryOptions['userAttributes.urlPath'] = window.location.pathname;
+    queryOptions['userAttributes.host'] = window.location.host;
+    const queryOptionsForUserAttributes = getUserAttributesFromQueryOptions(queryOptions);
+    const {
+      userAttributes
+    } = unflatten(queryOptionsForUserAttributes);
+    return userAttributes;
+  }
+  return {};
 }