@tesouro/embedded-components-react 0.5.268 → 0.5.271

package/dist/libs/tesouro-embedded-components-react/invoicing-widget/ui/dist/index52.js

@@ -1,194 +1,249 @@
-import { Button as e, DataTable as t, Skeleton as n, Tooltip as r, TooltipContent as i, TooltipProvider as a, TooltipTrigger as o } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
-import { EmptyState as s } from "../../../shared/ui/dist/lib/EmptyState/EmptyState.js";
-import { ErrorState as c } from "../../../shared/ui/dist/lib/ErrorState/ErrorState.js";
-import "../../../shared/ui/dist/index.js";
-import { RECEIVABLES_SCREEN_LABELS_EN as l } from "./index13.js";
-import { ReceivableStatusBadge as u } from "./index22.js";
-import { ReceivableStatusCards as d } from "./index51.js";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
-import { ArrowDownIcon as m, ArrowUpDownIcon as h, ArrowUpIcon as g, CogIcon as _, LockKeyholeIcon as v } from "lucide-react";
+import { Button as e, Input as t, Label as n, RadioGroup as r, RadioGroupItem as i, Switch as a, Typography as o } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import { RECEIVABLE_FORM_DIALOG_LABELS_EN as s } from "./index13.js";
+import { Fragment as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+import { PlusIcon as f } from "lucide-react";
 //#region ../../libs/tesouro-embedded-components-react/invoicing-widget/ui/dist/index52.js
-var y = [
-	10,
-	25,
-	50,
-	100
-];
-function b({ label: t, ariaLabel: n, column: r }) {
-	let i = r.getIsSorted();
-	return /* @__PURE__ */ p("div", {
-		className: "ttw:flex ttw:items-center ttw:gap-2 ttw:text-inherit",
-		children: [t, /* @__PURE__ */ f(e, {
-			variant: "ghost",
-			size: "icon-sm",
-			"aria-label": n,
-			onClick: () => r.toggleSorting(i === "asc"),
-			children: f(i === "asc" ? g : i === "desc" ? m : h, { className: "ttw:size-4" })
+function p(e) {
+	e.key === "Enter" && e.preventDefault();
+}
+var m = "ttw:border ttw:border-border ttw:rounded-lg ttw:min-h-28 ttw:p-2.5 ttw:flex ttw:w-full ttw:flex-col ttw:gap-4 ttw:xl:w-1/2";
+function h({ id: e, value: t, label: r }) {
+	return /* @__PURE__ */ d("li", {
+		className: "ttw:flex ttw:items-center ttw:gap-2",
+		children: [/* @__PURE__ */ u(i, {
+			value: t,
+			id: e
+		}), /* @__PURE__ */ u(n, {
+			htmlFor: e,
+			className: "ttw:text-sm ttw:font-normal ttw:leading-snug",
+			children: r
 		})]
 	});
 }
-function x({ row: e }) {
-	return e.customerState === "resolving" ? /* @__PURE__ */ f(n, { className: "ttw:h-4 ttw:w-full" }) : e.customerState === "missing" ? /* @__PURE__ */ f("span", {
-		className: "ttw:opacity-40",
-		children: e.customerLabel
-	}) : /* @__PURE__ */ f("span", { children: e.customerLabel });
+function g({ idPrefix: e, options: t, selectedId: n, noneLabel: i, onSelect: a }) {
+	return /* @__PURE__ */ u(r, {
+		className: "ttw:contents",
+		value: n,
+		onValueChange: a,
+		children: /* @__PURE__ */ d("ul", {
+			className: "ttw:flex ttw:flex-col ttw:gap-3",
+			children: [/* @__PURE__ */ u(h, {
+				id: `${e}-none`,
+				value: "",
+				label: i
+			}), t.map((t) => /* @__PURE__ */ u(h, {
+				id: `${e}-${t.value}`,
+				value: t.value,
+				label: t.label
+			}, t.value))]
+		})
+	});
 }
-function S({ rows: n, isLoading: m, isError: h, isAccessRestricted: g, sorting: S, onSortingChange: C, pageSize: w, onPageSizeChange: T, pageSizeOptions: E = y, pageInfo: D, hasNextPage: O, hasPrevPage: k, onNextPage: A, onPrevPage: j, statusCards: M, onStatusCardSelect: N, filterBar: P, isFiltering: F, headerStart: I, bankAttribution: L, onCreateClick: R, onSettingsClick: z, onRowClick: B, onRetry: V, labels: H }) {
-	let U = {
-		...l,
-		...H,
-		statusBadge: {
-			...l.statusBadge,
-			...H?.statusBadge
-		}
-	}, W = [
-		{
-			accessorKey: "dueDateLabel",
-			enableSorting: !0,
-			header: ({ column: e }) => /* @__PURE__ */ f(b, {
-				column: e,
-				label: U.columnDueDate,
-				ariaLabel: U.sortByDueDate
-			})
-		},
-		{
-			accessorKey: "status",
-			enableSorting: !0,
-			header: ({ column: e }) => /* @__PURE__ */ f(b, {
-				column: e,
-				label: U.columnStatus,
-				ariaLabel: U.sortByStatus
+function _({ direction: e, directionClassName: t, labels: n }) {
+	return /* @__PURE__ */ d(o, {
+		variant: "body2",
+		children: [
+			n.reminderNumberOfDays,
+			" ",
+			/* @__PURE__ */ u("span", {
+				className: t,
+				children: e
 			}),
-			cell: ({ row: e }) => /* @__PURE__ */ f(u, {
-				status: e.original.status,
-				tone: e.original.statusTone,
-				labels: U.statusBadge
-			})
-		},
-		{
-			accessorKey: "documentLabel",
-			enableSorting: !0,
-			header: ({ column: e }) => /* @__PURE__ */ f(b, {
-				column: e,
-				label: U.columnNumber,
-				ariaLabel: U.sortByNumber
-			})
-		},
-		{
-			accessorKey: "customerLabel",
-			header: U.columnCustomer,
-			cell: ({ row: e }) => /* @__PURE__ */ f(x, { row: e.original }),
-			minSize: 180
-		},
-		{
-			accessorKey: "issueDateLabel",
-			enableSorting: !0,
-			header: ({ column: e }) => /* @__PURE__ */ f(b, {
-				column: e,
-				label: U.columnIssueDate,
-				ariaLabel: U.sortByIssueDate
-			})
-		},
-		{
-			accessorKey: "totalLabel",
-			enableSorting: !0,
-			header: ({ column: e }) => /* @__PURE__ */ f("div", {
-				className: "ttw:flex ttw:justify-end",
-				children: /* @__PURE__ */ f(b, {
-					column: e,
-					label: U.columnAmount,
-					ariaLabel: U.sortByAmount
-				})
+			" ",
+			n.reminderDueDate
+		]
+	});
+}
+function v({ idPrefix: n, view: r, labels: i, onSelect: a, onInputChange: s, onSave: c }) {
+	let { create: l } = r, f = `${n}-error`;
+	return /* @__PURE__ */ d("div", {
+		className: m,
+		children: [
+			/* @__PURE__ */ u(_, {
+				direction: i.reminderBefore,
+				directionClassName: "ttw:text-green-700 ttw:font-bold",
+				labels: i
+			}),
+			/* @__PURE__ */ u(g, {
+				idPrefix: `${n}-option`,
+				options: r.options,
+				selectedId: r.selectedId,
+				noneLabel: i.reminderNone,
+				onSelect: a
+			}),
+			l && /* @__PURE__ */ d("div", {
+				className: "ttw:flex ttw:flex-col ttw:gap-2.5",
+				children: [
+					l.caption && /* @__PURE__ */ u(o, {
+						variant: "caption",
+						color: "muted",
+						children: l.caption
+					}),
+					/* @__PURE__ */ d("div", {
+						className: "ttw:flex ttw:items-center ttw:gap-2.5",
+						children: [
+							/* @__PURE__ */ u(t, {
+								type: "text",
+								inputMode: "numeric",
+								value: l.value,
+								onChange: (e) => s(e.target.value),
+								onKeyDown: p,
+								disabled: l.inputDisabled,
+								className: "ttw:text-right ttw:w-full ttw:p-1.5 ttw:max-w-56",
+								placeholder: i.reminderPlaceholder,
+								"aria-label": i.reminderBeforeDueInputLabel,
+								"aria-invalid": !!l.error,
+								"aria-describedby": l.error ? f : void 0
+							}),
+							/* @__PURE__ */ u(o, {
+								variant: "body2",
+								children: l.unitLabel
+							}),
+							/* @__PURE__ */ u(e, {
+								type: "button",
+								variant: "secondary",
+								className: "ttw:hover:brightness-95 ttw:text-secondary-foreground ttw:text-xs",
+								disabled: l.saveDisabled,
+								loading: l.isSaving,
+								onClick: c,
+								children: i.reminderSaveButton
+							})
+						]
+					}),
+					l.error && /* @__PURE__ */ u(o, {
+						id: f,
+						variant: "caption",
+						color: "destructive",
+						children: l.error
+					})
+				]
 			}),
-			cell: ({ row: e }) => /* @__PURE__ */ f("div", {
-				className: "ttw:text-right",
-				children: e.original.totalLabel
+			r.warning && /* @__PURE__ */ u(o, {
+				variant: "body2",
+				className: "ttw:text-amber-700",
+				children: r.warning
 			})
-		}
-	];
-	return /* @__PURE__ */ p("div", {
-		className: "ttw:flex ttw:flex-col ttw:gap-4",
+		]
+	});
+}
+function y({ idPrefix: n, view: r, labels: i, onSelect: a, onTermChange: s, onAddTerm: l, onClear: h, onSave: v }) {
+	let { create: y } = r;
+	return /* @__PURE__ */ d("div", {
+		className: m,
 		children: [
-			/* @__PURE__ */ p("div", {
-				className: "ttw:flex ttw:justify-between ttw:gap-4",
-				children: [/* @__PURE__ */ p("div", {
-					className: "ttw:flex ttw:flex-col ttw:gap-2",
-					children: [I, L && /* @__PURE__ */ p("div", {
-						className: "ttw:flex ttw:items-center ttw:gap-2",
-						children: [/* @__PURE__ */ f("span", {
-							className: "ttw:text-muted-foreground",
-							children: U.bankAttributionPrefix
-						}), /* @__PURE__ */ f("img", {
-							width: 120,
-							src: L.logoSrc,
-							alt: L.logoAlt
-						})]
-					})]
-				}), /* @__PURE__ */ p("div", {
-					className: "ttw:flex ttw:items-center ttw:gap-2",
-					children: [z && /* @__PURE__ */ f(a, { children: /* @__PURE__ */ p(r, { children: [/* @__PURE__ */ f(o, {
-						asChild: !0,
-						children: /* @__PURE__ */ f(e, {
-							type: "button",
-							variant: "outline",
-							size: "lg",
-							"aria-label": U.settingsButton,
-							onClick: z,
-							children: /* @__PURE__ */ f(_, {
-								className: "ttw:size-4.5",
-								"aria-hidden": !0
-							})
-						})
-					}), /* @__PURE__ */ f(i, {
-						sideOffset: 4,
-						children: U.settingsButton
-					})] }) }), R && /* @__PURE__ */ f(e, {
-						size: "lg",
-						onClick: R,
-						children: U.createInvoiceButton
-					})]
-				})]
+			/* @__PURE__ */ u(_, {
+				direction: i.reminderAfter,
+				directionClassName: "ttw:text-destructive ttw:font-bold",
+				labels: i
 			}),
-			!g && M && N && /* @__PURE__ */ f(d, {
-				view: M,
-				onSelect: N,
-				labels: { all: U.statusCardsAll }
+			/* @__PURE__ */ u(g, {
+				idPrefix: `${n}-option`,
+				options: r.options,
+				selectedId: r.selectedId,
+				noneLabel: i.reminderNone,
+				onSelect: a
 			}),
-			g ? /* @__PURE__ */ f(c, {
-				icon: /* @__PURE__ */ f(v, { className: "ttw:size-8 ttw:text-primary" }),
-				title: U.accessRestrictedTitle,
-				description: U.accessRestrictedDescription
-			}) : h ? /* @__PURE__ */ f(c, {
-				title: U.errorTitle,
-				description: U.errorDescription,
-				retryLabel: V ? U.errorRetry : void 0,
-				onRetry: V
-			}) : /* @__PURE__ */ f(t, {
-				columns: W,
-				data: n,
-				isLoading: m,
-				sorting: S,
-				onSortingChange: C,
-				pageSize: w,
-				onPageSizeChange: T,
-				pageSizeOptions: E,
-				pageInfo: D,
-				hasNextPage: O,
-				hasPrevPage: k,
-				onNextPage: A,
-				onPrevPage: j,
-				onRowClick: B,
-				rowAriaLabel: (e) => U.openRow(e.documentLabel),
-				filterComponent: P,
-				children: /* @__PURE__ */ f(s, {
-					title: F ? U.filterEmptyTitle : U.emptyTitle,
-					description: F ? void 0 : U.emptyDescription,
-					actionLabel: F ? void 0 : U.createInvoiceButton,
-					onAction: F ? void 0 : R
-				})
+			y && /* @__PURE__ */ d("div", {
+				className: "ttw:flex ttw:flex-col ttw:gap-2.5",
+				children: [
+					/* @__PURE__ */ u(o, {
+						variant: "caption",
+						color: "muted",
+						children: y.caption
+					}),
+					/* @__PURE__ */ d("div", {
+						className: "ttw:flex ttw:items-center ttw:gap-2.5",
+						children: [y.terms.map((e, n) => /* @__PURE__ */ d(c, { children: [/* @__PURE__ */ u(t, {
+							type: "text",
+							inputMode: "numeric",
+							value: e.value,
+							onChange: (e) => s(n, e.target.value),
+							onKeyDown: p,
+							disabled: y.inputsDisabled,
+							className: "ttw:text-right ttw:w-15 ttw:p-1.5",
+							placeholder: e.showPlaceholder ? i.reminderPlaceholder : void 0,
+							"aria-label": e.ariaLabel
+						}), /* @__PURE__ */ u(o, {
+							variant: "body2",
+							children: e.unitLabel
+						})] }, n)), y.showAddTerm && /* @__PURE__ */ d(e, {
+							type: "button",
+							variant: "ghost",
+							className: "ttw:text-xs ttw:text-primary ttw:hover:text-primary",
+							disabled: y.addTermDisabled,
+							onClick: l,
+							children: [/* @__PURE__ */ u(f, {}), i.reminderAddTermButton]
+						})]
+					}),
+					/* @__PURE__ */ d("div", {
+						className: "ttw:flex ttw:items-center ttw:gap-2.5",
+						children: [/* @__PURE__ */ u(e, {
+							type: "button",
+							variant: "ghost",
+							className: "ttw:text-xs",
+							disabled: y.clearDisabled,
+							onClick: h,
+							children: i.reminderClearButton
+						}), /* @__PURE__ */ u(e, {
+							type: "button",
+							variant: "secondary",
+							className: "ttw:hover:brightness-95 ttw:text-secondary-foreground ttw:text-xs",
+							disabled: y.saveDisabled,
+							loading: y.isSaving,
+							onClick: v,
+							children: i.reminderSaveButton
+						})]
+					})
+				]
 			})
 		]
 	});
 }
+function b({ idPrefix: e, view: t, onToggle: n, onPaymentReminderSelect: r, onOverdueReminderSelect: i, onBeforeDueInputChange: c, onBeforeDueSave: f, onOverdueTermChange: p, onOverdueAddTerm: m, onOverdueClear: h, onOverdueSave: g, labels: _ }) {
+	let b = {
+		...s,
+		..._
+	}, { cards: x } = t;
+	return /* @__PURE__ */ d("section", {
+		className: "ttw:flex ttw:flex-col ttw:gap-6",
+		children: [/* @__PURE__ */ d("div", {
+			className: "ttw:flex ttw:items-center ttw:gap-3",
+			children: [/* @__PURE__ */ u(a, {
+				checked: t.checked,
+				disabled: t.toggleDisabled,
+				onCheckedChange: n,
+				"aria-label": b.remindersToggleLabel
+			}), /* @__PURE__ */ u(o, {
+				variant: "body2",
+				children: b.remindersDescription
+			})]
+		}), x && /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ d("div", {
+			className: "ttw:flex ttw:flex-col ttw:gap-4 ttw:w-full ttw:xl:flex-row",
+			children: [x.beforeDue && /* @__PURE__ */ u(v, {
+				idPrefix: `${e}-before`,
+				view: x.beforeDue,
+				labels: b,
+				onSelect: r,
+				onInputChange: c,
+				onSave: f
+			}), /* @__PURE__ */ u(y, {
+				idPrefix: `${e}-overdue`,
+				view: x.overdue,
+				labels: b,
+				onSelect: i,
+				onTermChange: p,
+				onAddTerm: m,
+				onClear: h,
+				onSave: g
+			})]
+		}), /* @__PURE__ */ u(o, {
+			variant: "body2",
+			color: "muted",
+			className: "ttw:font-medium",
+			children: b.remindersLibraryNote
+		})] })]
+	});
+}
 //#endregion
-export { S as ReceivablesScreen, S as default };
+export { b as ReceivableRemindersSection };

package/dist/libs/tesouro-embedded-components-react/invoicing-widget/ui/dist/index53.js

@@ -1,45 +1,93 @@
-import { AlertDialog as e, AlertDialogContent as t, AlertDialogDescription as n, AlertDialogFooter as r, AlertDialogHeader as i, AlertDialogTitle as a, Button as o } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
-import { UNSAVED_INVOICE_DIALOG_LABELS_EN as s } from "./index13.js";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
-import { XIcon as u } from "lucide-react";
+import { Button as e, Dialog as t, DialogContent as n, DialogDescription as r, DialogFooter as i, DialogHeader as a, DialogTitle as o, Input as s, Label as c, Textarea as l } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import { RECEIVABLE_SEND_DIALOG_LABELS_EN as u } from "./index13.js";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region ../../libs/tesouro-embedded-components-react/invoicing-widget/ui/dist/index53.js
-function d({ open: d, onSaveDraft: f, onDiscard: p, onCancel: m, isSaving: h, isSaveDraftDisabled: g, labels: _ }) {
-	let v = {
-		...s,
-		..._
+function p({ message: e }) {
+	return e ? /* @__PURE__ */ d("p", {
+		className: "ttw:text-sm ttw:text-destructive",
+		children: e
+	}) : null;
+}
+function m({ open: m, onOpenChange: h, values: g, errors: _, inProgress: v, onChange: y, onSubmit: b, onCancel: x, labels: S }) {
+	let C = {
+		...u,
+		...S
 	};
-	return /* @__PURE__ */ c(e, {
-		open: d,
-		onOpenChange: (e) => {
-			!e && !h && m();
-		},
-		children: /* @__PURE__ */ l(t, { children: [
-			/* @__PURE__ */ l("button", {
-				type: "button",
-				onClick: m,
-				disabled: h,
-				className: "ttw:absolute ttw:right-4 ttw:top-4 ttw:cursor-pointer ttw:rounded-sm ttw:opacity-70 ttw:ring-offset-background ttw:transition-opacity ttw:hover:opacity-100 ttw:focus:outline-hidden ttw:focus:ring-2 ttw:focus:ring-ring ttw:focus:ring-offset-2 ttw:disabled:pointer-events-none",
-				children: [/* @__PURE__ */ c(u, { className: "ttw:size-4" }), /* @__PURE__ */ c("span", {
-					className: "ttw:sr-only",
-					children: v.unsavedCloseButton
-				})]
+	return /* @__PURE__ */ d(t, {
+		open: m,
+		onOpenChange: h,
+		children: /* @__PURE__ */ f(n, { children: [
+			/* @__PURE__ */ f(a, { children: [/* @__PURE__ */ d(o, { children: C.title }), /* @__PURE__ */ d(r, { children: C.description })] }),
+			/* @__PURE__ */ f("div", {
+				className: "ttw:flex ttw:flex-col ttw:gap-4",
+				children: [
+					_?.form && /* @__PURE__ */ d("p", {
+						className: "ttw:rounded-md ttw:bg-destructive/10 ttw:px-3 ttw:py-2 ttw:text-sm ttw:text-destructive",
+						children: _.form
+					}),
+					/* @__PURE__ */ f("div", {
+						className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+						children: [
+							/* @__PURE__ */ d(c, { children: C.toLabel }),
+							/* @__PURE__ */ d(s, {
+								value: g.to,
+								onChange: (e) => y({ to: e.target.value })
+							}),
+							/* @__PURE__ */ d(p, { message: _?.to })
+						]
+					}),
+					/* @__PURE__ */ f("div", {
+						className: "ttw:grid ttw:grid-cols-2 ttw:gap-4",
+						children: [/* @__PURE__ */ f("div", {
+							className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+							children: [/* @__PURE__ */ d(c, { children: C.ccLabel }), /* @__PURE__ */ d(s, {
+								value: g.cc,
+								onChange: (e) => y({ cc: e.target.value })
+							})]
+						}), /* @__PURE__ */ f("div", {
+							className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+							children: [/* @__PURE__ */ d(c, { children: C.bccLabel }), /* @__PURE__ */ d(s, {
+								value: g.bcc,
+								onChange: (e) => y({ bcc: e.target.value })
+							})]
+						})]
+					}),
+					/* @__PURE__ */ f("div", {
+						className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+						children: [
+							/* @__PURE__ */ d(c, { children: C.subjectLabel }),
+							/* @__PURE__ */ d(s, {
+								value: g.subject,
+								onChange: (e) => y({ subject: e.target.value })
+							}),
+							/* @__PURE__ */ d(p, { message: _?.subject })
+						]
+					}),
+					/* @__PURE__ */ f("div", {
+						className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+						children: [
+							/* @__PURE__ */ d(c, { children: C.bodyLabel }),
+							/* @__PURE__ */ d(l, {
+								rows: 6,
+								value: g.body,
+								onChange: (e) => y({ body: e.target.value })
+							}),
+							/* @__PURE__ */ d(p, { message: _?.body })
+						]
+					})
+				]
 			}),
-			/* @__PURE__ */ l(i, { children: [/* @__PURE__ */ c(a, { children: v.unsavedTitle }), /* @__PURE__ */ c(n, { children: v.unsavedDescription })] }),
-			/* @__PURE__ */ l(r, { children: [/* @__PURE__ */ c(o, {
-				type: "button",
-				variant: "outline",
-				onClick: p,
-				disabled: h,
-				children: v.unsavedDiscardButton
-			}), /* @__PURE__ */ c(o, {
-				type: "button",
-				loading: h,
-				disabled: h || g,
-				onClick: f,
-				children: v.unsavedSaveDraftButton
+			/* @__PURE__ */ f(i, { children: [/* @__PURE__ */ d(e, {
+				variant: "ghost",
+				onClick: x,
+				children: C.cancelButton
+			}), /* @__PURE__ */ d(e, {
+				loading: v,
+				onClick: b,
+				children: C.sendButton
 			})] })
 		] })
 	});
 }
 //#endregion
-export { d as UnsavedInvoiceDialog, d as default };
+export { m as ReceivableSendDialog, m as default };

package/dist/libs/tesouro-embedded-components-react/invoicing-widget/ui/dist/index54.js

@@ -0,0 +1,60 @@
+import { Skeleton as e, cn as t } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import { RECEIVABLE_STATUS_CARDS_LABELS_EN as n } from "./index13.js";
+import { ReceivableStatusBadge as r } from "./index22.js";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region ../../libs/tesouro-embedded-components-react/invoicing-widget/ui/dist/index54.js
+var o = 6;
+function s({ selected: e, onClick: n, children: r }) {
+	return /* @__PURE__ */ i("button", {
+		type: "button",
+		"aria-pressed": e,
+		onClick: n,
+		className: t("ttw:flex ttw:w-42 ttw:shrink-0 ttw:cursor-pointer ttw:flex-col ttw:gap-2 ttw:rounded-xl ttw:border ttw:bg-card ttw:px-4 ttw:py-2 ttw:text-left ttw:transition-colors", e ? "ttw:border-primary" : "ttw:border-card ttw:hover:border-primary"),
+		children: r
+	});
+}
+function c({ view: t, onSelect: c, labels: l }) {
+	let u = {
+		...n,
+		...l
+	};
+	return t.kind === "loading" ? /* @__PURE__ */ i("div", {
+		className: "ttw:flex ttw:gap-2",
+		children: Array.from({ length: o }).map((t, n) => /* @__PURE__ */ i(e, { className: "ttw:h-16.5 ttw:w-42 ttw:rounded-xl" }, n))
+	}) : /* @__PURE__ */ a("div", {
+		className: "ttw:mb-6 ttw:flex ttw:gap-2 ttw:overflow-x-auto ttw:[scrollbar-width:none] ttw:[&::-webkit-scrollbar]:hidden",
+		children: [/* @__PURE__ */ a(s, {
+			selected: t.all.selected,
+			onClick: () => c(t.all.value),
+			children: [/* @__PURE__ */ i("span", {
+				className: "ttw:text-xs ttw:font-medium ttw:text-foreground",
+				children: u.all
+			}), /* @__PURE__ */ i("span", {
+				className: "ttw:text-2xl ttw:font-medium ttw:leading-8 ttw:tabular-nums ttw:text-foreground",
+				children: t.all.countLabel
+			})]
+		}), t.statuses.map((e) => /* @__PURE__ */ i(s, {
+			selected: e.selected,
+			onClick: () => c(e.value),
+			children: /* @__PURE__ */ a("div", {
+				className: "ttw:flex ttw:flex-col",
+				children: [/* @__PURE__ */ a("div", {
+					className: "ttw:flex ttw:items-center ttw:justify-between ttw:gap-2",
+					children: [/* @__PURE__ */ i(r, {
+						label: e.statusLabel,
+						status: e.value,
+						variant: "filled"
+					}), /* @__PURE__ */ i("span", {
+						className: "ttw:text-xs ttw:font-medium ttw:leading-4.5 ttw:tabular-nums ttw:text-foreground",
+						children: e.countLabel
+					})]
+				}), /* @__PURE__ */ i("span", {
+					className: "ttw:overflow-hidden ttw:text-ellipsis ttw:whitespace-nowrap ttw:text-2xl ttw:font-medium ttw:leading-8 ttw:tabular-nums ttw:text-foreground",
+					children: e.amountLabel
+				})]
+			})
+		}, e.value))]
+	});
+}
+//#endregion
+export { c as ReceivableStatusCards, c as default };