Merge pull request #39 from klm-lab/dev

Enhance set

package.json

@@ -1,6 +1,6 @@
 {
   "name": "aio-inputs",
-  "version": "3.1.4",
+  "version": "3.1.41",
   "description": "An opinionated inputs state manager for react",
   "scripts": {
     "build": "npm ci && npm run build:noci",

src/inputs/index.ts → src/inputs/form.ts

@@ -1,15 +1,15 @@
 import {
   Computed,
+  EachCallback,
   type Input,
   InputConfig,
-  EachCallback,
   Unknown
 } from "../types";
 import { finalizeInputs, touchInput, transformToArray } from "../util";
 import { newSet, persist } from "../util/helper";
 import { extractValues } from "./handlers/values";
 
-export const createInputs = (initialState: Unknown, config: InputConfig) => {
+export const createForm = (initialState: Unknown, config: InputConfig) => {
   // pid => persistID to persist data on component unmount
   const pid = config.pid;
   if (pid && persist[pid]) {
@@ -60,7 +60,7 @@ export const createInputs = (initialState: Unknown, config: InputConfig) => {
   };
 
   const result: Computed = {
-    cp: {
+    f: {
       reset,
       getValues: () => extractValues(st.get("i")),
       each,

src/inputs/handlers/changes.ts

@@ -20,7 +20,8 @@ export const initValue = (
   getFile?: GetFile
 ) => {
   // Clone inputs
-  const input = store.get(`i.${objKey}`);
+  const entry = store.get("i");
+  const input = entry[objKey];
   if (type === FILE) {
     [value].flat().forEach((v: Unknown, index: number) => {
       input.files[index] = parseFile(objKey, store, v, !!getFile, {} as File);
@@ -35,21 +36,26 @@ export const initValue = (
     });
   } else if (type === RADIO) {
     // Check right radio input
-    setValue(input, input.value === value);
+    // setValue(input, input.value === value);
+    setCRValues(store, entry, input.name, (i) =>
+      setValue(i, i.value === value)
+    );
   } else if (type === CHECKBOX) {
-    // Toggle the checkbox input
-    const checked = value.length ? value.includes(input.value) : value;
-    setValue(input, checked);
-    if (checked && value.length) {
-      store.ev[input.name].s = newSet(value);
-    }
+    setCRValues(store, entry, input.name, (i) => {
+      const checked = value.push ? value.includes(i.value) : value;
+      // Toggle the checkbox input
+      setValue(i, checked);
+      if (checked && value.push) {
+        store.ev[i.name].s = newSet(value);
+      }
+    });
   } else {
     setValue(input, value, false);
   }
+  input.valid = true;
   // Sync handlers
   store.set((ref) => {
-    ref.i[objKey] = input;
-    ref.i[objKey].valid = true;
+    ref.i = entry;
   });
 };
 

src/inputs/hook/index.ts

@@ -1,4 +1,4 @@
-import { createInputs } from "../index";
+import { createForm } from "../form";
 import type {
   Computed,
   InputConfig,
@@ -13,35 +13,35 @@ import { transformToArray } from "../../util";
 // create the connection with input store
 const connect = (computed: Computed) => {
   // st => store
-  // cp => computedForm methods (forEach, map, get etc...)
+  // f => Form methods (forEach, map, get etc...)
   // a => isArray
-  const { st, cp, a } = computed;
+  const { st, f, a } = computed;
   // i => inputs
   // iv => initial valid state
   // t => any inputs isTouched
   const { i, iv, t } = st();
   const parsedInputs = a ? transformToArray(i) : i;
   (parsedInputs as typeof parsedInputs & IsValid).isValid = iv;
   (parsedInputs as typeof parsedInputs & IsValid).isTouched = t;
-  return [parsedInputs, cp];
+  return [parsedInputs, f];
 };
 
 const useInputs: InputsHook = (
   initialState: Unknown,
   config: InputConfig = {}
 ): Unknown => {
-  return connect(useMemo(() => createInputs(initialState, config), []));
+  return connect(useMemo(() => createForm(initialState, config), []));
 };
 const trackInputs: TrackInputs = (
   initialState: Unknown,
   config: InputConfig = {}
 ): Unknown => {
-  const computed = createInputs(initialState, config);
+  const computed = createForm(initialState, config);
   // external hook with form properties
   const h = () => connect(computed);
-  const { cp, uv, iv } = computed;
-  for (const key in cp) {
-    (h as Unknown)[key] = (cp as Unknown)[key];
+  const { f, uv, iv } = computed;
+  for (const key in f) {
+    (h as Unknown)[key] = (f as Unknown)[key];
   }
   (h as Unknown).useValues = uv;
   (h as Unknown).isValid = iv;

src/types/index.ts

@@ -160,25 +160,24 @@ interface IsValid {
   isTouched: boolean;
 }
 
-interface CommonForm {
+interface Form {
   reset(): void;
 
   each(callback: EachCallback): Unknown[];
 
   showError(): void;
 
   get(name: string): Input[];
+
+  getValues(): Unknown;
+
+  onSubmit(event: Event): void;
 }
 
 interface EachCallback {
   (input: Input, index: number, array: ArrayInputs): Unknown;
 }
 
-interface Form extends CommonForm {
-  getValues(): Unknown;
-
-  onSubmit(event: Event): void;
-}
 type IPS = {
   i: ObjectInputs<string>;
   //touched
@@ -215,16 +214,10 @@ type InputStore = StoreType<IPS> & {
   n: Unknown[];
 };
 
-interface CompForm extends CommonForm {
-  getValues(): Unknown;
-
-  onSubmit(event: Event): void;
-}
-
 interface Computed {
   // store
   st: InputStore;
-  cp: CompForm;
+  f: Form;
   // useValues
   uv(): Unknown;
   // is valid
@@ -265,7 +258,7 @@ interface InputsHook {
   ): ObjStateOutput<CreateObjectInputs<I>>;
 }
 
-interface Inputs<I> extends CompForm {
+interface Inputs<I> extends Form {
   (): I extends string
     ? ObjStateOutput<CreateObjectInputs<I>>
     : I extends Array<Unknown>