@mamrp/components 1.0.26 → 1.0.30

package/dist/index.mjs

@@ -76,7 +76,7 @@ function LicensePlate({
   readOnly = true,
   size
 }) {
-  const theme = useTheme();
+  const theme2 = useTheme();
   const [open, setOpen] = useState(false);
   const [selectedValue, setSelectedValue] = useState("");
   const [inputValues, setInputValues] = useState({
@@ -203,7 +203,7 @@ function LicensePlate({
           maxLength: 2,
           placeholder: "- -",
           style: {
-            color: theme.palette.text.primary,
+            color: theme2.palette.text.primary,
             width: "24px",
             textAlign: "center",
             backgroundColor: "transparent",
@@ -253,7 +253,7 @@ function LicensePlate({
             maxLength: 3,
             placeholder: "-",
             style: {
-              color: theme.palette.text.primary,
+              color: theme2.palette.text.primary,
               width: "28px",
               textAlign: "center",
               backgroundColor: "transparent",
@@ -355,7 +355,7 @@ function LicensePlate({
           maxLength: 3,
           placeholder: "- - -",
           style: {
-            color: theme.palette.text.primary,
+            color: theme2.palette.text.primary,
             width: "40px",
             // w-10
             textAlign: "center",
@@ -402,7 +402,7 @@ function LicensePlate({
             maxLength: 2,
             placeholder: "- -",
             style: {
-              color: theme.palette.text.primary,
+              color: theme2.palette.text.primary,
               width: "24px",
               textAlign: "center",
               backgroundColor: "transparent",
@@ -702,7 +702,7 @@ function AdvancedSearchButton({
   paddingY,
   fontSize
 }) {
-  const theme = useTheme2();
+  const theme2 = useTheme2();
   return /* @__PURE__ */ React4.createElement(
     Button2,
     {
@@ -712,7 +712,7 @@ function AdvancedSearchButton({
       },
       startIcon: /* @__PURE__ */ React4.createElement(AnimatedIcon, { isShowFilter }),
       sx: {
-        color: theme.palette.text.primary ?? color,
+        color: theme2.palette.text.primary ?? color,
         borderRadius,
         paddingY,
         fontSize
@@ -848,7 +848,7 @@ function ConfirmationDialog({
         position: "absolute",
         right: 8,
         top: 8,
-        color: (theme) => theme.palette.grey[500]
+        color: (theme2) => theme2.palette.grey[500]
       }
     },
     /* @__PURE__ */ React7.createElement(MdClose, null)
@@ -970,7 +970,7 @@ var TimePickerComponent = ({
   autoRefresh,
   disabled = false
 }) => {
-  const theme = useTheme3();
+  const theme2 = useTheme3();
   const initialHour = value ? parseInt(value.split(":")[0]) : null;
   const initialMinute = value ? parseInt(value.split(":")[1]) : null;
   const [isModalOpen, setIsModalOpen] = useState3(false);
@@ -1067,7 +1067,7 @@ var TimePickerComponent = ({
       },
       InputProps: {
         ...!disabled && {
-          endAdornment: /* @__PURE__ */ React.createElement(InputAdornment, { position: "end" }, /* @__PURE__ */ React.createElement(Tooltip, { title: "\u0627\u0646\u062A\u062E\u0627\u0628 \u0632\u0645\u0627\u0646" }, /* @__PURE__ */ React.createElement(IconButton3, { onClick: () => setIsModalOpen(true) }, /* @__PURE__ */ React.createElement(Clock, { size: 22, color: theme.palette.text.primary }))))
+          endAdornment: /* @__PURE__ */ React.createElement(InputAdornment, { position: "end" }, /* @__PURE__ */ React.createElement(Tooltip, { title: "\u0627\u0646\u062A\u062E\u0627\u0628 \u0632\u0645\u0627\u0646" }, /* @__PURE__ */ React.createElement(IconButton3, { onClick: () => setIsModalOpen(true) }, /* @__PURE__ */ React.createElement(Clock, { size: 22, color: theme2.palette.text.primary }))))
         }
       },
       sx: { width: fullwidth ? "100%" : "8rem" },
@@ -1101,7 +1101,7 @@ var TimePickerComponent = ({
           position: "absolute",
           right: 8,
           top: 8,
-          color: (theme2) => theme2.palette.grey[500]
+          color: (theme3) => theme3.palette.grey[500]
         }
       },
       /* @__PURE__ */ React.createElement(MdClose2, null)
@@ -2569,7 +2569,7 @@ function ConfirmationDialog2({
         position: "absolute",
         right: 8,
         top: 8,
-        color: (theme) => theme.palette.grey[500]
+        color: (theme2) => theme2.palette.grey[500]
       }
     },
     /* @__PURE__ */ React14.createElement(MdClose3, null)
@@ -2627,7 +2627,7 @@ function NoResult({
   description,
   sx = {}
 }) {
-  const theme = useTheme4();
+  const theme2 = useTheme4();
   return /* @__PURE__ */ React15.createElement(
     Card2,
     {
@@ -2635,7 +2635,7 @@ function NoResult({
         width: "100%",
         minWidth: 300,
         borderRadius: "12px",
-        border: `1px solid ${theme.palette.secondary.light}`
+        border: `1px solid ${theme2.palette.secondary.light}`
       }
     },
     /* @__PURE__ */ React15.createElement(
@@ -2769,41 +2769,82 @@ import RadioGroup from "@mui/material/RadioGroup";
 import FormControlLabel2 from "@mui/material/FormControlLabel";
 import FormControl from "@mui/material/FormControl";
 import FormLabel from "@mui/material/FormLabel";
-function RadioButton({ name, label, options, control }) {
-  return /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(FormControl, { sx: {
-    display: "flex",
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "start"
-  } }, /* @__PURE__ */ React17.createElement(FormLabel, { id: `${name}-label` }, label), /* @__PURE__ */ React17.createElement(
-    Controller7,
+import { Typography as Typography10 } from "@mui/material";
+import theme from "@mamrp/layout/theme";
+import { Box as Box14 } from "@mui/system";
+function RadioButton({
+  name,
+  label,
+  options,
+  control,
+  align = "start",
+  disabledBoarder,
+  direction = "row"
+}) {
+  return /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(
+    FormControl,
     {
-      name,
-      control,
-      render: ({ field }) => /* @__PURE__ */ React17.createElement(
-        RadioGroup,
-        {
-          ...field,
-          "aria-labelledby": `${name}-label`,
-          value: field.value,
-          sx: {
-            display: "flex",
-            flexDirection: "row",
-            marginLeft: 5
-          }
-        },
-        options.map((option) => /* @__PURE__ */ React17.createElement(
-          FormControlLabel2,
+      sx: {
+        display: "flex",
+        flexDirection: direction,
+        alignItems: "center",
+        justifyContent: "start"
+      }
+    },
+    /* @__PURE__ */ React17.createElement(
+      Controller7,
+      {
+        name,
+        control,
+        render: ({ field, fieldState: { error } }) => /* @__PURE__ */ React17.createElement(Box14, { display: "flex", width: "100%", flexDirection: "column" }, label && /* @__PURE__ */ React17.createElement(
+          FormLabel,
           {
-            key: option.value,
-            value: option.value,
-            control: /* @__PURE__ */ React17.createElement(Radio, { id: option.id }),
-            label: option.name
-          }
-        ))
-      )
-    }
-  )));
+            id: `${name}-label`,
+            sx: {
+              position: "absolute",
+              top: -10,
+              left: 15,
+              px: 0.5,
+              // به‌جای background رنگی، این باعث میشه کمی فضا بدیم
+              backgroundColor: "background.paper",
+              // استفاده از theme برای همخوانی با زمینه
+              color: error?.message ? theme.CustomComponents.RadioButton.errorColor : theme.CustomComponents.RadioButton.textColor,
+              fontSize: 15,
+              zIndex: 1
+            }
+          },
+          label
+        ), /* @__PURE__ */ React17.createElement(
+          RadioGroup,
+          {
+            ...field,
+            "aria-labelledby": `${name}-label`,
+            value: field.value,
+            sx: {
+              width: "100%",
+              p: 0.8,
+              px: 1,
+              borderRadius: 3,
+              display: "flex",
+              justifyContent: align,
+              flexDirection: "row",
+              border: disabledBoarder ? "" : `${theme.CustomComponents.RadioButton.borderSize}px solid`,
+              borderColor: error?.message ? theme.CustomComponents.RadioButton.errorColor : theme.CustomComponents.RadioButton.borderColor
+            }
+          },
+          options.map((option) => /* @__PURE__ */ React17.createElement(
+            FormControlLabel2,
+            {
+              key: option.value,
+              value: option.value,
+              control: /* @__PURE__ */ React17.createElement(Radio, { id: option.id }),
+              label: option.name
+            }
+          ))
+        ), error?.message && /* @__PURE__ */ React17.createElement(Typography10, { color: "error", fontSize: theme.CustomComponents.RadioButton.errorFontSize, ml: 2 }, error?.message))
+      }
+    )
+  ));
 }
 
 // src/selector/index.tsx
@@ -2818,7 +2859,7 @@ import {
   ListItemText,
   MenuItem,
   Select,
-  Typography as Typography10
+  Typography as Typography11
 } from "@mui/material";
 import React18, { useState as useState9 } from "react";
 var backendResponse = {
@@ -2923,7 +2964,7 @@ var NestedSelect = () => {
       open: menuOpen,
       onOpen: () => setMenuOpen(true),
       onClose: () => setMenuOpen(false),
-      renderValue: (selected) => selectedItem ? /* @__PURE__ */ React18.createElement(Typography10, null, selectedItem.title) : " "
+      renderValue: (selected) => selectedItem ? /* @__PURE__ */ React18.createElement(Typography11, null, selectedItem.title) : " "
     },
     renderMenuItems(backendResponse.value.data)
   ));
@@ -2931,7 +2972,7 @@ var NestedSelect = () => {
 var selector_default = NestedSelect;
 
 // src/spinner/sonar/index.tsx
-import { Box as Box14 } from "@mui/material";
+import { Box as Box15 } from "@mui/material";
 import { keyframes } from "@mui/system";
 import React19 from "react";
 var radarAnimation = keyframes`
@@ -2946,8 +2987,8 @@ var radarAnimation = keyframes`
   }
 `;
 function SonarSpinner({ children }) {
-  return /* @__PURE__ */ React19.createElement(React19.Fragment, null, /* @__PURE__ */ React19.createElement(Box14, { className: "absolute w-[30px] h-[30px] rounded-full bg-white z-10 flex items-center justify-center" }, children), /* @__PURE__ */ React19.createElement(
-    Box14,
+  return /* @__PURE__ */ React19.createElement(React19.Fragment, null, /* @__PURE__ */ React19.createElement(Box15, { className: "absolute w-[30px] h-[30px] rounded-full bg-white z-10 flex items-center justify-center" }, children), /* @__PURE__ */ React19.createElement(
+    Box15,
     {
       className: "root",
       sx: {
@@ -2960,7 +3001,7 @@ function SonarSpinner({ children }) {
       }
     },
     /* @__PURE__ */ React19.createElement(
-      Box14,
+      Box15,
       {
         className: "radar",
         sx: {
@@ -2978,7 +3019,7 @@ function SonarSpinner({ children }) {
         }
       },
       /* @__PURE__ */ React19.createElement(
-        Box14,
+        Box15,
         {
           className: "sonar",
           sx: {
@@ -2992,7 +3033,7 @@ function SonarSpinner({ children }) {
         }
       ),
       /* @__PURE__ */ React19.createElement(
-        Box14,
+        Box15,
         {
           className: "sonar delayed",
           sx: {
@@ -3015,7 +3056,7 @@ function SonarSpinner({ children }) {
 }
 
 // src/stepper/index.tsx
-import Box15 from "@mui/material/Box";
+import Box16 from "@mui/material/Box";
 import Step from "@mui/material/Step";
 import StepButton from "@mui/material/StepButton";
 import Stepper from "@mui/material/Stepper";
@@ -3026,7 +3067,7 @@ function HorizontalStepper({
   setCurrentStep
 }) {
   const [completed, setCompleted] = React20.useState({});
-  return /* @__PURE__ */ React20.createElement(Box15, { sx: { width: "100%" } }, /* @__PURE__ */ React20.createElement(Stepper, { nonLinear: true, activeStep: currentStep }, steps.map((label, index) => /* @__PURE__ */ React20.createElement(Step, { key: index, completed: completed[index] }, /* @__PURE__ */ React20.createElement(
+  return /* @__PURE__ */ React20.createElement(Box16, { sx: { width: "100%" } }, /* @__PURE__ */ React20.createElement(Stepper, { nonLinear: true, activeStep: currentStep }, steps.map((label, index) => /* @__PURE__ */ React20.createElement(Step, { key: index, completed: completed[index] }, /* @__PURE__ */ React20.createElement(
     StepButton,
     {
       color: "inherit",
@@ -3042,7 +3083,7 @@ function HorizontalStepper({
 }
 
 // src/table/index.tsx
-import { Typography as Typography11 } from "@mui/material";
+import { Typography as Typography12 } from "@mui/material";
 import Skeleton2 from "@mui/material/Skeleton";
 import { styled as styled2 } from "@mui/material/styles";
 import {
@@ -3213,7 +3254,7 @@ var Table = ({
             }
           )) : `${from} - ${!isNaN(to) ? to : "..."} \u0627\u0632 ${count !== void 0 ? count : "..."}`
         },
-        footerRowSelected: (count) => /* @__PURE__ */ React21.createElement(Typography11, null, "\u0633\u0637\u0631 \u0647\u0627\u06CC \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647 : ", count)
+        footerRowSelected: (count) => /* @__PURE__ */ React21.createElement(Typography12, null, "\u0633\u0637\u0631 \u0647\u0627\u06CC \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647 : ", count)
       },
       ...rest
     }
@@ -3420,7 +3461,7 @@ import React24 from "react";
 import {
   Controller as Controller10
 } from "react-hook-form";
-import { Box as Box16, Button as Button11, Stack as Stack5, Typography as Typography12 } from "@mui/material";
+import { Box as Box17, Button as Button11, Stack as Stack5, Typography as Typography13 } from "@mui/material";
 import { GrUpload, GrGallery } from "react-icons/gr";
 import { MdOutlineCameraAlt } from "react-icons/md";
 import Image3 from "next/image";
@@ -3533,7 +3574,7 @@ var UploadImage = ({
             sx: { pt: allowGallery ? 2 : 0 }
           },
           /* @__PURE__ */ React24.createElement(
-            Box16,
+            Box17,
             {
               sx: {
                 display: "flex",
@@ -3542,7 +3583,7 @@ var UploadImage = ({
                 gap: 1.5
               }
             },
-            /* @__PURE__ */ React24.createElement(Box16, { sx: { paddingBottom: "0.5rem" } }, /* @__PURE__ */ React24.createElement(GrUpload, null)),
+            /* @__PURE__ */ React24.createElement(Box17, { sx: { paddingBottom: "0.5rem" } }, /* @__PURE__ */ React24.createElement(GrUpload, null)),
             placeholder
           ),
           allowGallery && /* @__PURE__ */ React24.createElement(Stack5, { spacing: 1.5 }, /* @__PURE__ */ React24.createElement(
@@ -3607,7 +3648,7 @@ var UploadImage = ({
           style: { display: "none" }
         }
       ), selectedImage && /* @__PURE__ */ React24.createElement(
-        Box16,
+        Box17,
         {
           sx: { display: "flex", justifyContent: "center", marginTop: 2 }
         },
@@ -3631,7 +3672,7 @@ var UploadImage = ({
           },
           "\u062D\u0630\u0641 \u062A\u0635\u0648\u06CC\u0631"
         )
-      ), errors[name] && /* @__PURE__ */ React24.createElement(Typography12, { color: "error", variant: "body2", sx: { mt: 1.5, ml: 1 } }, String(errors[name]?.message || "")))
+      ), errors[name] && /* @__PURE__ */ React24.createElement(Typography13, { color: "error", variant: "body2", sx: { mt: 1.5, ml: 1 } }, String(errors[name]?.message || "")))
     }
   );
 };
@@ -3646,14 +3687,14 @@ import MuiAccordionSummary, {
 } from "@mui/material/AccordionSummary";
 import MuiAccordionDetails from "@mui/material/AccordionDetails";
 import {
-  Typography as Typography13
+  Typography as Typography14
 } from "@mui/material";
 import { useState as useState11 } from "react";
 function Page({
   data
 }) {
-  const Accordion = styled3((props) => /* @__PURE__ */ React.createElement(MuiAccordion, { disableGutters: true, elevation: 0, square: true, ...props }))(({ theme }) => ({
-    border: `1px solid ${theme.palette.divider}`,
+  const Accordion = styled3((props) => /* @__PURE__ */ React.createElement(MuiAccordion, { disableGutters: true, elevation: 0, square: true, ...props }))(({ theme: theme2 }) => ({
+    border: `1px solid ${theme2.palette.divider}`,
     "&:not(:last-child)": {
       borderBottom: 0
     },
@@ -3661,21 +3702,21 @@ function Page({
       display: "none"
     }
   }));
-  const AccordionSummary = styled3((props) => /* @__PURE__ */ React.createElement(MuiAccordionSummary, { expandIcon: /* @__PURE__ */ React.createElement(IoIosArrowForward, null), ...props }))(({ theme }) => ({
+  const AccordionSummary = styled3((props) => /* @__PURE__ */ React.createElement(MuiAccordionSummary, { expandIcon: /* @__PURE__ */ React.createElement(IoIosArrowForward, null), ...props }))(({ theme: theme2 }) => ({
     backgroundColor: "rgba(0, 0, 0, .03)",
     flexDirection: "row-reverse",
     [`& .${accordionSummaryClasses.expandIconWrapper}.${accordionSummaryClasses.expanded}`]: {
       transform: "rotate(90deg)"
     },
     [`& .${accordionSummaryClasses.content}`]: {
-      marginLeft: theme.spacing(1)
+      marginLeft: theme2.spacing(1)
     },
-    ...theme.applyStyles("dark", {
+    ...theme2.applyStyles("dark", {
       backgroundColor: "rgba(255, 255, 255, .05)"
     })
   }));
-  const AccordionDetails = styled3(MuiAccordionDetails)(({ theme }) => ({
-    padding: theme.spacing(2),
+  const AccordionDetails = styled3(MuiAccordionDetails)(({ theme: theme2 }) => ({
+    padding: theme2.spacing(2),
     borderTop: "1px solid rgba(0, 0, 0, .125)"
   }));
   const [expanded, setExpanded] = useState11("");
@@ -3702,7 +3743,7 @@ function Page({
             }
           }
         },
-        /* @__PURE__ */ React.createElement(Typography13, { component: "span" }, item.title)
+        /* @__PURE__ */ React.createElement(Typography14, { component: "span" }, item.title)
       ),
       /* @__PURE__ */ React.createElement(AccordionDetails, null, item.body)
     );
@@ -3710,22 +3751,22 @@ function Page({
 }
 
 // src/switch-button/index.tsx
-import { Box as Box17, FormControlLabel as FormControlLabel3, Switch } from "@mui/material";
+import { Box as Box18, FormControlLabel as FormControlLabel3, Switch } from "@mui/material";
 import { styled as styled4 } from "@mui/system";
 import React25 from "react";
 import { PiCardsDuotone, PiTableDuotone } from "react-icons/pi";
-import { useTheme as useTheme5 } from "@mui/material";
+import { useTheme as useTheme6 } from "@mui/material";
 var SwitchButton = ({
   checked,
   handleChange,
   iconChecked,
   iconUnchecked
 }) => {
-  const theme = useTheme5();
-  const isDarkMode = theme.palette.mode === "dark";
-  const CustomSwitch = styled4(Switch)(({ theme: theme2 }) => ({
+  const theme2 = useTheme6();
+  const isDarkMode = theme2.palette.mode === "dark";
+  const CustomSwitch = styled4(Switch)(({ theme: theme3 }) => ({
     "& .MuiSwitch-switchBase.Mui-checked": {
-      color: theme2.palette.primary.main
+      color: theme3.palette.primary.main
     },
     "& .MuiSwitch-switchBase": {
       color: isDarkMode ? "rgba(220,220,220,1)" : "rgba(188,188,188,1)"
@@ -3736,16 +3777,16 @@ var SwitchButton = ({
       border: isDarkMode ? "2px solid white" : "2px solid rgba(80,80,80, 1)"
     }
   }));
-  const BoxContainer = styled4(Box17)(({ theme: theme2 }) => ({
+  const BoxContainer = styled4(Box18)(({ theme: theme3 }) => ({
     display: "flex",
     alignItems: "center",
     backgroundColor: "rgba(188,188,188, 0.1)",
     border: "2px solid rgba(200,200,200, 1)",
     borderRadius: 10,
     transition: "all 0.3s ease",
-    paddingTop: theme2.spacing(0.1),
-    paddingBottom: theme2.spacing(0.1),
-    paddingLeft: theme2.spacing(1)
+    paddingTop: theme3.spacing(0.1),
+    paddingBottom: theme3.spacing(0.1),
+    paddingLeft: theme3.spacing(1)
   }));
   const LabelContainer = styled4("div")({
     transition: "all 0.2s ease",
@@ -3769,7 +3810,7 @@ var SwitchButton = ({
 var switch_button_default = SwitchButton;
 
 // src/bascule-connection-button/index.tsx
-import { Box as Box18, Button as Button12 } from "@mui/material";
+import { Box as Box19, Button as Button12 } from "@mui/material";
 import React26, { useRef as useRef4, useState as useState12 } from "react";
 import toast from "react-hot-toast";
 import { PiPlugs, PiPlugsConnected } from "react-icons/pi";
@@ -3817,7 +3858,7 @@ var ConnectToBasculeButton = ({
       sx: { minWidth: "11rem" }
     },
     /* @__PURE__ */ React26.createElement(
-      Box18,
+      Box19,
       {
         sx: {
           display: "flex",