omnipay-savings-sdk
Version:
Omnipay Savings SDK
52 lines (51 loc) • 3.82 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const react_native_1 = require("react-native");
const utils_1 = require("../../../utils");
const Header_1 = __importDefault(require("../../Header"));
const Button_1 = require("../../Button");
const Text_1 = require("../../Text");
const SuggestedPlanInfo = ({ planName }) => ((0, jsx_runtime_1.jsxs)(react_native_1.View, Object.assign({ style: styles.planInfoContainer }, { children: [(0, jsx_runtime_1.jsx)(Text_1.Text, { fontSize: (0, utils_1.fontSz)(12), fontFamily: "Gordita-Regular", fontWeight: "400", color: utils_1.Colors.neutral90, text: "Plan:" }), (0, jsx_runtime_1.jsx)(Text_1.Text, { fontSize: (0, utils_1.fontSz)(12), fontFamily: "Gordita-Medium", fontWeight: "500", color: utils_1.Colors.neutral30, text: planName, style: { marginLeft: (0, utils_1.ms)(4) } })] })));
const styles = react_native_1.StyleSheet.create({
content: {
paddingVertical: (0, utils_1.ms)(20),
paddingHorizontal: (0, utils_1.ms)(16),
borderRadius: (0, utils_1.ms)(8),
backgroundColor: utils_1.Colors.white,
shadowColor: utils_1.Colors.shadowColor,
shadowOffset: { width: -1, height: 2 },
shadowOpacity: 0.2,
shadowRadius: 3,
elevation: 3,
rowGap: (0, utils_1.ms)(15),
},
planInfoContainer: {
flexDirection: 'row',
alignItems: 'center',
backgroundColor: utils_1.Colors.neutral0X,
paddingVertical: (0, utils_1.ms)(8),
paddingHorizontal: (0, utils_1.ms)(12),
borderRadius: (0, utils_1.ms)(6),
marginBottom: (0, utils_1.ms)(0),
borderWidth: 1,
borderColor: utils_1.Colors.neutral20,
},
});
const SavingsFormLayout = ({ title, onBack, onSubmit, children, scrollViewRef, suggestedPlanName, }) => {
const defaultScrollRef = (0, react_1.useRef)(null);
const scrollRef = scrollViewRef || defaultScrollRef;
return ((0, jsx_runtime_1.jsxs)(react_native_1.SafeAreaView, Object.assign({ style: [utils_1.globalStyles.appContainer] }, { children: [(0, jsx_runtime_1.jsx)(Header_1.default, { headerText: title, textStyle: { textTransform: 'capitalize' }, containerStyle: {
paddingBottom: (0, utils_1.ms)(10),
paddingTop: (0, utils_1.ms)(4),
borderBottomWidth: (0, utils_1.ms)(1),
borderBottomColor: utils_1.Colors.headerBottomColor,
}, onPressBack: onBack, headerChild: (0, jsx_runtime_1.jsx)(react_native_1.View, { style: { flex: 0.125 } }) }), (0, jsx_runtime_1.jsx)(react_native_1.KeyboardAvoidingView, Object.assign({ behavior: react_native_1.Platform.OS === 'ios' ? 'padding' : 'height', enabled: true, style: { flex: 1, paddingHorizontal: (0, utils_1.wp)(10), paddingTop: (0, utils_1.ms)(14) } }, { children: (0, jsx_runtime_1.jsx)(react_native_1.View, Object.assign({ style: styles.content }, { children: (0, jsx_runtime_1.jsxs)(react_native_1.ScrollView, Object.assign({ ref: scrollRef, showsVerticalScrollIndicator: false, keyboardShouldPersistTaps: "handled", contentContainerStyle: [{ rowGap: (0, utils_1.ms)(20) }] }, { children: [suggestedPlanName && (0, jsx_runtime_1.jsx)(SuggestedPlanInfo, { planName: suggestedPlanName }), children] })) })) })), (0, jsx_runtime_1.jsx)(react_native_1.View, Object.assign({ style: {
paddingHorizontal: (0, utils_1.wp)(20),
} }, { children: (0, jsx_runtime_1.jsx)(Button_1.Button, { title: "Continue", onPress: onSubmit, style: {} }) }))] })));
};
exports.default = SavingsFormLayout;