solid-new-bucket 0.0.4-a → 0.0.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 +0 -89
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,91 +1,2 @@
|
|
|
1
1
|
# solid-bucket
|
|
2
2
|
SolidJS Signal Utils
|
|
3
|
-
|
|
4
|
-
## Usage
|
|
5
|
-
|
|
6
|
-
### Bucket
|
|
7
|
-
|
|
8
|
-
Create a bucket to track data:
|
|
9
|
-
```
|
|
10
|
-
import { bucket } from 'solid-new-bucket'
|
|
11
|
-
|
|
12
|
-
const value = bucket('test data')
|
|
13
|
-
```
|
|
14
|
-
|
|
15
|
-
Access bucket's reactive value in SolidJS:
|
|
16
|
-
```
|
|
17
|
-
function myComponent() {
|
|
18
|
-
const value = bucket('test data')
|
|
19
|
-
|
|
20
|
-
return (
|
|
21
|
-
<div>
|
|
22
|
-
This is {value()}
|
|
23
|
-
</div>
|
|
24
|
-
)
|
|
25
|
-
}
|
|
26
|
-
```
|
|
27
|
-
|
|
28
|
-
Update bucket's content:
|
|
29
|
-
```
|
|
30
|
-
// Provide value directly
|
|
31
|
-
const value = bucket('test data')
|
|
32
|
-
value('new data')
|
|
33
|
-
console.log(value())
|
|
34
|
-
// expected to be: 'new data'
|
|
35
|
-
|
|
36
|
-
// Provide a consumer function
|
|
37
|
-
value(prevValue => 'updated: ' + prevValue)
|
|
38
|
-
console.log(value())
|
|
39
|
-
// expected to be: 'updated: test data'
|
|
40
|
-
```
|
|
41
|
-
|
|
42
|
-
Save bucket's content to local storage:
|
|
43
|
-
```
|
|
44
|
-
const value = bucket(new Date(), {
|
|
45
|
-
localStorageName: 'user.loginAt'
|
|
46
|
-
})
|
|
47
|
-
```
|
|
48
|
-
With ``localStorageName``, bucket sync it's content with local storage automatically.
|
|
49
|
-
|
|
50
|
-
Update listener:
|
|
51
|
-
```
|
|
52
|
-
const value = bucket(1, {
|
|
53
|
-
beforeUpdate(newValue) {
|
|
54
|
-
console.log('going to update to', newValue)
|
|
55
|
-
},
|
|
56
|
-
afterUpdate(newValue) {
|
|
57
|
-
console.log('now is', newValue)
|
|
58
|
-
}
|
|
59
|
-
})
|
|
60
|
-
```
|
|
61
|
-
|
|
62
|
-
Use Bucket as downstream of an accessor:
|
|
63
|
-
```
|
|
64
|
-
const [upstream, updateUpstream] = createSignal('test data')
|
|
65
|
-
const value = bucket(upstream, {
|
|
66
|
-
useValueAsAccessor: true
|
|
67
|
-
})
|
|
68
|
-
updateUpstream('new data')
|
|
69
|
-
console.log(value())
|
|
70
|
-
// expected to be: 'new data'
|
|
71
|
-
```
|
|
72
|
-
|
|
73
|
-
### StampedBucket
|
|
74
|
-
|
|
75
|
-
StampedBucket helps to track changes on Object, Array and other complex types.
|
|
76
|
-
|
|
77
|
-
Create a StampedBucket:
|
|
78
|
-
```
|
|
79
|
-
const set = stampedBucket(new Set())
|
|
80
|
-
```
|
|
81
|
-
|
|
82
|
-
Update and access:
|
|
83
|
-
```
|
|
84
|
-
set(content => {
|
|
85
|
-
content.add(1)
|
|
86
|
-
})
|
|
87
|
-
console.log(set())
|
|
88
|
-
// expected to be: Set(1) { 1 }
|
|
89
|
-
```
|
|
90
|
-
|
|
91
|
-
StampedBucket supports update listener and localStorage sync as well as Bucket.
|