reactish-state 0.3.0 → 0.5.0

package/dist/cjs/index.js

@@ -9,10 +9,13 @@ var state = function state(initialValue, actionCreator) {
     return value;
   }
   function set(newValue) {
-    value = newValue;
-    listeners.forEach(function (listener) {
-      listener();
-    });
+    var nextValue = typeof newValue === 'function' ? newValue(value) : newValue;
+    if (!Object.is(value, nextValue)) {
+      value = nextValue;
+      listeners.forEach(function (listener) {
+        listener();
+      });
+    }
   }
   return {
     get: get,
@@ -26,11 +29,37 @@ var state = function state(initialValue, actionCreator) {
     actions: actionCreator && actionCreator(set, get)
   };
 };
+var selector = function selector() {
+  for (var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++) {
+    items[_key] = arguments[_key];
+  }
+  var lastIndex = items.length - 1;
+  var selectorFunc = items[lastIndex];
+  items.length = lastIndex;
+  return {
+    get: function get() {
+      return selectorFunc.apply(void 0, items.map(function (item) {
+        return item.get();
+      }));
+    },
+    subscribe: function subscribe(listener) {
+      var unsubscribers = items.map(function (item) {
+        return item.subscribe(listener);
+      });
+      return function () {
+        return unsubscribers.forEach(function (unsubscribe) {
+          return unsubscribe();
+        });
+      };
+    }
+  };
+};
 
 var useSnapshot = function useSnapshot(state) {
   var value = shim.useSyncExternalStore(state.subscribe, state.get, state.get);
   return value;
 };
 
+exports.selector = selector;
 exports.state = state;
 exports.useSnapshot = useSnapshot;

package/dist/es/index.js

@@ -1,2 +1,2 @@
-export { state } from './vanilla.js';
+export { selector, state } from './vanilla.js';
 export { useSnapshot } from './react.js';

package/dist/es/vanilla.js

@@ -5,10 +5,13 @@ var state = function state(initialValue, actionCreator) {
     return value;
   }
   function set(newValue) {
-    value = newValue;
-    listeners.forEach(function (listener) {
-      listener();
-    });
+    var nextValue = typeof newValue === 'function' ? newValue(value) : newValue;
+    if (!Object.is(value, nextValue)) {
+      value = nextValue;
+      listeners.forEach(function (listener) {
+        listener();
+      });
+    }
   }
   return {
     get: get,
@@ -22,5 +25,30 @@ var state = function state(initialValue, actionCreator) {
     actions: actionCreator && actionCreator(set, get)
   };
 };
+var selector = function selector() {
+  for (var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++) {
+    items[_key] = arguments[_key];
+  }
+  var lastIndex = items.length - 1;
+  var selectorFunc = items[lastIndex];
+  items.length = lastIndex;
+  return {
+    get: function get() {
+      return selectorFunc.apply(void 0, items.map(function (item) {
+        return item.get();
+      }));
+    },
+    subscribe: function subscribe(listener) {
+      var unsubscribers = items.map(function (item) {
+        return item.subscribe(listener);
+      });
+      return function () {
+        return unsubscribers.forEach(function (unsubscribe) {
+          return unsubscribe();
+        });
+      };
+    }
+  };
+};
 
-export { state };
+export { selector, state };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "reactish-state",
-  "version": "0.3.0",
+  "version": "0.5.0",
   "description": "",
   "author": "Zheng Song",
   "license": "MIT",

package/types/index.d.ts

@@ -1,2 +1,2 @@
-export { state } from './vanilla';
+export { state, selector } from './vanilla';
 export { useSnapshot } from './react';

package/types/react.d.ts

@@ -1,3 +1,3 @@
-import { State } from './vanilla';
-declare const useSnapshot: <T>(state: State<T, undefined>) => T;
+import { Reactish } from './vanilla';
+declare const useSnapshot: <T>(state: Reactish<T>) => T;
 export { useSnapshot };

package/types/vanilla.d.ts

@@ -1,10 +1,22 @@
 declare type Listener = () => void;
-declare type ActionCreator<T, A> = (set: (value: T) => void, get: () => T) => A;
-interface State<T, A = undefined> {
+declare type Setter<T> = (newValue: T | ((value: T) => T)) => void;
+declare type ActionCreator<T, A> = (set: Setter<T>, get: () => T) => A;
+interface Reactish<T> {
     get: () => T;
-    set: (value: T) => void;
     subscribe: (listener: Listener) => () => void;
+}
+interface State<T, A = unknown> extends Reactish<T> {
+    set: Setter<T>;
     actions?: A;
 }
 declare const state: <T, A>(initialValue: T, actionCreator?: ActionCreator<T, A>) => State<T, A>;
-export { state, State };
+declare type ReactishArray = Reactish<unknown>[];
+declare type ReactishValueArray<R extends ReactishArray> = {
+    [index in keyof R]: ReturnType<R[index]['get']>;
+};
+declare type SelectorFunc<R extends ReactishArray, V> = (...args: ReactishValueArray<R>) => V;
+declare const selector: <R extends ReactishArray, V>(...items: [...R, SelectorFunc<R, V>]) => {
+    get: () => V;
+    subscribe: (listener: Listener) => () => void;
+};
+export { Reactish, state, selector };