@developer_tribe/react-builder 1.2.23 → 1.2.25

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

@@ -2,17 +2,26 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "OnboardButtons",
+    "title": "title",
+    "description": "description",
     "children": "node",
     "extends": "View",
     "attributes": {
-      "title": "title",
-      "description": "description",
-      "buttonType": ["previous_button", "next_button", "skip_button"],
+      "buttonType": [
+        "previous_button",
+        "next_button",
+        "skip_button"
+      ],
       "skipNumber": "number",
-      "buttons_direction": ["row", "column"],
+      "buttons_direction": [
+        "row",
+        "column"
+      ],
       "forIndex": "number",
       "seperatorColor": "color",
-      "condition": ["carousel-index"],
+      "condition": [
+        "carousel-index"
+      ],
       "conditionVariable": "number"
     },
     "defaults": {
@@ -28,7 +37,9 @@
     }
   },
   "meta": {
-    "desiredParent": ["=OnboardItem"],
+    "desiredParent": [
+      "=OnboardItem"
+    ],
     "label": "Onboard Buttons",
     "description": "Wrapper for onboarding button set.",
     "styles": {

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

@@ -68,8 +68,6 @@ export interface OnboardDotPropsGenerated {
   attributes: {
     style?: OnboardDotStyleGenerated;
     scrollable?: boolean;
-    title?: string;
-    description?: string;
     dotType?: DotTypeOptionType;
     dot_thickness?: string;
     inactive_dot_opacity?: number;

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

@@ -2,11 +2,11 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "OnboardDot",
+    "title": "title",
+    "description": "description",
     "children": "never",
     "extends": "View",
     "attributes": {
-      "title": "title",
-      "description": "description",
       "dotType": [
         "expanding_dot",
         "normal_dot",
@@ -37,7 +37,9 @@
     }
   },
   "meta": {
-    "desiredParent": [">OnboardProvider"],
+    "desiredParent": [
+      ">OnboardProvider"
+    ],
     "label": "Onboard Dot",
     "description": "Renders onboarding progress dots.",
     "styles": {

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

@@ -9,6 +9,7 @@ import { isNodeSelected, SELECTED_OUTLINE_STYLE } from '../../utils/selection';
 import { useMergedStyle } from '../../utils/useMergedStyle';
 import { defaultAppConfig } from '../../types/PreviewConfig';
 import { parseColor } from '../../utils/parseColor';
+import { getStyleBag, toAttributeRecord } from '../../utils/attributeStyle';
 
 type Segment =
   | { type: 'text'; value: string }
@@ -107,26 +108,36 @@ function OnboardFooter({ node }: OnboardFooterComponentProps) {
     key ? (localication?.[defaultLanguage ?? 'en']?.[key] ?? key) : '';
 
   const attrs = node?.attributes;
+  const attrRecord = toAttributeRecord(attrs);
+  const styleBag = getStyleBag(attrs);
   const text = t(attrs?.textLocalizationKey);
   const textStyle = useExtractTextStyle(node, true);
   const viewStyle = useExtractViewStyle(node);
 
+  // Read linked-word colors from both top-level attributes and the styles bag.
+  // The editor saves them inside `styles` (meta category === 'style'),
+  // but legacy JSON may have them at the top level.
+  const rawFirstColor = (attrRecord.linkedWordFirstColor ??
+    styleBag?.linkedWordFirstColor) as string | undefined;
+  const rawSecondColor = (attrRecord.linkedWordSecondColor ??
+    styleBag?.linkedWordSecondColor) as string | undefined;
+
   // Parse colors for linked words
   const parsedFirstColor = useMemo(
     () =>
-      parseColor(attrs?.linkedWordFirstColor, {
+      parseColor(rawFirstColor, {
         projectColors,
         theme,
       }),
-    [attrs?.linkedWordFirstColor, projectColors, theme],
+    [rawFirstColor, projectColors, theme],
   );
   const parsedSecondColor = useMemo(
     () =>
-      parseColor(attrs?.linkedWordSecondColor, {
+      parseColor(rawSecondColor, {
         projectColors,
         theme,
       }),
-    [attrs?.linkedWordSecondColor, projectColors, theme],
+    [rawSecondColor, projectColors, theme],
   );
 
   const mergedTextStyle = useMergedStyle(textStyle, {

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

@@ -66,8 +66,6 @@ export interface OnboardFooterPropsGenerated {
   child: string;
   attributes: {
     style?: OnboardFooterStyleGenerated;
-    title?: string;
-    description?: string;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     scrollable?: boolean;

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

@@ -2,11 +2,11 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "OnboardFooter",
+    "title": "title",
+    "description": "description",
     "children": "node",
     "extends": "Text",
     "attributes": {
-      "title": "title",
-      "description": "description",
       "textLocalizationKey": "string",
       "linkedWordFirstLocalizationKey": "string",
       "linkedWordFirstColor": "color",
@@ -27,7 +27,9 @@
     }
   },
   "meta": {
-    "desiredParent": [">OnboardItem"],
+    "desiredParent": [
+      ">OnboardItem"
+    ],
     "label": "Onboard Footer",
     "description": "Footer text with optional links.",
     "styles": {

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

@@ -62,8 +62,6 @@ export interface OnboardImagePropsGenerated {
   child: string;
   attributes: {
     style?: OnboardImageStyleGenerated;
-    title?: string;
-    description?: string;
     src?: string;
     scrollable?: boolean;
     video_url?: string;

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

@@ -2,17 +2,21 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "OnboardImage",
+    "title": "title",
+    "description": "description",
     "children": "node",
     "extends": "Image",
     "attributes": {
-      "title": "title",
-      "description": "description",
       "video_url": "string",
       "lottie": "string"
     }
   },
   "meta": {
-    "desiredParent": [">OnboardProvider", ">OnboardItem", "!=Onboard"],
+    "desiredParent": [
+      ">OnboardProvider",
+      ">OnboardItem",
+      "!=Onboard"
+    ],
     "label": "Onboard Image",
     "description": "Onboarding hero image with media.",
     "styles": {},

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

@@ -62,8 +62,6 @@ export interface OnboardItemPropsGenerated {
   attributes: {
     style?: OnboardItemStyleGenerated;
     scrollable?: boolean;
-    title?: string;
-    description?: string;
     display?: DisplayOptionType;
     gap?: string;
     flexDirection?: FlexDirectionOptionType;

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

@@ -2,14 +2,20 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "OnboardItem",
+    "title": "title",
+    "description": "description",
     "children": "node",
     "extends": "View",
     "attributes": {
-      "title": "title",
-      "description": "description",
-      "display": ["flex", "block"],
+      "display": [
+        "flex",
+        "block"
+      ],
       "gap": "size",
-      "flexDirection": ["row", "column"],
+      "flexDirection": [
+        "row",
+        "column"
+      ],
       "paddingHorizontal": "size"
     }
   },
@@ -22,7 +28,9 @@
     }
   },
   "meta": {
-    "desiredParent": ["=Onboard"],
+    "desiredParent": [
+      "=Onboard"
+    ],
     "label": "Onboard Item",
     "description": "Single onboarding screen section.",
     "styles": {},

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

@@ -62,8 +62,6 @@ export interface OnboardProviderPropsGenerated {
   attributes: {
     style?: OnboardProviderStyleGenerated;
     scrollable?: boolean;
-    title?: string;
-    description?: string;
     theme?: ThemeOptionType;
     borderRadius?: never;
   };

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

@@ -2,12 +2,16 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "OnboardProvider",
+    "title": "title",
+    "description": "description",
     "children": "node",
     "extends": "View",
     "attributes": {
-      "title": "title",
-      "description": "description",
-      "theme": ["light", "dark", "all"],
+      "theme": [
+        "light",
+        "dark",
+        "all"
+      ],
       "borderRadius": "never"
     }
   },
@@ -18,7 +22,9 @@
     }
   },
   "meta": {
-    "desiredParent": ["root"],
+    "desiredParent": [
+      "root"
+    ],
     "label": "Onboard Provider",
     "description": "Provides shared settings for onboarding.",
     "styles": {},

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

@@ -66,8 +66,6 @@ export interface OnboardSubtitlePropsGenerated {
   child: string;
   attributes: {
     style?: OnboardSubtitleStyleGenerated;
-    title?: string;
-    description?: string;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     scrollable?: boolean;

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

@@ -2,12 +2,10 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "OnboardSubtitle",
+    "title": "title",
+    "description": "description",
     "children": "string",
-    "extends": "Text",
-    "attributes": {
-      "title": "title",
-      "description": "description"
-    }
+    "extends": "Text"
   },
   "defaults": {
     "style": {
@@ -16,7 +14,10 @@
     }
   },
   "meta": {
-    "desiredParent": [">OnboardProvider", ">OnboardItem"],
+    "desiredParent": [
+      ">OnboardProvider",
+      ">OnboardItem"
+    ],
     "label": "Onboard Subtitle",
     "description": "Subtitle text for an onboarding step.",
     "styles": {}

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

@@ -66,8 +66,6 @@ export interface OnboardTitlePropsGenerated {
   child: string;
   attributes: {
     style?: OnboardTitleStyleGenerated;
-    title?: string;
-    description?: string;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     scrollable?: boolean;

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

@@ -2,12 +2,10 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "OnboardTitle",
+    "title": "title",
+    "description": "description",
     "children": "string",
-    "extends": "Text",
-    "attributes": {
-      "title": "title",
-      "description": "description"
-    }
+    "extends": "Text"
   },
   "defaults": {
     "style": {
@@ -17,7 +15,10 @@
     }
   },
   "meta": {
-    "desiredParent": [">OnboardItem", ">OnboardProvider"],
+    "desiredParent": [
+      ">OnboardItem",
+      ">OnboardProvider"
+    ],
     "label": "Onboard Title",
     "description": "Title text for an onboarding step.",
     "styles": {}

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

@@ -61,8 +61,6 @@ export interface PaywallBackgroundPropsGenerated {
   child: string;
   attributes: {
     style?: PaywallBackgroundStyleGenerated;
-    title?: string;
-    description?: string;
     src?: string;
     resizeMode?: ResizeModeOptionType;
     scrollable?: boolean;

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

@@ -2,12 +2,10 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "PaywallBackground",
+    "title": "title",
+    "description": "description",
     "children": "never",
     "extends": "BackgroundImage",
-    "attributes": {
-      "title": "title",
-      "description": "description"
-    },
     "defaults": {
       "resizeMode": "cover",
       "style": {
@@ -22,7 +20,9 @@
     }
   },
   "meta": {
-    "desiredParent": [">PaywallProvider"],
+    "desiredParent": [
+      ">PaywallProvider"
+    ],
     "label": "Paywall Background",
     "description": "Paywall Background component.",
     "styles": {}

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

@@ -66,8 +66,6 @@ export interface PaywallCloseButtonPropsGenerated {
   child: string;
   attributes: {
     style?: PaywallCloseButtonStyleGenerated;
-    title?: string;
-    description?: string;
     iconType?: string;
     size?: number;
     strokeWidth?: number;

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

@@ -2,15 +2,15 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "PaywallCloseButton",
+    "title": "title",
+    "description": "description",
     "children": "never",
-    "extends": "BIcon",
-    "attributes": {
-      "title": "title",
-      "description": "description"
-    }
+    "extends": "BIcon"
   },
   "meta": {
-    "desiredParent": [">PaywallProvider"],
+    "desiredParent": [
+      ">PaywallProvider"
+    ],
     "label": "Paywall Close Button",
     "description": "Paywall Close Button component.",
     "styles": {}

package/src/build-components/PaywallCounter/PaywallCounterProps.generated.ts

@@ -67,8 +67,6 @@ export interface PaywallCounterPropsGenerated {
   attributes: {
     style?: PaywallCounterStyleGenerated;
     count?: number;
-    title?: string;
-    description?: string;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     scrollable?: boolean;

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

@@ -2,12 +2,15 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "PaywallCounter",
+    "title": "title",
+    "description": "description",
     "children": "never",
-    "extends": "Counter",
-    "attributes": {}
+    "extends": "Counter"
   },
   "meta": {
-    "desiredParent": ["all"],
+    "desiredParent": [
+      "all"
+    ],
     "label": "Paywall Counter",
     "description": "Displays the paywall counter value.",
     "attributes": {

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

@@ -61,8 +61,6 @@ export interface PaywallOptionsPropsGenerated {
   attributes: {
     style?: PaywallOptionsStyleGenerated;
     scrollable?: boolean;
-    title?: string;
-    description?: string;
   };
 }
 

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

@@ -2,15 +2,15 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "PaywallOptions",
+    "title": "title",
+    "description": "description",
     "extends": "View",
-    "children": "node",
-    "attributes": {
-      "title": "title",
-      "description": "description"
-    }
+    "children": "node"
   },
   "meta": {
-    "desiredParent": [">PaywallProvider"],
+    "desiredParent": [
+      ">PaywallProvider"
+    ],
     "label": "Paywall Options",
     "description": "Paywall options selector component.",
     "styles": {}

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

@@ -61,8 +61,6 @@ export interface PaywallProviderPropsGenerated {
   attributes: {
     style?: PaywallProviderStyleGenerated;
     scrollable?: boolean;
-    title?: string;
-    description?: string;
     delay?: number;
   };
 }

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

@@ -2,11 +2,11 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "PaywallProvider",
+    "title": "title",
+    "description": "description",
     "children": "node",
     "extends": "View",
     "attributes": {
-      "title": "title",
-      "description": "description",
       "delay": "number"
     }
   },
@@ -17,7 +17,9 @@
     }
   },
   "meta": {
-    "desiredParent": ["all"],
+    "desiredParent": [
+      "all"
+    ],
     "label": "Paywall Provider",
     "description": "Provider/wrapper for paywall screen components.",
     "attributes": {

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

@@ -75,8 +75,6 @@ export interface PaywallSubscribeButtonPropsGenerated {
   child: string;
   attributes: {
     style?: PaywallSubscribeButtonStyleGenerated;
-    title?: string;
-    description?: string;
     scrollable?: boolean;
   };
 }

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

@@ -2,12 +2,10 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "PaywallSubscribeButton",
+    "title": "title",
+    "description": "description",
     "children": "string",
-    "extends": "Button",
-    "attributes": {
-      "title": "title",
-      "description": "description"
-    }
+    "extends": "Button"
   },
   "defaults": {
     "style": {
@@ -23,7 +21,9 @@
     }
   },
   "meta": {
-    "desiredParent": [">PaywallProvider"],
+    "desiredParent": [
+      ">PaywallProvider"
+    ],
     "label": "Paywall Subscribe Button",
     "description": "Paywall subscribe call-to-action button. Extends Button.",
     "styles": {}

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

@@ -61,8 +61,6 @@ export interface RadioButtonPropsGenerated {
   attributes: {
     style?: RadioButtonStyleGenerated;
     scrollable?: boolean;
-    title?: string;
-    description?: string;
     selected?: boolean;
     color?: string;
     size?: number;

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

@@ -2,18 +2,20 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "RadioButton",
+    "title": "title",
+    "description": "description",
     "children": "never",
     "extends": "View",
     "attributes": {
-      "title": "title",
-      "description": "description",
       "selected": "boolean",
       "color": "color",
       "size": "number"
     }
   },
   "meta": {
-    "desiredParent": ["all"],
+    "desiredParent": [
+      "all"
+    ],
     "label": "Radio Button",
     "description": "Generic radio button icon.",
     "styles": {

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

@@ -16,8 +16,6 @@ export interface SeparatorPropsGenerated {
   child: string;
   attributes: {
     style?: SeparatorStyleGenerated;
-    title?: string;
-    description?: string;
   };
 }
 

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

@@ -2,10 +2,10 @@
   "schemaVersion": 2,
   "pattern": {
     "type": "Separator",
+    "title": "title",
+    "description": "description",
     "children": "never",
     "attributes": {
-      "title": "title",
-      "description": "description",
       "style": {
         "backgroundColor": "color",
         "width": "size",
@@ -18,7 +18,9 @@
     }
   },
   "meta": {
-    "desiredParent": ["all"],
+    "desiredParent": [
+      "all"
+    ],
     "label": "Separator",
     "description": "Horizontal line separator.",
     "styles": {

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

@@ -61,8 +61,6 @@ export interface StatusBarColorPropsGenerated {
   attributes: {
     style?: StatusBarColorStyleGenerated;
     scrollable?: boolean;
-    title?: string;
-    description?: string;
   };
 }