react-hook-core 0.2.4 → 0.2.6

package/src/state.ts

@@ -1,194 +1,194 @@
-import {Locale, ModelProps} from './core';
-import {setValue} from './reflect';
-import {valueOf} from './util';
-
-export const enLocale = {
-  'id': 'en-US',
-  'countryCode': 'US',
-  'dateFormat': 'M/d/yyyy',
-  'firstDayOfWeek': 1,
-  'decimalSeparator': '.',
-  'groupSeparator': ',',
-  'decimalDigits': 2,
-  'currencyCode': 'USD',
-  'currencySymbol': '$',
-  'currencyPattern': 0
-};
-export function localeOf(lc?: Locale, glc?: (() => Locale) | Locale): Locale {
-  let l: Locale|undefined = lc;
-  if (!l) {
-    if (glc) {
-      if (typeof glc === 'function') {
-        l = glc();
-      } else {
-        l = glc;
-      }
-    }
-    if (!l) {
-      l = enLocale;
-    }
-  }
-  return l;
-}
-export function handleEvent(e: any, removeErr?: (ctrl: HTMLInputElement) => void) {
-  const ctrl = e.currentTarget as HTMLInputElement;
-  const type = ctrl.getAttribute('type');
-  const isPreventDefault = type && (['checkbox', 'radio'].indexOf(type.toLowerCase()) >= 0 ? false : true);
-  if (isPreventDefault) {
-    e.preventDefault();
-  }
-  if (
-    removeErr &&
-    ctrl.nodeName === 'SELECT' &&
-    ctrl.value &&
-    ctrl.classList.contains('invalid')) {
-    removeErr(ctrl);
-  }
-}
-export function handleProps<P extends ModelProps>(e: any, props: P, ctrl: HTMLInputElement, modelName: string, tloc: Locale, prepareData?: (data: any) => void) {
-  if (props.setGlobalState) {
-    const res = valueOf(ctrl, tloc, e.type);
-    if (res.mustChange) {
-      const dataField = ctrl.getAttribute('data-field');
-      const field = (dataField ? dataField : ctrl.name);
-      const propsDataForm = (props as any)[modelName];
-      const form = ctrl.form;
-      if (form) {
-        const formName = form.name;
-        if (field.indexOf('.') < 0 && field.indexOf('[') < 0) {
-          const data = props.shouldBeCustomized && prepareData ? prepareData({ [ctrl.name]: res.value }) : { [ctrl.name]: res.value };
-          props.setGlobalState({ [formName]: { ...propsDataForm, ...data } });
-        } else {
-          setValue(propsDataForm, field, ctrl.value);
-          props.setGlobalState({ [formName]: { ...propsDataForm } });
-        }
-      }
-    }
-  }
-}
-export function buildState<S, K extends keyof S>(e: any, state: Readonly<S>, ctrl: HTMLInputElement, modelName: string, tloc: Locale): K|undefined {
-  const form = ctrl.form;
-  if (form) {
-    if (modelName && modelName !== '') {
-      const type = ctrl.getAttribute('type');
-      const ex = (state as any)[modelName];
-      const dataField = ctrl.getAttribute('data-field');
-      const field = (dataField ? dataField : ctrl.name);
-      const model = Object.assign({}, ex);
-      if (type && type.toLowerCase() === 'checkbox') {
-        let value = model[field];
-        if (ctrl.id && ctrl.name !== ctrl.id) {
-          if (!value || !Array.isArray(value)) {
-            value = [];
-          }
-          value.includes(ctrl.value) ? value = value.filter((v: string) => v !== ctrl.value) : value.push(ctrl.value);
-          // if (dType == 'array'){
-          //   if (value === 'string'){
-          //     value = [value]
-          //   }
-          // }
-          model[field] = value;
-          // console.log(model,  modelName, model, model[field], field, value )
-          // setValue(model, field, value);
-        } else {
-          const v = valueOfCheckbox(ctrl);
-          model[field] = v;
-        }
-        const objSet: any = {};
-        objSet[modelName] = model;
-        return objSet;
-      } else if (type && type.toLowerCase() === 'radio') {
-        if (field.indexOf('.') < 0 && field.indexOf('[') < 0 ) {
-          model[field] = ctrl.value;
-        } else {
-          setValue(model, field, ctrl.value);
-        }
-        const objSet: any = {};
-        objSet[modelName] = model;
-        return objSet;
-      } else if (type && (type.toLowerCase() === 'date' || type.toLowerCase() === 'datetime-local')) {
-        const objSet: any = {};
-        try {
-          const selectedDate = new Date(ctrl.value);
-          setValue(model, field, ctrl.value && ctrl.value!== '' ? selectedDate.toISOString() : null);
-          objSet[modelName] = model;
-          return objSet;
-        } catch (error) {
-          console.error('Error occurred while formatting date:', error);
-        }
-        return objSet;
-    } else if (type && (type.toLowerCase() === 'time')) {
-      const objSet: any = {};
-      try {
-        const selectedDate = new Date(ctrl.value);
-        setValue(model, field, selectedDate.getTime());
-        objSet[modelName] = model;
-        return objSet;
-      } catch (error) {
-        console.error('Error occurred while formatting time:', error);
-      }
-      return objSet;
-    } else {
-        if (ctrl.tagName === 'SELECT') {
-          if (ctrl.value === '' || !ctrl.value) {
-            ctrl.removeAttribute('data-value');
-          } else {
-            ctrl.setAttribute('data-value', 'data-value');
-          }
-        }
-        const data = valueOf(ctrl, tloc, e.type);
-        if (data.mustChange) {
-          if (field.indexOf('.') < 0 && field.indexOf('[') < 0) {
-            model[field] = data.value;
-          } else {
-            setValue(model, field, data.value);
-          }
-          const objSet: any = {};
-          objSet[modelName] = model;
-          return objSet;
-        }
-      }
-    } else {
-      return buildFlatState(e, state, tloc);
-    }
-  } else {
-    buildFlatState(e, state, tloc);
-  }
-}
-export function valueOfCheckbox(ctrl: HTMLInputElement): string|number|boolean {
-  const ctrlOnValue = ctrl.getAttribute('data-on-value');
-  const ctrlOffValue = ctrl.getAttribute('data-off-value');
-  if (ctrlOnValue && ctrlOffValue) {
-    const onValue = ctrlOnValue ? ctrlOnValue : true;
-    const offValue = ctrlOffValue ? ctrlOffValue : false;
-    return ctrl.checked === true ? onValue : offValue;
-  } else {
-    return ctrl.checked === true;
-  }
-}
-export function buildFlatState<S, K extends keyof S>(e: any, state: Readonly<S>, l?: Locale): K|undefined {
-  const ctrl = e.currentTarget as HTMLInputElement;
-  const stateName = ctrl.name;
-  const objSet: any = {};
-  const type = ctrl.getAttribute('type');
-  if (type && type.toLowerCase() === 'checkbox') {
-    if (ctrl.id && stateName === ctrl.id) {
-      const v = valueOfCheckbox(ctrl);
-      objSet[stateName] = v;
-      return objSet;
-    } else {
-      let value = (state as any)[stateName];
-      value.includes(ctrl.value) ? value = value.filter((v: string) => v !== ctrl.value) : value.push(ctrl.value);
-      const objSet2: any = {[ctrl.name]: value};
-      return objSet2;
-    }
-  } else {
-    const data = valueOf(ctrl, l, e.type);
-    if (data.mustChange) {
-      objSet[stateName] = data.value;
-      return objSet;
-    } else {
-      return undefined;
-    }
-  }
-}
+import {Locale, ModelProps} from './core';
+import {setValue} from './reflect';
+import {valueOf} from './util';
+
+export const enLocale = {
+  'id': 'en-US',
+  'countryCode': 'US',
+  'dateFormat': 'M/d/yyyy',
+  'firstDayOfWeek': 1,
+  'decimalSeparator': '.',
+  'groupSeparator': ',',
+  'decimalDigits': 2,
+  'currencyCode': 'USD',
+  'currencySymbol': '$',
+  'currencyPattern': 0
+};
+export function localeOf(lc?: Locale, glc?: (() => Locale) | Locale): Locale {
+  let l: Locale|undefined = lc;
+  if (!l) {
+    if (glc) {
+      if (typeof glc === 'function') {
+        l = glc();
+      } else {
+        l = glc;
+      }
+    }
+    if (!l) {
+      l = enLocale;
+    }
+  }
+  return l;
+}
+export function handleEvent(e: any, removeErr?: (ctrl: HTMLInputElement) => void) {
+  const ctrl = e.currentTarget as HTMLInputElement;
+  const type = ctrl.getAttribute('type');
+  const isPreventDefault = type && (['checkbox', 'radio'].indexOf(type.toLowerCase()) >= 0 ? false : true);
+  if (isPreventDefault) {
+    e.preventDefault();
+  }
+  if (
+    removeErr &&
+    ctrl.nodeName === 'SELECT' &&
+    ctrl.value &&
+    ctrl.classList.contains('invalid')) {
+    removeErr(ctrl);
+  }
+}
+export function handleProps<P extends ModelProps>(e: any, props: P, ctrl: HTMLInputElement, modelName: string, tloc: Locale, prepareData?: (data: any) => void) {
+  if (props.setGlobalState) {
+    const res = valueOf(ctrl, tloc, e.type);
+    if (res.mustChange) {
+      const dataField = ctrl.getAttribute('data-field');
+      const field = (dataField ? dataField : ctrl.name);
+      const propsDataForm = (props as any)[modelName];
+      const form = ctrl.form;
+      if (form) {
+        const formName = form.name;
+        if (field.indexOf('.') < 0 && field.indexOf('[') < 0) {
+          const data = props.shouldBeCustomized && prepareData ? prepareData({ [ctrl.name]: res.value }) : { [ctrl.name]: res.value };
+          props.setGlobalState({ [formName]: { ...propsDataForm, ...data } });
+        } else {
+          setValue(propsDataForm, field, ctrl.value);
+          props.setGlobalState({ [formName]: { ...propsDataForm } });
+        }
+      }
+    }
+  }
+}
+export function buildState<S, K extends keyof S>(e: any, state: Readonly<S>, ctrl: HTMLInputElement, modelName: string, tloc: Locale): K|undefined {
+  const form = ctrl.form;
+  if (form) {
+    if (modelName && modelName !== '') {
+      const type = ctrl.getAttribute('type');
+      const ex = (state as any)[modelName];
+      const dataField = ctrl.getAttribute('data-field');
+      const field = (dataField ? dataField : ctrl.name);
+      const model = Object.assign({}, ex);
+      if (type && type.toLowerCase() === 'checkbox') {
+        let value = model[field];
+        if (ctrl.id && ctrl.name !== ctrl.id) {
+          if (!value || !Array.isArray(value)) {
+            value = [];
+          }
+          value.includes(ctrl.value) ? value = value.filter((v: string) => v !== ctrl.value) : value.push(ctrl.value);
+          // if (dType == 'array'){
+          //   if (value === 'string'){
+          //     value = [value]
+          //   }
+          // }
+          model[field] = value;
+          // console.log(model,  modelName, model, model[field], field, value )
+          // setValue(model, field, value);
+        } else {
+          const v = valueOfCheckbox(ctrl);
+          model[field] = v;
+        }
+        const objSet: any = {};
+        objSet[modelName] = model;
+        return objSet;
+      } else if (type && type.toLowerCase() === 'radio') {
+        if (field.indexOf('.') < 0 && field.indexOf('[') < 0 ) {
+          model[field] = ctrl.value;
+        } else {
+          setValue(model, field, ctrl.value);
+        }
+        const objSet: any = {};
+        objSet[modelName] = model;
+        return objSet;
+      } else if (type && (type.toLowerCase() === 'date' || type.toLowerCase() === 'datetime-local')) {
+        const objSet: any = {};
+        try {
+          const selectedDate = new Date(ctrl.value);
+          setValue(model, field, ctrl.value && ctrl.value!== '' ? selectedDate.toISOString() : null);
+          objSet[modelName] = model;
+          return objSet;
+        } catch (error) {
+          console.error('Error occurred while formatting date:', error);
+        }
+        return objSet;
+    } else if (type && (type.toLowerCase() === 'time')) {
+      const objSet: any = {};
+      try {
+        const selectedDate = new Date(ctrl.value);
+        setValue(model, field, selectedDate.getTime());
+        objSet[modelName] = model;
+        return objSet;
+      } catch (error) {
+        console.error('Error occurred while formatting time:', error);
+      }
+      return objSet;
+    } else {
+        if (ctrl.tagName === 'SELECT') {
+          if (ctrl.value === '' || !ctrl.value) {
+            ctrl.removeAttribute('data-value');
+          } else {
+            ctrl.setAttribute('data-value', 'data-value');
+          }
+        }
+        const data = valueOf(ctrl, tloc, e.type);
+        if (data.mustChange) {
+          if (field.indexOf('.') < 0 && field.indexOf('[') < 0) {
+            model[field] = data.value;
+          } else {
+            setValue(model, field, data.value);
+          }
+          const objSet: any = {};
+          objSet[modelName] = model;
+          return objSet;
+        }
+      }
+    } else {
+      return buildFlatState(e, state, tloc);
+    }
+  } else {
+    buildFlatState(e, state, tloc);
+  }
+}
+export function valueOfCheckbox(ctrl: HTMLInputElement): string|number|boolean {
+  const ctrlOnValue = ctrl.getAttribute('data-on-value');
+  const ctrlOffValue = ctrl.getAttribute('data-off-value');
+  if (ctrlOnValue && ctrlOffValue) {
+    const onValue = ctrlOnValue ? ctrlOnValue : true;
+    const offValue = ctrlOffValue ? ctrlOffValue : false;
+    return ctrl.checked === true ? onValue : offValue;
+  } else {
+    return ctrl.checked === true;
+  }
+}
+export function buildFlatState<S, K extends keyof S>(e: any, state: Readonly<S>, l?: Locale): K|undefined {
+  const ctrl = e.currentTarget as HTMLInputElement;
+  const stateName = ctrl.name;
+  const objSet: any = {};
+  const type = ctrl.getAttribute('type');
+  if (type && type.toLowerCase() === 'checkbox') {
+    if (ctrl.id && stateName === ctrl.id) {
+      const v = valueOfCheckbox(ctrl);
+      objSet[stateName] = v;
+      return objSet;
+    } else {
+      let value = (state as any)[stateName];
+      value.includes(ctrl.value) ? value = value.filter((v: string) => v !== ctrl.value) : value.push(ctrl.value);
+      const objSet2: any = {[ctrl.name]: value};
+      return objSet2;
+    }
+  } else {
+    const data = valueOf(ctrl, l, e.type);
+    if (data.mustChange) {
+      objSet[stateName] = data.value;
+      return objSet;
+    } else {
+      return undefined;
+    }
+  }
+}

package/src/update.ts

@@ -1,86 +1,86 @@
-import { getModelName as getModelName2, Locale, removePhoneFormat } from "./core";
-import { useMergeState } from "./merge";
-import { buildFlatState, buildState, handleEvent, localeOf } from "./state";
-import { useEffect, useState } from "react";
-
-const m = "model";
-const _getModelName = (f2?: HTMLFormElement | null): string => {
-  return getModelName2(f2, m);
-};
-export const useUpdate = <T>(
-  initialState: T,
-  getName?: ((f?: HTMLFormElement | null) => string) | string,
-  getLocale?: (() => Locale) | Locale,
-  removeErr?: (ctrl: HTMLInputElement) => void
-) => {
-  const [state, setState] = useMergeState<T>(initialState);
-  const [rerender, setRerender] = useState(false);
-
-  // trigger re-render page when change state in useSearch
-  useEffect(() => {
-    setRerender(!rerender);
-  }, [state]);
-
-  const updatePhoneState = (event: any) => {
-    const re = /^[0-9\b]+$/;
-    const target = event.currentTarget as HTMLInputElement;
-    const value = removePhoneFormat(target.value);
-    if (re.test(value) || !value) {
-      updateState(event);
-    } else {
-      const splitArr = value.split("");
-      let responseStr = "";
-      splitArr.forEach((element) => {
-        if (re.test(element)) {
-          responseStr += element;
-        }
-      });
-      target.value = responseStr;
-      updateState(event);
-    }
-  };
-  const getModelName: (f2?: HTMLFormElement | null) => string = typeof getName === "function" ? getName : _getModelName;
-
-  const updateState = (e: any, callback?: (prev: any) => void, lc?: Locale) => {
-    const ctrl = e.currentTarget as HTMLInputElement;
-    let mn: string = m;
-    if (getName) {
-      if (typeof getName === "string") {
-        mn = getName;
-      } else {
-        mn = getName(ctrl.form);
-      }
-    } else {
-      mn = _getModelName(ctrl.form);
-    }
-    const l = localeOf(lc, getLocale);
-    handleEvent(e, removeErr);
-    const objSet = buildState<T, any>(e, state, ctrl, mn, l);
-    if (objSet) {
-      if (callback) {
-        setState({ ...objSet }, callback);
-      } else {
-        setState(objSet);
-      }
-    }
-  };
-  const updateFlatState = (e: any, callback?: () => void, lc?: Locale) => {
-    const objSet = buildFlatState<T, any>(e, state, lc);
-    if (objSet) {
-      if (callback) {
-        setState(objSet, callback);
-      } else {
-        setState(objSet);
-      }
-    }
-  };
-  return {
-    getModelName,
-    updateState,
-    updatePhoneState,
-    updateFlatState,
-    getLocale,
-    setState,
-    state,
-  };
-};
+import { getModelName as getModelName2, Locale, removePhoneFormat } from "./core";
+import { useMergeState } from "./merge";
+import { buildFlatState, buildState, handleEvent, localeOf } from "./state";
+import { useEffect, useState } from "react";
+
+const m = "model";
+const _getModelName = (f2?: HTMLFormElement | null): string => {
+  return getModelName2(f2, m);
+};
+export const useUpdate = <T>(
+  initialState: T,
+  getName?: ((f?: HTMLFormElement | null) => string) | string,
+  getLocale?: (() => Locale) | Locale,
+  removeErr?: (ctrl: HTMLInputElement) => void
+) => {
+  const [state, setState] = useMergeState<T>(initialState);
+  const [rerender, setRerender] = useState(false);
+
+  // trigger re-render page when change state in useSearch
+  useEffect(() => {
+    setRerender(!rerender);
+  }, [state]);
+
+  const updatePhoneState = (event: any) => {
+    const re = /^[0-9\b]+$/;
+    const target = event.currentTarget as HTMLInputElement;
+    const value = removePhoneFormat(target.value);
+    if (re.test(value) || !value) {
+      updateState(event);
+    } else {
+      const splitArr = value.split("");
+      let responseStr = "";
+      splitArr.forEach((element) => {
+        if (re.test(element)) {
+          responseStr += element;
+        }
+      });
+      target.value = responseStr;
+      updateState(event);
+    }
+  };
+  const getModelName: (f2?: HTMLFormElement | null) => string = typeof getName === "function" ? getName : _getModelName;
+
+  const updateState = (e: any, callback?: (prev: any) => void, lc?: Locale) => {
+    const ctrl = e.currentTarget as HTMLInputElement;
+    let mn: string = m;
+    if (getName) {
+      if (typeof getName === "string") {
+        mn = getName;
+      } else {
+        mn = getName(ctrl.form);
+      }
+    } else {
+      mn = _getModelName(ctrl.form);
+    }
+    const l = localeOf(lc, getLocale);
+    handleEvent(e, removeErr);
+    const objSet = buildState<T, any>(e, state, ctrl, mn, l);
+    if (objSet) {
+      if (callback) {
+        setState({ ...objSet }, callback);
+      } else {
+        setState(objSet);
+      }
+    }
+  };
+  const updateFlatState = (e: any, callback?: () => void, lc?: Locale) => {
+    const objSet = buildFlatState<T, any>(e, state, lc);
+    if (objSet) {
+      if (callback) {
+        setState(objSet, callback);
+      } else {
+        setState(objSet);
+      }
+    }
+  };
+  return {
+    getModelName,
+    updateState,
+    updatePhoneState,
+    updateFlatState,
+    getLocale,
+    setState,
+    state,
+  };
+};

package/src/useEdit.ts

@@ -22,7 +22,7 @@ export interface BaseEditComponentParam<T, ID> {
   readOnly?: boolean;
   // deletable?: boolean;
 
-  insertSuccessMsg?: string;
+  createSuccessMsg?: string;
   updateSuccessMsg?: string;
 
   handleNotFound?: (form?: HTMLFormElement) => void;
@@ -456,7 +456,7 @@ if (running === true) {
         service.update(obj).then((res: number|T|ErrorMessage[]) => postSave(res, obj, version, false, isBackO)).catch(handleError);
       }
     } else {
-      service.insert(obj).then((res: number|T|ErrorMessage[]) => postSave(res, obj, version, false, isBackO)).catch(handleError);
+      service.create(obj).then((res: number|T|ErrorMessage[]) => postSave(res, obj, version, false, isBackO)).catch(handleError);
     }
   };
 
@@ -549,3 +549,13 @@ if (running === true) {
     doSave
   };
 };
+export function isSuccessful<T>(x: number|T|ErrorMessage[]): boolean {
+  if (Array.isArray(x)) {
+    return false;
+  } else if (typeof x === 'object') {
+    return true;
+  } else if (typeof x === 'number' && x > 0) {
+    return true;
+  }
+  return false;
+}