npm - @builder.io/sdk-react-native - Versions diffs - 2.0.1 → 2.0.3 - Mend

@builder.io/sdk-react-native 2.0.1 → 2.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (345) hide show

package/src/blocks/columns/columns.tsx CHANGED Viewed

@@ -9,6 +9,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState } from "react";
@@ -112,6 +115,7 @@ function Columns(props: ColumnProps) {
   }
   function columnsStyles() {
+    const childColumnDiv = `.${props.builderBlock.id}-breakpoints > .builder-column`;
     return `
         @media (max-width: ${getWidthForBreakpointSize("medium")}px) {
           .${props.builderBlock.id}-breakpoints {
@@ -119,7 +123,7 @@ function Columns(props: ColumnProps) {
             align-items: stretch;
           }
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-tablet) !important;
             margin-left: var(--column-margin-left-tablet) !important;
           }
@@ -131,7 +135,7 @@ function Columns(props: ColumnProps) {
             align-items: stretch;
           }
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-mobile) !important;
             margin-left: var(--column-margin-left-mobile) !important;
           }

package/src/blocks/custom-code/custom-code.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState, useRef, useEffect } from "react";

package/src/blocks/embed/embed.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState, useRef, useEffect } from "react";

package/src/blocks/form/form/form.tsx CHANGED Viewed

@@ -9,6 +9,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState, useRef } from "react";

package/src/blocks/form/input/input.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 /**

package/src/blocks/form/select/select.tsx CHANGED Viewed

@@ -9,6 +9,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 /**

package/src/blocks/form/submit-button/submit-button.tsx CHANGED Viewed

@@ -9,6 +9,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 /**
@@ -25,9 +28,9 @@ import { setAttrs } from "../../helpers";
 function SubmitButton(props: ButtonProps) {
   return (
-    <View type="submit" {...{}} {...props.attributes}>
+    <Button type="submit" {...{}} {...props.attributes}>
       <BaseText>{props.text}</BaseText>
-    </View>
+    </Button>
   );
 }

package/src/blocks/form/textarea/textarea.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 /**

package/src/blocks/fragment/fragment.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import type { FragmentProps } from "./fragment.types";

package/src/blocks/img/img.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 /**
@@ -38,14 +41,14 @@ import { setAttrs } from "../helpers";
 function ImgComponent(props: ImgProps) {
   return (
-    <View
+    <Image
       style={{
         objectFit: props.backgroundSize || "cover",
         objectPosition: props.backgroundPosition || "center",
       }}
       key={(isEditing() && props.imgSrc) || "default-key"}
       alt={props.altText}
-      src={props.imgSrc || props.image}
+      source={{ uri: props.imgSrc || props.image }}
       {...{}}
       {...props.attributes}
     />

package/src/blocks/section/section.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { filterAttrs } from "../helpers";
 import type { SectionProps } from "./section.types";

package/src/blocks/slot/slot.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 export type DropzoneProps = BuilderDataProps & {

package/src/blocks/symbol/symbol.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState, useEffect } from "react";
 import ContentVariants from "../../components/content-variants/index";

package/src/blocks/tabs/tabs.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState } from "react";
 import Blocks from "../../components/blocks/blocks";

package/src/components/block/block.tsx CHANGED Viewed

@@ -9,6 +9,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useEffect } from "react";

package/src/components/block/components/block-styles.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 export type BlockStylesProps = {

package/src/components/block/components/block-wrapper.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 type BlockWrapperProps = {

package/src/components/block/components/component-ref/component-ref.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState, useContext } from "react";
 import { wrapComponentRef } from "../../../content/wrap-component-ref";

package/src/components/block/components/interactive-element.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 export type InteractiveElementProps = {

package/src/components/block/components/repeated-block.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState, useContext } from "react";

package/src/components/blocks/blocks-wrapper.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 export type BlocksWrapperProps = {

package/src/components/blocks/blocks.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useContext } from "react";
 import BuilderContext from "../../context/builder.context";

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

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState, useContext, useRef, useEffect } from "react";

package/src/components/content/components/styles.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState } from "react";

package/src/components/content/content.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState, useContext } from "react";
 import { getDefaultRegisteredComponents } from "../../constants/builder-registered-components";
@@ -54,7 +57,11 @@ function ContentComponent(props: ContentProps) {
   const [registeredComponents, setRegisteredComponents] = useState(() =>
     [
       ...getDefaultRegisteredComponents(),
-      ...(props.customComponents || []),
+      ...(props.customComponents?.filter(({ models }) => {
+        if (!models?.length) return true;
+        if (!props.model) return true;
+        return models.includes(props.model);
+      }) || []),
     ].reduce<RegisteredComponents>(
       (acc, { component, ...info }) => ({
         ...acc,
@@ -85,7 +92,11 @@ function ContentComponent(props: ContentProps) {
     apiVersion: props.apiVersion,
     componentInfos: [
       ...getDefaultRegisteredComponents(),
-      ...(props.customComponents || []),
+      ...(props.customComponents?.filter(({ models }) => {
+        if (!models?.length) return true;
+        if (!props.model) return true;
+        return models.includes(props.model);
+      }) || []),
     ].reduce<Dictionary<ComponentInfo>>(
       (acc, { component: _, ...info }) => ({
         ...acc,

package/src/components/content-variants/content-variants.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 import { useState, useEffect } from "react";
@@ -73,8 +76,6 @@ function ContentVariants(props: VariantsProviderProps) {
      */
   }, []);
-  useEffect(() => {});
   return (
     <>
       {!props.isNestedRender && TARGET !== "reactNative" ? (

package/src/components/dynamic-div.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 export interface DynamicDivProps {

package/src/components/dynamic-renderer/dynamic-renderer.tsx CHANGED Viewed

@@ -8,6 +8,9 @@ import {
   Text,
   Pressable,
   TextInput,
+  TouchableOpacity,
+  Button,
+  Linking,
 } from "react-native";
 export interface DynamicRendererProps {

package/src/constants/sdk-version.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export const SDK_VERSION = "2.0.1"
1	+ export const SDK_VERSION = "2.0.3"

package/src/functions/register-component.ts CHANGED Viewed

@@ -1,6 +1,4 @@
 import type { ComponentInfo } from '../types/components';
-import type { Input } from '../types/input';
-import { fastClone } from './fast-clone';
 export const createRegisterComponentMessage = (info: ComponentInfo) => ({
   type: 'builder.registerComponent',
   data: serializeComponentInfo(info)
@@ -17,14 +15,11 @@ const serializeFn = (fnValue: Function) => {
   const appendFunction = !fnStr.startsWith('function') && !fnStr.startsWith('(');
   return `return (${appendFunction ? 'function ' : ''}${fnStr}).apply(this, arguments)`;
 };
-const serializeValue = (value: object): any => typeof value === 'function' ? serializeFn(value) : fastClone(value);
-export const serializeComponentInfo = ({
-  inputs,
-  ...info
-}: ComponentInfo): ComponentInfo => ({
-  ...fastClone(info),
-  inputs: inputs?.map(input => Object.entries(input).reduce((acc, [key, value]) => ({
-    ...acc,
-    [key]: serializeValue(value)
-  }), ({} as Input)))
-})
+export function serializeComponentInfo(info: ComponentInfo) {
+  return JSON.parse(JSON.stringify(info, (key, value) => {
+    if (typeof value === 'function') {
+      return serializeFn(value);
+    }
+    return value;
+  }));
+}