import {
    StyleSheet,
    View
} from "react-native";
import {
    useFonts
} from "expo-font";
import {
    setupNCoreUIKit,
    Text
} from "ncore-ui-kit-mobile";

const NCoreUIKitBase = setupNCoreUIKit({
    initialSelectedGapPropagation: "compact",
    initialSelectedTheme: "light"
});

const App = () => {
    return <View style={styles.container}>
        <Text>Result: </Text>
    </View>;
};

const ContextAPI = () => {
    /* eslint-disable @typescript-eslint/no-require-imports */
    const [loaded] = useFonts({
        "Geist-ExtraLight": require("./assets/fonts/Geist-ExtraLight.ttf"),
        "Geist-ExtraBold": require("./assets/fonts/Geist-ExtraBold.ttf"),
        "Geist-SemiBold": require("./assets/fonts/Geist-SemiBold.ttf"),
        "Geist-Regular": require("./assets/fonts/Geist-Regular.ttf"),
        "Geist-Medium": require("./assets/fonts/Geist-Medium.ttf"),
        "Geist-Black": require("./assets/fonts/Geist-Black.ttf"),
        "Geist-Light": require("./assets/fonts/Geist-Light.ttf"),
        "Geist-Bold": require("./assets/fonts/Geist-Bold.ttf"),
        "Geist-Thin": require("./assets/fonts/Geist-Thin.ttf")
    });

    if (!loaded) return null;

    return <NCoreUIKitBase.Provider>
        <App/>
    </NCoreUIKitBase.Provider>;
};

const styles = StyleSheet.create({
    container: {
        justifyContent: "center",
        alignItems: "center",
        flex: 1
    }
});
export default ContextAPI;