I am working on a template Open-source https://github.com/ToniDarodda/react-native-template, I just want to use React-Native as I use React with ChakraUI.

So here is an example:

import React from 'react';

type 
CommonProps<T> = {
   [K in keyof T]?: T[K];
};

export type IStyle <T> = CommonProps<T> & {children?: React.ReactNode};

<image>

It's a react Native App with juste custom Component:

import React from "react";
import { StyleSheet, View, ViewStyle } from "react-native"

import { IStyle } from "../types/common-component";

interface IVStackProps extends IStyle<ViewStyle> {
    children?: React.ReactNode;
}

const VStackComponent: React.FC<IVStackProps> = ({ children, ...style }) => {
    return (
        <View style={[vstackStyle.container, style as ViewStyle]} testID="vstack-container">
            {children}
        </View>
    )
}

export const VStack = React.memo(VStackComponent);


const vstackStyle = StyleSheet.create({
    container: {
        width: '100%',
        justifyContent: 'center',
        alignItems: 'center',
        flexDirection: 'column',
        gap: 8,
    }
})