@builder.io/react 3.0.6-0 → 3.0.6-2

package/dist/types/src/components/builder-content.component.d.ts

@@ -56,73 +56,6 @@ export declare class BuilderContent<ContentType extends object = any> extends Re
     get name(): string;
     get renderedVariantId(): any;
     get options(): {
-        apiVersion?: "v1" | undefined;
-        userAttributes?: import("@builder.io/sdk/dist/src/builder.class").UserAttributes | undefined;
-        url?: string | undefined;
-        includeUrl?: boolean | undefined;
-        includeRefs?: boolean | undefined;
-        cacheSeconds?: number | undefined;
-        staleCacheSeconds?: number | undefined;
-        limit?: number | undefined;
-        query?: any;
-        cachebust?: boolean | undefined;
-        prerender?: boolean | undefined;
-        extractCss?: boolean | undefined;
-        offset?: number | undefined;
-        initialContent?: any;
-        model?: string | undefined;
-        cache?: boolean | undefined;
-        locale?: string | undefined;
-        preview?: boolean | undefined;
-        entry?: string | undefined;
-        alias?: string | undefined;
-        fields?: string | undefined;
-        omit?: string | undefined;
-        key?: string | undefined;
-        format?: "react" | "html" | "email" | "solid" | "amp" | undefined;
-        noWrap?: true | undefined;
-        rev?: string | undefined;
-        static?: boolean | undefined;
-        options?: {
-            [key: string]: any;
-        } | undefined;
-        noEditorUpdates?: boolean | undefined;
-    } | {
-        apiVersion?: "v3" | undefined;
-        enrich?: boolean | undefined;
-        userAttributes?: import("@builder.io/sdk/dist/src/builder.class").UserAttributes | undefined;
-        url?: string | undefined;
-        includeUrl?: boolean | undefined;
-        includeRefs?: boolean | undefined;
-        cacheSeconds?: number | undefined;
-        staleCacheSeconds?: number | undefined;
-        limit?: number | undefined;
-        query?: any;
-        cachebust?: boolean | undefined;
-        prerender?: boolean | undefined;
-        extractCss?: boolean | undefined;
-        offset?: number | undefined;
-        initialContent?: any;
-        model?: string | undefined;
-        cache?: boolean | undefined;
-        locale?: string | undefined;
-        preview?: boolean | undefined;
-        entry?: string | undefined;
-        alias?: string | undefined;
-        fields?: string | undefined;
-        omit?: string | undefined;
-        key?: string | undefined;
-        format?: "react" | "html" | "email" | "solid" | "amp" | undefined;
-        noWrap?: true | undefined;
-        rev?: string | undefined;
-        static?: boolean | undefined;
-        options?: {
-            [key: string]: any;
-        } | undefined;
-        noEditorUpdates?: boolean | undefined;
-    } | {
-        apiVersion?: undefined;
-        enrich?: boolean | undefined;
         userAttributes?: import("@builder.io/sdk/dist/src/builder.class").UserAttributes | undefined;
         url?: string | undefined;
         includeUrl?: boolean | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@builder.io/react",
-  "version": "3.0.6-0",
+  "version": "3.0.6-2",
   "description": "",
   "keywords": [],
   "main": "dist/builder-react.cjs.js",
@@ -122,7 +122,7 @@
     "react-dom": ">=16.8.0"
   },
   "dependencies": {
-    "@builder.io/sdk": "2.0.4",
+    "@builder.io/sdk": "workspace:*",
     "@emotion/core": "^10.0.17",
     "hash-sum": "^2.0.0",
     "preact": "^10.1.0",
@@ -132,5 +132,5 @@
     "hoistingLimits": "workspaces"
   },
   "gitHead": "4d96fbc32864698afbb355ab991c6d90be991951",
-  "stableVersion": "3.0.5"
-}
+  "stableVersion": "3.0.4"
+}

package/src/blocks/Symbol.tsx

@@ -34,6 +34,7 @@ export interface SymbolInfo {
   content?: any;
   inline?: boolean;
   dynamic?: boolean;
+  ownerId?: string;
 }
 
 export interface SymbolProps {
@@ -89,7 +90,7 @@ class SymbolComponent extends React.Component<SymbolProps> {
       ? NoWrap
       : (this.props.builderBlock && this.props.builderBlock.tagName) || 'div';
 
-    const { model, entry, data, content, inline } = symbol || {};
+    const { model, entry, data, content, inline, ownerId } = symbol || {};
     const dynamic = symbol?.dynamic || this.props.dynamic;
     if (!(model && (entry || dynamic)) && !content?.data?.blocksJs && !inline) {
       showPlaceholder = true;
@@ -122,11 +123,12 @@ class SymbolComponent extends React.Component<SymbolProps> {
                 this.placeholder
               ) : (
                 <BuilderComponent
+                  {...(ownerId && { apiKey: ownerId })}
                   {...(state.state?.locale && { locale: state.state.locale })}
                   isChild
                   ref={(ref: any) => (this.ref = ref)}
                   context={{ ...state.context, symbolId: this.props.builderBlock?.id }}
-                  modelName={model}
+                  model={model}
                   entry={entry}
                   data={{
                     ...data,

package/src/components/builder-block.component.tsx

@@ -593,18 +593,7 @@ export class BuilderBlock extends React.Component<
                         <InnerComponent
                           builderState={this.privateState}
                           builderBlock={block}
-                          {...(Builder.isEditing
-                            ? innerComponentProperties
-                            : innerComponentProperties?.text &&
-                              innerComponentProperties?.text?.['@type'] ===
-                                '@builder.io/core:LocalizedValue'
-                            ? {
-                                ...innerComponentProperties,
-                                text: innerComponentProperties?.text['Default'],
-                              }
-                            : {
-                                ...innerComponentProperties,
-                              })}
+                          {...innerComponentProperties}
                         />
                       )}
                       {(block as any).text || options.text

package/src/components/builder-component.component.tsx

@@ -49,6 +49,8 @@ function omit<T, K extends keyof T>(obj: T, ...keys: K[]): Omit<T, K> {
   return ret;
 }
 
+const instancesMap = new Map<string, Builder>();
+
 const wrapComponent = (info: any) => {
   return (props: any) => {
     // TODO: convention for all of this, like builderTagProps={{ style: {} foo: 'bar' }}
@@ -90,7 +92,7 @@ function debounce(func: Function, wait: number, immediate = false) {
 
 const fontsLoaded = new Set();
 
-let fetch: (typeof globalThis)['fetch'];
+let fetch: typeof globalThis['fetch'];
 if (globalThis.fetch) fetch = globalThis.fetch;
 fetch ??= require('node-fetch');
 
@@ -394,7 +396,7 @@ export class BuilderComponent extends React.Component<
       // TODO: should change if this prop changes
       context: {
         ...props.context,
-        apiKey: builder.apiKey || this.props.apiKey,
+        apiKey: this.props.apiKey || builder.apiKey,
       },
       state: Object.assign(this.rootState, {
         ...(this.inlinedContent && this.inlinedContent.data && this.inlinedContent.data.state),
@@ -416,7 +418,9 @@ export class BuilderComponent extends React.Component<
     if (Builder.isBrowser) {
       const key = this.props.apiKey;
       if (key && key !== this.builder.apiKey) {
-        this.builder.apiKey = key;
+        // hmm this could cause issues with global symbols
+        const instance = new Builder(key, undefined, undefined, true);
+        instancesMap.set(key, instance);
       }
 
       if (this.inlinedContent) {
@@ -428,7 +432,8 @@ export class BuilderComponent extends React.Component<
   }
 
   get builder() {
-    return this.props.builder || builder;
+    const instance = this.props.apiKey && instancesMap.get(this.props.apiKey);
+    return instance || this.props.builder || builder;
   }
 
   getHtmlData() {
@@ -1389,15 +1394,16 @@ export class BuilderComponent extends React.Component<
               error.stack
             );
           } else {
-            if (process?.env?.DEBUG) {
-              console.debug(
-                'Builder custom code error:',
-                error.message,
-                'in',
-                data.jsCode,
-                error.stack
-              );
-            }
+            // TODO(SK): test with replacing the below with typeof process !== undefined
+            // if (global?.process?.env?.DEBUG) {
+            console.debug(
+              'Builder custom code error:',
+              error.message,
+              'in',
+              data.jsCode,
+              error.stack
+            );
+            // }
             // Add to req.options.errors to return to client
           }
         }

package/src/components/builder-content.component.tsx

@@ -193,7 +193,7 @@ export class BuilderContent<ContentType extends object = any> extends React.Comp
     if (this.name !== '_inline') {
       // TODO:... using targeting...? express.request hmmm
       this.subscriptions.add(
-        builder.queueGetContent(this.name, this.options).subscribe(
+        this.builder.queueGetContent(this.name, this.options).subscribe(
           matches => {
             const match = matches && matches[0];
             this.setState({
@@ -204,7 +204,7 @@ export class BuilderContent<ContentType extends object = any> extends React.Comp
             // causing the sdk to resolve this call to the initialContent instead of the previewed/edited content
             // so we test here if the BuilderContent is being used directly ( not inlined ) and it has initial content ( content prop ), we let the first render go through to show the initial content
             // and we subscribe again to get the draft/editing content
-            const isPreviewing = (builder.editingModel || builder.previewingModel) === this.name;
+            const isPreviewing = (this.builder.editingModel || this.builder.previewingModel) === this.name;
             if (!this.props.inline && this.props.content && this.firstLoad && isPreviewing) {
               this.firstLoad = false;
               this.subscriptions.unsubscribe();

package/src/functions/string-to-function.ts

@@ -143,15 +143,16 @@ export function stringToFunction(
           error.stack || error
         );
       } else {
-        if (process?.env?.DEBUG) {
-          console.debug(
-            'Builder custom code error:',
-            error.message || error,
-            'in',
-            str,
-            error.stack || error
-          );
-        }
+        // TODO(SK): test with replacing the below with typeof process !== undefined
+        // if (process?.env?.DEBUG) {
+        console.debug(
+          'Builder custom code error:',
+          error.message || error,
+          'in',
+          str,
+          error.stack || error
+        );
+        // }
       }
       if (errors) {
         errors.push(error);

package/src/functions/try-eval.tsx

@@ -70,9 +70,10 @@ export const tryEval = (str?: string, data: any = {}, errors?: Error[]): any =>
     if (Builder.isBrowser) {
       console.warn('Builder custom code error:', error.message, 'in', str, error.stack);
     } else {
-      if (process?.env?.DEBUG) {
-        console.debug('Builder custom code error:', error.message, 'in', str, error.stack);
-      }
+      // TODO(SK): test with replacing the below with typeof process !== undefined
+      // if (process?.env?.DEBUG) {
+      console.debug('Builder custom code error:', error.message, 'in', str, error.stack);
+      // }
       // Add to req.options.errors to return to client
     }
   }

package/src/scripts/init-editing.ts

@@ -8,6 +8,7 @@ if (typeof window !== 'undefined') {
         value: true,
         supportsPatchUpdates: 'v4',
         supportsCustomBreakpoints: true,
+        supportsGlobalSymbols: true,
         priorVersion: version,
       },
     },

package/.npmrc

@@ -1 +0,0 @@
-git-tag-version=false