Update the usage example in the documentation to also be compatible with TypeScript

[kamajus]

✨ Feature request

Currently, the example provided is only functional in JavaScript. In order to make it compatible with TypeScript, I suggest adopting the StyleSheet.create approach to styling. This modification not only preserves the functionality of the application, but also makes the example more concise.

Motivation

Make the example functional and concise for TypeScript as well.

Example

import React from "react";
import { Text, View, StyleSheet } from "react-native";
import Carousel from "pinar";

const styles = StyleSheet.create({
  slide1: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "#a3c9a8"
  },
  slide2: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "#84b59f"
  },
  slide3: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "#69a297"
  },
  text: {
    color: "#1f2d3d",
    opacity: 0.7,
    fontSize: 48,
    fontWeight: "bold"
  }
});

export default () => (
  <Carousel>
    <View style={styles.slide1}>
      <Text style={styles.text}>1</Text>
    </View>
    <View style={styles.slide2}>
      <Text style={styles.text}>2</Text>
    </View>
    <View style={styles.slide3}>
      <Text style={styles.text}>3</Text>
    </View>
  </Carousel>
);

[kristerkari]

I can close this now that #482 got merged :)