react-notification - npm Package Compare versions

Comparing version 6.8.2 to 6.8.3

docs/guides/props.md

@@ -1,2 +0,2 @@
-### Props
+## Props
 
@@ -7,14 +7,14 @@ ### For single notification component
 |-----------------|-------------------------|-------------------------------------------------------------|-----------|----------------------------|
+| action          | string                  | The name of the action, e.g., "close" or "undo"             |           |                            |
+| actionStyle     | object                  | Custom action styles                                        |           |                            |
+| activeBarStyle  | object                  | Custom snackbar styles when the bar is active               |           |                            |
+| activeClassName | string                  | Custom class to apply to the top-level component when active|           | `'notification-bar-active'`|
+| barStyle        | object                  | Custom snackbar styles                                      |           |                            |
+| className       | string                  | Custom class to apply to the top-level component            |           |                            |
+| dismissAfter    | number or boolean       | Timeout for onDismiss event                                 |           | `2000`                     |
 | isActive        | boolean                 | If true, the notification is visible                        | true      | `false`                    |
 | message         | string or React element | The message or component for the notification               | true      |                            |
+| style           | boolean                 | Setting this prop to `false` will disable all inline styles |           |                            |
 | title           | string                  | The title for the notification                              |           |                            |
-| action          | string                  | The name of the action, e.g., "close" or "undo"             |           |                            |
-| style           | boolean                 | Setting this prop to `false` will disable all inline styles |           |                            |
-| barStyle        | object                  | Custom snackbar styles                                      |           |                            |
-| activeBarStyle  | object                  | Custom snackbar styles when the bar is active               |           |                            |
-| actionStyle     | object                  | Custom action styles                                        |           |                            |
 | titleStyle      | object                  | Custom title styles                                         |           |                            |
-| className       | string                  | Custom class to apply to the top-level component            |           |                            |
-| activeClassName | string                  | Custom class to apply to the top-level component when active|           | `'notification-bar-active'`|
-| dismissAfter    | number or false         | Timeout for onDismiss event                                 |           | `2000`                     |
 
@@ -25,8 +25,8 @@ The `style` prop useful if you are not using React inline styles and would like to use CSS instead. See [styles](styles.md) for more.
 
-| Name                  | Type  | Description                                              | Required  | Default  |
-|-----------------------|-------|----------------------------------------------------------|---------- |----------|
-| notifications         | array | Array of notifications to render                         | true      |          |
-| dismissInOrder        | bool  | If false, notification dismiss timers start immediately  | false     | true     |
-| barStyleFactory       | func  | create the style of the notification                     | false     | fn       |
-| activeBarStyleFactory | func  | create the style of the active notification              | false     | fn       |
-| actionStyleFactory    | func  | create the style of the actions                          | false     | fn       |
+| Name                  | Type    | Description                                              | Required  | Default  |
+|-----------------------|---------|----------------------------------------------------------|-----------|----------|
+| actionStyleFactory    | func    | Create the style of the actions                          | false     | fn       |
+| activeBarStyleFactory | func    | Create the style of the active notification              | false     | fn       |
+| barStyleFactory       | func    | Create the style of the notification                     | false     | fn       |
+| dismissInOrder        | boolean | If false, notification dismiss timers start immediately  | false     | true     |
+| notifications         | array   | Array of notifications to render                         | true      |          |

docs/guides/styles.md

 ## Styles
 
-This component uses basic inline CSS to style the position and visibility of the notification.I would suggest reading the usage guidelines for [snackbars](http://www.google.com/design/spec/components/snackbars-toasts.html) before making any changes.
+This component uses basic inline styles to style the position and visibility of the notification. I would suggest reading the usage guidelines for [snackbars](http://www.google.com/design/spec/components/snackbars-toasts.html) before making any changes.
 
@@ -38,3 +38,3 @@ You have two options for adding additional styles:
 stack. The default function adds the `bottom` style property to correctly
-position of the notification in a stack.
+position the notification in a stack.
 
@@ -41,0 +41,0 @@ ```js

docs/introduction.md

 ## Introduction
 
-First, install the component via npm: `npm install react-notification`.
-
-Note the component uses `Object.assign`. If you are compiling with Babel, you should include the Babel Polyfill in your build to ensure the method works.
-
 ### For single notification component
@@ -65,8 +61,1 @@
 ```
-
-## Sponsor
-
-**Individual**: If you like this code and you're interested in buying me a drink, I have a [Gratipay](https://gratipay.com/~pburtchaell/) (recurring) or [Venmo](https://venmo.com/pburtchaell) (one time). I greatly appreciate your support and I'm grateful to be a part of the open source and GitHub communities.
-
-**Company**: To help cover the cost of my time spent maintaining open source software projects, I'm looking for a small sponsor. If your company is interested, [email me](mailto:[e-mail]) and we can chat! 
-

index.d.ts

@@ -7,3 +7,13 @@ import { Component, ReactElement } from 'react';
 
-interface NotificationProps {
+interface OnClickNotificationProps {
+  /**
+   * Callback function to run when the action is clicked.
+   * @param notification  Notification currently being clicked
+   * @param deactivate    Function that can be called to set the notification to inactive.
+   *                      Used to activate notification exit animation on click.
+   */
+  onClick?(notification: NotificationProps, deactivate: () => void): void;
+}
+
+interface NotificationProps extends OnClickNotificationProps {
   /** The name of the action, e.g., "close" or "undo". */
@@ -42,10 +52,4 @@ action?: string;
   titleStyle?: object;
+  
   /**
-   * Callback function to run when the action is clicked.
-   * @param notification  Notification currently being clicked
-   * @param deactivate    Function that can be called to set the notification to inactive.
-   *                      Used to activate notification exit animation on click.
-   */
-  onClick?(notification: NotificationProps, deactivate: () => void): void;
-  /**
    * Callback function to run when dismissAfter timer runs out
@@ -57,3 +61,3 @@ * @param notification  Notification currently being dismissed.
 
-interface NotificationStackProps {
+interface NotificationStackProps extends OnClickNotificationProps {
   /** Create the style of the actions. */
@@ -60,0 +64,0 @@ actionStyleFactory?: StyleFactoryFn;

package.json

 {
   "name": "react-notification",
-  "version": "6.8.2",
+  "version": "6.8.3",
   "description": "Snackbar style notification component for React",
@@ -14,2 +14,4 @@ "main": "dist/index.js",
     "lint": "node_modules/.bin/eslint src/**/*.js test/**/*.js",
+    "postinstall": "npm run generate-lockfile",
+    "generate-lockfile": "rm -rf package-lock.json && `npm bin`/synp --source-file ./yarn.lock",
     "start": "node examples/server.js"
@@ -83,4 +85,5 @@ },
   "dependencies": {
-    "prop-types": "^15.5.10"
+    "prop-types": "^15.5.10",
+    "synp": "^1.2.1"
   }
 }

README.md

 # React Notification
+[![Build Status](https://travis-ci.org/pburtchaell/react-notification.svg)](https://travis-ci.org/pburtchaell/react-notification) [![npm downloads](https://img.shields.io/npm/dm/react-notification.svg?style=flat)](http://badge.fury.io/js/react-notification)
 
-[![npm version](https://badge.fury.io/js/react-notification.svg)](http://badge.fury.io/js/react-notification) [![Build Status](https://travis-ci.org/pburtchaell/react-notification.svg)](https://travis-ci.org/pburtchaell/react-notification) [![npm downloads](https://img.shields.io/npm/dm/react-notification.svg?style=flat)](http://badge.fury.io/js/react-notification)
+React Notification provides snackbar notification messages and notification stacks. The default visual style and interaction follows [Material Design guidelines for snackbars](http://www.google.com/design/spec/components/snackbars-toasts.html#snackbars-toasts-usage) and can be fully customized.
 
-![](https://raw.githubusercontent.com/pburtchaell/react-notification/master/docs/example-b.gif)
-
-React Notification is a component designed to provide snackbar notification messages and notification stacks. The default visual style and interaction follows [Material Design guidelines for snackbars](http://www.google.com/design/spec/components/snackbars-toasts.html#snackbars-toasts-usage), but it can be fully customized.
-
-## Docs and Help
-
+## Documentation and Help
 - [Guides](/docs/guides/)
 - [Introduction](/docs/introduction.md)
 - [Examples](/examples)
+
+## Releases
 - [Releases](https://github.com/pburtchaell/react-notification/releases)
 - [Upgrading versions](/UPGRADING.md)
 
----
-Copyright (c) 2015 Patrick Burtchaell. [Licensed with The MIT License (MIT)](https://raw.githubusercontent.com/pburtchaell/react-notification/master/LICENSE). [Gratipay](https://gratipay.com/~pburtchaell/).
+## Maintainers
+- [Patrick Burtchaell](http://github.com/pburtchaell)
+- [Berkeley Martinez](https://github.com/BerkeleyTrue)
+- [Joey Figaro](https://github.com/joeyfigaro)
+
+## License
+Copyright (c) 2015-2018 Patrick Burtchaell. 
+
+[Licensed with The MIT License (MIT)](https://raw.githubusercontent.com/pburtchaell/react-notification/master/LICENSE).

New alerts

Install scripts

Supply chain risk

Install scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts.

Found 1 instance in 1 package

Deprecated

Maintenance

The maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.

Found 1 instance in 1 package

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Number of package files

27

28.57%

Lines of code

1265

175.6%

Number of lines in readme file

24

26.32%

Number of medium supply chain risk alerts

0

-100%

Worsened metrics

Total package byte prevSize

234043

-55.53%

Dependency count

3

50%

Number of medium maintenance alerts

1

Infinity%

Number of high supply chain risk alerts

1

Infinity%

Dependency changes

• + Added

  synp@^1.2.1

• + Added

  @nodelib/fs.scandir@2.1.5
  (transitive)

• + Added

  @nodelib/fs.stat@2.0.5
  (transitive)

• + Added

  @nodelib/fs.walk@1.2.8
  (transitive)

• + Added

  @yarnpkg/lockfile@1.1.0
  (transitive)

• + Added

  braces@3.0.3
  (transitive)

• + Added

  colors@1.4.0
  (transitive)

• + Added

  commander@2.20.37.2.0
  (transitive)

• + Added

  eol@0.10.0
  (transitive)

• + Added

  fast-glob@3.3.3
  (transitive)

• + Added

  fastq@1.19.1
  (transitive)

• + Added

  fill-range@7.1.1
  (transitive)

• + Added

  glob-parent@5.1.2
  (transitive)

• + Added

  is-extglob@2.1.1
  (transitive)

• + Added

  is-glob@4.0.3
  (transitive)

• + Added

  is-number@7.0.0
  (transitive)

• + Added

  lodash@4.17.21
  (transitive)

• + Added

  merge2@1.4.1
  (transitive)

• + Added

  micromatch@4.0.8
  (transitive)

• + Added

  nmtree@1.0.6
  (transitive)

• + Added

  picomatch@2.3.1
  (transitive)

• + Added

  queue-microtask@1.2.3
  (transitive)

• + Added

  reusify@1.1.0
  (transitive)

• + Added

  run-parallel@1.2.0
  (transitive)

• + Added

  semver@7.7.2
  (transitive)

• + Added

  sort-object-keys@1.1.3
  (transitive)

• + Added

  synp@1.9.14
  (transitive)

• + Added

  to-regex-range@5.0.1
  (transitive)