@etsoo/react 1.7.93 → 1.7.95

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.
Files changed (93) hide show
  1. package/README.md +2 -1
  2. package/__tests__/EventWatcher.tsx +21 -21
  3. package/__tests__/ReactUtils.ts +4 -4
  4. package/__tests__/tsconfig.json +17 -17
  5. package/babel.config.json +8 -8
  6. package/lib/app/CoreConstants.js +2 -2
  7. package/lib/app/EventWatcher.d.ts +1 -1
  8. package/lib/app/EventWatcher.js +3 -5
  9. package/lib/app/InputDialogProps.d.ts +2 -2
  10. package/lib/app/ReactUtils.d.ts +2 -2
  11. package/lib/app/ReactUtils.js +20 -19
  12. package/lib/components/DnDList.d.ts +3 -3
  13. package/lib/components/DnDList.js +4 -4
  14. package/lib/components/DynamicRouter.d.ts +9 -1
  15. package/lib/components/DynamicRouter.js +18 -2
  16. package/lib/components/GridColumn.d.ts +6 -6
  17. package/lib/components/GridColumn.js +7 -7
  18. package/lib/components/GridLoader.d.ts +4 -4
  19. package/lib/components/GridLoader.js +2 -2
  20. package/lib/components/GridMethodRef.d.ts +2 -2
  21. package/lib/components/ListItemReact.d.ts +2 -2
  22. package/lib/components/ScrollRestoration.js +3 -3
  23. package/lib/components/ScrollerGrid.d.ts +7 -12
  24. package/lib/components/ScrollerGrid.js +13 -17
  25. package/lib/components/ScrollerList.d.ts +6 -10
  26. package/lib/components/ScrollerList.js +15 -14
  27. package/lib/custom/CustomFieldReact.d.ts +1 -1
  28. package/lib/index.d.ts +32 -32
  29. package/lib/index.js +31 -31
  30. package/lib/notifier/Notifier.d.ts +5 -5
  31. package/lib/notifier/Notifier.js +7 -7
  32. package/lib/states/CultureState.d.ts +3 -3
  33. package/lib/states/CultureState.js +3 -3
  34. package/lib/states/IState.d.ts +2 -2
  35. package/lib/states/PageState.d.ts +2 -2
  36. package/lib/states/PageState.js +2 -3
  37. package/lib/states/State.d.ts +3 -3
  38. package/lib/states/State.js +2 -2
  39. package/lib/states/UserState.d.ts +2 -2
  40. package/lib/states/UserState.js +5 -5
  41. package/lib/uses/useAsyncState.d.ts +1 -1
  42. package/lib/uses/useAsyncState.js +1 -1
  43. package/lib/uses/useCombinedRefs.js +2 -2
  44. package/lib/uses/useDelayedExecutor.d.ts +1 -1
  45. package/lib/uses/useDelayedExecutor.js +2 -2
  46. package/lib/uses/useDimensions.d.ts +1 -1
  47. package/lib/uses/useDimensions.js +3 -3
  48. package/lib/uses/useParamsEx.d.ts +1 -1
  49. package/lib/uses/useParamsEx.js +2 -2
  50. package/lib/uses/useRefs.d.ts +2 -2
  51. package/lib/uses/useRefs.js +1 -1
  52. package/lib/uses/useSearchParamsEx.d.ts +1 -1
  53. package/lib/uses/useSearchParamsEx.js +3 -3
  54. package/lib/uses/useTimeout.js +2 -2
  55. package/lib/uses/useWindowScroll.js +3 -3
  56. package/lib/uses/useWindowSize.js +4 -5
  57. package/package.json +72 -74
  58. package/src/app/CoreConstants.ts +8 -8
  59. package/src/app/EventWatcher.ts +50 -52
  60. package/src/app/InputDialogProps.ts +16 -16
  61. package/src/app/ReactUtils.ts +206 -208
  62. package/src/components/DnDList.tsx +268 -283
  63. package/src/components/DynamicRouter.tsx +46 -21
  64. package/src/components/GridColumn.ts +201 -201
  65. package/src/components/GridLoader.ts +121 -121
  66. package/src/components/GridMethodRef.ts +26 -26
  67. package/src/components/ListItemReact.ts +2 -2
  68. package/src/components/ScrollRestoration.tsx +24 -24
  69. package/src/components/ScrollerGrid.tsx +428 -448
  70. package/src/components/ScrollerList.tsx +320 -332
  71. package/src/custom/CustomFieldReact.ts +12 -12
  72. package/src/index.ts +35 -35
  73. package/src/notifier/Notifier.ts +229 -240
  74. package/src/states/CultureState.ts +51 -52
  75. package/src/states/IState.ts +19 -19
  76. package/src/states/PageState.ts +63 -66
  77. package/src/states/State.tsx +47 -51
  78. package/src/states/UserState.ts +98 -98
  79. package/src/uses/useAsyncState.ts +37 -39
  80. package/src/uses/useCombinedRefs.ts +16 -16
  81. package/src/uses/useDelayedExecutor.ts +8 -8
  82. package/src/uses/useDimensions.ts +102 -103
  83. package/src/uses/useParamsEx.ts +6 -6
  84. package/src/uses/useRefs.ts +6 -6
  85. package/src/uses/useSearchParamsEx.ts +13 -13
  86. package/src/uses/useTimeout.ts +17 -17
  87. package/src/uses/useWindowScroll.ts +43 -43
  88. package/src/uses/useWindowSize.ts +46 -49
  89. package/tsconfig.json +17 -17
  90. package/.eslintignore +0 -3
  91. package/.eslintrc.json +0 -38
  92. package/.prettierignore +0 -5
  93. package/.prettierrc +0 -6
@@ -1,17 +1,17 @@
1
1
  import {
2
- CustomFieldData,
3
- CustomFieldProps,
4
- CustomFieldRef,
5
- ICustomField
6
- } from '@etsoo/appscript';
2
+ CustomFieldData,
3
+ CustomFieldProps,
4
+ CustomFieldRef,
5
+ ICustomField
6
+ } from "@etsoo/appscript";
7
7
 
8
8
  /**
9
9
  * React custom field interface
10
10
  * React自定义字段接口
11
11
  */
12
12
  export interface ICustomFieldReact<
13
- V,
14
- D extends CustomFieldData = CustomFieldData
13
+ V,
14
+ D extends CustomFieldData = CustomFieldData
15
15
  > extends ICustomField<V, D, CustomFieldReactProps<V, D>, React.JSX.Element> {}
16
16
 
17
17
  /**
@@ -19,10 +19,10 @@ export interface ICustomFieldReact<
19
19
  * React自定义字段属性
20
20
  */
21
21
  export type CustomFieldReactProps<
22
- V,
23
- D extends CustomFieldData = CustomFieldData
22
+ V,
23
+ D extends CustomFieldData = CustomFieldData
24
24
  > = CustomFieldProps<D, V> & {
25
- mref: React.Ref<CustomFieldRef<V>>;
25
+ mref: React.Ref<CustomFieldRef<V>>;
26
26
  };
27
27
 
28
28
  /**
@@ -30,6 +30,6 @@ export type CustomFieldReactProps<
30
30
  * React自定义字段渲染结果集合
31
31
  */
32
32
  export type CustomFieldReactCollection<D extends CustomFieldData> = Record<
33
- string,
34
- [React.RefObject<CustomFieldRef<unknown>>, D]
33
+ string,
34
+ [React.RefObject<CustomFieldRef<unknown>>, D]
35
35
  >;
package/src/index.ts CHANGED
@@ -1,47 +1,47 @@
1
1
  // app
2
- export * from './app/CoreConstants';
3
- export * from './app/EventWatcher';
4
- export * from './app/InputDialogProps';
5
- export * from './app/ReactUtils';
2
+ export * from "./app/CoreConstants";
3
+ export * from "./app/EventWatcher";
4
+ export * from "./app/InputDialogProps";
5
+ export * from "./app/ReactUtils";
6
6
 
7
7
  // components
8
- export * from './components/DnDList';
9
- export * from './components/DynamicRouter';
10
- export * from './components/GridColumn';
11
- export * from './components/GridLoader';
12
- export * from './components/GridMethodRef';
13
- export * from './components/ListItemReact';
14
- export * from './components/ScrollerGrid';
15
- export * from './components/ScrollerList';
16
- export * from './components/ScrollRestoration';
8
+ export * from "./components/DnDList";
9
+ export * from "./components/DynamicRouter";
10
+ export * from "./components/GridColumn";
11
+ export * from "./components/GridLoader";
12
+ export * from "./components/GridMethodRef";
13
+ export * from "./components/ListItemReact";
14
+ export * from "./components/ScrollerGrid";
15
+ export * from "./components/ScrollerList";
16
+ export * from "./components/ScrollRestoration";
17
17
  export type {
18
- ListOnScrollProps,
19
- GridOnScrollProps,
20
- VariableSizeGrid
21
- } from 'react-window';
18
+ ListOnScrollProps,
19
+ GridOnScrollProps,
20
+ VariableSizeGrid
21
+ } from "react-window";
22
22
 
23
23
  // custom
24
- export * from './custom/CustomFieldReact';
24
+ export * from "./custom/CustomFieldReact";
25
25
 
26
26
  // notifier
27
- export * from './notifier/Notifier';
28
- export * from '@etsoo/notificationbase';
27
+ export * from "./notifier/Notifier";
28
+ export * from "@etsoo/notificationbase";
29
29
 
30
30
  // states
31
- export * from './states/CultureState';
32
- export * from './states/IState';
33
- export * from './states/PageState';
34
- export * from './states/State';
35
- export * from './states/UserState';
31
+ export * from "./states/CultureState";
32
+ export * from "./states/IState";
33
+ export * from "./states/PageState";
34
+ export * from "./states/State";
35
+ export * from "./states/UserState";
36
36
 
37
37
  // uses
38
- export * from './uses/useAsyncState';
39
- export * from './uses/useCombinedRefs';
40
- export * from './uses/useDelayedExecutor';
41
- export * from './uses/useDimensions';
42
- export * from './uses/useParamsEx';
43
- export * from './uses/useRefs';
44
- export * from './uses/useSearchParamsEx';
45
- export * from './uses/useTimeout';
46
- export * from './uses/useWindowScroll';
47
- export * from './uses/useWindowSize';
38
+ export * from "./uses/useAsyncState";
39
+ export * from "./uses/useCombinedRefs";
40
+ export * from "./uses/useDelayedExecutor";
41
+ export * from "./uses/useDimensions";
42
+ export * from "./uses/useParamsEx";
43
+ export * from "./uses/useRefs";
44
+ export * from "./uses/useSearchParamsEx";
45
+ export * from "./uses/useTimeout";
46
+ export * from "./uses/useWindowScroll";
47
+ export * from "./uses/useWindowSize";
@@ -1,290 +1,279 @@
1
- import React from 'react';
1
+ import React from "react";
2
2
  import {
3
- INotificaseBase,
4
- INotification,
5
- INotifier,
6
- Notification,
7
- NotificationAlign,
8
- NotificationCallProps,
9
- NotificationContainer,
10
- NotificationDictionary,
11
- NotificationRenderProps
12
- } from '@etsoo/notificationbase';
13
- import { IAction } from '@etsoo/appscript';
14
- import { State } from '../states/State';
15
- import { IProviderProps, IUpdate } from '../states/IState';
3
+ INotificaseBase,
4
+ INotification,
5
+ INotifier,
6
+ Notification,
7
+ NotificationAlign,
8
+ NotificationCallProps,
9
+ NotificationContainer,
10
+ NotificationDictionary,
11
+ NotificationRenderProps
12
+ } from "@etsoo/notificationbase";
13
+ import { IAction } from "@etsoo/appscript";
14
+ import { State } from "../states/State";
15
+ import { IProviderProps, IUpdate } from "../states/IState";
16
16
 
17
17
  /**
18
18
  * React notification call props
19
19
  */
20
20
  export interface NotificationReactCallProps extends NotificationCallProps {
21
- /**
22
- * Full width
23
- */
24
- fullWidth?: boolean;
25
-
26
- /**
27
- * Full screen
28
- */
29
- fullScreen?: boolean;
30
-
31
- /**
32
- * Inputs layout
33
- */
34
- inputs?: React.ReactNode;
35
-
36
- /**
37
- * Max width
38
- */
39
- maxWidth?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | false;
40
-
41
- /**
42
- * OK label
43
- */
44
- okLabel?: string;
45
-
46
- /**
47
- * false to hide cancel button
48
- */
49
- cancelButton?: boolean;
50
-
51
- /**
52
- * Cancel label
53
- */
54
- cancelLabel?: string;
55
-
56
- /**
57
- * Window is closable
58
- */
59
- closable?: boolean;
60
-
61
- /**
62
- * Draggable
63
- */
64
- draggable?: boolean;
65
-
66
- /**
67
- * Type
68
- */
69
- type?: string;
70
-
71
- /**
72
- * false to hide primary button
73
- */
74
- primaryButton?: boolean;
75
-
76
- /**
77
- * Primary button props
78
- */
79
- primaryButtonProps?: {};
80
-
81
- /**
82
- * Buttons to override default buttons
83
- */
84
- buttons?: (
85
- notification: INotificationReact,
86
- callback: (
87
- event: React.MouseEvent<HTMLButtonElement>,
88
- value?: any
89
- ) => Promise<boolean>
90
- ) => React.ReactNode;
21
+ /**
22
+ * Full width
23
+ */
24
+ fullWidth?: boolean;
25
+
26
+ /**
27
+ * Full screen
28
+ */
29
+ fullScreen?: boolean;
30
+
31
+ /**
32
+ * Inputs layout
33
+ */
34
+ inputs?: React.ReactNode;
35
+
36
+ /**
37
+ * Max width
38
+ */
39
+ maxWidth?: "xs" | "sm" | "md" | "lg" | "xl" | false;
40
+
41
+ /**
42
+ * OK label
43
+ */
44
+ okLabel?: string;
45
+
46
+ /**
47
+ * false to hide cancel button
48
+ */
49
+ cancelButton?: boolean;
50
+
51
+ /**
52
+ * Cancel label
53
+ */
54
+ cancelLabel?: string;
55
+
56
+ /**
57
+ * Window is closable
58
+ */
59
+ closable?: boolean;
60
+
61
+ /**
62
+ * Draggable
63
+ */
64
+ draggable?: boolean;
65
+
66
+ /**
67
+ * Type
68
+ */
69
+ type?: string;
70
+
71
+ /**
72
+ * false to hide primary button
73
+ */
74
+ primaryButton?: boolean;
75
+
76
+ /**
77
+ * Primary button props
78
+ */
79
+ primaryButtonProps?: {};
80
+
81
+ /**
82
+ * Buttons to override default buttons
83
+ */
84
+ buttons?: (
85
+ notification: INotificationReact,
86
+ callback: (
87
+ event: React.MouseEvent<HTMLButtonElement>,
88
+ value?: any
89
+ ) => Promise<boolean>
90
+ ) => React.ReactNode;
91
91
  }
92
92
 
93
93
  /**
94
94
  * React notification interface
95
95
  */
96
96
  export interface INotificationReact
97
- extends INotification<React.ReactNode, NotificationReactCallProps> {}
97
+ extends INotification<React.ReactNode, NotificationReactCallProps> {}
98
98
 
99
99
  /**
100
100
  * React notification base interface
101
101
  */
102
102
  export interface INotificationBaseReact
103
- extends INotificaseBase<React.ReactNode, NotificationReactCallProps> {}
103
+ extends INotificaseBase<React.ReactNode, NotificationReactCallProps> {}
104
104
 
105
105
  interface ReactNotifications
106
- extends NotificationDictionary<
107
- React.ReactNode,
108
- NotificationReactCallProps
109
- > {}
106
+ extends NotificationDictionary<React.ReactNode, NotificationReactCallProps> {}
110
107
 
111
108
  /**
112
109
  * Action to manage the notifier
113
110
  */
114
111
  interface INotifierAction extends IAction {
115
- /**
116
- * Notification
117
- */
118
- notification: INotificationReact;
119
-
120
- /**
121
- * Add or dismiss
122
- */
123
- dismiss: boolean;
112
+ /**
113
+ * Notification
114
+ */
115
+ notification: INotificationReact;
116
+
117
+ /**
118
+ * Add or dismiss
119
+ */
120
+ dismiss: boolean;
124
121
  }
125
122
 
126
123
  /**
127
124
  * React notification
128
125
  */
129
126
  export abstract class NotificationReact
130
- extends Notification<React.ReactNode, NotificationReactCallProps>
131
- implements INotificationReact {}
127
+ extends Notification<React.ReactNode, NotificationReactCallProps>
128
+ implements INotificationReact {}
132
129
 
133
130
  /**
134
131
  * React notification render props
135
132
  */
136
133
  export interface NotificationReactRenderProps
137
- extends NotificationRenderProps,
138
- IProviderProps<INotifierAction> {}
134
+ extends NotificationRenderProps,
135
+ IProviderProps<INotifierAction> {}
139
136
 
140
137
  /**
141
138
  * Notifier interface
142
139
  */
143
140
  export interface INotifierReact
144
- extends INotifier<React.ReactNode, NotificationReactCallProps> {
145
- /**
146
- * Create state provider
147
- * @param className Style class name
148
- * @param debug Is debug mode
149
- * @returns Provider
150
- */
151
- createProvider(
152
- className?: string,
153
- debug?: boolean
154
- ): React.FunctionComponent<NotificationReactRenderProps>;
141
+ extends INotifier<React.ReactNode, NotificationReactCallProps> {
142
+ /**
143
+ * Create state provider
144
+ * @param className Style class name
145
+ * @param debug Is debug mode
146
+ * @returns Provider
147
+ */
148
+ createProvider(
149
+ className?: string,
150
+ debug?: boolean
151
+ ): React.FunctionComponent<NotificationReactRenderProps>;
155
152
  }
156
153
 
157
154
  /**
158
155
  * Notifier for React
159
156
  */
160
157
  export abstract class NotifierReact
161
- extends NotificationContainer<React.ReactNode, NotificationReactCallProps>
162
- implements INotifierReact
158
+ extends NotificationContainer<React.ReactNode, NotificationReactCallProps>
159
+ implements INotifierReact
163
160
  {
164
- // Instance
165
- private static _instance: INotifierReact;
166
-
167
- /**
168
- * Singleton instance
169
- */
170
- static get instance() {
171
- return NotifierReact._instance;
172
- }
173
-
174
- /**
175
- * Update notifier
176
- * @param notifier Notifier
177
- */
178
- protected static updateInstance(notifier: INotifierReact) {
179
- NotifierReact._instance = notifier;
180
- }
181
-
182
- /**
183
- * Constructor
184
- */
185
- protected constructor() {
186
- super((notification, dismiss) => {
187
- // Debug
188
- if (this.debug) {
189
- console.debug(
190
- 'NotifierReact.updateCallback',
191
- notification,
192
- dismiss,
193
- this.loadingCount
194
- );
195
- }
196
-
197
- // Make sure the state update is set
198
- if (this.stateUpdate) this.stateUpdate({ notification, dismiss });
199
- });
200
- }
201
-
202
- /**
203
- * State update
204
- */
205
- protected stateUpdate?: React.Dispatch<INotifierAction>;
206
-
207
- /**
208
- * Create align container
209
- * @param align Align
210
- * @param children Children
211
- * @param options Other options
212
- */
213
- protected abstract createContainer(
214
- align: NotificationAlign,
215
- children: React.ReactNode[]
216
- ): React.ReactElement;
217
-
218
- /**
219
- * Create state provider
220
- * @param className Style class name
221
- * @returns Provider
222
- */
223
- createProvider(className?: string, debug?: boolean) {
224
- // Custom creator
225
- const creator = (
226
- state: ReactNotifications,
227
- update: React.Dispatch<INotifierAction>,
228
- props: NotificationReactRenderProps
229
- ) => {
230
- // Hold the current state update
231
- this.stateUpdate = update;
232
-
233
- // Aligns collection
234
- const aligns: React.ReactNode[] = [];
235
- for (const align in state) {
236
- // Notifications under the align
237
- const notifications = state[align];
238
-
239
- // UI collections
240
- const ui = notifications.map((notification) =>
241
- notification.render(
242
- props,
243
- className ? className + '-item' : className
244
- )
245
- );
246
-
247
- // Add to the collection
248
- aligns.push(this.createContainer(Number(align), ui));
249
- }
250
-
251
- // Debug
252
- if (debug) {
253
- console.debug(
254
- 'NotifierReact.createProvider',
255
- className,
256
- state,
257
- aligns
258
- );
259
- }
260
-
261
- // Generate the component
262
- return React.createElement('div', { className }, aligns);
263
- };
264
-
265
- // Create state
266
- const { provider } = State.create(
267
- (
268
- state: NotificationDictionary<
269
- React.ReactNode,
270
- NotificationReactCallProps
271
- >,
272
- _action: INotifierAction
273
- ) => {
274
- // Collection update is done with NotificationContainer
275
- return { ...state };
276
- },
277
- this.notifications,
278
- {} as IUpdate<
279
- NotificationDictionary<
280
- React.ReactNode,
281
- NotificationReactCallProps
282
- >,
283
- INotifierAction
284
- >,
285
- creator
161
+ // Instance
162
+ private static _instance: INotifierReact;
163
+
164
+ /**
165
+ * Singleton instance
166
+ */
167
+ static get instance() {
168
+ return NotifierReact._instance;
169
+ }
170
+
171
+ /**
172
+ * Update notifier
173
+ * @param notifier Notifier
174
+ */
175
+ protected static updateInstance(notifier: INotifierReact) {
176
+ NotifierReact._instance = notifier;
177
+ }
178
+
179
+ /**
180
+ * Constructor
181
+ */
182
+ protected constructor() {
183
+ super((notification, dismiss) => {
184
+ // Debug
185
+ if (this.debug) {
186
+ console.debug(
187
+ "NotifierReact.updateCallback",
188
+ notification,
189
+ dismiss,
190
+ this.loadingCount
191
+ );
192
+ }
193
+
194
+ // Make sure the state update is set
195
+ if (this.stateUpdate) this.stateUpdate({ notification, dismiss });
196
+ });
197
+ }
198
+
199
+ /**
200
+ * State update
201
+ */
202
+ protected stateUpdate?: React.Dispatch<INotifierAction>;
203
+
204
+ /**
205
+ * Create align container
206
+ * @param align Align
207
+ * @param children Children
208
+ * @param options Other options
209
+ */
210
+ protected abstract createContainer(
211
+ align: NotificationAlign,
212
+ children: React.ReactNode[]
213
+ ): React.ReactElement;
214
+
215
+ /**
216
+ * Create state provider
217
+ * @param className Style class name
218
+ * @returns Provider
219
+ */
220
+ createProvider(className?: string, debug?: boolean) {
221
+ // Custom creator
222
+ const creator = (
223
+ state: ReactNotifications,
224
+ update: React.Dispatch<INotifierAction>,
225
+ props: NotificationReactRenderProps
226
+ ) => {
227
+ // Hold the current state update
228
+ this.stateUpdate = update;
229
+
230
+ // Aligns collection
231
+ const aligns: React.ReactNode[] = [];
232
+ for (const align in state) {
233
+ // Notifications under the align
234
+ const notifications = state[align];
235
+
236
+ // UI collections
237
+ const ui = notifications.map((notification) =>
238
+ notification.render(
239
+ props,
240
+ className ? className + "-item" : className
241
+ )
286
242
  );
287
243
 
288
- return provider;
289
- }
244
+ // Add to the collection
245
+ aligns.push(this.createContainer(Number(align), ui));
246
+ }
247
+
248
+ // Debug
249
+ if (debug) {
250
+ console.debug("NotifierReact.createProvider", className, state, aligns);
251
+ }
252
+
253
+ // Generate the component
254
+ return React.createElement("div", { className }, aligns);
255
+ };
256
+
257
+ // Create state
258
+ const { provider } = State.create(
259
+ (
260
+ state: NotificationDictionary<
261
+ React.ReactNode,
262
+ NotificationReactCallProps
263
+ >,
264
+ _action: INotifierAction
265
+ ) => {
266
+ // Collection update is done with NotificationContainer
267
+ return { ...state };
268
+ },
269
+ this.notifications,
270
+ {} as IUpdate<
271
+ NotificationDictionary<React.ReactNode, NotificationReactCallProps>,
272
+ INotifierAction
273
+ >,
274
+ creator
275
+ );
276
+
277
+ return provider;
278
+ }
290
279
  }