Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
storeon - npm Package Compare versions
Comparing version 0.5.0 to 0.6.0
| # Change Log | ||
| This project adheres to [Semantic Versioning](http://semver.org/). | ||
| ## 0.6 | ||
| * Allow to pass DevTools options. | ||
| * Reduce size (by Hadeeb Farhan). | ||
| * Improve error messages. | ||
| * Fix documentation (by Vadim Boltach and Kyle Mills). | ||
| ## 0.5 | ||
@@ -5,0 +11,0 @@ * Add `useStoreon` hook. |
@@ -1,53 +0,77 @@ | ||
| function devtools (store) { | ||
| var extension = | ||
| window.__REDUX_DEVTOOLS_EXTENSION__ || | ||
| window.top.__REDUX_DEVTOOLS_EXTENSION__ | ||
| if (!extension) { | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| console.warn( | ||
| 'Please install Redux devtools extension\n' + | ||
| 'http://extension.remotedev.io/' | ||
| ) | ||
| /** | ||
| * Create Redux DevTools module for Storeon. | ||
| * | ||
| * @param {object} options Redux DevTools option. | ||
| * @returns {devtools} Redux DevTools module | ||
| * | ||
| * @example | ||
| * const store = createStore([ | ||
| * process.env.NODE_ENV !== 'production' && require('storeon/devtools')() | ||
| * ]) | ||
| * | ||
| * @name devtools | ||
| * @function | ||
| */ | ||
| function devtools (options) { | ||
| function module (store) { | ||
| var extension = | ||
| window.__REDUX_DEVTOOLS_EXTENSION__ || | ||
| window.top.__REDUX_DEVTOOLS_EXTENSION__ | ||
| if (!extension) { | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| console.warn( | ||
| 'Please install Redux devtools extension\n' + | ||
| 'http://extension.remotedev.io/' | ||
| ) | ||
| } | ||
| return | ||
| } | ||
| return | ||
| } | ||
| var prevMessage = '' | ||
| var ReduxTool = extension.connect() | ||
| var ReduxTool = extension.connect(options) | ||
| store.on('@init', function () { | ||
| ReduxTool.subscribe(function (message) { | ||
| if (message.type === 'DISPATCH' && message.state) { | ||
| store.dispatch('UPDATE_FROM_DEVTOOLS', JSON.parse(message.state)) | ||
| } | ||
| }) | ||
| ReduxTool.init(store.get()) | ||
| }) | ||
| store.on('@init', function () { | ||
| ReduxTool.subscribe(function (message) { | ||
| if (message.type === 'DISPATCH' && message.state) { | ||
| store.dispatch('UPDATE_FROM_DEVTOOLS', JSON.parse(message.state)) | ||
| var prev = '' | ||
| store.on('@dispatch', function (state, data) { | ||
| var event = data[0] | ||
| if (event !== 'UPDATE_FROM_DEVTOOLS' && prev !== 'UPDATE_FROM_DEVTOOLS') { | ||
| if (event !== '@changed' || Object.keys(data[1]).length) { | ||
| ReduxTool.send({ type: event, payload: data[1] }, state) | ||
| } | ||
| } | ||
| prev = event | ||
| }) | ||
| ReduxTool.init(store.get()) | ||
| }) | ||
| store.on('@dispatch', function (state, data) { | ||
| if ( | ||
| data[0] !== 'UPDATE_FROM_DEVTOOLS' && | ||
| prevMessage !== 'UPDATE_FROM_DEVTOOLS' | ||
| ) { | ||
| if (data[0] !== '@changed' || Object.keys(data[1]).length) { | ||
| ReduxTool.send({ type: data[0], payload: data[1] }, state) | ||
| store.on('UPDATE_FROM_DEVTOOLS', function (state, data) { | ||
| var newState = {} | ||
| var key | ||
| for (key in state) { | ||
| newState[key] = undefined | ||
| } | ||
| } | ||
| prevMessage = data[0] | ||
| }) | ||
| for (key in data) { | ||
| newState[key] = data[key] | ||
| } | ||
| return newState | ||
| }) | ||
| } | ||
| store.on('UPDATE_FROM_DEVTOOLS', function (state, data) { | ||
| var newState = {} | ||
| var key | ||
| for (key in state) { | ||
| newState[key] = undefined | ||
| } | ||
| for (key in data) { | ||
| newState[key] = data[key] | ||
| } | ||
| return newState | ||
| }) | ||
| if (options && options.on && options.dispatch && options.get) { | ||
| return module(options) | ||
| } else { | ||
| return module | ||
| } | ||
| } | ||
| module.exports = devtools | ||
| /** | ||
| * @callback devtools | ||
| * @param {Store} store The store. | ||
| * @returns {devtools} | ||
| */ |
@@ -8,4 +8,5 @@ /** | ||
| * @example | ||
| * import logger from 'storeon/devtools/logger' | ||
| * const store = createStore([logger]) | ||
| * const store = createStore([ | ||
| * process.env.NODE_ENV !== 'production' && require('storeon/devtools/logger') | ||
| * ]) | ||
| * | ||
@@ -12,0 +13,0 @@ * @name logger |
@@ -45,3 +45,3 @@ /** | ||
| if (event.indexOf('@') !== 0 && !events[event]) { | ||
| throw new Error('Unknown event ' + event) | ||
| throw new Error('Unknown Storeon event ' + event) | ||
| } | ||
@@ -76,3 +76,3 @@ } | ||
| }) | ||
| store.dispatch('@init') | ||
| dispatch('@init') | ||
@@ -79,0 +79,0 @@ return store |
| { | ||
| "name": "storeon", | ||
| "version": "0.5.0", | ||
| "description": "Tiny (179 bytes) event-based Redux-like state manager for React and Preact", | ||
| "version": "0.6.0", | ||
| "description": "Tiny (175 bytes) event-based Redux-like state manager for React and Preact", | ||
| "keywords": [ | ||
@@ -17,8 +17,3 @@ "state", | ||
| "./devtools/logger.js": "./devtools/logger.browser.js" | ||
| }, | ||
| "husky": { | ||
| "hooks": { | ||
| "pre-commit": "lint-staged" | ||
| } | ||
| } | ||
| } |
@@ -5,7 +5,7 @@ # Storeon | ||
| * **Small.** 179 bytes (minified and gzipped). No dependencies. | ||
| * **Small.** 175 bytes (minified and gzipped). No dependencies. | ||
| It uses [Size Limit] to control size. | ||
| * **Fast.** It track what state parts was changed and re-render only components | ||
| based on this state parts. | ||
| * **Hooks.** The same Redux reducers, but it already has React/Preact hooks API. | ||
| * **Fast.** It tracks what parts of state were changed and re-renders | ||
| only components based on the changes. | ||
| * **Hooks.** The same Redux reducers. Now with hooks for **React/Preact**. | ||
| * **Modular.** API created to move business logic away from React components. | ||
@@ -33,6 +33,3 @@ | ||
| const { dispatch, count } = useStoreon('count') | ||
| return <> | ||
| {count} | ||
| <button onClick={() => dispatch('inc')} /> | ||
| </> | ||
| return <button onClick={() => dispatch('inc')}>{count}</button> | ||
| } | ||
@@ -46,3 +43,3 @@ ``` | ||
| <StoreContext.Provider value={store}> | ||
| <Counter></Counter> | ||
| <Counter /> | ||
| </StoreContext.Provider>, | ||
@@ -65,6 +62,6 @@ document.body | ||
| The store should be created with `createStore()` function. It accepts list | ||
| The store should be created with `createStore()` function. It accepts a list | ||
| of the modules. | ||
| Each module is just a function, which will accept `store` | ||
| Each module is just a function, which will accept a `store` | ||
| and bind their event listeners. | ||
@@ -89,3 +86,3 @@ | ||
| store.on('projects/add', ({ projects }, project) => { | ||
| return projects.concat([project]) | ||
| return { projects: projects.concat([project]) } | ||
| }) | ||
@@ -98,4 +95,4 @@ } | ||
| * `store.get()` will return current state. The state is always an object. | ||
| * `store.on(event, callback)` will add event listener. | ||
| * `store.dispatch(event, data)` will emit event with optional data. | ||
| * `store.on(event, callback)` will add an event listener. | ||
| * `store.dispatch(event, data)` will emit an event with optional data. | ||
@@ -107,5 +104,6 @@ | ||
| * `@init` will be fired in `createStore`. The best moment to set an initial state. | ||
| * `@init` will be fired in `createStore`. The best moment to set | ||
| an initial state. | ||
| * `@dispatch` will be fired on every `store.dispatch()` call. | ||
| It receives array with event name and event’s data. | ||
| It receives an array with the event name and the event’s data. | ||
| Can be useful for debugging. | ||
@@ -124,3 +122,3 @@ * `@changed` will be fired every when event listeners changed the state. | ||
| `store.on()` will return cleanup function. This function will remove | ||
| event listener. | ||
| the event listener. | ||
@@ -179,3 +177,3 @@ ```js | ||
| ```js | ||
| import connect from 'storeon/react' // Use 'storeon/preact' for Preact | ||
| import useStoreon from 'storeon/react' // Use 'storeon/preact' for Preact | ||
| const Users = () => { | ||
@@ -224,3 +222,3 @@ const { dispatch, users } = useStoreon('users') | ||
| … | ||
| process.env.NODE_ENV !== 'production' && require('storeon/devtools') | ||
| process.env.NODE_ENV !== 'production' && require('storeon/devtools')() | ||
| ]) | ||
@@ -227,0 +225,0 @@ ``` |
New alerts
License Policy Violation
LicenseThis 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
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage 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
- Total package byte prevSize
- increased by10.13%
20252
- Number of package files
- increased by4.55%
23
- Lines of code
- increased by6.11%
434
- Number of medium supply chain risk alerts
- decreased by-100%
0
Worsened metrics
- Number of lines in readme file
- decreased by-0.87%
229
No dependency changes