juststore 0.4.2 → 0.4.3

package/dist/form.d.ts

@@ -1,5 +1,5 @@
 import type { FieldPath, FieldPathValue, FieldValues, IsEqual } from './path';
-import type { ArrayProxy, DerivedStateProps, IsNullable, MaybeNullable, ObjectMutationMethods, ValueState } from './types';
+import type { ArrayProxy, DerivedStateProps, IsNullable, MaybeNullable, ObjectMutationMethods, Prettify, ValueState } from './types';
 export { createForm, useForm, type CreateFormOptions, type DeepNonNullable, type FormArrayState, type FormObjectState, type FormState, type FormStore, type FormValueState };
 /**
  * Common form field methods available on every form state node.
@@ -13,7 +13,12 @@ type FormCommon = {
     setError: (error: string | undefined) => void;
 };
 type FormState<T> = IsEqual<T, unknown> extends true ? never : [NonNullable<T>] extends [readonly (infer U)[]] ? FormArrayState<U, IsNullable<T>> : [NonNullable<T>] extends [FieldValues] ? FormObjectState<NonNullable<T>, IsNullable<T>> : FormValueState<T>;
-interface FormValueState<T> extends Omit<ValueState<T>, 'withDefault' | 'derived'>, FormCommon {
+type FormReadOnlyState<T> = Prettify<Pick<FormValueState<Readonly<Required<T>>>, 'value' | 'use' | 'useCompute' | 'Render' | 'Show' | 'error' | 'setError'>>;
+interface FormValueState<T> extends Omit<ValueState<T>, 'ensureArray' | 'ensureObject' | 'withDefault' | 'derived'>, FormCommon {
+    /** Ensure the value is an array. */
+    ensureArray(): NonNullable<T> extends (infer U)[] ? FormArrayState<U> : never;
+    /** Ensure the value is an object. */
+    ensureObject(): NonNullable<T> extends FieldValues ? FormObjectState<NonNullable<T>> : never;
     /** Return a new state with a default value, and make the type non-nullable */
     withDefault(defaultValue: T): FormState<NonNullable<T>>;
     /** Virtual state derived from the current value.
@@ -30,10 +35,17 @@ interface FormValueState<T> extends Omit<ValueState<T>, 'withDefault' | 'derived
      */
     derived: <R>({ from, to }: DerivedStateProps<T, R>) => FormState<R>;
 }
-type FormArrayState<T, Nullable extends boolean = false, TT = MaybeNullable<T, Nullable>> = IsEqual<T, unknown> extends true ? never : FormValueState<TT[]> & ArrayProxy<TT, FormState<TT>>;
-type FormObjectState<T extends FieldValues, Nullable extends boolean = false> = {
+type FormObjectProxy<T extends FieldValues> = {
+    /** Virtual state for the object's keys.
+     *
+     * This does NOT read from a real `keys` property on the stored object; it results in a stable array of keys.
+     */
+    readonly keys: FormReadOnlyState<FieldPath<T>[]>;
+} & {
     [K in keyof T]-?: FormState<T[K]>;
-} & FormValueState<MaybeNullable<T, Nullable>> & ObjectMutationMethods;
+};
+type FormArrayState<T, Nullable extends boolean = false> = IsEqual<T, unknown> extends true ? never : FormValueState<MaybeNullable<T[], Nullable>> & ArrayProxy<T, FormState<T>>;
+type FormObjectState<T extends FieldValues, Nullable extends boolean = false> = FormObjectProxy<T> & FormValueState<MaybeNullable<T, Nullable>> & ObjectMutationMethods;
 /** Type for nested objects with proxy methods */
 type DeepNonNullable<T> = [NonNullable<T>] extends [readonly (infer U)[]] ? U[] : [NonNullable<T>] extends [FieldValues] ? {
     [K in keyof NonNullable<T>]-?: DeepNonNullable<NonNullable<T>[K]>;

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 export { createAtom, type Atom } from './atom';
 export type * from './form';
 export { useForm } from './form';
+export { isEqual } from './impl';
 export { createMemoryStore, useMemoryStore, type MemoryStore } from './memory';
 export { createMixedState } from './mixed_state';
 export type * from './path';

package/dist/index.js

@@ -1,5 +1,6 @@
 export { createAtom } from './atom';
 export { useForm } from './form';
+export { isEqual } from './impl';
 export { createMemoryStore, useMemoryStore } from './memory';
 export { createMixedState } from './mixed_state';
 export { createStore } from './store';

package/dist/mixed_state.js

@@ -1,3 +1,5 @@
+import { useCallback, useEffect, useState } from 'react';
+import { isEqual } from './impl';
 export { createMixedState };
 /**
  * Creates a mixed state that combines multiple states into a tuple.
@@ -22,7 +24,19 @@ function createMixedState(...states) {
         },
         use,
         useCompute(fn) {
-            return states.map(state => state.useCompute(value => fn(value)));
+            const [value, setValue] = useState(fn(this.value));
+            const recompute = useCallback(() => {
+                const newValue = fn(this.value);
+                // skip update if the new value is the same as the previous value
+                setValue(prev => (isEqual(prev, newValue) ? prev : newValue));
+            }, [fn]);
+            useEffect(() => {
+                const unsubscribeFns = states.map(state => state.subscribe(recompute));
+                return () => {
+                    unsubscribeFns.forEach(unsubscribe => unsubscribe());
+                };
+            });
+            return value;
         },
         Render({ children }) {
             const value = use();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "juststore",
-  "version": "0.4.2",
+  "version": "0.4.3",
   "description": "A small, expressive, and type-safe state management library for React.",
   "type": "module",
   "main": "dist/index.js",