One file taken from a demo export of Supernova Studio

One.js

import React from "react"
import { StyleSheet } from "react-native"
import { View, Image, Text } from "react-native"
import { strings } from "../Locales/i18n"


export default class  extends React.Component {

  static navigationOptions = ({ navigation }) => {
    const { params = {} } = navigation.state
    return {
      header: null,
      headerLeft: null,
      headerRight: null
    }
  }

  constructor(props) {
    super(props)
  }


  componentDidMount() {

    // Additional component initialization can go here.
    // If you need to load data from a remote endpoint, this is a good place to instantiate the network request.
  }

  render() {

    return (
      <View style={styles.viewView}>
	<View pointerEvents="box-none" style={{
	  position: "absolute",
	  width: "100%",
	  height: "100%"
	}}>
	  <View style={styles.weekView}>
	    <View pointerEvents="box-none" style={{
	      position: "absolute",
	      width: "100%",
	      height: "100%"
	    }}>
	      <Image style={styles.rectangle107Image} source={require("./../../Assets/images/rectangle-107-2.png")} />
	      <View style={styles.rectangle107View} />
	      <View style={styles.rectangle107TwoView} />
	      <Image style={styles.rectangle107TwoImage} source={require("./../../Assets/images/rectangle-107-3.png")} />
	      <Image style={styles.rectangle107ThreeImage} source={require("./../../Assets/images/rectangle-107-4.png")} />
	      <Image style={styles.rectangle107FourImage} source={require("./../../Assets/images/rectangle-107.png")} />
	      <Image style={styles.rectangle107FiveImage} source={require("./../../Assets/images/rectangle-107.png")} />
	      <Text style={styles.mText}>{strings(".mTextText")}</Text>
	      <Text style={styles.tText}>{strings(".tTextText")}</Text>
	      <Text style={styles.tCopyText}>{strings(".tCopyTextText")}</Text>
	      <Text style={styles.fText}>{strings(".fTextText")}</Text>
	      <Text style={styles.sText}>{strings(".sTextText")}</Text>
	      <Text style={styles.sCopyText}>{strings(".sCopyTextText")}</Text>
	      <Text style={styles.wText}>{strings(".wTextText")}</Text>
	    </View>
	  </View>
	  <View style={styles.cardView}>
	    <View pointerEvents="box-none" style={{
	      position: "absolute",
	      width: "100%",
	      height: "100%"
	    }}>
	      <Text style={styles.usersText}>{strings(".usersTextText")}</Text>
	      <Text style={styles.textText}>{strings(".textTextText")}</Text>
	    </View>
	  </View>
	  <View style={styles.cardTwoView}>
	    <View pointerEvents="box-none" style={{
	      position: "absolute",
	      width: "100%",
	      height: "100%"
	    }}>
	      <Text style={styles.averageSessionTimeText}>{strings(".averageSessionTimeTextText")}</Text>
	      <Text style={styles.textTwoText}>{strings(".textTwoTextText")}</Text>
	    </View>
	  </View>
	  <View style={styles.rectangle106Copy7View} />
	  <View style={styles.cardThreeView}>
	    <View pointerEvents="box-none" style={{
	      position: "absolute",
	      width: "100%",
	      height: "100%"
	    }}>
	      <Text style={styles.textThreeText}></Text>
	      <Text style={styles.goalsAchievedText}>{strings(".goalsAchievedTextText")}</Text>
	    </View>
	  </View>
	  <View style={styles.cardFourView}>
	    <View pointerEvents="box-none" style={{
	      position: "absolute",
	      width: "100%",
	      height: "100%"
	    }}>
	      <View style={styles.rectangle106Copy6View} />
	      <Text style={styles.textFourText}>10.0</Text>
	      <Text style={styles.dailyGoalText}>{strings(".dailyGoalTextText")}</Text>
	    </View>
	  </View>
	  <View style={styles.cardCopyView}>
	    <View pointerEvents="box-none" style={{
	      position: "absolute",
	      width: "100%",
	      height: "100%"
	    }}>
	      <View style={styles.rectangle106Copy6TwoView} />
	      <Text style={styles.dayText}><Text style={{
		color: "rgba(255, 255, 255, 1)",
		fontFamily: "Montserrat-Bold",
		fontSize: 40.00,
		fontStyle: "normal",
		textAlign: "left",
		letterSpacing: -2.00,
		fontFamily: "Montserrat-Bold",
		fontSize: 50.00,
		fontStyle: "normal"
	      }}>1 </Text>day</Text>
	      <Text style={styles.timeLeftText}>{strings(".timeLeftTextText")}</Text>
	    </View>
	  </View>
	  <View style={styles.navBar2View}>
	    <View pointerEvents="box-none" style={{
	      position: "absolute",
	      width: "100%",
	      height: "100%"
	    }}>
	      <Image style={styles.tintLightImage} source={require("./../../Assets/images/tint-light.png")} />
	      <Image style={styles.stroke2930CopyImage} source={require("./../../Assets/images/stroke-2930-copy.png")} />
	      <Image style={styles.group41Image} source={require("./../../Assets/images/group-41.png")} />
	      <Text style={styles.dashboardText}>{strings(".dashboardTextText")}</Text>
	    </View>
	  </View>
	</View>
      </View>
    )
  }
}

const styles = StyleSheet.create({
  viewView: {
    backgroundColor: "rgba(255, 255, 255, 1)",
    flex: 1
  },
  weekView: {
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 249.00,
    height: 221.00,
    left: 63.00,
    top: 394.00,
    position: "absolute"
  },
  rectangle107Image: {
    resizeMode: "center",
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 6.00,
    height: 19.00,
    left: 2.00,
    top: 142.00,
    position: "absolute"
  },
  rectangle107View: {
    backgroundColor: "rgba(56, 166, 146, 1)",
    borderRadius: 3.00,
    width: 6.00,
    height: 160.00,
    left: 42.00,
    top: 0.00,
    position: "absolute"
  },
  rectangle107TwoView: {
    backgroundColor: "rgba(56, 166, 146, 1)",
    borderRadius: 3.00,
    width: 6.00,
    height: 90.00,
    left: 82.00,
    top: 71.00,
    position: "absolute"
  },
  rectangle107TwoImage: {
    resizeMode: "center",
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 6.00,
    height: 19.00,
    left: 122.00,
    top: 142.00,
    position: "absolute"
  },
  rectangle107ThreeImage: {
    resizeMode: "center",
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 6.00,
    height: 19.00,
    left: 162.00,
    top: 142.00,
    position: "absolute"
  },
  rectangle107FourImage: {
    resizeMode: "center",
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 6.00,
    height: 19.00,
    left: 202.00,
    top: 142.00,
    position: "absolute"
  },
  rectangle107FiveImage: {
    resizeMode: "center",
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 6.00,
    height: 19.00,
    left: 242.00,
    top: 142.00,
    position: "absolute"
  },
  mText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "center",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 12.00,
    height: 14.00,
    left: -1.00,
    top: 207.00,
    position: "absolute"
  },
  tText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "center",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 7.00,
    height: 14.00,
    left: 42.00,
    top: 207.00,
    position: "absolute"
  },
  tCopyText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "center",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 7.00,
    height: 14.00,
    left: 122.00,
    top: 207.00,
    position: "absolute"
  },
  fText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "center",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 7.00,
    height: 14.00,
    left: 162.00,
    top: 207.00,
    position: "absolute"
  },
  sText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "center",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 7.00,
    height: 14.00,
    left: 202.00,
    top: 207.00,
    position: "absolute"
  },
  sCopyText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "center",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 7.00,
    height: 14.00,
    left: 242.00,
    top: 207.00,
    position: "absolute"
  },
  wText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "center",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 10.00,
    height: 14.00,
    left: 81.00,
    top: 207.00,
    position: "absolute"
  },
  cardView: {
    backgroundColor: "rgba(234, 234, 234, 1)",
    width: 173.00,
    height: 90.00,
    left: 10.00,
    top: 230.00,
    position: "absolute"
  },
  usersText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "left",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    opacity: 0.40,
    width: 31.00,
    height: 14.00,
    left: 20.00,
    top: 26.00,
    position: "absolute"
  },
  textText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 18.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "left",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 56.00,
    height: 22.00,
    left: 20.00,
    top: 43.00,
    position: "absolute"
  },
  cardTwoView: {
    backgroundColor: "rgba(234, 234, 234, 1)",
    width: 172.00,
    height: 90.00,
    left: 193.00,
    top: 230.00,
    position: "absolute"
  },
  averageSessionTimeText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "left",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    opacity: 0.40,
    width: 119.00,
    height: 14.00,
    left: 20.00,
    top: 25.00,
    position: "absolute"
  },
  textTwoText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 18.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "left",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 76.00,
    height: 22.00,
    left: 20.00,
    top: 42.00,
    position: "absolute"
  },
  rectangle106Copy7View: {
    backgroundColor: "rgba(234, 234, 234, 1)",
    width: 172.00,
    height: 120.00,
    left: 10.00,
    top: 100.00,
    position: "absolute"
  },
  cardThreeView: {
    backgroundColor: "rgba(147, 208, 170, 1)",
    width: 145.00,
    height: 120.00,
    left: 10.00,
    top: 100.00,
    position: "absolute"
  },
  textThreeText: {
    color: "rgba(255, 255, 255, 1)",
    fontFamily: "Montserrat-Bold",
    fontSize: 50.00,
    fontStyle: "normal",
    fontWeight: "bold",
    textAlign: "left",
    letterSpacing: -2.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 30.00,
    height: 61.00,
    left: 30.00,
    top: 42.00,
    position: "absolute"
  },
  goalsAchievedText: {
    color: "rgba(255, 255, 255, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "left",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    opacity: 0.40,
    width: 84.00,
    height: 14.00,
    left: 30.00,
    top: 27.00,
    position: "absolute"
  },
  cardFourView: {
    backgroundColor: "rgba(234, 234, 234, 1)",
    width: 172.00,
    height: 120.00,
    left: 193.00,
    top: 100.00,
    position: "absolute"
  },
  rectangle106Copy6View: {
    backgroundColor: "rgba(80, 178, 247, 1)",
    width: 158.00,
    height: 120.00,
    left: 0.00,
    top: 0.00,
    position: "absolute"
  },
  textFourText: {
    color: "rgba(255, 255, 255, 1)",
    fontFamily: "Montserrat-Bold",
    fontSize: 50.00,
    fontStyle: "normal",
    fontWeight: "bold",
    textAlign: "left",
    letterSpacing: -2.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 96.00,
    height: 61.00,
    left: 30.00,
    top: 42.00,
    position: "absolute"
  },
  dailyGoalText: {
    color: "rgba(255, 255, 255, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "left",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    opacity: 0.40,
    width: 56.00,
    height: 14.00,
    left: 30.00,
    top: 27.00,
    position: "absolute"
  },
  cardCopyView: {
    backgroundColor: "rgba(234, 234, 234, 1)",
    width: 172.00,
    height: 120.00,
    left: 193.00,
    top: 100.00,
    position: "absolute"
  },
  rectangle106Copy6TwoView: {
    backgroundColor: "rgba(74, 144, 226, 1)",
    width: 158.00,
    height: 120.00,
    left: 0.00,
    top: 0.00,
    position: "absolute"
  },
  dayText: {
    color: "rgba(255, 255, 255, 1)",
    fontFamily: "Montserrat-Bold",
    fontSize: 40.00,
    fontStyle: "normal",
    fontWeight: "bold",
    textAlign: "left",
    letterSpacing: -2.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 98.00,
    height: 61.00,
    left: 30.00,
    top: 42.00,
    position: "absolute"
  },
  timeLeftText: {
    color: "rgba(255, 255, 255, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 11.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "left",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    opacity: 0.40,
    width: 50.00,
    height: 14.00,
    left: 30.00,
    top: 27.00,
    position: "absolute"
  },
  navBar2View: {
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 375.00,
    height: 70.00,
    left: 0.00,
    top: 0.00,
    position: "absolute"
  },
  tintLightImage: {
    resizeMode: "center",
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 375.00,
    height: 70.00,
    left: 0.00,
    top: 0.00,
    position: "absolute"
  },
  stroke2930CopyImage: {
    resizeMode: "center",
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 7.00,
    height: 14.00,
    left: 20.00,
    top: 38.00,
    position: "absolute"
  },
  group41Image: {
    resizeMode: "center",
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 16.00,
    height: 16.00,
    left: 339.00,
    top: 37.00,
    position: "absolute"
  },
  dashboardText: {
    color: "rgba(38, 38, 40, 1)",
    fontFamily: "Montserrat-Regular",
    fontSize: 18.00,
    fontStyle: "normal",
    fontWeight: "normal",
    textAlign: "center",
    letterSpacing: 0.00,
    backgroundColor: "rgba(0, 0, 0, 0)",
    width: 122.00,
    height: 22.00,
    left: 127.00,
    top: 33.00,
    position: "absolute"
  }
});