better-preact-use-state 1.0.0 → 1.0.1

package/README.md

@@ -0,0 +1,101 @@
+# better-preact-use-state
+
+A utility that improves Preact's `useState` to be safer and more convenient.
+
+## Overview
+
+Preact's `useState` can cause unintended behavior when you want to keep a function as a state. `better-preact-use-state` solves this problem and is a utility designed for safer state management in Preact. It's designed to be a drop-in replacement for Preact's `useState` hook.
+
+## Installation
+
+You can install it with any of the following:
+
+```bash
+npm install better-preact-use-state
+```
+
+```bash
+yarn add better-preact-use-state
+```
+
+```bash
+pnpm add better-preact-use-state
+```
+
+## Usage
+
+`better-preact-use-state` can be used the same way as Preact's `useState`.
+
+```tsx
+import { useState } from 'better-preact-use-state';
+
+const MyComponent: FunctionalComponent = () => {
+    const [count, setCount] = useState(0);
+    const [name, setName] = useState('John Doe');
+
+    const incrementCount = () => setCount(count + 1);
+    const updateName = (newName: string) => setName(newName);
+
+    return (
+        <div>
+            <p>Count: {count}</p>
+            <button onClick={incrementCount}>Increment</button>
+
+            <p>Name: {name}</p>
+            <input
+                type='text'
+                value={name}
+                onChange={(e) => updateName(e.target.value)}
+            />
+        </div>
+    );
+};
+```
+
+## API Reference
+
+```typescript
+const [state, setState, { updateState, resetState }] = useState<T>(initialState: T);
+```
+
+-   `state`: The current state.
+-   `setState`: Function to update the state.
+-   `updateState`: Function to update the state based on the current state.
+-   `resetState`: Function to reset the state to the initial value.
+
+### `updateState`
+
+```typescript
+updateState(updateFn: (v: T) => T): void;
+```
+
+Updates the state by passing a function `updateFn` that takes the current state as an argument and returns the new state.
+
+### `resetState`
+
+```typescript
+resetState(): void;
+```
+
+Resets the state to the initial value.
+
+## Benefits of this library
+
+With Preact's standard `useState`, attempting to store a function as state can lead to unexpected behavior (the function being interpreted as an updater function). `better-preact-use-state` solves this issue and, by providing `updateState`, allows functions to be safely held as state. Also, `resetState` lets you easily return the state to its initial value.
+
+## Example Use Case
+
+Useful when you want to hold a function as state.
+
+```typescript
+const [fn, setFn] = useState(initialFn); // Holds a function as state
+
+// With Preact's standard useState, setFn(nextFn) will interpret nextFn as an updater function.
+
+// With better-preact-use-state, you can use updateState to update the function.
+updateState((currentFn) => nextFn);
+```
+
+## License
+
+MIT

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "better-preact-use-state",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "private": false,
   "license": "MIT",
   "author": "noshiro-pf <noshiro.pf@gmail.com>",