@tesouro/embedded-components-react 0.2.131 → 0.2.133

package/dist/libs/tesouro-embedded-components-react/monite-sdk/dist/index129.js

@@ -1,11 +1,1273 @@
-import { jsx as e } from "@emotion/react/jsx-runtime";
-import { cn as i } from "./index100.js";
-function o({
-  className: t,
-  ...r
-}) {
-  return /* @__PURE__ */ e("textarea", { "data-slot": "textarea", className: i("ttw:border-input ttw:placeholder:text-muted-foreground ttw:focus-visible:border-ring ttw:focus-visible:ring-ring/50 ttw:aria-invalid:ring-destructive/20 ttw:dark:aria-invalid:ring-destructive/40 ttw:aria-invalid:border-destructive ttw:dark:bg-input/30 ttw:flex ttw:field-sizing-content ttw:min-h-16 ttw:w-full ttw:rounded-md ttw:border ttw:bg-transparent ttw:px-3 ttw:py-2 ttw:text-base ttw:shadow-xs ttw:transition-[color,box-shadow] ttw:outline-none ttw:focus-visible:ring-[3px] ttw:disabled:cursor-not-allowed ttw:disabled:opacity-50 ttw:md:text-sm", t), ...r });
+import { getTheme as f } from "./index223.js";
+import { getPrimaryColors as x } from "./index224.js";
+import { getSecondaryColors as M } from "./index225.js";
+import { getNeutralColors as u } from "./index226.js";
+import { getSeverityColors as C } from "./index227.js";
+import { getTextColors as v } from "./index228.js";
+import { getFormControlStyles as S } from "./index229.js";
+import { getErrorColors as k } from "./index230.js";
+import { getSuccessColors as w } from "./index231.js";
+import { getWarningColors as I } from "./index232.js";
+import { getButtonStateStyles as i, getButtonStyles as p } from "./index167.js";
+import { isPlainObject as R } from "@mui/utils";
+import "@mui/x-data-grid/themeAugmentation";
+import d from "chroma-js";
+function B(a, o) {
+  if (a.includes(".")) {
+    let e = o;
+    if (a.split(".").forEach((n) => {
+      e = e && e[n];
+    }), e && typeof e == "string") return e;
+  } else if (typeof o[a] == "string") return o[a];
+  return a;
 }
+const O = ["color", "backgroundColor", "bgcolor", "borderColor", "borderRightColor", "borderLeftColor", "borderTopColor", "borderBottomColor", "fill", "--DataGrid-rowBorderColor"];
+function c(a, o) {
+  const e = Array.isArray(a) ? [] : {};
+  return Object.keys(a).forEach((n) => {
+    const r = n;
+    if (!a.hasOwnProperty(r)) return;
+    const t = a[r];
+    typeof t == "string" && O.includes(n) ? e[r] = B(t, o) : R(t) || Array.isArray(t) ? e[r] = c(t, o) : e[r] = t;
+  }), e;
+}
+const q = (a) => {
+  const o = f(a), e = o.components.styles?.payables?.button, n = {
+    draft: "#000",
+    new: "#3737FF",
+    approve_in_progress: "#3737FF",
+    paid: "#007F33",
+    waiting_to_be_paid: "#3737FF",
+    rejected: "#CC394B",
+    partially_paid: "#9033D9",
+    canceled: "#E75300",
+    all: "#F4F4FE"
+  }, r = {
+    primary: x(o.colors.primary, o.colors.primaryForeground),
+    secondary: M(o.colors.secondary),
+    neutral: u(o.colors.neutral),
+    info: C(o.colors.info),
+    success: w(o.colors.success),
+    warning: I(o.colors.warning),
+    error: k(o.colors.error),
+    background: {
+      default: o.colors.background,
+      paper: "#ffffff"
+    },
+    text: v(o.colors.text),
+    status: n,
+    divider: u(o.colors.neutral)[80]
+  }, t = {
+    black: {
+      color: "#292929",
+      backgroundColor: "#F2F2F2"
+    },
+    blue: {
+      color: "#3737FF",
+      backgroundColor: "#F4F4FE"
+    },
+    violet: {
+      color: "#A06DC8",
+      backgroundColor: "#FBF1FC"
+    },
+    green: {
+      color: "#0DAA8E",
+      backgroundColor: "#EEFBF9"
+    },
+    orange: {
+      color: "#E27E46",
+      backgroundColor: "#FFF5EB"
+    },
+    red: {
+      color: "#CC394B",
+      backgroundColor: "#FFE0E4"
+    }
+  }, l = ["rgba(0,0,255,0.05)", "rgba(255,0,32,0.05)", "rgba(0,255,220,0.05)", "rgba(225,1,251,0.05)", "rgba(255,123,0,0.05)"], g = {
+    fontFamily: o.typography.fontFamily,
+    fontSize: o.typography.fontSize,
+    fontWeightMedium: 400,
+    fontWeightBold: 500,
+    h1: {
+      fontSize: o.typography.h1.fontSize,
+      fontWeight: o.typography.h1.fontWeight,
+      lineHeight: o.typography.h1.lineHeight,
+      textTransform: o.typography.h1.textTransform,
+      color: r.text.primary
+    },
+    h2: {
+      fontSize: o.typography.h2.fontSize,
+      fontWeight: o.typography.h2.fontWeight,
+      lineHeight: o.typography.h2.lineHeight,
+      textTransform: o.typography.h2.textTransform,
+      color: r.text.primary
+    },
+    h3: {
+      fontSize: o.typography.h3.fontSize,
+      fontWeight: o.typography.h3.fontWeight,
+      lineHeight: o.typography.h3.lineHeight,
+      textTransform: o.typography.h3.textTransform,
+      color: r.text.primary
+    },
+    subtitle1: {
+      fontSize: o.typography.subtitle1.fontSize,
+      fontWeight: o.typography.subtitle1.fontWeight,
+      lineHeight: o.typography.subtitle1.lineHeight,
+      textTransform: o.typography.subtitle1.textTransform
+    },
+    subtitle2: {
+      fontSize: o.typography.subtitle2.fontSize,
+      fontWeight: o.typography.subtitle2.fontWeight,
+      lineHeight: o.typography.subtitle2.lineHeight,
+      textTransform: o.typography.subtitle2.textTransform
+    },
+    body1: {
+      fontSize: o.typography.body1?.fontSize,
+      fontWeight: o.typography.body1?.fontWeight,
+      lineHeight: o.typography.body1?.lineHeight
+    },
+    body2: {
+      fontSize: o.typography.body2?.fontSize,
+      fontWeight: o.typography.body2?.fontWeight,
+      lineHeight: o.typography.body2?.lineHeight,
+      color: "rgba(0, 0, 0, 0.56)"
+    },
+    caption: {
+      fontSize: "1rem",
+      fontWeight: 500
+    },
+    overline: {
+      fontSize: "1.5rem",
+      lineHeight: 1
+    },
+    button: {
+      textTransform: "none",
+      fontWeight: 500
+    }
+  }, b = Object.assign({}, g, {}), s = "160px", h = {
+    MuiAlert: {
+      styleOverrides: {
+        root: {
+          borderRadius: ".5em",
+          "&.MuiAlert-colorInfo": {
+            backgroundColor: d(r.info.main).alpha(0.05).hex(),
+            ".MuiAlert-icon, .MuiAlert-message": {
+              color: r.info.main
+            }
+          },
+          "&.MuiAlert-colorSuccess": {
+            backgroundColor: d(r.success.main).alpha(0.05).hex(),
+            ".MuiAlert-icon, .MuiAlert-message": {
+              color: r.success.main
+            }
+          },
+          "&.MuiAlert-colorWarning": {
+            backgroundColor: d(r.warning.main).alpha(0.05).hex(),
+            ".MuiAlert-icon, .MuiAlert-message": {
+              color: r.warning.main
+            }
+          },
+          "&.MuiAlert-colorError": {
+            backgroundColor: d(r.error.main).alpha(0.05).hex(),
+            ".MuiAlert-icon, .MuiAlert-message": {
+              color: r.error.main
+            }
+          }
+        }
+      }
+    },
+    MuiTypography: {
+      styleOverrides: {
+        root: {
+          "&.Monite-SummaryCard-StatusTypography": {
+            fontSize: 14
+          },
+          "&.Monite-SummaryCard-AmountTypography": {
+            fontSize: 20,
+            marginTop: 4
+          }
+        }
+      }
+    },
+    MuiFormLabel: {
+      styleOverrides: {
+        root: {
+          "&.Mui-disabled": {
+            color: "black"
+          }
+        }
+      }
+    },
+    MuiInputLabel: {
+      defaultProps: {
+        shrink: !0
+      },
+      styleOverrides: {
+        root: {
+          fontSize: "14px",
+          transform: "none",
+          position: "static",
+          color: "black",
+          minHeight: "28px",
+          "&.Mui-disabled": {
+            color: "black"
+          }
+        },
+        asterisk: {
+          color: t.red.color,
+          transform: "scale(2) translate(6px, 2px)",
+          display: "inline-block",
+          width: "20px"
+        }
+      }
+    },
+    MuiInputBase: {
+      styleOverrides: {
+        root: {
+          fontWeight: 400,
+          borderRadius: o.borderRadius * 2.67,
+          minHeight: "40px",
+          border: "1px solid transparent",
+          "&:before, &:after": {
+            display: "none",
+            content: "none",
+            visibility: "hidden"
+          },
+          "& .MuiInputBase-input": {
+            height: "40px",
+            lineHeight: "40px",
+            padding: "0 14px",
+            // Adjust padding if needed
+            boxSizing: "border-box"
+          },
+          "& .MuiInputBase-inputAdornedStart": {
+            display: "flex",
+            alignItems: "center"
+          }
+        }
+      }
+    },
+    MuiOutlinedInput: {
+      styleOverrides: {
+        // Editor borders
+        notchedOutline: {
+          borderColor: "neutral.80"
+        },
+        root: {
+          "&.Mui-disabled .MuiOutlinedInput-notchedOutline, .MuiOutlinedInput-notchedOutline": {
+            borderColor: "neutral.80"
+          }
+        }
+      }
+    },
+    MuiFormControl: S(r, a, s),
+    MuiSelect: {
+      styleOverrides: {
+        root: {
+          "&.Monite-NakedField": {
+            "& .MuiSelect-select": {
+              paddingLeft: "0"
+            },
+            "& .MuiOutlinedInput-notchedOutline": {
+              borderStyle: "none"
+            }
+          },
+          "&.Monite-RecipientSelector": {
+            "& .MuiChip-root": {
+              backgroundColor: "transparent",
+              borderColor: "divider",
+              borderWidth: "1px",
+              borderStyle: "solid",
+              padding: "7px 8px",
+              "& .MuiChip-label": {
+                color: "text.primary"
+              }
+            },
+            "& .MuiSelect-icon": {
+              backgroundColor: "primary.80",
+              borderRadius: o.borderRadius * 2.67,
+              width: "32px",
+              height: "32px",
+              transform: "translate(7px, -2px)",
+              path: {
+                fill: "primary.main",
+                transform: "scale(0.6) translate(8px, 8px)"
+              }
+            }
+          }
+        }
+      }
+    },
+    MuiStack: {
+      styleOverrides: {
+        root: {
+          "&.Monite-Filters": {
+            backgroundColor: o.colors.background,
+            padding: o.spacing * 1.8,
+            marginBottom: 0,
+            "& > *": {
+              flexBasis: "fit-content",
+              flexGrow: 1
+            },
+            "& .Monite-Filters-Group": {
+              marginLeft: "16px"
+            }
+          }
+        }
+      }
+    },
+    MuiFormControlLabel: {
+      styleOverrides: {
+        root: {
+          // Align checkbox with the label next to if the label occupies multiple lines
+          "&.MuiFormControlLabel-labelPlacementEnd": {
+            alignItems: "flex-start",
+            ".MuiFormControlLabel-label": {
+              padding: "9px 0"
+            }
+          },
+          "&.Monite-FilterControl": {
+            marginLeft: 0,
+            marginRight: 0,
+            alignItems: "center",
+            width: "auto",
+            "& .MuiTypography-root": {
+              fontSize: "14px",
+              lineHeight: "20px"
+            }
+          }
+        },
+        label: {
+          fontWeight: 400,
+          fontSize: "16px",
+          lineHeight: "24px"
+        }
+      }
+    },
+    MuiAutocomplete: {
+      styleOverrides: {
+        root: {
+          "& > .MuiFormControl-root > .MuiInputBase-root": {
+            paddingTop: 0,
+            paddingBottom: 0
+          },
+          "& .MuiInput-root .MuiInput-input, & .MuiInput-root.MuiInputBase-sizeSmall": {
+            padding: "0 14px"
+          },
+          "& > .Monite-Selector": {
+            "& > .MuiInputBase-root": {
+              border: "1px solid transparent",
+              "&:hover": {
+                "&:not(.Mui-disabled):not(.Mui-focused)": {
+                  boxShadow: `0 0 0 4px ${d(r.primary.main).alpha(0.24).hex()}`
+                }
+              },
+              "& > .MuiInputAdornment-root": {
+                "&.MuiInputAdornment-positionStart": {
+                  marginRight: "16px"
+                },
+                "&.MuiInputAdornment-positionEnd": {
+                  marginLeft: "0",
+                  "& + input:not(:placeholder-shown)": {
+                    opacity: 0
+                  },
+                  "& + input::placeholder": {
+                    color: "rgba(184, 184, 184, 1)"
+                  }
+                }
+              },
+              "&.MuiInputBase-adornedStart.MuiInputBase-formControl": {
+                padding: "16px",
+                height: "70px",
+                lineHeight: "70px",
+                backgroundColor: "transparent",
+                "&.Mui-focused > .MuiOutlinedInput-notchedOutline": {
+                  borderColor: "transparent"
+                }
+              },
+              "&:hover > .MuiOutlinedInput-notchedOutline": {
+                borderColor: "#dedede"
+              },
+              "& > .MuiOutlinedInput-notchedOutline": {
+                top: 0,
+                "> legend": {
+                  display: "none"
+                }
+              }
+            },
+            "& > .MuiFormLabel-root": {
+              fontSize: "1.25rem",
+              paddingBottom: "1rem",
+              "& > .MuiInputLabel-asterisk": {
+                display: "none"
+              }
+            },
+            "&.isSimplified": {
+              marginBottom: "2rem",
+              background: "transparent",
+              "& > .MuiInputBase-root": {
+                paddingRight: "1rem"
+              },
+              "& > .MuiInputLabel-root": {
+                fontSize: "14px",
+                color: "rgba(112, 112, 112, 1)",
+                paddingBottom: "0",
+                "&::after": {
+                  content: '"●"',
+                  position: "relative",
+                  bottom: "2px",
+                  left: "4px",
+                  color: "rgba(255, 71, 93, 1)"
+                }
+              },
+              "& > .MuiInputLabel-root > .MuiFormLabel-asterisk": {
+                display: "none"
+              }
+            }
+          },
+          "& > .Item-Selector > .MuiInputBase-root.MuiInputBase-formControl.MuiAutocomplete-inputRoot": {
+            paddingRight: "1em",
+            "&.MuiInputBase-adornedStart.MuiInputBase-formControl": {
+              padding: "8px 12px",
+              height: "40px",
+              lineHeight: "40px"
+            }
+          },
+          "&.Monite-FilterControl": {
+            height: "40px",
+            minHeight: "40px",
+            maxHeight: "40px",
+            maxWidth: s,
+            width: "100%"
+          },
+          "&.Monite-Label-Hidden .MuiInputLabel-root.MuiFormLabel-root": {
+            display: "none"
+          }
+        },
+        popper: {
+          paddingTop: "0.5rem"
+        }
+      }
+    },
+    MuiTextField: {
+      defaultProps: {
+        InputLabelProps: {
+          shrink: !0
+        }
+      },
+      styleOverrides: {
+        root: {
+          "&.Monite-NakedField": {
+            "& .MuiInputBase-root": {
+              minHeight: "32px",
+              padding: 0,
+              "& .MuiInputBase-input": {
+                height: "32px",
+                lineHeight: "32px",
+                padding: 0
+              },
+              "& .MuiOutlinedInput-notchedOutline": {
+                borderStyle: "none"
+              }
+            },
+            "& .MuiFormHelperText-root.Mui-error": {
+              marginLeft: 0
+            }
+          },
+          "&.Monite-AiSearchField": {
+            "& .MuiInputBase-root": {
+              paddingRight: "12px",
+              "& .MuiInputBase-input": {
+                "&::placeholder": {
+                  opacity: 0.88,
+                  fontWeight: 500,
+                  fontSize: "14px",
+                  lineHeight: "16px",
+                  padding: "16px 10px"
+                }
+              },
+              "& .MuiOutlinedInput-notchedOutline": {
+                borderStyle: "none"
+              }
+            }
+          }
+        }
+      }
+    },
+    MuiDrawer: {
+      variants: [{
+        props: {
+          variant: "permanent"
+        },
+        style: {
+          backgroundColor: "menu.background",
+          "& .MuiPaper-root": {
+            backgroundColor: "menu.background",
+            borderRight: 0
+          }
+        }
+      }]
+    },
+    MuiList: {
+      styleOverrides: {
+        root: {
+          "&.NavigationList": {
+            margin: "0px 12px",
+            "& .MuiListItem-root": {
+              marginTop: 8,
+              "& .Mui-selected": {
+                "& span": {
+                  color: "secondary.dark"
+                }
+              }
+            },
+            ".MuiListItemButton-root": {
+              borderRadius: o.borderRadius * 2,
+              padding: "8px 12px"
+            },
+            ".MuiListItemIcon-root": {
+              minWidth: 25
+            },
+            ".MuiListItemIcon-root .MuiSvgIcon-root": {
+              width: "20px",
+              height: "20px",
+              marginRight: "5px"
+            },
+            ".MuiCollapse-root": {
+              marginTop: -8,
+              marginLeft: 12
+            },
+            "& .MuiSvgIcon-root": {
+              color: "secondary.dark",
+              "& > path": {
+                color: "secondary.dark"
+              }
+            }
+          }
+        }
+      }
+    },
+    MuiButtonBase: {
+      defaultProps: {
+        disableRipple: !0
+      }
+    },
+    MuiButton: {
+      styleOverrides: {
+        root: {
+          // Button shouldn't grow inside containers that force it to grow
+          maxHeight: "48px",
+          "&.ThemeSelect": {
+            borderRadius: o.borderRadius
+          },
+          "&.ThemeSelect .ThemeSelect-modeLabel": {
+            display: "flex"
+          },
+          "&.MuiButton-sizeSmall": {
+            fontSize: "14px"
+          },
+          "&.Monite-withShadow, &.Monite-withShadow:hover": {
+            boxShadow: "0px 1px 1px 0px rgba(0, 0, 0, 0.1)"
+          },
+          ".Monite-Payables &.MuiButton-contained:not(.MuiButton-colorError)": {
+            ...p(e?.primary),
+            "&:hover": i("hover", e?.primary),
+            "&:active": i("active", e?.primary),
+            "&:focus": i("focus", e?.primary),
+            "&:disabled": i("disabled", e?.primary)
+          },
+          ".Monite-Payables &.MuiButton-outlined:not(.MuiButton-colorError)": {
+            ...p(e?.secondary),
+            "&:hover": i("hover", e?.secondary),
+            "&:active": i("active", e?.secondary),
+            "&:focus": i("focus", e?.secondary),
+            "&:disabled": i("disabled", e?.secondary)
+          },
+          ".Monite-Payables &.MuiButton-text:not(.MuiButton-colorError)": {
+            ...p(e?.tertiary),
+            "&:hover": i("hover", e?.tertiary),
+            "&:active": i("active", e?.tertiary),
+            "&:focus": i("focus", e?.tertiary),
+            "&:disabled": i("disabled", e?.tertiary)
+          },
+          ".Monite-Payables &.MuiButton-contained.MuiButton-colorError": {
+            ...p(e?.destructive),
+            "&:hover": i("hover", e?.destructive),
+            "&:active": i("active", e?.destructive),
+            "&:focus": i("focus", e?.destructive),
+            "&:disabled": i("disabled", e?.destructive)
+          }
+        },
+        containedPrimary: {
+          padding: ".75em 1.25em",
+          backgroundColor: "primary.main",
+          lineHeight: "1.4",
+          borderRadius: o.buttonBorderRadius,
+          boxShadow: "none",
+          "&:hover": {
+            backgroundColor: "primary.60",
+            borderRadius: o.buttonBorderRadius,
+            boxShadow: "none"
+          },
+          "&:active": {
+            backgroundColor: "primary.dark",
+            borderRadius: o.buttonBorderRadius,
+            boxShadow: "none"
+          },
+          "&:disabled": {
+            color: "neutral.70",
+            backgroundColor: "neutral.90",
+            borderColor: "neutral.90",
+            boxShadow: "none"
+          }
+        },
+        outlinedPrimary: {
+          padding: ".75em 1.25em",
+          color: "primary.30",
+          backgroundColor: "primary.90",
+          border: "none",
+          borderRadius: o.buttonBorderRadius,
+          boxShadow: "none",
+          "&:hover": {
+            backgroundColor: "primary.80",
+            border: "none",
+            boxShadow: "none"
+          },
+          "&:active": {
+            backgroundColor: "primary.70",
+            border: "none",
+            boxShadow: "none"
+          },
+          "&:disabled": {
+            color: "neutral.70",
+            backgroundColor: "neutral.90",
+            border: "none",
+            boxShadow: "none"
+          }
+        },
+        textPrimary: {
+          padding: ".75em 1.25em",
+          color: "primary.30",
+          backgroundColor: "transparent",
+          border: "none",
+          boxShadow: "none",
+          "&:hover": {
+            backgroundColor: "primary.90",
+            border: "none",
+            boxShadow: "none"
+          },
+          "&:active": {
+            backgroundColor: "primary.70",
+            border: "none",
+            boxShadow: "none"
+          },
+          "&:disabled": {
+            color: "neutral.70",
+            backgroundColor: "neutral.90",
+            border: "none",
+            boxShadow: "none"
+          }
+        }
+      }
+    },
+    MuiPopover: {
+      styleOverrides: {
+        paper: {
+          border: "none",
+          width: 240
+        }
+      }
+    },
+    MuiPopper: {
+      defaultProps: {
+        disablePortal: !0
+      }
+    },
+    MuiAvatar: {
+      styleOverrides: {
+        root: {
+          "&.MuiAvatar-colored": {
+            margin: 0,
+            color: "text.primary",
+            fontSize: "16px",
+            fontWeight: 600,
+            lineHeight: "40px",
+            width: "40px",
+            height: "40px",
+            "&.MuiAvatar-0": {
+              backgroundColor: l[0]
+            },
+            "&.MuiAvatar-1": {
+              backgroundColor: l[1]
+            },
+            "&.MuiAvatar-2": {
+              backgroundColor: l[2]
+            },
+            "&.MuiAvatar-3": {
+              backgroundColor: l[3]
+            },
+            "&.MuiAvatar-4": {
+              backgroundColor: l[4]
+            }
+          }
+        }
+      }
+    },
+    MuiChip: {
+      styleOverrides: {
+        root: {
+          backgroundColor: "primary.light",
+          borderRadius: o.borderRadius * 1.33,
+          color: "primary.main",
+          fontSize: "14px",
+          lineHeight: "16px",
+          fontWeight: 500,
+          padding: "7px 8px",
+          "& .MuiChip-avatar": {
+            marginLeft: 0,
+            marginRight: "4px"
+          },
+          gap: 8
+        },
+        label: {
+          padding: "0"
+        },
+        deleteIcon: {
+          margin: "0 -2px 0 6px"
+        }
+      }
+    },
+    MuiDataGrid: {
+      defaultProps: {
+        columnHeaderHeight: 55,
+        rowHeight: 48,
+        density: "standard"
+      },
+      styleOverrides: {
+        root: {
+          color: r.text.primary,
+          backgroundColor: r.background.default,
+          borderTopLeftRadius: 0,
+          borderTopRightRadius: 0,
+          borderWidth: 0,
+          borderBottomLeftRadius: o.borderRadius * 2,
+          borderBottomRightRadius: o.borderRadius * 2,
+          "--DataGrid-rowBorderColor": o.colors.rowBorder,
+          "--DataGrid-containerBackground": o.colors.background,
+          "& .MuiDataGrid-withBorderColor": {
+            borderColor: "divider"
+          },
+          "&.MuiDataGrid-withBorderColor": {
+            borderColor: "divider"
+          },
+          '& div[role="presentation"] + .MuiDataGrid-cell, & div[role="presentation"] + .MuiDataGrid-columnHeader': {
+            borderLeftStyle: "none",
+            borderLeftWidth: "0"
+          }
+        },
+        columnHeader: {
+          overflow: "visible",
+          borderLeftStyle: "solid",
+          borderLeftWidth: "0px",
+          borderLeftColor: "divider",
+          padding: "0 15.5px",
+          background: o.colors.background,
+          "& .MuiDataGrid-columnHeaderTitle": {
+            color: r.text,
+            fontWeight: 600,
+            fontSize: "14px",
+            lineHeight: "17.57px"
+          }
+        },
+        columnSeparator: {
+          border: 0
+        },
+        cell: {
+          '&[role="gridcell"]': {
+            borderLeftStyle: "solid",
+            borderLeftWidth: "0px",
+            borderLeftColor: "divider"
+          },
+          "&.Monite-Cell-Highlight": {
+            color: "neutral.10"
+          },
+          ".MuiDataGrid-cellOffsetLeft + &": {
+            borderLeftStyle: "none",
+            borderLeftWidth: "0"
+          },
+          padding: "0 12px",
+          fontWeight: 400,
+          fontSize: "15px",
+          "& span.Monite-DueDateCell-OverdueDays": {
+            fontSize: "12px"
+          },
+          // Align counterpart avatar with the cell header
+          '&[data-field="counterpart_id"], &[data-field="counterpart_name"], &[data-field="was_created_by_user_id"]': {
+            ".MuiChip-root": {
+              paddingLeft: 0
+            }
+          },
+          '&[data-field="actions"]': {
+            textOverflow: "clip"
+            // Hide ... after action buttons
+          },
+          "& .Monite-TextOverflowContainer": {
+            display: "block",
+            whiteSpace: "nowrap",
+            overflow: "hidden",
+            textOverflow: "ellipsis"
+          },
+          "&:focus": {
+            outline: "none"
+          },
+          "& .MuiChip-label": {
+            fontWeight: 600,
+            fontSize: "13px",
+            letterSpacing: "0.098px"
+          }
+        },
+        footerContainer: {
+          padding: "8px 0",
+          '& .Monite-RowsPerPageSelector div[role="combobox"]': {
+            lineHeight: "40px",
+            fontSize: "13px",
+            color: "text.secondary"
+          },
+          "& .Monite-TablePagination-PreviousPageButton": {
+            padding: "8px",
+            border: "1px solid",
+            borderColor: "neutral.80",
+            borderRadius: "4px",
+            marginRight: "6px"
+          },
+          "& .Monite-TablePagination-NextPageButton": {
+            padding: "8px",
+            border: "1px solid",
+            borderColor: "neutral.80",
+            borderRadius: "4px"
+          }
+        }
+      }
+    },
+    MuiTableHead: {
+      styleOverrides: {
+        root: {
+          "& .MuiTableCell-head": {
+            fontWeight: 500,
+            color: "neutral.50",
+            verticalAlign: "bottom"
+          }
+        }
+      }
+    },
+    MuiTableRow: {
+      styleOverrides: {
+        root: {
+          "&:not(.Monite-CreateReceivable-ItemsSection-Table) .MuiTableCell-root": {
+            borderColor: "neutral.80"
+          },
+          "&.Monite-CreateReceivable-ItemsSection-Table": {
+            ".MuiTableCell-root": {
+              borderBottom: "none",
+              padding: "8px 12px 8px 0",
+              "& .MuiFormControl-root .MuiInputBase-root": {
+                backgroundColor: "#fff"
+              }
+            },
+            "th.MuiTableCell-root": {
+              padding: "0 12px 0 0"
+            },
+            "+ .MuiTableRow-root .MuiTableCell-root": {
+              paddingLeft: 0
+            }
+          },
+          "&:last-child .MuiTableCell-body": {
+            borderBottom: "none"
+          }
+        }
+      }
+    },
+    MuiTabs: {
+      styleOverrides: {
+        root: {
+          borderBottom: "1px solid",
+          borderColor: "neutral.80",
+          minHeight: "unset",
+          "& .MuiTab-root": {
+            backgroundColor: "transparent",
+            color: "text.primary",
+            padding: "16px",
+            minHeight: "unset",
+            boxSizing: "border-box",
+            textTransform: "none",
+            "&:hover": {
+              backgroundColor: "transparent"
+            },
+            "&:active": {
+              backgroundColor: "transparent"
+            }
+          },
+          "& .MuiTab-root.Mui-selected": {
+            backgroundColor: "transparent",
+            color: "text.primary",
+            "&:hover": {
+              backgroundColor: "transparent"
+            },
+            "&:active": {
+              backgroundColor: "transparent"
+            }
+          }
+        },
+        indicator: {
+          borderRadius: 10,
+          backgroundColor: r.primary.main,
+          height: "4px"
+        }
+      }
+    },
+    MuiCard: {
+      styleOverrides: {
+        root: {
+          "&.Monite-SummaryCard": {
+            display: "flex",
+            borderRadius: o.borderRadius * 1.67,
+            //10px
+            backgroundColor: r.background.default,
+            outline: "3px solid",
+            outlineColor: "transparent",
+            border: "1px solid",
+            borderColor: r.neutral[90],
+            transition: "border-color 0.1s ease-in-out, outline-color 0.2s ease-in-out",
+            boxShadow: "none"
+          },
+          "&.Monite-SummaryCard-selected, &.Monite-SummaryCard:hover, &.Monite-SummaryCard:active, &.Monite-SummaryCard:focus": {
+            borderColor: r.primary.main,
+            borderWidth: "1px",
+            outlineColor: r.primary[80]
+          },
+          "&.Monite-SummaryCard-all": {
+            minWidth: "118px"
+          }
+        }
+      }
+    },
+    MuiCardContent: {
+      styleOverrides: {
+        root: {
+          padding: "24px 32px"
+        }
+      }
+    },
+    MuiPaper: {
+      styleOverrides: {
+        root: {
+          backgroundImage: "none",
+          borderRadius: o.borderRadius * 2.67,
+          borderColor: "neutral.80"
+        },
+        elevation: {
+          "&.MuiTableContainer-root": {
+            boxShadow: "none"
+          }
+        },
+        rounded: {
+          "&.Monite-PayableDetailsForm-Items": {
+            // Align delete button with the editor
+            'button[aria-label="delete"]': {
+              width: "40px",
+              height: "40px",
+              marginTop: "24px",
+              svg: {
+                width: "20px",
+                height: "auto"
+              }
+            },
+            // Align total with the editor right side
+            ".Monite-PayableDetailsForm-Item .Monite-PayableDetailsForm-Item-Total": {
+              marginRight: "10.8%"
+            }
+          }
+        }
+      }
+    },
+    MuiDialog: {
+      styleOverrides: {
+        root: {
+          backgroundImage: "none"
+        }
+      },
+      defaultProps: {
+        classes: {
+          container: "Monite-Payables",
+          paper: "Monite-Payables"
+        }
+      }
+    },
+    MuiDialogActions: {
+      styleOverrides: {
+        root: {
+          padding: "1em 1.5em"
+        }
+      }
+    },
+    MuiDialogTitle: {
+      styleOverrides: {
+        root: {
+          "&.MuiTypography-h6": {
+            padding: "12px 24px",
+            ".MuiToolbar-root": {
+              padding: "0 0 0 16px"
+            }
+          }
+        }
+      }
+    },
+    MuiDialogContent: {
+      styleOverrides: {
+        root: {
+          margin: 0,
+          padding: "24px 32px 40px",
+          "> form": {
+            maxWidth: "min(940px, 100%)",
+            margin: "0 auto"
+          }
+        }
+      }
+    },
+    MuiFormHelperText: {
+      styleOverrides: {
+        root: {
+          fontSize: "12px",
+          maxWidth: "100%",
+          overflow: "hidden",
+          textOverflow: "ellipsis"
+        }
+      }
+    },
+    MuiSwitch: {
+      styleOverrides: {
+        root: {
+          width: "55px",
+          height: "40px",
+          "& > .MuiButtonBase-root.Mui-checked": {
+            left: "-10px"
+          },
+          "& > .MuiSwitch-track": {
+            height: "20px",
+            position: "relative",
+            bottom: "3px",
+            width: "40px",
+            left: "-2px",
+            borderRadius: "12px"
+          },
+          "& > .MuiSwitch-switchBase.Mui-checked": {
+            transform: "translateX(25px)",
+            "&::after": {
+              content: '""',
+              position: "absolute",
+              top: "12px",
+              left: "11px",
+              width: "16px",
+              height: "16px",
+              color: "#fff",
+              backgroundImage: `url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='${encodeURIComponent("#fff")}'><path d='M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>")`,
+              backgroundSize: "contain",
+              backgroundRepeat: "no-repeat"
+            }
+          },
+          "& > .MuiSwitch-switchBase.Mui-checked + .MuiSwitch-track": {
+            background: "rgba(203, 203, 254, 1)",
+            opacity: 1
+          },
+          "& > .MuiSwitch-input": {
+            left: 0
+          }
+        }
+      }
+    },
+    MoniteTablePagination: {
+      defaultProps: {
+        paginationLayout: "default"
+      },
+      styleOverrides: {
+        root: {}
+      }
+    },
+    MoniteApprovalRequestStatusChip: {
+      defaultProps: {
+        icon: o.components.approvalRequestStatusChip.icon,
+        size: o.components.approvalRequestStatusChip.size,
+        variant: o.components.approvalRequestStatusChip.variant
+      }
+    },
+    MoniteInvoiceRecurrenceStatusChip: {
+      defaultProps: {
+        icon: o.components.invoiceRecurrenceStatusChip.icon,
+        size: o.components.invoiceRecurrenceStatusChip.size,
+        variant: o.components.invoiceRecurrenceStatusChip.variant
+      }
+    },
+    MoniteInvoiceRecurrenceIterationStatusChip: {
+      defaultProps: {
+        icon: o.components.invoiceRecurrenceIterationStatusChip.icon,
+        size: o.components.invoiceRecurrenceIterationStatusChip.size,
+        variant: o.components.invoiceRecurrenceIterationStatusChip.variant
+      }
+    },
+    MoniteInvoiceStatusChip: {
+      defaultProps: {
+        icon: o.components.invoiceStatusChip.icon,
+        size: o.components.invoiceStatusChip.size,
+        variant: o.components.invoiceStatusChip.variant
+      },
+      styleOverrides: {
+        root: {
+          fontSize: "13px"
+        }
+      },
+      variants: [{
+        props: {
+          status: "draft"
+        },
+        style: t.black
+      }, {
+        props: {
+          status: "issued"
+        },
+        style: t.blue
+      }, {
+        props: {
+          status: "accepted"
+        },
+        style: t.green
+      }, {
+        props: {
+          status: "expired"
+        },
+        style: t.red
+      }, {
+        props: {
+          status: "declined"
+        },
+        style: t.red
+      }, {
+        props: {
+          status: "recurring"
+        },
+        style: t.green
+      }, {
+        props: {
+          status: "partially_paid"
+        },
+        style: t.violet
+      }, {
+        props: {
+          status: "paid"
+        },
+        style: t.green
+      }, {
+        props: {
+          status: "overdue"
+        },
+        style: t.orange
+      }, {
+        props: {
+          status: "uncollectible"
+        },
+        style: t.red
+      }, {
+        props: {
+          status: "canceled"
+        },
+        style: t.orange
+      }, {
+        props: {
+          status: "deleted"
+        },
+        style: t.black
+      }]
+    },
+    MonitePayableStatusChip: {
+      defaultProps: {
+        icon: o.components.payableStatusChip.icon,
+        size: o.components.payableStatusChip.size,
+        variant: o.components.payableStatusChip.variant,
+        colors: o.components.payableStatusChip.colors
+      },
+      styleOverrides: {
+        root: {
+          fontSize: "13px"
+        }
+      },
+      variants: [{
+        props: {
+          status: "draft"
+        },
+        style: t.black
+      }, {
+        props: {
+          status: "new"
+        },
+        style: t.blue
+      }, {
+        props: {
+          status: "approve_in_progress"
+        },
+        style: t.orange
+      }, {
+        props: {
+          status: "waiting_to_be_paid"
+        },
+        style: t.blue
+      }, {
+        props: {
+          status: "partially_paid"
+        },
+        style: t.violet
+      }, {
+        props: {
+          status: "paid"
+        },
+        style: t.green
+      }, {
+        props: {
+          status: "canceled"
+        },
+        style: t.orange
+      }, {
+        props: {
+          status: "rejected"
+        },
+        style: t.red
+      }]
+    },
+    MoniteCounterpartStatusChip: {
+      defaultProps: {},
+      styleOverrides: {
+        root: {
+          height: "24px",
+          padding: "7px 8px",
+          backgroundColor: "transparent",
+          color: "text.primary",
+          borderColor: "neutral.80"
+        }
+      }
+    }
+  }, m = c(h, r), y = {
+    spacing: o.spacing,
+    palette: {
+      ...r,
+      status: n
+    },
+    shape: {
+      borderRadius: o.borderRadius
+    },
+    typography: b,
+    components: m
+  };
+  return Object.assign(y, {
+    customStyles: o.components?.styles
+  });
+};
 export {
-  o as Textarea
+  q as getTheme
 };