@developer_tribe/react-builder 1.2.31 → 1.2.33

package/src/build-components/OnboardButton/pattern.json

@@ -16,13 +16,16 @@
         "blur-line-animation"
       ],
       "animation_color": "color",
-      "flex": "number",
-      "events": "EventObject[]"
+      "events": "EventObject[]",
+      "styles": {
+        "color": "color"
+      }
     },
     "defaults": {
-      "style": {
+      "styles": {
         "height": "40@vs",
-        "borderRadius": "12@s"
+        "borderRadius": "12@s",
+        "color": "THEME_COLORS.ONBOARD_BUTTON_PRIMARY_TEXT"
       }
     }
   },
@@ -38,22 +41,6 @@
     "desiredParent": ["=OnboardButtons"],
     "label": "Onboard Button",
     "description": "Single action button for onboarding.",
-    "styles": {
-      "animation": {
-        "label": "Animation",
-        "description": "Animation style for the button.",
-        "category": "style",
-        "specialCategory": null,
-        "sort": 3
-      },
-      "animation_color": {
-        "label": "Animation Color",
-        "description": "Color used by the animation.",
-        "category": "style",
-        "specialCategory": null,
-        "sort": 4
-      }
-    },
     "attributes": {
       "labelKey": {
         "label": "Label Key",
@@ -62,19 +49,35 @@
         "specialCategory": null,
         "sort": 1
       },
-      "flex": {
-        "label": "Flex",
-        "description": "Flex grow value in layout.",
-        "category": "container",
-        "specialCategory": null,
-        "sort": 6
-      },
       "events": {
         "label": "Events",
         "description": "List of events fired by the button.",
         "category": "other",
         "specialCategory": null,
         "sort": 7
+      },
+      "animation": {
+        "label": "Animation",
+        "description": "Animation style for the button.",
+        "category": "style",
+        "specialCategory": null,
+        "sort": 3
+      },
+      "animation_color": {
+        "label": "Animation Color",
+        "description": "Color used by the animation.",
+        "category": "style",
+        "specialCategory": null,
+        "sort": 4
+      },
+      "styles": {
+        "color": {
+          "label": "Color",
+          "description": "Text color.",
+          "category": "style",
+          "specialCategory": null,
+          "sort": 1
+        }
       }
     }
   }

package/src/build-components/OnboardButtons/OnboardButtonsProps.generated.ts

@@ -65,7 +65,7 @@ export interface OnboardButtonsStyleGenerated {
 export interface OnboardButtonsPropsGenerated {
   child: string;
   attributes: {
-    style?: OnboardButtonsStyleGenerated;
+    styles?: OnboardButtonsStyleGenerated;
     scrollable?: boolean;
     buttonType?: ButtonTypeOptionType;
     skipNumber?: number;

package/src/build-components/OnboardButtons/pattern.json

@@ -16,7 +16,7 @@
       "conditionVariable": "number"
     },
     "defaults": {
-      "style": {
+      "styles": {
         "display": "flex",
         "flexDirection": "row",
         "gap": 12,

package/src/build-components/OnboardDot/OnboardDot.tsx

@@ -29,7 +29,7 @@ export function OnboardDot({ node }: OnboardDotComponentProps) {
   const {
     previewMode,
     selectedKey,
-    mockTheme: theme,
+    selectedTheme: theme,
     projectColors,
     baseSize,
   } = useBuilderParams();

package/src/build-components/OnboardDot/OnboardDotProps.generated.ts

@@ -66,7 +66,7 @@ export interface OnboardDotStyleGenerated {
 export interface OnboardDotPropsGenerated {
   child: string;
   attributes: {
-    style?: OnboardDotStyleGenerated;
+    styles?: OnboardDotStyleGenerated;
     scrollable?: boolean;
     dotType?: DotTypeOptionType;
     dot_thickness?: string;

package/src/build-components/OnboardDot/pattern.json

@@ -30,7 +30,7 @@
     "inactive_dot_opacity": 0.3,
     "active_dot_color": "STATIC_COLORS.ONBOARD_DOT_ACTIVE",
     "inactive_dot_color": "THEME_COLORS.BACKGROUND",
-    "style": {
+    "styles": {
       "flexDirection": "row",
       "alignItems": "center",
       "justifyContent": "center",

package/src/build-components/OnboardFooter/OnboardFooter.tsx

@@ -97,15 +97,15 @@ function OnboardFooter({ node }: OnboardFooterComponentProps) {
   const attributeName = node.sourceType ?? node.type ?? 'OnboardFooter';
   const {
     localization: builderLocalization,
-    theme,
-    defaultLanguage,
+    selectedTheme: theme,
+    selectedLanguage,
     previewMode,
     selectedKey,
     projectColors: builderProjectColors,
   } = useBuilderParams();
   const localization = builderLocalization ?? defaultLocalization;
   const projectColors = builderProjectColors;
-  const lang = defaultLanguage ?? 'en';
+  const lang = selectedLanguage ?? 'en';
   const t = (key?: string) => (key ? (localization?.[lang]?.[key] ?? key) : '');
 
   const attrs = node?.attributes;

package/src/build-components/OnboardFooter/OnboardFooterProps.generated.ts

@@ -63,7 +63,7 @@ export interface OnboardFooterStyleGenerated {
 export interface OnboardFooterPropsGenerated {
   child: string;
   attributes: {
-    style?: OnboardFooterStyleGenerated;
+    styles?: OnboardFooterStyleGenerated;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     translateCounter?: number;

package/src/build-components/OnboardFooter/pattern.json

@@ -17,7 +17,7 @@
     }
   },
   "defaults": {
-    "style": {
+    "styles": {
       "flexDirection": "row",
       "flexWrap": "wrap",
       "alignItems": "center",

package/src/build-components/OnboardImage/OnboardImageProps.generated.ts

@@ -61,7 +61,7 @@ export interface OnboardImageStyleGenerated {
 export interface OnboardImagePropsGenerated {
   child: string;
   attributes: {
-    style?: OnboardImageStyleGenerated;
+    styles?: OnboardImageStyleGenerated;
     src?: string;
     scrollable?: boolean;
     video_url?: string;

package/src/build-components/OnboardItem/OnboardItemProps.generated.ts

@@ -60,7 +60,7 @@ export interface OnboardItemStyleGenerated {
 export interface OnboardItemPropsGenerated {
   child: string;
   attributes: {
-    style?: OnboardItemStyleGenerated;
+    styles?: OnboardItemStyleGenerated;
     scrollable?: boolean;
     display?: DisplayOptionType;
     gap?: string;

package/src/build-components/OnboardItem/pattern.json

@@ -15,7 +15,7 @@
   },
   "defaults": {
     "display": "flex",
-    "style": {
+    "styles": {
       "gap": "16@vs",
       "flexDirection": "column",
       "paddingHorizontal": "24@s"

package/src/build-components/OnboardProvider/OnboardProviderProps.generated.ts

@@ -60,7 +60,7 @@ export interface OnboardProviderStyleGenerated {
 export interface OnboardProviderPropsGenerated {
   child: string;
   attributes: {
-    style?: OnboardProviderStyleGenerated;
+    styles?: OnboardProviderStyleGenerated;
     scrollable?: boolean;
     theme?: ThemeOptionType;
     borderRadius?: never;

package/src/build-components/OnboardProvider/pattern.json

@@ -12,7 +12,7 @@
     }
   },
   "defaults": {
-    "style": {
+    "styles": {
       "width": "100%",
       "height": "100%"
     }

package/src/build-components/OnboardSubtitle/OnboardSubtitleProps.generated.ts

@@ -63,7 +63,7 @@ export interface OnboardSubtitleStyleGenerated {
 export interface OnboardSubtitlePropsGenerated {
   child: string;
   attributes: {
-    style?: OnboardSubtitleStyleGenerated;
+    styles?: OnboardSubtitleStyleGenerated;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     translateCounter?: number;

package/src/build-components/OnboardSubtitle/pattern.json

@@ -8,7 +8,7 @@
     "extends": "Text"
   },
   "defaults": {
-    "style": {
+    "styles": {
       "fontSize": "14@fs",
       "fontWeight": "600"
     }

package/src/build-components/OnboardTitle/OnboardTitleProps.generated.ts

@@ -63,7 +63,7 @@ export interface OnboardTitleStyleGenerated {
 export interface OnboardTitlePropsGenerated {
   child: string;
   attributes: {
-    style?: OnboardTitleStyleGenerated;
+    styles?: OnboardTitleStyleGenerated;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     translateCounter?: number;

package/src/build-components/OnboardTitle/pattern.json

@@ -8,7 +8,7 @@
     "extends": "Text"
   },
   "defaults": {
-    "style": {
+    "styles": {
       "fontSize": "24@fs",
       "fontWeight": "700",
       "textAlign": "center"

package/src/build-components/PaywallBackground/PaywallBackgroundProps.generated.ts

@@ -60,7 +60,7 @@ export interface PaywallBackgroundStyleGenerated {
 export interface PaywallBackgroundPropsGenerated {
   child: string;
   attributes: {
-    style?: PaywallBackgroundStyleGenerated;
+    styles?: PaywallBackgroundStyleGenerated;
     src?: string;
     resizeMode?: ResizeModeOptionType;
     scrollable?: boolean;

package/src/build-components/PaywallBackground/pattern.json

@@ -8,7 +8,7 @@
     "extends": "BackgroundImage",
     "defaults": {
       "resizeMode": "cover",
-      "style": {
+      "styles": {
         "width": "100%",
         "height": "100%",
         "position": "absolute",

package/src/build-components/PaywallCloseButton/PaywallCloseButton.tsx

@@ -40,7 +40,7 @@ export function PaywallCloseButton({ node }: PaywallCloseButtonComponentProps) {
   }
 
   const attrs = node.attributes;
-  const styleBag = attrs?.style;
+  const styleBag = attrs?.styles;
   const iconType = attrs?.iconType ?? 'close';
   const size = attrs?.size ?? (textStyle.fontSize as number | undefined) ?? 24;
   const color =

package/src/build-components/PaywallCloseButton/PaywallCloseButtonProps.generated.ts

@@ -63,7 +63,7 @@ export interface PaywallCloseButtonStyleGenerated {
 export interface PaywallCloseButtonPropsGenerated {
   child: string;
   attributes: {
-    style?: PaywallCloseButtonStyleGenerated;
+    styles?: PaywallCloseButtonStyleGenerated;
     iconType?: string;
     size?: number;
     strokeWidth?: number;

package/src/build-components/PaywallCloseButton/pattern.json

@@ -16,7 +16,7 @@
   "defaults": {
     "iconType": "close",
     "size": 24,
-    "style": {
+    "styles": {
       "position": "absolute",
       "top": "35@vs",
       "left": "24@s",

package/src/build-components/PaywallOptions/PaywallOptionsProps.generated.ts

@@ -59,7 +59,7 @@ export interface PaywallOptionsStyleGenerated {
 export interface PaywallOptionsPropsGenerated {
   child: string;
   attributes: {
-    style?: PaywallOptionsStyleGenerated;
+    styles?: PaywallOptionsStyleGenerated;
     scrollable?: boolean;
   };
 }

package/src/build-components/PaywallOptions/pattern.json

@@ -14,7 +14,7 @@
     "styles": {}
   },
   "defaults": {
-    "style": {
+    "styles": {
       "flexDirection": "row",
       "justifyContent": "space-between",
       "alignItems": "center",

package/src/build-components/PaywallProvider/PaywallProviderProps.generated.ts

@@ -59,7 +59,7 @@ export interface PaywallProviderStyleGenerated {
 export interface PaywallProviderPropsGenerated {
   child: string;
   attributes: {
-    style?: PaywallProviderStyleGenerated;
+    styles?: PaywallProviderStyleGenerated;
     scrollable?: boolean;
     delay?: number;
   };

package/src/build-components/PaywallProvider/pattern.json

@@ -11,7 +11,7 @@
     }
   },
   "defaults": {
-    "style": {
+    "styles": {
       "width": "100%",
       "height": "100%"
     }

package/src/build-components/PaywallSubscribeButton/PaywallSubscribeButtonProps.generated.ts

@@ -74,7 +74,7 @@ export interface PaywallSubscribeButtonStyleGenerated {
 export interface PaywallSubscribeButtonPropsGenerated {
   child: string;
   attributes: {
-    style?: PaywallSubscribeButtonStyleGenerated;
+    styles?: PaywallSubscribeButtonStyleGenerated;
     scrollable?: boolean;
   };
 }

package/src/build-components/PaywallSubscribeButton/pattern.json

@@ -8,7 +8,7 @@
     "extends": "Button"
   },
   "defaults": {
-    "style": {
+    "styles": {
       "paddingHorizontal": "20@s",
       "paddingVertical": "12@vs",
       "borderRadius": "12@s",

package/src/build-components/PriceTag/PriceTagProps.generated.ts

@@ -68,7 +68,7 @@ export interface PriceTagStyleGenerated {
 export interface PriceTagPropsGenerated {
   child: string;
   attributes: {
-    style?: PriceTagStyleGenerated;
+    styles?: PriceTagStyleGenerated;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     translateCounter?: number;

package/src/build-components/PriceTag/pattern.json

@@ -9,13 +9,13 @@
     "attributes": {
       "showOriginalPricePossible": "boolean",
       "hideIfItsNotDiscount": "boolean",
-      "style": {
+      "styles": {
         "textDecorationLine": ["none", "underline", "line-through"]
       }
     }
   },
   "defaults": {
-    "style": {
+    "styles": {
       "fontSize": "16@fs",
       "fontWeight": "700"
     }

package/src/build-components/Pricing/PricingProps.generated.ts

@@ -63,7 +63,7 @@ export interface PricingStyleGenerated {
 export interface PricingPropsGenerated {
   child: string;
   attributes: {
-    style?: PricingStyleGenerated;
+    styles?: PricingStyleGenerated;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     translateCounter?: number;

package/src/build-components/Pricing/pattern.json

@@ -9,7 +9,7 @@
   },
   "defaults": {
     "translateCounter": 2,
-    "style": {
+    "styles": {
       "textAlign": "center",
       "fontSize": "12@fs",
       "fontWeight": "400",

package/src/build-components/Promo/PromoProps.generated.ts

@@ -63,7 +63,7 @@ export interface PromoStyleGenerated {
 export interface PromoPropsGenerated {
   child: string;
   attributes: {
-    style?: PromoStyleGenerated;
+    styles?: PromoStyleGenerated;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     translateCounter?: number;

package/src/build-components/Promo/pattern.json

@@ -9,7 +9,7 @@
   },
   "defaults": {
     "translateCounter": 2,
-    "style": {
+    "styles": {
       "textAlign": "center",
       "fontSize": "12@fs",
       "fontWeight": "600",

package/src/build-components/RadioButton/RadioButtonProps.generated.ts

@@ -59,7 +59,7 @@ export interface RadioButtonStyleGenerated {
 export interface RadioButtonPropsGenerated {
   child: string;
   attributes: {
-    style?: RadioButtonStyleGenerated;
+    styles?: RadioButtonStyleGenerated;
     scrollable?: boolean;
     selected?: boolean;
     color?: string;

package/src/build-components/Separator/SeparatorProps.generated.ts

@@ -15,7 +15,7 @@ export interface SeparatorStyleGenerated {
 export interface SeparatorPropsGenerated {
   child: string;
   attributes: {
-    style?: SeparatorStyleGenerated;
+    styles?: SeparatorStyleGenerated;
   };
 }
 

package/src/build-components/Separator/pattern.json

@@ -6,7 +6,7 @@
     "description": "description",
     "children": "never",
     "attributes": {
-      "style": {
+      "styles": {
         "backgroundColor": "color",
         "width": "size",
         "height": "size",
@@ -50,7 +50,7 @@
     }
   },
   "defaults": {
-    "style": {
+    "styles": {
       "width": "100%",
       "height": 2,
       "backgroundColor": "#000000"

package/src/build-components/StatusBarColor/StatusBarColor.tsx

@@ -11,7 +11,7 @@ function StatusBarColor({ node }: StatusBarColorComponentProps) {
   useLogRender('StatusBarColor');
   node = useNode(node);
 
-  const { theme, projectColors } = useBuilderParams();
+  const { selectedTheme: theme, projectColors } = useBuilderParams();
   const setStatusBarOverrideColor = useRenderStore(
     (s) => s.setStatusBarOverrideColor,
   );

package/src/build-components/StatusBarColor/StatusBarColorProps.generated.ts

@@ -59,7 +59,7 @@ export interface StatusBarColorStyleGenerated {
 export interface StatusBarColorPropsGenerated {
   child: string;
   attributes: {
-    style?: StatusBarColorStyleGenerated;
+    styles?: StatusBarColorStyleGenerated;
     scrollable?: boolean;
   };
 }

package/src/build-components/StatusBarColor/pattern.json

@@ -7,7 +7,7 @@
     "children": "never",
     "extends": "View",
     "attributes": {
-      "style": {
+      "styles": {
         "backgroundColor": "color"
       }
     }
@@ -27,7 +27,7 @@
     }
   },
   "defaults": {
-    "style": {
+    "styles": {
       "backgroundColor": "THEME_COLORS.BACKGROUND"
     }
   }

package/src/build-components/Text/Text.tsx

@@ -39,7 +39,7 @@ export function Text({ node }: TextComponentProps) {
     //Optimzation trade off by readability: could avoid dict lookup on subsequent passes
   }, [localize, keyOrText, translateCounter]);
 
-  const styleBag = node.attributes?.style as unknown as
+  const styleBag = node.attributes?.styles as unknown as
     | { adjustsFontSizeToFit?: boolean; showEllipsis?: boolean }
     | undefined;
   const adjustsFontSizeToFit = styleBag?.adjustsFontSizeToFit ?? false;

package/src/build-components/Text/TextProps.generated.ts

@@ -63,7 +63,7 @@ export interface TextStyleGenerated {
 export interface TextPropsGenerated {
   child: string;
   attributes: {
-    style?: TextStyleGenerated;
+    styles?: TextStyleGenerated;
     scrollable?: boolean;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;

package/src/build-components/Text/pattern.json

@@ -10,7 +10,7 @@
       "adjustsFontSizeToFit": "boolean",
       "showEllipsis": "boolean",
       "translateCounter": "number",
-      "style": {
+      "styles": {
         "color": "color",
         "fontSize": "size",
         "fontFamily": "fontFamily",
@@ -19,7 +19,7 @@
     },
     "defaults": {
       "translateCounter": 1,
-      "style": {
+      "styles": {
         "color": "THEME_COLORS.TEXT",
         "fontSize": "16@fs",
         "fontWeight": "400"

package/src/build-components/View/ViewProps.generated.ts

@@ -59,7 +59,7 @@ export interface ViewStyleGenerated {
 export interface ViewPropsGenerated {
   child: string;
   attributes: {
-    style?: ViewStyleGenerated;
+    styles?: ViewStyleGenerated;
     scrollable?: boolean;
   };
 }

package/src/build-components/View/pattern.json

@@ -7,7 +7,7 @@
     "children": "node",
     "attributes": {
       "scrollable": "boolean",
-      "style": {
+      "styles": {
         "flexDirection": ["row", "column"],
         "flexWrap": ["nowrap", "wrap", "wrap-reverse"],
         "alignItems": [
@@ -365,7 +365,7 @@
     }
   },
   "defaults": {
-    "style": {
+    "styles": {
       "flexDirection": "column",
       "position": "relative",
       "zIndex": 1,