@mamrp/components 1.7.17 → 1.7.18

package/dist/index.mjs

@@ -5260,9 +5260,15 @@ function CustomDialog({
   onClose,
   maxWidth = "sm",
   fullWidth = true,
+  fullScreen = false,
   children,
   actions,
-  isSubmiting = false
+  isSubmiting = false,
+  sx,
+  paperSx,
+  contentSx,
+  titleSx,
+  actionsSx
 }) {
   const handleClose = (event, reason) => {
     if (isSubmiting) {
@@ -5277,73 +5283,150 @@ function CustomDialog({
       onClose: handleClose,
       maxWidth,
       fullWidth,
-      PaperComponent: DraggablePaper,
-      disableScrollLock: true
+      fullScreen,
+      PaperComponent: fullScreen ? void 0 : DraggablePaper,
+      disableScrollLock: true,
+      sx: [
+        fullScreen ? {
+          "& .MuiDialog-container": {
+            alignItems: "flex-start"
+          }
+        } : {},
+        ...Array.isArray(sx) ? sx : [sx]
+      ],
+      PaperProps: {
+        sx: [
+          fullScreen ? {
+            height: "100vh",
+            maxHeight: "100vh",
+            width: "100%",
+            maxWidth: "100%",
+            margin: 0,
+            borderRadius: 0,
+            overflow: "hidden"
+          } : {
+            maxHeight: "calc(100vh - 64px)"
+          },
+          ...Array.isArray(paperSx) ? paperSx : [paperSx]
+        ]
+      }
     },
     /* @__PURE__ */ React.createElement(
-      DialogTitle6,
+      Box25,
       {
-        fontWeight: 700,
-        fontSize: "1.2rem",
-        display: "flex",
-        alignItems: "center",
-        gap: "4px",
-        sx: { cursor: "move" },
-        id: "draggable-dialog"
+        sx: {
+          display: "flex",
+          flexDirection: "column",
+          height: fullScreen ? "100%" : "auto"
+        }
       },
-      /* @__PURE__ */ React.createElement(Stack7, { direction: "row", alignItems: "center", spacing: 0.5 }, /* @__PURE__ */ React.createElement(Box25, null, Icon && /* @__PURE__ */ React.createElement(
-        Stack7,
+      /* @__PURE__ */ React.createElement(
+        DialogTitle6,
         {
+          fontWeight: 700,
+          fontSize: "1.2rem",
+          display: "flex",
           alignItems: "center",
-          sx: {
-            color: iconColor ? (theme3) => {
-              const paletteColors = [
-                "primary",
-                "secondary",
-                "error",
-                "warning",
-                "info",
-                "success",
-                "tertiary",
-                "accent",
-                "successLight",
-                "orange",
-                "indigo",
-                "teal",
-                "pinkLight",
-                "aqua",
-                "customRed"
-              ];
-              if (paletteColors.includes(iconColor)) {
-                const palette = theme3.palette;
-                return palette[iconColor]?.main || iconColor;
-              }
-              return iconColor;
-            } : (theme3) => theme3.palette.info.main,
-            pr: 0.5
-          }
+          gap: "4px",
+          sx: [
+            fullScreen ? { cursor: "default" } : { cursor: "move" },
+            {
+              flexShrink: 0,
+              py: 2,
+              px: 3
+            },
+            ...Array.isArray(titleSx) ? titleSx : [titleSx]
+          ],
+          id: fullScreen ? void 0 : "draggable-dialog"
         },
-        /* @__PURE__ */ React.createElement(Icon, { size: 20 })
-      )), /* @__PURE__ */ React.createElement(Box25, null, title))
-    ),
-    /* @__PURE__ */ React.createElement(Tooltip4, { title: "\u0628\u0633\u062A\u0646" }, /* @__PURE__ */ React.createElement(
-      IconButton11,
-      {
-        "aria-label": "close",
-        onClick: onClose,
-        sx: {
-          position: "absolute",
-          right: 8,
-          top: 8,
-          color: (theme3) => theme3.palette.grey[500]
+        /* @__PURE__ */ React.createElement(Stack7, { direction: "row", alignItems: "center", spacing: 0.5 }, /* @__PURE__ */ React.createElement(Box25, null, Icon && /* @__PURE__ */ React.createElement(
+          Stack7,
+          {
+            alignItems: "center",
+            sx: {
+              color: iconColor ? (theme3) => {
+                const paletteColors = [
+                  "primary",
+                  "secondary",
+                  "error",
+                  "warning",
+                  "info",
+                  "success",
+                  "tertiary",
+                  "accent",
+                  "successLight",
+                  "orange",
+                  "indigo",
+                  "teal",
+                  "pinkLight",
+                  "aqua",
+                  "customRed"
+                ];
+                if (paletteColors.includes(iconColor)) {
+                  const palette = theme3.palette;
+                  return palette[iconColor]?.main || iconColor;
+                }
+                return iconColor;
+              } : (theme3) => theme3.palette.info.main,
+              pr: 0.5
+            }
+          },
+          /* @__PURE__ */ React.createElement(Icon, { size: 20 })
+        )), /* @__PURE__ */ React.createElement(Box25, null, title))
+      ),
+      /* @__PURE__ */ React.createElement(Tooltip4, { title: "\u0628\u0633\u062A\u0646" }, /* @__PURE__ */ React.createElement(
+        IconButton11,
+        {
+          "aria-label": "close",
+          onClick: onClose,
+          sx: [
+            {
+              position: "absolute",
+              right: 8,
+              top: 8,
+              color: (theme3) => theme3.palette.grey[500]
+            },
+            fullScreen && {
+              top: 12,
+              right: 12
+            }
+          ],
+          disabled: isSubmiting
         },
-        disabled: isSubmiting
-      },
-      /* @__PURE__ */ React.createElement(MdClose6, null)
-    )),
-    /* @__PURE__ */ React.createElement(Divider4, null),
-    /* @__PURE__ */ React.createElement(DialogContent6, null, children),
-    actions && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(DialogActions4, null, actions))
+        /* @__PURE__ */ React.createElement(MdClose6, null)
+      )),
+      /* @__PURE__ */ React.createElement(Divider4, { sx: { flexShrink: 0 } }),
+      /* @__PURE__ */ React.createElement(
+        DialogContent6,
+        {
+          sx: [
+            {
+              flex: 1,
+              display: "flex",
+              flexDirection: "column",
+              overflow: "auto",
+              p: 0
+            },
+            ...Array.isArray(contentSx) ? contentSx : [contentSx]
+          ]
+        },
+        /* @__PURE__ */ React.createElement(Box25, { sx: { p: fullScreen ? 3 : 2, flex: 1, overflow: "auto" } }, children)
+      ),
+      actions && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+        DialogActions4,
+        {
+          sx: [
+            {
+              flexShrink: 0,
+              py: 2,
+              px: 3
+            },
+            ...Array.isArray(actionsSx) ? actionsSx : [actionsSx]
+          ]
+        },
+        actions
+      ))
+    )
   );
 }
 export {