@developer_tribe/react-builder 1.2.44-test.2 → 1.2.44
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.
- package/dist/attributes-editor/Field.d.ts +1 -3
- package/dist/attributes-editor/attributesEditorModelTypes.d.ts +0 -3
- package/dist/attributes-editor/useAttributesEditorModel.d.ts +1 -1
- package/dist/build-components/FormSubmitButton/FormSubmitButtonProps.generated.d.ts +3 -8
- package/dist/build-components/OnboardButton/OnboardButtonProps.generated.d.ts +3 -8
- package/dist/build-components/OnboardProvider/OnboardProviderProps.generated.d.ts +0 -2
- package/dist/build-components/PaywallProvider/PaywallProviderProps.generated.d.ts +0 -2
- package/dist/build-components/SystemButton/SystemButtonProps.generated.d.ts +3 -8
- package/dist/build-components/SystemButton/usePlacementButtonEvents.d.ts +2 -15
- package/dist/build-components/index.d.ts +1 -3
- package/dist/build-components/patterns.generated.d.ts +1334 -2129
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1 -1
- package/dist/index.esm.js.map +1 -1
- package/dist/index.web.cjs.js +4 -4
- package/dist/index.web.cjs.js.map +1 -1
- package/dist/index.web.esm.js +3 -3
- package/dist/index.web.esm.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/utils/nodeTree.d.ts +0 -18
- package/package.json +1 -1
- package/scripts/prebuild/utils/validateAllComponentsOrThrow.js +4 -68
- package/src/assets/meta.json +1 -1
- package/src/assets/prompt-scheme-onboard.generated.ts +1 -1
- package/src/assets/prompt-scheme-paywall.generated.ts +1 -1
- package/src/assets/samples/getSamples.ts +0 -2
- package/src/assets/samples/terms-and-privacy-no-form.json +1 -1
- package/src/assets/samples/terms-and-privacy.json +1 -1
- package/src/attributes-editor/AttributesEditorView.tsx +0 -3
- package/src/attributes-editor/Field.tsx +2 -91
- package/src/attributes-editor/attributesEditorModelTypes.ts +0 -3
- package/src/attributes-editor/useAttributesEditorModel.ts +0 -8
- package/src/build-components/FormCheckbox/FormCheckbox.tsx +1 -3
- package/src/build-components/FormSubmitButton/FormSubmitButton.tsx +0 -6
- package/src/build-components/FormSubmitButton/FormSubmitButtonProps.generated.ts +3 -26
- package/src/build-components/OnboardButton/OnboardButton.tsx +1 -8
- package/src/build-components/OnboardButton/OnboardButtonProps.generated.ts +3 -26
- package/src/build-components/OnboardButton/pattern.json +3 -5
- package/src/build-components/OnboardProvider/OnboardProviderProps.generated.ts +0 -12
- package/src/build-components/OnboardProvider/pattern.json +1 -9
- package/src/build-components/PaywallProvider/PaywallProviderProps.generated.ts +0 -12
- package/src/build-components/PaywallProvider/pattern.json +1 -9
- package/src/build-components/RenderNode.generated.tsx +0 -10
- package/src/build-components/SystemButton/SystemButton.tsx +0 -6
- package/src/build-components/SystemButton/SystemButtonProps.generated.ts +3 -26
- package/src/build-components/SystemButton/pattern.json +3 -5
- package/src/build-components/SystemButton/usePlacementButtonEvents.ts +27 -51
- package/src/build-components/index.ts +0 -10
- package/src/build-components/patterns.generated.ts +1379 -2270
- package/src/components/AttributesEditorPanel.tsx +0 -1
- package/src/styles/index.scss +0 -1
- package/src/utils/analyseNodeByPatterns.ts +2 -5
- package/src/utils/nodeTree.ts +0 -115
- package/dist/build-components/GlobalProvider/GlobalContext.d.ts +0 -28
- package/dist/build-components/GlobalProvider/GlobalProvider.d.ts +0 -5
- package/dist/build-components/GlobalProvider/GlobalProviderProps.generated.d.ts +0 -60
- package/dist/build-components/GlobalProvider/globalProviderUtils.d.ts +0 -28
- package/dist/build-components/GlobalProvider/useGlobalNavigation.d.ts +0 -19
- package/dist/build-components/GlobalProvider/useGlobalProviderLogic.d.ts +0 -15
- package/dist/build-components/TermsProvider/TermsProvider.d.ts +0 -5
- package/dist/build-components/TermsProvider/TermsProviderProps.generated.d.ts +0 -55
- package/src/assets/samples/global-onboard-flow.json +0 -735
- package/src/build-components/GlobalProvider/GlobalContext.ts +0 -48
- package/src/build-components/GlobalProvider/GlobalProvider.tsx +0 -51
- package/src/build-components/GlobalProvider/GlobalProviderProps.generated.ts +0 -78
- package/src/build-components/GlobalProvider/globalProviderUtils.ts +0 -204
- package/src/build-components/GlobalProvider/pattern.json +0 -55
- package/src/build-components/GlobalProvider/useGlobalNavigation.ts +0 -65
- package/src/build-components/GlobalProvider/useGlobalProviderLogic.ts +0 -172
- package/src/build-components/TermsProvider/TermsProvider.tsx +0 -45
- package/src/build-components/TermsProvider/TermsProviderProps.generated.ts +0 -82
- package/src/build-components/TermsProvider/pattern.json +0 -35
- package/src/patterns/event-constants.json +0 -19
- package/src/styles/components/_global-provider.scss +0 -131
|
@@ -70,13 +70,11 @@ function validationArrayToRules(validation: string[] | undefined): {
|
|
|
70
70
|
}
|
|
71
71
|
|
|
72
72
|
/** FormCheckbox wraps Checkbox with RHF; UI and styling come from Checkbox. */
|
|
73
|
-
// eslint-disable-next-line react/prop-types
|
|
74
73
|
export function FormCheckbox({ node }: FormCheckboxComponentProps) {
|
|
75
74
|
useLogRender('FormCheckbox');
|
|
76
75
|
node = useNode(node);
|
|
77
76
|
const ctx = useContext(formContext);
|
|
78
|
-
|
|
79
|
-
const attrs = node?.attributes;
|
|
77
|
+
const attrs = node.attributes;
|
|
80
78
|
const name = attrs?.name as string | undefined;
|
|
81
79
|
const validation = attrs?.validation as string[] | undefined;
|
|
82
80
|
|
|
@@ -6,8 +6,6 @@ import useNode from '../useNode';
|
|
|
6
6
|
import { useLogRender } from '../../utils/useLogRender';
|
|
7
7
|
import { useMockOSContext, useMockPermission } from '../../mockOS';
|
|
8
8
|
import { usePlacementButtonEvents } from '../SystemButton/usePlacementButtonEvents';
|
|
9
|
-
import { useGlobalNavigation } from '../GlobalProvider/useGlobalNavigation';
|
|
10
|
-
import { useGlobalContext } from '../GlobalProvider/GlobalContext';
|
|
11
9
|
|
|
12
10
|
export function FormSubmitButton({ node }: FormSubmitButtonComponentProps) {
|
|
13
11
|
useLogRender('FormSubmitButton');
|
|
@@ -15,16 +13,12 @@ export function FormSubmitButton({ node }: FormSubmitButtonComponentProps) {
|
|
|
15
13
|
const ctx = useContext(formContext);
|
|
16
14
|
const context = useMockOSContext();
|
|
17
15
|
const mockPermissionManager = useMockPermission(context);
|
|
18
|
-
const globalNavigate = useGlobalNavigation();
|
|
19
|
-
const globalCtx = useGlobalContext();
|
|
20
16
|
const attrs = node.attributes;
|
|
21
17
|
|
|
22
18
|
const runPlacementEvents = usePlacementButtonEvents(attrs?.events, {
|
|
23
19
|
context,
|
|
24
20
|
requestPermission: (permission) =>
|
|
25
21
|
mockPermissionManager.requestPermission(permission),
|
|
26
|
-
globalNavigate,
|
|
27
|
-
setCondition: globalCtx?.setCondition,
|
|
28
22
|
});
|
|
29
23
|
|
|
30
24
|
const validationRequired =
|
|
@@ -2,28 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import type { NodeData } from '../../types/Node';
|
|
4
4
|
|
|
5
|
-
export type TypeOptionType =
|
|
6
|
-
| 'Permission'
|
|
7
|
-
| 'Navigate'
|
|
8
|
-
| 'Placement'
|
|
9
|
-
| 'SetCondition';
|
|
10
|
-
export type PermissionOptionType =
|
|
11
|
-
| 'notification'
|
|
12
|
-
| 'camera'
|
|
13
|
-
| 'microphone'
|
|
14
|
-
| 'location'
|
|
15
|
-
| 'photos'
|
|
16
|
-
| 'contacts'
|
|
17
|
-
| 'att'
|
|
18
|
-
| 'rating'
|
|
19
|
-
| 'GDPR';
|
|
20
|
-
export type PlacementKeyOptionType =
|
|
21
|
-
| 'terms'
|
|
22
|
-
| 'onboard'
|
|
23
|
-
| 'paywall'
|
|
24
|
-
| 'subscription'
|
|
25
|
-
| 'home';
|
|
26
|
-
export type ConditionKeyOptionType = 'termsAccepted';
|
|
5
|
+
export type TypeOptionType = 'Permission' | 'Navigate' | 'Placement';
|
|
27
6
|
export type FlexDirectionOptionType = 'row' | 'column';
|
|
28
7
|
export type FlexWrapOptionType = 'nowrap' | 'wrap' | 'wrap-reverse';
|
|
29
8
|
export type AlignItemsOptionType =
|
|
@@ -43,12 +22,10 @@ export type PositionOptionType = 'relative' | 'absolute';
|
|
|
43
22
|
|
|
44
23
|
export interface EventObjectGenerated {
|
|
45
24
|
type?: TypeOptionType;
|
|
46
|
-
permission?:
|
|
25
|
+
permission?: string;
|
|
47
26
|
navigate_to?: string;
|
|
48
27
|
targetIndex?: number;
|
|
49
|
-
placementKey?:
|
|
50
|
-
conditionKey?: ConditionKeyOptionType;
|
|
51
|
-
value?: boolean;
|
|
28
|
+
placementKey?: string;
|
|
52
29
|
}
|
|
53
30
|
|
|
54
31
|
export interface FormSubmitButtonStyleGenerated {
|
|
@@ -12,8 +12,6 @@ import {
|
|
|
12
12
|
usePlacementButtonEvents,
|
|
13
13
|
type PlacementEventObject,
|
|
14
14
|
} from '../SystemButton/usePlacementButtonEvents';
|
|
15
|
-
import { useGlobalNavigation } from '../GlobalProvider/useGlobalNavigation';
|
|
16
|
-
import { useGlobalContext } from '../GlobalProvider/GlobalContext';
|
|
17
15
|
|
|
18
16
|
export function OnboardButton({ node }: OnboardButtonComponentProps) {
|
|
19
17
|
useLogRender('OnboardButton');
|
|
@@ -23,8 +21,6 @@ export function OnboardButton({ node }: OnboardButtonComponentProps) {
|
|
|
23
21
|
const { selectedTheme: theme, projectColors } = useBuilderParams();
|
|
24
22
|
const context = useMockOSContext();
|
|
25
23
|
const mockPermissionManager = useMockPermission(context);
|
|
26
|
-
const globalNavigate = useGlobalNavigation();
|
|
27
|
-
const globalCtx = useGlobalContext();
|
|
28
24
|
const generatedId = useId();
|
|
29
25
|
const attributeKey = node.key ?? generatedId;
|
|
30
26
|
const attrs = node.attributes;
|
|
@@ -43,7 +39,6 @@ export function OnboardButton({ node }: OnboardButtonComponentProps) {
|
|
|
43
39
|
return true;
|
|
44
40
|
}
|
|
45
41
|
if (e.navigate_to && typeof e.navigate_to === 'string') {
|
|
46
|
-
if (globalNavigate(e.navigate_to)) return true;
|
|
47
42
|
if (context) {
|
|
48
43
|
context.navigation(
|
|
49
44
|
e.navigate_to as
|
|
@@ -61,7 +56,7 @@ export function OnboardButton({ node }: OnboardButtonComponentProps) {
|
|
|
61
56
|
}
|
|
62
57
|
return false;
|
|
63
58
|
},
|
|
64
|
-
[emblaApi, context
|
|
59
|
+
[emblaApi, context],
|
|
65
60
|
);
|
|
66
61
|
|
|
67
62
|
const handleClick = usePlacementButtonEvents(attrs?.events, {
|
|
@@ -69,8 +64,6 @@ export function OnboardButton({ node }: OnboardButtonComponentProps) {
|
|
|
69
64
|
requestPermission: (permission) =>
|
|
70
65
|
mockPermissionManager.requestPermission(permission),
|
|
71
66
|
onNavigateWithoutPlacement,
|
|
72
|
-
globalNavigate,
|
|
73
|
-
setCondition: globalCtx?.setCondition,
|
|
74
67
|
});
|
|
75
68
|
|
|
76
69
|
return (
|
|
@@ -2,28 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import type { NodeData } from '../../types/Node';
|
|
4
4
|
|
|
5
|
-
export type TypeOptionType =
|
|
6
|
-
| 'Permission'
|
|
7
|
-
| 'Navigate'
|
|
8
|
-
| 'Placement'
|
|
9
|
-
| 'SetCondition';
|
|
10
|
-
export type PermissionOptionType =
|
|
11
|
-
| 'notification'
|
|
12
|
-
| 'camera'
|
|
13
|
-
| 'microphone'
|
|
14
|
-
| 'location'
|
|
15
|
-
| 'photos'
|
|
16
|
-
| 'contacts'
|
|
17
|
-
| 'att'
|
|
18
|
-
| 'rating'
|
|
19
|
-
| 'GDPR';
|
|
20
|
-
export type PlacementKeyOptionType =
|
|
21
|
-
| 'terms'
|
|
22
|
-
| 'onboard'
|
|
23
|
-
| 'paywall'
|
|
24
|
-
| 'subscription'
|
|
25
|
-
| 'home';
|
|
26
|
-
export type ConditionKeyOptionType = 'termsAccepted';
|
|
5
|
+
export type TypeOptionType = 'Permission' | 'Navigate' | 'Placement';
|
|
27
6
|
export type TestIDOptionType = 'onboardSkip' | 'onboardNext';
|
|
28
7
|
export type AnimationOptionType =
|
|
29
8
|
| 'simple-animation'
|
|
@@ -50,12 +29,10 @@ export type PositionOptionType = 'relative' | 'absolute';
|
|
|
50
29
|
|
|
51
30
|
export interface EventObjectGenerated {
|
|
52
31
|
type?: TypeOptionType;
|
|
53
|
-
permission?:
|
|
32
|
+
permission?: string;
|
|
54
33
|
navigate_to?: string;
|
|
55
34
|
targetIndex?: number;
|
|
56
|
-
placementKey?:
|
|
57
|
-
conditionKey?: ConditionKeyOptionType;
|
|
58
|
-
value?: boolean;
|
|
35
|
+
placementKey?: string;
|
|
59
36
|
}
|
|
60
37
|
|
|
61
38
|
export interface OnboardButtonStyleGenerated {
|
|
@@ -32,13 +32,11 @@
|
|
|
32
32
|
},
|
|
33
33
|
"types": {
|
|
34
34
|
"EventObject": {
|
|
35
|
-
"type": "
|
|
36
|
-
"permission": "
|
|
35
|
+
"type": ["Permission", "Navigate", "Placement"],
|
|
36
|
+
"permission": "string",
|
|
37
37
|
"navigate_to": "string",
|
|
38
38
|
"targetIndex": "number",
|
|
39
|
-
"placementKey": "
|
|
40
|
-
"conditionKey": "$ref:event-constants.conditionKeys",
|
|
41
|
-
"value": "boolean"
|
|
39
|
+
"placementKey": "string"
|
|
42
40
|
}
|
|
43
41
|
},
|
|
44
42
|
"meta": {
|
|
@@ -3,17 +3,6 @@
|
|
|
3
3
|
import type { NodeData } from '../../types/Node';
|
|
4
4
|
|
|
5
5
|
export type ThemeOptionType = 'light' | 'dark' | 'all';
|
|
6
|
-
export type AnimationOptionType =
|
|
7
|
-
| 'default'
|
|
8
|
-
| 'fade'
|
|
9
|
-
| 'fade_from_bottom'
|
|
10
|
-
| 'fade_from_right'
|
|
11
|
-
| 'reveal_from_bottom'
|
|
12
|
-
| 'scale_from_center'
|
|
13
|
-
| 'slide_from_right'
|
|
14
|
-
| 'slide_from_left'
|
|
15
|
-
| 'slide_from_bottom'
|
|
16
|
-
| 'none';
|
|
17
6
|
export type FlexDirectionOptionType = 'row' | 'column';
|
|
18
7
|
export type FlexWrapOptionType = 'nowrap' | 'wrap' | 'wrap-reverse';
|
|
19
8
|
export type AlignItemsOptionType =
|
|
@@ -76,7 +65,6 @@ export interface OnboardProviderPropsGenerated {
|
|
|
76
65
|
testID?: string;
|
|
77
66
|
theme?: ThemeOptionType;
|
|
78
67
|
borderRadius?: never;
|
|
79
|
-
animation?: AnimationOptionType;
|
|
80
68
|
};
|
|
81
69
|
}
|
|
82
70
|
|
|
@@ -8,8 +8,7 @@
|
|
|
8
8
|
"extends": "View",
|
|
9
9
|
"attributes": {
|
|
10
10
|
"theme": ["light", "dark", "all"],
|
|
11
|
-
"borderRadius": "never"
|
|
12
|
-
"animation": ["default", "fade", "fade_from_bottom", "fade_from_right", "reveal_from_bottom", "scale_from_center", "slide_from_right", "slide_from_left", "slide_from_bottom", "none"]
|
|
11
|
+
"borderRadius": "never"
|
|
13
12
|
}
|
|
14
13
|
},
|
|
15
14
|
"defaults": {
|
|
@@ -31,13 +30,6 @@
|
|
|
31
30
|
"specialCategory": null,
|
|
32
31
|
"sort": -10
|
|
33
32
|
},
|
|
34
|
-
"animation": {
|
|
35
|
-
"label": "Page transition animation",
|
|
36
|
-
"description": "When this component is a GlobalProvider page: animation used when navigating to this screen.",
|
|
37
|
-
"category": "other",
|
|
38
|
-
"specialCategory": null,
|
|
39
|
-
"sort": 2
|
|
40
|
-
},
|
|
41
33
|
"styles": {
|
|
42
34
|
"paddingTop": {
|
|
43
35
|
"label": "Padding Top",
|
|
@@ -2,17 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
import type { NodeData } from '../../types/Node';
|
|
4
4
|
|
|
5
|
-
export type AnimationOptionType =
|
|
6
|
-
| 'default'
|
|
7
|
-
| 'fade'
|
|
8
|
-
| 'fade_from_bottom'
|
|
9
|
-
| 'fade_from_right'
|
|
10
|
-
| 'reveal_from_bottom'
|
|
11
|
-
| 'scale_from_center'
|
|
12
|
-
| 'slide_from_right'
|
|
13
|
-
| 'slide_from_left'
|
|
14
|
-
| 'slide_from_bottom'
|
|
15
|
-
| 'none';
|
|
16
5
|
export type FlexDirectionOptionType = 'row' | 'column';
|
|
17
6
|
export type FlexWrapOptionType = 'nowrap' | 'wrap' | 'wrap-reverse';
|
|
18
7
|
export type AlignItemsOptionType =
|
|
@@ -74,7 +63,6 @@ export interface PaywallProviderPropsGenerated {
|
|
|
74
63
|
scrollable?: boolean;
|
|
75
64
|
testID?: string;
|
|
76
65
|
delay?: number;
|
|
77
|
-
animation?: AnimationOptionType;
|
|
78
66
|
};
|
|
79
67
|
}
|
|
80
68
|
|
|
@@ -7,8 +7,7 @@
|
|
|
7
7
|
"children": "node",
|
|
8
8
|
"extends": "View",
|
|
9
9
|
"attributes": {
|
|
10
|
-
"delay": "number"
|
|
11
|
-
"animation": ["default", "fade", "fade_from_bottom", "fade_from_right", "reveal_from_bottom", "scale_from_center", "slide_from_right", "slide_from_left", "slide_from_bottom", "none"]
|
|
10
|
+
"delay": "number"
|
|
12
11
|
}
|
|
13
12
|
},
|
|
14
13
|
"defaults": {
|
|
@@ -28,13 +27,6 @@
|
|
|
28
27
|
"category": "other",
|
|
29
28
|
"specialCategory": null,
|
|
30
29
|
"sort": 1
|
|
31
|
-
},
|
|
32
|
-
"animation": {
|
|
33
|
-
"label": "Page transition animation",
|
|
34
|
-
"description": "When this component is a GlobalProvider page: animation used when navigating to this screen.",
|
|
35
|
-
"category": "other",
|
|
36
|
-
"specialCategory": null,
|
|
37
|
-
"sort": 2
|
|
38
30
|
}
|
|
39
31
|
},
|
|
40
32
|
"mockableFeatures": {
|
|
@@ -27,7 +27,6 @@ import type { FormCheckboxComponentProps } from './FormCheckbox/FormCheckboxProp
|
|
|
27
27
|
import type { FormErrorTextComponentProps } from './FormErrorText/FormErrorTextProps.generated';
|
|
28
28
|
import type { FormProviderComponentProps } from './FormProvider/FormProviderProps.generated';
|
|
29
29
|
import type { FormSubmitButtonComponentProps } from './FormSubmitButton/FormSubmitButtonProps.generated';
|
|
30
|
-
import type { GlobalProviderComponentProps } from './GlobalProvider/GlobalProviderProps.generated';
|
|
31
30
|
import type { ImageComponentProps } from './Image/ImageProps.generated';
|
|
32
31
|
import type { MainComponentProps } from './Main/MainProps.generated';
|
|
33
32
|
import type { NavigationBarColorComponentProps } from './NavigationBarColor/NavigationBarColorProps.generated';
|
|
@@ -54,7 +53,6 @@ import type { RadioButtonComponentProps } from './RadioButton/RadioButtonProps.g
|
|
|
54
53
|
import type { SeparatorComponentProps } from './Separator/SeparatorProps.generated';
|
|
55
54
|
import type { StatusBarColorComponentProps } from './StatusBarColor/StatusBarColorProps.generated';
|
|
56
55
|
import type { SystemButtonComponentProps } from './SystemButton/SystemButtonProps.generated';
|
|
57
|
-
import type { TermsProviderComponentProps } from './TermsProvider/TermsProviderProps.generated';
|
|
58
56
|
import type { TextComponentProps } from './Text/TextProps.generated';
|
|
59
57
|
import type { ViewComponentProps } from './View/ViewProps.generated';
|
|
60
58
|
import type { WebViewComponentProps } from './WebView/WebViewProps.generated';
|
|
@@ -72,7 +70,6 @@ import { FormCheckbox } from './FormCheckbox/FormCheckbox';
|
|
|
72
70
|
import { FormErrorText } from './FormErrorText/FormErrorText';
|
|
73
71
|
import { FormProvider } from './FormProvider/FormProvider';
|
|
74
72
|
import { FormSubmitButton } from './FormSubmitButton/FormSubmitButton';
|
|
75
|
-
import GlobalProvider from './GlobalProvider/GlobalProvider';
|
|
76
73
|
import Image from './Image/Image';
|
|
77
74
|
import Main from './Main/Main';
|
|
78
75
|
import NavigationBarColor from './NavigationBarColor/NavigationBarColor';
|
|
@@ -99,7 +96,6 @@ import RadioButton from './RadioButton/RadioButton';
|
|
|
99
96
|
import Separator from './Separator/Separator';
|
|
100
97
|
import StatusBarColor from './StatusBarColor/StatusBarColor';
|
|
101
98
|
import { SystemButton } from './SystemButton/SystemButton';
|
|
102
|
-
import TermsProvider from './TermsProvider/TermsProvider';
|
|
103
99
|
import { Text } from './Text/Text';
|
|
104
100
|
import View from './View/View';
|
|
105
101
|
import { WebView } from './WebView/WebView';
|
|
@@ -119,7 +115,6 @@ type BuilderNode =
|
|
|
119
115
|
| (FormErrorTextComponentProps['node'] & { type: 'FormErrorText' })
|
|
120
116
|
| (FormProviderComponentProps['node'] & { type: 'FormProvider' })
|
|
121
117
|
| (FormSubmitButtonComponentProps['node'] & { type: 'FormSubmitButton' })
|
|
122
|
-
| (GlobalProviderComponentProps['node'] & { type: 'GlobalProvider' })
|
|
123
118
|
| (ImageComponentProps['node'] & { type: 'Image' })
|
|
124
119
|
| (MainComponentProps['node'] & { type: 'Main' })
|
|
125
120
|
| (NavigationBarColorComponentProps['node'] & { type: 'NavigationBarColor' })
|
|
@@ -148,7 +143,6 @@ type BuilderNode =
|
|
|
148
143
|
| (SeparatorComponentProps['node'] & { type: 'Separator' })
|
|
149
144
|
| (StatusBarColorComponentProps['node'] & { type: 'StatusBarColor' })
|
|
150
145
|
| (SystemButtonComponentProps['node'] & { type: 'SystemButton' })
|
|
151
|
-
| (TermsProviderComponentProps['node'] & { type: 'TermsProvider' })
|
|
152
146
|
| (TextComponentProps['node'] & { type: 'Text' })
|
|
153
147
|
| (ViewComponentProps['node'] & { type: 'View' })
|
|
154
148
|
| (WebViewComponentProps['node'] & { type: 'WebView' });
|
|
@@ -211,8 +205,6 @@ function RenderNode({ node }: { node: Node }) {
|
|
|
211
205
|
return <FormProvider node={normalizedNode} />;
|
|
212
206
|
case 'FormSubmitButton':
|
|
213
207
|
return <FormSubmitButton node={normalizedNode} />;
|
|
214
|
-
case 'GlobalProvider':
|
|
215
|
-
return <GlobalProvider node={normalizedNode} />;
|
|
216
208
|
case 'Image':
|
|
217
209
|
return <Image node={normalizedNode} />;
|
|
218
210
|
case 'Main':
|
|
@@ -265,8 +257,6 @@ function RenderNode({ node }: { node: Node }) {
|
|
|
265
257
|
return <StatusBarColor node={normalizedNode} />;
|
|
266
258
|
case 'SystemButton':
|
|
267
259
|
return <SystemButton node={normalizedNode} />;
|
|
268
|
-
case 'TermsProvider':
|
|
269
|
-
return <TermsProvider node={normalizedNode} />;
|
|
270
260
|
case 'Text':
|
|
271
261
|
return <Text node={normalizedNode} />;
|
|
272
262
|
case 'View':
|
|
@@ -8,8 +8,6 @@ import { useMergedStyle } from '../../utils/useMergedStyle';
|
|
|
8
8
|
import { useMockOSContext, useMockPermission } from '../../mockOS';
|
|
9
9
|
import { useLocalize } from '../../hooks/useLocalize';
|
|
10
10
|
import { usePlacementButtonEvents } from './usePlacementButtonEvents';
|
|
11
|
-
import { useGlobalNavigation } from '../GlobalProvider/useGlobalNavigation';
|
|
12
|
-
import { useGlobalContext } from '../GlobalProvider/GlobalContext';
|
|
13
11
|
|
|
14
12
|
export type SystemButtonOptionalProps = {
|
|
15
13
|
onClick?: () => void;
|
|
@@ -26,8 +24,6 @@ export function SystemButton({
|
|
|
26
24
|
const attributeName = node.sourceType ?? node.type ?? 'SystemButton';
|
|
27
25
|
const context = useMockOSContext();
|
|
28
26
|
const mockPermissionManager = useMockPermission(context);
|
|
29
|
-
const globalNavigate = useGlobalNavigation();
|
|
30
|
-
const globalCtx = useGlobalContext();
|
|
31
27
|
const generatedId = useId();
|
|
32
28
|
const attributeKey = node.key ?? generatedId;
|
|
33
29
|
const attrs = node.attributes;
|
|
@@ -41,8 +37,6 @@ export function SystemButton({
|
|
|
41
37
|
context,
|
|
42
38
|
requestPermission: (permission) =>
|
|
43
39
|
mockPermissionManager.requestPermission(permission),
|
|
44
|
-
globalNavigate,
|
|
45
|
-
setCondition: globalCtx?.setCondition,
|
|
46
40
|
});
|
|
47
41
|
|
|
48
42
|
const handleClick = onClickProp ?? placementClick;
|
|
@@ -2,28 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import type { NodeData } from '../../types/Node';
|
|
4
4
|
|
|
5
|
-
export type TypeOptionType =
|
|
6
|
-
| 'Permission'
|
|
7
|
-
| 'Navigate'
|
|
8
|
-
| 'Placement'
|
|
9
|
-
| 'SetCondition';
|
|
10
|
-
export type PermissionOptionType =
|
|
11
|
-
| 'notification'
|
|
12
|
-
| 'camera'
|
|
13
|
-
| 'microphone'
|
|
14
|
-
| 'location'
|
|
15
|
-
| 'photos'
|
|
16
|
-
| 'contacts'
|
|
17
|
-
| 'att'
|
|
18
|
-
| 'rating'
|
|
19
|
-
| 'GDPR';
|
|
20
|
-
export type PlacementKeyOptionType =
|
|
21
|
-
| 'terms'
|
|
22
|
-
| 'onboard'
|
|
23
|
-
| 'paywall'
|
|
24
|
-
| 'subscription'
|
|
25
|
-
| 'home';
|
|
26
|
-
export type ConditionKeyOptionType = 'termsAccepted';
|
|
5
|
+
export type TypeOptionType = 'Permission' | 'Navigate' | 'Placement';
|
|
27
6
|
export type FlexDirectionOptionType = 'row' | 'column';
|
|
28
7
|
export type FlexWrapOptionType = 'nowrap' | 'wrap' | 'wrap-reverse';
|
|
29
8
|
export type AlignItemsOptionType =
|
|
@@ -43,12 +22,10 @@ export type PositionOptionType = 'relative' | 'absolute';
|
|
|
43
22
|
|
|
44
23
|
export interface EventObjectGenerated {
|
|
45
24
|
type?: TypeOptionType;
|
|
46
|
-
permission?:
|
|
25
|
+
permission?: string;
|
|
47
26
|
navigate_to?: string;
|
|
48
27
|
targetIndex?: number;
|
|
49
|
-
placementKey?:
|
|
50
|
-
conditionKey?: ConditionKeyOptionType;
|
|
51
|
-
value?: boolean;
|
|
28
|
+
placementKey?: string;
|
|
52
29
|
}
|
|
53
30
|
|
|
54
31
|
export interface SystemButtonStyleGenerated {
|
|
@@ -33,13 +33,11 @@
|
|
|
33
33
|
},
|
|
34
34
|
"types": {
|
|
35
35
|
"EventObject": {
|
|
36
|
-
"type": "
|
|
37
|
-
"permission": "
|
|
36
|
+
"type": ["Permission", "Navigate", "Placement"],
|
|
37
|
+
"permission": "string",
|
|
38
38
|
"navigate_to": "string",
|
|
39
39
|
"targetIndex": "number",
|
|
40
|
-
"placementKey": "
|
|
41
|
-
"conditionKey": "$ref:event-constants.conditionKeys",
|
|
42
|
-
"value": "boolean"
|
|
40
|
+
"placementKey": "string"
|
|
43
41
|
}
|
|
44
42
|
},
|
|
45
43
|
"meta": {
|
|
@@ -2,15 +2,13 @@ import { useRef, useCallback } from 'react';
|
|
|
2
2
|
import type { MockOSContextValue } from '../../mockOS/context/MockOSContextBase';
|
|
3
3
|
import type { PermissionStatus } from '../../mockOS/managers/mockPermissionManager';
|
|
4
4
|
|
|
5
|
-
/** Event shape shared by SystemButton and OnboardButton. Placement = go to placementKey (onboard/terms/paywall); Navigate = navigate_to or carousel
|
|
5
|
+
/** Event shape shared by SystemButton and OnboardButton. Placement = go to placementKey (onboard/terms/paywall); Navigate = navigate_to or carousel. */
|
|
6
6
|
export interface PlacementEventObject {
|
|
7
|
-
type?: 'Permission' | 'Navigate' | 'Placement'
|
|
7
|
+
type?: 'Permission' | 'Navigate' | 'Placement';
|
|
8
8
|
permission?: string | null;
|
|
9
9
|
placementKey?: string;
|
|
10
10
|
navigate_to?: string;
|
|
11
11
|
targetIndex?: number;
|
|
12
|
-
conditionKey?: string;
|
|
13
|
-
value?: boolean;
|
|
14
12
|
}
|
|
15
13
|
|
|
16
14
|
export interface UsePlacementButtonEventsOptions {
|
|
@@ -20,17 +18,6 @@ export interface UsePlacementButtonEventsOptions {
|
|
|
20
18
|
onNavigateWithoutPlacement?: (
|
|
21
19
|
e: PlacementEventObject,
|
|
22
20
|
) => Promise<boolean> | boolean;
|
|
23
|
-
/**
|
|
24
|
-
* Optional global navigate function (from useGlobalNavigation).
|
|
25
|
-
* When provided, Navigate/Placement events try this first before falling back
|
|
26
|
-
* to MockOSContext. Return true if the navigation was handled.
|
|
27
|
-
*/
|
|
28
|
-
globalNavigate?: (target: string) => boolean;
|
|
29
|
-
/**
|
|
30
|
-
* Optional callback to set a global boolean condition (from GlobalContext).
|
|
31
|
-
* Used by SetCondition events.
|
|
32
|
-
*/
|
|
33
|
-
setCondition?: (key: string, value: boolean) => void;
|
|
34
21
|
}
|
|
35
22
|
|
|
36
23
|
/**
|
|
@@ -42,27 +29,9 @@ export function usePlacementButtonEvents(
|
|
|
42
29
|
events: PlacementEventObject[] | undefined,
|
|
43
30
|
options: UsePlacementButtonEventsOptions,
|
|
44
31
|
): () => Promise<void> {
|
|
45
|
-
const {
|
|
46
|
-
context,
|
|
47
|
-
requestPermission,
|
|
48
|
-
onNavigateWithoutPlacement,
|
|
49
|
-
globalNavigate,
|
|
50
|
-
setCondition,
|
|
51
|
-
} = options;
|
|
32
|
+
const { context, requestPermission, onNavigateWithoutPlacement } = options;
|
|
52
33
|
const handledEventsRef = useRef<PlacementEventObject[]>([]);
|
|
53
34
|
|
|
54
|
-
/**
|
|
55
|
-
* Attempts to navigate to a target. Tries globalNavigate first (GlobalProvider),
|
|
56
|
-
* then falls back to MockOSContext.
|
|
57
|
-
*/
|
|
58
|
-
const navigateTo = useCallback(
|
|
59
|
-
(target: string): void => {
|
|
60
|
-
if (globalNavigate?.(target)) return;
|
|
61
|
-
context?.navigation(target as Parameters<typeof context.navigation>[0]);
|
|
62
|
-
},
|
|
63
|
-
[context, globalNavigate],
|
|
64
|
-
);
|
|
65
|
-
|
|
66
35
|
const handleClick = useCallback(async () => {
|
|
67
36
|
const list = events ?? [];
|
|
68
37
|
|
|
@@ -75,19 +44,24 @@ export function usePlacementButtonEvents(
|
|
|
75
44
|
const permission = e.permission ?? 'camera';
|
|
76
45
|
await requestPermission(permission);
|
|
77
46
|
handledEventsRef.current.push(e);
|
|
78
|
-
} else if (e.type === 'SetCondition' && e.conditionKey) {
|
|
79
|
-
setCondition?.(e.conditionKey, e.value ?? false);
|
|
80
|
-
handledEventsRef.current.push(e);
|
|
81
47
|
} else if (e.type === 'Placement' && e.placementKey) {
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
48
|
+
if (e.placementKey === 'onboard') {
|
|
49
|
+
context?.navigation('onboard');
|
|
50
|
+
} else if (e.placementKey === 'paywall') {
|
|
51
|
+
context?.navigation('subscription');
|
|
52
|
+
} else if (e.placementKey === 'terms') {
|
|
53
|
+
context?.navigation('terms');
|
|
54
|
+
}
|
|
85
55
|
handledEventsRef.current.push(e);
|
|
86
56
|
} else if (e.type === 'Navigate') {
|
|
87
57
|
if (e.placementKey) {
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
58
|
+
if (e.placementKey === 'onboard') {
|
|
59
|
+
context?.navigation('onboard');
|
|
60
|
+
} else if (e.placementKey === 'paywall') {
|
|
61
|
+
context?.navigation('subscription');
|
|
62
|
+
} else if (e.placementKey === 'terms') {
|
|
63
|
+
context?.navigation('terms');
|
|
64
|
+
}
|
|
91
65
|
handledEventsRef.current.push(e);
|
|
92
66
|
} else {
|
|
93
67
|
const handled =
|
|
@@ -96,19 +70,21 @@ export function usePlacementButtonEvents(
|
|
|
96
70
|
if (handled) {
|
|
97
71
|
handledEventsRef.current.push(e);
|
|
98
72
|
} else if (e.navigate_to && typeof e.navigate_to === 'string') {
|
|
99
|
-
|
|
73
|
+
context?.navigation(
|
|
74
|
+
e.navigate_to as
|
|
75
|
+
| 'onboard'
|
|
76
|
+
| 'terms'
|
|
77
|
+
| 'subscription'
|
|
78
|
+
| 'app'
|
|
79
|
+
| 'home'
|
|
80
|
+
| 'launchscreen',
|
|
81
|
+
);
|
|
100
82
|
handledEventsRef.current.push(e);
|
|
101
83
|
}
|
|
102
84
|
}
|
|
103
85
|
}
|
|
104
86
|
}
|
|
105
|
-
}, [
|
|
106
|
-
events,
|
|
107
|
-
requestPermission,
|
|
108
|
-
setCondition,
|
|
109
|
-
navigateTo,
|
|
110
|
-
onNavigateWithoutPlacement,
|
|
111
|
-
]);
|
|
87
|
+
}, [events, context, requestPermission, onNavigateWithoutPlacement]);
|
|
112
88
|
|
|
113
89
|
return handleClick;
|
|
114
90
|
}
|
|
@@ -19,7 +19,6 @@ export const allcomponentNames = [
|
|
|
19
19
|
'FormErrorText',
|
|
20
20
|
'FormProvider',
|
|
21
21
|
'FormSubmitButton',
|
|
22
|
-
'GlobalProvider',
|
|
23
22
|
'Image',
|
|
24
23
|
'Main',
|
|
25
24
|
'NavigationBarColor',
|
|
@@ -46,7 +45,6 @@ export const allcomponentNames = [
|
|
|
46
45
|
'Separator',
|
|
47
46
|
'StatusBarColor',
|
|
48
47
|
'SystemButton',
|
|
49
|
-
'TermsProvider',
|
|
50
48
|
'Text',
|
|
51
49
|
'View',
|
|
52
50
|
'WebView',
|
|
@@ -108,10 +106,6 @@ export type {
|
|
|
108
106
|
FormSubmitButtonPropsGenerated,
|
|
109
107
|
FormSubmitButtonComponentProps,
|
|
110
108
|
} from './FormSubmitButton/FormSubmitButtonProps.generated';
|
|
111
|
-
export type {
|
|
112
|
-
GlobalProviderPropsGenerated,
|
|
113
|
-
GlobalProviderComponentProps,
|
|
114
|
-
} from './GlobalProvider/GlobalProviderProps.generated';
|
|
115
109
|
export type {
|
|
116
110
|
ImagePropsGenerated,
|
|
117
111
|
ImageComponentProps,
|
|
@@ -216,10 +210,6 @@ export type {
|
|
|
216
210
|
SystemButtonPropsGenerated,
|
|
217
211
|
SystemButtonComponentProps,
|
|
218
212
|
} from './SystemButton/SystemButtonProps.generated';
|
|
219
|
-
export type {
|
|
220
|
-
TermsProviderPropsGenerated,
|
|
221
|
-
TermsProviderComponentProps,
|
|
222
|
-
} from './TermsProvider/TermsProviderProps.generated';
|
|
223
213
|
export type {
|
|
224
214
|
TextPropsGenerated,
|
|
225
215
|
TextComponentProps,
|