@tesouro/embedded-components-react 0.3.23 → 0.3.25

package/dist/libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index64.js

@@ -1,314 +1,201 @@
-import { Alert as e, AlertTitle as t, Button as n, DataTable as r, DataTableSortableHeader as i, Input as a, Tabs as ee, TabsContent as te, TabsList as ne, TabsTrigger 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 { AddBillPanel as l } from "./index7.js";
-import "./index8.js";
-import { BillStatusBadge as re } from "./index20.js";
-import "./index21.js";
-import { MissingValue as u } from "./index50.js";
-import "./index51.js";
-import { BILLS_SCREEN_LABELS_EN as d, BILLS_SCREEN_UPLOAD_ACCEPT as f } from "./index52.js";
-import { BillDuplicateBadge as ie } from "./index54.js";
-import "./index55.js";
-import { BillsFilterBar as p } from "./index61.js";
-import "./index62.js";
-import { BillColumn as m } from "./index63.js";
-import { useMemo as h } from "react";
-import { jsx as g, jsxs as _ } from "react/jsx-runtime";
-import { ChevronRightIcon as v, CopyX as ae, PaperclipIcon as oe, PlusIcon as se, SearchIcon as ce } from "lucide-react";
+import { AmountFilter as e, DateRangePicker as t, FilterBar as n, FilterMenuButton as r, FilterTag as ee, Input as te, MultiSelectFilter as i, Popover as a, PopoverContent as o, PopoverTrigger as s, RadioGroup as c, RadioGroupItem as l, useFilterPanel as u } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import { BILLS_FILTER_BAR_LABELS_EN as d } from "./index62.js";
+import { BillsFilterField as f } from "./index63.js";
+import { useMemo as ne } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { ListFilterIcon as h } from "lucide-react";
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index64.js
-var le = [
-	10,
-	25,
-	50,
-	100
-], ue = 240, de = [
-	m.Vendor,
-	m.IssueDate,
-	m.DueDate,
-	m.ScheduledDate,
-	m.PaidDate,
-	m.Status,
-	m.AmountDue,
-	m.AmountScheduled,
-	m.AmountPaid,
-	m.TotalAmount,
-	m.AddedOn
-], y = [
-	m.Vendor,
-	m.DueDate,
-	m.Status,
-	m.AmountDue,
-	m.AddedOn
+var g = {
+	date: "ttw:w-auto",
+	status: "ttw:w-56",
+	amount: "ttw:w-64",
+	vendor: "ttw:w-64",
+	attachment: "ttw:w-56"
+}, _ = {
+	[f.Vendor]: "vendor",
+	[f.IssueDate]: "date",
+	[f.DueDate]: "date",
+	[f.Status]: "status",
+	[f.TotalAmount]: "amount",
+	[f.AddedOn]: "date",
+	[f.Attachment]: "attachment"
+}, v = [
+	f.IssueDate,
+	f.DueDate,
+	f.AddedOn
 ];
-function b({ rows: b, isLoading: x, isError: S, sorting: fe, onSortingChange: pe, pageSize: me, onPageSizeChange: he, pageSizeOptions: ge = le, pageInfo: C, hasNextPage: w, hasPrevPage: T, onNextPage: E, onPrevPage: D, filterTabs: O, selectedFilterTabId: k, onFilterTabChange: A, searchValue: j, onSearchChange: M, filters: N, visibleColumns: P = y, cellTestIds: F, isSearchActive: I, showAddPanelWhenEmpty: L, emptyState: R, onCreateClick: z, onRetry: B, onFilesSelected: V, maxFiles: H, onEnterManually: U, uploadStatus: W, uploadErrorMessage: G, emailAddress: K, onCopyEmail: q, labels: J, duplicateWarning: Y, onReviewDuplicates: X }) {
-	let Z = h(() => ({
+function y({ fields: f, activeFilterCount: y, chips: b, onRemoveChip: x, onClearAll: S, dateField: C, onDateFieldChange: w, datePresets: T, selectedDatePreset: E, dateFrom: D, dateTo: O, onDateRangeChange: k, onDatePresetChange: A, statusOptions: j, selectedStatuses: M, onStatusChange: N, amountMode: P, onAmountModeChange: F, amountMin: I, amountMax: L, onAmountMinChange: re, onAmountMaxChange: R, vendorOptions: z, selectedVendors: B, onVendorChange: V, vendorSearchValue: H, onVendorSearchChange: U, isVendorLoading: W, isVendorError: G, hasAttachment: K, onHasAttachmentChange: q, searchSlot: J, testIds: Y, labels: X, className: ie }) {
+	let Z = ne(() => ({
 		...d,
-		...J,
-		statusBadge: {
-			...d.statusBadge,
-			...J?.statusBadge
+		...X,
+		fields: {
+			...d.fields,
+			...X?.fields
 		},
-		addBill: {
-			...d.addBill,
-			...J?.addBill,
-			dropzone: {
-				...d.addBill.dropzone,
-				...J?.addBill?.dropzone
-			}
+		filterMenuButton: {
+			...d.filterMenuButton,
+			...X?.filterMenuButton
 		},
-		sortableHeader: {
-			...d.sortableHeader,
-			...J?.sortableHeader
+		filterTag: {
+			...d.filterTag,
+			...X?.filterTag
 		},
-		missingValue: {
-			...d.missingValue,
-			...J?.missingValue
+		amountFilter: {
+			...d.amountFilter,
+			...X?.amountFilter
+		},
+		dateRangePicker: {
+			...d.dateRangePicker,
+			...X?.dateRangePicker
 		}
-	}), [J]), Q = h(() => {
-		let e = (e) => function({ column: t }) {
-			return /* @__PURE__ */ g(i, {
-				column: t,
-				title: e,
-				labels: Z.sortableHeader
-			});
-		}, t = (e, t) => function({ row: n }) {
-			return /* @__PURE__ */ g("span", {
-				"data-testid": F?.[t],
-				children: n.original[e] || /* @__PURE__ */ g(u, { labels: Z.missingValue })
-			});
-		}, n = (e, t) => function({ row: n }) {
-			return /* @__PURE__ */ g("div", {
-				className: "ttw:text-right",
-				"data-testid": F?.[t],
-				children: n.original[e] || /* @__PURE__ */ g(u, { labels: Z.missingValue })
-			});
-		}, r = (e) => function() {
-			return /* @__PURE__ */ g("div", {
-				className: "ttw:text-right",
-				children: e
-			});
-		};
-		return {
-			[m.Vendor]: {
-				accessorKey: "vendorLabel",
-				enableSorting: !0,
-				minSize: ue,
-				header: e(Z.columnVendor),
-				cell: ({ row: e }) => /* @__PURE__ */ _("span", {
-					className: "ttw:flex ttw:items-center ttw:gap-1.5",
-					"data-testid": F?.[m.Vendor],
-					children: [e.original.vendorLabel || /* @__PURE__ */ g(u, { labels: Z.missingValue }), e.original.attachment ? /* @__PURE__ */ g(oe, {
-						className: "ttw:size-3.5 ttw:shrink-0 ttw:text-muted-foreground",
-						"aria-label": e.original.attachment.label,
-						role: "img"
-					}) : null]
-				})
-			},
-			[m.IssueDate]: {
-				accessorKey: "issueDateLabel",
-				enableSorting: !0,
-				header: e(Z.columnIssueDate),
-				cell: t("issueDateLabel", m.IssueDate)
-			},
-			[m.DueDate]: {
-				accessorKey: "dueDateLabel",
-				enableSorting: !0,
-				header: e(Z.columnDueDate),
-				cell: t("dueDateLabel", m.DueDate)
-			},
-			[m.ScheduledDate]: {
-				accessorKey: "scheduledDateLabel",
-				enableSorting: !0,
-				header: e(Z.columnScheduledDate),
-				cell: t("scheduledDateLabel", m.ScheduledDate)
-			},
-			[m.PaidDate]: {
-				accessorKey: "paidDateLabel",
-				enableSorting: !1,
-				header: Z.columnPaidDate,
-				cell: t("paidDateLabel", m.PaidDate)
-			},
-			[m.Status]: {
-				accessorKey: "status",
-				enableSorting: !1,
-				header: Z.columnStatus,
-				cell: ({ row: e }) => /* @__PURE__ */ _("div", {
-					className: "ttw:flex ttw:items-center ttw:gap-1",
-					"data-testid": F?.[m.Status],
-					children: [/* @__PURE__ */ g(re, {
-						status: e.original.status,
-						tone: e.original.statusTone,
-						labels: Z.statusBadge
-					}), e.original.duplicateBadge ? /* @__PURE__ */ g(ie, { ...e.original.duplicateBadge }) : null]
+	}), [X]), Q = u(), $ = Q.activePanelId, ae = Q.isMenuOpen || !!$, oe = ($ && g[$]) ?? "ttw:w-52", se = (e) => {
+		$ && e.preventDefault(), Q.toggleMenu();
+	}, ce = (e) => {
+		e || (Q.closeMenu(), Q.closePanel());
+	}, le = (e) => {
+		v.includes(e) && w(e), Q.openPanel(_[e]);
+	}, ue = K === void 0 ? "any" : K ? "has" : "none", de = (e) => {
+		q(e === "any" ? void 0 : e === "has");
+	};
+	return /* @__PURE__ */ p(n, {
+		className: ie,
+		searchSlot: J,
+		menuSlot: /* @__PURE__ */ m(a, {
+			open: ae,
+			onOpenChange: ce,
+			children: [/* @__PURE__ */ p(s, {
+				asChild: !0,
+				children: /* @__PURE__ */ p(r, {
+					size: "md",
+					activeCount: y,
+					onClick: se,
+					labels: Z.filterMenuButton,
+					"data-testid": Y?.menuButton
 				})
-			},
-			[m.AmountDue]: {
-				accessorKey: "amountDueLabel",
-				enableSorting: !1,
-				header: r(Z.columnAmountDue),
-				cell: n("amountDueLabel", m.AmountDue)
-			},
-			[m.AmountScheduled]: {
-				accessorKey: "amountScheduledLabel",
-				enableSorting: !1,
-				header: r(Z.columnAmountScheduled),
-				cell: n("amountScheduledLabel", m.AmountScheduled)
-			},
-			[m.AmountPaid]: {
-				accessorKey: "amountPaidLabel",
-				enableSorting: !1,
-				header: r(Z.columnAmountPaid),
-				cell: n("amountPaidLabel", m.AmountPaid)
-			},
-			[m.TotalAmount]: {
-				accessorKey: "totalAmountLabel",
-				enableSorting: !1,
-				header: r(Z.columnTotalAmount),
-				cell: n("totalAmountLabel", m.TotalAmount)
-			},
-			[m.AddedOn]: {
-				accessorKey: "addedOnLabel",
-				enableSorting: !0,
-				header: e(Z.columnAddedOn),
-				cell: t("addedOnLabel", m.AddedOn)
-			}
-		};
-	}, [Z, F]), _e = h(() => [...de.filter((e) => P.includes(e)).map((e) => Q[e]), {
-		id: "actions",
-		enableSorting: !1,
-		header: () => /* @__PURE__ */ g("span", {
-			className: "ttw:sr-only",
-			children: Z.columnActions
+			}), /* @__PURE__ */ m(o, {
+				align: "start",
+				className: `ttw:p-0 ${oe}`,
+				children: [
+					Q.isMenuOpen ? /* @__PURE__ */ p("div", {
+						className: "ttw:p-1",
+						role: "menu",
+						"aria-label": Z.fieldMenuLabel,
+						children: f.map((e) => /* @__PURE__ */ m("button", {
+							type: "button",
+							role: "menuitem",
+							className: "ttw:flex ttw:w-full ttw:cursor-pointer ttw:items-center ttw:gap-2 ttw:rounded-md ttw:px-2 ttw:py-1.5 ttw:text-xs ttw:font-medium ttw:transition-colors ttw:hover:bg-accent",
+							onClick: () => le(e),
+							children: [/* @__PURE__ */ p(h, {
+								className: "ttw:size-4 ttw:shrink-0 ttw:text-muted-foreground",
+								"aria-hidden": !0
+							}), Z.fields[e]]
+						}, e))
+					}) : null,
+					$ === "date" ? /* @__PURE__ */ p(t, {
+						from: D,
+						to: O,
+						onRangeChange: k,
+						selectedPreset: E,
+						onPresetChange: A,
+						presets: [...T],
+						labels: {
+							...Z.dateRangePicker,
+							fieldLabel: Z.fields[C]
+						}
+					}) : null,
+					$ === "status" ? /* @__PURE__ */ p(i, {
+						options: [...j],
+						selectedValues: [...M],
+						onSelectionChange: N
+					}) : null,
+					$ === "amount" ? /* @__PURE__ */ p(e, {
+						mode: P,
+						onModeChange: F,
+						min: I,
+						max: L,
+						onMinChange: re,
+						onMaxChange: R,
+						showFlowDirection: !1,
+						labels: {
+							...Z.amountFilter,
+							min: Z.amountMin,
+							max: Z.amountMax
+						}
+					}) : null,
+					$ === "vendor" ? /* @__PURE__ */ m("div", {
+						className: "ttw:flex ttw:flex-col ttw:gap-2 ttw:p-3",
+						children: [/* @__PURE__ */ p(te, {
+							type: "search",
+							className: "ttw:h-8 ttw:text-xs",
+							"aria-label": Z.vendorSearchLabel,
+							placeholder: Z.vendorSearchPlaceholder,
+							value: H,
+							onChange: (e) => U(e.target.value)
+						}), W ? /* @__PURE__ */ p("p", {
+							className: "ttw:px-1 ttw:text-xs ttw:text-muted-foreground",
+							children: Z.vendorLoading
+						}) : G ? /* @__PURE__ */ p("p", {
+							className: "ttw:px-1 ttw:text-xs ttw:text-destructive",
+							children: Z.vendorError
+						}) : z.length === 0 ? /* @__PURE__ */ p("p", {
+							className: "ttw:px-1 ttw:text-xs ttw:text-muted-foreground",
+							children: Z.vendorEmpty
+						}) : /* @__PURE__ */ p(i, {
+							options: [...z],
+							selectedValues: [...B],
+							onSelectionChange: V
+						})]
+					}) : null,
+					$ === "attachment" ? /* @__PURE__ */ p("div", {
+						className: "ttw:p-3",
+						children: /* @__PURE__ */ p(c, {
+							value: ue,
+							onValueChange: de,
+							"aria-label": Z.attachmentLabel,
+							className: "ttw:flex ttw:flex-col ttw:gap-1",
+							children: [
+								{
+									value: "any",
+									label: Z.attachmentAny
+								},
+								{
+									value: "has",
+									label: Z.attachmentHas
+								},
+								{
+									value: "none",
+									label: Z.attachmentNone
+								}
+							].map(({ value: e, label: t }) => /* @__PURE__ */ m("label", {
+								className: "ttw:flex ttw:cursor-pointer ttw:items-center ttw:gap-2",
+								children: [/* @__PURE__ */ p(l, { value: e }), /* @__PURE__ */ p("span", {
+									className: "ttw:text-xs ttw:font-medium",
+									children: t
+								})]
+							}, e))
+						})
+					}) : null
+				]
+			})]
 		}),
-		cell: ({ row: e }) => /* @__PURE__ */ g("div", {
-			className: "ttw:flex ttw:justify-end",
-			children: /* @__PURE__ */ g(n, {
-				variant: "ghost",
-				size: "icon",
-				"aria-label": Z.openRow(e.original.vendorLabel || Z.missingValue.missing),
-				onClick: (t) => {
-					t.stopPropagation(), e.original.onOpen();
-				},
-				children: /* @__PURE__ */ g(v, { className: "ttw:size-4" })
-			})
+		activeChipsSlot: /* @__PURE__ */ m("span", {
+			className: "ttw:flex ttw:flex-wrap ttw:items-center ttw:gap-2",
+			"data-testid": Y?.chips,
+			children: [b.map((e) => /* @__PURE__ */ p(ee, {
+				label: e.label,
+				labels: Z.filterTag,
+				onDismiss: () => x(e.key)
+			}, e.key)), b.length > 0 ? /* @__PURE__ */ p("button", {
+				type: "button",
+				className: "ttw:cursor-pointer ttw:whitespace-nowrap ttw:text-xs ttw:text-muted-foreground ttw:transition-colors ttw:hover:text-foreground",
+				onClick: S,
+				children: Z.clearAll
+			}) : null]
 		})
-	}], [
-		Q,
-		Z,
-		P
-	]), ve = !!(z && V) && !x && !S && !I && b.length === 0 && L === !0, $ = /* @__PURE__ */ _("div", {
-		className: "ttw:relative ttw:w-80",
-		children: [/* @__PURE__ */ g(ce, { className: "ttw:pointer-events-none ttw:absolute ttw:left-3 ttw:top-1/2 ttw:size-4 ttw:-translate-y-1/2 ttw:text-muted-foreground" }), /* @__PURE__ */ g(a, {
-			className: "ttw:pl-9",
-			type: "search",
-			"aria-label": Z.searchLabel,
-			placeholder: Z.searchPlaceholder,
-			value: j,
-			onChange: (e) => M(e.target.value)
-		})]
-	}), ye = N ? /* @__PURE__ */ g(p, {
-		...N,
-		className: "ttw:px-4",
-		searchSlot: $
-	}) : /* @__PURE__ */ g("div", {
-		className: "ttw:flex ttw:flex-wrap ttw:items-center ttw:gap-2 ttw:px-4",
-		children: $
-	});
-	return /* @__PURE__ */ _("div", {
-		className: "ttw:flex ttw:flex-col ttw:gap-3",
-		children: [Y ? /* @__PURE__ */ _(e, {
-			className: "ttw:[&>svg]:size-6 ttw:flex ttw:items-center ttw:bg-amber-50 ttw:text-amber-700 ttw:border-amber-300",
-			children: [
-				/* @__PURE__ */ g(ae, {}),
-				/* @__PURE__ */ g(t, {
-					className: "ttw:flex-1",
-					children: Y
-				}),
-				X ? /* @__PURE__ */ g(n, {
-					type: "button",
-					variant: "outline",
-					className: "ttw:text-foreground",
-					onClick: X,
-					children: Z.duplicateBillsReviewButton
-				}) : null
-			]
-		}) : null, /* @__PURE__ */ _(ee, {
-			value: k,
-			onValueChange: A,
-			className: "ttw:flex ttw:flex-col ttw:gap-4",
-			children: [/* @__PURE__ */ _("div", {
-				className: "ttw:flex ttw:flex-wrap ttw:items-center ttw:justify-between ttw:gap-3",
-				children: [/* @__PURE__ */ g(ne, {
-					"aria-label": Z.filterTabsLabel,
-					children: O.map((e) => /* @__PURE__ */ _(o, {
-						value: e.id,
-						className: "ttw:min-w-28",
-						children: [e.icon, e.label]
-					}, e.id))
-				}), z ? /* @__PURE__ */ _(n, {
-					onClick: z,
-					children: [/* @__PURE__ */ g(se, { className: "ttw:size-4" }), Z.createButton]
-				}) : null]
-			}), (() => {
-				let e = S ? /* @__PURE__ */ g(c, {
-					title: Z.errorTitle,
-					description: Z.errorDescription,
-					retryLabel: B ? Z.errorRetry : void 0,
-					onRetry: B
-				}) : ve && z && V ? /* @__PURE__ */ g("div", {
-					className: "ttw:rounded-lg ttw:border ttw:border-border ttw:bg-card",
-					children: K && q ? /* @__PURE__ */ g(l, {
-						emailAddress: K,
-						onCopyEmail: q,
-						onFilesSelected: V,
-						accept: f,
-						maxFiles: H,
-						uploadStatus: W,
-						uploadErrorMessage: G,
-						onEnterManually: U ?? z,
-						labels: Z.addBill
-					}) : /* @__PURE__ */ g(l, {
-						onFilesSelected: V,
-						accept: f,
-						maxFiles: H,
-						uploadStatus: W,
-						uploadErrorMessage: G,
-						onEnterManually: U ?? z,
-						labels: Z.addBill
-					})
-				}) : /* @__PURE__ */ g(r, {
-					columns: _e,
-					data: b,
-					isLoading: x,
-					sorting: fe,
-					onSortingChange: pe,
-					pageSize: me,
-					onPageSizeChange: he,
-					pageSizeOptions: ge,
-					pageInfo: C,
-					hasNextPage: w,
-					hasPrevPage: T,
-					onNextPage: E,
-					onPrevPage: D,
-					onRowClick: (e) => e.onOpen(),
-					filterComponent: ye,
-					children: I ? /* @__PURE__ */ g(s, {
-						title: Z.filteredEmptyTitle,
-						description: Z.filteredEmptyDescription
-					}) : R ? /* @__PURE__ */ g(s, {
-						title: R.title,
-						description: R.description
-					}) : void 0
-				});
-				return O.map((t) => /* @__PURE__ */ g(te, {
-					value: t.id,
-					children: t.id === k ? e : null
-				}, t.id));
-			})()]
-		})]
 	});
 }
+function b(e) {
+	return /* @__PURE__ */ p(y, { ...e }, e.fields.join("|"));
+}
 //#endregion
-export { b as BillsScreen, b as default, y as DEFAULT_BILL_COLUMNS };
+export { b as BillsFilterBar, b as default };

package/dist/libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index65.js

@@ -1,10 +1,3 @@
-//#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index65.js
-var e = {
-	collapse: "Collapse upload status",
-	expand: "Expand upload status",
-	close: "Close upload status",
-	statusLabel: (e) => e === "uploading" ? "Uploading" : e === "ready" ? "Ready" : "Failed",
-	openItem: (e) => `Open ${e}`
-};
-//#endregion
-export { e as BILL_UPLOAD_STATUS_TRAY_LABELS_EN };
+import "./index62.js";
+import "./index63.js";
+import "./index64.js";

package/dist/libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index66.js

@@ -1,8 +1,16 @@
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index66.js
 var e = {
-	uploading: "ttw:text-muted-foreground",
-	ready: "ttw:text-emerald-600",
-	failed: "ttw:text-destructive"
+	Vendor: "vendor",
+	IssueDate: "issueDate",
+	DueDate: "dueDate",
+	ScheduledDate: "scheduledDate",
+	PaidDate: "paidDate",
+	Status: "status",
+	AmountDue: "amountDue",
+	AmountScheduled: "amountScheduled",
+	AmountPaid: "amountPaid",
+	TotalAmount: "totalAmount",
+	AddedOn: "addedOn"
 };
 //#endregion
-export { e as UPLOAD_ITEM_ICON_TONE };
+export { e as BillColumn };