@etsoo/materialui 1.4.18 → 1.4.20

package/lib/NotifierMU.js

@@ -34,7 +34,7 @@ export class NotificationMU extends NotificationReact {
     // Create alert
     createAlert(_props, className) {
         const labels = Labels.NotificationMU;
-        const { buttons, inputs, fullScreen, fullWidth = true, maxWidth, okLabel = labels.alertOK, primaryButton, closable = false } = this.inputProps ?? {};
+        const { buttons, inputs, fullScreen, fullWidth = true, maxWidth, okLabel = labels.alertOK, primaryButton = true, primaryButtonProps, closable = false, draggable = fullScreen === true ? false : true } = this.inputProps ?? {};
         let title = this.title;
         let icon;
         if (this.type === NotificationMessageType.Success) {
@@ -63,20 +63,22 @@ export class NotificationMU extends NotificationReact {
             await this.returnValue(undefined);
             return true;
         };
-        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 ? (buttons(this, callback)) : (_jsx(LoadingButton, { ...setupProps, onClick: callback, autoFocus: true, ...primaryButton, children: okLabel })) })] }, this.id));
+        return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, 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
+                        ? buttons(this, callback)
+                        : primaryButton && (_jsx(LoadingButton, { ...setupProps, onClick: callback, autoFocus: true, ...primaryButtonProps, children: okLabel })) })] }, this.id));
     }
     // Create confirm
     createConfirm(_props, className) {
         const labels = Labels.NotificationMU;
         const title = this.title ?? labels.confirmTitle;
-        const { buttons, okLabel = labels.confirmYes, cancelLabel = labels.confirmNo, cancelButton = true, inputs, fullScreen, fullWidth = true, maxWidth, primaryButton, closable = false } = this.inputProps ?? {};
+        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 ?? {};
         // Setup callback
         const options = this.renderSetup ? this.renderSetup({}) : undefined;
         const callback = async (_event, value) => {
             await this.returnValue(value);
             return true;
         };
-        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 })), _jsx(LoadingButton, { color: "primary", onClick: async (event) => await callback(event, true), autoFocus: true, ...primaryButton, children: okLabel })] })) })] }, this.id));
+        return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, 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));
     }
     createMessageColor() {
         if (this.type === NotificationMessageType.Danger)
@@ -104,7 +106,7 @@ export class NotificationMU extends NotificationReact {
     createPrompt(_props, className) {
         const labels = Labels.NotificationMU;
         const title = this.title ?? labels.promptTitle;
-        const { buttons, cancelLabel = labels.promptCancel, okLabel = labels.promptOK, cancelButton = true, inputs, type, fullScreen, fullWidth = true, maxWidth, primaryButton, inputProps, closable = false } = this.inputProps ?? {};
+        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 ?? {};
         const inputRef = React.createRef();
         const errorRef = React.createRef();
         const setError = (error) => {
@@ -171,7 +173,7 @@ export class NotificationMU extends NotificationReact {
         }
         // Setup callback
         const options = this.renderSetup ? this.renderSetup({}) : undefined;
-        return (_jsx(Dialog, { open: this.open, PaperComponent: DraggablePaperComponent, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: _jsxs("form", { onSubmit: (event) => {
+        return (_jsx(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: _jsxs("form", { onSubmit: (event) => {
                     event.preventDefault();
                     event.currentTarget.elements.namedItem("okButton")?.click();
                     return false;
@@ -179,7 +181,7 @@ export class NotificationMU extends NotificationReact {
                                         if (this.onReturn)
                                             this.onReturn(undefined);
                                         this.dismiss();
-                                    }, children: cancelLabel })), _jsx(LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButton, children: okLabel })] })) })] }) }, this.id));
+                                    }, children: cancelLabel })), primaryButton && (_jsx(LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButtonProps, children: okLabel }))] })) })] }) }, this.id));
     }
     createPopup(_props, className) {
         // Destruct

package/lib/app/ReactApp.js

@@ -193,7 +193,7 @@ export class ReactApp extends CoreApp {
                 await this.tryLogin();
         }, undefined, {
             okLabel: labels.cancel,
-            primaryButton: { fullWidth: true, autoFocus: false },
+            primaryButtonProps: { fullWidth: true, autoFocus: false },
             inputs: progress
         });
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.4.18",
+  "version": "1.4.20",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -52,7 +52,7 @@
     "@emotion/styled": "^11.13.0",
     "@etsoo/appscript": "^1.5.61",
     "@etsoo/notificationbase": "^1.1.52",
-    "@etsoo/react": "^1.7.90",
+    "@etsoo/react": "^1.7.92",
     "@etsoo/shared": "^1.2.51",
     "@mui/icons-material": "^6.1.4",
     "@mui/material": "^6.1.4",

package/src/NotifierMU.tsx

@@ -77,8 +77,10 @@ export class NotificationMU extends NotificationReact {
       fullWidth = true,
       maxWidth,
       okLabel = labels.alertOK,
-      primaryButton,
-      closable = false
+      primaryButton = true,
+      primaryButtonProps,
+      closable = false,
+      draggable = fullScreen === true ? false : true
     } = this.inputProps ?? {};
 
     let title = this.title;
@@ -114,7 +116,7 @@ export class NotificationMU extends NotificationReact {
       <Dialog
         key={this.id}
         open={this.open}
-        PaperComponent={DraggablePaperComponent}
+        PaperComponent={draggable ? DraggablePaperComponent : undefined}
         className={className}
         fullWidth={fullWidth}
         maxWidth={maxWidth}
@@ -143,18 +145,18 @@ export class NotificationMU extends NotificationReact {
           {inputs}
         </DialogContent>
         <DialogActions>
-          {buttons ? (
-            buttons(this, callback)
-          ) : (
-            <LoadingButton
-              {...setupProps}
-              onClick={callback}
-              autoFocus
-              {...primaryButton}
-            >
-              {okLabel}
-            </LoadingButton>
-          )}
+          {buttons
+            ? buttons(this, callback)
+            : primaryButton && (
+                <LoadingButton
+                  {...setupProps}
+                  onClick={callback}
+                  autoFocus
+                  {...primaryButtonProps}
+                >
+                  {okLabel}
+                </LoadingButton>
+              )}
         </DialogActions>
       </Dialog>
     );
@@ -174,8 +176,10 @@ export class NotificationMU extends NotificationReact {
       fullScreen,
       fullWidth = true,
       maxWidth,
-      primaryButton,
-      closable = false
+      primaryButton = true,
+      primaryButtonProps,
+      closable = false,
+      draggable = fullScreen === true ? false : true
     } = this.inputProps ?? {};
 
     // Setup callback
@@ -193,7 +197,7 @@ export class NotificationMU extends NotificationReact {
       <Dialog
         key={this.id}
         open={this.open}
-        PaperComponent={DraggablePaperComponent}
+        PaperComponent={draggable ? DraggablePaperComponent : undefined}
         className={className}
         fullWidth={fullWidth}
         maxWidth={maxWidth}
@@ -234,14 +238,16 @@ export class NotificationMU extends NotificationReact {
                   {cancelLabel}
                 </LoadingButton>
               )}
-              <LoadingButton
-                color="primary"
-                onClick={async (event) => await callback(event, true)}
-                autoFocus
-                {...primaryButton}
-              >
-                {okLabel}
-              </LoadingButton>
+              {primaryButton && (
+                <LoadingButton
+                  color="primary"
+                  onClick={async (event) => await callback(event, true)}
+                  autoFocus
+                  {...primaryButtonProps}
+                >
+                  {okLabel}
+                </LoadingButton>
+              )}
             </React.Fragment>
           )}
         </DialogActions>
@@ -310,9 +316,11 @@ export class NotificationMU extends NotificationReact {
       fullScreen,
       fullWidth = true,
       maxWidth,
-      primaryButton,
+      primaryButton = true,
+      primaryButtonProps,
       inputProps,
-      closable = false
+      closable = false,
+      draggable = fullScreen === true ? false : true
     } = this.inputProps ?? {};
 
     const inputRef = React.createRef<HTMLInputElement>();
@@ -412,7 +420,7 @@ export class NotificationMU extends NotificationReact {
       <Dialog
         key={this.id}
         open={this.open}
-        PaperComponent={DraggablePaperComponent}
+        PaperComponent={draggable ? DraggablePaperComponent : undefined}
         className={className}
         fullWidth={fullWidth}
         maxWidth={maxWidth}
@@ -473,15 +481,17 @@ export class NotificationMU extends NotificationReact {
                     {cancelLabel}
                   </Button>
                 )}
-                <LoadingButton
-                  color="primary"
-                  autoFocus
-                  onClick={handleSubmit}
-                  name="okButton"
-                  {...primaryButton}
-                >
-                  {okLabel}
-                </LoadingButton>
+                {primaryButton && (
+                  <LoadingButton
+                    color="primary"
+                    autoFocus
+                    onClick={handleSubmit}
+                    name="okButton"
+                    {...primaryButtonProps}
+                  >
+                    {okLabel}
+                  </LoadingButton>
+                )}
               </React.Fragment>
             )}
           </DialogActions>

package/src/app/ReactApp.ts

@@ -413,7 +413,7 @@ export class ReactApp<
       undefined,
       {
         okLabel: labels.cancel,
-        primaryButton: { fullWidth: true, autoFocus: false },
+        primaryButtonProps: { fullWidth: true, autoFocus: false },
         inputs: progress
       }
     );