@etsoo/react 1.5.18 → 1.5.19
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/lib/app/ReactUtils.d.ts +14 -1
- package/lib/app/ReactUtils.js +66 -2
- package/package.json +1 -1
- package/src/app/ReactUtils.ts +85 -13
package/lib/app/ReactUtils.d.ts
CHANGED
|
@@ -1,9 +1,21 @@
|
|
|
1
|
-
import { History } from '@reach/router';
|
|
1
|
+
import { History, HistorySource } from '@reach/router';
|
|
2
2
|
import React from 'react';
|
|
3
|
+
declare type MemoryHistorySource = HistorySource & {
|
|
4
|
+
history: {
|
|
5
|
+
get entries(): any;
|
|
6
|
+
get index(): number;
|
|
7
|
+
go(to: number): void;
|
|
8
|
+
};
|
|
9
|
+
};
|
|
3
10
|
/**
|
|
4
11
|
* React utils
|
|
5
12
|
*/
|
|
6
13
|
export declare namespace ReactUtils {
|
|
14
|
+
/**
|
|
15
|
+
* Cretae memory source to fix go back bug
|
|
16
|
+
* @param initialPath Initial path
|
|
17
|
+
*/
|
|
18
|
+
function createMemorySource(initialPath?: string): MemoryHistorySource;
|
|
7
19
|
/**
|
|
8
20
|
* Format input value
|
|
9
21
|
* @param value Input value
|
|
@@ -35,3 +47,4 @@ export declare namespace ReactUtils {
|
|
|
35
47
|
*/
|
|
36
48
|
function triggerChange(input: HTMLInputElement, value: string, cancelable: boolean): void;
|
|
37
49
|
}
|
|
50
|
+
export {};
|
package/lib/app/ReactUtils.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createHistory,
|
|
1
|
+
import { createHistory, navigate } from '@reach/router';
|
|
2
2
|
/**
|
|
3
3
|
* React utils
|
|
4
4
|
*/
|
|
@@ -7,6 +7,71 @@ export var ReactUtils;
|
|
|
7
7
|
// Memory history
|
|
8
8
|
// https://github.com/reach/router/issues/225
|
|
9
9
|
let memoryHistory;
|
|
10
|
+
/**
|
|
11
|
+
* Cretae memory source to fix go back bug
|
|
12
|
+
* @param initialPath Initial path
|
|
13
|
+
*/
|
|
14
|
+
function createMemorySource(initialPath = '/') {
|
|
15
|
+
const searchIndex = initialPath.indexOf('?');
|
|
16
|
+
const pathname = searchIndex > -1
|
|
17
|
+
? initialPath.substring(0, searchIndex)
|
|
18
|
+
: initialPath;
|
|
19
|
+
const initialLocation = {
|
|
20
|
+
pathname,
|
|
21
|
+
search: searchIndex > -1 ? initialPath.substring(searchIndex) : ''
|
|
22
|
+
};
|
|
23
|
+
let index = 0;
|
|
24
|
+
const stack = [initialLocation];
|
|
25
|
+
const states = [null];
|
|
26
|
+
return {
|
|
27
|
+
get location() {
|
|
28
|
+
return stack[index];
|
|
29
|
+
},
|
|
30
|
+
addEventListener(name, fn) { },
|
|
31
|
+
removeEventListener(name, fn) { },
|
|
32
|
+
history: {
|
|
33
|
+
get entries() {
|
|
34
|
+
return stack;
|
|
35
|
+
},
|
|
36
|
+
get index() {
|
|
37
|
+
return index;
|
|
38
|
+
},
|
|
39
|
+
get state() {
|
|
40
|
+
return states[index];
|
|
41
|
+
},
|
|
42
|
+
pushState(state, _, uri) {
|
|
43
|
+
const [pathname, search = ''] = uri.split('?');
|
|
44
|
+
index++;
|
|
45
|
+
// View a, index = 0
|
|
46
|
+
// View b, index = 1
|
|
47
|
+
// Go(-1), a, index = 0
|
|
48
|
+
// View c, index = 1, directly push is wrong
|
|
49
|
+
if (index < stack.length) {
|
|
50
|
+
stack.splice(index, stack.length - index);
|
|
51
|
+
states.splice(index, stack.length - index);
|
|
52
|
+
}
|
|
53
|
+
stack.push({
|
|
54
|
+
pathname,
|
|
55
|
+
search: search.length ? `?${search}` : search
|
|
56
|
+
});
|
|
57
|
+
states.push(state);
|
|
58
|
+
},
|
|
59
|
+
replaceState(state, _, uri) {
|
|
60
|
+
const [pathname, search = ''] = uri.split('?');
|
|
61
|
+
stack[index] = { pathname, search };
|
|
62
|
+
states[index] = state;
|
|
63
|
+
},
|
|
64
|
+
go(to) {
|
|
65
|
+
const newIndex = index + to;
|
|
66
|
+
if (newIndex < 0 || newIndex > states.length - 1) {
|
|
67
|
+
return;
|
|
68
|
+
}
|
|
69
|
+
index = newIndex;
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
};
|
|
73
|
+
}
|
|
74
|
+
ReactUtils.createMemorySource = createMemorySource;
|
|
10
75
|
/**
|
|
11
76
|
* Format input value
|
|
12
77
|
* @param value Input value
|
|
@@ -41,7 +106,6 @@ export var ReactUtils;
|
|
|
41
106
|
* @returns NavigateFn
|
|
42
107
|
*/
|
|
43
108
|
function getNavigateFn() {
|
|
44
|
-
console.log('getNavigateFn', memoryHistory, memoryHistory === null || memoryHistory === void 0 ? void 0 : memoryHistory.navigate, (memoryHistory === null || memoryHistory === void 0 ? void 0 : memoryHistory.navigate) === navigate);
|
|
45
109
|
if (memoryHistory == null)
|
|
46
110
|
return navigate;
|
|
47
111
|
return memoryHistory.navigate;
|
package/package.json
CHANGED
package/src/app/ReactUtils.ts
CHANGED
|
@@ -1,11 +1,14 @@
|
|
|
1
|
-
import {
|
|
2
|
-
createHistory,
|
|
3
|
-
createMemorySource,
|
|
4
|
-
History,
|
|
5
|
-
navigate
|
|
6
|
-
} from '@reach/router';
|
|
1
|
+
import { createHistory, History, HistorySource, navigate } from '@reach/router';
|
|
7
2
|
import React from 'react';
|
|
8
3
|
|
|
4
|
+
type MemoryHistorySource = HistorySource & {
|
|
5
|
+
history: {
|
|
6
|
+
get entries(): any;
|
|
7
|
+
get index(): number;
|
|
8
|
+
go(to: number): void;
|
|
9
|
+
};
|
|
10
|
+
};
|
|
11
|
+
|
|
9
12
|
/**
|
|
10
13
|
* React utils
|
|
11
14
|
*/
|
|
@@ -14,6 +17,82 @@ export namespace ReactUtils {
|
|
|
14
17
|
// https://github.com/reach/router/issues/225
|
|
15
18
|
let memoryHistory: History | null;
|
|
16
19
|
|
|
20
|
+
/**
|
|
21
|
+
* Cretae memory source to fix go back bug
|
|
22
|
+
* @param initialPath Initial path
|
|
23
|
+
*/
|
|
24
|
+
export function createMemorySource(
|
|
25
|
+
initialPath: string = '/'
|
|
26
|
+
): MemoryHistorySource {
|
|
27
|
+
const searchIndex = initialPath.indexOf('?');
|
|
28
|
+
const pathname =
|
|
29
|
+
searchIndex > -1
|
|
30
|
+
? initialPath.substring(0, searchIndex)
|
|
31
|
+
: initialPath;
|
|
32
|
+
|
|
33
|
+
const initialLocation: any = {
|
|
34
|
+
pathname,
|
|
35
|
+
search: searchIndex > -1 ? initialPath.substring(searchIndex) : ''
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
let index = 0;
|
|
39
|
+
|
|
40
|
+
const stack = [initialLocation];
|
|
41
|
+
const states = [null];
|
|
42
|
+
|
|
43
|
+
return {
|
|
44
|
+
get location() {
|
|
45
|
+
return stack[index];
|
|
46
|
+
},
|
|
47
|
+
addEventListener(name, fn) {},
|
|
48
|
+
removeEventListener(name, fn) {},
|
|
49
|
+
history: {
|
|
50
|
+
get entries() {
|
|
51
|
+
return stack;
|
|
52
|
+
},
|
|
53
|
+
get index() {
|
|
54
|
+
return index;
|
|
55
|
+
},
|
|
56
|
+
get state() {
|
|
57
|
+
return states[index];
|
|
58
|
+
},
|
|
59
|
+
pushState(state, _, uri) {
|
|
60
|
+
const [pathname, search = ''] = uri.split('?');
|
|
61
|
+
index++;
|
|
62
|
+
|
|
63
|
+
// View a, index = 0
|
|
64
|
+
// View b, index = 1
|
|
65
|
+
// Go(-1), a, index = 0
|
|
66
|
+
// View c, index = 1, directly push is wrong
|
|
67
|
+
if (index < stack.length) {
|
|
68
|
+
stack.splice(index, stack.length - index);
|
|
69
|
+
states.splice(index, stack.length - index);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
stack.push({
|
|
73
|
+
pathname,
|
|
74
|
+
search: search.length ? `?${search}` : search
|
|
75
|
+
});
|
|
76
|
+
states.push(state);
|
|
77
|
+
},
|
|
78
|
+
replaceState(state, _, uri) {
|
|
79
|
+
const [pathname, search = ''] = uri.split('?');
|
|
80
|
+
stack[index] = { pathname, search };
|
|
81
|
+
states[index] = state;
|
|
82
|
+
},
|
|
83
|
+
go(to: number) {
|
|
84
|
+
const newIndex = index + to;
|
|
85
|
+
|
|
86
|
+
if (newIndex < 0 || newIndex > states.length - 1) {
|
|
87
|
+
return;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
index = newIndex;
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
};
|
|
94
|
+
}
|
|
95
|
+
|
|
17
96
|
/**
|
|
18
97
|
* Format input value
|
|
19
98
|
* @param value Input value
|
|
@@ -50,13 +129,6 @@ export namespace ReactUtils {
|
|
|
50
129
|
* @returns NavigateFn
|
|
51
130
|
*/
|
|
52
131
|
export function getNavigateFn() {
|
|
53
|
-
console.log(
|
|
54
|
-
'getNavigateFn',
|
|
55
|
-
memoryHistory,
|
|
56
|
-
memoryHistory?.navigate,
|
|
57
|
-
memoryHistory?.navigate === navigate
|
|
58
|
-
);
|
|
59
|
-
|
|
60
132
|
if (memoryHistory == null) return navigate;
|
|
61
133
|
return memoryHistory.navigate;
|
|
62
134
|
}
|