@tesouro/embedded-components-react 0.3.24 → 0.3.25

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

@@ -1,58 +1,99 @@
-import { Typography as e } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
-import { VendorSummaryCard as t } from "./index32.js";
-import "./index33.js";
-import { VendorSearchCombobox as n } from "./index35.js";
-import "./index36.js";
-import { VENDOR_SECTION_LABELS_EN as r } from "./index37.js";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Command as e, CommandGroup as t, CommandInput as n, CommandItem as r, CommandList as i, CommandSeparator as a, Label as o, Popover as s, PopoverContent as c, PopoverTrigger as l, Skeleton as u, cn as d } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import { VENDOR_SEARCH_COMBOBOX_LABELS_EN as f } from "./index37.js";
+import { useId as p, useState as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { ChevronDown as _, Plus as v } from "lucide-react";
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index38.js
-function o(o) {
-	let { onEdit: s, onClear: c, error: l, testId: u, labels: d, disabled: f } = o, p = {
-		...r,
-		...d,
-		summaryCard: {
-			...r.summaryCard,
-			...d?.summaryCard,
-			ach: {
-				...r.summaryCard.ach,
-				...d?.summaryCard?.ach
-			}
-		},
-		search: {
-			...r.search,
-			...d?.search
-		}
-	};
-	return /* @__PURE__ */ a("section", {
-		className: "ttw:flex ttw:flex-col ttw:gap-3",
-		"data-testid": u,
-		children: [
-			/* @__PURE__ */ i(e, {
-				component: "h2",
-				variant: "h6",
-				className: "ttw:font-semibold",
-				children: p.heading
-			}),
-			o.mode === "resolved" ? /* @__PURE__ */ i(t, {
-				summary: o.summary,
-				onEdit: s,
-				onClear: c,
-				paymentInstructions: f ? void 0 : o.paymentInstructions,
-				labels: p.summaryCard
-			}) : f ? /* @__PURE__ */ i(e, {
-				variant: "body2",
-				className: "ttw:text-muted-foreground",
-				children: p.noVendorPlaceholder
-			}) : o.mode === "selecting" ? /* @__PURE__ */ i(n, {
-				...o.search,
-				labels: p.search
-			}) : o.newVendorForm,
-			l ? /* @__PURE__ */ i("p", {
-				className: "ttw:text-sm ttw:text-destructive",
-				children: l
-			}) : null
-		]
+var y = 5, b = "ttw:min-h-44";
+function x({ query: x, onQueryChange: S, results: C, isLoading: w, onAddVendor: T, testId: E, labels: D }) {
+	let O = {
+		...f,
+		...D
+	}, k = p(), [A, j] = m(!1);
+	return /* @__PURE__ */ g("div", {
+		className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+		"data-testid": E,
+		children: [/* @__PURE__ */ h(o, {
+			htmlFor: k,
+			children: O.fieldLabel
+		}), /* @__PURE__ */ g(s, {
+			open: A,
+			onOpenChange: j,
+			children: [/* @__PURE__ */ h(l, {
+				asChild: !0,
+				children: /* @__PURE__ */ g("button", {
+					type: "button",
+					id: k,
+					role: "combobox",
+					"aria-expanded": A,
+					className: "ttw:flex ttw:h-10 ttw:w-full ttw:items-center ttw:justify-between ttw:gap-2 ttw:rounded-md ttw:border ttw:border-border ttw:bg-background ttw:px-3 ttw:text-left ttw:text-sm ttw:shadow-xs ttw:outline-none ttw:focus-visible:border-ring ttw:focus-visible:ring-[3px] ttw:focus-visible:ring-ring/50",
+					children: [/* @__PURE__ */ h("span", {
+						className: "ttw:min-w-0 ttw:flex-1 ttw:truncate ttw:text-muted-foreground",
+						children: O.triggerPlaceholder
+					}), /* @__PURE__ */ h(_, {
+						"aria-hidden": !0,
+						className: "ttw:size-4 ttw:shrink-0 ttw:opacity-50"
+					})]
+				})
+			}), /* @__PURE__ */ h(c, {
+				align: "start",
+				className: "ttw:w-[var(--radix-popover-trigger-width)] ttw:p-0",
+				children: /* @__PURE__ */ g(e, {
+					shouldFilter: !1,
+					children: [/* @__PURE__ */ h(n, {
+						value: x,
+						onValueChange: S,
+						placeholder: O.placeholder,
+						"aria-label": O.placeholder
+					}), /* @__PURE__ */ g(i, {
+						className: d("ttw:max-h-72", b),
+						children: [
+							w ? /* @__PURE__ */ g("div", {
+								className: "ttw:flex ttw:flex-col ttw:gap-2 ttw:p-2",
+								"aria-busy": "true",
+								children: [/* @__PURE__ */ h("span", {
+									className: "ttw:sr-only",
+									children: O.loading
+								}), Array.from({ length: y }).map((e, t) => /* @__PURE__ */ g("div", {
+									className: "ttw:flex ttw:items-center ttw:justify-between ttw:gap-4 ttw:px-2 ttw:py-1.5",
+									children: [/* @__PURE__ */ h(u, {
+										height: 14,
+										width: "55%"
+									}), /* @__PURE__ */ h(u, {
+										height: 14,
+										width: "30%"
+									})]
+								}, t))]
+							}) : x ? C.length === 0 ? /* @__PURE__ */ h("div", {
+								className: d("ttw:flex ttw:items-center ttw:justify-center ttw:py-6 ttw:text-center ttw:text-sm", b),
+								children: O.emptyResults
+							}) : /* @__PURE__ */ h(t, { children: C.map((e, t) => /* @__PURE__ */ g(r, {
+								value: `${e.name} ${e.email} ${t}`,
+								onSelect: () => e.onSelect(),
+								children: [/* @__PURE__ */ h("span", {
+									className: "ttw:text-foreground",
+									children: e.name
+								}), /* @__PURE__ */ h("span", {
+									className: "ttw:ml-auto ttw:text-muted-foreground",
+									children: e.email
+								})]
+							}, `${e.name}:${e.email}:${t}`)) }) : /* @__PURE__ */ h("div", {
+								className: d("ttw:flex ttw:items-center ttw:justify-center ttw:py-6 ttw:text-center ttw:text-sm ttw:text-muted-foreground", b),
+								children: O.searchHint
+							}),
+							/* @__PURE__ */ h(a, {}),
+							/* @__PURE__ */ g(r, {
+								value: "__add_vendor__",
+								onSelect: T,
+								className: "ttw:sticky ttw:bottom-0 ttw:bg-popover ttw:text-primary",
+								children: [/* @__PURE__ */ h(v, { className: "ttw:size-4 ttw:text-primary" }), O.addVendorAction]
+							})
+						]
+					})]
+				})
+			})]
+		})]
 	});
 }
 //#endregion
-export { o as VendorSection, o as default };
+export { x as VendorSearchCombobox, x as default };

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

@@ -1,54 +1,13 @@
-import { BILL_DETAIL_BODY_LABELS_EN as e, mergeBillDetailBodyLabels as t } from "./index22.js";
-import "./index24.js";
-import { BILL_FORM_FIELDS_LABELS_EN as n } from "./index25.js";
-import "./index27.js";
-import { LINE_ITEMS_SECTION_LABELS_EN as r } from "./index28.js";
-import "./index30.js";
-import { VENDOR_SECTION_LABELS_EN as i } from "./index37.js";
+import { VENDOR_SUMMARY_CARD_LABELS_EN as e } from "./index34.js";
+import "./index36.js";
+import { VENDOR_SEARCH_COMBOBOX_LABELS_EN as t } from "./index37.js";
 import "./index39.js";
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index40.js
-var a = {
-	closeButton: "Close",
-	menuTrigger: "More actions",
-	cancelButton: "Cancel",
-	saveDraftButton: "Save and close",
-	finalizeButton: "Finalize",
-	hiddenDescription: "Enter the details of the bill you want to pay.",
-	vendorSection: i,
-	detailsFields: n,
-	lineItems: r,
-	detailBody: e
+var n = {
+	heading: "Who are you paying?",
+	summaryCard: e,
+	search: t,
+	noVendorPlaceholder: "No vendor selected"
 };
-function o(e) {
-	return {
-		...a,
-		...e,
-		vendorSection: {
-			...a.vendorSection,
-			...e?.vendorSection,
-			summaryCard: {
-				...a.vendorSection.summaryCard,
-				...e?.vendorSection?.summaryCard,
-				ach: {
-					...a.vendorSection.summaryCard.ach,
-					...e?.vendorSection?.summaryCard?.ach
-				}
-			},
-			search: {
-				...a.vendorSection.search,
-				...e?.vendorSection?.search
-			}
-		},
-		detailsFields: {
-			...a.detailsFields,
-			...e?.detailsFields
-		},
-		lineItems: {
-			...a.lineItems,
-			...e?.lineItems
-		},
-		detailBody: t(e?.detailBody)
-	};
-}
 //#endregion
-export { a as BILL_CREATE_SCREEN_LABELS_EN, o as mergeBillCreateScreenLabels };
+export { n as VENDOR_SECTION_LABELS_EN };

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

@@ -1,142 +1,58 @@
-import { Button as e, Dialog as t, DialogContent as n, DialogDescription as r, DialogHeader as i, DialogTitle as a, DropdownMenu as o, DropdownMenuContent as s, DropdownMenuItem as c, DropdownMenuTrigger as l } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
-import { InlineErrorAlert as u } from "../../../shared/ui/dist/lib/InlineErrorAlert/InlineErrorAlert.js";
-import "../../../shared/ui/dist/index.js";
-import { BillDetailBody as d } from "./index23.js";
-import "./index24.js";
-import { BillFormFields as f } from "./index26.js";
-import "./index27.js";
-import { LineItemsSection as p } from "./index29.js";
-import "./index30.js";
-import { VendorSection as m } from "./index38.js";
+import { Typography as e } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import { VendorSummaryCard as t } from "./index35.js";
+import "./index36.js";
+import { VendorSearchCombobox as n } from "./index38.js";
 import "./index39.js";
-import { mergeBillCreateScreenLabels as h } from "./index40.js";
-import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
-import { MoreVertical as y, X as b } from "lucide-react";
+import { VENDOR_SECTION_LABELS_EN as r } from "./index40.js";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index41.js
-function x({ open: x, onOpenChange: S, title: C, subtitle: w, notice: T, vendor: E, values: D, errors: O, onChange: k, lineItems: A, documentPanel: j, menuItems: M, readOnly: N, detail: P, isLineItemsLoading: F, isSaving: I, isSavingDraft: L, isFinalizing: R, onCancel: z, onSaveDraft: B, onFinalize: V, testId: H, labels: U }) {
-	let W = h(U), G = !!(N && P);
-	return /* @__PURE__ */ _(t, {
-		open: x,
-		onOpenChange: S,
-		children: /* @__PURE__ */ v(n, {
-			showCloseButton: !1,
-			className: "ttw:flex ttw:h-[calc(100vh-3rem)] ttw:w-[calc(100vw-3rem)] ttw:max-w-[calc(100vw-3rem)] ttw:flex-col ttw:gap-0 ttw:p-0",
-			"data-testid": H,
-			children: [
-				/* @__PURE__ */ v(i, {
-					className: "ttw:flex ttw:flex-row ttw:items-start ttw:justify-between ttw:border-b ttw:border-border ttw:px-6 ttw:py-4",
-					children: [/* @__PURE__ */ v("div", {
-						className: "ttw:flex ttw:flex-col ttw:gap-0.5",
-						children: [
-							/* @__PURE__ */ _(a, {
-								className: "ttw:text-xl ttw:font-semibold",
-								children: C
-							}),
-							w ? /* @__PURE__ */ _("p", {
-								className: "ttw:text-sm ttw:text-muted-foreground",
-								children: w
-							}) : null,
-							/* @__PURE__ */ _(r, {
-								className: "ttw:sr-only",
-								children: W.hiddenDescription
-							})
-						]
-					}), /* @__PURE__ */ v("div", {
-						className: "ttw:flex ttw:items-center ttw:gap-1",
-						children: [M && M.length > 0 ? /* @__PURE__ */ v(o, { children: [/* @__PURE__ */ _(l, {
-							asChild: !0,
-							children: /* @__PURE__ */ _(e, {
-								type: "button",
-								variant: "ghost",
-								size: "icon",
-								"aria-label": W.menuTrigger,
-								disabled: I,
-								children: /* @__PURE__ */ _(y, { className: "ttw:size-4" })
-							})
-						}), /* @__PURE__ */ _(s, {
-							align: "end",
-							children: M.map((e) => /* @__PURE__ */ _(c, {
-								variant: e.destructive ? "destructive" : void 0,
-								onSelect: e.onSelect,
-								children: e.label
-							}, e.id))
-						})] }) : null, /* @__PURE__ */ _(e, {
-							type: "button",
-							variant: "ghost",
-							size: "icon",
-							"aria-label": W.closeButton,
-							disabled: I,
-							onClick: z,
-							children: /* @__PURE__ */ _(b, { className: "ttw:size-4" })
-						})]
-					})]
-				}),
-				/* @__PURE__ */ v("div", {
-					className: "ttw:grid ttw:flex-1 ttw:grid-cols-2 ttw:overflow-hidden",
-					children: [/* @__PURE__ */ v("div", {
-						className: "ttw:flex ttw:flex-col ttw:gap-6 ttw:overflow-y-auto ttw:px-6 ttw:py-6",
-						children: [
-							O?.form ? /* @__PURE__ */ _(u, { children: O.form }) : null,
-							T ? /* @__PURE__ */ _("div", {
-								className: "ttw:flex ttw:flex-col ttw:gap-3",
-								children: T
-							}) : null,
-							G ? /* @__PURE__ */ _(d, {
-								...P,
-								labels: W.detailBody
-							}) : /* @__PURE__ */ v(g, { children: [
-								/* @__PURE__ */ _(m, {
-									...E,
-									onEdit: N ? void 0 : E.onEdit,
-									onClear: N ? void 0 : E.onClear,
-									disabled: N,
-									labels: W.vendorSection
-								}),
-								/* @__PURE__ */ _(f, {
-									values: D,
-									errors: O,
-									onChange: k,
-									disabled: N,
-									labels: W.detailsFields
-								}),
-								/* @__PURE__ */ _(p, {
-									...A,
-									disabled: A.disabled || F || N,
-									labels: W.lineItems
-								})
-							] })
-						]
-					}), /* @__PURE__ */ _("div", {
-						className: "ttw:overflow-y-auto ttw:bg-muted/30 ttw:px-6 ttw:py-6",
-						children: j
-					})]
-				}),
-				G ? null : /* @__PURE__ */ v("div", {
-					className: "ttw:flex ttw:justify-end ttw:gap-2 ttw:border-t ttw:border-border ttw:px-6 ttw:py-4",
-					children: [/* @__PURE__ */ _(e, {
-						type: "button",
-						variant: "ghost",
-						disabled: I,
-						onClick: z,
-						children: N ? W.closeButton : W.cancelButton
-					}), N ? null : /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(e, {
-						type: "button",
-						variant: "secondary",
-						onClick: B,
-						loading: L,
-						disabled: R || F || E.mode === "creating",
-						children: W.saveDraftButton
-					}), /* @__PURE__ */ _(e, {
-						type: "button",
-						onClick: V,
-						loading: R,
-						disabled: L || F || E.mode === "creating",
-						children: W.finalizeButton
-					})] })]
-				})
-			]
-		})
+function o(o) {
+	let { onEdit: s, onClear: c, error: l, testId: u, labels: d, disabled: f } = o, p = {
+		...r,
+		...d,
+		summaryCard: {
+			...r.summaryCard,
+			...d?.summaryCard,
+			ach: {
+				...r.summaryCard.ach,
+				...d?.summaryCard?.ach
+			}
+		},
+		search: {
+			...r.search,
+			...d?.search
+		}
+	};
+	return /* @__PURE__ */ a("section", {
+		className: "ttw:flex ttw:flex-col ttw:gap-3",
+		"data-testid": u,
+		children: [
+			/* @__PURE__ */ i(e, {
+				component: "h2",
+				variant: "h6",
+				className: "ttw:font-semibold",
+				children: p.heading
+			}),
+			o.mode === "resolved" ? /* @__PURE__ */ i(t, {
+				summary: o.summary,
+				onEdit: s,
+				onClear: c,
+				paymentInstructions: f ? void 0 : o.paymentInstructions,
+				labels: p.summaryCard
+			}) : f ? /* @__PURE__ */ i(e, {
+				variant: "body2",
+				className: "ttw:text-muted-foreground",
+				children: p.noVendorPlaceholder
+			}) : o.mode === "selecting" ? /* @__PURE__ */ i(n, {
+				...o.search,
+				labels: p.search
+			}) : o.newVendorForm,
+			l ? /* @__PURE__ */ i("p", {
+				className: "ttw:text-sm ttw:text-destructive",
+				children: l
+			}) : null
+		]
 	});
 }
 //#endregion
-export { x as BillCreateScreen, x as default };
+export { o as VendorSection, o as default };

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

@@ -1,4 +1,54 @@
+import { BILL_DETAIL_BODY_LABELS_EN as e, mergeBillDetailBodyLabels as t } from "./index25.js";
+import "./index27.js";
+import { BILL_FORM_FIELDS_LABELS_EN as n } from "./index28.js";
+import "./index30.js";
+import { LINE_ITEMS_SECTION_LABELS_EN as r } from "./index31.js";
+import "./index33.js";
+import { VENDOR_SECTION_LABELS_EN as i } from "./index40.js";
+import "./index42.js";
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index43.js
-var e = { description: "Review, approve, and pay your bills." };
+var a = {
+	closeButton: "Close",
+	menuTrigger: "More actions",
+	cancelButton: "Cancel",
+	saveDraftButton: "Save and close",
+	finalizeButton: "Finalize",
+	hiddenDescription: "Enter the details of the bill you want to pay.",
+	vendorSection: i,
+	detailsFields: n,
+	lineItems: r,
+	detailBody: e
+};
+function o(e) {
+	return {
+		...a,
+		...e,
+		vendorSection: {
+			...a.vendorSection,
+			...e?.vendorSection,
+			summaryCard: {
+				...a.vendorSection.summaryCard,
+				...e?.vendorSection?.summaryCard,
+				ach: {
+					...a.vendorSection.summaryCard.ach,
+					...e?.vendorSection?.summaryCard?.ach
+				}
+			},
+			search: {
+				...a.vendorSection.search,
+				...e?.vendorSection?.search
+			}
+		},
+		detailsFields: {
+			...a.detailsFields,
+			...e?.detailsFields
+		},
+		lineItems: {
+			...a.lineItems,
+			...e?.lineItems
+		},
+		detailBody: t(e?.detailBody)
+	};
+}
 //#endregion
-export { e as DEFAULT_LABELS };
+export { a as BILL_CREATE_SCREEN_LABELS_EN, o as mergeBillCreateScreenLabels };

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

@@ -1,41 +1,142 @@
-"use client";
-"use client";
-"use client";
-"use client";
-import { Tabs as e, TabsContent as t, TabsList as n, TabsTrigger as r } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
-import { DEFAULT_LABELS as i } from "./index43.js";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Button as e, Dialog as t, DialogContent as n, DialogDescription as r, DialogHeader as i, DialogTitle as a, DropdownMenu as o, DropdownMenuContent as s, DropdownMenuItem as c, DropdownMenuTrigger as l } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import { InlineErrorAlert as u } from "../../../shared/ui/dist/lib/InlineErrorAlert/InlineErrorAlert.js";
+import "../../../shared/ui/dist/index.js";
+import { BillDetailBody as d } from "./index26.js";
+import "./index27.js";
+import { BillFormFields as f } from "./index29.js";
+import "./index30.js";
+import { LineItemsSection as p } from "./index32.js";
+import "./index33.js";
+import { VendorSection as m } from "./index41.js";
+import "./index42.js";
+import { mergeBillCreateScreenLabels as h } from "./index43.js";
+import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
+import { MoreVertical as y, X as b } from "lucide-react";
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index44.js
-function s({ labels: s, tabs: c, selectedTabId: l, onTabChange: u }) {
-	let d = {
-		...i,
-		...s
-	};
-	return /* @__PURE__ */ o("section", {
-		className: "ttw:w-full ttw:space-y-5",
-		children: [/* @__PURE__ */ a("div", {
-			className: "ttw:min-w-0",
-			children: /* @__PURE__ */ a("p", {
-				className: "ttw:text-sm ttw:text-muted-foreground",
-				children: d.description
-			})
-		}), /* @__PURE__ */ o(e, {
-			value: l,
-			onValueChange: u,
-			className: "ttw:w-full",
-			children: [/* @__PURE__ */ a(n, {
-				variant: "line",
-				children: c.map((e) => /* @__PURE__ */ a(r, {
-					value: e.id,
-					children: e.label
-				}, e.id))
-			}), c.map((e) => /* @__PURE__ */ a(t, {
-				value: e.id,
-				className: "ttw:mt-6",
-				children: e.content
-			}, e.id))]
-		})]
+function x({ open: x, onOpenChange: S, title: C, subtitle: w, notice: T, vendor: E, values: D, errors: O, onChange: k, lineItems: A, documentPanel: j, menuItems: M, readOnly: N, detail: P, isLineItemsLoading: F, isSaving: I, isSavingDraft: L, isFinalizing: R, onCancel: z, onSaveDraft: B, onFinalize: V, testId: H, labels: U }) {
+	let W = h(U), G = !!(N && P);
+	return /* @__PURE__ */ _(t, {
+		open: x,
+		onOpenChange: S,
+		children: /* @__PURE__ */ v(n, {
+			showCloseButton: !1,
+			className: "ttw:flex ttw:h-[calc(100vh-3rem)] ttw:w-[calc(100vw-3rem)] ttw:max-w-[calc(100vw-3rem)] ttw:flex-col ttw:gap-0 ttw:p-0",
+			"data-testid": H,
+			children: [
+				/* @__PURE__ */ v(i, {
+					className: "ttw:flex ttw:flex-row ttw:items-start ttw:justify-between ttw:border-b ttw:border-border ttw:px-6 ttw:py-4",
+					children: [/* @__PURE__ */ v("div", {
+						className: "ttw:flex ttw:flex-col ttw:gap-0.5",
+						children: [
+							/* @__PURE__ */ _(a, {
+								className: "ttw:text-xl ttw:font-semibold",
+								children: C
+							}),
+							w ? /* @__PURE__ */ _("p", {
+								className: "ttw:text-sm ttw:text-muted-foreground",
+								children: w
+							}) : null,
+							/* @__PURE__ */ _(r, {
+								className: "ttw:sr-only",
+								children: W.hiddenDescription
+							})
+						]
+					}), /* @__PURE__ */ v("div", {
+						className: "ttw:flex ttw:items-center ttw:gap-1",
+						children: [M && M.length > 0 ? /* @__PURE__ */ v(o, { children: [/* @__PURE__ */ _(l, {
+							asChild: !0,
+							children: /* @__PURE__ */ _(e, {
+								type: "button",
+								variant: "ghost",
+								size: "icon",
+								"aria-label": W.menuTrigger,
+								disabled: I,
+								children: /* @__PURE__ */ _(y, { className: "ttw:size-4" })
+							})
+						}), /* @__PURE__ */ _(s, {
+							align: "end",
+							children: M.map((e) => /* @__PURE__ */ _(c, {
+								variant: e.destructive ? "destructive" : void 0,
+								onSelect: e.onSelect,
+								children: e.label
+							}, e.id))
+						})] }) : null, /* @__PURE__ */ _(e, {
+							type: "button",
+							variant: "ghost",
+							size: "icon",
+							"aria-label": W.closeButton,
+							disabled: I,
+							onClick: z,
+							children: /* @__PURE__ */ _(b, { className: "ttw:size-4" })
+						})]
+					})]
+				}),
+				/* @__PURE__ */ v("div", {
+					className: "ttw:grid ttw:flex-1 ttw:grid-cols-2 ttw:overflow-hidden",
+					children: [/* @__PURE__ */ v("div", {
+						className: "ttw:flex ttw:flex-col ttw:gap-6 ttw:overflow-y-auto ttw:px-6 ttw:py-6",
+						children: [
+							O?.form ? /* @__PURE__ */ _(u, { children: O.form }) : null,
+							T ? /* @__PURE__ */ _("div", {
+								className: "ttw:flex ttw:flex-col ttw:gap-3",
+								children: T
+							}) : null,
+							G ? /* @__PURE__ */ _(d, {
+								...P,
+								labels: W.detailBody
+							}) : /* @__PURE__ */ v(g, { children: [
+								/* @__PURE__ */ _(m, {
+									...E,
+									onEdit: N ? void 0 : E.onEdit,
+									onClear: N ? void 0 : E.onClear,
+									disabled: N,
+									labels: W.vendorSection
+								}),
+								/* @__PURE__ */ _(f, {
+									values: D,
+									errors: O,
+									onChange: k,
+									disabled: N,
+									labels: W.detailsFields
+								}),
+								/* @__PURE__ */ _(p, {
+									...A,
+									disabled: A.disabled || F || N,
+									labels: W.lineItems
+								})
+							] })
+						]
+					}), /* @__PURE__ */ _("div", {
+						className: "ttw:overflow-y-auto ttw:bg-muted/30 ttw:px-6 ttw:py-6",
+						children: j
+					})]
+				}),
+				G ? null : /* @__PURE__ */ v("div", {
+					className: "ttw:flex ttw:justify-end ttw:gap-2 ttw:border-t ttw:border-border ttw:px-6 ttw:py-4",
+					children: [/* @__PURE__ */ _(e, {
+						type: "button",
+						variant: "ghost",
+						disabled: I,
+						onClick: z,
+						children: N ? W.closeButton : W.cancelButton
+					}), N ? null : /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(e, {
+						type: "button",
+						variant: "secondary",
+						onClick: B,
+						loading: L,
+						disabled: R || F || E.mode === "creating",
+						children: W.saveDraftButton
+					}), /* @__PURE__ */ _(e, {
+						type: "button",
+						onClick: V,
+						loading: R,
+						disabled: L || F || E.mode === "creating",
+						children: W.finalizeButton
+					})] })]
+				})
+			]
+		})
 	});
 }
 //#endregion
-export { s as BillPayWidgetUi };
+export { x as BillCreateScreen, x as default };