@tesouro/embedded-components-react 0.3.58 → 0.3.61

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

@@ -4,32 +4,39 @@ import { useId as v } from "react";
 import { jsx as y, jsxs as b } from "react/jsx-runtime";
 import { CircleAlert as x, Minus as S, Plus as C, Trash2 as w, X as T } from "lucide-react";
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index32.js
-function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMessage: k, discount: A, onDiscountChange: j, tax: M, onTaxChange: N, total: P, onTotalChange: F, onAddLineItem: I, errors: L, disabled: R, testId: z, labels: B }) {
-	let V = {
+function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMessage: k, discount: A, onDiscountChange: j, tax: M, onTaxChange: N, total: P, onTotalChange: F, onAddLineItem: I, errors: L, totalsErrors: R, disabled: z, testId: B, labels: V }) {
+	let H = {
 		..._,
-		...B
-	}, H = v(), U = E.length > 1, W = k ? `${H}-gl-code-unavailable` : void 0;
+		...V
+	}, U = v(), W = E.length > 1, G = k ? `${U}-gl-code-unavailable` : void 0, K = (e) => `${U}-${e}-error`, q = (e) => {
+		let t = R?.[e];
+		return t ? /* @__PURE__ */ y("p", {
+			id: K(e),
+			className: "ttw:text-sm ttw:text-destructive ttw:text-right",
+			children: t
+		}) : null;
+	};
 	return /* @__PURE__ */ b("section", {
 		className: "ttw:flex ttw:flex-col ttw:gap-3",
-		"data-testid": z,
+		"data-testid": B,
 		children: [
 			/* @__PURE__ */ y(h, {
 				component: "h2",
 				variant: "h6",
 				className: "ttw:font-semibold",
-				children: V.heading
+				children: H.heading
 			}),
 			/* @__PURE__ */ y("p", {
 				className: "ttw:text-sm ttw:text-muted-foreground",
-				children: V.helpText
+				children: H.helpText
 			}),
 			k ? /* @__PURE__ */ y("span", {
-				id: W,
+				id: G,
 				className: "ttw:sr-only",
 				children: k
 			}) : null,
 			E.map((h, _) => {
-				let v = `${H}-${h.id}`, E = L?.[h.id], A = (e) => `${v}-${e}-error`, j = (e) => E?.[e], M = (e) => {
+				let v = `${U}-${h.id}`, E = L?.[h.id], A = (e) => `${v}-${e}-error`, j = (e) => E?.[e], M = (e) => {
 					let t = j(e);
 					return t ? /* @__PURE__ */ y("p", {
 						id: A(e),
@@ -46,19 +53,19 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 								className: "ttw:flex ttw:items-center ttw:justify-between ttw:gap-2",
 								children: [/* @__PURE__ */ b("div", {
 									className: "ttw:flex ttw:items-center ttw:gap-2",
-									children: [U ? /* @__PURE__ */ b("span", {
+									children: [W ? /* @__PURE__ */ b("span", {
 										className: "ttw:text-sm ttw:text-muted-foreground",
 										children: [_ + 1, "."]
 									}) : null, /* @__PURE__ */ y(a, {
 										htmlFor: `${v}-description`,
-										children: V.description
+										children: H.description
 									})]
-								}), U ? /* @__PURE__ */ y(e, {
+								}), W ? /* @__PURE__ */ y(e, {
 									type: "button",
 									variant: "ghost",
 									size: "icon",
-									disabled: R,
-									"aria-label": V.removeLineItem(_ + 1),
+									disabled: z,
+									"aria-label": H.removeLineItem(_ + 1),
 									onClick: h.onRemove,
 									children: /* @__PURE__ */ y(w, { className: "ttw:size-4" })
 								}) : null]
@@ -67,9 +74,9 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 								className: "ttw:flex ttw:flex-col ttw:gap-1.5",
 								children: [/* @__PURE__ */ y(t, {
 									id: `${v}-description`,
-									placeholder: V.descriptionPlaceholder,
+									placeholder: H.descriptionPlaceholder,
 									value: h.description,
-									disabled: R,
+									disabled: z,
 									"aria-invalid": j("description") ? !0 : void 0,
 									"aria-describedby": j("description") ? A("description") : void 0,
 									onChange: (e) => h.onChange({ description: e.target.value })
@@ -85,7 +92,7 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 												className: "ttw:flex ttw:items-center ttw:gap-1",
 												children: [/* @__PURE__ */ y(a, {
 													htmlFor: `${v}-gl-code`,
-													children: V.glCode
+													children: H.glCode
 												}), k ? /* @__PURE__ */ y(p, { children: /* @__PURE__ */ b(d, { children: [/* @__PURE__ */ y(m, {
 													type: "button",
 													className: "ttw:inline-flex ttw:shrink-0 ttw:cursor-help ttw:text-muted-foreground",
@@ -97,23 +104,23 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 												className: "ttw:relative",
 												children: [/* @__PURE__ */ b(o, {
 													value: h.glCode,
-													disabled: R || O,
+													disabled: z || O,
 													onValueChange: (e) => h.onChange({ glCode: e }),
 													children: [/* @__PURE__ */ y(l, {
 														id: `${v}-gl-code`,
 														className: g("ttw:w-full", h.glCode && "ttw:[&>svg:last-child]:hidden!"),
 														"aria-invalid": j("glCode") ? !0 : void 0,
-														"aria-describedby": [j("glCode") ? A("glCode") : null, W].filter(Boolean).join(" ") || void 0,
-														children: /* @__PURE__ */ y(u, { placeholder: V.glCodePlaceholder })
+														"aria-describedby": [j("glCode") ? A("glCode") : null, G].filter(Boolean).join(" ") || void 0,
+														children: /* @__PURE__ */ y(u, { placeholder: H.glCodePlaceholder })
 													}), /* @__PURE__ */ y(s, { children: D.map((e) => /* @__PURE__ */ y(c, {
 														value: e.value,
 														children: e.label
 													}, e.value)) })]
-												}), h.glCode && !(R || O) ? /* @__PURE__ */ y(e, {
+												}), h.glCode && !(z || O) ? /* @__PURE__ */ y(e, {
 													type: "button",
 													variant: "ghost",
 													size: "icon-sm",
-													"aria-label": V.glCodeClear,
+													"aria-label": H.glCodeClear,
 													className: "ttw:absolute ttw:top-1/2 ttw:right-1 ttw:-translate-y-1/2",
 													onPointerDown: (e) => {
 														e.preventDefault(), e.stopPropagation();
@@ -135,7 +142,7 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 										children: [
 											/* @__PURE__ */ y(a, {
 												htmlFor: `${v}-quantity`,
-												children: V.quantity
+												children: H.quantity
 											}),
 											/* @__PURE__ */ b(n, {
 												className: "ttw:h-9 ttw:rounded-md ttw:border ttw:border-input ttw:shadow-xs ttw:has-[:focus-visible]:border-ring ttw:has-[:focus-visible]:ring-[3px] ttw:has-[:focus-visible]:ring-ring/50 ttw:has-[[aria-invalid=true]]:border-destructive ttw:has-[[aria-invalid=true]]:ring-destructive/20",
@@ -145,8 +152,8 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 														variant: "ghost",
 														size: "icon",
 														className: "ttw:h-full ttw:shrink-0 ttw:rounded-r-none",
-														disabled: R,
-														"aria-label": V.decreaseQuantity(_ + 1),
+														disabled: z,
+														"aria-label": H.decreaseQuantity(_ + 1),
 														onClick: () => h.onQuantityStep(-1),
 														children: /* @__PURE__ */ y(S, { className: "ttw:size-3.5" })
 													}),
@@ -155,7 +162,7 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 														inputMode: "decimal",
 														className: "ttw:min-w-0 ttw:flex-1 ttw:rounded-none ttw:border-0 ttw:text-center ttw:shadow-none ttw:focus-visible:ring-0",
 														value: h.quantity,
-														disabled: R,
+														disabled: z,
 														"aria-invalid": j("quantity") ? !0 : void 0,
 														"aria-describedby": j("quantity") ? A("quantity") : void 0,
 														onChange: (e) => h.onChange({ quantity: e.target.value })
@@ -165,8 +172,8 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 														variant: "ghost",
 														size: "icon",
 														className: "ttw:h-full ttw:shrink-0 ttw:rounded-l-none",
-														disabled: R,
-														"aria-label": V.increaseQuantity(_ + 1),
+														disabled: z,
+														"aria-label": H.increaseQuantity(_ + 1),
 														onClick: () => h.onQuantityStep(1),
 														children: /* @__PURE__ */ y(C, { className: "ttw:size-3.5" })
 													})
@@ -180,19 +187,19 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 										children: [
 											/* @__PURE__ */ y(a, {
 												htmlFor: `${v}-price`,
-												children: V.price
+												children: H.price
 											}),
 											/* @__PURE__ */ b(n, { children: [/* @__PURE__ */ y(r, {
 												align: "inline-start",
 												"aria-hidden": !0,
-												children: V.currencySymbol
+												children: H.currencySymbol
 											}), /* @__PURE__ */ y(i, {
 												id: `${v}-price`,
 												"data-has-start-addon": !0,
 												inputMode: "decimal",
 												className: "ttw:text-right ttw:aria-invalid:border-destructive ttw:aria-invalid:ring-destructive/20",
 												value: h.price,
-												disabled: R,
+												disabled: z,
 												"aria-invalid": j("price") ? !0 : void 0,
 												"aria-describedby": j("price") ? A("price") : void 0,
 												onChange: (e) => h.onChange({ price: e.target.value })
@@ -205,19 +212,19 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 										children: [
 											/* @__PURE__ */ y(a, {
 												htmlFor: `${v}-amount`,
-												children: V.amount
+												children: H.amount
 											}),
 											/* @__PURE__ */ b(n, { children: [/* @__PURE__ */ y(r, {
 												align: "inline-start",
 												"aria-hidden": !0,
-												children: V.currencySymbol
+												children: H.currencySymbol
 											}), /* @__PURE__ */ y(i, {
 												id: `${v}-amount`,
 												"data-has-start-addon": !0,
 												inputMode: "decimal",
 												className: "ttw:text-right ttw:aria-invalid:border-destructive ttw:aria-invalid:ring-destructive/20",
 												value: h.amount,
-												disabled: R,
+												disabled: z,
 												"aria-invalid": j("amount") ? !0 : void 0,
 												"aria-describedby": j("amount") ? A("amount") : void 0,
 												onChange: (e) => h.onChange({ amount: e.target.value })
@@ -234,79 +241,94 @@ function E({ items: E, glCodeOptions: D, glCodeDisabled: O, glCodeUnavailableMes
 			/* @__PURE__ */ y(e, {
 				type: "button",
 				variant: "link",
-				disabled: R,
+				disabled: z,
 				className: "ttw:self-start",
 				onClick: I,
-				children: V.addLineItem
+				children: H.addLineItem
 			}),
 			/* @__PURE__ */ b("div", {
 				className: "ttw:flex ttw:flex-col ttw:gap-2 ttw:border-t ttw:border-border ttw:pt-3",
 				children: [
 					/* @__PURE__ */ b("div", {
-						className: "ttw:flex ttw:items-center ttw:justify-between ttw:gap-4",
+						className: "ttw:flex ttw:items-start ttw:justify-between ttw:gap-4",
 						children: [/* @__PURE__ */ y(a, {
-							htmlFor: `${H}-discount`,
-							children: V.discount
-						}), /* @__PURE__ */ b(n, {
-							className: "ttw:w-36",
-							children: [/* @__PURE__ */ y(r, {
-								align: "inline-start",
-								"aria-hidden": !0,
-								children: V.currencySymbol
-							}), /* @__PURE__ */ y(i, {
-								id: `${H}-discount`,
-								"data-has-start-addon": !0,
-								inputMode: "decimal",
-								className: "ttw:text-right",
-								value: A,
-								disabled: R,
-								onChange: (e) => j(e.target.value)
-							})]
+							htmlFor: `${U}-discount`,
+							children: H.discount
+						}), /* @__PURE__ */ b("div", {
+							className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+							children: [/* @__PURE__ */ b(n, {
+								className: "ttw:w-36",
+								children: [/* @__PURE__ */ y(r, {
+									align: "inline-start",
+									"aria-hidden": !0,
+									children: H.currencySymbol
+								}), /* @__PURE__ */ y(i, {
+									id: `${U}-discount`,
+									"data-has-start-addon": !0,
+									inputMode: "decimal",
+									className: "ttw:text-right ttw:aria-invalid:border-destructive ttw:aria-invalid:ring-destructive/20",
+									value: A,
+									disabled: z,
+									"aria-invalid": R?.discount ? !0 : void 0,
+									"aria-describedby": R?.discount ? K("discount") : void 0,
+									onChange: (e) => j(e.target.value)
+								})]
+							}), q("discount")]
 						})]
 					}),
 					/* @__PURE__ */ b("div", {
-						className: "ttw:flex ttw:items-center ttw:justify-between ttw:gap-4",
+						className: "ttw:flex ttw:items-start ttw:justify-between ttw:gap-4",
 						children: [/* @__PURE__ */ y(a, {
-							htmlFor: `${H}-tax`,
-							children: V.tax
-						}), /* @__PURE__ */ b(n, {
-							className: "ttw:w-36",
-							children: [/* @__PURE__ */ y(r, {
-								align: "inline-start",
-								"aria-hidden": !0,
-								children: V.currencySymbol
-							}), /* @__PURE__ */ y(i, {
-								id: `${H}-tax`,
-								"data-has-start-addon": !0,
-								inputMode: "decimal",
-								className: "ttw:text-right",
-								value: M,
-								disabled: R,
-								onChange: (e) => N(e.target.value)
-							})]
+							htmlFor: `${U}-tax`,
+							children: H.tax
+						}), /* @__PURE__ */ b("div", {
+							className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+							children: [/* @__PURE__ */ b(n, {
+								className: "ttw:w-36",
+								children: [/* @__PURE__ */ y(r, {
+									align: "inline-start",
+									"aria-hidden": !0,
+									children: H.currencySymbol
+								}), /* @__PURE__ */ y(i, {
+									id: `${U}-tax`,
+									"data-has-start-addon": !0,
+									inputMode: "decimal",
+									className: "ttw:text-right ttw:aria-invalid:border-destructive ttw:aria-invalid:ring-destructive/20",
+									value: M,
+									disabled: z,
+									"aria-invalid": R?.tax ? !0 : void 0,
+									"aria-describedby": R?.tax ? K("tax") : void 0,
+									onChange: (e) => N(e.target.value)
+								})]
+							}), q("tax")]
 						})]
 					}),
 					/* @__PURE__ */ b("div", {
-						className: "ttw:flex ttw:items-center ttw:justify-between ttw:gap-4",
+						className: "ttw:flex ttw:items-start ttw:justify-between ttw:gap-4",
 						children: [/* @__PURE__ */ y(a, {
-							htmlFor: `${H}-total`,
+							htmlFor: `${U}-total`,
 							className: "ttw:font-semibold",
-							children: V.totalAmount
-						}), /* @__PURE__ */ b(n, {
-							className: "ttw:w-36",
-							children: [/* @__PURE__ */ y(r, {
-								align: "inline-start",
-								"aria-hidden": !0,
-								children: V.currencySymbol
-							}), /* @__PURE__ */ y(i, {
-								id: `${H}-total`,
-								"data-has-start-addon": !0,
-								inputMode: "decimal",
-								className: "ttw:text-right ttw:font-semibold",
-								value: P,
-								disabled: R,
-								onChange: (e) => F(e.target.value)
-							})]
+							children: H.totalAmount
+						}), /* @__PURE__ */ b("div", {
+							className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+							children: [/* @__PURE__ */ b(n, {
+								className: "ttw:w-36",
+								children: [/* @__PURE__ */ y(r, {
+									align: "inline-start",
+									"aria-hidden": !0,
+									children: H.currencySymbol
+								}), /* @__PURE__ */ y(i, {
+									id: `${U}-total`,
+									"data-has-start-addon": !0,
+									inputMode: "decimal",
+									className: "ttw:text-right ttw:font-semibold ttw:aria-invalid:border-destructive ttw:aria-invalid:ring-destructive/20",
+									value: P,
+									disabled: z,
+									"aria-invalid": R?.total ? !0 : void 0,
+									"aria-describedby": R?.total ? K("total") : void 0,
+									onChange: (e) => F(e.target.value)
+								})]
+							}), q("total")]
 						})]
 					})
 				]

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

@@ -25,6 +25,7 @@ function o(o) {
 	};
 	return /* @__PURE__ */ a("section", {
 		className: "ttw:flex ttw:flex-col ttw:gap-3",
+		"data-invalid": l ? !0 : void 0,
 		"data-testid": u,
 		children: [
 			/* @__PURE__ */ i(e, {

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

@@ -1,155 +1,13 @@
-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 { Minimize2 as y, MoreVertical as b, X as x } from "lucide-react";
+import { useEffect as e, useRef as t } from "react";
 //#region ../../libs/tesouro-embedded-components-react/bill-pay-widget/ui/dist/index44.js
-function S({ open: S, onOpenChange: C, title: w, subtitle: T, notice: E, vendor: D, values: O, errors: k, onChange: A, lineItems: j, documentPanel: M, menuItems: N, readOnly: P, detail: F, isLineItemsLoading: I, isSaving: L, isSavingDraft: R, isFinalizing: z, showFinalize: B = !0, onCancel: V, onCollapse: H, onSaveDraft: U, onFinalize: W, testId: G, labels: K }) {
-	let q = h(K), J = !!(P && F);
-	return /* @__PURE__ */ _(t, {
-		open: S,
-		onOpenChange: C,
-		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": G,
-			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: w
-							}),
-							T ? /* @__PURE__ */ _("p", {
-								className: "ttw:text-sm ttw:text-muted-foreground",
-								children: T
-							}) : null,
-							/* @__PURE__ */ _(r, {
-								className: "ttw:sr-only",
-								children: q.hiddenDescription
-							})
-						]
-					}), /* @__PURE__ */ v("div", {
-						className: "ttw:flex ttw:items-center ttw:gap-1",
-						children: [
-							H ? /* @__PURE__ */ _(e, {
-								type: "button",
-								variant: "ghost",
-								size: "icon",
-								"aria-label": q.collapseButton,
-								disabled: L,
-								onClick: H,
-								children: /* @__PURE__ */ _(y, { className: "ttw:size-4" })
-							}) : null,
-							N && N.length > 0 ? /* @__PURE__ */ v(o, { children: [/* @__PURE__ */ _(l, {
-								asChild: !0,
-								children: /* @__PURE__ */ _(e, {
-									type: "button",
-									variant: "ghost",
-									size: "icon",
-									"aria-label": q.menuTrigger,
-									disabled: L,
-									children: /* @__PURE__ */ _(b, { className: "ttw:size-4" })
-								})
-							}), /* @__PURE__ */ _(s, {
-								align: "end",
-								children: N.map((e) => /* @__PURE__ */ _(c, {
-									variant: e.destructive ? "destructive" : void 0,
-									disabled: e.disabled,
-									onSelect: e.onSelect,
-									children: e.label
-								}, e.id))
-							})] }) : null,
-							/* @__PURE__ */ _(e, {
-								type: "button",
-								variant: "ghost",
-								size: "icon",
-								"aria-label": q.closeButton,
-								disabled: L,
-								onClick: V,
-								children: /* @__PURE__ */ _(x, { 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: [
-							k?.form ? /* @__PURE__ */ _(u, { children: k.form }) : null,
-							E ? /* @__PURE__ */ _("div", {
-								className: "ttw:flex ttw:flex-col ttw:gap-3",
-								children: E
-							}) : null,
-							J ? /* @__PURE__ */ _(d, {
-								...F,
-								labels: q.detailBody
-							}) : /* @__PURE__ */ v(g, { children: [
-								/* @__PURE__ */ _(m, {
-									...D,
-									onEdit: P ? void 0 : D.onEdit,
-									onClear: P ? void 0 : D.onClear,
-									disabled: P,
-									labels: q.vendorSection
-								}),
-								/* @__PURE__ */ _(f, {
-									values: O,
-									errors: k,
-									onChange: A,
-									disabled: P,
-									labels: q.detailsFields
-								}),
-								/* @__PURE__ */ _(p, {
-									...j,
-									disabled: j.disabled || I || P,
-									labels: q.lineItems
-								})
-							] })
-						]
-					}), /* @__PURE__ */ _("div", {
-						className: "ttw:overflow-y-auto ttw:bg-muted/30 ttw:px-6 ttw:py-6",
-						children: M
-					})]
-				}),
-				J ? 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: L,
-						onClick: V,
-						children: P ? q.closeButton : q.cancelButton
-					}), P ? null : /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(e, {
-						type: "button",
-						variant: B ? "secondary" : "default",
-						onClick: U,
-						loading: R,
-						disabled: L || z || I || D.mode === "creating",
-						children: q.saveDraftButton
-					}), B ? /* @__PURE__ */ _(e, {
-						type: "button",
-						onClick: W,
-						loading: z,
-						disabled: L || R || I || D.mode === "creating",
-						children: q.finalizeButton
-					}) : null] })]
-				})
-			]
-		})
-	});
+function n(n) {
+	let r = t(null), i = t(n);
+	return e(() => {
+		if (n === i.current) return;
+		i.current = n;
+		let e = r.current?.querySelector("[aria-invalid=\"true\"], [data-invalid=\"true\"]");
+		e?.scrollIntoView({ block: "center" }), e?.focus({ preventScroll: !0 });
+	}, [n]), r;
 }
 //#endregion
-export { S as BillCreateScreen, S as default };
+export { n as useFocusFirstInvalidField };