valtio-define 1.2.1 → 1.3.0

package/README.md

@@ -119,7 +119,7 @@ Save and restore your store state using the `persist` plugin.
 
     ```tsx
     import valtio from 'valtio-define'
-    import { persist } from 'valtio-define/plugins'
+    import { persist } from 'valtio-define/plugins/persist'
 
     valtio.use(persist())
     ```
@@ -202,10 +202,30 @@ Every store instance created with `defineStore` includes built-in utility method
   * **`$patch(obj | fn)`**: Bulk update the state.
   * **`$subscribe(callback)`**: Watch the entire store for changes.
   * **`$subscribeKey(key, callback)`**: Watch a specific property.
-  * **`$signal(selector)`**: Use a selector function inside JSX for fine-grained reactivity.
+  * **`$signal(selector)`**: Use a selector function to create a signal.
 
 -----
 
+### 📡 Signal
+
+> if you want to use the signal plugin, you need to import it and use it in your store.
+```tsx
+import { valtio } from 'valtio-define'
+import { signal } from 'valtio-define/plugins/signal'
+
+valtio.use(signal())
+```
+
+And add jsxImportSource at the beginning of your `.tsx` file
+
+```tsx
+/** @jsxImportSource valtio-signal */
+
+function App() {
+  return <div>{store.$signal(state => state.count)}</div>
+}
+```
+
 ## 🔌 Plugins
 
 ### Global vs. Per-Store

package/dist/index.d.mts

@@ -1,4 +1,4 @@
-import { a as GettersReturnType, c as PluginContext, d as StoreDefine, f as StoreDefineOptions, h as SubscribeKey, i as Getters, l as Signal, m as Subscribe, n as ActionsOmitThisParameter, o as Patch, p as StoreOptions, r as ActionsTree, s as Plugin, t as Actions, u as Store } from "./types-CqDu3QIJ.mjs";
+import { _ as SubscribeKey, a as GettersReturnType, c as Path, d as Signal, f as Store, g as Subscribe, h as StoreOptions, i as Getters, l as Plugin, m as StoreDefineOptions, n as ActionsOmitThisParameter, o as Op, p as StoreDefine, r as ActionsTree, s as Patch, t as Actions, u as PluginContext } from "./types-Cu8iJxyS.mjs";
 import { Snapshot } from "valtio";
 import { Dispatch, SetStateAction } from "react";
 
@@ -35,12 +35,15 @@ declare function use(plugin: Plugin): void;
  *
  * ```
  */
-declare function defineStore<S extends object = {}, A extends Actions<S> = {}, G extends Getters<S> = {}>(define: StoreDefine<S, A, G>): Store<S, A, G>;
+declare function defineStore<S extends object = {}, A extends Actions<S> = {}, G extends Getters<S> = {}>(options: StoreDefine<S, A, G>): Store<S, A, G>;
 //#endregion
 //#region src/hooks.d.ts
 declare function useStore<S extends object, A extends Actions<S>, G extends Getters<S>>(store: Store<S, A, G>, options?: {
   sync?: boolean;
 }): Snapshot<S & GettersReturnType<G> & A>;
+declare function useGetters<S extends object, G extends Getters<S>>(store: Store<S, any, G>, options?: {
+  sync?: boolean;
+}): GettersReturnType<G>;
 //#endregion
 //#region src/utils.d.ts
 declare function storeToState<S extends object, K extends keyof S>(store: Store<S>, key: K, options?: {
@@ -55,4 +58,4 @@ declare const _default: {
   use: typeof use;
 };
 //#endregion
-export { Actions, ActionsOmitThisParameter, ActionsTree, Getters, GettersReturnType, Patch, Plugin, PluginContext, Signal, Store, StoreDefine, StoreDefineOptions, StoreOptions, Subscribe, SubscribeKey, _default as default, defineStore, plugins, storeToState, storeToStates, use, useStore };
+export { Actions, ActionsOmitThisParameter, ActionsTree, Getters, GettersReturnType, Op, Patch, Path, Plugin, PluginContext, Signal, Store, StoreDefine, StoreDefineOptions, StoreOptions, Subscribe, SubscribeKey, _default as default, defineStore, plugins, storeToState, storeToStates, use, useGetters, useStore };

package/dist/index.mjs

@@ -1 +1 @@
-import{proxy as e,ref as t,subscribe as n,useSnapshot as r}from"valtio";import{createElement as i}from"react";import{subscribeKey as a}from"valtio/utils";const o=e([]);function s(e){o.push(e)}function c(s){let c=typeof s.state==`function`?s.state():s.state,u=s.getters||{},d=s.actions||{},f=e(c),p={},m={},h=new WeakSet;for(let e in d)p[e]=t(d[e].bind(f)),f[e]=p[e];for(let e in u)l(f,e,()=>u[e].call(f)),l(m,e,()=>f[e]);function g(e){return n(f,t=>e(f,t))}function _(e,t){return a(f,e,e=>t(e),!0)}function v(e){typeof e==`function`?e(f):Object.assign(f,e)}function y(e){return i(()=>e(r(f)))}function b(e){o.push(e),C(e)}let x={$subscribe:g,$subscribeKey:_,$patch:v,$state:f,$actions:p,$getters:m,$signal:y,use:b},S=new Proxy(x,{get(e,t){return t in p?p[t]:t in e?e[t]:f[t]},has(e,t){return t in e||t in p||t in f},set(e,t,n){return t in f?f[t]=n:e[t]=n,!0}});function C(e){h.has(e)||(h.add(e),e({store:S,options:s}))}for(let e of o)C(e);return n(o,()=>{for(let e of o)C(e)}),S}function l(e,t,n){Object.defineProperty(e,t,{get:n,enumerable:!0})}function u(e,t){return r(e.$state,t)}function d(e,t,n){let r=u(e,n);function i(n){typeof n==`function`?e.$patch(e=>{e[t]=n(e[t])}):e.$patch(e=>{e[t]=n})}return[r[t],i]}function f(e,t){return Object.fromEntries(Object.keys(e.$state).map(n=>[n,d(e,n,t)]))}var p={use:s};export{p as default,c as defineStore,o as plugins,d as storeToState,f as storeToStates,s as use,u as useStore};
+import{proxy as e,useSnapshot as t}from"valtio";import{computed as n}from"valtio-reactive";import{$ as r}from"valtio-signal";import{subscribeKey as i}from"valtio/utils";import{proxy as a,ref as o,subscribe as s}from"valtio/vanilla";const c=e([]);function l(e){c.push(e)}function u(e){let t=typeof e.state==`function`?e.state():e.state,l=e.getters||{},u=e.actions||{},p=a(t),m,h={},g=new WeakSet,_=n(f(l,p));for(let e of Object.keys(_))d(p,e,()=>_[e],{enumerable:!1});for(let e in u)h[e]=o(u[e].bind(p)),d(p,e,()=>h[e],{enumerable:!1});function v(e){return s(p,t=>e(p,t))}function y(e,t){return i(p,e,e=>t(e),!0)}function b(e){typeof e==`function`?e(p):Object.assign(p,e)}function x(e){return e(r(p))}function S(){m?.()}function C(e){E(e)}let w={$subscribe:v,$subscribeKey:y,$patch:b,$state:p,$actions:h,$getters:_,$dispose:S,$signal:x,use:C},T=new Proxy(w,{get(e,t){return t in h?h[t]:t in e?e[t]:p[t]},has(e,t){return t in e||t in h||t in p},set(e,t,n){return t in p?p[t]=n:e[t]=n,!0}});function E(t){g.has(t)||(g.add(t),t({store:T,options:e}))}for(let e of c)E(e);return m=s(c,()=>{for(let e of c)E(e)}),T}function d(e,t,n,r){Object.defineProperty(e,t,{get:n,enumerable:!0,...r})}function f(e,t){let n={};for(let r in e)n[r]=e[r].bind(t);return n}function p(e,n){return t(e.$state,n)}function m(e,n){return t(e.$getters,n)}function h(e,t,n){let r=p(e,n);function i(n){typeof n==`function`?e.$patch(e=>{e[t]=n(e[t])}):e.$patch(e=>{e[t]=n})}return[r[t],i]}function g(e,t){return Object.fromEntries(Object.keys(e.$state).map(n=>[n,h(e,n,t)]))}var _={use:l};export{_ as default,u as defineStore,c as plugins,h as storeToState,g as storeToStates,l as use,m as useGetters,p as useStore};

package/dist/plugins/index.d.mts

@@ -1,2 +1,3 @@
 import { PersistentMountOptions, persist } from "./persist/index.mjs";
-export { PersistentMountOptions, persist };
+import { signal } from "./signal/index.mjs";
+export { PersistentMountOptions, persist, signal };

package/dist/plugins/index.mjs

@@ -1 +1 @@
-import{persist as e}from"./persist/index.mjs";export{e as persist};
+import{persist as e}from"./persist/index.mjs";import{signal as t}from"./signal/index.mjs";export{e as persist,t as signal};

package/dist/plugins/persist/index.d.mts

@@ -1,4 +1,4 @@
-import { s as Plugin } from "../../types-CqDu3QIJ.mjs";
+import { l as Plugin } from "../../types-Cu8iJxyS.mjs";
 import { PersistentOptions, PersistentStore } from "./types.mjs";
 
 //#region src/plugins/persist/index.d.ts
@@ -15,7 +15,7 @@ declare module 'valtio-define' {
   interface StoreDefineOptions<S extends object> {
     persist?: PersistentOptions<S> | boolean;
   }
-  interface StoreOptions extends PersistentStore {}
+  interface StoreOptions<S, A, G> extends PersistentStore {}
 }
 //#endregion
 export { PersistentMountOptions, persist };

package/dist/plugins/signal/index.d.mts

@@ -0,0 +1,10 @@
+import { i as Getters, l as Plugin } from "../../types-Cu8iJxyS.mjs";
+import { SignalStore } from "./types.mjs";
+
+//#region src/plugins/signal/index.d.ts
+declare function signal(): Plugin;
+declare module 'valtio-define' {
+  interface StoreOptions<S, A, G extends Getters<S>> extends SignalStore<S, G> {}
+}
+//#endregion
+export { signal };

package/dist/plugins/signal/index.mjs

@@ -0,0 +1 @@
+import{$ as e}from"valtio-signal";function t(){return t=>{function n(n){let r=e(t.store.$state);return n?n(r):r}t.store.$signal=n}}export{t as signal};

package/dist/plugins/signal/jsx-dev-runtime.d.mts

@@ -0,0 +1,2 @@
+import { Fragment, jsx, jsxDEV, jsxs } from "./jsx-runtime.mjs";
+export { Fragment, jsx, jsxDEV, jsxs };

package/dist/plugins/signal/jsx-dev-runtime.mjs

@@ -0,0 +1 @@
+import{Fragment as e,jsx as t,jsxDEV as n,jsxs as r}from"./jsx-runtime.mjs";export{e as Fragment,t as jsx,n as jsxDEV,r as jsxs};

package/dist/plugins/signal/jsx-runtime.d.mts

@@ -0,0 +1,11 @@
+import { Fragment, jsx, jsxDEV, jsxs } from "valtio-signal/jsx-runtime";
+
+//#region src/plugins/signal/jsx-runtime.d.ts
+declare global {
+  namespace JSX {
+    interface IntrinsicElements extends React.JSX.IntrinsicElements {}
+    interface Element extends React.ReactElement<any, any> {}
+  }
+}
+//#endregion
+export { Fragment, jsx, jsxDEV, jsxs };

package/dist/plugins/signal/jsx-runtime.mjs

@@ -0,0 +1 @@
+import{Fragment as e,jsx as t,jsxDEV as n,jsxs as r}from"valtio-signal/jsx-runtime";export{e as Fragment,t as jsx,n as jsxDEV,r as jsxs};

package/dist/plugins/signal/types.d.mts

@@ -0,0 +1,12 @@
+import { a as GettersReturnType, i as Getters } from "../../types-Cu8iJxyS.mjs";
+
+//#region src/plugins/signal/types.d.ts
+interface Signal<S> {
+  (): S;
+  <T>(fn: (state: S) => T): T;
+}
+interface SignalStore<S, G extends Getters<S>> {
+  $signal: Signal<S & GettersReturnType<G>>;
+}
+//#endregion
+export { Signal, SignalStore };

package/dist/plugins/signal/types.mjs

@@ -0,0 +1 @@
+export{};

package/dist/{types-CqDu3QIJ.d.mts → types-Cu8iJxyS.d.mts}

@@ -18,7 +18,7 @@ interface Signal<S, G extends Getters<S>> {
 type Path = (string | symbol)[];
 type Op = [op: 'set', path: Path, value: unknown, prevValue: unknown] | [op: 'delete', path: Path, prevValue: unknown];
 interface Subscribe<S, G extends Getters<S>> {
-  (listener: (state: S & GettersReturnType<G>, opts: Op) => void): () => void;
+  (listener: (state: S & GettersReturnType<G>, opts: Op[]) => void): () => void;
 }
 interface SubscribeKey<S, G extends Getters<S>> {
   <T extends keyof S | keyof G>(key: T, listener: (state: (S & GettersReturnType<G>)[T]) => void): () => void;
@@ -26,17 +26,17 @@ interface SubscribeKey<S, G extends Getters<S>> {
 interface Patch<S, G extends Getters<S>> {
   (patch: Partial<S> | ((state: S & GettersReturnType<G>) => void)): void;
 }
-interface StoreOptions {}
+interface StoreOptions<S, A, G> {}
 type Store<S, A extends Actions<S> = {}, G extends Getters<S> = {}> = {
   $subscribe: Subscribe<S, G>;
   $subscribeKey: SubscribeKey<S, G>;
   $patch: Patch<S, G>;
-  $state: S & GettersReturnType<G> & ActionsOmitThisParameter<A>;
+  $state: S;
   $actions: ActionsOmitThisParameter<A>;
   $getters: GettersReturnType<G>;
+  $dispose: () => void;
   use: (plugin: Plugin) => void;
-  $signal: Signal<S, G>;
-} & S & GettersReturnType<G> & ActionsOmitThisParameter<A> & StoreOptions;
+} & S & GettersReturnType<G> & ActionsOmitThisParameter<A> & StoreOptions<S, A, G>;
 interface PluginContext<S extends object = Record<string, unknown>> {
   store: Store<S, Actions<S>, Getters<S>>;
   options: StoreDefine<S, ActionsTree, Getters<S>>;
@@ -45,4 +45,4 @@ interface Plugin {
   <S extends object = Record<string, unknown>>(context: PluginContext<S>): void;
 }
 //#endregion
-export { GettersReturnType as a, PluginContext as c, StoreDefine as d, StoreDefineOptions as f, SubscribeKey as h, Getters as i, Signal as l, Subscribe as m, ActionsOmitThisParameter as n, Patch as o, StoreOptions as p, ActionsTree as r, Plugin as s, Actions as t, Store as u };
+export { SubscribeKey as _, GettersReturnType as a, Path as c, Signal as d, Store as f, Subscribe as g, StoreOptions as h, Getters as i, Plugin as l, StoreDefineOptions as m, ActionsOmitThisParameter as n, Op as o, StoreDefine as p, ActionsTree as r, Patch as s, Actions as t, PluginContext as u };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "valtio-define",
   "type": "module",
-  "version": "1.2.1",
+  "version": "1.3.0",
   "description": "⚡quickly create a fully functional and robust Valtio factory",
   "author": "Hairyf <wwu710632@gmail.com>",
   "license": "MIT",
@@ -26,6 +26,10 @@
     "./plugins": "./dist/plugins/index.mjs",
     "./plugins/persist": "./dist/plugins/persist/index.mjs",
     "./plugins/persist/types": "./dist/plugins/persist/types.mjs",
+    "./plugins/signal": "./dist/plugins/signal/index.mjs",
+    "./plugins/signal/jsx-dev-runtime": "./dist/plugins/signal/jsx-dev-runtime.mjs",
+    "./plugins/signal/jsx-runtime": "./dist/plugins/signal/jsx-runtime.mjs",
+    "./plugins/signal/types": "./dist/plugins/signal/types.mjs",
     "./package.json": "./package.json"
   },
   "files": [
@@ -38,7 +42,9 @@
     "@hairy/utils": "^1.47.0",
     "destr": "^2.0.5",
     "structure-id": "^1.2.9",
-    "valtio": "^2.3.0"
+    "valtio": "^2.3.0",
+    "valtio-reactive": "^0.2.0",
+    "valtio-signal": "^0.6.0"
   },
   "devDependencies": {
     "@antfu/eslint-config": "^7.6.1",