@tesouro/embedded-components-react 0.5.176 → 0.5.179

package/dist/libs/tesouro-embedded-components-react/monite-sdk/dist/index550.js

@@ -1,19 +1,212 @@
-import { Typography as e } from "./index61.js";
-import { jsx as t, jsxs as n } from "@emotion/react/jsx-runtime";
-import { twMerge as r } from "tailwind-merge";
+import { useCurrencies as e } from "./index62.js";
+import { Input as t } from "./index88.js";
+import { InputGroup as n, InputGroupAddon as r, InputGroupInput as i, InputGroupTextarea as a } from "./index109.js";
+import { Combobox as o, ComboboxCollection as s, ComboboxContent as c, ComboboxEmpty as l, ComboboxInput as u, ComboboxItem as d, ComboboxList as f } from "./index110.js";
+import "./index224.js";
+import { Typography as p } from "./index61.js";
+import { Label as m } from "./index86.js";
+import { Field as h, FieldContent as g, FieldError as _, FieldLabel as v } from "./index87.js";
+import { RadioGroup as y, RadioGroupItem as b } from "./index89.js";
+import { useGetMeasureUnits as x } from "./index451.js";
+import "./index474.js";
+import "./index487.js";
+import { useCallback as S, useMemo as C, useRef as w } from "react";
+import { jsx as T, jsxs as E } from "@emotion/react/jsx-runtime";
+import { useLingui as D } from "@lingui/react";
+import { twMerge as O } from "tailwind-merge";
+import { Controller as k, useFormContext as A } from "react-hook-form";
 //#region ../../libs/tesouro-embedded-components-react/monite-sdk/dist/index550.js
-var i = ({ label: i, value: a, isLast: o }) => /* @__PURE__ */ n("li", {
-	className: r("ttw:flex ttw:gap-4 ttw:py-2.5", !o && "ttw:border-b ttw:border-border"),
-	children: [/* @__PURE__ */ t(e, {
-		variant: "body2",
-		color: "muted",
-		className: "ttw:w-35 ttw:min-w-35 ttw:font-medium",
-		children: i
-	}), typeof a == "string" ? /* @__PURE__ */ t(e, {
-		variant: "body2",
-		className: "ttw:font-medium",
-		children: a
-	}) : a]
-});
+var j = ({ isLoading: j, isEditMode: M, isProduct: N }) => {
+	let { i18n: P } = D(), { getSymbolFromCurrency: F } = e(), I = w(null), { data: L } = x(), R = L?.data ?? [], { control: z, formState: { errors: B } } = A(), V = C(() => R.map((e) => e.id), [R]), H = C(() => new Map(R.map((e) => [e.id, e.name])), [R]), U = S((e) => H.get(e) ?? e, [H]);
+	return /* @__PURE__ */ E("div", {
+		className: "ttw:flex ttw:flex-col ttw:gap-4",
+		children: [
+			M && /* @__PURE__ */ T("div", {
+				className: "ttw:flex ttw:items-center ttw:gap-3 ttw:pt-6 ttw:pb-7 ttw:border-b ttw:border-border",
+				children: /* @__PURE__ */ T(p, {
+					variant: "body1",
+					className: "ttw:font-medium",
+					children: P._("Editing {type} details", { type: N ? "product" : "service" })
+				})
+			}),
+			/* @__PURE__ */ T(k, {
+				name: "type",
+				control: z,
+				render: ({ field: e }) => /* @__PURE__ */ E("div", {
+					className: "ttw:flex ttw:flex-col ttw:gap-1.5",
+					children: [/* @__PURE__ */ T(v, { children: P._("Type") }), /* @__PURE__ */ E(y, {
+						className: "ttw:flex",
+						value: e.value,
+						disabled: j,
+						onValueChange: e.onChange,
+						children: [/* @__PURE__ */ E("div", {
+							className: O("ttw:flex ttw:p-4 ttw:flex-1 ttw:gap-2 ttw:border ttw:rounded-xl ttw:border-border ttw:hover:bg-primary/10 ttw:hover:border-primary/30", e.value === "product" && "ttw:bg-primary/10 ttw:border-primary/30"),
+							children: [/* @__PURE__ */ T(b, {
+								value: "product",
+								id: "type-product",
+								className: O(e.value === "product" ? "ttw:bg-primary" : "ttw:bg-white"),
+								dotClassName: O(e.value === "product" && "ttw:fill-white"),
+								disabled: j
+							}), /* @__PURE__ */ E(m, {
+								htmlFor: "type-product",
+								className: "ttw:flex ttw:flex-col ttw:items-start ttw:gap-1.5",
+								children: [/* @__PURE__ */ T(p, {
+									variant: "body2",
+									className: "ttw:leading-3.5",
+									children: P._("Product")
+								}), /* @__PURE__ */ T(p, {
+									variant: "caption",
+									color: "muted",
+									children: P._("A physical or digital item")
+								})]
+							})]
+						}), /* @__PURE__ */ E("div", {
+							className: O("ttw:flex ttw:p-4 ttw:flex-1 ttw:gap-2 ttw:border ttw:rounded-xl ttw:border-border ttw:hover:bg-primary/10 ttw:hover:border-primary/30", e.value === "service" && "ttw:bg-primary/10 ttw:border-primary/30"),
+							children: [/* @__PURE__ */ T(b, {
+								value: "service",
+								id: "type-service",
+								className: O(e.value === "service" ? "ttw:bg-primary" : "ttw:bg-white"),
+								dotClassName: O(e.value === "service" && "ttw:fill-white"),
+								disabled: j
+							}), /* @__PURE__ */ E(m, {
+								htmlFor: "type-service",
+								className: "ttw:flex ttw:flex-col ttw:items-start ttw:gap-1.5",
+								children: [/* @__PURE__ */ T(p, {
+									variant: "body2",
+									className: "ttw:leading-3.5",
+									children: P._("Service")
+								}), /* @__PURE__ */ T(p, {
+									variant: "caption",
+									color: "muted",
+									children: P._("Work or labor you provide")
+								})]
+							})]
+						})]
+					})]
+				})
+			}),
+			/* @__PURE__ */ T(k, {
+				name: "name",
+				control: z,
+				render: ({ field: e, fieldState: { error: n } }) => /* @__PURE__ */ T(h, { children: /* @__PURE__ */ E(g, { children: [
+					/* @__PURE__ */ T(v, {
+						htmlFor: e.name,
+						children: P._("Name")
+					}),
+					/* @__PURE__ */ T(t, {
+						...e,
+						id: e.name,
+						placeholder: P._("e.g. House blend espresso beans"),
+						className: M ? "ttw:bg-white" : "",
+						disabled: j,
+						"aria-invalid": !!n || void 0
+					}),
+					/* @__PURE__ */ T(_, { errors: [n] })
+				] }) })
+			}),
+			/* @__PURE__ */ E("div", {
+				className: "ttw:w-1/2 ttw:flex ttw:flex-col ttw:gap-1.5",
+				children: [
+					/* @__PURE__ */ T(v, { children: P._("Price per unit") }),
+					/* @__PURE__ */ E("div", {
+						className: O("ttw:flex ttw:overflow-hidden ttw:rounded-md ttw:border ttw:border-input ttw:shadow-xs ttw:transition-[color,box-shadow]", "ttw:focus-within:border-ring ttw:focus-within:ring-[3px] ttw:focus-within:ring-ring/50", "ttw:has-[[data-slot][aria-invalid=true]]:border-destructive ttw:has-[[data-slot][aria-invalid=true]]:ring-[3px] ttw:has-[[data-slot][aria-invalid=true]]:ring-destructive/20", M && "ttw:bg-white"),
+						ref: I,
+						children: [
+							/* @__PURE__ */ T(k, {
+								name: "pricePerUnit",
+								control: z,
+								render: ({ field: e, fieldState: { error: t } }) => /* @__PURE__ */ E(n, {
+									className: "ttw:flex-1 ttw:border-0 ttw:shadow-none ttw:rounded-none ttw:has-[[data-slot=input-group-control]:focus-visible]:border-transparent ttw:has-[[data-slot=input-group-control]:focus-visible]:ring-0",
+									children: [/* @__PURE__ */ T(r, {
+										align: "inline-start",
+										children: F("USD")
+									}), /* @__PURE__ */ T(i, {
+										type: "number",
+										name: e.name,
+										ref: e.ref,
+										value: e.value ?? "",
+										onChange: (t) => e.onChange(t.target.value === "" ? void 0 : Number(t.target.value)),
+										className: "ttw:text-end",
+										onBlur: e.onBlur,
+										placeholder: "0.00",
+										"aria-invalid": !!t || void 0,
+										disabled: j
+									})]
+								})
+							}),
+							/* @__PURE__ */ T("div", { className: "ttw:w-px ttw:shrink-0 ttw:bg-border" }),
+							/* @__PURE__ */ T(k, {
+								name: "measureUnitId",
+								control: z,
+								render: ({ field: e, fieldState: { error: t } }) => /* @__PURE__ */ E(o, {
+									value: e.value ?? null,
+									onValueChange: (t) => e.onChange(t ?? void 0),
+									items: V,
+									itemToStringLabel: U,
+									disabled: j,
+									children: [/* @__PURE__ */ T(u, {
+										showClear: !!e.value,
+										placeholder: "-",
+										disabled: j,
+										"aria-invalid": !!t || void 0,
+										className: "ttw:w-28 ttw:border-0 ttw:shadow-none ttw:rounded-none ttw:has-[[data-slot=input-group-control]:focus-visible]:border-transparent ttw:has-[[data-slot=input-group-control]:focus-visible]:ring-0"
+									}), /* @__PURE__ */ T(c, {
+										container: I.current,
+										children: /* @__PURE__ */ E(f, { children: [/* @__PURE__ */ T(l, { children: P._("No units found") }), /* @__PURE__ */ T(s, { children: (e) => /* @__PURE__ */ T(d, {
+											value: e,
+											children: U(e)
+										}, e) })] })
+									})]
+								})
+							})
+						]
+					}),
+					/* @__PURE__ */ T(_, { errors: [B.pricePerUnit, B.measureUnitId] })
+				]
+			}),
+			/* @__PURE__ */ T(k, {
+				name: "description",
+				control: z,
+				render: ({ field: e, fieldState: { error: t } }) => /* @__PURE__ */ T(h, {
+					className: "ttw:block",
+					children: /* @__PURE__ */ E(g, { children: [
+						/* @__PURE__ */ E(v, {
+							htmlFor: e.name,
+							className: "ttw:gap-1",
+							children: [P._("Description"), /* @__PURE__ */ T(p, {
+								variant: "body2",
+								color: "muted",
+								className: "ttw:leading-snug",
+								children: P._("(optional)")
+							})]
+						}),
+						/* @__PURE__ */ E(n, {
+							className: O(M && "ttw:bg-white"),
+							children: [/* @__PURE__ */ T(a, {
+								...e,
+								id: e.name,
+								placeholder: P._("e.g. 16oz whole bean, medium-dark roast, ground to order"),
+								rows: 4,
+								maxLength: 255,
+								disabled: j,
+								"aria-invalid": !!t || void 0
+							}), /* @__PURE__ */ T(r, {
+								align: "block-end",
+								className: "ttw:cursor-default",
+								children: /* @__PURE__ */ T(p, {
+									variant: "caption",
+									color: "muted",
+									className: "ttw:leading-none",
+									children: P._("{count}/255 characters", { count: (e.value ?? "").length })
+								})
+							})]
+						}),
+						/* @__PURE__ */ T(_, { errors: [t] })
+					] })
+				})
+			})
+		]
+	});
+};
 //#endregion
-export { i as ProductDetailLine };
+export { j as ProductFormContent };

package/dist/libs/tesouro-embedded-components-react/monite-sdk/dist/index551.js

@@ -1,160 +1,92 @@
-import { Scope as e } from "../../shared/data-access/dist/lib/scopes.js";
-import "../../shared/data-access/dist/index.js";
-import { useMoniteContext as t } from "./index46.js";
+import { applyAPIValidationErrors as e, parseAPIValidationErrors as t } from "./index26.js";
 import { useCurrencies as n } from "./index62.js";
 import { Button as r } from "./index55.js";
-import { MoniteScopedProviders as i } from "./index242.js";
-import { Sheet as a, SheetClose as o, SheetContent as s, SheetDescription as c, SheetHeader as l, SheetTitle as u } from "./index49.js";
-import { LoadingSpinner as d } from "./index50.js";
+import "./index224.js";
+import { LoadingSpinner as i } from "./index50.js";
 import "./index51.js";
-import { Skeleton as f } from "./index53.js";
-import { DropdownMenu as p, DropdownMenuContent as m, DropdownMenuItem as h, DropdownMenuTrigger as g } from "./index54.js";
-import { Typography as _ } from "./index61.js";
-import { useUserPermissions as v } from "./index118.js";
-import { NotFound as y } from "./index244.js";
-import { AccessRestriction as b } from "./index252.js";
-import "./index416.js";
-import { useGetProductById as x } from "./index483.js";
-import { ProductDeleteModal as S } from "./index542.js";
-import { ProductEditForm as C } from "./index549.js";
-import { ProductDetailLine as w } from "./index550.js";
-import { useState as T } from "react";
-import { MoreVerticalIcon as E, Trash2 as D, X as O } from "lucide-react";
-import { Fragment as k, jsx as A, jsxs as j } from "@emotion/react/jsx-runtime";
-import { useLingui as M } from "@lingui/react";
+import { getProductValidationSchema as a } from "./index474.js";
+import { useUpdateProduct as o } from "./index486.js";
+import { PRODUCT_API_FIELD_MAP as s } from "./index546.js";
+import { ProductFormContent as c } from "./index550.js";
+import { useCallback as l, useId as u, useMemo as d } from "react";
+import { jsx as f, jsxs as p } from "@emotion/react/jsx-runtime";
+import { useLingui as m } from "@lingui/react";
+import { FormProvider as h, useForm as g } from "react-hook-form";
+import { zodResolver as _ } from "@hookform/resolvers/zod";
 //#region ../../libs/tesouro-embedded-components-react/monite-sdk/dist/index551.js
-var N = (e) => /* @__PURE__ */ A(i, { children: /* @__PURE__ */ A(P, { ...e }) }), P = ({ id: i, open: N, onClose: P, onUpdated: F, onDeleted: I, showActionsMenu: L = !0 }) => {
-	let { i18n: R } = M(), { locale: z } = t(), { formatCurrencyToDisplay: B } = n(), [V, H] = T(!1), [U, W] = T(!1), { data: G, isLoading: K, isFetching: q } = x(i), J = G?.type === "product", Y = v(), X = Y.has(e.InvoiceReadOrg), Z = Y.has(e.InvoiceWriteOrg), Q = Y.has(e.InvoiceWriteOrg);
-	return X ? !K && !q && !G ? /* @__PURE__ */ A(a, {
-		open: N,
-		onOpenChange: P,
-		children: /* @__PURE__ */ A(s, {
-			showCloseButton: !0,
-			className: "ttw:gap-0",
-			children: /* @__PURE__ */ A("div", {
-				className: "ttw:w-3/4 ttw:m-auto ttw:p-4",
-				children: /* @__PURE__ */ A(y, {
-					title: R._("Product not found"),
-					description: R._("There is no product by provided id: {id}", { id: i })
-				})
-			})
-		})
-	}) : /* @__PURE__ */ j(k, { children: [/* @__PURE__ */ A(a, {
-		open: N,
-		onOpenChange: P,
-		children: /* @__PURE__ */ j(s, {
-			showCloseButton: !1,
-			className: "ttw:gap-0",
-			children: [/* @__PURE__ */ j(l, {
-				className: "ttw:pt-6 ttw:pl-6 ttw:pb-7 ttw:flex-row ttw:gap-3 ttw:border-b ttw:border-border",
-				children: [/* @__PURE__ */ j("div", {
-					className: "ttw:flex ttw:flex-col ttw:gap-1.5 ttw:w-[85%]",
-					children: [/* @__PURE__ */ A(u, {
-						asChild: K,
-						className: "ttw:text-2xl",
-						children: K ? /* @__PURE__ */ A(f, { className: "ttw:w-40" }) : G?.name ?? ""
-					}), /* @__PURE__ */ A(c, {
-						asChild: K,
-						children: K ? /* @__PURE__ */ A(f, { className: "ttw:w-60" }) : R._("{type} · Added {createdAt}", {
-							createdAt: R.date(G?.created_at, z.dateFormat),
-							type: G?.type === "product" ? "Product" : "Service"
-						})
-					})]
-				}), /* @__PURE__ */ j("div", {
-					className: "ttw:flex ttw:gap-2",
-					children: [L && Q && /* @__PURE__ */ j(p, { children: [/* @__PURE__ */ A(g, {
-						asChild: !0,
-						children: /* @__PURE__ */ A(r, {
-							type: "button",
-							variant: "outline",
-							className: "ttw:p-2 ttw:size-9 ttw:border-none ttw:bg-muted",
-							children: /* @__PURE__ */ A(E, {})
-						})
-					}), /* @__PURE__ */ A(m, {
-						align: "end",
-						children: /* @__PURE__ */ j(h, {
-							onClick: () => W(!0),
-							variant: "destructive",
-							children: [/* @__PURE__ */ A(D, {}), R._("Delete product")]
-						})
-					})] }), /* @__PURE__ */ A(o, {
-						className: "ttw:size-9 ttw:bg-muted ttw:p-2 ttw:flex ttw:items-center ttw:justify-center ttw:rounded-md ttw:cursor-pointer",
-						children: /* @__PURE__ */ A(O, { className: "ttw:size-4" })
-					})]
+var v = ({ product: v, handleClose: y, onUpdate: b }) => {
+	let { i18n: x } = m(), { formatToMinorUnits: S, formatFromMinorUnits: C } = n(), w = `product-edit-form-${u()}`, { mutate: T, isPending: E } = o(v.id), D = d(() => ({
+		name: v.name,
+		type: v.type ?? "product",
+		pricePerUnit: C(v.price?.value, v.price?.currency) ?? void 0,
+		currency: v.price?.currency ?? "USD",
+		description: v.description ?? "",
+		measureUnitId: v.measure_unit_id ?? void 0
+	}), [
+		v.name,
+		v.type,
+		v.price?.value,
+		v.price?.currency,
+		v.description,
+		v.measure_unit_id,
+		C
+	]), O = g({
+		resolver: _(a(x)),
+		defaultValues: D
+	}), k = l((n) => {
+		n.preventDefault(), n.stopPropagation(), O.handleSubmit((n) => {
+			T({
+				name: n.name,
+				type: n.type,
+				price: {
+					value: S(n.pricePerUnit, n.currency) ?? n.pricePerUnit,
+					currency: n.currency
+				},
+				description: n.description,
+				...n.measureUnitId ? { measure_unit_id: n.measureUnitId } : {}
+			}, {
+				onSuccess: (e) => {
+					b?.(e);
+				},
+				onError: (n) => {
+					e(O.setError, t(n), { fieldMap: s });
+				}
+			});
+		})(n);
+	}, [
+		T,
+		S,
+		b,
+		O.handleSubmit,
+		O.setError
+	]);
+	return /* @__PURE__ */ f(h, {
+		...O,
+		children: /* @__PURE__ */ p("form", {
+			id: w,
+			onSubmit: k,
+			className: "ttw:flex ttw:flex-col ttw:gap-4 ttw:p-4 ttw:border ttw:border-primary ttw:rounded-[10px] ttw:bg-zinc-100",
+			children: [/* @__PURE__ */ f(c, {
+				isLoading: E,
+				isProduct: v?.type === "product",
+				isEditMode: !0
+			}), /* @__PURE__ */ p("div", {
+				className: "ttw:flex ttw:gap-4 ttw:pt-6",
+				children: [/* @__PURE__ */ f(r, {
+					type: "button",
+					variant: "outline",
+					className: "ttw:border-border ttw:flex-1",
+					onClick: y,
+					children: x._("Cancel")
+				}), /* @__PURE__ */ p(r, {
+					type: "submit",
+					className: "ttw:flex-1",
+					disabled: E || !O.formState.isDirty,
+					children: [E && /* @__PURE__ */ f(i, { className: "ttw:border-white ttw:border-t-transparent ttw:size-4" }), x._("Save")]
 				})]
-			}), K ? /* @__PURE__ */ A("div", {
-				className: "ttw:flex ttw:w-full ttw:h-full ttw:items-center ttw:justify-center",
-				children: /* @__PURE__ */ A(d, {})
-			}) : /* @__PURE__ */ A("main", {
-				className: "ttw:p-6 ttw:overflow-auto ttw:flex ttw:flex-col ttw:gap-4",
-				children: /* @__PURE__ */ j("div", {
-					className: "ttw:flex ttw:flex-col ttw:gap-4",
-					children: [/* @__PURE__ */ j("div", {
-						className: "ttw:flex ttw:items-center ttw:justify-between ttw:gap-3 ttw:pt-6 ttw:pb-7 ttw:border-b ttw:border-border",
-						children: [/* @__PURE__ */ j("div", {
-							className: "ttw:flex ttw:flex-col ttw:gap-1.5",
-							children: [/* @__PURE__ */ A(_, {
-								variant: "body1",
-								className: "ttw:font-medium",
-								children: R._("{type} details", { type: J ? "Product" : "Service" })
-							}), /* @__PURE__ */ A(_, {
-								variant: "body2",
-								color: "muted",
-								children: J ? R._("A physical or digital item") : R._("Work or labor you provide")
-							})]
-						}), !V && Z && /* @__PURE__ */ A(r, {
-							type: "button",
-							variant: "ghost",
-							className: "ttw:text-primary ttw:hover:text-primary",
-							onClick: () => H(!0),
-							children: R._("Edit")
-						})]
-					}), V && G ? /* @__PURE__ */ A(C, {
-						product: G,
-						handleClose: () => H(!1),
-						onUpdate: (e) => {
-							F?.(e), H(!1);
-						}
-					}) : /* @__PURE__ */ j("ul", {
-						className: "ttw:list-none",
-						children: [
-							/* @__PURE__ */ A(w, {
-								label: R._("{type} name", { type: J ? "Product" : "Service" }),
-								value: G?.name ?? "-"
-							}),
-							/* @__PURE__ */ A(w, {
-								label: R._("Price per unit"),
-								value: G?.price ? B(G.price.value, G.price.currency) : "-"
-							}),
-							/* @__PURE__ */ A(w, {
-								label: R._("Description"),
-								value: G?.description || "-",
-								isLast: !0
-							})
-						]
-					})]
-				})
 			})]
 		})
-	}), i && U && /* @__PURE__ */ A(S, {
-		id: i,
-		open: U,
-		onClose: () => W(!1),
-		onDeleted: (e) => {
-			P?.(), I?.(e), W(!1);
-		}
-	})] }) : /* @__PURE__ */ A(a, {
-		open: N,
-		onOpenChange: P,
-		children: /* @__PURE__ */ A(s, {
-			showCloseButton: !0,
-			className: "ttw:gap-0",
-			children: /* @__PURE__ */ A("div", {
-				className: "ttw:w-3/4 ttw:m-auto ttw:p-4",
-				children: /* @__PURE__ */ A(b, {})
-			})
-		})
 	});
 };
 //#endregion
-export { N as ProductDetails };
+export { v as ProductEditForm };

package/dist/libs/tesouro-embedded-components-react/monite-sdk/dist/index552.js

@@ -1,104 +1,19 @@
-import { applyAPIValidationErrors as e, parseAPIValidationErrors as t } from "./index26.js";
-import { useCurrencies as n } from "./index62.js";
-import { Button as r } from "./index55.js";
-import "./index223.js";
-import { MoniteScopedProviders as i } from "./index242.js";
-import { Sheet as a, SheetClose as o, SheetContent as s, SheetDescription as c, SheetFooter as l, SheetHeader as u, SheetTitle as d } from "./index49.js";
-import { LoadingSpinner as f } from "./index50.js";
-import "./index51.js";
-import { getProductValidationSchema as p } from "./index473.js";
-import { useCreateProduct as m } from "./index481.js";
-import "./index486.js";
-import { PRODUCT_API_FIELD_MAP as h } from "./index544.js";
-import { ProductFormContent as g } from "./index548.js";
-import { useCallback as _, useId as v, useMemo as y } from "react";
-import { jsx as b, jsxs as x } from "@emotion/react/jsx-runtime";
-import { useLingui as S } from "@lingui/react";
-import { FormProvider as C, useForm as w } from "react-hook-form";
-import { zodResolver as T } from "@hookform/resolvers/zod";
+import { Typography as e } from "./index61.js";
+import { jsx as t, jsxs as n } from "@emotion/react/jsx-runtime";
+import { twMerge as r } from "tailwind-merge";
 //#region ../../libs/tesouro-embedded-components-react/monite-sdk/dist/index552.js
-var E = (e) => /* @__PURE__ */ b(i, { children: /* @__PURE__ */ b(D, { ...e }) }), D = ({ onClose: i, open: E, onCreated: D }) => {
-	let { i18n: O } = S(), { formatToMinorUnits: k } = n(), A = `product-form-${v()}`, { mutate: j, isPending: M } = m(D), N = y(() => ({
-		name: "",
-		type: "product",
-		measureUnitId: "",
-		pricePerUnit: void 0,
-		currency: "USD",
-		description: void 0
-	}), []), { watch: P, ...F } = w({
-		resolver: T(p(O)),
-		defaultValues: N
-	}), I = P("type"), L = !!P("name")?.trim() && P("pricePerUnit") !== void 0, R = _((n) => {
-		n.preventDefault(), n.stopPropagation(), F.handleSubmit((n) => {
-			j({ body: {
-				name: n.name,
-				type: n.type,
-				price: {
-					value: k(n.pricePerUnit, n.currency) ?? 0,
-					currency: n.currency
-				},
-				description: n.description,
-				...n.measureUnitId ? { measure_unit_id: n.measureUnitId } : {}
-			} }, { onError: (n) => {
-				e(F.setError, t(n), { fieldMap: h });
-			} });
-		})(n);
-	}, [
-		j,
-		k,
-		F.handleSubmit,
-		F.setError
-	]);
-	return /* @__PURE__ */ b(a, {
-		open: E,
-		onOpenChange: i,
-		children: /* @__PURE__ */ x(s, {
-			className: "ttw:gap-0",
-			children: [
-				/* @__PURE__ */ x(u, {
-					className: "ttw:border-b ttw:border-border",
-					children: [/* @__PURE__ */ b(d, {
-						className: "ttw:text-2xl",
-						children: O._("Add a product or service")
-					}), /* @__PURE__ */ b(c, {
-						className: "ttw:max-w-130",
-						children: O._("Save the products and services you sell so you can quickly add them as line items on invoices.")
-					})]
-				}),
-				/* @__PURE__ */ b("div", {
-					className: "ttw:flex ttw:flex-col ttw:gap-4 ttw:px-6 ttw:py-8 ttw:overflow-auto",
-					children: /* @__PURE__ */ b(C, {
-						...F,
-						watch: P,
-						children: /* @__PURE__ */ b("form", {
-							id: A,
-							onSubmit: R,
-							children: /* @__PURE__ */ b(g, { isLoading: M })
-						})
-					})
-				}),
-				/* @__PURE__ */ x(l, {
-					className: "ttw:border-t ttw:border-border ttw:flex-row ttw:justify-end",
-					children: [/* @__PURE__ */ b(o, {
-						asChild: !0,
-						children: /* @__PURE__ */ b(r, {
-							variant: "outline",
-							disabled: M,
-							className: "ttw:flex-1 ttw:border-border",
-							children: O._("Cancel")
-						})
-					}), /* @__PURE__ */ x(r, {
-						type: "submit",
-						form: A,
-						className: "ttw:flex-1",
-						title: O._("Complete the form to continue"),
-						disabled: M || !L,
-						children: [M && /* @__PURE__ */ b(f, { className: "ttw:border-white ttw:border-t-transparent ttw:size-4" }), O._("Save {type}", { type: I })]
-					})]
-				})
-			]
-		})
-	});
-};
+var i = ({ label: i, value: a, isLast: o }) => /* @__PURE__ */ n("li", {
+	className: r("ttw:flex ttw:gap-4 ttw:py-2.5", !o && "ttw:border-b ttw:border-border"),
+	children: [/* @__PURE__ */ t(e, {
+		variant: "body2",
+		color: "muted",
+		className: "ttw:w-35 ttw:min-w-35 ttw:font-medium",
+		children: i
+	}), typeof a == "string" ? /* @__PURE__ */ t(e, {
+		variant: "body2",
+		className: "ttw:font-medium",
+		children: a
+	}) : a]
+});
 //#endregion
-export { E as CreateProduct };
+export { i as ProductDetailLine };