react-native-global-state-hooks 16.0.4-beta → 16.0.5-beta.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/README.md +12 -12
- package/createGlobalState.d.ts +2 -2
- package/package.json +6 -3
- package/rgsh.mjs +2 -0
package/README.md
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
|
|
9
9
|
<div align="center">
|
|
10
10
|
|
|
11
|
-
**
|
|
11
|
+
**Shared React Native state. Precise subscriptions. Async persistence.** 🚀
|
|
12
12
|
|
|
13
13
|
_The simplicity of `useState`, shared across your React Native app._ ✨
|
|
14
14
|
|
|
@@ -16,7 +16,7 @@ _The simplicity of `useState`, shared across your React Native app._ ✨
|
|
|
16
16
|
[](https://www.npmjs.com/package/react-native-global-state-hooks)
|
|
17
17
|
[](https://github.com/johnny-quesada-developer/react-native-global-state-hooks/blob/master/LICENSE)
|
|
18
18
|
|
|
19
|
-
[**NPM**](https://www.npmjs.com/package/react-native-global-state-hooks) • [**GitHub**](https://github.com/johnny-quesada-developer/react-native-global-state-hooks) • [**Core API Demo**](https://johnny-quesada-developer.github.io/global-hooks-example/) • [**Video Tutorial**](https://www.youtube.com/watch?v=1UBqXk2MH8I
|
|
19
|
+
[**NPM**](https://www.npmjs.com/package/react-native-global-state-hooks) • [**GitHub**](https://github.com/johnny-quesada-developer/react-native-global-state-hooks) • [**Core API Demo**](https://johnny-quesada-developer.github.io/global-hooks-example/) • [**Video Tutorial**](https://www.youtube.com/watch?v=1UBqXk2MH8I)
|
|
20
20
|
|
|
21
21
|
</div>
|
|
22
22
|
|
|
@@ -44,9 +44,9 @@ function Counter() {
|
|
|
44
44
|
|
|
45
45
|
---
|
|
46
46
|
|
|
47
|
-
## 🚀
|
|
47
|
+
## 🚀 Built for React applications
|
|
48
48
|
|
|
49
|
-
### 🎓 **
|
|
49
|
+
### 🎓 **Familiar React API**
|
|
50
50
|
|
|
51
51
|
If you know `useState`, the basic API already feels familiar:
|
|
52
52
|
|
|
@@ -203,7 +203,7 @@ function ThemeToggle() {
|
|
|
203
203
|
}
|
|
204
204
|
```
|
|
205
205
|
|
|
206
|
-
###
|
|
206
|
+
### Actions with async persistence
|
|
207
207
|
|
|
208
208
|
A persisted React Native store initializes **asynchronously**, so the hook also exposes storage readiness through metadata.
|
|
209
209
|
|
|
@@ -424,9 +424,9 @@ const useActiveAdmins = useActiveUsers.createSelectorHook((users) =>
|
|
|
424
424
|
);
|
|
425
425
|
|
|
426
426
|
function UserStats() {
|
|
427
|
-
const
|
|
428
|
-
const
|
|
429
|
-
const
|
|
427
|
+
const users = useUsers();
|
|
428
|
+
const activeUsers = useActiveUsers();
|
|
429
|
+
const activeAdmins = useActiveAdmins();
|
|
430
430
|
|
|
431
431
|
return (
|
|
432
432
|
<View>
|
|
@@ -594,7 +594,7 @@ useFeed.setMetadata((metadata) => ({
|
|
|
594
594
|
isLoading: true,
|
|
595
595
|
}));
|
|
596
596
|
|
|
597
|
-
const metadata = useFeed.
|
|
597
|
+
const metadata = useFeed.metadata;
|
|
598
598
|
|
|
599
599
|
console.log(metadata.isLoading);
|
|
600
600
|
```
|
|
@@ -1023,7 +1023,7 @@ const useUsers = Data.use.createSelectorHook((state) => state.users);
|
|
|
1023
1023
|
const useActiveUsers = useUsers.createSelectorHook((users) => users.filter((user) => user.active));
|
|
1024
1024
|
|
|
1025
1025
|
function ActiveUsers() {
|
|
1026
|
-
const
|
|
1026
|
+
const users = useActiveUsers();
|
|
1027
1027
|
|
|
1028
1028
|
return (
|
|
1029
1029
|
<View>
|
|
@@ -1323,7 +1323,7 @@ const useApp = createGlobalState({
|
|
|
1323
1323
|
| 📦 [**NPM Package**](https://www.npmjs.com/package/react-native-global-state-hooks) | Published React Native package |
|
|
1324
1324
|
| 💻 [**GitHub Repository**](https://github.com/johnny-quesada-developer/react-native-global-state-hooks) | Source, tests, and issues |
|
|
1325
1325
|
| 🎮 [**Core API Demo**](https://johnny-quesada-developer.github.io/global-hooks-example/) | Browser demo of the shared state-management concepts |
|
|
1326
|
-
| 🎥 [**Video Tutorial**](https://www.youtube.com/watch?v=1UBqXk2MH8I
|
|
1326
|
+
| 🎥 [**Video Tutorial**](https://www.youtube.com/watch?v=1UBqXk2MH8I) | State-management walkthrough |
|
|
1327
1327
|
| 📚 [**Core Package**](https://www.npmjs.com/package/react-hooks-global-states) | Shared state engine used by the platform packages |
|
|
1328
1328
|
|
|
1329
1329
|
---
|
|
@@ -1342,7 +1342,7 @@ The state-management concepts are intentionally similar across the packages, but
|
|
|
1342
1342
|
|
|
1343
1343
|
## 🎉 Why Developers Choose This
|
|
1344
1344
|
|
|
1345
|
-
###
|
|
1345
|
+
### At a glance
|
|
1346
1346
|
|
|
1347
1347
|
| What You Get | What You Avoid |
|
|
1348
1348
|
| ----------------------------------- | ---------------------------------- |
|
package/createGlobalState.d.ts
CHANGED
|
@@ -30,7 +30,7 @@ interface CreateGlobalState {
|
|
|
30
30
|
* @param args.name optional name for debugging purposes
|
|
31
31
|
* @param args.metadata optional non-reactive metadata associated with the state
|
|
32
32
|
* @param args.callbacks optional lifecycle callbacks for the global state
|
|
33
|
-
* @param args.actions
|
|
33
|
+
* @param args.actions Optional actions returned as the hook’s second item; `setState` remains available on the store API
|
|
34
34
|
* @param args.asyncStorage optional configuration to persist the state in local storage
|
|
35
35
|
* @returns a state hook that you can use in your components
|
|
36
36
|
*
|
|
@@ -87,7 +87,7 @@ interface CreateGlobalState {
|
|
|
87
87
|
* @param args.name optional name for debugging purposes
|
|
88
88
|
* @param args.metadata optional non-reactive metadata associated with the state
|
|
89
89
|
* @param args.callbacks optional lifecycle callbacks for the global state
|
|
90
|
-
* @param args.actions
|
|
90
|
+
* @param args.actions Optional actions returned as the hook’s second item; `setState` remains available on the store API
|
|
91
91
|
* @param args.asyncStorage optional configuration to persist the state in local storage
|
|
92
92
|
* @returns a state hook that you can use in your components
|
|
93
93
|
*
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-global-state-hooks",
|
|
3
|
-
"version": "16.0.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "16.0.5-beta.0",
|
|
4
|
+
"description": "Shared React Native state with a useState-style API, selective subscriptions, actions and async persistence with optional AsyncStorage.",
|
|
5
5
|
"main": "./bundle.cjs",
|
|
6
6
|
"module": "./bundle.mjs",
|
|
7
7
|
"types": "./index.d.ts",
|
|
@@ -118,6 +118,9 @@
|
|
|
118
118
|
}
|
|
119
119
|
},
|
|
120
120
|
"dependencies": {
|
|
121
|
-
"react-hooks-global-states": "^16.0.
|
|
121
|
+
"react-hooks-global-states": "^16.0.5-beta.0"
|
|
122
|
+
},
|
|
123
|
+
"bin": {
|
|
124
|
+
"rgsh": "./rgsh.mjs"
|
|
122
125
|
}
|
|
123
126
|
}
|
package/rgsh.mjs
ADDED