@developer_tribe/react-builder 1.2.31 → 1.2.33

package/src/assets/prompt-scheme-paywall.generated.ts

@@ -0,0 +1,4 @@
+/* AUTO-GENERATED FILE - DO NOT EDIT */
+/* Prompt scheme for paywall screens. Generated by generate-prompt-schemes.js */
+
+export const paywallPromptScheme: string = "You are a React Native UI builder assistant. Your goal is to generate a valid **paywall** screen node tree in XML format.\n\n## Available Components & Their Props\n\nEach component is listed as `ComponentName: {attr: TypeScriptType, styles: {prop: TypeScriptType}}`.\nUse ONLY these component names and attribute names. Do NOT invent new components or attributes.\n\nUnion enum values must match exactly (e.g. `\"expanding_dot\"` not `expandingDot`).\nColor values: prefer `THEME_COLORS.KEY` or `STATIC_COLORS.KEY` for theme-aware colors. Literal values like `\"red\"` or `\"#000fff\"` are also valid when a specific color is intended.\nLocalization string values should use a localization key like `\"screen.section.label\"`.\n\n```\nBIcon:{adjustsFontSizeToFit:boolean,showEllipsis:boolean,translateCounter:number,scrollable:boolean,iconType:string,size:number,strokeWidth:number,styles:{color:string,fontSize:string,fontFamily:string,fontWeight:string,flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nBackgroundImage:{scrollable:boolean,src:string,resizeMode:\"cover\"|\"contain\"|\"stretch\"|\"center\",styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nButton:{scrollable:boolean,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number,color:string,fontSize:string,fontWeight:\"normal\"|\"bold\"|\"100\"|\"200\"|\"300\"|\"400\"|\"500\"|\"600\"|\"700\"|\"800\"|\"900\"}}\nCarousel:{scrollable:boolean,loop:boolean,dragFree:boolean,align:\"start\"|\"center\"|\"end\",styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nCarouselButtons:{scrollable:boolean,buttonType:\"previous_button\"|\"next_button\"|\"skip_button\",skipNumber:number,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nCarouselDots:{scrollable:boolean,dotType:\"expanding_dot\"|\"normal_dot\"|\"scaling_dot\"|\"sliding_border\"|\"sliding_dot\"|\"liquid_like\",dot_thickness:string,inactive_dot_opacity:number,inactive_dot_color:string,active_dot_color:string,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nCarouselItem:{scrollable:boolean,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nCarouselProvider:{scrollable:boolean,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nCountDown:{adjustsFontSizeToFit:boolean,showEllipsis:boolean,translateCounter:number,scrollable:boolean,count:number,styles:{color:string,fontSize:string,fontFamily:string,fontWeight:string,flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:obj,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number,textAlign:obj}}\nImage:{scrollable:boolean,src:string,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number,resizeMode:\"cover\"|\"contain\"|\"stretch\"|\"center\"}}\nMain:{scrollable:boolean,useSafeAreaView:boolean,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nNavigationBarColor:{scrollable:boolean,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nOnboard:{scrollable:boolean,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nOnboardButton:{scrollable:boolean,labelKey:string,animation:\"simple-animation\"|\"line-animation\"|\"blur\"|\"blur-animation\"|\"blur-line-animation\",animation_color:string,events:[obj],styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number,color:string}}\nOnboardButtons:{scrollable:boolean,buttonType:\"previous_button\"|\"next_button\"|\"skip_button\",skipNumber:number,buttons_direction:\"row\"|\"column\",forIndex:number,seperatorColor:string,condition:\"carousel-index\",conditionVariable:number,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nOnboardDot:{scrollable:boolean,dotType:\"expanding_dot\"|\"normal_dot\"|\"scaling_dot\"|\"sliding_border\"|\"sliding_dot\"|\"liquid_like\",dot_thickness:string,inactive_dot_opacity:number,inactive_dot_color:string,active_dot_color:string,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nOnboardFooter:{adjustsFontSizeToFit:boolean,showEllipsis:boolean,translateCounter:number,scrollable:boolean,textLocalizationKey:string,linkedWordFirstLocalizationKey:string,linkedWordFirstColor:string,linkedWordFirstPage:string,linkedWordSecondLocalizationKey:string,linkedWordSecondColor:string,linkedWordSecondPage:string,styles:{color:string,fontSize:string,fontFamily:string,fontWeight:string,flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nOnboardImage:{src:string,scrollable:boolean,video_url:string,lottie:string,styles:{resizeMode:\"cover\"|\"contain\"|\"stretch\"|\"center\",flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nOnboardItem:{scrollable:boolean,display:\"flex\"|\"block\",gap:string,flexDirection:\"row\"|\"column\",paddingHorizontal:string,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nOnboardProvider:{scrollable:boolean,theme:\"light\"|\"dark\"|\"all\",styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nOnboardSubtitle:{adjustsFontSizeToFit:boolean,showEllipsis:boolean,translateCounter:number,scrollable:boolean,styles:{color:string,fontSize:string,fontFamily:string,fontWeight:string,flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nOnboardTitle:{adjustsFontSizeToFit:boolean,showEllipsis:boolean,translateCounter:number,scrollable:boolean,styles:{color:string,fontSize:string,fontFamily:string,fontWeight:string,flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nPaywallBackground:{src:string,resizeMode:\"cover\"|\"contain\"|\"stretch\"|\"center\",scrollable:boolean,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nPaywallCloseButton:{iconType:string,size:number,strokeWidth:number,adjustsFontSizeToFit:boolean,showEllipsis:boolean,translateCounter:number,scrollable:boolean,styles:{color:string,fontSize:string,fontFamily:string,fontWeight:string,flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nPaywallOptions:{scrollable:boolean,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nPaywallProvider:{scrollable:boolean,delay:number,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nPaywallSubscribeButton:{scrollable:boolean,styles:{color:string,fontSize:string,fontWeight:\"normal\"|\"bold\"|\"100\"|\"200\"|\"300\"|\"400\"|\"500\"|\"600\"|\"700\"|\"800\"|\"900\",flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nPriceTag:{adjustsFontSizeToFit:boolean,showEllipsis:boolean,translateCounter:number,scrollable:boolean,showOriginalPricePossible:boolean,hideIfItsNotDiscount:boolean,styles:{color:string,fontSize:string,fontFamily:string,fontWeight:string,flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number,textDecorationLine:\"none\"|\"underline\"|\"line-through\"}}\nPricing:{adjustsFontSizeToFit:boolean,showEllipsis:boolean,translateCounter:number,scrollable:boolean,styles:{color:string,fontSize:string,fontFamily:string,fontWeight:string,flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nPromo:{adjustsFontSizeToFit:boolean,showEllipsis:boolean,translateCounter:number,scrollable:boolean,styles:{color:string,fontSize:string,fontFamily:string,fontWeight:string,flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nRadioButton:{scrollable:boolean,selected:boolean,color:string,size:number,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nSeparator:{styles:{backgroundColor:string,width:string,height:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string}}\nStatusBarColor:{scrollable:boolean,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\nText:{scrollable:boolean,adjustsFontSizeToFit:boolean,showEllipsis:boolean,translateCounter:number,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number,color:string,fontSize:string,fontFamily:string,fontWeight:string}}\nView:{scrollable:boolean,styles:{flexDirection:\"row\"|\"column\",flexWrap:\"nowrap\"|\"wrap\"|\"wrap-reverse\",alignItems:\"flex-start\"|\"center\"|\"flex-end\"|\"stretch\"|\"baseline\",justifyContent:\"flex-start\"|\"center\"|\"flex-end\"|\"space-between\"|\"space-around\"|\"space-evenly\",gap:string,padding:string,paddingHorizontal:string,paddingVertical:string,paddingTop:string,paddingBottom:string,paddingLeft:string,paddingRight:string,margin:string,marginHorizontal:string,marginVertical:string,marginTop:string,marginBottom:string,marginLeft:string,marginRight:string,backgroundColor:string,borderRadius:string,width:string,minWidth:string,maxWidth:string,height:string,minHeight:string,maxHeight:string,flex:number,position:\"relative\"|\"absolute\",top:string,bottom:string,left:string,right:string,zIndex:number}}\n```\n\n## Available Icons\n\nUse one of these values for `iconType` attributes:\n\n```\nactivity, activity-heart, alert-circle, alert-triangle, anchor, archive, arrow-down, arrow-left, arrow-narrow-down-left, arrow-narrow-up-right, arrow-right, arrow-right-smooth, asterisk-01, asterisk-02, at-sign, award, battery-charging, bell-01, bell-02, bell-ringing-02, bookmark, bookmark-add, bookmark-check, bookmark-minus, bookmark-x, bubble, building-01, building-02, building-03, building-04, building-05, building-06, building-07, building-08, building-09, camera, camera-01, camera-steel, check, check-circle, check-circle-bold, check-circle-broken, check-done-01, check-done-02, check-heart, check-square, check-square-broken, check-verified-01, check-verified-02, check-verified-03, checkbox, checkv, chevron-down, chevron-down2, chevron-left, chevron-left-2, chevron-right, chevron-right-empty, chevron-right-smooth, chevron-up, circle, clock, clock-fast-forward, close, close-circle, cloud-01, cloud-blank-01, cloud-blank-02, coin, coins-02, colors, copy-01, copy-02, copy-03, copy-04, copy-05, copy-06, copy-07, corner-down-right, crypto-bold, delete-icon, diamond, dice-3, display, divide-01, divide-02, divide-03, document-check-bold, dots-circle, dots-grid, dots-horizontal, dots-vertical, download-01, download-02, download-03, edit-03, edit-04, edit-05, element-3, ellipse-127, exclaimation-circle, eye-off-line, face-smile, file-04, file-05, file-check-02, file-plus-01, file-shield-02, filter-funnel-01, flag-03, flash, folder, folder-plus, gallery, globe-01, globe-04, globe-bold, guard, headphones-01, headphones-02, headset-bold, heart, heart-bold, help-circle, home-2, home-line, hourglass-02, iconType, image, image-01, image-03, inbox-01, inbox-arrow-down, info-circle, keyboard-line, lamp-charge, layer, light, like-dislike, lineHeight, lock-03, logout, magicpen, mail, mail-01, marker, medal-star, menu, menu-04, message-circle-01, message-plus-circle, message-question-circle, message-text-circle-01, message-text-square-02, message-x-square, microphone-02, microphone-slash, mirror, moon-01, moon-bold, mouse-circle, move, notification, notification-fill, notification-text, pdf-01, pencil-01, phone, phone-01, phone-arrow-down-left, phone-arrow-up-right, phone-hang-up, phone-hangup2, phone-incoming-01, phone-outgoing-01, phone-plus, phone-x, plus, plus-circle, printer, question-mark-circle, refresh-ccw-01, refresh-cw-01, refresh-cw-04, refresh-right-square-bold, remove-circle, repeat-04, repeat-bold, ruler-pen, search, search-lg, search-md, search-refraction, send-01, send-02, send-diagonal, setting-2, settings, settings-02, settings-04, settings-2, settings-cog, share-01, share-03, share-04, share-05, share-06, share-bold, shield-01, shield-bold, solar-check, speaker, speaker-wave, speedometer-03, star, star-rounded, sun, target-03, text-input, translate, trash, trash-02, trash-03, trash-04, trush-square-bold, unlimited, user-circle, user-jogging, user-plus-01, user-square, user-x-01, user-x-02, user2, users-02, users-speaker, verify, voice-cricle, x-circle, x-close, x-sm, zap\n```\n\n## XML Rules\n\n- Root element must always be `<Main isMain=\"true\">`.\n- Text content (children) goes as element body text, not as an attribute.\n- `styles` value must be a JSON object string (escape inner quotes): `styles=\"{&quot;flex&quot;:1,&quot;color&quot;:&quot;THEME_COLORS.TEXT&quot;}\"`.\n- `events` value must be a JSON array string.\n- Omit any attribute that has no value — no nulls, no empty strings.\n- Use a short unique slug for `key` when the component needs one.\n- Only use components appropriate for a paywall screen.\n\n## Reference Example\n\nA complete, valid paywall XML:\n\n```xml\n<Main isMain=\"true\" useSafeAreaView=\"true\" description=\"Ekranın ana kapsayıcısı. (#1)\" title=\"Main\">\n  <StatusBarColor title=\"Status Bar Color\" description=\"Status bar background color.\" styles='{\"backgroundColor\":\"THEME_COLORS.BACKGROUND\"}' />\n  <NavigationBarColor title=\"Navigation Bar Color\" description=\"Navigation bar background color.\" styles='{\"backgroundColor\":\"THEME_COLORS.BACKGROUND\"}' />\n  <PaywallProvider scrollable=\"true\" description=\"Paywall ana sağlayıcısı. (#1)\" title=\"Main Paywall\" styles='{\"flexDirection\":\"column\",\"alignItems\":\"stretch\",\"justifyContent\":\"flex-start\",\"position\":\"relative\",\"backgroundColor\":\"THEME_COLORS.BACKGROUND\"}'>\n    <PaywallBackground src=\"https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" resizeMode=\"cover\" description=\"Paywall arka planı. (#1)\" title=\"Paywall Background\" />\n    <View styles='{\"paddingTop\":56,\"paddingHorizontal\":16,\"paddingBottom\":16,\"gap\":12,\"flex\":1}'>\n      <PaywallCloseButton styles='{\"width\":32,\"height\":32,\"borderRadius\":16,\"backgroundColor\":\"STATIC_COLORS.WHITE\",\"color\":\"STATIC_COLORS.BLACK\",\"zIndex\":10,\"alignItems\":\"center\",\"justifyContent\":\"center\"}' />\n      <View description=\"Düzen ve yerleşim konteyneri. (#2)\" title=\"Benefits\" styles='{\"flexDirection\":\"column\",\"gap\":0,\"marginTop\":\"4%\"}'>\n        <View description=\"Düzen ve yerleşim konteyneri. (#3)\" title=\"Benefit #1\" styles='{\"flexDirection\":\"row\",\"alignItems\":\"center\",\"gap\":8,\"paddingVertical\":8,\"paddingHorizontal\":12}'>\n          <BIcon iconType=\"check\" strokeWidth=\"3\" description=\"İkon öğesi. (#1)\" title=\"BIcon 1\" styles='{\"color\":\"THEME_COLORS.ICON\",\"fontSize\":\"16\",\"flex\":0}' />\n          <Text description=\"Metin öğesi. (#1)\" title=\"text 1\" styles='{\"flex\":1,\"color\":\"STATIC_COLORS.WHITE\",\"fontWeight\":\"700\"}'>\n            @benefit1 — Unlimited access\n          </Text>\n        </View>\n        <View description=\"Düzen ve yerleşim konteyneri. (#4)\" title=\"Benefit #2\" styles='{\"flexDirection\":\"row\",\"alignItems\":\"center\",\"gap\":8,\"paddingVertical\":8,\"paddingHorizontal\":12}'>\n          <BIcon iconType=\"check\" strokeWidth=\"3\" description=\"İkon öğesi. (#2)\" title=\"BIcon 2\" styles='{\"color\":\"THEME_COLORS.ICON\",\"fontSize\":\"16\",\"flex\":0}' />\n          <Text description=\"Metin öğesi. (#2)\" title=\"text 2\" styles='{\"flex\":1,\"color\":\"STATIC_COLORS.WHITE\",\"fontWeight\":\"700\"}'>\n            @benefit2 — 7-day free trial\n          </Text>\n        </View>\n        <View description=\"Düzen ve yerleşim konteyneri. (#5)\" title=\"Benefit #3\" styles='{\"flexDirection\":\"row\",\"alignItems\":\"center\",\"gap\":8,\"paddingVertical\":8,\"paddingHorizontal\":12}'>\n          <BIcon iconType=\"check\" strokeWidth=\"3\" description=\"İkon öğesi. (#3)\" title=\"BIcon 3\" styles='{\"color\":\"THEME_COLORS.ICON\",\"fontSize\":\"16\",\"flex\":0}' />\n          <Text description=\"Metin öğesi. (#3)\" title=\"text 3\" styles='{\"flex\":1,\"color\":\"STATIC_COLORS.WHITE\",\"fontWeight\":\"700\"}'>\n            @benefit3 — Cancel anytime\n          </Text>\n        </View>\n      </View>\n      <PaywallOptions description=\"Abonelik seçenekleri alanı. (#1)\" title=\"Option(s)\" styles='{\"borderRadius\":12,\"backgroundColor\":\"THEME_COLORS.BACKGROUND\"}'>\n        <RadioButton description=\"Seçim satırı öğesi. (#1)\" title=\"Product Radio(s)\" styles='{\"flex\":1}' />\n        <Text description=\"Metin öğesi. (#4)\" title=\"Product Desc(s)\" styles='{\"flex\":4}'>\n          @productDescription\n        </Text>\n        <View title=\"Price Column\" styles='{\"flexDirection\":\"column\",\"flex\":1,\"alignItems\":\"flex-end\"}'>\n          <PriceTag title=\"Promo Price\" styles='{\"textAlign\":\"right\",\"fontWeight\":\"700\"}'>\n            @localizedCalculatedPrice\n          </PriceTag>\n          <PriceTag title=\"Original Price\" hideIfItsNotDiscount=\"true\" styles='{\"textAlign\":\"right\",\"textDecorationLine\":\"line-through\",\"fontSize\":\"12@fs\",\"fontWeight\":\"400\",\"color\":\"#999999\"}'>\n            @localizedPrice\n          </PriceTag>\n        </View>\n        <BIcon iconType=\"chevron-right\" size=\"16\" description=\"İkon öğesi. (#4)\" title=\"Product BIcon(s)\" styles='{\"marginRight\":4,\"flex\":0,\"width\":32,\"color\":\"STATIC_COLORS.BLACK\"}' />\n      </PaywallOptions>\n      <View description=\"Subscription butonu kapsayıcısı. (#1)\" title=\"Subs Container\" styles='{\"flex\":1,\"flexDirection\":\"column\",\"justifyContent\":\"flex-end\",\"alignItems\":\"stretch\",\"gap\":8,\"paddingBottom\":\"50px\"}'>\n        <Pricing description=\"Pricing breakdown for promo/trial.\" title=\"Pricing Detail\">\n          @baseLocalizedPricingText\n        </Pricing>\n        <Text description=\"Trial detayı.\" title=\"Trial Full\" styles='{\"textAlign\":\"center\",\"fontSize\":12,\"color\":\"rgba(255,255,255,0.6)\"}'>\n          @trialPeriod days free, then @price/@period\n        </Text>\n        <PaywallSubscribeButton description=\"Abonelik onay butonu. (#1)\" title=\"Subscribe\">\n          Subscribe\n        </PaywallSubscribeButton>\n        <Promo description=\"Discount badge / promo text.\" title=\"Promo Badge\">\n          @baseLocalizedPromoText\n        </Promo>\n      </View>\n    </View>\n  </PaywallProvider>\n</Main>\n```\n\n## Task\n\nGenerate a node tree XML for the user's request below. Output ONLY raw XML — no markdown fences, no explanation.\n";

package/src/assets/samples/vpn-onboard-1.json

@@ -2,30 +2,6 @@
   "name": "vpn-onboard-1",
   "version": "1.1.2",
   "type": "onboard",
-  "appConfig": {
-    "localication": {
-      "ar": {
-        "onboard.title.one-page": "أمّن اتصالك",
-        "onboard.title.two-page": "وصول إلى المحتوى حول العالم",
-        "onboard.title.three-page": "سرعة واعتمادية",
-        "onboard.title.four-page": "إشعارات وحماية دائمة",
-        "onboard.subtitle.one-page": "قم بتشفير حركة المرور وحماية خصوصيتك على شبكات Wi‑Fi العامة.",
-        "onboard.subtitle.two-page": "اتصل بخوادم عالية السرعة في بلدان متعددة بضغطة واحدة.",
-        "onboard.subtitle.three-page": "يتصل التطبيق تلقائياً بأفضل خادم لسرعة وثبات أعلى.",
-        "onboard.subtitle.four-page": "فعّل الإشعارات لمعرفة حالة الاتصال والحصول على نصائح الأمان.",
-        "onboard.next.one-page": "التالي",
-        "onboard.next.two-page": "التالي",
-        "onboard.next.three-page": "التالي",
-        "onboard.skip.one-page": "تخطي",
-        "onboard.skip.two-page": "تخطي",
-        "onboard.skip.three-page": "تخطي",
-        "onboard.allow.four-page": "السماح",
-        "view.onboarding.footer.description": "بالمتابعة، فإنك توافق على",
-        "view.onboarding.btnPrivacy": "سياسة الخصوصية",
-        "view.onboarding.btnTerms": "شروط الخدمة"
-      }
-    }
-  },
   "data": {
     "type": "Main",
     "isMain": true,

package/src/attribute-analyser/style/native/useExtractImageStyle.ts

@@ -22,7 +22,7 @@ export function useExtractImageStyle<
   style: ImageStyle;
   other: Omit<T, StyleAttrKey> & { resizeMode?: ResizeModeOptionType };
 } {
-  const { mockTheme: theme, projectColors, baseSize } = useBuilderParams();
+  const { selectedTheme: theme, projectColors, baseSize } = useBuilderParams();
 
   return useMemo(() => {
     // extractImageStyleNative returns Record<string, unknown> that may include resizeMode.

package/src/attribute-analyser/style/native/useExtractTextStyle.ts

@@ -21,7 +21,7 @@ export function useExtractTextStyle<T extends TextPropsGenerated['attributes']>(
   };
 } {
   const {
-    mockTheme: theme,
+    selectedTheme: theme,
     projectColors,
     fonts,
     baseSize,

package/src/attribute-analyser/style/native/useExtractViewStyle.ts

@@ -17,7 +17,7 @@ export function useExtractViewStyle<T extends ViewPropsGenerated['attributes']>(
   style: ViewStyle;
   other: Omit<T, StyleAttrKey> & { scrollable?: boolean };
 } {
-  const { mockTheme: theme, projectColors, baseSize } = useBuilderParams();
+  const { selectedTheme: theme, projectColors, baseSize } = useBuilderParams();
 
   return useMemo(() => {
     const style = extractViewStyleNative(node, {

package/src/attribute-analyser/style/web/useExtractImageStyle.ts

@@ -8,7 +8,7 @@ import { extractImageStyle } from '../../../utils/extractImageStyle';
 export function useExtractImageStyle<
   T extends ImagePropsGenerated['attributes'],
 >(node: NodeData<T>): CSSProperties {
-  const { mockTheme: theme, projectColors, baseSize } = useBuilderParams();
+  const { selectedTheme: theme, projectColors, baseSize } = useBuilderParams();
 
   return useMemo(
     () => extractImageStyle(node, { theme, projectColors, baseSize }),

package/src/attribute-analyser/style/web/useExtractTextStyle.ts

@@ -10,7 +10,7 @@ export function useExtractTextStyle<T extends TextPropsGenerated['attributes']>(
   directlyTextStyle = false,
 ): CSSProperties {
   const {
-    mockTheme: theme,
+    selectedTheme: theme,
     projectColors,
     fonts,
     baseSize,

package/src/attribute-analyser/style/web/useExtractViewStyle.ts

@@ -8,7 +8,7 @@ import { extractViewStyle } from '../../../utils/extractViewStyle';
 export function useExtractViewStyle<T extends ViewPropsGenerated['attributes']>(
   node: NodeData<T>,
 ): CSSProperties {
-  const { mockTheme: theme, projectColors, baseSize } = useBuilderParams();
+  const { selectedTheme: theme, projectColors, baseSize } = useBuilderParams();
 
   return useMemo(
     () => extractViewStyle(node, { theme, projectColors, baseSize }),

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

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

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

@@ -44,7 +44,7 @@
   "defaults": {
     "iconType": "activity",
     "strokeWidth": 1.5,
-    "style": {
+    "styles": {
       "fontSize": "16"
     }
   }

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

@@ -20,7 +20,7 @@ export function BackgroundImage({ node }: BackgroundImageComponentProps) {
   const baseStyle = useExtractViewStyle(node);
   const backgroundStyle = useMemo(() => {
     const attrs = node.attributes;
-    const styleBag = attrs?.style;
+    const styleBag = attrs?.styles;
     const style: React.CSSProperties = {
       backgroundRepeat: 'no-repeat',
       backgroundPosition: 'center',

package/src/build-components/BackgroundImage/BackgroundImageProps.generated.ts

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

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

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

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

@@ -33,7 +33,7 @@ export function Button({ node }: ButtonComponentProps) {
     combinedTextStyle.textAlign,
   ]);
   const buttonDefaults = useMemo(() => {
-    const styleBag = node?.attributes?.style;
+    const styleBag = node?.attributes?.styles;
     const hasExplicitBackground =
       styleBag?.backgroundColor !== undefined &&
       styleBag?.backgroundColor !== null &&
@@ -45,7 +45,7 @@ export function Button({ node }: ButtonComponentProps) {
         ? undefined
         : { backgroundColor: 'transparent' }),
     } as React.CSSProperties;
-  }, [node?.attributes?.style]);
+  }, [node?.attributes?.styles]);
   const isSelected = isNodeSelected({
     previewMode: !!previewMode,
     current: selectedKey ? { key: selectedKey } : undefined,

package/src/build-components/Button/ButtonProps.generated.ts

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

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

@@ -7,7 +7,7 @@
     "children": "string",
     "extends": "View",
     "attributes": {
-      "style": {
+      "styles": {
         "color": "color",
         "fontSize": "size",
         "fontWeight": [
@@ -55,7 +55,7 @@
     }
   },
   "defaults": {
-    "style": {
+    "styles": {
       "display": "flex",
       "alignItems": "center",
       "justifyContent": "center",

package/src/build-components/Carousel/CarouselProps.generated.ts

@@ -60,7 +60,7 @@ export interface CarouselStyleGenerated {
 export interface CarouselPropsGenerated {
   child: string;
   attributes: {
-    style?: CarouselStyleGenerated;
+    styles?: CarouselStyleGenerated;
     scrollable?: boolean;
     loop?: boolean;
     dragFree?: boolean;

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

@@ -19,7 +19,7 @@
     "styles": {}
   },
   "defaults": {
-    "style": {
+    "styles": {
       "flexDirection": "row"
     }
   }

package/src/build-components/CarouselButtons/CarouselButtonsProps.generated.ts

@@ -63,7 +63,7 @@ export interface CarouselButtonsStyleGenerated {
 export interface CarouselButtonsPropsGenerated {
   child: string;
   attributes: {
-    style?: CarouselButtonsStyleGenerated;
+    styles?: CarouselButtonsStyleGenerated;
     scrollable?: boolean;
     buttonType?: ButtonTypeOptionType;
     skipNumber?: number;

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

@@ -34,7 +34,7 @@ function CarouselDots({ node }: CarouselDotsComponentProps) {
   const onboardApi = useContext(onboardContext);
   const emblaApi = isOnboard ? onboardApi?.emblaApi : carouselApi;
 
-  const { mockTheme: theme, projectColors, baseSize } = useBuilderParams();
+  const { selectedTheme: theme, projectColors, baseSize } = useBuilderParams();
   const inactiveDotOpacity =
     (stylesBag?.inactive_dot_opacity as number | undefined) ??
     (attrRecord.inactive_dot_opacity as number | undefined) ??

package/src/build-components/CarouselDots/CarouselDotsProps.generated.ts

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

package/src/build-components/CarouselItem/CarouselItemProps.generated.ts

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

package/src/build-components/CarouselProvider/CarouselProviderProps.generated.ts

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

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

@@ -8,7 +8,7 @@
     "children": "node",
     "extends": "View",
     "defaults": {
-      "style": {
+      "styles": {
         "width": "100%",
         "height": "100%"
       }

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

@@ -64,7 +64,7 @@ export interface CountDownStyleGenerated {
 export interface CountDownPropsGenerated {
   child: string;
   attributes: {
-    style?: CountDownStyleGenerated;
+    styles?: CountDownStyleGenerated;
     adjustsFontSizeToFit?: boolean;
     showEllipsis?: boolean;
     translateCounter?: number;

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

@@ -8,7 +8,7 @@
     "extends": "Text",
     "attributes": {
       "count": "number",
-      "style": {
+      "styles": {
         "width": "never",
         "textAlign": "never"
       }

package/src/build-components/Image/ImageProps.generated.ts

@@ -61,7 +61,7 @@ export interface ImageStyleGenerated {
 export interface ImagePropsGenerated {
   child: string;
   attributes: {
-    style?: ImageStyleGenerated;
+    styles?: ImageStyleGenerated;
     scrollable?: boolean;
     src?: string;
   };

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

@@ -8,12 +8,12 @@
     "extends": "View",
     "attributes": {
       "src": "string",
-      "style": {
+      "styles": {
         "resizeMode": ["cover", "contain", "stretch", "center"]
       }
     },
     "defaults": {
-      "style": {
+      "styles": {
         "resizeMode": "contain"
       }
     }

package/src/build-components/Main/MainProps.generated.ts

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

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

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

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

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

package/src/build-components/NavigationBarColor/NavigationBarColorProps.generated.ts

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

package/src/build-components/NavigationBarColor/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/Onboard/OnboardProps.generated.ts

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

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

@@ -15,7 +15,7 @@
     "styles": {}
   },
   "defaults": {
-    "style": {
+    "styles": {
       "flexDirection": "row"
     }
   }

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 { defaultProjectColors } from '../../utils/projectColors';
 import { getStyleBag, toAttributeRecord } from '../../utils/attributeStyle';
 
 export function OnboardButton({ node }: OnboardButtonComponentProps) {
@@ -19,37 +18,19 @@ export function OnboardButton({ node }: OnboardButtonComponentProps) {
   node = useNode(node);
   const attributeName = node.sourceType ?? node.type ?? 'OnboardButton';
   const { emblaApi } = useContext(onboardContext) ?? {};
-  const { theme, projectColors } = useBuilderParams();
-
+  const { selectedTheme: theme, projectColors } = useBuilderParams();
   const context = useMockOSContext();
   const mockPermissionManager = useMockPermission(context);
   const handledEventsRef = useRef<EventObjectGenerated[]>([]);
   const generatedId = useId();
   const attributeKey = node.key ?? generatedId;
-
   const attrs = node.attributes;
-  const attrRecord = toAttributeRecord(attrs);
-  const styleBag = getStyleBag(attrs);
   const labelRaw = attrs?.labelKey ?? '';
   const localize = useLocalize();
   const label = localize(labelRaw);
-
-  const flex = (attrRecord.flex ?? styleBag?.flex ?? 1) as number;
-
-  // color and backgroundColor are now stored inside `styles`
-  const rawTextColor = styleBag?.color as string | undefined;
-  const rawBgColor = styleBag?.backgroundColor as string | undefined;
-
-  const textColor =
-    parseColor(rawTextColor, { projectColors, theme }) ??
-    projectColors?.STATIC_COLORS?.ONBOARD_BUTTON_PRIMARY_TEXT ??
-    defaultProjectColors.STATIC_COLORS!.ONBOARD_BUTTON_PRIMARY_TEXT;
-  const backgroundColor =
-    parseColor(rawBgColor, { projectColors, theme }) ??
-    projectColors?.STATIC_COLORS?.ONBOARD_BUTTON_PRIMARY_BACKGROUND ??
-    defaultProjectColors.STATIC_COLORS!.ONBOARD_BUTTON_PRIMARY_BACKGROUND;
+  const rawTextColor = attrs?.styles?.color as string | undefined;
+  const textColor = parseColor(rawTextColor, { projectColors, theme });
   const viewStyle = useExtractViewStyle(node);
-
   const handleClick = () => {
     //TODO: any ??
     const events: EventObjectGenerated[] = attrs?.events ?? [];
@@ -95,9 +76,7 @@ export function OnboardButton({ node }: OnboardButtonComponentProps) {
       onClick={handleClick}
       style={{
         ...viewStyle,
-        flex,
         color: textColor,
-        backgroundColor,
         border: 'none',
         display: 'flex',
         justifyContent: 'center',

package/src/build-components/OnboardButton/OnboardButtonProps.generated.ts

@@ -69,17 +69,17 @@ export interface OnboardButtonStyleGenerated {
   left?: string;
   right?: string;
   zIndex?: number;
+  color?: string;
 }
 
 export interface OnboardButtonPropsGenerated {
   child: string;
   attributes: {
-    style?: OnboardButtonStyleGenerated;
+    styles?: OnboardButtonStyleGenerated;
     scrollable?: boolean;
     labelKey?: string;
     animation?: AnimationOptionType;
     animation_color?: string;
-    flex?: number;
     events?: EventObjectGenerated[];
   };
 }