@tesouro/embedded-components-react 0.2.286 → 0.2.289

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

@@ -1,206 +1,36 @@
-import { ScopedCssBaselineContainerClassName as e } from "./index31.js";
-import { useMoniteContext as t } from "./index47.js";
-import { useCurrencies as n } from "./index63.js";
-import { useGetReceivableById as r } from "./index137.js";
-import { useAutosizeGridColumns as i } from "./index182.js";
-import { Dialog as a } from "./index201.js";
-import "./index202.js";
-import { MoniteScopedProviders as o } from "./index209.js";
-import { GetNoRowsOverlay as s } from "./index235.js";
-import { TablePagination as c } from "./index331.js";
-import { classNames as l } from "./index333.js";
-import { ReceivableCursorFields as u } from "./index438.js";
-import { useKanmonContext as d } from "./index556.js";
-import { useGetFinancedInvoices as f } from "./index559.js";
-import "./index560.js";
-import { FinancedInvoiceStatusChip as p } from "./index563.js";
-import { FinanceDetails as m } from "./index564.js";
-import { useMemo as h, useState as g } from "react";
-import { jsx as _, jsxs as v } from "@emotion/react/jsx-runtime";
-import { Box as y, Button as b, Typography as x } from "@mui/material";
-import { useLingui as S } from "@lingui/react";
-import { DataGrid as C } from "@mui/x-data-grid";
+import { BACKGROUND_FINANCE_STATUS_MUI_MAP as e, FINANCE_INVOICE_STATUS_TO_MUI_ICON_MAP as t, ROW_TO_TAG_FINANCE_STATUS_MUI_MAP as n } from "./index19.js";
+import { getCommonStatusLabel as r } from "./index564.js";
+import { jsx as i } from "@emotion/react/jsx-runtime";
+import { Chip as a } from "@mui/material";
+import { useLingui as o } from "@lingui/react";
+import s from "@mui/icons-material/Circle";
+import { styled as c, useThemeProps as l } from "@mui/material/styles";
 //#region ../../libs/tesouro-embedded-components-react/monite-sdk/dist/index565.js
-var w = (e) => /* @__PURE__ */ _(o, { children: /* @__PURE__ */ _(T, { ...e }) }), T = ({ onRowClick: o, query: w, offers: T }) => {
-	let { i18n: E } = S(), { locale: D, componentSettings: O } = t(), { startFinanceSession: k } = d(), [A, j] = g(!1), [M, N] = g(null), { data: P } = r(M?.invoice_id ?? "", !!M?.invoice_id), [F, I] = g(void 0), [L, R] = g(O.receivables.pageSizeOptions?.[0] ?? 10), [z, B] = g({
-		field: w?.sort ?? "created_at",
-		sort: w?.order ?? "desc"
-	}), { formatCurrencyToDisplay: V } = n(), { data: H, isLoading: U, isError: W, refetch: G } = f({
-		order: z?.sort,
-		limit: L,
-		pagination_token: F
-	}), K = H?.data, q = (e) => {
-		B(e[0]), I(void 0);
-	}, J = D.dateFormat, Y = h(() => [
-		{
-			field: "document_id",
-			headerName: E._("Number"),
-			sortable: !1,
-			width: 140,
-			renderCell: ({ value: e }) => e ? /* @__PURE__ */ _("span", {
-				className: "Monite-TextOverflowContainer",
-				children: e
-			}) : /* @__PURE__ */ _("span", {
-				className: "Monite-TextOverflowContainer",
-				children: /* @__PURE__ */ _(x, {
-					color: "text.secondary",
-					component: "span",
-					fontSize: "inherit",
-					children: E._("INV-auto")
-				})
-			})
-		},
-		{
-			field: "payer_type",
-			headerName: E._("Customer"),
-			display: "flex",
-			width: 250,
-			renderCell: (e) => /* @__PURE__ */ _(x, { children: e.row.payer_type == "BUSINESS" ? e.row.payer_business_name : `${e.row.payer_first_name} ${e.row.payer_last_name}` })
-		},
-		{
-			field: "status",
-			headerName: E._("Status"),
-			sortable: u.includes("status"),
-			width: 160,
-			renderCell: ({ value: e }) => /* @__PURE__ */ _(p, {
-				icon: !0,
-				status: e
-			})
-		},
-		{
-			field: "total_amount",
-			headerName: E._("Amount due"),
-			headerAlign: "right",
-			align: "right",
-			width: 120,
-			valueGetter: (e, t) => {
-				let n = t.repayment_schedule?.repayment_amount;
-				return n ? V(n, t.currency) : "-";
-			}
-		},
-		{
-			field: "repayment_schedule",
-			headerName: E._("Loan sum"),
-			headerAlign: "right",
-			align: "right",
-			width: 120,
-			valueGetter: (e, t) => {
-				let n = t.repayment_schedule?.repayment_principal_amount;
-				return n ? V(n, t.currency) : "-";
-			}
-		},
-		{
-			field: "issue_date",
-			headerName: E._("Financing date"),
-			sortable: !1,
-			width: 140,
-			valueFormatter: (e) => e ? E.date(e, J) : "—"
-		},
-		{
-			field: "repayment_date",
-			headerName: E._("Repayment date"),
-			sortable: !1,
-			width: 120,
-			valueGetter: (e, t) => {
-				let n = t.repayment_schedule?.repayment_date;
-				return n ? E.date(n, J) : "-";
-			}
-		},
-		{
-			field: "",
-			headerName: E._("Payment"),
-			sortable: !1,
-			width: 120,
-			renderCell: (e) => e.row.status === "FUNDED" || e.row.status === "LATE" ? /* @__PURE__ */ _(b, {
-				variant: "contained",
-				color: "primary",
-				onClick: (e) => {
-					e.stopPropagation(), k({ component: "PAY_NOW" });
-				},
-				sx: {
-					py: 1.25,
-					px: 1.5,
-					height: 32,
-					fontSize: 14
-				},
-				children: E._("Repay now")
-			}) : null
-		}
-	], [
-		V,
-		E,
-		J,
-		k
-	]), X = i(K, Y, !1, "FinancedInvoicesTable");
-	return /* @__PURE__ */ v(y, {
-		className: l(e, "Monite-FinancedInvoicesTable"),
+var u = ({ ref: a, ...c }) => {
+	let { status: u, variant: f, icon: p, size: m } = l({
+		props: c,
+		name: "MoniteFinancedInvoiceStatusChip"
+	}), { i18n: h } = o(), g = t[u];
+	return /* @__PURE__ */ i(d, {
+		ref: a,
 		sx: {
-			display: "flex",
-			flexDirection: "column",
-			overflow: "hidden",
-			height: "inherit",
-			minHeight: "500px"
-		},
-		children: [
-			/* @__PURE__ */ _(x, {
-				mb: 2,
-				variant: "subtitle1",
-				children: E._("Financed invoices")
-			}),
-			/* @__PURE__ */ _(C, {
-				apiRef: X,
-				rowSelection: !1,
-				disableColumnFilter: !0,
-				loading: U,
-				onSortModelChange: q,
-				onRowClick: (e) => {
-					j(!0), N?.(e.row);
-				},
-				slots: {
-					pagination: () => /* @__PURE__ */ _(c, {
-						pageSizeOptions: O.receivables.pageSizeOptions,
-						nextPage: H?.next_pagination_token,
-						prevPage: H?.prev_pagination_token,
-						paginationModel: {
-							pageSize: L,
-							page: F
-						},
-						onPaginationModelChange: ({ page: e, pageSize: t }) => {
-							R(t), I(e ?? void 0);
-						}
-					}),
-					noRowsOverlay: () => /* @__PURE__ */ _(s, {
-						isLoading: U,
-						dataLength: K?.length || 0,
-						isFiltering: !1,
-						isSearching: !1,
-						isError: W,
-						refetch: G,
-						entityName: E._("Financed Invoices"),
-						actionOptions: [E._("Invoice")],
-						type: "no-data"
-					})
-				},
-				columns: Y,
-				getRowId: (e) => e.document_id,
-				rows: K ?? []
-			}),
-			P && M && /* @__PURE__ */ _(a, {
-				open: A,
-				onClose: () => {
-					j(!1), N(null);
-				},
-				alignDialog: "right",
-				children: /* @__PURE__ */ _(m, {
-					invoice: P,
-					offers: T ?? [],
-					financedInvoice: M,
-					enableNavigate: !0,
-					handleNavigate: o
-				})
-			})
-		]
+			width: "auto",
+			color: n[u],
+			bgcolor: e[u]
+		},
+		icon: p && g ? /* @__PURE__ */ i(g, { sx: {
+			fontSize: 16,
+			fill: n[u]
+		} }) : /* @__PURE__ */ i(s, { sx: { fontSize: "10px !important" } }),
+		label: r(h, u),
+		size: m,
+		status: u,
+		variant: f ?? "filled"
 	});
-};
+}, d = c(a, {
+	name: "MoniteFinancedInvoiceStatusChip",
+	slot: "root",
+	shouldForwardProp: () => !0
+})({});
 //#endregion
-export { w as FinancedInvoicesTable };
+export { u as FinancedInvoiceStatusChip };

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

@@ -1,102 +1,185 @@
 import { useMoniteContext as e } from "./index47.js";
-import { jsx as t, jsxs as n } from "@emotion/react/jsx-runtime";
-import { Box as r, List as i, ListItem as a, Typography as o } from "@mui/material";
-import { useLingui as s } from "@lingui/react";
+import { useCurrencies as t } from "./index63.js";
+import "./index189.js";
+import { InvoiceStatusChip as n } from "./index228.js";
+import "./index436.js";
+import { useKanmonContext as r } from "./index558.js";
+import { FinancedInvoiceStatusChip as i } from "./index565.js";
+import { Fragment as a, jsx as o, jsxs as s } from "@emotion/react/jsx-runtime";
+import { Box as c, Button as l, Divider as u, Typography as d, darken as f, useTheme as p } from "@mui/material";
+import { useLingui as m } from "@lingui/react";
 //#region ../../libs/tesouro-embedded-components-react/monite-sdk/dist/index566.js
-var c = () => {
-	let { i18n: c } = s(), { componentSettings: l } = e(), u = [
-		{
-			id: 1,
-			title: c._("Create an invoice:"),
-			description: c._("If you applied for accounts receivable financing, issue an invoice and deliver it to your customer via email or any other channel."),
-			description2: c._("Or if you applied for accounts payable financing, upload/select the uploaded invoice you've received from your vendor."),
-			list: {
-				listTitle: c._("Invoices cannot be financed if:"),
-				listItems: [
-					{
-						id: "listItem-1",
-						text: c._("- they are due within 7 days.")
-					},
-					{
-						id: "listItem-2",
-						text: c._("- they are already overdue.")
-					},
-					{
-						id: "listItem-3",
-						text: c._("- the loan sum exceeds your remaining limit.")
-					}
-				]
-			}
-		},
-		{
-			id: 2,
-			title: c._("Select 'Get Paid Now':"),
-			description: c._("Access funding through the invoice list, within the invoice details, or the 'My Financing' tab. If approved, you will receive the invoice amount instantly, minus the fee associated with the payment offer chosen.")
+var h = ({ invoice: h, offers: g, financedInvoice: _, enableNavigate: v = !1, handleNavigate: y }) => {
+	let { i18n: b } = m(), { locale: x } = e(), { startFinanceSession: S } = r(), { formatCurrencyToDisplay: C } = t(), w = p(), T = x.dateFormat, E = _ ? b.date(_.issue_date, T) : "—", D = _ ? C(_.total_amount, _.currency) : "-", O = g?.[0]?.pricing_plans?.reduce((e, t, n) => (t?.fee_percentage === _?.fee_percentage && t?.advance_rate_percentage === _?.advance_rate_percentage && (e = {
+		pricingPlanIndex: n,
+		data: t
+	}), e), null), k = _?.repayment_schedule?.repayment_date ? b.date(_.repayment_schedule.repayment_date, T) : "—", A = _?.advance_amount ? C(_.advance_amount, _.currency) : "-", j = _?.fee_amount ? C(_.fee_amount, _.currency) : "-", M = _?.repayment_amount ? C(_.repayment_amount, _.currency) : "-", N = _?.status === "REJECTED" || _?.status === "NEW", P = _?.status === "FUNDED" || _?.status === "LATE";
+	return /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ s(c, {
+		sx: {
+			p: 4,
+			display: "flex",
+			flexDirection: "column",
+			gap: 4
 		},
-		{
-			id: 3,
-			title: c._("Pay out the financed sum:"),
-			description: c._("The full sum will be withdrawn from your bank account automatically on the date specified in the selected offer. You can also pay out the sum earlier via the 'Pay out' button.")
-		}
-	], d = l?.financing?.financeSteps ?? u;
-	return /* @__PURE__ */ n(r, {
-		px: 4,
-		py: 5,
-		children: [/* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(o, {
-			variant: "h3",
-			children: c._("How does invoice financing work?")
-		}) }), /* @__PURE__ */ t(i, {
-			sx: {
-				mt: 4,
-				display: "flex",
-				flexDirection: "column",
-				gap: 3,
-				p: 0,
-				pl: 2
-			},
-			component: "ul",
-			children: d.map((e) => /* @__PURE__ */ n(a, {
-				component: "li",
+		children: [
+			/* @__PURE__ */ o(d, {
+				variant: "h3",
+				children: b._("Funding details")
+			}),
+			/* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(d, {
+				variant: "h2",
+				fontWeight: 600,
+				fontSize: 32,
+				children: D
+			}), /* @__PURE__ */ o(d, {
+				fontWeight: 500,
+				variant: "body1",
+				children: b._("{issueDate}", { issueDate: E })
+			})] }),
+			/* @__PURE__ */ s(c, {
 				sx: {
-					p: 0,
-					display: "list-item",
-					listStyleType: "disc",
-					maxWidth: 472,
-					mx: "auto"
+					display: "flex",
+					gap: 3
 				},
 				children: [
-					/* @__PURE__ */ n(o, {
-						variant: "body1",
-						fontWeight: 400,
-						mb: e.list || e.description2 ? 3 : 0,
-						children: [/* @__PURE__ */ n(o, {
-							component: "span",
+					/* @__PURE__ */ s(c, {
+						width: "100%",
+						children: [/* @__PURE__ */ o(d, {
 							variant: "body1",
-							fontWeight: 600,
-							children: [e.title, " "]
-						}), e.description]
+							color: f(w.palette.grey[50], .4),
+							mb: .5,
+							fontWeight: 400,
+							children: b._("Financing plan {value}", { value: (O?.pricingPlanIndex ?? 0) + 1 })
+						}), /* @__PURE__ */ o(d, {
+							variant: "body1",
+							fontWeight: 400,
+							children: b._("{value}% advance rate, Pay in {pricingPlan} days, {value1}% fee", {
+								value: (O?.data?.advance_rate_percentage ?? 0) / 100,
+								pricingPlan: O?.data?.repayment_duration_days,
+								value1: (O?.data?.fee_percentage ?? 0) / 100
+							})
+						})]
 					}),
-					e.description2 && /* @__PURE__ */ t(o, {
-						variant: "body1",
-						fontWeight: 400,
-						mb: e.list ? 3 : 0,
-						children: e.description2
+					/* @__PURE__ */ s(c, {
+						width: "100%",
+						children: [/* @__PURE__ */ o(d, {
+							variant: "body1",
+							color: f(w.palette.grey[50], .4),
+							mb: .5,
+							fontWeight: 400,
+							children: b._("Repayment on")
+						}), /* @__PURE__ */ o(d, {
+							variant: "body1",
+							fontWeight: 400,
+							children: b._("{repaymentDate}", { repaymentDate: k })
+						})]
 					}),
-					e.list && /* @__PURE__ */ n(o, {
-						variant: "body1",
-						fontWeight: 600,
-						children: [e.list.listTitle, e.list.listItems.map((e) => /* @__PURE__ */ t(o, {
+					/* @__PURE__ */ s(c, {
+						width: "100%",
+						children: [/* @__PURE__ */ o(d, {
 							variant: "body1",
-							component: "span",
-							display: "block",
+							color: f(w.palette.grey[50], .4),
+							mb: .5,
 							fontWeight: 400,
-							children: e.text
-						}, e.id))]
+							children: b._("Status")
+						}), /* @__PURE__ */ o(i, {
+							icon: !0,
+							status: _?.status ?? "DEFAULTED"
+						})]
+					})
+				]
+			}),
+			/* @__PURE__ */ o(u, {}),
+			/* @__PURE__ */ s(c, {
+				sx: {
+					display: "grid",
+					gridTemplateColumns: "minmax(140px, auto) 1fr",
+					flexDirection: "column",
+					rowGap: 1,
+					columnGap: 2
+				},
+				children: [
+					/* @__PURE__ */ o(d, {
+						variant: "body1",
+						color: f(w.palette.grey[50], .4),
+						children: b._("{isRequestedSum}", { isRequestedSum: N ? "Requested sum" : "Received sum" })
+					}),
+					/* @__PURE__ */ o(d, {
+						variant: "body1",
+						children: A
+					}),
+					/* @__PURE__ */ o(d, {
+						variant: "body1",
+						color: f(w.palette.grey[50], .4),
+						children: b._("Service Fee")
+					}),
+					/* @__PURE__ */ o(d, {
+						variant: "body1",
+						children: j
+					}),
+					/* @__PURE__ */ o(d, {
+						variant: "body1",
+						color: f(w.palette.grey[50], .4),
+						children: b._("Repayment sum")
+					}),
+					/* @__PURE__ */ o(d, {
+						variant: "body1",
+						children: M
 					})
 				]
-			}, e.id))
-		})]
-	});
+			}),
+			/* @__PURE__ */ o(u, {}),
+			/* @__PURE__ */ s(c, {
+				sx: {
+					borderRadius: "16px",
+					px: 3,
+					py: 2.5,
+					border: `1px solid ${w.palette.divider}`,
+					display: "flex",
+					gap: 2,
+					justifyContent: "space-between",
+					alignItems: "center",
+					cursor: v ? "pointer" : "default"
+				},
+				...v && y && { onClick: () => y(h.id) },
+				children: [/* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(d, {
+					variant: "body1",
+					fontWeight: 500,
+					children: b._("Invoice {invoiceDocument_id}", { invoiceDocument_id: h.document_id || "INV-auto" })
+				}), /* @__PURE__ */ o(d, {
+					color: w.palette.text.secondary,
+					variant: "body2",
+					children: b._("For {invoiceAmount} | Issued {issueDate}", {
+						invoiceAmount: D,
+						issueDate: E
+					})
+				})] }), /* @__PURE__ */ o(c, { children: /* @__PURE__ */ o(n, { status: h.status }) })]
+			})
+		]
+	}), P && /* @__PURE__ */ o(c, {
+		sx: {
+			mt: "auto",
+			borderTop: `1px solid ${w.palette.divider}`,
+			px: 4,
+			py: 2,
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "flex-end"
+		},
+		children: /* @__PURE__ */ o(l, {
+			variant: "contained",
+			color: "primary",
+			onClick: () => S({ component: "PAY_NOW" }),
+			sx: {
+				py: 1.25,
+				px: 1.5,
+				height: 32,
+				fontSize: 14,
+				ml: "auto"
+			},
+			children: b._("Repay now")
+		})
+	})] });
 };
 //#endregion
-export { c as FinanceHowItWorks };
+export { h as FinanceDetails };