63 lines
1.7 KiB
TypeScript
63 lines
1.7 KiB
TypeScript
"use client"
|
|
|
|
/*
|
|
* File: OnboardingContainer.tsx
|
|
* Description: Shared container component for onboarding screens with gradient background.
|
|
* Design & Developed by Tech4Biz Solutions
|
|
* Copyright (c) Spurrin Innovations. All rights reserved.
|
|
*/
|
|
|
|
import type React from "react"
|
|
import { View, StyleSheet, TouchableWithoutFeedback, Keyboard, ScrollView } from "react-native"
|
|
import LinearGradient from "react-native-linear-gradient"
|
|
import { Colors, Spacing } from "../../../../shared/src/theme"
|
|
import BackButton from "./BackButton"
|
|
import AngledGradient from "../../../../shared/src/components/Gradient/AngledGradient"
|
|
|
|
interface OnboardingContainerProps {
|
|
children: React.ReactNode
|
|
onBack: () => void
|
|
showBackButton?: boolean
|
|
}
|
|
|
|
const OnboardingContainer: React.FC<OnboardingContainerProps> = ({ children, onBack, showBackButton = true }) => {
|
|
return (
|
|
<TouchableWithoutFeedback style={{flex:1}} onPress={Keyboard.dismiss}>
|
|
<AngledGradient>
|
|
{showBackButton && (
|
|
<View style={styles.header}>
|
|
<BackButton onPress={onBack} />
|
|
</View>
|
|
)}
|
|
<ScrollView>
|
|
<View style={styles.content}>{children}</View>
|
|
</ScrollView>
|
|
</AngledGradient>
|
|
</TouchableWithoutFeedback>
|
|
)
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
},
|
|
header: {
|
|
paddingTop: Spacing.md,
|
|
paddingHorizontal: Spacing.lg,
|
|
paddingBottom: Spacing.md,
|
|
},
|
|
content: {
|
|
flex: 1,
|
|
paddingHorizontal: Spacing.lg,
|
|
justifyContent: 'center',
|
|
},
|
|
})
|
|
|
|
export default OnboardingContainer
|
|
|
|
/*
|
|
* End of File: OnboardingContainer.tsx
|
|
* Design & Developed by Tech4Biz Solutions
|
|
* Copyright (c) Spurrin Innovations. All rights reserved.
|
|
*/
|