@tesouro/embedded-components-react 0.5.286 → 0.5.288

package/dist/index.css

@@ -6482,6 +6482,12 @@
   .ttw\:\[\&_\[cmdk-item\]_svg\]\:w-5 [cmdk-item] svg {
     width: calc(var(--ttw-spacing) * 5);
   }
+  .ttw\:\[\&_\[data-slot\=input\]\]\:bg-background [data-slot=input] {
+    background-color: var(--ttw-background);
+  }
+  .ttw\:\[\&_\[data-slot\=select-trigger\]\]\:bg-background [data-slot=select-trigger] {
+    background-color: var(--ttw-background);
+  }
   .ttw\:\[\&_li\]\:pb-2 li {
     padding-bottom: calc(var(--ttw-spacing) * 2);
   }

package/dist/libs/tesouro-embedded-components-react/bill-pay-widget/bill-detail/feature/dist/index25.js

@@ -41,6 +41,7 @@ var g = {
 	searchFailed: "We could not load vendors. Try again.",
 	vendorDetailsFailed: "We could not load this vendor. Try again.",
 	pendingVendorDescription: "Will be created when submitted",
+	pendingVendorIncompleteDescription: "Add the missing vendor details before submitting",
 	bankAccountSaveFailed: "We could not save these payment instructions. Try again."
 }, v = {
 	attachFailed: "We could not attach that file. Try again.",
@@ -155,11 +156,17 @@ function x(e) {
 	};
 }
 var S = {
-	createTitle: "New vendor",
+	createTitle: "New vendor details",
 	editTitle: "Edit vendor",
 	switchVendorFieldLabel: "Switch to a different vendor",
+	vendorFieldLabel: "Vendor",
+	newVendorBadge: "New vendor",
+	unmatchedVendorHelper: "We couldn't match this vendor to your list. Search to choose an existing vendor, or finish adding a new one below.",
+	resultsHeading: "Your vendors",
+	addAsNewVendor: (e) => `Add "${e}" as a new vendor`,
+	addAsNewVendorDescription: "Uses the details extracted from this bill",
+	fieldsNeedAttention: (e) => `${e} ${e === 1 ? "field needs" : "fields need"} attention`,
 	nameLabel: "Business name",
-	addAddress: "Add address (optional)",
 	cancel: "Cancel",
 	save: "Save",
 	cancelAriaLabel: "Cancel vendor",

package/dist/libs/tesouro-embedded-components-react/bill-pay-widget/bill-detail/feature/dist/index27.js

@@ -1,35 +1,52 @@
+import { isStateValid as e } from "../../../../shared/util/dist/lib/usStates.js";
+import { emptyCounterpartFormValues as t, hasCounterpartFormErrors as n, validateCounterpartForm as r } from "../../../../shared/counterpart-management/feature/dist/lib/helpers.js";
+import "../../../../shared/counterpart-management/feature/dist/index.js";
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/bill-detail/feature/dist/index27.js
-function e(e) {
+function i(e) {
 	return e?.trim() ?? "";
 }
-function t(t) {
-	let n = e(t);
-	return n.length === 2 ? n.toUpperCase() : "";
+function a(t) {
+	let n = i(t).toUpperCase();
+	return e(n) ? n : "";
 }
-function n(t) {
-	let n = e(t.bank_account?.routing_number), r = e(t.bank_account?.account_number);
-	if (n || r) return {
-		accountHolderName: e(t.bank_account?.account_holder_name) || e(t.name),
+function o(e) {
+	let t = i(e.bank_account?.account_holder_name), n = i(e.bank_account?.routing_number), r = i(e.bank_account?.account_number);
+	if (t || n || r) return {
+		accountHolderName: t || i(e.name),
 		routingNumber: n,
 		accountNumber: r
 	};
 }
-function r(r) {
-	if (!r) return;
-	let i = {
-		legalName: e(r.name),
-		email: e(r.email),
-		phone: e(r.phone),
+function s(e) {
+	if (!e) return;
+	let t = {
+		legalName: i(e.name),
+		email: i(e.email),
+		phone: i(e.phone),
 		address: {
-			line1: e(r.address?.line1),
-			line2: e(r.address?.line2),
-			city: e(r.address?.city),
-			state: t(r.address?.state),
-			postalCode: e(r.address?.postal_code)
+			line1: i(e.address?.line1),
+			line2: i(e.address?.line2),
+			city: i(e.address?.city),
+			state: a(e.address?.state),
+			postalCode: i(e.address?.postal_code)
 		},
-		bankAccount: n(r)
+		bankAccount: o(e)
 	};
-	return i.legalName || i.email || i.phone || Object.values(i.address).some(Boolean) || i.bankAccount ? i : void 0;
+	return t.legalName || t.email || t.phone || Object.values(t.address).some(Boolean) || t.bankAccount ? t : void 0;
+}
+function c(e) {
+	let a = s(e);
+	if (!a || i(e?.address?.country).toUpperCase() !== "US") return !1;
+	let o = t("organization", "vendor");
+	return !n(r({
+		...o,
+		...a,
+		bankAccount: {
+			accountHolderName: i(e?.bank_account?.account_holder_name),
+			routingNumber: i(e?.bank_account?.routing_number),
+			accountNumber: i(e?.bank_account?.account_number)
+		}
+	}, "create", void 0, "vendor"));
 }
 //#endregion
-export { r as buildVendorPrefill };
+export { s as buildVendorPrefill, c as canAutoCreateVendor };

package/dist/libs/tesouro-embedded-components-react/bill-pay-widget/bill-detail/feature/dist/index28.js

@@ -5,88 +5,113 @@
 import { Button as e } from "../../../../../../packages/shared-ui-shadcn/dist/index.js";
 import { getStateOptions as t } from "../../../../shared/util/dist/lib/usStates.js";
 import { AchFieldGroup as n } from "../../../../shared/counterpart-management/ui/dist/index5.js";
-import { CounterpartFormFields as r, useFocusFirstInvalidField as i } from "../../../../shared/counterpart-management/ui/dist/index9.js";
+import { CounterpartFormFields as r, countErrors as i, useFocusFirstInvalidField as a } from "../../../../shared/counterpart-management/ui/dist/index9.js";
 import "../../../../shared/counterpart-management/ui/dist/index.js";
-import { VendorSearchCombobox as a } from "../../ui/dist/index24.js";
+import { VendorSearchCombobox as o } from "../../ui/dist/index24.js";
 import "../../ui/dist/index.js";
-import { mergeVendorInlineFormLabels as o } from "./index25.js";
+import { mergeVendorInlineFormLabels as s } from "./index25.js";
 import "../../../../shared/counterpart-management/feature/dist/index.js";
-import { useMemo as s } from "react";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { useMemo as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/bill-detail/feature/dist/index28.js
-function u({ mode: u, values: d, errors: f, onChange: p, onAddressChange: m, sectionsToExpand: h, onAddressExpand: g, onCancel: _, onSave: v, isSaving: y = !1, search: b, paymentInstructions: x, labels: S }) {
-	let C = s(() => o(S), [S]), w = s(() => t(), []), T = i(f ?? {});
-	return /* @__PURE__ */ l("div", {
-		ref: T,
-		className: "ttw:flex ttw:flex-col ttw:gap-4 ttw:rounded-lg ttw:border ttw:border-border ttw:bg-card ttw:p-4",
-		children: [
-			/* @__PURE__ */ c("p", {
-				className: "ttw:text-base ttw:font-semibold ttw:text-foreground",
-				children: u === "edit" ? C.editTitle : C.createTitle
-			}),
-			u === "edit" && b ? /* @__PURE__ */ c(a, {
-				...b,
-				labels: { fieldLabel: C.switchVendorFieldLabel }
-			}) : null,
-			/* @__PURE__ */ c(r, {
-				mode: u,
-				counterpartMode: "vendor",
-				values: d,
-				errors: f,
-				stateOptions: w,
-				onChange: p,
-				onAddressChange: m,
-				sections: {
-					entityType: !0,
-					profileHeading: !1,
-					title: !1,
-					taxId: !1,
-					address: "collapsible",
-					bankAccount: !1
-				},
-				sectionsToExpand: h,
-				onAddressExpand: g,
-				labels: { businessNameLabel: C.nameLabel }
-			}),
-			x ? /* @__PURE__ */ l("div", {
-				className: "ttw:flex ttw:flex-col ttw:gap-3",
-				children: [/* @__PURE__ */ l("div", {
-					className: "ttw:flex ttw:flex-col ttw:gap-1",
-					children: [/* @__PURE__ */ c("p", {
-						className: "ttw:text-sm ttw:font-semibold ttw:text-foreground",
-						children: C.paymentInstructionsHeading
-					}), /* @__PURE__ */ c("p", {
-						className: "ttw:text-sm ttw:text-muted-foreground",
-						children: x.isExtracted ? C.paymentInstructionsExtracted : C.paymentInstructionsDescription
+function d({ mode: d, values: f, errors: p, onChange: m, onAddressChange: h, sectionsToExpand: g, onAddressExpand: _, onCancel: v, onSave: y, isSaving: b = !1, search: x, paymentInstructions: S, labels: C }) {
+	let w = c(() => s(C), [C]), T = c(() => t(), []), E = a(p ?? {}), D = i({
+		...p,
+		form: void 0,
+		bankAccount: void 0
+	}) + i(S?.errors), O = x?.query.trim() ?? "", k = f.entityType === "individual" ? `${f.firstName} ${f.lastName}`.trim() : f.legalName, A = x && d === "create" ? /* @__PURE__ */ l(o, {
+		...x,
+		selectedLabel: k,
+		badge: w.newVendorBadge,
+		helperText: w.unmatchedVendorHelper,
+		resultsHeading: w.resultsHeading,
+		addVendorDescription: w.addAsNewVendorDescription,
+		labels: {
+			fieldLabel: w.vendorFieldLabel,
+			addVendorAction: w.addAsNewVendor(O || k)
+		}
+	}) : null;
+	return /* @__PURE__ */ u("div", {
+		ref: E,
+		className: "ttw:flex ttw:flex-col ttw:gap-4",
+		children: [A, /* @__PURE__ */ u("div", {
+			className: "ttw:flex ttw:flex-col ttw:gap-6 ttw:rounded-lg ttw:border ttw:border-primary ttw:bg-surface-subtle ttw:p-6 ttw:[&_[data-slot=input]]:bg-background ttw:[&_[data-slot=select-trigger]]:bg-background",
+			children: [
+				/* @__PURE__ */ u("div", {
+					className: "ttw:flex ttw:items-baseline ttw:justify-between ttw:gap-2",
+					children: [/* @__PURE__ */ l("p", {
+						className: "ttw:text-base ttw:font-semibold ttw:text-foreground",
+						children: d === "edit" ? w.editTitle : w.createTitle
+					}), D > 0 ? /* @__PURE__ */ l("p", {
+						className: "ttw:text-sm ttw:text-destructive",
+						children: w.fieldsNeedAttention(D)
+					}) : null]
+				}),
+				x && d === "edit" ? /* @__PURE__ */ l(o, {
+					...x,
+					labels: { fieldLabel: w.switchVendorFieldLabel }
+				}) : null,
+				/* @__PURE__ */ l(r, {
+					mode: d,
+					counterpartMode: "vendor",
+					values: f,
+					errors: p,
+					stateOptions: T,
+					onChange: m,
+					onAddressChange: h,
+					sections: {
+						entityType: !0,
+						profileHeading: !1,
+						addressHeading: !1,
+						title: !1,
+						taxId: !1,
+						address: d !== "edit" || "collapsible",
+						bankAccount: !1
+					},
+					sectionsToExpand: g,
+					onAddressExpand: _,
+					labels: { businessNameLabel: w.nameLabel }
+				}),
+				S ? /* @__PURE__ */ u("div", {
+					className: "ttw:flex ttw:flex-col ttw:gap-3",
+					children: [/* @__PURE__ */ u("div", {
+						className: "ttw:flex ttw:flex-col ttw:gap-1",
+						children: [/* @__PURE__ */ l("p", {
+							className: "ttw:text-sm ttw:font-semibold ttw:text-foreground",
+							children: w.paymentInstructionsHeading
+						}), /* @__PURE__ */ l("p", {
+							className: "ttw:text-sm ttw:text-muted-foreground",
+							children: S.isExtracted ? w.paymentInstructionsExtracted : w.paymentInstructionsDescription
+						})]
+					}), /* @__PURE__ */ l(n, {
+						idPrefix: "vendor-inline-ach",
+						values: S.values,
+						errors: S.errors,
+						onChange: S.onChange,
+						labels: w.ach
 					})]
-				}), /* @__PURE__ */ c(n, {
-					idPrefix: "vendor-inline-ach",
-					values: x.values,
-					errors: x.errors,
-					onChange: x.onChange,
-					labels: C.ach
-				})]
-			}) : null,
-			/* @__PURE__ */ l("div", {
-				className: "ttw:flex ttw:justify-end ttw:gap-2",
-				children: [/* @__PURE__ */ c(e, {
-					type: "button",
-					variant: "outline",
-					onClick: _,
-					"aria-label": C.cancelAriaLabel,
-					disabled: y,
-					children: C.cancel
-				}), v ? /* @__PURE__ */ c(e, {
-					type: "button",
-					onClick: v,
-					"aria-label": C.saveAriaLabel,
-					loading: y,
-					disabled: y,
-					children: C.save
-				}) : null]
-			})
-		]
+				}) : null,
+				/* @__PURE__ */ u("div", {
+					className: "ttw:flex ttw:justify-end ttw:gap-2",
+					children: [/* @__PURE__ */ l(e, {
+						type: "button",
+						variant: "outline",
+						onClick: v,
+						"aria-label": w.cancelAriaLabel,
+						disabled: b,
+						children: w.cancel
+					}), y ? /* @__PURE__ */ l(e, {
+						type: "button",
+						onClick: y,
+						"aria-label": w.saveAriaLabel,
+						loading: b,
+						disabled: b,
+						children: w.save
+					}) : null]
+				})
+			]
+		})]
 	});
 }
 //#endregion
-export { u as VendorInlineForm, u as default };
+export { d as VendorInlineForm, d as default };