From 2811ddf470672df91fc1db22505861888686cb02 Mon Sep 17 00:00:00 2001 From: Joel Arvidsson Date: Wed, 13 Feb 2019 22:23:35 +0100 Subject: [PATCH] Bump prettier and format all files --- CONTRIBUTING.md | 12 +- Examples/IconExplorer/README.md | 3 +- FONTAWESOME5.md | 41 ++--- README.md | 289 +++++++++++++++++++------------- directory/src/index.js | 5 +- package.json | 10 +- yarn.lock | 228 +++++++++++++++---------- 7 files changed, 342 insertions(+), 246 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index d13b5e550..ef60f3b14 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -16,11 +16,11 @@ If you wish to submit a pull request for a new feature or issue, you should star ### Setup -* Install [Node.js](https://nodejs.org/) if you have not already. (*We suggest you to use node v6.x.x*) -* Fork the repo -* ```git clone https://github.com/*yourusername*/react-native-vector-icons.git && cd react-native-vector-icons``` -* ```yarn install``` OR ```npm install``` -* ```npm test``` -* Optionally ```brew install fontcustom && npm run build``` if you've updated any icon sets. +- Install [Node.js](https://nodejs.org/) if you have not already. (_We suggest you to use node v6.x.x_) +- Fork the repo +- `git clone https://github.com/*yourusername*/react-native-vector-icons.git && cd react-native-vector-icons` +- `yarn install` OR `npm install` +- `npm test` +- Optionally `brew install fontcustom && npm run build` if you've updated any icon sets. One you have done this, create a new branch with a name that loosely describes the issue on which you will be working. Once you think you have the addressed the issue in question, submit a pull request to the `master` branch. diff --git a/Examples/IconExplorer/README.md b/Examples/IconExplorer/README.md index c6e82c47d..92a34e32f 100644 --- a/Examples/IconExplorer/README.md +++ b/Examples/IconExplorer/README.md @@ -1,5 +1,4 @@ -IconExplorer -============ +# IconExplorer To run on OSX you must first install `react-native-desktop` with: diff --git a/FONTAWESOME5.md b/FONTAWESOME5.md index 3d67f90d2..4b1f7ec64 100644 --- a/FONTAWESOME5.md +++ b/FONTAWESOME5.md @@ -2,14 +2,14 @@ FontAwesome 5 is split into three different font files which makes it somewhat harder to use in some cases. The implemented solution should be fairly -straightforward to use after it has been setup. +straightforward to use after it has been setup. Android and iOS handles fonts differently which is why it could be easily implemented without any additional setup. ### Table of Content -* [`Usage`](#usage) -* [`Upgrading to Pro`](#upgrading-to-pro) +- [`Usage`](#usage) +- [`Upgrading to Pro`](#upgrading-to-pro) # Usage @@ -18,7 +18,7 @@ Using the standard icons works just like the standard icons in this library. ```javascript import FontAwesome5 from 'react-native-vector-icons/FontAwesome5'; -const icon = (); +const icon = ; ``` Something special about the FontAwesome5 class is that you can also pass props @@ -27,17 +27,17 @@ to change the style of the icon: ```javascript import FontAwesome5 from 'react-native-vector-icons/FontAwesome5'; -const icon = (); -const icon = (); +const icon = ; +const icon = ; ``` **Valid types** -| Type | Description | -| --- | --- | -| **brand** | Uses the Brands font | -| **light** | Uses the Light font (pro) or Regular (Free) | -| **solid** | Uses the Solid font | +| Type | Description | +| --------- | ------------------------------------------- | +| **brand** | Uses the Brands font | +| **light** | Uses the Light font (pro) or Regular (Free) | +| **solid** | Uses the Solid font | No specified type indicates Regular font. @@ -46,13 +46,13 @@ Button, TabBarItem etc. works the same way: ```javascript import FontAwesome5 from 'react-native-vector-icons/FontAwesome5'; -const regular_icon_btn = (); -const solid_icon_btn = (); +const regular_icon_btn = ; +const solid_icon_btn = ; ``` ## getImageSource -```getImageSource``` works a little different due to its native backend and how +`getImageSource` works a little different due to its native backend and how the font is separated into different files. Therefore, the enum FA5Style is defined to help setting the style of the font: @@ -70,7 +70,9 @@ Use this to select which style the generated image should have: ```javascript import FontAwesome5, { FA5Style } from 'react-native-vector-icons/FontAwesome5'; -FontAwesome5.getImageSource("comments", 30, '#000', FA5Style.solid).then(source => this.setState({ image: source })); +FontAwesome5.getImageSource('comments', 30, '#000', FA5Style.solid).then( + source => this.setState({ image: source }) +); ``` Not passing a style will result in Regular style. @@ -78,22 +80,23 @@ Not passing a style will result in Regular style. # Upgrading to Pro You need your FontAwesome npm token which can be obtained by logging into your -account and then access the ```Services``` tab. +account and then access the `Services` tab. -Run ```./node_modules/.bin/fa5-upgrade``` and enter the token when asked to in order to +Run `./node_modules/.bin/fa5-upgrade` and enter the token when asked to in order to upgrade to the Pro version. ## Manually -If the shell script does not work you can install the Pro version manually. +If the shell script does not work you can install the Pro version manually. All you really need to do is adding the Pro fonts to your project, there is instructions on how to do this in main README.md. ## Using the Pro version Just as easy as using the Free icons, just include the icon set like this: + ```javascript import FontAwesome5Pro from 'react-native-vector-icons/FontAwesome5Pro'; -const icon = (); +const icon = ; ``` diff --git a/README.md b/README.md index 8a1516a1d..07fd68ff7 100644 --- a/README.md +++ b/README.md @@ -2,9 +2,10 @@ [![Travis](https://img.shields.io/travis/oblador/react-native-vector-icons.svg)](https://travis-ci.org/oblador/react-native-vector-icons) [![npm](https://img.shields.io/npm/v/react-native-vector-icons.svg)](https://npmjs.com/package/react-native-vector-icons) [![npm](https://img.shields.io/npm/dm/react-native-vector-icons.svg)](https://npmjs.com/package/react-native-vector-icons) [![Issue Stats](https://img.shields.io/issuestats/i/github/oblador/react-native-vector-icons.svg)](http://github.com/oblador/react-native-vector-icons/issues) -Perfect for buttons, logos and nav/tab bars. Easy to extend, style and integrate into your project. +Perfect for buttons, logos and nav/tab bars. Easy to extend, style and integrate into your project. ## Table of Contents + - [Bundeled Icon Sets](#bundled-icon-sets) - [Installation](#installation) - [iOS](#ios) @@ -31,19 +32,19 @@ Perfect for buttons, logos and nav/tab bars. Easy to extend, style and integrate [Browse all](https://oblador.github.io/react-native-vector-icons/). -* [`AntDesign`](https://ant.design/) by AntFinance (**297** icons) -* [`Entypo`](http://entypo.com) by Daniel Bruce (**411** icons) -* [`EvilIcons`](http://evil-icons.io) by Alexander Madyankin & Roman Shamin (v1.10.1, **70** icons) -* [`Feather`](http://feathericons.com) by Cole Bemis & Contributors (v4.7.0, **266** icons) -* [`FontAwesome`](http://fortawesome.github.io/Font-Awesome/icons/) by Dave Gandy (v4.7.0, **675** icons) -* [`FontAwesome 5`](https://fontawesome.com) by Fonticons, Inc. (v5.6.3, 1480 (free) **4845** (pro) icons) -* [`Foundation`](http://zurb.com/playground/foundation-icon-fonts-3) by ZURB, Inc. (v3.0, **283** icons) -* [`Ionicons`](https://ionicons.com/) by Ben Sperry (v4.2.4, **696** icons) -* [`MaterialIcons`](https://www.google.com/design/icons/) by Google, Inc. (v3.0.1, **932** icons) -* [`MaterialCommunityIcons`](https://materialdesignicons.com/) by MaterialDesignIcons.com (v3.4.93, **3494** icons) -* [`Octicons`](http://octicons.github.com) by Github, Inc. (v8.4.1, **184** icons) -* [`Zocial`](http://zocial.smcllns.com/) by Sam Collins (v1.0, **100** icons) -* [`SimpleLineIcons`](https://simplelineicons.github.io/) by Sabbir & Contributors (v2.4.1, **189** icons) +- [`AntDesign`](https://ant.design/) by AntFinance (**297** icons) +- [`Entypo`](http://entypo.com) by Daniel Bruce (**411** icons) +- [`EvilIcons`](http://evil-icons.io) by Alexander Madyankin & Roman Shamin (v1.10.1, **70** icons) +- [`Feather`](http://feathericons.com) by Cole Bemis & Contributors (v4.7.0, **266** icons) +- [`FontAwesome`](http://fortawesome.github.io/Font-Awesome/icons/) by Dave Gandy (v4.7.0, **675** icons) +- [`FontAwesome 5`](https://fontawesome.com) by Fonticons, Inc. (v5.6.3, 1480 (free) **4845** (pro) icons) +- [`Foundation`](http://zurb.com/playground/foundation-icon-fonts-3) by ZURB, Inc. (v3.0, **283** icons) +- [`Ionicons`](https://ionicons.com/) by Ben Sperry (v4.2.4, **696** icons) +- [`MaterialIcons`](https://www.google.com/design/icons/) by Google, Inc. (v3.0.1, **932** icons) +- [`MaterialCommunityIcons`](https://materialdesignicons.com/) by MaterialDesignIcons.com (v3.4.93, **3494** icons) +- [`Octicons`](http://octicons.github.com) by Github, Inc. (v8.4.1, **184** icons) +- [`Zocial`](http://zocial.smcllns.com/) by Sam Collins (v1.0, **100** icons) +- [`SimpleLineIcons`](https://simplelineicons.github.io/) by Sabbir & Contributors (v2.4.1, **189** icons) ## Installation @@ -51,18 +52,18 @@ Perfect for buttons, logos and nav/tab bars. Easy to extend, style and integrate 2. For each platform (iOS/Android/Windows) you plan to use, follow one of the options for the corresponding platform. 3. If you intend to use FontAwesome 5, check out [`this guide`](FONTAWESOME5.md) to get you started. -### iOS +### iOS #### Option: Manually If you want to use any of the bundled icons, you need to add the icon fonts to your Xcode project. Just follow these steps: -* Browse to `node_modules/react-native-vector-icons` and drag the folder `Fonts` (or just the ones you want) to your project in Xcode. **Make sure your app is checked under "Add to targets" and that "Create groups" is checked if you add the whole folder**. -* Edit `Info.plist` and add a property called **Fonts provided by application** (or `UIAppFonts` if Xcode won't autocomplete/not using Xcode) and type in the files you just added. It will look something like this: +- Browse to `node_modules/react-native-vector-icons` and drag the folder `Fonts` (or just the ones you want) to your project in Xcode. **Make sure your app is checked under "Add to targets" and that "Create groups" is checked if you add the whole folder**. +- Edit `Info.plist` and add a property called **Fonts provided by application** (or `UIAppFonts` if Xcode won't autocomplete/not using Xcode) and type in the files you just added. It will look something like this: ![XCode screenshot](https://cloud.githubusercontent.com/assets/378279/12421498/2db1f93a-be88-11e5-89c8-2e563ba6251a.png) -*Note: you need to recompile your project after adding new fonts, also ensure that they also appear under __Copy Bundle Resources__ in __Build Phases__.* +_Note: you need to recompile your project after adding new fonts, also ensure that they also appear under **Copy Bundle Resources** in **Build Phases**._ If you want to use the TabBar/NavigatorIOS integration or use `getImageSource`, then you need to add `RNVectorIcons.xcodeproj` to **Libraries** and add `libRNVectorIcons.a` to **Link Binary With Libraries** under **Build Phases**. [More info and screenshots about how to do this is available in the React Native documentation](http://facebook.github.io/react-native/docs/linking-libraries-ios.html#content). @@ -70,7 +71,7 @@ If you want to use the TabBar/NavigatorIOS integration or use `getImageSource`, `$ react-native link react-native-vector-icons` -*Note: Some users are having trouble using this method, try one of the others if you are too.* +_Note: Some users are having trouble using this method, try one of the others if you are too._ #### Option: With [CocoaPods](https://cocoapods.org/) @@ -80,11 +81,11 @@ Add the following to your `Podfile` and run `pod update`: pod 'RNVectorIcons', :path => '../node_modules/react-native-vector-icons' ``` -Edit `Info.plist` as described above. +Edit `Info.plist` as described above. If you are using `use_frameworks!` in your `Podfile` you instead need to dynamically load the icon font by doing `Icon.loadFont()` when boostrapping your application. -*Note: You must be consuming React itself via CocoaPods for this to work, see [React Native documentation](https://facebook.github.io/react-native/docs/integration-with-existing-apps) on how to set that up.* +_Note: You must be consuming React itself via CocoaPods for this to work, see [React Native documentation](https://facebook.github.io/react-native/docs/integration-with-existing-apps) on how to set that up._ ### Android @@ -110,13 +111,13 @@ apply from: "../../node_modules/react-native-vector-icons/fonts.gradle" #### Option: Manually -* Copy the contents in the `Fonts` folder to `android/app/src/main/assets/fonts` (*note lowercase font folder*). +- Copy the contents in the `Fonts` folder to `android/app/src/main/assets/fonts` (_note lowercase font folder_). ##### Integrating library for `getImageSource` and `ToolbarAndroid` support -These steps are optional and only needed if you want to use the `Icon.getImageSource` function or using custom icons in the `Icon.ToolbarAndroid` component. +These steps are optional and only needed if you want to use the `Icon.getImageSource` function or using custom icons in the `Icon.ToolbarAndroid` component. -* Edit `android/settings.gradle` to look like this (without the +): +- Edit `android/settings.gradle` to look like this (without the +): ```diff rootProject.name = 'MyApp' @@ -127,7 +128,7 @@ These steps are optional and only needed if you want to use the `Icon.getImageSo + project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android') ``` -* Edit `android/app/build.gradle` (note: **app** folder) to look like this: +- Edit `android/app/build.gradle` (note: **app** folder) to look like this: ```diff apply plugin: 'com.android.application' @@ -144,7 +145,7 @@ These steps are optional and only needed if you want to use the `Icon.getImageSo } ``` -* Edit your `MainApplication.java` (deep in `android/app/src/main/java/...`) to look like this (note **two** places to edit): +- Edit your `MainApplication.java` (deep in `android/app/src/main/java/...`) to look like this (note **two** places to edit): ```diff package com.myapp; @@ -164,29 +165,29 @@ These steps are optional and only needed if you want to use the `Icon.getImageSo } ``` -*Note: If you're using React Native (Android) <= 0.17, [follow this instructions](https://github.com/oblador/react-native-vector-icons/blob/2fe5b97afa849652215e3258189e8ca3ea775c53/README.md#integrating-library-for-getimagesource-support)* +_Note: If you're using React Native (Android) <= 0.17, [follow this instructions](https://github.com/oblador/react-native-vector-icons/blob/2fe5b97afa849652215e3258189e8ca3ea775c53/README.md#integrating-library-for-getimagesource-support)_ #### Option: With `rnpm` `$ react-native link` -*Note: Some users are having trouble using this method, try one of the others if you are too.* +_Note: Some users are having trouble using this method, try one of the others if you are too._ ### OSX via [`react-native-desktop`](https://github.com/ptmt/react-native-desktop) -* Browse to `node_modules/react-native-vector-icons` and drag the folder `Fonts` to your project in Xcode. **Make sure your app is checked under "Add to targets" and that "Create folder references" is checked**. -* Edit `Info.plist` and add a property called **Application fonts resource path** (or `ATSApplicationFontsPath` if Xcode won't autocomplete/not using Xcode) and type `Fonts` as the value. +- Browse to `node_modules/react-native-vector-icons` and drag the folder `Fonts` to your project in Xcode. **Make sure your app is checked under "Add to targets" and that "Create folder references" is checked**. +- Edit `Info.plist` and add a property called **Application fonts resource path** (or `ATSApplicationFontsPath` if Xcode won't autocomplete/not using Xcode) and type `Fonts` as the value. -*Note: you need to recompile your project after adding new fonts, also ensure that the `Fonts` folder also appear under __Copy Bundle Resources__ in __Build Phases__.* +_Note: you need to recompile your project after adding new fonts, also ensure that the `Fonts` folder also appear under **Copy Bundle Resources** in **Build Phases**._ ### Windows via [`react-native-windows`](https://github.com/ReactWindows/react-native-windows) -* Open your solution in Visual Studio, right click the Assets folder in your solution, click **Add Existing**. -* Browse to the `node_modules\react-native-vector-icons\Fonts` folder, select the required font files -* Click the **Add** drop-down and select **Add as Link**. -* Set **Copy To Output Directory** property of each font file to **Copy if newer** +- Open your solution in Visual Studio, right click the Assets folder in your solution, click **Add Existing**. +- Browse to the `node_modules\react-native-vector-icons\Fonts` folder, select the required font files +- Click the **Add** drop-down and select **Add as Link**. +- Set **Copy To Output Directory** property of each font file to **Copy if newer** -*Note: you need to recompile your project after adding new fonts.* +_Note: you need to recompile your project after adding new fonts._ ### Web (with [webpack](https://webpack.js.org/)) @@ -227,67 +228,78 @@ document.head.appendChild(style); ``` ## Upgrading + Upgrading this package often requires the font files linked to your projects to be updated as well. If the automatic linking works for you, running this again should update the fonts. Otherwise you need to follow the steps outlined in the [installation](#installation) section. ## `Icon` Component -You can either use one of the bundled icons above or roll your own custom font. + +You can either use one of the bundled icons above or roll your own custom font. ```js import Icon from 'react-native-vector-icons/FontAwesome'; -const myIcon = () +const myIcon = ; ``` ### Properties -Any [Text property](http://facebook.github.io/react-native/docs/text.html) and the following: -| Prop | Description | Default | -|---|---|---| -|**`size`**|Size of the icon, can also be passed as `fontSize` in the style object. |`12`| -|**`name`**|What icon to show, see Icon Explorer app or one of the links above. |*None*| -|**`color`**|Color of the icon. |*Inherited*| +Any [Text property](http://facebook.github.io/react-native/docs/text.html) and the following: + +| Prop | Description | Default | +| ----------- | ----------------------------------------------------------------------- | ----------- | +| **`size`** | Size of the icon, can also be passed as `fontSize` in the style object. | `12` | +| **`name`** | What icon to show, see Icon Explorer app or one of the links above. | _None_ | +| **`color`** | Color of the icon. | _Inherited_ | ### Static Methods -| Prop | Description | -|---|---| -|**`getFontFamily`**|Returns the font family that is currently used to retrieve icons as text. Usage: `const fontFamily = Icon.getFontFamily()`| -|**`getImageSource`**|Returns a promise that resolving to the source of a bitmap version of the icon for use with `Image` component et al. Usage: `const source = await Icon.getImageSource(name, size, color)`| -|**`getRawGlyphMap`**|Returns the raw glyph map of the icon set. Usage: `const glyphMap = Icon.getRawGlyphMap()` | -|**`hasIcon`**|Checks if the name is valid in current icon set. Usage: `const isNameValid = Icon.hasIcon(name)`| +| Prop | Description | +| -------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| **`getFontFamily`** | Returns the font family that is currently used to retrieve icons as text. Usage: `const fontFamily = Icon.getFontFamily()` | +| **`getImageSource`** | Returns a promise that resolving to the source of a bitmap version of the icon for use with `Image` component et al. Usage: `const source = await Icon.getImageSource(name, size, color)` | +| **`getRawGlyphMap`** | Returns the raw glyph map of the icon set. Usage: `const glyphMap = Icon.getRawGlyphMap()` | +| **`hasIcon`** | Checks if the name is valid in current icon set. Usage: `const isNameValid = Icon.hasIcon(name)` | ### Styling + Since `Icon` builds on top of the `Text` component, most [style properties](http://facebook.github.io/react-native/docs/style.html) will work as expected, you might find it useful to play around with these: -* `backgroundColor` -* `borderWidth` -* `borderColor` -* `borderRadius` -* `padding` -* `margin` -* `color` -* `fontSize` +- `backgroundColor` +- `borderWidth` +- `borderColor` +- `borderRadius` +- `padding` +- `margin` +- `color` +- `fontSize` -NOTE: On android `Text` doesn't currently support `border*` styles, to circumvent this simply wrap your `Icon` with a `View`. +NOTE: On android `Text` doesn't currently support `border*` styles, to circumvent this simply wrap your `Icon` with a `View`. -By combining some of these you can create for example : +By combining some of these you can create for example : ![type](https://cloud.githubusercontent.com/assets/378279/7667570/33817554-fc0d-11e4-9ad7-4eb60139cfb7.png) ![star](https://cloud.githubusercontent.com/assets/378279/7667569/3010dd7e-fc0d-11e4-9696-cb721fe8e98d.png) ## `Icon.Button` Component -A convenience component for creating buttons with an icon on the left side. + +A convenience component for creating buttons with an icon on the left side. ```js import Icon from 'react-native-vector-icons/FontAwesome'; const myButton = ( - + Login with Facebook ); const customTextButton = ( - Login with Facebook + + Login with Facebook + ); ``` @@ -295,16 +307,17 @@ const customTextButton = ( ![buttons](https://cloud.githubusercontent.com/assets/378279/7667568/2e9021b2-fc0d-11e4-8e68-cf91c329a6f4.png) ### Properties + Any [`Text`](http://facebook.github.io/react-native/docs/text.html), [`TouchableHighlight`](http://facebook.github.io/react-native/docs/touchablehighlight.html) or [`TouchableWithoutFeedback`](http://facebook.github.io/react-native/docs/touchablewithoutfeedback.html) property in addition to these: -| Prop | Description | Default | -|---|---|---| -|**`color`**|Text and icon color, use `iconStyle` or nest a `Text` component if you need different colors.|`white`| -|**`size`**|Icon size.|`20`| -|**`iconStyle`**|Styles applied to the icon only, good for setting margins or a different color. *Note: use `iconStyle` for margins or expect unstable behaviour.*|`{marginRight: 10}`| -|**`backgroundColor`**|Background color of the button.|`#007AFF`| -|**`borderRadius`**|Border radius of the button, set to `0` to disable. |`5`| -|**`onPress`**|A function called when the button is pressed. |*None*| +| Prop | Description | Default | +| --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------- | +| **`color`** | Text and icon color, use `iconStyle` or nest a `Text` component if you need different colors. | `white` | +| **`size`** | Icon size. | `20` | +| **`iconStyle`** | Styles applied to the icon only, good for setting margins or a different color. _Note: use `iconStyle` for margins or expect unstable behaviour._ | `{marginRight: 10}` | +| **`backgroundColor`** | Background color of the button. | `#007AFF` | +| **`borderRadius`** | Border radius of the button, set to `0` to disable. | `5` | +| **`onPress`** | A function called when the button is pressed. | _None_ | ## Usage as PNG image/source object @@ -314,29 +327,29 @@ Convenient way to plug this in into other components that rely on bitmap images Icon.getImageSource('user', 20, 'red').then((source) => this.setState({ userIcon: source })); ``` -For a complete example check out the `TabBarExample` project. +For a complete example check out the `TabBarExample` project. ## Usage with [TabBarIOS](http://facebook.github.io/react-native/docs/tabbarios.html) -Simply use `Icon.TabBarItemIOS` instead of `TabBarIOS.Item`. This is an extended component that works exactly the same but with three additional properties: +Simply use `Icon.TabBarItemIOS` instead of `TabBarIOS.Item`. This is an extended component that works exactly the same but with three additional properties: -| Prop | Description | Default | -|---|---|---| -|**`iconName`**|Name of the default icon (similar to `TabBarIOS.Item` `icon`)|*None*| -|**`selectedIconName`**|Name of the selected icon (similar to `TabBarIOS.Item` `selectedIcon`). |*`iconName`*| -|**`iconSize`**|Size of the icon. |`30`| -|**`iconColor`**|Color of the icon. |*None*| -|**`selectedIconColor`**|Color of the selected icon. |*`iconColor`*| +| Prop | Description | Default | +| ----------------------- | ----------------------------------------------------------------------- | ------------- | +| **`iconName`** | Name of the default icon (similar to `TabBarIOS.Item` `icon`) | _None_ | +| **`selectedIconName`** | Name of the selected icon (similar to `TabBarIOS.Item` `selectedIcon`). | _`iconName`_ | +| **`iconSize`** | Size of the icon. | `30` | +| **`iconColor`** | Color of the icon. | _None_ | +| **`selectedIconColor`** | Color of the selected icon. | _`iconColor`_ | -For example usage see `Examples/TabBarExample` or the examples section below. Don't forget to import and link to this project as described above if you are going to use the TabBar integration. +For example usage see `Examples/TabBarExample` or the examples section below. Don't forget to import and link to this project as described above if you are going to use the TabBar integration. **Note:** using `iconColor` and `selectedIconColor` requires the attribute [renderAsOriginal](https://facebook.github.io/react-native/docs/tabbarios-item.html#renderasoriginal) to be set to `true` on `Icon.TabBarItemIOS`. ## Usage with [NavigatorIOS](http://facebook.github.io/react-native/docs/navigatorios.html) -Use `Icon.getImageSource` to get an image source object and pass it as you would with `backButtonIcon`, `leftButtonIcon` or `rightButtonIcon`. +Use `Icon.getImageSource` to get an image source object and pass it as you would with `backButtonIcon`, `leftButtonIcon` or `rightButtonIcon`. -Note: Since [`NavigatorIOS` doesn't rerender with new state](https://github.com/facebook/react-native/issues/1403) and the async nature of `getImageSource` you must not use it with `initialRoute` until the icon is rendered, but any view added by `push` should be fine. Easiest way is to simple add an `if` statment at the beginning of you render method like this: +Note: Since [`NavigatorIOS` doesn't rerender with new state](https://github.com/facebook/react-native/issues/1403) and the async nature of `getImageSource` you must not use it with `initialRoute` until the icon is rendered, but any view added by `push` should be fine. Easiest way is to simple add an `if` statment at the beginning of you render method like this: ``` render() { @@ -347,30 +360,32 @@ Note: Since [`NavigatorIOS` doesn't rerender with new state](https://github.com/ } ``` -[Facebook writes](http://facebook.github.io/react-native/docs/navigator-comparison.html#navigatorios): +[Facebook writes](http://facebook.github.io/react-native/docs/navigator-comparison.html#navigatorios): + > Development belongs to open-source community - not used by the React Native team on their apps. A result of this is that there is currently a backlog of unresolved bugs, nobody who uses this has stepped up to take ownership for it yet. You are probably better off with [`Navigator.NavigationBar`](http://facebook.github.io/react-native/docs/navigator.html) or [`react-native-navbar`](https://github.com/Kureev/react-native-navbar). ## Usage with [ToolbarAndroid](http://facebook.github.io/react-native/docs/toolbarandroid.html) -Simply use `Icon.ToolbarAndroid` instead of `React.ToolbarAndroid`, this is composition of the underlying `ToolbarAndroid` component that works the same but any `*icon` property also takes `*iconName`: +Simply use `Icon.ToolbarAndroid` instead of `React.ToolbarAndroid`, this is composition of the underlying `ToolbarAndroid` component that works the same but any `*icon` property also takes `*iconName`: -| Prop | Description | Default | -|---|---|---| -|**`logoName`**|Name of the navigation logo icon (similar to `ToolbarAndroid` `logo`)|*None*| -|**`navIconName`**|Name of the navigation icon (similar to `ToolbarAndroid` `navIcon`)|*None*| -|**`overflowIconName`**|Name of the overflow icon (similar to `ToolbarAndroid` `overflowIcon`). |*none*| -|**`actions`**|Possible actions on the toolbar as part of the action menu, takes the additional arguments `iconName`, `iconColor` and `iconSize`. |*none*| -|**`iconSize`**|Size of the icons. |`24`| -|**`iconColor`**|Color of the icons. |`black`| +| Prop | Description | Default | +| ---------------------- | ---------------------------------------------------------------------------------------------------------------------------------- | ------- | +| **`logoName`** | Name of the navigation logo icon (similar to `ToolbarAndroid` `logo`) | _None_ | +| **`navIconName`** | Name of the navigation icon (similar to `ToolbarAndroid` `navIcon`) | _None_ | +| **`overflowIconName`** | Name of the overflow icon (similar to `ToolbarAndroid` `overflowIcon`). | _none_ | +| **`actions`** | Possible actions on the toolbar as part of the action menu, takes the additional arguments `iconName`, `iconColor` and `iconSize`. | _none_ | +| **`iconSize`** | Size of the icons. | `24` | +| **`iconColor`** | Color of the icons. | `black` | -For example usage see `Examples/IconExplorer/index.android.js`or the examples section below. Don't forget to import and link to this project as described above if you are going to use the ToolbarAndroid integration. +For example usage see `Examples/IconExplorer/index.android.js`or the examples section below. Don't forget to import and link to this project as described above if you are going to use the ToolbarAndroid integration. ## Custom Fonts ### `createIconSet(glyphMap, fontFamily[, fontFile])` -Returns your own custom font based on the `glyphMap` where the key is the icon name and the value is either a UTF-8 character or it's character code. `fontFamily` is the name of the font **NOT** the filename. Open the font in Font Book.app or similar to learn the name. Optionally pass the third `fontFile` argument for android support, it should be the custom font file name. + +Returns your own custom font based on the `glyphMap` where the key is the icon name and the value is either a UTF-8 character or it's character code. `fontFamily` is the name of the font **NOT** the filename. Open the font in Font Book.app or similar to learn the name. Optionally pass the third `fontFile` argument for android support, it should be the custom font file name. ```js import { createIconSet } from 'react-native-vector-icons'; @@ -379,7 +394,8 @@ const Icon = createIconSet(glyphMap, 'FontName', 'font-name.ttf'); ``` ### `createIconSetFromFontello(config[, fontFamily[, fontFile]])` -Convenience method to create a custom font based on a [fontello](http://fontello.com) config file. Don't forget to import the font as described above and drop the `config.json` somewhere convenient in your project. + +Convenience method to create a custom font based on a [fontello](http://fontello.com) config file. Don't forget to import the font as described above and drop the `config.json` somewhere convenient in your project. ```js import { createIconSetFromFontello } from 'react-native-vector-icons'; @@ -388,14 +404,21 @@ const Icon = createIconSetFromFontello(fontelloConfig); ``` ### `createIconSetFromIcoMoon(config[, fontFamily[, fontFile]])` + ```js import { createIconSetFromIcoMoon } from 'react-native-vector-icons'; import icoMoonConfig from './selection.json'; -const Icon = createIconSetFromIcoMoon(icoMoonConfig, 'LineAwesome', 'line-awesome.ttf'); +const Icon = createIconSetFromIcoMoon( + icoMoonConfig, + 'LineAwesome', + 'line-awesome.ttf' +); ``` Make sure you're using the _Download_ option in [IcoMoon](https://icomoon.io/app), and use the `.json` file that's included in the `.zip` you've downloaded. You'll also need to import the `.ttf` font file into your project, following the instructions above. -#### iOS + +#### iOS + You have to manually make a reference of your `.ttf` on your xcodeproj `Resources` folder. ## Animation @@ -405,22 +428,24 @@ React Native comes with an amazing animation library called [`Animated`](http:// ## Examples ### IconExplorer -Try the `IconExplorer` project in `Examples/IconExplorer` folder, there you can also search for any icon. -![Screenshot of IconExplorer](https://cloud.githubusercontent.com/assets/378279/8903470/a9fe6b46-3458-11e5-901f-98b7b676d0d3.png) +Try the `IconExplorer` project in `Examples/IconExplorer` folder, there you can also search for any icon. +![Screenshot of IconExplorer](https://cloud.githubusercontent.com/assets/378279/8903470/a9fe6b46-3458-11e5-901f-98b7b676d0d3.png) ### Basic Example + ```js import Icon from 'react-native-vector-icons/Ionicons'; function ExampleView(props) { - return (); + return ; } ``` ### TabBarIOS -Full example in `TabBarExample` project in `Examples/TabBarExample` folder. + +Full example in `TabBarExample` project in `Examples/TabBarExample` folder. ```js import { View, Text, TabBarIOS } from 'react-native'; @@ -433,8 +458,10 @@ function TabBarView(props) { title="Home" iconName="ios-home-outline" selectedIconName="ios-home" - > - Home Tab + > + + Home Tab + ); @@ -454,8 +481,18 @@ function ToolbarView(props) { navIconName="md-arrow-back" onIconClicked={props.navigator.pop} actions={[ - { title: 'Settings', iconName: 'md-settings', iconSize: 30, show: 'always' }, - { title: 'Follow me on Twitter', iconName: 'logo-twitter', iconColor: "#4099FF", show: 'ifRoom' }, + { + title: 'Settings', + iconName: 'md-settings', + iconSize: 30, + show: 'always', + }, + { + title: 'Follow me on Twitter', + iconName: 'logo-twitter', + iconColor: '#4099FF', + show: 'ifRoom', + }, ]} overflowIconName="md-more" /> @@ -464,26 +501,31 @@ function ToolbarView(props) { ``` ### Inline Icons + ```js import { Text } from 'react-native'; import Icon from 'react-native-vector-icons/Ionicons'; function ExampleView(props) { - return (Lorem Ipsum); + return ( + + Lorem Ipsum + + ); } ``` ### Community examples -* [react-native-dribbble-app](https://github.com/catalinmiron/react-native-dribbble-app) -* [product-kitty](https://github.com/rkho/product-kitty) ([blog post](http://richardkho.com/persisting-tabbars-in-react-native/)) -* [react-native-netflix](https://github.com/mariodev12/react-native-netflix) +- [react-native-dribbble-app](https://github.com/catalinmiron/react-native-dribbble-app) +- [product-kitty](https://github.com/rkho/product-kitty) ([blog post](http://richardkho.com/persisting-tabbars-in-react-native/)) +- [react-native-netflix](https://github.com/mariodev12/react-native-netflix) ## Generating your own icon set from a CSS file -If you already have a icon font with associated CSS file then you can easily generate a icon set with the `generate-icon` script. +If you already have a icon font with associated CSS file then you can easily generate a icon set with the `generate-icon` script. -### Example usage: +### Example usage: ``` ./node_modules/.bin/generate-icon path/to/styles.css --componentName=MyIcon --fontFamily=myicon > Components/MyIcon.js @@ -491,17 +533,20 @@ If you already have a icon font with associated CSS file then you can easily gen ### Options -Any flags not listed below, like `--componentName` and `--fontFamily`, will be passed on to the template. +Any flags not listed below, like `--componentName` and `--fontFamily`, will be passed on to the template. #### `-p`, `--prefix` + CSS selector prefix [default: ".icon-"] #### `-t`, `--template` + Template in lodash format [default: "./template/iconSet.tpl"] For default template please provide `--componentName` and `--fontFamily`. #### `-o`, `--output` + Save output to file, defaults to STDOUT ## [Changelog](https://github.com/oblador/react-native-vector-icons/releases) @@ -509,16 +554,18 @@ Save output to file, defaults to STDOUT ## Troubleshooting #### The icons show up as a crossed out box on Android -* Make sure you've copied the font to `android/app/src/main/assets/fonts`. -* Delete the build folder with `rm -rf android/app/build`. -* Recompile the project. + +- Make sure you've copied the font to `android/app/src/main/assets/fonts`. +- Delete the build folder with `rm -rf android/app/build`. +- Recompile the project. #### Red screen with "Unrecognized font family" error on iOS -* Make sure you've added manually the reference of your `.ttf` on your xcodeproj `Resources` folder. -* Check that the font you are trying to use appears in `Info.plist`, if you've added the whole folder and it's blue in color, then you need to add it to the path. -* Check that the font is copied in the *Copy Bundle Resources* in *Build Phases*. -* Delete the build folder with `rm -rf ios/build` -* Recompile the project. + +- Make sure you've added manually the reference of your `.ttf` on your xcodeproj `Resources` folder. +- Check that the font you are trying to use appears in `Info.plist`, if you've added the whole folder and it's blue in color, then you need to add it to the path. +- Check that the font is copied in the _Copy Bundle Resources_ in _Build Phases_. +- Delete the build folder with `rm -rf ios/build` +- Recompile the project. #### Android build fails on Windows for no good reason diff --git a/directory/src/index.js b/directory/src/index.js index 574a7bbd6..667647551 100755 --- a/directory/src/index.js +++ b/directory/src/index.js @@ -5,7 +5,4 @@ import ReactDOM from 'react-dom'; import App from './App'; import './index.css'; -ReactDOM.render( - , - document.getElementById('root'), -); +ReactDOM.render(, document.getElementById('root')); diff --git a/package.json b/package.json index 87223e031..29ea99409 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,7 @@ }, "scripts": { "test": "eslint index.js {bin,lib}/*.js", - "format": "prettier index.js {bin,lib,Examples/*}/*.js --write", + "format": "prettier index.js *.md {bin,lib,directory,Examples}/**/*.js --write", "prepublish": "npm run build-web", "build": "./scripts/build-icons.sh", "build-web": "rm -rf ./dist && babel *.js --out-dir ./dist && babel lib --out-dir ./dist/lib && cp -R ./glyphmaps ./dist/glyphmaps", @@ -73,12 +73,12 @@ "@babel/core": "^7.1.2", "@mdi/font": "^3.4.93", "babel-eslint": "^10.0.1", - "eslint": "^5.3.0", + "eslint": "^5.13.0", "eslint-config-airbnb": "17.1.0", - "eslint-config-prettier": "^3.1.0", + "eslint-config-prettier": "^4.0.0", "eslint-plugin-import": "^2.14.0", "eslint-plugin-jsx-a11y": "^6.1.1", - "eslint-plugin-prettier": "^2.7.0", + "eslint-plugin-prettier": "^3.0.1", "eslint-plugin-react": "^7.11.0", "evil-icons": "^1.10.1", "font-awesome": "^4.6.3", @@ -86,6 +86,6 @@ "material-design-icons": "^3.0.1", "metro-react-native-babel-preset": "0.47.0", "octicons": "^8.4.1", - "prettier": "^1.14.3" + "prettier": "^1.16.4" } } diff --git a/yarn.lock b/yarn.lock index 77883697f..c8fcca63b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -512,21 +512,17 @@ abbrev@1: version "1.1.1" resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8" -acorn-jsx@^4.1.1: - version "4.1.1" - resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-4.1.1.tgz#e8e41e48ea2fe0c896740610ab6a4ffd8add225e" - dependencies: - acorn "^5.0.3" +acorn-jsx@^5.0.0: + version "5.0.1" + resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.0.1.tgz#32a064fd925429216a09b141102bfdd185fae40e" + integrity sha512-HJ7CfNHrfJLlNTzIEUTj43LNWGkqpRLxm3YjAlcD0ACydk9XynzYsCBHxut+iqt+1aBXkx9UP/w/ZqMr13XIzg== -acorn@^5.0.3, acorn@^5.6.0: - version "5.7.3" - resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.7.3.tgz#67aa231bf8812974b85235a96771eb6bd07ea279" - -ajv-keywords@^3.0.0: - version "3.2.0" - resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.2.0.tgz#e86b819c602cf8821ad637413698f1dec021847a" +acorn@^6.0.2: + version "6.1.0" + resolved "https://registry.yarnpkg.com/acorn/-/acorn-6.1.0.tgz#b0a3be31752c97a0f7013c5f4903b71a05db6818" + integrity sha512-MW/FjM+IvU9CgBzjO3UIPCE2pyEwUsoFl+VGdczOPEdxfGFjuKny/gN54mOuX7Qxmb9Rg9MCn2oKiSUeW+pjrw== -ajv@^6.0.1, ajv@^6.5.3: +ajv@^6.5.3: version "6.5.4" resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.5.4.tgz#247d5274110db653706b550fcc2b797ca28cfc59" dependencies: @@ -535,6 +531,16 @@ ajv@^6.0.1, ajv@^6.5.3: json-schema-traverse "^0.4.1" uri-js "^4.2.2" +ajv@^6.9.1: + version "6.9.1" + resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.9.1.tgz#a4d3683d74abc5670e75f0b16520f70a20ea8dc1" + integrity sha512-XDN92U311aINL77ieWHmqCcNlwjoP5cHXDxIxbf2MaPYuCXOHS7gHH8jktxeK5omgd52XbSTX6a4Piwd1pQmzA== + dependencies: + fast-deep-equal "^2.0.1" + fast-json-stable-stringify "^2.0.0" + json-schema-traverse "^0.4.1" + uri-js "^4.2.2" + ansi-escapes@^3.0.0: version "3.1.0" resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-3.1.0.tgz#f73207bb81207d75fd6c83f125af26eea378ca30" @@ -547,12 +553,24 @@ ansi-regex@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-3.0.0.tgz#ed0317c322064f79466c02966bddb605ab37d998" +ansi-regex@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-4.0.0.tgz#70de791edf021404c3fd615aa89118ae0432e5a9" + integrity sha512-iB5Dda8t/UqpPI/IjsejXu5jOGDrzn41wJyljwPH65VCIbk6+1BzFIMJGFwTNrYXT1CrD+B4l19U7awiQ8rk7w== + ansi-styles@^3.1.0: version "3.2.0" resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-3.2.0.tgz#c159b8d5be0f9e5a6f346dab94f16ce022161b88" dependencies: color-convert "^1.9.0" +ansi-styles@^3.2.0: + version "3.2.1" + resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-3.2.1.tgz#41fbb20243e50b12be0f04b8dedbf07520ce841d" + integrity sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA== + dependencies: + color-convert "^1.9.0" + anymatch@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-2.0.0.tgz#bcb24b4f37934d9aa7ac17b4adaf89e7c76ef2eb" @@ -629,6 +647,11 @@ ast-types-flow@0.0.7, ast-types-flow@^0.0.7: version "0.0.7" resolved "https://registry.yarnpkg.com/ast-types-flow/-/ast-types-flow-0.0.7.tgz#f70b735c6bca1a5c9c22d982c3e39e7feba3bdad" +astral-regex@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-1.0.0.tgz#6c8c3fb827dd43ee3918f27b82782ab7658a6fd9" + integrity sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg== + async-each@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/async-each/-/async-each-1.0.1.tgz#19d386a1d9edc6e7c1c85d388aedbcc56d33602d" @@ -714,15 +737,10 @@ cache-base@^1.0.1: union-value "^1.0.0" unset-value "^1.0.0" -caller-path@^0.1.0: - version "0.1.0" - resolved "https://registry.yarnpkg.com/caller-path/-/caller-path-0.1.0.tgz#94085ef63581ecd3daa92444a8fe94e82577751f" - dependencies: - callsites "^0.2.0" - -callsites@^0.2.0: - version "0.2.0" - resolved "https://registry.yarnpkg.com/callsites/-/callsites-0.2.0.tgz#afab96262910a7f33c19a5775825c69f34e350ca" +callsites@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.0.0.tgz#fb7eb569b72ad7a45812f93fd9430a3e410b3dd3" + integrity sha512-tWnkwu9YEq2uzlBDI4RcLn8jrFvF9AOi8PxDNU3hZZjJcjkcRAq3vCI+vZcg1SuxISDYe86k9VZFwAxDiJGoAw== camelcase@^4.1.0: version "4.1.0" @@ -978,6 +996,11 @@ emoji-regex@^6.5.1: version "6.5.1" resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-6.5.1.tgz#9baea929b155565c11ea41c6626eaa65cef992c2" +emoji-regex@^7.0.1: + version "7.0.3" + resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-7.0.3.tgz#933a04052860c85e83c122479c4748a8e4c72156" + integrity sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA== + error-ex@^1.2.0: version "1.3.1" resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.1.tgz#f855a86ce61adc4e8621c3cda21e7a7612c3a8dc" @@ -1032,9 +1055,10 @@ eslint-config-airbnb@17.1.0: object.assign "^4.1.0" object.entries "^1.0.4" -eslint-config-prettier@^3.1.0: - version "3.1.0" - resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-3.1.0.tgz#2c26d2cdcfa3a05f0642cd7e6e4ef3316cdabfa2" +eslint-config-prettier@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-4.0.0.tgz#16cedeea0a56e74de60dcbbe3be0ab2c645405b9" + integrity sha512-kWuiJxzV5NwOwZcpyozTzDT5KJhBw292bbYro9Is7BWnbNMg15Gmpluc1CTetiCatF8DRkNvgPAOaSyg+bYr3g== dependencies: get-stdin "^6.0.0" @@ -1080,12 +1104,12 @@ eslint-plugin-jsx-a11y@^6.1.1: has "^1.0.3" jsx-ast-utils "^2.0.1" -eslint-plugin-prettier@^2.7.0: - version "2.7.0" - resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-2.7.0.tgz#b4312dcf2c1d965379d7f9d5b5f8aaadc6a45904" +eslint-plugin-prettier@^3.0.1: + version "3.0.1" + resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-3.0.1.tgz#19d521e3981f69dd6d14f64aec8c6a6ac6eb0b0d" + integrity sha512-/PMttrarPAY78PLvV3xfWibMOdMDl57hmlQ2XqFeA37wd+CJ7WSxV7txqjVPHi/AAFKd2lX0ZqfsOc/i5yFCSQ== dependencies: - fast-diff "^1.1.1" - jest-docblock "^21.0.0" + prettier-linter-helpers "^1.0.0" eslint-plugin-react@^7.11.0: version "7.11.1" @@ -1123,9 +1147,10 @@ eslint-visitor-keys@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz#3f3180fb2e291017716acb4c9d6d5b5c34a6a81d" -eslint@^5.3.0: - version "5.6.1" - resolved "https://registry.yarnpkg.com/eslint/-/eslint-5.6.1.tgz#348134e32ccc09abb2df1bf282b3f6eed8c7b480" +eslint@^5.13.0: + version "5.13.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-5.13.0.tgz#ce71cc529c450eed9504530939aa97527861ede9" + integrity sha512-nqD5WQMisciZC5EHZowejLKQjWGuFS5c70fxqSKlnDME+oz9zmE8KTlX+lHSg+/5wsC/kf9Q9eMkC8qS3oM2fg== dependencies: "@babel/code-frame" "^7.0.0" ajv "^6.5.3" @@ -1136,7 +1161,7 @@ eslint@^5.3.0: eslint-scope "^4.0.0" eslint-utils "^1.3.1" eslint-visitor-keys "^1.0.0" - espree "^4.0.0" + espree "^5.0.0" esquery "^1.0.1" esutils "^2.0.2" file-entry-cache "^2.0.0" @@ -1144,9 +1169,9 @@ eslint@^5.3.0: glob "^7.1.2" globals "^11.7.0" ignore "^4.0.6" + import-fresh "^3.0.0" imurmurhash "^0.1.4" inquirer "^6.1.0" - is-resolvable "^1.1.0" js-yaml "^3.12.0" json-stable-stringify-without-jsonify "^1.0.1" levn "^0.3.0" @@ -1156,22 +1181,22 @@ eslint@^5.3.0: natural-compare "^1.4.0" optionator "^0.8.2" path-is-inside "^1.0.2" - pluralize "^7.0.0" progress "^2.0.0" - regexpp "^2.0.0" - require-uncached "^1.0.3" + regexpp "^2.0.1" semver "^5.5.1" strip-ansi "^4.0.0" strip-json-comments "^2.0.1" - table "^4.0.3" + table "^5.0.2" text-table "^0.2.0" -espree@^4.0.0: - version "4.0.0" - resolved "https://registry.yarnpkg.com/espree/-/espree-4.0.0.tgz#253998f20a0f82db5d866385799d912a83a36634" +espree@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/espree/-/espree-5.0.0.tgz#fc7f984b62b36a0f543b13fb9cd7b9f4a7f5b65c" + integrity sha512-1MpUfwsdS9MMoN7ZXqAr9e9UKdVHDcvrJpyx7mm1WuQlx/ygErEQBzgi5Nh5qBHIoYweprhtMkTCb9GhcAIcsA== dependencies: - acorn "^5.6.0" - acorn-jsx "^4.1.1" + acorn "^6.0.2" + acorn-jsx "^5.0.0" + eslint-visitor-keys "^1.0.0" esprima@^4.0.0: version "4.0.0" @@ -1264,9 +1289,10 @@ fast-deep-equal@^2.0.1: version "2.0.1" resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-2.0.1.tgz#7b05218ddf9667bf7f370bf7fdb2cb15fdd0aa49" -fast-diff@^1.1.1: - version "1.1.1" - resolved "https://registry.yarnpkg.com/fast-diff/-/fast-diff-1.1.1.tgz#0aea0e4e605b6a2189f0e936d4b7fbaf1b7cfd9b" +fast-diff@^1.1.2: + version "1.2.0" + resolved "https://registry.yarnpkg.com/fast-diff/-/fast-diff-1.2.0.tgz#73ee11982d86caaf7959828d519cfe927fac5f03" + integrity sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w== fast-json-stable-stringify@^2.0.0: version "2.0.0" @@ -1522,6 +1548,14 @@ ignore@^4.0.6: version "4.0.6" resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc" +import-fresh@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.0.0.tgz#a3d897f420cab0e671236897f75bc14b4885c390" + integrity sha512-pOnA9tfM3Uwics+SaBLCNyZZZbK+4PTu0OPZtLlMIrv17EdBoC15S9Kn8ckJ9TZTyKb3ywNE5y1yeDxxGA7nTQ== + dependencies: + parent-module "^1.0.0" + resolve-from "^4.0.0" + imurmurhash@^0.1.4: version "0.1.4" resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea" @@ -1713,10 +1747,6 @@ is-regex@^1.0.4: dependencies: has "^1.0.1" -is-resolvable@^1.1.0: - version "1.1.0" - resolved "https://registry.yarnpkg.com/is-resolvable/-/is-resolvable-1.1.0.tgz#fb18f87ce1feb925169c9a407c19318a3206ed88" - is-stream@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44" @@ -1747,10 +1777,6 @@ isobject@^3.0.0, isobject@^3.0.1: version "3.0.1" resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df" -jest-docblock@^21.0.0: - version "21.2.0" - resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-21.2.0.tgz#51529c3b30d5fd159da60c27ceedc195faf8d414" - js-tokens@^3.0.0: version "3.0.2" resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b" @@ -1849,7 +1875,7 @@ lodash@^4.0.0, lodash@^4.17.4, lodash@^4.6.1: version "4.17.4" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae" -lodash@^4.17.10, lodash@^4.17.5: +lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.5: version "4.17.11" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d" @@ -2240,6 +2266,13 @@ p-locate@^2.0.0: dependencies: p-limit "^1.1.0" +parent-module@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/parent-module/-/parent-module-1.0.0.tgz#df250bdc5391f4a085fb589dad761f5ad6b865b5" + integrity sha512-8Mf5juOMmiE4FcmzYc4IaiS9L3+9paz2KOiXzkRviCP6aDmN49Hz6EMWz0lGNp9pX80GvvAuLADtyGfW/Em3TA== + dependencies: + callsites "^3.0.0" + parse-json@^2.2.0: version "2.2.0" resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-2.2.0.tgz#f480f40434ef80741f8469099f8dea18f55a4dc9" @@ -2306,10 +2339,6 @@ pkg-dir@^1.0.0: dependencies: find-up "^1.0.0" -pluralize@^7.0.0: - version "7.0.0" - resolved "https://registry.yarnpkg.com/pluralize/-/pluralize-7.0.0.tgz#298b89df8b93b0221dbf421ad2b1b1ea23fc6777" - posix-character-classes@^0.1.0: version "0.1.1" resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab" @@ -2318,9 +2347,17 @@ prelude-ls@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54" -prettier@^1.14.3: - version "1.14.3" - resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.14.3.tgz#90238dd4c0684b7edce5f83b0fb7328e48bd0895" +prettier-linter-helpers@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz#d23d41fe1375646de2d0104d3454a3008802cf7b" + integrity sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w== + dependencies: + fast-diff "^1.1.2" + +prettier@^1.16.4: + version "1.16.4" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.16.4.tgz#73e37e73e018ad2db9c76742e2647e21790c9717" + integrity sha512-ZzWuos7TI5CKUeQAtFd6Zhm2s6EpAD/ZLApIhsF9pRvRtM1RFo61dM/4MSRUA0SuLugA/zgrZD8m0BaY46Og7g== private@^0.1.6: version "0.1.7" @@ -2438,9 +2475,10 @@ regex-not@^1.0.0, regex-not@^1.0.2: extend-shallow "^3.0.2" safe-regex "^1.1.0" -regexpp@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-2.0.0.tgz#b2a7534a85ca1b033bcf5ce9ff8e56d4e0755365" +regexpp@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-2.0.1.tgz#8d19d31cf632482b589049f8281f93dbcba4d07f" + integrity sha512-lv0M6+TkDVniA3aD1Eg0DVpfU/booSu7Eev3TDO/mZKHBfVjgCGTV4t4buppESEYDtkArYFOxTJWv6S5C+iaNw== regexpu-core@^4.1.3: version "4.2.0" @@ -2483,16 +2521,10 @@ require-main-filename@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/require-main-filename/-/require-main-filename-1.0.1.tgz#97f717b69d48784f5f526a6c5aa8ffdda055a4d1" -require-uncached@^1.0.3: - version "1.0.3" - resolved "https://registry.yarnpkg.com/require-uncached/-/require-uncached-1.0.3.tgz#4e0d56d6c9662fd31e43011c4b95aa49955421d3" - dependencies: - caller-path "^0.1.0" - resolve-from "^1.0.0" - -resolve-from@^1.0.0: - version "1.0.1" - resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-1.0.1.tgz#26cbfe935d1aeeeabb29bc3fe5aeb01e93d44226" +resolve-from@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6" + integrity sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g== resolve-url@^0.2.1: version "0.2.1" @@ -2605,10 +2637,13 @@ slash@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/slash/-/slash-2.0.0.tgz#de552851a1759df3a8f206535442f5ec4ddeab44" -slice-ansi@1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-1.0.0.tgz#044f1a49d8842ff307aad6b505ed178bd950134d" +slice-ansi@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-2.1.0.tgz#cacd7693461a637a5788d92a7dd4fba068e81636" + integrity sha512-Qu+VC3EwYLldKa1fCxuuvULvSJOKEgk9pi8dZeCVK7TqBfUNTH4sFkk4joj8afVSfAYgJoSOetjx9QWOJ5mYoQ== dependencies: + ansi-styles "^3.2.0" + astral-regex "^1.0.0" is-fullwidth-code-point "^2.0.0" snapdragon-node@^2.0.1: @@ -2695,13 +2730,22 @@ string-width@^1.0.1: is-fullwidth-code-point "^1.0.0" strip-ansi "^3.0.0" -"string-width@^1.0.2 || 2", string-width@^2.0.0, string-width@^2.1.0, string-width@^2.1.1: +"string-width@^1.0.2 || 2", string-width@^2.0.0, string-width@^2.1.0: version "2.1.1" resolved "https://registry.yarnpkg.com/string-width/-/string-width-2.1.1.tgz#ab93f27a8dc13d28cac815c462143a6d9012ae9e" dependencies: is-fullwidth-code-point "^2.0.0" strip-ansi "^4.0.0" +string-width@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/string-width/-/string-width-3.0.0.tgz#5a1690a57cc78211fffd9bf24bbe24d090604eb1" + integrity sha512-rr8CUxBbvOZDUvc5lNIJ+OC1nPVpz+Siw9VBtUjB9b6jZehZLFt0JMCZzShFHIsI8cbhm0EsNIfWJMFV3cu3Ew== + dependencies: + emoji-regex "^7.0.1" + is-fullwidth-code-point "^2.0.0" + strip-ansi "^5.0.0" + string_decoder@~1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.1.1.tgz#9cf1611ba62685d7030ae9e4ba34149c3af03fc8" @@ -2720,6 +2764,13 @@ strip-ansi@^4.0.0: dependencies: ansi-regex "^3.0.0" +strip-ansi@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-5.0.0.tgz#f78f68b5d0866c20b2c9b8c61b5298508dc8756f" + integrity sha512-Uu7gQyZI7J7gn5qLn1Np3G9vcYGTVqB+lFTytnDJv83dd8T22aGH451P3jueT2/QemInJDfxHB5Tde5OzgG1Ow== + dependencies: + ansi-regex "^4.0.0" + strip-bom@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3" @@ -2738,16 +2789,15 @@ supports-color@^4.0.0: dependencies: has-flag "^2.0.0" -table@^4.0.3: - version "4.0.3" - resolved "http://registry.npmjs.org/table/-/table-4.0.3.tgz#00b5e2b602f1794b9acaf9ca908a76386a7813bc" +table@^5.0.2: + version "5.2.3" + resolved "https://registry.yarnpkg.com/table/-/table-5.2.3.tgz#cde0cc6eb06751c009efab27e8c820ca5b67b7f2" + integrity sha512-N2RsDAMvDLvYwFcwbPyF3VmVSSkuF+G1e+8inhBLtHpvwXGw4QRPEZhihQNeEN0i1up6/f6ObCJXNdlRG3YVyQ== dependencies: - ajv "^6.0.1" - ajv-keywords "^3.0.0" - chalk "^2.1.0" - lodash "^4.17.4" - slice-ansi "1.0.0" - string-width "^2.1.1" + ajv "^6.9.1" + lodash "^4.17.11" + slice-ansi "^2.1.0" + string-width "^3.0.0" tar@^4: version "4.4.6"