@tesouro/embedded-components-react 0.2.20 → 0.2.22

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

@@ -1,136 +1,98 @@
-import { jsxs as r, Fragment as R, jsx as t } from "@emotion/react/jsx-runtime";
-import { FinancedInvoiceStatusChip as T } from "./index56.js";
-import { InvoiceStatusChip as N } from "./index57.js";
-import { INVOICE_DOCUMENT_AUTO_ID as w } from "./index286.js";
-import { useKanmonContext as A } from "./index58.js";
-import { useMoniteContext as P } from "./index59.js";
-import { useCurrencies as j } from "./index60.js";
-import "react";
-import "./index94.js";
-import { useLingui as O } from "@lingui/react";
-import "react-dom";
-import "@mui/x-data-grid";
-import { useTheme as U, Box as i, Typography as a, darken as d, Divider as f, Button as $ } from "@mui/material";
-const Q = ({
-  invoice: s,
-  offers: g,
-  financedInvoice: e,
-  enableNavigate: u = !1,
-  handleNavigate: m
+import { jsx as i } from "@emotion/react/jsx-runtime";
+import { useDragScroll as b } from "./index445.js";
+import { PayableStatusChip as C } from "./index162.js";
+import { useMoniteContext as M } from "./index59.js";
+import { useCurrencies as x } from "./index60.js";
+import { Skeleton as A } from "./index150.js";
+import { StatusCard as D } from "./index362.js";
+import { useLingui as j } from "@lingui/react";
+import { useRef as L, useEffect as P } from "react";
+import { getPayablesAnalyticsSnapshot as U } from "./index446.js";
+const c = [{
+  groupStatus: "all",
+  apiStatuses: [],
+  representativeStatus: null
+}, {
+  groupStatus: "draft",
+  apiStatuses: ["draft", "new"],
+  representativeStatus: "draft"
+}, {
+  groupStatus: "pending_approval",
+  apiStatuses: ["approve_in_progress"],
+  representativeStatus: "approve_in_progress"
+}, {
+  groupStatus: "rejected",
+  apiStatuses: ["rejected"],
+  representativeStatus: "rejected"
+}, {
+  groupStatus: "ready_to_pay",
+  apiStatuses: ["waiting_to_be_paid", "partially_paid"],
+  representativeStatus: "waiting_to_be_paid"
+}, {
+  groupStatus: "paid",
+  apiStatuses: ["paid"],
+  representativeStatus: "paid"
+}, {
+  groupStatus: "cancelled",
+  apiStatuses: ["canceled"],
+  representativeStatus: "canceled"
+}], O = ({
+  onChangeFilter: o,
+  selectedStatus: s
 }) => {
   const {
-    i18n: n
-  } = O(), {
-    locale: x
-  } = P(), {
-    startFinanceSession: b
-  } = A(), {
-    formatCurrencyToDisplay: c
-  } = j(), o = U(), y = x.dateFormat, h = e ? n.date(e.issue_date, y) : "—", v = e ? c(e.total_amount, e.currency) : "-", l = g?.[0]?.pricing_plans?.reduce((_, p, W) => (p?.fee_percentage === e?.fee_percentage && p?.advance_rate_percentage === e?.advance_rate_percentage && (_ = {
-    pricingPlanIndex: W,
-    data: p
-  }), _), null), D = e?.repayment_schedule?.repayment_date ? n.date(e.repayment_schedule.repayment_date, y) : "—", C = e?.advance_amount ? c(e.advance_amount, e.currency) : "-", F = e?.fee_amount ? c(e.fee_amount, e.currency) : "-", I = e?.repayment_amount ? c(e.repayment_amount, e.currency) : "-", E = e?.status === "REJECTED" || e?.status === "NEW", S = e?.status === "FUNDED" || e?.status === "LATE";
-  return /* @__PURE__ */ r(R, { children: [
-    /* @__PURE__ */ r(i, { sx: {
-      p: 4,
-      display: "flex",
-      flexDirection: "column",
-      gap: 4
-    }, children: [
-      /* @__PURE__ */ t(a, { variant: "h3", children: n._("Funding details") }),
-      /* @__PURE__ */ r(i, { children: [
-        /* @__PURE__ */ t(a, { variant: "h2", fontWeight: 600, fontSize: 32, children: v }),
-        /* @__PURE__ */ t(a, { fontWeight: 500, variant: "body1", children: n._("{issueDate}", {
-          issueDate: h
-        }) })
-      ] }),
-      /* @__PURE__ */ r(i, { sx: {
-        display: "flex",
-        gap: 3
-      }, children: [
-        /* @__PURE__ */ r(i, { width: "100%", children: [
-          /* @__PURE__ */ t(a, { variant: "body1", color: d(o.palette.grey[50], 0.4), mb: 0.5, fontWeight: 400, children: n._("Financing plan {value}", {
-            value: (l?.pricingPlanIndex ?? 0) + 1
-          }) }),
-          /* @__PURE__ */ t(a, { variant: "body1", fontWeight: 400, children: n._("{value}% advance rate, Pay in {pricingPlan} days, {value1}% fee", {
-            value: (l?.data?.advance_rate_percentage ?? 0) / 100,
-            pricingPlan: l?.data?.repayment_duration_days,
-            value1: (l?.data?.fee_percentage ?? 0) / 100
-          }) })
-        ] }),
-        /* @__PURE__ */ r(i, { width: "100%", children: [
-          /* @__PURE__ */ t(a, { variant: "body1", color: d(o.palette.grey[50], 0.4), mb: 0.5, fontWeight: 400, children: n._("Repayment on") }),
-          /* @__PURE__ */ t(a, { variant: "body1", fontWeight: 400, children: n._("{repaymentDate}", {
-            repaymentDate: D
-          }) })
-        ] }),
-        /* @__PURE__ */ r(i, { width: "100%", children: [
-          /* @__PURE__ */ t(a, { variant: "body1", color: d(o.palette.grey[50], 0.4), mb: 0.5, fontWeight: 400, children: n._("Status") }),
-          /* @__PURE__ */ t(T, { icon: !0, status: e?.status ?? "DEFAULTED" })
-        ] })
-      ] }),
-      /* @__PURE__ */ t(f, {}),
-      /* @__PURE__ */ r(i, { sx: {
-        display: "grid",
-        gridTemplateColumns: "minmax(140px, auto) 1fr",
-        flexDirection: "column",
-        rowGap: 1,
-        columnGap: 2
-      }, children: [
-        /* @__PURE__ */ t(a, { variant: "body1", color: d(o.palette.grey[50], 0.4), children: n._("{isRequestedSum}", {
-          isRequestedSum: E ? "Requested sum" : "Received sum"
-        }) }),
-        /* @__PURE__ */ t(a, { variant: "body1", children: C }),
-        /* @__PURE__ */ t(a, { variant: "body1", color: d(o.palette.grey[50], 0.4), children: n._("Service Fee") }),
-        /* @__PURE__ */ t(a, { variant: "body1", children: F }),
-        /* @__PURE__ */ t(a, { variant: "body1", color: d(o.palette.grey[50], 0.4), children: n._("Repayment sum") }),
-        /* @__PURE__ */ t(a, { variant: "body1", children: I })
-      ] }),
-      /* @__PURE__ */ t(f, {}),
-      /* @__PURE__ */ r(i, { sx: {
-        borderRadius: "16px",
-        px: 3,
-        py: 2.5,
-        border: `1px solid ${o.palette.divider}`,
-        display: "flex",
-        gap: 2,
-        justifyContent: "space-between",
-        alignItems: "center",
-        cursor: u ? "pointer" : "default"
-      }, ...u && m && {
-        onClick: () => m(s.id)
-      }, children: [
-        /* @__PURE__ */ r(i, { children: [
-          /* @__PURE__ */ t(a, { variant: "body1", fontWeight: 500, children: n._("Invoice {invoiceDocument_id}", {
-            invoiceDocument_id: s.document_id || w
-          }) }),
-          /* @__PURE__ */ t(a, { color: o.palette.text.secondary, variant: "body2", children: n._("For {invoiceAmount} | Issued {issueDate}", {
-            invoiceAmount: v,
-            issueDate: h
-          }) })
-        ] }),
-        /* @__PURE__ */ t(i, { children: /* @__PURE__ */ t(N, { status: s.status }) })
-      ] })
-    ] }),
-    S && /* @__PURE__ */ t(i, { sx: {
-      mt: "auto",
-      borderTop: `1px solid ${o.palette.divider}`,
-      px: 4,
-      py: 2,
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "flex-end"
-    }, children: /* @__PURE__ */ t($, { variant: "contained", color: "primary", onClick: () => b({
-      component: "PAY_NOW"
-    }), sx: {
-      py: 1.25,
-      px: 1.5,
-      height: 32,
-      fontSize: 14,
-      ml: "auto"
-    }, children: n._("Repay now") }) })
-  ] });
+    i18n: l
+  } = j(), {
+    data: r,
+    isLoading: n
+  } = k(), {
+    formatCurrencyToDisplay: m
+  } = x(), {
+    containerRef: S,
+    handleMouseDown: f,
+    handleMouseLeave: v,
+    handleMouseUp: _,
+    handleMouseMove: g
+  } = b();
+  if (n)
+    return /* @__PURE__ */ i("div", { className: "ttw:flex ttw:gap-2", children: Array.from({
+      length: 6
+    }).map((t, u) => /* @__PURE__ */ i(A, { className: "ttw:h-16.5 ttw:w-42 ttw:rounded-xl ttw:animate-pulse" }, u)) });
+  const d = r?.data ?? [], w = c.map(({
+    groupStatus: t,
+    apiStatuses: u
+  }) => {
+    if (t === "all")
+      return {
+        status: "all",
+        count: d.reduce((e, a) => e + a.count, 0),
+        sum_total_amount: d.reduce((e, a) => e + (a.sum_total_amount ?? 0), 0)
+      };
+    const p = d.filter((e) => u.includes(e.status));
+    return {
+      status: t,
+      count: p.reduce((e, a) => e + a.count, 0),
+      sum_total_amount: p.reduce((e, a) => e + (a.sum_total_amount ?? 0), 0)
+    };
+  }).filter((t) => t.status === "all" || t.count > 0), h = (t) => {
+    o("status", t === "all" ? null : t);
+  }, y = (t) => m(t, "USD") ?? "—";
+  return /* @__PURE__ */ i("div", { ref: S, className: "ttw:flex ttw:gap-2 ttw:mb-6 ttw:overflow-x-auto ttw:[scrollbar-width:none] ttw:[&::-webkit-scrollbar]:hidden ttw:cursor-grab ttw:select-none", onMouseDown: f, onMouseLeave: v, onMouseUp: _, onMouseMove: g, children: w.map((t) => {
+    const u = c.find((p) => p.groupStatus === t.status);
+    return /* @__PURE__ */ i(D, { allItemsText: l._("All bills"), isAllStatus: t.status === "all", data: t.status === "all" ? t.count ?? 0 : t.sum_total_amount ?? 0, amountOfItems: t.status !== "all" ? t.count ?? 0 : void 0, selected: s === t.status, onClick: () => h(t.status), formatAmount: y, statusChip: u?.representativeStatus ? /* @__PURE__ */ i(C, { status: u.representativeStatus }) : void 0 }, t.status);
+  }) });
+}, k = () => {
+  const {
+    api: o,
+    queryClient: s
+  } = M(), l = o.finops.getPayablesAnalytics.useQuery({}, {
+    enabled: !!s,
+    refetchInterval: 3e3
+  }), r = U(l.data?.data), n = L(void 0);
+  return P(() => {
+    r !== void 0 && n.current !== void 0 && r !== n.current && s && o.finops.getPayables.invalidateQueries(s), n.current = r;
+  }, [r, o, s]), l;
 };
 export {
-  Q as FinanceDetails
+  O as SummaryCardsFilters
 };

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

@@ -1,164 +1,99 @@
-import { jsx as t, jsxs as $ } from "@emotion/react/jsx-runtime";
-import { FinanceDetails as z } from "./index356.js";
-import { ScopedCssBaselineContainerClassName as G } from "./index106.js";
-import { FinancedInvoiceStatusChip as k } from "./index56.js";
-import { useMoniteContext as A } from "./index59.js";
-import "react-hot-toast";
-import { useLingui as E } from "@lingui/react";
-import { useKanmonContext as L } from "./index58.js";
-import { useCurrencies as B } from "./index60.js";
-import { useState as r, useMemo as W } from "react";
-import "./index94.js";
-import { defaultCounterpartColumnWidth as j, useAutosizeGridColumns as U } from "./index64.js";
-import "@tanstack/react-query";
-import "date-fns";
-import { useGetReceivableById as q } from "./index84.js";
-import "react-script-hook";
-import { useGetFinancedInvoices as H } from "./index358.js";
-import { MoniteScopedProviders as K } from "./index85.js";
-import { ReceivableCursorFields as V } from "./index181.js";
-import { GetNoRowsOverlay as Y } from "./index161.js";
-import { Dialog as Z } from "./index52.js";
-import { TablePagination as J } from "./index88.js";
-import { classNames as Q } from "./index186.js";
-import { Typography as c, Button as X, Box as ee } from "@mui/material";
-import { DataGrid as ae } from "@mui/x-data-grid";
-const Re = (s) => /* @__PURE__ */ t(K, { children: /* @__PURE__ */ t(te, { ...s }) }), te = ({
-  onRowClick: s,
-  query: u,
-  offers: x
-}) => {
+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 P, PopoverTrigger as b, FilterMenuButton as F, PopoverContent as f, DateRangePicker as D, MultiSelectFilter as N, AmountFilter as M, Input as S, RadioGroup as y, RadioGroupItem as I, 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"
+}, H = [{
+  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 O(e) {
   const {
-    i18n: a
-  } = E(), {
-    locale: b,
-    componentSettings: f
-  } = A(), {
-    startFinanceSession: h
-  } = L(), [F, g] = r(!1), [n, _] = r(null), {
-    data: v
-  } = q(n?.invoice_id ?? "", !!n?.invoice_id), [y, w] = r(void 0), [C, I] = r(f.receivables.pageSizeOptions?.[0] ?? 10), [R, M] = r({
-    field: u?.sort ?? "created_at",
-    sort: u?.order ?? "desc"
-  }), {
-    formatCurrencyToDisplay: l
-  } = B(), {
-    data: d,
-    isLoading: N,
-    isError: O,
-    refetch: T
-  } = H({
-    order: R?.sort,
-    limit: C,
-    pagination_token: y
-  }), m = d?.data, D = (e) => {
-    M(e[0]), w(void 0);
-  }, p = b.dateFormat, S = W(() => [{
-    field: "document_id",
-    headerName: a._("Number"),
-    sortable: !1,
-    width: 140,
-    renderCell: ({
-      value: e
-    }) => e ? /* @__PURE__ */ t("span", { className: "Monite-TextOverflowContainer", children: e }) : /* @__PURE__ */ t("span", { className: "Monite-TextOverflowContainer", children: /* @__PURE__ */ t(c, { color: "text.secondary", component: "span", fontSize: "inherit", children: a._("INV-auto") }) })
-  }, {
-    field: "payer_type",
-    headerName: a._("Customer"),
-    display: "flex",
-    width: j,
-    renderCell: (e) => /* @__PURE__ */ t(c, { children: e.row.payer_type == "BUSINESS" ? e.row.payer_business_name : `${e.row.payer_first_name} ${e.row.payer_last_name}` })
-  }, {
-    field: "status",
-    headerName: a._("Status"),
-    sortable: V.includes("status"),
-    width: 160,
-    renderCell: ({
-      value: e
-    }) => /* @__PURE__ */ t(k, { icon: !0, status: e })
-  }, {
-    field: "total_amount",
-    headerName: a._("Amount due"),
-    headerAlign: "right",
-    align: "right",
-    width: 120,
-    valueGetter: (e, i) => {
-      const o = i.repayment_schedule?.repayment_amount;
-      return o ? l(o, i.currency) : "-";
-    }
-  }, {
-    field: "repayment_schedule",
-    headerName: a._("Loan sum"),
-    headerAlign: "right",
-    align: "right",
-    width: 120,
-    valueGetter: (e, i) => {
-      const o = i.repayment_schedule?.repayment_principal_amount;
-      return o ? l(o, i.currency) : "-";
-    }
-  }, {
-    field: "issue_date",
-    headerName: a._("Financing date"),
-    sortable: !1,
-    width: 140,
-    valueFormatter: (e) => e ? a.date(e, p) : "—"
-  }, {
-    field: "repayment_date",
-    headerName: a._("Repayment date"),
-    sortable: !1,
-    width: 120,
-    valueGetter: (e, i) => {
-      const o = i.repayment_schedule?.repayment_date;
-      return o ? a.date(o, p) : "-";
-    }
-  }, {
-    field: "",
-    headerName: a._("Payment"),
-    sortable: !1,
-    width: 120,
-    renderCell: (e) => e.row.status === "FUNDED" || e.row.status === "LATE" ? /* @__PURE__ */ t(X, { variant: "contained", color: "primary", onClick: (i) => {
-      i.stopPropagation(), h({
-        component: "PAY_NOW"
-      });
-    }, sx: {
-      py: 1.25,
-      px: 1.5,
-      height: 32,
-      fontSize: 14
-    }, children: a._("Repay now") }) : null
-  }], [l, a, p, h]), P = U(
-    m,
-    S,
-    !1,
-    // eslint-disable-next-line lingui/no-unlocalized-strings
-    "FinancedInvoicesTable"
-  );
-  return /* @__PURE__ */ $(ee, { className: Q(G, "Monite-FinancedInvoicesTable"), sx: {
-    display: "flex",
-    flexDirection: "column",
-    overflow: "hidden",
-    height: "inherit",
-    minHeight: "500px"
-  }, children: [
-    /* @__PURE__ */ t(c, { mb: 2, variant: "subtitle1", children: a._("Financed invoices") }),
-    /* @__PURE__ */ t(ae, { apiRef: P, rowSelection: !1, disableColumnFilter: !0, loading: N, onSortModelChange: D, onRowClick: (e) => {
-      g(!0), _?.(e.row);
-    }, slots: {
-      pagination: () => /* @__PURE__ */ t(J, { pageSizeOptions: f.receivables.pageSizeOptions, nextPage: d?.next_pagination_token, prevPage: d?.prev_pagination_token, paginationModel: {
-        pageSize: C,
-        page: y
-      }, onPaginationModelChange: ({
-        page: e,
-        pageSize: i
-      }) => {
-        I(i), w(e ?? void 0);
-      } }),
-      noRowsOverlay: () => /* @__PURE__ */ t(Y, { isLoading: N, dataLength: m?.length || 0, isFiltering: !1, isSearching: !1, isError: O, refetch: T, entityName: a._("Financed Invoices"), actionOptions: [a._("Invoice")], type: "no-data" })
-    }, columns: S, getRowId: (e) => e.document_id, rows: m ?? [] }),
-    v && n && /* @__PURE__ */ t(Z, { open: F, onClose: () => {
-      g(!1), _(null);
-    }, alignDialog: "right", children: /* @__PURE__ */ t(z, { invoice: v, offers: x ?? [], financedInvoice: n, enableNavigate: !0, handleNavigate: s }) })
-  ] });
-};
+    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(P, { open: s, onOpenChange: c, children: [
+    /* @__PURE__ */ a(b, { asChild: !0, children: /* @__PURE__ */ a(F, { activeCount: e.activeFilterCount, onClick: n.toggleMenu }) }),
+    /* @__PURE__ */ o(f, { align: "start", className: `ttw:p-0 ${r}`, children: [
+      n.isMenuOpen && /* @__PURE__ */ a("div", { className: "ttw:p-1", children: H.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(S, { 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") })
+      ] }),
+      n.activePanelId === "attachment" && /* @__PURE__ */ a("div", { className: "ttw:p-3", children: /* @__PURE__ */ a(y, { 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(I, { 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 {
-  Re as FinancedInvoicesTable
+  O as PayablesFilterBar
 };