@etsoo/materialui 1.6.36 → 1.6.37

package/lib/cjs/NotifierMU.js

@@ -260,15 +260,20 @@ class NotificationMU extends react_2.NotificationReact {
         }
         // Setup callback
         const options = this.renderSetup ? this.renderSetup({}) : undefined;
-        return ((0, jsx_runtime_1.jsx)("form", { onSubmit: (event) => {
-                event.preventDefault();
-                event.currentTarget.elements.namedItem("okButton")?.click();
-                return false;
-            }, children: (0, jsx_runtime_1.jsxs)(Dialog_1.default, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent_1.DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", ...options, children: [(0, jsx_runtime_1.jsxs)(IconDialogTitle, { draggable: draggable, className: draggable ? "dialog-title draggable-dialog-title" : "dialog-title", children: [(0, jsx_runtime_1.jsx)(Info_1.default, { color: "primary" }), (0, jsx_runtime_1.jsx)("span", { className: "dialogTitle", children: title }), closable && ((0, jsx_runtime_1.jsx)(IconButton_1.default, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) }))] }), (0, jsx_runtime_1.jsxs)(DialogContent_1.default, { dividers: true, children: [typeof this.content === "string" ? ((0, jsx_runtime_1.jsx)(DialogContentText_1.default, { children: this.content })) : (this.content), localInputs, (0, jsx_runtime_1.jsx)(Typography_1.default, { variant: "caption", display: "block", ref: errorRef, color: "error" })] }), (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: buttons ? (buttons(this, handleSubmit)) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [cancelButton && ((0, jsx_runtime_1.jsx)(Button_1.default, { color: "secondary", onClick: () => {
-                                        if (this.onReturn)
-                                            this.onReturn(undefined);
-                                        this.dismiss();
-                                    }, children: cancelLabel })), primaryButton && ((0, jsx_runtime_1.jsx)(LoadingButton_1.LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButtonProps, children: okLabel }))] })) })] }) }, this.id));
+        return ((0, jsx_runtime_1.jsxs)(Dialog_1.default, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent_1.DraggablePaperComponent : undefined, slotProps: {
+                paper: {
+                    component: "form",
+                    onSubmit: (event) => {
+                        event.preventDefault();
+                        event.currentTarget.elements.namedItem("okButton")?.click();
+                        return false;
+                    }
+                }
+            }, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", ...options, children: [(0, jsx_runtime_1.jsxs)(IconDialogTitle, { draggable: draggable, className: draggable ? "dialog-title draggable-dialog-title" : "dialog-title", children: [(0, jsx_runtime_1.jsx)(Info_1.default, { color: "primary" }), (0, jsx_runtime_1.jsx)("span", { className: "dialogTitle", children: title }), closable && ((0, jsx_runtime_1.jsx)(IconButton_1.default, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) }))] }), (0, jsx_runtime_1.jsxs)(DialogContent_1.default, { dividers: true, children: [typeof this.content === "string" ? ((0, jsx_runtime_1.jsx)(DialogContentText_1.default, { children: this.content })) : (this.content), localInputs, (0, jsx_runtime_1.jsx)(Typography_1.default, { variant: "caption", display: "block", ref: errorRef, color: "error" })] }), (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: buttons ? (buttons(this, handleSubmit)) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [cancelButton && ((0, jsx_runtime_1.jsx)(Button_1.default, { color: "secondary", onClick: () => {
+                                    if (this.onReturn)
+                                        this.onReturn(undefined);
+                                    this.dismiss();
+                                }, children: cancelLabel })), primaryButton && ((0, jsx_runtime_1.jsx)(LoadingButton_1.LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButtonProps, children: okLabel }))] })) })] }, this.id));
     }
     createPopup(_props, className) {
         // Destruct

package/lib/mjs/NotifierMU.js

@@ -254,15 +254,20 @@ export class NotificationMU extends NotificationReact {
         }
         // Setup callback
         const options = this.renderSetup ? this.renderSetup({}) : undefined;
-        return (_jsx("form", { onSubmit: (event) => {
-                event.preventDefault();
-                event.currentTarget.elements.namedItem("okButton")?.click();
-                return false;
-            }, children: _jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: draggable ? "dialog-title draggable-dialog-title" : "dialog-title", children: [_jsx(InfoIcon, { 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, { dividers: true, 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: () => {
-                                        if (this.onReturn)
-                                            this.onReturn(undefined);
-                                        this.dismiss();
-                                    }, children: cancelLabel })), primaryButton && (_jsx(LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButtonProps, children: okLabel }))] })) })] }) }, this.id));
+        return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, slotProps: {
+                paper: {
+                    component: "form",
+                    onSubmit: (event) => {
+                        event.preventDefault();
+                        event.currentTarget.elements.namedItem("okButton")?.click();
+                        return false;
+                    }
+                }
+            }, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: draggable ? "dialog-title draggable-dialog-title" : "dialog-title", children: [_jsx(InfoIcon, { 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, { dividers: true, 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: () => {
+                                    if (this.onReturn)
+                                        this.onReturn(undefined);
+                                    this.dismiss();
+                                }, children: cancelLabel })), primaryButton && (_jsx(LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButtonProps, children: okLabel }))] })) })] }, this.id));
     }
     createPopup(_props, className) {
         // Destruct

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.6.36",
+  "version": "1.6.37",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/cjs/index.js",
   "module": "lib/mjs/index.js",

package/src/NotifierMU.tsx

@@ -606,92 +606,94 @@ export class NotificationMU extends NotificationReact {
     const options = this.renderSetup ? this.renderSetup({}) : undefined;
 
     return (
-      <form
+      <Dialog
         key={this.id}
-        onSubmit={(event) => {
-          event.preventDefault();
-          (
-            event.currentTarget.elements.namedItem(
-              "okButton"
-            ) as HTMLButtonElement
-          )?.click();
-          return false;
+        open={this.open}
+        PaperComponent={draggable ? DraggablePaperComponent : undefined}
+        slotProps={{
+          paper: {
+            component: "form",
+            onSubmit: (event: React.SubmitEvent<HTMLFormElement>) => {
+              event.preventDefault();
+              (
+                event.currentTarget.elements.namedItem(
+                  "okButton"
+                ) as HTMLButtonElement
+              )?.click();
+              return false;
+            }
+          }
         }}
+        className={className}
+        fullWidth={fullWidth}
+        maxWidth={maxWidth}
+        fullScreen={fullScreen}
+        scroll="paper"
+        {...options}
       >
-        <Dialog
-          open={this.open}
-          PaperComponent={draggable ? DraggablePaperComponent : undefined}
-          className={className}
-          fullWidth={fullWidth}
-          maxWidth={maxWidth}
-          fullScreen={fullScreen}
-          scroll="paper"
-          {...options}
+        <IconDialogTitle
+          draggable={draggable}
+          className={
+            draggable ? "dialog-title draggable-dialog-title" : "dialog-title"
+          }
         >
-          <IconDialogTitle
-            draggable={draggable}
-            className={
-              draggable ? "dialog-title draggable-dialog-title" : "dialog-title"
-            }
-          >
-            <InfoIcon color="primary" />
-            <span className="dialogTitle">{title}</span>
-            {closable && (
-              <IconButton
-                className="MuiDialogContent-root-close-button"
-                size="small"
-                onClick={() => this.returnValue("CLOSE")}
-              >
-                <CloseIcon />
-              </IconButton>
-            )}
-          </IconDialogTitle>
-          <DialogContent dividers>
-            {typeof this.content === "string" ? (
-              <DialogContentText>{this.content}</DialogContentText>
-            ) : (
-              this.content
-            )}
-            {localInputs}
-            <Typography
-              variant="caption"
-              display="block"
-              ref={errorRef}
-              color="error"
-            />
-          </DialogContent>
-          <DialogActions>
-            {buttons ? (
-              buttons(this, handleSubmit)
-            ) : (
-              <React.Fragment>
-                {cancelButton && (
-                  <Button
-                    color="secondary"
-                    onClick={() => {
-                      if (this.onReturn) this.onReturn(undefined);
-                      this.dismiss();
-                    }}
-                  >
-                    {cancelLabel}
-                  </Button>
-                )}
-                {primaryButton && (
-                  <LoadingButton
-                    color="primary"
-                    autoFocus
-                    onClick={handleSubmit}
-                    name="okButton"
-                    {...primaryButtonProps}
-                  >
-                    {okLabel}
-                  </LoadingButton>
-                )}
-              </React.Fragment>
-            )}
-          </DialogActions>
-        </Dialog>
-      </form>
+          <InfoIcon color="primary" />
+          <span className="dialogTitle">{title}</span>
+          {closable && (
+            <IconButton
+              className="MuiDialogContent-root-close-button"
+              size="small"
+              onClick={() => this.returnValue("CLOSE")}
+            >
+              <CloseIcon />
+            </IconButton>
+          )}
+        </IconDialogTitle>
+        <DialogContent dividers>
+          {typeof this.content === "string" ? (
+            <DialogContentText>{this.content}</DialogContentText>
+          ) : (
+            this.content
+          )}
+          {localInputs}
+          <Typography
+            variant="caption"
+            display="block"
+            ref={errorRef}
+            color="error"
+          />
+        </DialogContent>
+        <DialogActions>
+          {buttons ? (
+            buttons(this, handleSubmit)
+          ) : (
+            <React.Fragment>
+              {cancelButton && (
+                <Button
+                  color="secondary"
+                  onClick={() => {
+                    if (this.onReturn) this.onReturn(undefined);
+                    this.dismiss();
+                  }}
+                >
+                  {cancelLabel}
+                </Button>
+              )}
+              {primaryButton && (
+                <LoadingButton
+                  color="primary"
+                  autoFocus
+                  onClick={handleSubmit}
+                  name="okButton"
+                  {...primaryButtonProps}
+                >
+                  {okLabel}
+                </LoadingButton>
+              )}
+            </React.Fragment>
+          )}
+        </DialogActions>
+      </Dialog>
     );
   }