fluxible - npm Package Compare versions

Comparing version 0.1.5 to 0.2.0

index.js

@@ -5,4 +5,3 @@ /**
  */
-module.exports = require('./lib/FluxibleApp');
-module.exports.FluxibleContext = require('./lib/FluxibleContext');
-module.exports.StoreMixin = require('./mixins/StoreMixin');
+module.exports = require('./lib/Fluxible');
+module.exports.Mixin = require('./mixins/FluxibleMixin');

lib/FluxibleContext.js

@@ -7,3 +7,3 @@ /**
 
-var debug = require('debug')('FluxibleApp:Context');
+var debug = require('debug')('Fluxible:Context');
 var objectAssign = require('object-assign');
@@ -16,3 +16,3 @@ require('setimmediate');
  * @param {Object} options
- * @param {FluxibleApp} options.app The FluxibleApp instance used to create the context
+ * @param {Fluxible} options.app The Fluxible instance used to create the context
  * @constructor
@@ -19,0 +19,0 @@ */

package.json

 {
   "name": "fluxible",
-  "version": "0.1.5",
+  "version": "0.2.0",
   "description": "A pluggable container for isomorphic flux applications",
@@ -22,2 +22,5 @@ "main": "index.js",
   },
+  "peerDependencies": {
+    "react": "^0.12.x"
+  },
   "devDependencies": {
@@ -24,0 +27,0 @@ "chai": "^1.10.0",

README.md

@@ -8,2 +8,3 @@ # Fluxible
 [![Coverage Status](https://coveralls.io/repos/yahoo/fluxible/badge.png?branch=master)](https://coveralls.io/r/yahoo/fluxible?branch=master)
+[![Gitter chat](https://badges.gitter.im/gitterHQ/gitter.png)](https://gitter.im/yahoo/fluxible)
 
@@ -20,4 +21,4 @@ Pluggable container for isomorphic [flux](https://github.com/facebook/flux) applications that provides interfaces that are common throughout the Flux architecture and restricts usage of these APIs to only the parts that need them to enforce the unidirectional flow.
 var AppComponent = require('./components/Application.jsx'); // Top level React component
-var FluxibleApp = require('fluxible');
-var app = new FluxibleApp({
+var Fluxible = require('fluxible');
+var app = new Fluxible({
     appComponent: AppComponent // optional top level component
@@ -71,4 +72,4 @@ });
 ```js
-var FluxibleApp = require('fluxible');
-var app = new FluxibleApp();
+var Fluxible = require('fluxible');
+var app = new Fluxible();
 
@@ -124,13 +125,29 @@ app.plug({
 
-## Store Mixin
+## Mixin
 
-Fluxible also provides a React component mixin that can be used to statically list store dependencies and listen to them automatically in componentDidMount. This is done by adding a static property `storeListeners` in your component.
+The mixin (accessible via `require('fluxible').Mixin`) uses React's context to provide access to the component context from within a component. This prevents you from having to pass the context to every component via props. This requires that you pass the component context as the context to React:
 
+```js
+var FluxibleMixin = require('fluxible').Mixin;
+var Component = React.createClass({
+    mixins: [FluxibleMixin],
+    getInitialState: function () {
+        return this.getStore(FooStore).getState();
+    }
+});
+
+React.withContext(context.getComponentContext(), function () {
+    var html = React.renderToString(<Component />);
+});
+```
+
+The mixin can also be used to statically list store dependencies and listen to them automatically in componentDidMount. This is done by adding a static property `storeListeners` in your component.
+
 You can do this with an array, which will default all store listeners to call the `onChange` method:
 
 ```js
-var StoreMixin = require('fluxible').StoreMixin;
+var FluxibleMixin = require('fluxible').Mixin;
 var MockStore = require('./stores/MockStore'); // Your store
 var Component = React.createClass({
-    mixins: [StoreMixin],
+    mixins: [FluxibleMixin],
     statics: {
@@ -148,6 +165,6 @@ storeListeners: [MockStore]
 ```js
-var StoreMixin = require('fluxible').StoreMixin;
+var FluxibleMixin = require('fluxible').Mixin;
 var MockStore = require('./stores/MockStore'); // Your store
 var Component = React.createClass({
-    mixins: [StoreMixin],
+    mixins: [FluxibleMixin],
     statics: {
@@ -171,5 +188,5 @@ storeListeners: {
 ## API
+[//]: # (API_START)
+### Fluxible
 
-### FluxibleApp
-
 Instantiated once across all requests, this holds settings and interfaces that are used across all requests/sessions.
@@ -206,7 +223,7 @@
 
-Returns a serializable object containing the state of the FluxibleApp and passed FluxibleContext instances. This is useful for serializing the state of the application to send it to the client. This will also call any plugins which contain a dehydrate method.
+Returns a serializable object containing the state of the Fluxible and passed FluxibleContext instances. This is useful for serializing the state of the application to send it to the client. This will also call any plugins which contain a dehydrate method.
 
 #### rehydrate(state)
 
-Takes an object representing the state of the FluxibleApp and FluxibleContext instances (usually retrieved from dehydrate) to rehydrate them to the same state as they were on the server. This will also call any plugins which contain a rehydrate method.
+Takes an object representing the state of the Fluxible and FluxibleContext instances (usually retrieved from dehydrate) to rehydrate them to the same state as they were on the server. This will also call any plugins which contain a rehydrate method.
 
@@ -282,2 +299,4 @@ ### FluxibleContext
 
+[//]: # (API_STOP)
+
 ## License
@@ -284,0 +303,0 @@

New 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

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

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

Improved metrics

Total package byte prevSize

91010

increased by17.92%

Lines of code

639

increased by2.73%

Number of lines in readme file

300

increased by6.76%

Number of medium supply chain risk alerts

1

decreased by-50%

Worsened metrics

Dependency count

6

increased by20%

No dependency changes