reactish-state 1.0.0-alpha.3 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/react/useSelector.cjs +3 -3
- package/dist/cjs/utils.cjs +2 -2
- package/dist/cjs/vanilla/selector.cjs +1 -1
- package/dist/cjs/vanilla/state.cjs +2 -1
- package/dist/esm/react/useSelector.mjs +4 -4
- package/dist/esm/utils.mjs +2 -2
- package/dist/esm/vanilla/selector.mjs +2 -2
- package/dist/esm/vanilla/state.mjs +2 -1
- package/dist/plugin/cjs/applyPlugin.cjs +1 -1
- package/dist/plugin/esm/applyPlugin.mjs +1 -1
- package/package.json +27 -31
- package/types/common.d.ts +22 -16
- package/types/react/useSelector.d.ts +2 -2
- package/types/react/useSnapshot.d.ts +2 -2
- package/types/utils.d.ts +3 -3
- package/types/vanilla/selector.d.ts +3 -4
- package/types/vanilla/state.d.ts +4 -7
|
@@ -16,10 +16,10 @@ const useSelector = (selectorParamFactory, deps) => {
|
|
|
16
16
|
const {
|
|
17
17
|
cache
|
|
18
18
|
} = context;
|
|
19
|
-
const
|
|
20
|
-
const args =
|
|
19
|
+
const selectorValues = utils.getSelectorValues(items);
|
|
20
|
+
const args = selectorValues.concat(deps || selectorFunc);
|
|
21
21
|
if (cache && utils.isEqual(args, cache.args)) return cache.val;
|
|
22
|
-
const val = selectorFunc(...
|
|
22
|
+
const val = selectorFunc(...selectorValues);
|
|
23
23
|
context.cache = {
|
|
24
24
|
args,
|
|
25
25
|
val
|
package/dist/cjs/utils.cjs
CHANGED
|
@@ -10,8 +10,8 @@ const createSubscriber = items => listener => {
|
|
|
10
10
|
const unsubscribers = items.map(item => item.subscribe(listener));
|
|
11
11
|
return () => unsubscribers.forEach(unsubscribe => unsubscribe());
|
|
12
12
|
};
|
|
13
|
-
const
|
|
13
|
+
const getSelectorValues = items => items.map(item => item.get());
|
|
14
14
|
|
|
15
15
|
exports.createSubscriber = createSubscriber;
|
|
16
|
-
exports.
|
|
16
|
+
exports.getSelectorValues = getSelectorValues;
|
|
17
17
|
exports.isEqual = isEqual;
|
|
@@ -15,7 +15,7 @@ const createSelector = ({
|
|
|
15
15
|
let cache;
|
|
16
16
|
const selector = {
|
|
17
17
|
get: () => {
|
|
18
|
-
const args = utils.
|
|
18
|
+
const args = utils.getSelectorValues(items);
|
|
19
19
|
if (cache && utils.isEqual(args, cache.args)) return cache.val;
|
|
20
20
|
const val = selectorFunc(...args);
|
|
21
21
|
cache = {
|
|
@@ -9,8 +9,9 @@ const createState = ({
|
|
|
9
9
|
let set = newValue => {
|
|
10
10
|
const nextValue = typeof newValue === 'function' ? newValue(value) : newValue;
|
|
11
11
|
if (!Object.is(value, nextValue)) {
|
|
12
|
+
const prevValue = value;
|
|
12
13
|
value = nextValue;
|
|
13
|
-
listeners.forEach(listener => listener());
|
|
14
|
+
listeners.forEach(listener => listener(nextValue, prevValue));
|
|
14
15
|
}
|
|
15
16
|
};
|
|
16
17
|
const subscribe = listener => {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { useState } from 'react';
|
|
2
|
-
import { createSubscriber,
|
|
2
|
+
import { createSubscriber, getSelectorValues, isEqual } from '../utils.mjs';
|
|
3
3
|
import { useSnapshot } from './useSnapshot.mjs';
|
|
4
4
|
|
|
5
5
|
const useSelector = (selectorParamFactory, deps) => {
|
|
@@ -14,10 +14,10 @@ const useSelector = (selectorParamFactory, deps) => {
|
|
|
14
14
|
const {
|
|
15
15
|
cache
|
|
16
16
|
} = context;
|
|
17
|
-
const
|
|
18
|
-
const args =
|
|
17
|
+
const selectorValues = getSelectorValues(items);
|
|
18
|
+
const args = selectorValues.concat(deps || selectorFunc);
|
|
19
19
|
if (cache && isEqual(args, cache.args)) return cache.val;
|
|
20
|
-
const val = selectorFunc(...
|
|
20
|
+
const val = selectorFunc(...selectorValues);
|
|
21
21
|
context.cache = {
|
|
22
22
|
args,
|
|
23
23
|
val
|
package/dist/esm/utils.mjs
CHANGED
|
@@ -8,6 +8,6 @@ const createSubscriber = items => listener => {
|
|
|
8
8
|
const unsubscribers = items.map(item => item.subscribe(listener));
|
|
9
9
|
return () => unsubscribers.forEach(unsubscribe => unsubscribe());
|
|
10
10
|
};
|
|
11
|
-
const
|
|
11
|
+
const getSelectorValues = items => items.map(item => item.get());
|
|
12
12
|
|
|
13
|
-
export { createSubscriber,
|
|
13
|
+
export { createSubscriber, getSelectorValues, isEqual };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createSubscriber,
|
|
1
|
+
import { createSubscriber, getSelectorValues, isEqual } from '../utils.mjs';
|
|
2
2
|
|
|
3
3
|
const createSelector = ({
|
|
4
4
|
plugin
|
|
@@ -13,7 +13,7 @@ const createSelector = ({
|
|
|
13
13
|
let cache;
|
|
14
14
|
const selector = {
|
|
15
15
|
get: () => {
|
|
16
|
-
const args =
|
|
16
|
+
const args = getSelectorValues(items);
|
|
17
17
|
if (cache && isEqual(args, cache.args)) return cache.val;
|
|
18
18
|
const val = selectorFunc(...args);
|
|
19
19
|
cache = {
|
|
@@ -7,8 +7,9 @@ const createState = ({
|
|
|
7
7
|
let set = newValue => {
|
|
8
8
|
const nextValue = typeof newValue === 'function' ? newValue(value) : newValue;
|
|
9
9
|
if (!Object.is(value, nextValue)) {
|
|
10
|
+
const prevValue = value;
|
|
10
11
|
value = nextValue;
|
|
11
|
-
listeners.forEach(listener => listener());
|
|
12
|
+
listeners.forEach(listener => listener(nextValue, prevValue));
|
|
12
13
|
}
|
|
13
14
|
};
|
|
14
15
|
const subscribe = listener => {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
const applyPlugin = plugins => (
|
|
3
|
+
const applyPlugin = plugins => (selector, config) => plugins.forEach(plugin => plugin?.(selector, config));
|
|
4
4
|
|
|
5
5
|
exports.applyPlugin = applyPlugin;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "reactish-state",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.1.0",
|
|
4
4
|
"description": "Simple, decentralized (atomic) state management for React.",
|
|
5
5
|
"author": "Zheng Song",
|
|
6
6
|
"license": "MIT",
|
|
@@ -80,44 +80,40 @@
|
|
|
80
80
|
}
|
|
81
81
|
},
|
|
82
82
|
"dependencies": {
|
|
83
|
-
"use-sync-external-store": "^1.
|
|
83
|
+
"use-sync-external-store": "^1.5.0"
|
|
84
84
|
},
|
|
85
85
|
"devDependencies": {
|
|
86
|
-
"@babel/core": "^7.
|
|
87
|
-
"@babel/preset-env": "^7.
|
|
88
|
-
"@babel/preset-react": "^7.
|
|
89
|
-
"@babel/preset-typescript": "^7.
|
|
86
|
+
"@babel/core": "^7.28.0",
|
|
87
|
+
"@babel/preset-env": "^7.28.0",
|
|
88
|
+
"@babel/preset-react": "^7.27.1",
|
|
89
|
+
"@babel/preset-typescript": "^7.27.1",
|
|
90
90
|
"@redux-devtools/extension": "^3.3.0",
|
|
91
91
|
"@rollup/plugin-babel": "^6.0.4",
|
|
92
|
-
"@rollup/plugin-node-resolve": "^16.0.
|
|
92
|
+
"@rollup/plugin-node-resolve": "^16.0.1",
|
|
93
93
|
"@rollup/plugin-replace": "^6.0.2",
|
|
94
94
|
"@testing-library/jest-dom": "^6.6.3",
|
|
95
|
-
"@testing-library/react": "^16.
|
|
96
|
-
"@types/jest": "^
|
|
97
|
-
"@types/react": "^19.
|
|
98
|
-
"@types/use-sync-external-store": "^
|
|
95
|
+
"@testing-library/react": "^16.3.0",
|
|
96
|
+
"@types/jest": "^30.0.0",
|
|
97
|
+
"@types/react": "^19.1.8",
|
|
98
|
+
"@types/use-sync-external-store": "^1.5.0",
|
|
99
99
|
"babel-plugin-pure-annotations": "^0.1.2",
|
|
100
|
-
"
|
|
101
|
-
"eslint
|
|
102
|
-
"eslint-
|
|
103
|
-
"eslint-plugin-
|
|
104
|
-
"eslint-plugin-react
|
|
105
|
-
"eslint-plugin-react-hooks
|
|
106
|
-
"
|
|
100
|
+
"deplift": "^1.0.1",
|
|
101
|
+
"eslint": "^9.32.0",
|
|
102
|
+
"eslint-config-prettier": "^10.1.8",
|
|
103
|
+
"eslint-plugin-jest": "^29.0.1",
|
|
104
|
+
"eslint-plugin-react": "^7.37.5",
|
|
105
|
+
"eslint-plugin-react-hooks": "^5.2.0",
|
|
106
|
+
"eslint-plugin-react-hooks-addons": "^0.5.0",
|
|
107
|
+
"globals": "^16.3.0",
|
|
107
108
|
"immer": "^10.1.1",
|
|
108
|
-
"jest": "^
|
|
109
|
-
"jest-environment-jsdom": "^
|
|
109
|
+
"jest": "^30.0.5",
|
|
110
|
+
"jest-environment-jsdom": "^30.0.5",
|
|
110
111
|
"npm-run-all": "^4.1.5",
|
|
111
|
-
"prettier": "^3.
|
|
112
|
-
"react": "^19.
|
|
113
|
-
"react-dom": "^19.
|
|
114
|
-
"rollup": "^4.
|
|
115
|
-
"typescript": "^5.
|
|
116
|
-
"typescript-eslint": "^8.
|
|
117
|
-
},
|
|
118
|
-
"overrides": {
|
|
119
|
-
"whatwg-url@11.0.0": {
|
|
120
|
-
"tr46": "^4"
|
|
121
|
-
}
|
|
112
|
+
"prettier": "^3.6.2",
|
|
113
|
+
"react": "^19.1.0",
|
|
114
|
+
"react-dom": "^19.1.0",
|
|
115
|
+
"rollup": "^4.45.1",
|
|
116
|
+
"typescript": "^5.8.3",
|
|
117
|
+
"typescript-eslint": "^8.38.0"
|
|
122
118
|
}
|
|
123
119
|
}
|
package/types/common.d.ts
CHANGED
|
@@ -3,30 +3,36 @@ export type Setter<T> = (newValue: T | ((value: T) => T), action?: string | {
|
|
|
3
3
|
type: string;
|
|
4
4
|
[key: string]: unknown;
|
|
5
5
|
}) => void;
|
|
6
|
-
export type
|
|
7
|
-
export type
|
|
8
|
-
export
|
|
6
|
+
export type Unsubscriber = () => void;
|
|
7
|
+
export type StateListener<T> = (nextValue: T, prevValue: T) => void;
|
|
8
|
+
export type StateSubscriber<T> = (listener: StateListener<T>) => Unsubscriber;
|
|
9
|
+
export interface State<T> {
|
|
9
10
|
get: Getter<T>;
|
|
10
|
-
|
|
11
|
+
set: Setter<T>;
|
|
12
|
+
subscribe: StateSubscriber<T>;
|
|
13
|
+
}
|
|
14
|
+
export type SelectorListener = () => void;
|
|
15
|
+
export type SelectorSubscriber = (listener: SelectorListener) => Unsubscriber;
|
|
16
|
+
export interface Selector<T> {
|
|
17
|
+
get: Getter<T>;
|
|
18
|
+
subscribe: SelectorSubscriber;
|
|
11
19
|
}
|
|
12
20
|
export interface Config {
|
|
13
21
|
key?: string;
|
|
14
22
|
}
|
|
15
23
|
export interface Middleware {
|
|
16
|
-
<T>(
|
|
17
|
-
set: Setter<T>;
|
|
18
|
-
}, config?: Config): Setter<T>;
|
|
24
|
+
<T>(state: State<T>, config?: Config): Setter<T>;
|
|
19
25
|
}
|
|
20
26
|
export interface Plugin {
|
|
21
|
-
<T>(
|
|
27
|
+
<T>(selector: Selector<T>, config?: Config): void;
|
|
22
28
|
}
|
|
23
|
-
export type
|
|
24
|
-
export type
|
|
25
|
-
[index in keyof
|
|
29
|
+
export type SelectorArray = Selector<unknown>[];
|
|
30
|
+
export type SelectorValueArray<TArray extends SelectorArray> = {
|
|
31
|
+
[index in keyof TArray]: ReturnType<TArray[index]['get']>;
|
|
26
32
|
};
|
|
27
|
-
export type SelectorFunc<
|
|
28
|
-
export type SelectorParams<
|
|
29
|
-
export interface
|
|
30
|
-
<RA extends
|
|
31
|
-
<RA extends
|
|
33
|
+
export type SelectorFunc<TArray extends SelectorArray, T> = (...args: SelectorValueArray<TArray>) => T;
|
|
34
|
+
export type SelectorParams<TArray extends SelectorArray, T> = [...TArray, SelectorFunc<TArray, T>];
|
|
35
|
+
export interface SelectorBuilder {
|
|
36
|
+
<RA extends SelectorArray, T>(...items: SelectorParams<RA, T>): Selector<T>;
|
|
37
|
+
<RA extends SelectorArray, T>(...items: [...SelectorParams<RA, T>, Config]): Selector<T>;
|
|
32
38
|
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
declare const useSelector: <
|
|
1
|
+
import type { SelectorArray, SelectorParams } from '../common';
|
|
2
|
+
declare const useSelector: <TArray extends SelectorArray, T>(selectorParamFactory: () => SelectorParams<TArray, T>, deps?: unknown[]) => T;
|
|
3
3
|
export { useSelector };
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
declare const useSnapshot: <T>({ subscribe, get }:
|
|
1
|
+
import type { Selector } from '../common';
|
|
2
|
+
declare const useSnapshot: <T>({ subscribe, get }: Selector<T>) => T;
|
|
3
3
|
export { useSnapshot };
|
package/types/utils.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { SelectorSubscriber, SelectorArray, SelectorValueArray } from './common';
|
|
2
2
|
export declare const isEqual: (args1: unknown[], args2: unknown[]) => boolean;
|
|
3
|
-
export declare const createSubscriber: (items:
|
|
4
|
-
export declare const
|
|
3
|
+
export declare const createSubscriber: (items: SelectorArray) => SelectorSubscriber;
|
|
4
|
+
export declare const getSelectorValues: <RA extends SelectorArray>(items: SelectorArray) => SelectorValueArray<RA>;
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import type { Plugin,
|
|
1
|
+
import type { Plugin, SelectorBuilder } from '../common';
|
|
2
2
|
declare const createSelector: ({ plugin }?: {
|
|
3
3
|
plugin?: Plugin;
|
|
4
|
-
}) =>
|
|
5
|
-
declare const selector:
|
|
6
|
-
export type { Selector };
|
|
4
|
+
}) => SelectorBuilder;
|
|
5
|
+
declare const selector: SelectorBuilder;
|
|
7
6
|
export { selector, createSelector };
|
package/types/vanilla/state.d.ts
CHANGED
|
@@ -1,12 +1,9 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { State, Setter, Config, Middleware } from '../common';
|
|
2
2
|
type ActionCreator<T, A> = ((set: Setter<T>, get: () => T) => A) | null | undefined;
|
|
3
|
-
type
|
|
4
|
-
set: Setter<T>;
|
|
5
|
-
};
|
|
6
|
-
type State<T, A> = Omit<A, keyof VanillaState<T>> & VanillaState<T>;
|
|
3
|
+
type StateWithAction<T, A> = Omit<A, keyof State<T>> & State<T>;
|
|
7
4
|
declare const createState: ({ middleware }?: {
|
|
8
5
|
middleware?: Middleware;
|
|
9
|
-
}) => <T, A>(initialValue: T, actionCreator?: ActionCreator<T, A>, config?: Config) =>
|
|
10
|
-
declare const state: <T, A>(initialValue: T, actionCreator?: ActionCreator<T, A>, config?: Config) =>
|
|
6
|
+
}) => <T, A>(initialValue: T, actionCreator?: ActionCreator<T, A>, config?: Config) => StateWithAction<T, A>;
|
|
7
|
+
declare const state: <T, A>(initialValue: T, actionCreator?: ActionCreator<T, A>, config?: Config) => StateWithAction<T, A>;
|
|
11
8
|
export type { State, ActionCreator };
|
|
12
9
|
export { state, createState };
|