@builder.io/sdk-react 0.5.2 → 0.5.4

package/README.md

@@ -90,3 +90,7 @@ npm install @builder.io/sdk-react
 ## Fetch
 
 This Package uses fetch. See [these docs](https://github.com/BuilderIO/this-package-uses-fetch/blob/main/README.md) for more information.
+
+## Non-Node.js Runtimes (Edge, Serverless)
+
+If planning to deploy your app to a non-Node.js runtime (like Edge or Serverless functions), make sure to read the [Non-Node.js Runtimes](../../README.md#non-nodejs-runtimes-edge-serverless) section of the main README.

package/dist/blocks/BaseText.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface BaseTextProps {
     text: string;
 }

package/dist/blocks/button/button.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * This import is used by the Svelte SDK. Do not remove.
  */ export interface ButtonProps {

package/dist/blocks/button/button.js

@@ -3,8 +3,8 @@ import * as React from "react";
 function Button(props) {
     return (React.createElement(React.Fragment, null,
         props.link ? (React.createElement(React.Fragment, null,
-            React.createElement("a", { role: "button", ...props.attributes, href: props.link, target: props.openLinkInNewTab ? "_blank" : undefined }, props.text))) : (React.createElement(React.Fragment, null,
-            React.createElement("button", { ...props.attributes, style: props.attributes.style, className: props.attributes.className + " button-7267e9c6" }, props.text))),
+            React.createElement("a", { role: "button", ...{}, ...props.attributes, href: props.link, target: props.openLinkInNewTab ? "_blank" : undefined }, props.text))) : (React.createElement(React.Fragment, null,
+            React.createElement("button", { ...{}, ...props.attributes, style: props.attributes.style, className: props.attributes.className + " button-7267e9c6" }, props.text))),
         React.createElement("style", null, `.button-7267e9c6 {
   all: unset;
 }`)));

package/dist/blocks/columns/columns.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 type Column = {
     blocks: BuilderBlock[];
     width?: number;

package/dist/blocks/columns/columns.js

@@ -102,10 +102,10 @@ function Columns(props) {
     }
     return (React.createElement(React.Fragment, null,
         React.createElement("div", { className: `builder-columns ${props.builderBlock.id}-breakpoints` +
-                " div-9f5ab4f8", style: columnsCssVars() },
+                " div-9f5ab4f8", style: columnsCssVars(), ...{} },
             TARGET !== "reactNative" ? (React.createElement(React.Fragment, null,
                 React.createElement(InlinedStyles, { styles: columnsStyles() }))) : null,
-            props.columns?.map((column, index) => (React.createElement("div", { className: "builder-column div-9f5ab4f8-2", style: columnCssVars(index), key: index },
+            props.columns?.map((column, index) => (React.createElement("div", { className: "builder-column div-9f5ab4f8-2", style: columnCssVars(index), ...{}, key: index },
                 React.createElement(Blocks, { blocks: column.blocks, path: `component.options.columns.${index}.blocks`, parent: props.builderBlock.id, styleProp: {
                         flexGrow: "1",
                     }, context: props.builderContext, registeredComponents: props.builderComponents }))))),

package/dist/blocks/custom-code/custom-code.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface CustomCodeProps {
     code: string;
     replaceNodes?: boolean;

package/dist/blocks/embed/embed.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface EmbedProps {
     content: string;
 }

package/dist/blocks/form/form.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 declare function FormComponent(props: any): JSX.Element;
 export default FormComponent;

package/dist/blocks/fragment/fragment.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface FragmentProps {
     maxWidth?: number;
     attributes?: any;

package/dist/blocks/image/image.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface ImageProps {
     className?: string;
     image: string;

package/dist/blocks/img/img.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * This import is used by the Svelte SDK. Do not remove.
  */ export interface ImgProps {

package/dist/blocks/img/img.js

@@ -5,6 +5,6 @@ function ImgComponent(props) {
     return (React.createElement("img", { style: {
             objectFit: props.backgroundSize || "cover",
             objectPosition: props.backgroundPosition || "center",
-        }, key: (isEditing() && props.imgSrc) || "default-key", alt: props.altText, src: props.imgSrc || props.image, ...props.attributes }));
+        }, key: (isEditing() && props.imgSrc) || "default-key", alt: props.altText, src: props.imgSrc || props.image, ...{}, ...props.attributes }));
 }
 export default ImgComponent;

package/dist/blocks/input/input.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * This import is used by the Svelte SDK. Do not remove.
  */ export interface FormInputProps {

package/dist/blocks/input/input.js

@@ -2,6 +2,6 @@
 import * as React from "react";
 import { isEditing } from "../../functions/is-editing.js";
 function FormInputComponent(props) {
-    return (React.createElement("input", { ...props.attributes, key: isEditing() && props.defaultValue ? props.defaultValue : "default-key", placeholder: props.placeholder, type: props.type, name: props.name, value: props.value, defaultValue: props.defaultValue, required: props.required }));
+    return (React.createElement("input", { ...{}, ...props.attributes, key: isEditing() && props.defaultValue ? props.defaultValue : "default-key", placeholder: props.placeholder, type: props.type, name: props.name, value: props.value, defaultValue: props.defaultValue, required: props.required }));
 }
 export default FormInputComponent;

package/dist/blocks/raw-text/raw-text.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface RawTextProps {
     attributes?: any;
     text?: string;

package/dist/blocks/section/section.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * This import is used by the Svelte SDK. Do not remove.
  */ export interface SectionProps {

package/dist/blocks/section/section.js

@@ -1,7 +1,7 @@
 "use client";
 import * as React from "react";
 function SectionComponent(props) {
-    return (React.createElement("section", { ...props.attributes, style: {
+    return (React.createElement("section", { ...{}, ...props.attributes, style: {
             width: "100%",
             alignSelf: "stretch",
             flexGrow: 1,

package/dist/blocks/select/select.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * This import is used by the Svelte SDK. Do not remove.
  */ export interface FormSelectProps {

package/dist/blocks/select/select.js

@@ -2,6 +2,6 @@
 import * as React from "react";
 import { isEditing } from "../../functions/is-editing.js";
 function SelectComponent(props) {
-    return (React.createElement("select", { ...props.attributes, value: props.value, key: isEditing() && props.defaultValue ? props.defaultValue : "default-key", defaultValue: props.defaultValue, name: props.name }, props.options?.map((option) => (React.createElement("option", { value: option.value }, option.name || option.value)))));
+    return (React.createElement("select", { ...{}, ...props.attributes, value: props.value, key: isEditing() && props.defaultValue ? props.defaultValue : "default-key", defaultValue: props.defaultValue, name: props.name }, props.options?.map((option) => (React.createElement("option", { value: option.value }, option.name || option.value)))));
 }
 export default SelectComponent;

package/dist/blocks/submit-button/submit-button.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * This import is used by the Svelte SDK. Do not remove.
  */ export interface ButtonProps {

package/dist/blocks/submit-button/submit-button.js

@@ -1,6 +1,6 @@
 "use client";
 import * as React from "react";
 function SubmitButton(props) {
-    return (React.createElement("button", { type: "submit", ...props.attributes }, props.text));
+    return (React.createElement("button", { type: "submit", ...{}, ...props.attributes }, props.text));
 }
 export default SubmitButton;

package/dist/blocks/symbol/symbol.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * This import is used by the Svelte SDK. Do not remove.
  */ export interface SymbolInfo {

package/dist/blocks/symbol/symbol.js

@@ -35,7 +35,7 @@ function Symbol(props) {
     useEffect(() => {
         setContent();
     }, [props.symbol]);
-    return (React.createElement("div", { ...props.attributes, className: className() },
+    return (React.createElement("div", { ...{}, ...props.attributes, ...{}, className: className() },
         React.createElement(ContentVariants, { __isNestedRender: true, apiVersion: props.builderContext.apiVersion, apiKey: props.builderContext.apiKey, context: props.builderContext.context, customComponents: Object.values(props.builderComponents), data: {
                 ...props.symbol?.data,
                 ...props.builderContext.localState,

package/dist/blocks/text/text.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface TextProps {
     text?: string;
 }

package/dist/blocks/text/text.js

@@ -3,6 +3,6 @@ import * as React from "react";
 function Text(props) {
     return (React.createElement("span", { className: "builder-text", dangerouslySetInnerHTML: { __html: props.text?.toString() || "" }, style: {
             outline: "none",
-        } }));
+        }, ...{} }));
 }
 export default Text;

package/dist/blocks/textarea/textarea.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * This import is used by the Svelte SDK. Do not remove.
  */ export interface TextareaProps {

package/dist/blocks/textarea/textarea.js

@@ -1,6 +1,6 @@
 "use client";
 import * as React from "react";
 function Textarea(props) {
-    return (React.createElement("textarea", { ...props.attributes, placeholder: props.placeholder, name: props.name, value: props.value, defaultValue: props.defaultValue }));
+    return (React.createElement("textarea", { ...{}, ...props.attributes, placeholder: props.placeholder, name: props.name, value: props.value, defaultValue: props.defaultValue }));
 }
 export default Textarea;

package/dist/blocks/video/video.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface VideoProps {
     attributes?: any;
     video?: string;

package/dist/components/block/block.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export type BlockProps = {
     block: BuilderBlock;
     context: BuilderContextInterface;

package/dist/components/block/components/block-styles.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export type BlockStylesProps = {
     block: BuilderBlock;
     context: BuilderContextInterface;

package/dist/components/block/components/block-wrapper.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * This import is used by the Svelte SDK. Do not remove.
  */ type BlockWrapperProps = {

package/dist/components/block/components/component-ref/component-ref.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { ComponentProps } from "./component-ref.helpers.js";
 declare function ComponentRef(props: ComponentProps): JSX.Element;
 export default ComponentRef;

package/dist/components/block/components/interactive-element.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export type InteractiveElementProps = {
     Wrapper: any;
     block: BuilderBlock;

package/dist/components/block/components/repeated-block.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 type Props = {
     block: BuilderBlock;
     repeatContext: BuilderContextInterface;

package/dist/components/blocks/blocks-wrapper.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export type BlocksWrapperProps = {
     blocks: BuilderBlock[] | undefined;
     parent: string | undefined;

package/dist/components/blocks/blocks-wrapper.js

@@ -28,7 +28,7 @@ function BlocksWrapper(props) {
         }
     }
     return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: className() + " div-b2473120", "builder-path": props.path, "builder-parent-id": props.parent, style: props.styleProp, onClick: (event) => onClick(), onMouseEnter: (event) => onMouseEnter(), onKeyPress: (event) => onClick() }, props.children),
+        React.createElement("div", { className: className() + " div-b2473120", "builder-path": props.path, "builder-parent-id": props.parent, ...{}, style: props.styleProp, onClick: (event) => onClick(), onMouseEnter: (event) => onMouseEnter(), onKeyPress: (event) => onClick() }, props.children),
         React.createElement("style", null, `.div-b2473120 {
   display: flex;
   flex-direction: column;

package/dist/components/blocks/blocks.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export type BlocksProps = Partial<BlocksWrapperProps> & {
     context?: BuilderContextInterface;
     registeredComponents?: RegisteredComponents;

package/dist/components/content/components/enable-editor.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 type BuilderEditorProps = Omit<ContentProps, "customComponents" | "data" | "apiVersion" | "isSsrAbTest"> & {
     builderContextSignal: BuilderContextInterface;
     setBuilderContextSignal?: (signal: any) => any;

package/dist/components/content/components/enable-editor.js

@@ -260,7 +260,7 @@ function EnableEditor(props) {
         };
     }, []);
     return (React.createElement(builderContext.Provider, { value: props.builderContextSignal }, props.builderContextSignal.content ? (React.createElement(React.Fragment, null,
-        React.createElement("div", { key: forceReRenderCount, ref: elementRef, onClick: (event) => onClick(event), "builder-content-id": props.builderContextSignal.content?.id, "builder-model": props.model, ...(props.showContent
+        React.createElement("div", { key: forceReRenderCount, ref: elementRef, onClick: (event) => onClick(event), "builder-content-id": props.builderContextSignal.content?.id, "builder-model": props.model, ...{}, ...(props.showContent
                 ? {}
                 : {
                     hidden: true,

package/dist/components/content/components/styles.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface Props {
     cssCode?: string;
     customFonts?: CustomFont[];

package/dist/components/content/content.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { ContentProps } from "./content.types.js";
 declare function ContentComponent(props: ContentProps): JSX.Element;
 export default ContentComponent;

package/dist/components/content/content.js

@@ -73,7 +73,9 @@ function ContentComponent(props) {
     return (React.createElement(ComponentsContext.Provider, { value: {
             registeredComponents: registeredComponents,
         } },
-        React.createElement(EnableEditor, { content: props.content, model: props.model, context: props.context, apiKey: props.apiKey, canTrack: props.canTrack, locale: props.locale, includeRefs: props.includeRefs, enrich: props.enrich, classNameProp: props.classNameProp, showContent: props.showContent, builderContextSignal: builderContextSignal, setBuilderContextSignal: setBuilderContextSignal },
+        React.createElement(EnableEditor, { content: props.content, model: props.model, context: props.context, apiKey: props.apiKey, canTrack: props.canTrack, locale: props.locale, includeRefs: props.includeRefs, enrich: props.enrich, classNameProp: props.classNameProp, showContent: props.showContent, builderContextSignal: builderContextSignal, ...{
+                setBuilderContextSignal: setBuilderContextSignal,
+            } },
             props.isSsrAbTest ? (React.createElement(React.Fragment, null,
                 React.createElement(InlinedScript, { scriptStr: scriptStr }))) : null,
             TARGET !== "reactNative" ? (React.createElement(React.Fragment, null,

package/dist/components/content-variants/content-variants.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 type VariantsProviderProps = ContentVariantsProps & {
     /**
      * For internal use only. Do not provide this prop.

package/dist/components/content-variants/content-variants.js

@@ -24,6 +24,17 @@ function ContentVariants(props) {
             .map((value) => `.variant-${value.testVariationId} { display: none; } `)
             .join("");
     }
+    function defaultContent() {
+        return shouldRenderVariants
+            ? {
+                ...props.content,
+                testVariationId: props.content?.id,
+            }
+            : handleABTestingSync({
+                item: props.content,
+                canTrack: getDefaultCanTrack(props.canTrack),
+            });
+    }
     useEffect(() => {
         /**
          * We unmount the non-winning variants post-hydration in Vue.
@@ -36,11 +47,6 @@ function ContentVariants(props) {
             React.createElement(InlinedStyles, { id: `variants-styles-${props.content?.id}`, styles: hideVariantsStyleString() }),
             React.createElement(InlinedScript, { scriptStr: variantScriptStr() }),
             getVariants(props.content)?.map((variant) => (React.createElement(ContentComponent, { key: variant.testVariationId, content: variant, showContent: false, classNameProp: undefined, model: props.model, data: props.data, context: props.context, apiKey: props.apiKey, apiVersion: props.apiVersion, customComponents: props.customComponents, canTrack: props.canTrack, locale: props.locale, includeRefs: props.includeRefs, enrich: props.enrich, isSsrAbTest: shouldRenderVariants }))))) : null,
-        React.createElement(ContentComponent, { content: shouldRenderVariants
-                ? props.content
-                : handleABTestingSync({
-                    item: props.content,
-                    canTrack: getDefaultCanTrack(props.canTrack),
-                }), classNameProp: `variant-${props.content?.id}`, showContent: true, model: props.model, data: props.data, context: props.context, apiKey: props.apiKey, apiVersion: props.apiVersion, customComponents: props.customComponents, canTrack: props.canTrack, locale: props.locale, includeRefs: props.includeRefs, enrich: props.enrich, isSsrAbTest: shouldRenderVariants })));
+        React.createElement(ContentComponent, { ...{}, content: defaultContent(), classNameProp: `variant-${props.content?.id}`, showContent: true, model: props.model, data: props.data, context: props.context, apiKey: props.apiKey, apiVersion: props.apiVersion, customComponents: props.customComponents, canTrack: props.canTrack, locale: props.locale, includeRefs: props.includeRefs, enrich: props.enrich, isSsrAbTest: shouldRenderVariants })));
 }
 export default ContentVariants;

package/dist/components/inlined-script.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface Props {
     scriptStr: string;
     id?: string;

package/dist/components/inlined-styles.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface Props {
     styles: string;
     id?: string;

package/dist/constants/sdk-version.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "0.5.2";
+export declare const SDK_VERSION = "UNKNOWN_VERSION";

package/dist/constants/sdk-version.js

@@ -1 +1 @@
-export const SDK_VERSION = "0.5.2";
+export const SDK_VERSION = 'UNKNOWN_VERSION';