├── .eslintrc.js ├── .gitattributes ├── .gitignore ├── .npmignore ├── .prettierrc.js ├── CHANGELOG.md ├── LICENSE ├── README.md ├── assets ├── Screenshots │ ├── example.png │ └── example2.png └── logo.png ├── example ├── .buckconfig ├── .eslintrc.js ├── .gitattributes ├── .gitignore ├── .watchmanconfig ├── App.tsx ├── __tests__ │ └── App-test.tsx ├── _editorconfig ├── android │ ├── app │ │ ├── _BUCK │ │ ├── build.gradle │ │ ├── build_defs.bzl │ │ ├── debug.keystore │ │ ├── proguard-rules.pro │ │ └── src │ │ │ ├── debug │ │ │ ├── AndroidManifest.xml │ │ │ └── java │ │ │ │ └── com │ │ │ │ └── example │ │ │ │ └── ReactNativeFlipper.java │ │ │ └── main │ │ │ ├── AndroidManifest.xml │ │ │ ├── java │ │ │ └── com │ │ │ │ └── example │ │ │ │ ├── MainActivity.java │ │ │ │ └── MainApplication.java │ │ │ └── res │ │ │ ├── mipmap-hdpi │ │ │ ├── ic_launcher.png │ │ │ └── ic_launcher_round.png │ │ │ ├── mipmap-mdpi │ │ │ ├── ic_launcher.png │ │ │ └── ic_launcher_round.png │ │ │ ├── mipmap-xhdpi │ │ │ ├── ic_launcher.png │ │ │ └── ic_launcher_round.png │ │ │ ├── mipmap-xxhdpi │ │ │ ├── ic_launcher.png │ │ │ └── ic_launcher_round.png │ │ │ ├── mipmap-xxxhdpi │ │ │ ├── ic_launcher.png │ │ │ └── ic_launcher_round.png │ │ │ └── values │ │ │ ├── strings.xml │ │ │ └── styles.xml │ ├── build.gradle │ ├── gradle.properties │ ├── gradle │ │ └── wrapper │ │ │ ├── gradle-wrapper.jar │ │ │ └── gradle-wrapper.properties │ ├── gradlew │ ├── gradlew.bat │ └── settings.gradle ├── app.json ├── babel.config.js ├── components │ ├── GooglePlayTitle.style.ts │ └── GooglePlayTitle.tsx ├── index.js ├── ios │ ├── Podfile │ ├── Podfile.lock │ ├── example.xcodeproj │ │ ├── project.pbxproj │ │ └── xcshareddata │ │ │ └── xcschemes │ │ │ └── example.xcscheme │ ├── example.xcworkspace │ │ ├── contents.xcworkspacedata │ │ └── xcshareddata │ │ │ └── IDEWorkspaceChecks.plist │ ├── example │ │ ├── AppDelegate.h │ │ ├── AppDelegate.m │ │ ├── Images.xcassets │ │ │ ├── AppIcon.appiconset │ │ │ │ └── Contents.json │ │ │ └── Contents.json │ │ ├── Info.plist │ │ ├── LaunchScreen.storyboard │ │ └── main.m │ └── exampleTests │ │ ├── Info.plist │ │ └── exampleTests.m ├── metro.config.js ├── package-lock.json ├── package.json └── tsconfig.json ├── lib ├── ClassicButton │ ├── Button.style.ts │ └── Button.tsx ├── GooglePlayButton │ ├── GooglePlayButton.style.ts │ └── GooglePlayButton.tsx └── index.ts ├── package-lock.json ├── package.json └── tsconfig.json /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | extends: [ 4 | "@react-native-community", 5 | "airbnb-typescript", 6 | "prettier", 7 | "prettier/@typescript-eslint", 8 | "prettier/react" 9 | ], 10 | parser: "babel-eslint", 11 | plugins: ["react", "react-native"], 12 | env: { 13 | jest: true, 14 | "react-native/react-native": true 15 | }, 16 | rules: { 17 | // allow js file extension 18 | "react/jsx-filename-extension": [ 19 | "error", 20 | { 21 | extensions: [".js", ".jsx", ".tsx", ".ts"] 22 | } 23 | ], 24 | // for post defining style object in react-native 25 | "no-use-before-define": ["error", { variables: false }], 26 | // react-native rules 27 | "react-native/no-unused-styles": 2, 28 | "react-native/split-platform-components": 2, 29 | "react-native/no-inline-styles": 2, 30 | "react-native/no-raw-text": 2 31 | } 32 | }; 33 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | *.pbxproj -text 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # OSX 2 | # 3 | .DS_Store 4 | 5 | # Xcode 6 | # 7 | build/ 8 | *.pbxuser 9 | !default.pbxuser 10 | *.mode1v3 11 | !default.mode1v3 12 | *.mode2v3 13 | !default.mode2v3 14 | *.perspectivev3 15 | !default.perspectivev3 16 | xcuserdata 17 | *.xccheckout 18 | *.moved-aside 19 | DerivedData 20 | *.hmap 21 | *.ipa 22 | *.xcuserstate 23 | 24 | # Android/IntelliJ 25 | # 26 | build/ 27 | .idea 28 | .gradle 29 | local.properties 30 | *.iml 31 | 32 | # Visual Studio Code 33 | # 34 | .vscode/ 35 | 36 | # node.js 37 | # 38 | node_modules/ 39 | npm-debug.log 40 | yarn-error.log 41 | 42 | # BUCK 43 | buck-out/ 44 | \.buckd/ 45 | *.keystore 46 | !debug.keystore 47 | 48 | # fastlane 49 | # 50 | # It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the 51 | # screenshots whenever they are needed. 52 | # For more information about the recommended setup visit: 53 | # https://docs.fastlane.tools/best-practices/source-control/ 54 | 55 | */fastlane/report.xml 56 | */fastlane/Preview.html 57 | */fastlane/screenshots 58 | 59 | # Bundle artifact 60 | *.jsbundle 61 | 62 | # CocoaPods 63 | /ios/Pods/ 64 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | # Node Modules 2 | **/node_modules 3 | node_modules 4 | # Example 5 | example 6 | # Assets 7 | Assets 8 | assets -------------------------------------------------------------------------------- /.prettierrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | bracketSpacing: true, 3 | jsxBracketSameLine: false, 4 | singleQuote: false, 5 | trailingComma: "all", 6 | tabWidth: 2, 7 | semi: true, 8 | }; 9 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | ## [0.2.0](https://github.com/WrathChaos/react-native-button/tree/0.2.0) (2019-09-07) 4 | [Full Changelog](https://github.com/WrathChaos/react-native-button/compare/0.0.15...0.2.0) 5 | 6 | ⚠ BREAKING CHANGE: Way of import is changed! GooglePlayButton with newest Material Design 2 is added 🎉 7 | 8 | **Merged pull requests:** 9 | 10 | - Bump eslint-utils from 1.4.0 to 1.4.2 in /example [\#1](https://github.com/WrathChaos/react-native-button/pull/1) ([dependabot[bot]](https://github.com/apps/dependabot)) 11 | 12 | ## [0.0.15](https://github.com/WrathChaos/react-native-button/tree/0.0.15) (2019-08-17) 13 | 14 | 15 | \* *This Change Log was automatically generated by [github_changelog_generator](https://github.com/skywinder/Github-Changelog-Generator)* -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019 FreakyCoder 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | React Native Button 2 | 3 | [![Battle Tested ✅](https://img.shields.io/badge/-Battle--Tested%20%E2%9C%85-03666e?style=for-the-badge)](https://github.com/WrathChaos/react-native-button) 4 | 5 | [![Fully customizable, Gradient, Outline and Solid Button for React Native.](https://img.shields.io/badge/-Fully%20customizable%2C%20Gradient%2C%20Outline%20and%20Solid%20Button%20for%20React%20Native.-gray?style=for-the-badge)](https://github.com/WrathChaos/react-native-button) 6 | 7 | [![npm version](https://img.shields.io/npm/v/@freakycoder/react-native-button.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-button) 8 | [![npm](https://img.shields.io/npm/dt/@freakycoder/react-native-button.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-button) 9 | ![Platform - Android and iOS](https://img.shields.io/badge/platform-Android%20%7C%20iOS-blue.svg?style=for-the-badge) 10 | [![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=for-the-badge)](https://opensource.org/licenses/MIT) 11 | [![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg?style=for-the-badge)](https://github.com/prettier/prettier) 12 | 13 |

14 | React Native Button 15 | React Native Button 16 |

17 | 18 | ## Installation 19 | 20 | Add the dependency: 21 | 22 | ### React Native 23 | 24 | ```ruby 25 | npm i @freakycoder/react-native-button 26 | ``` 27 | 28 | ## Peer Dependencies 29 | 30 | ###### IMPORTANT! You need install them 31 | 32 | ```jsx 33 | "react-native-vector-icons": ">= 6.x.x", 34 | "react-native-linear-gradient": ">= 2.5.x", 35 | "react-native-dynamic-vector-icons": ">= x.x.x" 36 | ``` 37 | 38 | # Button Component Options 39 | 40 | - Button (ClassicButton) 41 | - GooglePlayButton (Material Design 2) 42 | 43 | ## Import 44 | 45 | ```jsx 46 | import { Button, GooglePlayButton } from "@freakycoder/react-native-button"; 47 | ``` 48 | 49 | # GooglePlayButton Usage (Material Design 2) 50 | 51 | ## Solid 52 | 53 | ```jsx 54 | 55 | ``` 56 | 57 | ## Outline 58 | 59 | ```jsx 60 | 61 | ``` 62 | 63 | # Button Usage (Classic Button) 64 | 65 | ## Gradient Button Usage 66 | 67 | ```jsx 68 |