react-hook-core 0.4.23 → 0.5.0

package/lib/core.js

@@ -4,7 +4,12 @@ exports.pageSizes = [12, 24, 60, 100, 120, 180, 300, 600]
 exports.sizes = exports.pageSizes
 var resources = (function () {
   function resources() {}
-  resources.phone = / |\-|\.|\(|\)/g
+  resources.removePhoneFormat = function (phone) {
+    return phone ? phone.replace(resources.phone, "") : ""
+  }
+  resources.removeFaxFormat = function (fax) {
+    return fax ? fax.replace(resources.fax, "") : ""
+  }
   resources._cache = {}
   resources.cache = true
   resources.fields = "fields"
@@ -13,6 +18,16 @@ var resources = (function () {
   resources.defaultLimit = 24
   resources.limits = exports.pageSizes
   resources.pageMaxSize = 7
+  resources.phone = / |\-|\.|\(|\)/g
+  resources.fax = / |\-|\.|\(|\)/g
   return resources
 })()
 exports.resources = resources
+function removePhoneFormat(phone) {
+  return resources.removePhoneFormat(phone)
+}
+exports.removePhoneFormat = removePhoneFormat
+function removeFaxFormat(fax) {
+  return resources.removeFaxFormat(fax)
+}
+exports.removeFaxFormat = removeFaxFormat

package/lib/search.js

@@ -1,7 +1,22 @@
 "use strict"
+var __assign =
+  (this && this.__assign) ||
+  function () {
+    __assign =
+      Object.assign ||
+      function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+          s = arguments[i]
+          for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]
+        }
+        return t
+      }
+    return __assign.apply(this, arguments)
+  }
 Object.defineProperty(exports, "__esModule", { value: true })
 var core_1 = require("./core")
 var reflect_1 = require("./reflect")
+var state_1 = require("./state")
 function mergeFilter(obj, b, pageSizes, arrs) {
   var a = b
   if (!b) {
@@ -316,15 +331,17 @@ function buildSortFilter(obj, sortable) {
   var filter = reflect_1.clone(obj)
   if (sortable.sortField && sortable.sortField.length > 0) {
     filter.sort = sortable.sortType === "-" ? "-" + sortable.sortField : sortable.sortField
+    obj.sort = filter.sort
   } else {
     delete filter.sort
+    delete obj.sort
   }
   delete filter.fields
   return filter
 }
 exports.buildSortFilter = buildSortFilter
-function handleToggle(target, on) {
-  var off = !on
+function handleToggle(target, off) {
+  var on = !off
   if (target) {
     if (on) {
       if (!target.classList.contains("on")) {
@@ -334,29 +351,67 @@ function handleToggle(target, on) {
       target.classList.remove("on")
     }
   }
-  return off
+  return on
 }
 exports.handleToggle = handleToggle
 function getNumber(event) {
   return parseInt(event.currentTarget.value, 10)
 }
 exports.getNumber = getNumber
-function onPageSizeChanged(event, search, filter, setState) {
+function setSortFilter(state, filter, setState, setFilter, search) {
+  setSort(state, filter.sort)
+  if (setFilter) {
+    setFilter(filter)
+  }
+  if (setState) {
+    setState(state)
+  }
+  if (search) {
+    search(true)
+  }
+}
+exports.setSortFilter = setSortFilter
+function onToggleSearch(e, showFilter, setShowFilter) {
+  var toggleFilter = handleToggle(e.target, showFilter)
+  if (setShowFilter) {
+    setShowFilter(toggleFilter)
+  }
+}
+exports.onToggleSearch = onToggleSearch
+function resetSearch(e, filter, setFilter, search) {
+  filter.page = 1
+  state_1.updateState(e, filter, setFilter)
+  if (search) {
+    search()
+  }
+}
+exports.resetSearch = resetSearch
+function onClearQ(filter, setFilter, search) {
+  filter.q = ""
+  if (setFilter) {
+    setFilter(__assign({}, filter))
+  }
+  if (search) {
+    search()
+  }
+}
+exports.onClearQ = onClearQ
+function onPageSizeChanged(event, search, filter, setFilter) {
   filter.page = 1
   filter.limit = getNumber(event)
-  if (setState) {
-    setState(filter)
+  if (setFilter) {
+    setFilter(filter)
   }
   search()
 }
 exports.onPageSizeChanged = onPageSizeChanged
-function onPageChanged(data, search, filter, setState) {
+function onPageChanged(data, search, filter, setFilter) {
   var page = data.page,
     size = data.size
   filter.page = page
   filter.limit = size
-  if (setState) {
-    setState(filter)
+  if (setFilter) {
+    setFilter(filter)
   }
   search()
 }

package/lib/state.js

@@ -14,6 +14,7 @@ var __assign =
     return __assign.apply(this, arguments)
   }
 Object.defineProperty(exports, "__esModule", { value: true })
+var core_1 = require("./core")
 var reflect_1 = require("./reflect")
 var util_1 = require("./util")
 function getDecimalSeparator(ele) {
@@ -29,45 +30,56 @@ function getDecimalSeparator(ele) {
 exports.getDecimalSeparator = getDecimalSeparator
 var r1 = / |,|\$|€|£|¥|'|٬|،| /g
 var r2 = / |\.|\$|€|£|¥|'|٬|،| /g
-function updateState(e, o, setObj) {
+function updateNumber(e, o, setObj, decimalSeparator, callback, formatStr) {
   var ctrl = e.target
+  var v0 = formatStr ? formatStr(ctrl.value) : ctrl.value
+  var dataField = ctrl.getAttribute("data-field")
+  var field = dataField ? dataField : ctrl.name
+  var v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
+  if (v.indexOf(",") >= 0) {
+    v = v.replace(",", ".")
+  }
+  var val = isNaN(v) ? undefined : parseInt(v)
+  reflect_1.setValue(o, field, val)
+  setObj(__assign({}, o))
+  if (callback) {
+    callback()
+  }
+}
+exports.updateNumber = updateNumber
+function formatAndUpdateState(e, o, setObj, formatStr, callback) {
+  updateState(e, o, setObj, callback, formatStr)
+}
+exports.formatAndUpdateState = formatAndUpdateState
+function updateState(e, o, setObj, callback, formatStr) {
+  var ctrl = e.target
+  var v0 = formatStr ? formatStr(ctrl.value) : ctrl.value
   var dataField = ctrl.getAttribute("data-field")
   var field = dataField ? dataField : ctrl.name
   if (ctrl.tagName === "SELECT") {
     if (ctrl.tagName === "SELECT") {
-      if (ctrl.value === "" || !ctrl.value) {
+      if (v0 === "" || !v0) {
         ctrl.removeAttribute("data-value")
       } else {
-        ctrl.setAttribute("data-value", "data-value")
+        ctrl.setAttribute("data-value", v0)
       }
     }
-    reflect_1.setValue(o, field, ctrl.value)
+    reflect_1.setValue(o, field, v0)
   } else {
     var stype = ctrl.getAttribute("type")
     var type = stype ? stype.toLowerCase() : "text"
     var model = o
-    if (type === "text") {
-      var datatype = ctrl.getAttribute("data-type")
-      if (datatype === "number" || datatype === "integer") {
-        var decimalSeparator = getDecimalSeparator(ctrl)
-        var v0 = ctrl.value
-        var v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
-        var val = isNaN(v) ? undefined : parseFloat(v)
-        reflect_1.setValue(o, field, val)
-      } else {
-        reflect_1.setValue(o, field, ctrl.value)
-      }
-    } else if (type === "checkbox") {
+    if (type === "checkbox") {
       var value = model[field]
       if (ctrl.id && ctrl.name !== ctrl.id) {
         if (!value || !Array.isArray(value)) {
           value = []
         }
-        value.includes(ctrl.value)
+        value.includes(v0)
           ? (value = value.filter(function (v) {
-              return v !== ctrl.value
+              return v !== v0
             }))
-          : value.push(ctrl.value)
+          : value.push(v0)
         model[field] = value
       } else {
         var v = valueOfCheckbox(ctrl)
@@ -75,31 +87,46 @@ function updateState(e, o, setObj) {
       }
     } else if (type === "radio") {
       if (field.indexOf(".") < 0 && field.indexOf("[") < 0) {
-        model[field] = ctrl.value
+        model[field] = v0
       } else {
-        reflect_1.setValue(model, field, ctrl.value)
+        reflect_1.setValue(model, field, v0)
       }
     } else if (type === "date" || type === "datetime-local") {
-      try {
-        var selectedDate = new Date(ctrl.value)
-        reflect_1.setValue(model, field, ctrl.value && ctrl.value !== "" ? selectedDate.toISOString() : null)
-      } catch (error) {
-        console.error("Error occurred while formatting date:", error)
-      }
+      var date = new Date(v0)
+      var val = !isNaN(date.getTime()) ? date.toISOString() : null
+      reflect_1.setValue(model, field, val)
     } else if (type === "time") {
-      var objSet = {}
-      try {
-        var selectedDate = new Date(ctrl.value)
-        reflect_1.setValue(model, field, selectedDate.getTime())
-      } catch (error) {
-        console.error("Error occurred while formatting time:", error)
+      var date = new Date(v0)
+      if (!isNaN(date.getTime())) {
+        reflect_1.setValue(model, field, date.getTime())
+      } else {
+        reflect_1.setValue(model, field, null)
       }
-      return objSet
     } else {
-      reflect_1.setValue(o, field, ctrl.value)
+      var datatype = ctrl.getAttribute("data-type")
+      if (datatype === "phone") {
+        var val = core_1.removePhoneFormat(v0)
+        reflect_1.setValue(o, field, val)
+      } else if (datatype === "fax") {
+        var val = core_1.removeFaxFormat(v0)
+        reflect_1.setValue(o, field, val)
+      } else if (datatype === "number" || datatype === "int") {
+        var decimalSeparator = getDecimalSeparator(ctrl)
+        var v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
+        if (v.indexOf(",") >= 0) {
+          v = v.replace(",", ".")
+        }
+        var val = isNaN(v) ? undefined : parseFloat(v)
+        reflect_1.setValue(o, field, val)
+      } else {
+        reflect_1.setValue(o, field, v0)
+      }
     }
   }
   setObj(__assign({}, o))
+  if (callback) {
+    callback()
+  }
 }
 exports.updateState = updateState
 exports.enLocale = {

package/lib/update.js

@@ -17,14 +17,6 @@ Object.defineProperty(exports, "__esModule", { value: true })
 var react_1 = require("react")
 var core_1 = require("./core")
 var state_1 = require("./state")
-function removePhoneFormat(phone) {
-  if (phone) {
-    return phone.replace(core_1.resources.phone, "")
-  } else {
-    return phone
-  }
-}
-exports.removePhoneFormat = removePhoneFormat
 function getModelName(form, name) {
   if (form) {
     var a = form.getAttribute("model-name")
@@ -90,7 +82,7 @@ exports.useUpdate = function (initialState, getName, getLocale, removeErr) {
   var updatePhoneState = function (event) {
     var re = /^[0-9\b]+$/
     var target = event.currentTarget
-    var value = removePhoneFormat(target.value)
+    var value = core_1.removePhoneFormat(target.value)
     if (re.test(value) || !value) {
       updateState(event)
     } else {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-hook-core",
-  "version": "0.4.23",
+  "version": "0.5.0",
   "description": "react",
   "main": "./lib/index.js",
   "types": "./src/index.ts",

package/src/core.ts

@@ -6,7 +6,6 @@ export const pageSizes = [12, 24, 60, 100, 120, 180, 300, 600]
 export const sizes = pageSizes
 // tslint:disable-next-line:class-name
 export class resources {
-  static phone = / |\-|\.|\(|\)/g
   static _cache: any = {}
   static cache = true
   static fields = "fields"
@@ -15,6 +14,20 @@ export class resources {
   static defaultLimit = 24
   static limits = pageSizes
   static pageMaxSize = 7
+  static phone = / |\-|\.|\(|\)/g
+  static fax = / |\-|\.|\(|\)/g
+  static removePhoneFormat(phone?: string | null): string {
+    return phone ? phone.replace(resources.phone, "") : ""
+  }
+  static removeFaxFormat(fax?: string | null): string {
+    return fax ? fax.replace(resources.fax, "") : ""
+  }
+}
+export function removePhoneFormat(phone?: string | null): string {
+  return resources.removePhoneFormat(phone)
+}
+export function removeFaxFormat(fax?: string | null): string {
+  return resources.removeFaxFormat(fax)
 }
 
 export interface StringMap {

package/src/index.ts

@@ -14,6 +14,10 @@ export * from "./useEdit"
 export * from "./useMessage"
 export * from "./useSearch"
 export * from "./util"
+
+export type ButtonMouseEvent = React.MouseEvent<HTMLButtonElement, MouseEvent>
+export type SelectChangeEvent = ChangeEvent<HTMLSelectElement>
+export type InputChangeEvent = ChangeEvent<HTMLInputElement>
 /*
 type CallBackType<T> = (updatedValue: T) => void;
 type SetStateType<T> = T | ((prev: T) => T);

package/src/search.ts

@@ -1,6 +1,7 @@
 import { ChangeEvent } from "react"
 import { resources, StringMap } from "./core"
 import { clone } from "./reflect"
+import { updateState } from "./state"
 
 export interface PageChange {
   page: number // currentPage
@@ -352,14 +353,16 @@ export function buildSortFilter<S extends Filter>(obj: S, sortable: Sortable): S
   const filter: any = clone(obj)
   if (sortable.sortField && sortable.sortField.length > 0) {
     filter.sort = sortable.sortType === "-" ? "-" + sortable.sortField : sortable.sortField
+    obj.sort = filter.sort
   } else {
     delete filter.sort
+    delete obj.sort
   }
   delete filter.fields
   return filter
 }
-export function handleToggle(target?: HTMLElement, on?: boolean): boolean {
-  const off = !on
+export function handleToggle(target?: HTMLElement, off?: boolean): boolean {
+  const on = !off
   if (target) {
     if (on) {
       if (!target.classList.contains("on")) {
@@ -369,31 +372,80 @@ export function handleToggle(target?: HTMLElement, on?: boolean): boolean {
       target.classList.remove("on")
     }
   }
-  return off
+  return on
 }
-
 export function getNumber(event: ChangeEvent<HTMLSelectElement | HTMLInputElement>): number {
   return parseInt(event.currentTarget.value, 10)
 }
+
+export function setSortFilter<F extends Filter, T extends Sortable>(
+  state: T,
+  filter: F,
+  setState?: (v: React.SetStateAction<T>) => void,
+  setFilter?: (v: React.SetStateAction<F>) => void,
+  search?: (first?: boolean) => void,
+) {
+  setSort(state, filter.sort)
+  if (setFilter) {
+    setFilter(filter)
+  }
+  if (setState) {
+    setState(state)
+  }
+  if (search) {
+    search(true)
+  }
+}
+export function onToggleSearch(
+  e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
+  showFilter: boolean,
+  setShowFilter?: (v: React.SetStateAction<boolean>) => void,
+) {
+  const toggleFilter = handleToggle(e.target as HTMLElement, showFilter)
+  if (setShowFilter) {
+    setShowFilter(toggleFilter)
+  }
+}
+export function resetSearch<T extends Filter>(
+  e: ChangeEvent<HTMLInputElement, HTMLInputElement>,
+  filter: T,
+  setFilter: (v: React.SetStateAction<T>) => void,
+  search?: () => void,
+) {
+  filter.page = 1
+  updateState(e, filter, setFilter)
+  if (search) {
+    search()
+  }
+}
+export function onClearQ<T extends Filter>(filter: T, setFilter?: (v: React.SetStateAction<T>) => void, search?: () => void) {
+  filter.q = ""
+  if (setFilter) {
+    setFilter({ ...filter })
+  }
+  if (search) {
+    search()
+  }
+}
 export function onPageSizeChanged<T extends Filter>(
   event: ChangeEvent<HTMLSelectElement>,
   search: () => void,
   filter: T,
-  setState?: (v: React.SetStateAction<T>) => void,
+  setFilter?: (v: React.SetStateAction<T>) => void,
 ) {
   filter.page = 1
   filter.limit = getNumber(event)
-  if (setState) {
-    setState(filter)
+  if (setFilter) {
+    setFilter(filter)
   }
   search()
 }
-export function onPageChanged<T extends Filter>(data: PageChange, search: () => void, filter: T, setState?: (v: React.SetStateAction<T>) => void) {
+export function onPageChanged<T extends Filter>(data: PageChange, search: () => void, filter: T, setFilter?: (v: React.SetStateAction<T>) => void) {
   const { page, size } = data
   filter.page = page
   filter.limit = size
-  if (setState) {
-    setState(filter)
+  if (setFilter) {
+    setFilter(filter)
   }
   search()
 }

package/src/state.ts

@@ -1,5 +1,5 @@
 import { ChangeEvent } from "react"
-import { Locale } from "./core"
+import { Locale, removeFaxFormat, removePhoneFormat } from "./core"
 import { setValue } from "./reflect"
 import { valueOf } from "./util"
 
@@ -16,45 +16,69 @@ export function getDecimalSeparator(ele: HTMLInputElement): string {
 
 const r1 = / |,|\$|€|£|¥|'|٬|،| /g
 const r2 = / |\.|\$|€|£|¥|'|٬|،| /g
+export function updateNumber<T>(
+  e: ChangeEvent<HTMLInputElement, HTMLInputElement>,
+  o: T,
+  setObj: (v: React.SetStateAction<T>) => void,
+  decimalSeparator?: string,
+  callback?: () => void,
+  formatStr?: (s?: string) => string,
+) {
+  const ctrl = e.target
+  const v0: string = formatStr ? formatStr(ctrl.value) : ctrl.value
+  const dataField = ctrl.getAttribute("data-field")
+  const field = dataField ? dataField : ctrl.name
+  let v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
+  if (v.indexOf(",") >= 0) {
+    v = v.replace(",", ".")
+  }
+  const val = isNaN(v as any) ? undefined : parseInt(v)
+  setValue(o, field, val)
+  setObj({ ...o })
+  if (callback) {
+    callback()
+  }
+}
+export function formatAndUpdateState<T>(
+  e: ChangeEvent<HTMLInputElement, HTMLInputElement> | ChangeEvent<HTMLTextAreaElement, HTMLTextAreaElement>,
+  o: T,
+  setObj: (v: React.SetStateAction<T>) => void,
+  formatStr?: (s?: string) => string,
+  callback?: () => void,
+) {
+  updateState(e, o, setObj, callback, formatStr)
+}
 export function updateState<T>(
   e: ChangeEvent<HTMLInputElement, HTMLInputElement> | ChangeEvent<HTMLTextAreaElement, HTMLTextAreaElement>,
   o: T,
   setObj: (v: React.SetStateAction<T>) => void,
+  callback?: () => void,
+  formatStr?: (s?: string) => string,
 ) {
   const ctrl = e.target
+  const v0: string = formatStr ? formatStr(ctrl.value) : ctrl.value
   const dataField = ctrl.getAttribute("data-field")
   const field = dataField ? dataField : ctrl.name
   if (ctrl.tagName === "SELECT") {
     if (ctrl.tagName === "SELECT") {
-      if (ctrl.value === "" || !ctrl.value) {
+      if (v0 === "" || !v0) {
         ctrl.removeAttribute("data-value")
       } else {
-        ctrl.setAttribute("data-value", "data-value")
+        ctrl.setAttribute("data-value", v0)
       }
     }
-    setValue(o, field, ctrl.value)
+    setValue(o, field, v0)
   } else {
     let stype = ctrl.getAttribute("type")
     const type: string = stype ? stype.toLowerCase() : "text"
     let model: any = o
-    if (type === "text") {
-      const datatype = ctrl.getAttribute("data-type")
-      if (datatype === "number" || datatype === "integer") {
-        const decimalSeparator = getDecimalSeparator(ctrl as HTMLInputElement)
-        const v0: string = ctrl.value
-        const v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
-        const val = isNaN(v as any) ? undefined : parseFloat(v)
-        setValue(o, field, val)
-      } else {
-        setValue(o, field, ctrl.value)
-      }
-    } else if (type === "checkbox") {
+    if (type === "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)
+        value.includes(v0) ? (value = value.filter((v: string) => v !== v0)) : value.push(v0)
         model[field] = value
       } else {
         const v = valueOfCheckbox(ctrl as HTMLInputElement)
@@ -62,31 +86,46 @@ export function updateState<T>(
       }
     } else if (type === "radio") {
       if (field.indexOf(".") < 0 && field.indexOf("[") < 0) {
-        model[field] = ctrl.value
+        model[field] = v0
       } else {
-        setValue(model, field, ctrl.value)
+        setValue(model, field, v0)
       }
     } else if (type === "date" || type === "datetime-local") {
-      try {
-        const selectedDate = new Date(ctrl.value)
-        setValue(model, field, ctrl.value && ctrl.value !== "" ? selectedDate.toISOString() : null)
-      } catch (error) {
-        console.error("Error occurred while formatting date:", error)
-      }
+      const date = new Date(v0)
+      const val = !isNaN(date.getTime()) ? date.toISOString() : null
+      setValue(model, field, val)
     } else if (type === "time") {
-      const objSet: any = {}
-      try {
-        const selectedDate = new Date(ctrl.value)
-        setValue(model, field, selectedDate.getTime())
-      } catch (error) {
-        console.error("Error occurred while formatting time:", error)
+      const date = new Date(v0)
+      if (!isNaN(date.getTime())) {
+        setValue(model, field, date.getTime())
+      } else {
+        setValue(model, field, null)
       }
-      return objSet
     } else {
-      setValue(o, field, ctrl.value)
+      const datatype = ctrl.getAttribute("data-type")
+      if (datatype === "phone") {
+        const val = removePhoneFormat(v0)
+        setValue(o, field, val)
+      } else if (datatype === "fax") {
+        const val = removeFaxFormat(v0)
+        setValue(o, field, val)
+      } else if (datatype === "number" || datatype === "int") {
+        const decimalSeparator = getDecimalSeparator(ctrl as HTMLInputElement)
+        let v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
+        if (v.indexOf(",") >= 0) {
+          v = v.replace(",", ".")
+        }
+        const val = isNaN(v as any) ? undefined : parseFloat(v)
+        setValue(o, field, val)
+      } else {
+        setValue(o, field, v0)
+      }
     }
   }
   setObj({ ...o })
+  if (callback) {
+    callback()
+  }
 }
 
 export const enLocale = {

package/src/update.ts

@@ -1,15 +1,7 @@
 import { useCallback, useEffect, useRef, useState } from "react"
-import { Locale, resources } from "./core"
+import { Locale, removePhoneFormat } from "./core"
 import { buildFlatState, buildState, handleEvent, localeOf } from "./state"
 
-export function removePhoneFormat(phone: string): string {
-  if (phone) {
-    return phone.replace(resources.phone, "")
-  } else {
-    return phone
-  }
-}
-
 export function getModelName(form?: HTMLFormElement | null, name?: string): string {
   if (form) {
     const a = form.getAttribute("model-name")