@sanity/state-router - npm Package Compare versions

Comparing version 0.99.10 to 0.100.3

lib/components.js

@@ -52,11 +52,20 @@ 'use strict';
 
-var _withRouter = require('./components/withRouter');
+var _WithRouter = require('./components/WithRouter');
 
-Object.defineProperty(exports, 'withRouter', {
+Object.defineProperty(exports, 'WithRouter', {
   enumerable: true,
   get: function get() {
-    return _interopRequireDefault(_withRouter).default;
+    return _interopRequireDefault(_WithRouter).default;
   }
 });
 
+var _withRouterHOC = require('./components/withRouterHOC');
+
+Object.defineProperty(exports, 'withRouterHOC', {
+  enumerable: true,
+  get: function get() {
+    return _interopRequireDefault(_withRouterHOC).default;
+  }
+});
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

lib/components/IntentLink.js

@@ -32,6 +32,2 @@ 'use strict';
 /*:: import type {RouterProviderContext} from './types'*/
-/*:: type Props = {
-  intent: string,
-  params?: Object
-}*/
 
@@ -38,0 +34,0 @@ var IntentLink = function (_React$PureComponent) {

lib/components/Link.js

@@ -53,2 +53,7 @@ 'use strict';
     return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = Link.__proto__ || Object.getPrototypeOf(Link)).call.apply(_ref, [this].concat(args))), _this), _this.handleClick = function (event /*: SyntheticMouseEvent*/) /*: void*/ {
+
+      if (event.isDefaultPrevented()) {
+        return;
+      }
+
       var _this$props = _this.props,
@@ -55,0 +60,0 @@ onClick = _this$props.onClick,

lib/components/RouterProvider.js

@@ -13,2 +13,10 @@ 'use strict';
 
+var _nanoPubsub = require('nano-pubsub');
+
+var _nanoPubsub2 = _interopRequireDefault(_nanoPubsub);
+
+var _assignLazyGetter = require('./assignLazyGetter');
+
+var _assignLazyGetter2 = _interopRequireDefault(_assignLazyGetter);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -23,3 +31,9 @@
 /*:: import type {Router} from '../types'*/
-/*:: import type {RouterProviderContext, NavigateOptions} from './types'*/
+/*:: import type {RouterProviderContext, NavigateOptions, InternalRouter, RouterState} from './types'*/
+/*:: type Props = {
+  onNavigate: (nextPath: string) => void,
+  router: Router,
+  state: RouterState,
+  children?: Element<*>
+}*/
 
@@ -29,14 +43,8 @@ var RouterProvider = function (_React$Component) {
 
-  function RouterProvider() {
-    var _ref;
-
-    var _temp, _this, _ret;
-
+  function RouterProvider(props /*: Props*/) {
     _classCallCheck(this, RouterProvider);
 
-    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
+    var _this = _possibleConstructorReturn(this, (RouterProvider.__proto__ || Object.getPrototypeOf(RouterProvider)).call(this));
 
-    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = RouterProvider.__proto__ || Object.getPrototypeOf(RouterProvider)).call.apply(_ref, [this].concat(args))), _this), _this.navigateUrl = function (url /*: string*/) /*: void*/ {
+    _this.navigateUrl = function (url /*: string*/) /*: void*/ {
       var options /*: NavigateOptions*/ = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
@@ -46,11 +54,32 @@ var onNavigate = _this.props.onNavigate;
       onNavigate(url, options);
-    }, _this.navigateState = function (nextState /*: Object*/) /*: void*/ {
+    };
+
+    _this.navigateState = function (nextState /*: Object*/) /*: void*/ {
       var options /*: NavigateOptions*/ = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
 
       _this.navigateUrl(_this.resolvePathFromState(nextState), options);
-    }, _this.resolvePathFromState = function (state /*: Object*/) /*: string*/ {
+    };
+
+    _this.getState = function () {
+      return _this._state;
+    };
+
+    _this.resolvePathFromState = function (state /*: Object*/) /*: string*/ {
       return _this.props.router.encode(state);
-    }, _this.resolveIntentLink = function (intent /*: string*/, params /*: Object*/) /*: string*/ {
+    };
+
+    _this.resolveIntentLink = function (intent /*: string*/, params /*: Object*/) /*: string*/ {
       return _this.props.router.encode({ intent: intent, params: params });
-    }, _temp), _possibleConstructorReturn(_this, _ret);
+    };
+
+    _this._state = props.state;
+    _this.__internalRouter = {
+      resolvePathFromState: _this.resolvePathFromState,
+      resolveIntentLink: _this.resolveIntentLink,
+      navigateUrl: _this.navigateUrl,
+      navigate: _this.navigateState,
+      getState: _this.getState,
+      channel: (0, _nanoPubsub2.default)()
+    };
+    return _this;
   }
@@ -61,17 +90,36 @@
     value: function getChildContext() /*: RouterProviderContext*/ {
-      var state = this.props.state;
+      var _this2 = this;
 
-      return {
-        __internalRouter: {
-          resolvePathFromState: this.resolvePathFromState,
-          resolveIntentLink: this.resolveIntentLink,
-          navigateUrl: this.navigateUrl
-        },
-        router: {
-          navigate: this.navigateState,
-          state: state
-        }
+      var _warn = function warn() {
+        // eslint-disable-next-line no-console
+        console.error(new Error('Reading "router" from context is deprecated. Use the WithRouter enhancer/HOC, or the <WithRouter> component instead.'));
+        _warn = function warn() {};
       };
+      var deprecatedChildRouter = {};
+      (0, _assignLazyGetter2.default)(deprecatedChildRouter, 'state', function () {
+        _warn();
+        return _this2.getState();
+      });
+      (0, _assignLazyGetter2.default)(deprecatedChildRouter, 'navigate', function () {
+        _warn();
+        _this2.getState();
+      });
+
+      // todo: just return childContext with __internalRouter, remove the deprecatedChidlRouter eventually
+      var childContext = {
+        __internalRouter: this.__internalRouter,
+        router: deprecatedChildRouter
+      };
+
+      return childContext;
     }
   }, {
+    key: 'componentWillReceiveProps',
+    value: function componentWillReceiveProps(nextProps /*: Props*/) {
+      if (this.props.state !== nextProps.state) {
+        this._state = nextProps.state;
+        this.__internalRouter.channel.publish(nextProps.state);
+      }
+    }
+  }, {
     key: 'render',
@@ -78,0 +126,0 @@ value: function render() {

lib/components/RouteScope.js

@@ -19,2 +19,6 @@ 'use strict';
 
+var _assignLazyGetter = require('./assignLazyGetter');
+
+var _assignLazyGetter2 = _interopRequireDefault(_assignLazyGetter);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,3 +34,3 @@
 
-/*:: import type {RouterProviderContext, NavigateOptions, InternalRouter, ContextRouter} from './types'*/
+/*:: import type {RouterProviderContext, NavigateOptions, InternalRouter} from './types'*/
 
@@ -38,28 +42,25 @@
 
+/*:: type Props = {
+  scope: string,
+  children: Element<*>
+}*/
+
 var RouteScope = function (_React$Component) {
   _inherits(RouteScope, _React$Component);
 
-  function RouteScope() {
-    var _ref;
-
-    var _temp, _this, _ret;
-
+  function RouteScope(props /*: Props*/, context /*: RouterProviderContext*/) {
     _classCallCheck(this, RouteScope);
 
-    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
+    var _this = _possibleConstructorReturn(this, (RouteScope.__proto__ || Object.getPrototypeOf(RouteScope)).call(this));
 
-    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = RouteScope.__proto__ || Object.getPrototypeOf(RouteScope)).call.apply(_ref, [this].concat(args))), _this), _this.resolvePathFromState = function (nextState /*: Object*/) /*: string*/ {
-      var context = _this.context;
-      var scope = _this.props.scope;
+    _initialiseProps.call(_this);
 
-      var nextStateScoped /*: Object*/ = (0, _isEmpty2.default)(nextState) ? {} : addScope(context.router.state, scope, nextState);
+    var parentInternalRouter = context.__internalRouter;
 
-      return context.__internalRouter.resolvePathFromState(nextStateScoped);
-    }, _this.navigate = function (nextState /*: Object*/, options /*: NavigateOptions*/) /*: void*/ {
-      var scope = _this.props.scope;
-      var router = _this.context.router;
-      router.navigate(addScope(router.state, scope, nextState), options);
-    }, _temp), _possibleConstructorReturn(_this, _ret);
+    _this.__internalRouter = _extends({}, parentInternalRouter, {
+      resolvePathFromState: _this.resolvePathFromState,
+      navigate: _this.navigate,
+      getState: _this.getScopedState
+    });
+    return _this;
   }
@@ -70,18 +71,26 @@
     value: function getChildContext() /*: RouterProviderContext*/ {
-      var scope = this.props.scope;
+      var _this2 = this;
 
-      var internalRouter /*: InternalRouter*/ = this.context.__internalRouter;
-      var router /*: ContextRouter*/ = this.context.router;
+      var _warn = function warn() {
+        // eslint-disable-next-line no-console
+        console.error(new Error('Reading "router" from context is deprecated. Use the WithRouter enhancer/HOC, or the <WithRouter> component instead.'));
+        _warn = function warn() {};
+      };
+      var deprecatedChildRouter = {};
+      (0, _assignLazyGetter2.default)(deprecatedChildRouter, 'state', function () {
+        _warn();
+        return _this2.getScopedState();
+      });
+      (0, _assignLazyGetter2.default)(deprecatedChildRouter, 'navigate', function () {
+        _warn();
+        _this2.getScopedState();
+      });
 
-      return {
-        __internalRouter: {
-          resolvePathFromState: this.resolvePathFromState,
-          resolveIntentLink: internalRouter.resolveIntentLink,
-          navigateUrl: internalRouter.navigateUrl
-        },
-        router: {
-          navigate: this.navigate,
-          state: router.state[scope]
-        }
+      // todo: just return childContext with __internalRouter, remove the deprecatedChidlRouter eventually
+      var childContext = {
+        __internalRouter: this.__internalRouter,
+        router: deprecatedChildRouter
       };
+
+      return childContext;
     }
@@ -102,2 +111,29 @@ }, {
 };
+
+var _initialiseProps = function _initialiseProps() {
+  var _this3 = this;
+
+  this.getScopedState = function () {
+    var scope = _this3.props.scope;
+
+    var parentInternalRouter = _this3.context.__internalRouter;
+    return parentInternalRouter.getState()[scope];
+  };
+
+  this.resolvePathFromState = function (nextState /*: Object*/) /*: string*/ {
+    var parentInternalRouter = _this3.context.__internalRouter;
+    var scope = _this3.props.scope;
+
+    var nextStateScoped /*: Object*/ = (0, _isEmpty2.default)(nextState) ? {} : addScope(parentInternalRouter.getState(), scope, nextState);
+
+    return parentInternalRouter.resolvePathFromState(nextStateScoped);
+  };
+
+  this.navigate = function (nextState /*: Object*/, options /*: NavigateOptions*/) /*: void*/ {
+    var parentInternalRouter = _this3.context.__internalRouter;
+    var nextScopedState = addScope(parentInternalRouter.getState(), _this3.props.scope, nextState);
+    parentInternalRouter.navigate(nextScopedState, options);
+  };
+};
+
 exports.default = RouteScope;

lib/components/types.js

@@ -6,6 +6,15 @@ "use strict";
 }*/
+/*:: type Channel<T> = () => {
+  subscribe: (T) => () => void,
+  get(): T,
+  publish(T): void
+}*/
+/*:: export type RouterState = Object*/
 /*:: export type InternalRouter = {
-  resolvePathFromState: (nextState : Object) => string,
+  resolvePathFromState: (nextState : RouterState) => string,
   resolveIntentLink: (intent : string, params? : Object) => string,
-  navigateUrl: (url : string, options? : NavigateOptions) => void
+  navigateUrl: (url : string, options? : NavigateOptions) => void,
+  navigate: (nextState : RouterState, options? : NavigateOptions) => void,
+  getState: () => RouterState,
+  channel: Channel<RouterState>
 }*/
@@ -12,0 +21,0 @@ /*:: export type ContextRouter = {

package.json

 {
   "name": "@sanity/state-router",
-  "version": "0.99.10",
+  "version": "0.100.3",
   "description": "A path pattern => state object bidirectional mapper",
@@ -23,3 +23,4 @@ "main": "lib/index.js",
   "dependencies": {
-    "lodash": "^4.17.4"
+    "lodash": "^4.17.4",
+    "nano-pubsub": "^1.0.1"
   },
@@ -26,0 +27,0 @@ "devDependencies": {

src/components.js

@@ -6,2 +6,3 @@ export {default as RouterProvider} from './components/RouterProvider'
 export {default as RouteScope} from './components/RouteScope'
-export {default as withRouter} from './components/withRouter'
+export {default as WithRouter} from './components/WithRouter'
+export {default as withRouterHOC} from './components/withRouterHOC'

src/components/IntentLink.js

 // @flow
-import React, {PropTypes} from 'react'
+import React, {PropTypes, Element} from 'react'
 import omit from 'lodash/omit'
@@ -7,9 +7,9 @@ import Link from './Link'
 
-type Props = {
-  intent: string,
-  params?: Object
-}
+export default class IntentLink extends React.PureComponent {
+  props: {
+    intent: string,
+    params?: Object,
+    children: Element<*>
+  };
 
-export default class IntentLink extends React.PureComponent {
-  props: Props;
   context: RouterProviderContext
@@ -16,0 +16,0 @@

src/components/Link.js

@@ -34,2 +34,6 @@ // @flow
 
+    if (event.isDefaultPrevented()) {
+      return
+    }
+
     const {onClick, href, target, replace} = this.props
@@ -36,0 +40,0 @@

src/components/RouterProvider.js

 // @flow
 import React, {PropTypes, Element} from 'react'
 import type {Router} from '../types'
-import type {RouterProviderContext, NavigateOptions} from './types'
+import type {RouterProviderContext, NavigateOptions, InternalRouter, RouterState} from './types'
+import pubsub from 'nano-pubsub'
+import assignLazyGetter from './assignLazyGetter'
 
+type Props = {
+  onNavigate: (nextPath: string) => void,
+  router: Router,
+  state: RouterState,
+  children?: Element<*>
+}
+
 export default class RouterProvider extends React.Component {
-  props: {
-    onNavigate: (nextPath: string) => void,
-    router: Router,
-    state: Object,
-    children?: Element<*>
-  }
+  props: Props
 
@@ -19,2 +23,17 @@ static childContextTypes = {
 
+  __internalRouter: InternalRouter
+  _state: RouterState
+
+  constructor(props : Props) {
+    super()
+    this._state = props.state
+    this.__internalRouter = {
+      resolvePathFromState: this.resolvePathFromState,
+      resolveIntentLink: this.resolveIntentLink,
+      navigateUrl: this.navigateUrl,
+      navigate: this.navigateState,
+      getState: this.getState,
+      channel: pubsub()
+    }
+  }
   navigateUrl = (url : string, options : NavigateOptions = {}) : void => {
@@ -29,2 +48,4 @@ const {onNavigate} = this.props
 
+  getState = () => this._state
+
   resolvePathFromState = (state : Object) : string => {
@@ -39,16 +60,36 @@ return this.props.router.encode(state)
   getChildContext() : RouterProviderContext {
-    const {state} = this.props
-    return {
-      __internalRouter: {
-        resolvePathFromState: this.resolvePathFromState,
-        resolveIntentLink: this.resolveIntentLink,
-        navigateUrl: this.navigateUrl
-      },
-      router: {
-        navigate: this.navigateState,
-        state: state
-      }
+
+    let warn = () => {
+      // eslint-disable-next-line no-console
+      console.error(new Error(
+        'Reading "router" from context is deprecated. Use the WithRouter enhancer/HOC, or the <WithRouter> component instead.'
+      ))
+      warn = () => {}
     }
+    const deprecatedChildRouter = {}
+    assignLazyGetter(deprecatedChildRouter, 'state', () => {
+      warn()
+      return this.getState()
+    })
+    assignLazyGetter(deprecatedChildRouter, 'navigate', () => {
+      warn()
+      this.getState()
+    })
+
+    // todo: just return childContext with __internalRouter, remove the deprecatedChidlRouter eventually
+    const childContext = {
+      __internalRouter: this.__internalRouter,
+      router: deprecatedChildRouter
+    }
+
+    return childContext
   }
 
+  componentWillReceiveProps(nextProps : Props) {
+    if (this.props.state !== nextProps.state) {
+      this._state = nextProps.state
+      this.__internalRouter.channel.publish(nextProps.state)
+    }
+  }
+
   render() {
@@ -55,0 +96,0 @@ return this.props.children

src/components/RouteScope.js

 // @flow
 import React, {PropTypes, Element} from 'react'
 import isEmpty from '../utils/isEmpty'
+import assignLazyGetter from './assignLazyGetter'
 
-import type {RouterProviderContext, NavigateOptions, InternalRouter, ContextRouter} from './types'
+import type {RouterProviderContext, NavigateOptions, InternalRouter} from './types'
 
@@ -13,8 +14,11 @@ function addScope(routerState : Object, scope : string, scopedState : Object) {
 }
+
+type Props = {
+  scope: string,
+  children: Element<*>
+}
+
 export default class RouteScope extends React.Component {
-  props: {
-    scope: string,
-    children: Element<*>
-  }
-  context: RouterProviderContext
+  props: Props
+  __internalRouter: InternalRouter
 
@@ -25,22 +29,51 @@ static childContextTypes = RouteScope.contextTypes = {
   }
+
+  constructor(props : Props, context : RouterProviderContext) {
+    super()
+    const parentInternalRouter = context.__internalRouter
+
+    this.__internalRouter = {
+      ...parentInternalRouter,
+      resolvePathFromState: this.resolvePathFromState,
+      navigate: this.navigate,
+      getState: this.getScopedState
+    }
+  }
+
   getChildContext() : RouterProviderContext {
-    const {scope} = this.props
-    const internalRouter: InternalRouter = this.context.__internalRouter
-    const router: ContextRouter = this.context.router
 
-    return {
-      __internalRouter: {
-        resolvePathFromState: this.resolvePathFromState,
-        resolveIntentLink: internalRouter.resolveIntentLink,
-        navigateUrl: internalRouter.navigateUrl
-      },
-      router: {
-        navigate: this.navigate,
-        state: router.state[scope]
-      }
+    let warn = () => {
+      // eslint-disable-next-line no-console
+      console.error(new Error(
+        'Reading "router" from context is deprecated. Use the WithRouter enhancer/HOC, or the <WithRouter> component instead.'
+      ))
+      warn = () => {}
     }
+    const deprecatedChildRouter = {}
+    assignLazyGetter(deprecatedChildRouter, 'state', () => {
+      warn()
+      return this.getScopedState()
+    })
+    assignLazyGetter(deprecatedChildRouter, 'navigate', () => {
+      warn()
+      this.getScopedState()
+    })
+
+    // todo: just return childContext with __internalRouter, remove the deprecatedChidlRouter eventually
+    const childContext = {
+      __internalRouter: this.__internalRouter,
+      router: deprecatedChildRouter
+    }
+
+    return childContext
   }
 
+  getScopedState = () => {
+    const {scope} = this.props
+    const parentInternalRouter = this.context.__internalRouter
+    return parentInternalRouter.getState()[scope]
+  }
+
   resolvePathFromState = (nextState: Object): string => {
-    const context = this.context
+    const parentInternalRouter = this.context.__internalRouter
     const scope = this.props.scope
@@ -50,11 +83,11 @@
       ? {}
-      : addScope(context.router.state, scope, nextState)
+      : addScope(parentInternalRouter.getState(), scope, nextState)
 
-    return context.__internalRouter.resolvePathFromState(nextStateScoped)
+    return parentInternalRouter.resolvePathFromState(nextStateScoped)
   }
 
   navigate = (nextState: Object, options?: NavigateOptions) : void => {
-    const scope = this.props.scope
-    const router = this.context.router
-    router.navigate(addScope(router.state, scope, nextState), options)
+    const parentInternalRouter = this.context.__internalRouter
+    const nextScopedState = addScope(parentInternalRouter.getState(), this.props.scope, nextState)
+    parentInternalRouter.navigate(nextScopedState, options)
   }
@@ -61,0 +94,0 @@

src/components/types.js

@@ -7,6 +7,17 @@ // @flow
 
+type Channel<T> = () => {
+  subscribe: (T) => () => void,
+  get(): T,
+  publish(T): void
+}
+
+export type RouterState = Object
+
 export type InternalRouter = {
-  resolvePathFromState: (nextState : Object) => string,
+  resolvePathFromState: (nextState : RouterState) => string,
   resolveIntentLink: (intent : string, params? : Object) => string,
-  navigateUrl: (url : string, options? : NavigateOptions) => void
+  navigateUrl: (url : string, options? : NavigateOptions) => void,
+  navigate: (nextState : RouterState, options? : NavigateOptions) => void,
+  getState: () => RouterState,
+  channel: Channel<RouterState>
 }
@@ -13,0 +24,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

233882

increased by3.91%

Number of package files

76

increased by5.56%

Lines of code

2498

increased by11.27%

Worsened metrics

Dependency count

2

increased by100%

Dependency changes

• + Addednano-pubsub@^1.0.1

• + Addednano-pubsub@1.0.2(transitive)