@tesouro/embedded-components-react 0.2.107 → 0.2.108

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

@@ -1,1273 +1,199 @@
-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 "./index196.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;
+import { formatFilterChipMultiSelectValueSegment as y } from "./index97.js";
+import { useMoniteContext as g } from "./index57.js";
+import { useCurrencies as N } from "./index58.js";
+import { toMinorUnits as C } from "./index180.js";
+import { useState as $, useMemo as l, useCallback as n } from "react";
+import { formatISO as m } from "date-fns";
+import { DATE_PRESETS as d, resolveDatePreset as k } from "./index308.js";
+const p = [{
+  value: "draft",
+  label: "Draft",
+  description: "Created but not yet sent"
+}, {
+  value: "issued",
+  label: "Issued",
+  description: ""
+}, {
+  value: "overdue",
+  label: "Overdue",
+  description: "Past due date"
+}, {
+  value: "partially_paid",
+  label: "Partially paid",
+  description: "Some payment received"
+}, {
+  value: "paid",
+  label: "Paid",
+  description: "Fully paid"
+}, {
+  value: "uncollectible",
+  label: "Uncollectible",
+  description: ""
+}, {
+  value: "canceled",
+  label: "Canceled",
+  description: ""
+}, {
+  value: "recurring",
+  label: "Recurring",
+  description: ""
+}], P = ["draft", "issued", "overdue", "partially_paid", "paid", "uncollectible"], T = {
+  due_date: "Due date",
+  created_at: "Created on",
+  issue_date: "Issue date"
+};
+function _() {
+  return {
+    search: "",
+    activeDateFields: {},
+    status: [],
+    amountMode: "any",
+    amountMin: "",
+    amountMax: "",
+    customerName: ""
+  };
 }
-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"
+function j() {
+  const [a, i] = $(_), {
+    formatToMinorUnits: u
+  } = N(), {
+    componentSettings: f
+  } = g(), c = f.onboarding.allowedCurrencies?.[0] ?? "USD", v = l(() => {
+    const e = {};
+    for (const [t, s] of Object.entries(a.activeDateFields))
+      s?.from && (e[`${t}__gte`] = m(s.from, {
+        representation: "date"
+      })), s?.to && (e[`${t}__lte`] = m(s.to, {
+        representation: "date"
+      }));
+    if (a.status.length ? e.status__in = a.status : e.status__in = P, a.customerName && (e.counterpart_name__icontains = a.customerName), a.search && (e.search_text = a.search), a.amountMode !== "any") {
+      const t = parseFloat(a.amountMin), s = parseFloat(a.amountMax), o = (r) => u(r, c) ?? C(r, 2);
+      if (a.amountMode === "exact") {
+        if (!isNaN(t)) {
+          const r = o(t);
+          e.total_amount__gte = r, e.total_amount__lte = r;
+        }
+      } else
+        isNaN(t) || (e.total_amount__gte = o(t)), isNaN(s) || (e.total_amount__lte = o(s));
     }
-  }, 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
+    return e;
+  }, [a, c, u]), b = l(() => {
+    let e = 0;
+    return Object.values(a.activeDateFields).some((t) => t?.from || t?.to || t?.preset) && e++, a.status.length && e++, a.customerName && e++, a.amountMode !== "any" && e++, a.search && e++, e;
+  }, [a]), h = l(() => {
+    const e = [];
+    for (const [t, s] of Object.entries(a.activeDateFields))
+      if (s?.from || s?.to || s?.preset) {
+        const o = s.preset ? d.find((r) => r.value === s.preset)?.label ?? "Custom range" : "Custom range";
+        e.push({
+          key: `date_${t}`,
+          label: `${T[t]}: ${o}`
+        });
+      }
+    if (a.status.length) {
+      const t = a.status.map((s) => p.find((o) => o.value === s)?.label ?? s);
+      e.push({
+        key: "status",
+        label: `Status: ${y(t)}`
+      });
     }
-  }, 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: {
+    return a.customerName && e.push({
+      key: "customer",
+      label: `Customer: ${a.customerName}`
+    }), a.amountMode !== "any" && e.push({
+      key: "amount",
+      label: "Amount"
+    }), a.search && e.push({
+      key: "search",
+      label: `Search: ${a.search}`
+    }), e;
+  }, [a]), F = n((e, t) => {
+    const {
+      from: s,
+      to: o
+    } = k(t);
+    i((r) => ({
       ...r,
-      status: n
-    },
-    shape: {
-      borderRadius: o.borderRadius
-    },
-    typography: b,
-    components: m
+      activeDateFields: {
+        ...r.activeDateFields,
+        [e]: {
+          preset: t,
+          from: s,
+          to: o
+        }
+      }
+    }));
+  }, []), D = n((e, t, s) => {
+    i((o) => ({
+      ...o,
+      activeDateFields: {
+        ...o.activeDateFields,
+        [e]: {
+          preset: void 0,
+          from: t,
+          to: s
+        }
+      }
+    }));
+  }, []), S = n((e) => {
+    if (e.startsWith("date_")) {
+      const t = e.slice(5);
+      i((s) => {
+        const o = {
+          ...s.activeDateFields
+        };
+        return delete o[t], {
+          ...s,
+          activeDateFields: o
+        };
+      });
+      return;
+    }
+    switch (e) {
+      case "status":
+        i((t) => ({
+          ...t,
+          status: []
+        }));
+        break;
+      case "customer":
+        i((t) => ({
+          ...t,
+          customerName: ""
+        }));
+        break;
+      case "amount":
+        i((t) => ({
+          ...t,
+          amountMode: "any",
+          amountMin: "",
+          amountMax: ""
+        }));
+        break;
+      case "search":
+        i((t) => ({
+          ...t,
+          search: ""
+        }));
+        break;
+    }
+  }, []), M = n(() => i(_()), []);
+  return {
+    state: a,
+    setState: i,
+    queryParams: v,
+    activeFilterCount: b,
+    activeChips: h,
+    datePresets: d,
+    statusOptions: p,
+    setDateFieldPreset: F,
+    setDateFieldRange: D,
+    clearFilter: S,
+    clearAll: M
   };
-  return Object.assign(y, {
-    customStyles: o.components?.styles
-  });
-};
+}
 export {
-  q as getTheme
+  P as AR_DEFAULT_STATUSES,
+  p as AR_STATUS_OPTIONS,
+  j as useInvoicesFilter
 };