@tesouro/embedded-components-react 0.5.268 → 0.5.271

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

@@ -1,8 +1,487 @@
-import { Fragment as e } from "react";
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
+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 T } from "./index13.js";
+import { ReceivableFormTotals as ee } from "./index39.js";
+import { ReceivableNotesSection as E } from "./index40.js";
+import { useId as te } from "react";
+import { Fragment as ne, jsx as D, jsxs as O } from "react/jsx-runtime";
+import { MinusIcon as k, PlusIcon as A, Trash2Icon as j, XIcon as re } from "lucide-react";
 //#region ../../libs/tesouro-embedded-components-react/invoicing-widget/ui/dist/index41.js
-function r({ lines: r }) {
-	return r.map((r, i) => /* @__PURE__ */ n(e, { children: [i > 0 && /* @__PURE__ */ t("br", {}), r] }, `${i}-${r}`));
+var M = "__none__", N = "__manage__", P = "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", F = "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", I = "ttw:flex ttw:items-center ttw:text-sm ttw:font-medium ttw:text-muted-foreground ttw:select-none", L = "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 R({ message: e }) {
+	return e ? /* @__PURE__ */ D("p", {
+		className: "ttw:text-sm ttw:text-destructive",
+		children: e
+	}) : null;
+}
+function ie({ 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__ */ O("li", {
+		className: "ttw:flex ttw:h-9 ttw:items-center ttw:gap-2.5",
+		children: [
+			/* @__PURE__ */ D("div", {
+				className: "ttw:min-w-30 ttw:flex-1",
+				children: d(t, {
+					inputId: `${S}-name`,
+					invalid: !!i?.name,
+					focusOnMount: o
+				})
+			}),
+			/* @__PURE__ */ O("div", {
+				className: w(P, "ttw:w-26 ttw:min-w-26 ttw:px-[0.3rem]"),
+				children: [
+					/* @__PURE__ */ D("button", {
+						type: "button",
+						"aria-label": u.decreaseQuantityButton,
+						disabled: a ? !a.canDecreaseQuantity : !1,
+						className: L,
+						onClick: () => m(-1),
+						children: /* @__PURE__ */ D(k, { className: "ttw:size-3.5" })
+					}),
+					/* @__PURE__ */ D("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) => f({ quantity: e.target.value }),
+						onBlur: () => p("quantity")
+					}),
+					/* @__PURE__ */ D("button", {
+						type: "button",
+						"aria-label": u.increaseQuantityButton,
+						disabled: a ? !a.canIncreaseQuantity : !1,
+						className: L,
+						onClick: () => m(1),
+						children: /* @__PURE__ */ D(A, { className: "ttw:size-3.5" })
+					})
+				]
+			}),
+			/* @__PURE__ */ O(g, {
+				value: t.unit || M,
+				onValueChange: (e) => {
+					if (e === N) {
+						h?.();
+						return;
+					}
+					f({ unit: e === M ? "" : e });
+				},
+				children: [/* @__PURE__ */ D(y, {
+					id: `${S}-unit`,
+					"aria-label": u.unitLabel,
+					"aria-invalid": !!i?.measureUnit || void 0,
+					className: "ttw:w-22",
+					children: /* @__PURE__ */ D(b, {
+						className: "ttw:truncate",
+						placeholder: u.unitPlaceholder
+					})
+				}), /* @__PURE__ */ O(_, { children: [
+					h && /* @__PURE__ */ O(v, {
+						value: N,
+						className: "ttw:font-semibold ttw:text-primary ttw:hover:text-primary ttw:focus:text-primary",
+						children: [/* @__PURE__ */ D(A, { className: "ttw:text-primary" }), u.manageUnitsOption]
+					}),
+					/* @__PURE__ */ D(v, {
+						value: M,
+						children: u.unitNone
+					}),
+					c.map((e) => /* @__PURE__ */ D(v, {
+						value: e.value,
+						children: e.label
+					}, e.value))
+				] })]
+			}),
+			/* @__PURE__ */ O("div", {
+				className: w(P, "ttw:w-full ttw:max-w-41 ttw:min-w-29"),
+				children: [/* @__PURE__ */ D("span", {
+					className: w(I, "ttw:pl-3"),
+					children: l
+				}), /* @__PURE__ */ D("input", {
+					id: `${S}-price`,
+					"aria-label": u.priceLabel,
+					"aria-invalid": !!i?.price || void 0,
+					type: "text",
+					inputMode: "decimal",
+					className: w(F, "ttw:pr-3 ttw:pl-2"),
+					value: t.price,
+					onChange: (e) => f({ price: e.target.value }),
+					onBlur: () => p("price")
+				})]
+			}),
+			/* @__PURE__ */ D("div", {
+				className: "ttw:flex ttw:w-12 ttw:min-w-12 ttw:items-center ttw:justify-center",
+				children: /* @__PURE__ */ D(r, {
+					id: `${S}-taxable`,
+					"aria-label": u.taxableLabel,
+					checked: t.taxable,
+					onCheckedChange: (e) => f({ taxable: e === !0 })
+				})
+			}),
+			s && /* @__PURE__ */ D(n, {
+				type: "button",
+				variant: "ghost",
+				size: "sm",
+				"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: x,
+				children: /* @__PURE__ */ D(j, {})
+			})
+		]
+	});
+}
+function ae({ 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: i,
+		ariaLabel: o.discountAmountOptionAriaLabel
+	}, {
+		type: "percentage",
+		label: o.discountPercentageOption,
+		ariaLabel: o.discountPercentageOptionAriaLabel
+	}];
+	return /* @__PURE__ */ O(u, {
+		className: "ttw:flex-col",
+		children: [/* @__PURE__ */ O(d, {
+			className: "ttw:flex-row ttw:items-center ttw:justify-end",
+			children: [/* @__PURE__ */ D(p, {
+				htmlFor: e,
+				className: w(r && "ttw:text-destructive"),
+				children: o.discountLabel
+			}), /* @__PURE__ */ O("div", {
+				className: w(P, "ttw:w-40 ttw:overflow-hidden"),
+				children: [/* @__PURE__ */ D("div", {
+					className: w(I, "ttw:items-stretch ttw:self-stretch"),
+					children: g.map((e) => /* @__PURE__ */ D("button", {
+						type: "button",
+						"aria-label": e.ariaLabel,
+						"aria-pressed": t === 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__ */ D("input", {
+					id: e,
+					type: "text",
+					inputMode: "decimal",
+					className: w(F, "ttw:pr-3 ttw:pl-2"),
+					"aria-invalid": !!r || void 0,
+					"aria-describedby": r ? h : void 0,
+					disabled: a,
+					value: n,
+					onChange: (e) => s(e.target.value),
+					onFocus: l,
+					onBlur: m
+				})]
+			})]
+		}), r && /* @__PURE__ */ D(f, {
+			id: h,
+			className: "ttw:text-right",
+			children: r
+		})]
+	});
+}
+function z({ open: r, onRequestClose: g, mode: _ = "create", values: v, errors: y, unitOptions: b, currencySymbol: k, lineItemControls: j, autoFocusLineItemId: M, lineItemsLoading: N, inProgress: L, customerSelector: z, renderProductSelector: B, onChange: V, onLineItemChange: H, onLineItemCommit: U, onLineItemQuantityStep: W, onTaxRateCommit: G, onDiscountFocus: K, onDiscountCommit: q, totals: J, onManageUnits: oe, onAddLineItem: se, onRemoveLineItem: ce, showDueDateField: le, onAddCustomerDetailsClick: Y, billingSection: ue, bankAccountSection: de, attachmentsSection: fe, preview: pe, closeDisabled: me, cancelDisabled: he, draftButtonLabel: X, draftDisabled: ge, draftLoading: _e, primaryButtonLabel: ve, primaryDisabled: ye, primaryLoading: be, scrollContainerRef: Z, onSubmit: xe, onDraftClick: Se, onPrimaryClick: Ce, labels: we }) {
+	let Q = {
+		...T,
+		...we
+	}, $ = te();
+	return /* @__PURE__ */ D(i, {
+		open: r,
+		onOpenChange: (e) => {
+			e || g();
+		},
+		modal: !1,
+		children: /* @__PURE__ */ O(a, {
+			fullScreen: !0,
+			className: "ttw:flex ttw:flex-col ttw:gap-0 ttw:overflow-hidden ttw:p-0",
+			onInteractOutside: (e) => e.preventDefault(),
+			children: [/* @__PURE__ */ O(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__ */ O("div", {
+					className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+					children: [/* @__PURE__ */ D(l, {
+						className: "ttw:text-3xl ttw:tracking-normal",
+						children: _ === "edit" ? Q.editTitle : Q.createTitle
+					}), /* @__PURE__ */ D(o, {
+						className: w(_ === "edit" && "ttw:sr-only"),
+						children: _ === "edit" ? Q.editDescription : Q.createDescription
+					})]
+				}), /* @__PURE__ */ D(n, {
+					type: "button",
+					variant: "ghost",
+					className: "ttw:p-2 ttw:has-[>svg]:px-2",
+					"aria-label": Q.closeButton,
+					disabled: me,
+					onClick: g,
+					children: /* @__PURE__ */ D(re, { className: "ttw:size-6.5" })
+				})]
+			}), /* @__PURE__ */ O("div", {
+				className: "ttw:flex ttw:min-h-0 ttw:flex-1",
+				children: [/* @__PURE__ */ O("div", {
+					ref: Z,
+					className: "ttw:h-full ttw:min-h-0 ttw:w-1/2 ttw:overflow-auto ttw:px-8 ttw:pt-6",
+					children: [/* @__PURE__ */ O("form", {
+						id: $,
+						noValidate: !0,
+						className: "ttw:pb-10",
+						onSubmit: (e) => {
+							e.preventDefault(), e.stopPropagation(), xe();
+						},
+						children: [/* @__PURE__ */ D("button", {
+							type: "submit",
+							className: "ttw:sr-only",
+							tabIndex: -1,
+							"aria-hidden": "true"
+						}), /* @__PURE__ */ O("div", {
+							className: "ttw:flex ttw:flex-col ttw:gap-8",
+							children: [
+								/* @__PURE__ */ O("div", {
+									className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:rounded-xl ttw:border ttw:border-border ttw:p-6",
+									children: [
+										/* @__PURE__ */ O("div", {
+											className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:pb-4",
+											children: [/* @__PURE__ */ D(C, {
+												variant: "h4",
+												children: Q.customerHeading
+											}), /* @__PURE__ */ D(C, {
+												variant: "body2",
+												color: "muted",
+												className: "ttw:font-medium",
+												children: Q.customerDescription
+											})]
+										}),
+										z,
+										/* @__PURE__ */ D(R, { message: y?.customerId }),
+										!v.customerId && /* @__PURE__ */ O(ne, { children: [/* @__PURE__ */ D(u, { children: /* @__PURE__ */ O(d, { children: [
+											/* @__PURE__ */ D(p, {
+												htmlFor: `${$}-customer-email`,
+												children: Q.customerEmailLabel
+											}),
+											/* @__PURE__ */ D(m, {
+												id: `${$}-customer-email`,
+												type: "email",
+												disabled: L,
+												"aria-invalid": !!y?.customerEmail || void 0,
+												"aria-describedby": y?.customerEmail ? `${$}-customer-email-error` : void 0,
+												value: v.customerEmail,
+												onChange: (e) => V({ customerEmail: e.target.value })
+											}),
+											y?.customerEmail && /* @__PURE__ */ D(f, {
+												id: `${$}-customer-email-error`,
+												children: y.customerEmail
+											})
+										] }) }), Y && /* @__PURE__ */ O(n, {
+											type: "button",
+											variant: "ghost",
+											disabled: L,
+											className: "ttw:w-fit ttw:text-primary ttw:hover:text-primary",
+											onClick: Y,
+											children: [/* @__PURE__ */ D(A, {}), Q.addCustomerDetailsButton]
+										})] })
+									]
+								}),
+								le && /* @__PURE__ */ D("div", {
+									className: "ttw:grid ttw:grid-cols-2 ttw:gap-4",
+									children: /* @__PURE__ */ O("div", {
+										className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+										children: [
+											/* @__PURE__ */ D(h, {
+												htmlFor: `${$}-due-date`,
+												children: Q.dueDateLabel
+											}),
+											/* @__PURE__ */ D(m, {
+												id: `${$}-due-date`,
+												type: "date",
+												value: v.dueDate,
+												onChange: (e) => V({ dueDate: e.target.value })
+											}),
+											/* @__PURE__ */ D(R, { message: y?.dueDate })
+										]
+									})
+								}),
+								ue,
+								/* @__PURE__ */ O("div", {
+									className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:rounded-xl ttw:border ttw:border-border ttw:p-6",
+									children: [
+										/* @__PURE__ */ O("div", {
+											className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:pb-4",
+											children: [/* @__PURE__ */ D(C, {
+												variant: "h4",
+												children: Q.lineItemsHeading
+											}), /* @__PURE__ */ D(C, {
+												variant: "body2",
+												color: "muted",
+												className: "ttw:font-medium",
+												children: Q.lineItemsDescription
+											})]
+										}),
+										y?.lineItemsSummary?.length ? /* @__PURE__ */ D(e, {
+											variant: "destructive",
+											className: "ttw:mb-2",
+											children: /* @__PURE__ */ D(t, { children: /* @__PURE__ */ D("ul", { children: y.lineItemsSummary.map((e) => /* @__PURE__ */ D("li", { children: e }, e)) }) })
+										}) : null,
+										/* @__PURE__ */ O("ul", {
+											className: "ttw:flex ttw:flex-col ttw:gap-2.5",
+											children: [/* @__PURE__ */ O("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__ */ D("span", {
+														className: "ttw:inline-flex ttw:min-w-30 ttw:flex-1 ttw:whitespace-nowrap",
+														children: Q.productLabel
+													}),
+													/* @__PURE__ */ D("span", {
+														className: "ttw:w-24 ttw:min-w-24",
+														children: Q.quantityLabel
+													}),
+													/* @__PURE__ */ D("span", {
+														className: "ttw:w-20.5 ttw:min-w-20.5",
+														children: Q.unitLabel
+													}),
+													/* @__PURE__ */ D("span", {
+														className: "ttw:w-full ttw:max-w-41 ttw:min-w-29",
+														children: Q.priceLabel
+													}),
+													/* @__PURE__ */ D("span", {
+														className: "ttw:w-12 ttw:min-w-12",
+														children: Q.taxableLabel
+													}),
+													v.lineItems.length > 1 && /* @__PURE__ */ D("span", { className: "ttw:w-10 ttw:min-w-10" })
+												]
+											}), N ? /* @__PURE__ */ D("li", {
+												className: "ttw:flex ttw:h-9 ttw:items-center ttw:justify-center",
+												children: /* @__PURE__ */ D(S, { className: "ttw:size-5" })
+											}) : v.lineItems.map((e) => /* @__PURE__ */ D(ie, {
+												formId: $,
+												lineItem: e,
+												errors: y?.lineItems?.[e.id],
+												controls: j?.[e.id],
+												focusOnMount: e.id === M,
+												canRemove: v.lineItems.length > 1,
+												unitOptions: b,
+												currencySymbol: k,
+												labels: Q,
+												renderProductSelector: B,
+												onChange: (t) => H(e.id, t),
+												onCommit: (t) => U(e.id, t),
+												onQuantityStep: (t) => W(e.id, t),
+												onManageUnits: oe,
+												onRemove: () => ce(e.id)
+											}, e.id))]
+										}),
+										/* @__PURE__ */ O(n, {
+											type: "button",
+											variant: "ghost",
+											className: "ttw:w-fit ttw:text-primary ttw:hover:text-primary",
+											onClick: se,
+											children: [/* @__PURE__ */ D(A, { className: "ttw:size-5 ttw:text-primary" }), Q.addLineItemButton]
+										}),
+										/* @__PURE__ */ D(ae, {
+											inputId: `${$}-discount`,
+											discountType: v.discountType,
+											value: v.discount,
+											error: y?.discount,
+											currencySymbol: k,
+											disabled: L,
+											labels: Q,
+											onChange: (e) => V({ discount: e }),
+											onTypeChange: (e) => V({ discountType: e }),
+											onFocus: K,
+											onBlur: q
+										}),
+										/* @__PURE__ */ O(u, {
+											className: "ttw:flex-col",
+											children: [/* @__PURE__ */ O(d, {
+												className: "ttw:flex-row ttw:justify-end",
+												children: [/* @__PURE__ */ D(p, {
+													htmlFor: `${$}-tax-rate`,
+													className: w(y?.taxRate && "ttw:text-destructive"),
+													children: Q.taxRateLabel
+												}), /* @__PURE__ */ O("div", {
+													className: w(P, "ttw:w-40"),
+													children: [/* @__PURE__ */ D("input", {
+														id: `${$}-tax-rate`,
+														className: w(F, "ttw:pl-3"),
+														placeholder: Q.taxRatePlaceholder,
+														type: "text",
+														inputMode: "decimal",
+														"aria-invalid": !!y?.taxRate || void 0,
+														"aria-describedby": y?.taxRate ? `${$}-tax-rate-error` : void 0,
+														value: v.taxRate,
+														onChange: (e) => V({ taxRate: e.target.value }),
+														onBlur: G
+													}), /* @__PURE__ */ D("span", {
+														className: w(I, "ttw:pr-3"),
+														children: Q.taxRateSuffix
+													})]
+												})]
+											}), y?.taxRate && /* @__PURE__ */ D(f, {
+												id: `${$}-tax-rate-error`,
+												className: "ttw:text-right",
+												children: y.taxRate
+											})]
+										}),
+										/* @__PURE__ */ D(x, {}),
+										/* @__PURE__ */ D(ee, {
+											totals: J,
+											labels: Q
+										})
+									]
+								}),
+								de,
+								/* @__PURE__ */ D(E, {
+									idPrefix: $,
+									openingNote: v.openingNote,
+									closingNote: v.closingNote,
+									openingNoteError: y?.openingNote,
+									closingNoteError: y?.closingNote,
+									disabled: L,
+									onOpeningNoteChange: (e) => V({ openingNote: e }),
+									onClosingNoteChange: (e) => V({ closingNote: e }),
+									labels: Q
+								}),
+								fe
+							]
+						})]
+					}), /* @__PURE__ */ O(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__ */ D(n, {
+								type: "button",
+								variant: "outline",
+								className: "ttw:border-border",
+								disabled: he,
+								onClick: g,
+								children: Q.cancelButton
+							}),
+							X && /* @__PURE__ */ D(n, {
+								type: "submit",
+								form: $,
+								variant: "secondary",
+								loading: _e,
+								disabled: ge,
+								onClick: Se,
+								children: X
+							}),
+							/* @__PURE__ */ D(n, {
+								type: "submit",
+								form: $,
+								loading: be,
+								disabled: ye,
+								onClick: Ce,
+								children: ve
+							})
+						]
+					})]
+				}), /* @__PURE__ */ D("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: pe
+				})]
+			})]
+		})
+	});
 }
 //#endregion
-export { r as PreviewLines };
+export { z as ReceivableFormDialog, z as default };