@tesouro/embedded-components-react 0.5.258 → 0.5.260

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

@@ -1,498 +1,502 @@
-import { Alert as e, AlertDescription as t, Button as n, Checkbox as r, Field as i, FieldContent as a, FieldError as o, FieldLabel as s, Input as c, InputGroup as l, InputGroupAddon as u, InputGroupInput as d, Label as f, RadioGroup as p, RadioGroupItem as m, Select as h, SelectContent as g, SelectItem as _, SelectTrigger as v, SelectValue as y, Separator as b, Sheet as x, SheetContent as S, SheetDescription as C, SheetFooter as w, SheetHeader as T, SheetTitle as ee, Spinner as te, Typography as E, cn as D } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
-import { RECEIVABLE_FORM_SHEET_LABELS_EN as ne } from "./index13.js";
-import { ReceivableFormTotals as re } from "./index36.js";
-import { ReceivableNotesSection as O } from "./index37.js";
-import { useId as ie } from "react";
-import { jsx as k, jsxs as A } from "react/jsx-runtime";
-import { MinusIcon as j, PlusIcon as M, Trash2Icon as N } from "lucide-react";
+import { Alert as e, AlertDescription as t, Button as n, Checkbox as r, Dialog as i, DialogContent as a, DialogDescription as o, DialogFooter as s, DialogHeader as c, DialogTitle as l, Field as u, FieldContent as d, FieldError as f, FieldLabel as p, Input as m, Label as h, Select as g, SelectContent as _, SelectItem as v, SelectTrigger as y, SelectValue as b, Separator as x, Spinner as S, Typography as C, cn as w } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import { RECEIVABLE_FORM_DIALOG_LABELS_EN as ee } from "./index13.js";
+import { ReceivableFormTotals as te } from "./index36.js";
+import { ReceivableNotesSection as T } from "./index37.js";
+import { useId as ne } from "react";
+import { Fragment as re, jsx as E, jsxs as D } from "react/jsx-runtime";
+import { MinusIcon as O, PlusIcon as k, Trash2Icon as A, XIcon as ie } from "lucide-react";
 //#region ../../libs/tesouro-embedded-components-react/invoicing-widget/ui/dist/index38.js
-var P = "__none__", F = "__manage__";
-function I({ message: e }) {
-	return e ? /* @__PURE__ */ k("p", {
+var j = "__none__", M = "__manage__", N = "ttw:flex ttw:h-9 ttw:min-w-0 ttw:items-center ttw:rounded-md ttw:border ttw:border-input ttw:shadow-xs ttw:transition-[color,box-shadow] ttw:has-[input:focus-visible]:border-ring ttw:has-[input:focus-visible]:ring-[3px] ttw:has-[input:focus-visible]:ring-ring/50 ttw:has-[[aria-invalid=true]]:border-destructive", P = "ttw:h-full ttw:min-w-0 ttw:flex-1 ttw:bg-transparent ttw:text-right ttw:text-base ttw:outline-none ttw:placeholder:text-muted-foreground ttw:disabled:cursor-not-allowed ttw:disabled:opacity-50 ttw:md:text-sm", F = "ttw:flex ttw:items-center ttw:text-sm ttw:font-medium ttw:text-muted-foreground ttw:select-none", I = "ttw:flex ttw:size-6 ttw:shrink-0 ttw:cursor-pointer ttw:items-center ttw:justify-center ttw:rounded-[calc(var(--radius)-5px)] ttw:text-muted-foreground ttw:outline-none ttw:transition-all ttw:hover:bg-accent ttw:hover:text-accent-foreground ttw:focus-visible:ring-[3px] ttw:focus-visible:ring-ring/50 ttw:disabled:pointer-events-none ttw:disabled:opacity-50";
+function L({ message: e }) {
+	return e ? /* @__PURE__ */ E("p", {
 		className: "ttw:text-sm ttw:text-destructive",
 		children: e
 	}) : null;
 }
-function L({ formId: e, lineItem: t, errors: i, controls: a, focusOnMount: o, canRemove: s, unitOptions: c, currencySymbol: f, labels: p, renderProductSelector: m, onChange: b, onCommit: x, onQuantityStep: S, onManageUnits: C, onRemove: w }) {
-	let T = `${e}-line-${t.id}`;
-	return /* @__PURE__ */ A("li", {
+function ae({ formId: e, lineItem: t, errors: i, controls: a, focusOnMount: o, canRemove: s, unitOptions: c, currencySymbol: l, labels: u, renderProductSelector: d, onChange: f, onCommit: p, onQuantityStep: m, onManageUnits: h, onRemove: x }) {
+	let S = `${e}-line-${t.id}`;
+	return /* @__PURE__ */ D("li", {
 		className: "ttw:flex ttw:h-9 ttw:items-center ttw:gap-2.5",
 		children: [
-			/* @__PURE__ */ k("div", {
+			/* @__PURE__ */ E("div", {
 				className: "ttw:min-w-30 ttw:flex-1",
-				children: m(t, {
-					inputId: `${T}-name`,
+				children: d(t, {
+					inputId: `${S}-name`,
 					invalid: !!i?.name,
 					focusOnMount: o
 				})
 			}),
-			/* @__PURE__ */ A("div", {
-				className: D("ttw:flex ttw:h-9 ttw:w-26 ttw:min-w-26 ttw:items-center ttw:rounded-md ttw:border ttw:border-input ttw:shadow-xs", i?.quantity && "ttw:border-destructive"),
+			/* @__PURE__ */ D("div", {
+				className: w(N, "ttw:w-26 ttw:min-w-26 ttw:px-[0.3rem]"),
 				children: [
-					/* @__PURE__ */ k("button", {
+					/* @__PURE__ */ E("button", {
 						type: "button",
-						"aria-label": p.decreaseQuantityButton,
+						"aria-label": u.decreaseQuantityButton,
 						disabled: a ? !a.canDecreaseQuantity : !1,
-						className: "ttw:flex ttw:size-6 ttw:shrink-0 ttw:items-center ttw:justify-center ttw:rounded-sm ttw:text-muted-foreground ttw:hover:bg-accent ttw:disabled:pointer-events-none ttw:disabled:opacity-50",
-						onClick: () => S(-1),
-						children: /* @__PURE__ */ k(j, { className: "ttw:size-3.5" })
+						className: I,
+						onClick: () => m(-1),
+						children: /* @__PURE__ */ E(O, { className: "ttw:size-3.5" })
 					}),
-					/* @__PURE__ */ k("input", {
-						id: `${T}-quantity`,
-						"aria-label": p.quantityLabel,
+					/* @__PURE__ */ E("input", {
+						id: `${S}-quantity`,
+						"aria-label": u.quantityLabel,
 						"aria-invalid": !!i?.quantity || void 0,
 						type: "text",
 						inputMode: "decimal",
 						className: "ttw:h-full ttw:w-full ttw:min-w-0 ttw:bg-transparent ttw:px-0 ttw:text-center ttw:text-sm ttw:outline-none",
 						value: t.quantity,
-						onChange: (e) => b({ quantity: e.target.value }),
-						onBlur: () => x("quantity")
+						onChange: (e) => f({ quantity: e.target.value }),
+						onBlur: () => p("quantity")
 					}),
-					/* @__PURE__ */ k("button", {
+					/* @__PURE__ */ E("button", {
 						type: "button",
-						"aria-label": p.increaseQuantityButton,
+						"aria-label": u.increaseQuantityButton,
 						disabled: a ? !a.canIncreaseQuantity : !1,
-						className: "ttw:flex ttw:size-6 ttw:shrink-0 ttw:items-center ttw:justify-center ttw:rounded-sm ttw:text-muted-foreground ttw:hover:bg-accent ttw:disabled:pointer-events-none ttw:disabled:opacity-50",
-						onClick: () => S(1),
-						children: /* @__PURE__ */ k(M, { className: "ttw:size-3.5" })
+						className: I,
+						onClick: () => m(1),
+						children: /* @__PURE__ */ E(k, { className: "ttw:size-3.5" })
 					})
 				]
 			}),
-			/* @__PURE__ */ A(h, {
-				value: t.unit || P,
+			/* @__PURE__ */ D(g, {
+				value: t.unit || j,
 				onValueChange: (e) => {
-					if (e === F) {
-						C?.();
+					if (e === M) {
+						h?.();
 						return;
 					}
-					b({ unit: e === P ? "" : e });
+					f({ unit: e === j ? "" : e });
 				},
-				children: [/* @__PURE__ */ k(v, {
-					id: `${T}-unit`,
-					"aria-label": p.unitLabel,
+				children: [/* @__PURE__ */ E(y, {
+					id: `${S}-unit`,
+					"aria-label": u.unitLabel,
 					"aria-invalid": !!i?.measureUnit || void 0,
 					className: "ttw:w-22",
-					children: /* @__PURE__ */ k(y, {
+					children: /* @__PURE__ */ E(b, {
 						className: "ttw:truncate",
-						placeholder: p.unitPlaceholder
+						placeholder: u.unitPlaceholder
 					})
-				}), /* @__PURE__ */ A(g, { children: [
-					C && /* @__PURE__ */ A(_, {
-						value: F,
+				}), /* @__PURE__ */ D(_, { children: [
+					h && /* @__PURE__ */ D(v, {
+						value: M,
 						className: "ttw:font-semibold ttw:text-primary ttw:hover:text-primary ttw:focus:text-primary",
-						children: [/* @__PURE__ */ k(M, { className: "ttw:text-primary" }), p.manageUnitsOption]
+						children: [/* @__PURE__ */ E(k, { className: "ttw:text-primary" }), u.manageUnitsOption]
 					}),
-					/* @__PURE__ */ k(_, {
-						value: P,
-						children: p.unitNone
+					/* @__PURE__ */ E(v, {
+						value: j,
+						children: u.unitNone
 					}),
-					c.map((e) => /* @__PURE__ */ k(_, {
+					c.map((e) => /* @__PURE__ */ E(v, {
 						value: e.value,
 						children: e.label
 					}, e.value))
 				] })]
 			}),
-			/* @__PURE__ */ A(l, {
-				className: "ttw:w-full ttw:max-w-41 ttw:min-w-29",
-				children: [/* @__PURE__ */ k(u, {
-					align: "inline-start",
-					children: f
-				}), /* @__PURE__ */ k(d, {
-					id: `${T}-price`,
-					"aria-label": p.priceLabel,
+			/* @__PURE__ */ D("div", {
+				className: w(N, "ttw:w-full ttw:max-w-41 ttw:min-w-29"),
+				children: [/* @__PURE__ */ E("span", {
+					className: w(F, "ttw:pl-3"),
+					children: l
+				}), /* @__PURE__ */ E("input", {
+					id: `${S}-price`,
+					"aria-label": u.priceLabel,
 					"aria-invalid": !!i?.price || void 0,
-					"data-has-start-addon": !0,
 					type: "text",
 					inputMode: "decimal",
-					className: "ttw:text-right",
+					className: w(P, "ttw:pr-3 ttw:pl-2"),
 					value: t.price,
-					onChange: (e) => b({ price: e.target.value }),
-					onBlur: () => x("price")
+					onChange: (e) => f({ price: e.target.value }),
+					onBlur: () => p("price")
 				})]
 			}),
-			/* @__PURE__ */ k("div", {
+			/* @__PURE__ */ E("div", {
 				className: "ttw:flex ttw:w-12 ttw:min-w-12 ttw:items-center ttw:justify-center",
-				children: /* @__PURE__ */ k(r, {
-					id: `${T}-taxable`,
-					"aria-label": p.taxableLabel,
+				children: /* @__PURE__ */ E(r, {
+					id: `${S}-taxable`,
+					"aria-label": u.taxableLabel,
 					checked: t.taxable,
-					onCheckedChange: (e) => b({ taxable: e === !0 })
+					onCheckedChange: (e) => f({ taxable: e === !0 })
 				})
 			}),
-			s && /* @__PURE__ */ k(n, {
+			s && /* @__PURE__ */ E(n, {
 				type: "button",
 				variant: "ghost",
 				size: "sm",
-				"aria-label": p.removeLineItemButton,
+				"aria-label": u.removeLineItemButton,
 				className: "ttw:w-10 ttw:rounded-none ttw:border-l ttw:border-border ttw:pl-4 ttw:text-muted-foreground ttw:hover:bg-transparent ttw:hover:text-destructive ttw:has-[>svg]:pr-0",
-				onClick: w,
-				children: /* @__PURE__ */ k(N, {})
+				onClick: x,
+				children: /* @__PURE__ */ E(A, {})
 			})
 		]
 	});
 }
-function ae({ inputId: e, discountType: t, value: n, error: r, currencySymbol: c, disabled: f, labels: p, onChange: m, onTypeChange: h, onFocus: g, onBlur: _ }) {
-	let v = `${e}-error`, y = [{
+function oe({ inputId: e, discountType: t, value: n, error: r, currencySymbol: i, disabled: a, labels: o, onChange: s, onTypeChange: c, onFocus: l, onBlur: m }) {
+	let h = `${e}-error`, g = [{
 		type: "amount",
-		label: c,
-		ariaLabel: p.discountAmountOptionAriaLabel
+		label: i,
+		ariaLabel: o.discountAmountOptionAriaLabel
 	}, {
 		type: "percentage",
-		label: p.discountPercentageOption,
-		ariaLabel: p.discountPercentageOptionAriaLabel
+		label: o.discountPercentageOption,
+		ariaLabel: o.discountPercentageOptionAriaLabel
 	}];
-	return /* @__PURE__ */ A(i, {
+	return /* @__PURE__ */ D(u, {
 		className: "ttw:flex-col",
-		children: [/* @__PURE__ */ A(a, {
+		children: [/* @__PURE__ */ D(d, {
 			className: "ttw:flex-row ttw:items-center ttw:justify-end",
-			children: [/* @__PURE__ */ k(s, {
+			children: [/* @__PURE__ */ E(p, {
 				htmlFor: e,
-				className: D(r && "ttw:text-destructive"),
-				children: p.discountLabel
-			}), /* @__PURE__ */ A(l, {
-				className: "ttw:w-40 ttw:overflow-hidden",
-				children: [/* @__PURE__ */ k(u, {
-					align: "inline-start",
-					className: "ttw:gap-0 ttw:self-stretch ttw:p-0 ttw:has-[>button]:ml-0",
-					children: y.map((e) => /* @__PURE__ */ k("button", {
+				className: w(r && "ttw:text-destructive"),
+				children: o.discountLabel
+			}), /* @__PURE__ */ D("div", {
+				className: w(N, "ttw:w-40 ttw:overflow-hidden"),
+				children: [/* @__PURE__ */ E("div", {
+					className: w(F, "ttw:items-stretch ttw:self-stretch"),
+					children: g.map((e) => /* @__PURE__ */ E("button", {
 						type: "button",
 						"aria-label": e.ariaLabel,
 						"aria-pressed": t === e.type,
-						disabled: f,
-						className: D("ttw:pointer-events-auto ttw:h-full ttw:w-9 ttw:cursor-pointer ttw:border-r ttw:border-input ttw:text-sm ttw:transition-colors ttw:disabled:pointer-events-none ttw:disabled:opacity-50", t === e.type ? "ttw:bg-primary ttw:text-primary-foreground" : "ttw:text-muted-foreground ttw:hover:bg-muted ttw:hover:text-foreground"),
-						onClick: () => h(e.type),
+						disabled: a,
+						className: w("ttw:h-full ttw:w-9 ttw:cursor-pointer ttw:border-r ttw:border-input ttw:text-sm ttw:transition-colors ttw:disabled:pointer-events-none ttw:disabled:opacity-50", t === e.type ? "ttw:bg-primary ttw:text-primary-foreground" : "ttw:text-muted-foreground ttw:hover:bg-muted ttw:hover:text-foreground"),
+						onClick: () => c(e.type),
 						children: e.label
 					}, e.type))
-				}), /* @__PURE__ */ k(d, {
+				}), /* @__PURE__ */ E("input", {
 					id: e,
 					type: "text",
 					inputMode: "decimal",
-					className: "ttw:text-right",
+					className: w(P, "ttw:pr-3 ttw:pl-2"),
 					"aria-invalid": !!r || void 0,
-					"aria-describedby": r ? v : void 0,
-					disabled: f,
+					"aria-describedby": r ? h : void 0,
+					disabled: a,
 					value: n,
-					onChange: (e) => m(e.target.value),
-					onFocus: g,
-					onBlur: _
+					onChange: (e) => s(e.target.value),
+					onFocus: l,
+					onBlur: m
 				})]
 			})]
-		}), r && /* @__PURE__ */ k(o, {
-			id: v,
+		}), r && /* @__PURE__ */ E(f, {
+			id: h,
 			className: "ttw:text-right",
 			children: r
 		})]
 	});
 }
-function R({ open: r, onOpenChange: j, mode: N = "create", values: P, errors: F, currencyOptions: R, unitOptions: oe, currencySymbol: z, lineItemControls: B, autoFocusLineItemId: V, lineItemsLoading: H, inProgress: U, customerSelector: W, renderProductSelector: G, onChange: K, onLineItemChange: q, onLineItemCommit: se, onLineItemQuantityStep: ce, onTaxRateCommit: le, onDiscountFocus: ue, onDiscountCommit: de, totals: fe, onManageUnits: J, onAddLineItem: pe, onRemoveLineItem: me, showDueDateField: Y, billingSection: he, remindersSection: ge, bankAccountSection: _e, attachmentsSection: ve, cancelDisabled: ye, draftButtonLabel: X, draftDisabled: be, draftLoading: xe, primaryButtonLabel: Se, primaryDisabled: Ce, primaryLoading: we, scrollContainerRef: Te, onSubmit: Ee, onDraftClick: De, onPrimaryClick: Oe, onCancel: ke, labels: Ae }) {
+function R({ open: r, onRequestClose: g, mode: _ = "create", values: v, errors: y, unitOptions: b, currencySymbol: O, lineItemControls: A, autoFocusLineItemId: j, lineItemsLoading: M, inProgress: I, customerSelector: R, renderProductSelector: se, onChange: z, onLineItemChange: B, onLineItemCommit: V, onLineItemQuantityStep: H, onTaxRateCommit: U, onDiscountFocus: W, onDiscountCommit: G, totals: K, onManageUnits: ce, onAddLineItem: le, onRemoveLineItem: ue, showDueDateField: q, onAddCustomerDetailsClick: J, billingSection: de, bankAccountSection: fe, attachmentsSection: pe, preview: me, closeDisabled: he, cancelDisabled: ge, draftButtonLabel: Y, draftDisabled: _e, draftLoading: ve, primaryButtonLabel: ye, primaryDisabled: be, primaryLoading: xe, scrollContainerRef: X, onSubmit: Se, onDraftClick: Ce, onPrimaryClick: we, labels: Te }) {
 	let Z = {
-		...ne,
-		...Ae
-	}, Q = ie(), $ = N === "edit", je = D("ttw:grid ttw:gap-4", $ && Y ? "ttw:grid-cols-3" : "ttw:grid-cols-2");
-	return /* @__PURE__ */ k(x, {
+		...ee,
+		...Te
+	}, Q = ne(), $ = _ === "edit";
+	return /* @__PURE__ */ E(i, {
 		open: r,
-		onOpenChange: j,
-		children: /* @__PURE__ */ A(S, {
-			ref: Te,
-			className: "ttw:w-180 ttw:overflow-y-auto ttw:sm:max-w-180",
-			children: [
-				/* @__PURE__ */ A(T, { children: [/* @__PURE__ */ k(ee, { children: N === "edit" ? Z.editTitle : Z.createTitle }), /* @__PURE__ */ k(C, {
-					className: "ttw:sr-only",
-					children: Z.hiddenDescription
-				})] }),
-				/* @__PURE__ */ A("form", {
-					id: Q,
-					onSubmit: (e) => {
-						e.preventDefault(), e.stopPropagation(), Ee();
-					},
-					children: [/* @__PURE__ */ k("button", {
-						type: "submit",
-						className: "ttw:sr-only",
-						tabIndex: -1,
-						"aria-hidden": "true"
-					}), /* @__PURE__ */ A("div", {
-						className: "ttw:flex ttw:flex-col ttw:gap-5 ttw:px-6 ttw:pb-6",
-						children: [
-							/* @__PURE__ */ A("div", {
-								className: "ttw:flex ttw:flex-col ttw:gap-1.5",
-								children: [
-									/* @__PURE__ */ k(f, { children: Z.documentTypeLabel }),
-									/* @__PURE__ */ A(p, {
-										className: "ttw:flex ttw:flex-row ttw:gap-6",
-										disabled: N === "edit",
-										value: P.type,
-										onValueChange: (e) => K({ type: e }),
-										children: [/* @__PURE__ */ A("div", {
-											className: "ttw:flex ttw:items-center ttw:gap-2",
-											children: [/* @__PURE__ */ k(m, {
-												value: "invoice",
-												id: `${Q}-invoice`
-											}), /* @__PURE__ */ k(f, {
-												htmlFor: `${Q}-invoice`,
-												children: Z.typeInvoice
-											})]
-										}), /* @__PURE__ */ A("div", {
-											className: "ttw:flex ttw:items-center ttw:gap-2",
-											children: [/* @__PURE__ */ k(m, {
-												value: "quote",
-												id: `${Q}-quote`
-											}), /* @__PURE__ */ k(f, {
-												htmlFor: `${Q}-quote`,
-												children: Z.typeQuote
+		onOpenChange: (e) => {
+			e || g();
+		},
+		modal: !1,
+		children: /* @__PURE__ */ D(a, {
+			fullScreen: !0,
+			className: "ttw:flex ttw:flex-col ttw:gap-0 ttw:overflow-hidden ttw:p-0",
+			onInteractOutside: (e) => e.preventDefault(),
+			children: [/* @__PURE__ */ D(c, {
+				className: "ttw:w-full ttw:flex-row ttw:items-center ttw:justify-between ttw:border-b ttw:border-border ttw:px-6 ttw:pt-6 ttw:pb-7",
+				children: [/* @__PURE__ */ D("div", {
+					className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+					children: [/* @__PURE__ */ E(l, {
+						className: "ttw:text-3xl ttw:tracking-normal",
+						children: _ === "edit" ? Z.editTitle : Z.createTitle
+					}), /* @__PURE__ */ E(o, {
+						className: w(_ === "edit" && "ttw:sr-only"),
+						children: _ === "edit" ? Z.editDescription : Z.createDescription
+					})]
+				}), /* @__PURE__ */ E(n, {
+					type: "button",
+					variant: "ghost",
+					className: "ttw:p-2 ttw:has-[>svg]:px-2",
+					"aria-label": Z.closeButton,
+					disabled: he,
+					onClick: g,
+					children: /* @__PURE__ */ E(ie, { className: "ttw:size-6.5" })
+				})]
+			}), /* @__PURE__ */ D("div", {
+				className: "ttw:flex ttw:min-h-0 ttw:flex-1",
+				children: [/* @__PURE__ */ D("div", {
+					ref: X,
+					className: "ttw:h-full ttw:min-h-0 ttw:w-1/2 ttw:overflow-auto ttw:px-8 ttw:pt-6",
+					children: [/* @__PURE__ */ D("form", {
+						id: Q,
+						noValidate: !0,
+						className: "ttw:pb-10",
+						onSubmit: (e) => {
+							e.preventDefault(), e.stopPropagation(), Se();
+						},
+						children: [/* @__PURE__ */ E("button", {
+							type: "submit",
+							className: "ttw:sr-only",
+							tabIndex: -1,
+							"aria-hidden": "true"
+						}), /* @__PURE__ */ D("div", {
+							className: "ttw:flex ttw:flex-col ttw:gap-8",
+							children: [
+								/* @__PURE__ */ D("div", {
+									className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:rounded-xl ttw:border ttw:border-border ttw:p-6",
+									children: [
+										/* @__PURE__ */ D("div", {
+											className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:pb-4",
+											children: [/* @__PURE__ */ E(C, {
+												variant: "h4",
+												children: Z.customerHeading
+											}), /* @__PURE__ */ E(C, {
+												variant: "body2",
+												color: "muted",
+												className: "ttw:font-medium",
+												children: Z.customerDescription
 											})]
-										})]
-									}),
-									/* @__PURE__ */ k(I, { message: F?.type })
-								]
-							}),
-							/* @__PURE__ */ A("div", {
-								className: "ttw:flex ttw:flex-col ttw:gap-1.5",
-								children: [
-									/* @__PURE__ */ k(f, { children: Z.customerLabel }),
-									W,
-									/* @__PURE__ */ k("p", {
-										className: "ttw:text-xs ttw:text-muted-foreground",
-										children: Z.customerHint
-									}),
-									/* @__PURE__ */ k(I, { message: F?.customerId })
-								]
-							}),
-							/* @__PURE__ */ A("div", {
-								className: je,
-								children: [
-									/* @__PURE__ */ A("div", {
-										className: "ttw:flex ttw:flex-col ttw:gap-1.5",
-										children: [
-											/* @__PURE__ */ k(f, {
-												htmlFor: `${Q}-currency`,
-												children: Z.currencyLabel
+										}),
+										R,
+										/* @__PURE__ */ E(L, { message: y?.customerId }),
+										!v.customerId && /* @__PURE__ */ D(re, { children: [/* @__PURE__ */ E(u, { children: /* @__PURE__ */ D(d, { children: [
+											/* @__PURE__ */ E(p, {
+												htmlFor: `${Q}-customer-email`,
+												children: Z.customerEmailLabel
 											}),
-											/* @__PURE__ */ A(h, {
-												value: P.currency,
-												onValueChange: (e) => K({ currency: e }),
-												children: [/* @__PURE__ */ k(v, {
-													id: `${Q}-currency`,
-													children: /* @__PURE__ */ k(y, {})
-												}), /* @__PURE__ */ k(g, { children: R.map((e) => /* @__PURE__ */ k(_, {
-													value: e.value,
-													children: e.label
-												}, e.value)) })]
+											/* @__PURE__ */ E(m, {
+												id: `${Q}-customer-email`,
+												type: "email",
+												disabled: I,
+												"aria-invalid": !!y?.customerEmail || void 0,
+												"aria-describedby": y?.customerEmail ? `${Q}-customer-email-error` : void 0,
+												value: v.customerEmail,
+												onChange: (e) => z({ customerEmail: e.target.value })
 											}),
-											/* @__PURE__ */ k(I, { message: F?.currency })
-										]
-									}),
-									$ && /* @__PURE__ */ A("div", {
+											y?.customerEmail && /* @__PURE__ */ E(f, {
+												id: `${Q}-customer-email-error`,
+												children: y.customerEmail
+											})
+										] }) }), J && /* @__PURE__ */ D(n, {
+											type: "button",
+											variant: "ghost",
+											disabled: I,
+											className: "ttw:w-fit ttw:text-primary ttw:hover:text-primary",
+											onClick: J,
+											children: [/* @__PURE__ */ E(k, {}), Z.addCustomerDetailsButton]
+										})] })
+									]
+								}),
+								($ || q) && /* @__PURE__ */ D("div", {
+									className: "ttw:grid ttw:grid-cols-2 ttw:gap-4",
+									children: [$ && /* @__PURE__ */ D("div", {
 										className: "ttw:flex ttw:flex-col ttw:gap-1.5",
 										children: [
-											/* @__PURE__ */ k(f, {
+											/* @__PURE__ */ E(h, {
 												htmlFor: `${Q}-issue-date`,
 												children: Z.issueDateLabel
 											}),
-											/* @__PURE__ */ k(c, {
+											/* @__PURE__ */ E(m, {
 												id: `${Q}-issue-date`,
 												type: "date",
-												value: P.issueDate,
-												onChange: (e) => K({ issueDate: e.target.value })
+												value: v.issueDate,
+												onChange: (e) => z({ issueDate: e.target.value })
 											}),
-											/* @__PURE__ */ k(I, { message: F?.issueDate })
+											/* @__PURE__ */ E(L, { message: y?.issueDate })
 										]
-									}),
-									Y && /* @__PURE__ */ A("div", {
+									}), q && /* @__PURE__ */ D("div", {
 										className: "ttw:flex ttw:flex-col ttw:gap-1.5",
 										children: [
-											/* @__PURE__ */ k(f, {
+											/* @__PURE__ */ E(h, {
 												htmlFor: `${Q}-due-date`,
 												children: Z.dueDateLabel
 											}),
-											/* @__PURE__ */ k(c, {
+											/* @__PURE__ */ E(m, {
 												id: `${Q}-due-date`,
 												type: "date",
-												value: P.dueDate,
-												onChange: (e) => K({ dueDate: e.target.value })
+												value: v.dueDate,
+												onChange: (e) => z({ dueDate: e.target.value })
 											}),
-											/* @__PURE__ */ k(I, { message: F?.dueDate })
+											/* @__PURE__ */ E(L, { message: y?.dueDate })
 										]
-									})
-								]
-							}),
-							he,
-							ge,
-							/* @__PURE__ */ A("div", {
-								className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:rounded-xl ttw:border ttw:border-border ttw:p-6",
-								children: [
-									/* @__PURE__ */ A("div", {
-										className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:pb-4",
-										children: [/* @__PURE__ */ k(E, {
-											variant: "h4",
-											children: Z.lineItemsHeading
-										}), /* @__PURE__ */ k(E, {
-											variant: "body2",
-											color: "muted",
-											className: "ttw:font-medium",
-											children: Z.lineItemsDescription
-										})]
-									}),
-									F?.lineItemsSummary?.length ? /* @__PURE__ */ k(e, {
-										variant: "destructive",
-										className: "ttw:mb-2",
-										children: /* @__PURE__ */ k(t, { children: /* @__PURE__ */ k("ul", { children: F.lineItemsSummary.map((e) => /* @__PURE__ */ k("li", { children: e }, e)) }) })
-									}) : null,
-									/* @__PURE__ */ A("ul", {
-										className: "ttw:flex ttw:flex-col ttw:gap-2.5",
-										children: [/* @__PURE__ */ A("li", {
-											"aria-hidden": !0,
-											className: "ttw:flex ttw:h-5 ttw:items-center ttw:gap-2.5 ttw:text-sm ttw:leading-5 ttw:font-medium",
-											children: [
-												/* @__PURE__ */ k("span", {
-													className: "ttw:inline-flex ttw:min-w-30 ttw:flex-1 ttw:whitespace-nowrap",
-													children: Z.productLabel
-												}),
-												/* @__PURE__ */ k("span", {
-													className: "ttw:w-24 ttw:min-w-24",
-													children: Z.quantityLabel
-												}),
-												/* @__PURE__ */ k("span", {
-													className: "ttw:w-20.5 ttw:min-w-20.5",
-													children: Z.unitLabel
-												}),
-												/* @__PURE__ */ k("span", {
-													className: "ttw:w-full ttw:max-w-41 ttw:min-w-29",
-													children: Z.priceLabel
-												}),
-												/* @__PURE__ */ k("span", {
-													className: "ttw:w-12 ttw:min-w-12",
-													children: Z.taxableLabel
-												}),
-												P.lineItems.length > 1 && /* @__PURE__ */ k("span", { className: "ttw:w-10 ttw:min-w-10" })
-											]
-										}), H ? /* @__PURE__ */ k("li", {
-											className: "ttw:flex ttw:h-9 ttw:items-center ttw:justify-center",
-											children: /* @__PURE__ */ k(te, { className: "ttw:size-5" })
-										}) : P.lineItems.map((e) => /* @__PURE__ */ k(L, {
-											formId: Q,
-											lineItem: e,
-											errors: F?.lineItems?.[e.id],
-											controls: B?.[e.id],
-											focusOnMount: e.id === V,
-											canRemove: P.lineItems.length > 1,
-											unitOptions: oe,
-											currencySymbol: z,
+									})]
+								}),
+								de,
+								/* @__PURE__ */ D("div", {
+									className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:rounded-xl ttw:border ttw:border-border ttw:p-6",
+									children: [
+										/* @__PURE__ */ D("div", {
+											className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:pb-4",
+											children: [/* @__PURE__ */ E(C, {
+												variant: "h4",
+												children: Z.lineItemsHeading
+											}), /* @__PURE__ */ E(C, {
+												variant: "body2",
+												color: "muted",
+												className: "ttw:font-medium",
+												children: Z.lineItemsDescription
+											})]
+										}),
+										y?.lineItemsSummary?.length ? /* @__PURE__ */ E(e, {
+											variant: "destructive",
+											className: "ttw:mb-2",
+											children: /* @__PURE__ */ E(t, { children: /* @__PURE__ */ E("ul", { children: y.lineItemsSummary.map((e) => /* @__PURE__ */ E("li", { children: e }, e)) }) })
+										}) : null,
+										/* @__PURE__ */ D("ul", {
+											className: "ttw:flex ttw:flex-col ttw:gap-2.5",
+											children: [/* @__PURE__ */ D("li", {
+												"aria-hidden": !0,
+												className: "ttw:flex ttw:h-5 ttw:items-center ttw:gap-2.5 ttw:text-sm ttw:leading-5 ttw:font-medium",
+												children: [
+													/* @__PURE__ */ E("span", {
+														className: "ttw:inline-flex ttw:min-w-30 ttw:flex-1 ttw:whitespace-nowrap",
+														children: Z.productLabel
+													}),
+													/* @__PURE__ */ E("span", {
+														className: "ttw:w-24 ttw:min-w-24",
+														children: Z.quantityLabel
+													}),
+													/* @__PURE__ */ E("span", {
+														className: "ttw:w-20.5 ttw:min-w-20.5",
+														children: Z.unitLabel
+													}),
+													/* @__PURE__ */ E("span", {
+														className: "ttw:w-full ttw:max-w-41 ttw:min-w-29",
+														children: Z.priceLabel
+													}),
+													/* @__PURE__ */ E("span", {
+														className: "ttw:w-12 ttw:min-w-12",
+														children: Z.taxableLabel
+													}),
+													v.lineItems.length > 1 && /* @__PURE__ */ E("span", { className: "ttw:w-10 ttw:min-w-10" })
+												]
+											}), M ? /* @__PURE__ */ E("li", {
+												className: "ttw:flex ttw:h-9 ttw:items-center ttw:justify-center",
+												children: /* @__PURE__ */ E(S, { className: "ttw:size-5" })
+											}) : v.lineItems.map((e) => /* @__PURE__ */ E(ae, {
+												formId: Q,
+												lineItem: e,
+												errors: y?.lineItems?.[e.id],
+												controls: A?.[e.id],
+												focusOnMount: e.id === j,
+												canRemove: v.lineItems.length > 1,
+												unitOptions: b,
+												currencySymbol: O,
+												labels: Z,
+												renderProductSelector: se,
+												onChange: (t) => B(e.id, t),
+												onCommit: (t) => V(e.id, t),
+												onQuantityStep: (t) => H(e.id, t),
+												onManageUnits: ce,
+												onRemove: () => ue(e.id)
+											}, e.id))]
+										}),
+										/* @__PURE__ */ D(n, {
+											type: "button",
+											variant: "ghost",
+											className: "ttw:w-fit ttw:text-primary ttw:hover:text-primary",
+											onClick: le,
+											children: [/* @__PURE__ */ E(k, { className: "ttw:size-5 ttw:text-primary" }), Z.addLineItemButton]
+										}),
+										/* @__PURE__ */ E(oe, {
+											inputId: `${Q}-discount`,
+											discountType: v.discountType,
+											value: v.discount,
+											error: y?.discount,
+											currencySymbol: O,
+											disabled: I,
 											labels: Z,
-											renderProductSelector: G,
-											onChange: (t) => q(e.id, t),
-											onCommit: (t) => se(e.id, t),
-											onQuantityStep: (t) => ce(e.id, t),
-											onManageUnits: J,
-											onRemove: () => me(e.id)
-										}, e.id))]
-									}),
-									/* @__PURE__ */ A(n, {
-										type: "button",
-										variant: "ghost",
-										className: "ttw:w-fit ttw:text-primary ttw:hover:text-primary",
-										onClick: pe,
-										children: [/* @__PURE__ */ k(M, { className: "ttw:size-5 ttw:text-primary" }), Z.addLineItemButton]
-									}),
-									/* @__PURE__ */ k(ae, {
-										inputId: `${Q}-discount`,
-										discountType: P.discountType,
-										value: P.discount,
-										error: F?.discount,
-										currencySymbol: z,
-										disabled: U,
-										labels: Z,
-										onChange: (e) => K({ discount: e }),
-										onTypeChange: (e) => K({ discountType: e }),
-										onFocus: ue,
-										onBlur: de
-									}),
-									/* @__PURE__ */ A(i, {
-										className: "ttw:flex-col",
-										children: [/* @__PURE__ */ A(a, {
-											className: "ttw:flex-row ttw:justify-end",
-											children: [/* @__PURE__ */ k(s, {
-												htmlFor: `${Q}-tax-rate`,
-												className: D(F?.taxRate && "ttw:text-destructive"),
-												children: Z.taxRateLabel
-											}), /* @__PURE__ */ A(l, {
-												className: "ttw:w-40 ttw:has-[>[data-align=inline-end]]:[&>input]:pr-0",
-												children: [/* @__PURE__ */ k(d, {
-													id: `${Q}-tax-rate`,
-													className: "ttw:text-right",
-													placeholder: Z.taxRatePlaceholder,
-													type: "text",
-													inputMode: "decimal",
-													"aria-invalid": !!F?.taxRate || void 0,
-													"aria-describedby": F?.taxRate ? `${Q}-tax-rate-error` : void 0,
-													value: P.taxRate,
-													onChange: (e) => K({ taxRate: e.target.value }),
-													onBlur: le
-												}), /* @__PURE__ */ k(u, {
-													align: "inline-end",
-													children: Z.taxRateSuffix
+											onChange: (e) => z({ discount: e }),
+											onTypeChange: (e) => z({ discountType: e }),
+											onFocus: W,
+											onBlur: G
+										}),
+										/* @__PURE__ */ D(u, {
+											className: "ttw:flex-col",
+											children: [/* @__PURE__ */ D(d, {
+												className: "ttw:flex-row ttw:justify-end",
+												children: [/* @__PURE__ */ E(p, {
+													htmlFor: `${Q}-tax-rate`,
+													className: w(y?.taxRate && "ttw:text-destructive"),
+													children: Z.taxRateLabel
+												}), /* @__PURE__ */ D("div", {
+													className: w(N, "ttw:w-40"),
+													children: [/* @__PURE__ */ E("input", {
+														id: `${Q}-tax-rate`,
+														className: w(P, "ttw:pl-3"),
+														placeholder: Z.taxRatePlaceholder,
+														type: "text",
+														inputMode: "decimal",
+														"aria-invalid": !!y?.taxRate || void 0,
+														"aria-describedby": y?.taxRate ? `${Q}-tax-rate-error` : void 0,
+														value: v.taxRate,
+														onChange: (e) => z({ taxRate: e.target.value }),
+														onBlur: U
+													}), /* @__PURE__ */ E("span", {
+														className: w(F, "ttw:pr-3"),
+														children: Z.taxRateSuffix
+													})]
 												})]
+											}), y?.taxRate && /* @__PURE__ */ E(f, {
+												id: `${Q}-tax-rate-error`,
+												className: "ttw:text-right",
+												children: y.taxRate
 											})]
-										}), F?.taxRate && /* @__PURE__ */ k(o, {
-											id: `${Q}-tax-rate-error`,
-											className: "ttw:text-right",
-											children: F.taxRate
-										})]
-									}),
-									/* @__PURE__ */ k(b, {}),
-									/* @__PURE__ */ k(re, {
-										totals: fe,
-										labels: Z
-									})
-								]
+										}),
+										/* @__PURE__ */ E(x, {}),
+										/* @__PURE__ */ E(te, {
+											totals: K,
+											labels: Z
+										})
+									]
+								}),
+								fe,
+								/* @__PURE__ */ E(T, {
+									idPrefix: Q,
+									openingNote: v.openingNote,
+									closingNote: v.closingNote,
+									openingNoteError: y?.openingNote,
+									closingNoteError: y?.closingNote,
+									disabled: I,
+									onOpeningNoteChange: (e) => z({ openingNote: e }),
+									onClosingNoteChange: (e) => z({ closingNote: e }),
+									labels: Z
+								}),
+								pe
+							]
+						})]
+					}), /* @__PURE__ */ D(s, {
+						className: "ttw:sticky ttw:bottom-0 ttw:z-10 ttw:flex-row ttw:items-center ttw:justify-end ttw:gap-4 ttw:bg-background ttw:px-6 ttw:pt-3 ttw:pb-6",
+						children: [
+							/* @__PURE__ */ E(n, {
+								type: "button",
+								variant: "outline",
+								className: "ttw:border-border",
+								disabled: ge,
+								onClick: g,
+								children: Z.cancelButton
 							}),
-							_e,
-							/* @__PURE__ */ k(O, {
-								idPrefix: Q,
-								openingNote: P.openingNote,
-								closingNote: P.closingNote,
-								openingNoteError: F?.openingNote,
-								closingNoteError: F?.closingNote,
-								disabled: U,
-								onOpeningNoteChange: (e) => K({ openingNote: e }),
-								onClosingNoteChange: (e) => K({ closingNote: e }),
-								labels: Z
+							Y && /* @__PURE__ */ E(n, {
+								type: "submit",
+								form: Q,
+								variant: "secondary",
+								loading: ve,
+								disabled: _e,
+								onClick: Ce,
+								children: Y
 							}),
-							ve
+							/* @__PURE__ */ E(n, {
+								type: "submit",
+								form: Q,
+								loading: xe,
+								disabled: be,
+								onClick: we,
+								children: ye
+							})
 						]
 					})]
-				}),
-				/* @__PURE__ */ k(w, { children: /* @__PURE__ */ A("div", {
-					className: "ttw:flex ttw:justify-end ttw:gap-2",
-					children: [
-						/* @__PURE__ */ k(n, {
-							type: "button",
-							variant: "ghost",
-							disabled: ye,
-							onClick: ke,
-							children: Z.cancelButton
-						}),
-						X && /* @__PURE__ */ k(n, {
-							type: "submit",
-							form: Q,
-							variant: "secondary",
-							loading: xe,
-							disabled: be,
-							onClick: De,
-							children: X
-						}),
-						/* @__PURE__ */ k(n, {
-							type: "submit",
-							form: Q,
-							loading: we,
-							disabled: Ce,
-							onClick: Oe,
-							children: Se
-						})
-					]
-				}) })
-			]
+				}), /* @__PURE__ */ E("div", {
+					className: "ttw:h-full ttw:min-h-0 ttw:w-1/2 ttw:overflow-auto ttw:bg-linear-to-b ttw:from-[#F6F6F6] ttw:to-[#E4E4FF]",
+					children: me
+				})]
+			})]
 		})
 	});
 }
 //#endregion
-export { R as ReceivableFormSheet, R as default };
+export { R as ReceivableFormDialog, R as default };