@developer_tribe/react-builder 1.2.35 → 1.2.36

package/src/build-components/BIcon/BIconProps.generated.ts

@@ -24,6 +24,7 @@ export interface BIconStyleGenerated {
   fontSize?: string;
   fontFamily?: string;
   fontWeight?: string;
+  textAlign?: string;
   flexDirection?: FlexDirectionOptionType;
   flexWrap?: FlexWrapOptionType;
   alignItems?: AlignItemsOptionType;

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

@@ -27,15 +27,7 @@
     "desiredParent": ["all", "background"],
     "label": "Background Image",
     "description": "Background image.",
-    "styles": {
-      "resizeMode": {
-        "label": "Resize Mode",
-        "description": "How the image fits its container.",
-        "category": "style",
-        "specialCategory": null,
-        "sort": 4
-      }
-    },
+    "styles": {},
     "attributes": {
       "src": {
         "label": "Src",
@@ -43,6 +35,13 @@
         "category": "other",
         "specialCategory": null,
         "sort": 1
+      },
+      "resizeMode": {
+        "label": "Resize Mode",
+        "description": "How the image fits its container.",
+        "category": "other",
+        "specialCategory": null,
+        "sort": 4
       }
     }
   },

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

@@ -74,5 +74,3 @@ export function Button({ node }: ButtonComponentProps) {
     </a>
   );
 }
-
-export default React.memo(Button);

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

@@ -134,7 +134,7 @@ function CarouselDots({ node }: CarouselDotsComponentProps) {
             style={{
               width: dotSize,
               height: dotSize,
-              backgroundColor: dotColor,
+              backgroundColor: dotColor ?? undefined,
               opacity: isDotSelected ? 1 : inactiveDotOpacity,
               borderRadius: '9999px',
               border: 0,

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

@@ -32,7 +32,7 @@
     "desiredParent": [">CarouselProvider"],
     "label": "Carousel Dots",
     "description": "Renders page indicator dots.",
-    "styles": {
+    "attributes": {
       "dotType": {
         "label": "Dot Type",
         "description": "Style used for the dots.",

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

@@ -23,5 +23,3 @@ export function CarouselItem({ node }: CarouselItemComponentProps) {
     </div>
   );
 }
-
-export default React.memo(CarouselItem);

package/src/build-components/CountDown/CountDownProps.generated.ts

@@ -24,6 +24,7 @@ export interface CountDownStyleGenerated {
   fontSize?: string;
   fontFamily?: string;
   fontWeight?: string;
+  textAlign?: never;
   flexDirection?: FlexDirectionOptionType;
   flexWrap?: FlexWrapOptionType;
   alignItems?: AlignItemsOptionType;
@@ -58,7 +59,6 @@ export interface CountDownStyleGenerated {
   left?: string;
   right?: string;
   zIndex?: number;
-  textAlign?: never;
 }
 
 export interface CountDownPropsGenerated {

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

@@ -11,7 +11,6 @@ import { useExtractViewStyle } from '../../attribute-analyser/style/web/useExtra
 import { useMockOSContext, useMockPermission } from '../../mockOS';
 import { useLocalize } from '../../hooks/useLocalize';
 import { parseColor } from '../../utils/parseColor';
-import { getStyleBag, toAttributeRecord } from '../../utils/attributeStyle';
 
 export function OnboardButton({ node }: OnboardButtonComponentProps) {
   useLogRender('OnboardButton');
@@ -76,7 +75,7 @@ export function OnboardButton({ node }: OnboardButtonComponentProps) {
       onClick={handleClick}
       style={{
         ...viewStyle,
-        color: textColor,
+        color: textColor ?? undefined,
         border: 'none',
         display: 'flex',
         justifyContent: 'center',
@@ -87,5 +86,3 @@ export function OnboardButton({ node }: OnboardButtonComponentProps) {
     </button>
   );
 }
-
-export default React.memo(OnboardButton);

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

@@ -31,16 +31,14 @@
     "desiredParent": ["=OnboardItem"],
     "label": "Onboard Buttons",
     "description": "Wrapper for onboarding button set.",
-    "styles": {
+    "attributes": {
       "seperatorColor": {
         "label": "Seperator Color",
         "description": "Color of the divider line.",
         "category": "style",
         "specialCategory": null,
         "sort": 5
-      }
-    },
-    "attributes": {
+      },
       "buttonType": {
         "label": "Button Type",
         "description": "Which onboard button to show.",

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

@@ -162,5 +162,3 @@ export function OnboardDot({ node }: OnboardDotComponentProps) {
     </div>
   );
 }
-
-export default React.memo(OnboardDot);

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

@@ -80,4 +80,3 @@
     }
   }
 }
- 

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

@@ -164,12 +164,12 @@ function OnboardFooter({ node }: OnboardFooterComponentProps) {
           const { segments, matchCount } = buildSegments(text, [
             {
               value: firstText,
-              color: parsedFirstColor,
+              color: parsedFirstColor ?? undefined,
               page: attrs?.linkedWordFirstPage,
             },
             {
               value: secondText,
-              color: parsedSecondColor,
+              color: parsedSecondColor ?? undefined,
               page: attrs?.linkedWordSecondPage,
             },
           ]);
@@ -204,7 +204,7 @@ function OnboardFooter({ node }: OnboardFooterComponentProps) {
                     <span
                       style={{
                         ...mergedTextStyle,
-                        color: parsedFirstColor,
+                        color: parsedFirstColor ?? undefined,
                       }}
                       onClick={() => handleClick(attrs?.linkedWordFirstPage)}
                     >
@@ -215,7 +215,7 @@ function OnboardFooter({ node }: OnboardFooterComponentProps) {
                     <span
                       style={{
                         ...mergedTextStyle,
-                        color: parsedSecondColor,
+                        color: parsedSecondColor ?? undefined,
                       }}
                       onClick={() => handleClick(attrs?.linkedWordSecondPage)}
                     >

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

@@ -24,6 +24,7 @@ export interface OnboardFooterStyleGenerated {
   fontSize?: string;
   fontFamily?: string;
   fontWeight?: string;
+  textAlign?: string;
   flexDirection?: FlexDirectionOptionType;
   flexWrap?: FlexWrapOptionType;
   alignItems?: AlignItemsOptionType;

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

@@ -63,9 +63,6 @@ export interface OnboardItemPropsGenerated {
     styles?: OnboardItemStyleGenerated;
     scrollable?: boolean;
     display?: DisplayOptionType;
-    gap?: string;
-    flexDirection?: FlexDirectionOptionType;
-    paddingHorizontal?: string;
   };
 }
 

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

@@ -8,9 +8,11 @@
     "extends": "View",
     "attributes": {
       "display": ["flex", "block"],
-      "gap": "size",
-      "flexDirection": ["row", "column"],
-      "paddingHorizontal": "size"
+      "styles": {
+        "gap": "size",
+        "flexDirection": ["row", "column"],
+        "paddingHorizontal": "size"
+      }
     }
   },
   "defaults": {
@@ -34,26 +36,28 @@
         "specialCategory": null,
         "sort": 1
       },
-      "gap": {
-        "label": "Gap",
-        "description": "Space between child blocks.",
-        "category": "container",
-        "specialCategory": null,
-        "sort": 2
-      },
-      "flexDirection": {
-        "label": "Flex Direction",
-        "description": "Order of child stacking.",
-        "category": "container",
-        "specialCategory": null,
-        "sort": 3
-      },
-      "paddingHorizontal": {
-        "label": "Padding Horizontal",
-        "description": "Left and right padding.",
-        "category": "container",
-        "specialCategory": "padding",
-        "sort": 4
+      "styles": {
+        "gap": {
+          "label": "Gap",
+          "description": "Space between child blocks.",
+          "category": "container",
+          "specialCategory": null,
+          "sort": 2
+        },
+        "flexDirection": {
+          "label": "Flex Direction",
+          "description": "Order of child stacking.",
+          "category": "container",
+          "specialCategory": null,
+          "sort": 3
+        },
+        "paddingHorizontal": {
+          "label": "Padding Horizontal",
+          "description": "Left and right padding.",
+          "category": "container",
+          "specialCategory": "padding",
+          "sort": 4
+        }
       }
     }
   }

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

@@ -30,33 +30,35 @@
         "specialCategory": null,
         "sort": -10
       },
-      "paddingTop": {
-        "label": "Padding Top",
-        "description": "Top padding for the provider.",
-        "category": "container",
-        "specialCategory": "padding",
-        "sort": 1
-      },
-      "paddingRight": {
-        "label": "Padding Right",
-        "description": "Right padding for the provider.",
-        "category": "container",
-        "specialCategory": "padding",
-        "sort": 2
-      },
-      "paddingBottom": {
-        "label": "Padding Bottom",
-        "description": "Bottom padding for the provider.",
-        "category": "container",
-        "specialCategory": "padding",
-        "sort": 3
-      },
-      "paddingLeft": {
-        "label": "Padding Left",
-        "description": "Left padding for the provider.",
-        "category": "container",
-        "specialCategory": "padding",
-        "sort": 4
+      "styles": {
+        "paddingTop": {
+          "label": "Padding Top",
+          "description": "Top padding for the provider.",
+          "category": "container",
+          "specialCategory": "padding",
+          "sort": 1
+        },
+        "paddingRight": {
+          "label": "Padding Right",
+          "description": "Right padding for the provider.",
+          "category": "container",
+          "specialCategory": "padding",
+          "sort": 2
+        },
+        "paddingBottom": {
+          "label": "Padding Bottom",
+          "description": "Bottom padding for the provider.",
+          "category": "container",
+          "specialCategory": "padding",
+          "sort": 3
+        },
+        "paddingLeft": {
+          "label": "Padding Left",
+          "description": "Left padding for the provider.",
+          "category": "container",
+          "specialCategory": "padding",
+          "sort": 4
+        }
       }
     }
   }

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

@@ -24,6 +24,7 @@ export interface OnboardSubtitleStyleGenerated {
   fontSize?: string;
   fontFamily?: string;
   fontWeight?: string;
+  textAlign?: string;
   flexDirection?: FlexDirectionOptionType;
   flexWrap?: FlexWrapOptionType;
   alignItems?: AlignItemsOptionType;

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

@@ -24,6 +24,7 @@ export interface OnboardTitleStyleGenerated {
   fontSize?: string;
   fontFamily?: string;
   fontWeight?: string;
+  textAlign?: string;
   flexDirection?: FlexDirectionOptionType;
   flexWrap?: FlexWrapOptionType;
   alignItems?: AlignItemsOptionType;

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

@@ -63,5 +63,3 @@ export function PaywallCloseButton({ node }: PaywallCloseButtonComponentProps) {
     </a>
   );
 }
-
-export default React.memo(PaywallCloseButton);

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

@@ -24,6 +24,7 @@ export interface PaywallCloseButtonStyleGenerated {
   fontSize?: string;
   fontFamily?: string;
   fontWeight?: string;
+  textAlign?: string;
   flexDirection?: FlexDirectionOptionType;
   flexWrap?: FlexWrapOptionType;
   alignItems?: AlignItemsOptionType;

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

@@ -28,6 +28,7 @@ export interface PriceTagStyleGenerated {
   fontSize?: string;
   fontFamily?: string;
   fontWeight?: string;
+  textAlign?: string;
   flexDirection?: FlexDirectionOptionType;
   flexWrap?: FlexWrapOptionType;
   alignItems?: AlignItemsOptionType;

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

@@ -24,6 +24,7 @@ export interface PricingStyleGenerated {
   fontSize?: string;
   fontFamily?: string;
   fontWeight?: string;
+  textAlign?: string;
   flexDirection?: FlexDirectionOptionType;
   flexWrap?: FlexWrapOptionType;
   alignItems?: AlignItemsOptionType;

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

@@ -24,6 +24,7 @@ export interface PromoStyleGenerated {
   fontSize?: string;
   fontFamily?: string;
   fontWeight?: string;
+  textAlign?: string;
   flexDirection?: FlexDirectionOptionType;
   flexWrap?: FlexWrapOptionType;
   alignItems?: AlignItemsOptionType;

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

@@ -16,7 +16,7 @@
     "desiredParent": ["all"],
     "label": "Radio Button",
     "description": "Generic radio button icon.",
-    "styles": {
+    "attributes": {
       "color": {
         "label": "Color",
         "description": "Radio color.",
@@ -30,9 +30,7 @@
         "category": "style",
         "specialCategory": null,
         "sort": 2
-      }
-    },
-    "attributes": {
+      },
       "selected": {
         "label": "Selected",
         "description": "Whether the radio is selected.",

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

@@ -21,31 +21,31 @@
     "desiredParent": ["all"],
     "label": "Separator",
     "description": "Horizontal line separator.",
-    "styles": {
-      "backgroundColor": {
-        "label": "Color",
-        "description": "Separator line color.",
-        "category": "style",
-        "specialCategory": null,
-        "sort": 1
-      }
-    },
     "attributes": {
-      "width": {
-        "label": "Width",
-        "description": "Separator width.",
-        "category": "container",
-        "specialCategory": null,
-        "sort": 1,
-        "preferredScale": "s"
-      },
-      "height": {
-        "label": "Height",
-        "description": "Separator thickness.",
-        "category": "container",
-        "specialCategory": null,
-        "sort": 2,
-        "preferredScale": "vs"
+      "styles": {
+        "backgroundColor": {
+          "label": "Color",
+          "description": "Separator line color.",
+          "category": "style",
+          "specialCategory": null,
+          "sort": 1
+        },
+        "width": {
+          "label": "Width",
+          "description": "Separator width.",
+          "category": "container",
+          "specialCategory": null,
+          "sort": 1,
+          "preferredScale": "s"
+        },
+        "height": {
+          "label": "Height",
+          "description": "Separator thickness.",
+          "category": "container",
+          "specialCategory": null,
+          "sort": 2,
+          "preferredScale": "vs"
+        }
       }
     }
   },

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

@@ -58,6 +58,7 @@ export interface TextStyleGenerated {
   fontSize?: string;
   fontFamily?: string;
   fontWeight?: string;
+  textAlign?: string;
 }
 
 export interface TextPropsGenerated {

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

@@ -14,7 +14,8 @@
         "color": "color",
         "fontSize": "size",
         "fontFamily": "fontFamily",
-        "fontWeight": "fontWeight"
+        "fontWeight": "fontWeight",
+        "textAlign": "string"
       }
     },
     "defaults": {