Updated

Author: bytesleo

.gitignore

@@ -0,0 +1,71 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# Typescript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# yarn log
+.yarn-error.log
+
+# dotenv environment variables file
+.env
+
+# production
+/build
+/dist
+
+# cache
+.cache/
+
+# editor
+.vscode

README.md

@@ -0,0 +1,66 @@
+
+# react-native-background-shapes
+
+[![NPM version](https://badge.fury.io/js/react-native-backgroud-shapes.svg)](https://npmjs.org/package/react-native-backgroud-shapes) [![GitHub license](https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat-square)](https://raw.githubusercontent.com/kevoj/react-native-backgroud-shapes/master/LICENSE)
+
+> Beautiful backgrounds shapes to React Native based in flex
+
+### Examples
+![Imgur](https://imgur.com/Dzkd0zB.jpg)
+![Imgur](https://imgur.com/i7YfOxK.jpg)
+![Imgur](https://imgur.com/m2f78nl.jpg)
+![Imgur](https://imgur.com/dNwUJV2.jpg)
+
+### Installation
+**Yarn**
+```bash
+yarn add react-native-background-shapes
+```
+**Npm**
+```bash
+npm i react-native-background-shapes
+```
+### Usage
+```javascript
+import react from "react";
+import {View} from "react-native";
+import {Shapes} from "react-native-background-shapes";
+
+export const example () => {
+return (
+    <View>
+        <Shapes />
+    </View>
+    );
+}
+```
+### Options
+
+```javascript
+// Basic
+ <Shapes />
+// Advance
+ <Shapes 
+    primaryColor="#416DF8"
+    secondaryColor="#2F53D5"
+    height={3}
+    borderRadius={20}
+    figures={[
+      {name: 'circle', position: 'center', size: 60},
+      {name: 'donut', position: 'flex-start', axis: 'top', size: 80},
+      {name: 'circle', position: 'center', axis: 'right', size: 100},
+    ]}
+ />
+```
+**primaryColor**: String, HEX color.
+**secondaryColor**: String, HEX color.
+**height**: Number, 1 = full screen, default (3.5)
+**borderRadius**: Number, default 30
+**figures**: Array
+* **name**: String = "circle","donut, "triangle", "diamondNarrow", "cutDiamond"
+* **position**: String = "flex-start", "center, "flex-end", "baseline", "stretch"
+* **axis**: String = "top", "right, "bottom", "left"
+
+## License
+
+MIT © [Leonardo Rico](https://github.com/kevoj/react-native-background-shapes/blob/master/LICENSE)

package.json

@@ -0,0 +1,48 @@
+{
+  "name": "react-native-background-shapes",
+  "version": "0.1",
+  "description": "Beautiful backgrounds shapes to React Native based in flex",
+  "main": "dist/lib/index.js",
+  "scripts": {
+    "start": "./node_modules/.bin/parcel src/docs/index.html",
+    "build": "./node_modules/.bin/webpack --mode=production",
+    "build:docs": "./node_modules/.bin/parcel build src/docs/index.js -d ./dist/docs && cp src/docs/index.html dist/docs/index.html"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/kevoj/react-webpack-component.git"
+  },
+  "keywords": [
+    "React",
+    "Component",
+    "webpack",
+    "webpack 4",
+    "react-webpack"
+  ],
+  "author": "Leonardo Rico Guevara - https://github.com/kevoj",
+  "license": "MIT",
+  "dependencies": {
+    "react": "^16.12.0",
+    "react-dom": "^16.12.0",
+    "react-native": "^0.61.5"
+  },
+  "peerDependencies": {
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "react-native": "^0.61.5"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.8.3",
+    "@babel/preset-env": "^7.8.3",
+    "@babel/preset-react": "^7.8.3",
+    "babel-loader": "^8.0.0-beta",
+    "babel-plugin-transform-async-to-generator": "^6.24.1",
+    "babel-preset-env": "^1.7.0",
+    "babel-preset-react": "^6.24.1",
+    "babel-preset-stage-2": "^6.24.1",
+    "parcel-bundler": "^1.12.4",
+    "webpack": "^4.41.5",
+    "webpack-cli": "^3.3.10",
+    "webpack-node-externals": "^1.7.2"
+  }
+}

src/docs/index.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <title>my UI</title>
+</head>
+
+<body>
+    <noscript>
+        You need to enable JavaScript to run this app.
+    </noscript>
+    <div id="root"></div>
+    <script src="./index.js"></script>
+</body>
+
+</html>

src/docs/index.js

@@ -0,0 +1,11 @@
+import React from "react";
+import ReactDOM from "react-dom";
+import { Shapes } from "../lib/Shapes";
+
+const App = () => (
+  <div>
+    <Shapes />
+  </div>
+);
+
+ReactDOM.render(<App />, document.getElementById("root"));