@developer_tribe/react-builder 1.0.5 → 1.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (66) hide show
  1. package/dist/build-components/index.d.ts +1 -2
  2. package/dist/build-components/patterns.generated.d.ts +56 -439
  3. package/dist/components/AttributesEditorPanel.d.ts +2 -2
  4. package/dist/components/BottomBar.d.ts +8 -0
  5. package/dist/components/Checkbox.d.ts +1 -1
  6. package/dist/components/LoadingComponent.d.ts +1 -0
  7. package/dist/components/MobilePanelToggleButton.d.ts +8 -0
  8. package/dist/hooks/useMinimumDelay.d.ts +7 -0
  9. package/dist/hooks/useMobileEditorPanels.d.ts +12 -0
  10. package/dist/hooks/useSyncProjectPageStore.d.ts +15 -0
  11. package/dist/index.cjs.js +3 -3
  12. package/dist/index.cjs.js.map +1 -1
  13. package/dist/index.esm.js +3 -3
  14. package/dist/index.esm.js.map +1 -1
  15. package/dist/index.native.cjs.js +1 -1
  16. package/dist/index.native.cjs.js.map +1 -1
  17. package/dist/index.native.esm.js +4 -4
  18. package/dist/index.native.esm.js.map +1 -1
  19. package/dist/modals/ScreenColorsModal.d.ts +8 -0
  20. package/dist/modals/index.d.ts +1 -0
  21. package/dist/pages/tabs/BuilderPanel.d.ts +2 -2
  22. package/dist/store.d.ts +6 -0
  23. package/dist/styles.css +1 -1
  24. package/dist/utils/nodeTree.d.ts +5 -0
  25. package/package.json +1 -1
  26. package/src/RenderPage.tsx +4 -1
  27. package/src/assets/samples/carousel-sample.json +99 -81
  28. package/src/assets/samples/simple-1.json +8 -2
  29. package/src/assets/samples/simple-2.json +36 -9
  30. package/src/assets/samples/vpn-onboard-1.json +27 -23
  31. package/src/assets/samples/vpn-onboard-2.json +279 -275
  32. package/src/assets/samples/vpn-onboard-3.json +247 -246
  33. package/src/assets/samples/vpn-onboard-4.json +247 -246
  34. package/src/assets/samples/vpn-onboard-5.json +375 -369
  35. package/src/assets/samples/vpn-onboard-6.json +252 -248
  36. package/src/build-components/RenderNode.generated.tsx +0 -7
  37. package/src/build-components/View/pattern.json +2 -2
  38. package/src/build-components/index.ts +0 -5
  39. package/src/build-components/patterns.generated.ts +56 -455
  40. package/src/components/AttributesEditorPanel.tsx +12 -8
  41. package/src/components/BottomBar.tsx +236 -0
  42. package/src/components/EditorHeader.tsx +11 -4
  43. package/src/components/LoadingComponent.tsx +10 -0
  44. package/src/components/MobilePanelToggleButton.tsx +39 -0
  45. package/src/hooks/useMinimumDelay.ts +20 -0
  46. package/src/hooks/useMobileEditorPanels.ts +56 -0
  47. package/src/hooks/useSyncProjectPageStore.ts +40 -0
  48. package/src/modals/ScreenColorsModal.tsx +115 -0
  49. package/src/modals/index.ts +1 -0
  50. package/src/pages/ProjectPage.tsx +53 -243
  51. package/src/pages/tabs/BuilderPanel.tsx +14 -8
  52. package/src/store.ts +10 -6
  53. package/src/styles/base/_global.scss +12 -4
  54. package/src/styles/components/_attributes-editor.scss +9 -1
  55. package/src/styles/components/_bottom-bar.scss +113 -0
  56. package/src/styles/components/_editor-shell.scss +0 -19
  57. package/src/styles/index.scss +1 -0
  58. package/src/utils/analyseNodeByPatterns.ts +15 -0
  59. package/src/utils/nodeTree.ts +99 -0
  60. package/dist/build-components/PaywallSubscriButton/PaywallSubscriButton.d.ts +0 -5
  61. package/dist/build-components/PaywallSubscriButton/PaywallSubscriButtonProps.generated.d.ts +0 -50
  62. package/dist/pages/tabs/SideTool.d.ts +0 -8
  63. package/src/build-components/PaywallSubscriButton/PaywallSubscriButton.tsx +0 -10
  64. package/src/build-components/PaywallSubscriButton/PaywallSubscriButtonProps.generated.ts +0 -77
  65. package/src/build-components/PaywallSubscriButton/pattern.json +0 -27
  66. package/src/pages/tabs/SideTool.tsx +0 -253
package/src/assets/samples/vpn-onboard-3.json CHANGED
@@ -85,307 +85,308 @@
85
85
  "children": [
86
86
  {
87
87
  "type": "OnboardProvider",
88
- "children": [
89
- {
90
- "type": "Onboard",
91
88
  "children": [
92
89
  {
93
- "type": "OnboardItem",
94
- "key": "app_onboard-page1",
90
+ "type": "Onboard",
95
91
  "children": [
96
92
  {
97
- "type": "OnboardTitle",
98
- "attributes": {
99
- "color": "#12131A",
100
- "textAlign": "center",
101
- "marginTop": 40
102
- },
103
- "children": "onboard.title.one-page2"
93
+ "type": "OnboardItem",
94
+ "key": "app_onboard-page1",
95
+ "children": [
96
+ {
97
+ "type": "OnboardTitle",
98
+ "attributes": {
99
+ "color": "#12131A",
100
+ "textAlign": "center",
101
+ "marginTop": 40
102
+ },
103
+ "children": "onboard.title.one-page2"
104
+ },
105
+ {
106
+ "type": "OnboardImage",
107
+ "attributes": {
108
+ "src": "https://textcall-dev.s3.amazonaws.com/onboard/high/c68cca84580d6920c883c220e57346c0.jpg",
109
+ "height": 350,
110
+ "resizeMode": "contain"
111
+ },
112
+ "children": null
113
+ },
114
+ {
115
+ "type": "OnboardSubtitle",
116
+ "attributes": {
117
+ "color": "#44454D",
118
+ "fontSize": 16,
119
+ "textAlign": "center"
120
+ },
121
+ "children": "onboard.subtitle.one-page2"
122
+ }
123
+ ]
104
124
  },
105
125
  {
106
- "type": "OnboardImage",
107
- "attributes": {
108
- "src": "https://textcall-dev.s3.amazonaws.com/onboard/high/c68cca84580d6920c883c220e57346c0.jpg",
109
- "height": 350,
110
- "resizeMode": "contain"
111
- }
126
+ "type": "OnboardItem",
127
+ "key": "app_onboard-page2",
128
+ "children": [
129
+ {
130
+ "type": "OnboardTitle",
131
+ "attributes": {
132
+ "color": "#12131A",
133
+ "textAlign": "center",
134
+ "marginTop": 40
135
+ },
136
+ "children": "onboard.title.two-page2"
137
+ },
138
+ {
139
+ "type": "OnboardSubtitle",
140
+ "attributes": {
141
+ "color": "#44454D",
142
+ "fontSize": 16,
143
+ "textAlign": "center"
144
+ },
145
+ "children": "onboard.subtitle.two-page"
146
+ }
147
+ ]
112
148
  },
113
149
  {
114
- "type": "OnboardSubtitle",
115
- "attributes": {
116
- "color": "#44454D",
117
- "fontSize": 16,
118
- "textAlign": "center"
119
- },
120
- "children": "onboard.subtitle.one-page2"
150
+ "type": "OnboardItem",
151
+ "key": "app_onboard-page3",
152
+ "children": [
153
+ {
154
+ "type": "OnboardTitle",
155
+ "attributes": {
156
+ "color": "#12131A",
157
+ "textAlign": "center",
158
+ "marginTop": 40
159
+ },
160
+ "children": "onboard.title.three-page2"
161
+ },
162
+ {
163
+ "type": "OnboardSubtitle",
164
+ "attributes": {
165
+ "color": "#44454D",
166
+ "fontSize": 16,
167
+ "textAlign": "center"
168
+ },
169
+ "children": "onboard.subtitle.three-page2"
170
+ }
171
+ ]
172
+ },
173
+ {
174
+ "type": "OnboardItem",
175
+ "key": "app_onboard-page4",
176
+ "children": [
177
+ {
178
+ "type": "OnboardTitle",
179
+ "attributes": {
180
+ "color": "#12131A",
181
+ "textAlign": "center",
182
+ "marginTop": 40
183
+ },
184
+ "children": "onboard.title.four-page2"
185
+ },
186
+ {
187
+ "type": "OnboardSubtitle",
188
+ "attributes": {
189
+ "color": "#44454D",
190
+ "fontSize": 16,
191
+ "textAlign": "center"
192
+ },
193
+ "children": "onboard.subtitle.four-page2"
194
+ }
195
+ ]
121
196
  }
122
197
  ]
123
198
  },
124
199
  {
125
- "type": "OnboardItem",
126
- "key": "app_onboard-page2",
200
+ "type": "OnboardDot",
201
+ "attributes": {
202
+ "dotType": "expanding_dot"
203
+ },
204
+ "children": null
205
+ },
206
+ {
207
+ "type": "OnboardButtons",
208
+ "attributes": {
209
+ "buttons_direction": "row",
210
+ "condition": "carousel-index",
211
+ "conditionVariable": 0
212
+ },
127
213
  "children": [
128
214
  {
129
- "type": "OnboardTitle",
215
+ "type": "OnboardButton",
130
216
  "attributes": {
131
- "color": "#12131A",
132
- "textAlign": "center",
133
- "marginTop": 40
217
+ "labelKey": "onboard.skip.one-page",
218
+ "button_text_color": "#81838F",
219
+ "button_background_color": "#ffffff00",
220
+ "flex": 1,
221
+ "events": [
222
+ {
223
+ "type": "Navigate",
224
+ "targetIndex": 3
225
+ }
226
+ ]
134
227
  },
135
- "children": "onboard.title.two-page2"
228
+ "children": null
136
229
  },
137
230
  {
138
- "type": "OnboardSubtitle",
231
+ "type": "OnboardButton",
139
232
  "attributes": {
140
- "color": "#44454D",
141
- "fontSize": 16,
142
- "textAlign": "center"
233
+ "labelKey": "onboard.next.one-page",
234
+ "button_text_color": "#FFFFFF",
235
+ "button_background_color": "#0066FF",
236
+ "flex": 1,
237
+ "events": [
238
+ {
239
+ "type": "Navigate",
240
+ "targetIndex": 1
241
+ }
242
+ ]
143
243
  },
144
- "children": "onboard.subtitle.two-page"
244
+ "children": null
145
245
  }
146
246
  ]
147
247
  },
148
248
  {
149
- "type": "OnboardItem",
150
- "key": "app_onboard-page3",
249
+ "type": "OnboardButtons",
250
+ "attributes": {
251
+ "buttons_direction": "row",
252
+ "condition": "carousel-index",
253
+ "conditionVariable": 1
254
+ },
151
255
  "children": [
152
256
  {
153
- "type": "OnboardTitle",
257
+ "type": "OnboardButton",
154
258
  "attributes": {
155
- "color": "#12131A",
156
- "textAlign": "center",
157
- "marginTop": 40
259
+ "labelKey": "onboard.skip.two-page",
260
+ "button_text_color": "#81838F",
261
+ "button_background_color": "#ffffff00",
262
+ "flex": 1,
263
+ "events": [
264
+ {
265
+ "type": "Permission",
266
+ "permission": "att"
267
+ },
268
+ {
269
+ "type": "Navigate",
270
+ "targetIndex": 3
271
+ }
272
+ ]
158
273
  },
159
- "children": "onboard.title.three-page2"
274
+ "children": null
160
275
  },
161
276
  {
162
- "type": "OnboardSubtitle",
277
+ "type": "OnboardButton",
163
278
  "attributes": {
164
- "color": "#44454D",
165
- "fontSize": 16,
166
- "textAlign": "center"
279
+ "labelKey": "onboard.next.two-page",
280
+ "button_text_color": "#FFFFFF",
281
+ "button_background_color": "#0066FF",
282
+ "flex": 1,
283
+ "events": [
284
+ {
285
+ "type": "Permission",
286
+ "permission": "att"
287
+ },
288
+ {
289
+ "type": "Navigate",
290
+ "targetIndex": 2
291
+ }
292
+ ]
167
293
  },
168
- "children": "onboard.subtitle.three-page2"
294
+ "children": null
169
295
  }
170
296
  ]
171
297
  },
172
298
  {
173
- "type": "OnboardItem",
174
- "key": "app_onboard-page4",
299
+ "type": "OnboardButtons",
300
+ "attributes": {
301
+ "buttons_direction": "row",
302
+ "condition": "carousel-index",
303
+ "conditionVariable": 2
304
+ },
175
305
  "children": [
176
306
  {
177
- "type": "OnboardTitle",
307
+ "type": "OnboardButton",
178
308
  "attributes": {
179
- "color": "#12131A",
180
- "textAlign": "center",
181
- "marginTop": 40
309
+ "labelKey": "onboard.skip.three-page",
310
+ "button_text_color": "#81838F",
311
+ "button_background_color": "#ffffff00",
312
+ "flex": 1,
313
+ "events": [
314
+ {
315
+ "type": "Navigate",
316
+ "targetIndex": 3
317
+ }
318
+ ]
182
319
  },
183
- "children": "onboard.title.four-page2"
320
+ "children": null
184
321
  },
185
322
  {
186
- "type": "OnboardSubtitle",
323
+ "type": "OnboardButton",
187
324
  "attributes": {
188
- "color": "#44454D",
189
- "fontSize": 16,
190
- "textAlign": "center"
325
+ "labelKey": "onboard.next.three-page",
326
+ "button_text_color": "#FFFFFF",
327
+ "button_background_color": "#0066FF",
328
+ "flex": 1,
329
+ "events": [
330
+ {
331
+ "type": "Permission",
332
+ "permission": "rating"
333
+ },
334
+ {
335
+ "type": "Navigate",
336
+ "targetIndex": 3
337
+ }
338
+ ]
191
339
  },
192
- "children": "onboard.subtitle.four-page2"
340
+ "children": null
193
341
  }
194
342
  ]
195
- }
196
- ]
197
- },
198
- {
199
- "type": "OnboardDot",
200
- "attributes": {
201
- "dotType": "expanding_dot"
202
- }
203
- },
204
- {
205
- "type": "OnboardButtons",
206
- "attributes": {
207
- "buttons_direction": "row",
208
- "condition": "carousel-index",
209
- "conditionVariable": 0
210
- },
211
- "children": [
212
- {
213
- "type": "OnboardButton",
214
- "attributes": {
215
- "labelKey": "onboard.skip.one-page",
216
- "button_text_color": "#81838F",
217
- "button_background_color": "#ffffff00",
218
- "flex": 1,
219
- "events": [
220
- {
221
- "type": "Navigate",
222
- "navigate_to": null,
223
- "targetIndex": 3
224
- }
225
- ]
226
- }
227
- },
228
- {
229
- "type": "OnboardButton",
230
- "attributes": {
231
- "labelKey": "onboard.next.one-page",
232
- "button_text_color": "#FFFFFF",
233
- "button_background_color": "#0066FF",
234
- "flex": 1,
235
- "events": [
236
- {
237
- "type": "Navigate",
238
- "navigate_to": null,
239
- "targetIndex": 1
240
- }
241
- ]
242
- }
243
- }
244
- ]
245
- },
246
- {
247
- "type": "OnboardButtons",
248
- "attributes": {
249
- "buttons_direction": "row",
250
- "condition": "carousel-index",
251
- "conditionVariable": 1
252
- },
253
- "children": [
254
- {
255
- "type": "OnboardButton",
256
- "attributes": {
257
- "labelKey": "onboard.skip.two-page",
258
- "button_text_color": "#81838F",
259
- "button_background_color": "#ffffff00",
260
- "flex": 1,
261
- "events": [
262
- {
263
- "type": "Permission",
264
- "permission": "att"
265
- },
266
- {
267
- "type": "Navigate",
268
- "navigate_to": null,
269
- "targetIndex": 3
270
- }
271
- ]
272
- }
273
343
  },
274
344
  {
275
- "type": "OnboardButton",
345
+ "type": "OnboardButtons",
276
346
  "attributes": {
277
- "labelKey": "onboard.next.two-page",
278
- "button_text_color": "#FFFFFF",
279
- "button_background_color": "#0066FF",
280
- "flex": 1,
281
- "events": [
282
- {
283
- "type": "Permission",
284
- "permission": "att"
347
+ "buttons_direction": "row",
348
+ "condition": "carousel-index",
349
+ "conditionVariable": 3
350
+ },
351
+ "children": [
352
+ {
353
+ "type": "OnboardButton",
354
+ "attributes": {
355
+ "labelKey": "onboard.allow.four-page",
356
+ "button_text_color": "#FFFFFF",
357
+ "button_background_color": "#0066FF",
358
+ "flex": 1,
359
+ "events": [
360
+ {
361
+ "type": "Permission",
362
+ "permission": "notification"
363
+ },
364
+ {
365
+ "type": "Navigate",
366
+ "navigate_to": "home"
367
+ }
368
+ ]
285
369
  },
286
- {
287
- "type": "Navigate",
288
- "navigate_to": null,
289
- "targetIndex": 2
290
- }
291
- ]
292
- }
293
- }
294
- ]
295
- },
296
- {
297
- "type": "OnboardButtons",
298
- "attributes": {
299
- "buttons_direction": "row",
300
- "condition": "carousel-index",
301
- "conditionVariable": 2
302
- },
303
- "children": [
304
- {
305
- "type": "OnboardButton",
306
- "attributes": {
307
- "labelKey": "onboard.skip.three-page",
308
- "button_text_color": "#81838F",
309
- "button_background_color": "#ffffff00",
310
- "flex": 1,
311
- "events": [
312
- {
313
- "type": "Navigate",
314
- "navigate_to": null,
315
- "targetIndex": 3
316
- }
317
- ]
318
- }
370
+ "children": null
371
+ }
372
+ ]
319
373
  },
320
374
  {
321
- "type": "OnboardButton",
375
+ "type": "OnboardFooter",
322
376
  "attributes": {
323
- "labelKey": "onboard.next.three-page",
324
- "button_text_color": "#FFFFFF",
325
- "button_background_color": "#0066FF",
326
- "flex": 1,
327
- "events": [
328
- {
329
- "type": "Permission",
330
- "permission": "rating"
331
- },
332
- {
333
- "type": "Navigate",
334
- "navigate_to": null,
335
- "targetIndex": 3
336
- }
337
- ]
338
- }
377
+ "gap": 8,
378
+ "textLocalizationKey": "view.onboarding.footer.description",
379
+ "textColor": "#81838F",
380
+ "linkedWordFirstLocalizationKey": "view.onboarding.btnPrivacy",
381
+ "linkedWordFirstColor": "#81838F",
382
+ "linkedWordFirstPage": "privacy",
383
+ "linkedWordSecondLocalizationKey": "view.onboarding.btnTerms",
384
+ "linkedWordSecondColor": "#81838F",
385
+ "linkedWordSecondPage": "terms"
386
+ },
387
+ "children": null
339
388
  }
340
389
  ]
341
- },
342
- {
343
- "type": "OnboardButtons",
344
- "attributes": {
345
- "buttons_direction": "row",
346
- "condition": "carousel-index",
347
- "conditionVariable": 3
348
- },
349
- "children": [
350
- {
351
- "type": "OnboardButton",
352
- "attributes": {
353
- "labelKey": "onboard.allow.four-page",
354
- "button_text_color": "#FFFFFF",
355
- "button_background_color": "#0066FF",
356
- "flex": 1,
357
- "events": [
358
- {
359
- "type": "Permission",
360
- "permission": "notification"
361
- },
362
- {
363
- "type": "Navigate",
364
- "navigate_to": "home"
365
- }
366
- ]
367
- }
368
- }
369
- ]
370
- },
371
- {
372
- "type": "OnboardFooter",
373
- "attributes": {
374
- "gap": 8,
375
- "textLocalizationKey": "view.onboarding.footer.description",
376
- "textColor": "#81838F",
377
- "linkedWordFirstLocalizationKey": "view.onboarding.btnPrivacy",
378
- "linkedWordFirstColor": "#81838F",
379
- "linkedWordFirstPage": "privacy",
380
- "linkedWordSecondLocalizationKey": "view.onboarding.btnTerms",
381
- "linkedWordSecondColor": "#81838F",
382
- "linkedWordSecondPage": "terms"
383
- }
384
- }
385
- ],
386
- "attributes": {
387
- "theme": "light"
388
- }
389
390
  }
390
391
  ]
391
392
  }