@developer_tribe/react-builder 1.0.6 → 1.0.7

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