react-hook-core 0.4.7 → 0.4.9

package/src/search.ts

@@ -33,7 +33,6 @@ export interface Sortable {
 export interface Pagination {
   initLimit?: number
   limit: number
-  // limit: number;
   page?: number
   total?: number
   pages?: number
@@ -157,13 +156,6 @@ export function initFilter<S extends Filter>(m: S, com: Searchable): S {
   return m
 }
 
-export function showPaging<T>(com: Pagination, list: T[], pageSize?: number, total?: number): void {
-  com.total = total
-  const pageTotal = getPageTotal(pageSize, total)
-  com.pages = pageTotal
-  com.showPaging = !total || com.pages <= 1 || (list && list.length >= total) ? false : true
-}
-
 export function getFields(form?: HTMLFormElement, arr?: string[]): string[] | undefined {
   if (arr && arr.length > 0) {
     return arr
@@ -203,20 +195,6 @@ export function getFields(form?: HTMLFormElement, arr?: string[]): string[] | un
   return fields.length > 0 ? fields : undefined
 }
 
-export function getPageTotal(pageSize?: number, total?: number): number {
-  if (!pageSize || pageSize <= 0) {
-    return 1
-  } else {
-    if (!total) {
-      total = 0
-    }
-    if (total % pageSize === 0) {
-      return Math.floor(total / pageSize)
-    }
-    return Math.floor(total / pageSize + 1)
-  }
-}
-
 export function formatText(...args: any[]): string {
   let formatted = args[0]
   if (!formatted || formatted === "") {
@@ -236,6 +214,19 @@ export function formatText(...args: any[]): string {
   }
   return formatted
 }
+export function getPageTotal(pageSize?: number, total?: number): number {
+  if (!pageSize || pageSize <= 0) {
+    return 1
+  } else {
+    if (!total) {
+      total = 0
+    }
+    if (total % pageSize === 0) {
+      return Math.floor(total / pageSize)
+    }
+    return Math.floor(total / pageSize + 1)
+  }
+}
 export function buildMessage<T>(resource: StringMap, results: T[], limit: number, page: number | undefined, total?: number): string {
   if (!results || results.length === 0) {
     return resource.msg_no_data_found
@@ -394,15 +385,6 @@ export function handleToggle(target?: HTMLElement, on?: boolean): boolean {
   }
   return off
 }
-export function handleSortEvent(event: Event, com: Sortable): void {
-  if (event && event.target) {
-    const target = event.target as HTMLElement
-    const s = handleSort(target, com.sortTarget, com.sortField, com.sortType)
-    com.sortField = s.field
-    com.sortType = s.type
-    com.sortTarget = target
-  }
-}
 
 export function getSortElement(target: HTMLElement): HTMLElement {
   return target.nodeName === "I" ? (target.parentElement as HTMLElement) : target

package/src/update.ts

@@ -1,11 +1,38 @@
 import { useEffect, useState } from "react"
-import { getModelName as getModelName2, Locale, removePhoneFormat } from "./core"
+import { Locale, resources } from "./core"
 import { useMergeState } from "./merge"
 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")
+    if (a && a.length > 0) {
+      return a
+    }
+    const b = form.name
+    if (b) {
+      if (b.endsWith("Form")) {
+        return b.substring(0, b.length - 4)
+      }
+      return b
+    }
+  }
+  if (name && name.length > 0) {
+    return name
+  }
+  return ""
+}
 const m = "model"
 const _getModelName = (f2?: HTMLFormElement | null): string => {
-  return getModelName2(f2, m)
+  return getModelName(f2, m)
 }
 export const useUpdate = <T>(
   initialState: T,

package/src/useEdit.ts

@@ -1,27 +1,54 @@
 import { useEffect, useState } from "react"
-import { useNavigate, useParams } from "react-router"
-import {
-  Attribute,
-  Attributes,
-  buildId,
-  ErrorMessage,
-  getModelName as getModelName2,
-  hideLoading,
-  initForm,
-  LoadingService,
-  Locale,
-  resources,
-  ResourceService,
-  showLoading,
-  UIService,
-} from "./core"
+import { Params, useNavigate, useParams } from "react-router"
+import { Attribute, Attributes, ErrorMessage, LoadingService, Locale, resources, ResourceService, UIService } from "./core"
 import { createModel as createModel2 } from "./edit"
 import { message, messageByHttpStatus } from "./error"
 import { focusFirstError, setReadOnly } from "./formutil"
+import { hideLoading, initForm, showLoading } from "./input"
 import { DispatchWithCallback, useMergeState } from "./merge"
 import { clone, makeDiff } from "./reflect"
 import { localeOf } from "./state"
-import { useUpdate } from "./update"
+import { getModelName as getModelName2, useUpdate } from "./update"
+
+export function buildKeys(attributes: Attributes): string[] {
+  if (!attributes) {
+    return []
+  }
+  const ks = Object.keys(attributes)
+  const ps = []
+  for (const k of ks) {
+    const attr: Attribute = attributes[k]
+    if (attr.key === true) {
+      ps.push(k)
+    }
+  }
+  return ps
+}
+type Readonly<T> = {
+  readonly [P in keyof T]: T[P]
+}
+export function buildId<ID>(p: Readonly<Params<string>>, keys?: string[]): ID | null {
+  if (!keys || keys.length === 0 || keys.length === 1) {
+    if (keys && keys.length === 1) {
+      if (p[keys[0]]) {
+        return p[keys[0]] as any
+      }
+    }
+    return p["id"] as any
+  }
+  const id: any = {}
+  for (const key of keys) {
+    let v = p[key]
+    if (!v) {
+      v = p[key]
+      if (!v) {
+        return null
+      }
+    }
+    id[key] = v
+  }
+  return id
+}
 
 export interface EditParameter {
   resource: ResourceService

package/src/useSearch.ts

@@ -1,20 +1,7 @@
 import { useEffect, useState } from "react"
-import {
-  getName,
-  getRemoveError,
-  getValidateForm,
-  hideLoading,
-  initForm,
-  LoadingService,
-  Locale,
-  pageSizes,
-  removeFormError,
-  resources,
-  ResourceService,
-  showLoading,
-  UIService,
-} from "./core"
+import { LoadingService, Locale, pageSizes, resources, ResourceService, UIService } from "./core"
 import { error } from "./error"
+import { hideLoading, initForm, showLoading } from "./input"
 import { DispatchWithCallback, useMergeState } from "./merge"
 import { clone } from "./reflect"
 import { buildFromUrl } from "./route"
@@ -23,6 +10,7 @@ import {
   buildMessage,
   Filter,
   getFields,
+  getPageTotal,
   handleSort,
   handleToggle,
   initFilter,
@@ -32,13 +20,19 @@ import {
   removeSortStatus,
   SearchResult,
   SearchService,
-  showPaging,
   Sortable,
 } from "./search"
 import { enLocale } from "./state"
 import { useUpdate } from "./update"
 
-export interface Searchable extends Pagination, Sortable {
+export function showPaging<T>(com: Pagination, list: T[], pageSize?: number, total?: number): void {
+  com.total = total
+  const pageTotal = getPageTotal(pageSize, total)
+  com.pages = pageTotal
+  com.showPaging = !total || com.pages <= 1 || (list && list.length >= total) ? false : true
+}
+
+interface Searchable extends Pagination, Sortable {
   nextPageToken?: string
   excluding?: string[] | number[]
 }
@@ -52,6 +46,30 @@ export interface SearchParameter {
   auto?: boolean
 }
 
+export interface UIParameter {
+  ui?: UIService
+}
+export function removeFormError(u?: UIParameter, f?: HTMLFormElement): void {
+  if (f && u && u.ui) {
+    u.ui.removeFormError(f)
+  }
+}
+export function getValidateForm(
+  u?: UIParameter,
+  vf?: (form: HTMLFormElement, locale?: Locale, focusFirst?: boolean, scroll?: boolean) => boolean,
+): ((form: HTMLFormElement, locale?: Locale, focusFirst?: boolean, scroll?: boolean) => boolean) | undefined {
+  if (vf) {
+    return vf
+  }
+  return u && u.ui ? u.ui.validateForm : undefined
+}
+export function getRemoveError(u?: UIParameter, rmErr?: (el: HTMLInputElement) => void): ((el: HTMLInputElement) => void) | undefined {
+  if (rmErr) {
+    return rmErr
+  }
+  return u && u.ui ? u.ui.removeError : undefined
+}
+
 export function getModel<S extends Filter>(state: any, modelName: string, searchable: Searchable, fields?: string[], excluding?: string[] | number[]): S {
   let obj2 = getModelFromState(state, modelName)
 
@@ -122,6 +140,7 @@ export function getFieldsFromForm(fields?: string[], initFields?: boolean, form?
   }
   return fields
 }
+
 export function append<T>(list?: T[], results?: T[]): T[] {
   if (list && results) {
     for (const obj of results) {
@@ -425,6 +444,10 @@ export const useSearchOneProps = <T, S extends Filter, ST extends SearchComponen
 export const useSearchOne = <T, S extends Filter, ST extends SearchComponentState<T, S>>(p: HookBaseSearchParameter<T, S, ST>) => {
   return useCoreSearch(p.refForm, p.initialState, p.service, p, p)
 }
+
+export function getName(d: string, n?: string): string {
+  return n && n.length > 0 ? n : d
+}
 export const useCoreSearch = <T, S extends Filter, ST>(
   refForm: any,
   initialState: ST,

package/src/util.ts

@@ -77,7 +77,7 @@ function getStringCurrency(value: string, datatype: string, locale?: Locale, max
 
   const dotPosition = value.indexOf(".")
   // Format thousands
-  let beforeDot = dotPosition >= 0 ? value.substr(0, dotPosition) : value
+  let beforeDot = dotPosition >= 0 ? value.substring(0, dotPosition) : value
   if (datatype === "string-currency" || isOnBlur) {
     beforeDot = beforeDot.replace(new RegExp("\\B(?=(\\d{" + groupDigits + "})+(?!\\d))", "g"), groupSeparator)
   }
@@ -85,9 +85,9 @@ function getStringCurrency(value: string, datatype: string, locale?: Locale, max
   // Cut after dot
   let afterDot
   if (dotPosition > 0) {
-    afterDot = value.substr(dotPosition + 1)
+    afterDot = value.substring(dotPosition + 1)
     if (afterDot.length > decimalDigits) {
-      afterDot = afterDot.substr(0, decimalDigits)
+      afterDot = afterDot.substring(0, decimalDigits)
     }
   }
   if (maxLength && beforeDot.length > maxLength - (decimalDigits + 1)) {

package/lib/useView.js

@@ -1,133 +0,0 @@
-"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 react_1 = require("react")
-var react_router_1 = require("react-router")
-var core_1 = require("./core")
-var error_1 = require("./error")
-var formutil_1 = require("./formutil")
-var merge_1 = require("./merge")
-exports.useViewOne = function (p) {
-  return exports.useCoreView(p.refForm, p.initialState, p.service, p, p)
-}
-exports.useView = function (refForm, initialState, service, p1, p) {
-  var baseProps = exports.useCoreView(refForm, initialState, service, p1, p)
-  var _a = merge_1.useMergeState(initialState),
-    setState = _a[1]
-  var params = react_router_1.useParams()
-  react_1.useEffect(function () {
-    if (baseProps.refForm) {
-      core_1.initForm(baseProps.refForm.current)
-    }
-    var id = core_1.buildId(params, p ? p.keys : undefined)
-    if (id) {
-      if (p && p.initialize) {
-        p.initialize(id, baseProps.load, setState, p.callback)
-      } else {
-        baseProps.load(id, p ? p.callback : undefined)
-      }
-    }
-  }, [])
-  return __assign({}, baseProps)
-}
-exports.useCoreView = function (refForm, initialState, service, p1, p) {
-  var _a = merge_1.useMergeState(initialState),
-    state = _a[0],
-    setState = _a[1]
-  var _b = react_1.useState(),
-    running = _b[0],
-    setRunning = _b[1]
-  var navigate = react_router_1.useNavigate()
-  var back = function (event) {
-    if (event) {
-      event.preventDefault()
-    }
-    navigate(-1)
-  }
-  var getModelName = function (f) {
-    if (p && p.name) {
-      return p.name
-    }
-    return core_1.getModelName(f, "model")
-  }
-  var showModel = function (model) {
-    var n = getModelName(refForm.current)
-    var objSet = {}
-    objSet[n] = model
-    setState(objSet)
-  }
-  var _handleNotFound = function (form) {
-    var msg = error_1.message(p1.resource.value, "error_not_found", "error")
-    if (form) {
-      formutil_1.setReadOnly(form)
-    }
-    p1.showError(msg.message, msg.title)
-  }
-  var handleNotFound = p && p.handleNotFound ? p.handleNotFound : _handleNotFound
-  var _load = function (_id, callback) {
-    var id = _id
-    if (id != null && id !== "") {
-      setRunning(true)
-      core_1.showLoading(p1.loading)
-      var fn = typeof service === "function" ? service : service.load
-      fn(id)
-        .then(function (obj) {
-          if (!obj) {
-            handleNotFound(refForm.current)
-          } else {
-            if (callback) {
-              callback(obj, showModel)
-            } else {
-              showModel(obj)
-            }
-          }
-          setRunning(false)
-          core_1.hideLoading(p1.loading)
-        })
-        .catch(function (err) {
-          var data = err && err.response ? err.response : err
-          var r = p1.resource
-          var title = r.value("error")
-          var msg = r.value("error_internal")
-          if (data && data.status === 404) {
-            handleNotFound(refForm.current)
-          } else {
-            if (data && data.status) {
-              msg = error_1.messageByHttpStatus(data.status, r.value)
-            }
-            formutil_1.setReadOnly(refForm.current)
-            p1.showError(msg, title)
-          }
-          setRunning(false)
-          core_1.hideLoading(p1.loading)
-        })
-    }
-  }
-  var load = p && p.load ? p.load : _load
-  return {
-    state: state,
-    setState: setState,
-    refForm: refForm,
-    resource: p1.resource.resource(),
-    running: running,
-    setRunning: setRunning,
-    showModel: showModel,
-    getModelName: getModelName,
-    handleNotFound: handleNotFound,
-    load: load,
-    back: back,
-  }
-}

package/src/useView.ts

@@ -1,183 +0,0 @@
-import { useEffect, useState } from "react"
-import { useNavigate, useParams } from "react-router"
-import { Attributes, buildId, getModelName as getModelName2, hideLoading, initForm, LoadingService, Locale, ResourceService, showLoading } from "./core"
-import { message, messageByHttpStatus } from "./error"
-import { setReadOnly } from "./formutil"
-import { DispatchWithCallback, useMergeState } from "./merge"
-
-export interface ViewParameter {
-  resource: ResourceService
-  showError: (m: string, header?: string, detail?: string, callback?: () => void) => void
-  getLocale?: (profile?: string) => Locale
-  loading?: LoadingService
-}
-export interface ViewService<T, ID> {
-  metadata?(): Attributes | undefined
-  keys?(): string[]
-  load(id: ID, ctx?: any): Promise<T | null>
-}
-
-export interface BaseViewComponentParam<T, ID> {
-  name?: string
-  handleNotFound?: (form?: HTMLFormElement) => void
-  getModelName?: (f?: HTMLFormElement) => string
-  showModel?: (m: T) => void
-  load?: (i: ID, callback?: (m: T, showM: (m2: T) => void) => void) => void
-}
-export interface HookBaseViewParameter<T, ID, S> extends BaseViewComponentParam<T, ID> {
-  refForm: any
-  initialState: S
-  service: ((id: ID, ctx?: any) => Promise<T>) | ViewService<T, ID>
-  resource: ResourceService
-  showError: (m: string, header?: string, detail?: string, callback?: () => void) => void
-  getLocale?: () => Locale
-  loading?: LoadingService
-}
-export interface ViewComponentParam<T, ID, S> extends BaseViewComponentParam<T, ID> {
-  keys?: string[]
-  initialize?: (
-    id: ID,
-    ld: (i: ID, cb?: (m: T, showF: (model: T) => void) => void) => void,
-    setState2: DispatchWithCallback<Partial<S>>,
-    callback?: (m: T, showF: (model: T) => void) => void,
-  ) => void
-  callback?: (m: T, showF: (model: T) => void) => void
-}
-export interface HookPropsViewParameter<T, ID, S, P> extends HookPropsBaseViewParameter<T, ID, S, P> {
-  keys?: string[]
-  initialize?: (
-    id: ID,
-    ld: (i: ID, cb?: (m: T, showF: (model: T) => void) => void) => void,
-    setState2: DispatchWithCallback<Partial<S>>,
-    callback?: (m: T, showF: (model: T) => void) => void,
-  ) => void
-  callback?: (m: T, showF: (model: T) => void) => void
-}
-export interface HookPropsBaseViewParameter<T, ID, S, P> extends HookBaseViewParameter<T, ID, S> {
-  props: P
-}
-export const useViewOne = <T, ID, S>(p: HookBaseViewParameter<T, ID, S>) => {
-  return useCoreView(p.refForm, p.initialState, p.service, p, p)
-}
-export const useView = <T, ID, S>(
-  refForm: any,
-  initialState: S,
-  service: ((id: ID, ctx?: any) => Promise<T>) | ViewService<T, ID>,
-  p1: ViewParameter,
-  p?: ViewComponentParam<T, ID, S>,
-) => {
-  const baseProps = useCoreView(refForm, initialState, service, p1, p)
-  const [, setState] = useMergeState<S>(initialState)
-  const params = useParams()
-  useEffect(() => {
-    if (baseProps.refForm) {
-      initForm(baseProps.refForm.current)
-    }
-    const id = buildId<ID>(params, p ? p.keys : undefined)
-    if (id) {
-      if (p && p.initialize) {
-        p.initialize(id, baseProps.load, setState, p.callback)
-      } else {
-        baseProps.load(id, p ? p.callback : undefined)
-      }
-    }
-  }, [])
-  return { ...baseProps }
-}
-
-export const useCoreView = <T, ID, S>(
-  refForm: any,
-  initialState: S,
-  service: ((id: ID, ctx?: any) => Promise<T>) | ViewService<T, ID>,
-  p1: ViewParameter,
-  p?: ViewComponentParam<T, ID, S>,
-) => {
-  const [state, setState] = useMergeState<S>(initialState)
-  const [running, setRunning] = useState<boolean>()
-  const navigate = useNavigate()
-
-  const back = (event: any) => {
-    if (event) {
-      event.preventDefault()
-    }
-    navigate(-1)
-  }
-
-  const getModelName = (f?: HTMLFormElement) => {
-    if (p && p.name) {
-      return p.name
-    }
-    return getModelName2(f, "model")
-  }
-
-  const showModel = (model: T) => {
-    const n: string = getModelName(refForm.current)
-    const objSet: any = {}
-    objSet[n] = model
-    setState(objSet)
-  }
-
-  const _handleNotFound = (form?: any): void => {
-    const msg = message(p1.resource.value, "error_not_found", "error")
-    if (form) {
-      setReadOnly(form)
-    }
-    p1.showError(msg.message, msg.title)
-  }
-  const handleNotFound = p && p.handleNotFound ? p.handleNotFound : _handleNotFound
-
-  const _load = (_id: ID, callback?: (m: T, showM: (m2: T) => void) => void) => {
-    const id: any = _id
-    if (id != null && id !== "") {
-      setRunning(true)
-      showLoading(p1.loading)
-      const fn = typeof service === "function" ? service : service.load
-      fn(id)
-        .then((obj) => {
-          if (!obj) {
-            handleNotFound(refForm.current)
-          } else {
-            if (callback) {
-              callback(obj, showModel)
-            } else {
-              showModel(obj)
-            }
-          }
-          setRunning(false)
-          hideLoading(p1.loading)
-        })
-        .catch((err) => {
-          const data = err && err.response ? err.response : err
-          const r = p1.resource
-          const title = r.value("error")
-          let msg = r.value("error_internal")
-          if (data && data.status === 404) {
-            handleNotFound(refForm.current)
-          } else {
-            if (data && data.status) {
-              msg = messageByHttpStatus(data.status, r.value)
-            }
-            setReadOnly(refForm.current)
-            p1.showError(msg, title)
-          }
-          setRunning(false)
-          hideLoading(p1.loading)
-        })
-    }
-  }
-  const load = p && p.load ? p.load : _load
-
-  return {
-    state,
-    setState,
-    refForm,
-    resource: p1.resource.resource(),
-    running,
-    setRunning,
-    showModel,
-    getModelName,
-    handleNotFound,
-    load,
-    back,
-  }
-}