@coorpacademy/components 11.12.6 → 11.13.0
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/es/organism/mobile-intro-popin/index.native.d.ts +20 -0
- package/es/organism/mobile-intro-popin/index.native.d.ts.map +1 -0
- package/es/organism/mobile-intro-popin/index.native.js +152 -0
- package/es/organism/mobile-intro-popin/index.native.js.map +1 -0
- package/lib/organism/mobile-intro-popin/index.native.d.ts +20 -0
- package/lib/organism/mobile-intro-popin/index.native.d.ts.map +1 -0
- package/lib/organism/mobile-intro-popin/index.native.js +169 -0
- package/lib/organism/mobile-intro-popin/index.native.js.map +1 -0
- package/locales/.mtslconfig.json +1 -0
- package/package.json +2 -2
- package/es/organism/podcast-popin-intro/index.native.d.ts +0 -10
- package/es/organism/podcast-popin-intro/index.native.d.ts.map +0 -1
- package/es/organism/podcast-popin-intro/index.native.js +0 -114
- package/es/organism/podcast-popin-intro/index.native.js.map +0 -1
- package/lib/organism/podcast-popin-intro/index.native.d.ts +0 -10
- package/lib/organism/podcast-popin-intro/index.native.d.ts.map +0 -1
- package/lib/organism/podcast-popin-intro/index.native.js +0 -131
- package/lib/organism/podcast-popin-intro/index.native.js.map +0 -1
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ViewStyle, GestureResponderEvent } from 'react-native';
|
|
3
|
+
export declare type Props = {
|
|
4
|
+
isVisible: boolean;
|
|
5
|
+
locales: {
|
|
6
|
+
title: string;
|
|
7
|
+
description1: string;
|
|
8
|
+
description2: string;
|
|
9
|
+
cta: string;
|
|
10
|
+
};
|
|
11
|
+
Icon?: FC<{
|
|
12
|
+
style: ViewStyle;
|
|
13
|
+
}>;
|
|
14
|
+
onValidate: (event: GestureResponderEvent) => void;
|
|
15
|
+
onCancel: (event: GestureResponderEvent) => void;
|
|
16
|
+
};
|
|
17
|
+
declare const PopinIntro: (props: Props) => JSX.Element | null;
|
|
18
|
+
export declare type PopinIntroProps = Props;
|
|
19
|
+
export default PopinIntro;
|
|
20
|
+
//# sourceMappingURL=index.native.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/mobile-intro-popin/index.native.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAsB,EAAE,EAAC,MAAM,OAAO,CAAC;AACrD,OAAO,EAAa,SAAS,EAAyB,qBAAqB,EAAC,MAAM,cAAc,CAAC;AAUjG,oBAAY,KAAK,GAAG;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,YAAY,EAAE,MAAM,CAAC;QACrB,YAAY,EAAE,MAAM,CAAC;QACrB,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IACF,IAAI,CAAC,EAAE,EAAE,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAC,CAAC,CAAC;IAC9B,UAAU,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACnD,QAAQ,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;CAClD,CAAC;AAyGF,QAAA,MAAM,UAAU,UAAW,KAAK,uBA2C/B,CAAC;AAEF,oBAAY,eAAe,GAAG,KAAK,CAAC;AACpC,eAAe,UAAU,CAAC"}
|
|
@@ -0,0 +1,152 @@
|
|
|
1
|
+
import React, { useState, useEffect } from 'react';
|
|
2
|
+
import { StyleSheet, Text, View } from 'react-native';
|
|
3
|
+
import Modal from 'react-native-modal';
|
|
4
|
+
import { NovaSolidStatusClose as CloseIcon } from '@coorpacademy/nova-icons';
|
|
5
|
+
import { useTemplateContext } from '../../template/app-review/template-context';
|
|
6
|
+
import Touchable from '../../hoc/touchable/index.native';
|
|
7
|
+
|
|
8
|
+
const createStyleSheet = (brandTheme, theme) => StyleSheet.create({
|
|
9
|
+
popin: {
|
|
10
|
+
position: 'absolute',
|
|
11
|
+
top: 0,
|
|
12
|
+
bottom: 0,
|
|
13
|
+
justifyContent: 'center',
|
|
14
|
+
alignItems: 'center'
|
|
15
|
+
},
|
|
16
|
+
content: {
|
|
17
|
+
backgroundColor: '#fff',
|
|
18
|
+
justifyContent: 'space-between',
|
|
19
|
+
alignItems: 'center',
|
|
20
|
+
borderRadius: 8,
|
|
21
|
+
paddingVertical: 24
|
|
22
|
+
},
|
|
23
|
+
iconWrapper: {
|
|
24
|
+
width: 100,
|
|
25
|
+
height: 100,
|
|
26
|
+
backgroundColor: '#FFEFEB',
|
|
27
|
+
justifyContent: 'center',
|
|
28
|
+
borderRadius: 60,
|
|
29
|
+
marginBottom: 12
|
|
30
|
+
},
|
|
31
|
+
icon: {
|
|
32
|
+
alignSelf: 'center',
|
|
33
|
+
width: 60,
|
|
34
|
+
height: 60,
|
|
35
|
+
fill: brandTheme.colors?.primary
|
|
36
|
+
},
|
|
37
|
+
title: {
|
|
38
|
+
textAlign: 'center',
|
|
39
|
+
lineHeight: 24,
|
|
40
|
+
fontWeight: '700',
|
|
41
|
+
fontSize: 20,
|
|
42
|
+
marginHorizontal: 24,
|
|
43
|
+
marginVertical: 12
|
|
44
|
+
},
|
|
45
|
+
description1: {
|
|
46
|
+
textAlign: 'center',
|
|
47
|
+
lineHeight: 19,
|
|
48
|
+
fontWeight: '300',
|
|
49
|
+
fontSize: 14,
|
|
50
|
+
marginHorizontal: 24,
|
|
51
|
+
marginVertical: 12
|
|
52
|
+
},
|
|
53
|
+
description2: {
|
|
54
|
+
textAlign: 'center',
|
|
55
|
+
lineHeight: 19,
|
|
56
|
+
fontWeight: '700',
|
|
57
|
+
fontSize: 16,
|
|
58
|
+
paddingHorizontal: 48,
|
|
59
|
+
marginVertical: 12
|
|
60
|
+
},
|
|
61
|
+
button: {
|
|
62
|
+
height: 44,
|
|
63
|
+
backgroundColor: brandTheme.colors?.primary,
|
|
64
|
+
borderRadius: 7,
|
|
65
|
+
justifyContent: 'center',
|
|
66
|
+
padding: 12,
|
|
67
|
+
paddingVertical: 12,
|
|
68
|
+
marginTop: 12
|
|
69
|
+
},
|
|
70
|
+
buttonText: {
|
|
71
|
+
alignSelf: 'center',
|
|
72
|
+
color: '#FFFFFF',
|
|
73
|
+
fontWeight: theme.fontWeight.bold,
|
|
74
|
+
fontFamily: 'System',
|
|
75
|
+
fontSize: 14,
|
|
76
|
+
lineHeight: 20
|
|
77
|
+
},
|
|
78
|
+
closeButton: {
|
|
79
|
+
position: 'absolute',
|
|
80
|
+
top: 0,
|
|
81
|
+
right: 0,
|
|
82
|
+
width: 45,
|
|
83
|
+
height: 45,
|
|
84
|
+
padding: 10,
|
|
85
|
+
flex: 1,
|
|
86
|
+
justifyContent: 'center',
|
|
87
|
+
alignItems: 'center'
|
|
88
|
+
},
|
|
89
|
+
closeIcon: {
|
|
90
|
+
width: '100%',
|
|
91
|
+
height: '100%',
|
|
92
|
+
fill: '#aeaeae'
|
|
93
|
+
}
|
|
94
|
+
});
|
|
95
|
+
|
|
96
|
+
const PopinIntro = props => {
|
|
97
|
+
const templateContext = useTemplateContext();
|
|
98
|
+
const [styleSheet, setStylesheet] = useState(null);
|
|
99
|
+
const {
|
|
100
|
+
brandTheme,
|
|
101
|
+
theme
|
|
102
|
+
} = templateContext;
|
|
103
|
+
const {
|
|
104
|
+
isVisible,
|
|
105
|
+
onValidate,
|
|
106
|
+
onCancel,
|
|
107
|
+
locales,
|
|
108
|
+
Icon
|
|
109
|
+
} = props;
|
|
110
|
+
useEffect(() => {
|
|
111
|
+
const _stylesheet = createStyleSheet(brandTheme, theme);
|
|
112
|
+
|
|
113
|
+
setStylesheet(_stylesheet);
|
|
114
|
+
}, [brandTheme, theme]);
|
|
115
|
+
|
|
116
|
+
if (!styleSheet) {
|
|
117
|
+
return null;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
return /*#__PURE__*/React.createElement(Modal, {
|
|
121
|
+
isVisible: isVisible,
|
|
122
|
+
style: styleSheet.popin,
|
|
123
|
+
testID: "intro-popin"
|
|
124
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
125
|
+
style: styleSheet.content
|
|
126
|
+
}, Icon ? /*#__PURE__*/React.createElement(View, {
|
|
127
|
+
style: styleSheet.iconWrapper
|
|
128
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
129
|
+
style: styleSheet.icon
|
|
130
|
+
})) : null, /*#__PURE__*/React.createElement(Text, {
|
|
131
|
+
style: styleSheet.title
|
|
132
|
+
}, locales.title), /*#__PURE__*/React.createElement(Text, {
|
|
133
|
+
style: styleSheet.description1
|
|
134
|
+
}, locales.description1), /*#__PURE__*/React.createElement(Text, {
|
|
135
|
+
style: styleSheet.description2
|
|
136
|
+
}, locales.description2), /*#__PURE__*/React.createElement(Touchable, {
|
|
137
|
+
style: styleSheet.button,
|
|
138
|
+
onPress: onValidate,
|
|
139
|
+
testID: "intro-popin-validate-button"
|
|
140
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
141
|
+
style: styleSheet.buttonText
|
|
142
|
+
}, locales.cta)), /*#__PURE__*/React.createElement(Touchable, {
|
|
143
|
+
style: styleSheet.closeButton,
|
|
144
|
+
onPress: onCancel,
|
|
145
|
+
testID: "intro-popin-cancel-button"
|
|
146
|
+
}, /*#__PURE__*/React.createElement(CloseIcon, {
|
|
147
|
+
style: styleSheet.closeIcon
|
|
148
|
+
}))));
|
|
149
|
+
};
|
|
150
|
+
|
|
151
|
+
export default PopinIntro;
|
|
152
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["React","useState","useEffect","StyleSheet","Text","View","Modal","NovaSolidStatusClose","CloseIcon","useTemplateContext","Touchable","createStyleSheet","brandTheme","theme","create","popin","position","top","bottom","justifyContent","alignItems","content","backgroundColor","borderRadius","paddingVertical","iconWrapper","width","height","marginBottom","icon","alignSelf","fill","colors","primary","title","textAlign","lineHeight","fontWeight","fontSize","marginHorizontal","marginVertical","description1","description2","paddingHorizontal","button","padding","marginTop","buttonText","color","bold","fontFamily","closeButton","right","flex","closeIcon","PopinIntro","props","templateContext","styleSheet","setStylesheet","isVisible","onValidate","onCancel","locales","Icon","_stylesheet","cta"],"sources":["../../../src/organism/mobile-intro-popin/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect, FC} from 'react';\nimport {StyleSheet, ViewStyle, Text, TextStyle, View, GestureResponderEvent} from 'react-native';\nimport Modal from 'react-native-modal';\nimport {NovaSolidStatusClose as CloseIcon} from '@coorpacademy/nova-icons';\n\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport Touchable from '../../hoc/touchable/index.native';\n\nimport type {Theme} from '../../variables/theme.native';\nimport type {Brand} from '../../variables/brand.native';\n\nexport type Props = {\n isVisible: boolean;\n locales: {\n title: string;\n description1: string;\n description2: string;\n cta: string;\n };\n Icon?: FC<{style: ViewStyle}>;\n onValidate: (event: GestureResponderEvent) => void;\n onCancel: (event: GestureResponderEvent) => void;\n};\n\ntype StyleSheetType = {\n popin: ViewStyle;\n content: ViewStyle;\n icon: ViewStyle;\n iconWrapper: ViewStyle;\n button: ViewStyle;\n buttonText: TextStyle;\n closeButton: ViewStyle;\n closeIcon: ViewStyle;\n title: TextStyle;\n description1: TextStyle;\n description2: TextStyle;\n};\n\nconst createStyleSheet = (brandTheme: Brand, theme: Theme) =>\n StyleSheet.create({\n popin: {\n position: 'absolute',\n top: 0,\n bottom: 0,\n justifyContent: 'center',\n alignItems: 'center'\n },\n content: {\n backgroundColor: '#fff',\n justifyContent: 'space-between',\n alignItems: 'center',\n borderRadius: 8,\n paddingVertical: 24\n },\n iconWrapper: {\n width: 100,\n height: 100,\n backgroundColor: '#FFEFEB',\n justifyContent: 'center',\n borderRadius: 60,\n marginBottom: 12\n },\n icon: {\n alignSelf: 'center',\n width: 60,\n height: 60,\n fill: brandTheme.colors?.primary\n },\n title: {\n textAlign: 'center',\n lineHeight: 24,\n fontWeight: '700',\n fontSize: 20,\n marginHorizontal: 24,\n marginVertical: 12\n },\n description1: {\n textAlign: 'center',\n lineHeight: 19,\n fontWeight: '300',\n fontSize: 14,\n marginHorizontal: 24,\n marginVertical: 12\n },\n description2: {\n textAlign: 'center',\n lineHeight: 19,\n fontWeight: '700',\n fontSize: 16,\n paddingHorizontal: 48,\n marginVertical: 12\n },\n button: {\n height: 44,\n backgroundColor: brandTheme.colors?.primary,\n borderRadius: 7,\n justifyContent: 'center',\n padding: 12,\n paddingVertical: 12,\n marginTop: 12\n },\n buttonText: {\n alignSelf: 'center',\n color: '#FFFFFF',\n fontWeight: theme.fontWeight.bold,\n fontFamily: 'System',\n fontSize: 14,\n lineHeight: 20\n },\n closeButton: {\n position: 'absolute',\n top: 0,\n right: 0,\n width: 45,\n height: 45,\n padding: 10,\n flex: 1,\n justifyContent: 'center',\n alignItems: 'center'\n },\n closeIcon: {\n width: '100%',\n height: '100%',\n fill: '#aeaeae'\n }\n });\n\nconst PopinIntro = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {brandTheme, theme} = templateContext;\n const {isVisible, onValidate, onCancel, locales, Icon} = props;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(brandTheme, theme);\n setStylesheet(_stylesheet);\n }, [brandTheme, theme]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <Modal isVisible={isVisible} style={styleSheet.popin} testID=\"intro-popin\">\n <View style={styleSheet.content}>\n {Icon ? (\n <View style={styleSheet.iconWrapper}>\n <Icon style={styleSheet.icon} />\n </View>\n ) : null}\n <Text style={styleSheet.title}>{locales.title}</Text>\n <Text style={styleSheet.description1}>{locales.description1}</Text>\n <Text style={styleSheet.description2}>{locales.description2}</Text>\n <Touchable\n style={styleSheet.button}\n onPress={onValidate}\n testID=\"intro-popin-validate-button\"\n >\n <Text style={styleSheet.buttonText}>{locales.cta}</Text>\n </Touchable>\n <Touchable\n style={styleSheet.closeButton}\n onPress={onCancel}\n testID=\"intro-popin-cancel-button\"\n >\n <CloseIcon style={styleSheet.closeIcon} />\n </Touchable>\n </View>\n </Modal>\n );\n};\n\nexport type PopinIntroProps = Props;\nexport default PopinIntro;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ViewStyle, GestureResponderEvent } from 'react-native';
|
|
3
|
+
export declare type Props = {
|
|
4
|
+
isVisible: boolean;
|
|
5
|
+
locales: {
|
|
6
|
+
title: string;
|
|
7
|
+
description1: string;
|
|
8
|
+
description2: string;
|
|
9
|
+
cta: string;
|
|
10
|
+
};
|
|
11
|
+
Icon?: FC<{
|
|
12
|
+
style: ViewStyle;
|
|
13
|
+
}>;
|
|
14
|
+
onValidate: (event: GestureResponderEvent) => void;
|
|
15
|
+
onCancel: (event: GestureResponderEvent) => void;
|
|
16
|
+
};
|
|
17
|
+
declare const PopinIntro: (props: Props) => JSX.Element | null;
|
|
18
|
+
export declare type PopinIntroProps = Props;
|
|
19
|
+
export default PopinIntro;
|
|
20
|
+
//# sourceMappingURL=index.native.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/mobile-intro-popin/index.native.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAsB,EAAE,EAAC,MAAM,OAAO,CAAC;AACrD,OAAO,EAAa,SAAS,EAAyB,qBAAqB,EAAC,MAAM,cAAc,CAAC;AAUjG,oBAAY,KAAK,GAAG;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,YAAY,EAAE,MAAM,CAAC;QACrB,YAAY,EAAE,MAAM,CAAC;QACrB,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IACF,IAAI,CAAC,EAAE,EAAE,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAC,CAAC,CAAC;IAC9B,UAAU,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACnD,QAAQ,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;CAClD,CAAC;AAyGF,QAAA,MAAM,UAAU,UAAW,KAAK,uBA2C/B,CAAC;AAEF,oBAAY,eAAe,GAAG,KAAK,CAAC;AACpC,eAAe,UAAU,CAAC"}
|
|
@@ -0,0 +1,169 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.default = void 0;
|
|
5
|
+
|
|
6
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
7
|
+
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
|
|
10
|
+
var _reactNativeModal = _interopRequireDefault(require("react-native-modal"));
|
|
11
|
+
|
|
12
|
+
var _novaIcons = require("@coorpacademy/nova-icons");
|
|
13
|
+
|
|
14
|
+
var _templateContext = require("../../template/app-review/template-context");
|
|
15
|
+
|
|
16
|
+
var _index = _interopRequireDefault(require("../../hoc/touchable/index.native"));
|
|
17
|
+
|
|
18
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
+
|
|
20
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
|
+
|
|
22
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
|
+
|
|
24
|
+
const createStyleSheet = (brandTheme, theme) => _reactNative.StyleSheet.create({
|
|
25
|
+
popin: {
|
|
26
|
+
position: 'absolute',
|
|
27
|
+
top: 0,
|
|
28
|
+
bottom: 0,
|
|
29
|
+
justifyContent: 'center',
|
|
30
|
+
alignItems: 'center'
|
|
31
|
+
},
|
|
32
|
+
content: {
|
|
33
|
+
backgroundColor: '#fff',
|
|
34
|
+
justifyContent: 'space-between',
|
|
35
|
+
alignItems: 'center',
|
|
36
|
+
borderRadius: 8,
|
|
37
|
+
paddingVertical: 24
|
|
38
|
+
},
|
|
39
|
+
iconWrapper: {
|
|
40
|
+
width: 100,
|
|
41
|
+
height: 100,
|
|
42
|
+
backgroundColor: '#FFEFEB',
|
|
43
|
+
justifyContent: 'center',
|
|
44
|
+
borderRadius: 60,
|
|
45
|
+
marginBottom: 12
|
|
46
|
+
},
|
|
47
|
+
icon: {
|
|
48
|
+
alignSelf: 'center',
|
|
49
|
+
width: 60,
|
|
50
|
+
height: 60,
|
|
51
|
+
fill: brandTheme.colors?.primary
|
|
52
|
+
},
|
|
53
|
+
title: {
|
|
54
|
+
textAlign: 'center',
|
|
55
|
+
lineHeight: 24,
|
|
56
|
+
fontWeight: '700',
|
|
57
|
+
fontSize: 20,
|
|
58
|
+
marginHorizontal: 24,
|
|
59
|
+
marginVertical: 12
|
|
60
|
+
},
|
|
61
|
+
description1: {
|
|
62
|
+
textAlign: 'center',
|
|
63
|
+
lineHeight: 19,
|
|
64
|
+
fontWeight: '300',
|
|
65
|
+
fontSize: 14,
|
|
66
|
+
marginHorizontal: 24,
|
|
67
|
+
marginVertical: 12
|
|
68
|
+
},
|
|
69
|
+
description2: {
|
|
70
|
+
textAlign: 'center',
|
|
71
|
+
lineHeight: 19,
|
|
72
|
+
fontWeight: '700',
|
|
73
|
+
fontSize: 16,
|
|
74
|
+
paddingHorizontal: 48,
|
|
75
|
+
marginVertical: 12
|
|
76
|
+
},
|
|
77
|
+
button: {
|
|
78
|
+
height: 44,
|
|
79
|
+
backgroundColor: brandTheme.colors?.primary,
|
|
80
|
+
borderRadius: 7,
|
|
81
|
+
justifyContent: 'center',
|
|
82
|
+
padding: 12,
|
|
83
|
+
paddingVertical: 12,
|
|
84
|
+
marginTop: 12
|
|
85
|
+
},
|
|
86
|
+
buttonText: {
|
|
87
|
+
alignSelf: 'center',
|
|
88
|
+
color: '#FFFFFF',
|
|
89
|
+
fontWeight: theme.fontWeight.bold,
|
|
90
|
+
fontFamily: 'System',
|
|
91
|
+
fontSize: 14,
|
|
92
|
+
lineHeight: 20
|
|
93
|
+
},
|
|
94
|
+
closeButton: {
|
|
95
|
+
position: 'absolute',
|
|
96
|
+
top: 0,
|
|
97
|
+
right: 0,
|
|
98
|
+
width: 45,
|
|
99
|
+
height: 45,
|
|
100
|
+
padding: 10,
|
|
101
|
+
flex: 1,
|
|
102
|
+
justifyContent: 'center',
|
|
103
|
+
alignItems: 'center'
|
|
104
|
+
},
|
|
105
|
+
closeIcon: {
|
|
106
|
+
width: '100%',
|
|
107
|
+
height: '100%',
|
|
108
|
+
fill: '#aeaeae'
|
|
109
|
+
}
|
|
110
|
+
});
|
|
111
|
+
|
|
112
|
+
const PopinIntro = props => {
|
|
113
|
+
const templateContext = (0, _templateContext.useTemplateContext)();
|
|
114
|
+
const [styleSheet, setStylesheet] = (0, _react.useState)(null);
|
|
115
|
+
const {
|
|
116
|
+
brandTheme,
|
|
117
|
+
theme
|
|
118
|
+
} = templateContext;
|
|
119
|
+
const {
|
|
120
|
+
isVisible,
|
|
121
|
+
onValidate,
|
|
122
|
+
onCancel,
|
|
123
|
+
locales,
|
|
124
|
+
Icon
|
|
125
|
+
} = props;
|
|
126
|
+
(0, _react.useEffect)(() => {
|
|
127
|
+
const _stylesheet = createStyleSheet(brandTheme, theme);
|
|
128
|
+
|
|
129
|
+
setStylesheet(_stylesheet);
|
|
130
|
+
}, [brandTheme, theme]);
|
|
131
|
+
|
|
132
|
+
if (!styleSheet) {
|
|
133
|
+
return null;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
return /*#__PURE__*/_react.default.createElement(_reactNativeModal.default, {
|
|
137
|
+
isVisible: isVisible,
|
|
138
|
+
style: styleSheet.popin,
|
|
139
|
+
testID: "intro-popin"
|
|
140
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
141
|
+
style: styleSheet.content
|
|
142
|
+
}, Icon ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
143
|
+
style: styleSheet.iconWrapper
|
|
144
|
+
}, /*#__PURE__*/_react.default.createElement(Icon, {
|
|
145
|
+
style: styleSheet.icon
|
|
146
|
+
})) : null, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
147
|
+
style: styleSheet.title
|
|
148
|
+
}, locales.title), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
149
|
+
style: styleSheet.description1
|
|
150
|
+
}, locales.description1), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
151
|
+
style: styleSheet.description2
|
|
152
|
+
}, locales.description2), /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
153
|
+
style: styleSheet.button,
|
|
154
|
+
onPress: onValidate,
|
|
155
|
+
testID: "intro-popin-validate-button"
|
|
156
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
157
|
+
style: styleSheet.buttonText
|
|
158
|
+
}, locales.cta)), /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
159
|
+
style: styleSheet.closeButton,
|
|
160
|
+
onPress: onCancel,
|
|
161
|
+
testID: "intro-popin-cancel-button"
|
|
162
|
+
}, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaSolidStatusClose, {
|
|
163
|
+
style: styleSheet.closeIcon
|
|
164
|
+
}))));
|
|
165
|
+
};
|
|
166
|
+
|
|
167
|
+
var _default = PopinIntro;
|
|
168
|
+
exports.default = _default;
|
|
169
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.native.js","names":["createStyleSheet","brandTheme","theme","StyleSheet","create","popin","position","top","bottom","justifyContent","alignItems","content","backgroundColor","borderRadius","paddingVertical","iconWrapper","width","height","marginBottom","icon","alignSelf","fill","colors","primary","title","textAlign","lineHeight","fontWeight","fontSize","marginHorizontal","marginVertical","description1","description2","paddingHorizontal","button","padding","marginTop","buttonText","color","bold","fontFamily","closeButton","right","flex","closeIcon","PopinIntro","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","isVisible","onValidate","onCancel","locales","Icon","useEffect","_stylesheet","cta"],"sources":["../../../src/organism/mobile-intro-popin/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect, FC} from 'react';\nimport {StyleSheet, ViewStyle, Text, TextStyle, View, GestureResponderEvent} from 'react-native';\nimport Modal from 'react-native-modal';\nimport {NovaSolidStatusClose as CloseIcon} from '@coorpacademy/nova-icons';\n\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport Touchable from '../../hoc/touchable/index.native';\n\nimport type {Theme} from '../../variables/theme.native';\nimport type {Brand} from '../../variables/brand.native';\n\nexport type Props = {\n isVisible: boolean;\n locales: {\n title: string;\n description1: string;\n description2: string;\n cta: string;\n };\n Icon?: FC<{style: ViewStyle}>;\n onValidate: (event: GestureResponderEvent) => void;\n onCancel: (event: GestureResponderEvent) => void;\n};\n\ntype StyleSheetType = {\n popin: ViewStyle;\n content: ViewStyle;\n icon: ViewStyle;\n iconWrapper: ViewStyle;\n button: ViewStyle;\n buttonText: TextStyle;\n closeButton: ViewStyle;\n closeIcon: ViewStyle;\n title: TextStyle;\n description1: TextStyle;\n description2: TextStyle;\n};\n\nconst createStyleSheet = (brandTheme: Brand, theme: Theme) =>\n StyleSheet.create({\n popin: {\n position: 'absolute',\n top: 0,\n bottom: 0,\n justifyContent: 'center',\n alignItems: 'center'\n },\n content: {\n backgroundColor: '#fff',\n justifyContent: 'space-between',\n alignItems: 'center',\n borderRadius: 8,\n paddingVertical: 24\n },\n iconWrapper: {\n width: 100,\n height: 100,\n backgroundColor: '#FFEFEB',\n justifyContent: 'center',\n borderRadius: 60,\n marginBottom: 12\n },\n icon: {\n alignSelf: 'center',\n width: 60,\n height: 60,\n fill: brandTheme.colors?.primary\n },\n title: {\n textAlign: 'center',\n lineHeight: 24,\n fontWeight: '700',\n fontSize: 20,\n marginHorizontal: 24,\n marginVertical: 12\n },\n description1: {\n textAlign: 'center',\n lineHeight: 19,\n fontWeight: '300',\n fontSize: 14,\n marginHorizontal: 24,\n marginVertical: 12\n },\n description2: {\n textAlign: 'center',\n lineHeight: 19,\n fontWeight: '700',\n fontSize: 16,\n paddingHorizontal: 48,\n marginVertical: 12\n },\n button: {\n height: 44,\n backgroundColor: brandTheme.colors?.primary,\n borderRadius: 7,\n justifyContent: 'center',\n padding: 12,\n paddingVertical: 12,\n marginTop: 12\n },\n buttonText: {\n alignSelf: 'center',\n color: '#FFFFFF',\n fontWeight: theme.fontWeight.bold,\n fontFamily: 'System',\n fontSize: 14,\n lineHeight: 20\n },\n closeButton: {\n position: 'absolute',\n top: 0,\n right: 0,\n width: 45,\n height: 45,\n padding: 10,\n flex: 1,\n justifyContent: 'center',\n alignItems: 'center'\n },\n closeIcon: {\n width: '100%',\n height: '100%',\n fill: '#aeaeae'\n }\n });\n\nconst PopinIntro = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {brandTheme, theme} = templateContext;\n const {isVisible, onValidate, onCancel, locales, Icon} = props;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(brandTheme, theme);\n setStylesheet(_stylesheet);\n }, [brandTheme, theme]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <Modal isVisible={isVisible} style={styleSheet.popin} testID=\"intro-popin\">\n <View style={styleSheet.content}>\n {Icon ? (\n <View style={styleSheet.iconWrapper}>\n <Icon style={styleSheet.icon} />\n </View>\n ) : null}\n <Text style={styleSheet.title}>{locales.title}</Text>\n <Text style={styleSheet.description1}>{locales.description1}</Text>\n <Text style={styleSheet.description2}>{locales.description2}</Text>\n <Touchable\n style={styleSheet.button}\n onPress={onValidate}\n testID=\"intro-popin-validate-button\"\n >\n <Text style={styleSheet.buttonText}>{locales.cta}</Text>\n </Touchable>\n <Touchable\n style={styleSheet.closeButton}\n onPress={onCancel}\n testID=\"intro-popin-cancel-button\"\n >\n <CloseIcon style={styleSheet.closeIcon} />\n </Touchable>\n </View>\n </Modal>\n );\n};\n\nexport type PopinIntroProps = Props;\nexport default PopinIntro;\n"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"ignore_dirs":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@coorpacademy/components",
|
|
3
|
-
"version": "11.
|
|
3
|
+
"version": "11.13.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -166,5 +166,5 @@
|
|
|
166
166
|
"last 2 versions",
|
|
167
167
|
"IE 11"
|
|
168
168
|
],
|
|
169
|
-
"gitHead": "
|
|
169
|
+
"gitHead": "e859956579d5f0bc2a54d5f60f2cb56d82f89380"
|
|
170
170
|
}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { GestureResponderEvent } from 'react-native';
|
|
3
|
-
export declare type Props = {
|
|
4
|
-
isVisible: boolean;
|
|
5
|
-
onValidate: (event: GestureResponderEvent) => void;
|
|
6
|
-
};
|
|
7
|
-
declare const PodcastPopinIntro: (props: Props) => JSX.Element | null;
|
|
8
|
-
export declare type PodcastPopinIntroProps = Props;
|
|
9
|
-
export default PodcastPopinIntro;
|
|
10
|
-
//# sourceMappingURL=index.native.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/podcast-popin-intro/index.native.tsx"],"names":[],"mappings":";AACA,OAAO,EAOL,qBAAqB,EACtB,MAAM,cAAc,CAAC;AAQtB,oBAAY,KAAK,GAAG;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;CACpD,CAAC;AAwEF,QAAA,MAAM,iBAAiB,UAAW,KAAK,uBAgCtC,CAAC;AAEF,oBAAY,sBAAsB,GAAG,KAAK,CAAC;AAC3C,eAAe,iBAAiB,CAAC"}
|
|
@@ -1,114 +0,0 @@
|
|
|
1
|
-
import React, { useState, useEffect } from 'react';
|
|
2
|
-
import { useWindowDimensions, StyleSheet, Text, View } from 'react-native';
|
|
3
|
-
import Modal from 'react-native-modal';
|
|
4
|
-
import { NovaSolidAudioHeadphone as Headphone } from '@coorpacademy/nova-icons';
|
|
5
|
-
import { useTemplateContext } from '../../template/app-review/template-context';
|
|
6
|
-
import Touchable from '../../hoc/touchable/index.native';
|
|
7
|
-
|
|
8
|
-
const createStyleSheet = (theme, windowHeight) => {
|
|
9
|
-
const popinHeight = 368;
|
|
10
|
-
return StyleSheet.create({
|
|
11
|
-
container: {
|
|
12
|
-
position: 'absolute',
|
|
13
|
-
top: (windowHeight - popinHeight) / 2,
|
|
14
|
-
height: popinHeight,
|
|
15
|
-
backgroundColor: '#fff',
|
|
16
|
-
justifyContent: 'space-between',
|
|
17
|
-
alignSelf: 'center',
|
|
18
|
-
alignItems: 'center',
|
|
19
|
-
borderRadius: 8,
|
|
20
|
-
// width: '90%',
|
|
21
|
-
padding: 24
|
|
22
|
-
},
|
|
23
|
-
headphonesWrapper: {
|
|
24
|
-
width: 115,
|
|
25
|
-
height: 115,
|
|
26
|
-
backgroundColor: '#FFEFEB',
|
|
27
|
-
justifyContent: 'center',
|
|
28
|
-
borderRadius: 60
|
|
29
|
-
},
|
|
30
|
-
headphones: {
|
|
31
|
-
alignSelf: 'center',
|
|
32
|
-
width: 60,
|
|
33
|
-
height: 60,
|
|
34
|
-
fill: theme.colors.podcast.primary
|
|
35
|
-
},
|
|
36
|
-
button: {
|
|
37
|
-
height: 44,
|
|
38
|
-
backgroundColor: theme.colors.podcast.primary,
|
|
39
|
-
borderRadius: 7,
|
|
40
|
-
justifyContent: 'center',
|
|
41
|
-
paddingHorizontal: 12
|
|
42
|
-
},
|
|
43
|
-
buttonText: {
|
|
44
|
-
alignSelf: 'center',
|
|
45
|
-
color: '#FFFFFF',
|
|
46
|
-
fontWeight: theme.fontWeight.bold,
|
|
47
|
-
fontFamily: 'System',
|
|
48
|
-
fontSize: 14,
|
|
49
|
-
lineHeight: 20
|
|
50
|
-
},
|
|
51
|
-
title: {
|
|
52
|
-
textAlign: 'center',
|
|
53
|
-
lineHeight: 24,
|
|
54
|
-
fontWeight: '700',
|
|
55
|
-
fontSize: 20,
|
|
56
|
-
paddingHorizontal: 40
|
|
57
|
-
},
|
|
58
|
-
message: {
|
|
59
|
-
textAlign: 'center',
|
|
60
|
-
lineHeight: 19,
|
|
61
|
-
fontWeight: '300',
|
|
62
|
-
fontSize: 16,
|
|
63
|
-
paddingHorizontal: 35
|
|
64
|
-
}
|
|
65
|
-
});
|
|
66
|
-
};
|
|
67
|
-
|
|
68
|
-
const PodcastPopinIntro = props => {
|
|
69
|
-
const {
|
|
70
|
-
height: windowHeight
|
|
71
|
-
} = useWindowDimensions();
|
|
72
|
-
const templateContext = useTemplateContext();
|
|
73
|
-
const [styleSheet, setStylesheet] = useState(null);
|
|
74
|
-
const {
|
|
75
|
-
theme,
|
|
76
|
-
translations
|
|
77
|
-
} = templateContext;
|
|
78
|
-
const {
|
|
79
|
-
isVisible,
|
|
80
|
-
onValidate
|
|
81
|
-
} = props;
|
|
82
|
-
useEffect(() => {
|
|
83
|
-
const _stylesheet = createStyleSheet(theme, windowHeight);
|
|
84
|
-
|
|
85
|
-
setStylesheet(_stylesheet);
|
|
86
|
-
}, [theme, windowHeight]);
|
|
87
|
-
|
|
88
|
-
if (!styleSheet) {
|
|
89
|
-
return null;
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
return /*#__PURE__*/React.createElement(Modal, {
|
|
93
|
-
isVisible: isVisible,
|
|
94
|
-
style: styleSheet.container,
|
|
95
|
-
testID: "podcast-popin-intro"
|
|
96
|
-
}, /*#__PURE__*/React.createElement(View, {
|
|
97
|
-
style: styleSheet.headphonesWrapper
|
|
98
|
-
}, /*#__PURE__*/React.createElement(Headphone, {
|
|
99
|
-
style: styleSheet.headphones
|
|
100
|
-
})), /*#__PURE__*/React.createElement(Text, {
|
|
101
|
-
style: styleSheet.title
|
|
102
|
-
}, translations.appPodcast.infoNewFeature.title), /*#__PURE__*/React.createElement(Text, {
|
|
103
|
-
style: styleSheet.message
|
|
104
|
-
}, translations.appPodcast.infoNewFeature.message), /*#__PURE__*/React.createElement(Touchable, {
|
|
105
|
-
style: styleSheet.button,
|
|
106
|
-
onPress: onValidate,
|
|
107
|
-
testID: "podcast-popin-intro-validate-button"
|
|
108
|
-
}, /*#__PURE__*/React.createElement(Text, {
|
|
109
|
-
style: styleSheet.buttonText
|
|
110
|
-
}, translations.appPodcast.infoNewFeature.cta)));
|
|
111
|
-
};
|
|
112
|
-
|
|
113
|
-
export default PodcastPopinIntro;
|
|
114
|
-
//# sourceMappingURL=index.native.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["React","useState","useEffect","useWindowDimensions","StyleSheet","Text","View","Modal","NovaSolidAudioHeadphone","Headphone","useTemplateContext","Touchable","createStyleSheet","theme","windowHeight","popinHeight","create","container","position","top","height","backgroundColor","justifyContent","alignSelf","alignItems","borderRadius","padding","headphonesWrapper","width","headphones","fill","colors","podcast","primary","button","paddingHorizontal","buttonText","color","fontWeight","bold","fontFamily","fontSize","lineHeight","title","textAlign","message","PodcastPopinIntro","props","templateContext","styleSheet","setStylesheet","translations","isVisible","onValidate","_stylesheet","appPodcast","infoNewFeature","cta"],"sources":["../../../src/organism/podcast-popin-intro/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {\n useWindowDimensions,\n StyleSheet,\n ViewStyle,\n Text,\n TextStyle,\n View,\n GestureResponderEvent\n} from 'react-native';\nimport Modal from 'react-native-modal';\nimport {NovaSolidAudioHeadphone as Headphone} from '@coorpacademy/nova-icons';\n\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Theme} from '../../variables/theme.native';\n\nexport type Props = {\n isVisible: boolean;\n onValidate: (event: GestureResponderEvent) => void;\n};\n\ntype StyleSheetType = {\n container: ViewStyle;\n headphones: ViewStyle;\n headphonesWrapper: ViewStyle;\n button: ViewStyle;\n buttonText: TextStyle;\n title: TextStyle;\n message: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme, windowHeight: number) => {\n const popinHeight = 368;\n return StyleSheet.create({\n container: {\n position: 'absolute',\n top: (windowHeight - popinHeight) / 2,\n height: popinHeight,\n backgroundColor: '#fff',\n justifyContent: 'space-between',\n alignSelf: 'center',\n alignItems: 'center',\n borderRadius: 8,\n // width: '90%',\n padding: 24\n },\n headphonesWrapper: {\n width: 115,\n height: 115,\n backgroundColor: '#FFEFEB',\n justifyContent: 'center',\n borderRadius: 60\n },\n headphones: {\n alignSelf: 'center',\n width: 60,\n height: 60,\n fill: theme.colors.podcast.primary\n },\n button: {\n height: 44,\n backgroundColor: theme.colors.podcast.primary,\n borderRadius: 7,\n justifyContent: 'center',\n paddingHorizontal: 12\n },\n buttonText: {\n alignSelf: 'center',\n color: '#FFFFFF',\n fontWeight: theme.fontWeight.bold,\n fontFamily: 'System',\n fontSize: 14,\n lineHeight: 20\n },\n title: {\n textAlign: 'center',\n lineHeight: 24,\n fontWeight: '700',\n fontSize: 20,\n paddingHorizontal: 40\n },\n message: {\n textAlign: 'center',\n lineHeight: 19,\n fontWeight: '300',\n fontSize: 16,\n paddingHorizontal: 35\n }\n });\n};\n\nconst PodcastPopinIntro = (props: Props) => {\n const {height: windowHeight} = useWindowDimensions();\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {theme, translations} = templateContext;\n const {isVisible, onValidate} = props;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme, windowHeight);\n setStylesheet(_stylesheet);\n }, [theme, windowHeight]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <Modal isVisible={isVisible} style={styleSheet.container} testID=\"podcast-popin-intro\">\n <View style={styleSheet.headphonesWrapper}>\n <Headphone style={styleSheet.headphones} />\n </View>\n <Text style={styleSheet.title}>{translations.appPodcast.infoNewFeature.title}</Text>\n <Text style={styleSheet.message}>{translations.appPodcast.infoNewFeature.message}</Text>\n <Touchable\n style={styleSheet.button}\n onPress={onValidate}\n testID=\"podcast-popin-intro-validate-button\"\n >\n <Text style={styleSheet.buttonText}>{translations.appPodcast.infoNewFeature.cta}</Text>\n </Touchable>\n </Modal>\n );\n};\n\nexport type PodcastPopinIntroProps = Props;\nexport default PodcastPopinIntro;\n"],"mappings":"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"}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { GestureResponderEvent } from 'react-native';
|
|
3
|
-
export declare type Props = {
|
|
4
|
-
isVisible: boolean;
|
|
5
|
-
onValidate: (event: GestureResponderEvent) => void;
|
|
6
|
-
};
|
|
7
|
-
declare const PodcastPopinIntro: (props: Props) => JSX.Element | null;
|
|
8
|
-
export declare type PodcastPopinIntroProps = Props;
|
|
9
|
-
export default PodcastPopinIntro;
|
|
10
|
-
//# sourceMappingURL=index.native.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/podcast-popin-intro/index.native.tsx"],"names":[],"mappings":";AACA,OAAO,EAOL,qBAAqB,EACtB,MAAM,cAAc,CAAC;AAQtB,oBAAY,KAAK,GAAG;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;CACpD,CAAC;AAwEF,QAAA,MAAM,iBAAiB,UAAW,KAAK,uBAgCtC,CAAC;AAEF,oBAAY,sBAAsB,GAAG,KAAK,CAAC;AAC3C,eAAe,iBAAiB,CAAC"}
|
|
@@ -1,131 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
|
|
6
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
7
|
-
|
|
8
|
-
var _reactNative = require("react-native");
|
|
9
|
-
|
|
10
|
-
var _reactNativeModal = _interopRequireDefault(require("react-native-modal"));
|
|
11
|
-
|
|
12
|
-
var _novaIcons = require("@coorpacademy/nova-icons");
|
|
13
|
-
|
|
14
|
-
var _templateContext = require("../../template/app-review/template-context");
|
|
15
|
-
|
|
16
|
-
var _index = _interopRequireDefault(require("../../hoc/touchable/index.native"));
|
|
17
|
-
|
|
18
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
-
|
|
20
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
|
-
|
|
22
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
|
-
|
|
24
|
-
const createStyleSheet = (theme, windowHeight) => {
|
|
25
|
-
const popinHeight = 368;
|
|
26
|
-
return _reactNative.StyleSheet.create({
|
|
27
|
-
container: {
|
|
28
|
-
position: 'absolute',
|
|
29
|
-
top: (windowHeight - popinHeight) / 2,
|
|
30
|
-
height: popinHeight,
|
|
31
|
-
backgroundColor: '#fff',
|
|
32
|
-
justifyContent: 'space-between',
|
|
33
|
-
alignSelf: 'center',
|
|
34
|
-
alignItems: 'center',
|
|
35
|
-
borderRadius: 8,
|
|
36
|
-
// width: '90%',
|
|
37
|
-
padding: 24
|
|
38
|
-
},
|
|
39
|
-
headphonesWrapper: {
|
|
40
|
-
width: 115,
|
|
41
|
-
height: 115,
|
|
42
|
-
backgroundColor: '#FFEFEB',
|
|
43
|
-
justifyContent: 'center',
|
|
44
|
-
borderRadius: 60
|
|
45
|
-
},
|
|
46
|
-
headphones: {
|
|
47
|
-
alignSelf: 'center',
|
|
48
|
-
width: 60,
|
|
49
|
-
height: 60,
|
|
50
|
-
fill: theme.colors.podcast.primary
|
|
51
|
-
},
|
|
52
|
-
button: {
|
|
53
|
-
height: 44,
|
|
54
|
-
backgroundColor: theme.colors.podcast.primary,
|
|
55
|
-
borderRadius: 7,
|
|
56
|
-
justifyContent: 'center',
|
|
57
|
-
paddingHorizontal: 12
|
|
58
|
-
},
|
|
59
|
-
buttonText: {
|
|
60
|
-
alignSelf: 'center',
|
|
61
|
-
color: '#FFFFFF',
|
|
62
|
-
fontWeight: theme.fontWeight.bold,
|
|
63
|
-
fontFamily: 'System',
|
|
64
|
-
fontSize: 14,
|
|
65
|
-
lineHeight: 20
|
|
66
|
-
},
|
|
67
|
-
title: {
|
|
68
|
-
textAlign: 'center',
|
|
69
|
-
lineHeight: 24,
|
|
70
|
-
fontWeight: '700',
|
|
71
|
-
fontSize: 20,
|
|
72
|
-
paddingHorizontal: 40
|
|
73
|
-
},
|
|
74
|
-
message: {
|
|
75
|
-
textAlign: 'center',
|
|
76
|
-
lineHeight: 19,
|
|
77
|
-
fontWeight: '300',
|
|
78
|
-
fontSize: 16,
|
|
79
|
-
paddingHorizontal: 35
|
|
80
|
-
}
|
|
81
|
-
});
|
|
82
|
-
};
|
|
83
|
-
|
|
84
|
-
const PodcastPopinIntro = props => {
|
|
85
|
-
const {
|
|
86
|
-
height: windowHeight
|
|
87
|
-
} = (0, _reactNative.useWindowDimensions)();
|
|
88
|
-
const templateContext = (0, _templateContext.useTemplateContext)();
|
|
89
|
-
const [styleSheet, setStylesheet] = (0, _react.useState)(null);
|
|
90
|
-
const {
|
|
91
|
-
theme,
|
|
92
|
-
translations
|
|
93
|
-
} = templateContext;
|
|
94
|
-
const {
|
|
95
|
-
isVisible,
|
|
96
|
-
onValidate
|
|
97
|
-
} = props;
|
|
98
|
-
(0, _react.useEffect)(() => {
|
|
99
|
-
const _stylesheet = createStyleSheet(theme, windowHeight);
|
|
100
|
-
|
|
101
|
-
setStylesheet(_stylesheet);
|
|
102
|
-
}, [theme, windowHeight]);
|
|
103
|
-
|
|
104
|
-
if (!styleSheet) {
|
|
105
|
-
return null;
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
return /*#__PURE__*/_react.default.createElement(_reactNativeModal.default, {
|
|
109
|
-
isVisible: isVisible,
|
|
110
|
-
style: styleSheet.container,
|
|
111
|
-
testID: "podcast-popin-intro"
|
|
112
|
-
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
113
|
-
style: styleSheet.headphonesWrapper
|
|
114
|
-
}, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaSolidAudioHeadphone, {
|
|
115
|
-
style: styleSheet.headphones
|
|
116
|
-
})), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
117
|
-
style: styleSheet.title
|
|
118
|
-
}, translations.appPodcast.infoNewFeature.title), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
119
|
-
style: styleSheet.message
|
|
120
|
-
}, translations.appPodcast.infoNewFeature.message), /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
121
|
-
style: styleSheet.button,
|
|
122
|
-
onPress: onValidate,
|
|
123
|
-
testID: "podcast-popin-intro-validate-button"
|
|
124
|
-
}, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
125
|
-
style: styleSheet.buttonText
|
|
126
|
-
}, translations.appPodcast.infoNewFeature.cta)));
|
|
127
|
-
};
|
|
128
|
-
|
|
129
|
-
var _default = PodcastPopinIntro;
|
|
130
|
-
exports.default = _default;
|
|
131
|
-
//# sourceMappingURL=index.native.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","windowHeight","popinHeight","StyleSheet","create","container","position","top","height","backgroundColor","justifyContent","alignSelf","alignItems","borderRadius","padding","headphonesWrapper","width","headphones","fill","colors","podcast","primary","button","paddingHorizontal","buttonText","color","fontWeight","bold","fontFamily","fontSize","lineHeight","title","textAlign","message","PodcastPopinIntro","props","useWindowDimensions","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","translations","isVisible","onValidate","useEffect","_stylesheet","appPodcast","infoNewFeature","cta"],"sources":["../../../src/organism/podcast-popin-intro/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {\n useWindowDimensions,\n StyleSheet,\n ViewStyle,\n Text,\n TextStyle,\n View,\n GestureResponderEvent\n} from 'react-native';\nimport Modal from 'react-native-modal';\nimport {NovaSolidAudioHeadphone as Headphone} from '@coorpacademy/nova-icons';\n\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Theme} from '../../variables/theme.native';\n\nexport type Props = {\n isVisible: boolean;\n onValidate: (event: GestureResponderEvent) => void;\n};\n\ntype StyleSheetType = {\n container: ViewStyle;\n headphones: ViewStyle;\n headphonesWrapper: ViewStyle;\n button: ViewStyle;\n buttonText: TextStyle;\n title: TextStyle;\n message: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme, windowHeight: number) => {\n const popinHeight = 368;\n return StyleSheet.create({\n container: {\n position: 'absolute',\n top: (windowHeight - popinHeight) / 2,\n height: popinHeight,\n backgroundColor: '#fff',\n justifyContent: 'space-between',\n alignSelf: 'center',\n alignItems: 'center',\n borderRadius: 8,\n // width: '90%',\n padding: 24\n },\n headphonesWrapper: {\n width: 115,\n height: 115,\n backgroundColor: '#FFEFEB',\n justifyContent: 'center',\n borderRadius: 60\n },\n headphones: {\n alignSelf: 'center',\n width: 60,\n height: 60,\n fill: theme.colors.podcast.primary\n },\n button: {\n height: 44,\n backgroundColor: theme.colors.podcast.primary,\n borderRadius: 7,\n justifyContent: 'center',\n paddingHorizontal: 12\n },\n buttonText: {\n alignSelf: 'center',\n color: '#FFFFFF',\n fontWeight: theme.fontWeight.bold,\n fontFamily: 'System',\n fontSize: 14,\n lineHeight: 20\n },\n title: {\n textAlign: 'center',\n lineHeight: 24,\n fontWeight: '700',\n fontSize: 20,\n paddingHorizontal: 40\n },\n message: {\n textAlign: 'center',\n lineHeight: 19,\n fontWeight: '300',\n fontSize: 16,\n paddingHorizontal: 35\n }\n });\n};\n\nconst PodcastPopinIntro = (props: Props) => {\n const {height: windowHeight} = useWindowDimensions();\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {theme, translations} = templateContext;\n const {isVisible, onValidate} = props;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme, windowHeight);\n setStylesheet(_stylesheet);\n }, [theme, windowHeight]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <Modal isVisible={isVisible} style={styleSheet.container} testID=\"podcast-popin-intro\">\n <View style={styleSheet.headphonesWrapper}>\n <Headphone style={styleSheet.headphones} />\n </View>\n <Text style={styleSheet.title}>{translations.appPodcast.infoNewFeature.title}</Text>\n <Text style={styleSheet.message}>{translations.appPodcast.infoNewFeature.message}</Text>\n <Touchable\n style={styleSheet.button}\n onPress={onValidate}\n testID=\"podcast-popin-intro-validate-button\"\n >\n <Text style={styleSheet.buttonText}>{translations.appPodcast.infoNewFeature.cta}</Text>\n </Touchable>\n </Modal>\n );\n};\n\nexport type PodcastPopinIntroProps = Props;\nexport default PodcastPopinIntro;\n"],"mappings":"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"}
|