@coorpacademy/components 10.22.1 → 10.22.4
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/atom/drag-and-drop/index.js +2 -1
- package/es/atom/drag-and-drop/index.js.map +1 -1
- package/es/atom/header-back-button/index.native.js +74 -0
- package/es/atom/header-back-button/index.native.js.map +1 -0
- package/es/atom/header-back-icon/index.native.js +27 -0
- package/es/atom/header-back-icon/index.native.js.map +1 -0
- package/es/atom/html/index.native.js +153 -0
- package/es/atom/html/index.native.js.map +1 -0
- package/es/atom/input-checkbox/index.js +3 -2
- package/es/atom/input-checkbox/index.js.map +1 -1
- package/es/atom/input-switch/index.js +2 -1
- package/es/atom/input-switch/index.js.map +1 -1
- package/es/atom/select-modal/index.native.js +113 -0
- package/es/atom/select-modal/index.native.js.map +1 -0
- package/es/atom/space/index.native.js +21 -0
- package/es/atom/space/index.native.js.map +1 -0
- package/es/atom/spinner/index.js +1 -0
- package/es/atom/spinner/index.js.map +1 -1
- package/es/atom/text/index.native.js +29 -0
- package/es/atom/text/index.native.js.map +1 -0
- package/es/hoc/modal/index.native.js +97 -0
- package/es/hoc/modal/index.native.js.map +1 -0
- package/es/hoc/modal/select/index.native.js +85 -0
- package/es/hoc/modal/select/index.native.js.map +1 -0
- package/es/hoc/modal/select-item/index.native.js +54 -0
- package/es/hoc/modal/select-item/index.native.js.map +1 -0
- package/es/hoc/touchable/index.native.js +69 -0
- package/es/hoc/touchable/index.native.js.map +1 -0
- package/es/index.js +2 -1
- package/es/index.js.map +1 -1
- package/es/molecule/cm-popin/index.js +27 -8
- package/es/molecule/cm-popin/index.js.map +1 -1
- package/es/molecule/cm-popin/style.css +24 -1
- package/es/molecule/dashboard/battle-request-list/index.js +3 -5
- package/es/molecule/dashboard/battle-request-list/index.js.map +1 -1
- package/es/molecule/dashboard/news-list/index.js +3 -5
- package/es/molecule/dashboard/news-list/index.js.map +1 -1
- package/es/molecule/dashboard/review-banner/index.js +3 -5
- package/es/molecule/dashboard/review-banner/index.js.map +1 -1
- package/es/molecule/dashboard/start-battle/index.js +3 -5
- package/es/molecule/dashboard/start-battle/index.js.map +1 -1
- package/es/molecule/external-content-viewer/index.js +2 -1
- package/es/molecule/external-content-viewer/index.js.map +1 -1
- package/es/molecule/feedback/index.js +7 -3
- package/es/molecule/feedback/index.js.map +1 -1
- package/es/molecule/feedback/style.css +24 -0
- package/es/molecule/questions/free-text/index.native.js +5 -6
- package/es/molecule/questions/free-text/index.native.js.map +1 -1
- package/es/molecule/questions/qcm/index.native.js +6 -3
- package/es/molecule/questions/qcm/index.native.js.map +1 -1
- package/es/molecule/skill-card/prop-types.js +1 -1
- package/es/molecule/skill-card/prop-types.js.map +1 -1
- package/es/template/app-player/loading/index.js +1 -0
- package/es/template/app-player/loading/index.js.map +1 -1
- package/es/template/app-player/player/index.js +6 -3
- package/es/template/app-player/player/index.js.map +1 -1
- package/es/template/app-player/popin-end/index.js +21 -6
- package/es/template/app-player/popin-end/index.js.map +1 -1
- package/es/template/app-player/popin-end/style.css +1 -1
- package/es/template/app-player/popin-end/summary.css +65 -0
- package/es/template/app-player/popin-end/summary.js +57 -7
- package/es/template/app-player/popin-end/summary.js.map +1 -1
- package/es/template/app-player/popin-header/index.js +33 -12
- package/es/template/app-player/popin-header/index.js.map +1 -1
- package/es/template/app-player/popin-header/style.css +93 -0
- package/es/template/app-player/popin-no-access/index.js +27 -0
- package/es/template/app-player/popin-no-access/index.js.map +1 -0
- package/es/template/app-review/demo-ts/index.js +2 -0
- package/es/template/app-review/demo-ts/index.js.map +1 -1
- package/es/template/app-review/demo-ts/index.native.js +9 -0
- package/es/template/app-review/demo-ts/index.native.js.map +1 -0
- package/es/template/app-review/demo-ts/typings.js +7 -0
- package/es/template/app-review/demo-ts/typings.js.map +1 -0
- package/es/template/app-review/index.js +4 -0
- package/es/template/app-review/index.js.map +1 -1
- package/es/template/app-review/index.native.js +3 -13
- package/es/template/app-review/index.native.js.map +1 -1
- package/es/template/app-review/prop-types.js +2 -1
- package/es/template/app-review/prop-types.js.map +1 -1
- package/es/template/app-review/slides/index.js +2 -2
- package/es/template/app-review/slides/index.js.map +1 -1
- package/es/template/app-review/slides/index.native.js +17 -14
- package/es/template/app-review/slides/index.native.js.map +1 -1
- package/es/template/app-review/template-context.js +9 -3
- package/es/template/app-review/template-context.js.map +1 -1
- package/es/types/progression-engine.d.js +2 -0
- package/es/types/progression-engine.d.js.map +1 -0
- package/es/variables/analytics.js.map +1 -1
- package/es/variables/theme.native.js +66 -0
- package/es/variables/theme.native.js.map +1 -0
- package/es/variables/vibration.js +10 -0
- package/es/variables/vibration.js.map +1 -0
- package/lib/atom/drag-and-drop/index.js +2 -1
- package/lib/atom/drag-and-drop/index.js.map +1 -1
- package/lib/atom/header-back-button/index.native.js +95 -0
- package/lib/atom/header-back-button/index.native.js.map +1 -0
- package/lib/atom/header-back-icon/index.native.js +38 -0
- package/lib/atom/header-back-icon/index.native.js.map +1 -0
- package/lib/atom/html/index.native.js +170 -0
- package/lib/atom/html/index.native.js.map +1 -0
- package/lib/atom/input-checkbox/index.js +2 -1
- package/lib/atom/input-checkbox/index.js.map +1 -1
- package/lib/atom/input-switch/index.js +2 -1
- package/lib/atom/input-switch/index.js.map +1 -1
- package/lib/atom/select-modal/index.native.js +135 -0
- package/lib/atom/select-modal/index.native.js.map +1 -0
- package/lib/atom/space/index.native.js +33 -0
- package/lib/atom/space/index.native.js.map +1 -0
- package/lib/atom/spinner/index.js +1 -0
- package/lib/atom/spinner/index.js.map +1 -1
- package/lib/atom/text/index.native.js +44 -0
- package/lib/atom/text/index.native.js.map +1 -0
- package/lib/hoc/modal/index.native.js +114 -0
- package/lib/hoc/modal/index.native.js.map +1 -0
- package/lib/hoc/modal/select/index.native.js +101 -0
- package/lib/hoc/modal/select/index.native.js.map +1 -0
- package/lib/hoc/modal/select-item/index.native.js +70 -0
- package/lib/hoc/modal/select-item/index.native.js.map +1 -0
- package/lib/hoc/touchable/index.native.js +83 -0
- package/lib/hoc/touchable/index.native.js.map +1 -0
- package/lib/index.js +4 -0
- package/lib/index.js.map +1 -1
- package/lib/molecule/cm-popin/index.js +27 -8
- package/lib/molecule/cm-popin/index.js.map +1 -1
- package/lib/molecule/cm-popin/style.css +24 -1
- package/lib/molecule/dashboard/battle-request-list/index.js +3 -5
- package/lib/molecule/dashboard/battle-request-list/index.js.map +1 -1
- package/lib/molecule/dashboard/news-list/index.js +3 -5
- package/lib/molecule/dashboard/news-list/index.js.map +1 -1
- package/lib/molecule/dashboard/review-banner/index.js +3 -5
- package/lib/molecule/dashboard/review-banner/index.js.map +1 -1
- package/lib/molecule/dashboard/start-battle/index.js +3 -5
- package/lib/molecule/dashboard/start-battle/index.js.map +1 -1
- package/lib/molecule/external-content-viewer/index.js +2 -1
- package/lib/molecule/external-content-viewer/index.js.map +1 -1
- package/lib/molecule/feedback/index.js +7 -3
- package/lib/molecule/feedback/index.js.map +1 -1
- package/lib/molecule/feedback/style.css +24 -0
- package/lib/molecule/questions/free-text/index.native.js +5 -6
- package/lib/molecule/questions/free-text/index.native.js.map +1 -1
- package/lib/molecule/questions/qcm/index.native.js +7 -3
- package/lib/molecule/questions/qcm/index.native.js.map +1 -1
- package/lib/molecule/skill-card/prop-types.js +1 -1
- package/lib/molecule/skill-card/prop-types.js.map +1 -1
- package/lib/template/app-player/loading/index.js +1 -0
- package/lib/template/app-player/loading/index.js.map +1 -1
- package/lib/template/app-player/player/index.js +7 -3
- package/lib/template/app-player/player/index.js.map +1 -1
- package/lib/template/app-player/popin-end/index.js +21 -6
- package/lib/template/app-player/popin-end/index.js.map +1 -1
- package/lib/template/app-player/popin-end/style.css +1 -1
- package/lib/template/app-player/popin-end/summary.css +65 -0
- package/lib/template/app-player/popin-end/summary.js +58 -7
- package/lib/template/app-player/popin-end/summary.js.map +1 -1
- package/lib/template/app-player/popin-header/index.js +32 -11
- package/lib/template/app-player/popin-header/index.js.map +1 -1
- package/lib/template/app-player/popin-header/style.css +93 -0
- package/lib/template/app-player/popin-no-access/index.js +37 -0
- package/lib/template/app-player/popin-no-access/index.js.map +1 -0
- package/lib/template/app-review/demo-ts/index.js +3 -0
- package/lib/template/app-review/demo-ts/index.js.map +1 -1
- package/lib/template/app-review/demo-ts/index.native.js +18 -0
- package/lib/template/app-review/demo-ts/index.native.js.map +1 -0
- package/lib/template/app-review/demo-ts/typings.js +16 -0
- package/lib/template/app-review/demo-ts/typings.js.map +1 -0
- package/lib/template/app-review/index.js +5 -0
- package/lib/template/app-review/index.js.map +1 -1
- package/lib/template/app-review/index.native.js +2 -12
- package/lib/template/app-review/index.native.js.map +1 -1
- package/lib/template/app-review/prop-types.js +2 -1
- package/lib/template/app-review/prop-types.js.map +1 -1
- package/lib/template/app-review/slides/index.js +2 -2
- package/lib/template/app-review/slides/index.js.map +1 -1
- package/lib/template/app-review/slides/index.native.js +17 -14
- package/lib/template/app-review/slides/index.native.js.map +1 -1
- package/lib/template/app-review/template-context.js +10 -1
- package/lib/template/app-review/template-context.js.map +1 -1
- package/lib/types/progression-engine.d.js +2 -0
- package/lib/types/progression-engine.d.js.map +1 -0
- package/lib/variables/analytics.js.map +1 -1
- package/lib/variables/theme.native.js +72 -0
- package/lib/variables/theme.native.js.map +1 -0
- package/lib/variables/vibration.js +15 -0
- package/lib/variables/vibration.js.map +1 -0
- package/package.json +9 -3
|
@@ -0,0 +1,135 @@
|
|
|
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 _novaIcons = require("@coorpacademy/nova-icons");
|
|
11
|
+
|
|
12
|
+
var _reactNativeModal = _interopRequireDefault(require("react-native-modal"));
|
|
13
|
+
|
|
14
|
+
var _index = _interopRequireDefault(require("../../hoc/touchable/index.native"));
|
|
15
|
+
|
|
16
|
+
var _analytics = require("../../variables/analytics");
|
|
17
|
+
|
|
18
|
+
var _index2 = _interopRequireDefault(require("../space/index.native"));
|
|
19
|
+
|
|
20
|
+
var _index3 = _interopRequireDefault(require("../text/index.native"));
|
|
21
|
+
|
|
22
|
+
var _index4 = _interopRequireDefault(require("../../hoc/modal/select/index.native"));
|
|
23
|
+
|
|
24
|
+
var _templateContext = require("../../template/app-review/template-context");
|
|
25
|
+
|
|
26
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
27
|
+
|
|
28
|
+
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
29
|
+
|
|
30
|
+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
|
|
31
|
+
|
|
32
|
+
const ICON_WIDTH = 15;
|
|
33
|
+
|
|
34
|
+
const createStyleSheet = theme => _reactNative.StyleSheet.create({
|
|
35
|
+
container: {
|
|
36
|
+
alignItems: 'center',
|
|
37
|
+
flexDirection: 'row'
|
|
38
|
+
},
|
|
39
|
+
text: {
|
|
40
|
+
flex: 1,
|
|
41
|
+
color: theme.colors.gray.medium,
|
|
42
|
+
textAlign: 'center'
|
|
43
|
+
}
|
|
44
|
+
});
|
|
45
|
+
|
|
46
|
+
const logEvent = (eventName, analyticsID, analytics, questionType) => {
|
|
47
|
+
analytics && analytics.logEvent(eventName, {
|
|
48
|
+
id: analyticsID,
|
|
49
|
+
questionType
|
|
50
|
+
});
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
const Select = props => {
|
|
54
|
+
const templateContext = (0, _templateContext.useTemplateContext)();
|
|
55
|
+
const {
|
|
56
|
+
theme,
|
|
57
|
+
analytics
|
|
58
|
+
} = templateContext;
|
|
59
|
+
const [styleSheet, setStylesheet] = (0, _react.useState)(null);
|
|
60
|
+
(0, _react.useEffect)(() => {
|
|
61
|
+
const _stylesheet = createStyleSheet(theme);
|
|
62
|
+
|
|
63
|
+
setStylesheet(_stylesheet);
|
|
64
|
+
}, [theme]);
|
|
65
|
+
const {
|
|
66
|
+
analyticsID,
|
|
67
|
+
onBlur,
|
|
68
|
+
onFocus,
|
|
69
|
+
onChange,
|
|
70
|
+
values,
|
|
71
|
+
placeholder,
|
|
72
|
+
value,
|
|
73
|
+
style,
|
|
74
|
+
textStyle,
|
|
75
|
+
color,
|
|
76
|
+
questionType,
|
|
77
|
+
isFocused = false,
|
|
78
|
+
isDisabled = false,
|
|
79
|
+
testID = 'select'
|
|
80
|
+
} = props;
|
|
81
|
+
const handleFocus = (0, _react.useMemo)(() => () => {
|
|
82
|
+
if (!onFocus) return;
|
|
83
|
+
analytics && logEvent(_analytics.ANALYTICS_EVENT_TYPE.OPEN_SELECT, analyticsID, analytics, questionType);
|
|
84
|
+
onFocus();
|
|
85
|
+
}, [analytics, analyticsID, onFocus, questionType]);
|
|
86
|
+
const handleBlur = (0, _react.useMemo)(() => () => {
|
|
87
|
+
if (!onBlur) return;
|
|
88
|
+
analytics && logEvent(_analytics.ANALYTICS_EVENT_TYPE.CLOSE_SELECT, analyticsID, analytics, questionType);
|
|
89
|
+
onBlur();
|
|
90
|
+
}, [analytics, analyticsID, onBlur, questionType]);
|
|
91
|
+
const handleChange = (0, _react.useMemo)(() => () => {
|
|
92
|
+
onChange(value);
|
|
93
|
+
handleBlur();
|
|
94
|
+
}, [value, onChange, handleBlur]);
|
|
95
|
+
|
|
96
|
+
if (!styleSheet) {
|
|
97
|
+
return null;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
const selectedItem = values.find(item => item.text === value);
|
|
101
|
+
const text = selectedItem && selectedItem.text || placeholder || null;
|
|
102
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
103
|
+
disabled: isDisabled,
|
|
104
|
+
onPress: handleFocus,
|
|
105
|
+
analyticsID: analyticsID,
|
|
106
|
+
testID: `${testID}-input`
|
|
107
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
108
|
+
style: [styleSheet.container, style]
|
|
109
|
+
}, /*#__PURE__*/_react.default.createElement(_index3.default, {
|
|
110
|
+
style: [styleSheet.text, textStyle, color && {
|
|
111
|
+
color
|
|
112
|
+
}]
|
|
113
|
+
}, text), /*#__PURE__*/_react.default.createElement(_index2.default, {
|
|
114
|
+
type: "tiny"
|
|
115
|
+
}), /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationArrowDown, {
|
|
116
|
+
color: color || theme.colors.gray.dark,
|
|
117
|
+
height: ICON_WIDTH,
|
|
118
|
+
width: ICON_WIDTH
|
|
119
|
+
}))), /*#__PURE__*/_react.default.createElement(_reactNativeModal.default, {
|
|
120
|
+
isVisible: isFocused,
|
|
121
|
+
onSwipeComplete: handleBlur,
|
|
122
|
+
onBackdropPress: handleBlur,
|
|
123
|
+
testID: testID
|
|
124
|
+
}, /*#__PURE__*/_react.default.createElement(_index4.default, {
|
|
125
|
+
value: value,
|
|
126
|
+
values: values,
|
|
127
|
+
onChange: handleChange,
|
|
128
|
+
onClose: handleBlur,
|
|
129
|
+
testID: `${testID}-modal`
|
|
130
|
+
})));
|
|
131
|
+
};
|
|
132
|
+
|
|
133
|
+
var _default = Select;
|
|
134
|
+
exports.default = _default;
|
|
135
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/select-modal/index.native.tsx"],"names":["ICON_WIDTH","createStyleSheet","theme","StyleSheet","create","container","alignItems","flexDirection","text","flex","color","colors","gray","medium","textAlign","logEvent","eventName","analyticsID","analytics","questionType","id","Select","props","templateContext","styleSheet","setStylesheet","_stylesheet","onBlur","onFocus","onChange","values","placeholder","value","style","textStyle","isFocused","isDisabled","testID","handleFocus","ANALYTICS_EVENT_TYPE","OPEN_SELECT","handleBlur","CLOSE_SELECT","handleChange","selectedItem","find","item","dark"],"mappings":"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","sourcesContent":["import React, {useState, useEffect, useMemo} from 'react';\nimport {View, StyleSheet, ViewStyle, TextStyle, FlexAlignType, FlexStyle} from 'react-native';\nimport {NovaCompositionNavigationArrowDown as ArrowDown} from '@coorpacademy/nova-icons';\nimport Modal from 'react-native-modal';\nimport Touchable from '../../hoc/touchable/index.native';\nimport type {QuestionType} from '../../types/progression-engine';\nimport {Theme} from '../../variables/theme.native';\n\nimport {ANALYTICS_EVENT_TYPE, Analytics} from '../../variables/analytics';\nimport Space from '../space/index.native';\nimport Text from '../text/index.native';\nimport ModalSelect, {OnChangeFunction} from '../../hoc/modal/select/index.native';\nimport type {Props as ModalSelectProps} from '../../hoc/modal/select/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\n\nexport type Props = {\n analyticsID: string;\n questionType: QuestionType;\n isDisabled?: boolean;\n isFocused?: boolean;\n values: Pick<ModalSelectProps, 'values'>;\n value?: Pick<ModalSelectProps, 'value'>;\n placeholder?: string;\n color?: string;\n onChange: OnChangeFunction;\n onFocus: () => void;\n onBlur: () => void;\n style?: ViewStyle;\n textStyle?: ViewStyle;\n testID?: string;\n};\n\ntype StyleSheetType = {\n container: {\n alignItems: FlexAlignType;\n flexDirection: 'row' | 'column' | 'row-reverse' | 'column-reverse' | undefined;\n };\n text: {\n flex: number;\n color: string;\n textAlign: string;\n };\n};\n\nconst ICON_WIDTH = 15;\n\nconst createStyleSheet = (theme: Theme) =>\n StyleSheet.create({\n container: {\n alignItems: 'center',\n flexDirection: 'row'\n },\n text: {\n flex: 1,\n color: theme.colors.gray.medium,\n textAlign: 'center'\n }\n });\n\nconst logEvent = (\n eventName: string,\n analyticsID: String,\n analytics: Analytics,\n questionType: QuestionType\n) => {\n analytics &&\n analytics.logEvent(eventName, {\n id: analyticsID,\n questionType\n });\n};\n\nconst Select = (props: Props) => {\n const templateContext = useTemplateContext();\n const {theme, analytics} = templateContext;\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n const {\n analyticsID,\n onBlur,\n onFocus,\n onChange,\n values,\n placeholder,\n value,\n style,\n textStyle,\n color,\n questionType,\n isFocused = false,\n isDisabled = false,\n testID = 'select'\n } = props;\n\n const handleFocus = useMemo(\n () => () => {\n if (!onFocus) return;\n\n analytics && logEvent(ANALYTICS_EVENT_TYPE.OPEN_SELECT, analyticsID, analytics, questionType);\n onFocus();\n },\n [analytics, analyticsID, onFocus, questionType]\n );\n\n const handleBlur = useMemo(\n () => () => {\n if (!onBlur) return;\n\n analytics &&\n logEvent(ANALYTICS_EVENT_TYPE.CLOSE_SELECT, analyticsID, analytics, questionType);\n onBlur();\n },\n [analytics, analyticsID, onBlur, questionType]\n );\n\n const handleChange = useMemo(\n () => () => {\n onChange(value);\n handleBlur();\n },\n [value, onChange, handleBlur]\n );\n\n if (!styleSheet) {\n return null;\n }\n\n const selectedItem = values.find(item => item.text === value);\n const text = (selectedItem && selectedItem.text) || placeholder || null;\n\n return (\n <>\n <Touchable\n disabled={isDisabled}\n onPress={handleFocus}\n analyticsID={analyticsID}\n testID={`${testID}-input`}\n >\n <View style={[styleSheet.container, style]}>\n <Text style={[styleSheet.text, textStyle, color && {color}]}>{text}</Text>\n <Space type=\"tiny\" />\n <ArrowDown\n color={color || theme.colors.gray.dark}\n height={ICON_WIDTH}\n width={ICON_WIDTH}\n />\n </View>\n </Touchable>\n <Modal\n isVisible={isFocused}\n onSwipeComplete={handleBlur}\n onBackdropPress={handleBlur}\n testID={testID}\n >\n <ModalSelect\n value={value}\n values={values}\n onChange={handleChange}\n onClose={handleBlur}\n testID={`${testID}-modal`}\n />\n </Modal>\n </>\n );\n};\n\nexport default Select;\n"],"file":"index.native.js"}
|
|
@@ -0,0 +1,33 @@
|
|
|
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 _templateContext = require("../../template/app-review/template-context");
|
|
11
|
+
|
|
12
|
+
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
13
|
+
|
|
14
|
+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
|
|
15
|
+
|
|
16
|
+
const Space = ({
|
|
17
|
+
type = 'tiny'
|
|
18
|
+
}) => {
|
|
19
|
+
const templateContext = (0, _templateContext.useTemplateContext)();
|
|
20
|
+
const {
|
|
21
|
+
theme
|
|
22
|
+
} = templateContext;
|
|
23
|
+
return /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
24
|
+
style: {
|
|
25
|
+
width: theme.spacing[type],
|
|
26
|
+
height: theme.spacing[type]
|
|
27
|
+
}
|
|
28
|
+
});
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
var _default = Space;
|
|
32
|
+
exports.default = _default;
|
|
33
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/space/index.native.tsx"],"names":["Space","type","templateContext","theme","width","spacing","height"],"mappings":";;;;;AAAA;;AACA;;AAEA;;;;;;AAMA,MAAMA,KAAK,GAAG,CAAC;AAACC,EAAAA,IAAI,GAAG;AAAR,CAAD,KAA4B;AACxC,QAAMC,eAAe,GAAG,0CAAxB;AAEA,QAAM;AAACC,IAAAA;AAAD,MAAUD,eAAhB;AAEA,sBAAO,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAE;AAACE,MAAAA,KAAK,EAAED,KAAK,CAACE,OAAN,CAAcJ,IAAd,CAAR;AAA6BK,MAAAA,MAAM,EAAEH,KAAK,CAACE,OAAN,CAAcJ,IAAd;AAArC;AAAb,IAAP;AACD,CAND;;eAQeD,K","sourcesContent":["import * as React from 'react';\nimport {View} from 'react-native';\nimport type {SpaceType} from '../../variables/theme.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\n\ninterface Props {\n type?: SpaceType;\n}\n\nconst Space = ({type = 'tiny'}: Props) => {\n const templateContext = useTemplateContext();\n\n const {theme} = templateContext;\n\n return <View style={{width: theme.spacing[type], height: theme.spacing[type]}} />;\n};\n\nexport default Space;\n"],"file":"index.native.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/atom/spinner/index.js"],"names":["Spinner","spinner","doubleBounce1","doubleBounce2"],"mappings":";;;;;AAAA;;AACA;;;;AAEA,MAAMA,OAAO,GAAG,MAAM;AACpB,sBACE;AAAK,IAAA,SAAS,EAAEC;AAAhB,kBACE;AAAK,IAAA,SAAS,EAAEC;AAAhB,IADF,eAEE;AAAK,IAAA,SAAS,EAAEC;AAAhB,IAFF,CADF;AAMD,CAPD;;
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/spinner/index.js"],"names":["Spinner","spinner","doubleBounce1","doubleBounce2","propTypes"],"mappings":";;;;;AAAA;;AACA;;;;AAEA,MAAMA,OAAO,GAAG,MAAM;AACpB,sBACE;AAAK,IAAA,SAAS,EAAEC;AAAhB,kBACE;AAAK,IAAA,SAAS,EAAEC;AAAhB,IADF,eAEE;AAAK,IAAA,SAAS,EAAEC;AAAhB,IAFF,CADF;AAMD,CAPD;;AASAH,OAAO,CAACI,SAAR,2CAAoB,EAApB;eAEeJ,O","sourcesContent":["import React from 'react';\nimport {spinner, doubleBounce1, doubleBounce2} from './style.css';\n\nconst Spinner = () => {\n return (\n <div className={spinner}>\n <div className={doubleBounce1} />\n <div className={doubleBounce2} />\n </div>\n );\n};\n\nSpinner.propTypes = {};\n\nexport default Spinner;\n"],"file":"index.js"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.default = exports.DEFAULT_STYLE = void 0;
|
|
5
|
+
|
|
6
|
+
var React = _interopRequireWildcard(require("react"));
|
|
7
|
+
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
|
|
10
|
+
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
11
|
+
|
|
12
|
+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
|
|
13
|
+
|
|
14
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
15
|
+
|
|
16
|
+
const DEFAULT_STYLE = _extends({}, _reactNative.Platform.select({
|
|
17
|
+
android: {
|
|
18
|
+
fontFamily: 'Roboto'
|
|
19
|
+
}
|
|
20
|
+
}));
|
|
21
|
+
|
|
22
|
+
exports.DEFAULT_STYLE = DEFAULT_STYLE;
|
|
23
|
+
|
|
24
|
+
const styles = _reactNative.StyleSheet.create({
|
|
25
|
+
text: _extends({}, DEFAULT_STYLE)
|
|
26
|
+
});
|
|
27
|
+
|
|
28
|
+
const Text = props => {
|
|
29
|
+
const {
|
|
30
|
+
children,
|
|
31
|
+
style,
|
|
32
|
+
testID,
|
|
33
|
+
numberOfLines
|
|
34
|
+
} = props;
|
|
35
|
+
return /*#__PURE__*/React.createElement(_reactNative.Text, {
|
|
36
|
+
style: [styles.text, style],
|
|
37
|
+
testID: testID,
|
|
38
|
+
numberOfLines: numberOfLines
|
|
39
|
+
}, children);
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
var _default = Text;
|
|
43
|
+
exports.default = _default;
|
|
44
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/atom/text/index.native.tsx"],"names":["DEFAULT_STYLE","Platform","select","android","fontFamily","styles","StyleSheet","create","text","Text","props","children","style","testID","numberOfLines"],"mappings":";;;;;AAAA;;AACA;;;;;;;;AAUO,MAAMA,aAAa,gBACrBC,sBAASC,MAAT,CAAgB;AACjBC,EAAAA,OAAO,EAAE;AACPC,IAAAA,UAAU,EAAE;AADL;AADQ,CAAhB,CADqB,CAAnB;;;;AAQP,MAAMC,MAAM,GAAGC,wBAAWC,MAAX,CAAkB;AAC/BC,EAAAA,IAAI,eACCR,aADD;AAD2B,CAAlB,CAAf;;AAMA,MAAMS,IAAI,GAAIC,KAAD,IAAkB;AAC7B,QAAM;AAACC,IAAAA,QAAD;AAAWC,IAAAA,KAAX;AAAkBC,IAAAA,MAAlB;AAA0BC,IAAAA;AAA1B,MAA2CJ,KAAjD;AAEA,sBACE,oBAAC,iBAAD;AAAU,IAAA,KAAK,EAAE,CAACL,MAAM,CAACG,IAAR,EAAcI,KAAd,CAAjB;AAAuC,IAAA,MAAM,EAAEC,MAA/C;AAAuD,IAAA,aAAa,EAAEC;AAAtE,KACGH,QADH,CADF;AAKD,CARD;;eAUeF,I","sourcesContent":["import * as React from 'react';\nimport {Text as TextBase, Platform, StyleSheet, ViewStyle} from 'react-native';\n\nexport type Props = {\n // copied from node_modules/react-native/Libraries/Text/TextProps.js\n children: React.ReactNode;\n style?: ViewStyle | ViewStyle[];\n testID?: string;\n numberOfLines?: number;\n};\n\nexport const DEFAULT_STYLE = {\n ...Platform.select({\n android: {\n fontFamily: 'Roboto'\n }\n })\n};\n\nconst styles = StyleSheet.create({\n text: {\n ...DEFAULT_STYLE\n }\n});\n\nconst Text = (props: Props) => {\n const {children, style, testID, numberOfLines} = props;\n\n return (\n <TextBase style={[styles.text, style]} testID={testID} numberOfLines={numberOfLines}>\n {children}\n </TextBase>\n );\n};\n\nexport default Text;\n"],"file":"index.native.js"}
|
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports.default = exports.HEADER_HEIGHT = void 0;
|
|
5
|
+
|
|
6
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
7
|
+
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
|
|
10
|
+
var _index = _interopRequireDefault(require("../../atom/header-back-button/index.native"));
|
|
11
|
+
|
|
12
|
+
var _templateContext = require("../../template/app-review/template-context");
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
|
|
16
|
+
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
17
|
+
|
|
18
|
+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
|
|
19
|
+
|
|
20
|
+
const HEADER_HEIGHT = 64;
|
|
21
|
+
exports.HEADER_HEIGHT = HEADER_HEIGHT;
|
|
22
|
+
|
|
23
|
+
const createStyleSheet = theme => _reactNative.StyleSheet.create({
|
|
24
|
+
container: {
|
|
25
|
+
borderRadius: theme.radius.card,
|
|
26
|
+
overflow: 'hidden',
|
|
27
|
+
backgroundColor: theme.colors.white
|
|
28
|
+
},
|
|
29
|
+
header: {
|
|
30
|
+
backgroundColor: theme.colors.white,
|
|
31
|
+
alignItems: 'flex-end',
|
|
32
|
+
justifyContent: 'center',
|
|
33
|
+
paddingHorizontal: theme.spacing.medium,
|
|
34
|
+
height: HEADER_HEIGHT
|
|
35
|
+
},
|
|
36
|
+
content: {
|
|
37
|
+
paddingHorizontal: theme.spacing.medium,
|
|
38
|
+
paddingBottom: theme.spacing.medium,
|
|
39
|
+
alignItems: 'center'
|
|
40
|
+
},
|
|
41
|
+
contentWithHeader: {
|
|
42
|
+
paddingTop: theme.spacing.medium
|
|
43
|
+
},
|
|
44
|
+
contentWithIcon: {
|
|
45
|
+
paddingTop: theme.spacing.small
|
|
46
|
+
},
|
|
47
|
+
icon: {
|
|
48
|
+
marginTop: -HEADER_HEIGHT * (3 / 4),
|
|
49
|
+
padding: 5,
|
|
50
|
+
backgroundColor: theme.colors.white,
|
|
51
|
+
borderRadius: theme.radius.thumbnail,
|
|
52
|
+
alignSelf: 'center'
|
|
53
|
+
},
|
|
54
|
+
iconContent: {
|
|
55
|
+
backgroundColor: theme.colors.white,
|
|
56
|
+
padding: theme.spacing.small,
|
|
57
|
+
borderRadius: theme.radius.thumbnail,
|
|
58
|
+
justifyContent: 'center',
|
|
59
|
+
alignItems: 'center'
|
|
60
|
+
}
|
|
61
|
+
});
|
|
62
|
+
|
|
63
|
+
const Modal = props => {
|
|
64
|
+
const templateContext = (0, _templateContext.useTemplateContext)();
|
|
65
|
+
const [styleSheet, setStylesheet] = (0, _react.useState)(null);
|
|
66
|
+
const {
|
|
67
|
+
theme
|
|
68
|
+
} = templateContext;
|
|
69
|
+
const {
|
|
70
|
+
children,
|
|
71
|
+
headerBackgroundColor,
|
|
72
|
+
iconBackgroundColor,
|
|
73
|
+
renderIcon,
|
|
74
|
+
contentStyle,
|
|
75
|
+
onClose,
|
|
76
|
+
testID
|
|
77
|
+
} = props;
|
|
78
|
+
(0, _react.useEffect)(() => {
|
|
79
|
+
const _stylesheet = createStyleSheet(theme);
|
|
80
|
+
|
|
81
|
+
setStylesheet(_stylesheet);
|
|
82
|
+
}, [theme]);
|
|
83
|
+
|
|
84
|
+
if (!styleSheet) {
|
|
85
|
+
return null;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
89
|
+
style: styleSheet.container,
|
|
90
|
+
testID: testID
|
|
91
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
92
|
+
style: [styleSheet.header, {
|
|
93
|
+
backgroundColor: headerBackgroundColor
|
|
94
|
+
}]
|
|
95
|
+
}, /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
96
|
+
color: theme.colors.gray.dark,
|
|
97
|
+
isFloating: false,
|
|
98
|
+
testID: "close-modal",
|
|
99
|
+
onPress: onClose,
|
|
100
|
+
type: "close"
|
|
101
|
+
})), renderIcon ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
102
|
+
style: styleSheet.icon
|
|
103
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
104
|
+
style: [styleSheet.iconContent, {
|
|
105
|
+
backgroundColor: iconBackgroundColor
|
|
106
|
+
}]
|
|
107
|
+
}, renderIcon)) : null, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
108
|
+
style: [styleSheet.content, headerBackgroundColor && styleSheet.contentWithHeader, renderIcon && styleSheet.contentWithIcon, contentStyle]
|
|
109
|
+
}, children));
|
|
110
|
+
};
|
|
111
|
+
|
|
112
|
+
var _default = Modal;
|
|
113
|
+
exports.default = _default;
|
|
114
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/hoc/modal/index.native.tsx"],"names":["HEADER_HEIGHT","createStyleSheet","theme","StyleSheet","create","container","borderRadius","radius","card","overflow","backgroundColor","colors","white","header","alignItems","justifyContent","paddingHorizontal","spacing","medium","height","content","paddingBottom","contentWithHeader","paddingTop","contentWithIcon","small","icon","marginTop","padding","thumbnail","alignSelf","iconContent","Modal","props","templateContext","styleSheet","setStylesheet","children","headerBackgroundColor","iconBackgroundColor","renderIcon","contentStyle","onClose","testID","_stylesheet","gray","dark"],"mappings":"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","sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {StyleSheet, View, ViewStyle} from 'react-native';\nimport HeaderBackButton from '../../atom/header-back-button/index.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\n\nexport type Props = {\n children: React.ReactNode;\n headerBackgroundColor?: string;\n iconBackgroundColor?: string;\n renderIcon?: React.ReactNode;\n contentStyle?: ViewStyle;\n onClose: () => void;\n testID?: string;\n};\n\nexport const HEADER_HEIGHT = 64;\n\ntype StyleSheetType = {\n container: {\n borderRadius: number;\n overflow: string;\n backgroundColor: string;\n };\n header: {\n backgroundColor: string;\n alignItems: string;\n justifyContent: string;\n paddingHorizontal: number;\n height: number;\n };\n content: {\n paddingHorizontal: number;\n paddingBottom: number;\n alignItems: string;\n };\n contentWithHeader: {\n paddingTop: number;\n };\n contentWithIcon: {\n paddingTop: number;\n };\n icon: {\n marginTop: number;\n padding: number;\n backgroundColor: string;\n borderRadius: string;\n alignSelf: string;\n };\n iconContent: {\n backgroundColor: string;\n padding: number;\n borderRadius: number;\n justifyContent: string;\n alignItems: string;\n };\n};\n\nconst createStyleSheet = theme =>\n StyleSheet.create({\n container: {\n borderRadius: theme.radius.card,\n overflow: 'hidden',\n backgroundColor: theme.colors.white\n },\n header: {\n backgroundColor: theme.colors.white,\n alignItems: 'flex-end',\n justifyContent: 'center',\n paddingHorizontal: theme.spacing.medium,\n height: HEADER_HEIGHT\n },\n content: {\n paddingHorizontal: theme.spacing.medium,\n paddingBottom: theme.spacing.medium,\n alignItems: 'center'\n },\n contentWithHeader: {\n paddingTop: theme.spacing.medium\n },\n contentWithIcon: {\n paddingTop: theme.spacing.small\n },\n icon: {\n marginTop: -HEADER_HEIGHT * (3 / 4),\n padding: 5,\n backgroundColor: theme.colors.white,\n borderRadius: theme.radius.thumbnail,\n alignSelf: 'center'\n },\n iconContent: {\n backgroundColor: theme.colors.white,\n padding: theme.spacing.small,\n borderRadius: theme.radius.thumbnail,\n justifyContent: 'center',\n alignItems: 'center'\n }\n });\n\nconst Modal = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {theme} = templateContext;\n\n const {\n children,\n headerBackgroundColor,\n iconBackgroundColor,\n renderIcon,\n contentStyle,\n onClose,\n testID\n } = props;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <View style={styleSheet.container} testID={testID}>\n <View style={[styleSheet.header, {backgroundColor: headerBackgroundColor}]}>\n <HeaderBackButton\n color={theme.colors.gray.dark}\n isFloating={false}\n testID=\"close-modal\"\n onPress={onClose}\n type=\"close\"\n />\n </View>\n {renderIcon ? (\n <View style={styleSheet.icon}>\n <View style={[styleSheet.iconContent, {backgroundColor: iconBackgroundColor}]}>\n {renderIcon}\n </View>\n </View>\n ) : null}\n <View\n style={[\n styleSheet.content,\n headerBackgroundColor && styleSheet.contentWithHeader,\n renderIcon && styleSheet.contentWithIcon,\n contentStyle\n ]}\n >\n {children}\n </View>\n </View>\n );\n};\n\nexport default Modal;\n"],"file":"index.native.js"}
|
|
@@ -0,0 +1,101 @@
|
|
|
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 _templateContext = require("../../../template/app-review/template-context");
|
|
11
|
+
|
|
12
|
+
var _index = _interopRequireDefault(require("../index.native"));
|
|
13
|
+
|
|
14
|
+
var _index2 = _interopRequireDefault(require("../select-item/index.native"));
|
|
15
|
+
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
+
|
|
18
|
+
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
19
|
+
|
|
20
|
+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
|
|
21
|
+
|
|
22
|
+
const createStyleSheet = theme => _reactNative.StyleSheet.create({
|
|
23
|
+
content: {
|
|
24
|
+
paddingHorizontal: 0
|
|
25
|
+
},
|
|
26
|
+
separator: {
|
|
27
|
+
borderTopWidth: 1,
|
|
28
|
+
borderColor: theme.colors.border
|
|
29
|
+
},
|
|
30
|
+
list: {
|
|
31
|
+
width: '100%'
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
|
|
35
|
+
const keyExtractor = (item, index) => {
|
|
36
|
+
return `modal-select-item-${index + 1}`;
|
|
37
|
+
};
|
|
38
|
+
|
|
39
|
+
const createRenderItem = (value, testID, onChange) => ({
|
|
40
|
+
item,
|
|
41
|
+
index
|
|
42
|
+
}) => {
|
|
43
|
+
// eslint-disable-next-line unicorn/consistent-function-scoping
|
|
44
|
+
const handleChange = _value => () => onChange(_value);
|
|
45
|
+
|
|
46
|
+
return /*#__PURE__*/_react.default.createElement(_index2.default, {
|
|
47
|
+
onPress: handleChange(item.text),
|
|
48
|
+
isSelected: value === item.text,
|
|
49
|
+
testID: `${testID}-item-${index + 1}`
|
|
50
|
+
}, item.text);
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
const createSeparator = styleSheet => () => {
|
|
54
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
55
|
+
style: styleSheet?.separator
|
|
56
|
+
});
|
|
57
|
+
};
|
|
58
|
+
|
|
59
|
+
const ModalSelect = props => {
|
|
60
|
+
const templateContext = (0, _templateContext.useTemplateContext)();
|
|
61
|
+
const [styleSheet, setStylesheet] = (0, _react.useState)(null);
|
|
62
|
+
const {
|
|
63
|
+
theme
|
|
64
|
+
} = templateContext;
|
|
65
|
+
const {
|
|
66
|
+
value,
|
|
67
|
+
values,
|
|
68
|
+
onChange,
|
|
69
|
+
onClose,
|
|
70
|
+
testID = 'modal-select'
|
|
71
|
+
} = props;
|
|
72
|
+
(0, _react.useEffect)(() => {
|
|
73
|
+
const _stylesheet = createStyleSheet(theme);
|
|
74
|
+
|
|
75
|
+
setStylesheet(_stylesheet);
|
|
76
|
+
}, [theme]);
|
|
77
|
+
const renderItem = (0, _react.useMemo)(() => createRenderItem(value, testID, onChange), [value, testID, onChange]);
|
|
78
|
+
const renderSeparator = (0, _react.useMemo)(() => createSeparator(styleSheet), [styleSheet]);
|
|
79
|
+
|
|
80
|
+
if (!styleSheet) {
|
|
81
|
+
return null;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
return /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
85
|
+
onClose: onClose,
|
|
86
|
+
contentStyle: styleSheet?.content,
|
|
87
|
+
testID: testID
|
|
88
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, {
|
|
89
|
+
data: values,
|
|
90
|
+
renderItem: renderItem,
|
|
91
|
+
keyExtractor: keyExtractor,
|
|
92
|
+
showsVerticalScrollIndicator: false,
|
|
93
|
+
ItemSeparatorComponent: renderSeparator,
|
|
94
|
+
style: styleSheet?.list,
|
|
95
|
+
testID: `${testID}-items`
|
|
96
|
+
}));
|
|
97
|
+
};
|
|
98
|
+
|
|
99
|
+
var _default = ModalSelect;
|
|
100
|
+
exports.default = _default;
|
|
101
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/hoc/modal/select/index.native.tsx"],"names":["createStyleSheet","theme","StyleSheet","create","content","paddingHorizontal","separator","borderTopWidth","borderColor","colors","border","list","width","keyExtractor","item","index","createRenderItem","value","testID","onChange","handleChange","_value","text","createSeparator","styleSheet","ModalSelect","props","templateContext","setStylesheet","values","onClose","_stylesheet","renderItem","renderSeparator"],"mappings":"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","sourcesContent":["import React, {useState, useEffect, useMemo} from 'react';\nimport {View, FlatList, StyleSheet} from 'react-native';\nimport type {Choice} from '../../../types/progression-engine.d';\n\nimport {Theme} from '../../../variables/theme.native';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\n\nimport Modal from '../index.native';\nimport ModalSelectItem from '../select-item/index.native';\n\ntype ChoiceValue = Pick<Choice, 'value'>;\ntype ChoiceItem = Pick<Choice, 'items'>;\nexport type OnChangeFunction = (value: ChoiceValue) => void;\n\nexport type Props = {\n value?: ChoiceValue;\n values: Array<ChoiceItem>;\n onChange: OnChangeFunction;\n onClose?: () => void;\n testID?: string;\n};\n\ntype StyleSheetType = {\n content: {\n paddingHorizontal: number;\n };\n separator: {\n borderTopWidth: number;\n borderColor: string;\n };\n list: {\n width: string;\n };\n};\n\nconst createStyleSheet = (theme: Theme) =>\n StyleSheet.create({\n content: {\n paddingHorizontal: 0\n },\n separator: {\n borderTopWidth: 1,\n borderColor: theme.colors.border\n },\n list: {\n width: '100%'\n }\n });\n\nconst keyExtractor = (item: ChoiceItem, index: number): string => {\n return `modal-select-item-${index + 1}`;\n};\n\nconst createRenderItem = (value: ChoiceValue, testID: String, onChange: OnChangeFunction) => ({\n item,\n index\n}: {\n item: ChoiceItem;\n index: number;\n}) => {\n // eslint-disable-next-line unicorn/consistent-function-scoping\n const handleChange = (_value: ChoiceValue | void) => () => onChange(_value);\n\n return (\n <ModalSelectItem\n onPress={handleChange(item.text)}\n isSelected={value === item.text}\n testID={`${testID}-item-${index + 1}`}\n >\n {item.text}\n </ModalSelectItem>\n );\n};\n\nconst createSeparator = (styleSheet: StyleSheetType) => () => {\n return <View style={styleSheet?.separator} />;\n};\n\nconst ModalSelect = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {theme} = templateContext;\n const {value, values, onChange, onClose, testID = 'modal-select'} = props;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(theme);\n setStylesheet(_stylesheet);\n }, [theme]);\n\n const renderItem = useMemo(() => createRenderItem(value, testID, onChange), [\n value,\n testID,\n onChange\n ]);\n const renderSeparator = useMemo(() => createSeparator(styleSheet), [styleSheet]);\n\n if (!styleSheet) {\n return null;\n }\n\n return (\n <Modal onClose={onClose} contentStyle={styleSheet?.content} testID={testID}>\n <FlatList\n data={values}\n renderItem={renderItem}\n keyExtractor={keyExtractor}\n showsVerticalScrollIndicator={false}\n ItemSeparatorComponent={renderSeparator}\n style={styleSheet?.list}\n testID={`${testID}-items`}\n />\n </Modal>\n );\n};\n\nexport default ModalSelect;\n"],"file":"index.native.js"}
|
|
@@ -0,0 +1,70 @@
|
|
|
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 _index = _interopRequireDefault(require("../../../atom/text/index.native"));
|
|
11
|
+
|
|
12
|
+
var _index2 = _interopRequireDefault(require("../../touchable/index.native"));
|
|
13
|
+
|
|
14
|
+
var _templateContext = require("../../../template/app-review/template-context");
|
|
15
|
+
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
+
|
|
18
|
+
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
|
|
19
|
+
|
|
20
|
+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
|
|
21
|
+
|
|
22
|
+
const createStyleSheet = (brandTheme, theme) => _reactNative.StyleSheet.create({
|
|
23
|
+
container: {
|
|
24
|
+
backgroundColor: theme.colors.white,
|
|
25
|
+
padding: theme.spacing.small
|
|
26
|
+
},
|
|
27
|
+
text: {
|
|
28
|
+
fontWeight: theme.fontWeight.bold,
|
|
29
|
+
color: theme.colors.black
|
|
30
|
+
},
|
|
31
|
+
selectedTextStyle: {
|
|
32
|
+
color: brandTheme?.colors.primary
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
|
|
36
|
+
const ModalSelectItem = props => {
|
|
37
|
+
const templateContext = (0, _templateContext.useTemplateContext)();
|
|
38
|
+
const [styleSheet, setStylesheet] = (0, _react.useState)(null);
|
|
39
|
+
const {
|
|
40
|
+
brandTheme,
|
|
41
|
+
theme
|
|
42
|
+
} = templateContext;
|
|
43
|
+
(0, _react.useEffect)(() => {
|
|
44
|
+
const _stylesheet = createStyleSheet(brandTheme, theme);
|
|
45
|
+
|
|
46
|
+
setStylesheet(_stylesheet);
|
|
47
|
+
}, [theme, brandTheme]);
|
|
48
|
+
|
|
49
|
+
if (!styleSheet) {
|
|
50
|
+
return null;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
const {
|
|
54
|
+
children,
|
|
55
|
+
onPress,
|
|
56
|
+
isSelected,
|
|
57
|
+
testID
|
|
58
|
+
} = props;
|
|
59
|
+
return /*#__PURE__*/_react.default.createElement(_index2.default, {
|
|
60
|
+
onPress: onPress,
|
|
61
|
+
style: styleSheet.container,
|
|
62
|
+
testID: testID
|
|
63
|
+
}, /*#__PURE__*/_react.default.createElement(_index.default, {
|
|
64
|
+
style: [styleSheet.text, isSelected && styleSheet.selectedTextStyle]
|
|
65
|
+
}, children));
|
|
66
|
+
};
|
|
67
|
+
|
|
68
|
+
var _default = ModalSelectItem;
|
|
69
|
+
exports.default = _default;
|
|
70
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/hoc/modal/select-item/index.native.tsx"],"names":["createStyleSheet","brandTheme","theme","StyleSheet","create","container","backgroundColor","colors","white","padding","spacing","small","text","fontWeight","bold","color","black","selectedTextStyle","primary","ModalSelectItem","props","templateContext","styleSheet","setStylesheet","_stylesheet","children","onPress","isSelected","testID"],"mappings":";;;;;AAAA;;AACA;;AAGA;;AACA;;AACA;;;;;;;;AAwBA,MAAMA,gBAAgB,GAAG,CAACC,UAAD,EAAkBC,KAAlB,KACvBC,wBAAWC,MAAX,CAAkB;AAChBC,EAAAA,SAAS,EAAE;AACTC,IAAAA,eAAe,EAAEJ,KAAK,CAACK,MAAN,CAAaC,KADrB;AAETC,IAAAA,OAAO,EAAEP,KAAK,CAACQ,OAAN,CAAcC;AAFd,GADK;AAKhBC,EAAAA,IAAI,EAAE;AACJC,IAAAA,UAAU,EAAEX,KAAK,CAACW,UAAN,CAAiBC,IADzB;AAEJC,IAAAA,KAAK,EAAEb,KAAK,CAACK,MAAN,CAAaS;AAFhB,GALU;AAShBC,EAAAA,iBAAiB,EAAE;AACjBF,IAAAA,KAAK,EAAEd,UAAU,EAAEM,MAAZ,CAAmBW;AADT;AATH,CAAlB,CADF;;AAeA,MAAMC,eAAe,GAAIC,KAAD,IAAkB;AACxC,QAAMC,eAAe,GAAG,0CAAxB;AACA,QAAM,CAACC,UAAD,EAAaC,aAAb,IAA8B,qBAAgC,IAAhC,CAApC;AACA,QAAM;AAACtB,IAAAA,UAAD;AAAaC,IAAAA;AAAb,MAAsBmB,eAA5B;AAEA,wBAAU,MAAM;AACd,UAAMG,WAAW,GAAGxB,gBAAgB,CAACC,UAAD,EAAaC,KAAb,CAApC;;AACAqB,IAAAA,aAAa,CAACC,WAAD,CAAb;AACD,GAHD,EAGG,CAACtB,KAAD,EAAQD,UAAR,CAHH;;AAKA,MAAI,CAACqB,UAAL,EAAiB;AACf,WAAO,IAAP;AACD;;AAED,QAAM;AAACG,IAAAA,QAAD;AAAWC,IAAAA,OAAX;AAAoBC,IAAAA,UAApB;AAAgCC,IAAAA;AAAhC,MAA0CR,KAAhD;AAEA,sBACE,6BAAC,eAAD;AAAW,IAAA,OAAO,EAAEM,OAApB;AAA6B,IAAA,KAAK,EAAEJ,UAAU,CAACjB,SAA/C;AAA0D,IAAA,MAAM,EAAEuB;AAAlE,kBACE,6BAAC,cAAD;AAAM,IAAA,KAAK,EAAE,CAACN,UAAU,CAACV,IAAZ,EAAkBe,UAAU,IAAIL,UAAU,CAACL,iBAA3C;AAAb,KAA6EQ,QAA7E,CADF,CADF;AAKD,CArBD;;eAuBeN,e","sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {StyleSheet, TextStyle} from 'react-native';\nimport type {PressEvent} from 'react-native/Libraries/Types/CoreEventTypes';\n\nimport Text from '../../../atom/text/index.native';\nimport Touchable from '../../touchable/index.native';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\nimport {Theme} from '../../../variables/theme.native';\n\nexport type Props = {\n isSelected?: boolean;\n children: string;\n onPress?: (event: PressEvent) => any;\n testID?: string;\n};\n\ntype StyleSheetType = {\n container: {\n backgroundColor: string;\n padding: number;\n };\n text: {\n fontWeight: TextStyle;\n color: string;\n };\n selectedTextStyle: {\n color: string;\n };\n};\n\nconst createStyleSheet = (brandTheme: any, theme: Theme) =>\n StyleSheet.create({\n container: {\n backgroundColor: theme.colors.white,\n padding: theme.spacing.small\n },\n text: {\n fontWeight: theme.fontWeight.bold,\n color: theme.colors.black\n },\n selectedTextStyle: {\n color: brandTheme?.colors.primary\n }\n });\n\nconst ModalSelectItem = (props: Props) => {\n const templateContext = useTemplateContext();\n const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n const {brandTheme, theme} = templateContext;\n\n useEffect(() => {\n const _stylesheet = createStyleSheet(brandTheme, theme);\n setStylesheet(_stylesheet);\n }, [theme, brandTheme]);\n\n if (!styleSheet) {\n return null;\n }\n\n const {children, onPress, isSelected, testID} = props;\n\n return (\n <Touchable onPress={onPress} style={styleSheet.container} testID={testID}>\n <Text style={[styleSheet.text, isSelected && styleSheet.selectedTextStyle]}>{children}</Text>\n </Touchable>\n );\n};\n\nexport default ModalSelectItem;\n"],"file":"index.native.js"}
|