@developer_tribe/react-builder 0.1.30 → 0.1.32

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 (59) hide show
  1. package/dist/build-components/Button/ButtonProps.generated.d.ts +2 -1
  2. package/dist/build-components/CarouselButtons/CarouselButtonsProps.generated.d.ts +2 -1
  3. package/dist/build-components/CarouselDots/CarouselDotsProps.generated.d.ts +2 -1
  4. package/dist/build-components/Image/ImageProps.generated.d.ts +2 -1
  5. package/dist/build-components/OnboardButton/OnboardButtonProps.generated.d.ts +8 -5
  6. package/dist/build-components/OnboardButtons/OnboardButtonsProps.generated.d.ts +6 -3
  7. package/dist/build-components/OnboardDot/OnboardDotProps.generated.d.ts +2 -1
  8. package/dist/build-components/OnboardFooter/OnboardFooterProps.generated.d.ts +10 -4
  9. package/dist/build-components/OnboardImage/OnboardImageProps.generated.d.ts +4 -1
  10. package/dist/build-components/OnboardItem/OnboardItemProps.generated.d.ts +4 -2
  11. package/dist/build-components/OnboardSubtitle/OnboardSubtitleProps.generated.d.ts +10 -4
  12. package/dist/build-components/OnboardTitle/OnboardTitleProps.generated.d.ts +10 -4
  13. package/dist/build-components/Text/TextProps.generated.d.ts +10 -4
  14. package/dist/build-components/View/ViewProps.generated.d.ts +6 -3
  15. package/dist/build-components/patterns.generated.d.ts +11 -7
  16. package/dist/index.cjs.js +6 -4
  17. package/dist/index.d.ts +3 -0
  18. package/dist/index.esm.js +6 -4
  19. package/dist/utils/extractImageStyle.d.ts +3 -0
  20. package/dist/utils/extractTextStyle.d.ts +3 -0
  21. package/dist/utils/extractViewStyle.d.ts +3 -0
  22. package/package.json +2 -1
  23. package/scripts/prebuild/prebuild.js +1 -1
  24. package/scripts/prebuild/utils/createGeneratedProps.js +64 -5
  25. package/src/assets/samples/getSamples.ts +6 -0
  26. package/src/assets/samples/vpn-onboard-5.json +1025 -0
  27. package/src/assets/samples/vpn-onboard-6.json +709 -0
  28. package/src/build-components/Button/ButtonProps.generated.ts +14 -12
  29. package/src/build-components/CarouselButtons/CarouselButtonsProps.generated.ts +6 -1
  30. package/src/build-components/CarouselDots/CarouselDotsProps.generated.ts +9 -7
  31. package/src/build-components/Image/Image.tsx +2 -13
  32. package/src/build-components/Image/ImageProps.generated.ts +3 -1
  33. package/src/build-components/OnboardButton/OnboardButton.tsx +4 -5
  34. package/src/build-components/OnboardButton/OnboardButtonProps.generated.ts +14 -10
  35. package/src/build-components/OnboardButton/pattern.json +3 -3
  36. package/src/build-components/OnboardButtons/OnboardButtonsProps.generated.ts +10 -3
  37. package/src/build-components/OnboardDot/OnboardDotProps.generated.ts +9 -7
  38. package/src/build-components/OnboardFooter/OnboardFooter.tsx +2 -29
  39. package/src/build-components/OnboardFooter/OnboardFooterProps.generated.ts +33 -21
  40. package/src/build-components/OnboardImage/OnboardImage.tsx +24 -1
  41. package/src/build-components/OnboardImage/OnboardImageProps.generated.ts +5 -1
  42. package/src/build-components/OnboardImage/pattern.json +3 -5
  43. package/src/build-components/OnboardItem/OnboardItemProps.generated.ts +5 -2
  44. package/src/build-components/OnboardProvider/OnboardProvider.tsx +0 -1
  45. package/src/build-components/OnboardSubtitle/OnboardSubtitleProps.generated.ts +33 -21
  46. package/src/build-components/OnboardTitle/OnboardTitle.tsx +0 -1
  47. package/src/build-components/OnboardTitle/OnboardTitleProps.generated.ts +33 -21
  48. package/src/build-components/Text/Text.tsx +3 -12
  49. package/src/build-components/Text/TextProps.generated.ts +33 -21
  50. package/src/build-components/Text/pattern.json +3 -3
  51. package/src/build-components/View/View.tsx +2 -45
  52. package/src/build-components/View/ViewProps.generated.ts +18 -9
  53. package/src/build-components/patterns.generated.ts +11 -7
  54. package/src/build-components/useNode.ts +0 -1
  55. package/src/index.ts +3 -0
  56. package/src/utils/extractImageStyle.ts +24 -0
  57. package/src/utils/extractTextStyle.ts +109 -0
  58. package/src/utils/extractViewStyle.ts +44 -0
  59. package/src/utils/novaToJson.ts +10 -2
@@ -1,10 +1,11 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type FontWeightOptionType = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
2
3
  export interface ButtonPropsGenerated {
3
4
  child: string;
4
5
  attributes: {
5
6
  color?: string;
6
7
  fontSize?: number;
7
- fontWeight?: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
8
+ fontWeight?: FontWeightOptionType;
8
9
  };
9
10
  }
10
11
  export interface ButtonComponentProps {
@@ -1,8 +1,9 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type ButtonTypeOptionType = 'previous_button' | 'next_button' | 'skip_button';
2
3
  export interface CarouselButtonsPropsGenerated {
3
4
  child: string;
4
5
  attributes: {
5
- buttonType?: 'previous_button' | 'next_button' | 'skip_button';
6
+ buttonType?: ButtonTypeOptionType;
6
7
  skipNumber?: number;
7
8
  };
8
9
  }
@@ -1,8 +1,9 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type DotTypeOptionType = 'expanding_dot' | 'normal_dot' | 'scaling_dot' | 'sliding_border' | 'sliding_dot' | 'liquid_like';
2
3
  export interface CarouselDotsPropsGenerated {
3
4
  child: string;
4
5
  attributes: {
5
- dotType?: 'expanding_dot' | 'normal_dot' | 'scaling_dot' | 'sliding_border' | 'sliding_dot' | 'liquid_like';
6
+ dotType?: DotTypeOptionType;
6
7
  };
7
8
  }
8
9
  export interface CarouselDotsComponentProps {
@@ -1,11 +1,12 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type ResizeModeOptionType = 'cover' | 'contain' | 'stretch' | 'center';
2
3
  export interface ImagePropsGenerated {
3
4
  child: string;
4
5
  attributes: {
5
6
  src?: string;
6
7
  width?: number;
7
8
  height?: number;
8
- resizeMode?: 'cover' | 'contain' | 'stretch' | 'center';
9
+ resizeMode?: ResizeModeOptionType;
9
10
  borderRadius?: number;
10
11
  };
11
12
  }
@@ -1,19 +1,22 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type TypeOptionType = 'Permission' | 'Navigate';
3
+ export type PermissionOptionType = 'att' | 'notification' | 'rating' | 'GDPR';
4
+ export type AnimationOptionType = 'simple-animation' | 'line-animation' | 'blur' | 'blur-animation' | 'blur-line-animation';
2
5
  export interface EventObjectGenerated {
3
- type?: 'Permission' | 'Navigate';
4
- permission?: 'att' | 'notification' | 'rating' | 'null';
5
- navigate_to?: 'string' | 'null';
6
+ type?: TypeOptionType;
7
+ permission?: PermissionOptionType | null;
8
+ navigate_to?: string;
9
+ targetIndex?: number;
6
10
  }
7
11
  export interface OnboardButtonPropsGenerated {
8
12
  child: string;
9
13
  attributes: {
10
14
  labelKey?: string;
11
15
  button_text_color?: string;
12
- animation?: 'simple-animation' | 'line-animation' | 'blur' | 'blur-animation' | 'blur-line-animation';
16
+ animation?: AnimationOptionType;
13
17
  animation_color?: string;
14
18
  button_background_color?: string;
15
19
  flex?: number;
16
- targetIndex?: number;
17
20
  events?: EventObjectGenerated[];
18
21
  };
19
22
  }
@@ -1,13 +1,16 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type ButtonTypeOptionType = 'previous_button' | 'next_button' | 'skip_button';
3
+ export type ButtonsDirectionOptionType = 'row' | 'column';
4
+ export type ConditionOptionType = 'carousel-index';
2
5
  export interface OnboardButtonsPropsGenerated {
3
6
  child: string;
4
7
  attributes: {
5
- buttonType?: 'previous_button' | 'next_button' | 'skip_button';
8
+ buttonType?: ButtonTypeOptionType;
6
9
  skipNumber?: number;
7
- buttons_direction?: 'row' | 'column';
10
+ buttons_direction?: ButtonsDirectionOptionType;
8
11
  forIndex?: number;
9
12
  seperatorColor?: string;
10
- condition?: 'carousel-index';
13
+ condition?: ConditionOptionType;
11
14
  conditionVariable?: number;
12
15
  };
13
16
  }
@@ -1,8 +1,9 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type DotTypeOptionType = 'expanding_dot' | 'normal_dot' | 'scaling_dot' | 'sliding_border' | 'sliding_dot' | 'liquid_like';
2
3
  export interface OnboardDotPropsGenerated {
3
4
  child: string;
4
5
  attributes: {
5
- dotType?: 'expanding_dot' | 'normal_dot' | 'scaling_dot' | 'sliding_border' | 'sliding_dot' | 'liquid_like';
6
+ dotType?: DotTypeOptionType;
6
7
  inactive_dot_opacity?: number;
7
8
  expanding_dot_width?: number;
8
9
  dot_style?: string;
@@ -1,14 +1,20 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type FontWeightOptionType = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
3
+ export type TextAlignOptionType = 'left' | 'center' | 'right' | 'justify';
4
+ export type FlexDirectionOptionType = 'row' | 'column';
5
+ export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
6
+ export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
2
7
  export interface OnboardFooterPropsGenerated {
3
8
  child: string;
4
9
  attributes: {
5
10
  color?: string;
6
11
  fontSize?: number;
7
- fontWeight?: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
12
+ fontWeight?: FontWeightOptionType;
13
+ textAlign?: TextAlignOptionType;
8
14
  scrollable?: boolean;
9
- flexDirection?: 'row' | 'column';
10
- alignItems?: 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
11
- justifyContent?: 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
15
+ flexDirection?: FlexDirectionOptionType;
16
+ alignItems?: AlignItemsOptionType;
17
+ justifyContent?: JustifyContentOptionType;
12
18
  gap?: string;
13
19
  padding?: number;
14
20
  paddingHorizontal?: string;
@@ -1,12 +1,15 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type ResizeModeOptionType = 'cover' | 'contain' | 'stretch' | 'center';
2
3
  export interface OnboardImagePropsGenerated {
3
4
  child: string;
4
5
  attributes: {
5
6
  src?: string;
6
7
  width?: number;
7
8
  height?: number;
8
- resizeMode?: 'cover' | 'contain' | 'stretch' | 'center';
9
+ resizeMode?: ResizeModeOptionType;
9
10
  borderRadius?: number;
11
+ video_url?: string;
12
+ lottie?: string;
10
13
  };
11
14
  }
12
15
  export interface OnboardImageComponentProps {
@@ -1,10 +1,12 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type DisplayOptionType = 'flex' | 'block';
3
+ export type FlexDirectionOptionType = 'row' | 'column';
2
4
  export interface OnboardItemPropsGenerated {
3
5
  child: string;
4
6
  attributes: {
5
- display?: 'flex' | 'block';
7
+ display?: DisplayOptionType;
6
8
  gap?: string;
7
- flexDirection?: 'row' | 'column';
9
+ flexDirection?: FlexDirectionOptionType;
8
10
  paddingHorizontal?: string;
9
11
  };
10
12
  }
@@ -1,14 +1,20 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type FontWeightOptionType = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
3
+ export type TextAlignOptionType = 'left' | 'center' | 'right' | 'justify';
4
+ export type FlexDirectionOptionType = 'row' | 'column';
5
+ export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
6
+ export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
2
7
  export interface OnboardSubtitlePropsGenerated {
3
8
  child: string;
4
9
  attributes: {
5
10
  color?: string;
6
11
  fontSize?: number;
7
- fontWeight?: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
12
+ fontWeight?: FontWeightOptionType;
13
+ textAlign?: TextAlignOptionType;
8
14
  scrollable?: boolean;
9
- flexDirection?: 'row' | 'column';
10
- alignItems?: 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
11
- justifyContent?: 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
15
+ flexDirection?: FlexDirectionOptionType;
16
+ alignItems?: AlignItemsOptionType;
17
+ justifyContent?: JustifyContentOptionType;
12
18
  gap?: string;
13
19
  padding?: number;
14
20
  paddingHorizontal?: string;
@@ -1,14 +1,20 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type FontWeightOptionType = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
3
+ export type TextAlignOptionType = 'left' | 'center' | 'right' | 'justify';
4
+ export type FlexDirectionOptionType = 'row' | 'column';
5
+ export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
6
+ export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
2
7
  export interface OnboardTitlePropsGenerated {
3
8
  child: string;
4
9
  attributes: {
5
10
  color?: string;
6
11
  fontSize?: number;
7
- fontWeight?: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
12
+ fontWeight?: FontWeightOptionType;
13
+ textAlign?: TextAlignOptionType;
8
14
  scrollable?: boolean;
9
- flexDirection?: 'row' | 'column';
10
- alignItems?: 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
11
- justifyContent?: 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
15
+ flexDirection?: FlexDirectionOptionType;
16
+ alignItems?: AlignItemsOptionType;
17
+ justifyContent?: JustifyContentOptionType;
12
18
  gap?: string;
13
19
  padding?: number;
14
20
  paddingHorizontal?: string;
@@ -1,11 +1,16 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type FlexDirectionOptionType = 'row' | 'column';
3
+ export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
4
+ export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
5
+ export type FontWeightOptionType = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
6
+ export type TextAlignOptionType = 'left' | 'center' | 'right' | 'justify';
2
7
  export interface TextPropsGenerated {
3
8
  child: string;
4
9
  attributes: {
5
10
  scrollable?: boolean;
6
- flexDirection?: 'row' | 'column';
7
- alignItems?: 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
8
- justifyContent?: 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
11
+ flexDirection?: FlexDirectionOptionType;
12
+ alignItems?: AlignItemsOptionType;
13
+ justifyContent?: JustifyContentOptionType;
9
14
  gap?: string;
10
15
  padding?: number;
11
16
  paddingHorizontal?: string;
@@ -27,7 +32,8 @@ export interface TextPropsGenerated {
27
32
  height?: number;
28
33
  color?: string;
29
34
  fontSize?: number;
30
- fontWeight?: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
35
+ fontWeight?: FontWeightOptionType;
36
+ textAlign?: TextAlignOptionType;
31
37
  };
32
38
  }
33
39
  export interface TextComponentProps {
@@ -1,11 +1,14 @@
1
1
  import type { NodeData } from '../../types/Node';
2
+ export type FlexDirectionOptionType = 'row' | 'column';
3
+ export type AlignItemsOptionType = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
4
+ export type JustifyContentOptionType = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
2
5
  export interface ViewPropsGenerated {
3
6
  child: string;
4
7
  attributes: {
5
8
  scrollable?: boolean;
6
- flexDirection?: 'row' | 'column';
7
- alignItems?: 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
8
- justifyContent?: 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
9
+ flexDirection?: FlexDirectionOptionType;
10
+ alignItems?: AlignItemsOptionType;
11
+ justifyContent?: JustifyContentOptionType;
9
12
  gap?: string;
10
13
  padding?: number;
11
14
  paddingHorizontal?: string;
@@ -90,15 +90,15 @@ export declare const patterns: readonly [{
90
90
  readonly animation_color: "string";
91
91
  readonly button_background_color: "string";
92
92
  readonly flex: "number";
93
- readonly targetIndex: "number";
94
93
  readonly events: "EventObject[]";
95
94
  };
96
95
  };
97
96
  readonly types: {
98
97
  readonly EventObject: {
99
98
  readonly type: readonly ["Permission", "Navigate"];
100
- readonly permission: readonly ["att", "notification", "rating", "null"];
101
- readonly navigate_to: readonly ["string", "null"];
99
+ readonly permission: readonly ["att", "notification", "rating", "GDPR", "null"];
100
+ readonly navigate_to: "string";
101
+ readonly targetIndex: "number";
102
102
  };
103
103
  };
104
104
  }, {
@@ -142,6 +142,7 @@ export declare const patterns: readonly [{
142
142
  readonly color: "string";
143
143
  readonly fontSize: "number";
144
144
  readonly fontWeight: readonly ["normal", "bold", "100", "200", "300", "400", "500", "600", "700", "800", "900"];
145
+ readonly textAlign: readonly ["left", "center", "right", "justify"];
145
146
  readonly scrollable: "boolean";
146
147
  readonly flexDirection: readonly ["row", "column"];
147
148
  readonly alignItems: readonly ["flex-start", "center", "flex-end", "stretch", "baseline"];
@@ -173,7 +174,6 @@ export declare const patterns: readonly [{
173
174
  readonly linkedWordSecondColor: "string";
174
175
  readonly linkedWordSecondPage: "string";
175
176
  };
176
- readonly textAlign: readonly ["left", "center", "right", "justify"];
177
177
  };
178
178
  readonly defaults: {
179
179
  readonly paddingHorizontal: "24@s";
@@ -191,8 +191,12 @@ export declare const patterns: readonly [{
191
191
  readonly height: "number";
192
192
  readonly resizeMode: readonly ["cover", "contain", "stretch", "center"];
193
193
  readonly borderRadius: "number";
194
+ readonly video_url: "string";
195
+ readonly lottie: "string";
194
196
  };
195
197
  };
198
+ readonly types: {};
199
+ readonly defaults: {};
196
200
  }, {
197
201
  readonly schemaVersion: 1;
198
202
  readonly allowUnknownAttributes: false;
@@ -243,6 +247,7 @@ export declare const patterns: readonly [{
243
247
  readonly color: "string";
244
248
  readonly fontSize: "number";
245
249
  readonly fontWeight: readonly ["normal", "bold", "100", "200", "300", "400", "500", "600", "700", "800", "900"];
250
+ readonly textAlign: readonly ["left", "center", "right", "justify"];
246
251
  readonly scrollable: "boolean";
247
252
  readonly flexDirection: readonly ["row", "column"];
248
253
  readonly alignItems: readonly ["flex-start", "center", "flex-end", "stretch", "baseline"];
@@ -267,7 +272,6 @@ export declare const patterns: readonly [{
267
272
  readonly width: "number";
268
273
  readonly height: "number";
269
274
  };
270
- readonly textAlign: readonly ["left", "center", "right", "justify"];
271
275
  };
272
276
  readonly defaults: {
273
277
  readonly fontSize: "14@fs";
@@ -284,6 +288,7 @@ export declare const patterns: readonly [{
284
288
  readonly color: "string";
285
289
  readonly fontSize: "number";
286
290
  readonly fontWeight: readonly ["normal", "bold", "100", "200", "300", "400", "500", "600", "700", "800", "900"];
291
+ readonly textAlign: readonly ["left", "center", "right", "justify"];
287
292
  readonly scrollable: "boolean";
288
293
  readonly flexDirection: readonly ["row", "column"];
289
294
  readonly alignItems: readonly ["flex-start", "center", "flex-end", "stretch", "baseline"];
@@ -308,7 +313,6 @@ export declare const patterns: readonly [{
308
313
  readonly width: "number";
309
314
  readonly height: "number";
310
315
  };
311
- readonly textAlign: readonly ["left", "center", "right", "justify"];
312
316
  };
313
317
  readonly defaults: {
314
318
  readonly fontSize: "24@fs";
@@ -349,8 +353,8 @@ export declare const patterns: readonly [{
349
353
  readonly color: "string";
350
354
  readonly fontSize: "number";
351
355
  readonly fontWeight: readonly ["normal", "bold", "100", "200", "300", "400", "500", "600", "700", "800", "900"];
356
+ readonly textAlign: readonly ["left", "center", "right", "justify"];
352
357
  };
353
- readonly textAlign: readonly ["left", "center", "right", "justify"];
354
358
  };
355
359
  readonly types: {};
356
360
  readonly defaults: {};