@shiftboard/responsive-redux

provides helpers for getting responsive info into redux store

Usage no npm install needed!

<script type="module">
  import shiftboardResponsiveRedux from 'https://cdn.skypack.dev/@shiftboard/responsive-redux';
</script>

README

Responsive Redux Module


wercker status

Install

# Using Git: 
yarn add git+ssh://git@github.com:shiftboard/responsive-redux.git

# Using private registry
yarn add @shiftboard/responsive-redux

Usage

Then import responsiveHandler into project wherever your redux store is (probably routes.js):

import {responsiveHandler} from '@shiftboard/responsive-redux'

The responsiveHandler function attaches an event listener to the window object. When the browser is resized, the handler dispatches the viewport width (found using innerWidth) to the redux store. When calling the function, you must pass in the redux store as a parameter:

import store from 'app/redux/store'
responsiveHandler(store)

Finally, import the responsiveReducer function wherever your combineReducers fuction call is:

import {responsiveReducer} from '@shiftboard/responsive-redux'
const reducer = combineReducers({
    screenSize: responsiveReducer
})