@react-native-community/blur - npm Package Compare versions

Comparing version 3.3.1 to 3.4.1

index.d.ts

@@ -13,6 +13,9 @@ import * as React from "react";
     // tvOS only
-    | "extraDark";
-  blurAmount?: number; // 0 - 100
-  style?: StyleProp<ViewStyle>;
-  viewRef?: number | null;
+    | "extraDark"
+  blurAmount?: number // 0 - 100
+  style?: StyleProp<ViewStyle>
+  viewRef?: number | null
+  blurRadius?: number
+  downsampleFactor?: number
+  overlayColor?: string
 }
@@ -19,0 +22,0 @@

package.json

 {
   "name": "@react-native-community/blur",
-  "version": "3.3.1",
+  "version": "3.4.1",
   "description": "React Native Blur component",
@@ -8,3 +8,3 @@ "main": "index.js",
     "test": "echo \"Error: no test specified\" && exit 1",
-    "lint": "eslint ."
+    "lint": "eslint src index.js"
   },
@@ -30,9 +30,10 @@ "repository": {
   "devDependencies": {
-    "@react-native-community/eslint-config": "^0.0.3",
-    "eslint": "^5.15.3",
-    "husky": "^1.3.1",
-    "lint-staged": "^8.1.5",
-    "prettier": "1.16.4",
-    "react": "16.8.3",
-    "react-native": "0.59.2"
+    "@react-native-community/eslint-config": "^0.0.5",
+    "eslint": "^6.6.0",
+    "eslint-plugin-prettier": "^3.1.1",
+    "husky": "^3.0.9",
+    "lint-staged": "^9.4.2",
+    "prettier": "1.18.2",
+    "react": "16.11.0",
+    "react-native": "0.61.4"
   },
@@ -39,0 +40,0 @@ "husky": {

README.md

@@ -37,5 +37,12 @@ # `@react-native-community/blur`
 
-3. (Android only) Add the following to `android/app/build.gradle`
+3. (iOS only) Install to Xcode:
 
 ```
+cd ios
+pod install
+```
+
+4. (Android only) Add the following to `android/app/build.gradle`
+
+```
 android {
@@ -54,3 +61,3 @@ // make sure to use 23.0.3 or greater
 
-4. (Android only, optional) 
+5. (Android only, optional) 
 If you've defined _[project-wide properties](https://developer.android.com/studio/build/gradle-tips.html)_ (**recommended**) in your root `build.gradle`, this library will detect the presence of the following properties:
@@ -72,3 +79,3 @@
 
-5. Include the library in your code:
+6. Include the library in your code:
 
@@ -79,3 +86,3 @@ ```javascript
 
-6. Compile and have fun!
+7. Compile and have fun!
 
@@ -290,2 +297,2 @@ ### BlurView
 
-Feel free to contact me in [twitter](https://twitter.com/kureevalexey) or [create an issue](https://github.com/Kureev/react-native-blur/issues/new)
+Feel free to contact me on [twitter](https://twitter.com/kureevalexey) or [create an issue](https://github.com/Kureev/react-native-blur/issues/new)

src/BlurView.android.js

@@ -8,2 +8,4 @@ import React, { Component } from 'react';
   ViewPropTypes,
+  Platform,
+  StyleSheet,
 } from 'react-native';
@@ -69,4 +71,4 @@
         '[ReactNativeBlur]: BlurView cannot contain any child views on Android. ' +
-          'You should use "position: absolute" on the BlurView, ' +
-          'and place other views in front of it.'
+        'You should use "position: absolute" on the BlurView, ' +
+        'and place other views in front of it.'
       );
@@ -83,3 +85,3 @@ }
         overlayColor={this.overlayColor()}
-        style={[{ backgroundColor: 'transparent' }, style]}
+        style={StyleSheet.compose(styles.transparent, style)}
       />
@@ -90,2 +92,6 @@ );
 
+const styles = StyleSheet.create({
+  transparent: { backgroundColor: 'transparent' },
+});
+
 BlurView.propTypes = {
@@ -99,3 +105,6 @@ ...(ViewPropTypes || View.propTypes),
   overlayColor: PropTypes.string,
-  viewRef: PropTypes.number.isRequired,
+  viewRef: Platform.select({
+    android: PropTypes.number.isRequired,
+    default: PropTypes.number,
+  }),
 };
@@ -102,0 +111,0 @@

src/BlurView.ios.js

 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import { View, requireNativeComponent, ViewPropTypes } from 'react-native';
+import {View, requireNativeComponent, ViewPropTypes, StyleSheet} from 'react-native';
 
@@ -17,3 +17,3 @@ class BlurView extends Component {
         {...this.props}
-        style={[{ backgroundColor: 'transparent' }, this.props.style]}
+        style={StyleSheet.compose(styles.transparent, this.props.style)}
       />
@@ -24,2 +24,6 @@ );
 
+const styles = StyleSheet.create({
+  transparent: { backgroundColor: 'transparent' },
+});
+
 BlurView.propTypes = {
@@ -26,0 +30,0 @@ ...(ViewPropTypes || View.propTypes),

src/VibrancyView.ios.js

 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import { requireNativeComponent } from 'react-native';
+import {requireNativeComponent, StyleSheet} from 'react-native';
 
@@ -16,8 +16,3 @@ class VibrancyView extends Component {
         {...this.props}
-        style={[
-          {
-            backgroundColor: 'transparent',
-          },
-          this.props.style,
-        ]}
+        style={StyleSheet.compose(styles.transparent, this.props.style)}
       />
@@ -28,2 +23,6 @@ );
 
+const styles = StyleSheet.create({
+  transparent: { backgroundColor: 'transparent' },
+});
+
 VibrancyView.propTypes = {
@@ -30,0 +29,0 @@ blurType: PropTypes.string,

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 1 instance in 1 package

Improved metrics

Lines of code

454

0.22%

Number of lines in readme file

294

2.44%

Number of medium supply chain risk alerts

1

-97.22%

Worsened metrics

Total package byte prevSize

52656

-99.77%

Dev dependency count

8

14.29%

Number of package files

35

-64.29%

No dependency changes