react-hook-core 0.2.5 → 0.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/com.ts +53 -53
- package/src/edit.ts +1 -1
- package/src/merge.ts +23 -23
- package/src/route.ts +90 -90
- package/src/search.ts +618 -618
- package/src/state.ts +194 -194
- package/src/update.ts +86 -86
- package/src/useEdit.ts +12 -2
package/package.json
CHANGED
package/src/com.ts
CHANGED
|
@@ -1,53 +1,53 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { Locale, pageSizes } from './core';
|
|
3
|
-
|
|
4
|
-
export interface PageSizeProps {
|
|
5
|
-
id?: string;
|
|
6
|
-
name?: string;
|
|
7
|
-
size?: number;
|
|
8
|
-
sizes?: number[];
|
|
9
|
-
onChange?: React.ChangeEventHandler<HTMLSelectElement>;
|
|
10
|
-
}
|
|
11
|
-
export function PageSizeSelect(p: PageSizeProps) {
|
|
12
|
-
const g = p.sizes;
|
|
13
|
-
const s = (!g || g.length === 0 ? pageSizes : g);
|
|
14
|
-
const opts = s.map(pgSize => React.createElement('option', { key: pgSize, value: pgSize }, pgSize));
|
|
15
|
-
return React.createElement('select', { id: p.id, name: p.name, defaultValue: p.size, onChange: p.onChange }, opts);
|
|
16
|
-
}
|
|
17
|
-
export interface Props {
|
|
18
|
-
id?: string;
|
|
19
|
-
name?: string;
|
|
20
|
-
size?: number;
|
|
21
|
-
sizes?: number[];
|
|
22
|
-
className?: string;
|
|
23
|
-
maxLength?: number;
|
|
24
|
-
value?: string;
|
|
25
|
-
placeholder?: string;
|
|
26
|
-
pageSizeChanged?: (event: any) => void;
|
|
27
|
-
search?: React.MouseEventHandler<HTMLElement>;
|
|
28
|
-
toggle?: React.MouseEventHandler<HTMLElement>;
|
|
29
|
-
clear?: React.MouseEventHandler<HTMLButtonElement>;
|
|
30
|
-
onChange?: (e: any, callback?: (() => void) | undefined, lc?: Locale | undefined) => void;
|
|
31
|
-
}
|
|
32
|
-
export function Search(p: Props) {
|
|
33
|
-
return (React.createElement(React.Fragment, null,
|
|
34
|
-
React.createElement("label", { className: p.className },
|
|
35
|
-
p.pageSizeChanged && React.createElement(PageSizeSelect, { size: p.size, sizes: p.sizes, onChange: p.pageSizeChanged, name: p.name, id: p.id }),
|
|
36
|
-
React.createElement("input", { type: 'text', id: 'q', name: 'q', value: p.value || '', onChange: p.onChange, maxLength: p.maxLength, placeholder: p.placeholder }),
|
|
37
|
-
p.clear && React.createElement("button", { type: 'button', hidden: !p.value, className: 'btn-remove-text', onClick: p.clear }),
|
|
38
|
-
p.toggle && React.createElement("button", { type: 'button', className: 'btn-filter', onClick: p.toggle }),
|
|
39
|
-
p.search && React.createElement("button", { type: 'submit', className: 'btn-search', onClick: p.search }))));
|
|
40
|
-
/*
|
|
41
|
-
return (
|
|
42
|
-
<>
|
|
43
|
-
<label className={p.className}>
|
|
44
|
-
{p.pageSizeChanged && <PageSizeSelect size={p.size} sizes={p.sizes} onChange={p.pageSizeChanged} name={p.name} id={p.id} />}
|
|
45
|
-
<input type='text' id='q' name='q' value={p.value || ''} onChange={p.onChange} maxLength={p.maxLength} placeholder={p.placeholder} />
|
|
46
|
-
{p.clear && <button type='button' hidden={!p.value} className='btn-remove-text' onClick={p.clear}/>}
|
|
47
|
-
{p.toggle && <button type='button' className='btn-filter' onClick={p.toggle} />}
|
|
48
|
-
{p.search && <button type='submit' className='btn-search' onClick={p.search} />}
|
|
49
|
-
</label>
|
|
50
|
-
</>
|
|
51
|
-
);
|
|
52
|
-
*/
|
|
53
|
-
}
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Locale, pageSizes } from './core';
|
|
3
|
+
|
|
4
|
+
export interface PageSizeProps {
|
|
5
|
+
id?: string;
|
|
6
|
+
name?: string;
|
|
7
|
+
size?: number;
|
|
8
|
+
sizes?: number[];
|
|
9
|
+
onChange?: React.ChangeEventHandler<HTMLSelectElement>;
|
|
10
|
+
}
|
|
11
|
+
export function PageSizeSelect(p: PageSizeProps) {
|
|
12
|
+
const g = p.sizes;
|
|
13
|
+
const s = (!g || g.length === 0 ? pageSizes : g);
|
|
14
|
+
const opts = s.map(pgSize => React.createElement('option', { key: pgSize, value: pgSize }, pgSize));
|
|
15
|
+
return React.createElement('select', { id: p.id, name: p.name, defaultValue: p.size, onChange: p.onChange }, opts);
|
|
16
|
+
}
|
|
17
|
+
export interface Props {
|
|
18
|
+
id?: string;
|
|
19
|
+
name?: string;
|
|
20
|
+
size?: number;
|
|
21
|
+
sizes?: number[];
|
|
22
|
+
className?: string;
|
|
23
|
+
maxLength?: number;
|
|
24
|
+
value?: string;
|
|
25
|
+
placeholder?: string;
|
|
26
|
+
pageSizeChanged?: (event: any) => void;
|
|
27
|
+
search?: React.MouseEventHandler<HTMLElement>;
|
|
28
|
+
toggle?: React.MouseEventHandler<HTMLElement>;
|
|
29
|
+
clear?: React.MouseEventHandler<HTMLButtonElement>;
|
|
30
|
+
onChange?: (e: any, callback?: (() => void) | undefined, lc?: Locale | undefined) => void;
|
|
31
|
+
}
|
|
32
|
+
export function Search(p: Props) {
|
|
33
|
+
return (React.createElement(React.Fragment, null,
|
|
34
|
+
React.createElement("label", { className: p.className },
|
|
35
|
+
p.pageSizeChanged && React.createElement(PageSizeSelect, { size: p.size, sizes: p.sizes, onChange: p.pageSizeChanged, name: p.name, id: p.id }),
|
|
36
|
+
React.createElement("input", { type: 'text', id: 'q', name: 'q', value: p.value || '', onChange: p.onChange, maxLength: p.maxLength, placeholder: p.placeholder }),
|
|
37
|
+
p.clear && React.createElement("button", { type: 'button', hidden: !p.value, className: 'btn-remove-text', onClick: p.clear }),
|
|
38
|
+
p.toggle && React.createElement("button", { type: 'button', className: 'btn-filter', onClick: p.toggle }),
|
|
39
|
+
p.search && React.createElement("button", { type: 'submit', className: 'btn-search', onClick: p.search }))));
|
|
40
|
+
/*
|
|
41
|
+
return (
|
|
42
|
+
<>
|
|
43
|
+
<label className={p.className}>
|
|
44
|
+
{p.pageSizeChanged && <PageSizeSelect size={p.size} sizes={p.sizes} onChange={p.pageSizeChanged} name={p.name} id={p.id} />}
|
|
45
|
+
<input type='text' id='q' name='q' value={p.value || ''} onChange={p.onChange} maxLength={p.maxLength} placeholder={p.placeholder} />
|
|
46
|
+
{p.clear && <button type='button' hidden={!p.value} className='btn-remove-text' onClick={p.clear}/>}
|
|
47
|
+
{p.toggle && <button type='button' className='btn-filter' onClick={p.toggle} />}
|
|
48
|
+
{p.search && <button type='submit' className='btn-search' onClick={p.search} />}
|
|
49
|
+
</label>
|
|
50
|
+
</>
|
|
51
|
+
);
|
|
52
|
+
*/
|
|
53
|
+
}
|
package/src/edit.ts
CHANGED
|
@@ -18,7 +18,7 @@ export interface EditParameter {
|
|
|
18
18
|
}
|
|
19
19
|
export interface GenericService<T, ID, R> extends ViewService<T, ID> {
|
|
20
20
|
patch?(obj: Partial<T>, ctx?: any): Promise<R>;
|
|
21
|
-
|
|
21
|
+
create(obj: T, ctx?: any): Promise<R>;
|
|
22
22
|
update(obj: T, ctx?: any): Promise<R>;
|
|
23
23
|
delete?(id: ID, ctx?: any): Promise<number>;
|
|
24
24
|
}
|
package/src/merge.ts
CHANGED
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import {useCallback, useEffect, useRef, useState} from 'react';
|
|
2
|
-
|
|
3
|
-
export type Callback<T> = (value?: T) => void;
|
|
4
|
-
export type DispatchWithCallback<T> = (value: T, callback?: Callback<T>) => void;
|
|
5
|
-
|
|
6
|
-
export function useMergeState<T>(initialState?: T | (() => T)): [T, DispatchWithCallback<Partial<T>>] {
|
|
7
|
-
const [state, _setState] = useState(initialState ? initialState : {} as any);
|
|
8
|
-
|
|
9
|
-
const callbackRef = useRef<Callback<T>>();
|
|
10
|
-
|
|
11
|
-
const setState = useCallback((newState: Partial<T>, callback?: Callback<T>): void => {
|
|
12
|
-
callbackRef.current = callback;
|
|
13
|
-
_setState((prevState: any) => Object.assign({}, prevState, newState));
|
|
14
|
-
}, [state]);
|
|
15
|
-
|
|
16
|
-
useEffect( () => {
|
|
17
|
-
if (callbackRef.current) {
|
|
18
|
-
callbackRef.current(state);
|
|
19
|
-
}
|
|
20
|
-
}, [state]);
|
|
21
|
-
|
|
22
|
-
return [state, setState];
|
|
23
|
-
}
|
|
1
|
+
import {useCallback, useEffect, useRef, useState} from 'react';
|
|
2
|
+
|
|
3
|
+
export type Callback<T> = (value?: T) => void;
|
|
4
|
+
export type DispatchWithCallback<T> = (value: T, callback?: Callback<T>) => void;
|
|
5
|
+
|
|
6
|
+
export function useMergeState<T>(initialState?: T | (() => T)): [T, DispatchWithCallback<Partial<T>>] {
|
|
7
|
+
const [state, _setState] = useState(initialState ? initialState : {} as any);
|
|
8
|
+
|
|
9
|
+
const callbackRef = useRef<Callback<T>>();
|
|
10
|
+
|
|
11
|
+
const setState = useCallback((newState: Partial<T>, callback?: Callback<T>): void => {
|
|
12
|
+
callbackRef.current = callback;
|
|
13
|
+
_setState((prevState: any) => Object.assign({}, prevState, newState));
|
|
14
|
+
}, [state]);
|
|
15
|
+
|
|
16
|
+
useEffect( () => {
|
|
17
|
+
if (callbackRef.current) {
|
|
18
|
+
callbackRef.current(state);
|
|
19
|
+
}
|
|
20
|
+
}, [state]);
|
|
21
|
+
|
|
22
|
+
return [state, setState];
|
|
23
|
+
}
|
package/src/route.ts
CHANGED
|
@@ -1,90 +1,90 @@
|
|
|
1
|
-
import * as qs from "query-string";
|
|
2
|
-
|
|
3
|
-
export function buildFromUrl<S>(modelT?: S): S {
|
|
4
|
-
return buildParameters<S>(window.location.search, modelT);
|
|
5
|
-
}
|
|
6
|
-
export function buildParameters<T>(url: string, model?: T): T {
|
|
7
|
-
let urlSearch = url;
|
|
8
|
-
const i = urlSearch.indexOf("?");
|
|
9
|
-
if (i >= 0) {
|
|
10
|
-
urlSearch = url.substring(i + 1);
|
|
11
|
-
}
|
|
12
|
-
try {
|
|
13
|
-
const parsed: any = convertToObject<T>(qs.parse(urlSearch), model);
|
|
14
|
-
return parsed;
|
|
15
|
-
} catch (error) {
|
|
16
|
-
console.log(error);
|
|
17
|
-
throw error;
|
|
18
|
-
}
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export function convertToObject<T>(input: any, model?: T): T {
|
|
22
|
-
if (model){
|
|
23
|
-
return parseToModel(input, model);
|
|
24
|
-
}
|
|
25
|
-
const output: any = {};
|
|
26
|
-
|
|
27
|
-
for (let key in input) {
|
|
28
|
-
const value = input[key];
|
|
29
|
-
const keys = key.split(".");
|
|
30
|
-
|
|
31
|
-
let currentObj: any = output;
|
|
32
|
-
for (let i = 0; i < keys.length; i++) {
|
|
33
|
-
const currentKey = keys[i];
|
|
34
|
-
|
|
35
|
-
if (!currentObj[currentKey]) {
|
|
36
|
-
if (i === keys.length - 1) {
|
|
37
|
-
currentObj[currentKey] = parseValue(value);
|
|
38
|
-
} else {
|
|
39
|
-
currentObj[currentKey] = {};
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
currentObj = currentObj[currentKey];
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
return output as T;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
function parseToModel(dest: any, src: any) {
|
|
51
|
-
if (typeof dest !== 'object' || typeof src !== 'object') {
|
|
52
|
-
return dest;
|
|
53
|
-
}
|
|
54
|
-
for (let key in src) {
|
|
55
|
-
if (!Object.hasOwn(dest, key)) continue;
|
|
56
|
-
if (src.hasOwnProperty(key)) {
|
|
57
|
-
if (src[key] && src[key].constructor === Object) {
|
|
58
|
-
if (!dest[key] || dest[key].constructor !== Object) {
|
|
59
|
-
dest[key] = {};
|
|
60
|
-
}
|
|
61
|
-
parseToModel(dest[key], src[key]);
|
|
62
|
-
} else if (src[key] instanceof Date) {
|
|
63
|
-
dest[key] = new Date(dest[key]);
|
|
64
|
-
} else if (typeof src[key] === 'boolean') {
|
|
65
|
-
if (dest[key].length >0){
|
|
66
|
-
dest[key] = new Boolean(dest[key]);
|
|
67
|
-
}
|
|
68
|
-
} else if (typeof src[key] === 'number') {
|
|
69
|
-
if ( typeof dest[key] === 'string' && dest[key].indexOf(".") !== -1){
|
|
70
|
-
dest[key] = parseFloat(dest[key]);
|
|
71
|
-
} else{
|
|
72
|
-
dest[key] = parseInt(dest[key], 10);
|
|
73
|
-
}
|
|
74
|
-
} else if (typeof src[key] === 'string') {
|
|
75
|
-
if (dest[key]) {
|
|
76
|
-
dest[key] = dest[key].toString();
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
return dest;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
function parseValue(value: any): any {
|
|
85
|
-
// Check if the value is a string representing a number and parse it to a number
|
|
86
|
-
if (!isNaN(value) && !isNaN(parseFloat(value))) {
|
|
87
|
-
return parseFloat(value);
|
|
88
|
-
}
|
|
89
|
-
return value;
|
|
90
|
-
}
|
|
1
|
+
import * as qs from "query-string";
|
|
2
|
+
|
|
3
|
+
export function buildFromUrl<S>(modelT?: S): S {
|
|
4
|
+
return buildParameters<S>(window.location.search, modelT);
|
|
5
|
+
}
|
|
6
|
+
export function buildParameters<T>(url: string, model?: T): T {
|
|
7
|
+
let urlSearch = url;
|
|
8
|
+
const i = urlSearch.indexOf("?");
|
|
9
|
+
if (i >= 0) {
|
|
10
|
+
urlSearch = url.substring(i + 1);
|
|
11
|
+
}
|
|
12
|
+
try {
|
|
13
|
+
const parsed: any = convertToObject<T>(qs.parse(urlSearch), model);
|
|
14
|
+
return parsed;
|
|
15
|
+
} catch (error) {
|
|
16
|
+
console.log(error);
|
|
17
|
+
throw error;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export function convertToObject<T>(input: any, model?: T): T {
|
|
22
|
+
if (model){
|
|
23
|
+
return parseToModel(input, model);
|
|
24
|
+
}
|
|
25
|
+
const output: any = {};
|
|
26
|
+
|
|
27
|
+
for (let key in input) {
|
|
28
|
+
const value = input[key];
|
|
29
|
+
const keys = key.split(".");
|
|
30
|
+
|
|
31
|
+
let currentObj: any = output;
|
|
32
|
+
for (let i = 0; i < keys.length; i++) {
|
|
33
|
+
const currentKey = keys[i];
|
|
34
|
+
|
|
35
|
+
if (!currentObj[currentKey]) {
|
|
36
|
+
if (i === keys.length - 1) {
|
|
37
|
+
currentObj[currentKey] = parseValue(value);
|
|
38
|
+
} else {
|
|
39
|
+
currentObj[currentKey] = {};
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
currentObj = currentObj[currentKey];
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
return output as T;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
function parseToModel(dest: any, src: any) {
|
|
51
|
+
if (typeof dest !== 'object' || typeof src !== 'object') {
|
|
52
|
+
return dest;
|
|
53
|
+
}
|
|
54
|
+
for (let key in src) {
|
|
55
|
+
if (!Object.hasOwn(dest, key)) continue;
|
|
56
|
+
if (src.hasOwnProperty(key)) {
|
|
57
|
+
if (src[key] && src[key].constructor === Object) {
|
|
58
|
+
if (!dest[key] || dest[key].constructor !== Object) {
|
|
59
|
+
dest[key] = {};
|
|
60
|
+
}
|
|
61
|
+
parseToModel(dest[key], src[key]);
|
|
62
|
+
} else if (src[key] instanceof Date) {
|
|
63
|
+
dest[key] = new Date(dest[key]);
|
|
64
|
+
} else if (typeof src[key] === 'boolean') {
|
|
65
|
+
if (dest[key].length >0){
|
|
66
|
+
dest[key] = new Boolean(dest[key]);
|
|
67
|
+
}
|
|
68
|
+
} else if (typeof src[key] === 'number') {
|
|
69
|
+
if ( typeof dest[key] === 'string' && dest[key].indexOf(".") !== -1){
|
|
70
|
+
dest[key] = parseFloat(dest[key]);
|
|
71
|
+
} else{
|
|
72
|
+
dest[key] = parseInt(dest[key], 10);
|
|
73
|
+
}
|
|
74
|
+
} else if (typeof src[key] === 'string') {
|
|
75
|
+
if (dest[key]) {
|
|
76
|
+
dest[key] = dest[key].toString();
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
return dest;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
function parseValue(value: any): any {
|
|
85
|
+
// Check if the value is a string representing a number and parse it to a number
|
|
86
|
+
if (!isNaN(value) && !isNaN(parseFloat(value))) {
|
|
87
|
+
return parseFloat(value);
|
|
88
|
+
}
|
|
89
|
+
return value;
|
|
90
|
+
}
|