@etsoo/materialui 1.0.32 → 1.0.34

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 (4) hide show
  1. package/lib/NotifierMU.d.ts +0 -1
  2. package/lib/NotifierMU.js +14 -20
  3. package/package.json +4 -4
  4. package/src/NotifierMU.tsx +78 -52
package/lib/NotifierMU.d.ts CHANGED
@@ -5,7 +5,6 @@ import { INotificationBaseReact, INotificationReact, NotificationReact, Notifier
5
5
  * MU notification
6
6
  */
7
7
  export declare class NotificationMU extends NotificationReact {
8
- private returnValue;
9
8
  private createAlert;
10
9
  private createConfirm;
11
10
  private createMessageColor;
package/lib/NotifierMU.js CHANGED
@@ -23,21 +23,11 @@ const IconDialogTitle = styled(DialogTitle) `
23
23
  * MU notification
24
24
  */
25
25
  export class NotificationMU extends NotificationReact {
26
- // On return
27
- // Dismiss first, then run callback
28
- async returnValue(value) {
29
- if (this.onReturn) {
30
- const result = await this.onReturn(value);
31
- if (result === false)
32
- return;
33
- }
34
- this.dismiss();
35
- }
36
26
  // Create alert
37
27
  createAlert(_props, className) {
38
28
  var _a;
39
29
  const labels = Labels.NotificationMU;
40
- const { inputs, fullScreen, fullWidth = true, maxWidth, okLabel = labels.alertOK, primaryButton } = (_a = this.inputProps) !== null && _a !== void 0 ? _a : {};
30
+ const { buttons, inputs, fullScreen, fullWidth = true, maxWidth, okLabel = labels.alertOK, primaryButton } = (_a = this.inputProps) !== null && _a !== void 0 ? _a : {};
41
31
  let title = this.title;
42
32
  let icon;
43
33
  if (this.type === NotificationMessageType.Success) {
@@ -62,6 +52,10 @@ export class NotificationMU extends NotificationReact {
62
52
  // Setup callback
63
53
  if (this.renderSetup)
64
54
  this.renderSetup(setupProps);
55
+ // Callback
56
+ const callback = async (_event) => {
57
+ await this.returnValue(undefined);
58
+ };
65
59
  return (React.createElement(Dialog, { key: this.id, open: this.open, PaperComponent: DraggablePaperComponent, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen },
66
60
  React.createElement(IconDialogTitle, { className: "draggable-dialog-title" },
67
61
  icon,
@@ -69,15 +63,15 @@ export class NotificationMU extends NotificationReact {
69
63
  React.createElement(DialogContent, null,
70
64
  React.createElement(DialogContentText, null, this.content),
71
65
  inputs),
72
- React.createElement(DialogActions, null,
73
- React.createElement(LoadingButton, { ...setupProps, onClick: async () => await this.returnValue(undefined), autoFocus: true, ...primaryButton }, okLabel))));
66
+ React.createElement(DialogActions, null, buttons ? (buttons(this, callback)) : (React.createElement(LoadingButton, { ...setupProps, onClick: callback, autoFocus: true, ...primaryButton }, okLabel)))));
74
67
  }
75
68
  // Create confirm
76
69
  createConfirm(_props, className) {
77
70
  var _a, _b;
78
71
  const labels = Labels.NotificationMU;
79
72
  const title = (_a = this.title) !== null && _a !== void 0 ? _a : labels.confirmTitle;
80
- const { okLabel = labels.confirmYes, cancelLabel = labels.confirmNo, cancelButton = true, inputs, fullScreen, fullWidth = true, maxWidth, primaryButton } = (_b = this.inputProps) !== null && _b !== void 0 ? _b : {};
73
+ const { buttons, okLabel = labels.confirmYes, cancelLabel = labels.confirmNo, cancelButton = true, inputs, fullScreen, fullWidth = true, maxWidth, primaryButton } = (_b = this.inputProps) !== null && _b !== void 0 ? _b : {};
74
+ const callback = async (_event, value) => await this.returnValue(value);
81
75
  return (React.createElement(Dialog, { key: this.id, open: this.open, PaperComponent: DraggablePaperComponent, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen },
82
76
  React.createElement(IconDialogTitle, { className: "draggable-dialog-title" },
83
77
  React.createElement(Help, { color: "action" }),
@@ -85,9 +79,9 @@ export class NotificationMU extends NotificationReact {
85
79
  React.createElement(DialogContent, null,
86
80
  React.createElement(DialogContentText, null, this.content),
87
81
  inputs),
88
- React.createElement(DialogActions, null,
89
- cancelButton && (React.createElement(LoadingButton, { color: "secondary", onClick: async () => await this.returnValue(false) }, cancelLabel)),
90
- React.createElement(LoadingButton, { color: "primary", onClick: async () => await this.returnValue(true), autoFocus: true, ...primaryButton }, okLabel))));
82
+ React.createElement(DialogActions, null, buttons ? (buttons(this, callback)) : (React.createElement(React.Fragment, null,
83
+ cancelButton && (React.createElement(LoadingButton, { color: "secondary", onClick: async (event) => await callback(event, false) }, cancelLabel)),
84
+ React.createElement(LoadingButton, { color: "primary", onClick: async (event) => await callback(event, true), autoFocus: true, ...primaryButton }, okLabel))))));
91
85
  }
92
86
  createMessageColor() {
93
87
  if (this.type === NotificationMessageType.Danger)
@@ -119,7 +113,7 @@ export class NotificationMU extends NotificationReact {
119
113
  var _a, _b;
120
114
  const labels = Labels.NotificationMU;
121
115
  const title = (_a = this.title) !== null && _a !== void 0 ? _a : labels.promptTitle;
122
- const { cancelLabel = labels.promptCancel, okLabel = labels.promptOK, cancelButton = true, inputs, type, fullScreen, fullWidth = true, maxWidth, primaryButton, inputProps } = (_b = this.inputProps) !== null && _b !== void 0 ? _b : {};
116
+ const { buttons, cancelLabel = labels.promptCancel, okLabel = labels.promptOK, cancelButton = true, inputs, type, fullScreen, fullWidth = true, maxWidth, primaryButton, inputProps } = (_b = this.inputProps) !== null && _b !== void 0 ? _b : {};
123
117
  const inputRef = React.createRef();
124
118
  const errorRef = React.createRef();
125
119
  const setError = (error) => {
@@ -213,13 +207,13 @@ export class NotificationMU extends NotificationReact {
213
207
  React.createElement(DialogContentText, null, this.content),
214
208
  localInputs,
215
209
  React.createElement(Typography, { variant: "caption", display: "block", ref: errorRef, color: (theme) => theme.palette.error.main })),
216
- React.createElement(DialogActions, null,
210
+ React.createElement(DialogActions, null, buttons ? (buttons(this, handleSubmit)) : (React.createElement(React.Fragment, null,
217
211
  cancelButton && (React.createElement(Button, { color: "secondary", onClick: () => {
218
212
  if (this.onReturn)
219
213
  this.onReturn(undefined);
220
214
  this.dismiss();
221
215
  } }, cancelLabel)),
222
- React.createElement(LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButton }, okLabel)))));
216
+ React.createElement(LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButton }, okLabel)))))));
223
217
  }
224
218
  // Create loading
225
219
  createLoading(_props, className) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@etsoo/materialui",
3
- "version": "1.0.32",
3
+ "version": "1.0.34",
4
4
  "description": "TypeScript Material-UI Implementation",
5
5
  "main": "lib/index.js",
6
6
  "types": "lib/index.d.ts",
@@ -51,9 +51,9 @@
51
51
  "@emotion/css": "^11.10.0",
52
52
  "@emotion/react": "^11.10.4",
53
53
  "@emotion/styled": "^11.10.4",
54
- "@etsoo/appscript": "^1.2.99",
55
- "@etsoo/notificationbase": "^1.1.10",
56
- "@etsoo/react": "^1.6.5",
54
+ "@etsoo/appscript": "^1.3.0",
55
+ "@etsoo/notificationbase": "^1.1.11",
56
+ "@etsoo/react": "^1.6.10",
57
57
  "@etsoo/shared": "^1.1.58",
58
58
  "@mui/icons-material": "^5.10.6",
59
59
  "@mui/material": "^5.10.7",
package/src/NotifierMU.tsx CHANGED
@@ -58,21 +58,12 @@ const IconDialogTitle = styled(DialogTitle)`
58
58
  * MU notification
59
59
  */
60
60
  export class NotificationMU extends NotificationReact {
61
- // On return
62
- // Dismiss first, then run callback
63
- private async returnValue(value: any) {
64
- if (this.onReturn) {
65
- const result = await this.onReturn(value);
66
- if (result === false) return;
67
- }
68
- this.dismiss();
69
- }
70
-
71
61
  // Create alert
72
62
  private createAlert(_props: NotificationRenderProps, className: string) {
73
63
  const labels = Labels.NotificationMU;
74
64
 
75
65
  const {
66
+ buttons,
76
67
  inputs,
77
68
  fullScreen,
78
69
  fullWidth = true,
@@ -104,6 +95,13 @@ export class NotificationMU extends NotificationReact {
104
95
  // Setup callback
105
96
  if (this.renderSetup) this.renderSetup(setupProps);
106
97
 
98
+ // Callback
99
+ const callback = async (
100
+ _event: React.MouseEvent<HTMLButtonElement>
101
+ ) => {
102
+ await this.returnValue(undefined);
103
+ };
104
+
107
105
  return (
108
106
  <Dialog
109
107
  key={this.id}
@@ -123,14 +121,18 @@ export class NotificationMU extends NotificationReact {
123
121
  {inputs}
124
122
  </DialogContent>
125
123
  <DialogActions>
126
- <LoadingButton
127
- {...setupProps}
128
- onClick={async () => await this.returnValue(undefined)}
129
- autoFocus
130
- {...primaryButton}
131
- >
132
- {okLabel}
133
- </LoadingButton>
124
+ {buttons ? (
125
+ buttons(this, callback)
126
+ ) : (
127
+ <LoadingButton
128
+ {...setupProps}
129
+ onClick={callback}
130
+ autoFocus
131
+ {...primaryButton}
132
+ >
133
+ {okLabel}
134
+ </LoadingButton>
135
+ )}
134
136
  </DialogActions>
135
137
  </Dialog>
136
138
  );
@@ -142,6 +144,7 @@ export class NotificationMU extends NotificationReact {
142
144
  const title = this.title ?? labels.confirmTitle;
143
145
 
144
146
  const {
147
+ buttons,
145
148
  okLabel = labels.confirmYes,
146
149
  cancelLabel = labels.confirmNo,
147
150
  cancelButton = true,
@@ -152,6 +155,11 @@ export class NotificationMU extends NotificationReact {
152
155
  primaryButton
153
156
  } = this.inputProps ?? {};
154
157
 
158
+ const callback = async (
159
+ _event: React.MouseEvent<HTMLButtonElement>,
160
+ value: boolean
161
+ ) => await this.returnValue(value);
162
+
155
163
  return (
156
164
  <Dialog
157
165
  key={this.id}
@@ -171,22 +179,32 @@ export class NotificationMU extends NotificationReact {
171
179
  {inputs}
172
180
  </DialogContent>
173
181
  <DialogActions>
174
- {cancelButton && (
175
- <LoadingButton
176
- color="secondary"
177
- onClick={async () => await this.returnValue(false)}
178
- >
179
- {cancelLabel}
180
- </LoadingButton>
182
+ {buttons ? (
183
+ buttons(this, callback)
184
+ ) : (
185
+ <React.Fragment>
186
+ {cancelButton && (
187
+ <LoadingButton
188
+ color="secondary"
189
+ onClick={async (event) =>
190
+ await callback(event, false)
191
+ }
192
+ >
193
+ {cancelLabel}
194
+ </LoadingButton>
195
+ )}
196
+ <LoadingButton
197
+ color="primary"
198
+ onClick={async (event) =>
199
+ await callback(event, true)
200
+ }
201
+ autoFocus
202
+ {...primaryButton}
203
+ >
204
+ {okLabel}
205
+ </LoadingButton>
206
+ </React.Fragment>
181
207
  )}
182
- <LoadingButton
183
- color="primary"
184
- onClick={async () => await this.returnValue(true)}
185
- autoFocus
186
- {...primaryButton}
187
- >
188
- {okLabel}
189
- </LoadingButton>
190
208
  </DialogActions>
191
209
  </Dialog>
192
210
  );
@@ -231,6 +249,7 @@ export class NotificationMU extends NotificationReact {
231
249
  const title = this.title ?? labels.promptTitle;
232
250
 
233
251
  const {
252
+ buttons,
234
253
  cancelLabel = labels.promptCancel,
235
254
  okLabel = labels.promptOK,
236
255
  cancelButton = true,
@@ -384,26 +403,33 @@ export class NotificationMU extends NotificationReact {
384
403
  />
385
404
  </DialogContent>
386
405
  <DialogActions>
387
- {cancelButton && (
388
- <Button
389
- color="secondary"
390
- onClick={() => {
391
- if (this.onReturn) this.onReturn(undefined);
392
- this.dismiss();
393
- }}
394
- >
395
- {cancelLabel}
396
- </Button>
406
+ {buttons ? (
407
+ buttons(this, handleSubmit)
408
+ ) : (
409
+ <React.Fragment>
410
+ {cancelButton && (
411
+ <Button
412
+ color="secondary"
413
+ onClick={() => {
414
+ if (this.onReturn)
415
+ this.onReturn(undefined);
416
+ this.dismiss();
417
+ }}
418
+ >
419
+ {cancelLabel}
420
+ </Button>
421
+ )}
422
+ <LoadingButton
423
+ color="primary"
424
+ autoFocus
425
+ onClick={handleSubmit}
426
+ name="okButton"
427
+ {...primaryButton}
428
+ >
429
+ {okLabel}
430
+ </LoadingButton>
431
+ </React.Fragment>
397
432
  )}
398
- <LoadingButton
399
- color="primary"
400
- autoFocus
401
- onClick={handleSubmit}
402
- name="okButton"
403
- {...primaryButton}
404
- >
405
- {okLabel}
406
- </LoadingButton>
407
433
  </DialogActions>
408
434
  </form>
409
435
  </Dialog>