@tesouro/embedded-components-react 0.2.6 → 0.2.7

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

@@ -1,31 +1,26 @@
-import { useMoniteContext as a } from "./index59.js";
-import { getAPIErrorMessage as n } from "./index121.js";
-import { useLingui as c } from "@lingui/react";
-import { toast as t } from "react-hot-toast";
-const f = () => {
+import { jsxs as n, jsx as e, Fragment as a } from "@emotion/react/jsx-runtime";
+import { RecurrenceFormContent as c } from "./index299.js";
+import { useLingui as o } from "@lingui/react";
+import { Switch as s } from "./index300.js";
+const u = ({
+  isRecurrenceEnabled: r,
+  toggleRecurrence: i
+}) => {
   const {
-    i18n: r
-  } = c(), {
-    api: o
-  } = a();
-  return o.finops.postReceivables.useMutation({}, {
-    onSuccess: async (e) => {
-      if (e.counterpart_name)
-        return t.success(r._("Invoice to {counterpartName} was created", {
-          counterpartName: e.counterpart_name
-        }));
-      t.success(r._("{type} has been created", {
-        type: e.type
-      }));
-    },
-    onError: (e) => {
-      const s = n(r, e);
-      t.error(r._("Failed to create invoice: {errorMessage}", {
-        errorMessage: s
-      }));
-    }
-  });
+    i18n: t
+  } = o();
+  return /* @__PURE__ */ n("section", { className: "ttw:flex ttw:flex-col ttw:gap-6 ttw:pb-10", children: [
+    /* @__PURE__ */ n("div", { className: "ttw:flex ttw:items-center ttw:gap-3", children: [
+      /* @__PURE__ */ e("h3", { className: "ttw:text-base ttw:font-medium", children: t._("Make recurring") }),
+      /* @__PURE__ */ e(s, { checked: r, onCheckedChange: i, "aria-label": t._("Make recurring") })
+    ] }),
+    r && /* @__PURE__ */ n(a, { children: [
+      /* @__PURE__ */ e("p", { className: "ttw:text-sm ttw:font-normal ttw:leading-5 ttw:text-foreground", children: t._("When you set up the recurrence all future invoices will be issued based on this invoice template. After that you won't be able to change the invoice template.") }),
+      /* @__PURE__ */ e(c, {}),
+      /* @__PURE__ */ e("p", { className: "ttw:text-sm ttw:font-normal ttw:leading-5 ttw:text-muted-foreground", children: t._("The first invoice is to be issued on the nearest date that matches the settings.") })
+    ] })
+  ] });
 };
 export {
-  f as useCreateReceivable
+  u as RecurrenceSection
 };

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

@@ -1,23 +1,61 @@
-import { useMoniteContext as n } from "./index59.js";
-import { getAPIErrorMessage as i } from "./index121.js";
-import { useLingui as a } from "@lingui/react";
-import { toast as s } from "react-hot-toast";
-const f = () => {
+import { jsxs as o, jsx as e } from "@emotion/react/jsx-runtime";
+import { useLingui as p } from "@lingui/react";
+import { useFormContext as u, Controller as n } from "react-hook-form";
+import { Field as t, FieldContent as s, FieldLabel as m, FieldError as c } from "./index164.js";
+import { Input as w } from "./index130.js";
+import { Textarea as f } from "./index131.js";
+const N = ({
+  disabled: a,
+  visibleFields: h
+}) => {
   const {
-    api: e,
-    queryClient: o
-  } = n(), {
-    i18n: r
-  } = a();
-  return e.finops.postRecurrences.useMutation(void 0, {
-    onError(t) {
-      s.error(i(r, t));
-    },
-    async onSuccess() {
-      await e.finops.getReceivables.invalidateQueries(o), s.success(r._("Recurrence has been created"));
-    }
-  });
+    i18n: d
+  } = p(), {
+    control: l
+  } = u();
+  return /* @__PURE__ */ o("div", { className: "ttw:flex ttw:flex-col ttw:gap-4", children: [
+    /* @__PURE__ */ e(n, { name: "memo", control: l, render: ({
+      field: r,
+      fieldState: {
+        error: i
+      }
+    }) => /* @__PURE__ */ e(t, { children: /* @__PURE__ */ o(s, { children: [
+      /* @__PURE__ */ e(m, { htmlFor: r.name, required: !0, children: d._("Memo") }),
+      /* @__PURE__ */ e(f, { ...r, id: r.name, disabled: a, placeholder: d._("Dear client, as discussed, please find attached our invoice:"), className: "ttw:h-20 ttw:resize-none", "aria-invalid": !!i }),
+      /* @__PURE__ */ e(c, { errors: i ? [i] : [] })
+    ] }) }) }),
+    h?.isFooterShown && /* @__PURE__ */ e(n, { name: "footer", control: l, render: ({
+      field: r,
+      fieldState: {
+        error: i
+      }
+    }) => /* @__PURE__ */ e(t, { children: /* @__PURE__ */ o(s, { children: [
+      /* @__PURE__ */ e(m, { htmlFor: r.name, children: d._("Note to customer") }),
+      /* @__PURE__ */ e(f, { ...r, id: r.name, disabled: a, placeholder: d._("Add a note to be displayed below the line items"), className: "ttw:h-20 ttw:resize-none", "aria-invalid": !!i }),
+      /* @__PURE__ */ e(c, { errors: i ? [i] : [] })
+    ] }) }) }),
+    h?.isPurchaseOrderShown && /* @__PURE__ */ e(n, { name: "purchase_order", control: l, render: ({
+      field: r,
+      fieldState: {
+        error: i
+      }
+    }) => /* @__PURE__ */ e(t, { children: /* @__PURE__ */ o(s, { children: [
+      /* @__PURE__ */ e(m, { htmlFor: r.name, children: d._("Purchase order") }),
+      /* @__PURE__ */ e(w, { ...r, id: r.name, disabled: a, placeholder: d._("Add number"), "aria-invalid": !!i }),
+      /* @__PURE__ */ e(c, { errors: i ? [i] : [] })
+    ] }) }) }),
+    h?.isTermsAndConditionsShown && /* @__PURE__ */ e(n, { name: "terms_and_conditions", control: l, render: ({
+      field: r,
+      fieldState: {
+        error: i
+      }
+    }) => /* @__PURE__ */ e(t, { children: /* @__PURE__ */ o(s, { children: [
+      /* @__PURE__ */ e(m, { htmlFor: r.name, required: !0, children: d._("Terms and conditions") }),
+      /* @__PURE__ */ e(f, { ...r, id: r.name, disabled: a, placeholder: d._("Add text"), className: "ttw:h-20 ttw:resize-none", "aria-invalid": !!i }),
+      /* @__PURE__ */ e(c, { errors: i ? [i] : [] })
+    ] }) }) })
+  ] });
 };
 export {
-  f as useCreateRecurrence
+  N as EntitySection
 };

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

@@ -1,15 +1,120 @@
-import { useRef as l, useCallback as n } from "react";
-const a = () => {
-  const e = l(null), t = n((r) => {
-    e.current = r;
-  }, []), u = n(() => {
-    e.current?.();
-  }, []);
-  return {
-    registerLineItemCleanupFn: t,
-    runLineItemCleanup: u
-  };
+import { jsxs as s, jsx as i } from "@emotion/react/jsx-runtime";
+import { useFormErrors as M, FormErrorDisplay as q } from "./index301.js";
+import { InvoiceItemRow as k } from "./index302.js";
+import { InvoiceTotals as B } from "./index303.js";
+import { CUSTOM_ID as O } from "./index304.js";
+import { useLineItemManagement as z } from "./index305.js";
+import { useLingui as W } from "@lingui/react";
+import { Button as J } from "./index86.js";
+import { Field as Q, FieldContent as Y, FieldLabel as H } from "./index164.js";
+import { Typography as m } from "./index87.js";
+import { Plus as K } from "lucide-react";
+import { useCallback as h, useEffect as X, useRef as Z } from "react";
+import { useFormContext as tt, Controller as et } from "react-hook-form";
+import { LoadingSpinner as it } from "./index144.js";
+import { useGetMeasureUnits as rt } from "./index212.js";
+import { InputGroup as at, InputGroupInput as nt, InputGroupAddon as ot } from "./index103.js";
+import { sanitizeTaxRateInput as lt } from "./index306.js";
+import { Separator as st } from "./index148.js";
+const Lt = ({
+  defaultCurrency: d = "USD",
+  actualCurrency: u = d,
+  registerLineItemCleanupFn: c,
+  handleOpenCreateProductDialog: I
+}) => {
+  const {
+    i18n: a
+  } = W(), {
+    control: _,
+    formState: g,
+    getValues: w,
+    watch: $,
+    trigger: v
+  } = tt(), N = $("tax_mode") === "inclusive", {
+    data: b,
+    isLoading: L
+  } = rt(), {
+    fields: p,
+    subtotalPrice: P,
+    totalPrice: R,
+    totalTaxes: F,
+    lineItemErrors: T,
+    handleAddRow: U,
+    handleRemoveItem: E,
+    setValueWithValidationLocal: f,
+    cleanUpLineItemsForSubmission: x
+  } = z({
+    actualCurrency: u,
+    defaultCurrency: d,
+    isInclusivePricing: N
+  }), r = h((t, e) => {
+    f(t, e, {
+      shouldValidate: !1
+    });
+  }, [f]);
+  X(() => (c?.(x), () => c?.(null)), [c, x]);
+  const y = Z(null), {
+    generalError: S,
+    fieldErrors: A
+  } = M(T), C = h((t, e, n) => {
+    const l = e.measureUnit?.id, o = e.measureUnit?.name;
+    o && !l ? (r(`line_items.${t}.product.measure_unit_id`, ""), r(`line_items.${t}.product.measure_unit_name`, o), r(`line_items.${t}.measure_unit`, {
+      name: o,
+      id: null
+    })) : (l || n) && (r(`line_items.${t}.product.measure_unit_id`, l || n), r(`line_items.${t}.product.measure_unit_name`, void 0), r(`line_items.${t}.measure_unit`, void 0));
+  }, [r]), V = h((t, e, n) => {
+    const l = e.label ?? "";
+    if (r(`line_items.${t}.product.name`, l), e.id !== "" && e.id !== O && n) {
+      r(`line_items.${t}.product.price.value`, e.price?.value ?? 0), r(`line_items.${t}.product.price.currency`, u);
+      const o = w(`line_items.${t}.product.measure_unit_id`);
+      C(t, e, o), r(`line_items.${t}.quantity`, e.smallestAmount ?? 1), r(`line_items.${t}.product.smallest_amount`, e.smallestAmount), r(`line_items.${t}.product.type`, "product"), r(`line_items.${t}.product.description`, e.description ?? ""), v(`line_items.${t}`);
+    }
+  }, [u, w, r, C, v]);
+  return /* @__PURE__ */ s("div", { ref: y, className: "ttw:flex ttw:flex-col ttw:p-6 ttw:gap-2.5 ttw:border ttw:border-border ttw:rounded-xl", children: [
+    /* @__PURE__ */ s("div", { className: "ttw:flex ttw:flex-col ttw:gap-2.5", children: [
+      /* @__PURE__ */ i(m, { variant: "h4", children: a._("Products and services") }),
+      /* @__PURE__ */ i(m, { variant: "body2", color: "muted", className: "ttw:font-medium", children: a._("Add the products and services on this invoice. You'll have the option to save new items to your inventory.") })
+    ] }),
+    /* @__PURE__ */ i(q, { generalError: g?.errors?.line_items?.root?.message ?? S, fieldErrors: A }),
+    /* @__PURE__ */ s("ul", { className: "ttw:flex ttw:flex-col ttw:gap-2.5", children: [
+      /* @__PURE__ */ s("li", { className: "ttw:flex ttw:items-center ttw:gap-2.5 ttw:h-5", children: [
+        /* @__PURE__ */ i(m, { variant: "body2", className: "ttw:font-medium ttw:leading-5 ttw:min-w-30 ttw:whitespace-nowrap ttw:inline-flex ttw:flex-1", children: a._("Item name") }),
+        /* @__PURE__ */ i(m, { variant: "body2", className: "ttw:font-medium ttw:leading-5 ttw:w-24 ttw:min-w-24", children: a._("Quantity") }),
+        /* @__PURE__ */ i(m, { variant: "body2", className: "ttw:font-medium ttw:leading-5 ttw:w-20.5 ttw:min-w-20.5", children: a._("Units") }),
+        /* @__PURE__ */ i(m, { variant: "body2", className: "ttw:font-medium ttw:leading-5 ttw:max-w-41 ttw:w-full ttw:min-w-29", children: a._("Price") }),
+        /* @__PURE__ */ i(m, { variant: "body2", className: "ttw:font-medium ttw:leading-5 ttw:w-12 ttw:min-w-12", children: a._("Taxable") }),
+        p.length > 1 && /* @__PURE__ */ i("div", { className: "ttw:w-10 ttw:min-w-10" })
+      ] }),
+      L ? /* @__PURE__ */ i("li", { className: "ttw:flex ttw:items-center ttw:justify-center ttw:h-9", children: /* @__PURE__ */ i(it, { className: "ttw:w-5 ttw:h-5" }) }) : p.map((t, e) => {
+        const n = (o) => w(`line_items.${e}.${o}`), l = (o, j, D) => {
+          const G = `line_items.${e}.${o}`;
+          f(G, j, D);
+        };
+        return /* @__PURE__ */ i(k, { field: t, index: e, control: _, errors: g.errors, actualCurrency: u, defaultCurrency: d, measureUnitsData: b, onRequestLineItemValue: n, onLineItemValueChange: l, onRequestOpenCreateProductDialog: I, canRemove: p.length > 1, onUpdateItem: V, onRemoveItem: E, container: y }, t.id);
+      })
+    ] }),
+    /* @__PURE__ */ s(J, { type: "button", variant: "ghost", onClick: U, className: "ttw:text-primary ttw:hover:text-primary ttw:w-fit", children: [
+      /* @__PURE__ */ i(K, { className: "ttw:size-5 ttw:text-primary" }),
+      a._("Add item")
+    ] }),
+    /* @__PURE__ */ i(et, { name: "tax_rate", control: _, render: ({
+      field: t
+    }) => /* @__PURE__ */ i(Q, { children: /* @__PURE__ */ s(Y, { className: "ttw:flex-row ttw:justify-end", children: [
+      /* @__PURE__ */ i(H, { htmlFor: t.name, children: a._("Tax rate") }),
+      /* @__PURE__ */ s(at, { className: "ttw:w-28 ttw:has-[>[data-align=inline-end]]:[&>input]:pr-0", children: [
+        /* @__PURE__ */ i(nt, { ...t, value: t.value ?? "", id: t.name, className: "ttw:text-right", placeholder: a._("e.g. 6.25"), type: "text", inputMode: "decimal", onChange: (e) => {
+          t.onChange(lt(e.target.value));
+        }, onBlur: (e) => {
+          const n = e.target.value;
+          t.onChange(n.endsWith(".") ? n.slice(0, -1) : n), t.onBlur();
+        } }),
+        /* @__PURE__ */ i(ot, { align: "inline-end", children: "%" })
+      ] })
+    ] }) }) }),
+    /* @__PURE__ */ i(st, {}),
+    /* @__PURE__ */ i(B, { subtotalPrice: P, totalTaxes: F, totalPrice: R, actualCurrency: u, defaultCurrency: d })
+  ] });
 };
 export {
-  a as useLineItemSubmitCleanup
+  Lt as ItemsSection
 };

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

@@ -1,14 +1,78 @@
-import { useMoniteContext as s } from "./index59.js";
-const r = (e, t = !0) => {
+import { jsxs as e, Fragment as v, jsx as t } from "@emotion/react/jsx-runtime";
+import { useFormContext as N, Controller as _ } from "react-hook-form";
+import { calculateDueDate as D } from "./index7.js";
+import { useMoniteContext as F } from "./index59.js";
+import { useLingui as S } from "@lingui/react";
+import { PaymentSection as T } from "./index307.js";
+import { Typography as o } from "./index87.js";
+import { LockKeyhole as c } from "lucide-react";
+import { DatePicker as C } from "./index308.js";
+import { Field as P, FieldContent as L, FieldLabel as M, FieldError as Y } from "./index164.js";
+const V = ({
+  disabled: n,
+  paymentTerms: i,
+  isPaymentTermsLoading: f,
+  isFieldShown: w,
+  refetch: u
+}) => {
   const {
-    api: n
-  } = s();
-  return n.finops.getBankDetails.useQuery({
-    query: e
-  }, {
-    enabled: t
-  });
+    i18n: a
+  } = S(), {
+    control: h,
+    watch: y,
+    setValue: p
+  } = N(), {
+    locale: s
+  } = F(), b = a.date(/* @__PURE__ */ new Date(), s.dateTimeFormat), x = y("payment_terms_id"), l = i?.data?.find((r) => r.id === x), d = l && D(l), g = async (r = "") => {
+    try {
+      await u(), await Promise.resolve(), p("payment_terms_id", r);
+    } catch (m) {
+      console.error("Error changing payment terms:", m);
+    }
+  };
+  return /* @__PURE__ */ e(v, { children: [
+    /* @__PURE__ */ e("div", { className: "ttw:flex", children: [
+      /* @__PURE__ */ e("div", { className: "ttw:flex ttw:flex-col ttw:basis-1/2", children: [
+        /* @__PURE__ */ t(o, { variant: "body2", color: "muted", className: "ttw:font-medium ttw:mb-1", children: a._("Issue date") }),
+        /* @__PURE__ */ e("div", { children: [
+          /* @__PURE__ */ t(o, { variant: "body2", color: "muted", children: b }),
+          /* @__PURE__ */ e(o, { variant: "body2", color: "muted", className: "ttw:flex ttw:items-center ttw:gap-1.5", children: [
+            /* @__PURE__ */ t(c, { className: "ttw:size-4 ttw:text-muted-foreground" }),
+            a._("Set on issuance")
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ e("div", { className: "ttw:flex ttw:flex-col ttw:basis-1/2", children: [
+        /* @__PURE__ */ t(o, { variant: "body2", color: "muted", className: "ttw:font-medium ttw:mb-1", children: a._("Due date") }),
+        /* @__PURE__ */ e("div", { children: [
+          /* @__PURE__ */ e(o, { variant: "body2", color: "muted", children: [
+            l?.name ? "" : a._("Not selected"),
+            d ? a.date(d, s.dateTimeFormat) : ""
+          ] }),
+          /* @__PURE__ */ e(o, { variant: "body2", color: "muted", className: "ttw:flex ttw:items-center ttw:gap-1.5", children: [
+            /* @__PURE__ */ t(c, { className: "ttw:size-4 ttw:text-muted-foreground" }),
+            a._("Set by payment term")
+          ] })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ e("div", { className: "ttw:mt-4 ttw:flex ttw:flex-col ttw:gap-4", children: [
+      /* @__PURE__ */ t(T, { disabled: n, paymentTerms: i, isLoading: f, selectedPaymentTerm: l, onPaymentTermsChange: g }),
+      w && /* @__PURE__ */ t(_, { name: "fulfillment_date", control: h, render: ({
+        field: r,
+        fieldState: {
+          error: m
+        }
+      }) => /* @__PURE__ */ t(P, { className: "ttw:mb-4", children: /* @__PURE__ */ e(L, { children: [
+        /* @__PURE__ */ t(M, { htmlFor: "fulfillment_date", className: "ttw:text-muted-foreground", children: a._("Fulfillment date") }),
+        /* @__PURE__ */ t(C, { ...r, selected: r.value ?? void 0, onSelect: r.onChange, shouldDisableButton: n, startMonth: /* @__PURE__ */ new Date(), endMonth: new Date(2050, 11), disabled: {
+          before: /* @__PURE__ */ new Date()
+        }, showOutsideDays: !1, placeholder: "MM/DD/YYYY" }),
+        /* @__PURE__ */ t(Y, { errors: m ? [m] : [] })
+      ] }) }) })
+    ] })
+  ] });
 };
 export {
-  r as useGetEntityBankAccounts
+  V as FullfillmentSummary
 };

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

@@ -1,24 +1,72 @@
-import { useMoniteContext as o } from "./index59.js";
-const a = ({
-  counterpart_billing_address_id: e,
-  counterpart_country: r,
-  counterpart_id: t,
-  counterpart_type: n
+import { jsx as t } from "@emotion/react/jsx-runtime";
+import { InvoicePreviewMonite as d } from "./index309.js";
+import { useAdaptiveScale as p } from "./index310.js";
+import { AspectRatio as v } from "./index311.js";
+import { cn as e } from "./index102.js";
+import { useRef as n } from "react";
+import { useGetMeasureUnits as h } from "./index212.js";
+const I = ({
+  address: i,
+  counterpart: s,
+  currency: o,
+  invoiceData: w,
+  entityData: m,
+  paymentTerms: l
 }) => {
-  const {
-    api: i
-  } = o();
-  return i.finops.getReceivablesRequiredFields.useQuery({
-    query: {
-      counterpart_billing_address_id: e,
-      counterpart_country: r,
-      counterpart_id: t,
-      counterpart_type: n
-    }
-  }, {
-    enabled: !!e && !!t
-  });
+  const r = n(null), a = n(null), {
+    data: c
+  } = h(), f = p(r, a, {
+    containerPadding: 96,
+    minScale: 1,
+    initialDelay: 100,
+    useAdaptiveDimensions: !0
+    // Enable DPI-aware A4 dimensions
+  }), u = {
+    address: i,
+    counterpart: s,
+    currency: o,
+    invoiceData: w,
+    entityData: m,
+    paymentTerms: l,
+    measureUnits: c?.data || []
+  };
+  return /* @__PURE__ */ t("div", { ref: r, className: e(
+    // Container layout
+    "ttw:flex ttw:overflow-auto ttw:relative",
+    "ttw:w-full ttw:h-full ttw:min-h-0",
+    "ttw:p-12",
+    // 48px padding
+    "ttw:bg-gradient-to-br ttw:from-slate-50 ttw:to-slate-200",
+    // Force pixel-snapping for zoom stability
+    "ttw:[transform:translateZ(0)]"
+  ), style: {
+    justifyContent: "safe center",
+    alignItems: "safe center"
+  }, children: /* @__PURE__ */ t(v, { ratio: 21 / 29.7, className: e(
+    // Maximum width constraints for A4
+    "ttw:max-w-[21cm]",
+    // Minimum dimensions for proper scaling (A4: 794×1123px = 21cm × 29.7cm)
+    "ttw:min-w-[794px] ttw:min-h-[1123px]",
+    // Responsive scaling with our adaptive scale hook
+    "ttw:transition-transform ttw:duration-200 ttw:ease-in-out",
+    // Respect reduced motion preferences
+    "motion-reduce:ttw:transition-none",
+    "ttw:origin-center",
+    // Prevent unwanted shrinking and layout shifts
+    "ttw:shrink-0",
+    // CSS containment for layout stability
+    'ttw:[contain:"layout style"]'
+  ), style: {
+    // Dynamic transform must stay as inline style due to variable
+    transform: `scale(${f})`
+  }, children: /* @__PURE__ */ t("div", { ref: a, className: e(
+    // Full size within aspect ratio container
+    "ttw:w-full ttw:h-full",
+    "ttw:bg-white ttw:shrink-0",
+    "ttw:shadow-md",
+    "ttw:overflow-hidden"
+  ), children: /* @__PURE__ */ t(d, { ...u }) }) }) });
 };
 export {
-  a as useGetInvoiceRequiredFields
+  I as InvoicePreview
 };