redux-sacala 0.3.3 → 0.3.5
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 +35 -0
- package/package.json +10 -2
package/README.md
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
# Redux Sacala
|
|
2
2
|
|
|
3
|
+
[](https://github.com/monkin/redux-sacala/actions/workflows/test.yml)
|
|
4
|
+
|
|
3
5
|
A library for creating composable Redux blocks with state, actions, and effects.
|
|
4
6
|
|
|
5
7
|
## Terms Definition
|
|
@@ -167,6 +169,39 @@ const mappedBlock = ReduxBlock.mapContext(
|
|
|
167
169
|
// Now mappedBlock expects NewContext
|
|
168
170
|
```
|
|
169
171
|
|
|
172
|
+
### Selector Mapping
|
|
173
|
+
|
|
174
|
+
You can adapt a block's selectors to work with a different state shape using `ReduxBlock.mapSelectors`. This is useful when you want to embed a block as part of a larger state structure or reuse a block with different state organization.
|
|
175
|
+
|
|
176
|
+
```typescript
|
|
177
|
+
const counterBlock = ReduxBlock.builder("counter", { count: 0 })
|
|
178
|
+
.action("inc", (state) => ({ count: state.count + 1 }))
|
|
179
|
+
.selectors({
|
|
180
|
+
count: (state) => state.count,
|
|
181
|
+
doubleCount: (state) => state.count * 2,
|
|
182
|
+
})
|
|
183
|
+
.build();
|
|
184
|
+
|
|
185
|
+
// Original selector expects { count: number }
|
|
186
|
+
// counterBlock.select.count({ count: 5 }) -> 5
|
|
187
|
+
|
|
188
|
+
// Map selectors to work with a different state shape
|
|
189
|
+
interface AppState {
|
|
190
|
+
myCounter: { count: number };
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
const mappedBlock = ReduxBlock.mapSelectors(
|
|
194
|
+
counterBlock,
|
|
195
|
+
(state: AppState) => state.myCounter
|
|
196
|
+
);
|
|
197
|
+
|
|
198
|
+
// Now selectors expect AppState
|
|
199
|
+
// mappedBlock.select.count({ myCounter: { count: 5 } }) -> 5
|
|
200
|
+
// mappedBlock.select.doubleCount({ myCounter: { count: 5 } }) -> 10
|
|
201
|
+
```
|
|
202
|
+
|
|
203
|
+
Note: In most cases, compositions handle selector lifting automatically. Use `mapSelectors` when you need explicit control over how selectors access state, such as when integrating with existing Redux stores or creating reusable blocks.
|
|
204
|
+
|
|
170
205
|
### Minimal Redux Toolkit Example
|
|
171
206
|
|
|
172
207
|
```typescript
|
package/package.json
CHANGED
|
@@ -1,7 +1,15 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "redux-sacala",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.5",
|
|
4
4
|
"license": "MIT",
|
|
5
|
+
"repository": {
|
|
6
|
+
"type": "git",
|
|
7
|
+
"url": "git+https://github.com/monkin/redux-sacala.git"
|
|
8
|
+
},
|
|
9
|
+
"bugs": {
|
|
10
|
+
"url": "https://github.com/monkin/redux-sacala/issues"
|
|
11
|
+
},
|
|
12
|
+
"homepage": "https://github.com/monkin/redux-sacala#readme",
|
|
5
13
|
"type": "module",
|
|
6
14
|
"author": {
|
|
7
15
|
"name": "Andrey Monkin",
|
|
@@ -29,7 +37,7 @@
|
|
|
29
37
|
"@typescript-eslint/parser": "8.53.0",
|
|
30
38
|
"eslint": "9.39.2",
|
|
31
39
|
"eslint-config-prettier": "10.1.8",
|
|
32
|
-
"prettier": "3.
|
|
40
|
+
"prettier": "3.8.0",
|
|
33
41
|
"typescript": "5.9.3",
|
|
34
42
|
"typescript-eslint": "8.53.0",
|
|
35
43
|
"vite": "7.3.1",
|