@thefoxieflow/signalctx 1.0.0 → 1.0.1

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.
Files changed (2) hide show
  1. package/README.md +19 -22
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -167,7 +167,7 @@ set((s) => {
167
167
  Scoped update:
168
168
 
169
169
  ```ts
170
- const store = newStore(() => ({
170
+ const store = newSignal(() => ({
171
171
  book: { title: "1984", page: 1 },
172
172
  user: { name: "Alice" },
173
173
  }));
@@ -212,7 +212,7 @@ The returned function has these properties:
212
212
  - **`useAppCtx(selector, options)`** - Hook to select state
213
213
  - **`useAppCtx.Provider`** - Context provider component
214
214
  - **`useAppCtx.useSet(selector, options)`** - Hook to get setter function
215
- - **`useAppCtx.useStore(options)`** - Hook to access raw store
215
+ - **`useAppCtx.useSignal(options)`** - Hook to access raw signal underlying the context
216
216
 
217
217
  ---
218
218
 
@@ -226,12 +226,12 @@ type Props = {
226
226
  children: React.ReactNode;
227
227
  };
228
228
 
229
- export function StoreProvider({ children }: Props) {
229
+ export function AppCtxProvider({ children }: Props) {
230
230
  return <useAppCtx.Provider>{children}</useAppCtx.Provider>;
231
231
  }
232
232
 
233
233
  // overwrite value
234
- export function StoreProvider({ children }: Props) {
234
+ export function AppCtxProvider({ children }: Props) {
235
235
  return (
236
236
  <useAppCtx.Provider
237
237
  value={{
@@ -246,9 +246,9 @@ export function StoreProvider({ children }: Props) {
246
246
  ```
247
247
 
248
248
  ```tsx
249
- <StoreProvider>
249
+ <AppCtxProvider>
250
250
  <App />
251
- </StoreProvider>
251
+ </AppCtxProvider>
252
252
  ```
253
253
 
254
254
  ---
@@ -360,18 +360,18 @@ const count = useAppCtx((s) => s.count);
360
360
 
361
361
  ## 🧩 Multiple Stores
362
362
 
363
- You can create isolated stores using `storeName`.
363
+ You can create isolated stores using `name`.
364
364
 
365
365
  ```tsx
366
366
  type Props = {
367
367
  children: React.ReactNode;
368
- storeName?: string;
368
+ name?: string;
369
369
  initialValue?: { count: number; book: { title: string } };
370
370
  };
371
371
 
372
- export function StoreProvider({ children, storeName, initialValue }: Props) {
372
+ export function AppCtxProvider({ children, name, initialValue }: Props) {
373
373
  return (
374
- <useAppCtx.Provider value={initialValue} storeName={storeName}>
374
+ <useAppCtx.Provider value={initialValue} name={name}>
375
375
  {children}
376
376
  </useAppCtx.Provider>
377
377
  );
@@ -381,31 +381,28 @@ export function StoreProvider({ children, storeName, initialValue }: Props) {
381
381
  ### Usage
382
382
 
383
383
  ```tsx
384
- <StoreProvider
385
- storeName="storeA"
386
- initialValue={{ count: 1, book: { title: "A" } }}
387
- >
384
+ <AppCtxProvider name="storeA" initialValue={{ count: 1, book: { title: "A" } }}>
388
385
  {/* useAppCtx(s => s.book) is from storeA */}
389
386
  <AppA />
390
- <StoreProvider
391
- storeName="storeB"
387
+ <AppCtxProvider
388
+ name="storeB"
392
389
  initialValue={{ count: 5, book: { title: "B" } }}
393
390
  >
394
391
  {/* useAppCtx(s => s.book) is from storeB */}
395
- {/* useAppCtx(s => s.book, { storeName: "storeA" }) is from storeA */}
392
+ {/* useAppCtx(s => s.book, { name: "storeA" }) is from storeA */}
396
393
  <AppB />
397
- </StoreProvider>
398
- </StoreProvider>;
394
+ </AppCtxProvider>
395
+ </AppCtxProvider>;
399
396
 
400
397
  function AppB() {
401
398
  // Read from parent storeB, book.title = "B"
402
- const currentBook = useAppCtx((s) => s.book); // or useAppCtx(s => s.book, { storeName: "storeB" })
399
+ const currentBook = useAppCtx((s) => s.book); // or useAppCtx(s => s.book, { name: "storeB" })
403
400
 
404
- const layerAbook = useAppCtx((s) => s.book, { storeName: "storeA" }); // book.title = "A"
401
+ const layerAbook = useAppCtx((s) => s.book, { name: "storeA" }); // book.title = "A"
405
402
 
406
403
  // AppB want to change data in context StoreA layer
407
404
  const setLayerAbook = useAppCtx.useSet((s) => s.book, {
408
- storeName: "storeA",
405
+ name: "storeA",
409
406
  });
410
407
 
411
408
  const handleSetLayerABook = (text) => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@thefoxieflow/signalctx",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "description": "Lightweight signal-based React context store",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",