Skip to content

Commit d9e4cd9

Browse files
committed
chore: react to 17 and all other packages possible
1 parent cd50fde commit d9e4cd9

File tree

6 files changed

+11509
-8800
lines changed

6 files changed

+11509
-8800
lines changed

DOCS.md

Lines changed: 89 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -9,69 +9,77 @@
99
- [delete][5]
1010
- [Parameters][6]
1111
- [getState][7]
12-
- [useStore][8]
13-
- [Parameters][9]
14-
- [Examples][10]
15-
- [useSetStoreValue][11]
16-
- [Parameters][12]
17-
- [Examples][13]
18-
- [useDeleteStoreValue][14]
19-
- [Parameters][15]
20-
- [Examples][16]
21-
- [useGetAndSet][17]
22-
- [Parameters][18]
23-
- [Examples][19]
24-
- [useGetAndDelete][20]
25-
- [Parameters][21]
26-
- [Examples][22]
27-
- [useSetAndDelete][23]
28-
- [Parameters][24]
29-
- [Examples][25]
30-
- [useStoreValue][26]
31-
- [Parameters][27]
32-
- [useStoreState][28]
33-
- [Examples][29]
34-
- [rawStore][30]
35-
- [withStore][31]
36-
- [Parameters][32]
37-
- [Examples][33]
12+
- [listernerMiddleware][8]
13+
- [useStore][9]
14+
- [Parameters][10]
15+
- [Examples][11]
16+
- [useSetStoreValue][12]
17+
- [Parameters][13]
18+
- [Examples][14]
19+
- [useDeleteStoreValue][15]
20+
- [Parameters][16]
21+
- [Examples][17]
22+
- [useGetAndSet][18]
23+
- [Parameters][19]
24+
- [Examples][20]
25+
- [useGetAndDelete][21]
26+
- [Parameters][22]
27+
- [Examples][23]
28+
- [useSetAndDelete][24]
29+
- [Parameters][25]
30+
- [Examples][26]
31+
- [useStoreValue][27]
32+
- [Parameters][28]
33+
- [useStoreState][29]
34+
- [Examples][30]
35+
- [rawStore][31]
36+
- [withStore][32]
37+
- [Parameters][33]
38+
- [Examples][34]
3839

3940
## reset
4041

4142
Resets the state to the given input.
4243

4344
### Parameters
4445

45-
- `state` **[Object][34]** the new value to reset the state to.
46+
- `state` **[Object][35]** the new value to reset the state to.
4647

4748
## set
4849

4950
Sets the specified key in the store. This function is equivaluent to the `useSetStoreValue` hook.
5051

5152
### Parameters
5253

53-
- `key` **[string][35]** the property to set in the store
54-
- `value` **[Object][34]** the value of the property
54+
- `key` **[string][36]** the property to set in the store
55+
- `value` **[Object][35]** the value of the property
5556

5657
## delete
5758

5859
delete the specified key from the store. This function is equivaluent to the `useDeleteStoreValue` hook.
5960

6061
### Parameters
6162

62-
- `key` **[string][35]** the property to set in the store
63+
- `key` **[string][36]** the property to set in the store
6364

6465
## getState
6566

6667
Returns **any** the global state value of the store
6768

69+
## listernerMiddleware
70+
71+
**Meta**
72+
73+
- **deprecated**: Use listenerMiddleware
74+
75+
6876
## useStore
6977

7078
`useStore` is a React Hook that access a value stored in the application global store. It returns the value, a function to update it (like React.useState) and a function to delete it.
7179

7280
### Parameters
7381

74-
- `key` **[string][35]** The lookup key to find the saved value in the store
82+
- `key` **[string][36]** The lookup key to find the saved value in the store
7583
- `defaultValue` **any** The value if the value in the store is missing
7684

7785
### Examples
@@ -83,7 +91,7 @@ const [username, setUsername, deleteUsername] = useStore('username')
8391
<button onClick={()=> setUsername('my_username')}>set username</button>
8492
```
8593

86-
Returns **[array][36]** an array with length 3:<br>
94+
Returns **[array][37]** an array with length 3:<br>
8795
position 0 - the value of the data in the store.<br>
8896
position 1 - a function _setValue_ to modify the data in the store. When used, this function return a promise that resolve nothing, thus you can use `setValue('a value').then(() => {doSomething() //when the store did update})`<br>
8997
position 2 - a function _deleteValue_ to delete the value from the store. When used, this function return a promise that resolve nothing, thus you can use `deleteValue('a value').then(() => {doSomething() //when the store did update})`
@@ -94,7 +102,7 @@ Returns a function to set or update a variable in the store. You want to use thi
94102

95103
### Parameters
96104

97-
- `key` **[string][35]** the name of the variable to set in the store
105+
- `key` **[string][36]** the name of the variable to set in the store
98106

99107
### Examples
100108

@@ -104,15 +112,15 @@ const setUsername = useSetStoreValue('username')
104112
<button onClick={()=> setUsername('my_username')}>set username</button>
105113
```
106114

107-
Returns **[Function][37]** a function to set a variable in the store with the given name When used, this function return a promise that resolve nothing, thus you can use `setValue('a value').then(() => {doSomething() //when the store did update})`
115+
Returns **[Function][38]** a function to set a variable in the store with the given name When used, this function return a promise that resolve nothing, thus you can use `setValue('a value').then(() => {doSomething() //when the store did update})`
108116

109117
## useDeleteStoreValue
110118

111119
Returns a function to delete a variable in the store. You want to use this hook when you just need to delete a value in the store, not read or set a value from it.
112120

113121
### Parameters
114122

115-
- `key` **[string][35]** the name of the variable to set in the store
123+
- `key` **[string][36]** the name of the variable to set in the store
116124

117125
### Examples
118126

@@ -122,7 +130,7 @@ const deleteUsername = useDeleteStoreValue('username')
122130
<button onClick={()=> deleteUsername('my_username')}>set username</button>
123131
```
124132

125-
Returns **[Function][37]** a function to delete a variable in the store with the given name. When used, this function return a promise that resolve nothing, thus you can use `deleteValue('a value').then(() => {doSomething() //when the store did update})`
133+
Returns **[Function][38]** a function to delete a variable in the store with the given name. When used, this function return a promise that resolve nothing, thus you can use `deleteValue('a value').then(() => {doSomething() //when the store did update})`
126134

127135
## useGetAndSet
128136

@@ -131,7 +139,7 @@ This React hook returns an array to read and modify a value in the store:
131139

132140
### Parameters
133141

134-
- `key` **[string][35]** The lookup key to find the saved value in the store
142+
- `key` **[string][36]** The lookup key to find the saved value in the store
135143
- `defaultValue` **any** The default value if missing
136144

137145
### Examples
@@ -145,7 +153,7 @@ const [username, setUsername] = useGetAndSet('username')
145153
const [value, setValue] = useGetAndSet('a_lookup_key_in_the_store')
146154
```
147155

148-
Returns **[array][36]** an array with length 2:<br>
156+
Returns **[array][37]** an array with length 2:<br>
149157
position 0 - the value of the data in the store.<br>
150158
position 1 - a function _setValue_ to modify the data in the store. When used, this function return a promise that resolve nothing, thus you can use `setValue('a value').then(() => {doSomething() //when the store did update})`<br>
151159

@@ -156,7 +164,7 @@ This React hook returns an array to read and delete a value in the store:
156164

157165
### Parameters
158166

159-
- `key` **[string][35]** The lookup key to find the saved value in the store
167+
- `key` **[string][36]** The lookup key to find the saved value in the store
160168

161169
### Examples
162170

@@ -167,7 +175,7 @@ const [username, deleteUsername] = useGetAndDelete('username')
167175
<button onClick={()=> deleteUsername('my_username')}>set username</button>
168176
```
169177

170-
Returns **[array][36]** an array with length 2:<br>
178+
Returns **[array][37]** an array with length 2:<br>
171179
position 0 - the value of the data in the store.<br>
172180
position 1 - a function _deleteValue_ to delete the data in the store. When used, this function return a promise that resolve nothing, thus you can use `deleteValue('a value').then(() => {doSomething() //when the store did update})`<br>
173181

@@ -178,7 +186,7 @@ This React hook returns an array to set and delete a value in the store:
178186

179187
### Parameters
180188

181-
- `key` **[string][35]** The lookup key to find the saved value in the store
189+
- `key` **[string][36]** The lookup key to find the saved value in the store
182190

183191
### Examples
184192

@@ -189,15 +197,15 @@ const [username, deleteUsername] = useGetAndDelete('username')
189197
<button onClick={()=> deleteUsername('my_username')}>set username</button>
190198
```
191199

192-
Returns **[array][36]** an array with length 2:<br>
200+
Returns **[array][37]** an array with length 2:<br>
193201
position 0 - a function _setValue_ to modify the data in the store. When used, this function return a promise that resolve nothing, thus you can use `setValue('a value').then(() => {doSomething() //when the store did update})`<br>
194202
position 1 - a function _deleteValue_ to delete the data in the store. When used, this function return a promise that resolve nothing, thus you can use `deleteValue('a value').then(() => {doSomething() //when the store did update})`<br>
195203

196204
## useStoreValue
197205

198206
### Parameters
199207

200-
- `key` **[string][35]** the name of the variable / value to be retrieved in the global store.
208+
- `key` **[string][36]** the name of the variable / value to be retrieved in the global store.
201209
- `defaultValue` **any?** an optional default value, if the value in the global store is not present.
202210

203211
Returns **any** the value on the global store, or the default value if passed, or `undefined`
@@ -214,7 +222,7 @@ const store = useStoreState()
214222
console.log('the store is', JSON.stringify(store))
215223
```
216224

217-
Returns **[object][34]** An object representing the whole store value in read only mode.
225+
Returns **[object][35]** An object representing the whole store value in read only mode.
218226

219227
## rawStore
220228

@@ -225,10 +233,10 @@ This store can be used outside of React components.
225233
### Parameters
226234

227235
- `WrappedComponent` **ReactElement** the component to connect with the store
228-
- `initialValue` **[Object][34]** an Object that will be the initial store value, or nothing
229-
- `config` **[Object][34]** the custom configuration. If nothing is passed, the default config will be used.
230-
- `config.listener` **[Function][37]** a function that is triggered each time the global state is modified. This function takes these parameters: (state, key, prevValue, nextValue). `state` is the value of the new state, `key` is the key that changed, `prevValue` is the old value of the key, `nextValule` is the new one.
231-
- `config.logging` **[boolean][38]** default `false` - if true it will log changes to console
236+
- `initialValue` **[Object][35]** an Object that will be the initial store value, or nothing
237+
- `config` **[Object][35]** the custom configuration. If nothing is passed, the default config will be used.
238+
- `config.listener` **[Function][38]** a function that is triggered each time the global state is modified. This function takes these parameters: (state, key, prevValue, nextValue). `state` is the value of the new state, `key` is the key that changed, `prevValue` is the old value of the key, `nextValule` is the new one.
239+
- `config.logging` **[boolean][39]** default `false` - if true it will log changes to console
232240

233241
### Examples
234242

@@ -262,64 +270,66 @@ export default withStore(App, initialState, storeConfig)
262270

263271
[7]: #getstate
264272

265-
[8]: #usestore
273+
[8]: #listernermiddleware
274+
275+
[9]: #usestore
266276

267-
[9]: #parameters-3
277+
[10]: #parameters-3
268278

269-
[10]: #examples
279+
[11]: #examples
270280

271-
[11]: #usesetstorevalue
281+
[12]: #usesetstorevalue
272282

273-
[12]: #parameters-4
283+
[13]: #parameters-4
274284

275-
[13]: #examples-1
285+
[14]: #examples-1
276286

277-
[14]: #usedeletestorevalue
287+
[15]: #usedeletestorevalue
278288

279-
[15]: #parameters-5
289+
[16]: #parameters-5
280290

281-
[16]: #examples-2
291+
[17]: #examples-2
282292

283-
[17]: #usegetandset
293+
[18]: #usegetandset
284294

285-
[18]: #parameters-6
295+
[19]: #parameters-6
286296

287-
[19]: #examples-3
297+
[20]: #examples-3
288298

289-
[20]: #usegetanddelete
299+
[21]: #usegetanddelete
290300

291-
[21]: #parameters-7
301+
[22]: #parameters-7
292302

293-
[22]: #examples-4
303+
[23]: #examples-4
294304

295-
[23]: #usesetanddelete
305+
[24]: #usesetanddelete
296306

297-
[24]: #parameters-8
307+
[25]: #parameters-8
298308

299-
[25]: #examples-5
309+
[26]: #examples-5
300310

301-
[26]: #usestorevalue
311+
[27]: #usestorevalue
302312

303-
[27]: #parameters-9
313+
[28]: #parameters-9
304314

305-
[28]: #usestorestate
315+
[29]: #usestorestate
306316

307-
[29]: #examples-6
317+
[30]: #examples-6
308318

309-
[30]: #rawstore
319+
[31]: #rawstore
310320

311-
[31]: #withstore
321+
[32]: #withstore
312322

313-
[32]: #parameters-10
323+
[33]: #parameters-10
314324

315-
[33]: #examples-7
325+
[34]: #examples-7
316326

317-
[34]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object
327+
[35]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object
318328

319-
[35]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
329+
[36]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
320330

321-
[36]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
331+
[37]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
322332

323-
[37]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
333+
[38]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
324334

325-
[38]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
335+
[39]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean

example/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@
77
"dependencies": {
88
"prop-types": "^15.6.2",
99
"react": "link:../node_modules/react",
10-
"react-dom": "^16.8.6",
11-
"react-scripts": "^3.0.1",
10+
"react-dom": "^17.0.0",
11+
"react-scripts": "^4.0.3",
1212
"react-context-hook": "link:.."
1313
},
1414
"scripts": {

0 commit comments

Comments
 (0)