import { ContentPadding } from "@/constants/theme";
import { forwardRef } from "react";
import { ScrollView, ScrollViewProps, StyleSheet } from "react-native";

interface ContentProps extends ScrollViewProps {
  children?: React.ReactNode;
}

const Content = forwardRef<ScrollView, ContentProps>(({ children, style, ...rest }, ref) => {
  return (
    <ScrollView ref={ref} contentContainerStyle={[styles.content, style]} {...rest}>
      {children}
    </ScrollView>
  );
});

Content.displayName = "Content";

const styles = StyleSheet.create({
  content: {
    paddingHorizontal: ContentPadding,
    paddingTop: ContentPadding + 30,
    paddingBottom: ContentPadding + 20
  }
});

export default Content;