@tesouro/embedded-components-react 0.2.217 → 0.2.218

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

@@ -1,130 +1,99 @@
-import { jsxs as i, jsx as t, Fragment as z } from "@emotion/react/jsx-runtime";
-import { CreateCounterpartDialog as B } from "./index142.js";
-import { CounterpartSelector as U } from "./index413.js";
-import { getCounterpartName as P, getCounterpartEmail as R } from "./index7.js";
-import "./index57.js";
-import "@tanstack/react-query";
-import { useCounterpartAddresses as W } from "./index72.js";
-import { useRef as q, useState as F, useCallback as G, useEffect as k } from "react";
-import "react-hot-toast";
-import { useLingui as H } from "@lingui/react";
-import { useFormContext as J, Controller as K } from "react-hook-form";
-import { CounterpartDetails as Q } from "./index2.js";
-import { Typography as f } from "./index85.js";
-import { Avatar as X, AvatarFallback as Y } from "./index414.js";
-import { Field as Z, FieldContent as tt, FieldLabel as et, FieldError as rt } from "./index145.js";
-import { Input as at } from "./index146.js";
-import { Button as b } from "./index84.js";
-import { Separator as it } from "./index126.js";
-import { Plus as ot } from "lucide-react";
-const Et = ({
-  disabled: d,
-  canCreateCounterpart: _,
-  isEditCustomerOpen: m,
-  handleOpenEditCustomer: A,
-  counterpart: a
-}) => {
+import { jsx as a, jsxs as o, Fragment as w } from "@emotion/react/jsx-runtime";
+import { useLingui as v } from "@lingui/react";
+import { ListFilter as p } from "lucide-react";
+import { useFilterPanel as g, FilterBar as C, FilterTag as x, Popover as b, PopoverTrigger as F, FilterMenuButton as f, PopoverContent as P, DateRangePicker as D, MultiSelectFilter as N, AmountFilter as M, Input as y, RadioGroup as I, RadioGroupItem as S, SearchInput as k } from "../../../../packages/shared-ui-shadcn/dist/index.js";
+const A = {
+  date: "ttw:w-auto",
+  status: "ttw:w-56",
+  amount: "ttw:w-64",
+  vendor: "ttw:w-64",
+  attachment: "ttw:w-56"
+}, _ = {
+  due_date: "Due date",
+  created_at: "Created on",
+  issued_at: "Issue date"
+}, L = [{
+  id: "date",
+  label: "Due date",
+  activeDateField: "due_date"
+}, {
+  id: "date",
+  label: "Created on",
+  activeDateField: "created_at"
+}, {
+  id: "date",
+  label: "Issue date",
+  activeDateField: "issued_at"
+}, {
+  id: "status",
+  label: "Status",
+  activeDateField: void 0
+}, {
+  id: "amount",
+  label: "Amount",
+  activeDateField: void 0
+}, {
+  id: "vendor",
+  label: "Vendor",
+  activeDateField: void 0
+}, {
+  id: "attachment",
+  label: "Attachment",
+  activeDateField: void 0
+}];
+function H(e) {
   const {
-    i18n: s
-  } = H(), {
-    watch: l,
-    setValue: e,
-    control: S,
-    clearErrors: j
-  } = J(), o = l("counterpart_id"), g = q(o), x = l("default_billing_address_id"), y = l("default_shipping_address_id"), {
-    data: c
-  } = W(a?.id), [v, N] = F(!1), [E, h] = F(!1), D = !!o, w = P(a), I = R(a), O = w ? Array.from(w)[0]?.toUpperCase() ?? "?" : "?", C = l("counterpart_name") ?? "", $ = l("counterpart_email") ?? "", T = () => {
-    e("counterpart_id", ""), e("counterpart_name", ""), e("counterpart_email", "");
-  }, V = G((r) => {
-    const n = {
-      email: $,
-      phone: "",
-      isCustomer: !0,
-      isVendor: !1,
-      line1: "",
-      line2: "",
-      city: "",
-      state: "",
-      postalCode: "",
-      country: "US"
-    };
-    if (r === "individual") {
-      const p = C.trim(), u = p.indexOf(" "), L = u === -1 ? p : p.slice(0, u), M = u === -1 ? "" : p.slice(u + 1);
-      return {
-        tax_id: "",
-        counterpart: {
-          ...n,
-          firstName: L,
-          lastName: M
-        }
-      };
-    }
-    return {
-      tax_id: "",
-      counterpart: {
-        ...n,
-        companyName: C
-      }
-    };
-  }, [C, $]);
-  return k(() => {
-    g.current !== o && (g.current = o, e("default_billing_address_id", ""), e("default_shipping_address_id", ""));
-  }, [o, e]), k(() => {
-    if (c?.data?.length && !(!a || a.id !== o)) {
-      if (!x) {
-        const r = a.default_billing_address_id || (c.data.length === 1 ? c.data[0].id : "");
-        e("default_billing_address_id", r);
-      }
-      if (!y) {
-        const r = a.default_shipping_address_id || "";
-        e("default_shipping_address_id", r);
-      }
-    }
-  }, [c, e, a, o, x, y]), /* @__PURE__ */ i("div", { className: "ttw:flex ttw:flex-col ttw:p-6 ttw:gap-2.5 ttw:border ttw:border-border ttw:rounded-xl", children: [
-    /* @__PURE__ */ i("div", { className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:pb-4", children: [
-      /* @__PURE__ */ t(f, { variant: "h4", children: s._("Customer details") }),
-      /* @__PURE__ */ t(f, { variant: "body2", color: "muted", className: "ttw:font-medium", children: s._("Who are you billing?") })
-    ] }),
-    D ? /* @__PURE__ */ i("div", { className: "ttw:flex ttw:gap-2 ttw:justify-between ttw:items-center ttw:border ttw:border-border ttw:p-3 ttw:rounded-xl", children: [
-      /* @__PURE__ */ i("div", { className: "ttw:flex ttw:items-center ttw:gap-5", children: [
-        /* @__PURE__ */ t(X, { className: "ttw:size-16", children: /* @__PURE__ */ t(Y, { className: "ttw:text-sm ttw:font-normal", children: O }) }),
-        /* @__PURE__ */ i("div", { className: "ttw:flex ttw:flex-col ttw:gap-1", children: [
-          /* @__PURE__ */ t(f, { variant: "body1", className: "ttw:font-medium", children: w }),
-          /* @__PURE__ */ t(f, { variant: "body2", color: "muted", children: I })
-        ] })
+    i18n: i
+  } = v(), n = g(), s = n.isMenuOpen || !!n.activePanelId, r = n.activePanelId && A[n.activePanelId] || "ttw:w-52", d = e.allPresets.map((t) => ({
+    value: t.value,
+    label: t.label,
+    group: t.group
+  })), c = (t) => {
+    t || (n.closeMenu(), n.closePanel());
+  }, u = (t, l) => {
+    l && e.onActiveDateFieldChange(l), n.openPanel(t);
+  }, m = e.hasFile === !0 ? "has" : e.hasFile === !1 ? "no" : "any", h = (t) => {
+    t === "any" ? e.onHasFileChange(void 0) : t === "has" ? e.onHasFileChange(!0) : e.onHasFileChange(!1);
+  };
+  return /* @__PURE__ */ a(C, { className: "ttw:pl-4", searchSlot: /* @__PURE__ */ a(k, { value: e.searchValue, onChange: (t) => e.onSearchChange(t.target.value), placeholder: "Search by number or vendor..." }), menuSlot: /* @__PURE__ */ o(b, { open: s, onOpenChange: c, children: [
+    /* @__PURE__ */ a(F, { asChild: !0, children: /* @__PURE__ */ a(f, { activeCount: e.activeFilterCount, onClick: n.toggleMenu }) }),
+    /* @__PURE__ */ o(P, { align: "start", className: `ttw:p-0 ${r}`, children: [
+      n.isMenuOpen && /* @__PURE__ */ a("div", { className: "ttw:p-1", children: L.map((t, l) => /* @__PURE__ */ o("button", { type: "button", className: "ttw:flex ttw:items-center ttw:gap-2 ttw:w-full ttw:px-2 ttw:py-1.5 ttw:rounded-md ttw:text-xs ttw:font-medium ttw:hover:bg-accent ttw:transition-colors ttw:cursor-pointer", onClick: () => u(t.id, t.activeDateField), children: [
+        /* @__PURE__ */ a(p, { className: "ttw:size-4 ttw:text-muted-foreground ttw:shrink-0" }),
+        t.label
+      ] }, `${t.id}-${l}`)) }),
+      n.activePanelId === "date" && /* @__PURE__ */ a(D, { from: e.dateFrom, to: e.dateTo, onRangeChange: e.onDateRangeChange, selectedPreset: e.selectedDatePreset, onPresetChange: e.onDatePresetChange, presets: d, fieldLabel: _[e.activeDateField] }),
+      n.activePanelId === "status" && /* @__PURE__ */ a(N, { options: e.statusOptions, selectedValues: e.selectedStatus, onSelectionChange: e.onStatusChange }),
+      n.activePanelId === "amount" && /* @__PURE__ */ a(M, { mode: e.amountMode, onModeChange: e.onAmountModeChange, min: e.amountMin, max: e.amountMax, onMinChange: e.onAmountMinChange, onMaxChange: e.onAmountMaxChange, showFlowDirection: !1, minLabel: "No less than", maxLabel: "No more than" }),
+      n.activePanelId === "vendor" && /* @__PURE__ */ o("div", { className: "ttw:p-3 ttw:flex ttw:flex-col ttw:gap-2", children: [
+        /* @__PURE__ */ a("p", { className: "ttw:text-xs ttw:font-medium ttw:text-muted-foreground", children: "Vendor name" }),
+        /* @__PURE__ */ a(y, { type: "text", value: e.vendorName, onChange: (t) => e.onVendorNameChange(t.target.value), placeholder: "Search vendors...", className: "ttw:h-8 ttw:text-xs" }),
+        /* @__PURE__ */ a("p", { className: "ttw:text-xs ttw:text-muted-foreground", children: i._("Matches names containing your search") })
       ] }),
-      /* @__PURE__ */ i("div", { className: "ttw:flex ttw:items-center", children: [
-        /* @__PURE__ */ t(b, { type: "button", variant: "ghost", className: "ttw:text-primary ttw:hover:text-primary", disabled: d, onClick: () => N(!0), children: s._("View details") }),
-        /* @__PURE__ */ t(it, { orientation: "vertical", className: "ttw:h-6!" }),
-        /* @__PURE__ */ t(b, { type: "button", variant: "ghost", className: "ttw:text-primary ttw:hover:text-primary", disabled: d, onClick: T, children: s._("Clear") })
-      ] })
-    ] }) : /* @__PURE__ */ i(z, { children: [
-      /* @__PURE__ */ t(U, { disabled: d, canCreateCounterpart: _ }),
-      _ && /* @__PURE__ */ t(K, { name: "counterpart_email", control: S, render: ({
-        field: r,
-        fieldState: {
-          error: n
-        }
-      }) => /* @__PURE__ */ t(Z, { children: /* @__PURE__ */ i(tt, { children: [
-        /* @__PURE__ */ t(et, { htmlFor: r.name, children: s._("Email") }),
-        /* @__PURE__ */ t(at, { ...r, id: r.name, type: "email", disabled: d, "aria-invalid": !!n }),
-        /* @__PURE__ */ t(rt, { errors: n ? [n] : [] })
-      ] }) }) }),
-      _ && /* @__PURE__ */ i(b, { onClick: () => h(!0), type: "button", variant: "ghost", disabled: d, className: "ttw:text-primary ttw:hover:text-primary ttw:w-fit", children: [
-        /* @__PURE__ */ t(ot, {}),
-        s._("Add more details including address, phone, etc.")
-      ] })
-    ] }),
-    E && /* @__PURE__ */ t(B, { open: E, onClose: () => {
-      h(!1);
-    }, onCreate: (r) => {
-      h(!1), e("counterpart_id", r), e("counterpart_name", ""), e("counterpart_email", ""), j(["counterpart_id", "counterpart_email"]);
-    }, getCounterpartDefaultValues: V, customerType: "customer" }),
-    (m || v) && /* @__PURE__ */ t(Q, { counterpartId: a?.id || "", open: m || v, onClose: () => {
-      m && A(!1), N(!1);
-    }, isEditMode: m, showActionsMenu: !1, customerType: "customer" })
-  ] });
-};
+      n.activePanelId === "attachment" && /* @__PURE__ */ a("div", { className: "ttw:p-3", children: /* @__PURE__ */ a(I, { value: m, onValueChange: h, className: "ttw:flex ttw:flex-col ttw:gap-1", children: [{
+        value: "any",
+        label: "Any"
+      }, {
+        value: "has",
+        label: "Has attachment"
+      }, {
+        value: "no",
+        label: "No attachment"
+      }].map(({
+        value: t,
+        label: l
+      }) => /* @__PURE__ */ o("label", { className: "ttw:flex ttw:items-center ttw:gap-2 ttw:cursor-pointer", children: [
+        /* @__PURE__ */ a(S, { value: t }),
+        /* @__PURE__ */ a("span", { className: "ttw:text-xs ttw:font-medium", children: l })
+      ] }, t)) }) })
+    ] })
+  ] }), activeChipsSlot: /* @__PURE__ */ o(w, { children: [
+    e.activeChips.map((t) => /* @__PURE__ */ a(x, { label: t.label, count: t.count, variant: "default", onLabelClick: t.key === "date" ? () => {
+      n.openPanel("date");
+    } : void 0, onDismiss: () => e.onDismissChip(t.key) }, t.key)),
+    e.activeFilterCount > 0 && /* @__PURE__ */ a("button", { type: "button", className: "ttw:text-xs ttw:text-muted-foreground ttw:hover:text-foreground ttw:transition-colors ttw:cursor-pointer ttw:whitespace-nowrap", onClick: e.onClearAll, children: "Clear all" })
+  ] }) });
+}
 export {
-  Et as CustomerSection
+  H as PayablesFilterBar
 };

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

@@ -1,51 +1,215 @@
-import { jsxs as t, jsx as e } from "@emotion/react/jsx-runtime";
-import { Typography as o } from "./index85.js";
-import { useLingui as w } from "@lingui/react";
-import { PaymentSection as p } from "./index415.js";
-import { useFormContext as h, Controller as f } from "react-hook-form";
-import { Field as u, FieldContent as b, FieldLabel as g, FieldError as x } from "./index145.js";
-import { Input as y } from "./index146.js";
-import { RecurrenceSection as N } from "./index416.js";
-import { RemindersSection as v } from "./index417.js";
-const j = ({
-  paymentTerms: n,
-  disabled: a,
-  isPaymentTermsLoading: s,
-  showPurchaseOrder: d = !0,
-  lockRecurrenceSchedule: m = !1
-}) => {
-  const {
-    i18n: r
-  } = w(), {
-    control: c
-  } = h();
-  return /* @__PURE__ */ t("div", { className: "ttw:flex ttw:flex-col ttw:p-6 ttw:gap-2.5 ttw:border ttw:border-border ttw:rounded-xl", children: [
-    /* @__PURE__ */ t("div", { className: "ttw:flex ttw:flex-col ttw:gap-2.5 ttw:pb-4", children: [
-      /* @__PURE__ */ e(o, { variant: "h4", children: r._("Billing details") }),
-      /* @__PURE__ */ e(o, { variant: "body2", color: "muted", className: "ttw:font-medium", children: r._("What are the billing terms?") })
-    ] }),
-    /* @__PURE__ */ t("div", { className: "ttw:flex ttw:flex-col ttw:gap-6", children: [
-      /* @__PURE__ */ e(N, { lockSchedule: m }),
-      /* @__PURE__ */ t("div", { className: "ttw:flex ttw:items-start ttw:gap-2.5 ttw:w-full", children: [
-        /* @__PURE__ */ e(p, { paymentTerms: n, disabled: a, isLoading: s }),
-        d && /* @__PURE__ */ e(f, { name: "purchase_order", control: c, render: ({
-          field: i,
-          fieldState: {
-            error: l
-          }
-        }) => /* @__PURE__ */ e(u, { children: /* @__PURE__ */ t(b, { children: [
-          /* @__PURE__ */ t(g, { htmlFor: i.name, className: "ttw:text-nowrap", children: [
-            r._("PO Number"),
-            /* @__PURE__ */ e(o, { variant: "body2", color: "muted", className: "ttw:leading-snug", children: r._("(optional)") })
-          ] }),
-          /* @__PURE__ */ e(y, { ...i, id: i.name, disabled: a, "aria-invalid": !!l }),
-          /* @__PURE__ */ e(x, { errors: l ? [l] : [] })
-        ] }) }) })
-      ] }),
-      /* @__PURE__ */ e(v, { disabled: a })
-    ] })
-  ] });
-};
+import { formatDateRangeFilterChip as D, formatFilterChipMultiSelectValueSegment as C } from "./index97.js";
+import { getCounterpartName as I } from "./index7.js";
+import { useMoniteContext as $ } from "./index57.js";
+import { useCounterpartById as A } from "./index70.js";
+import "@tanstack/react-query";
+import { useState as w, useMemo as l, useCallback as d } from "react";
+import "react-hot-toast";
+import "@lingui/react";
+import { useCurrencies as x } from "./index58.js";
+import { toMinorUnits as E } from "./index118.js";
+import { formatISO as m } from "date-fns";
+import { DATE_PRESETS as _, resolveDatePreset as U } from "./index415.js";
+const v = [{
+  value: "draft",
+  label: "New"
+}, {
+  value: "pending_approval",
+  label: "Pending approval"
+}, {
+  value: "ready_to_pay",
+  label: "Ready to pay"
+}, {
+  value: "paid",
+  label: "Paid"
+}, {
+  value: "cancelled",
+  label: "Cancelled"
+}, {
+  value: "rejected",
+  label: "Rejected"
+}], j = {
+  draft: ["draft", "new"],
+  pending_approval: ["approve_in_progress"],
+  ready_to_pay: ["waiting_to_be_paid", "partially_paid"],
+  paid: ["paid"],
+  cancelled: ["canceled"],
+  rejected: ["rejected"]
+}, R = ["draft", "new", "approve_in_progress", "rejected", "waiting_to_be_paid", "partially_paid", "paid"];
+function h() {
+  return {
+    search: "",
+    activeDateField: "due_date",
+    datePreset: void 0,
+    dateFrom: void 0,
+    dateTo: void 0,
+    status: [],
+    amountMode: "any",
+    amountMin: "",
+    amountMax: "",
+    vendorName: "",
+    hasFile: void 0
+  };
+}
+function Q({
+  initialCounterpartId: f
+} = {}) {
+  const [e, o] = w(() => ({
+    ...h(),
+    counterpartId: f
+  })), {
+    formatToMinorUnits: u
+  } = x(), {
+    componentSettings: F
+  } = $(), {
+    data: b
+  } = A(e.counterpartId), c = I(b), p = F.onboarding.allowedCurrencies?.[0] ?? "USD", y = l(() => {
+    const a = {}, t = e.activeDateField;
+    if (e.dateFrom && (a[`${t}__gte`] = m(e.dateFrom, {
+      representation: "date"
+    })), e.dateTo && (a[`${t}__lte`] = m(e.dateTo, {
+      representation: "date"
+    })), e.status.length ? a.status__in = e.status.flatMap((r) => j[r] ?? [r]) : a.status__in = R, e.vendorName && (a.counterpart_name__icontains = e.vendorName), e.counterpartId && (a.counterpart_id = e.counterpartId), e.hasFile !== void 0 && (a.has_file = e.hasFile), e.search && (a.search_text = e.search), e.amountMode !== "any") {
+      const r = parseFloat(e.amountMin), s = parseFloat(e.amountMax), i = (n) => u(n, p) ?? E(n, 2);
+      if (e.amountMode === "exact") {
+        if (!isNaN(r)) {
+          const n = i(r);
+          a.total_amount__gte = n, a.total_amount__lte = n;
+        }
+      } else
+        isNaN(r) || (a.total_amount__gte = i(r)), isNaN(s) || (a.total_amount__lte = i(s));
+    }
+    return a;
+  }, [e, p, u]), g = l(() => {
+    let a = 0;
+    return e.status.length && a++, e.vendorName && a++, e.counterpartId && a++, e.hasFile !== void 0 && a++, e.amountMode !== "any" && a++, e.search && a++, a;
+  }, [e]), M = l(() => {
+    const a = [];
+    if (e.dateFrom || e.dateTo) {
+      const t = (e.datePreset ? _.find((s) => s.value === e.datePreset)?.label : void 0) ?? D(e.dateFrom, e.dateTo), r = e.activeDateField === "due_date" ? "Due date" : e.activeDateField === "created_at" ? "Created on" : "Issue date";
+      a.push({
+        key: "date",
+        label: `${r}: ${t}`
+      });
+    }
+    if (e.status.length) {
+      const t = e.status.map((r) => v.find((s) => s.value === r)?.label ?? r);
+      a.push({
+        key: "status",
+        label: `Status: ${C(t)}`
+      });
+    }
+    return e.vendorName && a.push({
+      key: "vendor",
+      label: `Vendor: ${e.vendorName}`
+    }), e.counterpartId && a.push({
+      key: "counterpart",
+      label: `Vendor: ${c || e.counterpartId}`
+    }), e.hasFile === !0 && a.push({
+      key: "attachment",
+      label: "Has attachment"
+    }), e.hasFile === !1 && a.push({
+      key: "attachment",
+      label: "No attachment"
+    }), e.amountMode !== "any" && a.push({
+      key: "amount",
+      label: "Amount"
+    }), e.search && a.push({
+      key: "search",
+      label: `Search: ${e.search}`
+    }), a;
+  }, [e, c]), N = d((a) => {
+    const {
+      from: t,
+      to: r
+    } = U(a);
+    o((s) => ({
+      ...s,
+      datePreset: a,
+      dateFrom: t,
+      dateTo: r
+    }));
+  }, []), P = d((a, t) => {
+    o((r) => ({
+      ...r,
+      datePreset: void 0,
+      dateFrom: a,
+      dateTo: t
+    }));
+  }, []), S = d((a) => {
+    o((t) => ({
+      ...t,
+      activeDateField: a
+    }));
+  }, []), T = d((a) => {
+    switch (a) {
+      case "date": {
+        o((t) => ({
+          ...t,
+          datePreset: void 0,
+          dateFrom: void 0,
+          dateTo: void 0,
+          activeDateField: "due_date"
+        }));
+        break;
+      }
+      case "status":
+        o((t) => ({
+          ...t,
+          status: []
+        }));
+        break;
+      case "vendor":
+        o((t) => ({
+          ...t,
+          vendorName: ""
+        }));
+        break;
+      case "counterpart":
+        o((t) => ({
+          ...t,
+          counterpartId: void 0
+        }));
+        break;
+      case "attachment":
+        o((t) => ({
+          ...t,
+          hasFile: void 0
+        }));
+        break;
+      case "amount":
+        o((t) => ({
+          ...t,
+          amountMode: "any",
+          amountMin: "",
+          amountMax: ""
+        }));
+        break;
+      case "search":
+        o((t) => ({
+          ...t,
+          search: ""
+        }));
+        break;
+    }
+  }, []), k = d(() => o(h()), []);
+  return {
+    state: e,
+    setState: o,
+    queryParams: y,
+    activeFilterCount: g,
+    activeChips: M,
+    datePresets: _,
+    statusOptions: v,
+    setDatePreset: N,
+    setDateRange: P,
+    setActiveDateField: S,
+    clearFilter: T,
+    clearAll: k
+  };
+}
 export {
-  j as BillingSection
+  R as AP_DEFAULT_STATUSES,
+  v as AP_STATUS_OPTIONS,
+  Q as usePayablesFilter
 };

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

@@ -1,5 +1,5 @@
 import { useMoniteContext as n } from "./index57.js";
-import { getAPIErrorMessage as d } from "./index120.js";
+import { getAPIErrorMessage as d } from "./index119.js";
 import { useLingui as p } from "@lingui/react";
 import { toast as r } from "react-hot-toast";
 const f = (s, i) => {