@tesouro/embedded-components-react 0.2.286 → 0.2.289

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

@@ -1,10 +1,167 @@
-import { CounterpartNameCellById as e } from "./index232.js";
-import "./index329.js";
-import { jsx as t } from "@emotion/react/jsx-runtime";
+import { Scope as e } from "../../shared/data-access/dist/lib/scopes.js";
+import "../../shared/data-access/dist/index.js";
+import { getAPIErrorMessage as t } from "./index26.js";
+import { generatePayablesButtonCssVars as n } from "./index44.js";
+import { useMoniteContext as r } from "./index47.js";
+import { useRootElements as i } from "./index178.js";
+import "./index179.js";
+import { useFileInput as a } from "./index181.js";
+import { useComponentSettings as o } from "./index187.js";
+import "./index189.js";
+import { Dialog as s } from "./index201.js";
+import "./index202.js";
+import { MoniteScopedProviders as c } from "./index209.js";
+import { useUserPermissions as ee } from "./index112.js";
+import { AccessRestriction as l } from "./index237.js";
+import "./index239.js";
+import { usePayableCallbacks as u } from "./index351.js";
+import { PayableDetails as d } from "./index415.js";
+import { PayablesTable as f } from "./index428.js";
+import "./index416.js";
+import "./index429.js";
+import { CreatePayableMenu as p } from "./index431.js";
+import "./index432.js";
+import { useEffect as te, useMemo as ne, useRef as re, useState as m } from "react";
+import { jsx as h, jsxs as g } from "@emotion/react/jsx-runtime";
+import { toast as _ } from "react-hot-toast";
+import { useLingui as v } from "@lingui/react";
 //#region ../../libs/tesouro-embedded-components-react/monite-sdk/dist/index433.js
-var n = ({ counterpartName: n, counterpartId: r }) => n ? /* @__PURE__ */ t("span", { children: n }) : r ? /* @__PURE__ */ t(e, { counterpartId: r }) : /* @__PURE__ */ t("span", {
-	style: { opacity: .4 },
-	children: "-"
-});
+var y = (e) => /* @__PURE__ */ h(c, { children: /* @__PURE__ */ h(b, { ...e }) }), b = ({ pageTitleComponent: c, enableGLCodes: y, initialView: b, initialCounterpartId: x, onSaved: S, onCanceled: C, onSubmitted: w, onRejected: T, onApproved: ie, onReopened: ae, onDeleted: oe, onPay: se }) => {
+	let { i18n: E } = v(), { api: D, queryClient: O, theme: k } = r(), { componentSettings: A } = o(), { handleSaved: j, handleCanceled: M, handleSubmitted: N, handleRejected: P, handleApproved: F, handleReopened: I, handleDeleted: L, handlePay: R } = u({
+		onSaved: S,
+		onCanceled: C,
+		onSubmitted: w,
+		onRejected: T,
+		onApproved: ie,
+		onReopened: ae,
+		onDeleted: oe,
+		onPay: se
+	}), [z, B] = m({
+		invoiceId: void 0,
+		open: !1,
+		shouldOpenEditMode: !1
+	}), V = () => {
+		B((e) => ({
+			...e,
+			open: !1,
+			shouldOpenEditMode: !1,
+			invoiceId: void 0
+		}));
+	}, [ce, H] = m(!1), [U, W] = m(void 0), G = re(!1), K = () => {
+		H(!1), W(void 0);
+	}, { FileInput: le, openFileInput: ue, checkFileError: de } = a(), q = D.finops.postPayablesUploadFromFile.useMutation({}, {
+		onSuccess: () => D.finops.getPayables.invalidateQueries(O),
+		onError: () => {}
+	}), J = (e) => {
+		let n = e instanceof File ? [e] : Array.from(e);
+		if (n.length > 10) {
+			_.error(E._("You can only upload up to {fileCount} files at a time", { fileCount: 10 }));
+			return;
+		}
+		n.forEach((e) => {
+			let n = de(e);
+			if (n) {
+				_.error(n);
+				return;
+			}
+			_.promise(q.mutateAsync({ file: e }), {
+				loading: E._("Uploading {fileName}", { fileName: e.name }),
+				success: E._("Payable {fileName} uploaded successfully", { fileName: e.name }),
+				error: (e) => t(E, e)
+			});
+		});
+	}, Y = ee(), X = Y.has(e.PayableWriteOrg), Z = Y.has(e.PayableReadOrg);
+	te(() => {
+		G.current || b === "create" && X && (G.current = !0, W(x), H(!0));
+	}, [
+		b,
+		X,
+		x
+	]);
+	let { root: Q } = i(), $ = y ?? A?.payables?.enableGLCodes ?? !1, fe = ne(() => n(k.components?.styles?.payables?.button), [k.components?.styles?.payables?.button]);
+	return /* @__PURE__ */ g("div", {
+		className: "Monite-Payables",
+		style: fe,
+		children: [
+			c(/* @__PURE__ */ h(p, {
+				isCreateAllowed: X,
+				onCreateInvoice: () => {
+					W(void 0), H(!0);
+				},
+				handleFileUpload: J
+			})),
+			!Z && /* @__PURE__ */ h(l, {}),
+			Z && /* @__PURE__ */ h(f, {
+				initialCounterpartId: b === "create" ? void 0 : x,
+				onRowClick: (e) => B({
+					open: !0,
+					invoiceId: e
+				}),
+				onPay: R,
+				onApproved: F,
+				onCanceled: M,
+				onSubmitted: N,
+				openFileInput: ue,
+				setIsCreateInvoiceDialogOpen: H,
+				openEditDialog: (e) => B({
+					open: !0,
+					invoiceId: e,
+					shouldOpenEditMode: !0
+				})
+			}),
+			/* @__PURE__ */ h(le, {
+				"aria-label": E._("Upload payable files"),
+				multiple: !0,
+				onChange: (e) => {
+					let t = e.target.files;
+					t && J(t);
+				}
+			}),
+			/* @__PURE__ */ h(s, {
+				className: "Monite-Payables-Header-Dialog-PayableDetails",
+				open: z.open,
+				container: Q,
+				onClose: V,
+				onClosed: V,
+				fullScreen: !0,
+				children: /* @__PURE__ */ h(d, {
+					id: z.invoiceId,
+					shouldOpenInEditMode: z.shouldOpenEditMode,
+					enableGLCodes: $,
+					onClose: V,
+					onSaved: j,
+					onCanceled: M,
+					onSubmitted: N,
+					onRejected: P,
+					onApproved: F,
+					onReopened: I,
+					onDeleted: (e) => {
+						L?.(e), V(), _(E._("Bill #{payableId} has been deleted", { payableId: e }), { duration: 5e3 });
+					},
+					onPay: R
+				})
+			}),
+			/* @__PURE__ */ h(s, {
+				className: "Monite-Payables-Header-Dialog-CreatePayable",
+				open: ce,
+				container: Q,
+				onClose: K,
+				fullScreen: !0,
+				children: /* @__PURE__ */ h(d, {
+					shouldOpenInEditMode: !0,
+					initialCounterpartId: U,
+					enableGLCodes: $,
+					onClose: K,
+					onSaved: (e) => {
+						B({
+							open: !0,
+							invoiceId: e
+						}), K(), j?.(e);
+					}
+				})
+			})
+		]
+	});
+};
 //#endregion
-export { n as InvoicesCounterpartCell };
+export { y as Payables };

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

@@ -1,61 +1,26 @@
-import { Ban as e, CalendarX2 as t, Check as n, ChevronsRight as r, CircleOff as i, ClipboardCheck as a, Clock as o, CopyPlus as s, FileCheck as c, Mail as l, Pause as u, PenTool as d, Pencil as f, Play as p, Send as m, Trash2 as h } from "lucide-react";
-import "@mui/icons-material/PaidOutlined";
-import "@mui/icons-material/BlockOutlined";
-import "@mui/icons-material/Cancel";
-import "@mui/icons-material/DangerousOutlined";
-import "@mui/icons-material/DeleteForever";
-import "@mui/icons-material/CheckOutlined";
-import "@mui/icons-material/ErrorOutlineOutlined";
-import "@mui/icons-material/HourglassBottomOutlined";
-import "@mui/icons-material/InsertDriveFileOutlined";
-import "@mui/icons-material/ReplayOutlined";
-import "@mui/icons-material/SendOutlined";
-import "@mui/icons-material/StarHalfOutlined";
-//#region ../../libs/tesouro-embedded-components-react/monite-sdk/dist/index434.js
-var g = {
-	edit: f,
-	issue: c,
-	issueAndSend: m,
-	recordPayment: a,
-	send: l,
-	clone: s,
-	cancel: e,
-	delete: h,
-	markUncollectible: i,
-	pauseRecurrence: u,
-	resumeRecurrence: p,
-	cancelRecurrence: t
-}, _ = {
-	draft: d,
-	issuing: o,
-	issued: o,
-	partially_paid: o,
-	paid: n,
-	overdue: o,
-	canceled: e
-}, v = {
-	active: r,
-	paused: u,
-	canceled: e,
-	completed: n
-}, y = {
-	default: "ttw:text-foreground",
-	danger: "ttw:text-red-600",
-	success: "ttw:text-emerald-600",
-	muted: "ttw:text-muted-foreground"
-}, b = "ttw:bg-muted ttw:text-muted-foreground ttw:hover:bg-accent", x = [
-	"application/pdf",
-	"image/jpeg",
-	"image/png",
-	"application/msword",
-	"application/vnd.openxmlformats-officedocument.wordprocessingml.document"
-], S = [
-	"pdf",
-	"jpg",
-	"jpeg",
-	"png",
-	"doc",
-	"docx"
-];
-//#endregion
-export { g as ACTION_ICON, S as ATTACHMENT_ACCEPTED_EXTENSIONS, x as ATTACHMENT_ACCEPTED_FORMATS, v as RECURRENCE_STATUS_ICON, _ as STATUS_ICON, y as amountValueToneClass, b as headerIconButtonClass };
+import "./index113.js";
+import "./index349.js";
+import "./index350.js";
+import "./index351.js";
+import "./index352.js";
+import "./index353.js";
+import "./index354.js";
+import "./index355.js";
+import "./index356.js";
+import "./index357.js";
+import "./index358.js";
+import "./index359.js";
+import "./index360.js";
+import "./index361.js";
+import "./index362.js";
+import "./index363.js";
+import "./index364.js";
+import "./index365.js";
+import "./index366.js";
+import "./index367.js";
+import "./index368.js";
+import "./index415.js";
+import "./index428.js";
+import "./index416.js";
+import "./index429.js";
+import "./index433.js";

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

@@ -1,40 +1,10 @@
-import { cn as e } from "./index49.js";
-import { Badge as t } from "./index195.js";
-import { getCommonRecurrenceStatusLabel as n } from "./index210.js";
-import "./index226.js";
-import { RECURRENCE_STATUS_ICON as r } from "./index434.js";
-import { jsx as i, jsxs as a } from "@emotion/react/jsx-runtime";
-import { useLingui as o } from "@lingui/react";
-import { cva as s } from "class-variance-authority";
+import { CounterpartNameCellById as e } from "./index233.js";
+import "./index330.js";
+import { jsx as t } from "@emotion/react/jsx-runtime";
 //#region ../../libs/tesouro-embedded-components-react/monite-sdk/dist/index435.js
-var c = s("", { variants: {
-	variant: {
-		active: "ttw:bg-indigo-100 ttw:text-indigo-700",
-		paused: "ttw:bg-yellow-100 ttw:text-yellow-700",
-		canceled: "ttw:bg-red-100 ttw:text-red-700",
-		completed: "ttw:bg-green-100 ttw:text-green-700"
-	},
-	dotVariant: {
-		active: "ttw:border-indigo-100 ttw:bg-indigo-700",
-		paused: "ttw:border-yellow-100 ttw:bg-yellow-700",
-		canceled: "ttw:border-red-100 ttw:bg-red-700",
-		completed: "ttw:border-green-100 ttw:bg-green-700"
-	}
-} }), l = ({ status: s, className: l, showBadgeBackground: u = !0, showIcon: d = !1, dotSize: f, ref: p }) => {
-	let { i18n: m } = o(), h = r[s];
-	return /* @__PURE__ */ a(t, {
-		ref: p,
-		className: e("ttw:inline-flex ttw:items-center ttw:gap-1", c({ variant: s }), l),
-		dotClassName: c({ dotVariant: s }),
-		showBadgeBackground: u,
-		showDotBorder: !u,
-		dotSize: f,
-		showDot: !1,
-		children: [d && /* @__PURE__ */ i(h, {
-			className: "ttw:size-3",
-			"aria-hidden": !0
-		}), n(m, s)]
-	});
-};
+var n = ({ counterpartName: n, counterpartId: r }) => n ? /* @__PURE__ */ t("span", { children: n }) : r ? /* @__PURE__ */ t(e, { counterpartId: r }) : /* @__PURE__ */ t("span", {
+	style: { opacity: .4 },
+	children: "-"
+});
 //#endregion
-export { l as InvoiceRecurrenceStatusChip };
+export { n as InvoicesCounterpartCell };

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

@@ -1,156 +1,61 @@
-import { AmountFilter as e, DateRangePicker as t, FilterBar as n, FilterMenuButton as r, FilterTag as i, Input as a, MultiSelectFilter as o, Popover as s, PopoverContent as c, PopoverTrigger as l, SearchInput as u, useFilterPanel as d } from "../../../../packages/shared-ui-shadcn/dist/index.js";
-import { ListFilter as f } from "lucide-react";
-import { Fragment as p, jsx as m, jsxs as h } from "@emotion/react/jsx-runtime";
-import { useLingui as g } from "@lingui/react";
+import { Ban as e, CalendarX2 as t, Check as n, ChevronsRight as r, CircleOff as i, ClipboardCheck as a, Clock as o, CopyPlus as s, FileCheck as c, Mail as l, Pause as u, PenTool as d, Pencil as f, Play as p, Send as m, Trash2 as h } from "lucide-react";
+import "@mui/icons-material/PaidOutlined";
+import "@mui/icons-material/BlockOutlined";
+import "@mui/icons-material/Cancel";
+import "@mui/icons-material/DangerousOutlined";
+import "@mui/icons-material/DeleteForever";
+import "@mui/icons-material/CheckOutlined";
+import "@mui/icons-material/ErrorOutlineOutlined";
+import "@mui/icons-material/HourglassBottomOutlined";
+import "@mui/icons-material/InsertDriveFileOutlined";
+import "@mui/icons-material/ReplayOutlined";
+import "@mui/icons-material/SendOutlined";
+import "@mui/icons-material/StarHalfOutlined";
 //#region ../../libs/tesouro-embedded-components-react/monite-sdk/dist/index436.js
-var _ = {
-	due_date: "Due date",
-	created_at: "Created on",
-	issue_date: "Issue date"
-}, v = [
-	{
-		id: "date_due_date",
-		label: "Due date",
-		field: "due_date"
-	},
-	{
-		id: "date_created_at",
-		label: "Created on",
-		field: "created_at"
-	},
-	{
-		id: "date_issue_date",
-		label: "Issue date",
-		field: "issue_date"
-	},
-	{
-		id: "status",
-		label: "Status",
-		field: void 0
-	},
-	{
-		id: "amount",
-		label: "Amount",
-		field: void 0
-	},
-	{
-		id: "customer",
-		label: "Customer",
-		field: void 0
-	}
-], y = {
-	date_due_date: "ttw:w-auto",
-	date_created_at: "ttw:w-auto",
-	date_issue_date: "ttw:w-auto",
-	status: "ttw:w-56",
-	amount: "ttw:w-64",
-	customer: "ttw:w-64"
-};
-function b(b) {
-	let { i18n: x } = g(), S = d(), C = S.isMenuOpen || !!S.activePanelId, w = S.activePanelId && y[S.activePanelId] || "ttw:w-52", T = b.allPresets.map((e) => ({
-		value: e.value,
-		label: e.label,
-		group: e.group
-	})), E = (e) => {
-		e || (S.closeMenu(), S.closePanel());
-	}, D = (e) => {
-		S.openPanel(e);
-	};
-	return /* @__PURE__ */ m(n, {
-		className: "ttw:pl-4",
-		searchSlot: /* @__PURE__ */ m(u, {
-			value: b.searchValue,
-			onChange: (e) => b.onSearchChange(e.target.value),
-			placeholder: "Search by number or customer...",
-			className: "ttw:min-w-64"
-		}),
-		menuSlot: /* @__PURE__ */ h(s, {
-			open: C,
-			onOpenChange: E,
-			children: [/* @__PURE__ */ m(l, {
-				asChild: !0,
-				children: /* @__PURE__ */ m(r, {
-					activeCount: b.activeFilterCount,
-					onClick: S.toggleMenu
-				})
-			}), /* @__PURE__ */ h(c, {
-				align: "start",
-				className: `ttw:p-0 ${w}`,
-				children: [
-					S.isMenuOpen && /* @__PURE__ */ m("div", {
-						className: "ttw:p-1",
-						children: v.map((e) => /* @__PURE__ */ h("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: () => D(e.id),
-							children: [/* @__PURE__ */ m(f, { className: "ttw:size-4 ttw:text-muted-foreground ttw:shrink-0" }), e.label]
-						}, e.id))
-					}),
-					v.filter((e) => e.field !== void 0).map((e) => S.activePanelId === e.id && e.field && /* @__PURE__ */ m(t, {
-						from: b.activeDateFields[e.field]?.from,
-						to: b.activeDateFields[e.field]?.to,
-						onRangeChange: (t) => b.onDateFieldRangeChange(e.field, t),
-						selectedPreset: b.activeDateFields[e.field]?.preset,
-						onPresetChange: (t) => b.onDateFieldPresetChange(e.field, t),
-						presets: T,
-						labels: { fieldLabel: _[e.field] }
-					}, e.id)),
-					S.activePanelId === "status" && /* @__PURE__ */ m(o, {
-						options: b.statusOptions,
-						selectedValues: b.selectedStatus,
-						onSelectionChange: b.onStatusChange
-					}),
-					S.activePanelId === "amount" && /* @__PURE__ */ m(e, {
-						mode: b.amountMode,
-						onModeChange: b.onAmountModeChange,
-						min: b.amountMin,
-						max: b.amountMax,
-						onMinChange: b.onAmountMinChange,
-						onMaxChange: b.onAmountMaxChange,
-						showFlowDirection: !1,
-						labels: {
-							min: "No less than",
-							max: "No more than"
-						}
-					}),
-					S.activePanelId === "customer" && /* @__PURE__ */ h("div", {
-						className: "ttw:p-3 ttw:flex ttw:flex-col ttw:gap-2",
-						children: [
-							/* @__PURE__ */ m("p", {
-								className: "ttw:text-xs ttw:font-medium ttw:text-muted-foreground",
-								children: "Customer name"
-							}),
-							/* @__PURE__ */ m(a, {
-								type: "text",
-								value: b.customerName,
-								onChange: (e) => b.onCustomerNameChange(e.target.value),
-								placeholder: "Search customers...",
-								className: "ttw:h-8 ttw:text-xs"
-							}),
-							/* @__PURE__ */ m("p", {
-								className: "ttw:text-xs ttw:text-muted-foreground",
-								children: x._("Matches names containing your search")
-							})
-						]
-					})
-				]
-			})]
-		}),
-		activeChipsSlot: /* @__PURE__ */ h(p, { children: [b.activeChips.map((e) => /* @__PURE__ */ m(i, {
-			label: e.label,
-			count: e.count,
-			variant: "default",
-			onLabelClick: e.key === "date" ? () => {
-				S.openPanel("date");
-			} : void 0,
-			onDismiss: () => b.onDismissChip(e.key)
-		}, e.key)), b.activeFilterCount > 0 && /* @__PURE__ */ m("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: b.onClearAll,
-			children: "Clear all"
-		})] })
-	});
-}
+var g = {
+	edit: f,
+	issue: c,
+	issueAndSend: m,
+	recordPayment: a,
+	send: l,
+	clone: s,
+	cancel: e,
+	delete: h,
+	markUncollectible: i,
+	pauseRecurrence: u,
+	resumeRecurrence: p,
+	cancelRecurrence: t
+}, _ = {
+	draft: d,
+	issuing: o,
+	issued: o,
+	partially_paid: o,
+	paid: n,
+	overdue: o,
+	canceled: e
+}, v = {
+	active: r,
+	paused: u,
+	canceled: e,
+	completed: n
+}, y = {
+	default: "ttw:text-foreground",
+	danger: "ttw:text-red-600",
+	success: "ttw:text-emerald-600",
+	muted: "ttw:text-muted-foreground"
+}, b = "ttw:bg-muted ttw:text-muted-foreground ttw:hover:bg-accent", x = [
+	"application/pdf",
+	"image/jpeg",
+	"image/png",
+	"application/msword",
+	"application/vnd.openxmlformats-officedocument.wordprocessingml.document"
+], S = [
+	"pdf",
+	"jpg",
+	"jpeg",
+	"png",
+	"doc",
+	"docx"
+];
 //#endregion
-export { b as InvoicesFilterBar };
+export { g as ACTION_ICON, S as ATTACHMENT_ACCEPTED_EXTENSIONS, x as ATTACHMENT_ACCEPTED_FORMATS, v as RECURRENCE_STATUS_ICON, _ as STATUS_ICON, y as amountValueToneClass, b as headerIconButtonClass };

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

@@ -1,71 +1,40 @@
-import { useCurrencies as e } from "./index63.js";
-import { Skeleton as t } from "./index54.js";
-import { useGetReceivablesAnalytics as n } from "./index170.js";
-import { InvoiceStatusChip as r } from "./index227.js";
-import { StatusCard as i } from "./index417.js";
-import { useMemo as a } from "react";
-import { jsx as o, jsxs as s } from "@emotion/react/jsx-runtime";
-import { useLingui as c } from "@lingui/react";
+import { cn as e } from "./index49.js";
+import { Badge as t } from "./index195.js";
+import { getCommonRecurrenceStatusLabel as n } from "./index210.js";
+import "./index227.js";
+import { RECURRENCE_STATUS_ICON as r } from "./index436.js";
+import { jsx as i, jsxs as a } from "@emotion/react/jsx-runtime";
+import { useLingui as o } from "@lingui/react";
+import { cva as s } from "class-variance-authority";
 //#region ../../libs/tesouro-embedded-components-react/monite-sdk/dist/index437.js
-var l = [
-	"draft",
-	"issued",
-	"overdue",
-	"partially_paid",
-	"paid",
-	"recurring",
-	"canceled",
-	"uncollectible"
-], u = ({ selectedStatus: u, onChangeFilter: d }) => {
-	let { i18n: f } = c(), { formatCurrencyToDisplay: p } = e(), { data: m, isLoading: h } = n({
-		dimension: "status",
-		metric: "id",
-		aggregation_function: "count",
-		type: "invoice"
-	}), { data: g, isLoading: _ } = n({
-		dimension: "status",
-		metric: "total_amount",
-		aggregation_function: "summary",
-		type: "invoice"
-	}), v = a(() => m?.data?.reduce((e, t) => {
-		let n = t.dimension_value, r = t.metric_value;
-		return n && (e.statuses.push({
-			status: n,
-			count: r
-		}), n !== "recurring" && (e.totalCount += r)), e;
-	}, {
-		statuses: [],
-		totalCount: 0
-	}), [m]) ?? {
-		statuses: [],
-		totalCount: 0
-	}, y = a(() => new Map(g?.data?.map((e) => [e.dimension_value, e.metric_value]) ?? []), [g]);
-	if (h || _) return /* @__PURE__ */ o("div", {
-		className: "ttw:flex ttw:gap-2",
-		children: Array.from({ length: 6 }).map((e, n) => /* @__PURE__ */ o(t, { className: "ttw:h-16.5 ttw:w-42 ttw:rounded-xl ttw:animate-pulse" }, n))
-	});
-	let b = (e) => {
-		d(e === "all" ? void 0 : e);
-	}, x = (e) => p(e, "USD") ?? "—";
-	return /* @__PURE__ */ s("div", {
-		className: "ttw:flex ttw:gap-2 ttw:mb-6 ttw:overflow-x-auto ttw:[scrollbar-width:none] ttw:[&::-webkit-scrollbar]:hidden",
-		children: [/* @__PURE__ */ o(i, {
-			isAllStatus: !0,
-			data: v.totalCount,
-			selected: u === null,
-			onClick: () => b("all"),
-			formatAmount: x,
-			allItemsText: f._("All invoices")
-		}), [...v.statuses].sort((e, t) => (l.indexOf(e.status) + 1 || Infinity) - (l.indexOf(t.status) + 1 || Infinity)).map((e) => /* @__PURE__ */ o(i, {
-			isAllStatus: !1,
-			data: y.get(e.status) ?? 0,
-			amountOfItems: e.count,
-			selected: u === e.status,
-			onClick: () => b(e.status),
-			formatAmount: x,
-			statusChip: /* @__PURE__ */ o(r, { status: e.status })
-		}, e.status))]
+var c = s("", { variants: {
+	variant: {
+		active: "ttw:bg-indigo-100 ttw:text-indigo-700",
+		paused: "ttw:bg-yellow-100 ttw:text-yellow-700",
+		canceled: "ttw:bg-red-100 ttw:text-red-700",
+		completed: "ttw:bg-green-100 ttw:text-green-700"
+	},
+	dotVariant: {
+		active: "ttw:border-indigo-100 ttw:bg-indigo-700",
+		paused: "ttw:border-yellow-100 ttw:bg-yellow-700",
+		canceled: "ttw:border-red-100 ttw:bg-red-700",
+		completed: "ttw:border-green-100 ttw:bg-green-700"
+	}
+} }), l = ({ status: s, className: l, showBadgeBackground: u = !0, showIcon: d = !1, dotSize: f, ref: p }) => {
+	let { i18n: m } = o(), h = r[s];
+	return /* @__PURE__ */ a(t, {
+		ref: p,
+		className: e("ttw:inline-flex ttw:items-center ttw:gap-1", c({ variant: s }), l),
+		dotClassName: c({ dotVariant: s }),
+		showBadgeBackground: u,
+		showDotBorder: !u,
+		dotSize: f,
+		showDot: !1,
+		children: [d && /* @__PURE__ */ i(h, {
+			className: "ttw:size-3",
+			"aria-hidden": !0
+		}), n(m, s)]
 	});
 };
 //#endregion
-export { u as InvoiceStatusCardsFilter };
+export { l as InvoiceRecurrenceStatusChip };