@etsoo/materialui 1.4.19 → 1.4.21

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 +9 -9
  2. package/package.json +2 -2
  3. package/src/NotifierMU.tsx +14 -11
package/lib/NotifierMU.js CHANGED
@@ -11,8 +11,8 @@ import { LoadingButton } from "./LoadingButton";
11
11
  import { Labels } from "./app/Labels";
12
12
  // Custom icon dialog title bar
13
13
  const IconDialogTitle = styled(DialogTitle) `
14
- ${({ theme }) => `
15
- cursor: move;
14
+ ${({ theme, draggable }) => `
15
+ cursor: ${draggable ? "move" : "default"};
16
16
  display: flex;
17
17
  align-items: center;
18
18
  & .dialogTitle {
@@ -34,7 +34,7 @@ export class NotificationMU extends NotificationReact {
34
34
  // Create alert
35
35
  createAlert(_props, className) {
36
36
  const labels = Labels.NotificationMU;
37
- const { buttons, inputs, fullScreen, fullWidth = true, maxWidth, okLabel = labels.alertOK, primaryButton = true, primaryButtonProps, closable = false } = this.inputProps ?? {};
37
+ const { buttons, inputs, fullScreen, fullWidth = true, maxWidth, okLabel = labels.alertOK, primaryButton = true, primaryButtonProps, closable = false, draggable = fullScreen === true ? false : true } = this.inputProps ?? {};
38
38
  let title = this.title;
39
39
  let icon;
40
40
  if (this.type === NotificationMessageType.Success) {
@@ -63,7 +63,7 @@ export class NotificationMU extends NotificationReact {
63
63
  await this.returnValue(undefined);
64
64
  return true;
65
65
  };
66
- return (_jsxs(Dialog, { open: this.open, PaperComponent: DraggablePaperComponent, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: [_jsxs(IconDialogTitle, { className: "draggable-dialog-title", children: [icon, _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), inputs] }), _jsx(DialogActions, { children: buttons
66
+ return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: "dialog-title", children: [icon, _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), inputs] }), _jsx(DialogActions, { children: buttons
67
67
  ? buttons(this, callback)
68
68
  : primaryButton && (_jsx(LoadingButton, { ...setupProps, onClick: callback, autoFocus: true, ...primaryButtonProps, children: okLabel })) })] }, this.id));
69
69
  }
@@ -71,14 +71,14 @@ export class NotificationMU extends NotificationReact {
71
71
  createConfirm(_props, className) {
72
72
  const labels = Labels.NotificationMU;
73
73
  const title = this.title ?? labels.confirmTitle;
74
- const { buttons, okLabel = labels.confirmYes, cancelLabel = labels.confirmNo, cancelButton = true, inputs, fullScreen, fullWidth = true, maxWidth, primaryButton = true, primaryButtonProps, closable = false } = this.inputProps ?? {};
74
+ const { buttons, okLabel = labels.confirmYes, cancelLabel = labels.confirmNo, cancelButton = true, inputs, fullScreen, fullWidth = true, maxWidth, primaryButton = true, primaryButtonProps, closable = false, draggable = fullScreen === true ? false : true } = this.inputProps ?? {};
75
75
  // Setup callback
76
76
  const options = this.renderSetup ? this.renderSetup({}) : undefined;
77
77
  const callback = async (_event, value) => {
78
78
  await this.returnValue(value);
79
79
  return true;
80
80
  };
81
- return (_jsxs(Dialog, { open: this.open, PaperComponent: DraggablePaperComponent, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: [_jsxs(IconDialogTitle, { className: "draggable-dialog-title", children: [_jsx(Help, { color: "action" }), _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), inputs] }), _jsx(DialogActions, { children: buttons ? (buttons(this, callback)) : (_jsxs(React.Fragment, { children: [cancelButton && (_jsx(LoadingButton, { color: "secondary", onClick: async (event) => await callback(event, false), children: cancelLabel })), primaryButton && (_jsx(LoadingButton, { color: "primary", onClick: async (event) => await callback(event, true), autoFocus: true, ...primaryButtonProps, children: okLabel }))] })) })] }, this.id));
81
+ return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: "dialog-title", children: [_jsx(Help, { color: "action" }), _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), inputs] }), _jsx(DialogActions, { children: buttons ? (buttons(this, callback)) : (_jsxs(React.Fragment, { children: [cancelButton && (_jsx(LoadingButton, { color: "secondary", onClick: async (event) => await callback(event, false), children: cancelLabel })), primaryButton && (_jsx(LoadingButton, { color: "primary", onClick: async (event) => await callback(event, true), autoFocus: true, ...primaryButtonProps, children: okLabel }))] })) })] }, this.id));
82
82
  }
83
83
  createMessageColor() {
84
84
  if (this.type === NotificationMessageType.Danger)
@@ -106,7 +106,7 @@ export class NotificationMU extends NotificationReact {
106
106
  createPrompt(_props, className) {
107
107
  const labels = Labels.NotificationMU;
108
108
  const title = this.title ?? labels.promptTitle;
109
- const { buttons, cancelLabel = labels.promptCancel, okLabel = labels.promptOK, cancelButton = true, inputs, type, fullScreen, fullWidth = true, maxWidth, primaryButton = true, primaryButtonProps, inputProps, closable = false } = this.inputProps ?? {};
109
+ const { buttons, cancelLabel = labels.promptCancel, okLabel = labels.promptOK, cancelButton = true, inputs, type, fullScreen, fullWidth = true, maxWidth, primaryButton = true, primaryButtonProps, inputProps, closable = false, draggable = fullScreen === true ? false : true } = this.inputProps ?? {};
110
110
  const inputRef = React.createRef();
111
111
  const errorRef = React.createRef();
112
112
  const setError = (error) => {
@@ -173,11 +173,11 @@ export class NotificationMU extends NotificationReact {
173
173
  }
174
174
  // Setup callback
175
175
  const options = this.renderSetup ? this.renderSetup({}) : undefined;
176
- return (_jsx(Dialog, { open: this.open, PaperComponent: DraggablePaperComponent, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: _jsxs("form", { onSubmit: (event) => {
176
+ return (_jsx(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: _jsxs("form", { onSubmit: (event) => {
177
177
  event.preventDefault();
178
178
  event.currentTarget.elements.namedItem("okButton")?.click();
179
179
  return false;
180
- }, children: [_jsxs(IconDialogTitle, { className: "draggable-dialog-title", children: [_jsx(Info, { color: "primary" }), _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), localInputs, _jsx(Typography, { variant: "caption", display: "block", ref: errorRef, color: "error" })] }), _jsx(DialogActions, { children: buttons ? (buttons(this, handleSubmit)) : (_jsxs(React.Fragment, { children: [cancelButton && (_jsx(Button, { color: "secondary", onClick: () => {
180
+ }, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: "dialog-title", children: [_jsx(Info, { color: "primary" }), _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), localInputs, _jsx(Typography, { variant: "caption", display: "block", ref: errorRef, color: "error" })] }), _jsx(DialogActions, { children: buttons ? (buttons(this, handleSubmit)) : (_jsxs(React.Fragment, { children: [cancelButton && (_jsx(Button, { color: "secondary", onClick: () => {
181
181
  if (this.onReturn)
182
182
  this.onReturn(undefined);
183
183
  this.dismiss();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@etsoo/materialui",
3
- "version": "1.4.19",
3
+ "version": "1.4.21",
4
4
  "description": "TypeScript Material-UI Implementation",
5
5
  "main": "lib/index.js",
6
6
  "types": "lib/index.d.ts",
@@ -52,7 +52,7 @@
52
52
  "@emotion/styled": "^11.13.0",
53
53
  "@etsoo/appscript": "^1.5.61",
54
54
  "@etsoo/notificationbase": "^1.1.52",
55
- "@etsoo/react": "^1.7.91",
55
+ "@etsoo/react": "^1.7.92",
56
56
  "@etsoo/shared": "^1.2.51",
57
57
  "@mui/icons-material": "^6.1.4",
58
58
  "@mui/material": "^6.1.4",
package/src/NotifierMU.tsx CHANGED
@@ -45,8 +45,8 @@ import { Labels } from "./app/Labels";
45
45
 
46
46
  // Custom icon dialog title bar
47
47
  const IconDialogTitle = styled(DialogTitle)`
48
- ${({ theme }) => `
49
- cursor: move;
48
+ ${({ theme, draggable }) => `
49
+ cursor: ${draggable ? "move" : "default"};
50
50
  display: flex;
51
51
  align-items: center;
52
52
  & .dialogTitle {
@@ -79,7 +79,8 @@ export class NotificationMU extends NotificationReact {
79
79
  okLabel = labels.alertOK,
80
80
  primaryButton = true,
81
81
  primaryButtonProps,
82
- closable = false
82
+ closable = false,
83
+ draggable = fullScreen === true ? false : true
83
84
  } = this.inputProps ?? {};
84
85
 
85
86
  let title = this.title;
@@ -115,14 +116,14 @@ export class NotificationMU extends NotificationReact {
115
116
  <Dialog
116
117
  key={this.id}
117
118
  open={this.open}
118
- PaperComponent={DraggablePaperComponent}
119
+ PaperComponent={draggable ? DraggablePaperComponent : undefined}
119
120
  className={className}
120
121
  fullWidth={fullWidth}
121
122
  maxWidth={maxWidth}
122
123
  fullScreen={fullScreen}
123
124
  {...options}
124
125
  >
125
- <IconDialogTitle className="draggable-dialog-title">
126
+ <IconDialogTitle draggable={draggable} className="dialog-title">
126
127
  {icon}
127
128
  <span className="dialogTitle">{title}</span>
128
129
  {closable && (
@@ -177,7 +178,8 @@ export class NotificationMU extends NotificationReact {
177
178
  maxWidth,
178
179
  primaryButton = true,
179
180
  primaryButtonProps,
180
- closable = false
181
+ closable = false,
182
+ draggable = fullScreen === true ? false : true
181
183
  } = this.inputProps ?? {};
182
184
 
183
185
  // Setup callback
@@ -195,14 +197,14 @@ export class NotificationMU extends NotificationReact {
195
197
  <Dialog
196
198
  key={this.id}
197
199
  open={this.open}
198
- PaperComponent={DraggablePaperComponent}
200
+ PaperComponent={draggable ? DraggablePaperComponent : undefined}
199
201
  className={className}
200
202
  fullWidth={fullWidth}
201
203
  maxWidth={maxWidth}
202
204
  fullScreen={fullScreen}
203
205
  {...options}
204
206
  >
205
- <IconDialogTitle className="draggable-dialog-title">
207
+ <IconDialogTitle draggable={draggable} className="dialog-title">
206
208
  <Help color="action" />
207
209
  <span className="dialogTitle">{title}</span>
208
210
  {closable && (
@@ -317,7 +319,8 @@ export class NotificationMU extends NotificationReact {
317
319
  primaryButton = true,
318
320
  primaryButtonProps,
319
321
  inputProps,
320
- closable = false
322
+ closable = false,
323
+ draggable = fullScreen === true ? false : true
321
324
  } = this.inputProps ?? {};
322
325
 
323
326
  const inputRef = React.createRef<HTMLInputElement>();
@@ -417,7 +420,7 @@ export class NotificationMU extends NotificationReact {
417
420
  <Dialog
418
421
  key={this.id}
419
422
  open={this.open}
420
- PaperComponent={DraggablePaperComponent}
423
+ PaperComponent={draggable ? DraggablePaperComponent : undefined}
421
424
  className={className}
422
425
  fullWidth={fullWidth}
423
426
  maxWidth={maxWidth}
@@ -435,7 +438,7 @@ export class NotificationMU extends NotificationReact {
435
438
  return false;
436
439
  }}
437
440
  >
438
- <IconDialogTitle className="draggable-dialog-title">
441
+ <IconDialogTitle draggable={draggable} className="dialog-title">
439
442
  <Info color="primary" />
440
443
  <span className="dialogTitle">{title}</span>
441
444
  {closable && (