floppy-disk 1.4.0 → 1.4.1-beta.1

package/README.md

@@ -8,7 +8,6 @@ This library was highly-inspired by [Zustand](https://www.npmjs.com/package/zust
 
 ```js
 import { create } from 'zustand'; // 3.3 kB (gzipped: 1.5 kB)
-
 import { createStore } from 'floppy-disk'; // 1.3 kB (gzipped: 702 B) 🎉
 
 import {
@@ -18,14 +17,13 @@ import {
   useInfiniteQuery,
   useMutation,
 } from '@tanstack/react-query'; // 41 kB (gzipped: 11 kB)
-
 import { createQuery, createMutation } from 'floppy-disk'; // 7.5 kB (gzipped: 2.6 kB) 🎉
 ```
 
 - Using Zustand & React-Query: https://demo-zustand-react-query.vercel.app/  
-  👉 Total: **309.22 kB** ~ gzipped 97.66 kB
+  👉 Total: **309.22 kB**
 - Using Floppy Disk: https://demo-floppy-disk.vercel.app/  
-  👉 Total: **282.86 kB** ~ gzipped 90.46 kB
+  👉 Total: **282.86 kB** 🎉
 
 ## Table of Contents
 
@@ -71,6 +69,8 @@ function Control() {
 }
 ```
 
+> Example: [https://codesandbox.io/.../examples/react/basic](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/basic)
+
 Control the reactivity. The concept is same as useEffect dependency array.
 
 ```jsx
@@ -100,6 +100,8 @@ function Cat() {
 }
 ```
 
+> Example: [https://codesandbox.io/.../examples/react/custom-reactivity](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/custom-reactivity)
+
 Reading/writing state and reacting to changes outside of components.
 
 ```js
@@ -122,11 +124,6 @@ const unsub = useCatStore.subscribe(
 );
 ```
 
-> **Examples:**
->
-> - [https://codesandbox.io/.../examples/react/basic](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/basic)
-> - [https://codesandbox.io/.../examples/react/custom-reactivity](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/custom-reactivity)
-
 ### Advanced Concept
 
 Set the state **silently** (without broadcast the state change to **any subscribers**).
@@ -176,10 +173,9 @@ const useCatStore = createStore(
 );
 ```
 
-> **Examples:**
->
-> - [https://codesandbox.io/.../examples/react/store-event](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/store-event)
-> - [https://codesandbox.io/.../examples/react/intercept](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/intercept)
+> Example:  
+> [https://codesandbox.io/.../examples/react/store-event](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/store-event)  
+> [https://codesandbox.io/.../examples/react/intercept](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/intercept)
 
 Let's go wild using IIFE.
 
@@ -238,9 +234,7 @@ function CatPageOptimized() {
 }
 ```
 
-> **Examples:**
->
-> - [https://codesandbox.io/.../examples/react/watch-component](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/watch-component)
+> Example: [https://codesandbox.io/.../examples/react/watch-component](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/watch-component)
 
 Want a local state instead of global state?  
 Or, want to set the initial state inside component?
@@ -289,12 +283,14 @@ function CatIsSleeping() {
   return (
     <>
       <div>Is Sleeping: {String(isSleeping)}</div>
-      <button onClick={useCatStore.get().increase}>Increase cat age</button>
+      <button onClick={useCatStore.get().increaseAge}>Increase cat age</button>
     </>
   );
 }
 ```
 
+> Example: [https://codesandbox.io/.../examples/react/local-state](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/local-state)
+
 Set default reactivity.
 
 ```jsx
@@ -368,9 +364,7 @@ function Control({ catId }) {
 }
 ```
 
-> **Examples:**
->
-> - [https://codesandbox.io/.../examples/react/stores](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/stores)
+> Example: [https://codesandbox.io/.../examples/react/stores](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/stores)
 
 ## Query & Mutation
 
@@ -403,9 +397,7 @@ function SingleQuery() {
 }
 ```
 
-> **Examples:**
->
-> - [https://codesandbox.io/.../examples/react/query](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/query)
+> Example: [https://codesandbox.io/.../examples/react/query](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/query)
 
 Custom reactivity:
 
@@ -501,6 +493,8 @@ function PokemonPage() {
 }
 ```
 
+> Example: [https://codesandbox.io/.../examples/react/query-with-param](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/query-with-param)
+
 Get data or do something outside component:
 
 ```jsx
@@ -558,6 +552,8 @@ function PokemonListPage() {
 }
 ```
 
+> Example: [https://codesandbox.io/.../examples/react/infinite-query](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/infinite-query)
+
 **Note:**
 
 - The default stale time is 3 seconds.
@@ -609,9 +605,7 @@ function Login() {
 }
 ```
 
-> **Examples:**
->
-> - [https://codesandbox.io/.../examples/react/mutation](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/mutation)
+> Example: [https://codesandbox.io/.../examples/react/mutation](https://codesandbox.io/p/sandbox/github/afiiif/floppy-disk/tree/main/examples/react/mutation)
 
 <br><br>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "floppy-disk",
-  "version": "1.4.0",
+  "version": "1.4.1-beta.1",
   "description": "FloppyDisk - lightweight, simple, and powerful state management library",
   "keywords": [
     "state",
@@ -30,9 +30,6 @@
   ],
   "types": "lib/index.d.ts",
   "typings": "lib/index.d.ts",
-  "engines": {
-    "node": ">=14"
-  },
   "scripts": {
     "prepare": "husky install",
     "build:cjs": "tsc -p tsconfig.prod.json",