@t8/react-store 1.2.3 → 1.2.4

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/README.md CHANGED
@@ -4,7 +4,7 @@
4
4
 
5
5
  [![npm](https://img.shields.io/npm/v/@t8/react-store?labelColor=345&color=46e)](https://www.npmjs.com/package/@t8/react-store) ![Lightweight](https://img.shields.io/bundlephobia/minzip/@t8/react-store?label=minzip&labelColor=345&color=46e) ![CSR ✓](https://img.shields.io/badge/CSR-✓-345?labelColor=345) ![SSR ✓](https://img.shields.io/badge/SSR-✓-345?labelColor=345)
6
6
 
7
- **Why?** To have an easy-to-use state management lib for React apps requiring least effort to migrate from local state and to quickly set up shared state from scratch, whether with SSR or without. Other approaches, including Redux Toolkit, Zustand, Jotai, MobX, invariably depart from this picture to varying degrees.
7
+ **Why?** To have an easy-to-use state management lib for React apps requiring least effort to migrate from local state and to quickly set up shared state from scratch, whether with SSR or without. Other approaches, like Redux Toolkit, Zustand, Jotai, MobX, depart from this picture to varying degrees.
8
8
 
9
9
  This picture is achieved here by (1) having a simple API introducing as few new entities as possible, (2) closely following the React's `useState()` pattern of initializing and manipulating the state to avoid boilerplate and sizable rewrites in the common task of migration from local state to shared state, (3) working smoothly with SSR with regular React Contexts without requiring a specifically designed setup and without internally making use of global stores or other global variables by default.
10
10
 
package/dist/index.d.ts CHANGED
@@ -1,2 +1,39 @@
1
+ import type { Store } from "@t8/store";
2
+
3
+ export type SetStoreState<T> = Store<T>["setState"];
4
+ export type ShouldUpdateCallback<T> = (nextState: T, prevState: T) => boolean;
5
+ export type ShouldUpdate<T> = boolean | ShouldUpdateCallback<T>;
6
+ /**
7
+ * Returns the state value of `store` passed as the parameter and
8
+ * a function to update the store state value.
9
+ *
10
+ * @example
11
+ * ```js
12
+ * let [value, setValue] = useStore(store);
13
+ * ```
14
+ *
15
+ * The optional second parameter `shouldUpdate` controls whether
16
+ * the component using this hook should be updated in response to
17
+ * the store updates, which is set to `true` by default.
18
+ *
19
+ * `shouldUpdate` can be set to `false` to prevent subscription
20
+ * to the store updates. Use case: if the component only requires
21
+ * the store state setter but not the store state value, the
22
+ * component may not need to respond to the store updates at all:
23
+ *
24
+ * @example
25
+ * ```js
26
+ * let [, setValue] = useStore(store, false);
27
+ * ```
28
+ *
29
+ * `shouldUpdate` can also be a function `(nextState, prevState) => boolean`
30
+ * to make the component respond only to specific store state changes,
31
+ * when this function returns `true`.
32
+ */
33
+ export declare function useStore<T>(store: Store<T>, shouldUpdate?: ShouldUpdate<T>): [
34
+ T,
35
+ SetStoreState<T>
36
+ ];
1
37
  export * from "@t8/store";
2
- export * from "./src/useStore.ts";
38
+
39
+ export {};
package/package.json CHANGED
@@ -1,21 +1,18 @@
1
1
  {
2
2
  "name": "@t8/react-store",
3
- "version": "1.2.3",
3
+ "version": "1.2.4",
4
4
  "description": "Small React app state management lib aligned with React's state pattern, condensed to the essentials",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
7
7
  "type": "module",
8
8
  "scripts": {
9
- "build": "npx npm-run-all clean compile types",
10
9
  "clean": "node -e \"require('node:fs').rmSync('dist', { force: true, recursive: true });\"",
11
10
  "compile": "npx esbuild index.ts --bundle --outdir=dist --platform=neutral --external:react",
12
11
  "demo": "npx @t8/serve 3000 * tests/counter -b src/index.tsx",
13
- "prepublishOnly": "npm run build",
14
- "preversion": "npx npm-run-all shape build test",
15
- "shape": "npx codeshape --typecheck",
12
+ "preversion": "npx npm-run-all clean shape compile test",
13
+ "shape": "npx codeshape --typecheck --emit-types",
16
14
  "test": "npx playwright test --project=chromium",
17
- "tic-tac-toe": "npx @t8/serve 3000 * tests/tic-tac-toe -b src/index.tsx",
18
- "types": "tsc -p tsconfig.build.json"
15
+ "tic-tac-toe": "npx @t8/serve 3000 * tests/tic-tac-toe -b src/index.tsx"
19
16
  },
20
17
  "repository": {
21
18
  "type": "git",
@@ -41,10 +38,9 @@
41
38
  "@types/react": "^19.2.7",
42
39
  "@types/react-dom": "^19.2.3",
43
40
  "immer": "^11.0.1",
44
- "react-dom": "^19.2.1",
45
- "typescript": "^5.9.3"
41
+ "react-dom": "^19.2.1"
46
42
  },
47
43
  "dependencies": {
48
- "@t8/store": "^1.3.3"
44
+ "@t8/store": "^1.3.5"
49
45
  }
50
46
  }
@@ -1,32 +0,0 @@
1
- import { type Store } from "@t8/store";
2
- export type SetStoreState<T> = Store<T>["setState"];
3
- export type ShouldUpdateCallback<T> = (nextState: T, prevState: T) => boolean;
4
- export type ShouldUpdate<T> = boolean | ShouldUpdateCallback<T>;
5
- /**
6
- * Returns the state value of `store` passed as the parameter and
7
- * a function to update the store state value.
8
- *
9
- * @example
10
- * ```js
11
- * let [value, setValue] = useStore(store);
12
- * ```
13
- *
14
- * The optional second parameter `shouldUpdate` controls whether
15
- * the component using this hook should be updated in response to
16
- * the store updates, which is set to `true` by default.
17
- *
18
- * `shouldUpdate` can be set to `false` to prevent subscription
19
- * to the store updates. Use case: if the component only requires
20
- * the store state setter but not the store state value, the
21
- * component may not need to respond to the store updates at all:
22
- *
23
- * @example
24
- * ```js
25
- * let [, setValue] = useStore(store, false);
26
- * ```
27
- *
28
- * `shouldUpdate` can also be a function `(nextState, prevState) => boolean`
29
- * to make the component respond only to specific store state changes,
30
- * when this function returns `true`.
31
- */
32
- export declare function useStore<T>(store: Store<T>, shouldUpdate?: ShouldUpdate<T>): [T, SetStoreState<T>];