@etsoo/materialui 1.0.32 → 1.0.33

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 (3) hide show
  1. package/lib/NotifierMU.js +14 -10
  2. package/package.json +2 -2
  3. package/src/NotifierMU.tsx +78 -42
package/lib/NotifierMU.js CHANGED
@@ -37,7 +37,7 @@ export class NotificationMU extends NotificationReact {
37
37
  createAlert(_props, className) {
38
38
  var _a;
39
39
  const labels = Labels.NotificationMU;
40
- const { inputs, fullScreen, fullWidth = true, maxWidth, okLabel = labels.alertOK, primaryButton } = (_a = this.inputProps) !== null && _a !== void 0 ? _a : {};
40
+ const { buttons, inputs, fullScreen, fullWidth = true, maxWidth, okLabel = labels.alertOK, primaryButton } = (_a = this.inputProps) !== null && _a !== void 0 ? _a : {};
41
41
  let title = this.title;
42
42
  let icon;
43
43
  if (this.type === NotificationMessageType.Success) {
@@ -62,6 +62,10 @@ export class NotificationMU extends NotificationReact {
62
62
  // Setup callback
63
63
  if (this.renderSetup)
64
64
  this.renderSetup(setupProps);
65
+ // Callback
66
+ const callback = async (_event) => {
67
+ await this.returnValue(undefined);
68
+ };
65
69
  return (React.createElement(Dialog, { key: this.id, open: this.open, PaperComponent: DraggablePaperComponent, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen },
66
70
  React.createElement(IconDialogTitle, { className: "draggable-dialog-title" },
67
71
  icon,
@@ -69,15 +73,15 @@ export class NotificationMU extends NotificationReact {
69
73
  React.createElement(DialogContent, null,
70
74
  React.createElement(DialogContentText, null, this.content),
71
75
  inputs),
72
- React.createElement(DialogActions, null,
73
- React.createElement(LoadingButton, { ...setupProps, onClick: async () => await this.returnValue(undefined), autoFocus: true, ...primaryButton }, okLabel))));
76
+ React.createElement(DialogActions, null, buttons ? (buttons(callback)) : (React.createElement(LoadingButton, { ...setupProps, onClick: callback, autoFocus: true, ...primaryButton }, okLabel)))));
74
77
  }
75
78
  // Create confirm
76
79
  createConfirm(_props, className) {
77
80
  var _a, _b;
78
81
  const labels = Labels.NotificationMU;
79
82
  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 : {};
83
+ const { buttons, okLabel = labels.confirmYes, cancelLabel = labels.confirmNo, cancelButton = true, inputs, fullScreen, fullWidth = true, maxWidth, primaryButton } = (_b = this.inputProps) !== null && _b !== void 0 ? _b : {};
84
+ const callback = async (_event, value) => await this.returnValue(value);
81
85
  return (React.createElement(Dialog, { key: this.id, open: this.open, PaperComponent: DraggablePaperComponent, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen },
82
86
  React.createElement(IconDialogTitle, { className: "draggable-dialog-title" },
83
87
  React.createElement(Help, { color: "action" }),
@@ -85,9 +89,9 @@ export class NotificationMU extends NotificationReact {
85
89
  React.createElement(DialogContent, null,
86
90
  React.createElement(DialogContentText, null, this.content),
87
91
  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))));
92
+ React.createElement(DialogActions, null, buttons ? (buttons(callback)) : (React.createElement(React.Fragment, null,
93
+ cancelButton && (React.createElement(LoadingButton, { color: "secondary", onClick: async (event) => await callback(event, false) }, cancelLabel)),
94
+ React.createElement(LoadingButton, { color: "primary", onClick: async (event) => await callback(event, true), autoFocus: true, ...primaryButton }, okLabel))))));
91
95
  }
92
96
  createMessageColor() {
93
97
  if (this.type === NotificationMessageType.Danger)
@@ -119,7 +123,7 @@ export class NotificationMU extends NotificationReact {
119
123
  var _a, _b;
120
124
  const labels = Labels.NotificationMU;
121
125
  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 : {};
126
+ 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
127
  const inputRef = React.createRef();
124
128
  const errorRef = React.createRef();
125
129
  const setError = (error) => {
@@ -213,13 +217,13 @@ export class NotificationMU extends NotificationReact {
213
217
  React.createElement(DialogContentText, null, this.content),
214
218
  localInputs,
215
219
  React.createElement(Typography, { variant: "caption", display: "block", ref: errorRef, color: (theme) => theme.palette.error.main })),
216
- React.createElement(DialogActions, null,
220
+ React.createElement(DialogActions, null, buttons ? (buttons(handleSubmit)) : (React.createElement(React.Fragment, null,
217
221
  cancelButton && (React.createElement(Button, { color: "secondary", onClick: () => {
218
222
  if (this.onReturn)
219
223
  this.onReturn(undefined);
220
224
  this.dismiss();
221
225
  } }, cancelLabel)),
222
- React.createElement(LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButton }, okLabel)))));
226
+ React.createElement(LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButton }, okLabel)))))));
223
227
  }
224
228
  // Create loading
225
229
  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.33",
4
4
  "description": "TypeScript Material-UI Implementation",
5
5
  "main": "lib/index.js",
6
6
  "types": "lib/index.d.ts",
@@ -53,7 +53,7 @@
53
53
  "@emotion/styled": "^11.10.4",
54
54
  "@etsoo/appscript": "^1.2.99",
55
55
  "@etsoo/notificationbase": "^1.1.10",
56
- "@etsoo/react": "^1.6.5",
56
+ "@etsoo/react": "^1.6.9",
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
@@ -73,6 +73,7 @@ export class NotificationMU extends NotificationReact {
73
73
  const labels = Labels.NotificationMU;
74
74
 
75
75
  const {
76
+ buttons,
76
77
  inputs,
77
78
  fullScreen,
78
79
  fullWidth = true,
@@ -104,6 +105,13 @@ export class NotificationMU extends NotificationReact {
104
105
  // Setup callback
105
106
  if (this.renderSetup) this.renderSetup(setupProps);
106
107
 
108
+ // Callback
109
+ const callback = async (
110
+ _event: React.MouseEvent<HTMLButtonElement>
111
+ ) => {
112
+ await this.returnValue(undefined);
113
+ };
114
+
107
115
  return (
108
116
  <Dialog
109
117
  key={this.id}
@@ -123,14 +131,18 @@ export class NotificationMU extends NotificationReact {
123
131
  {inputs}
124
132
  </DialogContent>
125
133
  <DialogActions>
126
- <LoadingButton
127
- {...setupProps}
128
- onClick={async () => await this.returnValue(undefined)}
129
- autoFocus
130
- {...primaryButton}
131
- >
132
- {okLabel}
133
- </LoadingButton>
134
+ {buttons ? (
135
+ buttons(callback)
136
+ ) : (
137
+ <LoadingButton
138
+ {...setupProps}
139
+ onClick={callback}
140
+ autoFocus
141
+ {...primaryButton}
142
+ >
143
+ {okLabel}
144
+ </LoadingButton>
145
+ )}
134
146
  </DialogActions>
135
147
  </Dialog>
136
148
  );
@@ -142,6 +154,7 @@ export class NotificationMU extends NotificationReact {
142
154
  const title = this.title ?? labels.confirmTitle;
143
155
 
144
156
  const {
157
+ buttons,
145
158
  okLabel = labels.confirmYes,
146
159
  cancelLabel = labels.confirmNo,
147
160
  cancelButton = true,
@@ -152,6 +165,11 @@ export class NotificationMU extends NotificationReact {
152
165
  primaryButton
153
166
  } = this.inputProps ?? {};
154
167
 
168
+ const callback = async (
169
+ _event: React.MouseEvent<HTMLButtonElement>,
170
+ value: boolean
171
+ ) => await this.returnValue(value);
172
+
155
173
  return (
156
174
  <Dialog
157
175
  key={this.id}
@@ -171,22 +189,32 @@ export class NotificationMU extends NotificationReact {
171
189
  {inputs}
172
190
  </DialogContent>
173
191
  <DialogActions>
174
- {cancelButton && (
175
- <LoadingButton
176
- color="secondary"
177
- onClick={async () => await this.returnValue(false)}
178
- >
179
- {cancelLabel}
180
- </LoadingButton>
192
+ {buttons ? (
193
+ buttons(callback)
194
+ ) : (
195
+ <React.Fragment>
196
+ {cancelButton && (
197
+ <LoadingButton
198
+ color="secondary"
199
+ onClick={async (event) =>
200
+ await callback(event, false)
201
+ }
202
+ >
203
+ {cancelLabel}
204
+ </LoadingButton>
205
+ )}
206
+ <LoadingButton
207
+ color="primary"
208
+ onClick={async (event) =>
209
+ await callback(event, true)
210
+ }
211
+ autoFocus
212
+ {...primaryButton}
213
+ >
214
+ {okLabel}
215
+ </LoadingButton>
216
+ </React.Fragment>
181
217
  )}
182
- <LoadingButton
183
- color="primary"
184
- onClick={async () => await this.returnValue(true)}
185
- autoFocus
186
- {...primaryButton}
187
- >
188
- {okLabel}
189
- </LoadingButton>
190
218
  </DialogActions>
191
219
  </Dialog>
192
220
  );
@@ -231,6 +259,7 @@ export class NotificationMU extends NotificationReact {
231
259
  const title = this.title ?? labels.promptTitle;
232
260
 
233
261
  const {
262
+ buttons,
234
263
  cancelLabel = labels.promptCancel,
235
264
  okLabel = labels.promptOK,
236
265
  cancelButton = true,
@@ -384,26 +413,33 @@ export class NotificationMU extends NotificationReact {
384
413
  />
385
414
  </DialogContent>
386
415
  <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>
416
+ {buttons ? (
417
+ buttons(handleSubmit)
418
+ ) : (
419
+ <React.Fragment>
420
+ {cancelButton && (
421
+ <Button
422
+ color="secondary"
423
+ onClick={() => {
424
+ if (this.onReturn)
425
+ this.onReturn(undefined);
426
+ this.dismiss();
427
+ }}
428
+ >
429
+ {cancelLabel}
430
+ </Button>
431
+ )}
432
+ <LoadingButton
433
+ color="primary"
434
+ autoFocus
435
+ onClick={handleSubmit}
436
+ name="okButton"
437
+ {...primaryButton}
438
+ >
439
+ {okLabel}
440
+ </LoadingButton>
441
+ </React.Fragment>
397
442
  )}
398
- <LoadingButton
399
- color="primary"
400
- autoFocus
401
- onClick={handleSubmit}
402
- name="okButton"
403
- {...primaryButton}
404
- >
405
- {okLabel}
406
- </LoadingButton>
407
443
  </DialogActions>
408
444
  </form>
409
445
  </Dialog>