valtio-define 0.1.0 → 0.2.0

package/LICENSE.md

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2025-PRESENT Hairyf <wwu710632@gmail.com>
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2025-PRESENT Hairyf <wwu710632@gmail.com>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,253 +1,253 @@
-# valtio-define
-
-[![npm version][npm-version-src]][npm-version-href]
-[![npm downloads][npm-downloads-src]][npm-downloads-href]
-[![bundle][bundle-src]][bundle-href]
-[![JSDocs][jsdocs-src]][jsdocs-href]
-[![License][license-src]][license-href]
-
-⚡ Quickly create a fully functional and robust Valtio factory
-
-## Installation
-
-```bash
-npm install valtio-define
-```
-
-## Usage
-
-### Basic Store
-
-```tsx
-import { defineStore, useStore } from 'valtio-define'
-
-const store = defineStore({
-  state: () => ({ count: 0 }),
-  actions: {
-    increment() {
-      this.count++
-    },
-  },
-})
-
-function Counter() {
-  const state = useStore(store)
-  return (
-    <div>
-      <button onClick={store.increment}>Increment</button>
-      <div>{state.count}</div>
-    </div>
-  )
-}
-```
-
-### With Getters
-
-```tsx
-const store = defineStore({
-  state: () => ({ count: 0 }),
-  getters: {
-    doubled() {
-      return this.count * 2
-    },
-  },
-  actions: {
-    increment() {
-      this.count++
-    },
-  },
-})
-
-function Counter() {
-  const state = useStore(store)
-  return (
-    <div>
-      <div>
-        Count:
-        {state.count}
-      </div>
-      <div>
-        Doubled:
-        {state.doubled}
-      </div>
-      <button onClick={store.increment}>Increment</button>
-    </div>
-  )
-}
-```
-
-### Async Actions with Status
-
-```tsx
-import { defineStore, useStatus, useStore } from 'valtio-define'
-
-const store = defineStore({
-  state: () => ({ data: null }),
-  actions: {
-    async fetchData() {
-      const response = await fetch('/api/data')
-      this.data = await response.json()
-    },
-  },
-})
-
-function DataComponent() {
-  const state = useStore(store)
-  const status = useStatus(store)
-
-  return (
-    <div>
-      {status.loading && <div> Store all actions are loading...</div>}
-      {status.finished && <div> Store all actions are finished...</div>}
-      {status.error && <div> Store all actions are error...</div>}
-
-      {status.fetchData.finished && <div> Data fetched successfully...</div>}
-      {status.fetchData.error && (
-        <div>
-          {' '}
-          Error fetching data:
-          {status.fetchData.error.message}
-        </div>
-      )}
-      {state.data && <div>{JSON.stringify(state.data)}</div>}
-      <button onClick={store.fetchData}>Fetch Data</button>
-    </div>
-  )
-}
-```
-
-### Persistence
-
-```tsx
-const store = defineStore(
-  {
-    state: () => ({ count: 0 }),
-    actions: {
-      increment() {
-        this.count++
-      },
-    },
-  },
-  {
-    persist: true // or { key: 'my-store', storage: localStorage, paths: ['count'] }
-  }
-)
-```
-
-If the persist is a boolean value, it will use `structure-id` to generate a unique key for the store.
-
-### Subscribe to Changes
-
-```tsx
-const store = defineStore({
-  state: () => ({ count: 0 }),
-  actions: {
-    increment() {
-      this.count++
-    },
-  },
-})
-
-// Subscribe to state changes
-const unsubscribe = store.$subscribe((state) => {
-  console.log('State changed:', state)
-})
-
-// Subscribe to status changes
-const unsubscribeStatus = store.$subscribe.status((status) => {
-  console.log('Status changed:', status)
-})
-```
-
-### Patch State
-
-```tsx
-// Patch with object
-store.$patch({ count: 10 })
-
-// Patch with function
-store.$patch((state) => {
-  state.count += 5
-})
-```
-
-### Signal (JSX Component)
-
-```tsx
-function App() {
-  return (
-    <div>
-      {store.$signal(state => (
-        <div>
-          Count:
-          {state.count}
-        </div>
-      ))}
-      {store.$signal.status(status => (
-        status.loading && <div>Loading...</div>
-      ))}
-    </div>
-  )
-}
-```
-
-## API
-
-### `defineStore(store, options?)`
-
-Creates a store with state, actions, and getters.
-
-**Parameters:**
-- `store.state`: Initial state object or factory function
-- `store.actions`: Object containing action methods
-- `store.getters`: Object containing getter methods
-- `options.persist`: Persistence configuration (boolean or object)
-
-**Returns:** Store instance with reactive state and actions
-
-### `useStore(store)`
-
-React hook that returns a snapshot of the store state.
-
-**Parameters:**
-- `store`: Store instance created by `defineStore`
-
-**Returns:** Snapshot of the store state
-
-### `useStatus(store)`
-
-React hook that returns the status of all actions.
-
-**Parameters:**
-- `store`: Store instance created by `defineStore`
-
-**Returns:** Status object with loading, finished, and error states
-
-### `proxyWithPersistent(initialObject, options?)`
-
-Creates a persistent proxy state.
-
-**Parameters:**
-- `initialObject`: Initial state object
-- `options.key`: Storage key (auto-generated if not provided)
-- `options.storage`: Storage instance (defaults to localStorage)
-- `options.paths`: Array of paths to persist (defaults to all)
-
-**Returns:** Persistent proxy state
-
-## License
-
-[MIT](./LICENSE) License © [Hairyf](https://github.com/hairyf)
-
-<!-- Badges -->
-
-[npm-version-src]: https://img.shields.io/npm/v/valtio-define?style=flat&colorA=080f12&colorB=1fa669
-[npm-version-href]: https://npmjs.com/package/valtio-define
-[npm-downloads-src]: https://img.shields.io/npm/dm/valtio-define?style=flat&colorA=080f12&colorB=1fa669
-[npm-downloads-href]: https://npmjs.com/package/valtio-define
-[bundle-src]: https://img.shields.io/bundlephobia/minzip/valtio-define?style=flat&colorA=080f12&colorB=1fa669&label=minzip
-[bundle-href]: https://bundlephobia.com/result?p=valtio-define
-[license-src]: https://img.shields.io/github/license/hairyf/valtio-define.svg?style=flat&colorA=080f12&colorB=1fa669
-[license-href]: https://github.com/hairyf/valtio-define/blob/main/LICENSE
-[jsdocs-src]: https://img.shields.io/badge/jsdocs-reference-080f12?style=flat&colorA=080f12&colorB=1fa669
-[jsdocs-href]: https://www.jsdocs.io/package/valtio-define
+# valtio-define
+
+[![npm version][npm-version-src]][npm-version-href]
+[![npm downloads][npm-downloads-src]][npm-downloads-href]
+[![bundle][bundle-src]][bundle-href]
+[![JSDocs][jsdocs-src]][jsdocs-href]
+[![License][license-src]][license-href]
+
+⚡ Quickly create a fully functional and robust Valtio factory
+
+## Installation
+
+```bash
+npm install valtio-define
+```
+
+## Usage
+
+### Basic Store
+
+```tsx
+import { defineStore, useStore } from 'valtio-define'
+
+const store = defineStore({
+  state: () => ({ count: 0 }),
+  actions: {
+    increment() {
+      this.count++
+    },
+  },
+})
+
+function Counter() {
+  const state = useStore(store)
+  return (
+    <div>
+      <button onClick={store.increment}>Increment</button>
+      <div>{state.count}</div>
+    </div>
+  )
+}
+```
+
+### With Getters
+
+```tsx
+const store = defineStore({
+  state: () => ({ count: 0 }),
+  getters: {
+    doubled() {
+      return this.count * 2
+    },
+  },
+  actions: {
+    increment() {
+      this.count++
+    },
+  },
+})
+
+function Counter() {
+  const state = useStore(store)
+  return (
+    <div>
+      <div>
+        Count:
+        {state.count}
+      </div>
+      <div>
+        Doubled:
+        {state.doubled}
+      </div>
+      <button onClick={store.increment}>Increment</button>
+    </div>
+  )
+}
+```
+
+### Async Actions with Status
+
+```tsx
+import { defineStore, useStatus, useStore } from 'valtio-define'
+
+const store = defineStore({
+  state: () => ({ data: null }),
+  actions: {
+    async fetchData() {
+      const response = await fetch('/api/data')
+      this.data = await response.json()
+    },
+  },
+})
+
+function DataComponent() {
+  const state = useStore(store)
+  const status = useStatus(store)
+
+  return (
+    <div>
+      {status.loading && <div> Store all actions are loading...</div>}
+      {status.finished && <div> Store all actions are finished...</div>}
+      {status.error && <div> Store all actions are error...</div>}
+
+      {status.fetchData.finished && <div> Data fetched successfully...</div>}
+      {status.fetchData.error && (
+        <div>
+          {' '}
+          Error fetching data:
+          {status.fetchData.error.message}
+        </div>
+      )}
+      {state.data && <div>{JSON.stringify(state.data)}</div>}
+      <button onClick={store.fetchData}>Fetch Data</button>
+    </div>
+  )
+}
+```
+
+### Persistence
+
+```tsx
+const store = defineStore(
+  {
+    state: () => ({ count: 0 }),
+    actions: {
+      increment() {
+        this.count++
+      },
+    },
+  },
+  {
+    persist: true // or { key: 'my-store', storage: localStorage, paths: ['count'] }
+  }
+)
+```
+
+If the persist is a boolean value, it will use `structure-id` to generate a unique key for the store.
+
+### Subscribe to Changes
+
+```tsx
+const store = defineStore({
+  state: () => ({ count: 0 }),
+  actions: {
+    increment() {
+      this.count++
+    },
+  },
+})
+
+// Subscribe to state changes
+const unsubscribe = store.$subscribe((state) => {
+  console.log('State changed:', state)
+})
+
+// Subscribe to status changes
+const unsubscribeStatus = store.$subscribe.status((status) => {
+  console.log('Status changed:', status)
+})
+```
+
+### Patch State
+
+```tsx
+// Patch with object
+store.$patch({ count: 10 })
+
+// Patch with function
+store.$patch((state) => {
+  state.count += 5
+})
+```
+
+### Signal (JSX Component)
+
+```tsx
+function App() {
+  return (
+    <div>
+      {store.$signal(state => (
+        <div>
+          Count:
+          {state.count}
+        </div>
+      ))}
+      {store.$signal.status(status => (
+        status.loading && <div>Loading...</div>
+      ))}
+    </div>
+  )
+}
+```
+
+## API
+
+### `defineStore(store, options?)`
+
+Creates a store with state, actions, and getters.
+
+**Parameters:**
+- `store.state`: Initial state object or factory function
+- `store.actions`: Object containing action methods
+- `store.getters`: Object containing getter methods
+- `options.persist`: Persistence configuration (boolean or object)
+
+**Returns:** Store instance with reactive state and actions
+
+### `useStore(store)`
+
+React hook that returns a snapshot of the store state.
+
+**Parameters:**
+- `store`: Store instance created by `defineStore`
+
+**Returns:** Snapshot of the store state
+
+### `useStatus(store)`
+
+React hook that returns the status of all actions.
+
+**Parameters:**
+- `store`: Store instance created by `defineStore`
+
+**Returns:** Status object with loading, finished, and error states
+
+### `proxyWithPersistent(initialObject, options?)`
+
+Creates a persistent proxy state.
+
+**Parameters:**
+- `initialObject`: Initial state object
+- `options.key`: Storage key (auto-generated if not provided)
+- `options.storage`: Storage instance (defaults to localStorage)
+- `options.paths`: Array of paths to persist (defaults to all)
+
+**Returns:** Persistent proxy state
+
+## License
+
+[MIT](./LICENSE) License © [Hairyf](https://github.com/hairyf)
+
+<!-- Badges -->
+
+[npm-version-src]: https://img.shields.io/npm/v/valtio-define?style=flat&colorA=080f12&colorB=1fa669
+[npm-version-href]: https://npmjs.com/package/valtio-define
+[npm-downloads-src]: https://img.shields.io/npm/dm/valtio-define?style=flat&colorA=080f12&colorB=1fa669
+[npm-downloads-href]: https://npmjs.com/package/valtio-define
+[bundle-src]: https://img.shields.io/bundlephobia/minzip/valtio-define?style=flat&colorA=080f12&colorB=1fa669&label=minzip
+[bundle-href]: https://bundlephobia.com/result?p=valtio-define
+[license-src]: https://img.shields.io/github/license/hairyf/valtio-define.svg?style=flat&colorA=080f12&colorB=1fa669
+[license-href]: https://github.com/hairyf/valtio-define/blob/main/LICENSE
+[jsdocs-src]: https://img.shields.io/badge/jsdocs-reference-080f12?style=flat&colorA=080f12&colorB=1fa669
+[jsdocs-href]: https://www.jsdocs.io/package/valtio-define

package/dist/index.d.mts

@@ -7,7 +7,7 @@ type ActionsOmitThisParameter<A extends Actions<any>> = { [K in keyof A]: (...ar
 interface Status {
   finished: boolean;
   loading: boolean;
-  error: Error | null;
+  error?: Error;
 }
 type ActionsStatus<A extends Actions<any>> = Status & { [K in keyof A]: Status };
 type GettersReturnType<G extends Getters<any>> = { [K in keyof G]: ReturnType<G[K]> };
@@ -74,7 +74,7 @@ interface PersistentOptions {
  *
  * ```
  */
-declare function defineStore<S extends object, A extends Actions<S>, G extends Getters<S>>(store: StoreDefine<S, A, G>, options?: StoreOptions): Store<S, A, G>;
+declare function defineStore<S extends object, A extends Actions<S>, G extends Getters<S>>(store: StoreDefine<S, A, G> & StoreOptions): Store<S, A, G>;
 //#endregion
 //#region src/persistent.d.ts
 declare function proxyWithPersistent<T extends object>(initialObject: T, options?: PersistentOptions): T;
@@ -83,6 +83,6 @@ declare function proxyWithPersistent<T extends object>(initialObject: T, options
 declare function useStatus<S extends object, A extends Actions<S>, G extends Getters<S>>(store: Store<S, A, G>): Snapshot<ActionsStatus<A>>;
 //#endregion
 //#region src/use-store.d.ts
-declare function useStore<S extends object, A extends Actions<S>, G extends Getters<S>>(store: Store<S, A, G>): Snapshot<S & GettersReturnType<G>>;
+declare function useStore<S extends object, A extends Actions<S>, G extends Getters<S>>(store: Store<S, A, G>): Snapshot<S & GettersReturnType<G> & A>;
 //#endregion
 export { defineStore, proxyWithPersistent, useStatus, useStore };

package/dist/index.mjs

@@ -1,5 +1,5 @@
 import { createElement } from "react";
-import { proxy, subscribe, useSnapshot } from "valtio";
+import { proxy, ref, subscribe, useSnapshot } from "valtio";
 import { jsonTryParse } from "@hairy/utils";
 import { generateStructureId } from "structure-id";
 
@@ -14,6 +14,7 @@ function track(action, status) {
 	};
 	const fulfilled = (value) => {
 		status.finished = true;
+		if (status.error) delete status.error;
 		done();
 		return value;
 	};
@@ -87,16 +88,16 @@ function proxyWithPersistent(initialObject, options = {}) {
 *
 * ```
 */
-function defineStore(store, options = {}) {
+function defineStore(store) {
 	const state = typeof store.state === "function" ? store.state() : store.state;
 	const getters = store.getters || {};
 	const actions = store.actions || {};
 	const status = {};
 	status.finished = false;
 	status.loading = false;
-	status.error = null;
+	status.error = void 0;
 	const $status = proxy(status);
-	const $state = options.persist ? proxyWithPersistent(state, options.persist === true ? {} : options.persist) : proxy(state);
+	const $state = store.persist ? proxyWithPersistent(state, store.persist === true ? {} : store.persist) : proxy(state);
 	const $actions = {};
 	const $getters = {};
 	setupActions($state, actions, $actions, $status);
@@ -134,10 +135,13 @@ function setupActions($state, actions, $actions, $status) {
 		$status[key] = {
 			finished: false,
 			loading: false,
-			error: null
+			error: void 0
 		};
 		$actions[key] = track(actions[key].bind($state), $status[key]);
-		Object.defineProperty($state, key, { get: () => $actions[key] });
+		Object.defineProperty($state, key, {
+			get: () => ref($actions[key]),
+			enumerable: false
+		});
 	}
 }
 function setupGetters(state, $state, getters, $getters) {
@@ -162,7 +166,9 @@ function setupStatus($actions, $status) {
 		enumerable: true
 	});
 	Object.defineProperty($status, "error", {
-		get: () => Object.keys($actions).find((key) => $status[key].error),
+		get: () => {
+			return $status[Object.keys($actions).find((key) => $status[key].error) || ""]?.error;
+		},
 		enumerable: true
 	});
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "valtio-define",
   "type": "module",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "⚡quickly create a fully functional and robust Valtio factory",
   "author": "Hairyf <wwu710632@gmail.com>",
   "license": "MIT",
@@ -13,13 +13,15 @@
   "bugs": "https://github.com/hairyf/valtio-define/issues",
   "keywords": [],
   "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  },
   "exports": {
     ".": "./dist/index.mjs",
     "./package.json": "./package.json"
   },
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
-  "types": "./dist/index.d.mts",
   "files": [
     "dist"
   ],
@@ -58,6 +60,7 @@
   "lint-staged": {
     "*": "eslint --fix"
   },
+  "types": "./dist/index.d.mts",
   "scripts": {
     "build": "tsdown",
     "dev": "tsdown --watch",